.f1-shell {
    --desk-accent: #ff6236;
    --desk-accent-soft: rgba(255, 98, 54, 0.16);
    --desk-secondary: #ffd26c;
    --desk-ink: #0f141b;
    --desk-ink-soft: #1b2430;
    --desk-copy: #f3ebdf;
    --desk-copy-muted: rgba(243, 235, 223, 0.76);
    --panel-bg: rgba(255, 255, 255, 0.74);
    --panel-strong: rgba(255, 255, 255, 0.88);
    --panel-line: rgba(18, 20, 24, 0.14);
    --panel-shadow: 0 20px 40px rgba(15, 20, 27, 0.12);
    display: grid;
    gap: 1rem;
    margin-top: 2rem;
}

.f1-shell-nav {
    justify-content: flex-start;
    padding-bottom: 0.25rem;
}

.f1-shell-back {
    color: var(--muted);
    text-decoration: none;
}

.f1-shell-back:hover,
.f1-shell-back:focus-visible {
    color: var(--text);
}

.f1-context-row,
.f1-workspace,
.f1-ladder-grid,
.f1-story-panel,
.f1-history-panel,
.f1-inspector-sticky,
.f1-deep-panel,
.f1-deep-grid {
    display: grid;
    gap: 1rem;
}

.f1-context-row {
    grid-template-columns: minmax(0, 15rem) minmax(0, 1fr) auto;
    align-items: end;
    gap: 0.45rem 1.1rem;
    padding: 0 0 0.95rem;
    color: var(--muted);
    border-bottom: 1px solid color-mix(in srgb, var(--panel-line) 88%, white 12%);
    background: none;
    box-shadow: none;
    border-radius: 0;
}

.f1-shell[data-has-status-copy="false"] .f1-context-row {
    grid-template-columns: minmax(0, 1fr) auto;
}

