/* /Components/Layout/MainLayout.razor.rz.scp.css */
/* #blazor-error-ui is styled globally in wwwroot/app.css — one banner, one rule. */
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-mi05jf7a8q],
.components-reconnect-repeated-attempt-visible[b-mi05jf7a8q],
.components-reconnect-failed-visible[b-mi05jf7a8q],
.components-pause-visible[b-mi05jf7a8q],
.components-resume-failed-visible[b-mi05jf7a8q],
.components-rejoining-animation[b-mi05jf7a8q] {
    display: none;
}

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


/* Calm Instrument final cleanup: the framework's template colours (a white card, blue buttons, a blue ring) replaced by
   the tokens, so a dropped connection looks like the rest of Vitals: a raised dark card, light text, one lime action. */
#components-reconnect-modal[b-mi05jf7a8q] {
    background-color: var(--raised);
    color: var(--text);
    font: var(--fw-body) var(--fs-body)/var(--lh-body) var(--font);
    width: 20rem;
    margin: 20vh auto;
    padding: var(--s7);
    border: 1px solid var(--line-strong);
    border-radius: var(--r-lg);
    box-shadow: var(--shadow-overlay);
    opacity: 0;
    transition: display 0.5s allow-discrete, overlay 0.5s allow-discrete;
    animation: components-reconnect-modal-fadeOutOpacity-b-mi05jf7a8q 0.5s both;
    &[open]

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

}

#components-reconnect-modal[b-mi05jf7a8q]::backdrop {
    background-color: var(--scrim);
    animation: components-reconnect-modal-fadeInOpacity-b-mi05jf7a8q 0.5s ease-in-out;
    opacity: 1;
}

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

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

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

    100% {
        opacity: 1;
    }
}

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

    100% {
        opacity: 0;
    }
}

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

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

#components-reconnect-modal button[b-mi05jf7a8q] {
    min-height: var(--h-control);
    border: 0;
    background-color: var(--lime);
    color: var(--on-lime);
    font: var(--fw-strong) var(--fs-control)/var(--lh-control) var(--font);
    padding: 8px 16px;
    border-radius: var(--r-md);
    cursor: pointer;
}

    #components-reconnect-modal button:hover[b-mi05jf7a8q] {
        background-color: var(--lime-hover);
    }

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

    .components-rejoining-animation div[b-mi05jf7a8q] {
        position: absolute;
        border: 3px solid var(--text-2);   /* "reconnecting" is a state: never lime */
        opacity: 1;
        border-radius: 50%;
        animation: components-rejoining-animation-b-mi05jf7a8q 1.5s cubic-bezier(0, 0.2, 0.8, 1) infinite;
    }

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

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

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

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

    100% {
        top: 0px;
        left: 0px;
        width: 80px;
        height: 80px;
        opacity: 0;
    }
}
/* /Components/Pages/DomainCheck.razor.rz.scp.css */
/* The public domain checker.

   Written for the dark public canvas (#0d1017) that VitalsLayout sets. The first version was
   styled for a light page, which put mid-grey body text and near-black table headings onto
   near-black: legible on the machine it was written on, close to invisible in production.
   Panels now tint the ground rather than replacing it with white, so nothing depends on
   inheriting the right thing.

   Every colour here is stated against a known ground, with a 4.5:1 floor for body text. The
   report's greens and reds are deliberately NOT reused - they are chosen for white paper and
   several of them fail badly on near-black.

   Calm Instrument final cleanup: every size is a type token, the buttons are the ci-btn family, focus is the shared
   ring, and lime is no longer a state or a text colour (a good verdict reads in --progress with its glyph). */

.dc[b-h4ifrjwtat] {
    max-width: 640px;
    color: var(--text-2);
}

.dc h1[b-h4ifrjwtat] {
    font-size: var(--fs-hero);
    font-weight: 800;
    line-height: var(--lh-hero);
    letter-spacing: -0.02em;
    margin: 0 0 0.6em;
    color: var(--text);
    text-wrap: balance;
}

.lede[b-h4ifrjwtat] {
    max-width: 62ch;
    font-size: var(--fs-heading);
    line-height: 1.6;
    color: var(--text-2);
    margin: 0 0 1.6em;
}

/* ---- The input ---- */
.dc-form[b-h4ifrjwtat] {
    display: flex;
    gap: 0.6rem;
    flex-wrap: wrap;
}

.dc-form input[b-h4ifrjwtat] {
    flex: 1 1 260px;
    min-width: 0;
    font: inherit;
    font-size: var(--fs-heading);
    padding: 0.85rem 1rem;
    border: 1px solid var(--control);
    border-radius: var(--r-md);
    background: var(--fill-2);
    color: var(--text);
}

.dc-form .ci-btn[b-h4ifrjwtat] { min-height: var(--h-touch); padding: 10px 20px; font-size: var(--fs-body); }

