/* Shared Clash Compass shell. Module data, layouts and game colors stay local. */
:root[data-theme="light"] {
  color-scheme: light;
  --paper: #f5f1e9; --surface: #fffdf8; --surface-2: #eae4d9; --subtle: #eae4d9;
  --ink: #302d28; --muted: #716b61; --line: #d9d1c3;
  --accent: #915536; --accent-2: #754127; --accent-soft: #eee0d2;
  --on-accent:#fffdf8; --control: #fffdf8; --good: #21744e; --shadow: none;
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --paper: #211f1c; --surface: #292621; --surface-2: #343029; --subtle: #343029;
  --ink: #f1eade; --muted: #bdb3a4; --line: #4b4439;
  --accent: #dca67a; --accent-2: #e9be9a; --accent-soft: #423328;
  --on-accent:#241d17; --control: #292621; --good: #84d9ae; --shadow: none;
}
html[data-theme]:has(body.compass-app), html[data-theme]:has(body.compass-league) { background:var(--paper)!important; }
html[data-theme] body.compass-app, html[data-theme] body.compass-league {
  color-scheme:inherit; color:var(--ink)!important; background:var(--paper)!important;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  -webkit-text-size-adjust:100%; text-size-adjust:100%;
}
.compass-app *, .compass-league * { box-sizing:border-box; }
.compass-app :is(button,a,input,select,textarea), .compass-league :is(button,a,input,select,textarea) { -webkit-tap-highlight-color:transparent; }
.compass-app :focus-visible, .compass-league :focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
.compass-skip { position:fixed; inset-block-start:-100px; inset-inline-start:16px; z-index:200; padding:14px 20px; color:var(--ink); background:var(--surface); }
.compass-skip:focus { inset-block-start:12px; }

/* A stable top bar; the complete tool directory opens below it. */
html[data-theme] body.compass-app .site-header {
  position:sticky; top:0; z-index:80; display:grid!important;
  grid-template-columns:auto minmax(0,1fr) auto auto auto auto;
  grid-template-areas:"brand primary language theme search menu";
  align-items:center; gap:8px 16px; min-height:76px;
  padding:10px max(24px,calc((100vw - 1440px)/2));
  padding-top:max(10px,env(safe-area-inset-top));
  color:var(--ink)!important; background:var(--paper)!important;
  border:0; border-bottom:1px solid var(--line)!important; border-radius:0; box-shadow:none!important;
}
html[data-theme] body.compass-app .brand, .compass-league .league-brand {
  grid-area:brand; display:flex; align-items:center; gap:10px; min-width:0;
  color:var(--ink)!important; font-size:18px; font-weight:750; letter-spacing:-.025em; white-space:nowrap; text-decoration:none;
}
html[data-theme] body.compass-app .brand>span:last-child { display:block; overflow:hidden; text-overflow:ellipsis; }
.brand-logo { display:block; flex:none; width:44px; height:44px; object-fit:contain; border-radius:11px; }
.compass-primary { grid-area:primary; display:flex; justify-content:center; gap:8px; min-width:0; }
.compass-primary a { display:flex; align-items:center; min-height:44px; padding:8px 12px; border-radius:8px; color:var(--muted); font-size:13px; font-weight:650; text-decoration:none; white-space:nowrap; }
.compass-primary a.active, .compass-primary a:hover { color:var(--accent); background:var(--accent-soft); }
html[data-theme] body.compass-app .nav-toggle { grid-area:menu; display:inline-flex; min-width:44px; width:44px; height:44px; padding:0; border:0; border-radius:9px; background:var(--surface-2); color:var(--ink); }
html[data-theme] body.compass-app .nav-toggle span:last-child { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
html[data-theme] body.compass-app .language-control { grid-area:language; margin:0; gap:3px; color:var(--ink); }
html[data-theme] body.compass-app .language-control select { min-height:44px; width:100px; color:var(--ink); }
html[data-theme] body.compass-app .theme-toggle { grid-area:theme; display:grid; place-items:center; min-width:44px; width:44px; height:44px; margin:0; border:0; border-radius:9px; color:var(--ink); background:var(--surface-2); }
html[data-theme] body.compass-app .mobile-search-button { grid-area:search; display:grid; place-items:center; width:44px; height:44px; min-width:44px; border:0!important; border-radius:9px; color:var(--ink)!important; background:var(--surface-2)!important; }
html[data-theme] body.compass-app .site-header>.header-search { display:none; }
html[data-theme] body.compass-app .header-nav { display:none; grid-area:auto; grid-column:1/-1; grid-row:2; width:100%; min-width:0; }
html[data-theme] body.compass-app .header-nav.is-open {
  display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); align-items:stretch;
  gap:4px 16px; max-height:calc(100dvh - 160px); overflow:auto; overscroll-behavior:contain;
  padding:14px 0 6px; border-top:1px solid var(--line);
}
html[data-theme] body.compass-app .header-nav a {
  display:flex; align-items:center; min-height:44px; min-width:0; padding:10px 14px;
  color:var(--ink)!important; font-size:14px; font-weight:550; line-height:1.35;
  text-align:start; white-space:normal; overflow-wrap:anywhere; border-radius:8px; box-shadow:none!important;
}
html[data-theme] body.compass-app .header-nav a:hover, html[data-theme] body.compass-app .header-nav a.active { background:var(--accent-soft)!important; color:var(--accent)!important; }
html[data-theme] body.compass-app #app { width:min(1440px,calc(100% - 48px)); margin-inline:auto; padding-top:28px; padding-bottom:32px; }
.compass-app #app :is(h1,h2,h3) { text-wrap:balance; }
.compass-app #app h1 { font-size:clamp(24px,3vw,32px); line-height:1.2; letter-spacing:-.035em; }
.compass-app .i18n-source { margin-top:20px; border-top:1px solid var(--line); padding:24px; color:var(--muted); }
.compass-tabs { display:none; }

