@import '_content/PayRail.Ui/PayRail.Ui.s9rcww9qst.bundle.scp.css';

/* /Components/Layout/PhoneShell.razor.rz.scp.css */
/* The virtual handset.

   Desktop: a centred phone-shaped frame on a dark ground, so the app reads as a
   phone app rather than a very narrow website.
   Phone: the frame, status bar and home indicator all vanish and the app fills the
   viewport - the real device draws all three already.

   The device dimensions below are local custom properties, not design tokens. They
   are shell geometry in the same sense as PortalLayout's --sidebar-w, not steps on
   the spacing scale. Every colour, radius and shadow resolves to a token. */

.stage[b-9qphnm5tci] {
    --device-w: 390px;
    --device-h: 844px;
    --bezel: 12px;

    min-height: 100vh;
    min-height: 100dvh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: var(--space-6) var(--space-4);
    background: var(--bg-inverse);
}

.device[b-9qphnm5tci] {
    position: relative;
    display: flex;
    flex-direction: column;
    width: var(--device-w);
    height: var(--device-h);
    max-height: calc(100dvh - var(--space-8));
    background: var(--bg-page);
    border: var(--bezel) solid var(--clay-900);
    border-radius: 44px;
    box-shadow: var(--shadow-lg);
    overflow: hidden;
}

/* --- Simulated status bar (desktop only) --- */

.device__statusbar[b-9qphnm5tci] {
    flex: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--space-2) var(--space-5) var(--space-1);
    background: var(--bg-page);
    color: var(--text-primary);
    font-family: var(--font-body);
    font-size: var(--text-xs);
    font-weight: var(--weight-semibold);
    font-variant-numeric: tabular-nums;
}

.device__indicators[b-9qphnm5tci] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

.device__signal[b-9qphnm5tci],
.device__battery[b-9qphnm5tci] {
    height: 10px;
    fill: var(--text-primary);
}

.device__signal[b-9qphnm5tci] { width: 15px; }

.device__battery[b-9qphnm5tci] {
    width: 22px;
    fill: none;
    stroke: var(--text-primary);
    stroke-width: 1;
}

.device__battery-fill[b-9qphnm5tci] {
    fill: var(--text-primary);
    stroke: none;
}

/* --- Screen --- */

.device__screen[b-9qphnm5tci] {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-height: 0;
}

.screen[b-9qphnm5tci] {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    /* Keeps a rubber-band scroll inside the handset instead of bouncing the page
       behind it - and on a real phone, inside the app instead of the browser. */
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    padding: var(--space-4) var(--space-4) var(--space-6);
}

/* --- Bottom tab bar --- */

.tabbar[b-9qphnm5tci] {
    flex: none;
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: 1fr;
    border-top: 1px solid var(--border-subtle);
    background: var(--bg-surface-raised);
}

.tabbar__item[b-9qphnm5tci] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2px;
    /* 56px keeps every target comfortably past the 44px minimum for a thumb. */
    min-height: 56px;
    padding: var(--space-2) var(--space-1);
    color: var(--text-tertiary);
    font-family: var(--font-body);
    font-size: 11px;
    font-weight: var(--weight-medium);
    text-decoration: none;
    transition: color var(--duration-fast) var(--ease-standard);
}

.tabbar__item:hover[b-9qphnm5tci] { color: var(--text-secondary); }

.tabbar__item--active[b-9qphnm5tci] { color: var(--brand-primary); }

.device__home[b-9qphnm5tci] {
    flex: none;
    height: 18px;
    background: var(--bg-page);
    position: relative;
}

.device__home[b-9qphnm5tci]::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 7px;
    transform: translateX(-50%);
    width: 120px;
    height: 4px;
    border-radius: var(--radius-pill);
    background: var(--clay-900);
    opacity: 0.5;
}

/* --- Real handsets: drop the simulation entirely ---

   Below this width we are almost certainly on the device the frame was imitating,
   and a fake status bar under the real one looks broken. */

