/* /Components/Account/Pages/Login.razor.rz.scp.css */
/* Reassurance sits directly under the form, before the recovery links: read as a property
   of signing in rather than as one more link in the list. Tinted rather than bordered so it
   reassures without demanding attention like an alert would. */
.login__assurance[b-fdvpfedij0] {
    display: flex;
    align-items: flex-start;
    gap: var(--space-2);
    margin-bottom: var(--space-5);
    padding: var(--space-3) var(--space-4);
    text-align: left;
    font-size: var(--text-sm);
    line-height: 1.5;
    color: var(--color-text-muted);
    background-color: var(--color-surface-sunken);
    border-radius: var(--radius-md);
}

.login__assurance-icon[b-fdvpfedij0] {
    display: inline-flex;
    flex: 0 0 auto;
    margin-top: 0.125rem;
    color: var(--color-primary);
}

/* Recovery links share one line and one treatment; wrap rather than overflow on a phone. */
.login__links[b-fdvpfedij0] {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: baseline;
    gap: var(--space-1) var(--space-3);
}

.login__sep[b-fdvpfedij0] { color: var(--color-border-strong); }

.login__divider[b-fdvpfedij0] {
    padding-top: var(--space-3);
    border-top: 1px solid var(--color-border);
}
/* /Components/Account/Shared/ManageNavMenu.razor.rz.scp.css */
/* Settings sub-navigation. A light rail on the page surface — deliberately not the dark
   treatment used by the main sidebar, so it reads as within-page navigation rather than a
   second app-level menu. */

.settings-nav[b-3yeagbc6x6] {
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
    padding: var(--space-3);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-xs);
}

/* Rows are <NavLink>, which renders its own <a> under NavLink's CSS scope — so this file's
   [b-…] attribute never reaches it and un-prefixed rules match nothing. ::deep resolves
   against .settings-nav, which does carry the attribute. Same defect as NavMenu's .nav-item. */
.settings-nav[b-3yeagbc6x6]  .settings-nav__item {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    padding: var(--space-3);
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    font-weight: 550;
    color: var(--color-text-muted);
    text-decoration: none;
    transition: background var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out);
}

.settings-nav[b-3yeagbc6x6]  .settings-nav__item:hover {
    background: var(--color-hover);
    color: var(--color-text);
}

.settings-nav[b-3yeagbc6x6]  .settings-nav__item:focus-visible {
    outline: 2px solid var(--color-focus);
    outline-offset: -2px;
}

/* NavLink stamps .active on the current route. The left bar carries the state in addition
   to colour, so it is not conveyed by colour alone. */
.settings-nav[b-3yeagbc6x6]  .settings-nav__item.active {
    background: var(--color-primary-soft);
    color: var(--color-primary);
    font-weight: 600;
    box-shadow: inset 3px 0 0 var(--color-primary);
}

.settings-nav__icon[b-3yeagbc6x6] {
    display: grid;
    place-items: center;
    width: 1.25rem;
    flex: none;
    font-size: 1.15rem;   /* sizes the 1em SVG icon */
    line-height: 1;
}

@media (prefers-reduced-motion: reduce) {
    .settings-nav[b-3yeagbc6x6]  .settings-nav__item { transition: none; }
}
/* /Components/Fica/DocumentPreview.razor.rz.scp.css */
/* Reusable in-browser preview: a toolbar over a neutral preview stage. */

.dp[b-sc9ugsh2la] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    overflow: hidden;
    background: var(--color-surface);
    box-shadow: var(--shadow-sm);
}

.dp__toolbar[b-sc9ugsh2la] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-3);
    background: var(--color-surface);
    border-bottom: 1px solid var(--color-border);
}

.dp__group[b-sc9ugsh2la] {
    display: flex;
    align-items: center;
    gap: var(--space-1);
    padding: 2px;
    background: var(--color-surface-sunken);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
}

.dp__spacer[b-sc9ugsh2la] { flex: 1 1 auto; }

.dp__tool[b-sc9ugsh2la] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    padding: 0;
    font-size: 1.05rem;
    color: var(--color-text-muted);
    background: transparent;
    border: 0;
    border-radius: var(--radius-sm);
    cursor: pointer;
    transition: background-color .12s ease, color .12s ease;
}

.dp__tool:hover:not(:disabled)[b-sc9ugsh2la] { background: var(--color-surface); color: var(--color-text); }
.dp__tool:focus-visible[b-sc9ugsh2la] { outline: 2px solid var(--color-focus); outline-offset: 1px; }
.dp__tool:disabled[b-sc9ugsh2la] { opacity: .4; cursor: not-allowed; }

.dp__zoom[b-sc9ugsh2la] {
    min-width: 3rem;
    padding-inline: var(--space-2);
    font-size: var(--text-sm);
    font-variant-numeric: tabular-nums;
    text-align: center;
    color: var(--color-text-muted);
}

.dp__stage[b-sc9ugsh2la] {
    position: relative;
    display: grid;
    place-items: center;
    height: clamp(24rem, 64vh, 52rem);
    overflow: auto;
    background: var(--color-surface-sunken);
}

.dp__stage:focus-visible[b-sc9ugsh2la] { outline: 2px solid var(--color-focus); outline-offset: -2px; }
.dp__stage--image[b-sc9ugsh2la] { background: #1f2430; }

.dp__img[b-sc9ugsh2la] {
    display: block;
    margin: auto;
    transform-origin: center center;
    box-shadow: 0 2px 12px rgba(0, 0, 0, .35);
    background: #fff;
}

.dp__frame[b-sc9ugsh2la] {
    width: 100%;
    height: 100%;
    border: 0;
    background: #fff;
}

.dp__placeholder[b-sc9ugsh2la] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-3);
    padding: var(--space-6);
    max-width: 24rem;
    text-align: center;
    color: var(--color-text-muted);
}

.dp__placeholder p[b-sc9ugsh2la] { margin: 0; }
.dp__placeholder-icon[b-sc9ugsh2la] { font-size: 1.75rem; color: var(--color-text-subtle); }

.dp__spinner[b-sc9ugsh2la] {
    width: 1.75rem;
    height: 1.75rem;
    border: 2px solid var(--color-border-strong);
    border-top-color: var(--color-primary);
    border-radius: 50%;
    animation: dp-spin-b-sc9ugsh2la .7s linear infinite;
}

@keyframes dp-spin-b-sc9ugsh2la { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .dp__spinner[b-sc9ugsh2la] { animation-duration: 2s; } }
/* /Components/Fica/DocumentStatusExplainer.razor.rz.scp.css */
/* One quiet line under a document's state. Reads as supporting detail, not as an alert. */
.docstate[b-dyxu4frnlj] {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: var(--space-2) var(--space-3);
    margin: var(--space-2) 0 0;
    font-size: var(--text-sm);
    line-height: 1.5;
    color: var(--color-text-muted);
}

.docstate__text[b-dyxu4frnlj] { min-width: 0; }

/* The timeframe is metadata, so it is set apart from the sentence rather than reading as part of
   it — small caps, tabular so a list of documents keeps its right edge. */
.docstate__time[b-dyxu4frnlj] {
    flex: 0 0 auto;
    padding: 0.125rem var(--space-2);
    font-size: var(--text-xs);
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--color-text-subtle);
    background-color: var(--color-surface-sunken);
    border-radius: var(--radius-sm);
    font-variant-numeric: tabular-nums;
}
/* /Components/Fica/FileDropInput.razor.rz.scp.css */
.drop[b-kayaxpytjb] {
    position: relative;
    border: 1.5px dashed var(--color-border-strong);
    border-radius: var(--radius-lg);
    background-color: var(--color-surface-sunken);
    transition: border-color var(--dur-fast) var(--ease-out),
                background-color var(--dur-fast) var(--ease-out);
}

.drop:hover[b-kayaxpytjb] {
    border-color: var(--color-primary);
    background-color: var(--color-primary-soft);
}

.drop--filled[b-kayaxpytjb] {
    border-style: solid;
    border-color: var(--color-success);
    background-color: var(--color-success-bg);
}

/* The real input covers the zone so native drag-and-drop works without JS. */
.drop[b-kayaxpytjb]  .drop__input {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
}

/* Keyboard focus lands on the hidden input — surface it on the zone. */
.drop:focus-within[b-kayaxpytjb] {
    border-color: var(--color-primary);
    box-shadow: var(--shadow-focus);
}

.drop__inner[b-kayaxpytjb] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: var(--space-6) var(--space-4);
    pointer-events: none;
}

.drop__icon[b-kayaxpytjb] {
    display: grid;
    place-items: center;
    width: 2.75rem;
    height: 2.75rem;
    margin-bottom: var(--space-3);
    border-radius: var(--radius-full);
    background-color: var(--color-surface);
    border: 1px solid var(--color-border);
    color: var(--color-primary);
    font-size: 1.125rem;
    line-height: 1;
}

.drop--filled .drop__icon[b-kayaxpytjb] { color: var(--color-success); border-color: #bbf7d0; }

.drop__name[b-kayaxpytjb] {
    margin: 0;
    font-size: 0.9375rem;
    font-weight: 550;
    color: var(--color-text);
    overflow-wrap: anywhere;
}

.drop__meta[b-kayaxpytjb] {
    margin: var(--space-1) 0 0;
    font-size: var(--text-sm);
    color: var(--color-text-muted);
}
/* /Components/Fica/VerificationAssistant.razor.rz.scp.css */
/* Review assistant. The one panel a reviewer should be able to decide from, so it is the only thing
   in the rail with any visual weight — everything else on the page recedes beneath it. */

.va[b-9ptjd7jz62] {
    background-color: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-sm);
    overflow: hidden;
}

/* ── Headline ──────────────────────────────────────────────────────────────────
   Tinted by outcome, because this is the one place in the product where a glance
   should answer "do I need to do anything". The words say the same thing, so the
   tint is reinforcement rather than the signal. */

.va__head[b-9ptjd7jz62] {
    display: flex;
    align-items: flex-start;
    gap: var(--space-4);
    padding: var(--space-5);
    border-bottom: 1px solid var(--color-border);
}

.va__head--ok[b-9ptjd7jz62]        { background-color: var(--color-success-bg); }
.va__head--attention[b-9ptjd7jz62] { background-color: var(--color-warning-bg); }
.va__head--alert[b-9ptjd7jz62]     { background-color: var(--color-danger-bg); }

.va__icon[b-9ptjd7jz62] {
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    width: 2.25rem;
    height: 2.25rem;
    border-radius: var(--radius-full);
    background-color: var(--color-surface);
    font-size: 1.125rem;
    line-height: 1;
}

.va__head--ok .va__icon[b-9ptjd7jz62]        { color: var(--color-success); }
.va__head--attention .va__icon[b-9ptjd7jz62] { color: var(--color-warning); }
.va__head--alert .va__icon[b-9ptjd7jz62]     { color: var(--color-danger); }

.va__headline[b-9ptjd7jz62] { min-width: 0; }

.va__title[b-9ptjd7jz62] {
    margin: 0;
    font-size: 1.0625rem;
    font-weight: 650;
    letter-spacing: -0.01em;
    color: var(--color-text);
}

.va__explain[b-9ptjd7jz62] {
    margin: var(--space-1) 0 0;
    font-size: var(--text-sm);
    line-height: 1.5;
    color: var(--color-text-muted);
}

/* ── The job ───────────────────────────────────────────────────────────────────
   Sits directly under the outcome, above the evidence. A reviewer's first question is
   not "what did the engine find" but "what am I being asked to do", and this answers it
   in one chip and one sentence. */

.va__task[b-9ptjd7jz62] {
    display: flex;
    align-items: flex-start;
    gap: var(--space-3);
    padding: var(--space-4) var(--space-5);
    border-bottom: 1px solid var(--color-border);
}

.va__task-text[b-9ptjd7jz62] {
    margin: 0;
    font-size: var(--text-sm);
    line-height: 1.5;
    color: var(--color-text);
}

/* A note no check covers — currently only "this looks like a different document". */
.va__note[b-9ptjd7jz62] {
    display: flex;
    align-items: flex-start;
    gap: var(--space-2);
    margin: 0;
    padding: var(--space-3) var(--space-5);
    border-bottom: 1px solid var(--color-border);
    background-color: var(--color-warning-bg);
    font-size: var(--text-sm);
    line-height: 1.5;
    color: var(--color-text);
}

/* ── Grouped evidence ──────────────────────────────────────────────────────────
   Identity and Address are the reviewer's own categories. The heading carries the
   count so a group can be dismissed without reading its rows. */

.va__group[b-9ptjd7jz62] { border-bottom: 1px solid var(--color-border); }

.va__group-title[b-9ptjd7jz62] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--space-3);
    margin: 0;
    padding: var(--space-3) var(--space-5);
    font-size: var(--text-xs);
    font-weight: 600;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: var(--color-text-subtle);
    background-color: var(--color-surface-sunken);
}

.va__group-count[b-9ptjd7jz62] {
    font-size: var(--text-xs);
    font-weight: 600;
    letter-spacing: 0;
    text-transform: none;
    color: var(--color-warning);
}

.va__group-ok[b-9ptjd7jz62] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: var(--text-xs);
    font-weight: 500;
    letter-spacing: 0;
    text-transform: none;
    color: var(--color-success);
}

/* A group where everything agreed. Collapsed by default so it takes one line instead of
   five — the point of the panel is the exception, and a wall of ticks buries it. */
.va__collapsed > summary[b-9ptjd7jz62] {
    padding: var(--space-3) var(--space-5);
    font-size: var(--text-sm);
    color: var(--color-text-muted);
    cursor: pointer;
}

.va__collapsed > summary:focus-visible[b-9ptjd7jz62] {
    outline: 2px solid var(--color-focus);
    outline-offset: -2px;
}

.va__collapsed > summary:hover[b-9ptjd7jz62] { color: var(--color-text); }

/* ── Values read, with provenance ──────────────────────────────────────────────
   A field, its value, and where it came from. Exact values (barcode, digital text) recede;
   recognised ones carry a left rule so a reviewer can find what needs checking by scanning the
   edge rather than reading every row. */

.va__values-list[b-9ptjd7jz62] {
    list-style: none;
    margin: 0;
    padding: 0;
}

.va__value[b-9ptjd7jz62] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0 var(--space-3);
    padding: var(--space-3) var(--space-5);
    border-bottom: 1px solid var(--color-border);
    /* Left rule by default: a recognised value is the one that wants attention, so the unmarked
       state is the exception rather than the rule. */
    border-left: 3px solid var(--color-warning);
}

.va__value:last-child[b-9ptjd7jz62] { border-bottom: 0; }

/* Exact: no rule, quieter. Nothing to check. */
.va__value--exact[b-9ptjd7jz62] { border-left-color: transparent; }

.va__value-field[b-9ptjd7jz62] {
    font-size: var(--text-xs);
    font-weight: 600;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: var(--color-text-subtle);
}

.va__value-origin[b-9ptjd7jz62] {
    grid-row: 1;
    grid-column: 2;
    font-size: var(--text-xs);
    color: var(--color-text-subtle);
    white-space: nowrap;
}

.va__value--exact .va__value-origin[b-9ptjd7jz62] { color: var(--color-success); }

.va__value-band[b-9ptjd7jz62] { color: var(--color-text-subtle); }

.va__value-text[b-9ptjd7jz62] {
    grid-column: 1 / -1;
    font-size: 0.9375rem;
    font-weight: 550;
    color: var(--color-text);
    overflow-wrap: anywhere;
    font-variant-numeric: tabular-nums;
}

.va__value-fix[b-9ptjd7jz62] {
    grid-column: 1 / -1;
    margin-top: 0.125rem;
    font-size: var(--text-xs);
    font-weight: 600;
    color: var(--color-warning);
}

