@import '_content/Quorcel.Authoring/Quorcel.Authoring.bhqtjl62cl.bundle.scp.css';
@import '_content/Quorcel.Components/Quorcel.Components.ial87dxufe.bundle.scp.css';

/* /Components/Layout/BuilderLayout.razor.rz.scp.css */
/* Edge-to-edge: the builder (.bslb) sizes itself to 100dvh inside. */
.builder-shell[b-hjrel2nhqt] {
    height: 100dvh;
    overflow: hidden;
    background: var(--builder-bg);
}
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-55pnwreogp],
.components-reconnect-repeated-attempt-visible[b-55pnwreogp],
.components-reconnect-failed-visible[b-55pnwreogp],
.components-pause-visible[b-55pnwreogp],
.components-resume-failed-visible[b-55pnwreogp],
.components-rejoining-animation[b-55pnwreogp] {
    display: none;
}

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


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

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

}

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

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

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

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

    100% {
        opacity: 1;
    }
}

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

    100% {
        opacity: 0;
    }
}

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

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

#components-reconnect-modal button[b-55pnwreogp] {
    border: 0;
    background-color: var(--quorcel-accent);
    color: var(--on-brand);
    padding: 4px 24px;
    border-radius: 4px;
}

    #components-reconnect-modal button:hover[b-55pnwreogp] {
        background-color: color-mix(in oklch, var(--quorcel-accent), black 15%);
    }

    #components-reconnect-modal button:active[b-55pnwreogp] {
        background-color: var(--quorcel-accent);
    }

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

    .components-rejoining-animation div[b-55pnwreogp] {
        position: absolute;
        border: 3px solid var(--quorcel-accent);
        opacity: 1;
        border-radius: 50%;
        animation: components-rejoining-animation-b-55pnwreogp 1.5s cubic-bezier(0, 0.2, 0.8, 1) infinite;
    }

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

@keyframes components-rejoining-animation-b-55pnwreogp {
    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/Layout/WorkspaceHeader.razor.rz.scp.css */
/* The universal Workspace header — Quorcel chrome (the --builder-* tokens: fixed OKLCH
   neutrals in both colour schemes, never the org's --brand-*). Left and right groups share
   the slack equally so the section pills sit in the exact centre of the bar. */
.wsh[b-4aplfdy0jj] {
    display: flex;
    align-items: center;
    gap: 12px;
    height: 56px;
    padding: 0 16px;
    flex: none;
    background: var(--builder-surface);
    border-bottom: 1px solid var(--builder-border);
    color: var(--builder-ink);
}

.wsh__left[b-4aplfdy0jj],
.wsh__right[b-4aplfdy0jj] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex: 1 1 0;
    min-width: 0;
}

.wsh__right[b-4aplfdy0jj] {
    justify-content: flex-end;
}

/* The Quorcel logo (the mark over its wordmark): Quorcel's own, never the org's. */
.wsh__mark[b-4aplfdy0jj] {
    display: grid;
    place-items: center;
    flex: none;
    border-radius: 6px;
    text-decoration: none;
}

.wsh__mark:focus-visible[b-4aplfdy0jj] {
    outline: 2px solid var(--builder-accent);
    outline-offset: 2px;
}

.wsh__logo[b-4aplfdy0jj] {
    display: block;
    height: 40px;
    width: auto;
}

.wsh__org[b-4aplfdy0jj] {
    color: var(--builder-ink);
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.wsh__org:hover[b-4aplfdy0jj] {
    color: var(--builder-accent);
}

/* Section pills — the same pill-group treatment as the builder's region and breakpoint switchers. */
.wsh__sections[b-4aplfdy0jj] {
    display: flex;
    align-items: center;
    gap: 2px;
    padding: 3px;
    flex: none;
    border-radius: 10px;
    background: var(--builder-bg);
}

.wsh__pill[b-4aplfdy0jj] {
    display: grid;
    place-items: center;
    width: 30px;
    height: 30px;
    border-radius: 8px;
    color: var(--builder-ink-soft);
    text-decoration: none;
}

.wsh__pill:hover[b-4aplfdy0jj] {
    color: var(--builder-ink);
    background: var(--builder-accent-ghost);
}

.wsh__pill--active[b-4aplfdy0jj],
.wsh__pill--active:hover[b-4aplfdy0jj] {
    color: var(--on-chrome-accent);
    background: var(--builder-accent);
}

/* MudIcon's svg is a child component root, so the scope attribute isn't on it: ::deep. */
.wsh__pill[b-4aplfdy0jj]  .mud-icon-root {
    width: 16px;
    height: 16px;
}

.wsh__avatar[b-4aplfdy0jj] {
    display: grid;
    place-items: center;
    width: 30px;
    height: 30px;
    flex: none;
    border-radius: 50%;
    background: var(--builder-accent-ghost);
    color: var(--builder-accent);
    font-size: 12px;
    font-weight: 700;
}

/* The account menu (2026-10-07): a <details> so static SSR needs no script. The summary IS the
   avatar; the panel drops below it, right-aligned, in the same chrome tokens. */
.wsh__account[b-4aplfdy0jj] {
    position: relative;
    flex: none;
}

.wsh__account > summary[b-4aplfdy0jj] {
    list-style: none;
    cursor: pointer;
}

.wsh__account > summary[b-4aplfdy0jj]::-webkit-details-marker {
    display: none;
}

.wsh__account > summary:focus-visible[b-4aplfdy0jj] {
    outline: 2px solid var(--builder-accent);
    outline-offset: 2px;
}

.wsh__account[open] > summary[b-4aplfdy0jj] {
    background: var(--builder-accent);
    color: var(--on-chrome-accent);
}

.wsh__menu[b-4aplfdy0jj] {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    z-index: 20;
    min-width: 220px;
    padding: 6px;
    border-radius: 10px;
    background: var(--builder-surface);
    border: 1px solid var(--builder-border);
    box-shadow: 0 8px 24px oklch(0 0 0 / 0.18);
}

.wsh__menu-id[b-4aplfdy0jj] {
    display: grid;
    gap: 2px;
    padding: 8px 10px 10px;
    border-bottom: 1px solid var(--builder-border);
    margin-bottom: 6px;
}

.wsh__menu-name[b-4aplfdy0jj] {
    font-size: 13px;
    font-weight: 600;
    color: var(--builder-ink);
}

.wsh__menu-email[b-4aplfdy0jj] {
    font-size: 12px;
    color: var(--builder-ink-soft);
    overflow: hidden;
    text-overflow: ellipsis;
}

.wsh__menu-form[b-4aplfdy0jj] {
    margin: 0;
}

.wsh__menu-item[b-4aplfdy0jj] {
    display: block;
    width: 100%;
    padding: 8px 10px;
    border: 0;
    border-radius: 8px;
    background: none;
    color: var(--builder-ink);
    font: inherit;
    font-size: 13px;
    text-align: left;
    text-decoration: none;
    cursor: pointer;
}

.wsh__menu-item:hover[b-4aplfdy0jj],
.wsh__menu-item:focus-visible[b-4aplfdy0jj] {
    background: var(--builder-accent-ghost);
    color: var(--builder-accent);
    outline: none;
}
/* /Components/Layout/WorkspaceLayout.razor.rz.scp.css */
/* Header on top, the page beneath. Content pages scroll the document; the editors pin the
   shell to the viewport and fill it (their .bslb / .bslt roots are flex: 1). */
.wsl[b-kjtkskqwau] {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    min-height: 100dvh;
    background: var(--surface);
    color: var(--ink);
}

.wsl--editor[b-kjtkskqwau] {
    height: 100vh;
    height: 100dvh;
    min-height: 0;
    overflow: hidden;
}

.wsl__main[b-kjtkskqwau] {
    flex: 1;
    padding-block: 1.5rem;
}

.wsl__main--editor[b-kjtkskqwau] {
    display: flex;
    flex-direction: column;
    min-height: 0;
    padding: 0;
    overflow: hidden;
}
/* /Components/Org/AgentProviderCard.razor.rz.scp.css */
/* One provider card on the Agents page — Quorcel chrome, like the rest of Manage. Folded by
   default (2026-10-28): the header row is a button that opens the body. */

.agentcard[b-y27gpberqa] {
    border: 1px solid var(--line);
    border-radius: .75rem;
    background: var(--surface-raised);
}

.agentcard--default[b-y27gpberqa] {
    border-color: var(--chrome-link);
}

/* ── The header row = the toggle ────────────────────────────────────────────── */
.agentcard__toggle[b-y27gpberqa] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .6rem 1rem;
    width: 100%;
    padding: .9rem 1.1rem;
    border: 0;
    border-radius: inherit;
    background: transparent;
    color: inherit;
    font: inherit;
    text-align: left;
    cursor: pointer;
}

.agentcard__toggle:hover[b-y27gpberqa] {
    background: color-mix(in oklch, var(--ink), transparent 96%);
}

.agentcard--open .agentcard__toggle[b-y27gpberqa] {
    border-end-start-radius: 0;
    border-end-end-radius: 0;
}

.agentcard__chevron[b-y27gpberqa] {
    flex: none;
    color: var(--ink-faint);
    transform: rotate(-90deg);
    transition: transform .18s ease;
}

.agentcard--open .agentcard__chevron[b-y27gpberqa] {
    transform: none;
}

.agentcard__titles[b-y27gpberqa] {
    display: grid;
    flex: 1 1 12rem;
    gap: .2rem;
    min-width: 0;
}

.agentcard__title[b-y27gpberqa] {
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--ink);
}

.agentcard__vendor[b-y27gpberqa] {
    font-size: .85rem;
    font-weight: 500;
    color: var(--ink-faint);
}

