.f1-lead {
    position: relative;
    overflow: hidden;
}
.f1-lead::after {
    content: "";
    position: absolute;
    inset: auto 0 0;
    height: 0.55rem;
    background:
        linear-gradient(
            90deg,
            color-mix(in srgb, var(--accent) 95%, white 5%) 0 20%,
            #18a999 20% 40%,
            #1e2a78 40% 60%,
            #d9d9d9 60% 80%,
            color-mix(in srgb, var(--text) 92%, white 8%) 80% 100%
        );
    opacity: 0.9;
}
.f1-history-list {
    display: flex;
    flex-wrap: wrap;
    gap: 0.7rem;
}
.f1-history-block {
    display: grid;
    gap: 0.65rem;
}
.f1-history-block + .f1-history-block {
    margin-top: 0.9rem;
}
.f1-history-subtitle {
    margin: 0;
    color: var(--muted);
    font:
        600 0.68rem/1.2 ui-monospace,
        SFMono-Regular,
        Menlo,
        monospace;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}
.f1-history-chip {
    display: inline-flex;
    align-items: flex-start;
    flex-direction: column;
    gap: 0.45rem;
    padding: 0.45rem 0.7rem;
    border: 1px solid var(--line);
    background: rgba(255, 255, 255, 0.56);
    font:
        600 0.74rem/1.2 ui-monospace,
        SFMono-Regular,
        Menlo,
        monospace;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    text-decoration: none;
}
.f1-history-chip-live {
    min-width: min(15rem, 100%);
}
.f1-history-chip-note {
    color: var(--muted);
    font-size: 0.66rem;
    letter-spacing: 0.05em;
    line-height: 1.45;
    text-transform: none;
}
.f1-shell,
.f1-stageboard,
.f1-telemetry-rail,
.f1-sidepanel,
.f1-card-stack {
    display: grid;
    gap: 0.95rem;
}
.f1-stagebar {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.75rem 1rem;
    align-items: baseline;
    padding-bottom: 0.9rem;
    border-bottom: 1px solid var(--line);
}
.f1-stagebar-label,
.f1-table-head,
.f1-callout-kicker,
.f1-story-foot,
.f1-row span,
.f1-row-driver span,
.f1-mini-list {
    font:
        600 0.74rem/1.2 ui-monospace,
        SFMono-Regular,
        Menlo,
        monospace;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}
.f1-stagebar-label {
    color: var(--muted);
}
.f1-stagebar-value {
    color: var(--text);
    font:
        600 clamp(0.98rem, 1.8vw, 1.16rem)/1.25 Georgia,
        "Times New Roman",
        serif;
    letter-spacing: 0;
    text-transform: none;
}
.f1-history-chip strong,
.f1-story-foot a {
    color: var(--accent);
}
.f1-scoreline {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(20rem, 0.85fr);
    gap: 1rem;
}
.f1-callout {
    border: 1px solid var(--line);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.82), rgba(255, 255, 255, 0.48)),
        linear-gradient(180deg, rgba(255, 255, 255, 0.18), rgba(255, 255, 255, 0));
    box-shadow: 0 14px 34px rgba(22, 21, 19, 0.07);
    padding: 1.15rem;
}
.f1-callout-primary {
    background:
        linear-gradient(125deg, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.52)),
        radial-gradient(circle at top right, rgba(24, 169, 153, 0.1), transparent 15rem);
}
.f1-callout h2 {
    margin: 0.35rem 0 0;
    font:
        600 clamp(2rem, 4vw, 3.4rem)/0.95 Georgia,
        "Times New Roman",
        serif;
    letter-spacing: -0.04em;
}
.f1-callout-head {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: 0.7rem;
}
.f1-callout p {
    margin: 0.9rem 0 0;
}
.f1-callout-leader {
    margin: 0.78rem 0 0;
    color: color-mix(in srgb, var(--text) 88%, var(--accent) 12%);
    font:
        600 1rem/1.38 Georgia,
        "Times New Roman",
        serif;
    letter-spacing: 0;
    text-transform: none;
}
.f1-callout-copy {
    max-width: 62ch;
}
.f1-architecture-pop {
    margin-left: 0.28rem;
    vertical-align: baseline;
}
.f1-architecture-tip {
    left: 50%;
    right: auto;
    top: calc(100% + 0.6rem);
    width: min(35rem, calc(100vw - 2rem));
    padding: 0.95rem 1rem 1rem;
    transform: translate(-50%, -0.2rem);
}
.f1-architecture-pop:hover .f1-architecture-tip,
.f1-architecture-pop:focus-within .f1-architecture-tip {
    transform: translate(-50%, 0);
}
.f1-architecture-copy,
.f1-architecture-ascii {
    display: block;
}
.f1-architecture-copy {
    margin-bottom: 0.75rem;
    color: color-mix(in srgb, #f7f2eb 72%, #18a999 28%);
    font:
        600 0.72rem/1.45 ui-monospace,
        SFMono-Regular,
        Menlo,
        monospace;
    letter-spacing: 0.04em;
    text-transform: none;
}
.f1-architecture-ascii {
    overflow-x: auto;
    color: #f7f2eb;
    font:
        500 0.67rem/1.4 ui-monospace,
        SFMono-Regular,
        Menlo,
        monospace;
    letter-spacing: 0;
    white-space: pre;
}
.f1-grid {
    grid-template-columns: minmax(0, 1.16fr) minmax(18rem, 0.84fr);
    gap: 0.95rem 1rem;
    align-items: start;
}
.f1-main-column {
    display: grid;
    gap: 0.95rem;
    min-width: 0;
    align-content: start;
}
.f1-telemetry-rail {
    min-width: 0;
}
.f1-sidepanel {
    align-content: start;
}
.f1-sidepanel-title-spacer {
    visibility: hidden;
    pointer-events: none;
}
.f1-status-callout {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.88), rgba(255, 255, 255, 0.58)),
        radial-gradient(circle at top right, rgba(180, 76, 47, 0.08), transparent 11rem);
}
.f1-status-block {
    display: grid;
    gap: 0.35rem;
    margin-top: 0.9rem;
    padding-top: 0.9rem;
    border-top: 1px solid var(--line);
}
.f1-status-mode,
.f1-status-lap,
.f1-status-copy {
    margin: 0;
}
.f1-status-mode {
    color: var(--text);
    font:
        600 clamp(1.7rem, 4vw, 2.2rem)/0.95 Georgia,
        "Times New Roman",
        serif;
    letter-spacing: -0.04em;
}
.f1-status-lap {
    color: var(--accent);
    font:
        600 0.72rem/1.2 ui-monospace,
        SFMono-Regular,
        Menlo,
        monospace;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}
