:root{--ink:#1d3320;--cream:#fffbe9;--lime:#cde873;--deep:#17351f;--red:#d6453d;--gold:#ffd23f}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{height:100%}body{margin:0;background:#0e2216;color:var(--cream);font:16px system-ui,sans-serif;overflow:hidden;display:flex;flex-direction:column;height:100dvh;overscroll-behavior:none}
button,.btn{font:inherit;cursor:pointer;border:0;border-radius:14px;padding:10px 16px;font-weight:750;background:var(--cream);color:var(--ink);min-height:44px;display:inline-flex;align-items:center;justify-content:center;text-decoration:none;touch-action:manipulation}
button:focus-visible,.btn:focus-visible{outline:3px solid #ffce73;outline-offset:3px}
button.primary,.btn.primary{background:var(--gold);color:#3b2a00}
button:disabled{opacity:.4}
#xs-top{display:flex;align-items:center;gap:8px;padding:6px 10px;background:#0b1c12;border-bottom:1px solid #ffffff1c;flex:0 0 auto}
#xs-top .brand{font-weight:850;letter-spacing:-1px;font-size:18px;margin-right:auto}.brand span{color:var(--lime)}
#xs-top .tag{font-size:10px;letter-spacing:2px;color:#9fbd98;display:none}
#xs-top button,#xs-top .btn{min-height:44px;padding:6px 12px;font-size:13px}
#xs-stage{position:relative;flex:1 1 auto;min-height:0;overflow:hidden;touch-action:none;user-select:none;-webkit-user-select:none;background:#17351f}
#xs-canvas{position:absolute;inset:0;display:block;touch-action:none}
#xs-hero,.xs-pal{position:absolute;left:0;top:0;pointer-events:none;will-change:transform}
#xs-hero svg,.xs-pal svg{display:block;height:100%;width:auto;overflow:visible}
.xs-pal{height:calc(var(--ph,86px));}
#xs-party .xs-pal{height:auto}
#xs-hud{position:absolute;left:8px;right:8px;top:8px;display:flex;justify-content:space-between;gap:8px;pointer-events:none;flex-wrap:wrap}
.xs-pill{background:#0b1c12cc;border:1px solid #ffffff2b;border-radius:14px;padding:7px 12px;font-size:13px;line-height:1.35;max-width:62%}
.xs-pill b{color:var(--lime)}
#xs-ctl{position:absolute;inset:auto 0 0 0;display:flex;justify-content:space-between;align-items:flex-end;padding:10px 12px calc(10px + env(safe-area-inset-bottom));pointer-events:none}
#xs-ctl .grp{display:flex;gap:10px;align-items:flex-end;pointer-events:none}
.cb{pointer-events:auto;touch-action:none;width:72px;height:72px;border-radius:50%;border:3px solid #ffffff66;background:#0b1c12a6;color:#fff;font-size:28px;font-weight:800;display:flex;align-items:center;justify-content:center;padding:0;min-height:0}
.cb.on{background:var(--gold);color:#3b2a00;transform:scale(.94)}
.cb.big{width:92px;height:92px;font-size:15px;background:#d6453dcc}
.cb.big.on{background:var(--gold)}
.cb small{display:block;font-size:11px;font-weight:800;letter-spacing:.5px}
.cb.v{width:60px;height:60px;font-size:24px}
.col{display:flex;flex-direction:column;gap:8px}
#xs-overlay{position:absolute;inset:0;background:#07140cb3;display:none;align-items:center;justify-content:center;padding:12px;z-index:5;overflow:auto}
#xs-overlay.open{display:flex}
#xs-modal{background:#fffbe9;color:var(--ink);border-radius:22px;max-width:640px;width:100%;padding:18px 20px;box-shadow:0 12px 0 #0a2315,0 24px 40px #0008;max-height:100%;overflow:auto}
.xs-panel{display:flex;gap:16px;align-items:center}.xs-art{flex:0 0 96px;display:flex;justify-content:center}.xs-art img{width:92px;height:auto}.xs-art svg{height:96px;width:auto}
.xs-say{flex:1}.xs-who{font-weight:850;color:#9a5b00;letter-spacing:1px;font-size:12px;text-transform:uppercase}
.xs-say p{font-size:18px;line-height:1.5;margin:6px 0 12px}
.xs-row{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end;align-items:center;margin-top:8px}
.xs-dots{display:flex;gap:6px;justify-content:center;margin-top:10px}.xs-dots i{width:8px;height:8px;border-radius:9px;background:#c9c2a3}.xs-dots i.on{background:var(--red)}
.xs-qh{display:flex;justify-content:space-between;align-items:center;font-weight:800;color:#6a5a2a;font-size:13px;letter-spacing:1px;text-transform:uppercase}
.xs-prompt{font-size:21px;line-height:1.45;margin:10px 0;font-weight:650}
.xs-choices{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:8px}
.xs-choice{min-height:56px;background:#fff;border:3px solid #1d3320;font-size:19px;white-space:normal;line-height:1.2}
.xs-choice:active{background:var(--gold)}.xs-choice.gone{opacity:.25;text-decoration:line-through}
.xs-msg{margin:6px 0;font-weight:800}.xs-msg.ok{color:#1c7a3b;font-size:22px}.xs-msg.bad{color:#9a3b00;font-size:15px}
.xs-ans{font-size:30px;font-weight:850;color:#1c7a3b;text-align:center;margin:6px 0}
.xs-covercard{position:relative}
#xs-cover{position:absolute;inset:0;z-index:6;display:flex;align-items:center;justify-content:center;padding:12px;background:radial-gradient(ellipse at 50% 20%,#1d4d30,#0c2014);overflow:auto}
.xs-covercard{background:#fffbe9;color:var(--ink);border-radius:24px;padding:22px 24px;max-width:560px;width:100%;box-shadow:0 12px 0 #0a2315}
.xs-covercard h2{font:800 clamp(28px,5vw,40px)/1.05 system-ui;letter-spacing:-1px;margin:6px 0 8px}
.xs-eyebrow{font-size:11px;letter-spacing:3px;color:#b0332b;font-weight:800}
.xs-lede{line-height:1.55;font-size:16px;margin:0 0 10px}.xs-small{font-size:12px;color:#5a6a50;margin:10px 0 0;line-height:1.5}
.xs-party{font-size:13px;margin:0 0 8px}.xs-pchip{background:#e5f1c8;border-radius:99px;padding:3px 10px;margin:0 4px;font-weight:700}
.xs-tracks{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:8px 0;font-size:12px;color:#5a6a50}
.xs-track{background:#fff;border:2px solid #1d3320;padding:6px 12px;min-height:44px}.xs-track[aria-pressed=true]{background:var(--lime)}
.xs-end{text-align:center}.xs-end h2{margin:6px 0}.xs-shard{width:92px;height:92px;margin:0 auto;background:var(--c);clip-path:polygon(50% 0,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%)}
@media (min-width:700px){#xs-top .tag{display:block}.cb{width:78px;height:78px}.cb.big{width:100px;height:100px}}
@media (max-height:520px){.cb{width:62px;height:62px}.cb.big{width:78px;height:78px}}
@media (max-width:560px){.xs-panel{flex-direction:column;text-align:left}.xs-choices{grid-template-columns:1fr}.xs-prompt{font-size:19px}.xs-pill{font-size:12px}}
@media (prefers-reduced-motion:reduce){button{transition:none}}
.sr{position:absolute;left:-9999px}