.f1-mode-pill,
.f1-confidence-chip,
.f1-context-chip,
.f1-status-label,
.f1-panel-kicker,
.f1-band-kicker,
.f1-hero-kicker,
.f1-signal-tag,
.f1-history-subtitle,
.f1-history-node-time,
.f1-inline-action,
.f1-deep-tab,
.f1-deep-list strong,
.f1-deep-table-row strong,
.f1-session-head strong,
.f1-row-context,
.f1-row-stat span,
.f1-row-meta,
.f1-row-rank,
.f1-mode-pill {
    font:
        600 0.73rem/1.2 ui-monospace,
        SFMono-Regular,
        Menlo,
        monospace;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.f1-mode-pill {
    display: inline-flex;
    width: fit-content;
    align-items: center;
    gap: 0.45rem;
    padding: 0.42rem 0.62rem;
    border-radius: 999px;
    border: 1px solid color-mix(in srgb, var(--desk-accent) 55%, white 45%);
    background: color-mix(in srgb, var(--desk-accent) 16%, rgba(255, 255, 255, 0.06));
    color: var(--desk-copy);
}

.f1-stage-line {
    margin: 0;
    color: color-mix(in srgb, var(--desk-ink) 82%, var(--desk-accent) 18%);
    font:
        600 clamp(1.3rem, 2.6vw, 1.9rem) / 0.98 "Iowan Old Style",
        "Palatino Linotype",
        "Book Antiqua",
        Georgia,
        serif;
    letter-spacing: -0.04em;
}

.f1-context-copy {
    margin: 0;
    color: color-mix(in srgb, var(--desk-ink-soft) 72%, var(--muted) 28%);
    font-size: 0.98rem;
    line-height: 1.45;
    max-width: 60ch;
}

.f1-freshness-line {
    margin: 0;
    color: color-mix(in srgb, var(--muted) 78%, white 22%);
    text-align: right;
    justify-self: end;
    font:
        600 0.68rem/1.2 ui-monospace,
        SFMono-Regular,
        Menlo,
        monospace;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.f1-hero-summary,
.f1-hero-tip,
.f1-status-copy,
.f1-detail-summary,
.f1-spotlight-summary,
.f1-spotlight-copy,
.f1-history-node-note,
.f1-deep-note,
.f1-deep-empty,
.f1-deep-list span,
.f1-deep-table-row span,
.f1-session-head span,
.f1-row-stat strong,
.f1-row-main strong,
.f1-row-main span,
.f1-row-context,
.f1-detail-list span,
.f1-detail-method,
.f1-story-foot,
.f1-detail-empty {
    color: var(--muted);
}

.f1-hero-kicker,
.f1-band-kicker,
.f1-panel-kicker {
    margin: 0;
    color: var(--desk-secondary);
}

.f1-hero-summary,
.f1-hero-tip {
    max-width: 48rem;
}

.f1-ladder-panel,
.f1-history-panel,
.f1-detail-panel,
.f1-deep-panel,
.f1-spotlight-card,
.f1-signal-strip,
.f1-deep-card,
.f1-session-card {
    border: 1px solid var(--panel-line);
    background:
        linear-gradient(180deg, var(--panel-strong), var(--panel-bg));
    box-shadow: var(--panel-shadow);
}

.f1-status-copy {
    margin: 0.9rem 0 0;
    color: var(--desk-copy-muted);
    font-size: 0.96rem;
    line-height: 1.6;
}

.f1-workspace {
    grid-template-columns: minmax(0, 1.28fr) minmax(20rem, 0.72fr);
    align-items: start;
}

.f1-main-column {
    display: grid;
    gap: 1rem;
}

.f1-ladder-toggle {
    display: none;
    gap: 0.5rem;
}

.f1-ladder-toggle-button,
.f1-deep-tab {
    border: 1px solid var(--panel-line);
    background: rgba(255, 255, 255, 0.48);
    color: var(--text);
    padding: 0.55rem 0.75rem;
    text-align: center;
}

.f1-ladder-toggle-button.is-active,
.f1-deep-tab.is-active {
    border-color: color-mix(in srgb, var(--desk-accent) 55%, white 45%);
    background: color-mix(in srgb, var(--desk-accent) 12%, white 88%);
    color: var(--text);
}

.f1-ladder-panel,
.f1-history-panel {
    padding: 1rem;
}

.f1-panel-head {
    display: grid;
    gap: 0.35rem;
}

.f1-panel-head h2,
.f1-spotlight-card h2,
.f1-detail-head h2 {
    margin: 0;
    color: color-mix(in srgb, var(--desk-ink) 82%, var(--desk-accent) 18%);
    font:
        600 clamp(1.3rem, 2vw, 1.75rem) / 0.98 "Iowan Old Style",
        "Palatino Linotype",
        "Book Antiqua",
        Georgia,
        serif;
    letter-spacing: -0.04em;
}

.f1-panel-head p:last-child {
    margin: 0;
}

.f1-ladder-list {
    display: grid;
    margin-top: 0.85rem;
}

.f1-ladder-row {
    display: grid;
    grid-template-columns: 3.9rem minmax(0, 1.32fr) minmax(0, 0.95fr) minmax(0, 0.82fr);
    gap: 0.85rem;
    align-items: center;
    width: 100%;
    padding: 0.95rem 0;
    border: 0;
    border-top: 1px solid var(--panel-line);
    background: transparent;
    color: var(--text);
    text-align: left;
}

.f1-ladder-row:first-child {
    border-top: 0;
}

.f1-ladder-row.is-split {
    position: relative;
}

.f1-ladder-row.is-split::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 -1rem;
    width: 0.18rem;
    background: color-mix(in srgb, var(--desk-accent) 70%, white 30%);
    opacity: 0.7;
}

.f1-ladder-row.is-gain::before,
.f1-ladder-row.is-loss::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 -1rem;
    width: 0.18rem;
    background: color-mix(in srgb, var(--desk-secondary) 70%, black 30%);
    opacity: 0.8;
}

.f1-ladder-row.is-loss::before {
    background: color-mix(in srgb, var(--desk-accent) 75%, black 25%);
}

button.f1-ladder-row,
button.f1-review-row,
button.f1-compare-row,
button.f1-timeline-driver,
button.f1-signal-strip,
.f1-ladder-toggle-button,
.f1-deep-tab,
.f1-inline-action {
    cursor: pointer;
}

button.f1-ladder-row:hover,
button.f1-ladder-row:focus-visible,
button.f1-review-row:hover,
button.f1-review-row:focus-visible,
button.f1-compare-row:hover,
button.f1-compare-row:focus-visible,
button.f1-timeline-driver:hover,
button.f1-timeline-driver:focus-visible,
button.f1-signal-strip:hover,
button.f1-signal-strip:focus-visible,
.f1-ladder-toggle-button:focus-visible,
.f1-deep-tab:focus-visible,
.f1-inline-action:focus-visible {
    outline: none;
    transform: translateY(-1px);
}

