:root {
    --neon-green: #39ff14;
    --neon-pink: #ff007f;
    --neon-cyan: #00f0ff;
    --crt-bg: #020604;
    --text-shield: 2px 2px 0px #000, -2px -2px 0px #000, 2px -2px 0px #000, -2px 2px 0px #000, 0px 4px 8px rgba(0,0,0,1);
}

html, body {
    background-color: #050508 !important;
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
    height: 100% !important;
    overflow: hidden !important;
    box-sizing: border-box;
}

*, *::before, *::after {
    box-sizing: inherit;
}

.screen-wrapper {
    width: 100vw;
    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #050508;
    padding: 20px;
}

.arcade-cabinet {
    background: #1a1a24;
    border: 24px solid #2d2d38; 
    border-radius: 40px;
    box-shadow: 0 30px 80px rgba(0,0,0,0.95), inset 0 0 30px rgba(0,0,0,0.85);
    padding: 16px;
    width: 95vw;
    max-width: 1560px;      
    height: 90vh;           
    max-height: 920px;
    position: relative;
}

.crt-screen {
    background-color: var(--crt-bg);
    width: 100%;
    height: 100%;
    border-radius: 18px;
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 32px;
    box-shadow: inset 0 0 120px rgba(0,0,0,1);
    
    /* NEW: Applies the power-on stretch */
    animation: crtTurnOn 0.5s cubic-bezier(0.23, 1, 0.32, 1) forwards;
    transform-origin: center center;
}

.crt-screen::before {
    content: " ";
    display: block;
    position: absolute;
    top: 0; left: 0; bottom: 0; right: 0;
    background: linear-gradient(rgba(18, 16, 16, 0) 50%, rgba(0, 0, 0, 0.4) 50%);
    z-index: 10;
    background-size: 100% 4px;
    pointer-events: none;
}

#battleCanvas {
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    width: 100% !important;
    height: 100% !important;
    z-index: 1;
    pointer-events: none;
}

.ui-layer {
    position: relative;
    z-index: 2;
    pointer-events: auto;
    width: 100%;
}

