/* /Components/AddPanelDialog.razor.rz.scp.css */
/* Add-panel modal. Dialog chrome follows Components/Projects/ConfirmDialog.razor.css; the body is
   compact-density (C0 D7) because it is a list of lists, not prose. */

.apd[b-9e6igpvgu2] {
    position: fixed;
    inset: 0;
    z-index: 400;
    display: grid;
    place-items: center;
}

.apd__scrim[b-9e6igpvgu2] {
    position: absolute;
    inset: 0;
    background: var(--scrim);
}

.apd__frame[b-9e6igpvgu2] {
    position: relative;
    width: 520px;
    max-width: calc(100vw - 32px);
    max-height: calc(100vh - 64px);
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    background: var(--surface-card);
    box-shadow: var(--shadow-dialog);
    font-family: var(--font-ui);
    font-size: 11px;
    color: var(--text-1);
}

.apd__title[b-9e6igpvgu2] {
    margin: 0;
    padding: 14px 18px;
    border-bottom: 1px solid var(--line);
    font-size: var(--fs-heading);
    font-weight: 600;
}

.apd__scroll[b-9e6igpvgu2] {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    padding: 0 18px;
}

.apd__section[b-9e6igpvgu2] {
    padding: 12px 0;
    border-bottom: 1px solid var(--line);
}

.apd__section--last[b-9e6igpvgu2] {
    border-bottom: none;
}

.apd__heading[b-9e6igpvgu2] {
    display: block;
    margin: 0 0 8px;
    font-size: 9px;
    font-weight: 600;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--text-3);
}

.apd__empty[b-9e6igpvgu2] {
    margin: 0;
    color: var(--text-3);
}

.apd__kinds[b-9e6igpvgu2] {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}

.apd__kind[b-9e6igpvgu2] {
    height: 24px;
    padding: 0 10px;
    border: 1px solid var(--line-strong);
    border-radius: var(--r-pill);
    background: var(--surface-card-2);
    color: var(--text-2);
    font-family: var(--font-ui);
    font-size: 11px;
    cursor: pointer;
    transition: filter var(--dur-fast) var(--ease-standard);
}

.apd__kind:hover[b-9e6igpvgu2] {
    filter: brightness(.94);
}

.apd__kind--on[b-9e6igpvgu2] {
    border-color: var(--accent);
    background: var(--accent);
    color: var(--accent-ink);
    font-weight: 600;
}

.apd__search[b-9e6igpvgu2],
.apd__input[b-9e6igpvgu2] {
    box-sizing: border-box;
    width: 100%;
    height: 24px;
    margin-bottom: 6px;
    padding: 0 8px;
    border: 1px solid var(--line-strong);
    border-radius: var(--r-sm);
    background: var(--surface-card-2);
    color: var(--text-1);
    font-family: var(--font-ui);
    font-size: 11px;
}

.apd__input[b-9e6igpvgu2] {
    margin-bottom: 0;
}

.apd__search:focus-visible[b-9e6igpvgu2],
.apd__input:focus-visible[b-9e6igpvgu2],
.apd__kind:focus-visible[b-9e6igpvgu2],
.apd__option:focus-visible[b-9e6igpvgu2],
.apd__button:focus-visible[b-9e6igpvgu2] {
    outline: none;
    box-shadow: var(--shadow-focus);
}

.apd__list[b-9e6igpvgu2] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    max-height: 150px;
    overflow-y: auto;
}

.apd__option[b-9e6igpvgu2] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    height: 24px;
    padding: 0 8px;
    border: 1px solid transparent;
    border-radius: var(--r-sm);
    background: none;
    color: var(--text-1);
    font-family: var(--font-ui);
    font-size: 11px;
    text-align: left;
    cursor: pointer;
}

.apd__option:hover[b-9e6igpvgu2] {
    background: var(--surface-card-2);
}

.apd__option--on[b-9e6igpvgu2] {
    border-color: var(--accent);
    background: color-mix(in srgb, var(--accent) 18%, transparent);
    font-weight: 600;
}

.apd__option-name[b-9e6igpvgu2] {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.apd__option-note[b-9e6igpvgu2] {
    flex: none;
    font-family: var(--font-mono);
    font-size: 9px;
    color: var(--text-3);
}

.apd__field[b-9e6igpvgu2] {
    display: block;
}

.apd__error[b-9e6igpvgu2] {
    margin: 0 0 12px;
    color: var(--status-err);
}

.apd__footer[b-9e6igpvgu2] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    padding: 12px 18px;
    border-top: 1px solid var(--line);
}

.apd__button[b-9e6igpvgu2] {
    min-height: var(--target-dialog);
    padding: 0 16px;
    border: 1px solid var(--line-strong);
    border-radius: var(--r-md);
    background: var(--surface-card-2);
    color: var(--text-1);
    font-family: var(--font-ui);
    font-size: var(--fs-body);
    cursor: pointer;
}

.apd__button--quiet[b-9e6igpvgu2] {
    background: none;
}

.apd__button--primary[b-9e6igpvgu2] {
    border-color: var(--accent);
    background: var(--accent);
    color: var(--accent-ink);
    font-weight: 600;
}

.apd__button--primary:disabled[b-9e6igpvgu2] {
    border-color: var(--line);
    background: none;
    color: var(--text-3);
    cursor: default;
}
/* /Components/Advisor/AdvisorActionCard.razor.rz.scp.css */
/* Proposed-action card. Sits inside an assistant bubble, so it must read as a distinct object
   without becoming a second surface: one accent edge, the panel's own card tint, compact padding. */

.ac[b-tsy4sfc3v7] {
    margin-top: 8px;
    padding: 8px 10px;
    border: 1px solid var(--advisor-line);
    border-left: 2px solid var(--advisor-accent);
    border-radius: var(--r-sm);
    background: var(--advisor-pane-2);
    display: flex;
    flex-direction: column;
    gap: 4px;
}

/* A deep link changes nothing — it navigates. The muted edge says so before the button is read. */
.ac--link[b-tsy4sfc3v7] {
    border-left-color: var(--advisor-line-strong);
}

/* Invalid or gated off: the card stays legible (the reason is the point) but stops advertising. */
.ac--blocked[b-tsy4sfc3v7] {
    border-left-color: var(--advisor-ink-4);
    background: var(--advisor-pane);
}

.ac__head[b-tsy4sfc3v7] {
    display: flex;
    align-items: baseline;
    gap: 6px;
}

.ac__title[b-tsy4sfc3v7] {
    flex: 1 1 auto;
    min-width: 0;
    font-weight: 600;
    font-size: var(--fs-body);
    color: var(--advisor-ink);
    overflow-wrap: anywhere;
}

.ac__kind[b-tsy4sfc3v7] {
    flex: 0 0 auto;
    font-size: var(--fs-dense);
    color: var(--advisor-ink-3);
    white-space: nowrap;
}

.ac__body[b-tsy4sfc3v7] {
    margin: 0;
    font-size: var(--fs-dense);
    line-height: 1.4;
    color: var(--advisor-ink-2);
    overflow-wrap: anywhere;
}

.ac__reason[b-tsy4sfc3v7] {
    margin: 0;
    font-size: var(--fs-dense);
    line-height: 1.4;
    color: var(--status-warn-ink);
    overflow-wrap: anywhere;
}

.ac__foot[b-tsy4sfc3v7] {
    display: flex;
    gap: 6px;
}

.ac__button[b-tsy4sfc3v7] {
    min-height: var(--target-dialog);
    padding: 0 12px;
    border: 1px solid var(--advisor-accent);
    border-radius: var(--r-sm);
    background: var(--advisor-accent);
    color: var(--advisor-accent-ink);
    font-family: var(--font-ui);
    font-size: var(--fs-dense);
    font-weight: 600;
    cursor: pointer;
    transition: background-color var(--dur-fast) var(--ease-standard);
}

.ac__button--link[b-tsy4sfc3v7] {
    border-color: var(--advisor-line-strong);
    background: var(--advisor-accent-soft);
    color: var(--advisor-accent);
}

.ac__button:hover:not(:disabled)[b-tsy4sfc3v7] {
    background: var(--advisor-accent-fill);
}

.ac__button:focus-visible[b-tsy4sfc3v7] {
    outline: none;
    box-shadow: var(--shadow-focus);
}

.ac__button:disabled[b-tsy4sfc3v7] {
    border-color: var(--advisor-line);
    background: var(--advisor-pane-3);
    color: var(--advisor-ink-4);
    cursor: default;
}

.ac__outcome[b-tsy4sfc3v7] {
    margin: 2px 0 0;
    padding-top: 4px;
    border-top: 1px solid var(--advisor-line);
    font-size: var(--fs-dense);
    line-height: 1.4;
    overflow-wrap: anywhere;
}

/* --status-ok, not --status-ok-ink: the -ink token is the text color FOR a status-ok FILL
   (white in the light theme), so as a bare text color on the advisor pane it was invisible —
   Luna had to highlight the outcome line to read it (2026-09-09). The status color itself is
   legible on the pane in both themes. */
.ac__outcome--done[b-tsy4sfc3v7] {
    color: var(--status-ok);
}

/* A refusal is not an error: the server answered 200 and said why. Muted, not red. */
.ac__outcome--refused[b-tsy4sfc3v7] {
    color: var(--advisor-ink-3);
}
/* /Components/Advisor/AdvisorMessageView.razor.rz.scp.css */
/* One transcript turn. The asymmetry is deliberate — see the component comment. */

.advm[b-km22vd19tl] {
    display: flex;
    flex-direction: column;
    font-size: var(--fs-body);
    color: var(--advisor-ink);
}

.advm--user[b-km22vd19tl] {
    align-items: flex-end;
}

.advm--user .advm__body[b-km22vd19tl] {
    max-width: 88%;
    padding: 6px 9px;
    border: 1px solid var(--advisor-user-edge);
    border-radius: var(--r-md);
    background: var(--advisor-user-tint);
}

.advm--assistant .advm__body[b-km22vd19tl] {
    padding: 0 2px;
}

.advm__body[b-km22vd19tl] {
    min-width: 0;
}

/* While a turn streams, the tail of the text is the live edge — a caret would fight the cumulative
   redraw, so the whole body is very slightly muted instead and settles when the turn completes. */
.advm--streaming .advm__body[b-km22vd19tl] {
    color: var(--advisor-ink-2);
}

.advm__actions[b-km22vd19tl] {
    align-self: stretch;
}

/* ---- pre-first-delta ---------------------------------------------------------------------- */

.advm__thinking[b-km22vd19tl] {
    display: inline-flex;
    gap: 4px;
    padding: 4px 2px;
}

.advm__dot[b-km22vd19tl] {
    width: 5px;
    height: 5px;
    border-radius: var(--r-pill);
    background: var(--advisor-ink-4);
    animation: advm-pulse-b-km22vd19tl 1.1s var(--ease-standard) infinite;
}

.advm__dot:nth-child(2)[b-km22vd19tl] {
    animation-delay: .15s;
}

.advm__dot:nth-child(3)[b-km22vd19tl] {
    animation-delay: .3s;
}

@keyframes advm-pulse-b-km22vd19tl {
    0%, 100% { opacity: .35; }
    50%      { opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
    .advm__dot[b-km22vd19tl] {
        animation: none;
        opacity: .6;
    }
}

/* ---- clarification ------------------------------------------------------------------------ */

.advm__clarify[b-km22vd19tl] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-top: 8px;
}

.advm__clarify-question[b-km22vd19tl] {
    margin: 0;
    font-weight: 600;
    color: var(--advisor-ink);
}

.advm__clarify-options[b-km22vd19tl] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.advm__clarify-chip[b-km22vd19tl] {
    padding: 4px 10px;
    border: 1px solid var(--advisor-user-edge);
    border-radius: var(--r-pill);
    background: var(--advisor-user-tint);
    font-size: var(--fs-body);
    color: var(--advisor-ink);
    cursor: pointer;
}

.advm__clarify-chip:hover:not(:disabled)[b-km22vd19tl] {
    border-color: var(--advisor-ink-4);
}

.advm__clarify-chip:disabled[b-km22vd19tl] {
    opacity: .55;
    cursor: default;
}

/* Methodological caveats (the shared CaveatEngine's advisories) — the D8 caveat tokens,
   the same vocabulary the import/analyze step bodies use for Note/Warning callouts. */
.advm__caveats[b-km22vd19tl] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-top: 8px;
}

.advm__caveat[b-km22vd19tl] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 6px 8px;
    border-radius: 4px;
    border: 1px solid var(--caveat-warn-border);
    border-left: 3px solid var(--caveat-warn-accent);
    background: var(--caveat-warn-fill);
    font-size: 11px;
    color: var(--text-1);
}

.advm__caveat--info[b-km22vd19tl] {
    border-color: var(--caveat-info-border);
    border-left-color: var(--caveat-info-accent);
    background: var(--caveat-info-fill);
}

.advm__caveat-title[b-km22vd19tl] {
    font-weight: 600;
}

.advm__caveat-body[b-km22vd19tl] {
    color: var(--text-2);
}
/* /Components/Advisor/AdvisorPanel.razor.rz.scp.css */
/* The advisor chat — the Advisor TAB of the workspace's side pane (Core SidePaneCatalog), exactly
   where the desktop keeps it. Color comes from the --advisor-* family in the generated palette (the
   desktop advisor's own surface tokens), so the panel reads as the advisor on all nine themes without
   naming one value.

   Fills whatever hosts it: the side pane's tab body (its column owns the width) or /dev/advisor. */
.adv[b-v7wjbdgwvp] {
    flex: 1 1 auto;
    width: 100%;
    min-width: 0;
    min-height: 0;
    display: flex;
    flex-direction: column;
    background: var(--advisor-shell);
    color: var(--advisor-ink);
    font-family: var(--font-ui);
    font-size: var(--fs-body);
    overflow: hidden;
}

/* Wider than the workspace side panes: a chat thread with action cards in --pane-w (328px) wraps
   every second word. Narrows with the shell at the degraded floor. */
/* ---- header ------------------------------------------------------------------------------- */

.adv__header[b-v7wjbdgwvp] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 0 6px 0 10px;
    min-height: var(--titlebar-h);
    border-bottom: 1px solid var(--advisor-line);
    background: var(--advisor-titlebar);
}

.adv__glyph[b-v7wjbdgwvp] {
    display: inline-flex;
    color: var(--advisor-accent);
}

.adv__title[b-v7wjbdgwvp] {
    margin: 0;
    font-size: var(--fs-body);
    font-weight: 600;
    color: var(--advisor-ink);
}

.adv__model[b-v7wjbdgwvp] {
    margin-left: auto;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    min-width: 0;
}

/* The word "Model" is for the screen reader and the wide case; the select carries the meaning. */
.adv__model-label[b-v7wjbdgwvp] {
    font-size: var(--fs-dense);
    color: var(--advisor-ink-3);
}

@media (max-width: 1280px) {
    .adv__model-label[b-v7wjbdgwvp] {
        display: none;
    }
}

.adv__model-select[b-v7wjbdgwvp],
.adv__switcher-select[b-v7wjbdgwvp] {
    max-width: 132px;
    min-height: var(--target-chrome);
    padding: 0 4px;
    border: 1px solid var(--advisor-line-strong);
    border-radius: var(--r-sm);
    background: var(--advisor-pane-2);
    color: var(--advisor-ink);
    font-family: var(--font-ui);
    font-size: var(--fs-dense);
}

.adv__model-select:focus-visible[b-v7wjbdgwvp],
.adv__switcher-select:focus-visible[b-v7wjbdgwvp],
.adv__icon-button:focus-visible[b-v7wjbdgwvp],
.adv__input:focus-visible[b-v7wjbdgwvp],
.adv__send:focus-visible[b-v7wjbdgwvp] {
    outline: none;
    box-shadow: var(--shadow-focus);
}

.adv__conn[b-v7wjbdgwvp] {
    font-size: var(--fs-dense);
    color: var(--advisor-ink-3);
    white-space: nowrap;
}

.adv__conn--connected[b-v7wjbdgwvp] {
    color: var(--status-ok-ink);
}

.adv__conn--offline[b-v7wjbdgwvp] {
    color: var(--advisor-ink-4);
}

.adv__icon-button[b-v7wjbdgwvp] {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: var(--target-chrome);
    height: var(--target-chrome);
    border: 0;
    border-radius: var(--r-sm);
    background: none;
    color: var(--advisor-ink-2);
    cursor: pointer;
    transition: background-color var(--dur-fast) var(--ease-standard);
}

.adv__icon-button:hover:not(:disabled)[b-v7wjbdgwvp] {
    background: var(--advisor-pane-3);
    color: var(--advisor-ink);
}

.adv__icon-button:disabled[b-v7wjbdgwvp] {
    color: var(--advisor-ink-4);
    cursor: default;
}

/* ---- conversation switcher ------------------------------------------------------------------ */

.adv__switcher[b-v7wjbdgwvp] {
    flex: 0 0 auto;
    padding: 6px 10px;
    border-bottom: 1px solid var(--advisor-line);
    background: var(--advisor-pane);
}

.adv__switcher-select[b-v7wjbdgwvp] {
    width: 100%;
    max-width: none;
}

/* ---- thread ---------------------------------------------------------------------------------
   column-reverse on the SCROLLER pins the view to the newest message with no script: the browser
   anchors a reversed scroller at what is visually the bottom, so a growing transcript stays put
   while the user reads back. The thread inside it is an ordinary column, so document order — and
   therefore reading order for assistive technology — is unchanged. */

.adv__scroll[b-v7wjbdgwvp] {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    display: flex;
    flex-direction: column-reverse;
    background: var(--advisor-pane);
}

.adv__thread[b-v7wjbdgwvp] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 10px;
}

.adv__empty[b-v7wjbdgwvp] {
    margin: 0;
    font-size: var(--fs-dense);
    line-height: 1.5;
    color: var(--advisor-ink-3);
}

.adv__tool[b-v7wjbdgwvp] {
    margin: 0;
    font-size: var(--fs-dense);
    font-style: italic;
    color: var(--advisor-ink-3);
}

/* ---- composer -------------------------------------------------------------------------------- */

.adv__composer[b-v7wjbdgwvp] {
    flex: 0 0 auto;
    display: flex;
    align-items: flex-end;
    gap: 6px;
    padding: 8px;
    border-top: 1px solid var(--advisor-line);
    background: var(--advisor-pane-2);
}

.adv__input[b-v7wjbdgwvp] {
    flex: 1 1 auto;
    min-width: 0;
    padding: 6px 8px;
    border: 1px solid var(--advisor-line-strong);
    border-radius: var(--r-sm);
    background: var(--advisor-pane-3);
    color: var(--advisor-ink);
    font-family: var(--font-ui);
    font-size: var(--fs-body);
    line-height: 1.4;
    resize: none;
}

.adv__input:disabled[b-v7wjbdgwvp] {
    color: var(--advisor-ink-4);
}

.adv__send[b-v7wjbdgwvp] {
    flex: 0 0 auto;
    min-height: var(--target-dialog);
    padding: 0 14px;
    border: 1px solid var(--advisor-accent);
    border-radius: var(--r-sm);
    background: var(--advisor-accent);
    color: var(--advisor-accent-ink);
    font-family: var(--font-ui);
    font-size: var(--fs-dense);
    font-weight: 600;
    cursor: pointer;
    transition: background-color var(--dur-fast) var(--ease-standard);
}

.adv__send:hover:not(:disabled)[b-v7wjbdgwvp] {
    background: var(--advisor-accent-fill);
}

.adv__send:disabled[b-v7wjbdgwvp] {
    border-color: var(--advisor-line);
    background: var(--advisor-pane-3);
    color: var(--advisor-ink-4);
    cursor: default;
}
/* /Components/Advisor/AdvisorProse.razor.rz.scp.css */
/* Message body — markdown-lite. Compact density: the panel is 360px wide and a chat thread that
   breathes like a document wastes most of it. Color comes from the surrounding bubble via
   currentColor / the --advisor-* tokens; nothing here names a literal. */

.advp__para[b-gkjb2xyoeg],
.advp__heading[b-gkjb2xyoeg] {
    margin: 0 0 6px;
    line-height: 1.45;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}

.advp__para:last-child[b-gkjb2xyoeg],
.advp__heading:last-child[b-gkjb2xyoeg],
.advp__list:last-child[b-gkjb2xyoeg],
.advp__code:last-child[b-gkjb2xyoeg] {
    margin-bottom: 0;
}

.advp__heading[b-gkjb2xyoeg] {
    font-weight: 600;
    color: var(--advisor-ink);
}

.advp__list[b-gkjb2xyoeg] {
    margin: 0 0 6px;
    padding-left: 18px;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.advp__item[b-gkjb2xyoeg] {
    line-height: 1.4;
    overflow-wrap: anywhere;
}

.advp__strong[b-gkjb2xyoeg] {
    font-weight: 600;
}

.advp__inline-code[b-gkjb2xyoeg],
.advp__code[b-gkjb2xyoeg] {
    font-family: var(--font-mono);
    font-size: var(--fs-dense);
    background: var(--advisor-pane-3);
    color: var(--advisor-ink);
}

.advp__inline-code[b-gkjb2xyoeg] {
    padding: 0 3px;
    border-radius: var(--r-sm);
}

/* A code block is the one thing in the thread allowed to scroll sideways — wrapping a command
   changes what it says. */
.advp__code[b-gkjb2xyoeg] {
    margin: 0 0 6px;
    padding: 6px 8px;
    border: 1px solid var(--advisor-line);
    border-radius: var(--r-sm);
    overflow-x: auto;
}

.advp__code code[b-gkjb2xyoeg] {
    font: inherit;
    white-space: pre;
}
/* /Components/Analyze/AnalysisStep.razor.rz.scp.css */
/* Step 1 — Analysis: goal cards left, suggested-method radio cards right (still 01). */

.as[b-kzrt0mswtl] {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.as__q[b-kzrt0mswtl] {
    margin: 0;
    font-size: 19px;
    font-weight: 600;
    color: var(--text-1);
}

.as__purpose[b-kzrt0mswtl] {
    margin: 4px 0 0;
    font-size: var(--fs-comfortable);
    color: var(--text-3);
}

.as__grid[b-kzrt0mswtl] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 24px;
    align-items: start;
}

.as__left[b-kzrt0mswtl],
.as__right[b-kzrt0mswtl] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    min-width: 0;
}

.as__kicker[b-kzrt0mswtl] {
    font-size: var(--fs-dense);
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--text-3);
}

.as__advisor[b-kzrt0mswtl] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 12px 14px;
    border: 1px solid var(--advisor-accent);
    border-radius: var(--r-md);
    background: color-mix(in srgb, var(--advisor-accent) 8%, var(--surface-card));
}

.as__advisor-title[b-kzrt0mswtl] {
    font-size: var(--fs-comfortable);
    font-weight: 600;
    color: var(--advisor-accent);
}

.as__advisor-row[b-kzrt0mswtl] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 40px;
    gap: 8px;
}

.as__advisor-send[b-kzrt0mswtl] {
    border: 0;
    border-radius: var(--r-sm);
    background: var(--advisor-accent-fill);
    color: var(--advisor-accent-ink);
    font: inherit;
    cursor: pointer;
}

.as__advisor-send:disabled[b-kzrt0mswtl] {
    opacity: .5;
    cursor: default;
}

.as__advisor-line[b-kzrt0mswtl] {
    padding: 12px 14px;
    border: 1px solid var(--advisor-accent);
    border-radius: var(--r-md);
    background: color-mix(in srgb, var(--advisor-accent) 8%, var(--surface-card));
    font-size: var(--fs-comfortable);
    color: var(--text-1);
}

.as__advisor-mark[b-kzrt0mswtl] {
    font-weight: 600;
    color: var(--advisor-accent);
}

.as__goals[b-kzrt0mswtl],
.as__methods[b-kzrt0mswtl] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.as__goal[b-kzrt0mswtl],
.as__method[b-kzrt0mswtl] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 12px 14px;
    border: 1px solid var(--line-strong);
    border-radius: var(--r-md);
    background: var(--surface-card);
    color: var(--text-1);
    font: inherit;
    text-align: left;
    cursor: pointer;
}

.as__goal:hover[b-kzrt0mswtl],
.as__method:hover:not(:disabled)[b-kzrt0mswtl] {
    border-color: var(--text-4);
}

.as__goal:focus-visible[b-kzrt0mswtl],
.as__method:focus-visible[b-kzrt0mswtl] {
    outline: 2px solid var(--workspace-accent);
    outline-offset: 2px;
}

.as__goal--on[b-kzrt0mswtl],
.as__method--on[b-kzrt0mswtl] {
    border-color: var(--workspace-accent);
    background: color-mix(in srgb, var(--workspace-accent) 18%, var(--surface-card));
}

.as__method--off[b-kzrt0mswtl],
.as__method:disabled[b-kzrt0mswtl] {
    color: var(--text-4);
    cursor: default;
}

.as__goal-text[b-kzrt0mswtl],
.as__method-body[b-kzrt0mswtl] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

.as__goal-title[b-kzrt0mswtl],
.as__method-title[b-kzrt0mswtl] {
    font-size: var(--fs-comfortable);
    font-weight: 600;
}

.as__goal-sub[b-kzrt0mswtl],
.as__method-sub[b-kzrt0mswtl] {
    font-size: var(--fs-body);
    color: var(--text-3);
}

.as__method-head[b-kzrt0mswtl] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.as__radio[b-kzrt0mswtl] {
    flex-shrink: 0;
    width: 16px;
    height: 16px;
    margin-top: 2px;
    border: 2px solid var(--line-strong);
    border-radius: 50%;
}

.as__method--on .as__radio[b-kzrt0mswtl] {
    border-color: var(--workspace-accent);
    background: var(--workspace-accent);
    box-shadow: inset 0 0 0 3px var(--surface-card);
}

.as__badge[b-kzrt0mswtl] {
    padding: 1px 8px;
    border-radius: var(--r-pill);
    background: color-mix(in srgb, var(--status-ok) 18%, transparent);
    color: var(--status-ok);
    font-size: var(--fs-dense);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.as__badge--later[b-kzrt0mswtl] {
    background: color-mix(in srgb, var(--text-4) 18%, transparent);
    color: var(--text-3);
    text-transform: none;
    letter-spacing: 0;
}

.as__chips[b-kzrt0mswtl] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.as__chip[b-kzrt0mswtl] {
    padding: 1px 8px;
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    font-size: var(--fs-dense);
    color: var(--text-3);
}

.as__foot[b-kzrt0mswtl] {
    margin: 0;
    font-size: var(--fs-body);
    color: var(--text-4);
    line-height: 1.45;
}

@media (max-width: 1100px) {
    .as__grid[b-kzrt0mswtl] {
        grid-template-columns: minmax(0, 1fr);
    }
}
/* /Components/Analyze/AnalyzeStepFrame.razor.rz.scp.css */
/* AnalyzeStepFrame — question + guidance bar, a 2-column field grid, the 430px context column (E0 E5). */

.asf[b-ece0jh8z5g] {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.asf__question-row[b-ece0jh8z5g] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
}

.asf__q[b-ece0jh8z5g] {
    margin: 0;
    font-size: 19px;
    font-weight: 600;
    color: var(--text-1);
}

.asf__purpose[b-ece0jh8z5g] {
    margin: 4px 0 0;
    font-size: var(--fs-comfortable);
    color: var(--text-3);
}

.asf__guidance[b-ece0jh8z5g] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
}

.asf__guidance-label[b-ece0jh8z5g] {
    font-size: var(--fs-dense);
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--text-3);
}

.asf__grid[b-ece0jh8z5g] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 430px;
    gap: 24px;
    align-items: start;
}

.asf__grid--wide[b-ece0jh8z5g] {
    grid-template-columns: minmax(0, 1fr);
}

.asf__body[b-ece0jh8z5g] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    min-width: 0;
}

/* Two field groups side by side at panel width; a group spans when it is the step's subject. */
.asf__body[b-ece0jh8z5g]  .asf__pair {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.asf__context[b-ece0jh8z5g] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    min-width: 0;
}

.asf__meaning[b-ece0jh8z5g] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 12px 14px;
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    background: var(--surface-card);
    font-size: var(--fs-body);
    color: var(--text-3);
    line-height: 1.45;
}

.asf__meaning-tier[b-ece0jh8z5g] {
    font-size: var(--fs-dense);
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--text-2);
}

/* Shared context-card vocabulary the step bodies use for their right column. */
.asf__context[b-ece0jh8z5g]  .asf__card {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 14px 16px;
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    background: var(--surface-card);
}

.asf__context[b-ece0jh8z5g]  .asf__card-title {
    font-size: var(--fs-comfortable);
    font-weight: 600;
    color: var(--text-1);
}

.asf__context[b-ece0jh8z5g]  .asf__card p {
    margin: 0;
    font-size: var(--fs-body);
    color: var(--text-3);
    line-height: 1.45;
}

.asf__context[b-ece0jh8z5g]  .asf__facts {
    display: flex;
    flex-direction: column;
    margin: 0;
    padding: 0;
    list-style: none;
}

.asf__context[b-ece0jh8z5g]  .asf__fact {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 6px 0;
    border-bottom: 1px solid var(--line);
    font-size: var(--fs-body);
    color: var(--text-2);
}

.asf__context[b-ece0jh8z5g]  .asf__fact code {
    font-family: var(--font-mono);
    color: var(--text-1);
}

@media (max-width: 1100px) {
    .asf__grid[b-ece0jh8z5g] {
        grid-template-columns: minmax(0, 1fr);
    }

    .asf__question-row[b-ece0jh8z5g] {
        flex-direction: column;
    }
}
/* /Components/Analyze/SaveStep.razor.rz.scp.css */
/* Step 6 — Save: the review card left, the run right (the frame lays them out). */

/* Styled by the global .hub-button--primary (app.css); only its placement is local. */
.sv__again[b-z4dzby2wtt] {
    align-self: flex-start;
}
/* /Components/Analyze/SummaryStep.razor.rz.scp.css */
/* Step 7 — Summary: saved artifacts · what to check · result cards + exits (still 16). */

.sm__list[b-pyyg4wlk3f] {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
}

.sm__item[b-pyyg4wlk3f] {
    padding: 8px 0;
    border-bottom: 1px solid var(--line);
    font-size: var(--fs-comfortable);
    color: var(--text-1);
}

.sm__item:last-child[b-pyyg4wlk3f] {
    border-bottom: 0;
}

.sm__finding[b-pyyg4wlk3f] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 8px 0;
    border-bottom: 1px solid var(--line);
}

.sm__finding:last-child[b-pyyg4wlk3f] {
    border-bottom: 0;
}

.sm__finding-title[b-pyyg4wlk3f] {
    font-size: var(--fs-comfortable);
    font-weight: 600;
    color: var(--text-1);
}

.sm__finding-detail[b-pyyg4wlk3f] {
    font-size: var(--fs-body);
    color: var(--text-2);
}

.sm__finding-caveat[b-pyyg4wlk3f] {
    font-size: var(--fs-body);
    color: var(--caveat-warn-accent);
}

.sm__log summary[b-pyyg4wlk3f] {
    cursor: pointer;
    font-size: var(--fs-body);
    color: var(--accent);
}

.sm__log pre[b-pyyg4wlk3f] {
    margin: 8px 0 0;
    max-height: 200px;
    overflow: auto;
    padding: 10px 12px;
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    background: var(--surface-card-2);
    font-family: var(--font-mono);
    font-size: var(--fs-body);
    line-height: 1.5;
    color: var(--text-2);
    white-space: pre-wrap;
}

/* The action buttons are the global .hub-button--block / --danger (app.css). */
/* /Components/Analyze/VariogramPreviewPanel.razor.rz.scp.css */
/* VariogramPreviewPanel — the live experimental + fitted variogram in the context column (W7). */

.vpp__head[b-lw0sv476vi] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 10px;
}

.vpp__busy[b-lw0sv476vi] {
    font-size: var(--fs-dense);
    font-style: italic;
    color: var(--text-4);
}

.vpp__plot[b-lw0sv476vi] {
    height: 260px;
    min-width: 0;
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    overflow: hidden;
    background: var(--surface-card-2);
}

.vpp__plot[b-lw0sv476vi]  .viz-chart {
    height: 100%;
}

.vpp__skeleton[b-lw0sv476vi] {
    height: 260px;
    border-radius: var(--r-sm);
    background: color-mix(in srgb, var(--text-4) 12%, var(--surface-card));
}
/* /Components/Charts/DecompositionPlotChart.razor.rz.scp.css */
/* Decomposition stack chrome. Every ink color arrives as an inline style bound to a
   ChartTheme constant, so nothing here carries a color literal. */

/* EQUAL panel heights (desktop UniformGrid Columns="1", not star rows): the four y ranges
   must be the only thing that differs between panels, because that is the geometry the
   scale bars are reading. flex-basis 0 with equal grow is what guarantees it. */
.viz-decomposition__panels[b-p8yf83yav3] {
    display: flex;
    flex-direction: column;
    background: none;
}

.viz-decomposition__panel[b-p8yf83yav3] {
    flex: 1 1 0;
    min-height: 0;
    display: flex;
    align-items: stretch;
}

