/* XPRODUCT skin for the preserved AIV application. Layout contracts and data encodings stay intact. */
@media screen {
  /* Export code reads these properties from documentElement, so the root follows the scoped body. */
  :root:has(body.xproduct-project.xproduct-aiv) {
    color-scheme: dark;
    --paper: var(--xp-bg, #0a0a0a);
    --paper-deep: #1c1c1c;
    --surface: var(--xp-surface, #111111);
    --surface-soft: #151515;
    --ink: var(--xp-ink, #f8f5f2);
    --muted-ink: #aaa8a5;
    --quiet-ink: var(--xp-muted, #949494);
    --border: var(--xp-rule, #303030);
    --border-strong: #555553;
    --focus: #f5ac1c;
    --focus-strong: #eec26a;
    --focus-soft: #242015;
    --analytic: #88a8eb;
    --analytic-soft: #1b2230;
    --positive: #74b99c;
    --positive-soft: #15231e;
    --negative: #df9292;
    --negative-soft: #2a1919;
    --warning: #c5ad82;
    --warning-soft: #272117;
    --unknown: #a5a39f;
    --unknown-soft: #202020;
    --focus-ring: var(--xp-ink, #f8f5f2);
    --shadow-small: none;
    --shadow-large: 0 20px 80px #0009;
    --sans: var(--xp-font, 'PPSupplyMono', 'IBM Plex Mono', monospace);
    --mono: var(--xp-font, 'PPSupplyMono', 'IBM Plex Mono', monospace);
    --font-display: var(--xp-font, 'PPSupplyMono', 'IBM Plex Mono', monospace);
    --font-data: var(--xp-font, 'PPSupplyMono', 'IBM Plex Mono', monospace);
  }

  body.xproduct-project.xproduct-aiv {
    color: var(--ink);
    background: var(--paper);
    font-family: var(--sans);
    font-size: 13px;
    line-height: 1.65;
    font-synthesis: none;
    text-transform: none;
  }

  .xproduct-aiv :is(button, input, select, textarea) { color: var(--ink); font-family: var(--sans); }
  .xproduct-aiv :is(select, input, textarea) { color-scheme: dark; }
  .xproduct-aiv :is(input, textarea)::placeholder { color: var(--quiet-ink); opacity: 1; }
  .xproduct-aiv ::selection { color: var(--paper); background: var(--ink); }
  .xproduct-aiv :is(code, pre) { color: var(--muted-ink); font-family: var(--mono); }
  .xproduct-aiv a { text-underline-offset: 3px; }

  .xproduct-aiv .topbar {
    grid-template-columns: var(--rail-width) minmax(0, 1fr) auto;
    border-bottom-color: var(--border-strong);
    background: rgb(10 10 10 / 96%);
    backdrop-filter: blur(18px);
  }
  .xproduct-aiv .topbar > .xproduct-home-link { height: 100%; padding: 0 20px; border-right: 1px solid var(--border); }
  .xproduct-aiv .topbar__context { padding-inline: 20px; font-size: 10px; }
  .xproduct-aiv .topbar__actions { gap: 8px; padding-right: 20px; }
  .xproduct-aiv .xproduct-back-link { white-space: nowrap; font-size: 10px; }

  .xproduct-aiv .section-rail { border-right-color: var(--border); background: rgb(10 10 10 / 98%); }
  .xproduct-aiv :is(.rail__intro, .rail__progress) { border-color: var(--border); }
  .xproduct-aiv .rail__intro strong { max-width: 190px; font-weight: 400; line-height: 1.5; font-size: 13px; }
  .xproduct-aiv .route-nav { gap: 4px; }
  .xproduct-aiv .route-link { border: 1px solid transparent; border-radius: 0; color: var(--muted-ink); font-size: 11px; }
  .xproduct-aiv .route-link:hover { border-color: var(--border-strong); color: var(--ink); background: #141414; }
  .xproduct-aiv .route-link.is-active { border-color: var(--ink); color: var(--ink); background: transparent; }
  .xproduct-aiv .route-link.is-active .route-link__index { color: var(--ink); }
  .xproduct-aiv .progress-track > span { background: var(--ink); }

  .xproduct-aiv .filter-bar { border-bottom-color: var(--border); background: rgb(10 10 10 / 96%); }
  .xproduct-aiv :is(.compare-tray, .scope-banner) { border-color: var(--border); background: #0e0e0e; }
  .xproduct-aiv :is(.filter-field select, .mobile-view-field select, .control-field select, .control-field input, .search-field input, .explorer-filter-grid input, .explorer-filter-grid select) {
    border-color: var(--border-strong); border-radius: 0; color: var(--ink); background: var(--surface); font-size: 11px;
  }
  .xproduct-aiv :is(.icon-button, .text-button, .primary-button, .ghost-button, .segmented-button, .seo-read-link) {
    border: 1px solid var(--border-strong); border-radius: 0; color: var(--ink); background: transparent;
    box-shadow: none; font-family: var(--sans); font-size: 11px; font-weight: 400; line-height: 1.35;
  }
  .xproduct-aiv .seo-read-link { padding: 9px 12px; }
  .xproduct-aiv :is(.icon-button, .text-button, .primary-button, .ghost-button, .segmented-button, .seo-read-link):hover {
    border-color: var(--ink); color: var(--ink); background: #1a1a1a; box-shadow: none;
  }
  .xproduct-aiv .primary-button:active { box-shadow: none; transform: none; }
  .xproduct-aiv :is(.segmented-control, .export-option-grid) { border-color: var(--border-strong); background: var(--border); }
  .xproduct-aiv :is(.segmented-button[aria-pressed='true'], .segmented-button.is-active, .overlay-toggle[aria-pressed='true'], .provider-compare-toggle[aria-pressed='true']) {
    border-color: var(--ink); color: var(--ink); background: #1c1c1c; box-shadow: inset 0 0 0 1px var(--ink);
  }
  .xproduct-aiv :is(.filter-chip, .badge, .metric-tag, .mode-tag) { border-radius: 0; }
  .xproduct-aiv .entity-token button:hover { background: #ffffff18; }
  .xproduct-aiv :is(.drawer-tabs button[aria-current='page'], .compare-tab[aria-selected='true']) { border-color: var(--ink); color: var(--ink); }

  .xproduct-aiv .screen-header h1 {
    max-width: 1000px; font-family: var(--sans); font-size: clamp(28px, 3vw, 43px);
    font-weight: 400; line-height: 1.24; letter-spacing: -.025em;
  }
  .xproduct-aiv .screen-header__lede { font-size: 14px; line-height: 1.8; }
  .xproduct-aiv :is(.eyebrow, .rail__kicker, .route-group-label, .mini-label) { color: var(--quiet-ink); font-weight: 400; }
  .xproduct-aiv :is(.section-heading h2, .chart-card h2, .chart-card h3, .thesis-panel h2, .evidence-sheet h2, .drawer-section h3, .state-panel h3, .exact-response h3) {
    font-family: var(--sans); font-weight: 400; letter-spacing: -.015em; line-height: 1.4;
  }
  .xproduct-aiv .thesis-panel h2 { font-size: clamp(22px, 2.2vw, 32px); }
  .xproduct-aiv :is(.chart-card, .data-card, .control-panel, .state-panel, .method-card, .direction-card, .methodology-passport, .research-stamp, .selection-summary) {
    border-color: var(--border-strong); background-color: var(--surface); box-shadow: none;
  }
  .xproduct-aiv :is(.metric-grid, .executive-kpi-grid, .executive-insight-grid, .health-summary-grid, .discovery-finding-grid) {
    border-color: var(--border-strong); background: var(--border);
  }
  .xproduct-aiv :is(.metric-card, .executive-kpi, .executive-insight, .health-summary, .discovery-finding) { color: var(--ink); background-color: var(--surface); }
  .xproduct-aiv :is(.executive-kpi, .executive-insight):is(:hover, :focus-visible) { background: #1b1b1b; }
  .xproduct-aiv :is(.executive-kpi > strong, .metric-card strong, .health-summary > strong) { font-weight: 400; letter-spacing: -.035em; }
  .xproduct-aiv .executive-kpi h3 { font-weight: 400; line-height: 1.5; }
  .xproduct-aiv :is(.executive-kpi__support, .executive-kpi__micro-row) { font-size: 10px; line-height: 1.5; }
  .xproduct-aiv .thesis-panel { border-color: var(--border-strong); color: var(--ink); background: var(--surface); }
  .xproduct-aiv .thesis-panel::after { border-width: 1px; border-color: var(--ink); opacity: .12; }
  .xproduct-aiv .thesis-panel p { color: var(--muted-ink); }
  .xproduct-aiv .thesis-panel .eyebrow { color: var(--quiet-ink); }
  .xproduct-aiv .thesis-panel__action .primary-button { color: var(--ink); box-shadow: none; }
  .xproduct-aiv :is(.aiv36-feature-thesis, .aiv36-model-thesis, .aiv36-source-thesis, .aiv36-accuracy-thesis) {
    border-color: var(--border-strong); background: var(--surface);
  }

  /* The series keep distinct hues. Surface tint is bounded so white labels remain readable. */
  .xproduct-aiv :is(.source-plot, .aiv36-bubble-map, .aiv36-source-scatter) {
    background-image: linear-gradient(#ffffff0c 1px, transparent 1px), linear-gradient(90deg, #ffffff0c 1px, transparent 1px);
  }
  .xproduct-aiv .bar-track {
    background: repeating-linear-gradient(90deg, transparent 0 calc(25% - 1px), #ffffff0d calc(25% - 1px) 25%), var(--surface-soft);
  }
  .xproduct-aiv :is(.vs-heatmap__cell, .aiv36-heatmap__cell, .aiv36-model-heatmap__cell) {
    border-color: var(--border); color: var(--ink);
    background: color-mix(in srgb, var(--analytic) calc(var(--intensity, 0%) * .42), var(--surface));
  }
  .xproduct-aiv .ci-heatmap-cell {
    color: var(--ink);
    background: color-mix(in srgb, var(--brand-color, var(--analytic)) calc(var(--intensity, 0%) * .42), var(--surface));
  }
  .xproduct-aiv :is(.aiv36-heatmap__cell.is-suppressed, .aiv36-model-heatmap__cell.is-suppressed, .aiv36-heatmap__missing, .vs-heatmap__cell.is-missing, .ci-heatmap-cell.is-suppressed, .ci-heatmap-cell.is-missing) {
    color: var(--unknown); background: repeating-linear-gradient(135deg, var(--unknown-soft) 0 5px, var(--surface) 5px 10px);
  }
  .xproduct-aiv :is(.aiv36-feature-bubble, .aiv36-source-point) { color: var(--ink); background: color-mix(in srgb, var(--focus) 26%, var(--surface)); box-shadow: none; }
  .xproduct-aiv :is(.aiv36-feature-bubble, .aiv36-source-point).is-positive { color: var(--ink); background: color-mix(in srgb, var(--positive) 28%, var(--surface)); }
  .xproduct-aiv :is(.aiv36-feature-bubble, .aiv36-source-point).is-negative { color: var(--ink); background: color-mix(in srgb, var(--negative) 28%, var(--surface)); }
  .xproduct-aiv :is(.source-point, .executive-scatter .vs-scatter__point.is-focus) { color: #0a0a0a; }
  .xproduct-aiv .source-point:nth-of-type(even) { color: var(--ink); }
  .xproduct-aiv .aiv36-radar__selected { fill: rgb(245 172 28 / 15%); stroke: var(--focus); }
  .xproduct-aiv .aiv36-radar__compare { fill: rgb(136 168 235 / 10%); }
  .xproduct-aiv :is(.discovery-composition > span, .discovery-verdict-stack > span, .aiv36-verdict-segment, .aiv36-source-mix-row > i > b > span, .no-brand-waterfall__bar i) { color: #0a0a0a; }
  .xproduct-aiv :is(.discovery-composition .is-muted, .discovery-verdict-stack .series-4) { color: var(--ink); }
  .xproduct-aiv .aiv36-source-network__brand { color: var(--ink); background: var(--surface); }
  .xproduct-aiv .brand-logo { background: #f8f5f2; border-radius: 2px; padding: 2px; }
  .xproduct-aiv :is(.compare-pair-svg, .aiv36-radar) { font-family: var(--mono); }
  .xproduct-aiv :is(.compare-pair-svg text, .aiv36-radar text) { font-family: var(--mono); font-weight: 400; }
  .xproduct-aiv :is(.chart-mark, .visual-mark, .ci-h2h-row, .ci-heatmap-cell):focus-visible { outline: 1px solid var(--ink); outline-offset: 4px; }

  .xproduct-aiv :is(.exact-table, .table-fallback table, .compare-matrix, .compare-pivot-table, .discovery-exact-table table, .glossary-table, .release-budget-table table) {
    color: var(--ink); background-color: var(--surface); font-size: 11px;
  }
  .xproduct-aiv :is(.exact-table, .table-fallback, .compare-matrix, .compare-pivot-table, .discovery-exact-table, .glossary-table-wrap) :is(th, td) { border-color: var(--border); }
  .xproduct-aiv :is(.exact-table thead, .table-fallback thead, .compare-pivot-table thead, .discovery-exact-table thead) { color: var(--muted-ink); background: #171717; }
  .xproduct-aiv .exact-table tr.is-selected td { background: #242015; }
  .xproduct-aiv :is(.compare-matrix td > button, .compare-matrix-mobile > button) { color: var(--ink); }

  .xproduct-aiv :is(.detail-drawer, .evidence-sheet, .filter-sheet, .export-sheet) { border-color: var(--border-strong); color: var(--ink); background: var(--surface); }
  .xproduct-aiv :is(.evidence-sheet__header, .drawer__header, .drawer-tabs, .export-sheet__intro, .filter-sheet__header) { border-color: var(--border); background: #0e0e0e; }
  .xproduct-aiv .drawer-scrim, .xproduct-aiv .evidence-sheet::backdrop, .xproduct-aiv .filter-sheet::backdrop, .xproduct-aiv .export-sheet::backdrop { background: rgb(0 0 0 / 72%); }
  .xproduct-aiv :is(.toast, .mark-tooltip, .metric-tooltip) { border-color: var(--border-strong); color: var(--ink); background: #171717; box-shadow: 0 12px 48px #0009; }
  .xproduct-aiv .metric-tooltip__heading { border-color: var(--border); }
  .xproduct-aiv :is(.metric-tooltip dt, .metric-tooltip p, .metric-tooltip--concise small) { color: var(--muted-ink); }
  .xproduct-aiv .evidence-cohort-row.is-selected { border-color: var(--analytic); color: var(--ink); background: var(--analytic-soft); }
  .xproduct-aiv .exact-response__answer { color: var(--ink); background: var(--paper); line-height: 1.75; }
  .xproduct-aiv :is(.export-option, .export-option:hover) { color: var(--ink); background: var(--surface); }
  .xproduct-aiv .export-option:hover { outline: 1px solid var(--ink); outline-offset: -1px; }
  .xproduct-aiv .export-option:disabled { color: var(--quiet-ink); background: var(--paper-deep); }
  .xproduct-aiv :is(.state-button--suppressed, .unsupported-panel, .state-panel) {
    background: repeating-linear-gradient(135deg, transparent 0 12px, #ffffff04 12px 16px), var(--surface);
  }
  .xproduct-aiv :is(.state-button--error, .state-panel--error) { border-color: var(--negative); background: var(--negative-soft); }
  .xproduct-aiv .seo-no-script { color: var(--ink); background: var(--surface); font-family: var(--sans); }
  .xproduct-aiv .seo-no-script a { color: var(--ink); }
}

@media screen and (max-width: 1120px) {
  .xproduct-aiv .topbar__context { padding-inline: 12px; }
  .xproduct-aiv .topbar__actions { gap: 6px; padding-right: 12px; }
  .xproduct-aiv .topbar > .xproduct-home-link { padding-inline: 14px; }
}

@media screen and (max-width: 900px) {
  .xproduct-aiv .topbar { grid-template-columns: 56px minmax(0, 1fr) auto; }
  .xproduct-aiv .topbar > .xproduct-home-link { padding-inline: 10px; border-right: 0; }
  .xproduct-aiv .section-rail { background: #0a0a0a; }
  .xproduct-aiv .topbar__actions .xproduct-back-link { font-size: 9px; }
}

@media screen and (max-width: 600px) {
  :root:has(body.xproduct-project.xproduct-aiv) { --topbar-height: 108px; }
  .xproduct-aiv .topbar {
    grid-template-columns: 44px minmax(0, 1fr) 94px;
    grid-template-rows: 58px 44px;
    gap: 0 8px;
    height: var(--topbar-height);
    align-content: start;
    padding: 0 12px 6px;
  }
  .xproduct-aiv .menu-button { grid-column: 1; grid-row: 1; margin-left: 0; width: 38px; height: 38px; }
  .xproduct-aiv .topbar > .xproduct-home-link { grid-column: 2; grid-row: 1; min-width: 0; padding: 0; }
  .xproduct-aiv .topbar__actions {
    grid-column: 1 / -1; grid-row: 2; display: flex; align-items: stretch; gap: 6px;
    min-width: 0; width: 100%; padding: 0; height: 44px;
  }
  .xproduct-aiv .topbar__actions > .xproduct-back-link {
    position: absolute; top: 7px; right: 12px; max-width: 94px;
    display: inline-flex; align-items: center; font-size: 9px; line-height: 1.4; padding: 0; min-height: 44px;
  }
  .xproduct-aiv .topbar__actions > :is(.seo-read-link, .text-button, .primary-button) {
    display: inline-flex; flex: 1 1 0; align-items: center; justify-content: center;
    min-width: 0; max-width: none; min-height: 40px; padding: 7px 8px;
    color: var(--ink); font-size: 10px; line-height: 1.3; text-align: center; white-space: normal;
    box-shadow: none;
  }
  .xproduct-aiv .screen-header h1 { font-size: clamp(25px, 6.8vw, 34px); line-height: 1.3; letter-spacing: -.025em; }
  .xproduct-aiv .screen-header__lede { font-size: 12px; }
  .xproduct-aiv .filter-field select, .xproduct-aiv .mobile-view-field select { font-size: 10px; }
  .xproduct-aiv .thesis-panel h2 { font-size: 22px; }
  .xproduct-aiv .section-rail { top: var(--topbar-height); height: calc(100dvh - var(--topbar-height)); }
  .xproduct-aiv :is(.evidence-sheet, .filter-sheet, .export-sheet) { max-height: calc(100dvh - 16px); }
  .xproduct-aiv .detail-drawer { height: 100dvh; }
}

@media screen and (max-width: 360px) {
  .xproduct-aiv .topbar { grid-template-columns: 40px minmax(0, 1fr) 82px; padding-inline: 8px; gap: 0 6px; }
  .xproduct-aiv .topbar__actions > .xproduct-back-link { right: 8px; max-width: 82px; font-size: 8px; }
  .xproduct-aiv .topbar__actions > :is(.seo-read-link, .text-button, .primary-button) { font-size: 9px; padding-inline: 5px; }
}