.dc-err[b-h4ifrjwtat] {
    margin: 0.9em 0 0;
    font-size: var(--fs-body);
    font-weight: 600;
    color: var(--error);
}

/* ---- Verdict ---- */
.dc-verdict[b-h4ifrjwtat] {
    margin: 1.8em 0 0;
    padding: 1.1rem 1.3rem;
    border-radius: var(--r-md);
    border-left: 4px solid;
}

.dc-verdict.bad[b-h4ifrjwtat] {
    background: var(--tint-error);
    border-left-color: var(--error);
}

.dc-verdict.ok[b-h4ifrjwtat] {
    background: var(--tint-brand);
    border-left-color: var(--progress);
}

.dc-dom[b-h4ifrjwtat] {
    margin: 0 0 0.35em;
    font-size: var(--fs-label);
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--muted);
}

.dc-head[b-h4ifrjwtat] {
    margin: 0 0 0.45em;
    font-size: var(--fs-title);
    font-weight: 800;
    line-height: 1.25;
    letter-spacing: -0.01em;
    text-wrap: balance;
}

.dc-verdict.bad .dc-head[b-h4ifrjwtat] { color: var(--error); }
.dc-verdict.ok .dc-head[b-h4ifrjwtat] { color: var(--progress); }

.dc-sub[b-h4ifrjwtat] {
    margin: 0;
    font-size: var(--fs-body);
    line-height: 1.55;
    color: var(--text-2);
}

/* ---- The three records ---- */
.dc-tbl[b-h4ifrjwtat] {
    width: 100%;
    border-collapse: collapse;
    margin: 1.4em 0 0;
}

.dc-tbl td[b-h4ifrjwtat],
.dc-tbl th[b-h4ifrjwtat] {
    padding: 0.75rem 0.6rem 0.75rem 0;
    border-bottom: 1px solid var(--line-strong);
    vertical-align: top;
    text-align: left;
    font-size: var(--fs-body);
    line-height: 1.5;
    color: var(--text-2);
}

.dc-tbl tr:last-child td[b-h4ifrjwtat],
.dc-tbl tr:last-child th[b-h4ifrjwtat] {
    border-bottom: none;
}

.dc-tbl th[b-h4ifrjwtat] {
    width: 4.5rem;
    font-weight: 800;
    color: var(--text);
    white-space: nowrap;
}

.dc-mk[b-h4ifrjwtat] {
    width: 1.9rem;
    padding-right: 0.5rem !important;
}

.mk[b-h4ifrjwtat] {
    font-size: var(--fs-heading);
    line-height: 1;
}

/* Three states, not two. A record that exists but enforces nothing is the most common
   result and the most misleading, so it must never be drawn as a tick. */
.mk.yes[b-h4ifrjwtat] { color: var(--progress); font-weight: 800; }
.mk.part[b-h4ifrjwtat] { color: var(--caution); }
.mk.no[b-h4ifrjwtat] { color: var(--error); font-weight: 800; }
.mk.unk[b-h4ifrjwtat] { color: var(--muted); font-weight: 800; }

.dc-tbl code[b-h4ifrjwtat] {
    font-size: var(--fs-meta);
    padding: 0.1em 0.35em;
    border-radius: var(--r-sm);
    background: var(--fill-3);
    color: var(--text);
}

/* ---- The ask ---- */
.dc-next[b-h4ifrjwtat] {
    margin: 2.2em 0 0;
    padding: 1.4rem 1.5rem;
    border: 1px solid var(--line-strong);
    border-radius: var(--r-md);
}

.dc-next h2[b-h4ifrjwtat] {
    margin: 0 0 0.5em;
    font-size: var(--fs-title);
    letter-spacing: -0.01em;
}

.dc-next .ci-btn[b-h4ifrjwtat] {
    margin: 0 0 1em;
}

.dc-next p[b-h4ifrjwtat] {
    margin: 0 0 1.1em;
    font-size: var(--fs-body);
    line-height: 1.6;
    color: var(--text-2);
}

.dc-fine[b-h4ifrjwtat] {
    font-size: var(--fs-sm);
    line-height: 1.5;
    color: var(--muted);
    margin: 0.9em 0 0;
}

.dc-priv[b-h4ifrjwtat] {
    margin-top: 2.4em;
    padding-top: 1.1em;
    border-top: 1px solid var(--line-strong);
}

@media (max-width: 560px) {
    .dc h1[b-h4ifrjwtat] { font-size: var(--fs-display); line-height: var(--lh-display); }
}

@media (max-width: 520px) {
    .dc-form .ci-btn[b-h4ifrjwtat] { flex: 1 1 100%; }
    .dc-tbl th[b-h4ifrjwtat] { width: auto; }
}

