/*
 * Acumy design system.
 *
 * Colour tokens carry the five meanings from docs/03-design-system.md and nothing else. The Status
 * table decides WHICH status is which colour (via Status.CssClass); this file only says what each
 * colour token looks like. That split is the point: adding a status is a data change, not a code change.
 */

:root {
    --acumy-ground: #F6F8FB;
    --acumy-surface: #FFFFFF;
    --acumy-hairline: #E2E8F0;
    --acumy-ink: #0F172A;
    --acumy-ink-muted: #475569;
    --acumy-ink-faint: #94A3B8;
    --acumy-hairline-strong: #CBD5E1;   /* folder tabs, the page-tab line */
    --acumy-band: #F8FAFC;              /* sub-tab band, the cloud tabs' panel */

    --acumy-sidebar: #0F172A;
    --acumy-sidebar-ink: #CBD5E1;
    --acumy-sidebar-ink-active: #FFFFFF;
    --acumy-sidebar-active: rgba(37, 99, 235, .18);

    /* Semantic colour tokens. Each one means exactly one thing. */
    --acumy-red: #DC2626;           /* action required, failed, policy violation, destructive */
    --acumy-red-tint: #FEF2F2;
    --acumy-amber: #D97706;         /* scheduled, pending, awaiting approval, warning */
    --acumy-amber-tint: #FFFBEB;
    --acumy-green: #0D9488;         /* healthy, active, completed, saving */
    --acumy-green-tint: #F0FDFA;
    --acumy-teal: #0D9488;
    --acumy-teal-tint: #F0FDFA;
    --acumy-blue: #2563EB;          /* informational, primary action, links */
    --acumy-blue-tint: #EFF6FF;
    --acumy-grey: #64748B;          /* inert, no expiry, suspended, disabled */
    --acumy-grey-tint: #F1F5F9;
    --acumy-neutral: #64748B;
    --acumy-neutral-tint: #F1F5F9;

    /* Chart series, for identity only — never for judgement. Assigned in this order and never
       cycled; past seven, the rest fold into "Other" in --acumy-grey. The order is the colour-blind
       safety: adjacent slots stay distinguishable. Magenta, yellow and aqua sit under 3:1 on white,
       so every chart using them carries visible labels or a table. */
    --acumy-series-1: #2A78D6;
    --acumy-series-2: #EB6834;
    --acumy-series-3: #1BAF7A;
    --acumy-series-4: #EDA100;
    --acumy-series-5: #E87BA4;
    --acumy-series-6: #008300;
    --acumy-series-7: #4A3AA7;
}

/* ── Shell ───────────────────────────────────────────────────────────────────────────────────── */

.acumy-ground {
    background: var(--acumy-ground);
    min-height: 100vh;
}

.acumy-sidebar {
    background: var(--acumy-sidebar) !important;
    border-right: none !important;
}

.acumy-sidebar .mud-nav-link,
.acumy-sidebar .mud-nav-link .mud-nav-link-text {
    color: var(--acumy-sidebar-ink) !important;
}

.acumy-sidebar .mud-nav-link:hover {
    background: rgba(255, 255, 255, .06) !important;
}

.acumy-sidebar .mud-nav-link.active,
.acumy-sidebar .mud-nav-link.active .mud-nav-link-text {
    color: var(--acumy-sidebar-ink-active) !important;
    background: var(--acumy-sidebar-active) !important;
    font-weight: 500;
}

/* The Decide step's suggestions heading, with the link to every suggestion beside it. */
.acumy-decide__heading-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 1rem;
}

/* Decisions waiting, on a sidebar item. Amber like the tab badge: it waits for the person. */
.acumy-nav-badge {
    display: inline-block;
    min-width: 1.25rem;
    margin-left: .5rem;
    padding: 0 .35rem;
    border-radius: 999px;
    background: var(--acumy-amber);
    color: #FFFFFF;
    font-size: .7rem;
    font-weight: 600;
    line-height: 1.25rem;
    text-align: center;
}

.acumy-sidebar-brand {
    display: flex;
    align-items: center;
    gap: .625rem;
    padding: 1.125rem 1rem 1.375rem;
    color: #FFFFFF;
    font-size: 1.0625rem;
    font-weight: 600;
    letter-spacing: -.01em;
}

.acumy-sidebar-footer {
    margin-top: auto;
    padding: .5rem 0 1rem;
    border-top: 1px solid rgba(255, 255, 255, .08);
}

.acumy-sidebar-inner {
    display: flex;
    flex-direction: column;
    height: 100%;
}

/* Page header: H1 + subtitle on the left, scope selector and primary action on the right. */
.acumy-page-header {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.5rem 1.75rem 0;
    background: transparent;
}

.acumy-page-header h1 {
    margin: 0;
    color: var(--acumy-ink);
}

.acumy-page-heading-row {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .75rem;
}

.acumy-page-subtitle {
    margin: .3125rem 0 0;
    color: var(--acumy-ink-muted);
    font-size: .875rem;
}

.acumy-page-header-actions {
    display: flex;
    align-items: center;
    gap: .625rem;
    flex-wrap: wrap;
}

/* The area, small above a sidebar page's heading (NavEstate mockup). A drill-down page has its breadcrumb instead. */
.acumy-eyebrow {
    margin-bottom: .25rem;
    color: var(--acumy-ink-muted);
    font-size: .8125rem;
    font-weight: 500;
}

.acumy-content {
    padding: 1.5rem 1.75rem 2.5rem;
}

/* ── Panels and cards ────────────────────────────────────────────────────────────────────────── */

.acumy-panel {
    background: var(--acumy-surface);
    border: 1px solid var(--acumy-hairline);
    border-radius: 12px;
    overflow: hidden;
}

.acumy-panel-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: .9375rem 1.25rem;
    border-bottom: 1px solid var(--acumy-hairline);
}

/* A closed box is its header alone. */
.acumy-panel-head:last-child { border-bottom: 0; }

.acumy-panel-head__title {
    display: flex;
    align-items: flex-start;
    gap: .5rem;
}

/* The chevron on a box that collapses. A real button, so Tab reaches it and Enter or Space works it. */
.acumy-panel-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.5rem;
    height: 1.5rem;
    margin-top: -.0625rem;
    padding: 0;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: var(--acumy-ink-muted);
    cursor: pointer;
}

    .acumy-panel-toggle:hover { background: var(--acumy-hairline); color: var(--acumy-ink); }
    .acumy-panel-toggle:focus-visible { outline: 2px solid var(--acumy-blue); outline-offset: 1px; }

.acumy-panel-title {
    margin: 0;
    font-size: .9375rem;
    font-weight: 600;
    color: var(--acumy-ink);
}

.acumy-panel-caption {
    margin: .1875rem 0 0;
    font-size: .75rem;
    color: var(--acumy-ink-muted);
}

.acumy-panel-body {
    padding: 1.25rem;
}

.acumy-panel-body--flush {
    padding: 0;
}

/* ── Sign in ─────────────────────────────────────────────────────────────────────────────────────
   Static SSR: no MudBlazor inputs here, because they cannot bind through a form POST. These classes
   give the Identity pages the same surface, hairline and semantic colours as the shell.
   ------------------------------------------------------------------------------------------------ */

.acumy-auth {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--acumy-ground);
    padding: 2rem 1rem;
}

.acumy-auth__card {
    width: 100%;
    max-width: 25rem;
    background: var(--acumy-surface);
    border: 1px solid var(--acumy-hairline);
    border-radius: 12px;
    padding: 2rem;
}

.acumy-auth__brand {
    display: flex;
    align-items: center;
    gap: .5rem;
    font-weight: 700;
    font-size: 1.25rem;
    color: var(--acumy-ink);
    margin-bottom: 1.5rem;
}

.acumy-auth__title {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--acumy-ink);
    margin: 0 0 .25rem;
}

.acumy-auth__subtitle {
    color: var(--acumy-ink-muted);
    font-size: .875rem;
    margin: 0 0 1.5rem;
}

.acumy-auth__summary:not(:empty) {
    color: var(--acumy-red);
    background: var(--acumy-red-tint);
    border: 1px solid var(--acumy-red);
    border-radius: 8px;
    padding: .625rem .75rem;
    margin-bottom: 1rem;
    font-size: .875rem;
}

.acumy-auth__summary ul {
    margin: 0;
    padding-left: 1.1rem;
}

.acumy-field {
    display: block;
    margin-bottom: 1rem;
}

.acumy-field--inline {
    display: flex;
    align-items: center;
    gap: .5rem;
    font-size: .875rem;
    color: var(--acumy-ink-muted);
}

.acumy-field__label {
    display: block;
    font-size: .8125rem;
    font-weight: 600;
    color: var(--acumy-ink);
    margin-bottom: .375rem;
}

.acumy-field__input {
    width: 100%;
    box-sizing: border-box;
    padding: .625rem .75rem;
    font: inherit;
    color: var(--acumy-ink);
    background: var(--acumy-surface);
    border: 1px solid var(--acumy-hairline);
    border-radius: 8px;
}

.acumy-field__input:focus {
    outline: none;
    border-color: var(--acumy-blue);
    box-shadow: 0 0 0 3px var(--acumy-blue-tint);
}

.acumy-field__error:not(:empty) {
    display: block;
    color: var(--acumy-red);
    font-size: .8125rem;
    margin-top: .375rem;
}

.acumy-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .375rem;
    padding: .625rem 1rem;
    font: inherit;
    font-weight: 600;
    border-radius: 8px;
    border: 1px solid transparent;
    cursor: pointer;
    text-decoration: none;
}

.acumy-button--block {
    width: 100%;
}

.acumy-button--primary {
    background: var(--acumy-blue);
    color: #FFFFFF;
}

.acumy-button--primary:hover {
    filter: brightness(1.08);
}

.acumy-button--quiet {
    background: transparent;
    color: var(--acumy-blue);
    border-color: var(--acumy-hairline);
}

.acumy-auth__divider {
    display: flex;
    align-items: center;
    gap: .75rem;
    margin: 1rem 0;
    color: var(--acumy-ink-faint);
    font-size: .8125rem;
}

.acumy-auth__divider::before,
.acumy-auth__divider::after {
    content: "";
    flex: 1;
    height: 1px;
    background: var(--acumy-hairline);
}

.acumy-auth__links {
    display: flex;
    flex-direction: column;
    gap: .375rem;
    margin-top: 1.25rem;
    font-size: .875rem;
}

.acumy-auth__links a {
    color: var(--acumy-blue);
    text-decoration: none;
}

.acumy-auth__links a:hover {
    text-decoration: underline;
}

.acumy-auth__card--wide {
    max-width: 56rem;
}

a.acumy-auth__brand {
    text-decoration: none;
}

.acumy-auth__title--danger {
    color: var(--acumy-red);
}

.acumy-auth__text {
    color: var(--acumy-ink);
    font-size: .875rem;
    margin: 0 0 1rem;
}

.acumy-auth__notice {
    border-radius: 8px;
    padding: .625rem .75rem;
    margin-bottom: 1rem;
    font-size: .875rem;
    border: 1px solid;
}

.acumy-auth__notice--danger {
    color: var(--acumy-red);
    background: var(--acumy-red-tint);
}

.acumy-auth__notice--success {
    color: var(--acumy-green);
    background: var(--acumy-green-tint);
}

.acumy-auth__external {
    display: flex;
    flex-direction: column;
    gap: .5rem;
    margin-top: 1rem;
}

.acumy-auth__manage {
    display: grid;
    grid-template-columns: 13rem minmax(0, 1fr);
    gap: 2rem;
}

@media (max-width: 720px) {
    .acumy-auth__manage {
        grid-template-columns: minmax(0, 1fr);
    }
}

.acumy-auth__nav {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: .125rem;
}

.acumy-auth__nav a {
    display: block;
    padding: .5rem .75rem;
    border-radius: 8px;
    color: var(--acumy-ink-muted);
    text-decoration: none;
    font-size: .875rem;
}

.acumy-auth__nav a.active {
    background: var(--acumy-blue-tint);
    color: var(--acumy-blue);
    font-weight: 600;
}

