/* Side selector controls */

.faction-switch{position:relative;flex:none;color:var(--accent)}
.faction-switch summary{display:flex;align-items:center;gap:8px;min-height:40px;padding:6px 9px;border:1px solid var(--border);border-radius:4px;cursor:pointer;list-style:none;font-size:11px;white-space:nowrap}
.faction-switch summary::-webkit-details-marker{display:none}
.faction-switch svg{width:23px;height:23px;flex:none;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linejoin:round;stroke-linecap:round}
.faction-switch summary:hover,.faction-switch[open] summary{background:var(--soft);border-color:var(--accent)}
.faction-popover{position:absolute;top:calc(100% + 10px);right:0;z-index:110;width:260px;max-width:calc(100vw - 24px);padding:12px;background:var(--panel);color:var(--fg);border:1px solid var(--border);border-radius:6px;box-shadow:0 16px 40px var(--shadow)}
.faction-popover>strong{display:block;font:500 18px var(--font-display);margin:0 0 9px;padding:3px 5px}
.faction-popover button{display:flex;align-items:center;gap:11px;width:100%;min-height:62px;padding:10px;text-align:left;background:transparent;border:1px solid transparent;border-radius:4px;color:var(--fg);font:inherit;cursor:pointer}
.faction-popover button:hover{background:var(--soft)}
.faction-popover button[aria-pressed=true]{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 8%,var(--panel))}
.faction-popover button small{display:block;font-size:11px;color:var(--muted);margin-top:3px}
.faction-popover button b{margin-left:auto;color:var(--accent);visibility:hidden}
.faction-popover button[aria-pressed=true] b{visibility:visible}
.faction-popover [data-faction-choice=king]>svg{color:var(--team-hidden-king)}
.faction-popover [data-faction-choice=mother]>svg{color:var(--team-archmother)}

/* Deadstats faction atmosphere v2 — append AFTER production factions.css.
   Contract unchanged: html[data-faction=king|mother]. Both use color-scheme:dark.
   READY. Cosmetic only; no team, result, account or entitlement state.
   Source read-only: /app/static/assets/factions.css, 2026-10-30.
   References: Steam Archmother interior + Tracklock patron/base screenshots.
   Optional local image hooks, set in your integration stylesheet, e.g.
   html[data-faction=mother]{--faction-mother-image:url('./YOUR-LOCAL-FILE.webp')}
   html[data-faction=king]{--faction-king-image:url('./YOUR-LOCAL-FILE.webp')}
   No remote images, animations, blur filters or backdrop-filter. */
