:root{--deep-purple:purple;--bg-color:#0a0a0a;--text-color:#e0e0e0;--glitch-color-1:#0ff;--glitch-color-2:#f0f;--terminal-green:#0f9;--neon-pink:#f05;--font-pixel:"Press Start 2P", monospace;--font-body:"Courier New", Courier, monospace}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-color);color:var(--text-color);font-family:var(--font-body);line-height:1.6;overflow-x:hidden}#scanlines-overlay{z-index:9999;pointer-events:none;background:linear-gradient(#12101000 50%,#00000040 50%) 0 0/100% 2px,linear-gradient(90deg,#ff00000f,#00ff0005,#0000ff0f) 0 0/3px 100%;display:block;position:fixed;inset:0}.container{max-width:800px;margin:0 auto;padding:2rem}.main-nav{border-bottom:2px solid #333;flex-wrap:wrap;justify-content:center;gap:15px;margin-bottom:3rem;padding-bottom:1.5rem;display:flex}.pixel-btn{font-family:var(--font-pixel);color:#aaa;cursor:pointer;text-transform:uppercase;background:0 0;border:2px solid #333;padding:10px 15px;font-size:.8rem;text-decoration:none;transition:all .2s;display:inline-block}.pixel-btn:hover{color:#fff;background:#ffffff1a;border-color:#666}.pixel-btn.active{color:var(--terminal-green);border-color:var(--terminal-green);box-shadow:0 0 10px #0f93}.pixel-btn.primary{color:var(--neon-pink);border-color:var(--neon-pink);margin-top:2rem;padding:15px 20px;font-size:1rem}.pixel-btn.primary:hover{background:var(--neon-pink);color:var(--bg-color);box-shadow:0 0 20px var(--neon-pink)}.pixel-btn.action-green{color:var(--terminal-green);border-color:var(--terminal-green);margin-top:2rem;padding:15px 20px;font-size:1rem}.pixel-btn.action-green:hover{background:var(--terminal-green);color:var(--bg-color);box-shadow:0 0 20px var(--terminal-green)}.pixel-text{font-family:var(--font-pixel)}.pixel-text-small{font-family:var(--font-pixel);font-size:1rem}.pixel-title-small{font-family:var(--font-pixel);color:var(--terminal-green);text-shadow:0 0 5px var(--terminal-green);margin-bottom:1.5rem;font-size:1.2rem}.pixel-text-micro{font-family:var(--font-pixel);font-size:.6rem}.text-center{text-align:center}.page-view{animation:.3s fadeIn}.page-view.hidden{display:none}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.hero{text-align:center;margin-bottom:4rem;padding-top:1rem}.glitch-wrapper{margin-bottom:1rem;position:relative}.glitch{color:#fff;text-shadow:0 0 10px var(--deep-purple);letter-spacing:-2px;font-size:2.5rem}.glitch:before,.glitch:after{content:attr(data-text);background:var(--bg-color);width:100%;height:100%;position:absolute;top:0;left:0}.glitch:before{text-shadow:-2px 0 var(--glitch-color-1);clip:rect(44px, 450px, 56px, 0);animation:5s linear infinite alternate-reverse glitch-anim;left:2px}.glitch:after{text-shadow:-2px 0 var(--glitch-color-2);clip:rect(44px, 450px, 56px, 0);animation:5s linear infinite alternate-reverse glitch-anim2;left:-2px}@keyframes glitch-anim{0%{clip:rect(21px, 9999px, 95px, 0)}20%{clip:rect(6px, 9999px, 83px, 0)}40%{clip:rect(74px, 9999px, 73px, 0)}60%{clip:rect(42px, 9999px, 14px, 0)}80%{clip:rect(89px, 9999px, 17px, 0)}to{clip:rect(81px, 9999px, 48px, 0)}}@keyframes glitch-anim2{0%{clip:rect(15px, 9999px, 32px, 0)}20%{clip:rect(66px, 9999px, 95px, 0)}40%{clip:rect(32px, 9999px, 77px, 0)}60%{clip:rect(81px, 9999px, 14px, 0)}80%{clip:rect(98px, 9999px, 2px, 0)}to{clip:rect(27px, 9999px, 96px, 0)}}.subtitle{color:var(--neon-pink);text-shadow:0 0 5px var(--neon-pink);margin-bottom:1rem}.tagline{opacity:.8;margin-bottom:2rem;font-style:italic}.css-vinyl-container{flex-direction:column;justify-content:center;align-items:center;margin:2rem 0;display:flex}.vinyl{width:250px;height:250px;filter:drop-shadow(0 0 25px var(--deep-purple));cursor:grab;touch-action:none;transition:filter .3s;overflow:visible}.vinyl:hover{filter:drop-shadow(0 0 40px var(--neon-pink))}.vinyl:active{cursor:grabbing}.blink{animation:1s linear infinite blinker}@keyframes blinker{50%{opacity:0}}.system-box{background:#0a0a0ae6;border:2px solid #333;padding:2rem;box-shadow:inset 0 0 20px #000c}.terminal-box{border:1px solid #222;border-left:4px solid var(--deep-purple);background:#050505;padding:1.5rem;font-size:.95rem}.terminal-box p{color:#bbb;margin-bottom:.8rem}footer{text-align:center;opacity:.6;border-top:1px dashed #333;margin-top:4rem;padding-bottom:2rem}.copyright{font-family:var(--font-pixel);margin-top:1rem;font-size:.7rem}