button.f1-review-row,
button.f1-compare-row,
button.f1-timeline-driver {
    transition:
        transform 160ms ease,
        border-color 160ms ease,
        background 160ms ease,
        box-shadow 160ms ease;
}

button.f1-review-row:hover,
button.f1-review-row:focus-visible,
button.f1-compare-row:hover,
button.f1-compare-row:focus-visible,
button.f1-timeline-driver:hover,
button.f1-timeline-driver:focus-visible {
    border-color: color-mix(in srgb, var(--desk-accent) 30%, var(--panel-line) 70%);
    background: color-mix(in srgb, var(--desk-accent-soft) 22%, white 78%);
    box-shadow: 0 16px 28px rgba(15, 20, 27, 0.08);
}

.f1-row-rank {
    display: inline-flex;
    width: fit-content;
    min-width: 3.15rem;
    align-items: center;
    justify-content: center;
    padding: 0.4rem 0.55rem;
    border-radius: 999px;
    background: color-mix(in srgb, var(--desk-ink) 92%, white 8%);
    color: var(--desk-copy);
}

.f1-row-main,
.f1-row-stat {
    display: grid;
    gap: 0.28rem;
    min-width: 0;
}

.f1-row-main strong,
.f1-row-stat strong {
    color: var(--text);
    font:
        600 1.04rem/1.1 Georgia,
        "Times New Roman",
        serif;
    letter-spacing: -0.03em;
}

.f1-row-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.42rem;
    align-items: center;
    color: var(--muted);
    text-transform: none;
    letter-spacing: 0;
}

.f1-row-context {
    color: color-mix(in srgb, var(--desk-accent) 75%, black 25%);
    justify-self: end;
    max-width: 16ch;
    overflow: hidden;
    text-overflow: ellipsis;
    text-align: right;
    font-size: 0.64rem;
    line-height: 1.35;
    text-transform: none;
    letter-spacing: 0;
}

.f1-row-stat span {
    color: var(--muted);
    text-transform: none;
    letter-spacing: 0;
}

.f1-team-mark {
    display: inline-flex;
    max-width: 100%;
    align-items: center;
    gap: 0.42rem;
    color: color-mix(in srgb, var(--team-color) 82%, black 18%);
}

.f1-team-mark span {
    font:
        600 0.65rem/1.2 ui-monospace,
        SFMono-Regular,
        Menlo,
        monospace;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.f1-team-mark.is-subject span {
    font:
        600 0.92rem/1.2 ui-sans-serif,
        system-ui,
        sans-serif;
    letter-spacing: 0.01em;
    text-transform: none;
}

.f1-team-mark-swatch {
    display: inline-flex;
    width: 0.72rem;
    height: 0.72rem;
    flex: 0 0 0.72rem;
    border-radius: 0.24rem;
    background:
        linear-gradient(180deg, color-mix(in srgb, var(--team-color) 92%, white 8%), color-mix(in srgb, var(--team-color) 68%, black 32%));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.4),
        0 0 0 1px color-mix(in srgb, var(--team-color) 42%, white 58%);
}

.f1-story-panel {
    grid-template-columns: minmax(0, 1fr);
}

.f1-visual-module {
    display: grid;
}

.f1-insight-card {
    display: grid;
    gap: 0.9rem;
    padding: 1.1rem;
    border: 1px solid var(--panel-line);
    background:
        radial-gradient(circle at top right, color-mix(in srgb, var(--desk-accent) 14%, transparent), transparent 14rem),
        linear-gradient(180deg, var(--panel-strong), var(--panel-bg));
    box-shadow: var(--panel-shadow);
}

.f1-insight-head {
    display: flex;
    justify-content: space-between;
    gap: 0.8rem;
    align-items: start;
    flex-wrap: wrap;
}

.f1-insight-head-minimal {
    justify-content: flex-end;
    margin-bottom: -0.15rem;
}

.f1-insight-summary,
.f1-insight-foot {
    margin: 0;
    color: var(--muted);
    line-height: 1.6;
}

.f1-insight-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem 0.8rem;
    align-items: center;
    color: var(--muted);
    font:
        600 0.72rem/1.2 ui-monospace,
        SFMono-Regular,
        Menlo,
        monospace;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.f1-insight-legend span {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}

.f1-legend-dot {
    display: inline-flex;
    width: 0.7rem;
    height: 0.7rem;
    border-radius: 999px;
    border: 2px solid color-mix(in srgb, var(--desk-accent) 52%, black 48%);
    background: rgba(255, 255, 255, 0.92);
}

