/* =====================================================================
   cyber.css - cyber-glitch accents for the portal's arcade moments.
   Every selector is gated behind body[data-cyber], which Portal.boot
   sets from DATA.flags.cyber (js/data.js). Flip that flag to false and
   this whole file is inert. The pastel base of the portal is untouched;
   only the high-energy surfaces (game boot screen, pop reveal, the
   scoreboard window) pick up the glitch language. The 3-2-1-GO digits
   inside the minigame iframes are styled in their own files, gated by
   the shared.cyberFx tuning knob.
   ===================================================================== */

:root {
    --cyber-vio: #9D5CFF;
    --cyber-cyan: #5CE1E6;
    --cyber-pink: #FF5CA8;
}

/* ---- game sheet boot screen: CRT scanlines + terminal caret -------- */
body[data-cyber] .boot-screen::after {
    content: '';
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: repeating-linear-gradient(to bottom,
        rgba(0, 0, 0, .22) 0px, rgba(0, 0, 0, .22) 1px,
        transparent 1px, transparent 3px);
}
body[data-cyber] .boot-screen .bs-sub::after {
    content: '_';
    color: var(--cyber-cyan);
    animation: cyCaret 1s steps(1) infinite;
}
@keyframes cyCaret { 50% { opacity: 0; } }

/* ---- pop reveal: one short RGB scan flash as the window lands ------- */
body[data-cyber] .pop-overlay::after {
    content: '';
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 5;
    opacity: 0;
    background:
        linear-gradient(to bottom, transparent 30%, rgba(92, 225, 230, .18) 34%, rgba(255, 92, 168, .18) 36%, transparent 40%),
        linear-gradient(to bottom, transparent 62%, rgba(255, 92, 168, .14) 66%, rgba(92, 225, 230, .14) 68%, transparent 72%);
    animation: cyPopFlash .3s steps(3) 1;
}
@keyframes cyPopFlash {
    0% { opacity: 1; transform: translateY(-2%); }
    67% { opacity: .5; transform: translateY(1.5%); }
    100% { opacity: 0; transform: none; }
}

/* ---- scoreboard window: HUD frame accent ----------------------------- */
body[data-cyber] .pop:has(.lb-filter) {
    outline: 1px solid color-mix(in srgb, var(--cyber-vio) 55%, transparent);
    outline-offset: 5px;
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--cyber-cyan) 30%, transparent),
                0 18px 44px rgba(59, 40, 26, .22);
}

/* ---- calm everything under reduced motion ---------------------------- */
@media (prefers-reduced-motion: reduce) {
    body[data-cyber] .boot-screen .bs-sub::after { animation: none; }
    body[data-cyber] .pop-overlay::after { animation: none; opacity: 0; }
}
