:root{color-scheme:dark;--bg: #08130f;--bg-2: #0b1914;--surface: #11241e;--surface-2: #18372a;--card-grad: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%);--ink: #ffffff;--ink-2: #a4b7ae;--ink-3: #82978c;--rule: #243d31;--rule-2: #3b5748;--brand: #00ff88;--brand-soft: rgba(0, 255, 136, .1);--brand-band: rgba(0, 255, 136, .3);--glow: 0 0 30px rgba(0, 255, 136, .4);--accent: #6bcbff;--accent-soft: rgba(107, 203, 255, .15);--accent-band: rgba(107, 203, 255, .22);--gold: #f3c969;--gold-soft: rgba(243, 201, 105, .12);--gold-band: rgba(243, 201, 105, .35);--good: #00ff88;--good-bg: rgba(0, 255, 136, .1);--warn: #ffd93d;--warn-bg: rgba(255, 217, 61, .1);--crit: #ff6b6b;--crit-bg: rgba(255, 107, 107, .1);--grid: rgba(255, 255, 255, .085);--shadow: 0 2px 6px rgba(0, 0, 0, .35), 0 10px 30px rgba(0, 0, 0, .28);--radius: 14px;--radius-sm: 8px;--radius-pill: 999px;--sans: "Space Grotesk", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;--display: "Space Grotesk", ui-sans-serif, system-ui, sans-serif;--mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;--felt: radial-gradient(900px 400px at 50% 0%, rgba(107, 203, 255, .08), transparent 60%);--bj-felt: #1d6a44;--bj-felt-dark: #124a2f;--bj-rail: #1b1410;--bj-rail-light: #3a2a1f}*{box-sizing:border-box}html,body{margin:0;height:100%}body{height:100dvh;background:var(--bg);color:var(--ink);font-family:var(--sans);font-size:14px;line-height:1.45;-webkit-font-smoothing:antialiased;overflow:hidden}button{font:inherit;color:inherit;touch-action:manipulation;-webkit-tap-highlight-color:transparent}button:focus-visible{outline:2px solid var(--brand);outline-offset:4px}a{color:var(--accent)}#app{height:100%}.app{display:grid;grid-template-rows:auto 1fr auto;height:100%;padding:var(--grove-bar-top, 0px) var(--grove-bar-right, 0px) var(--grove-bar-bottom, 0px) var(--grove-bar-left, 0px);background:radial-gradient(ellipse at 50% 40%,#142c25,var(--bg) 72%)}.stage{position:relative;min-height:0}.canvas-host{position:absolute;inset:0}.stage canvas{display:block;width:100%;height:100%}.banner{display:flex;gap:14px;align-items:center;padding:7px 24px;font-size:12px;border-bottom:1px solid var(--rule);background:var(--surface)}.banner b{font-size:10px;letter-spacing:2px;text-transform:uppercase}.banner.warn{background:var(--warn-bg);color:var(--warn)}.banner.crit{background:var(--crit-bg);color:var(--crit)}.banner.info{background:var(--brand-soft);color:var(--ink-2)}.banner.info b{color:var(--gold)}.panel{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) 502px;height:186px;min-height:186px;gap:24px;align-items:center;padding:18px 26px;border-top:1px solid var(--gold-band);background:linear-gradient(180deg,#11241f,#0b1714);box-shadow:0 -12px 45px #0003}.hud{display:flex;flex-direction:column;gap:6px;min-width:0}.hud .who{display:flex;align-items:center;gap:12px;min-width:0}.hud .identity{min-width:0}.hud .av{width:44px;height:44px;border-radius:14px;display:inline-flex;align-items:center;justify-content:center;font-size:25px;background:var(--brand-soft);border:1px solid var(--brand-band);cursor:pointer;flex:none;transition:background .15s}.hud .av:hover{background:var(--brand-band)}.hud .name{font-family:var(--display);font-weight:600;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.hud .name .demo{margin-left:8px;padding:2px 5px;border:1px solid var(--gold-band);border-radius:4px;color:var(--gold);font-family:var(--mono);font-size:8px;letter-spacing:.12em;vertical-align:2px}.hud .bal{font-family:var(--mono);font-variant-numeric:tabular-nums;font-size:14px;white-space:nowrap}.hud .bal .tok{color:var(--brand);font-weight:600}.hud .bal .eur{color:var(--gold)}.hud .bal .sep{color:var(--ink-3);margin:0 7px}.hud .sub{color:var(--ink-3);font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.hud .sub button{color:var(--ink-2);background:none;border:0;padding:0;cursor:pointer;text-decoration:underline;text-underline-offset:3px}.avatars{position:absolute;bottom:145px;left:24px;z-index:10;display:grid;grid-template-columns:repeat(6,36px);gap:6px;padding:10px;background:var(--surface);border:1px solid var(--brand-band);border-radius:14px;box-shadow:var(--shadow)}.avatars button{width:36px;height:36px;border-radius:8px;border:1px solid transparent;background:var(--bg);font-size:20px;cursor:pointer}.avatars button.on{border-color:var(--brand)}.phase{text-align:center;min-width:0}.phase .eyebrow{color:var(--ink-3);text-transform:uppercase;letter-spacing:2px;font-size:9px;margin-bottom:5px}.phase .lbl{font-family:var(--display);font-weight:600;font-size:21px;letter-spacing:-.03em}.phase .lbl.turn{color:var(--brand)}.phase .lbl.win{color:var(--gold)}.phase .lbl.lose{color:var(--crit)}.phase .cnt{display:inline-flex;align-items:center;justify-content:center;min-width:32px;height:26px;padding:0 6px;margin-left:8px;border:1px solid var(--rule-2);border-radius:7px;font-family:var(--mono);color:var(--ink-2);font-size:12px;vertical-align:2px}.phase .msg{color:var(--ink-2);font-size:11px;margin-top:4px;max-width:260px;margin-inline:auto}.controls{display:flex;flex-direction:column;align-items:flex-end;gap:10px;min-width:0}.row{display:flex;gap:8px;align-items:center;flex-wrap:wrap;justify-content:flex-end}.btn{position:relative;padding:13px 20px;min-height:46px;border-radius:10px;border:1px solid var(--rule-2);background:linear-gradient(180deg,#243b34,#162c25);color:var(--ink);font-weight:600;cursor:pointer;box-shadow:inset 0 1px #ffffff0a,0 3px 6px #0002;transition:transform .12s,border-color .15s,background .15s,box-shadow .15s;white-space:nowrap}.btn:hover:not(:disabled){border-color:var(--brand);transform:translateY(-2px);box-shadow:0 4px 14px #0004}.btn:active:not(:disabled){transform:translateY(1px);box-shadow:inset 0 2px 5px #0004}.btn:disabled{opacity:.32;cursor:default;box-shadow:none}.btn.primary{background:var(--brand);color:var(--bg);border-color:var(--brand);box-shadow:0 3px 15px var(--brand-soft),inset 0 1px #fff5}.btn.primary:hover:not(:disabled){box-shadow:0 0 24px var(--brand-band)}.btn.gold{background:linear-gradient(180deg,#f8dc98,var(--gold));color:#1f241c;border-color:var(--gold)}.btn.split{color:var(--gold);border-color:var(--gold-band)}.btn.ghost{background:transparent;box-shadow:none}.btn.sm{padding:8px 13px;min-height:36px;font-size:11px}.btn.danger{color:var(--crit);border-color:var(--crit);background:transparent}.action-row{gap:10px}.action-row .btn{min-width:80px;min-height:60px;font-size:16px}.action-row .btn small{display:block;font-size:8px;font-weight:500;letter-spacing:1px;opacity:.65;margin-top:3px}.chips{display:flex;gap:5px;max-width:100%;overflow-x:auto;padding:8px 10px;border-radius:14px;border:1px solid var(--gold-band);background:#040d0a99;box-shadow:inset 0 3px 9px #0008,0 1px #ffffff09;scrollbar-width:none}.chips::-webkit-scrollbar{display:none}.chip{flex:none;width:60px;height:60px;border-radius:50%;border:0;cursor:pointer;font-family:var(--mono);font-weight:700;font-size:13px;color:#fff;text-shadow:0 1px 3px #000;background:transparent center / 110% no-repeat;transition:transform .15s,filter .15s;user-select:none;filter:drop-shadow(0 3px 2px #0008)}.chip:hover:not(:disabled){transform:translateY(-4px) rotate(-6deg);filter:brightness(1.15) drop-shadow(0 5px 3px #0008)}.chip:active:not(:disabled){transform:translateY(2px) scale(.94);filter:brightness(.85) drop-shadow(0 1px 1px #0008)}.chip:disabled{opacity:.32;cursor:default}.chip.c10,.pile-chip.c10{color:#17211b;text-shadow:0 1px #ffffff55}.bet-submit{flex-wrap:nowrap;min-height:62px}.pending-bet{display:flex;align-items:center;gap:6px;margin-left:5px}.pending-pile{position:relative;width:54px;height:44px;flex:none;margin-top:16px}.pending-pile.two{width:84px}.pending-pile.empty:after{content:"";position:absolute;inset:3px 8px;border:1px dashed var(--gold-band);border-radius:50%}.pile-chip{position:absolute;left:calc(50% - 22px);top:0;width:44px;height:44px;display:grid;place-items:center;transform:translate(var(--chip-x),var(--chip-y));border-radius:50%;background:transparent center / 110% no-repeat;color:#fff;font:700 10px var(--mono);text-shadow:0 1px 3px #000;filter:drop-shadow(0 2px 2px #0006)}.pend{font-family:var(--mono);font-variant-numeric:tabular-nums;font-size:15px;color:var(--gold);min-width:78px;text-align:right}.pend small{color:var(--ink-3);display:block;font-size:9px;text-transform:uppercase;letter-spacing:1px;margin-top:3px}.pend.idle{min-width:0;font:11px var(--sans);color:var(--ink-3)}.error{position:absolute;left:50%;top:12px;transform:translate(-50%);z-index:15;padding:12px 18px;border-radius:10px;background:var(--surface);border:1px solid var(--crit);color:var(--ink);box-shadow:var(--shadow);max-width:min(90vw,520px)}.boot{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:var(--ink-2);font-size:15px}.boot .dot{width:8px;height:8px;border-radius:50%;background:var(--brand);margin-right:10px;box-shadow:var(--glow);animation:pulse 1s infinite alternate}@keyframes pulse{0%{opacity:.4}to{opacity:1}}.rotate{position:absolute;inset:0;z-index:12;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:32px;text-align:center;background:radial-gradient(ellipse at center,#14392c,var(--bg) 80%);color:var(--ink-2)}.rotate svg{width:64px;height:64px;color:var(--brand);margin-bottom:12px;animation:turn 2.4s ease-in-out infinite}.rotate b{font-family:var(--display);font-size:24px;font-weight:600;color:var(--ink)}.rotate span{max-width:260px;font-size:13px}@keyframes turn{0%,20%{transform:rotate(0)}50%,to{transform:rotate(90deg)}}.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}@media(max-width:1100px)and (min-height:521px){.panel{gap:14px;padding:14px 18px;grid-template-columns:minmax(0,1fr) minmax(0,.7fr) 454px;height:178px;min-height:178px}.chip{width:56px;height:56px}.phase .lbl{font-size:18px}.action-row .btn{min-width:68px;padding-inline:14px}}@media(max-width:699px)and (orientation:portrait){.panel{grid-template-columns:1fr;gap:0;padding:16px;height:148px;min-height:148px}.panel .phase,.panel .controls,.hud .sub{display:none}.banner{padding:8px 14px;font-size:11px}.banner b{display:none}}@media(max-height:520px)and (orientation:landscape){.app{grid-template-rows:auto 1fr 0}.stage{--panel-inset: 88px}.panel{position:absolute;left:var(--grove-bar-left, 0px);right:var(--grove-bar-right, 0px);bottom:var(--grove-bar-bottom, 0px);z-index:8;height:88px;min-height:88px;grid-template-columns:minmax(150px,1fr) minmax(115px,.8fr) auto;grid-template-rows:auto;gap:12px;padding:7px 14px;background:#0b1b17f5;backdrop-filter:blur(12px)}.hud{gap:0}.hud .sub{display:none}.hud .av{width:32px;height:36px;border-radius:10px;font-size:19px}.hud .who{gap:8px}.hud .name{font-size:12px}.hud .bal{font-size:11px}.hud .name .demo{display:none}.phase .eyebrow{font-size:7px;margin-bottom:3px}.phase .lbl{font-size:15px}.phase .cnt{font-size:10px;min-width:24px;height:22px;margin-left:5px}.phase .msg{font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:160px}.controls{gap:4px}.controls .row{flex-wrap:nowrap;gap:5px}.btn{padding:7px 12px;min-height:32px;font-size:12px;border-radius:8px}.btn.sm{padding:3px 8px;min-height:24px;font-size:9px}.action-row .btn{min-width:60px;min-height:46px;font-size:13px}.action-row .btn small{font-size:6px}.chips{padding:2px 5px;gap:3px;border-radius:8px}.chip{width:36px;height:36px;font-size:9px}.betting .btn{padding:3px 10px;min-height:26px;font-size:10px}.betting .btn.sm{min-height:26px}.bet-submit{min-height:28px}.pending-bet{gap:2px;margin-left:0}.pending-pile{width:30px;height:26px;margin-top:0}.pending-pile.two{width:42px}.pile-chip{left:calc(50% - 22px);top:-2px;transform:scale(.5) translate(var(--chip-x),var(--chip-y))}.pending-pile.empty:after{inset:3px}.pend{min-width:58px;font-size:11px}.pend small{font-size:7px;margin-top:0}.avatars{bottom:84px}.banner{padding:3px 12px;font-size:10px}.banner b{font-size:8px}}@media(max-width:720px)and (orientation:landscape){.panel{grid-template-columns:minmax(125px,1fr) minmax(90px,.7fr) auto;padding-inline:10px;gap:8px}.chip{width:31px;height:31px;font-size:8px}.action-row .btn{min-width:52px;padding-inline:10px}.hud .bal{font-size:9px}.hud .bal .sep{margin-inline:3px}.hud .av{display:none}.phase .msg{max-width:100px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}