.f1-legend-dot.is-actual {
    background: color-mix(in srgb, var(--desk-accent) 62%, black 38%);
}

.f1-compare-list,
.f1-timeline-series-list {
    display: grid;
    gap: 0.7rem;
}

.f1-compare-row,
.f1-timeline-driver {
    width: 100%;
    border: 1px solid var(--panel-line);
    background: rgba(255, 255, 255, 0.68);
    color: var(--text);
    text-align: left;
}

.f1-compare-row {
    display: grid;
    grid-template-columns: minmax(0, 0.9fr) minmax(10rem, 1.35fr) minmax(0, 0.68fr);
    gap: 0.85rem;
    align-items: center;
    padding: 0.95rem 1rem;
    border-radius: 1rem;
}

.f1-compare-row.is-focused,
.f1-timeline-driver.is-focused {
    border-color: color-mix(in srgb, var(--desk-accent) 44%, white 56%);
    background: color-mix(in srgb, var(--desk-accent-soft) 70%, white 30%);
}

.f1-compare-label,
.f1-compare-delta,
.f1-timeline-driver-stats {
    display: grid;
    gap: 0.24rem;
    min-width: 0;
}

.f1-compare-label strong,
.f1-compare-delta strong,
.f1-timeline-driver strong {
    color: var(--text);
    font:
        600 1rem/1.1 Georgia,
        "Times New Roman",
        serif;
    letter-spacing: -0.03em;
}

.f1-compare-label span,
.f1-compare-delta span,
.f1-timeline-driver-stats span {
    color: var(--muted);
    line-height: 1.45;
}

.f1-compare-track {
    min-width: 0;
}

.f1-compare-svg,
.f1-timeline-svg {
    display: block;
    width: 100%;
    height: auto;
}

.f1-compare-baseline,
.f1-timeline-grid {
    stroke: rgba(30, 36, 44, 0.14);
    stroke-width: 1;
}

.f1-timeline-grid.is-vertical.is-current {
    stroke: color-mix(in srgb, var(--desk-accent) 52%, black 48%);
    stroke-width: 1.5;
}