/* Positioning context for the .viz-chart__layer surface host and the in-plot label. */
.viz-decomposition__plot[b-p8yf83yav3] {
    flex: 1 1 0;
    min-width: 0;
    position: relative;
}

/* The component name, inside the plot's top-left and clear of the y axis (desktop
   Margin="44,2,0,0", FontSize 10.5, IsHitTestVisible="False"). */
.viz-decomposition__label[b-p8yf83yav3] {
    position: absolute;
    left: 44px;
    top: 2px;
    z-index: 2;
    pointer-events: none;
    font-family: Calibri, "Segoe UI", sans-serif;
    font-size: 10.5px;
    line-height: 1.1;
}

/* Fixed width on EVERY panel — including the three with no caption — so all four plot areas
   are the same width and the shared time axis still lines up down the stack. */
.viz-decomposition__scale[b-p8yf83yav3] {
    flex: 0 0 22px;
    height: 100%;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    gap: 2px;
    padding: 6px 2px;
    overflow: hidden;
}

/* Height is the payload's fraction of the panel, centered: full bar = NARROWEST axis = the
   smallest component, so the dominant component is the one with the short bar. */
.viz-decomposition__scale-bar[b-p8yf83yav3] {
    flex: 0 0 7px;
    width: 7px;
    border-radius: 1px;
    opacity: 0.55;
}

/* Rotated once for the stack (desktop RotateTransform Angle="90", FontSize 9, Opacity 0.75). */
.viz-decomposition__scale-caption[b-p8yf83yav3] {
    writing-mode: vertical-rl;
    max-height: 100%;
    overflow: hidden;
    font-family: Calibri, "Segoe UI", sans-serif;
    font-size: 9px;
    white-space: nowrap;
    opacity: 0.75;
}
/* /Components/Charts/ForestPlotChart.razor.rz.scp.css */
/* Layout only. Every ink value arrives from ChartTheme through an inline style, the way the
   desktop resolves this figure's colors from PlotStyle; the fonts are the chart-internal Arctic
   stacks app.css's chart block uses (charts are deliberately not shell-themed). */

.viz-forest[b-3u5eiv9924] {
    /* ONE gutter width for the rows grid, the null-rule layer and the scale row. All three are
       inset by exactly this and the rows grid has no column gap, so a left percentage means the
       same x in all three; a gap here would desync the rule from the intervals it references. */
    --forest-gutter: 108px;

    padding: 2px 10px 4px;
}

.viz-forest__plot[b-3u5eiv9924] {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
}

.viz-forest__rows[b-3u5eiv9924] {
    position: relative;
    padding: 4px 0 2px;
}

.viz-forest__rules[b-3u5eiv9924] {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: var(--forest-gutter);
    pointer-events: none;
}

.viz-forest__null[b-3u5eiv9924] {
    position: absolute;
    top: 0;
    bottom: 0;
    /* Desktop StrokeDashArray 4,3 — CSS dashed is the nearest thing a border can do. */
    border-left: 1px dashed;
}

.viz-forest__row[b-3u5eiv9924] {
    display: grid;
    grid-template-columns: var(--forest-gutter) 1fr;
    align-items: center;
    min-height: 20px;
}

.viz-forest__label[b-3u5eiv9924] {
    /* Padding rather than a column gap: the track must start at exactly --forest-gutter. */
    padding-right: 8px;
    overflow: hidden;
    text-align: right;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-family: Calibri, "Segoe UI", sans-serif;
    font-size: 10px;
}

.viz-forest__track[b-3u5eiv9924] {
    position: relative;
    height: 20px;
}

.viz-forest__interval[b-3u5eiv9924] {
    position: absolute;
    top: 50%;
    /* Desktop WhiskerStrokeThickness, in screen pixels at every tier. */
    height: 1px;
    transform: translateY(-50%);
}

.viz-forest__marker[b-3u5eiv9924] {
    position: absolute;
    top: 50%;
    /* Centered on its own left percentage, so the px diameter never shifts the estimate. */
    transform: translate(-50%, -50%);
    /* SQUARE, not a circle: the desktop mark is a SquarePointMarker
       (ForestPlotViewModel.cs:420) at this same diameter. */
}

.viz-forest__diamond[b-3u5eiv9924] {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    /* preserveAspectRatio="none" scales the box, not the stroke (vector-effect keeps that
       uniform); overflow stays visible so a diamond touching the frame is not clipped. */
    overflow: visible;
}

.viz-forest__diamond--open polygon[b-3u5eiv9924] {
    /* I2 >= 0.50. A CSS rule beats the polygon's presentation attribute, so the open state cannot
       be lost to an inline fill. */
    fill: none;
}

.viz-forest__row--comparison[b-3u5eiv9924] {
    /* The desktop prints the comparison reading at this opacity and drops it first. */
    opacity: 0.85;
}

.viz-forest__scale[b-3u5eiv9924] {
    position: relative;
    display: flex;
    justify-content: space-between;
    margin-left: var(--forest-gutter);
    padding-top: 2px;
    /* currentColor: the plot block paints itself AxisColor, which is the axis line's own color. */
    border-top: 1px solid;
    font-family: Consolas, "Cascadia Code", monospace;
    font-size: 9px;
}

.viz-forest__scale-null[b-3u5eiv9924] {
    position: absolute;
    top: 2px;
    transform: translateX(-50%);
}

.viz-forest__verdict[b-3u5eiv9924] {
    /* Desktop BorderThickness 3,0,0,0 — an accent rail, not a box. Left-aligned like its
       WrapPanel, against app.css's centered .viz-chart__verdict default. */
    justify-content: flex-start;
    margin: 4px 0 2px;
    border-left: 3px solid;
    padding-left: 8px;
}

.viz-forest__pooled-label[b-3u5eiv9924] {
    font-weight: 600;
}
/* /Components/Charts/SeasonalSubseriesChart.razor.rz.scp.css */
/* Seasonal-subseries chrome. The one new mark this panel needs is a SOLID line chip: the
   desktop legend strip draws its role markers as 18x2 / 18x3 rules (SeasonalPlot.xaml), not
   as the shared square swatch, because both roles the strip explains are lines. Weight and
   ink arrive as inline styles bound to ChartTheme constants, so no color literal lives here. */

.viz-seasonal__chip-line[b-52js3swzfh] {
    width: 18px;
    height: 0;
    border-top-style: solid;
    border-top-width: 2px;
    border-radius: 0;
    background: none;
}
/* /Components/Charts/VariableImportanceChart.razor.rz.scp.css */
/* Layout only: a four-column ranked list. Bar ink arrives from ChartTheme through an inline
   style, the way the desktop resolves it from PlotStyle; the fonts are the chart-internal Arctic
   stacks app.css's chart block uses (charts are deliberately not shell-themed). */

.viz-importance[b-5mruob5zh5] {
    padding: 2px 10px 4px;
}

.viz-importance__rows[b-5mruob5zh5] {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    padding: 4px 0 2px;
}

.viz-importance__row[b-5mruob5zh5] {
    display: grid;
    /* rank | name | track | value. The name column is capped so the tracks stay comparable
       across rows — the bars are the reading, and a long predictor name must not shorten them. */
    grid-template-columns: 3ch minmax(56px, 26%) 1fr 7ch;
    align-items: center;
    column-gap: 8px;
    min-height: 18px;
}

.viz-importance__rank[b-5mruob5zh5] {
    text-align: right;
    font-family: Consolas, "Cascadia Code", monospace;
    font-size: 9px;
    opacity: 0.75;
}

.viz-importance__name[b-5mruob5zh5] {
    overflow: hidden;
    /* Truncated names keep the full string in a title attribute, since the ranking is only
       readable if the rows stay one line each. */
    text-overflow: ellipsis;
    white-space: nowrap;
    font-family: Calibri, "Segoe UI", sans-serif;
    font-size: 11px;
}

.viz-importance__track[b-5mruob5zh5] {
    position: relative;
    /* ~0.7 of the row slot — desktop BarWidthFraction, which leaves a visible gap between
       predictors. */
    height: 12px;
}

.viz-importance__bar[b-5mruob5zh5] {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    /* A near-zero measure still reads as a bar rather than as a missing row. */
    min-width: 1px;
    border-radius: 0 1px 1px 0;
}

.viz-importance__value[b-5mruob5zh5] {
    text-align: right;
    font-family: Consolas, "Cascadia Code", monospace;
    font-size: 10px;
}
/* /Components/FilterBar.razor.rz.scp.css */
/* Workspace filter bar (C3) — chrome, so THEMED via the server's tokens, never plot ink. */

.filter-bar[b-xthyxwww3v] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 4px;
    min-width: 0;
}

.filter-bar__toggle[b-xthyxwww3v],
.filter-bar__chip[b-xthyxwww3v] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    height: 24px; /* Compact density: control height 24px (C0 D7) */
    padding: 0 8px;
    border: 1px solid var(--line);
    border-radius: 4px;
    background: var(--surface-card);
    color: var(--text-2);
    font-size: 11px;
    cursor: pointer;
    white-space: nowrap;
}

.filter-bar__toggle--on[b-xthyxwww3v],
.filter-bar__chip--active[b-xthyxwww3v] {
    border-color: var(--workspace-accent);
    background: var(--workspace-accent);
    color: var(--workspace-accent-ink);
}

.filter-bar__chip-name[b-xthyxwww3v] {
    max-width: 14ch;
    overflow: hidden;
    text-overflow: ellipsis;
}

.filter-bar__chip-test[b-xthyxwww3v] {
    font-size: 10px;
    opacity: 0.85;
}

.filter-bar__count[b-xthyxwww3v] {
    margin-left: 4px;
    color: var(--text-3);
    font-size: 10px;
    white-space: nowrap;
}

.filter-bar__chip-wrap[b-xthyxwww3v] {
    position: relative;
}

.filter-bar__popover[b-xthyxwww3v] {
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    z-index: 30;
    min-width: 220px;
    max-width: 300px;
    padding: 10px;
    border: 1px solid var(--line-strong);
    border-radius: 6px;
    background: var(--surface-card);
    color: var(--text-2);
    box-shadow: var(--shadow-sm);
    display: flex;
    flex-direction: column;
    gap: 6px;
    font-size: 11px;
}

.filter-bar__popover-title[b-xthyxwww3v] {
    font-weight: 600;
    color: var(--text-1);
    overflow-wrap: anywhere;
}

.filter-bar__popover-note[b-xthyxwww3v] {
    color: var(--text-3);
    font-size: 10px;
}

.filter-bar__field[b-xthyxwww3v] {
    display: flex;
    gap: 8px;
}

.filter-bar__field label[b-xthyxwww3v] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    font-size: 10px;
    color: var(--text-3);
    min-width: 0;
}

.filter-bar__field input[b-xthyxwww3v] {
    width: 90px;
    height: 24px;
    padding: 0 6px;
    border: 1px solid var(--line);
    border-radius: 4px;
    background: var(--surface-card);
    color: var(--text-1);
    font-size: 11px;
}

.filter-bar__categories[b-xthyxwww3v] {
    max-height: 180px;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.filter-bar__check[b-xthyxwww3v] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 11px;
    color: var(--text-2);
}

.filter-bar__popover-actions[b-xthyxwww3v] {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 4px;
}

.filter-bar__btn[b-xthyxwww3v] {
    height: 22px;
    padding: 0 10px;
    border: 1px solid var(--line);
    border-radius: 4px;
    background: var(--surface-card);
    color: var(--text-2);
    font-size: 11px;
    cursor: pointer;
}

.filter-bar__btn--primary[b-xthyxwww3v] {
    border-color: var(--workspace-accent);
    background: var(--workspace-accent);
    color: var(--workspace-accent-ink);
}
/* /Components/Flow/AboutSource.razor.rz.scp.css */
/* AboutSource — a one-line disclosure that opens into a short description + chips (D15). */

.as[b-hx4g1b5hr3] {
    margin: 0 0 14px;
}

.as__toggle[b-hx4g1b5hr3] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 0;
    border: 0;
    background: none;
    font: inherit;
    font-size: var(--fs-body);
    color: var(--accent);
    cursor: pointer;
}

.as__toggle:focus-visible[b-hx4g1b5hr3] {
    outline: 2px solid var(--workspace-accent);
    outline-offset: 2px;
    border-radius: 2px;
}

.as__body[b-hx4g1b5hr3] {
    margin-top: 8px;
    padding: 12px 14px;
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    background: var(--surface-card);
}

.as__text[b-hx4g1b5hr3] {
    margin: 0;
    max-width: 96ch;
    font-size: var(--fs-comfortable);
    line-height: 1.5;
    color: var(--text-2);
}

.as__chips[b-hx4g1b5hr3] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 10px;
}

.as__chip[b-hx4g1b5hr3] {
    padding: 2px 10px;
    border: 1px solid var(--line-strong);
    border-radius: var(--r-pill);
    font-size: var(--fs-dense);
    color: var(--text-2);
}
/* /Components/Flow/FieldGroup.razor.rz.scp.css */
/* FieldGroup — group label + bordered card; children are label-over-control stacks (.fg__field). */

.fg[b-mf3b1s7pco] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.fg__label[b-mf3b1s7pco] {
    font-size: var(--fs-dense);
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--text-3);
}

.fg__hint[b-mf3b1s7pco] {
    font-weight: 400;
    letter-spacing: 0;
    text-transform: none;
    color: var(--text-4);
}

.fg__card[b-mf3b1s7pco] {
    display: grid;
    gap: 12px 16px;
    padding: 14px 16px;
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    background: var(--surface-card);
}

/* The children's shared vocabulary — a field is a small caption over a 32px control. */
.fg__card[b-mf3b1s7pco]  .fg__field {
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-width: 0;
}

.fg__card[b-mf3b1s7pco]  .fg__span {
    grid-column: 1 / -1;
}

.fg__card[b-mf3b1s7pco]  .fg__caption {
    font-size: var(--fs-body);
    color: var(--text-3);
}

.fg__card[b-mf3b1s7pco]  .fg__control,
.fg__card[b-mf3b1s7pco]  select.fg__control,
.fg__card[b-mf3b1s7pco]  input.fg__control {
    box-sizing: border-box;
    height: 32px;
    padding: 0 10px;
    border: 1px solid var(--line-strong);
    border-radius: var(--r-sm);
    background: var(--surface-card-2);
    color: var(--text-1);
    font: inherit;
    font-size: var(--fs-comfortable);
}

.fg__card[b-mf3b1s7pco]  .fg__control:focus-visible {
    outline: 2px solid var(--workspace-accent);
    outline-offset: 1px;
}

.fg__card[b-mf3b1s7pco]  .fg__control:disabled {
    color: var(--text-4);
}

.fg__card[b-mf3b1s7pco]  .fg__control--mono {
    font-family: var(--font-mono);
}

.fg__card[b-mf3b1s7pco]  .fg__note {
    grid-column: 1 / -1;
    font-size: var(--fs-body);
    color: var(--text-3);
    line-height: 1.45;
}

.fg__card[b-mf3b1s7pco]  .fg__check {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: var(--fs-comfortable);
    color: var(--text-1);
}
/* /Components/Flow/GuidanceTierBar.razor.rz.scp.css */
/* GuidanceTierBar — the design system's SegmentedControl at parameter scale (E0 §4). */

.gtb[b-5of5p6h3e1] {
    display: inline-flex;
    padding: 2px;
    border: 1px solid var(--line-strong);
    border-radius: var(--r-pill);
    background: var(--surface-card-2);
}

.gtb__seg[b-5of5p6h3e1] {
    height: 26px;
    padding: 0 12px;
    border: 0;
    border-radius: var(--r-pill);
    background: transparent;
    color: var(--text-3);
    font: inherit;
    font-size: var(--fs-body);
    font-weight: 600;
    cursor: pointer;
}

.gtb__seg:hover[b-5of5p6h3e1] {
    color: var(--text-1);
}

.gtb__seg:focus-visible[b-5of5p6h3e1] {
    outline: 2px solid var(--workspace-accent);
    outline-offset: 1px;
}

.gtb__seg:disabled[b-5of5p6h3e1] {
    cursor: default;
    color: var(--text-4);
}

.gtb__seg--on[b-5of5p6h3e1],
.gtb__seg--on:disabled[b-5of5p6h3e1] {
    background: color-mix(in srgb, var(--workspace-accent) 18%, var(--surface-card));
    color: var(--text-1);
}
/* /Components/Flow/InlineNotice.razor.rz.scp.css */
/* InlineNotice — the caveat triples (D0 §6). Fill / border / accent per kind; nothing else. */

.in[b-ji7p2k3fql] {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 12px 16px;
    border: 1px solid var(--caveat-info-border);
    border-radius: var(--r-md);
    background: var(--caveat-info-fill);
    font-size: var(--fs-comfortable);
    line-height: 1.45;
    color: var(--text-1);
}

.in--compact[b-ji7p2k3fql] {
    padding: 8px 12px;
    gap: 10px;
    font-size: var(--fs-body);
}

.in--warning[b-ji7p2k3fql] {
    border-color: var(--caveat-warn-border);
    background: var(--caveat-warn-fill);
}

.in--error[b-ji7p2k3fql] {
    border-color: var(--caveat-err-border);
    background: var(--caveat-err-fill);
}

.in--passed[b-ji7p2k3fql] {
    border-color: var(--line);
    background: var(--surface-card);
}

.in__label[b-ji7p2k3fql] {
    flex: 0 0 72px;
    font-weight: 600;
    color: var(--caveat-info-accent);
}

.in--warning .in__label[b-ji7p2k3fql] { color: var(--caveat-warn-accent); }
.in--error .in__label[b-ji7p2k3fql] { color: var(--caveat-err-accent); }
.in--passed .in__label[b-ji7p2k3fql] { color: var(--status-ok); }

.in__text[b-ji7p2k3fql] {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.in__title[b-ji7p2k3fql] {
    font-weight: 600;
}

.in__detail[b-ji7p2k3fql] {
    color: var(--text-2);
}

.in__action[b-ji7p2k3fql] {
    flex: 0 0 auto;
    padding: 0;
    border: 0;
    background: none;
    font: inherit;
    font-size: var(--fs-body);
    color: var(--accent);
    text-decoration: underline;
    cursor: pointer;
}

.in__action:focus-visible[b-ji7p2k3fql] {
    outline: 2px solid var(--workspace-accent);
    outline-offset: 2px;
    border-radius: 2px;
}
/* /Components/Flow/ModeCardRow.razor.rz.scp.css */
/* ModeCardRow — big described cards; selected = workspace-accent outline + 18% wash (D0 §6). */

.mcr[b-sv2my6bfa5] {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: minmax(0, 1fr);
    gap: 12px;
}

.mcr__card[b-sv2my6bfa5] {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
    min-height: 62px;
    padding: 12px 14px;
    border: 1px solid var(--line-strong);
    border-radius: var(--r-md);
    background: var(--surface-card);
    color: var(--text-1);
    font: inherit;
    text-align: left;
    cursor: pointer;
}

.mcr__card:hover[b-sv2my6bfa5] {
    border-color: var(--text-4);
}

.mcr__card:focus-visible[b-sv2my6bfa5] {
    outline: 2px solid var(--workspace-accent);
    outline-offset: 2px;
}

.mcr__card:disabled[b-sv2my6bfa5] {
    cursor: default;
    color: var(--text-4);
}

.mcr__card--on[b-sv2my6bfa5] {
    border-color: var(--workspace-accent);
    background: color-mix(in srgb, var(--workspace-accent) 18%, var(--surface-card));
}

.mcr__label[b-sv2my6bfa5] {
    font-size: var(--fs-comfortable);
    font-weight: 600;
}

.mcr__sub[b-sv2my6bfa5] {
    font-size: var(--fs-body);
    color: var(--text-3);
}

.mcr__card--on .mcr__sub[b-sv2my6bfa5] {
    color: var(--text-2);
}

/* In FLOW, not absolutely positioned over the card. It sat at top-right, which was legible while only
   Geography and Time used this row (two or three wide cards) and became an overlap the moment a step
   offered five: LCA's spatial-weights row drew "recommended" straight through the word "Detect". Pushed to
   the bottom of the column so the card can be as narrow as the row makes it. */
.mcr__badge[b-sv2my6bfa5] {
    align-self: flex-start;
    margin-top: auto;
    padding: 1px 8px;
    border-radius: var(--r-pill);
    background: color-mix(in srgb, var(--status-ok) 18%, transparent);
    color: var(--status-ok);
    font-size: var(--fs-dense);
    font-weight: 600;
}
/* /Components/Flow/NumberRow.razor.rz.scp.css */
/* NumberRow — label over a − value + control; mono numerals (E0 §4). */

.nr__control[b-2ms9gp0bqj] {
    display: inline-grid;
    grid-template-columns: 32px minmax(72px, 1fr) 32px;
    align-items: stretch;
    height: 32px;
    border: 1px solid var(--line-strong);
    border-radius: var(--r-sm);
    background: var(--surface-card-2);
    overflow: hidden;
}

.nr__btn[b-2ms9gp0bqj] {
    border: 0;
    background: transparent;
    color: var(--text-2);
    font: inherit;
    font-size: var(--fs-comfortable);
    cursor: pointer;
}

.nr__btn:hover:not(:disabled)[b-2ms9gp0bqj] {
    background: color-mix(in srgb, var(--workspace-accent) 12%, var(--surface-card-2));
    color: var(--text-1);
}

.nr__btn:disabled[b-2ms9gp0bqj] {
    color: var(--text-4);
    cursor: default;
}

.nr__btn:focus-visible[b-2ms9gp0bqj] {
    outline: 2px solid var(--workspace-accent);
    outline-offset: -2px;
}

.nr__value[b-2ms9gp0bqj],
.nr__control .nr__value.fg__control[b-2ms9gp0bqj] {
    height: 30px;
    border: 0;
    border-left: 1px solid var(--line);
    border-right: 1px solid var(--line);
    border-radius: 0;
    text-align: center;
    font-family: var(--font-mono);
    font-variant-numeric: tabular-nums;
    background: transparent;
    color: var(--text-1);
}

.nr__hint[b-2ms9gp0bqj] {
    font-size: var(--fs-dense);
    color: var(--text-4);
}
/* /Components/Flow/PreviewTable.razor.rz.scp.css */
/* PreviewTable — striped mono grid; 34px rows (26px compact via .pt--dense on the host). */

.pt[b-svgfdfafsu] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-width: 0;
}

.pt__head[b-svgfdfafsu] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
}

.pt__title[b-svgfdfafsu] {
    font-size: var(--fs-comfortable);
    font-weight: 600;
    color: var(--text-1);
}

.pt__sub[b-svgfdfafsu] {
    font-size: var(--fs-body);
    color: var(--text-3);
}

.pt__table[b-svgfdfafsu] {
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    background: var(--surface-card);
    overflow: hidden;
}

.pt__row[b-svgfdfafsu] {
    display: flex;
    min-height: 34px;
    align-items: center;
    border-top: 1px solid var(--line);
}

.pt__row--header[b-svgfdfafsu] {
    border-top: 0;
    background: var(--surface-card-2);
}

.pt__row:nth-child(even):not(.pt__row--header)[b-svgfdfafsu] {
    background: color-mix(in srgb, var(--surface-card-2) 50%, var(--surface-card));
}

.pt__row--dim .pt__cell[b-svgfdfafsu] {
    color: var(--text-4);
    font-style: italic;
}

.pt__row--hi[b-svgfdfafsu] {
    background: color-mix(in srgb, var(--workspace-accent) 16%, var(--surface-card)) !important;
}

.pt__cell[b-svgfdfafsu] {
    min-width: 0;
    padding: 0 12px;
    font-family: var(--font-mono);
    font-size: var(--fs-body);
    color: var(--text-1);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.pt__cell--header[b-svgfdfafsu] {
    font-weight: 600;
    color: var(--text-2);
}

.pt__cell--blank[b-svgfdfafsu] {
    color: var(--text-4);
}

.pt__note[b-svgfdfafsu] {
    padding: 8px 12px;
    border-top: 1px solid var(--line);
    font-size: var(--fs-body);
    color: var(--text-3);
}
/* /Components/Flow/RecapList.razor.rz.scp.css */
/* RecapList — numbered rows in a bordered card; the number tile takes the row's severity. */

.rl[b-ie7j45fvs3] {
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    background: var(--surface-card);
    overflow: hidden;
}

.rl__row[b-ie7j45fvs3] {
    display: flex;
    align-items: center;
    gap: 14px;
    min-height: 44px;
    padding: 8px 14px;
    border-top: 1px solid var(--line);
}

.rl__row:first-child[b-ie7j45fvs3] {
    border-top: 0;
}

.rl__n[b-ie7j45fvs3] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    border: 1px solid var(--line-strong);
    font-size: var(--fs-dense);
    font-weight: 600;
    color: var(--text-2);
}

.rl__row--warning .rl__n[b-ie7j45fvs3] {
    border-color: var(--caveat-warn-accent);
    color: var(--caveat-warn-accent);
}

.rl__row--error .rl__n[b-ie7j45fvs3] {
    border-color: var(--caveat-err-accent);
    color: var(--caveat-err-accent);
}

.rl__body[b-ie7j45fvs3] {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.rl__label[b-ie7j45fvs3] {
    font-size: var(--fs-body);
    font-weight: 600;
    color: var(--text-2);
}

.rl__summary[b-ie7j45fvs3] {
    font-size: var(--fs-comfortable);
    color: var(--text-1);
    overflow-wrap: anywhere;
}

.rl--facts .rl__body[b-ie7j45fvs3] {
    flex-direction: row;
    justify-content: space-between;
    align-items: baseline;
    gap: 16px;
}

.rl--facts .rl__row[b-ie7j45fvs3] {
    min-height: 36px;
}

.rl--facts .rl__summary[b-ie7j45fvs3] {
    font-family: var(--font-mono);
    font-size: var(--fs-body);
    text-align: right;
}

.rl__edit[b-ie7j45fvs3] {
    flex: 0 0 auto;
    padding: 4px 10px;
    border: 1px solid var(--line-strong);
    border-radius: var(--r-sm);
    background: transparent;
    color: var(--accent);
    font: inherit;
    font-size: var(--fs-body);
    cursor: pointer;
}

.rl__edit:hover[b-ie7j45fvs3] {
    border-color: var(--accent);
}

.rl__edit:focus-visible[b-ie7j45fvs3] {
    outline: 2px solid var(--workspace-accent);
    outline-offset: 1px;
}
/* /Components/Flow/ResultWorkspaceCards.razor.rz.scp.css */
/* ResultWorkspaceCards — the workspaces a run created, one card each (E0 E10 / W4 as withdrawn). */

.rwc[b-eawpg8riqv] {
    display: grid;
    gap: 10px;
}

.rwc__card[b-eawpg8riqv] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 12px 14px;
    border: 1px solid var(--line);
    border-left: 3px solid var(--workspace-accent);
    border-radius: var(--r-md);
    background: var(--surface-card);
}

.rwc__head[b-eawpg8riqv] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.rwc__kicker[b-eawpg8riqv] {
    font-size: var(--fs-dense);
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--text-3);
}

.rwc__name[b-eawpg8riqv] {
    font-size: var(--fs-comfortable);
    font-weight: 600;
    color: var(--text-1);
}

.rwc__tiles[b-eawpg8riqv] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.rwc__tile[b-eawpg8riqv] {
    padding: 2px 8px;
    border-radius: var(--r-pill);
    background: color-mix(in srgb, var(--workspace-accent) 14%, var(--surface-card));
    color: var(--text-2);
    font-size: var(--fs-dense);
}

/* Styled by the global .hub-button (app.css); only its placement is local. */
.rwc__open[b-eawpg8riqv] {
    align-self: flex-start;
}
/* /Components/Flow/RunStageList.razor.rz.scp.css */
/* RunStageList — progress bar in the workspace accent, mono log, one Cancel. */

.rsl[b-rnargtlp8q] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 16px;
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    background: var(--surface-card);
}

.rsl__bar[b-rnargtlp8q] {
    height: 6px;
    border-radius: var(--r-pill);
    background: var(--surface-card-2);
    overflow: hidden;
}

.rsl__fill[b-rnargtlp8q] {
    height: 100%;
    border-radius: var(--r-pill);
    background: var(--workspace-accent);
    transition: width .3s ease;
}

.rsl[data-state="failed"] .rsl__fill[b-rnargtlp8q] { background: var(--caveat-err-accent); }
.rsl[data-state="succeeded"] .rsl__fill[b-rnargtlp8q] { background: var(--status-ok); }
.rsl[data-state="cancelled"] .rsl__fill[b-rnargtlp8q] { background: var(--text-4); }

.rsl__line[b-rnargtlp8q] {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 12px;
    font-size: var(--fs-comfortable);
    color: var(--text-1);
}

.rsl__pct[b-rnargtlp8q] {
    font-family: var(--font-mono);
    color: var(--text-3);
}

.rsl__log[b-rnargtlp8q] {
    margin: 0;
    max-height: 260px;
    overflow: auto;
    padding: 10px 12px;
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    background: var(--surface-card-2);
    font-family: var(--font-mono);
    font-size: var(--fs-body);
    line-height: 1.5;
    color: var(--text-2);
    white-space: pre-wrap;
}

.rsl__actions[b-rnargtlp8q] {
    display: flex;
    justify-content: flex-end;
}

/* Styled by the global .hub-button (app.css). */
/* /Components/Flow/StepBodyHeader.razor.rz.scp.css */
/* Step body header — D0 §6 density: kicker 11px uppercase, title 22px, purpose 13px. */

.sbh[b-c347a9aozu] {
    margin: 0 0 18px;
}

.sbh__kicker[b-c347a9aozu] {
    font-size: var(--fs-dense);
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--text-3);
}

.sbh__title[b-c347a9aozu] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 4px 0 6px;
    font-size: var(--fs-heading-lg);
    font-weight: 600;
    color: var(--text-1);
}

.sbh__check[b-c347a9aozu] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: color-mix(in srgb, var(--status-ok) 18%, transparent);
    color: var(--status-ok);
}

.sbh__purpose[b-c347a9aozu] {
    margin: 0;
    max-width: 96ch;
    font-size: var(--fs-comfortable);
    line-height: 1.5;
    color: var(--text-2);
}
/* /Components/Flow/VariableMultiPicker.razor.rz.scp.css */
/* VariableMultiPicker — VariablePicker's shape plus the ordered chip set of what is chosen. */

.vmp__search[b-y5c8p21ww5],
.vmp .vmp__search.fg__control[b-y5c8p21ww5] {
    margin-bottom: 6px;
}

.vmp__chips[b-y5c8p21ww5] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin: 8px 0 0;
    padding: 0;
    list-style: none;
}

.vmp__chip[b-y5c8p21ww5] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 26px;
    padding: 0 4px 0 6px;
    border: 1px solid var(--line-strong);
    border-radius: 13px;
    background: var(--surface-card-2);
    font-size: var(--fs-dense);
}

.vmp__ordinal[b-y5c8p21ww5] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 16px;
    height: 16px;
    border-radius: 8px;
    background: var(--line-strong);
    color: var(--text-4);
    font-size: 10px;
    font-variant-numeric: tabular-nums;
}

.vmp__name[b-y5c8p21ww5] {
    color: var(--text-2);
}

/* The folder the chosen variable came from — quieter than the name, because it disambiguates
   rather than identifies. Repeated analysis runs put several identically named outputs on offer. */
.vmp__folder[b-y5c8p21ww5] {
    color: var(--text-4);
    font-size: 10px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 12ch;
}

.vmp__remove[b-y5c8p21ww5] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    padding: 0;
    border: 0;
    border-radius: 9px;
    background: transparent;
    color: var(--text-4);
    font-size: 14px;
    line-height: 1;
    cursor: pointer;
}

.vmp__remove:hover:not(:disabled)[b-y5c8p21ww5] {
    background: var(--line-strong);
    color: var(--text-1);
}

.vmp__remove:disabled[b-y5c8p21ww5] {
    cursor: default;
    opacity: 0.5;
}

.vmp__note[b-y5c8p21ww5] {
    display: block;
    margin-top: 6px;
    font-size: var(--fs-dense);
    color: var(--text-4);
}

.vmp__empty[b-y5c8p21ww5] {
    font-size: var(--fs-body);
    color: var(--caveat-warn-accent);
}
/* /Components/Flow/VariablePicker.razor.rz.scp.css */
/* VariablePicker — a filtered select with a search box past ten candidates (SHARED-COMPONENTS §7.3). */

.vp__search[b-812r2z6k4c],
.vp .vp__search.fg__control[b-812r2z6k4c] {
    margin-bottom: 6px;
}

.vp__note[b-812r2z6k4c] {
    font-size: var(--fs-dense);
    color: var(--text-4);
}

.vp__empty[b-812r2z6k4c] {
    font-size: var(--fs-body);
    color: var(--caveat-warn-accent);
}
/* /Components/Import/DestinationCard.razor.rz.scp.css */
.dc[b-ko7gehv6b1] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.dc__kicker[b-ko7gehv6b1] {
    font-size: var(--fs-dense);
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--text-3);
}

.dc__card[b-ko7gehv6b1] {
    padding: 16px;
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    background: var(--surface-card);
    font-size: var(--fs-comfortable);
    line-height: 1.45;
    color: var(--text-2);
}