/* ── Recommendation / certainty ───────────────────────────────────────────────── */

.va__meta[b-9ptjd7jz62] {
    display: grid;
    gap: var(--space-4);
    margin: 0;
    padding: var(--space-4) var(--space-5);
    border-bottom: 1px solid var(--color-border);
}

@media (min-width: 30em) {
    .va__meta[b-9ptjd7jz62] { grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr)); }
}

.va__meta dt[b-9ptjd7jz62] {
    font-size: var(--text-xs);
    font-weight: 600;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: var(--color-text-subtle);
}

.va__meta dd[b-9ptjd7jz62] {
    margin: var(--space-1) 0 0;
    font-size: 0.9375rem;
    font-weight: 600;
    color: var(--color-text);
}

.va__override[b-9ptjd7jz62] {
    display: block;
    margin-top: var(--space-1);
    font-size: var(--text-xs);
    font-weight: 600;
    color: var(--color-warning);
}

/* ── Checks ───────────────────────────────────────────────────────────────────
   A list separated by hairlines, not a stack of cards. The rows that need attention
   carry a left rule so they are findable by scanning the edge rather than reading. */

.va__checks[b-9ptjd7jz62] {
    list-style: none;
    margin: 0;
    padding: 0;
}

.va__check[b-9ptjd7jz62] {
    display: flex;
    align-items: flex-start;
    gap: var(--space-3);
    padding: var(--space-4) var(--space-5);
    border-top: 1px solid var(--color-border);
}

.va__check:first-child[b-9ptjd7jz62] { border-top: 0; }

.va__check--failed[b-9ptjd7jz62]  { box-shadow: inset 3px 0 0 var(--color-danger); }
.va__check--unknown[b-9ptjd7jz62] { box-shadow: inset 3px 0 0 var(--color-warning); }

.va__check-mark[b-9ptjd7jz62] {
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    width: 1.125rem;
    margin-top: 0.125rem;
    font-size: 1rem;
    line-height: 1;
}

.va__check--passed  .va__check-mark[b-9ptjd7jz62] { color: var(--color-success); }
.va__check--failed  .va__check-mark[b-9ptjd7jz62] { color: var(--color-danger); }
.va__check--unknown .va__check-mark[b-9ptjd7jz62] { color: var(--color-warning); }

.va__check-body[b-9ptjd7jz62] { min-width: 0; flex: 1; }

.va__check-label[b-9ptjd7jz62] {
    margin: 0;
    font-size: 0.9375rem;
    font-weight: 600;
    color: var(--color-text);
}

.va__check-message[b-9ptjd7jz62] {
    margin: var(--space-1) 0 0;
    font-size: var(--text-sm);
    line-height: 1.5;
    color: var(--color-text-muted);
}

/* ── Expected vs document ─────────────────────────────────────────────────────
   Two columns in a fixed order, on a recessed surface so the pair reads as one
   comparison rather than as two more facts. Monospaced figures keep digits aligned
   between the rows, which is what lets a mismatched ID number be spotted rather
   than read. */

.va__values[b-9ptjd7jz62] {
    display: grid;
    gap: 1px;
    margin: var(--space-3) 0 0;
    background-color: var(--color-border);
    border-radius: var(--radius-sm);
    overflow: hidden;
}

@media (min-width: 26em) {
    .va__values[b-9ptjd7jz62] { grid-template-columns: 1fr 1fr; }

    /* One value, one column. The grid draws its own divider by letting the container's border colour
       show through a 1px gap, so a second column with nothing in it is not empty space — it renders as
       a grey rectangle beside the populated cell, which reads as a rendering fault rather than as
       "there is no document value". Stage 14.1 made this reachable two ways: a name check that could
       read no surname has only our record, and a sex check that could not be tied to the customer has
       only the document's value. */
    .va__values:has(> div:only-child)[b-9ptjd7jz62] { grid-template-columns: 1fr; }
}

.va__values > div[b-9ptjd7jz62] {
    padding: var(--space-2) var(--space-3);
    background-color: var(--color-surface-sunken);
}

.va__values dt[b-9ptjd7jz62] {
    font-size: var(--text-xs);
    font-weight: 600;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: var(--color-text-subtle);
}

.va__values dd[b-9ptjd7jz62] {
    margin: 0.125rem 0 0;
    font-size: var(--text-sm);
    line-height: 1.45;
    color: var(--color-text);
    overflow-wrap: anywhere;
    font-variant-numeric: tabular-nums;
}

.va__when[b-9ptjd7jz62] {
    margin: 0;
    padding: var(--space-3) var(--space-5);
    border-top: 1px solid var(--color-border);
    font-size: var(--text-xs);
    color: var(--color-text-subtle);
}
/* /Components/Layout/AuthLayout.razor.rz.scp.css */
/* Signed-out canvas: calm gradient, centred column, brand on top. */

.auth[b-bi0u44l8ex] {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    background:
        radial-gradient(60rem 32rem at 85% -10%, rgb(73 136 167 / 7%), transparent 60%),
        radial-gradient(48rem 28rem at -10% 100%, rgb(58 113 137 / 6%), transparent 55%),
        var(--color-bg);
}

.auth__header[b-bi0u44l8ex] {
    display: flex;
    justify-content: center;
    padding: var(--space-6) var(--space-4) var(--space-4);
}

.auth__brand[b-bi0u44l8ex] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-3);
    text-decoration: none;
    border-radius: var(--radius-md);
}

.auth__brand:focus-visible[b-bi0u44l8ex] { outline: 2px solid var(--color-focus); outline-offset: 4px; }

.auth__rule[b-bi0u44l8ex] {
    width: 1px;
    height: 1.625rem;
    background: var(--color-border-strong);
}

.auth__sub[b-bi0u44l8ex] {
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    white-space: nowrap;
    color: var(--color-text-subtle);
}

.auth__main[b-bi0u44l8ex] {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: var(--space-5) var(--space-4) var(--space-7);
    outline: none;
}

.auth__footer[b-bi0u44l8ex] {
    display: flex;
    justify-content: center;
    gap: var(--space-4);
    padding: var(--space-5) var(--space-4);
    font-size: var(--text-sm);
    color: var(--color-text-subtle);
}

.auth__footer a[b-bi0u44l8ex] { color: var(--color-text-muted); }

#blazor-error-ui[b-bi0u44l8ex] {
    color-scheme: light only;
    display: none;
    position: fixed;
    left: 50%;
    bottom: var(--space-5);
    transform: translateX(-50%);
    z-index: 1000;
    width: min(560px, calc(100% - 2rem));
    padding: var(--space-4) var(--space-5);
    background-color: var(--color-surface);
    border: 1px solid #fecaca;
    border-left: 3px solid var(--color-danger);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-lg);
    font-size: var(--text-sm);
    color: var(--color-text);
}

#blazor-error-ui .reload[b-bi0u44l8ex] { margin-left: var(--space-2); font-weight: 600; }

#blazor-error-ui .dismiss[b-bi0u44l8ex] {
    cursor: pointer;
    position: absolute;
    right: var(--space-3);
    top: var(--space-2);
    color: var(--color-text-subtle);
}
/* /Components/Layout/MainLayout.razor.rz.scp.css */
/* App shell — sidebar + topbar + content. Mobile-first: the sidebar is a
   stacked header below 768px and a fixed rail above it. */

.shell[b-y5j9c8cs72] {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    background-color: var(--color-bg);
}

.shell__sidebar[b-y5j9c8cs72] {
    background-color: var(--sidebar-bg);
    color: var(--sidebar-text);
}

.shell__main[b-y5j9c8cs72] {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-width: 0;
}

/* Topbar */
.shell__topbar[b-y5j9c8cs72] {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    height: var(--shell-topbar-h);
    padding: 0 var(--space-4);
    background-color: rgb(255 255 255 / 82%);
    backdrop-filter: saturate(180%) blur(12px);
    border-bottom: 1px solid var(--color-border);
    position: sticky;
    top: 0;
    z-index: 20;
}

.shell__topbar-spacer[b-y5j9c8cs72] { flex: 1; }

.shell__user[b-y5j9c8cs72] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-3);
    min-width: 0;
    font-size: var(--text-sm);
    font-weight: 550;
    color: var(--color-text-muted);
}

.shell__avatar[b-y5j9c8cs72] {
    display: grid;
    place-items: center;
    width: 2rem;
    height: 2rem;
    flex: 0 0 auto;
    border-radius: var(--radius-full);
    background: linear-gradient(145deg, var(--bloom-teal-500), var(--bloom-teal-700));
    color: #fff;
    font-size: var(--text-sm);
    font-weight: 600;
    box-shadow: var(--shadow-xs);
}

.shell__user-name[b-y5j9c8cs72] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 18ch;
}

.shell__topbar-link[b-y5j9c8cs72] {
    font-size: var(--text-sm);
    font-weight: 550;
    color: var(--color-text-muted);
    text-decoration: none;
    padding: var(--space-2);
    border-radius: var(--radius-sm);
}

.shell__topbar-link:hover[b-y5j9c8cs72] { color: var(--color-text); text-decoration: underline; }
.shell__topbar-link:focus-visible[b-y5j9c8cs72] { outline: 2px solid var(--color-focus); outline-offset: 2px; }

/* Content */
.shell__content[b-y5j9c8cs72] {
    flex: 1;
    padding: var(--space-5) var(--space-4) var(--space-7);
    outline: none;
}

.shell__container[b-y5j9c8cs72] {
    width: 100%;
    max-width: var(--content-max);
    margin-inline: auto;
}

/* Footer — the rule spans the full width; its contents align to the content column.
   Brand line and legal/support links share one row that wraps on narrow viewports. */
.shell__footer[b-y5j9c8cs72] {
    padding: var(--space-5) var(--space-4);
    border-top: 1px solid var(--color-border);
    color: var(--color-text-subtle);
    font-size: var(--text-sm);
}

.shell__footer-inner[b-y5j9c8cs72] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3) var(--space-5);
    width: 100%;
    max-width: var(--content-max);
    margin-inline: auto;
}

.shell__footer-links[b-y5j9c8cs72] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-4);
}

.shell__footer-links a[b-y5j9c8cs72] { color: var(--color-text-muted); }

@media (min-width: 768px) {
    .shell[b-y5j9c8cs72] { flex-direction: row; }

    .shell__sidebar[b-y5j9c8cs72] {
        width: var(--shell-sidebar-w);
        flex: 0 0 var(--shell-sidebar-w);
        height: 100vh;
        position: sticky;
        top: 0;
    }

    .shell__topbar[b-y5j9c8cs72] { padding: 0 var(--space-6); }
    .shell__content[b-y5j9c8cs72] { padding: var(--space-6) var(--space-6) var(--space-8); }
    .shell__footer[b-y5j9c8cs72] { padding: var(--space-5) var(--space-6); }
}

/* Unhandled-error banner */
#blazor-error-ui[b-y5j9c8cs72] {
    color-scheme: light only;
    display: none;
    position: fixed;
    left: 50%;
    bottom: var(--space-5);
    transform: translateX(-50%);
    z-index: 1000;
    width: min(560px, calc(100% - 2rem));
    padding: var(--space-4) var(--space-5);
    background-color: var(--color-surface);
    border: 1px solid #fecaca;
    border-left: 3px solid var(--color-danger);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-lg);
    font-size: var(--text-sm);
    color: var(--color-text);
}

#blazor-error-ui .reload[b-y5j9c8cs72] { margin-left: var(--space-2); font-weight: 600; }

#blazor-error-ui .dismiss[b-y5j9c8cs72] {
    cursor: pointer;
    position: absolute;
    right: var(--space-3);
    top: var(--space-2);
    color: var(--color-text-subtle);
}
/* /Components/Layout/NavMenu.razor.rz.scp.css */
/* Sidebar navigation. Collapsible via a CSS-only checkbox below 768px — no JS.
   All colours come from the --sidebar-* tokens, which are contrast-verified
   against --sidebar-bg in app.css. */

.brand[b-op0zu0gw1a] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
    padding: var(--space-4) var(--space-5);
    min-height: var(--shell-topbar-h);
    border-bottom: 1px solid var(--sidebar-divider);
}

/* Stacked: logo above the descriptor, both left-aligned to the rail's optical edge. */
.brand__link[b-op0zu0gw1a] {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-1);
    text-decoration: none;
    color: var(--sidebar-text-active);
    min-width: 0;
    border-radius: var(--radius-md);
}

.brand__link:hover[b-op0zu0gw1a] { color: var(--sidebar-text-active); }
.brand__link:focus-visible[b-op0zu0gw1a] { outline: 2px solid var(--sidebar-text-active); outline-offset: 3px; }

.brand__sub[b-op0zu0gw1a] {
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    white-space: nowrap;
    color: var(--sidebar-label);
}

/* Mobile toggle */
.brand__toggle[b-op0zu0gw1a] {
    display: grid;
    place-items: center;
    width: 2.75rem;
    height: 2.75rem;
    margin: 0;
    border-radius: var(--radius-md);
    cursor: pointer;
    transition: background-color var(--dur-fast) var(--ease-out);
}

.brand__toggle:hover[b-op0zu0gw1a] { background-color: var(--sidebar-hover); }

.brand__bars[b-op0zu0gw1a],
.brand__bars[b-op0zu0gw1a]::before,
.brand__bars[b-op0zu0gw1a]::after {
    display: block;
    width: 18px;
    height: 2px;
    border-radius: 2px;
    background-color: var(--sidebar-text);
    content: "";
    transition: transform var(--dur-base) var(--ease-out);
}

.brand__bars[b-op0zu0gw1a]::before { transform: translateY(-6px); }
.brand__bars[b-op0zu0gw1a]::after { transform: translateY(4px); }

.nav-toggle[b-op0zu0gw1a] {
    position: absolute;
    opacity: 0;
    width: 1px;
    height: 1px;
    pointer-events: none;
}

/* Collapsed by default on mobile; expanded when checked. */
.nav-scrollable[b-op0zu0gw1a] {
    display: none;
    padding: var(--space-4) var(--space-3) var(--space-5);
}

.nav-toggle:checked + .nav-scrollable[b-op0zu0gw1a] { display: block; }

.nav-list[b-op0zu0gw1a] { display: flex; flex-direction: column; }

/* Section heading — decorative grouping, read out via aria-labelledby. */
.nav-label[b-op0zu0gw1a] {
    margin: 0 0 var(--space-2);
    padding: 0 var(--space-3);
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.09em;
    text-transform: uppercase;
    color: var(--sidebar-label);
}

.nav-group[b-op0zu0gw1a] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.nav-group + .nav-label[b-op0zu0gw1a] {
    margin-top: var(--space-5);
    padding-top: var(--space-4);
    border-top: 1px solid var(--sidebar-divider);
}

/* Every rule that targets .nav-item itself goes through ::deep.
   Rows are rendered by <NavLink>, which emits its own <a> — so that anchor belongs to
   NavLink's scope, not this component's, and never receives this file's [b-…] attribute.
   Un-prefixed rules compiled to `.nav-item[b-…]` therefore matched nothing, and the whole
   primary navigation fell back to browser defaults: underlined, display:block, no padding,
   no active pill. (The Sign out <button> is authored here, so it does carry the attribute
   and was the only correctly styled row — which is what gave the bug away.)
   ::deep resolves against .nav-list, which does carry the attribute, so it covers the
   NavLink anchors and the button alike. Descendant rules like `.nav-item .nav-item__icon`
   need no change: Blazor appends the attribute only to the last simple selector, and the
   icon span IS authored here. */
