:root{--bg: #050505;--panel: rgba(18, 16, 10, .72);--gold: #d4af37;--gold-hi: #f5d77a;--dim: #7a6a3a;--text: #cfc7b0;--red: #c0392b;--mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body,#root{margin:0;height:100%;background:var(--bg);color:var(--text);font-family:var(--mono)}body{overflow-x:hidden}button,a{font-family:inherit;cursor:pointer;text-decoration:none}button:disabled{cursor:not-allowed;opacity:.4}.app{min-height:100%;display:flex;flex-direction:column;position:relative}.fx-grid{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:0;background-image:linear-gradient(rgba(212,175,55,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(212,175,55,.05) 1px,transparent 1px);background-size:44px 44px;-webkit-mask-image:radial-gradient(ellipse at center,#000 30%,transparent 80%);mask-image:radial-gradient(ellipse at center,#000 30%,transparent 80%)}.fx-scan{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:50;background:repeating-linear-gradient(0deg,rgba(0,0,0,.28) 0 1px,transparent 1px 3px);mix-blend-mode:multiply}.fx-scan:after{content:"";position:absolute;left:0;right:0;height:120px;top:-120px;background:linear-gradient(transparent,rgba(212,175,55,.06),transparent);animation:sweep 7s linear infinite}@keyframes sweep{to{transform:translateY(120vh)}}header{position:relative;z-index:2;display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding:12px 18px;border-bottom:1px solid rgba(212,175,55,.2);background:#050505cc}.brand{background:none;border:0;color:var(--gold);font-weight:700;letter-spacing:.3em;font-size:15px}.brand span{color:var(--dim);letter-spacing:0;margin-left:6px}nav{display:flex;gap:6px}nav button{background:none;border:1px solid rgba(212,175,55,.25);color:var(--dim);padding:6px 12px;font-size:12px;letter-spacing:.15em}nav button.on,nav button:hover{color:var(--gold-hi);border-color:var(--gold);box-shadow:0 0 12px #d4af3740 inset}.xp{margin-left:auto;display:flex;align-items:center;gap:8px;font-size:11px;color:var(--gold);letter-spacing:.1em}.xp i{width:90px;height:4px;background:#1b180e;display:block}.xp u{display:block;height:100%;background:var(--gold);box-shadow:0 0 8px var(--gold);transition:width .6s}main{position:relative;z-index:2;flex:1;width:100%;max-width:760px;margin:0 auto;padding:22px 18px;transition:filter .3s}main.blurred{filter:blur(8px)}footer{position:relative;z-index:2;text-align:center;font-size:10px;letter-spacing:.25em;color:var(--dim);padding:14px}.sim{font-size:10px;letter-spacing:.2em;color:var(--dim)}.glitch{position:relative;font-size:clamp(44px,12vw,84px);letter-spacing:.22em;margin:0;color:var(--gold-hi);text-shadow:0 0 24px rgba(212,175,55,.45);font-weight:600}.glitch:before,.glitch:after{content:attr(data-t);position:absolute;left:0;top:0;width:100%;overflow:hidden;opacity:.55}.glitch:before{color:#7fe;transform:translate(-2px);clip-path:inset(0 0 60% 0);animation:gl 4s infinite steps(1)}.glitch:after{color:#f55;transform:translate(2px);clip-path:inset(60% 0 0 0);animation:gl 4s infinite steps(1) reverse}@keyframes gl{0%,90%,to{opacity:0}92%{opacity:.55;transform:translate(-3px,1px)}95%{opacity:.55;transform:translate(3px,-1px)}}.loader{min-height:100%;height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;background:radial-gradient(circle at 50% 40%,#14110a,#030303 70%);padding:24px}.loader-kanji{font-size:120px;color:var(--gold);opacity:.15;line-height:1;animation:breathe 2.4s ease-in-out infinite}@keyframes breathe{50%{opacity:.5;text-shadow:0 0 40px var(--gold)}}.bar{width:min(320px,80vw);height:4px;background:#1b180e}.bar i{display:block;height:100%;background:linear-gradient(90deg,var(--dim),var(--gold-hi));box-shadow:0 0 10px var(--gold);transition:width .1s linear}.boot{list-style:none;margin:0;padding:0;font-size:11px;letter-spacing:.15em;min-height:90px;color:var(--dim)}.boot li{opacity:0;transition:opacity .3s}.boot li.on{opacity:1;color:var(--gold)}.pct{font-size:12px;color:var(--gold);letter-spacing:.3em}.modal-back{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;display:flex;align-items:center;justify-content:center;padding:18px;background:#00000073;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);animation:fade .3s}@keyframes fade{0%{opacity:0}}.modal{width:min(480px,100%);max-height:92vh;overflow:auto;background:var(--panel);border:1px solid var(--gold);padding:20px 22px;box-shadow:0 0 40px #d4af372e,inset 0 0 30px #d4af370d}.modal-head{display:flex;justify-content:space-between;font-size:11px;letter-spacing:.25em;color:var(--dim)}.modal h2{color:var(--gold-hi);letter-spacing:.3em;margin:8px 0 14px;font-size:20px}.modal ol{list-style:none;padding:0;margin:0 0 18px;display:grid;gap:12px}.modal li{display:flex;gap:12px}.modal li b{color:var(--gold);font-size:18px}.modal li strong{font-size:12px;letter-spacing:.2em;color:var(--gold-hi)}.modal li p{margin:3px 0 0;font-size:12.5px;line-height:1.5}.modal .cta{width:100%}.cta{display:inline-block;text-align:center;background:var(--gold);color:#0a0a0a;border:0;padding:13px 24px;font-weight:700;letter-spacing:.2em;font-size:13px;box-shadow:0 0 20px #d4af3759}.cta:hover{background:var(--gold-hi)}.ghost-btn{display:inline-block;background:none;border:1px solid rgba(212,175,55,.4);color:var(--gold);padding:11px 18px;letter-spacing:.2em;font-size:12px}.ghost-btn:hover{border-color:var(--gold-hi);color:var(--gold-hi)}.home{text-align:center;display:flex;flex-direction:column;align-items:center;gap:12px;padding-top:4vh}.jp{font-size:64px;color:var(--gold);letter-spacing:.2em;text-shadow:0 0 30px rgba(212,175,55,.5);font-family:Hiragino Mincho ProN,"Noto Serif JP",serif}.tag{margin:0;letter-spacing:.4em;color:var(--gold);text-transform:uppercase;font-size:13px}.mean{max-width:420px;line-height:1.7;font-size:13px;margin:6px 0 18px}.modes{display:grid;gap:10px;width:min(440px,100%);margin-bottom:18px}.modes button,.lvl-grid button{text-align:left;background:var(--panel);border:1px solid rgba(212,175,55,.25);color:var(--text);padding:14px 16px;display:flex;flex-direction:column;gap:4px;position:relative;transition:.2s}.modes button:hover:not(:disabled),.lvl-grid button:hover:not(:disabled){border-color:var(--gold);box-shadow:0 0 22px #d4af3733;transform:translate(3px)}.modes b,.lvl-grid b{color:var(--gold-hi);letter-spacing:.25em;font-size:14px}.modes span,.lvl-grid span{font-size:11px;color:var(--dim);letter-spacing:.08em}.levels h2,.debrief h2{color:var(--gold-hi);letter-spacing:.3em;margin:0 0 16px}.lvl-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:10px;margin-bottom:18px}.lvl-grid small{font-size:10px;letter-spacing:.2em;color:var(--dim)}.lvl-grid span{font-size:16px;letter-spacing:.3em}.lvl-grid .cleared{border-color:var(--gold)}.lvl-grid em{position:absolute;top:10px;right:10px;font-style:normal;font-size:9px;letter-spacing:.2em;color:var(--gold)}.play{display:flex;flex-direction:column;gap:12px}.hud{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}.hud-cell{border:1px solid rgba(212,175,55,.22);background:var(--panel);padding:7px 9px;display:flex;flex-direction:column;gap:2px;min-width:0}.hud-cell span{font-size:9px;letter-spacing:.2em;color:var(--dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.hud-cell b{font-size:14px;color:var(--gold-hi)}.hud-cell i{font-size:10px;color:var(--dim);font-style:normal;display:block}.field{position:relative;width:min(100%,560px,68vh);aspect-ratio:1;margin:0 auto;border:1px solid rgba(212,175,55,.3);background:radial-gradient(circle at 50% 50%,#0d0b06,#040404);transition:box-shadow .3s,border-color .3s}.field svg{width:100%;height:100%;display:block;touch-action:none;-webkit-user-select:none;user-select:none;cursor:crosshair}.field.break{border-color:var(--red);box-shadow:0 0 40px #c0392b80;animation:shake .4s}.field.retry{border-color:var(--dim)}.field.sealed{box-shadow:0 0 50px #d4af3773;border-color:var(--gold-hi)}@keyframes shake{20%{transform:translate(-6px)}40%{transform:translate(6px)}60%{transform:translate(-3px)}80%{transform:translate(3px)}}.br{position:absolute;width:14px;height:14px;border:0 solid var(--gold);pointer-events:none;z-index:1}.br.tl{top:-1px;left:-1px;border-width:2px 0 0 2px}.br.tr{top:-1px;right:-1px;border-width:2px 2px 0 0}.br.bl{bottom:-1px;left:-1px;border-width:0 0 2px 2px}.br.brr{bottom:-1px;right:-1px;border-width:0 2px 2px 0}.toast{position:absolute;bottom:10px;left:0;right:0;text-align:center;font-size:11px;letter-spacing:.3em;color:var(--gold-hi);pointer-events:none}.field.break .toast{color:#ff7a6b}.target text{font-size:84px;fill:#d4af370b;font-family:Hiragino Mincho ProN,"Noto Serif JP",serif}.ghost path{fill:none;stroke:var(--gold);stroke-width:5;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:.1 7;transition:opacity .8s}.num circle{fill:#050505;stroke:var(--gold);stroke-width:.6}.num text{fill:var(--gold-hi);font-size:4.6px;font-weight:700;font-family:var(--mono)}.num.cur circle{fill:var(--gold)}.num.cur text{fill:#050505}.pulse{fill:none;stroke:var(--gold-hi);stroke-width:.6;animation:pulse 1.4s infinite}@keyframes pulse{0%{r:2;opacity:1}to{r:8;opacity:0}}.ink{fill:none;stroke:var(--gold);stroke-width:4.2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:0;filter:drop-shadow(0 0 2px rgba(245,215,122,.8));animation:draw .4s ease-out}@keyframes draw{0%{stroke-dashoffset:1}}.live{fill:none;stroke:var(--gold-hi);stroke-width:3.4;stroke-linecap:round;stroke-linejoin:round;opacity:.9;filter:drop-shadow(0 0 3px var(--gold))}.play-actions{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:8px}.eyebrow{font-size:11px;letter-spacing:.25em;color:var(--dim);display:block;margin-bottom:8px}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:14px 0}.stats div{border:1px solid rgba(212,175,55,.25);background:var(--panel);padding:10px;display:flex;flex-direction:column;gap:4px}.stats span{font-size:9px;letter-spacing:.15em;color:var(--dim)}.stats b{color:var(--gold-hi);font-size:20px}.chars{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}.chars div{border:1px solid rgba(212,175,55,.3);padding:8px 12px;text-align:center}.chars div.bad{border-color:var(--red)}.chars span{font-size:28px;color:var(--gold);display:block}.chars small{font-size:9px;letter-spacing:.15em;color:var(--dim)}.lesson{border-left:2px solid var(--gold);padding:6px 14px;margin:16px 0;line-height:1.6;color:var(--gold-hi);font-size:14px}.row{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:14px}.rank{display:flex;align-items:center;gap:16px;border:1px solid var(--gold);background:var(--panel);padding:16px}.rank .lv{font-size:44px;color:var(--gold-hi);width:74px;height:74px;display:grid;place-items:center;border:1px solid var(--gold);box-shadow:0 0 20px #d4af374d inset}.rank>div:last-child{flex:1;display:flex;flex-direction:column;gap:8px}.rank b{letter-spacing:.25em;color:var(--gold-hi)}.rank .bar{width:100%}.rank small{font-size:10px;color:var(--dim);letter-spacing:.15em}.profile h3{letter-spacing:.25em;color:var(--gold);font-size:12px;margin:20px 0 10px}.mastery{display:grid;grid-template-columns:repeat(auto-fill,minmax(78px,1fr));gap:8px}.mastery>div{border:1px solid rgba(212,175,55,.12);padding:8px;text-align:center;opacity:.45}.mastery>div.seen{opacity:1;border-color:#d4af3766}.mastery span{font-size:30px;color:var(--gold);display:block}.mastery small{font-size:10px;color:var(--dim)}.mastery i{display:flex;justify-content:center;gap:3px;margin-top:5px}.mastery u{width:12px;height:3px;background:#2a2514}.mastery u.on{background:var(--gold);box-shadow:0 0 6px var(--gold)}.profile>.ghost-btn{margin-top:14px}@media (max-width: 520px){.hud,.stats{grid-template-columns:repeat(2,1fr)}.xp{margin-left:0;width:100%}.xp i{flex:1}}