/* The home screen starts with the task, followed by tools and a searchable index. */
body.compass-app.home-route { --home-ink:var(--ink); --home-muted:var(--muted); --home-dim:var(--muted); --home-line:var(--line); --home-line-strong:var(--line); --home-panel:var(--surface); --home-panel-2:var(--surface-2); --home-paper:var(--paper); --home-gold-bright:var(--accent); --home-blue:var(--accent); }
body.compass-app .home-product { grid-template-columns:minmax(0,1fr); gap:32px; padding:0; }
body.compass-app .home-product>*, body.compass-app .home-directory>* { min-width:0; }
body.compass-app .home-product-hero { display:block; min-height:0; margin:0; overflow:visible; border:0; border-radius:0; background:none; box-shadow:none; }
body.compass-app .home-product-hero-copy { display:block; width:100%; padding:8px 0 0; }
html[data-theme] body.compass-app .home-product-hero h1 { max-width:none; margin:0 0 24px; color:var(--ink)!important; font:750 clamp(25px,3vw,36px)/1.2 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important; letter-spacing:-.035em; }
body.compass-app .home-product-search { max-width:760px; margin:0; }
body.compass-app .home-product-search .search-card { grid-template-columns:180px minmax(0,1fr); gap:12px; }
html[data-theme] body.compass-app .home-product .home-product-search .kind-switch { border:0; border-radius:10px; background:var(--surface-2)!important; }
html[data-theme] body.compass-app .home-product .home-product-search .kind-switch button { min-height:46px; color:var(--muted)!important; font-size:14px; font-weight:650; }
html[data-theme] body.compass-app .home-product .home-product-search .kind-switch button.active { color:var(--accent)!important; background:var(--surface)!important; box-shadow:none!important; }
html[data-theme] body.compass-app .home-product .home-product-hero .search-box { height:52px; border-color:var(--line)!important; border-radius:10px; background:var(--surface)!important; box-shadow:none!important; }
body.compass-app .home-product .home-product-search .search-box input { color:var(--ink)!important; font-size:16px; background:transparent!important; }
body.compass-app .home-product .home-product-search .search-box input::placeholder { color:var(--muted)!important; }
body.compass-app .home-product .home-product-search .search-box button { color:#fff!important; background:#915536!important; font-size:14px; }
body.compass-app .home-product .home-favorites-section { margin-top:18px; color:var(--muted); background:none; }
html[data-theme] body.compass-app .home-product-hero :is(.fav-title,.fav-chip-info strong,.fav-chip-link,.fav-count,.fav-chip-info small,.fav-chip-remove) { color:var(--ink)!important; }
body.compass-app .home-product .fav-chip { color:var(--ink); background:var(--surface); border-color:var(--line); }
body.compass-app .home-feature-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; --home-ink:var(--ink); --home-muted:var(--muted); --home-line:var(--line); }
body.compass-app .home-feature { display:grid; grid-template-columns:100px minmax(0,1fr); grid-template-rows:auto; gap:16px; min-height:160px; padding:20px 0; border:0; border-block:1px solid var(--line); border-radius:0; color:var(--ink); background:none; box-shadow:none; }
body.compass-app .home-feature:hover { transform:none; background:var(--surface-2); box-shadow:none; }
body.compass-app .home-feature-art { align-self:center; height:100px; overflow:hidden; border-radius:10px; background:var(--surface-2)!important; }
body.compass-app .home-feature-art:after { display:none; }
body.compass-app .home-feature-art img { width:72px; height:72px; object-fit:contain; filter:none; }
body.compass-app .home-feature-unit:first-child { left:0; top:0; }
body.compass-app .home-feature-unit:last-child { right:0; top:30px; }
body.compass-app .home-feature-base .home-feature-art img { position:static; width:100%; height:100%; object-fit:cover; }
body.compass-app .home-feature-copy { align-self:center; padding:0; }
body.compass-app .home-feature-copy small { color:var(--muted); font-size:10px; }
body.compass-app .home-feature-copy h2 { margin:5px 0 8px; color:var(--ink); font-size:19px; }
body.compass-app .home-feature-copy p { min-height:0; color:var(--muted); font-size:13px; line-height:1.55; }
body.compass-app .home-feature-action { margin-top:12px; color:var(--accent); font-size:13px; }
body.compass-app .home-directory { padding:0; border:0; background:none; }
body.compass-app .home-directory-head { align-items:center; gap:20px; }
body.compass-app .home-directory-head h2 { font-size:24px; }
body.compass-app .home-directory-head>div>span { display:none; }
body.compass-app .home-directory-filter { min-height:46px; border-color:var(--line); background:var(--surface); }
body.compass-app .home-directory-filter input { color:var(--ink); font-size:16px; }
body.compass-app .home-category-chips { gap:8px; padding-block:16px 24px; }
body.compass-app .home-category-chips button { min-height:40px; border-color:transparent; border-radius:8px; color:var(--muted); background:var(--surface-2); font-size:13px; }
body.compass-app .home-category-chips button.active { border-color:transparent; color:var(--accent); background:var(--accent-soft); }
body.compass-app .home-directory-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:36px 48px; }
body.compass-app .home-directory-group { padding:0; border:0; background:none; box-shadow:none; }
body.compass-app .home-directory-group header { margin-bottom:10px; }
body.compass-app .home-directory-group h3 { color:var(--ink); font-size:17px; }
body.compass-app .home-directory-icon { color:var(--accent); background:var(--accent-soft); }
body.compass-app .home-route-list a { min-height:68px; padding:14px 0; border-bottom:1px solid var(--line); border-radius:0; color:var(--ink); }
body.compass-app .home-route-list strong { font-size:15px; }
body.compass-app .home-route-list small { color:var(--muted); font-size:13px; line-height:1.5; }

