@import '_content/Landbrugnet.Common.Components/Landbrugnet.Common.Components.cq9fqnxgh3.bundle.scp.css';

/* /Components/Layout/AdminLayout.razor.rz.scp.css */
/* Scoped to AdminLayout. Section (a) styles the layout's own chrome (topbar + sidebar + nav) with plain
   scoped selectors (NavLink renders child <a>s → reached via ::deep under .admin-nav). Section (b) is the
   shared admin-page pattern system rendered into @Body → reached via .admin-main ::deep. Section (c) is a
   temporary legacy block kept until every admin page is rewritten onto the section-(b) system.
   Global design-system primitives (buttons, cards, fields, badges, alerts) stay in wwwroot/css. */

/* =====================================================================
   a. Admin chrome (this component's own markup)
   ===================================================================== */

/* Mobile-first: tighter gap/padding so the topbar fits 320px screens without horizontal
   scroll; the ≥40rem block below restores the original desktop spacing (desktop unchanged). */
.admin-topbar[b-kk8vx94mea] {
    position: sticky;
    top: 0;
    z-index: var(--z-header);
    display: flex;
    align-items: center;
    gap: var(--sp-3);
    padding-inline: var(--sp-4);
    min-height: var(--header-h);
    min-width: 0;
    background: var(--surface);
    border-bottom: 1px solid var(--line);
}

.admin-topbar__brand[b-kk8vx94mea] {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
    font-family: var(--font-display);
    font-weight: 700;
    color: var(--ink-900);
    text-decoration: none;
    white-space: nowrap;
    flex-shrink: 0;
}

/* <40rem: only the favicon represents the brand — the wordmark text would overflow phones. */
.admin-topbar__brand span[b-kk8vx94mea] { display: none; }

.admin-topbar__user[b-kk8vx94mea] {
    margin-left: auto;
    display: flex;
    align-items: center;
    gap: var(--sp-3);
    white-space: nowrap;
    min-width: 0;
}

/* <40rem: the username is the least important topbar item — hide it, keep the logout link. */
.admin-topbar__username[b-kk8vx94mea] { display: none; }

@media (min-width: 40rem) {
    .admin-topbar[b-kk8vx94mea] {
        gap: var(--sp-4);
        padding-inline: var(--sp-5);
    }

    .admin-topbar__brand span[b-kk8vx94mea] { display: inline; }

    /* Capped + ellipsized so a long email can never push the logout link off-screen
       (the span is a flex item of .admin-topbar__user, so overflow applies). */
    .admin-topbar__username[b-kk8vx94mea] {
        display: inline-block;
        max-width: 16ch;
        overflow: hidden;
        text-overflow: ellipsis;
    }
}

.admin-shell[b-kk8vx94mea] {
    --admin-sidebar-w: 15rem;
    display: grid;
    grid-template-columns: 1fr;
    min-height: calc(100dvh - var(--header-h));
}

/* Mobile default: the sidebar is a popover drawer (hidden until the toggle opens it —
   [popover] elements are display:none by default in the UA stylesheet). */
.admin-sidebar:popover-open[b-kk8vx94mea] {
    position: fixed;
    inset: 0 auto 0 0;
    width: min(20rem, 85vw);
    height: 100dvh;
    margin: 0;
    border: 0;
    border-right: 1px solid var(--line);
    background: var(--surface);
    padding: var(--sp-5);
    z-index: var(--z-drawer);
    overflow-y: auto;
}

.admin-sidebar[b-kk8vx94mea]::backdrop { background: rgb(14 31 22 / 0.4); }

@media (min-width: 64rem) {
    .admin-shell[b-kk8vx94mea] { grid-template-columns: var(--admin-sidebar-w) 1fr; }

    .admin-nav-toggle[b-kk8vx94mea] { display: none; }

    /* Always-visible sticky rail (author display:block overrides the UA [popover] display:none).
       inset:auto (resetting the UA popover inset:0) must come BEFORE top — inset is the
       top/right/bottom/left shorthand and would otherwise reset top and kill the stickiness. */
    .admin-sidebar[b-kk8vx94mea] {
        display: block;
        position: sticky;
        inset: auto;
        top: var(--header-h);
        height: calc(100dvh - var(--header-h));
        overflow-y: auto;
        margin: 0;
        width: auto;
        border: 0;
        border-right: 1px solid var(--line);
        background: var(--surface);
        padding: var(--sp-5) var(--sp-4);
    }
}

/* WS2: back-to-frontpage link at the very top of the nav (desktop rail AND mobile drawer).
   Base nav-link styling (flex, 44px min-height, padding, radius) comes from the shared
   `.admin-nav ::deep a` rule below; this only adds the muted tone + separator. Deliberately a
   plain <a>, not a NavLink — it leaves the admin area and must never take `.active`. */
.admin-nav .admin-nav__frontpage[b-kk8vx94mea] {
    color: var(--ink-500);
    border-block-end: 1px solid var(--line);
    border-end-start-radius: 0;
    border-end-end-radius: 0;
    margin-block-end: var(--sp-2);
}

.admin-nav .admin-nav__frontpage:hover[b-kk8vx94mea] { color: var(--ink-700); }

.admin-nav__group[b-kk8vx94mea] {
    text-transform: uppercase;
    font-size: var(--text-xs);
    letter-spacing: 0.08em;
    color: var(--ink-500);
    margin: var(--sp-5) 0 var(--sp-2);
}

.admin-nav__group:first-child[b-kk8vx94mea] { margin-top: 0; }

/* NavLink renders its <a> without the scope attribute (child component) → ::deep.
   The plain external link (Hangfire) matches too — same descendant selector. */
.admin-nav[b-kk8vx94mea]  a {
    display: flex;
    align-items: center;
    min-height: 44px;
    padding: var(--sp-2) var(--sp-3);
    border-radius: var(--radius-sm);
    color: var(--ink-700);
    text-decoration: none;
    border-left: 3px solid transparent;
}

.admin-nav[b-kk8vx94mea]  a:hover { background: var(--surface-2); }

.admin-nav[b-kk8vx94mea]  a.active {
    background: var(--brand-050);
    color: var(--brand-800);
    border-left-color: var(--brand-800);
    font-weight: 700;
}

.admin-main[b-kk8vx94mea] {
    padding: var(--sp-6) var(--sp-5);
    min-width: 0;
}

/* =====================================================================
   b. Shared admin-page patterns (rendered into @Body → need ::deep)
   ===================================================================== */

.admin-main[b-kk8vx94mea]  .admin-page {
    display: flex;
    flex-direction: column;
    gap: var(--sp-5);
    max-width: var(--container-wide);
}

.admin-main[b-kk8vx94mea]  .admin-page__head {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--sp-3);
    justify-content: space-between;
}

.admin-main[b-kk8vx94mea]  .admin-page__head h1 { margin: 0; }

.admin-main[b-kk8vx94mea]  .admin-toolbar {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-3);
    align-items: flex-end;
}

/* <40rem the global .input/.select width:100% wins (full-width controls on phones);
   from 40rem they get the original compact 18rem cap (desktop unchanged). */
@media (min-width: 40rem) {
    .admin-main[b-kk8vx94mea]  .admin-toolbar > .input,
    .admin-main[b-kk8vx94mea]  .admin-toolbar > .select { max-width: 18rem; }
}

/* WS1: every admin row action is a .btn--sm (2.25rem in the global sheet, which is shared with
   the public site) — bump to the 44px tap minimum inside admin only. */
.admin-main[b-kk8vx94mea]  .btn--sm {
    min-height: var(--tap-min);
    min-width: var(--tap-min);
}

.admin-main[b-kk8vx94mea]  .admin-form-panel {
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: var(--shadow-1);
    padding: var(--sp-5);
    display: flex;
    flex-direction: column;
    gap: var(--sp-4);
}

.admin-main[b-kk8vx94mea]  .admin-form-grid {
    display: grid;
    gap: var(--sp-4);
    grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
}

.admin-main[b-kk8vx94mea]  .admin-actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-3);
}

/* Scroll shadows via the background-attachment:local technique (covers fade + edge shadow). */
.admin-main[b-kk8vx94mea]  .table-wrap {
    overflow-x: auto;
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    background:
        linear-gradient(to right, var(--surface) 30%, rgb(255 255 255 / 0)) left / 3rem 100%,
        linear-gradient(to left, var(--surface) 30%, rgb(255 255 255 / 0)) right / 3rem 100%,
        radial-gradient(farthest-side at 0 50%, rgb(14 31 22 / 0.16), transparent) left / 1rem 100%,
        radial-gradient(farthest-side at 100% 50%, rgb(14 31 22 / 0.16), transparent) right / 1rem 100%;
    background-color: var(--surface);
    background-repeat: no-repeat;
    background-attachment: local, local, scroll, scroll;
}

.admin-main[b-kk8vx94mea]  .table-wrap--tall {
    max-height: 70vh;
    overflow-y: auto;
}

.admin-main[b-kk8vx94mea]  .admin-table {
    width: 100%;
    border-collapse: collapse;
    font-size: var(--text-base);
}

