/* 糖玩大亨 — mint/pink candy UI, mobile-first 390x844 */
[hidden]{display:none!important}
:root{--pink:#ff5fa2;--pink2:#ff8cc0;--yel:#ffd23f;--mint:#4fd8b8;--mint2:#22a888;--pur:#8a5cf6;--ink:#4a2142;--cream:#fff7fb;
  --sat:env(safe-area-inset-top);--sab:env(safe-area-inset-bottom);--tip-acc:#ff5fa2;--tip-bg:#fff4f9}
*{box-sizing:border-box}
html,body{margin:0;height:100%;overflow:hidden;touch-action:manipulation;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;
  overscroll-behavior:none;background:#ffe3f0;color:var(--ink);font-family:"PingFang SC","Hiragino Sans GB","Noto Sans CJK SC","Noto Sans SC","Microsoft YaHei",system-ui,sans-serif}
button,input{font:inherit;color:inherit}
.screen{position:fixed;inset:0;display:none;z-index:5}.screen.on{display:block}
.burst{background:radial-gradient(circle at 50% 38%,rgba(255,255,255,.85) 0,rgba(255,255,255,0) 55%),repeating-conic-gradient(from 0deg at 50% 38%,#ffd0e6 0deg 9deg,#c9f6e6 9deg 18deg)}
.big{display:block;width:100%;padding:14px 12px;border:0;border-radius:20px;background:linear-gradient(#ff7cb4,#ff4f97);color:#fff;font-size:19px;font-weight:900;letter-spacing:.5px;
  box-shadow:0 5px 0 #d23377,0 10px 22px rgba(255,79,151,.3);text-shadow:0 2px 0 rgba(160,20,80,.35);cursor:pointer;transition:transform .08s;margin-top:10px}
.big:active{transform:translateY(3px);box-shadow:0 2px 0 #d23377}.big:disabled{background:#e9cfdc;box-shadow:0 4px 0 #cfb0c0}
.big.alt{background:linear-gradient(#6fe6c8,#2fc39e);box-shadow:0 5px 0 #1f9478,0 10px 22px rgba(47,195,158,.3);text-shadow:0 2px 0 rgba(20,110,90,.35)}
.big.yel{background:linear-gradient(#ffe27a,#ffc21f);color:#6a3d00;box-shadow:0 5px 0 #d19a00;text-shadow:none}
.big.ghostb{background:#fff;color:#a0798f;box-shadow:0 4px 0 #ecd3e0;text-shadow:none}
.chip{flex:0 0 auto;padding:8px 12px;border-radius:999px;border:2px solid #ffc0dc;background:#fff;font-size:14px;font-weight:800;cursor:pointer;white-space:nowrap}
.chip.on{background:var(--pink);border-color:var(--pink);color:#fff}
.ib{width:42px;height:42px;border-radius:14px;border:0;background:rgba(255,255,255,.9);font-size:22px;font-weight:900;line-height:1;cursor:pointer;box-shadow:0 2px 8px rgba(120,40,90,.15)}
.ib.sm{width:36px;height:36px;font-size:18px;border-radius:12px}
.hint{margin:8px 2px 0;font-size:12.5px;color:#9a6a87;text-align:center}
.row{display:flex;align-items:center;gap:8px;margin:6px 0}.row>span{min-width:36px;font-weight:800;font-size:14px}
.row input,.joinrow input{flex:1;min-width:0;padding:11px 14px;border-radius:14px;border:2px solid #ffc6df;background:#fff;font-size:16px;font-weight:700;outline:none}
.toast{position:fixed;left:50%;top:calc(130px + var(--sat));transform:translate(-50%,-10px);opacity:0;z-index:95;padding:9px 16px;border-radius:999px;background:rgba(74,33,66,.92);color:#fff;font-size:14px;font-weight:800;pointer-events:none;transition:.25s;width:max-content;max-width:92vw;text-align:center}
.toast.on{opacity:1;transform:translate(-50%,0)}
/* home */
.logo{position:absolute;top:calc(34px + var(--sat));left:0;right:0;text-align:center}
.logo .tp{display:inline-block;padding:4px 12px;border-radius:999px;background:#fff;color:var(--pink);font-weight:900;font-size:14px;box-shadow:0 3px 0 #ffc0dc}
.logo h1{margin:8px 0 0;font-size:58px;font-weight:900;letter-spacing:4px;color:#fff;-webkit-text-stroke:3px #ff4f97;paint-order:stroke fill;text-shadow:0 5px 0 #c42c72,0 10px 24px rgba(196,44,114,.35);transform:rotate(-3deg);animation:bob 2.6s ease-in-out infinite}
.logo p{margin:8px 0 0;font-weight:800;color:#8a3a6a;font-size:14px}
@keyframes bob{50%{transform:rotate(-3deg) translateY(-6px)}}
.card{position:absolute;left:16px;right:16px;bottom:calc(46px + var(--sab));padding:16px;border-radius:26px;background:rgba(255,255,255,.94);box-shadow:0 12px 40px rgba(150,40,100,.18);border:3px solid #fff}
.avs{display:grid;grid-template-columns:repeat(6,1fr);gap:6px;margin:8px 0 4px}
.avs button{border:3px solid transparent;background:#fff4fa;border-radius:16px;padding:2px 0 0;cursor:pointer;display:flex;flex-direction:column;align-items:center}
.avs button.on{border-color:var(--pink);background:#ffe2ef}.avs button small{font-size:10px;font-weight:800;color:#a0798f}
.avs svg{width:100%;height:auto;max-width:54px}
.joinrow{display:flex;gap:8px;margin-top:12px}
.joinbox{margin:8px 0 0;padding:8px 12px;border-radius:14px;background:#e3fff6;border:2px dashed var(--mint);font-weight:800;text-align:center}
.lang{position:absolute;top:-16px;right:14px;padding:5px 10px;border-radius:999px;border:2px solid #ffc0dc;background:#fff;font-weight:900;font-size:12px}
.foot{position:absolute;bottom:calc(14px + var(--sab));left:0;right:0;text-align:center;font-size:11.5px;color:#9a6a87;margin:0}
/* lobby */
.topbar{position:absolute;top:calc(12px + var(--sat));left:12px;right:12px;display:flex;align-items:center;gap:10px}
.codepill{flex:1;display:flex;align-items:baseline;gap:8px;padding:8px 14px;border-radius:16px;background:#fff;box-shadow:0 3px 0 #ffc0dc}
.codepill small{font-size:12px;color:#a0798f;font-weight:800}.codepill b{font-size:24px;letter-spacing:4px;color:var(--pink)}
.qrbox{position:absolute;top:calc(64px + var(--sat));left:50%;transform:translateX(-50%);padding:10px;background:#fff;border-radius:18px;z-index:3;box-shadow:0 8px 30px rgba(0,0,0,.2);text-align:center;font-size:12px;font-weight:800}
.qrbox canvas,.qrbox img{display:block;width:180px;height:180px}
.lobbycard{top:calc(70px + var(--sat));bottom:calc(16px + var(--sab));overflow:auto}
.seats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.seat{position:relative;border-radius:18px;background:#fff4fa;border:2px solid #ffd0e6;padding:4px 2px 6px;text-align:center;min-height:92px}
.seat svg{width:58px;height:58px}.seat b{display:block;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding:0 4px}
.seat small{display:block;font-size:10.5px;color:#a0798f;font-weight:800}.seat.bot{opacity:.75;border-style:dashed}.seat.me{border-color:var(--pink);background:#ffe2ef}
.seat.empty{display:flex;align-items:center;justify-content:center;color:#d3a8c0;font-weight:900;font-size:13px;border-style:dashed}
.seat .hosttag{position:absolute;top:4px;left:6px;font-size:14px}
.cfg{margin:10px 0 2px;display:flex;flex-direction:column;gap:6px}.cfg .crow{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.cfg .crow>span{font-weight:900;font-size:13px;min-width:56px}
.cfg .chip{padding:6px 11px;font-size:13px}
.consent{display:flex;gap:6px;align-items:flex-start;margin:10px 2px 0;font-size:12px;color:#8a5a7a;font-weight:700}
/* game */
#game{background:#fff0f7}
#mapwrap{position:absolute;inset:0;overflow:hidden;touch-action:none}
#mapwrap svg#map{position:absolute;left:0;top:0;transform-origin:0 0;will-change:transform}
.tname{font-size:12px;font-weight:900;fill:#5a2a4a}.tprice{font-size:11px;font-weight:900;fill:#c42c72}
.t-lot .tname{font-size:11px}
.hud{position:absolute;left:0;right:0;top:0;padding:calc(6px + var(--sat)) 8px 0;pointer-events:none;z-index:6}
.hudtop{display:flex;align-items:center;gap:6px;pointer-events:auto}
.rpill,.clock{padding:6px 10px;border-radius:12px;background:rgba(255,255,255,.92);font-weight:900;font-size:14px;box-shadow:0 2px 8px rgba(120,40,90,.15)}
.rpill{color:var(--pink)}.clock{margin-right:auto;font-variant-numeric:tabular-nums}.clock.low{background:#ff5f5f;color:#fff}
.strip{display:flex;gap:5px;margin-top:6px;pointer-events:auto}
.pc{position:relative;flex:1;min-width:0;display:flex;flex-direction:column;align-items:center;padding:2px 2px 4px;border-radius:14px;background:rgba(255,255,255,.92);border:2.5px solid transparent;box-shadow:0 2px 8px rgba(120,40,90,.12);transition:transform .2s}
.pc.cur{border-color:var(--yel);transform:translateY(2px) scale(1.04);background:#fffbe6}.pc.me .nm{color:var(--pink)}
.pc .av{position:relative;width:34px;height:34px}.pc .av svg{width:34px;height:34px}
.pc .nm{font-size:10.5px;font-weight:900;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pc .cs{font-size:11px;font-weight:900;color:#1f9478;font-variant-numeric:tabular-nums}.pc.ghost .cs{color:#9a6a87}.pc.ghost{background:rgba(240,235,255,.95)}
.pc .ring{position:absolute;left:0;right:0;bottom:0;height:3px;border-radius:2px;background:var(--pink);transform-origin:left}
.pc .badge{position:absolute;top:-4px;right:-2px;font-size:12px}
.pc .off{position:absolute;top:-4px;left:-2px;font-size:11px}
.spectbar{position:absolute;left:12px;right:12px;bottom:calc(150px + var(--sab));padding:8px;border-radius:14px;background:rgba(74,33,66,.85);color:#fff;text-align:center;font-weight:900;font-size:14px;z-index:7}
.panel{position:absolute;left:0;right:0;bottom:0;padding:10px 12px calc(12px + var(--sab));z-index:7;background:linear-gradient(rgba(255,240,247,0),rgba(255,240,247,.96) 26%);pointer-events:none}
.panel>*{pointer-events:auto}
.wait{margin:0 auto;max-width:360px;padding:10px 14px;border-radius:18px;background:rgba(255,255,255,.95);text-align:center;font-weight:900;box-shadow:0 4px 14px rgba(120,40,90,.15);display:flex;align-items:center;justify-content:center;gap:8px}
.wait svg{width:30px;height:30px}.wait .sec{color:var(--pink);font-variant-numeric:tabular-nums}
.rollrow{display:flex;gap:8px;align-items:stretch}
.rollb{flex:1;margin:0;font-size:22px;padding:16px 8px}.rollb small{display:block;font-size:12px;opacity:.9;font-weight:800}
.tool{flex:0 0 74px;border:0;border-radius:18px;background:#fff;box-shadow:0 4px 0 #ecd3e0;font-weight:900;font-size:13px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;cursor:pointer}
.tool b{font-size:24px}.tool:disabled{opacity:.45}
.cards{display:flex;gap:6px;margin-bottom:8px;overflow-x:auto;scrollbar-width:none}
.pcard{flex:0 0 auto;padding:7px 10px;border-radius:12px;border:2px solid #ffb3d1;background:#fff;font-weight:900;font-size:13px;cursor:pointer;box-shadow:0 3px 0 #ffc0dc}
.pcard.used{opacity:.4}
.forkrow{display:flex;gap:8px}.forkrow .big{margin:0;font-size:16px}
/* overlays */
.dicebox{position:fixed;left:50%;top:40%;transform:translate(-50%,-50%);z-index:40;display:flex;gap:16px;pointer-events:none}
.die{width:64px;height:64px;border-radius:16px;background:#fff;box-shadow:0 6px 0 #e8b8cf,0 10px 24px rgba(0,0,0,.2);display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);padding:8px;border:3px solid #ffc0dc}
.die i{width:12px;height:12px;border-radius:50%;background:var(--pink);place-self:center;visibility:hidden}.die i.v{visibility:visible}
.die.spin{animation:dspin .25s linear infinite}@keyframes dspin{0%{transform:rotate(0) scale(1)}50%{transform:rotate(180deg) scale(.86)}100%{transform:rotate(360deg) scale(1)}}
.die.land{animation:dland .35s cubic-bezier(.3,1.6,.5,1)}@keyframes dland{0%{transform:scale(1.5)}100%{transform:scale(1)}}
.dsum{position:absolute;left:50%;top:78px;transform:translateX(-50%);font-size:28px;font-weight:900;color:#fff;-webkit-text-stroke:2px var(--pink);paint-order:stroke fill;white-space:nowrap}
.banner{position:fixed;left:50%;top:36%;transform:translate(-50%,-50%) scale(.6);opacity:0;z-index:45;pointer-events:none;padding:12px 20px;border-radius:22px;background:#fff;border:4px solid var(--pink);font-weight:900;font-size:20px;text-align:center;
  box-shadow:0 10px 30px rgba(150,40,100,.25);transition:transform .25s cubic-bezier(.3,1.6,.5,1),opacity .2s;max-width:88vw}
.banner.on{opacity:1;transform:translate(-50%,-50%) scale(1)}.banner small{display:block;font-size:13.5px;color:#8a5a7a;margin-top:4px;font-weight:800}
.banner.gold{border-color:#ffc21f;background:#fffbe6}.banner.mint{border-color:var(--mint)}.banner.dark{background:#2b2a63;color:#fff;border-color:#a77bf3}.banner.dark small{color:#d8d0ff}
.roast{position:fixed;left:12px;right:12px;bottom:calc(150px + var(--sab));z-index:44;padding:12px 14px;border-radius:20px;background:#fff;border:3px solid var(--pink);box-shadow:0 10px 30px rgba(150,40,100,.25);animation:pop .3s cubic-bezier(.3,1.6,.5,1)}
.roast .rt{display:flex;align-items:center;gap:6px;font-weight:900;font-size:15px}.roast .rt svg{width:36px;height:36px;flex:0 0 auto}.roast .amt{margin-left:auto;color:#e8173f;font-size:22px}
.roast .rl{margin-top:6px;font-size:16px;font-weight:800;line-height:1.4;color:#4a2142}.roast .tags{margin-top:4px;font-size:12px;color:#c42c72;font-weight:900}
@keyframes pop{0%{transform:scale(.7);opacity:0}100%{transform:scale(1);opacity:1}}
.sheet{position:fixed;left:0;right:0;bottom:0;z-index:50;max-height:78vh;overflow:auto;padding:14px 14px calc(16px + var(--sab));border-radius:26px 26px 0 0;background:#fff;box-shadow:0 -10px 30px rgba(150,40,100,.25);animation:up .28s cubic-bezier(.2,.9,.3,1)}
@keyframes up{0%{transform:translateY(100%)}100%{transform:none}}
.sheet h3{margin:0 0 2px;font-size:20px;display:flex;align-items:center;gap:8px}.sheet h3 .lv{font-size:13px;padding:2px 8px;border-radius:999px;background:var(--pink);color:#fff}
.sheet .sub{margin:0 0 10px;font-size:13px;color:#8a5a7a;font-weight:700}
.sheet .opts{display:flex;flex-direction:column;gap:9px}
.opt{display:flex;align-items:center;gap:10px;width:100%;padding:12px 12px;border-radius:18px;border:3px solid #ffd0e6;background:#fff8fb;cursor:pointer;text-align:left}
.opt .oi{font-size:30px;flex:0 0 40px;text-align:center}.opt .ot{flex:1;min-width:0}.opt .ot b{display:block;font-size:17px}.opt .ot small{display:block;font-size:12.5px;color:#8a5a7a;font-weight:700}
.opt .oc{font-weight:900;font-size:17px;color:#e8173f;white-space:nowrap}.opt .oc.plus{color:#1f9478}
.opt.up{border-color:var(--mint);background:#ecfff8}.opt.coll{border-color:#ffd23f;background:#fffbe6}.opt:disabled{opacity:.45}
.lines{display:flex;gap:6px;margin:6px 0 2px}.lines button{flex:1;padding:7px 4px;border-radius:14px;border:2.5px solid #ffd0e6;background:#fff;font-weight:900;font-size:12.5px;cursor:pointer}
.lines button.on{border-color:var(--pink);background:#ffe2ef}.lines button small{display:block;font-size:10.5px;color:#8a5a7a}
.sheet .cancel{display:block;margin:10px auto 0;border:0;background:none;color:#a0798f;font-weight:800;text-decoration:underline;cursor:pointer;font-size:14px}
.sheet .timer{height:5px;border-radius:3px;background:#ffe2ef;margin:0 0 10px;overflow:hidden}.sheet .timer i{display:block;height:100%;background:var(--pink);transform-origin:left}
.tgts{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.tgt{border:3px solid #ffd0e6;background:#fff8fb;border-radius:16px;padding:4px;cursor:pointer;font-weight:900;font-size:12.5px}.tgt svg{width:46px;height:46px;display:block;margin:0 auto}
/* mini-game */
.mini{position:fixed;inset:0;z-index:60;background:radial-gradient(circle at 50% 40%,rgba(255,255,255,.6),rgba(255,255,255,0) 60%),repeating-conic-gradient(from 0deg at 50% 40%,#fff3a8 0deg 10deg,#ffd0e6 10deg 20deg);display:flex;flex-direction:column;align-items:center;padding:calc(20px + var(--sat)) 16px calc(20px + var(--sab));text-align:center}
.mini h2{margin:6px 0 0;font-size:34px;font-weight:900;color:#fff;-webkit-text-stroke:2.5px var(--pink);paint-order:stroke fill;text-shadow:0 4px 0 #c42c72}
.mini .mt{font-weight:900;font-size:15px;color:#8a3a6a;margin-top:4px}.mini .prize{margin-top:6px;padding:4px 12px;border-radius:999px;background:#fff;font-weight:900;color:#1f9478}
.mini .stage{flex:1;width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px}
.mini .cd{font-size:80px;font-weight:900;color:#fff;-webkit-text-stroke:3px var(--pink);paint-order:stroke fill}
.tapb{width:220px;height:220px;border-radius:50%;border:0;background:radial-gradient(circle at 35% 30%,#ffb3d1,#ff4f97 70%);color:#fff;font-size:34px;font-weight:900;box-shadow:0 10px 0 #c42c72,0 18px 40px rgba(196,44,114,.4);cursor:pointer;touch-action:manipulation}
.tapb:active{transform:translateY(6px);box-shadow:0 4px 0 #c42c72}.tapb small{display:block;font-size:44px}
.reactb{width:88vw;height:46vh;border-radius:30px;border:0;background:#ff5f5f;color:#fff;font-size:34px;font-weight:900;box-shadow:0 8px 0 #c43a3a}.reactb.go{background:#38d39f;box-shadow:0 8px 0 #1f9478}
.diceg{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.diceg button{width:88px;height:88px;border-radius:22px;border:4px solid #ffc0dc;background:#fff;font-size:40px;font-weight:900;cursor:pointer;box-shadow:0 5px 0 #ffc0dc}.diceg button.on{background:var(--pink);color:#fff;border-color:var(--pink)}
.watch{font-size:64px;font-weight:900;font-variant-numeric:tabular-nums;color:#4a2142;background:#fff;border-radius:24px;padding:8px 20px;box-shadow:0 6px 0 #ffc0dc;min-width:220px}
.stopb{width:200px;height:200px;border-radius:50%;border:0;background:radial-gradient(circle at 35% 30%,#a8f3df,#22a888 70%);color:#fff;font-size:36px;font-weight:900;box-shadow:0 10px 0 #157a62}
.mres{width:100%;max-width:360px;display:flex;flex-direction:column;gap:6px}
.mres .mr{display:flex;align-items:center;gap:8px;padding:6px 10px;border-radius:14px;background:#fff;font-weight:900}.mres .mr svg{width:34px;height:34px}.mres .mr.win{background:#fffbe6;border:3px solid #ffc21f}.mres .mr .v{margin-left:auto}
/* bankruptcy */
.broke{position:fixed;inset:0;z-index:70;background:radial-gradient(circle at 50% 45%,rgba(255,250,220,.95) 0,rgba(255,250,220,.6) 22%,rgba(40,20,50,.92) 46%);overflow:hidden;text-align:center;color:#fff}
.broke .bt{position:absolute;top:calc(60px + var(--sat));left:0;right:0;font-size:40px;font-weight:900;-webkit-text-stroke:2px #e8173f;paint-order:stroke fill;color:#fff;animation:shake .4s infinite}
.broke .bs{position:absolute;top:calc(118px + var(--sat));left:20px;right:20px;font-size:17px;font-weight:800;color:#ffe9f2}
.broke .who{position:absolute;left:50%;top:44%;width:210px;height:210px;margin:-105px 0 0 -105px;animation:shiver .12s infinite}
.broke .who svg{width:210px;height:210px}
.broke .carry{position:absolute;left:0;right:0;top:44%;height:240px;margin-top:-120px}
.broke .carry.go{animation:carry 2.2s ease-in 2.4s forwards}
@keyframes carry{0%{transform:translateX(0)}15%{transform:translateX(-10px) translateY(-14px)}100%{transform:translateX(120vw) translateY(-40px)}}
.broke .guard{position:absolute;top:150px;width:70px;height:90px;opacity:0;animation:gin .5s 1.9s forwards}.broke .guard.l{left:calc(50% - 130px)}.broke .guard.r{left:calc(50% + 60px)}
@keyframes gin{0%{opacity:0;transform:translateY(60px)}100%{opacity:1;transform:none}}
.broke .bill{position:absolute;font-size:30px;animation:fly 1.6s ease-out forwards}@keyframes fly{0%{transform:translate(0,0) rotate(0);opacity:1}100%{transform:translate(var(--dx),var(--dy)) rotate(var(--r));opacity:0}}
.broke .ghostline{position:absolute;bottom:calc(120px + var(--sab));left:20px;right:20px;font-size:20px;font-weight:900;opacity:0;animation:fadein .5s 3.6s forwards;color:#e3d8ff}
@keyframes fadein{to{opacity:1}}@keyframes shake{0%,100%{transform:rotate(-2deg)}50%{transform:rotate(2deg)}}@keyframes shiver{0%{transform:translateX(-2px)}50%{transform:translateX(2px)}}
/* mugshot */
.mug{position:fixed;inset:0;z-index:70;background:rgba(30,20,40,.75);display:flex;align-items:center;justify-content:center}
.mugc{width:300px;border-radius:18px;background:#fff;padding:12px;box-shadow:0 20px 50px rgba(0,0,0,.4);transform:rotate(-3deg);animation:pop .35s cubic-bezier(.3,1.6,.5,1)}
.mugph{position:relative;height:230px;border-radius:10px;background:repeating-linear-gradient(#e9eef5 0 22px,#cdd6e2 22px 24px);overflow:hidden}
.mugph .hl{position:absolute;right:6px;font-size:10px;font-weight:900;color:#6a7a90}
.mugph .face{position:absolute;left:50%;top:22px;width:170px;height:170px;margin-left:-85px}.mugph .face svg{width:170px;height:170px}
.mugph .plate{position:absolute;left:50%;bottom:10px;transform:translateX(-50%);background:#222;color:#fff;font-weight:900;padding:6px 12px;border-radius:6px;font-size:13px;white-space:nowrap;border:2px solid #fff}
.mugc .flash{position:absolute;inset:0;background:#fff;animation:flash .5s forwards;pointer-events:none}@keyframes flash{to{opacity:0}}
.mugc p{margin:8px 2px 0;font-weight:900;font-size:15px;text-align:center}.mugc small{display:block;text-align:center;color:#8a5a7a;font-weight:700;font-size:12px;margin-top:2px}
/* results */
.results{position:fixed;inset:0;z-index:80;overflow:auto;padding:calc(14px + var(--sat)) 14px calc(20px + var(--sab))}
.results h2{margin:4px 0 8px;text-align:center;font-size:30px;font-weight:900;color:#fff;-webkit-text-stroke:2.5px var(--pink);paint-order:stroke fill;text-shadow:0 4px 0 #c42c72}
.rcard{display:block;margin:0 auto;width:62%;max-width:250px;border-radius:16px;box-shadow:0 10px 30px rgba(150,40,100,.3);background:#fff}
.rank{margin:12px 0 0;display:flex;flex-direction:column;gap:6px}
.rk{display:flex;align-items:center;gap:8px;padding:6px 10px;border-radius:16px;background:rgba(255,255,255,.95);font-weight:900}.rk svg{width:36px;height:36px}.rk .n{font-size:18px;width:22px;text-align:center}.rk .w{margin-left:auto;color:#1f9478}
.rk .tt{font-size:11px;color:#c42c72;display:block}
.rbtns{display:flex;gap:8px}.rbtns .big{font-size:16px}
.again{font-size:22px!important;padding:16px!important}
.menu{position:fixed;top:calc(52px + var(--sat));right:8px;z-index:85;background:#fff;border-radius:18px;padding:8px;box-shadow:0 10px 30px rgba(150,40,100,.25);display:flex;flex-direction:column;gap:4px;min-width:180px}
.menu button{border:0;background:#fff4fa;border-radius:12px;padding:10px;font-weight:900;text-align:left;cursor:pointer}
.vcfix{position:fixed;right:8px;bottom:calc(150px + var(--sab));z-index:30;display:none!important;flex-direction:column;gap:6px}
body.ingame .vcfix{display:flex!important}
.float{font-weight:900;font-size:26px;paint-order:stroke fill;stroke:#fff;stroke-width:6px}
.tok .arrow{animation:arr .6s ease-in-out infinite alternate}@keyframes arr{to{transform:translateY(-8px)}}
.pulse{animation:pls 1s ease-in-out infinite}@keyframes pls{50%{transform:scale(1.06)}}
.clipb{margin-top:8px}
/* tip strip on the light candy results screen (tip.css defaults are tuned for dark games) */
#results .tipstrip{background:rgba(255,255,255,.85);border:1.5px dashed #ffb3d1;color:#8a5a7a;font-weight:700}
#results .tipstrip .ts-b{--tip-acc:#ff5fa2;background:#fff}
/* mid-game takeover */
.invg{pointer-events:auto;padding:6px 10px;font-size:13px;border-color:#9fe8d4;background:#eafff8;color:#1f9478;box-shadow:0 2px 8px rgba(120,40,90,.15)}
.spectbar{display:flex;align-items:center;justify-content:center;gap:10px}.spectbar .chip{padding:6px 12px;font-size:14px;border-color:var(--yel);background:var(--yel);color:#6a3d00}
.spectbar.away{background:rgba(138,92,246,.92);bottom:calc(150px + var(--sab))}
.sheet.pick{z-index:60;animation:up .28s cubic-bezier(.2,.9,.3,1)}
.pick .pkauto{margin:-4px 0 8px;font-size:13px;font-weight:900;color:var(--pink);text-align:center}
.pks{display:grid;grid-template-columns:repeat(auto-fill,minmax(104px,1fr));gap:8px}
.pk{position:relative;display:flex;flex-direction:column;align-items:center;gap:1px;padding:8px 4px 8px;border-radius:18px;border:2.5px solid #ffd0e6;background:#fff7fb;cursor:pointer}
.pk svg{width:52px;height:52px}.pk b{font-size:14px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pk .pm{font-size:16px;font-weight:900;color:#1f9478;font-variant-numeric:tabular-nums}.pk small{font-size:11px;font-weight:800;color:#a0798f}
.pk.auto{border-color:var(--pink);background:#ffe2ef;box-shadow:0 0 0 3px rgba(255,95,162,.18)}.pk.on{border-color:var(--mint2);background:#eafff8}.pk:disabled{opacity:.55}
.pk .pktag{position:absolute;top:-8px;right:-4px;padding:2px 7px;border-radius:999px;background:var(--yel);color:#6a3d00;font-size:10.5px;font-style:normal;font-weight:900}.pk .pktag.gray{background:#e9dbe3;color:#7a5a6e}