/* ==== moonbet-v11.css ==== */
/* Moonclutch V11 — compact community design. Visual changes only. */
/* System font stack: no third-party font request required. */
:root{--bg:#0D0F13;--panel:#191D24;--panel2:#1E222A;--panel3:#242932;--line:#2A2F38;--line2:#353B45;--text:#F2F3F5;--muted:#949BA6;--purple:#8591C8;--purple2:#6E7DB5;--cyan:#8DA6BA;--pink:#A18CA7;--green:#36BE83;--gold:#C9AD7A;--shadow:0 12px 36px #0005;--sidebar:216px}
html{scroll-behavior:smooth}body{background:var(--bg);font-family:Inter,system-ui,sans-serif;color:var(--text);font-size:13px}body:before{display:none}h1,h2,h3,h4,.brand{font-family:Inter,system-ui,sans-serif}h1,h2{letter-spacing:-.035em}h3{letter-spacing:-.015em}::selection{background:#8591c84d}
.site-banner{height:25px;background:#11141a;border-color:var(--line);color:#929AA6;font-size:9px;letter-spacing:.55px}.site-banner strong{color:#C8CED7}.live-dot{background:#36BE83;box-shadow:none;width:6px;height:6px}
.topbar{height:62px;padding:0 20px;background:#12151B;border-color:var(--line);backdrop-filter:none}.brand{font-size:22px;letter-spacing:-1px;gap:9px}.brand b{color:#B8C0DF}.brand em{display:none}.logo-mark{width:33px;height:33px;border:1px solid #3D465C;border-radius:6px;box-shadow:none;background:#252D40;transform:none;padding-left:0;padding-top:0;font-size:0}.logo-mark i{width:18px;height:18px;left:6px;top:7px;background:#B5BEDD}.logo-mark i:after{width:18px;height:18px;background:#252D40;left:7px;top:-5px}.header-divider{background:#2A2F38;margin:0 14px}.brand-tagline{color:#7B8491;font-size:9px;letter-spacing:.6px}.header-right{gap:12px}.online-state{font-size:10px;font-weight:600;letter-spacing:.35px}.auth-btn,.btn{border-radius:6px!important;box-shadow:none!important;font-weight:650!important;letter-spacing:0!important;transition:background .16s,border-color .16s,filter .16s}.auth-btn{padding:9px 14px;background:#20242c;border-color:#343a43;color:var(--text)}.auth-btn.primary,.btn.primary{background:#7B89BD;color:#10141F;border-color:#8591C8}.btn.primary:hover,.auth-btn.primary:hover{background:#9AA5D0;filter:none}.btn.outline,.btn.muted{background:#22262E;border-color:#3A404A;color:#DEE2E9}.btn:focus-visible,.auth-btn:focus-visible,.side-links a:focus-visible,.side-btn:focus-visible,.sidebar-toggle:focus-visible{outline:2px solid #B5C1E7;outline-offset:2px}
.wallet-pill{border-radius:6px;background:#20242D;border-color:#303743;padding:5px 10px 5px 6px}.wallet-pill .moon-mini{border-radius:4px;background:#313A50;color:#BCC7E5;width:28px;height:28px}.wallet-pill strong{font-size:13px}.wallet-pill small{letter-spacing:.6px;font-size:8px;color:#9FA9B9}.profile-avatar{background:#353F54;border-color:#697796;border-radius:6px;width:36px;height:36px}
.app-shell{min-height:calc(100vh - 87px)}.sidebar{width:var(--sidebar);background:#12151B;top:62px;height:calc(100dvh - 62px);min-height:0;padding:12px 10px 14px;border-color:var(--line);transition:width .2s ease}.sidebar-toggle{display:flex;align-items:center;justify-content:space-between;width:100%;font:600 10px Inter,sans-serif;letter-spacing:.4px;color:#AEB6C4;background:#1A1E26;border:1px solid #2B3039;border-radius:5px;padding:9px 10px;margin:0 0 14px;cursor:pointer}.sidebar-toggle:hover{background:#242932}.nav-label{color:#69727E;font-size:9px;font-weight:700;letter-spacing:1px;margin:10px 12px 8px}.nav-label-2{margin-top:21px}.side-links{gap:2px}.side-links a,.side-btn{font-size:12px;font-weight:550;min-height:36px;border-radius:5px;padding:8px 10px;gap:11px;color:#9CA5B2;transition:background .15s,color .15s}.side-links a:hover,.side-btn:hover{background:#232830;color:#F2F3F5}.side-links a.active{background:#2B3241;border-color:#414C62;color:#E3E8F6}.side-icon{width:19px;font-size:17px;color:#A4AEC1}.nav-arrow{color:#626E7C;font-size:15px}.nav-tag{background:#293D42;color:#8ECCB0;border-radius:3px;font-size:8px;letter-spacing:0;padding:2px 5px}.side-feature{display:none}.sidebar-foot{font-size:9px;color:#626D7D;padding:10px 7px;margin-top:auto}.sidebar-foot span{color:#8894B6}
body.nav-compact{--sidebar:66px}body.nav-compact .sidebar{padding-left:7px;padding-right:7px}body.nav-compact .sidebar-toggle{font-size:16px;justify-content:center}body.nav-compact .sidebar-toggle span,body.nav-compact .sidebar .nav-label,body.nav-compact .sidebar .nav-arrow,body.nav-compact .sidebar .nav-tag,body.nav-compact .sidebar-foot{display:none}body.nav-compact .side-links a,body.nav-compact .side-btn{font-size:0;justify-content:center;padding:9px 4px;min-height:40px;gap:0}body.nav-compact .side-links .side-icon{font-size:18px;width:22px}
.main-content{background:#0D0F13;padding:22px 24px 50px;min-width:0}.page-header{padding:18px 20px!important;border-radius:6px!important;min-height:0!important;margin:0 0 16px!important;background:#191D24!important;border:1px solid var(--line)!important;box-shadow:none!important}.page-header:before,.page-header:after{display:none!important}.page-header h1{font-size:clamp(23px,2vw,30px)!important;letter-spacing:-.045em;margin:5px 0 6px!important}.page-header p{font-size:12px;color:var(--muted);max-width:700px}.page-header h1 span,.heading h2 span,.hero h1 span,.bj-hero h1 span{color:#B0BDDE!important}.eyebrow,.meta-label,.kicker{font-size:10px!important;letter-spacing:.7px!important;font-weight:700!important;color:#8A96A7!important}.eyebrow em{color:#8591C8}.heading{margin:19px 0 12px!important}.heading h2{font-size:19px!important;letter-spacing:-.035em}.heading p,.section-desc{font-size:12px!important;color:#929DAA!important}
.hero{background:#1A1F27!important;border:1px solid #303641!important;border-radius:7px!important;box-shadow:none!important;min-height:225px!important;padding:28px 30px!important;margin-bottom:16px!important}.hero:before,.hero:after{display:none!important}.hero h1{font-size:clamp(29px,3vw,43px)!important;line-height:1.12;letter-spacing:-.05em}.hero p{max-width:530px!important;color:#A5AFBC!important;font-size:12px!important}.hero-moon{width:145px!important;height:145px!important;right:9%!important;top:35px!important;opacity:.45;box-shadow:none!important;filter:saturate(.3)}.hero-actions{gap:8px}.small-hero-tag{font-size:9px!important;color:#8E9BAC!important}
.stats-grid{gap:10px!important;margin-bottom:20px!important}.stat-tile{border:1px solid var(--line)!important;border-radius:6px!important;background:#191D24!important;box-shadow:none!important;padding:13px 15px!important;min-height:75px!important}.stat-icon{background:#252C38!important;border:1px solid #303A48!important;color:#A2B0D6!important;border-radius:5px!important;width:35px!important;height:35px!important;font-size:17px!important}.stat-tile strong{font-size:21px!important;font-weight:700}.stat-tile small{color:#8994A3!important;font-size:9px!important;letter-spacing:.3px!important}
.panel,.feature-card,.case-tile,.participant-card,.profile-card,.stat-card,.xp-widget{background:#191D24!important;border:1px solid #2A2F38!important;border-radius:6px!important;box-shadow:none!important}.panel{padding:18px!important}.feature-cards,.case-grid{gap:12px!important}.feature-card{min-height:174px!important;padding:19px!important}.feature-card:before,.feature-card:after,.case-tile:before,.case-tile:after{display:none!important}.feature-card h3{font-size:20px!important}.feature-card p{font-size:12px!important;color:#A3ADB9!important}.feature-card:hover,.case-tile:hover{background:#202630!important;border-color:#56647D!important;transform:none!important;box-shadow:none!important}.case-grid{grid-template-columns:repeat(auto-fit,minmax(210px,1fr))!important}.case-tile{overflow:hidden}.case-art{background:#202631!important;min-height:150px}.case-box{filter:saturate(.5)}.case-info{padding:15px!important}.case-info h3{font-size:17px!important}.case-info p{color:#9DA7B5!important;font-size:11px!important}.case-price{border-top:1px solid #2A303B!important;color:#B6C2E1!important}
.battle-list{gap:8px!important}.battle-card{border-radius:6px!important;background:#191D24!important;border:1px solid #2A2F38!important;box-shadow:none!important;padding:14px 16px!important;gap:16px!important}.battle-card:hover{background:#1F242D!important;border-color:#455067!important}.battle-title{font-size:17px!important;font-weight:700!important}.chip,.pill,.lvl-badge{background:#252C36!important;border:1px solid #3A4452!important;border-radius:4px!important;color:#AEBBD5!important;box-shadow:none!important;font-size:9px!important;font-weight:650!important}.chip.green{background:#173A2B!important;border-color:#28684A!important;color:#68D7A1!important}.toolbar{padding:12px!important;border:1px solid var(--line)!important;border-radius:6px!important;background:#171B21!important}.select,.choose,.field input,.field select,.promo-redeem input{border-radius:5px!important;background:#20252E!important;border-color:#343B46!important;color:#E7EAF0!important}.choose.active{background:#30394C!important;border-color:#69799B!important}.seat,.avatar{box-shadow:none!important}.participant-card{padding:14px!important}.player-score,.item-percent{color:#B7C4DE!important}
.modal-layer{background:#080B10CC;backdrop-filter:blur(3px)}.modal-content{background:#1A1F27!important;border:1px solid #3B4553!important;border-radius:8px!important;padding:21px!important;box-shadow:0 24px 80px #0009!important}.reel-area,.mini-case,.item-row,.reveal-result,.demo-notice,.promo-redeem{background:#202630!important;border-color:#323B47!important;border-radius:6px!important}.reel-item{background:#242B34!important;border-color:#3A4551!important;border-radius:5px!important}.reel-marker{background:#B3C3E5;box-shadow:none}.reel-marker:before{color:#B3C3E5}.xp-widget{padding:14px!important}.xp-fill{background:#8591C8!important;box-shadow:none!important}.xp-track{background:#11151B!important;border-color:#39414E!important}.level-up-toast{border-radius:8px!important;background:#212A39!important;border-color:#6B7FA9!important;box-shadow:0 12px 40px #0008!important}.level-up-toast strong{color:#E5E9F4!important;background:none!important}.profile-large{background:#30394B!important;box-shadow:none!important}
/* Game-specific restrained visuals. Keep existing game logic and DOM contract. */
.bj-wrap{max-width:1250px}.bj-board{border-radius:12px!important;border:1px solid #323D4B!important;background:radial-gradient(ellipse at center,#22373A 0%,#12282B 55%,#101C20 100%)!important;box-shadow:inset 0 0 60px #07101366!important}.bj-board:before{opacity:.3}.bj-hero h1{font-size:30px!important}.keno-wrap,.roulette-wrap{max-width:none!important}.keno-board,.keno-panel,.roulette-panel,.roulette-card{box-shadow:none!important}.roulette-slider,.roulette-window,.roulette-track{will-change:transform}.roulette-result{border-radius:6px!important}
/* Chat is docked to the right and may be collapsed with the existing control. */
@media(min-width:1051px){.moon-chat{top:87px!important;height:calc(100dvh - 87px)!important;width:292px!important;background:#14181E!important;border-color:#2A303B!important;box-shadow:none!important}.moon-chat .chat-head{background:#1D222A!important;color:#CED7E5!important}.moon-chat .chat-body{background:#151A20!important}.moon-chat input{background:#20252D!important;border-color:#343C47!important}.moon-chat form button{background:#7B89BD!important;color:#111722!important}.chat-msg{border-color:#2C333C!important}.chat-msg b,.chat-user{color:#BECAE3!important}.chat-level{background:#2A3446!important;border-color:#52617B!important;color:#D2DBEC!important}.main-content{padding-right:317px!important}body.chat-hidden .main-content{padding-right:24px!important}}
@media(max-width:1100px){.hero-moon{opacity:.22}.battle-desc{display:none}}@media(max-width:990px){.sidebar{top:62px!important;height:calc(100dvh - 62px)!important;width:218px!important}.main-content{padding:16px!important}.sidebar-toggle{display:none}body.nav-compact{--sidebar:0px}}@media(max-width:700px){.topbar{height:60px!important;padding:0 10px!important}.site-banner{height:25px!important}.sidebar{top:60px!important;height:calc(100dvh - 60px)!important}.hero{padding:21px!important;min-height:220px!important}.hero h1{font-size:29px!important}.hero p{max-width:100%!important}.hero-moon{display:none!important}.page-header{padding:16px!important}.stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.stat-tile{padding:10px!important}.stat-tile strong{font-size:18px!important}.main-content{padding:12px 10px 30px!important}.battle-card{padding:10px!important;gap:7px!important}.battle-card .actions .btn{padding:8px!important}.participant-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.case-grid{grid-template-columns:1fr!important}.modal-content{padding:16px!important}.brand-tagline{display:none}.header-right{gap:5px}}
@media(prefers-reduced-motion:reduce){.sidebar,.side-links a,.btn,.feature-card,.case-tile{transition:none!important}}


/* ==== moonbet-v12.css ==== */
/* Moonclutch V11.2: product-level design pass on top of unchanged backend and game engines.
   All controls remain the existing app.js controls; no faux links or static balances. */
:root{
  --mb-bg:#0d0f13;--mb-sidebar:#12151b;--mb-panel:#191d24;--mb-soft:#20252d;
  --mb-hover:#252b34;--mb-divider:#2a2f38;--mb-quiet:#8b93a0;--mb-ink:#f2f3f5;
  --mb-accent:#8591c8;--mb-green:#36be83;--mb-danger:#d96565;
  --mb-radius:6px;--mb-gutter:16px
}
body{color:var(--mb-ink);background:var(--mb-bg);line-height:1.48}
button,input,select,textarea{font-family:Inter,system-ui,sans-serif}
:where(button,a,input,select,textarea):focus-visible{outline:2px solid #b1bfef!important;outline-offset:2px}
button:disabled{cursor:not-allowed;opacity:.5}
.main-content{width:100%;min-width:0;max-width:none}
.main-content>*{max-width:1540px;margin-left:auto;margin-right:auto}
.page-header{display:flex!important;flex-direction:column;justify-content:center;align-items:flex-start;position:relative;gap:0}
.page-header:has(.page-top-actions){padding-right:230px!important}
.page-top-actions{position:absolute;right:20px;top:50%;transform:translateY(-50%)}
.page-top-actions .btn{min-width:155px}
.heading{align-items:flex-end}
.heading .eyebrow{margin-bottom:5px}
.heading h2{font-size:19px!important;margin:0}
.heading h2 span{color:var(--mb-ink)!important}
.heading .link-minor{text-decoration:none}
.btn,.tab,.choose,.select{min-height:34px}
.btn.small{min-height:30px}
.panel{overflow-wrap:anywhere}
.site-banner{display:flex;align-items:center;justify-content:center}
.sidebar{overflow-y:auto;scrollbar-width:thin;scrollbar-color:#394250 transparent}
.side-links a.active{box-shadow:inset 2px 0 0 #97a4ce}
.side-links a,.side-btn{white-space:nowrap}
.side-links .nav-tag{margin-left:auto}
.moon-chat{z-index:20}
/* Homepage: purpose-built structure, not inherited generic dashboard cards. */
.mb-home-welcome{display:grid;grid-template-columns:minmax(0,1fr) 260px;min-height:267px;position:relative;background:#171c23;border:1px solid var(--mb-divider);border-radius:8px;margin-bottom:12px;overflow:hidden}
.mb-home-copy{padding:28px 30px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center}
.mb-overline{font-size:10px;font-weight:700;color:#9aabc9;letter-spacing:1.1px}
.mb-home-copy h1{font-size:clamp(29px,3.2vw,43px);font-weight:750;line-height:1.12;letter-spacing:-1.6px;margin:10px 0 10px}
.mb-home-copy h1 span{color:#a7b3d4}
.mb-home-copy p{font-size:12px;line-height:1.75;color:#a6aebb;max-width:540px;margin:0 0 17px}
.mb-home-buttons{display:flex;gap:8px;flex-wrap:wrap}
.mb-home-foot{display:flex;align-items:center;gap:8px;color:#8e98a5;margin-top:22px;font-size:10px}
.mb-small-sep{opacity:.45}
.mb-home-emblem{display:flex;flex-direction:column;align-items:center;justify-content:center;border-left:1px solid #252d38;background:radial-gradient(circle at 50% 42%,#263144,#19202a 60%,#171c23);position:relative}
.mb-emblem-orbit{width:145px;height:145px;border-radius:50%;border:1px solid #3a4658;display:grid;place-items:center;position:relative}
.mb-emblem-orbit:before{content:'';position:absolute;inset:15px;border:1px solid #364254;border-radius:50%}
.mb-emblem-moon{width:76px;height:76px;background:#aebad4;border-radius:50%;display:block;position:relative;box-shadow:0 0 0 8px #2c384d80}
.mb-emblem-moon:after{content:'';position:absolute;left:30px;top:-10px;width:74px;height:74px;border-radius:50%;background:#222c3b}
.mb-home-emblem small{margin-top:22px;font-size:9px;letter-spacing:1.4px;color:#8997b0}
.mb-quickstats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));background:#161a20;border:1px solid var(--mb-divider);border-radius:6px;margin-bottom:24px}
.mb-quickstats>div{padding:14px 20px;display:flex;align-items:center;justify-content:space-between;gap:10px}
.mb-quickstats>div+div{border-left:1px solid var(--mb-divider)}
.mb-quickstats span{font-size:9px;color:#8f98a6;font-weight:650;letter-spacing:.55px}
.mb-quickstats strong{font-size:21px;font-weight:700;font-variant-numeric:tabular-nums;color:#d9e0ec}
.mb-game-rail{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin:0 0 25px}
.mb-game-card{position:relative;display:flex;flex-direction:column;align-items:flex-start;min-height:182px;padding:16px 15px;text-align:left;border:1px solid #2d333c;border-radius:6px;background:#191d24;color:#edf0f6;transition:border-color .16s,background .16s}
.mb-game-card:hover{background:#222831;border-color:#607097}
.mb-game-number{font-size:9px;letter-spacing:.65px;color:#8894a6}
.mb-game-glyph{font-size:33px;line-height:1.3;color:#b2c0e1;margin:15px 0 11px}
.mb-game-card strong{font-size:14px;font-weight:700}
.mb-game-card small{font-size:10px;line-height:1.5;color:#96a1af;margin-top:4px;padding-right:10px}
.mb-card-arrow{position:absolute;right:15px;top:13px;font-size:16px;color:#a9b5ca}
.mb-home-columns{display:grid;grid-template-columns:minmax(0,1fr) 275px;gap:14px;align-items:start}
.mb-home-columns>.mb-home-side{margin-top:36px}
.mb-home-side{background:#191d24;border:1px solid #2e343d;border-radius:6px;padding:20px}
.mb-home-side-head{display:flex;align-items:center;justify-content:space-between}
.mb-feature-icon{color:#a6b4d4;font-size:42px}
.mb-home-side h3{font-size:19px;margin:7px 0 5px}
.mb-home-side p{font-size:11px;color:#9faab8;line-height:1.7;margin:7px 0 14px}
.mb-home-side .btn{width:100%}
.mb-side-rule{height:1px;background:#323843;margin:20px 0}
/* Battle lobby: compact live rows and functional filter strip. */
.battle-list{display:grid;gap:7px}
.battle-card{display:grid!important;grid-template-columns:minmax(180px,1.05fr) minmax(150px,.85fr) minmax(145px,.75fr) auto;align-items:center;min-height:100px}
.battle-card .meta-row{margin-top:8px;gap:5px}
.battle-card .battle-title{font-size:15px!important;margin-top:4px}
.battle-card .avatars{display:flex;flex-wrap:wrap;gap:4px;margin-top:6px}
.battle-card .seat{width:30px;height:30px;font-size:11px}
.battle-card .actions{display:flex;gap:7px;flex-wrap:wrap;justify-content:flex-end}
.battle-card .mini-result{font-size:11px;color:#c2c9d4;margin-top:6px}
.battle-card .chip{font-size:9px}
.toolbar{display:flex!important;justify-content:space-between;gap:14px;margin-bottom:10px!important}
.toolbar .tabs{display:flex;flex-wrap:wrap;gap:3px}
.toolbar .tab{padding:9px 12px;border:1px solid transparent;border-radius:4px;background:transparent;color:#a3acba}
.toolbar .tab.active{background:#2a3241;color:#e2e8f7;border-color:#46536b}
.toolbar .selects{display:flex;gap:7px}
/* Creation dialog: three clearly ordered steps plus a persistent summary. */
.modal-content.wide{width:min(94vw,1100px);max-height:90dvh;overflow-y:auto}
.modal-content:has(.mb-create-layout){width:min(94vw,1050px)!important;max-width:1050px!important;max-height:91dvh;overflow-y:auto}
.mb-create-layout{display:grid;grid-template-columns:minmax(0,1fr) 270px;gap:18px;margin-top:18px}
.mb-create-main{display:grid;gap:12px;min-width:0}
.mb-create-section{background:#171b21;border:1px solid #303641;border-radius:6px;padding:15px}
.mb-create-step{display:flex;align-items:center;gap:11px;margin-bottom:14px}
.mb-create-step>span{font-size:11px;width:28px;height:28px;display:grid;place-items:center;border:1px solid #4b5973;background:#2b3446;color:#d5dff3;border-radius:4px;font-weight:700}
.mb-create-step b,.mb-create-step small{display:block}
.mb-create-step b{font-size:13px}
.mb-create-step small{font-size:10px;color:#8995a5}
.mb-create-section .format-choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
.mb-create-section .choose{width:100%;padding:10px 5px}
.mb-create-section .field{margin:9px 0}
.mb-create-section .qty-control{background:#20252d;border:1px solid #323b46;border-radius:5px;padding:11px}
.mb-create-section .qty-control button{border-radius:4px}
.mb-create-side{min-width:0}
.mb-create-summary{background:#202630;border:1px solid #394455;border-radius:6px;padding:19px;position:sticky;top:6px}
.mb-create-summary h3{font-size:17px;margin:7px 0 20px}
.mb-summary-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid #343e4b;font-size:12px}
.mb-summary-row span{color:#9aa5b4}
.mb-summary-row strong{color:#e2e8f3;font-size:12px}
.mb-summary-rule{height:1px;background:#454d5a;margin-top:14px}
.mb-create-summary p{font-size:11px;color:#9ca8b7;line-height:1.7;margin:14px 0}
.mb-create-summary .btn{width:100%;margin:0}
/* Case: deliberate storefront information architecture */
.case-grid{grid-template-columns:repeat(auto-fill,minmax(198px,1fr))!important}
.case-tile{min-height:265px;display:flex;flex-direction:column;align-items:stretch;text-align:left}
.case-art{min-height:137px!important;display:flex;align-items:center;justify-content:center}
.case-art .case-box{font-size:60px!important}
.case-info{flex:1;display:flex;flex-direction:column}
.case-info h3{margin:9px 0 5px}
.case-info .case-price{margin-top:auto}
.case-detail-layout{grid-template-columns:minmax(265px,.85fr) minmax(0,1.15fr);gap:14px;align-items:start}
.case-focus{position:sticky;top:14px;text-align:center}
.case-focus .case-box{margin:8px auto;font-size:72px}
.case-focus .btn{width:100%;max-width:310px}
.item-row{display:grid;grid-template-columns:44px minmax(0,1fr) 83px;gap:10px;align-items:center;padding:10px 6px!important}
.item-percent{text-align:right;font-variant-numeric:tabular-nums}
/* Battle room: participants first, round scores and controls subordinate. */
.battle-detail-layout{gap:14px!important}
.participant-grid{gap:8px!important}
.participant-card{min-height:170px!important;display:flex;flex-direction:column;align-items:center;text-align:center;justify-content:center}
.participant-card .meta-label{align-self:stretch;text-align:left}
.participant-card .avatar{margin:10px 0 6px}
.participant-card .player-name{font-size:12px}
.round-track{display:flex;gap:5px;flex-wrap:wrap}
.round{background:#262c35;border:1px solid #3a434f;border-radius:4px}
.round.current{border-color:#9baad0;background:#303d56}
.round.complete{color:#95cbae}
.score-bar{border-bottom:1px solid #323a46;padding:11px 0}
/* Profile gets genuine tab navigation; original backend-backed content remains intact. */
.mb-profile-tabs{display:flex;gap:4px;border-bottom:1px solid #343a44;margin:0 0 14px}
.mb-profile-tabs button{padding:10px 18px;font-size:12px;border:0;border-bottom:2px solid transparent;background:transparent;color:#9aa5b2;cursor:pointer}
.mb-profile-tabs button.active{color:#eaf0f9;border-bottom-color:#a2b0dd}
body.mb-profile-enabled [data-profile-section="collection"],body.mb-profile-enabled [data-profile-section="battles"]{display:none}
body.mb-profile-collection [data-profile-section="overview"],body.mb-profile-battles [data-profile-section="overview"]{display:none}
body.mb-profile-collection [data-profile-section="collection"],body.mb-profile-battles [data-profile-section="battles"]{display:block}
body.mb-profile-overview [data-profile-section="overview"]{display:grid}
.profile-grid{align-items:start;gap:14px}
.profile-card{display:flex;flex-direction:column;align-items:center;text-align:center;gap:8px}
.profile-card .xp-widget{align-self:stretch;text-align:left;width:100%}
.profile-card .profile-stats{width:100%}
.profile-card .promo-redeem{width:100%;text-align:left}
.profile-card .btn{width:100%}
.profile-card .profile-name{font-size:22px;margin:3px 0 0}
.profile-email{color:#8793a4}
.history-entry{padding:12px 4px;border-bottom:1px solid #2e3540}
.public-profile{max-width:1000px}
/* Games: preserve each engine's DOM, avoid cookie-cutter panel appearance. */
.bj-wrap{max-width:1380px!important}
.bj-board{min-height:385px;border-radius:14px!important;position:relative;overflow:hidden}
.bj-board:after{content:'';position:absolute;inset:20px;border:1px solid #8fac9b2c;border-radius:50%;pointer-events:none}
.bj-hero{padding:10px 0 16px!important}
.bj-hero h1{margin:5px 0!important;font-size:24px!important}
.bj-footer{gap:10px!important}
.bj-panel{border-radius:5px!important;box-shadow:none!important}
.keno-wrap .page-header,.roulette-wrap .page-header{border-radius:6px!important}
.keno-board{border:1px solid #36404b;border-radius:8px!important;background:#181e27!important}
.keno-number{border-radius:5px!important;box-shadow:none!important}
.roulette-wrap{overflow-x:clip}
.roulette-window{border:1px solid #333e4d!important;border-radius:6px!important}
.roulette-track{transform-style:flat}
.roulette-card{border-radius:6px!important}
/* Responsive: these must shrink without covering game actions. */
@media(max-width:1380px){.mb-game-rail{grid-template-columns:repeat(3,minmax(0,1fr))}.mb-home-columns{grid-template-columns:minmax(0,1fr) 240px}.battle-card{grid-template-columns:minmax(175px,1fr) minmax(130px,.8fr) auto}.battle-card .battle-desc{display:none}}
@media(max-width:1120px){.mb-home-welcome{grid-template-columns:minmax(0,1fr) 180px}.mb-home-emblem .mb-emblem-orbit{transform:scale(.8)}.mb-home-columns{grid-template-columns:1fr}.mb-home-columns>.mb-home-side{margin-top:0}.mb-create-layout{grid-template-columns:1fr}.mb-create-summary{position:static}.main-content{max-width:100%}}
@media(max-width:850px){.mb-home-welcome{grid-template-columns:1fr}.mb-home-emblem{display:none}.mb-game-rail{grid-template-columns:repeat(2,minmax(0,1fr))}.mb-quickstats{grid-template-columns:repeat(2,minmax(0,1fr))}.mb-quickstats>div:nth-child(3){border-left:0;border-top:1px solid var(--mb-divider)}.mb-quickstats>div:nth-child(4){border-top:1px solid var(--mb-divider)}.battle-card{grid-template-columns:minmax(0,1fr) auto}.battle-card .player-seats{grid-column:1}.battle-card .actions{grid-column:2;grid-row:1/span 2}.page-header:has(.page-top-actions){padding-right:18px!important}.page-top-actions{position:static;transform:none;margin-top:13px}.case-detail-layout{grid-template-columns:1fr}.case-focus{position:static}}
@media(max-width:520px){.mb-home-copy{padding:22px 18px}.mb-home-copy h1{font-size:29px}.mb-home-copy p{font-size:11px}.mb-game-rail{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.mb-game-card{min-height:155px;padding:12px}.mb-game-glyph{margin:11px 0 6px;font-size:27px}.mb-game-card strong{font-size:12px}.mb-quickstats>div{padding:10px}.mb-quickstats span{font-size:8px}.mb-quickstats strong{font-size:17px}.battle-card{grid-template-columns:1fr!important;gap:10px!important}.battle-card .player-seats,.battle-card .actions{grid-column:auto;grid-row:auto}.battle-card .actions{justify-content:stretch}.battle-card .actions .btn{flex:1}.mb-create-section .format-choices{grid-template-columns:repeat(2,1fr)}.mb-create-layout{gap:10px}.modal-content:has(.mb-create-layout){width:98vw!important;padding:12px!important}.toolbar .selects{width:100%;flex-wrap:wrap}.toolbar .select{flex:1;min-width:110px}.mb-profile-tabs button{padding:10px 12px}.profile-grid{grid-template-columns:1fr!important}}
@media(prefers-reduced-motion:reduce){.mb-game-card{transition:none}.mb-home-emblem .mb-emblem-orbit{animation:none}}


/* ==== moonbet-v13.css ==== */
/* Moonclutch V11.3 — composed design system across the original, API-backed app.
   All rules are visual only. No outcome, account, or transaction code is changed. */
:root{--mb-canvas:#0d0f13;--mb-side:#12151b;--mb-panel:#191d24;--mb-panel-raised:#20252d;--mb-hover:#242932;--mb-border:#2a2f38;--mb-text:#f2f3f5;--mb-sub:#949ba6;--mb-accent:#8591c8;--mb-green:#36be83;--mb-red:#d96565;--mb-radius:6px;--mb-gap:12px}
*{scrollbar-color:#414752 #12151b;scrollbar-width:thin}
body{background:var(--mb-canvas)!important;color:var(--mb-text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,'Segoe UI',sans-serif;line-height:1.45}
.mb-skip-link{position:fixed;top:-80px;left:16px;z-index:150;display:block;padding:10px 16px;background:#fff;color:#10141b;border-radius:5px}
.mb-skip-link:focus{top:10px}
button,a,input,select,textarea{font:inherit}
:where(button,a,input,select,textarea,[tabindex]):focus-visible{outline:2px solid #becbf3!important;outline-offset:3px!important}
button:disabled,.btn:disabled{cursor:not-allowed;opacity:.45!important}
:where(.btn,.tab,.choose,.side-btn,.auth-btn,.case-tile,.mb-game-card){transition:background .16s ease,border-color .16s ease,color .16s ease,transform .16s ease!important}
:where(.btn,.tab,.choose,.auth-btn):active:not(:disabled){transform:translateY(1px)}
.site-banner{height:26px!important;font-size:9px!important;letter-spacing:.08em!important;background:#101319!important;border-bottom:1px solid #272d35!important;color:#a5afbe!important}
.site-banner strong{color:#d6e0f0!important}
.topbar{height:60px!important;min-height:60px!important;background:#12151b!important;border-bottom:1px solid #2a2f38!important;box-shadow:none!important}
.brand{font-weight:800!important;letter-spacing:-.7px!important}
.brand-tagline{color:#8390a1!important;font-size:10px!important;white-space:nowrap}
.mb-build-label{margin-left:10px;font-size:9px;border:1px solid #41495a;color:#b3bfd1;border-radius:3px;padding:2px 5px}
.online-state{font-size:10px!important;color:#a6b4c2!important}
.sidebar{background:#12151b!important;border-right:1px solid #292e38!important;box-shadow:none!important}
.sidebar .nav-label{font-size:9px!important;letter-spacing:1.2px!important;color:#798593!important;margin-top:19px}
.side-links>a,.side-links>.side-btn{font-size:12px!important;min-height:39px!important;border-radius:5px!important;margin:2px 9px!important;padding:9px 10px!important;color:#a9b2c0!important}
.side-links>a:hover,.side-links>.side-btn:hover{background:#222731!important;color:#f0f3f8!important}
.side-links>a.active{background:#283142!important;color:#e2e9f6!important;box-shadow:inset 2px 0 0 #99a9d5!important}
.side-icon{font-size:15px!important;color:#919cad!important;width:22px!important;text-align:center!important}
.sidebar-toggle{background:#171b22!important;border:1px solid #343c48!important;border-radius:4px!important}
.legacy-side-feature{display:none!important}
.sidebar-foot{font-size:9px!important;color:#6e798a!important}
.main-content{background:#0d0f13!important;min-width:0;max-width:none!important}
.page-header{margin-bottom:21px!important;padding:0!important}
.page-header h1{font-size:clamp(25px,3vw,34px)!important;font-weight:730!important;letter-spacing:-1.1px!important;line-height:1.15!important}
.page-header h1 span,.heading h2 span,.bj-hero h1 span,.rl-root h1 span{color:#aab6da!important}
.page-header p{max-width:770px!important;color:#949fac!important;font-size:12px!important;line-height:1.6!important}
.eyebrow,.kicker,.meta-label,.mb-overline{font-size:10px!important;letter-spacing:.07em!important;color:#9ba9c3!important}
.heading{margin:20px 0 12px!important}
.heading h2{font-size:19px!important;letter-spacing:-.55px!important}
.heading .section-desc{font-size:12px!important;color:#8e99a7!important}
.panel,.stat-tile,.profile-card,.case-tile,.battle-card,.feature-card,.mb-home-side,.mb-create-section,.mb-create-summary{background:#191d24!important;border:1px solid #2d333c!important;border-radius:6px!important;box-shadow:none!important}
.panel{padding:17px!important}
.btn,.choose,.tab,.auth-btn{border-radius:5px!important;font-size:11px!important;letter-spacing:.01em!important;font-weight:700!important;box-shadow:none!important}
.btn.primary,.auth-btn.primary,.moon-chat form button,.rl-choice button{background:#8797c1!important;color:#0d1220!important;border:1px solid #9aaad0!important}
.btn.primary:hover,.auth-btn.primary:hover,.rl-choice button:hover{background:#a3b1d4!important}
.btn.outline,.btn.muted{background:#242a33!important;color:#d5dfeb!important;border-color:#3d4654!important}
.btn.outline:hover,.btn.muted:hover{background:#313946!important}
.chip,.pill,.lvl-badge{border-radius:4px!important;font-weight:650!important;box-shadow:none!important}
:where(.chip,.pill){background:#222831!important;color:#abb6c5!important;border:1px solid #333c48!important}
input,select,textarea,.select{border:1px solid #343d49!important;background:#13171e!important;color:#e6ebf1!important;border-radius:5px!important;box-shadow:none!important;min-height:34px}
:where(input,select,textarea):focus{border-color:#8e9dc4!important}
.modal-layer{backdrop-filter:blur(3px)!important;background:#04070cba!important}
.modal-content{background:#181d24!important;border:1px solid #3b4654!important;border-radius:8px!important;box-shadow:0 20px 75px #000b!important}
.modal-head{padding-bottom:14px;border-bottom:1px solid #303741;margin-bottom:16px}
.modal-head h2{font-size:23px!important;letter-spacing:-.6px!important}
.modal-head h2 span{color:#a3afcf!important}
.close-modal{background:#242a33!important;border-radius:4px!important}
.field label{color:#a1aaba!important;font-size:10px!important}
.demo-notice{font-size:11px!important;color:#9ca9b9!important;background:#161c22!important;border:1px solid #2c3641!important;border-radius:5px!important;line-height:1.6!important}
.empty-state{background:#181d23!important;border:1px dashed #394454!important;border-radius:6px!important;padding:32px!important}
.mb-home-welcome{background:#161c23!important;border:1px solid #2d343f!important}
.mb-home-emblem{background:#1a232e!important}
.mb-home-emblem .mb-emblem-orbit{opacity:.8}
.mb-game-card{min-height:168px!important}
.mb-game-card:hover,.case-tile:hover{transform:translateY(-2px);border-color:#62708c!important}
.mb-game-glyph{color:#98a9cc!important}
.mb-quickstats{background:#171b21!important}
.mb-home-side{padding:18px!important}
.stats-grid{gap:8px!important}
.stat-tile{padding:14px!important}
.stat-tile strong{font-size:20px!important;font-variant-numeric:tabular-nums!important}
.stat-icon{color:#97a8c7!important;background:#222b37!important;border-radius:5px!important}
.battle-list{gap:6px!important}
.battle-card{padding:13px 15px!important;min-height:91px!important}
.battle-card:hover{background:#20262e!important;border-color:#444e5f!important}
.battle-card .seat{border-color:#4b5668!important}
.battle-card .seat.bot{background:#2b3440!important}
.battle-card .meta-row .chip{min-height:21px!important}
.toolbar{background:#181d24!important;border:1px solid #2d333c!important;padding:8px!important;border-radius:6px!important}
.toolbar .tabs .tab{font-size:11px!important}
.toolbar .tabs .tab.active{background:#334053!important}
.case-art{background:#202732!important;border-bottom:1px solid #303844!important;border-radius:5px!important}
.case-tile{overflow:hidden!important;padding:0!important}
.case-tile .case-info{padding:13px 15px 15px!important}
.case-tile .case-box{color:#b4c4dd!important;text-shadow:none!important}
.case-focus{background:#1a2028!important}
.item-row{border-bottom:1px solid #2b343f!important}
.item-percent{color:#b1bed6!important}
.battle-layout .participant-card{background:#20252e!important;border:1px solid #363e4a!important;border-radius:5px!important}
.participant-card.is-empty{background:#171b20!important;border-style:dashed!important}
.score-bar,.round-result,.history-entry{border-color:#313842!important}
.round{border-radius:4px!important}
.mb-create-section,.mb-create-summary{padding:16px!important}
.mb-create-section .choose.active{background:#35435a!important;border-color:#6d7b9f!important}
.mb-create-summary{background:#1d2631!important}
.profile-card{align-items:stretch!important;text-align:left!important}
.profile-card .profile-large{align-self:flex-start}
.profile-card .profile-name{font-size:20px!important}
.mb-profile-tabs{gap:0!important}
.mb-profile-tabs button{font-size:12px!important}
.mb-profile-tabs button:hover{color:#f2f5fb!important;background:#222936!important}
.xp-track{border-radius:4px!important;overflow:hidden!important;background:#303843!important}
.xp-fill{background:#8797c1!important;border-radius:4px!important}
.public-profile{max-width:950px!important}
/* Distinct compositions for the three game components. */
.bj-wrap{max-width:1200px!important}
.bj-hero{margin-bottom:12px!important}
.bj-hero h1,.rl-root h1{font-size:clamp(25px,3vw,34px)!important;letter-spacing:-.9px!important}
.bj-board{background:radial-gradient(ellipse at 50% 35%,#263c37 0%,#162a27 50%,#0f1b20 100%)!important;border:1px solid #465852!important;border-radius:140px 140px 12px 12px / 55px 55px 12px 12px!important;box-shadow:inset 0 0 65px #06100c88!important;min-height:520px!important}
.bj-panel{background:#191d24!important;border:1px solid #303841!important;border-radius:6px!important;box-shadow:none!important}
.bj-card{box-shadow:0 3px 8px #0005!important}
.bj-card.back{background:#242d3d!important}
.bj-action{border-radius:5px!important}
.bj-roundnote{color:#909baa!important}
.keno-wrap,.kn-wrap,.keno-root{max-width:1100px!important}
.keno-board,.keno-panel,.kn-panel{border-radius:6px!important;box-shadow:none!important}
.keno-grid,.kn-grid{gap:5px!important}
.rl-root{max-width:1180px!important}
.rl-root>p{font-size:12px!important;color:#9faab8!important;margin-bottom:16px!important}
.rl-surface{background:#181d24!important;border:1px solid #313947!important;border-radius:7px!important;box-shadow:none!important;padding:18px!important}
.rl-window{background:#11151b!important;border-radius:5px!important;border:1px solid #3c4654!important}
.rl-window:after{background:#e9edf8!important;box-shadow:0 0 9px #afbad3aa!important;width:2px!important}
.rl-tile{border-radius:5px!important;box-shadow:none!important}
.rl-tile.red,.rl-pill.red{background:#a94e58!important}
.rl-tile.black,.rl-pill.black{background:#333e4c!important}
.rl-tile.green,.rl-pill.green{background:#31846f!important}
.rl-tile.red-bait{background:#a94e58!important;border:2px solid #d8b86c!important}
.rl-tile.black-bait{background:#333e4c!important;border:2px solid #d8b86c!important}
.rl-choice-grid{gap:8px!important}
.rl-choice{background:#191e25!important;border:1px solid #333c47!important;border-radius:6px!important;padding:14px!important}
.rl-choice h3{font-size:15px!important}
.rl-choice button{border-radius:5px!important;font-size:11px!important}
.rl-status{background:#253f35!important;color:#c5edd5!important}
.rl-timer{font-size:24px!important;color:#dae1ed!important}
.rl-pill{border-radius:4px!important}
/* Chat acts like a true integrated utility panel. */
.moon-chat{background:#131820!important;border:0!important;border-left:1px solid #2c3541!important;border-radius:0!important;box-shadow:none!important}
.chat-head{background:#1b212a!important;color:#cbd7e8!important;border-bottom:1px solid #303945!important;letter-spacing:.04em!important;font-size:11px!important}
.chat-feed{background:#131820!important;padding:11px!important}
.chat-msg{border-bottom:1px solid #262f39!important}
.chat-msg p{font-size:11px!important;color:#d0d9e4!important;line-height:1.55!important}
.chat-user{color:#c6d2e8!important}
.chat-level{background:#273243!important;border:1px solid #485777!important;color:#d2dcf5!important;border-radius:3px!important}
.moon-chat form{background:#191f28!important;border-color:#303944!important}
.moon-chat form input{background:#121820!important;border-color:#3b4654!important}
.chat-mobile{border-radius:5px!important;background:#35465f!important;border:1px solid #5c6d8a!important;box-shadow:none!important}
/* Consistent forms/alerts/interactive states on mobile. */
@media(max-width:1200px){.mb-game-rail{grid-template-columns:repeat(3,minmax(0,1fr))!important}.mb-home-columns{grid-template-columns:minmax(0,1fr)!important}.mb-home-columns>.mb-home-side{margin:0!important}}
@media(max-width:900px){.mb-home-welcome{grid-template-columns:minmax(0,1fr)!important}.mb-home-emblem{display:none!important}.mb-quickstats{grid-template-columns:repeat(2,minmax(0,1fr))!important}.mb-quickstats>div:nth-child(3){border-left:0!important;border-top:1px solid #2e3540}.mb-quickstats>div:nth-child(4){border-top:1px solid #2e3540}.battle-card{grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;gap:14px!important}.battle-card .actions{justify-content:flex-start!important}.mb-create-layout{grid-template-columns:minmax(0,1fr)!important}.mb-create-side{order:-1!important}.mb-create-summary{position:static!important}.toolbar{flex-wrap:wrap!important}}
@media(max-width:620px){.main-content{padding-left:12px!important;padding-right:12px!important}.mb-home-copy{padding:22px!important}.mb-home-copy h1{font-size:31px!important}.mb-game-rail{grid-template-columns:repeat(2,minmax(0,1fr))!important}.mb-game-card{min-height:155px!important}.mb-game-glyph{margin:10px 0!important}.mb-quickstats>div{padding:12px!important}.battle-card{grid-template-columns:minmax(0,1fr)!important}.toolbar .selects{width:100%!important}.toolbar .selects>*{min-width:0;flex:1}.case-detail-layout{grid-template-columns:minmax(0,1fr)!important}.case-focus{position:static!important}.mb-create-section .format-choices{grid-template-columns:repeat(2,minmax(0,1fr))!important}.modal-content:has(.mb-create-layout){width:calc(100vw - 16px)!important;max-height:94dvh!important}.page-header h1{font-size:26px!important}.bj-board{border-radius:80px 80px 8px 8px / 35px 35px 8px 8px!important;padding:15px 8px!important;min-height:440px!important}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}}


/* ==== moonbet-v15.css ==== */
/* Moonclutch V11.5 — cohesive compact product layout. Never affects game outcome or wallet data. */
:root { --mb-l15-text:#ecf0f5; --mb-l15-muted:#929dab; --mb-l15-border:#303741; --mb-l15-surface:#171b21; }
html{scroll-behavior:smooth}
body{background:#0d0f13!important}
#app{isolation:isolate}
#app :where(h1,h2,h3){text-wrap:balance}
#app :where(.panel,.case-tile,.battle-card,.feature-card,.stat-tile){box-shadow:none!important;backdrop-filter:none!important}
#app :where(.panel,.case-tile,.battle-card,.feature-card,.stat-tile):focus-within{border-color:#64789c!important}
#app :where(.panel,.case-tile,.battle-card,.feature-card,.stat-tile) :where(button,input,select):focus-visible{outline:2px solid #d0dafa!important}
#app .page-header{background:transparent!important;border:0!important;border-bottom:1px solid #303741!important;border-radius:0!important;min-height:100px!important;padding:16px 0 20px!important;margin-bottom:18px!important}
#app .page-header:before{display:none!important}
#app .page-header h1{font-size:clamp(23px,2.7vw,32px)!important;margin:1px 0 4px!important;line-height:1.16!important}
#app .page-header .eyebrow{font-size:10px!important;color:#9ca8bc!important;margin-bottom:7px!important}
#app .page-header p{margin:3px 0 0!important;max-width:730px}
#app .page-top-actions{right:0!important;top:50%!important}
#app .heading{border-bottom:1px solid #252c36;padding-bottom:9px;margin:20px 0 12px!important}
#app .heading h2{font-size:17px!important}
#app :where(.panel,.battle-card,.case-tile){background:#191e25!important;border:1px solid #2e3540!important}
#app .battle-card{border-radius:5px!important;gap:12px!important;padding:12px 14px!important}
#app .battle-card .battle-title{font-size:14px!important}
#app .battle-card .player-seats{min-width:0}
#app .battle-card .actions{white-space:nowrap}
#app .battle-card .btn{min-height:32px!important}
#app .participant-grid{gap:8px!important}
#app .participant-card{min-width:0!important;border-radius:5px!important;padding:13px!important}
#app .battle-layout{gap:12px!important}
#app .battle-updates{margin-top:12px!important}
#app .round-track{display:flex;flex-wrap:wrap;gap:4px!important}
#app .round{border-radius:4px!important}
#app .case-detail-layout{gap:12px!important}
#app .case-focus .case-box{filter:none!important;text-shadow:none!important}
#app .table-items{max-height:530px;overflow:auto;scrollbar-width:thin}
#app .item-row{border-bottom:1px solid #2d3540!important}
#app .item-row:hover{background:#232a33}
#app .item-percent{font-variant-numeric:tabular-nums}
#app .mb-profile-tabs{border-bottom:1px solid #333c49!important}
#app .mb-profile-tabs button.active{box-shadow:inset 0 -2px #9caed4!important}
#app .mb-profile-tabs button{border-radius:0!important}
#app .mb-home-emblem{background:#1a2028!important}
#app .mb-home-welcome{min-height:242px!important}
#app .mb-home-copy{padding:24px 28px!important}
#app .mb-home-emblem .mb-emblem-moon{box-shadow:none!important}
#app .mb-game-glyph{font-size:28px!important;margin:13px 0 10px!important}
#app .mb-game-card{min-height:154px!important;padding:13px!important}
#app .mb-game-card strong{font-size:13px!important}
#app .mb-game-card small{font-size:10px!important}
#app .mb-quickstats{margin-bottom:18px!important}
#app .mb-quickstats>div{padding:11px 15px!important}
#app .mb-quickstats strong{font-size:18px!important}
#app .case-grid{gap:10px!important}
#app .case-tile{min-height:228px!important}
#app .case-art{min-height:122px!important}
#app .case-info{padding:12px!important}
#app .case-info h3{font-size:15px!important}
#app .toolbar{border-radius:5px!important}
#app .stats-grid{margin:12px 0 18px!important;gap:7px!important}
#app .stat-tile{padding:11px!important}
#app .stat-icon{width:33px!important;height:33px!important;font-size:17px!important}
#app .stat-tile strong{font-size:17px!important}
#app .stat-tile small{font-size:9px!important}
#app .mb-create-section{padding:13px!important}
#app .mb-create-summary{padding:15px!important}
#app .mb-create-summary h3{margin-bottom:12px!important}
#app .mb-v15-collection-tools,#app .mb-v15-battle-tools{display:flex;gap:9px;align-items:center;border:1px solid #303944;background:#181d24;padding:10px 12px;border-radius:5px;margin-bottom:10px}
#app .mb-v15-collection-tools label,#app .mb-v15-battle-tools label{font-size:9px;font-weight:750;letter-spacing:.08em;color:#a2adbd;white-space:nowrap}
#app .mb-v15-collection-tools input,#app .mb-v15-battle-tools input{flex:1;min-width:140px;min-height:36px;background:#10151b!important}
#app .mb-v15-battle-tools select{min-width:153px;max-width:190px;min-height:36px}
#app .mb-v15-collection-tools>span,#app .mb-v15-battle-tools>span{font-size:10px;color:#929fae;white-space:nowrap;font-variant-numeric:tabular-nums}
#app .mb-v15-empty{padding:35px;color:#a6b0c0;border:1px dashed #3d4654;border-radius:5px}
#app .mb-v15-rounds{max-height:178px;overflow:auto;margin:12px 0;padding:5px 0;border-top:1px solid #34404e;border-bottom:1px solid #34404e}
#app .mb-v15-rounds>div{display:grid;grid-template-columns:24px 1fr;gap:7px;align-items:center;padding:5px;font-size:11px}
#app .mb-v15-rounds>div:nth-child(even){background:#252d37}
#app .mb-v15-rounds span{font-size:9px;color:#92a2bb;font-variant-numeric:tabular-nums}
#app .mb-v15-rounds b{font-weight:560;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#app .mb-v15-rounds p{font-size:11px;color:#95a1b3}
#app .mb-v15-app-footer{font-size:10px;color:#7d8899;padding:20px 0 2px;margin-top:28px;border-top:1px solid #29313b;display:flex;gap:12px;justify-content:space-between;flex-wrap:wrap}
#app .mb-v15-app-footer span{white-space:nowrap}
.moon-chat{background:#12171e!important;border-left:1px solid #303945!important}
.moon-chat :where(input,textarea){background:#191f27!important}
#app .bj-board{box-shadow:none!important}
#app .bj-root .panel,#app .rl-root .panel,#app .keno-root .panel{border-color:#343b46!important}
#app .rl-root :where(.rl-option,.rl-choice,.rl-tiles){border-radius:5px!important}
#app .keno-root :where(button,.keno-number,.keno-tile){border-radius:5px!important}
@media(max-width:1100px){#app .battle-card{grid-template-columns:minmax(150px,1fr) minmax(135px,1fr) auto!important}#app .battle-card .battle-desc{display:none!important}}
@media(max-width:760px){
 #app .page-header{padding:9px 0 17px!important;min-height:auto!important}
 #app .page-header:has(.page-top-actions){padding-right:0!important}
 #app .page-top-actions{position:static!important;transform:none!important;margin:11px 0 0!important;width:100%}
 #app .page-top-actions button{width:100%}
 #app .mb-v15-collection-tools,#app .mb-v15-battle-tools{flex-wrap:wrap;gap:7px}
 #app .mb-v15-collection-tools label,#app .mb-v15-battle-tools label{width:100%}
 #app .mb-v15-collection-tools input,#app .mb-v15-battle-tools input{min-width:0;flex-basis:100%}
 #app .mb-v15-battle-tools select{flex:1;max-width:none}
 #app .battle-card{grid-template-columns:minmax(0,1fr) auto!important}
 #app .battle-card .battle-identity{min-width:0}
 #app .battle-card .player-seats{grid-column:1;grid-row:2}
 #app .battle-card .actions{grid-column:2;grid-row:1/3}
 #app .mb-home-columns{grid-template-columns:1fr!important}
 #app .mb-home-columns>.mb-home-side{margin-top:0!important}
 #app .mb-home-welcome{grid-template-columns:1fr!important}
 #app .mb-home-emblem{display:none!important}
 #app .mb-game-rail{grid-template-columns:repeat(2,minmax(0,1fr))!important}
 #app .mb-game-card{min-height:144px!important}
 #app .mb-create-layout{grid-template-columns:1fr!important}
 #app .mb-create-side{order:1}
 #app .mb-create-summary{position:static!important}
}
@media(max-width:380px){#app .mb-game-rail{grid-template-columns:1fr!important}#app .mb-quickstats>div{padding:9px!important}#app .stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(prefers-reduced-motion:reduce){#app :where(.mb-game-card,.battle-card,.case-tile){transform:none!important}}


/* ==== moonbet-v16.css ==== */
/* Moonclutch V16: unified content architecture, controlled density and accessible controls.
   Visual-only overrides; existing API / game / authentication implementations remain intact. */
:root{--mb16-bg:#0d0f13;--mb16-rail:#12151b;--mb16-surface:#191d24;--mb16-hover:#242932;--mb16-line:#2a2f38;--mb16-text:#f2f3f5;--mb16-muted:#949ba6;--mb16-accent:#8591c8;--mb16-green:#36be83;--mb16-radius:6px;--mb16-space:12px}
html{color-scheme:dark}
body{background:var(--mb16-bg);font-kerning:normal}
.app-shell{min-height:calc(100dvh - 86px)}
.topbar{position:sticky!important;top:0;z-index:80!important}
#app{min-width:0;overflow-wrap:anywhere}
#app .page-header,#app .bj-hero{max-width:none!important}
#app .page-header h1,#app .bj-hero h1,#app .rl-root h1{font-size:clamp(22px,2.35vw,31px)!important;line-height:1.16!important}
#app :is(.battle-card,.mb-game-card,.case-tile,.panel,.stat-tile,.participant-card){transition:background-color .17s,border-color .17s!important}
#app .battle-card:hover,#app .case-tile:hover{transform:none!important;box-shadow:none!important;background-color:#222831!important}
#app button:not(.hamburger):not(.sidebar-toggle){touch-action:manipulation}
.modal-content .mb-create-layout{align-items:start!important}
.modal-content .mb-create-main{min-width:0}
.modal-content .mb-create-side{position:sticky;top:82px;min-width:0}
.modal-content .mb-create-section{margin-bottom:10px!important}
.modal-content .mb-create-summary{box-shadow:0 6px 22px #0002!important}
.modal-content .mb-create-summary .mb-summary-row{gap:10px}
.modal-content #selectedRoundPreview{display:flex;flex-direction:column;gap:0;max-height:230px;overflow:auto;padding:5px 0}
.modal-content .mb-round-row{display:grid;grid-template-columns:24px minmax(0,1fr) auto;gap:9px;align-items:center;min-height:40px;padding:5px 4px;border-bottom:1px solid #303741}
.modal-content .mb-round-row:nth-child(even){background:#202631}
.modal-content .mb-round-row > span{font-size:10px;color:#95a2b6;font-variant-numeric:tabular-nums}
.modal-content .mb-round-row > b{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:600}
.modal-content .mb-round-controls{display:flex;gap:4px}
.modal-content .mb-round-controls button{width:30px;height:29px!important;min-height:29px;border:1px solid #485369;background:#222b39;border-radius:4px;color:#e1e8f5;cursor:pointer}
.modal-content .mb-round-controls button:hover:not(:disabled){background:#344258;border-color:#8591c8}
.modal-content .mb-round-controls button:disabled{opacity:.3;cursor:default}
#app :is(.bj-wrap,.keno-root,.rl-root){width:100%;max-width:100%;min-width:0}
#app :is(.bj-board,.keno-board,.rl-spinner,.rl-track){max-width:100%}
#app .bj-footer{gap:12px!important}
#app .bj-panel{background:var(--mb16-surface)!important;border:1px solid var(--mb16-line)!important;box-shadow:none!important}
#app .keno-root button,#app .bj-root button,#app .rl-root button{font-size:12px}
#app .mb-profile-tabs{display:flex;gap:0;overflow-x:auto;white-space:nowrap}
#app .mb-profile-tabs button{min-width:90px;padding:12px 16px!important}
#app .profile-grid{align-items:start}
#app .profile-card{min-width:0}
#app .case-detail-layout{align-items:start}
#app .table-items{overscroll-behavior:contain}
#app .battle-list{max-width:100%}
#app .battle-card{min-width:0}
#app .battle-card .meta-row{flex-wrap:wrap}
#app .battle-card .mini-result{overflow-wrap:anywhere}
#app :is(.mb-v15-collection-tools,.mb-v15-battle-tools) input{font-size:13px!important}
#app :is(.mb-v15-collection-tools,.mb-v15-battle-tools) label{color:#b8c4d5!important}
.moon-chat{box-shadow:none!important}
.moon-chat button:focus-visible{outline:2px solid #cad5f6!important}
.modal-content{max-height:min(90dvh,980px);overflow-y:auto;overscroll-behavior:contain}
.modal-content .mb-create-layout{align-items:start}
.modal-layer:not(.hidden){padding:12px}
#app .mb-v15-app-footer{align-items:center}
@media(max-width:1100px){.modal-content .mb-create-side{position:static}.modal-content .mb-create-layout{grid-template-columns:1fr!important}}
@media(max-width:990px){.topbar{position:sticky!important;top:0}.sidebar.open{z-index:110!important;overflow:auto;max-height:calc(100dvh - 60px)}#app{padding-bottom:75px}}
@media(max-width:760px){
 #app .mb-home-welcome,#app .mb-home-columns,#app .case-detail-layout,#app .battle-layout,#app .profile-grid{grid-template-columns:minmax(0,1fr)!important}
 #app .mb-home-copy{padding:18px!important}
 #app .mb-game-grid,#app .case-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
 #app .mb-game-card{min-height:150px!important}
 #app .case-tile{min-height:190px!important}
 #app .case-art{min-height:100px!important}
 #app .mb-v15-app-footer span{white-space:normal}
 .modal-content{width:min(100%,620px)!important;max-width:100%!important;margin:auto}
 .modal-content.wide{width:100%!important}
 .modal-content .mb-create-side{position:static}
 .modal-content .mb-round-row{min-height:44px}
}
@media(max-width:420px){
 #app .mb-game-grid,#app .case-grid{gap:7px!important}
 #app .mb-game-card{min-height:143px!important;padding:10px!important}
 #app .mb-game-card strong{font-size:12px!important}
 #app .case-info{padding:9px!important}
 #app .battle-card{display:flex!important;flex-wrap:wrap!important;gap:8px!important}
 #app .battle-card .battle-identity{flex:1 1 190px}
 #app .battle-card .player-seats{flex:1 1 140px}
 #app .battle-card .actions{flex:1 1 100%;display:flex;flex-wrap:wrap}
 #app .battle-card .actions>*{flex:1 1 auto}
 .brand-tagline,.online-state{display:none!important}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}#app :is(.case-tile,.battle-card,.mb-game-card),.modal-content{transition:none!important;animation:none!important}}

/* Creation dialog is outside #app: these rules intentionally target the modal itself. */
.modal-content .mb-create-section{background:#191d24!important;border:1px solid #2d3540!important;border-radius:5px!important;padding:14px!important}
.modal-content .mb-create-summary{background:#1b222c!important;border:1px solid #343d4a!important;border-radius:5px!important;padding:15px!important}
.modal-content .mb-create-summary h3{font-size:17px!important;margin:8px 0 12px!important}
.modal-content .mb-create-section .choose{min-height:36px;border-radius:4px!important}
.modal-content .mb-create-section .choose.active{background:#35435a!important;border-color:#8697c2!important}
.modal-content .mb-create-section .qty-control{border-radius:4px!important;background:#1e2530!important}
.modal-content .mb-v15-rounds{max-height:230px;overflow:auto;margin:12px 0;padding:5px 0;border-top:1px solid #34404e;border-bottom:1px solid #34404e}
@media(max-width:760px){.modal-content .mb-create-layout{grid-template-columns:minmax(0,1fr)!important}.modal-content .mb-create-side{position:static!important}}

/* V17: global dialog, focus and readable motion/accessibility rules */
body.mb-dialog-open{overflow:hidden}
.modal-layer:not(.hidden){position:fixed;inset:0;z-index:300;display:flex;align-items:center;justify-content:center;overflow-y:auto;padding:16px;background:rgba(6,8,12,.82)}
.modal-content[role="dialog"]{position:relative;flex:0 1 760px;min-width:0;max-height:calc(100dvh - 32px);overflow:auto;overscroll-behavior:contain;outline:none}
.modal-content[role="dialog"].wide{flex-basis:1000px}
:is(button,a,input,select,textarea,[tabindex]):focus-visible{outline:2px solid #b9c7ee!important;outline-offset:3px!important}
[aria-disabled="true"]{cursor:not-allowed;opacity:.55}
@media (max-width:600px){.modal-layer:not(.hidden){padding:8px;align-items:center}.modal-content[role="dialog"]{max-height:calc(100dvh - 16px)}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}}