.f1-status-lap[hidden] {
    display: none !important;
}
.f1-status-copy {
    color: var(--muted);
    font-size: 0.96rem;
    line-height: 1.55;
    max-width: 30ch;
}
.f1-detail-block {
    display: grid;
    gap: 0.85rem;
    align-content: start;
    min-width: 0;
}
.f1-section-head,
.f1-card-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.7rem;
}
.f1-card-head .eyebrow,
.f1-section-head .section-title {
    margin: 0;
}
.f1-rail-panel {
    border: 1px solid var(--line);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.78), rgba(255, 255, 255, 0.4));
    box-shadow: 0 12px 28px rgba(22, 21, 19, 0.06);
    overflow-y: auto;
    overflow-x: hidden;
}
.f1-table-head,
.f1-row {
    display: grid;
    grid-template-columns: 3.5rem minmax(0, 1.35fr) minmax(0, 0.82fr) minmax(0, 0.78fr) minmax(0, 0.78fr) auto;
    gap: 0.8rem;
    align-items: center;
    padding: 0.9rem 1rem;
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
}
.f1-table-head {
    color: var(--muted);
    border-bottom: 1px solid var(--line);
}
.f1-row {
    border-bottom: 1px solid var(--line);
}
.f1-row:last-child {
    border-bottom: 0;
}
.f1-row-rank {
    display: inline-flex;
    min-width: 2.15rem;
    height: 2.15rem;
    padding-inline: 0.5rem;
    align-items: center;
    justify-content: center;
    border-radius: 0.5rem;
    background: color-mix(in srgb, var(--text) 92%, white 8%);
    box-shadow: inset 0 0 0 1px color-mix(in srgb, white 10%, transparent 90%);
    color: var(--bg);
    font:
        600 0.9rem/1 ui-monospace,
        SFMono-Regular,
        Menlo,
        monospace;
}
.f1-row-driver {
    display: grid;
    gap: 0.28rem;
    min-width: 0;
}
.f1-row-meta {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 0.36rem;
    align-items: center;
}
.f1-row-driver strong {
    font-size: 1.1rem;
    letter-spacing: -0.03em;
}
.f1-team-pill {
    display: inline-flex;
    width: fit-content;
    max-width: 100%;
    align-items: center;
    padding: 0.18rem 0.48rem;
    border-radius: 0.38rem;
    border: 1px solid color-mix(in srgb, var(--team-color) 50%, white 50%);
    background: color-mix(in srgb, var(--team-color) 7%, white 93%);
    color: color-mix(in srgb, var(--team-color) 82%, black 18%);
    font:
        600 0.66rem/1.2 ui-monospace,
        SFMono-Regular,
        Menlo,
        monospace;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}
