@import "https://fonts.googleapis.com/css2?family=Orbitron:wght@400;700;900&family=Special+Elite&display=swap";:root{--bg:#05050f;--neon-cyan:#00f5ff;--neon-magenta:#f0c;--neon-green:#39ff14;--neon-orange:#ff6b00;--neon-yellow:#ffea00;--text-dim:#4a4a6a}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html,body,#root{background:var(--bg);width:100%;height:100%;color:var(--neon-cyan);font-family:Orbitron,monospace;overflow:hidden}body:after{content:"";pointer-events:none;z-index:9999;background:repeating-linear-gradient(#0000,#0000 2px,#00000014 2px 4px);position:fixed;inset:0}.boot{z-index:100;background:#000;flex-direction:column;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.boot.flicker{animation:.5s step-end forwards crt-flicker}@keyframes crt-flicker{0%{background:#000}15%{background:#fff}25%{background:#000}45%{background:#fff}55%{background:#000}70%{background:#fff}80%{background:#000}to{background:#000}}.terminal{border:1px solid var(--neon-cyan);width:min(700px,90vw);box-shadow:0 0 20px var(--neon-cyan), inset 0 0 10px #00f5ff0d;background:#00050ff2;padding:2rem}.terminal-line{color:var(--neon-green);white-space:pre;font-size:clamp(.65rem,1.5vw,.85rem);line-height:1.9;overflow:hidden}.terminal-line.dim{color:var(--text-dim)}.terminal-line.cyan{color:var(--neon-cyan)}.terminal-line.title{color:var(--neon-magenta);text-shadow:0 0 12px var(--neon-magenta);margin-bottom:.5rem;font-size:clamp(.8rem,2vw,1.1rem);font-weight:900}.cursor{background:var(--neon-green);vertical-align:text-bottom;width:.6em;height:1em;animation:.7s step-end infinite blink;display:inline-block}@keyframes blink{50%{opacity:0}}.boot.glitch{animation:.35s steps(2,end) forwards rgb-glitch}@keyframes rgb-glitch{0%{filter:none}20%{filter:drop-shadow(3px 0 #f00c)drop-shadow(-3px 0 #0ffc)}40%{filter:drop-shadow(-5px 0 #f0cc)drop-shadow(5px 0 #39ff14cc)}60%{filter:drop-shadow(2px 0 #ff6b00cc)}80%{filter:none}to{filter:none}}.boot.fadeout{animation:1.2s ease-in forwards boot-fadeout}@keyframes boot-fadeout{0%{opacity:1}to{opacity:0;pointer-events:none}}.building-link{cursor:pointer;filter:drop-shadow(0 0 6px var(--glow-color,var(--neon-cyan)));text-decoration:none;transition:filter .3s;display:block;position:relative}.building-link:hover{filter:drop-shadow(0 0 16px var(--glow-color,var(--neon-cyan))) drop-shadow(0 0 32px var(--glow-color,var(--neon-cyan)))}.building-label{letter-spacing:.15em;white-space:nowrap;opacity:0;text-shadow:0 0 10px var(--glow-color,var(--neon-cyan));color:var(--glow-color,var(--neon-cyan));pointer-events:none;font-family:Orbitron,monospace;font-size:clamp(.5rem,1vw,.7rem);font-weight:700;transition:opacity .25s;position:absolute;bottom:calc(100% + 6px);left:50%;transform:translate(-50%)}.building-link:hover .building-label{opacity:1}@keyframes win-flicker{0%,to{opacity:1}50%{opacity:.3}}.win-flicker{animation:win-flicker var(--flicker-dur,3s) ease-in-out var(--flicker-delay,0s) infinite}.building-link{animation:.9s cubic-bezier(.22,1,.36,1) both building-rise}@keyframes building-rise{0%{opacity:0;transform:translateY(120%)}to{opacity:1;transform:translateY(0)}}.cityscape{background:radial-gradient(at 50% 60%,#0a0020 0%,#05050f 60%,#000 100%);flex-direction:column;animation:1s forwards city-fadein;display:flex;position:fixed;inset:0;overflow:hidden}@keyframes city-fadein{0%{opacity:0}to{opacity:1}}.stars{pointer-events:none;position:absolute;inset:0}.star{animation:twinkle var(--twinkle-dur,4s) ease-in-out var(--twinkle-delay,0s) infinite;background:#fff;border-radius:50%;position:absolute}@keyframes twinkle{0%,to{opacity:.8}50%{opacity:.1}}.buildings-row{justify-content:center;align-items:flex-end;gap:clamp(8px,2vw,24px);padding:0 clamp(16px,4vw,60px) 40px;display:flex;position:absolute;bottom:0;left:0;right:0}.ground{background:var(--neon-cyan);height:2px;box-shadow:0 0 12px var(--neon-cyan), 0 0 30px #00f5ff4d;position:absolute;bottom:36px;left:0;right:0}.horizon-glow{pointer-events:none;background:linear-gradient(#0000 0%,#00f5ff0a 60%,#ff00cc14 100%);height:200px;position:absolute;bottom:0;left:0;right:0}.cassette-link{transform:rotate(var(--tilt,0deg));filter:drop-shadow(0 10px 28px #000000b3);text-decoration:none;transition:transform .35s cubic-bezier(.34,1.56,.64,1),filter .35s;animation:.9s cubic-bezier(.22,1,.36,1) both cassette-rise;display:block}.cassette-link:hover{transform:rotate(var(--tilt,0deg)) translateY(-14px) scale(1.03);filter:drop-shadow(0 22px 44px #000000d9)}.cassette-svg{width:clamp(160px,26vw,260px);height:auto;display:block}.spool-spin{transform-origin:0 0;animation:4s linear infinite spool-rotate}@keyframes spool-rotate{to{transform:rotate(360deg)}}.cassette-dimmed{opacity:.35;pointer-events:none;filter:grayscale(.4)drop-shadow(0 6px 14px #00000080);transition:opacity .3s,filter .3s}.cassette-hidden{opacity:0;pointer-events:none;transition:opacity .3s,transform .3s;transform:rotate(var(--tilt,0deg)) translateY(-20px) scale(.85)!important}@keyframes cassette-rise{0%{opacity:0;transform:rotate(var(--tilt,0deg)) translateY(50px)}to{opacity:1;transform:rotate(var(--tilt,0deg)) translateY(0)}}.player-wrap{filter:drop-shadow(0 20px 56px #000000d9);z-index:2;margin-top:48px;position:relative}.player-svg{width:clamp(280px,70vw,460px);height:auto;display:block}.spool-slow{transform-origin:0 0;animation:4s linear infinite spool-turn}.spool-fast{transform-origin:0 0;animation:.9s linear infinite spool-turn}@keyframes spool-turn{to{transform:rotate(360deg)}}.bay-tape{transform-origin:top}.bay-tape-inserting{animation:.55s cubic-bezier(.22,1,.36,1) forwards tape-insert}.bay-tape-inserted,.bay-tape-playing{opacity:1;transform:translateY(0)}.bay-tape-ejecting{animation:.45s cubic-bezier(.55,0,.8,.2) forwards tape-eject}@keyframes tape-insert{0%{opacity:.5;transform:translateY(110%)}to{opacity:1;transform:translateY(0)}}@keyframes tape-eject{0%{opacity:1;transform:translateY(0)}to{opacity:.2;transform:translateY(-110%)}}.transport-btn rect{transition:filter .15s}.transport-btn:not(.t-disabled):hover rect{filter:brightness(1.35)}@media (width<=600px){.player-svg{width:92vw}}.cassette-page{background:radial-gradient(at 50% 35%,#201508 0%,#130e08 45%,#0a0806 100%);flex-direction:column;justify-content:center;align-items:center;min-height:100vh;display:flex;position:relative;overflow:hidden}.cassette-page:after{content:"";opacity:.045;pointer-events:none;z-index:10;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)' opacity='1'/%3E%3C/svg%3E");position:fixed;inset:0}.cassette-page:before{content:"";pointer-events:none;z-index:9;background:radial-gradient(#0000 40%,#0000008c 100%);position:fixed;inset:0}.cassette-shelf{z-index:2;justify-content:center;align-items:flex-end;gap:clamp(16px,3vw,48px);padding:28px 40px 16px;display:flex;position:relative}.cassette-surface{z-index:2;background:linear-gradient(90deg,#0000,#3a2a1a 20% 80%,#0000);width:100%;max-width:860px;height:1px;margin-top:8px;position:relative}.cassette-surface:after{content:"";background:linear-gradient(#1e120880,#0000);height:30px;display:block}.cassette-hint{color:#4a3828;letter-spacing:.25em;text-transform:uppercase;z-index:2;opacity:0;margin-top:32px;font-family:Special Elite,Courier New,monospace;font-size:clamp(.6rem,1.1vw,.75rem);animation:1.2s 1.8s forwards hint-fade;position:relative}.cassette-back{letter-spacing:.2em;color:#3a2a1a;z-index:20;font-family:Orbitron,monospace;font-size:.6rem;text-decoration:none;transition:color .2s;position:fixed;top:24px;left:28px}.cassette-back:hover{color:#8a6a4a}@keyframes hint-fade{to{opacity:1}}@media (width<=600px){.cassette-shelf{flex-direction:column;align-items:center;gap:28px;padding-bottom:20px}.cassette-link{transform:none!important}.cassette-link:hover{transform:translateY(-8px)scale(1.02)!important}}