/* The account settings pages keep the template's form markup. These give it the Acumy surface. */
.acumy-auth h3, .acumy-auth h4 { font-size: 1.0625rem; font-weight: 700; color: var(--acumy-ink); margin: 0 0 .75rem; }
.acumy-auth hr { border: 0; border-top: 1px solid var(--acumy-hairline); margin: 1rem 0; }
.acumy-auth .row { display: block; }
.acumy-auth .form-floating { display: flex; flex-direction: column-reverse; gap: .375rem; margin-bottom: 1rem; }
.acumy-auth .form-label, .acumy-auth .control-label { font-size: .8125rem; font-weight: 600; color: var(--acumy-ink); }
.acumy-auth .form-control { width: 100%; box-sizing: border-box; padding: .625rem .75rem; font: inherit; color: var(--acumy-ink); background: var(--acumy-surface); border: 1px solid var(--acumy-hairline); border-radius: 8px; }
.acumy-auth .btn { display: inline-flex; align-items: center; justify-content: center; padding: .625rem 1rem; font: inherit; font-weight: 600; border-radius: 8px; border: 1px solid var(--acumy-hairline); background: transparent; color: var(--acumy-blue); cursor: pointer; text-decoration: none; }
.acumy-auth .btn-primary { background: var(--acumy-blue); border-color: transparent; color: #FFFFFF; }
.acumy-auth .btn-danger { background: var(--acumy-red); border-color: transparent; color: #FFFFFF; }
.acumy-auth .btn-link { border-color: transparent; }
.acumy-auth .w-100 { width: 100%; }
.acumy-auth .text-danger { color: var(--acumy-red); font-size: .8125rem; }
.acumy-auth .alert { border-radius: 8px; padding: .625rem .75rem; margin-bottom: 1rem; font-size: .875rem; border: 1px solid; }
.acumy-auth .alert-warning { color: var(--acumy-amber); background: var(--acumy-amber-tint); }
.acumy-auth .alert-danger { color: var(--acumy-red); background: var(--acumy-red-tint); }
.acumy-auth .alert-info { color: var(--acumy-blue); background: var(--acumy-blue-tint); }
.acumy-auth .table { width: 100%; border-collapse: collapse; font-size: .875rem; }
.acumy-auth .table td, .acumy-auth .table th { padding: .5rem; border-bottom: 1px solid var(--acumy-hairline); text-align: left; }

/* ── Account menu, top right of every page (8 Oct 2026) ──────────────────────────────────────── */

/* A popup opens below its button, inside this. Click outside (the scrim) or Esc closes it. */
.acumy-popup-anchor {
    position: relative;
}

.acumy-popup-scrim {
    position: fixed;
    inset: 0;
    z-index: 1400;
    background: transparent;
}

.acumy-popup {
    position: absolute;
    top: calc(100% + .375rem);
    right: 0;
    z-index: 1401;
    min-width: 15rem;
    max-width: 22rem;
    padding: .5rem;
    background: var(--acumy-surface);
    color: var(--acumy-ink);
    border: 1px solid var(--acumy-hairline);
    border-radius: 12px;
    box-shadow: 0 10px 30px rgba(15, 23, 42, .18);
    outline: none;
}

.acumy-popup--view {
    left: 0;
    right: 0;
    min-width: 0;
}

.acumy-popup__caption {
    padding: .5rem .5rem .25rem;
    color: var(--acumy-ink-muted);
    font-size: .75rem;
    font-weight: 600;
}

.acumy-popup__note {
    padding: .375rem .5rem .25rem;
    color: var(--acumy-ink-muted);
    font-size: .75rem;
}

.acumy-popup__rule {
    margin: .5rem 0;
    border: none;
    border-top: 1px solid var(--acumy-hairline);
}

.acumy-popup__item {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: .5rem;
    width: 100%;
    padding: .5rem;
    font: inherit;
    font-size: .875rem;
    text-align: left;
    color: var(--acumy-ink);
    background: transparent;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    text-decoration: none;
}

    .acumy-popup__item:hover,
    .acumy-popup__item:focus-visible {
        background: var(--acumy-grey-tint);
    }

.acumy-popup__item--on {
    font-weight: 600;
    justify-content: space-between;
}

.acumy-avatar-button {
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 50%;
    border: none;
    background: var(--acumy-blue);
    color: #FFFFFF;
    font: inherit;
    font-size: .8125rem;
    font-weight: 700;
    cursor: pointer;
}

    .acumy-avatar-button:hover,
    .acumy-avatar-button[aria-expanded="true"] {
        box-shadow: 0 0 0 3px var(--acumy-blue-tint);
    }

.acumy-account-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .125rem;
    padding: .75rem .5rem .5rem;
    text-align: center;
}

.acumy-account__avatar {
    flex: 0 0 auto;
    width: 1.75rem;
    height: 1.75rem;
    border-radius: 50%;
    background: var(--acumy-blue);
    color: #FFFFFF;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: .75rem;
    font-weight: 700;
}

.acumy-account__avatar--large {
    width: 3.5rem;
    height: 3.5rem;
    margin-bottom: .375rem;
    font-size: 1.25rem;
}

.acumy-account-card__name {
    color: var(--acumy-ink);
    font-size: 1rem;
    font-weight: 600;
    text-decoration: none;
}

    .acumy-account-card__name:hover {
        text-decoration: underline;
    }

.acumy-account-card__meta {
    color: var(--acumy-ink-muted);
    font-size: .8125rem;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.acumy-account-card__roles {
    margin: 0;
    padding: 0 .5rem .25rem;
    list-style: none;
    font-size: .8125rem;
}

    .acumy-account-card__roles li {
        padding: .1875rem 0;
    }

/* ── Sidebar: view switch and lines between groups ───────────────────────────────────────────── */

.acumy-viewas {
    margin: -.75rem .75rem .75rem;
}

.acumy-viewas__button {
    display: flex;
    align-items: center;
    gap: .375rem;
    width: 100%;
    padding: .375rem .5rem;
    font: inherit;
    font-size: .8125rem;
    color: var(--acumy-sidebar-ink);
    background: rgba(255, 255, 255, .06);
    border: 1px solid rgba(255, 255, 255, .08);
    border-radius: 8px;
    cursor: pointer;
}

    .acumy-viewas__button:hover,
    .acumy-viewas__button[aria-expanded="true"] {
        color: var(--acumy-sidebar-ink-active);
        background: var(--acumy-sidebar-active);
    }

.acumy-viewas__name {
    flex: 1 1 auto;
    text-align: left;
}

/* Between groups of sidebar items, and above a section's setup pages. */
.acumy-nav__rule {
    margin: .375rem .75rem;
    border: none;
    border-top: 1px solid rgba(255, 255, 255, .1);
}

.acumy-nav__rule--pages {
    margin: .25rem .75rem .25rem 2.5rem;
}

/* ── Pending decision row ────────────────────────────────────────────────────────────────────── */

.acumy-decision {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
    padding: .75rem 0;
    border-bottom: 1px solid var(--acumy-hairline);
    flex-wrap: wrap;
}

.acumy-decision:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.acumy-decision__title {
    display: flex;
    align-items: center;
    gap: .5rem;
    flex-wrap: wrap;
    margin-bottom: .25rem;
}

.acumy-decision__actions {
    display: flex;
    align-items: center;
    gap: .5rem;
    flex-wrap: wrap;
}

.acumy-decision__note {
    min-width: 16rem;
}

/* ── Label/figure list inside a panel ────────────────────────────────────────────────────────── */

/* A definition list, not a component: two columns of label and figure need no behaviour, and a
   component that only emits markup is a component to keep working for no benefit. */
.acumy-figures {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: .5rem 1rem;
    margin: 0;
    align-items: baseline;
}

.acumy-figures dt {
    min-width: 0;
}

.acumy-figures dd {
    margin: 0;
    font-weight: 600;
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.acumy-figures__note {
    color: var(--acumy-ink-muted);
    margin-left: .5rem;
}

/* ── Two panels side by side ─────────────────────────────────────────────────────────────────── */

/* Same auto-fit rule as the KPI row, so the pair collapses to one column on a narrow viewport
   rather than being squeezed. */
.acumy-split {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: 1rem;
    align-items: start;
    margin-bottom: 1.25rem;
}

/* ── KPI cards ───────────────────────────────────────────────────────────────────────────────── */

.acumy-kpi-row {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 1rem;
    margin-bottom: 1.25rem;
}

.acumy-kpi {
    display: flex;
    align-items: flex-start;
    gap: .875rem;
    background: var(--acumy-surface);
    border: 1px solid var(--acumy-hairline);
    border-radius: 12px;
    padding: 1.125rem 1.25rem;
}

.acumy-kpi-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 50%;
    flex: 0 0 auto;
}

.acumy-kpi-label {
    font-size: .75rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: var(--acumy-ink-muted);
}

.acumy-kpi-figure {
    font-size: 1.75rem;
    font-weight: 600;
    line-height: 1.15;
    color: var(--acumy-ink);
    margin-top: .1875rem;
}

.acumy-kpi-caption {
    font-size: .75rem;
    color: var(--acumy-ink-muted);
    margin-top: .25rem;
}

/* ── Status: dot + word, and pill badge ──────────────────────────────────────────────────────── */

.acumy-status-dot {
    display: inline-flex;
    align-items: center;
    gap: .4375rem;
    font-size: .8125rem;
    color: var(--acumy-ink);
    white-space: nowrap;
}

.acumy-status-dot__mark {
    width: .5rem;
    height: .5rem;
    border-radius: 50%;
    flex: 0 0 auto;
    background: var(--acumy-neutral);
}

.acumy-status-pill {
    display: inline-flex;
    align-items: center;
    gap: .375rem;
    padding: .1875rem .5625rem;
    border-radius: 999px;
    font-size: .75rem;
    font-weight: 500;
    white-space: nowrap;
    background: var(--acumy-neutral-tint);
    color: var(--acumy-neutral);
    border: 1px solid transparent;
}

.acumy-status--red .acumy-status-dot__mark { background: var(--acumy-red); }
.acumy-status--red.acumy-status-pill { background: var(--acumy-red-tint); color: var(--acumy-red); }

.acumy-status--amber .acumy-status-dot__mark { background: var(--acumy-amber); }
.acumy-status--amber.acumy-status-pill { background: var(--acumy-amber-tint); color: var(--acumy-amber); }

.acumy-status--green .acumy-status-dot__mark { background: var(--acumy-green); }
.acumy-status--green.acumy-status-pill { background: var(--acumy-green-tint); color: var(--acumy-green); }

.acumy-status--teal .acumy-status-dot__mark { background: var(--acumy-teal); }
.acumy-status--teal.acumy-status-pill { background: var(--acumy-teal-tint); color: var(--acumy-teal); }

.acumy-status--blue .acumy-status-dot__mark { background: var(--acumy-blue); }
.acumy-status--blue.acumy-status-pill { background: var(--acumy-blue-tint); color: var(--acumy-blue); }

.acumy-status--grey .acumy-status-dot__mark { background: var(--acumy-grey); }
.acumy-status--grey.acumy-status-pill { background: var(--acumy-grey-tint); color: var(--acumy-grey); }

.acumy-status--neutral .acumy-status-dot__mark { background: var(--acumy-neutral); }
.acumy-status--neutral.acumy-status-pill { background: var(--acumy-neutral-tint); color: var(--acumy-neutral); }

/*
 * Unmapped: a real status value with no Status row to explain it. This must look wrong, not merely
 * plain — a quiet grey would hide a data gap. Hatched, outlined, and it keeps the raw value visible.
 */
.acumy-status--unmapped.acumy-status-pill,
.acumy-status--unmapped .acumy-status-dot__mark {
    background: repeating-linear-gradient(135deg, #FDE68A, #FDE68A 4px, #FFFFFF 4px, #FFFFFF 8px);
    color: #92400E;
    border: 1px dashed #B45309;
}

.acumy-status--unmapped .acumy-status-dot__mark {
    border-radius: 2px;
}

.acumy-status-unmapped-marker {
    font-weight: 700;
    color: #B45309;
}

/* ── Tables ──────────────────────────────────────────────────────────────────────────────────── */




.acumy-table-scroll {
    overflow-x: auto;
}

/* An identifier (an ARN) has no spaces. Unbroken, it set the first column's width and pushed every
   other column past the right edge, where ticking it in Columns showed nothing. */
.acumy-table-scroll td .acumy-mono { overflow-wrap: anywhere; }
.acumy-table-scroll .acumy-grid__lead-cell { max-width: 28rem; overflow-wrap: anywhere; }

/* A row describing something that is no longer there. Muted, never hidden — a resource that has
   gone is a fact the estate screens are supposed to show, not an absence. */

/* The bulk action bar. Two buttons on purpose — one acts on what is ticked, one on everything the
   filter matches — so they need room to stay legible side by side. */
.acumy-assign {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .75rem 1rem;
    padding: .75rem 1rem;
    border-bottom: 1px solid var(--acumy-hairline);
    background: #F8FAFC;
}

    .acumy-assign__picker {
        min-width: 18rem;
    }

    .acumy-assign__note {
        min-width: 16rem;
        flex: 1 1 16rem;
    }

/* A form in the content area, never a dialog — a required step must not be something the user has
   to discover by clicking around. Two columns on a wide screen, one on a narrow one. */
.acumy-form {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(19rem, 1fr));
    gap: 1rem;
}

    .acumy-form__wide {
        grid-column: 1 / -1;
    }

.acumy-form__actions {
    display: flex;
    align-items: center;
    gap: .75rem;
    margin-top: 1.25rem;
}

/* What an action did, itemised. Each line is a different thing to go and do. */
.acumy-outcome {
    margin: .5rem 0 0;
    padding-left: 1.25rem;
}

    .acumy-outcome li {
        margin-top: .25rem;
    }

/* Filters in a panel header. Wraps rather than squeezing the search field to nothing. */
.acumy-filter-row {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: .75rem 1rem;
}

    .acumy-filter-row .mud-input-control {
        min-width: 15rem;
    }

.acumy-mono {
    font-family: ui-monospace, "Cascadia Mono", Consolas, monospace;
    font-size: .78125rem;
}

/* ── Empty and error states ──────────────────────────────────────────────────────────────────── */

.acumy-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: .5rem;
    padding: 2.5rem 1.5rem;
    color: var(--acumy-ink-muted);
}

.acumy-empty__title {
    font-size: .9375rem;
    font-weight: 600;
    color: var(--acumy-ink);
}

.acumy-empty__body {
    font-size: .8125rem;
    max-width: 34rem;
}

/* A failure must never be mistaken for "no rows". Red, bordered, and it says it is a failure. */
.acumy-empty--error {
    background: var(--acumy-red-tint);
    border: 1px solid var(--acumy-red);
    border-radius: 12px;
    color: #7F1D1D;
}

.acumy-empty--error .acumy-empty__title {
    color: var(--acumy-red);
}

/* ── Provider logo ───────────────────────────────────────────────────────────────────────────── */

.acumy-provider-logo {
    display: inline-flex;
    align-items: center;
    vertical-align: middle;
}

.acumy-provider-logo svg {
    display: block;
    height: 100%;
    width: auto;
    max-width: 100%;
}

/* ── Money ───────────────────────────────────────────────────────────────────────────────────── */

.acumy-money {
    white-space: nowrap;
}

.acumy-money__amount {
    font-variant-numeric: tabular-nums;
    font-weight: 600;
}

.acumy-money__qualifier {
    color: var(--acumy-ink-muted);
    font-size: .75rem;
}

/* An amount with no currency is not renderable. Say so rather than showing a bare number. */
.acumy-money--invalid {
    color: var(--acumy-red);
    font-weight: 600;
    border-bottom: 1px dashed var(--acumy-red);
    cursor: help;
}

/* ── Diagnostics ─────────────────────────────────────────────────────────────────────────────── */

.acumy-diagnostic {
    margin: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: var(--acumy-amber-tint);
    border: 1px solid var(--acumy-amber);
    border-radius: 12px;
    color: #78350F;
}

.acumy-diagnostic__title {
    font-size: .9375rem;
    font-weight: 700;
    margin: 0 0 .5rem;
}

.acumy-diagnostic code {
    background: rgba(0, 0, 0, .06);
    padding: .0625rem .3125rem;
    border-radius: 4px;
}

/* ── Dialogs ─────────────────────────────────────────────────────────────────────────────────── */

/*
 * Every dialog: the title and the buttons stay put; only the content may scroll, and only as a last
 * resort (CLAUDE.md, User interface). MudBlazor scrolls the whole dialog, which takes Save off screen.
 */
.mud-dialog {
    overflow: hidden !important;
    max-height: calc(100dvh - 4rem);
}

    .mud-dialog .mud-dialog-title,
    .mud-dialog .mud-dialog-actions {
        flex: 0 0 auto;
    }

    .mud-dialog .mud-dialog-content {
        min-height: 0;
    }

    .mud-dialog .mud-dialog-title {
        border-bottom: 1px solid var(--acumy-hairline);
    }

    .mud-dialog .mud-dialog-actions {
        border-top: 1px solid var(--acumy-hairline);
        padding: .75rem 1.5rem 1rem;
    }

    .mud-dialog .mud-dialog-content {
        padding-top: 1rem;
        padding-bottom: 1rem;
    }

/*
 * Capped so the dialog can never grow past the viewport, with the row list as the only scrolling
 * region. The summary above it stays put: the residual cost is the reason the dialog exists and must
 * not scroll out of sight.
 */
.acumy-dialog {
    max-width: 90vw !important;
    max-height: 80vh !important;
    display: flex;
    flex-direction: column;
}

/* min-height:0 is load-bearing — without it a flex child refuses to shrink and the overflow never
   engages, which is how a dialog ends up taller than the screen with no scrollbar. */
.acumy-dialog .mud-dialog-content {
    display: flex;
    flex-direction: column;
    min-height: 0;
    overflow: hidden;
}

.acumy-dialog-fixed {
    flex: 0 0 auto;
}

/* "Assign owner": the ticked workspaces, then the two fields side by side. */
.acumy-assign-owner__list {
    margin: .5rem 0 1rem;
    padding-left: 1.1rem;
    max-height: 12rem;
    overflow-y: auto;
}

.acumy-assign-owner__fields {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
}

/* A cloud account's page: the facts under the heading. */
.acumy-account-facts {
    display: flex;
    flex-wrap: wrap;
    gap: 2rem;
}

.acumy-account-facts__label {
    font-size: .75rem;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: var(--acumy-ink-muted);
}

.acumy-account-facts__figure {
    font-size: 1.25rem;
    font-weight: 600;
}

/* The accounting strip: one bar, a part per workspace class and Unassigned, widths by count.
   Classes take the categorical series in their order; Unassigned is amber, the work left to do. */
.acumy-strip {
    display: flex;
    height: .75rem;
    border-radius: 999px;
    overflow: hidden;
    background: var(--acumy-grey-tint);
}

.acumy-strip__part { min-width: 2px; }

.acumy-strip__legend {
    display: flex;
    flex-wrap: wrap;
    gap: .75rem 2rem;
    margin-top: .75rem;
}

.acumy-strip__key {
    display: flex;
    align-items: baseline;
    gap: .5rem;
}

.acumy-strip__swatch {
    width: .75rem;
    height: .75rem;
    border-radius: 3px;
    align-self: center;
}

.acumy-strip__name { color: var(--acumy-ink-muted); }

.acumy-strip--class0 { background: var(--acumy-series-1); }
.acumy-strip--class1 { background: var(--acumy-series-3); }
.acumy-strip--class2 { background: var(--acumy-series-7); }
.acumy-strip--class3 { background: var(--acumy-series-5); }
.acumy-strip--unassigned { background: var(--acumy-amber); }

/* The Review dialog: one outcome per line, then the note across the width. */
.acumy-review__outcomes {
    border: 0;
    margin: 0 0 1rem;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: .5rem;
}

.acumy-review__outcome {
    display: flex;
    align-items: flex-start;
    gap: .5rem;
    cursor: pointer;
}

.acumy-review__note textarea {
    width: 100%;
}

/* The severity dot beside a workspace's name in "Workspaces needing attention". */
.acumy-attention-name {
    display: flex;
    align-items: center;
    gap: .6rem;
}

/* The resources behind a suggestion card: the shared grid, scrolling inside the dialog. */
.acumy-suggestion-resources .mud-dialog-content {
    max-height: 70vh;
    overflow-y: auto;
}

/*
 * The vh cap is deliberate redundancy. The flex chain above gives the better result, but it only works
 * if MudDialog's Class lands on the dialog paper — if it lands on a wrapper instead, the ancestor cap
 * never applies and the dialog grows unbounded again. This makes the scroll region bounded on its own,
 * so the list scrolls either way.
 */
.acumy-dialog-scroll {
    flex: 1 1 auto;
    min-height: 0;
    max-height: 46vh;
    overflow-y: auto;
    overflow-x: auto;
}

/* Sticky header so the columns stay readable while scrolling a long resource list. */
.acumy-dialog-scroll table {
    width: 100%;
    border-collapse: collapse;
}

.acumy-dialog-scroll thead th {
    position: sticky;
    top: 0;
    z-index: 1;
    background: #F8FAFC;
    border-bottom: 1px solid var(--acumy-hairline);
    text-align: left;
    font-size: .6875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: var(--acumy-ink-muted);
    padding: .5rem .75rem;
    white-space: nowrap;
}

.acumy-dialog-scroll tbody td {
    padding: .5rem .75rem;
    border-bottom: 1px solid var(--acumy-hairline);
    font-size: .8125rem;
    vertical-align: top;
}

/* Group header row. */
.acumy-dialog-scroll tr.acumy-group th {
    position: static;
    background: var(--acumy-ground);
    text-transform: none;
    letter-spacing: 0;
    font-size: .8125rem;
    color: var(--acumy-ink);
    padding: .625rem .75rem;
    border-top: 1px solid var(--acumy-hairline);
}

.acumy-group__count {
    font-weight: 400;
    color: var(--acumy-ink-muted);
}

/* Chip on top, reason underneath in smaller text — rows stay scannable. */
.acumy-outcome__detail {
    margin-top: .25rem;
    font-size: .75rem;
    line-height: 1.4;
    color: var(--acumy-ink-muted);
    max-width: 30rem;
}

.acumy-cell-nowrap {
    white-space: nowrap;
}

/* ── Placeholder screens ─────────────────────────────────────────────────────────────────────── */

.acumy-placeholder dl {
    display: grid;
    grid-template-columns: minmax(8rem, max-content) 1fr;
    gap: .4375rem 1.25rem;
    margin: 0;
    font-size: .8125rem;
}

.acumy-placeholder dt {
    color: var(--acumy-ink-muted);
    font-weight: 500;
}

.acumy-placeholder dd {
    margin: 0;
    color: var(--acumy-ink);
}

/* ── The row a side panel is showing ─────────────────────────────────────────────────────────── */

/* Master/detail: which row the panel beside it belongs to. Hover alone cannot say that, because the
   pointer is over the panel by the time anyone reads it. */
.acumy-row--selected td {
    background: var(--acumy-blue-tint) !important;
}

/* ── A figure that refuses to exist ──────────────────────────────────────────────────────────── */

/* Deliberately not styled like a number. "Not computable" is an answer, and rendering it in the
   figure's own weight would have it read as a value rather than the absence of one. */
.acumy-figure-unknown {
    font-size: .875rem;
    font-weight: 500;
    color: var(--acumy-ink-muted);
}

/* ── A value to be copied elsewhere ──────────────────────────────────────────────────────────── */

/* Selectable, wrapping, and visually a value rather than a field. It is read-only by design, so it
   must not look like something that can be typed into. */
.acumy-secret {
    display: flex;
    align-items: center;
    gap: .75rem;
    flex-wrap: wrap;
}

.acumy-secret__value {
    flex: 1 1 18rem;
    min-width: 0;
    font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
    font-size: .8125rem;
    background: var(--acumy-ground);
    border: 1px solid var(--acumy-hairline);
    border-radius: 6px;
    padding: .5rem .625rem;
    overflow-wrap: anywhere;
    user-select: all;
}

/* ── A message as it will be sent (DRUID's template preview) ─────────────────────────────────── */

.acumy-message-text {
    white-space: pre-wrap;
    overflow-wrap: anywhere;
    font-family: inherit;
    font-size: .875rem;
    background: var(--acumy-ground);
    border: 1px solid var(--acumy-hairline);
    border-radius: 6px;
    padding: .75rem;
    margin: 0;
}

.acumy-message-frame {
    width: 100%;
    height: 32rem;
    border: 1px solid var(--acumy-hairline);
    border-radius: 6px;
    background: #fff;
}

/* ── My account → Notifications: one switch per optional kind of message ───────────────────── */

.acumy-notification-choices {
    display: flex;
    flex-direction: column;
    gap: .75rem;
}

.acumy-notification-choice {
    display: flex;
    flex-direction: column;
}

.acumy-notification-choice .acumy-field-hint {
    margin-left: 3.25rem;
}

/* ── Live indicator ──────────────────────────────────────────────────────────────────────────── */

/* Shown only while the page is actually polling. It is the page saying what it is doing, so it must
   disappear the moment the loop stops — a pulsing dot over a screen that has stopped following
   anything is exactly the lie the Refresh button used to tell more honestly. */
.acumy-live {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    font-size: .75rem;
    color: var(--acumy-ink-muted);
}

.acumy-live__dot {
    display: inline-block;
    width: .5rem;
    height: .5rem;
    border-radius: 50%;
    background: var(--acumy-blue);
    animation: acumy-live-pulse 1.6s ease-in-out infinite;
}

@keyframes acumy-live-pulse {
    0%, 100% { opacity: 1; }
    50% { opacity: .25; }
}

@media (prefers-reduced-motion: reduce) {
    .acumy-live__dot {
        animation: none;
    }
}

/* ── Discovery rail ──────────────────────────────────────────────────────────────────────────── */

/* The six-page rail from reference/discovery/image4.png: numbered markers joined by a line, the
   line filled behind the run and hollow ahead of it. Wraps rather than compresses — a page label
   truncated to "Save Accounts…" tells the reader nothing they did not already know. */
.acumy-rail {
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: .25rem;
    margin-bottom: 1.25rem;
    padding: 1rem 1.25rem;
    background: var(--acumy-surface);
    border: 1px solid var(--acumy-hairline);
    border-radius: 12px;
}

.acumy-rail__step {
    display: flex;
    align-items: flex-start;
    gap: .625rem;
    min-width: 0;
    padding: .25rem .5rem;
    border-radius: 8px;
}

.acumy-rail__step--link {
    color: inherit;
    text-decoration: none;
    cursor: pointer;
}

.acumy-rail__step--link:hover {
    background: var(--acumy-ground);
}

.acumy-rail__step--shown,
.acumy-rail__step--shown:hover {
    background: var(--acumy-blue-tint);
    box-shadow: inset 0 -2px 0 var(--acumy-blue);
}

.acumy-rail__label,
.acumy-rail__state {
    display: block;
}

.acumy-rail__link {
    flex: 1 1 1.5rem;
    min-width: 1.5rem;
    height: 1px;
    margin-top: 1rem;
    background: var(--acumy-hairline);
}

.acumy-rail__link--done {
    background: var(--acumy-green);
}

.acumy-rail__marker {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 2rem;
    height: 2rem;
    border-radius: 50%;
    font-size: .8125rem;
    font-weight: 600;
    background: var(--acumy-surface);
    border: 1px solid var(--acumy-hairline);
    color: var(--acumy-ink-muted);
}

.acumy-rail__detail {
    min-width: 0;
    padding-top: .125rem;
}

.acumy-rail__label {
    font-size: .8125rem;
    font-weight: 600;
    color: var(--acumy-ink);
    white-space: nowrap;
}

.acumy-rail__state {
    font-size: .6875rem;
    color: var(--acumy-ink-muted);
    min-height: 1em;
    white-space: nowrap;
}

.acumy-rail__step--done .acumy-rail__marker {
    background: var(--acumy-green-tint);
    border-color: var(--acumy-green);
    color: var(--acumy-green);
}

/* Running and waiting are the two a person confuses if they look the same, and the two that need
   different things done. Blue and filled means "leave it alone"; amber and ringed means "you". */
.acumy-rail__step--running .acumy-rail__marker {
    background: var(--acumy-blue);
    border-color: var(--acumy-blue);
    color: #fff;
}

.acumy-rail__step--running .acumy-rail__state {
    color: var(--acumy-blue);
    font-weight: 600;
}

.acumy-rail__step--waiting .acumy-rail__marker {
    background: var(--acumy-amber);
    border-color: var(--acumy-amber);
    color: #fff;
    box-shadow: 0 0 0 4px var(--acumy-amber-tint);
}

.acumy-rail__step--waiting .acumy-rail__state {
    color: var(--acumy-amber);
    font-weight: 700;
}

.acumy-rail__step--stopped .acumy-rail__marker {
    background: var(--acumy-ground);
    border-color: var(--acumy-ink-muted);
    color: var(--acumy-ink);
}

.acumy-rail__step--pending .acumy-rail__label {
    color: var(--acumy-ink-muted);
    font-weight: 500;
}

/* A finished step that had a problem. Outlined, not filled: it is not waiting for anybody. */
.acumy-rail__step--problem .acumy-rail__marker {
    background: var(--acumy-amber-tint);
    border-color: var(--acumy-amber);
    color: var(--acumy-amber);
}

.acumy-rail__step--problem .acumy-rail__state {
    color: var(--acumy-amber);
}

/* The ring inside a running marker. Motion, because the difference between "working" and "stuck"
   is the single thing a person is looking for. */
.acumy-rail__spinner {
    display: inline-block;
    width: .875rem;
    height: .875rem;
    border-radius: 50%;
    border: 2px solid rgba(255, 255, 255, .45);
    border-top-color: #fff;
    animation: acumy-spin 900ms linear infinite;
}

@keyframes acumy-spin {
    to { transform: rotate(360deg); }
}

@media (prefers-reduced-motion: reduce) {
    .acumy-rail__spinner {
        animation: none;
    }
}

/* ── Discovery step checklist ────────────────────────────────────────────────────────────────── */

/* The vertical timeline from reference/discovery/image4.png: a marker per sub-step, joined by a
   line, with the step in progress boxed and tinted so it is findable without reading. */
.acumy-checklist {
    display: flex;
    flex-direction: column;
}

.acumy-checklist__item {
    display: flex;
    align-items: flex-start;
    gap: .875rem;
    position: relative;
    padding-bottom: 1.25rem;
}

.acumy-checklist__item:last-child {
    padding-bottom: 0;
}

/* The connector. Drawn from each marker down to the next, and coloured by what has been done. */
.acumy-checklist__item:not(:last-child)::before {
    content: "";
    position: absolute;
    left: 1rem;
    top: 2.125rem;
    bottom: .25rem;
    width: 1px;
    background: var(--acumy-hairline);
}

.acumy-checklist__item--done:not(:last-child)::before {
    background: var(--acumy-green);
}

.acumy-checklist__marker {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 2rem;
    height: 2rem;
    border-radius: 50%;
    border: 1px solid var(--acumy-hairline);
    background: var(--acumy-surface);
    color: var(--acumy-ink-muted);
    font-size: .75rem;
    font-weight: 600;
    z-index: 1;
}

.acumy-checklist__body {
    min-width: 0;
    flex: 1 1 auto;
    padding-top: .25rem;
}

.acumy-checklist__item--done .acumy-checklist__marker {
    background: var(--acumy-green-tint);
    border-color: var(--acumy-green);
    color: var(--acumy-green);
}

.acumy-checklist__item--failed .acumy-checklist__marker {
    background: var(--acumy-red-tint);
    border-color: var(--acumy-red);
    color: var(--acumy-red);
}

.acumy-checklist__item--running .acumy-checklist__marker {
    background: var(--acumy-blue);
    border-color: var(--acumy-blue);
    color: #fff;
}

.acumy-checklist__item--waiting .acumy-checklist__marker {
    background: var(--acumy-amber);
    border-color: var(--acumy-amber);
    color: #fff;
    box-shadow: 0 0 0 4px var(--acumy-amber-tint);
}

/* The current step is boxed, as the reference has it — findable at a glance rather than by
   reading down the list to see which one has no timestamp. */
.acumy-checklist__item--running .acumy-checklist__body,
.acumy-checklist__item--waiting .acumy-checklist__body {
    padding: .625rem .875rem;
    border-radius: 8px;
}

.acumy-checklist__item--running .acumy-checklist__body {
    background: var(--acumy-blue-tint);
}

.acumy-checklist__item--waiting .acumy-checklist__body {
    background: var(--acumy-amber-tint);
}

.acumy-checklist__label {
    font-size: .8125rem;
    font-weight: 600;
    color: var(--acumy-ink);
}

/* Steps the run has not reached. Shown so the person sees what is coming, greyed so none reads as done. */
.acumy-checklist__item--pending .acumy-checklist__marker {
    border-style: dashed;
    background: transparent;
    color: var(--acumy-ink-faint);
}

.acumy-checklist__item--pending .acumy-checklist__label {
    color: var(--acumy-ink-faint);
    font-weight: 500;
}

.acumy-checklist__item--running .acumy-checklist__label {
    color: var(--acumy-blue);
}

.acumy-checklist__item--waiting .acumy-checklist__label {
    color: #78350F;
}

/* Deliberately tabular: a column of timestamps is read by comparing them. */
.acumy-checklist__time {
    font-size: .6875rem;
    color: var(--acumy-ink-muted);
    font-variant-numeric: tabular-nums;
}

.acumy-checklist__result {
    font-size: .75rem;
    color: var(--acumy-ink-muted);
    line-height: 1.4;
    max-width: 44rem;
}

.acumy-checklist__item--failed .acumy-checklist__result {
    color: var(--acumy-red);
}

/* ── What the run needs from you ─────────────────────────────────────────────────────────────── */

/* A parked run gets one block and one button, in the same place every time. The previous design
   put the action inside an alert inside a panel, which meant finding out what to do required
   reading three levels of chrome first. */
.acumy-prompt {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    padding: 1.125rem 1.25rem;
    margin-bottom: 1.25rem;
    background: var(--acumy-amber-tint);
    border: 1px solid var(--acumy-amber);
    border-left-width: 4px;
    border-radius: 12px;
}

.acumy-prompt__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 50%;
    background: var(--acumy-amber);
    color: #fff;
}

.acumy-prompt__body {
    flex: 1 1 auto;
    min-width: 0;
}

.acumy-prompt__title {
    font-size: .9375rem;
    font-weight: 700;
    color: #78350F;
    margin: 0 0 .25rem;
}

.acumy-prompt__detail {
    font-size: .8125rem;
    color: #78350F;
    margin: 0;
    max-width: 46rem;
}

.acumy-prompt__action {
    flex: 0 0 auto;
    align-self: center;
}

/* The same block, for a run that is simply working. Calm, and explicitly not asking for anything. */
.acumy-prompt--working {
    background: var(--acumy-blue-tint);
    border-color: var(--acumy-blue);
}

.acumy-prompt--working .acumy-prompt__icon {
    background: var(--acumy-blue);
}

.acumy-prompt--working .acumy-prompt__title,
.acumy-prompt--working .acumy-prompt__detail {
    color: var(--acumy-ink);
}

/* And for a run that has ended. */
.acumy-prompt--done {
    background: var(--acumy-green-tint);
    border-color: var(--acumy-green);
}

.acumy-prompt--done .acumy-prompt__icon {
    background: var(--acumy-green);
}

.acumy-prompt--done .acumy-prompt__title,
.acumy-prompt--done .acumy-prompt__detail {
    color: var(--acumy-ink);
}

.acumy-prompt--stopped {
    background: var(--acumy-red-tint);
    border-color: var(--acumy-red);
}

.acumy-prompt--stopped .acumy-prompt__icon {
    background: var(--acumy-red);
}

.acumy-prompt--stopped .acumy-prompt__title,
.acumy-prompt--stopped .acumy-prompt__detail {
    color: var(--acumy-ink);
}

/* A provider's own message, folded under the plain words. */
.acumy-provider-words {
    margin-top: .25rem;
    font-size: .75rem;
    color: var(--acumy-grey);
}

.acumy-provider-words summary {
    cursor: pointer;
}

.acumy-provider-words__text {
    font-family: ui-monospace, "Cascadia Mono", Consolas, monospace;
    white-space: pre-wrap;
    word-break: break-word;
    margin-top: .25rem;
    max-width: 46rem;
}
/* ── Organisation unit tree ──────────────────────────────────────────────────────────────────── */

.acumy-tree {
    border: 1px solid var(--acumy-hairline);
    border-radius: 8px;
    max-height: 22rem;
    overflow-y: auto;
    padding: .25rem 0;
}

/* One unit. The ROW owns the indent, the label owns the text.
   --acumy-depth is an integer written by the component and multiplied here, so no decimal is ever
   formatted into the style attribute — a culture with a decimal comma produced "1,75rem" and the
   whole declaration was dropped. See OrganisationUnitPicker.razor. */
.acumy-tree__row {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    text-align: left;
    padding-left: calc(var(--acumy-depth, 0) * 1.25rem);
}

/* The guide line. Depth read from indentation alone is guesswork past the second level. */
.acumy-tree__row[style*="--acumy-depth"]:not([style*="--acumy-depth:0"]) {
    border-left: 1px solid var(--acumy-hairline);
    margin-left: .5rem;
}

.acumy-tree__chevron {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.25rem;
    height: 1.25rem;
    flex: 0 0 auto;
    border: 0;
    background: none;
    padding: 0;
    color: var(--acumy-ink-muted);
    cursor: pointer;
}

.acumy-tree__chevron:hover {
    color: var(--acumy-ink);
}

/* A leaf keeps the space so every label on a level starts on the same axis. */
.acumy-tree__chevron--none {
    cursor: default;
}

.acumy-tree__node {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: .5rem;
    flex: 1 1 auto;
    min-width: 0;
    border: 0;
    background: none;
    text-align: left;
    font: inherit;
    font-size: .8125rem;
    color: var(--acumy-ink);
    padding: .3125rem .5rem;
    cursor: pointer;
}

.acumy-tree__name {
    text-align: left;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.acumy-tree__hidden {
    font-size: .6875rem;
    color: var(--acumy-ink-muted);
    flex: 0 0 auto;
}

.acumy-tree__node:hover {
    background: var(--acumy-ground);
}

.acumy-tree__node--selected {
    background: var(--acumy-blue-tint);
    color: var(--acumy-blue);
    font-weight: 600;
}

.acumy-tree__chosen {
    margin: .75rem 0 0;
    font-size: .8125rem;
    color: var(--acumy-ink-muted);
}

/* The connection picker and its "add" button, side by side. */
.acumy-pickrow {
    display: flex;
    align-items: flex-start;
    gap: .75rem;
    flex-wrap: wrap;
}

.acumy-pickrow > .mud-input-control {
    flex: 1 1 18rem;
    min-width: 12rem;
}

/* ── DRUID ──────────────────────────────────────────────────────────────────────────────────────
   The admin tool. docs/05-druid.md is explicit that it takes no part in the design system and must
   be correct, complete and safe rather than beautiful — so this section is the minimum needed to
   make 139 tables findable and a 30-column grid readable, and nothing else.
   The layout follows reference/discovery/image16 and image18–19, which are the old DRUID running. */

.druid-finder {
    display: flex;
    align-items: center;
    gap: 1rem;
    width: 100%;
}

.druid-finder__box {
    max-width: 24rem;
}

.druid-finder__count {
    margin-left: auto;
    white-space: nowrap;
}

/* A group heading, not a panel: 91 of 139 tables are ungrouped and land under "Other", so the
   groups have to stack cheaply rather than each costing a card. */
.druid-group + .druid-group {
    border-top: 1px solid var(--acumy-hairline);
}

.druid-group__head {
    display: flex;
    align-items: center;
    gap: .5rem;
    margin: 0;
    padding: .75rem 1rem .5rem;
    font-size: .6875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: var(--acumy-ink-muted);
}

.druid-group__count {
    font-weight: 400;
    color: var(--acumy-ink-muted);
}

.druid-group__items {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(16rem, 1fr));
    gap: .25rem;
    padding: 0 1rem 1rem;
}

.druid-tile {
    display: flex;
    flex-direction: column;
    gap: .125rem;
    padding: .5rem .625rem;
    border: 1px solid transparent;
    border-radius: 6px;
    text-decoration: none;
    color: inherit;
}

.druid-tile:hover {
    background: #F8FAFC;
    border-color: var(--acumy-hairline);
}

.druid-tile__caption {
    font-size: .8125rem;
    font-weight: 500;
    color: var(--acumy-ink);
}

.druid-tile__name {
    font-size: .6875rem;
    color: var(--acumy-ink-muted);
}

/* The toolbar band: the first thing in the panel body, hard left, hairline under it. Panel's own
   HeaderContent slot is right-aligned — it is built for an action link — and the reference puts
   these controls on the left. */
.druid-toolbar-row {
    padding: .75rem 1rem;
    border-bottom: 1px solid var(--acumy-hairline);
}

/* One row, in the reference's order: which column · how to match · what to find. */
.druid-toolbar {
    display: flex;
    align-items: center;
    gap: .75rem;
    flex-wrap: wrap;
    justify-content: flex-start;
}

/* Fixed, not flexible. MudBlazor input controls grow inside a flex row, which spread these three
   across the whole panel and made one control look unrelated to the next. They are one sentence —
   column, operator, term — so they sit together. */
/* Each control sits in a plain div this file owns. Sizing MudBlazor's own input root loses the
   cascade — its stylesheet is linked after this one — so the widths live on a wrapper instead. */
.druid-toolbar__cell { flex: 0 0 auto; }
.druid-toolbar__cell--column { width: 15rem; }
.druid-toolbar__cell--operator { width: 11rem; }
.druid-toolbar__cell--term { width: 18rem; }

/* Applied search terms. Visible and individually removable — a filter you cannot see is why an
   empty grid looks like missing data. */
.druid-terms {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .375rem;
    width: 100%;
    margin-top: .625rem;
}

/* The grid scrolls sideways inside itself. A 30-column table must not push the page across and take
   the sidebar with it. */
.druid-grid {
}

.druid-table {
    width: 100%;
    border-collapse: collapse;
    font-size: .8125rem;
}

.druid-table th {
    position: sticky;
    top: 0;
    z-index: 1;
    background: #F8FAFC;
    border-bottom: 1px solid var(--acumy-hairline);
    text-align: left;
    white-space: nowrap;
    padding: 0;
}