.f1-timeline-x-label,
.f1-timeline-y-label {
    fill: color-mix(in srgb, var(--muted) 82%, var(--text) 18%);
    font:
        600 10px/1 ui-monospace,
        SFMono-Regular,
        Menlo,
        monospace;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.f1-timeline-x-label.is-current {
    fill: color-mix(in srgb, var(--desk-accent) 72%, black 28%);
}

.f1-timeline-series-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.f1-timeline-driver {
    display: grid;
    gap: 0.4rem;
    padding: 0.9rem 0.95rem;
    border-radius: 1rem;
}

.f1-timeline-driver-head {
    display: flex;
    justify-content: space-between;
    gap: 0.55rem;
    align-items: center;
    flex-wrap: wrap;
}

.f1-spotlight-card {
    padding: 1.1rem;
    background:
        radial-gradient(circle at top right, color-mix(in srgb, var(--desk-accent) 20%, transparent), transparent 12rem),
        linear-gradient(180deg, rgba(255, 255, 255, 0.92), rgba(255, 255, 255, 0.76));
}

.f1-story-meta,
.f1-detail-head,
.f1-deep-tabs,
.f1-session-head {
    display: flex;
    justify-content: space-between;
    gap: 0.8rem;
    align-items: start;
    flex-wrap: wrap;
}

.f1-story-meta {
    align-items: center;
}

.f1-confidence-chip,
.f1-context-chip {
    display: inline-flex;
    width: fit-content;
    align-items: center;
    padding: 0.32rem 0.52rem;
    border-radius: 999px;
    border: 1px solid color-mix(in srgb, var(--desk-accent) 38%, white 62%);
    background: color-mix(in srgb, var(--desk-accent-soft) 72%, white 28%);
    color: var(--text);
}

.f1-spotlight-summary,
.f1-spotlight-copy,
.f1-story-foot {
    margin: 0.75rem 0 0;
    line-height: 1.6;
}

.f1-driver-story {
    display: grid;
    gap: 0.85rem;
    margin-top: 0.9rem;
    padding-top: 0.9rem;
    border-top: 1px solid color-mix(in srgb, var(--panel-line) 80%, transparent);
}

.f1-driver-story-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.f1-driver-story-kicker {
    margin: 0;
    color: color-mix(in srgb, var(--desk-accent) 72%, var(--text) 28%);
    font:
        600 0.72rem/1.1 ui-monospace,
        "SFMono-Regular",
        Menlo,
        monospace;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.f1-driver-story h3 {
    margin: 0;
    color: var(--text);
    font:
        600 clamp(1.05rem, 1.9vw, 1.22rem)/1.05 "Iowan Old Style",
        "Palatino Linotype",
        "Book Antiqua",
        serif;
    letter-spacing: -0.035em;
}

.f1-driver-story-deck,
.f1-driver-story-copy p {
    margin: 0;
    line-height: 1.65;
}

.f1-driver-story-deck {
    color: color-mix(in srgb, var(--text) 86%, var(--muted) 14%);
}

.f1-driver-story-copy {
    display: grid;
    gap: 0.7rem;
}

.f1-driver-story-diagram {
    margin: 0;
    padding: 0.8rem 0.9rem;
    overflow-x: auto;
    border-radius: 0.9rem;
    border: 1px solid color-mix(in srgb, var(--desk-accent) 14%, var(--panel-line) 86%);
    background: color-mix(in srgb, var(--desk-accent-soft) 28%, rgba(255, 255, 255, 0.72));
    color: color-mix(in srgb, var(--text) 82%, var(--muted) 18%);
    font:
        500 0.74rem/1.55 ui-monospace,
        "SFMono-Regular",
        Menlo,
        monospace;
}

.f1-driver-story-takeaways {
    display: grid;
    gap: 0.42rem;
    margin: 0;
    padding-left: 1rem;
    color: var(--muted);
}

.f1-driver-story-info {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: help;
    outline: none;
}

.f1-driver-story-info-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.55rem;
    padding: 0.16rem 0.42rem;
    border-radius: 999px;
    border: 1px solid color-mix(in srgb, var(--desk-accent) 24%, var(--panel-line) 76%);
    background: color-mix(in srgb, var(--desk-accent-soft) 56%, white 44%);
    color: color-mix(in srgb, var(--desk-accent) 80%, var(--text) 20%);
    font:
        600 0.7rem/1 ui-monospace,
        "SFMono-Regular",
        Menlo,
        monospace;
    letter-spacing: 0.08em;
}

.f1-driver-story-info-tip {
    position: absolute;
    right: 0;
    top: calc(100% + 0.45rem);
    z-index: 3;
    width: min(18rem, 70vw);
    padding: 0.7rem 0.8rem;
    border-radius: 0.85rem;
    border: 1px solid color-mix(in srgb, var(--desk-accent) 18%, var(--panel-line) 82%);
    background: color-mix(in srgb, rgba(255, 252, 245, 0.98) 88%, white 12%);
    box-shadow: 0 1rem 2rem rgba(39, 31, 18, 0.12);
    color: color-mix(in srgb, var(--text) 86%, var(--muted) 14%);
    font-size: 0.76rem;
    line-height: 1.55;
    opacity: 0;
    pointer-events: none;
    transform: translateY(-0.2rem);
    transition: opacity 180ms ease, transform 180ms ease;
}

.f1-driver-story-info:hover .f1-driver-story-info-tip,
.f1-driver-story-info:focus-visible .f1-driver-story-info-tip {
    opacity: 1;
    transform: translateY(0);
}

.f1-signal-list {
    display: grid;
    gap: 0.65rem;
}

.f1-signal-strip {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 0.85rem;
    align-items: center;
    padding: 0.95rem 1rem;
    text-align: left;
}

.f1-signal-copy {
    display: grid;
    gap: 0.3rem;
    min-width: 0;
}

.f1-signal-copy strong {
    color: var(--text);
    font:
        600 1rem/1.12 Georgia,
        "Times New Roman",
        serif;
    letter-spacing: -0.03em;
}

.f1-signal-copy span,
.f1-signal-metric {
    color: var(--muted);
    line-height: 1.5;
}

.f1-inspector-column {
    min-width: 0;
}

.f1-inspector-sticky {
    position: sticky;
    top: 1rem;
}

.f1-detail-panel {
    padding: 1.05rem;
}

.f1-detail-head {
    align-items: start;
}

.f1-detail-summary,
.f1-detail-method,
.f1-detail-empty,
.f1-detail-list {
    margin: 0.9rem 0 0;
}

.f1-detail-context {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
    margin-top: 0.95rem;
}

.f1-detail-list {
    display: grid;
    gap: 0.75rem;
    padding: 0;
    list-style: none;
}

.f1-detail-list li {
    display: grid;
    gap: 0.25rem;
    padding-top: 0.75rem;
    border-top: 1px solid var(--panel-line);
}

.f1-detail-list li:first-child {
    padding-top: 0;
    border-top: 0;
}

.f1-inline-action {
    border: 0;
    padding: 0;
    background: transparent;
    color: var(--accent);
}

.f1-deep-panel {
    padding: 0.85rem;
}

.f1-deep-tabs {
    align-items: center;
}

.f1-deep-dive {
    display: grid;
    gap: 0.85rem;
}

.f1-deep-empty {
    padding: 0.55rem 0 0.15rem;
    line-height: 1.55;
}

.f1-deep-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.f1-deep-card,
.f1-session-card {
    padding: 0.9rem;
}

.f1-deep-list,
.f1-deep-table {
    display: grid;
    gap: 0.7rem;
    margin: 0.75rem 0 0;
}

.f1-deep-list {
    padding: 0;
    list-style: none;
}

.f1-deep-list li,
.f1-deep-state {
    display: grid;
    gap: 0.22rem;
}

.f1-deep-table-row {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.7rem;
    padding-top: 0.72rem;
    border-top: 1px solid var(--panel-line);
}

.f1-deep-table-row:first-child {
    padding-top: 0;
    border-top: 0;
}

.f1-history-panel {
    padding: 1rem;
}

.f1-history-track {
    display: grid;
    gap: 0.7rem;
    margin-top: 0.85rem;
}

.f1-history-node {
    position: relative;
    display: grid;
    gap: 0.28rem;
    padding: 0.85rem 0.95rem 0.85rem 1.2rem;
    border: 1px solid var(--panel-line);
    background: rgba(255, 255, 255, 0.56);
    text-decoration: none;
}

.f1-history-node::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 0.2rem;
    background: color-mix(in srgb, var(--desk-accent) 60%, white 40%);
}

