:root[data-theme="light"] {
    color-scheme: light;
}

:root[data-theme="dark"] {
    color-scheme: dark;
    --bg-canvas: #181614;
    --bg-panel: rgba(39, 38, 36, 0.88);
    --bg-panel-strong: #242526;
    --bg-accent: rgba(52, 94, 132, 0.42);
    --bg-accent-strong: rgba(96, 154, 211, 0.46);
    --bg-soft: #303136;
    --bg-hover: #35373d;
    --bg-selected: #183656;
    --bg-success: rgba(43, 108, 75, 0.32);
    --bg-warning: rgba(125, 88, 34, 0.34);
    --bg-danger: rgba(122, 48, 55, 0.34);
    --bg-disabled: #2a2b2f;
    --line-soft: rgba(255, 255, 255, 0.12);
    --line-strong: rgba(255, 255, 255, 0.2);
    --text-primary: #f6f3ef;
    --text-secondary: rgba(246, 243, 239, 0.76);
    --text-muted: rgba(246, 243, 239, 0.58);
    --text-danger: #ff8a91;
    --accent: #8fc7ff;
    --accent-pressed: #b5dbff;
    --green: #79daa2;
    --success: #79daa2;
    --orange: #ffd078;
    --warning: #ffd078;
    --red: #ff8a91;
    --danger: #ff8a91;
    --purple: #b7a4ff;
    --shadow-panel: 0 18px 42px rgba(0, 0, 0, 0.34);
    --shadow-card: 0 10px 26px rgba(0, 0, 0, 0.24);
    --shadow-soft: 0 2px 10px rgba(0, 0, 0, 0.22);
    --shadow-focus: 0 0 0 4px rgba(143, 199, 255, 0.24);
    --ink: var(--text-primary);
    --muted: var(--text-muted);
    --secondary: var(--text-secondary);
    --line: var(--line-soft);
    --fill: var(--bg-soft);
    --fill-strong: var(--bg-disabled);
    --surface: var(--bg-panel-strong);
    --shadow: var(--shadow-panel);
}

.site-navbar {
    position: relative;
    z-index: 20;
}

.site-breadcrumb {
    flex: 1 1 auto;
}

.app-shell {
    padding-top: 12px;
    padding-bottom: 12px;
}

.page-action-row {
    min-height: 32px;
    align-items: center;
    gap: 7px;
    margin-bottom: var(--stack-gap);
}

.capsule-button {
    min-height: 32px;
    gap: 6px;
    padding: 5px 11px;
    font-size: 13px;
    line-height: 1;
}

.capsule-button svg {
    width: 16px;
    height: 16px;
    display: block;
}

.site-footer {
    margin: var(--stack-gap) auto 0;
    padding: 0 2px;
    color: var(--text-muted);
    font-size: 0.78rem;
    line-height: 1.35;
    text-align: center;
}

body > .site-footer {
    width: min(1180px, calc(100% - var(--page-gutter)));
    padding-bottom: 12px;
}

.site-footer .footer-grid {
    display: grid;
    gap: 0;
    justify-content: center;
    align-items: center;
}

.theme-switcher {
    position: relative;
    z-index: 30;
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    align-self: center;
    margin-left: auto;
}

.theme-toggle {
    width: 30px;
    height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 1px solid rgba(255, 255, 255, 0.86);
    border-radius: 50%;
    background: var(--bg-panel);
    color: var(--accent);
    box-shadow: var(--shadow-soft);
    backdrop-filter: blur(18px);
    cursor: pointer;
    line-height: 0;
    transition: transform 160ms ease, background 160ms ease, color 160ms ease,
        border-color 160ms ease;
}

.theme-toggle:hover {
    border-color: rgba(10, 111, 232, 0.18);
    background: var(--bg-hover);
}

.theme-toggle:active {
    transform: scale(0.97);
}

.theme-toggle:focus-visible,
.theme-choice:focus-visible {
    outline: none;
    box-shadow: var(--shadow-focus);
}

.theme-toggle svg,
.theme-choice svg {
    width: 16px;
    height: 16px;
    flex: 0 0 auto;
    display: block;
}

.theme-toggle-icon,
.theme-choice-icon {
    width: 16px;
    height: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 0;
}

.theme-popover {
    position: absolute;
    z-index: 40;
    top: calc(100% + 7px);
    right: 0;
    width: max-content;
    max-width: calc(100vw - 2rem);
    padding: 4px;
    border: 1px solid rgba(255, 255, 255, 0.88);
    border-radius: 16px;
    background: var(--bg-panel);
    box-shadow: var(--shadow-panel);
    backdrop-filter: blur(22px);
}