.agentcard__blurb[b-y27gpberqa] {
    font-size: .9rem;
    font-weight: 400;
    color: var(--ink-soft);
}

.agentcard__summary[b-y27gpberqa] {
    flex: none;
    font-size: .85rem;
    color: var(--ink-soft);
}

.agentcard__chips[b-y27gpberqa] {
    display: flex;
    flex: none;
    align-items: center;
    gap: .5rem;
}

/* ── Chips ───────────────────────────────────────────────────────────────────── */
.agentcard__chip[b-y27gpberqa] {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    padding: .3rem .7rem;
    border: 1px solid currentColor;
    border-radius: 999px;
    font-size: .78rem;
    font-weight: 600;
    white-space: nowrap;
}

.agentcard__chip-dot[b-y27gpberqa] {
    width: .45rem;
    height: .45rem;
    border-radius: 50%;
    background: currentColor;
}

.agentcard__chip--none[b-y27gpberqa] { color: var(--ink-faint); }
.agentcard__chip--connected[b-y27gpberqa] { color: var(--color-success); }

.agentcard__chip--default[b-y27gpberqa] {
    border-color: transparent;
    background: var(--chrome-tint);
    color: var(--chrome-link);
}

/* ── The body (open only) ───────────────────────────────────────────────────── */
.agentcard__body[b-y27gpberqa] {
    display: grid;
    gap: 1rem;
    padding: .1rem 1.25rem 1.1rem;
}

/* ── Facts about the stored connection ──────────────────────────────────────── */
.agentcard__facts[b-y27gpberqa] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr));
    gap: .6rem 1rem;
    margin: 0;
    padding: .8rem 1rem;
    border-radius: .6rem;
    background: color-mix(in oklch, var(--ink), transparent 94%);
}

.agentcard__fact[b-y27gpberqa] {
    display: grid;
    gap: .15rem;
    min-width: 0;
}

.agentcard__fact dt[b-y27gpberqa] {
    font-size: .72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: var(--ink-faint);
}

.agentcard__fact dd[b-y27gpberqa] {
    margin: 0;
    font-size: .88rem;
    color: var(--ink);
    overflow-wrap: anywhere;
}

.agentcard__mono[b-y27gpberqa] {
    font-family: ui-monospace, "Cascadia Mono", "JetBrains Mono", Menlo, Consolas, monospace;
}

.agentcard__test[b-y27gpberqa] {
    display: flex;
    align-items: center;
    gap: .5rem;
    margin: 0;
    font-size: .85rem;
    color: var(--ink-faint);
}

.agentcard__test--ok[b-y27gpberqa] { color: var(--color-success); }
.agentcard__test--failed[b-y27gpberqa] { color: var(--color-danger); }

/* ── The form ───────────────────────────────────────────────────────────────── */
.agentcard__form[b-y27gpberqa] {
    display: grid;
    gap: .75rem;
    margin: 0;
}

.agentcard__field[b-y27gpberqa] {
    display: grid;
    gap: .3rem;
}

.agentcard__label[b-y27gpberqa] {
    font-size: .8rem;
    font-weight: 600;
    color: var(--ink-soft);
}

.agentcard__optional[b-y27gpberqa] {
    font-weight: 400;
    color: var(--ink-faint);
}

.agentcard__input[b-y27gpberqa] {
    width: 100%;
    max-width: 30rem;
}

.agentcard__input--key[b-y27gpberqa] {
    font-family: ui-monospace, "Cascadia Mono", "JetBrains Mono", Menlo, Consolas, monospace;
}

.agentcard__hint[b-y27gpberqa] {
    margin: 0;
    font-size: .82rem;
    color: var(--ink-faint);
}

.agentcard__hint a[b-y27gpberqa] {
    color: var(--chrome-link);
}

.agentcard__actions[b-y27gpberqa] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .5rem;
}

.agentcard__remove[b-y27gpberqa] { color: var(--color-danger); }

/* ── Editing a stored connection (2026-10-23) ────────────────────────────────
   Change models / Rotate key each open one panel in place of the action row: a bordered well
   with a title that says what is being changed, so it never reads as a new connection. */
.agentcard__edit[b-y27gpberqa] {
    padding: .9rem 1rem;
    border: 1px solid var(--line);
    border-radius: .6rem;
    background: var(--surface);
}

.agentcard__edit-title[b-y27gpberqa] {
    font-size: .9rem;
    font-weight: 600;
    color: var(--ink);
}

/* One pick per main AI task (2026-10-28), under the default they fall back to. */
.agentcard__tasks[b-y27gpberqa] {
    display: grid;
    gap: .5rem;
    padding-block-start: .5rem;
    border-block-start: 1px solid var(--line);
}

/* A compact row (Alan, 2026-10-28): the label on the left, the choice on the right. */
.agentcard__field--row[b-y27gpberqa] {
    grid-template-columns: 9rem minmax(0, 20rem);
    align-items: center;
    gap: .75rem;
}

.agentcard__field--row .agentcard__select-wrap[b-y27gpberqa],
.agentcard__field--row .agentcard__input[b-y27gpberqa] {
    max-width: none;
}

@container (max-width: 36rem) {
    .agentcard__field--row[b-y27gpberqa] {
        grid-template-columns: 1fr;
        gap: .3rem;
    }
}

/* The model picker: a native select wearing the input chrome and the same faint chevron the
   builder's selects use, so Windows' heavy OS arrow never shows. */
.agentcard__select-wrap[b-y27gpberqa] {
    position: relative;
    display: block;
    max-width: 30rem;
}

.agentcard__select[b-y27gpberqa] {
    appearance: none;
    -webkit-appearance: none;
    padding-right: 2rem;
    font-family: ui-monospace, "Cascadia Mono", "JetBrains Mono", Menlo, Consolas, monospace;
}

.agentcard__select-wrap[b-y27gpberqa]::after {
    content: "";
    position: absolute;
    right: .6rem;
    top: 50%;
    width: 12px;
    height: 12px;
    transform: translateY(-50%);
    pointer-events: none;
    background-color: var(--ink-faint);
    -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M7.41 8.59 12 13.17l4.59-4.58L18 10l-6 6-6-6 1.41-1.41z'/></svg>") center / contain no-repeat;
    mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M7.41 8.59 12 13.17l4.59-4.58L18 10l-6 6-6-6 1.41-1.41z'/></svg>") center / contain no-repeat;
}
/* /Components/Org/MembersPanel.razor.rz.scp.css */
/* The Members tab — Quorcel chrome, like the rest of a Manage page (never the org's brand). */
.members[b-y53fm3yk9p] {
    display: grid;
    gap: 2rem;
    max-width: 760px;
}

.members__h[b-y53fm3yk9p] {
    display: flex;
    align-items: baseline;
    gap: .5rem;
    margin: 0 0 .35rem;
    font-size: 1.05rem;
    font-weight: 600;
    color: var(--ink);
}

.members__count[b-y53fm3yk9p] {
    font-size: .85rem;
    font-weight: 500;
    color: var(--ink-soft);
}

.members__sub[b-y53fm3yk9p] {
    margin: 0 0 .9rem;
    color: var(--ink-soft);
    font-size: .9rem;
}

.members__invite-form[b-y53fm3yk9p] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 160px auto;
    gap: .75rem;
    align-items: start;
}

.members__problem[b-y53fm3yk9p] {
    margin: .6rem 0 0;
    color: var(--color-danger);
    font-size: .9rem;
}

.members__empty[b-y53fm3yk9p] {
    margin: 0;
    color: var(--ink-faint);
}

.members__list[b-y53fm3yk9p] {
    list-style: none;
    margin: 0;
    padding: 0;
    border: 1px solid var(--line);
    border-radius: .75rem;
    background: var(--surface-raised);
}

.members__row[b-y53fm3yk9p] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 160px auto;
    gap: .75rem;
    align-items: center;
    padding: .7rem .9rem;
}

.members__row + .members__row[b-y53fm3yk9p] {
    border-top: 1px solid var(--line);
}

.members__row--pending .members__name[b-y53fm3yk9p] {
    font-weight: 500;
}

.members__who[b-y53fm3yk9p] {
    display: grid;
    min-width: 0;
}