.f1-history-node strong {
    color: var(--text);
    font:
        600 1rem/1.1 Georgia,
        "Times New Roman",
        serif;
    letter-spacing: -0.03em;
}

.f1-history-node-live {
    background: color-mix(in srgb, var(--desk-accent-soft) 65%, white 35%);
}

.f1-history-subtitle {
    margin: 0;
    color: color-mix(in srgb, var(--desk-secondary) 64%, var(--muted) 36%);
}

.f1-skeleton-row {
    height: 4.2rem;
    border-top: 1px solid var(--panel-line);
    background:
        linear-gradient(
            90deg,
            rgba(255, 255, 255, 0.12),
            rgba(255, 255, 255, 0.55),
            rgba(255, 255, 255, 0.12)
        );
    background-size: 220% 100%;
    animation: f1-shimmer 1.4s linear infinite;
}

.f1-skeleton-row:first-child {
    border-top: 0;
}

.f1-shell.is-pulsing .f1-mode-pill {
    animation: f1-pulse-glow 1.1s ease-out;
}

.is-driver-focus {
    background:
        linear-gradient(180deg, color-mix(in srgb, var(--desk-accent-soft) 70%, white 30%), rgba(255, 255, 255, 0.66));
}

@keyframes f1-shimmer {
    from {
        background-position: 200% 0;
    }

    to {
        background-position: -20% 0;
    }
}

@keyframes f1-pulse-glow {
    0% {
        box-shadow: 0 0 0 rgba(255, 255, 255, 0);
    }

    35% {
        box-shadow:
            0 0 0 1px color-mix(in srgb, var(--desk-secondary) 72%, transparent),
            0 0 30px color-mix(in srgb, var(--desk-accent) 38%, transparent);
    }

    100% {
        box-shadow: 0 0 0 rgba(255, 255, 255, 0);
    }
}

.f1-shell {
    --panel-bg: rgba(252, 248, 240, 0.82);
    --panel-strong: rgba(255, 252, 247, 0.94);
    --panel-line: rgba(23, 24, 28, 0.11);
    --panel-shadow: 0 20px 48px rgba(16, 20, 27, 0.1);
    gap: 1.2rem;
}

.f1-ladder-panel,
.f1-history-panel,
.f1-insight-card,
.f1-detail-panel,
.f1-deep-panel,
.f1-spotlight-card,
.f1-signal-strip,
.f1-deep-card,
.f1-session-card,
.f1-panel-empty,
.f1-signal-empty {
    border-radius: 1.2rem;
}