@media (max-width: 699px) {
    .stage[b-9qphnm5tci] {
        min-height: 100dvh;
        padding: 0;
        background: var(--bg-page);
        display: block;
    }

    .device[b-9qphnm5tci] {
        width: 100%;
        height: 100dvh;
        max-height: none;
        border: 0;
        border-radius: 0;
        box-shadow: none;
    }

    .device__statusbar[b-9qphnm5tci],
    .device__home[b-9qphnm5tci] {
        display: none;
    }

    .screen[b-9qphnm5tci] {
        /* Clears the home indicator on handsets that overlay it. */
        padding-bottom: calc(var(--space-6) + env(safe-area-inset-bottom));
    }

    .tabbar[b-9qphnm5tci] {
        padding-bottom: env(safe-area-inset-bottom);
    }
}

@media (prefers-reduced-motion: reduce) {
    .tabbar__item[b-9qphnm5tci] { transition: none; }
}
/* /Components/Layout/PlainShell.razor.rz.scp.css */
.plain[b-n06jc20oib] {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    min-height: 100dvh;
    background: var(--bg-page);
}

.plain__bar[b-n06jc20oib] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-4);
    padding: var(--space-3) var(--space-5);
    background: var(--surface-inverse);
    color: var(--text-on-inverse);
}

.plain__role[b-n06jc20oib] {
    font-size: var(--text-xs);
    font-weight: var(--weight-semibold);
    letter-spacing: var(--tracking-wider);
    text-transform: uppercase;
    color: var(--olive-300);
}

.plain__body[b-n06jc20oib] {
    flex: 1;
    width: 100%;
    max-width: 640px;
    margin: 0 auto;
    padding: var(--space-7) var(--space-5);
}

.plain__foot[b-n06jc20oib] {
    padding: var(--space-4) var(--space-5);
    border-top: 1px solid var(--border-subtle);
    font-size: var(--text-xs);
    text-align: center;
    color: var(--text-tertiary);
}

@media (max-width: 699px) {
    .plain__body[b-n06jc20oib] {
        padding: var(--space-5) var(--space-4);
    }
}
/* /Components/Pages/Certificate.razor.rz.scp.css */
/* The certificate itself. Deliberately the most document-like surface in the app:
   a dark header band, a serif figure and a rule-ruled fact list, so it reads as
   something issued rather than something rendered. */

.card[b-objtipf7tv] {
    border: 1px solid var(--border-strong);
    border-radius: var(--radius-lg);
    overflow: hidden;
    box-shadow: var(--shadow-md);
}

.card__head[b-objtipf7tv] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
    padding: var(--space-3) var(--space-4);
    background: var(--surface-inverse);
    color: var(--text-on-inverse);
}

.card__kind[b-objtipf7tv] {
    font-size: var(--text-xs);
    font-weight: var(--weight-semibold);
    letter-spacing: var(--tracking-wider);
    text-transform: uppercase;
    color: var(--gold-400);
}

.card__body[b-objtipf7tv] {
    padding: var(--space-5) var(--space-4);
    background: var(--paper-0);
    text-align: center;
}

.card__amount[b-objtipf7tv] {
    font-family: var(--font-display);
    font-size: var(--text-3xl);
    font-weight: var(--weight-display);
    line-height: var(--leading-tight);
    color: var(--text-primary);
}

.card__per[b-objtipf7tv] {
    margin-top: var(--space-1);
    font-size: var(--text-sm);
    color: var(--text-tertiary);
}

.card__facts[b-objtipf7tv] {
    margin: var(--space-5) 0;
    text-align: left;
    border-top: 1px solid var(--border-subtle);
}

.card__facts > div[b-objtipf7tv] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--space-3);
    padding: var(--space-2) 0;
    border-bottom: 1px solid var(--border-subtle);
}

.card__facts dt[b-objtipf7tv] {
    flex: none;
    font-size: var(--text-xs);
    letter-spacing: var(--tracking-wide);
    text-transform: uppercase;
    color: var(--text-tertiary);
}

.card__facts dd[b-objtipf7tv] {
    margin: 0;
    font-size: var(--text-sm);
    text-align: right;
    color: var(--text-primary);
}

.card__qr[b-objtipf7tv] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-3);
    /* currentColor drives the QR path, so the code inherits the ink colour rather
       than being pinned to a literal. */
    color: var(--text-primary);
}

.card__qr svg[b-objtipf7tv] {
    max-width: 100%;
    height: auto;
}

.card__verify[b-objtipf7tv] {
    font-size: var(--text-xs);
    line-height: var(--leading-relaxed);
    color: var(--text-tertiary);
}