.dc__project[b-ko7gehv6b1] {
    margin: 4px 0 2px;
    font-size: var(--fs-heading);
    font-weight: 600;
    color: var(--text-1);
}

.dc__sub b[b-ko7gehv6b1] {
    color: var(--text-1);
    font-weight: 600;
}

.dc__change[b-ko7gehv6b1] {
    margin-top: 10px;
    padding: 0;
    border: 0;
    background: none;
    font: inherit;
    font-size: var(--fs-comfortable);
    color: var(--accent);
    text-decoration: underline;
    cursor: pointer;
}

.dc__change:focus-visible[b-ko7gehv6b1] {
    outline: 2px solid var(--workspace-accent);
    outline-offset: 2px;
    border-radius: 2px;
}
/* /Components/Import/FileDropZone.razor.rz.scp.css */
/* FileDropZone — dashed drop target + the six-format reference grid (artboard 01d). */

.fdz[b-qotgd4bwav] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 240px;
    padding: 28px 32px;
    border: 2px dashed var(--line-strong);
    border-radius: var(--r-lg);
    background: var(--surface-card);
    text-align: center;
    transition: border-color .15s ease, background-color .15s ease;
}

.fdz--over[b-qotgd4bwav] {
    border-color: var(--workspace-accent);
    background: color-mix(in srgb, var(--workspace-accent) 8%, var(--surface-card));
}

.fdz--disabled[b-qotgd4bwav] {
    opacity: .6;
}

.fdz__icon[b-qotgd4bwav] {
    color: var(--accent);
}

.fdz__title[b-qotgd4bwav] {
    font-size: var(--fs-heading);
    font-weight: 600;
    color: var(--text-1);
}

.fdz__lead[b-qotgd4bwav] {
    font-size: var(--fs-comfortable);
    color: var(--text-2);
}

.fdz__lead b[b-qotgd4bwav] {
    color: var(--text-1);
}

.fdz__browse[b-qotgd4bwav] {
    color: var(--accent);
    text-decoration: underline;
    cursor: pointer;
}

.fdz__input[b-qotgd4bwav] {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    overflow: hidden;
    pointer-events: none;
}

.fdz__browse:focus-within[b-qotgd4bwav] {
    outline: 2px solid var(--workspace-accent);
    outline-offset: 2px;
    border-radius: 2px;
}

.fdz__hint[b-qotgd4bwav] {
    max-width: 110ch;
    margin-top: 6px;
    font-size: var(--fs-body);
    line-height: 1.5;
    color: var(--text-3);
}

.fdz__hint code[b-qotgd4bwav],
.fdz__format code[b-qotgd4bwav] {
    font-family: var(--font-mono);
    font-size: var(--fs-body);
    color: var(--text-1);
}

.fdz__formats[b-qotgd4bwav] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin-top: 14px;
}

.fdz__format[b-qotgd4bwav] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 12px 16px;
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    background: var(--surface-card);
}

.fdz__format code[b-qotgd4bwav] {
    font-size: var(--fs-comfortable);
}

.fdz__format span[b-qotgd4bwav] {
    font-size: var(--fs-body);
    color: var(--text-3);
}
/* /Components/Import/GeographyStep.razor.rz.scp.css */
/* Step 3 — Geography: mode cards, then the mode's panel left and the placement preview right. */

.gs__grid[b-7xahxcgsj6] {
    display: grid;
    grid-template-columns: minmax(360px, 3fr) minmax(0, 2fr);
    gap: 24px;
    align-items: start;
    margin-top: 16px;
}

.gs__left[b-7xahxcgsj6],
.gs__right[b-7xahxcgsj6] {
    display: flex;
    flex-direction: column;
    gap: 14px;
    min-width: 0;
}

.gs__arrow[b-7xahxcgsj6] {
    align-self: end;
    padding-bottom: 6px;
    text-align: center;
    font-size: var(--fs-heading);
    color: var(--text-3);
}

.gs__match[b-7xahxcgsj6] {
    display: flex;
    align-items: baseline;
    gap: 14px;
}

.gs__count[b-7xahxcgsj6] {
    font-family: var(--font-mono);
    font-size: var(--fs-heading);
    font-weight: 600;
    color: var(--text-1);
}

.gs__link[b-7xahxcgsj6] {
    padding: 0;
    border: 0;
    background: none;
    font: inherit;
    font-size: var(--fs-body);
    color: var(--accent);
    text-decoration: underline;
    cursor: pointer;
}

.gs__unmatched[b-7xahxcgsj6] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    font-size: var(--fs-body);
    color: var(--text-3);
}

.gs__unmatched code[b-7xahxcgsj6],
.gs__code[b-7xahxcgsj6] {
    padding: 0 6px;
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    font-family: var(--font-mono);
    font-size: var(--fs-body);
    color: var(--text-1);
}

.gs__foot[b-7xahxcgsj6] {
    margin: 0;
    font-size: var(--fs-body);
    color: var(--text-3);
}

.gs__crs-line[b-7xahxcgsj6] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.gs__crs[b-7xahxcgsj6] {
    font-family: var(--font-mono);
    font-size: var(--fs-comfortable);
    color: var(--text-1);
}

.gs__badge[b-7xahxcgsj6] {
    padding: 1px 8px;
    border-radius: var(--r-pill);
    background: color-mix(in srgb, var(--status-ok) 18%, transparent);
    color: var(--status-ok);
    font-size: var(--fs-dense);
    font-weight: 600;
}

.gs__badge--warn[b-7xahxcgsj6] {
    background: var(--caveat-warn-fill);
    color: var(--caveat-warn-accent);
}

.gs__ok[b-7xahxcgsj6] {
    color: var(--status-ok);
}

.gs__preview-label[b-7xahxcgsj6] {
    font-size: var(--fs-dense);
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--text-3);
}

.gs__preview[b-7xahxcgsj6] {
    min-height: 200px;
    padding: 16px;
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    background: var(--surface-card);
}

.gs__bbox[b-7xahxcgsj6] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.gs__bbox-title[b-7xahxcgsj6] {
    font-size: var(--fs-body);
    font-weight: 600;
    color: var(--text-2);
}

.gs__bbox code[b-7xahxcgsj6] {
    font-family: var(--font-mono);
    font-size: var(--fs-comfortable);
    color: var(--text-1);
}

.gs__big[b-7xahxcgsj6] {
    font-family: var(--font-mono);
    font-size: 28px;
    font-weight: 600;
    color: var(--text-1);
}

.gs__sub[b-7xahxcgsj6] {
    font-size: var(--fs-body);
    color: var(--text-3);
    line-height: 1.5;
}

@media (max-width: 1100px) {
    .gs__grid[b-7xahxcgsj6] {
        grid-template-columns: minmax(0, 1fr);
    }
}
/* /Components/Import/Online/CatalogStep.razor.rz.scp.css */
/* Tokens only — no hex, rgb(), hsl() or named colour (CONVENTIONS.md, enforced in CI). */

.cs__grid[b-lihnphjwax] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 260px;
    gap: 20px;
    align-items: start;
}

@media (max-width: 1100px) {
    .cs__grid[b-lihnphjwax] {
        grid-template-columns: minmax(0, 1fr);
    }
}

.cs__main[b-lihnphjwax] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    min-width: 0;
}

.cs__cats[b-lihnphjwax],
.cs__sets[b-lihnphjwax] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.cs__navrow[b-lihnphjwax] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.cs__back[b-lihnphjwax] {
    padding: 3px 10px;
    border: 1px solid var(--line);
    border-radius: var(--r-pill);
    background: var(--surface-card);
    font-size: var(--fs-dense);
    color: var(--text-2);
    cursor: pointer;
}

.cs__back:hover[b-lihnphjwax] {
    border-color: var(--line-strong);
    color: var(--text-1);
}

.cs__crumb[b-lihnphjwax] {
    font-size: var(--fs-body);
    font-weight: 600;
    color: var(--text-1);
}

.cs__search[b-lihnphjwax] {
    padding: 7px 10px;
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    background: var(--surface-card);
    font-size: var(--fs-comfortable);
    color: var(--text-1);
}

.cs__loading[b-lihnphjwax],
.cs__empty[b-lihnphjwax],
.cs__source-hint[b-lihnphjwax] {
    margin: 0;
    font-size: var(--fs-comfortable);
    color: var(--text-3);
}
/* /Components/Import/Online/CategoryCard.razor.rz.scp.css */
/* Colour comes from tokens only (CONVENTIONS.md, enforced by check-web-color-literals.sh); tints are
   color-mix() over a token so they follow the theme rather than pinning a shade. */

.cc[b-aadz2q70zr] {
    display: flex;
    gap: 14px;
    width: 100%;
    padding: 16px;
    text-align: left;
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    background: var(--surface-card);
    cursor: pointer;
}

.cc:hover[b-aadz2q70zr] {
    border-color: var(--line-strong);
    background: var(--surface-card-2);
}

.cc--on[b-aadz2q70zr] {
    border-color: var(--accent);
    background: color-mix(in srgb, var(--accent) 8%, var(--surface-card));
}

.cc__mono[b-aadz2q70zr] {
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    border-radius: var(--r-sm);
    background: color-mix(in srgb, var(--accent) 14%, var(--surface-card-2));
    color: var(--accent);
    font-size: var(--fs-heading);
    font-weight: 600;
}

.cc__body[b-aadz2q70zr] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

.cc__name[b-aadz2q70zr] {
    font-size: var(--fs-body);
    font-weight: 600;
    color: var(--text-1);
}

.cc__desc[b-aadz2q70zr] {
    font-size: var(--fs-comfortable);
    line-height: 1.45;
    color: var(--text-2);
}

.cc__count[b-aadz2q70zr] {
    font-size: var(--fs-dense);
    color: var(--text-3);
}
/* /Components/Import/Online/DatasetCard.razor.rz.scp.css */
/* Tokens only — no hex, rgb(), hsl() or named colour (CONVENTIONS.md, enforced in CI). */

.dc[b-s1oso3v74j] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    width: 100%;
    padding: 16px;
    text-align: left;
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    background: var(--surface-card);
    cursor: pointer;
}

.dc:hover:not(:disabled)[b-s1oso3v74j] {
    border-color: var(--line-strong);
    background: var(--surface-card-2);
}

.dc--on[b-s1oso3v74j] {
    border-color: var(--accent);
    background: color-mix(in srgb, var(--accent) 8%, var(--surface-card));
}

/* Still legible, plainly not clickable: DR2 wants the card READ, not hidden. */
.dc--off[b-s1oso3v74j] {
    cursor: default;
    opacity: .62;
    border-style: dashed;
}

.dc__head[b-s1oso3v74j] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.dc__name[b-s1oso3v74j] {
    font-size: var(--fs-body);
    font-weight: 600;
    color: var(--text-1);
}

.dc__tag[b-s1oso3v74j] {
    padding: 1px 8px;
    border-radius: var(--r-pill);
    border: 1px solid var(--line);
    font-size: var(--fs-dense);
    color: var(--text-3);
}

.dc__tag--gated[b-s1oso3v74j] {
    border-color: color-mix(in srgb, var(--accent) 45%, var(--line));
    color: var(--accent);
}

.dc__tag--off[b-s1oso3v74j] {
    border-color: var(--caveat-warn-border);
    background: var(--caveat-warn-fill);
    color: var(--caveat-warn-accent);
}

.dc__sub[b-s1oso3v74j] {
    font-size: var(--fs-comfortable);
    color: var(--text-3);
}

.dc__desc[b-s1oso3v74j] {
    font-size: var(--fs-comfortable);
    line-height: 1.45;
    color: var(--text-2);
}

.dc__chips[b-s1oso3v74j] {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    margin-top: 4px;
}

.dc__chip[b-s1oso3v74j] {
    padding: 1px 8px;
    border-radius: var(--r-pill);
    background: var(--surface-card-2);
    font-size: var(--fs-dense);
    color: var(--text-3);
}
/* /Components/Import/Online/OnlineReviewStep.razor.rz.scp.css */
/* Tokens only — no hex, rgb(), hsl() or named colour (CONVENTIONS.md, enforced in CI). */

.ors__name[b-0zcmguqyqq] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin: 16px 0;
    max-width: 420px;
}

.ors__name-label[b-0zcmguqyqq] {
    font-size: var(--fs-dense);
    font-weight: 600;
    color: var(--text-3);
}

.ors__name-input[b-0zcmguqyqq] {
    padding: 7px 10px;
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    background: var(--surface-card);
    font-size: var(--fs-comfortable);
    color: var(--text-1);
}

.ors__recap[b-0zcmguqyqq] {
    display: flex;
    flex-direction: column;
    gap: 0;
    margin: 0 0 16px;
    padding: 0;
    list-style: none;
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    overflow: hidden;
}

.ors__recap-row[b-0zcmguqyqq] {
    display: grid;
    grid-template-columns: 190px minmax(0, 1fr) auto;
    gap: 12px;
    align-items: baseline;
    padding: 9px 14px;
    background: var(--surface-card);
}

.ors__recap-row + .ors__recap-row[b-0zcmguqyqq] {
    border-top: 1px solid var(--line);
}

.ors__recap-label[b-0zcmguqyqq] {
    font-size: var(--fs-dense);
    color: var(--text-3);
}

.ors__recap-value[b-0zcmguqyqq] {
    font-size: var(--fs-comfortable);
    color: var(--text-1);
    overflow-wrap: anywhere;
}

.ors__edit[b-0zcmguqyqq] {
    padding: 1px 10px;
    border: 1px solid var(--line);
    border-radius: var(--r-pill);
    background: transparent;
    font-size: var(--fs-dense);
    color: var(--text-2);
    cursor: pointer;
}

.ors__edit:hover[b-0zcmguqyqq] {
    border-color: var(--accent);
    color: var(--accent);
}

.ors__loading[b-0zcmguqyqq] {
    margin: 0;
    font-size: var(--fs-comfortable);
    color: var(--text-3);
}
/* /Components/Import/Online/OnlineSpecStep.razor.rz.scp.css */
/* Tokens only — no hex, rgb(), hsl() or named colour (CONVENTIONS.md, enforced in CI). */

.oss__field[b-fgibsp36ej] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-top: 18px;
}

.oss__label[b-fgibsp36ej] {
    font-size: var(--fs-body);
    font-weight: 600;
    color: var(--text-1);
}

.oss__req[b-fgibsp36ej] {
    color: var(--accent);
}

.oss__help[b-fgibsp36ej] {
    margin: 0 0 4px;
    font-size: var(--fs-comfortable);
    line-height: 1.45;
    color: var(--text-3);
}

.oss__search[b-fgibsp36ej],
.oss__text[b-fgibsp36ej] {
    padding: 7px 10px;
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    background: var(--surface-card);
    font-size: var(--fs-comfortable);
    color: var(--text-1);
}

.oss__list[b-fgibsp36ej] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    max-height: 340px;
    overflow-y: auto;
    padding: 2px;
}

/* Years are short and many: a wrapping chip row reads better than a column. */
.oss__list--years[b-fgibsp36ej] {
    flex-direction: row;
    flex-wrap: wrap;
    max-height: none;
}

.oss__opt[b-fgibsp36ej] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 8px 12px;
    text-align: left;
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    background: var(--surface-card);
    cursor: pointer;
}

.oss__list--years .oss__opt[b-fgibsp36ej] {
    border-radius: var(--r-pill);
    padding: 5px 14px;
}

.oss__opt:hover:not(:disabled)[b-fgibsp36ej] {
    border-color: var(--line-strong);
    background: var(--surface-card-2);
}

.oss__opt--on[b-fgibsp36ej] {
    border-color: var(--accent);
    background: color-mix(in srgb, var(--accent) 10%, var(--surface-card));
}

/* Offered, legible, and plainly not choosable — DR5 wants the absence explained, not hidden. */
.oss__opt--off[b-fgibsp36ej] {
    cursor: default;
    opacity: .6;
    border-style: dashed;
}

.oss__opt-label[b-fgibsp36ej] {
    font-size: var(--fs-comfortable);
    color: var(--text-1);
}

.oss__opt-detail[b-fgibsp36ej] {
    font-size: var(--fs-dense);
    color: var(--text-3);
}

.oss__toggle[b-fgibsp36ej] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: var(--fs-comfortable);
    color: var(--text-1);
}

.oss__cap[b-fgibsp36ej] {
    margin: 2px 0 0;
    font-size: var(--fs-dense);
    color: var(--text-3);
}

.oss__cap-hit[b-fgibsp36ej] {
    display: block;
    margin-top: 2px;
    color: var(--caveat-warn-accent);
}

.oss__loading[b-fgibsp36ej],
.oss__empty[b-fgibsp36ej] {
    margin: 0;
    font-size: var(--fs-comfortable);
    color: var(--text-3);
}
/* /Components/Import/ReadAsStep.razor.rz.scp.css */
/* Step 2 — Read as: choices left, live preview right. */

.ra__grid[b-ls47db1908] {
    display: grid;
    grid-template-columns: minmax(320px, 2fr) minmax(0, 3fr);
    gap: 24px;
    align-items: start;
}

.ra__left[b-ls47db1908],
.ra__right[b-ls47db1908] {
    display: flex;
    flex-direction: column;
    gap: 14px;
    min-width: 0;
}

.ra__detected[b-ls47db1908] {
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--status-ok);
}

.ra__kind[b-ls47db1908] {
    font-size: var(--fs-comfortable);
    font-weight: 600;
    color: var(--text-1);
}

.ra__badge[b-ls47db1908] {
    padding: 1px 8px;
    border-radius: var(--r-pill);
    background: color-mix(in srgb, var(--status-ok) 18%, transparent);
    color: var(--status-ok);
    font-size: var(--fs-dense);
    font-weight: 600;
}

.ra__note[b-ls47db1908] {
    margin: 0;
    font-size: var(--fs-body);
    color: var(--text-3);
}

.ra__waiting[b-ls47db1908] {
    padding: 24px;
    border: 1px dashed var(--line-strong);
    border-radius: var(--r-md);
    text-align: center;
    font-size: var(--fs-body);
    color: var(--text-3);
}

@media (max-width: 1100px) {
    .ra__grid[b-ls47db1908] {
        grid-template-columns: minmax(0, 1fr);
    }
}
/* /Components/Import/ReviewStep.razor.rz.scp.css */
/* Step 6 — Review: checks left, recap + on-run right (artboard 09). */

.rv__grid[b-w8fyaybjay] {
    display: grid;
    grid-template-columns: minmax(0, 3fr) minmax(300px, 2fr);
    gap: 24px;
    align-items: start;
}

.rv__left[b-w8fyaybjay],
.rv__right[b-w8fyaybjay] {
    display: flex;
    flex-direction: column;
    gap: 14px;
    min-width: 0;
}

.rv__counts[b-w8fyaybjay] {
    display: flex;
    gap: 10px;
}

.rv__pill[b-w8fyaybjay] {
    padding: 6px 14px;
    border: 1px solid var(--line-strong);
    border-radius: var(--r-pill);
    font-size: var(--fs-comfortable);
    color: var(--text-2);
}

.rv__pill--warn[b-w8fyaybjay] {
    border-color: var(--caveat-warn-accent);
    background: var(--caveat-warn-fill);
    color: var(--caveat-warn-accent);
}

.rv__pill--err[b-w8fyaybjay] {
    border-color: var(--caveat-err-accent);
    background: var(--caveat-err-fill);
    color: var(--caveat-err-accent);
}

.rv__checks[b-w8fyaybjay] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.rv__onrun[b-w8fyaybjay] {
    padding: 14px 16px;
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    background: var(--surface-card);
    font-size: var(--fs-comfortable);
    line-height: 1.5;
    color: var(--text-2);
}

.rv__onrun p[b-w8fyaybjay] {
    margin: 6px 0 0;
}

.rv__onrun-title[b-w8fyaybjay] {
    font-size: var(--fs-dense);
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--text-3);
}

.rv__facts[b-w8fyaybjay] {
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid var(--line);
    font-family: var(--font-mono);
    font-size: var(--fs-body);
    color: var(--text-3);
}

@media (max-width: 1100px) {
    .rv__grid[b-w8fyaybjay] {
        grid-template-columns: minmax(0, 1fr);
    }
}
/* /Components/Import/RunStep.razor.rz.scp.css */
/* Step 7 — Run: facts left, progress right. */

.rs__grid[b-lao1psi9qn] {
    display: grid;
    grid-template-columns: minmax(300px, 2fr) minmax(0, 3fr);
    gap: 24px;
    align-items: start;
}

.rs__left[b-lao1psi9qn],
.rs__right[b-lao1psi9qn] {
    display: flex;
    flex-direction: column;
    gap: 14px;
    min-width: 0;
}

@media (max-width: 1100px) {
    .rs__grid[b-lao1psi9qn] {
        grid-template-columns: minmax(0, 1fr);
    }
}
/* /Components/Import/SourceChoice.razor.rz.scp.css */
.sc[b-jnjgoglgmb] {
    display: inline-flex;
    padding: 3px;
    border: 1px solid var(--line-strong);
    border-radius: var(--r-pill);
    background: var(--surface-card);
}

.sc__seg[b-jnjgoglgmb] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 16px;
    border: 0;
    border-radius: var(--r-pill);
    background: transparent;
    color: var(--text-2);
    font: inherit;
    font-size: var(--fs-comfortable);
    cursor: pointer;
}

.sc__seg:disabled[b-jnjgoglgmb] {
    color: var(--text-4);
    cursor: default;
}

.sc__seg--on[b-jnjgoglgmb] {
    background: var(--accent);
    color: var(--accent-on);
    font-weight: 600;
}

.sc__seg:focus-visible[b-jnjgoglgmb] {
    outline: 2px solid var(--workspace-accent);
    outline-offset: 1px;
}
/* /Components/Import/SourceStep.razor.rz.scp.css */
/* Step 1 — Source & detect (artboards 01d / 02 / 03). */

.ss__top[b-w47pn6fct1] {
    display: flex;
    align-items: center;
    gap: 24px;
    margin: 0 0 18px;
}

.ss__sub[b-w47pn6fct1] {
    display: flex;
    align-items: center;
    gap: 18px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.ss__sub-item[b-w47pn6fct1] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: var(--fs-comfortable);
    color: var(--text-3);
}

.ss__n[b-w47pn6fct1] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    border: 1px solid var(--line-strong);
    font-size: var(--fs-dense);
}

.ss__sub-item--on[b-w47pn6fct1] {
    color: var(--text-1);
}

.ss__sub-item--on .ss__n[b-w47pn6fct1] {
    border-color: var(--workspace-accent);
    color: var(--workspace-accent);
}

.ss__sub-item--done .ss__n[b-w47pn6fct1] {
    border-color: var(--accent);
    background: var(--accent);
    color: var(--accent-on);
}

.ss__grid[b-w47pn6fct1] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 300px;
    gap: 24px;
    align-items: start;
}

.ss__main[b-w47pn6fct1] {
    display: flex;
    flex-direction: column;
    gap: 14px;
    min-width: 0;
}

.ss__parts[b-w47pn6fct1] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.ss__parts-label[b-w47pn6fct1],
.ss__parked-title[b-w47pn6fct1] {
    font-size: var(--fs-dense);
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--text-3);
}

.ss__parts-grid[b-w47pn6fct1] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}

.ss__part[b-w47pn6fct1] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 10px 12px;
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    background: var(--surface-card);
    font-size: var(--fs-body);
    color: var(--text-3);
}

.ss__part code[b-w47pn6fct1],
.ss__parked-row code[b-w47pn6fct1] {
    font-family: var(--font-mono);
    font-size: var(--fs-body);
    color: var(--text-1);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ss__detect[b-w47pn6fct1] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 14px 16px;
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    background: var(--surface-card);
}

.ss__detect-head[b-w47pn6fct1] {
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--status-ok);
}

.ss__detect-title[b-w47pn6fct1] {
    font-size: var(--fs-comfortable);
    font-weight: 600;
    color: var(--text-1);
}

.ss__badge[b-w47pn6fct1] {
    padding: 1px 8px;
    border-radius: var(--r-pill);
    background: color-mix(in srgb, var(--status-ok) 18%, transparent);
    color: var(--status-ok);
    font-size: var(--fs-dense);
    font-weight: 600;
}

.ss__chips[b-w47pn6fct1] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.ss__chip[b-w47pn6fct1] {
    padding: 2px 10px;
    border: 1px solid var(--line-strong);
    border-radius: var(--r-pill);
    font-family: var(--font-mono);
    font-size: var(--fs-dense);
    color: var(--text-2);
}

.ss__chip--warn[b-w47pn6fct1] {
    border-color: var(--caveat-warn-border);
    color: var(--caveat-warn-accent);
}

.ss__next[b-w47pn6fct1] {
    margin: 0;
    font-size: var(--fs-body);
    color: var(--text-3);
}

.ss__parked[b-w47pn6fct1] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 14px 16px;
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    background: var(--surface-card);
}

.ss__parked-title[b-w47pn6fct1] {
    text-transform: none;
    letter-spacing: 0;
    font-size: var(--fs-comfortable);
    color: var(--text-1);
}

.ss__parked-sub[b-w47pn6fct1] {
    font-size: var(--fs-body);
    color: var(--text-3);
}

.ss__parked-row[b-w47pn6fct1] {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 8px 12px;
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    background: var(--surface-card-2);
    font-size: var(--fs-body);
    color: var(--text-3);
}

.ss__side[b-w47pn6fct1] {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

@media (max-width: 1100px) {
    .ss__grid[b-w47pn6fct1] {
        grid-template-columns: minmax(0, 1fr);
    }
}
/* /Components/Import/SummaryStep.razor.rz.scp.css */
/* Step 8 — Summary: what landed · result · next (artboard 12). */

.su__grid[b-7i9zh20b14] {
    display: grid;
    grid-template-columns: minmax(0, 4fr) minmax(0, 4fr) minmax(260px, 3fr);
    gap: 20px;
    align-items: start;
}

.su__dataset[b-7i9zh20b14],
.su__result[b-7i9zh20b14],
.su__next[b-7i9zh20b14] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-width: 0;
    padding: 14px 16px;
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    background: var(--surface-card);
}

.su__dataset[b-7i9zh20b14] {
    padding: 0;
    overflow: hidden;
}

.su__ds-head[b-7i9zh20b14] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 14px;
    background: var(--surface-card-2);
    font-size: var(--fs-comfortable);
    font-weight: 600;
    color: var(--text-1);
}

.su__ds-head code[b-7i9zh20b14] {
    margin-left: auto;
    font-family: var(--font-mono);
    font-size: var(--fs-body);
    font-weight: 400;
    color: var(--text-3);
}

.su__var[b-7i9zh20b14] {
    padding: 8px 14px;
    border-top: 1px solid var(--line);
    font-size: var(--fs-comfortable);
    color: var(--text-1);
}

.su__kicker[b-7i9zh20b14] {
    font-size: var(--fs-dense);
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--text-3);
}

.su__fact[b-7i9zh20b14] {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 12px;
    padding: 6px 0;
    border-bottom: 1px solid var(--line);
    font-size: var(--fs-comfortable);
    color: var(--text-2);
}

.su__fact code[b-7i9zh20b14] {
    font-family: var(--font-mono);
    font-weight: 600;
    color: var(--text-1);
}

.su__log summary[b-7i9zh20b14] {
    cursor: pointer;
    font-size: var(--fs-body);
    color: var(--accent);
}

.su__log pre[b-7i9zh20b14] {
    margin: 8px 0 0;
    max-height: 200px;
    overflow: auto;
    padding: 10px 12px;
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    background: var(--surface-card-2);
    font-family: var(--font-mono);
    font-size: var(--fs-body);
    line-height: 1.5;
    color: var(--text-2);
    white-space: pre-wrap;
}

.su__btn[b-7i9zh20b14] {
    box-sizing: border-box;
    width: 100%;
    padding: 10px 14px;
    border: 1px solid var(--line-strong);
    border-radius: var(--r-md);
    background: var(--surface-card-2);
    color: var(--text-1);
    font: inherit;
    font-size: var(--fs-comfortable);
    cursor: pointer;
}

.su__btn:disabled[b-7i9zh20b14] {
    color: var(--text-4);
    cursor: default;
}

.su__btn--primary[b-7i9zh20b14] {
    border-color: var(--accent);
    background: var(--accent);
    color: var(--accent-on);
    font-weight: 600;
}

.su__btn--danger[b-7i9zh20b14] {
    border-color: var(--caveat-err-border);
    background: var(--caveat-err-fill);
    color: var(--caveat-err-accent);
}

.su__btn:focus-visible[b-7i9zh20b14] {
    outline: 2px solid var(--workspace-accent);
    outline-offset: 2px;
}

.su__note[b-7i9zh20b14] {
    margin: 0;
    font-size: var(--fs-body);
    line-height: 1.45;
    color: var(--text-3);
}

@media (max-width: 1100px) {
    .su__grid[b-7i9zh20b14] {
        grid-template-columns: minmax(0, 1fr);
    }
}
/* /Components/Import/TimeStep.razor.rz.scp.css */
/* Step 4 — Time: mode cards, then the mode's fields left and the parsed preview right. */

.ts__grid[b-sc7tw7ga5m] {
    display: grid;
    grid-template-columns: minmax(360px, 3fr) minmax(0, 2fr);
    gap: 24px;
    align-items: start;
    margin-top: 16px;
}

.ts__left[b-sc7tw7ga5m],
.ts__right[b-sc7tw7ga5m] {
    display: flex;
    flex-direction: column;
    gap: 14px;
    min-width: 0;
}

.ts__code[b-sc7tw7ga5m] {
    padding: 0 6px;
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    font-family: var(--font-mono);
    font-size: var(--fs-body);
    color: var(--text-1);
}

.ts__orders[b-sc7tw7ga5m] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.ts__order[b-sc7tw7ga5m] {
    display: grid;
    grid-template-columns: 16px minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 12px;
    padding: 10px 12px;
    border: 1px solid var(--line-strong);
    border-radius: var(--r-md);
    background: var(--surface-card-2);
    color: var(--text-1);
    font: inherit;
    font-size: var(--fs-comfortable);
    text-align: left;
    cursor: pointer;
}

.ts__order--on[b-sc7tw7ga5m] {
    border-color: var(--workspace-accent);
    background: color-mix(in srgb, var(--workspace-accent) 18%, var(--surface-card));
}

.ts__order:focus-visible[b-sc7tw7ga5m] {
    outline: 2px solid var(--workspace-accent);
    outline-offset: 2px;
}

.ts__order-dot[b-sc7tw7ga5m] {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    border: 2px solid var(--line-strong);
}

.ts__order--on .ts__order-dot[b-sc7tw7ga5m] {
    border-color: var(--workspace-accent);
    background: var(--workspace-accent);
}

.ts__order-label[b-sc7tw7ga5m] {
    font-weight: 600;
}

.ts__order-pattern[b-sc7tw7ga5m],
.ts__order-example[b-sc7tw7ga5m] {
    font-family: var(--font-mono);
    font-size: var(--fs-body);
    color: var(--text-3);
}

.ts__order--on .ts__order-example[b-sc7tw7ga5m] {
    color: var(--text-1);
}

.ts__foot[b-sc7tw7ga5m] {
    margin: 0;
    font-size: var(--fs-body);
    color: var(--text-3);
}

.ts__foot b[b-sc7tw7ga5m] {
    color: var(--text-1);
}

.ts__waiting[b-sc7tw7ga5m] {
    padding: 24px;
    border: 1px dashed var(--line-strong);
    border-radius: var(--r-md);
    text-align: center;
    font-size: var(--fs-body);
    color: var(--text-3);
}

@media (max-width: 1100px) {
    .ts__grid[b-sc7tw7ga5m] {
        grid-template-columns: minmax(0, 1fr);
    }
}
/* /Components/Import/VariablesStep.razor.rz.scp.css */
/* Step 5 — Variables: missing-code bar + bulk bar, then the row-per-column grid (artboard 07). */

.vs__top[b-d1ykhm4dgn] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 280px;
    gap: 16px;
    margin-bottom: 14px;
}

.vs__missing[b-d1ykhm4dgn],
.vs__bulk[b-d1ykhm4dgn] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 14px 16px;
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    background: var(--surface-card);
}

.vs__missing-head[b-d1ykhm4dgn] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}

.vs__missing-title[b-d1ykhm4dgn] {
    font-size: var(--fs-comfortable);
    font-weight: 600;
    color: var(--text-1);
}

.vs__code[b-d1ykhm4dgn] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 2px 8px 2px 10px;
    border-radius: var(--r-pill);
    background: var(--surface-card-2);
    border: 1px solid var(--line-strong);
    font-family: var(--font-mono);
    font-size: var(--fs-body);
    color: var(--text-1);
}

.vs__x[b-d1ykhm4dgn] {
    padding: 0;
    border: 0;
    background: none;
    color: var(--text-3);
    font: inherit;
    cursor: pointer;
}

.vs__add[b-d1ykhm4dgn] {
    box-sizing: border-box;
    height: 28px;
    min-width: 160px;
    padding: 0 10px;
    border: 1px dashed var(--line-strong);
    border-radius: var(--r-pill);
    background: transparent;
    color: var(--text-1);
    font: inherit;
    font-family: var(--font-mono);
    font-size: var(--fs-body);
}

