/* /Components/Components/QrScanButton.razor.rz.scp.css */
/* Camera preview + QR targeting reticle for the Scan QR flow. */

.qr-scanner[b-b5ubt0nx4k] {
    position: relative;
    width: 100%;
    max-width: 400px;
    max-height: 300px;
    overflow: hidden;
    border-radius: 0.375rem;
    background: #000;
}

.qr-scanner video[b-b5ubt0nx4k] {
    display: block;
    width: 100%;
    max-height: 300px;
    object-fit: cover;
}

/* Centered square with a big translucent outer shadow — the classic "aim here" reticle. */
.qr-reticle[b-b5ubt0nx4k] {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 60%;
    aspect-ratio: 1;
    transform: translate(-50%, -50%);
    border: 3px solid rgba(255, 255, 255, 0.9);
    border-radius: 12px;
    box-shadow: 0 0 0 1000px rgba(0, 0, 0, 0.4);
    pointer-events: none;
}
/* /Components/Layout/MainLayout.razor.rz.scp.css */
.top-bar[b-oqpf87cx21] {
    min-height: 100dvh;
    display: flex;
    flex-direction: column;
}

.logo[b-oqpf87cx21] {
    max-height: 42px;
}
/* /Components/Layout/NavMainLayout.razor.rz.scp.css */
.nav-logo[b-xnekufy9ot] {
    max-height: 25px;
}

[b-xnekufy9ot] .nav-item {
    font-size: 0.9rem;
    padding-bottom: 0.5rem;
    color: grey;
}

    [b-xnekufy9ot] .nav-item:first-of-type {
        padding-top: 1rem;
    }

    [b-xnekufy9ot] .nav-item:last-of-type {
        padding-bottom: 1rem;
    }

    [b-xnekufy9ot] .nav-item a {
        color: rgba(33,37,41,1);
        border-radius: 0.5rem;
        height: 3rem;
        display: flex;
        align-items: center;
        line-height: 3rem;
        padding: 0.5rem;
    }

        [b-xnekufy9ot] .nav-item a.active {
            background-color: rgba(33,37,41,1);
            color: var(--our-orange);
        }

        [b-xnekufy9ot] .nav-item a:hover {
            background-color: rgba(33,37,41,1);
            color: white;
        }

[b-xnekufy9ot] .nav-section-header {
    font-size: 0.7rem;
    font-weight: 600;
    letter-spacing: 0.05em;
    border-top: 1px solid rgba(33,37,41,0.1);
    padding-top: 0.75rem;
}
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-foo4poyc28],
.components-reconnect-repeated-attempt-visible[b-foo4poyc28],
.components-reconnect-failed-visible[b-foo4poyc28],
.components-pause-visible[b-foo4poyc28],
.components-resume-failed-visible[b-foo4poyc28],
.components-rejoining-animation[b-foo4poyc28] {
    display: none;
}

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


#components-reconnect-modal[b-foo4poyc28] {
    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-foo4poyc28 0.5s both;
    &[open]

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

}

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

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

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

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

    100% {
        opacity: 1;
    }
}

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

    100% {
        opacity: 0;
    }
}

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

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

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

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

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

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

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

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

@keyframes components-rejoining-animation-b-foo4poyc28 {
    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/Modals/ParticipantTileModal.razor.rz.scp.css */
.participant-tile[b-d1kvz4qjyx] {
    min-height: 7rem;
    transition: transform 0.05s ease-in-out;
}

.participant-tile:active[b-d1kvz4qjyx] {
    transform: scale(0.97);
}

.participant-tile-bib[b-d1kvz4qjyx] {
    font-size: 2.5rem;
}

@media (min-width: 768px) {
    .participant-tile-bib[b-d1kvz4qjyx] {
        font-size: 3rem;
    }
}
/* /Components/Pages/EventManagementPages/Admin/GunStartClocks.razor.rz.scp.css */
/* Race clocks: a responsive row of cards, the face large and tabular so the digits don't jitter as they
   tick, the gun time and categories under it. A clock still counting down is muted; a running one is
   emphasised with the success colour on its edge. */
.gun-clocks[b-zd3hcekn9u] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr));
    gap: 0.75rem;
}

