/* /Components/Layout/AdminTopBar.razor.rz.scp.css */
/* AdminTopBar styles live globally in wwwroot/css/rallytrack.css so they
   can be shared with PublicChrome. This file intentionally empty. */
/* /Components/Layout/AuthLayout.razor.rz.scp.css */
/* Centred shell for unauthenticated pages (login, first-time setup). */

.rt-auth-shell[b-u2e89v8erg] {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--bg-base);
    color: var(--fg);
    padding: var(--s-5);
}

.rt-auth-card[b-u2e89v8erg] {
    width: 100%;
    max-width: 400px;
    background: var(--bg-surface);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    padding: var(--s-6);
}
/* /Components/Layout/EventContextMenu.razor.rz.scp.css */
/* =========================================================================
   Event context menu — horizontal tabs that appear under the top bar when
   the admin is inside an event (/admin/events/{id}/...). Matches the
   .event-tabs treatment from the mockup (~lines 455–478).

   Selectors use ::deep so the rules reach the <a> elements rendered by the
   <NavLink> child component (whose root sits in NavLink's CSS isolation
   scope, not this component's).
   ========================================================================= */

.rt-event-context[b-ig7l0up9ff] {
    position: sticky;
    /* Sticks to the top of the scrolling .rt-admin-main (which begins directly
       below the fixed top bar), so top: 0 pins it under the top bar. */
    top: 0;
    z-index: 40;
    background: var(--bg-surface);
    border-bottom: 1px solid var(--line);
}

.rt-event-context-tabs[b-ig7l0up9ff] {
    display: flex;
    gap: 0;
    padding: 0 var(--s-5);
    overflow-x: auto;
}

.rt-event-context-tabs[b-ig7l0up9ff]  .rt-event-tab {
    padding: 12px 16px;
    font-family: var(--font-display);
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--fg-muted);
    border-bottom: 2px solid transparent;
    cursor: pointer;
    user-select: none;
    text-decoration: none;
    white-space: nowrap;
}

.rt-event-context-tabs[b-ig7l0up9ff]  .rt-event-tab:hover {
    color: var(--fg);
    text-decoration: none;
}

.rt-event-context-tabs[b-ig7l0up9ff]  .rt-event-tab.active {
    color: var(--fg);
    border-bottom-color: var(--rally-red);
}

@media (max-width: 640.98px) {
    .rt-event-context-tabs[b-ig7l0up9ff] {
        padding: 0 var(--s-3);
    }
    .rt-event-context-tabs[b-ig7l0up9ff]  .rt-event-tab {
        padding: 12px 12px;
    }
}
/* /Components/Layout/MainLayout.razor.rz.scp.css */
/* =========================================================================
   Admin shell — three-region chrome per design.md §11.0:
   - Top bar (sticky, full width)
   - Sidebar (collapsible on desktop; slide-in drawer on mobile)
   - Main column: EventContextMenu (when inside an event) + page content

   Sidebar visibility is driven by JS-managed body classes (sb-collapsed for
   desktop hide, sb-open for mobile drawer). The hamburger in AdminTopBar
   toggles them via window.RallyTrack.Sidebar.toggle().
   ========================================================================= */

.rt-admin-shell[b-8mn5kvs9r5] {
    /* Pin the shell to the viewport so the top bar and sidebar stay fixed and
       only the main column scrolls vertically (an app-shell layout). */
    height: 100vh;
    overflow: hidden;
    background: var(--bg-base);
    color: var(--fg);
    display: flex;
    flex-direction: column;
}

.rt-admin-body[b-8mn5kvs9r5] {
    flex: 1 1 auto;
    display: flex;
    min-height: 0;
}

.rt-admin-sidebar[b-8mn5kvs9r5] {
    width: 220px;
    background: linear-gradient(180deg, var(--bg-surface) 0%, var(--bg-base) 100%);
    border-right: 1px solid var(--line);
    overflow-y: auto;
    flex-shrink: 0;
}

.rt-admin-main[b-8mn5kvs9r5] {
    flex: 1 1 auto;
    min-width: 0;
    /* The vertical scroll container for page content, so the sidebar stays
       fixed while the right pane scrolls. The event-context tabs are the first
       child here and stick to the top of THIS box (top: 0) — i.e. directly
       under the fixed top bar. Pages that need horizontal scroll (scoring grid)
       still supply their own width-constrained wrapper with overflow:auto. */
    overflow-y: auto;
}

.rt-admin-main .content[b-8mn5kvs9r5] {
    padding: var(--s-5) var(--s-6);
}

/* Mobile-drawer chrome (the body.sb-* visibility rules live in the global
   wwwroot/css/rallytrack.css because component-scoped CSS can't target the
   <body> element). */

@media (max-width: 768px) {
    .rt-admin-sidebar[b-8mn5kvs9r5] {
        position: fixed;
        top: 56px;
        bottom: 0;
        left: 0;
        z-index: 45;
        transform: translateX(-100%);
        transition: transform 0.2s ease-out;
        box-shadow: var(--shadow-2);
    }

    .rt-admin-main .content[b-8mn5kvs9r5] {
        padding: var(--s-4);
    }
}

/* ── Error UI ───────────────────────────────────────────────────────────── */

#blazor-error-ui[b-8mn5kvs9r5] {
    background: var(--bg-elevated);
    border-top: 1px solid var(--rally-red);
    bottom: 0;
    box-shadow: 0 -1px 8px rgba(0, 0, 0, 0.4);
    box-sizing: border-box;
    color: var(--fg);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
    font-family: var(--font-body);
}

#blazor-error-ui .dismiss[b-8mn5kvs9r5] {
    cursor: pointer;
    position: absolute;
    right: 0.75rem;
    top: 0.5rem;
}
/* /Components/Layout/NavMenu.razor.rz.scp.css */
/* =========================================================================
   Admin sidebar nav. Lives inside the .rt-admin-sidebar from MainLayout.
   The brand row is owned by AdminTopBar; this component is nav links only.
   ========================================================================= */

