/* Star room runtime. Layout is authored on a 390×660 canvas scaled by --sr-scale;
   colours and art come from the theme (--sr-* variables set by theme.js). */
html,body{margin:0;height:100%;background:transparent;overflow:hidden;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.sr-app{--sr-scale:1;position:fixed;inset:0;font-family:var(--sr-font-body,system-ui,sans-serif);color:var(--sr-paper,#fff);user-select:none;-webkit-user-select:none}
.sr-app *{box-sizing:border-box}
.sr-app img{pointer-events:none}
.sr-seats{position:absolute;inset:0 0 auto;height:25%;pointer-events:none}
.sr-panel{position:absolute;inset:auto 0 0;height:75%;overflow:hidden;background:var(--sr-bg) center bottom/cover no-repeat,var(--sr-leaf,#2f7d32);border-radius:22px 22px 0 0;box-shadow:0 -6px 24px rgba(0,0,0,.35)}
.sr-app[data-mode=full] .sr-seats{display:none}
.sr-app[data-mode=full] .sr-panel{height:100%;border-radius:0}
.sr-panel::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.28),rgba(0,0,0,0) 22%,rgba(0,0,0,0) 70%,rgba(0,0,0,.35))}
.sr-canvas{position:absolute;left:50%;top:50%;width:390px;height:660px;transform:translate(-50%,-50%) scale(var(--sr-scale));transform-origin:50% 50%}

/* buttons */
:where(.sr-app) button{font:inherit;color:inherit;border:0;background:none;padding:0;cursor:pointer}
.sr-app button:focus-visible,.sr-back:focus-visible{outline:3px solid var(--sr-glow,#fff2a8);outline-offset:2px}
.sr-btn{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--sr-art-button) center/contain no-repeat;color:var(--sr-paper,#fff);text-decoration:none;filter:drop-shadow(0 2px 2px rgba(0,0,0,.4));transition:transform .12s}
.sr-btn:active{transform:scale(.9)}
.sr-glyph{font:800 20px/1 var(--sr-font-display);text-shadow:0 1px 0 rgba(0,0,0,.5)}
.sr-back .sr-glyph{font-size:28px;margin-top:-3px}

/* top bar */
.sr-top{position:absolute;inset:6px 8px auto;height:54px;display:grid;grid-template-columns:36px 1fr auto;align-items:center;gap:6px}
.sr-title{height:44px;width:auto;justify-self:start;filter:drop-shadow(0 2px 3px rgba(0,0,0,.45))}
.sr-meta{position:absolute;inset-inline-start:46px;bottom:-6px;display:flex;gap:6px;font-size:11px;font-weight:700;text-shadow:0 1px 2px #000}
.sr-meta span:empty{display:none}
.sr-online::before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:#7CFF6B;margin-inline-end:4px;box-shadow:0 0 6px #7CFF6B}
.sr-actions{display:flex;gap:5px}
.sr-actions .sr-btn{width:34px;height:34px}
.sr-actions .sr-glyph{font-size:17px}

/* trend */
.sr-trend{position:absolute;inset:66px 10px auto;height:34px;display:flex;align-items:center;gap:6px;padding:0 6px;border-radius:17px;background:var(--sr-shade,rgba(0,0,0,.5));border:1px solid rgba(255,255,255,.18)}
.sr-trend-label{flex:none;font-size:11px;font-weight:800;color:var(--sr-accent,#ffd447);white-space:nowrap}
.sr-trend-list{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;flex:1;align-items:center;padding:2px 0}
.sr-trend-list::-webkit-scrollbar{display:none}
.sr-trend-item{position:relative;flex:none;width:28px;height:28px;border-radius:50%;background:rgba(255,255,255,.14);display:grid;place-items:center}
.sr-trend-item img{width:26px;height:26px;object-fit:contain}
.sr-trend-item.new{background:radial-gradient(var(--sr-glow,#fff2a8),var(--sr-accent2,#ff8a1f));box-shadow:0 0 8px var(--sr-accent,#ffd447)}
.sr-new{position:absolute;top:-5px;inset-inline-end:-6px;font:800 9px/1 var(--sr-font-body);font-style:normal;padding:2px 3px;border-radius:6px;background:#e5322d;color:#fff}

/* stage host + hint */
.sr-stage-host{position:absolute;inset:104px 0 auto;height:446px}
.sr-hint{position:absolute;inset:auto 12px 98px;margin:0;text-align:center;font:800 13px/1.2 var(--sr-font-display);color:var(--sr-paper,#fff);text-shadow:0 1px 3px #000,0 0 8px rgba(0,0,0,.6)}

/* countdown sits in the stage hub */
.sr-countdown{position:absolute;inset:0;display:grid;place-items:center;background:var(--sr-art-timerRing) center/contain no-repeat}
.sr-countdown-value{font:900 44px/1 var(--sr-font-display);color:var(--sr-accent,#ffd447);-webkit-text-stroke:2px var(--sr-ink,#3b1a06);paint-order:stroke fill;text-shadow:0 3px 0 var(--sr-ink,#3b1a06)}
.sr-countdown.urgent .sr-countdown-value{color:#ff5a3c;animation:sr-beat 1s ease-in-out infinite}
@keyframes sr-beat{0%,100%{transform:scale(1)}30%{transform:scale(1.22)}}

/* bottom: balance + chips */
.sr-bottom{position:absolute;inset:auto 8px 8px;height:84px;display:flex;align-items:center;gap:6px}
.sr-balance{flex:none;display:flex;align-items:center;gap:4px;height:42px;min-width:112px;padding:0 12px 0 6px;background:var(--sr-art-pill) center/100% 100% no-repeat}
.sr-coin-icon{width:28px;height:28px}
.sr-balance-value{font:900 15px/1 var(--sr-font-display);font-variant-numeric:tabular-nums;color:var(--sr-label,var(--sr-accent,#ffd447));text-shadow:0 1px 0 #000}
.sr-chips{flex:0 1 240px;margin-inline-start:auto;display:flex;justify-content:space-evenly;align-items:center}
.sr-chip{position:relative;width:56px;height:56px;display:grid;place-items:center;transition:transform .15s,filter .15s;filter:drop-shadow(0 3px 2px rgba(0,0,0,.45)) saturate(.85)}
.sr-chip-art{position:absolute;inset:0;width:100%;height:100%}
.sr-chip-label{position:relative;font:900 15px/1 var(--sr-font-display);color:var(--sr-ink,#3b1a06);text-shadow:0 1px 0 rgba(255,255,255,.6)}
.sr-chip.selected{transform:translateY(-8px) scale(1.12);filter:drop-shadow(0 0 8px var(--sr-glow,#fff2a8)) drop-shadow(0 4px 3px rgba(0,0,0,.5))}
.sr-retry{position:absolute;inset:auto 90px 96px;height:36px;border-radius:18px;background:linear-gradient(var(--sr-accent,#ffd447),var(--sr-accent2,#ff8a1f));color:var(--sr-ink,#3b1a06);font:900 13px/1 var(--sr-font-display);box-shadow:0 3px 0 var(--sr-ink,#3b1a06)}
.sr-retry.pulse{animation:sr-beat .6s 2}
[hidden]{display:none!important}

/* markets (stage modules place them; the runtime fills the labels) */
.sr-market{position:absolute;display:block}
.sr-market-art{width:100%;height:100%;object-fit:contain}
.sr-market-name{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.sr-mult{position:absolute;left:50%;bottom:-4px;transform:translateX(-50%);min-width:50px;padding:3px 6px 4px;background:var(--sr-art-plate) center/100% 100% no-repeat;font:900 13px/1 var(--sr-font-display);color:var(--sr-label,var(--sr-accent,#ffd447));text-shadow:0 1px 0 #000;white-space:nowrap}
.sr-total,.sr-mine{position:absolute;font:800 11px/1 var(--sr-font-body);padding:2px 5px;border-radius:8px;white-space:nowrap}
.sr-total{top:-2px;inset-inline-end:-6px;background:rgba(0,0,0,.6);color:#fff}
.sr-mine{top:-2px;inset-inline-start:-6px;background:linear-gradient(var(--sr-accent,#ffd447),var(--sr-accent2,#ff8a1f));color:var(--sr-ink,#3b1a06)}
.sr-total:empty,.sr-mine:empty{display:none}
.sr-market:active:not(.locked){transform:var(--sr-pos,none) scale(.93)}

/* settlement bar */
.sr-settle{position:absolute;inset:auto 10px 92px;height:118px;display:grid;grid-template-columns:1.25fr 1fr 1fr;align-items:center;padding:26px 26px 22px;background:var(--sr-art-settleBar) center/100% 100% no-repeat;color:var(--sr-paper,#fff6dc);animation:sr-rise .35s cubic-bezier(.2,1.4,.4,1);z-index:5}
.sr-settle-cell{display:flex;flex-direction:column;align-items:center;gap:3px;min-width:0}
.sr-settle-cell small{font:900 12px/1 var(--sr-font-body);color:#fff;-webkit-text-stroke:3px var(--sr-ink,#3b1a06);paint-order:stroke fill}
.sr-settle-cell strong{font:900 19px/1.1 var(--sr-font-display);color:#fff;-webkit-text-stroke:4px var(--sr-ink,#3b1a06);paint-order:stroke fill;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.sr-settle-result{flex-direction:row;flex-wrap:wrap;justify-content:center}
.sr-settle-result small{width:100%;text-align:center}
.sr-settle-art{width:40px;height:40px;object-fit:contain}
.sr-settle-none{grid-column:span 2;font-size:14px!important;color:var(--sr-paper,#fff6dc)!important}
.sr-settle-stake:has(.sr-settle-none){grid-column:span 2}
.sr-settle.rewarded .sr-reward-on{color:var(--sr-accent,#ffd447);animation:sr-beat 1s 2}
@keyframes sr-rise{from{transform:translateY(30px) scale(.9);opacity:0}}

/* round ranking */
.sr-rank{position:absolute;left:50%;top:118px;width:228px;height:340px;margin-left:-114px;padding:100px 22px 20px;background:var(--sr-art-rankBoard) center/100% 100% no-repeat;z-index:6;animation:sr-rise .3s ease-out}
.sr-rank-title{position:absolute;inset:52px 0 auto;margin:0;text-align:center;font:900 15px/1 var(--sr-font-display);color:var(--sr-label,var(--sr-accent,#ffd447));text-shadow:0 1px 0 #000}
.sr-rank-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.sr-rank-row{display:grid;grid-template-columns:22px 22px 1fr auto;gap:6px;align-items:center;padding:6px 8px;border-radius:10px;background:rgba(0,0,0,.28);font-size:12px;font-weight:800}
.sr-rank-row.me{background:linear-gradient(90deg,rgba(255,212,71,.55),rgba(255,138,31,.35));outline:1px solid var(--sr-accent,#ffd447)}
.sr-rank-no{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--sr-accent,#ffd447);color:var(--sr-ink,#3b1a06);font-weight:900}
.sr-rank-avatar{width:22px;height:22px;border-radius:50%;object-fit:cover;display:grid;place-items:center;background:rgba(255,255,255,.22);font-size:11px;font-weight:900;border:1px solid rgba(255,255,255,.5)}
.sr-rank-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sr-rank-reward{color:var(--sr-accent,#ffd447)}
.sr-rank-empty{padding:30px 6px;text-align:center;font-size:13px;font-weight:800;line-height:1.4}

/* rejection card */
.sr-toast{position:absolute;left:40px;right:40px;top:200px;padding:22px 20px 18px;border-radius:18px;background:linear-gradient(var(--sr-paper,#fff6dc),#f3dfb0);border:3px solid var(--sr-ink,#3b1a06);box-shadow:0 8px 0 rgba(0,0,0,.35);color:var(--sr-ink,#3b1a06);text-align:center;z-index:8;animation:sr-rise .25s ease-out}
.sr-toast-text{margin:0 0 14px;font:800 15px/1.35 var(--sr-font-body)}
.sr-toast-ok{min-width:96px;height:36px;border-radius:18px;background:linear-gradient(var(--sr-accent,#ffd447),var(--sr-accent2,#ff8a1f));color:var(--sr-ink,#3b1a06);font:900 15px/1 var(--sr-font-display);box-shadow:0 3px 0 var(--sr-ink,#3b1a06)}

/* sheets: rules / records / sound */
.sr-sheet{position:absolute;inset:60px 12px 10px;padding:84px 62px 58px;background:var(--sr-art-panel) center/100% 100% no-repeat;color:var(--sr-ink,#3b1a06);z-index:9;display:flex;flex-direction:column;animation:sr-rise .25s ease-out}
.sr-sheet-title{position:absolute;inset:38px 70px auto;margin:0;text-align:center;font:900 19px/1 var(--sr-font-display)}
.sr-sheet-close{position:absolute;top:22px;inset-inline-end:22px}
.sr-sheet-body{flex:1;overflow-y:auto;font-size:13px;line-height:1.45;-webkit-overflow-scrolling:touch}
.sr-rule{margin:0 0 10px}
.sr-mult-table h3{margin:6px 0;font-size:14px}
.sr-mult-row{display:flex;justify-content:space-between;padding:4px 2px;border-bottom:1px dashed rgba(59,26,6,.25)}
.sr-record{display:flex;flex-direction:column;gap:2px;padding:8px 4px;border-bottom:1px dashed rgba(59,26,6,.25)}
.sr-record.rewarded .sr-record-main{color:#1d7a22;font-weight:800}
.sr-record-lit{opacity:.75}
.sr-empty{text-align:center;padding:30px 0;opacity:.8}
.sr-slider{display:grid;grid-template-columns:auto 1fr 32px;gap:10px;align-items:center;margin:14px 0;font-weight:800}
.sr-slider input{width:100%;accent-color:var(--sr-accent2,#ff8a1f)}
.sr-mute{width:100%;margin-top:10px;height:40px;border-radius:20px;border:2px solid var(--sr-ink,#3b1a06);font-weight:900}
.sr-mute[aria-pressed=true]{background:var(--sr-ink,#3b1a06);color:var(--sr-paper,#fff6dc)}

/* coin fly */
.sr-fly-layer{position:absolute;inset:0;pointer-events:none;z-index:7}
.sr-fly{position:absolute;left:0;top:0;width:26px;height:26px;margin:-13px 0 0 -13px;animation:sr-fly .75s cubic-bezier(.3,0,.6,1) var(--d,0ms) both}
@keyframes sr-fly{from{transform:translate(var(--x0),var(--y0)) scale(.8)}50%{transform:translate(calc((var(--x0) + var(--x1))/2),calc(min(var(--y0),var(--y1)) - 50px)) scale(1.1)}to{transform:translate(var(--x1),var(--y1)) scale(.7);opacity:.2}}

@media (prefers-reduced-motion:reduce){.sr-app *{animation:none!important;transition:none!important}}