.admin-main[b-kk8vx94mea]  .admin-table th,
.admin-main[b-kk8vx94mea]  .admin-table td {
    padding: var(--sp-3) var(--sp-4);
    text-align: left;
    border-bottom: 1px solid var(--line);
}

.admin-main[b-kk8vx94mea]  .admin-table thead th {
    font-size: var(--text-sm);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--ink-700);
    background: var(--surface-2);
}

.admin-main[b-kk8vx94mea]  .admin-table tbody tr:nth-child(even) { background: var(--surface-2); }
.admin-main[b-kk8vx94mea]  .admin-table tbody tr:hover { background: var(--brand-050); }

/* Sticky header only inside the vertically scrolling variant. */
.admin-main[b-kk8vx94mea]  .table-wrap--tall thead th {
    position: sticky;
    top: 0;
    background: var(--surface);
    z-index: 1;
}

.admin-main[b-kk8vx94mea]  .admin-table__num {
    text-align: right;
    font-feature-settings: var(--numeric-data);
}

/* The global .hide-until-md utility (components.css, @layer utilities) restores visibility at
   ≥56rem with `display: initial`, which computes to `inline` on th/td and breaks table-cell
   layout (lost padding/borders/alignment; adjacent hidden cells merge into one anonymous cell).
   This un-layered scoped rule wins over the layered utility for EVERY admin page rendered into
   @Body; below 56rem the utility's `display: none` still applies untouched. */
@media (min-width: 56rem) {
    .admin-main[b-kk8vx94mea]  th.hide-until-md,
    .admin-main[b-kk8vx94mea]  td.hide-until-md {
        display: table-cell;
    }
}

.admin-main[b-kk8vx94mea]  .admin-table__actions {
    text-align: right;
    white-space: nowrap;
    display: flex;
    gap: var(--sp-2);
    justify-content: flex-end;
}

.admin-main[b-kk8vx94mea]  .admin-live-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--sp-3);
    padding: var(--sp-4);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface);
}

.admin-main[b-kk8vx94mea]  .admin-live-row__bar {
    flex: 1 1 8rem;
    height: 6px;
    background: var(--surface-2);
    border-radius: var(--radius-pill);
    overflow: hidden;
}

.admin-main[b-kk8vx94mea]  .admin-live-row__fill {
    height: 100%;
    background: var(--brand-700);
    transition: width var(--dur-slow) var(--ease-out);
}
/* /Components/Layout/PublicFooter.razor.rz.scp.css */
/* Three-band footer ("Kontakt os" pre-footer + link columns + legal bar; structure
   mirrors maskinparken.dk, palette is Mark & Maskine). Band backgrounds are
   full-bleed; .container centers the content. */

.site-footer[b-ihck9qvh9i] {
    margin-top: var(--sp-10);
}

/* ---- Band 1: "Kontakt os" pre-footer ---- */

.site-footer__contact[b-ihck9qvh9i] {
    background: var(--surface);
    border-top: 1px solid var(--line);
    padding-block: var(--sp-8);
    text-align: center;
}

.site-footer__contact-title[b-ihck9qvh9i] {
    font-family: var(--font-display);
    font-size: var(--text-xl);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    margin: 0 0 var(--sp-6);
}

.site-footer__contact-grid[b-ihck9qvh9i] {
    display: grid;
    gap: var(--sp-6);
    grid-template-columns: 1fr;
    justify-items: center;
}

@media (min-width: 40rem) {
    .site-footer__contact-grid[b-ihck9qvh9i] { grid-template-columns: repeat(3, 1fr); }
}

.site-footer__person[b-ihck9qvh9i] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--sp-1);
}

.site-footer__person-photo[b-ihck9qvh9i] {
    width: 7.5rem;
    height: 7.5rem;
    border-radius: var(--radius-pill);
    object-fit: cover;
    border: 3px solid var(--brand-050);
    box-shadow: var(--shadow-1);
    margin-bottom: var(--sp-2);
}

.site-footer__person-name[b-ihck9qvh9i] {
    font-family: var(--font-display);
    font-size: var(--text-base);
}

.site-footer__person-title[b-ihck9qvh9i] {
    font-size: var(--text-sm);
    color: var(--ink-500);
    margin-bottom: var(--sp-1);
}

.site-footer__person a[b-ihck9qvh9i] {
    display: inline-flex;
    align-items: center;
    min-height: var(--tap-min);
    color: var(--brand-600);
    text-decoration: none;
}

.site-footer__person a:hover[b-ihck9qvh9i] {
    color: var(--brand-700);
    text-decoration: underline;
}

/* ---- Band 2: publications / address / links / Maskinportal ---- */

.site-footer__info[b-ihck9qvh9i] {
    background: var(--surface-2);
    border-block: 1px solid var(--line);
    padding-block: var(--sp-8);
}

.site-footer__info-title[b-ihck9qvh9i] {
    font-family: var(--font-display);
    font-size: var(--text-xl);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    text-align: center;
    margin: 0 0 var(--sp-6);
}

.site-footer__info-grid[b-ihck9qvh9i] {
    display: grid;
    gap: var(--sp-6);
    grid-template-columns: 1fr;
}

@media (min-width: 40rem) {
    .site-footer__info-grid[b-ihck9qvh9i] { grid-template-columns: repeat(2, 1fr); }
}

@media (min-width: 64rem) {
    .site-footer__info-grid[b-ihck9qvh9i] { grid-template-columns: repeat(4, 1fr); gap: var(--sp-8); }
}

.site-footer__info-col[b-ihck9qvh9i] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--sp-1);
}

.site-footer__heading[b-ihck9qvh9i] {
    font-family: var(--font-sans);
    font-weight: 600;
    font-size: var(--text-xs);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--ink-700);
    margin: 0 0 var(--sp-2);
}

.site-footer__info-col > a:not(.btn)[b-ihck9qvh9i] {
    display: inline-flex;
    align-items: center;
    min-height: var(--tap-min);
    color: var(--ink-900);
    text-decoration: none;
}

.site-footer__info-col > a:not(.btn):hover[b-ihck9qvh9i] {
    color: var(--brand-700);
    text-decoration: underline;
}

.site-footer__info-col .btn[b-ihck9qvh9i] {
    margin-top: var(--sp-2);
}

.site-footer__address[b-ihck9qvh9i] {
    font-style: normal;
    font-size: var(--text-sm);
    color: var(--ink-700);
    line-height: 1.8;
}

.site-footer__address a[b-ihck9qvh9i] {
    color: var(--ink-700);
}

.site-footer__seo-text[b-ihck9qvh9i] {
    color: var(--ink-500);
    font-size: var(--text-sm);
    max-width: 40ch;
    margin: var(--sp-3) 0 0;
}

/* ---- Band 3: dark legal bar ---- */

.site-footer__legal[b-ihck9qvh9i] {
    background: var(--brand-900);
    color: var(--brand-100);
    padding-block: var(--sp-5);
    font-size: var(--text-sm);
}

.site-footer__legal-inner[b-ihck9qvh9i] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-3);
    align-items: center;
    justify-content: space-between;
}

.site-footer__icon-row[b-ihck9qvh9i] {
    display: flex;
    gap: var(--sp-3);
}

.site-footer__icon-link[b-ihck9qvh9i] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: var(--tap-min);
    height: var(--tap-min);
    border-radius: var(--radius-pill);
    border: 1px solid var(--dark-line);
    color: var(--dark-text);
}

.site-footer__icon-link:hover[b-ihck9qvh9i] {
    border-color: var(--brand-400);
    color: #fff;
}
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-iwpvyva77y],
.components-reconnect-repeated-attempt-visible[b-iwpvyva77y],
.components-reconnect-failed-visible[b-iwpvyva77y],
.components-pause-visible[b-iwpvyva77y],
.components-resume-failed-visible[b-iwpvyva77y],
.components-rejoining-animation[b-iwpvyva77y] {
    display: none;
}

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


#components-reconnect-modal[b-iwpvyva77y] {
    background-color: white;
    width: 20rem;
    margin: 20vh auto;
    padding: 2rem;
    border: 0;
    border-radius: 0.5rem;
    box-shadow: 0 3px 6px 2px rgba(0, 0, 0, 0.3);
    opacity: 0;
    transition: display 0.5s allow-discrete, overlay 0.5s allow-discrete;
    animation: components-reconnect-modal-fadeOutOpacity-b-iwpvyva77y 0.5s both;
    &[open] {
        animation: components-reconnect-modal-slideUp-b-iwpvyva77y 1.5s cubic-bezier(.05, .89, .25, 1.02) 0.3s, components-reconnect-modal-fadeInOpacity-b-iwpvyva77y 0.5s ease-in-out 0.3s;
        animation-fill-mode: both;
    }
}

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

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

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

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

    100% {
        opacity: 1;
    }
}

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

    100% {
        opacity: 0;
    }
}

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

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

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

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

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

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

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

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

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

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

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

    100% {
        top: 0px;
        left: 0px;
        width: 80px;
        height: 80px;
        opacity: 0;
    }
}
/* /Components/Pages/Home.razor.rz.scp.css */
/* Home — scoped fine-tuning on top of the global design system. */