.vs__missing-sub[b-d1ykhm4dgn] {
    font-size: var(--fs-body);
    line-height: 1.45;
    color: var(--text-3);
}

.vs__missing-sub b[b-d1ykhm4dgn] {
    color: var(--text-2);
}

.vs__bulk-title[b-d1ykhm4dgn] {
    font-size: var(--fs-comfortable);
    color: var(--text-1);
}

.vs__bulk-actions[b-d1ykhm4dgn] {
    display: flex;
    gap: 8px;
}

.vs__btn[b-d1ykhm4dgn] {
    padding: 5px 12px;
    border: 1px solid var(--line-strong);
    border-radius: var(--r-sm);
    background: var(--surface-card-2);
    color: var(--text-1);
    font: inherit;
    font-size: var(--fs-body);
    cursor: pointer;
}

.vs__btn:focus-visible[b-d1ykhm4dgn] {
    outline: 2px solid var(--workspace-accent);
    outline-offset: 1px;
}

.vs__grid[b-d1ykhm4dgn] {
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    background: var(--surface-card);
    overflow: hidden;
}

.vs__row[b-d1ykhm4dgn] {
    display: grid;
    grid-template-columns: 40px minmax(180px, 1.4fr) 150px 170px 140px minmax(160px, 1.6fr);
    align-items: center;
    gap: 10px;
    min-height: 40px;
    padding: 4px 12px;
    border-top: 1px solid var(--line);
}

.vs__row--header[b-d1ykhm4dgn] {
    border-top: 0;
    background: var(--surface-card-2);
    min-height: 34px;
}

.vs__row--off .vs__c--name[b-d1ykhm4dgn],
.vs__row--off .vs__c--samples[b-d1ykhm4dgn] {
    opacity: .55;
}

.vs__c[b-d1ykhm4dgn] {
    min-width: 0;
}

.vs__row--header .vs__c[b-d1ykhm4dgn] {
    font-size: var(--fs-dense);
    font-weight: 600;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--text-3);
}

.vs__sr[b-d1ykhm4dgn] {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
}

.vs__name[b-d1ykhm4dgn],
.vs__miss[b-d1ykhm4dgn],
.vs__select[b-d1ykhm4dgn] {
    box-sizing: border-box;
    width: 100%;
    height: 30px;
    padding: 0 8px;
    border: 1px solid var(--line-strong);
    border-radius: var(--r-sm);
    background: var(--surface-card-2);
    color: var(--text-1);
    font: inherit;
    font-size: var(--fs-body);
}

.vs__name:focus-visible[b-d1ykhm4dgn],
.vs__miss:focus-visible[b-d1ykhm4dgn],
.vs__select:focus-visible[b-d1ykhm4dgn] {
    outline: 2px solid var(--workspace-accent);
    outline-offset: 1px;
}

.vs__select:disabled[b-d1ykhm4dgn] {
    color: var(--text-3);
}

.vs__miss[b-d1ykhm4dgn] {
    font-family: var(--font-mono);
}

.vs__source[b-d1ykhm4dgn] {
    display: block;
    margin-top: 2px;
    font-size: var(--fs-dense);
    color: var(--text-4);
}

.vs__misscount[b-d1ykhm4dgn] {
    display: block;
    margin-top: 2px;
    font-size: var(--fs-dense);
    color: var(--text-3);
    white-space: nowrap;
}

.vs__source code[b-d1ykhm4dgn],
.vs__samples[b-d1ykhm4dgn] {
    font-family: var(--font-mono);
    font-size: var(--fs-body);
}

.vs__type[b-d1ykhm4dgn] {
    position: relative;
}

.vs__lock[b-d1ykhm4dgn] {
    position: absolute;
    right: 8px;
    top: 50%;
    transform: translateY(-50%);
    font-size: var(--fs-dense);
    color: var(--caveat-warn-accent);
    pointer-events: none;
}

.vs__samples[b-d1ykhm4dgn] {
    display: block;
    color: var(--text-2);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.vs__notice[b-d1ykhm4dgn] {
    padding: 4px 12px 10px 62px;
}

.vs__foot[b-d1ykhm4dgn] {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    margin: 12px 0 14px;
    font-size: var(--fs-body);
    color: var(--text-3);
}

@media (max-width: 1100px) {
    .vs__top[b-d1ykhm4dgn] {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* Role flags (D2c Wave 3, imports A10): multi-flag toggles, as on the desktop variable card.
   Replaces the single-select role dropdown, which could not express Count + Grouping. */
.vs__flags[b-d1ykhm4dgn] {
    display: flex;
    flex-wrap: wrap;
    gap: 4px 6px;
}

.vs__flag[b-d1ykhm4dgn] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 1px 6px 1px 4px;
    border: 1px solid var(--border-2);
    border-radius: 999px;
    font-size: var(--fs-dense);
    line-height: 18px;
    color: var(--text-2);
    cursor: pointer;
    user-select: none;
}

.vs__flag input[b-d1ykhm4dgn] {
    margin: 0;
    width: 12px;
    height: 12px;
}

.vs__flag--on[b-d1ykhm4dgn] {
    border-color: var(--workspace-accent);
    color: var(--text-1);
    font-weight: 600;
}

.vs__flag:has(input:disabled)[b-d1ykhm4dgn] {
    opacity: .5;
    cursor: default;
}

.vs__flag:focus-within[b-d1ykhm4dgn] {
    outline: 2px solid var(--workspace-accent);
    outline-offset: 1px;
}

.vs__rolefixed[b-d1ykhm4dgn] {
    font-size: var(--fs-dense);
    color: var(--text-3);
    font-style: italic;
}
/* /Components/Map/BasemapPicker.razor.rz.scp.css */
/* Compact density (C0 D7): 7px padding, 24px controls, 11px body, 10px secondary. */

.basemap-picker[b-6xzaqgwpwu] {
    width: 244px;
    max-height: 320px;
    overflow-y: auto;
    padding: 7px;
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    background: var(--surface-card);
    box-shadow: var(--shadow-lg);
    font-family: var(--font-ui);
    font-size: 11px;
    color: var(--text-2);
}

.basemap-picker__header[b-6xzaqgwpwu] {
    display: flex;
    align-items: center;
    gap: 6px;
    height: 18px;
    margin-bottom: 6px;
}

.basemap-picker__title[b-6xzaqgwpwu] {
    flex: 1;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: .04em;
    color: var(--text-3);
}

.basemap-picker__count[b-6xzaqgwpwu] {
    font-family: var(--font-mono);
    font-size: 10px;
    color: var(--text-4);
}

.basemap-picker__close[b-6xzaqgwpwu] {
    width: 16px;
    height: 16px;
    padding: 0;
    border: none;
    background: transparent;
    color: var(--text-3);
    font-size: 10px;
    line-height: 1;
    cursor: pointer;
}

.basemap-picker__close:hover[b-6xzaqgwpwu] {
    color: var(--text-1);
}

.basemap-picker__filter[b-6xzaqgwpwu] {
    width: 100%;
    height: 24px;
    margin-bottom: 7px;
    padding: 0 6px;
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    background: var(--surface-card-2);
    color: var(--text-1);
    font-family: var(--font-ui);
    font-size: 11px;
}

.basemap-picker__filter:focus-visible[b-6xzaqgwpwu] {
    outline: none;
    border-color: var(--workspace-accent);
    box-shadow: var(--shadow-focus);
}

.basemap-picker__grid[b-6xzaqgwpwu] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 6px;
}

.basemap-tile[b-6xzaqgwpwu] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 3px;
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    background: var(--surface-card-2);
    color: var(--text-2);
    font-family: var(--font-ui);
    font-size: 10px;
    text-align: left;
    cursor: pointer;
    transition: border-color var(--dur-fast) var(--ease-standard);
}

.basemap-tile:hover[b-6xzaqgwpwu] {
    border-color: var(--line-strong);
    color: var(--text-1);
}

.basemap-tile--active[b-6xzaqgwpwu],
.basemap-tile--active:hover[b-6xzaqgwpwu] {
    border-color: var(--workspace-accent);
    box-shadow: inset 0 0 0 1px var(--workspace-accent);
    color: var(--text-1);
}

.basemap-tile:focus-visible[b-6xzaqgwpwu] {
    outline: none;
    box-shadow: var(--shadow-focus);
}

.basemap-tile__name[b-6xzaqgwpwu] {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

/* The previews are drawn from tokens, not fetched. Each one says only what its CATEGORY is:
   cartography (banded), photography (dense and dark), or nothing at all (dashed). */
.basemap-tile__preview[b-6xzaqgwpwu] {
    display: block;
    height: 34px;
    border-radius: 2px;
}

.basemap-tile__preview--standard[b-6xzaqgwpwu] {
    background:
        repeating-linear-gradient(
            114deg,
            var(--surface-card-3) 0 9px,
            color-mix(in srgb, var(--surface-card-3) 80%, var(--line-strong)) 9px 11px);
}

.basemap-tile__preview--satellite[b-6xzaqgwpwu] {
    background:
        radial-gradient(
            circle at 30% 35%,
            color-mix(in srgb, var(--text-2) 45%, var(--surface-card-3)) 0 30%,
            color-mix(in srgb, var(--text-1) 65%, var(--surface-card-3)) 100%);
}

.basemap-tile__preview--none[b-6xzaqgwpwu] {
    border: 1px dashed var(--line-strong);
    background: var(--surface-card);
}

.basemap-picker__empty[b-6xzaqgwpwu] {
    margin: 6px 0 0;
    font-size: 10px;
    line-height: 1.45;
    color: var(--text-3);
}
/* /Components/Map/BreakTable.razor.rz.scp.css */
/* Artboard C: swatch / lower / editable upper break / count, then a Missing row.
   22px rows — Compact density (decision D7). */

.break-table[b-vx2bws89hu] {
    margin-top: 8px;
}

.break-table__head[b-vx2bws89hu],
.break-table__row[b-vx2bws89hu] {
    display: grid;
    grid-template-columns: 18px 1fr 96px 64px;
    align-items: center;
    gap: 7px;
    height: 22px;
}

.break-table__head[b-vx2bws89hu] {
    height: 18px;
    font-size: 9px;
    font-weight: 600;
    letter-spacing: .04em;
    color: var(--text-3);
    text-transform: uppercase;
}

.break-table__col--count[b-vx2bws89hu],
.break-table__count[b-vx2bws89hu] {
    text-align: right;
}

.break-table__row + .break-table__row[b-vx2bws89hu] {
    border-top: 1px solid var(--line);
}

.break-table__row--missing[b-vx2bws89hu] {
    color: var(--text-3);
}

.break-table__swatch[b-vx2bws89hu] {
    width: 16px;
    height: 16px;
    border: 1px solid var(--line-strong);
    border-radius: 2px;
}

.break-table__lower[b-vx2bws89hu],
.break-table__upper[b-vx2bws89hu],
.break-table__count[b-vx2bws89hu] {
    font-family: var(--font-mono);
    font-size: 10px;
    color: var(--text-2);
}

.break-table__upper--max[b-vx2bws89hu] {
    color: var(--text-3);
}

.break-table__input[b-vx2bws89hu] {
    width: 100%;
    height: 20px;
    padding: 0 5px;
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    background: var(--surface-card-2);
    color: var(--text-1);
    font-family: var(--font-mono);
    font-size: 10px;
    text-align: right;
}

.break-table__input:focus-visible[b-vx2bws89hu] {
    outline: none;
    border-color: var(--workspace-accent);
    box-shadow: var(--shadow-focus);
}

.break-table__input:disabled[b-vx2bws89hu] {
    color: var(--text-4);
}

/* The "switched to Custom" disclosure. It exists because the classification dropdown appears to
   change by itself when a break is edited, and an unexplained change reads as a bug. */
.break-table__note[b-vx2bws89hu] {
    margin: 6px 0 0;
    font-size: 10px;
    line-height: 1.4;
    color: var(--status-info);
}
/* /Components/Map/ClassificationHistogram.razor.rz.scp.css */
/* Artboard C: bars coloured by class, dashed draggable break lines, domain endpoints beneath. */

.class-histogram[b-nldbpede3g] {
    position: relative;
    height: 132px;
    margin: 8px 0;
    padding: 6px 6px 16px;
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    background: var(--plot-bg);
    touch-action: none;
}

.class-histogram__bars[b-nldbpede3g] {
    display: flex;
    align-items: flex-end;
    gap: 1px;
    height: 100%;
}

.class-histogram__bar[b-nldbpede3g] {
    flex: 1;
    min-height: 1px;
    border-radius: 1px 1px 0 0;
}

.class-histogram__empty[b-nldbpede3g] {
    align-self: center;
    margin: auto;
    font-size: 10px;
    color: var(--text-3);
}

.class-histogram__break[b-nldbpede3g] {
    position: absolute;
    top: 4px;
    bottom: 16px;
    width: 9px;
    margin-left: -4px;
    border-left: 1px dashed var(--text-1);
    cursor: ew-resize;
}

/* While a break is being dragged the bars must not swallow the pointer, or the plot stops
   receiving pointermove the moment the cursor crosses one. */
.class-histogram--dragging .class-histogram__bar[b-nldbpede3g] {
    pointer-events: none;
}

.class-histogram--static .class-histogram__break[b-nldbpede3g] {
    cursor: default;
    pointer-events: none;
}

.class-histogram__break--dragging[b-nldbpede3g] {
    border-left-color: var(--workspace-accent);
}

.class-histogram__break-value[b-nldbpede3g] {
    position: absolute;
    top: -2px;
    left: 3px;
    padding: 0 2px;
    background: color-mix(in srgb, var(--plot-bg) 85%, transparent);
    font-family: var(--font-mono);
    font-size: 9px;
    color: var(--text-2);
    white-space: nowrap;
}

.class-histogram__axis[b-nldbpede3g] {
    position: absolute;
    right: 6px;
    bottom: 3px;
    left: 6px;
    display: flex;
    justify-content: space-between;
    font-family: var(--font-mono);
    font-size: 9px;
    color: var(--text-3);
}
/* /Components/Map/ClassStepper.razor.rz.scp.css */
.class-stepper[b-ia77p4w7gn] {
    display: inline-flex;
    align-items: stretch;
    height: 24px;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    background: var(--surface-card-2);
}

.class-stepper__button[b-ia77p4w7gn] {
    width: 22px;
    border: none;
    background: transparent;
    color: var(--text-2);
    font-size: 13px;
    line-height: 1;
    cursor: pointer;
}

.class-stepper__button:hover:not(:disabled)[b-ia77p4w7gn] {
    background: var(--surface-card-3);
    color: var(--text-1);
}

.class-stepper__button:disabled[b-ia77p4w7gn] {
    color: var(--text-4);
    cursor: default;
}

.class-stepper__value[b-ia77p4w7gn] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 30px;
    border-inline: 1px solid var(--line);
    font-family: var(--font-mono);
    font-size: 11px;
    color: var(--text-1);
}
/* /Components/Map/ColorRampSelect.razor.rz.scp.css */
/* Artboard C: swatch, name dropdown, Reverse. */

.ramp-select[b-rb7h26omh1] {
    display: flex;
    align-items: center;
    gap: 7px;
    margin: 8px 0;
}

/* Hard colour STOPS, not a smooth gradient: a classed ramp paints discrete classes, and a
   smooth preview would promise the continuous rendering C1 deliberately does not have. */
.ramp-select__preview[b-rb7h26omh1] {
    flex: none;
    width: 76px;
    height: 24px;
    border: 1px solid var(--line-strong);
    border-radius: var(--r-sm);
}

.ramp-select__list[b-rb7h26omh1] {
    flex: 1;
    height: 24px;
    padding: 0 6px;
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    background: var(--surface-card-2);
    color: var(--text-1);
    font-family: var(--font-ui);
    font-size: 11px;
}

.ramp-select__reverse[b-rb7h26omh1] {
    height: 24px;
    padding: 0 8px;
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    background: var(--surface-card-2);
    color: var(--text-2);
    font-family: var(--font-ui);
    font-size: 11px;
    cursor: pointer;
}

.ramp-select__reverse--on[b-rb7h26omh1] {
    border-color: var(--workspace-accent);
    background: var(--workspace-accent);
    color: var(--workspace-accent-ink);
}
/* /Components/Map/LayerList.razor.rz.scp.css */
/* Compact density (C0 D7): 22px rows, 7px padding, 11px body, 10px secondary. */

.layer-list[b-x3kdeoq3oc] {
    width: 288px;
    max-height: 320px;
    overflow-y: auto;
    padding: 7px;
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    background: var(--surface-card);
    box-shadow: var(--shadow-lg);
    font-family: var(--font-ui);
    font-size: 11px;
    color: var(--text-2);
}

.layer-list__header[b-x3kdeoq3oc] {
    display: flex;
    align-items: center;
    gap: 6px;
    height: 18px;
    margin-bottom: 4px;
}

.layer-list__title[b-x3kdeoq3oc] {
    flex: 1;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: .04em;
    color: var(--text-3);
}

.layer-list__count[b-x3kdeoq3oc] {
    font-family: var(--font-mono);
    font-size: 10px;
    color: var(--text-4);
}

.layer-list__close[b-x3kdeoq3oc] {
    width: 16px;
    height: 16px;
    padding: 0;
    border: none;
    background: transparent;
    color: var(--text-3);
    font-size: 10px;
    line-height: 1;
    cursor: pointer;
}

.layer-list__close:hover[b-x3kdeoq3oc] {
    color: var(--text-1);
}

.layer-list__row[b-x3kdeoq3oc] {
    display: flex;
    align-items: center;
    gap: 4px;
    height: 22px;
    padding: 0 2px;
    border-radius: var(--r-sm);
}

.layer-list__row:hover[b-x3kdeoq3oc] {
    background: var(--surface-card-2);
}

/* A hidden layer stays legible — it is still a row the user has to find again. */
.layer-list__row--hidden .layer-list__names[b-x3kdeoq3oc] {
    opacity: .55;
}

.layer-list__visible[b-x3kdeoq3oc] {
    width: 12px;
    height: 12px;
    margin: 0;
    accent-color: var(--workspace-accent);
    cursor: pointer;
}

.layer-list__swatch[b-x3kdeoq3oc] {
    flex: none;
    width: 11px;
    height: 11px;
    border: 1px solid var(--line-strong);
    border-radius: 2px;
}

.layer-list__swatch--point[b-x3kdeoq3oc] {
    border-radius: 50%;
}

.layer-list__names[b-x3kdeoq3oc] {
    display: flex;
    flex: 1;
    min-width: 0;
    flex-direction: column;
    line-height: 1.1;
}

.layer-list__name[b-x3kdeoq3oc] {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    color: var(--text-1);
}

.layer-list__source[b-x3kdeoq3oc] {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-size: 10px;
    color: var(--text-4);
}

.layer-list__act[b-x3kdeoq3oc] {
    flex: none;
    width: 16px;
    height: 16px;
    padding: 0;
    border: none;
    border-radius: 2px;
    background: transparent;
    color: var(--text-3);
    font-family: var(--font-ui);
    font-size: 9px;
    line-height: 1;
    cursor: pointer;
}

.layer-list__act:hover:not(:disabled)[b-x3kdeoq3oc] {
    background: var(--surface-card-3);
    color: var(--text-1);
}

.layer-list__act:disabled[b-x3kdeoq3oc] {
    opacity: .35;
    cursor: default;
}

.layer-list__act--on[b-x3kdeoq3oc] {
    background: var(--workspace-accent);
    color: var(--workspace-accent-ink);
}

.layer-list__act--danger:hover:not(:disabled)[b-x3kdeoq3oc] {
    color: var(--status-err);
}

.layer-list__act:focus-visible[b-x3kdeoq3oc] {
    outline: none;
    box-shadow: var(--shadow-focus);
}

.layer-list__add[b-x3kdeoq3oc] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px;
    margin-top: 6px;
    padding-top: 6px;
    border-top: 1px solid var(--line);
}

.layer-list__add-label[b-x3kdeoq3oc] {
    font-size: 10px;
    color: var(--text-4);
}

.layer-list__add-item[b-x3kdeoq3oc] {
    height: 18px;
    padding: 0 6px;
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    background: var(--surface-card-2);
    color: var(--text-2);
    font-family: var(--font-ui);
    font-size: 10px;
    cursor: pointer;
}

.layer-list__add-item:hover[b-x3kdeoq3oc] {
    border-color: var(--workspace-accent);
    color: var(--text-1);
}

.layer-list__note[b-x3kdeoq3oc] {
    margin: 6px 0 0;
    font-size: 10px;
    line-height: 1.45;
    color: var(--text-4);
}

.layer-list__note--warn[b-x3kdeoq3oc] {
    color: var(--status-warn);
}
/* /Components/Map/MapAttribution.razor.rz.scp.css */
/* Artboard A / decision D8: bottom-right carries ONLY the coordinate readout and attribution.
   Numeric readouts use the mono stack (C0 §7). */

.map-attribution[b-5f4f6ol7e4] {
    display: flex;
    align-items: center;
    gap: 8px;
    height: 18px;
    padding: 0 6px;
    border-radius: var(--r-sm);
    background: color-mix(in srgb, var(--surface-card) 88%, transparent);
    color: var(--text-3);
    font-size: 10px;
}

.map-attribution__coords[b-5f4f6ol7e4] {
    font-family: var(--font-mono);
    color: var(--text-2);
}

/* Credits sit next to the readout, quieter than it: the coordinates are what the user is
   reading, the credits are what the licence requires be legible. */
.map-attribution__credits[b-5f4f6ol7e4] {
    display: inline-flex;
    align-items: center;
    max-width: 40ch;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    color: var(--text-3);
}

.map-attribution__sep[b-5f4f6ol7e4] {
    color: var(--text-4);
}

.map-attribution__link[b-5f4f6ol7e4] {
    color: var(--text-3);
    text-decoration: none;
}

.map-attribution__link:hover[b-5f4f6ol7e4],
.map-attribution__link:focus-visible[b-5f4f6ol7e4] {
    color: var(--text-1);
    text-decoration: underline;
}
/* /Components/Map/MapLegend.razor.rz.scp.css */
/* C0 HANDOFF artboard B. Compact density: 22px rows, 11px body, 10px secondary. */

.map-legend[b-jmkjst3g8y] {
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    background: color-mix(in srgb, var(--surface-card) 94%, transparent);
    box-shadow: var(--shadow-sm);
}

.map-legend__header[b-jmkjst3g8y] {
    display: flex;
    align-items: center;
    gap: 6px;
    width: 100%;
    height: 22px;
    padding: 0 7px;
    border: none;
    background: transparent;
    color: var(--text-2);
    font-family: var(--font-ui);
    font-size: 10px;
    font-weight: 600;
    letter-spacing: .04em;
    text-align: left;
    cursor: pointer;
}

.map-legend__caret[b-jmkjst3g8y] {
    color: var(--workspace-accent);
    font-size: 8px;
}

.map-legend__body[b-jmkjst3g8y] {
    padding: 0 7px 6px;
}

.map-legend__layer + .map-legend__layer[b-jmkjst3g8y] {
    margin-top: 6px;
    padding-top: 6px;
    border-top: 1px solid var(--line);
}

.map-legend__layer-name[b-jmkjst3g8y] {
    font-size: 11px;
    font-weight: 600;
    color: var(--text-1);
}

.map-legend__summary[b-jmkjst3g8y],
.map-legend__note[b-jmkjst3g8y] {
    font-size: 10px;
    color: var(--text-3);
}

.map-legend__summary[b-jmkjst3g8y] {
    font-family: var(--font-mono);
    margin-bottom: 3px;
}

.map-legend__row[b-jmkjst3g8y] {
    display: flex;
    align-items: center;
    gap: 6px;
    height: 18px;
}

.map-legend__swatch[b-jmkjst3g8y] {
    flex: none;
    width: 13px;
    height: 13px;
    border: 1px solid var(--line-strong);
}

/* A point layer's swatch is a disc, a polygon's a square (artboard B). */
.map-legend__swatch--point[b-jmkjst3g8y] {
    border-radius: 50%;
}

.map-legend__swatch--area[b-jmkjst3g8y] {
    border-radius: 2px;
}

/* The Selected row's swatch is an OUTLINE, not a fill: selection is a 2px outline on the map,
   and a filled swatch would promise a colour the map never paints. */
.map-legend__swatch--selected[b-jmkjst3g8y] {
    flex: none;
    width: 13px;
    height: 13px;
    border: 2px solid var(--plot-selected);
    border-radius: 2px;
}

.map-legend__label[b-jmkjst3g8y] {
    flex: 1;
    font-family: var(--font-mono);
    font-size: 10px;
    color: var(--text-2);
    white-space: nowrap;
}

.map-legend__count[b-jmkjst3g8y] {
    font-family: var(--font-mono);
    font-size: 10px;
    color: var(--text-3);
}

.map-legend__footer[b-jmkjst3g8y] {
    margin-top: 6px;
    padding-top: 5px;
    border-top: 1px solid var(--line);
    font-size: 10px;
    line-height: 1.4;
    color: var(--text-3);
}

.map-legend__actions[b-jmkjst3g8y] {
    display: flex;
    justify-content: flex-end;
    margin-top: 5px;
}

/* Decision D6: this is the entry point to the symbology sheet, so it has to read as a link
   rather than as a label. */
.map-legend__settings[b-jmkjst3g8y] {
    padding: 0;
    border: none;
    background: transparent;
    color: var(--workspace-accent);
    font-family: var(--font-ui);
    font-size: 10px;
    cursor: pointer;
}

.map-legend__settings:hover[b-jmkjst3g8y] {
    text-decoration: underline;
}

/* C0 artboard B, EXPANDED-CONTINUOUS. The strip's colours are DATA — they arrive on the wire as
   the ramp endpoints the renderer painted the raster with — so they are set inline from the
   response, never from a token. Everything around them (border, type, spacing) is tokens. */
.map-legend__ramp[b-jmkjst3g8y] {
    height: 10px;
    margin: 3px 0 2px;
    border: 1px solid var(--line);
    border-radius: 2px;
}

.map-legend__ramp-scale[b-jmkjst3g8y] {
    display: flex;
    justify-content: space-between;
    margin-bottom: 4px;
}

/* Mono, like every other number on the map chrome (C0 §7). */
.map-legend__ramp-end[b-jmkjst3g8y] {
    color: var(--text-2);
    font-family: var(--font-mono);
    font-size: 10px;
}
/* /Components/Map/MapPanel.razor.rz.scp.css */
/* C0 HANDOFF artboard A. Compact density (decision D7): 24px controls, 11px body, 10px secondary.
   Colour comes from the server's generated token stylesheet; geometry from wwwroot/css/shell.css. */

.map-panel[b-45wdmzuimz] {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
    font-family: var(--font-ui);
    font-size: 11px;
    background: var(--surface-card-2);
}

/* The map owns this node. It is @key-stable and Blazor never puts children in it, so the
   canvas MapLibre creates inside is never touched by a re-render. Hidden rather than removed
   while there is nothing to draw, for the same reason. */
.map-panel__canvas[b-45wdmzuimz] {
    position: absolute;
    inset: 0;
}

.map-panel__canvas--hidden[b-45wdmzuimz] {
    visibility: hidden;
}

.map-panel__state[b-45wdmzuimz] {
    position: absolute;
    inset: 0;
    z-index: 2;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    padding: 16px;
    text-align: center;
    background: var(--surface-card);
}

.map-panel__state-title[b-45wdmzuimz] {
    margin: 0;
    font-size: 13px;
    font-weight: 600;
    color: var(--text-2);
}

.map-panel__state-detail[b-45wdmzuimz] {
    margin: 0;
    max-width: 34ch;
    font-size: 11px;
    line-height: 1.45;
    color: var(--text-3);
}

.map-panel__state--error .map-panel__state-title[b-45wdmzuimz] {
    color: var(--status-err);
}

/* Decision D8: ALL map navigation lives in the top-left rail — the tool rail above one zoom
   control. The bottom-right deliberately holds only the readout and attribution. */
.map-panel__rail[b-45wdmzuimz] {
    position: absolute;
    top: 7px;
    left: 7px;
    z-index: 3;
    display: flex;
    flex-direction: column;
    gap: 7px;
}

/* Decision D6: legend in-panel, bottom-left, collapsible. */
.map-panel__legend[b-45wdmzuimz] {
    position: absolute;
    bottom: 7px;
    left: 7px;
    z-index: 3;
    max-width: 260px;
}

.map-panel__attribution[b-45wdmzuimz] {
    position: absolute;
    right: 7px;
    bottom: 7px;
    z-index: 3;
}

/* Decision D1: a right-docked SHEET, 640px, not a modal. Inside a panel it is absolute so it
   covers the panel rather than the viewport; the workspace grid push happens a level up. */
.map-panel__sheet[b-45wdmzuimz] {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 4;
    width: min(640px, 100%);
    box-shadow: var(--shadow-lg);
}

/* C2's two rail additions — layer list and basemap — in the SAME top-left stack as the tool rail
   and the zoom cluster (decision D8), not in a corner of their own. */
.map-panel__rail-card[b-45wdmzuimz] {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    background: var(--surface-card);
    box-shadow: var(--shadow-sm);
}

.map-panel__rail-btn[b-45wdmzuimz] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    padding: 0;
    border: none;
    border-bottom: 1px solid var(--line);
    background: transparent;
    color: var(--text-2);
    font-family: var(--font-ui);
    font-size: 13px;
    line-height: 1;
    cursor: pointer;
    transition: background var(--dur-fast) var(--ease-standard);
}

.map-panel__rail-btn:last-child[b-45wdmzuimz] {
    border-bottom: none;
}

.map-panel__rail-btn:hover[b-45wdmzuimz] {
    background: var(--surface-card-2);
    color: var(--text-1);
}

.map-panel__rail-btn--active[b-45wdmzuimz],
.map-panel__rail-btn--active:hover[b-45wdmzuimz] {
    background: var(--workspace-accent);
    color: var(--workspace-accent-ink);
}

.map-panel__rail-btn:focus-visible[b-45wdmzuimz] {
    outline: none;
    box-shadow: var(--shadow-focus);
}

/* Anchored beside the rail rather than over it, so the control that opened the popover stays
   visible and clickable to close it again. Below the sheet, above the legend. */
.map-panel__popover[b-45wdmzuimz] {
    position: absolute;
    top: 7px;
    left: 40px;
    z-index: 3;
    max-height: calc(100% - 14px);
}

/* C2: the frame clock. Decision D2 gives a workspace ONE time slider, so a panel has to say
   which frame it is showing without owning a control of its own. Top-right, opposite the
   navigation rail, so it never sits under the layer or basemap popovers. */
.map-panel__clock[b-45wdmzuimz] {
    position: absolute;
    top: 7px;
    right: 7px;
    z-index: 3;
    display: flex;
    align-items: center;
    gap: 4px;
    height: 24px;
    padding: 0 7px;
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    background: var(--surface-card);
    box-shadow: var(--shadow-sm);
    color: var(--text-2);
    font-family: var(--font-ui);
    font-size: 10px;
    white-space: nowrap;
}

.map-panel__clock-glyph[b-45wdmzuimz] {
    font-size: 11px;
    line-height: 1;
}

/* The frame is a numeric readout, so it is mono — C0 §7 applies that to every number on the
   map chrome, including the coordinate readout this sits opposite. */
.map-panel__clock-label[b-45wdmzuimz] {
    font-family: var(--font-mono);
    color: var(--text-1);
}

/* C2: a raster layer the server refused to place, on a panel where OTHER layers still draw.
   Sits under the clock rather than replacing the panel, because a whole-panel state would hide
   a map that is working. */
.map-panel__notice[b-45wdmzuimz] {
    position: absolute;
    top: 38px;
    right: 7px;
    left: 44px;
    z-index: 3;
    padding: 5px 7px;
    border: 1px solid var(--status-warn);
    border-radius: var(--r-sm);
    background: color-mix(in srgb, var(--status-warn) 12%, var(--surface-card));
    color: var(--text-1);
    font-family: var(--font-ui);
    font-size: 11px;
}

/* Decision D2's muted state: the panel is inside a time-varying workspace but its own data is
   not, so the clock is shown WITHOUT a frame — an empty dial rather than a number that would
   imply the slider is moving something here. */
.map-panel__clock--muted[b-45wdmzuimz] {
    color: var(--text-4);
    background: var(--surface-card-2);
}

/* A9 significance mask. The desktop's "significant only" checkbox
   (MapAlternativesControl) with its criterion stated beside it: a mask whose
   criterion is not shown invites more confidence than a
   multiple-comparison-adjusted threshold deserves. Rendered only when a drawn
   layer's spec offers a mask, so every map that predates GWR's coefficient
   surfaces is unaffected. Sits above the legend, out of the top-left rail. */
.map-panel__mask[b-45wdmzuimz] {
    position: absolute;
    bottom: 7px;
    left: 7px;
    z-index: 3;
    display: flex;
    flex-direction: column;
    gap: 2px;
    max-width: 220px;
    padding: 5px 7px;
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    background: var(--surface-card);
    font-family: var(--font-ui);
}