.card__hash[b-objtipf7tv] {
    margin-top: var(--space-4);
    padding-top: var(--space-3);
    border-top: 1px solid var(--border-subtle);
    font-size: var(--text-xs);
    letter-spacing: var(--tracking-wide);
    color: var(--text-tertiary);
}

/* --- Issue form and supporting copy --- */

.intro[b-objtipf7tv],
.held[b-objtipf7tv] {
    font-size: var(--text-sm);
    line-height: var(--leading-relaxed);
    color: var(--text-secondary);
}

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

.field[b-objtipf7tv] {
    margin-bottom: var(--space-4);
}

.field__label[b-objtipf7tv] {
    display: block;
    margin-bottom: var(--space-2);
    font-size: var(--text-xs);
    font-weight: var(--weight-semibold);
    letter-spacing: var(--tracking-wider);
    text-transform: uppercase;
    color: var(--text-secondary);
}

.field__money[b-objtipf7tv] {
    display: flex;
    align-items: stretch;
}

.field__prefix[b-objtipf7tv] {
    display: flex;
    align-items: center;
    padding: 0 var(--space-3);
    background: var(--bg-sunken);
    border: 1px solid var(--border-default);
    border-right: 0;
    border-radius: var(--radius-md) 0 0 var(--radius-md);
    font-family: var(--font-mono);
    font-size: var(--text-sm);
    color: var(--text-tertiary);
}

.field__input[b-objtipf7tv] {
    width: 100%;
    min-height: 48px;
    padding: var(--space-3);
    background: var(--surface-card);
    border: 1px solid var(--border-default);
    border-radius: 0 var(--radius-md) var(--radius-md) 0;
    font-family: var(--font-mono);
    font-size: var(--text-base);
    color: var(--text-primary);
}

.field__input:focus[b-objtipf7tv] {
    border-color: var(--border-focus);
}

.field__hint[b-objtipf7tv] {
    margin-top: var(--space-2);
    font-size: var(--text-xs);
    color: var(--text-tertiary);
}

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

.note[b-objtipf7tv] {
    font-size: var(--text-xs);
    line-height: var(--leading-relaxed);
    color: var(--text-tertiary);
}
/* /Components/Pages/Check.razor.rz.scp.css */
.field + .field[b-w7s4g1nkis] {
    margin-top: var(--space-4);
}

.field[b-w7s4g1nkis] {
    margin-bottom: var(--space-4);
}

.field__label[b-w7s4g1nkis] {
    display: block;
    margin-bottom: var(--space-2);
    font-size: var(--text-xs);
    font-weight: var(--weight-semibold);
    letter-spacing: var(--tracking-wider);
    text-transform: uppercase;
    color: var(--text-secondary);
}

.field__input[b-w7s4g1nkis] {
    width: 100%;
    min-height: 48px;
    padding: var(--space-3);
    background: var(--surface-card);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-md);
    font-size: var(--text-base);
    color: var(--text-primary);
}

.field__input:focus[b-w7s4g1nkis] {
    border-color: var(--border-focus);
}

.field__money[b-w7s4g1nkis] {
    display: flex;
    align-items: stretch;
}

.field__prefix[b-w7s4g1nkis] {
    display: flex;
    align-items: center;
    padding: 0 var(--space-3);
    background: var(--bg-sunken);
    border: 1px solid var(--border-default);
    border-right: 0;
    border-radius: var(--radius-md) 0 0 var(--radius-md);
    font-family: var(--font-mono);
    font-size: var(--text-sm);
    color: var(--text-tertiary);
}

.field__input--money[b-w7s4g1nkis] {
    border-radius: 0 var(--radius-md) var(--radius-md) 0;
    font-family: var(--font-mono);
}

.field__hint[b-w7s4g1nkis] {
    margin-top: var(--space-2);
    font-size: var(--text-xs);
    line-height: var(--leading-relaxed);
    color: var(--text-tertiary);
}

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

.verdict[b-w7s4g1nkis] {
    font-size: var(--text-sm);
    line-height: var(--leading-relaxed);
    color: var(--text-primary);
}

.verdict__hint[b-w7s4g1nkis] {
    margin-top: var(--space-3);
    font-size: var(--text-sm);
    line-height: var(--leading-relaxed);
    color: var(--text-secondary);
}