html[data-faction="king"] {
  color-scheme:dark;
  --bg:oklch(16% .012 35);
  --surface:oklch(21% .016 38);
  --panel:oklch(23% .017 38);
  --fg:oklch(92% .027 78);
  --muted:oklch(75% .024 62);
  --border:oklch(41% .034 48);
  --line:oklch(36% .026 45);
  --control-border:oklch(61% .045 55);
  --accent:oklch(80% .12 67);
  --on-accent:oklch(18% .018 38);
  --accent-hover:oklch(88% .09 75);
  --soft:oklch(28% .022 40);
  --surface-raised:oklch(29% .022 40);
  --surface-hover:oklch(32% .026 43);
  --success:oklch(80% .105 155);
  --danger:oklch(79% .115 25);
  --warn:oklch(83% .115 80);
  --team-hidden-king:oklch(82% .115 72);
  --team-archmother:oklch(82% .09 246);
  --premium-flame:oklch(84% .08 218);
  --chart-grid:oklch(44% .024 45);
  --tooltip-bg:oklch(92% .027 78);
  --tooltip-fg:oklch(18% .018 38);
  --shadow:oklch(8% .01 35 / .55);
  --faction-trim:oklch(61% .075 48);
  --faction-light:oklch(78% .10 65 / .16);
  --faction-edge:oklch(70% .08 58 / .2);
  --faction-image:var(--faction-king-image,none);
  --faction-atmosphere:radial-gradient(ellipse at 15% 0%,oklch(58% .09 48 / .19),transparent 65%);
  --faction-pattern:repeating-linear-gradient(0deg,transparent 0 31px,oklch(70% .04 50 / .07) 31px 32px),repeating-linear-gradient(90deg,transparent 0 95px,oklch(70% .04 50 / .045) 95px 96px);
}
html[data-faction="mother"] {
  color-scheme:dark;
  --bg:oklch(29% .085 260);
  --surface:oklch(33% .085 260);
  --panel:oklch(35% .085 259);
  --fg:oklch(96% .013 235);
  --muted:oklch(81% .035 245);
  --border:oklch(53% .07 250);
  --line:oklch(48% .065 255);
  --control-border:oklch(70% .065 245);
  --accent:oklch(85% .075 235);
  --on-accent:oklch(22% .065 260);
  --accent-hover:oklch(93% .035 235);
  --soft:oklch(39% .08 258);
  --surface-raised:oklch(40% .08 258);
  --surface-hover:oklch(43% .08 257);
  --success:oklch(85% .105 155);
  --danger:oklch(85% .10 25);
  --warn:oklch(88% .10 80);
  --team-hidden-king:oklch(88% .10 72);
  --team-archmother:oklch(90% .065 230);
  --premium-flame:oklch(90% .065 215);
  --chart-grid:oklch(58% .06 250);
  --tooltip-bg:oklch(94% .023 235);
  --tooltip-fg:oklch(24% .065 260);
  --shadow:oklch(12% .04 260 / .40);
  --faction-trim:oklch(77% .065 238);
  --faction-light:oklch(80% .09 245 / .14);
  --faction-edge:oklch(86% .055 235 / .22);
  --faction-image:var(--faction-mother-image,none);
  --faction-atmosphere:radial-gradient(ellipse at 50% 0%,oklch(65% .14 254 / .33),transparent 70%);
  --faction-pattern:radial-gradient(ellipse 580px 390px at 50% -140px,transparent 98%,oklch(82% .05 235 / .10) 98.3% 98.6%,transparent 99%),radial-gradient(ellipse 700px 470px at 50% -140px,transparent 98%,oklch(82% .05 235 / .07) 98.3% 98.6%,transparent 99%);
}
html[data-faction] {
  --win:var(--success);--loss:var(--danger);
  --oi-critical:var(--danger);--oi-danger:var(--danger);--oi-balanced:var(--muted);--oi-good:var(--success);--oi-excellent:var(--success);
}
/* Scope is intentionally compatible with the integrated production selectors. */
html[data-faction] body {background:var(--bg);color:var(--fg);isolation:isolate}
html[data-faction] body:before {
  content:'';position:fixed;inset:0;pointer-events:none;z-index:-1;
  background-image:linear-gradient(oklch(from var(--bg) l c h / .66),var(--bg) 850px),var(--faction-image),var(--faction-atmosphere),var(--faction-pattern);
  background-position:center top;background-size:auto,cover,auto,auto;background-repeat:no-repeat,no-repeat,no-repeat,repeat;
  opacity:1;filter:none;box-shadow:none;
}
html[data-faction] :is(.topbar,.rail) {
  background:var(--surface);color:var(--fg);border-color:var(--border);
  box-shadow:inset 0 -1px var(--faction-edge);
}
html[data-faction=mother] .topbar {background:var(--surface-raised);box-shadow:inset 0 2px var(--faction-trim),0 4px 24px var(--shadow)}
html[data-faction=king] .topbar {box-shadow:inset 0 2px var(--faction-trim),0 4px 20px var(--shadow)}
html[data-faction] :is(.panel,.a-panel,.build-card,.wheel-panel,.history-panel,.summary-record) {
  background:var(--panel);color:var(--fg);border:1px solid var(--border);border-radius:3px;
  box-shadow:inset 0 1px var(--faction-edge),0 6px 16px var(--shadow);
}
html[data-faction=mother] :is(.panel-heading,.a-tabs,.section-title) {border-color:var(--border)}
html[data-faction] :is(.control,.a-field input,.a-hero-trigger,.a-avatar) {background:var(--bg);color:var(--fg);border-color:var(--control-border)}
html[data-faction] :is(.account-menu>div,.faction-popover,.hero-picker-menu,.history-filter-options,.global-menu nav) {
  background:var(--surface-raised);color:var(--fg);border:1px solid var(--faction-trim);border-radius:3px;
  box-shadow:inset 0 3px var(--faction-trim),0 12px 28px var(--shadow);
}
html[data-faction] :is(.account-menu a,.account-menu button,.faction-popover button) {color:var(--fg)}
/* Border feedback preserves text contrast in interactive states. */
html[data-faction] :is(.account-menu a:hover,.account-menu button:hover,.faction-popover button:hover,.hero-picker-menu>button:hover,.a-hero-option:hover) {
  background:var(--surface-raised);color:var(--fg);box-shadow:inset 0 0 0 1px var(--control-border);
}
html[data-faction] .faction-switch {color:var(--fg)}
html[data-faction] .faction-switch summary {min-height:44px;border-color:var(--control-border);background:var(--bg);color:var(--fg)}
html[data-faction] .faction-switch summary:hover,
html[data-faction] .faction-switch[open] summary {background:var(--bg);color:var(--fg);border-color:var(--fg)}
html[data-faction] .faction-popover button[aria-pressed=true] {border-color:var(--faction-trim);background:var(--surface-raised)}
html[data-faction] .faction-popover button b {color:var(--fg)}
html[data-faction] .faction-popover [data-faction-choice]>svg {color:var(--fg)}
html[data-faction] .btn.primary {background:var(--accent);color:var(--on-accent);border-color:var(--accent);box-shadow:none}
html[data-faction] .btn.primary:hover,
html[data-faction] .btn.primary:active {background:var(--accent-hover);color:var(--on-accent)}
html[data-faction] .btn:not(.primary):hover {background:var(--panel);color:var(--fg);border-color:var(--fg)}
html[data-faction] :is(.data-table th,.adaptive-table .identity-cell) {background:var(--panel);color:var(--fg)}
html[data-faction] .data-table th {color:var(--muted)}
html[data-faction] .data-table tbody tr:hover {background:var(--panel);color:var(--fg);box-shadow:inset 0 0 0 1px var(--control-border)}
html[data-faction] .floating-tooltip {background:var(--tooltip-bg);color:var(--tooltip-fg);border:1px solid var(--control-border);box-shadow:0 8px 24px var(--shadow)}
html[data-faction] .series-chart svg {background:var(--bg);border-color:var(--line)}
html[data-faction] .team-0 {color:var(--team-hidden-king)}
html[data-faction] .team-1 {color:var(--team-archmother)}
html[data-faction] .series-chart [stroke="#d9ad66"] {stroke:var(--team-hidden-king)}
html[data-faction] .series-chart [stroke="#74acd3"] {stroke:var(--team-archmother)}
html[data-faction] .series-chart [fill="#d9ad66"] {fill:var(--team-hidden-king)}
html[data-faction] .series-chart [fill="#74acd3"] {fill:var(--team-archmother)}
html[data-faction] .series-legend i[style*="#d9ad66"] {background:var(--team-hidden-king)!important}
html[data-faction] .series-legend i[style*="#74acd3"] {background:var(--team-archmother)!important}
html[data-faction] .win {color:var(--win)}
html[data-faction] .loss {color:var(--loss)}
html[data-faction] .a-plan-premium {color:var(--premium-flame);background:transparent;border-color:var(--premium-flame)}
html[data-faction] .a-avatar-premium {border-color:var(--premium-flame);box-shadow:0 0 10px var(--faction-light)}
html[data-faction] .a-avatar-premium:before {animation:none;filter:none;opacity:.15}
html[data-faction] .impact-history-bar.oi-outstanding i {background:var(--warn)}
html[data-faction] .impact-history-bar.oi-strong i {background:var(--success)}
html[data-faction] .impact-history-bar.oi-even i {background:var(--muted)}
html[data-faction] .impact-history-bar.oi-below i,
html[data-faction] .impact-history-bar.oi-weak i {background:var(--danger)}
html[data-faction] :is(a,button,input,select,summary):focus-visible {outline:2px solid var(--fg);outline-offset:3px}
/* Atmospheric layer stays static; local images can be pre-sized by the owner. */
@media(max-width:600px) {
  html[data-faction] .faction-switch summary {min-width:44px;min-height:44px}
  html[data-faction] .faction-popover {max-width:calc(100vw - 24px)}
}