/* Flat editing areas and one palette for army creation and saved compositions. */
body.compass-app .ab-banner { display:none; }
body.compass-app .ab-page { max-width:none; }
body.compass-app .ab-top { margin:0 0 24px; }
body.compass-app .ab-top h1 { font-size:28px; }
body.compass-app :is(.ab-profile-bar,.ab-basics,.ab-section) { padding:20px 0; border:0; border-top:1px solid var(--line); border-radius:0; background:transparent; }
body.compass-app .ab-profile-bar form>label, body.compass-app :is(.ab-profile-hint,.ab-profile-loaded) { padding:0 16px 0 0; }
body.compass-app .ab-basics { margin-bottom:24px; }
body.compass-app .ab-name-field { width:100%; max-width:440px; }
body.compass-app .ab-section { margin:24px 0; }
body.compass-app .ab-section-head { margin:0 0 20px; }
body.compass-app .ab-section-head>div:first-child { padding:0; background:none; }
body.compass-app .ab-section-head h2 { font-size:20px; letter-spacing:-.015em; text-transform:none; }
body.compass-app .ab-selected-tray { margin:0 0 20px; padding:12px 0; background:transparent; }
body.compass-app .ab-th-list button { min-width:52px; min-height:44px; border-radius:8px; }
body.compass-app .ab-th-list button.active { outline:2px solid var(--accent); outline-offset:1px; color:var(--ink); }
body.compass-app :is(.ab-unit-grid,.ab-hero-grid) { gap:10px; }
body.compass-app .ab-profile-submit { background:#915536; color:white; }

/* Shared list and profile rhythm without adding nested frames. */
html[data-theme] body.compass-app :is(.section,.db-hero,.building-catalog-hero,.building-detail-hero,.army-overview) { border-radius:12px; box-shadow:none!important; }
body.compass-app :is(.entity-nav,.base-level-nav) { scroll-padding-inline:16px; scrollbar-width:thin; }
body.compass-app :is(.entity-nav a,.base-level-nav a) { min-height:44px; display:inline-flex; align-items:center; }
body.compass-app :is(.base-detail-page,.building-detail-page,.building-catalog-page) { max-width:none; }
body.compass-app .base-preview { height:clamp(340px,65dvh,860px); }
body.compass-app .base-detail-actions { padding-bottom:8px; }
body.compass-app pre { max-width:100%; overflow:auto; }
body.compass-app .calc-data-note { overflow-wrap:anywhere; }
body.compass-app .ranking-card { min-width:0; }
body.compass-app .ranking-card form { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px; }
body.compass-app .ranking-card input { min-width:0; width:100%; }
body.compass-app .espor-heading>div { flex-wrap:wrap; }
body.compass-app .espor-levels { min-width:0; overflow-x:auto; }

/* The separate CWL screen uses the same identity and touch targets. */
body.compass-league .league-header { position:sticky; top:0; z-index:80; display:flex; align-items:center; gap:24px; min-height:76px; padding:10px max(24px,calc((100vw - 1440px)/2)); padding-top:max(10px,env(safe-area-inset-top)); border-bottom:1px solid var(--line); background:var(--paper); }
body.compass-league .league-header nav { display:flex; flex:1; gap:12px; }
body.compass-league .league-header nav a { display:flex; align-items:center; min-height:44px; color:var(--muted); font-size:14px; text-decoration:none; }
body.compass-league .league-header nav a.active { color:var(--accent); }
body.compass-league .theme-toggle { min-width:44px; min-height:44px; border-radius:8px; color:var(--ink); background:var(--surface-2); }
body.compass-league #league-app { width:min(1440px,calc(100% - 48px)); margin-inline:auto; padding-bottom:max(24px,env(safe-area-inset-bottom)); }

@media(max-width:1100px) {
  .compass-primary { display:none; }
  html[data-theme] body.compass-app .site-header { grid-template-columns:minmax(0,1fr) auto auto auto auto; grid-template-areas:"brand language theme search menu"; }
  body.compass-app .home-feature-grid { gap:16px; }
  body.compass-app .home-feature { grid-template-columns:72px minmax(0,1fr); gap:12px; }
  body.compass-app .home-feature-art { height:80px; }
}
@media(max-width:767px) {
  html[data-theme] body.compass-app .site-header { grid-template-columns:minmax(0,1fr) 40px 40px 40px; grid-template-areas:"brand language search menu"; gap:8px; min-height:66px; padding:10px 16px; padding-top:max(10px,env(safe-area-inset-top)); }
  html[data-theme] body.compass-app .brand { gap:8px; font-size:16px; }
  .brand-logo { width:38px; height:38px; border-radius:9px; }
  html[data-theme] body.compass-app .language-control { position:relative; display:flex; justify-content:center; width:40px; height:44px; }
  html[data-theme] body.compass-app .language-control svg { position:absolute; width:21px; height:21px; opacity:1; pointer-events:none; }
  html[data-theme] body.compass-app .language-control select { position:relative; z-index:1; width:40px; height:44px; opacity:0; font-size:16px; }
  html[data-theme] body.compass-app :is(.mobile-search-button,.nav-toggle) { width:40px; min-width:40px; height:44px; }
  html[data-theme] body.compass-app .site-header>.theme-toggle { display:none; }
  html[data-theme] body.compass-app .site-header:has(.header-nav.is-open)>.theme-toggle { display:grid; grid-area:auto; grid-column:4; grid-row:3; }
  html[data-theme] body.compass-app .header-nav.is-open { grid-template-columns:repeat(2,minmax(0,1fr)); max-height:calc(100dvh - 220px - env(safe-area-inset-top) - env(safe-area-inset-bottom)); gap:4px; }
  html[data-theme] body.compass-app .header-nav a { font-size:14px; padding:12px; }
  html[data-theme] body.compass-app #app { width:calc(100% - 32px); padding-top:24px; padding-bottom:24px; }
  body.compass-app { padding-bottom:calc(74px + env(safe-area-inset-bottom)); }
  .compass-tabs { position:fixed; inset-inline:0; bottom:0; z-index:90; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:4px; min-height:68px; padding:6px max(10px,env(safe-area-inset-left)) calc(6px + env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-right)); border-top:1px solid var(--line); background:var(--surface); }
  .compass-tabs a,.compass-tabs button { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; min-height:54px; min-width:0; padding:4px; border:0; border-radius:9px; color:var(--muted); background:none; font:600 11px/1.2 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; text-decoration:none; text-align:center; }
  .compass-tabs svg { width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
  .compass-tabs .active { color:var(--accent); background:var(--accent-soft); }
  .compass-tabs.keyboard-open, html:has(:fullscreen) .compass-tabs { display:none; }
  body.compass-app .toast { bottom:calc(84px + env(safe-area-inset-bottom)); max-width:calc(100% - 32px); }
  body.compass-app .i18n-source { padding:20px 16px; font-size:12px; }
  html[data-theme] body.compass-app :is(input:not([type=checkbox]):not([type=radio]):not([type=range]),select,textarea), body.compass-league :is(input:not([type=checkbox]):not([type=radio]):not([type=range]),select,textarea) { min-height:44px; font-size:16px!important; }
  html[data-theme] body.compass-app button, body.compass-league button { min-height:44px; }
  body.compass-app .home-product { gap:28px; }
  body.compass-app .home-product-hero-copy { padding:0; }
  html[data-theme] body.compass-app .home-product-hero h1 { margin-bottom:18px; font-size:26px!important; }
  body.compass-app .home-product-search .search-card { grid-template-columns:1fr; gap:10px; }
  body.compass-app .home-feature-grid { grid-template-columns:1fr; gap:0; }
  body.compass-app .home-feature { min-height:130px; grid-template-columns:84px minmax(0,1fr); gap:18px; padding:18px 0; border-top:0; }
  body.compass-app .home-feature:first-child { border-top:1px solid var(--line); }
  body.compass-app .home-feature-art { height:90px; }
  body.compass-app .home-feature-copy h2 { font-size:19px; }
  body.compass-app .home-feature-copy small { display:none; }
  body.compass-app .home-feature-action { margin-top:8px; }
  body.compass-app .home-directory-head { flex-direction:column; align-items:stretch; gap:16px; }
  body.compass-app .home-directory-head h2 { font-size:23px; }
  body.compass-app .home-directory-filter { width:100%; max-width:none; }
  body.compass-app .home-category-chips { flex-wrap:nowrap; overflow-x:auto; padding:16px 0 22px; scrollbar-width:none; }
  body.compass-app .home-category-chips button { flex-shrink:0; white-space:nowrap; }
  body.compass-app .home-directory-grid { grid-template-columns:1fr; gap:28px; }
  body.compass-app .home-route-list a { padding-block:16px; }
  body.compass-app .ab-profile-bar { padding-block:20px; }
  body.compass-app .ab-profile-bar form>label,body.compass-app :is(.ab-profile-hint,.ab-profile-loaded) { padding:0; }
  body.compass-app .ab-profile-hint { padding-top:14px; }
  body.compass-app .ab-section { padding-inline:0; }
  body.compass-app .ab-selected-tray { margin-inline:0; padding-inline:0; }
  body.compass-app .ab-profile-bar input { min-width:0; }
  body.compass-app :is(.base-detail-game,.base-copy-link,.base-view-link,.ab-library-link,.ab-top-actions a,.ab-open-game) { display:flex; min-height:44px; align-items:center; justify-content:center; }
  body.compass-app .base-preview { min-height:260px; height:55dvh; }
  body.compass-league .league-header { flex-wrap:wrap; gap:8px 16px; padding-inline:16px; }
  body.compass-league .league-brand { flex:1; font-size:16px; }
  body.compass-league .league-header nav { order:3; flex-basis:100%; border-top:1px solid var(--line); }
  body.compass-league #league-app { width:calc(100% - 24px); }
  body.compass-league .league-toolbar { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px 8px; }
  body.compass-league .league-toolbar>* { min-width:0; width:100%; }
  body.compass-league .league-toolbar button { white-space:normal; overflow-wrap:anywhere; }
  body.compass-league .member-badges { flex-wrap:wrap; }
}
@media(prefers-reduced-motion:reduce) {
  .compass-app *, .compass-league * { animation-duration:.01ms!important; animation-iteration-count:1!important; transition-duration:.01ms!important; scroll-behavior:auto!important; }
}

/* Player development and JSON shortcuts stay directly below the identity. */
body.compass-app .player-quick-tools { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; margin:12px 0 20px; }
body.compass-app .player-quick-tools a { display:flex; align-items:center; justify-content:space-between; gap:12px; min-width:0; min-height:76px; padding:12px 0; border-bottom:2px solid var(--line); color:var(--ink); text-decoration:none; }
body.compass-app .player-quick-tools a>span:first-child { min-width:0; }
body.compass-app .player-quick-tools strong { display:block; font-size:18px; line-height:1.3; }
body.compass-app .player-quick-tools small { display:block; margin-top:6px; color:var(--muted); line-height:1.5; overflow-wrap:anywhere; }
body.compass-app .player-quick-tools a:hover,body.compass-app .player-quick-tools a:focus-visible { border-bottom-color:#ad733c; }
body.compass-app .player-quick-tools a:focus-visible { outline:2px solid #ad733c; outline-offset:4px; }
@media(max-width:480px) { body.compass-app .player-quick-tools { gap:16px; } body.compass-app .player-quick-tools strong { font-size:16px; } }

/* Shared interface: warm stone, copper and clear typographic hierarchy. */
html[data-theme] body:is(.compass-app,.compass-league) {
  --elevated:var(--surface); --gold:var(--accent); --olive:var(--good);
  --ab-bg:var(--paper); --ab-shell:var(--paper); --ab-panel:var(--surface); --ab-panel-2:var(--surface-2);
  --ab-card:var(--surface); --ab-line:var(--line); --ab-soft:var(--muted); --ab-text:var(--ink); --ab-accent:var(--accent); --ab-accent-2:var(--accent-2);
  font-size:15px; line-height:1.55; -webkit-font-smoothing:antialiased;
}
html[data-theme] body.compass-app #app,html[data-theme] body.compass-league #league-app { max-width:1280px; padding-top:36px; padding-bottom:48px; }
html[data-theme] body.compass-app #app :is(h1,h2,h3),html[data-theme] body.compass-league #league-app :is(h1,h2,h3) { color:var(--ink)!important; }
html[data-theme] body.compass-app #app h1,html[data-theme] body.compass-app .home-product-hero h1,html[data-theme] body.compass-league #league-app h1 {
  font-family:Georgia,"Times New Roman",serif!important; font-weight:700!important; font-size:clamp(28px,3.2vw,40px)!important; line-height:1.16!important; letter-spacing:-.035em!important; text-transform:none;
}
html[data-theme] body.compass-app #app h2,html[data-theme] body.compass-league #league-app h2 { letter-spacing:-.025em; line-height:1.3; }
html[data-theme] body.compass-app #app :is(.section-head p,.page-heading p,.entity-meta,.calc-data-note),html[data-theme] body.compass-league .league-hero p { color:var(--muted)!important; line-height:1.65; }
html[data-theme] body.compass-app .site-header,html[data-theme] body.compass-league .league-header { padding-inline:max(24px,calc((100vw - 1280px)/2)); }
html[data-theme] body.compass-app .brand,html[data-theme] body.compass-league .league-brand { letter-spacing:-.04em; }

/* Navigation uses an underline, never a glowing selected block. */
html[data-theme] body.compass-app :is(.compass-primary a,.header-nav a,.entity-nav a,.base-level-nav a),html[data-theme] body.compass-league .league-header nav a {
  border:0!important; border-bottom:2px solid transparent!important; border-radius:0!important; color:var(--muted)!important; background:transparent!important; box-shadow:none!important;
}
html[data-theme] body.compass-app :is(.compass-primary a,.header-nav a,.entity-nav a,.base-level-nav a):is(.active,[aria-current=page]),html[data-theme] body.compass-league .league-header nav a.active {
  color:var(--ink)!important; border-bottom-color:var(--accent)!important; font-weight:750;
}
html[data-theme] body.compass-app :is(.compass-primary a,.header-nav a,.entity-nav a,.base-level-nav a):hover { color:var(--accent)!important; }
html[data-theme] body.compass-app .entity-nav { gap:24px; padding:0; margin:24px 0; border:0; border-bottom:1px solid var(--line); background:transparent!important; border-radius:0; }
html[data-theme] body.compass-app .entity-nav a { padding:12px 0; white-space:nowrap; }
html[data-theme] body.compass-app .compass-tabs :is(a,button) { border-radius:0; background:transparent!important; }
html[data-theme] body.compass-app .compass-tabs .active { color:var(--accent)!important; }
html[data-theme] body.compass-app .header-nav a::before,html[data-theme] body.compass-app .header-nav a::after { display:none!important; }

/* Forms and controls share contrast, size and keyboard focus. */
html[data-theme] body:is(.compass-app,.compass-league) :is(button,input,select,textarea) { font-family:inherit; box-shadow:none!important; }
html[data-theme] body:is(.compass-app,.compass-league) :is(input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]),select,textarea) {
  max-width:100%; min-width:0; color:var(--ink)!important; background:var(--surface)!important; border-color:var(--line)!important; border-radius:8px!important; font-size:16px!important; line-height:1.45;
}
html[data-theme] body:is(.compass-app,.compass-league) input::placeholder,html[data-theme] body:is(.compass-app,.compass-league) textarea::placeholder { color:var(--muted)!important; opacity:1; }
html[data-theme] body:is(.compass-app,.compass-league) :is(input[type=checkbox],input[type=radio],input[type=range]) { accent-color:var(--accent); }
html[data-theme] body:is(.compass-app,.compass-league) :focus-visible { outline:2px solid var(--accent)!important; outline-offset:3px; }
html[data-theme] body.compass-app :is(.small-button,.entity-actions a,.ab-top-actions a,.base-preview-tools button,.base-detail-actions button,.lb-filters button,.lb-pagination button),html[data-theme] body.compass-league .league-toolbar button {
  min-height:44px; border:1px solid var(--line); border-radius:8px; color:var(--ink)!important; background:var(--surface)!important; font-weight:650; box-shadow:none!important;
}
html[data-theme] body.compass-app :is(.tool-form>button,.home-product .home-product-search .search-box button,.ab-profile-submit,.ab-create,.base-detail-game) {
  color:var(--on-accent)!important; background:var(--accent)!important; border-color:var(--accent)!important; border-radius:8px; box-shadow:none!important;
}
html[data-theme] body:is(.compass-app,.compass-league) button:disabled { cursor:not-allowed; opacity:.5; }
html[data-theme] body.compass-app :is(.note,.error,.player-json-notice,.player-snapshot-notice) { color:var(--ink)!important; background:var(--surface-2)!important; border:0!important; border-inline-start:3px solid var(--accent)!important; border-radius:0!important; padding:16px 20px; line-height:1.65; }
html[data-theme] body.compass-app :is(.note,.player-quick-tools,.entity-actions) a { color:var(--accent)!important; }