.f1-ladder-panel,
.f1-history-panel,
.f1-insight-card,
.f1-detail-panel,
.f1-deep-panel,
.f1-spotlight-card,
.f1-signal-strip,
.f1-deep-card,
.f1-session-card,
.f1-panel-empty,
.f1-signal-empty {
    border: 1px solid var(--panel-line);
    background:
        linear-gradient(180deg, var(--panel-strong), var(--panel-bg));
    box-shadow: var(--panel-shadow);
}

.f1-panel-empty,
.f1-signal-empty {
    padding: 1rem 1.05rem;
    color: var(--muted);
    line-height: 1.55;
}

.f1-shell[data-desk-mode="review"] .f1-ladder-toggle,
.f1-shell[data-desk-mode="review"] [data-f1-ladder-panel="model"] {
    display: none;
}

.f1-shell[data-desk-mode="review"] .f1-ladder-grid {
    grid-template-columns: 1fr;
}

.f1-mode-pill {
    padding: 0.46rem 0.74rem;
}

.f1-status-label {
    color: rgba(243, 235, 223, 0.66);
}

.f1-status-copy {
    margin-top: 0.85rem;
    padding-top: 0.8rem;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    color: rgba(243, 235, 223, 0.84);
    max-width: 52ch;
}

.f1-panel-head {
    gap: 0.42rem;
}

.f1-panel-head h2,
.f1-spotlight-card h2,
.f1-detail-head h2 {
    letter-spacing: -0.045em;
}

.f1-ladder-panel,
.f1-history-panel,
.f1-insight-card,
.f1-detail-panel,
.f1-deep-panel {
    padding: 1.1rem;
}

.f1-ladder-list {
    gap: 0;
}

.f1-ladder-row {
    padding: 1rem 0.15rem;
}

.f1-story-panel {
    gap: 0.85rem;
}

.f1-insight-card {
    padding: 1.15rem;
}

.f1-spotlight-card {
    padding: 1.15rem;
}

.f1-story-context,
.f1-detail-context {
    display: flex;
    flex-wrap: wrap;
    gap: 0.7rem 0.9rem;
    margin-top: 0.95rem;
}

.f1-driver-mark {
    color: var(--text);
    font:
        700 0.96rem/1.2 ui-sans-serif,
        system-ui,
        sans-serif;
    letter-spacing: 0.01em;
}

.f1-signal-list {
    gap: 0.75rem;
}

.f1-signal-strip,
.f1-signal-empty {
    padding: 1rem 1.05rem;
}

.f1-signal-strip {
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 0.9rem;
    border-radius: 1.05rem;
}

.f1-signal-strip.is-placeholder,
.f1-spotlight-card.is-placeholder {
    color: var(--muted);
}

