/**
 * PraivIQ operator surfaces — self-contained CSS for Filament admin.
 * Do not rely on Tailwind utilities in custom Blade; Filament may not ship them.
 */

/* Public product shell — calm, high-contrast and consistent across every Filament surface. */
:root {
    --pq-shell-line: color-mix(in oklab, var(--gray-500, #6b7280) 14%, transparent);
}

.fi-body { background: color-mix(in oklab, var(--gray-50, #f8fafc) 94%, #ecfdf5); }
.dark .fi-body { background: #080b0a; }
.fi-topbar { border-bottom: 1px solid var(--pq-shell-line); background: color-mix(in oklab, var(--white, #fff) 88%, transparent); backdrop-filter: blur(18px) saturate(1.2); }
.dark .fi-topbar { background: rgba(10, 13, 12, .88); }
.fi-sidebar { border-right: 1px solid var(--pq-shell-line); }
.fi-sidebar-header { border-bottom: 1px solid var(--pq-shell-line); }
.fi-main { padding-top: clamp(1.2rem, 2.5vw, 2rem); }
.fi-header-heading { letter-spacing: -.035em; }
.fi-section { border-color: var(--pq-shell-line); border-radius: 1rem; box-shadow: 0 10px 32px rgba(15, 23, 42, .045); }
.dark .fi-section { background: #121514; box-shadow: none; }
.fi-ta-ctn { overflow: hidden; border-color: var(--pq-shell-line); border-radius: 1rem; box-shadow: 0 10px 32px rgba(15, 23, 42, .04); }
.fi-btn { border-radius: .68rem; font-weight: 650; }
.fi-input-wrp { border-radius: .68rem; }
.fi-sidebar-item-btn { border-radius: .65rem; }
.fi-sidebar-group-label { font-size: .68rem; font-weight: 720; letter-spacing: .035em; }
.fi-badge { border-radius: 999px; }

/**
 * M32 Dynamic Context validation — keep header actions reachable around ~970px.
 * Scoped to this page body class only; no global Filament layout rewrite.
 */
body.m32-dcv-page .fi-header {
    flex-wrap: wrap;
    align-items: flex-start;
    row-gap: 0.75rem;
}

body.m32-dcv-page .fi-header-actions-ctn {
    flex: 1 1 18rem;
    min-width: 0;
    max-width: 100%;
}

body.m32-dcv-page .fi-header-actions-ctn .fi-ac {
    flex-wrap: wrap;
    max-width: 100%;
    row-gap: 0.5rem;
}

/** Workflow builder — prevent the title and lifecycle actions from squeezing each other. */
body.workflow-builder-page .fi-header {
    flex-wrap: wrap;
    align-items: flex-start;
    row-gap: 0.75rem;
}

body.workflow-builder-page .fi-header-actions-ctn {
    flex: 1 1 24rem;
    min-width: 0;
    max-width: 100%;
}

body.workflow-builder-page .fi-header-actions-ctn .fi-ac {
    flex-wrap: wrap;
    max-width: 100%;
    row-gap: 0.5rem;
}

/* Workflow Builder presentation canvas — no Tailwind dependency. */
body.workflow-builder-page {
    --wf-ink: #ecfdf5;
    --wf-muted: #94a3b8;
    --wf-panel: #101827;
    --wf-panel-soft: #151f30;
    --wf-line: rgba(148, 163, 184, 0.18);
    --wf-green: #22c55e;
    --wf-sky: #38bdf8;
    --wf-amber: #fbbf24;
}

body:not(.dark).workflow-builder-page {
    --wf-ink: #0f172a;
    --wf-muted: #64748b;
    --wf-panel: #ffffff;
    --wf-panel-soft: #f8fafc;
    --wf-line: rgba(15, 23, 42, 0.12);
}

body.workflow-builder-page .fi-header-heading,
body.workflow-builder-page .fi-header-subheading {
    display: none;
}

body.workflow-builder-page .fi-header {
    justify-content: flex-end;
    min-height: 2.75rem;
}

body.workflow-builder-page .fi-header-actions-ctn {
    flex: 0 1 auto;
}

.wf-page-shell {
    display: grid;
    gap: 1.1rem;
    width: 100%;
}

.wf-hero {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    padding: clamp(1.4rem, 3vw, 2.6rem);
    border: 1px solid rgba(56, 189, 248, 0.2);
    border-radius: 1.5rem;
    color: #f8fafc;
    background:
        linear-gradient(125deg, rgba(5, 150, 105, 0.22), transparent 42%),
        linear-gradient(305deg, rgba(14, 165, 233, 0.18), transparent 44%),
        #07101e;
    box-shadow: 0 24px 70px rgba(2, 6, 23, 0.22);
}

.wf-hero__glow {
    position: absolute;
    z-index: -1;
    width: 22rem;
    height: 22rem;
    border-radius: 999px;
    filter: blur(70px);
    opacity: 0.23;
}

.wf-hero__glow--one { top: -13rem; left: 8%; background: #22c55e; }
.wf-hero__glow--two { right: -9rem; bottom: -16rem; background: #38bdf8; }

.wf-hero__content {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 2rem;
}

.wf-eyebrow {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    margin: 0 0 0.55rem;
    color: #4ade80;
    font-size: 0.7rem;
    font-weight: 750;
    line-height: 1;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.wf-eyebrow svg { width: 0.95rem; height: 0.95rem; }
.wf-hero__copy { max-width: 58rem; }
.wf-hero__copy h1 { margin: 0; font-size: clamp(1.65rem, 3vw, 2.75rem); font-weight: 760; line-height: 1.05; letter-spacing: -0.035em; }
.wf-hero__copy p { max-width: 52rem; margin: 0.85rem 0 0; color: #cbd5e1; font-size: 1rem; line-height: 1.65; }
.wf-hero__status { display: flex; align-items: center; gap: 0.55rem; flex: none; }

.wf-state,
.wf-version {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    min-height: 2rem;
    padding: 0.35rem 0.7rem;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 999px;
    background: rgba(15, 23, 42, 0.68);
    color: #e2e8f0;
    font-size: 0.75rem;
    font-weight: 650;
    backdrop-filter: blur(12px);
}

.wf-state > span { width: 0.48rem; height: 0.48rem; border-radius: 999px; background: #94a3b8; box-shadow: 0 0 0 4px rgba(148, 163, 184, 0.12); }
.wf-state--live > span, .wf-state--ready > span { background: #4ade80; box-shadow: 0 0 0 4px rgba(74, 222, 128, 0.13); }
.wf-state--blocked > span { background: #fb7185; }

.wf-hero__metrics {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 0.65rem;
    margin-top: 2rem;
}

.wf-hero__metrics > div {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    min-width: 0;
    padding: 0.8rem 0.9rem;
    border: 1px solid rgba(255, 255, 255, 0.09);
    border-radius: 0.9rem;
    background: rgba(15, 23, 42, 0.52);
    backdrop-filter: blur(10px);
}

.wf-hero__metrics svg { width: 1.15rem; height: 1.15rem; flex: none; color: #4ade80; }
.wf-hero__metrics span { display: grid; min-width: 0; }
.wf-hero__metrics small { overflow: hidden; color: #94a3b8; font-size: 0.65rem; text-overflow: ellipsis; text-transform: uppercase; letter-spacing: 0.06em; white-space: nowrap; }
.wf-hero__metrics strong { overflow: hidden; margin-top: 0.18rem; color: #f8fafc; font-size: 0.82rem; text-overflow: ellipsis; white-space: nowrap; }

.wf-read-mode,
.wf-inspector__context {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 0.85rem 1rem;
    border: 1px solid rgba(56, 189, 248, 0.2);
    border-radius: 0.9rem;
    background: rgba(14, 165, 233, 0.07);
    color: var(--wf-muted);
    font-size: 0.8rem;
    line-height: 1.45;
}

.wf-read-mode svg, .wf-inspector__context > svg { width: 1.1rem; height: 1.1rem; flex: none; color: var(--wf-sky); }
.wf-read-mode span, .wf-inspector__context span { display: grid; gap: 0.15rem; }
.wf-read-mode strong, .wf-inspector__context strong { color: var(--wf-ink); }
.dark .wf-read-mode { color: #cbd5e1; }
.dark .wf-read-mode strong { color: #f8fafc; }

.wf-workspace,
.wf-editor,
.wf-disclosure,
.wf-modality-strip {
    overflow: hidden;
    border: 1px solid var(--wf-line);
    border-radius: 1.25rem;
    background: var(--wf-panel);
    box-shadow: 0 12px 35px rgba(2, 6, 23, 0.06);
}

.wf-workspace__header,
.wf-editor > header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.4rem;
    border-bottom: 1px solid var(--wf-line);
}

.wf-workspace__header h2, .wf-editor h2 { margin: 0; color: var(--wf-ink); font-size: 1.2rem; font-weight: 720; }
.wf-workspace__header p { max-width: 48rem; margin: 0.35rem 0 0; color: var(--wf-muted); font-size: 0.82rem; line-height: 1.5; }
.wf-workspace__header .wf-eyebrow, .wf-editor .wf-eyebrow, .wf-inspector .wf-eyebrow, .wf-modality-strip .wf-eyebrow { color: #10b981; }

.wf-ready-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    flex: none;
    padding: 0.45rem 0.65rem;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 700;
}
.wf-ready-chip svg { width: 1rem; height: 1rem; }
.wf-ready-chip--ready { color: #047857; background: #d1fae5; }
.wf-ready-chip--blocked { color: #b45309; background: #fef3c7; }

.wf-canvas-app { width: 100%; }
.wf-canvas-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 0.75rem 1rem; border-bottom: 1px solid var(--wf-line); background: var(--wf-panel-soft); }
.wf-canvas-toolbar__summary, .wf-canvas-toolbar__controls { display: flex; align-items: center; gap: 0.45rem; flex-wrap: wrap; }
.wf-view-toggle { display: inline-flex; padding: 0.2rem; border: 1px solid var(--wf-line); border-radius: 0.7rem; background: var(--wf-panel); }
.wf-view-toggle__button { padding: 0.34rem 0.55rem; border: 0; border-radius: 0.45rem; color: var(--wf-muted); background: transparent; font-size: 0.68rem; font-weight: 700; cursor: pointer; }
.wf-view-toggle__button--active { color: #064e3b; background: #d1fae5; }
.wf-pill { display: inline-flex; align-items: center; gap: 0.3rem; padding: 0.3rem 0.55rem; border: 1px solid var(--wf-line); border-radius: 999px; color: var(--wf-muted); background: var(--wf-panel); font-size: 0.68rem; font-weight: 650; }
.wf-pill svg { width: 0.82rem; height: 0.82rem; }
.wf-pill--accent { color: #059669; border-color: rgba(16, 185, 129, 0.22); background: rgba(16, 185, 129, 0.08); }
.wf-icon-button, .wf-fit-button { display: inline-flex; align-items: center; justify-content: center; gap: 0.35rem; min-width: 2rem; height: 2rem; padding: 0 0.55rem; border: 1px solid var(--wf-line); border-radius: 0.55rem; color: var(--wf-ink); background: var(--wf-panel); cursor: pointer; transition: border-color 150ms, transform 150ms, background 150ms; }
.wf-icon-button:hover, .wf-fit-button:hover { border-color: rgba(34, 197, 94, 0.55); background: rgba(34, 197, 94, 0.08); transform: translateY(-1px); }
.wf-icon-button svg, .wf-fit-button svg { width: 0.95rem; height: 0.95rem; }
.wf-fit-button { font-size: 0.7rem; font-weight: 650; }
.wf-zoom { min-width: 2.75rem; color: var(--wf-muted); font-size: 0.68rem; text-align: center; }

.wf-canvas-layout { display: grid; grid-template-columns: minmax(0, 1fr); min-height: 31rem; }
.wf-canvas-layout--inspector { grid-template-columns: minmax(0, 1fr) 21rem; }
.wf-canvas-viewport { position: relative; min-width: 0; min-height: 31rem; overflow: auto; background: #07101e; }
.wf-canvas-grid { position: absolute; inset: 0; opacity: 0.32; background-image: radial-gradient(rgba(148, 163, 184, 0.35) 1px, transparent 1px); background-size: 20px 20px; pointer-events: none; }
.wf-canvas-track { --wf-zoom: 1; position: relative; display: flex; align-items: center; gap: 7rem; width: max-content; min-width: 100%; min-height: 31rem; padding: 3rem 4rem; transform: scale(var(--wf-zoom)); transform-origin: top left; transition: transform 180ms ease; }
.wf-canvas-track--vertical { align-items: stretch; flex-direction: column; gap: 3.75rem; width: 100%; min-width: 52rem; min-height: max-content; }
.wf-connectors { position: absolute; inset: 0; z-index: 0; overflow: visible; pointer-events: none; }
.wf-connector-path { fill: none; stroke: url(#wf-edge-gradient); stroke-width: 2.5; stroke-linecap: round; opacity: 0.75; filter: drop-shadow(0 0 4px rgba(34, 197, 94, 0.28)); }
.wf-layer { position: relative; z-index: 1; width: 18rem; flex: none; }
.wf-layer__header { display: flex; align-items: center; justify-content: space-between; min-height: 1.6rem; margin-bottom: 0.7rem; color: #94a3b8; font-size: 0.68rem; font-weight: 750; letter-spacing: 0.11em; text-transform: uppercase; }
.wf-layer__parallel { padding: 0.18rem 0.42rem; border-radius: 999px; color: #7dd3fc; background: rgba(14, 165, 233, 0.13); letter-spacing: 0; }
.wf-layer__nodes { display: grid; gap: 1rem; }
.wf-canvas-track--vertical .wf-layer { display: grid; grid-template-columns: 9rem minmax(0, 1fr); width: 100%; align-items: start; }
.wf-canvas-track--vertical .wf-layer__header { margin: 0.85rem 1rem 0 0; }
.wf-canvas-track--vertical .wf-layer__nodes { grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr)); }
.wf-node { display: grid; width: 100%; padding: 1rem; border: 1px solid rgba(148, 163, 184, 0.2); border-radius: 1rem; color: #e2e8f0; background: linear-gradient(145deg, rgba(30, 41, 59, 0.96), rgba(15, 23, 42, 0.96)); box-shadow: 0 14px 35px rgba(2, 6, 23, 0.32); text-align: left; cursor: pointer; transition: border-color 160ms, box-shadow 160ms, transform 160ms; }
.wf-node:hover { border-color: rgba(56, 189, 248, 0.55); transform: translateY(-2px); box-shadow: 0 18px 42px rgba(2, 6, 23, 0.42); }
.wf-node--selected { border-color: rgba(34, 197, 94, 0.85); box-shadow: 0 0 0 2px rgba(34, 197, 94, 0.16), 0 18px 42px rgba(2, 6, 23, 0.42); }
.wf-node__topline { display: flex; align-items: center; gap: 0.5rem; }
.wf-node__icon { display: inline-flex; align-items: center; justify-content: center; width: 1.85rem; height: 1.85rem; border-radius: 0.55rem; color: #4ade80; background: rgba(34, 197, 94, 0.12); }
.wf-node__icon svg { width: 1rem; height: 1rem; }
.wf-node__key { overflow: hidden; color: #94a3b8; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 0.65rem; text-overflow: ellipsis; white-space: nowrap; }
.wf-status-dot { width: 0.5rem; height: 0.5rem; margin-left: auto; border-radius: 999px; }
.wf-status-dot--result { background: #4ade80; box-shadow: 0 0 0 5px rgba(74, 222, 128, 0.1); }
.wf-node__title { margin-top: 0.8rem; color: #f8fafc; font-size: 0.95rem; line-height: 1.3; }
.wf-node__purpose { display: -webkit-box; overflow: hidden; margin-top: 0.38rem; color: #94a3b8; font-size: 0.73rem; line-height: 1.48; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
.wf-node__badges { display: flex; flex-wrap: wrap; gap: 0.35rem; margin-top: 0.9rem; }
.wf-node__badges > span { display: inline-flex; align-items: center; gap: 0.25rem; max-width: 100%; padding: 0.25rem 0.42rem; border: 1px solid rgba(148, 163, 184, 0.13); border-radius: 0.4rem; color: #cbd5e1; background: rgba(15, 23, 42, 0.55); font-size: 0.61rem; }
.wf-node__badges svg { width: 0.72rem; height: 0.72rem; flex: none; color: #7dd3fc; }

.wf-inspector { display: none; min-width: 0; border-left: 1px solid var(--wf-line); background: var(--wf-panel-soft); }
.wf-inspector--open { display: block; }
.wf-inspector__header { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; padding: 1rem; border-bottom: 1px solid var(--wf-line); }
.wf-inspector__header > div { display: grid; }
.wf-inspector__header strong { color: var(--wf-ink); font-size: 0.88rem; }
.wf-inspector__body { padding: 1.1rem; }
.wf-inspector__body h3 { margin: 0; color: var(--wf-ink); font-size: 1.1rem; line-height: 1.3; }
.wf-inspector__body > p { margin: 0.55rem 0 1rem; color: var(--wf-muted); font-size: 0.78rem; line-height: 1.55; }
.wf-inspector__facts { display: grid; gap: 0.08rem; }
.wf-inspector__facts > div { display: grid; grid-template-columns: 7rem minmax(0, 1fr); gap: 0.65rem; padding: 0.55rem 0; border-bottom: 1px solid var(--wf-line); }
.wf-inspector__facts dt { color: var(--wf-muted); font-size: 0.68rem; }
.wf-inspector__facts dd { overflow-wrap: anywhere; color: var(--wf-ink); font-size: 0.72rem; font-weight: 620; }
.wf-inspector__section { display: grid; gap: 0.2rem; margin: 1rem 0; }
.wf-inspector__section span { color: var(--wf-muted); font-size: 0.65rem; text-transform: uppercase; letter-spacing: 0.06em; }
.wf-inspector__section strong { color: var(--wf-ink); font-size: 0.72rem; }
.wf-inspector__context { margin-top: 1rem; padding: 0.7rem; font-size: 0.68rem; }

.wf-modality-strip { display: grid; grid-template-columns: minmax(12rem, 1.25fr) repeat(3, minmax(10rem, 1fr)); gap: 0; }
.wf-modality-strip > div, .wf-modality-strip article { padding: 1rem 1.1rem; border-right: 1px solid var(--wf-line); }
.wf-modality-strip > div { display: grid; align-content: center; }
.wf-modality-strip > div > strong { color: var(--wf-ink); font-size: 0.9rem; }
.wf-modality-strip article { display: flex; align-items: center; gap: 0.65rem; }
.wf-modality-strip article > svg { width: 1.1rem; height: 1.1rem; flex: none; color: #10b981; }
.wf-modality-strip article span { display: grid; min-width: 0; }
.wf-modality-strip article small { color: var(--wf-muted); font-size: 0.62rem; text-transform: uppercase; }
.wf-modality-strip article strong { overflow: hidden; color: var(--wf-ink); font-size: 0.75rem; text-overflow: ellipsis; white-space: nowrap; }
.wf-modality-strip article em { margin-left: auto; color: #10b981; font-size: 0.65rem; font-style: normal; }

.wf-editor > header { justify-content: flex-start; }
.wf-editor > .fi-sc { padding: 1.25rem; }
.wf-secondary-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.wf-notifications { overflow: hidden; border: 1px solid var(--wf-line); border-radius: 0.9rem; background: var(--wf-panel); }
.wf-notifications__heading { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem 1.1rem; }
.wf-notifications__heading > div { min-width: 0; }
.wf-notifications__heading h2 { margin: 0.2rem 0 0; color: var(--wf-ink); font-size: 1rem; font-weight: 720; }
.wf-notifications__heading p { margin: 0.25rem 0 0; color: var(--wf-muted); font-size: 0.72rem; line-height: 1.45; }
.wf-notifications__list { border-top: 1px solid var(--wf-line); }
.wf-notification-row { display: grid; grid-template-columns: auto minmax(0, 1fr) auto auto; align-items: center; gap: 0.75rem; padding: 0.85rem 1.1rem; color: inherit; text-decoration: none; transition: background 150ms; }
.wf-notification-row + .wf-notification-row { border-top: 1px solid var(--wf-line); }
.wf-notification-row:hover { background: var(--wf-panel-soft); }
.wf-notification-row__icon { display: grid; width: 2rem; height: 2rem; place-items: center; border-radius: 0.55rem; color: #059669; background: color-mix(in srgb, #10b981 12%, transparent); }
.wf-notification-row__icon svg, .wf-notification-row > svg { width: 1rem; height: 1rem; }
.wf-notification-row__copy { display: grid; gap: 0.18rem; min-width: 0; }
.wf-notification-row__copy strong { overflow: hidden; color: var(--wf-ink); font-size: 0.78rem; text-overflow: ellipsis; white-space: nowrap; }
.wf-notification-row__copy small { color: var(--wf-muted); font-size: 0.68rem; }
.wf-notification-row__state { padding: 0.25rem 0.5rem; border-radius: 999px; color: var(--wf-muted); background: var(--wf-panel-soft); font-size: 0.65rem; font-weight: 700; }
.wf-notification-row__state.is-enabled { color: #047857; background: #d1fae5; }
.wf-notifications__empty { display: flex; align-items: center; gap: 0.7rem; padding: 0.9rem 1.1rem; border-top: 1px solid var(--wf-line); color: var(--wf-muted); background: var(--wf-panel-soft); }
.wf-notifications__empty > svg { width: 1.15rem; height: 1.15rem; flex: none; }
.wf-notifications__empty > span { display: grid; gap: 0.15rem; }
.wf-notifications__empty strong { color: var(--wf-ink); font-size: 0.75rem; }
.wf-notifications__empty small { font-size: 0.68rem; }
.wf-runs { overflow: hidden; border: 1px solid var(--wf-line); border-radius: 0.9rem; background: var(--wf-panel); }
.wf-runs__heading { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem 1.1rem; }
.wf-runs__heading > div:first-child { min-width: 0; }
.wf-runs__heading h2 { margin: 0.2rem 0 0; color: var(--wf-ink); font-size: 1rem; font-weight: 720; }
.wf-runs__heading p { margin: 0.25rem 0 0; color: var(--wf-muted); font-size: 0.72rem; line-height: 1.45; }
.wf-runs__totals { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 0.4rem; }
.wf-runs__totals span { padding: 0.32rem 0.55rem; border-radius: 999px; color: var(--wf-muted); background: var(--wf-panel-soft); font-size: 0.66rem; white-space: nowrap; }
.wf-runs__totals strong { margin-right: 0.12rem; color: var(--wf-ink); }
.wf-runs__totals .is-success { color: #047857; background: #d1fae5; }
.wf-runs__totals .is-danger { color: #b91c1c; background: #fee2e2; }
.wf-runs__totals .is-active { color: #1d4ed8; background: #dbeafe; }
.wf-runs__totals .is-waiting { color: #a16207; background: #fef3c7; }
.wf-runs__list { border-top: 1px solid var(--wf-line); }
.wf-run-row { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 0.75rem; padding: 0.78rem 1.1rem; color: inherit; text-decoration: none; transition: background 150ms; }
.wf-run-row + .wf-run-row { border-top: 1px solid var(--wf-line); }
.wf-run-row:not(.is-static):hover { background: var(--wf-panel-soft); }
.wf-run-row > svg { width: 1rem; height: 1rem; }
.wf-run-row__state { min-width: 5.3rem; padding: 0.27rem 0.5rem; border-radius: 999px; text-align: center; font-size: 0.65rem; font-weight: 700; }
.wf-run-row__state.is-success { color: #047857; background: #d1fae5; }
.wf-run-row__state.is-danger { color: #b91c1c; background: #fee2e2; }
.wf-run-row__state.is-active { color: #1d4ed8; background: #dbeafe; }
.wf-run-row__state.is-waiting { color: #a16207; background: #fef3c7; }
.wf-run-row__copy { display: grid; gap: 0.16rem; min-width: 0; }
.wf-run-row__copy strong { color: var(--wf-ink); font-size: 0.76rem; }
.wf-run-row__copy small { color: var(--wf-muted); font-size: 0.68rem; }
.wf-runs__empty { display: flex; align-items: center; gap: 0.7rem; padding: 0.9rem 1.1rem; border-top: 1px solid var(--wf-line); color: var(--wf-muted); background: var(--wf-panel-soft); }
.wf-runs__empty > svg { width: 1.15rem; height: 1.15rem; flex: none; }
.wf-runs__empty > span { display: grid; gap: 0.15rem; }
.wf-runs__empty strong { color: var(--wf-ink); font-size: 0.75rem; }
.wf-runs__empty small { font-size: 0.68rem; }
.wf-disclosure > summary { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem 1.1rem; cursor: pointer; list-style: none; }
.wf-disclosure > summary::-webkit-details-marker { display: none; }
.wf-disclosure > summary > span { display: grid; grid-template-columns: 1.4rem minmax(0, 1fr); column-gap: 0.55rem; align-items: center; }
.wf-disclosure > summary > span > svg { grid-row: 1 / span 2; width: 1.15rem; height: 1.15rem; color: #10b981; }
.wf-disclosure > summary strong { color: var(--wf-ink); font-size: 0.82rem; }
.wf-disclosure > summary small { color: var(--wf-muted); font-size: 0.68rem; line-height: 1.35; }
.wf-disclosure > summary > svg { width: 1rem; height: 1rem; color: var(--wf-muted); transition: transform 160ms; }
.wf-disclosure[open] > summary > svg { transform: rotate(180deg); }
.wf-disclosure__body { padding: 0 1.1rem 1.1rem; border-top: 1px solid var(--wf-line); }
.wf-fact-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.65rem; padding-top: 1rem; }
.wf-fact-grid > div { display: grid; gap: 0.2rem; padding: 0.7rem; border-radius: 0.65rem; background: var(--wf-panel-soft); }
.wf-fact-grid small { color: var(--wf-muted); font-size: 0.63rem; text-transform: uppercase; letter-spacing: 0.04em; }
.wf-fact-grid strong, .wf-fact-grid code { overflow-wrap: anywhere; color: var(--wf-ink); font-size: 0.72rem; }
.wf-blockers { display: grid; gap: 0.5rem; margin: 0.8rem 0 0; padding: 0; list-style: none; }
.wf-blockers li { display: grid; gap: 0.15rem; padding: 0.65rem; border-left: 3px solid #f59e0b; background: rgba(245, 158, 11, 0.07); }
.wf-blockers strong { color: var(--wf-ink); font-size: 0.72rem; }
.wf-blockers span { color: var(--wf-muted); font-size: 0.7rem; }
.wf-draft-list { display: grid; gap: 0.4rem; padding-top: 0.8rem; }
.wf-draft-row { display: grid; grid-template-columns: 2rem minmax(0, 1fr) 1rem; align-items: center; gap: 0.65rem; width: 100%; padding: 0.65rem; border: 1px solid transparent; border-radius: 0.7rem; color: inherit; background: transparent; text-align: left; cursor: pointer; }
.wf-draft-row:hover, .wf-draft-row--active { border-color: rgba(16, 185, 129, 0.24); background: rgba(16, 185, 129, 0.07); }
.wf-draft-row__icon { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border-radius: 0.55rem; color: #10b981; background: rgba(16, 185, 129, 0.1); }
.wf-draft-row__icon svg, .wf-draft-row > svg { width: 0.9rem; height: 0.9rem; }
.wf-draft-row > span:nth-child(2) { display: grid; min-width: 0; }
.wf-draft-row strong { overflow: hidden; color: var(--wf-ink); font-size: 0.75rem; text-overflow: ellipsis; white-space: nowrap; }
.wf-draft-row small { color: var(--wf-muted); font-size: 0.63rem; }
.wf-draft-row > svg { color: var(--wf-muted); }
.wf-technical-list { display: grid; gap: 0.35rem; margin-top: 1rem; color: var(--wf-muted); font-size: 0.7rem; }
.wf-technical-list strong { color: var(--wf-ink); }
.wf-technical-list code { display: block; overflow-wrap: anywhere; padding: 0.35rem 0.5rem; border-radius: 0.4rem; color: var(--wf-ink); background: var(--wf-panel-soft); }
.wf-empty { display: grid; place-items: center; min-height: 18rem; gap: 0.7rem; color: var(--wf-muted); text-align: center; }
.wf-empty__icon { width: 2rem; height: 2rem; color: #10b981; }
.wf-page-shell [x-cloak] { display: none !important; }

@media (max-width: 1180px) {
    .wf-hero__metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .wf-canvas-layout--inspector { grid-template-columns: minmax(0, 1fr) 18rem; }
    .wf-modality-strip { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .wf-modality-strip > div { grid-column: 1 / -1; border-bottom: 1px solid var(--wf-line); }
}

@media (max-width: 900px) {
    .wf-hero__content, .wf-workspace__header { flex-direction: column; }
    .wf-hero__metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .wf-canvas-layout--inspector { grid-template-columns: minmax(0, 1fr); }
    .wf-inspector { border-top: 1px solid var(--wf-line); border-left: 0; }
    .wf-secondary-grid { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 640px) {
    .wf-hero { border-radius: 1.1rem; }
    .wf-hero__metrics { grid-template-columns: minmax(0, 1fr); }
    .wf-canvas-toolbar { align-items: flex-start; flex-direction: column; }
    .wf-canvas-toolbar__controls { display: none; }
    .wf-canvas-viewport { min-height: auto; padding: 0; overflow: visible; }
    .wf-canvas-grid, .wf-connectors { display: none; }
    .wf-canvas-track { display: grid; width: 100%; min-width: 0; min-height: 0; gap: 1.2rem; padding: 1rem; transform: none !important; }
    .wf-canvas-track--vertical .wf-layer { display: block; width: 100%; }
    .wf-canvas-track--vertical .wf-layer__header { margin: 0 0 0.7rem; }
    .wf-canvas-track--vertical .wf-layer__nodes { grid-template-columns: minmax(0, 1fr); }
    .wf-layer { width: 100%; }
    .wf-layer:not(:last-child)::after { content: '↓'; display: block; margin: 0.8rem auto -0.55rem; color: #4ade80; font-size: 1.25rem; text-align: center; }
    .wf-inspector__facts > div { grid-template-columns: 6.5rem minmax(0, 1fr); }
    .wf-modality-strip { grid-template-columns: minmax(0, 1fr); }
    .wf-modality-strip > div, .wf-modality-strip article { grid-column: auto; border-right: 0; border-bottom: 1px solid var(--wf-line); }
    .wf-fact-grid { grid-template-columns: minmax(0, 1fr); }
    .wf-notifications__heading { align-items: flex-start; flex-direction: column; }
    .wf-runs__heading { align-items: flex-start; flex-direction: column; }
    .wf-runs__totals { justify-content: flex-start; }
    .wf-notification-row { grid-template-columns: auto minmax(0, 1fr) auto; }
    .wf-notification-row__state { grid-column: 2; justify-self: start; }
}

.fi-operator-stack {
    display: grid;
    gap: 1rem;
    width: 100%;
}

.fi-operator-toolbar {
    display: grid;
    gap: 0.75rem;
    width: 100%;
    grid-template-columns: 1fr;
}

@media (min-width: 768px) {
    .fi-operator-toolbar {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 1280px) {
    .fi-operator-toolbar.fi-operator-toolbar--4 {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

.fi-operator-field label {
    display: block;
    margin-bottom: 0.35rem;
    font-size: 0.875rem;
    font-weight: 500;
}

.fi-operator-select,
.fi-operator-field select {
    display: block;
    width: 100%;
    border-radius: var(--radius-lg, 0.5rem);
    border: 1px solid color-mix(in oklab, var(--gray-950) 12%, transparent);
    background: var(--color-white, #fff);
    padding: 0.5rem 0.75rem;
    font-size: 0.875rem;
    color: inherit;
    appearance: auto;
}

.dark .fi-operator-select,
.dark .fi-operator-field select {
    background: color-mix(in oklab, var(--gray-900) 80%, transparent);
    border-color: color-mix(in oklab, var(--white) 12%, transparent);
}

.fi-operator-readonly {
    display: block;
    width: 100%;
    border-radius: var(--radius-lg, 0.5rem);
    border: 1px solid color-mix(in oklab, var(--gray-950) 10%, transparent);
    background: color-mix(in oklab, var(--gray-500) 8%, transparent);
    padding: 0.5rem 0.75rem;
    font-size: 0.875rem;
}

.fi-operator-card {
    border-radius: var(--radius-xl, 0.75rem);
    border: 1px solid color-mix(in oklab, var(--gray-950) 10%, transparent);
    background: color-mix(in oklab, var(--white) 92%, transparent);
    padding: 1rem 1.1rem;
}

.dark .fi-operator-card {
    border-color: color-mix(in oklab, var(--white) 12%, transparent);
    background: color-mix(in oklab, var(--gray-900) 85%, transparent);
}

.fi-operator-card__title {
    margin: 0;
    font-size: 1.05rem;
    font-weight: 600;
}

.fi-operator-card__meta {
    margin: 0.35rem 0 0;
    font-size: 0.875rem;
    color: var(--gray-500);
}

.fi-operator-status-row {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem;
}

.fi-operator-stats {
    display: grid;
    gap: 0.75rem;
    margin-top: 1rem;
    grid-template-columns: 1fr;
}

@media (min-width: 640px) {
    .fi-operator-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 1024px) {
    .fi-operator-stats.fi-operator-stats--4 {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

.fi-operator-stat dt {
    margin: 0;
    font-size: 0.75rem;
    color: var(--gray-500);
}

.fi-operator-stat dd {
    margin: 0.2rem 0 0;
    font-size: 0.875rem;
    font-weight: 550;
    word-break: break-word;
}

.fi-operator-pill {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    padding: 0.2rem 0.65rem;
    font-size: 0.75rem;
    font-weight: 600;
    line-height: 1.25;
    white-space: nowrap;
}

.fi-operator-pill--ready,
.fi-operator-pill--success {
    background: color-mix(in oklab, var(--success-500) 18%, transparent);
    color: var(--success-700, #166534);
}

.fi-operator-pill--warning,
.fi-operator-pill--review {
    background: color-mix(in oklab, var(--warning-500) 20%, transparent);
    color: var(--warning-700, #92400e);
}

.fi-operator-pill--danger,
.fi-operator-pill--blocked {
    background: color-mix(in oklab, var(--danger-500) 18%, transparent);
    color: var(--danger-700, #991b1b);
}

.fi-operator-pill--info,
.fi-operator-pill--neutral {
    background: color-mix(in oklab, var(--gray-500) 14%, transparent);
    color: var(--gray-700, #374151);
}

.fi-operator-pill--guardrail {
    background: color-mix(in oklab, var(--primary-500) 16%, transparent);
    color: var(--primary-700, #b45309);
}

.fi-operator-alert {
    border-radius: var(--radius-lg, 0.5rem);
    border: 1px solid transparent;
    padding: 0.85rem 1rem;
    font-size: 0.875rem;
}

.fi-operator-alert--danger {
    border-color: color-mix(in oklab, var(--danger-500) 35%, transparent);
    background: color-mix(in oklab, var(--danger-500) 10%, transparent);
}

.fi-operator-alert--warning {
    border-color: color-mix(in oklab, var(--warning-500) 35%, transparent);
    background: color-mix(in oklab, var(--warning-500) 10%, transparent);
}

.fi-operator-alert--success {
    border-color: color-mix(in oklab, var(--success-500) 35%, transparent);
    background: color-mix(in oklab, var(--success-500) 10%, transparent);
}

.fi-operator-alert ul {
    margin: 0.4rem 0 0;
    padding-left: 1.1rem;
}

.fi-operator-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    margin-bottom: 0.75rem;
}

.fi-operator-tab {
    border-radius: var(--radius-lg, 0.5rem);
    border: 1px solid color-mix(in oklab, var(--gray-950) 10%, transparent);
    background: transparent;
    padding: 0.4rem 0.75rem;
    font-size: 0.8125rem;
    font-weight: 500;
    cursor: pointer;
}

.fi-operator-tab.is-active {
    background: color-mix(in oklab, var(--primary-500) 14%, transparent);
    border-color: color-mix(in oklab, var(--primary-500) 35%, transparent);
}

.fi-operator-table-wrap {
    width: 100%;
    overflow-x: auto;
    border-radius: var(--radius-lg, 0.5rem);
    border: 1px solid color-mix(in oklab, var(--gray-950) 10%, transparent);
}

.fi-operator-table {
    width: 100%;
    min-width: 36rem;
    border-collapse: collapse;
    font-size: 0.875rem;
}

.fi-operator-table th,
.fi-operator-table td {
    padding: 0.65rem 0.75rem;
    text-align: left;
    vertical-align: top;
    border-bottom: 1px solid color-mix(in oklab, var(--gray-950) 8%, transparent);
}

.fi-operator-table th {
    font-weight: 550;
    background: color-mix(in oklab, var(--gray-500) 6%, transparent);
    white-space: nowrap;
}

.fi-operator-table td {
    word-break: break-word;
}

.fi-operator-primary {
    font-weight: 550;
}

.fi-operator-secondary {
    margin-top: 0.2rem;
    font-size: 0.75rem;
    color: var(--gray-500);
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
}

.fi-operator-hash {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-size: 0.8125rem;
}

.fi-operator-cards-mobile {
    display: grid;
    gap: 0.75rem;
}

@media (min-width: 768px) {
    .fi-operator-cards-mobile {
        display: none;
    }

    .fi-operator-table-desktop {
        display: block;
    }
}

@media (max-width: 767.98px) {
    .fi-operator-table-desktop {
        display: none;
    }
}

.fi-operator-mobile-card {
    border-radius: var(--radius-lg, 0.5rem);
    border: 1px solid color-mix(in oklab, var(--gray-950) 10%, transparent);
    padding: 0.85rem;
    display: grid;
    gap: 0.45rem;
}

.fi-operator-mobile-card__row {
    display: flex;
    justify-content: space-between;
    gap: 0.75rem;
    font-size: 0.8125rem;
}

.fi-operator-mobile-card__row span:first-child {
    color: var(--gray-500);
}

.fi-operator-empty {
    display: grid;
    gap: 0.5rem;
    max-width: 40rem;
}

.fi-operator-empty h3 {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
}

.fi-operator-empty p {
    margin: 0;
    font-size: 0.875rem;
    color: var(--gray-500);
}

.fi-operator-form-width {
    width: 100%;
    max-width: 72rem;
    margin-inline: auto;
}

.fi-operator-preflight-ready {
    border-radius: var(--radius-lg, 0.5rem);
    border: 1px solid color-mix(in oklab, var(--success-500) 40%, transparent);
    background: color-mix(in oklab, var(--success-500) 12%, transparent);
    padding: 0.85rem 1rem;
    font-size: 0.875rem;
}

.fi-operator-preflight-blocked {
    border-radius: var(--radius-lg, 0.5rem);
    border: 1px solid color-mix(in oklab, var(--danger-500) 40%, transparent);
    background: color-mix(in oklab, var(--danger-500) 10%, transparent);
    padding: 0.85rem 1rem;
    font-size: 0.875rem;
}

.fi-operator-content-body {
    white-space: pre-wrap;
    word-break: break-word;
    font-size: 0.95rem;
    line-height: 1.55;
}

.fi-operator-metric-grid--3 {
    display: grid;
    gap: 1rem;
    width: 100%;
    grid-template-columns: 1fr;
}

@media (min-width: 640px) {
    .fi-operator-metric-grid--3 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 1024px) {
    .fi-operator-metric-grid--3 {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

.fi-operator-journey {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    border-radius: var(--radius-lg, 0.5rem);
    border: 1px solid color-mix(in oklab, var(--gray-950) 10%, transparent);
    padding: 0.85rem 1rem;
}

.fi-result-image-preview {
    justify-content: center;
    width: 100%;
}

/* M21.3 Context Blueprint + M21.4 Help */
.fi-operator-blueprint {
    display: grid;
    gap: 0.85rem;
    width: 100%;
    margin-top: 0.5rem;
}

.fi-operator-blueprint__sticky {
    position: sticky;
    top: 0;
    z-index: 20;
    display: grid;
    gap: 0.65rem;
    padding: 0.75rem 0.85rem;
    border-radius: var(--radius-lg, 0.5rem);
    border: 1px solid color-mix(in oklab, var(--gray-950) 10%, transparent);
    background: color-mix(in oklab, var(--white) 94%, transparent);
    backdrop-filter: blur(6px);
}

.dark .fi-operator-blueprint__sticky {
    border-color: color-mix(in oklab, var(--white) 12%, transparent);
    background: color-mix(in oklab, var(--gray-900) 92%, transparent);
}

.fi-operator-blueprint__header {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.fi-operator-blueprint__title {
    margin: 0;
    font-size: 1.05rem;
    font-weight: 600;
}

.fi-operator-blueprint__summary {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem 1rem;
    font-size: 0.8125rem;
    color: var(--gray-500);
}

.fi-operator-blueprint__filters {
    display: grid;
    gap: 0.5rem;
    grid-template-columns: 1fr;
}

@media (min-width: 768px) {
    .fi-operator-blueprint__filters {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 1280px) {
    .fi-operator-blueprint__filters {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

.fi-operator-blueprint__view-modes {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
}

.fi-operator-blueprint__view-btn {
    border-radius: var(--radius-md, 0.375rem);
    border: 1px solid color-mix(in oklab, var(--gray-950) 12%, transparent);
    background: transparent;
    padding: 0.35rem 0.65rem;
    font-size: 0.8125rem;
    cursor: pointer;
}

.fi-operator-blueprint__view-btn.is-active {
    background: color-mix(in oklab, var(--primary-500) 14%, transparent);
    border-color: color-mix(in oklab, var(--primary-500) 40%, transparent);
}

.fi-operator-blueprint__category {
    border-radius: var(--radius-lg, 0.5rem);
    border: 1px solid color-mix(in oklab, var(--gray-950) 10%, transparent);
    overflow: hidden;
}

.fi-operator-blueprint__category-toggle {
    width: 100%;
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.65rem 0.85rem;
    background: color-mix(in oklab, var(--gray-500) 6%, transparent);
    border: 0;
    cursor: pointer;
    font-weight: 600;
    font-size: 0.875rem;
    text-align: left;
}

.fi-operator-blueprint__rows {
    display: grid;
    gap: 0.35rem;
    padding: 0.5rem;
}

.fi-operator-blueprint--matrix .fi-operator-blueprint__rows {
    grid-template-columns: repeat(auto-fill, minmax(16rem, 1fr));
}

.fi-operator-blueprint--compact .fi-operator-blueprint__row {
    padding: 0.45rem 0.65rem;
}

.fi-operator-blueprint__row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.65rem;
    padding: 0.65rem 0.75rem;
    border-radius: var(--radius-md, 0.375rem);
    border: 1px solid color-mix(in oklab, var(--gray-950) 8%, transparent);
}

.fi-operator-blueprint__row-title {
    font-weight: 600;
    font-size: 0.9rem;
}

.fi-operator-blueprint__row-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    margin-top: 0.35rem;
}

.fi-operator-blueprint__drawer {
    position: fixed;
    inset: 0;
    z-index: 200;
    display: flex;
    justify-content: flex-end;
    background: color-mix(in oklab, var(--gray-950) 35%, transparent);
}

.fi-operator-blueprint__drawer-panel {
    width: min(32rem, 100%);
    height: 100%;
    overflow: auto;
    background: var(--color-white, #fff);
    padding: 1rem 1.1rem;
    display: grid;
    gap: 0.85rem;
    align-content: start;
}

.dark .fi-operator-blueprint__drawer-panel {
    background: var(--gray-900);
}

.fi-operator-blueprint__drawer-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.75rem;
}

.fi-operator-blueprint__drawer-header h3 {
    margin: 0;
    font-size: 1.05rem;
}

.fi-operator-blueprint__drawer-meta,
.fi-operator-blueprint__drawer-section {
    font-size: 0.875rem;
}

.fi-operator-blueprint__drawer-section h4 {
    margin: 0 0 0.35rem;
    font-size: 0.9rem;
}

.fi-operator-blueprint__drawer-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.fi-operator-help-panel {
    border-radius: var(--radius-lg, 0.5rem);
    border: 1px solid color-mix(in oklab, var(--gray-950) 10%, transparent);
    padding: 0.75rem 0.9rem;
}

.fi-operator-help-panel__toggle {
    background: transparent;
    border: 0;
    padding: 0;
    font-weight: 600;
    font-size: 0.9rem;
    cursor: pointer;
    color: inherit;
    text-decoration: underline;
}

.fi-operator-help-panel__body {
    margin-top: 0.75rem;
    display: grid;
    gap: 0.75rem;
    font-size: 0.875rem;
}

.fi-operator-help-panel__title {
    margin: 0;
    font-size: 1rem;
}

.fi-operator-help-panel__section h4 {
    margin: 0 0 0.35rem;
    font-size: 0.875rem;
}

.fi-operator-help-panel__fields {
    display: grid;
    gap: 0.5rem;
    margin: 0;
}

.fi-operator-help-panel__fields dt {
    font-weight: 600;
}

.fi-operator-help-panel__fields dd {
    margin: 0.15rem 0 0;
    color: var(--gray-500);
}

.fi-operator-help-panel__missing {
    color: var(--gray-500);
    margin: 0;
}

.fi-operator-help-tip {
    position: relative;
    display: inline-flex;
    vertical-align: middle;
}

.fi-operator-help-tip__button {
    border: 0;
    background: transparent;
    padding: 0;
    cursor: pointer;
    color: var(--gray-500);
}

.fi-operator-help-tip__icon {
    width: 1.1rem;
    height: 1.1rem;
}

.fi-operator-help-tip__popover {
    position: absolute;
    z-index: 30;
    left: 0;
    top: calc(100% + 0.35rem);
    width: min(18rem, 70vw);
    padding: 0.55rem 0.65rem;
    border-radius: var(--radius-md, 0.375rem);
    border: 1px solid color-mix(in oklab, var(--gray-950) 12%, transparent);
    background: var(--color-white, #fff);
    box-shadow: 0 8px 24px color-mix(in oklab, var(--gray-950) 12%, transparent);
    font-size: 0.8125rem;
    line-height: 1.4;
}

.dark .fi-operator-help-tip__popover {
    background: var(--gray-900);
    border-color: color-mix(in oklab, var(--white) 12%, transparent);
}

/* M28 — shared visible-field foundation (light/dark, focus, states) */

.fi-operator-label {
    display: block;
    margin-bottom: 0.35rem;
    font-size: 0.875rem;
    font-weight: 550;
    color: inherit;
}

.fi-operator-label .fi-operator-required,
.fi-operator-field label .fi-operator-required {
    color: var(--danger-600, #dc2626);
    margin-left: 0.15rem;
}

.fi-operator-description {
    margin: 0.15rem 0 0.45rem;
    font-size: 0.8125rem;
    line-height: 1.4;
    color: var(--gray-500);
}

.fi-operator-input,
.fi-operator-textarea,
.fi-operator-field input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
.fi-operator-field textarea,
textarea.fi-operator-textarea,
input.fi-operator-input {
    display: block;
    width: 100%;
    border-radius: var(--radius-lg, 0.5rem);
    border: 1px solid color-mix(in oklab, var(--gray-950) 18%, transparent);
    background: var(--color-white, #fff);
    padding: 0.55rem 0.75rem;
    font-size: 0.875rem;
    line-height: 1.45;
    color: inherit;
    box-shadow: none;
    transition: border-color 120ms ease, box-shadow 120ms ease, background-color 120ms ease;
}

.fi-operator-textarea,
.fi-operator-field textarea,
textarea.fi-operator-textarea {
    min-height: 8.5rem;
    resize: vertical;
}

.dark .fi-operator-input,
.dark .fi-operator-textarea,
.dark .fi-operator-field input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
.dark .fi-operator-field textarea,
.dark textarea.fi-operator-textarea,
.dark input.fi-operator-input,
.dark .fi-operator-select,
.dark .fi-operator-field select {
    background: color-mix(in oklab, var(--gray-900) 88%, transparent);
    border-color: color-mix(in oklab, var(--white) 18%, transparent);
}

.fi-operator-input:hover,
.fi-operator-textarea:hover,
.fi-operator-select:hover,
.fi-operator-field select:hover,
.fi-operator-field input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):hover,
.fi-operator-field textarea:hover {
    border-color: color-mix(in oklab, var(--gray-950) 28%, transparent);
}

.dark .fi-operator-input:hover,
.dark .fi-operator-textarea:hover,
.dark .fi-operator-select:hover,
.dark .fi-operator-field select:hover {
    border-color: color-mix(in oklab, var(--white) 28%, transparent);
}

.fi-operator-input:focus,
.fi-operator-textarea:focus,
.fi-operator-select:focus,
.fi-operator-field select:focus,
.fi-operator-field input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):focus,
.fi-operator-field textarea:focus,
.fi-operator-input:focus-visible,
.fi-operator-textarea:focus-visible,
.fi-operator-select:focus-visible {
    outline: 2px solid color-mix(in oklab, var(--primary-600, #d97706) 85%, transparent);
    outline-offset: 2px;
    border-color: color-mix(in oklab, var(--primary-600, #d97706) 55%, transparent);
    box-shadow: 0 0 0 3px color-mix(in oklab, var(--primary-500) 22%, transparent);
}

.fi-operator-input:disabled,
.fi-operator-textarea:disabled,
.fi-operator-select:disabled,
.fi-operator-field select:disabled,
.fi-operator-input[readonly],
.fi-operator-textarea[readonly] {
    opacity: 0.72;
    cursor: not-allowed;
    background: color-mix(in oklab, var(--gray-500) 10%, transparent);
}

.fi-operator-input.is-invalid,
.fi-operator-textarea.is-invalid,
.fi-operator-field.is-invalid input,
.fi-operator-field.is-invalid textarea,
.fi-operator-field.is-invalid select {
    border-color: color-mix(in oklab, var(--danger-500) 55%, transparent);
}

.fi-operator-input.is-valid,
.fi-operator-textarea.is-valid {
    border-color: color-mix(in oklab, var(--success-500) 50%, transparent);
}

.fi-operator-error {
    margin: 0.35rem 0 0;
    font-size: 0.8125rem;
    color: var(--danger-600, #dc2626);
}

.fi-operator-success-hint {
    margin: 0.35rem 0 0;
    font-size: 0.8125rem;
    color: var(--success-700, #166534);
}

/* Filament native form wrappers — ensure always-visible boundary */
.fi-fo-field-wrp .fi-input-wrp,
.fi-input-wrp {
    border-radius: var(--radius-lg, 0.5rem);
    border: 1px solid color-mix(in oklab, var(--gray-950) 16%, transparent) !important;
    background: var(--color-white, #fff);
    box-shadow: none !important;
    ring: none;
}

.dark .fi-fo-field-wrp .fi-input-wrp,
.dark .fi-input-wrp {
    border-color: color-mix(in oklab, var(--white) 16%, transparent) !important;
    background: color-mix(in oklab, var(--gray-900) 88%, transparent);
}

.fi-fo-field-wrp .fi-input-wrp:focus-within,
.fi-input-wrp:focus-within {
    border-color: color-mix(in oklab, var(--primary-600, #d97706) 55%, transparent) !important;
    box-shadow: 0 0 0 3px color-mix(in oklab, var(--primary-500) 22%, transparent) !important;
    outline: 2px solid color-mix(in oklab, var(--primary-600, #d97706) 70%, transparent);
    outline-offset: 1px;
}

.fi-modal .fi-input-wrp,
.fi-fo-wizard .fi-input-wrp {
    border: 1px solid color-mix(in oklab, var(--gray-950) 16%, transparent) !important;
}

/* Interview / onboarding question hierarchy (M28) */
.fi-operator-question {
    display: grid;
    gap: 0.65rem;
}

.fi-operator-question__prompt {
    margin: 0;
    font-size: 1.125rem;
    font-weight: 600;
    line-height: 1.35;
}

.fi-operator-question__purpose {
    margin: 0;
    font-size: 0.9rem;
    line-height: 1.45;
    color: var(--gray-600, #4b5563);
}

.dark .fi-operator-question__purpose {
    color: color-mix(in oklab, var(--white) 70%, transparent);
}

.fi-operator-aside {
    margin-top: 0.35rem;
    padding: 0.65rem 0.75rem;
    border-radius: var(--radius-lg, 0.5rem);
    border: 1px dashed color-mix(in oklab, var(--gray-950) 14%, transparent);
    background: color-mix(in oklab, var(--gray-500) 6%, transparent);
    font-size: 0.8125rem;
    line-height: 1.4;
    color: var(--gray-600, #4b5563);
}

.dark .fi-operator-aside {
    border-color: color-mix(in oklab, var(--white) 14%, transparent);
    color: color-mix(in oklab, var(--white) 65%, transparent);
}

.fi-operator-aside__label {
    display: block;
    margin-bottom: 0.2rem;
    font-size: 0.7rem;
    font-weight: 650;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--gray-500);
}

.fi-operator-progress-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 0.85rem;
    margin-bottom: 0.75rem;
    font-size: 0.75rem;
    color: var(--gray-500);
}

.fi-operator-progress-bar {
    height: 0.35rem;
    overflow: hidden;
    border-radius: 999px;
    background: color-mix(in oklab, var(--gray-500) 18%, transparent);
    margin-bottom: 1rem;
}

.fi-operator-progress-bar > span {
    display: block;
    height: 100%;
    border-radius: 999px;
    background: color-mix(in oklab, var(--primary-600, #d97706) 90%, transparent);
}

.fi-operator-muted {
    font-size: 0.875rem;
    color: var(--gray-500);
}

.fi-operator-section-title {
    margin: 0 0 0.35rem;
    font-size: 1rem;
    font-weight: 600;
}

.fi-operator-help-collapse {
    margin-top: 1rem;
    border-top: 1px solid color-mix(in oklab, var(--gray-950) 8%, transparent);
    padding-top: 0.75rem;
}

.fi-operator-help-collapse summary {
    cursor: pointer;
    font-size: 0.8125rem;
    font-weight: 550;
    color: var(--gray-600, #4b5563);
}

/* M28.1 — file upload / dropzone visible boundaries (light/dark, focus, disabled) */
.fi-fo-file-upload,
.fi-fo-file-upload-wrp,
.filepond--root,
.fi-operator-upload {
    border-radius: var(--radius-lg, 0.5rem);
    border: 1px solid color-mix(in oklab, var(--gray-950) 18%, transparent);
    background: var(--color-white, #fff);
    transition: border-color 120ms ease, box-shadow 120ms ease;
}

.dark .fi-fo-file-upload,
.dark .fi-fo-file-upload-wrp,
.dark .filepond--root,
.dark .fi-operator-upload {
    border-color: color-mix(in oklab, var(--white) 18%, transparent);
    background: color-mix(in oklab, var(--gray-900) 88%, transparent);
}

.fi-fo-file-upload:focus-within,
.fi-fo-file-upload-wrp:focus-within,
.filepond--root:focus-within,
.fi-operator-upload:focus-within {
    outline: 2px solid color-mix(in oklab, var(--primary-600, #d97706) 85%, transparent);
    outline-offset: 2px;
    border-color: color-mix(in oklab, var(--primary-600, #d97706) 55%, transparent);
    box-shadow: 0 0 0 3px color-mix(in oklab, var(--primary-500) 22%, transparent);
}

.fi-fo-file-upload.is-invalid,
.fi-operator-upload.is-invalid {
    border-color: color-mix(in oklab, var(--danger-500) 55%, transparent);
}

.fi-fo-file-upload[aria-disabled="true"],
.fi-fo-file-upload.is-disabled,
.fi-operator-upload:disabled,
.fi-operator-upload[aria-disabled="true"] {
    opacity: 0.72;
    cursor: not-allowed;
    background: color-mix(in oklab, var(--gray-500) 10%, transparent);
}

.fi-fo-file-upload[readonly],
.fi-operator-upload[readonly] {
    opacity: 0.72;
    background: color-mix(in oklab, var(--gray-500) 10%, transparent);
}


/* Shared Prompt Studio / Library / Dashboard spacing seam */
.pq-studio-stack {
    display: grid;
    gap: 1rem;
    width: 100%;
}

.pq-studio-filters {
    display: flex;
    gap: 0.75rem;
    flex-wrap: wrap;
    align-items: end;
}

.pq-studio-field {
    display: grid;
    gap: 0.25rem;
    font-size: 0.8125rem;
    min-width: 12rem;
}

.pq-studio-checkbox {
    display: flex;
    gap: 0.4rem;
    align-items: center;
    font-size: 0.8125rem;
    padding-bottom: 0.35rem;
}

.pq-studio-muted,
.pq-studio-body {
    margin: 0;
    font-size: 0.875rem;
    color: var(--gray-500);
}

.pq-studio-body {
    margin-bottom: 0.5rem;
    color: inherit;
}

.pq-studio-muted-inline {
    font-weight: 400;
    font-size: 0.75rem;
    color: var(--gray-500);
}

.pq-studio-warn {
    margin: 0 0 0.5rem;
    font-size: 0.8125rem;
    color: var(--warning-600, #b45309);
}

.pq-studio-badge {
    display: inline-block;
    margin-left: 0.35rem;
    padding: 0.1rem 0.45rem;
    border-radius: 0.35rem;
    font-size: 0.7rem;
    font-weight: 600;
    vertical-align: middle;
}

.pq-studio-badge--tier {
    background: color-mix(in oklab, var(--primary-500, #b45309) 14%, transparent);
    color: var(--primary-700, #9a3412);
}

.pq-studio-reqs {
    margin-bottom: 0.5rem;
    font-size: 0.8125rem;
}

.pq-studio-reqs__title {
    font-weight: 500;
}

.pq-studio-reqs ul {
    margin: 0.25rem 0 0;
    padding-left: 0;
    list-style: none;
}

.pq-studio-reqs li {
    display: flex;
    gap: 0.4rem;
    align-items: baseline;
    flex-wrap: wrap;
    margin-top: 0.2rem;
}

.pq-studio-req-bucket {
    text-transform: uppercase;
    font-size: 0.7rem;
    color: var(--gray-500);
}

.pq-studio-dot {
    width: 0.55rem;
    height: 0.55rem;
    border-radius: 999px;
    display: inline-block;
    flex: 0 0 auto;
}

.pq-studio-dot--green { background: #16a34a; }
.pq-studio-dot--red { background: #dc2626; }
.pq-studio-dot--orange { background: #ea580c; }
.pq-studio-dot--grey { background: #a8a29e; }

.pq-studio-meta {
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
    font-size: 0.8125rem;
    color: var(--gray-500);
}

.pq-studio-actions {
    margin-top: 0.75rem;
}

.pq-modmap__card-icon {
    display: inline-flex;
    margin-bottom: 0.35rem;
    color: #b45309;
}

/* Account chip (topbar) */
.fi-operator-tenant-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    max-width: min(16rem, 42vw);
    padding: 0.3rem 0.55rem;
    border-radius: 0.55rem;
    border: 1px solid color-mix(in oklab, var(--gray-400) 45%, transparent);
    background: color-mix(in oklab, var(--gray-100) 70%, transparent);
    color: inherit;
    text-decoration: none;
    font-size: 0.8125rem;
    font-weight: 550;
    line-height: 1.2;
}

.fi-operator-tenant-chip:hover {
    border-color: color-mix(in oklab, var(--primary-500) 45%, transparent);
}

.fi-operator-tenant-chip--none {
    color: var(--gray-500);
    font-weight: 500;
}

.fi-operator-tenant-chip__dot {
    width: 0.45rem;
    height: 0.45rem;
    border-radius: 999px;
    background: var(--success-500, #16a34a);
    flex: 0 0 auto;
}

.fi-operator-tenant-chip--none .fi-operator-tenant-chip__dot {
    background: var(--gray-400);
}

.fi-operator-tenant-chip__label {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.fi-operator-tenant-chip__chevron {
    flex: 0 0 auto;
    opacity: 0.65;
    font-size: 0.7rem;
}

/* Pecutool readiness status cards */
.fi-pecutool-readiness {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

.fi-pecutool-readiness__alert {
    border-radius: 0.85rem;
    border: 1px solid color-mix(in oklab, var(--danger-500) 40%, transparent);
    background: color-mix(in oklab, var(--danger-50, #fef2f2) 80%, transparent);
    padding: 0.9rem 1rem;
}

.fi-pecutool-readiness__alert-title {
    font-size: 0.875rem;
    font-weight: 650;
    color: var(--danger-700, #b91c1c);
}

.fi-pecutool-readiness__alert-body {
    margin: 0.35rem 0 0;
    font-size: 0.875rem;
    overflow-wrap: anywhere;
}

.fi-pecutool-readiness__overview {
    display: grid;
    gap: 0.75rem;
    grid-template-columns: 1fr;
    margin-bottom: 1rem;
}

@media (min-width: 700px) {
    .fi-pecutool-readiness__overview {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 1100px) {
    .fi-pecutool-readiness__overview {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

.fi-pecutool-readiness__overview-card,
.fi-pecutool-readiness__card,
.fi-pecutool-readiness__next {
    border-radius: 0.85rem;
    border: 1px solid color-mix(in oklab, var(--gray-400) 35%, transparent);
    background: color-mix(in oklab, var(--gray-50) 55%, transparent);
    padding: 0.85rem 0.95rem;
    min-width: 0;
}

.fi-pecutool-readiness__overview-card--ready {
    border-color: color-mix(in oklab, var(--success-500) 35%, transparent);
}

.fi-pecutool-readiness__overview-card--pending {
    border-color: color-mix(in oklab, var(--warning-500) 40%, transparent);
}

.fi-pecutool-readiness__overview-card--blocked {
    border-color: color-mix(in oklab, var(--danger-500) 40%, transparent);
}

.fi-pecutool-readiness__eyebrow {
    font-size: 0.7rem;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--gray-500);
}

.fi-pecutool-readiness__title {
    margin-top: 0.25rem;
    font-size: 0.95rem;
    font-weight: 600;
    overflow-wrap: anywhere;
}

.fi-pecutool-readiness__mono {
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 0.8125rem;
}

.fi-pecutool-readiness__meta {
    margin-top: 0.2rem;
    font-size: 0.75rem;
    color: var(--gray-500);
    overflow-wrap: anywhere;
}

.fi-pecutool-readiness__status-line {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    margin-top: 0.3rem;
    font-weight: 650;
}

.fi-pecutool-readiness__symbol {
    flex: 0 0 auto;
}

.fi-pecutool-readiness__next {
    margin-bottom: 1rem;
    border-color: color-mix(in oklab, var(--primary-500) 35%, transparent);
    background: color-mix(in oklab, var(--primary-50, #eff6ff) 55%, transparent);
}

.fi-pecutool-readiness__grid {
    display: grid;
    gap: 0.75rem;
    grid-template-columns: 1fr;
}

@media (min-width: 700px) {
    .fi-pecutool-readiness__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 1200px) {
    .fi-pecutool-readiness__grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

.fi-pecutool-readiness__card--ready {
    border-color: color-mix(in oklab, var(--success-500) 30%, transparent);
}

.fi-pecutool-readiness__card--pending {
    border-color: color-mix(in oklab, var(--warning-500) 35%, transparent);
}

.fi-pecutool-readiness__card--blocked,
.fi-pecutool-readiness__card--prominent {
    border-color: color-mix(in oklab, var(--danger-500) 40%, transparent);
    background: color-mix(in oklab, var(--danger-50, #fef2f2) 45%, transparent);
}

.fi-pecutool-readiness__card-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.65rem;
}

.fi-pecutool-readiness__card-title {
    font-size: 0.9rem;
    font-weight: 600;
    overflow-wrap: anywhere;
}

.fi-pecutool-readiness__badge {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    flex: 0 0 auto;
    border-radius: 999px;
    padding: 0.15rem 0.55rem;
    font-size: 0.7rem;
    font-weight: 650;
    white-space: nowrap;
}

.fi-pecutool-readiness__badge--ready {
    background: color-mix(in oklab, var(--success-500) 18%, transparent);
    color: var(--success-700, #166534);
}

.fi-pecutool-readiness__badge--pending {
    background: color-mix(in oklab, var(--warning-500) 20%, transparent);
    color: var(--warning-700, #92400e);
}

.fi-pecutool-readiness__badge--blocked {
    background: color-mix(in oklab, var(--danger-500) 18%, transparent);
    color: var(--danger-700, #991b1b);
}

.fi-pecutool-readiness__summary {
    margin: 0.55rem 0 0;
    font-size: 0.8125rem;
    color: var(--gray-600);
    overflow-wrap: anywhere;
    word-break: break-word;
}

.fi-pecutool-readiness__details {
    margin-top: 0.55rem;
}

.fi-pecutool-readiness__details summary {
    cursor: pointer;
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--gray-500);
}

.fi-pecutool-readiness__pre {
    margin: 0.45rem 0 0;
    max-width: 100%;
    overflow-x: auto;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
    word-break: break-word;
    border-radius: 0.55rem;
    border: 1px solid color-mix(in oklab, var(--gray-400) 30%, transparent);
    background: color-mix(in oklab, var(--gray-100) 65%, transparent);
    padding: 0.65rem 0.75rem;
    font-size: 0.72rem;
    line-height: 1.4;
}

.fi-pecutool-readiness__pre--card {
    margin-top: 0.75rem;
}

.fi-pecutool-readiness__checked {
    margin: 0.85rem 0 0;
    font-size: 0.75rem;
    color: var(--gray-500);
}

.fi-pecutool-readiness__checklist {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
}

.fi-pecutool-readiness__checklist li {
    padding-bottom: 0.75rem;
    border-bottom: 1px solid color-mix(in oklab, var(--gray-300) 55%, transparent);
}

.fi-pecutool-readiness__checklist li:last-child {
    border-bottom: 0;
    padding-bottom: 0;
}

.fi-pecutool-readiness__checklist-label {
    font-size: 0.875rem;
    font-weight: 600;
}

.fi-pecutool-readiness__actions {
    margin-bottom: 0.75rem;
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}


/* Persona intelligence dashboard */
.pq-persona-dashboard {
    display: grid;
    gap: 1rem;
}

.pq-persona-hero,
.pq-persona-panel {
    border: 1px solid color-mix(in oklab, var(--gray-400, #9ca3af) 24%, transparent);
    background: linear-gradient(145deg, color-mix(in oklab, var(--primary-500, #f59e0b) 5%, white), white 58%);
    border-radius: 1rem;
    box-shadow: 0 12px 30px rgb(15 23 42 / 5%);
}

.dark .pq-persona-hero,
.dark .pq-persona-panel {
    background: linear-gradient(145deg, color-mix(in oklab, var(--primary-500, #f59e0b) 8%, #111827), #111827 58%);
    border-color: rgb(255 255 255 / 10%);
}

.pq-persona-hero {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 1rem;
    padding: 1.25rem;
    overflow: hidden;
    position: relative;
}

.pq-persona-hero::after {
    content: '';
    position: absolute;
    width: 12rem;
    height: 12rem;
    right: -5rem;
    top: -7rem;
    border-radius: 999px;
    background: color-mix(in oklab, var(--primary-500, #f59e0b) 16%, transparent);
}

.pq-persona-avatar {
    display: grid;
    width: 4.5rem;
    height: 4.5rem;
    place-items: center;
    border-radius: 1.25rem;
    color: white;
    font-size: 1.25rem;
    font-weight: 800;
    letter-spacing: .04em;
    background: linear-gradient(135deg, #0f172a, var(--primary-600, #d97706));
}

.pq-persona-kicker,
.pq-persona-panel__heading span {
    color: var(--primary-600, #d97706);
    font-size: .7rem;
    font-weight: 750;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.pq-persona-hero h2 {
    margin: .15rem 0;
    font-size: 1.45rem;
    line-height: 1.15;
    font-weight: 780;
}

.pq-persona-hero p,
.pq-persona-panel p {
    color: var(--gray-600, #4b5563);
    font-size: .86rem;
}

.dark .pq-persona-hero p,
.dark .pq-persona-panel p { color: var(--gray-400, #9ca3af); }

.pq-persona-confidence {
    z-index: 1;
    display: grid;
    width: 7.25rem;
    height: 7.25rem;
    place-content: center;
    border: 1px solid color-mix(in oklab, var(--primary-500, #f59e0b) 25%, transparent);
    border-radius: 999px;
    background: color-mix(in oklab, var(--primary-500, #f59e0b) 9%, white);
    text-align: center;
}

.dark .pq-persona-confidence { background: color-mix(in oklab, var(--primary-500, #f59e0b) 10%, #111827); }
.pq-persona-confidence strong { font-size: 1.45rem; }
.pq-persona-confidence span { max-width: 5rem; color: var(--gray-500); font-size: .66rem; line-height: 1.15; }

.pq-persona-chips { display: flex; flex-wrap: wrap; gap: .3rem; margin-top: .65rem; }
.pq-persona-chips span { padding: .18rem .5rem; border-radius: 999px; background: color-mix(in oklab, var(--primary-500, #f59e0b) 10%, transparent); font-size: .7rem; }

.pq-persona-dashboard__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.pq-persona-panel { padding: 1.1rem; }
.pq-persona-panel--wide { grid-row: span 2; }
.pq-persona-panel__heading { display: flex; justify-content: space-between; align-items: start; gap: 1rem; margin-bottom: 1rem; }
.pq-persona-panel__heading h3 { margin-top: .12rem; font-size: 1rem; font-weight: 730; }
.pq-persona-panel__heading small { color: var(--gray-500); font-size: .7rem; }

.pq-persona-bars { display: grid; gap: .9rem; }
.pq-persona-bar__label,
.pq-persona-bar__ends { display: flex; justify-content: space-between; align-items: center; }
.pq-persona-bar__label { font-size: .78rem; }
.pq-persona-bar__label span { color: var(--gray-500); font-variant-numeric: tabular-nums; }
.pq-persona-bar__track { height: .32rem; position: relative; margin: .35rem 0 .25rem; border-radius: 999px; background: linear-gradient(90deg, #94a3b8, var(--primary-500, #f59e0b)); }
.pq-persona-bar__track i { position: absolute; top: 50%; width: .85rem; height: .85rem; transform: translate(-50%, -50%); border: 2px solid white; border-radius: 999px; background: #0f172a; box-shadow: 0 2px 8px rgb(15 23 42 / 25%); }
.pq-persona-bar__ends { color: var(--gray-500); font-size: .64rem; }

.pq-persona-radar svg { display: block; width: 100%; max-width: 22rem; margin: auto; overflow: visible; }
.pq-radar-grid { fill: none; stroke: color-mix(in oklab, var(--gray-500, #6b7280) 28%, transparent); stroke-width: 1; }
.pq-radar-grid--inner { stroke-dasharray: 3 3; }
.pq-radar-shape { fill: color-mix(in oklab, var(--primary-500, #f59e0b) 24%, transparent); stroke: var(--primary-600, #d97706); stroke-width: 2; }
.pq-persona-radar text { fill: currentColor; font-size: 7px; font-weight: 650; }

.pq-role-list { display: grid; gap: .65rem; }
.pq-role-list > div { display: grid; grid-template-columns: 5rem 1fr 1.7rem; align-items: center; gap: .5rem; font-size: .75rem; }
.pq-role-list i { height: .38rem; overflow: hidden; border-radius: 999px; background: color-mix(in oklab, var(--gray-400, #9ca3af) 20%, transparent); }
.pq-role-list b { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--primary-500, #f59e0b), #fb7185); }
.pq-role-list strong { text-align: right; font-variant-numeric: tabular-nums; }
.pq-persona-quote blockquote { margin: .35rem 0 .9rem; color: var(--gray-900, #111827); font-family: Georgia, serif; font-size: 1.12rem; font-style: italic; line-height: 1.5; }
.dark .pq-persona-quote blockquote { color: var(--gray-100, #f3f4f6); }
.pq-persona-quote p + p { margin-top: .45rem; }
.pq-persona-awaiting { text-align: center; padding: 2rem; }
.pq-persona-awaiting h3 { font-weight: 720; }
.pq-persona-awaiting p { max-width: 48rem; margin: .5rem auto 0; }

@media (max-width: 760px) {
    .pq-persona-hero { grid-template-columns: auto 1fr; }
    .pq-persona-confidence { grid-column: 1 / -1; width: 100%; height: auto; padding: .7rem; border-radius: .75rem; }
    .pq-persona-confidence span { max-width: none; }
    .pq-persona-dashboard__grid { grid-template-columns: 1fr; }
    .pq-persona-panel--wide { grid-row: auto; }
}

/* Run details: product-level execution overview above the diagnostic sections. */
.pq-run-hero {
    --run-accent: #38bdf8;
    position: relative;
    overflow: hidden;
    padding: 1.4rem;
    border: 1px solid color-mix(in oklab, var(--run-accent) 30%, transparent);
    border-radius: 1.25rem;
    background:
        radial-gradient(circle at 88% 18%, color-mix(in oklab, var(--run-accent) 22%, transparent), transparent 35%),
        linear-gradient(135deg, #08101d, #111827 62%, #0f172a);
    color: #f8fafc;
    box-shadow: 0 20px 50px rgb(2 6 23 / 20%);
}
.pq-run-hero--success { --run-accent: #4ade80; }
.pq-run-hero--danger { --run-accent: #fb7185; }
.pq-run-hero--warning { --run-accent: #fbbf24; }
.pq-run-hero__eyebrow { display: flex; align-items: center; gap: .45rem; color: #cbd5e1; font-size: .7rem; font-weight: 750; letter-spacing: .09em; text-transform: uppercase; }
.pq-run-hero__eyebrow svg { width: 1rem; color: var(--run-accent); }
.pq-run-hero__eyebrow strong { margin-left: auto; padding: .24rem .58rem; border: 1px solid color-mix(in oklab, var(--run-accent) 38%, transparent); border-radius: 999px; background: color-mix(in oklab, var(--run-accent) 12%, transparent); color: var(--run-accent); letter-spacing: 0; }
.pq-run-hero__heading { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin: 1rem 0; }
.pq-run-hero__heading h2 { max-width: 46rem; font-size: clamp(1.35rem, 3vw, 2rem); font-weight: 780; line-height: 1.12; }
.pq-run-hero__heading p { margin-top: .35rem; color: #94a3b8; font-size: .85rem; }
.pq-run-hero__score { display: grid; min-width: 5.4rem; min-height: 5.4rem; place-content: center; border: 1px solid color-mix(in oklab, var(--run-accent) 35%, transparent); border-radius: 999px; background: rgb(15 23 42 / 65%); text-align: center; }
.pq-run-hero__score strong { color: var(--run-accent); font-size: 1.25rem; }
.pq-run-hero__score span { color: #94a3b8; font-size: .63rem; text-transform: uppercase; }
.pq-run-progress { height: .38rem; overflow: hidden; border-radius: 999px; background: rgb(148 163 184 / 15%); }
.pq-run-progress i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--run-accent), #a7f3d0); box-shadow: 0 0 15px color-mix(in oklab, var(--run-accent) 48%, transparent); }
.pq-run-facts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .7rem; margin-top: 1rem; }
.pq-run-facts div { padding: .7rem .8rem; border: 1px solid rgb(148 163 184 / 13%); border-radius: .8rem; background: rgb(15 23 42 / 52%); }
.pq-run-facts dt { color: #94a3b8; font-size: .64rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; }
.pq-run-facts dd { margin-top: .16rem; color: #f8fafc; font-size: .82rem; font-weight: 650; }

/* Engineering review: a guided journey instead of a flat technical form. */
.pq-review-hero {
    position: relative;
    overflow: hidden;
    padding: 1.4rem;
    border: 1px solid rgb(56 189 248 / 24%);
    border-radius: 1.25rem;
    background:
        radial-gradient(circle at 90% 10%, rgb(14 165 233 / 22%), transparent 38%),
        linear-gradient(135deg, #07111e, #101827 65%, #111827);
    color: #f8fafc;
}
.pq-review-hero__copy > span { display: flex; align-items: center; gap: .4rem; color: #7dd3fc; font-size: .68rem; font-weight: 760; letter-spacing: .09em; text-transform: uppercase; }
.pq-review-hero__copy > span svg { width: 1rem; }
.pq-review-hero__copy h2 { margin-top: .65rem; max-width: 42rem; font-size: clamp(1.35rem, 3vw, 2rem); font-weight: 780; line-height: 1.14; }
.pq-review-hero__copy p { max-width: 48rem; margin-top: .45rem; color: #aab8ca; font-size: .86rem; line-height: 1.55; }
.pq-review-journey { display: grid; grid-template-columns: 1fr auto 1fr auto 1fr; align-items: center; gap: .75rem; margin-top: 1.25rem; }
.pq-review-journey > div { display: flex; align-items: center; gap: .65rem; padding: .75rem; border: 1px solid rgb(148 163 184 / 16%); border-radius: .85rem; background: rgb(15 23 42 / 65%); }
.pq-review-journey i { display: grid; width: 1.8rem; height: 1.8rem; flex: 0 0 auto; place-content: center; border-radius: .55rem; background: rgb(56 189 248 / 15%); color: #7dd3fc; font-size: .72rem; font-style: normal; font-weight: 800; }
.pq-review-journey span { display: grid; }
.pq-review-journey strong { font-size: .76rem; }
.pq-review-journey small { margin-top: .08rem; color: #94a3b8; font-size: .65rem; }
.pq-review-journey b { color: #475569; }
.pq-review-guardrail { display: flex; align-items: center; gap: .4rem; margin-top: 1rem; color: #86efac; font-size: .72rem; font-weight: 650; }
.pq-review-guardrail svg { width: 1rem; }
.pq-review-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.pq-review-field { display: grid; align-content: start; gap: .42rem; min-width: 0; padding: .8rem; border: 1px solid color-mix(in oklab, var(--gray-400, #9ca3af) 18%, transparent); border-radius: .85rem; background: color-mix(in oklab, var(--gray-50, #f9fafb) 70%, transparent); }
.dark .pq-review-field { background: rgb(15 23 42 / 42%); }
.pq-review-field--wide { grid-column: 1 / -1; }
.pq-review-field > span:first-child { margin: 0; color: var(--gray-700, #374151); font-size: .7rem; font-weight: 720; letter-spacing: .04em; text-transform: uppercase; }
.dark .pq-review-field > span:first-child { color: var(--gray-300, #d1d5db); }
.pq-review-control { width: 100%; min-width: 0; height: 2.65rem; padding: 0 .8rem; border: 1px solid color-mix(in oklab, var(--gray-400, #9ca3af) 35%, transparent); border-radius: .65rem; background: white; color: var(--gray-900, #111827); font-size: .82rem; outline: none; }
.dark .pq-review-control { border-color: rgb(148 163 184 / 24%); background: #080e19; color: #f8fafc; }
.pq-review-control:focus { border-color: var(--primary-500, #f59e0b); box-shadow: 0 0 0 3px color-mix(in oklab, var(--primary-500, #f59e0b) 14%, transparent); }
.pq-review-actions { display: flex; flex-wrap: wrap; gap: .55rem; margin-top: 1rem; padding-top: 1rem; border-top: 1px solid color-mix(in oklab, var(--gray-400, #9ca3af) 18%, transparent); }
+
/* Context Core intake: presentation-ready overview and an explicit first action. */
.pq-intake-shell { display: grid; gap: 1rem; }
.pq-intake-hero {
    position: relative;
    overflow: hidden;
    padding: 1.4rem;
    border: 1px solid rgb(45 212 191 / 23%);
    border-radius: 1.25rem;
    background:
        radial-gradient(circle at 88% 2%, rgb(16 185 129 / 24%), transparent 38%),
        linear-gradient(135deg, #071512, #0d1b21 62%, #111827);
    color: #f8fafc;
}
.pq-intake-eyebrow { display: flex; align-items: center; gap: .4rem; color: #6ee7b7; font-size: .68rem; font-weight: 760; letter-spacing: .1em; text-transform: uppercase; }
.pq-intake-eyebrow svg { width: 1rem; }
.pq-intake-hero h2 { max-width: 42rem; margin-top: .6rem; font-size: clamp(1.35rem, 3vw, 2rem); font-weight: 780; line-height: 1.12; }
.pq-intake-hero__copy > p { max-width: 49rem; margin-top: .45rem; color: #a9bbc4; font-size: .86rem; line-height: 1.55; }
.pq-intake-metrics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .65rem; margin-top: 1.2rem; }
.pq-intake-metrics > div { display: grid; gap: .16rem; padding: .75rem .85rem; border: 1px solid rgb(148 163 184 / 14%); border-radius: .8rem; background: rgb(15 23 42 / 55%); }
.pq-intake-metrics span { color: #91a5b1; font-size: .62rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; }
.pq-intake-metrics strong { overflow: hidden; color: #ecfdf5; font-size: .9rem; text-overflow: ellipsis; white-space: nowrap; }
.pq-intake-progress { height: .38rem; margin-top: .85rem; overflow: hidden; border-radius: 999px; background: rgb(148 163 184 / 15%); }
.pq-intake-progress span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #34d399, #5eead4); box-shadow: 0 0 16px rgb(45 212 191 / 45%); }
.pq-intake-missing { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; margin-top: .8rem; }
.pq-intake-missing > span { color: #94a3b8; font-size: .65rem; font-weight: 700; text-transform: uppercase; }
.pq-intake-missing small { padding: .24rem .48rem; border: 1px solid rgb(251 191 36 / 20%); border-radius: 999px; background: rgb(251 191 36 / 8%); color: #fde68a; font-size: .65rem; }
.pq-intake-start-card { overflow: hidden; border: 1px solid color-mix(in oklab, var(--gray-400, #9ca3af) 18%, transparent); border-radius: 1rem; background: color-mix(in oklab, var(--gray-50, #f9fafb) 78%, transparent); }
.dark .pq-intake-start-card { background: #161616; }
.pq-intake-start-card__heading { display: flex; align-items: flex-start; gap: .75rem; padding: 1rem 1.15rem; border-bottom: 1px solid color-mix(in oklab, var(--gray-400, #9ca3af) 16%, transparent); }
.pq-intake-step { display: grid; width: 1.9rem; height: 1.9rem; flex: 0 0 auto; place-content: center; border-radius: .6rem; background: rgb(16 185 129 / 14%); color: #34d399; font-size: .75rem; font-weight: 800; }
.pq-intake-start-card h3 { font-size: .92rem; font-weight: 730; }
.pq-intake-start-card__heading p { margin-top: .18rem; color: var(--gray-500, #6b7280); font-size: .75rem; line-height: 1.45; }
.pq-intake-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)) auto; align-items: end; gap: .85rem; padding: 1rem 1.15rem 1.15rem; }
.pq-intake-form-grid label { display: grid; gap: .38rem; min-width: 0; }
.pq-intake-form-grid label > span { color: var(--gray-700, #374151); font-size: .68rem; font-weight: 720; letter-spacing: .04em; text-transform: uppercase; }
.dark .pq-intake-form-grid label > span { color: #cbd5e1; }
.pq-intake-control { width: 100%; min-width: 0; height: 2.65rem; padding: 0 .8rem; border: 1px solid color-mix(in oklab, var(--gray-400, #9ca3af) 35%, transparent); border-radius: .68rem; background: white; color: var(--gray-900, #111827); font-size: .82rem; outline: none; }
.dark .pq-intake-control { border-color: rgb(148 163 184 / 24%); background: #080e19; color: #f8fafc; }
.pq-intake-control:focus { border-color: #34d399; box-shadow: 0 0 0 3px rgb(52 211 153 / 12%); }
.pq-intake-active-case { display: flex; align-items: center; justify-content: space-between; gap: .75rem; padding: 1rem 1.15rem; }
.pq-intake-active-case > div { display: grid; gap: .15rem; }
.pq-intake-active-case span { color: var(--gray-500, #6b7280); font-size: .72rem; }
.pq-intake-active-case > span { padding: .28rem .55rem; border-radius: 999px; background: rgb(16 185 129 / 12%); color: #34d399; font-weight: 700; }



/* Operational workflows: a customer-facing activation surface, not a configuration table. */
.pq-ops-hero { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(18rem, .8fr); gap: 1.25rem; padding: 1.5rem; border: 1px solid rgb(74 222 128 / 22%); border-radius: 1.35rem; background: radial-gradient(circle at 88% 0, rgb(22 163 74 / 24%), transparent 38%), linear-gradient(135deg, #07120d, #0d1720 60%, #111827); color: #f8fafc; }
.pq-ops-hero > div:first-child > span { display: flex; align-items: center; gap: .42rem; color: #86efac; font-size: .68rem; font-weight: 780; letter-spacing: .1em; }
.pq-ops-hero > div:first-child > span svg { width: 1rem; }
.pq-ops-hero h2 { max-width: 44rem; margin-top: .65rem; font-size: clamp(1.45rem, 3vw, 2.15rem); font-weight: 790; line-height: 1.1; }
.pq-ops-hero p { max-width: 48rem; margin-top: .55rem; color: #a7b9c8; font-size: .86rem; line-height: 1.55; }
.pq-ops-hero__facts { display: grid; grid-template-columns: repeat(3, 1fr); gap: .55rem; align-self: end; }
.pq-ops-hero__facts div { display: grid; gap: .2rem; padding: .8rem; border: 1px solid rgb(148 163 184 / 14%); border-radius: .8rem; background: rgb(15 23 42 / 58%); }
.pq-ops-hero__facts small { color: #8ba1b2; font-size: .58rem; font-weight: 700; letter-spacing: .08em; }
.pq-ops-hero__facts strong { color: #dcfce7; font-size: 1.2rem; }
.pq-ops-section-heading { display: flex; align-items: end; justify-content: space-between; gap: 1rem; margin: 1.5rem 0 .75rem; }
.pq-ops-section-heading > div { display: flex; align-items: center; gap: .65rem; }
.pq-ops-section-heading > div > span { display: grid; width: 1.75rem; height: 1.75rem; place-content: center; border-radius: .55rem; background: rgb(34 197 94 / 12%); color: #22c55e; font-size: .65rem; font-weight: 800; }
.pq-ops-section-heading h3 { font-size: 1rem; font-weight: 760; }
.pq-ops-section-heading p { max-width: 30rem; color: var(--gray-500, #6b7280); font-size: .72rem; text-align: right; }
.pq-ops-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .85rem; }
.pq-ops-card { display: grid; align-content: start; min-width: 0; padding: 1rem; border: 1px solid color-mix(in oklab, var(--gray-400, #9ca3af) 18%, transparent); border-radius: 1rem; background: color-mix(in oklab, var(--gray-50, #f9fafb) 82%, transparent); box-shadow: 0 8px 28px rgb(15 23 42 / 4%); }
.dark .pq-ops-card { background: #151617; }
.pq-ops-card--active { border-color: rgb(34 197 94 / 30%); box-shadow: inset 0 0 0 1px rgb(34 197 94 / 7%), 0 12px 34px rgb(15 23 42 / 10%); }
.pq-ops-card__top { display: flex; align-items: center; justify-content: space-between; }
.pq-ops-card__icon { display: grid; width: 2.15rem; height: 2.15rem; place-content: center; border-radius: .72rem; background: rgb(34 197 94 / 11%); color: #22c55e; }
.pq-ops-card__icon svg { width: 1.15rem; }
.pq-ops-state { padding: .23rem .48rem; border: 1px solid rgb(148 163 184 / 18%); border-radius: 999px; color: var(--gray-500, #6b7280); font-size: .56rem; font-weight: 760; letter-spacing: .06em; }
.pq-ops-state--active, .pq-ops-state--published { border-color: rgb(34 197 94 / 22%); background: rgb(34 197 94 / 9%); color: #22c55e; }
.pq-ops-card h3 { margin-top: .78rem; font-size: .94rem; font-weight: 750; }
.pq-ops-card > p { min-height: 2.7rem; margin-top: .3rem; color: var(--gray-500, #6b7280); font-size: .73rem; line-height: 1.48; }
.pq-ops-card__meta { display: flex; flex-wrap: wrap; gap: .38rem; margin-top: .75rem; }
.pq-ops-card__meta span { display: flex; align-items: center; gap: .25rem; padding: .25rem .42rem; border-radius: .42rem; background: color-mix(in oklab, var(--gray-200, #e5e7eb) 55%, transparent); color: var(--gray-600, #4b5563); font-size: .62rem; }
.dark .pq-ops-card__meta span { background: rgb(51 65 85 / 40%); color: #aab7c5; }
.pq-ops-card__meta svg { width: .75rem; }
.pq-ops-card__next { margin-top: .65rem; padding: .45rem .55rem; border-left: 2px solid #22c55e; background: rgb(34 197 94 / 6%); color: var(--gray-500, #6b7280); font-size: .64rem; }
.pq-ops-card__next strong { color: var(--gray-800, #1f2937); }
.dark .pq-ops-card__next strong { color: #e2e8f0; }
.pq-ops-card__actions { display: flex; flex-wrap: wrap; gap: .42rem; margin-top: .85rem; padding-top: .75rem; border-top: 1px solid color-mix(in oklab, var(--gray-400, #9ca3af) 14%, transparent); }
.pq-ops-runs { overflow: hidden; border: 1px solid color-mix(in oklab, var(--gray-400, #9ca3af) 18%, transparent); border-radius: 1rem; background: color-mix(in oklab, var(--gray-50, #f9fafb) 82%, transparent); }
.dark .pq-ops-runs { background: #151617; }
.pq-ops-run { display: grid; grid-template-columns: auto minmax(0, 1fr) auto auto; align-items: center; gap: .7rem; padding: .78rem 1rem; border-bottom: 1px solid color-mix(in oklab, var(--gray-400, #9ca3af) 14%, transparent); transition: background .15s ease; }
.pq-ops-run:last-child { border-bottom: 0; }
.pq-ops-run:hover { background: rgb(34 197 94 / 5%); }
.pq-ops-run__pulse { width: .55rem; height: .55rem; border-radius: 999px; background: #94a3b8; }
.pq-ops-run__pulse--completed { background: #22c55e; box-shadow: 0 0 0 4px rgb(34 197 94 / 10%); }
.pq-ops-run > div { display: grid; min-width: 0; }
.pq-ops-run strong { overflow: hidden; font-size: .75rem; text-overflow: ellipsis; white-space: nowrap; }
.pq-ops-run small, .pq-ops-run > span { color: var(--gray-500, #6b7280); font-size: .62rem; }
.pq-ops-run > svg { width: .9rem; color: #22c55e; }
.pq-ops-runs__empty, .pq-ops-empty { display: grid; justify-items: center; gap: .55rem; padding: 2rem; text-align: center; }
.pq-ops-runs__empty { grid-template-columns: auto 1fr; justify-items: start; text-align: left; }
.pq-ops-runs__empty > svg, .pq-ops-empty > svg { width: 2rem; color: #22c55e; }
.pq-ops-runs__empty > span { display: grid; }
.pq-ops-runs__empty small, .pq-ops-empty p { color: var(--gray-500, #6b7280); font-size: .72rem; }
.pq-ops-empty { border: 1px dashed color-mix(in oklab, var(--gray-400, #9ca3af) 35%, transparent); border-radius: 1rem; }
.pq-ops-empty h2 { font-size: 1.1rem; font-weight: 750; }


@media (max-width: 700px) {
    .pq-ops-hero { grid-template-columns: 1fr; }
    .pq-ops-grid { grid-template-columns: 1fr; }
    .pq-ops-section-heading { align-items: flex-start; flex-direction: column; }
    .pq-ops-section-heading p { text-align: left; }
    .pq-run-hero__heading { align-items: flex-start; }
    .pq-run-hero__score { min-width: 4.5rem; min-height: 4.5rem; }
    .pq-run-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .pq-review-journey { grid-template-columns: 1fr; }
    .pq-review-journey b { display: none; }
    .pq-review-form-grid { grid-template-columns: 1fr; }
    .pq-review-field--wide { grid-column: auto; }
    .pq-intake-metrics { grid-template-columns: 1fr; }
    .pq-intake-form-grid { grid-template-columns: 1fr; }
}

/* Buddies: trustworthy conversational AI presented as a product, not an API debugger. */
.pq-buddy-hero { display:grid; grid-template-columns:minmax(0,1.45fr) auto; gap:1.2rem; align-items:end; padding:1.5rem; border:1px solid rgb(56 189 248 / 22%); border-radius:1.35rem; background:radial-gradient(circle at 88% 0,rgb(14 165 233 / 25%),transparent 40%),linear-gradient(135deg,#07121c,#111827); color:#f8fafc; }
.pq-buddy-kicker { color:#7dd3fc; font-size:.67rem; font-weight:800; letter-spacing:.11em; }
.pq-buddy-hero h2 { margin-top:.55rem; font-size:clamp(1.4rem,3vw,2.1rem); font-weight:790; line-height:1.08; }
.pq-buddy-hero p { max-width:48rem; margin-top:.55rem; color:#a9bac8; font-size:.84rem; line-height:1.55; }
.pq-buddy-readiness { display:grid; gap:.18rem; min-width:10.5rem; padding:.8rem 1rem; border:1px solid rgb(251 191 36 / 25%); border-radius:.85rem; background:rgb(15 23 42 / 62%); }
.pq-buddy-readiness strong { color:#fbbf24; font-size:.78rem; }.pq-buddy-readiness span{color:#91a4b7;font-size:.64rem}.pq-buddy-readiness.is-ready{border-color:rgb(74 222 128 / 28%)}.pq-buddy-readiness.is-ready strong{color:#4ade80}
.pq-buddy-gates { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.65rem; margin-top:1rem; }.pq-buddy-gate{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:.5rem;padding:.75rem;border:1px solid rgb(245 158 11 / 22%);border-radius:.8rem;background:rgb(245 158 11 / 5%);font-size:.7rem}.pq-buddy-gate svg{width:1rem;color:#f59e0b}.pq-buddy-gate strong{font-size:.6rem;color:#f59e0b}.pq-buddy-gate.is-pass{border-color:rgb(34 197 94 / 20%);background:rgb(34 197 94 / 5%)}.pq-buddy-gate.is-pass svg,.pq-buddy-gate.is-pass strong{color:#22c55e}
.pq-buddy-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.9rem; margin-top:1rem; }.pq-buddy-panel,.pq-buddy-answer{padding:1rem;border:1px solid color-mix(in oklab,var(--gray-400,#9ca3af) 18%,transparent);border-radius:1rem;background:color-mix(in oklab,var(--gray-50,#f9fafb) 82%,transparent)}.dark .pq-buddy-panel,.dark .pq-buddy-answer{background:#151617}.pq-buddy-panel-head,.pq-buddy-answer-head{display:flex;align-items:center;justify-content:space-between;gap:.7rem;margin-bottom:.75rem}.pq-buddy-panel-head div{display:grid}.pq-buddy-panel-head span,.pq-buddy-answer-head{color:#0ea5e9;font-size:.61rem;font-weight:780;letter-spacing:.07em}.pq-buddy-panel-head h2{font-size:.96rem;font-weight:760;color:var(--gray-900,#111827)}.dark .pq-buddy-panel-head h2{color:#f8fafc}.pq-buddy-persona{display:grid;grid-template-columns:auto 1fr;gap:.65rem;padding:.7rem 0;border-top:1px solid color-mix(in oklab,var(--gray-400,#9ca3af) 14%,transparent)}.pq-buddy-avatar{display:grid;width:2.1rem;height:2.1rem;place-content:center;border-radius:.7rem;background:linear-gradient(135deg,#0284c7,#22c55e);color:white;font-size:.75rem;font-weight:800}.pq-buddy-persona h3,.pq-buddy-conversation strong{font-size:.75rem;font-weight:750}.pq-buddy-persona p,.pq-buddy-conversation p,.pq-buddy-muted{color:var(--gray-500,#6b7280);font-size:.68rem;line-height:1.45}.pq-buddy-persona small,.pq-buddy-conversation small,.pq-buddy-conversation span{color:var(--gray-400,#9ca3af);font-size:.58rem}.pq-buddy-conversation{display:grid;gap:.3rem;padding:.7rem 0;border-top:1px solid color-mix(in oklab,var(--gray-400,#9ca3af) 14%,transparent)}.pq-buddy-conversation>div{display:flex;justify-content:space-between;gap:.5rem}.pq-buddy-answer{margin-top:1rem;border-color:rgb(14 165 233 / 24%);box-shadow:0 16px 44px rgb(14 165 233 / 7%)}.pq-buddy-evidence-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem;margin-top:1rem}.pq-buddy-evidence-grid>div{padding:.8rem;border-radius:.75rem;background:rgb(14 165 233 / 6%)}.pq-buddy-evidence-grid h3{margin-bottom:.45rem;font-size:.7rem;font-weight:760}.pq-buddy-evidence-grid p{margin-top:.3rem;color:var(--gray-500,#6b7280);font-size:.63rem}.pq-buddy-evidence-grid code{font-size:.55rem}
@media(max-width:700px){.pq-buddy-hero,.pq-buddy-grid,.pq-buddy-evidence-grid,.pq-buddy-gates{grid-template-columns:1fr}.pq-buddy-readiness{min-width:0}}

/* ---------------------------------------------------------------------------
 * Form defaults for the panel's own Blade.
 *
 * Custom admin pages write their own markup, and a bare <textarea> collapses to the
 * browser default: about twenty characters wide, no border, indistinguishable from the
 * text around it. These rules give such controls a real form appearance.
 *
 * Written with :where() so they carry zero specificity — any class on the element wins,
 * and Filament's own components are untouched.
 * ------------------------------------------------------------------------ */

.fi-main :where(label:not([class])) {
    display: block;
    margin-bottom: .3rem;
    color: var(--gray-700, #374151);
    font-size: .8125rem;
    font-weight: 600;
    line-height: 1.35;
}

.dark .fi-main :where(label:not([class])) { color: var(--gray-200, #e5e7eb); }

.fi-main :where(textarea, input[type="text"], input[type="email"], input[type="url"],
    input[type="number"], input[type="search"], input[type="password"], input[type="date"],
    input[type="datetime-local"], select):not([class]) {
    display: block;
    width: 100%;
    padding: .55rem .7rem;
    border: 1px solid color-mix(in oklab, var(--gray-500, #6b7280) 28%, transparent);
    border-radius: .6rem;
    background: var(--white, #fff);
    color: var(--gray-900, #111827);
    font: inherit;
    font-size: .875rem;
    line-height: 1.5;
    transition: border-color .15s, box-shadow .15s;
}

.fi-main :where(textarea):not([class]) { min-height: 8rem; resize: vertical; }

.fi-main :where(textarea, input, select):not([class]):focus {
    border-color: var(--primary-600, #059669);
    box-shadow: 0 0 0 3px color-mix(in oklab, var(--primary-600, #059669) 16%, transparent);
    outline: none;
}

.dark .fi-main :where(textarea, input, select):not([class]) {
    border-color: rgba(255, 255, 255, .14);
    background: rgba(255, 255, 255, .04);
    color: var(--gray-100, #f3f4f6);
}

/* A monospace field is usually a payload; give it room to be read. */
.fi-main :where(textarea.font-mono) { min-height: 12rem; }

/* Help text sits under a control and must read as secondary, not as another label. */
.fi-main :where(.fi-operator-help) {
    margin-top: .3rem;
    color: var(--gray-500, #6b7280);
    font-size: .75rem;
    line-height: 1.45;
}

/* Two-column working layout: the task on the left, an assistant beside it. */
.pq-split { display: grid; gap: 1.25rem; align-items: start; }
@media (min-width: 1180px) { .pq-split { grid-template-columns: minmax(0, 1fr) 24rem; } }
.pq-split__aside { display: grid; gap: 1rem; }
@media (min-width: 1180px) { .pq-split__aside { position: sticky; top: 1.25rem; } }

/* ---------------------------------------------------------------------------
 * Where the Account stands — the dashboard's context status.
 *
 * Every tile that has somewhere to go is a link, because a number telling you six
 * things await without saying where is worse than no number at all.
 * ------------------------------------------------------------------------ */

.pq-status { display: grid; gap: .9rem; }
.pq-status__head h2 { margin: 0; color: var(--gray-900, #111827); font-size: 1rem; font-weight: 720; letter-spacing: -.02em; }
.dark .pq-status__head h2 { color: var(--gray-50, #f8fafc); }
.pq-status__head p { margin: .2rem 0 0; color: var(--gray-500, #6b7280); font-size: .8rem; }
.pq-status__gap { margin: 0; padding: .6rem .75rem; border: 1px solid rgba(245, 158, 11, .35); border-radius: .7rem; background: #fff8e7; color: #8a5a00; font-size: .8rem; }
.dark .pq-status__gap { background: rgba(245, 158, 11, .1); color: #fbbf24; }
.pq-status__gap a { margin-left: .4rem; font-weight: 700; text-decoration: underline; }
.pq-status__grid { display: grid; gap: .6rem; grid-template-columns: repeat(auto-fill, minmax(11rem, 1fr)); }
.pq-status__card { display: grid; gap: .15rem; padding: .75rem .85rem; border: 1px solid var(--pq-shell-line); border-radius: .85rem; background: var(--white, #fff); color: inherit; text-decoration: none; transition: border-color .15s, transform .15s; }
.dark .pq-status__card { background: #121514; }
a.pq-status__card:hover { transform: translateY(-1px); border-color: var(--primary-600, #059669); }
.pq-status__label { color: var(--gray-500, #6b7280); font-size: .72rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.pq-status__value { color: var(--gray-900, #111827); font-size: 1.15rem; font-weight: 740; }
.dark .pq-status__value { color: var(--gray-50, #f8fafc); }
.pq-status__desc { color: var(--gray-500, #6b7280); font-size: .72rem; line-height: 1.4; }

/* Collecting context with an outside assistant, on the onboarding surface. */
.pq-collect { display: grid; gap: .5rem; padding: 1rem; border: 1px solid var(--pq-shell-line); border-radius: 1rem; background: var(--white, #fff); }
.dark .pq-collect { background: #121514; }
.pq-collect h3 { margin: 0; color: var(--gray-900, #111827); font-size: .95rem; font-weight: 720; }
.dark .pq-collect h3 { color: var(--gray-50, #f8fafc); }
.pq-collect__intro { margin: 0; color: var(--gray-500, #6b7280); font-size: .8rem; line-height: 1.5; }
.pq-collect__list { display: grid; gap: .75rem; margin-top: .85rem; }
.pq-collect__item { padding: .85rem; border: 1px solid var(--pq-shell-line); border-radius: .8rem; }

/* Speaking-avatar studio: explicit scoped styles, independent of Tailwind scanning. */
.speaking-avatar-page { --avatar-line: #dde4e3; --avatar-muted: #64748b; --avatar-surface: #fff; --avatar-ink: #172b26; color: var(--avatar-ink); }
.dark .speaking-avatar-page { --avatar-line: #34443e; --avatar-muted: #9eb3a9; --avatar-surface: #17211c; --avatar-ink: #eef9f2; }
.speaking-avatar-page .space-y-6 > * + * { margin-top: 1.5rem; }
.speaking-avatar-page .space-y-4 > * + * { margin-top: 1rem; }
.speaking-avatar-page .space-y-3 > * + * { margin-top: .75rem; }
.speaking-avatar-page .grid { display: grid; gap: 1rem; min-width: 0; }
.speaking-avatar-page .avatar-step-card { padding: 1.25rem; border: 1px solid var(--avatar-line); border-radius: 1rem; background: var(--avatar-surface); box-shadow: 0 4px 16px rgba(16, 40, 28, .035); }
.speaking-avatar-page .avatar-step-card h2 { margin: .45rem 0; font-size: 1rem; font-weight: 700; }
.speaking-avatar-page .avatar-step-card p { line-height: 1.5; }
.speaking-avatar-page label { display: block; min-width: 0; font-size: .875rem; }
.speaking-avatar-page label > span:first-child { display: block; margin-bottom: .4rem; font-weight: 650; }
.speaking-avatar-page input:not([type=checkbox]):not([type=file]),
.speaking-avatar-page select, .speaking-avatar-page textarea { display: block; width: 100%; min-height: 2.75rem; box-sizing: border-box; padding: .65rem .85rem; border: 1px solid var(--avatar-line); border-radius: .65rem; background: var(--avatar-surface); color: var(--avatar-ink); font: inherit; }
.speaking-avatar-page textarea { min-height: 8.5rem; resize: vertical; line-height: 1.55; }
.speaking-avatar-page input:focus, .speaking-avatar-page select:focus, .speaking-avatar-page textarea:focus { outline: 2px solid #10b981; outline-offset: 2px; }
.speaking-avatar-page input[type=file] { display: block; width: 100%; padding: .75rem; border: 1px dashed var(--avatar-line); border-radius: .65rem; background: var(--avatar-surface); color: var(--avatar-muted); font-size: .875rem; }
.speaking-avatar-page input[type=file]::file-selector-button { border: 0; border-radius: .4rem; background: #e4f4eb; color: #14553a; margin-right: .8rem; padding: .5rem .75rem; cursor: pointer; }
.speaking-avatar-page input:disabled, .speaking-avatar-page select:disabled { opacity: .6; cursor: not-allowed; }
.speaking-avatar-page label.flex { display: flex; gap: .75rem; align-items: flex-start; }
.speaking-avatar-page label.flex > span { display: block; margin-bottom: 0; font-weight: 400; line-height: 1.55; }
.speaking-avatar-page input[type=checkbox] { width: 1rem; height: 1rem; margin-top: .25rem; flex-shrink: 0; accent-color: #059669; }
.speaking-avatar-page .flex:not(label) { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem; }
.speaking-avatar-page .justify-between { justify-content: space-between; }
.speaking-avatar-page .font-semibold, .speaking-avatar-page .font-medium { font-weight: 650; }
.speaking-avatar-page .text-sm { font-size: .875rem; line-height: 1.55; }
.speaking-avatar-page .text-xs { font-size: .75rem; line-height: 1.5; }
.speaking-avatar-page .text-gray-500 { color: var(--avatar-muted); }
.speaking-avatar-page .text-primary-600 { color: #059669; }
.dark .speaking-avatar-page .text-primary-600 { color: #6ee7b7; }
.speaking-avatar-page .text-danger-600 { color: #dc2626; }
.dark .speaking-avatar-page .text-danger-600 { color: #fca5a5; }
.speaking-avatar-page .text-warning-600 { color: #b45309; }
.dark .speaking-avatar-page .text-warning-600 { color: #fbbf24; }
.speaking-avatar-page .mt-1 { margin-top: .25rem; }
.speaking-avatar-page .mt-2 { margin-top: .5rem; }
.speaking-avatar-page .mt-3 { margin-top: .75rem; }
.speaking-avatar-page .mt-4 { margin-top: 1rem; }
.speaking-avatar-page .mt-5 { margin-top: 1.25rem; }
.speaking-avatar-page .mt-6 { margin-top: 1.5rem; }
.speaking-avatar-page .mb-4 { margin-bottom: 1rem; }
.speaking-avatar-page article { padding: 1.1rem; border: 1px solid var(--avatar-line); border-radius: .85rem; background: var(--avatar-surface); }
.speaking-avatar-page .rounded-lg.border { padding: .85rem; border: 1px solid var(--avatar-line); border-radius: .65rem; }
.speaking-avatar-page .bg-primary-50 { padding: .9rem; border-radius: .7rem; background: #eaf7ef; }
.dark .speaking-avatar-page .bg-primary-50 { background: #153523; }
.speaking-avatar-page .whitespace-pre-line { white-space: pre-line; }
.speaking-avatar-page video { display: block; width: 100%; max-height: 32rem; background: #000; border-radius: .7rem; }
.speaking-avatar-page audio { display: block; width: 100%; }
.speaking-avatar-page code { overflow-wrap: anywhere; font-size: .75rem; }
@media (min-width: 768px) {
    .speaking-avatar-page .avatar-step-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .speaking-avatar-page .md\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .speaking-avatar-page .md\:col-span-2 { grid-column: span 2; }
}
@media (min-width: 1024px) {
    .speaking-avatar-page .lg\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}