.members__name[b-y53fm3yk9p] {
    font-weight: 600;
    color: var(--ink);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.members__email[b-y53fm3yk9p] {
    font-size: .85rem;
    color: var(--ink-soft);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.members__role-fixed[b-y53fm3yk9p] {
    font-size: .9rem;
    color: var(--ink-soft);
}

@media (max-width: 640px) {
    .members__invite-form[b-y53fm3yk9p],
    .members__row[b-y53fm3yk9p] {
        grid-template-columns: minmax(0, 1fr);
    }
}
/* /Components/Org/OrgAgents.razor.rz.scp.css */
/* The Agents page — Quorcel chrome, like the rest of Manage (never the org's brand); it fills
   the workspace column like Manage does. */

.agents__back[b-oom3q9tcm2] {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    margin-bottom: .9rem;
    color: var(--chrome-link);
    font-size: .9rem;
    font-weight: 600;
    text-decoration: none;
}

.agents__back:hover[b-oom3q9tcm2] {
    text-decoration: underline;
}

.agents__head[b-oom3q9tcm2] {
    align-items: flex-start;
}

/* ── Status chip ─────────────────────────────────────────────────────────────── */
.agents__chip[b-oom3q9tcm2] {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    padding: .35rem .75rem;
    border: 1px solid currentColor;
    border-radius: 999px;
    font-size: .8rem;
    font-weight: 600;
    white-space: nowrap;
}

.agents__chip-dot[b-oom3q9tcm2] {
    width: .45rem;
    height: .45rem;
    border-radius: 50%;
    background: currentColor;
}

.agents__chip--none[b-oom3q9tcm2] { color: var(--ink-faint); }
.agents__chip--connected[b-oom3q9tcm2] { color: var(--color-success); }

.agents__problem[b-oom3q9tcm2] {
    margin: 0 0 1rem;
    font-size: .9rem;
    color: var(--color-danger);
}

/* ── Headings and the cards ─────────────────────────────────────────────────── */
.agents__h[b-oom3q9tcm2] {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: .5rem;
    margin: 0 0 .75rem;
    font-size: 1.05rem;
    font-weight: 600;
    color: var(--ink);
}

.agents__h-sub[b-oom3q9tcm2] {
    font-size: .85rem;
    font-weight: 400;
    color: var(--ink-soft);
}

.agents__grid[b-oom3q9tcm2] {
    display: grid;
    gap: 1rem;
}

/* ── Usage (2026-10-28) ─────────────────────────────────────────────────────── */
.agents__usage[b-oom3q9tcm2] {
    margin-top: 1.5rem;
}

.agents__empty[b-oom3q9tcm2] {
    margin: 0;
    font-size: .9rem;
    color: var(--ink-faint);
}

.agents__totals[b-oom3q9tcm2] {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem .75rem;
    margin-bottom: .75rem;
}

.agents__total[b-oom3q9tcm2] {
    display: grid;
    gap: .15rem;
    padding: .6rem .9rem;
    border: 1px solid var(--line);
    border-radius: .6rem;
    background: var(--surface-raised);
}

.agents__total-name[b-oom3q9tcm2] {
    font-size: .8rem;
    font-weight: 600;
    color: var(--ink-soft);
}

.agents__total-figures[b-oom3q9tcm2] {
    font-size: .9rem;
    color: var(--ink);
}

.agents__table-wrap[b-oom3q9tcm2] {
    overflow-x: auto;
    border: 1px solid var(--line);
    border-radius: .6rem;
    background: var(--surface-raised);
}

.agents__table[b-oom3q9tcm2] {
    width: 100%;
    border-collapse: collapse;
    font-size: .85rem;
}

.agents__table th[b-oom3q9tcm2],
.agents__table td[b-oom3q9tcm2] {
    padding: .5rem .75rem;
    border-bottom: 1px solid var(--line);
    text-align: left;
    white-space: nowrap;
}

.agents__table th[b-oom3q9tcm2] {
    font-size: .72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: var(--ink-faint);
}

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

.agents__num[b-oom3q9tcm2] {
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.agents__mono[b-oom3q9tcm2] {
    font-family: ui-monospace, "Cascadia Mono", "JetBrains Mono", Menlo, Consolas, monospace;
}

.agents__outcome[b-oom3q9tcm2] {
    display: inline-block;
    padding: .15rem .55rem;
    border-radius: 999px;
    font-size: .75rem;
    font-weight: 600;
    background: color-mix(in oklch, var(--ink), transparent 92%);
    color: var(--ink-soft);
}

.agents__outcome--succeeded[b-oom3q9tcm2] {
    background: color-mix(in oklch, var(--color-success), transparent 85%);
    color: var(--color-success);
}

.agents__outcome--failed[b-oom3q9tcm2],
.agents__outcome--quota[b-oom3q9tcm2] {
    background: color-mix(in oklch, var(--color-danger), transparent 85%);
    color: var(--color-danger);
}

/* ── The note ───────────────────────────────────────────────────────────────── */
.agents__note[b-oom3q9tcm2] {
    display: flex;
    align-items: center;
    gap: .75rem;
    margin-top: 1.5rem;
    padding: .9rem 1rem;
    border-radius: .65rem;
    background: color-mix(in oklch, var(--ink), transparent 94%);
    color: var(--chrome-link);
}

.agents__note div[b-oom3q9tcm2] {
    display: grid;
    gap: .15rem;
}

.agents__note-title[b-oom3q9tcm2] {
    font-size: .9rem;
    font-weight: 600;
    color: var(--ink);
}

.agents__note-sub[b-oom3q9tcm2] {
    font-size: .85rem;
    color: var(--ink-soft);
}
/* /Components/Org/OrgAnalytics.razor.rz.scp.css */
/* Headline stat tiles: plain authored divs (not MudPaper — the scope attribute never
   lands on a component's root) styled like the workspace's outlined cards. The value
   wears the primary text token, never a series colour. */
.bsl-ana-tiles[b-so3fn5d83q] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 12px;
}

.bsl-ana-tile[b-so3fn5d83q] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 14px 16px;
    border: 1px solid var(--mud-palette-lines-default);
    border-radius: var(--mud-default-borderradius);
}

.bsl-ana-tile__value[b-so3fn5d83q] {
    font-size: 1.75rem;
    font-weight: 700;
    line-height: 1.2;
}

.bsl-ana-tile__label[b-so3fn5d83q] {
    font-size: 0.75rem;
}
/* /Components/Org/OrgDomain.razor.rz.scp.css */
/* The custom-domain page — Quorcel chrome, like the rest of Manage (never the org's brand);
   it fills the workspace column like Manage does. */

.domain__back[b-2qbcpx92qj] {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    margin-bottom: .9rem;
    color: var(--chrome-link);
    font-size: .9rem;
    font-weight: 600;
    text-decoration: none;
}

.domain__back:hover[b-2qbcpx92qj] {
    text-decoration: underline;
}

.domain__head[b-2qbcpx92qj] {
    align-items: flex-start;
}

/* ── Status chip ─────────────────────────────────────────────────────────────── */
.domain__chip[b-2qbcpx92qj] {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    padding: .35rem .75rem;
    border: 1px solid currentColor;
    border-radius: 999px;
    font-size: .8rem;
    font-weight: 600;
    white-space: nowrap;
}

.domain__chip-dot[b-2qbcpx92qj] {
    width: .45rem;
    height: .45rem;
    border-radius: 50%;
    background: currentColor;
}

.domain__chip--none[b-2qbcpx92qj] { color: var(--ink-faint); }
.domain__chip--pending[b-2qbcpx92qj] { color: var(--color-warn); }
.domain__chip--verified[b-2qbcpx92qj] { color: var(--color-success); }

/* ── Steps ───────────────────────────────────────────────────────────────────── */
.domain__steps[b-2qbcpx92qj] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
    list-style: none;
    margin: 0 0 1.75rem;
    padding: 0;
}

.domain__step[b-2qbcpx92qj] {
    display: grid;
    gap: .55rem;
    padding-top: .75rem;
    border-top: 3px solid var(--line);
}

.domain__step--done[b-2qbcpx92qj] { border-top-color: var(--chrome-link); }
.domain__step--current[b-2qbcpx92qj] { border-top-color: var(--chrome-accent); }

.domain__step-row[b-2qbcpx92qj] {
    display: flex;
    align-items: center;
    gap: .6rem;
}

.domain__step-num[b-2qbcpx92qj] {
    display: grid;
    place-items: center;
    width: 1.5rem;
    height: 1.5rem;
    border-radius: 50%;
    background: var(--chrome-tint);
    color: var(--ink-faint);
    font-size: .75rem;
    font-weight: 700;
}

.domain__step--done .domain__step-num[b-2qbcpx92qj] {
    background: var(--chrome-link);
    color: var(--on-chrome-accent);
}

.domain__step--current .domain__step-num[b-2qbcpx92qj] {
    background: var(--chrome-accent);
    color: var(--on-chrome-accent);
}

.domain__step-title[b-2qbcpx92qj] {
    font-weight: 600;
    color: var(--ink);
}

.domain__step--todo .domain__step-title[b-2qbcpx92qj] { color: var(--ink-faint); }

.domain__step-sub[b-2qbcpx92qj] {
    font-size: .85rem;
    color: var(--ink-faint);
}

/* ── Headings and the domain panel ───────────────────────────────────────────── */
.domain__h[b-2qbcpx92qj] {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: .5rem;
    margin: 0 0 .5rem;
    font-size: 1.05rem;
    font-weight: 600;
    color: var(--ink);
}

.domain__h-sub[b-2qbcpx92qj] {
    font-size: .85rem;
    font-weight: 400;
    color: var(--ink-soft);
}

.domain__panel[b-2qbcpx92qj] {
    padding: 1.1rem 1.25rem;
    border: 1px solid var(--line);
    border-radius: .75rem;
    background: var(--surface-raised);
}

.domain__form[b-2qbcpx92qj] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .75rem;
    margin: 0;
}

.domain__input[b-2qbcpx92qj] {
    flex: 1 1 16rem;
    max-width: 26rem;
    font-family: ui-monospace, "Cascadia Mono", "JetBrains Mono", Menlo, Consolas, monospace;
}

.domain__remove[b-2qbcpx92qj] { color: var(--color-danger); }

.domain__hint[b-2qbcpx92qj] {
    margin: .75rem 0 0;
    font-size: .85rem;
    color: var(--ink-faint);
}

.domain__problem[b-2qbcpx92qj] {
    margin: .6rem 0 0;
    font-size: .9rem;
    color: var(--color-danger);
}

/* ── Records table ───────────────────────────────────────────────────────────── */
.domain__records[b-2qbcpx92qj] {
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: .75rem;
    background: var(--surface-raised);
}

.domain__records-head[b-2qbcpx92qj],
.domain__record[b-2qbcpx92qj] {
    display: grid;
    grid-template-columns: 4.5rem 15rem minmax(0, 1fr) 9.5rem 2rem;
    align-items: center;
    gap: 1rem;
    padding: .85rem 1.1rem;
}