.map-panel__mask-toggle[b-45wdmzuimz] {
    display: flex;
    align-items: center;
    gap: 5px;
    color: var(--text-1);
    font-size: 11px;
    cursor: pointer;
}

.map-panel__mask-criterion[b-45wdmzuimz] {
    color: var(--text-2);
    font-size: 10px;
    line-height: 1.3;
}
/* /Components/Map/MapToolRail.razor.rz.scp.css */
/* Artboard A's tool rail: three stacked 24px buttons in one card. */

.map-rail[b-2lxeyioviw] {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    background: var(--surface-card);
    box-shadow: var(--shadow-sm);
}

.map-rail__tool[b-2lxeyioviw] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    padding: 0;
    border: none;
    border-bottom: 1px solid var(--line);
    background: transparent;
    color: var(--text-2);
    font-family: var(--font-ui);
    font-size: 13px;
    line-height: 1;
    cursor: pointer;
    transition: background var(--dur-fast) var(--ease-standard);
}

.map-rail__tool:last-child[b-2lxeyioviw] {
    border-bottom: none;
}

.map-rail__tool:hover[b-2lxeyioviw] {
    background: var(--surface-card-2);
    color: var(--text-1);
}

.map-rail__tool--active[b-2lxeyioviw],
.map-rail__tool--active:hover[b-2lxeyioviw] {
    background: var(--workspace-accent);
    color: var(--workspace-accent-ink);
}

.map-rail__tool:focus-visible[b-2lxeyioviw] {
    outline: none;
    box-shadow: var(--shadow-focus);
}
/* /Components/Map/MapZoomSlider.razor.rz.scp.css */
/* Artboard A: ONE zoom control, Fit at its top, then + / slider / −. */

.map-zoom[b-ve98qpz9uw] {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    background: var(--surface-card);
    box-shadow: var(--shadow-sm);
}

.map-zoom__fit[b-ve98qpz9uw],
.map-zoom__step[b-ve98qpz9uw] {
    height: 22px;
    padding: 0 6px;
    border: none;
    border-bottom: 1px solid var(--line);
    background: transparent;
    color: var(--text-2);
    font-family: var(--font-ui);
    font-size: 10px;
    line-height: 1;
    cursor: pointer;
}

.map-zoom__step[b-ve98qpz9uw] {
    font-size: 13px;
}

.map-zoom__step:last-child[b-ve98qpz9uw] {
    border-bottom: none;
}

.map-zoom__fit:hover:not(:disabled)[b-ve98qpz9uw],
.map-zoom__step:hover:not(:disabled)[b-ve98qpz9uw] {
    background: var(--surface-card-2);
    color: var(--text-1);
}

.map-zoom__step:disabled[b-ve98qpz9uw] {
    color: var(--text-4);
    cursor: default;
}

/* Vertical via writing-mode rather than a rotate() transform: a rotated range input keeps its
   original hit area, so the thumb becomes un-grabbable where it visually is. */
.map-zoom__slider[b-ve98qpz9uw] {
    writing-mode: vertical-lr;
    direction: rtl;
    width: 26px;
    height: 96px;
    margin: 4px 0;
    accent-color: var(--workspace-accent);
    background: transparent;
    cursor: pointer;
}
/* /Components/Map/SymbologySheet.razor.rz.scp.css */
/* C0 HANDOFF artboard C, decision D1: a right-docked sheet that applies LIVE, not a modal. */

.symbology-sheet[b-gc0c8qq7p3] {
    display: flex;
    flex-direction: column;
    height: 100%;
    border-left: 1px solid var(--line-strong);
    background: var(--surface-card);
    font-family: var(--font-ui);
    font-size: 11px;
    color: var(--text-1);
}

.symbology-sheet__titlebar[b-gc0c8qq7p3] {
    display: flex;
    align-items: center;
    gap: 8px;
    height: 26px;
    padding: 0 9px;
    border-bottom: 1px solid var(--line);
    background: var(--surface-card-2);
}

.symbology-sheet__title[b-gc0c8qq7p3] {
    font-size: 12px;
    font-weight: 600;
}

/* The artboard's "LIVE" marker. This sheet has no Apply button, and saying so is what makes that
   read as intentional rather than missing. */
.symbology-sheet__live[b-gc0c8qq7p3] {
    color: var(--status-ok);
    font-size: 9px;
    font-weight: 600;
    letter-spacing: .06em;
}

.symbology-sheet__scroll[b-gc0c8qq7p3] {
    flex: 1;
    overflow-y: auto;
    padding: 9px;
}

.symbology-sheet__empty[b-gc0c8qq7p3] {
    padding: 16px;
    color: var(--text-3);
}

.symbology-sheet__layer[b-gc0c8qq7p3] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--line);
}

.symbology-sheet__layer-name[b-gc0c8qq7p3] {
    font-size: 13px;
    font-weight: 600;
}

.symbology-sheet__pill[b-gc0c8qq7p3] {
    padding: 1px 6px;
    border: 1px solid var(--line-strong);
    border-radius: var(--r-pill);
    font-family: var(--font-mono);
    font-size: 9px;
    color: var(--text-3);
}

.symbology-sheet__section[b-gc0c8qq7p3] {
    padding: 10px 0;
    border-bottom: 1px solid var(--line);
}

.symbology-sheet__heading[b-gc0c8qq7p3] {
    margin: 0 0 8px;
    font-size: 9px;
    font-weight: 600;
    letter-spacing: .06em;
    color: var(--text-3);
    text-transform: uppercase;
}

.symbology-sheet__grid[b-gc0c8qq7p3] {
    display: grid;
    grid-template-columns: 1fr 1fr auto;
    gap: 9px;
}

.symbology-sheet__field[b-gc0c8qq7p3] {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.symbology-sheet__field--narrow[b-gc0c8qq7p3] {
    justify-self: end;
}

.symbology-sheet__label[b-gc0c8qq7p3] {
    font-size: 10px;
    color: var(--text-3);
}

.symbology-sheet__select[b-gc0c8qq7p3] {
    height: 24px;
    padding: 0 6px;
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    background: var(--surface-card-2);
    color: var(--text-1);
    font-family: var(--font-ui);
    font-size: 11px;
}

.symbology-sheet__row[b-gc0c8qq7p3] {
    display: grid;
    grid-template-columns: 96px 20px 1fr 64px;
    align-items: center;
    gap: 8px;
    height: 24px;
}

.symbology-sheet__swatch[b-gc0c8qq7p3] {
    width: 18px;
    height: 18px;
    border: 1px solid var(--line-strong);
    border-radius: 2px;
}

.symbology-sheet__swatch--hidden[b-gc0c8qq7p3] {
    visibility: hidden;
}

.symbology-sheet__slider[b-gc0c8qq7p3] {
    width: 100%;
    accent-color: var(--workspace-accent);
    cursor: pointer;
}

.symbology-sheet__readout[b-gc0c8qq7p3] {
    font-family: var(--font-mono);
    font-size: 10px;
    color: var(--text-2);
    text-align: right;
}

.symbology-sheet__note[b-gc0c8qq7p3] {
    margin: 0;
    font-size: 10px;
    line-height: 1.45;
    color: var(--text-3);
}

.symbology-sheet__preview-row[b-gc0c8qq7p3] {
    display: flex;
    align-items: center;
    gap: 7px;
    height: 20px;
}

.symbology-sheet__preview-label[b-gc0c8qq7p3] {
    font-family: var(--font-mono);
    font-size: 10px;
    color: var(--text-2);
}

.symbology-sheet__footer[b-gc0c8qq7p3] {
    display: flex;
    align-items: center;
    gap: 8px;
    height: 34px;
    padding: 0 9px;
    border-top: 1px solid var(--line);
    background: var(--surface-card-2);
}

.symbology-sheet__footnote[b-gc0c8qq7p3] {
    font-size: 10px;
    color: var(--text-3);
}

.symbology-sheet__reset[b-gc0c8qq7p3] {
    height: 24px;
    padding: 0 8px;
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    background: transparent;
    color: var(--text-2);
    font-family: var(--font-ui);
    font-size: 11px;
    cursor: pointer;
}

.symbology-sheet__done[b-gc0c8qq7p3] {
    height: 24px;
    padding: 0 12px;
    border: 1px solid var(--workspace-accent);
    border-radius: var(--r-sm);
    background: var(--workspace-accent);
    color: var(--workspace-accent-ink);
    font-family: var(--font-ui);
    font-size: 11px;
    font-weight: 600;
    cursor: pointer;
}
/* /Components/PanelGuard.razor.rz.scp.css */
/* The inline failure card a guarded panel renders instead of taking the app down. Fills the
   panel's cell so the grid keeps its shape; tokens only (no hard-coded colors). */
.panel-guard[b-iv3p86smb3] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    height: 100%;
    min-height: 120px;
    padding: 16px;
    border: 1px dashed var(--line-strong);
    border-radius: var(--r-sm);
    background: var(--surface-card-2);
    text-align: center;
}

.panel-guard__title[b-iv3p86smb3] {
    font-family: var(--font-ui);
    font-size: var(--fs-dense);
    font-weight: 600;
    color: var(--text-1);
}

.panel-guard__detail[b-iv3p86smb3] {
    font-family: var(--font-ui);
    font-size: var(--fs-dense);
    color: var(--text-3);
}

.panel-guard__retry[b-iv3p86smb3] {
    padding: 4px 12px;
    border: 1px solid var(--line-strong);
    border-radius: var(--r-sm);
    background: none;
    color: var(--text-2);
    font-family: var(--font-ui);
    font-size: var(--fs-dense);
    cursor: pointer;
}

.panel-guard__retry:hover[b-iv3p86smb3] {
    color: var(--text-1);
    border-color: var(--text-3);
}
/* /Components/Projects/ConfirmDialog.razor.rz.scp.css */
/* 460px destructive-action dialog (artboard 1h). 32px minimum hit target in dialogs (HANDOFF §3). */

.cfd[b-ypx456y9fc] {
    position: fixed;
    inset: 0;
    z-index: 400;
    display: grid;
    place-items: center;
}

.cfd__scrim[b-ypx456y9fc] {
    position: absolute;
    inset: 0;
    background: var(--scrim);
}

/* Zero-size focus catchers. They must be tabbable but must never be visible or take space. */
.cfd__sentinel[b-ypx456y9fc] {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    pointer-events: none;
}

.cfd__frame[b-ypx456y9fc] {
    position: relative;
    width: 460px;
    max-width: calc(100vw - 32px);
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 20px 22px 0;
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    background: var(--surface-card);
    box-shadow: var(--shadow-dialog);
    font-family: var(--font-ui);
}

.cfd__title[b-ypx456y9fc] {
    margin: 0;
    font-size: var(--fs-heading);
    font-weight: 600;
    color: var(--text-1);
}

.cfd__body[b-ypx456y9fc] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    font-size: var(--fs-comfortable);
    color: var(--text-2);
}

.cfd__consequences[b-ypx456y9fc] {
    margin: 0;
    line-height: 1.45;
}

/* The gate. Given a 32px target and a label that is a full sentence, the row is aligned to the
   first line of text rather than centred. */
.cfd__ack[b-ypx456y9fc] {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    min-height: var(--target-dialog);
    padding: 2px 0;
    cursor: pointer;
}

.cfd__ack-box[b-ypx456y9fc] {
    flex: 0 0 auto;
    width: 18px;
    height: 18px;
    margin: 2px 0 0;
    accent-color: var(--accent);
    cursor: pointer;
}

.cfd__ack-box:focus-visible[b-ypx456y9fc] {
    outline: none;
    box-shadow: var(--shadow-focus);
    border-radius: var(--r-sm);
}

.cfd__ack-text[b-ypx456y9fc] {
    font-size: var(--fs-comfortable);
    line-height: 1.4;
    color: var(--text-1);
}

.cfd__footer[b-ypx456y9fc] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    margin: 4px -22px 0;
    padding: 14px 22px;
    border-top: 1px solid var(--line);
}

.cfd__button[b-ypx456y9fc] {
    min-height: var(--target-dialog);
    padding: 0 16px;
    border: 1px solid var(--line-strong);
    border-radius: var(--r-md);
    background: var(--surface-card-2);
    color: var(--text-1);
    font-family: var(--font-ui);
    font-size: var(--fs-comfortable);
    cursor: pointer;
    transition: filter var(--dur-fast) var(--ease-standard),
                background-color var(--dur-fast) var(--ease-standard);
}

.cfd__button:hover:not(:disabled)[b-ypx456y9fc] {
    filter: brightness(.94);
}

.cfd__button:focus-visible[b-ypx456y9fc] {
    outline: none;
    box-shadow: var(--shadow-focus);
}

.cfd__button--quiet[b-ypx456y9fc] {
    background: none;
}

.cfd__button--quiet:hover[b-ypx456y9fc] {
    background: var(--surface-card-2);
}

/* Filled, as artboard 1h draws it. This became possible on 2026-09-02: `--status-err` is now split
   by polarity and ships a derived `--status-err-ink`, so the label is generator-chosen rather than
   hand-picked (HANDOFF §5.3). Before that split the one shared red cleared AA against neither
   candidate ink — 4.29:1 white, 4.34:1 near-black — and this button was outlined instead. */
.cfd__button--danger[b-ypx456y9fc] {
    border-color: var(--status-err);
    background: var(--status-err);
    color: var(--status-err-ink);
    font-weight: 600;
}

.cfd__button--danger:disabled[b-ypx456y9fc] {
    border-color: var(--line);
    background: none;
    color: var(--text-3);
    cursor: default;
}
/* /Components/Projects/NamePromptDialog.razor.rz.scp.css */
/* One-field naming dialog (New folder / Rename folder). */

.npd[b-c8p1ocmi1m] {
    position: fixed;
    inset: 0;
    z-index: 390;
    display: grid;
    place-items: center;
}

.npd__scrim[b-c8p1ocmi1m] {
    position: absolute;
    inset: 0;
    background: var(--scrim);
}

.npd__frame[b-c8p1ocmi1m] {
    position: relative;
    width: 420px;
    max-width: calc(100vw - 32px);
    box-sizing: border-box;
    padding: 20px 22px 0;
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    background: var(--surface-card);
    box-shadow: var(--shadow-dialog);
    font-family: var(--font-ui);
}

.npd__title[b-c8p1ocmi1m] {
    margin: 0 0 12px;
    font-size: var(--fs-heading);
    font-weight: 600;
    color: var(--text-1);
}

.npd__label[b-c8p1ocmi1m] {
    display: block;
    margin-bottom: 6px;
    font-size: var(--fs-dense);
    font-weight: 600;
    letter-spacing: .04em;
    color: var(--text-3);
}

.npd__input[b-c8p1ocmi1m] {
    width: 100%;
    box-sizing: border-box;
    min-height: var(--target-dialog);
    padding: 0 10px;
    border: 1px solid var(--line-strong);
    border-radius: var(--r-md);
    background: var(--surface-card-3);
    color: var(--text-1);
    font-family: var(--font-ui);
    font-size: var(--fs-comfortable);
}

.npd__input:focus-visible[b-c8p1ocmi1m] {
    outline: none;
    box-shadow: var(--shadow-focus);
}

.npd__error[b-c8p1ocmi1m] {
    margin: 8px 0 0;
    padding: 6px 8px;
    border-left: 2px solid var(--status-err);
    border-radius: var(--r-sm);
    background: var(--caveat-err-fill);
    color: var(--text-1);
    font-size: var(--fs-body);
    line-height: 1.4;
}

.npd__footer[b-c8p1ocmi1m] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    margin: 16px -22px 0;
    padding: 14px 22px;
    border-top: 1px solid var(--line);
}

.npd__button[b-c8p1ocmi1m] {
    min-height: var(--target-dialog);
    padding: 0 16px;
    border: 1px solid var(--line-strong);
    border-radius: var(--r-md);
    background: var(--surface-card-2);
    color: var(--text-1);
    font-family: var(--font-ui);
    font-size: var(--fs-comfortable);
    cursor: pointer;
    transition: filter var(--dur-fast) var(--ease-standard);
}

.npd__button:hover:not(:disabled)[b-c8p1ocmi1m] {
    filter: brightness(.94);
}

.npd__button:focus-visible[b-c8p1ocmi1m] {
    outline: none;
    box-shadow: var(--shadow-focus);
}

.npd__button--quiet[b-c8p1ocmi1m] {
    border-color: transparent;
    background: none;
    color: var(--text-2);
}

/* --accent-on, never assumed white (Frost, Sand). */
.npd__button--primary[b-c8p1ocmi1m] {
    border-color: var(--accent);
    background: var(--accent);
    color: var(--accent-on);
    font-weight: 600;
}

.npd__button--primary:disabled[b-c8p1ocmi1m] {
    border-color: var(--line);
    background: none;
    color: var(--text-3);
    cursor: default;
}
/* /Components/Projects/ProjectDetailsPanel.razor.rz.scp.css */
/* 316px details panel (artboard 1b). Width is the shell's token. */

.dp[b-q7sdkddb9d] {
    flex: 0 0 var(--details-pane-w);
    width: var(--details-pane-w);
    min-height: 0;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    background: var(--surface-panel);
    font-family: var(--font-ui);
    overflow: hidden;
}

.dp__none[b-q7sdkddb9d],
.dp__quiet[b-q7sdkddb9d] {
    margin: 0;
    padding: 14px;
    font-size: var(--fs-body);
    color: var(--text-3);
}

.dp__scroll[b-q7sdkddb9d] {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    padding: 12px;
}

.dp[b-q7sdkddb9d]  .dp__thumb {
    margin-bottom: 10px;
}

.dp__name[b-q7sdkddb9d] {
    margin: 0;
    font-size: var(--fs-heading);
    font-weight: 600;
    color: var(--text-1);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dp__breadcrumb[b-q7sdkddb9d] {
    margin: 2px 0 8px;
    font-size: var(--fs-body);
    color: var(--text-3);
}

/* ---- description --------------------------------------------------------------------------- */

/* Clamped to three lines. A description is allowed to be long; the panel is not allowed to grow to
   fit it, or the stat grid disappears below the fold on the projects that document themselves best. */
.dp__desc[b-q7sdkddb9d] {
    display: block;
    width: 100%;
    margin: 0 0 10px;
    padding: 6px 8px;
    border: 1px solid transparent;
    border-radius: var(--r-sm);
    background: none;
    color: var(--text-2);
    font-family: var(--font-ui);
    font-size: var(--fs-comfortable);
    line-height: 1.45;
    text-align: left;
    cursor: text;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    transition: border-color var(--dur-fast) var(--ease-standard);
}

.dp__desc:hover:not(:disabled)[b-q7sdkddb9d] {
    border-color: var(--line-strong);
}

.dp__desc:focus-visible[b-q7sdkddb9d] {
    outline: none;
    box-shadow: var(--shadow-focus);
}

.dp__desc:disabled[b-q7sdkddb9d] {
    cursor: default;
}

.dp__desc--empty[b-q7sdkddb9d] {
    color: var(--text-3);
    font-style: italic;
}

.dp__desc-edit[b-q7sdkddb9d] {
    margin-bottom: 10px;
}

.dp__desc-input[b-q7sdkddb9d] {
    width: 100%;
    box-sizing: border-box;
    padding: 6px 8px;
    border: 2px solid var(--accent);
    border-radius: var(--r-sm);
    background: var(--surface-card-3);
    color: var(--text-1);
    font-family: var(--font-ui);
    font-size: var(--fs-comfortable);
    line-height: 1.45;
    resize: vertical;
}

.dp__desc-input:focus-visible[b-q7sdkddb9d] {
    outline: none;
    box-shadow: var(--shadow-focus);
}

.dp__desc-actions[b-q7sdkddb9d] {
    display: flex;
    gap: 8px;
    margin-top: 6px;
}

.dp__button[b-q7sdkddb9d] {
    min-height: var(--target-chrome);
    padding: 0 12px;
    border: 1px solid var(--line-strong);
    border-radius: var(--r-sm);
    background: var(--surface-card-2);
    color: var(--text-1);
    font-family: var(--font-ui);
    font-size: var(--fs-body);
    cursor: pointer;
    transition: filter var(--dur-fast) var(--ease-standard);
}

.dp__button:hover[b-q7sdkddb9d] {
    filter: brightness(.94);
}

.dp__button:focus-visible[b-q7sdkddb9d] {
    outline: none;
    box-shadow: var(--shadow-focus);
}

/* --accent-on: Frost's and Sand's accents are pale, so white ink would be invisible. */
.dp__button--primary[b-q7sdkddb9d] {
    border-color: var(--accent);
    background: var(--accent);
    color: var(--accent-on);
    font-weight: 600;
}

.dp__button--quiet[b-q7sdkddb9d] {
    border-color: transparent;
    background: none;
    color: var(--text-2);
}

/* ---- primary action ------------------------------------------------------------------------ */

.dp__actions[b-q7sdkddb9d] {
    position: relative;
    display: flex;
    gap: 8px;
    margin-bottom: 14px;
}

.dp__open[b-q7sdkddb9d] {
    flex: 1 1 auto;
    min-height: var(--target-dialog);
    border: 1px solid var(--accent);
    border-radius: var(--r-md);
    background: var(--accent);
    color: var(--accent-on);
    font-family: var(--font-ui);
    font-size: var(--fs-comfortable);
    font-weight: 600;
    cursor: pointer;
    transition: filter var(--dur-fast) var(--ease-standard);
}

.dp__open:hover[b-q7sdkddb9d] {
    filter: brightness(.94);
}

.dp__open:focus-visible[b-q7sdkddb9d] {
    outline: none;
    box-shadow: var(--shadow-focus);
}

.dp__more[b-q7sdkddb9d] {
    flex: 0 0 auto;
    width: var(--target-dialog);
    height: var(--target-dialog);
    display: grid;
    place-items: center;
    border: 1px solid var(--line-strong);
    border-radius: var(--r-md);
    background: var(--surface-card-2);
    color: var(--text-2);
    cursor: pointer;
}

.dp__more:hover[b-q7sdkddb9d] {
    filter: brightness(.94);
    color: var(--text-1);
}

.dp__more:focus-visible[b-q7sdkddb9d] {
    outline: none;
    box-shadow: var(--shadow-focus);
}

.dp__menu[b-q7sdkddb9d] {
    position: absolute;
    top: calc(100% + 4px);
    right: 0;
    z-index: 20;
    min-width: 156px;
    padding: 4px;
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    background: var(--surface-card);
    box-shadow: var(--shadow-lg);
}

.dp__menu-item[b-q7sdkddb9d] {
    width: 100%;
    min-height: var(--target-chrome);
    padding: 0 10px;
    border: 0;
    border-radius: var(--r-sm);
    background: none;
    color: var(--text-1);
    font-family: var(--font-ui);
    font-size: var(--fs-body);
    text-align: left;
    cursor: pointer;
}

.dp__menu-item:hover:not(:disabled)[b-q7sdkddb9d] {
    background: var(--surface-card-2);
}

.dp__menu-item:focus-visible[b-q7sdkddb9d] {
    outline: none;
    box-shadow: var(--shadow-focus);
}

.dp__menu-item:disabled[b-q7sdkddb9d] {
    color: var(--text-4);
    cursor: default;
}

.dp__menu-item--danger:not(:disabled)[b-q7sdkddb9d] {
    color: var(--status-err);
}

/* ---- stat grid ----------------------------------------------------------------------------- */

.dp__stats[b-q7sdkddb9d] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px 16px;
    margin: 0 0 16px;
    padding: 0;
}

.dp__stat[b-q7sdkddb9d] {
    min-width: 0;
}

.dp__stat-label[b-q7sdkddb9d] {
    font-size: var(--fs-dense);
    font-weight: 600;
    letter-spacing: .06em;
    color: var(--text-3);
}

.dp__stat-value[b-q7sdkddb9d] {
    margin: 2px 0 0;
    font-family: var(--font-mono);
    font-size: var(--fs-comfortable);
    color: var(--text-1);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ---- sections ------------------------------------------------------------------------------ */

.dp__section[b-q7sdkddb9d] {
    margin-bottom: 16px;
}

.dp__section-head[b-q7sdkddb9d] {
    margin: 0 0 6px;
    font-size: var(--fs-dense);
    font-weight: 600;
    letter-spacing: .06em;
    color: var(--text-3);
}

.dp__vars[b-q7sdkddb9d],
.dp__versions[b-q7sdkddb9d] {
    margin: 0;
    padding: 0;
    list-style: none;
}

.dp__var[b-q7sdkddb9d],
.dp__version[b-q7sdkddb9d] {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 24px;
    font-size: var(--fs-body);
    color: var(--text-1);
}

.dp__var + .dp__var[b-q7sdkddb9d],
.dp__version + .dp__version[b-q7sdkddb9d] {
    border-top: 1px solid var(--line);
}

.dp[b-q7sdkddb9d]  .dp__var-icon {
    flex: 0 0 auto;
    color: var(--accent);
}

.dp__var-name[b-q7sdkddb9d] {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dp__var-type[b-q7sdkddb9d],
.dp__version-current[b-q7sdkddb9d] {
    flex: 0 0 auto;
    color: var(--text-3);
    font-size: var(--fs-dense);
}

.dp__version-when[b-q7sdkddb9d] {
    flex: 1 1 auto;
    font-family: var(--font-mono);
    font-size: var(--fs-body);
    color: var(--text-2);
}

.dp__restore[b-q7sdkddb9d] {
    flex: 0 0 auto;
    min-height: 22px;
    padding: 0 6px;
    border: 0;
    border-radius: var(--r-sm);
    background: none;
    color: var(--accent);
    font-family: var(--font-ui);
    font-size: var(--fs-body);
    cursor: pointer;
}

.dp__restore:hover:not(:disabled)[b-q7sdkddb9d] {
    text-decoration: underline;
}

.dp__restore:disabled[b-q7sdkddb9d] {
    color: var(--text-4);
    cursor: default;
}

.dp__restore:focus-visible[b-q7sdkddb9d] {
    outline: none;
    box-shadow: var(--shadow-focus);
}
/* /Components/Projects/ProjectFolderTree.razor.rz.scp.css */
/* 232px folder tree (artboard 1b). Width is the shell's own token, not a number repeated here. */

.ft[b-agcb3jl488] {
    flex: 0 0 var(--folder-tree-w);
    width: var(--folder-tree-w);
    display: flex;
    flex-direction: column;
    min-height: 0;
    box-sizing: border-box;
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    background: var(--surface-panel);
    font-family: var(--font-ui);
    overflow: hidden;
}

/* ---- pinned actions ------------------------------------------------------------------------ */

.ft__pinned[b-agcb3jl488] {
    flex: 0 0 auto;
    display: flex;
    flex-direction: column;
    padding: 8px 6px;
    border-bottom: 1px solid var(--line);
}

.ft__pinned-item[b-agcb3jl488] {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: var(--target-chrome);
    padding: 0 8px;
    border: 0;
    border-radius: var(--r-sm);
    background: none;
    color: var(--accent);
    font-family: var(--font-ui);
    font-size: var(--fs-comfortable);
    font-weight: 600;
    text-align: left;
    cursor: pointer;
    transition: background-color var(--dur-fast) var(--ease-standard);
}

.ft__pinned-item:hover[b-agcb3jl488] {
    background: var(--surface-card-2);
}

.ft__pinned-item:focus-visible[b-agcb3jl488] {
    outline: none;
    box-shadow: var(--shadow-focus);
}

.ft[b-agcb3jl488]  .ft__pinned-icon {
    flex: 0 0 auto;
}

/* ---- scroll region ------------------------------------------------------------------------- */

.ft__scroll[b-agcb3jl488] {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    padding: 8px 0;
}

.ft__loading[b-agcb3jl488] {
    padding: 0 6px;
}

.ft__section + .ft__section[b-agcb3jl488] {
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid var(--line);
}

.ft__section-head[b-agcb3jl488] {
    display: flex;
    align-items: center;
    gap: 2px;
    padding: 0 6px 2px;
}

.ft__section-label[b-agcb3jl488] {
    flex: 1 1 auto;
    min-height: 22px;
    padding: 0 4px;
    border: 0;
    border-radius: var(--r-sm);
    background: none;
    color: var(--text-3);
    font-family: var(--font-ui);
    font-size: var(--fs-dense);
    font-weight: 600;
    letter-spacing: .06em;
    text-align: left;
    cursor: pointer;
    transition: color var(--dur-fast) var(--ease-standard);
}

.ft__section-label:hover[b-agcb3jl488] {
    color: var(--text-2);
}

.ft__section-label--selected[b-agcb3jl488] {
    color: var(--accent);
}

.ft__section-label:focus-visible[b-agcb3jl488] {
    outline: none;
    box-shadow: var(--shadow-focus);
}

/* ---- nodes --------------------------------------------------------------------------------- */

.ft__row[b-agcb3jl488] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 6px;
    min-height: var(--target-chrome);
    /* padding-left is set inline, one indent step per level. */
    padding-right: 6px;
    margin: 0 6px;
    border-radius: var(--r-sm);
    color: var(--text-1);
    font-size: var(--fs-comfortable);
    cursor: pointer;
    transition: background-color var(--dur-fast) var(--ease-standard);
}

.ft__row:hover[b-agcb3jl488] {
    background: var(--surface-card-2);
}

.ft__row:focus-visible[b-agcb3jl488] {
    outline: none;
    box-shadow: var(--shadow-focus);
}

/* HANDOFF §6: a 2px --workspace-accent INSET on the selected node — an inset rather than a border
   so the row's text does not shift by 2px when it becomes selected. */
.ft__row--selected[b-agcb3jl488] {
    background: color-mix(in srgb, var(--workspace-accent) 18%, transparent);
    font-weight: 600;
    box-shadow: inset 2px 0 0 0 var(--workspace-accent);
}

.ft__twisty[b-agcb3jl488] {
    flex: 0 0 auto;
    width: 16px;
    height: 16px;
    display: grid;
    place-items: center;
    border: 0;
    border-radius: var(--r-sm);
    background: none;
    color: var(--text-3);
    cursor: pointer;
    padding: 0;
}

.ft__twisty:hover[b-agcb3jl488] {
    color: var(--text-1);
}

.ft__twisty:focus-visible[b-agcb3jl488] {
    outline: none;
    box-shadow: var(--shadow-focus);
}

.ft__twisty--empty[b-agcb3jl488] {
    cursor: default;
}

/* ::deep because these are a child component's (ProjectIcon's) elements: Blazor stamps the scope
   attribute onto this component's own markup only. */
.ft[b-agcb3jl488]  .ft__node-icon {
    flex: 0 0 auto;
    color: var(--accent);
}

.ft__node-name[b-agcb3jl488] {
    flex: 1 1 auto;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ft__count[b-agcb3jl488] {
    flex: 0 0 auto;
    color: var(--text-3);
    font-size: var(--fs-dense);
    font-variant-numeric: tabular-nums;
    font-weight: 400;
}

.ft__more[b-agcb3jl488] {
    flex: 0 0 auto;
    width: 20px;
    height: 20px;
    display: grid;
    place-items: center;
    padding: 0;
    border: 0;
    border-radius: var(--r-sm);
    background: none;
    color: var(--text-3);
    cursor: pointer;
    opacity: 0;
    transition: opacity var(--dur-fast) var(--ease-standard);
}

/* Revealed on hover or keyboard focus — never hidden from the keyboard, which is what
   `opacity: 0` alone would do if it were the only rule. */
.ft__row:hover .ft__more[b-agcb3jl488],
.ft__row:focus-within .ft__more[b-agcb3jl488],
.ft__more:focus-visible[b-agcb3jl488],
.ft__more[aria-expanded="true"][b-agcb3jl488] {
    opacity: 1;
}

.ft__more:focus-visible[b-agcb3jl488] {
    outline: none;
    box-shadow: var(--shadow-focus);
}

.ft__menu[b-agcb3jl488] {
    margin: 2px 6px 4px 26px;
    padding: 4px;
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    background: var(--surface-card);
    box-shadow: var(--shadow-md);
}

.ft__menu-item[b-agcb3jl488] {
    width: 100%;
    min-height: var(--target-chrome);
    padding: 0 8px;
    border: 0;
    border-radius: var(--r-sm);
    background: none;
    color: var(--text-1);
    font-family: var(--font-ui);
    font-size: var(--fs-body);
    text-align: left;
    cursor: pointer;
}

.ft__menu-item:hover[b-agcb3jl488] {
    background: var(--surface-card-2);
}

.ft__menu-item:focus-visible[b-agcb3jl488] {
    outline: none;
    box-shadow: var(--shadow-focus);
}

.ft__menu-item--danger[b-agcb3jl488] {
    color: var(--status-err);
}

/* ---- storage footer ------------------------------------------------------------------------ */

/* Pinned, not the last row of the scroll region: a scrolled-away quota is a quota nobody reads. */
.ft__footer[b-agcb3jl488] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: var(--target-chrome);
    padding: 0 12px;
    border-top: 1px solid var(--line);
    background: var(--surface-card-2);
    color: var(--text-2);
    font-size: var(--fs-body);
}

.ft[b-agcb3jl488]  .ft__footer-icon {
    flex: 0 0 auto;
    color: var(--text-3);
}

.ft__footer-text[b-agcb3jl488] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
/* /Components/Projects/ProjectList.razor.rz.scp.css */
/* The list pane (artboard 1b). Row height is --project-row-h, the token the skeleton also uses. */

.pl[b-jr9rhfwpal] {
    flex: 1 1 auto;
    min-width: 0;
    min-height: 0;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    background: var(--surface-panel);
    font-family: var(--font-ui);
    overflow: hidden;
}

/* ---- header -------------------------------------------------------------------------------- */

.pl__head[b-jr9rhfwpal] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: var(--target-chrome);
    padding: 6px 12px;
}