.verdict + :global(.btn)[b-w7s4g1nkis],
.verdict__hint + :global(.btn)[b-w7s4g1nkis] {
    margin-top: var(--space-4);
}

.disclaimer[b-w7s4g1nkis] {
    font-size: var(--text-xs);
    line-height: var(--leading-relaxed);
    color: var(--text-tertiary);
}
/* /Components/Pages/Deductions.razor.rz.scp.css */
.segments[b-glw7if59f1] {
    display: flex;
    gap: var(--space-1);
    margin-bottom: var(--space-4);
    padding: var(--space-1);
    background: var(--bg-sunken);
    border-radius: var(--radius-md);
}

.segments__item[b-glw7if59f1] {
    flex: 1;
    padding: var(--space-2);
    border-radius: var(--radius-sm);
    font-size: var(--text-sm);
    font-weight: var(--weight-medium);
    text-align: center;
    color: var(--text-secondary);
}

.segments__item--active[b-glw7if59f1] {
    background: var(--surface-card);
    color: var(--text-primary);
    box-shadow: var(--shadow-xs);
}

.ded[b-glw7if59f1] {
    padding: var(--space-4);
    background: var(--surface-card);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-lg);
}

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

.ded__provider[b-glw7if59f1] {
    font-size: var(--text-base);
    font-weight: var(--weight-semibold);
    color: var(--text-primary);
}

.ded__product[b-glw7if59f1] {
    font-size: var(--text-sm);
    color: var(--text-tertiary);
}

.ded__amount[b-glw7if59f1] {
    flex: none;
    font-family: var(--font-mono);
    font-size: var(--text-base);
    font-weight: var(--weight-semibold);
    color: var(--text-primary);
}

.ded__progress[b-glw7if59f1] {
    height: 4px;
    border-radius: var(--radius-pill);
    background: var(--bg-sunken);
    overflow: hidden;
}

.ded__progress-fill[b-glw7if59f1] {
    height: 100%;
    border-radius: var(--radius-pill);
    background: var(--brand-primary);
}

.ded__meta[b-glw7if59f1] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--space-3);
    margin-top: var(--space-2);
    font-size: var(--text-xs);
    color: var(--text-tertiary);
}

.consent[b-glw7if59f1] {
    margin-top: var(--space-2);
    font-size: var(--text-xs);
    line-height: var(--leading-relaxed);
    color: var(--text-tertiary);
}
/* /Components/Pages/History.razor.rz.scp.css */
.segments[b-ym58kvky8w] {
    display: flex;
    gap: var(--space-1);
    margin-bottom: var(--space-4);
    padding: var(--space-1);
    background: var(--bg-sunken);
    border-radius: var(--radius-md);
}

.segments__item[b-ym58kvky8w] {
    flex: 1;
    padding: var(--space-2);
    border-radius: var(--radius-sm);
    font-size: var(--text-sm);
    font-weight: var(--weight-medium);
    text-align: center;
    color: var(--text-secondary);
}

.segments__item--active[b-ym58kvky8w] {
    background: var(--surface-card);
    color: var(--text-primary);
    box-shadow: var(--shadow-xs);
}

.period[b-ym58kvky8w] {
    background: var(--surface-card);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-lg);
    overflow: hidden;
}

.period__head[b-ym58kvky8w] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--space-3);
    padding: var(--space-3) var(--space-4);
    background: var(--bg-sunken);
    border-bottom: 1px solid var(--border-subtle);
}

.period__name[b-ym58kvky8w] {
    font-family: var(--font-body);
    font-size: var(--text-sm);
    font-weight: var(--weight-semibold);
    color: var(--text-primary);
}

.period__total[b-ym58kvky8w] {
    font-family: var(--font-mono);
    font-size: var(--text-sm);
    color: var(--text-secondary);
}

.period__total--pending[b-ym58kvky8w] {
    font-family: var(--font-body);
    font-size: var(--text-xs);
    color: var(--text-tertiary);
}

.entry[b-ym58kvky8w] {
    padding: var(--space-3) var(--space-4);
}

.entry + .entry[b-ym58kvky8w] {
    border-top: 1px solid var(--border-subtle);
}