/* Department cards: one per root category, filling the container as equal columns
   (3 roots is the whole taxonomy). Subcategories are pill chips — they wrap gracefully
   with long Danish names, and every card ends in a "Se alle" chip so a card without
   stocked children still reads as complete. */
.cat-grid[b-gv4dy9ng70] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: var(--sp-4);
    grid-template-columns: 1fr;
}

@media (min-width: 56rem) {
    .cat-grid[b-gv4dy9ng70] {
        grid-template-columns: repeat(3, 1fr);
        gap: var(--sp-5);
    }
}

.cat-grid > li[b-gv4dy9ng70] {
    min-width: 0;
}

.cat-tile[b-gv4dy9ng70] {
    display: flex;
    flex-direction: column;
    gap: var(--sp-3);
    height: 100%;
    padding: var(--sp-4) var(--sp-5) var(--sp-5);
    transition: border-color var(--dur-base) var(--ease-out);
}

.cat-tile:hover[b-gv4dy9ng70],
.cat-tile:focus-within[b-gv4dy9ng70] {
    border-color: var(--brand-500);
}

.cat-tile__head[b-gv4dy9ng70] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--sp-3);
    min-height: var(--tap-min);
    text-decoration: none;
}

.cat-tile__head:hover .cat-tile__name[b-gv4dy9ng70] {
    color: var(--brand-700);
}

.cat-tile__name[b-gv4dy9ng70] {
    font-family: var(--font-display);
    font-weight: 700;
    font-size: var(--text-xl);
    line-height: var(--leading-tight);
    color: var(--ink-900);
    transition: color var(--dur-fast) var(--ease-out);
}

.cat-tile__links[b-gv4dy9ng70] {
    display: flex;
    flex-wrap: wrap;
    align-content: flex-start;
    gap: var(--sp-2);
}

/* Count badge inside each subcategory chip: small brand-green pill on the right. */
.cat-tile__count[b-gv4dy9ng70] {
    display: inline-grid;
    place-items: center;
    min-width: 1.5rem;
    height: 1.5rem;
    padding-inline: 0.375rem;
    margin-left: var(--sp-2);
    border-radius: var(--radius-pill);
    background: var(--brand-100);
    color: var(--brand-800);
    font-size: var(--text-xs);
    font-weight: 700;
    line-height: 1;
    font-feature-settings: var(--numeric-data);
}

/* How-it-works: big slab step numbers. */
.how__num[b-gv4dy9ng70] {
    font-family: var(--font-display);
    font-weight: 700;
    font-size: var(--text-2xl);
    line-height: 1;
    color: var(--brand-300);
}
/* /Features/Admin/GoLive/GoLivePanel.razor.rz.scp.css */
/* One-off in this slice → scoped here (design rule: co-locate; the panel base comes from the shared
   .admin-form-panel pattern in AdminLayout.razor.css). The accent edge marks it as THE launch action. */
.golive-panel[b-d5lqrpgm4o] {
    border-inline-start: 0.25rem solid var(--accent-600);
}

.golive-panel h2[b-d5lqrpgm4o] {
    margin: 0;
}

.golive-panel p[b-d5lqrpgm4o] {
    margin: 0;
    max-width: 65ch;
}

.golive-actions[b-d5lqrpgm4o] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-3);
}

.golive-note[b-d5lqrpgm4o] {
    margin: 0;
}
/* /Features/Catalog/Admin/ManageListings/ManageListings.razor.rz.scp.css */
/* The global .select is width:100%, which lets the per-row status dropdown stretch to
   whatever width the table gives its cell. Pin it to a sensible band so the column stays
   compact on narrow screens and doesn't balloon on wide ones. (Scoped CSS is un-layered,
   so this wins over the layered global rule.) */
.status-select[b-ghnt3yazhm] {
  width: auto;
  min-width: 8.5rem;
  max-width: 12rem;
}
/* /Features/Catalog/BrowseCategories/BrowseCategories.razor.rz.scp.css */
/* Scoped to BrowseCategories. One panel per root category; descendants indent via the --cat-lvl var. */
.cat-panels[b-gwowcefsy9] { display: grid; grid-template-columns: 1fr; gap: var(--sp-5); align-items: start; }

@media (min-width: 64rem) {
    .cat-panels[b-gwowcefsy9] { grid-template-columns: repeat(2, 1fr); }
}

.cat-panel[b-gwowcefsy9] { display: flex; flex-direction: column; }

/* The whole header row is the link to the root category (its badge shows the descendant-inclusive total). */
.cat-panel__head[b-gwowcefsy9] {
    display: flex; align-items: center; justify-content: space-between; gap: var(--sp-3);
    min-height: var(--tap-min);
    padding: var(--sp-4) var(--sp-4) var(--sp-3);
    border-bottom: 1px solid var(--line-strong);
    text-decoration: none; color: var(--ink-900);
    transition: background-color var(--dur-fast) var(--ease-out);
}
.cat-panel__head:hover[b-gwowcefsy9] { background: var(--brand-050); }
.cat-panel__head:hover .cat-panel__title[b-gwowcefsy9] { color: var(--brand-700); }
.cat-panel__title[b-gwowcefsy9] { margin: 0; font-family: var(--font-display); font-size: var(--text-xl); color: var(--ink-900); }

.cat-panel__list[b-gwowcefsy9] { list-style: none; margin: 0; padding: 0; }
.cat-panel__item + .cat-panel__item[b-gwowcefsy9] { border-top: 1px solid var(--line); }

.cat-panel__row[b-gwowcefsy9] {
    display: flex; align-items: center; justify-content: space-between; gap: var(--sp-3);
    min-height: var(--tap-min);
    padding: var(--sp-2) var(--sp-4);
    padding-left: calc(var(--sp-4) + var(--cat-lvl, 0) * var(--sp-5));
    text-decoration: none; color: var(--ink-900);
    transition: background-color var(--dur-fast) var(--ease-out);
}
.cat-panel__row:hover[b-gwowcefsy9] { background: var(--brand-050); }
.cat-panel__row:hover .cat-panel__name[b-gwowcefsy9] { color: var(--brand-700); }

.cat-panel__name[b-gwowcefsy9] { font-weight: 600; }

/* Streaming pending state */
.cat-panel__skeleton-title[b-gwowcefsy9] { width: 40%; }
.cat-panel__skeleton-body[b-gwowcefsy9] { display: flex; flex-direction: column; gap: var(--sp-3); padding: var(--sp-4); }
/* /Features/Catalog/CompareListings/Compare.razor.rz.scp.css */
/* Compare table: label column sticky-left, one column per machine, horizontal scroll
   inside .table-wrap on narrow screens (the page itself never scrolls sideways). */

.compare-wrap[b-phx2tzgcb1] {
    overflow-x: auto;
}

.compare-table[b-phx2tzgcb1] {
    width: 100%;
    border-collapse: collapse;
    font-size: var(--text-base);
}

.compare-table th[b-phx2tzgcb1],
.compare-table td[b-phx2tzgcb1] {
    padding: var(--sp-3) var(--sp-4);
    border-bottom: 1px solid var(--line);
    text-align: left;
    vertical-align: top;
    min-width: 13rem;
}

/* Sticky label column (row headers + the corner cell with the diff toggle). */
.compare-table th[scope="row"][b-phx2tzgcb1],
.compare-table__corner[b-phx2tzgcb1] {
    position: sticky;
    left: 0;
    z-index: 1;
    background: var(--bg);
    min-width: 10rem;
    max-width: 12rem;
    color: var(--ink-700);
    font-weight: 600;
}

.compare-table thead th[b-phx2tzgcb1] {
    vertical-align: bottom;
    border-bottom: 2px solid var(--line-strong);
}

/* "Vis kun forskelle" (JS toggles .only-diff on the table). */
.compare-diff[b-phx2tzgcb1] {
    font-size: var(--text-sm);
    font-weight: 600;
    white-space: nowrap;
}

.compare-table.only-diff tr.is-equal[b-phx2tzgcb1] {
    display: none;
}

/* Differing cells get the one quiet accent — amber is a pigment, used as a surface. */
.compare-table td.is-diff[b-phx2tzgcb1] {
    background: var(--accent-050);
}

/* Band separator ("Tekniske data"). */
.compare-table__band th[b-phx2tzgcb1] {
    background: var(--surface-2);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    font-size: var(--text-sm);
    color: var(--ink-700);
    position: static; /* spans all columns — must not stick over them */
}

/* ---- Machine header cards ---- */

.compare-col[b-phx2tzgcb1] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--sp-2);
    max-width: 18rem;
}

.compare-col__media[b-phx2tzgcb1] {
    display: block;
    width: 100%;
    aspect-ratio: 4 / 3;
    border-radius: var(--radius-sm);
    overflow: hidden;
    background: var(--surface-2);
}