.pl__head-left[b-jr9rhfwpal] {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-right: auto;
}

.pl__refresh[b-jr9rhfwpal] {
    width: var(--target-chrome);
    height: var(--target-chrome);
    display: grid;
    place-items: center;
    padding: 0;
    border: 0;
    border-radius: var(--r-sm);
    background: none;
    color: var(--text-2);
    cursor: pointer;
    transition: background-color var(--dur-fast) var(--ease-standard);
}

.pl__refresh:hover:not(:disabled)[b-jr9rhfwpal] {
    background: var(--surface-card-2);
    color: var(--text-1);
}

.pl__refresh:disabled[b-jr9rhfwpal] {
    color: var(--text-4);
    cursor: default;
}

.pl__refresh:focus-visible[b-jr9rhfwpal] {
    outline: none;
    box-shadow: var(--shadow-focus);
}

.pl__refresh-label[b-jr9rhfwpal] {
    font-size: var(--fs-body);
    color: var(--text-3);
}

.pl__head-right[b-jr9rhfwpal] {
    font-size: var(--fs-body);
    color: var(--text-3);
}

/* ---- column headings ----------------------------------------------------------------------- */

/* One grid template, declared once and reused by the column strip and every row, so a column can
   never drift between the heading and the data under it. */
.pl__columns[b-jr9rhfwpal],
.pl__row[b-jr9rhfwpal] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 84px 110px 96px;
    align-items: center;
    gap: 8px;
}

.pl__columns[b-jr9rhfwpal] {
    flex: 0 0 auto;
    min-height: 26px;
    padding: 0 12px;
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
    background: var(--surface-card-2);
}

.pl__col[b-jr9rhfwpal] {
    font-size: var(--fs-dense);
    font-weight: 600;
    letter-spacing: .06em;
    color: var(--text-3);
}

.pl__col--size[b-jr9rhfwpal],
.pl__col--modified[b-jr9rhfwpal] {
    text-align: right;
}

/* ---- body ---------------------------------------------------------------------------------- */

.pl__body[b-jr9rhfwpal] {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
}

.pl__empty[b-jr9rhfwpal] {
    margin: 0;
    padding: 20px 14px;
    font-size: var(--fs-comfortable);
    color: var(--text-3);
}

/* Sticky, because a group heading that has scrolled out of view leaves the rows under it
   unlabelled — the dates alone do not say which side of a boundary a row is on. */
.pl__group-head[b-jr9rhfwpal] {
    position: sticky;
    top: 0;
    z-index: 2;
    padding: 6px 12px 5px;
    background: var(--surface-card-2);
    border-bottom: 1px solid var(--line);
    font-size: var(--fs-dense);
    font-weight: 600;
    color: var(--text-2);
}

.pl__row[b-jr9rhfwpal] {
    position: relative;
    /* height arrives inline from BrowserFormat.RowHeightStyle — the same token the skeleton uses. */
    box-sizing: border-box;
    padding: 0 12px;
    border-bottom: 1px solid var(--line);
    color: var(--text-1);
    font-size: var(--fs-comfortable);
    cursor: default;
    transition: background-color var(--dur-fast) var(--ease-standard);
}

.pl__row:hover[b-jr9rhfwpal] {
    background: var(--surface-card-2);
}

.pl__row:focus-visible[b-jr9rhfwpal] {
    outline: none;
    box-shadow: var(--shadow-focus);
}

/* 2px workspace-accent inset, matching the tree's selected node, so "selected" looks the same in
   both panes. */
.pl__row--selected[b-jr9rhfwpal] {
    background: color-mix(in srgb, var(--workspace-accent) 20%, transparent);
    box-shadow: inset 2px 0 0 0 var(--workspace-accent);
}

.pl__cell[b-jr9rhfwpal] {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 8px;
}

.pl__cell--size[b-jr9rhfwpal],
.pl__cell--modified[b-jr9rhfwpal] {
    justify-content: flex-end;
    font-family: var(--font-mono);
    font-size: var(--fs-body);
    color: var(--text-2);
    font-variant-numeric: tabular-nums;
}

.pl__name[b-jr9rhfwpal] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: 600;
}

/* ---- row actions --------------------------------------------------------------------------- */

.pl__cell--actions[b-jr9rhfwpal] {
    position: relative;
    justify-content: flex-end;
    gap: 2px;
}

.pl__action[b-jr9rhfwpal] {
    width: var(--target-chrome);
    height: var(--target-chrome);
    display: grid;
    place-items: center;
    padding: 0;
    border: 0;
    border-radius: var(--r-sm);
    background: none;
    color: var(--text-3);
    cursor: pointer;
    opacity: 0;
    transition: opacity var(--dur-fast) var(--ease-standard),
                background-color var(--dur-fast) var(--ease-standard);
}

/* Visible on hover, on keyboard focus anywhere in the row, and while the row is selected. Never
   hidden from the keyboard. */
.pl__row:hover .pl__action[b-jr9rhfwpal],
.pl__row:focus-within .pl__action[b-jr9rhfwpal],
.pl__row--selected .pl__action[b-jr9rhfwpal],
.pl__action[aria-expanded="true"][b-jr9rhfwpal] {
    opacity: 1;
}

.pl__action:hover[b-jr9rhfwpal] {
    background: var(--surface-card-3);
    color: var(--text-1);
}

.pl__action:focus-visible[b-jr9rhfwpal] {
    outline: none;
    box-shadow: var(--shadow-focus);
    opacity: 1;
}

.pl__menu[b-jr9rhfwpal] {
    position: absolute;
    top: calc(100% - 4px);
    right: 0;
    z-index: 20;
    min-width: 176px;
    padding: 4px;
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    background: var(--surface-card);
    box-shadow: var(--shadow-lg);
}

.pl__menu-item[b-jr9rhfwpal] {
    width: 100%;
    min-height: var(--target-chrome);
    padding: 0 10px;
    border: 0;
    border-radius: var(--r-sm);
    background: none;
    color: var(--text-1);
    font-family: var(--font-ui);
    font-size: var(--fs-body);
    text-align: left;
    cursor: pointer;
}

.pl__menu-item:hover:not(:disabled)[b-jr9rhfwpal] {
    background: var(--surface-card-2);
}

.pl__menu-item:focus-visible[b-jr9rhfwpal] {
    outline: none;
    box-shadow: var(--shadow-focus);
}

.pl__menu-item:disabled[b-jr9rhfwpal] {
    color: var(--text-4);
    cursor: default;
}

.pl__menu-item--danger:not(:disabled)[b-jr9rhfwpal] {
    color: var(--status-err);
}

.pl__submenu[b-jr9rhfwpal] {
    margin: 2px 0 2px 10px;
    padding-left: 6px;
    border-left: 1px solid var(--line);
}

.pl__menu-item--nested[b-jr9rhfwpal] {
    font-size: var(--fs-dense);
}

/* ---- inline rename (artboard 1h) ------------------------------------------------------------ */

/* Spans every column: the field wants the whole row, and the columns to its right have nothing
   meaningful to show while the name is being edited. */
.pl__rename[b-jr9rhfwpal] {
    grid-column: 1 / -1;
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
}

.pl__rename-input[b-jr9rhfwpal] {
    flex: 1 1 auto;
    min-width: 0;
    height: 26px;
    padding: 0 8px;
    border: 2px solid var(--accent);
    border-radius: var(--r-sm);
    background: var(--surface-card-3);
    color: var(--text-1);
    font-family: var(--font-ui);
    font-size: var(--fs-comfortable);
}

.pl__rename-input:focus-visible[b-jr9rhfwpal] {
    outline: none;
    box-shadow: var(--shadow-focus);
}

/* --accent-on, never assumed white: Frost's accent is pale blue and Sand's near-cream. */
.pl__rename-save[b-jr9rhfwpal] {
    flex: 0 0 auto;
    min-height: 26px;
    padding: 0 12px;
    border: 1px solid var(--accent);
    border-radius: var(--r-sm);
    background: var(--accent);
    color: var(--accent-on);
    font-family: var(--font-ui);
    font-size: var(--fs-body);
    font-weight: 600;
    cursor: pointer;
    transition: filter var(--dur-fast) var(--ease-standard);
}

.pl__rename-save:hover:not(:disabled)[b-jr9rhfwpal] {
    filter: brightness(.94);
}

.pl__rename-save:disabled[b-jr9rhfwpal] {
    border-color: var(--line);
    background: none;
    color: var(--text-3);
    cursor: default;
}

.pl__rename-save:focus-visible[b-jr9rhfwpal],
.pl__rename-cancel:focus-visible[b-jr9rhfwpal] {
    outline: none;
    box-shadow: var(--shadow-focus);
}

.pl__rename-cancel[b-jr9rhfwpal] {
    flex: 0 0 auto;
    min-height: 26px;
    padding: 0 10px;
    border: 0;
    border-radius: var(--r-sm);
    background: none;
    color: var(--text-2);
    font-family: var(--font-ui);
    font-size: var(--fs-body);
    cursor: pointer;
}

.pl__rename-cancel:hover[b-jr9rhfwpal] {
    background: var(--surface-card-3);
    color: var(--text-1);
}
/* /Components/Projects/ProjectThumbnail.razor.rz.scp.css */
/* Category-tinted monogram thumbnail. The tint arrives as `--thumb-tint`, set inline to one of the
   shared palette's `--cat-*` tokens; everything here derives from it with color-mix() so no rule
   names a value (HANDOFF §5.3). */

.thumb[b-v6rq67ab69] {
    position: relative;
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    background: color-mix(in srgb, var(--thumb-tint) 22%, var(--surface-card));
}

.thumb--row[b-v6rq67ab69] {
    width: 22px;
    height: 22px;
    border-radius: var(--r-sm);
}

.thumb--panel[b-v6rq67ab69] {
    width: 100%;
    /* The artboard's panel thumbnail is a wide landscape crop of a map. */
    aspect-ratio: 16 / 9;
    border-radius: var(--r-md);
}

.thumb__image[b-v6rq67ab69] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.thumb__monogram[b-v6rq67ab69] {
    font-family: var(--font-ui);
    font-weight: 600;
    letter-spacing: .02em;
    /* Full-strength category token over a 22% wash of the same token: the darkest available
       relationship that still comes from one token, so it holds on light and dark themes alike. */
    color: color-mix(in srgb, var(--thumb-tint) 78%, var(--text-1));
    user-select: none;
}

.thumb--row .thumb__monogram[b-v6rq67ab69] {
    font-size: 9px;
}

.thumb--panel .thumb__monogram[b-v6rq67ab69] {
    font-size: var(--fs-display);
}
/* /Components/Projects/ProjectUploadDialog.razor.rz.scp.css */
/* The .gmd upload dialog (artboard 1e's frame, driven by the browser rather than by Import). */

.pud[b-q84nszst5r] {
    position: fixed;
    inset: 0;
    z-index: 380;
    display: grid;
    place-items: center;
}

.pud__scrim[b-q84nszst5r] {
    position: absolute;
    inset: 0;
    background: var(--scrim);
}

.pud__frame[b-q84nszst5r] {
    position: relative;
    width: 560px;
    max-width: calc(100vw - 32px);
    box-sizing: border-box;
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    background: var(--surface-card);
    box-shadow: var(--shadow-dialog);
    font-family: var(--font-ui);
}

.pud__head[b-q84nszst5r] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 18px;
    border-bottom: 1px solid var(--line);
    background: var(--surface-titlebar-2);
    border-radius: var(--r-lg) var(--r-lg) 0 0;
}

.pud[b-q84nszst5r]  .pud__head-icon {
    flex: 0 0 auto;
    color: var(--accent);
}

.pud__title[b-q84nszst5r] {
    flex: 1 1 auto;
    margin: 0;
    font-size: var(--fs-heading);
    font-weight: 600;
    color: var(--text-1);
}

.pud__close[b-q84nszst5r] {
    flex: 0 0 auto;
    width: var(--target-dialog);
    height: var(--target-dialog);
    display: grid;
    place-items: center;
    border: 0;
    border-radius: var(--r-sm);
    background: none;
    color: var(--text-3);
    font-size: var(--fs-comfortable);
    cursor: pointer;
}

.pud__close:hover:not(:disabled)[b-q84nszst5r] {
    background: var(--surface-card-2);
    color: var(--text-1);
}

.pud__close:disabled[b-q84nszst5r] {
    color: var(--text-4);
    cursor: default;
}

.pud__close:focus-visible[b-q84nszst5r] {
    outline: none;
    box-shadow: var(--shadow-focus);
}

.pud__body[b-q84nszst5r] {
    padding: 18px;
}

.pud__lead[b-q84nszst5r] {
    margin: 0 0 14px;
    font-size: var(--fs-comfortable);
    line-height: 1.45;
    color: var(--text-2);
}

/* A label wrapping the input, so clicking anywhere on the block opens the picker while the input
   itself keeps its native keyboard behaviour. */
.pud__picker[b-q84nszst5r] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 18px;
    border: 1px dashed var(--line-strong);
    border-radius: var(--r-md);
    background: var(--surface-card-2);
    cursor: pointer;
    transition: border-color var(--dur-fast) var(--ease-standard);
}

.pud__picker:hover[b-q84nszst5r] {
    border-color: var(--accent);
}

.pud__picker-label[b-q84nszst5r] {
    font-size: var(--fs-comfortable);
    font-weight: 600;
    color: var(--text-1);
}

.pud__input[b-q84nszst5r] {
    font-family: var(--font-ui);
    font-size: var(--fs-body);
    color: var(--text-2);
}

.pud__input:focus-visible[b-q84nszst5r] {
    outline: none;
    box-shadow: var(--shadow-focus);
    border-radius: var(--r-sm);
}
/* /Components/Projects/SampleCardEditor.razor.rz.scp.css */
/* Sample card editor (staff only). Moved verbatim out of ProjectDetailsPanel.razor.css with the
   markup: scoped CSS does not cross a component boundary, so rules for markup this component owns
   have to live in this component's sheet. Color is token-only, like every other panel sheet. */

/* Boxed off from the rest of the details panel on purpose: this is curation for the public landing
   page, not a property of the project, and only staff ever see it. */
.dp__card[b-sgog184sdh] {
    display: grid;
    gap: 10px;
    margin: 0 0 16px;
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    background: var(--surface-card-2);
}

/* The panel's own section heading rule, not a near-duplicate of it: same shape as .dp__section-head
   so "SAMPLE CARD" reads as a peer of VARIABLES and VERSION HISTORY. It is restated here rather
   than reused because the panel's sheet cannot reach this component's markup. */
.dp__card-title[b-sgog184sdh] {
    margin: 0;
    font-size: var(--fs-dense);
    font-weight: 600;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--text-3);
}

.dp__card-help[b-sgog184sdh] {
    margin: -6px 0 0;
    font-size: var(--fs-dense);
    color: var(--text-3);
}

.dp__card-label[b-sgog184sdh] {
    display: grid;
    gap: 4px;
    font-size: var(--fs-dense);
    color: var(--text-2);
}

.dp__card-field[b-sgog184sdh] {
    width: 100%;
    box-sizing: border-box;
    min-height: var(--target-chrome);
    padding: 0 8px;
    border: 1px solid var(--line-strong);
    border-radius: var(--r-sm);
    background: var(--surface-card-3);
    color: var(--text-1);
    font-family: var(--font-ui);
    font-size: var(--fs-body);
}

.dp__card-field:focus-visible[b-sgog184sdh] {
    outline: none;
    border-color: var(--accent);
    box-shadow: var(--shadow-focus);
}

.dp__card-actions[b-sgog184sdh] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.dp__card-thumb[b-sgog184sdh] {
    display: grid;
    gap: 6px;
    padding-top: 10px;
    border-top: 1px solid var(--line);
}

/* ::deep, and by element rather than by class. The file input is rendered by <InputFile>, which is
   a CHILD COMPONENT — its markup is compiled elsewhere and never carries this sheet's scope
   attribute, so the old `.dp__card-file` rule matched nothing however the class was forwarded. */
.dp__card-thumb[b-sgog184sdh]  input[type="file"] {
    max-width: 100%;
    font-family: var(--font-ui);
    font-size: var(--fs-dense);
    color: var(--text-2);
}

.dp__card-error[b-sgog184sdh] {
    margin: 0;
    font-size: var(--fs-dense);
    color: var(--status-err);
}
/* /Components/Projects/SkeletonRows.razor.rz.scp.css */
/* Loading skeletons (artboard 1d). `--skeleton` is the palette's placeholder token; the pulse is
   opacity only — HANDOFF §6 forbids scale and bounce, and a moving gradient on a full list is the
   most expensive thing a loading state can do. */

.skel[b-4as6yqozo8] {
    font-family: var(--font-ui);
}

.skel__sr[b-4as6yqozo8] {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
    border: 0;
}

.skel__bar[b-4as6yqozo8] {
    display: block;
    border-radius: var(--r-sm);
    background: var(--skeleton);
    animation: skel-pulse-b-4as6yqozo8 1400ms var(--ease-standard) infinite;
}

@keyframes skel-pulse-b-4as6yqozo8 {
    0%, 100% { opacity: 1; }
    50% { opacity: .55; }
}

/* ---- list ---------------------------------------------------------------------------------- */

.skel__row[b-4as6yqozo8] {
    /* height comes from the inline style, which is the same token the real rows use. */
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 0 12px;
    box-sizing: border-box;
    border-bottom: 1px solid var(--line);
}

.skel__bar--thumb[b-4as6yqozo8] {
    width: 22px;
    height: 22px;
    flex: 0 0 auto;
}

.skel__bar--name[b-4as6yqozo8] {
    height: 10px;
    margin-right: auto;
}

.skel__bar--size[b-4as6yqozo8] {
    width: 54px;
    height: 10px;
    flex: 0 0 auto;
}

.skel__bar--date[b-4as6yqozo8] {
    width: 86px;
    height: 10px;
    flex: 0 0 auto;
}

/* ---- details panel ------------------------------------------------------------------------- */

.skel--details[b-4as6yqozo8] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 12px;
}

.skel__bar--thumbnail[b-4as6yqozo8] {
    width: 100%;
    aspect-ratio: 16 / 9;
    border-radius: var(--r-md);
}

.skel__bar--title[b-4as6yqozo8] {
    width: 72%;
    height: 16px;
}

.skel__bar--breadcrumb[b-4as6yqozo8] {
    width: 48%;
    height: 10px;
}

.skel__bar--line[b-4as6yqozo8] {
    width: 100%;
    height: 10px;
}

.skel__bar--line-short[b-4as6yqozo8] {
    width: 64%;
}

.skel__bar--button[b-4as6yqozo8] {
    width: 100%;
    height: var(--target-dialog);
    border-radius: var(--r-md);
    margin-top: 4px;
}

/* ---- stat grid ----------------------------------------------------------------------------- */

.skel--stats[b-4as6yqozo8] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px 16px;
    padding: 12px;
}

.skel__stat[b-4as6yqozo8] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.skel__bar--stat-label[b-4as6yqozo8] {
    width: 62%;
    height: 8px;
}

.skel__bar--stat-value[b-4as6yqozo8] {
    width: 84%;
    height: 12px;
}

@media (prefers-reduced-motion: reduce) {
    .skel__bar[b-4as6yqozo8] { animation: none; }
}
/* /Components/Projects/UploadProgressList.razor.rz.scp.css */
/* Per-file upload rows (artboard 1e). */

.up[b-ehc71x8iim] {
    font-family: var(--font-ui);
}

.up__list[b-ehc71x8iim] {
    margin: 0;
    padding: 0;
    list-style: none;
}

.up__item + .up__item[b-ehc71x8iim] {
    margin-top: 14px;
}

.up__row[b-ehc71x8iim] {
    display: flex;
    align-items: baseline;
    gap: 12px;
    margin-bottom: 6px;
}

.up__name[b-ehc71x8iim] {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: var(--fs-comfortable);
    font-weight: 600;
    color: var(--text-1);
}

/* Monospaced, because the numbers in it change several times a second and a proportional font makes
   the whole line jitter as the digits change width. */
.up__status[b-ehc71x8iim] {
    flex: 0 0 auto;
    font-family: var(--font-mono);
    font-size: var(--fs-body);
    color: var(--text-3);
    font-variant-numeric: tabular-nums;
}

.up__status--failed[b-ehc71x8iim] {
    color: var(--status-err);
}

.up__bar[b-ehc71x8iim] {
    height: 4px;
    border-radius: var(--r-pill);
    background: var(--surface-card-3);
    overflow: hidden;
}

.up__fill[b-ehc71x8iim] {
    display: block;
    height: 100%;
    border-radius: var(--r-pill);
    background: var(--accent);
    transition: width var(--dur) var(--ease-standard);
}

.up__fill--failed[b-ehc71x8iim] {
    background: var(--status-err);
}

.up__error[b-ehc71x8iim] {
    margin: 6px 0 0;
    padding: 6px 8px;
    border-left: 2px solid var(--status-err);
    border-radius: var(--r-sm);
    background: var(--caveat-err-fill);
    color: var(--text-1);
    font-size: var(--fs-body);
    line-height: 1.4;
}

.up__retry[b-ehc71x8iim] {
    margin-left: 8px;
    min-height: 22px;
    padding: 0 8px;
    border: 1px solid var(--line-strong);
    border-radius: var(--r-sm);
    background: var(--surface-card-2);
    color: var(--text-1);
    font-family: var(--font-ui);
    font-size: var(--fs-dense);
    cursor: pointer;
}

.up__retry:hover[b-ehc71x8iim] {
    filter: brightness(.94);
}

.up__retry:focus-visible[b-ehc71x8iim] {
    outline: none;
    box-shadow: var(--shadow-focus);
}

.up__note[b-ehc71x8iim] {
    margin: 16px 0 0;
    padding: 10px 12px;
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    background: var(--surface-card-2);
    color: var(--text-2);
    font-size: var(--fs-comfortable);
    line-height: 1.45;
}

.up__footer[b-ehc71x8iim] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 16px;
    padding-top: 14px;
    border-top: 1px solid var(--line);
}

.up__summary[b-ehc71x8iim] {
    margin-right: auto;
    font-size: var(--fs-body);
    color: var(--text-3);
}

.up__button[b-ehc71x8iim] {
    min-height: var(--target-dialog);
    padding: 0 16px;
    border: 1px solid var(--line-strong);
    border-radius: var(--r-md);
    background: var(--surface-card-2);
    color: var(--text-1);
    font-family: var(--font-ui);
    font-size: var(--fs-comfortable);
    cursor: pointer;
    transition: filter var(--dur-fast) var(--ease-standard);
}

.up__button:hover:not(:disabled)[b-ehc71x8iim] {
    filter: brightness(.94);
}

.up__button:focus-visible[b-ehc71x8iim] {
    outline: none;
    box-shadow: var(--shadow-focus);
}

.up__button--quiet[b-ehc71x8iim] {
    border-color: transparent;
    background: none;
    color: var(--text-2);
}

/* --accent-on, never assumed white (Frost, Sand). */
.up__button--primary[b-ehc71x8iim] {
    border-color: var(--accent);
    background: var(--accent);
    color: var(--accent-on);
    font-weight: 600;
}

.up__button--primary:disabled[b-ehc71x8iim] {
    border-color: var(--line);
    background: none;
    color: var(--text-3);
    cursor: default;
}
/* /Components/Shell/AppTitleBar.razor.rz.scp.css */
/* Title bar — h 44, fixed. Chrome tokens, not surface tokens. */

.tb[b-f7rv2zz8ce] {
    height: var(--titlebar-h);
    flex: 0 0 var(--titlebar-h);
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 0 12px 0 0;
    background: var(--chrome-titlebar);
    color: var(--chrome-button-fg);
    font-family: var(--font-ui);
    border-bottom: 1px solid var(--line);
}

.tb__brand[b-f7rv2zz8ce] {
    height: 100%;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 0 14px;
    color: var(--chrome-button-fg);
    text-decoration: none;
}

.tb__brand:focus-visible[b-f7rv2zz8ce] {
    outline: none;
    box-shadow: var(--shadow-focus);
}

.tb__mark[b-f7rv2zz8ce] {
    display: inline-flex;
    color: var(--vesta-cyan);
}

.tb__wordmark[b-f7rv2zz8ce] {
    font-size: var(--fs-heading);
    font-weight: 400;
    white-space: nowrap;
}

.tb__wordmark strong[b-f7rv2zz8ce] {
    font-weight: 700;
}

.tb__project[b-f7rv2zz8ce] {
    display: flex;
    align-items: center;
    min-width: 0;
    transition: opacity var(--dur) var(--ease-standard);
}

.tb__project[inert][b-f7rv2zz8ce],
.tb__tools[inert][b-f7rv2zz8ce] {
    opacity: .4;
}

.tb__spacer[b-f7rv2zz8ce] {
    flex: 1 1 auto;
}

.tb__tools[b-f7rv2zz8ce] {
    display: flex;
    align-items: center;
    gap: 10px;
    transition: opacity var(--dur) var(--ease-standard);
}

.tb__search[b-f7rv2zz8ce] {
    position: relative;
    display: flex;
    align-items: center;
}

.tb__search-icon[b-f7rv2zz8ce] {
    position: absolute;
    left: 8px;
    color: var(--text-3);
    pointer-events: none;
}

.tb__search-input[b-f7rv2zz8ce] {
    width: 260px;
    height: 28px;
    padding: 0 10px 0 28px;
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    background: var(--surface-titlebar-2);
    color: var(--text-1);
    font-family: var(--font-ui);
    font-size: var(--fs-body);
}

.tb__search-input[b-f7rv2zz8ce]::placeholder {
    color: var(--text-3);
}

.tb__search-input:focus-visible[b-f7rv2zz8ce] {
    outline: none;
    box-shadow: var(--shadow-focus);
}

.tb__help[b-f7rv2zz8ce] {
    width: var(--target-chrome);
    height: var(--target-chrome);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--r-pill);
    color: var(--chrome-button-fg);
    text-decoration: none;
    transition: background-color var(--dur-fast) var(--ease-standard);
}

.tb__help:hover[b-f7rv2zz8ce] {
    background: var(--surface-titlebar-2);
    color: var(--text-1);
}

.tb__help:focus-visible[b-f7rv2zz8ce] {
    outline: none;
    box-shadow: var(--shadow-focus);
}

/* Sign In takes the identity slot when nobody is signed in. Filled rather than quiet: the landing
   spec leads with sign-in, so this is the one primary action in the chrome. */
.tb__signin[b-f7rv2zz8ce] {
    height: var(--target-chrome);
    display: inline-flex;
    align-items: center;
    padding: 0 12px;
    border-radius: var(--r-sm);
    background: var(--accent);
    color: var(--accent-on);
    font-family: var(--font-ui);
    font-size: var(--fs-body);
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
    transition: filter var(--dur-fast) var(--ease-standard);
}

.tb__signin:hover[b-f7rv2zz8ce] {
    filter: brightness(1.08);
}

.tb__signin:focus-visible[b-f7rv2zz8ce] {
    outline: none;
    box-shadow: var(--shadow-focus);
}

/* No Auth0 client id on this deployment: the identity slot states that instead of offering a
   sign-in that cannot complete. Quiet inline text, deliberately NOT button-shaped — there is
   nothing to press — and it gives up width before it pushes the bar out of shape. */
.tb__signin-unavailable[b-f7rv2zz8ce] {
    min-width: 0;
    flex: 0 1 auto;
    color: var(--chrome-button-fg);
    font-family: var(--font-ui);
    font-size: var(--fs-body);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* At the graceful floor the search field gives up width before anything else does. */
@media (max-width: 1280px) {
    .tb__search-input[b-f7rv2zz8ce] {
        width: 190px;
    }
}

@media (max-width: 1024px) {
    .tb__search-input[b-f7rv2zz8ce] {
        width: 140px;
    }

    .tb__wordmark[b-f7rv2zz8ce] {
        display: none;
    }
}
/* /Components/Shell/FallbackBanner.razor.rz.scp.css */
/* Fallback banner — h 34. The caveat-warn triple already ships a fill, a border and an accent that
   are paired per polarity, which is why this uses them rather than --status-warn: a single warn
   value fails AA on a light pane (HANDOFF §5.3). */

.fb[b-aprmbhz5ia] {
    height: var(--banner-h);
    flex: 0 0 var(--banner-h);
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 0 10px;
    background: var(--caveat-warn-fill);
    border-bottom: 1px solid var(--caveat-warn-border);
    color: var(--text-1);
    font-family: var(--font-ui);
    font-size: var(--fs-body);
}

/* ::deep because this is a child component's (ShellIcon's) <svg>: Blazor stamps the scope
   attribute onto this component's own markup only. See ReadOnlyNotice.razor.css — same rule, and
   this file is where that one was copied from. */
.fb[b-aprmbhz5ia]  .fb__icon {
    color: var(--caveat-warn-accent);
    flex: 0 0 auto;
}

.fb__text[b-aprmbhz5ia] {
    margin-right: auto;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.fb__action[b-aprmbhz5ia] {
    min-height: var(--target-chrome);
    padding: 0 10px;
    border: 1px solid var(--line-strong);
    border-radius: var(--r-sm);
    background: var(--surface-card);
    color: var(--text-1);
    font-family: var(--font-ui);
    font-size: var(--fs-body);
    font-weight: 600;
    cursor: pointer;
    transition: filter var(--dur-fast) var(--ease-standard);
}

.fb__action:hover:not(:disabled)[b-aprmbhz5ia] {
    filter: brightness(.94);
}

.fb__action:disabled[b-aprmbhz5ia] {
    color: var(--text-3);
    cursor: default;
}

.fb__action:focus-visible[b-aprmbhz5ia],
.fb__dismiss:focus-visible[b-aprmbhz5ia] {
    outline: none;
    box-shadow: var(--shadow-focus);
}

.fb__dismiss[b-aprmbhz5ia] {
    width: var(--target-chrome);
    height: var(--target-chrome);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: var(--r-sm);
    background: none;
    color: var(--text-2);
    cursor: pointer;
    transition: background-color var(--dur-fast) var(--ease-standard);
}

.fb__dismiss:hover[b-aprmbhz5ia] {
    background: var(--surface-card-2);
}
/* /Components/Shell/HubFooter.razor.rz.scp.css */
/* Hub/wizard footer — layout only; the buttons are the global .hub-button* classes (app.css),
   which read the same --advisor-* tokens the desktop's AdvisorGhostButtonStyle /
   AdvisorPrimaryButtonStyle bind to. Tokens only, no colour literal (HANDOFF §5.3). */

.hf[b-tewceqvdhk] {
    flex: 0 0 58px;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 0 18px;
    border-top: 1px solid var(--line);
    background: var(--surface-card);
}

.hf__leading[b-tewceqvdhk] {
    min-width: 0;
    color: var(--text-2);
    font-size: var(--fs-body);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.hf__right[b-tewceqvdhk] {
    margin-left: auto;
    display: flex;
    align-items: center;
    gap: 10px;
}
/* /Components/Shell/NavRail.razor.rz.scp.css */
/* Nav rail — w 76, 48 icons-only at <=1024 (shell.css narrows --rail-w for us).
   Color is chrome-scoped: the rail IS chrome, so it reads --chrome-*, not --surface-*. */

.rail[b-i20ahxy7wz] {
    width: var(--rail-w);
    flex: 0 0 var(--rail-w);
    display: flex;
    flex-direction: column;
    padding: 8px 0 10px;
    background: linear-gradient(to bottom, var(--chrome-sidebar-top), var(--chrome-sidebar-bottom));
    border-right: 1px solid var(--line);
    overflow: hidden;
}

/* The rail is never inert (September 14, 2026): its launchers stay live during a flow, as on the
   desktop, and leaving by one of them is the flow's Cancel. The old 32% `.rail--inert` rule is gone. */

.rail__group[b-i20ahxy7wz] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.rail__group--footer[b-i20ahxy7wz] {
    margin-top: auto;
}

.rail__divider[b-i20ahxy7wz] {
    height: 1px;
    border: 0;
    margin: 8px 14px;
    background: var(--line);
}

.rail__slot[b-i20ahxy7wz] {
    display: block;
    position: relative;
}

.rail__item[b-i20ahxy7wz] {
    width: 100%;
    min-height: 52px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    padding: 6px 2px;
    border: 0;
    border-radius: var(--r-md);
    background: none;
    color: var(--chrome-button-fg);
    font-family: var(--font-ui);
    font-size: var(--fs-dense);
    text-decoration: none;
    cursor: pointer;
    transition: background-color var(--dur-fast) var(--ease-standard),
                color var(--dur-fast) var(--ease-standard);
}

.rail__item:hover[b-i20ahxy7wz] {
    background: var(--surface-card-2);
    color: var(--text-1);
}

.rail__item:focus-visible[b-i20ahxy7wz] {
    outline: none;
    box-shadow: var(--shadow-focus);
}

.rail__item--active[b-i20ahxy7wz] {
    background: var(--surface-card-2);
    color: var(--accent);
}

/* The active marker is a 2px inset bar, matching the selected folder node in the browser. */
.rail__item--active[b-i20ahxy7wz]::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    width: 2px;
    height: 34px;
    margin-top: -17px;
    border-radius: var(--r-pill);
    background: var(--accent);
}

.rail__item--disabled[b-i20ahxy7wz],
.rail__item:disabled[b-i20ahxy7wz] {
    color: var(--text-4);
    cursor: default;
}

.rail__item--disabled:hover[b-i20ahxy7wz],
.rail__item:disabled:hover[b-i20ahxy7wz] {
    background: none;
    color: var(--text-4);
}

.rail__label[b-i20ahxy7wz] {
    line-height: 1.1;
    text-align: center;
}

/* Icons-only at the degraded floor. The label is removed from the flow, not merely hidden, so the
   48px rail does not reserve space for text it will never show. */
@media (max-width: 1024px) {
    .rail__item[b-i20ahxy7wz] {
        min-height: 40px;
    }

    .rail__label[b-i20ahxy7wz] {
        display: none;
    }
}
/* /Components/Shell/PanelModal.razor.rz.scp.css */
/* Panel-modal — HANDOFF §3, §4.

   POSITIONED AGAINST THE SHELL'S GEOMETRY TOKENS, NOT THE VIEWPORT. `top` clears the title bar,
   `left` clears the rail, `bottom` clears the status bar, so the modal lands exactly on the main
   panel and the workspace stays visible around it. `inset: 0` would make it a page. */

.pm[b-0rr5c580pw] {
    position: fixed;
    top: var(--titlebar-h);
    left: var(--rail-w);
    right: 0;
    bottom: var(--status-h);
    z-index: 60;
    display: flex;
    padding: var(--gap-panel);
    outline: none;
}

/* The workspace behind reads through at 30% under the scrim (HANDOFF §4) — the thing that makes it
   "on top of my work" rather than "a different page". */
.pm__scrim[b-0rr5c580pw] {
    position: absolute;
    inset: 0;
    background: var(--scrim);
}

/* A zero-size tab stop at each end of the dialog. Focus landing on one is bounced to the opposite
   end, which is the entire trap. Not `display: none` — a hidden element is not focusable. */
.pm__guard[b-0rr5c580pw] {
    width: 0;
    height: 0;
    overflow: hidden;
    outline: none;
}

.pm__frame[b-0rr5c580pw] {
    position: relative;
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    min-width: 0;
    border: 1px solid var(--workspace-accent);
    border-radius: var(--r-lg);
    background: var(--surface-panel);
    box-shadow: var(--shadow-dialog);
    overflow: hidden;
    font-family: var(--font-ui);
}

.pm__header[b-0rr5c580pw] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 12px 12px 14px;
    background: var(--surface-titlebar-2);
}

.pm__tile[b-0rr5c580pw] {
    width: 34px;
    height: 34px;
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--r-md);
    background: var(--accent);
    color: var(--accent-on);
}