.rt-sidebar-nav[b-2mylok37ih] {
    padding: var(--s-4) 0;
}

.rt-sidebar-section[b-2mylok37ih] {
    padding: var(--s-4) var(--s-4) var(--s-2);
    font-family: var(--font-mono);
    font-size: 10.5px;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: var(--fg-dim);
}

.nav-item[b-2mylok37ih] {
    padding: 0;
}

.nav-item[b-2mylok37ih]  .nav-link {
    color: var(--fg-muted);
    background: none;
    border: none;
    border-left: 2px solid transparent;
    border-radius: 0;
    height: 2.5rem;
    display: flex;
    align-items: center;
    line-height: 2.5rem;
    width: 100%;
    padding: 0 var(--s-4);
    font-family: var(--font-display);
    font-size: 13px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    text-decoration: none;
}

.nav-item[b-2mylok37ih]  a.active {
    background-color: var(--bg-elevated);
    color: var(--fg);
    border-left-color: var(--rally-red);
}

.nav-item[b-2mylok37ih]  .nav-link:hover {
    background-color: var(--bg-elevated);
    color: var(--fg);
    text-decoration: none;
}
/* /Components/Layout/PublicLayout.razor.rz.scp.css */
/* =========================================================================
   Public site layout — slim chrome topbar per §11.0 concern 8.
   The chrome itself is owned by Components/Layout/PublicChrome.razor and
   shares .rt-topbar / .logo-mark / .chrome-clock / .chrome-countdown styles
   with the admin top bar (defined globally in wwwroot/css/rallytrack.css).
   ========================================================================= */

.rt-public-main[b-fvwwcpih66] {
    max-width: 1320px;
    margin: 0 auto;
    padding: var(--s-6);
}

#blazor-error-ui[b-fvwwcpih66] {
    background: var(--bg-elevated);
    border-top: 1px solid var(--rally-red);
    bottom: 0;
    box-shadow: 0 -1px 8px rgba(0, 0, 0, 0.4);
    box-sizing: border-box;
    color: var(--fg);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
    font-family: var(--font-body);
}

#blazor-error-ui .dismiss[b-fvwwcpih66] {
    cursor: pointer;
    position: absolute;
    right: 0.75rem;
    top: 0.5rem;
}
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-5fq3updh8t],
.components-reconnect-repeated-attempt-visible[b-5fq3updh8t],
.components-reconnect-failed-visible[b-5fq3updh8t],
.components-pause-visible[b-5fq3updh8t],
.components-resume-failed-visible[b-5fq3updh8t],
.components-rejoining-animation[b-5fq3updh8t] {
    display: none;
}

#components-reconnect-modal.components-reconnect-show .components-reconnect-first-attempt-visible[b-5fq3updh8t],
#components-reconnect-modal.components-reconnect-show .components-rejoining-animation[b-5fq3updh8t],
#components-reconnect-modal.components-reconnect-paused .components-pause-visible[b-5fq3updh8t],
#components-reconnect-modal.components-reconnect-resume-failed .components-resume-failed-visible[b-5fq3updh8t],
#components-reconnect-modal.components-reconnect-retrying[b-5fq3updh8t],
#components-reconnect-modal.components-reconnect-retrying .components-reconnect-repeated-attempt-visible[b-5fq3updh8t],
#components-reconnect-modal.components-reconnect-retrying .components-rejoining-animation[b-5fq3updh8t],
#components-reconnect-modal.components-reconnect-failed[b-5fq3updh8t],
#components-reconnect-modal.components-reconnect-failed .components-reconnect-failed-visible[b-5fq3updh8t] {
    display: block;
}


#components-reconnect-modal[b-5fq3updh8t] {
    background-color: white;
    width: 20rem;
    margin: 20vh auto;
    padding: 2rem;
    border: 0;
    border-radius: 0.5rem;
    box-shadow: 0 3px 6px 2px rgba(0, 0, 0, 0.3);
    opacity: 0;
    transition: display 0.5s allow-discrete, overlay 0.5s allow-discrete;
    animation: components-reconnect-modal-fadeOutOpacity-b-5fq3updh8t 0.5s both;
    &[open]

{
    animation: components-reconnect-modal-slideUp-b-5fq3updh8t 1.5s cubic-bezier(.05, .89, .25, 1.02) 0.3s, components-reconnect-modal-fadeInOpacity-b-5fq3updh8t 0.5s ease-in-out 0.3s;
    animation-fill-mode: both;
}

}

#components-reconnect-modal[b-5fq3updh8t]::backdrop {
    background-color: rgba(0, 0, 0, 0.4);
    animation: components-reconnect-modal-fadeInOpacity-b-5fq3updh8t 0.5s ease-in-out;
    opacity: 1;
}

@keyframes components-reconnect-modal-slideUp-b-5fq3updh8t {
    0% {
        transform: translateY(30px) scale(0.95);
    }

    100% {
        transform: translateY(0);
    }
}

@keyframes components-reconnect-modal-fadeInOpacity-b-5fq3updh8t {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes components-reconnect-modal-fadeOutOpacity-b-5fq3updh8t {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

.components-reconnect-container[b-5fq3updh8t] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

#components-reconnect-modal p[b-5fq3updh8t] {
    margin: 0;
    text-align: center;
}

#components-reconnect-modal button[b-5fq3updh8t] {
    border: 0;
    background-color: #6b9ed2;
    color: white;
    padding: 4px 24px;
    border-radius: 4px;
}

    #components-reconnect-modal button:hover[b-5fq3updh8t] {
        background-color: #3b6ea2;
    }

    #components-reconnect-modal button:active[b-5fq3updh8t] {
        background-color: #6b9ed2;
    }