/* ---- How to fix it ----
   Given away in full and on purpose. Email is the only one of the twenty-two checks somebody
   can act on from outside their own tenant, so it is the only one worth handing over free —
   and doing it properly is what makes the other twenty-one worth asking about. */

.dc-fix[b-h4ifrjwtat] {
    margin: 2.2em 0 0;
    padding: 1.5rem 1.6rem;
    border-radius: var(--r-md);
    background: var(--tint-brand);
    border: 1px solid var(--line-brand);
}

.dc-fix h2[b-h4ifrjwtat] {
    margin: 0 0 0.45em;
    font-size: var(--fs-title);
    letter-spacing: -0.01em;
    color: var(--text);
}

.dc-fix-lede[b-h4ifrjwtat] {
    margin: 0 0 1.3em;
    font-size: var(--fs-body);
    line-height: 1.6;
    color: var(--text-2);
}

.dc-steps[b-h4ifrjwtat] {
    margin: 0;
    padding: 0;
    list-style: none;
    counter-reset: fx;
    display: flex;
    flex-direction: column;
    gap: 1.4rem;
}

.dc-steps > li[b-h4ifrjwtat] {
    counter-increment: fx;
    position: relative;
    padding-left: 2.2rem;
}

.dc-steps > li[b-h4ifrjwtat]::before {
    content: counter(fx);
    position: absolute;
    left: 0;
    top: 0;
    width: 1.6rem;
    height: 1.6rem;
    border-radius: var(--r-md);
    background: var(--lime);
    color: var(--on-lime);
    font-size: var(--fs-meta);
    font-weight: 800;
    display: flex;
    align-items: center;
    justify-content: center;
}

.dc-st[b-h4ifrjwtat] {
    margin: 0 0 0.3em;
    font-size: var(--fs-heading);
    font-weight: 800;
    line-height: 1.3;
    color: var(--text);
}

.dc-sw[b-h4ifrjwtat] {
    margin: 0 0 0.7em;
    font-size: var(--fs-body);
    line-height: 1.55;
    color: var(--text-2);
}

/* The record itself. Monospace, selectable, and laid out as a DNS form so it maps onto
   whatever screen they are about to type it into. */
.dc-rec[b-h4ifrjwtat] {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 0.4rem 0.9rem;
    align-items: baseline;
    padding: 0.85rem 1rem;
    background: var(--bg);
    border: 1px solid var(--line-strong);
    border-radius: var(--r-md);
}

.dc-rl[b-h4ifrjwtat] {
    font-size: var(--fs-label);
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--muted);
}

.dc-rec code[b-h4ifrjwtat],
.dc-rec span:not(.dc-rl)[b-h4ifrjwtat] {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: var(--fs-sm);
    line-height: 1.5;
    color: var(--text);
    word-break: break-word;
    user-select: all;
}

.dc-where[b-h4ifrjwtat] {
    margin: 0;
    font-size: var(--fs-control);
    line-height: 1.5;
    color: var(--text-2);
}

/* Cautions are not decoration. Every one of these marks a way to break live mail. */
.dc-caution[b-h4ifrjwtat] {
    margin: 0.7em 0 0;
    padding-left: 0.85rem;
    border-left: 3px solid var(--caution);
    font-size: var(--fs-sm);
    line-height: 1.5;
    color: var(--caution);
}

.dc-share[b-h4ifrjwtat] {
    margin: 1.6em 0 0;
    padding: 0.9rem 1.1rem;
    border: 1px dashed var(--control);
    border-radius: var(--r-md);
    font-size: var(--fs-control);
    line-height: 1.6;
    color: var(--text-2);
}

.dc-share strong[b-h4ifrjwtat] { color: var(--text); }

.dc-share code[b-h4ifrjwtat] {
    display: block;
    margin-top: 0.35em;
    font-size: var(--fs-sm);
    word-break: break-all;
    user-select: all;
    color: var(--text);
}

/* ---- Watch this domain ----
   Placed after the fix, not before it. Asking for an address before giving the answer would
   make this a lead-capture form; asking after we have told them everything, including how to
   fix it themselves, is an offer rather than a toll. */

.dc-watch[b-h4ifrjwtat] {
    margin: 1.8em 0 0;
    padding: 1.4rem 1.5rem;
    border: 1px solid var(--line-strong);
    border-radius: var(--r-md);
    background: var(--fill-1);
}

.dc-watch h2[b-h4ifrjwtat] {
    margin: 0 0 0.4em;
    font-size: var(--fs-title);
    letter-spacing: -0.01em;
}

.dc-watch p[b-h4ifrjwtat] {
    margin: 0 0 1rem;
    font-size: var(--fs-body);
    line-height: 1.6;
    color: var(--text-2);
}

