:root{--bg-top:#1d2a33;--bg-bottom:#0b1014;--panel:#10161bd6;--border:#ffffff17;--text:#e6ebee;--muted:#8d989f;--accent:#7fdbca;--gold:#f3c969}*{box-sizing:border-box}html,body{height:100%;color:var(--text);background:radial-gradient(ellipse at 45% 35%, var(--bg-top), var(--bg-bottom) 75%);margin:0;font:14px/1.5 Inter,system-ui,sans-serif;overflow:hidden}#stage{position:fixed;inset:0}#stage canvas{cursor:grab;touch-action:none;-webkit-tap-highlight-color:transparent;display:block}#stage canvas.dragging{cursor:grabbing}#stage canvas.pointer{cursor:pointer}.panel{background:var(--panel);border:1px solid var(--border);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:14px;flex-direction:column;gap:10px;width:270px;padding:18px;display:flex;position:fixed;top:16px;bottom:16px;right:16px;overflow-y:auto}h1{margin:0;font-size:18px}h2{color:var(--muted);text-transform:uppercase;letter-spacing:.12em;margin:8px 0 0;font-size:11px;font-weight:500}.muted{color:var(--muted);margin:0;font-size:12px}.scores{grid-template-columns:1fr 1fr;gap:8px;display:grid}.scores>div{background:#00000040;border-radius:10px;flex-direction:column;padding:8px 12px;display:flex}.scores .label{color:var(--muted);text-transform:uppercase;letter-spacing:.1em;font-size:11px}.score{font-variant-numeric:tabular-nums;font-size:28px;font-weight:600}.status{align-items:center;gap:8px;min-height:42px;font-weight:600;display:flex}.dot{background:var(--accent);border-radius:50%;flex:none;width:12px;height:12px}.dot.bot{background:var(--gold)}.facts{grid-template-columns:1fr 1fr;gap:8px;margin:0;display:grid}.facts dt{color:var(--muted);font-size:11px}.facts dd{margin:0;font-size:18px;font-weight:600}.row{gap:6px;display:flex}.row>*{flex:1}button{font:inherit;color:var(--text);border:1px solid var(--border);cursor:pointer;background:#ffffff0f;border-radius:8px;padding:8px}button:hover{background:#ffffff1f}.help p{color:#c3cbd0;margin:6px 0;font-size:12.5px}.toast{border:1px solid var(--border);opacity:0;pointer-events:none;background:#10161be6;border-radius:99px;padding:8px 16px;font-weight:500;transition:opacity .2s,transform .2s;position:fixed;top:20px;left:calc(50% - 150px);transform:translate(-50%,-10px)}.toast.show{opacity:1;transform:translate(-50%)}.toast.good{color:var(--accent)}.toast.bad{color:var(--gold)}.modal{background:#00000059;place-items:center;display:grid;position:fixed;inset:0}.modal[hidden]{display:none}.modal-card{text-align:center;border:1px solid var(--border);background:#151c21;border-radius:16px;min-width:280px;padding:22px 26px;box-shadow:0 20px 60px #00000080}.modal-card h2{color:var(--text);text-transform:none;letter-spacing:0;margin:0 0 10px;font-size:22px;font-weight:600}.modal-card p{color:#c3cbd0;margin:4px 0}.modal-card button{border-color:var(--accent);color:var(--accent);margin-top:14px;padding:10px 22px}.only-touch{display:none}@media (pointer:coarse){.only-touch{display:block}.only-mouse{display:none}button{touch-action:manipulation;min-height:44px}}@media (width<=700px){.panel{top:auto;left:8px;right:8px;bottom:calc(8px + env(safe-area-inset-bottom,0px));grid-template-columns:1fr 1fr;align-content:start;gap:8px;width:auto;height:min(34vh,300px);padding:12px 14px;display:grid}.panel>*{grid-column:1/-1}.panel h1{grid-column:1;font-size:15px}.panel #round{text-align:right;grid-column:2;align-self:center}.scores>div{flex-direction:row;justify-content:space-between;align-items:baseline;padding:4px 10px}.score{font-size:22px}.status{min-height:0}.facts{gap:16px;display:flex}.facts>div{align-items:baseline;gap:6px;display:flex}.facts dd{font-size:15px}.panel>h2:first-of-type{display:none}.panel>.row{grid-column:1}.panel>#new-game{grid-column:2}.help{margin-top:4px}.toast{left:50%;top:calc(12px + env(safe-area-inset-top,0px));max-width:calc(100vw - 32px)}}@media (height<=500px) and (width>=701px){.panel{width:220px;top:8px;bottom:8px;right:calc(8px + env(safe-area-inset-right,0px));gap:8px;padding:12px}.panel h1{font-size:15px}.scores>div{padding:4px 10px}.score{font-size:20px}.status{min-height:0}.facts dd{font-size:15px}h2{margin-top:2px}.toast{left:calc(50% - 118px)}}
