:root{--scene-ink:#0d1714;--scene-paper:#f3f0e6;--scene-acid:#d9ff5a;--scene-blue:#245eea;--scene-orange:#ff7b34;--scene-cyan:#6ae4ff;--scene-red:#e34a4a}
.hero-cinematic{position:relative;overflow:hidden;isolation:isolate;min-height:820px}.hero-cinematic>*:not(.hero-scene):not(.hero-vignette){position:relative;z-index:3}.hero-scene{position:absolute;inset:0;z-index:0;overflow:hidden}.hero-vignette{position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(90deg,rgba(243,240,230,.98) 0%,rgba(243,240,230,.94) 34%,rgba(243,240,230,.46) 63%,rgba(243,240,230,.1) 100%),linear-gradient(0deg,var(--scene-paper) 0%,transparent 22%)}.hero-cinematic .hero-stats,.hero-cinematic .search-wrap{max-width:920px}
.scene-shell{position:relative;width:100%;height:100%;overflow:hidden}.scene-svg{width:100%;height:100%;display:block;transform:translateZ(0)}.hero-scene .scene-svg{min-width:1100px;min-height:820px}
.scene-kicker{position:absolute;right:clamp(18px,4vw,56px);top:28px;z-index:4;border:1px solid var(--scene-ink);background:rgba(255,253,247,.82);backdrop-filter:blur(12px);padding:7px 9px;font:800 .64rem ui-monospace,monospace;letter-spacing:.1em;box-shadow:4px 4px 0 var(--scene-ink)}
.scene-band{max-width:1540px;height:300px;margin:0 auto 22px;position:relative;overflow:hidden;border:1px solid var(--scene-ink);background:#111916;box-shadow:8px 8px 0 var(--scene-ink);isolation:isolate}.scene-band .scene-kicker{top:12px;right:12px;background:rgba(13,23,20,.84);color:var(--scene-paper);border-color:#53605a;box-shadow:none}.scene-band::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(120deg,transparent 0 47%,rgba(217,255,90,.045) 50%,transparent 53%);background-size:220% 100%;animation:sceneSweep 8s linear infinite}
.scene-grid{opacity:.32}.scene-line{fill:none;stroke:#789088;stroke-width:1.4}.scene-line.hot{stroke:var(--scene-acid);stroke-width:2.6;stroke-dasharray:10 12;animation:dashFlow 1.1s linear infinite;filter:url(#softGlow)}.scene-line.blue{stroke:var(--scene-cyan)}.scene-line.orange{stroke:var(--scene-orange)}
.scene-node{cursor:pointer;transform-box:fill-box;transform-origin:center;transition:filter .2s ease}.scene-node:hover{filter:drop-shadow(0 0 12px rgba(217,255,90,.8))}.scene-node .node-core{fill:#151f1b;stroke:#d8e0dc;stroke-width:1.5}.scene-node .node-halo{fill:none;stroke:var(--scene-acid);stroke-width:1.5;opacity:.38;animation:halo 3.2s ease-in-out infinite}.scene-node text{fill:#f4f0e5;font:700 10px ui-monospace,monospace;letter-spacing:.06em}
.scene-label{fill:#b7c5bf;font:700 9px ui-monospace,monospace;letter-spacing:.08em}.scene-major{fill:#f4f0e5;font:900 24px Inter,system-ui,sans-serif;letter-spacing:-.04em}.scene-micro{fill:#8fa19a;font:700 8px ui-monospace,monospace;letter-spacing:.09em}.scene-pulse{transform-box:fill-box;transform-origin:center;animation:pulseDot 2.4s ease-in-out infinite}.scene-packet{filter:url(#softGlow)}
.scene-building{fill:#16201c;stroke:#71847c;stroke-width:1.1}.scene-window{fill:#5b6b65;animation:windowBlink 5s steps(1,end) infinite}.scene-window.hot{fill:var(--scene-acid)}.scene-rail{fill:none;stroke:#3f514a;stroke-width:3}.scene-rail-signal{fill:none;stroke:var(--scene-acid);stroke-width:2;stroke-dasharray:4 18;animation:dashFlow .9s linear infinite}
.scene-screen{fill:#0f1714;stroke:#74877f;stroke-width:1.2}.scene-screen-glow{fill:rgba(106,228,255,.08);stroke:var(--scene-cyan);stroke-width:1}.scene-gauge{fill:none;stroke:#394a43;stroke-width:8;stroke-linecap:round}.scene-gauge.hot{stroke:var(--scene-acid);stroke-dasharray:120 70;animation:gauge 3s ease-in-out infinite}.scene-card-vector{fill:#f4f0e5;stroke:#0d1714;stroke-width:1}.scene-conveyor{fill:#202b26;stroke:#65766f}.scene-crate{fill:#d9ff5a;stroke:#0d1714;stroke-width:1.2}.scene-beam{fill:url(#beamGrad);opacity:.75;animation:beamScan 3.2s ease-in-out infinite}.scene-trophy{filter:url(#softGlow);animation:trophyFloat 3.8s ease-in-out infinite}.scene-orbit{fill:none;stroke:#64766e;stroke-dasharray:3 7}.scene-orb{fill:var(--scene-acid);filter:url(#softGlow)}
.scene.is-live .ambient-rotate{transform-box:fill-box;transform-origin:center;animation:rotateAmbient 18s linear infinite}.scene.is-live .ambient-float{animation:floatAmbient 5s ease-in-out infinite}.scene.is-live .ambient-float.delay{animation-delay:-2.1s}.scene.is-live .scanner{animation:scanY 4.6s ease-in-out infinite}.scene.is-live .packet-a{animation:packetA 5s linear infinite}.scene.is-live .packet-b{animation:packetB 6.2s linear infinite}.scene.is-live .packet-c{animation:packetC 4.4s linear infinite}
.scene.success-flash{animation:sceneSuccess .72s ease-out}.scene.fail-flash{animation:sceneFail .72s ease-out}.scene-transitioning main{animation:viewPhase .32s ease}.fx-layer{position:fixed;inset:0;z-index:999;pointer-events:none;overflow:hidden}.fx-bit{position:absolute;width:7px;height:18px;background:var(--scene-acid);box-shadow:0 0 12px currentColor;animation:fxBurst 900ms cubic-bezier(.18,.8,.24,1) forwards}.fx-bit:nth-child(3n){background:var(--scene-blue);border-radius:50%;width:9px;height:9px}.fx-bit:nth-child(4n){background:var(--scene-orange)}
.graph-edge.hot{stroke-dasharray:9 10!important;animation:dashFlow .75s linear infinite!important;filter:drop-shadow(0 0 5px rgba(106,228,255,.75))}.graph-node.hot circle{animation:graphNodePulse 1.7s ease-in-out infinite}
.card{position:relative;overflow:hidden}.card::after{content:"";position:absolute;inset:-1px;pointer-events:none;background:linear-gradient(110deg,transparent 35%,rgba(217,255,90,.22) 48%,transparent 61%);transform:translateX(-120%);transition:transform .5s ease}.card:hover::after{transform:translateX(120%)}.workflow{position:relative;overflow:hidden}.workflow::before{content:"";position:absolute;left:0;top:0;width:4px;height:0;background:var(--scene-blue);transition:height .45s ease}.workflow:hover::before{height:100%}
.quiz-option.correct{animation:answerCorrect .45s ease}.quiz-option.wrong{animation:answerWrong .42s ease}.quiz-badge.earned{animation:badgeBreathe 3s ease-in-out infinite}.readiness strong{position:relative}.readiness strong::after{content:"";position:absolute;inset:-9px;border:1px solid currentColor;border-radius:50%;opacity:.16;animation:halo 3s ease-in-out infinite}
@keyframes sceneSweep{to{background-position:-220% 0}}@keyframes dashFlow{to{stroke-dashoffset:-44}}@keyframes halo{0%,100%{transform:scale(.88);opacity:.2}50%{transform:scale(1.16);opacity:.7}}@keyframes pulseDot{0%,100%{transform:scale(.8);opacity:.5}50%{transform:scale(1.35);opacity:1}}@keyframes windowBlink{0%,86%,100%{opacity:.35}88%,94%{opacity:1}}@keyframes gauge{0%,100%{stroke-dashoffset:16}50%{stroke-dashoffset:-25}}@keyframes beamScan{0%,100%{transform:translateX(-120px);opacity:.2}50%{transform:translateX(160px);opacity:.9}}@keyframes trophyFloat{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-10px) rotate(2deg)}}@keyframes rotateAmbient{to{transform:rotate(360deg)}}@keyframes floatAmbient{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}@keyframes scanY{0%,100%{transform:translateY(-70px);opacity:.1}50%{transform:translateY(90px);opacity:.8}}@keyframes packetA{0%{transform:translate(0,0);opacity:0}8%{opacity:1}100%{transform:translate(250px,-72px);opacity:0}}@keyframes packetB{0%{transform:translate(0,0);opacity:0}10%{opacity:1}100%{transform:translate(-230px,65px);opacity:0}}@keyframes packetC{0%{transform:translate(0,0);opacity:0}12%{opacity:1}100%{transform:translate(160px,85px);opacity:0}}@keyframes sceneSuccess{0%{filter:brightness(1)}35%{filter:brightness(1.55) saturate(1.25)}100%{filter:brightness(1)}}@keyframes sceneFail{0%,100%{transform:translateX(0)}25%{transform:translateX(-5px)}50%{filter:sepia(.4) hue-rotate(300deg);transform:translateX(5px)}75%{transform:translateX(-2px)}}@keyframes viewPhase{from{opacity:.72;transform:translateY(6px)}to{opacity:1;transform:none}}@keyframes fxBurst{0%{opacity:1;transform:translate3d(0,0,0) rotate(0)}100%{opacity:0;transform:translate3d(var(--dx),var(--dy),0) rotate(var(--rot))}}@keyframes graphNodePulse{0%,100%{filter:none}50%{filter:drop-shadow(0 0 10px rgba(217,255,90,.85))}}@keyframes answerCorrect{0%{transform:scale(.985)}55%{transform:scale(1.012)}100%{transform:scale(1)}}@keyframes answerWrong{0%,100%{transform:translateX(0)}33%{transform:translateX(-4px)}66%{transform:translateX(4px)}}@keyframes badgeBreathe{0%,100%{box-shadow:none}50%{box-shadow:0 0 0 4px rgba(217,255,90,.16),0 0 20px rgba(217,255,90,.24)}}
@media(max-width:1050px){.hero-cinematic{min-height:760px}.hero-scene{opacity:.68}.hero-vignette{background:linear-gradient(90deg,rgba(243,240,230,.98),rgba(243,240,230,.82) 58%,rgba(243,240,230,.32)),linear-gradient(0deg,var(--scene-paper),transparent 22%)}.scene-band{height:250px;margin-left:18px;margin-right:18px;width:auto}}@media(max-width:640px){.hero-cinematic{min-height:740px}.hero-scene{left:-420px;right:-260px;opacity:.48}.hero-vignette{background:linear-gradient(180deg,rgba(243,240,230,.88),rgba(243,240,230,.78) 60%,var(--scene-paper))}.scene-band{height:210px;margin:0 14px 18px;box-shadow:5px 5px 0 var(--scene-ink)}.scene-kicker{font-size:.56rem}.mainnav{overflow:auto}.nav-tab{min-width:max-content}}
@media(prefers-reduced-motion:reduce){.scene-band::after,.scene-line.hot,.scene-node .node-halo,.scene-window,.scene-rail-signal,.scene-gauge.hot,.scene-beam,.scene-trophy,.ambient-rotate,.ambient-float,.scanner,.packet-a,.packet-b,.packet-c,.graph-edge.hot,.graph-node.hot circle,.quiz-badge.earned,.readiness strong::after{animation:none!important}.card::after{display:none}}