/* DonutDepo — Case Opening + Case Battles styling (midnight-blue theme).
   All prices/probabilities/labels/reels/controls are rendered here in CSS/markup, never baked into art. */

/* ---- shared bits ---- */
.cs-coin{display:inline-block;flex:none;width:14px;height:14px;margin-left:5px;vertical-align:-2px;
  background:url(../assets/optimized/coin.52ca4e2d31dc.webp) center/contain no-repeat}
#v-cases,#v-casebattles{padding-bottom:40px}

/* ===================== CATALOG (solo) ===================== */
.cs-banner{position:relative;overflow:hidden;border-radius:16px;margin:4px 0 22px;border:1px solid var(--border);
  background:linear-gradient(120deg,#122548,#0c1c38 55%,#15173a);min-height:150px;display:flex}
.cs-banner-bg{position:absolute;inset:0;background:
  radial-gradient(520px 220px at 88% -20%,#3a66d955,transparent 70%),
  radial-gradient(420px 220px at 12% 130%,#7a4bd655,transparent 70%);pointer-events:none}
.cs-banner-bg:after{content:"";position:absolute;inset:0;background:linear-gradient(135deg,transparent 65%,#789fff12 65.2%,transparent 65.5%);opacity:.5;mix-blend-mode:screen}
.cs-banner-in{position:relative;padding:26px 30px;max-width:620px}
.cs-banner-in h1{margin:0 0 8px;font-size:40px;line-height:1;color:#fff;letter-spacing:.5px}
.cs-banner-in p{margin:0 0 16px;color:var(--muted);font-size:15px;max-width:520px;line-height:1.5}
.cs-banner-acts{display:flex;gap:10px;flex-wrap:wrap}

.cs-toolbar{display:flex;gap:14px;align-items:center;margin-bottom:18px;flex-wrap:wrap}
.cs-search{flex:1;min-width:200px;display:flex;align-items:center;gap:10px;padding:0 14px;height:44px;
  background:var(--surface);border:1px solid var(--border);border-radius:var(--r);color:var(--muted);transition:border-color .15s,box-shadow .15s}
.cs-search:focus-within{border-color:var(--accent);box-shadow:var(--ring)}
.cs-search .ic{width:18px;height:18px}
.cs-search input{flex:1;background:none;border:0;outline:none;color:var(--text);font-size:15px;min-height:24px}
.cs-sort{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:13.5px;font-weight:600}
.cs-sortseg{background:var(--inset);border:1px solid var(--border);border-radius:9px;padding:3px;gap:2px;width:auto}
.cs-sortseg button{height:34px;padding:0 13px;font-size:13px;border-radius:6px;white-space:nowrap}

.cs-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(212px,1fr));gap:16px}
.cs-card{position:relative;border:1px solid var(--border);border-radius:16px;overflow:hidden;cursor:pointer;
  background:radial-gradient(130% 80% at 50% 8%,#152a4e 0,#0c1930 55%,#0a1526 100%);
  display:flex;flex-direction:column;transition:transform .14s,border-color .15s,box-shadow .2s}
.cs-card:hover,.cs-card:focus-visible{transform:translateY(-4px);border-color:var(--accent);outline:none;
  box-shadow:0 20px 42px -20px #000,0 0 0 1px var(--accent),0 0 34px -14px var(--accent)}
.cs-card-battle{position:absolute;top:10px;right:10px;z-index:4;width:34px;height:34px;display:grid;place-items:center;
  border:1px solid var(--border);border-radius:9px;background:#0b1a33cc;color:var(--muted);cursor:pointer;opacity:0;transition:opacity .15s,color .15s,border-color .15s}
.cs-card:hover .cs-card-battle,.cs-card:focus-within .cs-card-battle{opacity:1}
.cs-card-battle:hover{color:#fff;border-color:var(--accent);background:var(--control)}
.cs-card-battle .ic{width:17px;height:17px}
.cs-card-art{position:relative;aspect-ratio:1/1;overflow:hidden}
.cs-cover{position:absolute;inset:0;display:block}
.cs-cover:before{content:"";position:absolute;left:calc(50% - 13px);top:calc(50% - 13px);width:26px;height:26px;border:2px solid #a9c4ef18;border-top-color:#a9c4ef88;border-radius:50%;animation:csArtLoad .9s linear infinite}
.cs-cover.is-ready:before,.cs-cover.is-error:before{display:none}
.cs-cover.is-error:after{content:"Artwork unavailable";position:absolute;inset:0;display:grid;place-items:center;color:var(--muted);font-size:12px}
.cs-cover-img{position:absolute;inset:6% 8%;width:84%;height:84%;object-fit:contain;z-index:1;filter:drop-shadow(0 14px 22px #0008);opacity:0}
.cs-cover.is-ready .cs-cover-img{opacity:1}
.cs-card:hover .cs-cover-img{transform:scale(1.05);transition:transform .25s}
@keyframes csArtLoad{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.cs-cover:before{animation:none}}
.cs-card-open{position:absolute;left:0;right:0;bottom:0;z-index:3;display:grid;place-items:center;padding:28px 0 14px;
  background:linear-gradient(transparent,#0a1526);opacity:0;transform:translateY(8px);transition:opacity .16s,transform .16s}
.cs-card:hover .cs-card-open,.cs-card:focus-within .cs-card-open{opacity:1;transform:none}
.cs-card-open span{display:inline-flex;align-items:center;gap:7px;font-weight:800;font-size:13.5px;color:#fff;
  background:var(--accent);padding:8px 16px;border-radius:9px;box-shadow:0 8px 20px -8px var(--accent)}
.cs-card-open .ic{width:16px;height:16px}
.cs-card-meta{position:relative;z-index:2;text-align:center;padding:4px 12px 16px;margin-top:-6px}
.cs-card-name{display:block;font-size:13px;font-weight:600;color:var(--muted);letter-spacing:.01em;margin-bottom:3px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cs-card-price{display:inline-flex;align-items:center;gap:2px;font-size:22px;font-weight:800;color:#fff;font-variant-numeric:tabular-nums}
.cs-card-sub{display:block;font-size:11px;color:var(--dim);margin-top:4px}
.cs-coin.lg{width:15px;height:15px;margin-left:6px;vertical-align:-2px}
/* tags still used on the detail dialog */
.cs-tags{display:flex;gap:6px;flex-wrap:wrap}
.cs-tag{font-size:11px;font-weight:700;color:var(--muted);background:var(--inset);border:1px solid var(--border);border-radius:20px;padding:2px 9px}

.cs-sub{margin-top:28px}
.cs-chip{font-size:13px;color:var(--muted)}
.cs-chip b{color:var(--text)}
.cs-chip .w{color:var(--win)}.cs-chip .l{color:var(--lose)}
.cs-log-tbl td,.cs-log-tbl th{padding:10px 14px}
.cs-log-items{display:flex;gap:4px;flex-wrap:wrap;align-items:center}
.cs-log-items img{width:24px;height:24px;object-fit:contain}
.cs-qty{font-style:normal;color:var(--dim);font-weight:700;font-size:12px}
.cs-log-tbl .w{color:var(--win)}.cs-log-tbl .l{color:var(--lose)}
.cs-recent-prizes{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px}
.cs-recent-prizes .cs-prize{min-height:148px;justify-content:center;padding:16px 10px 13px}
.cs-recent-prizes .cs-prize-v{font-size:13px;max-width:100%;white-space:nowrap}
@media(max-width:600px){.cs-recent-prizes{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.cs-recent-prizes .cs-prize-v{font-size:clamp(10px,3vw,13px)}}

/* ===================== DETAIL / OPENING MODAL ===================== */
.cs-modal{position:fixed;inset:0;z-index:120;display:flex;align-items:flex-start;justify-content:center;
  padding:30px 16px;overflow-y:auto;background:#040a18cc;backdrop-filter:blur(4px)}
.cs-modal[hidden]{display:none}
.cs-dlg{width:min(880px,100%);background:linear-gradient(180deg,#0f2041,#0b1930);border:1px solid var(--border);
  border-radius:16px;box-shadow:0 30px 80px -30px #000;overflow:hidden}
.cs-dlg-head{display:flex;align-items:center;gap:16px;padding:22px 24px;border-bottom:1px solid var(--border-soft);
  background:linear-gradient(120deg,var(--tint,#3a66d9)22,transparent 60%)}
.cs-dlg-art{flex:none;width:84px;height:70px;border-radius:11px;overflow:hidden;position:relative}
.cs-dlg-art .cs-cover{aspect-ratio:auto;width:100%;height:100%}
.cs-dlg-ttl{flex:1;min-width:0}
.cs-dlg-ttl h2{margin:0;font-size:36px;font-weight:800;line-height:1.02;letter-spacing:.2px;color:#fff}
.cs-dlg-ttl small{color:var(--muted);font-size:13px;display:block;margin-top:4px}
.cs-hook{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:800;color:var(--gold);background:#2a1f08;border:1px solid #5a461a;border-radius:20px;padding:3px 11px}
.cs-hook .ic{width:14px;height:14px}
.cs-dlg-ttl .cs-tags{margin-top:6px}
.cs-x{flex:none;width:36px;height:36px;display:grid;place-items:center;border:0;border-radius:8px;background:var(--inset);color:var(--muted);cursor:pointer}
.cs-x:hover{color:#fff;background:var(--control)}

.cs-reelwrap{position:relative;margin:20px 18px;border-radius:14px;background:radial-gradient(ellipse at 50% 110%,#224d733d,transparent 68%),#071322;border:1px solid #294361;overflow:hidden;min-height:240px}
.cs-reels{display:flex;flex-direction:column;gap:10px;padding:24px 0 38px;opacity:0;transition:opacity .32s}
.cs-reelwrap.rolling .cs-reels,.cs-reelwrap.done .cs-reels{opacity:1}
.cs-reel-ph{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none;z-index:5;background:radial-gradient(ellipse at center,#173a5955,transparent 70%)}
.cs-stage-case{position:relative;width:180px;height:180px;object-fit:contain;filter:drop-shadow(0 12px 14px #0009);z-index:2}
.cs-stage-halo{position:absolute;width:170px;height:38px;border:1px solid #67b8fa55;box-shadow:0 0 35px #4b9eeb22,inset 0 0 25px #4b9eeb22;border-radius:50%;top:calc(50% + 64px)}
.cs-reelwrap.opening .cs-stage-case{animation:cs-unseal var(--unseal-ms,760ms) cubic-bezier(.2,.7,.25,1) both}
.cs-reelwrap.opening .cs-stage-halo{animation:cs-halo var(--unseal-ms,760ms) ease-out both}
.cs-reelwrap.rolling .cs-reel-ph{background:none}
.cs-opening-status{position:absolute;bottom:12px;left:0;right:0;text-align:center;font-size:10px;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:#91b7d6;pointer-events:none}
@keyframes cs-unseal{0%{transform:translateY(0) scale(1);opacity:1}25%{transform:translateY(3px) scale(.95);filter:drop-shadow(0 0 10px #4fbdff55)}58%{transform:translateY(-13px) scale(1.06);opacity:1;filter:drop-shadow(0 0 20px #78ceff99)}100%{transform:translateY(-42px) scale(.8);opacity:0;filter:drop-shadow(0 0 30px #78ceff00)}}
@keyframes cs-halo{0%,25%{transform:scale(1);opacity:.5}65%{opacity:1}100%{transform:scale(3.8);opacity:0}}

.cs-reel{position:relative;height:174px;overflow:hidden;isolation:isolate}
.cs-reels[data-n="3"] .cs-reel,.cs-reels[data-n="4"] .cs-reel{height:148px}
.cs-reel::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,#071322 0%,#07132200 23%,#07132200 77%,#071322 100%);z-index:4}
.cs-reel-track{display:flex;height:100%;will-change:transform}
.cs-tile{flex:0 0 128px;width:128px;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;
  padding:16px 8px;border:5px solid #071322;border-radius:14px;background:linear-gradient(155deg,#172d43,#0c1d2f);position:relative;transition:opacity .35s,background .3s}
.cs-tile:before{content:"";position:absolute;left:22px;right:22px;bottom:10px;height:2px;border-radius:3px;background:var(--tint);opacity:.7}
.cs-tile-ic{width:62px;height:62px;display:grid;place-items:center;position:relative;z-index:1}
.cs-reels[data-n="3"] .cs-tile-ic,.cs-reels[data-n="4"] .cs-tile-ic{width:50px;height:50px}
.cs-tile-ic img{width:100%;height:100%;object-fit:contain;image-rendering:pixelated;filter:drop-shadow(0 5px 8px #0008)}
.cs-tile-nm{font-size:10.5px;font-weight:700;color:var(--muted);text-align:center;line-height:1.25;max-width:108px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cs-tile-v{font-size:13px;font-weight:800;color:var(--text);font-variant-numeric:tabular-nums}
.cs-tile.win{background:radial-gradient(ellipse at 50% 30%,color-mix(in srgb,var(--tint) 28%,#122238),#122238 80%)}
.cs-tile.win .cs-tile-nm,.cs-tile.win .cs-tile-v{color:#fff}
.cs-reel-marker{position:absolute;top:0;bottom:0;left:50%;width:0;z-index:6;pointer-events:none}
.cs-reel-marker:before,.cs-reel-marker:after{content:"";position:absolute;left:50%;transform:translateX(-50%);
  border:7px solid transparent;border-top-color:#bfeaff;filter:drop-shadow(0 0 4px #65c7ff88)}
.cs-reel-marker:before{top:0}
.cs-reel-marker:after{bottom:0;border-top-color:transparent;border-bottom-color:#bfeaff}
.cs-reel-focus{position:absolute;left:50%;top:4px;bottom:4px;width:120px;transform:translateX(-50%);border:1px solid #8bcfff44;border-radius:10px;pointer-events:none;z-index:3;transition:border-color .3s,box-shadow .3s}
.cs-reel.is-braking .cs-reel-focus{border-color:#8bcfff99;box-shadow:0 0 18px #65c7ff18}
.cs-reel.is-landed .cs-reel-focus{border-color:var(--land-tint);box-shadow:0 0 22px color-mix(in srgb,var(--land-tint) 22%,transparent)}
.cs-reel.is-landed .cs-tile:not(.win){opacity:.25}
.cs-reel.is-landed .cs-tile.win .cs-tile-ic{animation:cs-prize-land .65s cubic-bezier(.16,.8,.23,1) both}
.cs-reel.is-landed .cs-tile.win .cs-tile-v{animation:cs-value-in .4s .12s both}
.cs-reelwrap.done .cs-opening-status{color:#d1e7f8}
@keyframes cs-prize-land{0%{transform:translateY(0) scale(1)}42%{transform:translateY(-5px) scale(1.22)}100%{transform:translateY(-2px) scale(1.08)}}
@keyframes cs-value-in{from{transform:translateY(5px);opacity:0}to{transform:translateY(0);opacity:1}}

.cs-controls{padding:0 18px 16px;display:flex;flex-direction:column;gap:12px}
.cs-controls[hidden],.cs-summary[hidden]{display:none}
.cs-qtyrow{display:flex;align-items:center;gap:14px}
.cs-quickrow{margin:-2px 0 -4px}
.cs-quickrow .cb-toggle{padding:6px 2px;width:100%;justify-content:flex-start}
.cs-quick-note{font-style:normal;font-size:11.5px;color:var(--dim);margin-left:auto}
.cs-qty{flex:1;max-width:320px}
.cs-costrow{display:flex;align-items:center;justify-content:space-between;padding:10px 14px;background:var(--inset);border:1px solid var(--border);border-radius:10px}
.cs-costrow span{color:var(--muted);font-weight:600;font-size:13.5px}
.cs-costrow b{font-size:18px;color:var(--gold)}
.cs-btns{display:flex;gap:10px}
.cs-btns .btn.block{flex:1}
.cs-btns .cs-sec,.cs-btns #cs-preview{flex:0 0 auto;padding:0 16px;height:46px}
.cs-link{background:none;border:0;color:var(--accent);font-weight:700;font-size:13.5px;cursor:pointer;display:inline-flex;align-items:center;gap:6px;padding:4px;align-self:flex-start}
.cs-link:hover{color:var(--accent-hi)}
.cs-link .ic{width:16px;height:16px}

.cs-summary{padding:4px 18px 18px}
.cs-sum-items{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-bottom:14px}
.cs-sum-item{display:flex;flex-direction:column;align-items:center;gap:3px;width:104px;padding:10px 6px;border-radius:10px;
  background:var(--surface);border:1px solid var(--border);border-top:3px solid var(--tint)}
.cs-sum-item img{width:46px;height:46px;object-fit:contain}
.cs-sum-item b{font-size:11.5px;color:var(--muted);text-align:center;line-height:1.1}
.cs-sum-item span{font-size:13px;font-weight:800;color:var(--text)}
.cs-sum-acts{display:flex;gap:10px;justify-content:center}

.cs-prizes-wrap{padding:10px 18px 20px}
.cs-odds-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin:6px 0 8px;flex-wrap:wrap}
.cs-odds-head b{color:#fff;font-size:15px}
.cs-odds-head .cs-ev{color:var(--muted);font-size:12.5px}
.cs-rarity-key{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:12px;color:var(--muted);font-size:11.5px;font-weight:600}
.cs-rarity-key em{display:inline-block;width:9px;height:9px;border-radius:3px;margin-right:5px;vertical-align:0}
.cs-prizegrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:10px}
.cs-prize{position:relative;background:var(--surface);border:1px solid var(--border);border-radius:11px;padding:14px 10px 11px;
  display:flex;flex-direction:column;align-items:center;gap:5px;overflow:hidden;transition:transform .12s,box-shadow .15s,border-color .15s}
.cs-prize:hover{transform:translateY(-3px);border-color:var(--tint);box-shadow:0 12px 26px -16px #000,0 0 18px -10px var(--tint)}
.cs-prize-strip{position:absolute;top:0;left:0;right:0;height:4px;background:var(--tint)}
.cs-prize-pct{position:absolute;top:8px;right:9px;font-size:11px;font-weight:800;color:var(--tint);font-variant-numeric:tabular-nums}
.cs-prize-img{width:52px;height:52px;display:grid;place-items:center;margin-top:6px}
.cs-prize-img img{width:100%;height:100%;object-fit:contain;image-rendering:pixelated;filter:drop-shadow(0 4px 7px #0007)}
.cs-log-items img,.cs-sum-item img,.cb-tile img,.cb-it img{image-rendering:pixelated}
.cs-prize-nm{font-size:12px;font-weight:700;color:var(--muted);text-align:center;line-height:1.15;max-width:100%;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100%}
.cs-prize-v{display:inline-flex;align-items:center;font-size:14px;font-weight:800;color:#fff;font-variant-numeric:tabular-nums}
.cs-prize-v .cs-coin{width:12px;height:12px;margin-left:4px}
.cs-note{display:flex;gap:8px;color:var(--dim);font-size:12.5px;line-height:1.5;margin-top:14px}
.cs-note .ic{flex:none;width:16px;height:16px;color:var(--accent);margin-top:2px}

body.cs-noscroll{overflow:hidden}

@media (max-width:620px){
  .cs-banner-in h1{font-size:30px}
  .cs-grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px}
  .cs-card-ttl{font-size:14.5px}
  .cs-dlg-head{flex-wrap:wrap;padding:16px}
  .cs-dlg-ttl h2{font-size:26px}
  .cs-btns{flex-direction:column}
  .cs-btns .cs-sec,.cs-btns #cs-preview{width:100%}
  .cs-reel{height:164px}
  .cs-reelwrap{margin:14px 10px}
}
@media(prefers-reduced-motion:reduce){.cs-stage-case,.cs-stage-halo,.cs-tile-ic,.cs-tile-v{animation:none!important}.cs-reels{transition:none}}

/* ===================== CASE BATTLES ===================== */
.cb-crumb{display:flex;align-items:center;gap:10px;margin:4px 0 18px;color:var(--muted);font-weight:600;font-size:14px;flex-wrap:wrap}
.cb-crumb b{color:#fff}
.cb-back{display:inline-flex;align-items:center;gap:5px;background:none;border:0;color:var(--muted);font-weight:600;font-size:14px;cursor:pointer}
.cb-back:hover{color:#fff}
.cb-crumb span{color:var(--dim)}

/* avatars */
.cb-av{position:relative;flex:none;width:40px;height:40px;border-radius:10px;overflow:hidden;display:grid;place-items:center;
  background:var(--c,#39506f);box-shadow:inset 0 0 0 1px #ffffff18}
.cb-av.sm{width:30px;height:30px;border-radius:8px}
.cb-av.lg{width:56px;height:56px;border-radius:12px}
.cb-av-ltr{font-weight:800;color:#fff;font-size:16px}
.cb-av.lg .cb-av-ltr{font-size:22px}.cb-av.sm .cb-av-ltr{font-size:13px}
.cb-av img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.cb-av img.cb-bot-skin{inset:auto;left:-100%;top:-100%;width:800%;height:800%;max-width:none;object-fit:fill;image-rendering:pixelated}
.cb-av.cb-bot svg{width:100%;height:100%}
.cb-botbadge{display:inline-block;flex:none;font-style:normal;font-size:9.5px;font-weight:900;letter-spacing:.04em;background:var(--accent);color:#fff;border-radius:4px;padding:1px 5px;margin-left:6px}
.cb-you{font-style:normal;font-size:9.5px;font-weight:900;background:var(--accent);color:#fff;border-radius:4px;padding:1px 5px;margin-left:6px;letter-spacing:.04em}
.cb-local{font-style:normal;font-size:9.5px;font-weight:900;background:#8a5cf0;color:#fff;border-radius:4px;padding:1px 5px;margin-left:6px;letter-spacing:.04em}

/* lobby */
.cb-hero{position:relative;overflow:hidden;border-radius:16px;margin:4px 0 22px;border:1px solid var(--border);
  background:linear-gradient(120deg,#1a1640,#141a3e 55%,#0e1c3a);min-height:150px;display:flex}
.cb-hero-bg{position:absolute;inset:0;pointer-events:none;background:
  radial-gradient(520px 240px at 85% -20%,#7a4bd655,transparent 70%),radial-gradient(420px 220px at 10% 130%,#2b5fd655,transparent 70%)}
.cb-hero-in{position:relative;padding:26px 30px;max-width:640px}
.cb-hero-in h1{margin:0 0 8px;font-size:40px;line-height:1;color:#fff}
.cb-hero-in p{margin:0 0 16px;color:var(--muted);font-size:15px;line-height:1.5;max-width:560px}
.cb-hero-acts{display:flex;gap:10px;flex-wrap:wrap}
.cb-sub{margin-top:24px}
.cb-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px}
.cb-card{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:14px;display:flex;flex-direction:column;gap:11px}
.cb-card.running{border-color:#2f6ae6;box-shadow:0 0 0 1px #2f6ae655}
.cb-card-top{display:flex;align-items:center;gap:8px}
.cb-fmt{font-weight:800;color:#fff;font-size:14px;background:var(--control);border-radius:7px;padding:3px 10px}
.cb-rule-tag{font-size:10.5px;font-weight:900;letter-spacing:.05em;color:var(--cyan);background:#10253f;border:1px solid #1f4068;border-radius:20px;padding:3px 10px}
.cb-status{margin-left:auto;font-size:11px;font-weight:800;border-radius:20px;padding:3px 10px}
.cb-status.waiting{background:#3a2f12;color:var(--gold)}
.cb-status.open{background:#10351f;color:var(--win)}
.cb-card.fake{border-color:#294a7a}
.cb-host{display:flex;align-items:center;gap:8px;margin:-2px 0 2px;font-size:13px;color:var(--text)}
.cb-host-nm{font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cb-host em{font-style:normal;color:var(--dim);font-size:11.5px;margin-left:auto}
.cb-status.running{background:#10351f;color:var(--win)}
.cb-status.done{background:var(--inset);color:var(--muted)}
.cb-status.cancelled{background:#3a1420;color:var(--lose)}
.cb-card-mid{display:flex;align-items:center;gap:8px}
.cb-thumb{width:36px;height:36px;border-radius:8px;background:var(--inset);border:1px solid var(--border);display:grid;place-items:center}
.cb-thumb img{width:26px;height:26px;object-fit:contain}
.cb-thumb.more{font-size:12px;font-weight:800;color:var(--muted)}
.cb-rounds{margin-left:auto;color:var(--muted);font-size:13px;font-weight:600}
.cb-card-bot{display:flex;align-items:center;justify-content:space-between;gap:10px;border-top:1px solid var(--border-soft);padding-top:11px}
.cb-card-info{display:flex;flex-direction:column;gap:5px;font-size:12.5px;color:var(--muted)}
.cb-card-info b{color:var(--text)}
.cb-seatdots{display:flex;gap:4px}
.cb-dot{width:9px;height:9px;border-radius:50%;background:var(--control)}
.cb-empty{background:transparent}
.cb-dot.human{background:var(--accent)}.cb-dot.bot{background:#ff4d6a}.cb-dot.local{background:#8a5cf0}.cb-dot.empty{background:var(--control);opacity:.5}.cb-dot.host{background:var(--cyan)}
.cb-occ{color:var(--dim);font-size:12px}
.cb-card-bot .btn{height:38px;padding:0 16px;font-size:13.5px}
.cb-foot-note,.cb-note-sm{display:flex;gap:8px;color:var(--dim);font-size:12.5px;line-height:1.5;margin-top:16px}
.cb-note-sm{font-size:12px;margin-top:8px}
.cb-foot-note .ic,.cb-note-sm .ic{flex:none;width:16px;height:16px;color:var(--accent);margin-top:1px}

/* create */
.cb-create{display:grid;grid-template-columns:1fr 320px;gap:18px;align-items:start}
.cb-cr-sec{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:16px 18px;margin-bottom:16px}
.cb-cr-sec h3{margin:0 0 12px;font-size:15px;color:#fff;display:flex;align-items:baseline;gap:10px}
.cb-cr-sec h3 small{color:var(--dim);font-weight:500;font-size:12px}
.cb-casepick{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:10px;margin-bottom:14px}
.cb-casepick-c{display:flex;flex-direction:column;align-items:center;gap:6px;padding:10px 8px;background:var(--inset);border:1px solid var(--border);border-radius:10px;cursor:pointer;color:var(--text);transition:border-color .12s,transform .1s}
.cb-casepick-c:hover{border-color:var(--accent);transform:translateY(-2px)}
.cb-cp-art{position:relative;width:46px;height:46px;display:grid;place-items:center}
.cb-cp-art img{max-width:100%;max-height:100%;object-fit:contain}
.cb-cp-fallback{position:absolute;color:var(--accent)}.cb-cp-art img+.cb-cp-fallback{display:none}
.cb-casepick-c b{font-size:12.5px;font-weight:700;text-align:center;line-height:1.1}
.cb-cp-price{font-size:11.5px;color:var(--gold);font-weight:800}
.cb-picklist{display:flex;flex-direction:column;gap:6px}
.cb-pick{display:flex;align-items:center;gap:10px;background:var(--inset);border:1px solid var(--border);border-radius:9px;padding:8px 10px}
.cb-pick-n{width:22px;height:22px;display:grid;place-items:center;background:var(--control);border-radius:6px;font-size:12px;font-weight:800;color:var(--muted)}
.cb-pick b{flex:1;font-size:13.5px}
.cb-pick-price{color:var(--gold);font-weight:700;font-size:13px}
.cb-pick-acts{display:flex;gap:3px}
.cb-pick-acts button{width:28px;height:28px;display:grid;place-items:center;background:var(--control);border:0;border-radius:6px;color:var(--muted);cursor:pointer}
.cb-pick-acts button:hover:not(:disabled){color:#fff;background:var(--control-hi)}
.cb-pick-acts button:disabled{opacity:.35;cursor:default}
.cb-pick-empty{color:var(--dim);font-size:13px;padding:14px;text-align:center;border:1px dashed var(--border);border-radius:9px}
.cb-fmtgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:10px}
.cb-fmt-opt{display:flex;flex-direction:column;gap:2px;padding:12px;background:var(--inset);border:1px solid var(--border);border-radius:10px;cursor:pointer;color:var(--text);text-align:left}
.cb-fmt-opt:hover{border-color:var(--accent)}
.cb-fmt-opt.on{border-color:var(--accent);background:var(--control);box-shadow:inset 0 0 0 1px var(--accent)}
.cb-fmt-opt b{font-size:15px}.cb-fmt-opt small{color:var(--muted);font-size:12px}.cb-fmt-opt em{color:var(--dim);font-size:11px;font-style:normal;margin-top:3px}
.cb-rulegrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:10px}
.cb-rule-opt{display:flex;flex-direction:column;gap:5px;padding:12px;background:var(--inset);border:1px solid var(--border);border-radius:10px;cursor:pointer;color:var(--text);text-align:left}
.cb-rule-opt:hover:not(.dis){border-color:var(--accent)}
.cb-rule-opt.on{border-color:var(--accent);background:var(--control);box-shadow:inset 0 0 0 1px var(--accent)}
.cb-rule-opt.dis{opacity:.4;cursor:not-allowed}
.cb-rule-h{display:flex;align-items:center;justify-content:space-between;gap:8px}
.cb-rule-h b{font-size:15px}.cb-rule-h em{font-size:9.5px;font-weight:900;letter-spacing:.04em;color:var(--cyan);font-style:normal}
.cb-rule-opt small{color:var(--muted);font-size:12px;line-height:1.4}
.cb-cr-side{position:sticky;top:12px}
.cb-review{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:16px 18px}
.cb-review h3{margin:0 0 12px;font-size:15px;color:#fff}
.cb-rev-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:7px 0;border-bottom:1px solid var(--border-soft);font-size:13.5px;color:var(--muted)}
.cb-rev-row b{color:var(--text)}
.cb-rev-row.big b{font-size:19px;color:var(--gold)}
.cb-rev-row .l{color:var(--lose)}
.cb-vis{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:12px 0;font-size:13.5px;color:var(--muted)}
.cb-visseg{width:auto;background:var(--inset);border:1px solid var(--border);border-radius:9px;padding:3px}
.cb-visseg button{height:32px;padding:0 12px;font-size:12.5px;border-radius:6px}
.cb-review .btn.block{margin-top:6px}

/* Battle creator */
.cb-ct{max-width:1240px;margin:0 auto}
.cb-ct-top{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:8px 0 30px;flex-wrap:wrap}
.cb-ct-top h2{margin:0;font-size:28px;letter-spacing:-.7px;color:#fff}
.cb-ct-create{height:46px;padding:0 22px;font-size:15px;font-weight:800;display:inline-flex;align-items:center;border:0;border-radius:10px;cursor:pointer;
  gap:16px;background:linear-gradient(135deg,#508dff,#3975ec);color:#fff;box-shadow:0 8px 20px -12px #4285ff99}
.cb-ct-create>span{display:inline-flex;align-items:center;padding-left:16px;border-left:1px solid #ffffff33;font-size:13px}
.cb-ct-create:hover:not(:disabled){filter:brightness(1.05)}
.cb-ct-create:disabled{background:var(--control);color:var(--dim);box-shadow:none;cursor:not-allowed}
.cb-ct-create .cs-coin{width:12px;height:12px;margin-left:6px}
.cb-ct-sec{margin-bottom:24px}
.cb-ct h3{margin:0 0 14px;font-size:13px;letter-spacing:.01em;color:#c9d9ed;font-weight:700}
.cb-modecards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.cb-modecard{position:relative;text-align:left;padding:17px;border-radius:12px;background:#0d1b2eb3;border:1px solid #21364e;
  cursor:pointer;color:var(--text);display:flex;flex-direction:column;align-items:flex-start;gap:7px;transition:background .18s,border-color .18s,box-shadow .18s}
.cb-modecard:hover{background:#14263b;border-color:#3c5876}
.cb-mode-check{position:absolute;top:18px;right:18px;width:18px;height:18px;border-radius:50%;border:1px solid #40536b;display:grid;place-items:center;color:#071321}
.cb-mode-check .ic{width:12px;height:12px;stroke-width:3;opacity:0}
.cb-modecard b{font-size:15px;color:#fff;padding-right:26px}
.cb-modecard small{font-size:12px;color:#91a7c1;line-height:1.5;max-width:23ch}
.cb-modecard.on{border-color:var(--mc);background:linear-gradient(135deg,#152e3b,#102034 75%);box-shadow:0 0 0 1px color-mix(in srgb,var(--mc) 15%,transparent)}
.cb-modecard.on .cb-mode-check{border-color:var(--mc);background:var(--mc)}
.cb-modecard.on .cb-mode-check .ic{opacity:1}
.m-normal{--mc:#2fe08f}.m-crazy{--mc:#ff5ca8}.m-final{--mc:#ffc94a}.m-jackpot{--mc:#a78bfa}.m-shared{--mc:#65c7ff}
.cb-ct-settings{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:28px;padding:24px;background:#0d1b2e99;border:1px solid #21364e;border-radius:14px;margin-bottom:24px}
.cb-ct-formats{display:flex;flex-wrap:wrap;gap:18px 28px}
.cb-format-group h4{display:flex;gap:12px;align-items:center;margin:0 0 9px;font-size:11px;font-weight:500;color:var(--dim)}
.cb-pills{display:flex;gap:4px;flex-wrap:wrap;align-items:center;padding:4px;background:#071321;border:1px solid #1c3047;border-radius:9px}
.cb-pill-opt{height:36px;padding:0 13px;border-radius:6px;background:transparent;border:1px solid transparent;color:var(--muted);font-weight:700;font-size:13px;cursor:pointer;transition:border-color .12s,color .12s}
.cb-pill-opt:hover:not(:disabled){color:#fff;border-color:var(--accent)}
.cb-pill-opt.on{border-color:#3c6290;background:#213d60;color:#fff;box-shadow:0 2px 6px #0003}
.cb-pill-opt:disabled{opacity:.38;cursor:not-allowed}
.cb-ct-hint{font-size:10px;color:var(--dim)}
.cb-ct-options{padding-left:28px;border-left:1px solid #25394e}
.cb-opts{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.cb-toggle{display:flex;align-items:center;justify-content:space-between;gap:12px;background:none;border:0;padding:10px 0;cursor:pointer;text-align:left;min-width:0}
.cb-option-copy{display:flex;flex-direction:column;gap:5px}
.cb-toggle b{font-size:13px;color:var(--text);font-weight:700}
.cb-toggle small{font-size:10.5px;line-height:1.4;color:var(--dim)}
.cb-toggle.dis{opacity:.42;cursor:not-allowed}
.cb-toggle.dis b{color:var(--dim)}
.cb-tg{flex:none;width:38px;height:22px;border-radius:12px;background:var(--control);position:relative;transition:background .15s}
.cb-tg:after{content:"";position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:#fff;transition:transform .15s}
.cb-toggle.on .cb-tg{background:var(--accent)}
.cb-toggle.on .cb-tg:after{transform:translateX(16px)}
/* Crazy reverse tag accent (pink) wherever the rule tag shows */
.cb-rule-tag.crazy{color:#ff8fab;border-color:#5a2740;background:#2a121f}
.cb-res-rule.crazy span{color:#ff8fab}
.cb-ct-cases{padding:24px;border:1px solid #21364e;border-radius:14px;background:#0a1728aa}
.cb-ct-casehead{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:20px;flex-wrap:wrap}
.cb-ct-casehead h3{margin:0}
.cb-round-count{display:inline-flex;gap:3px;align-items:center;margin-left:10px;padding:4px 8px;border-radius:5px;background:#172a42;font-size:11px;color:#e4eeff}
.cb-round-count>span{color:#8da5c2;font-weight:500}
.cb-ct-caseinfo{display:flex;gap:16px;font-size:13px;color:var(--muted);align-items:center}
.cb-ct-caseinfo b{color:var(--text);margin-left:8px}
.cb-ct-caseinfo .l{color:var(--lose)}
.cb-ct-caseinfo .cs-coin{width:12px;height:12px;margin-left:2px}
.cb-ct-casebtns{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}
.cb-ct-casebtns button{height:30px;padding:0 10px;border-radius:6px;background:transparent;border:1px solid #263b53;color:var(--muted);font-weight:600;font-size:11px;cursor:pointer;display:flex;align-items:center;gap:5px}
.cb-ct-casebtns .ic{width:13px;height:13px}
.cb-ct-casebtns button[data-sort="clear"]{margin-left:auto;border-color:transparent}
.cb-ct-casebtns button:hover:not(:disabled){color:#fff;border-color:var(--accent)}
.cb-ct-casebtns button:disabled{opacity:.4;cursor:default}
.cb-ct-caserow{display:flex;gap:12px;flex-wrap:wrap;align-items:stretch}
.cb-roundcard{position:relative;width:148px;background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:12px 10px 10px;display:flex;flex-direction:column;align-items:center;gap:6px}
.cb-rc-n{position:absolute;top:8px;left:8px;min-width:28px;padding:0 4px;height:22px;display:grid;place-items:center;background:var(--control);border-radius:6px;font-size:11px;font-weight:800;color:var(--muted)}
.cb-rc-art{width:64px;height:64px;display:grid;place-items:center;position:relative;margin-top:4px}
.cb-rc-art img{max-width:100%;max-height:100%;object-fit:contain;filter:drop-shadow(0 6px 10px #0007)}
.cb-rc-fallback{position:absolute;color:var(--accent);display:none}
.cb-rc-art.nofx img{display:none}.cb-rc-art.nofx .cb-rc-fallback{display:block}
.cb-rc-nm{font-size:12.5px;font-weight:700;color:#fff;text-align:center;line-height:1.1;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cb-rc-price{font-size:12px;color:var(--gold);font-weight:800;display:inline-flex;align-items:center}
.cb-rc-price .cs-coin{width:11px;height:11px;margin-left:3px}
.cb-rc-remove{position:absolute;top:6px;right:6px;z-index:1;width:28px;height:28px;padding:5px;display:grid;place-items:center;border:1px solid transparent;border-radius:6px;background:var(--inset);color:var(--muted);cursor:pointer}
.cb-rc-remove .ic{width:16px;height:16px}.cb-rc-remove:hover{color:#ff9aad;border-color:#ff809050;background:#45202e}
.cb-rc-acts{display:flex;gap:6px;width:100%;margin-top:4px}
.cb-rc-acts button{flex:1;width:30px;height:30px;padding:2px;display:grid;place-items:center;background:var(--inset);border:1px solid var(--border);border-radius:6px;color:var(--muted);font-size:20px;cursor:pointer}
.cb-rc-acts button:hover:not(:disabled){color:#fff;border-color:var(--accent)}
.cb-rc-acts button:disabled{opacity:.3;cursor:default}
.cb-rc-remove:focus-visible,.cb-rc-acts button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.cb-addcase-wrap{position:relative}
.cb-addcase{width:148px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;border:1px dashed #426081;border-radius:12px;background:#12243b55;color:#b7ceea;cursor:pointer;font-weight:700;font-size:13px;min-height:172px;transition:background .2s,border-color .2s}
.cb-addcase:hover:not(:disabled){border-color:#72b1ff;color:#fff;background:#16335688}
.cb-addcase:disabled{opacity:.4;cursor:not-allowed}
.cb-addcase-plus{width:40px;height:40px;display:grid;place-items:center;border-radius:50%;background:#213f64;transition:transform .2s}
.cb-addcase:hover:not(:disabled) .cb-addcase-plus{transform:scale(1.1)}
.cb-addcase .ic{width:20px;height:20px}
.cb-casepicker{position:absolute;top:0;left:0;z-index:30;width:330px;max-width:88vw;background:#0e2041;border:1px solid var(--border);border-radius:12px;padding:10px;box-shadow:0 24px 54px -22px #000}
.cb-cp-head{display:flex;align-items:center;justify-content:space-between;font-weight:700;color:#fff;font-size:13px;margin:2px 2px 9px}
.cb-cp-x{width:26px;height:26px;display:grid;place-items:center;background:var(--inset);border:1px solid var(--border);border-radius:6px;color:var(--muted);cursor:pointer}
.cb-cp-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;max-height:320px;overflow:auto}
.cb-cp-opt{display:flex;flex-direction:column;align-items:center;gap:5px;padding:10px 6px;background:var(--inset);border:1px solid var(--border);border-radius:9px;cursor:pointer;color:var(--text);transition:border-color .12s,transform .1s}
.cb-cp-opt:hover{border-color:var(--accent);transform:translateY(-2px)}
.cb-cp-opt b{font-size:12px;text-align:center}
.cb-cp-opt .cb-cp-price{display:inline-flex;align-items:center}
.cb-cp-opt .cs-coin{width:11px;height:11px;margin-left:3px}

/* big ADD CASE picker modal */
.cb-pkmodal{position:fixed;inset:0;z-index:130;display:flex;align-items:center;justify-content:center;padding:24px 16px;background:#040a18d0;backdrop-filter:blur(4px)}
.cb-pkmodal[hidden]{display:none}
.cb-pk-dlg{width:min(940px,100%);max-height:88vh;display:flex;flex-direction:column;background:linear-gradient(180deg,#0f2041,#0b1930);border:1px solid var(--border);border-radius:16px;box-shadow:0 30px 80px -30px #000;overflow:hidden}
.cb-pk-head{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--border-soft)}
.cb-pk-head h3{margin:0;font-size:19px;color:#fff}
.cb-pk-x{width:36px;height:36px;display:grid;place-items:center;border:0;border-radius:8px;background:var(--inset);color:var(--muted);cursor:pointer}
.cb-pk-x:hover{color:#fff;background:var(--control)}
.cb-pk-tools{display:flex;gap:12px;align-items:center;padding:14px 20px;flex-wrap:wrap}
.cb-pk-search{flex:1;min-width:180px;display:flex;align-items:center;gap:10px;height:42px;padding:0 14px;background:var(--inset);border:1px solid var(--border);border-radius:10px;color:var(--muted)}
.cb-pk-search:focus-within{border-color:var(--accent);box-shadow:var(--ring)}
.cb-pk-search .ic{width:17px;height:17px}
.cb-pk-search input{flex:1;background:none;border:0;outline:none;color:var(--text);font-size:14.5px;min-height:24px}
.cb-pk-sort{width:auto;background:var(--inset);border:1px solid var(--border);border-radius:10px;padding:3px;flex-wrap:wrap}
.cb-pk-sort button{height:34px;padding:0 13px;font-size:12.5px;border-radius:7px;white-space:nowrap}
.cb-pk-grid{flex:1;overflow-y:auto;display:grid;grid-template-columns:repeat(auto-fill,minmax(158px,1fr));gap:14px;padding:4px 20px 18px}
.cb-pk-card{position:relative;background:radial-gradient(130% 80% at 50% 6%,#152a4e 0,#0c1930 60%);border:1px solid var(--border);border-radius:14px;padding:12px 10px 10px;display:flex;flex-direction:column;align-items:center;gap:5px;cursor:pointer;transition:transform .12s,border-color .15s,box-shadow .18s}
.cb-pk-card:hover,.cb-pk-card:focus-visible{transform:translateY(-3px);border-color:var(--accent);outline:none;box-shadow:0 16px 34px -18px #000,0 0 0 1px var(--accent)}
.cb-pk-card.added{border-color:#2f6ae6}
.cb-pk-art{position:relative;width:86px;height:86px;display:grid;place-items:center}
.cb-pk-art img{max-width:100%;max-height:100%;object-fit:contain;filter:drop-shadow(0 8px 14px #0008)}
.cb-pk-fallback{position:absolute;color:var(--accent);display:none}
.cb-pk-art.nofx img{display:none}.cb-pk-art.nofx .cb-pk-fallback{display:block}
.cb-pk-count{position:absolute;top:-4px;right:-4px;background:var(--accent);color:#fff;font-size:11px;font-weight:800;border-radius:20px;padding:1px 8px;box-shadow:0 3px 8px #0007}
.cb-pk-nm{font-size:13.5px;font-weight:700;color:#fff;text-align:center;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cb-pk-price{display:inline-flex;align-items:center;font-size:15px;font-weight:800;color:var(--gold)}
.cb-pk-price .cs-coin{width:12px;height:12px;margin-left:4px}
.cb-pk-meta{font-size:10.5px;color:var(--dim);text-align:center}
.cb-pk-qty{display:flex;align-items:center;gap:8px;margin-top:4px}
.cb-pk-qty button{width:28px;height:28px;display:grid;place-items:center;border:1px solid var(--border);border-radius:7px;background:var(--inset);color:var(--text);font-size:16px;font-weight:800;cursor:pointer;line-height:1}
.cb-pk-qty button:hover:not(:disabled){border-color:var(--accent);color:#fff}
.cb-pk-qty button:disabled{opacity:.35;cursor:default}
.cb-pk-qty span{min-width:14px;text-align:center;font-weight:800;color:var(--muted)}
.cb-pk-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 20px;border-top:1px solid var(--border-soft)}
.cb-pk-foot span{color:var(--muted);font-size:13px}
@media (max-width:620px){
  .cb-pk-dlg{max-height:92vh}
  .cb-pk-grid{grid-template-columns:repeat(auto-fill,minmax(128px,1fr));gap:10px;padding:4px 14px 16px}
  .cb-pk-tools{padding:12px 14px}
  .cb-pk-head{padding:14px}
  .cb-pk-art{width:70px;height:70px}
}

/* room */
.cb-room-head{margin-bottom:14px}
.cb-room-head>div{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:8px}
.cb-pill{font-size:12.5px;font-weight:700;color:var(--muted);background:var(--inset);border:1px solid var(--border);border-radius:20px;padding:3px 11px}
.cb-rule-desc{color:var(--muted);font-size:14px;margin:0;line-height:1.5}
.cb-caserow{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:18px}
.cb-caserow-c{display:inline-flex;align-items:center;gap:7px;background:var(--surface);border:1px solid var(--border);border-radius:9px;padding:7px 12px;font-size:13px;font-weight:600}
.cb-caserow-c em{width:20px;height:20px;display:grid;place-items:center;background:var(--control);border-radius:5px;font-size:11px;font-weight:800;color:var(--muted);font-style:normal}
.cb-seats{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:14px;margin-bottom:20px}
.cb-seats.teams{display:flex;align-items:stretch;gap:14px;justify-content:center;flex-wrap:wrap}
.cb-seatgrid{display:contents}
.cb-team{flex:1;min-width:200px;max-width:340px;background:#0b1a33;border:1px solid var(--border);border-radius:14px;padding:12px;display:flex;flex-direction:column;gap:10px}
.cb-team-h{font-size:13px;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;text-align:center}
.cb-vs{display:grid;place-items:center;font-weight:900;color:var(--dim);font-size:16px}
.cb-seat{position:relative;background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:16px 12px;display:flex;flex-direction:column;align-items:center;gap:7px;min-height:150px;justify-content:center}
.cb-seat.empty{border-style:dashed;justify-content:space-between}
.cb-seat-ph{display:flex;flex-direction:column;align-items:center;gap:6px;color:var(--dim);font-size:12.5px;margin-top:8px}
.cb-seat-ph .ic{width:26px;height:26px}
.cb-seat-add{display:flex;flex-direction:column;gap:7px;width:100%}
.btn.sm{height:34px;padding:0 10px;font-size:12.5px}
.cb-localpick{position:relative}
.cb-localpick .btn{width:100%}
.cb-localmenu{position:absolute;left:0;right:0;bottom:calc(100% + 6px);background:#0e2041;border:1px solid var(--border);border-radius:10px;padding:5px;z-index:20;box-shadow:0 18px 40px -16px #000;max-height:220px;overflow:auto}
.cb-localmenu button{display:flex;align-items:center;gap:8px;width:100%;padding:7px 8px;background:none;border:0;border-radius:7px;color:var(--text);cursor:pointer;font-size:13px}
.cb-localmenu button:hover{background:var(--control)}
.cb-localmenu button em{margin-left:auto;color:var(--gold);font-size:12px;font-weight:700;font-style:normal}
.cb-seat-nm{display:flex;align-items:center;font-weight:800;font-size:14.5px;color:#fff;text-align:center}
.cb-seat-pay{color:var(--dim);font-size:11.5px}
.cb-seat-x{position:absolute;top:8px;right:8px;width:26px;height:26px;display:grid;place-items:center;background:var(--inset);border:1px solid var(--border);border-radius:7px;color:var(--muted);cursor:pointer}
.cb-seat-x:hover{color:var(--lose);border-color:var(--lose)}
.cb-room-acts{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;border-top:1px solid var(--border-soft);padding-top:16px}
.cb-room-left{display:flex;gap:10px;flex-wrap:wrap}
.cb-start{height:48px;padding:0 24px;font-size:15px}

/* live */
.cb-live-controls{margin-left:auto;display:flex;gap:8px}
.seg-btn{display:inline-flex;align-items:center;gap:5px;height:34px;padding:0 12px;background:var(--surface);border:1px solid var(--border);border-radius:8px;color:var(--muted);font-weight:700;font-size:12.5px;cursor:pointer}
.seg-btn:hover{color:#fff;border-color:var(--accent)}
.seg-btn .ic{width:15px;height:15px}
.cb-livebar{display:flex;align-items:center;gap:16px;flex-wrap:wrap;background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:12px 18px;margin-bottom:12px}
.cb-lb-rule{display:flex;flex-direction:column}
.cb-lb-rule b{font-size:16px;color:#fff}
.cb-lb-rule span{font-size:10.5px;font-weight:900;letter-spacing:.05em;color:var(--cyan)}
.cb-lb-rule.crazy b{color:#ff8fab}.cb-lb-rule.crazy span{color:#ff8fab}
.cb-lb-round{display:flex;align-items:baseline;gap:5px;color:var(--muted);font-size:13px}
.cb-lb-round b{font-size:22px;color:#fff;font-weight:800}
.cb-lb-case{margin-left:4px;display:flex;flex-direction:column;color:var(--dim);font-size:11px}
.cb-lb-case b{color:var(--text);font-size:14px}
.cb-lb-pool{margin-left:auto;text-align:right;display:flex;flex-direction:column}
.cb-lb-pool span{font-size:11px;color:var(--dim)}
.cb-lb-pool b{font-size:22px;color:var(--gold);font-weight:800}
.cb-upcoming{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:16px}
.cb-up{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--muted);background:var(--inset);border:1px solid var(--border);border-radius:7px;padding:5px 10px;opacity:.6}
.cb-up em{width:17px;height:17px;display:grid;place-items:center;background:var(--control);border-radius:4px;font-size:10px;font-weight:800;font-style:normal}
.cb-up.cur{opacity:1;border-color:var(--accent);color:#fff}
.cb-lanes{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}
.cb-lanes.teams{grid-template-columns:1fr 1fr;align-items:start}
.cb-teamcol{display:flex;flex-direction:column;gap:12px;background:#0b1a33;border:1px solid var(--border);border-radius:14px;padding:12px;min-width:0}
.cb-lanes>*{min-width:0}
.cb-teamcol .cb-team-h{display:flex;align-items:center;justify-content:space-between}
.cb-teamcol .cb-team-h b{color:var(--gold);font-size:15px}
.cb-lane{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:10px;transition:border-color .2s,box-shadow .2s;min-width:0}
.cb-lane.lead{border-color:var(--win);box-shadow:0 0 0 1px var(--win),0 0 22px -8px var(--win)}
.cb-lane-head{display:flex;align-items:center;gap:9px;margin-bottom:9px}
.cb-lane-id{flex:1;min-width:0;display:flex;flex-direction:column}
.cb-lane-id b{font-size:13px;color:#fff;display:flex;align-items:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cb-lane-score{font-size:15px;font-weight:800;color:var(--gold);font-variant-numeric:tabular-nums}
.cb-reel{position:relative;height:130px;overflow:hidden;border-radius:10px;background:#071322;border:1px solid #2c435b;min-width:0;isolation:isolate;transition:border-color .2s}
.cb-reel:after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,#071322 0%,transparent 30%,transparent 70%,#071322 100%);z-index:2}
.cb-reel-track{display:flex;height:100%;will-change:transform}
.cb-tile{flex:0 0 96px;width:96px;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;border:5px solid #071322;border-radius:12px;background:linear-gradient(#172b41,#102033);position:relative;transition:opacity .3s}
.cb-tile:after{content:"";position:absolute;left:6px;right:6px;bottom:4px;height:2px;border-radius:2px;background:var(--tint)}
.cb-tile img{width:42px;height:42px;object-fit:contain;filter:drop-shadow(0 3px 6px #0007)}
.cb-tile small{font-size:9px;color:#9bb1cd;width:100%;padding:0 2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:center}
.cb-tile span{font-size:11px;font-weight:800;color:#edf5ff}
.cb-reel-mark{position:absolute;inset:4px auto 4px 50%;width:88px;transform:translateX(-50%);border:1px solid #80cdff77;border-radius:8px;z-index:3;pointer-events:none}
.cb-reel-mark:before,.cb-reel-mark:after{content:"";position:absolute;left:calc(50% - 5px);border:5px solid transparent;border-top-color:#bfeaff;top:-4px}
.cb-reel-mark:after{top:auto;bottom:-4px;border-top-color:transparent;border-bottom-color:#bfeaff}
.cb-reel.is-landed{border-color:var(--land-tint)}
.cb-reel.is-landed .cb-reel-mark{border-color:var(--land-tint);box-shadow:0 0 20px color-mix(in srgb,var(--land-tint) 20%,transparent)}
.cb-reel.is-landed .cb-tile:not(.win){opacity:.3}
.cb-reel.is-landed .cb-tile.win img{animation:cs-prize-land .6s both}
.cb-reel.is-landed .cb-tile.win{background:radial-gradient(ellipse at 50% 20%,color-mix(in srgb,var(--tint) 24%,#112137),#112137)}
.cb-items{display:grid;grid-template-columns:repeat(auto-fill,minmax(112px,1fr));gap:8px;margin-top:12px;min-height:30px}
.cb-it{min-width:0;position:relative;border-radius:8px;background:var(--inset);border:1px solid var(--border);border-bottom:2px solid var(--tint);display:flex;flex-direction:column;align-items:center;gap:6px;padding:9px 7px 10px;text-align:center}
.cb-it img{width:36px;height:36px;object-fit:contain}
.cb-it small{align-self:flex-start;font-size:9px;color:var(--dim)}
.cb-it>span{font-size:11px;line-height:1.3;color:var(--muted);overflow-wrap:anywhere}
.cb-it>b{font-size:12px;font-variant-numeric:tabular-nums;color:var(--tint);margin-top:auto}
.cb-pull-history{margin:22px 0}
.cb-pull-history>h3{font-size:15px;color:var(--muted);margin:0 0 12px}
.cb-countdown-wrap{position:relative}
.cb-countdown{position:fixed;inset:0;z-index:60;display:none;flex-direction:column;align-items:center;justify-content:center;gap:8px;background:#040a18cc;backdrop-filter:blur(3px)}
.cb-countdown:not(:empty){display:flex}
.cb-countdown b{font-size:72px;font-weight:900;color:#fff}
.cb-countdown span{color:var(--muted);font-size:15px}

/* Avatar draws: purple for Jackpot, gold for a tie-break. */
.cb-jackpot{--draw-color:#bfa1ff;margin:0 0 24px;background:radial-gradient(ellipse at 50% 0,#9c6aff16,transparent 70%),#0b1729;border:1px solid #4b3c67;border-radius:16px;padding:24px;overflow:hidden}
.cb-jackpot[hidden]{display:none}
.cb-jackpot.tie{--draw-color:#f3c867;border-color:#635135;background:radial-gradient(ellipse at 50% 0,#e5bd4a16,transparent 70%),#0b1729}
.cb-draw-head{display:flex;align-items:center;gap:12px;margin-bottom:22px}
.cb-draw-symbol{width:44px;height:44px;display:grid;place-items:center;background:#ffffff07;border:1px solid color-mix(in srgb,var(--draw-color) 25%,transparent);border-radius:12px;color:var(--draw-color)}
.cb-draw-symbol .ic{width:26px;height:26px;stroke-width:1.5}
.cb-draw-head h3{margin:3px 0 0;font-size:23px;color:#fff;letter-spacing:-.4px}
.cb-draw-head small{font-size:10px;text-transform:uppercase;letter-spacing:.1em;color:#8b9cb6}
.cb-draw-pool{margin-left:auto;display:flex;flex-direction:column;align-items:flex-end;gap:6px}
.cb-draw-pool b{font-size:18px;color:var(--draw-color);display:flex;align-items:center;gap:6px}
.cb-draw-pool .cs-coin{width:13px;height:13px}
.cb-jp-wheel{position:relative;height:154px;overflow:hidden;border-radius:12px;background:#07111f;border:1px solid #30415b}
.cb-jp-wheel:after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(90deg,#07111f,transparent 28%,transparent 72%,#07111f)}
.cb-jp-track{display:flex;height:100%;will-change:transform}
.cb-jp-seg{flex:0 0 112px;width:112px;height:100%;display:flex;flex-direction:column;gap:13px;align-items:center;justify-content:center;border:5px solid #07111f;border-radius:15px;background:linear-gradient(#1c2940,#111d30);color:#fff;transition:opacity .3s}
.cb-jp-seg>b{font-size:10px;padding:0 5px;text-align:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}
.cb-draw-faces{display:flex;align-items:center;justify-content:center;flex-shrink:0}
.cb-draw-faces .cb-av{width:54px;height:54px;min-width:54px;border-radius:11px;border:2px solid #283954;box-shadow:0 6px 12px #0006}
.cb-draw-faces .cb-av+.cb-av{margin-left:-25px}
.cb-draw-faces .cb-av-ltr{font-size:22px}.cb-draw-faces .cb-botbadge{font-size:7px}
.cb-jp-ptr{position:absolute;inset:3px auto 3px 50%;width:104px;transform:translateX(-50%);border:1px solid var(--draw-color);border-radius:12px;box-shadow:0 0 30px color-mix(in srgb,var(--draw-color) 13%,transparent);z-index:3;pointer-events:none}
.cb-jp-ptr:before,.cb-jp-ptr:after{content:"";position:absolute;left:calc(50% - 5px);width:10px;height:10px;transform:rotate(45deg);background:var(--draw-color);top:-7px;border-radius:2px}
.cb-jp-ptr:after{top:auto;bottom:-7px}
.cb-jp-legend{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin-top:18px;color:#bdcde2}
.cb-jp-legend>span{display:flex;align-items:center;gap:7px;padding:6px 9px;background:#172339;border:1px solid #28394e;border-radius:8px}
.cb-jp-legend .cb-av{width:22px;height:22px;min-width:22px;border-radius:5px;border-width:1px;box-shadow:none}
.cb-jp-legend .cb-av+.cb-av{margin-left:-10px}.cb-jp-legend .cb-av-ltr{font-size:10px}.cb-jp-legend .cb-botbadge{display:none}
.cb-jp-legend b{font-size:11px}.cb-jp-legend em{font-size:11px;font-weight:800;color:var(--draw-color);font-style:normal;margin-left:4px}
.cb-draw-winner{min-height:82px;display:flex;align-items:center;justify-content:center;gap:12px;padding-top:18px;color:#8195b3;font-size:12px}
.cb-draw-winner>span:not(.cb-draw-faces){display:flex;flex-direction:column;gap:4px}
.cb-draw-winner small{font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--draw-color)}
.cb-draw-winner b{font-size:21px;color:white}.cb-draw-winner>.ic{width:26px;height:26px;color:var(--draw-color)}
.cb-jp-wheel.is-landed .cb-jp-seg:not(.win){opacity:.25}
.cb-jp-wheel.is-landed .cb-jp-seg.win{background:radial-gradient(ellipse at 50% 30%,color-mix(in srgb,var(--draw-color) 28%,#152238),#152238)}
.cb-jp-wheel.is-landed .cb-jp-seg.win .cb-draw-faces{animation:cs-prize-land .7s both}
.cb-draw.revealed .cb-draw-winner{animation:cs-value-in .4s both}
@media(max-width:620px){.cb-jackpot{padding:15px 12px}.cb-draw-head{gap:9px}.cb-draw-head h3{font-size:20px}.cb-draw-head small{font-size:8px}.cb-draw-pool b{font-size:15px}.cb-draw-symbol{width:36px;height:36px}}
@media(prefers-reduced-motion:reduce){.cb-reel.is-landed .cb-tile.win img,.cb-jp-wheel.is-landed .cb-jp-seg.win .cb-draw-faces,.cb-draw.revealed .cb-draw-winner{animation:none}}

/* results */
.cb-res-banner{--result-accent:#59dfb2;position:relative;isolation:isolate;overflow:hidden;display:flex;align-items:center;gap:24px;background:radial-gradient(ellipse at 7% 65%,color-mix(in srgb,var(--result-accent) 12%,transparent),transparent 55%),linear-gradient(115deg,#11242f,#0b1626 72%);border:1px solid color-mix(in srgb,var(--result-accent) 25%,#23354c);border-radius:18px;padding:30px 32px;margin-bottom:20px;box-shadow:0 16px 38px -28px #000,inset 0 1px 0 #ffffff08}
.cb-res-banner.jackpot{--result-accent:#b99aff}.cb-res-banner.final{--result-accent:#f1ca7a}.cb-res-banner.shared{--result-accent:#7bcfff}.cb-res-banner.crazy{--result-accent:#ed97ba}
.cb-res-banner:before{content:"";position:absolute;left:6%;top:0;width:45%;height:1px;background:linear-gradient(90deg,transparent,var(--result-accent),transparent);opacity:.65}
.cb-res-watermark{position:absolute;right:14%;top:-38px;transform:rotate(-16deg);color:var(--result-accent);opacity:.04;z-index:-1;pointer-events:none}
.cb-res-watermark>.ic{width:230px;height:230px;stroke-width:1}
.cb-res-emblem{position:relative;flex:none;min-width:76px;display:grid;place-items:center;padding:8px;border:1px solid color-mix(in srgb,var(--result-accent) 30%,transparent);border-radius:22px;background:linear-gradient(140deg,#ffffff0d,#ffffff02);box-shadow:0 0 38px -16px var(--result-accent)}
.cb-res-champions{display:flex;align-items:center}
.cb-res-champions .cb-av{width:60px;height:60px;border-radius:14px;border:2px solid #203d43;font-size:24px;box-shadow:0 6px 12px #0004}
.cb-res-champions .cb-av+.cb-av{margin-left:-22px}
.cb-res-trophy{position:absolute;right:-9px;bottom:-9px;display:grid;place-items:center;width:30px;height:30px;border:3px solid #10242d;border-radius:50%;background:#f3d38b;color:#5b411d}
.cb-res-trophy>.ic{width:18px;height:18px}
.cb-res-share{display:grid;place-items:center;width:60px;height:60px;color:var(--result-accent)}.cb-res-share>.ic{width:34px;height:34px}
.cb-res-win{flex:1;min-width:0}
.cb-res-meta{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:8px;color:#7f9ba8;font-size:9px;font-weight:700;letter-spacing:.11em;text-transform:uppercase}
.cb-res-rule{padding:4px 8px;border-radius:5px;border:1px solid color-mix(in srgb,var(--result-accent) 22%,transparent);background:color-mix(in srgb,var(--result-accent) 8%,transparent);color:var(--result-accent)}
.cb-res-win h2{margin:0;font-size:clamp(22px,2.1vw,30px);line-height:1.15;font-weight:800;letter-spacing:-.035em;color:#f2fcf8;overflow-wrap:anywhere}
.cb-res-details{display:flex;align-items:center;flex-wrap:wrap;gap:18px;margin-top:9px;font-size:12px;color:#85a1b3}
.cb-res-details>span{display:flex;align-items:center;gap:7px}.cb-res-details>span+span:before{content:"";width:3px;height:3px;border-radius:50%;background:#486171;margin-right:4px}
.cb-res-details b{display:inline-flex;align-items:center;color:#c3dfdc;font-size:13px;font-variant-numeric:tabular-nums}
.cb-res-banner .cb-res-you{--net-color:#9db6cb;flex:0 1 auto;min-width:0;max-width:100%;text-align:center;padding:18px 22px;margin-left:auto;border:1px solid color-mix(in srgb,var(--net-color) 25%,transparent);border-radius:16px;display:flex;align-items:center;justify-content:center;gap:13px;background:linear-gradient(140deg,color-mix(in srgb,var(--net-color) 9%,#0b1726),#0b1726);box-shadow:0 8px 22px -16px #000;transition:transform .22s ease,border-color .22s,box-shadow .22s}
.cb-res-banner .cb-res-you.win{--net-color:#46dfac}.cb-res-banner .cb-res-you.loss{--net-color:#ed8299}
.cb-res-banner .cb-res-you b{font-size:clamp(22px,2.1vw,32px);line-height:1;letter-spacing:-.035em;font-weight:800;font-variant-numeric:tabular-nums;white-space:nowrap}
.cb-res-coin{display:grid;place-items:center;flex:none;width:38px;height:38px;border-radius:50%;background:#f9cf6810;transition:transform .25s cubic-bezier(.2,.8,.3,1.5)}
.cb-res-coin .cs-coin{width:26px;height:26px;margin:0;filter:drop-shadow(0 3px 6px #0006)}
.cb-res-banner .cb-res-you:hover,.cb-res-banner .cb-res-you:focus-visible{transform:translateY(-3px);border-color:color-mix(in srgb,var(--net-color) 65%,transparent);box-shadow:0 13px 25px -17px var(--net-color);outline:none}
.cb-res-you:hover .cb-res-coin,.cb-res-you:focus-visible .cb-res-coin{transform:translateY(-2px) rotate(-9deg) scale(1.12)}
.cb-res-you.win b{color:var(--win)}.cb-res-you.loss b{color:var(--lose)}
.cb-res-you.win b{text-shadow:0 0 30px #35df9f24;animation:cb-result-arrive .55s cubic-bezier(.2,.9,.3,1.1) both}
@keyframes cb-result-arrive{from{opacity:0;transform:translateY(6px) scale(.96)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.cb-res-you.win b{animation:none}.cb-res-banner .cb-res-you,.cb-res-coin{transition:none}.cb-res-banner .cb-res-you:hover,.cb-res-banner .cb-res-you:focus-visible,.cb-res-you:hover .cb-res-coin,.cb-res-you:focus-visible .cb-res-coin{transform:none}}
.cb-res-acts{display:flex;gap:10px;flex-wrap:wrap}
.cb-result-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(245px,1fr));gap:14px;align-items:start}
.cb-result-player{--result-color:#ec8293;padding:0;overflow:hidden;background:#0e1c30;border-color:#2b3c53}
.cb-result-player.winner{--result-color:#46dfac;border-color:#2b7963;box-shadow:0 0 25px -15px #35dda788}
.cb-result-player.shared{--result-color:#77c7fa;border-color:#355b77}
.cb-result-head{padding:18px;margin:0;gap:12px;min-height:80px}
.cb-result-head .cb-av{width:40px;height:40px;border-radius:10px}
.cb-result-head>div{min-width:0;display:flex;flex-direction:column;gap:5px}
.cb-result-head b{display:flex;align-items:center;color:#edf5ff;font-size:14px;overflow-wrap:anywhere}
.cb-result-head>div>span{font-size:11px;color:#8199b7;font-variant-numeric:tabular-nums}
.cb-result-outcome{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;min-height:140px;isolation:isolate;background:radial-gradient(ellipse at 50% 100%,#7f33452e,transparent 80%),#1b2030;border-top:1px solid #b6607422;border-bottom:1px solid #b6607422;overflow:hidden}
.cb-result-player.winner .cb-result-outcome{background:radial-gradient(ellipse at 50% 100%,#2bd79a2a,transparent 80%),#102b2b;border-color:#4cdcaa22}
.cb-result-player.shared .cb-result-outcome{background:radial-gradient(ellipse at 50% 100%,#42aeef22,transparent 80%),#132c3c;border-color:#6acbfa22}
.cb-result-mark{position:absolute;right:18px;bottom:-16px;color:var(--result-color);opacity:.055;transform:rotate(-14deg);z-index:-1}
.cb-result-mark .ic{width:122px;height:122px;stroke-width:1}
.cb-result-outcome>small{text-transform:uppercase;letter-spacing:.16em;font-size:10px;font-weight:800;color:var(--result-color)}
.cb-result-outcome>b{display:flex;align-items:center;gap:8px;font-size:32px;letter-spacing:-.6px;color:#eaf5f5;font-variant-numeric:tabular-nums}
.cb-result-outcome .cs-coin{width:24px;height:24px;margin-left:0}
.cb-result-player.loss .cb-result-outcome>b{color:#a8b1c2}
.cb-result-items{padding:16px}
.cb-result-items h4{display:flex;align-items:center;justify-content:space-between;margin:0 0 12px;color:#9cb1ca;font-size:11px;font-weight:600}
.cb-result-items h4>span{font-size:10px;padding:2px 6px;border-radius:4px;background:#21354d;color:#adc4dd}
.cb-result-items .cb-it{display:grid;grid-template-columns:32px minmax(0,1fr) auto;gap:10px;align-items:center;text-align:left;margin-top:7px;padding:10px;border:1px solid #24374d;border-left:2px solid var(--tint);border-radius:7px;background:#0a1626}
.cb-result-items .cb-it img{width:28px;height:28px}
.cb-result-items .cb-it>span{font-size:11px;line-height:1.35;color:#c0d0e3}
.cb-result-items .cb-it>b{font-size:12px;margin:0;white-space:nowrap}
.cb-result-teams{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.cb-result-team{min-width:0}
.cb-result-team>h3{display:flex;justify-content:space-between;align-items:center;font-size:13px;margin:0 0 12px;color:#a4bad4}
.cb-result-team>h3>span{display:inline-flex;align-items:center;gap:6px;font-size:10px;color:#46dfac}
.cb-result-team>h3 .ic{width:13px;height:13px}
.cb-result-team .cb-result-grid{grid-template-columns:1fr}
@media(min-width:1500px){.cb-result-team .cb-result-grid{grid-template-columns:repeat(auto-fit,minmax(225px,1fr))}}
@media(max-width:620px){.cb-result-grid,.cb-result-teams{grid-template-columns:1fr}.cb-result-head{padding:15px}.cb-result-outcome{min-height:118px}.cb-result-items{padding:13px}}

@media (max-width:900px){
  .cb-create{grid-template-columns:1fr}
  .cb-cr-side{position:static}
  .cb-ct-settings{grid-template-columns:1fr;gap:20px}
  .cb-ct-options{padding:20px 0 0;border-left:0;border-top:1px solid #25394e}
  .cb-modecards{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:620px){
  .cb-hero-in h1{font-size:30px}
  .cb-list{grid-template-columns:1fr}
  .cb-lanes,.cb-lanes.teams{grid-template-columns:1fr}
  .cb-seats.teams{flex-direction:column}
  .cb-vs{padding:4px 0}
  .cb-res-banner{flex-wrap:wrap;gap:16px;padding:22px 18px}
  .cb-res-emblem{min-width:60px;padding:6px;border-radius:16px}.cb-res-champions .cb-av{width:46px;height:46px;border-radius:10px}.cb-res-share{width:46px;height:46px}
  .cb-res-meta{gap:6px;font-size:8px}.cb-res-details{gap:9px;font-size:10px}.cb-res-details b{font-size:12px}
  .cb-res-banner .cb-res-you{width:100%;margin:0;padding:15px;gap:10px}.cb-res-banner .cb-res-you b{font-size:clamp(18px,4.9vw,30px)}
  .cb-ct-top{margin-bottom:24px;gap:14px}
  .cb-ct-top h2{font-size:24px}
  .cb-ct-create{width:100%;justify-content:space-between}
  .cb-modecards{gap:8px}
  .cb-modecard{padding:14px;gap:6px}
  .cb-modecard b{font-size:14px}.cb-modecard small{font-size:11px}
  .cb-mode-check{top:14px;right:12px;width:16px;height:16px}
  .cb-ct-settings,.cb-ct-cases{padding:16px}
  .cb-ct-formats{gap:16px}
  .cb-opts{gap:16px}.cb-toggle{gap:8px}
  .cb-ct-casehead{gap:10px}.cb-ct-caseinfo{font-size:11px}
  .cb-ct-caserow{gap:10px}
  .cb-roundcard,.cb-addcase{width:calc(50% - 5px);min-width:0}
  .cb-rc-acts{gap:6px}.cb-rc-acts button{height:34px}
  .cb-ct button:focus-visible{outline:2px solid #8bc7ff;outline-offset:3px}
}
@media(prefers-reduced-motion:reduce){.cb-addcase:hover:not(:disabled) .cb-addcase-plus{transform:none}}
.cb-caserow-c{position:relative;min-width:76px;min-height:76px;justify-content:center;padding:8px}
.cb-caserow-c img{width:60px;height:60px;object-fit:contain}
.cb-caserow-c em{position:absolute;left:5px;top:5px;z-index:1}
/* Battle lobby: horizontal case rows with a fixed action column. */
.cb-lobby-title{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:6px 0 26px}
.cb-lobby-title h1{font-size:30px;letter-spacing:-.6px;margin:0}
.cb-lobby-title a{display:flex;align-items:center;gap:7px;font-size:13px;color:var(--muted)}
.cb-lobby-toolbar{display:flex;align-items:center;gap:22px;min-height:52px;margin-bottom:26px}
.cb-sort{display:flex;gap:8px}
.cb-sort button{height:42px;padding:0 18px;border:1px solid transparent;border-radius:6px;background:var(--control);color:var(--muted);font:inherit;font-size:13px;font-weight:700;cursor:pointer}
.cb-sort button[aria-pressed="true"]{border-color:#65c7ff;background:#19334b;color:#e5f5ff}
.cb-live-counts{display:flex;gap:18px;margin-left:auto;font-size:12px;color:var(--muted)}
.cb-live-counts span+span{padding-left:18px;border-left:1px solid var(--border);color:var(--win)}
.cb-live-counts b{font-weight:600}
.cb-lobby-toolbar #cb-create{flex:none;height:43px;padding:0 20px;border-radius:6px}
.cb-feed-title{font-size:14px;font-weight:700;color:var(--muted);margin:0 0 13px}
.cb-battle-list{display:flex;flex-direction:column;gap:12px}
.cb-battle-row{--battle-color:#65c7ff;position:relative;display:grid;grid-template-columns:154px minmax(0,1fr) 128px 88px 88px;align-items:center;gap:18px;min-height:158px;padding:16px 20px 30px;border:1px solid #25344b;border-radius:8px;background:linear-gradient(100deg,#18283b,#141f30 55%,#18283b)}
.cb-row-mode{position:absolute;left:20px;bottom:9px;font-size:10px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:var(--battle-color)}
.cb-battle-row.crazy{--battle-color:#f6cf66;background:linear-gradient(100deg,#302e24,#171f2b 55%,#302d23);border-color:#45402c}
.cb-battle-row.shared{--battle-color:#3edb9b;background:linear-gradient(100deg,#18332f,#141f2c 55%,#18332b);border-color:#27483c}
.cb-battle-row.jackpot{--battle-color:#bf9cff;background:linear-gradient(100deg,#29223e,#141f30 55%,#29223e);border-color:#3b3151}
.cb-row-info{display:flex;align-items:center;justify-content:space-between;gap:12px;min-width:0}
.cb-row-rounds{display:flex;flex-direction:column;align-items:center;gap:9px;font-size:11px;color:var(--battle-color)}
.cb-row-rounds b{display:grid;place-items:center;width:51px;height:53px;border-radius:5px;background:#09111c70;font-size:20px;font-weight:600;font-variant-numeric:tabular-nums}
.cb-row-track{display:flex;align-items:center;gap:7px;min-width:0;max-width:100%;height:108px;padding:10px 12px;overflow-x:auto;overflow-y:hidden;background:#09111c99;border-radius:5px;scrollbar-width:thin;scrollbar-color:#34455e transparent}
.cb-round-case{position:relative;flex:0 0 68px;width:68px;height:86px;display:grid;place-items:center}
.cb-round-case img{width:100%;height:80px;object-fit:contain}
.cb-round-case.opened{opacity:.34}
.cb-round-case.current:before,.cb-round-case.current:after{content:"";position:absolute;left:calc(50% - 4px);border-left:4px solid transparent;border-right:4px solid transparent}
.cb-round-case.current:before{top:-1px;border-top:5px solid var(--battle-color,#65c7ff)}
.cb-round-case.current:after{bottom:-1px;border-bottom:5px solid var(--battle-color,#65c7ff)}
.cb-row-price{min-width:0;text-align:center;font-variant-numeric:tabular-nums}
.cb-row-price>span{display:flex;justify-content:center;align-items:center;gap:5px;font-size:14px}
.cb-row-price b{overflow-wrap:anywhere}
.cb-row-price .cs-coin{flex:none;width:15px;height:15px}
.cb-row-price small,.cb-row-seats>small{display:block;margin-top:9px;font-size:10px;color:var(--dim)}
.cb-row-seats{display:flex;flex-direction:column;align-items:center;gap:6px;min-width:76px}
.cb-row-seats>small{white-space:nowrap}
.cb-seatdiamonds{display:grid;grid-template-columns:repeat(2,20px);gap:6px;justify-content:center;align-content:center;min-height:48px;padding:4px;transform:rotate(-45deg)}
.cb-seatdiamonds.seats-3{grid-template-columns:repeat(2,20px)}
.cb-seatdiamonds.seats-6{grid-template-columns:repeat(3,20px)}
.cb-seatdiamond{width:20px;height:20px;border:1px solid var(--battle-color,#65c7ff);border-radius:3px;display:grid;place-items:center;background:#0a1423;overflow:hidden}
.cb-seatdiamond.seat-empty{border-color:#3d5067}
.cb-seatdiamond.seat-empty i{width:6px;height:6px;border-radius:2px;background:#324861}
.cb-seatdiamond .cb-av{width:22px;height:22px;min-width:22px;border:0;border-radius:0;transform:rotate(45deg);overflow:hidden}
.cb-seatdiamond .cb-av-ltr{font-size:11px}
.cb-seatdiamond .cb-botbadge{display:none}
.cb-row-action{display:flex;flex-direction:column;align-items:center;gap:7px;text-align:center;color:var(--battle-color)}
.cb-row-action .btn{height:39px;min-width:76px;border-radius:5px;background:var(--battle-color);border:1px solid transparent;color:#0b1725;font-size:12px;font-weight:800;box-shadow:none}
.cb-row-action .btn:hover{filter:brightness(1.12)}
.cb-row-action>span{font-size:10px;font-weight:800;text-transform:uppercase;line-height:1.3}
.cb-row-action>small{font-size:9px;color:var(--muted)}
.cb-battle-row.done .cb-row-rounds{color:var(--dim)}
.cb-preview-panel{padding:24px;border:1px solid var(--border);border-radius:12px;background:var(--surface)}
.cb-preview-panel h2{margin:0 0 10px}.cb-preview-panel p{color:var(--muted);font-size:13px;line-height:1.6}
.cb-preview-bottom{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-top:24px}
.cb-preview-bottom>div{display:flex;align-items:center;gap:22px}
@media(max-width:1150px){.cb-battle-row{grid-template-columns:140px minmax(0,1fr) 106px 76px 84px;gap:12px;padding:14px}.cb-live-counts{gap:10px}.cb-live-counts span+span{padding-left:10px}.cb-lobby-toolbar{gap:14px}}
@media(max-width:760px){.cb-lobby-title{margin-bottom:18px}.cb-lobby-title h1{font-size:24px}.cb-lobby-title a{font-size:11px}.cb-lobby-toolbar{flex-wrap:wrap;gap:12px}.cb-live-counts{order:3;width:100%;margin:0}.cb-lobby-toolbar #cb-create{margin-left:auto;padding:0 13px}.cb-battle-row{grid-template-columns:126px minmax(0,1fr) 80px;gap:14px 10px;padding:13px;min-height:185px}.cb-row-info{grid-column:1;grid-row:1;gap:5px}.cb-row-rounds b{width:43px}.cb-row-track{grid-column:2/4;grid-row:1;height:93px}.cb-round-case{flex-basis:60px;width:60px;height:76px}.cb-round-case img{height:70px}.cb-row-price{grid-column:1;grid-row:2}.cb-row-price>span{font-size:11px}.cb-row-seats>small{margin-top:2px}.cb-row-entry{grid-column:2;grid-row:2}.cb-row-view{grid-column:3;grid-row:2}.cb-preview-bottom{flex-direction:column;align-items:stretch}.cb-preview-bottom>div{justify-content:center}.cb-preview-panel{padding:18px}}
.cb-recent-results{margin-top:44px;border-top:1px solid #ffffff12;padding-top:18px}
.cb-recent-results>summary{display:flex;gap:12px;align-items:center;cursor:pointer;color:var(--muted);font-size:14px;font-weight:700;padding:10px 0;list-style:none}
.cb-recent-results>summary::before{content:'+';font-size:20px;color:var(--cyan)}
.cb-recent-results[open]>summary::before{content:'−'}
.cb-recent-results>summary span{margin-left:auto;font-size:11px;font-weight:500;color:var(--dim)}
.cb-recent-results .cb-battle-list{margin-top:14px}
.cb-row-action .cb-row-buy{background:#28d493;color:#052e22;border-color:#58e6b0}
@media(max-width:1150px){.cb-battle-row{padding-bottom:30px}.cb-row-mode{left:14px}}
@media(max-width:760px){.cb-battle-row{padding-bottom:32px}.cb-row-mode{left:13px;bottom:9px}}

/* Compact live rows retain clear entry and view actions. */
.cb-battle-row{min-height:112px;padding:10px 18px 25px;gap:15px}
.cb-row-track{height:76px;padding:5px 10px}
.cb-round-case{height:66px;width:66px;flex-basis:66px}
.cb-round-case img{height:62px;max-width:64px}
.cb-row-rounds{gap:5px}.cb-row-rounds b{width:43px;height:42px;font-size:18px}
.cb-row-price small,.cb-row-seats>small{margin-top:5px}
@media(max-width:760px){.cb-battle-row{min-height:150px;padding:10px 12px 27px;gap:10px}.cb-row-track{height:70px}.cb-round-case{height:60px;width:56px;flex-basis:56px}.cb-round-case img{height:56px;max-width:54px}}

/* A restrained one-shot flourish on valuable pulls, never a change to the outcome. */
.good-pull{animation:good-pull-frame .8s ease-out both}
.good-pull>img,.good-pull .cs-tile-ic img,.good-pull .rb-won-img{animation:good-pull-icon .85s cubic-bezier(.2,.8,.3,1) both;transform-origin:50% 60%}
@keyframes good-pull-icon{0%{transform:scale(1)}25%{transform:translateY(-5px) scale(1.12) rotate(-5deg);filter:brightness(1.3)}55%{transform:translateY(-2px) scale(1.06) rotate(3deg)}100%{transform:none;filter:brightness(1)}}
@keyframes good-pull-frame{0%{box-shadow:inset 0 0 0 1px transparent}30%{box-shadow:inset 0 0 18px color-mix(in srgb,var(--tint,#7ad9ff) 28%,transparent),0 0 12px color-mix(in srgb,var(--tint,#7ad9ff) 20%,transparent)}100%{box-shadow:inset 0 0 0 1px transparent}}
@media(prefers-reduced-motion:reduce){.good-pull,.good-pull>img,.good-pull .cs-tile-ic img,.good-pull .rb-won-img{animation:none}}

.cb-battle-row{padding-bottom:10px}

.cs-show-all{align-self:stretch;min-height:145px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;border:1px dashed #42617c;border-radius:12px;background:#10203480;color:#a7d7f8;font:700 14px Inter,system-ui;cursor:pointer}.cs-show-all:hover{border-color:#6fc9fa;background:#17344a}.cs-show-all .ic{width:24px;height:24px}

.cb-watch-label{margin-left:auto;font-size:10px;letter-spacing:.12em;color:#75d8ff;background:#16405480;padding:7px 11px;border-radius:7px}.cb-watch-status{text-align:center;color:#94b5d0;font-size:13px;padding:10px}.cb-watch-wait{min-height:280px;display:flex;flex-direction:column;padding:20px;gap:15px}.cb-watch-placeholder{display:flex;flex:1;flex-direction:column;align-items:center;justify-content:center;gap:15px;min-height:150px;border:1px dashed #37506c;border-radius:12px;color:#5b7898}.cb-watch-placeholder .ic{width:35px;height:35px}.cb-open-avatar{display:grid;place-items:center;width:44px;height:44px;background:#16293d;border-radius:8px}.cb-watch-wait .cb-lane-id small{display:block;color:#7893ae;font-size:11px;margin-top:5px}.cb-caserow-c.cur{border-color:#6dcfff;background:#23506a}.cb-watch-wait .btn{align-self:center}.cb-watch-wait .cb-lane-head{padding:0}.cb-live:has(.cb-watch-wait) .cb-lanes{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px}

.cb-live-head{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px 0}.cb-live-head #cb-curcase{display:flex;flex-direction:column;gap:7px}.cb-live-head #cb-curcase>span,.cb-live-pool{font-size:11px;color:#829bb5}.cb-live-head #cb-curcase>b{font-size:20px;color:#e6f2ff}.cb-live-pool{display:flex;flex-direction:column;gap:7px;text-align:right}.cb-live-pool>b{font-size:21px;color:#f3d47c}.cb-watch-status{padding:4px 0 12px}

.cs-openings-modal{z-index:94;background:#030910c9;backdrop-filter:blur(6px)}
.cs-openings-card{width:min(1120px,100%);max-height:min(82vh,850px);display:flex;flex-direction:column;background:#0b1726;border:1px solid #35516c;border-radius:16px;overflow:hidden;box-shadow:0 28px 90px #000b}
.cs-openings-card .gm-head{flex:none;padding:22px 25px;border-bottom:1px solid #2b4057}.cs-openings-card h2{margin:0}.cs-openings-card .gm-head small{display:block;color:#8ca5bf;font-size:12px;margin-top:6px}
.cs-openings-scroll{min-height:0;overflow-y:auto;overscroll-behavior:contain;scroll-behavior:smooth;padding:22px 25px;scrollbar-width:thin;scrollbar-color:#385675 transparent}
@media(max-width:600px){.cs-openings-card{max-height:85vh}.cs-openings-card .gm-head{padding:17px}.cs-openings-scroll{padding:15px}.cs-openings-card h2{font-size:18px}}
@media(prefers-reduced-motion:reduce){.cs-openings-scroll{scroll-behavior:auto}}

.cb-case-window{width:min(278px,100%);margin:5px auto 18px;overflow:hidden}
.cb-case-window:has(.cb-case-queue[hidden]){display:none}
.cb-upcoming.cb-case-queue{position:relative;display:flex;flex-wrap:nowrap;gap:14px;overflow-x:auto;overflow-y:hidden;padding:14px calc(50% - 37px);margin:0;scrollbar-width:none;scroll-behavior:smooth;mask-image:linear-gradient(90deg,transparent,#000 8% 92%,transparent);overscroll-behavior-x:contain}
.cb-case-queue::-webkit-scrollbar{display:none}
.cb-case-queue .cb-up{flex:0 0 74px;width:74px;height:78px;padding:4px;display:grid;place-items:center;border-color:transparent;background:transparent;opacity:.3;filter:grayscale(1);transition:opacity .3s,filter .3s,transform .3s,border-color .3s,background .3s}
.cb-case-queue .cb-up img{width:64px;height:64px;object-fit:contain;filter:drop-shadow(0 5px 5px #0006)}
.cb-case-queue .cb-up.cur{opacity:1;filter:none;transform:scale(1.08);background:#548dbd19;border-color:#67c9ed88;box-shadow:0 0 18px #55cefc15}
.cb-case-queue .cb-up.past{opacity:.55;filter:grayscale(.45)}
.cb-shared-reveal{border:1px solid #5ac6a063;background:radial-gradient(ellipse at 50% 0,#255e4d55,transparent 70%),#0a1c24;border-radius:16px;padding:20px;margin-bottom:20px}
.cb-shared-players{display:flex;flex-wrap:wrap;justify-content:center;gap:14px;padding:22px 0 8px}
.cb-shared-players>div{display:flex;align-items:center;flex-direction:column;gap:10px;min-width:130px;padding:18px 20px;border:1px solid #457a6555;border-radius:12px;background:#163c2f70;animation:cbSharePop .7s both;animation-delay:var(--delay)}
.cb-shared-players strong{font-size:24px;color:#6ee9b5}.cb-shared-players small{color:#87b4a3;font-size:11px}.cb-shared-players .cb-avatar{width:48px;height:48px}
@keyframes cbSharePop{0%{opacity:0;transform:translateY(15px) scale(.85)}70%{opacity:1;transform:translateY(-3px) scale(1.03)}100%{opacity:1;transform:none}}
.cb-shared-reveal.settled .cb-shared-players>div{animation:none}
@media(prefers-reduced-motion:reduce){.cb-case-queue,.cb-case-queue .cb-up{scroll-behavior:auto;transition:none}.cb-shared-players>div{animation:none}}

.cb-upcoming.cb-case-queue[hidden]{display:none}

/* Shulker bonus: the lid lifts before the second, premium-only reel. */
.cs-bonus-heading{margin:20px 0 10px;color:#dfc9ff;font-size:17px}.cs-bonus-note{color:#8ea8c7;font-size:13px;margin:0 0 14px}.cs-entry-prizes{grid-template-columns:repeat(2,minmax(0,1fr));max-width:390px}
.cs-shulker-reveal{position:absolute;inset:0;z-index:9;display:flex;align-items:center;justify-content:center;flex-direction:column;background:radial-gradient(ellipse,#472465,#0a1425 72%);border-radius:inherit;animation:csShulkerEnter .22s both;pointer-events:none}
.cs-reelwrap:has(.cs-shulker-reveal) .cs-opening-status{visibility:hidden}
.cs-shulker-art{position:relative;width:160px;height:145px;margin-bottom:8px}.cs-shulker-art img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 0 16px #ba70fa44)}
.cs-shulker-base{clip-path:polygon(0 44%,50% 66%,100% 44%,100% 100%,0 100%)}
.cs-shulker-art .cs-shulker-lid{clip-path:polygon(0 0,100% 0,100% 44%,50% 66%,0 44%);animation:csShulkerLid 1.4s cubic-bezier(.2,.7,.2,1) both}
.cs-shulker-art i{position:absolute;inset:28% 12% 15%;border-radius:50%;background:#dba5ff;filter:blur(24px);animation:csShulkerGlow 1.4s both}
.cs-shulker-reveal strong{font-size:19px;letter-spacing:2px;color:#ecd6ff;text-shadow:0 0 22px #c278ff}.cs-shulker-reveal>span{color:#aab8df;font-size:12px;margin-top:7px;letter-spacing:1px}
@keyframes csShulkerEnter{from{opacity:0}to{opacity:1}}@keyframes csShulkerLid{0%,12%{transform:translateY(0)}35%{transform:translateY(-5px) rotate(-2deg)}65%,100%{transform:translateY(-31px) rotate(-4deg)}}@keyframes csShulkerGlow{0%{opacity:0;transform:scale(.3)}65%,100%{opacity:.7;transform:scale(1.15)}}
@media(prefers-reduced-motion:reduce){.cs-shulker-reveal,.cs-shulker-art img,.cs-shulker-art i{animation:none}}