:root{--bg: #0a0e17;--bg-grid: #111827;--panel: #131a2a;--panel-2: #0f1522;--border: #24304a;--border-bright: #35507e;--text: #e6ecff;--text-dim: #8fa0c4;--text-faint: #5b6a8c;--accent: #35e6c3;--accent-2: #7c6cff;--accent-3: #ffcf4a;--danger: #ff5d6c;--xp: #35e6c3;--grid-line: rgba(53, 80, 126, .06);--scanline: rgba(0, 0, 0, .12);--overlay: rgba(10, 14, 23, .85);--font-pixel: "Press Start 2P", system-ui, sans-serif;--font-mono: "JetBrains Mono", "SFMono-Regular", Consolas, monospace;color-scheme:dark}:root[data-theme=light]{--bg: #f5f7fc;--bg-grid: #eef1f8;--panel: #ffffff;--panel-2: #eef1f8;--border: #d7deec;--border-bright: #a9b8d6;--text: #16203a;--text-dim: #55627e;--text-faint: #8b97b2;--accent: #0fae8f;--accent-2: #6a58f0;--accent-3: #d99a12;--danger: #e23b53;--xp: #0fae8f;--grid-line: rgba(120, 140, 190, .14);--scanline: rgba(0, 0, 0, .03);--overlay: rgba(245, 247, 252, .85);color-scheme:light}*{box-sizing:border-box}html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font-family:var(--font-mono);-webkit-font-smoothing:antialiased}body{background-image:linear-gradient(var(--grid-line) 1px,transparent 1px),linear-gradient(90deg,var(--grid-line) 1px,transparent 1px);background-size:34px 34px;min-height:100vh;transition:background-color .25s ease,color .25s ease}a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}button{font-family:var(--font-mono);cursor:pointer}:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:4px}::selection{background:var(--accent);color:#041014}.scanlines:after{content:"";position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;background:repeating-linear-gradient(to bottom,rgba(0,0,0,0) 0,rgba(0,0,0,0) 2px,var(--scanline) 3px);z-index:9999;mix-blend-mode:multiply}.wrap{max-width:1040px;margin:0 auto;padding:0 20px}.panel{background:var(--panel);border:1px solid var(--border);border-radius:10px}.pixel{font-family:var(--font-pixel);line-height:1.6}.tag{display:inline-block;font-size:11px;padding:3px 8px;border-radius:5px;border:1px solid var(--border-bright);color:var(--text-dim);background:var(--panel-2);letter-spacing:.02em}.section-title{font-family:var(--font-pixel);font-size:15px;color:var(--accent);margin:0 0 6px;letter-spacing:.01em}.section-sub{color:var(--text-dim);font-size:13px;margin:0 0 22px}.bar{height:12px;border-radius:6px;background:var(--panel-2);border:1px solid var(--border);overflow:hidden}.bar>span{display:block;height:100%;background:var(--xp);border-radius:6px 0 0 6px;transition:width .8s cubic-bezier(.16,1,.3,1)}@keyframes blink{50%{opacity:.25}}@keyframes floatUp{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes popIn{0%{transform:scale(.6);opacity:0}70%{transform:scale(1.08)}to{transform:scale(1);opacity:1}}.reveal{animation:floatUp .5s ease both}@keyframes cellFlash{0%{background:var(--accent);color:#04120f}to{background:transparent}}.flash-row>td{animation:cellFlash .8s ease}.pixel-hero{animation:heroBob 1.9s ease-in-out infinite;transform-origin:center bottom}@keyframes heroBob{0%,to{transform:translateY(0)}50%{transform:translateY(-3px)}}.pixel-eyes{animation:heroBlink 4.5s steps(1,end) infinite}@keyframes heroBlink{0%,92%,to{opacity:1}95%{opacity:0}}.pixel-hero .spin{animation:heroSpin 3s linear infinite}@keyframes heroSpin{to{transform:rotate(360deg)}}.pixel-hero .sway{animation:heroSway 2.6s ease-in-out infinite}@keyframes heroSway{0%,to{transform:rotate(0)}50%{transform:rotate(10deg)}}.pixel-hero .orb,.pixel-hero .glow{animation:heroPulse 1.8s ease-in-out infinite}@keyframes heroPulse{0%,to{transform:scale(1);opacity:.85}50%{transform:scale(1.18);opacity:1}}.pixel-hero .gleam{animation:heroGleam 3.4s steps(1,end) infinite}@keyframes heroGleam{0%,88%,to{opacity:0}90%,96%{opacity:1}}.pixel-hero .tic{animation:heroTic 4s ease-in-out infinite}@keyframes heroTic{0%,84%,to{transform:rotate(0)}90%{transform:rotate(-18deg)}95%{transform:rotate(0)}}.pixel-hero .poseAction{opacity:0}.pixel-hero.act .poseAction{opacity:1}.pixel-hero.act .poseIdle{opacity:0}.pixel-hero.act{animation:heroWalkBob .9s ease-in-out infinite}@keyframes heroWalkBob{0%,to{transform:translateY(0)}50%{transform:translateY(-2px)}}.hero-select{--hs-text: var(--text);--hs-dim: var(--text-dim);--hs-faint: var(--text-faint)}.hero-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;width:100%;max-width:1180px}.hero-card{border:1px solid var(--border);border-radius:14px;padding:14px;cursor:pointer;transition:border-color .15s,box-shadow .15s,transform .15s}.hero-card:not(:disabled):hover{transform:translateY(-4px)}@media (max-width: 1000px){.hero-grid{grid-template-columns:repeat(3,minmax(0,1fr));max-width:720px}}@media (max-width: 680px){.hero-grid{grid-template-columns:repeat(2,minmax(0,1fr));max-width:480px}}@media (max-width: 420px){.hero-grid{grid-template-columns:1fr;max-width:320px}}.teaser-glow{animation:teaserGlow 4s ease-in-out infinite}@keyframes teaserGlow{0%,to{opacity:.12}50%{opacity:.22}}.teaser-float{animation:teaserFloat 3.4s ease-in-out infinite}@keyframes teaserFloat{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}.ember{position:absolute;bottom:-10px;border-radius:50%;opacity:0;animation-name:emberRise;animation-timing-function:ease-in;animation-iteration-count:infinite}@keyframes emberRise{0%{transform:translateY(0) scale(1);opacity:0}15%{opacity:.8}to{transform:translateY(-92vh) scale(.4);opacity:0}}.grimoire-node{transition:border-color .2s,transform .2s}.grimoire-node:hover{border-color:var(--border-bright);transform:translateY(-2px)}.player-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr)}.theme-btn{background:var(--panel-2);border:1px solid var(--border-bright);color:var(--text);border-radius:8px;padding:7px 11px;font-size:12px;display:inline-flex;align-items:center;gap:7px}.theme-btn:hover{border-color:var(--accent);color:var(--accent)}@media (max-width: 760px){.player-grid{grid-template-columns:1fr}.player-left{border-right:none!important;border-bottom:1px solid var(--border)}.nav-full{display:none}}@media (min-width: 761px){.nav-compact{display:none}}@media (prefers-reduced-motion: reduce){*,*:after,*:before{animation:none!important;transition:none!important}.scanlines:after{display:none}}