.nav-list[b-op0zu0gw1a]  .nav-item {
    position: relative;
    display: flex;
    align-items: center;
    gap: var(--space-3);
    width: 100%;
    padding: var(--space-3);
    border: 0;
    border-radius: var(--radius-md);
    background: transparent;
    color: var(--sidebar-text);
    font-family: inherit;
    font-size: 0.9375rem;
    font-weight: 500;
    text-align: left;
    text-decoration: none;
    cursor: pointer;
    transition: background-color var(--dur-fast) var(--ease-out),
                color var(--dur-fast) var(--ease-out);
}

.nav-list[b-op0zu0gw1a]  .nav-item:hover {
    background-color: var(--sidebar-hover);
    color: var(--sidebar-text-active);
}

.nav-list[b-op0zu0gw1a]  .nav-item:focus-visible {
    outline: 2px solid var(--sidebar-text-active);
    outline-offset: -2px;
}

/* Active state carries four cues: accent bar, background, weight and icon colour. */
.nav-list[b-op0zu0gw1a]  .nav-item.active {
    background-color: var(--sidebar-active);
    color: var(--sidebar-text-active);
    font-weight: 650;
}

.nav-list[b-op0zu0gw1a]  .nav-item.active::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 3px;
    height: 1.375rem;
    border-radius: 0 2px 2px 0;
    background-color: var(--sidebar-accent);
}

.nav-item.active .nav-item__icon[b-op0zu0gw1a] { color: var(--sidebar-accent); }

.nav-item__icon[b-op0zu0gw1a] {
    display: grid;
    place-items: center;
    width: 1.25rem;
    height: 1.25rem;
    flex: 0 0 auto;
    font-size: 1.25rem;   /* sizes the 1em SVG icon to 20px */
    line-height: 1;
    color: var(--sidebar-label);
    transition: color var(--dur-fast) var(--ease-out);
}

.nav-item:hover .nav-item__icon[b-op0zu0gw1a] { color: var(--sidebar-text-active); }

.nav-list[b-op0zu0gw1a]  .nav-item--button { font-family: inherit; }

@media (min-width: 768px) {
    .brand[b-op0zu0gw1a] { padding: var(--space-5); }
    .brand__toggle[b-op0zu0gw1a] { display: none; }

    /* Always expanded on desktop, and scrolls independently of the page. */
    .nav-scrollable[b-op0zu0gw1a] {
        display: block;
        height: calc(100vh - var(--shell-topbar-h));
        overflow-y: auto;
        overscroll-behavior: contain;
        scrollbar-width: thin;
        scrollbar-color: rgb(255 255 255 / 22%) transparent;
    }
}
/* /Components/Layout/PublicLayout.razor.rz.scp.css */
/* Public chrome: a wide, calm surface with a real header and a legal footer.
   Shares the auth canvas gradient so the landing page and the sign-in page read as
   one product rather than two. */

.pub[b-by1t2mh7r0] {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    background:
        radial-gradient(60rem 32rem at 85% -10%, rgb(73 136 167 / 7%), transparent 60%),
        radial-gradient(48rem 28rem at -10% 100%, rgb(58 113 137 / 6%), transparent 55%),
        var(--color-bg);
}

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

.pub__header[b-by1t2mh7r0] {
    position: sticky;
    top: 0;
    z-index: 20;
    background: rgb(255 255 255 / 82%);
    backdrop-filter: blur(10px);
    border-bottom: 1px solid var(--color-border);
}

.pub__header-inner[b-by1t2mh7r0],
.pub__footer-inner[b-by1t2mh7r0] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-4);
    max-width: var(--content-max);
    margin: 0 auto;
    padding: var(--space-3) var(--space-5);
}

.pub__brand[b-by1t2mh7r0] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-3);
    text-decoration: none;
    border-radius: var(--radius-md);
}

.pub__brand:focus-visible[b-by1t2mh7r0] { outline: 2px solid var(--color-focus); outline-offset: 4px; }

/* Hairline between the logo and the product descriptor — enough to separate the two
   without competing with the mark. */
.pub__brand-rule[b-by1t2mh7r0] {
    width: 1px;
    height: 1.5rem;
    background: var(--color-border-strong);
}

.pub__brand-sub[b-by1t2mh7r0] {
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    white-space: nowrap;
    color: var(--color-text-subtle);
}

.pub__nav[b-by1t2mh7r0] {
    display: flex;
    align-items: center;
    gap: var(--space-3);
}

.pub__nav-link[b-by1t2mh7r0] {
    color: var(--color-text-muted);
    text-decoration: none;
    font-size: var(--text-sm);
    font-weight: 550;
    padding: var(--space-2) var(--space-1);
    border-radius: var(--radius-sm);
}

.pub__nav-link:hover[b-by1t2mh7r0] { color: var(--color-text); text-decoration: underline; }
.pub__nav-link:focus-visible[b-by1t2mh7r0] { outline: 2px solid var(--color-focus); outline-offset: 2px; }

/* Below 640px the two buttons alone fill the row; the text link folds away rather
   than wrapping the header onto a second line. */
@media (max-width: 39.99em) {
    .pub__header-inner[b-by1t2mh7r0] { padding-inline: var(--space-4); }
    .pub__nav-link[b-by1t2mh7r0] { display: none; }
    .pub__brand-sub[b-by1t2mh7r0],
    .pub__brand-rule[b-by1t2mh7r0] { display: none; }
}

/* ── Main ───────────────────────────────────────────────────────────────── */

.pub__main[b-by1t2mh7r0] {
    flex: 1;
    outline: none;
}

/* ── Footer ─────────────────────────────────────────────────────────────── */

.pub__footer[b-by1t2mh7r0] {
    border-top: 1px solid var(--color-border);
    background: var(--color-surface);
}

.pub__footer-inner[b-by1t2mh7r0] {
    flex-wrap: wrap;
    padding-block: var(--space-5);
    font-size: var(--text-sm);
    color: var(--color-text-subtle);
}

.pub__footer-brand[b-by1t2mh7r0] { margin: 0; }

.pub__footer-links[b-by1t2mh7r0] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-4);
}

.pub__footer-links a[b-by1t2mh7r0] { color: var(--color-text-muted); }

#blazor-error-ui[b-by1t2mh7r0] {
    color-scheme: light only;
    display: none;
    position: fixed;
    left: 50%;
    bottom: var(--space-5);
    transform: translateX(-50%);
    z-index: 1000;
    width: min(560px, calc(100% - 2rem));
    padding: var(--space-4) var(--space-5);
    background-color: var(--color-surface);
    border: 1px solid #fecaca;
    border-left: 3px solid var(--color-danger);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-lg);
    font-size: var(--text-sm);
    color: var(--color-text);
}

#blazor-error-ui .reload[b-by1t2mh7r0] { margin-left: var(--space-2); font-weight: 600; }

#blazor-error-ui .dismiss[b-by1t2mh7r0] {
    cursor: pointer;
    position: absolute;
    right: var(--space-3);
    top: var(--space-2);
    color: var(--color-text-subtle);
}
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-a170lh3qdr],
.components-reconnect-repeated-attempt-visible[b-a170lh3qdr],
.components-reconnect-failed-visible[b-a170lh3qdr],
.components-pause-visible[b-a170lh3qdr],
.components-resume-failed-visible[b-a170lh3qdr],
.components-rejoining-animation[b-a170lh3qdr] {
    display: none;
}

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


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

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

}

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

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

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

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

    100% {
        opacity: 1;
    }
}

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

    100% {
        opacity: 0;
    }
}

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

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

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

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

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

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

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

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

@keyframes components-rejoining-animation-b-a170lh3qdr {
    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;
    }
}

/* The scaffold's reconnect animations are decorative; honour the OS preference. */
@media (prefers-reduced-motion: reduce) {
    .components-rejoining-animation[b-a170lh3qdr],
    #components-reconnect-modal[b-a170lh3qdr],
    #components-reconnect-modal .show[b-a170lh3qdr],
    #components-reconnect-modal .hide[b-a170lh3qdr] {
        animation: none !important;
        transition: none !important;
    }
}
/* /Components/Pages/Admin/AdminHome.razor.rz.scp.css */
/* Page-specific styling only — stat grid, split layout and quick actions come
   from the shared primitives in app.css. */

.admin-home__stats[b-46tgffkxc8] { margin-bottom: var(--space-5); }
/* /Components/Pages/Admin/AuditLog.razor.rz.scp.css */
/* Category and routine actions read as quiet metadata beside the timestamp, so the eye lands on
   the exceptional rows that are still chipped. */
.audit__category[b-cwy2jdw60z] { color: var(--color-text-muted); }

.audit__action[b-cwy2jdw60z] { color: var(--color-text); }
/* /Components/Pages/Admin/Documents.razor.rz.scp.css */
.adoc[b-pf93qbga89] { max-width: 44rem; }

.adoc__drop[b-pf93qbga89]  input[type="file"] {
    display: block;
    width: 100%;
    padding: var(--space-4);
    font-family: inherit;
    font-size: 0.9375rem;
    color: var(--color-text);
    background-color: var(--color-surface-sunken);
    border: 1.5px dashed var(--color-border-strong);
    border-radius: var(--radius-md);
    cursor: pointer;
    transition: border-color var(--dur-fast) var(--ease-out),
                background-color var(--dur-fast) var(--ease-out);
}

.adoc__drop[b-pf93qbga89]  input[type="file"]:hover:not(:disabled) {
    border-color: var(--color-primary);
    background-color: var(--color-primary-soft);
}

.adoc__drop[b-pf93qbga89]  input[type="file"]:focus-visible {
    outline: none;
    border-color: var(--color-primary);
    box-shadow: var(--shadow-focus);
}

.adoc__drop[b-pf93qbga89]  input[type="file"]:disabled {
    cursor: not-allowed;
    opacity: 0.6;
}

.adoc__busy[b-pf93qbga89] { margin-top: var(--space-5); }

.adoc__busy-text[b-pf93qbga89] {
    margin: var(--space-2) 0 0;
    font-size: var(--text-sm);
    color: var(--color-text-muted);
}

.adoc__status[b-pf93qbga89] { margin-top: var(--space-5); }
/* /Components/Pages/Admin/Fica/ProcessedDocuments.razor.rz.scp.css */
/* Layout comes from shared primitives — .admin-filter-grid--wide for the filter bar and .statband
   for the summary figures. What remains here is only what is specific to this table's cells. */

.pd__filters[b-grrutm5u9a] { margin-bottom: var(--space-5); }
.pd__stats[b-grrutm5u9a] { margin-bottom: var(--space-5); }

.pd__name[b-grrutm5u9a] {
    display: block;
    font-weight: 600;
    color: var(--color-text);
}

/* The supporting line under any primary cell value: the customer's email, the OCR confidence, the
   surname read off the document. One class rather than five, because they are all the same thing —
   detail that must be there when asked for and must never compete with the value above it. */
.pd__sub[b-grrutm5u9a] {
    display: block;
    font-size: var(--text-xs);
    color: var(--color-text-muted);
    overflow-wrap: anywhere;
}

/* Why a person was needed. Muted like the other sub-lines but allowed to wrap onto two lines, since
   truncating the one sentence that explains the row would defeat the column. */
.pd__reason[b-grrutm5u9a] {
    margin-top: 0.125rem;
    color: var(--color-text);
    white-space: normal;
}

/* The extractor's name — "PDF text layer", "RapidOCR (rendered PDF page)". Monospaced digits are
   irrelevant here, but it is a system identifier rather than prose, so it gets the quieter weight of
   a value and is allowed to wrap: these names are long and must not force the column wider. */
.pd__source[b-grrutm5u9a] {
    display: block;
    font-weight: 550;
    color: var(--color-text);
    white-space: normal;
}

/* The per-field match chips. Wraps rather than scrolls, so at 390px the three chips stack into the
   cell instead of pushing the table into a horizontal scroll for the sake of one column. */
.pd__matches[b-grrutm5u9a] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
    margin-bottom: var(--space-2);
}

/* Stacked rows put each cell's content on the right, opposite its label; keep these blocks aligned
   with the rest of the stacked card. Mirrors ReviewQueue.razor.css, which does the same. */
@media (max-width: 767.98px) {
    .pd__name[b-grrutm5u9a], .pd__sub[b-grrutm5u9a], .pd__source[b-grrutm5u9a] { text-align: right; }

    .pd__matches[b-grrutm5u9a] { justify-content: flex-end; }
}
/* /Components/Pages/Admin/Fica/ReviewDocument.razor.rz.scp.css */
/* Administrator document-review workspace: a large in-browser preview stage on the left,
   an always-visible review rail on the right. Modelled on document reviewers like SharePoint
   or Adobe Reader — the reviewer never leaves the page or downloads a file to make a decision. */

.rv__meta[b-jw02e6ijoi] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-3);
    margin-top: var(--space-3);
}

.rv__email[b-jw02e6ijoi] {
    font-size: var(--text-sm);
    color: var(--color-text-muted);
    overflow-wrap: anywhere;
}

.rv__message[b-jw02e6ijoi] { margin-bottom: var(--space-5); }

.rv__break[b-jw02e6ijoi] { overflow-wrap: anywhere; }
.rv__muted[b-jw02e6ijoi] { color: var(--color-text-muted); white-space: nowrap; }

/* ── Workspace grid ─────────────────────────────────────────────────────── */

.rv__grid[b-jw02e6ijoi] {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-5);
}

/* Roughly 60/40, expressed as fractions rather than a fixed rail width.
   At 22rem the rail was ~31% of the content column at 1440px, which left the assistant — the
   thing a reviewer is supposed to decide from — narrower than the two-column "Our records /
   Document" comparison inside it wanted. A minimum keeps it usable at the breakpoint itself,
   and a maximum stops it sprawling on a very wide monitor where 40% would be ~700px of rail. */
@media (min-width: 62em) {
    .rv__grid[b-jw02e6ijoi] {
        grid-template-columns: minmax(0, 1.5fr) minmax(20rem, 1fr);
        align-items: start;
    }
}

@media (min-width: 100em) {
    .rv__grid[b-jw02e6ijoi] { grid-template-columns: minmax(0, 1.5fr) minmax(24rem, 0.85fr); }
}

/* ── Preview toolbar: document navigation group (in DocumentPreview's ToolbarStart) ──── */

.rv__nav[b-jw02e6ijoi] {
    display: flex;
    align-items: center;
    gap: var(--space-1);
    padding: 2px;
    background: var(--color-surface-sunken);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
}

.rv__navbtn[b-jw02e6ijoi] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    padding: 0;
    font-size: 1.05rem;
    color: var(--color-text-muted);
    background: transparent;
    border: 0;
    border-radius: var(--radius-sm);
    cursor: pointer;
    transition: background-color .12s ease, color .12s ease;
}

.rv__navbtn:hover:not(:disabled)[b-jw02e6ijoi] { background: var(--color-surface); color: var(--color-text); }
.rv__navbtn:focus-visible[b-jw02e6ijoi] { outline: 2px solid var(--color-focus); outline-offset: 1px; }
.rv__navbtn:disabled[b-jw02e6ijoi] { opacity: .4; cursor: not-allowed; }

.rv__pos[b-jw02e6ijoi] {
    min-width: 3.5rem;
    padding-inline: var(--space-2);
    font-size: var(--text-sm);
    font-variant-numeric: tabular-nums;
    text-align: center;
    color: var(--color-text-muted);
}

.rv__pos-sep[b-jw02e6ijoi] { color: var(--color-text-muted); font-weight: 400; }

/* ── Review rail ────────────────────────────────────────────────────────── */

.rv__rail-inner[b-jw02e6ijoi] {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}