.components-rejoining-animation[b-5fq3updh8t] {
    position: relative;
    width: 80px;
    height: 80px;
}

    .components-rejoining-animation div[b-5fq3updh8t] {
        position: absolute;
        border: 3px solid #0087ff;
        opacity: 1;
        border-radius: 50%;
        animation: components-rejoining-animation-b-5fq3updh8t 1.5s cubic-bezier(0, 0.2, 0.8, 1) infinite;
    }

        .components-rejoining-animation div:nth-child(2)[b-5fq3updh8t] {
            animation-delay: -0.5s;
        }

@keyframes components-rejoining-animation-b-5fq3updh8t {
    0% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    4.9% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    5% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 1;
    }

    100% {
        top: 0px;
        left: 0px;
        width: 80px;
        height: 80px;
        opacity: 0;
    }
}
/* /Components/Pages/Admin/EventSetup.razor.rz.scp.css */
/* ── Lifecycle confirmation modals ───────────────────────────────────────── */

.pa-comment-overlay[b-zfzj481hen] {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.35);
    z-index: 1050;
    display: flex;
    align-items: center;
    justify-content: center;
}

.pa-comment-box[b-zfzj481hen] {
    background: var(--bg-surface);
    color: var(--fg);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    padding: 1.25rem;
    min-width: 22rem;
    max-width: 30rem;
    box-shadow: var(--shadow-2);
}
/* /Components/Pages/Admin/ScoringGrid.razor.rz.scp.css */
/* =========================================================================
   Scoring grid — dark-mode design system.
   Cell states per design.md §11.4.4 (attention-based, not source-based).
   Visual reference: docs/rallytrack-mockups.html lines 858–1001.

   Cell backgrounds fill the td edge-to-edge (no radius, no internal gap)
   so the colour blocks read as a continuous strip across the row. Zero
   E/L and zero Penalty values render dim — they hold a value, just not
   an actionable one. Non-zero E/L and Penalty cells get a red background
   to draw the eye.
   ========================================================================= */

/* ── Grid frame ─────────────────────────────────────────────────────────── */

/* Fill the available viewport space below the admin chrome. The offset
   accounts for AdminTopBar (64px), EventContextMenu (~44px), .content
   vertical padding (48px = 2 × var(--s-5)), the "← Setup / Scoring Grid"
   heading row including its mb-3 (~56px), the heat tab strip (~38px), and
   a small grace gap. Tune the offset if those rows change height. */
.scoring-grid-wrap[b-in9vpfei29] {
    background: var(--bg-surface);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    overflow: auto;
    height: calc(100vh - 250px);
    min-height: 400px;
}

.scoring-grid[b-in9vpfei29] {
    border-collapse: separate;
    border-spacing: 0;
    table-layout: fixed;
    width: 100%;
    color: var(--fg);
    font-family: var(--font-mono);
    font-size: 10.5px;
    background: var(--bg-surface);
    margin: 0;
}

/* ── Sticky header rows ─────────────────────────────────────────────────── */

.scoring-grid thead tr.sticky-row[b-in9vpfei29] {
    position: sticky;
    z-index: 3;
}

/* Row 1 holds the rowspan=2 "Car" corner. The z-index on each <tr> creates a
   stacking context, so the Car cell's own z-index can't beat a sibling row —
   without this, row 2 (later in the DOM, equal z-index) painted its subheaders
   OVER the frozen Car corner during horizontal scroll. Raising row 1 above row
   2 fixes that; the two rows never overlap elsewhere (different `top` bands),
   so nothing else is affected. */
.scoring-grid thead tr.sticky-row-1[b-in9vpfei29] { top: 0; z-index: 4; }
.scoring-grid thead tr.sticky-row-2[b-in9vpfei29] { top: var(--hdr1, 36px); z-index: 3; }

/* ── Sticky car column ──────────────────────────────────────────────────── */

.scoring-grid .sticky-col[b-in9vpfei29] {
    position: sticky;
    z-index: 1;
    background: var(--bg-elevated);
}

.scoring-grid thead .sticky-col[b-in9vpfei29] {
    z-index: 4;
    background-color: var(--bg-elevated-2);
    color: var(--fg);
}

.sticky-col-car[b-in9vpfei29] {
    left: 0;
    min-width: 3.5rem;
    width: 3.5rem;
    font-family: var(--font-display);
    font-weight: 700;
    font-size: 14px;
    text-align: center;
}

/* §11.4.4 car-number colour model. Out of competition (DNS/DNF/ELT/DQ): solid
   red background with light text. Still running but penalised, or with an
   unresolved row conflict: red text on the default background. The out state
   wins (it sets the background; text stays light). No text badges. */
.scoring-grid tbody td.sticky-col-car.car-out[b-in9vpfei29] {
    background: var(--rally-red) !important;
    color: #fff;
    font-weight: 800;
}

.scoring-grid tbody td.sticky-col-car.car-penalty[b-in9vpfei29] {
    color: var(--rally-red);
    font-weight: 800;
}

/* Car number is clickable to highlight the row. */
.scoring-grid tbody td.car-clickable[b-in9vpfei29] {
    cursor: pointer;
    user-select: none;
}

/* Row highlight (click a car number): a thin green outline around the whole
   row so the operator can track it across the wide, horizontally-scrolled grid.
   border-collapse:separate means we draw the rectangle from the cells — a green
   top+bottom on every cell, plus a green left edge on the frozen car column and
   a green right edge on the last cell. */
.scoring-grid tbody tr.row-selected td[b-in9vpfei29] {
    border-top: 1px solid var(--green) !important;
    border-bottom: 1px solid var(--green) !important;
}

