/* ALIEN-STATION MOTHERSHIP CORE CSS - v1.3.3 */
/* Documentation: Responsive Mobile Optimization - Fixed Truncation */

@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@400;900&family=Share+Tech+Mono&display=swap');

:root {
    --acid-green: #00ff41;
    --deep-black: #050505;
    --alert-red: #ff0000;
    --glow: 0 0 15px var(--acid-green);
}

/* GLOBAL BIOME SETTINGS */
body {
    background-color: var(--deep-black);
    color: var(--acid-green);
    font-family: 'Share Tech Mono', monospace;
    margin: 0;
    overflow-y: scroll;
    min-height: 100vh;
}

/* SCANLINE VISUAL OVERLAY */
.scanline {
    pointer-events: none !important;
    width: 100%;
    height: 100px;
    z-index: 2000;
    background: linear-gradient(0deg, rgba(0, 0, 0, 0) 0%, rgba(0, 255, 65, 0.1) 50%, rgba(0, 0, 0, 0) 100%);
    position: fixed;
    bottom: 100%;
    animation: scanline 8s linear infinite;
}

@keyframes scanline {
    0% { bottom: 100%; }
    100% { bottom: -100px; }
}

/* STRUCTURAL FRAMEWORK - Adaptive Widths */
.relay-frame { width: 95%; max-width: 800px; margin: 40px auto; position: relative; z-index: 100; }

.header-frame {
    width: 100%; min-height: 200px; display: flex; flex-direction: column;
    justify-content: center; border: 3px solid var(--acid-green);
    padding: 20px 10px; margin-bottom: 40px; text-align: center;
    background: rgba(0, 255, 65, 0.03); box-sizing: border-box; position: relative;
    animation: breathingGlow 5s ease-in-out infinite;
}

@keyframes breathingGlow {
    0%, 100% { box-shadow: 0 0 15px var(--acid-green), inset 0 0 10px var(--acid-green); }
    50% { box-shadow: 0 0 35px var(--acid-green), inset 0 0 20px var(--acid-green); }
}

/* TYPOGRAPHY - Nexus System (Fixed for Mobile Truncation) */
.nexus-title {
    font-family: 'Orbitron', sans-serif !important;
    font-weight: 900 !important;
    text-transform: uppercase;
    text-shadow: 0 0 15px var(--acid-green);
    white-space: nowrap !important;
    font-size: clamp(1.6em, 6.2vw, 4em) !important;
    letter-spacing: clamp(2px, 0.9vw, 10px) !important;
    margin: 0;
    display: block;
}

.sub-title { font-size: 0.8em; opacity: 0.8; letter-spacing: 4px; margin-top: 15px; }

/* UTILITY - Security & Desync Nodes */
.desync-link {
    position: absolute !important;
    bottom: 12px !important;
    right: 15px !important;
    color: rgba(255, 0, 0, 0.4);
    text-decoration: none;
    font-size: 0.6em !important;
    cursor: pointer;
    text-transform: uppercase;
    z-index: 500;
    transition: 0.3s;
}
.desync-link:hover { color: var(--alert-red); text-shadow: 0 0 10px var(--alert-red); }

/* INTERACTION NODES - Neural Feedback */
#selection-zone, .sector-grid { max-width: 480px; margin: 0 auto; }
.identity-btn, .portal-link {
    display: block; width: 100%; padding: 16px; margin: 12px 0;
    background: rgba(0, 255, 65, 0.05); border: 1px solid rgba(0, 255, 65, 0.4);
    color: var(--acid-green); cursor: pointer; font-family: 'Share Tech Mono', monospace;
    font-weight: bold; text-align: center; text-transform: uppercase;
    box-sizing: border-box; transition: all 0.3s ease;
    text-decoration: none;
    position: relative;
    font-size: 0.9em;
}

.portal-link { clip-path: polygon(5% 0%, 100% 0%, 95% 100%, 0% 100%); }

.identity-btn:hover, .portal-link:hover {
    background: rgba(0, 255, 65, 0.2);
    border-color: var(--acid-green);
    color: #fff;
    box-shadow: 0 0 20px var(--acid-green);
    transform: translateY(-2px);
}

/* Mobile-Specific Tweaks */
@media (max-width: 480px) {
    .relay-frame { width: 92%; margin-top: 20px; }
    .header-frame { min-height: 160px; padding: 15px 5px; }
    .sub-title { font-size: 0.7em; letter-spacing: 2px; }
}
