:root {
    color-scheme: light;
    --bg: #f4f6f3;
    --surface: #ffffff;
    --surface-soft: #f8faf7;
    --ink: #172019;
    --muted: #667269;
    --line: #dde4dd;
    --accent: #315f47;
    --accent-soft: #e3efe8;
    --warning: #9a650d;
    --warning-soft: #fff2d4;
    --danger: #a53a3a;
    --danger-soft: #fde8e7;
    --running: #27638b;
    --running-soft: #e5f2fa;
    --shadow: 0 18px 50px rgba(27, 46, 34, .08);
    --page-glow: rgba(211, 229, 217, .8);
    --topbar-border: rgba(221, 228, 221, .85);
    --topbar-bg: rgba(244, 246, 243, .88);
    --surface-glass: rgba(255, 255, 255, .72);
    --surface-faint: rgba(255, 255, 255, .58);
    --on-accent: #ffffff;
    --on-danger: #ffffff;
    --ok-border: #bed9c8;
    --warning-border: #eed49d;
    --danger-border: #efc7c4;
    --start-border: #b8d1c2;
    --disabled-ink: #8d9690;
    --neutral-bg: #eef1ed;
    --neutral-soft: #e9ede8;
    --disabled-bg: #f1f3f0;
    --tooltip-bg: #263029;
    --tooltip-ink: #ffffff;
    --tooltip-shadow: 0 10px 28px rgba(22, 34, 26, .22);
    --empty-border: #cbd5cc;
    --log-status-bg: #edf0ec;
    --window-morning-soft: #edf5f1;
    --window-evening: #755b8f;
    --window-evening-soft: #f1eef6;
    --window-morning-stripe: rgba(47, 103, 75, .45);
    --window-day-stripe: rgba(166, 104, 24, .45);
    --window-evening-stripe: rgba(117, 91, 143, .45);
    --bas-row-bg: rgba(255, 242, 212, .24);
    --result-dot-bg: #d8ded8;
    --legend-border: rgba(23, 32, 25, .12);
    --heatmap-cell-ink: #243229;
    --heatmap-cell-border: rgba(23, 32, 25, .08);
    --heatmap-top-ink: #17492f;
    --heatmap-top-bg: #d8eee1;
    --heatmap-good-ink: #35551c;
    --heatmap-good-bg: #eaf3d8;
    --heatmap-middle-ink: #704c08;
    --heatmap-middle-bg: #fff0c4;
    --heatmap-poor-ink: #7a302c;
    --heatmap-poor-bg: #f8d9d4;
    --heatmap-not-found-a: #fae5e2;
    --heatmap-not-found-b: #f4d6d2;
    --heatmap-empty-ink: #788079;
    --heatmap-empty-bg: #f0f3ef;
    --coverage-partial: rgba(166, 104, 24, .75);
    --coverage-low: rgba(171, 54, 47, .78);
}

:root[data-theme="dark"] {
    color-scheme: dark;
    --bg: #0c120e;
    --surface: #141d17;
    --surface-soft: #18231c;
    --ink: #edf4ef;
    --muted: #9caaa0;
    --line: #2b3a30;
    --accent: #78c495;
    --accent-soft: #1b3827;
    --warning: #efbd64;
    --warning-soft: #3a2b14;
    --danger: #f0918b;
    --danger-soft: #3d211f;
    --running: #78bde8;
    --running-soft: #19364a;
    --shadow: 0 20px 55px rgba(0, 0, 0, .34);
    --page-glow: rgba(45, 92, 64, .32);
    --topbar-border: rgba(48, 65, 53, .92);
    --topbar-bg: rgba(12, 18, 14, .88);
    --surface-glass: rgba(20, 29, 23, .8);
    --surface-faint: rgba(20, 29, 23, .68);
    --on-accent: #09150e;
    --on-danger: #1c0908;
    --ok-border: #315b41;
    --warning-border: #6c4f21;
    --danger-border: #6f3834;
    --start-border: #3d7150;
    --disabled-ink: #718078;
    --neutral-bg: #202b23;
    --neutral-soft: #26332a;
    --disabled-bg: #202a23;
    --tooltip-bg: #050a07;
    --tooltip-ink: #edf4ef;
    --tooltip-shadow: 0 12px 30px rgba(0, 0, 0, .45);
    --empty-border: #405247;
    --log-status-bg: #222d25;
    --window-morning-soft: #1c3326;
    --window-evening: #c8a9df;
    --window-evening-soft: #2c2436;
    --window-morning-stripe: rgba(120, 196, 149, .55);
    --window-day-stripe: rgba(239, 189, 100, .55);
    --window-evening-stripe: rgba(200, 169, 223, .55);
    --bas-row-bg: rgba(239, 189, 100, .08);
    --result-dot-bg: #344239;
    --legend-border: rgba(237, 244, 239, .15);
    --heatmap-cell-ink: #dce7df;
    --heatmap-cell-border: rgba(237, 244, 239, .1);
    --heatmap-top-ink: #b9ebcb;
    --heatmap-top-bg: #183b29;
    --heatmap-good-ink: #d0e8ae;
    --heatmap-good-bg: #2b3a1e;
    --heatmap-middle-ink: #ffd681;
    --heatmap-middle-bg: #493a17;
    --heatmap-poor-ink: #ffaaa3;
    --heatmap-poor-bg: #482522;
    --heatmap-not-found-a: #3b211f;
    --heatmap-not-found-b: #482824;
    --heatmap-empty-ink: #8b9990;
    --heatmap-empty-bg: #1c261f;
    --coverage-partial: rgba(239, 189, 100, .84);
    --coverage-low: rgba(240, 112, 103, .9);
}

* {
    box-sizing: border-box;
}

html {
    min-height: 100%;
    background: var(--bg);
}

body {
    margin: 0;
    color: var(--ink);
    background:
        radial-gradient(circle at 88% 2%, var(--page-glow), transparent 28rem),
        var(--bg);
    font-family: Inter, "Segoe UI", system-ui, sans-serif;
}

a {
    color: inherit;
}

.topbar {
    position: sticky;
    z-index: 10;
    top: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 72px;
    padding: 0 4vw;
    border-bottom: 1px solid var(--topbar-border);
    background: var(--topbar-bg);
    backdrop-filter: blur(14px);
}

.brand {
    display: flex;
    gap: 12px;
    align-items: center;
    text-decoration: none;
}

.brand-mark {
    display: grid;
    width: 42px;
    height: 42px;
    color: var(--on-accent);
    border-radius: 13px;
    background: var(--accent);
    place-items: center;
    font-weight: 750;
    letter-spacing: -.04em;
}

.brand strong,
.brand small {
    display: block;
}

.brand small {
    margin-top: 2px;
    color: var(--muted);
    font-size: 12px;
}

.topbar nav {
    display: flex;
    gap: 8px;
}

.topbar-actions {
    display: flex;
    gap: 12px;
    align-items: center;
}

.logout-form {
    display: flex;
    gap: 10px;
    align-items: center;
    color: var(--muted);
    font-size: 13px;
}

.topbar nav a {
    padding: 9px 12px;
    color: var(--muted);
    border-radius: 9px;
    text-decoration: none;
    font-size: 14px;
}

.topbar nav a:hover {
    color: var(--ink);
    background: var(--surface);
}

.theme-toggle {
    display: inline-flex;
    width: 66px;
    height: 38px;
    padding: 3px;
    flex: 0 0 auto;
    color: var(--muted);
    border: 1px solid var(--line);
    border-radius: 99px;
    cursor: pointer;
    background: var(--surface);
    align-items: center;
}

.theme-toggle:hover {
    border-color: var(--accent);
}

.theme-toggle:focus-visible {
    outline: 3px solid var(--accent-soft);
    outline-offset: 2px;
}

.theme-toggle-track {
    position: relative;
    display: flex;
    width: 100%;
    height: 100%;
    padding: 0 6px;
    align-items: center;
    justify-content: space-between;
}