.f1-signal-metric {
    text-align: right;
    font:
        600 0.78rem/1.3 ui-monospace,
        SFMono-Regular,
        Menlo,
        monospace;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.f1-history-track {
    gap: 0.75rem;
}

.f1-history-node {
    border-radius: 1rem;
}

.f1-detail-panel {
    padding: 1.15rem;
}

.f1-detail-copy,
.f1-detail-summary,
.f1-detail-method,
.f1-detail-empty,
.f1-detail-list {
    margin: 0.9rem 0 0;
}

.f1-detail-copy,
.f1-detail-method,
.f1-detail-list span,
.f1-detail-ref-meta {
    color: var(--muted);
    line-height: 1.6;
}

.f1-detail-method {
    padding-top: 0.9rem;
    border-top: 1px solid var(--panel-line);
}

.f1-detail-evidence {
    margin-top: 1rem;
    padding-top: 0.95rem;
    border-top: 1px solid var(--panel-line);
}

.f1-detail-list li {
    gap: 0.2rem;
    padding-top: 0.8rem;
}

.f1-detail-list strong {
    color: var(--text);
}

.f1-inline-action {
    font:
        600 0.73rem/1.2 ui-monospace,
        SFMono-Regular,
        Menlo,
        monospace;
    letter-spacing: 0.11em;
    text-transform: uppercase;
}

.f1-deep-panel {
    padding: 0.95rem;
}

.f1-deep-tabs {
    gap: 0.55rem;
}

.f1-deep-tab {
    border-radius: 999px;
    padding-inline: 0.85rem;
}

.f1-deep-dive {
    gap: 0.9rem;
}

.f1-deep-card,
.f1-session-card {
    padding: 0.95rem 1rem;
}

.f1-deep-state {
    gap: 0.28rem;
}

.f1-review-table {
    display: grid;
    gap: 0.75rem;
    margin-top: 1rem;
}

.f1-review-table-head,
.f1-review-row {
    display: grid;
    grid-template-columns: minmax(0, 0.78fr) minmax(0, 1.18fr) minmax(0, 0.92fr) minmax(0, 1fr) minmax(0, 0.95fr);
    gap: 0.8rem;
    align-items: center;
}

.f1-review-table-head {
    padding: 0 0.95rem;
    color: var(--muted);
    font:
        600 0.72rem/1.2 ui-monospace,
        SFMono-Regular,
        Menlo,
        monospace;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.f1-review-row {
    position: relative;
    width: 100%;
    padding: 1rem 0.95rem;
    border: 1px solid var(--panel-line);
    border-radius: 1rem;
    background: rgba(255, 255, 255, 0.76);
    color: var(--text);
    text-align: left;
}

.f1-review-row::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 0.22rem;
    border-radius: 1rem 0 0 1rem;
    background: color-mix(in srgb, var(--desk-accent) 68%, white 32%);
}

.f1-review-row.is-gain::before {
    background: color-mix(in srgb, var(--desk-secondary) 70%, black 30%);
}

.f1-review-row.is-loss::before {
    background: color-mix(in srgb, var(--desk-accent) 78%, black 22%);
}

.f1-review-cell {
    display: grid;
    gap: 0.24rem;
    min-width: 0;
}

.f1-review-cell strong {
    color: var(--text);
    font:
        600 1rem/1.12 Georgia,
        "Times New Roman",
        serif;
    letter-spacing: -0.03em;
}

.f1-review-cell[data-review-label="Context"] strong {
    max-width: 14ch;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 0.84rem;
    line-height: 1.25;
}

.f1-review-cell span {
    color: var(--muted);
    line-height: 1.45;
}

.f1-review-driver .f1-row-meta {
    gap: 0.35rem;
}

.f1-review-note {
    margin: 0;
    color: var(--muted);
    font-size: 0.95rem;
    line-height: 1.55;
}

@media (max-width: 1100px) {
    .f1-workspace,
    .f1-deep-grid {
        grid-template-columns: 1fr;
    }

    .f1-inspector-sticky {
        position: static;
    }
}

@media (max-width: 820px) {
    .f1-ladder-toggle {
        display: flex;
    }

    .f1-ladder-grid {
        grid-template-columns: 1fr;
    }

    .f1-shell[data-ladder-view="track"] [data-f1-ladder-panel="model"],
    .f1-shell[data-ladder-view="model"] [data-f1-ladder-panel="track"] {
        display: none;
    }

    .f1-review-table-head {
        display: none;
    }

    .f1-timeline-series-list {
        grid-template-columns: 1fr;
    }

    .f1-review-row {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        align-items: start;
    }

    .f1-review-cell::before {
        content: attr(data-review-label);
        color: var(--muted);
        font:
            600 0.68rem/1.2 ui-monospace,
            SFMono-Regular,
            Menlo,
            monospace;
        letter-spacing: 0.1em;
        text-transform: uppercase;
    }
}

@media (max-width: 640px) {
    .f1-shell {
        margin-top: 1.4rem;
    }

    .f1-ladder-panel,
    .f1-history-panel,
    .f1-insight-card,
    .f1-detail-panel,
    .f1-deep-panel,
    .f1-spotlight-card,
    .f1-signal-strip,
    .f1-deep-card,
    .f1-session-card {
        padding-inline: 0.9rem;
    }

    .f1-context-row {
        grid-template-columns: 1fr;
        align-items: flex-start;
        gap: 0.3rem;
        padding-bottom: 0.8rem;
    }

    .f1-freshness-line {
        text-align: left;
    }

    .f1-ladder-row {
        grid-template-columns: 3.25rem minmax(0, 1fr);
        gap: 0.65rem;
    }

    .f1-row-stat,
    .f1-row-context {
        grid-column: 2;
        text-align: left;
    }

    .f1-signal-strip {
        grid-template-columns: 1fr;
    }

    .f1-signal-metric {
        text-align: left;
    }

    .f1-compare-row {
        grid-template-columns: 1fr;
    }

    .f1-compare-delta {
        text-align: left;
    }

    .f1-deep-table-row {
        grid-template-columns: 1fr;
    }

    .f1-review-row {
        grid-template-columns: 1fr;
    }
}