:root{color-scheme:dark;--blood-red: #8B0000;--stoplight-red: #FF0000;--white: #FFFFFF;--black: #000000;--teal: #00FFFF;--bg: #0a0a0f;--surface: #131318;--surface-2: #1a1a22;--text: #FFFFFF;--text-secondary: #A3A3A3;--border: #2a2a35;--font-display: "Orbitron", sans-serif;--font-mono: "Share Tech Mono", monospace;--shadow-glow-red: 0 0 20px rgba(255, 0, 0, .3);--shadow-glow-teal: 0 0 20px rgba(0, 255, 255, .3)}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}html,body,#root{min-height:100%}body{background:var(--bg);color:var(--text);font-family:var(--font-mono);overflow-x:hidden}button{font-family:var(--font-mono);cursor:pointer}a{color:var(--teal);text-decoration:none}.app-shell{position:relative;min-height:100vh;background:radial-gradient(ellipse at 20% 0%,rgba(139,0,0,.15),transparent 50%),radial-gradient(ellipse at 80% 100%,rgba(0,255,255,.08),transparent 50%),linear-gradient(180deg,#050508,#0a0a0f 40%,#0d0d14);overflow:hidden}.haze{position:fixed;left:-10%;right:-10%;pointer-events:none;z-index:2;opacity:.5}.haze-top{top:-10%;height:30vh;background:linear-gradient(180deg,rgba(139,0,0,.12),transparent);filter:blur(30px);animation:hazeDrift 12s ease-in-out infinite alternate}.haze-bottom{bottom:-10%;height:40vh;background:linear-gradient(0deg,rgba(0,255,255,.06),transparent);filter:blur(40px);animation:hazeDrift 16s ease-in-out infinite alternate-reverse}@keyframes hazeDrift{0%{transform:translate(-2%);opacity:.4}to{transform:translate(2%);opacity:.7}}.scanlines-overlay{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:3;background:repeating-linear-gradient(0deg,transparent 0px,transparent 2px,rgba(0,0,0,.15) 2px,rgba(0,0,0,.15) 4px);mix-blend-mode:multiply}.vignette{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:3;background:radial-gradient(ellipse at center,transparent 55%,rgba(0,0,0,.7) 100%)}.flicker-overlay{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:4;background:transparent;animation:screenFlicker 8s infinite}@keyframes screenFlicker{0%,to{opacity:0}3%{opacity:.03;background:#ffffff05}3.5%{opacity:0}7%{opacity:.02;background:#ff000003}7.5%{opacity:0}52%{opacity:0}52.5%{opacity:.04;background:#00ffff05}53%{opacity:0}}.top-nav{position:relative;z-index:10;display:flex;align-items:center;justify-content:space-between;padding:16px 32px;border-bottom:1px solid var(--border);background:#050508d9;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.brand{display:flex;align-items:center;gap:12px}.brand-mark{font-size:28px;color:var(--teal);text-shadow:0 0 12px var(--teal);animation:brandPulse 3s ease-in-out infinite}@keyframes brandPulse{0%,to{text-shadow:0 0 8px var(--teal)}50%{text-shadow:0 0 20px var(--teal),0 0 40px rgba(0,255,255,.3)}}.brand-name{font-family:var(--font-display);font-weight:900;font-size:18px;letter-spacing:.15em;color:var(--white)}.brand-sub{font-size:10px;color:var(--text-secondary);letter-spacing:.2em;border-left:1px solid var(--border);padding-left:12px;text-transform:uppercase}.nav-links{display:flex;gap:24px}.nav-link{font-size:12px;letter-spacing:.2em;color:var(--text-secondary);transition:color .2s ease,text-shadow .2s ease}.nav-link:hover{color:var(--teal);text-shadow:0 0 8px rgba(0,255,255,.5)}.sound-toggle{background:var(--surface);border:1px solid var(--border);border-radius:8px;width:40px;height:40px;display:grid;place-items:center;font-size:16px;color:var(--text);transition:border-color .2s ease,box-shadow .2s ease}.sound-toggle:hover{border-color:var(--teal);box-shadow:var(--shadow-glow-teal)}.main-content{position:relative;z-index:5;max-width:1400px;margin:0 auto;padding:0 32px}.hero{display:grid;grid-template-columns:1fr 1.2fr;gap:48px;align-items:center;min-height:calc(100vh - 73px);padding:48px 0}.hero-copy{display:flex;flex-direction:column;gap:24px}.eyebrow{font-size:13px;color:var(--teal);letter-spacing:.3em;text-transform:uppercase;position:relative}.glitch-text{position:relative}.glitch-text:before,.glitch-text:after{content:attr(data-text);position:absolute;left:0;top:0;width:100%;overflow:hidden}.glitch-text:before{color:var(--stoplight-red);transform:translate(-2px);clip-path:inset(0 0 60% 0);animation:glitchTop 3s infinite linear alternate-reverse;opacity:.6}.glitch-text:after{color:var(--teal);transform:translate(2px);clip-path:inset(60% 0 0 0);animation:glitchBottom 2.5s infinite linear alternate-reverse;opacity:.6}@keyframes glitchTop{0%{clip-path:inset(0 0 85% 0)}10%{clip-path:inset(10% 0 60% 0)}20%{clip-path:inset(0 0 70% 0)}30%{clip-path:inset(30% 0 40% 0)}40%{clip-path:inset(0 0 90% 0)}50%{clip-path:inset(50% 0 20% 0)}60%{clip-path:inset(0 0 75% 0)}70%{clip-path:inset(20% 0 50% 0)}80%{clip-path:inset(0 0 65% 0)}90%{clip-path:inset(40% 0 30% 0)}to{clip-path:inset(0 0 80% 0)}}@keyframes glitchBottom{0%{clip-path:inset(80% 0 0 0)}10%{clip-path:inset(60% 0 10% 0)}20%{clip-path:inset(70% 0 0 0)}30%{clip-path:inset(40% 0 30% 0)}40%{clip-path:inset(90% 0 0 0)}50%{clip-path:inset(20% 0 50% 0)}60%{clip-path:inset(75% 0 0 0)}70%{clip-path:inset(50% 0 20% 0)}80%{clip-path:inset(65% 0 0 0)}90%{clip-path:inset(30% 0 40% 0)}to{clip-path:inset(80% 0 0 0)}}.hero-title{font-family:var(--font-display);font-weight:900;font-size:clamp(40px,6vw,72px);line-height:1.05;letter-spacing:-.02em}.title-line{display:block}.title-accent{color:var(--stoplight-red);text-shadow:0 0 30px rgba(255,0,0,.4)}.hero-lede{font-size:15px;line-height:1.7;color:var(--text-secondary);max-width:480px}.hero-actions{display:flex;gap:16px;flex-wrap:wrap}.btn{display:inline-flex;align-items:center;gap:8px;padding:12px 20px;font-size:13px;letter-spacing:.1em;text-transform:uppercase;border-radius:4px;border:1px solid var(--border);background:var(--surface);color:var(--text);transition:all .2s ease;min-height:40px}.btn:hover{transform:translateY(-1px)}.btn:active{transform:scale(.97)}.btn:focus-visible{outline:2px solid var(--teal);outline-offset:2px}.btn-primary{background:linear-gradient(135deg,var(--blood-red),#c40000);border-color:var(--stoplight-red);color:var(--white);box-shadow:0 0 20px #ff000040}.btn-primary:hover{box-shadow:0 0 30px #ff000073;border-color:#f33}.btn-ghost{background:transparent;border-color:var(--teal);color:var(--teal)}.btn-ghost:hover{background:#00ffff14;box-shadow:var(--shadow-glow-teal)}.btn-small{padding:8px 14px;font-size:11px;min-height:32px}.btn-icon{font-size:14px}.board-stage{position:relative;perspective:1200px}.board-frame{position:relative;border-radius:8px;padding:12px;background:linear-gradient(145deg,#1a1a22,#0d0d12);border:1px solid var(--border);box-shadow:0 0 40px #ff000026,0 20px 60px #0009;transform:rotateX(8deg) rotateY(-4deg);transition:transform .4s ease}.board-frame:hover{transform:rotateX(5deg) rotateY(-2deg)}.board-3d{position:relative;border-radius:4px;overflow:hidden;transition:transform .5s ease}.board-3d.board-flipped{transform:rotateX(180deg) rotateY(180deg)}.board-surface{position:relative;aspect-ratio:1;background:radial-gradient(ellipse at center,rgba(139,0,0,.2),transparent 70%),linear-gradient(135deg,#0a0a0e,#14141a,#0a0a0e)}.board-grid{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;grid-template-columns:repeat(8,1fr);grid-template-rows:repeat(8,1fr);z-index:2}.square{position:relative;border:none;padding:0;display:flex;align-items:center;justify-content:center;transition:background .15s ease;overflow:hidden}.sq-light{background:#ffffff0f}.sq-dark{background:#00000073}.square:hover{background:#00ffff1f}.sq-selected{background:#0ff3!important;box-shadow:inset 0 0 15px #00ffff4d}.sq-target{cursor:pointer}.sq-check{background:#ff00004d!important;animation:checkPulse 1s ease-in-out infinite}@keyframes checkPulse{0%,to{box-shadow:inset 0 0 10px #ff00004d}50%{box-shadow:inset 0 0 25px #ff0000b3}}.square-coord{position:absolute;font-size:7px;color:#ffffff40;pointer-events:none;font-family:var(--font-mono)}.square[data-file=a] .square-coord{bottom:2px;left:3px}.square[data-rank="1"] .square-coord{top:2px;right:3px}.piece{position:relative;display:flex;align-items:center;justify-content:center;width:100%;height:100%;font-size:clamp(16px,4vw,36px);line-height:1;-webkit-user-select:none;user-select:none;cursor:pointer;transition:transform .15s ease;z-index:3}.piece:hover{transform:scale(1.1)}.piece-glyph{position:relative;z-index:2;font-family:serif}.piece-white .piece-glyph{color:var(--white);text-shadow:0 0 10px rgba(255,255,255,.8),0 0 20px rgba(255,255,255,.4),0 0 40px rgba(0,255,255,.3)}.piece-black .piece-glyph{color:#888;text-shadow:0 0 10px rgba(255,0,0,.6),0 0 20px rgba(139,0,0,.4),0 0 40px rgba(255,0,0,.2)}.piece-glow{position:absolute;top:15%;right:15%;bottom:15%;left:15%;border-radius:50%;filter:blur(8px);opacity:.5;z-index:1;pointer-events:none}.piece-white .piece-glow{background:radial-gradient(circle,rgba(0,255,255,.4),transparent 70%)}.piece-black .piece-glow{background:radial-gradient(circle,rgba(255,0,0,.4),transparent 70%)}.piece-scan{position:absolute;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,var(--teal),transparent);opacity:0;z-index:4;pointer-events:none;animation:pieceScan 3s linear infinite}@keyframes pieceScan{0%{top:0%;opacity:0}10%{opacity:.6}90%{opacity:.6}to{top:100%;opacity:0}}.piece-flicker .piece-glyph{animation:pieceFlicker .3s steps(2) infinite}@keyframes pieceFlicker{0%{opacity:1}25%{opacity:.2}50%{opacity:.9}75%{opacity:.3}to{opacity:1}}.piece-glitch .piece-glyph{animation:chromaGlitch .4s steps(3) infinite;position:relative}@keyframes chromaGlitch{0%{text-shadow:2px 0 0 rgba(255,0,0,.8),-2px 0 0 rgba(0,255,255,.8);transform:translate(0)}25%{text-shadow:-3px 0 0 rgba(255,0,0,.8),3px 0 0 rgba(0,255,255,.8);transform:translate(1px)}50%{text-shadow:2px 0 0 rgba(255,0,0,.8),-2px 0 0 rgba(0,255,255,.8);transform:translate(-1px)}75%{text-shadow:-2px 0 0 rgba(255,0,0,.8),2px 0 0 rgba(0,255,255,.8);transform:translate(1px)}to{text-shadow:2px 0 0 rgba(255,0,0,.8),-2px 0 0 rgba(0,255,255,.8);transform:translate(0)}}.target-marker{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;font-size:clamp(14px,3vw,24px);color:var(--teal);text-shadow:0 0 10px var(--teal);z-index:4;pointer-events:none;animation:targetPulse 1s ease-in-out infinite}@keyframes targetPulse{0%,to{opacity:.5}50%{opacity:1}}.crack-overlay{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;z-index:5;pointer-events:none;mix-blend-mode:screen}.crack{fill:none;stroke:#f006;stroke-width:2;filter:url(#crackGlow);stroke-dasharray:4 3;animation:crackPulse 4s ease-in-out infinite}.crack-main{stroke-width:3;stroke:#f009}.crack-branch{stroke-width:2.5}.crack-branch2{stroke-width:2}.crack-branch3{stroke-width:2.5}.crack-fine,.crack-fine2,.crack-fine3{stroke-width:1;stroke:#ff00004d}@keyframes crackPulse{0%,to{opacity:.7}50%{opacity:1}}.laser-grid{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;z-index:6;pointer-events:none;mix-blend-mode:screen}.laser-line{stroke-dasharray:none;animation:laserFlicker 2s ease-in-out infinite}.laser-line:nth-child(odd){animation-delay:.5s}.laser-line:nth-child(3n){animation-delay:1s}@keyframes laserFlicker{0%,to{opacity:.8}50%{opacity:.3}}.board-edge-glow{position:absolute;top:0;right:0;bottom:0;left:0;z-index:7;pointer-events:none;box-shadow:inset 0 0 30px #ff000026,inset 0 0 60px #00ffff0d;border-radius:4px}.board-haze{position:absolute;top:-20%;right:-20%;bottom:-20%;left:-20%;z-index:8;pointer-events:none;background:linear-gradient(180deg,transparent 60%,rgba(0,255,255,.06) 100%);filter:blur(20px);animation:boardHaze 8s ease-in-out infinite alternate}.board-haze-2{background:linear-gradient(0deg,transparent 60%,rgba(255,0,0,.05) 100%);animation-delay:4s;animation-duration:10s}@keyframes boardHaze{0%{transform:translateY(-2%);opacity:.6}to{transform:translateY(2%);opacity:1}}.status-bar{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;background:#050508b3;border:1px solid var(--border);border-radius:4px;margin-bottom:16px;font-size:12px;letter-spacing:.1em}.status-left{display:flex;align-items:center;gap:10px}.status-dot{width:10px;height:10px;border-radius:50%;display:inline-block}.dot-white{background:var(--white);box-shadow:0 0 8px var(--white)}.dot-black{background:var(--stoplight-red);box-shadow:0 0 8px var(--stoplight-red)}.status-text{color:var(--text);text-transform:uppercase}.status-right{display:flex;align-items:center;gap:12px;color:var(--text-secondary)}.status-move{color:var(--teal)}.status-sep{opacity:.4}.controls-row{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;padding:16px;background:#05050880;border:1px solid var(--border);border-radius:4px;margin-bottom:64px}.control-group{display:flex;align-items:center;gap:12px}.scan-control{flex:1;max-width:320px}.scan-control label{font-size:10px;letter-spacing:.15em;color:var(--text-secondary);white-space:nowrap}.scan-range{flex:1;-webkit-appearance:none;-moz-appearance:none;appearance:none;height:4px;background:var(--border);border-radius:2px;outline:none}.scan-range::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:16px;height:16px;background:var(--teal);border-radius:50%;cursor:pointer;box-shadow:0 0 8px var(--teal)}.scan-range::-moz-range-thumb{width:16px;height:16px;background:var(--teal);border-radius:50%;cursor:pointer;box-shadow:0 0 8px var(--teal);border:none}.scan-value{font-size:11px;color:var(--teal);min-width:40px;text-align:right}.captured-group{font-size:12px}.captured-label{color:var(--text-secondary);letter-spacing:.1em}.captured-glyphs{font-size:14px;letter-spacing:2px}.captured-white{color:var(--white)}.captured-black{color:var(--stoplight-red)}.info-section{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-bottom:64px}.info-card{background:#0d0d12cc;border:1px solid var(--border);border-radius:8px;padding:32px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.card-eyebrow{font-size:11px;color:var(--teal);letter-spacing:.3em;text-transform:uppercase;margin-bottom:12px}.info-card h2{font-family:var(--font-display);font-size:20px;font-weight:700;letter-spacing:.05em;margin-bottom:16px}.card-body{font-size:14px;line-height:1.7;color:var(--text-secondary);margin-bottom:16px}.protocol-list{list-style:none;display:flex;flex-direction:column;gap:10px}.protocol-list li{font-size:13px;color:var(--text);display:flex;gap:10px;align-items:baseline}.list-marker{color:var(--stoplight-red)}.move-log{display:flex;flex-direction:column;gap:6px;max-height:240px;overflow-y:auto;padding-right:8px}.move-log::-webkit-scrollbar{width:4px}.move-log::-webkit-scrollbar-track{background:var(--border)}.move-log::-webkit-scrollbar-thumb{background:var(--teal);border-radius:2px}.log-entry{display:flex;gap:12px;font-size:12px;padding:6px 8px;border-left:2px solid transparent}.log-move{color:var(--text-secondary)}.log-capture{color:var(--stoplight-red);border-left-color:var(--stoplight-red);background:#ff00000d}.log-system{color:var(--teal);border-left-color:var(--teal);background:#00ffff0a}.log-time{color:#ffffff4d;white-space:nowrap}.about-section{margin-bottom:64px}.about-card{background:#0d0d12cc;border:1px solid var(--border);border-radius:8px;padding:48px;text-align:center;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.about-card .card-body{max-width:640px;margin-left:auto;margin-right:auto}.tech-tags{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin-top:24px}.tech-tag{font-size:11px;letter-spacing:.15em;padding:6px 12px;border:1px solid var(--border);border-radius:4px;color:var(--text-secondary);transition:all .2s ease}.tech-tag:hover{border-color:var(--teal);color:var(--teal);box-shadow:0 0 10px #0ff3}.site-footer{position:relative;z-index:5;border-top:1px solid var(--border);padding:24px 32px;background:#050508cc}.footer-inner{max-width:1400px;margin:0 auto;display:flex;justify-content:space-between;align-items:center;font-size:12px;color:var(--text-secondary)}.footer-brand{letter-spacing:.2em}.footer-credit a{color:var(--teal)}.game-over-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;display:flex;align-items:center;justify-content:center;background:#000000d9;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);animation:overlayIn .3s ease-out}@keyframes overlayIn{0%{opacity:0}to{opacity:1}}.game-over-card{text-align:center;padding:48px;background:var(--surface);border:1px solid var(--stoplight-red);border-radius:8px;box-shadow:0 0 60px #ff00004d;max-width:480px}.game-over-title{font-family:var(--font-display);font-size:32px;font-weight:900;letter-spacing:.05em;color:var(--stoplight-red);text-shadow:0 0 30px rgba(255,0,0,.5);margin-bottom:16px}.game-over-text{font-size:14px;line-height:1.7;color:var(--text-secondary);margin-bottom:24px}@media (max-width: 1024px){.hero{grid-template-columns:1fr;gap:32px;padding:32px 0}.hero-copy{order:2}.hero-visual{order:1}.board-frame{max-width:560px;margin:0 auto;transform:rotateX(5deg)}.info-section{grid-template-columns:1fr}}@media (max-width: 768px){.top-nav{padding:12px 16px;flex-wrap:wrap;gap:8px}.brand-sub{display:none}.nav-links{gap:12px;order:3;width:100%;justify-content:center}.nav-link{font-size:10px}.main-content{padding:0 16px}.hero{padding:24px 0}.hero-title{font-size:36px}.controls-row{flex-direction:column;align-items:stretch}.scan-control{max-width:none}.about-card{padding:32px 24px}.footer-inner{flex-direction:column;gap:8px;text-align:center}}@media (max-width: 480px){.hero-actions{flex-direction:column}.btn{width:100%;justify-content:center}.status-bar{flex-direction:column;gap:8px;align-items:flex-start}.info-card{padding:24px}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}html{scroll-behavior:auto}}