/* Cards keep their natural height instead of being squeezed to fit.
   The rail is a flex column with a max-height and its own scroll, and flex children default to
   flex-shrink: 1 — so every card was compressed to fit the viewport and then clipped by its own
   overflow: hidden. Measured on the running page: the assistant wanted 1072px and was rendered at
   347px; the decision card 550px at 179px; the history card 258px at 85px. On screen the assistant
   showed one check of five, the comment box was sliced in half and the history card was a heading
   with nothing under it — and no scrollbar appeared to suggest anything was missing, because from the
   browser's point of view nothing was: the content really had been made that small.

   ::deep is required and is the whole reason the first attempt at this fix did nothing. The rail's
   children are other components' root elements (VerificationAssistant, BloomCard), so they carry
   their own scope attribute, not this one's — Blazor rewrites a bare `> *` to `> *[b-thisfile]`,
   which matches none of them. Same trap as scoping a rule at NavLink's anchor. */
.rv__rail-inner[b-jw02e6ijoi] >  * { flex-shrink: 0; }

@media (min-width: 62em) {
    /* The rail — summary, decision and history — follows the reviewer and keeps its own
       scroll, so the approval controls stay reachable however tall the preview grows. */
    .rv__rail-inner[b-jw02e6ijoi] {
        position: sticky;
        top: calc(var(--shell-topbar-h) + var(--space-4));
        max-height: calc(100vh - var(--shell-topbar-h) - var(--space-6));
        overflow: auto;
        padding-right: var(--space-1);
    }
}

/* Decision order: approve is primary and first; destructive actions sit below so they are
   never the accidental click. */
.rv__actions[b-jw02e6ijoi] {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.rv__actions[b-jw02e6ijoi]  .btn--danger { margin-top: var(--space-2); }

.rv__done[b-jw02e6ijoi] {
    margin: 0 0 var(--space-4);
    font-size: var(--text-sm);
    color: var(--color-text-muted);
}

/* The workspace region owns the shortcuts and is focused programmatically, so it must not draw a
   focus ring — the ring would appear on arrival around the entire page for a mouse user who never
   asked for it. :focus-visible is deliberately left alone: a keyboard user who Tabs back to the
   region still gets the indicator. */
.rv__grid:focus[b-jw02e6ijoi] { outline: none; }

/* ── Shortcut legend ────────────────────────────────────────────────────────────
   On screen rather than in a help page. Reviewers only use shortcuts they can see. */

.rv__keys[b-jw02e6ijoi] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-1) var(--space-2);
    margin: var(--space-4) 0 0;
    padding-top: var(--space-3);
    border-top: 1px solid var(--color-border);
    font-size: var(--text-xs);
    color: var(--color-text-subtle);
}

.rv__keys-label[b-jw02e6ijoi] {
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.rv__keys kbd[b-jw02e6ijoi] {
    display: inline-block;
    min-width: 1.35rem;
    padding: 0.1rem 0.3rem;
    font-family: inherit;
    font-size: var(--text-xs);
    font-weight: 600;
    text-align: center;
    color: var(--color-text);
    background-color: var(--color-surface-sunken);
    border: 1px solid var(--color-border-strong);
    border-bottom-width: 2px;
    border-radius: var(--radius-sm);
}
/* /Components/Pages/Admin/Fica/ReviewQueue.razor.rz.scp.css */
.rq__filters[b-hbqz0emqfb] { margin-bottom: var(--space-5); }

/* Bottom-aligned so the selects, the inputs and the submit button share one line. The
   "Customer" field carries a hint and the others do not, which under align-items:start left
   its input sitting lower than its neighbours. See .admin-filter-grid in app.css — same grid,
   same fix, kept identical so the two filter bars stay indistinguishable. */
.rq__filter-grid[b-hbqz0emqfb] {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-4);
    align-items: end;
}

.rq__filter-grid > .field[b-hbqz0emqfb],
.rq__filter-grid > .rq__filter-action[b-hbqz0emqfb] { margin-bottom: 0; }

.rq__name[b-hbqz0emqfb] {
    display: block;
    font-weight: 600;
    color: var(--color-text);
}

.rq__email[b-hbqz0emqfb] {
    display: block;
    font-size: var(--text-sm);
    color: var(--color-text-muted);
    overflow-wrap: anywhere;
}

/* A fifth control (Reason) joined the row, so the columns are redistributed rather than left to
   wrap — at four fixed tracks the new select dropped onto its own line and took the button with it. */
@media (min-width: 768px) {
    .rq__filter-grid[b-hbqz0emqfb] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 1200px) {
    .rq__filter-grid[b-hbqz0emqfb] {
        grid-template-columns: minmax(0, 0.9fr) minmax(0, 0.8fr) minmax(0, 1.2fr) minmax(0, 1fr) auto;
    }

    .rq__filter-action[b-hbqz0emqfb] { min-width: 8rem; }
}

/* ── Band subheadings ──────────────────────────────────────────────────────────
   A row group heading inside the shared DataTable. Tinted and ruled so it reads as a
   division of one list rather than as another table header — the column labels above are
   uppercase grey, so these are sentence case and darker to sit clearly above them.

   No ::deep: these elements are this component's own markup, so they carry its scope. */

.rq__band th[b-hbqz0emqfb] {
    padding: var(--space-4) var(--space-5) var(--space-2);
    text-align: left;
    background-color: var(--color-surface-sunken);
    border-top: 1px solid var(--color-border);
    border-bottom: 1px solid var(--color-border);
    /* Undo the thead conventions inherited from DataTable's th rules. */
    text-transform: none;
    letter-spacing: normal;
    white-space: normal;
}

/* The first band opens the table, so it needs no rule above it. */
.rq__band:first-child th[b-hbqz0emqfb] { border-top: 0; }

.rq__band-title[b-hbqz0emqfb] {
    display: block;
    font-size: 0.9375rem;
    font-weight: 650;
    color: var(--color-text);
}

.rq__band-note[b-hbqz0emqfb] {
    display: block;
    margin-top: 0.125rem;
    font-size: var(--text-xs);
    font-weight: 400;
    color: var(--color-text-muted);
}

/* Stacked mode turns every row into a bordered card. A band heading is not a card — it is the
   label above the next few, so it opts out of the card treatment and keeps its full width. */
@media (max-width: 767.98px) {
    .rq__band[b-hbqz0emqfb] {
        display: block;
        margin-bottom: var(--space-2);
        padding: 0;
        border: 0;
        border-radius: 0;
        background-color: transparent;
    }

    .rq__band th[b-hbqz0emqfb] {
        display: block;
        padding: var(--space-3) var(--space-4);
        border-radius: var(--radius-md);
    }
}

/* Secondary identifiers: present for when they are needed, never competing with the reason. */
.rq__policy[b-hbqz0emqfb] {
    display: block;
    font-size: var(--text-xs);
    color: var(--color-text-subtle);
    font-variant-numeric: tabular-nums;
}

.rq__when[b-hbqz0emqfb] {
    display: block;
    font-size: var(--text-xs);
    color: var(--color-text-subtle);
}

/* Waiting time past the service promise. Bold as well as coloured — the band heading already
   groups these, so the colour reinforces rather than carries the meaning. */
.rq__overdue[b-hbqz0emqfb] {
    font-weight: 650;
    color: var(--color-danger);
}

/* Stacked rows put the name block on the right; keep it left-aligned. */
@media (max-width: 767.98px) {
    .rq__name[b-hbqz0emqfb], .rq__email[b-hbqz0emqfb], .rq__policy[b-hbqz0emqfb], .rq__when[b-hbqz0emqfb] { text-align: right; }
}
/* /Components/Pages/Admin/Fica/VerificationInsights.razor.rz.scp.css */
/* Automation insights.

   Reuses the shared primitives (.statband, .layout-split, .dl-rows, DataTable) — only the things this
   page genuinely introduces are declared here. */

.vi__period[b-7y76uc43gb] {
    max-width: 14rem;
    margin-bottom: var(--space-5);
}

/* ── The investment question ───────────────────────────────────────────────────
   Set on the canvas rather than in a card, because this page exists to answer one question
   and the answer should not look like the first of nine equal panels. */

.vi__hero[b-7y76uc43gb] {
    padding: var(--space-6) var(--space-5);
    margin-bottom: var(--space-5);
    background-color: var(--bloom-teal-50);
    border: 1px solid var(--bloom-teal-200);
    border-radius: var(--radius-lg);
}

.vi__hero-label[b-7y76uc43gb] {
    margin: 0;
    font-size: var(--text-xs);
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--bloom-teal-800);
}

.vi__hero-figure[b-7y76uc43gb] {
    margin: var(--space-2) 0 0;
    /* Clamped: this is words rather than a number, so it must not collide with the label at 390px. */
    font-size: clamp(1.75rem, 1.3rem + 2vw, 2.5rem);
    font-weight: 650;
    line-height: 1.1;
    letter-spacing: -0.02em;
    color: var(--bloom-teal-900);
}

.vi__hero-detail[b-7y76uc43gb] {
    margin: var(--space-2) 0 0;
    max-width: 60ch;
    font-size: var(--text-sm);
    line-height: 1.55;
    color: var(--color-text-muted);
}

/* The comparison between remedies. Bars scaled to the leader, so which one dominates is read
   from length rather than by comparing three numbers. */

.vi__compare[b-7y76uc43gb] {
    list-style: none;
    margin: var(--space-5) 0 0;
    padding: 0;
    display: grid;
    gap: var(--space-3);
}

.vi__compare-item[b-7y76uc43gb] {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: baseline;
    gap: var(--space-1) var(--space-3);
}

.vi__compare-label[b-7y76uc43gb] {
    font-size: var(--text-sm);
    color: var(--color-text);
}

.vi__compare-item--lead .vi__compare-label[b-7y76uc43gb] { font-weight: 650; }

.vi__compare-count[b-7y76uc43gb] {
    font-size: 0.9375rem;
    font-weight: 600;
    color: var(--color-text);
    font-variant-numeric: tabular-nums;
}

.vi__compare-bar[b-7y76uc43gb] {
    grid-column: 1 / -1;
    display: block;
    block-size: 6px;
    border-radius: 3px;
    background-color: var(--bloom-teal-100);
    overflow: hidden;
}

.vi__compare-fill[b-7y76uc43gb] {
    display: block;
    block-size: 100%;
    border-radius: 3px;
    background-color: var(--bloom-teal-500);
}

.vi__compare-item--lead .vi__compare-fill[b-7y76uc43gb] { background-color: var(--bloom-teal-700); }

.vi__caveat[b-7y76uc43gb] {
    margin: var(--space-4) 0 0;
    padding-top: var(--space-4);
    border-top: 1px solid var(--bloom-teal-200);
    font-size: var(--text-sm);
    color: var(--color-text-muted);
}

/* ── Table furniture ───────────────────────────────────────────────────────────
   These tables carry four columns of figures and can outgrow a narrow content column, so each
   passes DataTable a ScrollLabel — which makes the wrapper a focusable, named scroll region
   rather than a box a keyboard user cannot reach. That lives in DataTable rather than here so
   every table in the product gets the same treatment; this page invented its own scroll wrapper
   first, and axe caught the four unreachable regions it produced. */

.vi__pairs[b-7y76uc43gb] { margin-top: var(--space-5); }

/* A qualifier under a figure: the percentage beside a count, or "no decisions" in place of one. */
.vi__sub[b-7y76uc43gb] {
    display: block;
    font-size: var(--text-xs);
    font-weight: 400;
    color: var(--color-text-subtle);
}

.vi__override[b-7y76uc43gb] {
    display: inline-block;
    margin-left: var(--space-2);
    font-size: var(--text-xs);
    font-weight: 600;
    color: var(--color-warning);
}

/* How to read the table above it. Placed after, not before: the figures are the content and
   the guidance is the footnote. */
.vi__note[b-7y76uc43gb] {
    margin: var(--space-4) 0 0;
    font-size: var(--text-sm);
    line-height: 1.55;
    color: var(--color-text-muted);
}

.vi__note code[b-7y76uc43gb] {
    font-size: 0.8125rem;
    overflow-wrap: anywhere;
}

/* ── Reviewer comments ─────────────────────────────────────────────────────────
   Free text, so it wraps and the count stays pinned right. */

.vi__reasons[b-7y76uc43gb] {
    margin-top: var(--space-5);
    padding-top: var(--space-4);
    border-top: 1px solid var(--color-border);
}

.vi__reasons-title[b-7y76uc43gb] {
    margin: 0 0 var(--space-2);
    font-size: var(--text-xs);
    font-weight: 600;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: var(--color-text-subtle);
}

.vi__reasons-list[b-7y76uc43gb] {
    list-style: none;
    margin: 0;
    padding: 0;
}

.vi__reasons-list li[b-7y76uc43gb] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--space-4);
    padding: var(--space-2) 0;
    border-bottom: 1px solid var(--color-border);
}

.vi__reasons-list li:last-child[b-7y76uc43gb] { border-bottom: 0; }

.vi__reasons-text[b-7y76uc43gb] {
    font-size: var(--text-sm);
    color: var(--color-text);
    overflow-wrap: anywhere;
}

.vi__reasons-count[b-7y76uc43gb] {
    flex: 0 0 auto;
    font-size: var(--text-sm);
    font-weight: 600;
    color: var(--color-text);
    font-variant-numeric: tabular-nums;
}
/* /Components/Pages/Admin/Fica/VerificationReport.razor.rz.scp.css */
/* Verification performance.

   Only the things this page genuinely introduces are here. The stat row, the two-column split and the
   label/value lists all reuse the shared primitives (.statband, .layout-split, .dl-rows) rather than
   being redeclared — the alternative is a seventh private copy of a definition list, which is how the
   look drifts screen by screen. */

.vr__period[b-moiof0ou7k] {
    max-width: 14rem;
    margin-bottom: var(--space-5);
}

/* ── The one number ────────────────────────────────────────────────────────────
   Deliberately not a card among cards. This page exists to answer a single question, so its
   answer is set on the canvas at a size nothing else on the screen competes with. A tinted
   panel and a large figure carry the emphasis; the supporting tiles below stay quiet. */

.vr__hero[b-moiof0ou7k] {
    padding: var(--space-6) var(--space-5);
    margin-bottom: var(--space-5);
    background-color: var(--bloom-teal-50);
    border: 1px solid var(--bloom-teal-200);
    border-radius: var(--radius-lg);
}

.vr__hero-label[b-moiof0ou7k] {
    margin: 0;
    font-size: var(--text-xs);
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--bloom-teal-800);
}

.vr__hero-figure[b-moiof0ou7k] {
    margin: var(--space-2) 0 0;
    /* Clamped rather than fixed: at 390px a 4rem figure and a five-word label collide. */
    font-size: clamp(2.75rem, 2rem + 4vw, 4rem);
    font-weight: 650;
    line-height: 1;
    letter-spacing: -0.02em;
    color: var(--bloom-teal-900);
    font-variant-numeric: tabular-nums;
}

/* No bottom margin: it existed to separate the detail line from a progress bar that has since
   been removed as duplicative, and left ~64px of empty tinted panel below the last line of text. */
.vr__hero-detail[b-moiof0ou7k] {
    margin: var(--space-2) 0 0;
    font-size: var(--text-sm);
    color: var(--color-text-muted);
}

/* Stated in the same panel as the figure it qualifies, not in a footnote — a caveat a reader
   has to go looking for is a caveat nobody reads. */
.vr__caveat[b-moiof0ou7k] {
    margin: var(--space-4) 0 0;
    padding-top: var(--space-4);
    border-top: 1px solid var(--bloom-teal-200);
    font-size: var(--text-sm);
    color: var(--color-text-muted);
}

.vr__stats[b-moiof0ou7k] { margin-bottom: var(--space-5); }