.theme-segmented-control {
    display: grid;
    grid-template-columns: repeat(3, minmax(4.15rem, 1fr));
    gap: 2px;
    padding: 2px;
    border: 1px solid rgba(20, 31, 56, 0.06);
    border-radius: 999px;
    background: rgba(245, 248, 252, 0.94);
}

.theme-choice {
    min-height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 4px 9px;
    border: 0;
    border-radius: 999px;
    background: transparent;
    color: var(--text-secondary);
    font-size: 12px;
    font-weight: 650;
    white-space: nowrap;
    cursor: pointer;
    transition: background 140ms ease, color 140ms ease, box-shadow 140ms ease;
}

.theme-choice[aria-checked="true"] {
    background: var(--bg-panel-strong);
    color: var(--accent);
    box-shadow: var(--shadow-soft);
}

html[data-theme="dark"],
html[data-theme="dark"] body {
    background: var(--bg-canvas);
}

html[data-theme="dark"] .site-navbar {
    background: rgba(34, 33, 31, 0.78);
    border-bottom-color: var(--line-soft);
}

html[data-theme="dark"] .site-brand,
html[data-theme="dark"] .site-page-title {
    color: var(--text-primary);
}

html[data-theme="dark"] .theme-toggle,
html[data-theme="dark"] .capsule-button,
html[data-theme="dark"] .icon-button {
    border-color: var(--line-soft);
    background: var(--bg-panel);
}

html[data-theme="dark"] .theme-toggle:hover,
html[data-theme="dark"] .capsule-button:hover,
html[data-theme="dark"] .icon-button:hover {
    border-color: rgba(143, 199, 255, 0.3);
    background: var(--bg-hover);
}

html[data-theme="dark"] .theme-popover,
html[data-theme="dark"] .panel,
html[data-theme="dark"] .metric-card,
html[data-theme="dark"] .comparison-card,
html[data-theme="dark"] .result-card,
html[data-theme="dark"] .detail-card,
html[data-theme="dark"] .therapy-card,
html[data-theme="dark"] .reference-item,
html[data-theme="dark"] .tag,
html[data-theme="dark"] .check-row,
html[data-theme="dark"] .risk-card,
html[data-theme="dark"] .driver-item,
html[data-theme="dark"] .data-table {
    border-color: var(--line-soft);
}

html[data-theme="dark"] .theme-segmented-control,
html[data-theme="dark"] .mini-segmented-control,
html[data-theme="dark"] .segmented-control {
    border-color: var(--line-soft);
    background: var(--bg-soft);
}

html[data-theme="dark"] .theme-choice[aria-checked="true"],
html[data-theme="dark"] .mini-segment[aria-pressed="true"],
html[data-theme="dark"] .segmented-option.active {
    background: var(--bg-panel-strong);
    color: var(--accent);
}

html[data-theme="dark"] .input-wrap,
html[data-theme="dark"] .input-wrap input,
html[data-theme="dark"] .input,
html[data-theme="dark"] .search-input {
    border-color: var(--line-soft);
    background: var(--bg-panel-strong);
    color: var(--text-primary);
}

html[data-theme="dark"] .input-wrap:focus-within,
html[data-theme="dark"] .input:focus,
html[data-theme="dark"] .search-input:focus {
    border-color: rgba(143, 199, 255, 0.55);
}

html[data-theme="dark"] .input::placeholder,
html[data-theme="dark"] .search-input::placeholder {
    color: var(--text-muted);
}

html[data-theme="dark"] .input-wrap input {
    box-shadow: none;
}

html[data-theme="dark"] .choice-card,
html[data-theme="dark"] .score-option {
    border-color: var(--line-soft);
    background: var(--bg-panel-strong);
}

html[data-theme="dark"] .choice-card:hover,
html[data-theme="dark"] .score-option:hover,
html[data-theme="dark"] .disclosure-button:hover {
    border-color: rgba(143, 199, 255, 0.3);
    background: var(--bg-hover);
}

html[data-theme="dark"] .choice-card[aria-pressed="true"],
html[data-theme="dark"] .score-option.active {
    border-color: rgba(143, 199, 255, 0.42);
    background: var(--bg-selected);
    color: var(--accent);
}

html[data-theme="dark"] .toggle-row {
    border-color: var(--line-soft);
    background: var(--bg-panel-strong);
}

html[data-theme="dark"] .toggle-visual {
    background: var(--bg-disabled);
}

