/* Expansion beta (PB 2026-10-17): Updates, Battle Slabs (lobby + arena show), Graildex. Uses the app.css tokens. */

/* ---------- Updates ---------- */
.up-doors{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:18px}
.up-door{display:flex;flex-direction:column;border-radius:16px;overflow:hidden;background:var(--card);border:1px solid var(--line);transition:transform .15s,border-color .15s}
.up-door:hover{transform:translateY(-2px);border-color:rgba(242,193,78,.4)}
.up-art{height:150px;background:#000 center/cover no-repeat;position:relative}.up-art:after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 40%,var(--card))}
.up-door:nth-child(2) .up-art{background-size:auto 130%;background-color:#120e04}
.up-tx{padding:4px 16px 16px;display:flex;flex-direction:column;gap:6px;flex:1}.up-tx h3{font:800 18px/1.15 var(--disp);font-stretch:108%;margin:0}.up-tx p{margin:0;color:var(--mute);font-size:12.5px;flex:1}
.up-st{font-size:11.5px;font-weight:800;color:var(--dim)}.up-st.on{color:var(--green)}
.up-kit{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;align-items:start}
.up-box{display:flex;flex-direction:column;gap:8px;padding:16px}.up-box h4{margin:0;font:800 15px var(--disp)}.up-box .muted,.muted{color:var(--mute);font-size:12px;margin:0}
.up-signin{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px}
.up-sw{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:11px;background:var(--card2);text-align:left}.up-sw i{width:34px;height:20px;border-radius:99px;background:var(--card3);position:relative;flex:none;transition:background .2s}.up-sw i:after{content:"";position:absolute;left:3px;top:3px;width:14px;height:14px;border-radius:50%;background:var(--mute);transition:transform .2s,background .2s}
.up-sw.on i{background:rgba(61,220,132,.3)}.up-sw.on i:after{transform:translateX(14px);background:var(--green)}.up-sw span{font-weight:700;flex:1}.up-sw b{font-size:11px;color:var(--mute)}.up-sw.on b{color:var(--green)}
.up-rigs{display:grid;gap:6px}.up-rig{text-align:left;padding:9px 11px;border-radius:10px;background:var(--card2);box-shadow:inset 0 0 0 1px transparent}.up-rig b{display:block;font-size:13px}.up-rig small{color:var(--mute);font-size:11.5px}.up-rig.on{box-shadow:inset 0 0 0 1.5px var(--gold);background:rgba(242,193,78,.07)}
.up-fund{display:grid;grid-template-columns:1fr 1fr;gap:8px}.up-fund div{background:var(--card2);border-radius:10px;padding:8px 10px}.up-fund small{display:block;color:var(--mute);font-size:11px}.up-fund b{font:800 16px var(--disp)}
.up-row{display:flex;flex-wrap:wrap;gap:8px;align-items:center}.up-odds{display:flex;align-items:center;gap:6px;color:var(--mute);font-size:12px}.up-odds input{width:80px;background:var(--card2);border:1px solid var(--line2);color:var(--ink);border-radius:8px;padding:6px 8px;font:inherit}
.up-rolls{display:grid;gap:4px;margin-top:4px}.up-rolls div{display:grid;grid-template-columns:auto 1fr auto auto;gap:8px;font-size:11.5px;color:var(--mute);align-items:center}.up-rolls span{font-weight:800;font-size:10.5px;letter-spacing:.06em}.up-rolls .hit{color:var(--gold)}.up-rolls .sk{color:var(--rose)}

/* ---------- Battles lobby ---------- */
.bt-opener{background:linear-gradient(120deg,rgba(242,193,78,.08),rgba(139,124,246,.08)),var(--card);border:1px solid rgba(242,193,78,.25);border-radius:18px;padding:16px;display:flex;flex-direction:column;gap:12px;margin-bottom:18px}
.bt-oh h3{margin:2px 0 0;font:800 19px/1.15 var(--disp);font-stretch:108%}
.bt-ms{display:flex;gap:8px;overflow-x:auto;padding-bottom:4px;scrollbar-width:none}.bt-ms::-webkit-scrollbar{display:none}
.bt-m{flex:none;width:96px;display:flex;flex-direction:column;align-items:center;gap:2px;padding:10px 6px;border-radius:12px;background:var(--card2);position:relative;box-shadow:inset 0 0 0 1px var(--line)}
.bt-m img{width:38px;height:84px;object-fit:contain;margin-bottom:4px}.bt-m b{font:900 15px var(--disp)}.bt-m small{color:var(--mute);font-size:10.5px;text-align:center;line-height:1.2}
.bt-m em{position:absolute;top:6px;right:6px;font-style:normal;font-size:9.5px;font-weight:800;color:var(--violet2)}.bt-m.on{box-shadow:inset 0 0 0 2px var(--gold);background:rgba(242,193,78,.08)}.bt-m.lock{opacity:.55}.bt-rs{font-style:normal;font-size:9.5px;font-weight:800;color:var(--gold);margin-top:2px}
.bt-step{display:flex;align-items:center;gap:10px;justify-content:center;padding:6px;border-radius:12px;background:var(--card2);box-shadow:inset 0 0 0 2px var(--gold)}.bt-step>div{min-width:110px;text-align:center}.bt-step b{display:block;font:900 20px var(--disp);font-stretch:112%}.bt-step small{color:var(--mute);font-size:11px}.bt-step button{width:44px;height:44px;border-radius:10px;font:900 22px var(--disp);background:rgba(242,193,78,.12);color:var(--gold)}.bt-step button:disabled{opacity:.3}
.bt-quick{justify-content:center;margin-top:8px}
.bt-sizes{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.bt-sizes button{padding:10px;border-radius:12px;background:var(--card2);box-shadow:inset 0 0 0 1px var(--line)}.bt-sizes b{display:block;font:900 17px var(--disp);font-stretch:112%}.bt-sizes small{color:var(--mute);font-size:11px}.bt-sizes .on{box-shadow:inset 0 0 0 2px var(--gold);background:rgba(242,193,78,.08)}
.bt-sum{display:flex;align-items:center;gap:16px;flex-wrap:wrap}.bt-sum div small{display:block;color:var(--mute);font-size:11px}.bt-sum b{font:900 20px var(--disp)}.bt-sum .lbtn{margin-left:auto;padding:12px 18px;font-size:14px}
.bt-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:10px;margin-bottom:18px}
.bt-card{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:14px;background:var(--card);border:1px solid var(--line);transition:border-color .15s}.bt-card:hover{border-color:var(--line2)}
.bt-card.is-live{border-color:rgba(255,92,122,.45)}
.bt-pk{position:relative;flex:none}.bt-pk img{width:34px;height:74px;object-fit:contain}.bt-sz{position:absolute;bottom:-4px;left:50%;transform:translateX(-50%);font:900 10px var(--disp);background:var(--gold);color:#16130a;border-radius:5px;padding:1px 5px;white-space:nowrap}
.bt-mid{flex:1;min-width:0}.bt-mid b{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.bt-mid small{color:var(--mute);font-size:11.5px}
.bt-avs{display:flex;gap:3px;margin-top:6px;flex-wrap:wrap}.bt-avs img,.bt-avs .bt-empty{width:20px;height:20px;border-radius:50%;object-fit:cover;background:var(--card3)}.bt-avs .bt-empty{display:block;box-shadow:inset 0 0 0 1.5px dashed var(--line2);border:1.5px dashed var(--line2);background:none}
.bt-rt{display:flex;flex-direction:column;align-items:flex-end;gap:6px;flex:none}.bt-tag{font-size:11px;font-weight:800;color:var(--mute);background:var(--card2);padding:3px 8px;border-radius:99px}.bt-tag.live{color:var(--rose)}.bt-tag.done{color:var(--gold)}
.bt-top{width:34px;height:50px;object-fit:contain;border-radius:4px}
.bt-rules{padding:16px;margin-top:6px}.bt-rules h4{margin:0 0 8px;font:800 15px var(--disp)}.bt-rules ol{margin:0 0 10px;padding-left:20px;display:grid;gap:5px;color:var(--mute)}.bt-rules ol b{color:var(--ink)}

/* ---------- Battle arena ---------- */
body.view-battle .body{grid-template-columns:minmax(0,1fr)}body.view-battle .body>.side,body.view-battle .body>.slip{display:none}
.ba{margin:-6px auto 0;max-width:1240px}
.ba-stage{position:relative;border-radius:20px;overflow:hidden;min-height:min(78vh,720px);background:#05040a url(/img/battle/arena-wide.webp) center 30%/cover no-repeat;display:flex;flex-direction:column;isolation:isolate;box-shadow:0 0 0 1px rgba(242,193,78,.25),0 30px 80px -30px rgba(139,124,246,.4)}
.ba-stage:before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 50% 70%,transparent 30%,rgba(0,0,0,.55) 90%),linear-gradient(rgba(0,0,0,.45),transparent 30%,transparent 70%,rgba(0,0,0,.6));z-index:-1}
.ba-fx{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:9}
.ba-hud{display:flex;align-items:flex-start;gap:14px;padding:14px 16px}
.ba-ret{font-weight:700;color:var(--mute);font-size:12.5px;padding-top:4px}.ba-ret:hover{color:var(--ink)}
.ba-title{flex:1;text-align:center}.ba-title h2{margin:2px 0 0;font:900 clamp(18px,2.6vw,26px)/1.1 var(--disp);font-stretch:112%;text-shadow:0 2px 20px #000}
.ba-pot{text-align:right;line-height:1.1}.ba-pot small{display:block;color:var(--mute);font-size:11px}.ba-pot b{font:900 clamp(20px,3vw,30px) var(--disp);color:var(--gold);text-shadow:0 0 24px rgba(242,193,78,.55)}
.ba-seats{flex:1;display:grid;gap:clamp(8px,1.6vw,22px);padding:10px clamp(12px,3vw,40px) 18px;align-content:center;justify-content:center;grid-template-columns:repeat(2,minmax(0,200px))}
.ba-seats[data-n="2"]{column-gap:clamp(70px,14vw,220px)}
.ba-seats[data-n="4"]{grid-template-columns:repeat(4,minmax(0,170px))}
.ba-seats[data-n="8"]{grid-template-columns:repeat(4,minmax(0,140px))}
.ba-seats[data-g]{--pw:clamp(54px,calc(((min(78vh,720px) - 190px) / var(--rd) - 56px) * .64),150px);grid-template-columns:repeat(var(--cd),var(--pw))}
.ba-seats[data-many] .ba-who span,.ba-seats[data-many] .ba-val small{display:none}.ba-seats[data-many] .ba-who{padding:3px}
.ba-pl{--rc:#a3a3aa;display:flex;flex-direction:column;align-items:center;gap:6px;transition:opacity .35s,filter .35s,transform .35s;position:relative}
.ba-slot{position:relative;width:100%;aspect-ratio:.64;display:flex;align-items:flex-end;justify-content:center}
.ba-slot:after{content:"";position:absolute;left:8%;right:8%;bottom:-6%;height:14%;border-radius:50%;background:radial-gradient(rgba(242,193,78,.55),transparent 70%);filter:blur(4px);z-index:-1;transition:background .3s}
.ba-pl.is-me .ba-slot:after{background:radial-gradient(rgba(169,156,255,.7),transparent 70%)}
.ba-pack{position:absolute;inset:4% 16%;display:flex;align-items:center;justify-content:center;transition:transform .3s,opacity .3s}.ba-pack img{max-width:100%;max-height:100%;object-fit:contain;filter:drop-shadow(0 10px 18px rgba(0,0,0,.7))}
.ba-pl.is-open .ba-pack{opacity:.28;filter:grayscale(1)}.ba-pl.is-open .ba-slot{border:2px dashed rgba(242,193,78,.35);border-radius:14px;animation:baOpen 2.2s ease-in-out infinite}
@keyframes baOpen{50%{border-color:rgba(242,193,78,.75);box-shadow:0 0 30px -6px rgba(242,193,78,.5)}}
.ba[data-phase="rip"] .ba-pack{animation:baShake 1.3s ease-in-out infinite}
.ba-seats.charge .ba-pack{animation:baShake .18s linear infinite;filter:drop-shadow(0 0 22px rgba(242,193,78,.9)) brightness(1.25)}
.ba-seats.charge .ba-slot:before{content:"";position:absolute;inset:-10% -14%;border-radius:50%;border:2px solid rgba(242,193,78,.8);animation:baRing .5s ease-in infinite}
@keyframes baShake{0%,100%{transform:rotate(0)}25%{transform:rotate(-2.5deg) translateY(-2px)}75%{transform:rotate(2.5deg) translateY(-2px)}}
@keyframes baRing{from{transform:scale(1.5);opacity:0}to{transform:scale(.7);opacity:1}}
.ba-slab{position:absolute;inset:2% 6%;transform-style:preserve-3d;transition:transform .55s cubic-bezier(.3,1.3,.5,1);opacity:0;transform:translateY(-30px) scale(.8)}
.ba-seats.ripped .ba-pack{animation:baBurst .45s ease-out forwards}.ba-seats.ripped .ba-slab{opacity:1;transform:none;transition:transform .55s cubic-bezier(.3,1.3,.5,1),opacity .25s .1s}
@keyframes baBurst{40%{transform:scale(1.25);filter:brightness(3)}100%{transform:scale(1.6) translateY(-20%);opacity:0}}
.ba-face{position:absolute;inset:0;border-radius:10px;backface-visibility:hidden;-webkit-backface-visibility:hidden;display:flex;align-items:center;justify-content:center;overflow:hidden}
.ba-back{background:linear-gradient(150deg,#1d1606,#0b0905 60%,#1a1430);box-shadow:inset 0 0 0 2px rgba(242,193,78,.55),0 12px 30px rgba(0,0,0,.6)}.ba-back img{width:46%;opacity:.85;filter:drop-shadow(0 0 12px rgba(242,193,78,.6))}
.ba-front{transform:rotateY(180deg);background:#0b0b0d;box-shadow:inset 0 0 0 2px var(--rc),0 0 36px -4px var(--rc)}.ba-front img{width:100%;height:100%;object-fit:contain}
.ba-pl.flip .ba-slab{transform:rotateY(180deg)}
.ba-pl.dim{opacity:.42;filter:saturate(.5)}
.ba-pl.drum .ba-slab{animation:baDrum .5s ease-in-out infinite}@keyframes baDrum{50%{transform:scale(1.06);filter:drop-shadow(0 0 26px rgba(242,193,78,.9))}}
.ba-crown{position:absolute;top:-16%;left:50%;transform:translate(-50%,-30px) scale(.4);opacity:0;font-size:clamp(24px,3vw,38px);color:var(--gold);text-shadow:0 0 18px rgba(242,193,78,.9),0 3px 0 #6b4e0e;transition:transform .45s cubic-bezier(.3,1.6,.5,1),opacity .3s;z-index:3}
.ba-pl.lead .ba-crown{opacity:1;transform:translate(-50%,0) scale(1)}
.ba-pl.lead{transform:translateY(-6px) scale(1.04);z-index:2}
.ba-ko{position:absolute;top:44%;left:50%;transform:translate(-50%,-50%) rotate(-14deg) scale(1.6);opacity:0;font:900 clamp(9px,1vw,12px)/1 var(--disp);letter-spacing:.12em;color:#fff;background:var(--rose);padding:4px 8px;border-radius:5px;white-space:nowrap;transition:transform .3s cubic-bezier(.3,1.6,.5,1),opacity .2s;z-index:3;box-shadow:0 4px 14px rgba(0,0,0,.5)}
.ba-pl.ko .ba-ko{opacity:1;transform:translate(-50%,-50%) rotate(-14deg) scale(1)}
.ba-pl.ko .ba-front img,.ba-pl.ko .ba-val{filter:grayscale(.8) brightness(.6)}.ba-pl.ko .ba-front{box-shadow:inset 0 0 0 2px #3a3a40}.ba-pl.gone .ba-ko{opacity:0}.ba-pl.ko{transform:translateY(8px)}
.ba-stack{position:absolute;right:-12%;top:-8%;width:52%;height:34%;pointer-events:none;z-index:4}
.ba-stack img{position:absolute;top:0;right:calc(var(--i) * 13%);width:52%;aspect-ratio:.64;object-fit:contain;background:#0b0b0d;border-radius:5px;box-shadow:0 0 0 1.5px var(--gold),0 6px 14px rgba(0,0,0,.7);transform:rotate(calc(8deg - var(--i) * 5deg))}
.ba-val{text-align:center;line-height:1.1;min-height:34px}.ba-val b{font:900 clamp(15px,1.9vw,22px) var(--disp);color:var(--ink);text-shadow:0 2px 12px #000}.ba-val small{display:block;color:var(--mute);font-size:11px}
.ba-pl:not(.shown) .ba-val{visibility:hidden}.ba-pl.lead .ba-val b{color:var(--gold)}
.ba-who{display:flex;align-items:center;gap:6px;max-width:100%;padding:4px 10px 4px 4px;border-radius:99px;background:rgba(10,10,12,.78);backdrop-filter:blur(6px);box-shadow:inset 0 0 0 1px var(--line2)}
.ba-who img,.ba-who i{width:22px;height:22px;border-radius:50%;object-fit:cover;flex:none;background:var(--card3)}.ba-who span{font-weight:700;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ba-who em{font-style:normal;font-size:9.5px;font-weight:900;color:#16130a;background:var(--violet2);padding:1px 5px;border-radius:4px}.ba-who em.bot{background:var(--card3);color:var(--mute)}
.ba-pl.is-me .ba-who{box-shadow:inset 0 0 0 1.5px var(--violet2)}
.ba-vs{position:absolute;inset:0;display:none;align-items:center;justify-content:center;gap:clamp(12px,4vw,60px);z-index:8;pointer-events:none;background:radial-gradient(rgba(0,0,0,.55),transparent 70%)}
.ba-vs.on{display:flex}.ba-vs b{font:900 clamp(64px,14vw,170px)/1 var(--disp);font-stretch:125%;font-style:italic;background:linear-gradient(100deg,#ffe7a3,#f2c14e 45%,#a99cff 55%,#8b7cf6);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 6px 0 rgba(0,0,0,.6)) drop-shadow(0 0 40px rgba(242,193,78,.5))}
.ba-vs b{flex:none}.ba-vs span{flex:1 1 0;min-width:0;font:900 clamp(14px,2.4vw,26px) var(--disp);text-shadow:0 2px 14px #000;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ba-vs .l{text-align:right}.ba-vs .r{text-align:left}.ba-vs .l{color:var(--gold);animation:baL .5s both}.ba-vs .r{color:var(--violet2);animation:baR .5s both}
.ba-vs .c{position:absolute;bottom:22%;color:var(--mute);font-size:14px}
@keyframes baL{from{transform:translateX(-60px);opacity:0}}@keyframes baR{from{transform:translateX(60px);opacity:0}}
.ba-band{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(92%,640px);padding:18px 20px 22px;border-radius:18px;background:rgba(8,8,10,.92);backdrop-filter:blur(8px);box-shadow:0 0 0 1px rgba(242,193,78,.35),0 30px 60px rgba(0,0,0,.6);z-index:7;display:none}
.ba-band.on{display:block;animation:baPop .35s cubic-bezier(.3,1.4,.5,1)}@keyframes baPop{from{transform:translate(-50%,-50%) scale(.85);opacity:0}}
.bb-h{text-align:center;margin-bottom:16px}.bb-h b{display:block;font:900 20px var(--disp);font-stretch:110%}.bb-h small{color:var(--mute)}
.bb-bar{position:relative;height:10px;border-radius:99px;background:linear-gradient(90deg,#1c1c1f,#2a2a2e);margin:56px 10px 34px}
.bb-zone{position:absolute;top:-6px;bottom:-6px;border-radius:8px;background:repeating-linear-gradient(-45deg,rgba(242,193,78,.45) 0 6px,rgba(242,193,78,.2) 6px 12px);box-shadow:0 0 0 1.5px var(--gold)}
.ba-band.tie .bb-zone{animation:baZone .6s ease-in-out 3}@keyframes baZone{50%{box-shadow:0 0 0 1.5px var(--gold),0 0 30px rgba(242,193,78,.8)}}
.bb-pin{position:absolute;bottom:14px;transform:translate(-50%,0);display:flex;flex-direction:column;align-items:center;opacity:.5}.bb-pin.in{opacity:1}
.bb-pin img{width:28px;aspect-ratio:.64;object-fit:contain;border-radius:3px;background:#000;box-shadow:0 0 0 1.5px var(--rc)}.bb-pin.up em{top:auto;bottom:calc(100% + 4px)}.bb-pin em{position:absolute;top:calc(100% + 22px);font-style:normal;font-size:10.5px;font-weight:800;white-space:nowrap}.bb-pin:after{content:"";width:2px;height:14px;background:var(--rc);margin-top:2px}
.bb-stamp{position:absolute;left:50%;top:50%;font:900 64px/1 var(--disp);color:var(--gold);border:5px solid var(--gold);border-radius:12px;padding:2px 16px;letter-spacing:.1em;text-shadow:0 0 20px rgba(242,193,78,.6);background:rgba(0,0,0,.6)}
.bb-face{display:flex;align-items:center;justify-content:center;gap:14px}.bb-vs{font:900 italic 22px var(--disp);color:var(--mute)}
.bb-c{display:flex;flex-direction:column;align-items:center;gap:4px;padding:10px;border-radius:14px;background:var(--card2);transition:opacity .4s,transform .4s,filter .4s;min-width:110px}
.bb-c img{width:70px;aspect-ratio:.64;object-fit:contain;border-radius:6px;box-shadow:0 0 0 2px var(--rc)}.bb-c b{font:900 18px var(--disp)}.bb-c small{color:var(--mute);font-size:11px}
.bb-c.lose{opacity:.35;transform:scale(.9);filter:grayscale(1)}.bb-c.glow{box-shadow:0 0 0 2px var(--gold),0 0 40px rgba(242,193,78,.55);transform:scale(1.08)}
.bb-split{display:flex;height:42px;border-radius:12px;overflow:hidden;margin-top:16px;background:var(--card2)}
.bb-split i{flex:0 0 0;display:flex;flex-direction:column;align-items:center;justify-content:center;font-style:normal;overflow:hidden;transition:flex-basis 1.1s cubic-bezier(.3,1,.4,1);white-space:nowrap}.bb-split i.go{flex-basis:var(--w)}
.bb-split .s0{background:linear-gradient(90deg,#d9a73a,#f2c14e);color:#16130a}.bb-split .s1{background:linear-gradient(90deg,#8b7cf6,#a99cff);color:#0d0a1f}.bb-split .s2{background:#3d9bff}.bb-split b{font:900 15px var(--disp)}.bb-split small{font-size:10.5px;font-weight:700}
.ba-banner{position:absolute;left:50%;top:44%;transform:translate(-50%,-50%);display:none;flex-direction:column;align-items:center;z-index:8;text-align:center;pointer-events:none;padding:18px 30px 20px;border-radius:18px;background:rgba(8,8,10,.9);backdrop-filter:blur(6px);box-shadow:0 0 0 1.5px rgba(242,193,78,.55),0 0 60px rgba(242,193,78,.25),0 30px 60px rgba(0,0,0,.6);max-width:92%;width:max-content}
.ba-banner.on{display:flex}.ba-banner.long b{font-size:clamp(20px,4.6vw,44px)}.ba-banner small{font:900 12px var(--body);letter-spacing:.3em;color:var(--gold)}.ba-banner b{font:900 clamp(30px,6vw,64px)/1.05 var(--disp);font-stretch:118%;text-shadow:0 4px 0 rgba(0,0,0,.6),0 0 40px rgba(242,193,78,.5)}
.ba-banner.me b{background:linear-gradient(100deg,#ffe7a3,#f2c14e);-webkit-background-clip:text;background-clip:text;color:transparent}
.ba-status{text-align:center;padding:0 16px 16px;min-height:44px;display:flex;flex-direction:column;align-items:center;gap:2px}.ba-status b{font:800 14px var(--disp);text-shadow:0 2px 10px #000}.ba-status span{color:var(--mute);font-size:12px}
.ba-fly{position:absolute;z-index:6;border-radius:8px;background:#0b0b0d;box-shadow:0 0 0 2px var(--rc),0 0 30px var(--rc);pointer-events:none}.ba-fly img{width:100%;height:100%;object-fit:contain}.ba-fly em{position:absolute;inset:auto 0 -26px;text-align:center;font:900 14px var(--disp);color:var(--green);font-style:normal}
.ba-usdc{position:absolute;left:50%;top:-4%;transform:translateX(-50%);white-space:nowrap;font:900 13px var(--disp);color:#062;background:var(--green);padding:4px 10px;border-radius:99px;box-shadow:0 0 20px rgba(61,220,132,.6);z-index:5}
.ba-bar{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;padding:14px 0}.ba-bar .lbtn{padding:11px 18px;font-size:14px}.ba-in{font-weight:800;color:var(--green);padding:10px}
.br-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;align-items:start}.br-grid .me-card{padding:16px}.br-grid h4{margin:0 0 8px;font:800 15px var(--disp)}.br-grid p{margin:0 0 10px;color:var(--mute)}
.br-w{padding:8px 10px;border-radius:10px;background:var(--card2);margin-bottom:6px}.br-w.me{box-shadow:inset 0 0 0 1.5px var(--violet2)}.br-w b{display:block}.br-w span{font-size:12.5px}.br-w small{display:block;color:var(--mute);font-size:11.5px}
.br-c{display:flex;align-items:center;gap:10px;padding:6px 0;border-bottom:1px solid var(--line)}.br-c img{width:30px;aspect-ratio:.64;object-fit:contain;border-radius:3px;box-shadow:0 0 0 1.5px var(--rc);background:#000}.br-c div{flex:1;min-width:0}.br-c b{display:block;font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.br-c small{color:var(--mute);font-size:11px}.br-c span{font:800 13px var(--disp)}.br-c.house{opacity:.6}
.br-d{display:flex;gap:8px;align-items:center;font-size:12.5px;padding:4px 0}.br-d span{flex:1}.br-d em{font-style:normal;font-size:10.5px;font-weight:800;text-transform:uppercase;color:var(--gold)}.br-d em.sent{color:var(--green)}.br-d em.failed{color:var(--rose)}.br-d a{color:var(--violet2)}

/* ---------- Graildex ---------- */
.dx-tape{overflow:hidden;border-radius:10px;background:#07070a;box-shadow:inset 0 0 0 1px var(--line);margin-bottom:12px;font:600 12px "JetBrains Mono",monospace;white-space:nowrap}
.dx-run{display:inline-flex;gap:26px;padding:8px 0;animation:dxRun 80s linear infinite}.dx-run span{color:var(--mute)}.dx-run b{color:var(--ink);font-weight:600}.dx-run em{font-style:normal;color:var(--gold)}.dx-run i{font-style:normal}.dx-run .up i{color:var(--green)}.dx-run .dn i{color:var(--rose)}
@keyframes dxRun{to{transform:translateX(-50%)}}
.dx-search{display:flex;gap:8px;margin-bottom:16px}.dx-search input{flex:1;min-width:0;background:var(--card);border:1px solid var(--line2);border-radius:11px;padding:12px 14px;color:var(--ink);font:inherit;font-size:14px}.dx-search input:focus{outline:none;border-color:var(--gold)}.dx-scan{cursor:pointer}
.dx-hint{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.dx-hint div{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:14px}.dx-hint b{display:block;font:800 15px var(--disp);color:var(--gold)}.dx-hint span{color:var(--mute);font-size:12.5px}
.dx-busy{display:flex;align-items:center;gap:12px;justify-content:center;padding:40px;color:var(--mute);font-weight:700}.dx-busy i{width:22px;height:22px;border-radius:50%;border:3px solid rgba(242,193,78,.2);border-top-color:var(--gold);animation:dxSp .8s linear infinite}@keyframes dxSp{to{transform:rotate(360deg)}}
.dx-read{padding:14px;margin-bottom:12px;display:flex;flex-direction:column;gap:2px;border-color:rgba(242,193,78,.35)}.dx-read b{font:800 16px var(--disp)}.dx-read small{color:var(--mute)}
.dx-res{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:8px;margin-bottom:18px}
.dx-r{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:12px;background:var(--card);box-shadow:inset 0 0 0 1px var(--line);text-align:left}.dx-r:hover{box-shadow:inset 0 0 0 1px rgba(242,193,78,.5)}
.dx-r img{width:38px;aspect-ratio:.64;object-fit:contain;border-radius:4px;background:#000}.dx-r div{flex:1;min-width:0}.dx-r b{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dx-r small{display:block;color:var(--mute);font-size:11px}.dx-r>span{font:900 15px var(--disp);text-align:right}.dx-r>span small{font:600 10.5px var(--body)}
.dx-mk{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:6px}.dx-m{text-align:left;padding:9px 11px;border-radius:10px;background:var(--card2)}.dx-m:hover{background:var(--card3)}.dx-m b{display:block;font-size:12.5px}.dx-m small{color:var(--mute);font-size:11px}
.dx-dos{display:flex;flex-direction:column;gap:12px}.dx-dos .me-card{padding:16px}.dx-dos h4{margin:0 0 10px;font:800 15px var(--disp)}
.dx-top{display:grid;grid-template-columns:minmax(0,260px) 1fr;gap:18px;align-items:start}
.dx-img img{width:100%;border-radius:12px;background:#000;box-shadow:0 0 0 1px var(--line2),0 20px 50px rgba(0,0,0,.5)}
.dx-id h3{margin:4px 0;font:900 clamp(22px,3vw,32px)/1.08 var(--disp);font-stretch:110%}.dx-id>small{color:var(--mute)}
.dx-call{display:flex;align-items:center;gap:14px;margin:16px 0;padding:14px 16px;border-radius:14px;background:linear-gradient(90deg,color-mix(in srgb,var(--cc) 16%,transparent),transparent);box-shadow:inset 0 0 0 1.5px var(--cc)}
.dx-call b{font:900 clamp(30px,5vw,46px)/1 var(--disp);font-stretch:118%;color:var(--cc);text-transform:uppercase;letter-spacing:.02em}.dx-call span{display:block;font-weight:700}.dx-call small{color:var(--mute);font-size:11.5px}
.dx-q{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.dx-q div{background:var(--card2);border-radius:10px;padding:9px 11px}.dx-q small{display:block;color:var(--mute);font-size:10.5px}.dx-q b{font:900 17px var(--disp)}.dx-q .dx-sb{all:unset;box-sizing:border-box;display:block;cursor:pointer;background:linear-gradient(180deg,#3a2e07,#241c04);border:1px solid #ffd84d;border-radius:10px;padding:9px 11px;color:#ffd84d}.dx-q .dx-sb:hover{background:#4a3a08}.dx-q .dx-sb small{color:#e8c95a}.dx-q .dx-sb:focus-visible{outline:2px solid #ffd84d;outline-offset:2px}.dx-q.sm{margin-top:10px}.dx-q.sm b{font-size:14px}
.dx-cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;align-items:start}
.dx-chart{width:100%;height:180px;display:block}.dx-axis{display:flex;justify-content:space-between;color:var(--dim);font:600 11px "JetBrains Mono",monospace;margin-top:4px}.dx-nochart{padding:30px;text-align:center;color:var(--mute)}
.dx-ch{display:flex;gap:6px;margin-top:10px}.dx-ch span{flex:1;text-align:center;background:var(--card2);border-radius:8px;padding:6px 0;font:800 13px var(--disp)}.dx-ch small{display:block;color:var(--mute);font:600 10px var(--body)}.dx-ch .up{color:var(--green)}.dx-ch .dn{color:var(--rose)}
.dx-f{display:flex;gap:10px;padding:8px 0;border-bottom:1px solid var(--line)}.dx-f i{font-style:normal;font-weight:900;width:16px;color:var(--mute)}.dx-f i.up{color:var(--green)}.dx-f i.dn{color:var(--rose)}.dx-f b{display:block;font-size:13px}.dx-f b em{font-style:normal;color:var(--gold);margin-left:4px}.dx-f small{color:var(--mute);font-size:11.5px}
.dx-lad{display:flex;justify-content:space-between;padding:6px 8px;border-radius:8px}.dx-lad.mine{background:rgba(242,193,78,.1);box-shadow:inset 0 0 0 1px rgba(242,193,78,.4)}.dx-lad b{font:800 13px var(--disp)}
.dx-sales{display:grid;gap:2px;max-height:360px;overflow:auto}.dx-sales div{display:grid;grid-template-columns:72px 1fr auto auto;gap:8px;align-items:center;font-size:12px;padding:5px 0;border-bottom:1px solid var(--line)}.dx-sales small{color:var(--dim);font-family:"JetBrains Mono",monospace;font-size:10.5px}.dx-sales span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--mute)}.dx-sales em{font-style:normal;font-size:10.5px;color:var(--violet2)}.dx-sales b{font:800 13px var(--disp)}
.dx-src{color:var(--dim);font-size:11px}.dx-src a{color:var(--violet2)}

/* ---------- phones ---------- */
/* tips under the stage, swipeable, from the moment a battle opens (2026-10-17) */
.ba-tips{display:none;margin:10px 0 0}.ba-tips.on{display:block}
.bt-tr{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;border-radius:14px;box-shadow:inset 0 0 0 1px rgba(242,193,78,.35);background:rgba(242,193,78,.05)}.bt-tr::-webkit-scrollbar{display:none}
.bt-tc{flex:0 0 100%;scroll-snap-align:start;padding:12px 16px;display:grid;gap:3px}
.bt-tc small{font:900 10.5px var(--body);letter-spacing:.24em;text-transform:uppercase;color:var(--gold)}.bt-tc b{font:800 14.5px/1.35 var(--body)}
.ba-tips i{display:flex;justify-content:center;gap:6px;margin-top:7px}.ba-tips em{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.22)}.ba-tips em.on{background:var(--gold)}
.ba-rules{margin-top:12px}.ba-rules .bt-rules{margin:0}
.br-proof{color:var(--gold);font-weight:800;text-decoration:underline;white-space:nowrap}
/* the winner's moment: winning slab in the middle, the slabs it won underneath, paid / won / P&L */
.ba-seats{transition:opacity .5s}.ba-seats.out{opacity:.12;filter:blur(2px)}
.ba-win{position:absolute;left:0;right:0;z-index:6;display:none;flex-direction:column;align-items:center;justify-content:safe center;overflow:hidden;gap:10px;padding:6px 12px;background:radial-gradient(ellipse at 50% 42%,rgba(242,193,78,.16),rgba(5,4,10,.55) 60%,transparent)}
.ba-win.on{display:flex}.ba-stage:has(.ba-win.on) .ba-status{visibility:hidden}
.bw-k{font:900 12px var(--body);letter-spacing:.3em;text-transform:uppercase;color:var(--gold)}
.bw-cols{display:flex;gap:clamp(14px,4vw,48px);justify-content:center;align-items:flex-start;max-width:100%}
.bw-col{display:flex;flex-direction:column;align-items:center;gap:8px;min-width:0}
.bw-s{display:block;aspect-ratio:.64;border-radius:8px;background:#0b0b0d;box-shadow:0 0 0 2px var(--rc),0 8px 20px rgba(0,0,0,.6)}.bw-s img{width:100%;height:100%;object-fit:contain;display:block;border-radius:inherit}
.bw-s.big{height:clamp(170px,36vh,340px);border-radius:12px;box-shadow:0 0 0 3px var(--rc),0 0 60px var(--rc),0 20px 50px rgba(0,0,0,.7)}
.bw-cols[data-n="2"] .bw-s.big,.bw-cols[data-n="3"] .bw-s.big{height:clamp(120px,26vh,250px)}
.bw-top{position:relative;display:flex;flex-direction:column;align-items:center;gap:6px}.bw-top b{font:900 clamp(22px,4vw,34px) var(--disp);color:var(--gold);text-shadow:0 0 24px rgba(242,193,78,.55)}.bw-top em{font-style:normal;font-size:11px;color:var(--green)}
.bw-who{font:800 15px var(--disp);display:flex;gap:6px;align-items:center}.bw-who em{font:900 10px var(--body);font-style:normal;background:var(--gold);color:#111;padding:2px 6px;border-radius:99px}
.bw-won{display:flex;flex-direction:column;align-items:center;gap:6px}.bw-won small{color:var(--mute);font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase}
.bw-won>div{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;max-width:min(92vw,620px)}.bw-won .bw-s{height:clamp(56px,11vh,108px)}
.bw-cols[data-many="1"] .bw-s.big{height:clamp(150px,28vh,300px)}.bw-cols[data-many="1"] .bw-won>div{flex-wrap:nowrap;gap:6px}.bw-cols[data-many="1"] .bw-won .bw-s{height:auto;width:min(64px,calc((92vw - 36px) / 7))}.bw-cols[data-n="2"] .bw-won>div{max-width:44vw}
.bw-cols[data-lots="1"]{width:100%}.bw-cols[data-lots="1"]>.bw-col{flex:1 1 0;max-width:min(100%,640px)}.bw-cols[data-lots="1"] .bw-s.big{height:clamp(110px,20vh,210px)}.bw-cols[data-lots="1"] .bw-won>div{flex-wrap:wrap;gap:4px;max-width:100%}.bw-cols[data-lots="1"] .bw-won .bw-s{width:clamp(28px,4vw,46px)}
.bw-usdc{font:900 13px var(--disp);color:#062;background:var(--green);padding:4px 10px;border-radius:99px;box-shadow:0 0 20px rgba(61,220,132,.5)}
.bw-pnl{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;font-size:12px;color:var(--mute);background:rgba(8,8,10,.75);padding:6px 14px;border-radius:99px;box-shadow:0 0 0 1px rgba(255,255,255,.08)}
.bw-pnl b{color:var(--ink)}.bw-pnl .up{color:var(--green);font-weight:900}.bw-pnl .dn{color:#ff5c7a;font-weight:900}
/* Graildex 2026-10-17: card grids on the landing + the "Scan" sheet (portfolio, pull reveal) */
.dx-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;margin-bottom:22px}
.dx-card{display:flex;flex-direction:column;gap:3px;padding:10px;border-radius:14px;background:var(--card);box-shadow:inset 0 0 0 1px var(--line);text-align:left;min-width:0;transition:transform .15s,box-shadow .15s}
.dx-card:hover{transform:translateY(-2px);box-shadow:inset 0 0 0 1px var(--rc),0 10px 30px -12px var(--rc)}
.dx-card i{display:block;aspect-ratio:.64;border-radius:8px;background:#0b0b0d;margin-bottom:6px;overflow:hidden;box-shadow:0 0 0 1.5px var(--rc)}.dx-card img{width:100%;height:100%;object-fit:contain;display:block}
.dx-card b{font:800 13px/1.2 var(--disp);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dx-card small{color:var(--mute);font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dx-card span{display:flex;justify-content:space-between;align-items:baseline;font:900 16px var(--disp);color:var(--gold)}.dx-card em{font:800 11px var(--body);font-style:normal}.dx-card em.up{color:var(--green)}.dx-card em.dn{color:var(--mute)}
.dx-in{display:flex;flex-direction:column;gap:2px;margin-bottom:18px}.dx-in span{color:var(--mute);font-size:12.5px}
.dx-scan input{display:none}
.scrim.dexsheet{z-index:330}.scrim.dexsheet .modal{max-width:440px}
.dxs{display:grid;gap:12px;text-align:left}
.dxs-top{display:flex;gap:12px;align-items:center}.dxs-top img{width:64px;aspect-ratio:.64;object-fit:contain;border-radius:6px;background:#000}.dxs-top b{display:block;font:900 17px/1.15 var(--disp)}.dxs-top small{color:var(--mute);font-size:12px}
.dxs-call{display:grid;gap:2px;padding:14px 16px;border-radius:14px;background:color-mix(in srgb,var(--cc) 12%,transparent);box-shadow:inset 0 0 0 1.5px var(--cc)}
.dxs-call small{font:900 10.5px var(--body);letter-spacing:.22em;text-transform:uppercase;color:var(--mute)}.dxs-call b{font:900 30px/1 var(--disp);color:var(--cc)}.dxs-call span{font-size:13px}.dxs-call em{font-style:normal;font-size:11px;color:var(--mute)}
.dxs-ex{margin:0;font-size:13.5px;line-height:1.45}.dxs-ex .up{color:var(--green)}.dxs-ex .dn{color:#ff5c7a}
.dxs-ch .dx-chart{height:90px}
.dxs-f{display:grid;gap:6px}.dxs-f div{display:flex;gap:8px;font-size:12.5px;align-items:baseline}.dxs-f i{font-style:normal;font-size:10px}.dxs-f i.up{color:var(--green)}.dxs-f i.dn{color:#ff5c7a}.dxs-f span{color:var(--mute)}.dxs-f b{color:var(--ink)}
.dxs-act{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:8px}
.dxs-more{font-size:12px;color:var(--gold);text-align:center}
.me-slab .im[data-dex]{cursor:pointer}
@media (max-width:900px){
  .dx{padding:0 12px} /* phone gutter, same as the page heading (PB 2026-10-17 video footage showed cards touching the edge) */
  .up-doors,.up-kit,.br-grid,.dx-cols{grid-template-columns:1fr}
  .dx-hint{grid-template-columns:1fr}
  .dx-top{grid-template-columns:1fr}.dx-img{max-width:220px;margin:0 auto}
  .dx-q{grid-template-columns:repeat(2,minmax(0,1fr))}
  .dx-search{flex-wrap:wrap}.dx-search input{flex-basis:100%}.dx-search .lbtn{flex:1}
}
@media (max-width:700px){
  .ba-stage{background-image:url(/img/battle/arena-tall.webp);background-position:center 40%;min-height:calc(100dvh - 150px);border-radius:16px}
  .ba-hud{flex-wrap:wrap;padding:12px}.ba-title{order:3;flex-basis:100%;text-align:left}.ba-pot{margin-left:auto}
  .ba-seats,.ba-seats[data-n="4"],.ba-seats[data-n="8"]{--sw:min(40vw,calc((100dvh - 470px) / 2 * .64));grid-template-columns:repeat(2,var(--sw));padding:8px 14px 12px;column-gap:clamp(18px,8vw,40px);row-gap:10px}
  .ba-seats[data-n="2"]{--sw:min(40vw,calc((100dvh - 400px) * .64));column-gap:clamp(36px,12vw,70px)}
  .ba-seats[data-n="8"]{--sw:min(21vw,calc((100dvh - 470px) / 2 * .64));grid-template-columns:repeat(4,var(--sw));column-gap:8px;row-gap:10px}
  .ba-pl{gap:4px}.ba-val{min-height:28px}
  .ba-seats[data-g]{--sw:max(44px,min(calc((92vw - 28px - (var(--cm) - 1) * 8px) / var(--cm)),calc(((100dvh - 470px) / var(--rm) - 40px) * .64)));grid-template-columns:repeat(var(--cm),var(--sw));column-gap:8px;row-gap:8px}
  .ba-seats[data-n="8"] .ba-who span{display:none}.ba-seats[data-n="8"] .ba-who{padding:3px}.ba-seats[data-n="8"] .ba-val small{display:none}
  .bb-c{min-width:0;padding:8px}.bb-c img{width:54px}
  .bt-sum .lbtn{margin-left:0;flex-basis:100%}
  .dx-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.dx-scan span{display:none}
}
@media (prefers-reduced-motion:reduce){.ba *,.dx-run{animation:none!important;transition:none!important}}
.dx-dos .me-card,.br-grid .me-card,.bt-rules,.dx-read{display:block}.dx-read b,.dx-read small{display:block}
.up-box{align-items:stretch;flex-wrap:nowrap}.up-box>*{min-width:0}.up-rolls small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* battle room (PB 2026-10-18): chat column on the right like a break (under the stage on phones), players' streams on top of
   it, emoji reactions over the stage; the tips are a big gold card over the plinths while seats fill */
.ba{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:14px;align-items:start}
.ba-main{min-width:0}
.ba-side{position:sticky;top:72px;height:min(78vh,720px);display:flex;flex-direction:column;min-height:0;border-radius:16px;background:var(--card);box-shadow:inset 0 0 0 1px var(--line);overflow:hidden}
.ba-side .ch-l{flex:1;height:auto;min-height:0;overflow:auto;padding:8px 10px;display:flex;flex-direction:column;gap:6px}
.ba-side .ch-h{display:flex;justify-content:space-between;align-items:center;padding:10px 12px;border-bottom:1px solid var(--line);font-size:13px}
.ba-side .ch-f{min-height:52px;align-items:center;padding:8px;border-top:1px solid var(--line);display:flex}
.ba-side .ch-mod{display:none;position:absolute;right:0;top:-2px}.ba-side .cm:hover .ch-mod,.ba-side .cm:focus-within .ch-mod{display:flex}
.ba-pip{position:relative;flex:none;width:100%;aspect-ratio:16/9;overflow:hidden;background:#000;border-bottom:1px solid var(--line)}
.ba-pip .pipi{position:absolute;left:0;top:0;width:480px;height:270px;transform:scale(var(--pips,.6875));transform-origin:0 0}.ba-pip .pipi iframe{width:480px;height:270px;border:0;display:block}
.ba-pip .lv{position:absolute;left:8px;top:8px;z-index:2;padding:2px 8px;border-radius:999px;background:var(--rose);color:#fff;font:800 10px/1.5 var(--body);letter-spacing:.04em;pointer-events:none;max-width:calc(100% - 16px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ba-pipo{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:14px;text-align:center;background:radial-gradient(circle at 50% 40%,rgba(242,193,78,.16),transparent 70%)}
.ba-strs{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;padding:8px 10px;border-bottom:1px solid var(--line)}.ba-strs[hidden]{display:none}
.ba-strs button{flex:none;border:0;border-radius:999px;padding:5px 10px;background:var(--card2);color:var(--mute);font:700 12px var(--body);cursor:pointer}.ba-strs button.on{background:var(--rose);color:#fff}
.ba-rfx{position:absolute;inset:0;pointer-events:none;z-index:7;overflow:hidden}
.ba-rfx span{position:absolute;bottom:6%;animation:react 2.6s ease-out forwards;filter:drop-shadow(0 4px 8px rgba(0,0,0,.5))}
.ba-react{display:flex;gap:6px;justify-content:center;flex-wrap:wrap;margin-top:10px}
.ba-react button{width:42px;height:42px;border:0;border-radius:12px;background:var(--card);box-shadow:inset 0 0 0 1px var(--line);font-size:21px;cursor:pointer;transition:transform .08s}.ba-react button:active{transform:scale(.88)}
.ba-stage .ba-tips{position:absolute;z-index:4;left:50%;top:54%;transform:translate(-50%,-50%);width:min(640px,86%);margin:0;display:block;opacity:0;visibility:hidden;transition:opacity .35s,visibility .35s}
.ba-stage .ba-tips.on{opacity:1;visibility:visible}.ba-stage .ba-tips.hush{opacity:0;visibility:hidden}
.ba-stage .bt-tr{border-radius:18px;background:linear-gradient(160deg,rgba(26,20,6,.9),rgba(8,6,12,.9));box-shadow:inset 0 0 0 1.5px rgba(242,193,78,.75),0 0 40px rgba(242,193,78,.25),0 18px 50px rgba(0,0,0,.6);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.ba-stage .bt-tc{padding:24px 28px 22px;gap:8px;text-align:center;min-height:132px;align-content:center}
.ba-stage .bt-tc small{font-size:12.5px;letter-spacing:.3em}
.ba-stage .bt-tc b{font:800 clamp(18px,2.3vw,24px)/1.3 var(--disp)}
.ba-stage .ba-tips i{margin-top:10px}.ba-stage .ba-tips em{width:7px;height:7px}
@media (max-width:1000px){
  .ba{display:flex;flex-direction:column;align-items:stretch;gap:0;min-width:0;width:100%} /* desktop grid sets align-items:start; in this column it shrank the stage to its content, off-centre (HQ #5682) */
  .ba>*,.ba-main>*{min-width:0;max-width:100%}
  .ba-main{display:contents}
  .ba-stage{order:1}.ba-react{order:2}.ba-bar{order:3}.ba-side{order:4}.ba-result{order:5}.ba-rules{order:6}
  .ba-side{position:static;height:auto;margin:4px 0 14px;align-self:stretch;width:100%}
  .ba-side .ch-l{height:260px;flex:none}
  .ba-react{flex-wrap:nowrap;overflow-x:auto;justify-content:flex-start;scrollbar-width:none}.ba-react button{flex:none}
}
@media (max-width:700px){
  .ba-stage .ba-tips{width:90%;top:56%}
  .ba-stage .bt-tc{padding:18px 18px 16px;min-height:112px}
  .ba-stage .bt-tc b{font-size:17px}
}

/* Graildex feeds (PB 2026-10-18): sales rows link out, population bars, the web-research panel */
.dx-sales a{display:grid;grid-template-columns:72px 1fr auto auto;gap:8px;align-items:center;font-size:12px;padding:5px 0;border-bottom:1px solid var(--line);color:inherit;text-decoration:none}.dx-sales a:hover span{color:var(--ink)}
.dx-ladw{max-height:300px;overflow:auto;margin-bottom:10px;padding-bottom:2px}.dx-lad small{color:var(--dim);font-size:10.5px;margin-left:4px}.dx-lad a{color:inherit;text-decoration:none}
.dx-pop{display:block;font-size:12.5px;color:var(--mute);margin:2px 0}.dx-pop b{color:var(--ink)}
.dx-popbars{display:flex;align-items:flex-end;gap:4px;height:90px;margin:10px 0 4px}.dx-popbars div{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%;min-width:0}.dx-popbars i{display:block;width:100%;border-radius:4px 4px 0 0;background:rgba(242,193,78,.28)}.dx-popbars .mine i{background:var(--gold)}.dx-popbars small{font-size:10px;color:var(--dim);margin-top:3px}
.dx-rs{display:flex;gap:12px;align-items:flex-start;padding:12px 14px;border-radius:12px;background:rgba(163,120,255,.08);box-shadow:inset 0 0 0 1px rgba(163,120,255,.25);margin:8px 0}.dx-rs b{display:block;font-size:13px}.dx-rs small{color:var(--mute);font-size:11.5px}.dx-rs.busy i{flex:none;width:18px;height:18px;margin-top:2px;border-radius:50%;border:3px solid rgba(163,120,255,.2);border-top-color:var(--violet2);animation:dxSp .8s linear infinite}
.dx-ai{font-style:normal;font-size:10px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--violet2);margin-left:6px;padding:2px 6px;border-radius:6px;background:rgba(163,120,255,.12)}
/* what's in this pack (PB 2026-10-20): the battle's machine at a glance, on the battle page while it fills and in the builder */
.bpk{display:flex;flex-direction:column;gap:12px;padding:14px;border-radius:16px;background:var(--card);box-shadow:inset 0 0 0 1px var(--line);min-width:0}
.bt-opener .bpk{background:rgba(0,0,0,.22)}
.ba-packv{margin:2px 0 14px}.ba-packv[hidden],.bt-pack[hidden]{display:none}
.bpk-best{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:10px;align-items:stretch}
.bpk-top{display:flex;gap:12px;align-items:center;min-width:0;padding:10px;border-radius:12px;background:linear-gradient(135deg,rgba(242,193,78,.12),rgba(242,193,78,.02));box-shadow:inset 0 0 0 1px rgba(242,193,78,.35)}
.bpk-top img{flex:none;width:68px;height:102px;object-fit:contain;border-radius:6px;background:var(--card3)}
.bpk-tx{display:flex;flex-direction:column;gap:3px;min-width:0}
.bpk-tx small{font:700 10.5px/1 var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--gold)}
.bpk-nm{font:700 14px/1.25 var(--body);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}
.bpk-gr{align-self:flex-start;font-size:11px;font-weight:700;color:var(--mute);background:var(--card2);padding:2px 7px;border-radius:6px}
.bpk-v{font:900 22px/1.1 var(--disp);color:var(--gold);font-variant-numeric:tabular-nums}
.bpk-more{display:flex;flex-direction:column;gap:8px;min-width:0}
.bpk-c{flex:1;display:flex;gap:10px;align-items:center;min-width:0;padding:8px;border-radius:12px;background:var(--card2);box-shadow:inset 0 0 0 1px var(--line)}
.bpk-c img{flex:none;width:30px;height:45px;object-fit:contain;border-radius:4px;background:var(--card3)}
.bpk-c div{display:flex;flex-direction:column;gap:2px;min-width:0}
.bpk-c span{font-size:12px;line-height:1.25;color:var(--mute);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bpk-c b{font:800 14px/1.1 var(--disp);font-variant-numeric:tabular-nums}
.bpk-top.r-epic{box-shadow:inset 0 0 0 1px rgba(242,193,78,.35),0 0 0 1px rgba(179,92,255,.35)}
.bpk-typ{margin:0;font-size:13.5px;color:var(--mute)}.bpk-typ b{color:var(--ink);font-weight:800}.bpk-typ span{color:var(--dim)}
.bpk-odds{display:flex;flex-direction:column;gap:7px}
.bpk-bar{display:flex;gap:2px;height:6px;border-radius:99px;overflow:hidden;background:var(--card3)}
.bpk-bar i{min-width:4px}
.bpk-bar .r-epic,.bpk-lg .r-epic em{background:#b35cff}.bpk-bar .r-rare,.bpk-lg .r-rare em{background:#3d9bff}.bpk-bar .r-uncommon,.bpk-lg .r-uncommon em{background:#3ee08a}.bpk-bar .r-common,.bpk-lg .r-common em{background:#5d5d64}
.bpk-lg{display:flex;flex-wrap:wrap;gap:4px 12px;font-size:11.5px;color:var(--mute)}.bpk-lg span{display:inline-flex;align-items:center;gap:5px;white-space:nowrap}.bpk-lg em{width:7px;height:7px;border-radius:50%}
@media (max-width:1000px){.ba-packv{order:3}}
@media (max-width:700px){
  .bpk{padding:12px;gap:10px}
  .bpk-best{grid-template-columns:minmax(0,1fr)}
  .bpk-more{flex-direction:row}.bpk-c{flex:1 1 0}
  .bpk-top img{width:58px;height:87px}.bpk-v{font-size:20px}
}

/* lobby: battles filling and ripping, above the breaks (Bling 2026-10-21); phones keep the page gutter like the section heads */
.lbat .bt-grid{margin-bottom:6px}
@media (max-width:900px){.lbat .bt-grid{padding:0 12px}}
.bt-earn b{color:var(--green)}
/* battle call-outs (PB 2026-10-21): the opener names who they want to battle */
.bt-co{display:grid;gap:6px;margin:12px 0 4px}.bt-co .kick em{font-style:normal;color:var(--mute);text-transform:none;letter-spacing:0;font-weight:500}
.bt-cof{display:flex;flex-wrap:wrap;gap:6px;align-items:center;background:var(--card2);border:1px solid var(--line2);border-radius:12px;padding:6px}.bt-cof:focus-within{border-color:var(--gold)}
.bt-cof input{flex:1 1 120px;min-width:0;background:none;border:0;color:var(--ink);font:inherit;font-size:16px;padding:8px 6px;outline:none}
.bt-cochip{display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:3px 10px 3px 3px;border-radius:999px;border:1px solid var(--gold);background:rgba(242,193,78,.12);color:var(--ink);font:inherit;font-weight:600;font-size:14px;cursor:pointer}
.bt-cochip img{width:28px;height:28px;border-radius:50%;object-fit:cover}.bt-cochip i{font-style:normal;color:var(--mute);font-size:12px}
.bt-cor{display:grid;gap:4px}.bt-cor:empty{display:none}.bt-cor .muted{margin:4px 2px;font-size:13px}
.bt-cor button{display:grid;grid-template-columns:36px 1fr;grid-template-rows:auto auto;column-gap:10px;align-items:center;text-align:left;min-height:48px;padding:6px 10px;border-radius:10px;border:1px solid var(--line2);background:var(--card2);color:var(--ink);font:inherit;cursor:pointer}
.bt-cor button:hover,.bt-cor button:focus-visible{border-color:var(--gold)}
.bt-cor img{grid-row:1/3;width:36px;height:36px;border-radius:50%;object-fit:cover}.bt-cor b{font-size:14px}.bt-cor small{color:var(--mute);font-size:12px}
.bt-co>small{color:var(--mute);font-size:12px;line-height:1.4}
.bt-cot{display:block;color:var(--gold)!important;font-weight:600}

/* Big Dawg on the gacha page (PB/Bling 2026-10-21) */
.bigdawg .bd{display:grid;gap:12px}
.bigdawg .bd p{margin:0}
.bd-pick{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.bd-pick select{min-width:0;flex:1 1 220px;padding:10px 12px;border-radius:10px;background:var(--panel,rgba(255,255,255,.04));color:var(--ink);border:1px solid var(--line2,rgba(255,255,255,.12));font:600 14px var(--body)}
.bd-q{margin:0}
.bd-rip{justify-self:start}
.bd-ask{display:grid;gap:10px;padding:12px;border-radius:12px;border:1px solid rgba(242,193,78,.4);background:rgba(242,193,78,.06)}
.bd-ask div{display:flex;gap:8px;flex-wrap:wrap}
.bd-prog{display:grid;gap:8px}
.bd-bar{height:8px;border-radius:999px;background:rgba(255,255,255,.08);overflow:hidden}
.bd-bar i{display:block;height:100%;background:var(--gold);border-radius:999px;transition:width .4s ease}
.bd-done b{color:var(--gold)}
.bd-err{color:var(--rose,#ff4d6d);font-size:13px}
.bd-sell{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.bd-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:8px;max-height:520px;overflow:auto}
.bd-c{position:relative;display:grid;gap:2px;padding:6px;border-radius:10px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);min-width:0}
.bd-c img{width:100%;aspect-ratio:3/5;object-fit:contain}
.bd-c b{font:800 13px var(--disp)}
.bd-c small{font-size:11px;color:var(--mute);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bd-c.r-epic{border-color:rgba(179,92,255,.6)}.bd-c.r-rare{border-color:rgba(61,155,255,.6)}
.bd-c.sold{opacity:.45}.bd-c em{position:absolute;top:8px;left:8px;font:700 10px var(--body);font-style:normal;background:var(--green,#3ddc84);color:#06130b;padding:1px 6px;border-radius:999px}
@media (prefers-reduced-motion:reduce){.bd-bar i{transition:none}}
@media (max-width:900px){.bigdawg .bd{margin:0 12px}}

/* Agents (PB 2026-10-21) */
.ag{display:grid;gap:14px}
.ag-ask{display:grid;gap:10px}.ag-ask h3{margin:0;font:800 20px/1.2 var(--disp)}
.ag-can{margin:0;padding-left:18px;display:grid;gap:6px;line-height:1.45}
.ag-rows{display:grid;gap:8px}
.ag-chasing{color:var(--gold)!important;margin-top:2px}
.ag-chase{flex:1 1 100%;display:grid;gap:10px;border-top:1px solid var(--line2);padding-top:10px}.ag-chase[hidden]{display:none}
.ag-chase label{display:grid;gap:4px;font-size:12px;color:var(--mute)}.ag-chase small{color:var(--mute);line-height:1.4}
.ag-chase input:not([type=checkbox]){min-width:0;background:var(--card2);border:1px solid var(--line2);color:var(--ink);border-radius:9px;padding:9px 10px;font:inherit;font-size:14px}.ag-chase input:focus{outline:none;border-color:var(--gold)}
.ag-chase-n,.ag-row .ag-chase-n{display:grid;grid-template-columns:1fr 1fr;gap:8px;flex:none}
.ag-chase-l,.ag-row .ag-chase-l{display:flex;flex-wrap:wrap;gap:6px;flex:none}.ag-chase-l .chip{display:inline-flex;cursor:pointer;color:var(--ink);font:700 12px/1 var(--body);padding:7px 11px;border-radius:999px;background:var(--card3);border:1px solid var(--line2)}.ag-chase-l .chip.on{border-color:var(--gold);color:var(--gold)}.ag-chase-l input{display:none}
.ag-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.ag-row div{flex:1 1 160px;min-width:0;display:grid}.ag-row small{color:var(--mute)}
@media (max-width:900px){.ag{padding:0 12px}}
.ag-guide{display:grid;gap:12px}
.ag-two{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px}
.ag-steps{margin:8px 0 0;padding-left:20px;display:grid;gap:8px;line-height:1.5}
.ag-dev summary{cursor:pointer}.ag-dev code{font-size:12.5px;background:rgba(255,255,255,.06);padding:1px 5px;border-radius:5px;word-break:break-word}
.bd-run{display:grid;gap:10px}
.bd-c{will-change:transform}
.bd-c.bd-new{animation:bdIn .35s ease both}
@keyframes bdIn{from{opacity:0;transform:scale(.85)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.bd-c.bd-new{animation:none}}

/* Big Dawg reveal (Bling 2026-10-21): rarest last, louder each tier */
.bd{position:relative;overflow:hidden}
.bd-c.bd-t1{box-shadow:0 0 0 1px rgba(62,224,138,.55),0 0 18px -4px rgba(62,224,138,.6)}
.bd-c.bd-t2{box-shadow:0 0 0 1px rgba(61,155,255,.7),0 0 26px -2px rgba(61,155,255,.7)}
.bd-c.bd-t3{box-shadow:0 0 0 2px rgba(179,92,255,.9),0 0 38px 2px rgba(179,92,255,.75)}
.bd-c.bd-new.bd-t2,.bd-c.bd-new.bd-t3{animation:bdBig .6s cubic-bezier(.2,1.4,.4,1) both}
@keyframes bdBig{from{opacity:0;transform:scale(.4) rotate(-6deg)}to{opacity:1;transform:none}}
.bd-fan{position:absolute;left:50%;top:42%;transform:translate(-50%,-50%);z-index:3;display:grid;justify-items:center;gap:2px;padding:14px 22px;border-radius:16px;pointer-events:none;text-align:center;animation:bdFan .9s ease both;background:rgba(10,10,12,.86);backdrop-filter:blur(6px)}
.bd-fan span{font:900 13px var(--disp);letter-spacing:.14em;text-transform:uppercase}
.bd-fan b{font:900 30px var(--disp)}.bd-fan small{max-width:220px;color:var(--mute);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bd-fan-1{border:1px solid rgba(62,224,138,.6)}.bd-fan-1 span{color:#3ee08a}
.bd-fan-2{border:1px solid rgba(61,155,255,.7);box-shadow:0 0 40px rgba(61,155,255,.45)}.bd-fan-2 span{color:#3d9bff}
.bd-fan-3,.bd-fan-4{border:2px solid rgba(179,92,255,.9);box-shadow:0 0 70px rgba(179,92,255,.65)}.bd-fan-3 span,.bd-fan-4 span{color:#c98bff}.bd-fan-3 b,.bd-fan-4 b{color:var(--gold);font-size:40px}
@keyframes bdFan{0%{opacity:0;transform:translate(-50%,-50%) scale(.6)}15%{opacity:1;transform:translate(-50%,-50%) scale(1.05)}80%{opacity:1;transform:translate(-50%,-50%) scale(1)}100%{opacity:0;transform:translate(-50%,-50%) scale(.96)}}
.bd.bd-shake{animation:bdShake .45s ease}
@keyframes bdShake{0%,100%{transform:none}20%{transform:translateX(-5px)}40%{transform:translateX(5px)}60%{transform:translateX(-3px)}80%{transform:translateX(3px)}}
.bd-skip{justify-self:start}
@media (prefers-reduced-motion:reduce){.bd-c.bd-new.bd-t2,.bd-c.bd-new.bd-t3,.bd.bd-shake{animation:none}}
.bd-sure{display:grid;gap:10px;padding:12px;border-radius:12px;border:1px solid rgba(255,77,109,.45);background:rgba(255,77,109,.06);flex-basis:100%}
.bd-sure p{margin:0;line-height:1.45}.bd-sure div{display:flex;gap:8px;flex-wrap:wrap}
.ag-code{margin:8px 0;padding:10px 12px;border-radius:10px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);font-size:12.5px;line-height:1.5;overflow-x:auto;white-space:pre}
.ag-earn{font-style:normal;color:var(--gold,#f5c542)}.ag-earncard{border-color:var(--gold,#f5c542);margin-bottom:12px}
.ag>*,.ag-guide>*,.ag-two>*{min-width:0}.ag-two{grid-template-columns:repeat(auto-fit,minmax(min(260px,100%),1fr))}.ag-guide code{word-break:break-word}

/* agent profiles + the Agents tab hub (PB 2026-10-21) */
.ag-hubw{display:grid;gap:12px}.ag-soon h3{margin:4px 0 6px;font:800 19px/1.25 var(--disp)}
.ag-av{width:44px;height:44px;border-radius:50%;object-fit:cover;background:var(--card3);flex:none}.ag-av.lg{width:76px;height:76px}.ag-av.xl{width:104px;height:104px;border:2px solid var(--gold)}
.ag-hub-id{display:flex;gap:14px;align-items:flex-start}.ag-hub-id>div{flex:1;min-width:0;display:grid;gap:4px}.ag-name{font:800 20px/1.2 var(--disp)}.ag-hub-id small{color:var(--mute)}
.ag-av-pick{position:relative;cursor:pointer;display:grid;justify-items:center;gap:4px;flex:none}.ag-av-pick span{font-size:11px;color:var(--gold)}
.ag-bio{margin:2px 0;line-height:1.45}
.ag-prof,.ag-caps{display:grid;grid-template-columns:1fr 1fr auto;gap:8px;align-items:end;margin-top:12px}.ag-prof label,.ag-caps label{display:grid;gap:4px;font-size:12px;color:var(--mute);min-width:0}
.ag-prof input,.ag-caps input{min-width:0;background:var(--card2);border:1px solid var(--line2);color:var(--ink);border-radius:9px;padding:9px 10px;font:inherit;font-size:14px}
.ag-hubw .ag-chase{border-top:0;padding-top:4px}
.ag-page{display:grid;gap:12px}.ag-hero{display:flex;gap:16px;align-items:center}.ag-hero>div{display:grid;gap:5px;min-width:0}.ag-hero h2{margin:0;font:800 26px/1.1 var(--disp)}
.ag-badge{justify-self:start;font:700 11px/1 var(--body);padding:5px 9px;border-radius:999px;background:rgba(242,193,78,.14);color:var(--gold)}
.ag-owner{display:inline-flex;align-items:center;gap:6px;color:var(--mute);font-size:13px}.ag-owner img{width:20px;height:20px;border-radius:50%;object-fit:cover}
.ag-pulls{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:10px}.ag-pull{display:grid;gap:4px}.ag-pull img{width:100%;border-radius:10px;height:auto}.ag-pull b{font-size:12px;line-height:1.3}.ag-pull small{color:var(--mute)}.ag-pull.hit img{outline:2px solid var(--gold)}
.ag-rowl{display:grid;gap:8px}.ag-mini{display:flex;gap:10px;align-items:center;color:inherit;text-decoration:none}.ag-mini img{width:44px;height:44px;border-radius:50%;object-fit:cover}.ag-mini div{display:grid}.ag-mini small{color:var(--mute)}
@media (max-width:520px){.ag-prof,.ag-caps{grid-template-columns:1fr 1fr}.ag-prof button,.ag-caps button{grid-column:1/-1}.ag-hero{flex-direction:column;text-align:center}.ag-hero>div{justify-items:center}.ag-badge{justify-self:center}}
.ag-page .me-kpis{grid-template-columns:repeat(3,minmax(0,1fr))}

/* one-tap hosted agents (PB 2026-10-21) */
.ag-new h3{margin:4px 0 6px;font:800 19px/1.25 var(--disp)}.ag-new form{display:grid;gap:10px;margin-top:10px}.ag-new form>label{display:grid;gap:4px;font-size:12px;color:var(--mute)}
.ag-new input:not([type=radio]){min-width:0;background:var(--card2);border:1px solid var(--line2);color:var(--ink);border-radius:9px;padding:10px;font:inherit;font-size:15px}
.ag-q{font-size:12px;color:var(--mute);font-weight:600;margin-bottom:-4px}
.ag-seg{display:grid;grid-template-columns:repeat(auto-fit,minmax(92px,1fr));gap:6px}.ag-seg .chip{display:grid;gap:2px;cursor:pointer;padding:10px;border-radius:12px;background:var(--card3);border:1px solid var(--line2);font:800 14px/1.1 var(--body);color:var(--ink);text-align:center}.ag-seg .chip small{font:500 11px/1.2 var(--body);color:var(--mute)}.ag-seg .chip.on{border-color:var(--gold);color:var(--gold)}.ag-seg input{display:none}
.ag-new .ag-chase-n label{display:grid;gap:4px;font-size:12px;color:var(--mute)}.ag-byo{margin:12px 0 0}.ag-byo a{color:var(--gold)}
.ag-log{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:7px}.ag-log li{display:grid;grid-template-columns:62px 1fr;gap:8px;font-size:13px;line-height:1.4}.ag-log time{color:var(--mute);font-size:12px}
.ag-seg .chip{height:auto;min-height:48px;align-content:center;white-space:normal}