.compare-col__media img[b-phx2tzgcb1] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.compare-col__title[b-phx2tzgcb1] {
    font-family: var(--font-display);
    font-weight: 700;
    font-size: var(--text-lg);
    line-height: var(--leading-tight);
    color: var(--ink-900);
    text-decoration: none;
}

.compare-col__title:hover[b-phx2tzgcb1] {
    color: var(--brand-700);
}

.compare-col__price[b-phx2tzgcb1] {
    margin: 0;
}

.compare-col__dealer[b-phx2tzgcb1] {
    margin: 0;
    color: var(--ink-500);
    font-size: var(--text-sm);
    font-weight: 400;
}

.compare-col__actions[b-phx2tzgcb1] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-2);
}

.compare-col--add[b-phx2tzgcb1] {
    align-items: center;
    justify-content: center;
    min-height: 14rem;
    width: 100%;
    border: 2px dashed var(--line);
    border-radius: var(--radius-sm);
}
/* /Features/Catalog/DealerIndex/DealerIndex.razor.rz.scp.css */
/* Dealer directory: list rows (marketplace convention — Mascus/Bilbasen style), not cards.
   Logo when the dealer has one, monogram fallback otherwise; up to three machine-photo previews. */

.dealer-list[b-4a7ai1o6wc] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: var(--sp-3);
}

.dealer-row[b-4a7ai1o6wc] {
    display: flex;
    align-items: center;
    gap: var(--sp-4);
    padding: var(--sp-4) var(--sp-5);
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: var(--shadow-1);
    text-decoration: none;
    color: inherit;
    transition: box-shadow var(--dur-base) var(--ease-out),
                transform var(--dur-base) var(--ease-out),
                border-color var(--dur-base) var(--ease-out);
}

.dealer-row:hover[b-4a7ai1o6wc] {
    box-shadow: var(--shadow-2);
    transform: translateY(-2px);
    border-color: var(--brand-300);
}

@media (prefers-reduced-motion: reduce) {
    .dealer-row:hover[b-4a7ai1o6wc] { transform: none; }
}

.dealer-row__mark[b-4a7ai1o6wc] {
    flex-shrink: 0;
    width: 3.5rem;
    height: 3.5rem;
    border-radius: var(--radius-sm);
}

.dealer-row__logo[b-4a7ai1o6wc] {
    object-fit: contain;
    background: var(--surface);
    border: 1px solid var(--line);
    padding: var(--sp-1);
}

.dealer-row__monogram[b-4a7ai1o6wc] {
    display: grid;
    place-items: center;
    background: var(--brand-050);
    border: 1px solid var(--brand-100);
    color: var(--brand-700);
    font-family: var(--font-display);
    font-weight: 700;
    font-size: var(--text-xl);
}

.dealer-row__id[b-4a7ai1o6wc] {
    display: flex;
    flex-direction: column;
    gap: var(--sp-1);
    min-width: 0;
}

.dealer-row__name[b-4a7ai1o6wc] {
    font-family: var(--font-display);
    font-size: var(--text-lg);
    margin: 0;
    letter-spacing: -0.01em;
}

.dealer-row__location[b-4a7ai1o6wc] {
    font-size: var(--text-sm);
}

.dealer-row__previews[b-4a7ai1o6wc] {
    display: none;
    margin-left: auto;
    gap: var(--sp-2);
}

.dealer-row__previews img[b-4a7ai1o6wc] {
    width: 4.5rem;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    border-radius: var(--radius-sm);
    border: 1px solid var(--line);
}

@media (min-width: 56rem) {
    .dealer-row__previews[b-4a7ai1o6wc] { display: flex; }
}

.dealer-row__meta[b-4a7ai1o6wc] {
    margin-left: auto;
    display: flex;
    align-items: center;
    gap: var(--sp-3);
    flex-shrink: 0;
}

/* When previews are shown they own the auto-margin; the meta block sits after them. */
@media (min-width: 56rem) {
    .dealer-row__previews + .dealer-row__meta[b-4a7ai1o6wc] { margin-left: 0; }
}

.dealer-row__chevron[b-4a7ai1o6wc] {
    color: var(--moss-500);
    transition: translate var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out);
}

.dealer-row:hover .dealer-row__chevron[b-4a7ai1o6wc] {
    translate: 3px 0;
    color: var(--brand-600);
}

.dealer-skeleton__name[b-4a7ai1o6wc] { width: 12rem; height: 1.25rem; }
.dealer-skeleton__meta[b-4a7ai1o6wc] { width: 8rem; }
/* /Features/Catalog/DealerPage/DealerPage.razor.rz.scp.css */
/* Dealer identity block: card with a left brand accent rule. */
.dealer-head[b-bahjhrzijc] {
    border-left: 4px solid var(--brand-800);
}

.dealer-head .card__body[b-bahjhrzijc] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--sp-3);
}

.dealer-head h1[b-bahjhrzijc] {
    font-family: var(--font-display);
    margin: 0;
}

.dealer-head p[b-bahjhrzijc] {
    margin: 0;
}

/* Search within this dealer's machines: keep the group comfortably narrow on wide screens. */
.dealer-search[b-bahjhrzijc] {
    max-width: 34rem;
}

/* Match-count heading + "see all machines" reset link on one baseline. */
.dealer-search__meta[b-bahjhrzijc] {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: var(--sp-3);
}

.dealer-search__meta h2[b-bahjhrzijc] {
    margin: 0;
}
/* /Features/Catalog/GetListingDetail/ListingDetail.razor.rz.scp.css */
/* ---- Header: h1 + context line ------------------------------------- */

.detail-head h1[b-bggfqjlz69] {
    margin-bottom: var(--sp-2);
}

.detail-context[b-bggfqjlz69] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-2);
    margin: 0;
    max-width: none;
}

.detail-context > span + span[b-bggfqjlz69]::before {
    content: "·";
    margin-inline-end: var(--sp-2);
    color: var(--ink-500);
}

/* ---- Two-column grid + sticky summary ------------------------------- */

.detail-grid[b-bggfqjlz69] {
    display: grid;
    gap: var(--sp-5);
    align-items: start;
}

/* Grid children may hold unbreakable-wide content (a 40-photo thumb strip): without
   min-width: 0 their min-content size overrides the fr tracks and blows the layout
   out to full width on photo-heavy machines. */
.detail-grid > *[b-bggfqjlz69] {
    min-width: 0;
}

@media (min-width: 56rem) {
    .detail-grid[b-bggfqjlz69] {
        grid-template-columns: 1.6fr 1fr;
    }

    .detail-summary[b-bggfqjlz69] {
        position: sticky;
        top: calc(var(--header-h) + var(--sp-4));
    }
}

.badge-row[b-bggfqjlz69] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-2);
}

.price-wrap[b-bggfqjlz69] {
    display: flex;
    flex-direction: column;
    gap: var(--sp-1);
}

.price-wrap .price[b-bggfqjlz69] {
    font-size: var(--text-2xl);
    margin: 0;
}

.vat-note[b-bggfqjlz69] {
    font-size: var(--text-sm);
}

.price-disclaimer[b-bggfqjlz69] {
    font-size: var(--text-sm);
    max-width: 44ch;
}

/* ---- Key facts (engraved-label style) -------------------------------- */

.facts[b-bggfqjlz69] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--sp-3) var(--sp-4);
    margin: 0;
}

.facts dt[b-bggfqjlz69] {
    font-size: var(--text-xs);
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--ink-500);
}

.facts dd[b-bggfqjlz69] {
    margin: 0;
    font-weight: 700;
    font-feature-settings: var(--numeric-data);
}

/* ---- Dealer block ----------------------------------------------------- */

.dealer-block[b-bggfqjlz69] {
    border-top: 1px solid var(--line);
    padding-top: var(--sp-4);
}

.dealer-block h2[b-bggfqjlz69] {
    font-size: var(--text-lg);
    margin: 0;
}

.dealer-block__logo[b-bggfqjlz69] {
    max-height: 2.5rem;
    width: auto;
    object-fit: contain;
}

.dealer-block__ctas .btn[b-bggfqjlz69] {
    width: 100%;
    justify-content: center;
}

.dealer-block__all[b-bggfqjlz69] {
    display: block;
    text-align: center;
}

/* ---- Blocks below the grid -------------------------------------------- */

.detail-block[b-bggfqjlz69] {
    border-top: 1px solid var(--line);
    padding-top: var(--sp-5);
}

.detail-meta[b-bggfqjlz69] {
    font-size: var(--text-sm);
}

/* ---- THE TECH PANEL (signature) ----------------------------------------
   Dark digital spec panel on dyb-mark green: faint horizontal scan-lines,
   mono-spaced engraved labels, amber values, a small live indicator in the
   head. One deliberate statement — everything around it stays quiet. */

.data-plate[b-bggfqjlz69] {
    position: relative;
    padding: var(--sp-5);
    border: 1px solid var(--dark-line);
    border-radius: var(--radius);
    color: var(--dark-text);
    box-shadow: var(--shadow-2);
    background-color: var(--dark-surface);
    background-image:
        repeating-linear-gradient(180deg,
            rgba(233, 242, 237, 0.025) 0 1px,
            transparent 1px 4px),
        radial-gradient(48rem 20rem at 110% -30%, rgba(23, 168, 107, 0.16), transparent 70%),
        linear-gradient(160deg, var(--dark-surface), var(--dark-surface-2));
    overflow: hidden;
}