html[data-theme="dark"] .toggle-visual::after {
    background: var(--text-primary);
    box-shadow: 0 1px 5px rgba(0, 0, 0, 0.38);
}

html[data-theme="dark"] .scale-track {
    height: 0.86rem;
    border-color: rgba(246, 243, 239, 0.18);
    background: #1d2025;
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.28);
}

html[data-theme="dark"] .scale-fill {
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08);
}

html[data-theme="dark"] .scale-marker {
    border-color: #171a1f;
    box-shadow: 0 0 0 1px rgba(246, 243, 239, 0.3), 0 1px 5px rgba(0, 0, 0, 0.4);
}

html[data-theme="dark"] .scale-ticks {
    color: var(--text-secondary);
}

html[data-theme="dark"] .autocomplete {
    border-color: var(--line-soft);
    background: rgba(39, 38, 36, 0.96);
    box-shadow: var(--shadow-panel);
}

html[data-theme="dark"] .autocomplete-item {
    color: var(--text-primary);
}

html[data-theme="dark"] .unit-badge,
html[data-theme="dark"] .pill,
html[data-theme="dark"] .pill-label,
html[data-theme="dark"] .detail-chip,
html[data-theme="dark"] .state-chip,
html[data-theme="dark"] .status-pill,
html[data-theme="dark"] .tag-remove,
html[data-theme="dark"] .risk-percent,
html[data-theme="dark"] .summary-item,
html[data-theme="dark"] .rate-box {
    background: var(--bg-soft);
    color: var(--text-secondary);
}

html[data-theme="dark"] .status-good,
html[data-theme="dark"] .risk-low,
html[data-theme="dark"] .risk-card.low {
    border-color: rgba(121, 218, 162, 0.32);
    background: var(--bg-success);
    color: var(--success);
}

html[data-theme="dark"] .status-caution,
html[data-theme="dark"] .state-chip-caution,
html[data-theme="dark"] .risk-high,
html[data-theme="dark"] .risk-card.intermediate {
    border-color: rgba(255, 208, 120, 0.34);
    background: var(--bg-warning);
    color: var(--warning);
}

html[data-theme="dark"] .status-danger,
html[data-theme="dark"] .risk-ultrahigh,
html[data-theme="dark"] .risk-card.high {
    border-color: rgba(255, 138, 145, 0.34);
    background: var(--bg-danger);
    color: var(--danger);
}

html[data-theme="dark"] .scale-fill.status-good {
    background: #6ec691;
}

html[data-theme="dark"] .scale-fill.status-caution {
    background: #d9b15f;
}

html[data-theme="dark"] .scale-fill.status-danger {
    background: #da737a;
}

html[data-theme="dark"] .data-table th {
    background: var(--bg-soft);
    color: var(--text-secondary);
}

html[data-theme="dark"] .data-table th,
html[data-theme="dark"] .data-table td {
    border-bottom-color: var(--line-soft);
}

@media (max-width: 460px) {
    .theme-segmented-control {
        grid-template-columns: 1fr;
        border-radius: 14px;
    }

    .theme-choice {
        justify-content: flex-start;
        min-width: 7.25rem;
    }
}

@media print {
    :root,
    :root[data-theme],
    :root[data-theme="dark"] {
        color-scheme: light !important;
        --bg-canvas: #ffffff;
        --bg-panel: #ffffff;
        --bg-panel-strong: #ffffff;
        --bg-soft: #f6f8fb;
        --bg-hover: #f7f9fc;
        --bg-selected: #e6f1ff;
        --bg-success: #eaf7ee;
        --bg-warning: #fff4df;
        --bg-danger: #fff0ef;
        --line-soft: rgba(18, 31, 53, 0.1);
        --line-strong: rgba(18, 31, 53, 0.18);
        --text-primary: #172033;
        --text-secondary: rgba(23, 32, 51, 0.74);
        --text-muted: rgba(23, 32, 51, 0.54);
        --text-danger: #b02a37;
        --accent: #0a6fe8;
        --success: #237a45;
        --warning: #a36105;
        --danger: #b02a37;
        --green: #217a3a;
        --orange: #9a5b00;
        --red: #b02a37;
        --ink: #172033;
        --muted: rgba(23, 32, 51, 0.54);
        --secondary: rgba(23, 32, 51, 0.74);
        --surface: #ffffff;
    }

    html,
    html[data-theme],
    html[data-theme="dark"],
    body,
    html[data-theme="dark"] body {
        background: #ffffff !important;
        color: #000000 !important;
    }

    .theme-switcher {
        display: none !important;
    }
}