.entry__top[b-ym58kvky8w] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--space-3);
}

.entry__what[b-ym58kvky8w] {
    font-size: var(--text-sm);
    color: var(--text-primary);
}

.entry__amount[b-ym58kvky8w] {
    flex: none;
    font-family: var(--font-mono);
    font-size: var(--text-sm);
    color: var(--text-primary);
}

.entry__meta[b-ym58kvky8w] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
    margin-top: var(--space-2);
    font-size: var(--text-xs);
    color: var(--text-tertiary);
}

.entry__exception[b-ym58kvky8w] {
    display: flex;
    align-items: flex-start;
    gap: var(--space-2);
    margin-top: var(--space-2);
    padding: var(--space-2) var(--space-3);
    background: var(--warning-100);
    border-radius: var(--radius-sm);
    font-size: var(--text-xs);
    line-height: var(--leading-relaxed);
    color: var(--warning-700);
}

.entry__detail[b-ym58kvky8w] {
    margin-top: var(--space-2);
    font-size: var(--text-xs);
    line-height: var(--leading-relaxed);
    color: var(--text-tertiary);
}
/* /Components/Pages/Home.razor.rz.scp.css */
.summary[b-wfop03tuvh] {
    margin-top: var(--space-4);
    text-align: center;
    font-size: var(--text-sm);
    line-height: var(--leading-relaxed);
    color: var(--text-secondary);
}

.cert-live[b-wfop03tuvh] {
    margin-bottom: var(--space-3);
    font-size: var(--text-sm);
    line-height: var(--leading-relaxed);
    color: var(--text-secondary);
}

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

.points[b-wfop03tuvh] {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

.points li[b-wfop03tuvh] {
    position: relative;
    padding-left: var(--space-5);
    font-size: var(--text-sm);
    line-height: var(--leading-relaxed);
    color: var(--text-secondary);
}

.points li[b-wfop03tuvh]::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.55em;
    width: 6px;
    height: 6px;
    border-radius: var(--radius-circle);
    background: var(--brand-primary);
}

.signout[b-wfop03tuvh] {
    display: flex;
    justify-content: center;
    padding-top: var(--space-2);
}
/* /Components/Pages/Verify.razor.rz.scp.css */
.v[b-z6hi5tvh0a] {
    padding: var(--space-6);
    background: var(--surface-card);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-lg);
}

.v--valid[b-z6hi5tvh0a] { border-top: 3px solid var(--success-600); }
.v--expired[b-z6hi5tvh0a] { border-top: 3px solid var(--warning-600); }
.v--unknown[b-z6hi5tvh0a] { border-top: 3px solid var(--danger-600); }

.v__badge[b-z6hi5tvh0a] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    margin-bottom: var(--space-4);
    padding: var(--space-1) var(--space-3);
    border-radius: var(--radius-pill);
    font-size: var(--text-xs);
    font-weight: var(--weight-semibold);
    letter-spacing: var(--tracking-wide);
    text-transform: uppercase;
}

.v--valid .v__badge[b-z6hi5tvh0a] { background: var(--success-100); color: var(--success-700); }
.v--expired .v__badge[b-z6hi5tvh0a] { background: var(--warning-100); color: var(--warning-700); }
.v--unknown .v__badge[b-z6hi5tvh0a] { background: var(--danger-100); color: var(--danger-700); }

.v__title[b-z6hi5tvh0a] {
    font-family: var(--font-display);
    font-size: var(--text-xl);
    font-weight: var(--weight-display);
    line-height: var(--leading-snug);
    color: var(--text-primary);
}

.v__amount[b-z6hi5tvh0a] {
    margin-top: var(--space-3);
    font-family: var(--font-display);
    font-size: var(--text-4xl);
    font-weight: var(--weight-display);
    line-height: var(--leading-tight);
    color: var(--text-primary);
}

.v__per[b-z6hi5tvh0a] {
    margin-top: var(--space-1);
    font-size: var(--text-sm);
    color: var(--text-tertiary);
}

.v__lede[b-z6hi5tvh0a] {
    margin-top: var(--space-3);
    font-size: var(--text-base);
    line-height: var(--leading-relaxed);
    color: var(--text-secondary);
}

.v__facts[b-z6hi5tvh0a] {
    margin-top: var(--space-6);
    border-top: 1px solid var(--border-subtle);
}