.data-plate__head[b-bggfqjlz69] {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
    margin: 0 var(--sp-4) var(--sp-3);
    padding-bottom: var(--sp-3);
    border-bottom: 1px solid var(--dark-line);
}

.data-plate__head[b-bggfqjlz69]::before {
    content: "";
    width: 8px;
    height: 8px;
    border-radius: 2px;
    background: var(--brand-500);
    box-shadow: 0 0 10px rgba(23, 168, 107, 0.9);
}

.data-plate__title[b-bggfqjlz69] {
    font-family: var(--font-mono);
    font-weight: 600;
    font-size: var(--text-sm);
    letter-spacing: .18em;
    text-transform: uppercase;
    color: var(--dark-muted);
}

.data-plate__table[b-bggfqjlz69] {
    width: 100%;
    border-collapse: collapse;
}

.data-plate__table th[b-bggfqjlz69] {
    width: 40%;
    padding: var(--sp-3) var(--sp-4);
    border-bottom: 1px solid var(--dark-line);
    color: var(--dark-muted);
    font-family: var(--font-mono);
    font-size: var(--text-xs);
    font-weight: 500;
    letter-spacing: .1em;
    text-align: left;
    text-transform: uppercase;
}

.data-plate__table td[b-bggfqjlz69] {
    padding: var(--sp-3) var(--sp-4);
    border-bottom: 1px solid var(--dark-line);
    color: var(--accent-300);
    font-weight: 600;
    font-feature-settings: var(--numeric-data);
}

.data-plate__table td .muted[b-bggfqjlz69] {
    color: var(--dark-muted);
}

.data-plate__table tr:last-child th[b-bggfqjlz69],
.data-plate__table tr:last-child td[b-bggfqjlz69] {
    border-bottom: none;
}

.data-plate__footer[b-bggfqjlz69] {
    margin: var(--sp-3) var(--sp-4) 0;
    padding-top: var(--sp-3);
    border-top: 1px solid var(--dark-line);
    display: flex;
    justify-content: space-between;
    color: var(--dark-muted);
    font-family: var(--font-mono);
    font-size: var(--text-xs);
    text-transform: uppercase;
    letter-spacing: .1em;
}

@media (max-width: 39.9375rem) {
    .data-plate[b-bggfqjlz69] {
        padding: var(--sp-4);
    }
}

/* ---- Equipment list ---------------------------------------------------- */

.equip-list[b-bggfqjlz69] {
    list-style: none;
    margin: 0;
    padding: 0;
}

.equip-list li[b-bggfqjlz69] {
    position: relative;
    padding-left: 1.5em;
    break-inside: avoid;
}

.equip-list li + li[b-bggfqjlz69] {
    margin-top: var(--sp-2);
}

.equip-list li[b-bggfqjlz69]::before {
    content: "✓";
    position: absolute;
    left: 0;
    color: var(--moss-500);
    font-weight: 700;
}

@media (min-width: 56rem) {
    .equip-list[b-bggfqjlz69] {
        columns: 2;
        column-gap: var(--sp-6);
    }
}

/* ---- Loading skeleton --------------------------------------------------- */

.skel-crumbs[b-bggfqjlz69] {
    width: 40%;
    max-width: 20rem;
}

.skel-title[b-bggfqjlz69] {
    width: 60%;
    max-width: 32rem;
    height: 2.25rem;
}

.skel-price[b-bggfqjlz69] {
    width: 50%;
    height: 1.75rem;
}

.skel-short[b-bggfqjlz69] {
    width: 70%;
}
/* /Features/Catalog/SearchListings/SearchListings.razor.rz.scp.css */
/* Search page: facet rail (>=64rem) + results column; below 64rem the same form
   lives in a native <details> drawer (no-JS-safe). CSS shows exactly one copy per viewport. */

.search-layout[b-i6sc3sbj0m] {
    display: flex;
    flex-direction: column;
    gap: var(--sp-6);
}

.search-layout__rail[b-i6sc3sbj0m] {
    display: none;
}

.search-layout__main[b-i6sc3sbj0m] {
    min-width: 0;
}

/* Vertical rhythm for the results column (count bar, chips, grid, pagination). */
.search-layout__main > * + *[b-i6sc3sbj0m] {
    margin-top: var(--sp-5);
}

/* Count left, sort right — the standard marketplace results bar. */
.results-bar[b-i6sc3sbj0m] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--sp-3);
}

.results-bar p[b-i6sc3sbj0m] {
    margin: 0;
}

.sort-form[b-i6sc3sbj0m] {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
}

.sort-form label[b-i6sc3sbj0m] {
    font-size: var(--text-sm);
    white-space: nowrap;
}

.sort-form .select[b-i6sc3sbj0m] {
    width: auto;
    min-width: 13rem;
}

@media (min-width: 64rem) {
    .search-layout[b-i6sc3sbj0m] {
        display: grid;
        grid-template-columns: 17rem minmax(0, 1fr);
        gap: var(--sp-8);
        align-items: start;
    }

    .search-layout__rail[b-i6sc3sbj0m] {
        display: block;
    }

    .facets-drawer[b-i6sc3sbj0m] {
        display: none;
    }
}

/* Mobile drawer (native <details>) */
.facets-drawer[b-i6sc3sbj0m] {
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    background: var(--surface);
}

.facets-drawer > summary[b-i6sc3sbj0m] {
    list-style: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--sp-3);
    min-height: var(--tap-min);
    padding: var(--sp-3) var(--sp-4);
    font-weight: 700;
    cursor: pointer;
}

.facets-drawer > summary[b-i6sc3sbj0m]::-webkit-details-marker {
    display: none;
}

.facets-drawer > summary:focus-visible[b-i6sc3sbj0m] {
    outline: 3px solid var(--focus);
    outline-offset: 2px;
    border-radius: var(--radius-sm);
}

/* Chevron flips when open. */
.facets-drawer > summary[b-i6sc3sbj0m]::after {
    content: "";
    flex-shrink: 0;
    width: 0.55em;
    height: 0.55em;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(45deg);
    transition: transform var(--dur-fast) var(--ease-out);
}

.facets-drawer[open] > summary[b-i6sc3sbj0m]::after {
    transform: rotate(-135deg);
}

.facets-drawer__body[b-i6sc3sbj0m] {
    padding: var(--sp-4);
    border-top: 1px solid var(--line);
}

/* The AI-search group gets the one quiet accent in the rail. */
.facet-ai[b-i6sc3sbj0m] {
    border-color: var(--brand-200);
    background: var(--brand-050);
}

.facet-ai legend[b-i6sc3sbj0m] {
    color: var(--brand-600);
}

.facet-ai .field__hint[b-i6sc3sbj0m] {
    margin-top: var(--sp-2);
}

/* Checkbox facet groups stack vertically (.check is inline-flex on its own). */
.facet-checks[b-i6sc3sbj0m],
.facet-checklist[b-i6sc3sbj0m] {
    display: flex;
    flex-direction: column;
    gap: var(--sp-1);
}

/* The brand list can reach 20 entries — cap it and scroll instead of swallowing the rail. */
.facet-checklist[b-i6sc3sbj0m] {
    max-height: 15rem;
    overflow-y: auto;
    padding-right: var(--sp-2);
}

/* From/to pairs sit side by side; numbers are short. */
.facet-form__range[b-i6sc3sbj0m] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: var(--sp-3);
}

.facet-form__range .field[b-i6sc3sbj0m] {
    margin-bottom: 0;
}

.facet-form .fieldset .field:last-child[b-i6sc3sbj0m] {
    margin-bottom: 0;
}

/* Apply/reset stack full-width in the narrow facet rail/drawer (both kept: the submit
   is the no-JS fallback + explicit action; data-autosubmit handles the JS path).
   The pair rides along as a floating glass bar (same treatment as the site header):
   sticky at the viewport bottom while the tall form is in view, resting at its natural
   end once scrolled past. Applies to rail AND drawer — both render the same form.
   NOTE: sticky dies if any ancestor of the form gains overflow — keep rail/drawer overflow-free. */
.facet-form .form-actions[b-i6sc3sbj0m] {
    flex-direction: column;
    position: sticky;
    bottom: var(--sp-3);
    z-index: 2;
    padding: var(--sp-3);
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    box-shadow: var(--shadow-2);
}

@supports (backdrop-filter: blur(1px)) {
    .facet-form .form-actions[b-i6sc3sbj0m] {
        background: rgba(255, 255, 255, 0.78);
        backdrop-filter: blur(10px) saturate(1.2);
    }
}

.facet-form .form-actions .btn[b-i6sc3sbj0m] {
    width: 100%;
}
/* /Features/Identity/PreviewGate/PreviewGate.razor.rz.scp.css */
.gate[b-ncsuvginob] {
    width: 100%;
    max-width: 30rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--sp-6);
}