.scoring-grid tbody tr.row-selected td.sticky-col-car[b-in9vpfei29] {
    border-left: 1px solid var(--green) !important;
}

.scoring-grid tbody tr.row-selected td:last-child[b-in9vpfei29] {
    border-right: 1px solid var(--green) !important;
}

/* ── Header chrome ──────────────────────────────────────────────────────── */

.scoring-grid thead th[b-in9vpfei29] {
    font-family: var(--font-display);
    font-size: 11.5px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--fg-dim);
    padding: 8px 10px;
    border-bottom: 1px solid var(--line-strong);
    border-right: 1px solid var(--line);
    text-align: center;
    white-space: nowrap;
    background: var(--bg-elevated);
}

.sub-col[b-in9vpfei29] {
    min-width: 3rem;
    vertical-align: bottom;
    padding-left: 0.25rem !important;
    padding-right: 0.25rem !important;
    white-space: nowrap;
    overflow: hidden;
    font-size: 10px !important;
}

.col-target[b-in9vpfei29] { min-width: 3rem;   width: 3rem;   }
.col-el[b-in9vpfei29]     { min-width: 3rem;   width: 3rem;   }
.col-pt[b-in9vpfei29]     { min-width: 3.5rem; width: 3.5rem; }
.col-pa[b-in9vpfei29]     { min-width: 3.5rem;               }
.col-calc[b-in9vpfei29]   { min-width: 3rem;   width: 3rem;   }
.col-live[b-in9vpfei29]   { min-width: 3.5rem; width: 3.5rem; }

/* Group dividers between TC/SS blocks. */
.scoring-grid .group-end[b-in9vpfei29] {
    border-right: 2px solid var(--line-strong) !important;
}

/* Row-1 group headers — calmer green for TC, calmer blue for SS to match
   the cell-tone palette below. */
.scoring-grid thead .item-group-header[b-in9vpfei29] {
    white-space: normal;
    line-height: 1.2;
    padding-top: 0.25rem !important;
    padding-bottom: 0.25rem !important;
}

.scoring-grid thead .item-group-header.bg-tc[b-in9vpfei29] {
    background-color: #0F1A24 !important;
    color: var(--green);
}

.scoring-grid thead .item-group-header.bg-ss[b-in9vpfei29] {
    background-color: #0E1B2A !important;
    color: var(--cyan);
}

/* ── Body cells: defaults ───────────────────────────────────────────────── */
/* Cells render flush — zero padding on the td, the content lives in a
   <span class="cell-ro"> (read-only) or the rendered <input> (editable).
   Padding lives on the inner element so the background colour fills the
   entire td. */

.scoring-grid tbody td[b-in9vpfei29] {
    padding: 0;
    border-bottom: 1px solid var(--line);
    border-right: 1px solid var(--line);
    height: 28px;
    text-align: center;
    font-variant-numeric: tabular-nums;
    position: relative;
    color: var(--fg);
    background: transparent;
    vertical-align: middle;
}

.scoring-grid tbody tr:nth-child(even) td:not(.cell-prov):not(.cell-verified):not(.cell-conflict):not(.cell-tc):not(.cell-ss):not(.cell-penalty):not(.cell-el-late):not(.cell-el-early):not(.cell-na):not(.cell-focus):not(.pa-applied)[b-in9vpfei29] {
    background: var(--bg-stripe);
}

.scoring-grid tbody tr:hover td:not(.cell-prov):not(.cell-verified):not(.cell-conflict):not(.cell-tc):not(.cell-ss):not(.cell-penalty):not(.cell-el-late):not(.cell-el-early):not(.cell-focus)[b-in9vpfei29] {
    background: var(--bg-elevated);
}

/* ── Cell-tone classes (design.md §11.4.4 + mockup CSS) ─────────────────── */
/* "Routine value present" tones: calm green for TC check-ins, calm blue
   for stage Start/Finish/StageTime. These keep the eye moving across the
   grid rather than stopping on every populated cell. */

.scoring-grid tbody td.cell-tc[b-in9vpfei29] {
    background: rgba(43, 182, 115, 0.10) !important;
    color: var(--green);
}

.scoring-grid tbody td.cell-ss[b-in9vpfei29] {
    background: rgba(56, 189, 248, 0.10) !important;
    color: var(--cyan);
}

/* "Dim" tone for legitimate zero/no-action values — Target Time, zero
   E/L, dash Penalty Time, empty Penalty Adjust placeholder. */
.scoring-grid tbody td.cell-dim[b-in9vpfei29],
.scoring-grid tbody td.cell-target[b-in9vpfei29] {
    color: var(--fg-dim);
}

/* "Attention required" tones — non-zero E/L and Penalty Time get the red
   penalty background. Direction of E/L is signalled by text colour:
   late = rally-red, early = cyan. */
.scoring-grid tbody td.cell-penalty[b-in9vpfei29] {
    background: var(--rally-red-glow) !important;
    color: var(--rally-red);
}

.scoring-grid tbody td.cell-el-late[b-in9vpfei29] {
    background: var(--rally-red-glow) !important;
    color: var(--rally-red);
}

.scoring-grid tbody td.cell-el-early[b-in9vpfei29] {
    background: var(--rally-red-glow) !important;
    color: var(--cyan);
}

/* ── Attention-based verification states ────────────────────────────────── */

.scoring-grid tbody td.cell-empty[b-in9vpfei29] {
    color: var(--fg-faint);
}

.scoring-grid tbody td.cell-prov[b-in9vpfei29] {
    background: var(--amber-glow) !important;
    color: var(--amber);
}

.scoring-grid tbody td.cell-verified[b-in9vpfei29] {
    background: var(--green-glow) !important;
    color: var(--green);
}

.scoring-grid tbody td.cell-conflict[b-in9vpfei29] {
    background: var(--pink-glow) !important;
    color: var(--pink);
}