/* ── Ranked reasons ────────────────────────────────────────────────────────────
   Replaces a three-column table. Each row is a label, its count, and a bar scaled to the
   leading row — so the ranking is read from the edge rather than by comparing percentages,
   and at 390px it stays three lines rather than becoming twelve stacked label-value pairs.

   The grid puts label and count on one line and gives the bar the full width beneath, which
   holds at every width without a media query. */

.vr__ranked[b-moiof0ou7k] {
    list-style: none;
    margin: 0;
    padding: 0;
}

.vr__ranked-item[b-moiof0ou7k] {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: baseline;
    gap: var(--space-2) var(--space-4);
    padding: var(--space-4) 0;
    border-bottom: 1px solid var(--color-border);
}

.vr__ranked-item:first-child[b-moiof0ou7k] { padding-top: 0; }
.vr__ranked-item:last-child[b-moiof0ou7k] { border-bottom: 0; padding-bottom: 0; }

.vr__ranked-label[b-moiof0ou7k] {
    font-size: var(--text-sm);
    color: var(--color-text);
}

.vr__ranked-count[b-moiof0ou7k] {
    font-size: 0.9375rem;
    font-weight: 600;
    color: var(--color-text);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.vr__ranked-share[b-moiof0ou7k] {
    font-weight: 400;
    color: var(--color-text-subtle);
}

.vr__ranked-bar[b-moiof0ou7k] {
    grid-column: 1 / -1;
    display: block;
    block-size: 6px;
    border-radius: 3px;
    background-color: var(--color-surface-sunken);
    overflow: hidden;
}

.vr__ranked-fill[b-moiof0ou7k] {
    display: block;
    block-size: 100%;
    border-radius: 3px;
    /* The leading reason is the one to act on, so the ramp darkens with rank rather than
       colouring every bar the same. One hue, not a traffic light: none of these is "bad". */
    background-color: var(--bloom-teal-500);
}

.vr__ranked-item:first-child .vr__ranked-fill[b-moiof0ou7k] { background-color: var(--bloom-teal-700); }

/* ── Issuers worth adding ──────────────────────────────────────────────────────
   A to-do list inside a supporting card, so it is separated from the measurement above it
   by a rule rather than by another card. */

.vr__suppliers[b-moiof0ou7k] {
    margin-top: var(--space-5);
    padding-top: var(--space-4);
    border-top: 1px solid var(--color-border);
}

.vr__suppliers-title[b-moiof0ou7k] {
    margin: 0;
    font-size: var(--text-xs);
    font-weight: 600;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: var(--color-text-subtle);
}

.vr__suppliers-lede[b-moiof0ou7k] {
    margin: var(--space-2) 0 var(--space-2);
    font-size: var(--text-sm);
    line-height: 1.5;
    color: var(--color-text-muted);
}

.vr__suppliers-lede code[b-moiof0ou7k] {
    font-size: 0.8125rem;
    overflow-wrap: anywhere;
}
/* /Components/Pages/Customer/Dashboard.razor.rz.scp.css */
/* Page-specific styling only — the stat grid, main/aside split and quick-action
   list all come from the shared primitives in app.css. */

.dash__notice[b-3ewxxmtclr] { margin-bottom: var(--space-5); }

.dash__stats[b-3ewxxmtclr] { margin-bottom: var(--space-5); }

.dash__ref[b-3ewxxmtclr] {
    font-weight: 600;
    color: var(--color-text);
}

.dash__fica-note[b-3ewxxmtclr] {
    margin: var(--space-4) 0 var(--space-5);
    font-size: var(--text-sm);
    color: var(--color-text-muted);
}
/* /Components/Pages/Customer/Documents.razor.rz.scp.css */
/* Page-specific styling only — grids and the main/aside loading split come from
   .grid-cards / .layout-split in app.css. */

.docs__checklist[b-2nwd3whf2y] { margin-bottom: var(--space-6); }

.docs__list[b-2nwd3whf2y] {
    margin: var(--space-5) 0 0;
    padding: 0;
    list-style: none;
    border-top: 1px solid var(--color-border);
}

.docs__list-item[b-2nwd3whf2y] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-4);
    padding: var(--space-3) 0;
    border-bottom: 1px solid var(--color-border);
}

.docs__list-name[b-2nwd3whf2y] {
    font-size: 0.9375rem;
    font-weight: 550;
    color: var(--color-text);
}

/* Status and action travel together on the right, wrapping rather than squeezing on a phone. */
.docs__list-state[b-2nwd3whf2y] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: var(--space-2);
}

.docs__doc-head[b-2nwd3whf2y] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--space-3);
    margin-bottom: var(--space-2);
}

.docs__doc-title[b-2nwd3whf2y] {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
    color: var(--color-text);
}

.docs__meta[b-2nwd3whf2y] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-2);
    margin: 0 0 var(--space-4);
    font-size: var(--text-sm);
    color: var(--color-text-muted);
}

.docs__file[b-2nwd3whf2y] {
    font-weight: 550;
    color: var(--color-text);
    overflow-wrap: anywhere;
}

.docs__zip[b-2nwd3whf2y] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
}

.docs__revised[b-2nwd3whf2y] {
    font-weight: 550;
    color: var(--color-primary);
}

.docs__note[b-2nwd3whf2y] { margin-bottom: var(--space-4); }

.docs__doc-actions[b-2nwd3whf2y] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
    padding-bottom: var(--space-4);
    margin-bottom: var(--space-4);
    border-bottom: 1px solid var(--color-border);
}
/* /Components/Pages/Customer/PolicyDetail.razor.rz.scp.css */
/* Page-specific styling only — card grids come from .grid-cards and the
   label/value rows from .dl-rows in app.css. */

.pol__meta[b-gpg6f7956m] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-3);
    margin-top: var(--space-3);
}

.pol__synced[b-gpg6f7956m] {
    font-size: var(--text-sm);
    color: var(--color-text-subtle);
}

/* Beneficiaries */
.pol__people[b-gpg6f7956m] { margin: 0; padding: 0; list-style: none; }

.pol__person[b-gpg6f7956m] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
    padding: var(--space-3) 0;
    border-bottom: 1px solid var(--color-border);
}

.pol__person:last-child[b-gpg6f7956m] { border-bottom: 0; }
.pol__person:first-child[b-gpg6f7956m] { padding-top: 0; }

.pol__person-name[b-gpg6f7956m] { font-size: 0.9375rem; font-weight: 550; color: var(--color-text); }

/* Documents */
.pol__docs[b-gpg6f7956m] { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: var(--space-2); }

.pol__doc-link[b-gpg6f7956m] {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    padding: var(--space-3);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    font-size: 0.9375rem;
    font-weight: 550;
    text-decoration: none;
    color: var(--color-text);
    transition: background-color var(--dur-fast) var(--ease-out),
                border-color var(--dur-fast) var(--ease-out);
}

.pol__doc-link:hover[b-gpg6f7956m] {
    background-color: var(--color-primary-soft);
    border-color: var(--bloom-teal-200);
    color: var(--color-primary-active);
}

.pol__doc-link:focus-visible[b-gpg6f7956m] { outline: 2px solid var(--color-focus); outline-offset: 2px; }

.pol__doc-icon[b-gpg6f7956m] {
    display: grid;
    place-items: center;
    width: 1.75rem;
    height: 1.75rem;
    flex: 0 0 auto;
    border-radius: var(--radius-sm);
    background-color: var(--color-primary-soft);
    color: var(--color-primary);
}
/* /Components/Pages/Customer/Profile.razor.rz.scp.css */
/* Page-specific styling only — the main/aside split comes from .layout-split. */

.prof__saved[b-um0w9pmvxn] { margin-bottom: 0; }

.prof__dl[b-um0w9pmvxn] { margin: 0 0 var(--space-3); }

.prof__dl dt[b-um0w9pmvxn] {
    font-size: var(--text-xs);
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--color-text-muted);
}

.prof__dl dd[b-um0w9pmvxn] {
    margin: var(--space-1) 0 0;
    font-size: 0.9375rem;
    font-weight: 550;
    color: var(--color-text);
    overflow-wrap: anywhere;
}

.prof__hint[b-um0w9pmvxn] {
    margin: 0 0 var(--space-4);
    font-size: var(--text-sm);
    color: var(--color-text-muted);
}

.prof__side[b-um0w9pmvxn]  .card__body > :last-child { margin-bottom: 0; }
/* /Components/Pages/Customer/UploadDocument.razor.rz.scp.css */
.up__drop[b-y3bg2pukyt] { margin: var(--space-5) 0; }

.up__actions[b-y3bg2pukyt] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
}

@media (max-width: 575.98px) {
    .up__actions[b-y3bg2pukyt] { flex-direction: column-reverse; }
    .up__actions[b-y3bg2pukyt]  .btn { width: 100%; }
}
/* /Components/Pages/Error.razor.rz.scp.css */
.err__ref[b-j5zapst49v] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    margin: var(--space-5) 0 0;
    padding: var(--space-2) var(--space-3);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    background-color: var(--color-surface-sunken);
}

.err__ref-label[b-j5zapst49v] {
    font-size: var(--text-xs);
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--color-text-muted);
}

.err__ref-code[b-j5zapst49v] {
    font-family: var(--font-mono);
    font-size: var(--text-sm);
    color: var(--color-text);
    overflow-wrap: anywhere;
}
/* /Components/Pages/Help.razor.rz.scp.css */
/* Help page. The page sits on PublicLayout, which has no content container of its own,
   so the width cap lives here. */

.help[b-3dsxx16fva] {
    max-width: var(--content-max);
    margin: 0 auto;
    padding: var(--space-6) var(--space-5) var(--space-8);
}

/* ── FAQ ────────────────────────────────────────────────────────────────── */

.faq[b-3dsxx16fva] {
    display: grid;
    border-top: 1px solid var(--color-border);
}

.faq__item[b-3dsxx16fva] { border-bottom: 1px solid var(--color-border); }

.faq__q[b-3dsxx16fva] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--space-4);
    padding: var(--space-4) 0;
    cursor: pointer;
    font-weight: 600;
    color: var(--color-text);
    list-style: none;
}

/* Replace the native disclosure triangle with a marker that reads at any size and
   matches the icon weight used elsewhere. */
.faq__q[b-3dsxx16fva]::-webkit-details-marker { display: none; }

.faq__q[b-3dsxx16fva]::after {
    content: "+";
    flex: none;
    width: 1.5rem;
    height: 1.5rem;
    display: grid;
    place-items: center;
    border-radius: var(--radius-sm);
    background: var(--color-surface-sunken);
    color: var(--color-text-muted);
    font-weight: 700;
    line-height: 1;
    transition: background var(--dur-fast) var(--ease-out);
}

.faq__item[open] .faq__q[b-3dsxx16fva]::after {
    content: "−";
    background: var(--color-primary-soft);
    color: var(--color-primary);
}

.faq__q:hover[b-3dsxx16fva] { color: var(--color-primary); }

.faq__q:focus-visible[b-3dsxx16fva] {
    outline: 2px solid var(--color-focus);
    outline-offset: 2px;
    border-radius: var(--radius-sm);
}

.faq__a[b-3dsxx16fva] {
    padding: 0 var(--space-7) var(--space-4) 0;
    color: var(--color-text-muted);
    line-height: 1.65;
}

.faq__a p[b-3dsxx16fva] { margin: 0 0 var(--space-3); }
.faq__a p:last-child[b-3dsxx16fva] { margin-bottom: 0; }

/* ── Contact ────────────────────────────────────────────────────────────── */

.help__contact[b-3dsxx16fva] {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: var(--space-2) var(--space-4);
    margin: 0;
    font-size: var(--text-sm);
}

.help__contact dt[b-3dsxx16fva] {
    color: var(--color-text-subtle);
    font-weight: 550;
}

.help__contact dd[b-3dsxx16fva] {
    margin: 0;
    color: var(--color-text);
    overflow-wrap: anywhere;
}

.help__note[b-3dsxx16fva] {
    margin: var(--space-4) 0 0;
    padding-top: var(--space-4);
    border-top: 1px solid var(--color-border);
    font-size: var(--text-xs);
    color: var(--color-text-subtle);
}

/* ── Quick links ────────────────────────────────────────────────────────── */

.help__links[b-3dsxx16fva] {
    display: grid;
    gap: var(--space-1);
    font-size: var(--text-sm);
}

.help__links a[b-3dsxx16fva] {
    padding: var(--space-2) 0;
    border-bottom: 1px solid var(--color-border);
}

.help__links a:last-child[b-3dsxx16fva] { border-bottom: none; }

@media (max-width: 47.99em) {
    .help[b-3dsxx16fva] { padding: var(--space-5) var(--space-4) var(--space-7); }
    .faq__a[b-3dsxx16fva] { padding-right: 0; }
}
/* /Components/Pages/Home.razor.rz.scp.css */
/* Landing page. Two-column hero on desktop, single column on mobile with the trust
   panel below the actions — a visitor on a phone should reach "Sign in" without
   scrolling past a wall of reassurance text. */

.hero[b-s3uqjo4ksr] {
    padding: var(--space-8) var(--space-5) var(--space-7);
}

.hero__inner[b-s3uqjo4ksr] {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
    gap: var(--space-7);
    align-items: center;
    max-width: var(--content-max);
    margin: 0 auto;
}

.hero__title[b-s3uqjo4ksr] {
    margin: 0 0 var(--space-4);
    font-size: clamp(2rem, 1.4rem + 2.4vw, 3rem);
    line-height: 1.12;
    letter-spacing: -0.02em;
    color: var(--color-text);
}

.hero__lede[b-s3uqjo4ksr] {
    margin: 0 0 var(--space-6);
    max-width: 56ch;
    font-size: 1.0625rem;
    line-height: 1.65;
    color: var(--color-text-muted);
}

.hero__actions[b-s3uqjo4ksr] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-3);
    margin-bottom: var(--space-5);
}

.hero__meta[b-s3uqjo4ksr] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-3);
    margin: 0;
    font-size: var(--text-sm);
}

.hero__meta-sep[b-s3uqjo4ksr] { color: var(--color-border-strong); }

/* ── Trust panel ────────────────────────────────────────────────────────── */

.hero__panel[b-s3uqjo4ksr] {
    padding: var(--space-6);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-md);
}

.hero__panel-badge[b-s3uqjo4ksr] {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    margin: 0 0 var(--space-4);
    padding-bottom: var(--space-4);
    border-bottom: 1px solid var(--color-border);
    font-weight: 650;
    color: var(--color-text);
}

.hero__panel-icon[b-s3uqjo4ksr] {
    display: grid;
    place-items: center;
    width: 2rem;
    height: 2rem;
    flex: none;
    border-radius: var(--radius-sm);
    background: var(--color-primary-soft);
    color: var(--color-primary);
}

.hero__panel-list[b-s3uqjo4ksr] {
    margin: 0;
    padding: 0;
    list-style: none;
    display: grid;
    gap: var(--space-3);
    font-size: var(--text-sm);
    line-height: 1.55;
    color: var(--color-text-muted);
}

.hero__panel-list li[b-s3uqjo4ksr] {
    display: grid;
    grid-template-columns: 1rem 1fr;
    gap: var(--space-3);
}

/* Lucide "check" as a masked SVG (no Unicode glyph); tinted with the success colour. */
.hero__panel-list li[b-s3uqjo4ksr]::before {
    content: "";
    width: 1.05em;
    height: 1.05em;
    margin-top: 0.1em;
    background-color: var(--color-success);
    -webkit-mask: var(--icon-check) center / contain no-repeat;
    mask: var(--icon-check) center / contain no-repeat;
}