.pm__heading[b-0rr5c580pw] {
    min-width: 0;
    margin-right: auto;
}

.pm__kicker[b-0rr5c580pw] {
    font-family: var(--font-mono);
    font-size: var(--fs-dense);
    color: var(--text-3);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.pm__title[b-0rr5c580pw] {
    margin: 0;
    font-size: var(--fs-heading);
    font-weight: 600;
    color: var(--text-1);
}

.pm__header-actions[b-0rr5c580pw] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.pm__counter[b-0rr5c580pw] {
    flex: 0 0 auto;
    color: var(--text-2);
    font-size: var(--fs-comfortable);
}

/* .pm__close is styled by the global .hub-close (app.css) — the desktop's AdvisorCloseButtonStyle. */

/* The ONLY scrolling region inside the modal, mirroring the shell's own rule. */
.pm__body[b-0rr5c580pw] {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
    padding: 18px 22px;
    color: var(--text-1);
    font-size: var(--fs-comfortable);
}

.pm__confirm[b-0rr5c580pw] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 22px;
    background: var(--caveat-err-fill);
    border-top: 1px solid var(--caveat-err-border);
    font-size: var(--fs-body);
    color: var(--text-1);
}

.pm__confirm-text[b-0rr5c580pw] {
    margin-right: auto;
}

/* The footer is <HubFooter> and its buttons are the global .hub-button* classes (app.css): one
   look for every wizard and hub, bound to the desktop's --advisor-* tokens. The .pm__button* and
   .pm__back names survive on the elements as test hooks only. */

/* Wizards go full-screen at the degraded floor (artboard 1k): the rail is 48px of icons and the
   panel needs every pixel. */
@media (max-width: 1024px) {
    .pm[b-0rr5c580pw] {
        left: 0;
        padding: 0;
    }

    .pm__frame[b-0rr5c580pw] {
        border-radius: 0;
        border-left: 0;
        border-right: 0;
    }
}
/* /Components/Shell/ProjectSwitcher.razor.rz.scp.css */
/* Project switcher — 360px popover (artboard 1f). */

.psw[b-n765edm1db] {
    position: relative;
}

.psw__button[b-n765edm1db] {
    height: 30px;
    max-width: 320px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 0 10px;
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    background: var(--surface-titlebar-2);
    color: var(--chrome-button-fg);
    font-family: var(--font-ui);
    font-size: var(--fs-comfortable);
    font-weight: 600;
    cursor: pointer;
    transition: filter var(--dur-fast) var(--ease-standard);
}

.psw__button:hover:not(:disabled)[b-n765edm1db] {
    filter: brightness(.94);
}

.psw__button:focus-visible[b-n765edm1db] {
    outline: none;
    box-shadow: var(--shadow-focus);
}

.psw__button:disabled[b-n765edm1db] {
    color: var(--text-3);
    cursor: default;
}

.psw__button-icon[b-n765edm1db] {
    color: var(--accent);
}

.psw__button-label[b-n765edm1db] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.psw__pop[b-n765edm1db] {
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    width: 360px;
    z-index: 50;
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    background: var(--surface-card);
    box-shadow: var(--shadow-dialog);
    overflow: hidden;
}

.psw__filter[b-n765edm1db] {
    padding: 10px;
}

.psw__filter-input[b-n765edm1db] {
    width: 100%;
    height: 34px;
    padding: 0 10px;
    border: 1px solid var(--line-strong);
    border-radius: var(--r-md);
    background: var(--surface-card-2);
    color: var(--text-1);
    font-family: var(--font-ui);
    font-size: var(--fs-comfortable);
}

.psw__filter-input[b-n765edm1db]::placeholder {
    color: var(--text-3);
}

.psw__filter-input:focus-visible[b-n765edm1db] {
    outline: none;
    box-shadow: var(--shadow-focus);
}

.psw__section[b-n765edm1db] {
    border-top: 1px solid var(--line);
}

.psw__section-head[b-n765edm1db] {
    padding: 8px 12px 6px;
    color: var(--text-3);
    font-family: var(--font-ui);
    font-size: var(--fs-dense);
    font-weight: 600;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.psw__empty[b-n765edm1db] {
    padding: 4px 12px 12px;
    color: var(--text-3);
    font-family: var(--font-ui);
    font-size: var(--fs-body);
}

.psw__row[b-n765edm1db] {
    width: 100%;
    min-height: 40px;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 0 12px;
    border: 0;
    background: none;
    color: var(--text-1);
    font-family: var(--font-ui);
    font-size: var(--fs-comfortable);
    text-align: left;
    cursor: pointer;
    transition: background-color var(--dur-fast) var(--ease-standard);
}

/* One highlight, driven by keyboard OR pointer — hover sets the same index, so there is never a
   second "sort of selected" row for Enter to disagree with. */
.psw__row--highlighted[b-n765edm1db] {
    background: var(--surface-card-2);
    font-weight: 600;
}

.psw__row:focus-visible[b-n765edm1db] {
    outline: none;
    box-shadow: var(--shadow-focus);
}

.psw__row-icon[b-n765edm1db] {
    color: var(--accent);
    flex: 0 0 auto;
}

.psw__row-name[b-n765edm1db] {
    margin-right: auto;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.psw__row-meta[b-n765edm1db] {
    flex: 0 0 auto;
    color: var(--text-3);
    font-size: var(--fs-body);
    font-weight: 400;
}

.psw__row[aria-current="true"] .psw__row-meta[b-n765edm1db] {
    color: var(--accent);
}

.psw__footer[b-n765edm1db] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 8px 12px;
    border-top: 1px solid var(--line);
    background: var(--surface-card-2);
}

.psw__link[b-n765edm1db] {
    color: var(--accent);
    font-family: var(--font-ui);
    font-size: var(--fs-comfortable);
    font-weight: 600;
    text-decoration: none;
    min-height: var(--target-chrome);
    display: inline-flex;
    align-items: center;
}

.psw__link:hover[b-n765edm1db] {
    text-decoration: underline;
}

.psw__link:focus-visible[b-n765edm1db] {
    outline: none;
    box-shadow: var(--shadow-focus);
    border-radius: var(--r-sm);
}

.psw__new[b-n765edm1db] {
    min-height: var(--target-chrome);
    padding: 0 10px;
    border: 0;
    border-radius: var(--r-sm);
    background: none;
    color: var(--text-1);
    font-family: var(--font-ui);
    font-size: var(--fs-comfortable);
    cursor: pointer;
    transition: background-color var(--dur-fast) var(--ease-standard);
}

.psw__new:hover[b-n765edm1db] {
    background: var(--surface-card-3);
}

.psw__new:focus-visible[b-n765edm1db] {
    outline: none;
    box-shadow: var(--shadow-focus);
}
/* /Components/Shell/ReadOnlyNotice.razor.rz.scp.css */
/* Read-only sample notice — same band geometry as the fallback banner (h 34), the INFO tone. It
   uses the ordinary card surfaces rather than the caveat-warn triple on purpose: nothing has gone
   wrong here, and a warning fill would tell the visitor otherwise. */

.ro[b-kg6cchrrtk] {
    height: var(--banner-h);
    flex: 0 0 var(--banner-h);
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 0 10px;
    background: var(--surface-card-2);
    border-bottom: 1px solid var(--line);
    color: var(--text-1);
    font-family: var(--font-ui);
    font-size: var(--fs-body);
}

/* ::deep because this is a child component's (ShellIcon's) <svg>: Blazor stamps the scope
   attribute onto this component's own markup only. Without it the rule matches nothing, and the
   glyph loses both its quiet color AND its `flex: 0 0 auto` — which lets a flex row squeeze it. */
.ro[b-kg6cchrrtk]  .ro__icon {
    color: var(--text-2);
    flex: 0 0 auto;
}

/* The sign-in slot when this deployment cannot sign anyone in. It shrinks before the sample line
   does, because "you are looking at a sample" is the sentence that has to survive. */
.ro__unavailable[b-kg6cchrrtk] {
    min-width: 0;
    flex: 0 1 auto;
    color: var(--text-2);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ro__text[b-kg6cchrrtk] {
    margin-right: auto;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ro__signin[b-kg6cchrrtk] {
    min-height: var(--target-chrome);
    display: inline-flex;
    align-items: center;
    padding: 0 10px;
    border: 1px solid var(--line-strong);
    border-radius: var(--r-sm);
    background: var(--surface-card);
    color: var(--text-1);
    font-family: var(--font-ui);
    font-size: var(--fs-body);
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
    transition: filter var(--dur-fast) var(--ease-standard);
}

.ro__signin:hover[b-kg6cchrrtk] {
    filter: brightness(1.08);
}

.ro__signin:focus-visible[b-kg6cchrrtk],
.ro__dismiss:focus-visible[b-kg6cchrrtk] {
    outline: none;
    box-shadow: var(--shadow-focus);
}

.ro__dismiss[b-kg6cchrrtk] {
    width: var(--target-chrome);
    height: var(--target-chrome);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: var(--r-sm);
    background: none;
    color: var(--text-2);
    cursor: pointer;
    transition: background-color var(--dur-fast) var(--ease-standard);
}

.ro__dismiss:hover[b-kg6cchrrtk] {
    background: var(--surface-card-3);
}
/* /Components/Shell/RecentAnalysesPopover.razor.rz.scp.css */
/* Recent analyses — the status-bar chip and its popover (E0 E14 / W3). */

.rap[b-dbe7g3zmny] {
    position: relative;
    display: inline-flex;
    align-items: center;
}

.rap__chip[b-dbe7g3zmny] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 18px;
    padding: 0 8px;
    border: 1px solid var(--line);
    border-radius: var(--r-pill);
    background: transparent;
    color: var(--text-3);
    font: inherit;
    font-size: var(--fs-dense);
    cursor: pointer;
    white-space: nowrap;
}

.rap__chip:hover[b-dbe7g3zmny] {
    color: var(--text-1);
    border-color: var(--text-4);
}

.rap__chip:focus-visible[b-dbe7g3zmny] {
    outline: 2px solid var(--workspace-accent);
    outline-offset: 1px;
}

.rap__chip--active[b-dbe7g3zmny] {
    border-color: var(--workspace-accent);
    color: var(--text-1);
}

.rap__dot[b-dbe7g3zmny] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--workspace-accent);
}

.rap__pop[b-dbe7g3zmny] {
    position: absolute;
    right: 0;
    bottom: calc(100% + 6px);
    width: 360px;
    max-height: 60vh;
    overflow: auto;
    padding: 10px 12px;
    border: 1px solid var(--line-strong);
    border-radius: var(--r-md);
    background: var(--surface-panel);
    box-shadow: var(--shadow-lg);
    white-space: normal;
    z-index: 30;
}

.rap__head[b-dbe7g3zmny] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 8px;
}

.rap__title[b-dbe7g3zmny] {
    font-size: var(--fs-dense);
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--text-3);
}

.rap__close[b-dbe7g3zmny] {
    border: 0;
    background: transparent;
    color: var(--text-3);
    font: inherit;
    cursor: pointer;
}

.rap__empty[b-dbe7g3zmny] {
    margin: 0;
    font-size: var(--fs-body);
    color: var(--text-3);
    line-height: 1.45;
}

.rap__list[b-dbe7g3zmny] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.rap__run[b-dbe7g3zmny] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 8px 10px;
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    background: var(--surface-card);
}

.rap__run--active[b-dbe7g3zmny] {
    border-color: var(--workspace-accent);
    background: color-mix(in srgb, var(--workspace-accent) 12%, var(--surface-card));
}

.rap__run-main[b-dbe7g3zmny] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.rap__run-name[b-dbe7g3zmny] {
    font-size: var(--fs-comfortable);
    font-weight: 600;
    color: var(--text-1);
}

.rap__run-sub[b-dbe7g3zmny] {
    font-size: var(--fs-dense);
    color: var(--text-3);
}

.rap__act[b-dbe7g3zmny] {
    height: 26px;
    padding: 0 10px;
    border: 1px solid var(--line-strong);
    border-radius: var(--r-sm);
    background: var(--surface-card-2);
    color: var(--text-1);
    font: inherit;
    font-size: var(--fs-body);
    cursor: pointer;
    white-space: nowrap;
}

.rap__act--err[b-dbe7g3zmny] {
    border-color: var(--status-err);
    color: var(--status-err);
}
/* /Components/Shell/ServerSwitcher.razor.rz.scp.css */
/* Server switcher — h 26 in the 44px title bar. */

.srv[b-b1e9o4sfbm] {
    position: relative;
}

.srv__button[b-b1e9o4sfbm] {
    height: 26px;
    min-width: 132px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 0 8px;
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    background: var(--surface-titlebar-2);
    color: var(--chrome-button-fg);
    font-family: var(--font-ui);
    font-size: var(--fs-body);
    cursor: pointer;
    transition: filter var(--dur-fast) var(--ease-standard);
}

.srv__button:hover:not(:disabled)[b-b1e9o4sfbm] {
    filter: brightness(.94);
}

.srv__button:focus-visible[b-b1e9o4sfbm] {
    outline: none;
    box-shadow: var(--shadow-focus);
}

.srv__button:disabled[b-b1e9o4sfbm] {
    color: var(--text-3);
    cursor: default;
}

.srv__kicker[b-b1e9o4sfbm] {
    color: var(--text-3);
}

.srv__value[b-b1e9o4sfbm] {
    font-weight: 600;
    margin-right: auto;
}

.srv__menu[b-b1e9o4sfbm] {
    position: absolute;
    top: calc(100% + 4px);
    right: 0;
    min-width: 220px;
    z-index: 40;
    padding: 4px;
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    background: var(--surface-card);
    box-shadow: var(--shadow-lg);
}

.srv__option[b-b1e9o4sfbm] {
    width: 100%;
    min-height: var(--target-chrome);
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 0 8px;
    border: 0;
    border-radius: var(--r-sm);
    background: none;
    color: var(--text-1);
    font-family: var(--font-ui);
    font-size: var(--fs-body);
    text-align: left;
    cursor: pointer;
    transition: background-color var(--dur-fast) var(--ease-standard);
}

.srv__option:hover:not(:disabled)[b-b1e9o4sfbm] {
    background: var(--surface-card-2);
}

.srv__option:focus-visible[b-b1e9o4sfbm] {
    outline: none;
    box-shadow: var(--shadow-focus);
}

.srv__option:disabled[b-b1e9o4sfbm] {
    color: var(--text-3);
    cursor: default;
}

.srv__option--current[b-b1e9o4sfbm] {
    font-weight: 600;
}

.srv__option-label[b-b1e9o4sfbm] {
    margin-right: auto;
}

.srv__option-note[b-b1e9o4sfbm] {
    font-size: var(--fs-dense);
    color: var(--text-3);
}

.srv__tick[b-b1e9o4sfbm] {
    color: var(--accent);
}
/* /Components/Shell/StatusBar.razor.rz.scp.css */
/* Status bar — h 24, fixed at every width (artboard 1k RULES). */

.sb[b-0rb9owfwag] {
    height: var(--status-h);
    flex: 0 0 var(--status-h);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 0 12px;
    background: var(--surface-titlebar-2);
    border-top: 1px solid var(--line);
    color: var(--text-3);
    font-family: var(--font-ui);
    font-size: var(--fs-dense);
    overflow: hidden;
    white-space: nowrap;
}

.sb__left[b-0rb9owfwag] {
    overflow: hidden;
    text-overflow: ellipsis;
}

.sb__flow[b-0rb9owfwag] {
    flex: 0 0 auto;
    color: var(--text-2);
}

.sb__right[b-0rb9owfwag] {
    display: inline-flex;
    align-items: center;
    gap: 14px;
    flex: 0 0 auto;
}
/* /Components/Shell/StepRail.razor.rz.scp.css */
/* Step rail — on the wizard's title band (--surface-titlebar-2), HANDOFF §4. */

.sr[b-qouoxgak43] {
    list-style: none;
    margin: 0;
    padding: 0 14px;
    height: 48px;
    display: flex;
    align-items: center;
    gap: 6px;
    background: var(--surface-titlebar-2);
    border-bottom: 1px solid var(--line);
    font-family: var(--font-ui);
    overflow: hidden;
}

/* The connector is the only shrinking element, so labels keep their full width until the
   connectors are gone (HANDOFF §4). */
.sr__connector[b-qouoxgak43] {
    flex: 1 1 12px;
    min-width: 8px;
    height: 1px;
    background: var(--line-strong);
}

.sr__connector--done[b-qouoxgak43] {
    background: var(--accent);
}

.sr__slot[b-qouoxgak43] {
    flex: 0 0 auto;
}

.sr__step[b-qouoxgak43] {
    min-height: var(--target-dialog);
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 0 10px 0 6px;
    border: 1px solid transparent;
    border-radius: var(--r-pill);
    background: none;
    color: var(--text-3);
    font-family: var(--font-ui);
    font-size: var(--fs-comfortable);
    white-space: nowrap;
    transition: background-color var(--dur-fast) var(--ease-standard),
                border-color var(--dur-fast) var(--ease-standard);
}

.sr__chip[b-qouoxgak43] {
    width: 22px;
    height: 22px;
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--line-strong);
    border-radius: var(--r-pill);
    font-size: var(--fs-dense);
    font-weight: 600;
}

/* completed — filled tick, and the only clickable state. */
.sr__step--completed[b-qouoxgak43] {
    color: var(--text-1);
    cursor: pointer;
}

.sr__step--completed:hover[b-qouoxgak43] {
    background: var(--surface-card-2);
}

.sr__step--completed .sr__chip[b-qouoxgak43] {
    background: var(--accent);
    border-color: var(--accent);
    color: var(--accent-on);
}

/* current — outlined in the workspace accent over an 18% wash of it. */
.sr__step--current[b-qouoxgak43] {
    color: var(--text-1);
    font-weight: 600;
    border-color: var(--workspace-accent);
    background: color-mix(in srgb, var(--workspace-accent) 18%, transparent);
    cursor: default;
}

.sr__step--current .sr__chip[b-qouoxgak43] {
    border-color: var(--workspace-accent);
    color: var(--workspace-accent);
}

/* upcoming — quiet, disabled. */
.sr__step--upcoming[b-qouoxgak43] {
    color: var(--text-3);
    cursor: default;
}

.sr__step:focus-visible[b-qouoxgak43] {
    outline: none;
    box-shadow: var(--shadow-focus);
}

.sr__sr-only[b-qouoxgak43] {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
}

/* At the graceful floor the labels of steps you are not on give way; the numbered chips remain,
   so the rail still says where you are in the sequence. */
@media (max-width: 1280px) {
    .sr__step--upcoming .sr__label[b-qouoxgak43],
    .sr__step--completed .sr__label[b-qouoxgak43] {
        display: none;
    }

    .sr__step[b-qouoxgak43] {
        padding-right: 6px;
    }
}

/* The dashed "steps appear once you pick…" affordance after a one-step rail (E0 E2). */
.sr__affordance[b-qouoxgak43] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-left: auto;
    padding: 0 6px;
}

.sr__chip--ghost[b-qouoxgak43] {
    border-style: dashed;
    color: var(--text-4);
}

.sr__affordance-text[b-qouoxgak43] {
    font-size: var(--fs-body);
    font-style: italic;
    color: var(--text-4);
    white-space: nowrap;
}
/* /Components/Shell/UserMenu.razor.rz.scp.css */
/* User menu — 290px popover (artboard 1g). */

.um[b-xvpoj4ubf2] {
    position: relative;
}

.um__button[b-xvpoj4ubf2] {
    height: 32px;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 0 4px 0 0;
    border: 0;
    border-radius: var(--r-pill);
    background: none;
    color: var(--chrome-button-fg);
    cursor: pointer;
}

.um__button:focus-visible[b-xvpoj4ubf2] {
    outline: none;
    box-shadow: var(--shadow-focus);
}

.um__avatar[b-xvpoj4ubf2] {
    width: 30px;
    height: 30px;
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--r-pill);
    background: var(--accent);
    color: var(--accent-on);
    font-family: var(--font-ui);
    font-size: var(--fs-body);
    font-weight: 700;
    letter-spacing: .02em;
}

.um__avatar--lg[b-xvpoj4ubf2] {
    width: 40px;
    height: 40px;
    font-size: var(--fs-comfortable);
}

.um__pop[b-xvpoj4ubf2] {
    position: absolute;
    top: calc(100% + 6px);
    right: 0;
    width: 290px;
    z-index: 50;
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    background: var(--surface-card);
    box-shadow: var(--shadow-dialog);
    overflow: hidden;
    font-family: var(--font-ui);
}

.um__identity[b-xvpoj4ubf2] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 14px 12px;
}

.um__identity-text[b-xvpoj4ubf2] {
    min-width: 0;
}

.um__name[b-xvpoj4ubf2] {
    color: var(--text-1);
    font-size: var(--fs-heading);
    font-weight: 600;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.um__email[b-xvpoj4ubf2] {
    color: var(--text-3);
    font-size: var(--fs-body);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.um__group[b-xvpoj4ubf2] {
    padding: 6px 6px;
    border-top: 1px solid var(--line);
}

.um__group--themes[b-xvpoj4ubf2] {
    padding: 10px 14px 12px;
}

.um__group--last[b-xvpoj4ubf2] {
    padding: 6px;
}

.um__group-head[b-xvpoj4ubf2] {
    color: var(--text-3);
    font-size: var(--fs-dense);
    font-weight: 600;
    letter-spacing: .06em;
    text-transform: uppercase;
    padding-bottom: 8px;
}

.um__item[b-xvpoj4ubf2] {
    width: 100%;
    min-height: var(--target-dialog);
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 0 8px;
    border: 0;
    border-radius: var(--r-sm);
    background: none;
    color: var(--text-1);
    font-family: var(--font-ui);
    font-size: var(--fs-comfortable);
    text-align: left;
    text-decoration: none;
    cursor: pointer;
    transition: background-color var(--dur-fast) var(--ease-standard);
}

.um__item:hover[b-xvpoj4ubf2] {
    background: var(--surface-card-2);
}

.um__item:focus-visible[b-xvpoj4ubf2] {
    outline: none;
    box-shadow: var(--shadow-focus);
}

.um__grid[b-xvpoj4ubf2] {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 8px 6px;
}

.um__swatch[b-xvpoj4ubf2] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    padding: 2px;
    border: 0;
    border-radius: var(--r-sm);
    background: none;
    cursor: pointer;
    transition: filter var(--dur-fast) var(--ease-standard);
}

.um__swatch:hover[b-xvpoj4ubf2] {
    filter: brightness(.94);
}

.um__swatch:focus-visible[b-xvpoj4ubf2] {
    outline: none;
    box-shadow: var(--shadow-focus);
}

/* THE SCOPED ELEMENT. `.theme-*` is on this span and nothing else, so the tokens it redefines
   paint the chip only — the caption below stays in the user's CURRENT theme. Scoping the button
   instead is the HANDOFF §5.3 failure: Frost's and Sand's inks over the menu's surface. */
.um__chip[b-xvpoj4ubf2] {
    width: 100%;
    height: 34px;
    display: block;
    overflow: hidden;
    border: 1px solid var(--line-strong);
    border-radius: var(--r-sm);
    background: var(--surface-panel);
}

.um__chip-band[b-xvpoj4ubf2] {
    display: block;
    height: 12px;
    background: var(--chrome-titlebar);
    border-bottom: 1px solid var(--line);
}

.um__chip-body[b-xvpoj4ubf2] {
    display: block;
    height: 20px;
    background: var(--surface-card);
}

/* Outside the scope on purpose. */
.um__chip-caption[b-xvpoj4ubf2] {
    color: var(--text-2);
    font-size: var(--fs-dense);
    line-height: 1.2;
}

.um__swatch[aria-pressed="true"] .um__chip[b-xvpoj4ubf2] {
    border-color: var(--workspace-accent);
    border-width: 2px;
}

.um__swatch[aria-pressed="true"] .um__chip-caption[b-xvpoj4ubf2] {
    color: var(--text-1);
    font-weight: 600;
}

.um__note[b-xvpoj4ubf2] {
    padding-top: 10px;
    color: var(--text-3);
    font-size: var(--fs-body);
    line-height: 1.35;
}

.um__error[b-xvpoj4ubf2] {
    padding-top: 10px;
    color: var(--status-err);
    font-size: var(--fs-body);
    line-height: 1.35;
}
/* /Components/VizPanelView.razor.rz.scp.css */
/* The panel header's overflow menu (B2). Only present when the panel is editable — the read-only
   header is unchanged. */

.viz-panel__menu-wrap[b-con7tqohzg] {
    position: relative;
    display: inline-flex;
}

.viz-panel__menu[b-con7tqohzg] {
    position: absolute;
    top: calc(100% + 4px);
    right: 0;
    z-index: 60;
    display: flex;
    flex-direction: column;
    min-width: 156px;
    padding: 4px;
    border: 1px solid var(--line-strong);
    border-radius: var(--r-md);
    background: var(--surface-card);
    box-shadow: var(--shadow-md);
}

.viz-panel__menu-item[b-con7tqohzg] {
    height: var(--target-chrome);
    padding: 0 10px;
    border: none;
    border-radius: var(--r-sm);
    background: none;
    color: var(--text-1);
    font-family: var(--font-ui);
    font-size: var(--fs-dense);
    text-align: left;
    cursor: pointer;
}

.viz-panel__menu-item:hover:not(:disabled)[b-con7tqohzg] {
    background: var(--surface-card-2);
}

.viz-panel__menu-item:disabled[b-con7tqohzg] {
    color: var(--text-4);
    cursor: default;
}

.viz-panel__menu-item--danger:not(:disabled)[b-con7tqohzg] {
    color: var(--status-err);
}

.viz-panel__menu-item:focus-visible[b-con7tqohzg] {
    outline: none;
    box-shadow: var(--shadow-focus);
}
/* /Components/WorkspaceArea.razor.rz.scp.css */
/* The "+ Add panel" cell (B2). Dashed and muted, so it reads as an empty slot rather than as a
   panel that failed to render. */

.add-panel-tile[b-hn2sb5sdma] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    width: 100%;
    height: 100%;
    border: 1px dashed var(--line-strong);
    border-radius: var(--r-md);
    background: none;
    color: var(--text-3);
    font-family: var(--font-ui);
    font-size: var(--fs-dense);
    cursor: pointer;
    transition: color var(--dur-fast) var(--ease-standard),
                border-color var(--dur-fast) var(--ease-standard);
}

.add-panel-tile:hover[b-hn2sb5sdma] {
    border-color: var(--accent);
    color: var(--text-1);
}

.add-panel-tile:focus-visible[b-hn2sb5sdma] {
    outline: none;
    box-shadow: var(--shadow-focus);
}

/* Inside the empty-workspace card the tile has no cell to fill, so it sizes to its content. */
.add-panel-tile--inline[b-hn2sb5sdma] {
    flex-direction: row;
    width: auto;
    height: var(--target-dialog);
    padding: 0 14px;
    margin-left: 12px;
}
/* /Components/WorkspaceTabStrip.razor.rz.scp.css */
/* Edit chrome for the workspace tab strip (B2). The tab itself is still styled by app.css — this
   file adds only what editing introduces, so the read-only strip is byte-for-byte what it was.
   Colour comes from tokens; see scripts/vesta-online/check-web-color-literals.sh. */

.ws-tab-group[b-qojuodu4ix] {
    display: flex;
    align-items: flex-end;
    flex: none;
    gap: 2px;
}

/* Tools sit beside the ACTIVE tab, baseline-aligned with it rather than inside it — a button
   inside a button is invalid markup and swallows the tab's own click. */
.ws-tab__tools[b-qojuodu4ix] {
    display: flex;
    align-items: center;
    gap: 1px;
    padding: 0 2px 4px;
}

/* The markup HIDES rather than removes conditional chrome (inactive tabs' tools, an empty Undo):
   removal by an async render disposes event handlers a captured click may still be carrying
   (bug-20260908-tab-switch-disposed-handler). These display rules would otherwise defeat the
   hidden attribute, so it is restated with weight. */
.ws-tab__tools[hidden][b-qojuodu4ix],
.ws-tabs__undo[hidden][b-qojuodu4ix] {
    display: none;
}

.ws-tab__tool[b-qojuodu4ix],
.ws-tabs__add[b-qojuodu4ix],
.ws-tabs__undo[b-qojuodu4ix] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    padding: 0;
    border: 1px solid transparent;
    border-radius: var(--r-sm);
    background: none;
    color: var(--text-3);
    font-family: var(--font-ui);
    font-size: 11px;
    cursor: pointer;
    transition: color var(--dur-fast) var(--ease-standard),
                border-color var(--dur-fast) var(--ease-standard);
}

.ws-tab__tool[b-qojuodu4ix] {
    width: 20px;
    height: 20px;
}

.ws-tab__tool:hover:not(:disabled)[b-qojuodu4ix],
.ws-tabs__add:hover:not(:disabled)[b-qojuodu4ix],
.ws-tabs__undo:hover:not(:disabled)[b-qojuodu4ix] {
    color: var(--text-1);
    border-color: var(--line-strong);
}

.ws-tab__delete:hover:not(:disabled)[b-qojuodu4ix] {
    color: var(--status-err);
    border-color: var(--status-err);
}

.ws-tab__tool:disabled[b-qojuodu4ix],
.ws-tabs__add:disabled[b-qojuodu4ix] {
    opacity: .35;
    cursor: default;
}

.ws-tab__tool:focus-visible[b-qojuodu4ix],
.ws-tabs__add:focus-visible[b-qojuodu4ix],
.ws-tabs__undo:focus-visible[b-qojuodu4ix] {
    outline: none;
    box-shadow: var(--shadow-focus);
}

.ws-tabs__add[b-qojuodu4ix] {
    align-self: flex-end;
    flex: none;
    width: 24px;
    height: 24px;
    margin: 0 0 4px 4px;
    border-color: var(--line);
}

.ws-tabs__undo[b-qojuodu4ix] {
    align-self: flex-end;
    flex: none;
    height: 24px;
    margin: 0 0 4px 8px;
    padding: 0 8px;
    border-color: var(--line);
}