.scoring-grid tbody td.cell-conflict[b-in9vpfei29]::after {
    content: "";
    position: absolute;
    top: 4px;
    right: 4px;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: var(--pink);
    z-index: 1;
}

.scoring-grid tbody td.cell-na[b-in9vpfei29] {
    color: var(--fg-faint);
    background: rgba(255, 255, 255, 0.02) !important;
}

.scoring-grid tbody td.cell-focus[b-in9vpfei29] {
    outline: 2px solid var(--rally-red);
    outline-offset: -2px;
    background: var(--rally-red-glow) !important;
    color: var(--fg);
}

/* ── §11.4.4 (v2.13.2): RallySafe-event cell states ─────────────────────── */
/* Three new tones layered on top of the default styling for RallySafe
   events specifically. The default state is unchanged — no extra class is
   needed when the cell holds a RallySafe-provided value. */

/* "No time recorded — check timecard". The TC has no ControlTime row at
   all, prompting the operator to enter the value from the paper timecard.
   The yellow tone draws the eye without screaming "error"; the cell is
   editable so typing transitions it to cell-manual-entry. */
.scoring-grid tbody td.cell-empty-tc[b-in9vpfei29] {
    background: var(--amber-glow) !important;
    color: var(--amber);
}

/* Operator typed a value into a previously-empty TC cell. Faint-green
   distinguishes operator-entered values from RallySafe-provided ones at a
   glance. No comment indicator — the value is simply present and trusted
   per §11.4.4. */
.scoring-grid tbody td.cell-manual-entry[b-in9vpfei29] {
    background: var(--green-glow) !important;
    color: var(--green);
}

/* Operator overwrote what RallySafe provided. Stronger tone than the
   manual-entry green because overrides are exceptional. The comment
   triangle is added via the existing .note-indicator span, set by the
   render path when OverrideSource is populated. */
.scoring-grid tbody td.cell-manual-override[b-in9vpfei29] {
    background: var(--purple-glow) !important;
    color: var(--purple);
}

/* §6.4 strict-chain break — this TC has a check-in but its anchor is
   missing, so E/L cannot be computed. The cell stays genuinely blank
   (no background tint) because the upstream yellow TC carries the signal.
   Distinguished from cell-dim (which is the on-time / no-data treatment
   with subtle dimming): cell-blank renders truly empty so the operator's
   eye doesn't stop here. */
.scoring-grid tbody td.cell-blank[b-in9vpfei29] {
    color: transparent;
    background: transparent !important;
}

/* ── Penalty Adjust special (§11.4.4) ───────────────────────────────────── */
/* Zero values dim out (no operator action needed); non-zero values turn
   red to signal the COC has applied an override. */

.scoring-grid tbody td.pa-zero[b-in9vpfei29] {
    color: var(--fg-dim);
}

.scoring-grid tbody td.pa-applied[b-in9vpfei29] {
    color: var(--rally-red);
    font-weight: 600;
    background: var(--rally-red-glow) !important;
}

/* ── Input chrome inside editable cells ─────────────────────────────────── */

.scoring-grid td[b-in9vpfei29]  .form-control {
    width: 100%;
    background: transparent;
    border: none;
    color: inherit;
    font-family: var(--font-mono);
    font-size: 10.5px;
    height: 28px;
    padding: 0 6px;
    text-align: center;
}

.scoring-grid td[b-in9vpfei29]  .form-control::placeholder {
    color: var(--fg-faint);
    opacity: 1;
}

.scoring-grid td[b-in9vpfei29]  .form-control:focus {
    outline: 2px solid var(--rally-red);
    outline-offset: -2px;
    background: var(--rally-red-glow);
    box-shadow: none;
}

/* Read-only display values (no input, just text). */
.cell-ro[b-in9vpfei29] {
    display: block;
    width: 100%;
    height: 100%;
    line-height: 28px;
    font-family: var(--font-mono);
    font-size: 10.5px;
    color: inherit;
}

/* §6.3 / §6.6 / §11.4.4 cell classification indicator. The literal DNS / DNF /
   ELT text, rendered in the SAME monospace font and size as a time value so it
   reads as a first-class cell value. Orange (bronze) text; the orange cell
   background comes from .cell-classification-box on the td. */
/* Combined check-in-time + label box. Single 28px-high row: the time (when
   present) reads in the normal cell colour for legibility; the DNS/DNF/ELT
   label sits beside it in bronze. */
.cell-classification[b-in9vpfei29] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    width: 100%;
    height: 28px;
    font-family: var(--font-mono);
    font-size: 10.5px;
    pointer-events: none;
}

.cell-classification .cls-time[b-in9vpfei29] {
    color: var(--fg);
}

.cell-classification .cls-label[b-in9vpfei29] {
    font-weight: 700;
    letter-spacing: 0.5px;
    color: var(--bronze);
    text-transform: uppercase;
}

/* Orange background for the DNS / DNF / ELT indicator cell — distinct from the
   yellow "no time recorded" empty-TC state. Uses a stronger bronze tint than
   the faint --bronze-glow token so the box clearly reads as orange. */
.scoring-grid tbody td.cell-classification-box[b-in9vpfei29] {
    background: rgba(184, 92, 56, 0.30) !important;
    color: var(--bronze);
}

/* §11.4.2 early-check-in column annotation. Yellow secondary line under the
   TC code so operators can see at a glance which TCs have relaxed timing. */
.hdr-early-checkin[b-in9vpfei29] {
    margin-top: 1px;
    font-size: 0.65rem;
    font-weight: normal;
    line-height: 1;
    color: var(--amber);
    letter-spacing: 0.2px;
}

/* ── Comment indicator (Excel-style corner triangle) ────────────────────── */