.hero__panel-note[b-s3uqjo4ksr] {
    margin: var(--space-4) 0 0;
    padding-top: var(--space-4);
    border-top: 1px solid var(--color-border);
    font-size: var(--text-xs);
    color: var(--color-text-subtle);
}

/* ── Content sections ───────────────────────────────────────────────────── */

.landing-section[b-s3uqjo4ksr] {
    padding: var(--space-7) var(--space-5);
}

.landing-section--muted[b-s3uqjo4ksr] {
    background: var(--color-surface);
    border-top: 1px solid var(--color-border);
}

.landing-section__inner[b-s3uqjo4ksr] {
    max-width: var(--content-max);
    margin: 0 auto;
}

.landing-cta[b-s3uqjo4ksr] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-5);
}

.landing-cta__title[b-s3uqjo4ksr] { margin: 0 0 var(--space-2); font-size: var(--text-h2); }

.landing-cta__text[b-s3uqjo4ksr] { max-width: 60ch; }
.landing-cta__text p[b-s3uqjo4ksr] { margin: 0; color: var(--color-text-muted); }

.landing-cta__actions[b-s3uqjo4ksr] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-3);
}

@media (max-width: 61.99em) {
    .hero[b-s3uqjo4ksr] { padding: var(--space-7) var(--space-4) var(--space-6); }

    .hero__inner[b-s3uqjo4ksr] {
        grid-template-columns: minmax(0, 1fr);
        gap: var(--space-6);
    }

    .landing-section[b-s3uqjo4ksr] { padding-inline: var(--space-4); }
}
/* /Components/Pages/Registration/RegisterOtp.razor.rz.scp.css */
.otp-lede[b-truq9vsii7] {
    margin: 0 0 var(--space-5);
    font-size: 0.9375rem;
    color: var(--color-text-muted);
    text-align: center;
}

.otp-lede strong[b-truq9vsii7] {
    color: var(--color-text);
    font-weight: 600;
    white-space: nowrap;
}

.otp-resend[b-truq9vsii7] { margin: 0; }

/* Looks like a link, stays a real submit button for the resend form post. */
.otp-resend__btn[b-truq9vsii7] {
    padding: 0;
    border: 0;
    background: none;
    font: inherit;
    color: var(--color-link);
    font-weight: 550;
    cursor: pointer;
    text-decoration: underline;
    text-underline-offset: 0.18em;
    border-radius: var(--radius-sm);
}

.otp-resend__btn:hover[b-truq9vsii7] { color: var(--color-primary-active); }
.otp-resend__btn:focus-visible[b-truq9vsii7] { outline: 2px solid var(--color-focus); outline-offset: 2px; }
/* /Components/Registration/OtpInput.razor.rz.scp.css */
/* ::deep because InputText renders the <input> as a child component. */
[b-tig49hxn76] input.otp {
    width: 100%;
    padding: var(--space-4) var(--space-3);
    font-family: var(--font-mono);
    font-size: 1.75rem;
    font-weight: 600;
    letter-spacing: 0.5em;
    text-indent: 0.5em;
    text-align: center;
    color: var(--color-text);
    background-color: var(--color-surface);
    border: 1px solid var(--color-border-strong);
    border-radius: var(--radius-md);
    transition: border-color var(--dur-fast) var(--ease-out),
                box-shadow var(--dur-fast) var(--ease-out);
}

[b-tig49hxn76] input.otp::placeholder {
    color: var(--color-border-strong);
    font-weight: 400;
}

[b-tig49hxn76] input.otp:focus {
    outline: none;
    border-color: var(--color-primary);
    box-shadow: var(--shadow-focus);
}

[b-tig49hxn76] input.otp.invalid {
    border-color: var(--color-danger);
}
/* /Components/Ui/ActivityTimeline.razor.rz.scp.css */
.tl[b-0ygdptq00i] {
    margin: 0;
    padding: 0;
    list-style: none;
}

.tl__item[b-0ygdptq00i] {
    position: relative;
    display: flex;
    gap: var(--space-4);
    padding-bottom: var(--space-5);
}

.tl__item:last-child[b-0ygdptq00i] { padding-bottom: 0; }

/* Connector line down the rail */
.tl__item:not(:last-child)[b-0ygdptq00i]::before {
    content: "";
    position: absolute;
    left: 0.3125rem;
    top: 1rem;
    bottom: 0;
    width: 2px;
    border-radius: 2px;
    background-color: var(--color-border);
}

.tl__marker[b-0ygdptq00i] {
    position: relative;
    z-index: 1;
    width: 0.75rem;
    height: 0.75rem;
    flex: 0 0 auto;
    margin-top: 0.3125rem;
    border-radius: var(--radius-full);
    border: 2px solid var(--color-surface);
    background-color: var(--color-border-strong);
    box-shadow: 0 0 0 1px var(--color-border);
}

.tl__item--brand   .tl__marker[b-0ygdptq00i] { background-color: var(--color-primary); box-shadow: 0 0 0 1px var(--color-primary); }
.tl__item--success .tl__marker[b-0ygdptq00i] { background-color: var(--color-success); box-shadow: 0 0 0 1px var(--color-success); }
.tl__item--warning .tl__marker[b-0ygdptq00i] { background-color: var(--color-warning); box-shadow: 0 0 0 1px var(--color-warning); }
.tl__item--danger  .tl__marker[b-0ygdptq00i] { background-color: var(--color-danger);  box-shadow: 0 0 0 1px var(--color-danger); }

.tl__content[b-0ygdptq00i] { min-width: 0; flex: 1; }

.tl__head[b-0ygdptq00i] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--space-3);
    flex-wrap: wrap;
}

.tl__title[b-0ygdptq00i] {
    font-size: 0.9375rem;
    font-weight: 550;
    color: var(--color-text);
}

.tl__time[b-0ygdptq00i] {
    font-size: var(--text-xs);
    color: var(--color-text-subtle);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.tl__detail[b-0ygdptq00i] {
    margin: var(--space-1) 0 0;
    font-size: var(--text-sm);
    color: var(--color-text-muted);
}
/* /Components/Ui/BloomAlert.razor.rz.scp.css */
.alert[b-20mwk2z43g] {
    display: flex;
    align-items: flex-start;
    gap: var(--space-3);
    padding: var(--space-4);
    border: 1px solid transparent;
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    line-height: 1.55;
}

/* Solid disc in the tone colour with a white character on top. Each tone's
   solid value carries white text at >=5:1 (see docs/DESIGN-SYSTEM.md §2.3). */
.alert__glyph[b-20mwk2z43g] {
    display: grid;
    place-items: center;
    width: 1.25rem;
    height: 1.25rem;
    flex: 0 0 auto;
    margin-top: 1px;
    border-radius: var(--radius-full);
    color: #fff;
    font-size: 0.75rem;
    font-weight: 700;
    line-height: 1;
}

.alert--info .alert__glyph[b-20mwk2z43g]    { background-color: var(--color-info); }
.alert--success .alert__glyph[b-20mwk2z43g] { background-color: var(--color-success); }
.alert--warning .alert__glyph[b-20mwk2z43g] { background-color: var(--color-warning); }
.alert--danger .alert__glyph[b-20mwk2z43g]  { background-color: var(--color-danger); }

.alert__body[b-20mwk2z43g] { min-width: 0; flex: 1; }

.alert__title[b-20mwk2z43g] { margin: 0 0 var(--space-1); font-weight: 600; }

.alert__text[b-20mwk2z43g]  > :last-child { margin-bottom: 0; }

.alert--info[b-20mwk2z43g]    { background-color: var(--color-info-bg);    border-color: #bae6fd; color: var(--color-info); }
.alert--success[b-20mwk2z43g] { background-color: var(--color-success-bg); border-color: #bbf7d0; color: var(--color-success); }
.alert--warning[b-20mwk2z43g] { background-color: var(--color-warning-bg); border-color: #fde68a; color: var(--color-warning); }
.alert--danger[b-20mwk2z43g]  { background-color: var(--color-danger-bg);  border-color: #fecaca; color: var(--color-danger); }
/* /Components/Ui/BloomButton.razor.rz.scp.css */
.btn[b-p1xvpil53j] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-2);
    border: 1px solid transparent;
    border-radius: var(--radius-md);
    font-family: inherit;
    font-weight: 550;
    line-height: 1.2;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
    user-select: none;
    transition: background-color var(--dur-fast) var(--ease-out),
                border-color var(--dur-fast) var(--ease-out),
                color var(--dur-fast) var(--ease-out),
                box-shadow var(--dur-fast) var(--ease-out),
                transform var(--dur-fast) var(--ease-out);
}

.btn:active:not(:disabled)[b-p1xvpil53j] { transform: translateY(0.5px); }

.btn:disabled[b-p1xvpil53j],
.btn.is-loading[b-p1xvpil53j] {
    cursor: not-allowed;
    opacity: 0.6;
}

.btn:focus-visible[b-p1xvpil53j] {
    outline: 2px solid var(--color-focus);
    outline-offset: 2px;
}

/* Sizes */
.btn--sm[b-p1xvpil53j] { padding: 0.375rem var(--space-3); font-size: var(--text-sm); border-radius: var(--radius-sm); }
.btn--md[b-p1xvpil53j] { padding: 0.5625rem var(--space-4); font-size: 0.9375rem; }
.btn--lg[b-p1xvpil53j] { padding: 0.8125rem var(--space-5); font-size: 1.0625rem; }

.btn--block[b-p1xvpil53j] { width: 100%; }

/* Touch: WCAG 2.5.8 asks for a 24px minimum; 44px is the comfortable pointer
   target. Only small buttons fall short, and only on coarse pointers. */
@media (pointer: coarse) {
    .btn--sm[b-p1xvpil53j] { min-height: 2.75rem; padding-inline: var(--space-4); }
    .btn--md[b-p1xvpil53j] { min-height: 2.75rem; }
}

/* Variants */
.btn--primary[b-p1xvpil53j] {
    background-color: var(--color-primary);
    border-color: var(--color-primary);
    color: #fff;
    box-shadow: var(--shadow-xs);
}

.btn--primary:hover:not(:disabled)[b-p1xvpil53j] {
    background-color: var(--color-primary-hover);
    border-color: var(--color-primary-hover);
    color: #fff;
    box-shadow: var(--shadow-sm);
}

.btn--primary:active:not(:disabled)[b-p1xvpil53j] {
    background-color: var(--color-primary-active);
    border-color: var(--color-primary-active);
}

.btn--secondary[b-p1xvpil53j] {
    background-color: var(--color-surface);
    border-color: var(--color-border-strong);
    color: var(--color-text);
}

.btn--secondary:hover:not(:disabled)[b-p1xvpil53j] {
    background-color: var(--color-hover);
    color: var(--color-text);
}

.btn--outline[b-p1xvpil53j] {
    background-color: transparent;
    border-color: var(--color-border-strong);
    color: var(--color-link);
}

.btn--outline:hover:not(:disabled)[b-p1xvpil53j] {
    background-color: var(--color-primary-soft);
    border-color: var(--color-primary);
    color: var(--color-primary-active);
}

.btn--danger[b-p1xvpil53j] {
    background-color: var(--color-danger);
    border-color: var(--color-danger);
    color: #fff;
    box-shadow: var(--shadow-xs);
}

.btn--danger:hover:not(:disabled)[b-p1xvpil53j] {
    background-color: #991b1b;
    border-color: #991b1b;
    color: #fff;
}

.btn--ghost[b-p1xvpil53j] {
    background-color: transparent;
    border-color: transparent;
    color: var(--color-text-muted);
}

.btn--ghost:hover:not(:disabled)[b-p1xvpil53j] {
    background-color: var(--color-hover);
    color: var(--color-text);
}

/* Loading */
.btn__spinner[b-p1xvpil53j] {
    width: 0.875em;
    height: 0.875em;
    flex: 0 0 auto;
    border: 2px solid currentColor;
    border-right-color: transparent;
    border-radius: var(--radius-full);
    animation: btn-spin-b-p1xvpil53j 640ms linear infinite;
}

@keyframes btn-spin-b-p1xvpil53j { to { transform: rotate(360deg); } }

@media (prefers-reduced-motion: reduce) {
    .btn__spinner[b-p1xvpil53j] { animation-duration: 2s; }
}
/* /Components/Ui/BloomCard.razor.rz.scp.css */
.card[b-8vc3znfn60] {
    display: flex;
    flex-direction: column;
    background-color: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-sm);
    overflow: hidden;
}

.card--interactive[b-8vc3znfn60] {
    transition: box-shadow var(--dur-base) var(--ease-out),
                transform var(--dur-base) var(--ease-out),
                border-color var(--dur-base) var(--ease-out);
}

.card--interactive:hover[b-8vc3znfn60] {
    box-shadow: var(--shadow-md);
    border-color: var(--color-border-strong);
    transform: translateY(-1px);
}

/* No divider by default.
   Every card drew a full-width rule under its title, inside a bordered box, so a page of four
   cards produced eight horizontal lines before any content. Where the body is prose or controls
   the title's own weight and the padding already separate them — the rule was pure furniture.
   It is kept only for --flush cards, whose body is a table: there it genuinely divides a header
   from a data grid and lines up with the table's own column rule. */
.card__head[b-8vc3znfn60] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--space-4);
    padding: var(--space-5) var(--space-5) var(--space-4);
}

.card--flush > .card__head[b-8vc3znfn60] { border-bottom: 1px solid var(--color-border); }

/* With no body at all, the head's reduced bottom padding leaves the card optically
   bottom-cropped, so restore the full inset. */
.card__head:last-child[b-8vc3znfn60],
.card__head:has(+ .card__foot)[b-8vc3znfn60] {
    padding-bottom: var(--space-5);
    border-bottom: 0;
}

/* Supporting panels recede: no lift, and a title one step down the scale. */
.card--supporting[b-8vc3znfn60] {
    box-shadow: none;
}

.card--supporting .card__title[b-8vc3znfn60] {
    font-size: var(--text-sm);
    font-weight: 650;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    color: var(--color-text-muted);
}

.card__head-text[b-8vc3znfn60] { min-width: 0; }

.card__title[b-8vc3znfn60] {
    margin: 0;
    font-size: 1.0625rem;
    font-weight: 600;
    letter-spacing: -0.01em;
    color: var(--color-text);
}

.card__desc[b-8vc3znfn60] {
    margin: var(--space-1) 0 0;
    font-size: var(--text-sm);
    color: var(--color-text-muted);
}

.card__actions[b-8vc3znfn60] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    flex: 0 0 auto;
}

.card__body[b-8vc3znfn60] { padding: var(--space-5); flex: 1; }

.card--flush .card__body[b-8vc3znfn60] { padding: 0; }

.card__foot[b-8vc3znfn60] {
    padding: var(--space-4) var(--space-5);
    background-color: var(--color-surface-sunken);
    border-top: 1px solid var(--color-border);
}

.card__body[b-8vc3znfn60]  > :last-child { margin-bottom: 0; }
/* /Components/Ui/Breadcrumbs.razor.rz.scp.css */
.crumbs__list[b-3btjci3d0e] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
    padding: 0;
    list-style: none;
    font-size: var(--text-sm);
}

.crumbs__item[b-3btjci3d0e] { display: inline-flex; align-items: center; gap: var(--space-2); }

.crumbs__link[b-3btjci3d0e] {
    color: var(--color-text-muted);
    text-decoration: none;
    border-radius: var(--radius-sm);
    transition: color var(--dur-fast) var(--ease-out);
}

.crumbs__link:hover[b-3btjci3d0e] { color: var(--color-link); text-decoration: underline; }

.crumbs__sep[b-3btjci3d0e] { color: var(--color-border-strong); }