.domain__records-head[b-2qbcpx92qj] {
    padding-block: .6rem;
    background: color-mix(in oklch, var(--ink), transparent 94%);
    font-size: .75rem;
    font-weight: 600;
    color: var(--ink-faint);
}

.domain__record + .domain__record[b-2qbcpx92qj] { border-top: 1px solid var(--line); }

.domain__type[b-2qbcpx92qj] {
    display: inline-block;
    padding: .15rem .5rem;
    border-radius: .4rem;
    background: var(--chrome-tint);
    color: var(--chrome-link);
    font-size: .75rem;
    font-weight: 700;
}

.domain__mono[b-2qbcpx92qj] {
    font-family: ui-monospace, "Cascadia Mono", "JetBrains Mono", Menlo, Consolas, monospace;
    font-size: .85rem;
    color: var(--ink);
}

.domain__value[b-2qbcpx92qj] { overflow-wrap: anywhere; }

.domain__state[b-2qbcpx92qj] {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    font-size: .82rem;
    font-weight: 600;
    color: var(--ink-faint);
}

.domain__state--found[b-2qbcpx92qj] { color: var(--color-success); }
.domain__state--pending[b-2qbcpx92qj] { color: var(--color-warn); }

.domain__copy[b-2qbcpx92qj] {
    display: grid;
    place-items: center;
    width: 1.75rem;
    height: 1.75rem;
    border: 0;
    border-radius: .4rem;
    background: transparent;
    color: var(--ink-soft);
    cursor: pointer;
}

.domain__copy:hover[b-2qbcpx92qj] { background: var(--chrome-tint); color: var(--chrome-link); }

.domain__footnote[b-2qbcpx92qj] {
    display: flex;
    align-items: center;
    gap: .5rem;
    margin: 0;
    padding: .75rem 1.1rem;
    border-top: 1px solid var(--line);
    font-size: .82rem;
    color: var(--ink-faint);
}

/* ── Verify row and the email note ───────────────────────────────────────────── */
.domain__verify[b-2qbcpx92qj] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .9rem;
    margin: -1.25rem 0 1.75rem;
}

.domain__verify-btn[b-2qbcpx92qj] {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
}

.domain__last[b-2qbcpx92qj] {
    margin: 0;
    font-size: .85rem;
    color: var(--ink-faint);
}

.domain__note[b-2qbcpx92qj] {
    display: flex;
    align-items: center;
    gap: .75rem;
    padding: .9rem 1rem;
    border-radius: .65rem;
    background: color-mix(in oklch, var(--ink), transparent 94%);
    color: var(--chrome-link);
}

.domain__note div[b-2qbcpx92qj] {
    display: grid;
    gap: .15rem;
}

.domain__note-title[b-2qbcpx92qj] {
    font-size: .9rem;
    font-weight: 600;
    color: var(--ink);
}

.domain__note-sub[b-2qbcpx92qj] {
    font-size: .85rem;
    color: var(--ink-soft);
}

.domain__sr-only[b-2qbcpx92qj] {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
}

/* ── Narrow: steps stack, the records table becomes a card per record ───────── */
@media (max-width: 760px) {
    .domain__steps[b-2qbcpx92qj] {
        grid-template-columns: 1fr;
    }

    .domain__records-head[b-2qbcpx92qj] {
        display: none;
    }

    .domain__record[b-2qbcpx92qj] {
        grid-template-columns: auto minmax(0, 1fr) auto;
        grid-template-areas:
            "type  name  copy"
            "value value value"
            "state state state";
        row-gap: .4rem;
    }

    .domain__record > :nth-child(1)[b-2qbcpx92qj] { grid-area: type; }
    .domain__record > :nth-child(2)[b-2qbcpx92qj] { grid-area: name; }
    .domain__record > :nth-child(3)[b-2qbcpx92qj] { grid-area: value; }
    .domain__record > :nth-child(4)[b-2qbcpx92qj] { grid-area: state; }
    .domain__record > :nth-child(5)[b-2qbcpx92qj] { grid-area: copy; }
}
/* /Components/Org/OrgIdentityBand.razor.rz.scp.css */
/* OrgIdentityBand — the per-organisation header: identity band + the Courses | Site | Members
   strip. Quorcel chrome only (never the org's brand); the band responds to its own width. */

.orgband[b-34zlt8vnb4] {
    container-type: inline-size;
    container-name: orgband;
}

/* ── Identity band: mark · name · site address ─────────────────────────────────── */

.orgband__band[b-34zlt8vnb4] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    margin-bottom: 1rem;
}

.orgband__identity[b-34zlt8vnb4] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.orgband__mark[b-34zlt8vnb4] {
    display: grid;
    place-items: center;
    flex-shrink: 0;
    width: 3.25rem;
    height: 3.25rem;
    border-radius: .875rem;
    background: var(--chrome-tint);
    color: var(--chrome-link);
    font-weight: 800;
    font-size: 1.6rem;
}

/* The uploaded logo takes the mark's square — contained, on a raised surface, like a favicon. */
.orgband__mark--logo[b-34zlt8vnb4] {
    box-sizing: border-box;
    padding: .375rem;
    object-fit: contain;
    background: var(--surface-raised);
    border: 1px solid var(--line);
}

.orgband__domain[b-34zlt8vnb4] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .6rem;
    margin: 0;
    color: var(--ink-soft);
    font-size: .9rem;
}

.orgband__dot[b-34zlt8vnb4] {
    color: var(--ink-faint);
}

/* ── The strip (slotted, so ::deep) ────────────────────────────────────────────── */

.orgband[b-34zlt8vnb4]  .orgband__tabs {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1rem;
    border-bottom: 1px solid var(--line);
}

.orgband[b-34zlt8vnb4]  .orgband__tablist {
    display: flex;
    gap: 2rem;
}

/* The page's actions sit on the same line as the tabs (user rule 2026-10-15: three tabs leave
   the room), centred on the strip's height. */
.orgband[b-34zlt8vnb4]  .orgband__tabs-actions {
    display: flex;
    align-items: center;
    gap: .5rem;
    padding-bottom: .625rem; /* a little air between the buttons and the line */
}

.orgband[b-34zlt8vnb4]  .orgband__tab {
    position: relative;
    padding: .75rem .125rem;
    border: 0;
    background: transparent;
    font: inherit;
    font-size: .95rem;
    font-weight: 600;
    color: var(--ink-soft);
    text-decoration: none;
    cursor: pointer;
    transition: color 420ms var(--ease-out);
}

/* The underline grows out from the middle of the tab as it becomes current and shrinks away
   from the one it leaves — a glide, not a jump (2026-10-15). */
.orgband[b-34zlt8vnb4]  .orgband__tab::after {
    content: "";
    position: absolute;
    inset: auto 0 -1px 0;
    height: 2px;
    background: var(--chrome-link);
    scale: 0 1;
    transition: scale 420ms var(--ease-out);
}

.orgband[b-34zlt8vnb4]  .orgband__tab:hover {
    color: var(--chrome-link);
}

.orgband[b-34zlt8vnb4]  .orgband__tab:focus-visible {
    outline: 2px solid color-mix(in oklch, var(--chrome-link), transparent 45%);
    outline-offset: 2px;
    border-radius: .3rem;
}

.orgband[b-34zlt8vnb4]  .orgband__tab--active {
    color: var(--chrome-link);
    font-weight: 700;
}

.orgband[b-34zlt8vnb4]  .orgband__tab--active::after {
    scale: 1 1;
}

/* ── Wider: the band lays out in a row ─────────────────────────────────────────── */

@container orgband (min-width: 48rem) { /* @breakpoint md */
    .orgband__band[b-34zlt8vnb4] {
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
        gap: 1rem 1.5rem;
    }
}
/* /Components/Org/OrgManage.razor.rz.scp.css */
/* OrgManage — the per-organisation Manage page. The identity band and the Courses | Site |
   Members strip are OrgIdentityBand's; here, one panel per tab. Colour comes only from the chrome (Quorcel) + neutral
   tokens in app.css — nothing here wears the org's brand (that is for the org's own URL);
   layout responds to the component's own width via container queries.

   Courses (2026-10-15): the same page background as every other page (user rule) — the rail,
   cards and list panel lift off it by shadow and a hairline edge alone. Base width (phone,
   tablet): search + Filters + New course in the
   toolbar, the rail as a bottom sheet. From `lg`: the rail on the left with the search in
   it, the three actions on the right. */

.orgmanage[b-ruwqn1uh22] {
    container-type: inline-size;
    container-name: orgmanage;
}

/* ── Switching tabs: the current panel (and, on Courses, the strip actions) fades out, then
   the next fades in (2026-10-15). Opacity only — no vertical movement: the user found the
   sink-and-rise nauseating. The global reduced-motion rule shortens it to nothing. ──── */

@keyframes orgmanage-panel-in-b-ruwqn1uh22 {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes orgmanage-panel-out-b-ruwqn1uh22 {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
    }
}

.orgmanage[b-ruwqn1uh22] {
    --orgmanage-switch: 340ms; /* the entry: eases out as it settles (user-tuned 2026-10-15) */
    --orgmanage-exit: 180ms;   /* the exit: eases in — OrgManage.PanelExitMs waits exactly this long */
}

.orgmanage__panel[b-ruwqn1uh22],
.orgband__tabs .orgmanage__strip-actions[b-ruwqn1uh22] {
    animation: orgmanage-panel-in-b-ruwqn1uh22 var(--orgmanage-switch) var(--ease-out) both;
}

/* The hand-over: while the next tab is pending, the current panel (and the strip actions)
   fade out; only then does the state switch and the next panel fade in. */