.note-indicator[b-in9vpfei29] {
    position: absolute;
    top: 0;
    right: 0;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 8px 8px 0;
    border-color: transparent var(--amber) transparent transparent;
    pointer-events: none;
    z-index: 2;
}

/* ── Modal overlays (popover style) ─────────────────────────────────────── */

.pa-comment-overlay[b-in9vpfei29] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 1050;
    display: flex;
    align-items: center;
    justify-content: center;
}

.pa-comment-box[b-in9vpfei29] {
    background: var(--bg-surface);
    color: var(--fg);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    padding: 1.25rem;
    min-width: 22rem;
    max-width: 30rem;
    box-shadow: var(--shadow-2);
}
/* /Components/Pages/EventEntries.razor.rz.scp.css */
/* =========================================================================
   Public entry list — /events/{slug}/entries
   Mockup reference: docs/rallytrack-mockups.html section #entries (lines
   ~2190–2283). Toolbar with class filter chips, dark table with the
   manufacturer-logo column next to vehicle make/model.
   ========================================================================= */

.rt-entries-head[b-nokmd26h9h] {
    display: flex;
    align-items: center;
    gap: var(--s-4);
    margin-bottom: var(--s-5);
}

.rt-entries-head h1[b-nokmd26h9h] {
    font-size: 28px;
    text-transform: uppercase;
    letter-spacing: 0.02em;
    margin: 0;
}

.rt-entries-back[b-nokmd26h9h] {
    font-family: var(--font-display);
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--fg-muted);
    text-decoration: none;
    padding: 6px 12px;
    border: 1px solid var(--line);
    border-radius: var(--r-md);
}

.rt-entries-back:hover[b-nokmd26h9h] {
    color: var(--fg);
    background: var(--bg-elevated);
    text-decoration: none;
}

.rt-entries-panel[b-nokmd26h9h] {
    background: var(--bg-surface);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    overflow: hidden;
}

.rt-entries-toolbar[b-nokmd26h9h] {
    padding: var(--s-4) var(--s-5);
    display: flex;
    flex-wrap: wrap;
    gap: var(--s-3);
    align-items: center;
    border-bottom: 1px solid var(--line);
    background: var(--bg-elevated);
}

.rt-entries-filter-label[b-nokmd26h9h] {
    font-family: var(--font-display);
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--fg-muted);
}

.rt-entries-count[b-nokmd26h9h] {
    margin-left: auto;
    font-family: var(--font-mono);
    font-size: 12px;
    color: var(--fg-muted);
}

/* Toolbar buttons reuse the rt-toolbar-btn rules from rallytrack.css; here
   we just need to override the default cursor + display behaviour for
   anchor-based variants. */
.rt-toolbar-btn[b-nokmd26h9h] {
    padding: 4px 10px;
    font-family: var(--font-display);
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--fg-muted);
    background: var(--bg-base);
    border: 1px solid var(--line-strong);
    border-radius: var(--r-md);
    cursor: pointer;
    text-decoration: none;
    display: inline-block;
}

.rt-toolbar-btn:hover[b-nokmd26h9h] {
    color: var(--fg);
    background: var(--bg-elevated-2);
    text-decoration: none;
}

.rt-toolbar-btn.active[b-nokmd26h9h] {
    background: var(--rally-red);
    border-color: var(--rally-red);
    color: white;
}

.rt-toolbar-btn.active:hover[b-nokmd26h9h] {
    background: var(--rally-red-dim);
    border-color: var(--rally-red-dim);
    color: white;
}

.rt-entries-empty[b-nokmd26h9h] {
    padding: var(--s-5);
    color: var(--fg-muted);
    margin: 0;
}

.rt-entries-table[b-nokmd26h9h] {
    width: 100%;
    border-collapse: collapse;
    font-family: var(--font-body);
    font-size: 13px;
}

.rt-entries-table thead th[b-nokmd26h9h] {
    padding: var(--s-3) var(--s-4);
    text-align: left;
    font-family: var(--font-display);
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--fg-muted);
    background: var(--bg-elevated);
    border-bottom: 1px solid var(--line);
}

.rt-entries-table thead th.col-car[b-nokmd26h9h]       { width: 60px; }
.rt-entries-table thead th.col-carclass[b-nokmd26h9h]  { width: 90px; }
.rt-entries-table thead th.col-classes[b-nokmd26h9h]   { min-width: 200px; }

.rt-entries-table tbody td[b-nokmd26h9h] {
    padding: var(--s-3) var(--s-4);
    border-top: 1px solid var(--line);
    vertical-align: middle;
}

.rt-entries-table tbody td.col-car[b-nokmd26h9h] {
    font-weight: 600;
}

.rt-entries-table tbody td.col-car a[b-nokmd26h9h] {
    color: var(--fg);
    text-decoration: none;
}

.rt-entries-table tbody td.col-car a:hover[b-nokmd26h9h] {
    color: var(--rally-red);
    text-decoration: none;
}

.rt-entries-driver[b-nokmd26h9h] {
    color: var(--fg);
    font-weight: 500;
}

.rt-entries-nav[b-nokmd26h9h] {
    color: var(--fg-muted);
}

.rt-entries-vehicle[b-nokmd26h9h] {
    color: var(--fg);
}

.rt-entries-carclass[b-nokmd26h9h] {
    font-family: var(--font-mono);
    color: var(--fg-muted);
    font-size: 12px;
}

/* Competition-class chips render as separated pills so multiple
   memberships are visually distinct rather than blending into one
   uppercase string. */
.rt-entries-class-list[b-nokmd26h9h] {
    display: flex;
    flex-wrap: wrap;
    gap: 4px 6px;
}

.rt-entries-class[b-nokmd26h9h] {
    display: inline-block;
    padding: 2px 8px;
    background: var(--bg-elevated);
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    font-family: var(--font-display);
    color: var(--cyan);
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    white-space: nowrap;
}