/* Open sections give profiles, catalogs, calculators and data pages one rhythm. */
html[data-theme] body.compass-app :is(.section,.db-hero,.building-catalog-hero,.building-detail-hero,.army-overview,.calculator-hero,.second-panel,.ranking-card,.zq-card,.ltm-card,.ltm-catch-row,.ltm-requirement) {
  color:var(--ink)!important; background:transparent!important; border:0!important; border-top:1px solid var(--line)!important; border-radius:0!important; box-shadow:none!important; padding:24px 0;
}
html[data-theme] body.compass-app :is(.section,.zq-card,.second-panel) :is(.section,.zq-card,.second-panel) { padding:18px 0; }
html[data-theme] body.compass-app .section-head { gap:20px; margin-bottom:24px; }
html[data-theme] body.compass-app .section-head h2 { margin:0 0 6px; font-size:21px; }
html[data-theme] body.compass-app .entity-head { padding:24px 0; border:0!important; border-bottom:1px solid var(--line)!important; border-radius:0!important; background:transparent!important; box-shadow:none!important; }
html[data-theme] body.compass-app .entity-score strong { color:var(--ink)!important; font-variant-numeric:tabular-nums; }
html[data-theme] body.compass-app .stat { padding:18px 16px; border:0!important; border-inline-start:1px solid var(--line)!important; border-radius:0!important; background:transparent!important; box-shadow:none!important; }
html[data-theme] body.compass-app .stat strong { color:var(--ink)!important; font-size:clamp(22px,2.5vw,30px); letter-spacing:-.025em; }
html[data-theme] body.compass-app .stat :is(span,small) { color:var(--muted)!important; }
html[data-theme] body.compass-app .stat-grid { gap:16px 0; }
html[data-theme] body.compass-app .player-quick-tools { gap:32px; margin-block:8px 28px; }
html[data-theme] body.compass-app .player-quick-tools a { min-height:96px; border-color:var(--line); }
html[data-theme] body.compass-app .player-quick-tools strong { color:var(--ink); font-size:20px; }
html[data-theme] body.compass-app .player-quick-tools small { font-size:13px; }

/* Consistent table density; wide game tables keep their existing scroll areas. */
html[data-theme] body.compass-app :is(.table-wrap,.lb-table-scroll,.espor-table-wrap) { border-radius:0!important; box-shadow:none!important; border:0!important; }
html[data-theme] body.compass-app table,html[data-theme] body.compass-league table { color:var(--ink); font-size:14px; font-variant-numeric:tabular-nums; }
html[data-theme] body.compass-app :is(th,td),html[data-theme] body.compass-league :is(th,td) { border-color:var(--line)!important; }
html[data-theme] body.compass-app th,html[data-theme] body.compass-league th { padding-block:14px; color:var(--muted)!important; background:var(--surface-2)!important; font-size:12px; font-weight:650; letter-spacing:.025em; text-transform:none; }
html[data-theme] body.compass-app td,html[data-theme] body.compass-league td { padding-block:16px; }
html[data-theme] body.compass-app tbody tr:hover,html[data-theme] body.compass-league tbody tr:hover { background:var(--surface-2)!important; }
html[data-theme] body.compass-app pre.raw { padding:20px; border:1px solid var(--line); border-radius:8px; background:var(--surface)!important; color:var(--ink)!important; line-height:1.65; font-size:13px; }

/* Home, saved armies and the two catalogs. */
html[data-theme] body.compass-app .home-product { gap:40px; }
html[data-theme] body.compass-app .home-feature { min-height:170px; padding-block:24px; }
html[data-theme] body.compass-app .home-feature:hover { background:transparent; }
html[data-theme] body.compass-app :is(.home-category-chips button,.base-kind-switch button,.base-sort-switch button) { background:transparent!important; color:var(--muted)!important; border:0!important; border-radius:0!important; border-bottom:2px solid transparent!important; }
html[data-theme] body.compass-app :is(.home-category-chips button,.base-kind-switch button,.base-sort-switch button).active { color:var(--ink)!important; border-bottom-color:var(--accent)!important; }
html[data-theme] body.compass-app :is(.base-layout-card,.building-card,.eq-card,.ab-card) { color:var(--ink)!important; background:var(--surface)!important; border:1px solid var(--line)!important; border-radius:10px!important; box-shadow:none!important; }
html[data-theme] body.compass-app :is(.base-layout-card,.building-card,.eq-card):hover { transform:translateY(-2px); border-color:var(--accent)!important; }
html[data-theme] body.compass-app :is(.ab-library-profile,.ab-catalog-toolbar) { margin-bottom:24px; padding-block:20px; border:0!important; border-block:1px solid var(--line)!important; background:transparent!important; border-radius:0!important; }
html[data-theme] body.compass-app :is(.ab-library-profile-status,.ab-profile-hint,.ab-catalog-meta) { color:var(--muted)!important; }
html[data-theme] body.compass-app .ab-th-list button.active { outline:0; color:var(--on-accent)!important; background:var(--accent)!important; }
html[data-theme] body.compass-app .ab-unit.selected { border-color:var(--accent)!important; background:var(--accent-soft)!important; box-shadow:none!important; }
html[data-theme] body.compass-app .ab-card-title h3 { font-size:20px; }