.crumbs__current[b-3btjci3d0e] { color: var(--color-text); font-weight: 550; }
/* /Components/Ui/ConfirmDialog.razor.rz.scp.css */
.cd__text[b-v3fw2fw9zy] {
    margin: 0;
    font-size: 0.9375rem;
    line-height: 1.6;
    color: var(--color-text-muted);
}
/* /Components/Ui/DataTable.razor.rz.scp.css */
.dt[b-yz95epj109] { width: 100%; }

/* A wide table scrolls inside its own box rather than pushing the page sideways. Paired with the
   focusable, labelled wrapper in the markup so the hidden columns are reachable by keyboard. */
.dt--scroll[b-yz95epj109] { overflow-x: auto; }

.dt--scroll:focus-visible[b-yz95epj109] {
    outline: 2px solid var(--color-focus);
    outline-offset: 2px;
}

.dt__table[b-yz95epj109] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9375rem;
    /* Figures line up down every column — policy numbers, contract numbers, counts and dates
       all read as a typeset report rather than as proportional text that drifts. */
    font-variant-numeric: tabular-nums;
    font-feature-settings: "tnum" 1;
}

/* The header is a rule, not a filled band.
   A grey block behind the column labels is the single most recognisable piece of admin-template
   furniture, and it competed with the card header directly above it. A firm hairline under quiet
   uppercase labels carries the same structure with none of the weight — the way a printed
   statement separates its columns. */
.dt__table[b-yz95epj109]  thead th {
    padding: var(--space-3) var(--space-5);
    text-align: left;
    font-size: var(--text-xs);
    font-weight: 600;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: var(--color-text-subtle);
    background-color: transparent;
    border-bottom: 1px solid var(--color-border-strong);
    white-space: nowrap;
}

/* Row rules sit lighter than the header rule, so the eye reads the header first and the rows
   as a continuous body rather than as a stack of equally boxed cells. */
.dt__table[b-yz95epj109]  tbody td {
    padding: var(--space-4) var(--space-5);
    border-bottom: 1px solid var(--color-border);
    vertical-align: middle;
    color: var(--color-text);
}

.dt__table[b-yz95epj109]  tbody tr:last-child td { border-bottom: 0; }

/* Dense variant for report-length tables (the audit log runs to 50 rows).
   At the default row height a log becomes a page of scrolling with more gap than content; an
   executive report packs the rows so a period can be scanned in one view, and relies on the
   column rules rather than air to keep them apart. */
.dt--dense .dt__table[b-yz95epj109]  tbody td { padding: var(--space-2) var(--space-5); }
.dt--dense .dt__table[b-yz95epj109]  thead th { padding: var(--space-2) var(--space-5); }

.dt__table[b-yz95epj109]  tbody tr {
    transition: background-color var(--dur-fast) var(--ease-out);
}

.dt__table[b-yz95epj109]  tbody tr:hover { background-color: var(--color-hover); }

.dt__table[b-yz95epj109]  td.dt-num,
.dt__table[b-yz95epj109]  th.dt-num {
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.dt__table[b-yz95epj109]  td.dt-actions { text-align: right; white-space: nowrap; }

/* Stacked cards below md */
@media (max-width: 767.98px) {
    .dt--stack .dt__table[b-yz95epj109],
    .dt--stack .dt__table[b-yz95epj109]  tbody,
    .dt--stack .dt__table[b-yz95epj109]  tr,
    .dt--stack .dt__table[b-yz95epj109]  td { display: block; width: 100%; }

    .dt--stack .dt__table[b-yz95epj109]  thead {
        position: absolute;
        width: 1px;
        height: 1px;
        overflow: hidden;
        clip: rect(0 0 0 0);
        white-space: nowrap;
    }

    .dt--stack .dt__table[b-yz95epj109]  tbody tr {
        margin-bottom: var(--space-3);
        padding: var(--space-2) 0;
        border: 1px solid var(--color-border);
        border-radius: var(--radius-md);
        background-color: var(--color-surface);
    }

    .dt--stack .dt__table[b-yz95epj109]  tbody tr:last-child { margin-bottom: 0; }

    .dt--stack .dt__table[b-yz95epj109]  tbody td {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: var(--space-4);
        padding: var(--space-2) var(--space-4);
        border-bottom: 0;
        text-align: right;
    }

    /* The header text is re-attached per cell from data-label. */
    .dt--stack .dt__table[b-yz95epj109]  tbody td::before {
        content: attr(data-label);
        flex: 0 0 auto;
        font-size: var(--text-xs);
        font-weight: 600;
        letter-spacing: 0.04em;
        text-transform: uppercase;
        color: var(--color-text-muted);
        text-align: left;
    }

    .dt--stack .dt__table[b-yz95epj109]  td.dt-actions { justify-content: flex-end; }
}
/* /Components/Ui/EmptyState.razor.rz.scp.css */
/* An empty panel should be quiet, not cavernous. 64px of padding above and below a single
   sentence made "nothing here yet" the largest element on the dashboard — two of these filled
   the customer's main column with ~700px of near-blank surface, which reads as unfinished
   rather than calm. */
.empty[b-s767fluvh8] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: var(--space-7) var(--space-5);
}

.empty--compact[b-s767fluvh8] { padding: var(--space-5) var(--space-4); }

/* Flat, and smaller. The gradient blob was the flashiest thing on an otherwise sober page, and
   it faded into #e6f0ff — a blue left over from the abandoned blue palette, which put an
   off-brand hue on every empty state in the product. */
.empty__glyph[b-s767fluvh8] {
    display: grid;
    place-items: center;
    width: 2.75rem;
    height: 2.75rem;
    margin-bottom: var(--space-3);
    border-radius: var(--radius-full);
    background-color: var(--color-primary-soft);
    color: var(--color-primary);
    font-size: 1.25rem;
    line-height: 1;
}

.empty__title[b-s767fluvh8] {
    margin: 0;
    font-size: 1.0625rem;
    font-weight: 600;
    color: var(--color-text);
}

.empty__desc[b-s767fluvh8] {
    margin: var(--space-2) 0 0;
    font-size: var(--text-sm);
    color: var(--color-text-muted);
    max-width: 44ch;
}

.empty__actions[b-s767fluvh8] {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: var(--space-2);
    margin-top: var(--space-5);
}
/* /Components/Ui/FormField.razor.rz.scp.css */
.field[b-eb6x65of9c] { margin-bottom: var(--space-5); }

.field__label[b-eb6x65of9c] {
    display: flex;
    align-items: baseline;
    gap: var(--space-2);
    margin-bottom: var(--space-2);
    font-size: var(--text-sm);
    font-weight: 550;
    color: var(--color-text);
}

.field__optional[b-eb6x65of9c] {
    font-size: var(--text-xs);
    font-weight: 500;
    color: var(--color-text-subtle);
}

.field__hint[b-eb6x65of9c] {
    margin: 0 0 var(--space-2);
    font-size: var(--text-sm);
    color: var(--color-text-muted);
}

/* Styles the control the caller passes in (InputText, InputDate, select…). */
.field__control[b-eb6x65of9c]  input,
.field__control[b-eb6x65of9c]  select,
.field__control[b-eb6x65of9c]  textarea {
    display: block;
    width: 100%;
    padding: 0.625rem var(--space-3);
    font-family: inherit;
    font-size: 0.9375rem;
    line-height: 1.5;
    color: var(--color-text);
    background-color: var(--color-surface);
    border: 1px solid var(--color-border-strong);
    border-radius: var(--radius-md);
    transition: border-color var(--dur-fast) var(--ease-out),
                box-shadow var(--dur-fast) var(--ease-out);
}

/* Selects carried the operating system's own dropdown arrow, so on a filter row a native
   Windows chevron sat inches from carefully styled text inputs and the two read as belonging to
   different products. Same Lucide chevron the rest of the app uses, inlined as a data URI so it
   costs no request, with room reserved on the right so a long option never runs under it. */
.field__control[b-eb6x65of9c]  select {
    appearance: none;
    padding-right: var(--space-8);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235d6b81' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right var(--space-3) center;
    background-size: 1.125rem 1.125rem;
}

/* Forced-colours mode replaces backgrounds, which would drop the arrow entirely — hand the
   native control back rather than leave a select with no affordance. */
@media (forced-colors: active) {
    .field__control[b-eb6x65of9c]  select {
        appearance: auto;
        padding-right: var(--space-3);
        background-image: none;
    }
}

.field__control[b-eb6x65of9c]  input::placeholder,
.field__control[b-eb6x65of9c]  textarea::placeholder { color: var(--color-text-subtle); }

.field__control[b-eb6x65of9c]  input:hover:not(:disabled),
.field__control[b-eb6x65of9c]  select:hover:not(:disabled) { border-color: #b6c2d2; }

.field__control[b-eb6x65of9c]  input:focus,
.field__control[b-eb6x65of9c]  select:focus,
.field__control[b-eb6x65of9c]  textarea:focus {
    outline: none;
    border-color: var(--color-primary);
    box-shadow: var(--shadow-focus);
}

.field__control[b-eb6x65of9c]  input:disabled,
.field__control[b-eb6x65of9c]  select:disabled {
    background-color: var(--color-surface-sunken);
    color: var(--color-text-subtle);
    cursor: not-allowed;
}

/* Blazor adds .invalid on failed validation. */
.field__control[b-eb6x65of9c]  input.invalid,
.field__control[b-eb6x65of9c]  select.invalid,
.field.is-invalid .field__control[b-eb6x65of9c]  input {
    border-color: var(--color-danger);
}

.field__control[b-eb6x65of9c]  input.invalid:focus,
.field.is-invalid .field__control[b-eb6x65of9c]  input:focus {
    box-shadow: 0 0 0 3px rgb(185 28 28 / 20%);
}

.field__error[b-eb6x65of9c] {
    margin-top: var(--space-2);
    font-size: var(--text-sm);
    color: var(--color-danger);
}

.field__error[b-eb6x65of9c]  .validation-message { color: var(--color-danger); }
/* /Components/Ui/FormPanel.razor.rz.scp.css */
.fp[b-po60fd2noh] {
    width: 100%;
    margin-inline: auto;
}

.fp--sm[b-po60fd2noh] { max-width: 26rem; }
.fp--md[b-po60fd2noh] { max-width: 32rem; }
.fp--lg[b-po60fd2noh] { max-width: 44rem; }

.fp__head[b-po60fd2noh] { margin-bottom: var(--space-5); text-align: center; }

.fp__title[b-po60fd2noh] {
    margin: 0;
    font-size: var(--text-h1);
    font-weight: 650;
    letter-spacing: -0.02em;
    color: var(--color-text);
}

.fp__lede[b-po60fd2noh] {
    margin: var(--space-2) auto 0;
    max-width: 46ch;
    font-size: 0.9375rem;
    color: var(--color-text-muted);
}

.fp__surface[b-po60fd2noh] {
    padding: var(--space-6);
    background-color: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-md);
}

.fp__surface[b-po60fd2noh]  > :last-child { margin-bottom: 0; }

.fp__foot[b-po60fd2noh] {
    margin-top: var(--space-5);
    text-align: center;
    font-size: var(--text-sm);
    color: var(--color-text-muted);
}

.fp__foot[b-po60fd2noh]  p { margin-bottom: var(--space-2); }
.fp__foot[b-po60fd2noh]  > :last-child { margin-bottom: 0; }

@media (max-width: 575.98px) {
    .fp__surface[b-po60fd2noh] {
        padding: var(--space-5) var(--space-4);
        border-radius: var(--radius-md);
    }
}
/* /Components/Ui/MatchChip.razor.rz.scp.css */
/* These spans are this component's own markup, so they carry its scope and need no ::deep. The chip
   surface around them belongs to StatusChip and is styled there. */

.match__label[b-4fkj59juk7] {
    font-weight: 550;
}

/* The tick, cross or dash. Sits just after the label with a hair of space, at a slightly larger size
   so it reads as a verdict rather than as punctuation.
   Carries the state a second way on purpose: the chip's tone already says matched / did not match /
   nothing to compare, and colour must not be the only thing saying it. */
.match__mark[b-4fkj59juk7] {
    margin-left: 0.3em;
    font-size: 1.05em;
    line-height: 1;
}
/* /Components/Ui/Modal.razor.rz.scp.css */
.modal-scrim[b-8x01a01nyq] {
    position: fixed;
    inset: 0;
    z-index: 1050;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: var(--space-4);
    background-color: rgb(15 23 42 / 45%);
    backdrop-filter: blur(3px);
    animation: modal-fade-b-8x01a01nyq var(--dur-base) var(--ease-out);
}

.modal[b-8x01a01nyq] {
    display: flex;
    flex-direction: column;
    width: 100%;
    max-height: calc(100vh - 2rem);
    background-color: var(--color-surface);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-lg);
    overflow: hidden;
    animation: modal-rise-b-8x01a01nyq var(--dur-base) var(--ease-out);
}

/* Zero-size focus sentinels used to wrap Tab focus inside the dialog. */
.modal__guard[b-8x01a01nyq] {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    pointer-events: none;
}

.modal:focus[b-8x01a01nyq] { outline: none; }

.modal--sm[b-8x01a01nyq] { max-width: 24rem; }
.modal--md[b-8x01a01nyq] { max-width: 34rem; }
.modal--lg[b-8x01a01nyq] { max-width: 48rem; }

.modal__head[b-8x01a01nyq] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--space-4);
    padding: var(--space-5) var(--space-5) var(--space-4);
    border-bottom: 1px solid var(--color-border);
}

.modal__title[b-8x01a01nyq] {
    margin: 0;
    font-size: 1.0625rem;
    font-weight: 600;
    letter-spacing: -0.01em;
}

.modal__close[b-8x01a01nyq] {
    display: grid;
    place-items: center;
    width: 2rem;
    height: 2rem;
    flex: 0 0 auto;
    border: 0;
    border-radius: var(--radius-md);
    background: transparent;
    color: var(--color-text-subtle);
    font-size: 0.875rem;
    cursor: pointer;
    transition: background-color var(--dur-fast) var(--ease-out),
                color var(--dur-fast) var(--ease-out);
}

.modal__close:hover[b-8x01a01nyq] { background-color: var(--color-hover); color: var(--color-text); }
.modal__close:focus-visible[b-8x01a01nyq] { outline: 2px solid var(--color-focus); outline-offset: 2px; }

.modal__body[b-8x01a01nyq] { padding: var(--space-5); overflow-y: auto; }
.modal__body[b-8x01a01nyq]  > :last-child { margin-bottom: 0; }

.modal__foot[b-8x01a01nyq] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-2);
    padding: var(--space-4) var(--space-5);
    background-color: var(--color-surface-sunken);
    border-top: 1px solid var(--color-border);
}

@keyframes modal-fade-b-8x01a01nyq { from { opacity: 0; } }
@keyframes modal-rise-b-8x01a01nyq { from { opacity: 0; transform: translateY(8px) scale(0.99); } }

@media (prefers-reduced-motion: reduce) {
    .modal-scrim[b-8x01a01nyq], .modal[b-8x01a01nyq] { animation: none; }
}

@media (max-width: 575.98px) {
    .modal__foot[b-8x01a01nyq] { flex-direction: column-reverse; }
    .modal__foot[b-8x01a01nyq]  .btn { width: 100%; }
}
/* /Components/Ui/OutcomePanel.razor.rz.scp.css */
.oc[b-erhku5g6vy] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.oc__mark[b-erhku5g6vy] {
    display: grid;
    place-items: center;
    width: 3.5rem;
    height: 3.5rem;
    margin-bottom: var(--space-5);
    border: 1px solid transparent;
    border-radius: var(--radius-full);
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1;
    animation: oc-pop-b-erhku5g6vy 420ms var(--ease-out);
}

