/* Illustrated brass and ink for the hub. Combat/card geometry lives in its own layers. */
:is(.game-shell, .dialog) {
  --cartoon-ink: #101a20;
  --cartoon-slate: #24343c;
  --cartoon-brass: #c49457;
  --cartoon-cream: #f7e7c3;
}

.game-shell .game-header {
  background: #203039;
  border-bottom-color: #bb9157;
  box-shadow: inset 0 2px #486067, 0 3px 0 #101a20, 0 7px 0 #101a2040;
}
.game-shell .game-wordmark {
  color: var(--cartoon-cream);
  text-shadow: 0 2px 0 var(--cartoon-ink);
}
.game-shell :is(.game-nav, .game-mobile-nav) .nav-item { color: #c1cbc5; }
.game-shell :is(.game-nav, .game-mobile-nav) .nav-item.active {
  color: #ffe8b7;
  background: #3c4b43;
  text-shadow: 0 1px #101a20;
}
.game-shell :is(.game-nav, .game-mobile-nav) .nav-item.active::before {
  background: #f0c278;
  box-shadow: 0 1px 0 #101a20;
}
.game-shell :is(.game-wallet, .game-settings, .game-profile-seal) {
  background: #2e4145;
  border-color: #b59463;
  color: var(--cartoon-cream);
  box-shadow: inset 0 1px #658078, 0 2px 0 var(--cartoon-ink);
}
.game-shell .game-more-menu {
  background: var(--cartoon-slate);
  border-color: var(--cartoon-brass);
  border-radius: 5px 12px 5px 12px;
  box-shadow: inset 0 2px #52635b, 0 0 0 2px var(--cartoon-ink), 0 7px 0 #101a2099;
}
.game-shell .game-more-menu .nav-item.active,
.game-shell .game-more[open] > summary,
.game-shell .game-more.has-current-page > summary {
  color: #ffe8b7;
  border-color: var(--cartoon-brass);
  background: #48513f;
}
.game-shell .game-more-menu .nav-item:hover { background: #3a4e50; }

/* Broad color planes replace reflective streaks on the main command surfaces. */
.game-shell .lobby-play {
  color: #30271f;
  background: linear-gradient(180deg, #f4d996 0 50%, #e7bd79 50% 100%);
  border-color: #fff0c7;
  border-bottom-color: #946136;
  box-shadow: inset 0 2px #fff4d5, inset 0 0 0 3px #76502c, 0 5px 0 var(--cartoon-ink);
  text-shadow: 0 1px #fff1cb;
}
.game-shell .lobby-play::before { background: none; border-color: #fff0c783; }
.game-shell :is(.lobby-quick-modes > button, .lobby-deck) {
  background: linear-gradient(180deg, #35494c 0 40%, #293b41 40% 100%);
  color: var(--cartoon-cream);
  border-color: #b89965;
  box-shadow: inset 0 1px #687b6a, 0 3px 0 var(--cartoon-ink);
}
.game-shell .lobby-quick-modes small { color: #c4cbbd; }
.game-shell .lobby-deck-info > strong { color: var(--cartoon-cream); }
.game-shell :is(.lobby-deck-info > small, .lobby-deck-info > span) { color: #c0c9bd; }

/* Solid backing keeps illustrated cards and cyan circuitry visually prominent. */
.game-shell :is(.account-panel, .rooms-panel, .deck-summary, .guide-feature, .history-stats, .history-row, .empty-state.big) {
  background: linear-gradient(180deg, #304047 0 4px, #213039 4px 100%);
  border-color: #ae8c57;
  box-shadow: inset 0 0 0 1px #17252b, 0 3px 0 var(--cartoon-ink), 0 7px 0 #101a203b;
}
.game-shell :is(.account-panel, .rooms-panel)::before { background: #e9c78c; box-shadow: 0 1px #152128; }
.game-shell :is(.room-option, .ranked-active-deck) {
  background: #172730;
  border-color: #697868;
  box-shadow: inset 0 1px #384e51;
}
.game-shell :is(.tabs, .account-auth-tabs, .collection-ownership, .deck-type-tabs > button, .deck-selected-filter, .search-box) {
  background-color: #182a32;
  border-color: #738375;
}
.game-shell :is(.tab.active, .account-auth-tabs > button.active, .collection-ownership > button[aria-pressed=true], .deck-type-tabs > button[aria-pressed=true], .deck-selected-filter.active) {
  color: #fff0ce;
  background: #435346;
  border-color: #e0b672;
  box-shadow: inset 0 -2px #e3ba77;
}
.game-shell .filter {
  color: #e1e4d5;
  background: #273b42;
  border-color: #728776;
  box-shadow: 0 2px 0 var(--cartoon-ink);
}
.game-shell .filter.active {
  color: #fff0ce;
  background: #465347;
  border-color: #edc889;
  box-shadow: inset 0 -2px #bd9256, 0 2px 0 var(--cartoon-ink);
}
.game-shell .search-box input { background-color: transparent; }
.game-shell :is(.account-auth-panel, .rooms-page, .deck-summary) input:not([type=checkbox]):not([type=range]) {
  background-color: #12232c;
  border-color: #849080;
  box-shadow: inset 0 2px #0c1b23;
}
.game-shell .deck-mobile-bar {
  background: #20323b;
  border-color: #c29d63;
  box-shadow: 0 -3px 0 var(--cartoon-ink);
}

/* Explicit page containers prevent these button materials leaking into a duel. */
.game-shell :is(.account-page, .rooms-page, .deck-editor, .page-heading, .empty-state) .button.primary,
.dialog .button.primary {
  color: #30271f;
  background: linear-gradient(180deg, #f5dda7 0 50%, #e5b972 50% 100%);
  border-color: #fff0c8;
  box-shadow: inset 0 2px #fff2cd, inset 0 -3px #956337, 0 0 0 1px #503b2b, 0 3px 0 #101a20;
  text-shadow: 0 1px #fff1cd;
}
.game-shell :is(.account-page, .rooms-page, .deck-editor, .page-heading, .empty-state) .button.secondary,
.dialog .button.secondary {
  color: #f5e7c9;
  background: linear-gradient(180deg, #3b5256 0 50%, #2a3f47 50% 100%);
  border-color: #b5a47c;
  box-shadow: inset 0 1px #7e8e7c, inset 0 -2px #1a2b33, 0 3px 0 #101a20;
}
.game-shell :is(.account-page, .rooms-page, .deck-editor, .page-heading, .empty-state) .button:disabled,
.dialog .button:disabled { box-shadow: none; }

.dialog {
  color: var(--cartoon-cream);
  background: #23333c;
  border-color: #cca36a;
  box-shadow: inset 0 0 0 2px #102029, 0 0 0 2px #101a20, 0 9px 0 #101a2080, 0 24px 50px #0006;
}
.dialog > header {
  background: #30444a;
  border-bottom-color: #b19161;
  box-shadow: inset 0 2px #617566;
}
.dialog > header .icon-button { background: #1c3039; border-color: #9a946e; color: #f7e7c3; }
.dialog > header .icon-button:hover { background: #405751; border-color: #f0cc8c; }
.dialog .setting-row { border-color: #637869; }
.dialog .setting-row small { color: #c1cbc2; }
#toast { background: #233a3c; border-color: #e0bb7b; box-shadow: 0 0 0 2px #101a20, 0 4px 0 #101a2099; }

@media (hover: hover) and (pointer: fine) {
  .game-shell .lobby-play:hover {
    background: linear-gradient(180deg, #ffe8b6 0 50%, #efca87 50% 100%);
  }
  .game-shell :is(.lobby-quick-modes > button, .lobby-deck):not(:disabled):hover {
    background: #3c5253;
    border-color: #f0cd91;
  }
  .game-shell :is(.account-page, .rooms-page, .deck-editor, .page-heading, .empty-state) .button.primary:not(:disabled):hover,
  .dialog .button.primary:not(:disabled):hover {
    background: linear-gradient(180deg, #ffebbc 0 50%, #efc987 50% 100%);
    box-shadow: inset 0 2px #fff7df, inset 0 -3px #956337, 0 0 0 1px #503b2b, 0 3px 0 #101a20;
  }
  .game-shell :is(.account-page, .rooms-page, .deck-editor, .page-heading, .empty-state) .button.secondary:not(:disabled):hover,
  .dialog .button.secondary:not(:disabled):hover {
    background: #405b5d;
    border-color: #f0d59e;
  }
}
@media (max-width: 700px) {
  .game-shell .game-mobile-nav {
    background: #203039;
    border-top-color: #c49d62;
    box-shadow: inset 0 2px #485d5c, 0 -3px 0 #101a20;
  }
}