*{box-sizing:border-box}
:root{--bg:#0d3b2e;--felt:#14563f;--card:#fff;--ink:#1d2433;--gold:#f2c94c;--red:#d63c3c;--muted:#8aa69a;--panel:#103f31}
html,body{margin:0;background:var(--bg);color:#eef6f1;font-family:-apple-system,"PingFang SC","Microsoft YaHei",system-ui,sans-serif;font-size:15px}
button{font:inherit;border:0;border-radius:10px;padding:10px 16px;background:var(--gold);color:#2b2100;font-weight:600;cursor:pointer;touch-action:manipulation}
button:disabled{opacity:.45;cursor:not-allowed}
button.secondary{background:#3fa47a;color:#fff}
button.ghost{background:transparent;color:#eef6f1;border:1px solid #5c8f7d}
button.small{padding:5px 10px;font-size:13px}
button.wide{width:100%;margin-top:10px}
input{font:inherit;padding:10px;border-radius:8px;border:1px solid #5c8f7d;background:#0a2e24;color:#fff;width:100%}
label{display:block;margin:10px 0;color:var(--muted)}
label input{margin-top:4px}
.hidden{display:none!important}
.topbar{display:flex;justify-content:space-between;align-items:center;padding:10px 16px;background:#082a20;position:sticky;top:0;z-index:5}
.brand{font-weight:700;font-size:17px}
.userbar{display:flex;gap:10px;align-items:center}
.chips b{color:var(--gold)}
main{max-width:980px;margin:0 auto;padding:14px}
body.in-table{overflow:hidden}
body.in-table .topbar{display:none}
body.in-table #viewTable{position:fixed;inset:0}
body.in-table main{padding:0}
.card{background:var(--panel);border-radius:14px;padding:16px;margin-bottom:14px;box-shadow:0 2px 10px #0004}
.card h2,.card h3{margin:0 0 10px}
.narrow{max-width:420px;margin:40px auto}
.row{display:flex;gap:10px;flex-wrap:wrap;margin-top:10px}
.row input{flex:1;min-width:120px}
.label{color:var(--muted);margin:10px 0 6px}
.seg{display:flex;flex-wrap:wrap;gap:8px}
.seg button{background:#0a2e24;color:#cfe;border:1px solid #2f6b56}
.seg button.on{background:var(--gold);color:#2b2100;border-color:var(--gold)}
.msg{color:#ffb4a8;min-height:1em}
.rules ul{margin:0;padding-left:18px;line-height:1.7;color:#cfe3d9}

.pill{background:#0009;border:1px solid #fff3;border-radius:999px;padding:3px 10px;font-size:12px;white-space:nowrap;backdrop-filter:blur(2px)}
.pill.gray{color:#cfd8d3}.pill.ok{color:#7ff0a8;border-color:#3fa47a}
.pill.bk{color:var(--gold);border-color:#f2c94c88}
.pill.warn{background:#a8361a;border-color:#ff7a50;color:#fff;font-weight:700}
.note{background:#000b;border:1px solid #f2c94c88;color:#ffe9a6;border-radius:10px;padding:6px 12px;margin:4px 0;text-align:center;font-size:13px}
.pos{color:#7ff0a8}.neg{color:#ff8b7b}
.autoinfo{color:#ffe9a6;background:#000a;border:1px solid #f2c94c88;border-radius:8px;padding:3px 8px;font-size:12px;white-space:nowrap}
.adminlink{display:block;margin:0 0 10px;padding:10px 14px;border-radius:10px;background:#2b3a55;color:#ffe9a6;text-decoration:none;font-weight:600;text-align:center}
.foul{color:#ffd0c6;background:#7a1c0ccc;border-radius:8px;padding:4px 8px;font-size:12px}

/* ---------- 牌（叠放显示左上角点数花色） ---------- */
:root{--cw:62px}
.pc{position:relative;flex:none;width:var(--cw);height:calc(var(--cw)*1.4);border-radius:calc(var(--cw)*.1);background:linear-gradient(160deg,#fff,#eef0f4);color:var(--ink);
  box-shadow:-2px 1px 4px #0006;user-select:none;cursor:pointer;transform:translateY(var(--lift,0px)) rotate(var(--rot,0deg));transform-origin:50% 120%;transition:transform .12s;border:1px solid #c9ced8}
.pc.r{color:var(--red)}
.pc .ix{position:absolute;left:calc(var(--cw)*.06);top:calc(var(--cw)*.04);display:flex;flex-direction:column;align-items:center;line-height:.95;font-weight:800;font-size:calc(var(--cw)*.3)}
.pc .ix i{font-style:normal;font-size:calc(var(--cw)*.28)}
.pc .big{position:absolute;right:calc(var(--cw)*.08);bottom:calc(var(--cw)*.04);font-size:calc(var(--cw)*.55);opacity:.9}
.pc.sel{--lift:-18px;box-shadow:0 0 0 3px var(--gold),-2px 4px 10px #0008}
.pc.mini{--cw:30px}
.fan{display:flex;align-items:flex-end}
.fan>.pc+.pc{margin-left:calc(var(--cw)*-.58)}
.fan.tight>.pc+.pc{margin-left:calc(var(--cw)*-.66)}
.cb{flex:none;width:22px;height:31px;border-radius:3px;border:1px solid #fff9;background:repeating-linear-gradient(45deg,#b3263a 0 4px,#8c1a2c 4px 8px);box-shadow:-1px 1px 2px #0007}
.backs{display:flex}.backs .cb+.cb{margin-left:-17px}
.cnt-badge{background:#000a;border-radius:8px;padding:0 6px;font-size:12px;margin-left:6px;align-self:center}

/* ---------- 舞台（横屏） ---------- */
.stage{position:fixed;inset:0;overflow:hidden;background:#123}
.scene{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.felt{position:absolute;left:12%;right:12%;top:16%;bottom:10%;border-radius:50%/42%;box-shadow:0 0 0 10px #3b2414,0 0 0 13px #1d1108,0 18px 50px #000c,inset 0 0 70px #0008;
  background:radial-gradient(ellipse at 50% 40%,#1f7a55,#0f4a33);display:flex;align-items:center;justify-content:center}
.felt-logo{font-weight:900;letter-spacing:.3em;color:#ffffff14;font-size:clamp(20px,5vw,54px)}
.hud{position:absolute;top:6px;left:8px;display:flex;flex-wrap:wrap;gap:5px;max-width:58%;z-index:6}
.hud-r{left:auto;right:8px;justify-content:flex-end;max-width:40%}
.hud select{font:inherit;font-size:12px;background:#000a;color:#fff;border:1px solid #fff4;border-radius:8px;padding:3px 6px}
.hud .ghost{background:#0009}
.seats{position:absolute;inset:0;pointer-events:none;z-index:3}
.seat{position:absolute;pointer-events:auto;background:#000a;border:2px solid #fff2;border-radius:12px;padding:5px 8px;min-width:110px;text-align:center;font-size:12px}
.seat.banker{border-color:var(--gold);box-shadow:0 0 14px #f2c94c88}
.seat.me{border-color:#7fd1ae}
.seat .nm{font-weight:700;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:160px}
.seat .tags{display:flex;gap:3px;justify-content:center;flex-wrap:wrap;margin:3px 0}
.seat .cards{display:flex;justify-content:center;margin-top:3px}
.seat .shown{display:flex;flex-direction:row;gap:5px;align-items:flex-end;justify-content:center;margin-top:3px}
.seat .delta{font-weight:800;font-size:13px}
.tag{font-size:11px;padding:1px 5px;border-radius:5px;background:#2f6b56}
.tag.bk{background:var(--gold);color:#2b2100;font-weight:800}
.tag.bot{background:#5465a8}.tag.ok{background:#3fa47a}.tag.empty{background:#555}
.seat.p2{top:34px;left:50%;transform:translateX(-50%)}
.seat.p3{left:8px;top:42%;transform:translateY(-50%)}
.seat.p1{right:8px;top:42%;transform:translateY(-50%)}
.seat.p0{left:8px;bottom:8px}
.stage.arranging .seat.p0{display:none}
.center{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;z-index:4;max-width:50%}
.stage.arranging .center{top:30%}
.actions{display:flex;gap:10px;justify-content:center;margin:6px 0}
.actions button{box-shadow:0 4px 14px #000a;font-size:16px;padding:10px 22px}

/* 排墩区 */
.arrange{position:absolute;left:0;right:0;bottom:4px;z-index:5;display:grid;grid-template-columns:auto auto;grid-template-areas:"streets side" "hand hand";justify-content:center;column-gap:12px;row-gap:2px;pointer-events:none}
.arrange>*{pointer-events:auto}
.streets{grid-area:streets;display:flex;gap:8px;align-items:flex-end}
.street{background:#0007;border:2px dashed #ffffff40;border-radius:10px;padding:2px 6px 6px;cursor:pointer;min-width:calc(var(--cw)*1.2)}
.street[data-st=front]{min-width:calc(var(--cw)*1.9)}
.street[data-st=middle],.street[data-st=back]{min-width:calc(var(--cw)*2.75)}
.street.target{border-color:var(--gold);background:#f2c94c22}
.street.drop{background:#ffffff22}
.st-title{font-size:11px;color:#dfe;white-space:nowrap}
.htype{color:var(--gold);font-weight:700}
.slots{display:flex;min-height:calc(var(--cw)*1.4)}
.slots>.pc+.pc{margin-left:calc(var(--cw)*-.5)}
.arr-side{grid-area:side;display:flex;flex-direction:column;gap:4px;justify-content:flex-end;max-width:240px}
.arr-side .row{margin:0;gap:6px;flex-wrap:nowrap}
.arr-side .tip{font-size:11px;color:#dfe;opacity:.8}
.hand{grid-area:hand;display:flex;justify-content:center;align-items:flex-end;padding-top:20px;min-height:calc(var(--cw)*1.4 + 22px)}
.hand>.pc+.pc{margin-left:calc(var(--cw)*-.52)}
.hand>.pc:hover{--lift:-8px}
.hand>.pc.sel:hover{--lift:-18px}
.stage.zoom{--cw:84px}

/* 结算抽屉 */
.result{position:absolute;right:8px;top:38px;bottom:8px;width:min(48%,440px);overflow:auto;z-index:7;background:#081c16ee;border:1px solid #f2c94c66;border-radius:14px;padding:10px 12px;font-size:13px;box-shadow:0 10px 40px #000c}
.result h3{margin:0 0 6px;font-size:15px;display:flex;justify-content:space-between;align-items:center}
.result-edge{background:#ffffff0d;border-radius:10px;padding:6px 8px;margin:6px 0}
.result-edge .hd{display:flex;justify-content:space-between;flex-wrap:wrap;gap:4px;margin-bottom:4px}
.strow{display:grid;grid-template-columns:34px auto 42px auto;gap:4px;align-items:center;margin:3px 0;justify-content:start}
.minis{display:flex}.minis>.pc+.pc{margin-left:calc(var(--cw)*-.55)}
.badge{font-size:11px;border-radius:5px;padding:1px 4px;text-align:center}
.badge.win{background:#2c7a52}.badge.lose{background:#8a2e22}.badge.tie{background:#555}
.shoot{background:#c4542a;color:#fff;border-radius:6px;padding:1px 6px;font-size:11px;font-weight:700}

.modal{position:absolute;inset:0;background:#000a;display:flex;align-items:center;justify-content:center;z-index:20;padding:16px}
.modal-box{background:#0d2d23;border:2px solid var(--gold);border-radius:16px;padding:16px 20px;max-width:380px;width:100%;text-align:center}
.modal-box h3{margin:0}
.modal-box .big{font-size:26px;color:var(--gold);font-weight:800;margin:4px 0}
.toast{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);background:#000c;color:#fff;padding:10px 16px;border-radius:10px;z-index:30}

/* 手机横屏（矮屏） */
@media (max-height:500px){
  :root{--cw:40px}
  .stage.zoom{--cw:54px}
  .seat{min-width:86px;padding:3px 6px;font-size:11px}
  .seat .nm{font-size:12px;max-width:110px}
  .seat.p2{top:28px}
  .pc.mini{--cw:22px}
  .cb{width:16px;height:23px}.backs .cb+.cb{margin-left:-12px}
  .hud{gap:3px;top:3px}.pill{font-size:11px;padding:2px 7px}
  .actions button{font-size:14px;padding:8px 16px}
  .arr-side .tip{display:none}
  .hand{padding-top:16px}
  .result{top:30px}
}
/* 手机竖屏：CSS 旋转 90° 强制横屏显示 */
@media (orientation:portrait) and (max-width:760px){
  :root{--cw:40px}
  body.in-table .stage{width:100vh;height:100vw;inset:auto;top:0;left:100vw;transform:rotate(90deg);transform-origin:top left}
  .seat{min-width:86px;padding:3px 6px;font-size:11px}
  .pc.mini{--cw:22px}
  .cb{width:16px;height:23px}.backs .cb+.cb{margin-left:-12px}
  .pill{font-size:11px;padding:2px 7px}
  .arr-side .tip{display:none}
}

/* ---------- 场景 ---------- */
.stage.noanim .scene *{animation:none!important}
@media (prefers-reduced-motion:reduce){.scene *{animation-duration:0s!important}}
/* 公园 */
.stage[data-scene=park]{background:linear-gradient(#7cc6f5 0,#bfe7ff 45%,#7fbf5a 46%,#4f8f37 100%)}
.stage[data-scene=park] .felt{background:repeating-linear-gradient(90deg,#9a6a3c 0 38px,#8a5c32 38px 40px),#9a6a3c;box-shadow:0 0 0 8px #6b4423,0 18px 40px #0008,inset 0 0 50px #0006;border-radius:28px}
.stage[data-scene=park] .felt-logo{color:#ffffff22}
.sun{position:absolute;right:12%;top:6%;width:70px;height:70px;border-radius:50%;background:radial-gradient(#fff6c0,#ffd84a 60%,#ffd84a00 72%);animation:pulse 4s ease-in-out infinite}
.cloud{position:absolute;left:-20%;width:140px;height:40px;border-radius:40px;background:#fff;opacity:.9;animation:drift linear infinite;box-shadow:40px -18px 0 6px #fff,80px 0 0 0 #fff}
.tree{position:absolute;bottom:52%;width:120px;border-radius:50% 50% 45% 45%;background:radial-gradient(circle at 40% 35%,#6fbf4a,#2f7a2a);transform-origin:50% 100%;animation:sway 4s ease-in-out infinite alternate}
.leaf{position:absolute;top:-5%;width:12px;height:8px;border-radius:0 80% 0 80%;background:#d8a23a;animation:fall linear infinite,sway2 ease-in-out infinite alternate}
.leaf:nth-child(3n){background:#9cc94a}.leaf:nth-child(4n){background:#e0703a}
@keyframes drift{to{transform:translateX(140vw)}}
@keyframes sway{from{transform:rotate(-1.5deg)}to{transform:rotate(1.5deg)}}
@keyframes sway2{from{margin-left:-20px}to{margin-left:20px}}
@keyframes fall{from{transform:translateY(0) rotate(0)}to{transform:translateY(110vh) rotate(calc(var(--h)*4deg))}}
@keyframes pulse{50%{transform:scale(1.08);opacity:.85}}
/* 办公室 */
.stage[data-scene=office]{background:linear-gradient(#3a4250,#2a303a)}
.window{position:absolute;left:6%;right:6%;top:4%;height:46%;border:8px solid #9aa3ad;border-radius:4px;background:linear-gradient(#0b1530,#1d2b55 70%,#26304a);overflow:hidden}
.bld{position:absolute;bottom:22%;background:repeating-linear-gradient(0deg,#0e1424 0 6px,transparent 6px 12px),repeating-linear-gradient(90deg,#ffe08a55 0 4px,#0e1424 4px 9px);background-color:#0e1424}
.road{position:absolute;left:0;right:0;bottom:0;height:22%;background:#151a22}
.car{position:absolute;left:-10%;width:34px;height:4px;border-radius:4px;background:linear-gradient(90deg,#fff0,#fff 70%,#ffe);box-shadow:0 0 10px 2px #fff8;animation:car linear infinite}
.car.rev{left:auto;right:-10%;background:linear-gradient(90deg,#f33,#f330);box-shadow:0 0 10px 2px #f338;animation-name:carrev}
@keyframes car{to{transform:translateX(130vw)}}
@keyframes carrev{to{transform:translateX(-130vw)}}
.blinds{position:absolute;left:6%;right:6%;top:4%;height:12%;background:repeating-linear-gradient(#c9ced4 0 5px,#aeb4bb 5px 8px);opacity:.85}
.lamp{position:absolute;left:50%;top:0;width:240px;height:60%;transform:translateX(-50%);background:radial-gradient(ellipse at 50% 0,#fff8d040,#fff0 70%)}
.stage[data-scene=office] .felt{background:linear-gradient(135deg,#6d7e8f,#4a5868);box-shadow:0 0 0 8px #2f3742,0 18px 40px #000a,inset 0 0 50px #0005;border-radius:40px}
/* KTV */
.stage[data-scene=ktv]{background:radial-gradient(ellipse at 50% 100%,#3a0b4a,#12021a 70%)}
.beam{position:absolute;top:-10%;width:60px;height:120%;transform-origin:50% 0;background:linear-gradient(var(--c),#fff0 80%);opacity:.28;filter:blur(4px);animation:beam ease-in-out infinite alternate}
@keyframes beam{from{transform:rotate(-30deg)}to{transform:rotate(30deg)}}
.neon{position:absolute;border:3px solid #ff3cac;border-radius:20px;box-shadow:0 0 12px #ff3cac,inset 0 0 12px #ff3cac;animation:flick 2.4s infinite}
.neon.n1{left:3%;top:6%;width:30%;height:22%}.neon.n2{right:3%;top:6%;width:30%;height:22%;border-color:#2bd2ff;box-shadow:0 0 12px #2bd2ff,inset 0 0 12px #2bd2ff;animation-delay:-1.1s}
.neon-text{position:absolute;left:50%;top:5%;transform:translateX(-50%);font:900 34px/1 sans-serif;color:#fff;text-shadow:0 0 6px #ff3cac,0 0 18px #ff3cac,0 0 30px #b44bff;animation:flick 3s infinite}
@keyframes flick{0%,18%,22%,60%,64%,100%{opacity:1}20%,62%{opacity:.35}}
.disco{position:absolute;width:6px;height:6px;border-radius:50%;background:var(--c);box-shadow:0 0 8px var(--c);animation:twinkle 3s infinite}
@keyframes twinkle{50%{opacity:.1;transform:scale(.5)}}
.stage[data-scene=ktv] .felt{background:radial-gradient(ellipse,#5a1f6e,#2c0b3a);box-shadow:0 0 0 8px #1a0522,0 0 30px 6px #ff3cac66,inset 0 0 60px #0008}
/* 体育馆 */
.stage[data-scene=gym]{background:linear-gradient(#0c1220,#1b2236 55%,#2a2f3e)}
.stands{position:absolute;left:0;right:0;top:6%;height:44%;background:repeating-linear-gradient(0deg,#ffffff08 0 2px,transparent 2px 14px),radial-gradient(#3b4560 1.6px,transparent 2px) 0 0/12px 12px}
.flash{position:absolute;width:5px;height:5px;border-radius:50%;background:#fff;box-shadow:0 0 10px 4px #fff;opacity:0;animation:flash infinite}
@keyframes flash{0%,92%,100%{opacity:0}95%{opacity:1}}
.spot{position:absolute;top:-8%;width:110px;height:130%;transform-origin:50% 0;background:linear-gradient(#fffbe0aa,#fff0 75%);clip-path:polygon(42% 0,58% 0,100% 100%,0 100%);opacity:.35;animation:beam ease-in-out infinite alternate}
.board{position:absolute;left:50%;top:1%;transform:translateX(-50%);width:120px;height:26px;border-radius:4px;background:#111;border:2px solid #555;box-shadow:0 0 8px #f80}
.stage[data-scene=gym] .felt{background:repeating-linear-gradient(90deg,#c98a4b 0 30px,#bf7f41 30px 32px);box-shadow:0 0 0 6px #fff,0 0 0 10px #1d4f9c,0 18px 40px #000a;border-radius:14px}
.stage[data-scene=gym] .felt-logo{color:#ffffff40}
/* 餐馆 */
.stage[data-scene=restaurant]{background:linear-gradient(#5a1a12,#2b0d08)}
.warm{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 0,#ffb85c55,#0000 60%);animation:pulse 5s ease-in-out infinite}
.lantern{position:absolute;top:0;width:44px;height:120px;transform-origin:50% 0;animation:swing ease-in-out infinite alternate}
.lantern::before{content:"";position:absolute;left:21px;top:0;width:2px;height:50px;background:#2a1a10}
.lantern::after{content:"福";position:absolute;left:0;top:48px;width:44px;height:52px;border-radius:45%;background:radial-gradient(#ff6a3a,#c41a12);box-shadow:0 0 22px 6px #ff4a1a66;color:#ffd84a;font:700 20px/52px serif;text-align:center}
@keyframes swing{from{transform:rotate(-7deg)}to{transform:rotate(7deg)}}
.steam{position:absolute;bottom:12%;width:22px;height:60px;border-radius:50%;background:#fff;filter:blur(8px);opacity:0;animation:steam ease-out infinite}
@keyframes steam{0%{opacity:0;transform:translateY(0) scale(.6)}30%{opacity:.35}100%{opacity:0;transform:translateY(-140px) scale(1.6)}}
.screen{position:absolute;left:0;right:0;bottom:0;height:30%;background:repeating-linear-gradient(90deg,#3a160e 0 3px,transparent 3px 26px)}
.stage[data-scene=restaurant] .felt{background:radial-gradient(ellipse,#b5281e,#7a140e);box-shadow:0 0 0 8px #3a1a0a,0 18px 40px #000b,inset 0 0 60px #0007}
.stage[data-scene=restaurant] .felt-logo{color:#ffd84a33}

/* ---------- 摊牌：三墩叠放；侧边=名字→每墩注→打枪等；上/下/左 meta 右、右家 meta 左 ---------- */
.stage.settled .seats{display:none}
.result{position:absolute;inset:0;z-index:4;pointer-events:none;background:none;border:0;box-shadow:none;padding:0;overflow:visible;width:auto;top:0;right:0;bottom:0}
.sd{position:absolute;pointer-events:auto;display:flex;align-items:center;gap:8px;background:#0b1f18e6;border:1px solid #ffffff22;border-radius:12px;padding:6px 8px;--cw:98px}
.sd.meta-right{flex-direction:row}
.sd.meta-left{flex-direction:row-reverse}
.sd.bk{border-color:var(--gold);box-shadow:0 0 14px #f2c94c66}
.sd.me{border-color:#7fd1ae}
.sd.p2{top:18px;left:50%;transform:translateX(-50%)}
.sd.p0{bottom:4px;left:50%;transform:translateX(-50%)}
.sd.p3{left:4px;top:50%;transform:translateY(-50%)}
.sd.p1{right:4px;top:50%;transform:translateY(-50%)}
.sd-hand{flex:none}
.sd-meta{display:flex;flex-direction:column;justify-content:center;gap:3px;min-width:0;max-width:118px}
.sd-title{font-size:13px;font-weight:700;color:#e8f3ee;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:118px;margin:0}
.sd.bk .sd-title{color:var(--gold)}
.sd-pers{display:flex;flex-direction:column;gap:1px;margin:1px 0}
.sd-per{display:flex;justify-content:space-between;align-items:baseline;gap:6px;font-size:11px;line-height:1.2;font-weight:800}
.sd-per-lab{color:#a8b8b0;font-weight:600;font-size:10px}
.sd-per-v{min-width:28px;text-align:right}
.sd-per.pos .sd-per-v,.sd-per.pos{color:#7ff0a8}
.sd-per.neg .sd-per-v,.sd-per.neg{color:#ff8b7b}
.sd-per.na .sd-per-v{color:#6a7a72;font-weight:600}
.sd-rows{display:flex;flex-direction:column}
.sd-row{position:relative;width:calc(var(--cw)*2.8)}
.sd-row+.sd-row{margin-top:calc(var(--cw)*-0.78)} /* 牌高 1.4cw，加重叠以免挡中央结算 */
.sd-row .minis>.pc+.pc{margin-left:calc(var(--cw)*-.55)}
.sd-row .pc{box-shadow:0 -2px 4px #0006}
.sd-tags{display:flex;flex-direction:column;flex-wrap:wrap;gap:3px;margin:0;max-width:118px}
.sd-tag{font-size:10px;border-radius:5px;padding:1px 5px;font-weight:800;white-space:nowrap;align-self:flex-start}
.sd-tag.hot{background:#c4542a;color:#fff}.sd-tag.cold{background:#5a2a2a;color:#ffcfc4}.sd-tag.gold{background:var(--gold);color:#2b2100}
.sd .pc.mini{--cw:inherit}
@media (max-height:500px), (orientation:portrait) and (max-width:760px){
  .sd{--cw:45px;padding:3px 5px;gap:5px}
  .sd.p2{top:14px}
  .sd.p0{bottom:2px}
  .sd.p1,.sd.p3{transform:translateY(-55%)}
  .sd-meta{max-width:78px;gap:2px}
  .sd-title{font-size:10px;max-width:78px}
  .sd-per{font-size:9px}
  .sd-per-lab{font-size:8px}
  .sd-per-v{min-width:22px}
  .sd-tags{max-width:78px;gap:2px}
  .sd-tag{font-size:9px;padding:0 4px}
}
.stage.settled .center{z-index:6;top:52%;max-width:min(320px,60%)}
.settle-sum{background:#0b1f18f2;border:1px solid #f2c94c66;border-radius:10px;padding:6px 10px;margin-bottom:6px;min-width:220px;width:100%;box-shadow:0 8px 24px #000a;pointer-events:auto}
.settle-sum .ss-title{font-size:12px;font-weight:800;color:var(--gold);margin-bottom:4px;text-align:center}
.settle-sum .ss-row{display:grid;grid-template-columns:1fr auto auto;gap:8px;align-items:center;padding:2px 0;font-size:12px;line-height:1.25;border-top:1px solid #ffffff12}
.settle-sum .ss-row:first-of-type{border-top:0}
.settle-sum .ss-name{font-weight:700;color:#e8f3ee;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.settle-sum .ss-name .bk{color:var(--gold);font-size:10px;margin-left:4px}
.settle-sum .ss-delta{font-weight:900;min-width:44px;text-align:right}
.settle-sum .ss-rest{color:#cfd8d3;font-size:11px;min-width:72px;text-align:right}
.settle-sum .ss-rest b{color:#e8f3ee;font-weight:800}
.settle-sum .pos{color:#7ff0a8}.settle-sum .neg{color:#ff8b7b}
@media (max-height:500px){
  .settle-sum{padding:2px 6px;margin-bottom:3px}
  .settle-sum .ss-title{font-size:9px;margin-bottom:1px}
  .settle-sum .ss-row{font-size:10px;gap:5px;padding:0}
  .settle-sum .ss-delta{min-width:36px}
  .settle-sum .ss-rest{font-size:9px;min-width:58px}
  .actions{margin:3px 0}
  .actions button{font-size:13px;padding:6px 14px}
}

.session-sum{border-color:#ff8b7b88;max-width:420px}
.session-sum .ss-title{color:#ffb4a8}
.session-sum .ss-busted{color:#ff8b7b;font-size:10px;font-weight:800;margin-left:4px}
.session-sum .ss-grid{display:grid;grid-template-columns:1fr auto auto auto;gap:6px;font-size:11px}
.session-sum .ss-head{opacity:.7;font-size:10px;border-top:0!important}

label.check{display:flex;align-items:center;gap:8px;margin:8px 0;color:#cfe3d9;font-size:13px}
label.check input{width:16px;height:16px}
#btnVoice.on{border-color:#7ff0a8;color:#7ff0a8}