:root { color-scheme: dark; --ink:#f3f0df; --muted:#b5c6c6; --surface:#10262e; --line:#38505a; --accent:#ff8968; --mint:#75e3cf; font-family: ui-sans-serif, -apple-system, BlinkMacSystemFont, 'Thonburi', 'Noto Sans Thai', sans-serif; }
* { box-sizing:border-box; }
body { margin:0; color:var(--ink); background:#09171d; }
button, input, summary, a { -webkit-tap-highlight-color:transparent; }
button, input { font:inherit; }
button, summary { cursor:pointer; }
button { color:inherit; border:0; }
button:disabled { opacity:.42; cursor:default; }
button, a, summary, input { touch-action:manipulation; }
a { color:inherit; }
:focus-visible { outline:3px solid var(--mint); outline-offset:4px; }
button:not(:disabled):hover { filter:brightness(1.12); }
[hidden] { display:none !important; }
.sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; }
.icon-defs { position:absolute; width:0; height:0; overflow:hidden; }
svg { width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:1.65; stroke-linecap:round; stroke-linejoin:round; flex-shrink:0; }
.game-shell { min-height:680px; height:100svh; height:100dvh; display:flex; flex-direction:column; }
.site-header { min-height:72px; display:flex; align-items:center; gap:20px; padding:max(10px,env(safe-area-inset-top)) max(28px,env(safe-area-inset-right)) 10px max(28px,env(safe-area-inset-left)); border-bottom:1px solid #253b43; background:#10262e; z-index:5; }
.brand { display:flex; align-items:center; gap:13px; text-decoration:none; font-size:28px; font-weight:850; line-height:1.05; letter-spacing:-1px; }
.brand-question { color:var(--accent); }
.brand small { display:block; font-size:9px; letter-spacing:3px; font-weight:600; margin-top:7px; }
.brand-mark { width:27px; height:37px; display:flex; flex-direction:column; justify-content:flex-end; gap:4px; }
.brand-mark i { display:block; height:7px; width:26px; border-radius:1px; background:var(--accent); }
.brand-mark i:first-child { width:16px; transform:rotate(-18deg) translate(8px,-2px); background:var(--mint); }
.brand-mark i:nth-child(2) { transform:rotate(9deg); }
.market-label { display:flex; align-items:center; gap:8px; margin:auto; color:#d2ded7; letter-spacing:.16em; font-size:12px; }
.status-dot { width:5px; height:5px; background:var(--mint); border-radius:50%; flex-shrink:0; }
.header-tools { display:flex; align-items:center; gap:8px; }
.icon-button, .stage-tool { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-width:44px; min-height:44px; padding:9px; background:#19343d; border:1px solid #405860; border-radius:6px; }
.game-menu { position:relative; }
.game-menu summary { list-style:none; min-height:44px; display:flex; align-items:center; gap:9px; padding:8px 12px; font-size:13px; }
.game-menu summary::-webkit-details-marker { display:none; }
.menu-icon { font-size:21px; }
.menu-popover { position:absolute; top:52px; right:0; min-width:210px; background:#142f37; border:1px solid #547079; border-radius:8px; box-shadow:0 18px 45px #0007; padding:8px; }
.menu-popover button { background:none; display:flex; align-items:center; gap:12px; text-align:left; width:100%; min-height:46px; padding:9px 15px; font-size:14px; border-radius:3px; }
.menu-popover button:hover { background:#26414b; }
.mode-bar { min-height:46px; display:flex; align-items:center; gap:25px; padding:0 28px; background:#0d2027; z-index:2; }
.mode-switch { display:flex; gap:23px; align-self:stretch; }
.mode-switch button { background:none; color:var(--muted); min-height:44px; font-size:13px; padding:0 2px; border-bottom:2px solid transparent; }
.mode-switch button[aria-pressed=true]:disabled { opacity:1; }
.mode-switch button[aria-pressed=true] { color:var(--mint); border-color:var(--mint); }
.mode-label { font-size:12px; color:var(--muted); }
.personal-best { display:flex; align-items:center; gap:9px; margin-left:auto; font-size:12px; color:var(--muted); }
.personal-best svg { width:16px; height:16px; color:var(--accent); }
.personal-best strong { color:var(--ink); font-variant-numeric:tabular-nums; }
.run-notices { background:#203a43; z-index:2; }
.run-notices p { margin:0; font-size:12px; line-height:1.5; }
.daily-note, .rules-note { padding:8px 28px; }
.challenge-banner { display:flex; align-items:center; gap:12px; padding:4px 28px; }
.challenge-banner p { flex:1; }
.challenge-banner svg { width:18px; }
.challenge-banner .text-button { flex-shrink:0; }
.game-layout { display:flex; flex:1; min-height:0; flex-direction:column; }
.stage { position:relative; flex:1; min-height:310px; isolation:isolate; overflow:hidden; background:#112832; }
#world-3d { display:block; width:100%; height:100%; position:absolute; inset:0; touch-action:none; outline-offset:-5px; }
.stage-hud { position:absolute; left:32px; top:25px; pointer-events:none; display:flex; flex-direction:column; align-items:flex-start; gap:9px; }
.score-block { display:flex; flex-direction:column; text-shadow:0 2px 15px #000b; }
.score-block > span { font-size:11px; letter-spacing:.12em; color:#e1e6dc; }
.score-block strong { font-size:60px; font-weight:750; line-height:1.08; letter-spacing:-3px; font-variant-numeric:tabular-nums; }
.stage[data-theme=candy] .score-block { color:#142c34; text-shadow:none; }
.stage[data-theme=candy] .score-block > span { color:#142c34; }
.stack-counter { display:flex; align-items:center; gap:6px; font-size:12px; background:#10262eee; border:1px solid #3c5660; border-radius:4px; padding:5px 8px; }
.stack-counter strong { color:var(--mint); }
.stage-tools { position:absolute; right:28px; top:25px; }
.stage-tool { font-size:12px; background:#10262eee; }
.balance-display { position:absolute; left:32px; bottom:20px; display:flex; align-items:center; gap:10px; padding:7px 10px; background:#10262eee; border:1px solid #3c5660; border-radius:5px; pointer-events:none; font-size:11px; }
.balance-track { position:relative; width:65px; height:3px; background:#617078; }
.balance-track::before { content:''; position:absolute; left:50%; height:7px; top:-2px; border-left:1px solid #a2b5b9; }
#balance-marker { position:absolute; width:6px; height:9px; top:-3px; margin-left:-3px; border-radius:2px; background:var(--mint); }
.balance-display strong { min-width:22px; font-variant-numeric:tabular-nums; }
.stage-caption { position:absolute; bottom:20px; left:50%; transform:translateX(-50%); display:flex; align-items:center; gap:8px; font-size:12px; padding:7px 12px; background:#10262eee; border:1px solid #3c5660; border-radius:5px; white-space:nowrap; pointer-events:none; }
.crosshair { color:var(--mint); font-size:17px; line-height:1; }
.theme-timer { position:absolute; top:80px; right:28px; font-size:12px; background:#10262e; padding:7px 10px; }
.stage-overlay { position:absolute; inset:0; display:grid; place-items:center; padding:20px; background:#07141dcc; backdrop-filter:blur(7px); z-index:4; }
.overlay-card { width:min(100%,350px); text-align:center; }
.overlay-card h2 { font-size:31px; margin:6px 0; }
.overlay-card p { font-size:14px; color:var(--muted); line-height:1.6; }
.overlay-card .primary { width:100%; margin-top:10px; }
.overlay-card .text-button { margin-top:8px; }
.loading-label { position:absolute; inset:0; display:grid; place-items:center; background:#10262e; color:var(--mint); }
.play-panel { position:relative; z-index:2; display:grid; grid-template-columns:170px minmax(300px,1fr) 240px 190px; grid-template-rows:auto auto; gap:8px 20px; align-items:center; padding:20px max(28px,env(safe-area-inset-right)) max(16px,env(safe-area-inset-bottom)) max(28px,env(safe-area-inset-left)); border-top:1px solid #4f6a72; background:#10262e; min-height:186px; box-shadow:0 -12px 35px #07151c55; }
.dock-heading { grid-column:1; grid-row:1 / 3; align-self:center; }
.panel-heading { display:flex; align-items:baseline; gap:8px; font-size:12px; color:var(--muted); }
.panel-heading strong { color:var(--mint); font-size:17px; font-variant-numeric:tabular-nums; }
.dock-heading h2 { margin:7px 0 5px; font-size:20px; font-weight:650; letter-spacing:-.4px; }
.panel-description { font-size:12px; line-height:1.7; color:var(--muted); margin:0; }
.offers { grid-column:2; grid-row:1 / 3; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.offer { position:relative; border:1px solid #49616a; background:#18343d; border-radius:8px; padding:4px 8px 10px; min-width:0; min-height:142px; display:flex; align-items:center; flex-direction:column; gap:0; }
.offer[aria-pressed=true] { border-color:var(--mint); background:#214d51; box-shadow:inset 0 -3px var(--mint); }
.offer img { display:block; width:90px; height:78px; object-fit:contain; }
.offer-copy { display:flex; align-items:center; flex-direction:column; gap:4px; }
.offer strong { font-size:14px; font-weight:600; line-height:1.4; }
.offer small { color:#c2d1d0; font-size:11px; line-height:1.4; }
.offer-number { position:absolute; top:8px; left:9px; font:10px ui-monospace,monospace; color:#b6cecb; }
.offer-selected { display:none; position:absolute; right:8px; top:7px; color:var(--mint); font-size:12px; }
.offer[aria-pressed=true] .offer-selected { display:block; }
.manipulation { grid-column:3; grid-row:1; display:flex; gap:10px; justify-content:center; }
.rotate-controls { display:flex; align-items:center; border:1px solid #49616a; border-radius:6px; background:#0c222a; }
.rotate-controls .icon-button { border:0; background:transparent; }
.rotate-controls output { min-width:35px; text-align:center; font:13px ui-monospace,monospace; color:var(--muted); }
.flip-button { padding:9px 12px !important; }
.flip-button[aria-pressed=true] { color:var(--mint); border-color:var(--mint); background:#214d51; }
.selected-trait { display:none; }
.aim-controls { grid-column:3; grid-row:2; align-self:start; }
#precision summary { display:flex; align-items:center; justify-content:center; gap:9px; min-height:44px; list-style:none; color:var(--muted); font-size:12px; }
#precision summary::-webkit-details-marker { display:none; }
#precision svg { width:17px; }
.detail-chevron { margin-left:3px; }
.precision-inputs { position:absolute; bottom:calc(100% + 10px); right:230px; padding:18px; width:310px; background:#10262e; border:1px solid #6a858d; border-radius:8px; box-shadow:0 -4px 30px #0004; }
.aim-control label { display:flex; justify-content:space-between; font-size:12px; color:var(--muted); }
.aim-control input { width:100%; height:44px; margin:0; accent-color:var(--mint); }
.action-area { grid-column:4; grid-row:1 / 3; display:flex; flex-direction:column; gap:8px; align-items:stretch; }
.primary, .secondary { display:inline-flex; align-items:center; justify-content:center; gap:10px; text-decoration:none; border-radius:6px; min-height:48px; padding:11px 17px; font-size:15px; font-weight:650; line-height:1.4; }
.primary { background:var(--accent); color:#281b14; border:1px solid #ffb495; box-shadow:0 3px 0 #87452f; }
.primary:active:not(:disabled) { transform:translateY(2px); box-shadow:none; }
.secondary { background:#18343d; border:1px solid #617982; font-size:13px; }
.text-button { background:none; color:var(--muted); min-height:44px; padding:7px 5px; font-size:12px; }
.action-hint { font-size:11px; color:var(--muted); text-align:center; line-height:1.5; }
.share-status, .share-local-note { font-size:12px; line-height:1.6; color:var(--muted); margin:0; overflow-wrap:anywhere; }
.share-status:empty { display:none; }
.share-link { width:100%; min-height:44px; background:#0b1c23; color:var(--ink); border:1px solid #78959b; border-radius:4px; padding:8px; font-size:12px; }
.result, .settling { grid-column:2 / 4; grid-row:1 / 3; align-self:center; }
.result { display:flex; align-items:center; gap:20px; }
.result > span { display:grid; place-items:center; width:56px; height:56px; border:1px solid var(--mint); border-radius:50%; color:var(--mint); font-size:26px; flex-shrink:0; }
.result.failed > span { color:var(--accent); border-color:var(--accent); }
.result strong { font-size:25px; font-weight:600; }
.result p { font-size:13px; line-height:1.6; margin:4px 0 0; color:var(--muted); }
.settling { max-width:460px; width:100%; }
.settling > div { display:flex; justify-content:space-between; gap:12px; }
.settling strong { font-size:18px; font-weight:500; }
.settling span { font:13px ui-monospace,monospace; color:var(--mint); }
.settling progress { appearance:none; display:block; width:100%; height:5px; border:none; margin-top:15px; background:#324a53; border-radius:2px; }
.settling progress::-webkit-progress-bar { background:#324a53; border-radius:2px; }
.settling progress::-webkit-progress-value { background:var(--mint); border-radius:2px; }
.settling progress::-moz-progress-bar { background:var(--mint); }
.settling p { font-size:12px; color:var(--muted); margin-bottom:0; }
.play-panel[data-phase=banked] { grid-template-columns:170px minmax(240px,1fr) minmax(260px,420px); }
.play-panel[data-phase=banked] .result { grid-column:2; }
.play-panel[data-phase=banked] .action-area { grid-column:3; display:grid; grid-template-columns:1fr 1fr; }
.play-panel[data-phase=banked] .action-area > :is(input,p,.action-hint) { grid-column:1 / -1; }
.storage-note { background:#203a43; margin:0; padding:8px 28px; font-size:12px; }
.eyebrow { font-size:11px; letter-spacing:.13em; color:var(--mint); text-transform:uppercase; }
.no-script { padding:25px; }
dialog { overscroll-behavior:contain; width: min(530px,calc(100% - 32px)); max-height: calc(100svh - 32px); overflow-y: auto; border: 1px solid #59604f; border-radius: 12px; background: #292e27; color: var(--ink); padding: 33px; box-shadow: 0 20px 100px #0006; }
dialog::backdrop { background: #10140fd9; }
.dialog-close { position: absolute; top: 10px; right: 10px; display: grid; place-items: center; width: 44px; height: 44px; background: none; color: var(--muted); font-size: 28px; border-radius: 5px; }
.dialog-close:hover { color: var(--ink); background: #ffffff08; }
dialog .eyebrow { padding-right: 26px; }
dialog h2 { font-size: 28px; font-weight: 650; line-height: 1.4; margin: 9px 0 22px; }
dialog ol { list-style: none; counter-reset: steps; padding: 0; margin: 0; }
dialog ol li { counter-increment: steps; position: relative; padding-left: 40px; margin: 22px 0; }
dialog ol li::before { content: counter(steps); position: absolute; top: 0; left: 0; color: var(--accent); font-size: 20px; font-weight: 550; line-height: 1.5; }
dialog ol li strong { display: block; font-size: 15px; font-weight: 600; margin-bottom: 5px; }
dialog ol li span { color: var(--muted); font-size: 13px; line-height: 1.75; }
.keyboard-guide { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; font-size: 12px; padding-top: 22px; margin-top: 26px; border-top: 1px solid var(--line); }
.keyboard-guide > span { display: flex; align-items: center; flex-wrap: wrap; gap: 4px; }
kbd { background: #3b4134; border: 1px solid #636b56; border-radius: 3px; padding: 4px; font: inherit; font-size: 11px; }
.help-note, .dialog-intro { color: var(--muted); font-size: 13px; line-height: 1.8; margin: 21px 0; }
.motion-setting { font-size: 13px; display: flex; align-items: center; gap: 10px; margin: 18px 0 24px; min-height: 44px; }
.metrics-setting { margin-bottom: 8px; align-items: flex-start; line-height: 1.7; }
.metrics-status { margin: 0 0 20px; }
.metrics-status:empty { display: none; }
.packs-note { border-left: 2px solid #697459; padding-left: 12px; }
input[type=checkbox] { accent-color: var(--accent); width: 20px; height: 20px; flex-shrink: 0; }
.dialog-classic { display: flex; margin-top: 14px; }
.collection-dialog { width: min(700px,calc(100% - 32px)); }
.theme-options { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; margin: 25px 0; }
.theme-options > button, .theme-option, .theme-card { position: relative; min-width: 0; min-height: 115px; background: #343b2f; color: var(--ink); border: 1px solid #646d57; border-radius: 6px; padding: 16px 12px; text-align: left; }
.theme-options button:hover { background: #424c39; }
.theme-options [aria-pressed=true], .theme-options [aria-selected=true], .theme-options .selected { border-color: var(--accent); box-shadow: inset 0 -3px var(--accent); }
.theme-options strong { display: block; font-size: 15px; font-weight: 600; margin: 8px 0 4px; }
.theme-options small { display: block; font-size: 12px; line-height: 1.6; color: #c3c9b7; }
.theme-swatch { display: block; height: 60px; border-radius: 3px; background: var(--theme-color,#868b75); }
.theme-swatches { display: flex; overflow: hidden; height: 58px; border-radius: 3px; margin-bottom: 12px; }
.theme-swatches i { display: block; flex: 1; min-width: 0; }
.theme-preview-image { display: block; width: 100%; height: 84px; object-fit: cover; border-radius: 3px; margin-bottom: 12px; }
.theme-choice:has(.theme-preview-image) .theme-swatches { height: 6px; margin-top: -5px; margin-bottom: 12px; border-radius: 0; }
.collection-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 20px; }
.reward-panel { border-top: 1px solid var(--line); margin-top: 26px; padding-top: 17px; }
.reward-panel > p { font-size: 13px; line-height: 1.75; color: var(--muted); margin: 0 0 14px; }
.reward-panel:has(> #reward-disclosure[hidden]):has(> .consent-row[hidden]):has(> #reward-ad[hidden]):has(> #reward-status:empty) { display: none; }
.consent-row { display: flex; align-items: flex-start; gap: 10px; margin: 18px 0; font-size: 13px; line-height: 1.7; }
.consent-row input { margin: 1px 0 0; }
.consent-row label { cursor: pointer; min-height: 44px; }
.reward-panel #reward-status { color: #f0cca4; margin: 15px 0 0; }
.reward-status:empty { display: none; }
.progress-summary { font-size: 14px; line-height: 1.8; padding: 18px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.progress-summary strong { color: var(--accent); font-size: 24px; font-weight: 600; }
.badge-list { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 22px 0 0; padding: 0; list-style: none; }
.badge-list > * { min-width: 0; padding: 15px 12px; border: 1px solid #586149; border-radius: 5px; font-size: 13px; line-height: 1.7; background: #323a2c; }
.badge-list strong { display: block; margin-bottom: 4px; font-size: 14px; }
.badge-list .locked, .badge-list [data-unlocked=false] { opacity: .5; }

dialog { background:#10262e; border-color:#56717a; color:var(--ink); }
dialog::backdrop { background:#06141bcc; backdrop-filter:blur(6px); }
.theme-options > button { background:#19353e; }
.badge-list > * { background:#193e40; border-color:#426b69; }
.keyboard-guide { flex-wrap:wrap; }
@media (max-width:1100px) {
  .play-panel { grid-template-columns:minmax(260px,1fr) 235px 175px; column-gap:15px; padding:14px max(20px,env(safe-area-inset-right)) max(14px,env(safe-area-inset-bottom)) max(20px,env(safe-area-inset-left)); }
  .dock-heading { grid-column:1 / -1; grid-row:1; display:flex; align-items:baseline; gap:14px; }
  .dock-heading h2 { font-size:16px; margin:0; }
  .panel-heading { font-size:11px; }
  .panel-heading strong { font-size:13px; }
  .panel-description { margin-left:auto; }
  .offers { grid-column:1; grid-row:2 / 4; }
  .manipulation { grid-column:2; grid-row:2; }
  .aim-controls { grid-column:2; grid-row:3; }
  .action-area { grid-column:3; grid-row:2 / 4; }
  .offer { min-height:117px; }
  .offer img { width:74px; height:64px; }
  .offer small { font-size:10px; }
  .offer strong { font-size:12px; }
  .result, .settling { grid-column:1 / 3; grid-row:2 / 4; }
  .play-panel[data-phase=banked] { grid-template-columns:minmax(200px,1fr) minmax(260px,1fr); }
  .play-panel[data-phase=banked] .result { grid-column:1; }
  .play-panel[data-phase=banked] .action-area { grid-column:2; }
}
@media (max-width:760px) {
  .game-shell { min-height:680px; }
  .site-header { min-height:61px; gap:8px; padding:max(7px,env(safe-area-inset-top)) max(14px,env(safe-area-inset-right)) 7px max(14px,env(safe-area-inset-left)); }
  .brand { font-size:24px; gap:9px; }
  .brand-mark { transform:scale(.8); width:23px; }
  .brand small { font-size:8px; letter-spacing:2.4px; margin-top:6px; }
  .market-label { display:none; }
  .header-tools { margin-left:auto; gap:3px; }
  .header-tools .icon-button { background:none; border-color:transparent; }
  .game-menu summary { padding:8px; }
  .game-menu summary > span:last-child { display:none; }
  .mode-bar { padding:0 16px; gap:13px; min-height:44px; }
  .mode-switch { gap:18px; }
  .mode-switch button { font-size:12px; }
  .mode-label, .personal-best > span { display:none; }
  .personal-best { gap:6px; }
  .daily-note, .rules-note { padding:6px 15px; font-size:11px !important; }
  .challenge-banner { padding:5px 15px; gap:8px; }
  .challenge-banner p { font-size:11px; }
  .challenge-banner > svg { display:none; }
  .challenge-banner .text-button { font-size:11px; max-width:76px; }
  .stage { min-height:310px; }
  .stage-hud { left:17px; top:17px; gap:6px; }
  .score-block strong { font-size:43px; letter-spacing:-2px; }
  .score-block > span { font-size:10px; }
  .stack-counter { font-size:10px; padding:4px 6px; }
  .stage-tools { right:15px; top:17px; }
  .stage-tool span { display:none; }
  .balance-display { left:15px; bottom:12px; font-size:10px; padding:6px 8px; gap:6px; }
  .balance-track { width:35px; }
  .balance-display > span { display:none; }
  .stage-caption { left:auto; right:15px; bottom:12px; transform:none; font-size:10px; padding:6px 8px; gap:5px; max-width:calc(100% - 115px); white-space:normal; }
  .theme-timer { right:15px; top:69px; font-size:10px; }
  .play-panel { grid-template-columns:minmax(0,1fr) 120px; grid-template-rows:auto auto auto auto; gap:8px 10px; padding:10px max(14px,env(safe-area-inset-right)) max(9px,env(safe-area-inset-bottom)) max(14px,env(safe-area-inset-left)); min-height:233px; }
  .dock-heading { grid-column:1 / -1; grid-row:1; gap:10px; justify-content:space-between; }
  .dock-heading h2 { font-size:14px; }
  .panel-heading { font-size:11px; }
  .panel-description { display:none; }
  .offers { grid-column:1 / -1; grid-row:2; gap:8px; }
  .offer { min-height:87px; padding:2px 5px 7px; border-radius:6px; }
  .offer img { width:65px; height:51px; }
  .offer strong { font-size:12px; }
  .offer small, .offer-number { display:none; }
  .offer-selected { font-size:10px; right:6px; top:4px; }
  .selected-trait { display:block; grid-column:1 / -1; grid-row:3; margin:0; min-height:16px; font-size:11px; color:var(--muted); text-align:center; }
  .selected-trait:empty { display:none; }
  .manipulation { grid-column:1; grid-row:4; gap:6px; justify-content:flex-start; }
  .rotate-controls output { min-width:28px; font-size:12px; }
  .rotate-controls .icon-button { min-width:44px; padding:8px; }
  .flip-button { padding:8px !important; min-height:44px; gap:5px; font-size:12px; }
  .flip-button svg { width:18px; }
  .action-area { grid-column:2; grid-row:4; gap:7px; }
  .action-area .primary { min-height:46px; font-size:13px; padding:9px 10px; gap:5px; }
  .action-area .primary svg { width:19px; }
  .action-hint { display:none; }
  .aim-controls { grid-column:1 / -1; grid-row:5; }
  #precision summary { min-height:44px; font-size:11px; }
  .precision-inputs { bottom:calc(100% + 8px); right:14px; left:14px; width:auto; }
  .result, .settling { grid-column:1 / -1; grid-row:2 / 4; min-height:100px; }
  .result { gap:15px; }
  .result strong { font-size:21px; }
  .result p { font-size:12px; }
  .result > span { width:43px; height:43px; font-size:22px; }
  .play-panel:is([data-phase=stable],[data-phase=failed],[data-phase=banked],[data-phase=simulating]) .action-area { grid-column:1 / -1; grid-row:4; display:grid; grid-template-columns:1fr 1fr; }
  .play-panel[data-phase=simulating] #drop { grid-column:1 / -1; }
  .play-panel[data-phase=banked] { grid-template-columns:1fr 1fr; }
  .play-panel[data-phase=banked] .result { grid-column:1 / -1; }
  .play-panel .share-status, .play-panel .share-link { grid-column:1 / -1; }
  .action-area .secondary { font-size:12px; }
  dialog { padding:27px 22px; width:calc(100% - 24px); max-height:calc(100svh - 24px); }
  dialog h2 { font-size:25px; }
  .theme-options { grid-template-columns:1fr; gap:8px; }
  .theme-options > button { min-height:90px; }
  .theme-preview-image { max-height:110px; }
  .collection-actions { grid-template-columns:1fr; }
  .keyboard-guide { gap:12px; }
  .overlay-card h2 { font-size:25px; }
}
@media (max-width:370px) {
  .play-panel { grid-template-columns:minmax(0,1fr) 99px; column-gap:7px; padding-left:max(10px,env(safe-area-inset-left)); padding-right:max(10px,env(safe-area-inset-right)); }
  .flip-button span { display:none; }
  .flip-button { width:44px; }
  .offer strong { font-size:11px; }
  .brand { font-size:22px; }
  .mode-switch { gap:13px; }
}
@media (max-height:620px) and (min-width:761px) {
  .game-shell { min-height:660px; }
}
@media (prefers-reduced-motion:reduce) {
  *, *::before, *::after { animation:none !important; transition:none !important; scroll-behavior:auto !important; }
}
body.reduce-motion *, body.reduce-motion *::before, body.reduce-motion *::after { animation:none !important; transition:none !important; }

/* Shared-device Party uses the existing table and dock. */
.game-shell[data-mode=party] .personal-best,
.game-shell[data-mode=party] .score-block,
.game-shell[data-mode=party] .stack-counter { display:none; }
.party-bar { display:flex; align-items:center; gap:10px; min-height:48px; padding:3px max(28px,env(safe-area-inset-right)) 3px max(28px,env(safe-area-inset-left)); background:#18343d; border-bottom:1px solid #365560; font-size:13px; }
.party-bar > strong { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; min-width:0; }
.party-bar > span:not(.party-seat) { margin-left:auto; white-space:nowrap; font-size:12px; color:var(--muted); }
.party-bar .text-button { flex-shrink:0; margin-left:10px; padding:5px 10px; }
.party-seat { --seat-color:var(--mint); display:inline-grid; place-items:center; width:28px; height:28px; flex-shrink:0; border:1px solid var(--seat-color); border-radius:50%; color:var(--seat-color); font:600 13px ui-monospace,monospace; }
.party-bar .party-seat, .handoff-card .party-seat { --seat-color:inherit; }
.party-stack { display:flex; flex-direction:column; color:var(--ink); text-shadow:0 2px 15px #000b; }
.party-stack > span { font-size:11px; letter-spacing:.06em; }
.party-stack > strong { font-size:52px; line-height:1.12; letter-spacing:-2px; }
.party-stack small { font-size:20px; font-weight:400; color:#d4dedb; letter-spacing:0; }
.stage[data-theme=candy] .party-stack { color:#142c34; text-shadow:none; }
.stage[data-theme=candy] .party-stack small { color:#27434b; }
.party-handoff { z-index:3; background:#081820aa; backdrop-filter:blur(3px); }
.handoff-card { text-align:center; max-width:390px; width:100%; }
.handoff-card .eyebrow { margin:0 0 14px; }
.handoff-card > .party-seat { width:43px; height:43px; font-size:21px; }
.handoff-card h2 { margin:10px 0 6px; font-size:clamp(26px,4vw,38px); line-height:1.25; overflow-wrap:anywhere; }
.handoff-card > p:not(.eyebrow) { color:var(--muted); font-size:13px; margin:6px 0 19px; }
.handoff-card .primary { width:100%; }
.handoff-key { display:block; color:var(--muted); font-size:11px; margin-top:14px; }
.party-dialog #party-start { width:100%; }
.party-count { display:flex; gap:10px; padding:0; margin:22px 0; border:0; }
.party-count legend { font-size:13px; padding:0 0 10px; }
.party-count label { flex:1; cursor:pointer; position:relative; }
.party-count input { position:absolute; opacity:0; width:1px; height:1px; }
.party-count label > span { display:grid; place-items:center; min-height:46px; border:1px solid #56737b; border-radius:6px; background:#19343d; }
.party-count input:checked + span { border-color:var(--mint); background:#245153; color:var(--mint); box-shadow:inset 0 -3px var(--mint); }
.party-count input:focus-visible + span { outline:3px solid var(--mint); outline-offset:3px; }
.party-names { display:grid; gap:10px; }
.party-name-row { display:flex; align-items:center; gap:12px; }
.party-name-row input { width:100%; min-width:0; min-height:46px; border:1px solid #53707a; border-radius:5px; background:#0b2028; color:var(--ink); padding:10px 12px; font-size:16px; }
.party-name-row input::placeholder { color:#a0b7ba; }
.party-tally { grid-column:2 / 4; grid-row:3; }
.party-tally > p { font-size:11px; color:var(--muted); margin:5px 0 8px; }
.party-tally ol { display:flex; flex-wrap:wrap; gap:8px; list-style:none; margin:0; padding:0; }
.party-tally li { flex:1 1 120px; display:flex; align-items:center; gap:8px; min-width:0; background:#19343d; border:1px solid #3c5a65; padding:8px; border-radius:5px; }
.party-tally li[data-loser=true] { border-color:#ff8968; }
.party-tally li .party-seat { width:22px; height:22px; font-size:11px; }
.party-tally-name { font-size:12px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.party-tally li strong { margin-left:auto; font-size:17px; }
.party-tally > small { display:block; color:var(--muted); font-size:10px; margin-top:9px; line-height:1.5; }
.game-shell[data-mode=party] .play-panel[data-phase=banked] { grid-template-columns:170px minmax(300px,1fr) 240px 190px; }
.game-shell[data-mode=party] .play-panel[data-phase=banked] .result { grid-column:2 / 4; }
.game-shell[data-mode=party] .play-panel[data-phase=banked] .action-area { grid-column:4; display:flex; }
.game-shell[data-mode=party] .dock-heading h2, .game-shell[data-mode=party] .result strong { overflow-wrap:anywhere; }
@media (max-width:1100px) {
  .party-tally { grid-column:1 / 3; grid-row:4; }
  .game-shell[data-mode=party] .play-panel[data-phase=banked] { grid-template-columns:minmax(260px,1fr) 235px 175px; }
  .game-shell[data-mode=party] .play-panel[data-phase=banked] .result { grid-column:1 / 3; }
  .game-shell[data-mode=party] .play-panel[data-phase=banked] .action-area { grid-column:3; }
}
@media (max-width:760px) {
  .mode-switch { gap:16px; }
  .party-bar { min-height:44px; padding:0 max(14px,env(safe-area-inset-right)) 0 max(14px,env(safe-area-inset-left)); gap:7px; font-size:12px; }
  .party-bar .text-button { font-size:11px; margin-left:0; padding:5px; }
  .party-bar > span:not(.party-seat) { font-size:10px; }
  .party-bar .party-seat { width:23px; height:23px; font-size:11px; }
  .party-stack > strong { font-size:38px; }
  .party-stack > span { font-size:10px; }
  .party-stack small { font-size:17px; }
  .party-handoff { padding:18px; }
  .handoff-card { max-width:310px; }
  .handoff-card h2 { font-size:28px; }
  .handoff-card .eyebrow { font-size:10px; margin-bottom:10px; }
  .handoff-card > .party-seat { width:32px; height:32px; font-size:17px; }
  .handoff-card .primary { font-size:14px; }
  .handoff-card > p:not(.eyebrow) { margin-bottom:14px; font-size:12px; }
  .handoff-key { font-size:10px; margin-top:10px; }
  .game-shell[data-mode=party] .dock-heading h2 { max-width:70%; font-size:13px; }
  .party-tally { grid-column:1 / -1; grid-row:5; }
  .party-tally li { flex-basis:calc(50% - 8px); }
  .game-shell[data-mode=party] .play-panel[data-phase=banked] { grid-template-columns:minmax(0,1fr) 120px; }
  .game-shell[data-mode=party] .play-panel[data-phase=banked] .result { grid-column:1 / -1; }
  .game-shell[data-mode=party] .play-panel[data-phase=banked] .action-area { grid-column:1 / -1; display:grid; }
}

/* Destinations and toy cabinet share the game's compact material language. */
.stage-tools { display:flex; flex-direction:column; gap:8px; align-items:flex-end; }
.theme-timer { top:130px; }
.market-label { font-size:14px; letter-spacing:.03em; }
.collection-dialog { width:min(860px,calc(100% - 24px)); max-height:90dvh; overscroll-behavior:contain; }
.collection-tabs { display:flex; gap:6px; border-bottom:1px solid var(--line); margin-top:24px; }
.collection-tabs button { flex:1; min-height:48px; padding:8px 10px; background:transparent; color:var(--muted); font-size:14px; border-bottom:2px solid transparent; }
.collection-tabs button[aria-pressed=true] { color:var(--mint); border-color:var(--mint); }
.theme-options { margin:18px 0; }
.theme-options > button { padding:0 0 15px; overflow:hidden; background:#18333e; border-color:#45616b; }
.theme-options strong,.theme-options small { margin-left:14px; margin-right:14px; }
.theme-options strong { font-size:16px; }
.theme-options small { font-size:14px; line-height:1.5; }
.theme-preview-image { height:130px; margin:0 0 12px; border-radius:0; }
.theme-choice:has(.theme-preview-image) .theme-swatches { display:none; }
.theme-swatches { margin:0; border-radius:0; height:130px; }
.theme-badge { display:inline-block; margin:0 14px; color:var(--mint); font-size:12px; }
.object-catalog { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin:18px 0; }
.catalog-item { min-width:0; padding:12px; border:1px solid #3f5c66; border-radius:6px; background:#18333e; }
.catalog-item img { display:block; width:100%; height:115px; object-fit:contain; }
.catalog-item strong { display:block; font-size:16px; margin:5px 0; }
.catalog-item p { font-size:14px; color:var(--muted); margin:0; line-height:1.5; }
.catalog-new { color:var(--mint); font-size:12px; }
.stage[data-theme=cloud_noodle] .score-block,.stage[data-theme=cosmic_bathroom] .score-block,.stage[data-theme=lunar_laundromat] .score-block { background:#10262ed9; padding:10px 14px; border-radius:6px; }
@media(max-width:600px) {
  .collection-dialog { padding:24px 16px; }
  .collection-tabs button { padding:8px 5px; font-size:13px; }
  .theme-options { grid-template-columns:1fr; }
  .theme-options > button { display:grid; grid-template-columns:110px 1fr; padding:0; min-height:112px; align-content:center; }
  .theme-preview-image,.theme-swatches { grid-column:1; grid-row:1/4; width:110px; height:100%; min-height:112px; margin:0; }
  .theme-options strong,.theme-options small,.theme-badge { grid-column:2; margin-top:3px; margin-bottom:3px; }
  .object-catalog { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
  .catalog-item { padding:10px; }
  .catalog-item img { height:90px; }
  .catalog-item strong { font-size:14px; }
  .catalog-item p { font-size:13px; }
  .stage-tools { gap:6px; }
  .theme-timer { top:120px; }
}

/* Gift Party: a toy-building tray and a sealed handoff, using the existing table HUD. */
.party-variant { border:0; padding:0; margin:20px 0 8px; display:flex; gap:8px; }
.party-variant legend { font-size:13px; margin-bottom:10px; }
.party-variant label { position:relative; flex:1; cursor:pointer; }
.party-variant input { position:absolute; opacity:0; width:1px; height:1px; }
.party-variant span { display:flex; align-items:center; justify-content:center; text-align:center; min-height:48px; padding:8px; border:1px solid #56737b; border-radius:6px; background:#19343d; font-size:14px; }
.party-variant input:checked + span { border-color:var(--mint); color:var(--mint); box-shadow:inset 0 -3px var(--mint); background:#245153; }
.party-variant input:focus-visible + span { outline:3px solid var(--mint); outline-offset:3px; }
.gift-builder { grid-column:3; grid-row:1 / 3; display:grid; gap:9px; }
.gift-slots { display:grid; gap:5px; }
.gift-slots button,.gift-joins button { min-width:0; min-height:36px; border:1px solid #4f6c76; border-radius:5px; background:#0c222a; padding:6px 8px; font-size:12px; overflow-wrap:anywhere; }
.gift-slots button { text-align:left; }
.gift-slots button[aria-pressed=true],.gift-joins button[aria-pressed=true] { border-color:var(--mint); color:var(--mint); background:#214d51; }
.gift-joins { display:flex; gap:5px; }
.gift-joins button { flex:1; }
.gift-builder small { font-size:10px; color:var(--muted); line-height:1.5; }
#gift-send { overflow-wrap:anywhere; }
.gift-label { grid-column:2; grid-row:1 / 3; text-align:center; min-width:0; }
.gift-label > small { color:var(--mint); font-size:11px; }
.gift-label > strong { display:block; font-size:13px; overflow-wrap:anywhere; }
.gift-receipt { display:flex; align-items:center; justify-content:center; gap:12px; }
.gift-receipt img { width:84px; height:68px; object-fit:contain; }
.handoff-card #gift-return { width:100%; margin-top:10px; }
.handoff-card #gift-return-note { margin-top:7px; color:#ffbea5; }
.game-shell[data-party-variant=gifts] .handoff-card { max-width:420px; }
.game-shell[data-party-variant=gifts] .handoff-card p { overflow-wrap:anywhere; }
.game-shell[data-party-variant=gifts] .party-handoff { overflow:auto; }
.game-shell[data-party-variant=gifts][data-party-phase=building] #selected-trait { display:none; }
@media(max-width:1100px) {
  .gift-builder { grid-column:2; grid-row:2 / 4; }
  .gift-label { grid-column:1; grid-row:2 / 4; }
}
@media(max-width:760px) {
  .gift-builder { grid-column:1 / -1; grid-row:3; grid-template-columns:minmax(0,1fr) 120px; gap:6px 8px; }
  .gift-slots { grid-template-columns:1fr 1fr; }
  .gift-joins { align-items:stretch; }
  .gift-builder small { grid-column:1 / -1; }
  .game-shell[data-party-phase=building] .action-area { grid-column:1 / -1; grid-row:4; }
  .game-shell[data-party-phase=building] .play-panel { min-height:280px; }
  .gift-label { grid-column:1 / -1; grid-row:2; }
  .gift-label > small { font-size:10px; }
  .gift-label .gift-receipt { float:left; margin-right:8px; }
  .gift-label .gift-receipt img { width:46px; height:38px; }
  .gift-label { text-align:left; padding:7px; background:#19343d; border-radius:5px; }
  .gift-label > strong { font-size:12px; margin-top:5px; }
  .game-shell[data-party-variant=gifts] .handoff-card { padding:15px 20px; }
  .game-shell[data-party-variant=gifts] .handoff-card h2 { margin:6px 0; font-size:24px; }
  .game-shell[data-party-variant=gifts] .handoff-card > .party-seat { display:none; }
  .game-shell[data-party-variant=gifts] .handoff-card .gift-receipt img { width:65px; height:48px; }
  .game-shell[data-party-variant=gifts] .handoff-card #gift-return { margin-top:7px; }
  .game-shell[data-party-variant=gifts] .handoff-card .handoff-key { font-size:10px; margin-top:6px; }
}
.handoff-card .gift-receipt .gift-composite { width:120px; height:110px; }
@media(max-width:760px) {
  .game-shell[data-party-variant=gifts] .handoff-card .gift-receipt .gift-composite { width:90px; height:72px; }
}

/* Live rooms share the table, with explicit ownership of each move. */
.online-bar { display:flex; align-items:center; gap:14px; padding:9px 28px; background:#143238; border-bottom:1px solid #38585c; font-size:12px; }
.online-code-badge { color:var(--mint); font-size:10px; letter-spacing:1px; white-space:nowrap; }
.online-code-badge strong { color:var(--ink); font-size:15px; margin-left:6px; letter-spacing:2px; }
#online-status { flex:1; overflow-wrap:anywhere; }
.online-bar .text-button { padding:3px 0; font-size:12px; }
.online-connection:has(#online-error:not([hidden])) { padding:7px 28px; background:#493c30; color:#ffe3b8; font-size:12px; }
.online-connection .text-button { padding:4px 12px; }
.online-lobby { background:#061a2270; backdrop-filter:blur(4px); z-index:4; overflow:auto; padding:20px; }
.online-lobby-card { width:min(460px,100%); margin:auto; padding:26px; border:1px solid #50777a; border-radius:12px; background:#102b32f5; box-shadow:0 22px 70px #0008; text-align:center; }
.online-lobby-card h2 { font-size:26px; margin:8px 0; }
.lobby-code { display:block; font-size:36px; letter-spacing:.18em; color:var(--mint); margin:12px 0 18px; font-variant-numeric:tabular-nums; }
.online-copy-status { display:block; color:var(--mint); min-height:18px; margin-top:5px; font-size:11px; }
.online-members { padding:0; list-style:none; text-align:left; margin:12px 0 20px; }
.online-members li { display:grid; grid-template-columns:30px minmax(0,1fr); gap:2px 10px; border-bottom:1px solid #355358; padding:10px 0; }
.online-members .party-seat { grid-row:1 / 3; align-self:center; }
.online-members strong { font-size:15px; overflow-wrap:anywhere; }
.online-members small { color:var(--muted); font-size:11px; }
.online-lobby-actions { display:flex; gap:8px; }
.online-lobby-actions > button { flex:1; padding:10px; font-size:13px; }
#online-ready[aria-pressed=true] { color:var(--mint); border-color:var(--mint); background:#1c4a4a; }
.online-tabs { display:flex; gap:8px; margin:20px 0; }
.online-tabs button { flex:1; min-height:45px; border:1px solid #426369; border-radius:6px; background:#173a43; }
.online-tabs button[aria-pressed=true] { color:var(--mint); border-color:var(--mint); }
.online-dialog form > label,.online-dialog label { display:block; margin:15px 0 7px; color:var(--muted); font-size:13px; }
.online-dialog input { display:block; width:100%; background:#0c2028; color:var(--ink); border:1px solid #64858b; border-radius:6px; min-height:48px; padding:10px 12px; }
#online-code { letter-spacing:.15em; font-size:22px; text-transform:uppercase; }
#online-submit { width:100%; }
#online-form-error { color:#ffc4a8; }
.online-action-card { grid-column:2 / 4; grid-row:1 / 4; padding:12px 16px; background:#15373f; border:1px solid #547d7e; border-radius:8px; }
.online-action-card > strong { font-size:18px; overflow-wrap:anywhere; }
.online-action-card p { font-size:12px; color:var(--muted); line-height:1.5; }
.online-action-card > div { display:flex; gap:8px; }
.online-action-card button { min-height:42px; padding:9px 12px; font-size:13px; }
.game-shell[data-online=lobby] .play-panel,.game-shell[data-online=connecting] .play-panel { display:none; }
.game-shell[data-online=lobby] .stage-hud,.game-shell[data-online=lobby] .stage-caption,.game-shell[data-online=lobby] .balance-display { visibility:hidden; }
.game-shell[data-online=lobby] .stage { min-height:550px; }
.game-shell[data-online=playing][data-party-phase=handoff] .action-area { display:none; }
@media(max-width:1100px) { .online-action-card { grid-column:1 / 3; grid-row:2 / 4; } }
@media(max-width:760px) {
  .mode-switch { gap:16px; }
  .online-bar { padding:7px 14px; gap:8px; flex-wrap:wrap; }
  #online-status { order:3; flex-basis:100%; font-size:11px; }
  #online-leave { margin-left:auto; }
  .online-connection:has(#online-error:not([hidden])) { padding:7px 14px; }
  .online-lobby { padding:12px; }
  .online-lobby-card { padding:18px; }
  .online-lobby-card h2 { font-size:23px; }
  .lobby-code { font-size:31px; margin:9px 0 12px; }
  .online-action-card { grid-column:1 / -1; grid-row:2 / 5; padding:12px; }
  .online-action-card > div { flex-wrap:wrap; }
  .online-action-card button { flex:1; }
  .game-shell[data-online=lobby] .stage { min-height:570px; }
}

/* Camera editing stays outside the scene so controls never cover a placement. */
#view[aria-pressed=true] { color:var(--mint); border-color:var(--mint); background:#214a4e; }
#view span { display:inline; }
.stage[data-camera=orbit] #world-3d { cursor:grab; }
.stage[data-camera=orbit] #world-3d:active { cursor:grabbing; }
.camera-controls { display:flex; flex-shrink:0; align-items:center; justify-content:center; flex-wrap:wrap; gap:10px 18px; padding:8px 16px; background:#17343b; border-top:1px solid #46676b; }
.camera-controls output { color:var(--mint); font-size:11px; min-width:105px; font-variant-numeric:tabular-nums; }
.camera-directions,.camera-presets { display:flex; gap:5px; }
.camera-controls button { min-height:40px; min-width:40px; padding:6px 10px; border:1px solid #4c7076; border-radius:5px; background:#102932; }
.camera-directions button { font-size:21px; }
.camera-presets button { font-size:12px; }
#camera-done { color:#092727; border-color:var(--mint); background:var(--mint); font-weight:650; }
@media(max-width:760px) {
  #view { font-size:11px; padding:7px 9px; }
  #view svg { width:18px; }
  .camera-controls { gap:6px; padding:7px 10px; }
  .camera-controls output { display:none; }
  .camera-directions { width:100%; justify-content:center; }
  .camera-directions button { min-width:40px; min-height:42px; }
  .camera-presets { width:100%; justify-content:center; }
  .camera-presets button { flex:1; min-height:38px; }
}

.game-mode-links{display:flex;gap:4px;align-items:center;margin-left:auto;font-size:12px}.game-mode-links a{padding:9px 11px;border:1px solid #ffffff20;border-radius:8px;color:inherit;text-decoration:none;white-space:nowrap}.game-mode-links a[aria-current]{background:#ffffff15}.site-header .market-label{display:none}@media(max-width:740px){.site-header{flex-wrap:wrap;height:auto;gap:10px;padding-bottom:12px}.game-mode-links{order:3;width:100%;justify-content:stretch}.game-mode-links a{flex:1;text-align:center;font-size:11px}.header-tools{margin-left:auto}}