.v__facts > div[b-z6hi5tvh0a] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--space-4);
    padding: var(--space-3) 0;
    border-bottom: 1px solid var(--border-subtle);
}

.v__facts dt[b-z6hi5tvh0a] {
    flex: none;
    font-size: var(--text-xs);
    letter-spacing: var(--tracking-wide);
    text-transform: uppercase;
    color: var(--text-tertiary);
}

.v__facts dd[b-z6hi5tvh0a] {
    margin: 0;
    font-size: var(--text-sm);
    text-align: right;
    color: var(--text-primary);
}

.v__note[b-z6hi5tvh0a] {
    margin-top: var(--space-5);
    padding: var(--space-4);
    background: var(--olive-050);
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    line-height: var(--leading-relaxed);
    color: var(--text-secondary);
}

.v__basis[b-z6hi5tvh0a] {
    margin-top: var(--space-4);
    font-size: var(--text-xs);
    line-height: var(--leading-relaxed);
    color: var(--text-tertiary);
}
/* /Components/Pages/Welcome.razor.rz.scp.css */
.welcome[b-hmoce19qnd] {
    display: flex;
    flex-direction: column;
    gap: var(--space-6);
    padding-top: var(--space-6);
}

.welcome__brand[b-hmoce19qnd] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-2);
    text-align: center;
}

.welcome__strap[b-hmoce19qnd] {
    max-width: 26ch;
    font-family: var(--font-display);
    font-size: var(--text-md);
    font-style: italic;
    color: var(--text-tertiary);
}

.welcome__sent[b-hmoce19qnd] {
    margin-bottom: var(--space-4);
    font-size: var(--text-sm);
    line-height: var(--leading-relaxed);
    color: var(--text-secondary);
}

/* --- Fields --- */

.field__label[b-hmoce19qnd] {
    display: block;
    margin-bottom: var(--space-2);
    font-size: var(--text-xs);
    font-weight: var(--weight-semibold);
    letter-spacing: var(--tracking-wider);
    text-transform: uppercase;
    color: var(--text-secondary);
}

.field__input[b-hmoce19qnd] {
    width: 100%;
    min-height: 48px;
    padding: var(--space-3);
    background: var(--surface-card);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-md);
    font-size: var(--text-base);
    color: var(--text-primary);
}

.field__input:focus[b-hmoce19qnd] {
    border-color: var(--border-focus);
}

.field__input--code[b-hmoce19qnd] {
    text-align: center;
    font-size: var(--text-2xl);
    letter-spacing: var(--tracking-wider);
}

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

.field__hint[b-hmoce19qnd] {
    margin-top: var(--space-2);
    font-size: var(--text-xs);
    color: var(--text-tertiary);
}

/* --- Demo actor picker --- */

.demo[b-hmoce19qnd] {
    margin-top: auto;
    padding-top: var(--space-5);
    border-top: 1px dashed var(--border-default);
}

.demo__label[b-hmoce19qnd] {
    margin-bottom: var(--space-3);
    font-size: var(--text-xs);
    font-weight: var(--weight-semibold);
    letter-spacing: var(--tracking-wider);
    text-transform: uppercase;
    color: var(--text-tertiary);
}

.demo__chips[b-hmoce19qnd] {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.demo__chip[b-hmoce19qnd] {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 0 var(--space-3);
    padding: var(--space-3);
    background: var(--surface-card);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-md);
    color: var(--text-primary);
}

.demo__chip:hover[b-hmoce19qnd] {
    background: var(--surface-card-hover);
    color: var(--text-primary);
}

.demo__name[b-hmoce19qnd] {
    font-size: var(--text-sm);
    font-weight: var(--weight-medium);
}

.demo__number[b-hmoce19qnd] {
    grid-row: 1;
    grid-column: 2;
    font-size: var(--text-xs);
    color: var(--text-tertiary);
}

.demo__note[b-hmoce19qnd] {
    grid-column: 1 / -1;
    font-size: var(--text-xs);
    color: var(--text-tertiary);
}
/* /Components/Ui/Blank.razor.rz.scp.css */
.blank[b-hh33niktbc] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-3);
    padding: var(--space-7) var(--space-4);
    text-align: center;
    color: var(--text-tertiary);
}

