:root{--bg: #0c1410;--panel: #16201a;--line: #27382d;--ink: #eaf5ee;--dim: #8fb09c;--accent: #36c98a;--coin: #f2c14e;--warn: #e8643a;--slot: #1c2a22;--slot2: #243730}*{box-sizing:border-box}html,body{margin:0;height:100%}body{background:radial-gradient(900px 560px at 50% -8%,#122019,var(--bg));color:var(--ink);font-family:system-ui,-apple-system,Segoe UI,sans-serif;display:flex;justify-content:center;-webkit-user-select:none;user-select:none}#app{width:100%;max-width:560px;padding:12px 12px 26px}header{text-align:center;margin-bottom:6px}h1{margin:0;font-size:25px;letter-spacing:3px;font-weight:800;color:var(--accent)}.sub{margin:3px 0 0;color:var(--dim);font-size:12.5px}.sub b{color:var(--ink)}.bar{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;align-items:center;margin:8px 0}.seg{display:inline-flex;background:var(--panel);border:1px solid var(--line);border-radius:999px;overflow:hidden}.seg button{background:none;border:none;color:var(--dim);padding:6px 13px;font:600 13px system-ui;cursor:pointer}.seg button.active{background:var(--accent);color:#042015}.btn{background:var(--panel);border:1px solid var(--line);color:var(--ink);padding:7px 14px;border-radius:999px;font:700 13px system-ui;cursor:pointer}.btn:hover{border-color:var(--accent)}.btn:disabled{opacity:.4;cursor:not-allowed}.btn.primary{background:var(--accent);color:#042015;border-color:var(--accent)}.btn.ghost{background:transparent}.dup{color:var(--dim);font-size:13px;display:inline-flex;align-items:center;gap:6px;cursor:pointer}.dup input{accent-color:var(--accent)}.scoreboard{display:flex;gap:10px;justify-content:center;margin:8px 0;flex-wrap:wrap}.readout{background:#08120d;border:1px solid var(--line);border-radius:8px;padding:5px 16px;font:800 18px ui-monospace,monospace;color:var(--accent);min-width:96px;text-align:center}.readout.coins{color:var(--coin)}.readout span{color:var(--dim);font-size:11px;display:block;font-weight:600;letter-spacing:.5px}.readout.warn{color:var(--warn);animation:pulse 1s ease-in-out infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.55}}.stage{position:relative;display:flex;justify-content:center}.board{display:flex;flex-direction:column;gap:6px;background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:8px;width:min(94vw,480px)}.boardhead{display:flex;justify-content:space-between;color:var(--dim);font-size:11px;font-weight:700;letter-spacing:.5px;padding:0 6px 2px}.guessrow{display:flex;align-items:center;gap:10px;justify-content:space-between;border-radius:8px;padding:4px 6px}.guessrow.active{background:#1b2922;box-shadow:inset 0 0 0 1px var(--accent)}.guessrow.done{background:#101a14}.guessrow.latest.done{box-shadow:inset 0 0 0 1px var(--coin)}.slots{display:flex;gap:8px}.slot{width:clamp(26px,8.5vw,38px);aspect-ratio:1;border-radius:50%;display:flex;align-items:center;justify-content:center}.slot.empty{background:var(--slot);box-shadow:inset 0 2px 4px #0006}.slot.draft{cursor:pointer}.peg{width:100%;height:100%;border-radius:50%;display:flex;align-items:center;justify-content:center;font:800 12px ui-monospace,monospace;color:#0c0c0c;text-shadow:0 1px 0 rgba(255,255,255,.25);box-shadow:inset 0 -3px 6px #00000059,0 1px 2px #0006}.fb{display:flex;gap:6px;align-items:center;min-width:96px;justify-content:flex-end}.fbcell{font:800 13px ui-monospace,monospace;min-width:24px;text-align:center;padding:2px 5px;border-radius:6px;border:1px solid var(--line)}.fbcell.b{color:#cfd8e0}.fbcell.w{color:#f3f7fa}.fbcell.locked{color:var(--dim);opacity:.55}.fbcell .q{color:var(--dim)}.secretrow{display:flex;gap:8px;align-items:center;justify-content:center;margin:6px 0 2px}.secretrow .slot{box-shadow:inset 0 2px 4px #00000080}.secretrow .slot.rev{box-shadow:inset 0 0 0 2px var(--coin)}.secretrow .slot.hidden-peg{background:var(--slot2);position:relative}.secretrow .slot.hidden-peg:after{content:"?";color:var(--dim);font:800 16px ui-monospace}.shop{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:10px;margin:12px auto 0;width:min(94vw,480px)}.shop h3{margin:0 0 4px;font-size:13px;color:var(--accent);letter-spacing:.5px}.shop .shopsub{color:var(--dim);font-size:11.5px;margin:0 0 8px}.shopgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.shopbtn{display:flex;flex-direction:column;align-items:center;gap:3px;background:#0e1813;border:1px solid var(--line);border-radius:9px;padding:9px 4px;cursor:pointer;color:var(--ink)}.shopbtn:hover:not(:disabled){border-color:var(--coin)}.shopbtn:disabled{opacity:.4;cursor:not-allowed}.shopbtn .lab{font:700 12px system-ui}.shopbtn .price{font:800 13px ui-monospace;color:var(--coin)}.shopbtn .val{font:800 14px ui-monospace;color:var(--accent);min-height:17px}.stallbar{display:flex;align-items:center;justify-content:center;gap:8px;margin:10px auto 0;width:min(94vw,480px);color:var(--dim);font-size:12.5px}.stallbar.danger,.stallbar b{color:var(--warn)}.reshuffle-note{color:var(--warn);font-size:12px;text-align:center;margin:6px auto 0;min-height:16px}.palette{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin:14px auto 0;max-width:440px}.swatch{width:clamp(32px,10vw,44px);aspect-ratio:1;border-radius:50%;border:2px solid rgba(255,255,255,.15);cursor:pointer;font:800 15px ui-monospace,monospace;color:#0c0c0c;text-shadow:0 1px 0 rgba(255,255,255,.25);box-shadow:inset 0 -3px 6px #00000059}.swatch:hover{border-color:#fff;transform:translateY(-2px)}.controls{display:flex;gap:10px;justify-content:center;margin:14px 0 0;flex-wrap:wrap}.overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#060c09d9;border-radius:10px;backdrop-filter:blur(3px)}.overlay.hidden{display:none}.card{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:22px 26px;text-align:center;max-width:360px}.card h2{margin:0 0 6px;font-size:24px;color:var(--accent)}.card.lose h2{color:var(--warn)}.card p{margin:6px 0;color:var(--dim);font-size:14px}.card p b{color:var(--coin)}.card .reveal{display:flex;gap:8px;justify-content:center;margin:10px 0}.card .reveal .peg{width:34px;height:34px}.card .row{display:flex;gap:8px;justify-content:center;margin-top:14px}.legend{text-align:center;color:var(--dim);font-size:12.5px;margin-top:12px}.legend b{color:var(--accent)}.hint{text-align:center;color:var(--dim);font-size:12px;margin-top:8px;line-height:1.5}