.orgmanage__panel--out[b-ruwqn1uh22],
.orgband__tabs .orgmanage__strip-actions.orgmanage__panel--out[b-ruwqn1uh22] {
    animation: orgmanage-panel-out-b-ruwqn1uh22 var(--orgmanage-exit) ease-in both;
    pointer-events: none;
}

/* ── Courses tab ───────────────────────────────────────────────────────────────── */

.orgmanage__layout[b-ruwqn1uh22] {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1.5rem;
    align-items: start;
}

.orgmanage__rail[b-ruwqn1uh22] {
    display: none;
}

.orgmanage__main[b-ruwqn1uh22] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    min-width: 0;
}

.orgmanage__toolbar[b-ruwqn1uh22] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .5rem;
}

.orgmanage__search[b-ruwqn1uh22] {
    flex: 1 1 12rem;
    min-width: 0;
}

.orgmanage__filters[b-ruwqn1uh22] {
    display: inline-flex;
    position: relative;
    flex-shrink: 0;
}

/* The Courses actions beside the tabs — only once the strip has the room (lg). Qualified by the
   strip so this outranks the band's own display rule for the slot. */
.orgband__tabs .orgmanage__strip-actions[b-ruwqn1uh22] {
    display: none;
}

.orgmanage__filters-label[b-ruwqn1uh22] {
    display: none;
}

.orgmanage__badge[b-ruwqn1uh22] {
    display: grid;
    place-items: center;
    min-width: 1.1rem;
    height: 1.1rem;
    margin-inline-start: .25rem;
    padding: 0 .25rem;
    border-radius: 999px;
    background: var(--chrome-link);
    color: var(--on-chrome-accent);
    font-size: .65rem;
    font-weight: 700;
    line-height: 1;
}

.orgmanage__actions[b-ruwqn1uh22] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .5rem;
}

.orgmanage__new--text[b-ruwqn1uh22] {
    display: none;
}

.orgmanage__result[b-ruwqn1uh22] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: .5rem .75rem;
}

.orgmanage__result-left[b-ruwqn1uh22],
.orgmanage__result-right[b-ruwqn1uh22] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .5rem;
}

.orgmanage__count[b-ruwqn1uh22] {
    font-weight: 600;
}

/* "Sort: Recently edited ⌄" — the design's 36px flat box: label, bold value, 12px chevron. */
.orgmanage__sort[b-ruwqn1uh22] {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: .375rem;
    height: 2.25rem;
    padding: 0 .75rem;
    border: 1px solid var(--line);
    border-radius: .25rem;
    background: var(--surface-raised);
    font-size: .8125rem;
    cursor: pointer;
}

.orgmanage__sort:focus-within[b-ruwqn1uh22] {
    border-color: var(--chrome-link);
    box-shadow: 0 0 0 2px color-mix(in oklch, var(--chrome-link), transparent 75%);
}

.orgmanage__sort-label[b-ruwqn1uh22] {
    color: var(--ink-soft);
}

.orgmanage__sort-value[b-ruwqn1uh22] {
    padding-right: 1.25rem;
    font-weight: 600;
    color: var(--ink);
}

/* The native select is laid over the whole box, invisible: any click on it opens the menu. */
.orgmanage__sort select[b-ruwqn1uh22] {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    border: 0;
    opacity: 0;
    cursor: pointer;
}

.orgmanage__sort-chevron[b-ruwqn1uh22] {
    position: absolute;
    right: .625rem;
    pointer-events: none;
    color: var(--ink-soft);
}

.orgmanage__sort[b-ruwqn1uh22]  .orgmanage__sort-chevron {
    font-size: 1rem;
}

/* Grid | list toggle — a 36px box with two 28px tiles, the active one on the chrome tint. */
.orgmanage__views[b-ruwqn1uh22] {
    display: inline-flex;
    align-items: center;
    gap: .125rem;
    height: 2.25rem;
    padding: .1875rem;
    border: 1px solid var(--line);
    border-radius: .25rem;
    background: var(--surface-raised);
}

.orgmanage__views[b-ruwqn1uh22]  .orgmanage__view {
    width: 1.75rem;
    height: 1.75rem;
    padding: 0;
    border-radius: 3px;
    color: var(--ink-soft);
}

.orgmanage__views[b-ruwqn1uh22]  .orgmanage__view .mud-icon-root {
    font-size: 1.125rem;
}

.orgmanage__views[b-ruwqn1uh22]  .orgmanage__view--active {
    background: var(--chrome-tint);
    color: var(--chrome-link);
}

.orgmanage__cmi5-title[b-ruwqn1uh22] {
    margin: 1.5rem 0 .75rem;
    font-size: 1rem;
    font-weight: 700;
}

/* ── The Filters sheet: the rail as a bottom sheet over the dimmed page ──────────── */

.orgmanage__backdrop[b-ruwqn1uh22] {
    position: fixed;
    inset: 0;
    z-index: 1200;
    background: var(--scrim);
}

.orgmanage__sheet[b-ruwqn1uh22] {
    position: fixed;
    inset: auto 0 0 0;
    z-index: 1201;
    display: flex;
    flex-direction: column;
    gap: .5rem;
    max-height: 85vh;
    padding: .5rem 1rem 1rem;
    overflow-y: auto;
    border-radius: 1rem 1rem 0 0;
    background: var(--surface-raised);
    box-shadow: var(--elevation-sheet);
}

.orgmanage__sheet-handle[b-ruwqn1uh22] {
    width: 2.25rem;
    height: .25rem;
    margin: 0 auto .25rem;
    border-radius: 999px;
    background: var(--line);
}

.orgmanage__sheet-head[b-ruwqn1uh22] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.orgmanage__sheet-title[b-ruwqn1uh22] {
    font-size: 1.1rem;
    font-weight: 700;
}

.orgmanage__sheet-links[b-ruwqn1uh22] {
    display: flex;
    gap: 1rem;
}

.orgmanage__sheet-link[b-ruwqn1uh22] {
    border: 0;
    padding: .25rem 0;
    background: transparent;
    color: var(--ink-soft);
    font: inherit;
    font-size: .9rem;
    cursor: pointer;
}

.orgmanage__sheet-link--done[b-ruwqn1uh22] {
    color: var(--chrome-link);
    font-weight: 700;
}

/* Inside the sheet the rail is the sheet — no second panel. */
.orgmanage__sheet[b-ruwqn1uh22]  .bsl-filter-rail {
    padding: 0;
    border: 0;
    box-shadow: none;
    background: transparent;
}

.orgmanage__sheet-apply[b-ruwqn1uh22] {
    margin-top: .5rem;
}

/* ── Site tab: the four tools as a settings list ───────────────────────────────── */

.orgmanage__settings[b-ruwqn1uh22] {
    margin: 0;
    padding: 0;
    list-style: none;
    background: var(--surface-raised);
    border: 1px solid var(--line);
    border-radius: .75rem;
    overflow: hidden;
}

.orgmanage__setting[b-ruwqn1uh22] {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: .75rem 1rem;
    align-items: center;
    padding: 1.1rem 1.25rem;
}

.orgmanage__setting + .orgmanage__setting[b-ruwqn1uh22] {
    border-top: 1px solid var(--line);
}

.orgmanage__setting-icon[b-ruwqn1uh22] {
    display: grid;
    place-items: center;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: .625rem;
    background: var(--chrome-tint);
    color: var(--chrome-link);
}

.orgmanage__setting-text[b-ruwqn1uh22] {
    display: flex;
    flex-direction: column;
    gap: .15rem;
    min-width: 0;
}

.orgmanage__setting-title[b-ruwqn1uh22] {
    font-weight: 700;
}

.orgmanage__setting-sub[b-ruwqn1uh22] {
    color: var(--ink-soft);
    font-size: .85rem;
    line-height: 1.35;
}

.orgmanage__setting-actions[b-ruwqn1uh22] {
    grid-column: 1 / -1;
    justify-self: start;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .5rem;
}

.orgmanage__setting-action[b-ruwqn1uh22] {
    display: inline-flex;
    align-items: center;
    text-decoration: none;
}

.orgmanage__domain-state[b-ruwqn1uh22] {
    font-weight: 600;
}

.orgmanage__domain-state--verified[b-ruwqn1uh22] {
    color: var(--color-success);
}

.orgmanage__domain-state--pending[b-ruwqn1uh22] {
    color: var(--color-warn);
}

.orgmanage__mono[b-ruwqn1uh22] {
    font-family: ui-monospace, "Cascadia Mono", "JetBrains Mono", Menlo, Consolas, monospace;
    font-size: .82rem;
}

/* Visually hidden panel headings keep the outline (h1 org → h2 tab) for assistive tech. */
.orgmanage__sr-only[b-ruwqn1uh22] {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
    border: 0;
}

/* ── Wider: the Filters button gets its word, New course its label ─────────────── */

@container orgmanage (min-width: 30rem) { /* @breakpoint sm */
    .orgmanage__filters-label[b-ruwqn1uh22] {
        display: inline;
    }

    .orgmanage__new--text[b-ruwqn1uh22] {
        display: inline-flex;
    }

    .orgmanage__new--icon[b-ruwqn1uh22] {
        display: none;
    }
}

/* ── Two-column layouts once the component has room ────────────────────────────── */

@container orgmanage (min-width: 48rem) { /* @breakpoint md */
    .orgmanage__setting[b-ruwqn1uh22] {
        grid-template-columns: auto 1fr auto;
    }

    .orgmanage__setting-actions[b-ruwqn1uh22] {
        grid-column: auto;
        justify-self: end;
    }
}

/* ── Desktop: the rail on the left, the three actions on the right ─────────────── */