.gun-clock .card-body[b-zd3hcekn9u] {
    padding: 0.75rem 1rem;
}

.gun-clock-running[b-zd3hcekn9u] {
    border-color: var(--bs-success);
    border-width: 2px;
}

.gun-clock-face[b-zd3hcekn9u] {
    font-size: 2.25rem;
    font-weight: 700;
    line-height: 1.1;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.gun-clock-pending .gun-clock-face[b-zd3hcekn9u] {
    color: var(--bs-secondary-color);
}

.gun-clock-sign[b-zd3hcekn9u] {
    margin-right: 0.15em;
}

.gun-clock-meta[b-zd3hcekn9u] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.8rem;
    color: var(--bs-secondary-color);
    margin-top: 0.25rem;
}

.gun-clock-state[b-zd3hcekn9u] {
    text-transform: uppercase;
    letter-spacing: 0.02em;
}

.gun-clock-gun[b-zd3hcekn9u] {
    font-variant-numeric: tabular-nums;
}

.gun-clock-categories[b-zd3hcekn9u] {
    margin-top: 0.25rem;
    font-weight: 500;
    overflow-wrap: anywhere;
}

/* Display-board mode: faces a step larger to read from across a tent; everything else stays compact so
   the strip doesn't eat the feed's room. */
.gun-clocks-display[b-zd3hcekn9u] {
    grid-template-columns: repeat(auto-fit, minmax(17rem, 1fr));
    gap: 0.5rem;
}

.gun-clocks-display .gun-clock .card-body[b-zd3hcekn9u] {
    padding: 0.5rem 0.9rem;
}

.gun-clocks-display .gun-clock-face[b-zd3hcekn9u] {
    font-size: 3rem;
}

.gun-clocks-display .gun-clock-meta[b-zd3hcekn9u],
.gun-clocks-display .gun-clock-categories[b-zd3hcekn9u] {
    font-size: 0.95rem;
}
/* /Components/Pages/EventManagementPages/Admin/LiveActivityFeed.razor.rz.scp.css */
/* Headline tiles: a responsive row of equal cards, the number large and the label under it. Tiles that
   need a human (unmatched tags, conflicts) pick up an amber edge only while their count is non-zero. */
.stat-tiles[b-wcstzwn78e] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr));
    gap: 0.75rem;
}

.stat-tile .card-body[b-wcstzwn78e] {
    padding: 0.75rem 1rem;
}

.stat-value[b-wcstzwn78e] {
    font-size: 1.75rem;
    font-weight: 600;
    line-height: 1.1;
    font-variant-numeric: tabular-nums;
}

.stat-label[b-wcstzwn78e] {
    font-size: 0.8rem;
    color: var(--bs-secondary-color);
    text-transform: uppercase;
    letter-spacing: 0.02em;
}

.stat-tile-attention[b-wcstzwn78e] {
    border-color: var(--bs-warning);
    border-width: 2px;
}

/* Every clock stamp in the feed is the same width and weight so the time column reads as one column. */
.feed-time[b-wcstzwn78e] {
    font-variant-numeric: tabular-nums;
    font-weight: 600;
    font-size: 0.9rem;
}

.feed-note[b-wcstzwn78e] {
    max-width: 40rem;
    overflow-wrap: anywhere;
}

/* The "running" badge carries a pulsing dot so a glance says live. */
.live-status-badge[b-wcstzwn78e] {
    font-size: 0.85rem;
    font-weight: 500;
}

.live-dot[b-wcstzwn78e] {
    display: inline-block;
    width: 0.5rem;
    height: 0.5rem;
    border-radius: 50%;
    background: currentColor;
    animation: live-pulse-b-wcstzwn78e 1.5s ease-in-out infinite;
}