.blank__message[b-hh33niktbc] {
    max-width: 34ch;
    font-size: var(--text-sm);
    line-height: var(--leading-relaxed);
}
/* /Components/Ui/CapacityRing.razor.rz.scp.css */
.ring[b-9a55w4lguv] {
    position: relative;
    display: grid;
    place-items: center;
    width: 180px;
    height: 180px;
    margin: 0 auto;
}

.ring__svg[b-9a55w4lguv] {
    width: 100%;
    height: 100%;
    /* Start the arc at 12 o'clock rather than 3. */
    transform: rotate(-90deg);
}

.ring__track[b-9a55w4lguv],
.ring__fill[b-9a55w4lguv] {
    fill: none;
    stroke-width: 10;
}

.ring__track[b-9a55w4lguv] {
    stroke: var(--bg-sunken);
}

.ring__fill[b-9a55w4lguv] {
    transition: stroke-dasharray var(--duration-slow) var(--ease-out);
}

.ring__fill--ok[b-9a55w4lguv] { stroke: var(--success-600); }
.ring__fill--warning[b-9a55w4lguv] { stroke: var(--warning-600); }
.ring__fill--danger[b-9a55w4lguv] { stroke: var(--danger-600); }

.ring__centre[b-9a55w4lguv] {
    position: absolute;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-1);
    text-align: center;
}

.ring__value[b-9a55w4lguv] {
    font-family: var(--font-display);
    font-size: var(--text-4xl);
    font-weight: var(--weight-display);
    line-height: var(--leading-tight);
    color: var(--text-primary);
}

.ring__unit[b-9a55w4lguv] {
    font-size: var(--text-xl);
    color: var(--text-tertiary);
}

.ring__caption[b-9a55w4lguv] {
    max-width: 110px;
    font-size: var(--text-xs);
    color: var(--text-tertiary);
}

@media (prefers-reduced-motion: reduce) {
    .ring__fill[b-9a55w4lguv] { transition: none; }
}
/* /Components/Ui/Meter.razor.rz.scp.css */
.meter + .meter[b-emo1je4eb7] {
    margin-top: var(--space-4);
}

.meter__head[b-emo1je4eb7] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--space-3);
    margin-bottom: var(--space-2);
}

.meter__label[b-emo1je4eb7] {
    font-size: var(--text-sm);
    color: var(--text-secondary);
}

.meter__value[b-emo1je4eb7] {
    font-family: var(--font-mono);
    font-size: var(--text-sm);
    font-weight: var(--weight-semibold);
    color: var(--text-primary);
}

.meter__track[b-emo1je4eb7] {
    height: 8px;
    border-radius: var(--radius-pill);
    background: var(--bg-sunken);
    overflow: hidden;
}

.meter__fill[b-emo1je4eb7] {
    height: 100%;
    border-radius: var(--radius-pill);
    transition: width var(--duration-base) var(--ease-out);
}

.meter__fill--ok[b-emo1je4eb7] { background: var(--success-600); }
.meter__fill--warning[b-emo1je4eb7] { background: var(--warning-600); }
.meter__fill--danger[b-emo1je4eb7] { background: var(--danger-600); }

.meter__note[b-emo1je4eb7] {
    margin-top: var(--space-2);
    font-size: var(--text-sm);
    color: var(--text-tertiary);
}

@media (prefers-reduced-motion: reduce) {
    .meter__fill[b-emo1je4eb7] { transition: none; }
}
/* /Components/Ui/Panel.razor.rz.scp.css */
.panel[b-1ixkp7ia52] {
    background: var(--surface-card);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-lg);
    overflow: hidden;
}

.panel--brand[b-1ixkp7ia52] {
    background: var(--olive-050);
    border-color: var(--olive-200);
}

.panel--success[b-1ixkp7ia52] {
    background: var(--success-100);
    border-color: var(--success-600);
}

.panel--danger[b-1ixkp7ia52] {
    background: var(--danger-100);
    border-color: var(--danger-600);
}

.panel--warning[b-1ixkp7ia52] {
    background: var(--warning-100);
    border-color: var(--warning-600);
}

.panel__head[b-1ixkp7ia52] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    border-bottom: 1px solid var(--border-subtle);
    color: var(--text-secondary);
}