@container orgmanage (min-width: 64rem) { /* @breakpoint lg */
    .orgmanage__layout[b-ruwqn1uh22] {
        grid-template-columns: 15.5rem minmax(0, 1fr);
    }

    .orgmanage__rail[b-ruwqn1uh22] {
        display: block;
        position: sticky;
        top: 1rem;
    }

    .orgmanage__toolbar[b-ruwqn1uh22] {
        display: none;
    }

    .orgband__tabs .orgmanage__strip-actions[b-ruwqn1uh22] {
        display: flex;
    }
}
/* /Components/Pages/Author/AuthorCourseEditor.razor.rz.scp.css */
/* The loading and not-found states sit in the builder shell's chrome with the same gutter
   the outline area uses. */
.bslo-page[b-bw82qtyb2x] {
    padding: 24px 32px;
    color: var(--builder-ink);
}
/* /Components/Pages/Author/LandingPreviewPage.razor.rz.scp.css */
/* The landing preview's own parts inside the shared PreviewFrame (Quorcel.Components
   — the scrolling light page, the banner and the site frame are its): the full-bleed page
   and the notes that stand in for an unauthored header or footer. */

/* Full-bleed like the live org root (2026-09-09): the page's Sections own width and spacing. */
.lpv__main[b-hkpvugjubg] {
    flex: 1;
    width: 100%;
    padding: 0;
}

.lpv__fallback[b-hkpvugjubg] {
    padding: .8rem 1.2rem;
    border-bottom: 1px solid var(--line);
    color: var(--ink-faint);
    font-size: .85rem;
    font-style: italic;
}

.lpv__fallback:last-child[b-hkpvugjubg] {
    border-bottom: 0;
    border-top: 1px solid var(--line);
}
/* /Components/Pages/Author/LessonPreviewPage.razor.rz.scp.css */
/* The lesson inside the shared PreviewFrame: the live page's own column (app.css
   .public__main on an org site — 1080px at most, 2rem above and below), measured against
   the frame rather than the viewport so it never outgrows it. */
.lsp__main[b-4usgxxrrak] {
    flex: 1;
    width: min(1080px, 92%);
    margin: 0 auto;
    padding: 2rem 0;
}
/* /Components/Pages/Error.razor.rz.scp.css */
.error-page[b-x85h1m33ph] {
    container-type: inline-size;
}
/* /Components/Pages/Home.razor.rz.scp.css */
/* The Quorcel marketing landing — dark, full-bleed sections rendered inside PublicLayout's
   light chrome. Palette = the --qland-* tokens in app.css (the platform's own marketing
   palette, deliberately not tenant-branded); every variant derives from them. Ported from
   docs/landing/index.html; motion lives in wwwroot/js/landing.js. */

.qland[b-nh5xv57we9] {
    /* Break out of .public__main's centred column to full viewport width. */
    width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-top: -3rem;
    margin-bottom: -3rem;
    background:
        radial-gradient(60% 50% at 18% 12%, color-mix(in oklch, var(--qland-accent), transparent 82%), transparent 60%),
        radial-gradient(55% 45% at 85% 18%, color-mix(in oklch, var(--qland-accent-2), transparent 86%), transparent 62%),
        radial-gradient(70% 60% at 50% 110%, color-mix(in oklch, var(--qland-accent-3), transparent 88%), transparent 60%),
        var(--qland-bg);
    color: var(--qland-ink);
    line-height: 1.6;
    overflow-x: clip;
}

.qland__wrap[b-nh5xv57we9] { width: 100%; max-width: 1200px; margin-inline: auto; padding-inline: 24px; position: relative; }
/* The space between sections is ONE gap, as the design draws it (2026-09-30): each section
   carries it beneath itself — 110px on a desktop — and the first section after the hero (the
   features) has 120px above and below. Sections used to pad 150px above AND below, so two
   neighbours stood 300px apart. */
.qland__pad[b-nh5xv57we9] { padding: 0 0 clamp(64px, 7.64vw, 110px); }
.qland__pad--lead[b-nh5xv57we9] { padding: clamp(72px, 8.34vw, 120px) 0; }
.qland__pad--tight[b-nh5xv57we9] { padding-top: 0; }

.qland__grad-text[b-nh5xv57we9] { background: var(--qland-grad); -webkit-background-clip: text; background-clip: text; color: transparent; }

.qland__eyebrow[b-nh5xv57we9] {
    display: inline-flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 600; letter-spacing: .14em;
    text-transform: uppercase; color: var(--qland-ink-2); padding: 7px 14px;
    border: 1px solid var(--qland-border); border-radius: 100px;
    background: color-mix(in oklch, var(--qland-ink), transparent 98%); backdrop-filter: blur(6px);
}
.qland__dot[b-nh5xv57we9] { width: 6px; height: 6px; border-radius: 50%; background: var(--qland-accent-2); box-shadow: 0 0 12px color-mix(in oklch, var(--qland-accent-2), transparent 55%); }

/* ── buttons ── */
.qland-btn[b-nh5xv57we9] {
    position: relative; display: inline-flex; align-items: center; gap: 9px;
    font-size: 14px; font-weight: 600; padding: 11px 20px; border-radius: 11px; cursor: pointer;
    border: 1px solid transparent; text-decoration: none; will-change: transform;
    transition: box-shadow var(--motion-base, 200ms), background var(--motion-base, 200ms), border-color var(--motion-base, 200ms);
}
.qland-btn--ghost[b-nh5xv57we9] { color: var(--qland-ink); border-color: var(--qland-border); background: color-mix(in oklch, var(--qland-ink), transparent 98%); }
.qland-btn--ghost:hover[b-nh5xv57we9] { border-color: var(--qland-accent); background: color-mix(in oklch, var(--qland-accent), transparent 92%); }
/* The whole gradient, violet to cyan, once across the button (2026-09-30). It was sized 160%,
   which cut the cyan end off, and it repeated under the transparent 1px border — a cyan
   sliver down the left edge. It now starts at the border's outer edge and does not repeat. */
.qland-btn--primary[b-nh5xv57we9] {
    color: var(--qland-ink); background: var(--qland-grad) border-box no-repeat;
    box-shadow: 0 10px 34px -12px color-mix(in oklch, var(--qland-accent), transparent 45%);
}
.qland-btn--primary:hover[b-nh5xv57we9] { box-shadow: 0 16px 46px -12px color-mix(in oklch, var(--qland-accent), transparent 45%); }
.qland-btn--lg[b-nh5xv57we9] { padding: 15px 28px; font-size: 15px; border-radius: 13px; }
.qland-btn__arrow[b-nh5xv57we9] { transition: transform var(--motion-base, 200ms) var(--ease-out, ease); }
.qland-btn:hover .qland-btn__arrow[b-nh5xv57we9] { transform: translateX(4px); }
.qland__actions[b-nh5xv57we9] { display: flex; gap: 14px; margin-top: 40px; flex-wrap: wrap; }
.qland__actions--centre[b-nh5xv57we9] { justify-content: center; }

