*{box-sizing:border-box}:root{--dusk: #14172a;--dusk-2: #1b1f36;--paper: #f2e7cf;--paper-2: #f7efdc;--ink: #2a3050;--ink-2: #3a4066;--text: #e9e2cf;--dim: #9a94a8;--amber: #e8a34d;--good: #4f8f5f;--bad: #b5533c;--line-piece: #d8cfe0}html,body{margin:0;padding:0;background:var(--dusk);color:var(--text);font-family:-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;line-height:1.45;-webkit-font-smoothing:antialiased}#app{max-width:480px;margin:0 auto;padding:10px 12px calc(24px + env(safe-area-inset-bottom));min-height:100dvh;display:flex;flex-direction:column}header.top{display:flex;align-items:center;gap:10px;padding:4px 2px 10px}header.top .title{font-size:17px;font-weight:700;letter-spacing:.04em}header.top .spacer{flex:1}.skyline{height:34px;border-radius:8px 8px 0 0;background:radial-gradient(circle at 12% 40%,#ffd98a 0 2.2px,transparent 3px),radial-gradient(circle at 28% 60%,#ffd98a 0 2.2px,transparent 3px),radial-gradient(circle at 44% 35%,#ffd98a 0 2.2px,transparent 3px),radial-gradient(circle at 60% 62%,#ffd98a 0 2.2px,transparent 3px),radial-gradient(circle at 76% 40%,#ffd98a 0 2.2px,transparent 3px),radial-gradient(circle at 90% 58%,#ffd98a 0 2.2px,transparent 3px),linear-gradient(transparent 0 14px,#101324 14px 100%);background-repeat:no-repeat}button{font:inherit;color:inherit;background:var(--dusk-2);border:1px solid #343b5c;border-radius:10px;padding:8px 12px;cursor:pointer;transition:background .15s ease,border-color .15s ease,transform .1s ease}button:hover:not(:disabled){background:#242a48;border-color:#4a527d}button:active:not(:disabled){transform:translateY(1px)}button:disabled{opacity:.45;cursor:default}button:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--amber);outline-offset:2px}.btn-small{font-size:13px;padding:6px 10px}.btn-primary{background:var(--amber);border-color:var(--amber);color:#241a08;font-weight:700}.levelbar{padding:10px 2px 6px}.levelbar .kicker{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--amber);font-weight:700}.levelbar h1{margin:2px 0 4px;font-size:22px}.levelbar .whisper{margin:0;color:var(--dim);font-size:14px;font-style:italic}.targets{display:flex;gap:8px;flex-wrap:wrap;padding:8px 0 12px}.targets .label{width:100%;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);padding-bottom:2px}.target{background:var(--dusk-2);border:1px solid #343b5c;border-radius:10px;padding:6px 6px 4px;position:relative;width:76px}.target .num{font-size:11px;color:var(--dim);text-align:center;display:block;padding-bottom:3px;font-weight:700}.target .row{display:flex;gap:1px;justify-content:center}.target .row svg{width:13px;height:16px}.target{cursor:pointer}.target.current{border-color:var(--amber)}.target.hit{border-color:var(--good)}.target.miss{border-color:var(--bad)}.target .stamp{position:absolute;top:-7px;right:-5px;font-size:13px;font-weight:900;background:var(--dusk);border-radius:6px;padding:0 3px}.target.hit .stamp{color:#9fd8ac}.target.miss .stamp{color:#f0a08c}.board{display:flex;flex-direction:column;gap:10px}.panel-label{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);display:flex;justify-content:space-between;align-items:baseline}.panel-label .beat-now{color:var(--amber);font-weight:700;letter-spacing:.06em}.wall{background:var(--paper);border-radius:12px;padding:10px 10px 8px;display:flex;gap:4px;justify-content:space-between;box-shadow:inset 0 0 0 1px #d9cbaa,0 2px 10px #00000059;position:relative;min-height:128px}.wall .col{flex:1;display:flex;align-items:flex-start;justify-content:center;border-left:1px dashed rgba(42,48,80,.18);padding:2px 0;border-radius:6px}.wall .col:first-child{border-left:none}.wall .col svg{width:100%;max-width:58px;height:104px}.wall .col .fill{fill:var(--ink)}.wall .col.cloth-cell svg .fill{fill:var(--ink-2)}.wall .col.glow{background:#e8a34d47}.wall.flash-good{box-shadow:inset 0 0 0 2px var(--good),0 2px 10px #00000059}.wall.flash-bad{box-shadow:inset 0 0 0 2px var(--bad),0 2px 10px #00000059}.candle{position:absolute;right:10px;bottom:-14px;width:14px;height:18px}.candle .flame{position:absolute;left:4px;top:-8px;width:6px;height:10px;background:radial-gradient(circle at 50% 70%,#fff3c4 0 20%,#e8a34d 60%,transparent 75%);border-radius:50%/62% 62% 38% 38%;animation:flicker 2.2s ease-in-out infinite}@keyframes flicker{0%,to{transform:scale(1) rotate(-2deg)}30%{transform:scale(1.12,.94) rotate(2deg)}60%{transform:scale(.94,1.1) rotate(-1deg)}}.lineview{padding-top:4px}.lineview .rope{height:22px;margin:0 6px;border-top:2px solid #565f8a;position:relative}.lineview .rope:before,.lineview .rope:after{content:"";position:absolute;top:-8px;width:3px;height:26px;background:#565f8a;border-radius:2px}.lineview .rope:before{left:0}.lineview .rope:after{right:0}.pegs{display:flex;gap:4px;justify-content:space-between;padding:0 2px}.peg{flex:1;display:flex;flex-direction:column;align-items:center;position:relative;border-top:8px solid #6b74a3;border-left:4px solid transparent;border-right:4px solid transparent;margin-top:-2px;padding-top:2px;border-radius:2px;background:transparent}.peg svg{width:100%;max-width:52px;height:88px;cursor:pointer}.peg svg .fill{fill:var(--line-piece)}.peg.is-centre{background:#e8a34d1a;border-radius:0 0 8px 8px}.peg .centre-tag{font-size:10px;color:var(--amber);letter-spacing:.08em;padding:1px 0 3px;font-weight:700}.peg .cloth-overlay{position:absolute;inset:6px 6px 2px;background:repeating-linear-gradient(180deg,#4b4270 0 6px,#5a5183 6px 12px);border-radius:4px 4px 8px 8px;opacity:.92}.peg .cloth-overlay:after{content:"cloth";position:absolute;bottom:4px;left:0;right:0;text-align:center;font-size:9px;color:#d8cfe0;letter-spacing:.1em}.ticket{background:var(--paper-2);color:#2b2417;border-radius:12px;padding:10px 12px 12px;margin-top:12px;position:relative}.ticket:before{content:"";position:absolute;left:10px;right:10px;top:30px;border-top:2px dashed #c9b98f}.ticket .t-head{display:flex;justify-content:space-between;align-items:baseline;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#8a7a54;font-weight:700;padding-bottom:14px}.slots{display:flex;gap:8px;justify-content:center;padding:4px 0 10px}.slot{width:52px;height:52px;border:2px solid #c9b98f;border-radius:10px;background:#fffaf0;display:flex;flex-direction:column;align-items:center;justify-content:center;font-weight:800;color:#2b2417}.slot .icon{font-size:22px;line-height:1}.slot .vn{font-size:9px;letter-spacing:.08em;text-transform:uppercase;color:#8a7a54}.slot.filled{border-color:#2b2417;background:#f1e4c2}.slot.next{border-color:var(--amber);box-shadow:0 0 0 2px #e8a34d80}.chips{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;padding-bottom:10px}.chip{display:flex;flex-direction:column;align-items:center;min-width:74px;padding:7px 8px 5px;background:#2b2417;color:#f7efdc;border:1px solid #4a4030;border-radius:10px}.chip .icon{font-size:19px;line-height:1.1}.chip .vn{font-size:10px;letter-spacing:.1em;text-transform:uppercase;margin-top:2px}.chip .hint-line{font-size:9px;color:#b3a888;margin-top:1px}.ticket-actions{display:flex;gap:8px;justify-content:center}.ticket-actions .btn-primary{flex:1}.feedback{margin-top:10px;min-height:24px;font-size:14px;text-align:center;color:var(--dim)}.feedback.good{color:#9fd8ac}.feedback.bad{color:#f0a08c}.nav-row{display:flex;justify-content:space-between;gap:8px;padding-top:14px}.overlay{position:fixed;inset:0;background:#0c0e1ad1;display:flex;align-items:center;justify-content:center;padding:20px;z-index:40}.sheet{background:var(--dusk-2);border:1px solid #343b5c;border-radius:14px;padding:18px;max-width:440px;width:100%;max-height:86dvh;overflow-y:auto}.sheet h2{margin:0 0 8px;font-size:20px}.sheet p{margin:6px 0;font-size:14px;color:var(--text)}.sheet .muted{color:var(--dim)}.sheet .actions{display:flex;gap:8px;margin-top:14px;flex-wrap:wrap}.sheet .actions .btn-primary{flex:1}.level-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin:10px 0}.lv-card{display:flex;flex-direction:column;align-items:flex-start;gap:2px;text-align:left;padding:10px 12px}.lv-card .n{font-size:12px;color:var(--amber);font-weight:800;letter-spacing:.08em}.lv-card .nm{font-weight:700}.lv-card .done{font-size:12px;color:#9fd8ac}.lv-card.locked{opacity:.55}.lv-card .locknote{font-size:11px;color:var(--dim)}.howto-verb{display:flex;gap:10px;align-items:baseline;margin:8px 0}.howto-verb .ic{font-size:18px;width:26px;text-align:center;flex:none}.howto-verb b{font-size:14px}.howto-verb span.d{font-size:13px;color:var(--dim);display:block}.win-note{font-size:15px;text-align:center;margin:8px 0 2px;font-weight:700}.win-sub{text-align:center;color:var(--dim);font-size:13px;margin:4px 0 0}.seed-line{display:flex;gap:8px;align-items:center;justify-content:space-between;padding:2px 0 10px;font-size:13px;color:var(--dim)}.footnote{text-align:center;color:#6f6a85;font-size:11px;padding-top:18px}.frame-big{display:flex;gap:8px;justify-content:center;background:var(--paper);border-radius:12px;padding:14px 10px;margin:10px 0 4px;box-shadow:inset 0 0 0 1px #d9cbaa}.frame-big svg{width:52px;height:100px}.frame-big svg .fill{fill:var(--ink)}.frame-big svg.cloth .fill{fill:var(--ink-2)}body.running header.top button{pointer-events:none;opacity:.45}@media(prefers-reduced-motion:reduce){.candle .flame{animation:none}*{transition:none!important}}