/* Deliberately quiet: a save is fast, and a loud indicator on every gesture reads as an error. */
.ws-tabs__saving[b-qojuodu4ix] {
    align-self: flex-end;
    flex: none;
    margin: 0 0 8px 8px;
    color: var(--text-3);
    font-family: var(--font-ui);
    font-size: 11px;
}
/* /Layout/AppShellLayout.razor.rz.scp.css */
/* App shell frame — HANDOFF §3. Fixed chrome, one scrolling region. */

.shell[b-nbu9l4dii3] {
    height: 100vh;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background: var(--surface-app);
    color: var(--text-1);
    font-family: var(--font-ui);
    font-size: var(--fs-body);
}

.shell__main[b-nbu9l4dii3] {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
}

/* THE only overflow: auto in the shell. */
.shell__content[b-nbu9l4dii3] {
    flex: 1 1 auto;
    min-width: 0;
    overflow: auto;
    background: var(--surface-app);
}

/* ---- below the degraded floor -------------------------------------------------------------
   No mobile layout in this program (HANDOFF §3, artboard 1k). A CSS swap rather than a JS
   media query, so the correct thing is on screen at first paint. */

.shell__too-small[b-nbu9l4dii3] {
    display: none;
}

@media (max-width: 1023px) {
    .shell[b-nbu9l4dii3] {
        display: none;
    }

    .shell__too-small[b-nbu9l4dii3] {
        display: grid;
        place-items: center;
        min-height: 100vh;
        padding: 24px;
        background: var(--surface-app);
        color: var(--text-1);
        font-family: var(--font-ui);
    }
}

.shell__too-small-card[b-nbu9l4dii3] {
    max-width: 44ch;
    padding: 24px;
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    background: var(--surface-card);
    box-shadow: var(--shadow-md);
}

.shell__too-small-title[b-nbu9l4dii3] {
    margin: 0 0 8px;
    font-size: var(--fs-heading-lg);
    font-weight: 600;
}

.shell__too-small-body[b-nbu9l4dii3] {
    margin: 0;
    color: var(--text-2);
    font-size: var(--fs-comfortable);
    line-height: 1.45;
}
/* /Layout/LandingLayout.razor.rz.scp.css */
/* The signed-out page frame. Only the frame lives here; everything inside it is Landing.razor's,
   because scoped CSS reaches a component's OWN markup and this component's markup is one div.

   The landing palette is light while the shell theme underneath it may be dark, and both scope
   classes are on <html> at once (ThemeTokens.ScopeClasses). Anything reused from the signed-in
   shell — the loading spinner, ProjectThumbnail — therefore reads the shell's tokens on a white
   page. Remapping the handful of shell tokens onto their landing equivalents here fixes those
   components' surfaces, lines and text at once, and costs no literal: a custom-property definition
   whose value is var(--landing-*) is still a token reference.

   ONE EXCEPTION, accepted deliberately: ProjectThumbnail also reads --thumb-tint, which resolves to
   one of the shared theme's --cat-* category tokens, and the landing palette defines no --cat-*.
   Those six tints therefore come from whatever shell theme is active underneath — but no theme
   overrides them (VestaThemePalette defaults them once, "so the same muted hues read on every
   theme"), and ProjectThumbnail uses the tint at 22% over the card surface, a wash rather than a
   color anyone reads. So the sample cards look the same whichever shell theme a returning visitor
   last picked, and the exception costs nothing. Inventing landing-only category tokens
   would give a project a DIFFERENT identity color on the landing than in the app, which is the one
   thing that thumbnail exists to prevent. */

.landing-page[b-6dth1ge0wy] {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    font-family: var(--font-ui);
    background: var(--landing-surface);
    color: var(--landing-ink);

    --line: var(--landing-line);
    --surface-card: var(--landing-surface-2);
    --text-1: var(--landing-ink);
    --ink-muted: var(--landing-body);
    --skeleton: var(--landing-surface-2);
    --workspace-accent: var(--landing-icon-accent);
}
/* /Pages/Account.razor.rz.scp.css */
.acct[b-u389vcmasf] {
    padding: 22px;
    max-width: 70ch;
}

.acct__title[b-u389vcmasf] {
    margin: 0 0 16px;
    font-size: var(--fs-heading-lg);
    font-weight: 400;
    color: var(--text-1);
}

.acct__error[b-u389vcmasf] {
    margin: 0 0 14px;
    color: var(--status-err);
    font-size: var(--fs-comfortable);
}

.acct__grid[b-u389vcmasf] {
    display: grid;
    grid-template-columns: 180px 1fr;
    gap: 0;
    margin: 0;
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    background: var(--surface-card);
    overflow: hidden;
}

.acct__key[b-u389vcmasf],
.acct__value[b-u389vcmasf] {
    margin: 0;
    padding: 10px 14px;
    border-top: 1px solid var(--line);
    font-size: var(--fs-comfortable);
}

.acct__key:first-of-type[b-u389vcmasf],
.acct__key:first-of-type + .acct__value[b-u389vcmasf] {
    border-top: 0;
}

.acct__key[b-u389vcmasf] {
    color: var(--text-3);
    background: var(--surface-card-2);
}

.acct__value[b-u389vcmasf] {
    color: var(--text-1);
}

.acct__value--mono[b-u389vcmasf] {
    font-family: var(--font-mono);
    font-size: var(--fs-body);
}

.acct__note[b-u389vcmasf] {
    margin: 14px 0 0;
    color: var(--text-3);
    font-size: var(--fs-body);
    line-height: 1.45;
}
/* /Pages/AnalysisRunDetail.razor.rz.scp.css */
/* The run-detail view (E0 Q4 Option B): identity, status, stages, specification, log. */

.ard[b-71v8y8ay85] {
    padding: 22px;
    max-width: 960px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.ard__head[b-71v8y8ay85] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
}

.ard__kicker[b-71v8y8ay85] {
    font-size: var(--fs-dense);
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--text-3);
    margin-bottom: 6px;
}

.ard__title[b-71v8y8ay85] {
    margin: 0 0 6px;
    font-size: var(--fs-heading-lg);
    font-weight: 400;
    color: var(--text-1);
}

.ard__id[b-71v8y8ay85] {
    font-size: 0.75em;
    color: var(--text-3);
}

.ard__meta[b-71v8y8ay85] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    align-items: center;
    font-size: var(--fs-body);
    color: var(--text-3);
}

.ard__status[b-71v8y8ay85] {
    display: inline-flex;
    align-items: center;
    height: 20px;
    padding: 0 8px;
    border: 1px solid var(--line-strong);
    border-radius: var(--r-pill);
    font-size: var(--fs-dense);
    font-weight: 600;
    color: var(--text-1);
}

.ard__status--succeeded[b-71v8y8ay85] {
    border-color: var(--status-ok);
    color: var(--status-ok);
}

.ard__status--failed[b-71v8y8ay85] {
    border-color: var(--status-err);
    color: var(--status-err);
}

.ard__status--running[b-71v8y8ay85],
.ard__status--queued[b-71v8y8ay85],
.ard__status--claimed[b-71v8y8ay85] {
    border-color: var(--workspace-accent);
    color: var(--workspace-accent);
}

.ard__actions[b-71v8y8ay85] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}

.ard__btn[b-71v8y8ay85] {
    height: 30px;
    padding: 0 12px;
    border: 1px solid var(--line-strong);
    border-radius: var(--r-sm);
    background: var(--surface-card-2);
    color: var(--text-1);
    font: inherit;
    font-size: var(--fs-body);
    cursor: pointer;
    white-space: nowrap;
}

.ard__btn:hover[b-71v8y8ay85] {
    border-color: var(--text-4);
}

.ard__btn:focus-visible[b-71v8y8ay85] {
    outline: none;
    box-shadow: var(--shadow-focus);
}

.ard__btn--primary[b-71v8y8ay85] {
    background: var(--workspace-accent);
    border-color: var(--workspace-accent);
    color: var(--surface-panel);
}

.ard__grid[b-71v8y8ay85] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 12px;
}

.ard__card[b-71v8y8ay85] {
    padding: 12px 14px;
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    background: var(--surface-card);
    min-width: 0;
}

.ard__card--wide[b-71v8y8ay85] {
    grid-column: 1 / -1;
}

.ard__muted[b-71v8y8ay85] {
    margin: 0;
    color: var(--text-3);
    font-size: var(--fs-body);
}

.ard__stages[b-71v8y8ay85] {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.ard__stage[b-71v8y8ay85] {
    display: grid;
    grid-template-columns: 10px 1fr auto;
    gap: 8px;
    align-items: center;
    font-size: var(--fs-body);
    color: var(--text-1);
}

.ard__stage-mark[b-71v8y8ay85] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--text-4);
}

.ard__stage--done .ard__stage-mark[b-71v8y8ay85] {
    background: var(--status-ok);
}

.ard__stage--failed .ard__stage-mark[b-71v8y8ay85] {
    background: var(--status-err);
}

.ard__stage--running .ard__stage-mark[b-71v8y8ay85] {
    background: var(--workspace-accent);
}

.ard__stage--failed .ard__stage-name[b-71v8y8ay85] {
    color: var(--status-err);
}

.ard__stage-time[b-71v8y8ay85] {
    font-size: var(--fs-dense);
    color: var(--text-3);
}

.ard__log[b-71v8y8ay85] {
    margin: 0;
    max-height: 40vh;
    overflow: auto;
    padding: 10px 12px;
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    background: var(--surface-panel);
    color: var(--text-1);
    font-size: var(--fs-dense);
    font-family: var(--font-mono);
    line-height: 1.5;
    white-space: pre-wrap;
}
/* /Pages/AnalyzeFlow.razor.rz.scp.css */
/* Analyze panel-modal page — only what the page itself renders; each step body carries its own CSS. */

.anz__placeholder[b-gb74ow5xvd] {
    display: none;
}
/* /Pages/Dev/DevAdvisor.razor.rz.scp.css */
/* Harness frame: give the advisor panel a full-height column, since there is no side pane here.
   Deliberately plain — the panel is the thing under review. */

.dev-advisor[b-n2l006bslq] {
    height: 100vh;
    display: flex;
    align-items: stretch;
    background: var(--surface-app);
    color: var(--text-1);
    font-family: var(--font-ui);
    font-size: var(--fs-body);
}

.dev-advisor__note[b-n2l006bslq] {
    flex: 1 1 auto;
    min-width: 0;
    padding: 16px 20px;
}

.dev-advisor__note p[b-n2l006bslq] {
    max-width: 60ch;
    margin: 0;
    line-height: 1.5;
    color: var(--text-2);
}

.dev-advisor__note code[b-n2l006bslq] {
    font-family: var(--font-mono);
    font-size: var(--fs-dense);
}
/* /Pages/ImportFlow.razor.rz.scp.css */
/* Import panel-modal page — only what the page itself renders; each step body carries its own CSS. */

.imp__preview-error[b-3e1qzvbc1v] {
    margin-top: 14px;
}
/* /Pages/Landing.razor.rz.scp.css */
/* The signed-out landing, artboard 1a.

   TOKENS ONLY. Colors are --landing-* (generated from Vesta.Core/Theming/LandingPalette.cs);
   radii, type and fonts are the shell's --r-*, --fs-* and --font-* from wwwroot/css/shell.css.

   Contrast rule, enforced by a server test: --landing-ink-2 (3.54:1) and --landing-ink-3 (2.85:1)
   are DECORATIVE and disabled-state only. Everything a visitor actually reads — the lede, the
   capability copy, the card fact lines, the gallery's state lines, the footer — is --landing-body.
   Headings are --landing-ink; links are --landing-link.

   Almost every rule needs ::deep: the markup lives in LandingHeader / LandingHero /
   CapabilityBlocks / SampleGallery / SampleCard / LandingFooter, and scoped CSS does not reach a
   child component's markup. The .landing-root wrapper in this page's own markup is what those
   ::deep selectors hang off, which is why the header and footer are inside it. */

.landing-root[b-qnjhotsrn9] {
    display: flex;
    flex-direction: column;
    flex: 1;
}

.landing[b-qnjhotsrn9] {
    flex: 1;
    width: min(1880px, 100% - 96px);
    margin: 0 auto;
    padding: 48px 0 64px;
}

/* ---------------------------------------------------------------- header */

[b-qnjhotsrn9] .lh {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 28px;
    min-height: 80px;
    padding: 0 48px;
    border-bottom: 1px solid var(--landing-line);
    background: var(--landing-surface);
}

[b-qnjhotsrn9] .lh__brand {
    display: flex;
    align-items: center;
    gap: 10px;
    text-decoration: none;
}

/* LandingPalette.Brand is "the logo mark, and only the logo mark" — so it is painted here, on the
   mark, rather than on the lockup whose every child overrides it. */
[b-qnjhotsrn9] .lh__mark {
    display: flex;
    color: var(--landing-brand);
}

[b-qnjhotsrn9] .lh__wordmark {
    font-size: 28px;
    font-weight: 300;
    color: var(--landing-ink);
}

/* Decorative qualifier beside the wordmark, not copy — the one place ink-2 belongs. */
[b-qnjhotsrn9] .lh__wordmark-online {
    color: var(--landing-ink-2);
    margin-left: 8px;
    font-size: 20px;
}

[b-qnjhotsrn9] .lh__nav {
    margin-left: auto;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 24px;
}

/* Underlined at rest, not only on hover. Color alone is not a reliable "this is a link" signal —
   the footer's links sit in a row of plain spans, and this rule and .lf__link below are the same
   decision applied in both places. */
[b-qnjhotsrn9] .lh__link {
    color: var(--landing-link);
    text-decoration: underline;
    font-size: 16px;
}

[b-qnjhotsrn9] .lh__signin,
[b-qnjhotsrn9] .hero__primary {
    display: inline-flex;
    align-items: center;
    height: 44px;
    padding: 0 24px;
    border-radius: var(--r-md);
    background: var(--landing-accent);
    color: var(--landing-accent-ink);
    font-weight: 600;
    text-decoration: none;
    border: 1px solid var(--landing-line);
}

[b-qnjhotsrn9] .lh__signin:hover,
[b-qnjhotsrn9] .hero__primary:hover {
    background: var(--landing-accent-hover);
}

[b-qnjhotsrn9] .lh__signin:active,
[b-qnjhotsrn9] .hero__primary:active {
    background: var(--landing-accent-active);
}

/* ------------------------------------------------------------------ hero */

[b-qnjhotsrn9] .hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 64px;
    align-items: center;
    padding: 48px 0 56px;
}

[b-qnjhotsrn9] .hero__title {
    font-size: 56px;
    line-height: 1.1;
    font-weight: 300;
    margin: 0 0 24px;
    color: var(--landing-ink);
}

[b-qnjhotsrn9] .hero__title strong {
    font-weight: 700;
}

[b-qnjhotsrn9] .hero__lede {
    font-size: 20px;
    line-height: 1.5;
    color: var(--landing-body);
    margin: 0 0 32px;
    max-width: 46ch;
}

[b-qnjhotsrn9] .hero__actions {
    display: flex;
    gap: 16px;
    margin-bottom: 24px;
}

[b-qnjhotsrn9] .hero__secondary {
    display: inline-flex;
    align-items: center;
    height: 44px;
    padding: 0 24px;
    border-radius: var(--r-md);
    background: var(--landing-surface);
    color: var(--landing-ink);
    border: 1px solid var(--landing-line);
    text-decoration: none;
}

[b-qnjhotsrn9] .hero__secondary:hover {
    background: var(--landing-surface-hover);
}

[b-qnjhotsrn9] .hero__note {
    font-size: var(--fs-comfortable);
    line-height: 1.5;
    color: var(--landing-body);
    max-width: 60ch;
    margin: 0;
}

[b-qnjhotsrn9] .hero__preview {
    display: block;
    border: 1px solid var(--landing-line);
    border-radius: var(--r-lg);
    overflow: hidden;
    text-decoration: none;
    color: inherit;
}

[b-qnjhotsrn9] .hero__preview-bar {
    display: flex;
    align-items: center;
    height: 44px;
    padding: 0 16px;
    background: var(--landing-ink);
    color: var(--landing-surface);
    font-weight: 600;
}

/* The thumbnail is a shared component with its own scoped rules. Two classes plus this page's
   scope attribute is (0,3,0), which outranks the component's own .thumb--panel[b-x] (0,2,0) on
   every property below — without naming .thumb, which is its private class rather than the `Class`
   hook it publishes. */
[b-qnjhotsrn9] .hero__preview .hero__preview-image {
    display: block;
    width: 100%;
    border: 0;
    border-radius: 0;
}

/* ---------------------------------------------------------- capabilities */

[b-qnjhotsrn9] .caps {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 32px;
    margin-bottom: 64px;
}

[b-qnjhotsrn9] .cap {
    padding: 28px;
    background: var(--landing-surface-2);
    border-radius: var(--r-lg);
}

[b-qnjhotsrn9] .cap__title {
    margin: 0 0 12px;
    font-size: var(--fs-heading-lg);
    font-weight: 600;
    color: var(--landing-ink);
}

[b-qnjhotsrn9] .cap__body {
    margin: 0 0 16px;
    color: var(--landing-body);
    line-height: 1.5;
}

[b-qnjhotsrn9] .cap__methods {
    margin: 0;
    font-family: var(--font-mono);
    font-size: var(--fs-comfortable);
    color: var(--landing-body);
}

/* --------------------------------------------------------------- gallery */

[b-qnjhotsrn9] .gallery__head {
    display: flex;
    align-items: baseline;
    gap: 16px;
    margin-bottom: 24px;
}

[b-qnjhotsrn9] .gallery__title {
    margin: 0;
    font-size: 28px;
    font-weight: 600;
    color: var(--landing-ink);
}

[b-qnjhotsrn9] .gallery__sub {
    margin: 0;
    color: var(--landing-body);
}

[b-qnjhotsrn9] .gallery__state {
    color: var(--landing-body);
    padding: 24px 0;
}

/* Announced, never seen: the arrival of the sample list has to reach a screen reader without
   putting a count on the page the artboard does not have. */
[b-qnjhotsrn9] .gallery__announce {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
}

[b-qnjhotsrn9] .gallery__grid {
    display: grid;
    /* min() so the track can shrink below its ideal width: a fixed 360px minimum cannot, and a
       375px phone would scroll sideways. */
    grid-template-columns: repeat(auto-fill, minmax(min(360px, 100%), 1fr));
    gap: 24px;
}

[b-qnjhotsrn9] .sc {
    display: flex;
    flex-direction: column;
    border: 1px solid var(--landing-line);
    border-radius: var(--r-lg);
    overflow: hidden;
    background: var(--landing-surface);
    color: inherit;
    text-decoration: none;
    transition: box-shadow var(--dur) var(--ease-standard);
}

[b-qnjhotsrn9] .sc:hover {
    box-shadow: var(--shadow-md);
}

/* Same specificity trick as the hero preview: a flatter crop than the shared component's 16/9,
   matching the artboard's card band. */
[b-qnjhotsrn9] .sc .sc__thumb {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 6;
    border: 0;
    border-radius: 0;
}

[b-qnjhotsrn9] .sc__body {
    padding: 20px;
}

[b-qnjhotsrn9] .sc__name {
    margin: 0 0 6px;
    font-size: 18px;
    font-weight: 600;
    color: var(--landing-ink);
}

[b-qnjhotsrn9] .sc__facts {
    margin: 0 0 14px;
    font-size: var(--fs-comfortable);
    color: var(--landing-body);
}

[b-qnjhotsrn9] .sc__chip {
    display: inline-block;
    padding: 4px 12px;
    border-radius: var(--r-pill);
    border: 1px solid var(--landing-link);
    color: var(--landing-link);
    font-size: var(--fs-dense);
    font-weight: 600;
    letter-spacing: .04em;
    text-transform: uppercase;
}

/* ---------------------------------------------------------------- footer */

[b-qnjhotsrn9] .lf {
    display: flex;
    align-items: center;
    gap: 24px;
    padding: 20px 48px;
    border-top: 1px solid var(--landing-line);
    color: var(--landing-body);
    font-size: var(--fs-comfortable);
}

/* See .lh__link: underlined at rest, and the link token rather than the footer's body color. */
[b-qnjhotsrn9] .lf__link {
    color: var(--landing-link);
    text-decoration: underline;
}

[b-qnjhotsrn9] .lf__spacer {
    flex: 1;
}

[b-qnjhotsrn9] .lf__host {
    font-family: var(--font-mono);
}

/* ------------------------------------------------------------- keyboard */

[b-qnjhotsrn9] .lh__link:focus-visible,
[b-qnjhotsrn9] .lh__signin:focus-visible,
[b-qnjhotsrn9] .lh__brand:focus-visible,
[b-qnjhotsrn9] .hero__primary:focus-visible,
[b-qnjhotsrn9] .hero__secondary:focus-visible,
[b-qnjhotsrn9] .hero__preview:focus-visible,
[b-qnjhotsrn9] .sc:focus-visible,
[b-qnjhotsrn9] .lf__link:focus-visible {
    outline: 2px solid var(--landing-icon-accent);
    outline-offset: 2px;
}

/* --------------------------------------------------------------- narrow */

@media (max-width: 1100px) {
    .landing[b-qnjhotsrn9] {
        width: min(1880px, 100% - 48px);
    }

    [b-qnjhotsrn9] .hero {
        grid-template-columns: 1fr;
        gap: 32px;
    }

    [b-qnjhotsrn9] .caps {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    [b-qnjhotsrn9] .lh {
        padding: 0 24px;
    }

    [b-qnjhotsrn9] .hero__title {
        font-size: 40px;
    }

    [b-qnjhotsrn9] .lf {
        flex-wrap: wrap;
        padding: 20px 24px;
    }
}
/* /Pages/ProjectOverview.razor.rz.scp.css */
/* The workspace-less overview keeps the right pane, on the same two-column grid the workspace
   page uses (.wsp__canvas): the pane's column owns its width and the row is bounded so the pane's
   own body scrolls rather than the shell. */
.ov__canvas[b-crw5d7a5k9] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) var(--pane-w);
    grid-template-rows: minmax(0, 1fr);
    height: 100%;
    min-height: 0;
    overflow: hidden;
}

@media (max-width: 1280px) {
    .ov__canvas[b-crw5d7a5k9] { grid-template-columns: minmax(0, 1fr) var(--pane-w-narrow); }
}

.ov[b-crw5d7a5k9] {
    padding: 22px;
    max-width: 60ch;
}

.ov__title[b-crw5d7a5k9] {
    margin: 0 0 6px;
    font-size: var(--fs-heading-lg);
    font-weight: 400;
    color: var(--text-1);
}

.ov__body[b-crw5d7a5k9] {
    margin: 0;
    color: var(--text-3);
    font-size: var(--fs-comfortable);
    line-height: 1.45;
}

.ov__link[b-crw5d7a5k9] {
    color: var(--accent);
    font-size: var(--fs-body);
    text-decoration: none;
}

.ov__link:hover[b-crw5d7a5k9],
.ov__link:focus-visible[b-crw5d7a5k9] {
    text-decoration: underline;
}

.ov__link:focus-visible[b-crw5d7a5k9] {
    outline: none;
    box-shadow: var(--shadow-focus);
    border-radius: var(--r-sm);
}
/* /Pages/Projects.razor.rz.scp.css */
/* /projects page shell — the page header from artboard 1b. The three panes are another agent's
   components; this only reserves the region they fill. */

/* The footer (HubFooter) runs edge to edge like a wizard's, so the side padding lives on the
   header and the panes rather than on the page. */
.projects[b-kh9jj60nbv] {
    height: 100%;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
}

.projects__header[b-kh9jj60nbv] {
    flex: 0 0 auto;
    display: flex;
    align-items: flex-start;
    gap: 16px;
    padding: 18px 22px 16px;
}

.projects__heading[b-kh9jj60nbv] {
    margin-right: auto;
}

.projects__title[b-kh9jj60nbv] {
    margin: 0;
    font-size: var(--fs-heading-lg);
    font-weight: 400;
    color: var(--text-1);
}

.projects__subtitle[b-kh9jj60nbv] {
    margin: 4px 0 0;
    font-size: var(--fs-comfortable);
    color: var(--text-3);
}

.projects__panes[b-kh9jj60nbv] {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    gap: var(--gap-panel);
    padding: 0 22px 16px;
}

/* ---- header actions (artboard 1b) ---------------------------------------------------------- */

/* The header's Upload Data / New Project are the global .hub-button / .hub-button--primary
   (app.css) — the desktop hub's own ghost and primary styles, shared with every wizard footer. */

.projects__no-server[b-kh9jj60nbv] {
    flex: 1 1 auto;
    margin: 0;
    padding: 20px 22px;
    font-size: var(--fs-comfortable);
    color: var(--text-3);
}
/* /Pages/SignIn.razor.rz.scp.css */
/* Mirrors Vesta.Server/Pages/Login.cshtml pixel-for-pixel — same page structure (header /
   centered card / footer), same measurements, palette via the --si-* tokens the generated
   stylesheet single-sources from that page's values (ThemeCss.LandingCssCustomProperties).
   Issue #1034 tracks replacing both copies with one shared SignInCard component. */

.si-page[b-lwr7eifdpo] {
    width: 100%;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    background: var(--si-page);
    color: var(--si-ink);
}

.si-header[b-lwr7eifdpo] {
    background: var(--si-surface);
    border-bottom: 1px solid var(--si-primary-disabled);
    padding: 16px 24px;
}

.si-header__logo[b-lwr7eifdpo] {
    display: inline-flex;
    align-items: center;
}

.si-header__logo img[b-lwr7eifdpo] {
    height: 32px;
    width: auto;
}

.si-wrap[b-lwr7eifdpo] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 40px 24px;
    gap: 20px;
}

.si-card[b-lwr7eifdpo] {
    background: var(--si-surface);
    border-radius: 20px;
    box-shadow: var(--si-card-shadow);
    padding: 40px 36px;
    width: 100%;
    max-width: 480px;
    text-align: center;
}

.si-card h1[b-lwr7eifdpo] {
    font-size: 34px;
    font-weight: 700;
    color: var(--si-ink);
    margin: 0 0 24px;
}

.si-btn[b-lwr7eifdpo] {
    width: 100%;
    min-height: 56px;
    border-radius: 28px;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    border: 1px solid transparent;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 0 20px;
    transition: background 0.15s, border-color 0.15s;
}

.si-btn:disabled[b-lwr7eifdpo] {
    cursor: not-allowed;
    opacity: 0.6;
}

.si-btn--outlined[b-lwr7eifdpo] {
    background: var(--si-surface);
    border-color: var(--si-line);
    color: var(--si-ink);
}

.si-btn--outlined:hover:enabled[b-lwr7eifdpo] {
    background: var(--si-hover);
}

.si-btn--primary[b-lwr7eifdpo] {
    background: var(--si-primary);
    color: var(--si-ink);
    border: none;
}

.si-btn--primary:hover:enabled[b-lwr7eifdpo] { background: var(--si-primary-hover); }
.si-btn--primary:active:enabled[b-lwr7eifdpo] { background: var(--si-primary-active); }
.si-btn--primary:disabled[b-lwr7eifdpo] { background: var(--si-primary-disabled); }

/* Just the word, no rule lines on either side (Luna, September 16, 2026 — same change made
   in Login.cshtml's .divider). */
.si-divider[b-lwr7eifdpo] {
    display: flex;
    justify-content: center;
    color: var(--si-ink-faint);
    font-size: 14px;
    margin: 16px 0;
}

.si__form[b-lwr7eifdpo] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.si-visually-hidden[b-lwr7eifdpo] {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
}

.si-input[b-lwr7eifdpo] {
    width: 100%;
    box-sizing: border-box;
    min-height: 56px;
    padding: 0 24px;
    border-radius: 28px;
    border: 1px solid var(--si-line);
    font-size: 16px;
    color: var(--si-ink);
    background: var(--si-surface);
    outline: none;
    transition: border-color 0.15s;
}

.si-input[b-lwr7eifdpo]::placeholder {
    color: var(--si-placeholder);
}

.si-input:focus[b-lwr7eifdpo] {
    border-color: var(--si-focus);
}

.si-footer-text[b-lwr7eifdpo] {
    margin: 20px 0 0;
    font-size: 12px;
    color: var(--si-ink-faint);
    line-height: 1.5;
}

.si-footer-text a[b-lwr7eifdpo] {
    color: var(--si-focus);
    text-decoration: none;
}

.si-footer-text a:hover[b-lwr7eifdpo] {
    text-decoration: underline;
}

.si-download[b-lwr7eifdpo] {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 12px 24px;
    background: var(--si-surface);
    border: 1px solid var(--si-line);
    border-radius: 8px;
    color: var(--si-ink);
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
    transition: background 0.15s, border-color 0.15s;
}

.si-download:hover[b-lwr7eifdpo] {
    background: var(--si-hover);
    border-color: var(--si-line-strong);
}

.si-page-footer[b-lwr7eifdpo] {
    text-align: center;
    padding: 24px;
    color: var(--si-ink-muted);
    font-size: 13px;
}

.si-page-footer a[b-lwr7eifdpo] {
    color: var(--si-ink-faint);
    text-decoration: none;
    margin: 0 4px;
}
/* /Pages/WorkspacePage.razor.rz.scp.css */
.wsp[b-4k63xcoelm] {
    padding: 22px;
    max-width: 60ch;
}

.wsp__title[b-4k63xcoelm] {
    margin: 0 0 6px;
    font-size: var(--fs-heading-lg);
    font-weight: 400;
    color: var(--text-1);
}

.wsp__body[b-4k63xcoelm] {
    margin: 0;
    color: var(--text-3);
    font-size: var(--fs-comfortable);
}

/* The canvas: main column (tab strip + tile grid) beside the dataset pane, filling the shell's
   content region. Only the tile grid scrolls — the shell frame does not (HANDOFF §3).

   THE ROW IS EXPLICIT, and that is the whole fix for the "a long Data View breaks the workspace"
   report. `height: 100%` sizes the grid CONTAINER; it does not size the container's TRACKS. With no
   `grid-template-rows`, the single implicit row is `auto`, so it sized to the taller of its two
   items — and a real project's dataset tree (three datasets, per-element result folders, dozens of
   rows) is far taller than the viewport. The row grew, `.wsp__main` stretched to the row, the tile
   grid was drawn partly below the fold, and `overflow: hidden` here cut it off; the Grid/Focus/
   Compare presets then divided a height nobody could see. `minmax(0, 1fr)` pins the row to the
   container's own height, which is what finally gives `.side-pane` a bounded height and lets its
   body's `overflow-y: auto` do the scrolling instead of the layout. */
.wsp__canvas[b-4k63xcoelm] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) var(--pane-w);
    grid-template-rows: minmax(0, 1fr);
    height: 100%;
    min-height: 0;
    overflow: hidden;
}

.wsp__main[b-4k63xcoelm] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 0;
    overflow: hidden;
}

.wsp__link[b-4k63xcoelm] {
    color: var(--accent);
    font-size: var(--fs-body);
    text-decoration: none;
}

.wsp__link:hover[b-4k63xcoelm],
.wsp__link:focus-visible[b-4k63xcoelm] {
    text-decoration: underline;
}

.wsp__link:focus-visible[b-4k63xcoelm] {
    outline: none;
    box-shadow: var(--shadow-focus);
    border-radius: var(--r-sm);
}

/* The side pane collapses below the graceful floor; the tile grid needs the width more. */
@media (max-width: 1280px) {
    .wsp__canvas[b-4k63xcoelm] { grid-template-columns: minmax(0, 1fr) var(--pane-w-narrow); }
}

/* Inline save notices (B2): the stale-revision warning and the last failed save. They sit ABOVE
   the tab strip because both are about the project as a whole, not about the active workspace. */
/* Notices are hidden-not-removed when idle (see the markup comment); display:flex would defeat
   the hidden attribute without this. */
.wsp__notice[hidden][b-4k63xcoelm] {
    display: none;
}

.wsp__notice[b-4k63xcoelm] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex: none;
    margin: 8px 12px 0;
    padding: 6px 10px;
    border: 1px solid var(--line-strong);
    border-radius: var(--r-sm);
    font-size: var(--fs-dense);
    color: var(--text-1);
}

.wsp__notice--stale[b-4k63xcoelm] {
    border-color: var(--status-warn);
    background: var(--caveat-warn-fill);
}

.wsp__notice--error[b-4k63xcoelm] {
    border-color: var(--status-err);
    background: var(--caveat-err-fill);
}

.wsp__notice-text[b-4k63xcoelm] {
    flex: 1;
    min-width: 0;
}

.wsp__notice-action[b-4k63xcoelm] {
    flex: none;
    height: var(--target-chrome);
    padding: 0 12px;
    border: 1px solid var(--line-strong);
    border-radius: var(--r-sm);
    background: var(--surface-card);
    color: var(--text-1);
    font-family: var(--font-ui);
    font-size: var(--fs-dense);
    cursor: pointer;
}

.wsp__notice-action:hover[b-4k63xcoelm] {
    background: var(--surface-card-2);
}

.wsp__notice-action:focus-visible[b-4k63xcoelm] {
    outline: none;
    box-shadow: var(--shadow-focus);
}