.panel__title[b-1ixkp7ia52] {
    font-family: var(--font-body);
    font-size: var(--text-xs);
    font-weight: var(--weight-semibold);
    letter-spacing: var(--tracking-wider);
    text-transform: uppercase;
    color: var(--text-secondary);
}

.panel__aside[b-1ixkp7ia52] {
    margin-left: auto;
    font-size: var(--text-xs);
    color: var(--text-tertiary);
}

.panel__body[b-1ixkp7ia52] {
    padding: var(--space-4);
}

.panel__body--flush[b-1ixkp7ia52] {
    padding: 0;
}
/* /Components/Ui/Pill.razor.rz.scp.css */
.pill[b-mparobasrz] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: 2px var(--space-2);
    border-radius: var(--radius-pill);
    font-size: var(--text-xs);
    font-weight: var(--weight-medium);
    white-space: nowrap;
}

.pill__dot[b-mparobasrz] {
    width: 6px;
    height: 6px;
    border-radius: var(--radius-circle);
    background: currentColor;
}

.pill--approved[b-mparobasrz] {
    background: var(--success-100);
    color: var(--success-700);
}

.pill--pending[b-mparobasrz] {
    background: var(--warning-100);
    color: var(--warning-700);
}

.pill--rejected[b-mparobasrz] {
    background: var(--danger-100);
    color: var(--danger-700);
}

.pill--flagged[b-mparobasrz] {
    background: var(--gold-100);
    color: var(--gold-800);
}
/* /Components/Ui/ScreenHeader.razor.rz.scp.css */
.screenhead[b-ge1lwzr3xm] {
    margin-bottom: var(--space-4);
}

.screenhead__title[b-ge1lwzr3xm] {
    font-family: var(--font-display);
    font-size: var(--text-2xl);
    font-weight: var(--weight-display);
    line-height: var(--leading-tight);
    letter-spacing: var(--tracking-tight);
    color: var(--text-primary);
}

.screenhead__sub[b-ge1lwzr3xm] {
    margin-top: var(--space-1);
    font-size: var(--text-sm);
    color: var(--text-tertiary);
}
/* /Components/Ui/TouchButton.razor.rz.scp.css */
.btn[b-69s5d4nfq5] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-2);
    width: 100%;
    /* 48px: comfortably above the 44px minimum touch target, and tall enough to
       read as the primary action on the screen. */
    min-height: 48px;
    padding: var(--space-3) var(--space-4);
    border: 1px solid transparent;
    border-radius: var(--radius-md);
    font-family: var(--font-body);
    font-size: var(--text-base);
    font-weight: var(--weight-semibold);
    text-align: center;
    text-decoration: none;
    cursor: pointer;
    transition: background-color var(--duration-fast) var(--ease-standard);
}

.btn--inline[b-69s5d4nfq5] {
    width: auto;
    min-height: 40px;
    padding: var(--space-2) var(--space-4);
    font-size: var(--text-sm);
}

.btn--primary[b-69s5d4nfq5] {
    background: var(--brand-primary);
    border-color: var(--brand-primary);
    color: var(--text-on-brand);
}

.btn--primary:hover[b-69s5d4nfq5] { background: var(--brand-primary-hover); color: var(--text-on-brand); }
.btn--primary:active[b-69s5d4nfq5] { background: var(--brand-primary-active); }

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

.btn--secondary:hover[b-69s5d4nfq5] { background: var(--surface-card-hover); color: var(--text-primary); }

.btn--ghost[b-69s5d4nfq5] {
    background: transparent;
    border-color: transparent;
    color: var(--text-secondary);
}

.btn--ghost:hover[b-69s5d4nfq5] { background: var(--bg-sunken); color: var(--text-primary); }

.btn--danger[b-69s5d4nfq5] {
    background: var(--surface-card);
    border-color: var(--danger-600);
    color: var(--danger-700);
}

.btn--danger:hover[b-69s5d4nfq5] { background: var(--danger-100); color: var(--danger-700); }

.btn--disabled[b-69s5d4nfq5],
.btn:disabled[b-69s5d4nfq5] {
    opacity: 0.45;
    cursor: not-allowed;
}

@media (prefers-reduced-motion: reduce) {
    .btn[b-69s5d4nfq5] { transition: none; }
}