/* Development tools retain their charts while joining the shared theme. */
html[data-theme] body.compass-app .ltm-page { --ltm-panel:var(--surface); --ltm-row:var(--surface-2); --ltm-line:var(--line); --ltm-muted:var(--muted); --ltm-mint:var(--accent); font-family:inherit; color:var(--ink); }
html[data-theme] body.compass-app :is(.ltm-banner,.vt-profile-hero,.vt-hero,.zq-heading) { color:var(--ink)!important; border:0!important; border-bottom:1px solid var(--line)!important; border-radius:0!important; background:transparent!important; box-shadow:none!important; padding:16px 0 24px; }
html[data-theme] body.compass-app .ltm-heading { text-align:start; margin-block:24px; }
html[data-theme] body.compass-app .ltm-page :is(a,button) { color:var(--accent); }
html[data-theme] body.compass-app .ltm-page button { border-color:var(--line); border-radius:8px; background:var(--surface); }
html[data-theme] body.compass-app :is(.ltm-table-head,.ltm-category>summary) { border-radius:6px; }
html[data-theme] body.compass-app :is(.vt-page,.vt-profile,.vt-profile-page) { --vt-bg:var(--paper); --vt-panel:var(--surface); --vt-panel-2:var(--surface-2); --vt-panel-3:var(--surface-2); --vt-text:var(--ink); --vt-muted:var(--muted); --vt-line:var(--line); --vt-line-strong:var(--line); --vt-accent:var(--accent); --vt-accent-2:var(--accent-2); }
html[data-theme] body.compass-app #modernZapquake { --mzq-bg:var(--paper); --mzq-panel:var(--surface); --mzq-soft:var(--surface-2); --mzq-line:var(--line); --mzq-text:var(--ink); --mzq-muted:var(--muted); --mzq-orange:var(--accent); }
html[data-theme] body.compass-app .mzq-shell { margin:0; padding:20px 0; background:transparent!important; }
html[data-theme] body.compass-app .mzq-config { background:var(--surface)!important; border-color:var(--line); box-shadow:none; }
html[data-theme] body.compass-app .mzq-config>h2 { background:var(--surface-2); }
html[data-theme] body.compass-app .zq-profile-loader { background:var(--surface-2)!important; color:var(--ink)!important; border:0!important; }
html[data-theme] body.compass-app .zq-profile-loader label { color:var(--ink)!important; }
html[data-theme] body.compass-app .zq-profile-loader button { background:var(--accent)!important; color:var(--on-accent)!important; border-color:var(--accent)!important; }

/* CWL and direct-access management screens use the same quiet surfaces. */
html[data-theme] body.compass-league :is(.league-column,.member-card,.league-summary,.league-panel) { border-color:var(--line)!important; border-radius:8px; color:var(--ink); background:var(--surface); box-shadow:none; }
html[data-theme] body.compass-league .league-hero { padding-bottom:24px; margin-bottom:28px; border-bottom:1px solid var(--line); }
html[data-theme] body.compass-league .column-head { padding:18px 14px; }
html[data-theme] body.compass-league .public-member-row { padding-block:16px; }
html[data-theme] body.compass-league .league-header nav a.active { background:transparent; }

@media(max-width:767px) {
  html[data-theme] body.compass-app .site-header,html[data-theme] body.compass-league .league-header { padding-inline:16px; }
  html[data-theme] body.compass-app #app,html[data-theme] body.compass-league #league-app { padding-top:24px; padding-bottom:28px; }
  html[data-theme] body.compass-app #app h1,html[data-theme] body.compass-app .home-product-hero h1,html[data-theme] body.compass-league #league-app h1 { font-size:28px!important; }
  html[data-theme] body.compass-app .entity-head { gap:16px; padding-top:4px; padding-bottom:20px; }
  html[data-theme] body.compass-app .player-quick-tools { gap:20px; margin-bottom:20px; }
  html[data-theme] body.compass-app .player-quick-tools strong { font-size:17px; }
  html[data-theme] body.compass-app .entity-nav { gap:22px; }
  html[data-theme] body.compass-app .home-feature { min-height:132px; }
  html[data-theme] body.compass-app :is(.section,.zq-card,.ltm-card,.second-panel,.ranking-card) { padding-block:20px; }
  html[data-theme] body.compass-app :is(.note,.player-json-notice) { padding:14px 16px; }
  html[data-theme] body.compass-app :is(.ltm-resource-totals,.stat-grid) { row-gap:12px; }
}

html[data-theme] body.compass-app .ab-profile-bar form button { background:var(--accent)!important; color:var(--on-accent)!important; border-color:var(--accent)!important; box-shadow:none!important; }

html[data-theme] body.compass-app .village-tracker-link { color:var(--accent)!important; background:transparent!important; }

/* Building summaries must stay readable in both themes and on small screens. */
html[data-theme] body.compass-app .building-total-strip {
  gap: 18px 24px; padding: 0; margin-block: 24px;
  border: 0; border-radius: 0; background: transparent; box-shadow: none;
}
html[data-theme] body.compass-app .building-total-strip > div {
  min-width: 0; padding: 12px 0 16px; border: 0; border-bottom: 1px solid var(--line);
  border-radius: 0; background: transparent;
}
html[data-theme] body.compass-app .building-total-strip strong {
  color: var(--ink); font-size: clamp(18px, 2.2vw, 24px); line-height: 1.4;
  font-variant-numeric: tabular-nums; overflow-wrap: anywhere;
}
html[data-theme] body.compass-app :is(.building-total-strip small, .building-level-stats small, .building-level-head > span, .building-level-upgrade small, .building-catalog-search > span) {
  color: var(--muted); font-size: 12px; line-height: 1.5; font-weight: 650; letter-spacing: .02em;
}
html[data-theme] body.compass-app :is(.building-total-strip p, .building-detail-copy p, .building-source-note) {
  color: var(--muted); font-size: 14px; line-height: 1.65;
}
html[data-theme] body.compass-app .building-total-strip p { grid-column: 1 / -1; margin: 0; }
html[data-theme] body.compass-app .building-level-stats strong { font-size: 17px; line-height: 1.4; }
html[data-theme] body.compass-app .building-level-upgrade :is(strong, span) { color: var(--ink); font-size: 13px; line-height: 1.5; overflow-wrap: anywhere; }
html[data-theme] body.compass-app .building-level-upgrade { background: var(--surface-2); border-color: var(--line); }
html[data-theme] body.compass-app .building-traits span { font-size: 12px; line-height: 1.4; }
html[data-theme] body.compass-app :is(.building-detail-max span, .building-detail-max small) { font-size: 12px; line-height: 1.5; }
html[data-theme] body.compass-app .building-detail-max strong { font-size: 24px; line-height: 1.3; }
html[data-theme] body.compass-app :is(.building-level-art > span, .building-level-head > b) { color: var(--accent); background: var(--accent-soft); border-color: var(--line); font-size: 12px; line-height: 1.5; }
@media (max-width: 640px) {
  html[data-theme] body.compass-app .building-total-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 20px; }
}

