.battle-page{background:#090b13;color:#f7f8ff}.battle-page main{min-height:78vh}#battle-app{max-width:1640px;margin:auto;padding:22px 30px 45px;font-size:16px}#battle-app button,#cb-dialog button,#battle-app select,#cb-dialog select,#cb-dialog input{font:inherit;border:1px solid #303548;border-radius:7px;padding:12px 18px;color:#f7f8ff;background:#181d2b;cursor:pointer;transition:background .15s,border-color .15s}#battle-app button:hover,#cb-dialog button:hover{border-color:#a691f6;background:#252b3e}#battle-app .selected{background:#2c2445;border-color:#8a6ce2}.cb-avatar{width:40px;height:40px;border:1px solid #626582;border-radius:50%;object-fit:cover;flex-shrink:0;background:#151b2c}.cb-vacant{display:grid;place-items:center;border-style:dashed;color:#979db8;font-size:25px}.cb-seat-icon{position:relative}.cb-seat-icon small{position:absolute;bottom:-6px;left:6px;background:#7260b9;border-radius:3px;font-size:8px;padding:2px}.cb-empty{display:flex;flex-direction:column;justify-content:center;align-items:center;min-height:440px;text-align:center;border:1px dashed #34384c;border-radius:12px;background:radial-gradient(ellipse at center,#25213b55,transparent 65%);color:#aab2c5}.cb-empty h2{color:#fff;font-size:28px;margin-bottom:2px}.cb-weapon{display:grid;place-items:center;min-width:0;width:100%;height:170px}.cb-weapon img{width:90%;height:90%;object-fit:contain;filter:drop-shadow(0 12px 12px #000b)}.cb-image-missing{color:#bcc5db;text-align:center;max-width:190px;font-size:15px;line-height:1.5;padding:15px}#cb-notice:not(:empty){position:sticky;top:75px;z-index:90;background:#3d2437;border:1px solid #bc648f;color:#fff;padding:15px;border-radius:8px;margin-bottom:15px}#cb-dialog{width:min(1050px,94vw);max-height:90vh;overflow:auto;border:1px solid #48405e;background:#101420;color:#fff;border-radius:13px;padding:25px;font:16px Inter,system-ui,sans-serif;box-shadow:0 30px 120px #000b}#cb-dialog::backdrop{background:#04070cba;backdrop-filter:blur(5px)}button:disabled{opacity:.4;cursor:not-allowed!important}.cb-busy button{pointer-events:none;opacity:.6}#battle-app :focus-visible,#cb-dialog :focus-visible{outline:2px solid #bda7ff;outline-offset:3px}@keyframes cb-roll{from{transform:translateX(0)}to{transform:translateX(-690px)}}@keyframes cb-roll-y{from{transform:translateY(0)}to{transform:translateY(-450px)}}@media(max-width:800px){#battle-app{padding:16px 12px}.cb-avatar{width:32px;height:32px}}
/* Design revision 3 — shared case artwork, compact room rows, contained reels. */
#battle-app{max-width:1600px;padding:26px 32px 48px;font-family:Inter,ui-sans-serif,system-ui,sans-serif}
/* Case art is the same markup and layered CSS as the Cases page. */
.cb-case-art.cc-card{display:block;position:relative;width:100%;height:112px;min-width:0;flex-shrink:0;border:0!important;border-radius:0;overflow:visible;background:transparent!important;box-shadow:none!important;transform:none!important;transition:filter .25s}
.cb-case-art .cc-art{display:block;position:relative;width:100%;height:100%;overflow:hidden;background:radial-gradient(ellipse at 50% 65%,color-mix(in srgb,var(--accent) 10%,transparent),transparent 70%)}
.cb-case-art .cc-art>img.cc-crate{position:absolute;width:90%;height:87%;inset:13% 5% 0;max-width:none;object-fit:contain;mix-blend-mode:screen}
.cb-case-art .cc-subject-wrap{width:97%;left:1.5%;top:3%;height:67%}
.cb-case-art .cc-subject{width:100%;height:100%;max-width:none;object-fit:contain;display:block}
.cb-case-art .cc-view,.cb-case-art .cc-label,.cb-case-art .cc-pill,.cb-case-art .cc-stamp{display:none!important}
.cb-case-art .cc-skin{opacity:1;transform:rotate(-11deg);top:2%;right:1%;height:67%;width:97%}
.cb-case-art:hover{filter:brightness(1.1)}
#battle-app .cb-weapon{display:block;position:relative;width:100%;height:170px;min-width:0;min-height:0;overflow:hidden}
#battle-app .cb-weapon img{display:block;position:absolute;inset:8%;width:84%;height:84%;max-width:84%;max-height:84%;object-fit:contain;object-position:center;filter:drop-shadow(0 9px 8px #0008)}.cb-image-missing{display:flex;align-items:center;justify-content:center;height:100%;margin:auto}
@media(max-width:800px){#battle-app{padding:20px 14px 35px}.cb-case-art.cc-card{height:105px}.case-game-tabs{gap:30px}}
.cb-start-countdown{position:absolute;z-index:8;left:50%;top:53%;transform:translate(-50%,-50%);display:grid;place-items:center;width:76px;height:76px;border-radius:50%;background:#101624f5;border:1px solid #ae96eaaa;box-shadow:0 0 0 7px #0b10206b,0 10px 40px #0008;color:#fff;font-size:38px;font-weight:700;font-variant-numeric:tabular-nums;pointer-events:none}
.cb-start-countdown[hidden]{display:none}
@media(max-width:800px){.cb-start-countdown{width:54px;height:54px;font-size:28px}}
/* Studio lobby + Lineup workspace */.cs-art-link{display:flex;align-items:center;position:relative;height:225px;padding:4px 9px;isolation:isolate;background:radial-gradient(ellipse at 40% 60%,color-mix(in srgb,var(--cs-accent) 13%,transparent),transparent 68%)}.cl-catalog-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.cl-case{display:grid;grid-template-columns:92px minmax(0,1fr);grid-template-rows:1fr auto;column-gap:9px;position:relative;padding:9px;border:1px solid #2e3b52;border-radius:7px;background:linear-gradient(135deg,#172132,#101825);min-height:121px;transition:border-color .2s,background .2s}.cl-case.chosen{border-color:#8c72c5;background:linear-gradient(135deg,#242139,#151b2c)}.cl-case:hover{border-color:#64758e}.cl-case>.cb-case-art.cc-card{grid-row:1/3;grid-column:1;height:101px;width:92px;align-self:center}
@media(min-width:1650px){.cl-case{grid-template-columns:107px minmax(0,1fr);min-height:130px}.cl-case>.cb-case-art.cc-card{width:107px;height:110px}}
@media(max-width:1200px){.cl-catalog-grid{grid-template-columns:1fr}.cl-case{grid-template-columns:100px minmax(0,1fr) auto;grid-template-rows:1fr;min-height:104px}.cl-case>.cb-case-art.cc-card{width:100px;height:85px;grid-row:1;grid-column:1}}
@media(max-width:800px){.cs-art-link{height:185px}.cl-catalog-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.cl-case{grid-template-columns:75px minmax(0,1fr);grid-template-rows:1fr auto;gap:5px;min-height:110px}.cl-case>.cb-case-art.cc-card{grid-column:1;grid-row:1/3;width:75px;height:85px}}
@media(max-width:520px){.cs-art-link{height:215px}.cl-catalog-grid{grid-template-columns:1fr}.cl-case{grid-template-columns:85px minmax(0,1fr) auto;grid-template-rows:1fr;min-height:100px}.cl-case>.cb-case-art.cc-card{grid-row:1;grid-column:1;width:85px;height:80px}}
/* Studio proportions: art-led landscape cards and a single compact footer. */.cs-art-link{height:190px;padding:0 9px;background:radial-gradient(ellipse at 35% 65%,color-mix(in srgb,var(--cs-accent) 15%,transparent),transparent 72%)}
/* Lineup is a modal over the existing lobby, not a replacement page. */
html.cl-modal-open{overflow:hidden}
@media(min-width:1600px){.cs-art-link{height:210px}}
@media(max-width:750px){.cs-art-link{height:185px}}
@media(max-width:520px){.cs-art-link{height:195px}}

/* Studio lobby polish: isolated from the arena and creation dialog. */
.cs-art-link .cb-case-art.cc-card{mix-blend-mode:screen;background:transparent!important;box-shadow:none!important}
.cs-art-link .cb-case-art .cc-art{background:transparent!important}
.cs-sort{position:relative;min-width:180px;color:#dce1ef;font-size:13px;z-index:5}
.cs-sort summary{list-style:none;display:flex;align-items:center;gap:10px;height:42px;padding:0 13px;border:1px solid #303a50;border-radius:9px;background:linear-gradient(180deg,#182031,#111725);cursor:pointer;box-sizing:border-box;transition:border-color .15s,background .15s;user-select:none}
.cs-sort summary::-webkit-details-marker{display:none}
.cs-sort summary:hover,.cs-sort[open] summary{border-color:#8d70d6;background:#20273a}
.cs-sort summary>span{flex:1}
.cs-sort summary:focus-visible{outline:2px solid #aa8aff;outline-offset:3px}
@media(max-width:600px){.cs-sort{min-width:165px}}

/* Blend at the outer artwork group, outside nested image/filter contexts. */
#battle-app .cs-art-link .cb-case-art.cc-card{mix-blend-mode:normal}
/* Geometric plus: independent of font baseline and inherited line-height. */
#battle-app .cb-vacant{position:relative;box-sizing:border-box;padding:0;font-size:0;line-height:0}
#battle-app .cb-vacant>.cb-seat-plus{display:block;position:absolute;left:50%;top:50%;width:12px;height:12px;min-width:12px;max-width:none;margin:0;padding:0;transform:translate(-50%,-50%);pointer-events:none}

/* Case battle creator refresh: denser catalog, fixed four-round lineup, modern controls and seats. */

/* Creator polish v9 — larger typography, reliable scrolling, compact readable seats */

/* Creator polish v10 — stronger drag feedback and clearer team/player seats */


/* --- Case showdown neon arena rework --- */
@keyframes csdRoll{from{transform:translateX(0)}to{transform:translateX(-876px)}}
@keyframes csdPulse{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}

/* --- Compact synchronized showdown reels (v2) --- */
.battle-room-page .market-ribbon,.battle-room-page footer{display:none!important}
.battle-room-page main{min-height:0}
.battle-room-page #battle-app{height:calc(100vh - 68px);min-height:610px;max-width:1740px;padding:10px 22px 12px;display:flex;flex-direction:column;overflow:hidden}
.battle-room-page #cb-content{flex:1;min-height:0;overflow:hidden}
.battle-room-page #battle-app [data-battle-reel-shell].winner-flash{box-shadow:0 0 0 1px rgba(255,255,255,.06),0 0 24px color-mix(in srgb,var(--player-accent,#a389ff) 32%,transparent)}
.battle-room-page #battle-app .reel-card.is-dimmed{opacity:.34;filter:saturate(.72) brightness(.78)}
.battle-room-page #battle-app .reel-card.is-winner{z-index:2;opacity:1;filter:saturate(1.08) brightness(1.06);box-shadow:0 0 0 1px rgba(255,255,255,.06),0 10px 28px color-mix(in srgb,var(--tier) 22%,transparent)}
.battle-room-page #battle-app .reel-card.is-winner img{transform:scale(1.08);filter:drop-shadow(0 10px 10px #0008) brightness(1.07) saturate(1.07)}
.battle-room-page #battle-app .reel-card.is-winner:after{height:3px;box-shadow:0 0 12px var(--tier)}

@media(max-width:1050px){
  .battle-room-page #battle-app{height:calc(100vh - 64px)}
}
@media(max-width:900px){
  .battle-room-page{overflow:auto}
  .battle-room-page #battle-app{height:auto;min-height:0;overflow:visible;padding:12px 12px 24px}
  .battle-room-page #cb-content{overflow:visible}
}

/* Cases / Case Battles switcher — shares the Cases lobby glass segmented style (cases.css). */
.battle-room-page #battle-app .cb-top-nav{flex:0 0 auto;min-height:0;margin:0 0 8px;padding:0 0 8px}