.theme-toggle svg {
    z-index: 1;
    width: 15px;
    height: 15px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
    pointer-events: none;
}

.theme-toggle-sun {
    color: var(--on-accent);
}

.theme-toggle-thumb {
    position: absolute;
    z-index: 0;
    top: 1px;
    left: 0;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: var(--accent);
    box-shadow: 0 3px 9px rgba(0, 0, 0, .18);
    transition: transform .18s ease;
}

:root[data-theme="dark"] .theme-toggle-thumb {
    transform: translateX(30px);
}

:root[data-theme="dark"] .theme-toggle-sun {
    color: var(--muted);
}

:root[data-theme="dark"] .theme-toggle-moon {
    color: var(--on-accent);
}

.shell {
    width: min(1480px, 92vw);
    margin: 0 auto;
    padding: 46px 0 80px;
}

.page-heading {
    display: flex;
    gap: 32px;
    align-items: end;
    justify-content: space-between;
    margin-bottom: 28px;
}

.eyebrow {
    margin: 0 0 7px;
    color: var(--accent);
    font-size: 12px;
    font-weight: 750;
    letter-spacing: .11em;
    text-transform: uppercase;
}

h1,
h2,
p {
    margin-top: 0;
}

h1 {
    margin-bottom: 10px;
    font-size: clamp(32px, 4vw, 52px);
    line-height: 1;
    letter-spacing: -.045em;
}

.page-heading > div > p:last-child {
    max-width: 700px;
    margin-bottom: 0;
    color: var(--muted);
    font-size: 16px;
}

.date-picker,
.filter-bar,
.card-actions {
    display: flex;
    gap: 10px;
    align-items: end;
}

label {
    display: grid;
    gap: 6px;
    color: var(--muted);
    font-size: 12px;
    font-weight: 650;
}

input,
select {
    min-height: 40px;
    padding: 0 12px;
    color: var(--ink);
    border: 1px solid var(--line);
    border-radius: 10px;
    outline: none;
    background: var(--surface);
    font: inherit;
}

.parser-filter-select {
    min-width: 240px;
}

input:focus,
select:focus {
    border-color: var(--accent);
    box-shadow: 0 0 0 3px var(--accent-soft);
}

.button {
    display: inline-flex;
    min-height: 40px;
    padding: 0 15px;
    align-items: center;
    justify-content: center;
    border: 1px solid transparent;
    border-radius: 10px;
    cursor: pointer;
    text-decoration: none;
    font: inherit;
    font-size: 13px;
    font-weight: 700;
}

.button.primary {
    color: var(--on-accent);
    background: var(--accent);
}

.button.secondary {
    color: var(--ink);
    border-color: var(--line);
    background: var(--surface);
}

.button.danger-outline {
    color: var(--danger);
    border-color: var(--danger-border);
    background: transparent;
}

.button.danger {
    color: var(--on-danger);
    background: var(--danger);
}

.button:disabled,
.link-button:disabled {
    cursor: not-allowed;
    opacity: .38;
}

.login-shell {
    display: grid;
    min-height: calc(100vh - 150px);
    place-items: center;
}

.login-card {
    display: grid;
    width: min(440px, 100%);
    gap: 20px;
    padding: clamp(24px, 5vw, 42px);
    border: 1px solid var(--line);
    border-radius: 24px;
    background: var(--surface);
    box-shadow: var(--shadow);
}

.login-card h1,
.login-card p {
    margin: 0;
}

.login-card > div:first-child {
    display: grid;
    gap: 10px;
}

.login-card label {
    display: grid;
    gap: 8px;
    font-weight: 650;
}

.login-card input {
    width: 100%;
    padding: 12px 14px;
    color: var(--ink);
    border: 1px solid var(--line);
    border-radius: 10px;
    background: var(--surface-soft);
    font: inherit;
}

.login-card input:focus {
    outline: 2px solid var(--accent);
    outline-offset: 2px;
}

.login-card [data-valmsg-for] {
    color: var(--danger);
    font-size: 13px;
}

.metrics {
    display: grid;
    margin-bottom: 24px;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
}

.metrics article {
    padding: 20px 22px;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: var(--surface-glass);
}

.metrics span,
.metrics small {
    display: block;
    color: var(--muted);
    font-size: 12px;
}

.metrics strong {
    display: inline-block;
    margin: 6px 5px 4px 0;
    font-size: 29px;
    letter-spacing: -.04em;
}

.metrics .structure-metric {
    border-left-width: 3px;
}

.structure-metric.ok {
    border-color: var(--ok-border);
}

.structure-metric.warning {
    border-color: var(--warning-border);
}

.structure-metric.danger {
    border-color: var(--danger-border);
}

.metrics .structure-state {
    display: flex;
    min-height: 35px;
    align-items: center;
    gap: 8px;
    font-size: 22px;
    line-height: 1.05;
    letter-spacing: -.025em;
}

.structure-state i {
    width: 9px;
    height: 9px;
    flex: 0 0 auto;
    border-radius: 50%;
    background: currentColor;
}

.structure-metric.ok .structure-state {
    color: var(--accent);
}

.structure-metric.warning .structure-state {
    color: var(--warning);
}

.structure-metric.danger .structure-state {
    color: var(--danger);
}

.metrics .structure-last-update {
    margin-top: 4px;
}

.structure-last-update time {
    color: var(--ink);
    font-weight: 650;
}

.notice {
    margin: 18px 0;
    padding: 14px 16px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: var(--surface);
    font-size: 14px;
}

.notice.ok {
    color: var(--accent);
    border-color: var(--ok-border);
    background: var(--accent-soft);
}

.notice.warning {
    color: var(--warning);
    border-color: var(--warning-border);
    background: var(--warning-soft);
}

.notice.danger {
    color: var(--danger);
    border-color: var(--danger-border);
    background: var(--danger-soft);
}

.notice.neutral {
    color: var(--muted);
}

.bas-monitor-hint {
    margin: -4px 0 18px;
    color: var(--muted);
    font-size: 12px;
}

.bas-monitor-hint a {
    color: var(--accent);
    font-weight: 750;
}

.parser-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

.parser-list-toolbar {
    display: flex;
    margin: 0 0 16px;
    align-items: center;
    justify-content: space-between;
    color: var(--muted);
    font-size: 13px;
}

.global-schedule {
    display: grid;
    margin: 0 0 24px;
    padding: 18px 20px;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: var(--surface);
    grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
    gap: 12px;
    box-shadow: var(--shadow);
}

.schedule-intro {
    padding: 3px 16px 3px 2px;
    grid-column: 1 / -1;
}

.schedule-intro h2 {
    margin-bottom: 6px;
    font-size: 19px;
    letter-spacing: -.025em;
}

.schedule-intro p:last-child {
    margin-bottom: 0;
    color: var(--muted);
    font-size: 12px;
    line-height: 1.4;
}

.global-schedule article {
    display: grid;
    padding: 12px 14px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: var(--surface-soft);
    align-content: center;
}

.global-schedule article span,
.global-schedule article small {
    color: var(--muted);
    font-size: 11px;
}

.global-schedule article strong {
    margin: 3px 0;
    font-size: 19px;
}

.parser-card {
    display: flex;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 20px;
    background: var(--surface);
    box-shadow: var(--shadow);
    flex-direction: column;
}

.parser-card > header,
.parser-card > footer {
    display: flex;
    gap: 24px;
    align-items: start;
    justify-content: space-between;
    padding: 22px 24px;
}

.parser-card > header {
    position: relative;
    z-index: 3;
}

.parser-identity {
    min-width: 0;
}

.parser-header-state {
    display: grid;
    flex: 0 0 auto;
    justify-items: end;
    gap: 12px;
}

.parser-header-actions {
    display: flex;
    align-items: center;
    gap: 8px;
}

.icon-control,
.icon-action-form {
    position: relative;
    display: inline-flex;
    margin: 0;
}

