@import '_content/WorkflowEngine.Ai.Components/WorkflowEngine.Ai.Components.f8w5er05gr.bundle.scp.css';

/* /Components/Dashboard/DashboardSummary.razor.rz.scp.css */
/* ── Summary panel ─────────────────────────────────────────────────────── */

.summary-panel[b-tlvqr0ihne] {
    display: flex;
    gap: 1.5rem;
    align-items: end;
    padding: 1rem 1.25rem;
    background: rgba(255,255,255,0.04);
    border-radius: 12px;
    border: 1px solid rgba(255,255,255,0.08);
    flex-wrap: wrap;
}

.summary-counter[b-tlvqr0ihne] {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.counter-value[b-tlvqr0ihne] {
    font-size: 2.25rem;
    font-weight: 800;
    line-height: 1;
    color: #E0E4EA;
}

.counter-label[b-tlvqr0ihne] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #667788;
    margin-top: 0.2rem;
}

.summary-counter.pass .counter-value[b-tlvqr0ihne]  { color: #4CAF50; }
.summary-counter.fail .counter-value[b-tlvqr0ihne]  { color: #B0171E; }
.summary-counter.yield .counter-value[b-tlvqr0ihne] { color: #FFC107; }

.summary-timestamp[b-tlvqr0ihne] {
    margin-left: auto;
    font-size: 0.75rem;
    color: #556677;
}

/* ── Responsive ───────────────────────────────────────────────────── */
@media (max-width: 480px) {
    .summary-panel[b-tlvqr0ihne] {
        gap: 1rem;
        padding: 0.75rem 1rem;
    }

    .counter-value[b-tlvqr0ihne] {
        font-size: 1.75rem;
    }

    .summary-timestamp[b-tlvqr0ihne] {
        margin-left: 0;
        flex-basis: 100%;
    }
}

/* ── Light theme ──────────────────────────────────────────────────────── */
html[data-theme="light"] .summary-panel[b-tlvqr0ihne]      { background: #ffffff; border-color: #d1dce8; }
html[data-theme="light"] .counter-value[b-tlvqr0ihne]      { color: #1a2535; }
html[data-theme="light"] .counter-label[b-tlvqr0ihne]      { color: #4a6278; }
html[data-theme="light"] .summary-timestamp[b-tlvqr0ihne]  { color: #64748b; }
html[data-theme="light"] .summary-counter.pass .counter-value[b-tlvqr0ihne]  { color: #15803d; }
html[data-theme="light"] .summary-counter.fail .counter-value[b-tlvqr0ihne]  { color: #b91c1c; }
html[data-theme="light"] .summary-counter.yield .counter-value[b-tlvqr0ihne] { color: #b45309; }
/* /Components/Dashboard/FailurePareto.razor.rz.scp.css */
/* ── Failure Pareto ────────────────────────────────────────────────────── */

.failure-pareto[b-ezxsv6364p] {
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 12px;
    padding: 1rem 1.25rem;
}

.failure-pareto h3[b-ezxsv6364p] {
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #667788;
    margin: 0 0 0.75rem;
}

.empty-pareto[b-ezxsv6364p] {
    color: #556677;
    text-align: center;
    padding: 1.5rem;
}

.pareto-list[b-ezxsv6364p] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.pareto-row[b-ezxsv6364p] {
    display: grid;
    grid-template-columns: 1.5rem 1fr 40% 3rem;
    align-items: center;
    gap: 0.5rem;
}

/* ── Responsive ───────────────────────────────────────────────────── */
@media (max-width: 480px) {
    .pareto-row[b-ezxsv6364p] {
        grid-template-columns: 1.5rem 1fr 3rem;
    }

    /* Hide the bar track on very small screens; keep rank, name, count */
    .pareto-bar-track[b-ezxsv6364p] {
        display: none;
    }
}

.pareto-rank[b-ezxsv6364p] {
    font-size: 0.8rem;
    color: #667788;
    text-align: right;
}

.pareto-name[b-ezxsv6364p] {
    font-size: 0.85rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.pareto-bar-track[b-ezxsv6364p] {
    height: 14px;
    background: rgba(255,255,255,0.06);
    border-radius: 4px;
    overflow: hidden;
}

.pareto-bar[b-ezxsv6364p] {
    height: 100%;
    background: #B0171E;
    border-radius: 4px;
    min-width: 4px;
    transition: width 0.5s ease;
}

.pareto-count[b-ezxsv6364p] {
    font-size: 0.85rem;
    font-weight: 700;
    text-align: right;
    color: #B0171E;
}

/* ── Light theme ──────────────────────────────────────────────────────── */
html[data-theme="light"] .failure-pareto[b-ezxsv6364p]          { background: #ffffff; border-color: #d1dce8; }
html[data-theme="light"] .failure-pareto h3[b-ezxsv6364p]       { color: #4a6278; }
html[data-theme="light"] .empty-pareto[b-ezxsv6364p]            { color: #64748b; }
html[data-theme="light"] .pareto-rank[b-ezxsv6364p]             { color: #4a6278; }
html[data-theme="light"] .pareto-bar-track[b-ezxsv6364p]        { background: rgba(0,0,0,0.07); }
/* /Components/Dashboard/StationCard.razor.rz.scp.css */
/* ── Station card ──────────────────────────────────────────────────────── */

.station-card[b-ngpfyg460r] {
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 12px;
    padding: 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    transition: border-color 0.3s;
}

.station-card.yield-good[b-ngpfyg460r]         { border-left: 4px solid #4CAF50; }
.station-card.yield-warning[b-ngpfyg460r]      { border-left: 4px solid #FF9800; }
.station-card.yield-poor[b-ngpfyg460r]         { border-left: 4px solid #B0171E; }
.station-card.yield-idle[b-ngpfyg460r]         { border-left: 4px solid #546E7A; opacity: 0.6; }
.station-card.yield-broken[b-ngpfyg460r]       { border-left: 4px solid #B0171E; background: rgba(176,23,30,0.10); }
.station-card.yield-planned-down[b-ngpfyg460r] { border-left: 4px solid #546E7A; background: rgba(84,110,122,0.12); opacity: 0.75; }

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

.station-header[b-ngpfyg460r] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.station-id[b-ngpfyg460r] {
    font-size: 1.5rem;
    font-weight: 700;
    letter-spacing: 0.03em;
}

.status-dot[b-ngpfyg460r] {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    flex-shrink: 0;
}

.status-running[b-ngpfyg460r]       { background: #2196F3; animation: pulse-dot 1.5s infinite; }
.status-idle[b-ngpfyg460r]          { background: #546E7A; }
.status-done[b-ngpfyg460r]          { background: #78909C; }
.status-broken[b-ngpfyg460r]        { background: #B0171E; animation: pulse-dot 2s infinite; }
.status-planned-down[b-ngpfyg460r]  { background: #546E7A; }

@@keyframes pulse-dot {
    0%[b-ngpfyg460r], 100%[b-ngpfyg460r] { opacity: 1; }
    50%[b-ngpfyg460r] { opacity: 0.3; }
}

/* ── Yield ────────────────────────────────────────────────────────────── */

.yield-value[b-ngpfyg460r] {
    font-size: 3rem;
    font-weight: 800;
    line-height: 1;
    letter-spacing: -0.02em;
}

.yield-good .yield-value[b-ngpfyg460r]  { color: #4CAF50; }
.yield-warning .yield-value[b-ngpfyg460r] { color: #FF9800; }
.yield-poor .yield-value[b-ngpfyg460r]  { color: #B0171E; }
.yield-idle .yield-value[b-ngpfyg460r]  { color: #546E7A; }

/* ── Verdict strip ────────────────────────────────────────────────────── */

.verdict-strip[b-ngpfyg460r] {
    display: flex;
    gap: 5px;
    padding: 0.25rem 0;
}

.verdict-dot[b-ngpfyg460r] {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    flex-shrink: 0;
}

.dot-pass[b-ngpfyg460r]  { background: #4CAF50; }
.dot-fail[b-ngpfyg460r]  { background: #B0171E; }
.dot-other[b-ngpfyg460r] { background: #546E7A; }

/* ── Responsive ───────────────────────────────────────────────────── */
@media (max-width: 640px) {
    .station-card[b-ngpfyg460r] {
        padding: 0.9rem 1rem;
    }

    .yield-value[b-ngpfyg460r] {
        font-size: 2.25rem;
    }

    .station-id[b-ngpfyg460r] {
        font-size: 1.2rem;
    }
}

/* ── Meta ─────────────────────────────────────────────────────────────── */

.station-meta[b-ngpfyg460r] {
    font-size: 0.8rem;
    color: #8899AA;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.current-test[b-ngpfyg460r] {
    color: #2196F3;
    font-weight: 600;
}

.running-indicator[b-ngpfyg460r] {
    font-size: 0.65rem;
    margin-right: 0.25rem;
}

.elapsed[b-ngpfyg460r] {
    font-weight: 400;
    opacity: 0.7;
    margin-left: 0.25rem;
}

.meta-row[b-ngpfyg460r] {
    display: flex;
    justify-content: space-between;
}

.streak-warning[b-ngpfyg460r] {
    color: #FF9800;
    font-weight: 700;
    font-size: 0.85rem;
    margin-top: 0.25rem;
}

/* ── Down state banner ────────────────────────────────────────────────── */

.down-banner[b-ngpfyg460r] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.6rem 0.75rem;
    border-radius: 6px;
    font-weight: 700;
    font-size: 0.9rem;
    letter-spacing: 0.04em;
}

.down-banner-broken[b-ngpfyg460r]  { background: rgba(176,23,30,0.25); color: #FF6B6B; }
.down-banner-planned[b-ngpfyg460r] { background: rgba(84,110,122,0.20); color: #90A4AE; }

.down-icon[b-ngpfyg460r]    { font-size: 1rem; }
.down-elapsed[b-ngpfyg460r] { margin-left: auto; font-weight: 400; font-size: 0.8rem; opacity: 0.85; }

.down-reason[b-ngpfyg460r] {
    font-size: 0.78rem;
    color: #8899AA;
    font-style: italic;
    padding: 0 0.25rem;
}

/* ── KPI row (UPH + FPY) ─────────────────────────────────────────────── */

.kpi-row[b-ngpfyg460r] { font-weight: 600; color: #90A4AE; }
.fpy-good[b-ngpfyg460r]    { color: #4CAF50; }
.fpy-warning[b-ngpfyg460r] { color: #FF9800; }
.fpy-poor[b-ngpfyg460r]    { color: #B0171E; }

/* ── Long-idle warning ────────────────────────────────────────────────── */

.idle-warning[b-ngpfyg460r] {
    color: #FF9800;
    font-size: 0.78rem;
    margin-top: 0.25rem;
}

/* ── Light theme ──────────────────────────────────────────────────────── */
html[data-theme="light"] .station-card[b-ngpfyg460r] { background: #ffffff; border-color: #d1dce8; }
html[data-theme="light"] .station-card.yield-broken[b-ngpfyg460r]       { background: rgba(176,23,30,0.07); }
html[data-theme="light"] .station-card.yield-planned-down[b-ngpfyg460r] { background: rgba(84,110,122,0.07); }
html[data-theme="light"] .station-meta[b-ngpfyg460r]  { color: #4a6278; }
html[data-theme="light"] .down-reason[b-ngpfyg460r]   { color: #4a6278; }
html[data-theme="light"] .kpi-row[b-ngpfyg460r]       { color: #4a6278; }
html[data-theme="light"] .down-banner-broken[b-ngpfyg460r]  { background: rgba(176,23,30,0.10);  color: #b91c1c; }
html[data-theme="light"] .down-banner-planned[b-ngpfyg460r] { background: rgba(84,110,122,0.10); color: #475569; }
/* /Components/Dashboard/YieldTimelineChart.razor.rz.scp.css */
/* ── Yield timeline chart ───────────────────────────────────────────────── */

.yield-chart-placeholder[b-op13ohkgxu] {
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 12px;
    padding: 1rem 1.25rem;
}

.yield-chart-placeholder h3[b-op13ohkgxu] {
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #667788;
    margin: 0 0 0.5rem;
}

.yield-chart-canvas[b-op13ohkgxu] {
    width: 100%;
}

.empty-chart[b-op13ohkgxu] {
    color: #556677;
    text-align: center;
    padding: 2rem;
}

/* ── Light theme ──────────────────────────────────────────────────────── */
html[data-theme="light"] .yield-chart-placeholder[b-op13ohkgxu] { background: #ffffff; border-color: #d1dce8; }
html[data-theme="light"] .yield-chart-placeholder h3[b-op13ohkgxu] { color: #4a6278; }
html[data-theme="light"] .empty-chart[b-op13ohkgxu] { color: #64748b; }
/* /Components/Demo/DemoTour.razor.rz.scp.css */
/* ── Guided demo tour — dark by default, light override, matches Dashboard ──── */

.demo-tour[b-utfjw2xn0q] {
    --dt-bg:          #1E2A35;
    --dt-surface:     #253340;
    --dt-surface-alt: #2C3E4F;
    --dt-border:      rgba(255,255,255,0.16);
    --dt-text:        #E0E4EA;
    --dt-muted:       #8A9BB0;
    --dt-accent:      #2196F3;
    --dt-live:        #4CAF50;
    --dt-code-bg:     #151f28;
    --dt-brand:       #B0171E;

    max-width: 920px;
    margin: 0 auto;
    padding: 28px 20px 80px;
    color: var(--dt-text);
    font-family: var(--font-sans);
}

html[data-theme="light"] .demo-tour[b-utfjw2xn0q] {
    --dt-bg:          #f8fafc;
    --dt-surface:     #ffffff;
    --dt-surface-alt: #f0f4f8;
    --dt-border:      #d1dce8;
    --dt-text:        #1a2535;
    --dt-muted:       #4a6278;
    --dt-accent:      #0284c7;
    --dt-code-bg:     #0f1b26;   /* code stays dark in both themes for legibility */
}

/* ── Hero ─────────────────────────────────────────────────────────────────── */
.demo-tour__hero[b-utfjw2xn0q] { text-align: center; margin-bottom: 22px; }

.demo-tour__eyebrow[b-utfjw2xn0q] {
    display: inline-block;
    font-size: .72rem;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--dt-accent);
    margin-bottom: 10px;
}

.demo-tour__title[b-utfjw2xn0q] {
    margin: 0 0 12px;
    font-size: 2rem;
    font-weight: 700;
    line-height: 1.15;
}

.demo-tour__lead[b-utfjw2xn0q] {
    margin: 0 auto;
    max-width: 620px;
    color: var(--dt-muted);
    line-height: 1.55;
}

/* ── Stepper ──────────────────────────────────────────────────────────────── */
.demo-tour__stepper[b-utfjw2xn0q] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    flex-wrap: wrap;
    position: sticky;
    top: 0;
    z-index: 5;
    padding: 12px 8px;
    margin-bottom: 26px;
    background: color-mix(in srgb, var(--dt-bg) 88%, transparent);
    backdrop-filter: blur(6px);
    border-bottom: 1px solid var(--dt-border);
}

.tourdot[b-utfjw2xn0q] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 5px 12px;
    border-radius: 999px;
    color: var(--dt-muted);
    text-decoration: none;
    font-size: .86rem;
    font-weight: 500;
    transition: background .15s, color .15s;
}
.tourdot:hover[b-utfjw2xn0q] { background: var(--dt-surface-alt); color: var(--dt-text); }

.tourdot__n[b-utfjw2xn0q] {
    display: inline-grid;
    place-items: center;
    width: 20px; height: 20px;
    border-radius: 50%;
    background: var(--dt-accent);
    color: #fff;
    font-size: .72rem;
    font-weight: 700;
}

.tourdot__sep[b-utfjw2xn0q] { width: 16px; height: 1px; background: var(--dt-border); }

/* ── Step card ────────────────────────────────────────────────────────────── */
.tour-step[b-utfjw2xn0q] {
    background: var(--dt-surface);
    border: 1px solid var(--dt-border);
    border-radius: 14px;
    padding: 24px 26px;
    margin-bottom: 20px;
    scroll-margin-top: 64px;   /* clear the sticky stepper on anchor jump */
}

.tour-step__head[b-utfjw2xn0q] {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    margin-bottom: 14px;
}

.tour-step__num[b-utfjw2xn0q] {
    flex: none;
    display: inline-grid;
    place-items: center;
    width: 38px; height: 38px;
    border-radius: 50%;
    background: var(--dt-accent);
    color: #fff;
    font-size: 1.1rem;
    font-weight: 700;
}

.tour-step__title[b-utfjw2xn0q] { margin: 2px 0 4px; font-size: 1.3rem; font-weight: 650; }

.tour-step__sub[b-utfjw2xn0q] { margin: 0; color: var(--dt-muted); font-size: .9rem; }

.tour-tag[b-utfjw2xn0q] {
    display: inline-block;
    padding: 1px 8px;
    margin-right: 8px;
    border-radius: 999px;
    font-size: .68rem;
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
    vertical-align: 1px;
}
.tour-tag--watch[b-utfjw2xn0q] { background: rgba(255,152,0,.16); color: #FF9800; }
.tour-tag--live[b-utfjw2xn0q]  { background: rgba(76,175,80,.16); color: var(--dt-live); }

.tour-step__body[b-utfjw2xn0q] { margin: 0 0 18px; line-height: 1.6; color: var(--dt-text); }
.tour-step__body code[b-utfjw2xn0q], .tour-step__sub code[b-utfjw2xn0q] {
    background: var(--dt-surface-alt);
    padding: 1px 6px;
    border-radius: 5px;
    font-family: var(--font-mono);
    font-size: .88em;
}

/* ── Step 1 — author showcase ─────────────────────────────────────────────── */
.tour-author[b-utfjw2xn0q] {
    display: grid;
    grid-template-columns: 1fr 1.25fr;
    gap: 18px;
    align-items: start;
}
@media (max-width: 720px) {
    .tour-author[b-utfjw2xn0q] { grid-template-columns: 1fr; }
}

.tour-author__label[b-utfjw2xn0q] {
    font-size: .74rem;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--dt-muted);
    margin-bottom: 8px;
}
.tour-author__hint[b-utfjw2xn0q] { text-transform: none; letter-spacing: 0; color: var(--dt-muted); }

.tour-intent[b-utfjw2xn0q] {
    margin: 0;
    padding: 16px 18px;
    background: var(--dt-surface-alt);
    border-left: 3px solid var(--dt-accent);
    border-radius: 8px;
    font-style: italic;
    line-height: 1.55;
}

.tour-author__arrow[b-utfjw2xn0q] {
    margin-top: 14px;
    color: var(--dt-accent);
    font-weight: 600;
    font-size: .9rem;
}

.tour-code[b-utfjw2xn0q] { margin-bottom: 12px; }
.tour-code__cap[b-utfjw2xn0q] {
    font-family: var(--font-mono);
    font-size: .74rem;
    color: var(--dt-muted);
    background: var(--dt-code-bg);
    border: 1px solid var(--dt-border);
    border-bottom: none;
    border-radius: 8px 8px 0 0;
    padding: 6px 12px;
}
.tour-code__pre[b-utfjw2xn0q] {
    margin: 0;
    overflow-x: auto;
    background: var(--dt-code-bg);
    border: 1px solid var(--dt-border);
    border-radius: 0 0 8px 8px;
    padding: 12px 14px;
}
.tour-code__pre code[b-utfjw2xn0q] {
    font-family: var(--font-mono);
    font-size: .78rem;
    line-height: 1.5;
    color: #cbd6e2;
    white-space: pre;
}

/* ── Actions / buttons ────────────────────────────────────────────────────── */
.tour-actions[b-utfjw2xn0q] {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
}
.tour-actions--secondary[b-utfjw2xn0q] { gap: 12px; margin-top: 4px; }

.tour-btn[b-utfjw2xn0q] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 18px;
    border-radius: 9px;
    font-weight: 600;
    font-size: .92rem;
    text-decoration: none;
    border: 1px solid transparent;
    cursor: pointer;
    transition: filter .15s, background .15s;
}
.tour-btn--primary[b-utfjw2xn0q] { background: var(--dt-accent); color: #fff; }
.tour-btn--primary:hover[b-utfjw2xn0q] { filter: brightness(1.08); }
.tour-btn--ghost[b-utfjw2xn0q] {
    background: transparent;
    border-color: var(--dt-border);
    color: var(--dt-text);
    font-weight: 500;
    font-size: .86rem;
    padding: 8px 14px;
}
.tour-btn--ghost:hover[b-utfjw2xn0q] { background: var(--dt-surface-alt); }

.tour-or[b-utfjw2xn0q] {
    color: var(--dt-muted);
    font-size: .82rem;
    text-transform: uppercase;
    letter-spacing: .08em;
}

/* ── Ask-the-AI prompt chips ──────────────────────────────────────────────── */
.tour-ask[b-utfjw2xn0q] { flex: 1 1 300px; min-width: 260px; }
.tour-ask__label[b-utfjw2xn0q] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: .84rem;
    font-weight: 600;
    color: var(--dt-muted);
    margin-bottom: 8px;
}

.tour-prompts[b-utfjw2xn0q] { display: grid; gap: 10px; margin-bottom: 20px; }

.tour-ask__prompt[b-utfjw2xn0q] {
    display: flex;
    align-items: center;
    gap: 10px;
    background: var(--dt-surface-alt);
    border: 1px solid var(--dt-border);
    border-radius: 9px;
    padding: 8px 8px 8px 14px;
}
.tour-ask__prompt code[b-utfjw2xn0q] {
    flex: 1;
    font-family: var(--font-mono);
    font-size: .82rem;
    line-height: 1.4;
    color: var(--dt-text);
    background: none;
}

.tour-copy[b-utfjw2xn0q] {
    flex: none;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 6px 11px;
    border-radius: 7px;
    border: 1px solid var(--dt-border);
    background: var(--dt-surface);
    color: var(--dt-text);
    font-size: .78rem;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
    transition: background .15s, color .15s, border-color .15s;
}
.tour-copy:hover[b-utfjw2xn0q] { border-color: var(--dt-accent); color: var(--dt-accent); }
.tour-copy--done[b-utfjw2xn0q] { background: var(--dt-live); border-color: var(--dt-live); color: #fff; }

.tour-ask__hint[b-utfjw2xn0q] { margin: 8px 0 0; font-size: .78rem; color: var(--dt-muted); }

/* ── Next link + finale ───────────────────────────────────────────────────── */
.tour-next[b-utfjw2xn0q] {
    display: inline-block;
    margin-top: 20px;
    color: var(--dt-accent);
    text-decoration: none;
    font-weight: 600;
    font-size: .92rem;
}
.tour-next:hover[b-utfjw2xn0q] { text-decoration: underline; }

.tour-fin[b-utfjw2xn0q] {
    margin-top: 22px;
    padding: 16px 18px;
    background: var(--dt-surface-alt);
    border-radius: 10px;
    line-height: 1.55;
    color: var(--dt-text);
}
/* /Components/Pages/AccessAdmin.razor.rz.scp.css */
/* Dark-first (the app's default theme); light overrides via html[data-theme="light"]. */

.access-admin[b-vb9jcvgdvz] {
    max-width: 1100px;
    padding: 1.5rem;
}

.access-admin h1[b-vb9jcvgdvz] {
    margin-bottom: 1.25rem;
}

.access-admin section[b-vb9jcvgdvz] {
    margin-bottom: 2rem;
}

.access-admin h2[b-vb9jcvgdvz] {
    font-size: 1rem;
    margin: 0 0 0.75rem;
    opacity: 0.8;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

/* The number of people waiting. Loud on purpose: this page exists to be a queue somebody clears,
   and a count that blends into a heading is one nobody notices. */
.count[b-vb9jcvgdvz] {
    background: var(--brand-red, #B0171E);
    color: #fff;
    border-radius: 999px;
    padding: 0.05rem 0.5rem;
    font-size: 0.75rem;
}

.muted[b-vb9jcvgdvz] { opacity: 0.6; }

.notice[b-vb9jcvgdvz],
.refusal[b-vb9jcvgdvz],
.warn[b-vb9jcvgdvz] {
    border-radius: 8px;
    padding: 0.6rem 0.8rem;
    margin: 0 0 1rem;
    border: 1px solid transparent;
}

.notice[b-vb9jcvgdvz]  { background: rgba(76, 175, 80, 0.1); border-color: rgba(76, 175, 80, 0.35); }
.refusal[b-vb9jcvgdvz] { background: rgba(176, 23, 30, 0.12); border-color: rgba(176, 23, 30, 0.45); }

/* Amber, matching the onboarding page: "assigned but not enforced" is not an error and not a
   success, and colouring it green would say the opposite of what it means. */
.warn[b-vb9jcvgdvz] { background: rgba(255, 152, 0, 0.12); border-color: rgba(255, 152, 0, 0.45); }

.warn code[b-vb9jcvgdvz] {
    background: rgba(0, 0, 0, 0.25);
    border-radius: 4px;
    padding: 0.05rem 0.3rem;
}

.grid[b-vb9jcvgdvz] {
    width: 100%;
    border-collapse: collapse;
}

.grid th[b-vb9jcvgdvz] {
    text-align: left;
    font-weight: 600;
    opacity: 0.55;
    font-size: 0.8rem;
    padding: 0 0.6rem 0.4rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.grid td[b-vb9jcvgdvz] {
    padding: 0.55rem 0.6rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    vertical-align: top;
}

/* The directory object id under each name. Small and dim: it is what the grant is actually keyed
   on, so it has to be visible and checkable — but it is never what somebody is reading for. */
.subject[b-vb9jcvgdvz] {
    font-size: 0.72rem;
    opacity: 0.4;
    margin-top: 0.15rem;
    word-break: break-all;
}

.note[b-vb9jcvgdvz] { max-width: 22rem; }

.actions[b-vb9jcvgdvz] { white-space: nowrap; }

.grid button[b-vb9jcvgdvz] {
    font: inherit;
    font-size: 0.78rem;
    border-radius: 6px;
    padding: 0.22rem 0.55rem;
    margin: 0 0.25rem 0.25rem 0;
    cursor: pointer;
    border: 1px solid rgba(255, 255, 255, 0.18);
    background: rgba(255, 255, 255, 0.05);
    color: inherit;
}

.grid button:hover:not(:disabled)[b-vb9jcvgdvz] { background: rgba(255, 255, 255, 0.12); }
.grid button:disabled[b-vb9jcvgdvz] { opacity: 0.4; cursor: default; }

.grant:hover:not(:disabled)[b-vb9jcvgdvz] {
    border-color: rgba(76, 175, 80, 0.7);
    background: rgba(76, 175, 80, 0.15);
}

.decline:hover:not(:disabled)[b-vb9jcvgdvz] {
    border-color: rgba(176, 23, 30, 0.7);
    background: rgba(176, 23, 30, 0.15);
}

/* A role somebody holds, with the × that removes it. Visibly different from the "add" buttons
   beside it: the two columns do opposite things and sit inches apart. */
.chip[b-vb9jcvgdvz] {
    border-radius: 999px !important;
    background: rgba(33, 150, 243, 0.16) !important;
    border-color: rgba(33, 150, 243, 0.45) !important;
}

.chip:hover:not(:disabled)[b-vb9jcvgdvz] {
    background: rgba(176, 23, 30, 0.18) !important;
    border-color: rgba(176, 23, 30, 0.6) !important;
}

.tag[b-vb9jcvgdvz] {
    font-size: 0.68rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    opacity: 0.7;
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 4px;
    padding: 0.05rem 0.35rem;
    margin-left: 0.5rem;
}

.inactive[b-vb9jcvgdvz] { opacity: 0.45; }

html[data-theme="light"] .grid th[b-vb9jcvgdvz] { border-bottom-color: rgba(0, 0, 0, 0.12); }
html[data-theme="light"] .grid td[b-vb9jcvgdvz] { border-bottom-color: rgba(0, 0, 0, 0.07); }
html[data-theme="light"] .grid button[b-vb9jcvgdvz] { border-color: rgba(0, 0, 0, 0.18); background: rgba(0, 0, 0, 0.03); }
html[data-theme="light"] .grid button:hover:not(:disabled)[b-vb9jcvgdvz] { background: rgba(0, 0, 0, 0.07); }
html[data-theme="light"] .tag[b-vb9jcvgdvz] { border-color: rgba(0, 0, 0, 0.2); }
/* /Components/Pages/Dashboard.razor.rz.scp.css */
/* ── Trace / test health board (top of page) ────────────────────────── */

.home-health-board[b-y6ualib644] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
    padding: 1rem 1.5rem 0;
    background: rgba(0,0,0,0.18);
}

.home-health-panel[b-y6ualib644] {
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 8px;
    padding: 0.85rem 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.home-health-panel__title[b-y6ualib644] {
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: #8899AA;
}

.home-health-panel__body[b-y6ualib644] {
    flex: 1;
}

.home-health-panel__link[b-y6ualib644] {
    font-size: 0.75rem;
    color: #38bdf8;
    text-decoration: none;
    align-self: flex-start;
}

.home-health-panel__link:hover[b-y6ualib644] { text-decoration: underline; }

.home-health-stats[b-y6ualib644] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
}

.home-health-stat[b-y6ualib644] {
    padding: 3px 10px;
    border-radius: 6px;
    font-size: 0.78rem;
    font-weight: 700;
    border: 1px solid transparent;
}

.home-health-stat--pass[b-y6ualib644]    { background: rgba(52,211,153,0.1);  color: #34d399; border-color: rgba(52,211,153,0.25); }
.home-health-stat--fail[b-y6ualib644]    { background: rgba(248,113,113,0.1); color: #f87171; border-color: rgba(248,113,113,0.25); }
.home-health-stat--warn[b-y6ualib644]    { background: rgba(251,191,36,0.1);  color: #fbbf24; border-color: rgba(251,191,36,0.25); }
.home-health-stat--run[b-y6ualib644]     { background: rgba(96,165,250,0.1);  color: #60a5fa; border-color: rgba(96,165,250,0.25); }
.home-health-stat--idle[b-y6ualib644]    { background: rgba(100,116,139,0.1); color: #94a3b8; border-color: rgba(100,116,139,0.25); }
.home-health-stat--loading[b-y6ualib644] { background: rgba(100,116,139,0.05); color: #667788; border-color: rgba(100,116,139,0.12); }

.home-health-recents[b-y6ualib644] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.3rem;
    margin-top: 0.4rem;
}

.home-health-badge[b-y6ualib644] {
    padding: 2px 7px;
    border-radius: 4px;
    font-size: 0.7rem;
    font-weight: 600;
    font-family: var(--font-mono);
}

.home-health-badge--pass[b-y6ualib644] { background: rgba(52,211,153,0.15);  color: #34d399; }
.home-health-badge--fail[b-y6ualib644] { background: rgba(248,113,113,0.15); color: #f87171; }
.home-health-badge--run[b-y6ualib644]  { background: rgba(96,165,250,0.15);  color: #60a5fa; }

.home-health-skeleton[b-y6ualib644] {
    height: 1.4rem;
    border-radius: 4px;
    background: rgba(255,255,255,0.06);
    animation: trace-pulse 1.4s ease-in-out infinite;
}

.home-health-search-form[b-y6ualib644] {
    display: flex;
    gap: 0.4rem;
}

.home-health-search-input[b-y6ualib644] {
    flex: 1;
    background: rgba(255,255,255,0.07);
    border: 1px solid rgba(255,255,255,0.14);
    color: #E0E4EA;
    border-radius: 5px;
    padding: 0.3rem 0.5rem;
    font-size: 0.82rem;
}

.home-health-search-btn[b-y6ualib644] {
    background: #38bdf8;
    color: #0f172a;
    border: none;
    border-radius: 5px;
    padding: 0.3rem 0.7rem;
    font-size: 0.82rem;
    font-weight: 700;
    cursor: pointer;
}

.home-health-hint[b-y6ualib644] {
    margin: 0.35rem 0 0;
    font-size: 0.7rem;
    color: #667788;
}

@media (max-width: 900px) {
    .home-health-board[b-y6ualib644] {
        grid-template-columns: 1fr;
    }
}

/* ── Dashboard page layout ─────────────────────────────────────────────── */

.dashboard[b-y6ualib644] {
    background-color: var(--bg-dashboard);
    color: #E0E4EA;
    min-height: 100vh;
    padding: 0;
    display: flex;
    flex-direction: column;
}

/* ── Filter bar ───────────────────────────────────────────────────────── */

.filter-bar[b-y6ualib644] {
    display: flex;
    gap: 1rem;
    align-items: end;
    flex-wrap: wrap;
    padding: 0.5rem 1.5rem;
    background: rgba(0,0,0,0.25);
    transition: opacity 0.3s, max-height 0.3s;
    max-height: 8rem;
    overflow: hidden;
}

.filter-hidden .filter-bar[b-y6ualib644] {
    opacity: 0;
    max-height: 0;
    padding: 0 1.5rem;
}

.filter-bar label[b-y6ualib644] {
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #8899AA;
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

.filter-bar input[b-y6ualib644],
.filter-bar select[b-y6ualib644] {
    background: rgba(255,255,255,0.08);
    border: 1px solid rgba(255,255,255,0.15);
    color: #E0E4EA;
    border-radius: 4px;
    padding: 0.25rem 0.5rem;
    font-size: 0.85rem;
    min-width: 6rem;
}

.btn-apply[b-y6ualib644] {
    background: var(--color-fail, #B0171E);
    color: white;
    border: none;
    border-radius: 4px;
    padding: 0.35rem 1rem;
    font-size: 0.85rem;
    cursor: pointer;
}


.btn-apply:hover[b-y6ualib644] {
    opacity: 0.85;
}

/* ── Grid layout ──────────────────────────────────────────────────────── */

.dashboard-grid[b-y6ualib644] {
    display: grid;
    grid-template-columns: minmax(280px, 35%) 1fr;
    gap: 1rem;
    padding: 1rem 1.5rem;
    flex: 1;
}

.station-cards[b-y6ualib644] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 1rem;
    align-content: start;
}

.right-panel[b-y6ualib644] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

/* ── Loading / empty states ───────────────────────────────────────────── */

.loading[b-y6ualib644] {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 50vh;
    font-size: 1.5rem;
    color: #667788;
}

.no-stations[b-y6ualib644] {
    grid-column: 1 / -1;
    text-align: center;
    padding: 3rem;
    color: #667788;
    font-size: 1.2rem;
}

/* ── Responsive ───────────────────────────────────────────────────────── */

@media (max-width: 1280px) {
    .dashboard-grid[b-y6ualib644] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 640px) {
    .filter-bar[b-y6ualib644] {
        padding: 0.5rem 0.75rem;
        gap: 0.6rem;
    }

    .filter-bar label[b-y6ualib644] {
        flex-basis: calc(50% - 0.3rem);
    }

    .btn-apply[b-y6ualib644] {
        flex: 1;
        text-align: center;
    }

    .dashboard-grid[b-y6ualib644] {
        padding: 0.75rem;
        gap: 0.75rem;
    }

    .station-cards[b-y6ualib644] {
        grid-template-columns: 1fr;
    }
}

/* ── Light theme ─────────────────────────────────────────────────────── */

html[data-theme="light"] .dashboard[b-y6ualib644] { background-color: #f0f4f8; color: #1a2535; }

html[data-theme="light"] .home-health-board[b-y6ualib644] { background: rgba(0,0,0,0.03); }
html[data-theme="light"] .home-health-panel[b-y6ualib644] { background: #ffffff; border-color: #d1dce8; }
html[data-theme="light"] .home-health-panel__title[b-y6ualib644] { color: #4a6278; }
html[data-theme="light"] .home-health-panel__link[b-y6ualib644] { color: #0284c7; }
html[data-theme="light"] .home-health-skeleton[b-y6ualib644] { background: rgba(0,0,0,0.07); }
html[data-theme="light"] .home-health-search-input[b-y6ualib644] { background: #f8fafc; border-color: #d1dce8; color: #1a2535; }
html[data-theme="light"] .home-health-search-btn[b-y6ualib644] { background: #0284c7; }
html[data-theme="light"] .home-health-hint[b-y6ualib644] { color: #7a9ab0; }

html[data-theme="light"] .filter-bar[b-y6ualib644] { background: rgba(0,0,0,0.05); }
html[data-theme="light"] .filter-bar label[b-y6ualib644] { color: #4a6278; }
html[data-theme="light"] .filter-bar input[b-y6ualib644],
html[data-theme="light"] .filter-bar select[b-y6ualib644] { background: #ffffff; border-color: #d1dce8; color: #1a2535; }

html[data-theme="light"] .loading[b-y6ualib644],
html[data-theme="light"] .no-stations[b-y6ualib644] { color: #7a9ab0; }
/* /Components/Pages/Home.razor.rz.scp.css */
.home-landing[b-2zw3mkxwzy] {
    max-width: 900px;
    margin: 0 auto;
    padding: 60px 24px 80px;
}

.home-landing__header[b-2zw3mkxwzy] {
    text-align: center;
    margin-bottom: 48px;
}

.home-landing__title[b-2zw3mkxwzy] {
    font-size: 2.4rem;
    font-weight: 800;
    color: #e2e8f0;
    letter-spacing: -0.02em;
    margin: 0 0 10px;
}

.home-landing__subtitle[b-2zw3mkxwzy] {
    color: #8fa8be;
    font-size: 1rem;
    margin: 0;
}

/* Demo-only guided-tour invitation. Filled accent so it reads in both themes without an override. */
.home-tour-cta[b-2zw3mkxwzy] {
    display: flex;
    align-items: center;
    gap: 14px;
    margin: 0 0 40px;
    padding: 16px 22px;
    background: linear-gradient(90deg, #2196F3, #0284c7);
    border-radius: 12px;
    text-decoration: none;
    color: #fff;
    box-shadow: 0 4px 16px rgba(33,150,243,0.25);
    transition: transform 0.15s, box-shadow 0.15s;
}

.home-tour-cta:hover[b-2zw3mkxwzy] {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(33,150,243,0.35);
}

.home-tour-cta__badge[b-2zw3mkxwzy] {
    flex: none;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    background: rgba(255,255,255,0.2);
    padding: 4px 10px;
    border-radius: 999px;
}

.home-tour-cta__text[b-2zw3mkxwzy] { flex: 1; font-weight: 600; line-height: 1.4; }

.home-tour-cta__arrow[b-2zw3mkxwzy] { flex: none; font-size: 1.3rem; }

.home-landing__grid[b-2zw3mkxwzy] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 20px;
}

.home-landing__card[b-2zw3mkxwzy] {
    background: #1b2736;
    border: 1px solid #2c3e50;
    border-radius: 12px;
    padding: 28px 24px;
    text-decoration: none;
    color: inherit;
    display: flex;
    flex-direction: column;
    gap: 10px;
    transition: transform 0.15s, box-shadow 0.15s, border-color 0.15s;
    box-shadow: 0 2px 8px rgba(0,0,0,0.25);
}

.home-landing__card:hover[b-2zw3mkxwzy] {
    transform: translateY(-3px);
    box-shadow: 0 8px 24px rgba(0,0,0,0.4);
    border-color: #38bdf8;
}

.home-landing__card-icon[b-2zw3mkxwzy] {
    font-size: 1.8rem;
    line-height: 1;
    margin-bottom: 4px;
}

.home-landing__card-title[b-2zw3mkxwzy] {
    font-size: 1.1rem;
    font-weight: 700;
    color: #e2e8f0;
}

.home-landing__card-desc[b-2zw3mkxwzy] {
    font-size: 0.875rem;
    color: #8fa8be;
    line-height: 1.55;
}
/* /Components/Pages/License.razor.rz.scp.css */
/* Dark-first (the app's default theme); light overrides via html[data-theme="light"]. */

.license-page[b-1kjv7odaoj] {
    max-width: 760px;
    padding: 1.5rem;
}

.license-page h1[b-1kjv7odaoj] {
    margin-bottom: 1.25rem;
}

.license-card[b-1kjv7odaoj] {
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 10px;
    padding: 1.1rem 1.25rem;
    margin-bottom: 1.1rem;
}

.license-card__hdr[b-1kjv7odaoj] {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.license-card h2[b-1kjv7odaoj] {
    font-size: 1rem;
    margin: 0 0 0.75rem;
    opacity: 0.8;
}

.license-card__hdr h2[b-1kjv7odaoj] {
    margin-bottom: 0;
}

.license-grid[b-1kjv7odaoj] {
    display: grid;
    grid-template-columns: 9rem 1fr;
    row-gap: 0.4rem;
    column-gap: 1rem;
    margin: 0.5rem 0 0;
}

.license-grid dt[b-1kjv7odaoj] {
    opacity: 0.55;
}

.license-grid dd[b-1kjv7odaoj] {
    margin: 0;
}

.license-grid code[b-1kjv7odaoj] {
    font-size: 0.85rem;
    word-break: break-all;
}

.license-muted[b-1kjv7odaoj] {
    opacity: 0.6;
    margin: 0.6rem 0 0;
}

/* A server below its licensed version floor. Amber, matching --warn rather than --err: nothing is
   blocked and nothing is about to be, so it must not read like the lapsed states do. */
.license-below-floor[b-1kjv7odaoj] {
    color: #fbbf24;
}

.license-label[b-1kjv7odaoj] {
    display: block;
    margin: 0.9rem 0 0.35rem;
    font-size: 0.85rem;
    opacity: 0.65;
}

.license-textarea[b-1kjv7odaoj] {
    width: 100%;
    font-family: var(--font-mono);
    font-size: 0.8rem;
    padding: 0.5rem 0.6rem;
    color: inherit;
    background: rgba(0, 0, 0, 0.22);
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 6px;
    resize: vertical;
    box-sizing: border-box;
}

.license-btn[b-1kjv7odaoj] {
    margin-top: 0.6rem;
    padding: 0.45rem 0.9rem;
    color: inherit;
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 6px;
    background: transparent;
    cursor: pointer;
}

.license-btn:hover[b-1kjv7odaoj] {
    background: rgba(255, 255, 255, 0.08);
}

.license-btn--primary[b-1kjv7odaoj] {
    background: #2563eb;
    border-color: #2563eb;
    color: #fff;
}

.license-btn--primary:hover[b-1kjv7odaoj] {
    background: #1d4ed8;
}

.license-result[b-1kjv7odaoj] {
    margin: 0.7rem 0 0;
    font-size: 0.9rem;
}

.license-result--ok[b-1kjv7odaoj] {
    color: #4ade80;
}

.license-result--err[b-1kjv7odaoj] {
    color: #f87171;
}

.license-badge[b-1kjv7odaoj] {
    font-size: 0.75rem;
    font-weight: 600;
    padding: 0.2rem 0.6rem;
    border-radius: 999px;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.license-badge--ok[b-1kjv7odaoj] {
    background: rgba(34, 197, 94, 0.16);
    color: #4ade80;
}

.license-badge--warn[b-1kjv7odaoj] {
    background: rgba(245, 158, 11, 0.16);
    color: #fbbf24;
}

.license-badge--err[b-1kjv7odaoj] {
    background: rgba(239, 68, 68, 0.16);
    color: #f87171;
}

.license-badge--muted[b-1kjv7odaoj] {
    background: rgba(148, 163, 184, 0.16);
    color: #94a3b8;
}

/* ── Light theme overrides ───────────────────────────────────────────────── */

html[data-theme="light"] .license-card[b-1kjv7odaoj] {
    background: #fff;
    border-color: #e2e2e2;
}

html[data-theme="light"] .license-textarea[b-1kjv7odaoj] {
    background: #fff;
    border-color: #d4d4d4;
}

html[data-theme="light"] .license-btn[b-1kjv7odaoj] {
    border-color: #d4d4d4;
}

html[data-theme="light"] .license-btn:hover[b-1kjv7odaoj] {
    background: rgba(0, 0, 0, 0.04);
}

html[data-theme="light"] .license-result--ok[b-1kjv7odaoj] {
    color: #15803d;
}

html[data-theme="light"] .license-result--err[b-1kjv7odaoj] {
    color: #b91c1c;
}

html[data-theme="light"] .license-badge--ok[b-1kjv7odaoj] {
    background: #dcfce7;
    color: #15803d;
}

html[data-theme="light"] .license-badge--warn[b-1kjv7odaoj] {
    background: #fef9c3;
    color: #92400e;
}

html[data-theme="light"] .license-badge--err[b-1kjv7odaoj] {
    background: #fee2e2;
    color: #b91c1c;
}

html[data-theme="light"] .license-badge--muted[b-1kjv7odaoj] {
    background: #f1f5f9;
    color: #64748b;
}

html[data-theme="light"] .license-below-floor[b-1kjv7odaoj] {
    color: #92400e;
}
/* /Components/Pages/Onboarding.razor.rz.scp.css */
/* Dark-first (the app's default theme); light overrides via html[data-theme="light"]. */

.onboarding[b-zpt3fv3zfj] {
    max-width: 760px;
    padding: 1.5rem;
}

.onboarding h1[b-zpt3fv3zfj] {
    margin-bottom: 0.5rem;
}

/* The one sentence that says what state you are in. Everything else on the page is detail. */
.lede[b-zpt3fv3zfj] {
    font-size: 1.05rem;
    margin: 0 0 1.5rem;
    opacity: 0.9;
}

.onboarding section[b-zpt3fv3zfj] {
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 10px;
    padding: 1.1rem 1.25rem;
    margin-bottom: 1.1rem;
}

.onboarding h2[b-zpt3fv3zfj] {
    font-size: 1rem;
    margin: 0 0 0.75rem;
    opacity: 0.8;
}

.onboarding h3[b-zpt3fv3zfj] {
    font-size: 0.85rem;
    margin: 1.1rem 0 0.5rem;
    opacity: 0.7;
}

.muted[b-zpt3fv3zfj] { opacity: 0.6; }

.chips[b-zpt3fv3zfj] {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    margin: 0;
    padding: 0;
}

.chip[b-zpt3fv3zfj] {
    border-radius: 999px;
    padding: 0.18rem 0.6rem;
    font-size: 0.78rem;
    background: rgba(33, 150, 243, 0.16);
    border: 1px solid rgba(33, 150, 243, 0.45);
}

/* The capability list runs to 28 entries, which is a wall unless it is visibly secondary to the
   roles above it. Quieter, so the roles stay the thing you read. */
.chip-quiet[b-zpt3fv3zfj] {
    background: rgba(255, 255, 255, 0.05);
    border-color: rgba(255, 255, 255, 0.15);
    opacity: 0.75;
}

.field[b-zpt3fv3zfj] {
    display: block;
    margin: 0 0 0.75rem;
}

.field span[b-zpt3fv3zfj] {
    display: block;
    font-size: 0.8rem;
    opacity: 0.6;
    margin-bottom: 0.3rem;
}

.field input[b-zpt3fv3zfj],
.field textarea[b-zpt3fv3zfj] {
    font: inherit;
    width: 100%;
    box-sizing: border-box;
    border-radius: 6px;
    padding: 0.45rem 0.6rem;
    background: rgba(0, 0, 0, 0.25);
    border: 1px solid rgba(255, 255, 255, 0.18);
    color: inherit;
}

button[b-zpt3fv3zfj] {
    font: inherit;
    font-size: 0.85rem;
    border-radius: 6px;
    padding: 0.35rem 0.8rem;
    cursor: pointer;
    border: 1px solid rgba(255, 255, 255, 0.18);
    background: rgba(255, 255, 255, 0.05);
    color: inherit;
}

button:hover:not(:disabled)[b-zpt3fv3zfj] { background: rgba(255, 255, 255, 0.12); }
button:disabled[b-zpt3fv3zfj] { opacity: 0.4; cursor: default; }

.primary[b-zpt3fv3zfj] {
    border-color: rgba(33, 150, 243, 0.6);
    background: rgba(33, 150, 243, 0.18);
}

.secondary[b-zpt3fv3zfj] { margin-top: 0.9rem; }

.decline:hover:not(:disabled)[b-zpt3fv3zfj] {
    border-color: rgba(176, 23, 30, 0.7);
    background: rgba(176, 23, 30, 0.15);
}

.notice[b-zpt3fv3zfj],
.refusal[b-zpt3fv3zfj],
.warn[b-zpt3fv3zfj] {
    border-radius: 8px;
    padding: 0.6rem 0.8rem;
    margin: 0 0 0.9rem;
    border: 1px solid transparent;
}

.notice[b-zpt3fv3zfj]  { background: rgba(76, 175, 80, 0.1);  border-color: rgba(76, 175, 80, 0.35); }
.refusal[b-zpt3fv3zfj] { background: rgba(176, 23, 30, 0.12); border-color: rgba(176, 23, 30, 0.45); }

/* "This is the only time the key is shown." Amber rather than red: it is not an error, it is the
   one instruction on the page that cannot be undone by reloading. */
.warn[b-zpt3fv3zfj] { background: rgba(255, 152, 0, 0.12); border-color: rgba(255, 152, 0, 0.45); }

/* The object id, and the key. Selectable, wrapping, and never truncated: somebody may well be
   reading these to a colleague, and an ellipsis in the middle of a GUID is useless. */
.subject[b-zpt3fv3zfj],
.secret[b-zpt3fv3zfj],
.config[b-zpt3fv3zfj] {
    font-family: var(--font-mono);
    font-size: 0.78rem;
    background: rgba(0, 0, 0, 0.3);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 6px;
    padding: 0.55rem 0.7rem;
    margin: 0;
    white-space: pre-wrap;
    word-break: break-all;
    user-select: all;
}

.config[b-zpt3fv3zfj] {
    word-break: normal;
    overflow-x: auto;
}

.copy-row[b-zpt3fv3zfj] {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
}

.copy-row > pre[b-zpt3fv3zfj] { flex: 1; min-width: 0; }

.copy[b-zpt3fv3zfj] { flex: none; }

.grid[b-zpt3fv3zfj] {
    width: 100%;
    border-collapse: collapse;
    margin-top: 1rem;
}

.grid th[b-zpt3fv3zfj] {
    text-align: left;
    font-weight: 600;
    opacity: 0.55;
    font-size: 0.78rem;
    padding: 0 0.5rem 0.35rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.grid td[b-zpt3fv3zfj] {
    padding: 0.45rem 0.5rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    font-size: 0.82rem;
}

.grid code[b-zpt3fv3zfj] { font-size: 0.76rem; }

/* Revoked or expired. Still listed — a key somebody revoked last week is worth seeing, and a row
   that vanishes leaves them wondering whether the revoke worked. */
.spent[b-zpt3fv3zfj] { opacity: 0.4; }

.tag[b-zpt3fv3zfj] {
    font-size: 0.68rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    opacity: 0.7;
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 4px;
    padding: 0.05rem 0.35rem;
}

html[data-theme="light"] .onboarding section[b-zpt3fv3zfj] { background: rgba(0, 0, 0, 0.02); border-color: rgba(0, 0, 0, 0.1); }
html[data-theme="light"] .field input[b-zpt3fv3zfj],
html[data-theme="light"] .field textarea[b-zpt3fv3zfj] { background: #fff; border-color: rgba(0, 0, 0, 0.2); }
html[data-theme="light"] button[b-zpt3fv3zfj] { border-color: rgba(0, 0, 0, 0.18); background: rgba(0, 0, 0, 0.03); }
html[data-theme="light"] button:hover:not(:disabled)[b-zpt3fv3zfj] { background: rgba(0, 0, 0, 0.07); }
html[data-theme="light"] .subject[b-zpt3fv3zfj],
html[data-theme="light"] .secret[b-zpt3fv3zfj],
html[data-theme="light"] .config[b-zpt3fv3zfj] { background: rgba(0, 0, 0, 0.04); border-color: rgba(0, 0, 0, 0.12); }
html[data-theme="light"] .grid th[b-zpt3fv3zfj] { border-bottom-color: rgba(0, 0, 0, 0.12); }
html[data-theme="light"] .grid td[b-zpt3fv3zfj] { border-bottom-color: rgba(0, 0, 0, 0.07); }
/* /Components/Pages/Seats.razor.rz.scp.css */
.seats[b-hn7s9olk4z] {
    max-width: 68rem;
    margin: 0 auto;
    padding: 1.5rem 1.25rem 4rem;
}

.seats__head h1[b-hn7s9olk4z] {
    margin: 0 0 .35rem;
    font-size: 1.6rem;
    letter-spacing: -.01em;
}

.seats__lede[b-hn7s9olk4z] {
    margin: 0 0 1.75rem;
    max-width: 46rem;
    color: var(--text-muted, #6b7280);
    line-height: 1.55;
}

.seats__muted[b-hn7s9olk4z] {
    color: var(--text-muted, #6b7280);
}

.seats__banner[b-hn7s9olk4z] {
    margin: 0 0 1.25rem;
    padding: .7rem .9rem;
    border-radius: .4rem;
    border-left: 3px solid;
    line-height: 1.5;
}

.seats__banner--ok[b-hn7s9olk4z] {
    border-color: #16a34a;
    background: color-mix(in srgb, #16a34a 8%, transparent);
}

.seats__banner--warn[b-hn7s9olk4z] {
    border-color: #d97706;
    background: color-mix(in srgb, #d97706 10%, transparent);
}

/* A decision the administrator has to take, above the grid rather than inside a cell. */
.seats__notice[b-hn7s9olk4z] {
    margin: 0 0 .75rem;
    padding: .7rem .9rem;
    border-radius: .4rem;
    border-left: 3px solid #d97706;
    background: color-mix(in srgb, #d97706 8%, transparent);
    line-height: 1.55;
    font-size: .9rem;
}

.seats__notice--warn[b-hn7s9olk4z] {
    border-left-color: #b45309;
    background: color-mix(in srgb, #d97706 14%, transparent);
}

.seats__notice--quiet[b-hn7s9olk4z] {
    border-left-color: var(--border, #d1d5db);
    background: var(--surface-2, #f9fafb);
    color: var(--text-muted, #6b7280);
}

/* ── The grid ───────────────────────────────────────────────────────────────────────────────────
   People down the side, products across the top. The person column is the anchor and stays put
   while the product columns stay narrow: the eye reads DOWN a column to count seats and ACROSS a
   row to see one person, and both have to work. */

.seats__grid[b-hn7s9olk4z] {
    width: 100%;
    border-collapse: collapse;
    font-size: .9rem;
    margin-bottom: 2rem;
}

.seats__grid th[b-hn7s9olk4z] {
    text-align: left;
    padding: .5rem .6rem;
    font-weight: 600;
    font-size: .78rem;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: var(--text-muted, #6b7280);
    border-bottom: 1px solid var(--border, #e5e7eb);
    vertical-align: bottom;
}

.seats__grid td[b-hn7s9olk4z] {
    padding: .45rem .6rem;
    border-bottom: 1px solid var(--border-subtle, #f3f4f6);
    vertical-align: middle;
}

.seats__grid tbody tr:hover[b-hn7s9olk4z] {
    background: var(--surface-2, #f9fafb);
}

.seats__grid-person[b-hn7s9olk4z] {
    width: 40%;
    text-align: left;
}

.seats__grid-app[b-hn7s9olk4z] {
    width: 12%;
    text-align: center;
}

.seats__grid-app-name[b-hn7s9olk4z] {
    display: block;
    text-transform: none;
    font-size: .85rem;
    letter-spacing: 0;
    color: var(--text, #111827);
}

/* Armed and unarmed must not look alike. An enforcement state nobody can read off the screen is how
   "it is switched on" becomes something people believe rather than know. */
.seats__grid-app-state[b-hn7s9olk4z] {
    display: block;
    margin-top: .15rem;
    font-size: .7rem;
    font-weight: 500;
    text-transform: none;
    letter-spacing: 0;
}

.seats__grid-app-state.is-armed[b-hn7s9olk4z] {
    color: #1d4ed8;
}

.seats__grid-app-state.is-shadow[b-hn7s9olk4z] {
    color: var(--text-muted, #9ca3af);
    font-style: italic;
}

.seats__grid-cell[b-hn7s9olk4z] {
    text-align: center;
    white-space: nowrap;
}

.seats__grid-cell.is-held[b-hn7s9olk4z] {
    background: color-mix(in srgb, #16a34a 6%, transparent);
}

/* Covered by a seat that includes this one. Tinted like a held cell but fainter, because the person
   HAS the capability — what they do not have, and do not need, is a second seat for it. */
.seats__grid-cell.is-covered[b-hn7s9olk4z] {
    background: color-mix(in srgb, #16a34a 3%, transparent);
}

.seats__check[b-hn7s9olk4z] {
    width: 1.05rem;
    height: 1.05rem;
    cursor: pointer;
    accent-color: #16a34a;
}

/* A box that will not respond has to LOOK as though it will not, or the page reads as broken rather
   than as full. The cursor and the hover title do the explaining. */
.seats__check:disabled[b-hn7s9olk4z] {
    cursor: not-allowed;
    opacity: .3;
}

.seats__grid tfoot td[b-hn7s9olk4z],
.seats__grid tfoot th[b-hn7s9olk4z] {
    border-top: 2px solid var(--border, #e5e7eb);
    border-bottom: 0;
    padding-top: .6rem;
    text-align: center;
    vertical-align: top;
}

.seats__grid tfoot th[b-hn7s9olk4z] {
    text-align: left;
}

.seats__grid-count[b-hn7s9olk4z] {
    display: block;
    font-weight: 600;
    font-size: 1rem;
    font-variant-numeric: tabular-nums;
}

.seats__grid-note[b-hn7s9olk4z] {
    display: block;
    font-size: .75rem;
    color: var(--text-muted, #6b7280);
}

.seats__grid-total.is-full .seats__grid-count[b-hn7s9olk4z] {
    color: #b45309;
}

.seats__grid-total.is-over .seats__grid-count[b-hn7s9olk4z] {
    color: #b45309;
}

.seats__grid-total.is-over[b-hn7s9olk4z] {
    background: color-mix(in srgb, #d97706 8%, transparent);
}

.seats__link[b-hn7s9olk4z] {
    display: inline-block;
    margin-top: .3rem;
    padding: 0;
    border: 0;
    background: none;
    color: var(--link, #2563eb);
    font-size: .75rem;
    text-decoration: underline;
    cursor: pointer;
}

.seats__sub-head[b-hn7s9olk4z] {
    margin: 1.5rem 0 .5rem;
    font-size: .95rem;
    color: var(--text-muted, #6b7280);
}

.seats__table[b-hn7s9olk4z] {
    width: 100%;
    border-collapse: collapse;
    font-size: .9rem;
}

.seats__table th[b-hn7s9olk4z] {
    text-align: left;
    padding: .4rem .6rem;
    font-weight: 600;
    font-size: .78rem;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: var(--text-muted, #6b7280);
    border-bottom: 1px solid var(--border, #e5e7eb);
}

.seats__table td[b-hn7s9olk4z] {
    padding: .55rem .6rem;
    border-bottom: 1px solid var(--border-subtle, #f3f4f6);
    vertical-align: top;
}

.seats__name[b-hn7s9olk4z] {
    font-weight: 500;
}

.seats__sub[b-hn7s9olk4z] {
    display: block;
    font-size: .8rem;
    color: var(--text-muted, #6b7280);
}

.seats__count[b-hn7s9olk4z] {
    padding: .15rem .5rem;
    border-radius: 1rem;
    font-size: .8rem;
    background: var(--surface-2, #f3f4f6);
    color: var(--text-muted, #6b7280);
    white-space: nowrap;
}

.seats__count--armed[b-hn7s9olk4z] {
    color: #1d4ed8;
    background: color-mix(in srgb, #2563eb 12%, transparent);
}

.seats__count--shadow[b-hn7s9olk4z] {
    font-style: italic;
}

.seats__tag[b-hn7s9olk4z] {
    display: inline-block;
    margin-left: .4rem;
    padding: .05rem .4rem;
    border-radius: .8rem;
    font-size: .72rem;
    background: var(--surface-2, #f3f4f6);
    color: var(--text-muted, #6b7280);
}

.seats__tag--warn[b-hn7s9olk4z] {
    color: #b45309;
    background: color-mix(in srgb, #d97706 15%, transparent);
}

.seats__tag--trial[b-hn7s9olk4z] {
    color: #1d4ed8;
    background: color-mix(in srgb, #2563eb 12%, transparent);
}

.seats__tag--covered[b-hn7s9olk4z] {
    color: #15803d;
    background: color-mix(in srgb, #16a34a 12%, transparent);
}

.seats__idle[b-hn7s9olk4z] {
    color: var(--text-muted, #9ca3af);
    font-style: italic;
    font-size: .72rem;
    margin-left: .4rem;
}

.seats__btn[b-hn7s9olk4z] {
    padding: .3rem .65rem;
    border: 1px solid var(--border, #d1d5db);
    border-radius: .3rem;
    background: var(--surface, #fff);
    font-size: .85rem;
    cursor: pointer;
}

.seats__btn:hover:not(:disabled)[b-hn7s9olk4z] {
    background: var(--surface-2, #f3f4f6);
}

.seats__btn:disabled[b-hn7s9olk4z] {
    opacity: .45;
    cursor: not-allowed;
}

.seats__btn--quiet[b-hn7s9olk4z] {
    color: var(--text-muted, #6b7280);
}

.seats__btn--small[b-hn7s9olk4z] {
    margin-left: .4rem;
    padding: .15rem .5rem;
    font-size: .8rem;
}

.seats__dialog-backdrop[b-hn7s9olk4z] {
    position: fixed;
    inset: 0;
    background: rgb(0 0 0 / 45%);
    display: grid;
    place-items: center;
    z-index: 50;
}

.seats__dialog[b-hn7s9olk4z] {
    width: min(34rem, 92vw);
    padding: 1.25rem 1.4rem 1.1rem;
    border-radius: .5rem;
    background: var(--surface, #fff);
    box-shadow: 0 10px 40px rgb(0 0 0 / 25%);
}

.seats__dialog h2[b-hn7s9olk4z] {
    margin: 0 0 .6rem;
    font-size: 1.1rem;
}

.seats__dialog p[b-hn7s9olk4z] {
    margin: 0 0 .8rem;
    line-height: 1.55;
}

.seats__dialog-confirm[b-hn7s9olk4z] {
    color: var(--text-muted, #6b7280);
    font-size: .9rem;
}

.seats__input[b-hn7s9olk4z] {
    width: 100%;
    padding: .45rem .6rem;
    border: 1px solid var(--border, #d1d5db);
    border-radius: .3rem;
    font: inherit;
}

.seats__dialog-actions[b-hn7s9olk4z] {
    display: flex;
    justify-content: flex-end;
    gap: .5rem;
    margin-top: 1rem;
}
/* /Components/Pages/Settings.razor.rz.scp.css */
.settings[b-r52xwhhkel] {
    max-width: 60rem;
    padding: 1.5rem;
}

.settings__lede[b-r52xwhhkel] {
    color: var(--text-muted, #94a3b8);
    max-width: 46rem;
    margin-bottom: 1.5rem;
}

.settings__muted[b-r52xwhhkel] {
    color: var(--text-muted, #94a3b8);
}

.settings__list[b-r52xwhhkel] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.settings__row[b-r52xwhhkel] {
    border: 1px solid rgba(148, 163, 184, 0.25);
    border-radius: 0.4rem;
    padding: 0.75rem 1rem;
}

/* An open row is where the attention is — lift it out of the list rather than letting it blend in. */
.settings__row--open[b-r52xwhhkel] {
    border-color: rgba(59, 130, 246, 0.5);
    background: rgba(59, 130, 246, 0.05);
}

.settings__head[b-r52xwhhkel] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.settings__name[b-r52xwhhkel] {
    font-family: var(--font-mono, ui-monospace, monospace);
    font-weight: 600;
}

.settings__badge[b-r52xwhhkel] {
    font-size: 0.75rem;
    padding: 0.1rem 0.5rem;
    border-radius: 1rem;
    background: rgba(148, 163, 184, 0.18);
    color: var(--text-muted, #94a3b8);
}

/* Customised is the state worth spotting at a glance: it means this site no longer tracks the
   shipped default, so a product change will not reach it. */
.settings__badge--custom[b-r52xwhhkel] {
    background: rgba(59, 130, 246, 0.18);
    color: #93c5fd;
}

.settings__meta[b-r52xwhhkel] {
    font-size: 0.8rem;
    color: var(--text-muted, #94a3b8);
}

.settings__btn[b-r52xwhhkel] {
    margin-left: auto;
    padding: 0.3rem 0.8rem;
    border-radius: 0.3rem;
    border: 1px solid rgba(148, 163, 184, 0.35);
    background: transparent;
    color: inherit;
    cursor: pointer;
}

.settings__actions .settings__btn[b-r52xwhhkel] {
    margin-left: 0;
}

.settings__btn--primary[b-r52xwhhkel] {
    border-color: rgba(59, 130, 246, 0.6);
    font-weight: 600;
}

.settings__btn:disabled[b-r52xwhhkel] {
    opacity: 0.5;
    cursor: default;
}

.settings__editor[b-r52xwhhkel] {
    width: 100%;
    margin-top: 0.75rem;
    padding: 0.6rem;
    border-radius: 0.3rem;
    border: 1px solid rgba(148, 163, 184, 0.35);
    background: rgba(0, 0, 0, 0.2);
    color: inherit;
    font-family: var(--font-mono, ui-monospace, monospace);
    font-size: 0.85rem;
    line-height: 1.5;
    resize: vertical;
}

.settings__actions[b-r52xwhhkel] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    margin-top: 0.6rem;
}

.settings__msg.ok[b-r52xwhhkel]  { color: #4ade80; font-size: 0.85rem; }
.settings__msg.err[b-r52xwhhkel] { color: #f87171; font-size: 0.85rem; }

.settings__default[b-r52xwhhkel] {
    margin-top: 0.9rem;
    font-size: 0.85rem;
}

.settings__default summary[b-r52xwhhkel] {
    cursor: pointer;
    color: var(--text-muted, #94a3b8);
}

.settings__pre[b-r52xwhhkel] {
    margin-top: 0.5rem;
    padding: 0.6rem;
    max-height: 22rem;
    overflow: auto;
    border-radius: 0.3rem;
    background: rgba(0, 0, 0, 0.25);
    font-size: 0.78rem;
    line-height: 1.45;
    white-space: pre-wrap;
    word-break: break-word;
}

.settings__h2[b-r52xwhhkel] {
    margin: 2rem 0 0.4rem;
    font-size: 1.05rem;
}

.settings__input[b-r52xwhhkel] {
    width: 100%;
    padding: 0.45rem 0.6rem;
    border-radius: 0.3rem;
    border: 1px solid rgba(148, 163, 184, 0.35);
    background: rgba(0, 0, 0, 0.2);
    color: inherit;
    font-family: var(--font-mono, ui-monospace, monospace);
    font-size: 0.85rem;
}

/* A day count is at most three characters. A full-width box for it reads as an invitation to type a
   sentence, and makes the two adjacent fields look like they take different kinds of value. */
.settings__input--narrow[b-r52xwhhkel] {
    width: 6rem;
}

/* Label/value pairs — a fixed first column keeps the values aligned so the block scans vertically. */
.settings__grid[b-r52xwhhkel] {
    display: grid;
    grid-template-columns: 16rem 1fr;
    gap: 0.35rem 1rem;
    align-items: baseline;
}
/* /Components/Pages/SitesOverview.razor.rz.scp.css */
.sites-page[b-2uo4heokmk] {
    padding: 1.5rem 2rem;
    max-width: 1200px;
    margin: 0 auto;
}

.sites-header[b-2uo4heokmk] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1.5rem;
}

.sites-title[b-2uo4heokmk] {
    font-size: 1.6rem;
    font-weight: 700;
    margin: 0;
}

.sites-controls[b-2uo4heokmk] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.hours-select[b-2uo4heokmk] {
    font-size: 0.85rem;
}

.last-updated[b-2uo4heokmk] {
    font-size: 0.78rem;
    color: #546E7A;
}

.sites-loading[b-2uo4heokmk], .sites-empty[b-2uo4heokmk] {
    text-align: center;
    padding: 3rem;
    color: #546E7A;
}

.sites-empty code[b-2uo4heokmk] {
    background: rgba(255,255,255,0.07);
    padding: 0.2rem 0.4rem;
    border-radius: 4px;
    font-size: 0.85rem;
}

/* ── Table ───────────────────────────────────────────────────────────── */

.sites-table[b-2uo4heokmk] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
    margin-bottom: 2rem;
}

.sites-table thead th[b-2uo4heokmk] {
    text-align: left;
    padding: 0.6rem 1rem;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #546E7A;
    border-bottom: 1px solid rgba(255,255,255,0.08);
}

.sites-table thead th.num[b-2uo4heokmk] { text-align: right; }

.sites-table td[b-2uo4heokmk] {
    padding: 0.75rem 1rem;
    border-bottom: 1px solid rgba(255,255,255,0.05);
    vertical-align: middle;
}

.sites-table td.num[b-2uo4heokmk] { text-align: right; font-variant-numeric: tabular-nums; }

.site-row[b-2uo4heokmk] {
    cursor: pointer;
    transition: background 0.15s;
}

.site-row:hover[b-2uo4heokmk] { background: rgba(255,255,255,0.04); }

.site-name[b-2uo4heokmk] { font-weight: 700; font-size: 1rem; }
.site-code[b-2uo4heokmk] { font-size: 0.72rem; color: #546E7A; margin-top: 0.1rem; }

.line-row[b-2uo4heokmk] { background: rgba(255,255,255,0.01); }
.line-name[b-2uo4heokmk] { font-size: 0.82rem; color: #78909C; padding-left: 1.5rem !important; }
.line-indent[b-2uo4heokmk] { color: #37474F; margin-right: 0.35rem; }
.line-stations[b-2uo4heokmk] { font-size: 0.72rem; color: #37474F; margin-left: 0.4rem; }

/* ── KPI colour classes ──────────────────────────────────────────────── */
td.good[b-2uo4heokmk] { color: #4CAF50; font-weight: 600; }
td.warn[b-2uo4heokmk] { color: #FF9800; font-weight: 600; }
td.poor[b-2uo4heokmk] { color: #B0171E; font-weight: 600; }

/* ── Yield chart section ─────────────────────────────────────────────── */

.sites-chart-section[b-2uo4heokmk] { margin-top: 1rem; }
.chart-title[b-2uo4heokmk] {
    font-size: 1rem;
    font-weight: 600;
    color: #78909C;
    margin-bottom: 0.75rem;
}

/* ── Light theme ──────────────────────────────────────────────────────── */
html[data-theme="light"] .last-updated[b-2uo4heokmk]    { color: #64748b; }
html[data-theme="light"] .sites-loading[b-2uo4heokmk],
html[data-theme="light"] .sites-empty[b-2uo4heokmk]     { color: #64748b; }
html[data-theme="light"] .sites-empty code[b-2uo4heokmk] { background: rgba(0,0,0,0.05); }
html[data-theme="light"] .sites-table thead th[b-2uo4heokmk] { color: #4a6278; border-bottom-color: #d1dce8; }
html[data-theme="light"] .sites-table td[b-2uo4heokmk]       { border-bottom-color: #e8eef4; }
html[data-theme="light"] .site-row:hover[b-2uo4heokmk]       { background: rgba(0,0,0,0.03); }
html[data-theme="light"] .line-name[b-2uo4heokmk]            { color: #4a6278; }
html[data-theme="light"] .line-indent[b-2uo4heokmk]          { color: #94a3b8; }
html[data-theme="light"] .line-stations[b-2uo4heokmk]        { color: #64748b; }
html[data-theme="light"] .chart-title[b-2uo4heokmk]          { color: #4a6278; }
/* /Components/Pages/Statistics.razor.rz.scp.css */
.statistics-page[b-mbofi03n77] {
    padding: 20px;
    max-width: 1600px;
    margin: 0 auto;
}

.statistics-page h1[b-mbofi03n77] {
    margin-bottom: 20px;
    color: #e2e8f0;
}

/* Filter Bar */
.filter-bar[b-mbofi03n77] {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: 16px;
    background: #1b2736;
    padding: 16px 20px;
    border-radius: 8px;
    border: 1px solid #2c3e50;
    margin-bottom: 24px;
}

.filter-field[b-mbofi03n77] {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.filter-field label[b-mbofi03n77] {
    font-weight: 600;
    font-size: 12px;
    color: #8fa8be;
    text-transform: uppercase;
    letter-spacing: 0.4px;
}

.filter-field input[type="number"][b-mbofi03n77] {
    width: 100px;
    padding: 7px 10px;
    border: 1px solid #2c3e50;
    border-radius: 4px;
    font-size: 14px;
    background: #141d26;
    color: #e2e8f0;
}

.filter-field input[type="number"]:focus[b-mbofi03n77] {
    outline: none;
    border-color: #38bdf8;
}

.filter-field input[type="text"][b-mbofi03n77] {
    width: 180px;
    padding: 7px 10px;
    border: 1px solid #2c3e50;
    border-radius: 4px;
    font-size: 14px;
    background: #141d26;
    color: #e2e8f0;
}

.filter-field input[type="text"][b-mbofi03n77]::placeholder {
    color: #506070;
}

.filter-field input[type="text"]:focus[b-mbofi03n77] {
    outline: none;
    border-color: #38bdf8;
}

.btn-refresh[b-mbofi03n77] {
    padding: 8px 20px;
    background-color: #38bdf8;
    color: #0f1923;
    border: none;
    border-radius: 4px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    transition: background-color 0.2s;
    align-self: flex-end;
}

.btn-refresh:hover:not(:disabled)[b-mbofi03n77] {
    background-color: #7dd3fc;
}

.btn-refresh:disabled[b-mbofi03n77] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* Status messages */
.status-message[b-mbofi03n77] {
    padding: 40px;
    text-align: center;
    color: #8fa8be;
    font-style: italic;
    font-size: 14px;
}

.status-message.error[b-mbofi03n77] {
    color: #f87171;
}

/* Summary line */
.results-summary[b-mbofi03n77] {
    font-size: 14px;
    color: #c8d9e6;
    margin-bottom: 10px;
}

.filtered-note[b-mbofi03n77] {
    color: #8fa8be;
    font-style: italic;
}

/* Table wrapper */
.table-wrapper[b-mbofi03n77] {
    overflow-x: auto;
}

/* Data table */
.data-table[b-mbofi03n77] {
    width: 100%;
    border-collapse: collapse;
    background: #1b2736;
    border-radius: 8px;
    overflow: hidden;
    border: 1px solid #2c3e50;
}

.data-table thead[b-mbofi03n77] {
    background: #141d26;
}

.data-table th[b-mbofi03n77] {
    padding: 11px 14px;
    text-align: left;
    font-weight: 600;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    white-space: nowrap;
    color: #8fa8be;
    border-bottom: 1px solid #2c3e50;
}

.data-table td[b-mbofi03n77] {
    padding: 10px 14px;
    border-bottom: 1px solid #243040;
    font-size: 14px;
    color: #c8d9e6;
}

.data-table tbody tr:last-child td[b-mbofi03n77] {
    border-bottom: none;
}

.data-table tbody tr.capability-row:hover[b-mbofi03n77] {
    background-color: #1f3044;
}

/* Expand column */
.col-expand[b-mbofi03n77] {
    width: 28px;
    text-align: center;
}

.expand-icon[b-mbofi03n77] {
    display: inline-block;
    transition: transform 0.15s, color 0.15s;
    cursor: pointer;
    font-size: 11px;
    color: #506070;
}

.expand-icon.expanded[b-mbofi03n77] {
    transform: rotate(90deg);
    color: #38bdf8;
}

.capability-row[b-mbofi03n77] {
    cursor: pointer;
}

.capability-row.row-expanded[b-mbofi03n77] {
    background-color: #1a2d42;
}

.capability-row.row-expanded td[b-mbofi03n77] {
    font-weight: 600;
    color: #e2e8f0;
}

/* Column sizing */
.col-num[b-mbofi03n77] {
    text-align: right;
    white-space: nowrap;
}

.col-name[b-mbofi03n77] {
    font-family: var(--font-mono);
    font-size: 13px;
    color: #7dd3fc;
}

.col-step[b-mbofi03n77],
.col-test[b-mbofi03n77] {
    font-size: 13px;
    color: #8fa8be;
    max-width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Cpk badges */
.cpk-badge[b-mbofi03n77] {
    display: inline-block;
    padding: 2px 10px;
    border-radius: 12px;
    font-weight: 700;
    font-size: 13px;
    font-variant-numeric: tabular-nums;
}

.cpk-bad[b-mbofi03n77]      { background: rgba(248, 113, 113, 0.15); color: #f87171; }
.cpk-marginal[b-mbofi03n77] { background: rgba(251, 191,  36, 0.12); color: #fbbf24; }
.cpk-good[b-mbofi03n77]     { background: rgba( 52, 211, 153, 0.12); color: #34d399; }
.cpk-unknown[b-mbofi03n77]  { background: rgba(143, 168, 190, 0.12); color: #8fa8be; }

/* Expanded detail row */
.detail-row td[b-mbofi03n77] {
    padding: 0;
    border-bottom: 2px solid #2c3e50;
    background-color: #141d26;
}

.detail-loading[b-mbofi03n77] {
    padding: 16px 20px;
    font-style: italic;
    color: #8fa8be;
    font-size: 13px;
}

.detail-panel[b-mbofi03n77] {
    padding: 16px 24px;
}

.detail-stats[b-mbofi03n77] {
    display: flex;
    flex-wrap: wrap;
    gap: 20px 32px;
    margin-bottom: 10px;
}

.stat-item[b-mbofi03n77] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.stat-label[b-mbofi03n77] {
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.4px;
    color: #506070;
}

.stat-value[b-mbofi03n77] {
    font-size: 15px;
    font-variant-numeric: tabular-nums;
    color: #e2e8f0;
}

.pass-count[b-mbofi03n77] { color: #34d399; font-weight: 700; }
.fail-count[b-mbofi03n77] { color: #f87171; font-weight: 700; }
.separator[b-mbofi03n77]  { color: #506070; }

.limits-note[b-mbofi03n77] {
    margin-top: 8px;
    padding: 8px 12px;
    background: rgba(251, 191, 36, 0.08);
    border-left: 3px solid #fbbf24;
    border-radius: 3px;
    font-size: 13px;
    color: #fbbf24;
}

/* ── Responsive ──────────────────────────────────────────────────────────── */

/* Tablet — filter bar wraps, minor density reduction */
@media (max-width: 1024px) {
    .statistics-page[b-mbofi03n77] {
        padding: 16px;
    }

    .filter-bar[b-mbofi03n77] {
        gap: 12px;
    }

    .filter-field input[type="text"][b-mbofi03n77] {
        width: 140px;
    }
}

/* Small tablet / large phone — stack filters, hide secondary columns */
@media (max-width: 768px) {
    .statistics-page[b-mbofi03n77] {
        padding: 12px;
    }

    .statistics-page h1[b-mbofi03n77] {
        font-size: 1.3rem;
    }

    .filter-bar[b-mbofi03n77] {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 10px;
    }

    .filter-field input[type="text"][b-mbofi03n77],
    .filter-field input[type="number"][b-mbofi03n77] {
        width: 100%;
        box-sizing: border-box;
    }

    .btn-refresh[b-mbofi03n77] {
        grid-column: 1 / -1;
        width: 100%;
    }

    .table-wrapper[b-mbofi03n77] {
        -webkit-overflow-scrolling: touch;
    }

    /* Hide secondary columns at this breakpoint */
    .col-step[b-mbofi03n77],
    .col-test[b-mbofi03n77],
    .col-limits[b-mbofi03n77],
    .col-mean[b-mbofi03n77] {
        display: none;
    }

    .detail-stats[b-mbofi03n77] {
        gap: 14px 20px;
    }
}

/* Mobile — single-column layout, minimal table */
@media (max-width: 480px) {
    .statistics-page[b-mbofi03n77] {
        padding: 8px;
    }

    .statistics-page h1[b-mbofi03n77] {
        font-size: 1.15rem;
        margin-bottom: 14px;
    }

    .filter-bar[b-mbofi03n77] {
        grid-template-columns: 1fr;
        padding: 12px;
    }

    /* Also hide Station and Cp on small phones — keep: name, samples, Cpk */
    .col-station[b-mbofi03n77],
    .col-cp[b-mbofi03n77] {
        display: none;
    }

    .col-name[b-mbofi03n77] {
        font-size: 12px;
        max-width: 140px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .data-table th[b-mbofi03n77],
    .data-table td[b-mbofi03n77] {
        padding: 8px 8px;
        font-size: 12px;
    }

    .cpk-badge[b-mbofi03n77] {
        padding: 2px 6px;
        font-size: 12px;
    }

    .results-summary[b-mbofi03n77] {
        font-size: 12px;
    }

    .detail-stats[b-mbofi03n77] {
        grid-template-columns: 1fr 1fr;
        display: grid;
        gap: 12px 16px;
    }

    .stat-value[b-mbofi03n77] {
        font-size: 13px;
    }
}

/* ── Light theme ─────────────────────────────────────────────────────── */

html[data-theme="light"] .statistics-page h1[b-mbofi03n77] { color: #1a2535; }
html[data-theme="light"] .filter-bar[b-mbofi03n77] { background: #ffffff; border-color: #d1dce8; }
html[data-theme="light"] .filter-field label[b-mbofi03n77] { color: #4a6278; }
html[data-theme="light"] .filter-field input[type="number"][b-mbofi03n77],
html[data-theme="light"] .filter-field input[type="text"][b-mbofi03n77] { background: #f8fafc; border-color: #d1dce8; color: #1a2535; }
html[data-theme="light"] .filter-field input[type="text"][b-mbofi03n77]::placeholder { color: #7a9ab0; }
html[data-theme="light"] .status-message[b-mbofi03n77] { color: #4a6278; }
html[data-theme="light"] .results-summary[b-mbofi03n77] { color: #4a6278; }
html[data-theme="light"] .filtered-note[b-mbofi03n77] { color: #7a9ab0; }
html[data-theme="light"] .data-table[b-mbofi03n77] { background: #ffffff; border-color: #d1dce8; }
html[data-theme="light"] .data-table thead[b-mbofi03n77] { background: #f0f4f8; }
html[data-theme="light"] .data-table th[b-mbofi03n77] { color: #4a6278; border-bottom-color: #d1dce8; }
html[data-theme="light"] .data-table td[b-mbofi03n77] { color: #1a2535; border-bottom-color: #e8eef4; }
html[data-theme="light"] .data-table tbody tr.capability-row:hover[b-mbofi03n77] { background-color: #f0f4f8; }
html[data-theme="light"] .col-name[b-mbofi03n77] { color: #0284c7; }
html[data-theme="light"] .col-step[b-mbofi03n77],
html[data-theme="light"] .col-test[b-mbofi03n77] { color: #4a6278; }
html[data-theme="light"] .capability-row.row-expanded[b-mbofi03n77] { background-color: #e8f4fc; }
html[data-theme="light"] .capability-row.row-expanded td[b-mbofi03n77] { color: #1a2535; }
html[data-theme="light"] .detail-row td[b-mbofi03n77] { background-color: #f8fafc; border-bottom-color: #d1dce8; }
html[data-theme="light"] .stat-label[b-mbofi03n77] { color: #4a6278; }
html[data-theme="light"] .stat-value[b-mbofi03n77] { color: #1a2535; }
html[data-theme="light"] .separator[b-mbofi03n77] { color: #94a3b8; }
html[data-theme="light"] .expand-icon[b-mbofi03n77] { color: #7a9ab0; }
/* /Components/Pages/TestResultDetail.razor.rz.scp.css */
/* ── Test Result Detail — same design-token set as TestResults ──────────── */

.test-result-detail-page[b-1norijzfg0] {
    --tr-bg:           #1E2A35;
    --tr-surface:      #253340;
    --tr-surface-alt:  #2C3E4F;
    --tr-border:       rgba(255,255,255,0.20);
    --tr-text:         #E0E4EA;
    --tr-text-muted:   #8A9BB0;
    --tr-input-bg:     #1a2530;
    --tr-input-focus:  #1e2e3e;
    --tr-accent:       #2196F3;
    --tr-pass:         #4CAF50;
    --tr-fail:         #E53935;
    --tr-warn:         #FF9800;
    --tr-aborted:      #546E7A;
    --tr-header-bg:    #151f28;
    --tr-color-scheme: dark;

    padding: 24px;
    max-width: 1200px;
    margin: 0 auto;
    color: var(--tr-text);
}

html[data-theme="light"] .test-result-detail-page[b-1norijzfg0] {
    --tr-bg:           #f8fafc;
    --tr-surface:      #ffffff;
    --tr-surface-alt:  #f0f4f8;
    --tr-border:       #d1dce8;
    --tr-text:         #1a2535;
    --tr-text-muted:   #4a6278;
    --tr-input-bg:     #ffffff;
    --tr-input-focus:  #f0f4f8;
    --tr-accent:       #0284c7;
    --tr-header-bg:    #f0f4f8;
    --tr-color-scheme: light;
}

/* ── Page chrome ────────────────────────────────────────────────────────── */

.loading[b-1norijzfg0] {
    padding: 60px;
    text-align: center;
    color: var(--tr-text-muted);
    font-size: 18px;
    font-style: italic;
}

.error-message[b-1norijzfg0] {
    padding: 40px;
    text-align: center;
    background: rgba(229,57,53,0.1);
    border: 1px solid rgba(229,57,53,0.4);
    border-radius: 8px;
}

.error-message h2[b-1norijzfg0] { color: #E57373; margin-bottom: 10px; }
.error-message p[b-1norijzfg0]  { color: var(--tr-text); }

.report-actions[b-1norijzfg0] {
    display: flex;
    gap: 10px;
    margin-bottom: 20px;
}

.btn[b-1norijzfg0] {
    padding: 8px 18px;
    border-radius: 5px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    text-decoration: none;
    display: inline-block;
    border: none;
    transition: filter 0.15s;
}

.btn-secondary[b-1norijzfg0] {
    background: var(--tr-surface);
    color: var(--tr-text);
    border: 1px solid var(--tr-border);
}

.btn-secondary:hover[b-1norijzfg0] { filter: brightness(1.1); }

.btn-primary[b-1norijzfg0] {
    background: var(--tr-accent);
    color: white;
}

.btn-primary:hover[b-1norijzfg0] { filter: brightness(1.15); }

.report-title[b-1norijzfg0] {
    font-size: 1.4rem;
    font-weight: 700;
    color: var(--tr-text);
    margin-bottom: 20px;
}

/* ── Artifacts table (rendered directly in this component) ──────────────── */

.artifacts-section[b-1norijzfg0] {
    margin-top: 24px;
    border: 1px solid var(--tr-border);
    border-radius: 8px;
    overflow: hidden;
    background: var(--tr-surface);
}

.artifacts-section h4[b-1norijzfg0] {
    margin: 0;
    padding: 12px 18px;
    background: var(--tr-header-bg);
    border-bottom: 1px solid var(--tr-border);
    font-size: 14px;
    color: var(--tr-text);
    font-weight: 600;
}

.artifacts-table[b-1norijzfg0] {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}

.artifacts-table th[b-1norijzfg0] {
    padding: 9px 14px;
    text-align: left;
    background: var(--tr-header-bg);
    color: var(--tr-text-muted);
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.4px;
    font-weight: 600;
    border-bottom: 1px solid var(--tr-border);
}

.artifacts-table td[b-1norijzfg0] {
    padding: 9px 14px;
    border-bottom: 1px solid var(--tr-border);
    color: var(--tr-text);
}

.artifacts-table tbody tr:last-child td[b-1norijzfg0] { border-bottom: none; }
.artifacts-table tbody tr:hover[b-1norijzfg0] { background: var(--tr-surface-alt); }

.file-name[b-1norijzfg0] { font-family: var(--font-mono); font-weight: 600; }

.btn-download[b-1norijzfg0] {
    display: inline-block;
    padding: 4px 12px;
    background: transparent;
    border: 1px solid var(--tr-accent);
    color: var(--tr-accent);
    border-radius: 4px;
    font-size: 12px;
    text-decoration: none;
    white-space: nowrap;
    transition: background 0.15s, color 0.15s;
}

.btn-download:hover[b-1norijzfg0] { background: var(--tr-accent); color: white; }

/* ── Child component styles (mirrors TestResults.razor.css ::deep rules) ── */

[b-1norijzfg0] .no-data { padding: 48px; text-align: center; color: var(--tr-text-muted); font-style: italic; }

[b-1norijzfg0] .data-table {
    width: 100%;
    border-collapse: collapse;
    background: var(--tr-surface);
    border-radius: 8px;
    overflow: hidden;
    border: 1px solid var(--tr-border);
}

[b-1norijzfg0] .data-table thead { background: var(--tr-header-bg); color: var(--tr-text-muted); }

[b-1norijzfg0] .data-table th {
    padding: 11px 15px;
    text-align: left;
    font-weight: 600;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    border-bottom: 1px solid var(--tr-border);
}

[b-1norijzfg0] .data-table td {
    padding: 10px 15px;
    border-bottom: 1px solid var(--tr-border);
    font-size: 14px;
    color: var(--tr-text);
}

[b-1norijzfg0] .data-table tbody tr:last-child td { border-bottom: none; }
[b-1norijzfg0] .data-table tbody tr:hover { background: var(--tr-surface-alt); }

[b-1norijzfg0] .col-expand { width: 30px; text-align: center; }

[b-1norijzfg0] .expand-icon {
    display: inline-block;
    transition: transform 0.2s, color 0.2s;
    cursor: pointer;
    font-size: 12px;
    color: var(--tr-text-muted);
}

[b-1norijzfg0] .expand-icon.expanded { transform: rotate(90deg); color: var(--tr-accent); }

[b-1norijzfg0] .step-row { cursor: pointer; }

[b-1norijzfg0] .verdict-pass         { color: var(--tr-pass);    font-weight: 600; }
[b-1norijzfg0] .verdict-fail         { color: var(--tr-fail);    font-weight: 600; }
[b-1norijzfg0] .verdict-undetermined { color: var(--tr-warn);    font-weight: 600; }
[b-1norijzfg0] .verdict-aborted      { color: var(--tr-aborted); font-weight: 600; }
[b-1norijzfg0] .verdict-error        { color: var(--tr-fail);    font-weight: 600; }

[b-1norijzfg0] .verdict-row-pass         { border-left: 3px solid var(--tr-pass);    background: rgba(76,175,80,0.07); }
[b-1norijzfg0] .verdict-row-fail         { border-left: 3px solid var(--tr-fail);    background: rgba(229,57,53,0.07); }
[b-1norijzfg0] .verdict-row-undetermined { border-left: 3px solid var(--tr-warn);    background: rgba(255,152,0,0.07); }
[b-1norijzfg0] .verdict-row-aborted      { border-left: 3px solid var(--tr-aborted); background: rgba(84,110,122,0.07); }

/* ── ReportHeader ─────────────────────────────────────────────────────── */

[b-1norijzfg0] .report-header {
    padding: 18px 20px;
    border-radius: 8px;
    margin-bottom: 20px;
    border: 1px solid var(--tr-border);
    background: var(--tr-surface);
}

[b-1norijzfg0] .report-header.verdict-pass         { border-left: 4px solid var(--tr-pass); }
[b-1norijzfg0] .report-header.verdict-fail         { border-left: 4px solid var(--tr-fail); }
[b-1norijzfg0] .report-header.verdict-undetermined { border-left: 4px solid var(--tr-warn); }
[b-1norijzfg0] .report-header.verdict-aborted      { border-left: 4px solid var(--tr-aborted); }

[b-1norijzfg0] .verdict-badge {
    display: inline-block;
    padding: 5px 16px;
    border-radius: 20px;
    font-weight: 700;
    font-size: 13px;
    color: white;
    margin-bottom: 12px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

[b-1norijzfg0] .verdict-badge.verdict-pass         { background: var(--tr-pass); }
[b-1norijzfg0] .verdict-badge.verdict-fail         { background: var(--tr-fail); }
[b-1norijzfg0] .verdict-badge.verdict-undetermined { background: var(--tr-warn); color: #333; }
[b-1norijzfg0] .verdict-badge.verdict-aborted      { background: var(--tr-aborted); }

[b-1norijzfg0] .header-table { width: 100%; border-collapse: collapse; }
[b-1norijzfg0] .header-table td { padding: 4px 10px; font-size: 13px; color: var(--tr-text); }
[b-1norijzfg0] .header-table td.label { font-weight: 600; color: var(--tr-text-muted); width: 15%; white-space: nowrap; }
[b-1norijzfg0] .header-table td.value { width: 35%; font-family: var(--font-mono); word-break: break-word; }

[b-1norijzfg0] .verdict-text-pass         { color: var(--tr-pass);    font-weight: 700; }
[b-1norijzfg0] .verdict-text-fail         { color: var(--tr-fail);    font-weight: 700; }
[b-1norijzfg0] .verdict-text-undetermined { color: var(--tr-warn);    font-weight: 700; }
[b-1norijzfg0] .verdict-text-aborted      { color: var(--tr-aborted); font-weight: 700; }

[b-1norijzfg0] .config-snapshot-section { margin-top: 12px; border-top: 1px solid var(--tr-border); padding-top: 8px; }

[b-1norijzfg0] .config-snapshot-toggle {
    background: none;
    border: none;
    cursor: pointer;
    font-size: 13px;
    font-weight: 600;
    color: var(--tr-text-muted);
    padding: 4px 0;
    display: flex;
    align-items: center;
    gap: 6px;
}
[b-1norijzfg0] .config-snapshot-toggle:hover { color: var(--tr-accent); }
[b-1norijzfg0] .toggle-icon { font-size: 11px; width: 12px; text-align: center; }

[b-1norijzfg0] .config-snapshot-table { width: 100%; border-collapse: collapse; margin-top: 8px; font-size: 13px; }
[b-1norijzfg0] .config-snapshot-table th {
    text-align: left;
    padding: 6px 10px;
    background: var(--tr-header-bg);
    border-bottom: 1px solid var(--tr-border);
    font-weight: 600;
    color: var(--tr-text-muted);
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}
[b-1norijzfg0] .config-snapshot-table td { padding: 5px 10px; border-bottom: 1px solid var(--tr-border); }
[b-1norijzfg0] .config-snapshot-table .config-key   { font-family: var(--font-mono); color: var(--tr-text-muted); white-space: nowrap; width: 30%; }
[b-1norijzfg0] .config-snapshot-table .config-value { font-family: var(--font-mono); color: var(--tr-text); word-break: break-all; }

/* ── Step results ─────────────────────────────────────────────────────── */

[b-1norijzfg0] .step-results-table { margin-top: 20px; }
[b-1norijzfg0] .step-results-table h4 { margin-bottom: 10px; color: var(--tr-text); font-size: 15px; font-weight: 600; }

[b-1norijzfg0] .col-order    { width: 50px; text-align: center; }
[b-1norijzfg0] .col-name     { min-width: 200px; }
[b-1norijzfg0] .col-duration { width: 100px; }
[b-1norijzfg0] .col-verdict  { width: 100px; }
[b-1norijzfg0] .col-error    { max-width: 200px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

[b-1norijzfg0] .iteration-badge   { display: inline-block; padding: 1px 6px; background: var(--tr-surface-alt); border-radius: 10px; font-size: 11px; color: var(--tr-text-muted); margin-left: 6px; }
[b-1norijzfg0] .forced-badge      { margin-left: 4px; color: var(--tr-warn); }
[b-1norijzfg0] .measurement-count { font-size: 12px; color: var(--tr-text-muted); margin-left: 6px; }

[b-1norijzfg0] .measurement-row    { background: var(--tr-bg); font-size: 13px; }
[b-1norijzfg0] .measurement-row td { padding: 6px 15px; }
[b-1norijzfg0] .measurement-indent { padding-left: 40px !important; }

[b-1norijzfg0] .measurement-type-badge {
    display: inline-block;
    padding: 1px 6px;
    border-radius: 4px;
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
    margin-right: 6px;
    color: white;
}

[b-1norijzfg0] .type-numeric { background: #1565C0; }
[b-1norijzfg0] .type-boolean { background: #00838F; }
[b-1norijzfg0] .type-string  { background: #6A1B9A; }

/* Optional grouping label (YAML `group`) */
[b-1norijzfg0] .measurement-group-badge {
    display: inline-block;
    padding: 1px 6px;
    margin-left: 8px;
    border-radius: 4px;
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
    background: #ede7f6;
    color: #4a2f7a;
}
[b-1norijzfg0] .units { color: var(--tr-text-muted); font-size: 12px; margin-left: 2px; }

/* ── Pagination / buttons ─────────────────────────────────────────────── */

[b-1norijzfg0] .paged-step-results { margin-top: 10px; }

[b-1norijzfg0] .pagination         { display: flex; align-items: center; justify-content: center; gap: 15px; margin-top: 20px; padding: 15px; }
[b-1norijzfg0] .step-pagination    { display: flex; align-items: center; gap: 12px; margin-top: 10px; padding: 8px 0; font-size: 13px; color: var(--tr-text-muted); }
[b-1norijzfg0] .step-pagination-info { font-size: 13px; color: var(--tr-text-muted); margin-top: 8px; padding: 4px 0; }
[b-1norijzfg0] .page-indicator     { font-size: 13px; color: var(--tr-text-muted); }

[b-1norijzfg0] .btn-sm { padding: 5px 12px; font-size: 12px; background: var(--tr-surface-alt); color: var(--tr-text); border: 1px solid var(--tr-border); border-radius: 4px; cursor: pointer; transition: background 0.15s; }
[b-1norijzfg0] .btn-sm:hover:not(:disabled) { background: var(--tr-input-focus); }
[b-1norijzfg0] .btn-sm:disabled { opacity: 0.4; cursor: not-allowed; }

[b-1norijzfg0] .btn-outline { background: transparent; border: 1px solid var(--tr-accent); color: var(--tr-accent); border-radius: 4px; padding: 4px 10px; cursor: pointer; text-decoration: none; font-size: 12px; white-space: nowrap; }
[b-1norijzfg0] .btn-outline:hover { background: var(--tr-accent); color: white; }

[b-1norijzfg0] .tag-badge { display: inline-block; padding: 2px 8px; margin: 2px 4px 2px 0; background: var(--tr-surface-alt); border: 1px solid var(--tr-border); border-radius: 10px; font-size: 11px; color: var(--tr-text-muted); white-space: nowrap; }

/* ── Execution logs ───────────────────────────────────────────────────── */

[b-1norijzfg0] .execution-logs-section { margin-top: 20px; }

[b-1norijzfg0] .logs-toggle { background: var(--tr-surface); border: 1px solid var(--tr-border); border-radius: 6px; padding: 8px 16px; cursor: pointer; font-size: 14px; color: var(--tr-text); display: flex; align-items: center; gap: 8px; transition: background 0.15s; }
[b-1norijzfg0] .logs-toggle:hover { background: var(--tr-surface-alt); }
[b-1norijzfg0] .log-count   { font-size: 12px; color: var(--tr-text-muted); }
[b-1norijzfg0] .logs-loading, [b-1norijzfg0] .logs-empty { padding: 20px; text-align: center; color: var(--tr-text-muted); font-style: italic; }

[b-1norijzfg0] .log-table-panel  { margin-top: 10px; border: 1px solid var(--tr-border); border-radius: 6px; overflow: hidden; background: var(--tr-surface); }
[b-1norijzfg0] .log-table-header { display: flex; align-items: center; justify-content: space-between; padding: 10px 15px; background: var(--tr-header-bg); border-bottom: 1px solid var(--tr-border); }
[b-1norijzfg0] .log-table-header h3 { margin: 0; font-size: 14px; color: var(--tr-text); }
[b-1norijzfg0] .log-table-scroll { max-height: 400px; overflow-y: auto; }

[b-1norijzfg0] .log-data-table { width: 100%; border-collapse: collapse; font-size: 12px; font-family: var(--font-mono); }

[b-1norijzfg0] .log-column-headers th { padding: 6px 10px; background: var(--tr-header-bg); color: var(--tr-text-muted); text-align: left; font-size: 11px; text-transform: uppercase; letter-spacing: 0.3px; position: sticky; top: 0; }
[b-1norijzfg0] .log-column-filters td { padding: 3px 6px; background: var(--tr-surface); border-bottom: 1px solid var(--tr-border); }
[b-1norijzfg0] .log-column-filters input { width: 100%; background: var(--tr-input-bg); border: 1px solid var(--tr-border); border-radius: 3px; padding: 2px 6px; color: var(--tr-text); font-size: 11px; color-scheme: var(--tr-color-scheme); }

[b-1norijzfg0] .log-data-table tbody tr    { border-bottom: 1px solid var(--tr-border); }
[b-1norijzfg0] .log-data-table tbody tr td { padding: 4px 10px; color: var(--tr-text); }

[b-1norijzfg0] .level-error   { background: rgba(229,57,53,0.12); }
[b-1norijzfg0] .level-warning { background: rgba(255,152,0,0.10); }

[b-1norijzfg0] .log-table-footer { padding: 6px 15px; background: var(--tr-header-bg); border-top: 1px solid var(--tr-border); font-size: 11px; color: var(--tr-text-muted); }

/* ── Nested executions ────────────────────────────────────────────────── */

[b-1norijzfg0] .nested-executions-section { margin-top: 25px; }
[b-1norijzfg0] .nested-execution  { border: 1px solid var(--tr-border); border-radius: 6px; margin-bottom: 10px; overflow: hidden; }
[b-1norijzfg0] .nested-header     { padding: 10px 15px; background: var(--tr-surface); cursor: pointer; display: flex; align-items: center; gap: 10px; }
[b-1norijzfg0] .nested-header:hover { background: var(--tr-surface-alt); }
[b-1norijzfg0] .nested-title      { flex: 1; font-size: 14px; color: var(--tr-text); }
[b-1norijzfg0] .nested-verdict    { font-weight: 600; font-size: 13px; }
[b-1norijzfg0] .nested-body       { padding: 15px; border-top: 1px solid var(--tr-border); background: var(--tr-bg); }

[b-1norijzfg0] .depth-1 { margin-left: 20px; }
[b-1norijzfg0] .depth-2 { margin-left: 40px; }
[b-1norijzfg0] .depth-3 { margin-left: 60px; }

[b-1norijzfg0] .step-count-badge { display: inline-block; padding: 1px 8px; background: var(--tr-surface-alt); border-radius: 10px; font-size: 11px; color: var(--tr-text-muted); margin-left: 8px; }

/* ── Plotly charts (PlotlyChart child component) ──────────────────────── */

[b-1norijzfg0] .plotly-chart-wrapper {
    background: var(--tr-header-bg);
    border: 1px solid var(--tr-border);
    border-radius: 6px;
    overflow: hidden;
    margin-bottom: 16px;
}

[b-1norijzfg0] .plotly-chart-header {
    padding: 8px 14px;
    background: var(--tr-surface);
    border-bottom: 1px solid var(--tr-border);
    display: flex;
    align-items: center;
    gap: 12px;
}

[b-1norijzfg0] .plotly-chart-name { font-family: var(--font-mono); font-size: 13px; font-weight: 600; color: var(--tr-text); }
[b-1norijzfg0] .plotly-chart-desc { font-size: 12px; color: var(--tr-text-muted); }

[b-1norijzfg0] .plotly-chart-container { width: 100%; min-height: 360px; }

[b-1norijzfg0] .plotly-chart-loading,
[b-1norijzfg0] .plotly-chart-error {
    padding: 24px;
    text-align: center;
    font-size: 13px;
    color: var(--tr-text-muted);
    font-style: italic;
}
[b-1norijzfg0] .plotly-chart-error { color: var(--tr-fail); }

/* ── Print ────────────────────────────────────────────────────────────── */

@media print {
    .no-print[b-1norijzfg0], .report-actions[b-1norijzfg0] { display: none !important; }

    [b-1norijzfg0] .artifact-charts-section,
    [b-1norijzfg0] .plotly-chart-wrapper { display: none !important; }

    body[b-1norijzfg0], html[b-1norijzfg0], .test-result-detail-page[b-1norijzfg0] {
        background: white !important;
        color: black !important;
    }
}

/* ── Responsive ───────────────────────────────────────────────────────── */

@media (max-width: 768px) {
    .test-result-detail-page[b-1norijzfg0] { padding: 12px; }
    .report-actions[b-1norijzfg0] { flex-wrap: wrap; }
    .report-actions .btn[b-1norijzfg0] { flex: 1; text-align: center; }
    .artifact-image-figure[b-1norijzfg0] { max-width: 100%; }
}

@media (max-width: 480px) {
    .artifacts-table thead th:nth-child(2)[b-1norijzfg0] { display: none; }
    .artifacts-table tbody td:nth-child(2)[b-1norijzfg0] { display: none; }
}
/* /Components/Pages/TestResults.razor.rz.scp.css */
/* ── Test Results page — dark theme to match Dashboard ────────────────────── */

.test-results-page[b-04rappqf53] {
    --tr-bg:          #1E2A35;
    --tr-surface:     #253340;
    --tr-surface-alt: #2C3E4F;
    --tr-border:      rgba(255,255,255,0.20);
    --tr-text:        #E0E4EA;
    --tr-text-muted:  #8A9BB0;
    --tr-input-bg:    #1a2530;
    --tr-input-focus: #1e2e3e;
    --tr-accent:      #2196F3;
    --tr-pass:        #4CAF50;
    --tr-fail:        #E53935;
    --tr-warn:        #FF9800;
    --tr-aborted:     #546E7A;
    --tr-header-bg:   #151f28;
    --tr-color-scheme: dark;
}

html[data-theme="light"] .test-results-page[b-04rappqf53] {
    --tr-bg:          #f8fafc;
    --tr-surface:     #ffffff;
    --tr-surface-alt: #f0f4f8;
    --tr-border:      #d1dce8;
    --tr-text:        #1a2535;
    --tr-text-muted:  #4a6278;
    --tr-input-bg:    #ffffff;
    --tr-input-focus: #f0f4f8;
    --tr-accent:      #0284c7;
    --tr-header-bg:   #f0f4f8;
    --tr-color-scheme: light;
}

.test-results-page[b-04rappqf53] {
    padding: 24px;
    max-width: 1600px;
    margin: 0 auto;
    color: var(--tr-text);
}

.test-results-header[b-04rappqf53] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 24px;
}

.error-message[b-04rappqf53] {
    margin-bottom: 16px;
    padding: 16px 20px;
    background: rgba(229,57,53,0.10);
    border: 1px solid rgba(229,57,53,0.40);
    border-radius: 8px;
}

.error-message h2[b-04rappqf53] {
    margin: 0 0 6px;
    color: #E57373;
    font-size: 1.05rem;
    font-weight: 600;
}

.error-message p[b-04rappqf53] {
    margin: 0;
    color: var(--tr-text);
}

.test-results-header h1[b-04rappqf53] {
    margin: 0;
    color: var(--tr-text);
    font-size: 1.6rem;
    font-weight: 600;
}

.test-results-header .btn-secondary[b-04rappqf53] {
    background: var(--tr-surface);
    color: var(--tr-text);
    border: 1px solid var(--tr-border);
    border-radius: 5px;
    padding: 7px 16px;
    font-size: 13px;
    text-decoration: none;
    cursor: pointer;
    transition: background 0.15s;
}

.test-results-header .btn-secondary:hover[b-04rappqf53] { background: var(--tr-surface-alt); }

[b-04rappqf53] .search-form {
    background: var(--tr-surface);
    padding: 20px;
    border-radius: 8px;
    margin-bottom: 28px;
    border: 1px solid var(--tr-border);
}

[b-04rappqf53] .search-form h3 {
    margin-top: 0;
    margin-bottom: 16px;
    color: var(--tr-text);
    font-size: 15px;
    font-weight: 600;
}

[b-04rappqf53] .search-fields { margin-bottom: 16px; }

[b-04rappqf53] .search-row {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 14px;
    margin-bottom: 12px;
}

[b-04rappqf53] .search-row .field label {
    display: block;
    margin-bottom: 5px;
    font-weight: 600;
    color: var(--tr-text);
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

[b-04rappqf53] .search-row .field .form-control {
    width: 100%;
    padding: 8px 12px;
    background: var(--tr-input-bg);
    border: 1px solid var(--tr-border);
    border-radius: 5px;
    font-size: 14px;
    color: var(--tr-text);
    transition: background 0.15s, border-color 0.15s;
    color-scheme: var(--tr-color-scheme);
}

[b-04rappqf53] .search-row .field .form-control:focus {
    outline: none;
    background: var(--tr-input-focus);
    border-color: var(--tr-accent);
    box-shadow: 0 0 0 2px rgba(33, 150, 243, 0.25);
}

[b-04rappqf53] .search-row .field .form-control::placeholder { color: var(--tr-text-muted); }

[b-04rappqf53] .search-actions { display: flex; gap: 10px; }

[b-04rappqf53] .search-actions .btn {
    padding: 8px 20px;
    border: none;
    border-radius: 5px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: filter 0.15s;
}

[b-04rappqf53] .search-actions .btn-primary { background: var(--tr-accent); color: white; }
[b-04rappqf53] .search-actions .btn-primary:hover:not(:disabled) { filter: brightness(1.15); }

[b-04rappqf53] .search-actions .btn-secondary {
    background: var(--tr-surface-alt);
    color: var(--tr-text);
    border: 1px solid var(--tr-border);
}

[b-04rappqf53] .search-actions .btn-secondary:hover:not(:disabled) { filter: brightness(1.15); }
[b-04rappqf53] .search-actions .btn:disabled { opacity: 0.45; cursor: not-allowed; }

[b-04rappqf53] .results-table-container { margin-top: 10px; }
[b-04rappqf53] .results-summary { font-size: 13px; color: var(--tr-text-muted); margin-bottom: 10px; }
[b-04rappqf53] .no-data { padding: 48px; text-align: center; color: var(--tr-text-muted); font-style: italic; }

[b-04rappqf53] .data-table {
    width: 100%;
    border-collapse: collapse;
    background: var(--tr-surface);
    border-radius: 8px;
    overflow: hidden;
    border: 1px solid var(--tr-border);
}

[b-04rappqf53] .data-table thead { background: var(--tr-header-bg); color: var(--tr-text-muted); }

[b-04rappqf53] .data-table th {
    padding: 11px 15px;
    text-align: left;
    font-weight: 600;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    border-bottom: 1px solid var(--tr-border);
}

[b-04rappqf53] .data-table td {
    padding: 10px 15px;
    border-bottom: 1px solid var(--tr-border);
    font-size: 14px;
    color: var(--tr-text);
}

[b-04rappqf53] .data-table tbody tr:last-child td { border-bottom: none; }
[b-04rappqf53] .data-table tbody tr:hover { background: var(--tr-surface-alt); }

[b-04rappqf53] .col-expand { width: 30px; text-align: center; }

[b-04rappqf53] .expand-icon {
    display: inline-block;
    transition: transform 0.2s, color 0.2s;
    cursor: pointer;
    font-size: 12px;
    color: var(--tr-text-muted);
}

[b-04rappqf53] .expand-icon.expanded { transform: rotate(90deg); color: var(--tr-accent); }

[b-04rappqf53] .result-row { cursor: pointer; }
[b-04rappqf53] .result-row.expanded { background: var(--tr-surface-alt); font-weight: 600; }

[b-04rappqf53] .verdict-pass         { color: var(--tr-pass);    font-weight: 600; }
[b-04rappqf53] .verdict-fail         { color: var(--tr-fail);    font-weight: 600; }
[b-04rappqf53] .verdict-undetermined { color: var(--tr-warn);    font-weight: 600; }
[b-04rappqf53] .verdict-aborted      { color: var(--tr-aborted); font-weight: 600; }
[b-04rappqf53] .verdict-error        { color: var(--tr-fail);    font-weight: 600; }

[b-04rappqf53] .verdict-row-pass         { border-left: 3px solid var(--tr-pass);    background: rgba(76,175,80,0.07); }
[b-04rappqf53] .verdict-row-fail         { border-left: 3px solid var(--tr-fail);    background: rgba(229,57,53,0.07); }
[b-04rappqf53] .verdict-row-undetermined { border-left: 3px solid var(--tr-warn);    background: rgba(255,152,0,0.07); }
[b-04rappqf53] .verdict-row-aborted      { border-left: 3px solid var(--tr-aborted); background: rgba(84,110,122,0.07); }

[b-04rappqf53] .inline-detail-row > td { padding: 0; border-bottom: 2px solid var(--tr-border); }
[b-04rappqf53] .inline-detail { padding: 20px; background: var(--tr-bg); }
[b-04rappqf53] .loading-detail { padding: 20px; text-align: center; color: var(--tr-text-muted); font-style: italic; }

[b-04rappqf53] .report-header {
    padding: 18px 20px;
    border-radius: 8px;
    margin-bottom: 20px;
    border: 1px solid var(--tr-border);
    background: var(--tr-surface);
}

[b-04rappqf53] .report-header.verdict-pass         { border-left: 4px solid var(--tr-pass); }
[b-04rappqf53] .report-header.verdict-fail         { border-left: 4px solid var(--tr-fail); }
[b-04rappqf53] .report-header.verdict-undetermined { border-left: 4px solid var(--tr-warn); }
[b-04rappqf53] .report-header.verdict-aborted      { border-left: 4px solid var(--tr-aborted); }

[b-04rappqf53] .verdict-badge {
    display: inline-block;
    padding: 5px 16px;
    border-radius: 20px;
    font-weight: 700;
    font-size: 13px;
    color: white;
    margin-bottom: 12px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

[b-04rappqf53] .verdict-badge.verdict-pass         { background: var(--tr-pass); }
[b-04rappqf53] .verdict-badge.verdict-fail         { background: var(--tr-fail); }
[b-04rappqf53] .verdict-badge.verdict-undetermined { background: var(--tr-warn); color: #333; }
[b-04rappqf53] .verdict-badge.verdict-aborted      { background: var(--tr-aborted); }

[b-04rappqf53] .header-table { width: 100%; border-collapse: collapse; }

[b-04rappqf53] .header-table td { padding: 4px 10px; font-size: 13px; color: var(--tr-text); }

[b-04rappqf53] .header-table td.label {
    font-weight: 600;
    color: var(--tr-text-muted);
    width: 15%;
    white-space: nowrap;
}

[b-04rappqf53] .header-table td.value {
    width: 35%;
    font-family: var(--font-mono);
    word-break: break-word;
}

[b-04rappqf53] .verdict-text-pass         { color: var(--tr-pass);    font-weight: 700; }
[b-04rappqf53] .verdict-text-fail         { color: var(--tr-fail);    font-weight: 700; }
[b-04rappqf53] .verdict-text-undetermined { color: var(--tr-warn);    font-weight: 700; }
[b-04rappqf53] .verdict-text-aborted      { color: var(--tr-aborted); font-weight: 700; }

[b-04rappqf53] .config-snapshot-section { margin-top: 12px; border-top: 1px solid var(--tr-border); padding-top: 8px; }

[b-04rappqf53] .config-snapshot-toggle {
    background: none;
    border: none;
    cursor: pointer;
    font-size: 13px;
    font-weight: 600;
    color: var(--tr-text-muted);
    padding: 4px 0;
    display: flex;
    align-items: center;
    gap: 6px;
}

[b-04rappqf53] .config-snapshot-toggle:hover { color: var(--tr-accent); }
[b-04rappqf53] .toggle-icon { font-size: 11px; width: 12px; text-align: center; }

[b-04rappqf53] .config-snapshot-table { width: 100%; border-collapse: collapse; margin-top: 8px; font-size: 13px; }

[b-04rappqf53] .config-snapshot-table th {
    text-align: left;
    padding: 6px 10px;
    background: var(--tr-header-bg);
    border-bottom: 1px solid var(--tr-border);
    font-weight: 600;
    color: var(--tr-text-muted);
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

[b-04rappqf53] .config-snapshot-table td { padding: 5px 10px; border-bottom: 1px solid var(--tr-border); }
[b-04rappqf53] .config-snapshot-table .config-key { font-family: var(--font-mono); color: var(--tr-text-muted); white-space: nowrap; width: 30%; }
[b-04rappqf53] .config-snapshot-table .config-value { font-family: var(--font-mono); color: var(--tr-text); word-break: break-all; }

[b-04rappqf53] .step-results-table { margin-top: 20px; }
[b-04rappqf53] .step-results-table h4 { margin-bottom: 10px; color: var(--tr-text); font-size: 15px; font-weight: 600; }
[b-04rappqf53] .step-row { cursor: pointer; }

[b-04rappqf53] .col-order    { width: 50px; text-align: center; }
[b-04rappqf53] .col-name     { min-width: 200px; }
[b-04rappqf53] .col-duration { width: 100px; }
[b-04rappqf53] .col-verdict  { width: 100px; }
[b-04rappqf53] .col-error    { max-width: 200px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

[b-04rappqf53] .iteration-badge { display: inline-block; padding: 1px 6px; background: var(--tr-surface-alt); border-radius: 10px; font-size: 11px; color: var(--tr-text-muted); margin-left: 6px; }
[b-04rappqf53] .forced-badge { margin-left: 4px; color: var(--tr-warn); }
[b-04rappqf53] .measurement-count { font-size: 12px; color: var(--tr-text-muted); margin-left: 6px; }

/* ── Responsive ───────────────────────────────────────────────────────────── */

@media (max-width: 768px) {
    .test-results-page[b-04rappqf53] {
        padding: 12px;
    }

    .test-results-header[b-04rappqf53] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
        margin-bottom: 16px;
    }

    [b-04rappqf53] .search-row {
        grid-template-columns: 1fr;
    }

    [b-04rappqf53] .results-table-container {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    /* Wrap search actions */
    [b-04rappqf53] .search-actions {
        flex-wrap: wrap;
    }
}

@media (max-width: 480px) {
    /* Hide less-essential columns in the results table */
    [b-04rappqf53] .data-table thead th:nth-child(4),
    [b-04rappqf53] .data-table tbody td:nth-child(4) {
        display: none;
    }

    [b-04rappqf53] .header-table td.label,
    [b-04rappqf53] .header-table td.value {
        width: auto;
        display: block;
        padding: 2px 6px;
    }
}
[b-04rappqf53] .measurement-row { background: var(--tr-bg); font-size: 13px; }
[b-04rappqf53] .measurement-row td { padding: 6px 15px; }
[b-04rappqf53] .measurement-indent { padding-left: 40px !important; }

[b-04rappqf53] .measurement-type-badge {
    display: inline-block;
    padding: 1px 6px;
    border-radius: 4px;
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
    margin-right: 6px;
    color: white;
}

[b-04rappqf53] .type-numeric { background: #1565C0; }
[b-04rappqf53] .type-boolean { background: #00838F; }
[b-04rappqf53] .type-string  { background: #6A1B9A; }
[b-04rappqf53] .units { color: var(--tr-text-muted); font-size: 12px; margin-left: 2px; }

[b-04rappqf53] .nested-executions-section { margin-top: 25px; }

[b-04rappqf53] .nested-execution { border: 1px solid var(--tr-border); border-radius: 6px; margin-bottom: 10px; overflow: hidden; }
[b-04rappqf53] .nested-header { padding: 10px 15px; background: var(--tr-surface); cursor: pointer; display: flex; align-items: center; gap: 10px; }
[b-04rappqf53] .nested-header:hover { background: var(--tr-surface-alt); }
[b-04rappqf53] .nested-title { flex: 1; font-size: 14px; }
[b-04rappqf53] .nested-verdict { font-weight: 600; font-size: 13px; }
[b-04rappqf53] .nested-body { padding: 15px; border-top: 1px solid var(--tr-border); background: var(--tr-bg); }

[b-04rappqf53] .depth-1 { margin-left: 20px; }
[b-04rappqf53] .depth-2 { margin-left: 40px; }
[b-04rappqf53] .depth-3 { margin-left: 60px; }

[b-04rappqf53] .step-count-badge { display: inline-block; padding: 1px 8px; background: var(--tr-surface-alt); border-radius: 10px; font-size: 11px; color: var(--tr-text-muted); margin-left: 8px; }

[b-04rappqf53] .pagination { display: flex; align-items: center; justify-content: center; gap: 15px; margin-top: 20px; padding: 15px; }
[b-04rappqf53] .step-pagination { display: flex; align-items: center; gap: 12px; margin-top: 10px; padding: 8px 0; font-size: 13px; color: var(--tr-text-muted); }
[b-04rappqf53] .step-pagination-info { font-size: 13px; color: var(--tr-text-muted); margin-top: 8px; padding: 4px 0; }
[b-04rappqf53] .page-indicator { font-size: 13px; color: var(--tr-text-muted); }

[b-04rappqf53] .btn-sm { padding: 5px 12px; font-size: 12px; background: var(--tr-surface-alt); color: var(--tr-text); border: 1px solid var(--tr-border); border-radius: 4px; cursor: pointer; transition: background 0.15s; }
[b-04rappqf53] .btn-sm:hover:not(:disabled) { background: var(--tr-input-focus); }
[b-04rappqf53] .btn-sm:disabled { opacity: 0.4; cursor: not-allowed; }

[b-04rappqf53] .btn-outline { background: transparent; border: 1px solid var(--tr-accent); color: var(--tr-accent); border-radius: 4px; padding: 4px 10px; cursor: pointer; text-decoration: none; font-size: 12px; white-space: nowrap; }
[b-04rappqf53] .btn-outline:hover { background: var(--tr-accent); color: white; }

[b-04rappqf53] .tags-cell { max-width: 250px; }

[b-04rappqf53] .tag-badge { display: inline-block; padding: 2px 8px; margin: 2px 4px 2px 0; background: var(--tr-surface-alt); border: 1px solid var(--tr-border); border-radius: 10px; font-size: 11px; color: var(--tr-text-muted); white-space: nowrap; }

[b-04rappqf53] .paged-step-results { margin-top: 10px; }
[b-04rappqf53] .loading { padding: 30px; text-align: center; color: var(--tr-text-muted); font-style: italic; }

[b-04rappqf53] .execution-logs-section { margin-top: 20px; }

[b-04rappqf53] .logs-toggle { background: var(--tr-surface); border: 1px solid var(--tr-border); border-radius: 6px; padding: 8px 16px; cursor: pointer; font-size: 14px; color: var(--tr-text); display: flex; align-items: center; gap: 8px; transition: background 0.15s; }
[b-04rappqf53] .logs-toggle:hover { background: var(--tr-surface-alt); }
[b-04rappqf53] .log-count { font-size: 12px; color: var(--tr-text-muted); }
[b-04rappqf53] .logs-loading, [b-04rappqf53] .logs-empty { padding: 20px; text-align: center; color: var(--tr-text-muted); font-style: italic; }

[b-04rappqf53] .log-table-panel { margin-top: 10px; border: 1px solid var(--tr-border); border-radius: 6px; overflow: hidden; background: var(--tr-surface); }
[b-04rappqf53] .log-table-header { display: flex; align-items: center; justify-content: space-between; padding: 10px 15px; background: var(--tr-header-bg); border-bottom: 1px solid var(--tr-border); }
[b-04rappqf53] .log-table-header h3 { margin: 0; font-size: 14px; color: var(--tr-text); }
[b-04rappqf53] .log-table-scroll { max-height: 400px; overflow-y: auto; }

[b-04rappqf53] .log-data-table { width: 100%; border-collapse: collapse; font-size: 12px; font-family: var(--font-mono); }

[b-04rappqf53] .log-column-headers th { padding: 6px 10px; background: var(--tr-header-bg); color: var(--tr-text-muted); text-align: left; font-size: 11px; text-transform: uppercase; letter-spacing: 0.3px; position: sticky; top: 0; }
[b-04rappqf53] .log-column-filters td { padding: 3px 6px; background: var(--tr-surface); border-bottom: 1px solid var(--tr-border); }
[b-04rappqf53] .log-column-filters input { width: 100%; background: var(--tr-input-bg); border: 1px solid var(--tr-border); border-radius: 3px; padding: 2px 6px; color: var(--tr-text); font-size: 11px; color-scheme: var(--tr-color-scheme); }

[b-04rappqf53] .log-data-table tbody tr { border-bottom: 1px solid rgba(255,255,255,0.05); }
[b-04rappqf53] .log-data-table tbody tr td { padding: 4px 10px; color: var(--tr-text); }

[b-04rappqf53] .level-error   { background: rgba(229,57,53,0.12); }
[b-04rappqf53] .level-warning { background: rgba(255,152,0,0.10); }

[b-04rappqf53] .log-table-footer { padding: 6px 15px; background: var(--tr-header-bg); border-top: 1px solid var(--tr-border); font-size: 11px; color: var(--tr-text-muted); }
/* /Components/Pages/Usage.razor.rz.scp.css */
/* Dark-first (the app's default theme); light overrides via html[data-theme="light"]. */

.usage-page[b-mjtu4g5lz7] {
    max-width: 760px;
    padding: 1.5rem;
}

.usage-page h1[b-mjtu4g5lz7] {
    margin-bottom: 0.25rem;
}

.usage-sub[b-mjtu4g5lz7] {
    opacity: 0.6;
    margin: 0 0 1.25rem;
}

.usage-note[b-mjtu4g5lz7] {
    background: rgba(245, 158, 11, 0.12);
    border: 1px solid rgba(245, 158, 11, 0.3);
    border-radius: 8px;
    padding: 0.7rem 0.9rem;
    margin-bottom: 1rem;
}

.usage-card[b-mjtu4g5lz7] {
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 10px;
    padding: 1.1rem 1.25rem;
    margin-bottom: 1.1rem;
}

.usage-card__hdr[b-mjtu4g5lz7] {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.usage-card h2[b-mjtu4g5lz7] {
    font-size: 1rem;
    margin: 0;
    opacity: 0.85;
}

.usage-badge[b-mjtu4g5lz7] {
    font-size: 0.75rem;
    font-weight: 600;
    padding: 0.2rem 0.6rem;
    border-radius: 999px;
}

.usage-badge--ok[b-mjtu4g5lz7] {
    background: rgba(34, 197, 94, 0.16);
    color: #4ade80;
}

.usage-badge--over[b-mjtu4g5lz7] {
    background: rgba(239, 68, 68, 0.16);
    color: #f87171;
}

.usage-spark[b-mjtu4g5lz7] {
    width: 100%;
    height: 40px;
    margin: 0.75rem 0;
    display: block;
}

.usage-spark polyline[b-mjtu4g5lz7] {
    fill: none;
    stroke: #2563eb;
    stroke-width: 1.5;
    vector-effect: non-scaling-stroke;
}

.usage-grid[b-mjtu4g5lz7] {
    display: grid;
    grid-template-columns: 12rem 1fr;
    row-gap: 0.3rem;
    margin: 0;
}

.usage-grid dt[b-mjtu4g5lz7] {
    opacity: 0.55;
}

.usage-grid dd[b-mjtu4g5lz7] {
    margin: 0;
}

html[data-theme="light"] .usage-card[b-mjtu4g5lz7] {
    background: #fff;
    border-color: #e2e2e2;
}

html[data-theme="light"] .usage-spark polyline[b-mjtu4g5lz7] {
    stroke: #2563eb;
}

/* ── Seat holders: who makes up the rolling-week count ───────────────────────── */
/* Collapsed by default so the cards stay scannable; the view opens it when a scope
   is over cap, which is exactly when the names are the point. */

.usage-holders[b-mjtu4g5lz7] {
    margin-top: 0.9rem;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    padding-top: 0.7rem;
}

.usage-holders > summary[b-mjtu4g5lz7] {
    cursor: pointer;
    opacity: 0.7;
    font-size: 0.9rem;
    user-select: none;
}

.usage-holders > summary:hover[b-mjtu4g5lz7] {
    opacity: 1;
}

.usage-holders__table[b-mjtu4g5lz7] {
    width: 100%;
    border-collapse: collapse;
    margin-top: 0.6rem;
    font-size: 0.9rem;
}

.usage-holders__table th[b-mjtu4g5lz7] {
    text-align: left;
    font-weight: 500;
    opacity: 0.55;
    padding: 0.25rem 0.5rem 0.25rem 0;
}

.usage-holders__table td[b-mjtu4g5lz7] {
    padding: 0.25rem 0.5rem 0.25rem 0;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
}

/* The count column is a ratio, so it reads better right-aligned and tabular. */
.usage-holders__table th:last-child[b-mjtu4g5lz7],
.usage-holders__table td:last-child[b-mjtu4g5lz7] {
    text-align: right;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.usage-holders__note[b-mjtu4g5lz7] {
    margin-top: 0.9rem;
    font-size: 0.9rem;
}

html[data-theme="light"] .usage-holders[b-mjtu4g5lz7] {
    border-top-color: #e2e2e2;
}

html[data-theme="light"] .usage-holders__table td[b-mjtu4g5lz7] {
    border-top-color: #ececec;
}

/* ── Probable duplicate identities ───────────────────────────────────────────── */
/* Warning-toned rather than error-toned: it is a suggestion a human confirms, and a
   false positive should look dismissible rather than alarming. */

.usage-dupes[b-mjtu4g5lz7] {
    border-left: 3px solid #d97706;
}

.usage-dupes__list[b-mjtu4g5lz7] {
    margin: 0.6rem 0 0;
    padding-left: 1.1rem;
    line-height: 1.9;
}

.usage-dupes__also[b-mjtu4g5lz7] {
    opacity: 0.55;
    margin: 0 0.35rem;
    font-size: 0.85rem;
}

.usage-dupes__variant[b-mjtu4g5lz7] {
    opacity: 0.8;
    text-decoration: line-through;
    text-decoration-color: rgba(217, 119, 6, 0.7);
}

/* Neutral, not alarming: this note exists to stop a number being read as an interruption. */
.usage-note--info[b-mjtu4g5lz7] {
    border-left: 3px solid var(--border, #9ca3af);
}
/* /Components/Pages/Welcome.razor.rz.scp.css */
.welcome[b-j1feg36hs0] {
    max-width: 1080px;
    margin: 0 auto;
    padding: 0 1.25rem 4rem;
}

/* ── Hero ───────────────────────────────────────────────────────────── */
.welcome-hero[b-j1feg36hs0] {
    text-align: center;
    padding: 3.5rem 0 2.5rem;
}

.welcome-hero__inner[b-j1feg36hs0] {
    max-width: 760px;
    margin: 0 auto;
}

/* The E-Sharp AB logo is the page's title mark (transparent PNG, sits on any theme). */
.welcome-logo[b-j1feg36hs0] {
    width: auto;
    height: 132px;
    display: block;
    margin: 0 auto 1.75rem;
}

.welcome-hero__title[b-j1feg36hs0] {
    font-size: clamp(1.9rem, 4.5vw, 3rem);
    line-height: 1.1;
    letter-spacing: -0.02em;
    margin: 0 0 1rem;
}

.welcome-hero__lead[b-j1feg36hs0] {
    font-size: clamp(1.05rem, 2vw, 1.25rem);
    line-height: 1.55;
    opacity: 0.85;
    margin: 0 auto 2rem;
    max-width: 620px;
}

.welcome-hero__cta[b-j1feg36hs0] {
    display: flex;
    gap: 0.75rem;
    justify-content: center;
    flex-wrap: wrap;
}

.welcome-hero__note[b-j1feg36hs0] {
    margin-top: 1.25rem;
    font-size: 0.85rem;
    opacity: 0.6;
}

/* ── Buttons ────────────────────────────────────────────────────────── */
.welcome-btn[b-j1feg36hs0] {
    display: inline-block;
    padding: 0.7rem 1.4rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.98rem;
    text-decoration: none;
    transition: transform 0.08s ease, background-color 0.15s ease, border-color 0.15s ease;
    border: 1px solid transparent;
}

.welcome-btn:active[b-j1feg36hs0] { transform: translateY(1px); }

.welcome-btn--primary[b-j1feg36hs0] {
    background: var(--brand-red, #B0171E);
    color: #fff;
}

.welcome-btn--primary:hover[b-j1feg36hs0] { background: var(--brand-red-dark, #8C1118); }

.welcome-btn--ghost[b-j1feg36hs0] {
    border-color: rgba(255, 255, 255, 0.28);
    color: inherit;
}

.welcome-btn--ghost:hover[b-j1feg36hs0] { border-color: rgba(255, 255, 255, 0.55); }

html[data-theme="light"] .welcome-btn--ghost[b-j1feg36hs0] { border-color: rgba(0, 0, 0, 0.22); }
html[data-theme="light"] .welcome-btn--ghost:hover[b-j1feg36hs0] { border-color: rgba(0, 0, 0, 0.45); }

/* ── Sections ───────────────────────────────────────────────────────── */
.welcome-section[b-j1feg36hs0] { padding: 2.5rem 0; }

.welcome-section__title[b-j1feg36hs0] {
    text-align: center;
    font-size: clamp(1.4rem, 3vw, 1.9rem);
    letter-spacing: -0.01em;
    margin: 0 0 1.75rem;
}

.welcome-section__intro[b-j1feg36hs0] {
    text-align: center;
    max-width: 680px;
    margin: -0.75rem auto 1.75rem;
    opacity: 0.8;
    line-height: 1.6;
}

/* ── Intent → test steps ────────────────────────────────────────────── */
.welcome-steps[b-j1feg36hs0] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 1rem;
}

.welcome-step[b-j1feg36hs0] {
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.09);
    border-radius: 12px;
    padding: 1.4rem;
}

html[data-theme="light"] .welcome-step[b-j1feg36hs0] { background: #fff; border-color: #e2e8f0; box-shadow: 0 1px 3px rgba(0,0,0,0.04); }

.welcome-step__num[b-j1feg36hs0] {
    width: 2rem; height: 2rem; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    background: var(--brand-red, #B0171E); color: #fff; font-weight: 700;
    margin-bottom: 0.75rem;
}

.welcome-step__title[b-j1feg36hs0] { font-size: 1.1rem; margin: 0 0 0.4rem; }
.welcome-step__desc[b-j1feg36hs0] { margin: 0; opacity: 0.78; line-height: 1.5; font-size: 0.95rem; }

/* ── Architecture: three parts ──────────────────────────────────────── */
.welcome-arch[b-j1feg36hs0] {
    display: grid;
    grid-template-columns: 1fr auto 1fr auto 1fr;
    align-items: stretch;
    gap: 0.5rem;
}

.welcome-arch__card[b-j1feg36hs0] {
    display: flex;
    flex-direction: column;
    text-decoration: none;
    color: inherit;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.09);
    border-radius: 14px;
    padding: 1.5rem 1.3rem;
    transition: transform 0.1s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}

.welcome-arch__card:hover[b-j1feg36hs0] {
    transform: translateY(-3px);
    border-color: rgba(255, 255, 255, 0.28);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.25);
}

html[data-theme="light"] .welcome-arch__card[b-j1feg36hs0] { background: #fff; border-color: #e2e8f0; box-shadow: 0 1px 3px rgba(0,0,0,0.04); }
html[data-theme="light"] .welcome-arch__card:hover[b-j1feg36hs0] { border-color: #cbd5e1; box-shadow: 0 10px 28px rgba(0,0,0,0.10); }

/* The Maestro card is the heart of the stack — make it the visual anchor. */
.welcome-arch__card--primary[b-j1feg36hs0] {
    border-color: rgba(176, 23, 30, 0.55);
    background: rgba(176, 23, 30, 0.06);
}
.welcome-arch__card--primary:hover[b-j1feg36hs0] { border-color: var(--brand-red, #B0171E); }
html[data-theme="light"] .welcome-arch__card--primary[b-j1feg36hs0] { border-color: rgba(176, 23, 30, 0.5); background: rgba(176, 23, 30, 0.04); }

.welcome-arch__badge[b-j1feg36hs0] {
    align-self: flex-start;
    background: var(--brand-red, #B0171E);
    color: #fff;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    padding: 0.2rem 0.55rem;
    border-radius: 999px;
    margin-bottom: 0.6rem;
}

.welcome-arch__icon[b-j1feg36hs0] { font-size: 1.8rem; line-height: 1; margin-bottom: 0.5rem; }
.welcome-arch__title[b-j1feg36hs0] { font-size: 1.25rem; margin: 0 0 0.15rem; }
.welcome-arch__tag[b-j1feg36hs0] {
    margin: 0 0 0.6rem;
    font-size: 0.82rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    opacity: 0.55;
}
.welcome-arch__desc[b-j1feg36hs0] { margin: 0; opacity: 0.78; line-height: 1.5; font-size: 0.93rem; flex: 1; }

/* Connector between cards — a short line + arrowhead suggesting the flow. Collapses on mobile. */
.welcome-arch__connector[b-j1feg36hs0] {
    align-self: center;
    width: 1.4rem;
    height: 2px;
    background: rgba(255, 255, 255, 0.25);
    position: relative;
}
.welcome-arch__connector[b-j1feg36hs0]::after {
    content: "";
    position: absolute;
    right: -1px;
    top: 50%;
    transform: translateY(-50%);
    border-left: 6px solid rgba(255, 255, 255, 0.35);
    border-top: 4px solid transparent;
    border-bottom: 4px solid transparent;
}
html[data-theme="light"] .welcome-arch__connector[b-j1feg36hs0] { background: #cbd5e1; }
html[data-theme="light"] .welcome-arch__connector[b-j1feg36hs0]::after { border-left-color: #94a3b8; }

.welcome-arch__foot[b-j1feg36hs0] {
    text-align: center;
    max-width: 680px;
    margin: 1.5rem auto 0;
    opacity: 0.8;
    line-height: 1.6;
    font-size: 0.95rem;
}

@media (max-width: 860px) {
    .welcome-arch[b-j1feg36hs0] { grid-template-columns: 1fr; }
    .welcome-arch__connector[b-j1feg36hs0] {
        width: 2px;
        height: 1.4rem;
        justify-self: center;
    }
    .welcome-arch__connector[b-j1feg36hs0]::after {
        right: 50%;
        top: auto;
        bottom: -1px;
        transform: translateX(50%);
        border-left: 4px solid transparent;
        border-right: 4px solid transparent;
        border-top: 6px solid rgba(255, 255, 255, 0.35);
        border-bottom: none;
    }
    html[data-theme="light"] .welcome-arch__connector[b-j1feg36hs0]::after { border-top-color: #94a3b8; }
}

/* ── Fit: when is Maestro right ──────────────────────────────────────── */
.welcome-fit[b-j1feg36hs0] { max-width: 760px; margin: 0 auto; }

.welcome-fit__yes[b-j1feg36hs0] {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    gap: 0.7rem;
}

.welcome-fit__yes li[b-j1feg36hs0] {
    padding-left: 1.9rem;
    position: relative;
    line-height: 1.55;
    opacity: 0.9;
}

.welcome-fit__yes li[b-j1feg36hs0]::before {
    content: "✓";
    position: absolute;
    left: 0;
    top: 0;
    width: 1.3rem;
    height: 1.3rem;
    color: #fff;
    background: var(--brand-red, #B0171E);
    border-radius: 50%;
    font-size: 0.8rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
}

.welcome-fit__note[b-j1feg36hs0] {
    margin: 1.5rem 0 0;
    padding: 0.9rem 1.1rem;
    border-left: 3px solid rgba(176, 23, 30, 0.6);
    background: rgba(255, 255, 255, 0.03);
    border-radius: 0 8px 8px 0;
    opacity: 0.82;
    line-height: 1.55;
    font-size: 0.95rem;
}
html[data-theme="light"] .welcome-fit__note[b-j1feg36hs0] { background: #f8fafc; }

/* ── Comparison ─────────────────────────────────────────────────────── */
.welcome-compare[b-j1feg36hs0] {
    border: 1px solid rgba(255, 255, 255, 0.09);
    border-radius: 12px;
    overflow: hidden;
}

html[data-theme="light"] .welcome-compare[b-j1feg36hs0] { border-color: #e2e8f0; }

.welcome-compare__row[b-j1feg36hs0] {
    display: grid;
    grid-template-columns: 1.1fr 1.4fr 1.4fr;
    gap: 1rem;
    padding: 0.85rem 1.1rem;
    border-top: 1px solid rgba(255, 255, 255, 0.07);
    font-size: 0.93rem;
    line-height: 1.45;
}

.welcome-compare__row:first-child[b-j1feg36hs0] { border-top: none; }
html[data-theme="light"] .welcome-compare__row[b-j1feg36hs0] { border-top-color: #eef2f7; }

.welcome-compare__row--head[b-j1feg36hs0] {
    font-weight: 700;
    background: rgba(255, 255, 255, 0.04);
}
html[data-theme="light"] .welcome-compare__row--head[b-j1feg36hs0] { background: #f1f5f9; }

.welcome-compare__k[b-j1feg36hs0] { font-weight: 600; opacity: 0.85; }
.welcome-compare__y[b-j1feg36hs0] { color: #5fb37a; }
.welcome-compare__n[b-j1feg36hs0] { opacity: 0.6; }
html[data-theme="light"] .welcome-compare__y[b-j1feg36hs0] { color: #15803d; }

@media (max-width: 640px) {
    .welcome-compare__row[b-j1feg36hs0] { grid-template-columns: 1fr; gap: 0.25rem; }
    .welcome-compare__row--head[b-j1feg36hs0] { display: none; }
    .welcome-compare__y[b-j1feg36hs0]::before { content: "Maestro: "; font-weight: 600; opacity: 0.7; }
    .welcome-compare__n[b-j1feg36hs0]::before { content: "Legacy: "; font-weight: 600; opacity: 0.7; }
}

/* ── FAQ ────────────────────────────────────────────────────────────── */
.welcome-faq[b-j1feg36hs0] {
    max-width: 740px;
    margin: 0 auto;
    display: grid;
    gap: 0.6rem;
}

.welcome-faq__item[b-j1feg36hs0] {
    border: 1px solid rgba(255, 255, 255, 0.09);
    border-radius: 10px;
    padding: 0.85rem 1.1rem;
    background: rgba(255, 255, 255, 0.03);
}

html[data-theme="light"] .welcome-faq__item[b-j1feg36hs0] { background: #fff; border-color: #e2e8f0; }

.welcome-faq__item summary[b-j1feg36hs0] {
    cursor: pointer;
    font-weight: 600;
    list-style: none;
}
.welcome-faq__item summary[b-j1feg36hs0]::-webkit-details-marker { display: none; }
.welcome-faq__item summary[b-j1feg36hs0]::after { content: " +"; color: var(--brand-red, #B0171E); float: right; font-weight: 700; }
.welcome-faq__item[open] summary[b-j1feg36hs0]::after { content: " –"; }
.welcome-faq__item p[b-j1feg36hs0] { margin: 0.7rem 0 0; opacity: 0.8; line-height: 1.55; font-size: 0.95rem; }

/* ── Capability grid ────────────────────────────────────────────────── */
/* Five capability tiles sit on one row on a wide screen, then step down gracefully. */
.welcome-grid[b-j1feg36hs0] {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 0.75rem;
}

@media (max-width: 900px) { .welcome-grid[b-j1feg36hs0] { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 620px) { .welcome-grid[b-j1feg36hs0] { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 420px) { .welcome-grid[b-j1feg36hs0] { grid-template-columns: 1fr; } }

.welcome-card[b-j1feg36hs0] {
    display: block;
    text-decoration: none;
    color: inherit;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.09);
    border-radius: 12px;
    padding: 1.1rem;
    transition: transform 0.1s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}

.welcome-card:hover[b-j1feg36hs0] {
    transform: translateY(-3px);
    border-color: rgba(255, 255, 255, 0.28);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.25);
}

.welcome-card--accent[b-j1feg36hs0] { border-color: rgba(176, 23, 30, 0.45); }
.welcome-card--accent:hover[b-j1feg36hs0] { border-color: var(--brand-red, #B0171E); }

html[data-theme="light"] .welcome-card[b-j1feg36hs0] { background: #fff; border-color: #e2e8f0; box-shadow: 0 1px 3px rgba(0,0,0,0.04); }
html[data-theme="light"] .welcome-card:hover[b-j1feg36hs0] { border-color: #cbd5e1; box-shadow: 0 10px 28px rgba(0,0,0,0.10); }
html[data-theme="light"] .welcome-card--accent[b-j1feg36hs0] { border-color: rgba(176, 23, 30, 0.4); }

.welcome-card__icon[b-j1feg36hs0] { font-size: 1.5rem; margin-bottom: 0.6rem; }
.welcome-card__title[b-j1feg36hs0] { font-size: 1.1rem; margin: 0 0 0.4rem; }
.welcome-card__desc[b-j1feg36hs0] { margin: 0; opacity: 0.78; line-height: 1.5; font-size: 0.95rem; }

/* ── Why-E# band ────────────────────────────────────────────────────── */
.welcome-section--band[b-j1feg36hs0] {
    background: rgba(255, 255, 255, 0.03);
    border-radius: 16px;
    margin: 1rem 0;
}

html[data-theme="light"] .welcome-section--band[b-j1feg36hs0] { background: #f1f5f9; }

.welcome-why[b-j1feg36hs0] { max-width: 700px; margin: 0 auto; text-align: center; }

.welcome-why__tagline[b-j1feg36hs0] {
    color: var(--brand-red, #B0171E);
    font-weight: 700;
    letter-spacing: 0.01em;
    margin: 1.5rem 0 0;
}

.welcome-why__body[b-j1feg36hs0] { opacity: 0.85; line-height: 1.6; margin: 0 0 1.5rem; }

.welcome-proof[b-j1feg36hs0] {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    gap: 0.6rem;
    text-align: left;
    max-width: 520px;
    margin-inline: auto;
}

.welcome-proof li[b-j1feg36hs0] {
    padding-left: 1.6rem;
    position: relative;
    opacity: 0.9;
}

.welcome-proof li[b-j1feg36hs0]::before {
    content: "✓";
    position: absolute;
    left: 0;
    color: var(--brand-red, #B0171E);
    font-weight: 700;
}

/* ── Contact ────────────────────────────────────────────────────────── */
.welcome-contact[b-j1feg36hs0] { text-align: center; padding: 3rem 0 1rem; }

.welcome-contact__line[b-j1feg36hs0] { opacity: 0.85; margin: 0 0 1.75rem; line-height: 1.7; }
.welcome-contact__line a[b-j1feg36hs0] { color: inherit; text-decoration: none; border-bottom: 1px solid currentColor; }
.welcome-contact__sep[b-j1feg36hs0] { margin: 0 0.5rem; opacity: 0.4; }
/* /Components/Shared/DemoBanner.razor.rz.scp.css */
.demo-banner[b-ayp6kotud6] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    padding: 8px 20px;
    background: rgba(251, 191, 36, 0.07);
    border-bottom: 1px solid rgba(251, 191, 36, 0.18);
    font-size: 0.82rem;
    flex-wrap: wrap;
}

.demo-banner__text[b-ayp6kotud6] {
    color: #c9a84c;
    letter-spacing: 0.01em;
}

/* Theme-aware amber pill that matches the banner tint and stays legible on dark and light. */
.demo-banner__cta[b-ayp6kotud6] {
    background: rgba(201, 168, 76, 0.12);
    border: 1px solid rgba(201, 168, 76, 0.5);
    color: #c9a84c;
    padding: 4px 14px;
    border-radius: 5px;
    font-size: 0.8rem;
    font-weight: 600;
    text-decoration: none;
    cursor: pointer;
    transition: background 0.15s, border-color 0.15s;
    white-space: nowrap;
}

.demo-banner__cta:hover[b-ayp6kotud6] {
    background: rgba(201, 168, 76, 0.22);
    border-color: #c9a84c;
}

html[data-theme="light"] .demo-banner__cta[b-ayp6kotud6] {
    color: #8a6d1f;
    border-color: rgba(138, 109, 31, 0.45);
}

html[data-theme="light"] .demo-banner__cta:hover[b-ayp6kotud6] {
    background: rgba(201, 168, 76, 0.24);
    border-color: #8a6d1f;
}
/* /Components/Shared/KnowledgeDocView.razor.rz.scp.css */
/* Sizing is in rem (not em) on purpose: this viewer renders inside .trace-doc__content,
   which reduces the base font — em would compound and shrink the TOC to unreadable. */

.kdv-preamble[b-zpskgy5vjx] {
    margin-bottom: .75rem;
    opacity: .85;
}

/* ── Table of contents ─────────────────────────────────────────── */
.kdv-toc[b-zpskgy5vjx] {
    border: 1px solid rgba(128, 128, 128, .25);
    border-radius: 6px;
    margin-bottom: 1rem;
    background: rgba(128, 128, 128, .05);
}

.kdv-toc__head[b-zpskgy5vjx] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    padding: .4rem .6rem;
    border-bottom: 1px solid rgba(128, 128, 128, .18);
}

.kdv-toc__toggle[b-zpskgy5vjx] {
    background: none;
    border: none;
    color: inherit;
    font-family: inherit;
    font-size: .95rem;
    font-weight: 600;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    padding: .15rem .25rem;
}

.kdv-count[b-zpskgy5vjx] {
    font-weight: 400;
    opacity: .6;
    font-size: .8rem;
}

.kdv-toc__actions[b-zpskgy5vjx] { display: inline-flex; gap: .4rem; }

.kdv-btn[b-zpskgy5vjx] {
    background: rgba(128, 128, 128, .12);
    border: 1px solid rgba(128, 128, 128, .25);
    border-radius: 4px;
    color: inherit;
    font-family: inherit;
    font-size: .82rem;
    cursor: pointer;
    padding: .25rem .6rem;
}

.kdv-btn:hover[b-zpskgy5vjx] { background: rgba(128, 128, 128, .22); }

/* Block (not flex-column) on purpose: a flex column with max-height shrinks its
   items to fit, crushing 100+ TOC rows to a few px tall. Block + overflow scrolls. */
.kdv-toc__list[b-zpskgy5vjx] {
    display: block;
    max-height: 45vh;
    overflow-y: auto;
    padding: .3rem;
}

.kdv-toc__item[b-zpskgy5vjx] {
    display: block;
    width: 100%;
    text-align: left;
    background: none;
    border: none;
    color: inherit;
    font-family: inherit;
    font-size: .9rem;
    line-height: 1.45;
    cursor: pointer;
    padding: .3rem .5rem;
    border-radius: 4px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.kdv-toc__item:hover[b-zpskgy5vjx] {
    background: rgba(80, 140, 255, .15);
    color: var(--accent, #4a90e2);
}

/* ── Collapsible sections ──────────────────────────────────────── */
.kdv-section[b-zpskgy5vjx] { border-top: 1px solid rgba(128, 128, 128, .15); scroll-margin-top: 12px; }
.kdv-section:first-child[b-zpskgy5vjx] { border-top: none; }

.kdv-section__head[b-zpskgy5vjx] {
    width: 100%;
    text-align: left;
    background: none;
    border: none;
    color: inherit;
    font-family: inherit;
    cursor: pointer;
    display: flex;
    align-items: baseline;
    gap: .45rem;
    padding: .45rem .25rem;
}

.kdv-section__head:hover[b-zpskgy5vjx] { background: rgba(128, 128, 128, .08); }

.kdv-chevron[b-zpskgy5vjx] {
    flex: 0 0 auto;
    opacity: .55;
    font-size: .8rem;
    width: 1rem;
}

.kdv-section__title[b-zpskgy5vjx] { font-weight: 600; font-size: .95rem; }
.kdv-l1[b-zpskgy5vjx] { font-size: 1.1rem; }
.kdv-l2[b-zpskgy5vjx] { font-size: 1rem; }
.kdv-l3[b-zpskgy5vjx] { font-size: .95rem; opacity: .92; }
.kdv-l4[b-zpskgy5vjx], .kdv-l5[b-zpskgy5vjx], .kdv-l6[b-zpskgy5vjx] { font-size: .9rem; opacity: .85; }

.kdv-section__body[b-zpskgy5vjx] {
    padding: 0 .25rem .5rem 1.5rem;
    border-left: 2px solid rgba(128, 128, 128, .15);
    margin-left: .55rem;
}

.kdv-empty[b-zpskgy5vjx] { opacity: .5; font-style: italic; margin: .25rem 0; }
/* /Components/Shared/LicenseBanner.razor.rz.scp.css */
.license-banner[b-pf1l9zuzcd] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    background: rgba(245, 158, 11, 0.14);
    border-bottom: 1px solid rgba(245, 158, 11, 0.3);
    padding: 0.5rem 1rem;
    font-size: 0.9rem;
}

/* Lapsed = the hard stop is in effect: louder red instead of the amber grace nudge. */
.license-banner--lapsed[b-pf1l9zuzcd] {
    background: rgba(220, 38, 38, 0.16);
    border-bottom: 1px solid rgba(220, 38, 38, 0.4);
}

/* Info = worth knowing, nothing at risk. Muted blue so it cannot be mistaken for the amber
   "act on this" state — a notice feed whose severities all look alike trains people to ignore it. */
.license-banner--info[b-pf1l9zuzcd] {
    background: rgba(59, 130, 246, 0.12);
    border-bottom: 1px solid rgba(59, 130, 246, 0.28);
}

.license-banner__link[b-pf1l9zuzcd] {
    font-weight: 600;
    white-space: nowrap;
}
/* /Components/Shared/MarkdownBodyEditor.razor.rz.scp.css */
.mbe[b-omsbwizu37] {
    display: flex;
    flex-direction: column;
    gap: .5rem;
}

.mbe__textarea[b-omsbwizu37] {
    width: 100%;
    min-height: 20rem;
    padding: .75rem;
    border: 1px solid var(--border, #d0d7de);
    border-radius: 6px;
    background: var(--surface-2, #fbfcfd);
    color: var(--text, #1f2328);
    /* Markdown tables only stay readable while the columns line up, so this is monospace and does
       not soft-wrap — a wrapped table row is unreadable and un-editable. */
    font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
    font-size: .82rem;
    line-height: 1.5;
    tab-size: 4;
    resize: vertical;
    overflow: auto;
}

.mbe__textarea:focus[b-omsbwizu37] {
    outline: 2px solid var(--accent, #3b82f6);
    outline-offset: -1px;
}

.mbe__bar[b-omsbwizu37] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
}

.mbe__meta[b-omsbwizu37] {
    font-size: .78rem;
    color: var(--text-muted, #656d76);
}

.mbe__dirty[b-omsbwizu37] {
    color: var(--warn, #9a6700);
    font-weight: 600;
}

.mbe__who[b-omsbwizu37] {
    background: none;
    border: none;
    padding: 0;
    font: inherit;
    color: var(--accent, #3b82f6);
    cursor: pointer;
    text-decoration: underline dotted;
}

.mbe__actions[b-omsbwizu37] {
    display: flex;
    gap: .5rem;
}

.mbe__error[b-omsbwizu37] {
    display: flex;
    flex-direction: column;
    gap: .25rem;
    padding: .6rem .75rem;
    border: 1px solid var(--fail-border, #f0b8b8);
    border-left-width: 3px;
    border-radius: 4px;
    background: var(--fail-bg, #fff5f5);
    color: var(--fail-text, #86181d);
    font-size: .82rem;
}

.mbe__error--stale[b-omsbwizu37] {
    border-color: var(--warn-border, #e6c67a);
    background: var(--warn-bg, #fff8e6);
    color: var(--warn-text, #7a5b00);
}

.mbe__identity[b-omsbwizu37] {
    display: flex;
    flex-direction: column;
    gap: .4rem;
    padding: .75rem;
    border: 1px solid var(--border, #d0d7de);
    border-radius: 6px;
    background: var(--surface-2, #fbfcfd);
}

.mbe__identity-lead[b-omsbwizu37] {
    margin: 0;
    font-size: .85rem;
}

.mbe__identity-row[b-omsbwizu37] {
    display: flex;
    gap: .5rem;
    align-items: center;
    flex-wrap: wrap;
}

.mbe__input[b-omsbwizu37] {
    flex: 1 1 16rem;
    padding: .4rem .55rem;
    border: 1px solid var(--border, #d0d7de);
    border-radius: 4px;
    background: var(--surface, #fff);
    color: var(--text, #1f2328);
    font-size: .85rem;
}

.mbe__identity-note[b-omsbwizu37],
.mbe__err[b-omsbwizu37] {
    margin: 0;
    font-size: .75rem;
    color: var(--text-muted, #656d76);
}

.mbe__err[b-omsbwizu37] {
    color: var(--fail-text, #86181d);
}
/* /Components/Shared/SignUpModal.razor.rz.scp.css */
.signup-modal__backdrop[b-f3q8dfle5o] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.65);
    z-index: 800;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
}

.signup-modal__dialog[b-f3q8dfle5o] {
    background: #1b2736;
    border: 1px solid #2c3e50;
    border-radius: 10px;
    width: 100%;
    max-width: 460px;
    box-shadow: 0 12px 48px rgba(0, 0, 0, 0.5);
    overflow: hidden;
}

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

.signup-modal__header[b-f3q8dfle5o] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 18px 20px 14px;
    border-bottom: 1px solid #2c3e50;
}

.signup-modal__title[b-f3q8dfle5o] {
    margin: 0;
    font-size: 1rem;
    font-weight: 700;
    color: #e2e8f0;
    letter-spacing: -0.01em;
}

.signup-modal__close[b-f3q8dfle5o] {
    background: none;
    border: none;
    color: #506070;
    font-size: 1rem;
    cursor: pointer;
    padding: 2px 6px;
    border-radius: 4px;
    line-height: 1;
    transition: background 0.12s, color 0.12s;
}

.signup-modal__close:hover[b-f3q8dfle5o] {
    background: #243347;
    color: #e2e8f0;
}

/* ── Body ────────────────────────────────────────────────────────────── */

.signup-modal__body[b-f3q8dfle5o] {
    padding: 20px;
}

.signup-modal__description[b-f3q8dfle5o] {
    margin: 0 0 20px;
    font-size: 0.85rem;
    color: #8fa8be;
    line-height: 1.55;
}

.signup-modal__field[b-f3q8dfle5o] {
    margin-bottom: 14px;
}

.signup-modal__label[b-f3q8dfle5o] {
    display: block;
    font-size: 0.75rem;
    font-weight: 600;
    color: #8fa8be;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 5px;
}

.signup-modal__optional[b-f3q8dfle5o] {
    font-weight: 400;
    text-transform: none;
    letter-spacing: 0;
    color: #506070;
    margin-left: 4px;
}

.signup-modal__input[b-f3q8dfle5o] {
    width: 100%;
    background: #141d26;
    border: 1px solid #2c3e50;
    border-radius: 5px;
    color: #e2e8f0;
    font-size: 0.875rem;
    padding: 8px 12px;
    outline: none;
    transition: border-color 0.15s, box-shadow 0.15s;
    font-family: inherit;
    resize: none;
}

.signup-modal__input[b-f3q8dfle5o]::placeholder {
    color: #506070;
}

.signup-modal__input:focus[b-f3q8dfle5o] {
    border-color: #38bdf8;
    box-shadow: 0 0 0 2px rgba(56, 189, 248, 0.15);
}

.signup-modal__textarea[b-f3q8dfle5o] {
    height: 72px;
}

.signup-modal__error[b-f3q8dfle5o] {
    font-size: 0.8rem;
    color: #f87171;
    margin: 8px 0 0;
}

/* ── Actions ─────────────────────────────────────────────────────────── */

.signup-modal__actions[b-f3q8dfle5o] {
    display: flex;
    justify-content: flex-end;
    margin-top: 20px;
}

.signup-modal__submit[b-f3q8dfle5o] {
    background: #38bdf8;
    color: #0f172a;
    border: none;
    border-radius: 5px;
    padding: 8px 24px;
    font-size: 0.875rem;
    font-weight: 700;
    cursor: pointer;
    transition: filter 0.15s;
}

.signup-modal__submit:hover:not(:disabled)[b-f3q8dfle5o] {
    filter: brightness(1.1);
}

.signup-modal__submit:disabled[b-f3q8dfle5o] {
    opacity: 0.55;
    cursor: not-allowed;
}

/* ── Success ─────────────────────────────────────────────────────────── */

.signup-modal__success[b-f3q8dfle5o] {
    padding: 40px 20px;
    text-align: center;
    color: #8fa8be;
    font-size: 0.9rem;
}

.signup-modal__success-icon[b-f3q8dfle5o] {
    font-size: 2rem;
    color: #34d399;
    margin-bottom: 12px;
}

.signup-modal__success p[b-f3q8dfle5o] {
    margin: 0;
    color: #e2e8f0;
}
/* /Components/TestResults/ArtifactViewer.razor.rz.scp.css */
.artifact-images-section[b-xh6aljbmu3],
.artifact-charts-section[b-xh6aljbmu3],
.artifact-csv-inline-section[b-xh6aljbmu3] {
    padding: 14px 0 0;
}

.artifact-inline-heading[b-xh6aljbmu3] {
    margin: 0 0 10px;
    font-size: 13px;
    font-weight: 600;
    color: #495057;
    text-transform: uppercase;
    letter-spacing: 0.4px;
}

.artifact-image-grid[b-xh6aljbmu3] {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
}

.artifact-image-figure[b-xh6aljbmu3] {
    margin: 0;
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    overflow: hidden;
    max-width: 480px;
}

.artifact-inline-img[b-xh6aljbmu3] {
    display: block;
    max-width: 100%;
    height: auto;
}

.artifact-image-figure figcaption[b-xh6aljbmu3] {
    padding: 6px 10px;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.artifact-img-name[b-xh6aljbmu3] {
    font-family: var(--font-mono);
    font-size: 12px;
    color: #6c757d;
}

.artifact-img-desc[b-xh6aljbmu3] {
    font-size: 12px;
    color: #333;
}

.artifact-csv-block[b-xh6aljbmu3] {
    margin-bottom: 20px;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    overflow: hidden;
}

.artifact-csv-title[b-xh6aljbmu3] {
    padding: 6px 12px;
    font-family: var(--font-mono);
    font-size: 12px;
    font-weight: 600;
    color: #495057;
    background: #f8f9fa;
    border-bottom: 1px solid #dee2e6;
}

.artifact-csv-scroll[b-xh6aljbmu3] {
    overflow-x: auto;
    max-height: 400px;
    overflow-y: auto;
}

.artifact-csv-table[b-xh6aljbmu3] {
    border-collapse: collapse;
    font-size: 13px;
    width: 100%;
    white-space: nowrap;
}

.artifact-csv-table th[b-xh6aljbmu3],
.artifact-csv-table td[b-xh6aljbmu3] {
    border: 1px solid #dee2e6;
    padding: 4px 10px;
    text-align: left;
}

.artifact-csv-table th[b-xh6aljbmu3] {
    background: #f8f9fa;
    font-weight: 600;
    position: sticky;
    top: 0;
    z-index: 1;
}

.artifact-csv-loading[b-xh6aljbmu3],
.artifact-csv-error[b-xh6aljbmu3] {
    padding: 12px;
    font-size: 13px;
    color: #6c757d;
}

.artifact-csv-error[b-xh6aljbmu3] {
    color: #dc3545;
}

/* ── Dark theme ───────────────────────────────────────────────────────────── */

html:not([data-theme="light"]) .artifact-inline-heading[b-xh6aljbmu3] { color: #8A9BB0; }

html:not([data-theme="light"]) .artifact-image-figure[b-xh6aljbmu3] {
    background: #151f28;
    border-color: rgba(255,255,255,0.10);
}

html:not([data-theme="light"]) .artifact-img-name[b-xh6aljbmu3] { color: #8A9BB0; }
html:not([data-theme="light"]) .artifact-img-desc[b-xh6aljbmu3] { color: #E0E4EA; }

html:not([data-theme="light"]) .artifact-csv-block[b-xh6aljbmu3] {
    border-color: rgba(255,255,255,0.10);
}

html:not([data-theme="light"]) .artifact-csv-title[b-xh6aljbmu3] {
    background: #1E2A35;
    border-bottom-color: rgba(255,255,255,0.08);
    color: #8A9BB0;
}

html:not([data-theme="light"]) .artifact-csv-table th[b-xh6aljbmu3],
html:not([data-theme="light"]) .artifact-csv-table td[b-xh6aljbmu3] {
    border-color: rgba(255,255,255,0.08);
    color: #E0E4EA;
}

html:not([data-theme="light"]) .artifact-csv-table th[b-xh6aljbmu3] {
    background: #1E2A35;
    color: #8A9BB0;
}

html:not([data-theme="light"]) .artifact-csv-loading[b-xh6aljbmu3] { color: #8A9BB0; }
html:not([data-theme="light"]) .artifact-csv-error[b-xh6aljbmu3]   { color: #E57373; }
/* /Components/Trace/AssistPanel.razor.rz.scp.css */
.assist-panel[b-b3ycq36t4i] {
    position: fixed;
    top: 0;
    right: -420px;
    width: 400px;
    height: 100vh;
    background: #1a2530;
    border-left: 1px solid #2e3d4d;
    box-shadow: -4px 0 24px rgba(0,0,0,0.4);
    display: flex;
    flex-direction: column;
    z-index: 500;
    transition: right 0.2s ease;
    overflow: hidden;
}

.assist-panel--open[b-b3ycq36t4i] { right: 0; }

.assist-panel__header[b-b3ycq36t4i] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 16px;
    border-bottom: 1px solid #2e3d4d;
    flex-shrink: 0;
}

.assist-panel__title[b-b3ycq36t4i] { font-weight: 700; color: #E0E4EA; font-size: 0.95rem; }

.assist-panel__close[b-b3ycq36t4i] {
    background: none;
    border: none;
    color: #8fa0ae;
    font-size: 1rem;
    cursor: pointer;
    padding: 2px 6px;
    border-radius: 4px;
}
.assist-panel__close:hover[b-b3ycq36t4i] { background: #2e3d4d; color: #E0E4EA; }

.assist-panel__body[b-b3ycq36t4i] { flex: 1; overflow-y: auto; padding: 12px 16px; }

.assist-panel__loading[b-b3ycq36t4i],
.assist-panel__empty[b-b3ycq36t4i] { color: #8fa0ae; font-size: 0.85rem; padding: 20px 0; text-align: center; }

.assist-panel__assertion[b-b3ycq36t4i] {
    background: #243040;
    border: 1px solid #2e3d4d;
    border-radius: 6px;
    padding: 10px 12px;
    margin-bottom: 10px;
}

.assist-panel__assertion-header[b-b3ycq36t4i] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 6px;
    flex-wrap: wrap;
}

.assist-panel__assertion-kind[b-b3ycq36t4i] { font-size: 0.72rem; color: #8fa0ae; text-transform: uppercase; letter-spacing: 0.04em; }
.assist-panel__assertion-date[b-b3ycq36t4i] { font-size: 0.72rem; color: #546E7A; margin-left: auto; }
.assist-panel__assertion-body[b-b3ycq36t4i] { font-size: 0.85rem; color: #c8d4dc; line-height: 1.5; }

.assist-panel__evidence[b-b3ycq36t4i] {
    margin: 8px 0 0 0;
    padding: 0 0 0 16px;
    font-size: 0.78rem;
    color: #8fa0ae;
}
.assist-panel__evidence li[b-b3ycq36t4i] { margin-bottom: 2px; }
.assist-panel__evidence-kind[b-b3ycq36t4i] { font-weight: 600; color: #80cbc4; margin-right: 4px; }
.assist-panel__evidence-ref[b-b3ycq36t4i]  { color: #546E7A; }
/* /Components/Trace/CheckinEditor.razor.rz.scp.css */
/* Isolated for the same reason as the other two planning pages: a form that belongs to one screen has
   no business in the shared sheet. Badges, buttons and page chrome still come from wwwroot/app.css. */

.checkin-editor__computed[b-jn602iys1g] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    margin: 0 0 18px;
    padding: 10px 14px;
    background: rgba(148, 163, 184, 0.06);
    border: 1px solid rgba(148, 163, 184, 0.18);
    border-radius: 8px;
    font-size: 0.85rem;
    color: #8fa8be;
}

.checkin-editor__lead strong[b-jn602iys1g] { color: #e2e8f0; }

.checkin-editor__link[b-jn602iys1g] { margin-left: auto; }

.checkin-editor[b-jn602iys1g] {
    display: flex;
    flex-direction: column;
    gap: 20px;
    max-width: 62rem;
}

.checkin-editor__field[b-jn602iys1g] { display: flex; flex-direction: column; gap: 6px; }

.checkin-editor__label[b-jn602iys1g] {
    font-size: 0.82rem;
    font-weight: 600;
    color: #e2e8f0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

/* The hint carries the one thing a lead has to know before typing: whether the seed will overwrite
   what they are about to write. */
.checkin-editor__hint[b-jn602iys1g] {
    font-weight: 400;
    font-size: 0.75rem;
    color: #708396;
    line-height: 1.45;
}

.checkin-editor__input[b-jn602iys1g] {
    width: 100%;
    padding: 9px 11px;
    background: #0f172a;
    color: #e2e8f0;
    border: 1px solid rgba(148, 163, 184, 0.25);
    border-radius: 6px;
    font: inherit;
    font-size: 0.88rem;
    line-height: 1.5;
    resize: vertical;
}

.checkin-editor__input:focus[b-jn602iys1g] {
    outline: none;
    border-color: #38bdf8;
    box-shadow: 0 0 0 2px rgba(56, 189, 248, 0.18);
}

.checkin-editor__input:disabled[b-jn602iys1g] { opacity: 0.6; }

.checkin-editor__row[b-jn602iys1g] { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }

.checkin-editor__saved[b-jn602iys1g] { font-size: 0.75rem; color: #4ade80; }

.checkin-editor__seededmark[b-jn602iys1g] { font-size: 0.72rem; color: #fbbf24; }

/* ── The milestone table ─────────────────────────────────────────────────── */

/* A read-only block sitting inside a column of editable boxes, so it is deliberately NOT painted like
   one: no input background, no focus ring, a quieter ground. A lead who cannot tell at a glance which
   parts of this page they can type into will try to type into this one. */
.checkin-ms[b-jn602iys1g] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 10px 12px;
    background: rgba(148, 163, 184, 0.05);
    border: 1px solid rgba(148, 163, 184, 0.16);
    border-radius: 8px;
}

.checkin-ms__toggle[b-jn602iys1g] {
    display: flex;
    align-items: baseline;
    gap: 8px;
    padding: 0;
    background: none;
    border: none;
    font: inherit;
    font-size: 0.82rem;
    color: #e2e8f0;
    text-align: left;
    cursor: pointer;
}

/* The chevron is 1ch wide in both states, so the heading does not shift sideways on every toggle. */
.checkin-ms__chevron[b-jn602iys1g] { flex: 0 0 1ch; color: #708396; }

.checkin-ms__heading[b-jn602iys1g] { font-weight: 600; }

/* The summary the disclosure is worth collapsing for: it has to answer "is there anything in here"
   without being opened. */
.checkin-ms__count[b-jn602iys1g] { font-weight: 400; font-size: 0.75rem; color: #708396; }

/* Its own scroller, on the wrapper rather than on the table. Five columns at this type size fit a
   laptop and not a split screen, and a table allowed to widen the page puts a horizontal scrollbar
   under the whole form. */
.checkin-ms__scroll[b-jn602iys1g] { overflow-x: auto; }

.checkin-ms__table[b-jn602iys1g] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.78rem;
}

.checkin-ms__table thead th[b-jn602iys1g] {
    padding: 4px 10px 6px 0;
    font-size: 0.65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #506070;
    text-align: left;
    white-space: nowrap;
    border-bottom: 1px solid rgba(148, 163, 184, 0.18);
}

.checkin-ms__table td[b-jn602iys1g] {
    padding: 5px 10px 5px 0;
    color: #c8d9e6;
    vertical-align: top;
    border-bottom: 1px solid rgba(148, 163, 184, 0.08);
}

.checkin-ms__table tr:last-child td[b-jn602iys1g] { border-bottom: none; }

/* The code carries the identity and the title carries the meaning, so the code is the one that stays
   legible when the row is dimmed. */
.checkin-ms__code[b-jn602iys1g] { font-weight: 700; margin-right: 6px; white-space: nowrap; }
.checkin-ms__title[b-jn602iys1g] { color: #8fa8be; }

/* Dates and the slip are read as a column, not as prose: tabular figures keep 2026-09-04 and
   2026-11-30 the same width so the eye can compare them down the page. */
.checkin-ms__date[b-jn602iys1g],
.checkin-ms__slip[b-jn602iys1g] {
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}

.checkin-ms__status[b-jn602iys1g] { color: #8fa8be; white-space: nowrap; }

/* Tints only. Every one of these states is also spelled out in the Status and Slip columns, which is
   what makes the table readable on a projector, in greyscale and to a red-green reader. */
/* The title is named alongside the cell in every one of these, because it carries its own colour and
   would otherwise be the one thing on the row that did not dim with it. */
.checkin-ms__row--overdue td[b-jn602iys1g],
.checkin-ms__row--overdue .checkin-ms__title[b-jn602iys1g] { color: #f87171; }
.checkin-ms__row--achieved td[b-jn602iys1g],
.checkin-ms__row--achieved .checkin-ms__title[b-jn602iys1g] { color: #708396; }
.checkin-ms__row--cancelled td[b-jn602iys1g],
.checkin-ms__row--cancelled .checkin-ms__title[b-jn602iys1g] { color: #506070; }
.checkin-ms__row--cancelled td[b-jn602iys1g] { text-decoration: line-through; }

.checkin-ms__empty[b-jn602iys1g] { margin: 0; font-size: 0.78rem; color: #708396; font-style: italic; }

/* Says out loud what the absence of a Save button only implies. The dates on this page are a view of
   the project; they move on the milestone. */
.checkin-ms__hint[b-jn602iys1g] { margin: 0; font-size: 0.72rem; color: #708396; line-height: 1.45; }

/* ── Light theme ─────────────────────────────────────────────────────────── */

/* The dark values above are the base and stay as they are, exactly as in PlanningWorkspace and
   PlanningCheckins. Only the literals that assume a dark ground are restated here — an input painted
   #0f172a on a white page is not faint, it is a black box with white text in it, and this page had
   no light rules at all until it was read in daylight. */

html[data-theme="light"] .checkin-editor__computed[b-jn602iys1g] {
    background: #f8fafc;
    border-color: #d1dce8;
    color: #4a6278;
}

html[data-theme="light"] .checkin-editor__lead strong[b-jn602iys1g],
html[data-theme="light"] .checkin-editor__label[b-jn602iys1g] { color: #1a2535; }

html[data-theme="light"] .checkin-editor__hint[b-jn602iys1g] { color: #64748b; }

html[data-theme="light"] .checkin-editor__input[b-jn602iys1g] {
    background: #ffffff;
    color: #1a2535;
    border-color: #d1dce8;
}

html[data-theme="light"] .checkin-editor__input:focus[b-jn602iys1g] {
    border-color: #0284c7;
    box-shadow: 0 0 0 2px rgba(2, 132, 199, 0.16);
}

/* Green on a dark ground and green on white are not the same green: #4ade80 reads as a highlighter
   over paper. Same for the amber seed mark. */
html[data-theme="light"] .checkin-editor__saved[b-jn602iys1g] { color: #047857; }
html[data-theme="light"] .checkin-editor__seededmark[b-jn602iys1g] { color: #b45309; }

html[data-theme="light"] .checkin-ms[b-jn602iys1g] {
    background: #f8fafc;
    border-color: #d1dce8;
}

html[data-theme="light"] .checkin-ms__toggle[b-jn602iys1g] { color: #1a2535; }
html[data-theme="light"] .checkin-ms__chevron[b-jn602iys1g],
html[data-theme="light"] .checkin-ms__count[b-jn602iys1g] { color: #64748b; }
html[data-theme="light"] .checkin-ms__table thead th[b-jn602iys1g] { color: #94a3b8; border-bottom-color: #d1dce8; }
html[data-theme="light"] .checkin-ms__table td[b-jn602iys1g] { color: #1a2535; border-bottom-color: #eef2f7; }
html[data-theme="light"] .checkin-ms__title[b-jn602iys1g],
html[data-theme="light"] .checkin-ms__status[b-jn602iys1g] { color: #4a6278; }
html[data-theme="light"] .checkin-ms__empty[b-jn602iys1g],
html[data-theme="light"] .checkin-ms__hint[b-jn602iys1g] { color: #64748b; }

/* Same reason as the saved/seeded marks above: #f87171 over white is a highlighter, not a warning.
   These are the values trace-badge--fail switches to in light theme, and one of those badges sits at
   the top of this very page counting the same rows. */
html[data-theme="light"] .checkin-ms__row--overdue td[b-jn602iys1g],
html[data-theme="light"] .checkin-ms__row--overdue .checkin-ms__title[b-jn602iys1g] { color: #b91c1c; }
html[data-theme="light"] .checkin-ms__row--achieved td[b-jn602iys1g],
html[data-theme="light"] .checkin-ms__row--achieved .checkin-ms__title[b-jn602iys1g] { color: #64748b; }
html[data-theme="light"] .checkin-ms__row--cancelled td[b-jn602iys1g],
html[data-theme="light"] .checkin-ms__row--cancelled .checkin-ms__title[b-jn602iys1g] { color: #94a3b8; }
/* /Components/Trace/CoverageBadge.razor.rz.scp.css */
/* styles moved to app.css */
/* /Components/Trace/CoverageView.razor.rz.scp.css */
.cov-rollup[b-jpq1luud8b] { margin-bottom: 8px; }

.cov-rollup__bar[b-jpq1luud8b] {
    display: flex;
    height: 12px;
    border-radius: 6px;
    overflow: hidden;
    background: #141d26;
    margin-bottom: 12px;
    gap: 2px;
}

.cov-rollup__seg[b-jpq1luud8b] { height: 100%; transition: width 0.4s ease; min-width: 2px; border-radius: 2px; }
.cov-rollup__seg--pass[b-jpq1luud8b] { background: #34d399; }
.cov-rollup__seg--warn[b-jpq1luud8b] { background: #fbbf24; }
.cov-rollup__seg--fail[b-jpq1luud8b] { background: #f87171; }
.cov-rollup__seg--idle[b-jpq1luud8b] { background: #64748b; }
.cov-rollup__seg--info[b-jpq1luud8b] { background: #1e3a5f; }

.cov-rollup__legend[b-jpq1luud8b] {
    display: flex;
    gap: 20px;
    flex-wrap: wrap;
}

.cov-rollup__legend-item[b-jpq1luud8b] {
    font-size: 0.82rem;
    font-weight: 600;
    padding-left: 16px;
    position: relative;
}

.cov-rollup__legend-item[b-jpq1luud8b]::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 8px;
    height: 8px;
    border-radius: 50%;
}

.cov-rollup__legend-item--pass[b-jpq1luud8b] { color: #34d399; }
.cov-rollup__legend-item--pass[b-jpq1luud8b]::before { background: #34d399; }
.cov-rollup__legend-item--warn[b-jpq1luud8b] { color: #fbbf24; }
.cov-rollup__legend-item--warn[b-jpq1luud8b]::before { background: #fbbf24; }
.cov-rollup__legend-item--fail[b-jpq1luud8b] { color: #f87171; }
.cov-rollup__legend-item--fail[b-jpq1luud8b]::before { background: #f87171; }
.cov-rollup__legend-item--idle[b-jpq1luud8b] { color: #64748b; }
.cov-rollup__legend-item--idle[b-jpq1luud8b]::before { background: #64748b; }
.cov-rollup__legend-item--info[b-jpq1luud8b] { color: #60a5fa; }
.cov-rollup__legend-item--info[b-jpq1luud8b]::before { background: #1e3a5f; }

.cov-tc-link[b-jpq1luud8b] { margin-right: 6px; margin-bottom: 3px; font-size: 0.8rem; color: #7dd3fc; background: rgba(125,211,252,0.08); padding: 1px 6px; border-radius: 3px; text-decoration: none; display: inline-block; }
.cov-tc-link:hover[b-jpq1luud8b] { text-decoration: underline; color: #bae6fd; }

.cov-td--links[b-jpq1luud8b] { white-space: normal !important; }
.cov-links-wrap[b-jpq1luud8b] { max-width: 280px; }
/* /Components/Trace/DecisionDetail.razor.rz.scp.css */
/* Layout only, and deliberately so. The owner control is built from badges the shared sheet already
   owns — trace-badge--lead, trace-badge--lead-missing and trace-badge-note, all of which carry
   their own light-theme rules in wwwroot/app.css. Restating a single colour here would fork them, and
   the fork would be found the day somebody retunes the lead badge and this one stays behind. So there
   is no html[data-theme="light"] block below: nothing here assumes a dark ground. */

/* A row rather than an inline run, because the refusal note wraps to several lines and has to sit
   beside the badge that caused it instead of pushing the byline around. */
.decision-owner[b-vczcjl2mad] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin: 8px 0 0;
}
/* /Components/Trace/MermaidDiagram.razor.rz.scp.css */
.mermaid-diagram-container[b-c5409511jv] {
    margin: 1.25rem 0;
    text-align: center;
    overflow-x: auto;
}

.mermaid-diagram-container :deep(svg)[b-c5409511jv] {
    max-width: 100%;
    height: auto;
}
/* /Components/Trace/PlanningCalendar.razor.rz.scp.css */
/* Isolated for the same reason as PlanningWorkspace.razor.css: the day grid, the shared-day wash and
   the kind marks belong to this page alone. Page, button, badge and filter classes still come from
   wwwroot/app.css — only what is new to the calendar lives here.

   Dark values are the base; the html[data-theme="light"] block at the end overrides them. A sheet with
   no light block renders black on black for half the company. */

.cal-window[b-ooefu7f8zq] { text-align: right; font-size: 0.8rem; color: #8fa8be; white-space: nowrap; }

.cal-window__label[b-ooefu7f8zq] {
    display: block;
    font-size: 0.68rem;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: #506070;
}

.cal-window strong[b-ooefu7f8zq] { color: #e2e8f0; font-variant-numeric: tabular-nums; }

.cal-identity[b-ooefu7f8zq] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    margin: 0 0 16px;
    padding: 10px 14px;
    background: rgba(56,189,248,0.06);
    border: 1px solid rgba(56,189,248,0.25);
    border-radius: 8px;
    font-size: 0.85rem;
    color: #8fa8be;
}

.cal-identity__bad[b-ooefu7f8zq] { color: #f87171; }

.cal-saving[b-ooefu7f8zq] { font-size: 0.78rem; color: #38bdf8; margin-left: auto; }

.cal-message[b-ooefu7f8zq] {
    margin: 0 0 14px;
    padding: 10px 14px;
    border-radius: 8px;
    background: rgba(52,211,153,0.08);
    border: 1px solid rgba(52,211,153,0.3);
    color: #34d399;
    font-size: 0.85rem;
}

/* ── Forms ───────────────────────────────────────────────────────────────── */

.cal-form[b-ooefu7f8zq] {
    display: flex;
    align-items: flex-end;
    gap: 12px;
    flex-wrap: wrap;
    margin: 0 0 16px;
    padding: 14px 16px;
    background: #1b2736;
    border: 1px solid #2c3e50;
    border-radius: 10px;
}

.cal-form--standing[b-ooefu7f8zq] { margin: 14px 0 0; border-style: dashed; }

.cal-field[b-ooefu7f8zq] { display: flex; flex-direction: column; gap: 4px; }

.cal-field > span[b-ooefu7f8zq] {
    font-size: 0.65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #506070;
}

.cal-field--num[b-ooefu7f8zq] { max-width: 110px; }
.cal-field--wide[b-ooefu7f8zq] { flex: 1; min-width: 200px; }

.cal-form__hint[b-ooefu7f8zq] {
    flex-basis: 100%;
    margin: 2px 0 0;
    font-size: 0.78rem;
    line-height: 1.5;
    color: #8fa8be;
    max-width: 92ch;
}

.cal-form__hint strong[b-ooefu7f8zq] { color: #c8d9e6; }

/* ── Legend ──────────────────────────────────────────────────────────────── */

.cal-legend[b-ooefu7f8zq] {
    display: flex;
    align-items: center;
    gap: 14px;
    flex-wrap: wrap;
    margin-bottom: 10px;
    font-size: 0.75rem;
    color: #8fa8be;
}

.cal-legend__item[b-ooefu7f8zq] { display: inline-flex; align-items: center; gap: 6px; }
.cal-legend__hint[b-ooefu7f8zq] { color: #506070; }

.cal-swatch[b-ooefu7f8zq] {
    display: inline-block;
    width: 18px;
    height: 14px;
    border-radius: 3px;
    border: 1px solid #2c3e50;
}

/* ── The day grid ────────────────────────────────────────────────────────── */

/* Only this element scrolls sideways; the page must not. */
.cal-scroll[b-ooefu7f8zq] {
    overflow-x: auto;
    max-width: 100%;
    border: 1px solid #2c3e50;
    border-radius: 8px;
    background: #1b2736;
}

.cal-grid[b-ooefu7f8zq] { border-collapse: separate; border-spacing: 0; font-size: 0.8rem; }

.cal-grid th[b-ooefu7f8zq] {
    padding: 5px 6px;
    background: #141d26;
    color: #8fa8be;
    font-weight: 700;
    font-size: 0.68rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    white-space: nowrap;
    border-bottom: 1px solid #2c3e50;
}

.cal-grid td[b-ooefu7f8zq] {
    padding: 3px 4px;
    border-bottom: 1px solid #1e2d3d;
    color: #c8d9e6;
    vertical-align: middle;
}

.cal-week[b-ooefu7f8zq] { border-left: 1px solid #2c3e50; font-size: 0.66rem; }

.cal-day[b-ooefu7f8zq] { min-width: 34px; text-align: center; font-weight: 400; }
.cal-day__dow[b-ooefu7f8zq] { display: block; font-size: 0.6rem; color: #506070; }
.cal-day__num[b-ooefu7f8zq] { display: block; font-variant-numeric: tabular-nums; }

/* A shared day is marked in the header too, so the column still reads as a holiday when the row that
   names it has scrolled out of sight. */
.cal-day--shared[b-ooefu7f8zq] { color: #38bdf8; box-shadow: inset 0 -2px 0 #38bdf8; }
.cal-day--today[b-ooefu7f8zq] { color: #f87171; box-shadow: inset 0 -2px 0 #f87171; }

/* The frozen identity column. It needs its own opaque background or the cells scrolling under it show
   through, which reads as a rendering fault rather than as a frozen column. */
.cal-name[b-ooefu7f8zq] {
    position: sticky;
    left: 0;
    z-index: 2;
    min-width: 190px;
    max-width: 190px;
    text-align: left;
    background: #1b2736;
    border-right: 1px solid #2c3e50;
}

.cal-grid th.cal-name[b-ooefu7f8zq] { z-index: 3; background: #141d26; }

.cal-name__label[b-ooefu7f8zq] { font-weight: 700; font-size: 0.82rem; color: #e2e8f0; }
.cal-name__sub[b-ooefu7f8zq] { font-size: 0.66rem; color: #506070; margin-top: 1px; }

.cal-row--shared > td[b-ooefu7f8zq] { background: rgba(56,189,248,0.05); }
.cal-row--shared > .cal-name[b-ooefu7f8zq] { background: #1b2736; }
.cal-row--shared .cal-name__label[b-ooefu7f8zq] { color: #38bdf8; }

.cal-cell[b-ooefu7f8zq] { text-align: center; cursor: pointer; min-width: 34px; }
.cal-cell:hover[b-ooefu7f8zq] { outline: 1px solid rgba(56,189,248,0.4); outline-offset: -1px; }

/* The shared wash: a public holiday comes off everybody's capacity, so it is drawn on everybody's row
   and not only on the row that names it. Hatched rather than tinted, so it cannot be mistaken for one
   person's own absence at a glance. */
.cal-cell--shared[b-ooefu7f8zq],
.cal-swatch--shared[b-ooefu7f8zq] {
    background: repeating-linear-gradient(
        45deg,
        rgba(56,189,248,0.16) 0 4px,
        transparent 4px 8px);
}

.cal-cell--today[b-ooefu7f8zq] { box-shadow: inset 1px 0 0 rgba(248,113,113,0.35), inset -1px 0 0 rgba(248,113,113,0.35); }
.cal-cell--picked[b-ooefu7f8zq] { outline: 2px solid #38bdf8; outline-offset: -2px; }

.cal-mark[b-ooefu7f8zq] {
    display: inline-block;
    min-width: 22px;
    padding: 1px 4px;
    border-radius: 3px;
    font-size: 0.64rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    line-height: 1.5;
}

.cal-mark--holiday[b-ooefu7f8zq] { background: rgba(52,211,153,0.35); color: #ecfdf5; }
.cal-mark--absence[b-ooefu7f8zq] { background: rgba(248,113,113,0.40); color: #fff1f1; }
.cal-mark--event[b-ooefu7f8zq]   { background: rgba(168,85,247,0.38); color: #f5ecff; }
.cal-mark--other[b-ooefu7f8zq]   { background: rgba(100,116,139,0.35); color: #e2e8f0; }
.cal-mark--off[b-ooefu7f8zq]     { background: transparent; color: #94a3b8; box-shadow: inset 0 0 0 1px rgba(148,163,184,0.55); }

/* A day that is not part of the person's week (FR #44). Dimmed rather than coloured: it is the shape
   of their week, not something that took time out of it. */
.cal-cell--off[b-ooefu7f8zq] { background-color: rgba(15,23,42,0.45); }

/* ── What the calendar leaves ────────────────────────────────────────────── */

.cal-avail[b-ooefu7f8zq] {
    text-align: right;
    white-space: nowrap;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    border-left: 1px solid #2c3e50;
    min-width: 92px;
    padding-right: 10px;
}

.cal-avail--cut[b-ooefu7f8zq] { color: #fbbf24; }

/* Nothing left at all — a whole week away. Grey rather than red: somebody on holiday is not a problem
   with the plan, and colouring them as one teaches the room to ignore the colour that is. */
.cal-avail--off[b-ooefu7f8zq] { color: #506070; }

/* ── The picked day ──────────────────────────────────────────────────────── */

.cal-picked[b-ooefu7f8zq] {
    margin: 12px 0 0;
    padding: 12px 16px;
    background: #1b2736;
    border: 1px solid #2c3e50;
    border-left: 3px solid #38bdf8;
    border-radius: 8px;
}

.cal-picked__head[b-ooefu7f8zq] { display: flex; align-items: center; gap: 10px; font-size: 0.85rem; color: #8fa8be; }
.cal-picked__head strong[b-ooefu7f8zq] { color: #e2e8f0; }
.cal-picked__head button[b-ooefu7f8zq] { margin-left: auto; }

.cal-picked__empty[b-ooefu7f8zq] { margin: 10px 0 0; font-size: 0.82rem; color: #8fa8be; display: flex; align-items: center; gap: 10px; }

.cal-picked__list[b-ooefu7f8zq] { list-style: none; margin: 10px 0 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }

.cal-picked__list li[b-ooefu7f8zq] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    font-size: 0.82rem;
    color: #c8d9e6;
}

.cal-picked__title[b-ooefu7f8zq] { font-weight: 700; }
.cal-picked__kind[b-ooefu7f8zq] { font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.05em; color: #506070; }
.cal-picked__notes[b-ooefu7f8zq] { color: #8fa8be; }

.cal-picked__rule[b-ooefu7f8zq], .cal-picked__shared[b-ooefu7f8zq] {
    margin: 10px 0 0;
    font-size: 0.78rem;
    line-height: 1.5;
    color: #8fa8be;
}

.cal-picked__rule strong[b-ooefu7f8zq] { color: #c8d9e6; }

/* ── Standing commitments ────────────────────────────────────────────────── */

.cal-standing[b-ooefu7f8zq] { margin-top: 28px; }

.cal-note[b-ooefu7f8zq] {
    margin: 0 0 12px;
    font-size: 0.8rem;
    line-height: 1.55;
    color: #8fa8be;
    max-width: 92ch;
}

.cal-note strong[b-ooefu7f8zq] { color: #c8d9e6; }

.cal-standing__table[b-ooefu7f8zq] { width: 100%; border-collapse: collapse; font-size: 0.82rem; }

.cal-standing__table th[b-ooefu7f8zq] {
    text-align: left;
    padding: 7px 12px;
    font-size: 0.65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #506070;
    border-bottom: 1px solid #2c3e50;
    white-space: nowrap;
}

.cal-standing__table td[b-ooefu7f8zq] {
    padding: 8px 12px;
    border-bottom: 1px solid #1e2d3d;
    color: #c8d9e6;
    white-space: nowrap;
    vertical-align: middle;
}

.cal-standing__table tbody tr:last-child td[b-ooefu7f8zq] { border-bottom: none; }

.cal-num[b-ooefu7f8zq] { text-align: right; font-variant-numeric: tabular-nums; }
.cal-actions[b-ooefu7f8zq] { text-align: right; white-space: nowrap; }
.cal-actions > * + *[b-ooefu7f8zq] { margin-left: 6px; }
.cal-confirm[b-ooefu7f8zq] { font-size: 0.75rem; color: #fbbf24; }

/* ── Light theme ─────────────────────────────────────────────────────────── */

html[data-theme="light"] .cal-window[b-ooefu7f8zq], html[data-theme="light"] .cal-window__label[b-ooefu7f8zq] { color: #64748b; }
html[data-theme="light"] .cal-window strong[b-ooefu7f8zq] { color: #1a2535; }

html[data-theme="light"] .cal-identity[b-ooefu7f8zq] { background: #f1f8fe; border-color: #bae0f7; color: #4a6278; }
html[data-theme="light"] .cal-message[b-ooefu7f8zq] { background: #ecfdf5; border-color: #a7f3d0; color: #047857; }

html[data-theme="light"] .cal-form[b-ooefu7f8zq] { background: #ffffff; border-color: #d1dce8; }
html[data-theme="light"] .cal-field > span[b-ooefu7f8zq] { color: #94a3b8; }
html[data-theme="light"] .cal-form__hint[b-ooefu7f8zq] { color: #4a6278; }
html[data-theme="light"] .cal-form__hint strong[b-ooefu7f8zq] { color: #1a2535; }

html[data-theme="light"] .cal-legend[b-ooefu7f8zq] { color: #64748b; }
html[data-theme="light"] .cal-legend__hint[b-ooefu7f8zq] { color: #94a3b8; }
html[data-theme="light"] .cal-swatch[b-ooefu7f8zq] { border-color: #d1dce8; }

html[data-theme="light"] .cal-scroll[b-ooefu7f8zq] { background: #ffffff; border-color: #d1dce8; }
html[data-theme="light"] .cal-grid th[b-ooefu7f8zq] { background: #f4f7fb; color: #4a6278; border-bottom-color: #d1dce8; }
html[data-theme="light"] .cal-grid td[b-ooefu7f8zq] { color: #1a2535; border-bottom-color: #eef2f7; }
html[data-theme="light"] .cal-week[b-ooefu7f8zq] { border-left-color: #d1dce8; }
html[data-theme="light"] .cal-day__dow[b-ooefu7f8zq] { color: #94a3b8; }
html[data-theme="light"] .cal-day--shared[b-ooefu7f8zq] { color: #0284c7; box-shadow: inset 0 -2px 0 #0284c7; }
html[data-theme="light"] .cal-day--today[b-ooefu7f8zq] { color: #dc2626; box-shadow: inset 0 -2px 0 #dc2626; }

html[data-theme="light"] .cal-name[b-ooefu7f8zq] { background: #ffffff; border-right-color: #d1dce8; }
html[data-theme="light"] .cal-grid th.cal-name[b-ooefu7f8zq] { background: #f4f7fb; }
html[data-theme="light"] .cal-name__label[b-ooefu7f8zq] { color: #1a2535; }
html[data-theme="light"] .cal-name__sub[b-ooefu7f8zq] { color: #94a3b8; }

html[data-theme="light"] .cal-row--shared > td[b-ooefu7f8zq] { background: #f1f8fe; }
html[data-theme="light"] .cal-row--shared > .cal-name[b-ooefu7f8zq] { background: #ffffff; }
html[data-theme="light"] .cal-row--shared .cal-name__label[b-ooefu7f8zq] { color: #0284c7; }

/* The hatch keeps its angle and only changes hue, so the two themes cannot drift apart on the one
   thing this page uses to separate a shared block from a personal one. */
html[data-theme="light"] .cal-cell--shared[b-ooefu7f8zq],
html[data-theme="light"] .cal-swatch--shared[b-ooefu7f8zq] {
    background: repeating-linear-gradient(
        45deg,
        rgba(2,132,199,0.18) 0 4px,
        transparent 4px 8px);
}

html[data-theme="light"] .cal-mark--holiday[b-ooefu7f8zq] { background: rgba(5,150,105,0.30); color: #04352a; }
html[data-theme="light"] .cal-mark--absence[b-ooefu7f8zq] { background: rgba(220,38,38,0.28); color: #450a0a; }
html[data-theme="light"] .cal-mark--event[b-ooefu7f8zq]   { background: rgba(147,51,234,0.24); color: #3b0764; }
html[data-theme="light"] .cal-mark--other[b-ooefu7f8zq]   { background: rgba(100,116,139,0.22); color: #1a2535; }
html[data-theme="light"] .cal-mark--off[b-ooefu7f8zq]     { color: #64748b; box-shadow: inset 0 0 0 1px rgba(100,116,139,0.45); }
html[data-theme="light"] .cal-cell--off[b-ooefu7f8zq]     { background-color: rgba(148,163,184,0.22); }

html[data-theme="light"] .cal-avail[b-ooefu7f8zq] { border-left-color: #d1dce8; }
html[data-theme="light"] .cal-avail--cut[b-ooefu7f8zq] { color: #b45309; }
html[data-theme="light"] .cal-avail--off[b-ooefu7f8zq] { color: #94a3b8; }

html[data-theme="light"] .cal-picked[b-ooefu7f8zq] { background: #ffffff; border-color: #d1dce8; border-left-color: #0284c7; }
html[data-theme="light"] .cal-picked__head[b-ooefu7f8zq] { color: #4a6278; }
html[data-theme="light"] .cal-picked__head strong[b-ooefu7f8zq] { color: #1a2535; }
html[data-theme="light"] .cal-picked__empty[b-ooefu7f8zq] { color: #4a6278; }
html[data-theme="light"] .cal-picked__list li[b-ooefu7f8zq] { color: #1a2535; }
html[data-theme="light"] .cal-picked__kind[b-ooefu7f8zq] { color: #94a3b8; }
html[data-theme="light"] .cal-picked__notes[b-ooefu7f8zq] { color: #4a6278; }
html[data-theme="light"] .cal-picked__rule[b-ooefu7f8zq], html[data-theme="light"] .cal-picked__shared[b-ooefu7f8zq] { color: #4a6278; }
html[data-theme="light"] .cal-picked__rule strong[b-ooefu7f8zq] { color: #1a2535; }

html[data-theme="light"] .cal-note[b-ooefu7f8zq] { color: #4a6278; }
html[data-theme="light"] .cal-note strong[b-ooefu7f8zq] { color: #1a2535; }

html[data-theme="light"] .cal-standing__table th[b-ooefu7f8zq] { color: #94a3b8; border-bottom-color: #d1dce8; }
html[data-theme="light"] .cal-standing__table td[b-ooefu7f8zq] { color: #1a2535; border-bottom-color: #eef2f7; }
html[data-theme="light"] .cal-confirm[b-ooefu7f8zq] { color: #b45309; }
/* /Components/Trace/PlanningCheckins.razor.rz.scp.css */
/* Isolated, for the same reason as PlanningWorkspace.razor.css: the RAG card and its staleness bands
   belong to this page alone and have no business in the shared sheet. The badge, button and page
   classes still come from wwwroot/app.css — only what is new to the go-around lives here. */

.checkin-week[b-p0a3phx7pk] { text-align: right; font-size: 0.8rem; color: #8fa8be; white-space: nowrap; }

.checkin-week__label[b-p0a3phx7pk] {
    display: block;
    font-size: 0.68rem;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: #506070;
}

.checkin-week strong[b-p0a3phx7pk] { color: #e2e8f0; }

.checkin-identity[b-p0a3phx7pk] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    margin: 0 0 16px;
    padding: 10px 14px;
    background: rgba(56,189,248,0.06);
    border: 1px solid rgba(56,189,248,0.25);
    border-radius: 8px;
    font-size: 0.85rem;
    color: #8fa8be;
}

.checkin-identity__bad[b-p0a3phx7pk] { color: #f87171; }

.checkin-toolbar[b-p0a3phx7pk] { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 12px; }

.checkin-seed__warn[b-p0a3phx7pk] {
    flex: 1;
    min-width: 260px;
    font-size: 0.78rem;
    color: #fbbf24;
    line-height: 1.45;
}

.checkin-message[b-p0a3phx7pk] {
    margin: 0 0 14px;
    padding: 10px 14px;
    border-radius: 8px;
    background: rgba(52,211,153,0.08);
    border: 1px solid rgba(52,211,153,0.3);
    color: #34d399;
    font-size: 0.85rem;
}

/* The endpoint renders a card before its row exists and computes the colour as of now, so a week with
   nothing seeded shows today's status under that week's heading. Amber, not red: the numbers are
   true, they are simply not about the week in the heading. */
.checkin-asof[b-p0a3phx7pk] {
    margin: 0 0 14px;
    padding: 10px 14px;
    border-radius: 8px;
    background: rgba(251,191,36,0.08);
    border: 1px solid rgba(251,191,36,0.3);
    color: #fbbf24;
    font-size: 0.85rem;
}

/* ── The board ───────────────────────────────────────────────────────────── */

.checkin-board[b-p0a3phx7pk] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(340px, 100%), 1fr));
    gap: 14px;
}

.checkin[b-p0a3phx7pk] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 14px 16px;
    background: #1b2736;
    border: 1px solid #2c3e50;
    border-left-width: 4px;
    border-radius: 10px;
}

.checkin--red[b-p0a3phx7pk] { border-left-color: #f87171; }
.checkin--amber[b-p0a3phx7pk] { border-left-color: #fbbf24; }
.checkin--green[b-p0a3phx7pk] { border-left-color: #34d399; }
.checkin--unknown[b-p0a3phx7pk] { border-left-color: #506070; }

.checkin__head[b-p0a3phx7pk] { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
.checkin__code[b-p0a3phx7pk] { font-weight: 700; font-size: 0.9rem; }
.checkin__name[b-p0a3phx7pk] { font-size: 0.8rem; color: #8fa8be; margin-top: 2px; }

.checkin__meta[b-p0a3phx7pk] { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; font-size: 0.78rem; color: #8fa8be; }
.checkin__lead strong[b-p0a3phx7pk] { color: #e2e8f0; }
.checkin__seeded[b-p0a3phx7pk] { color: #506070; font-size: 0.7rem; }

/* The four staleness bands the manual dashboard shipped CSS for and never had the data to compute. */
.checkin-stale[b-p0a3phx7pk] { font-size: 0.7rem; padding: 1px 7px; border-radius: 20px; white-space: nowrap; }
.checkin-stale--fresh[b-p0a3phx7pk] { background: rgba(52,211,153,0.12); color: #34d399; }
.checkin-stale--warm[b-p0a3phx7pk]  { background: rgba(56,189,248,0.12); color: #38bdf8; }
.checkin-stale--cool[b-p0a3phx7pk]  { background: rgba(251,191,36,0.12); color: #fbbf24; }
.checkin-stale--cold[b-p0a3phx7pk]  { background: rgba(248,113,113,0.12); color: #f87171; }

.checkin__pressure[b-p0a3phx7pk] { display: flex; gap: 6px; flex-wrap: wrap; }

.checkin__silent[b-p0a3phx7pk] { margin: 0; font-size: 0.82rem; color: #506070; font-style: italic; }

.checkin__field[b-p0a3phx7pk] { display: flex; flex-direction: column; gap: 2px; }

.checkin__label[b-p0a3phx7pk] {
    font-size: 0.65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #506070;
}

/* Notes is the last field still rendered as one paragraph: it is a note, not a list, and nothing
   parses markers out of it. pre-wrap because it is typed with line breaks and collapsing them would
   run it into a single sentence. */
.checkin__field p[b-p0a3phx7pk] { margin: 0; font-size: 0.82rem; line-height: 1.5; color: #c8d9e6; white-space: pre-wrap; }

/* ── The narrative, one row per line ─────────────────────────────────────── */

/* The lead's fields were one pre-wrap paragraph and are now a row per line, so that a severity ball
   can sit beside a line rather than inside its text. The typography is restated here rather than
   shared with the paragraph above: they are two different shapes now, and a rule that tried to serve
   both would have to stay a compromise for ever. */
.checkin__narrative[b-p0a3phx7pk] { font-size: 0.82rem; line-height: 1.5; color: #c8d9e6; }

/* min-height is exactly one line box, which is what a blank line cost when the newline was a
   character inside pre-wrap. Without it an empty row is 0px tall and the paragraph breaks a lead
   typed disappear the day this shipped. 1.5em resolves against this element's own font size and
   line-height is 1.5, so the two are the same height by construction and cannot drift apart. */
.checkin__line[b-p0a3phx7pk] { display: flex; align-items: flex-start; gap: 6px; min-height: 1.5em; }

/* The text is its own column, so a risk that wraps continues under itself and not under the ball —
   the list has to still read as a list at three lines per item. min-width: 0 is what actually lets it
   wrap: a flex item refuses to shrink below its content by default, and one long unbroken entry title
   would otherwise stretch the row past the edge of the card. */
.checkin__text[b-p0a3phx7pk] { flex: 1 1 auto; min-width: 0; white-space: pre-wrap; }

/* Sized in em so the ball tracks the type if this card's scale ever changes, and nudged down by half
   the difference between the line box and the ball so it sits on the middle of the FIRST line.
   Top-aligned deliberately: centring it on the row would leave the ball floating halfway down a
   three-line risk, pointing at nothing. cursor: help advertises the tooltip, which is where the
   severity word went when it stopped being printed. */
.checkin__ball[b-p0a3phx7pk] {
    flex: 0 0 auto;
    width: 0.68em;
    height: 0.68em;
    margin-top: 0.41em;
    border-radius: 50%;
    cursor: help;
}

/* The card's own three literals — the ones .checkin--red/--amber/--green paint the edge with and
   trace-badge--fail/--warn/--pass paint the badge in the header with. One vocabulary of red per
   card. */
/* Shape carries the severity alongside hue, so the ranking survives a greyscale printout, a
   red-green reader and a tablet with no hover. Square reads as the hardest stop, the diamond as a
   caution sign, the circle as settled — and they are told apart at 0.68em, which three hues are
   not. transform does not affect layout, so the diamond keeps the gutter the other two set. */
.checkin__ball--red[b-p0a3phx7pk] { background: #f87171; border-radius: 2px; }
.checkin__ball--amber[b-p0a3phx7pk] { background: #fbbf24; border-radius: 2px; transform: rotate(45deg); }
.checkin__ball--green[b-p0a3phx7pk] { background: #34d399; }

/* The gutter a line with no marker still occupies. Not display:none — the whole point is that it
   takes up the space. */
.checkin__ball--none[b-p0a3phx7pk] { background: transparent; cursor: default; }

/* An entry code sitting in a line of prose has to look reachable — colour alone does not carry at
   0.82rem inside a paragraph. The colour itself comes from `.trace-page a` in the shared sheet,
   which already answers for both themes. */
.checkin__entry[b-p0a3phx7pk] { text-decoration: underline; text-underline-offset: 2px; }

/* A code whose entry has been closed or withdrawn since the narrative was written. The line stays —
   it is what was said that week and the history is the point — but the code stops competing with the
   ones that are still live. Muted rather than struck through: the link still goes somewhere useful,
   and a strikethrough over a code reads as "this code is wrong" rather than "this risk is settled". */
.checkin__entry--retired[b-p0a3phx7pk] { color: #7d95a8; text-decoration-style: dotted; }

/* The word, because the colour is not the carrier — this list is read aloud in a go-around off a
   projector, and at 0.82rem a paler blue says nothing across a room. margin-left rather than a space
   in the markup: whitespace between two elements inside the loop is trimmed by the Razor compiler, so
   the gap has to be the stylesheet's or there is none. */
.checkin__entry-state[b-p0a3phx7pk] {
    margin-left: 5px;
    padding: 0 5px;
    border: 1px solid #33475b;
    border-radius: 6px;
    font-size: 0.72rem;
    color: #90a6b8;
    white-space: nowrap;
}

.checkin__override[b-p0a3phx7pk] {
    font-size: 0.75rem;
    color: #fbbf24;
    background: rgba(251,191,36,0.08);
    border-radius: 6px;
    padding: 6px 9px;
    line-height: 1.45;
}

.checkin__foot[b-p0a3phx7pk] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px 14px;
    margin-top: auto;
    padding-top: 8px;
    border-top: 1px solid #1e2d3d;
    font-size: 0.78rem;
}

/* ── One project's seed ──────────────────────────────────────────────────── */

/* Quiet on purpose, and quieter than `trace-btn` in the toolbar, because the two buttons do the same
   thing at scopes that differ by a factor of fourteen. A card control that looked as substantial as
   the board's would be pressed by somebody who meant the board's — and pressing the wrong one of
   those is not symmetrical: seeding one project when you meant all of them leaves thirteen cards
   stale, and the reverse touches thirteen rows other leads may be mid-edit on. Pushed to the right so
   it reads as an action rather than as a third navigation link beside the two on its left. */
.checkin__reseed[b-p0a3phx7pk] {
    margin-left: auto;
    padding: 2px 6px;
    background: none;
    border: 1px solid transparent;
    border-radius: 5px;
    font: inherit;
    font-size: 0.72rem;
    color: #708396;
    cursor: pointer;
}

.checkin__reseed:hover:not(:disabled)[b-p0a3phx7pk] { color: #38bdf8; border-color: rgba(56, 189, 248, 0.35); }
.checkin__reseed:disabled[b-p0a3phx7pk] { cursor: default; opacity: 0.5; }

/* The confirmed action, and the Cancel beside it, sit next to each other: only the first takes the
   auto margin, or the pair would be split across the width of the card. */
.checkin__reseed--go[b-p0a3phx7pk] { color: #fbbf24; border-color: rgba(251, 191, 36, 0.4); }
.checkin__reseed--go:hover:not(:disabled)[b-p0a3phx7pk] { color: #fbbf24; border-color: rgba(251, 191, 36, 0.75); }
.checkin__reseed--go ~ .checkin__reseed[b-p0a3phx7pk] { margin-left: 0; }

/* Its own line inside the footer's flex row — the promise about the lead's narrative is the sentence
   the button is waiting on, and it must not be squeezed into a column beside it. Amber, the same
   colour as the toolbar's board-wide warning, because it is the same warning one scope narrower. */
.checkin__reseed-warn[b-p0a3phx7pk] {
    flex-basis: 100%;
    font-size: 0.72rem;
    color: #fbbf24;
    line-height: 1.45;
}

/* ── Light theme ─────────────────────────────────────────────────────────── */

html[data-theme="light"] .checkin-week[b-p0a3phx7pk], html[data-theme="light"] .checkin-week__label[b-p0a3phx7pk] { color: #64748b; }
html[data-theme="light"] .checkin-week strong[b-p0a3phx7pk] { color: #1a2535; }
html[data-theme="light"] .checkin-identity[b-p0a3phx7pk] { background: #f1f8fe; border-color: #bae0f7; color: #4a6278; }
html[data-theme="light"] .checkin-seed__warn[b-p0a3phx7pk] { color: #b45309; }
html[data-theme="light"] .checkin-message[b-p0a3phx7pk] { background: #ecfdf5; border-color: #a7f3d0; color: #047857; }
html[data-theme="light"] .checkin-asof[b-p0a3phx7pk] { background: #fffbeb; border-color: #fde68a; color: #b45309; }

/* Three sides named, never the `border-color` shorthand. The shorthand sets all four, and this
   selector (0,2,1) outranks `.checkin--red` (0,1,0), so it repainted the RAG edge pale grey and the
   card's colour vanished in light theme. Left is the RAG class's, in both themes — one definition of
   each colour, so the two themes cannot drift. */
html[data-theme="light"] .checkin[b-p0a3phx7pk] {
    background: #ffffff;
    border-top-color: #d1dce8;
    border-right-color: #d1dce8;
    border-bottom-color: #d1dce8;
}
html[data-theme="light"] .checkin__name[b-p0a3phx7pk], html[data-theme="light"] .checkin__meta[b-p0a3phx7pk] { color: #4a6278; }
html[data-theme="light"] .checkin__lead strong[b-p0a3phx7pk] { color: #1a2535; }
html[data-theme="light"] .checkin__seeded[b-p0a3phx7pk], html[data-theme="light"] .checkin__label[b-p0a3phx7pk] { color: #94a3b8; }
html[data-theme="light"] .checkin__silent[b-p0a3phx7pk] { color: #94a3b8; }
html[data-theme="light"] .checkin__field p[b-p0a3phx7pk], html[data-theme="light"] .checkin__narrative[b-p0a3phx7pk] { color: #1a2535; }

/* The dark palette is tuned for a dark ground. It survives a white card as 4px of border down the
   left edge, which is why .checkin--red keeps one literal for both themes — but a 9px filled dot in
   those same values reads as highlighter pen over paper, and pale green against pale amber stops
   being three distinguishable colours. These are the values trace-badge--fail/--warn/--pass already
   switch to in light theme, and one of those badges sits in the header of the very same card: the
   ball and the badge must not disagree about what red is. */
html[data-theme="light"] .checkin__ball--red[b-p0a3phx7pk] { background: #b91c1c; }
html[data-theme="light"] .checkin__ball--amber[b-p0a3phx7pk] { background: #b45309; }
html[data-theme="light"] .checkin__ball--green[b-p0a3phx7pk] { background: #15803d; }

/* Muted against a white card, not against a dark one: #7d95a8 is a mid-grey chosen to sit below
   #c8d9e6 and it sits ABOVE #1a2535, so on paper the retired code would read as the emphasised one.
   Both halves switch together — the chip's border has the same problem. */
html[data-theme="light"] .checkin__entry--retired[b-p0a3phx7pk] { color: #7c8ea0; }
html[data-theme="light"] .checkin__entry-state[b-p0a3phx7pk] { border-color: #d8e2ec; color: #64748b; }

html[data-theme="light"] .checkin__foot[b-p0a3phx7pk] { border-top-color: #eef2f7; }

/* Same amber substitution as .checkin-seed__warn in the toolbar: #fbbf24 on white is a highlighter,
   not a caution. One vocabulary of amber per page, across both themes. */
html[data-theme="light"] .checkin__reseed[b-p0a3phx7pk] { color: #64748b; }
html[data-theme="light"] .checkin__reseed:hover:not(:disabled)[b-p0a3phx7pk] { color: #0284c7; border-color: rgba(2, 132, 199, 0.35); }
html[data-theme="light"] .checkin__reseed--go[b-p0a3phx7pk],
html[data-theme="light"] .checkin__reseed--go:hover:not(:disabled)[b-p0a3phx7pk],
html[data-theme="light"] .checkin__reseed-warn[b-p0a3phx7pk] { color: #b45309; }
html[data-theme="light"] .checkin__reseed--go[b-p0a3phx7pk] { border-color: rgba(180, 83, 9, 0.4); }
html[data-theme="light"] .checkin__reseed--go:hover:not(:disabled)[b-p0a3phx7pk] { border-color: rgba(180, 83, 9, 0.75); }
/* /Components/Trace/PlanningPeople.razor.rz.scp.css */
/* Isolated for the same reason as PlanningWorkspace.razor.css and PlanningCheckins.razor.css: the
   click-to-edit cell, the override sub-table and the leaver row belong to this page alone and have no
   business in the shared sheet. Table, button, badge and filter classes still come from
   wwwroot/app.css — only what is new to the register lives here.

   Dark values are the base; the html[data-theme="light"] block at the end overrides them. A sheet
   with no light block renders black on black for half the company. */

.ppl-count[b-gz96kjjb7g] { text-align: right; font-size: 0.8rem; color: #8fa8be; white-space: nowrap; }

.ppl-count__label[b-gz96kjjb7g] {
    display: block;
    font-size: 0.68rem;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: #506070;
}

.ppl-count strong[b-gz96kjjb7g] { color: #e2e8f0; font-variant-numeric: tabular-nums; }

.ppl-identity[b-gz96kjjb7g] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    margin: 0 0 16px;
    padding: 10px 14px;
    background: rgba(56,189,248,0.06);
    border: 1px solid rgba(56,189,248,0.25);
    border-radius: 8px;
    font-size: 0.85rem;
    color: #8fa8be;
}

.ppl-identity__bad[b-gz96kjjb7g] { color: #f87171; }

.ppl-saving[b-gz96kjjb7g] { font-size: 0.78rem; color: #38bdf8; margin-left: auto; }

.ppl-message[b-gz96kjjb7g] {
    margin: 0 0 14px;
    padding: 10px 14px;
    border-radius: 8px;
    background: rgba(52,211,153,0.08);
    border: 1px solid rgba(52,211,153,0.3);
    color: #34d399;
    font-size: 0.85rem;
}

/* ── Adding somebody ─────────────────────────────────────────────────────── */

.ppl-add[b-gz96kjjb7g] {
    display: flex;
    align-items: flex-end;
    gap: 12px;
    flex-wrap: wrap;
    margin: 0 0 16px;
    padding: 14px 16px;
    background: #1b2736;
    border: 1px solid #2c3e50;
    border-radius: 10px;
}

.ppl-field[b-gz96kjjb7g] { display: flex; flex-direction: column; gap: 4px; }

.ppl-field > span[b-gz96kjjb7g] {
    font-size: 0.65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #506070;
}

.ppl-field--num[b-gz96kjjb7g] { max-width: 110px; }
.ppl-field--wide[b-gz96kjjb7g] { flex: 1; min-width: 220px; }

.ppl-add__hint[b-gz96kjjb7g] {
    flex-basis: 100%;
    margin: 2px 0 0;
    font-size: 0.78rem;
    line-height: 1.5;
    color: #8fa8be;
}

.ppl-add__hint strong[b-gz96kjjb7g] { color: #c8d9e6; }

/* ── The register ────────────────────────────────────────────────────────── */

.ppl-table td[b-gz96kjjb7g] { vertical-align: middle; }

.ppl-cell--num[b-gz96kjjb7g] { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.ppl-cell--name[b-gz96kjjb7g] { min-width: 180px; font-weight: 600; }
.ppl-cell--email[b-gz96kjjb7g] { min-width: 200px; }
.ppl-cell--actions[b-gz96kjjb7g] { text-align: right; white-space: nowrap; }
.ppl-cell--actions > * + *[b-gz96kjjb7g] { margin-left: 6px; }

/* The Plan link is a button by role and an anchor by element, so it needs the underline removed. */
.ppl-cell--actions a.trace-btn[b-gz96kjjb7g] { display: inline-block; text-decoration: none; }

/* Derived, so it is not clickable and must not look it. */
.ppl-cell--derived[b-gz96kjjb7g] { color: #8fa8be; font-style: italic; }

.ppl-cell--edit[b-gz96kjjb7g] { cursor: text; }
.ppl-cell--edit:hover[b-gz96kjjb7g] { background: rgba(56,189,248,0.07); }

.ppl-cell__none[b-gz96kjjb7g] { color: #2c3e50; }

/* A leaver stays on the page, dimmed. Hiding the row would be the same mistake as deleting it. */
.ppl-row--left > td[b-gz96kjjb7g] { opacity: 0.55; }

.ppl-input[b-gz96kjjb7g] {
    width: 100%;
    min-width: 70px;
    box-sizing: border-box;
    background: #0f1720;
    border: 1px solid #38bdf8;
    border-radius: 4px;
    color: #e2e8f0;
    padding: 4px 6px;
    font-size: 0.82rem;
    outline: none;
}

.ppl-footnote[b-gz96kjjb7g] {
    margin: 12px 0 0;
    font-size: 0.78rem;
    line-height: 1.55;
    color: #8fa8be;
    max-width: 78ch;
}

.ppl-footnote strong[b-gz96kjjb7g] { color: #c8d9e6; }

/* ── Capacity overrides ──────────────────────────────────────────────────── */

.ppl-capacity-row > td[b-gz96kjjb7g] { background: #141d26; padding: 0; }

.ppl-capacity[b-gz96kjjb7g] { padding: 14px 18px; display: flex; flex-direction: column; gap: 12px; }

.ppl-capacity__rule[b-gz96kjjb7g] {
    margin: 0;
    font-size: 0.8rem;
    line-height: 1.55;
    color: #8fa8be;
    max-width: 92ch;
}

.ppl-capacity__rule strong[b-gz96kjjb7g] { color: #c8d9e6; }

.ppl-cap-table[b-gz96kjjb7g] { width: 100%; border-collapse: collapse; font-size: 0.8rem; }

.ppl-cap-table th[b-gz96kjjb7g] {
    text-align: left;
    padding: 6px 10px;
    font-size: 0.65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #506070;
    border-bottom: 1px solid #2c3e50;
    white-space: nowrap;
}

.ppl-cap-table td[b-gz96kjjb7g] {
    padding: 7px 10px;
    border-bottom: 1px solid #1e2d3d;
    color: #c8d9e6;
    white-space: nowrap;
    vertical-align: middle;
}

.ppl-cap-table tbody tr:last-child td[b-gz96kjjb7g] { border-bottom: none; }
.ppl-cap-table__why[b-gz96kjjb7g] { white-space: normal; min-width: 200px; color: #8fa8be; }

.ppl-confirm[b-gz96kjjb7g] { font-size: 0.75rem; color: #fbbf24; margin-right: 6px; }

.ppl-cap-add[b-gz96kjjb7g] {
    display: flex;
    align-items: flex-end;
    gap: 12px;
    flex-wrap: wrap;
    padding: 12px 14px;
    background: #1b2736;
    border: 1px dashed #2c3e50;
    border-radius: 8px;
}

.ppl-cap-add__hint[b-gz96kjjb7g] {
    flex-basis: 100%;
    margin: 2px 0 0;
    font-size: 0.75rem;
    line-height: 1.5;
    color: #506070;
}

/* ── Where a person came from (§24.4) ────────────────────────────────────── */
/* Three states, three shapes. Linked, external and unlinked used to read identically, which is how a
   register drifts into holding one person twice. Unlinked is dashed as well as amber, so the one
   state that wants somebody to act stays distinguishable when the colour is gone — printed, projected
   in a planning meeting, or read by somebody who cannot tell amber from cyan. */

.ppl-link[b-gz96kjjb7g] { text-transform: lowercase; letter-spacing: 0.02em; }
.ppl-link--directory[b-gz96kjjb7g] { background: rgba(56,189,248,0.12);  color: #38bdf8; border: 1px solid  rgba(56,189,248,0.35); }
.ppl-link--external[b-gz96kjjb7g]  { background: rgba(192,132,252,0.12); color: #c084fc; border: 1px solid  rgba(192,132,252,0.38); }
.ppl-link--unlinked[b-gz96kjjb7g]  { background: rgba(251,191,36,0.10);  color: #fbbf24; border: 1px dashed rgba(251,191,36,0.6); }

.ppl-cell--link[b-gz96kjjb7g] { white-space: nowrap; }

/* A badge is a small thing in a wide row. The bar is what makes the rows needing attention findable
   from the top of a register of forty people. */
.ppl-row--unlinked > td:first-child[b-gz96kjjb7g] { box-shadow: inset 3px 0 0 rgba(251,191,36,0.65); }

.ppl-legend[b-gz96kjjb7g] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 22px;
    margin: 0 0 12px;
    font-size: 0.78rem;
    color: #8fa8be;
}

.ppl-legend__item[b-gz96kjjb7g] { display: flex; align-items: center; gap: 8px; max-width: 46ch; line-height: 1.45; }

.ppl-unlinked[b-gz96kjjb7g] { font-size: 0.78rem; color: #fbbf24; white-space: nowrap; }

/* ── The directory picker ────────────────────────────────────────────────── */
/* The cyan edge marks the primary way in, against the violet dashed edge of the external form below
   it. The two are never open at once, so the colour is the only thing carrying which path you are on. */

.ppl-pick[b-gz96kjjb7g] {
    margin: 0 0 16px;
    padding: 14px 16px;
    background: #1b2736;
    border: 1px solid #2c3e50;
    border-left: 3px solid #38bdf8;
    border-radius: 10px;
}

.ppl-pick__head[b-gz96kjjb7g] { display: flex; align-items: flex-end; gap: 12px; flex-wrap: wrap; margin: 0 0 10px; }

/* Capped and scrolled: a customer's access schema can hold hundreds of accounts, and a picker that
   grew without limit would push the register itself off the bottom of the page. */
.ppl-pick__list[b-gz96kjjb7g] { display: flex; flex-direction: column; gap: 6px; max-height: 320px; overflow-y: auto; }

.ppl-pick-row[b-gz96kjjb7g] {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 7px 10px;
    background: #141d26;
    border: 1px solid #1e2d3d;
    border-radius: 6px;
}

.ppl-pick-row:hover[b-gz96kjjb7g] { border-color: #2c3e50; }

/* Dimmed, not hidden. A colleague who is missing from the list looks like somebody the directory does
   not hold; a colleague who is greyed out under the name that claims them explains itself. */
.ppl-pick-row--claimed[b-gz96kjjb7g] { opacity: 0.5; }

.ppl-pick-row__who[b-gz96kjjb7g] { display: flex; flex-direction: column; min-width: 220px; }
.ppl-pick-row__name[b-gz96kjjb7g] { font-size: 0.85rem; font-weight: 600; color: #e2e8f0; }
.ppl-pick-row__email[b-gz96kjjb7g] { font-size: 0.75rem; color: #8fa8be; }
.ppl-pick-row__meta[b-gz96kjjb7g] { font-size: 0.72rem; color: #506070; white-space: nowrap; }

.ppl-pick-row__claim[b-gz96kjjb7g] { margin-left: auto; font-size: 0.75rem; color: #8fa8be; white-space: nowrap; }
.ppl-pick-row__claim strong[b-gz96kjjb7g] { color: #c8d9e6; }
.ppl-pick-row > .trace-btn[b-gz96kjjb7g] { margin-left: auto; }

.ppl-pick__hint[b-gz96kjjb7g] {
    margin: 10px 0 0;
    font-size: 0.78rem;
    line-height: 1.5;
    color: #8fa8be;
    max-width: 92ch;
}

.ppl-pick__hint strong[b-gz96kjjb7g] { color: #c8d9e6; }

/* ── Somebody outside the organisation ───────────────────────────────────── */

.ppl-add--external[b-gz96kjjb7g] { border: 1px dashed #4c3a6b; border-left: 3px solid #c084fc; }

.ppl-add__lead[b-gz96kjjb7g] {
    flex-basis: 100%;
    margin: 0 0 4px;
    font-size: 0.8rem;
    line-height: 1.55;
    color: #8fa8be;
    max-width: 92ch;
}

.ppl-add__lead strong[b-gz96kjjb7g] { color: #c084fc; }

/* ── Linking a row to the directory ──────────────────────────────────────── */

.ppl-link-row > td[b-gz96kjjb7g] { background: #141d26; padding: 0; }

.ppl-link-panel[b-gz96kjjb7g] { padding: 14px 18px; display: flex; flex-direction: column; gap: 12px; }

.ppl-link-panel__rule[b-gz96kjjb7g] {
    margin: 0;
    font-size: 0.8rem;
    line-height: 1.55;
    color: #8fa8be;
    max-width: 92ch;
}

.ppl-link-panel__rule strong[b-gz96kjjb7g] { color: #c8d9e6; }

.ppl-match-list[b-gz96kjjb7g] { display: flex; flex-direction: column; gap: 6px; }

.ppl-match[b-gz96kjjb7g] {
    display: flex;
    align-items: center;
    gap: 14px;
    flex-wrap: wrap;
    padding: 8px 10px;
    background: #1b2736;
    border: 1px solid #1e2d3d;
    border-radius: 6px;
}

.ppl-match__who[b-gz96kjjb7g] { display: flex; flex-direction: column; min-width: 200px; }
.ppl-match__name[b-gz96kjjb7g] { font-size: 0.85rem; font-weight: 600; color: #e2e8f0; }
.ppl-match__email[b-gz96kjjb7g] { font-size: 0.75rem; color: #8fa8be; }

/* Coloured because it is the field being judged, not a caption: an exact address and a sole first
   name arrive in the same list and only this sentence separates them. */
.ppl-match__reason[b-gz96kjjb7g] { font-size: 0.75rem; color: #38bdf8; }

.ppl-match__do[b-gz96kjjb7g] { margin-left: auto; display: flex; gap: 6px; flex-wrap: wrap; }

/* A candidate another row already holds stays listed and dimmed, for the same reason a claimed
   directory row does: gone, it reads as an account that does not exist. */
.ppl-match--held[b-gz96kjjb7g] { opacity: 0.55; }
.ppl-match__note[b-gz96kjjb7g] { font-size: 0.72rem; color: #506070; white-space: nowrap; }
.ppl-match__note--held[b-gz96kjjb7g] { margin-left: auto; color: #8fa8be; }
.ppl-match__note--held strong[b-gz96kjjb7g] { color: #c8d9e6; }

/* ── Light theme ─────────────────────────────────────────────────────────── */

html[data-theme="light"] .ppl-count[b-gz96kjjb7g], html[data-theme="light"] .ppl-count__label[b-gz96kjjb7g] { color: #64748b; }
html[data-theme="light"] .ppl-count strong[b-gz96kjjb7g] { color: #1a2535; }

html[data-theme="light"] .ppl-identity[b-gz96kjjb7g] { background: #f1f8fe; border-color: #bae0f7; color: #4a6278; }
html[data-theme="light"] .ppl-message[b-gz96kjjb7g] { background: #ecfdf5; border-color: #a7f3d0; color: #047857; }

html[data-theme="light"] .ppl-add[b-gz96kjjb7g] { background: #ffffff; border-color: #d1dce8; }
html[data-theme="light"] .ppl-field > span[b-gz96kjjb7g] { color: #94a3b8; }
html[data-theme="light"] .ppl-add__hint[b-gz96kjjb7g] { color: #4a6278; }
html[data-theme="light"] .ppl-add__hint strong[b-gz96kjjb7g] { color: #1a2535; }

html[data-theme="light"] .ppl-cell--derived[b-gz96kjjb7g] { color: #64748b; }
html[data-theme="light"] .ppl-cell--edit:hover[b-gz96kjjb7g] { background: #eff8ff; }
html[data-theme="light"] .ppl-cell__none[b-gz96kjjb7g] { color: #cbd5e1; }
html[data-theme="light"] .ppl-input[b-gz96kjjb7g] { background: #ffffff; color: #1a2535; border-color: #0284c7; }

html[data-theme="light"] .ppl-footnote[b-gz96kjjb7g] { color: #4a6278; }
html[data-theme="light"] .ppl-footnote strong[b-gz96kjjb7g] { color: #1a2535; }

html[data-theme="light"] .ppl-capacity-row > td[b-gz96kjjb7g] { background: #f4f7fb; }
html[data-theme="light"] .ppl-capacity__rule[b-gz96kjjb7g] { color: #4a6278; }
html[data-theme="light"] .ppl-capacity__rule strong[b-gz96kjjb7g] { color: #1a2535; }

html[data-theme="light"] .ppl-cap-table th[b-gz96kjjb7g] { color: #94a3b8; border-bottom-color: #d1dce8; }
html[data-theme="light"] .ppl-cap-table td[b-gz96kjjb7g] { color: #1a2535; border-bottom-color: #e2e8f0; }
html[data-theme="light"] .ppl-cap-table__why[b-gz96kjjb7g] { color: #4a6278; }

html[data-theme="light"] .ppl-confirm[b-gz96kjjb7g] { color: #b45309; }
html[data-theme="light"] .ppl-cap-add[b-gz96kjjb7g] { background: #ffffff; border-color: #d1dce8; }
html[data-theme="light"] .ppl-cap-add__hint[b-gz96kjjb7g] { color: #94a3b8; }

html[data-theme="light"] .ppl-link--directory[b-gz96kjjb7g] { background: rgba(2,132,199,0.08);   color: #0369a1; border-color: rgba(2,132,199,0.25); }
html[data-theme="light"] .ppl-link--external[b-gz96kjjb7g]  { background: rgba(147,51,234,0.08);  color: #7e22ce; border-color: rgba(147,51,234,0.28); }
html[data-theme="light"] .ppl-link--unlinked[b-gz96kjjb7g]  { background: rgba(180,83,9,0.07);    color: #b45309; border-color: rgba(180,83,9,0.5); }
html[data-theme="light"] .ppl-row--unlinked > td:first-child[b-gz96kjjb7g] { box-shadow: inset 3px 0 0 rgba(180,83,9,0.55); }

html[data-theme="light"] .ppl-legend[b-gz96kjjb7g] { color: #4a6278; }
html[data-theme="light"] .ppl-unlinked[b-gz96kjjb7g] { color: #b45309; }

html[data-theme="light"] .ppl-pick[b-gz96kjjb7g] { background: #ffffff; border-color: #d1dce8; border-left-color: #0284c7; }
html[data-theme="light"] .ppl-pick-row[b-gz96kjjb7g] { background: #f4f7fb; border-color: #e2e8f0; }
html[data-theme="light"] .ppl-pick-row:hover[b-gz96kjjb7g] { border-color: #d1dce8; }
html[data-theme="light"] .ppl-pick-row__name[b-gz96kjjb7g] { color: #1a2535; }
html[data-theme="light"] .ppl-pick-row__email[b-gz96kjjb7g] { color: #4a6278; }
html[data-theme="light"] .ppl-pick-row__meta[b-gz96kjjb7g] { color: #94a3b8; }
html[data-theme="light"] .ppl-pick-row__claim[b-gz96kjjb7g] { color: #4a6278; }
html[data-theme="light"] .ppl-pick-row__claim strong[b-gz96kjjb7g] { color: #1a2535; }
html[data-theme="light"] .ppl-pick__hint[b-gz96kjjb7g] { color: #4a6278; }
html[data-theme="light"] .ppl-pick__hint strong[b-gz96kjjb7g] { color: #1a2535; }

html[data-theme="light"] .ppl-add--external[b-gz96kjjb7g] { border-color: #ddd0f2; border-left-color: #7e22ce; }
html[data-theme="light"] .ppl-add__lead[b-gz96kjjb7g] { color: #4a6278; }
html[data-theme="light"] .ppl-add__lead strong[b-gz96kjjb7g] { color: #7e22ce; }

html[data-theme="light"] .ppl-link-row > td[b-gz96kjjb7g] { background: #f4f7fb; }
html[data-theme="light"] .ppl-link-panel__rule[b-gz96kjjb7g] { color: #4a6278; }
html[data-theme="light"] .ppl-link-panel__rule strong[b-gz96kjjb7g] { color: #1a2535; }
html[data-theme="light"] .ppl-match[b-gz96kjjb7g] { background: #ffffff; border-color: #e2e8f0; }
html[data-theme="light"] .ppl-match__name[b-gz96kjjb7g] { color: #1a2535; }
html[data-theme="light"] .ppl-match__email[b-gz96kjjb7g] { color: #4a6278; }
html[data-theme="light"] .ppl-match__reason[b-gz96kjjb7g] { color: #0369a1; }
html[data-theme="light"] .ppl-match__note[b-gz96kjjb7g] { color: #94a3b8; }
html[data-theme="light"] .ppl-match__note--held[b-gz96kjjb7g] { color: #4a6278; }
html[data-theme="light"] .ppl-match__note--held strong[b-gz96kjjb7g] { color: #1a2535; }
/* /Components/Trace/PlanningWorkspace.razor.rz.scp.css */
/* The Trace pages are split on this: most take their classes from wwwroot/app.css, while
   TraceHome, AssistPanel, CoverageView and MermaidDiagram each carry an isolated stylesheet. The
   grid needs a colour scale and a frozen column that belong to nothing else, so it takes the second
   convention rather than adding page-specific rules to the shared sheet. */

.plan-asof[b-rz32pdxhv3] {
    text-align: right;
    font-size: 0.78rem;
    color: #8fa8be;
    white-space: nowrap;
}

.plan-asof__label[b-rz32pdxhv3] {
    display: block;
    font-size: 0.68rem;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: #506070;
}

.plan-asof strong[b-rz32pdxhv3] { color: #e2e8f0; font-variant-numeric: tabular-nums; }

/* ── Who is editing ──────────────────────────────────────────────────────── */

.plan-identity[b-rz32pdxhv3] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    margin: 0 0 16px;
    padding: 10px 14px;
    background: rgba(56,189,248,0.06);
    border: 1px solid rgba(56,189,248,0.25);
    border-radius: 8px;
    font-size: 0.85rem;
    color: #8fa8be;
}

.plan-identity__bad[b-rz32pdxhv3] { color: #f87171; }

/* ── The gap set ─────────────────────────────────────────────────────────── */

/* The gap list sits under the grid, so it supplies its own air above: trace-section only puts
   margin underneath, which was enough while this was the first thing on the page. */
.plan-gaps-section[b-rz32pdxhv3] { margin-top: 24px; }

.plan-gaps[b-rz32pdxhv3] { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }

.plan-gap[b-rz32pdxhv3] {
    display: flex;
    align-items: baseline;
    gap: 10px;
    padding: 8px 12px;
    background: #1b2736;
    border: 1px solid #2c3e50;
    border-left-width: 3px;
    border-radius: 6px;
    font-size: 0.855rem;
    color: #c8d9e6;
}

.plan-gap--blocking[b-rz32pdxhv3], .plan-gap--error[b-rz32pdxhv3] { border-left-color: #f87171; }
.plan-gap--warning[b-rz32pdxhv3] { border-left-color: #fbbf24; }
.plan-gap--info[b-rz32pdxhv3] { border-left-color: #38bdf8; }

.plan-gap__text[b-rz32pdxhv3] { flex: 1; }
.plan-gap__week[b-rz32pdxhv3] { color: #506070; font-size: 0.78rem; white-space: nowrap; }

/* ── Toolbar and legend ──────────────────────────────────────────────────── */

.plan-toolbar[b-rz32pdxhv3] { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 10px; }

.plan-toolbar__window[b-rz32pdxhv3] {
    font-size: 0.855rem;
    font-weight: 700;
    color: #e2e8f0;
    padding: 0 6px;
    font-variant-numeric: tabular-nums;
}

.plan-toolbar__weeks[b-rz32pdxhv3],
.plan-toolbar__project[b-rz32pdxhv3] {
    background: #1b2736;
    border: 1px solid #2c3e50;
    border-radius: 6px;
    color: #8fa8be;
    padding: 7px 10px;
    font-size: 0.82rem;
}

.plan-toolbar__project[b-rz32pdxhv3] { max-width: 320px; }

/* FR #43 — the one line that answers "is this project staffed, and what has it consumed". */
.plan-project-summary[b-rz32pdxhv3] {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 6px 18px;
    margin-bottom: 10px;
    font-size: 0.85rem;
    color: #8fa8be;
}
.plan-project-summary__name[b-rz32pdxhv3] { font-weight: 700; color: #e2e8f0; }
.plan-project-summary strong[b-rz32pdxhv3] { color: #e2e8f0; font-variant-numeric: tabular-nums; }
.plan-project-summary__over[b-rz32pdxhv3] { color: #f87171; }
.plan-project-total .plan-name[b-rz32pdxhv3] { font-size: 0.85rem; }

.plan-toolbar__saving[b-rz32pdxhv3] { font-size: 0.78rem; color: #38bdf8; margin-left: auto; }

.plan-legend[b-rz32pdxhv3] {
    display: flex;
    align-items: center;
    gap: 14px;
    flex-wrap: wrap;
    margin-bottom: 10px;
    font-size: 0.75rem;
    color: #8fa8be;
}

.plan-legend__item[b-rz32pdxhv3] { display: inline-flex; align-items: center; gap: 5px; }
.plan-legend__hint[b-rz32pdxhv3] { color: #506070; }

.plan-swatch[b-rz32pdxhv3] {
    display: inline-block;
    width: 16px;
    height: 12px;
    border-radius: 3px;
    border: 1px solid #2c3e50;
}

/* ── The grid ────────────────────────────────────────────────────────────── */

/* Only this element scrolls sideways; the page must not. */
.plan-scroll[b-rz32pdxhv3] {
    overflow-x: auto;
    max-width: 100%;
    border: 1px solid #2c3e50;
    border-radius: 8px;
    background: #1b2736;
}

.plan-grid[b-rz32pdxhv3] { border-collapse: separate; border-spacing: 0; font-size: 0.82rem; }

.plan-grid th[b-rz32pdxhv3] {
    padding: 7px 10px;
    background: #141d26;
    color: #8fa8be;
    font-weight: 700;
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    white-space: nowrap;
    border-bottom: 1px solid #2c3e50;
    position: sticky;
    top: 0;
    z-index: 2;
}

.plan-grid td[b-rz32pdxhv3] {
    padding: 4px 8px;
    border-bottom: 1px solid #1e2d3d;
    color: #c8d9e6;
    vertical-align: middle;
}

/* The frozen identity column. It needs its own opaque background or the cells scrolling under it
   show through, which reads as a rendering fault rather than as a frozen column. */
.plan-name[b-rz32pdxhv3] {
    position: sticky;
    left: 0;
    z-index: 3;
    min-width: 230px;
    max-width: 230px;
    background: #1b2736;
    border-right: 1px solid #2c3e50;
}

.plan-grid th.plan-name[b-rz32pdxhv3] { z-index: 4; background: #141d26; }

.plan-name--demand[b-rz32pdxhv3] { padding-left: 26px; font-size: 0.78rem; }

.plan-week[b-rz32pdxhv3] { text-align: center; min-width: 84px; }
.plan-week__no[b-rz32pdxhv3] { display: block; }
.plan-week__date[b-rz32pdxhv3] { display: block; font-weight: 400; text-transform: none; letter-spacing: 0; color: #506070; }

/* This week, marked in the header exactly as the document this page replaces marked it.
   Qualified as th.plan-week--current on purpose: .plan-grid th sets a colour and outranks a bare
   .plan-week--current, so the red was being repainted grey and the column was left marked by an
   underline alone. Same trap as the light-theme border-color shorthand at the foot of this file — a
   general rule quietly winning against a single-property accent. */
.plan-grid th.plan-week--current[b-rz32pdxhv3] { color: #f87171; box-shadow: inset 0 -2px 0 #f87171; }
.plan-col--current[b-rz32pdxhv3] { box-shadow: inset 1px 0 0 rgba(248,113,113,0.3), inset -1px 0 0 rgba(248,113,113,0.3); }

.plan-person__row[b-rz32pdxhv3] { display: flex; align-items: center; gap: 6px; }

/* The chevron and nothing else. The name beside it is a link now, so the toggle must not stretch
   across the cell: a full-width button sitting under a link takes the clicks meant for the link. */
.plan-expand[b-rz32pdxhv3] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: none;
    width: 18px;
    height: 18px;
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    color: #8fa8be;
}

.plan-expand:hover[b-rz32pdxhv3] { color: #e2e8f0; }

.plan-person__name[b-rz32pdxhv3] { font-weight: 700; font-size: 0.855rem; color: #e2e8f0; text-decoration: none; }
.plan-person__name:hover[b-rz32pdxhv3] { color: #38bdf8; text-decoration: underline; }

/* 18px of button plus the 6px gap — the meta line hangs under the name, not under the chevron. */
.plan-person__meta[b-rz32pdxhv3] { margin-left: 24px; font-size: 0.7rem; color: #506070; }
.plan-person__inactive[b-rz32pdxhv3] { color: #fbbf24; }

.plan-row-total > td[b-rz32pdxhv3] { border-top: 1px solid #2c3e50; }
.plan-row-demand:hover > td[b-rz32pdxhv3] { background: rgba(255,255,255,0.03); }
.plan-row-demand:hover > .plan-name[b-rz32pdxhv3] { background: #22303f; }

/* ── Cells ───────────────────────────────────────────────────────────────── */

.plan-cell[b-rz32pdxhv3], .plan-total[b-rz32pdxhv3] { text-align: center; cursor: default; }
.plan-cell[b-rz32pdxhv3] { cursor: text; }

.plan-cell__val[b-rz32pdxhv3] { display: block; font-weight: 700; font-variant-numeric: tabular-nums; }
.plan-cell__val--none[b-rz32pdxhv3] { color: #2c3e50; font-weight: 400; }
.plan-cell__val--token[b-rz32pdxhv3] { font-weight: 600; font-size: 0.75rem; }
.plan-cell__sub[b-rz32pdxhv3] { display: block; font-size: 0.65rem; opacity: 0.75; font-variant-numeric: tabular-nums; }

/* 10 / 25 / 50 / 75 / 100 greens, red over, amber under, #fde68a uncertain — the scale ported from
   the hand-maintained dashboard. It is only readable as one scale because every cell on the grid is
   a share of the same thing: that person's available project time. */
.plan-cell--empty[b-rz32pdxhv3] { background: transparent; }
.plan-cell--p10[b-rz32pdxhv3]  { background: rgba(52,211,153,0.10); color: #a7f3d0; }
.plan-cell--p25[b-rz32pdxhv3]  { background: rgba(52,211,153,0.18); color: #a7f3d0; }
.plan-cell--p50[b-rz32pdxhv3]  { background: rgba(52,211,153,0.30); color: #d1fae5; }
.plan-cell--p75[b-rz32pdxhv3]  { background: rgba(52,211,153,0.44); color: #ecfdf5; }
.plan-cell--p100[b-rz32pdxhv3] { background: rgba(52,211,153,0.60); color: #ffffff; }
.plan-cell--over[b-rz32pdxhv3] { background: rgba(248,113,113,0.55); color: #fff1f1; }
.plan-cell--token[b-rz32pdxhv3] { background: #fde68a; color: #1a2535; }

.plan-total[b-rz32pdxhv3] { font-weight: 700; }
.plan-total--empty[b-rz32pdxhv3], .plan-total--ok[b-rz32pdxhv3] { color: #c8d9e6; }
.plan-total--over[b-rz32pdxhv3]  { background: rgba(248,113,113,0.28); color: #fca5a5; }
.plan-total--under[b-rz32pdxhv3] { background: rgba(251,191,36,0.20); color: #fbbf24; }

/* No available project time at all — a holiday week. Grey, not amber: somebody who is away is not
   under-allocated, and colouring them as if they were teaches the room to ignore amber. */
.plan-total--off[b-rz32pdxhv3] { background: rgba(100,116,139,0.12); color: #506070; }

/* "4/5 d" — the calendar showing through into the plan. It takes the cell's own colour rather than a
   literal, so it stays legible on all four total tints and needs no light-theme rule of its own; the
   light block already restates those colours and this follows them. */
.plan-total__days[b-rz32pdxhv3] {
    display: block;
    font-size: 0.62rem;
    font-weight: 600;
    letter-spacing: 0.03em;
    opacity: 0.8;
    font-variant-numeric: tabular-nums;
}

.plan-token-flag[b-rz32pdxhv3] {
    display: inline-block;
    margin-top: 2px;
    font-size: 0.65rem;
    font-weight: 700;
    color: #1a2535;
    background: #fde68a;
    border-radius: 3px;
    padding: 0 4px;
}

.plan-input[b-rz32pdxhv3] {
    width: 100%;
    min-width: 60px;
    box-sizing: border-box;
    background: #0f1720;
    border: 1px solid #38bdf8;
    border-radius: 4px;
    color: #e2e8f0;
    padding: 4px 6px;
    font-size: 0.82rem;
    font-weight: 700;
    text-align: center;
    outline: none;
}

.plan-add[b-rz32pdxhv3] {
    background: #1b2736;
    border: 1px dashed #2c3e50;
    border-radius: 5px;
    color: #8fa8be;
    padding: 4px 8px;
    font-size: 0.75rem;
    max-width: 100%;
}

.plan-add__rest[b-rz32pdxhv3] { background: transparent; }

/* ── Light theme ─────────────────────────────────────────────────────────── */

html[data-theme="light"] .plan-asof strong[b-rz32pdxhv3] { color: #1a2535; }
html[data-theme="light"] .plan-asof[b-rz32pdxhv3], html[data-theme="light"] .plan-asof__label[b-rz32pdxhv3] { color: #64748b; }

html[data-theme="light"] .plan-identity[b-rz32pdxhv3] { background: #f1f8fe; border-color: #bae0f7; color: #4a6278; }

/* Three sides named, not the border-color shorthand. The shorthand sets all four, and this selector
   outranks .plan-gap--blocking / --warning / --info, so it would repaint the severity edge pale grey
   in light theme and the accent would be gone rather than faint. Naming the three sides leaves one
   definition of each severity colour, so the two themes cannot drift apart. */
html[data-theme="light"] .plan-gap[b-rz32pdxhv3] {
    background: #ffffff;
    border-top-color: #d1dce8;
    border-right-color: #d1dce8;
    border-bottom-color: #d1dce8;
    color: #1a2535;
}

html[data-theme="light"] .plan-gap__week[b-rz32pdxhv3] { color: #94a3b8; }

html[data-theme="light"] .plan-toolbar__window[b-rz32pdxhv3] { color: #1a2535; }
html[data-theme="light"] .plan-toolbar__weeks[b-rz32pdxhv3],
html[data-theme="light"] .plan-toolbar__project[b-rz32pdxhv3],
html[data-theme="light"] .plan-add[b-rz32pdxhv3] { background: #ffffff; border-color: #d1dce8; color: #4a6278; }
html[data-theme="light"] .plan-project-summary[b-rz32pdxhv3] { color: #64748b; }
html[data-theme="light"] .plan-project-summary__name[b-rz32pdxhv3],
html[data-theme="light"] .plan-project-summary strong[b-rz32pdxhv3] { color: #1a2535; }
html[data-theme="light"] .plan-project-summary__over[b-rz32pdxhv3] { color: #dc2626; }

html[data-theme="light"] .plan-legend[b-rz32pdxhv3] { color: #64748b; }
html[data-theme="light"] .plan-swatch[b-rz32pdxhv3] { border-color: #d1dce8; }

html[data-theme="light"] .plan-scroll[b-rz32pdxhv3] { background: #ffffff; border-color: #d1dce8; }
html[data-theme="light"] .plan-grid th[b-rz32pdxhv3] { background: #f4f7fb; color: #4a6278; border-bottom-color: #d1dce8; }
html[data-theme="light"] .plan-grid td[b-rz32pdxhv3] { border-bottom-color: #eef2f7; color: #1a2535; }
html[data-theme="light"] .plan-name[b-rz32pdxhv3] { background: #ffffff; border-right-color: #d1dce8; }
html[data-theme="light"] .plan-grid th.plan-name[b-rz32pdxhv3] { background: #f4f7fb; }
html[data-theme="light"] .plan-week__date[b-rz32pdxhv3] { color: #94a3b8; }

/* Carries the th too, and must: html[data-theme="light"] .plan-grid th is the more specific selector
   of the two and would otherwise repaint this week's header the same grey as every other one.
   Restated in the light red the over-tints already use rather than the dark one, which goes pale on
   a white ground. */
html[data-theme="light"] .plan-grid th.plan-week--current[b-rz32pdxhv3] { color: #dc2626; box-shadow: inset 0 -2px 0 #dc2626; }
html[data-theme="light"] .plan-col--current[b-rz32pdxhv3] {
    box-shadow: inset 1px 0 0 rgba(220,38,38,0.35), inset -1px 0 0 rgba(220,38,38,0.35);
}

html[data-theme="light"] .plan-expand[b-rz32pdxhv3] { color: #64748b; }
html[data-theme="light"] .plan-expand:hover[b-rz32pdxhv3] { color: #1a2535; }
html[data-theme="light"] .plan-person__name[b-rz32pdxhv3] { color: #1a2535; }
html[data-theme="light"] .plan-person__name:hover[b-rz32pdxhv3] { color: #2563eb; }
html[data-theme="light"] .plan-person__meta[b-rz32pdxhv3] { color: #94a3b8; }
html[data-theme="light"] .plan-row-total > td[b-rz32pdxhv3] { border-top-color: #d1dce8; }
html[data-theme="light"] .plan-row-demand:hover > .plan-name[b-rz32pdxhv3] { background: #f4f7fb; }

html[data-theme="light"] .plan-cell--p10[b-rz32pdxhv3]  { background: rgba(5,150,105,0.10); color: #065f46; }
html[data-theme="light"] .plan-cell--p25[b-rz32pdxhv3]  { background: rgba(5,150,105,0.18); color: #065f46; }
html[data-theme="light"] .plan-cell--p50[b-rz32pdxhv3]  { background: rgba(5,150,105,0.30); color: #04352a; }
html[data-theme="light"] .plan-cell--p75[b-rz32pdxhv3]  { background: rgba(5,150,105,0.44); color: #04352a; }
html[data-theme="light"] .plan-cell--p100[b-rz32pdxhv3] { background: rgba(5,150,105,0.60); color: #022c22; }
html[data-theme="light"] .plan-cell--over[b-rz32pdxhv3] { background: rgba(220,38,38,0.45); color: #450a0a; }
html[data-theme="light"] .plan-cell__val--none[b-rz32pdxhv3] { color: #d1dce8; }

html[data-theme="light"] .plan-total--empty[b-rz32pdxhv3], html[data-theme="light"] .plan-total--ok[b-rz32pdxhv3] { color: #1a2535; }
html[data-theme="light"] .plan-total--over[b-rz32pdxhv3]  { background: rgba(220,38,38,0.14); color: #b91c1c; }
html[data-theme="light"] .plan-total--under[b-rz32pdxhv3] { background: rgba(217,119,6,0.16); color: #b45309; }
html[data-theme="light"] .plan-total--off[b-rz32pdxhv3]   { background: rgba(100,116,139,0.10); color: #94a3b8; }

html[data-theme="light"] .plan-input[b-rz32pdxhv3] { background: #ffffff; color: #1a2535; border-color: #0284c7; }
/* /Components/Trace/ProjectPlanCard.razor.rz.scp.css */
/* Isolated, on the convention PlanningWorkspace.razor.css and PlanningCheckins.razor.css set: the
   allocation strip and the check-in extract belong to this card alone. Section, badge, stat and filter
   classes still come from wwwroot/app.css.

   Dark is the base and light is the override block at the end. This card sits in the middle of a
   project page, so a missing light block would not be a page nobody visits — it would be a hole in the
   page everybody visits. */

.ppc-failed[b-hwhjpmkm4y] { margin: 0 0 16px; font-size: 0.82rem; color: #8fa8be; }

.ppc-lead[b-hwhjpmkm4y] { font-size: 0.85rem; color: #8fa8be; }
.ppc-lead strong[b-hwhjpmkm4y] { color: #e2e8f0; }
.ppc-lead--none[b-hwhjpmkm4y] { color: #fbbf24; }

.ppc-none[b-hwhjpmkm4y] { margin: 4px 0 0; font-size: 0.85rem; color: #506070; line-height: 1.5; }

/* ── The allocation strip ────────────────────────────────────────────────── */

/* Only this wrapper scrolls sideways; the project page never does. */
.ppc-scroll[b-hwhjpmkm4y] {
    overflow-x: auto;
    max-width: 100%;
    border: 1px solid #2c3e50;
    border-radius: 8px;
    background: #1b2736;
}

.ppc-strip[b-hwhjpmkm4y] { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 0.82rem; }

.ppc-strip th[b-hwhjpmkm4y] {
    padding: 7px 10px;
    background: #141d26;
    color: #8fa8be;
    font-weight: 700;
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    white-space: nowrap;
    border-bottom: 1px solid #2c3e50;
    text-align: center;
}

.ppc-strip td[b-hwhjpmkm4y] {
    padding: 6px 10px;
    border-bottom: 1px solid #1e2d3d;
    color: #c8d9e6;
    text-align: center;
    vertical-align: middle;
}

.ppc-strip tr:last-child td[b-hwhjpmkm4y] { border-bottom: none; }

.ppc-who[b-hwhjpmkm4y] { text-align: left; min-width: 11rem; white-space: nowrap; }
.ppc-strip th.ppc-who[b-hwhjpmkm4y] { text-align: left; }

.ppc-num[b-hwhjpmkm4y] { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; font-weight: 700; }
.ppc-strip th.ppc-num[b-hwhjpmkm4y] { text-align: right; }

.ppc-week[b-hwhjpmkm4y] { min-width: 4.5rem; }
.ppc-week__no[b-hwhjpmkm4y] { display: block; }
.ppc-week__date[b-hwhjpmkm4y] { display: block; font-weight: 400; text-transform: none; letter-spacing: 0; color: #506070; }

/* This week, marked the way the allocation grid marks it, so the two pages agree about where "now" is. */
.ppc-week--current[b-hwhjpmkm4y] { color: #f87171; box-shadow: inset 0 -2px 0 #f87171; }
.ppc-cell--current[b-hwhjpmkm4y] { box-shadow: inset 1px 0 0 rgba(248,113,113,0.3), inset -1px 0 0 rgba(248,113,113,0.3); }

.ppc-cell__val[b-hwhjpmkm4y] { display: block; font-weight: 700; font-variant-numeric: tabular-nums; }
.ppc-cell__none[b-hwhjpmkm4y] { color: #2c3e50; }
.ppc-cell__token[b-hwhjpmkm4y] { display: block; font-size: 0.68rem; color: #fde68a; }

/* Somebody who is away is not under-allocated. Grey, never amber: colouring absence as a shortfall
   teaches the reader to ignore the colour that means a shortfall. */
.ppc-cell--blocked[b-hwhjpmkm4y] { background: rgba(100,116,139,0.12); }
.ppc-cell--blocked .ppc-cell__val[b-hwhjpmkm4y] { color: #8fa8be; }

/* ── The latest check-in ─────────────────────────────────────────────────── */

.ppc-checkin[b-hwhjpmkm4y] {
    margin-top: 14px;
    padding: 12px 14px;
    background: #1b2736;
    border: 1px solid #2c3e50;
    border-radius: 8px;
}

.ppc-checkin__head[b-hwhjpmkm4y] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 6px;
}

.ppc-checkin__label[b-hwhjpmkm4y] {
    font-size: 0.65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #506070;
}

/* Narratives are typed as prose with line breaks; collapsing them would run a risk list into one
   sentence, which is the field a reader is trying to take in quickly. */
.ppc-checkin__text[b-hwhjpmkm4y] {
    margin: 0 0 6px;
    font-size: 0.82rem;
    line-height: 1.5;
    color: #c8d9e6;
    white-space: pre-wrap;
}

.ppc-checkin__silent[b-hwhjpmkm4y] { margin: 0 0 6px; font-size: 0.82rem; color: #506070; font-style: italic; }
.ppc-checkin__by[b-hwhjpmkm4y] { font-size: 0.72rem; color: #506070; }

/* ── Light theme ─────────────────────────────────────────────────────────── */

html[data-theme="light"] .ppc-failed[b-hwhjpmkm4y] { color: #64748b; }
html[data-theme="light"] .ppc-lead[b-hwhjpmkm4y] { color: #4a6278; }
html[data-theme="light"] .ppc-lead strong[b-hwhjpmkm4y] { color: #1a2535; }
html[data-theme="light"] .ppc-lead--none[b-hwhjpmkm4y] { color: #b45309; }
html[data-theme="light"] .ppc-none[b-hwhjpmkm4y] { color: #64748b; }

html[data-theme="light"] .ppc-scroll[b-hwhjpmkm4y] { background: #ffffff; border-color: #d1dce8; }
html[data-theme="light"] .ppc-strip th[b-hwhjpmkm4y] { background: #f4f7fb; color: #4a6278; border-bottom-color: #d1dce8; }
html[data-theme="light"] .ppc-strip td[b-hwhjpmkm4y] { border-bottom-color: #eef2f7; color: #1a2535; }
html[data-theme="light"] .ppc-week__date[b-hwhjpmkm4y] { color: #94a3b8; }
html[data-theme="light"] .ppc-cell__none[b-hwhjpmkm4y] { color: #d1dce8; }
html[data-theme="light"] .ppc-cell__token[b-hwhjpmkm4y] { color: #b45309; }
html[data-theme="light"] .ppc-cell--blocked[b-hwhjpmkm4y] { background: rgba(100,116,139,0.10); }
html[data-theme="light"] .ppc-cell--blocked .ppc-cell__val[b-hwhjpmkm4y] { color: #64748b; }

html[data-theme="light"] .ppc-checkin[b-hwhjpmkm4y] { background: #ffffff; border-color: #d1dce8; }
html[data-theme="light"] .ppc-checkin__label[b-hwhjpmkm4y],
html[data-theme="light"] .ppc-checkin__silent[b-hwhjpmkm4y],
html[data-theme="light"] .ppc-checkin__by[b-hwhjpmkm4y] { color: #94a3b8; }
html[data-theme="light"] .ppc-checkin__text[b-hwhjpmkm4y] { color: #1a2535; }
/* /Components/Trace/TimeReport.razor.rz.scp.css */
/* Isolated, on the same convention as PlanningWorkspace.razor.css and PlanningCheckins.razor.css: the
   two rings, the variance colours and the paired bars belong to this page alone and have no business in
   the shared sheet. Page, table, badge and button classes still come from wwwroot/app.css.

   Dark is the base and light is the override block at the end, because that is how both sibling sheets
   are built. A sheet with dark literals and no light block is a page that is unreadable in one of the
   two themes the product ships — which is exactly how this convention came to be written down. */

.tr-date[b-ro6adj7zjo] { max-width: 10rem; }

.tr-state[b-ro6adj7zjo] { margin-top: -2px; }

/* ── The caveats ─────────────────────────────────────────────────────────── */

/* Amber, not red: none of these say the figures are wrong. They say what the figures cover, which is
   the difference between a number somebody quotes and a number somebody quotes and regrets. */
.tr-note[b-ro6adj7zjo] {
    margin: 0 0 10px;
    padding: 9px 13px;
    border-radius: 8px;
    background: rgba(251,191,36,0.07);
    border: 1px solid rgba(251,191,36,0.28);
    color: #fbbf24;
    font-size: 0.8rem;
    line-height: 1.5;
}

.tr-count[b-ro6adj7zjo] { margin: 0 0 18px; font-size: 0.85rem; color: #8fa8be; line-height: 1.5; }

/* ── The rings ───────────────────────────────────────────────────────────── */

.tr-chart[b-ro6adj7zjo] {
    display: flex;
    flex-wrap: wrap;
    gap: 32px;
    align-items: center;
    margin: 4px 0 26px;
}

/* The full circle each ring is measured against. Without it a ring that stops short reads as a slice
   that failed to draw rather than as the shortfall it is. */
.tr-track[b-ro6adj7zjo] { stroke: rgba(148,163,184,0.13); }

.tr-donut__total[b-ro6adj7zjo] { fill: currentColor; font-size: 21px; font-weight: 700; }
.tr-donut__sub[b-ro6adj7zjo] { fill: currentColor; font-size: 9px; opacity: 0.7; }

.tr-legend[b-ro6adj7zjo] { display: flex; flex-direction: column; gap: 8px; min-width: 20rem; flex: 1; }

.tr-legend__scale[b-ro6adj7zjo] {
    margin: 0 0 4px;
    font-size: 0.75rem;
    line-height: 1.5;
    color: #506070;
    max-width: 30rem;
}

.tr-legend__row[b-ro6adj7zjo] { display: flex; align-items: center; gap: 10px; font-size: 0.85rem; }

.tr-swatch[b-ro6adj7zjo] { display: inline-block; width: 11px; height: 11px; border-radius: 3px; flex: none; }

.tr-legend__label[b-ro6adj7zjo] { flex: 1; }
.tr-legend__hours[b-ro6adj7zjo] { font-weight: 700; font-variant-numeric: tabular-nums; }
.tr-legend__share[b-ro6adj7zjo] { width: 3.5rem; text-align: right; }

/* ── The table ───────────────────────────────────────────────────────────── */

.tr-num[b-ro6adj7zjo] { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }

.tr-planned[b-ro6adj7zjo] { color: #8fa8be; }
.tr-actual[b-ro6adj7zjo] { font-weight: 700; }

/* The word beside the number is what makes the sign mean something: "−12 h" alone reads as neither an
   under-spend nor an over-spend, and the two are different conversations. */
.tr-var__num[b-ro6adj7zjo] { display: block; font-weight: 700; }
.tr-var__word[b-ro6adj7zjo] { display: block; font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.05em; opacity: 0.85; }

.tr-var--over[b-ro6adj7zjo] { color: #fbbf24; }
.tr-var--under[b-ro6adj7zjo] { color: #38bdf8; }
.tr-var--flat[b-ro6adj7zjo] { color: #34d399; }
.tr-var--unplanned[b-ro6adj7zjo] { color: #fb923c; }
.tr-var--untouched[b-ro6adj7zjo] { color: #8fa8be; }

.tr-barcol[b-ro6adj7zjo] { width: 26%; min-width: 8rem; }

.tr-bar[b-ro6adj7zjo] { display: block; height: 7px; border-radius: 4px; min-width: 1px; }

/* Planned is the ghost and logged is the solid one, in that order top to bottom, so a logged bar
   running past the one above it is an overrun at a glance. */
.tr-bar--planned[b-ro6adj7zjo] { opacity: 0.35; margin-bottom: 3px; }
.tr-bar--actual[b-ro6adj7zjo] { opacity: 0.9; }

.tr-total > td[b-ro6adj7zjo] { border-top: 1px solid #2c3e50; font-weight: 700; }

/* ── Light theme ─────────────────────────────────────────────────────────── */

html[data-theme="light"] .tr-note[b-ro6adj7zjo] { background: #fffbeb; border-color: #fde68a; color: #b45309; }
html[data-theme="light"] .tr-count[b-ro6adj7zjo] { color: #4a6278; }
html[data-theme="light"] .tr-track[b-ro6adj7zjo] { stroke: rgba(100,116,139,0.15); }
html[data-theme="light"] .tr-legend__scale[b-ro6adj7zjo] { color: #64748b; }
html[data-theme="light"] .tr-planned[b-ro6adj7zjo] { color: #64748b; }

html[data-theme="light"] .tr-var--over[b-ro6adj7zjo] { color: #b45309; }
html[data-theme="light"] .tr-var--under[b-ro6adj7zjo] { color: #0369a1; }
html[data-theme="light"] .tr-var--flat[b-ro6adj7zjo] { color: #15803d; }
html[data-theme="light"] .tr-var--unplanned[b-ro6adj7zjo] { color: #c2410c; }
html[data-theme="light"] .tr-var--untouched[b-ro6adj7zjo] { color: #64748b; }

html[data-theme="light"] .tr-total > td[b-ro6adj7zjo] { border-top-color: #d1dce8; }
/* /Components/Trace/TimeSheet.razor.rz.scp.css */
/* Isolated for the same reason as the other planning sheets: the cell input and the row bin belong to
   this screen alone. Table, button, badge and page chrome still come from wwwroot/app.css — only what
   is new to the timesheet lives here. Dark values are the base; the light theme overrides at the end. */

/* The cell is an input at rest, so it has to read as a number in a table and not as a form field: no
   fill, no weight of its own, and a border faint enough that eighty of them do not become a grid of
   boxes. It only asserts itself on focus, which is the one thing the arrow keys make load-bearing —
   somebody filling a week with the keyboard needs to see where they are without looking for a caret. */
.ts-cell[b-lid18lwz91] {
    width: 4.4rem;
    padding: 3px 6px;
    text-align: right;
    background: transparent;
    color: inherit;
    font: inherit;
    border: 1px solid rgba(127, 127, 127, 0.3);
    border-radius: 4px;
}

.ts-cell:focus[b-lid18lwz91] {
    outline: none;
    border-color: #38bdf8;
    box-shadow: 0 0 0 2px rgba(56, 189, 248, 0.18);
}

/* ── The row's bin ───────────────────────────────────────────────────────── */

.ts-actions[b-lid18lwz91] { width: 1%; white-space: nowrap; text-align: right; }

.ts-bin[b-lid18lwz91] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 3px;
    background: transparent;
    border: 1px solid transparent;
    border-radius: 4px;
    color: #506070;
    cursor: pointer;
    transition: color 0.12s, border-color 0.12s;
}

.ts-bin:hover:not([disabled])[b-lid18lwz91] { color: #f87171; border-color: rgba(248, 113, 113, 0.35); }
.ts-bin:focus-visible[b-lid18lwz91] { outline: none; color: #f87171; border-color: #f87171; }
.ts-bin[disabled][b-lid18lwz91] { opacity: 0.4; cursor: default; }

/* Where a bin would be on a row that has one but cannot use it. Stated rather than left blank: an
   empty cell in a column of bins reads as a missing control, not as a rule. */
.ts-actions__note[b-lid18lwz91] { font-size: 0.7rem; color: #506070; white-space: nowrap; }

/* ── The confirmation ────────────────────────────────────────────────────── */

/* Directly under the row it is about. A bar at the top of the page would ask about hours the reader
   would have to scroll to see, on a screen where two rows differ only by the task in small type.

   The element and the child combinator are both load-bearing: the shared sheet paints a row background
   on hover at the same specificity, and anything weaker here would leave the confirmation looking like
   any other row the pointer happens to be over. */
tr.ts-confirm > td[b-lid18lwz91] {
    padding: 8px 14px;
    background: rgba(248, 113, 113, 0.08);
    border-bottom: 1px solid rgba(248, 113, 113, 0.2);
}

.ts-confirm__ask[b-lid18lwz91] { margin-right: 10px; font-size: 0.85rem; color: #e2e8f0; }

.ts-confirm__note[b-lid18lwz91] { margin-left: 10px; font-size: 0.75rem; color: #8fa8be; }

/* Read by a screen reader, invisible to everyone else: the bin column's header. A column of controls
   with no name is announced as nothing at all. */
.ts-hidden[b-lid18lwz91] {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
    border: 0;
}

/* ── The reference on a row ──────────────────────────────────────────────── */

/* A code, set small and quiet, under the task it belongs to. It has to be readable at a glance and
   it must not compete with the hours: a week with eight linked rows should still scan as a column
   of numbers with some codes beside them, not as a second table. */
.ts-ref[b-lid18lwz91] {
    display: inline-block;
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.01em;
    color: #7dd3fc;
    cursor: help;              /* everything else about the reference is in the title attribute */
}

/* Reserved for the two states a person can act on: a reference whose target cannot be read, and a
   row whose days disagree about what they were work on. A label that merely differs from the
   current title is NOT one of them — writing your own words for a row is normal, and a warning on
   every such row is how people learn to ignore the two that matter. */
.ts-ref--warn[b-lid18lwz91] { color: #fbbf24; }

/* The sentence beside a picker: why the list is short, why it may be incomplete, what still works.
   Wraps, unlike everything else on that toolbar row, because it is prose and not a label. */
.ts-ref-note[b-lid18lwz91] {
    font-size: 0.72rem;
    line-height: 1.45;
    color: #8fa8be;
    max-width: 34ch;
    white-space: normal;
}

.ts-ref-note--warn[b-lid18lwz91] { color: #fbbf24; }

/* ── What I closed this week ─────────────────────────────────────────────── */

.ts-recall[b-lid18lwz91] { margin-top: 18px; border-top: 1px solid rgba(127, 127, 127, 0.25); padding-top: 14px; }

.ts-recall__head[b-lid18lwz91] { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }

.ts-recall__body[b-lid18lwz91] { margin-top: 14px; }

/* What the last commit did, in the words of the thing that did it. Deliberately not styled as an
   error or as a success tick: it is a statement about what was written, and the useful half of it
   is the sentence saying a second press changes nothing. */
.ts-recall__said[b-lid18lwz91] {
    padding: 10px 14px;
    margin-bottom: 12px;
    border: 1px solid rgba(56, 189, 248, 0.3);
    border-radius: 8px;
    background: rgba(56, 189, 248, 0.08);
    color: #7dd3fc;
    font-size: 0.83rem;
    line-height: 1.5;
}

/* The closed period, above the allocation rather than after it. Same shape as the grid's own lock
   banner, because it is the same fact and a reader should not have to work out that it is. */
.ts-recall__lock[b-lid18lwz91] {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 12px 16px;
    margin-bottom: 14px;
    border: 1px solid rgba(148, 163, 184, 0.35);
    border-radius: 8px;
    background: rgba(148, 163, 184, 0.1);
    font-size: 0.85rem;
    line-height: 1.5;
}

/* The rule that produced the list, and what the list leaves out. This is prose that has to be READ
   rather than skimmed past, which is the whole argument for giving it a panel of its own instead of
   a tooltip: an empty list under a hidden caveat reads as an empty week. */
.ts-recall__rule[b-lid18lwz91] {
    padding: 12px 16px;
    margin-bottom: 14px;
    border: 1px solid rgba(127, 127, 127, 0.25);
    border-radius: 8px;
    background: rgba(127, 127, 127, 0.06);
    font-size: 0.8rem;
    line-height: 1.55;
    color: #b6c7d6;
}

.ts-recall__rule p[b-lid18lwz91] { margin: 0 0 8px; }
.ts-recall__rule p:last-child[b-lid18lwz91] { margin-bottom: 0; }
.ts-recall__rule strong[b-lid18lwz91] { color: #e2e8f0; }

.ts-recall__rule-meta[b-lid18lwz91] { color: #8fa8be; font-size: 0.75rem; }

/* Why this row is in your list at all — owner, or creator of something nobody owns. Small, because
   it answers a question most people only ask once. */
.ts-recall__because[b-lid18lwz91] { font-size: 0.7rem; color: #8fa8be; margin-left: 6px; }

/* ── Light theme ─────────────────────────────────────────────────────────── */

html[data-theme="light"] .ts-cell[b-lid18lwz91] { border-color: #d1dce8; }
html[data-theme="light"] .ts-cell:focus[b-lid18lwz91] { border-color: #0284c7; box-shadow: 0 0 0 2px rgba(2, 132, 199, 0.16); }
html[data-theme="light"] .ts-bin[b-lid18lwz91] { color: #94a3b8; }
html[data-theme="light"] .ts-bin:hover:not([disabled])[b-lid18lwz91] { color: #dc2626; border-color: rgba(220, 38, 38, 0.35); }
html[data-theme="light"] .ts-bin:focus-visible[b-lid18lwz91] { color: #dc2626; border-color: #dc2626; }
html[data-theme="light"] .ts-actions__note[b-lid18lwz91] { color: #94a3b8; }
html[data-theme="light"] tr.ts-confirm > td[b-lid18lwz91] { background: #fef2f2; border-bottom-color: #fecaca; }
html[data-theme="light"] .ts-confirm__ask[b-lid18lwz91] { color: #1a2535; }
html[data-theme="light"] .ts-confirm__note[b-lid18lwz91] { color: #64748b; }
html[data-theme="light"] .ts-ref[b-lid18lwz91] { color: #0369a1; }
html[data-theme="light"] .ts-ref--warn[b-lid18lwz91] { color: #b45309; }
html[data-theme="light"] .ts-ref-note[b-lid18lwz91] { color: #64748b; }
html[data-theme="light"] .ts-ref-note--warn[b-lid18lwz91] { color: #b45309; }
html[data-theme="light"] .ts-recall[b-lid18lwz91] { border-top-color: #d1dce8; }
html[data-theme="light"] .ts-recall__said[b-lid18lwz91] { border-color: rgba(2, 132, 199, 0.3); background: #eff6ff; color: #0369a1; }
html[data-theme="light"] .ts-recall__lock[b-lid18lwz91] { border-color: #d1dce8; background: #f1f5f9; }
html[data-theme="light"] .ts-recall__rule[b-lid18lwz91] { border-color: #d1dce8; background: #f8fafc; color: #334155; }
html[data-theme="light"] .ts-recall__rule strong[b-lid18lwz91] { color: #1a2535; }
html[data-theme="light"] .ts-recall__rule-meta[b-lid18lwz91] { color: #64748b; }
html[data-theme="light"] .ts-recall__because[b-lid18lwz91] { color: #64748b; }
/* /Components/Trace/TraceHome.razor.rz.scp.css */
.trace-home-board[b-oin4mgieyh] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr));
    gap: 1.25rem;
    margin-top: 0.5rem;
}

.trace-home-panel[b-oin4mgieyh] {
    background: rgba(255,255,255,0.03);
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 10px;
    padding: 1.1rem 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.trace-home-panel__title[b-oin4mgieyh] {
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: #8fa8be;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #2c3e50;
}

.trace-home-panel__body[b-oin4mgieyh] {
    flex: 1;
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    align-content: flex-start;
}

.trace-home-panel__link[b-oin4mgieyh] {
    font-size: 0.75rem;
    color: #38bdf8;
    text-decoration: none;
    align-self: flex-start;
}

.trace-home-panel__link:hover[b-oin4mgieyh] { text-decoration: underline; }

/* ── MCP connection card ──────────────────────────────────────────────── */
.trace-mcp-card[b-oin4mgieyh] {
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 10px;
    padding: 1.25rem 1.5rem;
    margin-top: 1.5rem;
}

.trace-mcp-header[b-oin4mgieyh] {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    margin-bottom: 0.75rem;
}

.trace-mcp-icon[b-oin4mgieyh] {
    font-size: 2rem;
    line-height: 1;
    flex-shrink: 0;
}

.trace-mcp-header strong[b-oin4mgieyh] {
    font-size: 0.95rem;
    color: #e2e8f0;
}

.trace-mcp-desc[b-oin4mgieyh] {
    margin: 0.2rem 0 0 0;
    font-size: 0.88rem;
    color: #8fa8be;
}

@media (max-width: 768px) {
    .trace-mcp-card[b-oin4mgieyh] {
        padding: 1rem;
    }
}

@media (max-width: 480px) {
    .trace-home-board[b-oin4mgieyh] {
        gap: 0.75rem;
    }

    .trace-home-panel[b-oin4mgieyh] {
        padding: 0.85rem 1rem;
    }

    .trace-mcp-header[b-oin4mgieyh] {
        flex-direction: column;
        gap: 0.5rem;
    }
}

/* ── Light theme ─────────────────────────────────────────────────────── */

html[data-theme="light"] .trace-home-panel[b-oin4mgieyh] { background: #ffffff; border-color: #d1dce8; }
html[data-theme="light"] .trace-home-panel__title[b-oin4mgieyh] { color: #4a6278; border-bottom-color: #d1dce8; }
html[data-theme="light"] .trace-home-panel__link[b-oin4mgieyh] { color: #0284c7; }

html[data-theme="light"] .trace-mcp-card[b-oin4mgieyh] { background: #ffffff; border: 1px solid #d1dce8; }
html[data-theme="light"] .trace-mcp-header strong[b-oin4mgieyh] { color: #1a2535; }
html[data-theme="light"] .trace-mcp-desc[b-oin4mgieyh] { color: #4a6278; }