:root{--app-header-h:64px;--game-main-pad:8px;--game-radius:var(--radius-3);--game-surface:var(--surface);--game-surface-strong:var(--surface-raised);--game-border:var(--border);--game-muted:var(--ink-muted);--game-gold:var(--yellow);--game-gold-deep:var(--on-yellow-soft);--game-navy:var(--on-yellow)}.game-screen{height:calc(100vh - var(--app-header-h) - var(--game-main-pad) * 2);height:calc(100dvh - var(--app-header-h) - var(--game-main-pad) * 2);flex-direction:column;gap:.5rem;min-height:420px;display:flex;position:relative}.game-screen-body{flex-direction:column;flex:auto;min-height:0;display:flex}.game-screen-fill{flex-direction:column;flex:auto;min-width:0;min-height:0;display:flex}.game-pill{border-radius:var(--radius-pill);background:var(--surface-sunken);min-height:2rem;color:var(--ink);font-family:var(--font-text);white-space:nowrap;border:1px solid #0000;align-items:center;gap:.35rem;padding:0 .75rem;font-size:13px;font-weight:800;line-height:16px;display:inline-flex}.game-pill svg{flex:none}.game-pill--accent{background:var(--primary-soft);color:var(--on-primary-soft);border-color:#0000}.game-icon-btn{border:2px solid var(--border);border-radius:var(--radius-pill);background:var(--surface);width:2.25rem;height:2.25rem;color:var(--ink-muted);transition:border-color var(--dur-2) var(--ease-standard), color var(--dur-2) var(--ease-standard), transform var(--dur-2) var(--ease-spring);justify-content:center;align-items:center;display:inline-flex}.game-icon-btn:hover{border-color:var(--border-strong);color:var(--ink)}.game-icon-btn:active{transform:scale(.94)}.game-bar{border:1px solid var(--border);border-radius:var(--radius-3);background:var(--surface);min-width:0;min-height:3rem;color:var(--ink);box-shadow:var(--elevation-1);transition:background-color var(--dur-2) var(--ease-standard), border-color var(--dur-2) var(--ease-standard);flex:none;align-items:center;gap:.5rem;padding:.3rem .4rem;display:flex;position:relative}.game-bar-lead{flex:none;align-items:center;gap:.5rem;min-width:0;display:flex}.game-bar-icon{flex:none;width:2rem}.game-bar-title{min-width:0;font-family:var(--font-display);white-space:nowrap;text-overflow:ellipsis;font-size:20px;font-weight:600;line-height:24px;overflow:hidden}.game-bar-mode,.game-bar-spectating{flex:none}.game-bar-status{flex:auto;align-items:center;min-width:0;display:flex}.game-bar-status:not(:empty){border-left:1px solid var(--border);padding-left:.6rem}.game-bar-trail{flex:none;align-items:center;gap:.4rem;margin-left:auto;display:flex}.game-bar-chrome{align-items:center;gap:.4rem;display:none}@media (orientation:landscape) and (height<=500px){.game-bar-chrome{display:flex}.game-screen{min-height:0}}.game-bar-code{border-radius:var(--radius-pill);background:var(--surface-sunken);color:var(--ink);padding:.3rem .7rem}.game-bar:has(.game-status.is-my-turn){border-color:var(--primary);background:var(--primary-soft);color:var(--on-primary-soft);box-shadow:0 0 0 1px var(--primary), var(--glow-primary);animation:game-turn-in var(--dur-3) var(--ease-spring)}.game-bar:has(.game-status.is-my-turn) .game-bar-status{border-color:color-mix(in srgb, var(--primary) 45%, transparent)}.game-bar:has(.game-status.is-their-turn){background:var(--surface-sunken);box-shadow:none}.game-status{min-width:0;font-family:var(--font-text);flex:auto;align-items:center;gap:.5rem;font-size:15px;font-weight:800;line-height:20px;display:flex;overflow:hidden}.game-status-msg{white-space:nowrap;text-overflow:ellipsis;flex:0 auto;min-width:3rem;overflow:hidden}.game-status.is-their-turn .game-status-msg{color:var(--ink-muted)}.game-status-note{min-width:0;color:var(--ink-muted);white-space:nowrap;text-overflow:ellipsis;flex:1 1 0;font-size:13px;font-weight:700;line-height:16px;overflow:hidden}.game-status-meta{flex:none;align-items:center;gap:.35rem;min-width:0;margin-left:auto;display:flex}.game-status-meta .game-pill{min-height:1.75rem;padding:0 .6rem}.game-bar--inline{padding-left:.75rem}@media (width<=767px){.game-bar-mode{display:none}}@media (width<=639px){.game-bar{flex-wrap:wrap;row-gap:.2rem;padding:.25rem .35rem}.game-bar-lead{flex:1 1 0}.game-bar-title{font-size:18px;line-height:22px}.game-bar-status{flex-basis:100%;order:3}.game-bar-status:not(:empty){border-left:0;border-top:1px solid var(--border);padding:.25rem .1rem .05rem}.game-bar--inline{padding-left:.5rem}.game-status{gap:.4rem;font-size:14px}.game-status-note{display:none}.game-status .game-turn-tag{min-height:24px;padding:0 8px}}.game-play{flex:auto;gap:.5rem;min-width:0;min-height:0;display:flex}.game-play-main{flex-direction:column;flex:auto;gap:.45rem;min-width:0;min-height:0;display:flex}.game-tools{flex-direction:column;flex:none;align-items:stretch;gap:.4rem;width:5.75rem;min-height:0;padding-bottom:4px;display:flex;overflow-y:auto}.game-tools-drawer{display:contents}.game-tools .game-btn{text-align:center;white-space:normal;flex-direction:column;flex:none;gap:.2rem;min-height:3.75rem;padding:.45rem .35rem;font-size:13px;line-height:1.15}.game-tools .game-helper-label{overflow:visible}.game-tools .game-btn.game-helper-btn .game-helper-count{margin-right:0}.game-tools-note{font-family:var(--font-text);text-align:center;color:var(--ink);font-size:12px;font-weight:800;line-height:16px}.game-play--no-tools{flex-direction:column}.game-tools--drawer-only{flex-direction:row;order:1;width:auto;overflow:visible}.game-tools--drawer-only:has(.game-tools-drawer:empty){display:none}.game-tools--drawer-only .game-btn{flex-direction:row;flex:auto;min-height:2.5rem}@media (width>=1024px){.game-tools .game-drawer-toggle--tool,.game-tools.game-tools--drawer-only{display:none}}@media (width<=639px){.game-play{flex-direction:column}.game-tools{flex-direction:row;order:1;width:auto;overflow:visible}.game-tools .game-btn{flex:1 1 0;min-width:0;min-height:3.25rem;padding-inline:.25rem;font-size:12px}.game-tools--drawer-only .game-btn{flex-direction:row;min-height:2.5rem}.game-tools-note{flex:100%;align-self:center}.game-tools:has(.game-tools-note){flex-wrap:wrap}}.game-settings-head{border-radius:var(--radius-4);width:100%;min-height:3rem;color:var(--ink);text-align:left;font-family:var(--font-text);-webkit-tap-highlight-color:transparent;align-items:center;gap:.5rem;padding:.6rem .9rem;display:flex}.game-settings-head:hover{background:var(--surface-sunken)}.game-settings-head:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}.game-settings-icon{color:var(--primary-text);flex:none}.game-settings-label{letter-spacing:.08em;text-transform:uppercase;flex:none;font-size:12px;font-weight:800;line-height:16px}.game-settings-summary{min-width:0;color:var(--ink-muted);text-align:right;white-space:nowrap;text-overflow:ellipsis;flex:auto;font-size:13px;font-weight:700;line-height:16px;overflow:hidden}.game-settings-chevron{color:var(--ink-muted);transition:transform var(--dur-2) var(--ease-standard);flex:none;margin-left:auto}.game-settings.is-open .game-settings-chevron{transform:rotate(180deg)}.game-settings-body{flex-direction:column;gap:.75rem;padding:.15rem .9rem .95rem;display:flex}.game-settings-body[hidden]{display:none}.game-setting{flex-direction:column;align-items:flex-start;gap:.35rem;min-width:0;max-width:100%;display:flex}.game-setting-label,.game-setting-note{font-family:var(--font-text);color:var(--ink-muted);font-size:12px;font-weight:800;line-height:16px}.game-setting-note{font-weight:700}.game-settings .game-chip-group{flex-wrap:wrap;max-width:100%}.game-toast{z-index:30;border:1px solid var(--border);border-left:4px solid var(--danger);border-radius:var(--radius-3);background:var(--surface-raised);text-align:center;max-width:min(92%,26rem);font-family:var(--font-text);color:var(--on-danger-soft);box-shadow:var(--elevation-2);padding:.6rem 1rem;font-size:14px;font-weight:700;line-height:20px;animation:.18s ease-out game-toast-in;position:absolute;top:3.4rem;left:50%;transform:translate(-50%)}.game-arena{flex:auto;grid-template-rows:minmax(0,1fr) auto;grid-template-columns:minmax(0,1fr);gap:.5rem;min-height:0;display:grid}.game-arena-main{flex-direction:column;gap:.45rem;min-width:0;min-height:0;display:flex}.game-arena-side{display:none}.game-stage{flex:auto;justify-content:center;align-items:center;min-width:0;min-height:0;display:flex;position:relative;container-type:size}.game-stage-square{aspect-ratio:1;width:min(100cqw,100cqh);position:relative}.game-panel{border:1px solid var(--border);border-radius:var(--radius-4);background:var(--surface);min-width:0;color:var(--ink);box-shadow:var(--elevation-1);position:relative}.game-panel-pad{padding:var(--space-4)}.game-panel-title{margin-bottom:var(--space-2);font-family:var(--font-text);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-muted);font-size:12px;font-weight:800;line-height:16px}.game-status-strip{border:1px solid var(--border);border-radius:var(--radius-3);background:var(--surface);color:var(--ink);font-family:var(--font-text);box-shadow:var(--elevation-1);flex-wrap:wrap;align-items:center;gap:.5rem;padding:.4rem .5rem .4rem .85rem;font-size:15px;font-weight:800;line-height:20px;display:flex}.game-status-strip .game-status-main{flex:10rem;min-width:0;font-weight:800}.game-status-strip.is-my-turn{border:2px solid var(--primary);background:var(--primary-soft);color:var(--on-primary-soft);box-shadow:var(--glow-primary);animation:game-turn-in var(--dur-3) var(--ease-spring)}.game-status-strip.is-their-turn{background:var(--surface-sunken);color:var(--ink-muted);box-shadow:none}.game-turn-tag{border-radius:var(--radius-pill);background:var(--primary);min-height:26px;color:var(--on-primary);font-family:var(--font-text);white-space:nowrap;flex:none;align-items:center;gap:6px;padding:0 10px;font-size:12px;font-weight:800;line-height:16px;display:inline-flex}.game-turn-tag:before{content:"";border-radius:var(--radius-pill);width:8px;height:8px;animation:game-turn-pulse 1.2s var(--ease-out) infinite;background:currentColor}.game-turn-tag--waiting{background:var(--surface-raised);color:var(--ink);box-shadow:inset 0 0 0 2px var(--turn-color,var(--border-strong))}.game-turn-tag--waiting:before{background:var(--turn-color,var(--ink-muted));width:10px;height:10px;animation-duration:2s}.game-turn-ring{box-shadow:0 0 0 3px var(--primary), var(--glow-primary)!important}@keyframes game-turn-in{0%{transform:scale(.98)}}@keyframes game-turn-pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.55;transform:scale(.55)}}@media (prefers-reduced-motion:reduce){.game-status-strip.is-my-turn,.game-bar,.game-turn-tag:before{animation:none!important}.game-bar,.game-settings-chevron{transition:none}}.game-status-strip .game-status-sub{white-space:nowrap;text-overflow:ellipsis;color:var(--ink-muted);flex:100%;font-size:12px;font-weight:700;line-height:16px;overflow:hidden}.game-drawer-toggle-wrap{justify-content:center;display:flex}.game-drawer-toggle{border:1px solid var(--border);border-radius:var(--radius-pill);background:var(--surface);width:100%;min-height:2.3rem;font-family:var(--font-text);color:var(--ink);box-shadow:var(--elevation-1);justify-content:center;align-items:center;gap:.4rem;font-size:14px;font-weight:800;line-height:20px;transition:transform .14s,border-color .14s;display:inline-flex}.game-drawer-toggle:hover{border-color:var(--border-strong)}.game-drawer-toggle:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}.game-drawer-toggle:active{transform:scale(.985)}.game-drawer-backdrop{z-index:70;background:var(--scrim);align-items:flex-end;animation:.16s ease-out game-fade-in;display:flex;position:fixed;inset:0}.game-drawer{border:1px solid var(--border);border-radius:var(--radius-4) var(--radius-4) 0 0;background:var(--surface-raised);width:100%;max-height:72dvh;color:var(--ink);box-shadow:var(--elevation-3);border-bottom:0;flex-direction:column;animation:.22s cubic-bezier(.2,.9,.3,1) game-drawer-up;display:flex}.game-drawer-head{justify-content:space-between;align-items:center;gap:var(--space-3);border-bottom:1px solid var(--border);padding:.5rem .5rem .5rem 1rem;display:flex}.game-drawer-head h2{font-family:var(--font-display);margin:0;font-size:22px;font-weight:600;line-height:28px}.game-drawer-body{flex-direction:column;gap:.75rem;padding:.9rem 1rem 1.4rem;display:flex;overflow-y:auto}@media (width<=1023px){body:has(.game-drawer-toggle-wrap){--chat-fab-offset:3rem}}@media (width>=1024px){.game-arena--with-side{grid-template-rows:minmax(0,1fr);grid-template-columns:minmax(0,1fr) 18.5rem}.game-arena-side{flex-direction:column;gap:.75rem;min-height:0;padding-right:.1rem;display:flex;overflow-y:auto}.game-drawer-toggle-wrap{display:none}}.game-btn{--btn-bg:var(--surface);--btn-bg-hover:var(--surface-sunken);--btn-fg:var(--ink);--btn-edge:var(--border);--btn-border:var(--border);--game-btn-edge:4px;justify-content:center;align-items:center;gap:var(--space-2);border:2px solid var(--btn-border);border-radius:var(--radius-2);background:var(--btn-bg);min-height:2.75rem;color:var(--btn-fg);font-family:var(--font-text);-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;box-shadow:0 var(--game-btn-edge) 0 var(--btn-edge);padding:0 18px;font-size:15px;font-weight:800;line-height:20px;transition:transform .12s cubic-bezier(.2,0,0,1),box-shadow .12s cubic-bezier(.2,0,0,1),background-color .18s cubic-bezier(.2,0,0,1),border-color .18s cubic-bezier(.2,0,0,1),color .18s cubic-bezier(.2,0,0,1);display:inline-flex;position:relative;transform:translateY(0)}.game-btn svg{flex:none}.game-btn:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}.game-btn:disabled{cursor:not-allowed;opacity:.5}.game-btn:not(:disabled):hover{background:var(--btn-bg-hover);box-shadow:0 calc(var(--game-btn-edge) + 1px) 0 var(--btn-edge);transform:translateY(-1px)}.game-btn:not(:disabled):active{transform:translateY(calc(var(--game-btn-edge) - 1px));box-shadow:0 1px 0 var(--btn-edge)}.game-btn--primary{--btn-bg:var(--primary);--btn-bg-hover:var(--primary-hover);--btn-fg:var(--on-primary);--btn-edge:var(--primary-edge);--btn-border:transparent}.game-btn--secondary{--btn-bg:var(--surface);--btn-bg-hover:var(--surface-sunken);--btn-fg:var(--ink);--btn-edge:var(--border);--btn-border:var(--border)}.game-chip-group{border-radius:var(--radius-pill);background:var(--surface-sunken);gap:2px;padding:3px;display:inline-flex}.game-chip{border-radius:var(--radius-pill);min-height:1.9rem;font-family:var(--font-text);color:var(--ink-muted);-webkit-tap-highlight-color:transparent;padding:0 .75rem;font-size:13px;font-weight:800;line-height:16px;transition:background-color .14s,color .14s,transform .14s}@media (pointer:coarse){.game-chip{min-height:2.5rem}}.game-chip:hover{color:var(--ink)}.game-chip:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}.game-chip:active{transform:scale(.95)}.game-chip.is-active{background:var(--surface-raised);color:var(--primary-text);box-shadow:var(--elevation-1)}.game-overlay{z-index:20;border-radius:inherit;background:var(--scrim);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);justify-content:center;align-items:center;animation:.22s ease-out game-fade-in;display:flex;position:absolute;inset:0}.game-overlay-card{align-items:center;gap:var(--space-3);border:1px solid var(--border);border-radius:var(--radius-4);background:var(--surface-raised);max-width:85%;padding:var(--space-5) var(--space-6);color:var(--ink);text-align:center;font-family:var(--font-text);box-shadow:var(--elevation-3);flex-direction:column;animation:.32s cubic-bezier(.2,1.4,.4,1) game-pop-in;display:flex}.game-overlay-card h2{font-family:var(--font-display);font-size:26px;font-weight:600;line-height:32px}.game-overlay-card p{color:var(--ink-muted);font-size:15px;font-weight:600;line-height:22px}@keyframes game-fade-in{0%{opacity:0}to{opacity:1}}@keyframes game-pop-in{0%{opacity:0;transform:scale(.8)translateY(8px)}to{opacity:1;transform:scale(1)translateY(0)}}@keyframes game-drawer-up{0%{transform:translateY(100%)}to{transform:translateY(0)}}@keyframes game-toast-in{0%{opacity:0;transform:translate(-50%,-6px)}to{opacity:1;transform:translate(-50%)}}@media (prefers-reduced-motion:reduce){.game-btn,.game-tab,.game-chip,.game-icon-btn,.game-drawer,.game-overlay,.game-overlay-card,.game-toast{transition:none!important;animation:none!important}}