/* Flat tints rather than gradients. A registration or reset outcome is a moment of
   reassurance, and a graduated blob reads as decoration; the mark's job is to confirm, calmly.
   The info variant faded into #e6f0ff, a blue from the abandoned palette, which put an
   off-brand hue on the confirmation screens customers see at the end of every journey. */
.oc__mark--success[b-erhku5g6vy] { background-color: var(--color-success-bg); border-color: #bbf7d0; color: var(--color-success); }
.oc__mark--danger[b-erhku5g6vy]  { background-color: var(--color-danger-bg);  border-color: #fecaca; color: var(--color-danger); }
.oc__mark--warning[b-erhku5g6vy] { background-color: var(--color-warning-bg); border-color: #fde68a; color: var(--color-warning); }
.oc__mark--info[b-erhku5g6vy]    { background-color: var(--color-primary-soft); border-color: var(--bloom-teal-200); color: var(--color-primary); }

.oc__title[b-erhku5g6vy] {
    margin: 0 0 var(--space-3);
    font-size: var(--text-h1);
    font-weight: 650;
    letter-spacing: -0.02em;
    color: var(--color-text);
}

.oc__text[b-erhku5g6vy] {
    margin: 0;
    max-width: 46ch;
    font-size: 0.9375rem;
    line-height: 1.6;
    color: var(--color-text-muted);
}

.oc__actions[b-erhku5g6vy] {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: var(--space-2);
    margin-top: var(--space-6);
}

@keyframes oc-pop-b-erhku5g6vy { from { opacity: 0; transform: scale(0.86); } }

@media (prefers-reduced-motion: reduce) {
    .oc__mark[b-erhku5g6vy] { animation: none; }
}

@media (max-width: 575.98px) {
    .oc__actions[b-erhku5g6vy] { width: 100%; flex-direction: column-reverse; }
    .oc__actions[b-erhku5g6vy]  .btn { width: 100%; }
}
/* /Components/Ui/PageHeader.razor.rz.scp.css */
.ph[b-3z8bzbyubi] { margin-bottom: var(--space-6); }

.ph__crumbs[b-3z8bzbyubi] { margin-bottom: var(--space-3); }

.ph__row[b-3z8bzbyubi] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--space-4);
    flex-wrap: wrap;
}

.ph__text[b-3z8bzbyubi] { min-width: 0; flex: 1 1 24rem; }

.ph__eyebrow[b-3z8bzbyubi] {
    margin: 0 0 var(--space-2);
    font-size: var(--text-xs);
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--color-primary);
}

.ph__title[b-3z8bzbyubi] {
    margin: 0;
    font-size: var(--text-h1);
    font-weight: 650;
    line-height: 1.15;
    letter-spacing: -0.02em;
    color: var(--color-text);
}

.ph__lede[b-3z8bzbyubi] {
    margin: var(--space-2) 0 0;
    font-size: 1.0625rem;
    line-height: 1.55;
    color: var(--color-text-muted);
    max-width: 68ch;
}

.ph__actions[b-3z8bzbyubi] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    flex: 0 0 auto;
}

@media (max-width: 575.98px) {
    .ph__actions[b-3z8bzbyubi] { width: 100%; }
    .ph__actions[b-3z8bzbyubi]  .btn { flex: 1; }
}
/* /Components/Ui/ProgressBar.razor.rz.scp.css */
.pb__head[b-1hqo8ibibx] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--space-3);
    margin-bottom: var(--space-2);
}

.pb__label[b-1hqo8ibibx] {
    font-size: var(--text-sm);
    font-weight: 550;
    color: var(--color-text);
}

.pb__count[b-1hqo8ibibx] {
    font-size: var(--text-xs);
    font-weight: 600;
    color: var(--color-text-muted);
    font-variant-numeric: tabular-nums;
}

.pb__track[b-1hqo8ibibx] {
    height: 0.5rem;
    border-radius: var(--radius-full);
    background-color: var(--color-surface-sunken);
    overflow: hidden;
}

.pb__fill[b-1hqo8ibibx] {
    display: block;
    height: 100%;
    border-radius: var(--radius-full);
    transition: width var(--dur-base) var(--ease-out);
}

/* Flat, single-token fills. The success and warning variants graduated from #22c55e and
   #f59e0b — raw hues belonging to no Bloom token, so a FICA progress bar introduced two
   colours the palette does not contain. A progress indicator also has no reason to change
   colour along its own length. */
.pb__fill--brand[b-1hqo8ibibx]   { background-color: var(--color-primary); }
.pb__fill--success[b-1hqo8ibibx] { background-color: var(--color-success); }
.pb__fill--warning[b-1hqo8ibibx] { background-color: var(--color-warning); }

@media (prefers-reduced-motion: reduce) {
    .pb__fill[b-1hqo8ibibx] { transition: none; }
}
/* /Components/Ui/SectionHeader.razor.rz.scp.css */
.sh[b-np61yp6xvw] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--space-4);
    flex-wrap: wrap;
    margin-bottom: var(--space-4);
}

.sh__text[b-np61yp6xvw] { min-width: 0; }

.sh__title[b-np61yp6xvw] {
    margin: 0;
    font-size: var(--text-h3);
    font-weight: 600;
    letter-spacing: -0.01em;
    color: var(--color-text);
}

.sh__desc[b-np61yp6xvw] {
    margin: var(--space-1) 0 0;
    font-size: var(--text-sm);
    color: var(--color-text-muted);
    max-width: 72ch;
}

.sh__actions[b-np61yp6xvw] { display: flex; align-items: center; gap: var(--space-2); flex: 0 0 auto; }
/* /Components/Ui/Skeleton.razor.rz.scp.css */
.sk-stack[b-j0mx2ihswk] { display: flex; flex-direction: column; gap: var(--space-3); }

.sk[b-j0mx2ihswk] {
    display: block;
    background: linear-gradient(
        90deg,
        var(--color-surface-sunken) 25%,
        #e9eff7 37%,
        var(--color-surface-sunken) 63%);
    background-size: 400% 100%;
    border-radius: var(--radius-sm);
    animation: sk-shimmer-b-j0mx2ihswk 1.4s ease-in-out infinite;
}

.sk--text[b-j0mx2ihswk]   { height: 0.875rem; width: 100%; }
.sk--last[b-j0mx2ihswk]   { width: 62%; }   /* shortened final line reads as a paragraph */
.sk--title[b-j0mx2ihswk]  { height: 1.5rem; width: 45%; border-radius: var(--radius-md); }
.sk--block[b-j0mx2ihswk]  { height: 8rem; width: 100%; border-radius: var(--radius-lg); }
.sk--circle[b-j0mx2ihswk] { height: 2.5rem; width: 2.5rem; border-radius: var(--radius-full); }

@keyframes sk-shimmer-b-j0mx2ihswk {
    0% { background-position: 100% 50%; }
    100% { background-position: 0 50%; }
}

@media (prefers-reduced-motion: reduce) {
    .sk[b-j0mx2ihswk] { animation: none; background: var(--color-surface-sunken); }
}
/* /Components/Ui/StatCard.razor.rz.scp.css */
/* A figure cell inside .statband (see app.css). No surface, border, radius or shadow of its
   own — the band owns those, so a row of figures reads as one summary panel. */

.stat[b-zhvlgxa20y] {
    display: block;
    height: 100%;
    padding: var(--space-5);
    background-color: var(--color-surface);
    text-decoration: none;
}

.stat--link[b-zhvlgxa20y] { transition: background-color var(--dur-fast) var(--ease-out); }

/* The whole cell is the target, so it lifts on hover rather than moving — a summary band
   should not shuffle under the cursor. */
.stat--link:hover[b-zhvlgxa20y] { background-color: var(--color-hover); }
.stat--link:focus-visible[b-zhvlgxa20y] { outline: 2px solid var(--color-focus); outline-offset: -2px; }

.stat__dl[b-zhvlgxa20y] { margin: 0; min-width: 0; }

.stat__label[b-zhvlgxa20y] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--text-xs);
    font-weight: 600;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: var(--color-text-muted);
}

/* Small, quiet mark sitting with the label it belongs to, rather than a 40px tinted tile
   floating opposite the number and outweighing it. */
.stat__mark[b-zhvlgxa20y] {
    display: inline-grid;
    place-items: center;
    flex: 0 0 auto;
    font-size: 0.9375rem;
    line-height: 1;
}

.stat__mark--mono[b-zhvlgxa20y]    { color: var(--color-text-subtle); }
.stat__mark--warning[b-zhvlgxa20y] { color: var(--color-warning); }
.stat__mark--danger[b-zhvlgxa20y]  { color: var(--color-danger); }

/* The figure is the point of the cell, so it gets the scale. Tabular figures keep columns of
   numbers aligned down the band; the negative tracking stops large digits looking gappy. */
.stat__value[b-zhvlgxa20y] {
    margin: var(--space-3) 0 0;
    font-size: clamp(1.875rem, 1.6rem + 0.8vw, 2.375rem);
    font-weight: 600;
    line-height: 1.05;
    letter-spacing: -0.03em;
    color: var(--color-text);
    font-variant-numeric: tabular-nums;
    font-feature-settings: "tnum" 1;
}

.stat__hint[b-zhvlgxa20y] {
    margin: var(--space-2) 0 0;
    font-size: var(--text-sm);
    line-height: 1.5;
    color: var(--color-text-subtle);
}

@media (prefers-reduced-motion: reduce) {
    .stat--link[b-zhvlgxa20y] { transition: none; }
}
/* /Components/Ui/StatusChip.razor.rz.scp.css */
.chip[b-nkus4dxkez] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: 0.25rem var(--space-3);
    border: 1px solid transparent;
    border-radius: var(--radius-full);
    font-size: var(--text-xs);
    font-weight: 600;
    letter-spacing: 0.01em;
    line-height: 1.5;
    white-space: nowrap;
}

.chip__dot[b-nkus4dxkez] {
    width: 0.4375rem;
    height: 0.4375rem;
    flex: 0 0 auto;
    border-radius: var(--radius-full);
    background-color: currentColor;
}

/* Tinted (default) — all pairs verified >=4.5:1 */
.chip--neutral[b-nkus4dxkez] { background-color: var(--color-surface-sunken); border-color: var(--color-border); color: var(--color-text-muted); }
.chip--info[b-nkus4dxkez]    { background-color: var(--color-info-bg);    border-color: #bae6fd; color: var(--color-info); }
.chip--success[b-nkus4dxkez] { background-color: var(--color-success-bg); border-color: #bbf7d0; color: var(--color-success); }
.chip--warning[b-nkus4dxkez] { background-color: var(--color-warning-bg); border-color: #fde68a; color: var(--color-warning); }
.chip--danger[b-nkus4dxkez]  { background-color: var(--color-danger-bg);  border-color: #fecaca; color: var(--color-danger); }
.chip--brand[b-nkus4dxkez]   { background-color: var(--color-primary-soft); border-color: var(--bloom-teal-200); color: var(--color-primary-active); }

/* Solid */
.chip--solid[b-nkus4dxkez] { color: #fff; border-color: transparent; }
.chip--solid.chip--neutral[b-nkus4dxkez] { background-color: var(--color-text-muted); }
.chip--solid.chip--info[b-nkus4dxkez]    { background-color: var(--color-info); }
.chip--solid.chip--success[b-nkus4dxkez] { background-color: var(--color-success); }
.chip--solid.chip--warning[b-nkus4dxkez] { background-color: var(--color-warning); }
.chip--solid.chip--danger[b-nkus4dxkez]  { background-color: var(--color-danger); }
.chip--solid.chip--brand[b-nkus4dxkez]   { background-color: var(--color-primary); }
/* /Components/Ui/StepIndicator.razor.rz.scp.css */
.steps[b-ss92qh7k0f] { margin-bottom: var(--space-6); }

.steps__list[b-ss92qh7k0f] {
    display: flex;
    align-items: flex-start;
    gap: var(--space-2);
    margin: 0;
    padding: 0;
    list-style: none;
}

.steps__item[b-ss92qh7k0f] {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    flex: 1;
    min-width: 0;
    position: relative;
}

/* Connector between markers */
.steps__item:not(:last-child)[b-ss92qh7k0f]::after {
    content: "";
    position: absolute;
    left: 2.25rem;
    right: -0.5rem;
    top: 0.875rem;
    height: 2px;
    border-radius: 2px;
    background-color: var(--color-border);
}

.steps__item--done[b-ss92qh7k0f]::after { background-color: var(--color-primary); }

.steps__marker[b-ss92qh7k0f] {
    display: grid;
    place-items: center;
    width: 1.75rem;
    height: 1.75rem;
    flex: 0 0 auto;
    z-index: 1;
    border-radius: var(--radius-full);
    border: 2px solid var(--color-border);
    background-color: var(--color-surface);
    color: var(--color-text-subtle);
    font-size: var(--text-xs);
    font-weight: 700;
    line-height: 1;
    transition: background-color var(--dur-base) var(--ease-out),
                border-color var(--dur-base) var(--ease-out),
                color var(--dur-base) var(--ease-out);
}

.steps__item--done .steps__marker[b-ss92qh7k0f] {
    background-color: var(--color-primary);
    border-color: var(--color-primary);
    color: #fff;
}

.steps__item--current .steps__marker[b-ss92qh7k0f] {
    background-color: var(--color-surface);
    border-color: var(--color-primary);
    color: var(--color-primary);
    box-shadow: 0 0 0 4px rgb(58 113 137 / 12%);
}

.steps__label[b-ss92qh7k0f] { display: flex; flex-direction: column; min-width: 0; }

.steps__count[b-ss92qh7k0f] {
    font-size: var(--text-xs);
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--color-text-subtle);
}

.steps__name[b-ss92qh7k0f] {
    font-size: var(--text-sm);
    font-weight: 550;
    color: var(--color-text-muted);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.steps__item--current .steps__name[b-ss92qh7k0f] { color: var(--color-text); font-weight: 600; }

/* On small screens only the active step keeps its label. */
@media (max-width: 639.98px) {
    .steps__count[b-ss92qh7k0f] { display: none; }
    .steps__item:not(.steps__item--current) .steps__label[b-ss92qh7k0f] { display: none; }
    .steps__item:not(.steps__item--current)[b-ss92qh7k0f] { flex: 0 0 auto; }
    .steps__item:not(:last-child)[b-ss92qh7k0f]::after { left: 1.5rem; right: -0.25rem; }
}
/* /Components/Ui/ValidationPanel.razor.rz.scp.css */
.vp[b-cqfc0a4pkf] {
    display: flex;
    align-items: flex-start;
    gap: var(--space-3);
    padding: var(--space-4);
    margin-bottom: var(--space-5);
    background-color: var(--color-danger-bg);
    border: 1px solid #fecaca;
    border-left: 3px solid var(--color-danger);
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    color: var(--color-danger);
}

.vp__glyph[b-cqfc0a4pkf] {
    display: grid;
    place-items: center;
    width: 1.25rem;
    height: 1.25rem;
    flex: 0 0 auto;
    margin-top: 1px;
    border-radius: var(--radius-full);
    background-color: var(--color-danger);
    color: #fff;
    font-size: 0.75rem;
    font-weight: 700;
    line-height: 1;
}

.vp__body[b-cqfc0a4pkf] { min-width: 0; flex: 1; }

.vp__title[b-cqfc0a4pkf] { margin: 0; font-weight: 600; }

.vp__single[b-cqfc0a4pkf] { margin: var(--space-1) 0 0; }

.vp__list[b-cqfc0a4pkf] { margin: var(--space-2) 0 0; padding-left: var(--space-5); }

.vp__list li + li[b-cqfc0a4pkf] { margin-top: var(--space-1); }