@keyframes live-pulse-b-wcstzwn78e {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.3; }
}

/* ---- Display-board mode ----
   The feed is a flex column that fills whatever height its frame gives it (LiveDisplayPage gives it
   the viewport minus a slim header). The status strip, tiles and filters keep their natural height;
   the table box takes the rest and scrolls on its own with a sticky header, so the newest rows —
   which are at the top — never scroll out of view. Type is a step larger to read from across a tent. */
.feed-display[b-wcstzwn78e] {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    min-height: 0;
}

.feed-display .feed-table-box[b-wcstzwn78e] {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
}

.feed-display .live-feed thead th[b-wcstzwn78e] {
    position: sticky;
    top: 0;
    z-index: 1;
    background: var(--bs-body-bg);
}

.feed-display .live-feed[b-wcstzwn78e] {
    font-size: 1.05rem;
}

.feed-display .feed-time[b-wcstzwn78e] {
    font-size: 1.05rem;
}

.feed-display .stat-tiles[b-wcstzwn78e] {
    grid-template-columns: repeat(auto-fit, minmax(7.5rem, 1fr));
    gap: 0.5rem;
}

.feed-display .stat-tile .card-body[b-wcstzwn78e] {
    padding: 0.4rem 0.75rem;
}

.feed-display .stat-value[b-wcstzwn78e] {
    font-size: 1.5rem;
}
/* /Components/Pages/EventManagementPages/Admin/LiveDisplayPage.razor.rz.scp.css */
/* The board owns the whole viewport: a slim header, then the feed takes every remaining pixel and
   scrolls inside itself (see LiveActivityFeed.razor.css, .feed-display). */
.board[b-clok9291sp] {
    height: 100dvh;
    display: flex;
    flex-direction: column;
    padding: 0.5rem clamp(0.5rem, 0.3rem + 0.6vw, 1rem);
}

.board-head[b-clok9291sp] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 0.5rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid var(--bs-border-color);
}