.icon-button {
    display: inline-grid;
    width: 38px;
    height: 38px;
    padding: 0;
    color: var(--muted);
    border: 1px solid var(--line);
    border-radius: 11px;
    cursor: pointer;
    background: var(--surface);
    place-items: center;
    transition: color .15s ease, border-color .15s ease, background .15s ease, transform .15s ease;
}

.icon-button svg {
    width: 18px;
    height: 18px;
    fill: currentColor;
}

.icon-button svg.stroke-icon {
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.icon-button:hover:not(:disabled) {
    transform: translateY(-1px);
}

.icon-button:focus-visible,
.icon-control:focus-visible {
    outline: 3px solid var(--running-soft);
    outline-offset: 2px;
}

.icon-button.start,
.icon-button.is-primary {
    color: var(--accent);
    border-color: var(--start-border);
    background: var(--accent-soft);
}

.icon-button.stop,
.icon-button.is-danger {
    color: var(--danger);
    border-color: var(--danger-border);
    background: var(--danger-soft);
}

.icon-button:disabled,
.icon-control.is-disabled .icon-button {
    color: var(--disabled-ink);
    border-color: var(--line);
    cursor: not-allowed;
    background: var(--disabled-bg);
    opacity: .58;
    transform: none;
}

.control-tooltip {
    position: absolute;
    z-index: 20;
    top: calc(100% + 9px);
    right: 0;
    visibility: hidden;
    width: max-content;
    max-width: min(280px, 78vw);
    padding: 9px 11px;
    color: var(--tooltip-ink);
    border-radius: 9px;
    opacity: 0;
    background: var(--tooltip-bg);
    box-shadow: var(--tooltip-shadow);
    pointer-events: none;
    font-size: 11px;
    font-weight: 500;
    line-height: 1.35;
    text-align: left;
    transition: opacity .12s ease, visibility .12s ease;
}

.control-tooltip::before {
    position: absolute;
    right: 12px;
    bottom: 100%;
    width: 0;
    height: 0;
    border-right: 5px solid transparent;
    border-bottom: 5px solid var(--tooltip-bg);
    border-left: 5px solid transparent;
    content: "";
}

.control-tooltip strong {
    display: block;
    margin-bottom: 2px;
}

.icon-control:hover > .control-tooltip,
.icon-control:focus > .control-tooltip,
.icon-control:focus-within > .control-tooltip {
    visibility: visible;
    opacity: 1;
}

.icon-control[open] > .control-tooltip {
    visibility: hidden;
    opacity: 0;
}

.parser-card h2 {
    margin-bottom: 5px;
    font-size: 25px;
    letter-spacing: -.035em;
}

.parser-card header p:last-child {
    margin-bottom: 0;
    color: var(--muted);
    font-size: 13px;
}

.status {
    display: inline-flex;
    flex: 0 0 auto;
    gap: 7px;
    align-items: center;
    padding: 7px 10px;
    color: var(--muted);
    border-radius: 99px;
    background: var(--neutral-bg);
    font-size: 12px;
    font-weight: 750;
}

.status i,
.status-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: currentColor;
}

.status.ok,
.status-dot.ok {
    color: var(--accent);
    background: var(--accent-soft);
}

.status.warning,
.status-dot.warning {
    color: var(--warning);
    background: var(--warning-soft);
}

.status.danger,
.status-dot.danger {
    color: var(--danger);
    background: var(--danger-soft);
}

.status.running {
    color: var(--running);
    background: var(--running-soft);
}

.status.compact {
    padding: 4px 7px;
    font-size: 10px;
}

.parser-meta {
    display: flex;
    padding: 12px 24px;
    color: var(--muted);
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
    background: var(--surface-soft);
    font-size: 11px;
}

.parser-meta span + span {
    margin-left: 14px;
    padding-left: 14px;
    border-left: 1px solid var(--line);
}

.parser-meta b {
    color: var(--ink);
}

.parser-meta .next-planned-run {
    display: inline-flex;
    align-items: baseline;
    gap: 4px;
    color: var(--accent);
}

.parser-meta .next-planned-run.is-overdue {
    color: var(--danger);
}

.windows {
    display: grid;
    padding: 20px 24px;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: 12px;
}

.window {
    display: flex;
    min-width: 0;
    padding: 13px;
    border: 1px solid var(--line);
    border-radius: 13px;
    flex-direction: column;
}

.window-title {
    display: flex;
    gap: 5px;
    align-items: center;
    justify-content: space-between;
    font-size: 13px;
}

.progress {
    overflow: hidden;
    height: 5px;
    margin: 13px 0 9px;
    border-radius: 5px;
    background: var(--neutral-soft);
}

.progress span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: var(--accent);
}

.window p {
    margin-bottom: 5px;
    color: var(--muted);
    font-size: 11px;
    line-height: 1.35;
}

.planned-start {
    display: flex;
    min-height: 20px;
    margin-top: 8px;
    padding: 6px 8px;
    border-radius: 8px;
    align-items: baseline;
    gap: 5px;
    background: var(--surface-soft);
}

.planned-start span {
    color: var(--muted);
    font-size: 9px;
    text-transform: uppercase;
}

.planned-start strong {
    color: var(--muted);
    font-size: 12px;
}

.planned-start small {
    margin-left: auto;
    color: var(--muted);
    font-size: 9px;
}

.planned-start.is-overdue {
    background: var(--danger-soft);
}

.planned-start.is-overdue strong,
.planned-start.is-overdue span {
    color: var(--danger);
}

.run-timing-slot {
    min-height: 62px;
}

.run-timing {
    display: flex;
    margin-top: 10px;
    padding: 9px 10px;
    border-radius: 10px;
    background: var(--surface-soft);
    align-items: center;
    gap: 15px;
}

.run-timing span {
    display: grid;
    gap: 1px;
}

.run-timing small {
    color: var(--muted);
    font-size: 9px;
    text-transform: uppercase;
}

.run-timing strong {
    font-size: 13px;
}

.run-timing .actual-start small,
.run-timing .actual-start strong {
    color: var(--accent);
}

.run-timing em {
    margin-left: auto;
    color: var(--accent);
    font-size: 10px;
    font-style: normal;
    font-weight: 750;
}

.result-period {
    margin-top: 10px;
}

.window-error {
    margin: 2px 0 8px;
    padding: 9px 10px;
    color: var(--warning);
    border: 1px solid var(--warning-border);
    border-radius: 10px;
    background: var(--warning-soft);
}

.window-error.danger {
    color: var(--danger);
    border-color: var(--danger-border);
    background: var(--danger-soft);
}