/* ── hero ── */
.qland__hero[b-nh5xv57we9] { position: relative; min-height: 88svh; display: flex; align-items: center; padding: 100px 0 80px; overflow: hidden; }
.qland__bg[b-nh5xv57we9] { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.qland__hero-inner[b-nh5xv57we9] { max-width: 1200px; z-index: 1; }
.qland__h1[b-nh5xv57we9] {
    font-family: var(--qland-font-display); font-weight: 700; letter-spacing: -.035em; line-height: 1.02;
    font-size: clamp(2.7rem, 7vw, 5.6rem); margin: 24px 0 0; color: var(--qland-ink);
}
.qland__reveal[b-nh5xv57we9] { display: block; overflow: hidden; }
.qland__reveal > span[b-nh5xv57we9] { display: block; }
.qland__lede[b-nh5xv57we9] { font-size: clamp(1.05rem, 1.7vw, 1.35rem); color: var(--qland-ink-2); max-width: 620px; margin-top: 26px; }
.qland__hero-meta[b-nh5xv57we9] { display: flex; gap: 28px; margin-top: 46px; flex-wrap: wrap; color: var(--qland-ink-3); font-size: 13px; }

/* ── trust strip ── */
.qland__trust[b-nh5xv57we9] {
    padding: 46px 0; border-top: 1px solid var(--qland-hairline); border-bottom: 1px solid var(--qland-hairline);
    background: color-mix(in oklch, var(--qland-bg-2), transparent 60%);
}
.qland__trust p[b-nh5xv57we9] { text-align: center; color: var(--qland-ink-3); font-size: 12.5px; letter-spacing: .16em; text-transform: uppercase; margin: 0 0 24px; }
.qland__logos[b-nh5xv57we9] { display: flex; flex-wrap: wrap; justify-content: center; gap: 18px 54px; align-items: center; opacity: .78; }
.qland__logo[b-nh5xv57we9] { font-family: var(--qland-font-display); font-weight: 600; font-size: 19px; color: var(--qland-ink-2); letter-spacing: -.01em; display: flex; align-items: center; gap: 9px; }
.qland__logo i[b-nh5xv57we9] { width: 16px; height: 16px; border-radius: 5px; background: linear-gradient(135deg, var(--qland-ink-2), var(--qland-ink-3)); display: inline-block; opacity: .7; }

/* ── section headings ── */
.qland__sec-head[b-nh5xv57we9] { max-width: 720px; margin-bottom: 56px; }
.qland__sec-head h2[b-nh5xv57we9] { font-family: var(--qland-font-display); font-weight: 700; letter-spacing: -.03em; line-height: 1.05; font-size: clamp(2rem, 4.2vw, 3.3rem); margin: 18px 0 0; color: var(--qland-ink); }
/* A heading longer than the 720px measure that is drawn on ONE line (the marketplace's, 824px
   at full size) may run to the width of the page; its paragraph keeps the measure. */
.qland__sec-head--wide[b-nh5xv57we9] { max-width: none; }
.qland__sec-head--wide p[b-nh5xv57we9] { max-width: 720px; }
.qland__sec-head p[b-nh5xv57we9] { color: var(--qland-ink-2); font-size: clamp(1rem, 1.4vw, 1.15rem); margin: 18px 0 0; }

/* ── features bento ── one rectangle of five tiles in two rows (user call 2026-09-30): the
   builder tile two-thirds wide beside Bite-size, then three equal tiles. It was
   4+2 / 2+3 / 3, which left a ragged right edge and a lone tile on a row of its own. */
.qland__bento[b-nh5xv57we9] { display: grid; grid-template-columns: repeat(6, 1fr); gap: 18px; }
.qland__card[b-nh5xv57we9] {
    position: relative; background: linear-gradient(180deg, var(--qland-panel), var(--qland-bg-2));
    border: 1px solid var(--qland-border); border-radius: 18px; padding: 30px; overflow: hidden;
    transition: transform var(--motion-base, 200ms) var(--ease-out, ease), border-color var(--motion-base, 200ms), box-shadow var(--motion-base, 200ms);
}
.qland__card[b-nh5xv57we9]::before {
    content: ""; position: absolute; inset: 0; border-radius: 18px; padding: 1px;
    background: radial-gradient(120% 120% at var(--mx, 50%) var(--my, 0%), color-mix(in oklch, var(--qland-accent), transparent 45%), transparent 45%);
    /* A mask reads only alpha: any opaque token draws the full ring. */
    -webkit-mask: linear-gradient(var(--on-brand) 0 0) content-box, linear-gradient(var(--on-brand) 0 0);
    -webkit-mask-composite: xor; mask-composite: exclude;
    opacity: 0; transition: opacity var(--motion-base, 200ms);
}
.qland__card:hover[b-nh5xv57we9] { transform: translateY(-4px); border-color: var(--qland-hairline); box-shadow: 0 24px 60px -28px color-mix(in oklch, var(--qland-bg), transparent 30%); }
.qland__card:hover[b-nh5xv57we9]::before { opacity: 1; }
.qland__ico[b-nh5xv57we9] {
    width: 46px; height: 46px; border-radius: 12px; display: grid; place-items: center; margin-bottom: 20px;
    font-size: 20px; background: color-mix(in oklch, var(--qland-accent), transparent 86%);
    border: 1px solid color-mix(in oklch, var(--qland-accent), transparent 75%); color: var(--qland-accent-2);
}
.qland__card h3[b-nh5xv57we9] { font-family: var(--qland-font-display); font-weight: 600; font-size: 1.28rem; letter-spacing: -.01em; margin: 0 0 10px; color: var(--qland-ink); }
.qland__card p[b-nh5xv57we9] { color: var(--qland-ink-2); font-size: .97rem; margin: 0; }
.qland__card--lg[b-nh5xv57we9] { grid-column: span 4; }
.qland__card--sm[b-nh5xv57we9], .qland__card--md[b-nh5xv57we9] { grid-column: span 2; }
.qland__card-visual[b-nh5xv57we9] {
    position: absolute; right: -30px; bottom: -30px; width: 200px; height: 200px; opacity: .16;
    background: conic-gradient(from 90deg, var(--qland-accent), var(--qland-accent-2), var(--qland-accent-3), var(--qland-accent));
    border-radius: 50%; filter: blur(14px);
}

/* ── how it works ── */
.qland__steps[b-nh5xv57we9] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; counter-reset: s; }
.qland__step[b-nh5xv57we9] { position: relative; padding: 34px 28px; border: 1px solid var(--qland-border); border-radius: 18px; background: color-mix(in oklch, var(--qland-panel), transparent 50%); }
.qland__step[b-nh5xv57we9]::before {
    counter-increment: s; content: "0" counter(s);
    font-family: var(--qland-font-display); font-weight: 700; font-size: 3.2rem; line-height: 1;
    background: var(--qland-grad); -webkit-background-clip: text; background-clip: text; color: transparent; opacity: .9;
}
.qland__step h3[b-nh5xv57we9] { font-family: var(--qland-font-display); font-weight: 600; font-size: 1.25rem; margin: 16px 0 10px; letter-spacing: -.01em; color: var(--qland-ink); }
.qland__step p[b-nh5xv57we9] { color: var(--qland-ink-2); font-size: .96rem; margin: 0; }
.qland__step-line[b-nh5xv57we9] { position: absolute; top: 54px; right: -22px; width: 22px; height: 1px; background: linear-gradient(90deg, var(--qland-accent), transparent); }

/* ── stats ── */
.qland__stats[b-nh5xv57we9] {
    display: grid; grid-template-columns: repeat(4, 1fr); gap: 22px;
    border: 1px solid var(--qland-border); border-radius: 24px; padding: 48px 30px;
    background: linear-gradient(180deg, color-mix(in oklch, var(--qland-panel-2), transparent 40%), color-mix(in oklch, var(--qland-bg-2), transparent 60%));
    backdrop-filter: blur(8px);
}
.qland__stat[b-nh5xv57we9] { text-align: center; }
.qland__num[b-nh5xv57we9] { font-family: var(--qland-font-display); font-weight: 700; font-size: clamp(2.4rem, 4.6vw, 3.6rem); letter-spacing: -.03em; line-height: 1; color: var(--qland-ink); }
/* A highlighted figure ("5 min", "99.9%") is gradient text: the rule above, coming later in
   the sheet than .qland__grad-text, painted it in the plain ink (2026-09-30). */
.qland__num.qland__grad-text[b-nh5xv57we9] { color: transparent; }
/* …and the gradient runs across the FIGURE, not across its column: as a full-width block the
   digits sat in the middle of the gradient and showed neither its violet nor its cyan end. */
.qland__num.qland__grad-text[b-nh5xv57we9] { display: inline-block; }
.qland__lbl[b-nh5xv57we9] { color: var(--qland-ink-2); font-size: .92rem; margin-top: 10px; }

/* ── builder showcase ── */
.qland__showcase[b-nh5xv57we9] { display: grid; grid-template-columns: 1.05fr 1fr; gap: 60px; align-items: center; }
.qland__showcase-copy h2[b-nh5xv57we9] { font-family: var(--qland-font-display); font-weight: 700; font-size: clamp(1.9rem, 3.6vw, 2.9rem); letter-spacing: -.03em; line-height: 1.07; margin: 18px 0 0; color: var(--qland-ink); }
.qland__showcase-copy p[b-nh5xv57we9] { color: var(--qland-ink-2); margin: 18px 0 0; font-size: 1.05rem; }
.qland__feat-list[b-nh5xv57we9] { margin: 28px 0 0; padding: 0; display: flex; flex-direction: column; gap: 14px; }
.qland__feat-list li[b-nh5xv57we9] { list-style: none; display: flex; gap: 13px; align-items: flex-start; color: var(--qland-ink-2); }
.qland__tick[b-nh5xv57we9] {
    flex: none; width: 22px; height: 22px; border-radius: 7px; display: grid; place-items: center; font-size: 12px;
    background: color-mix(in oklch, var(--qland-accent-2), transparent 86%);
    border: 1px solid color-mix(in oklch, var(--qland-accent-2), transparent 70%); color: var(--qland-accent-2); margin-top: 2px;
}
/* The builder mock-up, made readable (2026-09-30): it was drawn in tints two or three steps
   from the page's own near-black, and all but vanished. The window is a lighter panel with a
   visible edge and an accent glow behind it; its blocks are clear shapes, not hints. Every
   tint is still mixed from the landing tokens. */
