:root{--bg: #12100e;--panel: #1e1a17;--panel-2: #2b2521;--text: #f2ebe2;--muted: #a4968a;--accent: #f9a03f;--accent-ink: #2a1602;--good: #4ade80;--bad: #f8746a;--gold: #fbbf24;color-scheme:dark}*{box-sizing:border-box}html,body,#app{height:100%}body{margin:0;background:var(--bg);color:var(--text);font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;-webkit-tap-highlight-color:transparent;overflow:hidden}.defs{position:absolute}.game{position:relative;height:100%;max-width:860px;margin-inline:auto;padding:max(10px,env(safe-area-inset-top)) max(10px,env(safe-area-inset-right)) max(10px,env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-left));display:flex;flex-direction:column;gap:8px;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}.hud{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px}.chips{display:flex;flex-wrap:wrap;gap:5px;min-width:0}.actions{display:flex;gap:6px;flex:none}.chip{display:inline-flex;align-items:center;gap:5px;min-height:36px;padding-inline:9px;border-radius:10px;background:var(--panel);font-size:15px;font-weight:700;font-variant-numeric:tabular-nums}.chip[hidden]{display:none}.chip .icon{width:16px;height:16px;flex:none}.chip-value{direction:ltr;unicode-bidi:isolate}#score-chip .icon{color:var(--accent)}#level-chip .icon{color:var(--muted)}#combo-chip{color:#fdba74}#combo-chip .icon{color:#fb923c}#best-chip .icon{color:var(--gold)}#lives-chip .icon{color:#f472b6}#lives-chip.is-low{color:var(--bad);animation:pulse 1s steps(1,end) infinite}#lives-chip.is-low .icon{color:var(--bad)}@keyframes pulse{50%{opacity:.6}}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;min-width:44px;padding-inline:14px;border:0;border-radius:10px;background:var(--panel-2);color:var(--text);font:inherit;font-weight:600;cursor:pointer}.btn .icon{width:20px;height:20px;flex:none}.btn-icon{padding-inline:0}.btn-icon span[hidden]{display:none}.btn:active{transform:translateY(1px)}.btn[hidden]{display:none}.btn-primary{background:var(--accent);color:var(--accent-ink);padding-inline:24px}#sound-btn[aria-pressed=false]{color:var(--muted)}.orders{--tbw: 60px;flex:0 0 26%;min-height:0;display:flex;gap:6px}.slot{flex:1 1 0;min-width:0}.ticket{--left: 1;height:100%;display:flex;flex-direction:column;align-items:center;gap:4px;padding:5px 4px;border-radius:12px;background:linear-gradient(180deg,var(--panel-2),var(--panel));box-shadow:inset 0 0 0 1.5px #ffffff0d;transition:box-shadow .14s ease,background .2s ease}.slot.is-empty .ticket{background:none;box-shadow:inset 0 0 0 1.5px #ffffff0d}.slot.is-empty .bar,.slot.is-empty .face{visibility:hidden}.ticket.is-match{box-shadow:inset 0 0 0 2px var(--accent),0 0 14px #f9a03f40}.ticket.is-warn{background:linear-gradient(180deg,#4a2320,#2a1715);animation:fret .62s ease-in-out infinite}@keyframes fret{25%{transform:translate(-2px) rotate(-.8deg)}75%{transform:translate(2px) rotate(.8deg)}}.ticket.is-new{animation:ticket-in .22s ease-out}@keyframes ticket-in{0%{opacity:0;transform:translateY(-8px)}}.face{flex:none;width:min(38%,32px);aspect-ratio:1}.face-art{width:100%;height:100%;display:block}.face-head{fill:#f0c08a}.face-brows,.face-flat,.face-frown,.ticket.is-half .face-smile{opacity:0}.ticket.is-half .face-flat{opacity:1}.ticket.is-warn .face-head{fill:#eda06f}.ticket.is-warn .face-smile,.ticket.is-warn .face-flat{opacity:0}.ticket.is-warn .face-frown,.ticket.is-warn .face-brows{opacity:1}.ticket-burger{position:relative;flex:1 1 auto;min-height:0;width:100%}.bar{flex:none;width:100%;height:5px;border-radius:999px;background:#ffffff1f;overflow:hidden}.bar-fill{display:block;width:100%;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--good),var(--accent));transform-origin:left center;transform:scaleX(var(--left))}[dir=rtl] .bar-fill{transform-origin:right center}.ticket.is-warn .bar-fill{background:var(--bad)}.rack{flex:none;width:100%;max-width:560px;margin-inline:auto;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.pick{display:flex;align-items:center;justify-content:center;min-height:44px;padding:4px 8px;border:0;border-radius:12px;background:var(--panel);cursor:pointer;touch-action:none;box-shadow:inset 0 0 0 1.5px #ffffff0d}.pick:active{transform:translateY(1px)}.pick:disabled{cursor:default;opacity:.45}.pick .layer{width:86%;height:auto;aspect-ratio:calc(120 / var(--h));transform:scaleY(1.55)}.pick-serve{background:linear-gradient(180deg,#3a2a17,#2a1d10);box-shadow:inset 0 0 0 1.5px #f9a03f59}.rack.can-serve .pick-serve{box-shadow:inset 0 0 0 2px var(--accent),0 0 14px #f9a03f4d}.stage:before{content:"";position:absolute;inset:0;border-radius:14px;background:radial-gradient(ellipse at 50% 86%,rgba(249,160,63,.16),transparent 58%),linear-gradient(180deg,#17130f 0% 54%,#2d241d 54.6%,#1b1512);box-shadow:inset 0 0 0 1.5px #ffffff0a}.stage{--bw: 120px;position:relative;flex:1 1 auto;min-height:0;display:flex;align-items:center;justify-content:center}.plate{position:relative;z-index:1;width:min(100%,calc(var(--bw) * 1.6));height:min(100%,calc(var(--bw) * 1.5));padding:0;border:0;background:none;cursor:pointer;touch-action:none;-webkit-tap-highlight-color:transparent}.plate:disabled{cursor:default}.dish{position:absolute;inset-inline:0;bottom:0;height:calc(var(--bw) * .14);margin-inline:auto;width:calc(var(--bw) * 1.32);border-radius:50%;background:linear-gradient(180deg,#d9d3ca,#8e857a);box-shadow:0 6px 16px #00000073}.plate .stack{bottom:calc(var(--bw) * .07)}.plate.is-denied{animation:refuse .26s ease}@keyframes refuse{25%{transform:translate(-5px)}75%{transform:translate(5px)}}.stack{position:absolute;inset-inline:0;bottom:0;margin-inline:auto;width:var(--sw);display:flex;flex-direction:column-reverse;pointer-events:none}.plate-stack{--sw: var(--bw)}.mini-stack{--sw: var(--tbw)}.layer{display:block;flex:none;width:100%;height:calc(var(--sw) * var(--h) / 120)}.layer-art{display:block;width:100%;height:100%}.layer.is-dropping{animation:drop .18s cubic-bezier(.3,1.5,.5,1)}@keyframes drop{0%{opacity:.3;transform:translateY(-70%)}}.stack[data-mode=served]{animation:hand-off .34s ease-in forwards}@keyframes hand-off{60%{transform:translateY(-8%)}to{opacity:0;transform:translateY(-26%) scale(.9)}}.stack[data-mode=ruined]{animation:binned .42s ease-in forwards}@keyframes binned{20%{transform:translate(-4px) rotate(-3deg)}60%{transform:translate(4px) rotate(3deg)}to{opacity:0;transform:translateY(26%) rotate(8deg)}}.toast{position:absolute;inset-inline:0;top:2%;margin:0;text-align:center;font-size:clamp(14px,3.4vw,20px);font-weight:800;line-height:1.2;opacity:0;pointer-events:none;text-shadow:0 2px 8px rgba(0,0,0,.7)}.toast.is-up{animation:toast-up 1.1s ease-out forwards}.toast[data-kind=good]{color:var(--good)}.toast[data-kind=bad]{color:var(--bad)}.toast[data-kind=level]{color:var(--accent)}@keyframes toast-up{0%{opacity:0;transform:translateY(14px)}18%{opacity:1;transform:translateY(0)}75%{opacity:1}to{opacity:0;transform:translateY(-10px)}}.status{margin:0;min-height:2.6em;text-align:center;font-size:14px;font-weight:600;line-height:1.35}.status.is-hint{color:var(--muted);font-size:13px;font-weight:400}.status.is-over{color:var(--accent)}.overlay{position:absolute;inset:0;z-index:3;display:flex;align-items:center;justify-content:center;padding:12px;background:#12100eb8;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);animation:overlay-in .2s ease-out;pointer-events:none}.overlay[hidden]{display:none}@keyframes overlay-in{0%{opacity:0}}.overlay-card{pointer-events:auto;max-width:100%;max-height:100%;overflow-y:auto;display:flex;flex-direction:column;align-items:center;gap:8px;padding:16px 20px;border-radius:16px;background:var(--panel);box-shadow:0 18px 44px #0000008c;text-align:center}.overlay-title{margin:0;font-size:clamp(19px,4.4vw,28px);font-weight:800}.overlay-line{margin:0;color:var(--muted);font-size:15px;font-weight:600;line-height:1.35;font-variant-numeric:tabular-nums}.overlay-note{margin:0;color:var(--muted);font-size:14px;font-variant-numeric:tabular-nums}.overlay-note:empty{display:none}.overlay-note.is-best{color:var(--gold);font-weight:700}.overlay-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:2px}@media(min-width:430px){.rack{grid-template-columns:repeat(6,minmax(0,1fr))}}@media(max-width:380px){#best-chip,#level-chip{display:none}}@media(max-height:470px){.game{padding:max(7px,env(safe-area-inset-top)) max(7px,env(safe-area-inset-right)) max(7px,env(safe-area-inset-bottom)) max(7px,env(safe-area-inset-left));gap:5px}.chip{min-height:32px;padding-inline:8px;font-size:14px}.btn{min-height:38px;min-width:38px}.orders{flex-basis:26%}.face{display:none}.pick{min-height:38px}.status{display:none}}@media(max-width:380px)and (max-height:470px){.stage{padding-inline-end:126px}.toast{inset-inline:0 126px;font-size:13px}.overlay{padding-block-end:62px}.overlay-card{padding:12px 14px;gap:6px}.overlay-title{font-size:18px}.overlay-line{font-size:13px}.overlay-note{font-size:12px}}@media(max-width:260px){#combo-chip{display:none}.chip{min-height:30px;padding-inline:6px;font-size:12px;gap:4px}.chip .icon{width:14px;height:14px}.btn{min-height:36px;min-width:36px}.btn .icon{width:18px;height:18px}.hud,.chips,.actions,.orders,.rack{gap:4px}.pick{min-height:34px;padding-inline:4px}.ticket{padding:3px 2px;gap:2px}.orders{flex-basis:24%}}@media(max-height:470px)and (min-aspect-ratio:13 / 10){.game{display:grid;grid-template-columns:auto minmax(0,1fr) auto;grid-template-rows:44% minmax(0,1fr);gap:6px 8px;max-width:none}.hud{grid-column:1;grid-row:1 / span 2;display:flex;flex-direction:column;justify-content:center;align-items:stretch;width:min(30vw,150px);gap:6px;min-height:0;overflow-y:auto}.chips{flex-direction:column;flex-wrap:nowrap}.actions{justify-content:center}.orders{grid-column:2;grid-row:1;flex:1 1 auto}.stage{grid-column:2;grid-row:2}.rack{grid-column:3;grid-row:1 / span 2;width:min(34vw,170px);grid-template-columns:repeat(2,minmax(0,1fr));align-content:center;padding-block-end:52px}}@media(prefers-reduced-motion:reduce){.ticket.is-warn,#lives-chip.is-low{animation:none}.ticket.is-new,.layer.is-dropping,.plate.is-denied,.overlay{animation-duration:1ms}.stack[data-mode=served],.stack[data-mode=ruined]{animation-duration:.12s}.toast.is-up{animation:toast-plain 1.1s steps(1,end) forwards}@keyframes toast-plain{0%,92%{opacity:1}to{opacity:0}}}