.board-title[b-clok9291sp] {
    flex: 1 1 auto;
    min-width: 0;
    margin: 0;
    font-size: 1.1rem;
    font-weight: 700;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.board-body[b-clok9291sp] {
    flex: 1 1 auto;
    min-height: 0;
    /* A flex column, so the feed inside can take the height as a flex item rather than relying on a
       percentage height, which does not resolve against a flex item's auto height. */
    display: flex;
    flex-direction: column;
}
/* /Components/Pages/EventManagementPages/Admin/ReaderGateStatus.razor.rz.scp.css */
/* Per-gate chips: name, then the age large enough to read at a glance, then the clock time and count
   small. A gate with no reads yet is muted. */
.gate-strip[b-gwrqu992pl] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.gate-chip[b-gwrqu992pl] {
    display: flex;
    flex-direction: column;
    min-width: 11rem;
    padding: 0.4rem 0.75rem;
    border: 1px solid var(--bs-border-color);
    border-radius: var(--bs-border-radius);
    background: var(--bs-body-bg);
}

.gate-chip-idle[b-gwrqu992pl] {
    color: var(--bs-secondary-color);
}

.gate-chip-name[b-gwrqu992pl] {
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.02em;
    color: var(--bs-secondary-color);
}

.gate-chip-age[b-gwrqu992pl] {
    font-size: 1.1rem;
    font-weight: 600;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}

.gate-chip-detail[b-gwrqu992pl] {
    font-size: 0.8rem;
    color: var(--bs-secondary-color);
    font-variant-numeric: tabular-nums;
}

/* Display-board mode: a step larger, like the tiles. */
.gate-strip-display .gate-chip-age[b-gwrqu992pl] {
    font-size: 1.4rem;
}

.gate-strip-display .gate-chip-name[b-gwrqu992pl],
.gate-strip-display .gate-chip-detail[b-gwrqu992pl] {
    font-size: 0.9rem;
}
/* /Components/Pages/EventManagementPages/AgeBreakdownPage.razor.rz.scp.css */
/* The colour chip beside a group's name, in both the picker and the age-range list, so a row can be
   matched to its curve/bars at a glance. Sized to sit on the text baseline of a normal label. */
.series-swatch[b-nkmm6rg0yn] {
    display: inline-block;
    width: 0.65rem;
    height: 0.65rem;
    border-radius: 2px;
    margin-right: 0.35rem;
    vertical-align: baseline;
}
/* /Components/Pages/EventManagementPages/EventDashoardPage.razor.rz.scp.css */
/* Category Registrations: the expected / total badge pair. Both badges get the same fixed width —
   sized for three digits, so a four-digit count widens its own pill — with tabular figures so every
   digit is the same advance width. That keeps the two badge columns lined up down the card for the
   field sizes we actually see. */
.count-badge[b-cj7e4fgbpi] {
    min-width: 2.5rem;
    text-align: center;
    font-variant-numeric: tabular-nums;
}
/* /Components/Pages/EventManagementPages/Finance/FinanceDiscountCodesPage.razor.rz.scp.css */
/* Typography for the Finance discount-code report. Deliberately the same voice as FinanceSummaryPage
   (small-caps section head, medium-weight label, light italic note, hairline meter) so the two Finance tabs
   read as one screen — redeclared rather than shared because Blazor scoped CSS is per-component. */

.finance-section-title[b-3f22cpq0dz] {
    font-size: .78rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .08em;
    padding-bottom: .5rem;
    margin-bottom: .25rem;
    border-bottom: 2px solid var(--bs-border-color);
}

.finance-label[b-3f22cpq0dz] {
    font-weight: 500;
}

/* The explanatory line under a label or heading: smaller, lighter and italic so it reads as an aside
   rather than a second label. */
.finance-note[b-3f22cpq0dz] {
    font-size: .75rem;
    font-style: italic;
    line-height: 1.25;
    color: var(--bs-secondary-color);
}

/* The four headline figures. Money is the point of the page, so it gets the tallest type on it; tabular
   figures keep the column aligned as amounts grow. */
.finance-figure[b-3f22cpq0dz] {
    display: flex;
    flex-direction: column;
    gap: .15rem;
    height: 100%;
    padding: .85rem 1rem;
    background: var(--bs-tertiary-bg);
    border: 1px solid var(--bs-border-color);
    border-radius: .5rem;
}

.finance-figure-label[b-3f22cpq0dz] {
    font-size: .72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: var(--bs-secondary-color);
}

/* The figures share a row, so a five-digit amount has to shrink rather than spill out of its tile —
   hence clamp() instead of a fixed size, with a wrap as the last resort. */
.finance-figure-value[b-3f22cpq0dz] {
    font-size: clamp(1.15rem, 1.15vw + .75rem, 1.6rem);
    font-weight: 700;
    line-height: 1.1;
    letter-spacing: -.02em;
    font-variant-numeric: tabular-nums;
    overflow-wrap: anywhere;
}

/* The closing line of a card or table — heavier, and separated from the rows above. */
.finance-total[b-3f22cpq0dz] {
    border-top: 2px solid var(--bs-border-color);
}

    .finance-total .finance-label[b-3f22cpq0dz] {
        font-weight: 700;
        font-size: 1.05rem;
    }

/* Hairline share-of-total meter under a table row's name, so two amounts can be compared without
   reading them. */
.finance-bar[b-3f22cpq0dz] {
    display: flex;
    height: .25rem;
    max-width: 18rem;
    margin-top: .4rem;
    border-radius: 2px;
    overflow: hidden;
    background: var(--bs-secondary-bg);
}

    .finance-bar > span[b-3f22cpq0dz] {
        display: block;
        height: 100%;
    }

.meter-neutral[b-3f22cpq0dz] {
    background: var(--bs-primary);
}

/* Money columns line up: tabular figures keep $9.00 and $19.00 the same width. */
td.text-end[b-3f22cpq0dz],
th.text-end[b-3f22cpq0dz] {
    font-variant-numeric: tabular-nums;
}
/* /Components/Pages/EventManagementPages/Finance/FinanceSummaryPage.razor.rz.scp.css */
/* Typography for the Finance summary. Same voice as the Roster Summary card (small-caps section head,
   medium-weight label, light italic note, hairline meter) so the two summary screens read as siblings —
   but the styles are redeclared here rather than shared, because Blazor scoped CSS is per-component. */

.finance-section-title[b-6rp97aeuif] {
    font-size: .78rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .08em;
    padding-bottom: .5rem;
    margin-bottom: .25rem;
    border-bottom: 2px solid var(--bs-border-color);
}

.finance-label[b-6rp97aeuif] {
    font-weight: 500;
}

/* The explanatory line under a label or heading: smaller, lighter and italic so it reads as an aside
   rather than a second label. */
.finance-note[b-6rp97aeuif] {
    font-size: .75rem;
    font-style: italic;
    line-height: 1.25;
    color: var(--bs-secondary-color);
}

/* The four headline figures. Money is the point of the page, so it gets the tallest type on it; tabular
   figures keep the column aligned as amounts grow. */
.finance-figure[b-6rp97aeuif] {
    display: flex;
    flex-direction: column;
    gap: .15rem;
    height: 100%;
    padding: .85rem 1rem;
    background: var(--bs-tertiary-bg);
    border: 1px solid var(--bs-border-color);
    border-radius: .5rem;
}

.finance-figure-label[b-6rp97aeuif] {
    font-size: .72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: var(--bs-secondary-color);
}

/* The figures share a row, so a five-digit amount has to shrink rather than spill out of its tile —
   hence clamp() instead of a fixed size, with a wrap as the last resort. */
.finance-figure-value[b-6rp97aeuif] {
    font-size: clamp(1.15rem, 1.15vw + .75rem, 1.6rem);
    font-weight: 700;
    line-height: 1.1;
    letter-spacing: -.02em;
    font-variant-numeric: tabular-nums;
    overflow-wrap: anywhere;
}

/* The closing line of a card or table — heavier, and separated from the rows above. */
.finance-total[b-6rp97aeuif] {
    border-top: 2px solid var(--bs-border-color);
}

    .finance-total .finance-label[b-6rp97aeuif] {
        font-weight: 700;
        font-size: 1.05rem;
    }

/* Hairline share-of-total meter under a table row's name, so two amounts can be compared without
   reading them. */
.finance-bar[b-6rp97aeuif] {
    display: flex;
    height: .25rem;
    max-width: 18rem;
    margin-top: .4rem;
    border-radius: 2px;
    overflow: hidden;
    background: var(--bs-secondary-bg);
}

    .finance-bar > span[b-6rp97aeuif] {
        display: block;
        height: 100%;
    }

.meter-neutral[b-6rp97aeuif] {
    background: var(--bs-primary);
}

/* Money columns line up: tabular figures keep $9.00 and $19.00 the same width. */
td.text-end[b-6rp97aeuif],
th.text-end[b-6rp97aeuif] {
    font-variant-numeric: tabular-nums;
}
/* /Components/Pages/EventManagementPages/Roster/RosterDetailPage.razor.rz.scp.css */
/* Every crossing time on the page renders alike (the Conflicts page's .conflict-stamp), so the reads read as
   one column of times. Sized in rem so a stamp inside a .small parent matches one outside it. */
.crossing-stamp[b-peffdm3vy9] {
    font-size: 0.875rem;
    font-weight: 700;
}
/* /Components/Pages/EventManagementPages/Roster/RosterSummaryPage.razor.rz.scp.css */
/* Typography for the summary card. The three sections carry a lot of near-identical numbers, so the
   hierarchy does the work: a small uppercase section head, a medium-weight label, a light italic note
   under it, and the count in a pill (blue by default, like the dashboard's category counts). The
   hairline meters below each line and the field-progress band up top turn those counts into
   proportions you can compare without reading them. */

.summary-section-title[b-j7t1orxba6] {
    font-size: .78rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .08em;
    padding-bottom: .5rem;
    margin-bottom: .25rem;
    border-bottom: 2px solid var(--bs-border-color);
}

.summary-label[b-j7t1orxba6] {
    font-weight: 500;
}

/* The explanatory line under each label: smaller, lighter and italic so it reads as an aside rather
   than a second label. */
.summary-note[b-j7t1orxba6] {
    font-size: .75rem;
    font-style: italic;
    line-height: 1.25;
    color: var(--bs-secondary-color);
}

/* Counts line up in a column: tabular figures keep 1 and 11 the same width. */
.summary-value[b-j7t1orxba6] {
    font-size: .85rem;
    font-variant-numeric: tabular-nums;
    min-width: 2.75rem;
}

/* The Total line closes out the Race Status section — heavier and separated from the rows above. */
.summary-total[b-j7t1orxba6] {
    border-top: 2px solid var(--bs-border-color);
    margin-top: .25rem;
}

    .summary-total .summary-label[b-j7t1orxba6] {
        font-weight: 700;
        font-size: 1.05rem;
    }

    .summary-total .summary-value[b-j7t1orxba6] {
        font-size: .95rem;
    }

/* Card-header controls: the label above the dropdown matches the section heads' small-caps voice. */
.summary-control-label[b-j7t1orxba6] {
    display: block;
    font-size: .72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: var(--bs-secondary-color);
    margin-bottom: .25rem;
}

.summary-stamp[b-j7t1orxba6] {
    font-size: .75rem;
    font-style: italic;
    color: var(--bs-secondary-color);
}

/* ── Meters ──────────────────────────────────────────────────────────────────
   One bar element, three sizes: the hairline under each line, the mini bars beside the hero's
   secondary figures, and the tall field-progress bar. Segments sit side by side so a bar can be
   stacked (finished + still running) without extra markup. */
.summary-bar[b-j7t1orxba6] {
    display: flex;
    height: .25rem;
    margin-top: .45rem;
    border-radius: 2px;
    overflow: hidden;
    background: var(--bs-secondary-bg);
}

    .summary-bar > span[b-j7t1orxba6] {
        display: block;
        height: 100%;
    }

.summary-bar-tall[b-j7t1orxba6] {
    height: .85rem;
    border-radius: 999px;
}

.summary-bar-caption[b-j7t1orxba6] {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    font-size: .75rem;
    color: var(--bs-secondary-color);
    margin-top: .35rem;
}

.meter-neutral[b-j7t1orxba6] {
    background: var(--bs-primary);
}

.meter-good[b-j7t1orxba6] {
    background: var(--bs-success);
}

.meter-attention[b-j7t1orxba6] {
    background: var(--bs-warning);
}

.meter-alert[b-j7t1orxba6] {
    background: var(--bs-danger);
}

.meter-muted[b-j7t1orxba6] {
    background: var(--bs-secondary-color);
}

/* A roll-up line (one whose count re-counts other rows in its section) is hatched rather than solid, so
   it doesn't read as another slice of the field. Drawn in currentColor so a tinted roll-up — the race-day
   amber on "No timing or partial" — hatches in its own tone. */
.meter-rollup[b-j7t1orxba6] {
    color: var(--bs-primary);
    background: repeating-linear-gradient(90deg, currentColor 0 3px, transparent 3px 7px);
    opacity: .75;
}

.meter-rollup.rollup-attention[b-j7t1orxba6] {
    color: var(--bs-warning);
}

/* ── Field progress band ─────────────────────────────────────────────────── */
.summary-hero[b-j7t1orxba6] {
    display: grid;
    grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
    gap: 1.5rem;
    align-items: center;
    padding: 1.1rem 1.25rem;
    background: var(--bs-tertiary-bg);
    border: 1px solid var(--bs-border-color);
    border-radius: .5rem;
}

@media (max-width: 991.98px) {
    .summary-hero[b-j7t1orxba6] {
        grid-template-columns: 1fr;
    }
}

.summary-hero-figure[b-j7t1orxba6] {
    font-size: 2.4rem;
    font-weight: 700;
    line-height: 1;
    letter-spacing: -.03em;
    font-variant-numeric: tabular-nums;
}

.summary-hero-of[b-j7t1orxba6] {
    font-size: .9rem;
    color: var(--bs-secondary-color);
}

.summary-hero-side[b-j7t1orxba6] {
    display: flex;
    flex-direction: column;
    gap: .55rem;
}

.summary-mini[b-j7t1orxba6] {
    display: flex;
    align-items: center;
    gap: .6rem;
    font-size: .8rem;
}

.summary-mini-label[b-j7t1orxba6] {
    min-width: 5.5rem;
    color: var(--bs-secondary-color);
}

.summary-mini .summary-bar[b-j7t1orxba6] {
    flex: 1;
    height: .35rem;
    margin-top: 0;
}

.summary-mini-value[b-j7t1orxba6] {
    min-width: 2.5rem;
    text-align: right;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}
/* /Components/Pages/EventManagementPages/Timing/CapturePage.razor.rz.scp.css */
.capture-btn[b-ullrq3plyw] {
    min-height: clamp(12rem, 35vh, 22rem);
    font-size: 1.75rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    border-radius: 1rem;
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
    transition: transform 0.05s ease-in-out;
}

.capture-btn:active[b-ullrq3plyw] {
    transform: scale(0.99);
}

.capture-btn i[b-ullrq3plyw] {
    font-size: 3.5rem;
}
/* /Components/Pages/EventManagementPages/Timing/ConflictsPage.razor.rz.scp.css */
/* One look for every timestamp on a conflict card — the start line and the crossings below — so the times
   read as a single consistent column.

   Sized in rem (not em) deliberately: the start stamp sits inside a .small parent while the crossing stamps
   sit at the card's base size, so a relative em would render them at different sizes. 0.875rem is the size
   Bootstrap's .small already gives the start line, which is the size we're matching everything to. */
.conflict-stamp[b-jcywwfrgq1] {
    font-size: 0.875rem;
    font-weight: 700;
}
/* /Components/Pages/EventManagementPages/Timing/GatesPage.razor.rz.scp.css */
/* There is one logical-gate table per category, stacked down the page. They are separate <table>
   elements sharing the same four columns, so with automatic layout each one sizes to its own
   content and no two line up. Pinning the widths makes them read as one grid. min-width keeps the
   columns honest on narrow screens; the wrapper scrolls instead of crushing the action buttons. */
.logical-gate-table[b-v9omow35un] {
    table-layout: fixed;
    min-width: 46rem;
}

.logical-gate-table td[b-v9omow35un] {
    overflow-wrap: anywhere;
}

.gate-col-name[b-v9omow35un] {
    width: 26%;
}

.gate-col-physical-gate[b-v9omow35un] {
    width: 42%;
}

.gate-col-order[b-v9omow35un] {
    width: 16%;
}

.gate-col-actions[b-v9omow35un] {
    width: 16%;
}

/* Right-align the progression number in its own fixed slot so the move up/down buttons sit at the
   same offset whether the order is 1 or 10. */
.gate-progression[b-v9omow35un] {
    display: inline-block;
    min-width: 1.25rem;
    text-align: right;
}

/* The physical-gate table is deliberately NOT part of that grid: it appears once, its columns mean
   different things, and its descriptions are long enough that a shared width would wrap them. It
   sizes to its own content and each row stays on one line; the responsive wrapper scrolls if the
   descriptions outgrow the card. */
.physical-gate-table th[b-v9omow35un],
.physical-gate-table td[b-v9omow35un] {
    white-space: nowrap;
}
