/* Finish roadmap: shared surfaces and controls. Layout stays with each screen. */
:root {
  --ui-bg:#0d1422; --ui-surface:#182235; --ui-raised:#222e44;
  --ui-text:#f1eee7; --ui-muted:#bec8d8; --ui-gold:#ead09a;
  --ui-border:#71634e; --ui-divider:#46516a; --ui-focus:#9ddfff;
  --ui-radius:16px; --ui-control-radius:8px;
  --ui-shadow:0 24px 64px #0009;
  --ui-font:system-ui,-apple-system,"Segoe UI",sans-serif;
}
/* Floating audio controls otherwise cover the close button and currency badge. */
body:has(:is(.runicCorePanel,.spellbookPanel,.exploreMasteryPanel,.exploreInventoryPanel,.exploreVendorShopPanel):not(.hidden)) #wizardAudioControls {visibility:hidden;}
:is(.runicCoreShell,.spellbookShell,.exploreMasteryShell,.inventoryPhase2Shell,.exploreVendorShopShell,.adventurePanel,.menuPanel,.partyPanel) {
  color:var(--ui-text);border-color:var(--ui-border);border-radius:var(--ui-radius);
  background:linear-gradient(145deg,var(--ui-surface),var(--ui-bg));
  box-shadow:var(--ui-shadow);font-family:var(--ui-font);
  scrollbar-color:#79718f var(--ui-bg);scrollbar-width:thin;
}
:is(.runicCoreAction,.spellbookClose,.runicCoreClose,.exploreMasteryClose,.exploreVendorShopClose,.inventoryPhase2Close,.schoolTrainingShortcut,.adventurePanel button) {
  color:var(--ui-text);background:var(--ui-raised);border:1px solid var(--ui-border);
  border-radius:var(--ui-control-radius);font-family:var(--ui-font);min-height:36px;
  transition:background .14s,border-color .14s;
}
:is(.runicCoreClose,.spellbookClose,.exploreMasteryClose,.exploreVendorShopClose,.inventoryPhase2Close) {min-width:36px;}
:is(.runicCoreAction,.spellbookClose,.runicCoreClose,.exploreMasteryClose,.exploreVendorShopClose,.inventoryPhase2Close,.adventurePanel button):hover:not(:disabled) {
  background:#30405b;border-color:var(--ui-gold);
}
:is(.runicCoreShell,.spellbookShell,.exploreMasteryShell,.inventoryPhase2Shell,.exploreVendorShopShell,.adventurePanel,.menuPanel,.partyPanel) :is(button,a,input,select,textarea):focus-visible {
  outline:2px solid var(--ui-focus);outline-offset:3px;
}
/* Rune information had 6–8px copy. Give stats and explanatory text distinct,
   readable scales, and let content scroll rather than hiding enlarged rows. */
.runicCoreBody {min-height:0;}
.runicOwnedPanel,.runicDetailsPanel {overflow:auto;background:var(--ui-bg);padding:14px;gap:12px;}
.runicDetailsPanel {display:flex;flex-direction:column;}
.runicDetailsPanel>* {flex-shrink:0;}
.runicOwnedRune {min-height:88px;height:max-content;padding:10px;grid-template-columns:39px minmax(0,1fr);grid-template-rows:max-content max-content;align-content:start;gap:5px 10px;}
.runicOwnedRune>.runicOwnedIcon {grid-row:1 / span 2;align-self:start;}
.runicOwnedRune>div strong {font-size:14px;line-height:1.35;white-space:normal;overflow:visible;overflow-wrap:anywhere;}
.runicOwnedRune>div small {font-size:11px;color:var(--ui-muted);line-height:1.5;white-space:normal;overflow:visible;overflow-wrap:anywhere;}
.runicOwnedRune>b {grid-column:2;justify-self:start;max-width:100%;font-size:9px;color:var(--ui-muted);white-space:normal;overflow-wrap:anywhere;}
.runicOwnedRune.locked {opacity:1;filter:saturate(.35);}
.runicSectionHead strong,.runicSubHead strong {font-size:15px;color:var(--ui-gold);}
.runicSectionHead small,.runicSubHead small {font-size:11px;line-height:1.5;color:var(--ui-muted);}
.runicEffect {padding:10px;gap:10px;background:var(--ui-surface);border-color:var(--ui-divider);}
.runicEffect b {font-size:12px;letter-spacing:.025em;}
.runicEffect small {font-size:12px;line-height:1.55;color:var(--ui-text);}
.runicCoreNextStats {font-size:12px;line-height:1.6;color:var(--ui-muted);}
.runicCoreNextStats :is(small,span) {font-size:12px;line-height:1.6;}
.runicCoreRole,.runicCoreTagline {font-size:13px;line-height:1.6;color:var(--ui-muted);}
.runicCoreSelectedRank {font-size:15px;color:var(--ui-gold);}
.runicCoreAction {font-size:13px;padding:10px 14px;}
.runicUpgradeCost span {font-size:10px;color:var(--ui-muted);}
.runicUpgradeCost strong {font-size:16px;}
.runicCoreActionStatus {font-size:12px;line-height:1.5;color:var(--ui-muted);}
.runicMilestoneCopy small,.runicSchoolGuide small {font-size:11px;line-height:1.5;color:var(--ui-muted);}
.runicCoreHeader small {font-size:12px;line-height:1.5;color:var(--ui-muted);}
@media(max-width:900px) {
  .runicCorePanel .runicCoreShell {display:block;overflow:auto;}
  .runicCorePanel .runicCoreBody {display:flex;flex-direction:column;gap:12px;height:auto;margin:12px 0;}
  .runicOwnedPanel,.runicFocusPanel,.runicDetailsPanel {min-height:0;overflow:visible;}
  .runicCorePanel .runicDetailsPanel {display:block;overflow:visible;}
  .runicDetailsScroll {overflow:visible;}
  .runicOwnedList {grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));max-height:280px;}
  .runicCoreMilestone {grid-template-columns:1fr;}
  .runicSchoolGuide {padding-left:0;padding-top:8px;border-left:0;border-top:1px solid var(--ui-divider);}
  .runicCoreFooterHint {display:none;}
}
@media(prefers-reduced-motion:reduce) {
  :is(.runicCoreShell,.spellbookShell,.exploreMasteryShell,.adventurePanel) * {scroll-behavior:auto;transition:none;}
}