.f1-track-note {
    display: inline-flex;
    width: fit-content;
    max-width: 100%;
    align-items: center;
    gap: 0.35rem;
    color: var(--muted);
}
.f1-track-note::before {
    content: "";
    width: 0.7rem;
    height: 1px;
    background: currentColor;
    opacity: 0.65;
}
.f1-track-note.is-leader {
    color: #0d7d69;
}
.f1-track-note.is-gap {
    color: color-mix(in srgb, #8f4c39 85%, black 15%);
}
.f1-track-note.is-grid {
    color: color-mix(in srgb, var(--muted) 82%, black 18%);
}
.f1-row-trend {
    font-variant-numeric: tabular-nums;
}
.f1-row-trend-up {
    color: #0d7d69;
}
.f1-row-trend-down {
    color: var(--accent);
}
.f1-row-trend-flat {
    color: var(--muted);
}
.f1-inline-action {
    width: fit-content;
    border: 0;
    padding: 0;
    background: transparent;
    color: var(--accent);
    font:
        600 0.74rem/1.2 ui-monospace,
        SFMono-Regular,
        Menlo,
        monospace;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    cursor: pointer;
}
.f1-inline-action:hover,
.f1-inline-action:focus-visible {
    text-decoration: underline;
    outline: none;
}
.f1-story-card-featured {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.74), rgba(255, 255, 255, 0.44)),
        radial-gradient(circle at top right, rgba(180, 76, 47, 0.14), transparent 12rem);
}
.f1-sidepanel .f1-callout,
.f1-sidepanel .card {
    padding: 1.02rem 1rem;
}
.f1-spotlight-card {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.86), rgba(255, 255, 255, 0.5)),
        radial-gradient(circle at top right, rgba(24, 169, 153, 0.18), transparent 13rem);
}
.f1-spotlight-card h2,
.f1-story-card h2 {
    margin: 0.5rem 0 0;
}
.f1-spotlight-copy {
    color: var(--muted);
}
.f1-story-foot {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 0.75rem;
    margin-top: 1rem;
    color: var(--muted);
}
.f1-detail-panel {
    border: 1px solid var(--line);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.74), rgba(255, 255, 255, 0.42)),
        radial-gradient(circle at top right, rgba(30, 42, 120, 0.08), transparent 12rem);
    box-shadow: var(--shadow);
    padding: 1.25rem;
}
.f1-detail-empty {
    color: var(--muted);
}
.f1-detail-head {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 0.9rem;
    align-items: start;
}
.f1-detail-head h2 {
    margin: 0.4rem 0 0;
}
.f1-detail-summary {
    margin-top: 1rem;
    font-size: 1.02rem;
}
.f1-detail-method {
    margin-top: 0.9rem;
    color: var(--muted);
    font-size: 0.94rem;
}
.f1-detail-evidence {
    margin-top: 1.2rem;
}
.f1-detail-list {
    display: grid;
    gap: 0.8rem;
    padding: 0;
    margin: 0.9rem 0 0;
    list-style: none;
}
.f1-detail-list li {
    display: grid;
    gap: 0.2rem;
    padding-top: 0.8rem;
    border-top: 1px solid var(--line);
}
.f1-detail-list li:first-child {
    padding-top: 0;
    border-top: 0;
}
.f1-detail-list strong {
    font:
        600 0.76rem/1.2 ui-monospace,
        SFMono-Regular,
        Menlo,
        monospace;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}
.f1-detail-list span {
    color: var(--muted);
}
.f1-skeleton-row {
    height: 4.2rem;
    border-bottom: 1px solid var(--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;
}
@keyframes f1-shimmer {
    from {
        background-position: 200% 0;
    }
    to {
        background-position: -20% 0;
    }
}
@media (max-width: 900px) {
    .f1-grid,
    .f1-scoreline {
        grid-template-columns: 1fr;
    }
    .f1-architecture-tip {
        left: auto;
        right: 0;
        width: min(31rem, calc(100vw - 1.5rem));
        transform: translate(0, -0.2rem);
    }
    .f1-architecture-pop:hover .f1-architecture-tip,
    .f1-architecture-pop:focus-within .f1-architecture-tip {
        transform: translate(0, 0);
    }
    .f1-sidepanel-title-spacer {
        display: none;
    }
    .f1-status-copy {
        max-width: none;
    }
}
@media (max-width: 640px) {
    .f1-stagebar {
        grid-template-columns: 1fr;
        gap: 0.28rem;
    }
    .f1-table-head,
    .f1-row {
        grid-template-columns: 2.4rem minmax(0, 1.2fr) minmax(0, 0.75fr) minmax(0, 0.72fr) minmax(0, 0.68fr) auto;
        gap: 0.55rem;
        padding-inline: 0.75rem;
        font-size: 0.72rem;
    }
    .f1-row-driver strong {
        font-size: 0.95rem;
    }
    .f1-team-pill {
        font-size: 0.62rem;
    }
    .f1-track-note {
        font-size: 0.62rem;
    }
    .f1-architecture-ascii {
        font-size: 0.61rem;
    }
}