.rt-entries-class-empty[b-nokmd26h9h] {
    background: transparent;
    border: none;
    color: var(--fg-faint);
    padding: 0;
}

.rt-entries-entrant[b-nokmd26h9h] {
    color: var(--fg-muted);
}
/* /Components/Pages/Home.razor.rz.scp.css */
/* =========================================================================
   Public landing page — §10.2 v2.13.4 two-column layout.
   Calendar sidebar (left, ~360px) + hero card (right, flex). Mobile collapses
   to single column with hero on top.
   Visual reference: docs/rallytrack-mockups.html #landing section.
   Hero card uses the .event-card / .event-banner primitives from
   wwwroot/css/rallytrack.css.
   ========================================================================= */

.rt-landing[b-0r44dtm9lc] {
    display: grid;
    grid-template-columns: 360px 1fr;
    gap: var(--s-5);
    align-items: stretch;
}

/* Mobile per §10.2: hero first, calendar below. */
@media (max-width: 720px) {
    .rt-landing[b-0r44dtm9lc] {
        grid-template-columns: 1fr;
    }
    .rt-landing-hero[b-0r44dtm9lc] { order: 1; }
    .rt-landing-cal[b-0r44dtm9lc]  { order: 2; }
}

/* ── Calendar sidebar ───────────────────────────────────────────────────── */

.rt-landing-cal[b-0r44dtm9lc] {
    background: var(--bg-surface);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    padding: var(--s-4);
    display: flex;
    flex-direction: column;
    /* Match the hero card height so the two columns align visually at the
       top. Internal scroll if content overflows. */
    max-height: 520px;
    overflow-y: auto;
}

.rt-landing-cal-head[b-0r44dtm9lc] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: var(--s-3);
    margin-bottom: var(--s-3);
    border-bottom: 1px solid var(--line);
    flex-shrink: 0;
    position: sticky;
    top: calc(-1 * var(--s-4));
    background: var(--bg-surface);
    z-index: 1;
}

.rt-cal-year[b-0r44dtm9lc] {
    font-family: var(--font-display);
    font-weight: 600;
    font-size: 18px;
}

.rt-cal-nav[b-0r44dtm9lc] {
    background: transparent;
    border: none;
    color: var(--fg-muted);
    cursor: pointer;
    padding: 4px 8px;
    font-size: 18px;
    line-height: 1;
    border-radius: var(--r-sm);
}

.rt-cal-nav:hover:not([disabled])[b-0r44dtm9lc] {
    color: var(--fg);
    background: var(--bg-elevated);
}

.rt-cal-nav[disabled][b-0r44dtm9lc] {
    color: var(--fg-dim);
    cursor: not-allowed;
}

.rt-cal-list[b-0r44dtm9lc] {
    display: flex;
    flex-direction: column;
}

.rt-cal-empty[b-0r44dtm9lc] {
    color: var(--fg-muted);
    font-size: 13px;
    text-align: center;
    padding: var(--s-4) 0;
    margin: 0;
}

/* One event row in the calendar. Grid: date | body | status. */
.rt-cal-row[b-0r44dtm9lc] {
    display: grid;
    grid-template-columns: 60px 1fr auto;
    gap: var(--s-3);
    align-items: center;
    padding: var(--s-3) 0;
    border-bottom: 1px solid var(--line);
    text-decoration: none;
    color: var(--fg);
    /* Default upcoming row stays at full opacity. */
}

.rt-cal-row:hover[b-0r44dtm9lc] {
    text-decoration: none;
    color: var(--fg);
    background: var(--bg-elevated);
}

.rt-cal-row:last-child[b-0r44dtm9lc] {
    border-bottom: none;
}

/* §10.2: past events render at ~70% opacity. Decorative dimming only — the
   row remains clickable. */
.rt-cal-row.is-past[b-0r44dtm9lc] {
    opacity: 0.7;
}

/* Live event row gets a subtle red wash to make it the loudest line in the
   calendar. */
.rt-cal-row.is-live[b-0r44dtm9lc] {
    background: rgba(225, 35, 44, 0.06);
    border-radius: var(--r-sm);
    margin: 2px 0;
    padding-left: var(--s-2);
    padding-right: var(--s-2);
}

.rt-cal-row.is-live .rt-cal-date[b-0r44dtm9lc],
.rt-cal-row.is-live .rt-cal-name[b-0r44dtm9lc] {
    color: var(--fg);
    font-weight: 700;
}

.rt-cal-date[b-0r44dtm9lc] {
    color: var(--fg-muted);
    font-size: 12px;
}

.rt-cal-body[b-0r44dtm9lc] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.rt-cal-name[b-0r44dtm9lc] {
    font-family: var(--font-display);
    font-weight: 600;
    font-size: 14px;
    color: var(--fg);
}

.rt-cal-loc[b-0r44dtm9lc] {
    color: var(--fg-dim);
    font-size: 12px;
    font-family: var(--font-mono);
}

.rt-cal-status[b-0r44dtm9lc] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 11px;
    font-family: var(--font-mono);
}

/* "Live now" label inherits the rally-red colour from the live-dot context. */
.rt-cal-row.is-live .rt-cal-status[b-0r44dtm9lc] {
    color: var(--rally-red);
    font-weight: 600;
}

/* "Live in N min" dot — non-pulsing red, signals imminence without the
   visual noise of a pulse. */
.rt-cal-dot[b-0r44dtm9lc] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    display: inline-block;
}

.rt-cal-dot-soon[b-0r44dtm9lc] {
    background: var(--rally-red);
}

/* Status badges per §10.2. Same shape; colour family differs. */
.rt-cal-badge[b-0r44dtm9lc] {
    padding: 2px 8px;
    border-radius: var(--r-sm);
    font-size: 11px;
    font-family: var(--font-mono);
}