/* Bundled in-game screenshots: Valve / Steam and Tracklock patron reference. */
html[data-faction=mother]{--faction-mother-image:url('./factions/archmother-sanctum.webp')}
html[data-faction=king]{--faction-king-image:url('./factions/hidden-king-patron.webp')}
html[data-faction] body:before{background-size:auto,100% auto,auto,auto;background-position:center top,center 50px,center top,center top}
html[data-faction=mother] .profile-identity{background:linear-gradient(90deg,#122c50ed,#1a467baa),url('./factions/archmother-sanctum.webp') center 35%/cover;border-top:1px solid var(--faction-trim)}
html[data-faction=king] .profile-identity{background:linear-gradient(90deg,#1b1714ed,#32241a99),url('./factions/hidden-king-stronghold.webp') center 40%/cover;border-top:1px solid var(--faction-trim)}
html[data-faction] .faction-popover button{min-height:80px;isolation:isolate;position:relative;overflow:hidden}
html[data-faction] .faction-popover button:before{content:'';position:absolute;inset:0;z-index:-1;background-position:right center;background-size:cover;opacity:.35;pointer-events:none}
html[data-faction] .faction-popover [data-faction-choice=mother]:before{background-image:linear-gradient(90deg,var(--surface-raised) 20%,transparent),url('./factions/archmother-sanctum.webp')}
html[data-faction] .faction-popover [data-faction-choice=king]:before{background-image:linear-gradient(90deg,var(--surface-raised) 20%,transparent),url('./factions/hidden-king-patron.webp')}
html[data-faction] .faction-popover [data-faction-choice=mother]>svg{color:var(--team-archmother)}
html[data-faction] .faction-popover [data-faction-choice=king]>svg{color:var(--team-hidden-king)}
@media(max-width:1100px){.faction-switch summary>span{display:none}}
@media(max-width:600px){html[data-faction] .faction-switch summary{width:34px;min-width:34px;min-height:36px;padding:4px;justify-content:center}.faction-switch svg{width:21px;height:21px}.top-actions{gap:5px}.topbar .brand{font-size:20px}.faction-popover{position:fixed;top:66px;right:12px;width:260px}.topbar{gap:6px}.source-chip:empty{display:none}html[data-faction] body:before{background-size:auto,auto 440px,auto,auto;background-position:center top,center 60px,center top,center top}}
@media(max-width:360px){.topbar .brand{font-size:18px}.top-actions{gap:3px}.topbar{padding-inline:10px;gap:4px}}