.gate__logo[b-ncsuvginob] {
    display: block;
    height: 3.5rem;
    width: auto;
    max-width: 100%;
}

.gate .card[b-ncsuvginob] {
    width: 100%;
}
/* /Features/Identity/PreviewGate/PreviewGateLayout.razor.rz.scp.css */
.gate-shell[b-m4myvxsqe2] {
    min-height: 100dvh;
    display: grid;
    place-items: center;
    padding: var(--sp-6) var(--sp-4);
    background: var(--surface-2);
}
/* /Features/Ingestion/ManageSources/ManageSources.razor.rz.scp.css */
/* (The th/td.hide-until-md table-cell restore lives centrally in AdminLayout.razor.css.) */

/* Long source URLs must not force the name column (and the whole table) wide on
   small screens — truncate with an ellipsis; the title attribute carries the full URL. */
.source-url[b-el77r5jxvr] {
    display: inline-block;
    max-width: 24ch;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow-wrap: anywhere;
    vertical-align: bottom;
}

@media (min-width: 56rem) {
    .source-url[b-el77r5jxvr] {
        max-width: 44ch;
    }
}
/* /Features/Ingestion/ReviewQueue/ReviewQueue.razor.rz.scp.css */
/* Reviewer cards for the ingestion review queue. This file owns ALL .review-card* styles. */

.review-cards[b-z8siunzqtg] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: var(--sp-5);
}

.review-card[b-z8siunzqtg] {
    display: flex;
    flex-direction: column;
    gap: var(--sp-4);
    padding: var(--sp-5);
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: var(--shadow-1);
}

/* ---- 1. Media strip ---- */
.review-card__media[b-z8siunzqtg] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--sp-2);
}

.review-card__thumb[b-z8siunzqtg] {
    display: block;
    flex: 0 0 auto;
    border-radius: var(--radius-sm);
}

.review-card__thumb img[b-z8siunzqtg] {
    display: block;
    width: 6rem; /* 96px */
    aspect-ratio: 4 / 3;
    object-fit: cover;
    border-radius: var(--radius-sm);
    background: var(--surface-2);
}

a.review-card__thumb:hover img[b-z8siunzqtg] {
    outline: 2px solid var(--brand-500);
    outline-offset: 1px;
}

.review-card__more[b-z8siunzqtg] {
    display: inline-flex;
    align-items: center;
    padding: var(--sp-1) var(--sp-3);
    border-radius: var(--radius-pill);
    background: var(--surface-2);
    color: var(--ink-700);
    font-size: var(--text-sm);
    font-feature-settings: var(--numeric-data);
}

/* ---- 2. Title + confidence ---- */
.review-card__head[b-z8siunzqtg] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--sp-3);
}

.review-card__title[b-z8siunzqtg] {
    margin: 0;
    font-family: var(--font-display);
    font-size: var(--text-lg);
    line-height: var(--leading-tight);
}

.review-card__confidence[b-z8siunzqtg] {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
}

.review-card__meter[b-z8siunzqtg] {
    width: 8rem;
    height: 6px;
    border-radius: var(--radius-pill);
    background: var(--surface-2);
    overflow: hidden;
}

.review-card__meter-fill[b-z8siunzqtg] {
    display: block;
    height: 100%;
    border-radius: var(--radius-pill);
}

.review-card__meter-fill--ok[b-z8siunzqtg] { background: var(--ok-600); }
.review-card__meter-fill--warn[b-z8siunzqtg] { background: var(--warn-600); }
.review-card__meter-fill--danger[b-z8siunzqtg] { background: var(--danger-600); }

.review-card__pct[b-z8siunzqtg] {
    font-size: var(--text-sm);
    color: var(--ink-700);
    font-feature-settings: var(--numeric-data);
}

/* ---- Reason-for-review strip ---- */
.review-card__reason[b-z8siunzqtg] {
    margin: 0;
    padding: var(--sp-3);
    border-radius: var(--radius-sm);
    background: var(--danger-050);
    color: var(--danger-700);
}

/* ---- 3. Raw vs. mapped grid (stacked rows below 56rem, 3-column grid above) ---- */
.review-card__map[b-z8siunzqtg] {
    display: flex;
    flex-direction: column;
    gap: var(--sp-4);
}

.review-card__map-headrow[b-z8siunzqtg] {
    display: none;
}

.review-card__map-row[b-z8siunzqtg] {
    display: flex;
    flex-direction: column;
    gap: var(--sp-1);
}

.review-card__map-label[b-z8siunzqtg] {
    font-size: var(--text-sm);
    font-weight: 600;
    color: var(--ink-700);
}

@media (min-width: 56rem) {
    .review-card__map[b-z8siunzqtg] {
        display: grid;
        grid-template-columns: auto 1fr 1fr;
        gap: var(--sp-3) var(--sp-4);
        align-items: center;
    }

    /* Wrappers dissolve so label/raw/select become the grid cells of each row. */
    .review-card__map-headrow[b-z8siunzqtg],
    .review-card__map-row[b-z8siunzqtg] {
        display: contents;
    }

    .review-card__map-head[b-z8siunzqtg] {
        display: block;
        font-size: var(--text-xs);
        text-transform: uppercase;
        letter-spacing: 0.05em;
        color: var(--ink-500);
    }
}

/* ---- 4. Meta row ---- */
.review-card__meta[b-z8siunzqtg] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-3);
    font-size: var(--text-sm);
}
/* /Shared/Ui/ImageGallery.razor.rz.scp.css */
/* Scoped to ImageGallery. Uses design-system tokens (global) for colours/spacing. */
.gallery[b-xxviq45qzb] { display: flex; flex-direction: column; gap: var(--sp-3); }
.gallery:focus-visible[b-xxviq45qzb] { outline: 3px solid var(--focus); outline-offset: 2px; border-radius: var(--radius); }

.gallery__main[b-xxviq45qzb] {
    position: relative;
    aspect-ratio: 4 / 3;
    background: var(--surface-2);
    border-radius: var(--radius);
    overflow: hidden;
    display: grid;
    place-items: center;
    /* pan-y: vertical page scrolling stays native; horizontal drags become swipe events. */
    touch-action: pan-y;
    user-select: none;
    -webkit-user-select: none;
}

/* The main image is a button (opens the lightbox). */
.gallery__zoom[b-xxviq45qzb] {
    display: block;
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    background: none;
    cursor: zoom-in;
}

.gallery__zoom:focus-visible[b-xxviq45qzb] {
    outline: 3px solid var(--focus);
    outline-offset: -3px;
}

.gallery__img[b-xxviq45qzb] { width: 100%; height: 100%; object-fit: cover; animation: gallery-fade-b-xxviq45qzb var(--dur-base) var(--ease-out); }

/* Overlay prev/next: dark-glass circles riding the image edges. */
.gallery__nav[b-xxviq45qzb] {
    position: absolute;
    top: 50%;
    translate: 0 -50%;
    width: 2.75rem;
    height: 2.75rem;
    display: grid;
    place-items: center;
    padding: 0;
    border: 1px solid rgba(255, 255, 255, 0.35);
    border-radius: 50%;
    background: rgba(12, 32, 21, 0.55);
    color: #fff;
    cursor: pointer;
    backdrop-filter: blur(6px);
    transition: background var(--dur-fast) var(--ease-out);
}

.gallery__nav:hover[b-xxviq45qzb] { background: rgba(12, 32, 21, 0.85); }
.gallery__nav:focus-visible[b-xxviq45qzb] { outline: 3px solid var(--focus); outline-offset: 2px; }
.gallery__nav--prev[b-xxviq45qzb] { left: var(--sp-3); }
.gallery__nav--next[b-xxviq45qzb] { right: var(--sp-3); }
.gallery__nav--lg[b-xxviq45qzb] { width: 3.25rem; height: 3.25rem; }

.gallery__counter[b-xxviq45qzb] {
    position: absolute;
    right: var(--sp-3);
    bottom: var(--sp-3);
    padding: 2px var(--sp-3);
    border-radius: var(--radius-pill);
    background: rgba(12, 32, 21, 0.65);
    color: #fff;
    font-size: var(--text-sm);
    font-weight: 600;
    font-feature-settings: var(--numeric-data);
}

/* ---- Fullscreen lightbox (native <dialog>) ---- */
/* The dialog itself is the dark surface — relying on ::backdrop alone lets the page
   bleed through (especially jarring on mobile). dvh units track the real visible
   viewport when mobile browser chrome collapses. */
.lightbox[b-xxviq45qzb] {
    width: 100vw;
    height: 100vh;
    height: 100dvh;
    max-width: 100vw;
    max-height: 100vh;
    max-height: 100dvh;
    margin: 0;
    padding: 0;
    border: 0;
    background: rgba(6, 16, 11, 0.95);
    overscroll-behavior: contain;
}

.lightbox[b-xxviq45qzb]::backdrop { background: rgba(6, 16, 11, 0.6); }

.lightbox__inner[b-xxviq45qzb] {
    position: relative;
    width: 100%;
    height: 100%;
    display: grid;
    place-items: center;
    padding: var(--sp-4);
    touch-action: pan-y;
    user-select: none;
    -webkit-user-select: none;
}

