/* Tower Climb · one game window. The whole game, every control included, lives inside one rectangle that fills its
   viewport (the browser tab or an operator's iframe) and never scrolls: top HUD, the floor strip along the table's left
   edge, the table, the status line and the bottom control bar. The climb ladder and the menus open inside the window.
   This sheet styles the window for both tables. The flat Simple table's own rules are scoped to body.view-simple; the 3D
   table's overrides live in tower.css, which is only enabled when the 3D table is chosen. Tokens follow Baize's flat
   kit (games/quick.css): felt green, cream, card red, Plex Mono numbers, 44px+ targets. Motion is short and switched off
   under prefers-reduced-motion; the controller keeps the same holds either way. */
/* Type, buttons and the Quick play bolt come from games/baize-ui.css (linked first): Plex Sans for UI text, Plex Mono for
   figures, Libertine for titles, the shared press and disabled look, and nothing under 11px on phones. */

html:has(body.game-window){height:100%;overflow:hidden;-webkit-text-size-adjust:100%;touch-action:manipulation}
.game-window{
  --felt:#1f4a39;--felt-deep:#163728;--felt-dark:#10291e;--felt-up:#285c47;
  --cream:#f2ead9;--cream-2:#cfc6b0;--red:#b3352b;--red-up:#c8433a;--red-text:#f08a7f;--ink:#1b1a17;--win:#2f7a57;
  --line:#f2ead926;--line-2:#f2ead955;--hud-bg:#0d2219;--bar-bg:var(--felt-deep);--panel:var(--felt-deep);
  --primary:var(--red);--primary-up:var(--red-up);--primary-ink:var(--cream);
  --serif:var(--bz-serif);--mono:var(--bz-mono);--ui:var(--bz-sans);
  --bz-accent:var(--primary);--bz-accent-up:var(--primary-up);--bz-on-accent:var(--primary-ink);
  --ease:cubic-bezier(.2,.7,.1,1);--pop:cubic-bezier(.3,1.5,.5,1);
  --safe-b:env(safe-area-inset-bottom,0px);--safe-l:env(safe-area-inset-left,0px);--safe-r:env(safe-area-inset-right,0px);
  color-scheme:dark;margin:0;width:100%;height:100dvh;overflow:hidden;background:var(--felt-dark);color:var(--cream);font:400 15px/1.4 var(--ui);-webkit-font-smoothing:antialiased
}
.game-window *,.game-window *::before,.game-window *::after{box-sizing:border-box}
:where(.game-window) :where(button,input,select){font:inherit;color:inherit}
.game-window button{cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.game-window button:disabled{cursor:default}
.game-window a{color:inherit;text-decoration:none}
.game-window [hidden]{display:none!important}
.game-window :focus-visible{outline:3px solid var(--cream);outline-offset:2px}
.game-window .sr-only,.game-window #table{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.game-window .skip{position:fixed;z-index:50;top:8px;left:12px;background:var(--cream);color:var(--ink);padding:10px 14px;border-radius:8px;transform:translateY(-200%)}
.game-window .skip:focus{transform:none}
.game-window .scene-shade,.game-window .scene-loading,.game-window .table-readout{display:none}

/* ---- The window: the scene fills it edge to edge; everything else is drawn over the scene ----
   The grid only places the overlays: HUD on top, the strip, the line above the table, status and the control bar.
   Its empty "stage" cell (#scene-slot) is the free area the tables fit their cards, wheel and dice into. */
.game-shell{position:relative;isolation:isolate;width:100%;height:100dvh;overflow:hidden;display:grid;
  --strip-w:44px;--main-max:1180px;
  grid-template-columns:minmax(0,1fr) var(--strip-w) minmax(0,var(--main-max)) minmax(0,1fr);
  grid-template-rows:auto auto minmax(0,1fr) auto auto;
  grid-template-areas:"hud hud hud hud" ". strip info ." ". strip stage ." ". strip status ." "bar bar bar bar"}
.game-chrome{grid-area:hud}
.table-info{grid-area:info}
#world-stage{position:absolute;inset:0;z-index:0;min-width:0;min-height:0}
.scene-slot{grid-area:stage;min-width:0;min-height:0;pointer-events:none}
.result-hud{grid-area:status}
.control-panel{grid-area:bar}
.floor-rail{grid-row:2/5;grid-column:2}
.ladder-panel{grid-row:2/-1;grid-column:2/4}
.celebration,.verdict,.cel-root{grid-row:2/5;grid-column:2/4}
/* The shared win card's board (baize-celebrate places the card in it, clear of the cards) and the window ring. */
.cel-root{position:relative;z-index:12;min-width:0;min-height:0;pointer-events:none}
.win-ring{position:absolute;inset:0;z-index:13;pointer-events:none;border-radius:inherit}

/* ---- Top HUD: home chip and name on the left, the floor, then balance, sound and menu ---- */
.game-chrome{position:relative;z-index:10;display:flex;align-items:center;gap:8px;min-width:0;min-height:54px;padding:4px max(12px,var(--safe-r)) 4px max(8px,var(--safe-l));background:linear-gradient(180deg,#09191299,#0919124d 70%,#09191200);pointer-events:none}
.game-chrome>*{pointer-events:auto}
.home-chip{flex:none;width:44px;height:44px;display:grid;place-items:center;padding:0;border:0;border-radius:50%;background:transparent}
.home-chip:hover{background:#f2ead914}
.home-chip img{display:block;width:34px;height:34px}
.game-name{flex:none;margin:0;font:600 21px/1.1 var(--serif);white-space:nowrap}
.floor-chip{display:flex;align-items:center;gap:9px;min-width:0;min-height:44px;margin-left:10px;padding:0 14px 0 6px;border:1.5px solid var(--line-2);border-radius:999px;background:transparent}
.floor-chip:hover,.floor-chip[aria-expanded=true]{background:#f2ead914;border-color:var(--cream-2)}
.floor-badge{flex:none;margin:0;padding:5px 9px;border-radius:999px;background:var(--felt-up);font:500 13px/1 var(--mono);font-variant-numeric:tabular-nums;white-space:nowrap}
#floor-title{min-width:0;font:600 17px/1.1 var(--serif);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.floor-of{display:none}
.chrome-right{flex:none;display:flex;align-items:center;gap:8px;margin-left:auto}
.balance{display:flex;flex-direction:column;align-items:flex-end;line-height:1.1;margin-right:2px}
.balance span{font-size:11px;color:var(--cream-2);white-space:nowrap}
.balance strong{font:500 19px/1.2 var(--mono);font-variant-numeric:tabular-nums;white-space:nowrap}
.icon-button{flex:none;width:44px;height:44px;border-radius:50%;background:transparent;border:1.5px solid var(--line-2);display:grid;place-items:center;padding:0}
.icon-button:hover{background:#f2ead914}
.icon-button svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.icon-button[aria-pressed=true]{border-color:var(--cream)}

/* ---- Floor strip: the ten floors along the table's left edge; it opens the full climb ---- */
.floor-rail{position:relative;z-index:4;align-self:center;justify-self:start;display:flex;flex-direction:column;align-items:center;gap:6px;width:calc(var(--strip-w) - 8px);padding:6px 0;margin:0;border:0;border-radius:12px;background:transparent;color:inherit}
.floor-rail:hover,.floor-rail[aria-expanded=true]{background:#f2ead90f}
#floor-track{display:flex;flex-direction:column-reverse;align-items:center;gap:4px}
.floor-step{position:relative;width:28px;height:24px;border-radius:7px;display:grid;place-items:center;background:#0b2118a6;color:var(--cream-2);font:500 12px/1 var(--mono);font-variant-numeric:tabular-nums}
/* Wide windows: each step carries its run value on the margin to its left, Stake-tower style. */
.fs-v{display:none;position:absolute;right:calc(100% + 8px);top:50%;transform:translateY(-50%);font:500 12px/1 var(--mono);font-style:normal;color:var(--cream-2);white-space:nowrap;pointer-events:none}
.floor-step.current .fs-v{color:var(--cream)}
@media (min-width:1380px) and (min-height:700px){.fs-v{display:block}}
.floor-step.cleared{background:var(--cream);color:var(--felt-deep)}
.floor-step.current{background:var(--primary);color:var(--primary-ink);box-shadow:0 0 0 2px var(--cream)}
#tower-level{font:500 11px/1 var(--mono);color:var(--cream-2);white-space:nowrap}

/* ---- The line above the table: this floor's game and goal; the run value and reward tiers in one chip ---- */
.table-info{position:relative;z-index:4;display:flex;align-items:center;justify-content:space-between;gap:8px 14px;min-width:0;padding:8px 0 6px;pointer-events:none}
.table-info .run-chip{pointer-events:auto}
.floor-heading{min-width:0;display:flex;align-items:baseline;flex-wrap:wrap;gap:0 12px}
.floor-heading p{margin:0}
.info-floor{display:none;font:500 13px/1.2 var(--mono);color:var(--cream-2);white-space:nowrap}
.info-floor b{font:600 18px/1.1 var(--serif);color:var(--cream)}
.game-kind{font:600 21px/1.15 var(--serif);white-space:nowrap}
#objective{font-size:14px;line-height:1.3;color:var(--cream-2)}
.run-chip{position:relative;flex:none;display:flex;align-items:center;gap:12px;min-width:0;padding:5px 6px 5px 12px;border-radius:14px;background:var(--panel);box-shadow:inset 0 0 0 1.5px var(--line)}
.run-chip:has(.chip-open:hover),.run-chip:has(.chip-open[aria-expanded=true]){box-shadow:inset 0 0 0 1.5px var(--cream-2)}
.chip-open{position:absolute;inset:0;z-index:1;width:100%;padding:0;border:0;border-radius:inherit;background:transparent}
.run-value{display:grid;gap:0;min-width:0}
.run-value>span{font-size:11px;line-height:1.2;color:var(--cream-2);white-space:nowrap}
.run-value>strong{font:500 22px/1.1 var(--mono);font-variant-numeric:tabular-nums;letter-spacing:-.02em;white-space:nowrap}
.run-value small{font:400 11px/1.2 var(--mono);color:var(--cream-2);font-variant-numeric:tabular-nums;white-space:nowrap}
.run-value .run-net.gain{color:var(--cream)}
.run-value .run-net.down{color:var(--red-text)}
.run-value.landed{animation:st-land .42s var(--pop)}
.chip-tiers .tiers{list-style:none;margin:0;padding:0;display:flex;gap:3px}
.chip-tiers li{display:grid;justify-items:center;gap:1px;min-width:56px;padding:4px 7px;border-radius:9px;background:var(--felt);color:var(--cream-2)}
.chip-tiers li span{font-size:11px;line-height:1.1;white-space:nowrap}
.chip-tiers li strong{font:500 14px/1.1 var(--mono);font-variant-numeric:tabular-nums;color:var(--cream);white-space:nowrap}
.chip-tiers li.current{background:var(--cream);color:var(--felt-deep)}
.chip-tiers li.current strong{color:var(--ink)}
.chip-tiers li.used{opacity:.45}
.chip-tiers li.used strong{text-decoration:line-through}
.chip-tiers .quote-error{display:block;max-width:220px;font-size:12px;line-height:1.3;color:var(--red-text)}

/* ---- The climb: an in-window panel over the table, opened from the strip, the floor chip or the run chip ---- */
.ladder-panel{position:relative;z-index:14;align-self:start;justify-self:start;display:flex;flex-direction:column;width:min(760px,100%);max-height:calc(100% - 12px);min-height:0;margin:6px 0;border-radius:16px;background:var(--panel);box-shadow:0 18px 44px #000a,inset 0 0 0 1.5px var(--line-2);overflow:hidden;animation:st-panel-in .18s var(--ease) both}
.ladder-panel>header{display:flex;align-items:center;justify-content:space-between;padding:6px 6px 0 16px}
.ladder-panel h2{margin:0;font:600 21px/1.2 var(--serif)}
.ladder-panel .close{width:44px;height:44px;border:0;border-radius:50%;background:transparent;font:400 28px/1 var(--ui);color:var(--cream)}
.ladder-panel .close:hover{background:#f2ead914}
.ladder-body{min-height:0;overflow:auto;overscroll-behavior:contain;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start;gap:14px;padding:4px 14px 14px}
.ladder-floors{list-style:none;margin:0;padding:0;display:flex;flex-direction:column-reverse;gap:2px}
.ladder-floors li{display:grid;grid-template-columns:28px minmax(0,1fr) auto minmax(64px,auto);align-items:center;gap:10px;min-height:32px;padding:2px 10px 2px 4px;border-radius:9px;color:var(--cream-2)}
/* The value ladder: the run value after each floor (≈ marks a first-try projection). */
.ladder-floors .lf-v{font:500 13px/1 var(--mono);font-style:normal;font-variant-numeric:tabular-nums;text-align:right;color:var(--cream-2);white-space:nowrap}
.ladder-floors .lf-v.exact,.ladder-floors .current .lf-v{color:var(--cream)}
.ladder-note{margin:0;padding:0 16px 6px;font-size:12px;line-height:1.35;color:var(--cream-2)}
.ladder-note:empty{display:none}
.ladder-floors .lf-n{display:grid;place-items:center;width:28px;height:26px;border-radius:7px;background:var(--felt);font:500 12px/1 var(--mono)}
.ladder-floors b{font:600 16px/1.15 var(--serif);color:var(--cream);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ladder-floors i{font:400 12px/1.1 var(--ui);font-style:normal;white-space:nowrap}
.ladder-floors .cleared .lf-n{background:var(--cream);color:var(--felt-deep)}
.ladder-floors .cleared b{color:var(--cream-2)}
.ladder-floors .current{background:var(--felt-up);box-shadow:inset 0 0 0 2px var(--cream)}
.ladder-floors .current .lf-n{background:var(--primary);color:var(--primary-ink)}
#quote{display:grid;gap:5px;padding:12px;border-radius:12px;background:#0000002e}
.quote-row{display:flex;justify-content:space-between;gap:8px;font-size:13px;color:var(--cream-2)}
.quote-row strong{font:500 14px var(--mono);color:var(--cream);font-variant-numeric:tabular-nums}
.quote-row.next{font:600 16px var(--serif);color:var(--cream)}
.payout-label{font-size:12px;color:var(--cream-2)}
#quote small{display:block;font-size:12px;line-height:1.35;color:var(--cream-2)}
#quote .quote-error{color:var(--red-text)}
.payout-ladder{list-style:none;margin:0;padding:0;display:flex;gap:4px}
.payout-ladder li{flex:1 1 0;min-width:0;display:grid;justify-items:center;gap:1px;padding:4px 2px;border-radius:8px;background:var(--felt);color:var(--cream-2)}
.payout-ladder span{font-size:11px;white-space:nowrap}
.payout-ladder strong{font:500 15px/1.1 var(--mono);font-variant-numeric:tabular-nums;color:var(--cream)}
.payout-ladder em{font:400 11px/1.1 var(--mono);font-style:normal;font-variant-numeric:tabular-nums}
.payout-ladder .current{background:var(--cream);color:var(--felt-deep)}
.payout-ladder .current strong{color:var(--ink)}
.payout-ladder .used{opacity:.45}
.payout-ladder .used strong{text-decoration:line-through}

/* ---- Status under the table: the one-line state, or the docked result after a floor ---- */
.result-hud{position:relative;z-index:4;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-width:0;min-height:48px;padding:6px 0 8px;text-align:center;pointer-events:none}
.result-hud p{margin:0}
.outcome{display:grid;gap:1px;max-width:100%}
.outcome strong{font:600 20px/1.2 var(--serif)}
.outcome span{font-size:13px;line-height:1.3;color:var(--cream-2)}
.outcome.loss strong{color:var(--red-text)}
.outcome.push strong{color:var(--cream-2)}
#table-rule{display:none}
.milestone-strip{width:100%;max-width:640px;display:flex;flex-wrap:wrap;align-items:baseline;justify-content:center;gap:2px 10px;padding:6px 12px;border-radius:12px;background:var(--panel);box-shadow:inset 0 0 0 1.5px var(--line-2)}
.strip-kicker{font:600 16px/1.2 var(--serif)}
.strip-sub{color:var(--cream-2)}
.strip-figures{display:flex;align-items:baseline;gap:8px}
.strip-figures>strong:first-child{font:500 20px var(--mono);font-variant-numeric:tabular-nums}
.strip-mult{font:500 13px var(--mono);padding:3px 8px;border-radius:999px;background:var(--felt-up)}
.strip-net{font:400 13px var(--mono);color:var(--cream-2)}
.strip-note{flex-basis:100%;font-size:12px;color:var(--cream-2)}
.milestone-strip.gain .strip-mult{background:var(--cream);color:var(--win)}
.milestone-strip.gain .strip-net{color:var(--cream)}
.milestone-strip.down .strip-net{color:var(--red-text)}
.milestone-strip.loss{background:var(--ink);box-shadow:inset 0 0 0 2px var(--red)}
.milestone-strip.loss .strip-kicker,.milestone-strip.loss .strip-net{color:var(--red-text)}
.milestone-strip.loss .strip-mult{background:transparent;color:var(--cream-2);padding:0}
.milestone-strip.struck .strip-figures>strong:first-child{text-decoration:line-through;text-decoration-color:var(--red-text);text-decoration-thickness:2px}
.milestone-strip.landed{animation:st-land .42s var(--pop)}
.celebrating .milestone-strip,.moment-pending .milestone-strip{visibility:hidden}
.extra-chip{margin:0;padding:3px 12px;border-radius:999px;font:500 12px/1.3 var(--mono);font-variant-numeric:tabular-nums;background:var(--panel);box-shadow:inset 0 0 0 1.5px var(--line-2)}
.extra-chip.win{color:var(--cream)}.extra-chip.loss{color:var(--red-text)}

/* ---- Bottom control bar: choices, stake, the one big action, reveal or extras, cash out ---- */
.control-panel{position:relative;z-index:10;display:grid;gap:8px;padding:10px max(14px,calc((100% - var(--main-max) - var(--strip-w)) / 2),var(--safe-r)) calc(10px + var(--safe-b)) max(14px,calc((100% - var(--main-max) - var(--strip-w)) / 2),var(--safe-l));background:linear-gradient(180deg,#0a1c1400,#0a1c14b3 22%,#0a1c14e0)}
.control-row{display:flex;align-items:stretch;gap:12px;min-width:0}
#stake-control{flex:none;display:grid;grid-template-columns:150px auto;gap:6px;align-items:center}
#stake-control>label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.stake-input{display:grid;grid-template-columns:44px minmax(0,1fr) 44px;height:52px;border-radius:12px;background:var(--felt-dark);box-shadow:inset 0 0 0 1.5px var(--line-2);overflow:hidden}
.stake-input button{border:0;background:transparent;font:500 22px var(--mono);color:var(--cream)}
.stake-input button:hover{background:#f2ead912}
.stake-input input{min-width:0;width:100%;border:0;background:transparent;text-align:center;font:500 18px var(--mono);font-variant-numeric:tabular-nums;appearance:textfield;-moz-appearance:textfield}
.stake-input input::-webkit-inner-spin-button,.stake-input input::-webkit-outer-spin-button{appearance:none;margin:0}
.stake-input input:focus{outline:0}
.stake-input:focus-within{box-shadow:inset 0 0 0 2px var(--cream)}
.presets{display:grid;grid-template-columns:repeat(4,minmax(44px,auto));gap:5px}
.presets button{height:52px;min-width:44px;padding:0 8px;border:0;border-radius:10px;background:var(--felt-up);font:500 15px var(--mono)}
.presets button:hover:not(:disabled){background:#316b53}
#active-stake{flex:none;display:grid;align-content:center;gap:1px;padding:0 6px;min-width:64px}
#active-stake span{font-size:11px;color:var(--cream-2)}
#active-stake strong{font:500 18px/1.1 var(--mono);font-variant-numeric:tabular-nums}
#action-dock{flex:1 1 auto;display:flex;gap:10px;align-items:stretch;min-width:0}
.game-actions{flex:1 1 auto;display:flex;gap:8px;min-width:0}
.game-actions button{flex:1 1 0;min-width:0}
.game-actions .quiet{flex:0 0 auto}
.primary,.secondary,.bank,.extra,.quiet{position:relative;overflow:hidden;min-height:58px;border:0;border-radius:12px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;padding:6px 12px;font:600 21px/1.1 var(--serif);transition:transform .12s,background .15s}
/* The press is baize-ui's (.bz-btn: a small scale and a glow in the accent). A short busy spell only sets aria-disabled,
   so the bar keeps its look; a real lock (disabled) dims after 180 ms. */
.game-actions .bz-btn[aria-disabled=true],#cashout[aria-disabled=true]{cursor:default}
.primary{background:var(--primary);color:var(--primary-ink)}
.primary:hover:not(:disabled){background:var(--primary-up)}
.primary:disabled{background:#6d3a33;color:#f2ead9b0;opacity:1;filter:none}
.secondary{background:var(--cream);color:var(--felt-deep)}
.secondary:hover:not(:disabled){background:#fff8ea}
.secondary:disabled{background:var(--cream-2);color:#16372899}
.quiet{background:transparent;color:var(--cream);box-shadow:inset 0 0 0 1.5px var(--line-2);font:600 15px/1.1 var(--ui);padding:6px 16px}
.quiet:hover:not(:disabled){background:#f2ead912;box-shadow:inset 0 0 0 1.5px var(--cream-2)}
.quiet:disabled{opacity:.5}
.bank{flex:none;min-width:190px;background:var(--cream);color:var(--felt-deep);font-size:18px;padding:6px 14px}
.bank:hover:not(:disabled){background:#fff8ea}
.bank:disabled{background:transparent;color:var(--cream-2);box-shadow:inset 0 0 0 1.5px var(--line-2);filter:none}
#action-dock.no-run .bank{display:none}
.extra{background:var(--ink);color:var(--cream);box-shadow:inset 0 0 0 2px var(--cream-2);font-size:19px}
.extra:hover:not(:disabled){box-shadow:inset 0 0 0 2px var(--cream)}
.extra:disabled{opacity:.55}
.extra-sub{display:block;font:400 12px/1.2 var(--ui);opacity:.92;font-variant-numeric:tabular-nums}
.primary .extra-sub{margin-top:2px;font-size:12.5px;opacity:.88}
/* Quick play: the bolt at the bar's right end (the menu also has it, and T). */
.control-row>.bz-turbo{flex:none;align-self:stretch;min-height:58px;background:var(--felt-dark);color:var(--cream-2);box-shadow:inset 0 0 0 1.5px var(--line)}
.control-row>.bz-turbo span{font-size:12px}
.game-actions.with-extras button{min-height:58px}
.game-actions.with-extras button:nth-child(3):last-child{grid-column:1/-1}
/* A step with no decision: the bar fills over its beat; tap to go now. */
.primary.auto::before{content:'';position:absolute;left:0;bottom:0;height:5px;width:100%;background:#f2ead999;transform-origin:left;animation:st-beat var(--beat,700ms) linear both}
.skip-hint{display:block;font:400 12px/1.2 var(--ui);opacity:.85}
#action-dock.busy .skip-hint{visibility:hidden}
#action-dock.busy .primary.auto::before{display:none}
/* Flat chips flying from the win card: a burst on a first-try clear, a stream into the balance on a bank. */
.fly-chip{position:absolute;left:0;top:0;z-index:14;width:22px;height:22px;margin:-11px 0 0 -11px;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle,var(--red) 0 52%,transparent 53%),repeating-conic-gradient(var(--cream) 0 22deg,var(--red) 22deg 45deg);box-shadow:0 2px 0 #0000003d}
.fly-chip.cream{background:radial-gradient(circle,var(--cream) 0 52%,transparent 53%),repeating-conic-gradient(var(--red) 0 22deg,var(--cream) 22deg 45deg)}
.fly-chip.green{background:radial-gradient(circle,var(--win) 0 52%,transparent 53%),repeating-conic-gradient(var(--cream) 0 22deg,var(--win) 22deg 45deg)}
#error{position:absolute;bottom:calc(100% + 8px);left:12px;right:12px;margin:0 auto;max-width:640px;padding:10px 14px;border-radius:10px;background:var(--ink);color:var(--red-text);box-shadow:inset 0 0 0 2px var(--red);font-size:14px;z-index:9}
#error:empty{display:none}
/* Choices for the next floor: one compact row inside the bar. */
.route-options{display:flex;align-items:center;justify-content:center;gap:12px;min-width:0}
.route-options:empty{display:none}
.choice-title{margin:0;flex:none;font-size:13px;color:var(--cream-2);white-space:nowrap}
.choice-group{flex:0 1 640px;display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:4px;padding:4px;border-radius:12px;background:var(--felt-dark);min-width:0}
.choice-group button{min-height:44px;border:0;border-radius:9px;background:transparent;color:var(--cream-2);font:600 15px/1.1 var(--ui);padding:4px 6px}
.choice-group button:hover:not(:disabled){background:#f2ead912;color:var(--cream)}
.choice-group button.selected{background:var(--cream);color:var(--felt-deep)}
.roulette-bets button{font-size:14px;padding:4px 2px}
.number-choice{min-height:44px;min-width:0;border-radius:9px;border:1.5px solid var(--line-2);background:var(--felt-dark);padding:0 8px;font:500 15px var(--mono)}
.plan{margin:0;font:500 15px/1.3 var(--ui);color:var(--cream)}
/* During a floor cash-out is closed: narrower windows give its room to the hand's buttons. */
@media (max-width:1099px){.is-playing #cashout{display:none}}

/* ---- Verdict after each hand and the floor-clear, summit, bank and lost-run cards: centred in the window ---- */
.verdict,.celebration{position:relative;z-index:12;display:flex;align-items:center;justify-content:center;padding:10px;pointer-events:none;min-width:0;min-height:0}
/* Seated by the page in the free band above (or below) the table; without a measured table the card stays centred. */
.verdict.seated,.celebration.seated{align-items:flex-start;padding-top:var(--seat,10px)}
.verdict-card{pointer-events:auto;cursor:pointer;width:min(100%,560px);display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;column-gap:16px;row-gap:2px;padding:12px 18px 10px;border-radius:16px;text-align:left;background:var(--cream-2);color:var(--ink);box-shadow:0 14px 34px #0009;animation:st-card-in .22s var(--pop) both}
.verdict-card p{margin:0}
.verdict-word{grid-row:1/4;font:600 44px/1 var(--serif);letter-spacing:-.01em}
.verdict-reason{font:600 18px/1.25 var(--ui)}
.verdict-detail{font:400 13.5px/1.3 var(--ui)}
.verdict-next{font:500 12.5px/1.3 var(--mono);font-variant-numeric:tabular-nums;opacity:.85}
.verdict-skip{grid-column:1/-1;justify-self:center;margin-top:4px!important;font-size:12px;opacity:.6}
.verdict.win .verdict-card{background:var(--cream)}
.verdict.win .verdict-word{color:var(--win)}
.verdict.loss .verdict-card{background:var(--ink);color:var(--cream);box-shadow:inset 0 0 0 3px var(--red),0 14px 34px #0009}
.verdict.loss .verdict-word{color:var(--red-text)}
.verdict.loss .verdict-detail,.verdict.loss .verdict-next{color:var(--cream-2)}
.celebration{border-radius:16px;margin:6px 0}
/* A lost climb: a compact card placed clear of the losing cards (baize-celebrate's placeCard), no backdrop over the table. */
.celebration.placed{display:block;padding:0}
.celebration.placed .cel-card{position:absolute;left:0;top:0;transform:translate(var(--cx,0),var(--cy,0))}
.celebration.kind-bust .cel-card{width:min(100%,380px);padding:12px 16px;gap:1px}
.celebration.kind-bust .cel-mult{display:none}
.celebration.kind-bust .cel-kicker{font-size:20px}
@media (max-width:599px),(max-height:520px) and (orientation:landscape){
  .celebration.kind-bust .cel-card{width:min(100%,320px);padding:8px 12px}
  .celebration.kind-bust .cel-kicker{font-size:18px}
  .celebration.kind-bust .cel-reason{font-size:12.5px}
  .celebration.kind-bust .cel-return strong{font-size:18px}
  .celebration.kind-bust .cel-hint,.celebration.kind-bust .cel-net{display:none}
}
.cel-card{pointer-events:auto;cursor:pointer;container-type:inline-size;width:min(100%,460px);display:grid;justify-items:center;gap:2px;padding:16px 18px;border-radius:18px;text-align:center;background:var(--cream-2);color:var(--ink);box-shadow:0 18px 44px #0009;animation:st-card-in .26s var(--pop) both}
.cel-card p{margin:0}
.cel-kicker{font:600 22px/1.2 var(--serif)}
.cel-reason{font:500 14px/1.3 var(--ui);opacity:.85}
.cel-mult strong{display:block;font:500 72px/1.05 var(--mono);font-size:min(var(--mult-max,80px),calc(150cqi / var(--chars,6)));white-space:nowrap;letter-spacing:-.03em;font-variant-numeric:tabular-nums;margin:6px 0 2px}
.cel-return{display:flex;gap:8px;align-items:baseline;justify-content:center}
.cel-return span{font-size:13px;opacity:.8}
.cel-return strong{font:500 22px var(--mono);font-variant-numeric:tabular-nums}
.cel-net{font:400 13px/1.3 var(--mono);font-variant-numeric:tabular-nums}
.cel-hint{font-size:13px;opacity:.75}
.celebration:not(.kind-summit):not(.kind-bust) .cel-hint{display:none}
.celebration.gain .cel-card{background:var(--cream)}
.celebration.gain .cel-mult strong,.celebration.gain .cel-net{color:var(--win)}
.celebration.kind-summit .cel-card{background:var(--cream);box-shadow:inset 0 0 0 4px var(--win),0 18px 44px #0009}
.celebration.kind-summit .cel-kicker::before{content:'';display:block;width:44px;height:22px;margin:0 auto 6px;background:var(--red);clip-path:polygon(0 100%,0 22%,24% 60%,50% 0,76% 60%,100% 22%,100% 100%)}
.celebration.kind-bust .cel-card{background:var(--ink);color:var(--cream);box-shadow:inset 0 0 0 3px var(--red),0 18px 44px #0009;animation:st-card-drop calc(.3s*var(--pace,1)) var(--ease) both}
.celebration.kind-bust .cel-kicker,.celebration.kind-bust .cel-mult strong{color:var(--red-text)}
.celebration.kind-bust .cel-return strong{text-decoration:line-through;text-decoration-color:var(--red-text);text-decoration-thickness:2px}
.celebration.kind-bust .cel-net,.celebration.kind-bust .cel-hint,.celebration.kind-bust .cel-reason{color:var(--cream-2);opacity:1}

/* ---- The shared win card (baize-celebrate) in Tower's flat palette. Title = what happened (Floor 3 cleared, Banked,
   Summit), a sans line with how, the multiplier, the net counting up, the return. Compact where the board is narrow
   or short, so it fits the gap between the hands on a phone instead of covering the cards or the pocket. ---- */
#cel-root .bz-cel{--bz-cel-card:var(--cream);--bz-cel-win:var(--win);font-family:var(--bz-sans)}
#cel-root .bz-cel-tier{font:600 calc(var(--fig)*.46)/1.1 var(--bz-serif);color:var(--ink)}
#cel-root .bz-cel-kicker{font:500 14px/1.3 var(--bz-sans);color:#1b1a17b8;margin-top:3px}
#cel-root .bz-cel-line{color:#1b1a17c4}
#cel-root .bz-cel[data-tier=none]{--bz-cel-card:var(--cream-2)}
/* Phones: the compact card, one row: the multiplier on the left; what happened, the net and the return stacked beside it.
   About 66 px tall, so it fits over the floor line and run chip (which still show the figures from before the moment)
   and never covers the cards, the pocket or the rail. The how-and-why line is on the table already. */
@container (max-width:520px){
  #cel-root .bz-cel{--w:340px;display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-areas:"mult tier" "mult net" "mult line";
    column-gap:12px;align-items:center;text-align:left;padding:7px 14px 8px;border-radius:16px}
  #cel-root .bz-cel[data-tier=none]{--fig:30px}#cel-root .bz-cel[data-tier=small]{--fig:34px}#cel-root .bz-cel[data-tier=good]{--fig:36px}
  #cel-root .bz-cel[data-tier=big]{--w:340px;--fig:40px}#cel-root .bz-cel[data-tier=huge]{--w:340px;--fig:44px}#cel-root .bz-cel[data-tier=mega]{--w:340px;--fig:46px}
  #cel-root .bz-cel-mult{grid-area:mult;margin:0}
  #cel-root .bz-cel-tier{grid-area:tier;font-size:17px;line-height:1.1}
  #cel-root .bz-cel-net{grid-area:net;font-size:13.5px;line-height:1.2}
  #cel-root .bz-cel-line{grid-area:line;font-size:12px;line-height:1.2;margin:0}
  #cel-root .bz-cel-kicker,#cel-root .bz-cel-skip{display:none}
}
@container (max-height:420px){
  #cel-root .bz-cel{padding:8px 12px 9px}
  #cel-root .bz-cel-kicker{display:none}
  #cel-root .bz-cel-net{font-size:15px}
}

/* ---- Menu and reference sheets: in-window modals; the only surfaces that may scroll ---- */
.game-window dialog{width:min(620px,calc(100% - 24px));max-height:calc(100dvh - 24px);padding:22px 22px 24px;border:0;border-radius:16px;background:var(--cream);color:var(--ink);box-shadow:0 30px 80px #000a;overflow:auto;overscroll-behavior:contain}
.game-window dialog::backdrop{background:#0b1a13b8}
.game-window dialog h2{margin:0 0 14px;font:600 28px/1.2 var(--serif)}
.game-window dialog h3{margin:20px 0 6px;font:600 21px/1.25 var(--serif)}
.game-window dialog p,.game-window dialog li{font:400 16px/1.5 var(--serif);color:var(--ink)}
.game-window dialog :focus-visible{outline-color:var(--red)}
.game-window .eyebrow{margin:0 0 4px!important;font:500 13px var(--ui)!important;color:var(--red)!important}
.game-window dialog .close{position:absolute;right:10px;top:10px;width:44px;height:44px;border:0;border-radius:50%;background:transparent;font:400 30px/1 var(--ui);color:var(--ink)}
.game-window dialog .close:hover{background:#1b1a1712}
.menu-actions{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:8px;margin:6px 0 12px}
.menu-actions button{min-height:50px;display:flex;align-items:center;justify-content:space-between;padding:0 16px;border:0;border-radius:12px;background:#1b1a170d;color:var(--ink);font:500 16px var(--ui);text-align:left}
.menu-actions button:hover{background:#1b1a171a}
.menu-actions [aria-pressed=true]{background:var(--felt);color:var(--cream)}
.menu-actions button span{font:500 13px var(--mono);opacity:.8}
.dialog-actions{display:flex;gap:10px;margin-top:18px}
.dialog-actions button{flex:1;min-height:52px;font-size:18px}
.game-window dialog .secondary{background:#1b1a1712;color:var(--ink)}
#history{list-style:none;padding:0;display:grid;gap:8px}
.history-item{display:grid;gap:4px;padding:12px 14px;border-radius:12px;background:#1b1a170d}
.history-item>div{display:flex;justify-content:space-between;font:500 14px var(--ui)}
.history-item>strong{font:500 22px var(--mono);font-variant-numeric:tabular-nums}
.history-item.win>strong{color:var(--win)}
.history-item small{font:400 12px/1.4 var(--mono)}

/* ---- Simple table: the felt fills the window; the cards sit in the free area between the overlays ---- */
.view-simple .game-shell{background:radial-gradient(120% 80% at 50% 0%,#24543f,var(--felt) 60%,#1c4535)}
/* ---- The table ---- */
.view-simple .st-root{position:absolute;inset:0;background:radial-gradient(120% 80% at 50% 0%,#24543f,var(--felt) 60%,#1c4535)}
.view-simple .st-table{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:space-between;align-items:stretch;padding:var(--pad,12px);overflow:hidden}
.view-simple .st-table>*{flex-shrink:0}
.view-simple .st-hand{position:relative;display:flex;flex-direction:column;align-items:center;gap:6px;min-width:0;border-radius:12px}
.view-simple .st-head{display:flex;align-items:center;justify-content:center;gap:8px;min-height:var(--head,32px);max-width:100%}
.view-simple .st-who{font:600 15px/1.1 var(--ui);color:var(--cream-2);white-space:nowrap}
.view-simple .st-you .st-who{color:var(--cream)}
.view-simple .st-tag{font:500 12px/1 var(--ui);padding:4px 8px;border-radius:999px;background:var(--felt-up);color:var(--cream);white-space:nowrap}
.view-simple .st-total{display:inline-block;font:500 18px/1 var(--mono);font-variant-numeric:tabular-nums;padding:6px 11px;border-radius:999px;background:var(--felt-dark);color:var(--cream);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.view-simple .st-you .st-total{font-size:22px;padding:6px 13px}
.view-simple .st-k-poker .st-total{font:600 14px/1.1 var(--ui);padding:6px 10px}
.view-simple .st-k-poker .st-you .st-total{font-size:15px}
.view-simple .st-total.st-win{background:var(--cream);color:var(--win)}
.view-simple .st-total.st-loss{background:var(--ink);color:var(--red-text);box-shadow:inset 0 0 0 2px var(--red)}
.view-simple .st-total.st-push{background:transparent;color:var(--cream);box-shadow:inset 0 0 0 2px var(--cream-2)}
.view-simple .st-cards{display:flex;justify-content:center;min-height:var(--ch,90px)}
.view-simple .st-active{background:#f2ead914;box-shadow:inset 0 0 0 2px var(--cream);padding:6px 6px 8px}
.view-simple .st-backed .st-who{color:var(--cream)}
.view-simple .st-idle .st-card{opacity:.5}
.view-simple .st-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px}
.view-simple .st-mid{display:flex;align-items:center;justify-content:center;min-height:28px}
.view-simple .st-rule{margin:0;display:flex;align-items:center;justify-content:center;gap:8px;font:400 13px/1.3 var(--ui);color:var(--cream-2);text-align:center}
.view-simple .st-extra{margin:0;display:flex;align-items:center;gap:8px;padding:4px 12px 4px 4px;border-radius:999px;background:var(--felt-deep);font:500 13px/1.2 var(--mono);font-variant-numeric:tabular-nums}
.view-simple .st-extra.st-win{background:var(--cream);color:var(--win)}
.view-simple .st-extra.st-loss{background:var(--ink);color:var(--red-text)}
.view-simple .st-shoe{position:absolute;top:var(--pad,12px);right:var(--pad,12px);width:calc(var(--cw,60px)*.5);height:calc(var(--ch,84px)*.42);border-radius:6px;background:var(--red);box-shadow:3px -3px 0 #8e2c24,6px -6px 0 #6d2620}
.view-simple .st-compact .st-shoe,.view-simple .st-compact .st-split .st-tag{display:none}
.view-simple .st-compact .st-split .st-head{gap:6px}.view-simple .st-compact .st-split .st-who{font-size:14px}

/* Cards: big rank and suit, red or ink on cream; backs are card red with the Baize mark. */
.view-simple .st-card{position:relative;flex:none;width:var(--cw,60px);height:var(--ch,84px);border-radius:calc(var(--cw,60px)*.1);background:var(--cream);color:var(--ink);box-shadow:0 2px 0 #0000002e,0 0 0 1px #1b1a1714}
.view-simple .st-card+.st-card{margin-left:var(--ov,8px)}
.view-simple .st-rank{position:absolute;left:9%;top:6%;font:600 calc(var(--cw,60px)*.42)/1 var(--serif);letter-spacing:-.04em}
.view-simple .st-suit{position:absolute;left:10%;top:calc(var(--cw,60px)*.5);font:400 calc(var(--cw,60px)*.3)/1 var(--ui)}
.view-simple .st-pip{position:absolute;right:9%;bottom:6%;font:400 calc(var(--cw,60px)*.56)/1 var(--ui)}
.view-simple .st-red{color:var(--red)}
.view-simple .st-back,.view-simple .st-flip::after{background:var(--red) url('/assets/baize-mark-v5.svg') center/52% no-repeat;box-shadow:inset 0 0 0 calc(var(--cw,60px)*.06) var(--red),inset 0 0 0 calc(var(--cw,60px)*.06 + 2px) #f2ead980,0 2px 0 #0000002e}
.view-simple .st-flip::after{content:'';position:absolute;inset:0;border-radius:inherit;animation:st-cover calc(.24s*var(--pace,1)) var(--d,0ms) steps(1,end) both}
.view-simple .st-deal{animation:st-deal calc(.22s*var(--pace,1)) var(--d,0ms) var(--ease) both}
.view-simple .st-flip{animation:st-flip calc(.24s*var(--pace,1)) var(--d,0ms) linear both}
.view-simple .st-late{animation:st-in calc(.16s*var(--pace,1)) var(--d,0ms) both}
.view-simple .st-total.st-win-late{animation:st-mark-win 1ms var(--r,0ms) both}
.view-simple .st-total.st-loss-late{animation:st-mark-loss 1ms var(--r,0ms) both}
.view-simple .st-total.st-push-late{animation:st-mark-push 1ms var(--r,0ms) both}
.view-simple .st-total.st-late.st-win-late{animation:st-in .16s var(--d,0ms) both,st-mark-win 1ms var(--r,0ms) both}
.view-simple .st-total.st-late.st-loss-late{animation:st-in .16s var(--d,0ms) both,st-mark-loss 1ms var(--r,0ms) both}
.view-simple .st-total.st-late.st-push-late{animation:st-in .16s var(--d,0ms) both,st-mark-push 1ms var(--r,0ms) both}

/* Flat chips: card red with cream edge spots */
.view-simple .st-chip{flex:none;display:inline-grid;place-items:center;width:30px;height:30px;border-radius:50%;background:radial-gradient(circle,var(--red) 0 54%,transparent 55%),repeating-conic-gradient(var(--cream) 0 22deg,var(--red) 22deg 45deg);box-shadow:0 2px 0 #0000003d}
.view-simple .st-chip span{font:500 11px/1 var(--mono);color:var(--cream)}

/* Roulette: a strip of the single-zero wheel slides the drawn pocket under the marker. */
.view-simple .st-k-roulette{justify-content:center;gap:14px}
.view-simple .st-wheel{position:relative;flex:none;height:calc(var(--tile,44px)*1.2);border-radius:12px;background:var(--felt-dark);overflow:hidden}
.view-simple .st-strip-move{position:absolute;inset:0}
.view-simple .st-strip{position:absolute;left:50%;top:50%;display:flex;transform:translate(calc(var(--tile,44px)*(var(--at) + .5)*-1),-50%)}
.view-simple .st-tile{flex:none;width:var(--tile,44px);height:calc(var(--tile,44px)*.92);display:grid;place-items:center;border:2px solid var(--felt-dark);border-radius:9px;font:500 calc(var(--tile,44px)*.36)/1 var(--mono);color:var(--cream)}
.view-simple .st-tile.st-red{background:var(--red)}.view-simple .st-tile.st-black{background:var(--ink)}.view-simple .st-tile.st-green{background:var(--win)}
.view-simple .st-marker{position:absolute;left:50%;top:3px;bottom:3px;width:calc(var(--tile,44px) + 6px);transform:translateX(-50%);border-radius:11px;box-shadow:inset 0 0 0 3px var(--cream),0 0 0 999px #10291e66}
.view-simple .st-result{display:grid;justify-items:center;gap:6px}
.view-simple .st-pocket{width:var(--pocket,96px);height:var(--pocket,96px);display:grid;place-items:center;border-radius:18px;font:500 calc(var(--pocket,96px)*.5)/1 var(--mono);color:var(--cream)}
.view-simple .st-pocket.st-red{background:var(--red)}.view-simple .st-pocket.st-black{background:var(--ink)}.view-simple .st-pocket.st-green{background:var(--win)}
.view-simple .st-pocket.st-pending{background:transparent;box-shadow:inset 0 0 0 3px var(--line-2);color:var(--cream-2)}
.view-simple .st-pop{animation:st-pop calc(.22s*var(--pace,1)) var(--d,0ms) var(--pop) both}
.view-simple .st-caption{margin:0;font:600 18px/1.2 var(--serif);color:var(--cream-2)}
.view-simple .st-caption.st-win{color:var(--cream)}
.view-simple .st-betboard{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:5px;width:100%;max-width:520px;align-self:center}
.view-simple .st-betboard.st-has-n{grid-template-columns:repeat(6,minmax(0,1fr))}
.view-simple .st-bet{position:relative;min-height:40px;display:grid;place-items:center;border-radius:9px;background:var(--felt-deep);font:500 14px/1 var(--mono);color:var(--cream-2)}
.view-simple .st-bet-red{background:#7e2a23;color:var(--cream)}.view-simple .st-bet-black{background:var(--ink);color:var(--cream)}
.view-simple .st-bet .st-chip{position:absolute;right:-6px;top:-8px;width:24px;height:24px}
.view-simple .st-bet.st-hit{box-shadow:inset 0 0 0 2px var(--cream);color:var(--cream)}
.view-simple .st-k-roulette>.st-rule{flex:none}

/* Craps: flat dice, the point puck and the pass line. */
.view-simple .st-k-craps{justify-content:center;align-items:center;gap:12px}
.view-simple .st-puck{position:absolute;left:var(--pad,12px);top:var(--pad,12px);display:flex;align-items:center;gap:8px}
.view-simple .st-puck b{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;background:var(--ink);color:var(--cream-2);font:600 14px var(--ui);box-shadow:inset 0 0 0 3px var(--cream-2)}
.view-simple .st-puck.st-on b{background:var(--cream);color:var(--ink);box-shadow:inset 0 0 0 3px var(--ink)}
.view-simple .st-puck span{font:500 15px var(--mono);color:var(--cream-2)}
.view-simple .st-puck.st-on span{color:var(--cream)}
.view-simple .st-dice{display:flex;gap:calc(var(--die,80px)*.3);margin-top:calc(var(--die,80px)*.2)}
.view-simple .st-die{width:var(--die,80px);height:var(--die,80px);display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);gap:calc(var(--die,80px)*.06);padding:calc(var(--die,80px)*.15);border-radius:calc(var(--die,80px)*.18);background:var(--cream);box-shadow:0 3px 0 #0000003d}
.view-simple .st-die i{border-radius:50%}
.view-simple .st-die .st-dot{background:var(--ink)}
.view-simple .st-die[data-v="1"] .st-dot{background:var(--red)}
.view-simple .st-die.st-ghost{background:transparent;box-shadow:inset 0 0 0 3px var(--line-2)}
.view-simple .st-roll{animation:st-roll calc(.38s*var(--pace,1)) var(--d,0ms) var(--ease) both}
.view-simple .st-sum{margin:0;display:flex;align-items:baseline;gap:10px;min-height:44px}
.view-simple .st-sum b{font:500 40px/1 var(--mono)}
.view-simple .st-sum span{font:600 19px/1.2 var(--serif);color:var(--cream-2)}
.view-simple .st-sum.st-win b{padding:2px 12px;border-radius:12px;background:var(--cream);color:var(--win)}
.view-simple .st-sum.st-loss b{padding:2px 12px;border-radius:12px;background:var(--ink);color:var(--red-text);box-shadow:inset 0 0 0 2px var(--red)}
.view-simple .st-passline{display:flex;align-items:center;justify-content:center;gap:10px;width:min(100%,420px);padding:8px;border-radius:12px;box-shadow:inset 0 0 0 2px var(--line-2);font:600 17px var(--serif);color:var(--cream)}
.view-simple .st-k-craps>.st-rule{margin-top:2px}

/* Floor change: the next floor's number and name rise over the table. */
.view-simple .st-lift{position:absolute;inset:0;z-index:3;display:grid;place-content:center;justify-items:center;gap:4px;background:var(--felt-deep);pointer-events:none}
.view-simple .st-lift span{font:500 15px var(--mono);color:var(--cream-2)}
.view-simple .st-lift b{font:600 34px/1.1 var(--serif)}
.view-simple .st-lift.st-lifting{animation:st-lift calc(.62s*var(--pace,1)) var(--ease) both}
.view-simple .st-fx-shake .st-table{animation:st-shake .32s var(--ease)}

@keyframes st-deal{from{transform:translate(46px,-60px) rotate(7deg);opacity:0}}
@keyframes st-flip{0%{transform:scaleX(1)}50%{transform:scaleX(0)}100%{transform:scaleX(1)}}
@keyframes st-cover{0%{opacity:1}50%,100%{opacity:0}}
@keyframes st-in{from{opacity:0}}
@keyframes st-mark-win{to{background:var(--cream);color:var(--win);box-shadow:none}}
@keyframes st-mark-loss{to{background:var(--ink);color:var(--red-text);box-shadow:inset 0 0 0 2px var(--red)}}
@keyframes st-mark-push{to{background:transparent;color:var(--cream);box-shadow:inset 0 0 0 2px var(--cream-2)}}
@keyframes st-pop{0%{transform:scale(.6);opacity:0}100%{transform:none;opacity:1}}
@keyframes st-roll{0%{transform:translate(-80px,-30px) rotate(-320deg);opacity:0}40%{opacity:1}}
@keyframes st-lift{0%{opacity:0;transform:translateY(28px)}25%{opacity:1;transform:none}75%{opacity:1}100%{opacity:0}}
@keyframes st-shake{0%,100%{transform:none}20%{transform:translateX(-5px)}40%{transform:translateX(5px)}60%{transform:translateX(-3px)}80%{transform:translateX(2px)}}
@keyframes st-card-in{from{transform:scale(.86);opacity:0}}
@keyframes st-card-drop{from{transform:translateY(-14px);opacity:0}}
@keyframes st-land{0%{transform:scale(.94)}60%{transform:scale(1.03)}100%{transform:none}}
@keyframes st-beat{from{transform:scaleX(0)}to{transform:scaleX(1)}}

/* ---- Player-paced reveals: face-down baccarat cards and the Hold'em board answer a tap ---- */
.view-simple.can-peel .st-k-baccarat .st-card.st-back{cursor:pointer;transition:transform .14s var(--ease),box-shadow .14s}
.view-simple.can-peel .st-k-baccarat .st-card.st-back:hover{transform:translateY(-5px);box-shadow:inset 0 0 0 calc(var(--cw,60px)*.06) var(--red),inset 0 0 0 calc(var(--cw,60px)*.06 + 2px) var(--cream),0 6px 0 #00000040}
.view-simple.can-peel .st-k-baccarat .st-card.st-back::before{content:'';position:absolute;inset:-5px;border-radius:calc(var(--cw,60px)*.13);box-shadow:0 0 0 2px #f2ead9aa;animation:st-peel-hint 1.6s var(--ease) infinite}
.view-simple.can-reveal-board .st-k-poker .st-board{cursor:pointer}
.view-simple.can-reveal-board .st-k-poker .st-board .st-card.st-back{box-shadow:inset 0 0 0 calc(var(--cw,60px)*.06) var(--red),inset 0 0 0 calc(var(--cw,60px)*.06 + 2px) var(--cream),0 2px 0 #0000002e}
.view-simple.can-reveal-board .st-k-poker .st-board:hover .st-card.st-back{transform:translateY(-3px)}
@keyframes st-peel-hint{0%{opacity:0}40%{opacity:1}100%{opacity:0}}
@keyframes st-panel-in{from{opacity:0;transform:translateX(-10px)}}

/* ---- Wide desktop ---- */
@media (min-width:1500px) and (min-height:900px){
  .game-shell{--main-max:1320px;--strip-w:52px}
  .game-chrome{min-height:64px;padding-top:6px;padding-bottom:6px}
  .home-chip img{width:38px;height:38px}
  .game-name{font-size:24px}
  #floor-title{font-size:19px}
  .balance strong{font-size:21px}
  .floor-step{width:34px;height:30px;font-size:13px}
  #floor-track{gap:6px}
  .game-kind{font-size:24px}
  #objective{font-size:15px}
  .run-value>strong{font-size:26px}
  .chip-tiers li{min-width:64px;padding:5px 9px}
  .chip-tiers li strong{font-size:16px}
  .outcome strong{font-size:23px}
  .outcome span{font-size:14px}
  .primary,.secondary,.bank,.extra{min-height:64px;font-size:23px}
  .stake-input,.presets button{height:58px}
  .cel-card{width:min(100%,500px);padding:20px 22px}
  .verdict-card{width:min(100%,620px)}
  .verdict-word{font-size:50px}
}
/* ---- Narrow desktop, tablet and 800x600: the goal moves into the climb panel; the bar keeps one row while it can ---- */
@media (max-width:999px){
  #objective{display:none}
  .game-actions.with-extras button:nth-child(3):last-child{grid-column:auto/span 2}
  .bank{min-width:150px;font-size:16px}
  .game-actions.with-extras{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
  .extra{font-size:17px}
}
@media (max-width:899px){
  .floor-chip{margin-left:4px}
  .game-actions.with-extras{grid-template-columns:1fr 1fr;gap:6px}
  .game-actions.with-extras button{min-height:48px}
  .extra-sub{font-size:11.5px}
}
@media (max-height:680px) and (min-width:600px){
  .game-chrome{min-height:48px;padding-top:2px;padding-bottom:2px}
  .table-info{padding:4px 0 3px}
  .run-value>span{display:none}
  .result-hud{min-height:40px;padding:3px 0 5px}
  .outcome strong{font-size:18px}
  .outcome span{font-size:12px}
  .milestone-strip{padding:4px 12px}
  .milestone-strip:not(.loss):not(.has-extras):not(.voided) .strip-note{display:none}
  .control-panel{padding-top:8px;padding-bottom:calc(8px + var(--safe-b));gap:6px}
  .primary,.secondary,.bank,.extra,.quiet{min-height:50px}
  .primary,.secondary,.extra{font-size:19px}
  .stake-input,.presets button{height:48px}
  .game-actions.with-extras button{min-height:46px}
  .floor-step{height:22px}
  .verdict-word{font-size:38px}
  .cel-card{padding:12px 16px}
  .cel-mult strong{--mult-max:60px}
}

/* ---- Portrait phones: one column, the strip beside the table, the bar stacked ---- */
@media (max-width:599px){
  .game-shell{--strip-w:38px;grid-template-columns:var(--strip-w) minmax(0,1fr);
    grid-template-areas:"hud hud" "strip info" "strip stage" "strip status" "bar bar"}
  .floor-rail{grid-column:1;justify-self:center}
  .ladder-panel{grid-row:2/-1;grid-column:1/-1;margin:6px 8px calc(8px + var(--safe-b));width:auto;justify-self:stretch}
  .ladder-body{grid-template-columns:minmax(0,1fr);gap:8px;padding-bottom:10px}
  .ladder-floors{gap:1px}
  .ladder-floors li{min-height:26px}
  .ladder-floors .lf-n{height:22px}
  .ladder-floors b{font-size:15px}
  #quote small,.payout-label{display:none}
  #quote{padding:8px 10px;gap:4px}
  /* Beside the floor rail, never over it. */
  .celebration,.verdict{grid-column:2/-1}
  .verdict{padding-left:2px;padding-right:8px}
  .celebration{margin:6px 6px 6px 0}
  .scene-slot{margin-right:6px}
  .game-chrome{gap:6px;min-height:50px;padding:3px max(8px,var(--safe-r)) 3px max(6px,var(--safe-l))}
  .home-chip{width:40px;height:40px}
  .home-chip img{width:30px;height:30px}
  .game-name{font-size:18px}
  .floor-chip{display:none}
  .chrome-right{gap:6px}
  /* Phones keep the bar to the hand's buttons: Quick play is in the menu (and T). */
  .control-row>.bz-turbo{display:none}
  .ladder-floors li{grid-template-columns:24px minmax(0,1fr) auto auto;gap:7px;padding-right:6px}
  .ladder-floors i{font-size:11px}
  .ladder-note{padding:0 12px 4px;font-size:11px}
  .balance span{font-size:11px}
  .balance strong{font-size:16px}
  .icon-button{width:42px;height:42px}
  .floor-step{width:28px;height:22px;font-size:11px}
  #floor-track{gap:3px}
  .table-info{flex-direction:column;align-items:stretch;gap:4px;padding:6px 8px 5px 0}
  .floor-heading{gap:0 8px;flex-wrap:nowrap}
  .info-floor{display:block;overflow:hidden;text-overflow:ellipsis}
  .game-kind{font:400 13px/1.2 var(--ui);color:var(--cream-2);margin-left:auto!important}
  .run-chip{gap:8px;padding:4px 4px 4px 10px}
  .run-value>span{display:none}
  .run-value>strong{font-size:20px}
  .chip-tiers{flex:1;min-width:0}
  .chip-tiers .tiers{gap:3px}
  .chip-tiers li{flex:1 1 0;min-width:0;padding:3px 2px}
  .chip-tiers li strong{font-size:13.5px}
  .result-hud{min-height:40px;padding:4px 8px 5px 0}
  .outcome strong{font-size:17px}
  .outcome span{font-size:12px}
  .milestone-strip{padding:4px 8px}
  .milestone-strip:not(.loss):not(.has-extras):not(.voided) .strip-note{display:none}
  .strip-kicker{font-size:14px}
  .strip-sub{display:none}
  .strip-figures>strong:first-child{font-size:18px}
  .control-panel{gap:7px;padding:8px max(10px,var(--safe-r)) calc(8px + var(--safe-b)) max(10px,var(--safe-l))}
  .control-row{flex-direction:column;gap:7px}
  #stake-control{grid-template-columns:minmax(0,1fr) auto}
  .stake-input,.presets button{height:48px}
  .presets{grid-template-columns:repeat(4,minmax(42px,auto));gap:4px}
  #active-stake{display:none}
  .bank{flex:0 0 38%;min-width:0;font-size:15px;padding:6px 8px}
  .primary,.secondary,.extra,.quiet{min-height:54px}
  .primary,.secondary{font-size:19px}
  .quiet{font-size:14px;padding:6px 12px}
  .game-actions.with-extras{grid-template-columns:1fr 1fr}
  .extra{font-size:15px;padding:5px 6px}
  .extra-sub{font-size:11px}
  .route-options{flex-direction:column;align-items:stretch;gap:3px}
  .choice-title{font-size:12px;text-align:center}
  .choice-group{flex:none}
  .roulette-bets{grid-auto-flow:row;grid-template-columns:repeat(6,minmax(0,1fr))}
  .roulette-bets button{font-size:13px;padding:2px 1px;line-height:1.1}
  .summit-routes{grid-auto-flow:row;grid-template-columns:repeat(3,minmax(0,1fr))}
  .summit-routes button{font-size:13px;line-height:1.1}
  .roulette-bets .number-choice,.summit-routes .number-choice{grid-column:1/-1}
  .plan{font-size:14px;text-align:center}
  .verdict-card{padding:10px 14px 8px;column-gap:12px}
  .verdict-word{font-size:36px}
  .verdict-reason{font-size:16px}
  .verdict-detail{font-size:12.5px}
  .cel-card{padding:12px 12px}
  .cel-kicker{font-size:19px}
  .cel-mult strong{--mult-max:60px}
  .game-window dialog{padding:20px 18px 20px}
  .game-window dialog h2{font-size:25px}
  .game-window dialog p,.game-window dialog li{font-size:15px}
}
@media (max-width:599px) and (max-height:700px){
  .game-chrome{min-height:46px}
  .home-chip,.icon-button{width:40px;height:40px}
  .stake-input,.presets button{height:44px}
  .primary,.secondary,.extra,.quiet{min-height:50px}
  .primary,.secondary{font-size:18px}
  .game-actions.with-extras button{min-height:46px}
  .outcome span{display:none}
  .result-hud{min-height:34px;padding:3px 8px 4px 0}
  .floor-step{height:20px}
  .verdict-word{font-size:32px}
  .cel-mult strong{--mult-max:52px}
}
@media (max-width:359px){
  .game-name{font-size:16px}
  .balance strong{font-size:15px}
  .chrome-right{gap:4px}
  .icon-button{width:40px;height:40px}
}

/* ---- Landscape phones: the table on the left, the run, status and bar as a rail inside the window's right edge ---- */
@media (max-height:520px) and (orientation:landscape){
  .game-shell{--strip-w:38px;grid-template-columns:var(--strip-w) minmax(0,1fr) minmax(300px,40%);grid-template-rows:auto auto auto minmax(0,1fr) auto;
    grid-template-areas:"hud hud hud" "strip stage info" "strip stage status" "strip stage ." "strip stage bar"}
  .scene-slot{grid-row:2/-1;margin:4px 0}
  .floor-rail{grid-row:2/-1;grid-column:1;justify-self:center}
  .ladder-panel{grid-row:2/-1;grid-column:2/4;margin:4px max(8px,var(--safe-r)) 6px 0;width:auto;justify-self:stretch}
  .ladder-body{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start;gap:10px;padding-top:0}
  .ladder-floors{gap:1px}
  .ladder-floors li{min-height:26px}
  .ladder-floors .lf-n{height:22px}
  .ladder-floors b{font-size:14px}
  #quote{padding:8px 10px;gap:4px}
  .ladder-panel>header{padding-top:2px}
  .celebration,.verdict{grid-row:2/-1;grid-column:2/3}
  .celebration{margin:6px 0}
  .game-chrome{min-height:44px;padding:0 max(10px,var(--safe-r)) 0 max(6px,var(--safe-l))}
  .control-row>.bz-turbo{display:none}
  .ladder-note{display:none}
  .home-chip{width:40px;height:40px}
  .home-chip img{width:28px;height:28px}
  .game-name{font-size:18px}
  .floor-chip{min-height:38px}
  #floor-title{font-size:15px}
  .balance span{font-size:11px}
  .balance strong{font-size:16px}
  .icon-button{width:40px;height:40px}
  .floor-step{width:28px;height:20px;font-size:11px}
  #floor-track{gap:3px}
  .table-info{flex-direction:column;align-items:stretch;gap:4px;padding:10px max(14px,calc(var(--safe-r) + 8px)) 2px 8px}
  #objective{display:none}
  .game-kind{font-size:17px}
  .run-chip{gap:8px;padding:4px 4px 4px 10px}
  .run-value>span{display:none}
  .run-value>strong{font-size:19px}
  .chip-tiers{flex:1;min-width:0}
  .chip-tiers li{flex:1 1 0;min-width:0;padding:2px}
  .chip-tiers li strong{font-size:13px}
  .result-hud{min-height:0;padding:2px max(14px,calc(var(--safe-r) + 8px)) 2px 8px}
  .outcome strong{font-size:16px}
  .outcome span{font-size:11.5px}
  .milestone-strip{padding:3px 8px}
  .milestone-strip:not(.loss):not(.has-extras):not(.voided) .strip-note{display:none}
  .strip-kicker{font-size:14px}.strip-sub{display:none}.strip-figures>strong:first-child{font-size:17px}
  .control-panel{gap:5px;padding:4px max(14px,calc(var(--safe-r) + 8px)) calc(10px + var(--safe-b)) 8px;background:transparent}
  .control-row{flex-direction:column;gap:5px}
  #stake-control{grid-template-columns:minmax(0,1fr) auto}
  .stake-input,.presets button{height:44px}
  .presets{grid-template-columns:repeat(4,minmax(38px,auto));gap:3px}
  .presets button{padding:0 4px;font-size:14px}
  #active-stake{display:none}
  .primary,.secondary,.extra,.quiet,.bank{min-height:46px}
  .primary,.secondary{font-size:18px}
  .bank{flex:0 0 40%;min-width:0;font-size:14px;padding:4px 8px}
  .quiet{font-size:13px;padding:4px 10px}
  .game-actions.with-extras{display:grid;grid-template-columns:1fr 1fr;gap:5px}
  .game-actions.with-extras button{min-height:44px}
  .extra{font-size:14px;padding:3px 6px}
  .extra-sub{font-size:11px}
  .skip-hint{font-size:11px}
  .route-options{flex-direction:column;align-items:stretch;gap:2px}
  .choice-title{display:none}
  .choice-group{flex:none;gap:3px;padding:3px}
  .choice-group button{min-height:40px;font-size:13px;padding:2px}
  .roulette-bets{grid-auto-flow:row;grid-template-columns:repeat(6,minmax(0,1fr))}
  .roulette-bets button{font-size:12px;line-height:1.05}
  .summit-routes{grid-auto-flow:row;grid-template-columns:repeat(3,minmax(0,1fr))}
  .summit-routes button{font-size:12px;line-height:1.05}
  .roulette-bets .number-choice,.summit-routes .number-choice{grid-column:1/-1;min-height:38px}
  .plan{font-size:13px;text-align:center}
  .verdict-card{padding:8px 12px 6px;column-gap:12px}
  .verdict-word{font-size:30px}
  .verdict-reason{font-size:15px}
  .verdict-detail{font-size:12px}
  .verdict-skip{display:none}
  .cel-card{padding:8px 12px}
  .cel-kicker{font-size:17px}
  .cel-mult strong{--mult-max:46px;margin:2px 0 1px}
  .cel-return strong{font-size:18px}
  .cel-hint{display:none}
  .game-window dialog{max-height:calc(100dvh - 16px);padding:16px 18px}
  .menu-actions button{min-height:44px}
}

/* ---- Embedded: nothing that only makes sense on the Baize site ---- */
.is-embedded .skip{display:none}

@media (prefers-reduced-motion:reduce){
  .game-window *,.game-window *::before,.game-window *::after{animation:none!important;transition:none!important}
}

/* Cash out is only possible between floors: make the locked state obvious during a hand. */
.game-window #cashout:disabled{opacity:.42;filter:saturate(.6)}