/* Legacy game modules use the shared palette in both themes. */
:root[data-theme="light"] { --muted:#625c52; }
html[data-theme] body.compass-app :is(.empty,.eyebrow,.item-group-kicker,.db-kicker,.home-subtitle,.achievement p,.achievement .unit-note,.cl-admin-kicker,.cl-admin-head p,.calculator-head p,.control-group label,.tool-advanced label,.explore-form label>span,.ab-profile-bar form>label>span) { color:var(--muted)!important; }
html[data-theme] body.compass-app :is(.player-refresh button,.ranking-card form button,.kind-switch button,.fav-toggle-btn,.ab-tag-field button,.ab-capacities b,.ab-add-section) { color:var(--ink)!important; background:var(--surface)!important; border-color:var(--line)!important; }
html[data-theme] body.compass-app :is(.kind-switch button.active,.ab-tag-field button.active) { color:var(--on-accent)!important; background:var(--accent)!important; }
html[data-theme] body.compass-app :is(td a,.error a) { color:var(--accent)!important; }

/* Equipment descriptions, upgrade plans and comparison tables. */
html[data-theme] body.compass-app :is(.eq-page-banner,.eq-upgrade-plan,.eq-ore-card,.eq-player-status-card,.eq-target-result,.eq-synergy-callout,.eq-matchup-formula,.eq-matchup-mode-note,.eq-table-verification,.eq-combo-explainer,.eq-target-ore,.eq-catalog-card,.eq-sibling-chip) {
  color:var(--ink)!important; background:var(--surface)!important; border-color:var(--line)!important; box-shadow:none!important;
}
html[data-theme] body.compass-app :is(.eq-page-banner,.eq-upgrade-plan,.eq-synergy-callout) { border:0!important; border-block:1px solid var(--line)!important; border-radius:0!important; padding:20px 0; }
html[data-theme] body.compass-app :is(.eq-page-banner,.eq-upgrade-plan,.eq-synergy-callout) :is(h1,h2,h3,strong) { color:var(--ink)!important; }
html[data-theme] body.compass-app :is(.eq-banner-hero-tag,.eq-banner-orig-name,.eq-banner-progress-copy,.eq-plan-copy p,.eq-matchup-head p,.eq-matchup-summary span,.eq-matchup-summary small,.eq-matchup-formula span,.eq-matchup-mode-note,.eq-matchup-mode-note span,.eq-matchup-caveat,.eq-data-note,.eq-table-verification,.eq-combo-explainer span,.eq-synergy-callout p,.eq-ore-body span,.eq-ore-body small,.eq-target-ore small,.eq-catalog-sub,.eq-catalog-meta,.eq-catalog-count) { color:var(--muted)!important; }
html[data-theme] body.compass-app :is(.eq-matchup-head p strong,.eq-matchup-summary strong,.eq-matchup-mode-note strong,.eq-combo-explainer strong,.eq-matchup-formula strong,.eq-ore-body strong,.eq-min-level,.eq-target-ore strong) { color:var(--ink)!important; }
html[data-theme] body.compass-app :is(.eq-guide-kicker,.eq-catalog-rarity,.eq-data-note a) { color:var(--accent)!important; }
html[data-theme] body.compass-app :is(.eq-matchup-summary span,.eq-matchup-table-wrap,.eq-matchup-table,.eq-matchup-table tbody,.eq-levels-table,.eq-levels-table tbody) { background:var(--surface)!important; color:var(--ink)!important; border-color:var(--line)!important; }
html[data-theme] body.compass-app :is(.eq-matchup-table,.eq-levels-table) td { color:var(--ink)!important; background:transparent!important; }
html[data-theme] body.compass-app .eq-matchup-table td strong { color:var(--ink)!important; }
html[data-theme] body.compass-app .eq-matchup-table td small { color:var(--muted)!important; }
html[data-theme] body.compass-app :is(.eq-badge-type,.eq-badge-max,.eq-badge-th,.eq-tag-b,.eq-tag-th,.eq-badge-rarity,.eq-catalog-guide) { color:var(--ink)!important; background:var(--surface-2)!important; border-color:var(--line)!important; }

/* Catalog notes, army actions and composition labels. */
html[data-theme] body.compass-app :is(.building-catalog-scope strong,.building-catalog-copy span,.building-catalog-scope span,.base-layout-stats,.base-layout-more small,.base-layout-more button span,.ab-detail-guide,.ab-preview-none,.ab-library-empty,.ab-card-detail,.ab-hall-mark span,.ab-preview-group header strong,.ab-drafts summary) { color:var(--muted)!important; }
html[data-theme] body.compass-app .building-catalog-card>strong { color:var(--accent)!important; }
html[data-theme] body.compass-app :is(.ab-detail-tags span,.ab-unit-image i) { color:var(--ink)!important; background:var(--surface-2)!important; border-color:var(--line)!important; }
html[data-theme] body.compass-app .ab-open-game { color:var(--on-accent)!important; background:var(--accent)!important; border-color:var(--accent)!important; }
html[data-theme] body.compass-app .ab-game-link.disabled { color:var(--muted)!important; background:var(--surface-2)!important; }

/* Development planners and second-builder requirements. */
html[data-theme] body.compass-app .ltm-nav a { color:var(--muted)!important; background:transparent!important; border-color:var(--line)!important; }
html[data-theme] body.compass-app .ltm-nav a.active { color:var(--ink)!important; background:var(--accent-soft)!important; border-color:var(--accent)!important; }
html[data-theme] body.compass-app :is(.ltm-detail-list,.ltm-upgrade-item,.ltm-level-breakdown,.ltm-level-breakdown>div) { color:var(--ink)!important; background:var(--surface)!important; border-color:var(--line)!important; }
html[data-theme] body.compass-app :is(.ltm-detail-list p,.ltm-upgrade-item small,.ltm-level-breakdown p) { color:var(--muted)!important; }
html[data-theme] body.compass-app :is(.ltm-upgrade-item summary>span,.ltm-level-breakdown>div>span,.ltm-resource-totals strong) { color:var(--ink)!important; }
html[data-theme] body.compass-app :is(.second-hero,.second-next,.second-card,.second-controls label,.second-data-note,.calc-summary-banner,.calc-card) { color:var(--ink)!important; background:var(--surface)!important; border-color:var(--line)!important; box-shadow:none!important; }
html[data-theme] body.compass-app :is(.second-hero p,.second-hero .eyebrow,.second-summary span,.second-storage-heading p,.second-storage-note,.second-panel-body p,.second-table td small,.calc-card-body span,.calc-card-body small,.calculator-th-badge span) { color:var(--muted)!important; }
html[data-theme] body.compass-app :is(.second-storage-fields label,.second-panel>summary,.calc-card-body strong) { color:var(--ink)!important; }
html[data-theme] body.compass-app .calc-summary-banner { padding:20px; }
html[data-theme] body.compass-app :is(.vt-profile-band,.vt-profile-kpis,.vt-resource-ribbon,.vt-overview-item) { background:var(--surface)!important; border-color:var(--line)!important; }
html[data-theme] body.compass-app :is(.vt-profile-kpis small,.vt-resource-ribbon small,.vt-overview-item small,.vt-resource-ribbon strong span) { color:var(--muted)!important; }
html[data-theme] body.compass-app :is(.vt-profile-links a,.vt-tabs button,.vt-townhall-mark) { color:var(--ink)!important; background:var(--surface-2)!important; border-color:var(--line)!important; }
html[data-theme] body.compass-app :is(.zq-detail-body label,.zq-target>span,.zq-best span,.zq-best strong) { color:var(--ink)!important; }
html[data-theme] body.compass-app :is(.zq-target>span,.zq-best) { background:var(--surface-2)!important; }

/* Numeric progress labels need a stable surface instead of colored fill beneath them. */
html[data-theme] body.compass-app .cs-research-progress>span { color:var(--ink)!important; background:var(--surface)!important; padding:2px 8px; border-radius:4px; }
html[data-theme] body.compass-app :is(.cs-research-level,.cs-village-heading b,.cs-village-heading small,.ic-badge-normal) { color:var(--ink)!important; background:var(--surface-2)!important; border-color:var(--line)!important; }

/* CWL public and authenticated screens use the same legible status labels. */
html[data-theme] body.compass-app :is(.cwl-raffle-hero,.cwl-raffle-machine) { background:var(--surface)!important; color:var(--ink)!important; border-color:var(--line)!important; box-shadow:none!important; }
html[data-theme] body.compass-app :is(.cwl-public-wait small,.cwl-raffle-kicker) { color:var(--muted)!important; }
html[data-theme] body.compass-league :is(.public-move.arrived,.member-th,.member-recent-ranks) { color:var(--ink)!important; background:var(--surface-2)!important; border-color:var(--line)!important; }

html[data-theme] body.compass-app :is(.cwl-raffle-copy p,.cwl-raffle-machine p,.second-next>div>span,.second-card p,.calc-banner-info p) { color:var(--muted)!important; }
html[data-theme] body.compass-app :is(.cwl-raffle-meta span,.cwl-public-wait,.second-summary,.calculator-th-badge,.eq-target-buttons button) { color:var(--ink)!important; background:var(--surface-2)!important; border-color:var(--line)!important; }
html[data-theme] body.compass-app .second-next li { color:var(--ink)!important; }
html[data-theme] body.compass-app .vt-resource-ribbon strong { color:var(--ink)!important; }
@media(max-width:767px) {
  html[data-theme] body.compass-app :is(.espor-table td>span,.ab-army-admin article header>div>span,.ab-army-admin .ab-preview-unit>i,.member-cell a>span) { font-size:12px!important; line-height:1.5; }
  html[data-theme] body.compass-app .ab-copy-detail .ab-preview-unit>small,
  html[data-theme] body.compass-app .ab-copy-detail .ab-preview-hero-name strong { font-size:12px!important; line-height:1.4; height:auto; min-height:34px; }
  html[data-theme] body.compass-app .ab-copy-detail .ab-preview-unit { height:auto; min-height:84px; }
}

/* Mobile metadata, control labels and footnotes stay at least 12px. */
@media(max-width:767px) {
  html[data-theme] body:is(.compass-app,.compass-league) :is(
    a.building-catalog-card.building-catalog-card-all > div.building-catalog-copy > p,
    a.building-catalog-card.building-catalog-card-all > div.building-catalog-copy > span,
    a.eq-catalog-card > div.eq-catalog-info > span.eq-catalog-guide,
    a.eq-catalog-card > div.eq-catalog-info > span.eq-catalog-meta,
    a.eq-catalog-card > div.eq-catalog-info > span.eq-catalog-rarity,
    a.eq-catalog-card > div.eq-catalog-info > span.eq-catalog-sub,
    article > div.ab-detail-tags > span,
    article.achievement > div.achievement-top > h3,
    article.base-layout-card > a.base-layout-image > span.base-level-badge,
    article.base-layout-card > div.base-layout-info > a.base-copy-link,
    article.base-layout-card > div.base-layout-info > a.base-view-link,
    article.base-layout-card > div.base-layout-info > button.base-favorite,
    article.building-level-card > a.building-level-arrow > span,
    article.building-level-card > a.building-level-arrow > strong,
    article.ltm-catch-row > div.ltm-bar > b,
    article.member-card > div.member-meta > span.member-clans,
    article.member-card > div.member-meta > span.member-ranks,
    article.member-card > div.member-meta > span.member-recent-ranks,
    article.member-card > div.member-meta > span.member-trophies,
    article.member-card > div.member-meta > span.transfer-status,
    article.ranking-card > form > button,
    article.second-card > div.second-card-head > span.second-status.done,
    article.second-card > div.second-card-head > span.second-status.pending,
    article.second-card > div.second-card-head > span.second-status.unknown,
    article.vt-overview-item > div > span,
    aside.eq-synergy-callout > div > span.eq-guide-kicker,
    aside.eq-synergy-callout > p > strong,
    aside.zq-results.zq-card > div.zq-best > span,
    button > span > small,
    div > div.ab-detail-tags > span,
    div > div.ab-detail-tags > span.ab-meta-badge,
    div > nav.vt-profile-links > a,
    div > span > label.zq-check,
    div > span > small,
    div > span > span.ltm-money.elixir,
    div#calc-controls-panel > div.control-group > label,
    div#tab-content > section.section > div.note,
    div.ab-admin-filters > label > span,
    div.ab-admin-filters > label.ab-admin-search > span,
    div.ab-build-preview > section.ab-preview-section > p.ab-preview-none,
    div.ab-capacities > b > small,
    div.ab-card-heading > div.ab-hall-mark > span,
    div.ab-card-title > div.ab-detail-tags > span,
    div.ab-card-title > div.ab-detail-tags > span.ab-meta-badge,
    div.ab-catalog-filters > label > span,
    div.ab-catalog-filters > label.ab-search-field > span,
    div.ab-content-filters > label.ab-content-castle > span,
    div.ab-content-filters > label.ab-content-minimum > span,
    div.ab-content-filters > label.ab-content-picker > span,
    div.ab-library-switches > label > span,
    div.ab-page > section.ab-actions > a,
    div.ab-page > section.ab-saved > p,
    div.ab-page > section.ab-section.ab-siege-selection > p.ab-help,
    div.ab-page.ab-army-detail > footer.ab-detail-footer > button,
    div.ab-page.ab-library > form.ab-library-profile > button,
    div.ab-preview-group > header > span,
    div.ab-preview-group > header > strong,
    div.ab-preview-units > span.ab-preview-unit > b,
    div.ab-preview-units > span.ab-preview-unit.active-siege > b,
    div.ab-tag-field > div > button,
    div.ab-tag-field > span > small,
    div.achievement-list > article.achievement > div.achievement-value,
    div.achievement-list > article.achievement > div.unit-note,
    div.achievement-list > article.achievement > p,
    div.base-filter-row > label > span,
    div.base-layout-info > div.base-layout-stats > span,
    div.base-layout-info > div.base-layout-tags > span,
    div.base-layout-info > h3 > a,
    div.base-layout-more > button > span,
    div.base-layout-page > div.base-layout-more > button,
    div.base-layout-page > div.base-layout-more > small,
    div.base-layout-page > nav.base-level-nav > a,
    div.base-layout-toolbar > div.base-kind-switch > button,
    div.base-layout-toolbar > div.base-sort-switch > button,
    div.building-catalog-copy > div > b,
    div.building-catalog-grid.building-catalog-grid-all > a.building-catalog-card.building-catalog-card-all > strong,
    div.building-catalog-toolbar > div.building-filter-chips > button,
    div.building-detail-page > div.building-back-row > a,
    div.calc-card > div.calc-card-body > small,
    div.calc-card > div.calc-card-body > span,
    div.calculator-head > div > span.item-group-kicker,
    div.calculator-head > div.calculator-th-badge > span,
    div.cl-admin-head > div > span.cl-admin-kicker,
    div.cl-admin-view > div.cl-admin-head > a,
    div.column-head > div.column-head-actions > button.lock-bulk-button,
    div.column-head > div.column-head-actions > button.strength-button,
    div.column-head > div.column-head-actions > span.column-count,
    div.column-title > div > small,
    div.cwl-raffle-machine > div.cwl-public-wait > small,
    div.cwl-raffle-machine > div.cwl-public-wait > strong,
    div.db-section-heading > div > span.db-kicker,
    div.entity-head > div.entity-head-actions > a.village-tracker-link,
    div.entity-head > div.entity-title > div.entity-meta,
    div.entity-head-actions > div.entity-score > span,
    div.entity-head-actions > div.player-refresh > button,
    div.entity-head-actions > div.player-refresh > small,
    div.entity-page > div.eyebrow,
    div.entity-page > div.note.player-json-notice,
    div.entity-page > div.note.player-json-notice > a,
    div.entity-page > div.note.player-json-notice > p,
    div.entity-page > div.note.player-json-notice > strong,
    div.entity-page > nav.entity-nav > a,
    div.entity-page.compare-page > div.eyebrow,
    div.entity-page.cwl-bonus-page > nav.entity-nav > a,
    div.entity-page.tool-page > div.eyebrow,
    div.entity-title > h1 > button.fav-toggle-btn,
    div.eq-banner-info > div.eq-banner-badges > span.eq-badge-max,
    div.eq-banner-info > div.eq-banner-badges > span.eq-badge-rarity,
    div.eq-banner-info > div.eq-banner-badges > span.eq-badge-th,
    div.eq-banner-info > div.eq-banner-badges > span.eq-badge-type,
    div.eq-banner-info > div.eq-banner-hero-tag > span,
    div.eq-banner-main > div.eq-banner-info > span.eq-guide-kicker,
    div.eq-combo-explainer > span > strong,
    div.eq-detail-page > div.eq-back-nav > a.eq-back-btn,
    div.eq-detail-page > div.eq-back-nav > a.eq-catalog-link,
    div.eq-detail-page > section.section.eq-desc-section > h3.eq-max-cost-title,
    div.eq-detail-page > section.section.eq-matchup-section > p.eq-data-note,
    div.eq-detail-page > section.section.eq-matchup-section > p.eq-matchup-caveat,
    div.eq-detail-page > section.section.eq-table-section > p.eq-table-verification,
    div.eq-detail-page > section.section.eq-table-section > p.eq-table-verification.verified,
    div.eq-matchup-head > div > p,
    div.eq-matchup-head > div > span.eq-guide-kicker,
    div.eq-matchup-head > div.eq-matchup-formula > span,
    div.eq-matchup-summary > span > small,
    div.eq-ore-card.card-blacksmith > div.eq-ore-body > small,
    div.eq-ore-card.card-blacksmith > div.eq-ore-body > span,
    div.eq-ore-card.card-glowy > div.eq-ore-body > small,
    div.eq-ore-card.card-glowy > div.eq-ore-body > span,
    div.eq-ore-card.card-shiny > div.eq-ore-body > small,
    div.eq-ore-card.card-shiny > div.eq-ore-body > span,
    div.eq-ore-card.card-starry > div.eq-ore-body > small,
    div.eq-ore-card.card-starry > div.eq-ore-body > span,
    div.eq-siblings-grid > a.eq-sibling-chip > span,
    div.eq-target-ore.glowy > div > small,
    div.eq-target-ore.shiny > div > small,
    div.eq-target-ore.starry > div > small,
    div.eq-upgrade-plan > div.eq-plan-copy > p,
    div.eq-upgrade-plan > div.eq-plan-copy > span.eq-guide-kicker,
    div.espor-page > p.espor-updated,
    div.explore-layout > aside.explore-menu > button,
    div.ic-grid > div.ic-unit > span.ic-badge-normal,
    div.league-hero > div > p.league-kicker,
    div.league-hero > div > p.league-subtitle,
    div.league-hero > div.league-toolbar > button.league-button,
    div.league-hero > div.league-toolbar > button.league-button.secondary,
    div.league-hero > div.league-toolbar > label.league-field,
    div.league-toolbar > form.add-clan-form > button.league-button.secondary,
    div.league-toolbar > form.add-clan-form > label.league-field,
    div.ltm-body > section.ltm-card.ltm-profile > label,
    div.ltm-body > section.ltm-card.ltm-profile > label.ltm-builders,
    div.ltm-chart-row > div.ltm-bar > b,
    div.ltm-compare-inputs > fieldset > label,
    div.ltm-filters > div > small,
    div.ltm-identity > div > small,
    div.ltm-level-breakdown > div > span,
    div.ltm-resource-totals > div > small,
    div.member-main > div.member-badges > span.lineup-badge,
    div.member-main > div.member-badges > span.member-th,
    div.member-main > div.member-name > span,
    div.note.player-json-notice > p > a,
    div.rankings-grid > article.ranking-card > p,
    div.second-grid > article.second-card > p,
    div.second-panel-body.second-controls > label > small,
    div.section-head > div > p,
    div.section-head > div > span.db-kicker,
    div.section-head > div > span.eq-guide-kicker,
    div.section-head > div > span.item-group-kicker,
    div.section-head > div.section-actions > a.small-button.primary,
    div.stat-grid > div.stat > small,
    div.stat-grid > div.stat > span,
    div.vt-overview-grid > article.vt-overview-item > small,
    div.vt-overview-toolbar > div.vt-category-tabs > button,
    div.vt-profile-identity > div > p,
    div.vt-profile-kpis > div > small,
    div.vt-profile-kpis > div > span,
    div.zq-target > div > small,
    fieldset > label > small,
    form > div.ab-profile-hint > small,
    form > label > span,
    form#home-search > label.home-tag-field > span,
    form.ab-library-profile > label > span,
    form.explore-form > label > span,
    form.ltm-card.ltm-compare-form > div.ltm-compare-settings > label,
    form.tool-form > div.json-copy-guide > span,
    h2.cs-village-heading > span > b,
    header > div > small,
    header > div.ab-library-actions > a.ab-card-detail,
    header > div.ab-library-actions > a.ab-open-game,
    header > div.ab-library-actions > button,
    header > div.ab-library-actions > button.ab-favorite-button,
    header > div.ab-library-actions > button.ab-meta-toggle,
    header > div.ltm-costs > small,
    header.ab-section-head > div.ab-capacities > b,
    header.ab-top > div > span,
    header.ab-top > div.ab-top-actions > a.ab-library-link,
    header.ab-top > div.ab-top-actions > a.ab-open-game,
    header.ab-top > div.ab-top-actions > button,
    header.ab-top > div.ab-top-actions > button.ab-favorite-button,
    header.ab-top > div.ab-top-actions > button.ab-import,
    header.second-hero > div > span.eyebrow,
    header.second-hero > div.second-summary > small,
    header.second-hero > div.second-summary > span,
    label > div > button,
    li > div > small,
    main#league-app > div.league-status.success,
    main#league-app > div.league-summary > span.summary-chip,
    main#league-app > p.league-note,
    ol.second-steps > li.second-step > span,
    section.ab-actions > div > a.ab-game-link.disabled,
    section.ab-actions > div > button,
    section.ab-actions > div > button.ab-create,
    section.ab-basics > div.ab-tag-field > button,
    section.ab-basics > div.ab-tag-field > span,
    section.ab-basics > div.ab-th-field > span,
    section.ab-basics > label.ab-name-field > span,
    section.ab-preview-section > header > h3,
    section.ab-saved > header > button,
    section.building-catalog-hero.building-catalog-hero-all > div > span.db-kicker,
    section.building-catalog-hero.building-catalog-hero-all > div.building-catalog-scope > span,
    section.building-catalog-hero.building-catalog-hero-all > div.building-catalog-scope > strong,
    section.building-category-section > div.db-section-heading > p,
    section.building-detail-hero > div.building-detail-copy > span.db-kicker,
    section.building-levels-section > div.db-section-heading > p,
    section.cwl-raffle-hero > div.cwl-raffle-machine > p,
    section.league-column.admin-unassigned > div.column-members > div.column-empty,
    section.ltm-card.ltm-totals > div.ltm-total-time > small,
    section.ltm-catch > div.ltm-catch-toolbar > label,
    section.second-next > div > span,
    section.section > div.filters > button.filter-button,
    section.section > div.labels > span.label,
    section.section > div.raw-toolbar > button.small-button,
    section.section.eq-catalog-hero-group > div.eq-catalog-hero-head > span.eq-catalog-count,
    section.section.eq-matchup-section > aside.eq-synergy-callout > p,
    section.section.eq-matchup-section > div.eq-combo-explainer > span,
    section.section.eq-matchup-section > div.eq-matchup-mode-note > span,
    section.section.eq-matchup-section > div.eq-matchup-mode-note > strong,
    section.section.eq-matchup-section > div.eq-matchup-summary > span,
    section.section.eq-matchup-section > p.eq-data-note > a,
    section.vt-resource-ribbon > div > small,
    summary > span > small,
    summary > span > span.ltm-money.elixir,
    summary > span.ltm-costs > span.ltm-money.elixir,
    thead > tr > th,
    thead > tr > th.number,
    tr > td > small,
    tr > td > span.eq-tag-b,
    tr > td > span.eq-tag-th,
    tr > td.lb-player > span,
    tr > td.number > span.badge.badge-needed
  ) { font-size:12px!important; line-height:1.5; }
  html[data-theme] body.compass-app :is(.achievement p,.building-catalog-copy p,.second-card p,.eq-matchup-head p,.eq-matchup-caveat,.eq-data-note,.eq-table-verification) { font-size:13px!important; }
}

html[data-theme] body.compass-app :is(.cwl-public-wait strong,.second-summary strong,.calculator-th-badge strong) { color:var(--ink)!important; }
html[data-theme] body.compass-app :is(.second-summary small,.second-controls label small,.cl-stat-num small,.cl-admin-table td small,.cl-admin-tag,.cl-admin-edit label span) { color:var(--muted)!important; }
html[data-theme] body.compass-app .second-step { background:var(--surface)!important; border-color:var(--line)!important; }
html[data-theme] body.compass-app :is(.cl-seg-btn.active,.cl-admin-edit button) { background:var(--accent)!important; color:var(--on-accent)!important; }
@media(max-width:767px) {
 html[data-theme] body.compass-app :is(.cl-pill-lvl,.cl-tag,.cl-league,.cl-link-action,.cl-stat-lbl,.cl-stat-num small,.cl-count-tag,.cl-seg-btn,.cl-td-rank,.cl-p-name,.cl-p-tag,.cl-don span,.cl-trophy,.cl-admin-tag,.cl-admin-edit button,.espor-table-wrap td>span,.table-wrap td a>span) { font-size:12px!important; line-height:1.5; }
}
html[data-theme] body.compass-app .ab-recommend :is(.ab-recommend-score,.ab-recommend-status,.ab-recommend-note) { color:var(--muted)!important; }
@media(max-width:767px) {
 html[data-theme] body.compass-app .ab-recommend :is(label>span,.ab-recommend-score,.ab-recommend-status,.ab-recommend-context span,.ab-recommend-note,small,summary) { font-size:13px!important; line-height:1.5; }
}

@media(max-width:767px) { html[data-theme] body.compass-app :is(.espor-levels td>span,.name-cell a>span) { font-size:12px!important; line-height:1.5; } }

@media(max-width:767px) {
 html[data-theme] body.compass-app .compass-tabs { width:100vw; max-width:100vw; inset-inline-end:auto; }
}
@media(max-width:480px) {
 html[data-theme] body.compass-app .cl-topbar { flex-wrap:wrap; gap:12px; }
 html[data-theme] body.compass-app .cl-topbar-actions { flex:1 1 100%; flex-wrap:wrap; }
}

@media(max-width:767px) { html[data-theme] body.compass-app { min-width:0; } }