.qland__mockup[b-nh5xv57we9] {
    position: relative; border-radius: 18px; overflow: hidden;
    border: 1px solid color-mix(in oklch, var(--qland-ink), transparent 80%);
    background: linear-gradient(180deg,
        color-mix(in oklch, var(--qland-panel-2), var(--qland-ink) 9%),
        color-mix(in oklch, var(--qland-panel), var(--qland-ink) 4%));
    box-shadow:
        0 40px 90px -40px color-mix(in oklch, var(--qland-bg), transparent 20%),
        0 0 120px -30px color-mix(in oklch, var(--qland-accent), transparent 45%);
    transform-style: preserve-3d;
}
.qland__mockup-bar[b-nh5xv57we9] { display: flex; align-items: center; gap: 7px; padding: 13px 16px; border-bottom: 1px solid color-mix(in oklch, var(--qland-ink), transparent 84%); background: color-mix(in oklch, var(--qland-bg), transparent 40%); }
.qland__mockup-bar i[b-nh5xv57we9] { width: 11px; height: 11px; border-radius: 50%; background: color-mix(in oklch, var(--qland-ink), transparent 65%); }
.qland__mockup-body[b-nh5xv57we9] { padding: 22px; display: grid; grid-template-columns: 64px 1fr 200px; gap: 16px; min-height: 330px; }
.qland__mk-rail[b-nh5xv57we9] { display: flex; flex-direction: column; gap: 12px; }
.qland__mk-rail span[b-nh5xv57we9] { height: 38px; border-radius: 9px; background: color-mix(in oklch, var(--qland-ink), transparent 88%); border: 1px solid color-mix(in oklch, var(--qland-ink), transparent 80%); }
.qland__mk-rail span:first-child[b-nh5xv57we9] { background: color-mix(in oklch, var(--qland-accent), transparent 45%); border-color: color-mix(in oklch, var(--qland-accent), var(--qland-ink) 25%); }
.qland__mk-canvas[b-nh5xv57we9] {
    border-radius: 12px; border: 1px dashed color-mix(in oklch, var(--qland-ink), transparent 68%); padding: 18px;
    background: repeating-linear-gradient(0deg, color-mix(in oklch, var(--qland-ink), transparent 94%) 0 1px, transparent 1px 26px);
    display: flex; flex-direction: column; gap: 12px;
}
.qland__mk-canvas b[b-nh5xv57we9] { height: 30px; width: 60%; border-radius: 7px; background: var(--qland-grad); display: block; }
.qland__mk-canvas u[b-nh5xv57we9] { height: 64px; border-radius: 9px; background: color-mix(in oklch, var(--qland-ink), transparent 86%); border: 1px solid color-mix(in oklch, var(--qland-ink), transparent 78%); display: block; text-decoration: none; }
.qland__mk-canvas u.qland__mk-split[b-nh5xv57we9] { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; background: none; border: none; }
.qland__mk-canvas u.qland__mk-split em[b-nh5xv57we9] { border-radius: 9px; background: color-mix(in oklch, var(--qland-ink), transparent 86%); border: 1px solid color-mix(in oklch, var(--qland-ink), transparent 78%); }
.qland__mk-insp[b-nh5xv57we9] { border-radius: 12px; background: color-mix(in oklch, var(--qland-bg), transparent 35%); border: 1px solid color-mix(in oklch, var(--qland-ink), transparent 80%); padding: 14px; display: flex; flex-direction: column; gap: 10px; }
.qland__mk-insp s[b-nh5xv57we9] { height: 13px; border-radius: 5px; background: color-mix(in oklch, var(--qland-ink), transparent 78%); display: block; text-decoration: none; }
.qland__w70[b-nh5xv57we9] { width: 70%; }
.qland__w50[b-nh5xv57we9] { width: 50%; }
.qland__mk-swatches[b-nh5xv57we9] { display: flex; gap: 7px; margin-top: 4px; }
.qland__mk-swatches i[b-nh5xv57we9] { width: 22px; height: 22px; border-radius: 6px; }
.qland__sw1[b-nh5xv57we9] { background: var(--qland-accent); }
.qland__sw2[b-nh5xv57we9] { background: var(--qland-accent-2); }
.qland__sw3[b-nh5xv57we9] { background: var(--qland-accent-3); }

/* ── marketplace sample ── */
.qland__courses[b-nh5xv57we9] { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 18px; }
.qland__course[b-nh5xv57we9] {
    display: flex; flex-direction: column; border-radius: 16px; overflow: hidden; text-decoration: none;
    background: linear-gradient(180deg, var(--qland-panel), var(--qland-bg-2)); border: 1px solid var(--qland-border);
    transition: transform var(--motion-base, 200ms) var(--ease-out, ease), border-color var(--motion-base, 200ms);
}
.qland__course:hover[b-nh5xv57we9] { transform: translateY(-4px); border-color: color-mix(in oklch, var(--qland-accent), transparent 50%); }
.qland__course-cover[b-nh5xv57we9] { display: block; width: 100%; height: 130px; object-fit: cover; }
.qland__course-cover--fallback[b-nh5xv57we9] { display: grid; place-items: center; font-size: 2.2rem; font-weight: 800; color: var(--qland-ink); background: var(--qland-grad); }
.qland__course-body[b-nh5xv57we9] { display: flex; flex-direction: column; gap: 10px; padding: 16px 18px 18px; flex: 1; }
.qland__course-title[b-nh5xv57we9] { font-family: var(--qland-font-display); font-weight: 600; font-size: 1.05rem; letter-spacing: -.01em; color: var(--qland-ink); flex: 1; }
.qland__course-foot[b-nh5xv57we9] { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.qland__course-price[b-nh5xv57we9] { font-weight: 700; font-size: .85rem; color: var(--qland-accent-2); background: color-mix(in oklch, var(--qland-accent-2), transparent 88%); padding: 3px 10px; border-radius: 100px; }
.qland__course-org[b-nh5xv57we9] { color: var(--qland-ink-3); font-size: .8rem; font-weight: 600; }

/* ── pricing ── */
.qland__tiers[b-nh5xv57we9] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; align-items: stretch; }
.qland__tier[b-nh5xv57we9] {
    display: flex; flex-direction: column; gap: 14px; padding: 30px;
    border: 1px solid var(--qland-border); border-radius: 18px;
    background: linear-gradient(180deg, var(--qland-panel), var(--qland-bg-2));
}
.qland__tier--featured[b-nh5xv57we9] { border-color: color-mix(in oklch, var(--qland-accent), transparent 40%); box-shadow: 0 24px 70px -30px color-mix(in oklch, var(--qland-accent), transparent 55%); }
.qland__tier h3[b-nh5xv57we9] { font-family: var(--qland-font-display); font-weight: 600; font-size: 1.1rem; letter-spacing: .02em; text-transform: uppercase; color: var(--qland-ink-2); margin: 0; }
.qland__tier-price[b-nh5xv57we9] { font-family: var(--qland-font-display); font-weight: 700; font-size: 2rem; letter-spacing: -.02em; color: var(--qland-ink); }
.qland__tier-price span[b-nh5xv57we9] { font-size: 1rem; font-weight: 500; color: var(--qland-ink-3); }
.qland__tier-note[b-nh5xv57we9] { color: var(--qland-ink-2); font-size: .95rem; margin: 0; min-height: 3em; }
.qland__tier ul[b-nh5xv57we9] { margin: 0; padding: 0; display: flex; flex-direction: column; gap: 9px; flex: 1; }
.qland__tier li[b-nh5xv57we9] { list-style: none; color: var(--qland-ink-2); font-size: .95rem; padding-left: 22px; position: relative; }
.qland__tier li[b-nh5xv57we9]::before { content: "✓"; position: absolute; left: 0; color: var(--qland-accent-2); }
.qland__tier .qland-btn[b-nh5xv57we9] { justify-content: center; }
.qland__pricing-note[b-nh5xv57we9] { color: var(--qland-ink-3); font-size: .85rem; margin-top: 26px; max-width: 640px; }

/* ── quote + CTA ── */
.qland__quote[b-nh5xv57we9] { max-width: 880px; margin-inline: auto; text-align: center; }
.qland__quote blockquote[b-nh5xv57we9] { font-family: var(--qland-font-display); font-weight: 500; font-size: clamp(1.5rem, 3.2vw, 2.4rem); letter-spacing: -.02em; line-height: 1.25; margin: 0; }
.qland__quote-who[b-nh5xv57we9] { margin-top: 28px; color: var(--qland-ink-2); font-size: .98rem; }
.qland__quote-who b[b-nh5xv57we9] { color: var(--qland-ink); }
.qland__cta[b-nh5xv57we9] {
    position: relative; border-radius: 28px; overflow: hidden; padding: clamp(56px, 8vw, 96px) 32px; text-align: center;
    border: 1px solid var(--qland-border);
    background: linear-gradient(180deg, color-mix(in oklch, var(--qland-panel-2), transparent 30%), color-mix(in oklch, var(--qland-bg-2), transparent 50%));
}
.qland__cta[b-nh5xv57we9]::before {
    content: ""; position: absolute; inset: 0;
    background:
        radial-gradient(50% 80% at 30% 0%, color-mix(in oklch, var(--qland-accent), transparent 72%), transparent 60%),
        radial-gradient(50% 80% at 80% 100%, color-mix(in oklch, var(--qland-accent-2), transparent 78%), transparent 60%);
}
.qland__cta > *[b-nh5xv57we9] { position: relative; }
.qland__cta h2[b-nh5xv57we9] { font-family: var(--qland-font-display); font-weight: 700; font-size: clamp(2rem, 5vw, 3.6rem); letter-spacing: -.03em; line-height: 1.04; margin: 0; color: var(--qland-ink); }
.qland__cta p[b-nh5xv57we9] { color: var(--qland-ink-2); max-width: 560px; margin: 20px auto 0; font-size: 1.08rem; }
.qland__cta .qland__actions[b-nh5xv57we9] { justify-content: center; margin-top: 38px; }

/* ── motion prep (JS-driven; static under reduced motion) ── */
[data-anim][b-nh5xv57we9] { will-change: transform, opacity; }

/* ── responsive ── */
@media (max-width: 980px) {
    /* Tablet: the builder tile across the top, the other four in two rows of two. */
    .qland__bento[b-nh5xv57we9] { grid-template-columns: repeat(2, 1fr); }
    .qland__card--lg[b-nh5xv57we9] { grid-column: span 2; }
    .qland__card--sm[b-nh5xv57we9], .qland__card--md[b-nh5xv57we9] { grid-column: span 1; }
    .qland__steps[b-nh5xv57we9] { grid-template-columns: 1fr; }
    .qland__step-line[b-nh5xv57we9] { display: none; }
    .qland__stats[b-nh5xv57we9] { grid-template-columns: repeat(2, 1fr); gap: 32px 22px; }
    .qland__showcase[b-nh5xv57we9] { grid-template-columns: 1fr; gap: 38px; }
    .qland__tiers[b-nh5xv57we9] { grid-template-columns: 1fr; }
}

/* Phone: one tile to a row. */
@media (max-width: 640px) {
    .qland__card--sm[b-nh5xv57we9], .qland__card--md[b-nh5xv57we9] { grid-column: span 2; }
}

@media (prefers-reduced-motion: reduce) {
    .qland *[b-nh5xv57we9] { animation: none !important; transition: none !important; }
    .qland__bg[b-nh5xv57we9] { opacity: .5; }
}