/* Touch devices navigate the lightbox by swipe (+ thumbs/counter) — overlay arrows
   would cover a small image, so they disappear. Desktop keeps arrows, drag and keys. */
@media (hover: none) and (pointer: coarse) {
    .gallery__nav--lg[b-xxviq45qzb] { display: none; }
}

@media (min-width: 56rem) {
    .lightbox__inner[b-xxviq45qzb] { padding: var(--sp-6); }
}

.lightbox__img[b-xxviq45qzb] {
    max-width: 92vw;
    /* leave room for close (top) + thumb strip and counter (bottom) on any viewport */
    max-height: calc(100vh - 11rem);
    max-height: calc(100dvh - 11rem);
    width: auto;
    height: auto;
    object-fit: contain;
    border-radius: var(--radius-sm);
    box-shadow: var(--shadow-3);
    animation: gallery-fade-b-xxviq45qzb var(--dur-base) var(--ease-out);
}

/* Bottom overlay: thumb strip with the counter beneath it. */
.lightbox__bottom[b-xxviq45qzb] {
    position: absolute;
    left: 50%;
    bottom: var(--sp-4);
    translate: -50% 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--sp-2);
    max-width: 92vw;
}

.lightbox__thumbs[b-xxviq45qzb] {
    list-style: none;
    margin: 0;
    padding: var(--sp-1);
    display: flex;
    gap: var(--sp-2);
    max-width: 92vw;
    overflow-x: auto;
}

.lightbox__thumb[b-xxviq45qzb] {
    padding: 0;
    width: 3.5rem;
    height: 3.5rem;
    flex: none;
    border: 2px solid transparent;
    border-radius: var(--radius-sm);
    overflow: hidden;
    cursor: pointer;
    background: rgba(255, 255, 255, 0.08);
    opacity: 0.55;
    transition: opacity var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out);
}

.lightbox__thumb:hover[b-xxviq45qzb] { opacity: 1; }
.lightbox__thumb.is-active[b-xxviq45qzb] { opacity: 1; border-color: var(--brand-400); }
.lightbox__thumb:focus-visible[b-xxviq45qzb] { outline: 3px solid var(--focus); outline-offset: 2px; }
.lightbox__thumb img[b-xxviq45qzb] { width: 100%; height: 100%; object-fit: cover; display: block; }

.lightbox__close[b-xxviq45qzb] {
    position: absolute;
    top: var(--sp-4);
    right: var(--sp-4);
    width: 3rem;
    height: 3rem;
    display: grid;
    place-items: center;
    padding: 0;
    border: 1px solid rgba(255, 255, 255, 0.35);
    border-radius: 50%;
    background: rgba(12, 32, 21, 0.55);
    color: #fff;
    cursor: pointer;
    transition: background var(--dur-fast) var(--ease-out);
}

.lightbox__close:hover[b-xxviq45qzb] { background: rgba(12, 32, 21, 0.85); }
.lightbox__close:focus-visible[b-xxviq45qzb] { outline: 3px solid var(--focus); outline-offset: 2px; }

/* Static: .lightbox__bottom is a flex column that puts the strip first, counter beneath. */
.lightbox__counter[b-xxviq45qzb] {
    padding: 2px var(--sp-4);
    border-radius: var(--radius-pill);
    background: rgba(12, 32, 21, 0.65);
    color: #fff;
    font-size: var(--text-base);
    font-weight: 600;
    font-feature-settings: var(--numeric-data);
}

@keyframes gallery-fade-b-xxviq45qzb {
    from { opacity: .25; }
}

@media (prefers-reduced-motion: reduce) {
    .gallery__img[b-xxviq45qzb],
    .lightbox__img[b-xxviq45qzb] { animation: none; }
}

.gallery__placeholder[b-xxviq45qzb] { width: 8rem; height: 6rem; color: var(--moss-500); }

/* Single scrolling row — 50+ photos must not wrap into a wall of thumbs. */
.gallery__thumbs[b-xxviq45qzb] { display: flex; gap: var(--sp-2); list-style: none; margin: 0; padding: var(--sp-1); overflow-x: auto; }
.gallery__thumb[b-xxviq45qzb] {
    padding: 0;
    width: 4.75rem;
    height: 4.75rem;
    flex: none;
    border: 2px solid transparent;
    border-radius: var(--radius-sm);
    overflow: hidden;
    cursor: pointer;
    background: var(--surface-2);
}
.gallery__thumb:hover[b-xxviq45qzb] { border-color: var(--line-strong); }
.gallery__thumb.is-active[b-xxviq45qzb] { border-color: var(--brand-700); }
.gallery__thumb:focus-visible[b-xxviq45qzb] { outline: 3px solid var(--focus); outline-offset: 2px; }
.gallery__thumb img[b-xxviq45qzb] { width: 100%; height: 100%; object-fit: cover; display: block; }
/* /Shared/Ui/MpEmptyState.razor.rz.scp.css */
/* Scoped to MpEmptyState — the layout itself comes from the global .empty-state classes. */
.empty-state__icon[b-7waycaxq2b] {
    font-size: 2.5rem;
    line-height: 1;
}
/* /Shared/Ui/MpModal.razor.rz.scp.css */
/* Scoped to MpModal — native <dialog> confirm modal (backdrop + body scroll handled natively). */
.mp-modal[b-j22cho1ts0] {
    border: 0;
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-3);
    padding: var(--sp-6);
    max-width: 28rem;
    width: calc(100vw - 2 * var(--sp-5));
    max-height: min(85dvh, 44rem);
}

/* Long content scrolls inside the body region while title + actions stay visible.
   display is gated on [open] — an unconditional display:flex would override the UA's
   display:none and show the closed dialog. */
.mp-modal[open][b-j22cho1ts0] {
    display: flex;
    flex-direction: column;
}

.mp-modal__title[b-j22cho1ts0] { flex-shrink: 0; }

.mp-modal .form-actions[b-j22cho1ts0] { flex-shrink: 0; }

.mp-modal[b-j22cho1ts0]::backdrop {
    background: rgb(14 31 22 / 0.45);
}

.mp-modal__title[b-j22cho1ts0] {
    margin: 0 0 var(--sp-4);
    font-size: var(--text-lg);
}

.mp-modal__body[b-j22cho1ts0] {
    margin-block-end: var(--sp-5);
    overflow-y: auto;
    min-height: 0;
}
/* /Shared/Ui/MpStatTile.razor.rz.scp.css */
/* Scoped to MpStatTile — surface card with a big display numeral. */
.stat-tile[b-uaxfm5rfb0] {
    display: flex;
    flex-direction: column;
    gap: var(--sp-1);
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: var(--shadow-1);
    padding: var(--sp-5);
    color: inherit;
    text-decoration: none;
    transition: border-color var(--dur-fast) var(--ease-out);
}

a.stat-tile:hover[b-uaxfm5rfb0],
a.stat-tile:focus-visible[b-uaxfm5rfb0] {
    border-color: var(--brand-500);
    text-decoration: none;
}

.stat-tile__label[b-uaxfm5rfb0] {
    font-size: var(--text-sm);
    font-weight: 600;
    color: var(--ink-500);
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.stat-tile__value[b-uaxfm5rfb0] {
    font-family: var(--font-display);
    font-weight: 700;
    font-size: var(--text-2xl);
    font-feature-settings: var(--numeric-data);
    line-height: var(--leading-tight);
    color: var(--ink-900);
}

.stat-tile--muted .stat-tile__value[b-uaxfm5rfb0] { color: var(--ink-500); }
.stat-tile--danger .stat-tile__value[b-uaxfm5rfb0] { color: var(--danger-600); }
.stat-tile--ok .stat-tile__value[b-uaxfm5rfb0] { color: var(--ok-600); }

.stat-tile__hint[b-uaxfm5rfb0] {
    font-size: var(--text-sm);
    color: var(--ink-500);
}
/* /Shared/Ui/MpTabs.razor.rz.scp.css */
/* Scoped to MpTabs — underlined tab strip. */
.mp-tabs[b-f81j8c2suy] {
    display: flex;
    flex-direction: row;
    gap: var(--sp-2);
    border-bottom: 1px solid var(--line);
    overflow-x: auto;
}

.mp-tabs__tab[b-f81j8c2suy] {
    display: inline-flex;
    align-items: center;
    gap: var(--sp-2);
    min-height: var(--tap-min);
    padding-inline: var(--sp-4);
    border: 0;
    border-bottom: 2px solid transparent;
    background: none;
    color: var(--ink-500);
    font: inherit;
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
    transition: color var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out);
}

.mp-tabs__tab:hover[b-f81j8c2suy] {
    color: var(--ink-900);
    text-decoration: none;
}