.dc-wform[b-h4ifrjwtat] {
    display: flex;
    gap: 0.6rem;
    flex-wrap: wrap;
}

/* Focus is the shared ring (tokens.css :focus-visible), as on every other form. */
.dc-wform input[b-h4ifrjwtat] {
    flex: 1 1 240px;
    min-width: 0;
    font: inherit;
    font-size: var(--fs-body);
    padding: 0.7rem 0.9rem;
    border: 1px solid var(--control);
    border-radius: var(--r-md);
    background: var(--fill-2);
    color: var(--text);
}

.dc-wok[b-h4ifrjwtat] {
    margin: 0 !important;
    font-size: var(--fs-body);
    color: var(--progress);
}

.dc-wok strong[b-h4ifrjwtat] { color: var(--text); }

.dc-watch .dc-fine[b-h4ifrjwtat] {
    margin-top: 0.9em;
}

@media (max-width: 520px) {
    .dc-wform .ci-btn[b-h4ifrjwtat] { flex: 1 1 100%; }
}

/* Quieter than real input, but still readable - a placeholder nobody can read is a form with
   no label. */
.dc-form input[b-h4ifrjwtat]::placeholder,
.dc-wform input[b-h4ifrjwtat]::placeholder { color: var(--muted); }

.dc h2[b-h4ifrjwtat] { color: var(--text); }
/* /Components/Pages/Error.razor.rz.scp.css */
/* The error page (MainLayout: no chrome of its own). Tokens only. */
.ep[b-ip8ycfne9b], .ep *[b-ip8ycfne9b], .ep *[b-ip8ycfne9b]::before, .ep *[b-ip8ycfne9b]::after { box-sizing: border-box; }   /* MainLayout sets none */
.ep[b-ip8ycfne9b] { max-width: 640px; margin: 0 auto; padding: var(--s10) var(--s6) var(--s9); color: var(--text-2);
    font: var(--fw-body) var(--fs-body)/var(--lh-body) var(--font); }
.ep h1[b-ip8ycfne9b] { margin: 0 0 var(--s3); font-size: var(--fs-display); line-height: var(--lh-display); font-weight: 800; letter-spacing: -.02em; color: var(--text); text-wrap: balance; }
.ep p[b-ip8ycfne9b] { margin: 0 0 var(--s3); max-width: 62ch; }
.ep .ep-lede[b-ip8ycfne9b] { font-size: var(--fs-heading); line-height: 1.6; margin-bottom: var(--s6); }
.ep-actions[b-ip8ycfne9b] { display: flex; flex-wrap: wrap; gap: var(--s3); margin: 0 0 var(--s7); }
.ep-actions .ci-btn[b-ip8ycfne9b] { min-height: var(--h-touch); }
.ep .ep-ref[b-ip8ycfne9b] { font-size: var(--fs-meta); color: var(--muted); margin-top: var(--s5); }
.ep code[b-ip8ycfne9b] { font-family: var(--mono); font-size: var(--fs-meta); color: var(--text-2); background: var(--inset); border: 1px solid var(--line);
    border-radius: var(--r-sm); padding: 1px 6px; overflow-wrap: anywhere; }
@media (max-width: 560px) { .ep[b-ip8ycfne9b] { padding: var(--s8) var(--s4) var(--s8); } .ep-actions .ci-btn[b-ip8ycfne9b] { width: 100%; } }
/* /Components/Pages/NotFound.razor.rz.scp.css */
/* The framework's not-found page (MainLayout: no chrome). It had no text colour, so it read black on the dark ground. */
.nf[b-px687bvpec] { max-width: 720px; margin: 0 auto; padding: var(--s10) var(--s6); color: var(--text-2); font: var(--fw-body) var(--fs-body)/var(--lh-body) var(--font); }
.nf h1[b-px687bvpec] { margin: 0 0 var(--s2); font-size: var(--fs-title); line-height: var(--lh-title); font-weight: var(--fw-strong); color: var(--text); text-wrap: balance; }
.nf p[b-px687bvpec] { margin: 0; }
/* /Components/Shared/ListMore.razor.rz.scp.css */
.listmore[b-wez8ntft2s] { display: flex; align-items: center; justify-content: space-between; gap: 12px 20px; flex-wrap: wrap; margin: 14px 0 4px; }
.lm-count[b-wez8ntft2s] { margin: 0; font-size: var(--fs-sm); color: var(--text-2); }
.lm-acts[b-wez8ntft2s] { display: flex; gap: 10px; flex-wrap: wrap; }
/* The buttons are the ci-btn family (tokens.css); .lm-btn stays as the hook the browser harnesses use, and for the phone layout. */
@media (max-width: 620px) { .lm-acts[b-wez8ntft2s], .lm-btn[b-wez8ntft2s] { width: 100%; } .lm-btn[b-wez8ntft2s] { justify-content: center; } }