.window-error > div {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.window-error strong,
.window-error time {
    font-size: 10px;
}

.window-error time {
    white-space: nowrap;
}

.window-error p {
    margin: 4px 0 0;
    color: inherit;
    font-weight: 700;
}

.window-error a {
    display: inline-block;
    margin-top: 3px;
    color: inherit;
    font-size: 10px;
    font-weight: 750;
}

.data-state {
    min-height: 30px;
    margin-top: 5px;
    font-weight: 700;
}

.data-state.ok {
    color: var(--accent);
}

.data-state.warning {
    color: var(--warning);
}

.inline-action {
    margin-top: auto;
    padding-top: 9px;
}

.window-reset-button {
    min-height: 36px;
    width: 100%;
}

.window-reset-help {
    display: block;
    margin-top: 7px;
    color: var(--muted);
    font-size: 11px;
    line-height: 1.45;
}

.link-button {
    padding: 0;
    color: var(--accent);
    border: 0;
    cursor: pointer;
    background: transparent;
    font: inherit;
    font-size: 11px;
    font-weight: 700;
}

.manual-start,
.manual-finish {
    position: relative;
}

.manual-start > summary,
.manual-finish > summary {
    list-style: none;
    cursor: pointer;
}

.manual-start > summary::-webkit-details-marker,
.manual-finish > summary::-webkit-details-marker {
    display: none;
}

.manual-start-form,
.manual-finish-form {
    position: absolute;
    z-index: 30;
    top: 48px;
    right: 0;
    display: grid;
    width: min(340px, 80vw);
    padding: 16px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: var(--surface);
    box-shadow: var(--shadow);
    gap: 12px;
}

.manual-start-form p,
.manual-finish-form p {
    margin: 0;
    color: var(--muted);
    font-size: 12px;
    line-height: 1.45;
}

.manual-start-form select,
.manual-finish-form input {
    width: 100%;
}

.delivery-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.delivery-card {
    overflow: hidden;
    border: 1px solid var(--line);
    border-top-width: 4px;
    border-radius: 16px;
    background: var(--surface);
    box-shadow: var(--shadow);
}

.delivery-card.ok {
    border-top-color: var(--accent);
}

.delivery-card.warning {
    border-top-color: var(--warning);
}

.delivery-card.danger {
    border-top-color: var(--danger);
}

.delivery-card > header {
    display: flex;
    padding: 20px;
    align-items: start;
    justify-content: space-between;
}

.delivery-card h2 {
    margin-bottom: 0;
    font-size: 20px;
}

.delivery-stages {
    display: grid;
    padding: 0 20px 18px;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
}

.delivery-stages div {
    display: grid;
    padding: 12px;
    border-radius: 10px;
    background: var(--surface-soft);
    gap: 4px;
}

.delivery-stages span,
.delivery-stages small,
.delivery-route dt {
    color: var(--muted);
    font-size: 10px;
}

.delivery-stages strong {
    font-size: 13px;
}

.delivery-route {
    display: grid;
    margin: 0;
    padding: 14px 20px;
    border-top: 1px solid var(--line);
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
}

.delivery-route div {
    min-width: 0;
}

.delivery-route dt,
.delivery-route dd {
    margin: 0;
}

.delivery-route dd {
    overflow: hidden;
    margin-top: 3px;
    font-size: 12px;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.delivery-issues,
.delivery-error {
    margin: 0 20px 16px;
    padding: 10px 12px;
    color: var(--warning);
    border-radius: 9px;
    background: var(--warning-soft);
    font-size: 11px;
}

.delivery-issues summary {
    cursor: pointer;
    font-weight: 750;
}

.delivery-issues p {
    margin: 8px 0 0;
    overflow-wrap: anywhere;
}

.delivery-error {
    color: var(--danger);
    background: var(--danger-soft);
}

.parser-card > footer {
    min-height: 105px;
    margin-top: auto;
    align-items: end;
    border-top: 1px solid var(--line);
    background: var(--surface-soft);
    box-sizing: border-box;
}

.last-event {
    min-width: 0;
}

.last-event span,
.last-event strong {
    display: block;
    font-size: 11px;
}

.last-event span {
    margin-bottom: 4px;
    color: var(--muted);
}

.last-event p {
    overflow: hidden;
    max-width: 440px;
    margin: 6px 0 0;
    color: var(--muted);
    font-size: 11px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.empty-state {
    padding: 70px 30px;
    border: 1px dashed var(--empty-border);
    border-radius: 20px;
    text-align: center;
    background: var(--surface-faint);
}

.empty-state h2 {
    margin: 12px 0 8px;
}

.empty-state p {
    margin-bottom: 0;
    color: var(--muted);
}

.filter-bar {
    margin-bottom: 20px;
    padding: 16px;
    border: 1px solid var(--line);
    border-radius: 15px;
    background: var(--surface);
}

.log-filters {
    flex-wrap: wrap;
}

.log-filters label {
    min-width: 120px;
}

.log-results-summary {
    display: flex;
    margin: 0 2px 10px;
    color: var(--muted);
    align-items: baseline;
    justify-content: space-between;
    gap: 16px;
    font-size: 12px;
}

.log-results-summary strong {
    color: var(--ink);
    font-size: 14px;
}

.analytics-filters {
    flex-wrap: wrap;
}

.analytics-filters .search-field {
    flex: 1 1 240px;
}

.analytics-filters .search-field input {
    width: 100%;
}

.filter-hint {
    margin: -8px 0 22px;
    color: var(--muted);
    font-size: 12px;
}

.section-toolbar,
.section-heading {
    display: flex;
    gap: 20px;
    align-items: end;
    justify-content: space-between;
}

.section-toolbar {
    margin: 0 0 16px;
}

.section-toolbar > div {
    display: flex;
    gap: 8px;
    align-items: baseline;
}

.section-toolbar strong {
    font-size: 25px;
}

.section-toolbar span,
.section-heading > p {
    color: var(--muted);
    font-size: 12px;
}

.section-heading {
    margin-bottom: 14px;
}

.section-heading h2 {
    margin-bottom: 0;
    font-size: 25px;
    letter-spacing: -.03em;
}

.section-heading > p {
    margin-bottom: 0;
    text-align: right;
}

.data-table-wrap,
.log-table-wrap {
    overflow: auto;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: var(--surface);
    box-shadow: var(--shadow);
}

.data-table,
.log-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}

.data-table th,
.data-table td,
.log-table th,
.log-table td {
    padding: 12px 14px;
    border-bottom: 1px solid var(--line);
    text-align: left;
}

.data-table th,
.log-table th {
    position: sticky;
    z-index: 1;
    top: 0;
    color: var(--muted);
    background: var(--surface-soft);
    font-size: 11px;
    text-transform: uppercase;
}

.data-table tr:last-child td,
.log-table tr:last-child td {
    border-bottom: 0;
}

.log-status {
    display: inline-block;
    padding: 4px 7px;
    border-radius: 7px;
    background: var(--log-status-bg);
    font-family: Consolas, monospace;
    font-size: 11px;
}

.log-status.error,
.log-status.failed,
.log-status.fatal {
    color: var(--danger);
    background: var(--danger-soft);
}

.log-status.done,
.log-status.sku_done {
    color: var(--accent);
    background: var(--accent-soft);
}

.log-window-separator th {
    position: relative;
    z-index: 0;
    top: auto;
    padding: 9px 14px;
    border-top: 3px solid var(--surface);
    background: var(--window-morning-soft);
    text-align: left;
    text-transform: none;
}

.log-window-separator th span {
    color: var(--accent);
    font-size: 12px;
    font-weight: 800;
}

.log-window-separator th small {
    margin-left: 7px;
    color: var(--muted);
    font-size: 10px;
    font-weight: 600;
}

.log-window-separator.window-2 th {
    background: var(--warning-soft);
}

.log-window-separator.window-2 th span {
    color: var(--warning);
}

.log-window-separator.window-3 th {
    background: var(--window-evening-soft);
}

.log-window-separator.window-3 th span {
    color: var(--window-evening);
}

.log-entry-row.window-1 td:first-child {
    box-shadow: inset 3px 0 0 var(--window-morning-stripe);
}

.log-entry-row.window-2 td:first-child {
    box-shadow: inset 3px 0 0 var(--window-day-stripe);
}

.log-entry-row.window-3 td:first-child {
    box-shadow: inset 3px 0 0 var(--window-evening-stripe);
}

/* BAS rows carry local file context, so keep the source visible without expanding it by default. */
.log-row-bas td {
    background: var(--bas-row-bg);
}

.log-source {
    display: inline-flex;
    padding: 4px 7px;
    color: var(--muted);
    border: 1px solid var(--line);
    border-radius: 99px;
    background: var(--surface-soft);
    font-size: 10px;
    font-weight: 750;
    white-space: nowrap;
}

.log-source.bas {
    color: var(--warning);
    border-color: var(--warning-border);
    background: var(--warning-soft);
}

.log-message {
    min-width: 240px;
    overflow-wrap: anywhere;
}

.log-context {
    margin-top: 8px;
    color: var(--muted);
    font-size: 11px;
}

.log-context > summary {
    width: fit-content;
    color: var(--accent);
    cursor: pointer;
    font-weight: 750;
}

.log-context > summary:focus-visible {
    border-radius: 4px;
    outline: 3px solid var(--accent-soft);
    outline-offset: 2px;
}

.log-context dl {
    display: grid;
    margin: 10px 0 0;
    gap: 7px;
}

.log-context dl > div {
    display: grid;
    grid-template-columns: 80px minmax(0, 1fr);
    gap: 8px;
}

.log-context dt,
.log-context dd {
    margin: 0;
}

.log-context dt {
    color: var(--muted);
}

.log-context dd {
    color: var(--ink);
    overflow-wrap: anywhere;
}

.log-context code {
    white-space: normal;
}

.log-context pre {
    overflow: auto;
    max-height: 260px;
    margin: 10px 0 0;
    padding: 12px;
    color: var(--ink);
    border: 1px solid var(--line);
    border-radius: 9px;
    background: var(--surface-soft);
    font: 11px/1.5 Consolas, monospace;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}

.pagination {
    display: flex;
    flex-wrap: wrap;
    margin-top: 16px;
    align-items: center;
    justify-content: center;
    gap: 6px;
}

.pagination-link {
    display: inline-flex;
    min-width: 34px;
    min-height: 34px;
    padding: 5px 10px;
    color: var(--accent);
    border: 1px solid var(--line);
    border-radius: 9px;
    align-items: center;
    justify-content: center;
    background: var(--surface);
    font-size: 12px;
    font-weight: 750;
    text-decoration: none;
}

.pagination-link:hover {
    border-color: var(--accent);
    background: var(--accent-soft);
}

.pagination-link.is-current {
    color: var(--on-accent);
    border-color: var(--accent);
    background: var(--accent);
}

.pagination-link.is-disabled {
    color: var(--muted);
    cursor: default;
    opacity: .55;
}

.pagination-ellipsis {
    padding: 0 3px;
    color: var(--muted);
}

code {
    padding: 2px 5px;
    border-radius: 5px;
    background: var(--neutral-soft);
}

.data-table td small {
    display: block;
    margin-top: 3px;
    color: var(--muted);
    font-size: 10px;
}

.sku-link,
.inline-data-link {
    color: var(--accent);
    font-weight: 750;
    text-decoration: none;
}

.sku-link:hover,
.inline-data-link:hover {
    text-decoration: underline;
}

.count-badge {
    display: inline-flex;
    min-width: 28px;
    min-height: 25px;
    padding: 0 7px;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background: var(--accent-soft);
    font-weight: 750;
}

.result-dot {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--result-dot-bg);
}

.result-dot.has-data {
    background: var(--accent);
    box-shadow: 0 0 0 4px var(--accent-soft);
}

.muted-cell,
.no-result {
    color: var(--muted);
}

.position {
    display: inline-flex;
    min-width: 34px;
    min-height: 27px;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background: var(--accent-soft);
    font-weight: 800;
}

.position.not-found {
    color: var(--warning);
    background: var(--warning-soft);
}

.key-results td:nth-child(n + 3) small {
    margin-left: 7px;
}

.report-section {
    margin-top: 32px;
}

.pricing-heading {
    align-items: stretch;
}

.pricing-formula {
    display: flex;
    min-width: min(420px, 100%);
    padding: 18px 22px;
    border: 1px solid var(--line);
    border-radius: 16px;
    flex-direction: column;
    justify-content: center;
    background: var(--surface);
    box-shadow: var(--shadow);
}

.pricing-formula span,
.pricing-formula small,
.pricing-decision header span,
.pricing-decision p,
.pricing-decision small,
.pricing-decision dt {
    color: var(--muted);
}

.pricing-formula span,
.pricing-formula small,
.pricing-decision dt {
    font-size: 12px;
}

.pricing-formula strong {
    margin: 6px 0;
    font-size: 17px;
}

.pricing-mode-selector {
    display: flex;
    padding: 14px 16px;
    margin: 22px 0 8px;
    border: 1px solid var(--line);
    border-radius: 16px;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    background: var(--surface);
    box-shadow: var(--shadow);
}

.pricing-mode-selector > div:first-child {
    display: grid;
    gap: 3px;
}

.pricing-mode-selector > div:first-child span {
    color: var(--muted);
    font-size: 12px;
}

.pricing-mode-toggle {
    display: grid;
    min-width: min(560px, 100%);
    padding: 4px;
    border: 1px solid var(--line);
    border-radius: 13px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    background: var(--surface-soft);
}

.pricing-mode-toggle button {
    padding: 10px 16px;
    border: 0;
    border-radius: 9px;
    color: var(--muted);
    background: transparent;
    cursor: pointer;
    font: inherit;
    font-size: 13px;
    font-weight: 750;
}

.pricing-mode-toggle button small {
    display: block;
    margin-top: 2px;
    color: inherit;
    font-size: 10px;
    font-weight: 500;
}

.pricing-mode-toggle button.is-active {
    color: var(--on-accent);
    background: var(--accent);
    box-shadow: 0 5px 16px rgba(30, 70, 45, .18);
}

.pricing-mode-toggle button:focus-visible {
    outline: 3px solid var(--accent-soft);
    outline-offset: 2px;
}

.pricing-decisions {
    display: grid;
    margin: 16px 0 8px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

[data-pricing-panel][hidden] {
    /* Author-level grid styles must not override the native hidden state. */
    display: none;
}

.pricing-decision {
    padding: 22px;
    border: 1px solid var(--line);
    border-left: 4px solid var(--muted);
    border-radius: 16px;
    background: var(--surface);
    box-shadow: var(--shadow);
}

.pricing-decision.ok {
    border-left-color: var(--accent);
}

.pricing-decision.warning {
    border-left-color: var(--warning);
}

.pricing-decision.current {
    border-left-color: var(--running);
}

.pricing-decision > header {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: 18px;
}

.pricing-decision h2 {
    margin: 5px 0 0;
    font-size: 24px;
}

.pricing-delta {
    text-align: right;
    font-size: 20px;
    font-weight: 800;
}

.pricing-delta small {
    display: block;
    margin-top: 2px;
    font-size: 10px;
    font-weight: 500;
    white-space: nowrap;
}

.pricing-decision dl {
    display: grid;
    margin: 22px 0 14px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.pricing-decision dl div {
    padding: 12px 14px;
    border-radius: 12px;
    background: var(--surface-soft);
}

.pricing-decision dt,
.pricing-decision dd {
    margin: 0;
}

.pricing-decision dd {
    margin-top: 4px;
    font-size: 20px;
    font-weight: 800;
}

.pricing-decision p {
    margin: 0 0 9px;
    line-height: 1.55;
}

.pricing-audit {
    padding-top: 18px;
    margin-top: 18px;
    border-top: 1px solid var(--line);
}

.pricing-audit-heading {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 16px;
}

.pricing-audit-heading > span {
    color: var(--muted);
    font-size: 11px;
    text-align: right;
}

.pricing-audit-months {
    display: grid;
    margin: 12px 0 16px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}

.pricing-audit-months > div {
    display: grid;
    padding: 10px 11px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: var(--surface-soft);
    gap: 3px;
}

.pricing-audit-months time,
.pricing-audit-months span {
    color: var(--muted);
    font-size: 11px;
}

.pricing-audit-months strong {
    font-size: 14px;
}

.pricing-current-metrics {
    display: grid;
    margin: 12px 0 16px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}

.pricing-current-metrics > div {
    display: grid;
    padding: 12px 14px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: var(--surface-soft);
    gap: 4px;
}

.pricing-current-metrics span {
    color: var(--muted);
    font-size: 11px;
}

.pricing-current-metrics strong {
    font-size: 16px;
}

.pricing-equation {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 22px;
}

.pricing-equation > div {
    display: flex;
    min-height: 43px;
    padding: 10px 0;
    border-top: 1px solid var(--line);
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.pricing-equation span {
    color: var(--muted);
    font-size: 11px;
}

.pricing-equation strong {
    font-size: 12px;
    text-align: right;
}

.pricing-equation-total strong {
    color: var(--accent);
}

.pricing-equation-comparison {
    grid-column: 1 / -1;
}

.pricing-equation-comparison strong {
    color: var(--running);
    font-size: 14px;
}

.pricing-chart-card {
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: var(--surface);
    box-shadow: var(--shadow);
}

.pricing-chart-legend {
    display: grid;
    padding: 16px 18px;
    border-bottom: 1px solid var(--line);
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.pricing-chart-legend-item {
    display: grid;
    min-width: 0;
    padding: 12px 14px;
    border-radius: 12px;
    align-items: center;
    grid-template-columns: auto minmax(0, 1fr) auto;
    background: var(--surface-soft);
    gap: 11px;
}

.pricing-chart-legend-item > div {
    display: grid;
    min-width: 0;
    gap: 2px;
}

.pricing-chart-legend-item strong,
.pricing-chart-legend-item small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.pricing-chart-legend-item small {
    color: var(--muted);
    font-size: 11px;
}

.pricing-chart-legend-item b {
    font-size: 18px;
    white-space: nowrap;
}

.pricing-chart-swatch {
    position: relative;
    width: 30px;
    height: 12px;
}

.pricing-chart-swatch::before,
.pricing-chart-swatch::after {
    position: absolute;
    content: "";
}

.pricing-chart-swatch::before {
    top: 5px;
    left: 0;
    width: 30px;
    height: 3px;
    border-radius: 2px;
    background: var(--accent);
}

.pricing-chart-swatch::after {
    top: 2px;
    left: 12px;
    width: 7px;
    height: 7px;
    border: 2px solid var(--accent);
    border-radius: 50%;
    background: var(--surface-soft);
}

.pricing-chart-legend-item.kob .pricing-chart-swatch::before {
    background: var(--running);
}

.pricing-chart-legend-item.kob .pricing-chart-swatch::after {
    border-color: var(--running);
}

.pricing-chart-viewport {
    overflow-x: auto;
    padding: 14px 18px 0;
    outline: none;
    scrollbar-color: var(--line) transparent;
}

.pricing-chart-viewport:focus-visible {
    box-shadow: inset 0 0 0 3px var(--accent-soft);
}

.pricing-chart {
    display: block;
    width: 100%;
    min-width: 720px;
    height: auto;
}

.pricing-chart-grid {
    stroke: var(--line);
    stroke-width: 1;
}

.pricing-chart-axis-label,
.pricing-chart-current-label {
    fill: var(--muted);
    font-size: 11px;
}

.pricing-chart-current-label {
    fill: var(--running);
    font-size: 10px;
    font-weight: 750;
    letter-spacing: .05em;
    text-transform: uppercase;
}

.pricing-chart-current-band {
    fill: var(--running-soft);
    opacity: .55;
}

.pricing-chart-segment {
    stroke-linecap: round;
    stroke-width: 4;
}

.pricing-chart-segment.pair {
    stroke: var(--accent);
}

.pricing-chart-segment.kob {
    stroke: var(--running);
}

.pricing-chart-segment.is-provisional {
    stroke-dasharray: 9 8;
}

.pricing-chart-point {
    fill: var(--accent);
    stroke: var(--surface);
    stroke-width: 3;
}

.pricing-chart-point.kob {
    fill: var(--running);
}

.pricing-chart-point.is-provisional {
    fill: var(--surface);
}

.pricing-chart-point.is-provisional.pair {
    stroke: var(--accent);
}

.pricing-chart-point.is-provisional.kob {
    stroke: var(--running);
}

.pricing-chart-end-label,
.pricing-chart-end-value {
    fill: var(--accent);
    font-size: 12px;
    font-weight: 800;
}

.pricing-chart-end-label.kob,
.pricing-chart-end-value.kob {
    fill: var(--running);
}

.pricing-chart-end-value {
    font-size: 11px;
    font-weight: 650;
}

.pricing-chart-caption {
    display: flex;
    padding: 12px 18px 16px;
    border-top: 1px solid var(--line);
    flex-wrap: wrap;
    color: var(--muted);
    font-size: 11px;
    gap: 10px 18px;
}

.pricing-chart-caption span {
    display: inline-flex;
    align-items: center;
    gap: 7px;
}

.pricing-chart-caption span:last-child {
    margin-left: auto;
}

.pricing-chart-line-sample {
    display: inline-block;
    width: 25px;
    border-top: 3px solid var(--muted);
}

.pricing-chart-line-sample.provisional {
    border-top-style: dashed;
}

.pricing-policy ol {
    display: grid;
    padding: 0;
    margin: 0;
    counter-reset: pricing-rule;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    list-style: none;
}

.pricing-policy li {
    position: relative;
    min-height: 122px;
    padding: 18px 18px 16px 52px;
    border: 1px solid var(--line);
    border-radius: 14px;
    counter-increment: pricing-rule;
    background: var(--surface);
}

.pricing-policy li::before {
    position: absolute;
    top: 17px;
    left: 17px;
    display: grid;
    width: 25px;
    height: 25px;
    border-radius: 50%;
    place-items: center;
    color: var(--on-accent);
    background: var(--accent);
    content: counter(pricing-rule);
    font-size: 12px;
    font-weight: 800;
}

.pricing-policy li strong,
.pricing-policy li span {
    display: block;
}

.pricing-policy li span {
    margin-top: 7px;
    color: var(--muted);
    font-size: 13px;
    line-height: 1.45;
}

.pricing-table .current-period {
    background: var(--accent-soft);
}

.pricing-source {
    margin-top: 16px;
}

.report-metrics {
    grid-template-columns: repeat(7, minmax(0, 1fr));
}

.report-metrics article {
    padding: 17px;
}

.report-metrics strong {
    font-size: 24px;
}

.chart-card {
    overflow-x: auto;
    padding: 16px 18px 4px;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: var(--surface);
    box-shadow: var(--shadow);
}

.trend-chart {
    display: block;
    width: 100%;
    min-width: 620px;
    height: 245px;
}

.chart-axis {
    stroke: var(--line);
    stroke-width: 1;
}

.chart-line {
    fill: none;
    stroke: var(--accent);
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 4;
}

.chart-point {
    fill: var(--surface);
    stroke: var(--accent);
    stroke-width: 3;
}

.chart-label {
    fill: var(--muted);
    font-size: 11px;
}

.report-table {
    max-height: 440px;
    margin-top: 14px;
    box-shadow: none;
}

.compact-empty {
    padding: 30px;
}

.visually-hidden {
    position: absolute;
    overflow: hidden;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.heatmap-filter-panel {
    margin-bottom: 18px;
    border: 1px solid var(--line);
    border-radius: 15px;
    background: var(--surface);
    box-shadow: var(--shadow);
}

.heatmap-filter-panel > summary {
    display: flex;
    gap: 16px;
    min-height: 54px;
    padding: 14px 16px;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
    list-style-position: inside;
}

.heatmap-filter-panel > summary span {
    color: var(--muted);
    font-size: 12px;
    text-align: right;
}

.heatmap-filter-panel[open] > summary {
    border-bottom: 1px solid var(--line);
}

.heatmap-filters {
    margin: 0;
    border: 0;
    border-radius: 0 0 15px 15px;
    box-shadow: none;
}

.heatmap-hint {
    margin-top: 0;
}

.heatmap-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 12px;
}

.heatmap-legend-item {
    display: inline-flex;
    min-height: 30px;
    padding: 4px 9px;
    align-items: center;
    color: var(--muted);
    border: 1px solid var(--line);
    border-radius: 9px;
    background: var(--surface);
    font-size: 11px;
    gap: 6px;
}

.heatmap-legend-item i {
    width: 12px;
    height: 12px;
    border: 1px solid var(--legend-border);
    border-radius: 4px;
}

.heatmap-table-wrap {
    overflow: auto;
    max-height: 72vh;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: var(--surface);
    box-shadow: var(--shadow);
    overscroll-behavior: contain;
}

.heatmap-table-wrap:focus {
    outline: 3px solid var(--accent-soft);
    outline-offset: 3px;
}

.heatmap-table {
    width: max-content;
    min-width: 100%;
    border-spacing: 3px;
    border-collapse: separate;
    background: var(--surface);
    font-size: 12px;
}

.heatmap-table thead th {
    position: sticky;
    z-index: 2;
    top: 0;
    min-width: 72px;
    padding: 10px 8px;
    color: var(--muted);
    background: var(--surface-soft);
    text-align: center;
}

.heatmap-table thead th small {
    display: block;
    margin-top: 2px;
    font-size: 9px;
    font-weight: 600;
    text-transform: uppercase;
}

.heatmap-table .heatmap-key-column {
    z-index: 4;
    left: 0;
    min-width: 250px;
    text-align: left;
}

.heatmap-key-cell {
    position: sticky;
    z-index: 1;
    left: 0;
    width: 250px;
    max-width: 250px;
    padding: 10px 12px;
    border-right: 1px solid var(--line);
    background: var(--surface);
    text-align: left;
}

.heatmap-key-cell strong,
.heatmap-key-cell small {
    display: block;
}

.heatmap-key-cell strong {
    overflow-wrap: anywhere;
    white-space: normal;
}

.heatmap-key-cell small {
    margin-top: 4px;
    color: var(--muted);
    font-size: 9px;
    font-weight: 500;
}

.heatmap-cell {
    min-width: 72px;
    height: 58px;
    padding: 6px;
    color: var(--heatmap-cell-ink);
    border: 1px solid var(--heatmap-cell-border);
    border-radius: 8px;
    text-align: center;
}

.heatmap-cell strong,
.heatmap-cell small {
    display: block;
}

.heatmap-cell strong {
    font-size: 16px;
}

.heatmap-cell small {
    margin-top: 3px;
    color: currentColor;
    font-size: 9px;
    opacity: .78;
}

.heatmap-cell.top,
.heatmap-legend-item.top i {
    color: var(--heatmap-top-ink);
    background: var(--heatmap-top-bg);
}

.heatmap-cell.good,
.heatmap-legend-item.good i {
    color: var(--heatmap-good-ink);
    background: var(--heatmap-good-bg);
}

.heatmap-cell.middle,
.heatmap-legend-item.middle i {
    color: var(--heatmap-middle-ink);
    background: var(--heatmap-middle-bg);
}

.heatmap-cell.poor,
.heatmap-legend-item.poor i {
    color: var(--heatmap-poor-ink);
    background: var(--heatmap-poor-bg);
}

.heatmap-cell.not-found,
.heatmap-legend-item.not-found i {
    color: var(--heatmap-poor-ink);
    background: repeating-linear-gradient(
        -45deg,
        var(--heatmap-not-found-a),
        var(--heatmap-not-found-a) 5px,
        var(--heatmap-not-found-b) 5px,
        var(--heatmap-not-found-b) 10px
    );
}

.heatmap-cell.empty,
.heatmap-legend-item.empty i {
    color: var(--heatmap-empty-ink);
    background: var(--heatmap-empty-bg);
}

.heatmap-cell.coverage-partial {
    box-shadow: inset 0 -3px 0 var(--coverage-partial);
}

.heatmap-cell.coverage-low {
    box-shadow: inset 0 0 0 3px var(--coverage-low);
}

.heatmap-legend-item.coverage-low i {
    border: 3px solid var(--coverage-low);
    background: transparent;
}

.heatmap-legend-item.coverage-partial i {
    border: 1px solid var(--coverage-partial);
    border-bottom-width: 4px;
    background: transparent;
}

.sku-metrics strong {
    font-size: 22px;
}

@media (max-width: 1100px) {
    .pricing-policy ol {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .parser-grid {
        grid-template-columns: 1fr;
    }

    .delivery-grid {
        grid-template-columns: 1fr;
    }

    .report-metrics {
        grid-template-columns: repeat(4, 1fr);
    }

    .global-schedule {
        grid-template-columns: repeat(3, 1fr);
    }

    .schedule-intro {
        grid-column: 1 / -1;
    }
}

@media (max-width: 760px) {
    .pricing-mode-selector {
        align-items: stretch;
        flex-direction: column;
    }

    .pricing-mode-toggle {
        min-width: 0;
    }

    .pricing-decisions {
        grid-template-columns: 1fr;
    }

    .topbar,
    .page-heading,
    .parser-card > footer {
        align-items: stretch;
    }

    .topbar,
    .page-heading,
    .parser-list-toolbar,
    .parser-card > footer,
    .date-picker,
    .filter-bar {
        flex-direction: column;
    }

    .topbar {
        position: static;
        padding: 14px 5vw;
    }

    .topbar nav {
        overflow-x: auto;
    }

    .topbar-actions {
        width: 100%;
    }

    .topbar-actions nav {
        min-width: 0;
        flex: 1 1 auto;
    }

    .shell {
        width: 90vw;
        padding-top: 30px;
    }

    .metrics {
        grid-template-columns: repeat(2, 1fr);
    }

    .global-schedule {
        grid-template-columns: 1fr;
    }

    .schedule-intro {
        grid-column: auto;
    }

    .parser-card > header {
        gap: 16px;
    }

    .parser-header-state {
        align-content: start;
    }

    .section-heading {
        align-items: start;
        flex-direction: column;
    }

    .section-heading > p {
        text-align: left;
    }

    .heatmap-filter-panel > summary {
        align-items: start;
        flex-direction: column;
    }

    .heatmap-filter-panel > summary span {
        text-align: left;
    }

    .heatmap-table .heatmap-key-column {
        min-width: 180px;
    }

    .heatmap-key-cell {
        width: 180px;
        max-width: 180px;
    }

    .heatmap-cell,
    .heatmap-table thead th {
        min-width: 66px;
    }

    .windows {
        grid-template-columns: 1fr;
    }

    .delivery-stages,
    .delivery-route {
        grid-template-columns: 1fr;
    }

    .parser-meta {
        flex-wrap: wrap;
        gap: 8px;
    }

    .parser-meta span + span {
        margin-left: 0;
        padding-left: 0;
        border-left: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .theme-toggle-thumb {
        transition: none;
    }
}

@media (max-width: 520px) {
    .metrics {
        grid-template-columns: 1fr;
    }

    .pricing-policy ol,
    .pricing-decision dl {
        grid-template-columns: 1fr;
    }

    .pricing-mode-toggle,
    .pricing-current-metrics,
    .pricing-chart-legend {
        grid-template-columns: 1fr;
    }

    .pricing-chart-legend-item b {
        font-size: 16px;
    }

    .pricing-chart-caption {
        flex-direction: column;
    }

    .pricing-chart-caption span:last-child {
        margin-left: 0;
    }

    .pricing-audit-heading {
        align-items: start;
        flex-direction: column;
        gap: 4px;
    }

    .pricing-audit-heading > span {
        text-align: left;
    }

    .pricing-audit-months,
    .pricing-equation {
        grid-template-columns: 1fr;
    }

    .pricing-equation > div {
        align-items: flex-start;
        flex-direction: column;
        gap: 4px;
    }

    .pricing-equation strong {
        text-align: left;
    }

    .parser-card > header {
        flex-direction: column;
    }

    .parser-header-state {
        display: flex;
        width: 100%;
        align-items: center;
        justify-content: space-between;
    }

    .icon-control {
        position: static;
    }

    .control-tooltip,
    .manual-start-form,
    .manual-finish-form {
        top: calc(100% - 8px);
        right: 24px;
        left: 24px;
        width: auto;
        max-width: none;
    }

    .control-tooltip::before {
        display: none;
    }
}

/* BAS project editor: keep paths, versions and deployment targets visible without exposing XML in logs. */
.project-heading {
    align-items: flex-end;
}

.project-paths {
    display: grid;
    max-width: 620px;
    gap: 4px;
    color: var(--muted);
    font-size: 12px;
}

.project-paths code {
    overflow-wrap: anywhere;
    color: var(--ink);
}

.project-status-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin: 20px 0;
}

.project-status-card {
    display: block;
    padding: 16px;
    color: inherit;
    text-decoration: none;
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: 18px;
    box-shadow: var(--shadow);
}

.project-status-card.is-selected {
    border-color: var(--accent);
    box-shadow: inset 0 0 0 1px var(--accent), var(--shadow);
}

.project-status-card header,
.project-status-card dl > div,
.project-editor-heading,
.project-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.project-status-card dl {
    display: grid;
    gap: 6px;
    margin: 14px 0 10px;
}

.project-status-card dt,
.project-status-card dd {
    margin: 0;
}

.project-status-card dt,
.project-status-card small {
    color: var(--muted);
    font-size: 12px;
}

.project-state {
    padding: 5px 8px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 700;
}

.project-state.synced {
    color: var(--accent);
    background: var(--accent-soft);
}

.project-state.stale {
    color: var(--warning);
    background: var(--warning-soft);
}

.project-state.equivalent {
    color: var(--running);
    background: var(--running-soft);
}

.project-state.problem {
    color: var(--danger);
    background: var(--danger-soft);
}

.project-state.running {
    color: var(--running);
    background: var(--running-soft);
}

.project-comparison {
    overflow: hidden;
    margin: 20px 0;
    background: var(--surface);
    border: 1px solid var(--line);
    border-left-width: 4px;
    border-radius: 18px;
    box-shadow: var(--shadow);
}

.project-comparison.exact {
    border-left-color: var(--accent);
}

.project-comparison.equivalent {
    border-left-color: var(--running);
}

.project-comparison.different {
    border-left-color: var(--warning);
}

.project-comparison.problem {
    border-left-color: var(--danger);
}

.project-comparison-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 18px 20px;
}

.project-comparison-heading h2,
.project-comparison-heading p {
    margin: 0;
}

.project-comparison-heading > div:first-child {
    display: grid;
    gap: 5px;
}

.project-comparison-heading > div:first-child > p:last-child {
    color: var(--muted);
}

.project-comparison-counters {
    display: flex;
    flex: 0 0 auto;
    gap: 8px;
}

.project-comparison-counters span {
    display: grid;
    min-width: 92px;
    padding: 9px 11px;
    color: var(--muted);
    text-align: center;
    background: var(--surface-soft);
    border: 1px solid var(--line);
    border-radius: 11px;
    font-size: 11px;
}

.project-comparison-counters strong {
    color: var(--ink);
    font-size: 18px;
}

.project-difference-details {
    border-top: 1px solid var(--line);
}

.project-difference-details > summary {
    padding: 14px 20px;
    color: var(--accent);
    cursor: pointer;
    font-weight: 700;
}

.project-difference-list {
    display: grid;
    gap: 10px;
    padding: 0 20px 20px;
}

.project-difference {
    overflow: hidden;
    background: var(--surface-soft);
    border: 1px solid var(--line);
    border-left: 4px solid var(--warning);
    border-radius: 12px;
}

.project-difference.formatting {
    border-left-color: var(--running);
}

.project-difference.source-only,
.project-difference.release-only,
.project-difference.changed {
    border-left-color: var(--danger);
}

.project-difference > header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 12px;
    border-bottom: 1px solid var(--line);
}

.project-difference > header code {
    overflow-wrap: anywhere;
    color: var(--muted);
    text-align: right;
    font-size: 11px;
}

.project-difference-values {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.project-difference-values > div {
    min-width: 0;
    padding: 10px 12px;
}

.project-difference-values > div + div {
    border-left: 1px solid var(--line);
}

.project-difference-values span {
    color: var(--muted);
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
}

.project-difference-values pre {
    overflow: auto;
    margin: 6px 0 0;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
    color: var(--ink);
    font: 12px/1.45 ui-monospace, SFMono-Regular, Consolas, monospace;
}

.project-workspace,
.project-backups {
    overflow: hidden;
    margin-top: 20px;
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: 20px;
    box-shadow: var(--shadow);
}

.project-toolbar,
.project-deploy-panel,
.project-backups .section-heading {
    padding: 18px 20px;
}

.project-toolbar {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 20px;
    border-bottom: 1px solid var(--line);
}

.project-selector,
.project-targets {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.project-selector label,
.project-editor-heading label {
    display: grid;
    gap: 5px;
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
}

.project-selector select,
.project-editor-heading input {
    min-height: 40px;
    padding: 8px 10px;
    color: var(--ink);
    background: var(--surface-soft);
    border: 1px solid var(--line);
    border-radius: 10px;
}

.project-file-meta {
    display: grid;
    max-width: 55%;
    gap: 4px;
    text-align: right;
}

.project-file-meta span {
    overflow-wrap: anywhere;
    font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
    font-size: 12px;
}

.project-file-meta small,
.project-editor-heading span,
.project-deploy-panel > div > span {
    color: var(--muted);
}

.project-editor-heading {
    padding: 16px 20px;
}

.project-editor-heading > div {
    display: grid;
    gap: 3px;
}

.project-file-picker {
    display: inline-flex;
    cursor: pointer;
}

.project-file-picker input {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
}

.project-xml-editor {
    display: block;
    width: 100%;
    min-height: 520px;
    padding: 18px 20px;
    resize: vertical;
    color: var(--ink);
    background: var(--surface-soft);
    border: 0;
    border-block: 1px solid var(--line);
    outline: none;
    font: 13px/1.55 ui-monospace, SFMono-Regular, Consolas, monospace;
    tab-size: 2;
}

.project-xml-editor:focus {
    box-shadow: inset 0 0 0 2px var(--accent);
}

.project-deploy-panel {
    display: grid;
    gap: 14px;
}

.project-deploy-panel > div:first-child {
    display: grid;
    gap: 4px;
}

.project-target {
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    gap: 2px 8px;
    min-width: 132px;
    padding: 10px 12px;
    background: var(--surface-soft);
    border: 1px solid var(--line);
    border-radius: 12px;
}

.project-target small {
    grid-column: 2;
    color: var(--running);
}

.project-target.is-running {
    border-color: var(--running);
}

.project-confirm {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    color: var(--muted);
    font-size: 13px;
}

.project-actions {
    justify-content: flex-end;
}

.project-backups .section-heading {
    margin: 0;
}

.operation-details {
    margin: 8px 0 0;
    white-space: pre-wrap;
    color: inherit;
    font: inherit;
}

@media (max-width: 1100px) {
    .project-status-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .project-heading,
    .project-toolbar,
    .project-comparison-heading {
        align-items: flex-start;
        flex-direction: column;
    }

    .project-file-meta {
        max-width: none;
        text-align: left;
    }
}

@media (max-width: 620px) {
    .project-status-grid {
        grid-template-columns: 1fr;
    }

    .project-selector,
    .project-selector label,
    .project-selector select,
    .project-selector .button {
        width: 100%;
    }

    .project-editor-heading,
    .project-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .project-comparison-counters,
    .project-difference-values {
        width: 100%;
        grid-template-columns: 1fr;
    }

    .project-comparison-counters {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .project-difference > header {
        align-items: flex-start;
        flex-direction: column;
    }

    .project-difference > header code {
        text-align: left;
    }

    .project-difference-values > div + div {
        border-top: 1px solid var(--line);
        border-left: 0;
    }

    .project-xml-editor {
        min-height: 420px;
    }
}
.sku-region-cell { min-width: 250px; max-width: 360px; white-space: normal; }
.sku-region-cell .region-warning { color: var(--warning, #bd761b); }
.region-editor { margin-top: 8px; }
.region-editor summary { cursor: pointer; color: var(--accent, #56a77d); font-weight: 600; }
.region-editor form { display: grid; gap: 12px; padding: 14px 0 4px; }
.region-editor label { display: grid; gap: 6px; }
.region-editor input, .region-editor select { width: 100%; min-width: 0; }
.region-editor p { font-size: 12px; line-height: 1.45; margin: 0; color: var(--muted); }
.region-editor .button { justify-self: start; }