.mp-tabs__tab--active[b-f81j8c2suy] {
    border-bottom-color: var(--brand-700);
    color: var(--ink-900);
    font-weight: 700;
}
/* /Shared/Ui/MpToastHost.razor.rz.scp.css */
/* Scoped to MpToastHost — fixed toast stack, bottom-right. */
.toast-host[b-rw2k78au05] {
    position: fixed;
    inset-block-end: var(--sp-5);
    inset-inline-end: var(--sp-5);
    z-index: var(--z-toast);
    display: flex;
    flex-direction: column;
    gap: var(--sp-3);
    /* Never wider than the viewport minus the fixed inset — a plain 24rem overflows 320px screens. */
    max-width: min(24rem, calc(100vw - 2 * var(--sp-5)));
}

.toast[b-rw2k78au05] {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: var(--sp-3);
    background: var(--surface);
    border: 1px solid var(--line);
    border-inline-start: 4px solid var(--info-600);
    border-radius: var(--radius);
    box-shadow: var(--shadow-2);
    padding: var(--sp-4);
    animation: mp-toast-in-b-rw2k78au05 var(--dur-base) var(--ease-out);
}

.toast--ok[b-rw2k78au05] { border-inline-start-color: var(--ok-600); }
.toast--danger[b-rw2k78au05] { border-inline-start-color: var(--danger-600); }
.toast--info[b-rw2k78au05] { border-inline-start-color: var(--info-600); }

.toast__message[b-rw2k78au05] { flex: 1; }

.toast__close[b-rw2k78au05] {
    min-width: var(--tap-min);
    min-height: var(--tap-min);
    border: 0;
    border-radius: var(--radius-sm);
    background: none;
    color: var(--ink-500);
    font: inherit;
    cursor: pointer;
}

.toast__close:hover[b-rw2k78au05] { color: var(--ink-900); }

@keyframes mp-toast-in-b-rw2k78au05 {
    from { transform: translateY(8px); opacity: 0; }
    to { transform: translateY(0); opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
    .toast[b-rw2k78au05] { animation: none; }
}
/* /Shared/Ui/MpTrendChart.razor.rz.scp.css */
/* Scoped to MpTrendChart — the two-series daily trend SVG (sibling of UsageChart). All colors come
   from design-system tokens (tokens.css); inline SVG resolves var() in CSS properties, so no
   hardcoded colors here. Clicks use accent-700 (not 600): the darker step clears 3:1 contrast on
   white for a 2.5px stroke, verified with the palette validator. */
.mp-trend[b-wra0nn451i] {
    width: 100%;
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: var(--sp-4);
}

/* Legend — plain HTML above the plot; text wears text tokens, the swatch carries the series color. */
.mp-trend__legend[b-wra0nn451i] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-2) var(--sp-5);
    margin-bottom: var(--sp-3);
}

.mp-trend__key[b-wra0nn451i] {
    display: inline-flex;
    align-items: center;
    gap: var(--sp-2);
    font-size: var(--text-sm);
    color: var(--ink-700);
}

.mp-trend__swatch[b-wra0nn451i] {
    width: 1.125rem;
    height: 3px;
    border-radius: 999px;
    flex-shrink: 0;
}

.mp-trend__swatch--a[b-wra0nn451i] { background: var(--brand-700); }
.mp-trend__swatch--b[b-wra0nn451i] { background: var(--accent-700); }

/* Mobile-safe at 320px: the wrapper scrolls horizontally, the SVG never shrinks below legibility. */
.mp-trend__scroll[b-wra0nn451i] {
    width: 100%;
    overflow-x: auto;
}

.mp-trend__svg[b-wra0nn451i] {
    width: 100%;
    min-width: 36rem;
    height: auto;
    display: block;
}

.mp-trend__grid[b-wra0nn451i] {
    stroke: var(--line);
    stroke-width: 1;
}

/* Axis labels — fine meta, tabular figures so counts align. */
.mp-trend__ylbl[b-wra0nn451i],
.mp-trend__xlbl[b-wra0nn451i] {
    fill: var(--ink-500);
    font-size: var(--text-xs);
    font-family: inherit;
    font-feature-settings: var(--numeric-data);
}

/* Series A (views) — solid brand line + soft brand wash. */
.mp-trend__line-a[b-wra0nn451i] {
    fill: none;
    stroke: var(--brand-700);
    stroke-width: 2.5;
    stroke-linejoin: round;
    stroke-linecap: round;
}

.mp-trend__area-a[b-wra0nn451i] {
    fill: var(--brand-700);
    fill-opacity: 0.08;
}

/* Series B (clicks) — accent line, no fill (two washes would mud together). */
.mp-trend__line-b[b-wra0nn451i] {
    fill: none;
    stroke: var(--accent-700);
    stroke-width: 2.5;
    stroke-linejoin: round;
    stroke-linecap: round;
}

/* End dots with a surface ring so they stay legible where the lines cross. */
.mp-trend__dot-a[b-wra0nn451i] {
    fill: var(--brand-700);
    stroke: var(--surface);
    stroke-width: 2;
}

.mp-trend__dot-b[b-wra0nn451i] {
    fill: var(--accent-700);
    stroke: var(--surface);
    stroke-width: 2;
}
/* /Shared/Ui/ScrapeRunningIndicator.razor.rz.scp.css */
/* Scoped to ScrapeRunningIndicator — the live "a scrape is running" pill in the admin topbar.
   Light pill on the light topbar; the spinner inherits currentColor. */
.scrape-indicator[b-gkta4cdjgh] {
    display: inline-flex;
    align-items: center;
    gap: var(--sp-2);
    padding: var(--sp-1) var(--sp-3);
    border-radius: var(--radius-pill);
    background: var(--brand-050);
    color: var(--brand-800);
    font-size: var(--text-xs);
    font-weight: 600;
    white-space: nowrap;
    text-decoration: none;
    /* The pill must never force the topbar wider than the viewport: let it shrink
       (min-width:0 allows it) — the source-name span below carries the ellipsis. */
    flex-shrink: 1;
    min-width: 0;
    /* Mobile-first: the pill is a link — meet the 44px tap minimum on phones. */
    min-height: var(--tap-min);
}

.scrape-indicator:hover[b-gkta4cdjgh] { background: var(--brand-100); }

/* <40rem: compact form — spinner + count only, so the topbar never overflows a phone. */
.scrape-indicator__text[b-gkta4cdjgh] { display: none; }

.scrape-indicator__count[b-gkta4cdjgh] { font-feature-settings: var(--numeric-data); }

@media (min-width: 40rem) {
    .scrape-indicator[b-gkta4cdjgh] { min-height: auto; }

    /* A long source name ("Brdr. Holst Sørensen Maskinforretning") must ellipsize, not push the
       username/logout off-screen at tablet widths (flex items blockify, so overflow applies). */
    .scrape-indicator__text[b-gkta4cdjgh] {
        display: inline-block;
        max-width: 18ch;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .scrape-indicator__count[b-gkta4cdjgh] { display: none; }
}

.scrape-indicator__more[b-gkta4cdjgh] {
    background: var(--brand-100);
    border-radius: var(--radius-pill);
    padding: 0 var(--sp-2);
}
/* /Shared/Ui/UsageChart.razor.rz.scp.css */
/* Scoped to UsageChart — the cumulative-cost SVG. All colors come from design-system tokens
   (tokens.css); inline SVG resolves var() in CSS properties, so no hardcoded colors here. */
.usage-chart[b-tvbl3qnnbs] {
    width: 100%;
    overflow-x: auto;
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: var(--sp-4);
}

.usage-chart__svg[b-tvbl3qnnbs] {
    width: 100%;
    height: auto;
    display: block;
    /* The 900×320 viewBox scales with width — below ~36rem the axis text shrinks to ~5px.
       A min-width makes the wrapper's overflow-x:auto scroll instead of shrinking the chart. */
    min-width: 36rem;
}

.usage-chart__grid[b-tvbl3qnnbs] {
    stroke: var(--line);
    stroke-width: 1;
}

/* Axis labels — fine meta, tabular figures so amounts align. */
.usage-chart__ylbl[b-tvbl3qnnbs],
.usage-chart__xlbl[b-tvbl3qnnbs] {
    fill: var(--ink-500);
    font-size: var(--text-xs);
    font-family: inherit;
    font-feature-settings: var(--numeric-data);
}

/* Actual spend so far — solid brand line + soft brand fill. */
.usage-chart__line[b-tvbl3qnnbs] {
    fill: none;
    stroke: var(--brand-700);
    stroke-width: 2.5;
    stroke-linejoin: round;
    stroke-linecap: round;
}

.usage-chart__area[b-tvbl3qnnbs] {
    fill: var(--brand-700);
    fill-opacity: 0.08;
}

.usage-chart__dot[b-tvbl3qnnbs] {
    fill: var(--brand-800);
    stroke: var(--surface);
    stroke-width: 2;
}

/* Projection to end of period — muted dashed line + fainter brand fill. */
.usage-chart__proj-line[b-tvbl3qnnbs] {
    fill: none;
    stroke: var(--ink-300);
    stroke-width: 2;
    stroke-dasharray: 6 5;
}

.usage-chart__proj-area[b-tvbl3qnnbs] {
    fill: var(--brand-700);
    fill-opacity: 0.04;
}