.druid-table__th--sorted { background: #EFF6FF; }

.druid-sort {
    display: flex;
    align-items: center;
    gap: .25rem;
    width: 100%;
    padding: .5rem .75rem;
    border: 0;
    background: none;
    cursor: pointer;
    font: inherit;
    font-size: .6875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: var(--acumy-ink-muted);
}

.druid-sort:hover { color: var(--acumy-ink); }

.druid-table td {
    padding: .5rem .75rem;
    border-bottom: 1px solid var(--acumy-hairline);
    color: var(--acumy-ink);
    vertical-align: top;
    white-space: nowrap;
}

.druid-table tbody tr:hover td { background: #F8FAFC; }

/* Memo columns are the one thing allowed to wrap, and capped so a 4,000-character JSON blob cannot
   make every other row unreadable. */
.druid-cell--memo {
    white-space: normal;
    max-width: 28rem;
}

/* A finding that offers a choice. Stacked, because the options are sentences and two of them side by
   side on a table row wrap into each other. Wrapper elements rather than classes on the MudBlazor
   components: MudBlazor's stylesheet loads after this one and wins on equal specificity. */
.druid-choice {
    display: block;
    margin-top: .5rem;
    padding-left: .25rem;
    border-left: 2px solid #E2E8F0;
}

.druid-choice .mud-radio { align-items: flex-start; }

.druid-choice__label {
    display: block;
    font-weight: 600;
}

.druid-choice__pending {
    display: block;
    margin: .35rem 0 0 2rem;
    color: #B45309;
}

.druid-choice__why {
    display: block;
    white-space: normal;
}

.druid-pager {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: .75rem 1rem;
    padding: .625rem 1rem;
    border-top: 1px solid var(--acumy-hairline);
}

.druid-pager__controls {
    display: flex;
    align-items: center;
    gap: .625rem;
}

.druid-pager__size { width: 5.5rem; }

/* The way into a record, pinned right so it stays reachable on a table that scrolls sideways. */
.druid-table__open {
    position: sticky;
    right: 0;
    width: 3rem;
    background: #fff;
    border-left: 1px solid var(--acumy-hairline);
    text-align: center;
}

.druid-table thead .druid-table__open { background: #F8FAFC; }
.druid-table tbody tr:hover .druid-table__open { background: #F8FAFC; }

/* ── The record screen ─────────────────────────────────────────────────────────────────────── */

/* Rows of fields. The column count comes from how many fields share a Row in the metadata, so the
   grid is told the count rather than guessing a breakpoint. */
.druid-form-row {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
    gap: .75rem 1.25rem;
    margin-bottom: .5rem;
}

.druid-field {
    display: flex;
    flex-direction: column;
    gap: .1875rem;
    min-width: 0;
}

.druid-field__label {
    font-size: .6875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: var(--acumy-ink-muted);
}

.druid-field__required {
    color: var(--acumy-red, #DC2626);
    margin-left: .125rem;
}

/* A view field. Reads as text, not as a disabled input — a greyed-out box invites clicking. */
.druid-field__readonly {
    font-size: .8125rem;
    color: var(--acumy-ink);
    padding: .375rem 0;
    min-height: 1.75rem;
    word-break: break-word;
}

.druid-field__note {
    font-size: .6875rem;
    color: var(--acumy-ink-muted);
}

/* A field DRUID cannot render. Named and explained, never blank. */
.druid-field__unsupported {
    display: flex;
    align-items: center;
    gap: .375rem;
    padding: .375rem .5rem;
    border: 1px dashed var(--acumy-hairline);
    border-radius: 6px;
    font-size: .75rem;
    color: var(--acumy-ink-muted);
}

/* One obvious action, in the same place every time. */
.druid-form-actions {
    display: flex;
    align-items: center;
    gap: .75rem;
    padding: .25rem 0 1.5rem;
}

/* What the save actually wrote. On the screen, not in a toast that vanishes before it is read. */
.druid-changes {
    margin: .5rem 0 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: .1875rem;
}

.druid-changes li {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .375rem;
    font-size: .8125rem;
}

.druid-changes__field { font-weight: 600; }
.druid-changes__was { color: var(--acumy-ink-muted); text-decoration: line-through; }
.druid-changes__now { font-weight: 500; }

/* ── Related: one section, not twenty-six tabs ─────────────────────────────────────────────── */

.druid-related__child + .druid-related__child {
    border-top: 1px solid var(--acumy-hairline);
}

/* A whole-width button, so the hit target is the row rather than the chevron. */
.druid-related__head {
    display: flex;
    align-items: center;
    gap: .5rem;
    width: 100%;
    padding: .625rem .25rem;
    border: 0;
    background: none;
    cursor: pointer;
    font: inherit;
    text-align: left;
    color: var(--acumy-ink);
}

.druid-related__head:hover { background: #F8FAFC; }

.druid-related__caption { font-size: .8125rem; font-weight: 500; }

/* Which foreign key this list is through — a child can point at the same parent twice. */
.druid-related__via {
    font-size: .6875rem;
    color: var(--acumy-ink-muted);
    margin-right: auto;
}

.druid-related__body {
    padding: 0 0 .875rem 1.75rem;
}

.druid-related__loading {
    display: flex;
    align-items: center;
    gap: .5rem;
    padding: .75rem 0;
}

.druid-related__more { padding-top: .375rem; }

/* ── DRUID access matrix ──────────────────────────────────────────────────────────────────────
   Wrapper elements carry the layout rather than classes on the MudBlazor components: MudBlazor's
   stylesheet loads after this one and wins on equal specificity. */

.druid-access-head {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
    margin-bottom: .75rem;
}

.druid-access__role {
    max-width: 18rem;
    flex: 0 0 auto;
}

/* The group heading is the control that opens it, so it is a real button — reachable by keyboard,
   announced as a button — styled back to looking like a heading. */
.druid-access-group {
    display: flex;
    align-items: center;
    gap: .5rem;
    width: 100%;
    padding: .75rem 1.25rem;
    background: none;
    border: 0;
    font: inherit;
    color: var(--acumy-ink);
    text-align: left;
    cursor: pointer;
}

.druid-access-group:hover { background: #F8FAFC; }

.druid-access-group__name {
    font-size: .9375rem;
    font-weight: 600;
}

.druid-access-group__state {
    margin-left: auto;
    margin-top: 0;
}

.druid-access-table th.druid-access__col,
.druid-access-table td.druid-access__col {
    width: 8.5rem;
    text-align: center;
}

.druid-access__colhead {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .125rem;
}

.druid-access-table td.druid-access__col .acumy-status-pill {
    display: block;
    margin: .125rem auto 0;
    width: fit-content;
}

.druid-access-bulk {
    display: flex;
    align-items: center;
    gap: .5rem;
    flex-wrap: wrap;
    margin-top: .75rem;
    padding-top: .75rem;
    border-top: 1px solid var(--acumy-hairline);
}

.druid-access-bulk .acumy-panel-caption { margin-top: 0; }

/* A foreign key in a grid cell: the target's label, and the way into that record. Underlined on
   hover only — 237 foreign keys means a permanently underlined grid. */
.druid-fk {
    color: var(--acumy-blue);
    text-decoration: none;
}

.druid-fk:hover { text-decoration: underline; }

/* ── DRUID record dialog ──────────────────────────────────────────────────────────────────────
   A record over the list it was opened from. The list is still mounted underneath — see
   DruidRoutes for why that is a query string and not a path. Sized as the old DRUIDDialog was. */

.druid-dialog {
    position: fixed;
    inset: 0;
    z-index: 1400;
    display: flex;
    align-items: center;
    justify-content: center;
}

.druid-dialog__scrim {
    position: absolute;
    inset: 0;
    background: rgba(15, 23, 42, .45);
}

.druid-dialog__frame {
    position: relative;
    display: flex;
    flex-direction: column;
    width: min(1600px, 96vw);
    height: min(900px, 92vh);
    background: var(--acumy-surface);
    border-radius: 12px;
    box-shadow: 0 24px 64px rgba(15, 23, 42, .28);
    overflow: hidden;

    /* Resizable, as the old dialog was. Dragging needs script and the frame is centred, so it is
       not here — noted in docs/05-druid.md rather than half-built. */
    resize: both;
    min-width: 40rem;
    min-height: 20rem;
    max-width: 98vw;
    max-height: 96vh;
}

.druid-dialog__head {
    display: flex;
    align-items: center;
    gap: .5rem;
    padding: .625rem .75rem .625rem 1rem;
    border-bottom: 1px solid var(--acumy-hairline);
    background: var(--acumy-surface);
}

.druid-dialog__actions {
    margin-left: auto;
    display: flex;
    align-items: center;
    gap: .25rem;
}

.druid-dialog__body {
    flex: 1 1 auto;
    overflow: auto;
    padding: 1.25rem;
    background: var(--acumy-ground);
}

/* The trail. Wraps rather than scrolls: a breadcrumb you have to scroll to read is one you cannot
   use to get back. */
.druid-crumbs {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .25rem .375rem;
    min-width: 0;
}

.druid-crumbs__sep { color: var(--acumy-ink-faint); }

.druid-crumbs__link {
    background: none;
    border: 0;
    padding: 0;
    font: inherit;
    color: var(--acumy-blue);
    cursor: pointer;
}

.druid-crumbs__link:hover { text-decoration: underline; }

.druid-crumbs__here {
    font-weight: 600;
    color: var(--acumy-ink);
}

/* A foreign key rendered as a button, so it looks and reads exactly like the link it replaces. */
.druid-fk--button {
    background: none;
    border: 0;
    padding: 0;
    font: inherit;
    cursor: pointer;
    text-align: left;
}

/* A list inside a record inside the dialog. No page chrome, and a heading rather than a title. */
.druid-embedded__head {
    display: flex;
    align-items: center;
    gap: .5rem;
    margin-bottom: .5rem;
}

.druid-embedded__title {
    font-size: .875rem;
    font-weight: 600;
    color: var(--acumy-ink);
}

.druid-embedded__actions { margin-left: auto; }

/* A read-only foreign key on a form: label above, value below, like the controls beside it. */
.druid-form-field { display: flex; flex-direction: column; gap: .25rem; }

/* The column chooser. A scrolling list, because CloudResource offers 23 and a menu taller than the
   window cannot reach its own Reset button. */
.druid-toolbar__cell--columns { margin-left: auto; }

.druid-columns {
    min-width: 16rem;
    max-height: 60vh;
    overflow-y: auto;
    padding: .25rem .5rem .5rem;
}

.druid-columns__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: .25rem .25rem .375rem;
    border-bottom: 1px solid var(--acumy-hairline);
    margin-bottom: .25rem;
    position: sticky;
    top: 0;
    background: var(--acumy-surface);
}

.druid-columns__head .acumy-panel-caption { margin-top: 0; }

.druid-columns__item { display: block; }

.druid-columns__caption { margin-right: .375rem; }

/* The chooser panel is anchored to its button and closed by a transparent scrim behind it. */
.druid-toolbar__cell--columns { position: relative; }

.druid-columns__scrim {
    position: fixed;
    inset: 0;
    z-index: 30;
}

.druid-columns {
    position: absolute;
    top: calc(100% + .25rem);
    right: 0;
    z-index: 31;
    background: var(--acumy-surface);
    border: 1px solid var(--acumy-hairline);
    border-radius: 8px;
    box-shadow: 0 12px 32px rgba(15, 23, 42, .16);
}

.druid-columns__item {
    display: flex;
    align-items: center;
    gap: .5rem;
    padding: .25rem;
    cursor: pointer;
    white-space: nowrap;
}

.druid-columns__item:hover { background: #F8FAFC; }

/* ── Row selection, row actions, delete confirmation ───────────────────────────────────────── */

.druid-table__pick { width: 2.75rem; text-align: center; }

.druid-table__tr--picked td { background: var(--acumy-blue-tint); }

.druid-row-actions {
    display: flex;
    align-items: center;
    gap: .125rem;
    justify-content: flex-end;
}

/* Appears only when something is selected — a bar reading "0 selected" is furniture. */
.druid-selection {
    display: flex;
    align-items: center;
    gap: .75rem;
    flex-wrap: wrap;
    padding: .5rem 1.25rem;
    background: var(--acumy-blue-tint);
    border-bottom: 1px solid var(--acumy-hairline);
}

.druid-selection__count { font-weight: 600; }

.druid-selection .acumy-panel-caption { margin-top: 0; }

/* A confirmation is a small dialog, not the record-sized one. */
.druid-dialog__frame--confirm {
    width: min(40rem, 94vw);
    height: auto;
    max-height: 88vh;
    resize: none;
}

.druid-dialog__foot {
    display: flex;
    align-items: center;
    gap: .5rem;
    padding: .75rem 1.25rem;
    border-top: 1px solid var(--acumy-hairline);
    background: var(--acumy-surface);
}

/* Acknowledged findings: collapsed at the foot of their group, never gone. */
.druid-acknowledged {
    border-top: 1px solid var(--acumy-hairline);
    background: #FCFDFE;
}

.druid-acknowledged__head {
    display: flex;
    align-items: center;
    gap: .375rem;
    width: 100%;
    padding: .5rem 1.25rem;
    background: none;
    border: 0;
    font: inherit;
    color: var(--acumy-ink-muted);
    text-align: left;
    cursor: pointer;
}

.druid-acknowledged__head:hover { background: #F8FAFC; }

.druid-acknowledged__list {
    list-style: none;
    margin: 0;
    padding: 0 1.25rem .75rem 2.5rem;
}

.druid-acknowledged__list li {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
    padding: .375rem 0;
    border-top: 1px solid var(--acumy-hairline);
}

.druid-acknowledged__list li .acumy-panel-caption { margin-top: 0; flex: 1 1 20rem; }

.druid-acknowledge {
    display: flex;
    align-items: center;
    gap: .5rem;
    flex-wrap: wrap;
    margin-top: .5rem;
    max-width: 34rem;
}

/* Many-to-many: the rows of another table, ticked where a junction row exists. A tick list is
   taller and wider than a field, so it takes the whole form row rather than a grid cell. */
.druid-form-cell--wide {
    grid-column: 1 / -1;
}

.druid-m2m__search {
    display: flex;
    align-items: center;
    gap: .5rem;
    margin-bottom: .375rem;
}

.druid-m2m__search > .mud-input-control {
    flex: 1 1 14rem;
    min-width: 0;
}

.druid-m2m__bulk {
    flex: 0 0 auto;
    padding: .3125rem .625rem;
    font: inherit;
    font-size: .75rem;
    color: var(--acumy-accent, #2563eb);
    background: none;
    border: 1px solid var(--acumy-border, #dbe1ea);
    border-radius: .375rem;
    cursor: pointer;
}

.druid-m2m__bulk:hover:not(:disabled) {
    background: var(--acumy-surface-2, #f4f6fa);
}

.druid-m2m__bulk:disabled {
    color: var(--acumy-muted, #8a93a2);
    cursor: default;
}

/* Scrolls rather than growing: a 200-row target must not push the Save button off the page. */
.druid-m2m__list {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr));
    gap: .125rem .75rem;
    max-height: 18rem;
    overflow-y: auto;
    padding: .375rem .5rem;
    border: 1px solid var(--acumy-border, #dbe1ea);
    border-radius: .375rem;
    background: #fff;
}

.druid-m2m__item {
    display: flex;
    align-items: center;
    gap: .4375rem;
    min-width: 0;
    padding: .25rem .375rem;
    border-radius: .25rem;
    cursor: pointer;
}

.druid-m2m__item:hover {
    background: var(--acumy-surface-2, #f4f6fa);
}

.druid-m2m__item.is-ticked {
    background: var(--acumy-accent-soft, #eef4ff);
}

.druid-m2m__item > span,
.druid-m2m__item > a {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.druid-m2m__item mark {
    padding: 0 .1em;
    border-radius: .15rem;
    background: #fff3cd;
}

/* Raise an issue. Lives in the sidebar footer beside Sign out, because it belongs to every screen
   equally and somebody reporting a broken page should not have to hunt for it. */
.acumy-raise-issue {
    display: flex;
    align-items: center;
    gap: .5rem;
    width: 100%;
    padding: .375rem 0;
    font: inherit;
    font-size: .8125rem;
    color: inherit;
    background: none;
    border: 0;
    opacity: .75;
    cursor: pointer;
}

.acumy-raise-issue:hover {
    opacity: 1;
}

.acumy-raise__scrim {
    position: fixed;
    inset: 0;
    z-index: 1400;
    background: rgba(15, 23, 42, .32);
}

/* Anchored rather than centred: the point is to report the screen behind it, so it must not cover
   the thing being reported. */
.acumy-raise__panel {
    position: fixed;
    z-index: 1401;
    right: 1.5rem;
    bottom: 1.5rem;
    width: min(26rem, calc(100vw - 3rem));
    max-height: calc(100vh - 3rem);
    overflow-y: auto;
    padding: 1rem 1.125rem 1.125rem;
    background: #fff;
    border: 1px solid var(--acumy-border, #dbe1ea);
    border-radius: .625rem;
    box-shadow: 0 1.25rem 2.5rem rgba(15, 23, 42, .18);
}

.acumy-raise__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: .75rem;
}

.acumy-raise__close {
    padding: .125rem .375rem;
    font: inherit;
    color: var(--acumy-muted, #8a93a2);
    background: none;
    border: 0;
    cursor: pointer;
}

.acumy-raise__field {
    margin-bottom: .75rem;
}

.acumy-raise__field > label {
    display: block;
    margin-bottom: .1875rem;
    font-size: .75rem;
    font-weight: 600;
}

.acumy-raise__optional {
    font-weight: 400;
    color: var(--acumy-muted, #8a93a2);
}

.acumy-raise__note {
    margin-bottom: .875rem;
    font-size: .75rem;
    line-height: 1.35;
    color: var(--acumy-muted, #8a93a2);
}

.acumy-raise__actions {
    display: flex;
    align-items: center;
    gap: .5rem;
}

/* The issue log: triage and resolution. A workflow screen, so the list is dense and the row is
   the affordance — there is one thing to do to an issue and it is behind the row. */
.acumy-issue-row {
    cursor: pointer;
}

.acumy-issue-row:hover {
    background: var(--acumy-surface-2, #f4f6fa);
}

.acumy-issue-row.is-open {
    background: var(--acumy-accent-soft, #eef4ff);
}

/* Open and closed must not look alike — they need opposite things from the reader. Colour follows
   the IsTerminal flag on the row, never the status name. */
.acumy-issue-status {
    display: inline-block;
    padding: .0625rem .4375rem;
    font-size: .6875rem;
    font-weight: 600;
    border-radius: .625rem;
    white-space: nowrap;
}

.acumy-issue-status.is-open {
    color: #9a3412;
    background: #ffedd5;
}

.acumy-issue-status.is-closed {
    color: #3f6212;
    background: #ecfccb;
}

.acumy-issue-detail__scrim {
    position: fixed;
    inset: 0;
    z-index: 1400;
    background: rgba(15, 23, 42, .32);
}

.acumy-issue-detail {
    position: fixed;
    z-index: 1401;
    top: 0;
    right: 0;
    bottom: 0;
    width: min(38rem, 100vw);
    display: flex;
    flex-direction: column;
    background: #fff;
    border-left: 1px solid var(--acumy-border, #dbe1ea);
    box-shadow: -.75rem 0 2rem rgba(15, 23, 42, .14);
}

.acumy-issue-detail__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: .75rem;
    padding: 1rem 1.25rem;
    border-bottom: 1px solid var(--acumy-border, #dbe1ea);
}

.acumy-issue-detail__head > div {
    display: flex;
    flex-direction: column;
    gap: .375rem;
    min-width: 0;
}

.acumy-issue-detail__head strong {
    font-size: .9375rem;
    line-height: 1.3;
}

.acumy-issue-detail__body {
    flex: 1;
    overflow-y: auto;
    padding: 1rem 1.25rem 1.5rem;
}

.acumy-issue-facts {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: .25rem .875rem;
    margin: 0 0 1rem;
    font-size: .8125rem;
}

.acumy-issue-facts dt {
    font-weight: 600;
    color: var(--acumy-muted, #8a93a2);
    white-space: nowrap;
}

.acumy-issue-facts dd {
    margin: 0;
    min-width: 0;
    overflow-wrap: anywhere;
}

.acumy-issue-detail__section {
    margin-bottom: 1.25rem;
}

.acumy-issue-detail__section h3 {
    display: flex;
    align-items: baseline;
    gap: .5rem;
    margin: 0 0 .375rem;
    font-size: .6875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: var(--acumy-muted, #8a93a2);
}

.acumy-issue-detail__toggle {
    font: inherit;
    font-size: .6875rem;
    text-transform: none;
    letter-spacing: 0;
    color: var(--acumy-accent, #2563eb);
    background: none;
    border: 0;
    cursor: pointer;
}

.acumy-issue-detail__text {
    margin: 0;
    font-size: .8125rem;
    line-height: 1.5;
    white-space: pre-wrap;
}

/* One appended note. The rule down the left says where a note starts and ends without a box
   around every one of them — an issue with six notes should read as a thread, not as six cards. */
.acumy-issue-note {
    margin: 0 0 .75rem;
    padding-left: .625rem;
    border-left: 2px solid var(--acumy-border, #dbe1ea);
}

.acumy-issue-note .acumy-panel-caption {
    margin-bottom: .1875rem;
}

.acumy-issue-detail__context {
    max-height: 16rem;
    overflow: auto;
    margin: 0;
    padding: .625rem .75rem;
    font-size: .6875rem;
    line-height: 1.45;
    background: var(--acumy-surface-2, #f4f6fa);
    border-radius: .375rem;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}

/* ── Discover overview: the headline, the gaps, the tab cards ─────────────────────────────────────
   Added 22 Sep 2026. The page used to open with four infrastructure counts; it now opens with who
   the spend belongs to, and these are the three shapes that took. */

.acumy-headline {
    background: var(--acumy-surface);
    border: 1px solid var(--acumy-hairline);
    border-radius: 12px;
    padding: 1.5rem;
    margin-bottom: 1rem;
}

.acumy-headline__eyebrow {
    margin: 0 0 .5rem;
    font-size: .6875rem;
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--acumy-ink-faint);
}

.acumy-headline__line {
    margin: 0;
    font-size: 1.25rem;
    line-height: 1.35;
    color: var(--acumy-ink);
}

/* The number is the thing the eye should land on first, so it is the only oversized text here. */
.acumy-headline__figure {
    font-size: 2.25rem;
    font-weight: 600;
    line-height: 1;
    margin-right: .25rem;
}

.acumy-headline__detail {
    margin: .5rem 0 0;
    font-size: .8125rem;
    color: var(--acumy-ink-muted);
    max-width: 62ch;
}

/* Three across on a desktop, stacking on a phone. minmax(0,1fr) rather than 1fr so a long sentence
   cannot push a column wider than its share — the default min-content would. */
.acumy-gaps {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr));
    gap: 1rem;
    margin-top: 1.25rem;
    padding-top: 1.25rem;
    border-top: 1px solid var(--acumy-hairline);
}

.acumy-gap {
    display: flex;
    gap: .75rem;
    align-items: flex-start;
}

.acumy-gap__icon--amber { background: var(--acumy-amber-tint); color: var(--acumy-amber); }
.acumy-gap__icon--red   { background: var(--acumy-red-tint);   color: var(--acumy-red); }
.acumy-gap__icon--grey  { background: var(--acumy-grey-tint);  color: var(--acumy-grey); }

.acumy-gap__body { min-width: 0; }

.acumy-gap__figure {
    margin: 0;
    font-size: 1.5rem;
    font-weight: 600;
    line-height: 1.1;
    color: var(--acumy-ink);
}

.acumy-gap__label {
    margin: 0 0 .25rem;
    font-size: .8125rem;
    font-weight: 600;
    color: var(--acumy-ink);
}

.acumy-gap__detail {
    margin: 0 0 .375rem;
    font-size: .75rem;
    line-height: 1.45;
    color: var(--acumy-ink-muted);
}

/* ── Tab cards ───────────────────────────────────────────────────────────────────────────────── */

.acumy-tabcards {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr));
    gap: 1rem;
    margin-bottom: 1rem;
}

/* The whole card is the anchor, so the target is the card and not a link inside it. */
.acumy-tabcard {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: .375rem;
    background: var(--acumy-surface);
    border: 1px solid var(--acumy-hairline);
    border-radius: 12px;
    padding: 1rem;
    text-decoration: none;
    color: inherit;
    transition: border-color 120ms ease, box-shadow 120ms ease;
}

.acumy-tabcard:hover {
    border-color: var(--acumy-blue);
    box-shadow: 0 1px 6px rgb(15 23 42 / 8%);
}

.acumy-tabcard__icon { background: var(--acumy-blue-tint); color: var(--acumy-blue); }

.acumy-tabcard__label {
    font-size: .6875rem;
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--acumy-ink-faint);
}

.acumy-tabcard__figure {
    font-size: 1.5rem;
    font-weight: 600;
    line-height: 1.1;
    color: var(--acumy-ink);
}

.acumy-tabcard__context {
    font-size: .75rem;
    line-height: 1.4;
    color: var(--acumy-ink-muted);
}

/* ── Severity chip and the cells beside it ───────────────────────────────────────────────────── */

.acumy-sev {
    display: inline-block;
    width: .625rem;
    height: .625rem;
    border-radius: 50%;
    flex: 0 0 auto;
}

.acumy-sev--red   { background: var(--acumy-red); }
.acumy-sev--amber { background: var(--acumy-amber); }
.acumy-sev--grey  { background: var(--acumy-grey); }

.acumy-cell-stack { display: flex; flex-direction: column; line-height: 1.25; }

.acumy-cell-stack__main { font-size: .9375rem; font-weight: 600; color: var(--acumy-ink); }

.acumy-cell-stack__sub { font-size: .75rem; color: var(--acumy-ink-faint); }

.acumy-cell-quiet { font-size: .8125rem; color: var(--acumy-ink-muted); }

/* Amber and semibold because an empty owner is the gap this page is about, not a blank cell. */
.acumy-nobody { font-weight: 600; color: var(--acumy-amber); }

.acumy-table-footer {
    margin: 0;
    padding: .75rem 1rem;
    border-top: 1px solid var(--acumy-hairline);
    font-size: .8125rem;
    color: var(--acumy-ink-muted);
}

/* ── Right-hand drawer ───────────────────────────────────────────────────────────────────────────
   Used by Discover → Workspaces to show one workspace's resources over the list rather than
   instead of it. The list behind stays visible and keeps its scroll and its sort. */

.acumy-drawer {
    display: flex;
    flex-direction: column;
    max-width: 100vw;
}

.acumy-drawer__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.25rem;
    border-bottom: 1px solid var(--acumy-hairline);
    background: var(--acumy-surface);
    flex: 0 0 auto;
}

.acumy-drawer__label {
    display: block;
    font-size: .6875rem;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: var(--acumy-ink-muted);
}

.acumy-drawer__title h2 {
    margin: .125rem 0 0;
    font-size: 1.0625rem;
    font-weight: 600;
    color: var(--acumy-ink);
}

.acumy-drawer__context {
    margin: .25rem 0 .375rem;
    font-size: .8125rem;
    color: var(--acumy-ink-muted);
}

/* The body scrolls, the header does not. A drawer whose heading scrolls away stops saying which
   workspace its rows belong to, which is the one thing it is there to say. */
.acumy-drawer__body {
    flex: 1 1 auto;
    overflow-y: auto;
    padding: 1rem 1.25rem 2rem;
}

@media (max-width: 960px) {
    .acumy-drawer {
        width: 100% !important;
    }
}

/* A link that is also an action. Used where an href is the fallback and a handler does the real
   work — the count on Discover → Workspaces opens a drawer, and navigates if nothing catches it. */
.acumy-link {
    color: var(--acumy-blue);
    text-decoration: none;
    cursor: pointer;
    font: inherit;
}

button.acumy-link {
    background: none;
    border: 0;
    padding: 0;
}

.acumy-link:hover,
.acumy-link:focus-visible {
    text-decoration: underline;
}

/* ── Moving resources between workspaces ─────────────────────────────────────────────────────── */

.acumy-move {
    border-top: 1px solid var(--acumy-hairline);
    padding-top: .875rem;
}

.acumy-move__heading {
    margin: 0 0 .5rem;
    font-size: .8125rem;
    font-weight: 600;
    color: var(--acumy-ink);
}

/* The two kinds sit side by side so neither reads as the default. */
.acumy-move__kinds {
    display: flex;
    flex-wrap: wrap;
    gap: 1.25rem;
    margin: .5rem 0 .75rem;
}

.acumy-move__kind {
    display: flex;
    flex-direction: column;
    max-width: 26rem;
}

.acumy-move__limits {
    margin-top: .625rem;
}

/* ── A detail page: two hierarchies, main content and asides ─────────────────────────────────── */

.acumy-trails {
    margin-bottom: .75rem;
}

.acumy-trail {
    margin: 0 0 .25rem;
    font-size: .8125rem;
    color: var(--acumy-ink);
}

.acumy-trail__root,
.acumy-trail__sep,
.acumy-trail__aside {
    color: var(--acumy-ink-muted);
}

.acumy-trail__sep {
    margin: 0 .375rem;
}

.acumy-chips {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    margin-bottom: .75rem;
}

.acumy-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    align-items: center;
}

/* Main and aside. Collapses to one column before the aside gets too narrow to read. */
.acumy-detail {
    display: grid;
    grid-template-columns: minmax(0, 2fr) minmax(16rem, 1fr);
    gap: 1rem;
    align-items: start;
}

@media (max-width: 1100px) {
    .acumy-detail {
        grid-template-columns: 1fr;
    }
}

/* ── What does this tag mean ─────────────────────────────────────────────────────────────────────
   Board 3 of "Acumy — Tags, redesigned". Sizes are the board's; colours are the app's tokens. */
.acumy-meaning {
    width: min(1020px, calc(100vw - 32px));
    max-width: none !important;
    max-height: calc(100vh - 48px);
    border-radius: 12px !important;
    overflow-y: auto;
}

.acumy-meaning .mud-dialog-content {
    padding: 0 !important;
    margin: 0 !important;
}

.acumy-meaning code {
    font-family: ui-monospace, "Cascadia Mono", Consolas, monospace;
}

.acumy-meaning fieldset {
    margin: 0;
    padding: 0;
    border: 0;
}

.acumy-meaning legend {
    padding: 0;
    margin-bottom: 12px;
    font-size: 12.5px;
    font-weight: 700;
    letter-spacing: .7px;
    text-transform: uppercase;
    color: var(--acumy-ink-muted);
}

.acumy-meaning__head {
    position: relative;
    padding: 24px 30px 18px;
    border-bottom: 1px solid var(--acumy-hairline);
}

.acumy-meaning__close {
    position: absolute;
    top: 18px;
    right: 22px;
}

.acumy-meaning__head h2 {
    margin: 0 0 4px;
    font-size: 22px;
    font-weight: 600;
    color: var(--acumy-ink);
}

.acumy-meaning__head h2 code {
    font-size: 22px;
}

.acumy-meaning__head p {
    margin: 0;
    font-size: 13.5px;
    color: var(--acumy-ink-muted);
}

.acumy-meaning__cloud {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 16px;
    margin-bottom: 7px;
    font-size: 12.5px;
    color: var(--acumy-ink-muted);
}

.acumy-meaning__cloud-item {
    display: inline-flex;
    align-items: center;
    gap: 9px;
}

.acumy-meaning__section {
    padding: 22px 30px 4px;
}

.acumy-meaning__choices {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

@media (max-width: 760px) {
    .acumy-meaning__choices {
        grid-template-columns: 1fr;
    }
}

.acumy-meaning__choice {
    display: flex;
    gap: 11px;
    padding: 14px 15px;
    border: 1px solid var(--acumy-hairline);
    border-radius: 9px;
    background: var(--acumy-surface);
    cursor: pointer;
}

/* Selected is shown by the border, not only by the radio dot. The border width does not change,
   so choosing does not shift the grid. */
.acumy-meaning__choice.is-selected {
    border-color: var(--acumy-blue);
    box-shadow: inset 0 0 0 1px var(--acumy-blue);
    background: var(--acumy-blue-tint);
}

.acumy-meaning__choice input,
.acumy-meaning__scope input {
    width: 16px;
    height: 16px;
    margin: 2px 0 0;
    flex-shrink: 0;
}

.acumy-meaning__choice-name {
    display: block;
    margin-bottom: 3px;
    font-size: 14px;
    font-weight: 600;
    color: var(--acumy-ink);
}

.acumy-meaning__choice-text,
.acumy-meaning__scope-text {
    display: block;
    font-size: 12.5px;
    color: var(--acumy-ink-muted);
}

.acumy-meaning__scopes {
    display: flex;
    flex-wrap: wrap;
    gap: 14px 26px;
}

.acumy-meaning__scope {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    cursor: pointer;
}

.acumy-meaning__scope-name {
    display: block;
    font-size: 13.5px;
    font-weight: 600;
    color: var(--acumy-ink);
}

.acumy-meaning__note {
    margin: 12px 0 0;
    font-size: 12.5px;
    color: var(--acumy-ink-muted);
}

/* A tag's Edit: Links to, then Purpose and Required side by side (tags small fixes 3, item 1). */
.acumy-tag-edit legend {
    margin-bottom: 8px;
    font-weight: 600;
}

.acumy-tag-edit .acumy-meaning__choice {
    padding: 10px 12px;
}

.acumy-tag-edit__row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 24px;
    align-items: start;
}

@media (max-width: 760px) {
    .acumy-tag-edit__row {
        grid-template-columns: 1fr;
    }
}

.acumy-meaning__note--foot {
    margin: 0;
    padding: 0 30px 16px;
    text-align: right;
}

.acumy-meaning__dry-run {
    margin: 20px 30px 0;
    border: 1px solid var(--acumy-hairline);
    border-radius: 10px;
    background: var(--acumy-ground);
}

.acumy-meaning__dry-run-head {
    padding: 16px 20px 12px;
    border-bottom: 1px solid var(--acumy-hairline);
}

.acumy-meaning__dry-run-head h3 {
    margin: 0 0 3px;
    font-size: 15px;
    font-weight: 600;
    color: var(--acumy-ink);
}

.acumy-meaning__dry-run-head p,
.acumy-meaning__dry-run-words {
    margin: 0;
    font-size: 12.5px;
    color: var(--acumy-ink-muted);
}

.acumy-meaning__dry-run-words {
    padding: 16px 20px;
    font-size: 13.5px;
}

.acumy-meaning__figures + .acumy-meaning__dry-run-words {
    padding-top: 0;
}

.acumy-meaning__figures {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    padding: 16px 20px;
}

@media (max-width: 760px) {
    .acumy-meaning__figures {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* One ink for all four. A colour here would be Acumy judging the estate. */
.acumy-meaning__figure {
    font-size: 24px;
    font-weight: 600;
    color: var(--acumy-ink);
}

.acumy-meaning__figure-text {
    font-size: 12.5px;
    color: var(--acumy-ink-muted);
}

.acumy-meaning__error {
    margin: 16px 30px 0;
}

.acumy-meaning__foot {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 16px 24px;
    margin-top: 20px;
    padding: 16px 30px;
    border-top: 1px solid var(--acumy-hairline);
    background: var(--acumy-ground);
}

.acumy-meaning__foot p {
    margin: 0;
    font-size: 12.5px;
    color: var(--acumy-ink-muted);
}

.acumy-meaning__buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.acumy-meaning__button {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 44px;
    padding: 0 16px;
    border: 1px solid var(--acumy-hairline);
    border-radius: 6px;
    background: var(--acumy-surface);
    font: inherit;
    font-size: 13.5px;
    font-weight: 600;
    color: var(--acumy-ink);
    cursor: pointer;
}

.acumy-meaning__button:disabled {
    opacity: .5;
    cursor: default;
}

.acumy-meaning__button--primary {
    border-color: var(--acumy-blue);
    background: var(--acumy-blue);
    color: #FFFFFF;
}

a.acumy-meaning__button {
    text-decoration: none;
}

.acumy-meaning__button.is-pressed {
    border-color: var(--acumy-blue);
    background: var(--acumy-blue-tint);
    color: var(--acumy-blue);
}

.acumy-meaning__suggested {
    margin-left: 6px;
    padding: 1px 6px;
    border-radius: 4px;
    background: var(--acumy-blue-tint);
    font-size: 11px;
    font-weight: 600;
    color: var(--acumy-blue);
}

/* ── Tags page (board 1) ─────────────────────────────────────────────────────────────────────── */

/* The Means cell. A button, because it opens something. Three states that must not look alike:
   answered, suggested, and nothing yet. */
.acumy-means {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 32px;
    padding: 4px 11px;
    border: 1px solid var(--acumy-hairline);
    border-radius: 6px;
    background: var(--acumy-surface);
    font: inherit;
    font-size: 13px;
    color: var(--acumy-ink-muted);
    cursor: pointer;
    text-align: left;
}

.acumy-means:hover {
    border-color: var(--acumy-blue);
}

.acumy-means--set {
    border-color: transparent;
    background: var(--acumy-grey-tint);
    font-weight: 600;
    color: var(--acumy-ink);
}

.acumy-means--suggested {
    border-color: var(--acumy-blue);
    background: var(--acumy-blue-tint);
    font-weight: 600;
    color: var(--acumy-blue);
}

/* A count that opens its breakdown. Looks like a link, because it is one. */
.acumy-count {
    padding: 0;
    border: 0;
    border-bottom: 1px dotted var(--acumy-blue);
    background: none;
    font: inherit;
    font-weight: 600;
    color: var(--acumy-blue);
    cursor: pointer;
}

.acumy-count:hover {
    border-bottom-style: solid;
}

/* A status pill that opens what it counts. */
.acumy-pill-button {
    border: 0;
    font: inherit;
    cursor: pointer;
    text-decoration: underline dotted;
}

    .acumy-pill-button:hover { text-decoration-style: solid; }
    .acumy-pill-button:focus-visible { outline: 2px solid var(--acumy-blue); outline-offset: 1px; }

.acumy-tag-key {
    font-size: 13px;
    font-weight: 600;
    color: var(--acumy-ink);
}

/* A key that opens its drill-down: visibly a link. */
.acumy-tag-key--link {
    color: var(--acumy-blue);
    text-decoration: underline dotted;
}

    button:hover > .acumy-tag-key--link { text-decoration-style: solid; }

.acumy-cloud-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--acumy-ink-muted);
}

.acumy-cloud-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 3px;
    border-bottom: 1px solid var(--acumy-hairline);
}

.acumy-cloud-tabs__tab {
    min-height: 40px;
    padding: 0 16px;
    border: 0;
    border-bottom: 2px solid transparent;
    background: transparent;
    font: inherit;
    font-size: 13.5px;
    color: var(--acumy-ink-muted);
    cursor: pointer;
}

.acumy-cloud-tabs__tab.is-current {
    border-bottom-color: var(--acumy-blue);
    font-weight: 600;
    color: var(--acumy-ink);
}

.acumy-policy {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding: 1rem;
    border: 1px solid var(--acumy-hairline);
    border-radius: 12px;
    background: var(--acumy-ground);
}

.acumy-tag-charts {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 18px;
}

.acumy-chart {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 18px;
}

.acumy-donut {
    flex-shrink: 0;
}

.acumy-donut__figure {
    font-size: 23px;
    font-weight: 600;
    fill: var(--acumy-ink);
}

.acumy-donut__caption {
    font-size: 11px;
    fill: var(--acumy-ink-muted);
}

.acumy-legend {
    display: flex;
    flex-direction: column;
    gap: 9px;
    margin: 0;
    padding: 0;
    list-style: none;
    font-size: 13px;
    color: var(--acumy-ink);
}

.acumy-legend li {
    display: flex;
    align-items: center;
    gap: 8px;
}

.acumy-legend__swatch {
    width: 11px;
    height: 11px;
    border-radius: 2px;
    flex-shrink: 0;
}

.acumy-legend__value {
    font-weight: 600;
}

.acumy-bars {
    display: flex;
    flex-direction: column;
    gap: 11px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.acumy-bars__label {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 4px;
    font-size: 12.5px;
    color: var(--acumy-ink);
}

.acumy-bars__track {
    height: 9px;
    border-radius: 4px;
    background: var(--acumy-grey-tint);
}

.acumy-bars__bar {
    height: 9px;
    border-radius: 4px;
    background: var(--acumy-series-7);
}

/* ── Connection wipe: the body scrolls, the confirm footer never does ───────────────────────────── */
.acumy-wipe {
    max-height: calc(100vh - 48px) !important;
    display: flex !important;
    flex-direction: column;
    overflow: hidden !important;
}

/* min-height:0 lets the flex child shrink so its own overflow engages; see .acumy-dialog above. */
.acumy-wipe .mud-dialog-content {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
}

.acumy-wipe .mud-dialog-title,
.acumy-wipe .mud-dialog-actions {
    flex: 0 0 auto;
}

.acumy-wipe .mud-dialog-actions {
    border-top: 1px solid var(--acumy-hairline);
    background: var(--acumy-surface);
}

.acumy-wipe__foot {
    width: 100%;
    padding: 4px 8px;
}

.acumy-wipe__buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.acumy-wipe__blocker {
    margin: 0 0 10px;
}

/* ── Every count opens (board 2) ─────────────────────────────────────────────────────────────── */
.acumy-drill {
    width: min(1100px, calc(100vw - 32px));
    max-width: none !important;
    max-height: calc(100vh - 48px);
    border-radius: 12px !important;
    overflow-y: auto;
}

.acumy-drill .mud-dialog-content {
    padding: 0 !important;
    margin: 0 !important;
}

.acumy-drill code {
    font-family: ui-monospace, "Cascadia Mono", Consolas, monospace;
}

.acumy-drill__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
    padding: 22px 28px 16px;
    border-bottom: 1px solid var(--acumy-hairline);
}

.acumy-drill__trail {
    display: flex;
    align-items: center;
    gap: 9px;
    margin-bottom: 6px;
    font-size: 12.5px;
    color: var(--acumy-ink-muted);
}

.acumy-drill__sep {
    color: var(--acumy-ink-faint);
}

.acumy-drill__title {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 12px;
    font-size: 14px;
    color: var(--acumy-ink-muted);
}

.acumy-drill__title h2 {
    margin: 0;
    font-size: 22px;
    font-weight: 600;
    color: var(--acumy-ink);
}

.acumy-drill__title h2 code {
    font-size: 22px;
}

.acumy-drill__close {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 44px;
    height: 44px;
    border: 1px solid var(--acumy-hairline);
    border-radius: 6px;
    background: var(--acumy-surface);
    color: var(--acumy-ink-muted);
    cursor: pointer;
}

.acumy-drill__tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 3px;
    padding: 0 28px;
    border-bottom: 1px solid var(--acumy-hairline);
}

.acumy-drill__tab {
    min-height: 42px;
    padding: 0 14px;
    border: 0;
    border-bottom: 2px solid transparent;
    background: transparent;
    font: inherit;
    font-size: 13.5px;
    color: var(--acumy-ink-muted);
    cursor: pointer;
}

.acumy-drill__tab.is-current {
    border-bottom-color: var(--acumy-blue);
    font-weight: 600;
    color: var(--acumy-ink);
}

.acumy-drill__body {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 28px;
    padding: 22px 28px 20px;
}

.acumy-drill__ring {
    flex-shrink: 0;
}

.acumy-drill__table {
    flex: 1 1 420px;
    border-collapse: collapse;
    font-size: 13.5px;
}

.acumy-drill__table th {
    padding: 8px 12px;
    border-bottom: 1px solid var(--acumy-hairline);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .8px;
    text-align: left;
    text-transform: uppercase;
    color: var(--acumy-ink-muted);
}

.acumy-drill__table td {
    padding: 11px 12px;
    border-bottom: 1px solid var(--acumy-grey-tint);
    vertical-align: top;
    color: var(--acumy-ink-muted);
}

.acumy-drill__table th:first-child,
.acumy-drill__table td:first-child {
    padding-left: 0;
}

.acumy-drill__table .is-number {
    text-align: right;
}

.acumy-drill__table .is-strong {
    font-weight: 600;
    color: var(--acumy-ink);
}

.acumy-drill__table .is-link {
    text-align: right;
    white-space: nowrap;
}

.acumy-drill__table a {
    font-size: 13px;
    font-weight: 600;
    color: var(--acumy-blue);
    text-decoration: none;
}

.acumy-drill__table a:hover {
    text-decoration: underline;
}

.acumy-drill__label {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    color: var(--acumy-ink);
}

.acumy-drill__swatch {
    width: 11px;
    height: 11px;
    border-radius: 2px;
    flex-shrink: 0;
}

.acumy-drill__note {
    margin: 3px 0 0 20px;
    font-size: 12px;
    color: var(--acumy-ink-muted);
}

.acumy-drill__foot {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 16px 24px;
    padding: 16px 28px;
    border-top: 1px solid var(--acumy-hairline);
    background: var(--acumy-ground);
}

.acumy-drill__foot p {
    margin: 0;
    font-size: 12.5px;
    color: var(--acumy-ink-muted);
}

.acumy-drill__buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.acumy-visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
}

.acumy-drill__note-inline {
    color: var(--acumy-ink-faint);
}

/* Values naming a workspace that does not exist: a proposal, set apart from the breakdown above. */
.acumy-drill__create {
    margin: 0 28px 20px;
    padding: 16px 20px;
    border: 1px solid var(--acumy-hairline);
    border-radius: 10px;
    background: var(--acumy-ground);
    font-size: 13.5px;
    color: var(--acumy-ink);
}

.acumy-drill__create h3 {
    margin: 0 0 4px;
    font-size: 15px;
    font-weight: 600;
}

.acumy-drill__create p {
    margin: 0 0 10px;
    color: var(--acumy-ink-muted);
}

.acumy-drill__proposal .is-tick {
    width: 28px;
}

.acumy-drill__name {
    width: 100%;
    min-width: 160px;
    padding: 5px 8px;
    border: 1px solid var(--acumy-hairline);
    border-radius: 6px;
    background: var(--acumy-surface);
    font: inherit;
    color: var(--acumy-ink);
}

.acumy-drill__row-create {
    min-height: 32px;
    padding: 0 12px;
}

.acumy-drill__create .acumy-drill__table {
    width: 100%;
}

.acumy-drill__limits {
    margin: 10px 0 0;
    font-size: 12.5px;
}

/* ── The one grid, EntityTable — docs/10-navigation.md ───────────────────────────────────────────────────────────
   One toolbar and one table for every list. Flat and grouped share the header and the row style;
   a group is a header row between rows, not a different component. */

.acumy-grid__toolbar {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .5rem .75rem;
    padding: .75rem 1rem;
    border-bottom: 1px solid var(--acumy-hairline);
}

    .acumy-grid__toolbar .acumy-grid__search {
        flex: 1 1 18rem;
        max-width: 28rem;
    }

.acumy-grid__tool {
    display: inline-flex;
    align-items: center;
    gap: .25rem;
    padding: .375rem .625rem;
    border: 1px solid var(--acumy-hairline);
    border-radius: 6px;
    background: var(--acumy-surface);
    color: var(--acumy-ink);
    font: inherit;
    font-size: .8125rem;
    cursor: pointer;
}

    .acumy-grid__tool:hover:not(:disabled) { background: var(--acumy-grey-tint); }
    .acumy-grid__tool:disabled { color: var(--acumy-ink-faint); cursor: default; }

.acumy-grid__tool--on {
    border-color: var(--acumy-blue);
    background: var(--acumy-blue-tint);
    color: var(--acumy-blue);
}

.acumy-grid__working {
    display: inline-flex;
    align-items: center;
    gap: .375rem;
    color: var(--acumy-ink-muted);
    font-size: .8125rem;
}

.acumy-grid__panel {
    padding: .75rem 1rem;
    border-bottom: 1px solid var(--acumy-hairline);
    background: #F8FAFC;
}

.acumy-grid__panel-heading {
    margin: .25rem 0 .375rem;
    color: var(--acumy-ink-muted);
    font-size: .6875rem;
    font-weight: 600;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.acumy-grid__options {
    display: flex;
    flex-wrap: wrap;
    gap: .375rem;
    margin-bottom: .5rem;
}

.acumy-grid__option {
    display: inline-flex;
    align-items: center;
    gap: .375rem;
    padding: .25rem .625rem;
    border: 1px solid var(--acumy-hairline);
    border-radius: 999px;
    background: var(--acumy-surface);
    color: var(--acumy-ink);
    font: inherit;
    font-size: .8125rem;
    cursor: pointer;
}

    .acumy-grid__option:hover:not(:disabled) { border-color: var(--acumy-blue); }
    .acumy-grid__option:disabled { color: var(--acumy-ink-faint); cursor: default; }

.acumy-grid__option--on {
    border-color: var(--acumy-blue);
    background: var(--acumy-blue-tint);
}

.acumy-grid__option-count {
    color: var(--acumy-ink-muted);
    font-size: .75rem;
}

.acumy-grid__level {
    display: inline-flex;
    align-items: center;
    gap: .375rem;
    padding: .25rem .5rem .25rem .625rem;
    border-radius: 999px;
    background: var(--acumy-blue-tint);
    color: var(--acumy-blue);
    font-size: .8125rem;
}

.acumy-grid__level-remove {
    border: 0;
    background: none;
    color: inherit;
    font-size: 1rem;
    line-height: 1;
    cursor: pointer;
}

.acumy-grid__check {
    display: inline-flex;
    align-items: center;
    gap: .375rem;
    margin-right: .75rem;
    font-size: .8125rem;
}

.acumy-grid__chips {
    display: flex;
    flex-wrap: wrap;
    gap: .25rem;
    padding: .5rem 1rem;
    border-bottom: 1px solid var(--acumy-hairline);
}

.acumy-grid__table {
    width: 100%;
    border-collapse: collapse;
    font-size: .8125rem;
}

    .acumy-grid__table th {
        background: #F8FAFC;
        border-bottom: 1px solid var(--acumy-hairline);
        text-align: left;
        white-space: nowrap;
        padding: 0;
    }

    .acumy-grid__table td {
        padding: .5rem .75rem;
        border-bottom: 1px solid var(--acumy-hairline);
        color: var(--acumy-ink);
        vertical-align: top;
    }

    .acumy-grid__table tbody tr:hover td { background: #F8FAFC; }

    .acumy-grid__table .acumy-row--retired td { color: var(--acumy-ink-muted); }

    .acumy-grid__table .acumy-row--out-of-scope td { color: var(--acumy-ink-muted); }

.acumy-grid__th--sorted { background: var(--acumy-blue-tint) !important; }

.acumy-grid__sort,
.acumy-grid__th {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: .25rem;
    width: 100%;
    padding: .5rem .75rem;
    border: 0;
    background: none;
    color: var(--acumy-ink-muted);
    font: inherit;
    font-size: .6875rem;
    font-weight: 600;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.acumy-grid__sort { cursor: pointer; }
.acumy-grid__sort:hover { color: var(--acumy-ink); }

.acumy-grid__sort-order {
    color: var(--acumy-blue);
    font-size: .625rem;
}

.acumy-grid__select { width: 2.25rem; text-align: center; }
.acumy-grid__row--link { cursor: pointer; }
.acumy-grid__table th.acumy-grid__select { padding: .5rem 0; text-align: center; }

/* Rows under a group are indented by their depth, on the first column only. */
.acumy-grid__table td.acumy-grid__first {
    padding-left: calc(.75rem + var(--acumy-grid-depth, 0) * 1.25rem);
}

.acumy-grid__group td {
    background: var(--acumy-grey-tint);
    vertical-align: middle;
}

/* Grouped and tickable: the group's tick box sits after its chevron, and each row's tick box starts
   its first cell. The chevron (1.25rem) plus the gap (.5rem) plus the group's .25rem padding is the
   extra .75rem + 1.25rem a row is indented by, so the boxes line up. */
.acumy-grid__group-label {
    white-space: nowrap;
}

.acumy-grid__group-label > * {
    vertical-align: middle;
}

.acumy-grid__group-tick {
    margin: 0 .5rem 0 .5rem;
}

/* Said when a group's tick took fewer rows than the group holds. */
.acumy-grid__note {
    margin: .5rem 1rem;
}

.acumy-grid__ticked {
    display: flex;
    align-items: flex-start;
    gap: .5rem;
}

.acumy-grid__ticked > input {
    margin: .2rem 0 0;
    flex: 0 0 auto;
}

/* Where a row that cannot be ticked would have its box, so its text lines up with the rest. */
.acumy-grid__tick-gap {
    flex: 0 0 13px;
}

.acumy-grid__group-label {
    padding-left: calc(.25rem + var(--acumy-grid-depth, 0) * 1.25rem) !important;
}

.acumy-grid__toggle {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    border: 0;
    background: none;
    color: var(--acumy-ink);
    font: inherit;
    cursor: pointer;
    text-align: left;
}

.acumy-grid__group-field {
    color: var(--acumy-ink-muted);
    font-size: .75rem;
}

.acumy-grid__group-count {
    color: var(--acumy-ink-muted);
    font-size: .75rem;
}

.acumy-grid__more td {
    padding-left: calc(.75rem + var(--acumy-grid-depth, 0) * 1.25rem);
    color: var(--acumy-ink-muted);
}

.acumy-grid__pager {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: .75rem;
    padding: .625rem 1rem;
    color: var(--acumy-ink-muted);
    font-size: .8125rem;
}

/* The one grid (usability 4, item 1). A band is drawn the Workspaces way: grey, icon, bold name, a short detail, its
   total on the right; the chevron opens and closes it. The rows under it are indented and keep the columns. */
.acumy-grid__band td {
    background: var(--acumy-grey-tint);
    padding: .5rem .75rem .5rem calc(.25rem + var(--acumy-grid-depth, 0) * 1.25rem);
    border-bottom: 1px solid var(--acumy-hairline);
    vertical-align: middle;
}

.acumy-grid__table tbody tr.acumy-grid__band:hover td { background: var(--acumy-grey-tint); }

.acumy-grid__band-line { display: flex; align-items: center; gap: .5rem; min-width: 0; }
.acumy-grid__band-name { gap: .375rem; font-size: .875rem; min-width: 0; }
.acumy-grid__band-name strong, .acumy-grid__band-label { font-weight: 600; }
.acumy-grid__band-icon { color: var(--acumy-ink-muted); }
.acumy-grid__band-detail { color: var(--acumy-ink-muted); font-weight: 400; font-size: .8125rem; white-space: nowrap; }
.acumy-grid__band-total { font-weight: 600; white-space: nowrap; }
.acumy-grid__band-total + .acumy-grid__band-total { margin-left: 1rem; }

/* A row's first cell: its tick when grouped, then the tree's chevron or elbow, indented by the tree's depth. */
.acumy-grid__lead { display: flex; align-items: flex-start; gap: .375rem; padding-left: calc(var(--acumy-depth, 0) * 1.5rem); }
.acumy-grid__lead > input { margin: .2rem 0 0; flex: 0 0 auto; }
.acumy-grid__lead-cell { min-width: 0; }
.acumy-grid__elbow { width: 1.25rem; flex: 0 0 auto; text-align: center; color: var(--acumy-ink-faint); }

.acumy-grid__row--parent .acumy-row-link__name { font-weight: 700; }

/* A parent kept only because something under it matched. */
.acumy-grid__table .acumy-grid__row--context td { color: var(--acumy-ink-faint); }

.acumy-grid__table .acumy-grid__row--ticked td { background: var(--acumy-blue-tint); }

/* The row icons stay in view while a wide table scrolls sideways. */
.acumy-grid__table th.acumy-row-icons,
.acumy-grid__table td.acumy-row-icons {
    position: sticky;
    right: 0;
    width: 1%;
    white-space: nowrap;
    text-align: right;
    padding-right: .5rem;
    background: var(--acumy-surface);
}

.acumy-grid__table th.acumy-row-icons { background: #F8FAFC; }
.acumy-grid__table tbody tr:hover td.acumy-row-icons { background: #F8FAFC; }
.acumy-grid__table tbody tr.acumy-grid__row--ticked td.acumy-row-icons { background: var(--acumy-blue-tint); }

.acumy-grid__table th.acumy-num .acumy-grid__th { justify-content: flex-end; }

.acumy-grid--short .acumy-grid__table td { padding-top: .5rem; padding-bottom: .5rem; }
/* A short list in a peek: no column narrower than its text (tags small fixes 3, item 7). Figures and dates stay on one
   line; the first column wraps between words, never inside a name or an ID. */
.acumy-grid--short .acumy-grid__table th,
.acumy-grid--short .acumy-grid__table td { white-space: nowrap; }
.acumy-grid--short .acumy-grid__table td:first-child { white-space: normal; min-width: 10rem; }
.acumy-grid--short .acumy-grid__table td .acumy-mono,
.acumy-grid--short .acumy-grid__lead-cell { overflow-wrap: normal; }

/* Where a page sits, above its H1. */
.acumy-breadcrumbs {
    display: flex;
    align-items: center;
    gap: .375rem;
    margin-bottom: .25rem;
    color: var(--acumy-ink-muted);
    font-size: .8125rem;
}

    .acumy-breadcrumbs a { color: var(--acumy-blue); text-decoration: none; }
    .acumy-breadcrumbs a:hover { text-decoration: underline; }

.acumy-breadcrumbs__sep { color: var(--acumy-ink-faint); }

/* ── Suggestions and the Decide step — docs/10-navigation.md ──────────────────────────────────────
   A card waiting for the person is amber-edged: waiting-for-you must not look like finished. */

.acumy-suggestions__bar {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .5rem;
    margin-bottom: 1rem;
}

.acumy-suggestions__line {
    margin: 0 0 1rem;
    padding: .5rem .75rem;
    border-left: 3px solid var(--acumy-grey);
    background: var(--acumy-grey-tint);
    color: var(--acumy-ink-muted);
    font-size: .8125rem;
}

.acumy-suggestions__kind { margin-bottom: 1.5rem; }

.acumy-suggestions__heading {
    display: flex;
    align-items: baseline;
    gap: .75rem;
    margin: 0 0 .5rem;
    font-size: 1rem;
    font-weight: 600;
    color: var(--acumy-ink);
}

.acumy-suggestions__head {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: .25rem 1rem;
    margin: 0 0 .5rem;
}

.acumy-suggestions__head .acumy-suggestions__heading { margin: 0; }

.acumy-suggestions__total {
    font-size: .875rem;
    color: var(--acumy-ink);
}

.acumy-suggestions__total > div { display: flex; align-items: baseline; flex-wrap: wrap; gap: .5rem; }

.acumy-suggestion {
    margin-bottom: .75rem;
    padding: 1rem;
    border: 1px solid var(--acumy-hairline);
    border-radius: 8px;
    background: var(--acumy-surface);
}

.acumy-suggestion--open { border-left: 4px solid var(--acumy-amber); }

.acumy-suggestion__head {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .5rem;
    margin-bottom: .5rem;
}

.acumy-suggestion__kind {
    font-weight: 600;
    color: var(--acumy-ink);
}

.acumy-suggestion__why {
    margin: 0 0 .75rem;
    color: var(--acumy-ink);
    font-size: .875rem;
}

.acumy-suggestion__figures {
    display: flex;
    flex-wrap: wrap;
    gap: 1.5rem;
    margin-bottom: .5rem;
}

.acumy-suggestion__label {
    color: var(--acumy-ink-muted);
    font-size: .6875rem;
    font-weight: 600;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.acumy-suggestion__figure {
    font-size: 1.25rem;
    font-weight: 600;
}

.acumy-suggestion__types { max-width: 36rem; }

.acumy-suggestion__decide {
    margin-top: .75rem;
    padding-top: .75rem;
    border-top: 1px solid var(--acumy-hairline);
}

.acumy-suggestion__target { margin: 0 0 .5rem; }

.acumy-suggestion__field {
    display: flex;
    flex-direction: column;
    gap: .25rem;
    margin-bottom: .5rem;
    max-width: 28rem;
    font-size: .8125rem;
}

    .acumy-suggestion__field input,
    .acumy-suggestion__field select,
    .acumy-suggestion__field textarea {
        padding: .375rem .5rem;
        border: 1px solid var(--acumy-hairline);
        border-radius: 6px;
        font: inherit;
    }

.acumy-suggestion__actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .5rem;
    margin-top: .5rem;
}

.acumy-suggestion__outcome {
    margin: .5rem 0 0;
    font-size: .875rem;
}

.acumy-decide__heading {
    margin: 1rem 0 .5rem;
    font-size: .9375rem;
    font-weight: 600;
}

    .acumy-decide__heading:first-of-type { margin-top: 0; }

.acumy-decide__list {
    margin: 0 0 .5rem;
    padding-left: 1.25rem;
    font-size: .875rem;
}

    .acumy-decide__list li { margin-bottom: .25rem; }

.acumy-decide__later {
    display: flex;
    align-items: center;
    gap: .75rem;
    margin-top: 1rem;
}

/* An account's Unassigned row on Workspaces: not a workspace, the resources in none. */
.acumy-unassigned-row {
    display: inline-flex;
    align-items: center;
    gap: .375rem;
}

.acumy-unassigned-row__mark {
    color: var(--acumy-red);
}

/* ── The Organise plan (docs/10-navigation.md). A draft waits for the person, so its questions are amber. ── */
.acumy-organise__head {
    display: flex;
    align-items: center;
    gap: .75rem;
    margin-bottom: 1rem;
}

.acumy-organise__section {
    margin-bottom: 1.5rem;
}

.acumy-organise__section-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    margin-bottom: .5rem;
}

.acumy-organise__owner-all {
    display: flex;
    align-items: center;
    gap: .5rem;
    font-size: .8125rem;
    color: var(--acumy-ink-muted);
}

.acumy-organise__table {
    width: 100%;
    border-collapse: collapse;
    font-size: .8125rem;
}

    .acumy-organise__table th {
        text-align: left;
        font-weight: 500;
        color: var(--acumy-ink-muted);
        border-bottom: 1px solid var(--acumy-hairline);
        padding: .375rem .5rem;
    }

    .acumy-organise__table td {
        border-bottom: 1px solid var(--acumy-hairline);
        padding: .5rem;
        vertical-align: top;
    }

.acumy-organise__table select,
.acumy-organise__name,
.acumy-organise__owner-all select {
    padding: .3rem .5rem;
    border: 1px solid var(--acumy-hairline);
    border-radius: 6px;
    font: inherit;
    max-width: 100%;
}

.acumy-organise__name {
    width: 100%;
    min-width: 10rem;
}

.acumy-organise__tick {
    width: 4.5rem;
    text-align: center !important;
}

.acumy-organise__count {
    width: 6rem;
    text-align: right !important;
}

.acumy-organise__row--excluded td {
    color: var(--acumy-ink-faint);
}

.acumy-organise__question {
    border: 1px solid var(--acumy-amber);
    background: var(--acumy-amber-tint);
    border-radius: 8px;
    padding: .75rem 1rem;
    margin-bottom: 1rem;
}

.acumy-organise__question-text {
    margin: 0 0 .5rem;
}

.acumy-organise__question-actions {
    display: flex;
    gap: .5rem;
    margin-bottom: .5rem;
}

.acumy-organise__left {
    margin: 1rem 0;
}

.acumy-organise__actions {
    display: flex;
    align-items: center;
    gap: .75rem;
    flex-wrap: wrap;
}

@media (max-width: 720px) {
    .acumy-organise__table thead {
        display: none;
    }

    .acumy-organise__table tr {
        display: block;
        border-bottom: 1px solid var(--acumy-hairline);
    }

    .acumy-organise__table td {
        display: block;
        border: none;
        text-align: left !important;
        width: auto;
    }
}

/* A cloud named as [provider logo] Name. */
.acumy-cloud-label {
    display: inline-flex;
    align-items: center;
    gap: .375rem;
}

/* ── Boot frame: shown while the circuit connects, since nothing is prerendered ─────────────── */

.acumy-boot {
    position: fixed;
    inset: 0;
    z-index: 2000;
    display: flex;
    background: var(--acumy-ground);
}

.acumy-boot__sidebar {
    width: 240px;
    flex: none;
    background: var(--acumy-sidebar);
}

.acumy-brandmark {
    width: 1.5em;
    height: 1.5em;
    flex: none;
}

.acumy-boot__content {
    padding: 2rem;
    color: var(--acumy-ink-muted);
}

body:has([data-acumy-layout]) .acumy-boot {
    display: none;
}

/* ── Schedules: the week ahead and a schedule's day rows ─────────────────────────────────────── */

.acumy-week {
    display: grid;
    grid-template-columns: 12rem repeat(7, minmax(0, 1fr));
    column-gap: .375rem;
    row-gap: .75rem;
    align-items: center;
}

.acumy-week__head {
    font-size: .75rem;
    font-weight: 600;
    color: var(--acumy-ink-muted);
    text-align: center;
}

.acumy-week__name {
    font-size: .8125rem;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.acumy-week__cell {
    position: relative;
    height: 1.375rem;
    background: var(--acumy-grey-tint);
    border-radius: 4px;
    overflow: hidden;
}

.acumy-week__run {
    position: absolute;
    top: 0;
    bottom: 0;
    background: var(--acumy-neutral);
}

.acumy-week__now {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 2px;
    background: var(--acumy-red);
}

.acumy-week__key {
    display: inline-flex;
    align-items: center;
    gap: .375rem;
    font-size: .75rem;
    color: var(--acumy-ink-muted);
    margin-right: 1rem;
}

.acumy-week__swatch {
    width: .875rem;
    height: .5rem;
    border-radius: 3px;
}

.acumy-upcoming {
    display: flex;
    gap: .75rem;
    padding: .5625rem 0;
    border-top: 1px solid var(--acumy-hairline);
}

.acumy-upcoming__time {
    width: 3rem;
    font-weight: 700;
}

.acumy-runs {
    display: grid;
    grid-template-columns: 8rem 6rem 1.25rem 6rem minmax(0, 1fr) auto;
    column-gap: .625rem;
    row-gap: .625rem;
    align-items: center;
}

.acumy-figures {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
    gap: .875rem;
}

.acumy-figures__figure {
    font-size: 1.375rem;
    font-weight: 700;
}

.acumy-downtimes {
    display: grid;
    grid-template-columns: 10rem 6rem 1.5rem 10rem 6rem auto auto;
    column-gap: .625rem;
    row-gap: .625rem;
    align-items: center;
}

/* ── A row that opens a page ─────────────────────────────────────────────────────────────────────
   The app's one pattern: the whole row is the link, every line of every cell. Pointer, hover, the
   name styled as a link, and a chevron at the right end. A control inside the row stops its own click.
   EntityTable takes a RowHref; a hand-made table or list uses these classes. */

.acumy-row-link {
    cursor: pointer;
}

.acumy-row-link:hover,
.acumy-row-link:hover > td,
tr.acumy-row-link:hover td {
    background: var(--acumy-accent-soft);
}

.acumy-row-link__name {
    color: var(--acumy-blue);
    font-weight: 600;
    text-decoration: none;
}

.acumy-row-link:hover .acumy-row-link__name {
    text-decoration: underline;
}

.acumy-row-link__chevron {
    width: 1.5rem;
    text-align: right;
    color: var(--acumy-ink-faint);
    font-size: 1.25rem;
    line-height: 1;
}

/* A list of rows, not a table: the same pattern on a flex row. */
.acumy-row-link.acumy-upcoming {
    border-radius: 6px;
    padding-left: .5rem;
    padding-right: .5rem;
}

/* ── Organisation structure and spend limits (db/changes/150, 151) ─────────────────────────────── */

/* The tree on the left, the selected group on the right. */
.acumy-orgsplit {
    display: grid;
    grid-template-columns: minmax(260px, 1fr) minmax(0, 2fr);
    gap: 1rem;
    align-items: start;
    margin-bottom: 1.25rem;
}

.acumy-orgsplit > * { min-width: 0; }
.acumy-orgsplit > div > .acumy-panel { margin-bottom: 1rem; }

.acumy-orgsplit--wide-left { grid-template-columns: minmax(0, 3fr) minmax(280px, 2fr); }

@media (max-width: 900px) {
    .acumy-orgsplit, .acumy-orgsplit--wide-left { grid-template-columns: 1fr; }
}

.acumy-orgtree {
    list-style: none;
    margin: 0;
    padding: .25rem 0;
}

.acumy-orgtree__row {
    display: flex;
    align-items: center;
    gap: .5rem;
    padding-top: .375rem;
    padding-bottom: .375rem;
    padding-right: .75rem;
    cursor: pointer;
    font-size: .875rem;
    color: var(--acumy-ink);
}

.acumy-orgtree__row:hover { background: var(--acumy-grey-tint); }

.acumy-orgtree__row--selected { background: var(--acumy-blue-tint); font-weight: 600; }

.acumy-orgtree__name { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.acumy-orgtree__count {
    flex: 0 0 auto;
    min-width: 1.5rem;
    text-align: right;
    font-size: .75rem;
    color: var(--acumy-ink-muted);
}

/* A short list of facts: a label column and a value column. */
.acumy-facts {
    display: grid;
    grid-template-columns: max-content 1fr;
    gap: .375rem 1.25rem;
    margin: 0;
    font-size: .875rem;
}

.acumy-facts dt { color: var(--acumy-ink-muted); }
.acumy-facts dd { margin: 0; color: var(--acumy-ink); }

/* "How this limit was found": numbered, the winning step marked, passed-over steps quieter. */
.acumy-steps {
    margin: 0 0 .75rem;
    padding-left: 1.5rem;
    font-size: .875rem;
}

.acumy-steps__step { margin-bottom: .375rem; color: var(--acumy-ink-muted); }
.acumy-steps__step--wins { color: var(--acumy-ink); }
.acumy-steps__step--wins::marker { color: var(--acumy-blue); font-weight: 700; }
.acumy-steps__step--passed .acumy-steps__what { text-decoration: line-through; text-decoration-color: var(--acumy-ink-faint); }
.acumy-steps__where { display: block; font-weight: 600; }

/* One limit where it stands. The fill is the limit's own state: near a threshold, over it. */
.acumy-limit {
    padding: .75rem 0;
    border-bottom: 1px solid var(--acumy-hairline);
}

.acumy-limit:last-child { border-bottom: 0; }

.acumy-limit__head { display: flex; flex-wrap: wrap; align-items: baseline; gap: .5rem; margin-bottom: .25rem; }
.acumy-limit__name { font-weight: 600; }
.acumy-limit__scope { font-size: .8125rem; color: var(--acumy-ink-muted); }
.acumy-limit__state { margin-left: auto; font-size: .8125rem; color: var(--acumy-ink-muted); }
.acumy-limit__figures { font-size: .875rem; margin-bottom: .375rem; }
.acumy-limit__percent { margin-left: .5rem; font-weight: 700; }
.acumy-limit__foot { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .5rem; margin-top: .375rem; }

.acumy-limit .acumy-bars__track { position: relative; overflow: visible; }

.acumy-limit__fill { height: 9px; border-radius: 4px; background: var(--acumy-blue); }

.acumy-limit__mark {
    position: absolute;
    top: -2px;
    width: 2px;
    height: 13px;
    background: var(--acumy-ink-faint);
}

.acumy-limit--near .acumy-limit__fill { background: var(--acumy-amber); }
.acumy-limit--near .acumy-limit__state { color: var(--acumy-amber); font-weight: 600; }
.acumy-limit--over .acumy-limit__fill { background: var(--acumy-red); }
.acumy-limit--over .acumy-limit__state { color: var(--acumy-red); font-weight: 600; }
.acumy-limit--unknown .acumy-limit__state { color: var(--acumy-grey); }

/* The "Use of limit" column type (usability 5, item 1): a bar with the policy's steps as white marks, then the share. */
.acumy-use { display: flex; align-items: center; gap: 10px; min-width: 180px; }
.acumy-use__track { position: relative; flex: 1; height: 10px; border-radius: 999px; background: var(--acumy-grey-tint); overflow: hidden; }
.acumy-use__fill { position: absolute; left: 0; top: 0; bottom: 0; border-radius: 999px; background: var(--acumy-blue); }
.acumy-use__mark { position: absolute; top: -2px; bottom: -2px; width: 2px; background: var(--acumy-surface); }
.acumy-use b { font-variant-numeric: tabular-nums; font-size: 13px; min-width: 44px; text-align: right; }
.acumy-grid--short .acumy-use { min-width: 110px; gap: 6px; }
.acumy-grid--short .acumy-use b { min-width: 36px; }
.acumy-use--near .acumy-use__fill { background: var(--acumy-amber); }
.acumy-use--over .acumy-use__fill { background: var(--acumy-red); }
.acumy-use--unknown .acumy-use__fill { background: var(--acumy-grey); }

/* Spend to date, with its two parts and the rates used. */
.acumy-spend { display: inline-flex; flex-direction: column; gap: .125rem; }
.acumy-spend__parts { font-size: .75rem; color: var(--acumy-ink-muted); }
.acumy-spend__rate { font-size: .75rem; color: var(--acumy-ink-muted); }
.acumy-spend__rate--stale { color: var(--acumy-amber); }

.acumy-rules { margin-bottom: .75rem; }
.acumy-rules__name { font-weight: 600; font-size: .875rem; }
.acumy-rules__list { margin: .25rem 0; padding-left: 1.25rem; font-size: .8125rem; color: var(--acumy-ink); }

/* A request for more, inside the "waiting for you" block. */
.acumy-request { padding: .5rem 0; border-top: 1px solid rgba(217, 119, 6, .3); color: var(--acumy-ink); font-size: .875rem; }
.acumy-request:first-of-type { border-top: 0; }
.acumy-request__actions { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .375rem; }

/* A toggle in a row of choices: set on, type. */
.acumy-toggle {
    border: 1px solid var(--acumy-hairline);
    border-radius: 999px;
    background: var(--acumy-surface);
    padding: .25rem .75rem;
    font: inherit;
    font-size: .8125rem;
    color: var(--acumy-ink);
    cursor: pointer;
}

.acumy-toggle:hover { border-color: var(--acumy-blue); }
.acumy-toggle:disabled { cursor: default; opacity: .6; }
.acumy-toggle--on { background: var(--acumy-blue-tint); border-color: var(--acumy-blue); color: var(--acumy-blue); font-weight: 600; }

/* A radio choice with its one-line explanation. */
.acumy-choice {
    display: flex;
    gap: .5rem;
    align-items: flex-start;
    padding: .5rem .75rem;
    margin-bottom: .375rem;
    border: 1px solid var(--acumy-hairline);
    border-radius: 8px;
    font-size: .8125rem;
    cursor: pointer;
}

.acumy-choice--on { border-color: var(--acumy-blue); background: var(--acumy-blue-tint); }
.acumy-choice input { margin-top: .2rem; }

.acumy-form-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: .75rem; margin-bottom: .5rem; }

.acumy-limit-form { border: 0; margin: 0; padding: 0; min-width: 0; }
.acumy-limit-form .acumy-field { margin-bottom: 1rem; }

.acumy-mini-table { width: 100%; table-layout: fixed; overflow-wrap: anywhere; border-collapse: collapse; font-size: .8125rem; }
.acumy-mini-table th, .acumy-mini-table td { text-align: left; padding: .25rem .5rem .25rem 0; border-bottom: 1px solid var(--acumy-hairline); }
.acumy-mini-table th { color: var(--acumy-ink-muted); font-weight: 600; }
.acumy-mini-table__row--over td { color: var(--acumy-red); }
.acumy-spend__since { font-size: .75rem; font-weight: 600; color: var(--acumy-amber); }

/* ── Master and detail: a list on the left, the selected item on the right (Roles, Rules) ───────── */
.acumy-master-detail { display: grid; grid-template-columns: minmax(240px, 320px) 1fr; gap: 16px; align-items: start; }
@media (max-width: 900px) { .acumy-master-detail { grid-template-columns: 1fr; } }
.acumy-pick-list { list-style: none; margin: 0; padding: 0; }
.acumy-pick-list__item { display: flex; flex-direction: column; gap: 2px; padding: 10px 16px; border-bottom: 1px solid var(--acumy-hairline); cursor: pointer; }
.acumy-pick-list__item:hover { background: var(--acumy-grey-tint); }
.acumy-pick-list__item--on { background: var(--acumy-blue-tint); box-shadow: inset 3px 0 0 var(--acumy-blue); }
.acumy-pick-list__main { font-weight: 600; color: var(--acumy-ink); display: flex; align-items: center; gap: 6px; }
.acumy-pick-list__sub { font-size: 12px; color: var(--acumy-ink-muted); }
.acumy-pick-list__icon { color: var(--acumy-grey); }
.acumy-section-title { font-size: 13px; font-weight: 600; color: var(--acumy-ink-muted); margin: 16px 0 6px; text-transform: none; }
.acumy-permission-list { display: flex; flex-direction: column; gap: 2px; }
.acumy-permission { display: flex; align-items: flex-start; gap: 4px; font-size: 14px; }
.acumy-search { max-width: 260px; }

/* ── Cards: approvals, Home, overviews ────────────────────────────────────────────────────────── */
.acumy-card-list { display: flex; flex-direction: column; gap: 12px; }
.acumy-card { background: var(--acumy-surface); border: 1px solid var(--acumy-hairline); border-radius: 12px; padding: 14px 16px; }
.acumy-card--waiting { border-left: 4px solid var(--acumy-amber); }
.acumy-card--escalated { border-left: 4px solid var(--acumy-red); }
.acumy-card__head { display: flex; justify-content: space-between; gap: 12px; align-items: baseline; flex-wrap: wrap; }
.acumy-card__title { font-weight: 600; color: var(--acumy-ink); }
.acumy-card__meta { font-size: 12px; color: var(--acumy-ink-muted); }
.acumy-card__body { margin-top: 6px; font-size: 14px; color: var(--acumy-ink); }
.acumy-card__actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; align-items: center; }
.acumy-steps { display: flex; flex-direction: column; gap: 2px; margin-top: 8px; font-size: 13px; }
.acumy-step { color: var(--acumy-ink-muted); }
.acumy-step--done { color: var(--acumy-green); }
.acumy-step--refused { color: var(--acumy-red); }
.acumy-step--current { color: var(--acumy-amber); font-weight: 600; }
.acumy-home-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 16px; align-items: start; }
.acumy-home-grid > .acumy-home-wide { grid-column: 1 / -1; }
.acumy-gap-list { list-style: none; margin: 0; padding: 0; }
.acumy-gap-list li { display: flex; justify-content: space-between; gap: 12px; padding: 8px 0; border-bottom: 1px solid var(--acumy-hairline); }
.acumy-gap-list li:last-child { border-bottom: none; }
.acumy-bar { height: 8px; border-radius: 4px; background: var(--acumy-grey-tint); overflow: hidden; }
.acumy-bar__fill { height: 100%; background: var(--acumy-blue); }
.acumy-rule-row { display: grid; grid-template-columns: repeat(4, minmax(120px, 1fr)) auto; gap: 8px; align-items: center; padding: 8px 0; border-bottom: 1px solid var(--acumy-hairline); }
@media (max-width: 900px) { .acumy-rule-row { grid-template-columns: 1fr; } }
.acumy-rule-row__label { font-size: 12px; color: var(--acumy-ink-muted); }

/* A spend policy's steps (Org → Rules): actions grouped by level, run in list order. */
.acumy-step { padding: 8px 0 4px; border-bottom: 1px solid var(--acumy-hairline); }
.acumy-step__head { font-weight: 600; margin-bottom: 4px; }
.acumy-step-action { display: flex; align-items: center; gap: 8px; padding: 4px 0; }
.acumy-step-action--dragging { opacity: .5; }
.acumy-step-action > .mud-input-control { flex: 1 1 160px; margin: 0; }
.acumy-step-action > .acumy-step-action__level { flex: 0 0 110px; }
.acumy-step-action__handle { cursor: grab; color: var(--acumy-ink-muted); user-select: none; letter-spacing: -2px; padding: 0 2px; }
.acumy-step-action__number { min-width: 16px; text-align: right; color: var(--acumy-ink-muted); font-variant-numeric: tabular-nums; }
.acumy-step-action__moves { display: inline-flex; }
.acumy-step-action__icon { color: var(--acumy-ink-muted); }
.acumy-step-list { margin: 0; padding-left: 20px; }
.acumy-step-list__item { padding: 2px 0; }
.acumy-step-list__what { display: inline-flex; align-items: center; gap: 6px; vertical-align: middle; }

/* ── Deploy (db/changes/166) ─────────────────────────────────────────────────────────────────────── */

.acumy-service {
    display: inline-flex;
    align-items: center;
    gap: .375rem;
    padding: .125rem .625rem .125rem .375rem;
    border-radius: 999px;
    font-size: .75rem;
    font-weight: 600;
    white-space: nowrap;
}

.acumy-service svg {
    width: 1rem;
    height: 1rem;
}

.acumy-services {
    display: flex;
    flex-wrap: wrap;
    gap: .375rem;
}

.acumy-catalogue {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(20rem, 1fr));
    gap: 1rem;
}

.acumy-template-card {
    display: flex;
    flex-direction: column;
    gap: .75rem;
    padding: 1.125rem 1.25rem;
    background: var(--acumy-surface);
    border: 1px solid var(--acumy-hairline);
    border-radius: 12px;
}

.acumy-template-card__head {
    display: flex;
    justify-content: space-between;
    gap: .5rem;
    align-items: flex-start;
}

.acumy-template-card__name {
    font-size: 1rem;
    font-weight: 700;
    margin: 0;
}

.acumy-template-card dl {
    display: grid;
    grid-template-columns: 7.5rem 1fr;
    gap: .25rem .75rem;
    margin: 0;
    font-size: .875rem;
}

.acumy-template-card dt {
    color: var(--acumy-ink-muted);
}

.acumy-template-card dd {
    margin: 0;
}

.acumy-template-card__actions {
    display: flex;
    gap: .5rem;
    margin-top: auto;
}

.acumy-builds {
    display: flex;
    flex-wrap: wrap;
    gap: .75rem;
}

.acumy-builds__group {
    min-width: 11rem;
    padding: .75rem;
    border: 1px solid var(--acumy-hairline);
    border-radius: 10px;
    background: var(--acumy-ground);
}

.acumy-builds__group ul {
    list-style: none;
    margin: .5rem 0 0;
    padding: 0;
    font-size: .8125rem;
}

.acumy-builds__group li {
    padding: .125rem 0;
}

.acumy-builds__refs {
    color: var(--acumy-ink-faint);
}

.acumy-deploy-form {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 22rem;
    gap: 1.25rem;
    align-items: start;
}

@media (max-width: 1100px) {
    .acumy-deploy-form {
        grid-template-columns: minmax(0, 1fr);
    }
}

.acumy-deploy-step {
    margin-bottom: 1rem;
}

.acumy-option {
    display: flex;
    align-items: center;
    gap: .75rem;
    width: 100%;
    padding: .625rem .75rem;
    margin-bottom: .5rem;
    font: inherit;
    text-align: left;
    background: var(--acumy-surface);
    border: 1px solid var(--acumy-hairline);
    border-radius: 10px;
    cursor: pointer;
}

.acumy-option--on {
    border-color: var(--acumy-blue);
    box-shadow: 0 0 0 1px var(--acumy-blue);
    background: var(--acumy-blue-tint);
}

.acumy-option__main {
    flex: 1;
    font-weight: 600;
}

.acumy-option__sub {
    display: block;
    font-weight: 400;
    font-size: .8125rem;
    color: var(--acumy-ink-muted);
}

.acumy-cost-bar {
    position: relative;
    display: flex;
    height: .75rem;
    margin: .5rem 0 .25rem;
    overflow: visible;
    background: var(--acumy-grey-tint);
    border-radius: 999px;
}

.acumy-cost-bar__used {
    background: var(--acumy-grey);
    border-radius: 999px 0 0 999px;
}

.acumy-cost-bar__this {
    background: var(--acumy-blue);
}

.acumy-cost-bar__limit {
    position: absolute;
    top: -.25rem;
    bottom: -.25rem;
    width: 2px;
    background: var(--acumy-ink);
}

.acumy-before li {
    align-items: flex-start;
}

/* ── Approval routes: request types as headings, routes as rows under them ───────────────────── */

.acumy-route-type {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 8px 6px 10px;
    border-bottom: 1px solid var(--acumy-hairline);
}

.acumy-route-type__name {
    flex: 1 1 auto;
    font-weight: 600;
    color: var(--acumy-ink);
}

.acumy-route-type__count {
    font-size: 12px;
    color: var(--acumy-ink-muted);
    background: var(--acumy-grey-tint);
    border-radius: 10px;
    padding: 0 8px;
}

.acumy-pick-list__item.acumy-route-child {
    flex-direction: row;
    align-items: center;
    padding-left: 40px;
}

.acumy-route-child__text {
    display: flex;
    flex-direction: column;
    gap: 2px;
    flex: 1 1 auto;
    min-width: 0;
}

.acumy-route-none {
    padding: 8px 16px 8px 40px;
    font-size: 12px;
    color: var(--acumy-ink-muted);
    border-bottom: 1px solid var(--acumy-hairline);
}

/* ── A number column: header and cells right-aligned (docs/specs/ui-tidy-2026-10-01.md §3) ── */
.acumy-num {
    text-align: right;
    font-variant-numeric: tabular-nums;
}

    .acumy-num .column-header,
    .acumy-num .acumy-grid__sort {
        justify-content: flex-end;
        margin-left: auto;
    }


/* ── Section: count and selection after the title, actions on the right (§5) ── */
.acumy-panel-count {
    margin-left: .375rem;
    font-size: .8125rem;
    font-weight: 400;
    color: var(--acumy-ink-muted);
}

.acumy-panel-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: .5rem;
}

.acumy-panel-head__title { align-items: center; }

/* ── Details: label left, value right, two columns, a line between rows (§6) ── */
.acumy-details {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 2.5rem;
}

.acumy-details--one { grid-template-columns: minmax(0, 1fr); }

.acumy-details-wrap { container-type: inline-size; }

@container (max-width: 760px) {
    .acumy-details { grid-template-columns: minmax(0, 1fr); }
    .acumy-details__row { grid-template-columns: 9rem minmax(0, 1fr); }
}

.acumy-details__row {
    display: grid;
    grid-template-columns: 12.5rem minmax(0, 1fr);
    gap: .75rem;
    padding: .625rem 0;
    border-top: 1px solid var(--acumy-hairline);
    font-size: .875rem;
}

.acumy-details--one .acumy-details__row { grid-template-columns: 9rem minmax(0, 1fr); }

.acumy-details__label { color: var(--acumy-ink-muted); }

.acumy-details__value {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: .125rem;
    min-width: 0;
    font-weight: 600;
    color: var(--acumy-ink);
    overflow-wrap: anywhere;
}

.acumy-details__none { font-weight: 400; color: var(--acumy-ink-faint); }

.acumy-details__note { font-size: .75rem; font-weight: 400; color: var(--acumy-ink-muted); }

/* ── Search tree: its own scroll area, a search that keeps matches, what is under them and their parents (§8) ── */
.acumy-searchtree__search {
    display: flex;
    align-items: center;
    gap: .75rem;
    padding: .75rem 1rem;
    border-bottom: 1px solid var(--acumy-hairline);
}

    .acumy-searchtree__search .mud-input-control { flex: 1 1 auto; }

.acumy-searchtree__list {
    list-style: none;
    margin: 0;
    padding: .25rem 0;
    overflow-y: auto;
}

.acumy-searchtree__row {
    display: flex;
    align-items: center;
    gap: .375rem;
    padding: .375rem .75rem .375rem calc(.5rem + var(--acumy-depth, 0) * 1.25rem);
    font-size: .875rem;
    color: var(--acumy-ink);
}

.acumy-searchtree__row--pick { cursor: pointer; }
.acumy-searchtree__row--pick:hover { background: var(--acumy-grey-tint); }
.acumy-searchtree__row--chosen { background: var(--acumy-blue-tint); font-weight: 600; }
.acumy-searchtree__row--parent { color: var(--acumy-ink-faint); }

.acumy-searchtree__text {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-width: 0;
}

.acumy-searchtree__name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.acumy-searchtree__sub {
    font-size: .75rem;
    font-weight: 400;
    color: var(--acumy-ink-muted);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.acumy-searchtree__why { flex: 0 0 auto; font-size: .75rem; color: var(--acumy-ink-muted); }

.acumy-searchtree__trailing { display: inline-flex; align-items: center; gap: .5rem; flex: 0 0 auto; }

.acumy-searchtree__none { padding: .75rem 1rem; font-size: .8125rem; color: var(--acumy-ink-muted); }

.acumy-mark { background: #FEF08A; color: var(--acumy-ink); border-radius: 2px; padding: 0 1px; }

/* ── Person picker: type to search, name, email and primary group (§9) ── */
.acumy-person-hit {
    display: flex;
    align-items: center;
    gap: .625rem;
    min-width: 0;
}

.acumy-person-hit__avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 2rem;
    height: 2rem;
    border-radius: 999px;
    background: var(--acumy-blue-tint);
    color: var(--acumy-blue);
    font-size: .75rem;
    font-weight: 600;
}

.acumy-person-hit__text { display: flex; flex-direction: column; min-width: 0; }
.acumy-person-hit__name { font-size: .875rem; font-weight: 600; color: var(--acumy-ink); }
.acumy-person-hit__sub { font-size: .75rem; color: var(--acumy-ink-muted); }

.acumy-person-hit--off { opacity: .55; cursor: not-allowed; }

/* The one or two sentences at the top of a dialog: what it does, to what, and whether the cloud changes (§5). */
.acumy-dialog-lead {
    margin: 0 0 1rem;
    font-size: .875rem;
    color: var(--acumy-ink-muted);
}

.acumy-unit-tree {
    border: 1px solid var(--acumy-hairline);
    border-radius: 8px;
    background: var(--acumy-surface);
}

/* ── Dialog choices: a labelled set of radio options with a title and a line under it (§5) ── */
.acumy-dialog-choice {
    margin: 0 0 1rem;
    padding: 0;
    border: 0;
}

.acumy-dialog-label {
    margin-bottom: .375rem;
    padding: 0;
    font-size: .75rem;
    font-weight: 600;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--acumy-ink-muted);
}

.acumy-dialog-option {
    display: flex;
    align-items: flex-start;
    gap: .625rem;
    padding: .5rem 0;
    font-size: .875rem;
    cursor: pointer;
}

    .acumy-dialog-option > input { margin-top: .25rem; }
    .acumy-dialog-option > span { display: flex; flex-direction: column; gap: .125rem; }

.acumy-dialog-option__title { font-weight: 600; color: var(--acumy-ink); }
.acumy-dialog-option__sub { font-size: .75rem; color: var(--acumy-ink-muted); }

/* ── Home (docs/specs/ui-tidy-2026-10-01.md §2) ── */
.acumy-home { display: flex; flex-direction: column; gap: 1.25rem; }

.acumy-home-tiles {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 1rem;
}

    .acumy-home-tiles .acumy-kpi { align-items: center; height: 100%; }

.acumy-home-row {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: 1.25rem;
    align-items: stretch;
}

    .acumy-home-row > .acumy-panel { height: 100%; }

    /* Home for each role (266): a row's cards share it; a card in a cell fills its height. */
    .acumy-home-cell { min-width: 0; }
    .acumy-home-cell > .acumy-panel { height: 100%; }
    .acumy-home-tile { min-width: 0; }
    .acumy-home-tile > .acumy-kpi { height: 100%; }

.acumy-ring__figure { font-size: .8125rem; font-weight: 700; fill: var(--acumy-ink); }

.acumy-needs {
    display: flex;
    align-items: center;
    gap: .75rem;
    padding: .625rem 0;
    border-top: 1px solid var(--acumy-hairline);
    font-size: .875rem;
}

    .acumy-needs:first-child { border-top: 0; }

.acumy-needs__bar { width: 8px; height: 36px; border-radius: 4px; flex: 0 0 auto; }
.acumy-needs__bar--red { background: var(--acumy-red); }
.acumy-needs__bar--amber { background: var(--acumy-amber); }
.acumy-needs__bar--blue { background: var(--acumy-blue); }

.acumy-needs__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 7px;
    flex: 0 0 auto;
}

.acumy-needs__icon--red { background: var(--acumy-red-tint); color: var(--acumy-red); }
.acumy-needs__icon--amber { background: var(--acumy-amber-tint); color: var(--acumy-amber); }
.acumy-needs__icon--blue { background: var(--acumy-blue-tint); color: var(--acumy-blue); }

.acumy-needs__text { display: flex; flex-direction: column; flex: 1 1 auto; min-width: 0; }
.acumy-needs__title { font-weight: 600; color: var(--acumy-ink); }
.acumy-needs__detail { font-size: .75rem; color: var(--acumy-ink-muted); }
.acumy-needs__action { flex: 0 0 auto; }

.acumy-limitbars { display: flex; flex-direction: column; gap: 1rem; }

.acumy-limitbar__head { display: flex; align-items: baseline; gap: .625rem; font-size: .875rem; }
.acumy-limitbar__name { flex: 1 1 auto; font-weight: 600; color: var(--acumy-ink); }
.acumy-limitbar__figure { color: var(--acumy-ink); font-variant-numeric: tabular-nums; }

.acumy-limitbar__track {
    height: 10px;
    margin-top: .5rem;
    border-radius: 999px;
    background: var(--acumy-hairline);
    overflow: hidden;
}

.acumy-limitbar__fill { height: 10px; }
.acumy-limitbar__fill--ok { background: var(--acumy-blue); }
.acumy-limitbar__fill--near { background: var(--acumy-amber); }
.acumy-limitbar__fill--over { background: var(--acumy-red); }
.acumy-limitbar__fill--unknown { background: var(--acumy-grey); }

.acumy-limitbar__sub { margin-top: .25rem; font-size: .75rem; color: var(--acumy-ink-muted); }

.acumy-daybars__svg { display: block; width: 100%; height: 160px; }
.acumy-daybars__bar { fill: var(--acumy-blue); }
.acumy-daybars__bar--paused { fill: var(--acumy-blue); opacity: .35; }
.acumy-daybars__unknown { font-size: 12px; fill: var(--acumy-ink-faint); }

.acumy-daybars__axis,
.acumy-daybars__legend {
    display: flex;
    justify-content: space-between;
    font-size: .75rem;
    color: var(--acumy-ink-muted);
}

.acumy-daybars__legend { justify-content: flex-start; gap: 1rem; margin-top: .5rem; }
.acumy-daybars__legend > span { display: inline-flex; align-items: center; gap: .375rem; }
.acumy-daybars__key { width: 10px; height: 10px; border-radius: 2px; background: var(--acumy-blue); }
.acumy-daybars__key--paused { opacity: .35; }

.acumy-glance { display: flex; align-items: center; gap: 1.25rem; }
.acumy-glance__figures { display: flex; flex-direction: column; gap: .375rem; font-size: .875rem; color: var(--acumy-ink-muted); }
.acumy-glance__figures strong { color: var(--acumy-ink); font-variant-numeric: tabular-nums; }

.acumy-home-list { list-style: none; margin: 0; padding: 0; }

.acumy-home-list li {
    display: flex;
    align-items: center;
    gap: .625rem;
    padding: .5rem 0;
    border-top: 1px solid var(--acumy-hairline);
    font-size: .875rem;
}

    .acumy-home-list li:first-child { border-top: 0; }
    .acumy-home-list__main { flex: 1 1 auto; min-width: 0; }
    .acumy-home-list__when { flex: 0 0 8.5rem; font-weight: 600; font-variant-numeric: tabular-nums; white-space: nowrap; }

/* Discovery → Start: the button and "Choose OU before starting" on one line. */
.acumy-start-row {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 1rem;
}

.acumy-check {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    font-size: .875rem;
    color: var(--acumy-ink);
}

/* Cloud page: READ / WRITE / ACCOUNTS cards (docs/specs/ui-tidy-mockup/CloudSettings.dc.html). */
.acumy-cloudcard__badge {
    margin-right: .5rem;
    vertical-align: middle;
    letter-spacing: .04em;
}

.acumy-capability {
    display: grid;
    grid-template-columns: 3.5rem minmax(0, 1fr);
    gap: .875rem;
    padding: 1rem 0;
    align-items: start;
}

.acumy-capability + .acumy-capability {
    border-top: 1px solid var(--acumy-hairline);
}

.acumy-capability__title {
    font-weight: 600;
    font-size: 1rem;
    color: var(--acumy-ink);
}

.acumy-capability__body {
    min-width: 0;
}

/* A switch drawn read-only: on is blue, off is grey. It says what is set, not whether that is good. */
.acumy-switch-mark {
    display: inline-flex;
    position: relative;
    width: 42px;
    height: 24px;
    border-radius: 999px;
    background: var(--acumy-ink-faint);
    margin-top: 2px;
}

.acumy-switch-mark::after {
    content: "";
    position: absolute;
    top: 3px;
    left: 3px;
    width: 18px;
    height: 18px;
    border-radius: 999px;
    background: #FFFFFF;
    box-shadow: 0 1px 2px rgba(15, 23, 42, .3);
}

.acumy-switch-mark--on {
    background: var(--acumy-blue);
}

.acumy-switch-mark--on::after {
    left: 21px;
}

/* ── Workspaces as a tree (docs/specs/workspace-tree.md, mockups WsTree, WsParent, WsChild) ────── */

.acumy-segmented {
    display: inline-flex;
    border: 1px solid var(--acumy-hairline-strong);
    border-radius: 8px;
    overflow: hidden;
}

.acumy-segmented__option {
    padding: .375rem .875rem;
    font-size: .8125rem;
    font-weight: 600;
    color: var(--acumy-ink-muted);
    text-decoration: none;
    background: var(--acumy-surface);
}

    .acumy-segmented__option + .acumy-segmented__option {
        border-left: 1px solid var(--acumy-hairline-strong);
    }

.acumy-segmented__option--on {
    background: var(--acumy-blue-tint);
    color: var(--acumy-blue);
}


.acumy-wstree__quick {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
}

.acumy-quick {
    font: inherit;
    font-size: .8125rem;
    font-weight: 600;
    padding: .25rem .75rem;
    border-radius: 999px;
    border: 1px solid var(--acumy-hairline-strong);
    background: var(--acumy-surface);
    color: var(--acumy-ink-muted);
    cursor: pointer;
}

.acumy-quick--on {
    background: var(--acumy-ink);
    border-color: var(--acumy-ink);
    color: var(--acumy-surface);
}


.acumy-wstree__table {
    width: 100%;
    border-collapse: collapse;
}

    .acumy-wstree__table th {
        background: var(--acumy-band);
        color: var(--acumy-ink-muted);
        font-size: .6875rem;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: .04em;
        text-align: left;
        padding: .625rem .75rem;
        border-bottom: 1px solid var(--acumy-hairline);
        white-space: nowrap;
    }

    .acumy-wstree__table td {
        font-size: .8125rem;
        padding: .625rem .75rem;
        border-bottom: 1px solid var(--acumy-hairline);
        vertical-align: top;
    }

    .acumy-wstree__table th.acumy-num {
        text-align: right;
    }




/* A parent kept only because something under it matched. */



.acumy-wstree__subs {
    display: block;
}

.acumy-wstree__total {
    font-weight: 700;
}

/* A value that comes from the parent. */
.acumy-wstree__inherited {
    color: var(--acumy-ink-faint);
}


.acumy-wstree__foot {
    padding: .75rem 1rem;
    margin: 0;
}

.acumy-link-button {
    font: inherit;
    font-size: .8125rem;
    border: 0;
    background: none;
    padding: 0 .25rem;
    color: var(--acumy-blue);
    cursor: pointer;
}

    .acumy-link-button:hover {
        text-decoration: underline;
    }

.acumy-avatar-line {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
}

.acumy-avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border-radius: 999px;
    background: var(--acumy-blue-tint);
    color: var(--acumy-blue);
    font-size: .75rem;
    font-weight: 700;
    flex: 0 0 auto;
}

.acumy-avatar--small {
    width: 1.625rem;
    height: 1.625rem;
    font-size: .6875rem;
}

.acumy-avatar-stack {
    display: inline-flex;
}

    .acumy-avatar-stack .acumy-avatar {
        border: 2px solid var(--acumy-surface);
        margin-left: -.375rem;
    }

    .acumy-avatar-stack .acumy-avatar:first-child {
        margin-left: 0;
    }

/* The Edit workspace dialog (docs/specs/workspace-mockup/WsEdit.dc.html). */
.mud-dialog.acumy-wsedit-dialog {
    max-width: 640px;
}

    .mud-dialog.acumy-wsedit-dialog .mud-dialog-actions {
        flex-wrap: wrap;
    }

/* Bulk mode: what Save will change, on its own line above the buttons. */
.acumy-wsedit__summary {
    flex: 1 0 100%;
    margin: 0 0 .5rem;
    font-size: .875rem;
    color: var(--acumy-ink);
}

.acumy-wsedit {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding-bottom: .25rem;
}

    .acumy-wsedit .acumy-field__label {
        margin-bottom: .25rem;
    }

    .acumy-wsedit .mud-input-control {
        margin-top: 0;
    }

.acumy-wsedit__pair {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 1rem;
}

.acumy-wsedit__aside {
    color: var(--acumy-ink-muted);
    font-size: .8125rem;
}

/* Part of: a closed field; the tree opens over the fields below it. */
.acumy-wsedit__picker {
    position: relative;
}

.acumy-closed-field {
    display: flex;
    align-items: center;
    gap: .5rem;
    width: 100%;
    min-height: 40px;
    padding: .5rem .625rem;
    box-sizing: border-box;
    border: 1px solid var(--acumy-hairline-strong);
    border-radius: 8px;
    background: var(--acumy-surface);
    font: inherit;
    font-size: .875rem;
    color: var(--acumy-ink);
    text-align: left;
    cursor: pointer;
}

    .acumy-closed-field:hover {
        border-color: var(--acumy-ink-muted);
    }

.acumy-closed-field__caret {
    color: var(--acumy-ink-muted);
    font-size: 1rem;
    line-height: 1;
}

.acumy-closed-field__text {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.acumy-wsedit__scrim {
    position: fixed;
    inset: 0;
    z-index: 2;
}

.acumy-wsedit__drop {
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    right: 0;
    z-index: 3;
    background: var(--acumy-surface);
    border: 1px solid var(--acumy-hairline);
    border-radius: 8px;
    box-shadow: 0 12px 28px rgba(15, 23, 42, .18);
}

.acumy-wsedit__none {
    display: block;
    width: 100%;
    padding: .5rem 1rem;
    border: 0;
    border-bottom: 1px solid var(--acumy-hairline);
    background: none;
    font: inherit;
    font-size: .875rem;
    text-align: left;
    color: var(--acumy-ink);
    cursor: pointer;
}

    .acumy-wsedit__none:hover {
        background: var(--acumy-grey-tint);
    }

.acumy-wsedit__none--chosen {
    background: var(--acumy-blue-tint);
    font-weight: 600;
}

/* A tree whose second line sits beside the name, in grey. */
.acumy-searchtree--inline-sub .acumy-searchtree__text {
    flex-direction: row;
    align-items: baseline;
    gap: .375rem;
}

/* ── Every dialog: one short hint per field, longer help behind ⓘ ── */
.acumy-field-hint {
    margin: .25rem 0 0;
    font-size: .75rem;
    color: var(--acumy-ink-muted);
}

.acumy-field-hint--warn {
    color: var(--acumy-amber);
}

.acumy-info {
    display: inline-flex;
    margin-left: .25rem;
    font-size: .8125rem;
    font-weight: 400;
    color: var(--acumy-ink-muted);
    cursor: help;
}

    .acumy-info:hover,
    .acumy-info:focus-visible {
        color: var(--acumy-blue);
    }

.acumy-info-wrap {
    position: relative;
}

/* On the outline's top edge, opposite the floating label. */
.acumy-info-wrap__tip {
    position: absolute;
    top: -.625rem;
    right: .5rem;
    z-index: 1;
    padding: 0 .25rem;
    background: var(--acumy-surface);
    line-height: 1.2;
}

.mud-input-control.mud-input-control-boolean-input.acumy-radio-stack .mud-radio-group {
    flex-direction: column;
    align-items: flex-start;
}

.acumy-check-info {
    display: flex;
    align-items: center;
    gap: .25rem;
}

.acumy-dialog-sub {
    margin: .25rem 0 0;
    font-size: .875rem;
    color: var(--acumy-ink-muted);
}

/* The workspace page. */
.acumy-wspage__line {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .375rem .75rem;
    color: var(--acumy-ink-muted);
    font-size: .875rem;
    margin: 0 0 1rem;
}

.acumy-wspage__grid {
    display: grid;
    grid-template-columns: minmax(0, 3fr) minmax(0, 2fr);
    gap: 1rem;
    align-items: start;
}

@media (max-width: 1100px) {
    .acumy-wspage__grid {
        grid-template-columns: minmax(0, 1fr);
    }
}

.acumy-wspage__list {
    list-style: none;
    margin: 0;
    padding: 0;
}

    .acumy-wspage__list li {
        display: flex;
        align-items: center;
        gap: .75rem;
        padding: .625rem 0;
        border-top: 1px solid var(--acumy-hairline);
        font-size: .875rem;
    }

    .acumy-wspage__list li:first-child {
        border-top: 0;
    }

.acumy-wspage__grow {
    flex: 1 1 auto;
    min-width: 0;
}

.acumy-wspage__heading {
    font-size: .75rem;
    font-weight: 600;
    color: var(--acumy-ink-muted);
    text-transform: uppercase;
    letter-spacing: .04em;
    margin: 1rem 0 .25rem;
}

/* "Comes from": grey when inherited, blue when set here. */
.acumy-comes-from {
    display: inline-flex;
    padding: .125rem .625rem;
    border-radius: 999px;
    font-size: .75rem;
    font-weight: 600;
    background: var(--acumy-grey-tint);
    color: var(--acumy-grey);
}

.acumy-comes-from--here {
    background: var(--acumy-blue-tint);
    color: var(--acumy-blue);
}

/* ── Projects across clouds, workspaces within an account (docs/specs/projects-and-workspaces.md) ── */

/* Estate → Workspaces: one tree, a grey row per account, a tick per workspace. */




/* The row's "⋯" menu: as narrow as its button. */

/* A resource's tick beside its name, under its open type on a workspace page. */


/* The New and Edit dialog: lists that open over the fields, and fields shown but not changed. */
.acumy-wsedit__list {
    max-height: 18rem;
    overflow-y: auto;
}

.acumy-wsedit__group {
    padding: .375rem 1rem;
    font-size: .75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: var(--acumy-ink-muted);
    background: var(--acumy-grey-tint);
}

.acumy-wsedit__empty {
    padding: .5rem 1rem;
    margin: 0;
}

.acumy-closed-field--fixed {
    cursor: default;
    background: var(--acumy-grey-tint);
}

    .acumy-closed-field--fixed:hover {
        border-color: var(--acumy-hairline-strong);
    }

.acumy-closed-field:disabled {
    cursor: default;
    color: var(--acumy-ink-muted);
    background: var(--acumy-grey-tint);
}

/* A list inside a dialog scrolls in its own box (CLAUDE.md, the dialog rule). */
.acumy-wsedit__box {
    border: 1px solid var(--acumy-hairline);
    border-radius: 8px;
    max-height: 12rem;
    overflow-y: auto;
}

.acumy-wsedit__box--tall {
    max-height: 22rem;
}

.acumy-wsedit__boxrow {
    display: flex;
    align-items: center;
    gap: .5rem;
    padding: .5rem .75rem;
    border-top: 1px solid var(--acumy-hairline);
    font-size: .875rem;
}

    .acumy-wsedit__boxrow:first-child {
        border-top: 0;
    }

.acumy-wsedit__boxrow--tick {
    cursor: pointer;
}

/* The project page's Settings card: a label column, then the value and one line under it. */
.acumy-wspage__label {
    flex: 0 0 8rem;
    color: var(--acumy-ink-muted);
    font-size: .875rem;
}

.acumy-wspage__list--settings li {
    align-items: flex-start;
}

.acumy-wspage__clouds {
    display: flex;
    flex-wrap: wrap;
    gap: .75rem;
}

.acumy-wspage__cloud {
    display: inline-flex;
    align-items: center;
    gap: .375rem;
    font-weight: 600;
}

/* ── Costs (docs/specs/costs.md) ─────────────────────────────────────────────────────────────── */

.acumy-spend-split { font-variant-numeric: tabular-nums; border-bottom: 1px dotted var(--acumy-ink-faint); cursor: help; }

.acumy-costchart__svg { display: block; width: 100%; height: 200px; }
.acumy-costchart__actual { fill: var(--acumy-blue); }
.acumy-costchart__hatch-ground { fill: var(--acumy-blue-tint); }
.acumy-costchart__hatch-line { stroke: var(--acumy-blue); stroke-width: 2; opacity: .55; }
.acumy-costchart__estimate { stroke: var(--acumy-blue); stroke-width: .75; stroke-opacity: .55; }
.acumy-costchart__grid { stroke: var(--acumy-hairline); stroke-width: 1; }
.acumy-costchart__base { stroke: var(--acumy-hairline-strong); stroke-width: 1; }
.acumy-costchart__tick { font-size: 11px; fill: var(--acumy-ink-muted); }
.acumy-costchart__unknown { font-size: 12px; fill: var(--acumy-ink-faint); }
.acumy-costchart__marker { stroke: var(--acumy-ink); stroke-width: 1.25; stroke-dasharray: 4 3; }
.acumy-costchart__marker-label { font-size: 11px; fill: var(--acumy-ink); font-weight: 600; }
.acumy-costchart__axis,
.acumy-costchart__legend { display: flex; justify-content: space-between; font-size: .75rem; color: var(--acumy-ink-muted); }
.acumy-costchart__legend { justify-content: flex-start; gap: 1.25rem; margin-top: .5rem; }
.acumy-costchart__legend > span { display: inline-flex; align-items: center; gap: .375rem; }
.acumy-costchart__key { width: 12px; height: 12px; border-radius: 2px; }
.acumy-costchart__key--actual { background: var(--acumy-blue); }
.acumy-costchart__key--estimate {
    background: repeating-linear-gradient(45deg, var(--acumy-blue) 0 2px, var(--acumy-blue-tint) 2px 5px);
    border: 1px solid var(--acumy-blue);
}

.acumy-costs-groupby { display: flex; flex-wrap: wrap; gap: .25rem; margin-bottom: .75rem; }

.acumy-costs-table { width: 100%; border-collapse: collapse; font-size: .875rem; }
.acumy-costs-table th {
    text-align: left; font-size: .75rem; font-weight: 600; color: var(--acumy-ink-muted); text-transform: uppercase;
    letter-spacing: .04em; padding: .625rem .75rem; border-bottom: 1px solid var(--acumy-hairline);
}
.acumy-costs-table td { padding: .75rem; border-bottom: 1px solid var(--acumy-hairline); vertical-align: top; }
.acumy-costs-table tr[data-cost-row] { cursor: pointer; }
.acumy-costs-table tr[data-cost-row]:hover { background: var(--acumy-grey-tint); }
.acumy-costs-table .acumy-num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.acumy-costs-table__none td { color: var(--acumy-ink-muted); }

.acumy-sharebar { display: flex; align-items: center; gap: .5rem; min-width: 8rem; }
.acumy-sharebar__track { flex: 1; height: 6px; border-radius: 3px; background: var(--acumy-grey-tint); overflow: hidden; }
.acumy-sharebar__fill { height: 100%; background: var(--acumy-blue); }
.acumy-sharebar__text { font-size: .75rem; color: var(--acumy-ink-muted); font-variant-numeric: tabular-nums; min-width: 2.5rem; text-align: right; }

.acumy-change--up { color: var(--acumy-ink); }
.acumy-change--down { color: var(--acumy-ink); }
.acumy-change--new { color: var(--acumy-ink-muted); font-style: italic; }

.acumy-billing-steps { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 1rem; }
.acumy-billing-steps > li { display: grid; grid-template-columns: 2rem minmax(0, 1fr) auto; gap: .75rem; align-items: start; }
.acumy-billing-steps__num {
    width: 1.75rem; height: 1.75rem; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center;
    background: var(--acumy-blue-tint); color: var(--acumy-blue); font-weight: 700; font-size: .875rem;
}
.acumy-billing-steps__title { font-weight: 600; }
.acumy-billing-code {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .75rem; white-space: pre; overflow: auto;
    max-height: 9rem; background: var(--acumy-band); border: 1px solid var(--acumy-hairline); border-radius: 6px; padding: .5rem; margin-top: .375rem;
}

.acumy-native-select,
.acumy-date-input {
    font: inherit; font-size: .875rem; color: var(--acumy-ink); background: var(--acumy-surface);
    border: 1px solid var(--acumy-hairline-strong); border-radius: 6px; padding: .25rem .5rem; min-height: 2rem;
}

/* ── Ask Acumy (db/changes/204, mockups docs/specs/ai-mockup) ─────────────────────────────────────
   A panel beside the page, not over it: the page keeps working, so the content moves left by the
   panel's width while it is open. */
.acumy-main--ask {
    padding-right: 448px;
}

.acumy-askbtn {
    margin-left: auto;
    align-self: center;
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    min-height: 38px;
    padding: 0 1rem;
    border-radius: 999px;
    border: 1px solid #BFDBFE;
    background: var(--acumy-blue-tint);
    color: var(--acumy-blue);
    font: inherit;
    font-size: .875rem;
    font-weight: 600;
    white-space: nowrap;
    cursor: pointer;
}

/* Ask Acumy's ✦ "Explain this" beside a figure (AskExplain mockup). */
.acumy-kpi-figure--action { display: flex; align-items: center; gap: .5rem; }

.acumy-explain {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 26px;
    height: 26px;
    padding: 0;
    border-radius: 999px;
    border: 1px solid #BFDBFE;
    background: var(--acumy-blue-tint);
    color: var(--acumy-blue);
    cursor: pointer;
    vertical-align: middle;
}

.acumy-explain:hover { border-color: var(--acumy-blue); }
.acumy-explain:disabled { cursor: default; }

.acumy-explain--on {
    background: var(--acumy-blue);
    border-color: var(--acumy-blue);
    color: #FFFFFF;
    box-shadow: 0 0 0 4px #DBEAFE;
}

.acumy-askbtn--open {
    background: var(--acumy-blue);
    border-color: var(--acumy-blue);
    color: #FFFFFF;
}

.acumy-ask {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    width: 440px;
    z-index: 1150;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    background: var(--acumy-surface);
    border-left: 1px solid var(--acumy-hairline-strong);
    box-shadow: -8px 0 24px rgba(15, 23, 42, .08);
    color: var(--acumy-ink);
}

.acumy-ask__head {
    position: relative;
    display: flex;
    align-items: center;
    gap: .5rem;
    padding: .875rem 1.125rem;
    border-bottom: 1px solid var(--acumy-hairline);
}

.acumy-ask__mark { color: var(--acumy-blue); }
.acumy-ask__mark--big { font-size: 2rem; align-self: center; }

.acumy-ask__title {
    flex-grow: 1;
    margin: 0;
    font-size: 1rem;
    white-space: nowrap;
}

.acumy-ask__headbtn {
    display: inline-flex;
    align-items: center;
    gap: .25rem;
    min-height: 34px;
    padding: 0 .75rem;
    border: 1px solid var(--acumy-hairline-strong);
    border-radius: 8px;
    background: var(--acumy-surface);
    color: var(--acumy-ink);
    font: inherit;
    font-size: .8125rem;
    font-weight: 600;
    cursor: pointer;
}

.acumy-ask__headbtn--plain { border: 0; }
.acumy-ask__headbtn:disabled { color: var(--acumy-ink-faint); cursor: default; }

.acumy-ask__recent {
    position: absolute;
    top: calc(100% - .25rem);
    right: 1.125rem;
    z-index: 2;
    width: 320px;
    max-height: 360px;
    overflow-y: auto;
    padding: .25rem;
    border: 1px solid var(--acumy-hairline-strong);
    border-radius: 10px;
    background: var(--acumy-surface);
    box-shadow: 0 8px 24px rgba(15, 23, 42, .12);
}

.acumy-ask__recent-item {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: .125rem;
    width: 100%;
    padding: .5rem .625rem;
    border: 0;
    border-radius: 8px;
    background: none;
    color: var(--acumy-ink);
    font: inherit;
    font-size: .875rem;
    text-align: left;
    cursor: pointer;
}

.acumy-ask__recent-item:hover { background: var(--acumy-grey-tint); }
.acumy-ask__recent-when, .acumy-ask__recent-empty { font-size: .75rem; color: var(--acumy-ink-muted); }
.acumy-ask__recent-empty { padding: .5rem .625rem; }

.acumy-ask__ctx {
    margin: .75rem 1.125rem 0;
    padding: .5rem .75rem;
    border-radius: 8px;
    background: var(--acumy-grey-tint);
    font-size: .8125rem;
    color: #334155;
}

.acumy-ask__msgs {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: .875rem;
    padding: 1rem 1.125rem;
}

.acumy-ask__msgs--empty { justify-content: center; }

.acumy-ask__empty {
    display: flex;
    flex-direction: column;
    gap: .5rem;
    text-align: center;
}

.acumy-ask__lead { margin: 0; font-size: .9375rem; font-weight: 600; }
.acumy-ask__sub { margin: 0 0 .5rem; font-size: .875rem; color: var(--acumy-ink-muted); }

.acumy-ask__try {
    margin-top: .5rem;
    text-align: left;
    font-size: .75rem;
    font-weight: 600;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--acumy-grey);
}

.acumy-ask__starter {
    display: block;
    width: 100%;
    padding: .625rem .75rem;
    border: 1px solid var(--acumy-hairline-strong);
    border-radius: 10px;
    background: var(--acumy-surface);
    color: var(--acumy-ink);
    font: inherit;
    font-size: .875rem;
    text-align: left;
    cursor: pointer;
}

.acumy-ask__starter:hover { border-color: var(--acumy-blue); }

.acumy-ask__notice {
    padding: .625rem .75rem;
    border-radius: 8px;
    background: var(--acumy-grey-tint);
    font-size: .875rem;
    color: var(--acumy-ink);
}

.acumy-ask__q {
    align-self: flex-end;
    max-width: 85%;
    padding: .625rem .875rem;
    border-radius: 14px 14px 4px 14px;
    background: var(--acumy-blue);
    color: #FFFFFF;
    font-size: .875rem;
    white-space: pre-wrap;
}

.acumy-ask__a {
    font-size: .875rem;
    line-height: 1.5;
}

.acumy-ask__a p { margin: 0 0 .625rem; }
.acumy-ask__a p:last-child { margin-bottom: 0; }
.acumy-ask__a ul, .acumy-ask__a ol { margin: 0 0 .625rem; padding-left: 1.25rem; }

.acumy-ask__a table {
    width: 100%;
    margin-bottom: .625rem;
    border-collapse: collapse;
    font-size: .8125rem;
}

.acumy-ask__a th {
    padding: .375rem .5rem;
    border-bottom: 1px solid var(--acumy-hairline);
    font-size: .75rem;
    font-weight: 600;
    letter-spacing: .04em;
    text-transform: uppercase;
    text-align: left;
    color: var(--acumy-ink-muted);
}

.acumy-ask__a td {
    padding: .375rem .5rem;
    border-bottom: 1px solid var(--acumy-grey-tint);
    vertical-align: top;
}

.acumy-ask__how {
    border: 1px solid var(--acumy-hairline);
    border-radius: 8px;
    background: var(--acumy-band);
    font-size: .8125rem;
}

.acumy-ask__how summary {
    padding: .5rem .75rem;
    font-weight: 600;
    color: #334155;
    cursor: pointer;
}

.acumy-ask__how-count { font-weight: 400; color: var(--acumy-ink-muted); }

.acumy-ask__how ul {
    margin: 0;
    padding: 0 .75rem .5rem 2.125rem;
    color: var(--acumy-ink-muted);
}

.acumy-ask__how li + li { margin-top: .25rem; }
.acumy-ask__how-problem { color: var(--acumy-amber); }

.acumy-ask__rate {
    display: flex;
    align-items: center;
    gap: .25rem;
    margin-top: -.375rem;
    font-size: .8125rem;
}

.acumy-ask__thumb {
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    padding: 0 .5rem;
    border: 0;
    border-radius: 8px;
    background: none;
    color: var(--acumy-ink-muted);
    cursor: pointer;
}

.acumy-ask__thumb--on { background: var(--acumy-blue-tint); color: var(--acumy-blue); }

.acumy-ask__link {
    margin-left: .375rem;
    padding: 0;
    border: 0;
    background: none;
    color: var(--acumy-blue);
    font: inherit;
    cursor: pointer;
}

.acumy-ask__link:hover { text-decoration: underline; }

/* Working is blue and moving; a failure is red and still. They must not look alike. */
.acumy-ask__working {
    display: flex;
    align-items: center;
    gap: .625rem;
    padding: .625rem .75rem;
    border: 1px solid var(--acumy-blue);
    border-radius: 8px;
    background: var(--acumy-blue-tint);
    font-size: .875rem;
    color: var(--acumy-ink);
}

.acumy-ask__spinner {
    display: inline-block;
    width: .875rem;
    height: .875rem;
    border-radius: 50%;
    border: 2px solid #BFDBFE;
    border-top-color: var(--acumy-blue);
    animation: acumy-spin 900ms linear infinite;
}

.acumy-ask__failed {
    display: flex;
    align-items: center;
    gap: .75rem;
    padding: .625rem .75rem;
    border: 1px solid var(--acumy-red);
    border-radius: 8px;
    background: var(--acumy-red-tint);
    font-size: .875rem;
}

.acumy-ask__failed span { flex-grow: 1; }

.acumy-ask__retry {
    min-height: 32px;
    padding: 0 .75rem;
    border: 1px solid var(--acumy-hairline-strong);
    border-radius: 8px;
    background: var(--acumy-surface);
    color: var(--acumy-ink);
    font: inherit;
    font-size: .8125rem;
    font-weight: 600;
    cursor: pointer;
}

.acumy-ask__in {
    padding: .875rem 1.125rem;
    border-top: 1px solid var(--acumy-hairline);
}

.acumy-ask__warn {
    margin-bottom: .625rem;
    padding: .5rem .625rem;
    border-radius: 8px;
    background: #FEF3C7;
    color: #92400E;
    font-size: .8125rem;
}

.acumy-ask__box {
    display: flex;
    align-items: flex-end;
    gap: .5rem;
    min-height: 44px;
    padding: .5rem .5rem .5rem .75rem;
    border: 1px solid var(--acumy-hairline-strong);
    border-radius: 10px;
}

.acumy-ask__box:focus-within { border-color: var(--acumy-blue); }

.acumy-ask__input {
    flex-grow: 1;
    align-self: center;
    max-height: 160px;
    min-height: 1.5rem;
    border: 0;
    outline: 0;
    resize: none;
    field-sizing: content;
    background: none;
    color: var(--acumy-ink);
    font: inherit;
    font-size: .875rem;
}

.acumy-ask__send {
    min-height: 34px;
    padding: 0 .875rem;
    border: 0;
    border-radius: 8px;
    background: var(--acumy-blue);
    color: #FFFFFF;
    font: inherit;
    font-size: .875rem;
    font-weight: 600;
    cursor: pointer;
}

.acumy-ask__send:disabled {
    border: 1px solid var(--acumy-hairline);
    background: var(--acumy-grey-tint);
    color: var(--acumy-ink-faint);
    cursor: default;
}

.acumy-ask__foot {
    margin-top: .5rem;
    font-size: .75rem;
    color: var(--acumy-ink-muted);
}

/* The Ask Acumy card on Company settings (AskSettings mockup). */
.acumy-askcard__body {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 300px;
    gap: 2rem;
    align-items: start;
    padding: .25rem 1.25rem 1rem;
}

.acumy-askcard__off {
    display: flex;
    flex-direction: column;
    gap: .375rem;
    padding: .875rem 1.25rem 1.125rem;
    font-size: .875rem;
    color: #334155;
}

.acumy-askcard__month {
    display: flex;
    flex-direction: column;
    gap: .75rem;
    margin-top: .625rem;
    padding: 1rem 1.125rem;
    border: 1px solid var(--acumy-hairline);
    border-radius: 12px;
    background: var(--acumy-surface);
}

.acumy-askcard__ring {
    display: flex;
    gap: .875rem;
    align-items: center;
}

/* The billing file's Set up: the main account field beside its Save. */
.acumy-billing-main { display: flex; align-items: flex-start; gap: .5rem; max-width: 26rem; }
.acumy-billing-main .mud-input-control { flex: 1 1 auto; }
.acumy-billing-main .mud-button-root { margin-top: .5rem; }

/* The billing file's Set up starts with a choice: an export the customer already has, or a new one. */
.acumy-setup-choice { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; }
.acumy-setup-choice__option {
    display: flex;
    flex-direction: column;
    gap: .25rem;
    padding: .75rem 1rem;
    border: 1px solid var(--acumy-border, #DCE3EC);
    border-radius: 10px;
    background: var(--acumy-surface);
    font: inherit;
    text-align: left;
    cursor: pointer;
}
.acumy-setup-choice__option:hover { border-color: var(--acumy-blue); }
.acumy-setup-choice__option--on { border-color: var(--acumy-blue); background: var(--acumy-blue-tint); box-shadow: inset 0 0 0 1px var(--acumy-blue); }
.acumy-setup-choice__title { font-weight: 600; color: var(--acumy-ink); }
.acumy-billing-fields { display: grid; grid-template-columns: 1fr 1fr; gap: .25rem .75rem; max-width: 40rem; }

/* ── Org views: org chart, limit flow, runway (docs/specs/org-views.md, docs/20-org-views.md) ──────────── */

button.acumy-segmented__option { border: 0; cursor: pointer; font: inherit; font-size: .8125rem; font-weight: 600; }
button.acumy-segmented__option + button.acumy-segmented__option { border-left: 1px solid var(--acumy-hairline-strong); }

.acumy-grow { flex-grow: 1; }

.acumy-org-controls { display: flex; align-items: center; gap: .5rem .75rem; flex-wrap: wrap; }
.acumy-org-search { max-width: 18rem; padding: .375rem .625rem; }
.acumy-org-legend { display: inline-flex; align-items: center; gap: .375rem; font-size: .8125rem; color: var(--acumy-ink-muted); }
.acumy-org-legend i { display: inline-block; width: 10px; height: 10px; border-radius: 3px; }

/* Limit use compares spend with the customer's own limit: their policy, not Acumy's opinion. */
.acumy-orgtone--under { fill: var(--acumy-green); background: var(--acumy-green); }
.acumy-orgtone--near { fill: var(--acumy-amber); background: var(--acumy-amber); }
.acumy-orgtone--over { fill: var(--acumy-red); background: var(--acumy-red); }
.acumy-orgtone--none { fill: var(--acumy-grey); background: var(--acumy-grey); }
/* The other modes judge nothing, so they are shades and neutral hues. */
.acumy-orgtone--spend { fill: var(--acumy-series-1); background: var(--acumy-series-1); }
.acumy-orgtone--up { fill: var(--acumy-series-7); background: var(--acumy-series-7); }
.acumy-orgtone--down { fill: var(--acumy-series-1); background: var(--acumy-series-1); }
.acumy-orgtone--owners { fill: var(--acumy-series-5); background: var(--acumy-series-5); }

.acumy-org-layout { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 1rem; align-items: start; }
@media (max-width: 1100px) { .acumy-org-layout { grid-template-columns: 1fr; } }

.acumy-org-canvas { background: var(--acumy-surface); border: 1px solid var(--acumy-hairline); border-radius: 12px; padding: 12px; overflow: auto; max-height: 75vh; }
.acumy-org-side { background: var(--acumy-surface); border: 1px solid var(--acumy-hairline); border-radius: 12px; padding: 16px 18px; }

.acumy-orgchart__svg { display: block; font-family: inherit; }
.acumy-orgchart__line { fill: none; stroke: var(--acumy-hairline-strong); stroke-width: 1.5; }
.acumy-orgchart__box { cursor: pointer; outline: none; }
.acumy-orgchart__card { fill: var(--acumy-surface); stroke: var(--acumy-hairline); stroke-width: 1; }
.acumy-orgchart__box:hover .acumy-orgchart__card,
.acumy-orgchart__box:focus-visible .acumy-orgchart__card { stroke: var(--acumy-blue); }
.acumy-orgchart__box.is-chosen .acumy-orgchart__card { stroke: var(--acumy-blue); stroke-width: 2.5; }
.acumy-orgchart__box.is-found .acumy-orgchart__card { fill: var(--acumy-amber-tint); }
.acumy-orgchart__name { font-size: 14px; font-weight: 700; fill: var(--acumy-ink); }
.acumy-orgchart__who { font-size: 12px; fill: var(--acumy-ink-muted); }
.acumy-orgchart__who.is-warn { fill: var(--acumy-amber); font-weight: 600; }
.acumy-orgchart__track { fill: var(--acumy-grey-tint); }
.acumy-orgchart__figure { font-size: 12px; fill: var(--acumy-ink); }
.acumy-orgchart__more { cursor: pointer; }
.acumy-orgchart__more-pill { fill: var(--acumy-blue-tint); stroke: var(--acumy-blue); stroke-opacity: .3; }
.acumy-orgchart__more-text { font-size: 12px; font-weight: 600; fill: var(--acumy-blue); }

.acumy-org-panel__kind { margin: 0; font-size: .75rem; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--acumy-ink-muted); }
.acumy-org-panel__name { margin: .25rem 0; font-size: 1.125rem; }
.acumy-org-panel__who { margin: 0 0 .75rem; font-size: .875rem; color: var(--acumy-ink-muted); }
.acumy-org-panel__who.is-warn { color: var(--acumy-amber); font-weight: 600; }
.acumy-org-panel__facts { display: grid; grid-template-columns: 8rem 1fr; gap: .375rem .75rem; margin: 0 0 1rem; font-size: .875rem; }
.acumy-org-panel__facts dt { color: var(--acumy-ink-muted); }
.acumy-org-panel__facts dd { margin: 0; font-weight: 600; }
.acumy-org-panel__label { margin: .75rem 0 .25rem; font-size: .75rem; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--acumy-ink-muted); }
.acumy-org-panel__list { list-style: none; margin: 0; padding: 0; }
.acumy-org-panel__list li { display: flex; align-items: center; gap: .5rem; padding: .5rem 0; border-top: 1px solid var(--acumy-hairline); font-size: .875rem; }
.acumy-org-panel__child { background: none; border: 0; padding: 0; font: inherit; font-weight: 600; cursor: pointer; text-align: left; }
.acumy-org-panel__warn { margin: .75rem 0; padding: .625rem .75rem; border-radius: 8px; background: var(--acumy-amber-tint); color: var(--acumy-ink); font-size: .875rem; }
.acumy-org-panel__actions { display: flex; gap: .5rem; margin-top: 1rem; }

.acumy-flow__table td { vertical-align: top; cursor: pointer; }
.acumy-flow__table tr.is-chosen td { background: var(--acumy-blue-tint); }
.acumy-flow__swatch { display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-right: .375rem; vertical-align: baseline; }
.acumy-flow__bar { position: relative; display: flex; min-width: 16rem; height: 22px; border-radius: 6px; overflow: visible; background: var(--acumy-grey-tint); }
.acumy-flow__seg { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; padding: 0 .375rem; font-size: .75rem; line-height: 22px; color: #fff; border-right: 2px solid var(--acumy-surface); }
.acumy-flow__seg--1 { background: var(--acumy-series-1); }
.acumy-flow__seg--2 { background: var(--acumy-series-2); }
.acumy-flow__seg--3 { background: var(--acumy-series-3); }
.acumy-flow__seg--4 { background: var(--acumy-series-4); }
.acumy-flow__seg--5 { background: var(--acumy-series-5); }
.acumy-flow__seg--6 { background: var(--acumy-series-6); }
.acumy-flow__seg--7 { background: var(--acumy-series-7); }
.acumy-flow__seg--free { color: var(--acumy-ink-muted); background: repeating-linear-gradient(45deg, var(--acumy-grey-tint), var(--acumy-grey-tint) 4px, var(--acumy-surface) 4px, var(--acumy-surface) 8px); }
.acumy-flow__mark { position: absolute; top: -4px; bottom: -4px; width: 2px; background: var(--acumy-ink); }
.acumy-flow__warn { color: var(--acumy-amber); font-weight: 600; }
.acumy-flow__under { color: var(--acumy-ink-muted); font-size: .75rem; border-top: 0 !important; padding: .125rem 0 !important; }

.acumy-runway-chart__svg { width: 100%; height: auto; display: block; }
.acumy-runway-chart__grid { stroke: var(--acumy-hairline); }
.acumy-runway-chart__limit { stroke: var(--acumy-ink); stroke-width: 2.5; }
.acumy-runway-chart__axis-title { font-size: 11px; font-weight: 600; fill: var(--acumy-ink-muted); }
.acumy-runway-chart__base { stroke: var(--acumy-hairline-strong); }
.acumy-runway-chart__today { stroke: var(--acumy-hairline-strong); stroke-dasharray: 2 3; }
.acumy-runway-chart__tick { font-size: 11px; fill: var(--acumy-ink-muted); }
.acumy-runway-chart__label { font-size: 12px; font-weight: 600; }
.acumy-runway-chart__solid { fill: none; stroke-width: 2.5; }
.acumy-runway-chart__dashed { stroke-width: 2; stroke-dasharray: 5 4; }
.acumy-runway-chart__s1 { stroke: var(--acumy-series-1); fill: var(--acumy-series-1); }
.acumy-runway-chart__s2 { stroke: var(--acumy-series-2); fill: var(--acumy-series-2); }
.acumy-runway-chart__s3 { stroke: var(--acumy-series-3); fill: var(--acumy-series-3); }
.acumy-runway-chart__s4 { stroke: var(--acumy-series-4); fill: var(--acumy-series-4); }
.acumy-runway-chart__s5 { stroke: var(--acumy-series-5); fill: var(--acumy-series-5); }
.acumy-runway-chart__s6 { stroke: var(--acumy-series-6); fill: var(--acumy-series-6); }
.acumy-runway-chart__s1 .acumy-runway-chart__solid, .acumy-runway-chart__s2 .acumy-runway-chart__solid, .acumy-runway-chart__s3 .acumy-runway-chart__solid,
.acumy-runway-chart__s4 .acumy-runway-chart__solid, .acumy-runway-chart__s5 .acumy-runway-chart__solid, .acumy-runway-chart__s6 .acumy-runway-chart__solid { fill: none; }
.acumy-runway-chart__label { stroke: none; }
.acumy-runway-chart__key { display: inline-block; width: 18px; height: 0; border-top: 2.5px solid var(--acumy-ink); margin-right: .375rem; vertical-align: middle; }
.acumy-runway-chart__key--dashed { border-top-style: dashed; }
.acumy-runway-choose { display: grid; grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr)); gap: .25rem .75rem; margin-bottom: .75rem; }

.acumy-flow-svg { display: block; font-family: inherit; }
.acumy-flow-svg__band { fill: var(--acumy-series-1); fill-opacity: .18; stroke: none; }
.acumy-flow-svg__band:hover { fill-opacity: .4; }
.acumy-flow-svg__node { cursor: pointer; }
.acumy-flow-svg__box { fill: var(--acumy-series-1); }
.acumy-flow-svg__label { font-size: 12px; font-weight: 600; fill: var(--acumy-ink); }
.acumy-flow-svg__amount { font-weight: 400; fill: var(--acumy-ink-muted); }
.acumy-flow-svg__column { font-size: 11px; font-weight: 600; letter-spacing: .04em; fill: var(--acumy-ink-muted); }

.acumy-treemap { display: block; font-family: inherit; }
.acumy-treemap__cell { cursor: pointer; }
.acumy-treemap__name { font-size: 13px; font-weight: 700; fill: #fff; }
.acumy-treemap__figure { font-size: 12px; fill: #fff; }

.acumy-heatmap { display: block; font-family: inherit; }
.acumy-heatmap__cell { fill: var(--acumy-series-7); stroke: none; }
.acumy-heatmap__cell.is-working { stroke: var(--acumy-ink); stroke-width: 1.5; }
.acumy-heatmap__key { display: inline-block; width: 12px; height: 12px; border: 1.5px solid var(--acumy-ink); border-radius: 3px; margin-right: .375rem; vertical-align: middle; }

.acumy-saving-list { list-style: none; margin: 0; padding: 0; }
.acumy-saving-list li { display: flex; align-items: center; gap: .75rem; padding: .625rem 1rem; border-top: 1px solid var(--acumy-hairline); font-size: .875rem; }
.acumy-saving-note { display: flex; flex-direction: column; gap: .125rem; padding: .625rem 0; border-top: 1px solid var(--acumy-hairline); font-size: .875rem; }
.acumy-saved-bars { display: flex; align-items: flex-end; gap: .75rem; height: 140px; margin-top: .5rem; }
.acumy-saved-bars__col { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; height: 100%; gap: .25rem; }
.acumy-saved-bars__bar { width: 100%; max-width: 3rem; border-radius: 4px 4px 0 0; background: var(--acumy-green); }
.acumy-saved-bars__bar.is-to-date { background: repeating-linear-gradient(45deg, var(--acumy-green), var(--acumy-green) 4px, var(--acumy-green-tint) 4px, var(--acumy-green-tint) 8px); }
.acumy-saved-bars__figure { font-size: .75rem; font-weight: 600; }
.acumy-saved-bars__label { font-size: .75rem; color: var(--acumy-ink-muted); }

/* ── Navigation B: the sidebar lists every page under its area (docs/10-navigation.md) ──────────
   Only the current area is open: its pages sit below it on a thin line, the current one lit. */
.acumy-nav {
    display: flex;
    flex-direction: column;
    gap: .125rem;
    padding: 0 .75rem;
}

.acumy-nav__item {
    display: flex;
    align-items: center;
    gap: .75rem;
    min-height: 40px;
    padding: 0 .75rem;
    border-radius: 8px;
    color: var(--acumy-sidebar-ink);
    font-size: .875rem;
    text-decoration: none;
}

    .acumy-nav__item:hover { background: rgba(255, 255, 255, .06); color: var(--acumy-sidebar-ink-active); text-decoration: none; }

.acumy-nav__item--open { color: var(--acumy-sidebar-ink-active); font-weight: 600; }

.acumy-nav__item--current {
    background: var(--acumy-sidebar-active);
    color: var(--acumy-sidebar-ink-active);
    font-weight: 600;
}

.acumy-nav__icon { flex: none; }
.acumy-nav__caption { flex: 1 1 auto; }
.acumy-nav__chevron { flex: none; opacity: .7; }

.acumy-nav__pages {
    display: flex;
    flex-direction: column;
    gap: .125rem;
    margin: .125rem 0 .5rem 1.375rem;
    padding-left: .5rem;
    border-left: 1px solid rgba(255, 255, 255, .14);
}

.acumy-nav__page {
    display: flex;
    align-items: center;
    min-height: 32px;
    padding: 0 .75rem;
    border-radius: 8px;
    color: var(--acumy-sidebar-ink);
    font-size: .8125rem;
    text-decoration: none;
}

    .acumy-nav__page:hover { background: rgba(255, 255, 255, .06); color: var(--acumy-sidebar-ink-active); text-decoration: none; }

.acumy-nav__page--current,
.acumy-nav__page--current:hover {
    background: var(--acumy-blue);
    color: #FFFFFF;
    font-weight: 600;
}

.acumy-nav__page .acumy-nav-badge { margin-left: auto; }

/* A count nobody is waiting on, such as Done by Acumy: grey, never amber (suggestions 1, item 4). */
.acumy-nav-badge--count { background: var(--acumy-grey); }

/* ── The cloud picker: a filter in the page header, not a place to go (NavPicker mockup) ─────── */
.acumy-cloudpicker { position: relative; }

.acumy-cloudpicker__button {
    display: inline-flex;
    align-items: stretch;
    min-height: 40px;
    padding: 0;
    border: 1px solid var(--acumy-hairline-strong);
    border-radius: 8px;
    background: var(--acumy-surface);
    color: var(--acumy-ink);
    font: inherit;
    font-size: .875rem;
    cursor: pointer;
}

.acumy-cloudpicker__label {
    display: inline-flex;
    align-items: center;
    padding: 0 .75rem;
    border-right: 1px solid var(--acumy-hairline-strong);
    color: var(--acumy-ink-muted);
    font-size: .75rem;
    font-weight: 600;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.acumy-cloudpicker__value {
    display: inline-flex;
    align-items: center;
    gap: .375rem;
    padding: 0 .625rem 0 .75rem;
    font-weight: 600;
    white-space: nowrap;
}

.acumy-cloudpicker__scrim { position: fixed; inset: 0; z-index: 20; }

.acumy-cloudpicker__menu {
    position: absolute;
    top: calc(100% + .375rem);
    right: 0;
    z-index: 21;
    width: 320px;
    padding: .5rem .875rem .625rem;
    background: var(--acumy-surface);
    border: 1px solid var(--acumy-hairline-strong);
    border-radius: 12px;
    box-shadow: 0 12px 32px rgba(15, 23, 42, .16);
}

.acumy-cloudpicker__row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
}

.acumy-cloudpicker__tick {
    display: flex;
    align-items: center;
    gap: .625rem;
    min-height: 38px;
    font-size: .875rem;
}

.acumy-cloudpicker__tick--all {
    font-weight: 600;
    border-bottom: 1px solid var(--acumy-hairline);
    margin-bottom: .25rem;
}

.acumy-cloudpicker__only { font-size: .75rem; color: var(--acumy-blue); }

.acumy-cloudpicker__note {
    margin: .375rem 0 0;
    padding-top: .5rem;
    border-top: 1px solid var(--acumy-hairline);
    color: var(--acumy-ink-muted);
    font-size: .75rem;
}

/* A count waiting on one of a page's views, such as Approvals → Inbox. */
.acumy-segmented__badge {
    display: inline-block;
    min-width: 1.125rem;
    margin-left: .375rem;
    padding: 0 .3rem;
    border-radius: 999px;
    background: var(--acumy-amber);
    color: #FFFFFF;
    font-size: .6875rem;
    line-height: 1.125rem;
    text-align: center;
}

/* The page a tile's figure is listed on: "Open Workspaces →". An Overview teaches where things are. */
.acumy-kpi-link {
    display: inline-block;
    margin-top: .5rem;
    color: var(--acumy-blue);
    font-size: .8125rem;
    font-weight: 600;
    text-decoration: none;
}

    .acumy-kpi-link:hover { text-decoration: underline; }

/* Home's "Try this" card (usability-1 item 2): a task per line, ticked once its page has been opened. */
.acumy-try { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .5rem; }
.acumy-try__task { display: flex; align-items: center; gap: .625rem; font-size: .875rem; }
.acumy-try__mark { color: var(--acumy-ink-faint); }
.acumy-try__task--done .acumy-try__mark { color: var(--acumy-green); }
.acumy-try__task--done a { color: var(--acumy-ink-muted); text-decoration: line-through; }
.acumy-try__done { margin: 0; font-size: .875rem; }

/* ── Intent and agents (db/changes/233) ───────────────────────────────────────────────────────── */

/* Home's lifecycle strip: five stages in order, one count each. A stage with no source is grey. */
.acumy-lifecycle { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: .5rem; margin-bottom: 1rem; }
.acumy-lifecycle__stage {
    display: flex; flex-direction: column; gap: .125rem; padding: .75rem 1rem; text-decoration: none; color: var(--acumy-ink);
    background: var(--acumy-surface); border: 1px solid var(--acumy-hairline); border-top: 3px solid var(--acumy-blue); border-radius: 10px;
}
.acumy-lifecycle__stage--none { border-top-color: var(--acumy-hairline-strong); background: var(--acumy-grey-tint); color: var(--acumy-ink-faint); }
.acumy-lifecycle__name { font-size: .75rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--acumy-ink-muted); }
.acumy-lifecycle__count { font-size: 1.5rem; font-weight: 700; }
.acumy-lifecycle__caption { font-size: .75rem; color: var(--acumy-ink-muted); }
@media (max-width: 900px) { .acumy-lifecycle { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* The intent form's two-way choices sit on one line. */
.acumy-intent-form__choice { display: flex; gap: .5rem; flex-wrap: wrap; margin-bottom: .375rem; }
.acumy-intent-form__choice .acumy-choice { padding: .25rem .75rem; }
.acumy-intent__agent { vertical-align: text-bottom; color: var(--acumy-ink-muted); }
.acumy-agent-identifier { display: flex; flex-direction: column; gap: .375rem; margin-top: .375rem; max-width: 28rem; }
.acumy-row--off td { color: var(--acumy-ink-faint); }

/* A stage holds one or two counts, each its own link (239: Intent's unassigned resources). */
.acumy-lifecycle__part { display: flex; align-items: baseline; gap: .375rem; text-decoration: none; color: inherit; flex-wrap: wrap; }
a.acumy-lifecycle__part[href]:hover .acumy-lifecycle__caption { color: var(--acumy-blue); text-decoration: underline; }
.acumy-lifecycle__part--second .acumy-lifecycle__count { font-size: 1rem; }

/* ── Side panels stay in view (usability 2, 7 Oct 2026; CLAUDE.md) ─────────────────────────────────
   On a page with a list and a panel beside it, the panel stays on screen while the list scrolls.
   A panel taller than the window scrolls in its own box. Below the breakpoint the columns stack and
   nothing sticks. */
@media (min-width: 1101px) {
    .acumy-org-layout > :last-child,
    .acumy-orgsplit > :last-child,
    .acumy-master-detail > :last-child {
        position: sticky;
        top: 1rem;
        max-height: calc(100vh - 2rem);
        overflow-y: auto;
    }
}

.acumy-try__again { margin: 0 0 1rem; font-size: .875rem; }

/* Limit flow: a row with no limit of its own says whose it uses, short and grey (usability 2, item 6). */
.acumy-flow__uses { margin-left: .375rem; font-size: .8125rem; color: var(--acumy-ink-muted); }

/* A choice in a picker with its description under it (Limit policies → To; usability 2, item 6). */
.acumy-select-option { display: flex; flex-direction: column; gap: 2px; padding: 2px 0; white-space: normal; }
.acumy-select-option__detail { font-size: .75rem; color: var(--acumy-ink-muted); line-height: 1.3; }

/* Money flow: the bands stretch with the page; the words stay at the page's own size (usability 2, item 7). */
.acumy-flowchart { position: relative; min-width: 640px; }
.acumy-flowchart .acumy-flow-svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.acumy-flowchart__column { position: absolute; top: 0; font-size: 11px; font-weight: 600; letter-spacing: .04em; color: var(--acumy-ink-muted); }
.acumy-flowchart__label { position: absolute; font: inherit; font-size: 13px; font-weight: 600; color: var(--acumy-ink); background: transparent;
    border: 0; padding: 0; cursor: pointer; white-space: nowrap; line-height: 18px; text-align: left; }
.acumy-flowchart__label:hover { text-decoration: underline; }
.acumy-flowchart__amount { margin-left: .375rem; font-weight: 400; color: var(--acumy-ink-muted); }
.acumy-flowchart__at-end { text-align: right; margin-right: 20px; }
.acumy-flowchart__ends { position: absolute; left: 0; top: 18px; font-size: 12px; font-weight: 400; color: var(--acumy-ink-muted); }
.acumy-flowchart .acumy-flow-svg__box { cursor: pointer; }

/* Questions, not reports (usability 2, item 8): the answer under a view's question, and Save this question. */
.acumy-page-answer { margin: .5rem 0 0; padding: .625rem .875rem; border-left: 3px solid var(--acumy-series-1);
    background: var(--acumy-surface); border-radius: 0 8px 8px 0; font-size: 1rem; font-weight: 400; color: var(--acumy-ink); max-width: 72rem; }
.acumy-save-question { font: inherit; font-size: .875rem; font-weight: 600; color: var(--acumy-blue); background: transparent;
    border: 0; padding: 0 .25rem; cursor: pointer; white-space: nowrap; }
.acumy-save-question:hover { text-decoration: underline; }
.acumy-other-questions { margin-top: 1.5rem; }
.acumy-question-list { list-style: none; margin: 0; padding: 0; }
.acumy-question-list__item { display: flex; align-items: baseline; gap: 1rem; padding: .625rem 0; border-top: 1px solid var(--acumy-hairline); }
.acumy-question-list__item:first-child { border-top: 0; }
.acumy-question-list__text { flex: 1 1 auto; font-weight: 600; }
.acumy-question-list__answer { text-align: right; }
.acumy-question-list__figure { font-weight: 700; }
.acumy-question-list__detail { display: block; font-size: .75rem; color: var(--acumy-ink-muted); }
.acumy-home-questions { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); gap: 1rem; margin-bottom: 1rem; }
@media (max-width: 1100px) { .acumy-home-questions { grid-template-columns: 1fr; } }

/* A wide table beside a side panel scrolls in its own column rather than under the panel. */
.acumy-org-layout > * { min-width: 0; }
.acumy-org-layout > .acumy-flow { overflow-x: auto; }

/* ── Peek: a short look at one thing over the page (8 Oct 2026) ──────────────────────────────── */

.acumy-peek__kind {
    color: var(--acumy-ink-muted);
    font-size: .75rem;
    font-weight: 600;
}

.acumy-peek__title {
    color: var(--acumy-ink);
    font-size: 1.125rem;
    font-weight: 600;
}

.acumy-peek__facts {
    display: grid;
    grid-template-columns: max-content 1fr;
    gap: .375rem 1rem;
    margin: 0 0 1rem;
    font-size: .875rem;
}

    .acumy-peek__facts dt {
        color: var(--acumy-ink-muted);
    }

    .acumy-peek__facts dd {
        margin: 0;
        color: var(--acumy-ink);
    }

.acumy-peek__list-title {
    margin: 0 0 .25rem;
    color: var(--acumy-ink-muted);
    font-size: .75rem;
    font-weight: 600;
}

.acumy-peek__list {
    margin: 0;
    padding: 0;
    list-style: none;
    font-size: .875rem;
}

    .acumy-peek__list li {
        display: flex;
        gap: .75rem;
        padding: .3125rem 0;
        border-bottom: 1px solid var(--acumy-hairline);
    }

.acumy-peek__detail {
    margin-left: auto;
    color: var(--acumy-ink-muted);
    white-space: nowrap;
}

/* ── One List, one View, one Edit (usability 3, item 1; mockups ObjPeople, ObjPersonView, ObjGroupView) ─────── */

.acumy-grid__title { font-size: 1rem; font-weight: 600; color: var(--acumy-ink); white-space: nowrap; }
.acumy-grid__spacer { flex: 1 1 auto; }

.acumy-row-icons__set { display: inline-flex; align-items: center; gap: 2px; justify-content: flex-end; }
.acumy-row-icons__set .mud-icon-button { color: var(--acumy-ink-muted); }
.acumy-row-icons__set .acumy-row-icons__remove,
.mud-menu-item.acumy-row-icons__remove,
.mud-menu-item.acumy-row-icons__remove .mud-icon-root { color: var(--acumy-red); }
.acumy-row-icons__detail { font-size: .75rem; color: var(--acumy-ink-muted); white-space: normal; max-width: 260px; }

.acumy-table-see-all { padding: .5rem 1rem; text-align: right; font-size: .875rem; font-weight: 600; }

/* A role, a status or a team as a small chip that opens something. */
.acumy-chip-link { display: inline-flex; align-items: center; gap: 4px; font-size: .75rem; font-weight: 600; padding: 2px 10px; border-radius: 999px;
    background: var(--acumy-blue-tint); color: var(--acumy-blue); border: 1px solid #BFDBFE; margin: 0 4px 2px 0; white-space: nowrap; text-decoration: none; }
.acumy-chip-link:hover { text-decoration: none; background: #DBEAFE; }

/* The View: the peek's header and footer, and its compact sections. */
.mud-dialog.acumy-view-dialog { max-width: 760px; }
.acumy-view__head { display: flex; align-items: center; gap: 14px; }
.acumy-view__who { flex: 1 1 auto; min-width: 0; }
.acumy-view__name { font-size: 1.125rem; font-weight: 700; color: var(--acumy-ink); }
.acumy-view__line { font-size: .8125rem; color: var(--acumy-ink-muted); display: flex; flex-wrap: wrap; align-items: center; gap: .375rem; }
.acumy-view__full { display: inline-flex; align-items: center; gap: 6px; font-size: .875rem; font-weight: 600; color: var(--acumy-blue); white-space: nowrap; margin-right: 2rem; }
.acumy-view__spacer { flex: 1 1 auto; }
.acumy-view--dialog { display: flex; flex-direction: column; gap: 6px; }
.acumy-view__sec { border-top: 1px solid var(--acumy-hairline); padding-top: 14px; margin-top: 8px; }
.acumy-view__sec:first-child { border-top: 0; margin-top: 0; padding-top: 4px; }
.acumy-view__sec-head { margin: 0 0 8px; font-size: .875rem; font-weight: 600; display: flex; align-items: center; gap: 8px; color: var(--acumy-ink); }
.acumy-view__sec--at { background: var(--acumy-blue-tint); border: 1px solid #BFDBFE; border-radius: 10px; padding: 14px; margin-top: 12px; }
.acumy-view__sec .acumy-table-scroll, .acumy-view__sec .acumy-grid__toolbar { margin: 0 -4px; }
.acumy-view__section--at > .acumy-panel { border-color: var(--acumy-blue); box-shadow: 0 0 0 3px var(--acumy-blue-tint); }
.acumy-view--card .acumy-view__head { padding: 16px 20px 12px; border-bottom: 1px solid var(--acumy-hairline); }
.acumy-view--card .acumy-view__body { padding: 8px 20px 16px; }
.acumy-avatar--large { width: 44px; height: 44px; font-size: 15px; }
.acumy-pager { display: flex; align-items: center; justify-content: flex-end; gap: .25rem; padding: .375rem 1rem; font-size: .8125rem; color: var(--acumy-ink-muted); border-top: 1px solid var(--acumy-hairline); }
.acumy-avatar-link { text-decoration: none; color: inherit; }
.acumy-avatar-link:hover { text-decoration: none; }
.acumy-avatar-link:hover .acumy-avatar-line__name { text-decoration: underline; color: var(--acumy-blue); }
/* A link that looks like an outlined button: Needs you's "Open", which opens a peek. */
.acumy-button-link { display: inline-flex; align-items: center; justify-content: center; min-height: 36px; padding: 0 16px; border: 1px solid var(--acumy-hairline-strong);
    border-radius: 6px; font-size: .875rem; font-weight: 500; color: var(--acumy-ink); background: var(--acumy-surface); text-decoration: none; white-space: nowrap; }
.acumy-button-link:hover { background: var(--acumy-grey-tint); text-decoration: none; }
.acumy-person-cell { display: flex; align-items: center; gap: 10px; }
.acumy-view__icon { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 999px; background: var(--acumy-blue-tint); color: var(--acumy-blue); flex-shrink: 0; }
.acumy-view__actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
/* The row a link was about, such as one agent a spend limit names. */
tr.acumy-row--at > td, .acumy-row--at { background: var(--acumy-blue-tint); }

/* Home: when its company-wide spend figures were read, and reading them again (usability 5, item 2). */
.acumy-home-asof { margin: 0 0 12px; font-size: 13px; color: var(--acumy-ink-muted); text-align: right; }
.acumy-home-reading { display: flex; align-items: center; gap: 8px; }

/* A question and its answer in one sentence (QAnswer, option A; usability 5, item 3). */
.acumy-page-answer b { font-weight: 700; }
.acumy-qa { border-top: 1px solid var(--acumy-hairline); }
.acumy-qa:first-child { border-top: 0; }
.acumy-qa__link { display: block; padding: .75rem 0; color: var(--acumy-ink); text-decoration: none; }
.acumy-qa__link:hover { text-decoration: none; background: var(--acumy-grey-tint); }
.acumy-qa__q { display: block; font-size: .8125rem; color: var(--acumy-ink-muted); margin-bottom: .25rem; }
.acumy-qa__a { display: block; font-size: 1rem; line-height: 1.45; }
.acumy-qa__a b { font-weight: 700; }
.acumy-qa__go { display: inline-block; margin-top: .25rem; font-size: .8125rem; font-weight: 600; color: var(--acumy-blue); }

/* Tags (tags batch 1). A purpose chip is coloured by a chart series: identity only, never judgement. */
.acumy-purpose { display: inline-flex; align-items: center; gap: 6px; padding: 2px 10px; border-radius: 999px; font-size: .75rem; font-weight: 600; white-space: nowrap; }
.acumy-purpose::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.acumy-purpose--series-1 { color: var(--acumy-series-1); background: color-mix(in srgb, var(--acumy-series-1) 12%, transparent); }
.acumy-purpose--series-2 { color: var(--acumy-series-2); background: color-mix(in srgb, var(--acumy-series-2) 12%, transparent); }
.acumy-purpose--series-3 { color: var(--acumy-series-3); background: color-mix(in srgb, var(--acumy-series-3) 12%, transparent); }
.acumy-purpose--series-4 { color: var(--acumy-series-4); background: color-mix(in srgb, var(--acumy-series-4) 14%, transparent); }
.acumy-purpose--series-5 { color: var(--acumy-series-5); background: color-mix(in srgb, var(--acumy-series-5) 12%, transparent); }
.acumy-purpose--series-6 { color: var(--acumy-series-6); background: color-mix(in srgb, var(--acumy-series-6) 12%, transparent); }
.acumy-purpose--series-7 { color: var(--acumy-series-7); background: color-mix(in srgb, var(--acumy-series-7) 12%, transparent); }
.acumy-purpose--grey { color: var(--acumy-grey); background: var(--acumy-grey-tint); }

.acumy-purpose-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 16px; }
.acumy-purpose-card { border: 1px solid var(--acumy-hairline); border-radius: 10px; padding: 14px 18px; display: flex; flex-direction: column; gap: 10px; font-size: .875rem; }
.acumy-purpose-card__head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.acumy-purpose-card__keys { font-size: .8125rem; color: var(--acumy-ink-muted); }
.acumy-purpose-card__bar { display: flex; align-items: center; gap: 12px; }
.acumy-purpose-card__bar .acumy-bar { flex: 1; }
.acumy-bar__fill--green { background: var(--acumy-green); }

.acumy-link--danger, .acumy-link--danger:hover { color: var(--acumy-red); }
.acumy-row--alarm > td { background: var(--acumy-red-tint); }
.acumy-text-amber { color: var(--acumy-amber); }
.acumy-muted { color: var(--acumy-ink-muted); }
.acumy-suggests { color: var(--acumy-green); }
.acumy-text-red { color: var(--acumy-red); }
.acumy-nearmiss { background: var(--acumy-amber-tint); border: 1px solid color-mix(in srgb, var(--acumy-amber) 35%, transparent); border-radius: 12px; }
.acumy-nearmiss__title { margin: 0; padding: 14px 20px; font-size: 1rem; border-bottom: 1px solid color-mix(in srgb, var(--acumy-amber) 25%, transparent); }
.acumy-nearmiss__row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 20px; font-size: .875rem; }
.acumy-nearmiss__row + .acumy-nearmiss__row { border-top: 1px solid color-mix(in srgb, var(--acumy-amber) 25%, transparent); }

/* "ProjId = FINCUR is on 3 resources, but there is no project FINCUR": a suggestion waiting for a person, as the near-misses (TagValueSuggestions). */
.acumy-tag-create { background: var(--acumy-amber-tint); border: 1px solid color-mix(in srgb, var(--acumy-amber) 35%, transparent); border-radius: 12px; }
.acumy-tag-create__title { margin: 0; padding: 14px 20px; font-size: 1rem; border-bottom: 1px solid color-mix(in srgb, var(--acumy-amber) 25%, transparent); }
.acumy-tag-create__row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 20px; font-size: .875rem; }
.acumy-tag-create__row + .acumy-tag-create__row { border-top: 1px solid color-mix(in srgb, var(--acumy-amber) 25%, transparent); }
.acumy-tag-create .mud-alert { margin: 10px 20px 0; }

/* "Found by tag: EmpId = E1012  employee = E1012": the tags that find a thing, on one wrapped line (FoundByTagRow). */
.acumy-found-by { display: flex; flex-wrap: wrap; gap: .25rem 1rem; }
.acumy-found-by__tag { display: inline-flex; align-items: baseline; gap: .35rem; white-space: nowrap; }

/* Something working on a sidebar item: a discovery running (ITabActivity). Blue with a pulsing dot, never the amber
   number, because working needs patience and waiting needs action. It is its own link, over the item's right end. */
.acumy-nav__area { position: relative; }
.acumy-nav-working {
    position: absolute;
    top: 20px;
    right: .75rem;
    transform: translateY(-50%);
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    padding: 0 .45rem;
    border-radius: 999px;
    background: var(--acumy-blue);
    color: #FFFFFF;
    font-size: .7rem;
    font-weight: 600;
    line-height: 1.25rem;
    text-decoration: none;
    z-index: 1;
}
.acumy-nav-working--chevron { right: 2.25rem; }
.acumy-nav-working:hover { text-decoration: underline; color: #FFFFFF; }
.acumy-nav-working__dot {
    width: .45rem;
    height: .45rem;
    border-radius: 50%;
    background: #FFFFFF;
    animation: acumy-working-pulse 1.4s ease-in-out infinite;
}
@keyframes acumy-working-pulse { 0%, 100% { opacity: 1; } 50% { opacity: .3; } }
@media (prefers-reduced-motion: reduce) { .acumy-nav-working__dot { animation: none; } }

/* ── Suggestions from tags: Conflicts, Suggestions, Done by Acumy (suggestions 1, item 4) ──────── */
.acumy-new-chip {
    display: inline-block; margin-right: 6px; padding: 0 6px; border-radius: 999px;
    font-size: 11px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase;
    color: var(--acumy-green); background: var(--acumy-green-tint); vertical-align: 1px;
}
.acumy-lab { font-size: 12px; font-weight: 600; color: var(--acumy-ink-muted); text-transform: uppercase; letter-spacing: .04em; }
.acumy-sug-tags { white-space: normal; }
.acumy-sug-matches { font-size: 12px; color: var(--acumy-red); margin-top: 2px; }
.acumy-sug-note { font-size: 12px; color: var(--acumy-ink-muted); margin-top: 4px; max-width: 200px; }

/* The four cards over the one grid (suggestions 2, item 2): a card filters the grid; pressed again, it clears. */
.acumy-sug-groups { display: grid; grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr)); gap: 1rem; }
.acumy-sug-group {
    display: flex; flex-direction: column; align-items: flex-start; gap: 6px; padding: 14px 16px; text-align: left;
    font: inherit; color: inherit; cursor: pointer; background: var(--acumy-surface);
    border: 1px solid var(--acumy-hairline); border-radius: 12px; transition: border-color 120ms ease, box-shadow 120ms ease;
}
.acumy-sug-group:hover { border-color: var(--acumy-blue); box-shadow: 0 1px 6px rgb(15 23 42 / 8%); }
.acumy-sug-group--on { border-color: var(--acumy-blue); background: var(--acumy-blue-tint); }
.acumy-sug-group__name { font-size: 15px; font-weight: 700; color: var(--acumy-ink); }
.acumy-sug-group__counts { display: flex; gap: 16px; font-size: 13px; color: var(--acumy-ink-muted); }
.acumy-sug-group__counts b { font-size: 20px; color: var(--acumy-ink); margin-right: 3px; }
.acumy-sug-group__conflicts, .acumy-sug-group__counts .acumy-sug-group__conflicts b { color: var(--acumy-red); }
.acumy-sug-group__desc { font-size: 12px; color: var(--acumy-ink-faint); }
.acumy-sug-conflict {
    display: inline-block; margin-left: 6px; padding: 0 6px; border-radius: 999px; font-size: 11px; font-weight: 700;
    letter-spacing: .04em; text-transform: uppercase; color: var(--acumy-red); background: var(--acumy-red-tint); vertical-align: 1px;
}

/* History's decision words: what was said. Let owners decide is still waiting on people: amber. */
.acumy-sug-verdict { font-weight: 600; }
.acumy-tag-items-link { display: block; font-size: 12px; margin-top: 2px; }
.acumy-sug-decided { padding: 10px 14px; border: 1px solid var(--acumy-hairline); border-radius: 10px; background: var(--acumy-band); }
.acumy-sug-verdict--yes { color: var(--acumy-ink); }
.acumy-sug-verdict--no { color: var(--acumy-grey); }
.acumy-sug-verdict--waiting { color: var(--acumy-amber); }

/* Decide later is grey: it saves nothing. A decision that will save is blue. */
.acumy-sug-decision {
    display: inline-flex; align-items: center; gap: 4px; min-height: 34px; padding: 0 10px; border-radius: 8px;
    font: inherit; font-size: 13px; font-weight: 600; cursor: pointer; white-space: nowrap;
    color: var(--acumy-ink-faint); background: var(--acumy-surface); border: 1px solid var(--acumy-hairline-strong);
}
.acumy-sug-decision--set { color: var(--acumy-blue); border-color: var(--acumy-blue); background: var(--acumy-blue-tint); }
.acumy-sug-save { display: flex; justify-content: flex-end; align-items: center; gap: 10px; padding: 12px 0; }

/* Who was asked: Yes is a green tick, waiting an amber dot, No grey. */
.acumy-sug-owners { display: inline-flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.acumy-sug-owner { position: relative; display: inline-flex; align-items: center; gap: 8px; }
.acumy-sug-owner__face {
    display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 999px;
    font-size: 11px; font-weight: 700; color: var(--acumy-surface); background: var(--acumy-series-7);
}
.acumy-sug-owner__mark {
    position: absolute; left: 18px; top: 16px; width: 14px; height: 14px; border-radius: 999px;
    border: 2px solid var(--acumy-surface); display: inline-flex; align-items: center; justify-content: center; color: var(--acumy-surface);
}
.acumy-sug-owner__mark--yes { background: var(--acumy-green); }
.acumy-sug-owner__mark--waiting { background: var(--acumy-amber); }
.acumy-sug-owner__mark--no { background: var(--acumy-grey); }
.acumy-sug-owner__name { font-size: 13px; color: var(--acumy-ink); }

/* Choose value… */
.acumy-sug-choose__list { display: flex; flex-direction: column; gap: 2px; max-height: 260px; overflow-y: auto; margin-top: 8px;
    border: 1px solid var(--acumy-hairline); border-radius: 8px; padding: 4px; }
.acumy-sug-choose__list--short { max-height: 160px; }
.acumy-sug-choose__value { text-align: left; font: inherit; font-size: 14px; padding: 8px 10px; border: 0; border-radius: 6px; background: transparent; color: var(--acumy-ink); cursor: pointer; }
.acumy-sug-choose__value:hover { background: var(--acumy-band); }
.acumy-sug-choose__value--on { background: var(--acumy-blue-tint); color: var(--acumy-blue); font-weight: 600; }
.acumy-sug-choose__new { margin-top: 10px; display: flex; flex-direction: column; gap: 6px; }
.acumy-sug-choose__how { display: flex; gap: 18px; margin-top: 14px; }
.acumy-sug-radio { display: inline-flex; align-items: center; gap: 6px; font-size: 14px; }

/* A row opened */
.acumy-sug-view__head { display: flex; align-items: center; gap: 14px; }
.acumy-sug-neq {
    display: inline-flex; align-self: center; justify-content: center; align-items: center; width: 28px; height: 28px; flex-shrink: 0;
    border-radius: 999px; background: var(--acumy-red-tint); color: var(--acumy-red); font-weight: 700;
}
.acumy-sug-side { display: grid; grid-template-columns: minmax(0, 1fr) 40px minmax(0, 1fr); gap: 0; align-items: stretch; }
.acumy-sug-side > .acumy-sug-neq { justify-self: center; }
.acumy-sug-box { border: 1px solid var(--acumy-hairline); border-radius: 12px; padding: 16px; display: flex; flex-direction: column; gap: 8px; background: var(--acumy-surface); }
.acumy-sug-box--tags { border-color: var(--acumy-amber); }
.acumy-sug-box__value { font-size: 17px; font-weight: 700; color: var(--acumy-ink); }
.acumy-sug-bar { height: 10px; border-radius: 999px; background: var(--acumy-hairline); overflow: hidden; }
.acumy-sug-bar span { display: block; height: 100%; background: var(--acumy-series-7); }
.acumy-sug-bar--tags span { background: var(--acumy-amber); }
.acumy-sug-resources { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; font-size: 13px; }
.acumy-sug-radios { display: flex; flex-direction: column; gap: 10px; margin-top: 8px; }
.acumy-sug-option { display: block; border: 1px solid var(--acumy-hairline); border-radius: 12px; padding: 12px 16px; cursor: pointer; }
.acumy-sug-option--on { border-color: var(--acumy-blue); background: var(--acumy-blue-tint); }
.acumy-sug-option--off { opacity: .6; cursor: default; }
.acumy-sug-values { display: flex; flex-wrap: wrap; gap: 8px; }
.acumy-sug-value { font: inherit; font-size: 13px; font-weight: 600; padding: 6px 12px; border-radius: 8px; border: 1px solid var(--acumy-hairline-strong); background: var(--acumy-surface); color: var(--acumy-ink); cursor: pointer; }
.acumy-sug-value--on { border-color: var(--acumy-blue); color: var(--acumy-blue); }

/* Sub-workspaces: drag a resource to move it */
.acumy-sug-split { border: 1px solid var(--acumy-hairline-strong); border-radius: 12px; padding: 14px; }
.acumy-sug-split__title { font-weight: 700; margin-bottom: 10px; }
.acumy-sug-split__cols { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 12px; }
.acumy-sug-split__col { border: 1px dashed var(--acumy-hairline-strong); border-radius: 10px; padding: 10px; display: flex; flex-direction: column; gap: 6px; min-height: 120px; }
.acumy-sug-split__col--new { border-color: var(--acumy-blue); align-items: stretch; justify-content: center; }
.acumy-sug-split__colhead { font-size: 13px; margin-bottom: 4px; }
.acumy-sug-split__hint { text-align: center; font-size: 13px; color: var(--acumy-ink-muted); }
.acumy-sug-split__hint b { color: var(--acumy-blue); }
.acumy-sug-split__stay { margin-top: 12px; border: 1px dashed var(--acumy-hairline); border-radius: 10px; padding: 10px 14px; min-height: 60px; }
.acumy-sug-split__row { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
.acumy-sug-card {
    display: flex; align-items: center; gap: 6px; padding: 6px 10px; border: 1px solid var(--acumy-hairline); border-radius: 8px;
    background: var(--acumy-surface); font-size: 13px; cursor: grab;
}
.acumy-sug-card__grip { color: var(--acumy-ink-faint); }