.hud {
    display: flex;
    justify-content: space-between;
    font-size: 16px; 
    color: var(--neon-cyan);
    text-shadow: var(--text-shield);
    font-family: 'Press Start 2P', monospace;
    font-weight: bold;
}
.hud span { color: #fff; text-shadow: var(--text-shield); }

.menu-focal-zone {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    flex-grow: 1;
    gap: 35px; 
    width: 100%;
}

.title-container { text-align: center; margin-top: 10px; }

.arcade-tag.flash-title {
    font-size: 20px;
    font-weight: bold;
    letter-spacing: 4px;
    margin-bottom: 16px;
    font-family: 'Press Start 2P', monospace;
    animation: neonGlowPulse 1.2s infinite alternate;
}

@keyframes neonGlowPulse {
    0% { color: #ffea00; text-shadow: 2px 2px 0 #000, -2px -2px 0 #000, 0 0 10px #ff7700; }
    50% { color: #00f0ff; text-shadow: 2px 2px 0 #000, -2px -2px 0 #000, 0 0 15px #0077ff; }
    100% { color: #ff007f; text-shadow: 2px 2px 0 #000, -2px -2px 0 #000, 0 0 12px #ff0055; }
}

.main-title {
    font-size: 54px;
    background: linear-gradient(to bottom, #ffffff 0%, #ffea00 40%, #ff2200 100%) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    filter: drop-shadow(0px 3px 0px #000) drop-shadow(0px -3px 0px #000) drop-shadow(3px 0px 0px #000) drop-shadow(-3px 0px 0px #000) drop-shadow(0 0 12px rgba(255,0,0,0.6));
    margin-bottom: 8px;
    font-family: 'Press Start 2P', monospace;
    font-weight: bold;
}

.bot-title {
    color: var(--neon-pink);
    font-size: 36px;
    text-shadow: var(--text-shield), 0 0 8px var(--neon-pink);
    font-family: 'Press Start 2P', monospace;
    margin-bottom: 16px;
    font-weight: bold;
}

.slogan-text {
    font-family: 'VT323', monospace;
    font-size: 34px; 
    font-weight: bold;
    color: #ffffff;
    text-shadow: var(--text-shield), 0 0 12px rgba(0, 240, 255, 0.9);
    letter-spacing: 2px;
    margin-top: 6px;
}

.menu-container {
    max-width: 720px;
    width: 100%;
    margin: 0 auto;
    border: 3px solid var(--neon-green);
    background: #040d05; 
    padding: 24px;
    box-shadow: 0 0 30px rgba(57, 255, 20, 0.45), inset 0 0 15px rgba(0,0,0,1);
    border-radius: 8px;
    align-self: center;
}

.menu-list { list-style: none; display: flex; flex-direction: column; gap: 14px; }
.menu-item { display: flex; align-items: center; padding: 12px; cursor: pointer; border-radius: 4px; background: rgba(0, 0, 0, 0.4); }
.menu-item .pointer { visibility: hidden; color: var(--neon-cyan); margin-right: 12px; font-family: 'Press Start 2P', monospace; text-shadow: var(--text-shield); }
.menu-item-text { font-size: 16px; color: #fff; font-family: 'Press Start 2P', monospace; text-shadow: var(--text-shield); font-weight: bold; }
.menu-item-desc { font-family: 'VT323', monospace; font-size: 26px; color: var(--neon-green); text-shadow: var(--text-shield); margin-left: auto; font-weight: bold; }

.menu-item:hover, .menu-item.active { background: rgba(57, 255, 20, 0.15); border: 1px solid rgba(57, 255, 20, 0.3); }
.menu-item:hover .pointer, .menu-item.active .pointer { visibility: visible; }
.menu-item:hover .menu-item-text, .menu-item.active .menu-item-text { color: var(--neon-cyan); text-shadow: var(--text-shield), 0 0 8px var(--neon-cyan); }
.menu-item:hover .menu-item-desc, .menu-item.active .menu-item-desc { color: #ffffff; text-shadow: var(--text-shield), 0 0 8px var(--neon-green); }

.screen-footer { display: flex; justify-content: space-between; font-size: 13px; color: #cbdacf; font-family: 'Press Start 2P', monospace; font-weight: bold; }
.system-status { text-shadow: var(--text-shield); color: #a0a0a0; }
.footer-email-link { color: var(--neon-pink); text-shadow: var(--text-shield), 0 0 4px var(--neon-pink); text-decoration: none; cursor: pointer; }
.footer-email-link:hover { color: #ffffff; text-shadow: var(--text-shield), 0 0 14px var(--neon-pink); }

/* Isolation Layers */
.spa-layer { display: none; flex-direction: column; justify-content: space-between; height: 100%; width: 100%; }
.spa-layer.active-layer { display: flex !important; }

#configInterface.shield-layer, #paymentInterface.shield-layer {
    background-color: #000000 !important;
    background: #000000 !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    padding: 32px !important;
    z-index: 9999 !important; 
    box-sizing: border-box !important;
}

#configInterface *, #configInterface *::before, #configInterface *::after,
#paymentInterface *, #paymentInterface *::before, #paymentInterface *::after {
    text-shadow: none !important;
    filter: none !important;
    -webkit-text-fill-color: initial !important;
    background-image: none !important;
}

.config-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 2px solid #222222;
    padding-bottom: 16px;
    margin-bottom: 24px;
    position: relative;
}

.config-main-title {
    font-family: Arial, Helvetica, sans-serif !important;
    font-size: 24px !important;
    font-weight: 900 !important;
    color: #00f0ff !important;
    margin: 0 !important;
    letter-spacing: 0.5px !important;
    flex-shrink: 0;
}

/* Header Runway */
.header-runway-wrapper {
    flex-grow: 1;
    height: 48px;
    margin: 0 20px;
    position: relative;
    background: #08080c;
    border: 1px dashed #222233;
    border-radius: 4px;
    overflow: hidden;
}

#headerChaseCanvas { position: absolute; top: 0; left: 0; width: 100% !important; height: 100% !important; }

.config-grid { 
    display: grid;
    grid-template-columns: repeat(4, 1fr); 
    gap: 24px; 
    flex-grow: 1; 
    margin-bottom: 20px;
}

.config-card {
    background: #111111 !important;
    border: 2px solid #333333 !important;
    border-radius: 8px !important;
    padding: 24px !important;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.config-section-heading {
    font-family: Arial, Helvetica, sans-serif !important;
    font-size: 16px !important;
    font-weight: bold !important;
    color: #ffd700 !important; 
    margin: 0 0 4px 0 !important;
    letter-spacing: 0.5px !important;
}

.form-group { display: flex; flex-direction: column; gap: 8px; }
.row-spacing { margin-top: 4px; }

.flat-label { font-family: Arial, Helvetica, sans-serif !important; font-size: 13px !important; font-weight: bold !important; color: #00ff66 !important; letter-spacing: 0.5px !important; }
.intel-text { font-family: Arial, Helvetica, sans-serif !important; font-size: 13px !important; color: #cccccc !important; line-height: 1.8; }

.flat-vector-icon { width: 48px; height: 48px; display: block; color: #888888; transition: color 0.2s ease; }

.flat-dropzone {
    border: 2px dashed #444444; border-radius: 6px; padding: 16px 12px;
    text-align: center; background: #161616; cursor: pointer;
    display: flex; flex-direction: column; align-items: center; gap: 10px;
}
.flat-dropzone input[type="file"] { display: none; }
.flat-dropzone:hover { border-color: #00f0ff; background: #1a2426; }
.flat-dropzone:hover .flat-vector-icon { color: #00f0ff; }

.svg-clapboard, .svg-script { width: 100%; height: 100%; }
.svg-clapboard .clap-top { transform-origin: 2px 9px; transition: transform 0.15s cubic-bezier(0.25, 1, 0.2, 1.1); }
.group-clapboard:hover .svg-clapboard .clap-top { transform: rotate(11deg) translate(2px, -3px); color: #ff007f !important; }
.svg-script .script-page { transform-origin: bottom center; }
.group-script:hover .svg-script { animation: textFlutterCycle 0.35s infinite alternate ease-in-out; }

@keyframes textFlutterCycle {
    0% { transform: skewX(0deg) scaleY(1); }
    50% { transform: skewX(-3deg) scaleY(0.97) skewY(1deg); }
    100% { transform: skewX(4deg) scaleY(1.02); }
}

.flat-dropzone-text { font-family: Arial, Helvetica, sans-serif !important; font-size: 13px !important; font-weight: bold !important; color: #ffffff !important; line-height: 1.4 !important; }
.estimator-input-group { display: flex; flex-direction: column; gap: 8px; margin-bottom: 4px; }

.flat-numeric-input {
    background: #000000 !important;
    border: 2px solid #00ff66 !important; color: #ffffff !important;
    font-family: Arial, Helvetica, sans-serif !important; font-size: 18px !important; font-weight: bold !important;
    padding: 10px 14px !important; border-radius: 6px !important; outline: none !important; width: 100% !important; box-sizing: border-box !important;
}
.flat-numeric-input:focus { border-color: #00f0ff !important; }

.estimator-summary-box { background: #1c1c1c !important; border: 2px dashed #444444 !important; border-radius: 6px !important; padding: 14px !important; margin-top: auto; }
.summary-line { display: flex; justify-content: space-between; align-items: center; }
.summary-label { font-family: Arial, Helvetica, sans-serif !important; font-size: 12px !important; font-weight: bold !important; color: #aaaaaa !important; }
.summary-value { font-family: Arial, Helvetica, sans-serif !important; font-size: 24px !important; font-weight: 900 !important; color: #39ff14 !important; }

.flat-select-dropdown {
    background: #000000 !important; border: 2px solid #555555 !important; color: #ffffff !important;
    font-family: Arial, Helvetica, sans-serif !important; font-size: 15px !important; font-weight: bold !important;
    padding: 12px !important; border-radius: 6px !important; outline: none !important; cursor: pointer !important; width: 100% !important;
}
.flat-select-dropdown:focus { border-color: #00f0ff !important; }

.flat-checkbox-block { background: #000000; border: 2px solid #222222; border-radius: 6px; padding: 12px; display: flex; flex-direction: column; gap: 12px; }
.flat-check-row { display: flex; align-items: flex-start; gap: 10px; cursor: pointer; }
.flat-check-row input[type="checkbox"] { transform: scale(1.2); cursor: pointer; margin-top: 2px; }
.flat-check-text { font-family: Arial, Helvetica, sans-serif !important; font-size: 14px !important; color: #cccccc !important; }
.flat-check-row input:checked ~ .flat-check-text { color: #ffffff !important; font-weight: bold !important; }

.flat-table { width: 100%; border-collapse: collapse; }
.flat-th { font-family: Arial, Helvetica, sans-serif !important; font-size: 12px !important; font-weight: bold !important; color: #888888 !important; border-bottom: 2px solid #333333; padding-bottom: 8px; text-align: left; }
.flat-td { padding: 14px 0; border-bottom: 1px solid #222222; vertical-align: middle; }
.flat-radio-row { display: inline-flex; align-items: center; gap: 8px; font-family: Arial, Helvetica, sans-serif !important; font-size: 14px !important; font-weight: bold !important; color: #ffffff !important; cursor: pointer; }
.flat-radio-row input[type="radio"] { transform: scale(1.2); cursor: pointer; }

.txt-white { font-family: Arial, Helvetica, sans-serif !important; font-size: 14px !important; color: #ffffff !important; font-weight: bold !important; }
.txt-cyan { font-family: Arial, Helvetica, sans-serif !important; font-size: 14px !important; color: #00f0ff !important; font-weight: 900 !important; }
.txt-pink { font-family: Arial, Helvetica, sans-serif !important; font-size: 14px !important; color: #ff007f !important; font-weight: 900 !important; }

.override-btn-pink { background: #000000 !important; border: 2px solid #ff007f !important; color: #ff007f !important; font-family: Arial, Helvetica, sans-serif !important; font-size: 14px !important; font-weight: bold !important; padding: 8px 16px !important; border-radius: 4px !important; cursor: pointer !important; flex-shrink: 0; }
.override-btn-pink:hover { background: #ff007f !important; color: #000000 !important; }
.override-btn-green { background: #000000 !important; border: 2px solid #39ff14 !important; color: #39ff14 !important; font-family: Arial, Helvetica, sans-serif !important; font-size: 15px !important; font-weight: bold !important; padding: 14px !important; border-radius: 6px !important; cursor: pointer !important; margin-top: 14px !important; width: 100% !important; letter-spacing: 0.5px !important; }
.override-btn-green:hover { background: #39ff14 !important; color: #000000 !important; }

/* ========================================================
   PAYMENT LAYER STYLES 
   ======================================================== */
.payment-focal-zone { display: flex; flex-direction: column; justify-content: flex-start; align-items: center; flex-grow: 1; width: 100%; padding-top: 40px; padding-bottom: 60px; overflow-y: auto; position: relative; }

.credits-required-title { font-size: 54px; font-family: 'Press Start 2P', monospace; font-weight: bold; text-align: center; margin-bottom: 8px; animation: criticalFlash 1.5s infinite linear; }

@keyframes criticalFlash {
    0%, 100% { color: #ff0000; text-shadow: 4px 4px 0 #000, 0 0 20px #ff0000; }
    20% { color: #00f0ff; text-shadow: 4px 4px 0 #000, 0 0 20px #00f0ff; }
    40% { color: #39ff14; text-shadow: 4px 4px 0 #000, 0 0 20px #39ff14; }
    60% { color: #ffea00; text-shadow: 4px 4px 0 #000, 0 0 20px #ffea00; }
    80% { color: #ff007f; text-shadow: 4px 4px 0 #000, 0 0 20px #ff007f; }
}

.payment-grid { display: flex; flex-wrap: wrap; justify-content: center; align-items: flex-start; gap: 30px; width: 100%; max-width: 900px; padding-top: 20px; }

@keyframes hoverFloat {
    0%, 100% { transform: translateY(var(--stagger)); }
    50% { transform: translateY(calc(var(--stagger) - 8px)); }
}

.payment-card { background: #111111 !important; border: 3px solid #333333 !important; border-radius: 8px !important; padding: 32px !important; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 16px; cursor: pointer; position: relative; flex: 1 1 calc(25% - 30px); min-width: 160px; animation: hoverFloat 3.5s ease-in-out infinite; transition: border-color 0.3s, background 0.3s, box-shadow 0.3s; }
.payment-card:nth-child(even) { --stagger: 30px; animation-delay: -1.75s; }
.payment-card:nth-child(odd) { --stagger: 0px; animation-delay: 0s; }
.payment-card:hover { animation: none; border-color: var(--neon-cyan) !important; background: #1a2426 !important; box-shadow: 0 0 25px rgba(0, 240, 255, 0.6); transform: translateY(calc(var(--stagger) - 10px)) scale(1.05); z-index: 5; }

.pixel-coin-container { position: absolute; top: 0; left: 50%; transform: translateX(-50%); opacity: 0; pointer-events: none; z-index: 10; }
.pixel-coin { width: 48px; height: 48px; image-rendering: pixelated; }
.payment-card:hover .pixel-coin-container { animation: popCoin 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards; }

@keyframes popCoin {
    0% { opacity: 0; transform: translate(-50%, 0) scale(0.5); }
    30% { opacity: 1; transform: translate(-50%, -40px) scale(1.2); }
    100% { opacity: 0; transform: translate(-50%, -80px) scale(1); }
}

.payment-card:hover .retro-logo { filter: drop-shadow(0 0 8px var(--neon-cyan)); transform: scale(1.1); }
.retro-logo { width: 64px; height: 64px; display: block; color: #ffffff; transition: all 0.2s ease; }
.payment-name { font-family: 'Press Start 2P', monospace !important; font-size: 16px !important; color: #ffffff !important; text-align: center; }
.payment-card:hover .payment-name { color: var(--neon-cyan) !important; }

.cc-form-container { display: none; width: 100%; max-width: 600px; background: #111111; border: 2px dashed #444444; border-radius: 8px; padding: 32px; margin-top: 60px; box-shadow: inset 0 0 15px rgba(0,0,0,1); opacity: 0; transform: translateY(20px); }
.cc-form-container.active { display: block; animation: slideUpFade 0.4s ease forwards; }

/* Moved to LEFT and made THINNER */
.premium-inst-form { 
    display: none; position: absolute; top: 20px;
    left: 10px; width: 210px; height: 480px; 
    margin: 0; flex-direction: column; z-index: 20; opacity: 1; transform: none; animation: none; padding: 24px;
}
.premium-inst-form .form-group { flex-grow: 1; display: flex; flex-direction: column; }
.premium-inst-form textarea { flex-grow: 1; height: 100% !important; }

@keyframes slideUpFade { to { opacity: 1; transform: translateY(0); } }

.form-group-row { display: flex; gap: 16px; margin-top: 16px; }
.form-group-row > .form-group { flex: 1; }
.cc-input { background: #000000 !important; color: #39ff14 !important; letter-spacing: 2px !important; }

/* Bot Graveyard & EXTREME EXAGGERATED Animations */
.bot-graveyard { position: relative; width: 320px; height: 120px; margin-top: 70px; pointer-events: none; }
.dead-bot { position: absolute; bottom: 0; width: 64px; height: 64px; }

/* Bot placements grouped together into a bigger pile */
.dead-bot.bot-1 { left: 40px; transform: rotate(-20deg); z-index: 1; }
.dead-bot.bot-2 { left: 90px; bottom: -10px; transform: rotate(15deg); z-index: 2; }
.dead-bot.bot-3 { left: 140px; transform: rotate(-5deg); z-index: 1; }
.dead-bot.bot-4 { left: 190px; bottom: -5px; transform: rotate(35deg); z-index: 3; }
.dead-bot.bot-5 { left: 60px; bottom: 25px; transform: rotate(110deg); z-index: 4; filter: brightness(0.6); }
.dead-bot.bot-6 { left: 120px; bottom: 20px; transform: rotate(-65deg); z-index: 5; filter: brightness(0.7); }
.dead-bot.bot-7 { left: 160px; bottom: 35px; transform: rotate(160deg); z-index: 2; filter: brightness(0.5); }
.dead-bot.bot-8 { left: 210px; bottom: 15px; transform: rotate(85deg); z-index: 4; filter: brightness(0.8); }

@keyframes botJitter {
    0%, 85% { transform: translate(0, 0) rotate(0deg); }
    87% { transform: translate(-6px, 4px) rotate(-8deg); }
    89% { transform: translate(6px, -4px) rotate(8deg); }
    91% { transform: translate(-4px, -6px) rotate(-5deg); }
    93% { transform: translate(4px, 6px) rotate(5deg); }
    95%, 100% { transform: translate(0, 0) rotate(0deg); }
}

.dead-bot-svg { width: 100%; height: 100%; filter: drop-shadow(2px 4px 6px rgba(0,0,0,0.8)); transform-origin: center; animation: botJitter 4s infinite linear; }

/* Sharp Electrical Zaps */
.zap, .zap::after {
    position: absolute; top: 50%; left: 50%;
    width: 2px; height: 26px;
    background: #fff;
    box-shadow: 0 0 8px #00f0ff, 0 0 15px #00f0ff;
    opacity: 0; transform-origin: center; z-index: 20;
}
.zap { animation: electricZap 1.5s infinite; }
.zap::after { content: ''; width: 26px; height: 2px; animation: electricZapAlt 1.8s infinite; }

@keyframes electricZap {
    0%, 88% { opacity: 0; transform: translate(-50%, -50%) rotate(0deg) scale(0.5); }
    89% { opacity: 1; transform: translate(-40%, -60%) rotate(45deg) scale(1.5); }
    90% { opacity: 0; }
    92% { opacity: 1; transform: translate(-60%, -40%) rotate(-30deg) scale(2); }
    94%, 100% { opacity: 0; }
}

@keyframes electricZapAlt {
    0%, 82% { opacity: 0; transform: translate(-50%, -50%) rotate(0deg) scale(0.5); }
    83% { opacity: 1; transform: translate(-60%, -40%) rotate(-45deg) scale(1.8); }
    84% { opacity: 0; }
    86% { opacity: 1; transform: translate(-40%, -60%) rotate(30deg) scale(1.2); }
    88%, 100% { opacity: 0; }
}

/* Round Colorful Bursts */
.sparks, .sparks::after { position: absolute; top: 50%; left: 50%; width: 4px; height: 4px; border-radius: 50%; background: transparent; z-index: 15; }
.sparks { animation: sparkPop 2.5s infinite cubic-bezier(0.1, 0.8, 0.3, 1); }
.sparks::after { content: ''; animation: sparkPopAlt 3.2s infinite cubic-bezier(0.1, 0.8, 0.3, 1); animation-delay: 0.5s; }

@keyframes sparkPop {
    0%, 80% { opacity: 0; box-shadow: 0 0 0 0 transparent; }
    82% { opacity: 1; box-shadow: -20px -40px 4px 4px #00f0ff, 30px -30px 6px 6px #39ff14, 10px -70px 4px 4px #ffea00, -50px -20px 6px 4px #ff007f; }
    87% { opacity: 1; box-shadow: -80px -120px 10px 4px #00f0ff, 130px -80px 10px 4px #39ff14, 40px -180px 10px 4px #ffea00, -140px -60px 12px 4px #ff007f; }
    92% { opacity: 0; box-shadow: -100px -80px 12px -2px #00f0ff, 150px -40px 12px -2px #39ff14, 50px -140px 12px -2px #ffea00, -160px -20px 14px -2px #ff007f; }
    95%, 100% { opacity: 0; box-shadow: 0 0 0 0 transparent; }
}

@keyframes sparkPopAlt {
    0%, 80% { opacity: 0; box-shadow: 0 0 0 0 transparent; }
    82% { opacity: 1; box-shadow: 40px -40px 4px 4px #ff007f, -30px -30px 6px 6px #00f0ff, -10px -70px 4px 4px #39ff14, 50px -20px 6px 4px #ffea00; }
    87% { opacity: 1; box-shadow: 100px -100px 10px 4px #ff007f, -90px -60px 10px 4px #00f0ff, -30px -160px 10px 4px #39ff14, 120px -40px 12px 4px #ffea00; }
    92% { opacity: 0; box-shadow: 120px -60px 12px -2px #ff007f, -110px -30px 12px -2px #00f0ff, -40px -120px 12px -2px #39ff14, 140px -10px 14px -2px #ffea00; }
    95%, 100% { opacity: 0; box-shadow: 0 0 0 0 transparent; }
}

.bot-1 .dead-bot-svg { animation-delay: 0.3s; } .bot-1 .sparks { animation-delay: 0.1s; } .bot-1 .zap { animation-delay: 0.2s; }
.bot-2 .dead-bot-svg { animation-delay: 1.8s; } .bot-2 .sparks { animation-delay: 1.4s; } .bot-2 .zap { animation-delay: 1.5s; }
.bot-3 .dead-bot-svg { animation-delay: 0.9s; } .bot-3 .sparks { animation-delay: 0.7s; } .bot-3 .zap { animation-delay: 0.8s; }
.bot-4 .dead-bot-svg { animation-delay: 2.5s; } .bot-4 .sparks { animation-delay: 2.1s; } .bot-4 .zap { animation-delay: 2.3s; }
.bot-5 .dead-bot-svg { animation-delay: 3.2s; } .bot-5 .sparks { animation-delay: 0.4s; } .bot-5 .zap { animation-delay: 0.1s; }
.bot-6 .dead-bot-svg { animation-delay: 1.2s; } .bot-6 .sparks { animation-delay: 2.8s; } .bot-6 .zap { animation-delay: 2.9s; }
.bot-7 .dead-bot-svg { animation-delay: 0.5s; } .bot-7 .sparks { animation-delay: 1.1s; } .bot-7 .zap { animation-delay: 0.9s; }
.bot-8 .dead-bot-svg { animation-delay: 2.1s; } .bot-8 .sparks { animation-delay: 1.9s; } .bot-8 .zap { animation-delay: 1.7s; }

.bot-bubble { position: absolute; top: -30px; left: 50%; transform: translateX(-50%); background: #000; border: 2px solid #ff007f; color: #fff; padding: 6px 10px; font-family: 'Press Start 2P', monospace; font-size: 10px; border-radius: 4px; opacity: 0; transition: opacity 0.2s; white-space: nowrap; z-index: 10; }
.bot-bubble.show { opacity: 1; }

@media (max-width: 1300px) { .premium-inst-form { position: relative; top: auto; left: auto; right: auto; width: 100%; max-width: 800px; height: 250px; margin-bottom: 30px; } }
@media (max-width: 1024px) { .config-grid { grid-template-columns: repeat(2, 1fr) !important; } }
@media (max-width: 768px) {
    .screen-wrapper { padding: 0; }
    .arcade-cabinet { border: none; border-radius: 0; padding: 0; width: 100vw; height: 100vh; max-height: 100%; }
    .crt-screen { border-radius: 0; padding: 16px 12px; }
    .hud { font-size: 12px; }
    .main-title { font-size: 30px; }
    .menu-container { padding: 12px; max-width: 580px; }
    .header-runway-wrapper { display: none; } 
    #configInterface.shield-layer, #paymentInterface.shield-layer { padding: 14px !important; }
    .config-grid { grid-template-columns: 1fr !important; gap: 12px !important; overflow-y: auto !important; max-height: 84% !important; }
    .payment-grid { flex-direction: column; align-items: center; }
    .payment-card { width: 100%; min-width: unset; transform: translateY(0) !important; --stagger: 0px !important; animation: none !important; }
    .premium-inst-form { height: 200px; }
    .bot-graveyard { transform: scale(0.8); margin-top: 30px; }
}

/* ========================================================
   CRT HARDWARE POWER-ON & STATIC DISSOLVE
   ======================================================== */

.static-overlay {
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    /* Generates organic SVG noise without needing an external image file */
    background-image: url('data:image/svg+xml;utf8,<svg viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg"><filter id="noiseFilter"><feTurbulence type="fractalNoise" baseFrequency="0.9" numOctaves="3" stitchTiles="stitch"/></filter><rect width="100%" height="100%" filter="url(%23noiseFilter)"/></svg>');
    opacity: 0.65;
    z-index: 9999;
    pointer-events: none;
    mix-blend-mode: screen;
    animation: staticDissolve 0.7s 0.2s forwards;
}

@keyframes crtTurnOn {
    0% { 
        transform: scale(0.02, 0.005); 
        filter: brightness(10) contrast(5); 
        opacity: 0; 
    }
    20% { 
        transform: scale(0.8, 0.005); 
        filter: brightness(8) contrast(5); 
        opacity: 1; 
    }
    45% { 
        transform: scale(1, 0.01); 
        filter: brightness(5) contrast(3); 
        opacity: 1; 
    }
    75% { 
        transform: scale(1, 1); 
        filter: brightness(2) contrast(1.5); 
        opacity: 1; 
    }
    100% { 
        transform: scale(1, 1); 
        filter: brightness(1) contrast(1); 
        opacity: 1; 
    }
}

@keyframes staticDissolve {
    0% { opacity: 0.65; }
    100% { opacity: 0; visibility: hidden; }
}