@import '_content/Microsoft.FluentUI.AspNetCore.Components/Microsoft.FluentUI.AspNetCore.Components.b6pgxrrsua.bundle.scp.css';

/* _content/SuperStatus.Web/Components/Admin/AlertLogPanel.razor.rz.scp.css */
/* Alert delivery-log audit panel (issue #241/#253, mirrors WebhookLogPanel). */

[b-6pgou2r85w] .al-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: var(--s-3, 12px);
}
[b-6pgou2r85w] .al-toggle {
    font-family: var(--font-mono, monospace);
    font-size: 10.5px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--text-3, #6f747d);
    background: transparent;
    border: 1px solid var(--line, rgba(255,255,255,0.08));
    padding: 5px 10px;
    cursor: pointer;
    white-space: nowrap;
}
[b-6pgou2r85w] .al-toggle.on {
    color: var(--status-down, #c02020);
    border-color: var(--status-down, #c02020);
}
[b-6pgou2r85w] .al-note {
    color: var(--text-3, #6f747d);
    font-size: 12px;
    margin: var(--s-2, 8px) 0 0;
}
[b-6pgou2r85w] .al-table {
    font-family: var(--font-mono, monospace);
    font-size: 12px;
}
[b-6pgou2r85w] .al-row {
    display: grid;
    grid-template-columns: 110px 1fr 110px 78px 80px 2fr;
    align-items: center;
    gap: 10px;
    padding: 7px 0;
    border-bottom: 1px solid var(--line, rgba(255,255,255,0.06));
}
[b-6pgou2r85w] .al-row.al-h {
    color: var(--text-3, #6f747d);
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.12em;
}
[b-6pgou2r85w] .al-check { color: var(--text-1, #e8e9ec); }
[b-6pgou2r85w] .al-time { color: var(--text-3, #6f747d); }
[b-6pgou2r85w] .al-chan, [b-6pgou2r85w] .al-trig { color: var(--text-2, #a7abb3); }
[b-6pgou2r85w] .al-detail {
    color: var(--text-2, #a7abb3);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
[b-6pgou2r85w] .al-err {
    color: var(--status-down, #c02020);
    font-size: 11px;
    padding: 2px 0 6px;
    opacity: 0.85;
    word-break: break-word;
}
/* Mobile: collapse the dense grid to Outcome / Check / Channel. */
@media (max-width: 720px) {
    [b-6pgou2r85w] .al-row { grid-template-columns: 90px 1fr 78px; }
    [b-6pgou2r85w] .al-row > .al-time, [b-6pgou2r85w] .al-row > .al-trig, [b-6pgou2r85w] .al-row > .al-detail { display: none; }
    [b-6pgou2r85w] .al-row.al-h > span:nth-child(3),
    [b-6pgou2r85w] .al-row.al-h > span:nth-child(5),
    [b-6pgou2r85w] .al-row.al-h > span:nth-child(6) { display: none; }
}
/* _content/SuperStatus.Web/Components/Admin/SetupWizard.razor.rz.scp.css */
/* Issue #181 Phase 3: first-run setup wizard (inline on /admin). */

.setup-wizard[b-bjtqhth1xt] {
    max-width: 720px;
    margin: var(--s-6, 32px) auto;
}

[b-bjtqhth1xt] .setup-frame { margin-top: var(--s-3, 12px); }

.setup-intro[b-bjtqhth1xt] {
    color: var(--text-2, #a7abb3);
    font-size: 14px;
    line-height: 1.6;
    margin: 6px 0 0;
}

.setup-grid[b-bjtqhth1xt] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px 24px;
    margin-top: 8px;
}

.setup-field[b-bjtqhth1xt] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-width: 0;
}

.setup-label[b-bjtqhth1xt] {
    font-family: "JetBrains Mono", ui-monospace, monospace;
    font-size: 11px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--text-2, #a7abb3);
}

.setup-input[b-bjtqhth1xt] {
    background: var(--glass, rgba(255, 255, 255, 0.03));
    border: 1px solid var(--line, rgba(255, 255, 255, 0.12));
    border-radius: 2px;
    color: var(--text-1, #e8eaed);
    font-family: "JetBrains Mono", ui-monospace, monospace;
    font-size: 13px;
    padding: 9px 10px;
    width: 100%;
    box-sizing: border-box;
}

.setup-input:focus[b-bjtqhth1xt] {
    outline: none;
    border-color: var(--accent);
    box-shadow: 0 0 0 1px var(--accent-soft);
}

.setup-accent[b-bjtqhth1xt] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.setup-swatch[b-bjtqhth1xt] {
    width: 44px;
    height: 36px;
    padding: 0;
    border: 1px solid var(--line, rgba(255, 255, 255, 0.12));
    border-radius: 2px;
    background: transparent;
    cursor: pointer;
}

.setup-hex[b-bjtqhth1xt] { width: 110px; flex: 0 0 auto; text-transform: lowercase; }

.setup-hint[b-bjtqhth1xt] {
    display: block;
    margin-top: 12px;
    font-size: 11px;
    color: var(--text-3, #6b7079);
    line-height: 1.4;
}

.setup-actions[b-bjtqhth1xt] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 22px;
}

.setup-actions-spacer[b-bjtqhth1xt] { flex: 1 1 auto; }

@media (max-width: 640px) {
    .setup-grid[b-bjtqhth1xt] { grid-template-columns: minmax(0, 1fr); }
}
/* _content/SuperStatus.Web/Components/Admin/StatusCheckAdminList.razor.rz.scp.css */
/* StatusCheckAdminList — operator management table (#159 Phase 2). */

.op-head[b-gxrlapf3qh] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--s-4, 16px);
    flex-wrap: wrap;
    margin-bottom: var(--s-3, 12px);
}

.op-note[b-gxrlapf3qh] {
    color: var(--text-3);
    font-size: 12px;
    margin: var(--s-3, 12px) 0 0;
}

.op-list[b-gxrlapf3qh] {
    display: flex;
    flex-direction: column;
    gap: var(--s-3, 12px);
}

/* LED | name/url | interval | state | actions */
.op-row[b-gxrlapf3qh] {
    display: grid;
    grid-template-columns: 24px minmax(0, 1.6fr) 90px minmax(0, 1fr) auto;
    gap: var(--s-4, 16px);
    align-items: center;
    padding: var(--s-3, 12px) var(--s-4, 16px);
    background: var(--bg-1);
    border: 1px solid var(--line);
    border-left-width: 2px;
    border-left-color: var(--text-3);
}
.op-row.up[b-gxrlapf3qh] { border-left-color: var(--status-up); }
.op-row.degraded[b-gxrlapf3qh] { border-left-color: var(--status-degraded); }
.op-row.down[b-gxrlapf3qh] { border-left-color: var(--status-down); }
.op-row.paused[b-gxrlapf3qh] { opacity: 0.7; }

.op-row .led[b-gxrlapf3qh] { width: 10px; height: 10px; border-radius: 50%; background: var(--text-3); }
.op-row.up .led[b-gxrlapf3qh] { background: var(--status-up); box-shadow: 0 0 8px var(--status-up); }
.op-row.degraded .led[b-gxrlapf3qh] { background: var(--status-degraded); box-shadow: 0 0 8px var(--status-degraded); }
.op-row.down .led[b-gxrlapf3qh] { background: var(--status-down); box-shadow: 0 0 10px var(--status-down); }

.op-row .title[b-gxrlapf3qh] { display: flex; flex-direction: column; min-width: 0; }
.op-row .title .name[b-gxrlapf3qh] { color: var(--text-1); font-size: 14px; font-weight: 500; text-decoration: none; }
.op-row .title .name:hover[b-gxrlapf3qh] { color: var(--accent); }
.op-row .title .url[b-gxrlapf3qh] { color: var(--text-3); font-size: 11px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.op-row .stat[b-gxrlapf3qh] { font-size: 11px; color: var(--text-3); text-transform: uppercase; letter-spacing: 0.12em; }
.op-row .stat .v[b-gxrlapf3qh] { display: block; color: var(--text-1); font-size: 13px; text-transform: none; letter-spacing: 0; margin-top: 2px; }

.op-actions[b-gxrlapf3qh] { display: inline-flex; gap: var(--s-2, 8px); }
.op-actions .btn[b-gxrlapf3qh] { padding: 6px 10px; font-size: 10px; }
.op-actions .btn:focus-visible[b-gxrlapf3qh] { outline: 1.5px solid var(--accent); outline-offset: 2px; }
/* destructive action (#164) */
.op-actions .btn.danger[b-gxrlapf3qh] { border-color: var(--status-down); color: var(--status-down); }
.op-actions .btn.danger:hover[b-gxrlapf3qh] { background: var(--status-down); color: var(--bg-0); }

/* mobile: stack actions under the row */
@media (max-width: 600px) {
    .op-row[b-gxrlapf3qh] { grid-template-columns: 24px minmax(0, 1fr); row-gap: var(--s-2, 8px); }
    .op-row .stat[b-gxrlapf3qh] { display: none; }
    .op-actions[b-gxrlapf3qh] { grid-column: 1 / -1; }
}
/* _content/SuperStatus.Web/Components/Admin/UpdatesPanel.razor.rz.scp.css */
/* Issue #249 (epic #248): Updates panel. Calm admin styling — no motion;
   semantic status colours from the HUD theme tokens. */

.up-tag[b-g35m5d80ez] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    border: 1px solid var(--line-strong, rgba(255, 255, 255, 0.22));
    padding: 3px 9px;
    margin-top: 4px;
    font-family: var(--font-mono, ui-monospace, monospace);
    font-size: 10px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--text-2, #a7abb3);
}
.up-tag .up-dot[b-g35m5d80ez] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--status-unknown, #6f747d);
}
.up-tag.up[b-g35m5d80ez] { border-color: var(--accent, #3fbf6f); color: var(--accent, #3fbf6f); }
.up-tag.up .up-dot[b-g35m5d80ez] { background: var(--status-up, #3fbf6f); }
.up-tag.avail[b-g35m5d80ez] { border-color: var(--status-degraded, #f59e0b); color: var(--status-degraded, #f59e0b); }
.up-tag.avail .up-dot[b-g35m5d80ez] { background: var(--status-degraded, #f59e0b); }
.up-tag.fail[b-g35m5d80ez] { border-color: var(--status-down, #c02020); color: #e07a7a; }
.up-tag.fail .up-dot[b-g35m5d80ez] { background: var(--status-down, #c02020); }

.up-kv[b-g35m5d80ez] {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 6px 18px;
    margin: 14px 0;
    font-size: 13px;
}
.up-kv .k[b-g35m5d80ez] {
    color: var(--text-3, #6f747d);
    font-size: 11px;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}
.up-kv .v[b-g35m5d80ez] { color: var(--text-1, #e8e9ec); }
.up-kv .v.accent[b-g35m5d80ez] { color: var(--accent, #3fbf6f); }
.up-kv .v.warn[b-g35m5d80ez] { color: var(--status-degraded, #f59e0b); }
.up-kv .v .muted[b-g35m5d80ez], .up-kv .v.muted[b-g35m5d80ez] { color: var(--text-3, #6f747d); }
.up-kv a[b-g35m5d80ez] { color: var(--accent, #3fbf6f); text-decoration: none; }
.up-kv a:hover[b-g35m5d80ez] { text-decoration: underline; text-underline-offset: 3px; }

.up-err[b-g35m5d80ez] { color: #e07a7a; font-size: 11px; margin: 6px 0 0; }

.up-cmd[b-g35m5d80ez] {
    display: flex;
    align-items: center;
    gap: 10px;
    background: var(--bg-0, #0d0e10);
    border: 1px solid var(--line, rgba(255, 255, 255, 0.12));
    padding: 10px 12px;
    margin: 12px 0 6px;
    overflow-x: auto;
    font-family: var(--font-mono, ui-monospace, monospace);
}
.up-cmd .p[b-g35m5d80ez] { color: var(--accent, #3fbf6f); user-select: none; flex: 0 0 auto; }
.up-cmd code[b-g35m5d80ez] { white-space: nowrap; color: var(--text-1, #e8e9ec); }
.up-cmd .up-copy[b-g35m5d80ez] {
    margin-left: auto;
    flex: 0 0 auto;
    border: 1px solid var(--line-strong, rgba(255, 255, 255, 0.22));
    color: var(--text-2, #a7abb3);
    background: transparent;
    padding: 3px 9px;
    font-size: 10px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    cursor: pointer;
}
.up-cmd .up-copy:hover[b-g35m5d80ez] { border-color: var(--accent, #3fbf6f); color: var(--accent, #3fbf6f); }

.up-row[b-g35m5d80ez] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 14px;
    flex-wrap: wrap;
}
.up-auto[b-g35m5d80ez] {
    margin-left: auto;
    font-size: 11px;
    color: var(--text-3, #6f747d);
    letter-spacing: 0.04em;
    text-transform: uppercase;
}
.up-auto b[b-g35m5d80ez] { color: var(--accent, #3fbf6f); }
.up-auto.off b[b-g35m5d80ez] { color: var(--text-2, #a7abb3); }
/* _content/SuperStatus.Web/Components/Admin/WebhookLogPanel.razor.rz.scp.css */
/* Webhook execution-log audit panel (issue #107 Phase 2). */

[b-7ren4j4oo9] .wl-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: var(--s-3, 12px);
}
[b-7ren4j4oo9] .wl-toggle {
    font-family: var(--font-mono, monospace);
    font-size: 10.5px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--text-3, #6f747d);
    background: transparent;
    border: 1px solid var(--line, rgba(255,255,255,0.08));
    padding: 5px 10px;
    cursor: pointer;
    white-space: nowrap;
}
[b-7ren4j4oo9] .wl-toggle.on {
    color: var(--status-down, #c02020);
    border-color: var(--status-down, #c02020);
}
[b-7ren4j4oo9] .wl-note {
    color: var(--text-3, #6f747d);
    font-size: 12px;
    margin: var(--s-2, 8px) 0 0;
}
[b-7ren4j4oo9] .wl-table {
    font-family: var(--font-mono, monospace);
    font-size: 12px;
}
[b-7ren4j4oo9] .wl-row {
    display: grid;
    grid-template-columns: 110px 1fr 110px 48px 56px 2fr;
    align-items: center;
    gap: 10px;
    padding: 7px 0;
    border-bottom: 1px solid var(--line, rgba(255,255,255,0.06));
}
[b-7ren4j4oo9] .wl-row.wl-h {
    color: var(--text-3, #6f747d);
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.12em;
}
[b-7ren4j4oo9] .wl-check { color: var(--text-1, #e8e9ec); }
[b-7ren4j4oo9] .wl-time { color: var(--text-3, #6f747d); }
[b-7ren4j4oo9] .wl-num { font-variant-numeric: tabular-nums; color: var(--text-2, #a7abb3); }
[b-7ren4j4oo9] .wl-url {
    color: var(--text-2, #a7abb3);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
[b-7ren4j4oo9] .wl-err {
    color: var(--status-down, #c02020);
    font-size: 11px;
    padding: 2px 0 6px;
    opacity: 0.85;
    word-break: break-word;
}
/* Mobile: collapse the dense grid to a stacked-ish layout. */
@media (max-width: 720px) {
    [b-7ren4j4oo9] .wl-row { grid-template-columns: 90px 1fr 70px; }
    [b-7ren4j4oo9] .wl-row > .wl-num, [b-7ren4j4oo9] .wl-row > .wl-url { display: none; }
    [b-7ren4j4oo9] .wl-row.wl-h > span:nth-child(4),
    [b-7ren4j4oo9] .wl-row.wl-h > span:nth-child(5),
    [b-7ren4j4oo9] .wl-row.wl-h > span:nth-child(6) { display: none; }
}
/* _content/SuperStatus.Web/Components/Hud/Ambience/HudMissionTimer.razor.rz.scp.css */
/* HudMissionTimer — issue #109 Phase 2. */

.hud-mission-timer[b-ydis38h9jy] {
    display: inline-flex;
    align-items: baseline;
    gap: var(--s-2, 8px);
    font-family: var(--font-mono);
    font-size: 11px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--text-2);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}
.hud-mission-timer .prefix[b-ydis38h9jy] {
    color: var(--accent);
    font-weight: 600;
}
.hud-mission-timer .value[b-ydis38h9jy] {
    color: var(--text-1);
    font-weight: 500;
}
.hud-mission-timer .suffix[b-ydis38h9jy] {
    color: var(--text-3);
}

@media (max-width: 720px) {
    /* On narrow screens the suffix is the first to drop so the timer
       value itself is preserved. */
    .hud-mission-timer .suffix[b-ydis38h9jy] { display: none; }
}
/* _content/SuperStatus.Web/Components/IncidentOverview/IncidentList.razor.rz.scp.css */
/* IncidentList — tactical incident log (issue #95 Phase 3b). */

.incident-log[b-u02kfcrz93] {
    max-width: var(--content-max);
    margin: 0 auto;
}
/* #238: in the operator console (.admin-console flex column) the auto margins
   make this flex item shrink-to-content + center, misaligning it with the
   full-width sibling panels. In Manage mode stretch to the full column width. */
.incident-log.is-manage[b-u02kfcrz93] {
    max-width: none;
    margin: 0;
}
[b-u02kfcrz93] .incident-frame {
    /* stack the day groups inside one framed panel */
}
[b-u02kfcrz93] .incident + .incident-day {
    margin-top: var(--s-4, 16px);
}
[b-u02kfcrz93] .incident-empty {
    color: var(--text-3);
    font-size: 12px;
    margin: var(--s-3, 12px) 0 0;
}

/* #159 Phase 2: operator manage header + per-incident edit action. */
[b-u02kfcrz93] .inc-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--s-4, 16px);
    flex-wrap: wrap;
    margin-bottom: var(--s-4, 16px);
}
[b-u02kfcrz93] .inc-actions {
    display: inline-flex;
    gap: var(--s-2, 8px);
}
[b-u02kfcrz93] .inc-actions .btn { padding: 6px 10px; font-size: 10px; }
[b-u02kfcrz93] .inc-actions .btn:focus-visible { outline: 1.5px solid var(--accent); outline-offset: 2px; }
/* _content/SuperStatus.Web/Components/Layout/FooterBar.razor.rz.scp.css */
/* FooterBar — tactical classification strip (issue #95 Phase 2). */

.hud-footer[b-73wfm62y1j] {
    grid-area: footer; /* the .app shell's bottom row (hud-theme.css) — sticks to the viewport bottom */
    /* The admin nav rail is a sticky 100vh-56px column, so its bottom edge would
       otherwise overrun this footer row. Lift the footer above it so the bottom
       bar always sits on top of the sidebar at the overlap. */
    position: relative;
    z-index: 11;
    display: flex;
    align-items: center;
    gap: var(--s-5, 24px);
    padding: var(--s-3, 12px) var(--s-5, 24px);
    background: var(--bg-1);
    border-top: 1px solid var(--line);
    font-family: var(--font-mono);
    font-size: 11px;
    letter-spacing: 0.14em;
    color: var(--text-3);
    text-transform: uppercase;
}
.classification[b-73wfm62y1j] {
    color: var(--text-2);
    font-weight: 600;
}
.classification .sep[b-73wfm62y1j] {
    color: var(--text-3);
    margin: 0 4px;
}
.footer-links[b-73wfm62y1j] {
    display: inline-flex;
    gap: var(--s-4, 16px);
}
.footer-links a[b-73wfm62y1j] {
    color: var(--text-2);
    text-decoration: none;
}
.footer-links a:hover[b-73wfm62y1j] {
    color: var(--accent);
}
.footer-links a:focus-visible[b-73wfm62y1j] {
    outline: 1.5px solid var(--accent);
    outline-offset: 2px;
}
.footer-spacer[b-73wfm62y1j] {
    flex: 1 1 auto;
}
.powered[b-73wfm62y1j] {
    color: var(--text-3);
    text-decoration: none;
}
.powered:hover[b-73wfm62y1j] { color: var(--text-1); }
.powered:focus-visible[b-73wfm62y1j] {
    outline: 1.5px solid var(--accent);
    outline-offset: 2px;
}

@media (max-width: 720px) {
    .classification[b-73wfm62y1j] { font-size: 10px; }
    .powered[b-73wfm62y1j] { display: none; }
}

/* #152 Phase 2: at narrow widths the single flex row overran the viewport.
   Let it wrap and pack left (the spacer that right-aligns links is dropped). */
@media (max-width: 600px) {
    .hud-footer[b-73wfm62y1j] {
        flex-wrap: wrap;
        gap: var(--s-2, 8px) var(--s-4, 16px);
        padding: var(--s-3, 12px) var(--s-4, 16px);
    }
    .footer-spacer[b-73wfm62y1j] { display: none; }
}
/* _content/SuperStatus.Web/Components/Layout/HeaderBar.razor.rz.scp.css */
/* HeaderBar — tactical-HUD top bar (issue #95 Phase 2). */

.hud-topbar[b-7uj2pzh7p0] {
    grid-area: topbar;
    display: flex;
    align-items: center;
    gap: var(--s-4, 16px);
    padding: 0 var(--s-5, 24px);
    height: 56px;
    background: var(--bg-1);
    border-bottom: 1px solid var(--line);
    position: sticky;
    top: 0;
    z-index: 20;
    /* #152 Phase 2: don't let the bar's flex content set a min-content floor
       wider than the (single-column) grid track on narrow screens. */
    min-width: 0;
}

/* Brand badge — logo glyph + wordmark. */
.brand[b-7uj2pzh7p0] {
    display: inline-flex;
    align-items: center;
    gap: var(--s-3, 12px);
    text-decoration: none;
    font-family: var(--font-mono);
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: var(--text-1);
    /* tighter outline so keyboard focus reads as a HUD reticle, not the
       browser default rounded ring. */
    outline-offset: 4px;
}

.brand-logo[b-7uj2pzh7p0] {
    max-height: 22px;
    object-fit: contain;
}

.brand .name[b-7uj2pzh7p0] {
    font-weight: 600;
    font-size: 13px;
}
.brand .name em[b-7uj2pzh7p0] {
    font-style: normal;
    color: var(--accent);
}
.brand-desc[b-7uj2pzh7p0] {
    color: var(--text-3);
    font-size: 11px;
    letter-spacing: 0.14em;
    border-left: 1px solid var(--line);
    padding-left: var(--s-3, 12px);
    margin-left: var(--s-2, 8px);
}

/* Tag in topbar has slightly tighter vertical alignment. */
.hud-topbar > .tag[b-7uj2pzh7p0] {
    flex-shrink: 0;
}
.hud-topbar .sep[b-7uj2pzh7p0] {
    color: var(--text-3);
}

.topbar-spacer[b-7uj2pzh7p0] {
    flex: 1 1 auto;
}

/* Clock. */
.clock[b-7uj2pzh7p0] {
    display: inline-flex;
    align-items: center;
    gap: var(--s-3, 12px);
    font-size: 11px;
    color: var(--text-2);
    text-transform: uppercase;
    letter-spacing: 0.14em;
    font-variant-numeric: tabular-nums;
}
.clock .led[b-7uj2pzh7p0] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--status-up);
    box-shadow: 0 0 6px var(--status-up);
    animation: hud-pulse-b-7uj2pzh7p0 2.5s ease-in-out infinite;
}

@keyframes hud-pulse-b-7uj2pzh7p0 {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.55; }
}

@media (prefers-reduced-motion: reduce) {
    .clock .led[b-7uj2pzh7p0] { animation: none; }
}

/* Right-side icon buttons. */
.topbar-actions[b-7uj2pzh7p0] {
    display: inline-flex;
    align-items: center;
    gap: var(--s-2, 8px);
}
.hud-icon-btn[b-7uj2pzh7p0] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    color: var(--text-2);
    background: transparent;
    border: 1px solid transparent;
    transition: color 100ms ease, border-color 100ms ease, background 100ms ease;
}
.hud-icon-btn:hover[b-7uj2pzh7p0] {
    color: var(--text-1);
    border-color: var(--line-strong);
    background: var(--glass-strong);
}
.hud-icon-btn:focus-visible[b-7uj2pzh7p0] {
    /* Tactical reticle focus ring — not the default rounded UA outline. */
    outline: 1.5px solid var(--accent);
    outline-offset: 2px;
    color: var(--accent);
}

/* Hamburger toggle (#152 Phase 1). Hidden on desktop; shown ≤900px where the
   sidebar collapses to a drawer. 44px = comfortable touch target. */
.hud-menu-btn[b-7uj2pzh7p0] {
    display: none;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    margin-left: -8px; /* optical: pull the glyph toward the grid edge */
    padding: 0;
    background: transparent;
    border: 1px solid transparent;
    color: var(--text-1);
    cursor: pointer;
}
.hud-menu-btn:hover[b-7uj2pzh7p0] {
    color: var(--text-1);
    border-color: var(--line-strong);
    background: var(--glass-strong);
}
.hud-menu-btn:focus-visible[b-7uj2pzh7p0] {
    outline: 1.5px solid var(--accent);
    outline-offset: 2px;
    color: var(--accent);
}

/* Wrapper so the responsive bar can drop items by priority without ::deep. */
.topbar-mission[b-7uj2pzh7p0] {
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
}

/* Topbar priority collapse (#152). At ≤900 the hamburger appears and the
   lowest-priority chrome (description, mission timer) drops; at ≤600 the clock
   drops too, leaving brand + menu + actions uncramped. */
@media (max-width: 900px) {
    .hud-menu-btn[b-7uj2pzh7p0] { display: inline-flex; }
    .brand-desc[b-7uj2pzh7p0] { display: none; }
    .topbar-mission[b-7uj2pzh7p0] { display: none; }
}
@media (max-width: 600px) {
    .clock[b-7uj2pzh7p0] { display: none; }
    /* Tighten the bar so hamburger + brand + actions fit down to 320px. */
    .hud-topbar[b-7uj2pzh7p0] { padding: 0 var(--s-3, 12px); gap: var(--s-3, 12px); }
}
/* _content/SuperStatus.Web/Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-fz564hyswr] {
    position: relative;
    display: flex;
    flex-direction: column;
}

main[b-fz564hyswr] {
    flex: 1;
}

.sidebar[b-fz564hyswr] {
    background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);
}

.top-row[b-fz564hyswr] {
    background-color: #f7f7f7;
    border-bottom: 1px solid #d6d5d5;
    justify-content: flex-end;
    height: 3.5rem;
    display: flex;
    align-items: center;
}

    .top-row[b-fz564hyswr]  a, .top-row[b-fz564hyswr]  .btn-link {
        white-space: nowrap;
        margin-left: 1.5rem;
        text-decoration: none;
    }

    .top-row[b-fz564hyswr]  a:hover, .top-row[b-fz564hyswr]  .btn-link:hover {
        text-decoration: underline;
    }

    .top-row[b-fz564hyswr]  a:first-child {
        overflow: hidden;
        text-overflow: ellipsis;
    }

@media (max-width: 640.98px) {
    .top-row[b-fz564hyswr] {
        justify-content: space-between;
    }

    .top-row[b-fz564hyswr]  a, .top-row[b-fz564hyswr]  .btn-link {
        margin-left: 0;
    }
}

@media (min-width: 641px) {
    .page[b-fz564hyswr] {
        flex-direction: row;
    }

    .sidebar[b-fz564hyswr] {
        width: 250px;
        height: 100vh;
        position: sticky;
        top: 0;
    }

    .top-row[b-fz564hyswr] {
        position: sticky;
        top: 0;
        z-index: 1;
    }

    .top-row.auth[b-fz564hyswr]  a:first-child {
        flex: 1;
        text-align: right;
        width: 0;
    }

    .top-row[b-fz564hyswr], article[b-fz564hyswr] {
        padding-left: 2rem !important;
        padding-right: 1.5rem !important;
    }
}

#blazor-error-ui[b-fz564hyswr] {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss[b-fz564hyswr] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* _content/SuperStatus.Web/Components/Layout/NavMenu.razor.rz.scp.css */
.navbar-toggler[b-wxgi1v9xvt] {
    appearance: none;
    cursor: pointer;
    width: 3.5rem;
    height: 2.5rem;
    color: white;
    position: absolute;
    top: 0.5rem;
    right: 1rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") no-repeat center/1.75rem rgba(255, 255, 255, 0.1);
}

.navbar-toggler:checked[b-wxgi1v9xvt] {
    background-color: rgba(255, 255, 255, 0.5);
}

.top-row[b-wxgi1v9xvt] {
    height: 3.5rem;
    background-color: rgba(0,0,0,0.4);
}

.navbar-brand[b-wxgi1v9xvt] {
    font-size: 1.1rem;
}

.bi[b-wxgi1v9xvt] {
    display: inline-block;
    position: relative;
    width: 1.25rem;
    height: 1.25rem;
    margin-right: 0.75rem;
    top: -1px;
    background-size: cover;
}

.bi-house-door-fill[b-wxgi1v9xvt] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-house-door-fill' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5Z'/%3E%3C/svg%3E");
}

.bi-plus-square-fill[b-wxgi1v9xvt] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-plus-square-fill' viewBox='0 0 16 16'%3E%3Cpath d='M2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2zm6.5 4.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3a.5.5 0 0 1 1 0z'/%3E%3C/svg%3E");
}

.bi-list-nested[b-wxgi1v9xvt] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-list-nested' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M4.5 11.5A.5.5 0 0 1 5 11h10a.5.5 0 0 1 0 1H5a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 3 7h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 1 3h10a.5.5 0 0 1 0 1H1a.5.5 0 0 1-.5-.5z'/%3E%3C/svg%3E");
}

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

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

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

    .nav-item[b-wxgi1v9xvt]  a {
        color: #d7d7d7;
        border-radius: 4px;
        height: 3rem;
        display: flex;
        align-items: center;
        line-height: 3rem;
    }

.nav-item[b-wxgi1v9xvt]  a.active {
    background-color: rgba(255,255,255,0.37);
    color: white;
}

.nav-item[b-wxgi1v9xvt]  a:hover {
    background-color: rgba(255,255,255,0.1);
    color: white;
}

.nav-scrollable[b-wxgi1v9xvt] {
    display: none;
}

.navbar-toggler:checked ~ .nav-scrollable[b-wxgi1v9xvt] {
    display: block;
}

@media (min-width: 641px) {
    .navbar-toggler[b-wxgi1v9xvt] {
        display: none;
    }

    .nav-scrollable[b-wxgi1v9xvt] {
        /* Never collapse the sidebar for wide screens */
        display: block;

        /* Allow sidebar to scroll for tall menus */
        height: calc(100vh - 3.5rem);
        overflow-y: auto;
    }
}
/* _content/SuperStatus.Web/Components/Pages/Admin.razor.rz.scp.css */
/* Admin — tactical operator console (issue #95 Phase 4). */
/* The console's section rhythm (.admin-console flex/gap, .admin-section,
   per-panel margin resets) lives in hud-theme.css so /admin and the
   /ui-gallery operator preview share one cadence. */

[b-0fsecdahio] .admin-note {
    color: var(--text-3);
    font-size: 12px;
    line-height: 1.6;
    margin: var(--s-3, 12px) 0 0;
}

/* #266: in-page tab bar + panes for the console sections. The nav and panes are
   rendered by Admin.razor itself, so these are scoped (no ::deep needed). */
.console-tabs[b-0fsecdahio] {
    display: flex;
    flex-wrap: wrap;
    gap: 2px;
    margin-top: var(--s-3, 12px);
    border-bottom: 1px solid var(--line);
}

.console-tab[b-0fsecdahio] {
    appearance: none;
    background: transparent;
    border: 0;
    border-bottom: 2px solid transparent;
    margin-bottom: -1px;
    padding: 8px 16px;
    font: inherit;
    font-size: 13px;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--text-3);
    cursor: pointer;
    transition: color 0.12s ease, border-color 0.12s ease;
}

.console-tab:hover[b-0fsecdahio] {
    color: var(--text-1, #e8eef2);
}

.console-tab.active[b-0fsecdahio] {
    color: var(--accent);
    border-bottom-color: var(--accent);
}

.console-tab:focus-visible[b-0fsecdahio] {
    outline: 2px solid var(--accent);
    outline-offset: 2px;
}

/* Panes follow the console's 32px vertical rhythm; [hidden] must beat the flex. */
.tab-pane[b-0fsecdahio] {
    display: flex;
    flex-direction: column;
    gap: 32px;
}

.tab-pane[hidden][b-0fsecdahio] {
    display: none;
}
/* _content/SuperStatus.Web/Components/Pages/Error.razor.rz.scp.css */
/* Error page — tactical-HUD layout (issue #95 Phase 2). */

[b-cyfbb4yoru] .error-frame {
    max-width: 720px;
    margin: var(--s-7, 48px) auto;
}
[b-cyfbb4yoru] .error-prose {
    color: var(--text-2);
    font-size: 13px;
    line-height: 1.6;
    margin: var(--s-4, 16px) 0 0;
}
[b-cyfbb4yoru] .error-prose.subtle {
    color: var(--text-3);
    font-size: 12px;
    border-left: 1px solid var(--line);
    padding-left: var(--s-3, 12px);
}
[b-cyfbb4yoru] .error-actions {
    display: flex;
    gap: var(--s-3, 12px);
    margin-top: var(--s-5, 24px);
}
/* _content/SuperStatus.Web/Components/Pages/Home.razor.rz.scp.css */
/* Home — tactical dashboard layout (issue #95 Phase 3a). */

/* One uniform vertical rhythm between the hero and the stacked sections — the
   flex gap owns ALL inter-section spacing so the public cadence matches the
   operator console (Admin.razor.css). */
.home[b-v5gn1gcr1y] {
    max-width: var(--content-max);
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: var(--s-6, 32px);
}

.home-section[b-v5gn1gcr1y] {
    /* spacing is owned by the .home gap above; the section only groups its
       head + body together. */
    margin: 0;
}

.section-head[b-v5gn1gcr1y] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--s-4, 16px);
    margin-bottom: var(--s-3, 12px);
}

/* The .btn primitive is defined in hud-theme.css; ensure focus-visible
   reticle on these section actions even inside the MudBlazor context. */
.section-head .btn:focus-visible[b-v5gn1gcr1y] {
    outline: 1.5px solid var(--accent);
    outline-offset: 2px;
}
/* _content/SuperStatus.Web/Components/Pages/StatusCheckDetail.razor.rz.scp.css */
/* StatusCheckDetail — issue #103. */

[b-kgrpylqdmd] .detail-frame {
    max-width: var(--content-max);
    margin: 0 auto var(--s-4, 16px);
}

[b-kgrpylqdmd] .detail-frame.hero { margin-top: var(--s-3, 12px); }
[b-kgrpylqdmd] .uptime-card { padding-top: var(--s-5, 24px); }

[b-kgrpylqdmd] .error-prose {
    color: var(--text-2);
    font-size: 13px;
    line-height: 1.6;
    margin: var(--s-4, 16px) 0 0;
}
[b-kgrpylqdmd] .error-prose.subtle {
    color: var(--text-3);
    font-size: 12px;
    border-left: 1px solid var(--line);
    padding-left: var(--s-3, 12px);
}
[b-kgrpylqdmd] .error-actions {
    display: flex;
    gap: var(--s-3, 12px);
    margin-top: var(--s-5, 24px);
}
/* _content/SuperStatus.Web/Components/StatusCheckOverview/HudDashboardHero.razor.rz.scp.css */
/* HudDashboardHero — issue #95 Phase 3a. */

[b-yrwy7245s4] .hero-frame {
    max-width: var(--content-max);
    margin: 0 auto var(--s-5, 24px);
}
[b-yrwy7245s4] .hero-note {
    color: var(--text-3);
    font-size: 12px;
    margin: var(--s-3, 12px) 0 0;
}
/* _content/SuperStatus.Web/Components/StatusCheckOverview/StatusCheckHistoricalGraph.razor.rz.scp.css */
/* Equal-width chips using CSS Grid (simplest) */
.historical-graph[b-tn44z8u6p5] {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: 1fr;
    gap: 4px;
}

/* Make the tooltip container stretch to its grid cell */
.historical-graph-item[b-tn44z8u6p5] {
    width: 100%;
}

/* Ensure the chip fills the cell */
.historical-graph-chip[b-tn44z8u6p5] {
    width: 100%;
    justify-content: center; /* centers the label horizontally */
    padding-left: 0;
    padding-right: 0;
}

/* Optional: reduce internal chip height if you want a bar look */
.historical-graph-chip .mud-chip-label[b-tn44z8u6p5] {
    width: 100%;
    text-align: center;
}
/* _content/SuperStatus.Web/Components/StatusCheckOverview/StatusCheckOverviewCard.razor.rz.scp.css */
/* Issue #103 — title anchor on the overview card. */
[b-y0wdbx0dtd] .check-card-title {
    color: var(--text-1);
    text-decoration: none;
}
[b-y0wdbx0dtd] .check-card-title:hover {
    color: var(--accent);
}
[b-y0wdbx0dtd] .check-card-title:focus-visible {
    outline: 1.5px solid var(--accent);
    outline-offset: 2px;
}

/* Issue #95 Phase 3c — HudPanel frame around the service card. The inner
   MudCard is neutralised so the HUD frame (frosted bg + corner brackets)
   is the only surface. */
[b-y0wdbx0dtd] .service-card-frame {
    margin-bottom: var(--s-3, 12px);
}
[b-y0wdbx0dtd] .service-card-inner.mud-card {
    background: transparent;
    box-shadow: none;
    border: none;
}
[b-y0wdbx0dtd] .service-card-frame .last-checked {
    color: var(--text-3);
    margin-left: var(--s-3, 12px);
    font-family: var(--font-mono);
    letter-spacing: 0.04em;
}