/* V18: unified, purpose-built responsive polish for free non-monetary demonstrations.
   Presentation only: no game result, wallet, account or API logic is changed. */
:root{--mb-ink:#f2f3f5;--mb-bg:#0d0f13;--mb-panel:#191d24;--mb-hairline:#2a2f38;--mb-soft:#242932;--mb-accent:#8591c8;--mb-success:#36be83;--mb-danger:#d96565}
html{font-size:14px;scrollbar-color:#434b58 #101217}body{background:var(--mb-bg);font-family:Inter,ui-sans-serif,system-ui,-apple-system,'Segoe UI',sans-serif}
:where(a,button,input,select,textarea,[tabindex]):focus-visible{outline:2px solid #aab8e6!important;outline-offset:3px}
:where(button,input,select,textarea){font:inherit}
:where(button,a){-webkit-tap-highlight-color:transparent}
:where(button):disabled{opacity:.44;cursor:not-allowed;filter:none!important}
.main-content{min-height:calc(100dvh - 87px);overflow:clip}
.main-content :where(.panel,.feature-card,.battle-card,.stat-tile,.case-tile,.bj-panel,.roulette-panel,.keno-panel){transition:border-color 160ms ease,background-color 160ms ease}
.main-content :where(.panel,.feature-card,.battle-card,.case-tile){box-shadow:none!important}
.main-content :where(.heading,.page-header){min-width:0}
.main-content :where(.page-header p,.heading p){line-height:1.65}
.main-content :where(.btn,.choose,.tab){min-height:38px;white-space:normal;text-align:center}
.main-content :where(.field input,.field select,.field textarea){width:100%;max-width:100%}
.main-content :where(.mb-round-controls button,.qty-control button){min-height:34px;min-width:34px}
/* A visually distinct surface for each game, without template-style card repetition. */
.bj-board{background:radial-gradient(ellipse at 52% 36%,#213538 0%,#152529 58%,#111b20 100%)!important;border:1px solid #36464b!important;border-radius:14px!important;box-shadow:inset 0 20px 70px #08131666!important;padding:28px!important}
.bj-zone strong{font-size:11px;letter-spacing:.13em;color:#adbcc4}
.bj-divider{background:linear-gradient(90deg,transparent,#536970,transparent)}
.bj-divider:after{background:#18282b;color:#a6b9c1;letter-spacing:.1em}
.bj-commands{border-top:1px solid #324248;padding-top:17px;margin-top:10px}
.bj-command{border-radius:5px;background:#27353b;border-color:#46565d;color:#e6eaec;min-width:92px;letter-spacing:.02em}
.bj-command:hover:not(:disabled){background:#33474e;transform:none}
.bj-command.main{background:#869ac0;color:#0f1620;border-color:#a1b2d1}
.bj-panel{border-radius:7px;background:#171c23;border-color:#303840}
.bj-soundbar button{border-radius:5px;background:#252b34;border-color:#3a4551;color:#d9e2f1}
.bj-volume{color:#bcc5d4}.bj-volume input{accent-color:#8591c8}
.keno-wrap{width:100%;max-width:1320px}
.keno-wrap :where(.keno-panel,.keno-board){border:1px solid #2e3640!important;border-radius:7px!important;background:#191d24!important}
.keno-wrap button:focus-visible{outline-offset:2px}
.roulette-wrap{max-width:1370px!important}
.roulette-wrap :where(.roulette-panel,.roulette-card){border:1px solid #303640!important;border-radius:7px!important;background:#191d24!important}
.roulette-wrap :where(.roulette-window,.roulette-slider){contain:paint}
/* Case reveals and battle summaries use dense information-first spacing. */
.case-grid{align-items:stretch}
.case-tile{display:flex;flex-direction:column;min-width:0}
.case-tile .case-info{flex:1}
.battle-card{grid-auto-flow:row;min-width:0}
.battle-card .actions{display:flex;gap:7px;flex-wrap:wrap;align-items:center}
.battle-card .meta-label{line-height:1.4}
.mb-create-layout{min-width:0}
.mb-create-main,.mb-create-side,.mb-create-section{min-width:0}
.mb-create-summary{position:sticky;top:12px}
.mb-round-row{min-width:0;overflow-wrap:anywhere}
.mb-round-row b{min-width:0;flex:1}
/* No loss of context when a drawer or dialog is opened on a phone. */
.modal-layer{padding:12px;overscroll-behavior:contain}
.modal-content{max-height:calc(100dvh - 24px)!important;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin}
.modal-content .mb-create-layout{max-width:100%}
.moon-chat .chat-feed{overscroll-behavior:contain}
.moon-chat .chat-msg p{overflow-wrap:anywhere;white-space:pre-wrap}
.moon-chat .chat-head button{min-width:36px;min-height:36px}
.chat-mobile{min-width:56px;min-height:40px;border:1px solid #4a5669!important;background:#242b36!important;color:#e2e8f3!important;border-radius:6px!important}
.chat-mobile[aria-expanded="true"]{background:#364257!important}
/* Offline font fallback: no external font service is required to display the site. */
@media(max-width:1200px){.main-content{padding:16px!important}.mb-home-columns{grid-template-columns:minmax(0,1fr)!important}.mb-home-side{min-width:0}}
@media(max-width:1050px){.main-content{padding-right:16px!important}.moon-chat{max-width:min(370px,calc(100vw - 18px))!important}}
@media(max-width:990px){.main-content{max-width:100vw}.sidebar{z-index:45}.mb-create-layout{grid-template-columns:minmax(0,1fr)!important}.mb-create-summary{position:static}.mb-home-welcome{grid-template-columns:minmax(0,1fr)!important}.mb-home-emblem{display:none!important}}
@media(max-width:700px){.main-content{padding:12px!important}.main-content :where(.page-header,.panel){padding:13px!important}.page-header:has(.page-top-actions){padding-right:13px!important}.page-top-actions{position:static!important;transform:none!important;margin-top:12px}.page-top-actions .btn{min-width:0}.mb-home-copy{padding:22px 18px!important}.mb-game-rail{grid-template-columns:repeat(2,minmax(0,1fr))!important}.mb-home-welcome{min-height:0!important}.mb-home-copy h1{font-size:clamp(27px,7vw,38px)!important}.bj-board{padding:16px 8px!important}.bj-deck{right:5px!important}.bj-commands{gap:6px}.bj-command{min-width:0;flex:1 1 83px;padding:12px 8px}.bj-footer{grid-template-columns:1fr!important}.battle-card .actions{width:100%}.battle-card .actions .btn{flex:1}.mb-round-row{gap:5px}.modal-layer{padding:5px}.modal-content{width:100%!important;max-height:calc(100dvh - 10px)!important}.roulette-wrap,.keno-wrap,.bj-wrap{max-width:100%;overflow-x:clip}}
@media(max-width:410px){.mb-game-rail{grid-template-columns:1fr!important}.mb-home-copy h1{font-size:28px!important}.page-header h1{font-size:23px!important}.bj-card{width:46px;height:72px}.bj-card i{font-size:20px;top:26px}.bj-card b{font-size:12px}.bj-deck{width:34px;height:55px;top:45%;font-size:20px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.001ms!important;transition-duration:.001ms!important}}