.rt-cal-badge-final[b-0r44dtm9lc] {
    background: rgba(43, 182, 115, 0.15);
    color: var(--green);
}

.rt-cal-badge-prov[b-0r44dtm9lc] {
    background: rgba(244, 162, 26, 0.16);
    color: var(--amber);
}

/* ── Hero card ──────────────────────────────────────────────────────────── */

.rt-landing-hero[b-0r44dtm9lc] {
    display: flex;
    flex-direction: column;
    min-height: 480px;
}

.rt-landing-hero[b-0r44dtm9lc]  .event-card {
    flex: 1;
    display: flex;
    flex-direction: column;
}

.rt-landing-hero[b-0r44dtm9lc]  .event-banner {
    flex: 1;
}

/* CTAs row at the bottom of the hero card. flex-wrap keeps the long
   "View provisional results" CTA from forcing the row wider than the hero
   card on narrow viewports (which clipped the button off the screen edge). */
.rt-hero-actions[b-0r44dtm9lc] {
    padding: var(--s-4);
    display: flex;
    flex-wrap: wrap;
    gap: var(--s-3);
    justify-content: flex-end;
    border-top: 1px solid var(--line);
    background: var(--bg-elevated);
}

/* Narrow screens: stack the CTAs full-width so neither button clips and the
   tap targets are comfortable. */
@media (max-width: 520px) {
    .rt-hero-actions[b-0r44dtm9lc] {
        flex-direction: column;
        align-items: stretch;
    }

    .rt-hero-actions[b-0r44dtm9lc]  .button {
        justify-content: center;
    }
}

.rt-hero-actions[b-0r44dtm9lc]  .button {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 9px 16px;
    background: var(--bg-elevated);
    border: 1px solid var(--line-strong);
    color: var(--fg);
    font-family: var(--font-display);
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    border-radius: var(--r-md);
    text-decoration: none;
    cursor: pointer;
}

.rt-hero-actions[b-0r44dtm9lc]  .button:hover {
    background: var(--bg-elevated-2);
    color: var(--fg);
    text-decoration: none;
}

.rt-hero-actions[b-0r44dtm9lc]  .button-primary {
    background: var(--rally-red);
    border-color: var(--rally-red);
    color: white;
}

.rt-hero-actions[b-0r44dtm9lc]  .button-primary:hover {
    background: var(--rally-red-dim);
    border-color: var(--rally-red-dim);
    color: white;
}

.rt-hero-cta-live[b-0r44dtm9lc] {
    /* Live CTA in particular benefits from the pulsing-dot prefix so the
       visual language matches the chrome countdown + map-tab dot. */
}

/* Empty-state hero — quiet welcome when nothing live or recent exists. */
.rt-hero-empty[b-0r44dtm9lc] {
    background: var(--bg-surface);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    padding: var(--s-6);
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    color: var(--fg-muted);
}

.rt-hero-empty h2[b-0r44dtm9lc] {
    font-family: var(--font-display);
    font-size: 22px;
    margin: 0 0 var(--s-3);
    color: var(--fg);
}

.rt-hero-empty p[b-0r44dtm9lc] {
    font-size: 14px;
    margin: 0;
    line-height: 1.5;
}

/* ── Hero podium (Recent variant only) ──────────────────────────────────── */

.rt-hero-podium[b-0r44dtm9lc] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--s-3);
    margin-top: var(--s-5);
}

.rt-hero-podium-box[b-0r44dtm9lc] {
    padding: var(--s-3);
    border-radius: var(--r-sm);
    border-left: 3px solid transparent;
}

.rt-hero-podium-pos-1[b-0r44dtm9lc] {
    background: rgba(244, 162, 26, 0.10);
    border-left-color: var(--amber);
}

.rt-hero-podium-pos-2[b-0r44dtm9lc] {
    background: rgba(184, 193, 206, 0.08);
    border-left-color: #b8c1ce;
}

/* v2.13.4: bronze hex changed from #c08552 → #b85c38 (warm copper-red,
   clearly distinct from amber-gold of pos 1). See PR 4 for the global
   token consolidation. */
.rt-hero-podium-pos-3[b-0r44dtm9lc] {
    background: rgba(184, 92, 56, 0.10);
    border-left-color: var(--bronze);
}

.rt-hero-podium-head[b-0r44dtm9lc] {
    display: flex;
    align-items: baseline;
    gap: var(--s-2);
    margin-bottom: 4px;
}

.rt-hero-podium-num[b-0r44dtm9lc] {
    font-family: var(--font-display);
    font-size: 22px;
    font-weight: 700;
}

.rt-hero-podium-pos-1 .rt-hero-podium-num[b-0r44dtm9lc] { color: var(--amber); }
.rt-hero-podium-pos-2 .rt-hero-podium-num[b-0r44dtm9lc] { color: #b8c1ce; }
.rt-hero-podium-pos-3 .rt-hero-podium-num[b-0r44dtm9lc] { color: var(--bronze); }

.rt-hero-podium-car[b-0r44dtm9lc] {
    font-weight: 600;
    color: var(--fg-muted);
    font-size: 12px;
}

.rt-hero-podium-crew[b-0r44dtm9lc] {
    font-family: var(--font-display);
    font-weight: 600;
    font-size: 13px;
    color: var(--fg);
}

.rt-hero-podium-time[b-0r44dtm9lc] {
    color: var(--fg-muted);
    font-size: 12px;
    margin-top: 2px;
}

/* ── Hero status badges (Recent variant) ────────────────────────────────── */

.rt-status-final[b-0r44dtm9lc] {
    background: rgba(43, 182, 115, 0.20) !important;
    color: var(--green) !important;
}

.rt-status-pending[b-0r44dtm9lc] {
    background: rgba(244, 162, 26, 0.20) !important;
    color: var(--amber) !important;
}