:root {
  color-scheme: light;
  --ink: #243044;
  --muted: #667386;
  --soft: #f4f7fb;
  --panel: rgba(255, 255, 255, 0.92);
  --line: #e0e6ee;
  --line-strong: #c8d2df;
  --bg: #f4f6f9;
  --surface: #ffffff;
  --surface-raised: #ffffff;
  --surface-soft: #fafbfc;
  --surface-muted: #f1f4f8;
  --surface-selected: #e9f2ff;
  --titlebar: #f3f6fa;
  --titlebar-strong: #eaf0f6;
  --chip-muted: #e8f0fa;
  --field: #ffffff;
  --brand-mark-bg: #ffffff;
  --placeholder: #718096;
  --nav: #e8f0fa;
  --nav-2: #f2f6fb;
  --rail-bg: #101a28;
  --rail-ink: #eef4fb;
  --rail-muted: #b7c5d8;
  --rail-border: #25354b;
  --rail-hover-bg: rgba(255, 255, 255, 0.08);
  --rail-active-bg: rgba(255, 255, 255, 0.13);
  --rail-icon-bg: rgba(255, 255, 255, 0.10);
  --rail-icon-ink: #dbeafe;
  --rail-active-icon-bg: var(--rail-icon-bg);
  --rail-active-icon-ink: var(--rail-icon-ink);
  --rail-profile-bg: rgba(255, 255, 255, 0.10);
  --rail-profile-border: rgba(255, 255, 255, 0.20);
  --auth-brand-bg: var(--rail-bg);
  --auth-brand-ink: var(--rail-ink);
  --auth-brand-muted: var(--rail-muted);
  --auth-status-ok: #86d3aa;
  --topbar-bg: var(--nav-2);
  --topbar-ink: var(--ink);
  --topbar-muted: var(--muted);
  --topbar-border: var(--line-strong);
  --topbar-control-bg: color-mix(in srgb, var(--surface-raised) 76%, transparent);
  --topbar-control-border: var(--line);
  --topbar-control-hover-bg: var(--surface-raised);
  --topbar-active-bg: var(--accent-soft);
  --topbar-active-border: color-mix(in srgb, var(--accent) 58%, var(--line));
  --accent: #a6c5f6;
  --accent-ink: #244f8f;
  --accent-soft: #edf4ff;
  --green: #387651;
  --green-soft: #edf8f0;
  --orange: #875812;
  --orange-soft: #fff4df;
  --purple: #6651ae;
  --purple-soft: #f1edff;
  --cyan: #0e7490;
  --cyan-soft: #e8f8fb;
  --teal: #0f766e;
  --teal-soft: #e8f7f4;
  --violet: var(--purple);
  --violet-soft: var(--purple-soft);
  --project-stack-1: #FFDAB3;
  --project-stack-1-ink: #243044;
  --project-stack-2: #C8AAAA;
  --project-stack-2-ink: #243044;
  --project-stack-3: #9F8383;
  --project-stack-3-ink: #111827;
  --project-stack-4: #574964;
  --project-stack-4-ink: #fffefa;
  --project-stack-5: #667386;
  --project-stack-5-ink: #fffefa;
  --project-stack-divider: color-mix(in srgb, var(--surface-raised) 82%, transparent);
  --danger: #9f3f38;
  --danger-soft: #fff0ee;
  --not-installed-ink: var(--muted);
  --not-installed-bg: color-mix(in srgb, var(--surface-muted) 82%, var(--line-strong) 18%);
  --not-installed-border: color-mix(in srgb, var(--line) 72%, var(--line-strong) 28%);
  --embraid-red: #ed1c24;
  --ok: var(--green);
  --shadow: 0 1px 2px rgba(16, 24, 40, 0.04), 0 8px 24px rgba(16, 24, 40, 0.05);
  --shadow-strong: 0 2px 5px rgba(16, 24, 40, 0.08), 0 18px 42px rgba(16, 24, 40, 0.13);
  --modal-scrim: rgba(16, 24, 40, 0.38);
  --modal-shadow: 0 28px 72px rgba(16, 24, 40, 0.28), 0 8px 24px rgba(16, 24, 40, 0.16);
  --text-primary: var(--ink);
  --text-secondary: var(--muted);
  --text-tertiary: color-mix(in srgb, var(--muted) 72%, var(--surface-raised));
  --app-bg: var(--bg);
  --pane-bg: var(--surface-soft);
  --panel-bg: var(--surface-raised);
  --panel-bg-subtle: var(--surface-soft);
  --panel-bg-muted: var(--surface-muted);
  --panel-bg-selected: var(--surface-selected);
  --panel-header-bg: var(--titlebar);
  --panel-header-bg-strong: var(--titlebar-strong);
  --row-bg: var(--surface-raised);
  --row-bg-subtle: var(--surface-soft);
  --row-bg-hover: var(--titlebar);
  --row-bg-selected: var(--surface-selected);
  --field-bg: var(--field);
  --tab-bg: var(--surface-soft);
  --tab-bg-active: var(--surface-selected);
  --chip-bg: var(--chip-muted);
  --border-soft: var(--line);
  --border-strong: var(--line-strong);
  --link-fg: var(--accent-ink);
  --link-hover-fg: var(--text-primary);
  --button-bg: var(--surface-raised);
  --button-fg: var(--ink);
  --button-border: var(--line);
  --button-hover-bg: var(--surface-selected);
  --button-hover-fg: var(--accent-ink);
  --button-hover-border: var(--line-strong);
  --button-primary-bg: var(--accent-ink);
  --button-primary-fg: #ffffff;
  --button-primary-hover-bg: color-mix(in srgb, var(--accent-ink) 86%, #000000);
  --button-secondary-bg: var(--accent-soft);
  --button-secondary-fg: var(--accent-ink);
  --button-secondary-border: color-mix(in srgb, var(--accent) 72%, var(--line));
  --status-ok-bg: var(--green-soft);
  --status-ok-fg: var(--green);
  --status-ok-border: color-mix(in srgb, var(--green) 56%, var(--line));
  --status-warn-bg: var(--orange-soft);
  --status-warn-fg: var(--orange);
  --status-warn-border: color-mix(in srgb, var(--orange) 56%, var(--line));
  --focus-star-selected: #b77900;
  --status-danger-bg: var(--danger-soft);
  --status-danger-fg: var(--danger);
  --status-danger-border: color-mix(in srgb, var(--danger) 56%, var(--line));
  --status-neutral-bg: var(--chip-muted);
  --status-neutral-fg: var(--muted);
  --status-neutral-border: var(--line);
  --chart-primary: var(--accent-ink);
  --chart-primary-soft: var(--accent-soft);
  --chart-grid: var(--line);
  --chart-target: var(--muted);
  --chart-track: var(--surface-muted);
  --chart-series-1: #f59a1b;
  --chart-series-2: #4fb6d8;
  --chart-series-3: #e6a0c7;
  --chart-series-4: #cf4654;
  --chart-series-5: #f2b20f;
  --chart-series-6: #5d4751;
  --chart-series-7: #c69a68;
  --chart-series-rest: #8a5835;
  --graph-bg: var(--surface-muted);
  --graph-group-bg: color-mix(in srgb, var(--surface-soft) 62%, transparent);
  --graph-group-border: color-mix(in srgb, var(--line-strong) 64%, transparent);
  --terminal-bg: #182033;
  --terminal-fg: #dbeafe;
  --terminal-border: #aab7c7;
  --terminal-line-border: rgba(255, 255, 255, .06);
  --focus-ring: color-mix(in srgb, var(--accent) 42%, transparent);
  --shadow-card: none;
  --shadow-xs: 0 1px 2px color-mix(in srgb, var(--ink) 8%, transparent);
  --surface-2: var(--surface-muted);
  --border: var(--border-soft);
  --line-soft: color-mix(in srgb, var(--border-soft) 72%, transparent);
  --text: var(--text-primary);
  --text-muted: var(--text-secondary);
  --success: var(--green);
  --warning: var(--orange);
  --warning-ink: var(--button-primary-fg);
  --report-print-ink: #111827;
  --report-print-surface: #ffffff;
  --info: var(--accent);
  --red: var(--danger);
  --status-bad-fg: var(--status-danger-fg);
  --status-info-bg: var(--accent-soft);
  --status-info-fg: var(--accent-ink);
  --status-info-border: color-mix(in srgb, var(--accent) 52%, var(--line));
  --accent-border: color-mix(in srgb, var(--accent) 58%, var(--line));
  --radius-sm: 5px;
  --radius: 6px;
  --radius-card: 8px;
  --radius-panel: 8px;
  --workspace-end-space: 28px;
  --font-sans: "Inter Variable", Inter, "Segoe UI Variable", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-display: var(--font-sans);
  --font-mono: "IBM Plex Mono", "SFMono-Regular", Consolas, "Liberation Mono", monospace;
  --heading-weight: 680;
  --heading-tracking: -0.014em;
  --type-body: 13px;
  --type-caption: 11px;
  --type-label: 11px;
  --type-h1: 22px;
  --type-h2: 18px;
  --type-h3: 15px;
  --type-h4: 13px;
  font-family: var(--font-sans);
}

.saml-connected-apps-prompt {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 14px 18px;
  border-bottom: 1px solid var(--line);
  background: color-mix(in srgb, var(--accent) 8%, var(--surface));
  color: var(--text);
}

.saml-connected-apps-prompt strong,
.saml-connected-apps-prompt span { display: block; }
.saml-connected-apps-prompt span { margin-top: 4px; color: var(--muted); line-height: 1.4; }
.saml-connected-apps-actions { display: flex; flex: 0 0 auto; gap: 8px; }

@media (max-width: 720px) {
  .saml-connected-apps-prompt {
    position: fixed;
    z-index: 70;
    right: 12px;
    bottom: 12px;
    left: 12px;
    align-items: stretch;
    flex-direction: column;
    border: 1px solid var(--line);
    border-radius: 12px;
    box-shadow: var(--shadow-strong);
  }
  .saml-connected-apps-actions { flex-wrap: wrap; }
}

.eoc-registration-gate-backdrop {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: grid;
  place-items: center;
  padding: 24px;
  background: var(--modal-scrim);
}
.eoc-registration-gate {
  width: min(760px, 100%);
  max-height: min(92vh, 900px);
  overflow: auto;
  padding: 22px;
  border: 1px solid var(--border-strong);
  border-radius: 14px;
  background: var(--surface-raised);
  box-shadow: var(--modal-shadow);
}
.eoc-registration-gate > h2 { margin: 0 0 4px; }
.eoc-registration-gate > .helper { margin: 0 0 14px; }
.eoc-registration-gate .operation-drawer { padding: 0; border: 0; background: transparent; box-shadow: none; }
.eoc-registration-required-section,
.eoc-registration-optional-section { margin-top: 14px; padding: 14px; border: 1px solid var(--border-soft); border-radius: 10px; background: var(--surface-soft); }
.eoc-registration-required-section h5,
.eoc-registration-optional-section h5 { margin: 0 0 6px; }
.eoc-registration-optional-section .helper { margin: 8px 0 0; }
@media (max-width: 720px) {
  .eoc-registration-gate-backdrop { align-items: end; padding: 10px; }
  .eoc-registration-gate { max-height: 94dvh; padding: 16px; border-radius: 14px 14px 8px 8px; }
}

[data-theme="dark"] {
  color-scheme: dark;
  --ink: #edf3fb;
  --muted: #adb9c9;
  --soft: #1b2739;
  --panel: rgba(30, 42, 60, 0.96);
  --line: #3a4a60;
  --line-strong: #586a83;
  --bg: #151f2e;
  --surface: #1a2638;
  --surface-raised: #223149;
  --surface-soft: #1a2638;
  --surface-muted: #2a3a53;
  --surface-selected: #2d4363;
  --titlebar: #2a3a53;
  --titlebar-strong: #31445f;
  --chip-muted: #31445f;
  --field: #182335;
  --placeholder: #7f8fa4;
  --nav: #1a2638;
  --nav-2: #1d2a3f;
  --rail-bg: #0b1220;
  --rail-ink: #edf3fb;
  --rail-muted: #aebbd0;
  --rail-border: #1f2d43;
  --rail-hover-bg: rgba(255, 255, 255, 0.08);
  --rail-active-bg: rgba(155, 189, 242, 0.18);
  --rail-icon-bg: rgba(155, 189, 242, 0.16);
  --rail-icon-ink: #ecf4ff;
  --rail-profile-bg: rgba(255, 255, 255, 0.10);
  --rail-profile-border: rgba(255, 255, 255, 0.20);
  --topbar-bg: #182437;
  --topbar-ink: #edf3fb;
  --topbar-muted: #aebbd0;
  --topbar-border: #2f4058;
  --topbar-control-bg: rgba(255, 255, 255, 0.08);
  --topbar-control-border: rgba(255, 255, 255, 0.14);
  --topbar-control-hover-bg: rgba(255, 255, 255, 0.12);
  --topbar-active-bg: rgba(155, 189, 242, 0.18);
  --topbar-active-border: rgba(155, 189, 242, 0.42);
  --accent: #9bbdf2;
  --accent-ink: #ecf4ff;
  --accent-soft: #203754;
  --green: #9bd3ad;
  --green-soft: #193827;
  --orange: #e3bd79;
  --orange-soft: #3d2e1c;
  --purple: #c3b4f2;
  --purple-soft: #2d2746;
  --danger: #f0a19a;
  --danger-soft: #432326;
  --ok: #88c9a0;
  --shadow: 0 14px 30px rgba(0, 0, 0, 0.34);
  --shadow-strong: 0 18px 42px rgba(0, 0, 0, 0.44);
  --modal-scrim: rgba(2, 6, 23, 0.68);
  --modal-shadow: 0 30px 80px rgba(0, 0, 0, 0.56), 0 10px 28px rgba(0, 0, 0, 0.38);
  --button-primary-bg: var(--accent);
  --button-primary-fg: #102033;
  --button-primary-hover-bg: color-mix(in srgb, var(--accent) 84%, #ffffff);
}

[data-theme="graphite-mist"] {
  color-scheme: light;
  --ink: #24313a;
  --muted: #6a7780;
  --soft: #eef3f2;
  --panel: rgba(253, 254, 253, 0.94);
  --line: #d2dcda;
  --line-strong: #aebfbb;
  --bg: #eef3f2;
  --surface: #fbfdfc;
  --surface-raised: #ffffff;
  --surface-soft: #f4f8f7;
  --surface-muted: #eaf1ef;
  --surface-selected: #e5f3f0;
  --titlebar: #e8efed;
  --titlebar-strong: #dce7e4;
  --chip-muted: #dde9e6;
  --field: #ffffff;
  --placeholder: #a6b3b0;
  --nav: #dde8e6;
  --nav-2: #edf3f1;
  --rail-bg: #182226;
  --rail-ink: #f3f8f7;
  --rail-muted: #bfd0cc;
  --rail-border: #2a3d42;
  --rail-hover-bg: rgba(255, 255, 255, 0.08);
  --rail-active-bg: rgba(155, 207, 196, 0.18);
  --rail-icon-bg: rgba(155, 207, 196, 0.16);
  --rail-icon-ink: #e8fbf8;
  --rail-profile-bg: rgba(255, 255, 255, 0.10);
  --rail-profile-border: rgba(255, 255, 255, 0.20);
  --topbar-bg: #edf4f2;
  --topbar-ink: #24313a;
  --topbar-muted: #66766f;
  --topbar-border: #b8c9c5;
  --topbar-control-bg: rgba(255, 255, 255, 0.68);
  --topbar-control-border: #cfddda;
  --topbar-control-hover-bg: #ffffff;
  --topbar-active-bg: #e3f4f1;
  --topbar-active-border: #a8d8cf;
  --accent: #9bcfc4;
  --accent-ink: #205c55;
  --accent-soft: #e3f4f1;
  --green: #609a79;
  --green-soft: #e8f5ed;
  --orange: #a97c3c;
  --orange-soft: #fff3dc;
  --purple: #7d72aa;
  --purple-soft: #eeebfb;
  --danger: #b7625a;
  --danger-soft: #fff0ee;
  --ok: #609a79;
  --shadow: 0 14px 30px rgba(42, 60, 66, 0.11);
  --shadow-strong: 0 16px 34px rgba(42, 60, 66, 0.18);
}

[data-theme="nordic-slate"] {
  color-scheme: light;
  --ink: #162033;
  --muted: #526075;
  --soft: #f4f6f9;
  --panel: rgba(255, 255, 255, 0.98);
  --line: #e1e7ef;
  --line-strong: #c8d2df;
  --bg: #f4f6f9;
  --surface: #ffffff;
  --surface-raised: #ffffff;
  --surface-soft: #fafbfc;
  --surface-muted: #f1f4f8;
  --surface-selected: #e9f2ff;
  --titlebar: #f3f6fa;
  --titlebar-strong: #eaf0f6;
  --chip-muted: #edf2f7;
  --field: #ffffff;
  --placeholder: #718096;
  --nav: #eaf0f6;
  --nav-2: #fbfcfe;
  --rail-bg: #fbfcfe;
  --rail-ink: #1f2a3d;
  --rail-muted: #607087;
  --rail-border: #e0e6ee;
  --rail-hover-bg: #f1f4f8;
  --rail-active-bg: #e9f2ff;
  --rail-icon-bg: #f1f4f8;
  --rail-icon-ink: #526075;
  --rail-active-icon-bg: #dceaff;
  --rail-active-icon-ink: #1f5b9c;
  --rail-profile-bg: #f7f9fc;
  --rail-profile-border: #dfe6ef;
  --auth-brand-bg: #101828;
  --auth-brand-ink: #f8fafc;
  --auth-brand-muted: #c5ceda;
  --topbar-bg: #fbfcfe;
  --topbar-ink: #162033;
  --topbar-muted: #607087;
  --topbar-border: #dfe6ef;
  --topbar-control-bg: rgba(255, 255, 255, 0.82);
  --topbar-control-border: #d9e1ec;
  --topbar-control-hover-bg: #ffffff;
  --topbar-active-bg: #e9f2ff;
  --topbar-active-border: #8db2e8;
  --accent: #5f95dc;
  --accent-ink: #1f5b9c;
  --accent-soft: #e9f2ff;
  --green: #15803d;
  --green-soft: #eaf7ef;
  --orange: #a85a09;
  --orange-soft: #fff3e0;
  --purple: #6d4fc2;
  --purple-soft: #f1edff;
  --cyan: #0e7490;
  --cyan-soft: #e8f8fb;
  --teal: #0f766e;
  --teal-soft: #e8f7f4;
  --violet: var(--purple);
  --violet-soft: var(--purple-soft);
  --danger: #b42318;
  --danger-soft: #fff0ee;
  --ok: #15803d;
  --chart-primary: #3b82f6;
  --chart-primary-soft: #dbeafe;
  --chart-grid: #e2e8f0;
  --chart-target: #64748b;
  --chart-track: #eef2f6;
  --chart-series-1: #2563eb;
  --chart-series-2: #60a5fa;
  --chart-series-3: #0891b2;
  --chart-series-4: #0f766e;
  --chart-series-5: #7c3aed;
  --chart-series-6: #a78bfa;
  --chart-series-7: #64748b;
  --chart-series-rest: #cbd5e1;
  --project-stack-1: var(--chart-series-1);
  --project-stack-1-ink: #ffffff;
  --project-stack-2: var(--chart-series-2);
  --project-stack-2-ink: #102a56;
  --project-stack-3: var(--chart-series-3);
  --project-stack-3-ink: #ffffff;
  --project-stack-4: var(--chart-series-4);
  --project-stack-4-ink: #ffffff;
  --project-stack-5: var(--chart-series-5);
  --project-stack-5-ink: #ffffff;
  --project-stack-divider: rgba(255, 255, 255, 0.72);
  --shadow: 0 1px 2px rgba(16, 24, 40, 0.04), 0 8px 24px rgba(16, 24, 40, 0.05);
  --shadow-strong: 0 2px 5px rgba(16, 24, 40, 0.08), 0 18px 42px rgba(16, 24, 40, 0.13);
  --font-sans: "Inter Variable", Inter, "Segoe UI Variable", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-display: "Inter Tight", "Inter Variable", Inter, "Segoe UI Variable Display", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --heading-weight: 680;
  --heading-tracking: -0.014em;
  --type-h1: 22px;
  --type-h2: 18px;
  --type-h3: 15px;
  --type-h4: 13px;
}

[data-theme="sage-paper"] {
  color-scheme: light;
  --ink: #26342f;
  --muted: #69786f;
  --soft: #f3f6ef;
  --panel: rgba(255, 255, 251, 0.94);
  --line: #d8e1d0;
  --line-strong: #b8c6ad;
  --bg: #f3f6ef;
  --surface: #fffefa;
  --surface-raised: #fffefa;
  --surface-soft: #f8faf3;
  --surface-muted: #edf3e7;
  --surface-selected: #e9f4e7;
  --titlebar: #ecf2e7;
  --titlebar-strong: #e0ead9;
  --chip-muted: #e2eddc;
  --field: #fffefa;
  --placeholder: #aab5a5;
  --nav: #e3ecdd;
  --nav-2: #f2f6ee;
  --rail-bg: #1a261f;
  --rail-ink: #f5f8f2;
  --rail-muted: #c3d0bd;
  --rail-border: #2d402f;
  --rail-hover-bg: rgba(255, 255, 255, 0.08);
  --rail-active-bg: rgba(168, 208, 164, 0.18);
  --rail-icon-bg: rgba(168, 208, 164, 0.16);
  --rail-icon-ink: #effbea;
  --rail-profile-bg: rgba(255, 255, 255, 0.10);
  --rail-profile-border: rgba(255, 255, 255, 0.20);
  --topbar-bg: #f2f6ee;
  --topbar-ink: #26342f;
  --topbar-muted: #68776e;
  --topbar-border: #bccbad;
  --topbar-control-bg: rgba(255, 255, 251, 0.70);
  --topbar-control-border: #d4dfcb;
  --topbar-control-hover-bg: #fffefa;
  --topbar-active-bg: #e9f5e8;
  --topbar-active-border: #acd5a8;
  --accent: #a8d0a4;
  --accent-ink: #315f35;
  --accent-soft: #e9f5e8;
  --green: #659b69;
  --green-soft: #eaf6e8;
  --orange: #a77d3e;
  --orange-soft: #fff3de;
  --purple: #7e74aa;
  --purple-soft: #efecfb;
  --danger: #b4645b;
  --danger-soft: #fff1ee;
  --ok: #659b69;
  --shadow: 0 14px 30px rgba(65, 82, 55, 0.10);
  --shadow-strong: 0 16px 34px rgba(65, 82, 55, 0.17);
}

[data-theme="midnight-pastel"] {
  color-scheme: dark;
  --ink: #f2f6fb;
  --muted: #aebacc;
  --soft: #141f31;
  --panel: rgba(24, 38, 59, 0.97);
  --line: #2b3d56;
  --line-strong: #435773;
  --bg: #0e1727;
  --surface: #131f32;
  --surface-raised: #1a2940;
  --surface-soft: #142033;
  --surface-muted: #22334d;
  --surface-selected: #233f61;
  --titlebar: #1d2d45;
  --titlebar-strong: #263a56;
  --chip-muted: #293d59;
  --field: #101b2b;
  --placeholder: #8c9bb0;
  --nav: #121e30;
  --nav-2: #101b2c;
  --rail-bg: #080f1c;
  --rail-ink: #f2f6fb;
  --rail-muted: #aab8ca;
  --rail-border: #1c2a40;
  --rail-hover-bg: rgba(255, 255, 255, 0.08);
  --rail-active-bg: rgba(156, 207, 240, 0.18);
  --rail-icon-bg: rgba(156, 207, 240, 0.16);
  --rail-icon-ink: #eff9ff;
  --rail-profile-bg: rgba(255, 255, 255, 0.10);
  --rail-profile-border: rgba(255, 255, 255, 0.20);
  --topbar-bg: #101b2c;
  --topbar-ink: #f2f6fb;
  --topbar-muted: #aab8ca;
  --topbar-border: #263850;
  --topbar-control-bg: rgba(255, 255, 255, 0.08);
  --topbar-control-border: rgba(255, 255, 255, 0.14);
  --topbar-control-hover-bg: rgba(255, 255, 255, 0.12);
  --topbar-active-bg: rgba(115, 183, 234, 0.18);
  --topbar-active-border: rgba(115, 183, 234, 0.46);
  --accent: #73b7ea;
  --accent-ink: #dff4ff;
  --accent-soft: #1a3a59;
  --green: #83d1ad;
  --green-soft: #17372c;
  --orange: #e0b978;
  --orange-soft: #3a2e20;
  --purple: #bca9ef;
  --purple-soft: #2e2948;
  --cyan: #6fc5dd;
  --cyan-soft: #163846;
  --teal: #73cbbb;
  --teal-soft: #173a37;
  --violet: var(--purple);
  --violet-soft: var(--purple-soft);
  --danger: #efa19b;
  --danger-soft: #41252a;
  --ok: #83d1ad;
  --focus-star-selected: #f6c94c;
  --shadow: 0 1px 2px rgba(0, 0, 0, 0.28), 0 10px 28px rgba(0, 0, 0, 0.22);
  --shadow-strong: 0 3px 8px rgba(0, 0, 0, 0.34), 0 22px 52px rgba(0, 0, 0, 0.4);
  --button-primary-bg: #63a9df;
  --button-primary-fg: #081523;
  --button-primary-hover-bg: #83c4f1;
  --font-sans: "Inter Variable", Inter, "Segoe UI Variable", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-display: var(--font-sans);
  --heading-weight: 680;
  --heading-tracking: -0.014em;
  --type-h1: 22px;
  --type-h2: 18px;
  --type-h3: 15px;
  --type-h4: 13px;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  min-width: 320px;
  min-height: 100vh;
  color: var(--ink);
  background: var(--bg);
  font-family: var(--font-sans);
  font-size: var(--type-body);
  line-height: 1.45;
  letter-spacing: -.003em;
  font-synthesis: none;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  font-variant-numeric: tabular-nums lining-nums;
}

[data-theme="nordic-slate"] body {
  font-size: var(--type-body);
}

button, input, select, textarea { font: inherit; }

button {
  min-height: 32px;
  border: 1px solid var(--button-secondary-border);
  border-radius: 7px;
  background: var(--button-secondary-bg);
  color: var(--button-secondary-fg);
  padding: 0 10px;
  cursor: pointer;
  font-size: 12px;
  font-weight: 640;
  line-height: 1.2;
  letter-spacing: -.005em;
  transition: background-color 140ms ease, border-color 140ms ease, color 140ms ease, box-shadow 140ms ease, filter 100ms ease, transform 100ms ease;
}

button:hover:not(:disabled) {
  background: color-mix(in srgb, var(--accent) 28%, var(--surface-raised));
  border-color: var(--accent);
  color: var(--accent-ink);
}
button:disabled { cursor: not-allowed; opacity: .5; filter: saturate(.62); }
button[data-button-feedback="acknowledged"]:not(:disabled) {
  cursor: progress;
  filter: brightness(.82) saturate(.88);
  transform: translateY(2px) scale(.975);
  box-shadow: inset 0 3px 7px color-mix(in srgb, var(--ink) 32%, transparent), 0 0 0 2px color-mix(in srgb, var(--accent) 42%, transparent);
}
button [data-button-feedback-indicator] {
  display: inline-block;
  width: .78em;
  height: .78em;
  margin-inline-start: .5em;
  border: 2px solid currentColor;
  border-right-color: transparent;
  border-radius: 50%;
  vertical-align: -.08em;
  animation: button-feedback-spin 650ms linear infinite;
}
.action-progress-status {
  flex-basis: 100%;
  margin: 0;
  color: var(--muted);
  font-size: 11px;
  font-weight: 560;
  line-height: 1.35;
}
.sprint-form .action-progress-status {
  grid-column: 1 / -1;
}
.em-attention-item > .action-progress-status,
.em-kickoff-steps > li > .action-progress-status {
  grid-column: 2 / -1;
}
@keyframes button-feedback-spin {
  to { transform: rotate(360deg); }
}
@media (prefers-reduced-motion: reduce) {
  button [data-button-feedback-indicator] { animation: none; }
}
button.primary {
  background: var(--button-primary-bg);
  border-color: var(--button-primary-bg);
  color: var(--button-primary-fg);
}
button.primary:hover:not(:disabled),
button.primary:focus-visible:not(:disabled) {
  background: var(--button-primary-hover-bg);
  border-color: var(--button-primary-hover-bg);
  color: var(--button-primary-fg);
}
button.secondary,
.button-link.secondary {
  background: var(--button-secondary-bg);
  border-color: var(--button-secondary-border);
  color: var(--button-secondary-fg);
}
button.secondary:hover:not(:disabled),
button.secondary:focus-visible:not(:disabled),
.button-link.secondary:hover,
.button-link.secondary:focus-visible {
  background: color-mix(in srgb, var(--accent) 28%, var(--surface-raised));
  border-color: var(--accent);
  color: var(--accent-ink);
}
button.danger { background: var(--danger-soft); border-color: var(--status-danger-border); color: var(--danger); }
button.ghost { background: color-mix(in srgb, var(--surface-raised) 72%, transparent); color: var(--ink); border-color: var(--line); }
button.accent-action {
  background: var(--accent-soft);
  border-color: color-mix(in srgb, var(--accent) 72%, var(--line));
  color: var(--accent-ink);
  font-weight: 750;
}
button.accent-action:hover,
button.accent-action:focus-visible {
  background: color-mix(in srgb, var(--accent) 28%, var(--surface-raised));
  border-color: var(--accent);
  color: var(--accent-ink);
}
button.wide { width: 100%; margin-top: 14px; }

.button-link {
  display: inline-flex;
  min-height: 32px;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-raised);
  color: var(--ink);
  padding: 0 10px;
  font-size: 12px;
  font-weight: 640;
  line-height: 1.2;
  text-decoration: none;
}

.button-link.primary {
  background: var(--button-primary-bg);
  border-color: var(--button-primary-bg);
  color: var(--button-primary-fg);
}

input, select, textarea {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 7px;
  min-height: 33px;
  padding: 6px 9px;
  background: var(--field);
  color: var(--ink);
  font-size: 12.5px;
  line-height: 1.4;
  transition: background-color 140ms ease, border-color 140ms ease, box-shadow 140ms ease;
}

input::placeholder,
textarea::placeholder {
  color: var(--placeholder);
  font-weight: 400;
  opacity: 1;
}

textarea {
  resize: vertical;
  min-height: 74px;
}

label {
  display: grid;
  gap: 6px;
  color: var(--ink);
  font-size: 12px;
  font-weight: 650;
}

h1, h2, h3, h4, p { margin-top: 0; }
h1, h2, h3, h4 {
  font-family: var(--font-display);
  font-weight: var(--heading-weight);
  letter-spacing: var(--heading-tracking);
}
h1 { margin-bottom: 0; font-size: var(--type-h1); line-height: 1.2; }
h2 { margin-bottom: 0; font-size: var(--type-h2); line-height: 1.25; }
h3 { margin-bottom: 8px; font-size: var(--type-h3); line-height: 1.3; }
h4 { margin: 16px 0 8px; font-size: var(--type-h4); }
p { color: var(--muted); line-height: 1.45; }

:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
  box-shadow: 0 0 0 3px var(--focus-ring);
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
  }
}

.product-wordmark {
  display: inline-block;
  width: 3.95em;
  height: 1.95em;
  flex: 0 0 auto;
  line-height: 0;
  vertical-align: -.55em;
}

.product-wordmark img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: contain;
}

.product-wordmark-inverted {
  display: none !important;
}

.auth-brand-panel .product-wordmark-default,
[data-theme="dark"] .product-wordmark-default,
[data-theme="midnight-pastel"] .product-wordmark-default {
  display: none;
}

.auth-brand-panel .product-wordmark-inverted,
[data-theme="dark"] .product-wordmark-inverted,
[data-theme="midnight-pastel"] .product-wordmark-inverted {
  display: block !important;
}

[data-theme="dark"] .login-brand img {
  filter: none;
}

.login-screen {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 24px;
}

.login-panel {
  width: min(520px, 100%);
  background: var(--panel-bg);
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: var(--shadow);
  padding: 24px;
  display: grid;
  gap: 14px;
}

.login-panel .login-brand {
  margin-bottom: 10px;
}

.login-panel h1 .product-wordmark {
  width: 125px;
  height: 62px;
  vertical-align: 0;
}

.login-panel h1 { font-size: 25px; }

.login-brand {
  width: min(165px, 100%);
  aspect-ratio: 1352 / 614;
  max-height: 62px;
  display: grid;
  place-items: center start;
  overflow: visible;
}

.login-brand img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: left center;
  display: block;
}

.login-note {
  border: 1px solid var(--border-soft);
  background: var(--accent-soft);
  color: var(--accent-ink);
  border-radius: 8px;
  padding: 12px;
  font-size: 13px;
  line-height: 1.4;
}

.auth-screen {
  place-items: stretch;
  padding: 0;
  background: var(--panel-bg-subtle);
}

.auth-layout {
  min-height: 100vh;
  display: grid;
  grid-template-columns: minmax(390px, 45vw) minmax(420px, 1fr);
  background: var(--panel-bg);
}

.auth-brand-panel {
  position: relative;
  isolation: isolate;
  min-height: 100vh;
  height: 100vh;
  padding: 62px 64px 34px;
  display: grid;
  grid-template-rows: auto minmax(300px, 1fr) auto auto;
  gap: 34px;
  overflow: hidden;
  border-right: 1px solid var(--rail-border);
  background: var(--auth-brand-bg);
  color: var(--auth-brand-ink);
}

.auth-brand-panel::before {
  content: "";
  position: absolute;
  inset: 0;
  background: color-mix(in srgb, var(--auth-brand-bg) 92%, var(--accent-soft));
  pointer-events: none;
}

.auth-brand-panel > * {
  position: relative;
  z-index: 1;
}

.auth-brand-top {
  display: grid;
  gap: 46px;
  align-content: start;
}

.auth-logo {
  width: 60px;
  min-width: 60px;
  height: 14px;
  display: grid;
  place-items: center start;
  overflow: visible;
}

.auth-logo img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  object-position: left center;
  display: block;
}

.auth-logo strong {
  color: var(--panel-bg);
  font-size: 13px;
}

.auth-product {
  display: grid;
  gap: 9px;
}

.auth-product strong {
  color: var(--panel-bg);
  font-size: 60px;
  line-height: 1;
  font-weight: 650;
}

.auth-product > span {
  max-width: 420px;
  color: var(--auth-brand-muted);
  font-size: 14px;
}

.auth-workflow {
  width: min(106%, 740px);
  align-self: center;
  justify-self: center;
  border: 0;
  border-radius: 0;
  object-fit: contain;
  opacity: 1;
  filter: saturate(1.04) brightness(1.38) contrast(1.1);
  mix-blend-mode: lighten;
  box-shadow: none;
}

.auth-status-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  max-width: 560px;
  padding-top: 8px;
  color: var(--auth-brand-muted);
  font-size: 12px;
}

.auth-status-row strong {
  color: var(--auth-status-ok);
  font-size: 12px;
}

.auth-footer {
  display: grid;
  grid-template-columns: minmax(96px, 1fr) auto minmax(96px, 1fr);
  align-items: center;
  column-gap: 28px;
  min-width: 0;
}

.auth-footer .auth-logo {
  grid-column: 1;
  justify-self: start;
}

.auth-copyright {
  grid-column: 2;
  justify-self: center;
  margin: 0;
  color: var(--text-secondary);
  font-size: 12px;
  line-height: 14px;
  white-space: nowrap;
  transform: translateY(4px);
}

.auth-panel {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 48px;
  background: var(--panel-bg-subtle);
}

.auth-panel-inner {
  width: min(520px, 100%);
  display: grid;
  gap: 22px;
}

.auth-tabs {
  width: fit-content;
  display: inline-flex;
  gap: 4px;
  padding: 4px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel-bg-muted);
}

.auth-tabs span {
  min-width: 86px;
  min-height: 30px;
  display: grid;
  place-items: center;
  padding: 0 12px;
  border-radius: 6px;
  color: var(--text-secondary);
  font-size: 12px;
  font-weight: 750;
}

.auth-tabs span.active {
  background: var(--panel-bg);
  color: var(--ink);
  box-shadow: 0 1px 2px color-mix(in srgb, var(--rail-bg) 08%, transparent);
}

.auth-copy {
  display: grid;
  gap: 9px;
}

.auth-copy h1 {
  font-size: 32px;
  line-height: 1.12;
  letter-spacing: 0;
}

.auth-copy p:not(.eyebrow) {
  max-width: 500px;
  margin: 0;
  color: var(--text-secondary);
  font-size: 14px;
}

.auth-form {
  display: grid;
  gap: 14px;
}

.auth-form label {
  color: var(--text-primary);
  font-size: 13px;
}

.auth-form input,
.auth-form select {
  min-height: 46px;
  border-color: var(--border-soft);
  background: var(--panel-bg);
  font-size: 14px;
}

.auth-form input:focus,
.auth-form select:focus {
  outline: 2px solid color-mix(in srgb, var(--accent) 16%, transparent);
  border-color: var(--accent);
}

.auth-submit {
  width: 100%;
  min-height: 46px;
  margin-top: 6px;
  font-size: 14px;
  font-weight: 760;
}

.auth-submit.secondary {
  margin-top: 0;
  background: var(--panel-bg);
  color: var(--ink);
}

.sso-block {
  display: grid;
  gap: 10px;
}

.auth-divider {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 14px;
  color: var(--text-secondary);
  font-size: 12px;
}

.auth-divider::before,
.auth-divider::after {
  content: "";
  height: 1px;
  background: var(--border-soft);
}

.sso-button {
  min-height: 44px;
  display: grid;
  grid-template-columns: 26px minmax(0, 1fr) auto;
  align-items: center;
  gap: 11px;
  text-align: left;
  background: var(--panel-bg);
  color: var(--text-secondary);
  opacity: .76;
}

.sso-button:not(:disabled) {
  cursor: pointer;
  opacity: 1;
}

.sso-button.enterprise {
  border-color: var(--border-strong);
  color: var(--text-primary);
}

.sso-button em {
  padding: 2px 8px;
  border: 1px solid var(--border-soft);
  border-radius: 999px;
  color: var(--text-secondary);
  font-size: 11px;
  font-style: normal;
  white-space: nowrap;
}

.sso-icon {
  width: 24px;
  height: 24px;
  display: grid;
  place-items: center;
  border-radius: 6px;
  color: var(--accent-ink);
  font-size: 13px;
  font-weight: 800;
}

.sso-icon.microsoft {
  background: var(--status-danger-bg);
  color: var(--status-danger-fg);
}

.sso-icon.google {
  background: var(--panel-bg);
  border: 1px solid var(--border-soft);
  color: var(--link-fg);
}

.sso-icon.enterprise {
  background: var(--accent-soft);
  border: 1px solid var(--border-soft);
  color: var(--link-fg);
}

.auth-help {
  margin: 0;
  color: var(--text-secondary);
  font-size: 13px;
}

.auth-help a {
  color: var(--accent);
}

.app-shell {
  min-width: 0;
  min-height: 100vh;
  display: grid;
  grid-template-rows: 48px minmax(0, 1fr);
}

@media (max-width: 759px) {
  .app-shell { min-width: 0; }
}

.topbar {
  height: 48px;
  display: grid;
  grid-template-columns: minmax(122px, auto) minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  padding: 6px 12px;
  background: var(--nav-2);
  border-bottom: 1px solid var(--border-soft);
  position: sticky;
  top: 0;
  z-index: 10;
}

.topbar-left {
  display: flex;
  align-items: center;
  gap: 0;
  min-width: 0;
}

.product-home {
  min-width: 0;
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--topbar-ink);
  box-shadow: none;
  font-size: 20px;
  font-weight: 760;
  line-height: 1;
}

.product-home:hover {
  border-color: transparent;
  background: transparent;
  color: var(--topbar-ink);
}

.product-home .product-wordmark {
  width: 78px;
  height: 38px;
  vertical-align: 0;
}

.topbar-right {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  min-width: 0;
}

.message-envelope-button {
  position: relative;
  flex: 0 0 auto;
  width: 34px;
  height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 1px solid var(--topbar-control-border);
  border-radius: 999px;
  background: var(--topbar-control-bg);
  color: var(--topbar-ink);
  box-shadow: none;
}

.running-tasks-button {
  position: relative;
  flex: 0 0 auto;
  width: 44px;
  height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 1px solid var(--topbar-control-border);
  border-radius: 999px;
  background: var(--topbar-control-bg);
  color: var(--topbar-ink);
  box-shadow: none;
}

.running-tasks-button:hover,
.running-tasks-button:focus-visible,
.running-tasks-button[aria-expanded="true"] {
  border-color: var(--topbar-active-border);
  background: var(--topbar-control-hover-bg);
  color: var(--accent-ink);
}

.running-tasks-button.has-tasks {
  border-color: var(--topbar-active-border);
  background: var(--topbar-active-bg);
}

.running-tasks-button.has-attention {
  border-color: var(--status-warn-border);
  color: var(--warning);
}

.running-tasks-button svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.running-tasks-badge {
  position: absolute;
  top: -3px;
  right: -4px;
  min-width: 17px;
  height: 17px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 4px;
  border: 1px solid var(--surface);
  border-radius: 999px;
  background: var(--accent-ink);
  color: var(--surface);
  font-size: 9px;
  font-weight: 850;
  line-height: 1;
}

.running-tasks-button.has-attention .running-tasks-badge {
  background: var(--warning);
}

.message-envelope-button:hover,
.message-envelope-button:focus-visible {
  border-color: var(--topbar-active-border);
  background: var(--topbar-control-hover-bg);
  color: var(--accent-ink);
}

.message-envelope-button.has-unread {
  border-color: var(--topbar-active-border);
  background: var(--topbar-active-bg);
  color: var(--accent-ink);
}

.message-envelope-button svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.message-envelope-badge {
  position: absolute;
  top: -3px;
  right: -4px;
  min-width: 17px;
  height: 17px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 4px;
  border: 1px solid var(--surface);
  border-radius: 999px;
  background: var(--danger);
  color: var(--surface);
  font-size: 9px;
  font-weight: 850;
  line-height: 1;
}

.persona-strip {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  min-width: 0;
  overflow: auto hidden;
}

.showcase-mode-badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-height: 28px;
  padding: 0 9px;
  border: 1px solid color-mix(in srgb, var(--orange) 46%, var(--topbar-control-border));
  border-radius: 999px;
  background: color-mix(in srgb, var(--orange-soft) 70%, var(--topbar-control-bg));
  color: var(--topbar-ink);
  font-size: 10.5px;
  font-weight: 700;
  white-space: nowrap;
}

.showcase-mode-badge b {
  padding-left: 5px;
  border-left: 1px solid color-mix(in srgb, currentColor 20%, transparent);
  font-weight: 850;
}

.persona-strip > span {
  color: var(--muted);
  font-size: 11px;
  white-space: nowrap;
}

.persona-chip {
  min-height: 28px;
  font-size: 11px;
  color: var(--ink);
  background: color-mix(in srgb, var(--panel-bg) 54%, transparent);
  border-color: var(--border-soft);
  white-space: nowrap;
}

.persona-chip.active {
  background: var(--accent-soft);
  border-color: var(--accent);
  color: var(--accent-ink);
  box-shadow: inset 0 -2px 0 var(--accent);
}

.persona-strip.switching .persona-chip {
  cursor: progress;
}

.persona-strip.switching .persona-chip:not(.pending) {
  opacity: .58;
}

.persona-chip.pending {
  border-color: var(--accent);
  background: var(--accent-soft);
  color: var(--accent-ink);
  cursor: progress;
}

.permissions-topbar-button {
  min-height: 28px;
  margin-left: 2px;
  padding-inline: 10px;
  border-color: var(--topbar-control-border);
  background: var(--topbar-control-bg);
  color: var(--topbar-ink);
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap;
}

.permissions-topbar-button:hover,
.permissions-topbar-button:focus-visible {
  border-color: var(--topbar-active-border);
  background: var(--topbar-control-hover-bg);
  color: var(--accent-ink);
}

.topbar-access {
  flex: 0 0 auto;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 4px;
  margin-left: 4px;
  padding-left: 10px;
  border-left: 1px solid var(--topbar-control-border);
}

.topbar-access > span {
  color: var(--topbar-muted);
  font-size: 9px;
  font-weight: 750;
  letter-spacing: .04em;
  text-transform: uppercase;
  white-space: nowrap;
}

.logout-button { min-height: 32px; }

.workspace {
  height: calc(100vh - 48px);
  height: calc(100dvh - 48px);
  min-height: 0;
  display: grid;
  grid-template-columns: 72px minmax(196px, 230px) minmax(520px, 1fr) clamp(248px, 20vw, 306px);
  gap: 0;
  position: relative;
}

.workspace.assistant-collapsed {
  grid-template-columns: 72px minmax(196px, 230px) minmax(520px, 1fr);
}

.icon-rail {
  grid-column: 1;
  grid-row: 1;
  min-height: calc(100vh - 48px);
  background: var(--chip-bg);
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  gap: 8px;
  padding: 12px 8px 12px;
  border-right: 1px solid var(--border-soft);
  position: sticky;
  top: 48px;
  z-index: 6;
}

.rail-primary {
  display: grid;
  grid-auto-rows: min-content;
  gap: 8px;
  align-content: start;
  min-height: 0;
}

.rail-button {
  width: 56px;
  min-height: 58px;
  padding: 5px 3px;
  display: grid;
  place-items: center;
  gap: 5px;
  color: var(--ink);
  background: transparent;
  border-color: transparent;
}

.rail-button.active {
  background: color-mix(in srgb, var(--panel-bg) 66%, transparent);
  border-color: var(--border-soft);
  box-shadow: inset 3px 0 0 var(--accent);
}

.rail-button .rail-icon {
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  border-radius: 7px;
  background: var(--accent-soft);
  color: var(--accent-ink);
  position: relative;
}

.rail-button .rail-icon svg {
  width: 17px;
  height: 17px;
  display: block;
}

.rail-button small { font-size: 9px; font-weight: 750; line-height: 1.1; }

.rail-attention-badge {
  position: absolute;
  top: -6px;
  right: -8px;
  min-width: 17px;
  height: 17px;
  padding: 0 4px;
  border: 2px solid var(--chip-bg);
  border-radius: 999px;
  display: inline-grid;
  place-items: center;
  background: var(--warning);
  color: var(--warning-ink);
  font-size: 9px;
  font-weight: 850;
  line-height: 1;
  box-sizing: border-box;
}

.profile-menu {
  position: relative;
  justify-self: center;
  align-self: end;
  z-index: 8;
}

.profile-menu summary {
  width: 56px;
  min-height: 52px;
  display: grid;
  place-items: center;
  border: 1px solid var(--rail-profile-border);
  border-radius: 12px;
  background: var(--rail-profile-bg);
  color: var(--rail-ink);
  cursor: pointer;
  list-style: none;
}

.profile-menu summary::-webkit-details-marker { display: none; }

.profile-menu summary span {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: var(--rail-icon-bg);
  color: var(--rail-icon-ink);
  font-size: 12px;
  font-weight: 900;
}

.profile-popover {
  position: absolute;
  left: 64px;
  bottom: 0;
  width: 244px;
  display: grid;
  gap: 6px;
  padding: 8px;
  border: 1px solid var(--border-strong);
  border-radius: 8px;
  background: var(--panel-bg);
  box-shadow: var(--shadow-strong);
  color: var(--text-primary);
}

.profile-identity {
  display: grid;
  gap: 1px;
  padding: 4px 5px 7px;
  border-bottom: 1px solid var(--border-soft);
}

.profile-showcase-note {
  width: fit-content;
  margin-top: 5px;
  padding: 3px 6px;
  border: 1px solid color-mix(in srgb, var(--orange) 40%, var(--border-soft));
  border-radius: 999px;
  background: var(--orange-soft);
  color: var(--text-primary);
  font-size: 9.5px;
  font-weight: 800;
}

.showcase-readonly-control:disabled {
  opacity: .42;
}

.profile-popover strong {
  font-size: 12px;
  line-height: 1.25;
}

.profile-popover small {
  color: var(--text-secondary);
  overflow-wrap: anywhere;
  font-size: 10.5px;
  line-height: 1.25;
}

.profile-actions {
  display: grid;
  gap: 2px;
  padding-top: 5px;
  border-top: 1px solid var(--border-soft);
}

.profile-menu-item {
  width: 100%;
  min-height: 28px;
  justify-content: start;
  border-color: transparent;
  border-radius: 6px;
  background: transparent;
  color: var(--text-primary);
  padding: 0 8px;
  text-align: left;
  font-size: 11px;
  font-weight: 700;
}

.profile-menu-item:hover {
  border-color: var(--border-soft);
  background: var(--row-bg-hover);
}

.profile-menu-item.danger {
  color: var(--danger);
}

.profile-menu-item.danger:hover {
  border-color: color-mix(in srgb, var(--danger) 42%, var(--border-soft));
  background: var(--danger-soft);
}

.pane, .assistant-pane {
  background: var(--panel);
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

.pane { padding: 10px 12px; }

.portfolio.pane { padding: 10px 12px; }

.portfolio {
  grid-column: 2;
  grid-row: 1;
  height: calc(100vh - 48px);
  height: calc(100dvh - 48px);
  min-height: 0;
  max-height: calc(100vh - 48px);
  max-height: calc(100dvh - 48px);
  display: grid;
  grid-template-rows: auto auto auto auto minmax(0, 1fr);
  align-content: start;
  gap: 10px;
  border-right: 1px solid var(--line);
  background: var(--surface-soft);
  overflow: hidden;
  padding-bottom: calc(10px + var(--workspace-end-space));
  scroll-padding-bottom: var(--workspace-end-space);
  scrollbar-gutter: stable;
}

.portfolio > .project-rail-head { grid-row: 1; }
.portfolio > .project-search { grid-row: 2; }
.portfolio > .project-list { grid-row: 3; }
.portfolio > .rail-work-queue { grid-row: 4; }
.portfolio > .rail-assigned-work { grid-row: 5; }

.project-rail-head, .pane-title {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 8px;
}

.project-rail-head { margin-bottom: 0; align-items: center; }
.project-rail-head div { display: flex; gap: 8px; }
.project-rail-head button { width: 32px; padding: 0; }

.project-search span {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
}

.project-search {
  display: grid;
  padding: 6px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-raised);
}

.project-search input {
  background: var(--surface-soft);
}

.state-counts {
  display: grid;
  gap: 9px;
  padding: 6px 6px 2px;
}

.state-counts div {
  display: grid;
  grid-template-columns: 10px minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  color: var(--muted);
  font-size: 12px;
}

.state-counts div:first-child {
  grid-template-columns: minmax(0, 1fr) auto;
  padding-bottom: 8px;
}

.state-counts div:first-child i { display: none; }
.state-counts i { width: 7px; height: 7px; border-radius: 999px; background: var(--border-strong); }
.state-counts strong { color: var(--ink); }

.project-list, .queue-list, .activity-list {
  display: grid;
  gap: 6px;
  border: 0;
  border-radius: 0;
  overflow: auto;
  background: transparent;
  min-height: 0;
  align-content: start;
}

.portfolio .project-list {
  min-height: 48px;
  max-height: min(28vh, 220px);
  padding: 6px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-raised);
}

.rail-work-queue {
  display: grid;
  gap: 6px;
  align-self: start;
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid var(--line);
}

.rail-work-queue-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 0 2px;
}

.rail-work-queue-head h3 {
  margin: 0;
  color: var(--muted);
  font-size: 11px;
  font-weight: 850;
  letter-spacing: 0;
  text-transform: uppercase;
}

.rail-work-queue-head span {
  min-width: 20px;
  min-height: 18px;
  display: inline-grid;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
}

.rail-work-queue-list {
  display: grid;
  gap: 6px;
  align-content: start;
  max-height: min(26vh, 220px);
  overflow-y: auto;
  scrollbar-gutter: stable;
}

.rail-work-queue-row {
  width: 100%;
  min-height: 58px;
  align-self: start;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: start;
  gap: 3px 7px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-raised);
  color: var(--ink);
  text-align: left;
}

.rail-work-queue-row:hover {
  background: var(--surface-selected);
  border-color: var(--line-strong);
}

.rail-work-queue-row.focused {
  border-color: var(--accent);
  background: var(--surface-selected);
  box-shadow: inset 3px 0 0 var(--accent);
}

.rail-work-queue-row.focused .rail-work-queue-priority {
  border-color: var(--accent);
  background: var(--accent-soft);
  color: var(--accent-ink);
}

.rail-work-queue-row strong {
  min-width: 0;
  color: var(--ink);
  font-size: 12px;
  line-height: 1.28;
  overflow-wrap: anywhere;
}

.rail-work-queue-row small {
  grid-column: 2;
  color: var(--muted);
  font-size: 10px;
  font-weight: 700;
}

.rail-work-queue-priority {
  min-width: 46px;
  min-height: 17px;
  display: inline-grid;
  place-items: center;
  padding: 0 5px;
  border: 1px solid var(--line);
  border-radius: 5px;
  color: var(--muted);
  font-size: 9px;
  font-weight: 900;
  text-transform: uppercase;
}

.rail-work-queue-row.high .rail-work-queue-priority {
  border-color: var(--status-danger-border);
  background: var(--status-danger-bg);
  color: var(--status-danger-fg);
}

.rail-work-queue-row.medium .rail-work-queue-priority {
  border-color: var(--status-warn-border);
  background: var(--status-warn-bg);
  color: var(--status-warn-fg);
}

.rail-work-queue-row.low .rail-work-queue-priority {
  border-color: var(--status-info-border);
  background: var(--status-info-bg);
  color: var(--status-info-fg);
}

.rail-work-queue-empty {
  padding: 9px 8px;
  border: 1px dashed var(--line);
  border-radius: 7px;
  color: var(--muted);
  font-size: 12px;
}

.rail-assigned-work {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  gap: 6px;
  align-self: stretch;
  min-height: 0;
  overflow: hidden;
  margin-top: 8px;
  padding-top: 10px;
  border-top: 1px solid var(--line);
}

.rail-assigned-work-list {
  display: grid;
  gap: 5px;
  min-height: 0;
  max-height: none;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  padding-right: 2px;
  align-content: start;
  scrollbar-gutter: stable;
}

.rail-assigned-work-group {
  display: grid;
  gap: 5px;
}

.rail-assigned-work-group + .rail-assigned-work-group {
  margin-top: 6px;
  padding-top: 8px;
  border-top: 1px solid var(--line);
}

.rail-assigned-work-group-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  color: var(--muted);
  font-size: 10px;
  font-weight: 850;
  text-transform: uppercase;
}

.rail-assigned-work-group-head span {
  min-width: 20px;
  min-height: 20px;
  display: grid;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--surface-raised);
  color: var(--ink);
  font-size: 10px;
}

.rail-assigned-work-row {
  width: 100%;
  min-height: 56px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 2px 8px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-raised);
  color: var(--ink);
  text-align: left;
}

.rail-assigned-work-row.selected {
  border-color: var(--accent);
  background: var(--surface-selected);
  box-shadow: inset 3px 0 0 var(--accent);
}

.rail-assigned-work-row:hover {
  border-color: var(--line-strong);
  background: var(--surface-selected);
}

.rail-assigned-work-row strong {
  min-width: 0;
  color: var(--ink);
  font-size: 12px;
  line-height: 1.2;
}

.rail-assigned-work-row span {
  justify-self: end;
  max-width: 104px;
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.rail-assigned-work-row small {
  grid-column: 1;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.25;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.rail-assigned-work-row em {
  grid-column: 2;
  grid-row: 2;
  justify-self: end;
  align-self: start;
  color: var(--muted);
  font-size: 10px;
  font-style: normal;
  font-weight: 800;
}

.developer-workbench {
  display: grid;
  gap: 10px;
}

.work-thread-workbench {
  grid-template-columns: minmax(0, 1fr);
  align-items: start;
}

.work-thread-layout {
  display: grid;
  grid-template-columns: minmax(210px, 252px) minmax(0, 1fr);
  gap: 12px;
  align-items: start;
}

.work-thread-rail,
.work-thread-stage {
  min-width: 0;
}

.work-thread-rail {
  position: sticky;
  top: 164px;
  display: grid;
  gap: 12px;
  max-height: calc(100dvh - 186px);
  overflow: auto;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-raised);
}

.work-thread-rail-head h3 {
  margin: 2px 0 0;
  color: var(--ink);
  font-size: 15px;
}

.work-thread-group {
  display: grid;
  gap: 7px;
}

.work-thread-group-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 850;
  text-transform: uppercase;
}

.work-thread-group-head span {
  min-width: 20px;
  min-height: 20px;
  display: grid;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--surface-soft);
  color: var(--muted);
  font-size: 10px;
}

.work-thread-list {
  display: grid;
  gap: 7px;
}

.work-thread-row-shell,
.developer-focus-card-shell,
.developer-work-row-shell {
  position: relative;
  min-width: 0;
}

.work-thread-row {
  display: grid;
  grid-template-columns: 8px minmax(0, 1fr) auto;
  gap: 4px 8px;
  align-items: center;
  width: 100%;
  min-height: 76px;
  padding: 9px 40px 9px 9px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-soft);
  text-align: left;
}

.work-focus-toggle {
  display: inline-grid;
  place-items: center;
  width: 26px;
  min-width: 26px;
  height: 26px;
  min-height: 26px;
  padding: 0;
  border: 0;
  border-radius: 4px;
  background: transparent;
  color: var(--muted);
  box-shadow: none;
}

.work-focus-star {
  width: 15px;
  height: 15px;
  overflow: visible;
  fill: transparent;
  stroke: currentColor;
  stroke-linejoin: round;
  stroke-width: 1.7;
}

.work-focus-toggle:hover {
  background: transparent;
  color: var(--ink);
}

.work-focus-toggle:focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: 1px;
}

.work-focus-toggle.active {
  background: transparent;
  color: var(--focus-star-selected);
}

.work-focus-toggle.active .work-focus-star {
  fill: currentColor;
  stroke-width: 1.35;
}

.work-thread-focus-toggle {
  position: absolute;
  z-index: 1;
  top: 7px;
  right: 7px;
}

.work-thread-row.selected {
  border-color: var(--accent);
  background: var(--surface-selected);
  box-shadow: inset 3px 0 0 var(--accent);
}

.work-thread-row.warn {
  border-color: var(--status-warn-border);
}

.work-thread-row.ok {
  border-color: var(--status-ok-border);
}

.work-thread-marker {
  grid-row: 1 / span 4;
  width: 8px;
  height: 8px;
  border: 1px solid var(--line-strong);
  border-radius: 999px;
  background: var(--surface-muted);
}

.work-thread-row.active .work-thread-marker,
.work-thread-row.selected .work-thread-marker {
  border-color: var(--accent);
  background: var(--accent);
}

.work-thread-row.warn .work-thread-marker {
  border-color: var(--warning);
  background: var(--warning);
}

.work-thread-row.ok .work-thread-marker {
  border-color: var(--green);
  background: var(--green);
}

.work-thread-row strong {
  min-width: 0;
  color: var(--ink);
  font-size: 13px;
}

.work-thread-row small {
  grid-column: 2;
  min-width: 0;
  overflow: hidden;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.work-thread-row b {
  justify-self: end;
  padding: 2px 6px;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--muted);
  font-size: 10px;
  font-weight: 850;
}

.work-thread-row em {
  grid-column: 3;
  grid-row: 2;
  justify-self: end;
  color: var(--muted);
  font-size: 10px;
  font-style: normal;
  font-weight: 750;
}

.work-thread-stage {
  display: grid;
  gap: 10px;
}

.work-thread-tabs {
  display: flex;
  gap: 4px;
  padding: 4px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-raised);
}

.work-thread-tabs button {
  flex: 0 0 auto;
  min-height: 30px;
  border: 1px solid transparent;
  border-radius: 6px;
  padding: 0 14px;
  background: transparent;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.work-thread-tabs button.active {
  border-color: var(--accent);
  background: var(--accent-soft);
  color: var(--accent-ink);
}

.work-thread-panel {
  display: grid;
  gap: 10px;
  min-width: 0;
  container-type: inline-size;
}

.thread-domain-section {
  display: grid;
  gap: 10px;
  min-width: 0;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-raised);
}

.thread-domain-section > header h3,
.thread-domain-section > header p,
.thread-domain-section summary small {
  margin: 0;
}

.thread-domain-section > header {
  display: grid;
  gap: 3px;
}

.thread-domain-section > header h3 {
  color: var(--ink);
  font-size: 14px;
}

.thread-domain-section > header p:not(.eyebrow),
.thread-domain-section summary small {
  color: var(--muted);
  font-size: 11px;
  line-height: 1.4;
}

.thread-domain-section > summary {
  cursor: pointer;
}

.thread-domain-section > summary > span {
  display: grid;
  gap: 2px;
}

@media (max-width: 1040px) {
  .work-thread-layout {
    grid-template-columns: 1fr;
  }

  .work-thread-rail {
    position: static;
    max-height: none;
  }

  .work-thread-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.work-thread-panel.info {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: start;
}

.work-thread-panel.info .developer-story-brief {
  grid-column: 1 / -1;
}

.thread-artifacts-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, 340px);
  gap: 10px;
  align-items: start;
}

.thread-artifacts-main {
  display: grid;
  gap: 10px;
  min-width: 0;
}

.thread-artifact-registry {
  align-content: start;
}

.thread-artifacts-archive {
  display: grid;
  gap: 10px;
}

.thread-archive-summary dl {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 8px;
  margin: 10px 0 0;
}

.thread-archive-summary {
  display: grid;
  gap: 8px;
}

.thread-evidence-section {
  display: grid;
  gap: 8px;
  padding-top: 10px;
  border-top: 1px solid var(--line);
}

.thread-evidence-gate-map {
  border-top: 1px solid var(--line);
  padding-top: 2px;
}

.thread-evidence-gate-map > summary {
  min-height: 48px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  cursor: pointer;
  color: var(--ink);
}

.thread-evidence-gate-map > summary > span {
  display: grid;
  gap: 2px;
}

.thread-evidence-gate-map > summary .thread-evidence-gate-map-meta {
  display: flex;
  align-items: center;
  gap: 12px;
}

.thread-evidence-gate-map > summary strong {
  font-size: 12px;
}

.thread-evidence-gate-map > summary small,
.thread-evidence-gate-map > summary b {
  color: var(--muted);
  font-size: 11px;
}

.thread-evidence-gate-map[open] > summary {
  margin-bottom: 9px;
}

.thread-archive-summary dt {
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
}

.thread-archive-summary dd {
  margin: 2px 0 0;
  color: var(--ink);
  font-size: 12px;
  font-weight: 800;
}

.thread-archive-stage-list {
  display: grid;
  gap: 9px;
}

.thread-archive-stage {
  display: grid;
  gap: 8px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-raised);
}

.thread-archive-stage.done {
  border-color: var(--status-ok-border);
}

.thread-archive-stage.current {
  border-color: var(--status-warn-border);
}

.thread-archive-stage-head {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr) auto;
  gap: 8px;
  align-items: start;
}

.thread-archive-check {
  width: 20px;
  height: 20px;
  display: inline-grid;
  place-items: center;
  border: 1px solid var(--line-strong);
  border-radius: 999px;
  color: var(--surface);
  font-size: 12px;
  font-weight: 900;
  background: var(--surface-soft);
}

.thread-archive-check.done {
  border-color: var(--status-ok-border);
  background: var(--status-ok-fg);
}

.thread-archive-stage-head strong {
  color: var(--ink);
  font-size: 13px;
}

.thread-archive-stage-head p,
.thread-archive-stage-meta,
.thread-archive-missing small,
.thread-archive-artifact-row small {
  margin: 2px 0 0;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.35;
}

.thread-archive-stage-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.thread-archive-stage-meta span {
  padding: 2px 6px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--surface-soft);
  font-weight: 800;
}

.thread-archive-artifact-list {
  display: grid;
  gap: 6px;
}

.thread-archive-artifact-row,
.thread-archive-missing {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-soft);
  text-align: left;
}

.thread-archive-artifact-row strong,
.thread-archive-missing strong {
  display: block;
  min-width: 0;
  color: var(--ink);
  font-size: 12px;
}

.thread-archive-artifact-row b {
  color: var(--accent);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.thread-archive-artifact-meta {
  display: grid;
  justify-items: end;
  gap: 3px;
}

.thread-archive-artifact-meta time,
.thread-archive-artifact-meta small {
  color: var(--muted);
  font-size: 10px;
  font-weight: 750;
  line-height: 1.25;
  white-space: nowrap;
}

.thread-archive-missing button {
  justify-self: end;
  max-width: 190px;
  padding: 7px 10px;
  border-radius: 7px;
  border: 1px solid var(--accent-border);
  background: var(--accent-soft);
  color: var(--accent);
  font-size: 11px;
  font-weight: 900;
  line-height: 1.2;
  text-align: center;
}

.thread-archive-file-icon,
.thread-archive-missing span {
  width: 14px;
  height: 14px;
  border: 1px solid var(--line-strong);
  border-radius: 4px;
  background: var(--surface);
}

.thread-archive-file-icon {
  border-color: var(--status-ok-border);
  background: var(--status-ok-bg);
}

.work-thread-work-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(245px, 310px);
  gap: 10px;
  align-items: start;
}

.work-thread-lifecycle-strip {
  min-width: 0;
}

.functional-progress-strip {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(116px, 1fr);
  gap: 0;
  align-items: center;
  overflow: auto hidden;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-soft);
}

.compact-stage-progress .functional-progress-strip {
  display: flex;
  overflow: hidden;
}

.compact-stage-progress .functional-progress-stage {
  flex: 1 1 0;
  min-width: 0;
}

.compact-stage-progress .git-flow-arrow {
  flex: 0 0 22px;
  width: 22px;
}

.functional-progress-stage {
  min-width: 112px;
  display: grid;
  justify-items: center;
  gap: 5px;
  min-height: 72px;
  padding: 6px 4px;
  color: var(--muted);
  text-align: center;
}

.functional-progress-stage span {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 999px;
  border: 2px solid var(--line-strong);
  color: var(--muted);
  background: var(--surface-raised);
  font-size: 12px;
  font-weight: 900;
}

.functional-progress-stage.done span {
  color: var(--green);
  border-color: color-mix(in srgb, var(--green) 52%, var(--border-soft));
  background: var(--green-soft);
}

.functional-progress-stage.current {
  color: var(--accent-ink);
}

.functional-progress-stage.current span {
  color: var(--accent-ink);
  border-color: color-mix(in srgb, var(--accent) 58%, var(--border-soft));
  background: var(--accent-soft);
}

.functional-progress-stage strong {
  min-width: 0;
  max-width: 112px;
  font-size: 11px;
  line-height: 1.18;
}

.functional-progress-stage em {
  color: var(--muted);
  font-size: 9px;
  font-style: normal;
  font-weight: 900;
  text-transform: uppercase;
}

@media (max-width: 760px) {
  .compact-stage-progress .functional-progress-strip {
    overflow-x: auto;
  }

  .compact-stage-progress .functional-progress-stage {
    flex-basis: 112px;
    min-width: 112px;
  }
}

.architecture-agent-work-status,
.architecture-review-journal {
  display: grid;
  gap: 16px;
  padding: 18px;
  border: 1px solid var(--border);
  border-radius: 14px;
  background: var(--panel);
}

.architecture-review-journal {
  border-top: 3px solid var(--accent);
}

.architecture-agent-work-status {
  grid-template-columns: minmax(0, 1fr) minmax(260px, .65fr);
  align-items: start;
}

.architecture-agent-work-status h2,
.architecture-review-journal h2 {
  margin: 3px 0 6px;
}

.architecture-agent-work-status p,
.architecture-review-journal p {
  margin: 0;
}

.architecture-agent-work-status dl {
  display: grid;
  gap: 8px;
  margin: 0;
}

.architecture-agent-work-status dl > div {
  display: grid;
  grid-template-columns: minmax(110px, .7fr) minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  min-height: 34px;
  padding: 6px 10px;
  border-radius: 8px;
  background: var(--surface-muted);
}

.architecture-agent-work-status dt {
  color: var(--text-secondary);
  font-size: 12px;
  font-weight: 700;
}

.architecture-agent-work-status dd {
  min-width: 0;
  margin: 0;
  overflow-wrap: anywhere;
}

.architecture-review-comments {
  display: grid;
  gap: 10px;
}

.architecture-review-comment {
  display: grid;
  gap: 8px;
  padding: 14px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--surface-muted);
}

.architecture-review-comment header {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 12px;
  align-items: baseline;
}

.architecture-review-comment header span,
.architecture-review-comment header time {
  color: var(--text-secondary);
  font-size: 12px;
}

.architecture-review-comment > p {
  white-space: pre-wrap;
}

.architecture-review-journal > label {
  display: grid;
  gap: 7px;
  font-weight: 700;
}

.architecture-review-journal textarea {
  min-height: 110px;
  resize: vertical;
  font-weight: 400;
}

.architecture-review-journal textarea[readonly] {
  background: var(--surface-muted);
  color: var(--text-secondary);
}

.architecture-review-decisions {
  display: grid;
  gap: 10px;
  padding-top: 14px;
  border-top: 1px solid var(--border);
}

.architecture-sources-card {
  display: grid;
  gap: 12px;
}

.architecture-source-head-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  justify-content: flex-end;
}

.architecture-source-list {
  display: grid;
  gap: 7px;
}

.architecture-source-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-radius: 9px;
  background: var(--surface-muted);
}

.architecture-source-row > div {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.architecture-source-row strong,
.architecture-source-row span {
  overflow-wrap: anywhere;
}

.architecture-source-row span,
.architecture-source-empty,
.architecture-sources-card .helper {
  margin: 0;
  color: var(--text-secondary);
  font-size: 12px;
}

.architecture-source-backdrop {
  position: fixed;
  z-index: 1300;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 24px;
  background: var(--modal-scrim);
}

.architecture-source-lightbox {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  width: min(860px, 100%);
  max-height: min(820px, calc(100vh - 48px));
  max-height: min(820px, calc(100dvh - 48px));
  overflow: hidden;
  border: 1px solid var(--line-strong);
  border-radius: 16px;
  background: var(--panel);
  box-shadow: var(--modal-shadow);
}

.architecture-source-lightbox > header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 16px;
  align-items: start;
  padding: 18px 20px;
  border-bottom: 1px solid var(--border);
}

.architecture-source-lightbox > header h2,
.architecture-source-lightbox > header p {
  margin: 0;
}

.architecture-source-lightbox > header h2 {
  margin-block: 3px 5px;
}

.architecture-source-editor {
  display: grid;
  gap: 8px;
  min-height: 0;
  overflow: auto;
  padding: 18px 20px;
}

.architecture-source-editor label {
  color: var(--text-primary);
  font-size: 12px;
  font-weight: 800;
}

.architecture-source-editor textarea {
  min-height: 240px;
  resize: vertical;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  line-height: 1.5;
}

.architecture-source-file,
.architecture-source-status,
.architecture-source-error {
  margin: 0;
  padding: 8px 10px;
  border-radius: 8px;
  font-size: 12px;
}

.architecture-source-file,
.architecture-source-status {
  color: var(--status-info-fg);
  background: var(--status-info-bg);
}

.architecture-source-error {
  color: var(--status-warning-fg);
  background: var(--status-warning-bg);
}

.architecture-source-lightbox > footer {
  padding: 14px 20px;
  border-top: 1px solid var(--border);
}

.architecture-workflow-actions {
  display: grid;
  gap: 12px;
}

.architecture-workflow-actions h2,
.architecture-workflow-actions p {
  margin: 0;
}

.architecture-operation-error {
  padding: 10px 12px;
  border: 1px solid var(--status-warning-border);
  border-radius: 9px;
  color: var(--status-warning-fg);
  background: var(--status-warning-bg);
}

.architecture-workflow-actions button,
.architecture-review-decisions button {
  min-height: 44px;
}

@media (max-width: 900px) {
  .architecture-agent-work-status {
    grid-template-columns: 1fr;
  }

  .architecture-source-backdrop {
    padding: 10px;
  }

  .architecture-source-lightbox {
    max-height: calc(100vh - 20px);
    max-height: calc(100dvh - 20px);
  }
}

/* Phase 2 report-only License Manager. Nordic Slate tokens remain authoritative. */
.license-manager { display: grid; gap: 18px; padding: clamp(18px, 3vw, 34px); max-width: 1440px; margin: 0 auto; }
.license-manager-hero { display: flex; justify-content: space-between; align-items: end; gap: 24px; }
.license-manager-hero h1 { margin: 4px 0 6px; font-size: clamp(1.7rem, 3vw, 2.45rem); letter-spacing: -.03em; }
.license-manager-hero p { max-width: 720px; margin: 0; color: var(--muted); }
.license-manager-actions { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.license-report-badge { display: inline-flex; min-height: 30px; align-items: center; padding: 4px 10px; border: 1px solid var(--status-info-border); border-radius: 999px; color: var(--status-info-fg); background: var(--status-info-bg); font-weight: 750; font-size: .78rem; text-transform: uppercase; letter-spacing: .06em; }
.license-tabs { display: flex; gap: 4px; padding: 4px; width: fit-content; max-width: 100%; overflow-x: auto; border: 1px solid var(--line); border-radius: 12px; background: var(--surface-raised); }
.license-tabs button { border: 0; background: transparent; min-height: 40px; white-space: nowrap; }
.license-tabs button[aria-selected="true"] { background: var(--accent-soft); color: var(--accent-ink); box-shadow: inset 0 0 0 1px var(--accent-border); }
.license-live-region:empty { display: none; }
.license-overview-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.license-card { min-width: 0; padding: clamp(16px, 2.5vw, 24px); border: 1px solid var(--line); border-radius: 16px; background: var(--surface-raised); box-shadow: var(--shadow-soft); }
.license-card h2 { margin: 0 0 12px; font-size: 1.08rem; }
.license-card p { color: var(--muted); }
.license-status-card { border-left: 4px solid var(--line); }
.license-status-card.ok { border-left-color: var(--success); }
.license-status-card.warn { border-left-color: var(--warning); }
.license-status-card.danger { border-left-color: var(--danger); }
.license-status-card > span, .commercial-health-card header span:first-child { color: var(--muted); text-transform: uppercase; font-weight: 750; font-size: .72rem; letter-spacing: .08em; }
.license-status-card h2 { margin: 5px 0 8px; font-size: 1.55rem; }
.license-card dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin: 18px 0 0; }
.license-card dl div { display: grid; gap: 4px; }
.license-card dt, .license-metric span { color: var(--muted); font-size: .78rem; }
.license-card dd { margin: 0; font-weight: 700; overflow-wrap: anywhere; }
.license-technical-details { margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--line); }
.license-technical-details summary { width: fit-content; color: var(--accent-ink); font-weight: 750; cursor: pointer; }
.license-technical-details > p { margin: 10px 0 0; font-size: .82rem; }
.license-technical-id { display: flex; align-items: end; gap: 10px; margin-top: 14px; }
.license-technical-id > div { display: grid; flex: 1; min-width: 0; gap: 5px; }
.license-technical-id span { color: var(--muted); font-size: .78rem; }
.license-technical-id code { padding: 9px 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); overflow-wrap: anywhere; user-select: all; }
.license-seat-summary { grid-column: 1 / -1; }
.license-metrics, .commercial-health-facts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.license-metric { display: grid; gap: 4px; min-width: 0; padding: 14px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); }
.license-metric strong { font-size: 1.15rem; overflow-wrap: anywhere; }
.license-metric small { color: var(--muted); }
.license-section-head { display: flex; justify-content: space-between; align-items: end; gap: 18px; margin-bottom: 18px; }
.license-section-head p { margin: 4px 0 0; }
.license-filter-row { display: flex; align-items: end; gap: 8px; flex-wrap: wrap; }
.license-filter-row label, .license-request-grid form > label { display: grid; gap: 5px; color: var(--muted); font-size: .8rem; font-weight: 650; }
.license-filter-row input, .license-filter-row select { min-height: 42px; }
.license-table-wrap { max-width: 100%; overflow-x: auto; }
.license-table-wrap table { width: 100%; min-width: 680px; border-collapse: collapse; }
.license-table-wrap th { color: var(--muted); font-size: .76rem; text-transform: uppercase; letter-spacing: .05em; text-align: left; }
.license-table-wrap th, .license-table-wrap td { padding: 12px 10px; border-bottom: 1px solid var(--line); }
.license-table-wrap td:first-child { display: grid; gap: 3px; }
.license-table-wrap td small { color: var(--muted); }
.license-status-text { display: inline-flex; width: fit-content; padding: 4px 8px; border-radius: 999px; font-size: .78rem; font-weight: 750; border: 1px solid var(--line); }
.license-status-text.ok { color: var(--status-ok-fg); background: var(--status-ok-bg); border-color: var(--status-ok-border); }
.license-status-text.neutral { color: var(--muted); background: var(--surface); }
.license-empty { padding: 32px 16px; text-align: center; color: var(--muted); }
.license-notice { padding: 14px; border: 1px solid var(--line); border-radius: 12px; }
.license-overview-grid > .license-notice { grid-column: 1 / -1; }
.license-notice.danger { color: var(--status-danger-fg); background: var(--status-danger-bg); border-color: var(--status-danger-border); }
.license-notice.warn { color: var(--status-warn-fg); background: var(--status-warn-bg); border-color: var(--status-warn-border); margin-bottom: 14px; }
.license-notice p { margin: 5px 0 10px; color: inherit; }
.license-load-more { display: block; min-height: 44px; margin: 16px auto 0; }
.license-history-list { display: grid; gap: 0; padding: 0; margin: 0; list-style: none; }
.license-history-list li { display: grid; grid-template-columns: 18px 1fr; gap: 12px; padding: 14px 0; border-bottom: 1px solid var(--line); }
.license-history-mark { width: 10px; height: 10px; margin-top: 5px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 0 4px var(--accent-soft); }
.license-history-list p { margin: 3px 0; }
.license-history-list small { color: var(--muted); }
.license-request-grid { display: grid; grid-template-columns: minmax(280px, .8fr) minmax(360px, 1.2fr); gap: 16px; align-items: start; }
.license-request-grid form { display: grid; gap: 14px; }
.license-request-grid textarea { resize: vertical; }
.license-request-list { display: grid; gap: 8px; }
.license-request-list article { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px; border: 1px solid var(--line); border-radius: 10px; }
.license-request-list article div { display: grid; gap: 3px; }
.license-request-list small { color: var(--muted); }
.commercial-health-card { border-left: 4px solid var(--line); }
.commercial-health-card.ok { border-left-color: var(--success); }
.commercial-health-card.warn { border-left-color: var(--warning); }
.commercial-health-card.danger { border-left-color: var(--danger); }
.commercial-health-card header { display: flex; justify-content: space-between; align-items: start; gap: 12px; margin-bottom: 16px; }
.commercial-health-card h2 { margin: 4px 0 0; }
.commercial-health-card .button { display: inline-flex; margin-top: 14px; }

@media (max-width: 900px) {
  .license-manager-hero, .license-section-head { align-items: stretch; flex-direction: column; }
  .license-overview-grid, .license-request-grid { grid-template-columns: 1fr; }
  .license-seat-summary { grid-column: auto; }
  .license-metrics, .commercial-health-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 600px) {
  .license-manager { padding: 14px; }
  .license-manager-actions, .license-manager-actions button { width: 100%; }
  .license-manager-actions button, .license-tabs button, .license-filter-row button, .license-load-more, .license-request-grid button { min-height: 44px; }
  .license-card dl, .license-metrics, .commercial-health-facts { grid-template-columns: 1fr; }
  .license-technical-id { align-items: stretch; flex-direction: column; }
  .license-filter-row, .license-filter-row label, .license-filter-row input, .license-filter-row select, .license-filter-row button { width: 100%; }
  .commercial-health-card:not(.nfr-health-card) .license-metric:nth-child(n+4) { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .license-manager *, .commercial-health-card * { scroll-behavior: auto !important; transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; }
}

.work-thread-context-panels {
  display: grid;
  grid-template-columns: minmax(230px, .7fr) minmax(0, 1.3fr);
  gap: 10px;
  align-items: start;
}

.plan-steps-strip {
  display: grid;
  gap: 8px;
  margin-bottom: 10px;
  padding: 10px 12px;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  background: var(--surface-raised);
}

.plan-steps-strip-head {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 12px;
}

.plan-steps-strip-head h3,
.plan-steps-strip-head p,
.plan-steps-strip .helper {
  margin: 0;
}

.plan-steps-track {
  display: grid;
  grid-template-columns: repeat(var(--plan-step-columns, 4), minmax(150px, 1fr));
  gap: 6px;
}

.plan-step-chip {
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr);
  grid-template-areas: "number title" "number status";
  column-gap: 7px;
  align-items: center;
  min-width: 0;
  padding: 7px 8px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-soft);
}

.plan-step-chip.current {
  border-color: var(--accent);
  background: var(--panel-bg-subtle);
}

.plan-step-chip > span {
  grid-area: number;
  display: inline-grid;
  place-items: center;
  width: 24px;
  height: 24px;
  border: 1px solid var(--line-strong);
  border-radius: 50%;
  color: var(--text-secondary);
  font-size: 11px;
  font-weight: 850;
}

.plan-step-chip.completed > span {
  border-color: var(--ok);
  color: var(--ok);
}

.plan-step-chip > strong {
  grid-area: title;
  overflow: hidden;
  color: var(--ink);
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.plan-step-chip > small {
  grid-area: status;
  color: var(--muted);
  font-size: 9px;
  font-weight: 800;
  text-transform: uppercase;
}

.plan-step-selected-panel {
  display: grid;
  gap: 6px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-soft);
}

.plan-step-selected-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.plan-step-selected-head strong {
  color: var(--ink);
  font-size: 11px;
}

.plan-step-selected-head span {
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
}

.plan-step-current-detail {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 6px;
}

.plan-step-current-detail > span {
  display: grid;
  gap: 2px;
  min-width: 0;
  padding: 6px 8px;
  border-left: 2px solid var(--line-strong);
  color: var(--text-secondary);
  font-size: 10px;
  line-height: 1.3;
}

.plan-step-current-detail b {
  color: var(--muted);
  font-size: 9px;
  text-transform: uppercase;
}

.developer-work-jigsaw-grid {
  --developer-compact-panel-height: 236px;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-areas:
    "left"
    "process";
  gap: 10px;
  align-items: start;
}

.developer-work-jigsaw-left {
  grid-area: left;
  min-width: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-template-rows: minmax(var(--developer-compact-panel-height), auto) auto auto;
  grid-template-areas:
    "mode evidence"
    "agent agent"
    "action action";
  gap: 10px;
  align-items: start;
}

.developer-work-jigsaw-left.has-routing {
  grid-template-rows: minmax(var(--developer-compact-panel-height), auto) auto auto auto;
  grid-template-areas:
    "mode evidence"
    "routing routing"
    "agent agent"
    "action action";
}

.developer-work-jigsaw-grid > * {
  min-width: 0;
  display: grid;
}

.developer-work-jigsaw-grid > * > .developer-process-panel,
.developer-work-jigsaw-grid > * > .developer-side-card {
  height: 100%;
}

.developer-work-mode-cell {
  grid-area: mode;
  align-self: start;
}

.developer-next-evidence-cell {
  grid-area: evidence;
  align-self: start;
}

.developer-process-cell {
  grid-area: process;
  min-width: 0;
  display: grid;
}

.developer-process-disclosure {
  margin-bottom: calc(56px + env(safe-area-inset-bottom, 0px));
  padding: 10px 12px;
  background: var(--surface-soft);
}

.developer-process-disclosure[open] {
  background: var(--surface-raised);
}

.developer-process-disclosure-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding-right: 94px;
  list-style: none;
}

.developer-process-disclosure-summary::-webkit-details-marker {
  display: none;
}

.developer-process-disclosure-summary > span:first-child {
  display: grid;
  gap: 2px;
}

.developer-process-disclosure-summary strong {
  color: var(--ink);
  font-size: 12px;
}

.developer-process-disclosure-summary small {
  color: var(--muted);
  font-size: 10.5px;
  line-height: 1.35;
}

.developer-process-disclosure-meta {
  display: flex;
  align-items: center;
  gap: 10px;
}

.developer-process-disclosure-meta .chevron-caret {
  margin-right: 3px;
}

.developer-process-disclosure-body {
  padding-top: 10px;
}

.developer-mode-action-cell {
  grid-area: action;
  align-self: start;
}

.developer-routing-cell {
  grid-area: routing;
  min-width: 0;
}

.developer-work-mode-cell > .work-mode-panel,
.developer-mode-action-cell > .mode-action-panel {
  height: auto;
  align-self: start;
}

.developer-work-mode-cell > .work-mode-panel,
.developer-next-evidence-cell > .next-evidence-panel {
  height: 100%;
  min-height: var(--developer-compact-panel-height);
  max-height: none;
  overflow: visible;
  align-self: start;
}

.developer-agent-activity-cell {
  grid-area: agent;
  min-width: 0;
  display: grid;
  align-self: start;
}

.developer-agent-activity-cell:empty {
  display: none;
}

.agent-work-summary {
  display: grid;
  gap: 7px;
  padding: 10px 12px;
  border-left: 3px solid var(--accent);
  background: var(--surface-raised);
}

.agent-work-summary.warn {
  border-left-color: var(--orange);
  background: var(--orange-soft);
}

.agent-work-summary.danger {
  border-left-color: var(--danger);
  background: var(--danger-soft);
}

.agent-work-summary.ok {
  border-left-color: var(--green);
  background: var(--green-soft);
}

.agent-work-summary p,
.agent-work-summary small {
  margin: 0;
  color: var(--text-secondary);
  font-size: 11px;
  line-height: 1.4;
}

.agent-work-summary small {
  font-weight: 750;
}

.agent-work-summary .drawer-actions {
  justify-content: flex-start;
  margin: 0;
}

@container (max-width: 980px) {
  .developer-work-jigsaw-grid {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas:
      "left"
      "process";
  }

  .developer-work-jigsaw-left {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }
}

@container (max-width: 560px) {
  .developer-work-jigsaw-grid {
    --developer-compact-panel-height: auto;
  }

  .developer-work-jigsaw-left {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto;
    grid-template-areas:
      "mode"
      "evidence"
      "agent"
      "action";
  }

  .developer-work-mode-cell > .work-mode-panel,
  .developer-next-evidence-cell > .next-evidence-panel {
    height: auto;
    min-height: 0;
    max-height: none;
  }

  .plan-step-current-detail {
    grid-template-columns: minmax(0, 1fr);
  }

  .plan-steps-track {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.developer-workbench-hero {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-raised);
}

.developer-workbench-hero h2 {
  margin: 2px 0 8px;
  color: var(--ink);
  font-size: 18px;
  line-height: 1.2;
}

.developer-workbench-hero p:not(.eyebrow) {
  max-width: 820px;
  margin: -2px 0 8px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.4;
}

.developer-workbench-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.developer-workbench-meta span {
  min-height: 22px;
  display: inline-flex;
  align-items: center;
  padding: 0 8px;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 750;
}

.developer-workbench-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(250px, 318px);
  gap: 10px;
  align-items: start;
}

.gate-command-center {
  display: grid;
  gap: 8px;
  padding: 9px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-raised);
}

.gate-command-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 0 2px 2px;
}

.gate-command-head h3 {
  margin: 2px 0 0;
  color: var(--ink);
  font-size: 14px;
}

.gate-command-head > .badge {
  justify-self: start;
}

.named-gate-panel p,
.gate-evidence {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
}

.gate-command-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.gate-command-grid.single {
  grid-template-columns: minmax(0, 1fr);
}

.named-gate-panel,
.gate-runbook-panel {
  display: grid;
  gap: 8px;
  min-width: 0;
  padding: 9px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel-bg);
}

.named-gate-panel.warn,
.named-gate-panel.process.warn {
  border-color: var(--status-warn-border);
  background: var(--status-warn-bg);
  box-shadow: inset 3px 0 0 var(--warning);
}

.named-gate-panel.ok {
  border-color: var(--status-ok-border);
  background: var(--status-ok-bg);
}

.named-gate-panel.info {
  border-color: color-mix(in srgb, var(--accent) 48%, var(--line));
  background: var(--surface-selected);
}

.gate-panel-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 10px;
  min-width: 0;
}

.gate-panel-head span {
  display: block;
  color: var(--muted);
  font-size: 10px;
  font-weight: 850;
  text-transform: uppercase;
}

.gate-panel-head strong {
  display: block;
  margin-top: 2px;
  color: var(--ink);
  font-size: 14px;
  line-height: 1.25;
}

.gate-panel-head small {
  display: block;
  margin-top: 3px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 600;
  line-height: 1.25;
}

.gate-panel-head b {
  flex: 0 0 auto;
  padding: 3px 7px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--surface-muted);
  color: var(--muted);
  font-size: 10px;
  font-weight: 850;
}

.gate-panel-facts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.gate-panel-facts div {
  min-width: 0;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-soft);
}

.gate-panel-facts span {
  display: block;
  color: var(--muted);
  font-size: 10px;
  font-weight: 850;
  text-transform: uppercase;
}

.gate-panel-facts strong {
  display: block;
  margin-top: 2px;
  color: var(--ink);
  font-size: 12px;
  line-height: 1.25;
}

.gate-panel-action {
  display: flex;
  justify-content: flex-end;
}

.gate-runbook-list {
  display: grid;
  gap: 7px;
}

.gate-runbook-panel {
  align-content: start;
}

.gate-runbook-panel > summary {
  cursor: pointer;
  align-items: center;
  list-style: none;
}

.gate-runbook-panel > summary::-webkit-details-marker {
  display: none;
}

.gate-runbook-panel:not([open]) {
  background: var(--surface-soft);
}

.gate-runbook-chevron {
  flex: 0 0 auto;
  width: 9px;
  height: 9px;
  border-right: 2px solid var(--muted);
  border-bottom: 2px solid var(--muted);
  transform: rotate(45deg);
  transition: transform .16s ease;
}

.gate-runbook-panel[open] .gate-runbook-chevron {
  transform: rotate(225deg);
}

.gate-runbook-row {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr) auto;
  gap: 8px;
  align-items: start;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-soft);
}

.gate-runbook-row > span {
  width: 10px;
  height: 10px;
  margin-top: 4px;
  border-radius: 999px;
  border: 2px solid var(--line-strong);
  background: var(--surface-muted);
}

.gate-runbook-row.done > span {
  border-color: var(--status-ok-border);
  background: var(--green);
}

.gate-runbook-row.current > span {
  border-color: var(--status-warn-border);
  background: var(--warning);
}

.gate-runbook-row strong {
  display: block;
  color: var(--ink);
  font-size: 12px;
  line-height: 1.25;
}

.gate-runbook-row p,
.gate-runbook-row small {
  display: block;
  margin: 2px 0 0;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.25;
}

.developer-project-page {
  display: grid;
  gap: 10px;
}

.developer-project-sprints,
.developer-project-dependencies,
.developer-project-story-inventory {
  min-width: 0;
}

.developer-project-story-groups {
  display: grid;
  gap: 8px;
}

.developer-project-story-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-muted);
}

.developer-project-story-row small {
  display: block;
  margin-top: 4px;
  color: var(--text-muted);
}

.developer-project-story-row-meta {
  display: grid;
  justify-items: end;
  gap: 8px;
}

.dependency-status-list {
  display: grid;
  gap: 8px;
}

.dependency-status-row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-soft);
}

.dependency-status-row.blocked {
  border-color: var(--status-warn-border);
  background: var(--status-warn-bg);
}

.dependency-status-row strong {
  display: block;
  color: var(--ink);
  font-size: 13px;
  line-height: 1.25;
}

.dependency-status-row p {
  margin: 3px 0 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
}

.developer-story-picker,
.developer-process-panel,
.developer-side-card {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-raised);
}

.developer-story-picker-head,
.developer-panel-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}

.developer-story-picker-head h3,
.developer-panel-head h3 {
  margin: 0;
  color: var(--ink);
  font-size: 14px;
}

.developer-panel-head p {
  margin: 3px 0 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
}

.developer-story-picker-head span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.developer-story-picker-row {
  width: 100%;
  display: grid;
  gap: 3px;
  padding: 9px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-soft);
  text-align: left;
}

.developer-story-picker-row.selected {
  border-color: var(--accent);
  background: var(--surface-selected);
  box-shadow: inset 3px 0 0 var(--accent);
}

.developer-story-picker-row strong {
  color: var(--ink);
  font-size: 13px;
}

.developer-story-picker-row span {
  color: var(--muted);
  font-size: 11px;
}

.developer-workbench-main,
.developer-workbench-side {
  display: grid;
  gap: 10px;
}

.developer-process-setup-panel.needs-setup {
  border-color: var(--status-warn-border);
  background: var(--status-warn-bg);
  box-shadow: inset 3px 0 0 var(--warning);
}

.developer-process-setup-panel.confirmed {
  background: var(--surface-raised);
}

.developer-mode-strip {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.developer-mode-strip.single-option {
  grid-template-columns: minmax(0, 1fr);
}

.developer-mode-strip.two-options {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.work-mode-panel {
  align-content: start;
  gap: 9px;
}

.work-mode-panel .developer-mode-strip {
  align-items: stretch;
}

.work-mode-panel .developer-mode-card {
  min-height: 44px;
  padding: 8px;
}

.coding-assistant-continuation {
  position: relative;
  display: grid;
  gap: 8px;
  padding: 14px;
  border: 1px solid var(--border-strong);
  border-radius: 10px;
  background: var(--surface-raised);
}

.coding-assistant-continuation.compact {
  gap: 5px;
  padding: 10px;
}

.coding-assistant-continuation.connected {
  padding-right: 88px;
}

.coding-assistant-continuation p {
  margin: 0;
  color: var(--text-secondary);
}

.coding-assistant-continuation > .badge {
  position: absolute;
  top: 10px;
  right: 10px;
}

.work-mode-panel .drawer-actions.compact {
  justify-content: stretch;
}

.work-mode-panel .drawer-actions.compact button {
  width: 100%;
  min-height: 32px;
}

.agent-farm-context-note {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px;
  border: 1px solid var(--status-ok-border);
  border-radius: 9px;
  background: var(--status-ok-bg);
}

.agent-farm-context-note div {
  min-width: 0;
}

.agent-farm-context-note strong,
.agent-farm-context-note p,
.agent-farm-action-summary p {
  margin: 0;
}

.agent-farm-context-note p {
  margin-top: 2px;
  color: var(--text-secondary);
  font-size: 11px;
}

.agent-farm-context-note button {
  flex: 0 0 auto;
}

.agent-routing-recommendation {
  display: grid;
  gap: 9px;
  padding: 12px;
  border: 1px solid var(--accent);
  border-radius: 8px;
  background: var(--surface-raised);
  box-shadow: inset 3px 0 0 var(--accent);
}

.agent-routing-recommendation.loading,
.agent-routing-recommendation.error {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  border-color: var(--line);
  box-shadow: none;
}

.agent-routing-recommendation.error {
  border-color: var(--status-warn-border);
}

.agent-routing-primary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
}

.agent-routing-primary h3,
.agent-routing-recommendation h3,
.agent-routing-explanation h4 {
  margin: 0;
  color: var(--ink);
}

.agent-routing-primary h3 {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  align-items: center;
  margin-top: 2px;
  font-size: 16px;
}

.agent-routing-primary p,
.agent-routing-recommendation.loading p,
.agent-routing-recommendation.error p {
  margin: 4px 0 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
}

.agent-routing-primary small {
  display: block;
  margin-top: 6px;
  color: var(--muted);
  font-size: 10px;
}

.agent-routing-signals {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 9px;
}

.agent-routing-signals > div {
  display: grid;
  min-width: 138px;
  padding: 7px 9px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-soft);
}

.agent-routing-signals small,
.agent-routing-signals strong,
.agent-routing-signals span {
  margin: 0;
}

.agent-routing-signals small {
  color: var(--muted);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.agent-routing-signals strong {
  margin-top: 2px;
  color: var(--ink);
  font-size: 12px;
}

.agent-routing-signals span {
  margin-top: 1px;
  color: var(--muted);
  font-size: 9px;
}

.agent-routing-actions {
  display: grid;
  gap: 6px;
  min-width: 190px;
}

.agent-routing-actions > button,
.agent-routing-actions summary {
  width: 100%;
  min-height: 32px;
}

.agent-routing-alternatives summary,
.agent-routing-explanation summary {
  color: var(--accent);
  font-size: 11px;
  font-weight: 900;
  cursor: pointer;
}

.agent-routing-alternatives[open] {
  display: grid;
  gap: 7px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-soft);
}

.agent-routing-alternatives label {
  display: grid;
  gap: 4px;
  color: var(--muted);
  font-size: 10px;
}

.agent-routing-explanation {
  padding-top: 8px;
  border-top: 1px solid var(--line);
}

.agent-routing-explanation[open] {
  display: grid;
  gap: 8px;
}

.agent-routing-explanation h4 {
  font-size: 12px;
}

.agent-routing-evidence {
  display: grid;
}

.agent-routing-evidence p,
.agent-routing-reconciliation {
  margin: 0;
  padding: 6px 0;
  border-bottom: 1px solid var(--line);
  color: var(--ink);
  font-size: 11px;
}

.agent-routing-reconciliation {
  border-bottom: 0;
  color: var(--muted);
}

.agent-routing-explanation > button {
  justify-self: start;
}

.agent-routing-lifecycle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding-top: 8px;
  border-top: 1px solid var(--line);
}

.agent-routing-lifecycle > div {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}

.agent-routing-lifecycle strong,
.agent-routing-lifecycle small {
  color: var(--ink);
  font-size: 11px;
}

.agent-routing-lifecycle small {
  color: var(--muted);
}

@container (max-width: 560px) {
  .agent-routing-primary {
    grid-template-columns: minmax(0, 1fr);
  }

  .agent-routing-actions {
    min-width: 0;
  }
}

.developer-case-timeline {
  display: grid;
  gap: 8px;
}

.developer-case-step {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  min-height: 58px;
  padding: 9px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-soft);
}

.developer-case-step > span {
  width: 22px;
  height: 22px;
  display: grid;
  place-items: center;
  border: 1px solid var(--line-strong);
  border-radius: 6px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 850;
}

.developer-case-step.done > span {
  border-color: var(--status-ok-border);
  background: var(--status-ok-bg);
  color: var(--status-ok-fg);
}

.developer-case-step.current {
  border-color: var(--accent);
  background: var(--surface-selected);
  box-shadow: inset 3px 0 0 var(--accent);
}

.developer-case-step.current > span {
  border-color: var(--accent);
  background: var(--accent-soft);
  color: var(--accent-ink);
}

.developer-case-step strong {
  color: var(--ink);
  font-size: 13px;
}

.developer-case-step p {
  margin: 2px 0 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
}

.developer-case-step b {
  color: var(--muted);
  font-size: 11px;
}

.developer-case-step-state {
  display: grid;
  justify-items: end;
  gap: 3px;
  min-width: 178px;
}

.developer-case-step-state time,
.developer-case-step-state small {
  color: var(--muted);
  font-size: 10px;
  font-weight: 700;
  line-height: 1.25;
  white-space: nowrap;
}

.developer-case-step.current .developer-case-step-state time {
  color: var(--accent-ink);
}

.work-process-list {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 7px;
  max-height: 205px;
  overflow-y: auto;
  padding-right: 4px;
}

.development-process-panel .developer-panel-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
}

.development-process-panel {
  align-content: start;
  gap: 8px;
}

.development-process-panel .developer-panel-head > button {
  max-width: 112px;
  white-space: normal;
}

.development-process-panel .work-process-list {
  max-height: none;
  overflow: visible;
  padding-right: 0;
}

.work-process-row {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
  min-height: 48px;
  padding: 7px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-soft);
}

.work-process-row.process-node-row {
  grid-template-columns: 22px minmax(180px, 1.15fr) minmax(160px, .85fr);
}

.work-process-row > span {
  width: 17px;
  height: 17px;
  display: grid;
  place-items: center;
  border: 1px solid var(--line-strong);
  border-radius: 999px;
  color: var(--muted);
  font-size: 10px;
  font-weight: 900;
}

.work-process-row.done > span {
  border-color: var(--status-ok-border);
  background: var(--status-ok-bg);
  color: var(--status-ok-fg);
}

.work-process-row.current > span {
  border-color: var(--status-warn-border);
  background: var(--status-warn-bg);
  color: var(--warning);
}

.work-process-row.waived {
  border-color: var(--status-warn-border);
  background: var(--status-warn-bg);
}

.work-process-row p {
  margin: 0;
}

.work-process-row .process-node-result {
  padding-left: 8px;
  border-left: 1px solid var(--line);
}

.work-process-row strong {
  display: block;
  color: var(--ink);
  font-size: 12px;
}

.work-process-row small {
  display: block;
  margin-top: 2px;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.2;
}

.work-process-row b {
  color: var(--muted);
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
}

.developer-mode-card {
  min-height: 48px;
  display: grid;
  gap: 5px;
  align-content: center;
  padding: 9px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-soft);
  text-align: left;
}

.developer-mode-card.active {
  border-color: var(--accent);
  background: var(--surface-selected);
}

.developer-mode-card:disabled:not(.active) {
  opacity: .58;
}

.developer-mode-card strong,
.developer-stage-card h4 {
  color: var(--ink);
  font-size: 12px;
  line-height: 1.15;
}

.developer-mode-card span,
.developer-stage-card p {
  color: var(--muted);
  font-size: 11px;
  line-height: 1.28;
}

.work-mode-panel .developer-mode-card span {
  display: none;
}

.mode-action-panel {
  padding: 0;
  overflow: visible;
  align-content: start;
}

.mode-action-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: start;
  padding: 12px;
  border-bottom: 1px solid var(--line);
  background: var(--surface-muted);
}

.mode-action-head h3 {
  margin: 0;
  color: var(--ink);
  font-size: 16px;
}

.mode-action-head p {
  margin: 3px 0 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
}

.mode-action-body {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(210px, 260px);
  gap: 10px;
  align-items: start;
  padding: 12px;
}

.mode-action-body.single {
  grid-template-columns: minmax(0, 1fr);
}

.mode-action-card {
  display: grid;
  gap: 10px;
  align-content: start;
  min-width: 0;
  min-height: 0;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-soft);
}

.mode-action-card .developer-stage-actions {
  margin-top: 0;
}

.agent-farm-action-summary {
  display: grid;
  gap: 9px;
}

.agent-farm-action-summary .ok-text {
  color: var(--status-ok-fg);
}

.thread-archive-missing.automatic span {
  border-color: var(--accent-border);
  border-radius: 50%;
  background: var(--accent-soft);
}

.mode-action-card textarea {
  min-height: 86px;
}

.mode-action-card.compact {
  background: var(--surface-raised);
}

.mode-action-panel .mode-action-card.compact {
  gap: 8px;
}

.mode-action-panel .mode-action-card.compact .developer-panel-head h3 {
  font-size: 13px;
}

.mode-action-panel .mode-action-queue-list {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 5px;
}

.mode-action-panel .mode-action-queue {
  min-height: 30px;
  padding: 6px;
}

.mode-action-panel .mode-action-queue strong {
  overflow: hidden;
  font-size: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mode-action-panel .mode-action-queue small {
  display: none;
}

.mode-action-card label {
  display: grid;
  gap: 6px;
  color: var(--ink);
  font-size: 12px;
  font-weight: 800;
}

.mode-action-card select {
  min-height: 30px;
}

.mode-action-queue-list,
.mode-action-facts {
  display: grid;
  gap: 7px;
}

.mode-action-queue,
.mode-action-facts div {
  min-width: 0;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-soft);
}

.mode-action-queue.active {
  border-color: var(--accent);
  background: var(--surface-selected);
}

.mode-action-queue strong,
.mode-action-facts strong {
  display: block;
  color: var(--ink);
  font-size: 12px;
}

.mode-action-queue small,
.mode-action-facts span {
  display: block;
  margin-top: 2px;
  color: var(--muted);
  font-size: 10px;
  line-height: 1.25;
}

.next-evidence-panel {
  border-color: var(--status-warn-border);
}

.developer-process-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.developer-stage-card {
  display: grid;
  gap: 8px;
  align-content: start;
  min-height: 186px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-soft);
}

.developer-stage-card.done {
  border-color: var(--status-ok-border);
  background: var(--status-ok-bg);
}

.developer-stage-card.locked {
  opacity: .82;
}

.developer-stage-card h4,
.developer-stage-card p {
  margin: 0;
}

.developer-stage-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: end;
  margin-top: auto;
}

.developer-stage-actions label {
  display: grid;
  gap: 4px;
  min-width: 160px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
}

.developer-handoff-preview {
  display: grid;
  gap: 8px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-soft);
}

.developer-handoff-preview p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.45;
}

.policy-stack-preview {
  background: color-mix(in srgb, var(--surface-soft), var(--panel-bg) 35%);
}

.policy-chip-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.policy-chip {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 3px 8px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--panel-bg);
  color: var(--text);
  font-size: 11px;
  font-weight: 800;
}

.policy-suggestion-list {
  display: grid;
  gap: 6px;
}

.policy-suggestion-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--panel-bg);
}

.policy-suggestion-row small {
  display: block;
  margin-top: 2px;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.35;
}

.policy-suggestion-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 6px;
}

.policy-suggestion-actions button {
  min-height: 28px;
  padding: 4px 8px;
  font-size: 11px;
}

.policy-template-library,
.policy-binding-list {
  display: grid;
  gap: 10px;
  margin-top: 12px;
}

.policy-template-row,
.policy-binding-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel-bg);
}

.policy-template-row p,
.policy-template-row small,
.policy-binding-row small {
  display: block;
  margin: 4px 0 0;
  color: var(--muted);
}

.policy-binding-row span {
  color: var(--muted);
}

.thread-policy-workspace {
  display: grid;
  gap: 10px;
}

.thread-policy-compact {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 12px;
}

.thread-policy-section {
  display: grid;
  gap: 6px;
}

.thread-policy-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 24px;
  padding-bottom: 4px;
  border-bottom: 1px solid var(--line);
}

.thread-policy-section-head h4 {
  margin: 0;
  font-size: 13px;
}

.thread-policy-section-head span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.thread-policy-list {
  display: grid;
  gap: 4px;
}

.thread-policy-row {
  display: grid;
  min-height: 32px;
  padding: 5px 2px;
  border-bottom: 1px solid color-mix(in srgb, var(--line) 72%, transparent);
}

.thread-policy-row summary {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  cursor: pointer;
  list-style: none;
}

.thread-policy-row summary::-webkit-details-marker,
.personal-policy-row summary::-webkit-details-marker {
  display: none;
}

.thread-policy-row:last-child {
  border-bottom: 0;
}

.thread-policy-row pre,
.personal-policy-row pre {
  margin: 8px 0 4px 46px;
  padding: 8px;
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--surface-soft);
  color: var(--text);
  font-family: var(--font-mono);
  font-size: 11px;
  line-height: 1.45;
  white-space: pre-wrap;
}

.thread-policy-check {
  display: grid;
  place-items: center;
}

.thread-policy-check input {
  width: 16px;
  height: 16px;
  margin: 0;
}

.thread-policy-line {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  min-width: 0;
}

.thread-policy-line strong {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 13px;
}

.thread-policy-line small,
.thread-policy-binding-line {
  overflow: hidden;
  color: var(--muted);
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.thread-policy-row.enabled .thread-policy-line small {
  color: var(--accent);
}

.thread-policy-binding-line {
  padding-top: 2px;
}

.expandable-policy-name {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
}

.chevron-caret {
  width: 7px;
  height: 7px;
  flex: 0 0 7px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  opacity: .68;
  transform: rotate(-45deg);
  transition: transform .14s ease;
}

details[open] > summary .chevron-caret {
  transform: rotate(45deg);
}

/*
 * Shared disclosure contract: every native details control has a visible,
 * stateful affordance. Components with an explicit caret keep their tailored
 * layout; all other summaries receive the same right/down chevron.
 */
details > summary {
  list-style: none;
}

details > summary::-webkit-details-marker {
  display: none;
}

details > summary:not(:has(.chevron-caret, .gate-runbook-chevron)) {
  position: relative;
}

details > summary:not(:has(.chevron-caret, .gate-runbook-chevron))::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 10px;
  width: 7px;
  height: 7px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  opacity: .68;
  pointer-events: none;
  transform: translateY(-50%) rotate(-45deg);
  transition: transform .14s ease;
}

details[open] > summary:not(:has(.chevron-caret, .gate-runbook-chevron))::after {
  transform: translateY(-50%) rotate(45deg);
}

details > summary:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

.thread-domain-section > summary:not(:has(.chevron-caret, .gate-runbook-chevron)),
.developer-project-section > summary:not(:has(.chevron-caret, .gate-runbook-chevron)),
.settings-multiselect > summary:not(:has(.chevron-caret, .gate-runbook-chevron)) {
  padding-right: 34px;
}

.personal-policy-add {
  display: grid;
  gap: 8px;
  margin-top: 12px;
}

.personal-policy-add-row {
  display: grid;
  grid-template-columns: minmax(160px, 240px) minmax(130px, 170px) minmax(130px, 170px) auto;
  align-items: end;
  gap: 12px;
}

.personal-policy-add-row.instruction {
  grid-template-columns: minmax(0, 1fr) auto;
}

.personal-policy-add-row.instruction textarea {
  min-height: 72px;
}

.project-budget-form .personal-policy-add-row {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.project-budget-form .personal-policy-add-row.instruction {
  grid-template-columns: minmax(0, 1fr);
}

.project-budget-form label,
.project-budget-form input,
.project-budget-form select,
.project-budget-form textarea,
.project-budget-form button {
  min-width: 0;
}

.budget-mix-control {
  border: 1px solid var(--border);
  border-radius: 8px;
  display: grid;
  gap: 8px;
  padding: 10px;
}

.budget-mix-head,
.budget-mix-meta {
  align-items: center;
  display: flex;
  gap: 8px;
  justify-content: space-between;
}

.budget-mix-head span,
.budget-mix-meta span,
.budget-mix-control p {
  color: var(--muted);
  font-size: 12px;
  margin: 0;
}

.budget-mix-control label {
  display: grid;
  gap: 4px;
}

.budget-mix-slider {
  accent-color: var(--accent);
  width: 100%;
}

.budget-mix-marks {
  height: 30px;
  margin: 0 8px;
  position: relative;
  text-align: center;
}

.budget-mix-marks span {
  color: var(--text);
  font-size: 11px;
  min-width: 0;
  position: absolute;
  top: 0;
  transform: translateX(-50%);
  width: 76px;
}

.budget-mix-marks small {
  color: var(--muted);
  display: block;
  font-size: 10px;
  margin-top: 2px;
}

.budget-mix-marks span:nth-child(1) {
  left: 0;
  text-align: left;
  transform: none;
}

.budget-mix-marks span:nth-child(2) {
  left: 25%;
}

.budget-mix-marks span:nth-child(3) {
  left: 50%;
}

.budget-mix-marks span:nth-child(4) {
  left: 75%;
}

.budget-mix-marks span:nth-child(5) {
  left: 100%;
  text-align: right;
  transform: translateX(-100%);
}

.personal-policy-list {
  display: grid;
  gap: 4px;
  margin-top: 12px;
}

.personal-policy-row {
  border-bottom: 1px solid var(--line);
}

.personal-policy-row summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  min-height: 34px;
  cursor: pointer;
  list-style: none;
}

.personal-policy-row.selectable-policy-row summary {
  grid-template-columns: 24px minmax(0, 1fr) auto;
}

.personal-policy-row summary span {
  font-weight: 800;
}

.personal-policy-row summary small {
  color: var(--muted);
  font-size: 11px;
}

.policy-decision-lightbox {
  width: min(520px, calc(100vw - 32px));
  min-height: 0;
}

.policy-decision-lightbox textarea {
  min-height: 110px;
  resize: vertical;
}

.artifact-lightbox.governor-hold-lightbox {
  width: min(760px, calc(100vw - 32px));
  max-height: min(760px, calc(100dvh - 32px));
  grid-template-rows: auto minmax(0, 1fr) auto;
}

.governor-context-summary,
.governor-context-list,
.governor-violation-context,
.governor-violation-list {
  display: grid;
  gap: 8px;
}

.governor-context-summary {
  justify-items: start;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--panel-bg-subtle);
}

.governor-context-summary p,
.governor-context-summary small,
.governor-context-row p,
.governor-context-row em,
.governor-context-row code {
  margin: 0;
}

.governor-context-list {
  min-width: 0;
}

.governor-hold-body {
  min-height: 0;
  overflow-y: auto;
  scrollbar-gutter: stable;
  display: grid;
  align-content: start;
  gap: 10px;
  padding-right: 2px;
}

.governor-violation-context {
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-raised);
}

.governor-violation-head > span,
.governor-violation-title > span:first-child {
  display: grid;
  gap: 2px;
}

.governor-violation-head small,
.governor-violation-title small,
.governor-violation-row code,
.governor-violation-row dt,
.governor-violation-row em {
  color: var(--muted);
  font-size: 11px;
}

.governor-violation-row {
  display: grid;
  gap: 6px;
  padding-block: 8px;
  border-top: 1px solid var(--line);
}

.governor-violation-row:first-child {
  padding-top: 0;
  border-top: 0;
}

.governor-violation-title {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 12px;
}

.governor-violation-title .status-pill.governance {
  background: var(--violet-soft);
  color: var(--violet);
}

.governor-violation-row code,
.governor-violation-row p,
.governor-violation-row em,
.governor-violation-row dl,
.governor-violation-row dd {
  margin: 0;
}

.governor-violation-row code {
  overflow-wrap: anywhere;
}

.governor-violation-row dl {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 6px 12px;
}

.governor-violation-row dl > div {
  min-width: 0;
}

.governor-violation-row dt {
  margin-bottom: 2px;
}

.governor-violation-row dd,
.governor-violation-row p,
.governor-violation-row em {
  overflow-wrap: anywhere;
}

.governor-context-row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: start;
  gap: 9px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-raised);
}

.governor-context-row > span {
  min-width: 0;
  display: grid;
  gap: 4px;
}

.governor-context-row small,
.governor-context-row em,
.governor-context-row code,
.governor-hold-lightbox .helper {
  color: var(--muted);
  font-size: 11px;
}

.governor-context-row code {
  overflow-wrap: anywhere;
}

.governor-hold-lightbox textarea {
  min-height: 76px;
  resize: vertical;
}

.developer-evidence-list,
.developer-artifact-list {
  display: grid;
  gap: 7px;
}

.developer-evidence-row {
  display: grid;
  grid-template-columns: 16px minmax(0, 1fr) auto;
  align-items: center;
  gap: 7px;
  min-height: 30px;
}

.developer-evidence-row span {
  width: 14px;
  height: 14px;
  border: 1px solid var(--line-strong);
  border-radius: 4px;
  background: var(--surface-soft);
}

.developer-evidence-row span.done {
  border-color: var(--status-ok-border);
  background: var(--status-ok-fg);
}

.developer-evidence-row p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.developer-evidence-row strong {
  display: block;
  color: var(--ink);
  font-size: 12px;
  line-height: 1.2;
}

.developer-evidence-row small {
  display: block;
  color: var(--muted);
  font-size: 10px;
  line-height: 1.2;
}

.developer-evidence-row b {
  color: var(--status-ok-fg);
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
}

.developer-evidence-row button {
  min-height: 24px;
  padding: 0 8px;
  font-size: 11px;
}

.developer-artifact-list button {
  width: 100%;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  padding: 9px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-soft);
  text-align: left;
}

.developer-artifact-list strong {
  min-width: 0;
  color: var(--ink);
  font-size: 12px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.developer-artifact-list span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
}

.developer-story-brief p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.4;
}

.developer-story-brief dl {
  display: grid;
  gap: 7px;
  margin: 0;
}

.developer-story-brief dl div {
  display: grid;
  grid-template-columns: 82px minmax(0, 1fr);
  gap: 8px;
}

.developer-story-brief dt {
  color: var(--muted);
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
}

.developer-story-brief dd {
  margin: 0;
  color: var(--ink);
  font-size: 12px;
  line-height: 1.3;
  overflow-wrap: anywhere;
}

.developer-side-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.developer-workflow-graph {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
}

.developer-workflow-node {
  min-height: 74px;
  display: grid;
  gap: 4px;
  align-content: center;
  padding: 9px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-soft);
}

.developer-workflow-node.done {
  border-color: var(--status-ok-border);
  background: var(--status-ok-bg);
}

.developer-workflow-node.active {
  border-color: var(--accent);
  background: var(--surface-selected);
}

.developer-workflow-node.locked {
  opacity: .78;
}

.developer-workflow-node strong {
  color: var(--ink);
  font-size: 12px;
  line-height: 1.2;
  overflow-wrap: anywhere;
}

.developer-workflow-node span {
  color: var(--muted);
  font-size: 11px;
}

.project-row {
  width: auto;
  min-height: 34px;
  border: 1px solid var(--line);
  border-radius: 6px;
  display: grid;
  grid-template-columns: minmax(0, auto) auto;
  align-items: center;
  gap: 6px;
  text-align: left;
  background: var(--surface-soft);
  padding: 5px 7px;
  justify-self: start;
  max-width: 100%;
}

.project-row.selected { background: var(--surface-selected); border-color: var(--accent); box-shadow: inset 3px 0 0 var(--accent); }
.project-row:hover { background: var(--titlebar); border-color: var(--line-strong); }
.project-main { display: grid; min-width: 0; }
.project-main strong {
  min-width: 0;
  font-size: 12px;
  line-height: 1.25;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.project-row .project-state-pill {
  min-height: 16px;
  padding: 0 5px;
  justify-self: end;
  max-width: 112px;
  overflow: hidden;
  text-overflow: ellipsis;
}
.view-all {
  justify-self: start;
  align-self: start;
  width: auto;
  min-height: 24px;
  border: 0;
  color: var(--accent-ink);
  background: transparent;
  padding: 0;
}

.project-state-pill, .badge, .count, .llm-status {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 14px;
  border: 1px solid var(--line);
  border-radius: 3px;
  padding: 0 4px;
  color: var(--muted);
  background: var(--chip-muted);
  line-height: 1;
  font-size: 9px;
  font-weight: 800;
  white-space: nowrap;
}

.project-state-pill.planning { color: var(--accent-ink); background: var(--accent-soft); border-color: var(--accent); }
.project-state-pill.requirements,
.project-state-pill.requirements-gathering { color: var(--orange); background: var(--orange-soft); border-color: color-mix(in srgb, var(--orange) 52%, var(--line)); }
.project-state-pill.development { color: var(--green); background: var(--green-soft); border-color: color-mix(in srgb, var(--green) 52%, var(--line)); }
.project-state-pill.released { color: var(--purple); background: var(--purple-soft); border-color: color-mix(in srgb, var(--purple) 52%, var(--line)); }
.project-state-pill.action-required, .badge.danger { color: var(--danger); background: var(--danger-soft); border-color: var(--status-danger-border); }
.project-state-pill.in-review, .project-state-pill.pending-approval, .badge.warn { color: var(--orange); background: var(--orange-soft); border-color: var(--status-warn-border); }
.project-state-pill.ready-for-qa, .project-state-pill.approved, .badge.ok, .llm-status.ok { color: var(--status-ok-fg); background: var(--green-soft); border-color: var(--status-ok-border); }
.badge.neutral { background: var(--soft); }

.mission {
  grid-column: 3;
  grid-row: 1;
  min-width: min(520px, 100%);
  min-height: calc(100vh - 48px);
  min-height: calc(100dvh - 48px);
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  background: var(--panel-bg);
  overflow: hidden;
  font-size: 12px;
}

.main-panel-stack {
  min-height: 0;
  overflow: auto;
  display: grid;
  align-content: start;
  padding-bottom: var(--workspace-end-space);
  scroll-padding-bottom: var(--workspace-end-space);
  scrollbar-gutter: stable;
}

.main-panel-stack > .pane,
.main-panel-stack > section {
  min-width: 0;
}

.mission h1 { font-size: 16px; }
.mission h2 { font-size: 14px; }
.mission h3 { font-size: 13px; }
.mission p { font-size: 12px; }

.main-activity-feed {
  position: relative;
  z-index: 5;
  margin: 0;
  border: 0;
  border-top: 1px solid var(--line-strong);
  border-radius: 0;
  background: var(--surface-raised);
  min-height: 104px;
  max-height: 124px;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  padding: 8px 18px 12px;
  gap: 6px;
  box-shadow: 0 -8px 20px color-mix(in srgb, var(--rail-bg) 8%, transparent);
}

.feed-head {
  min-height: 28px;
  padding: 5px 8px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  border: 1px solid var(--line-strong);
  border-radius: 7px;
  background: var(--titlebar);
}

.feed-head div {
  display: flex;
  align-items: baseline;
  gap: 8px;
  min-width: 0;
}

.feed-head h2 {
  margin: 0;
  font-size: 13px;
  color: var(--ink);
}

.feed-head span {
  color: var(--muted);
  font-size: 11px;
}

.feed-head button {
  min-height: 24px;
  font-size: 11px;
}

.activity-textbox {
  width: 100%;
  height: 100%;
  min-height: 68px;
  resize: none;
  border: 1px solid var(--line-strong);
  border-radius: 7px;
  background: var(--surface-raised);
  color: var(--ink);
  padding: 7px 8px;
  font-family: var(--font-sans);
  font-size: 11px;
  line-height: 1.45;
  overflow: auto;
}

.project-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 6px 12px;
  border-bottom: 0;
  padding: 10px 12px 0;
}

.project-title-block > div {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

.project-title-block p {
  margin: 3px 0 0;
  font-size: 12px;
}

.project-owner {
  display: grid;
  gap: 4px;
  justify-items: end;
  align-content: start;
  font-size: 12px;
}

.project-owner span { color: var(--muted); }
.project-owner strong { font-size: 13px; }

.project-context-strip {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-width: 0;
  margin-top: 2px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-raised);
}

.project-context-strip > div {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.project-context-strip span {
  color: var(--muted);
  font-size: 10px;
  font-weight: 850;
  text-transform: uppercase;
}

.project-context-strip strong {
  overflow: hidden;
  color: var(--ink);
  font-size: 14px;
  font-weight: 850;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.project-context-strip small {
  overflow: hidden;
  color: var(--text-secondary);
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.project-context-strip button {
  flex: 0 0 auto;
  min-height: 28px;
  border: 1px solid var(--button-secondary-border);
  border-radius: 6px;
  background: var(--button-secondary-bg);
  color: var(--button-secondary-fg);
  font-size: 11px;
  font-weight: 800;
}

.project-context-strip button:hover {
  border-color: var(--accent);
  background: color-mix(in srgb, var(--accent) 28%, var(--surface-raised));
}

.project-tabs {
  grid-column: 1 / -1;
  display: flex;
  gap: 2px;
  min-width: 0;
  overflow: auto hidden;
  margin-top: 4px;
  padding: 0 2px;
  border: 0;
  border-radius: 0;
  background: transparent;
  align-items: flex-end;
}

.project-tabs button {
  border: 1px solid transparent;
  border-bottom: 0;
  border-radius: 7px 7px 0 0;
  background: transparent;
  min-height: 30px;
  padding: 0 10px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 750;
  white-space: nowrap;
}

.project-tabs button.active {
  position: relative;
  z-index: 1;
  margin-bottom: -1px;
  color: var(--accent-ink);
  background: var(--surface-raised);
  border-color: var(--accent);
  border-bottom-color: var(--surface-raised);
  box-shadow: inset 0 2px 0 var(--accent);
}

.queue-pane {
  padding: 10px 12px;
}

.workspace-view-switcher {
  display: flex;
  align-items: center;
  gap: 5px;
  min-width: 0;
  overflow: auto hidden;
  padding: 6px 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-raised);
}

.workspace-view-switcher span {
  flex: 0 0 auto;
  color: var(--muted);
  font-size: 10px;
  font-weight: 850;
  text-transform: uppercase;
}

.workspace-view-switcher button {
  flex: 0 0 auto;
  min-height: 26px;
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 0 9px;
  background: var(--button-bg);
  color: var(--muted);
  font-size: 11px;
  font-weight: 750;
  white-space: nowrap;
}

.workspace-view-switcher button:hover {
  border-color: var(--line-strong);
  background: var(--button-hover-bg);
}

.workspace-view-switcher button.active {
  border-color: var(--accent);
  background: var(--accent-soft);
  color: var(--accent-ink);
}

.workspace-focus-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(280px, .72fr);
  gap: 10px;
  align-items: start;
}

.workspace-focus-grid.single {
  grid-template-columns: minmax(0, 1fr);
}

.workspace-focus-grid .workflow-accountability-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.workspace-focus-grid .workflow-map-panel {
  grid-column: 1 / -1;
}

.workflow-accountability-pane {
  display: grid;
  grid-template-rows: auto auto auto minmax(0, 1fr);
  min-height: 0;
  padding: 0;
}

.workflow-accountability-title .badge {
  align-self: start;
}

.workflow-accountability-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(320px, 1fr));
  gap: 8px;
  min-height: 0;
  padding: 0 8px 8px;
  overflow: auto;
}

.project-progress-tracker {
  padding: 8px;
}

.project-thread-runbook {
  display: grid;
  gap: 8px;
  margin: 0 8px 8px;
  padding: 8px;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  background: var(--surface-raised);
}

.project-thread-runbook-head {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 10px;
  min-width: 0;
}

.project-thread-runbook-head h3 {
  margin: 0;
  font-size: 14px;
  line-height: 1.2;
}

.project-thread-runbook-grid {
  display: grid;
  grid-template-columns: minmax(160px, .75fr) minmax(220px, 1fr) minmax(260px, 1.25fr);
  gap: 8px;
  align-items: stretch;
  min-width: 0;
}

.project-thread-runbook-grid.two-panel {
  grid-template-columns: minmax(220px, 0.85fr) minmax(320px, 1.4fr);
}

.project-thread-runbook-grid.single-panel {
  grid-template-columns: minmax(0, 1fr);
}

.project-thread-mode-card,
.project-thread-next-card,
.project-thread-mode {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-soft);
}

.project-thread-mode-card,
.project-thread-next-card {
  display: grid;
  gap: 5px;
  align-content: start;
  padding: 9px;
}

.project-thread-mode-card span,
.project-thread-next-card span {
  color: var(--muted);
  font-size: 10px;
  font-weight: 850;
  letter-spacing: .01em;
  text-transform: uppercase;
}

.project-thread-mode-card strong,
.project-thread-next-card strong,
.project-thread-mode strong {
  display: block;
  overflow-wrap: anywhere;
  font-size: 12px;
  line-height: 1.25;
}

.project-thread-mode-card p,
.project-thread-next-card p,
.project-thread-mode p {
  margin: 0;
  color: var(--text-secondary);
  font-size: 11px;
  line-height: 1.32;
}

.project-thread-next-card button {
  justify-self: start;
  margin-top: 2px;
}

.project-thread-mode-list {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.project-thread-mode-list.compact {
  margin-top: 2px;
}

.project-thread-mode {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  gap: 8px;
  align-items: center;
  padding: 7px;
}

.project-thread-mode > span {
  display: grid;
  place-items: center;
  width: 24px;
  height: 24px;
  border: 1px solid var(--line-strong);
  border-radius: 999px;
  color: var(--muted);
  background: var(--surface-raised);
  font-size: 10px;
  font-weight: 900;
}

.project-thread-mode.done > span {
  color: var(--green);
  border-color: color-mix(in srgb, var(--green) 52%, var(--border-soft));
  background: var(--green-soft);
}

.project-thread-mode.current {
  border-color: var(--status-warn-border);
  background: color-mix(in srgb, var(--orange-soft) 55%, var(--surface-raised));
}

.project-thread-mode.current > span {
  color: var(--accent-ink);
  border-color: color-mix(in srgb, var(--accent) 58%, var(--border-soft));
  background: var(--accent-soft);
}

.project-frontier-action-list {
  display: grid;
  gap: 7px;
  min-width: 0;
  max-height: 280px;
  overflow: auto;
}

.project-frontier-action {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: start;
  min-width: 0;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-raised);
}

.project-frontier-action.owned {
  grid-template-columns: minmax(0, 1fr) auto auto;
  border-color: var(--accent);
  background: color-mix(in srgb, var(--accent-soft) 50%, var(--surface-raised));
}

.project-frontier-action small {
  display: block;
  color: var(--muted);
  font-size: 10px;
  font-weight: 850;
  text-transform: uppercase;
}

.project-frontier-action strong {
  display: block;
  margin-top: 2px;
  overflow-wrap: anywhere;
  font-size: 12px;
  line-height: 1.25;
}

.project-frontier-action p {
  margin: 3px 0 0;
  color: var(--text-secondary);
  font-size: 11px;
  line-height: 1.32;
}

.project-frontier-action button {
  align-self: center;
}

.project-lifecycle-progress {
  padding: 0;
}

.workflow-column,
.workflow-map-panel {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  background: var(--surface-raised);
}

.workflow-map-panel {
  grid-column: 1 / -1;
}

.workflow-column-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 8px 9px;
  border-bottom: 1px solid var(--line);
  background: var(--titlebar);
}

.workflow-column-head h3 {
  margin: 0;
  color: var(--muted);
  font-size: 11px;
  font-weight: 850;
  letter-spacing: .01em;
  text-transform: uppercase;
}

.workflow-column-head span {
  color: var(--muted);
  font-size: 10px;
  font-weight: 850;
}

.workflow-step-list,
.workflow-map-list {
  display: grid;
  gap: 7px;
  align-content: start;
  min-height: 0;
  overflow: auto;
  padding: 8px;
}

.workflow-step-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 7px;
  align-items: start;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-soft);
}

.workflow-step-row > div:first-child {
  min-width: 0;
}

.workflow-step-row.active {
  border-color: var(--status-warn-border);
  background: color-mix(in srgb, var(--orange-soft) 60%, var(--surface-raised));
  box-shadow: inset 3px 0 0 var(--orange);
}

.workflow-step-row.waiting {
  background: var(--surface-raised);
}

.workflow-step-phase {
  display: block;
  margin-bottom: 3px;
  color: var(--muted);
  font-size: 10px;
  font-weight: 850;
}

.workflow-step-row strong {
  display: block;
  overflow-wrap: anywhere;
  font-size: 12px;
  line-height: 1.25;
}

.workflow-step-row p {
  margin: 3px 0 0;
  color: var(--text-secondary);
  font-size: 11px;
  line-height: 1.3;
}

.workflow-step-row .workflow-step-blocks {
  color: var(--muted);
  font-size: 10px;
  font-weight: 750;
}

.workflow-step-row small {
  display: block;
  margin-top: 3px;
  color: var(--muted);
  font-size: 10px;
}

.workflow-step-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  justify-content: space-between;
  min-width: 0;
}

.workflow-step-actions button {
  min-width: 72px;
  margin-left: auto;
}

.workflow-map-step {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 7px;
  align-items: center;
  padding: 7px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-soft);
}

.workflow-map-step.current {
  border-color: var(--status-warn-border);
  background: color-mix(in srgb, var(--orange-soft) 58%, var(--surface-raised));
}

.workflow-map-step.done {
  border-color: var(--status-ok-border);
  background: color-mix(in srgb, var(--green-soft) 70%, var(--surface-raised));
}

.workflow-map-step.ready-next {
  border-color: color-mix(in srgb, var(--purple) 45%, var(--line));
  background: color-mix(in srgb, var(--purple-soft) 72%, var(--surface-raised));
}

.workflow-map-step strong,
.workflow-map-step span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.workflow-map-step strong {
  font-size: 11px;
}

.workflow-map-step p {
  min-width: 0;
  margin: 0;
  color: var(--muted);
  font-size: 10px;
  line-height: 1.25;
}

.workflow-map-step span {
  margin: 0;
  color: var(--muted);
  font-size: 10px;
}

.workspace-tab-panel {
  display: grid;
  gap: 8px;
  align-items: start;
  min-height: 0;
  padding: 0 18px 14px;
}

.workspace-tab-panel > .workspace-view-switcher {
  position: relative;
  z-index: 2;
}

.workspace-tab-panel > .pane {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  min-height: 0;
  align-self: start;
  border-top: 0;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}

.workspace-tab-panel > .workspace-focus-grid {
  position: relative;
  z-index: 1;
  min-height: 0;
}

.queue-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 8px;
}

.queue-toolbar > div:first-child {
  display: flex;
  align-items: center;
  gap: 9px;
}

.queue-toolbar > div:last-child {
  display: flex;
  gap: 8px;
}

.queue-groups { display: grid; gap: 8px; }

.queue-group {
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-raised);
  overflow: hidden;
}

.queue-group h3 {
  min-height: 32px;
  margin: 0;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0 10px;
  border-bottom: 1px solid var(--line);
  background: var(--surface-muted);
}

.queue-group h3 span {
  min-width: 22px;
  height: 22px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: var(--surface-selected);
  color: var(--muted);
  font-size: 11px;
}

.queue-table-head, .queue-table-row {
  display: grid;
  grid-template-columns: minmax(135px, 1.2fr) minmax(95px, .8fr) minmax(115px, 1fr) minmax(88px, .7fr) 54px;
  gap: 8px;
  align-items: center;
}

.queue-table-head {
  padding: 6px 10px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
}

.queue-table-row {
  width: 100%;
  min-height: 30px;
  border: 0;
  border-top: 1px solid var(--line);
  border-radius: 0;
  padding: 5px 10px;
  text-align: left;
  font-size: 12px;
  background: var(--surface-raised);
}

.queue-table-row:hover { background: var(--surface-selected); }

.queue-list {
  border-radius: 7px;
}

.queue-row {
  min-height: 48px;
  border-bottom: 1px solid var(--line);
  display: grid;
  grid-template-columns: 80px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  padding: 9px 10px;
  text-align: left;
  background: var(--surface-raised);
}

.queue-row:last-child { border-bottom: 0; }
.queue-row strong { font-size: 13px; overflow-wrap: anywhere; }
.queue-row small { display: block; margin-top: 4px; color: var(--muted); font-size: 12px; }

.bottom-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(280px, .75fr);
  border-top: 1px solid var(--line);
}

.activity-pane, .gateway-card {
  border-right: 1px solid var(--line);
  border-radius: 0;
}

.activity-pane .pane-title,
.gateway-card .pane-title {
  margin: 0 0 8px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--titlebar);
}

.activity-table {
  display: grid;
  border: 1px solid var(--line);
  border-radius: 7px;
  overflow: hidden;
  background: var(--surface-raised);
}

.activity-table div {
  display: grid;
  grid-template-columns: 72px 74px minmax(0, 1fr) 92px;
  gap: 10px;
  align-items: center;
  min-height: 34px;
  padding: 7px 10px;
  border-bottom: 1px solid var(--line);
  font-size: 12px;
  background: var(--surface-raised);
}

.activity-table div:last-child { border-bottom: 0; }
.activity-table span { color: var(--muted); }
.activity-table b { color: var(--accent-ink); }
.activity-table p { margin: 0; font-size: 12px; color: var(--ink); }
.activity-table a { color: var(--accent-ink); text-decoration: none; }

.integration-icons {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
  border: 1px solid var(--line);
  border-radius: 7px;
  padding: 12px;
  margin-bottom: 12px;
  background: var(--surface-raised);
}

.integration-icons div {
  display: grid;
  justify-items: center;
  gap: 4px;
  text-align: center;
  min-width: 0;
}

.integration-icons span {
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  background: var(--accent-soft);
  color: var(--accent-ink);
  font-weight: 850;
  font-size: 12px;
}

.integration-icons strong { font-size: 11px; overflow-wrap: anywhere; }
.integration-icons small { color: var(--muted); font-size: 10px; }

.split {
  display: grid;
  grid-template-columns: minmax(330px, .82fr) minmax(0, 1.18fr);
  gap: 14px;
  padding: 14px 18px;
}

.summary-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border: 1px solid var(--line);
  border-radius: 8px;
  overflow: hidden;
}

.summary-grid div {
  min-height: 72px;
  padding: 12px;
  border-right: 1px solid var(--line);
  background: var(--soft);
}

.summary-grid div:last-child { border-right: 0; }
.summary-grid span { color: var(--muted); font-size: 11px; text-transform: uppercase; font-weight: 800; }
.summary-grid strong { display: block; margin-top: 9px; font-size: 14px; overflow-wrap: anywhere; }

.segmented {
  display: inline-flex;
  border: 1px solid var(--line);
  border-radius: 8px;
  overflow: hidden;
}

.segmented button {
  border: 0;
  border-radius: 0;
  min-height: 30px;
  font-size: 12px;
}

.segmented button.active {
  background: var(--accent-soft);
  color: var(--accent-ink);
}

.artifact-document {
  min-height: 330px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px;
  background: var(--panel-bg);
  line-height: 1.5;
}

.artifact-document p, .artifact-document li { font-size: 14px; }
.artifact-document ul { margin: 8px 0 0; padding-left: 20px; color: var(--muted); }

.project-detail-page {
  display: grid;
  gap: 12px;
}

.project-lifecycle-card {
  display: grid;
  gap: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  background: var(--surface-raised);
}

.project-detail-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: start;
  padding: 9px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--titlebar);
}

.project-detail-head h3 {
  margin: 2px 0 4px;
  font-size: 16px;
}

.project-detail-head p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.project-detail-badges {
  display: grid;
  justify-items: end;
  min-width: 0;
}

.project-metadata-panel {
  display: grid;
  grid-template-columns: max-content minmax(0, 1fr);
  align-items: start;
  gap: 5px 6px;
  width: fit-content;
  max-width: min(420px, 46vw);
}

.project-metadata-values {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
  gap: 5px;
  min-width: 0;
}

.project-detail-badge-label {
  color: var(--muted);
  font-size: 11px;
  font-weight: 750;
  line-height: 20px;
}

.project-activity-document {
  display: grid;
  gap: 12px;
}

.project-activity-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: start;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--titlebar);
}

.project-activity-head h3 {
  margin: 2px 0 4px;
}

.project-lifecycle {
  display: grid;
  grid-template-columns: minmax(92px, 1fr) 34px minmax(92px, 1fr) 34px minmax(92px, 1fr) 34px minmax(92px, 1fr);
  gap: 0;
  align-items: center;
  overflow: auto hidden;
  padding: 4px 0;
}

.project-stage {
  min-width: 92px;
  display: grid;
  justify-items: center;
  gap: 5px;
  min-height: 86px;
  padding: 6px 4px;
  color: var(--muted);
  text-align: center;
  border-radius: 8px;
}

.project-stage span {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 999px;
  border: 2px solid var(--line-strong);
  background: var(--surface-muted);
  color: var(--muted);
  font-size: 13px;
  font-weight: 850;
  box-shadow: 0 2px 5px color-mix(in srgb, var(--rail-bg) 06%, transparent);
}

.project-stage strong {
  min-width: 0;
  color: var(--ink);
  font-size: 12px;
  line-height: 1.2;
}

.project-stage em {
  color: var(--muted);
  font-size: 10px;
  font-style: normal;
  font-weight: 800;
  text-transform: uppercase;
}

.project-flow-arrow {
  position: relative;
  height: 2px;
  background: var(--line-strong);
}

.project-flow-arrow::after {
  content: "";
  position: absolute;
  right: -1px;
  top: 50%;
  width: 8px;
  height: 8px;
  border-top: 2px solid var(--line-strong);
  border-right: 2px solid var(--line-strong);
  transform: translateY(-50%) rotate(45deg);
}

.project-stage.done span {
  border-color: var(--status-ok-border);
  background: var(--green-soft);
  color: var(--status-ok-fg);
}

.project-stage.active.planning {
  color: var(--accent-ink);
}

.project-stage.active.requirements,
.project-stage.active.requirements-gathering {
  color: var(--orange);
}

.project-stage.active.development {
  color: var(--status-ok-fg);
}

.project-stage.active.released {
  color: var(--purple);
}

.project-stage.active.planning span {
  color: var(--accent-ink);
  border-color: var(--accent);
  background: var(--accent-soft);
}

.project-stage.active.requirements span {
  color: var(--orange);
  border-color: var(--status-warn-border);
  background: var(--orange-soft);
}

.project-stage.active.development span {
  color: var(--status-ok-fg);
  border-color: var(--status-ok-border);
  background: var(--green-soft);
}

.project-stage.active.released span {
  color: var(--purple);
  border-color: color-mix(in srgb, var(--purple) 42%, var(--border-soft));
  background: var(--purple-soft);
}

.project-readiness-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.readiness-card {
  display: grid;
  gap: 3px;
  min-height: 82px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel-bg);
}

.readiness-card span {
  color: var(--muted);
  font-size: 10px;
  font-weight: 850;
  text-transform: uppercase;
}

.readiness-card strong {
  color: var(--text-primary);
  font-size: 15px;
}

.readiness-card p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
}

.readiness-card.ok { border-color: var(--status-ok-border); background: var(--status-ok-bg); }
.readiness-card.warn { border-color: var(--status-warn-border); background: var(--status-warn-bg); }
.readiness-card.neutral { background: var(--panel-bg-subtle); }

.artifacts-page {
  display: grid;
  gap: 10px;
}

.artifact-registry {
  display: grid;
  gap: 8px;
  padding: 9px;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  background: var(--surface-raised);
}

.artifact-summary-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.artifact-summary-card,
.artifact-declare-card {
  padding: 9px;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  background: var(--surface-raised);
}

.artifact-summary-card span {
  color: var(--muted);
  font-size: 10px;
  font-weight: 850;
  text-transform: uppercase;
}

.artifact-summary-card strong {
  display: block;
  margin-top: 5px;
  font-size: 14px;
  overflow-wrap: anywhere;
}

.artifact-summary-card p,
.artifact-declare-card p {
  margin: 4px 0 0;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.35;
}

.artifact-declare-card,
.artifact-registry,
.artifact-form {
  display: grid;
  gap: 8px;
}

.artifact-declare-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: start;
  padding: 8px 9px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--titlebar);
}

.artifact-declare-head h3 {
  margin: 2px 0 3px;
  font-size: 14px;
}

.artifact-source-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  justify-content: flex-end;
}

.artifact-form-grid,
.artifact-filter-bar,
.story-filter-bar {
  display: grid;
  grid-template-columns: repeat(4, minmax(120px, 1fr));
  gap: 7px;
  align-items: start;
}

.artifact-filter-bar,
.story-filter-bar {
  padding: 8px;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  background: var(--surface-raised);
}

.story-filter-bar {
  grid-template-columns: minmax(180px, 1fr) 160px 160px;
  border-width: 0 0 1px;
  border-radius: 0;
}

.story-filter-bar-scoped {
  grid-template-columns: minmax(180px, 1fr);
}

.story-filter-stack {
  display: grid;
  grid-template-columns: repeat(2, minmax(120px, 1fr));
  gap: 7px;
}

.story-workspace-tabs {
  display: flex;
  gap: 6px;
  min-width: 0;
  overflow: auto hidden;
  padding: 8px;
  border-bottom: 1px solid var(--line-strong);
  background: var(--titlebar);
}

.story-workspace-tabs button {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex: 0 0 auto;
  min-height: 30px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--button-bg);
  color: var(--muted);
  font-size: 11px;
  font-weight: 850;
  white-space: nowrap;
}

.story-workspace-tabs button:hover {
  border-color: var(--line-strong);
  background: var(--button-hover-bg);
}

.story-workspace-tabs button.active {
  border-color: var(--accent);
  background: var(--accent-soft);
  color: var(--accent-ink);
}

.story-workspace-tabs small {
  min-width: 18px;
  border-radius: 999px;
  padding: 2px 5px;
  background: var(--surface-soft);
  color: var(--text-secondary);
  font-size: 10px;
  line-height: 1;
  text-align: center;
}

.story-scope-chip {
  display: flex;
  align-items: center;
  min-height: 30px;
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 0 8px;
  background: var(--surface-soft);
  color: var(--text);
  font-size: 12px;
  font-weight: 750;
}

.collection-pager {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  justify-content: flex-end;
  padding: 7px 8px;
  border-top: 1px solid var(--line);
  background: var(--panel-bg-subtle);
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
}

.collection-pager span {
  margin-right: auto;
}

.collection-pager strong {
  color: var(--danger);
  font-size: 11px;
}

.collection-pager button {
  min-height: 28px;
  padding: 5px 9px;
}

.ui-virtual-list {
  contain: content;
}

.artifact-form-grid .wide {
  grid-column: 1 / -1;
}

.artifact-form-grid textarea {
  min-height: 96px;
  font-size: 12px;
}

.artifact-table {
  max-height: 40vh;
  background: var(--surface-raised);
}

.artifact-table .data-row {
  grid-template-columns: minmax(190px, 1.2fr) 120px 140px 110px 90px minmax(160px, 1fr) 138px;
  min-width: 980px;
}

.artifact-row strong,
.artifact-row small {
  display: block;
}

.artifact-row small {
  margin-top: 3px;
  color: var(--muted);
  font-size: 10px;
  line-height: 1.25;
  overflow-wrap: anywhere;
}

.artifact-row-actions {
  display: flex;
  gap: 5px;
  justify-content: flex-end;
  align-items: center;
}

.artifact-row-actions button {
  min-height: 26px;
  padding: 0 7px;
  font-size: 11px;
}

.prd-document {
  display: grid;
  gap: 12px;
  padding: 12px;
}

.prd-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--line);
}

.prd-toolbar div {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 6px;
}

.story-baseline-panel {
  display: grid;
  gap: 8px;
  padding: 10px;
  border: 1px solid var(--border-strong);
  border-radius: 8px;
  background: color-mix(in srgb, var(--panel-bg-subtle) 92%, transparent);
}

.story-baseline-list {
  display: grid;
  gap: 6px;
  max-height: 230px;
  overflow: auto;
  padding-right: 4px;
  scrollbar-gutter: stable;
}

.story-generation-progress {
  display: grid;
  gap: 7px;
  padding: 9px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--panel-bg);
}

.story-generation-progress h4,
.story-generation-progress p {
  margin: 0;
}

.generation-operation-status {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(150px, 0.42fr) auto;
  align-items: center;
  gap: 12px;
  padding: 11px 13px;
  border: 1px solid var(--status-info-border);
  border-radius: 9px;
  background: var(--status-info-bg);
  color: var(--text-primary);
}

.generation-operation-status.attention {
  border-color: var(--status-warn-border);
  background: var(--status-warn-bg);
}

.generation-operation-status.complete {
  border-color: var(--status-ok-border);
  background: var(--status-ok-bg);
}

.generation-operation-copy {
  min-width: 0;
  display: flex;
  align-items: flex-start;
  gap: 9px;
}

.generation-operation-copy strong,
.generation-operation-copy p {
  display: block;
  margin: 0;
}

.generation-operation-copy p {
  margin-top: 3px;
  color: var(--text-secondary);
  font-size: 10px;
  line-height: 1.4;
}

.generation-operation-indicator {
  flex: 0 0 auto;
  width: 9px;
  height: 9px;
  margin-top: 3px;
  border-radius: 50%;
  background: var(--accent-ink);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--accent) 28%, transparent);
  animation: generation-operation-pulse 1.6s ease-in-out infinite;
}

.generation-operation-status.attention .generation-operation-indicator {
  background: var(--warning);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--warning) 20%, transparent);
  animation: none;
}

.generation-operation-status.complete .generation-operation-indicator {
  background: var(--success);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--success) 20%, transparent);
  animation: none;
}

.generation-progress-meter {
  min-width: 0;
  display: grid;
  gap: 4px;
}

.generation-progress-meter progress {
  width: 100%;
  height: 7px;
  overflow: hidden;
  border: 0;
  border-radius: 999px;
  background: var(--chart-track);
  accent-color: var(--accent-ink);
}

.generation-progress-meter progress::-webkit-progress-bar {
  border-radius: 999px;
  background: var(--chart-track);
}

.generation-progress-meter progress::-webkit-progress-value {
  border-radius: 999px;
  background: var(--accent-ink);
}

.generation-progress-meter progress::-moz-progress-bar {
  border-radius: 999px;
  background: var(--accent-ink);
}

.generation-progress-meter small {
  overflow: hidden;
  color: var(--text-secondary);
  font-size: 9px;
  line-height: 1.3;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.generation-progress-meter.compact {
  max-width: 320px;
  margin-top: 5px;
}

.running-tasks-panel {
  position: fixed;
  top: 48px;
  right: 0;
  z-index: 90;
  width: min(390px, calc(100vw - 24px));
  height: calc(100dvh - 48px);
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr);
  border-left: 1px solid var(--border-strong);
  background: var(--surface);
  box-shadow: -14px 0 34px color-mix(in srgb, var(--ink) 14%, transparent);
}

.running-tasks-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  padding: 18px;
  border-bottom: 1px solid var(--line);
}

.running-tasks-head > .metric-lightbox-close {
  min-width: 44px;
  min-height: 44px;
}

.running-tasks-head h2,
.running-tasks-head p,
.running-task-row p,
.running-tasks-empty p {
  margin: 0;
}

.running-tasks-head h2 {
  margin: 2px 0 4px;
  font-size: 19px;
}

.running-tasks-head > div > p:last-child,
.running-task-row p,
.running-tasks-empty p {
  color: var(--text-secondary);
  font-size: 11px;
  line-height: 1.45;
}

.running-tasks-list {
  min-height: 0;
  display: grid;
  align-content: start;
  gap: 10px;
  overflow: auto;
  padding: 14px;
}

.running-task-row {
  display: grid;
  gap: 9px;
  padding: 13px;
  border: 1px solid var(--status-info-border);
  border-radius: 10px;
  background: var(--status-info-bg);
}

.running-task-row.attention {
  border-color: var(--status-warn-border);
  background: var(--status-warn-bg);
}

.running-task-row.attention .generation-operation-indicator {
  background: var(--warning);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--warning) 20%, transparent);
  animation: none;
}

.running-task-title {
  display: flex;
  align-items: flex-start;
  gap: 9px;
}

.running-task-title div {
  min-width: 0;
  display: grid;
  gap: 2px;
}

.running-task-title strong,
.running-task-title small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.running-task-title small {
  color: var(--text-secondary);
  font-size: 10px;
}

.running-task-row > button {
  justify-self: start;
  min-height: 44px;
}

.running-tasks-announcement:empty {
  display: none;
}

.running-tasks-empty {
  display: grid;
  gap: 5px;
  padding: 18px;
  border: 1px dashed var(--border-strong);
  border-radius: 10px;
  background: var(--panel-bg-subtle);
}

@keyframes generation-operation-pulse {
  50% { opacity: 0.55; transform: scale(0.82); }
}

@media (prefers-reduced-motion: reduce) {
  .generation-operation-indicator { animation: none; }
}

.story-generation-list {
  display: grid;
  gap: 5px;
  max-height: 260px;
  overflow: auto;
}

.story-generation-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 8px;
  align-items: center;
  padding: 7px 8px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--panel-bg-subtle);
}

.story-generation-row strong {
  overflow: hidden;
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.story-generation-row small {
  color: var(--muted);
  font-size: 10.5px;
}

.story-generation-detail {
  grid-column: 1 / -1;
  color: var(--text-secondary);
  font-size: 11px;
}

.story-generation-detail summary {
  cursor: pointer;
  color: var(--text-primary);
  font-weight: 700;
}

.story-generation-detail p {
  margin-top: 6px;
  line-height: 1.45;
}

.story-generation-detail ul {
  display: grid;
  gap: 4px;
  margin: 6px 0 0;
  padding-left: 18px;
}

.story-baseline-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 8px;
  align-items: start;
  min-height: 62px;
  padding: 9px 8px 10px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: color-mix(in srgb, var(--panel-bg) 86%, transparent);
  text-align: left;
}

.story-baseline-row > .badge {
  align-self: start;
  margin-top: 1px;
}

.story-baseline-row:hover,
.story-baseline-row:focus-visible {
  border-color: var(--border-strong);
  background: var(--panel-bg);
}

.story-baseline-text {
  display: grid;
  gap: 3px;
  min-width: 0;
  overflow: visible;
}

.story-baseline-row strong {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.story-baseline-row strong {
  font-size: 12px;
  line-height: 1.25;
}

.story-baseline-row small {
  display: -webkit-box;
  overflow: hidden;
  color: var(--muted);
  font-size: 10.5px;
  line-height: 1.35;
  white-space: normal;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.context-editor-main {
  display: grid;
  gap: 9px;
  padding: 10px;
  border: 1px solid var(--border-soft);
  border-radius: 8px;
  background: var(--panel-bg-subtle);
}

.context-editor-main .pane-title {
  padding-bottom: 6px;
  border-bottom: 1px solid var(--terminal-fg);
}

.context-editor-main h3 {
  margin: 0;
  font-size: 14px;
}

.context-editor-grid {
  display: grid;
  grid-template-columns: minmax(180px, 0.85fr) minmax(180px, 1fr);
  gap: 8px;
}

.context-editor-text {
  grid-column: 1 / -1;
}

.context-editor-text textarea {
  min-height: 150px;
  font-size: 12px;
}

.inline-working {
  display: grid;
  grid-template-columns: 16px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  min-height: 30px;
  padding: 6px 8px;
  border: 1px solid var(--border-soft);
  border-radius: 7px;
  background: var(--accent-soft);
}

.inline-working span {
  width: 12px;
  height: 12px;
  border-radius: 999px;
  border: 2px solid var(--border-soft);
  border-top-color: var(--accent);
  animation: spin 0.85s linear infinite;
}

.inline-working p {
  margin: 0;
  color: var(--accent-ink);
  font-size: 12px;
}

.prd-rendered {
  max-height: 42vh;
  overflow: auto;
  padding: 4px 2px 8px;
}

.prd-rendered h3 {
  margin: 12px 0 6px;
  font-size: 15px;
}

.prd-rendered h4 {
  margin: 11px 0 5px;
  font-size: 13px;
}

.prd-rendered h5 {
  margin: 10px 0 4px;
  font-size: 12px;
}

.prd-rendered p,
.prd-rendered li {
  margin-bottom: 6px;
  color: var(--text-secondary);
  font-size: 12px;
  line-height: 1.45;
}

.prd-collab,
.context-summary {
  border-top: 1px solid var(--line);
  padding-top: 10px;
}

.comment-list {
  display: grid;
  gap: 6px;
  margin-bottom: 8px;
}

.comment {
  border: 1px solid var(--line);
  border-radius: 7px;
  padding: 7px 8px;
  background: var(--panel-bg-subtle);
}

.comment strong { font-size: 12px; }
.comment span { margin-left: 6px; color: var(--muted); font-size: 10px; }
.comment p { margin: 4px 0 0; font-size: 12px; color: var(--text-secondary); }
.slack-context-comment { border-left: 3px solid var(--accent); }
.slack-context-comment-head,
.slack-context-comment-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  flex-wrap: wrap;
}
.slack-context-comment-head > div { display: flex; align-items: baseline; gap: 6px; }
.slack-context-comment-meta {
  justify-content: flex-start;
  margin-top: 7px;
  color: var(--muted);
  font-size: 10px;
}
.slack-context-comment .drawer-actions { margin-top: 7px; }
.review-thread-list { gap: 9px; }
.review-thread {
  padding: 9px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel-bg-subtle);
}
.review-thread-head,
.review-thread-head > div,
.review-thread-badges,
.review-thread-actions {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
.review-thread-head { justify-content: space-between; }
.review-thread-head > div { align-items: baseline; }
.review-thread-head strong { font-size: 12px; }
.review-thread-head span:not(.badge) { color: var(--muted); font-size: 10px; }
.review-thread-badges { justify-content: flex-end; }
.review-thread .review-thread-root,
.review-thread > .requirement-comment-row {
  margin-top: 7px;
  border: 0;
  background: transparent;
}
.review-thread-resolution {
  margin-top: 8px;
  padding: 8px;
  border-left: 3px solid var(--accent);
  background: var(--surface-muted);
}
.review-thread-resolution strong { font-size: 10.5px; }
.review-thread-resolution p { margin: 4px 0 0; color: var(--text-secondary); font-size: 11.5px; line-height: 1.45; }
.review-thread-replies {
  display: grid;
  gap: 6px;
  margin: 8px 0 0 14px;
  padding-left: 9px;
  border-left: 2px solid var(--line);
}
.review-thread-reply,
.review-thread-reply-wrap {
  min-width: 0;
}
.review-thread-reply {
  padding: 7px 8px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-muted);
}
.review-thread-reply > div { display: flex; align-items: baseline; gap: 6px; }
.review-thread-reply strong { font-size: 11px; }
.review-thread-reply span { color: var(--muted); font-size: 9.5px; }
.review-thread-reply p { margin: 4px 0 0; color: var(--text-secondary); font-size: 11.5px; line-height: 1.45; }
.review-thread-reply-wrap { position: relative; }
.review-thread-reply-wrap .comment-relevance-indicator,
.review-thread-reply-wrap .comment-relevance-actions { margin-bottom: 4px; }
.review-thread-actions { align-items: flex-start; margin-top: 8px; }
.review-thread-action { min-width: 150px; }
.review-thread-action summary { color: var(--accent-ink); font-size: 10.5px; font-weight: 800; cursor: pointer; }
.review-thread-action form { display: grid; gap: 7px; min-width: min(360px, 72vw); margin-top: 7px; }
.review-thread-action label { display: grid; gap: 4px; color: var(--text-secondary); font-size: 10px; font-weight: 750; }
.review-thread-action textarea { min-height: 68px; resize: vertical; }
.review-thread-action button { justify-self: end; min-height: 28px; }
.review-thread-fields { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; }
.comment-relevance-actions,
.comment-relevance-indicator {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.comment-relevance-actions { margin-bottom: 5px; }
.comment-relevance-actions button {
  min-height: 24px;
  padding: 3px 6px;
  border-color: var(--line);
  background: var(--surface-raised);
  color: var(--text-secondary);
  font-size: 10px;
}
.comment-relevance-actions button[aria-pressed="true"] {
  border-color: var(--accent);
  background: var(--accent-soft);
  color: var(--accent-ink);
}
.comment-relevance-indicator { color: var(--muted); font-size: 11px; }
.comment-relevance-indicator small { color: inherit; font-size: 9.5px; font-weight: 750; }
.comment-relevance-indicator.relevant { color: var(--status-ok-fg); }
.comment-relevance-indicator.not-relevant { color: var(--status-danger-fg); }
@media (max-width: 760px) {
  .review-thread-fields { grid-template-columns: 1fr; }
  .review-thread-action,
  .review-thread-action form { width: 100%; min-width: 0; }
  .review-thread-action button { width: 100%; min-height: 44px; }
  .comment-relevance-actions { width: 100%; }
  .comment-relevance-actions button { flex: 1; min-height: 44px; }
}
.empty-note { margin: 0 0 8px; font-size: 12px; }

.context-summary li {
  display: grid;
  gap: 2px;
  margin-bottom: 7px;
  font-size: 12px;
}

.context-summary li span {
  color: var(--muted);
}

.story-table {
  border: 1px solid var(--line);
  border-radius: 8px;
  overflow: hidden;
  max-width: 100%;
  min-width: 0;
  background: var(--surface-raised);
}

.stories-viewport {
  max-width: 100%;
  min-width: 0;
}

.sprint-planner-card {
  display: grid;
  gap: 8px;
  margin-bottom: 8px;
  padding: 8px;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  background: var(--surface-raised);
}

.sprint-planner-head {
  margin: -8px -8px 0;
  padding: 8px 10px;
  border-bottom: 1px solid var(--line-strong);
  border-radius: 8px 8px 0 0;
  background: var(--titlebar);
}

.sprint-planner-head h3 {
  margin: 2px 0 3px;
  font-size: 14px;
}

.sprint-planner-head p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.sprint-form {
  display: grid;
  grid-template-columns: minmax(160px, 1fr) 132px 132px auto;
  gap: 7px;
  align-items: end;
}

.sprint-gantt {
  display: grid;
  grid-template-columns: 132px minmax(0, 1fr);
  gap: 4px 8px;
  overflow: hidden;
  padding: 8px;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  background: var(--surface-soft);
}

.sprint-gantt.empty {
  display: grid;
  grid-template-columns: 1fr;
  place-items: center;
  min-height: 48px;
  color: var(--muted);
  font-size: 12px;
}

.sprint-gantt-axis {
  position: relative;
  grid-column: 2;
  height: 18px;
  border-bottom: 1px solid var(--line-strong);
  color: var(--muted);
  font-size: 9px;
}

.sprint-train-legend {
  display: grid;
  align-content: center;
  min-width: 0;
  height: 30px;
  padding: 0 6px;
}

.sprint-train-legend strong,
.sprint-train-legend span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sprint-train-legend strong {
  color: var(--accent);
  font-size: 9px;
}

.sprint-train-legend span {
  color: var(--muted);
  font-size: 8px;
}

.sprint-gantt-axis.with-train {
  height: 30px;
}

.sprint-gantt-axis span {
  position: absolute;
  top: 0;
  transform: translateX(-50%);
  white-space: nowrap;
}

.sprint-gantt-axis span:first-child {
  transform: translateX(0);
}

.sprint-gantt-axis span:last-child {
  transform: translateX(-100%);
}

.sprint-train-axis-marker {
  position: absolute;
  top: 13px;
  bottom: -1px;
  z-index: 2;
  width: 0;
  border-left: 1px dashed var(--accent);
  color: var(--accent);
  pointer-events: none;
}

.sprint-train-axis-marker small {
  position: absolute;
  top: -1px;
  left: 3px;
  font-size: 8px;
  font-style: normal;
  font-weight: 900;
  white-space: nowrap;
}

.sprint-gantt-row {
  display: contents;
}

.sprint-gantt-label {
  min-width: 0;
  padding: 5px 6px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-raised);
}

.sprint-gantt-label strong,
.sprint-gantt-label span {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sprint-gantt-label strong {
  color: var(--ink);
  font-size: 11px;
}

.sprint-gantt-label span {
  margin-top: 2px;
  color: var(--muted);
  font-size: 9px;
}

.sprint-gantt-track {
  position: relative;
  min-height: 34px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-muted);
}

.sprint-train-milestone-line {
  position: absolute;
  inset-block: 0;
  z-index: 3;
  width: 0;
  border-left: 1px dashed var(--accent);
  pointer-events: none;
}

.sprint-gantt-bar {
  position: absolute;
  z-index: 2;
  top: 5px;
  bottom: 5px;
  min-width: 48px;
  overflow: hidden;
  padding: 0 26px 0 8px;
  border: 1px solid color-mix(in srgb, var(--accent) 58%, var(--line));
  border-left: 4px solid var(--accent);
  border-radius: 6px;
  background: color-mix(in srgb, var(--accent-soft) 78%, var(--surface-raised));
  box-shadow: 0 4px 10px color-mix(in srgb, var(--rail-bg) 08%, transparent);
}

.sprint-gantt-bar:hover {
  border-color: var(--accent);
  background: var(--surface-selected);
  box-shadow: 0 7px 18px color-mix(in srgb, var(--rail-bg) 14%, transparent);
}

.sprint-progress-fill {
  position: absolute;
  inset: 0 auto 0 0;
  max-width: 100%;
  background: color-mix(in srgb, var(--green) 24%, transparent);
}

.sprint-gantt-bar-text {
  position: relative;
  z-index: 1;
  display: block;
  overflow: hidden;
  height: 100%;
  color: var(--accent-ink);
  font-size: 9px;
  font-weight: 800;
  line-height: 20px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sprint-gantt-bar button {
  position: absolute;
  z-index: 2;
  top: 5px;
  right: 5px;
  min-width: 16px;
  min-height: 16px;
  padding: 0;
  font-size: 10px;
}

.manual-story-card {
  display: grid;
  gap: 8px;
  margin-bottom: 8px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-raised);
}

.manual-story-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: start;
}

.manual-story-card h3 {
  margin: 2px 0 3px;
  font-size: 14px;
}

.manual-story-card p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.story-label-panel {
  display: grid;
  gap: 8px;
  margin-bottom: 8px;
  scroll-margin-top: 12px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-raised);
}

.story-label-panel:focus {
  outline: 2px solid var(--focus-ring);
  outline-offset: 2px;
}

.story-label-panel-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: start;
}

.story-label-panel h3 {
  margin: 2px 0 3px;
  font-size: 14px;
}

.story-label-panel p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.story-label-grid {
  display: grid;
  max-height: 220px;
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-raised);
}

.story-label-row {
  display: grid;
  grid-template-columns: minmax(180px, 0.9fr) minmax(260px, 1.4fr);
  gap: 10px;
  align-items: center;
  padding: 7px 9px;
  border-bottom: 1px solid var(--line);
}

.story-label-row:last-child { border-bottom: 0; }

.story-label-row.locked {
  background: var(--surface-muted);
}

.story-label-row strong,
.story-label-row span {
  display: block;
  font-size: 11px;
}

.story-label-row > div:first-child > span {
  margin-top: 2px;
  color: var(--muted);
}

.story-label-row small {
  display: block;
  margin-top: 3px;
  color: var(--muted);
  font-size: 10px;
}

.story-label-row.locked .label-checkboxes {
  opacity: 0.62;
}

.label-checkboxes {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 9px;
}

.story-label-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 3px;
  margin: 2px 0 0;
}

.story-meta-badge {
  max-width: 160px;
  overflow: hidden;
  text-overflow: ellipsis;
}

.story-meta-sprint {
  border-color: var(--border-soft);
  background: var(--accent-soft);
  color: var(--accent-ink);
}

.story-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 150px;
  gap: 10px;
  align-items: start;
  padding: 8px 10px;
  border-bottom: 1px solid var(--line);
  background: var(--surface-raised);
  min-width: 0;
}

.story-row:last-child { border-bottom: 0; }
.story-row:hover { background: var(--surface-selected); }
.story-row-main {
  display: grid;
  gap: 3px;
  min-width: 0;
}
.story-row strong { display: block; font-size: 11px; }
.story-row small { display: block; color: var(--muted); margin-top: 3px; line-height: 1.3; }
.story-action-label { color: var(--muted); font-size: 12px; font-weight: 750; }

.story-row small.story-agent-status {
  width: fit-content;
  max-width: 100%;
  overflow: hidden;
  padding: 2px 6px;
  border: 1px solid var(--border-soft);
  border-radius: 999px;
  background: var(--chip-muted);
  color: var(--text-primary);
  font-size: 10px;
  font-weight: 850;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.story-title-truncate,
.story-line-truncate {
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.story-row-controls {
  display: grid;
  grid-template-columns: repeat(4, minmax(96px, 1fr));
  gap: 6px;
  margin-top: 4px;
  min-width: 0;
}

.story-row-action-cell {
  display: grid;
  gap: 8px;
  justify-items: end;
  align-content: start;
}

.story-status-stack {
  display: grid;
  gap: 4px;
  justify-items: end;
}

.story-select-label {
  display: grid;
  gap: 3px;
  color: var(--muted);
  font-size: 10px;
  font-weight: 750;
}

.story-select-label select,
.story-select-label input {
  min-height: 30px;
  padding: 4px 7px;
  font-size: 12px;
  min-width: 0;
  width: 100%;
}

.story-points-card {
  grid-template-columns: minmax(0, 1fr) auto auto;
  align-items: end;
}

.story-points-card > strong {
  font-size: 18px;
}

.story-points-edit {
  display: grid;
  gap: 3px;
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
}

.story-points-edit input {
  width: 76px;
  min-height: 30px;
  padding: 4px 7px;
}

.kanban-viewport {
  gap: 0;
  background: var(--surface-soft);
}

.kanban-card {
  display: grid;
  gap: 9px;
  min-width: 0;
  padding: 9px;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  background: var(--surface-raised);
}

.kanban-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: start;
  padding: 8px;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  background: var(--titlebar);
}

.kanban-head h3 {
  margin: 2px 0 3px;
  font-size: 14px;
}

.kanban-head p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.kanban-summary {
  display: grid;
  grid-template-columns: repeat(2, minmax(72px, 1fr));
  gap: 5px;
  min-width: 170px;
}

.kanban-summary span {
  display: grid;
  gap: 1px;
  padding: 5px 7px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-raised);
  color: var(--muted);
  font-size: 10px;
  font-weight: 750;
}

.kanban-summary strong {
  color: var(--ink);
  font-size: 14px;
}

.kanban-board {
  display: grid;
  grid-template-columns: repeat(5, minmax(156px, 1fr));
  gap: 8px;
  min-width: 0;
  overflow-x: auto;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-soft);
}

.kanban-column {
  display: grid;
  grid-template-rows: auto minmax(180px, 1fr);
  min-width: 156px;
  overflow: hidden;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  background: var(--surface-muted);
}

.kanban-column-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: start;
  padding: 7px 8px;
  border-bottom: 1px solid var(--line-strong);
  background: var(--titlebar);
}

.kanban-column-head strong {
  display: block;
  font-size: 12px;
}

.kanban-column-head span {
  display: block;
  margin-top: 2px;
  color: var(--muted);
  font-size: 10px;
  line-height: 1.25;
}

.kanban-column-head b {
  padding: 2px 5px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--chip-muted);
  color: var(--muted);
  font-size: 10px;
  white-space: nowrap;
}

.kanban-column-body {
  display: grid;
  align-content: start;
  gap: 4px;
  max-height: 520px;
  overflow: auto;
  padding: 5px;
  background: var(--surface-muted);
}

.kanban-story {
  position: relative;
}

.kanban-story button {
  position: relative;
  display: grid;
  width: 100%;
  min-width: 0;
  gap: 3px;
  min-height: 34px;
  padding: 5px 6px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--surface-raised);
  color: inherit;
  text-align: left;
  text-decoration: none;
  box-shadow: 0 3px 8px color-mix(in srgb, var(--rail-bg) 06%, transparent);
}

.kanban-story button:hover,
.kanban-story button:focus-visible {
  border-color: var(--accent);
  background: var(--surface-selected);
  box-shadow: 0 6px 16px color-mix(in srgb, var(--rail-bg) 11%, transparent);
}

.kanban-story-compact {
  display: grid;
  grid-template-columns: minmax(54px, auto) minmax(0, 1fr) auto;
  gap: 5px;
  align-items: center;
  min-width: 0;
}

.kanban-story-key {
  color: var(--accent);
  font-size: 10px;
  font-weight: 850;
  white-space: nowrap;
}

.kanban-story-status {
  overflow: hidden;
  color: var(--muted);
  font-size: 9px;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.kanban-story-points {
  display: inline-grid;
  place-items: center;
  min-width: 18px;
  height: 18px;
  padding: 0 4px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--chip-muted);
  color: var(--muted);
  font-size: 9px;
  font-weight: 850;
}

.kanban-story-progress {
  position: relative;
  display: block;
  height: 3px;
  overflow: hidden;
  border-radius: 999px;
  background: var(--surface-muted);
}

.kanban-story-progress i {
  display: block;
  height: 100%;
  max-width: 100%;
  border-radius: inherit;
  background: color-mix(in srgb, var(--green) 55%, transparent);
}

.kanban-story-meta,
.kanban-assignees,
.kanban-blockers {
  display: flex;
  flex-wrap: wrap;
  gap: 3px;
  min-width: 0;
}

.kanban-mini-flags {
  display: flex;
  gap: 3px;
  min-width: 0;
}

.kanban-mini-flags em {
  display: inline-block;
  max-width: 72px;
  overflow: hidden;
  padding: 1px 4px;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--muted);
  font-size: 8px;
  font-style: normal;
  font-weight: 850;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.kanban-story-preview {
  position: absolute;
  z-index: 40;
  top: calc(100% + 5px);
  left: 0;
  display: none;
  width: min(280px, 72vw);
  gap: 6px;
  padding: 9px;
  border: 1px solid var(--line-strong);
  border-radius: 7px;
  background: var(--surface-raised);
  box-shadow: var(--shadow-strong);
}

.kanban-story button:hover .kanban-story-preview,
.kanban-story button:focus-visible .kanban-story-preview,
.kanban-story button:focus-within .kanban-story-preview {
  display: grid;
}

.kanban-story-preview strong {
  color: var(--ink);
  font-size: 12px;
  line-height: 1.3;
}

.kanban-preview-labels {
  display: flex;
  flex-wrap: wrap;
  gap: 3px;
}

.kanban-preview-labels em {
  display: inline-block;
  padding: 1px 5px;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--muted);
  font-size: 9px;
  font-style: normal;
  font-weight: 850;
}

.kanban-assignees small {
  color: var(--muted);
  font-size: 10px;
  font-weight: 750;
}

.kanban-blockers em {
  display: inline-block;
  max-width: 92px;
  overflow: hidden;
  padding: 1px 5px;
  border: 1px solid color-mix(in srgb, var(--orange) 56%, var(--line));
  border-radius: 999px;
  background: var(--orange-soft);
  color: var(--orange);
  font-size: 9px;
  font-style: normal;
  font-weight: 850;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.kanban-empty {
  padding: 12px 8px;
  border: 1px dashed var(--line);
  border-radius: 7px;
  background: var(--surface-raised);
  color: var(--muted);
  font-size: 11px;
  text-align: center;
}

.story-row-actions {
  display: flex;
  gap: 6px;
  justify-content: flex-end;
  flex-wrap: wrap;
  align-self: end;
}

.story-sprint-group {
  display: grid;
  min-width: 0;
}

.story-sprint-group + .story-sprint-group {
  border-top: 1px solid var(--line);
}

.story-sprint-head {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  align-items: center;
  padding: 7px 10px;
  background: var(--titlebar);
  border-bottom: 1px solid var(--line);
}

.story-sprint-head strong {
  font-size: 12px;
}

.story-sprint-head span {
  color: var(--muted);
  font-size: 11px;
}

.story-sprint-table-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 150px;
  gap: 10px;
  padding: 5px 10px;
  border-bottom: 1px solid var(--line);
  background: var(--titlebar-strong);
  color: var(--muted);
  font-size: 10px;
  font-weight: 850;
  text-transform: uppercase;
}

.story-sprint-table-head span:last-child {
  text-align: right;
}

.story-form {
  display: grid;
  gap: 10px;
}

.story-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
}

.story-form-grid.compact {
  grid-template-columns: repeat(auto-fit, minmax(132px, 1fr));
  align-items: start;
}

.story-form-grid.compact textarea {
  min-height: 42px;
}

.story-form-grid label {
  display: grid;
  gap: 4px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 750;
}

.story-form-grid .wide {
  grid-column: 1 / -1;
}

.story-form-grid textarea {
  min-height: 62px;
  resize: vertical;
}

.story-detail-page {
  display: grid;
  gap: 12px;
}

.story-detail-head {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 12px;
  align-items: start;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--line);
}

.story-detail-head h3 {
  margin: 2px 0 4px;
  font-size: 16px;
}

.story-detail-head p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.4;
}

.git-lifecycle {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(76px, 1fr);
  gap: 0;
  align-items: center;
  overflow: auto hidden;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-soft);
}

.git-stage {
  min-width: 76px;
  display: grid;
  justify-items: center;
  gap: 5px;
  min-height: 82px;
  padding: 6px 4px;
  color: var(--muted);
  text-align: center;
}

.git-stage span {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  border-radius: 999px;
  border: 2px solid var(--line-strong);
  color: var(--muted);
  background: var(--surface-raised);
  font-size: 13px;
  font-weight: 850;
  box-shadow: 0 2px 5px color-mix(in srgb, var(--rail-bg) 8%, transparent);
}

.git-stage strong {
  min-width: 0;
  font-size: 11px;
  line-height: 1.2;
}

.git-stage em {
  color: var(--muted);
  font-size: 9px;
  font-style: normal;
  font-weight: 800;
  text-transform: uppercase;
}

.git-stage.done span {
  color: var(--green);
  border-color: color-mix(in srgb, var(--green) 52%, var(--border-soft));
  background: var(--green-soft);
}

.git-stage.active {
  color: var(--accent-ink);
}

.git-stage.active span {
  color: var(--accent-ink);
  border-color: color-mix(in srgb, var(--accent) 58%, var(--border-soft));
  background: var(--accent-soft);
}

.git-flow-arrow {
  position: relative;
  width: 28px;
  height: 2px;
  background: var(--line-strong);
}

.git-flow-arrow::after {
  content: "";
  position: absolute;
  right: -1px;
  top: 50%;
  width: 8px;
  height: 8px;
  border-top: 2px solid var(--line-strong);
  border-right: 2px solid var(--line-strong);
  transform: translateY(-50%) rotate(45deg);
}

.story-git-card {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  background: var(--surface-raised);
}

.story-git-card h4 {
  margin: 0 0 4px;
  font-size: 13px;
}

.story-git-card p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.4;
}

.story-acceptance-list {
  display: grid;
  gap: 8px;
}

.story-acceptance-list article {
  display: grid;
  gap: 5px;
  padding: 9px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-soft);
}

.story-acceptance-scenario {
  display: flex;
  align-items: center;
  gap: 7px;
  margin-bottom: 2px;
}

.story-acceptance-scenario span {
  display: grid;
  flex: 0 0 auto;
  place-items: center;
  width: 21px;
  height: 21px;
  border-radius: 999px;
  background: var(--accent-soft);
  color: var(--accent-ink);
  font-size: 10px;
  font-weight: 850;
}

.story-acceptance-scenario h5 {
  margin: 0;
  color: var(--ink);
  font-size: 12px;
}

.story-acceptance-clause {
  display: grid;
  grid-template-columns: 46px minmax(0, 1fr);
  gap: 7px;
  align-items: start;
}

.story-acceptance-clause > strong {
  color: var(--muted);
  font-size: 10px;
  line-height: 1.7;
  text-transform: uppercase;
}

.story-acceptance-clause.outcome {
  padding-top: 4px;
  border-top: 1px solid var(--line);
}

.story-acceptance-copy {
  padding: 9px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-soft);
}

.story-editor-card {
  background: var(--panel-bg-subtle);
}

.story-record-action-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 8px;
}

.story-record-action-grid > div {
  display: grid;
  gap: 3px;
  padding: 9px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-soft);
}

.story-record-action-grid strong {
  color: var(--ink);
  font-size: 12px;
}

.story-record-action-grid .helper {
  margin: 0;
  font-size: 11px;
  line-height: 1.35;
}

.implementation-card {
  background: var(--panel-bg);
}

.implementation-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: start;
}

.implementation-summary {
  padding: 9px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--panel-bg-subtle);
}

.implementation-summary h1,
.implementation-summary h2,
.implementation-summary h3 {
  margin: 0 0 6px;
  font-size: 13px;
}

.implementation-summary p,
.implementation-summary li {
  color: var(--text-secondary);
  font-size: 12px;
  line-height: 1.4;
}

.implementation-summary ul {
  margin: 5px 0 0;
  padding-left: 18px;
}

.implementation-interactions {
  display: grid;
  gap: 6px;
}

.implementation-interactions article {
  display: grid;
  gap: 3px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--panel-bg-subtle);
}

.implementation-interactions strong {
  color: var(--text-primary);
  font-size: 12px;
}

.implementation-interactions small {
  color: var(--muted);
  font-size: 10px;
  font-weight: 700;
}

.implementation-form {
  padding-top: 2px;
}

.figma-card {
  background: var(--panel-bg-subtle);
}

.figma-object-list {
  display: grid;
  gap: 7px;
}

.figma-object-card {
  display: grid;
  gap: 5px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--panel-bg-subtle);
}

.figma-object-card > div:first-child {
  display: grid;
  gap: 2px;
}

.figma-object-card strong {
  color: var(--text-primary);
  font-size: 12px;
}

.figma-object-card small,
.figma-object-card p,
.figma-file {
  margin: 0;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.35;
}

.figma-object-card a {
  color: var(--accent-ink);
  font-size: 11px;
  font-weight: 800;
  overflow-wrap: anywhere;
}

.figma-object-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.figma-object-actions a,
.button-like {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 28px;
  padding: 5px 9px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--panel-bg);
  color: var(--text-primary);
  font-size: 11px;
  font-weight: 850;
  text-decoration: none;
}

.figma-object-actions a:hover,
.button-like:hover {
  background: var(--panel-bg-selected);
  border-color: var(--border-strong);
  color: var(--accent-ink);
}

.figma-object-preview {
  max-height: 120px;
  overflow: auto;
  margin: 0;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--panel-header-bg);
  color: var(--text-primary);
  font-family: var(--font-mono);
  font-size: 11px;
  line-height: 1.45;
  white-space: pre-wrap;
}

.figma-object-form {
  padding-top: 3px;
}

.story-context-list {
  display: grid;
  gap: 6px;
  margin: 2px 0 0;
  padding: 0;
  list-style: none;
}

.story-context-list li {
  display: grid;
  gap: 3px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--panel-bg-subtle);
}

.story-dependency-card {
  gap: 8px;
}

.dependency-columns {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.dependency-columns > div {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.dependency-columns strong {
  color: var(--text-primary);
  font-size: 11px;
}

.dependency-chip-list {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  min-height: 24px;
  align-items: center;
}

.dependency-chip {
  display: inline-flex;
  max-width: 100%;
  align-items: center;
  overflow: hidden;
  border: 1px solid var(--border-soft);
  border-radius: 999px;
  background: var(--chip-muted);
}

.dependency-chip button {
  min-height: 22px;
  max-width: 260px;
  overflow: hidden;
  padding: 0 8px;
  border: 0;
  background: transparent;
  color: var(--text-primary);
  font-size: 10.5px;
  font-weight: 750;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dependency-chip button:hover {
  color: var(--accent-ink);
}

.dependency-chip .dependency-remove {
  width: 22px;
  padding: 0;
  color: var(--text-secondary);
  font-size: 14px;
}

.dependency-chip .dependency-remove:hover {
  color: var(--danger);
  background: var(--danger-soft);
}

.dependency-add-row {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) auto;
  gap: 8px;
  align-items: end;
}

.dependency-add-row input {
  height: 30px;
  font-size: 11.5px;
}

.story-context-list strong {
  color: var(--text-primary);
  font-size: 11px;
}

.story-context-list span {
  color: var(--muted);
  font-size: 11px;
  line-height: 1.35;
}

.story-evidence-panel {
  display: grid;
  gap: 8px;
  margin-top: 10px;
}

.story-evidence-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 7px;
}

.story-evidence-row {
  min-width: 0;
}

.story-evidence-row.figma { background: var(--accent-soft); }
.story-evidence-row.comment { background: var(--orange-soft); }
.story-evidence-row.document { background: var(--panel-bg-subtle); }
.story-evidence-row.plan,
.story-evidence-row.markdown { background: var(--green-soft); }

.story-git-card dl {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 8px;
  margin: 0;
}

.story-git-card dl div {
  display: grid;
  gap: 2px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--surface-soft);
}

.story-git-card dt {
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
}

.story-git-card dd {
  min-width: 0;
  margin: 0;
  overflow-wrap: anywhere;
  color: var(--ink);
  font-size: 12px;
  font-weight: 750;
}

.thread-story-summary-card .implementation-head {
  align-items: center;
}

.thread-story-summary-card dl {
  grid-template-columns: minmax(0, 1.45fr) minmax(0, 1fr);
}

.thread-story-summary-card dd small {
  display: block;
  margin-top: 4px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 500;
  line-height: 1.4;
}

.thread-story-points {
  flex: 0 0 auto;
  white-space: nowrap;
}

@media (max-width: 720px) {
  .thread-story-summary-card dl {
    grid-template-columns: minmax(0, 1fr);
  }
}

.jira-subtask-list {
  display: grid;
  gap: 6px;
}

.jira-subtask-list-head,
.jira-subtask-row {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 8px;
}

.jira-subtask-list-head {
  color: var(--muted);
  font-size: 11px;
}

.jira-subtask-list-head strong {
  color: var(--ink);
  font-size: 12px;
}

.jira-subtask-row {
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--surface-soft);
}

.jira-subtask-row strong,
.jira-subtask-row small {
  display: block;
  min-width: 0;
  overflow-wrap: anywhere;
}

.jira-subtask-row small {
  color: var(--muted);
}

.handoff-card {
  border-color: color-mix(in srgb, var(--accent) 52%, var(--border-soft));
  background: var(--accent-soft);
}

.agent-dispatch-card {
  border-color: var(--border-soft);
  background: var(--panel-bg-subtle);
}

.development-design-gate {
  border-color: color-mix(in srgb, var(--accent) 44%, var(--border-soft));
  background: color-mix(in srgb, var(--accent-soft) 42%, var(--panel-bg));
}

.development-mode-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.development-mode-card {
  min-height: 78px;
  display: grid;
  gap: 4px;
  align-content: start;
  justify-items: start;
  padding: 9px;
  border-color: var(--line);
  background: var(--panel-bg);
  text-align: left;
}

.development-mode-card.active {
  border-color: color-mix(in srgb, var(--accent) 62%, var(--border-soft));
  background: var(--accent-soft);
  box-shadow: inset 0 -3px 0 var(--accent);
}

.development-mode-card strong {
  color: var(--text-primary);
  font-size: 12px;
}

.development-mode-card span {
  color: var(--text-secondary);
  font-size: 11px;
  line-height: 1.35;
}

.development-stage-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(190px, auto);
  gap: 10px;
  align-items: start;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--panel-bg);
}

.development-stage-row.active {
  border-color: color-mix(in srgb, var(--orange) 58%, var(--border-soft));
  background: var(--orange-soft);
}

.development-stage-row.ready {
  border-color: color-mix(in srgb, var(--green) 50%, var(--border-soft));
  background: var(--green-soft);
}

.development-stage-row.locked {
  background: var(--panel-bg-muted);
  color: var(--text-secondary);
}

.development-stage-row strong {
  display: block;
  margin-top: 5px;
  color: var(--text-primary);
  font-size: 12px;
}

.development-stage-actions {
  display: grid;
  gap: 7px;
  justify-items: stretch;
  min-width: 190px;
}

.development-stage-actions label {
  margin: 0;
}

.story-agent-attention {
  display: grid;
  gap: 8px;
  padding: 10px;
  border: 1px solid color-mix(in srgb, var(--orange) 54%, var(--border-soft));
  border-radius: 7px;
  background: var(--orange-soft);
}

.agent-attention-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: start;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--panel-bg);
}

.agent-attention-row > div:last-child {
  display: flex;
  gap: 6px;
  align-items: center;
}

.agent-recommendation {
  display: grid;
  gap: 4px;
  padding: 8px 10px;
  border: 1px solid color-mix(in srgb, var(--green) 52%, var(--border-soft));
  border-radius: 7px;
  background: var(--green-soft);
  color: var(--text-primary);
}

.agent-recommendation.muted {
  border-color: var(--border-soft);
  background: var(--panel-bg-muted);
  color: var(--text-primary);
}

.agent-recommendation > div {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  justify-content: space-between;
}

.agent-recommendation strong {
  font-size: 12px;
}

.agent-recommendation span {
  padding: 1px 6px;
  border: 1px solid color-mix(in srgb, var(--green) 58%, var(--border-soft));
  border-radius: 999px;
  background: var(--panel-bg);
  color: var(--green);
  font-size: 10px;
  font-weight: 850;
}

.agent-recommendation p,
.agent-recommendation ul {
  margin: 0;
}

.agent-recommendation p,
.agent-recommendation li,
.agent-recommendation small {
  font-size: 11px;
  line-height: 1.35;
}

.agent-recommendation ul {
  display: grid;
  gap: 2px;
  padding-left: 16px;
}

.agent-recommendation small {
  color: var(--text-secondary);
  font-weight: 750;
}

.agent-dispatch-form {
  display: grid;
  grid-template-columns: minmax(180px, .8fr) minmax(260px, 1.2fr) auto;
  gap: 8px;
  align-items: end;
}

.agent-dispatch-form .wide {
  min-width: 0;
}

.agent-dispatch-form textarea {
  min-height: 48px;
  font-size: 11.5px;
}

.agent-task-list {
  display: grid;
  gap: 6px;
}

.agent-task-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(120px, .45fr) auto;
  gap: 8px;
  align-items: start;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--panel-bg);
}

.agent-task-row strong,
.agent-task-row small,
.agent-task-row span {
  display: block;
}

.agent-task-row strong {
  font-size: 12px;
}

.agent-task-row small {
  color: var(--muted);
  font-size: 10px;
  font-weight: 750;
}

.agent-task-row p {
  margin-top: 3px;
  font-size: 11px;
}

.agent-task-jira {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  padding: 4px 6px;
  border: 1px solid color-mix(in srgb, var(--accent) 42%, var(--border-soft));
  border-radius: 6px;
  background: var(--accent-soft);
  color: var(--text-primary);
  font-size: 10px;
}

.agent-task-jira span {
  display: inline-block;
  color: var(--accent-ink);
  font-weight: 850;
  text-transform: uppercase;
}

.agent-task-jira small {
  display: block;
  min-width: 0;
  overflow: hidden;
  color: var(--text-secondary);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.agent-task-jira a {
  color: var(--accent-ink);
  font-weight: 750;
}

.agent-task-execution-status {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(180px, .56fr);
  gap: 8px 10px;
  min-width: 0;
  padding: 8px;
  border: 1px solid var(--status-neutral-border);
  border-radius: 7px;
  background: var(--status-neutral-bg);
}

.agent-task-execution-status.warn {
  border-color: var(--status-warn-border);
  background: var(--status-warn-bg);
}

.agent-task-execution-status.danger {
  border-color: var(--status-danger-border);
  background: var(--status-danger-bg);
}

.agent-task-execution-status.ok {
  border-color: var(--status-ok-border);
  background: var(--status-ok-bg);
}

.agent-task-execution-status strong {
  display: block;
  color: var(--text-primary);
  font-size: 11px;
}

.agent-task-execution-status p,
.agent-task-execution-status small {
  margin: 3px 0 0;
  color: var(--text-secondary);
  font-size: 10.5px;
  line-height: 1.35;
}

.agent-task-execution-status small {
  grid-column: 1 / -1;
  font-weight: 750;
}

.agent-task-execution-status dl {
  display: grid;
  gap: 4px;
  margin: 0;
}

.agent-task-execution-status dl div {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  min-width: 0;
}

.agent-task-execution-status dt,
.agent-task-execution-status dd {
  margin: 0;
  color: var(--text-secondary);
  font-size: 10px;
}

.agent-task-execution-status dd {
  color: var(--text-primary);
  font-weight: 800;
  text-align: right;
}

.agent-task-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  justify-content: flex-end;
}

.agent-task-actions button,
.agent-console-actions button {
  min-height: 26px;
  padding: 0 8px;
  font-size: 10.5px;
  font-weight: 750;
}

.agent-task-followup {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: minmax(0, 1fr) max-content;
  gap: 6px;
  align-items: stretch;
}

.agent-task-followup textarea {
  min-height: 34px;
  max-height: 78px;
  padding: 6px 8px;
  font-size: 11px;
  line-height: 1.35;
}

.agent-task-followup button {
  min-height: 34px;
  padding: 0 10px;
  font-size: 10.5px;
  font-weight: 800;
  white-space: nowrap;
}

.agent-clarification-panel {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: minmax(0, 1fr) minmax(130px, .45fr) minmax(180px, .7fr) max-content;
  gap: 7px;
  align-items: end;
  padding: 8px;
  border: 1px solid color-mix(in srgb, var(--orange) 48%, var(--line));
  border-radius: 7px;
  background: color-mix(in srgb, var(--orange-soft) 62%, var(--panel-bg));
}

.agent-clarification-panel strong {
  display: block;
  color: var(--text-primary);
  font-size: 11px;
  font-weight: 900;
}

.agent-clarification-panel p {
  margin: 2px 0 0;
  color: var(--text-primary);
  font-size: 11px;
  line-height: 1.35;
}

.agent-clarification-panel label {
  display: grid;
  gap: 3px;
  min-width: 0;
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
}

.agent-clarification-panel select,
.agent-clarification-panel textarea {
  width: 100%;
  min-width: 0;
  font-size: 11px;
}

.agent-clarification-panel textarea {
  min-height: 34px;
  max-height: 82px;
  padding: 6px 8px;
  line-height: 1.35;
}

.agent-clarification-panel button {
  min-height: 34px;
  padding: 0 10px;
  font-size: 10.5px;
  font-weight: 850;
  white-space: nowrap;
}

.agent-step-list {
  display: grid;
  gap: 6px;
  margin: 8px 0;
}

.agent-step-list span {
  display: block;
  border-left: 3px solid var(--border-strong);
  padding-left: 8px;
  color: var(--text-secondary);
  font-size: 0.85rem;
}

.agent-step-list b {
  color: var(--text-primary);
}

.kanban-agent-status {
  display: inline-flex;
  width: fit-content;
  max-width: 100%;
  overflow: hidden;
  border: 1px solid var(--border-soft);
  border-radius: 999px;
  background: var(--chip-muted);
  color: var(--text-primary);
}

.kanban-agent-status b,
.kanban-agent-status em {
  display: inline-block;
  overflow: hidden;
  padding: 1px 5px;
  font-size: 9px;
  font-style: normal;
  font-weight: 850;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.kanban-agent-status b {
  max-width: 86px;
  border-right: 1px solid var(--border-soft);
}

.kanban-agent-status em {
  max-width: 72px;
  color: var(--text-secondary);
}

.developer-agent-console {
  display: grid;
  gap: 8px;
  min-height: 0;
}

.developer-agent-console .agent-flow-canvas {
  min-height: 360px;
  height: clamp(360px, 42vh, 540px) !important;
}

.developer-agent-console .agent-console-grid.compact {
  min-height: 180px;
}

.agent-console-head {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  justify-content: space-between;
  padding: 9px 10px;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  background: var(--panel-bg-subtle);
}

.agent-console-head h3,
.agent-console-head p {
  margin: 0;
}

.agent-console-metrics {
  display: grid;
  grid-template-columns: repeat(5, minmax(54px, auto));
  gap: 6px;
}

.agent-console-metrics span {
  display: grid;
  gap: 1px;
  min-width: 54px;
  padding: 5px 7px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--panel-bg);
  color: var(--text-secondary);
  font-size: 10px;
  font-weight: 800;
  text-align: center;
}

.agent-console-metrics strong {
  color: var(--text-primary);
  font-size: 16px;
}

.agent-attention-summary {
  display: grid;
  gap: 4px;
  padding: 9px 10px;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  background: var(--panel-bg);
}

.agent-attention-summary strong {
  font-size: 12px;
}

.agent-attention-summary p,
.agent-attention-summary ul {
  margin: 0;
}

.agent-attention-summary p,
.agent-attention-summary li {
  font-size: 11px;
  line-height: 1.35;
}

.agent-attention-summary ul {
  display: grid;
  gap: 2px;
  padding-left: 16px;
}

.agent-attention-summary.ok {
  border-color: color-mix(in srgb, var(--green) 56%, var(--border-soft));
  background: var(--green-soft);
}

.agent-attention-summary.warn {
  border-color: color-mix(in srgb, var(--orange) 56%, var(--border-soft));
  background: var(--orange-soft);
}

.agent-attention-summary.danger {
  border-color: color-mix(in srgb, var(--danger) 56%, var(--border-soft));
  background: var(--danger-soft);
}

.agent-attention-summary.neutral {
  border-color: var(--border-soft);
  background: var(--panel-bg-muted);
}

.agent-graph-card {
  display: grid;
  gap: 8px;
  padding: 10px;
  border: 1.5px solid var(--border-strong);
  border-radius: 8px;
  background: var(--panel-bg-subtle);
}

.agent-graph-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: start;
}

.agent-graph-head h4,
.agent-graph-head p {
  margin: 0;
}

.agent-graph-head h4 {
  font-size: 13px;
}

.agent-graph-head p {
  color: var(--muted);
  font-size: 11px;
}

.agent-graph-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  justify-content: flex-end;
}

.agent-graph-legend span {
  padding: 3px 7px;
  border-radius: 999px;
  border: 1px solid var(--border-soft);
  background: var(--panel-bg);
  font-size: 10px;
  font-weight: 850;
}

.agent-graph-legend .work { color: var(--green); border-color: color-mix(in srgb, var(--green) 56%, var(--border-soft)); background: var(--green-soft); }
.agent-graph-legend .input { color: var(--orange); border-color: color-mix(in srgb, var(--orange) 56%, var(--border-soft)); background: var(--orange-soft); }
.agent-graph-legend .error { color: var(--danger); border-color: color-mix(in srgb, var(--danger) 56%, var(--border-soft)); background: var(--danger-soft); }

.agent-flow-canvas {
  position: relative;
  min-height: 470px;
  height: clamp(470px, var(--agent-flow-height, 54vh), 820px);
  overflow: hidden;
  border: 1px solid var(--border-strong);
  border-radius: 8px;
  background: var(--panel-bg-muted);
}

.agent-flow-canvas .react-flow__node {
  cursor: pointer;
  font-family: var(--font-sans);
}

.agent-flow-canvas .react-flow__node-perimeter {
  padding: 0;
}

.agent-flow-canvas .react-flow__node-groupBox {
  pointer-events: none;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.agent-flow-group-box {
  position: relative;
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  border: 1.5px solid color-mix(in srgb, var(--border-strong) 64%, transparent);
  border-radius: 12px;
  background: color-mix(in srgb, var(--panel-bg-subtle) 62%, transparent);
}

.agent-flow-group-box span {
  position: absolute;
  top: 7px;
  left: 12px;
  color: var(--text-secondary);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.agent-flow-perimeter-node {
  position: relative;
  box-sizing: border-box;
  width: 100%;
  padding: 10px 12px;
}

.agent-flow-canvas .react-flow__handle {
  width: 7px;
  height: 7px;
  border-color: var(--panel-bg);
  background: var(--text-secondary);
}

.agent-flow-canvas .agent-flow-handle {
  opacity: 0;
  pointer-events: none;
}

.agent-flow-canvas .react-flow__edge-path {
  stroke-linecap: round;
  stroke-linejoin: round;
}

.agent-flow-canvas .react-flow__edge-textbg {
  rx: 4px;
  ry: 4px;
}

.agent-flow-label {
  display: grid;
  gap: 2px;
  min-width: 0;
  text-align: left;
}

.agent-flow-agent-label {
  gap: 4px;
}

.agent-flow-label strong,
.agent-flow-label span,
.agent-flow-label small {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.agent-flow-label strong {
  font-size: 12px;
  font-weight: 900;
}

.agent-flow-label span {
  color: var(--text-primary);
  font-size: 10.5px;
  font-weight: 750;
}

.agent-flow-label small {
  color: var(--text-secondary);
  font-size: 9.5px;
  font-weight: 800;
}

.agent-flow-developer-label {
  grid-template-columns: 34px minmax(0, 1fr);
  align-items: center;
}

.agent-flow-developer-label strong,
.agent-flow-developer-label span,
.agent-flow-developer-label small {
  grid-column: 2;
}

.agent-flow-dev-icon {
  position: relative;
  grid-row: 1 / span 3;
  width: 26px;
  height: 26px;
  border: 1.5px solid color-mix(in srgb, var(--accent) 60%, var(--border-soft));
  border-radius: 999px;
  background: var(--panel-bg);
}

.agent-flow-dev-icon::before {
  content: "";
  position: absolute;
  top: 5px;
  left: 8px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--accent);
}

.agent-flow-dev-icon::after {
  content: "";
  position: absolute;
  left: 6px;
  bottom: 5px;
  width: 12px;
  height: 8px;
  border-radius: 8px 8px 4px 4px;
  background: var(--accent);
}

.agent-flow-agent-label small {
  color: var(--text-secondary);
}

.agent-graph-fallback {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: 8px;
  padding: 10px;
}

.agent-fallback-node {
  display: grid;
  gap: 2px;
  justify-items: start;
  min-height: 62px;
  border: 1.5px solid var(--border-soft);
  border-radius: 8px;
  background: var(--panel-bg);
  text-align: left;
}

.agent-fallback-node.work { background: var(--green-soft); border-color: var(--green); }
.agent-fallback-node.input { background: var(--orange-soft); border-color: var(--orange); }
.agent-fallback-node.error { background: var(--danger-soft); border-color: var(--danger); }
.agent-fallback-node.done { background: var(--green-soft); border-color: var(--green); }
.agent-fallback-node.idle { background: var(--panel-bg-muted); border-color: var(--border-strong); }

.agent-graph-warning {
  position: absolute;
  z-index: 2;
  top: 8px;
  left: 8px;
  padding: 5px 8px;
  border: 1px solid color-mix(in srgb, var(--orange) 60%, var(--border-soft));
  border-radius: 6px;
  background: var(--orange-soft);
  color: var(--orange);
  font-size: 11px;
  font-weight: 850;
}

.agent-console-grid {
  display: grid;
  grid-template-columns: minmax(260px, .9fr) minmax(360px, 1.25fr);
  gap: 10px;
  min-height: 0;
}

.agent-console-grid.compact {
  grid-template-columns: 1fr;
}

.agent-terminal-view {
  min-height: 150px;
  max-height: 230px;
  overflow: auto;
  padding: 10px;
  border: 1px solid var(--terminal-border);
  border-radius: 8px;
  background: var(--terminal-bg);
  color: var(--terminal-fg);
  font-family: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
  font-size: 11px;
  line-height: 1.45;
}

.developer-agent-console .agent-terminal-view {
  min-height: 180px;
  max-height: 280px;
}

.agent-terminal-line {
  padding: 2px 0;
  border-bottom: 1px solid color-mix(in srgb, var(--panel-bg) 06%, transparent);
}

.agent-terminal-line span {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

.agent-terminal-line.work span { color: var(--terminal-fg); }
.agent-terminal-line.input span { color: var(--status-warn-fg); }
.agent-terminal-line.error span { color: var(--status-danger-fg); }
.agent-terminal-line.done span { color: var(--status-ok-fg); }

.agent-activity-panel {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  min-height: 190px;
  max-height: 320px;
  overflow: hidden;
  border: 1px solid var(--border-strong);
  border-radius: 8px;
  background: var(--panel-bg);
}

.agent-activity-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  padding: 8px 10px;
  border-bottom: 1px solid var(--border-strong);
  background: var(--panel-header-bg);
}

.agent-activity-head h4,
.agent-activity-head p {
  margin: 0;
}

.agent-activity-head h4 {
  font-size: 13px;
}

.agent-activity-head p {
  color: var(--text-secondary);
  font-size: 11px;
}

.agent-activity-head > span {
  padding: 3px 7px;
  border: 1px solid var(--border-soft);
  border-radius: 999px;
  background: var(--chip-bg);
  color: var(--text-secondary);
  font-size: 10px;
  font-weight: 850;
  white-space: nowrap;
}

.agent-activity-list {
  display: grid;
  gap: 6px;
  min-height: 0;
  overflow: auto;
  padding: 8px;
}

.agent-activity-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 4px 8px;
  padding: 8px;
  border: 1px solid var(--border-soft);
  border-radius: 8px;
  background: var(--row-bg);
}

.agent-activity-row strong,
.agent-activity-row small {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.agent-activity-row strong {
  font-size: 12px;
}

.agent-activity-row small {
  margin-top: 2px;
  color: var(--text-secondary);
  font-size: 10.5px;
  font-weight: 750;
}

.agent-activity-row p {
  grid-column: 1 / -1;
  margin: 0;
  color: var(--text-secondary);
  font-size: 11px;
  line-height: 1.35;
}

.agent-activity-action {
  grid-column: 1 / -1;
  justify-self: start;
  min-height: 28px;
  padding: 0 9px;
  font-size: 10.5px;
  font-weight: 850;
}

.agent-console-list {
  display: grid;
  gap: 8px;
  max-height: 520px;
  overflow: auto;
}

.agent-console-task {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 6px 8px;
  padding: 8px;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  background: var(--panel-bg);
}

.agent-console-task strong,
.agent-console-task small {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.agent-console-task strong {
  font-size: 12px;
}

.agent-console-task small {
  margin-top: 2px;
  color: var(--muted);
  font-size: 10px;
  font-weight: 750;
}

.agent-console-task p {
  grid-column: 1 / -1;
  margin: 0;
  color: var(--text-primary);
  font-size: 11px;
}

.agent-console-actions {
  display: flex;
  flex-wrap: wrap;
  grid-column: 1 / -1;
  gap: 4px;
}

.artifact-lightbox.agent-lightbox {
  width: min(1100px, calc(100vw - 80px));
  height: min(760px, calc(100vh - 80px));
  height: min(760px, calc(100dvh - 80px));
  max-height: min(760px, calc(100vh - 80px));
  max-height: min(760px, calc(100dvh - 80px));
  grid-template-rows: auto auto minmax(0, 1fr);
  overflow: hidden;
  transform-origin: center;
  transform-style: preserve-3d;
  will-change: transform, opacity;
}

.agent-lightbox-backdrop {
  perspective: 1200px;
}

.artifact-lightbox.agent-lightbox.task-focused {
  grid-template-rows: minmax(0, 1fr);
  width: min(1160px, calc(100vw - 28px));
  height: min(820px, calc(100dvh - 28px));
  max-height: min(820px, calc(100dvh - 28px));
  gap: 0;
  padding: 0;
  border-radius: 12px;
}

.artifact-lightbox.agent-lightbox.is-flipping {
  animation: agentConsoleCardFlip 0.34s ease both;
}

@keyframes agentConsoleCardFlip {
  0% {
    opacity: .72;
    transform: rotateY(-88deg);
  }

  100% {
    opacity: 1;
    transform: rotateY(0deg);
  }
}

@media (prefers-reduced-motion: reduce) {
  .artifact-lightbox.agent-lightbox.is-flipping {
    animation: none !important;
  }
}

.agent-lightbox-body {
  display: grid;
  grid-template-columns: minmax(240px, .7fr) minmax(420px, 1.3fr);
  gap: 12px;
  min-height: 0;
}

.agent-console-summary {
  display: grid;
  grid-template-columns: repeat(5, minmax(80px, 1fr));
  gap: 7px;
}

.agent-console-summary div {
  display: grid;
  gap: 1px;
  padding: 6px 8px;
  border: 1px solid var(--border-soft);
  border-radius: 7px;
  background: var(--panel-bg-subtle);
  text-align: center;
}

.agent-console-summary strong {
  font-size: 18px;
}

.agent-console-summary span {
  color: var(--muted);
  font-size: 10px;
  font-weight: 850;
}

.agent-lightbox-details,
.agent-lightbox-tasks {
  min-height: 0;
  overflow: auto;
  padding: 10px;
  border: 1.5px solid var(--border-soft);
  border-radius: 8px;
  background: var(--panel-bg);
}

.agent-lightbox-details h4,
.agent-lightbox-tasks h4 {
  margin: 0 0 6px;
  font-size: 13px;
}

.agent-lightbox-details p {
  margin: 0 0 8px;
  color: var(--text-primary);
  font-size: 11px;
}

.agent-lightbox-details dl {
  display: grid;
  gap: 6px;
  margin: 0;
}

.agent-lightbox-details dl div {
  display: grid;
  gap: 2px;
}

.agent-lightbox-details dt {
  color: var(--muted);
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
}

.agent-lightbox-details dd {
  margin: 0;
  overflow-wrap: anywhere;
  color: var(--text-primary);
  font-size: 11px;
  font-weight: 750;
}

.agent-task-conversation {
  position: relative;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  gap: 0;
  min-height: 0;
  overflow: hidden;
  height: 100%;
}

.agent-task-console-bar {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto auto;
  gap: 10px;
  align-items: center;
  min-height: 52px;
  padding: 8px 10px;
  border-bottom: 1px solid var(--border-soft);
}

.agent-task-console-bar > div {
  display: grid;
  gap: 1px;
  min-width: 0;
}

.agent-task-console-bar > div strong {
  font-size: 13px;
}

.agent-task-console-bar > div span {
  overflow: hidden;
  color: var(--text-secondary);
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.agent-task-conversation-close {
  position: static;
  display: inline-grid;
  place-items: center;
  width: 36px;
  min-width: 36px;
  height: 36px;
  min-height: 36px;
  padding: 0;
  border-radius: 8px;
  font-size: 17px;
  line-height: 1;
}

.agent-task-artifact-toggle {
  display: inline-flex;
  gap: 7px;
  align-items: center;
  min-height: 36px;
  padding: 0 11px;
}

.agent-task-artifact-toggle > span {
  width: 12px;
  height: 14px;
  border: 1.5px solid currentColor;
  border-radius: 2px;
  box-shadow: 3px 0 0 -1px var(--panel-bg), 4px 0 0 -1px currentColor;
}

.agent-task-artifact-toggle b {
  font-size: 11px;
}

.agent-task-console-body {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  min-height: 0;
  overflow: hidden;
}

.agent-task-conversation.has-artifact .agent-task-console-body {
  grid-template-columns: minmax(0, 1fr) minmax(300px, 360px);
  transition: grid-template-columns 220ms ease;
}

.agent-task-conversation.has-artifact.artifact-collapsed .agent-task-console-body {
  grid-template-columns: minmax(0, 1fr) 0;
}

.agent-task-conversation.artifact-collapsed .agent-task-artifact-panel {
  opacity: 0;
  pointer-events: none;
  transform: translateX(18px);
}

.agent-task-artifact-panel {
  min-width: 0;
  overflow: hidden;
  border-left: 1px solid var(--border-soft);
  background: var(--panel-bg);
  opacity: 1;
  transform: translateX(0);
  transition: opacity 180ms ease, transform 220ms ease;
}

.agent-task-artifact-panel > header {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: start;
  padding: 16px 16px 12px;
  border-bottom: 1px solid var(--border-soft);
}

.agent-task-artifact-panel > header div {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.agent-task-artifact-panel > header div span {
  color: var(--muted);
  font-size: 9.5px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.agent-task-artifact-panel > header strong {
  font-size: 13px;
  line-height: 1.35;
}

.agent-task-artifact-panel > header button {
  width: 32px;
  min-width: 32px;
  height: 32px;
  min-height: 32px;
  padding: 0;
  border: 0;
  background: transparent;
  font-size: 17px;
}

.agent-task-artifact-content {
  height: calc(100% - 65px);
  overflow: auto;
  padding: 18px;
  color: var(--text-primary);
  font-size: 12px;
  line-height: 1.55;
}

.agent-task-artifact-content > :first-child {
  margin-top: 0;
}

.agent-task-artifact-content h1,
.agent-task-artifact-content h2,
.agent-task-artifact-content h3 {
  margin: 18px 0 8px;
  font-size: 13px;
}

.agent-task-artifact-content ol,
.agent-task-artifact-content ul {
  padding-left: 20px;
}

.agent-task-current-plan {
  display: grid;
  gap: 4px;
  padding: 4px 0 4px 12px;
  border: 0;
  border-left: 3px solid var(--accent);
  border-radius: 0;
  background: transparent;
}

.agent-task-current-plan > span,
.agent-task-context-artifact > span {
  color: var(--accent-ink);
  font-size: 9.5px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.agent-task-current-plan > strong {
  font-size: 13px;
  line-height: 1.35;
}

.agent-task-current-plan > small {
  color: var(--text-secondary);
  font-size: 10.5px;
}

.agent-task-context-section {
  margin-top: 18px;
  padding-top: 16px;
  border-top: 1px solid var(--border-soft);
}

.agent-task-context-section h4 {
  margin: 0 0 10px;
  font-size: 11px;
}

.agent-task-context-section > p {
  margin: 0;
  color: var(--text-secondary);
  font-size: 11px;
  line-height: 1.5;
}

.agent-task-context-steps {
  display: grid;
  gap: 0;
  margin: 0;
  padding: 0 !important;
  list-style: none;
}

.agent-task-context-steps li {
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr);
  gap: 9px;
  align-items: center;
  min-height: 44px;
  padding: 8px 6px;
  border: 0;
  border-bottom: 1px solid var(--border-soft);
  border-radius: 0;
}

.agent-task-context-steps li > span {
  display: grid;
  place-items: center;
  width: 24px;
  height: 24px;
  border: 1px solid var(--border-strong);
  border-radius: 50%;
  color: var(--text-secondary);
  font-size: 10px;
  font-weight: 850;
}

.agent-task-context-steps li > div {
  display: grid;
  gap: 1px;
  min-width: 0;
}

.agent-task-context-steps li strong {
  overflow: hidden;
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.agent-task-context-steps li small {
  color: var(--muted);
  font-size: 9.5px;
  text-transform: capitalize;
}

.agent-task-context-steps li.current {
  background: var(--panel-bg-selected);
  box-shadow: inset 3px 0 0 var(--accent);
}

.agent-task-context-steps li.current > span {
  border-color: var(--accent-ink);
  background: var(--accent-ink);
  color: var(--panel-bg);
}

.agent-task-context-steps li.current small {
  color: var(--accent-ink);
  font-weight: 850;
}

.agent-task-context-steps li.completed {
  opacity: .72;
}

.agent-task-context-artifact > h4 {
  margin-top: 4px;
  font-size: 12px;
}

.agent-task-context-artifact > div {
  color: var(--text-primary);
  font-size: 11px;
  line-height: 1.5;
}

.agent-task-context-artifact > div > :first-child {
  margin-top: 0;
}

.agent-task-context-artifact > div > :last-child {
  margin-bottom: 0;
}

.agent-task-focus-summary {
  display: grid;
  grid-template-rows: auto auto auto;
  gap: 7px;
  min-height: 0;
  padding: 2px;
}

.agent-task-focus-title {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 9px;
  align-items: center;
  padding-right: 34px;
}

.agent-task-focus-title h3 {
  margin: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 18px;
}

.agent-task-focus-title p {
  margin: 2px 0 0;
  color: var(--text-secondary);
  font-size: 11px;
}

.agent-task-focus-facts {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 7px;
}

.agent-task-focus-facts div {
  display: grid;
  gap: 2px;
  min-width: 0;
  padding: 7px 8px;
  border: 1px solid var(--border-soft);
  border-radius: 7px;
  background: var(--panel-bg-subtle);
}

.agent-task-focus-facts span {
  color: var(--muted);
  font-size: 9.5px;
  font-weight: 900;
  text-transform: uppercase;
}

.agent-task-focus-facts strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 11px;
}

.agent-task-focus-brief {
  display: grid;
  gap: 3px;
  min-height: 0;
  padding: 8px 9px;
  border: 1px solid var(--border-soft);
  border-radius: 7px;
  background: var(--panel-bg-subtle);
}

.agent-task-focus-brief strong {
  font-size: 11px;
}

.agent-task-focus-brief p {
  margin: 0;
  color: var(--text-secondary);
  font-size: 11px;
  line-height: 1.35;
}

.agent-task-chat-room {
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  min-height: 0;
  overflow: hidden;
}

.agent-task-chat {
  display: grid;
  align-content: start;
  gap: 18px;
  min-height: 0;
  height: 100%;
  overflow: auto;
  padding: 22px 24px 30px;
  border: 0;
  border-radius: 0;
  background: var(--panel-bg);
}

.agent-task-chat-message {
  display: grid;
  gap: 4px;
  max-width: min(680px, 88%);
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.agent-task-chat-message.user {
  justify-self: end;
  padding: 10px 12px;
  border: 0;
  border-radius: 12px;
  background: var(--panel-bg-muted);
  box-shadow: none;
}

.agent-task-chat-message.agent {
  justify-self: start;
}

.agent-task-chat-message.decision {
  width: min(700px, 100%);
  max-width: 100%;
}

.agent-task-chat-message strong {
  font-size: 11px;
}

.agent-task-chat-message div {
  color: var(--text-primary);
  font-size: 12px;
  line-height: 1.5;
}

.agent-task-chat-message div > :first-child {
  margin-top: 0;
}

.agent-task-chat-message div > :last-child {
  margin-bottom: 0;
}

.agent-task-plan-bubble {
  display: grid;
  gap: 8px;
}

.agent-task-plan-bubble p {
  margin: 0;
}

.agent-task-plan-card {
  display: grid;
  gap: 7px;
  min-width: min(680px, 100%);
  padding: 9px;
  border: 1px solid var(--border-soft);
  border-radius: 7px;
  background: var(--panel-bg-subtle);
}

.agent-task-plan-card div {
  display: grid;
  gap: 2px;
}

.agent-task-plan-card span {
  color: var(--muted);
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
}

.agent-task-plan-card strong {
  font-size: 12px;
}

.agent-task-plan-card pre {
  max-height: 260px;
  margin: 0;
  overflow: auto;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  color: var(--text-primary);
  font-family: inherit;
  font-size: 12px;
  line-height: 1.42;
}

.agent-task-choice-bubble {
  padding: 16px;
  border: 1px solid var(--border-strong);
  border-radius: 14px;
  background: var(--panel-bg);
  box-shadow: 0 8px 24px color-mix(in srgb, var(--rail-bg) 12%, transparent);
}

.agent-task-decision-label {
  display: block;
  margin-bottom: 7px;
  color: var(--accent-ink);
  font-size: 9.5px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.agent-task-decision-question {
  font-size: 13px;
  line-height: 1.5;
}

.agent-task-choice-rows {
  display: grid;
  margin-top: 12px;
  overflow: hidden;
  border: 1px solid var(--border-soft);
  border-radius: 10px;
  background: var(--panel-bg-subtle);
}

.agent-task-choice-row {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr) 18px;
  gap: 10px;
  align-items: center;
  min-height: 48px;
  padding: 8px 10px;
  border: 0;
  border-bottom: 1px solid var(--border-soft);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: var(--text-primary);
  text-align: left;
}

.agent-task-choice-row:last-child {
  border-bottom: 0;
}

.agent-task-choice-row:hover {
  background: var(--panel-bg-muted);
  box-shadow: none;
}

.agent-task-choice-row:focus-visible {
  z-index: 1;
  outline: 2px solid var(--accent);
  outline-offset: -2px;
}

.agent-task-choice-row.recommended {
  background: var(--panel-bg-selected);
}

.agent-task-choice-row.danger b {
  color: var(--status-danger-fg);
}

.agent-task-choice-number {
  display: grid;
  place-items: center;
  width: 26px;
  height: 26px;
  border: 1px solid var(--border-strong);
  border-radius: 50%;
  color: var(--text-secondary);
  font-size: 10px;
  font-weight: 750;
}

.agent-task-choice-copy {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.agent-task-choice-copy > span {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  align-items: center;
}

.agent-task-choice-copy b {
  font-size: 12px;
}

.agent-task-choice-copy em {
  padding: 2px 6px;
  border-radius: 999px;
  background: var(--panel-bg-muted);
  color: var(--text-secondary);
  font-size: 9px;
  font-style: normal;
  font-weight: 800;
}

.agent-task-choice-copy small {
  color: var(--text-secondary);
  font-size: 10.5px;
  font-weight: 500;
  line-height: 1.35;
}

.agent-task-choice-arrow {
  color: var(--muted);
  font-size: 15px;
  text-align: right;
}

.agent-task-custom-response {
  margin-top: 10px;
}

.agent-task-custom-response-toggle {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  width: 100%;
  min-height: 44px;
  padding: 6px 10px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  box-shadow: none;
  color: var(--text-secondary);
  text-align: left;
}

.agent-task-custom-response-toggle:hover {
  background: var(--panel-bg-muted);
  box-shadow: none;
  color: var(--text-primary);
}

.agent-task-decision-footer {
  display: flex;
  justify-content: flex-end;
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px solid var(--border-soft);
}

.agent-task-decision-footer button {
  min-height: 36px;
  padding: 0 10px;
  border: 0;
  background: transparent;
  box-shadow: none;
  color: var(--text-secondary);
}

.agent-task-decision-footer button:hover {
  background: var(--panel-bg-muted);
  box-shadow: none;
  color: var(--text-primary);
}

.agent-task-chat-message small {
  color: var(--text-secondary);
  font-size: 10px;
  font-weight: 750;
}

.agent-task-conversation-composer {
  display: grid;
  gap: 6px;
  padding: 10px 16px 14px;
  border-top: 1px solid var(--border-soft);
  background: var(--panel-bg);
}

.agent-task-conversation-composer > label {
  color: var(--muted);
  font-size: 10px;
  font-weight: 850;
}

.agent-task-conversation-composer > div {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: end;
}

.agent-task-conversation-composer textarea {
  min-height: 56px;
  max-height: 112px;
  padding: 9px 11px;
  font-size: 12px;
  line-height: 1.45;
  resize: vertical;
}

.agent-task-conversation-composer button {
  min-height: 40px;
  padding: 0 14px;
  white-space: nowrap;
}

@media (prefers-reduced-motion: reduce) {
  .agent-task-conversation.has-artifact .agent-task-console-body,
  .agent-task-artifact-panel {
    transition: none;
  }
}

@media (max-width: 880px) {
  .artifact-lightbox.agent-lightbox.task-focused {
    width: calc(100vw - 28px);
    height: calc(100dvh - 28px);
    max-height: calc(100dvh - 28px);
  }

  .agent-task-conversation.has-artifact .agent-task-console-body,
  .agent-task-conversation.has-artifact.artifact-collapsed .agent-task-console-body {
    grid-template-columns: minmax(0, 1fr);
  }

  .agent-task-artifact-panel {
    position: absolute;
    inset: 0 0 0 auto;
    z-index: 3;
    width: min(440px, 92%);
    border-left: 1px solid var(--border-strong);
    box-shadow: -16px 0 32px color-mix(in srgb, var(--modal-scrim) 42%, transparent);
  }

  .agent-task-conversation.artifact-collapsed .agent-task-artifact-panel {
    transform: translateX(100%);
  }
}

@media (max-width: 600px) {
  .agent-task-console-bar {
    grid-template-columns: auto minmax(0, 1fr) auto;
  }

  .agent-task-console-bar > .badge {
    display: none;
  }

  .agent-task-chat {
    padding: 16px 14px 24px;
  }

  .agent-task-chat-message,
  .agent-task-chat-message.decision {
    width: 100%;
    max-width: 100%;
  }

  .agent-task-conversation-composer > div {
    grid-template-columns: 1fr;
  }

  .agent-task-conversation-composer button {
    justify-self: end;
  }
}

.agent-task-conversation-actions {
  justify-content: end;
}

.agent-skill-cloud {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}

.agent-skill-cloud span,
.agent-node-status {
  padding: 3px 7px;
  border: 1px solid var(--border-soft);
  border-radius: 999px;
  background: var(--panel-bg-subtle);
  font-size: 10px;
  font-weight: 850;
}

.agent-node-status.work { color: var(--status-ok-fg); border-color: var(--status-ok-border); background: var(--status-ok-bg); }
.agent-node-status.input { color: var(--status-warn-fg); border-color: var(--status-warn-border); background: var(--status-warn-bg); }
.agent-node-status.error { color: var(--status-danger-fg); border-color: var(--status-danger-border); background: var(--status-danger-bg); }
.agent-node-status.done { color: var(--status-ok-fg); border-color: var(--status-ok-border); background: var(--status-ok-bg); }
.agent-node-status.idle { color: var(--status-ok-fg); border-color: var(--status-ok-border); background: var(--status-ok-bg); }

.handoff-detail-card {
  display: grid;
  gap: 10px;
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid var(--border-soft);
}

.handoff-detail-card h4 {
  margin: 0 0 4px;
}

.handoff-detail-card dl {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 8px;
  margin: 0;
}

.handoff-detail-card dl div,
.handoff-detail-card section {
  min-width: 0;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--panel-bg);
}

.handoff-detail-card dt,
.handoff-detail-card section span {
  display: block;
  color: var(--muted);
  font-size: 10px;
  font-weight: 850;
  text-transform: uppercase;
}

.handoff-detail-card dd {
  margin: 2px 0 0;
  overflow-wrap: anywhere;
  color: var(--text-primary);
  font-size: 12px;
  font-weight: 750;
}

.handoff-detail-card section p {
  margin: 3px 0 0;
  color: var(--text-secondary);
  font-size: 12px;
  line-height: 1.4;
}

.handoff-detail-card ul {
  margin: 3px 0 0;
  padding-left: 16px;
  color: var(--text-secondary);
  font-size: 12px;
}

.handoff-markdown {
  max-height: 520px;
  overflow: auto;
  margin: 0;
  padding: 14px;
  border: 1px solid var(--border-soft);
  border-radius: 8px;
  background: var(--panel-bg-subtle);
  color: var(--text-primary);
  font-family: var(--font-mono);
  font-size: 12px;
  line-height: 1.58;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

.handoff-rendered,
.handoff-raw,
.handoff-policy-checklist {
  display: grid;
  gap: 8px;
  padding: 12px;
  border: 1px solid var(--border-soft);
  border-radius: 8px;
  background: var(--panel-bg-subtle);
}

.handoff-rendered {
  max-height: 520px;
  overflow: auto;
}

.handoff-rendered h1,
.handoff-rendered h2,
.handoff-rendered h3 {
  margin: 8px 0 4px;
}

.handoff-raw summary,
.handoff-policy-checklist summary {
  cursor: pointer;
  font-size: 12px;
  font-weight: 800;
}

.developer-git-page {
  display: grid;
  gap: 12px;
}

.git-overview-card {
  overflow: hidden;
  border-color: var(--line-strong);
  background: var(--surface-raised);
}

.git-overview-card > div:first-child,
.git-story-head {
  margin: -12px -12px 0;
  padding: 9px 10px;
  border-bottom: 1px solid var(--line-strong);
  border-radius: 8px 8px 0 0;
  background: var(--titlebar);
}

.git-story-list {
  display: grid;
  gap: 10px;
  padding: 9px;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  background: var(--surface-soft);
}

.git-story-card {
  display: grid;
  gap: 10px;
  padding: 12px;
  overflow: hidden;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  background: var(--surface-raised);
}

.git-story-head {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 10px;
}

.git-story-head strong {
  display: block;
  font-size: 13px;
}

.git-story-head small {
  display: block;
  margin-top: 3px;
  color: var(--muted);
  font-size: 11px;
}

.git-story-card dl {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 8px;
  margin: 0;
}

.git-story-card dl div {
  min-width: 0;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--surface-soft);
}

.git-story-card dt {
  color: var(--muted);
  font-size: 10px;
  font-weight: 850;
  text-transform: uppercase;
}

.git-story-card dd {
  margin: 2px 0 0;
  overflow-wrap: anywhere;
  color: var(--ink);
  font-size: 12px;
  font-weight: 750;
}

.assistant-pane {
  grid-column: 4;
  grid-row: 1;
  height: calc(100vh - 48px);
  position: sticky;
  top: 48px;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  min-height: 0;
  border-left: 1px solid var(--line);
  background: var(--panel-bg-subtle);
}

.assistant-header {
  flex: 0 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  padding: 9px 10px;
  border-bottom: 1px solid var(--line);
  background: var(--titlebar);
}

.assistant-header-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}

.assistant-toggle {
  width: 26px;
  min-height: 26px;
  padding: 0;
  font-size: 20px;
  line-height: 1;
}

.assistant-peek {
  grid-column: 3;
  grid-row: 1;
  position: sticky;
  top: 70px;
  right: 0;
  justify-self: end;
  align-self: start;
  width: 34px;
  min-height: 150px;
  margin: 14px 0 0 -34px;
  padding: 8px 4px;
  border-radius: 8px 0 0 8px;
  border-color: var(--line-strong);
  background: var(--panel-bg);
  box-shadow: -6px 10px 24px color-mix(in srgb, var(--rail-bg) 12%, transparent);
  z-index: 4;
}

.assistant-peek span {
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  font-size: 11px;
  font-weight: 850;
  color: var(--accent-ink);
  white-space: nowrap;
}

.assistant-intro {
  flex: 0 0 auto;
  padding: 9px 10px;
  background: var(--surface-raised);
  border-bottom: 1px solid var(--line);
}

.assistant-intro p { margin: 2px 0 8px; font-size: 12px; }

.assistant-stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border: 1px solid var(--line);
  border-radius: 7px;
  overflow: hidden;
}

.assistant-stats div {
  min-height: 46px;
  display: grid;
  place-items: center;
  gap: 2px;
  border-right: 1px solid var(--line);
  padding: 6px 4px;
  text-align: center;
  min-width: 0;
}

.assistant-stats div:last-child { border-right: 0; }
.assistant-stats strong { font-size: 15px; }
.assistant-stats span { color: var(--muted); font-size: 10px; }

.contextual-thread-assistant .assistant-stats div {
  min-height: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  border-right: 0;
  border-bottom: 1px solid var(--line);
  padding: 5px 8px;
  text-align: left;
}

.contextual-thread-assistant .assistant-stats div:last-child { border-bottom: 0; }

.contextual-thread-assistant .assistant-stats strong {
  max-width: 100%;
  font-size: 11px;
  line-height: 1.18;
  text-align: right;
  overflow-wrap: anywhere;
}

.contextual-thread-assistant .assistant-stats span {
  order: -1;
  flex: 0 0 auto;
  min-width: 48px;
  font-size: 9px;
  line-height: 1.15;
  text-align: left;
}

.contextual-thread-assistant .assistant-stats {
  grid-template-columns: 1fr;
}

.assistant-actions {
  position: relative;
  z-index: 2;
  flex: 0 0 auto;
  padding: 6px 10px;
  background: var(--surface-raised);
  border-bottom: 1px solid var(--line);
}

.assistant-actions p {
  margin: 0 0 6px;
  color: var(--muted);
  font-size: 10px;
  font-weight: 850;
  text-transform: uppercase;
}

.assistant-bubbles {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  max-height: 96px;
  overflow: auto;
  padding-bottom: 1px;
}

.assistant-bubbles button {
  min-height: 28px;
  width: fit-content;
  max-width: min(100%, 260px);
  border-radius: 999px;
  border-color: color-mix(in srgb, var(--accent) 58%, var(--line));
  background: var(--chip-muted);
  color: var(--accent-ink);
  padding: 4px 9px;
  text-align: left;
  white-space: normal;
  font-size: 11px;
  line-height: 1.25;
}

.contextual-thread-assistant strong {
  display: block;
  color: var(--ink);
}

.contextual-thread-actions {
  display: grid;
  gap: 8px;
}

.assistant-primary-action {
  display: grid;
}

.assistant-primary-action button {
  width: 100%;
  justify-content: center;
  min-height: 34px;
}

.assistant-primary-status {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel-bg-subtle);
  padding: 10px 12px;
  gap: 4px;
}

.assistant-primary-status strong {
  color: var(--ink);
  font-size: 0.86rem;
}

.assistant-primary-status span {
  color: var(--muted);
  font-size: 0.78rem;
  line-height: 1.35;
}

.assistant-inline-options {
  display: grid;
  gap: 5px;
  margin-top: 5px;
  padding-top: 7px;
  border-top: 1px solid var(--line);
}

.assistant-inline-options small {
  color: var(--muted);
  font-size: 0.66rem;
  font-weight: 850;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.assistant-inline-options > div {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}

.assistant-inline-options > div > span {
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  padding: 3px 8px;
  border: 1px solid var(--line-strong);
  border-radius: 999px;
  background: var(--surface-soft);
  color: var(--text-secondary);
  font-size: 0.7rem;
  font-weight: 750;
}

.assistant-empty {
  color: var(--muted);
  font-size: 12px;
  padding: 4px 0;
}

.chat-log {
  flex: 1 1 auto;
  overflow: auto;
  padding: 8px 10px;
  display: grid;
  gap: 8px;
  align-content: start;
  min-height: 96px;
}

.llm-working {
  position: relative;
  z-index: 1;
  flex: 0 0 auto;
  margin: 8px 10px 0;
  padding: 7px 9px;
  border: 1px solid var(--status-warn-border);
  border-left: 4px solid var(--orange);
  border-radius: 8px;
  background: var(--status-warn-bg);
  box-shadow: 0 10px 24px color-mix(in srgb, var(--orange) 14%, transparent);
  display: grid;
  grid-template-columns: 16px minmax(0, 1fr);
  align-items: center;
  gap: 7px;
  max-height: 62px;
}

.llm-working > span {
  width: 12px;
  height: 12px;
  border-radius: 999px;
  border: 2px solid var(--status-warn-border);
  border-top-color: var(--status-warn-fg);
  animation: spin 0.85s linear infinite;
}

.llm-working strong {
  display: block;
  color: var(--status-warn-fg);
  font-size: 12px;
}

.llm-working p {
  margin: 2px 0 0;
  color: var(--status-warn-fg);
  font-size: 11px;
  line-height: 1.3;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.support-chat-log .llm-working {
  justify-self: start;
  width: min(760px, 92%);
  margin: 0;
}

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

.message {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 8px;
  background: var(--panel-bg);
}

.message.user { background: var(--accent-soft); border-color: var(--border-soft); justify-self: end; max-width: 88%; }
.message.assistant { background: var(--panel-bg); border-color: var(--line); }
.message strong { font-size: 12px; }

.message-body {
  margin-top: 5px;
  display: grid;
  gap: 6px;
  font-size: 13px;
  line-height: 1.42;
  overflow-wrap: anywhere;
}

.message-body p {
  margin: 0;
}

.message-body ol,
.message-body ul {
  margin: 0;
  padding-left: 19px;
  display: grid;
  gap: 5px;
}

.message-body li {
  padding-left: 2px;
}

.message-body li > ul {
  margin-top: 4px;
  padding-left: 17px;
}

.message-body code {
  padding: 1px 4px;
  border-radius: 4px;
  background: var(--panel-bg-muted);
  font-size: 12px;
}

.operation-drawer {
  border-top: 1px solid var(--line);
  padding: 9px 10px;
  display: grid;
  gap: 10px;
  background: var(--surface-soft);
  max-height: min(42vh, 360px);
  overflow: auto;
}

.admin-system > .system-reports-panel {
  max-height: none;
  overflow: visible;
}

.operation-panel {
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  padding: 14px;
  display: grid;
  gap: 10px;
  background: color-mix(in srgb, var(--surface-raised) 82%, transparent);
}

.operation-workspace {
  align-content: start;
}

.operation-workspace .operation-drawer,
.operation-workspace .operation-panel {
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  padding: 14px;
  background: color-mix(in srgb, var(--surface-raised) 78%, transparent);
  max-height: none;
  overflow: visible;
}

.operation-workspace .operation-drawer > h3,
.operation-workspace .operation-panel > h3 {
  margin: 0;
  font-size: 14px;
}

.operation-workspace .manager-picker {
  max-width: 680px;
}

.operation-drawer p { margin-bottom: 0; font-size: 13px; }

.operation-panel p,
.operation-drawer p { margin-bottom: 0; font-size: 13px; }

.operation-drawer textarea,
.operation-panel textarea {
  min-height: 96px;
  font-size: 12px;
}

.settings-screen {
  display: grid;
  gap: 10px;
  min-width: 0;
  overflow: auto;
}

.settings-screen > .pane-title,
.settings-screen > .story-workspace-tabs,
.settings-screen > .operation-drawer,
.settings-screen > .operation-panel {
  min-width: 0;
}

.settings-screen .operation-drawer {
  max-height: none;
  overflow: visible;
  padding: 0;
  border-top: 0;
  background: transparent;
}

.settings-screen .operation-drawer > h3 {
  display: none;
}

.settings-screen .settings-section {
  box-sizing: border-box;
  min-width: 0;
  width: 100%;
  padding: 10px;
  border: 1px solid var(--border-strong);
  border-radius: 8px;
  background: var(--panel-bg);
  box-shadow: 0 1px 0 color-mix(in srgb, var(--border-soft) 38%, transparent);
}

.settings-screen .settings-section > h4 {
  margin: -10px -10px 2px;
  padding: 8px 10px;
  border-bottom: 1px solid var(--border-soft);
  border-radius: 8px 8px 0 0;
  background: var(--panel-header-bg);
}

.settings-screen .settings-section label small {
  color: var(--text-secondary);
  font-size: 10.5px;
  font-weight: 500;
  line-height: 1.35;
}

.settings-screen .settings-section > *,
.settings-screen .settings-section label,
.settings-screen .settings-section input,
.settings-screen .settings-section select,
.settings-screen .settings-section textarea {
  box-sizing: border-box;
  min-width: 0;
}

.eoc-reregistration-panel {
  display: grid;
  gap: 10px;
  width: min(100%, 980px);
  margin-top: 10px;
  padding: 12px;
  border: 1px solid var(--border-strong);
  border-radius: 8px;
  background: var(--panel-bg-subtle);
}

.eoc-reregistration-heading {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 16px;
}

.eoc-reregistration-heading .eyebrow {
  color: var(--status-warn-fg);
  font-size: 9px;
  font-weight: 850;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.eoc-reregistration-heading h5 {
  margin: 2px 0 0;
  font-size: 13px;
}

.eoc-reregistration-warning {
  display: grid;
  gap: 2px;
  padding: 8px 10px;
  border: 1px solid var(--status-warn-border);
  border-left: 3px solid var(--status-warn-fg);
  border-radius: 6px;
  background: color-mix(in srgb, var(--status-warn-bg) 68%, var(--panel-bg));
  color: var(--text-secondary);
  font-size: 10.5px;
  line-height: 1.4;
}

.eoc-reregistration-warning strong {
  color: var(--text-primary);
  font-size: 11px;
}

.eoc-reregistration-summary {
  padding: 7px 9px;
  background: var(--panel-bg);
}

.eoc-reregistration-code-row {
  display: grid;
  grid-template-columns: minmax(140px, 200px) minmax(120px, 180px) auto;
  gap: 8px;
  align-items: center;
}

.eoc-reregistration-code-row > label {
  gap: 0;
}

.eoc-reregistration-code-row > input {
  font-variant-numeric: tabular-nums;
  letter-spacing: .08em;
}

.eoc-reregistration-code-row > button {
  justify-self: start;
}

.eoc-reregistration-options {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.eoc-reregistration-option {
  display: grid;
  grid-template-columns: 16px minmax(0, 1fr);
  gap: 8px;
  align-items: start;
  min-height: 64px;
  padding: 9px;
  border: 1px solid var(--border-soft);
  border-radius: 7px;
  background: var(--panel-bg);
  cursor: pointer;
}

.eoc-reregistration-option:has(input:checked) {
  border-color: color-mix(in srgb, var(--accent) 52%, var(--border-soft));
  background: var(--panel-bg-selected);
}

.eoc-reregistration-option input[type="checkbox"],
.eoc-reregistration-confirmation input[type="checkbox"] {
  width: 16px;
  min-width: 16px;
  height: 16px;
  min-height: 16px;
  margin: 1px 0 0;
  padding: 0;
  justify-self: start;
  accent-color: var(--accent);
}

.eoc-reregistration-option > span {
  display: grid;
  gap: 3px;
}

.eoc-reregistration-option strong {
  color: var(--text-primary);
  font-size: 11px;
}

.eoc-reregistration-option small {
  color: var(--text-secondary);
  font-size: 10px;
  font-weight: 500;
  line-height: 1.4;
}

.eoc-reregistration-confirmation {
  align-items: start;
  min-height: 0;
  padding: 8px 9px;
  border-top: 1px solid var(--border-soft);
  color: var(--text-primary);
  font-size: 10.5px;
  line-height: 1.4;
}

.eoc-reregistration-actions {
  padding-top: 0;
}

.eoc-reregistration-panel[aria-busy] {
  cursor: progress;
}

@media (max-width: 760px) {
  .eoc-reregistration-code-row,
  .eoc-reregistration-options {
    grid-template-columns: 1fr;
  }

  .eoc-reregistration-code-row > button {
    justify-self: stretch;
  }
}

.user-settings-screen .pane-title {
  align-items: center;
}

.user-settings-search {
  flex: 0 1 320px;
  min-width: 220px;
  color: var(--ink);
  font-size: 11px;
  font-weight: 750;
}

.user-settings-search input {
  min-height: 34px;
  margin-top: 5px;
  font-size: 12px;
}

.user-settings-drawer {
  display: grid;
  gap: 0;
}

.user-settings-tabs {
  box-sizing: border-box;
  min-height: 47px;
  margin-bottom: 10px;
}

.global-settings-tabs {
  box-sizing: border-box;
  min-height: 47px;
  margin-bottom: 10px;
  max-width: 100%;
}

.global-settings-drawer {
  display: grid;
  gap: 10px;
  max-width: 100%;
  min-width: 0;
  width: 100%;
}

.user-settings-tab-panel {
  display: grid;
  gap: 10px;
}

.user-settings-empty {
  min-height: 92px;
  align-content: center;
}

.credential-mode-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.credential-mode-card {
  display: grid;
  align-content: start;
  gap: 7px;
  min-height: 112px;
  padding: 10px;
  border: 1px solid var(--border-soft);
  border-radius: 8px;
  background: var(--panel-bg-subtle);
}

.credential-mode-card.selected {
  border-color: var(--accent);
  background: var(--panel-bg-selected);
  box-shadow: inset 3px 0 0 var(--accent);
}

.credential-mode-card strong,
.credential-mode-card p {
  margin: 0;
}

.credential-mode-card p {
  color: var(--text-secondary);
  font-size: 11px;
  line-height: 1.35;
}

.credential-mode-card button,
.credential-mode-card .status-pill {
  justify-self: start;
  margin-top: auto;
}

.credential-mode-details {
  display: grid;
  gap: 8px;
  padding: 8px 10px;
  border: 1px dashed var(--border-soft);
  border-radius: 8px;
  background: color-mix(in srgb, var(--panel-bg-subtle) 88%, transparent);
}

.credential-mode-details summary {
  color: var(--ink);
  cursor: pointer;
  font-size: 12px;
  font-weight: 800;
}

.credential-mode-details p {
  margin: 6px 0 0;
}

.credential-mode-fields {
  display: grid;
  gap: 8px;
  margin-top: 8px;
}

.connection-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 10px 0;
  padding: 10px 12px;
  border: 1px solid var(--border-soft);
  border-radius: 8px;
  background: var(--panel-bg-subtle);
}

.connection-card strong,
.connection-card small {
  display: block;
}

.connection-card small {
  margin-top: 3px;
  color: var(--text-secondary);
  overflow-wrap: anywhere;
}

.connection-card small .status-pill {
  margin-right: 7px;
}

.status-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 20px;
  padding: 2px 7px;
  border-radius: 999px;
  background: var(--surface-muted);
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
  line-height: 1;
  white-space: nowrap;
}

.status-pill.ok {
  background: var(--status-ok-bg);
  color: var(--status-ok-fg);
}

.status-pill.warn {
  background: var(--status-warn-bg);
  color: var(--status-warn-fg);
}

.status-pill.danger {
  background: var(--status-danger-bg);
  color: var(--status-danger-fg);
}

.status-pill.neutral {
  background: var(--surface-muted);
  color: var(--muted);
}

.connection-card-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.connection-card-actions button {
  white-space: nowrap;
}

.connected-apps-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(156px, 1fr));
  gap: 8px;
  margin-top: 2px;
}

.connected-app-tile {
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  min-width: 0;
  min-height: 100px;
  overflow: hidden;
  border: 1px solid var(--border-soft);
  border-radius: 8px;
  background: var(--panel-bg-subtle);
}

.connected-app-tile.connected {
  border-color: var(--status-ok-border);
  background: color-mix(in srgb, var(--status-ok-bg) 42%, var(--panel-bg-subtle));
}

.connected-app-tile-body {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  gap: 8px;
  align-items: center;
  min-width: 0;
  padding: 9px;
}

.connected-app-icon {
  display: grid;
  width: 28px;
  height: 28px;
  place-items: center;
  flex: 0 0 auto;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-muted);
  color: var(--muted);
  font-size: 9px;
  font-weight: 850;
  letter-spacing: -.02em;
  line-height: 1;
}

.connected-app-icon.branded {
  padding: 5px;
}

.connected-app-icon.branded img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  filter: grayscale(1) opacity(.62);
}

.connected-app-icon.connected {
  border-color: var(--status-ok-border);
  background: var(--status-ok-bg);
  color: var(--status-ok-fg);
}

.connected-app-icon.connected.branded img {
  filter: none;
}

.connected-app-tile-copy {
  display: grid;
  min-width: 0;
  gap: 3px;
}

.connected-app-tile-copy strong {
  overflow: hidden;
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.connected-app-tile-copy small {
  display: block;
  min-width: 0;
  overflow: hidden;
  color: var(--text-secondary);
  font-size: 10px;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.connected-app-tile-copy small .status-pill {
  margin-right: 5px;
  vertical-align: 1px;
}

.connected-app-tile-actions {
  display: grid;
  padding: 0 8px 8px;
}

.connected-app-action {
  width: 100%;
  min-height: 29px;
  padding: 0 8px;
  border-radius: 7px;
  font-size: 11px;
  font-weight: 800;
  line-height: 1;
}

.connected-app-downloads {
  display: grid;
  gap: 8px;
  margin-top: 12px;
  padding-top: 2px;
}

.connected-apps-divider {
  display: flex;
  align-items: center;
  gap: 10px;
  color: var(--muted);
  font-size: 10px;
  font-weight: 850;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.connected-apps-divider::before,
.connected-apps-divider::after {
  height: 1px;
  flex: 1;
  background: var(--border-soft);
  content: "";
}

.downloads-heading {
  display: grid;
  gap: 2px;
}

.downloads-heading h5 {
  margin: 0;
  color: var(--ink);
  font-size: 13px;
}

.downloads-heading .helper {
  margin: 0;
}

.plugin-download-shelf {
  display: grid;
  gap: 9px;
  padding: 10px;
  border: 1px solid var(--border-soft);
  border-radius: 8px;
  background: var(--panel-bg-subtle);
}

.plugin-download-group {
  display: grid;
  gap: 6px;
}

.plugin-download-group + .plugin-download-group {
  padding-top: 8px;
  border-top: 1px solid var(--border-soft);
}

.plugin-download-group h6 {
  margin: 0;
  color: var(--muted);
  font-size: 10px;
  font-weight: 850;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.plugin-download-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 7px;
}

.plugin-download-tile {
  min-width: 0;
  min-height: 100px;
}

.plugin-download-tile .connected-app-icon {
  width: 30px;
  height: 30px;
  border-color: var(--border-soft);
  background: var(--surface-muted);
  color: var(--muted);
  font-size: 9px;
}

.plugin-download-tile .connected-app-tile-copy {
  gap: 0;
}

@media (max-width: 820px) {
  .plugin-download-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 620px) {
  .connected-apps-grid,
  .plugin-download-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.connection-warning {
  color: var(--orange);
}

.settings-compact-field {
  width: min(100%, 320px);
}

.settings-time-field {
  width: min(100%, 280px);
}

.settings-time-field input {
  width: min(176px, 100%);
}

.settings-multiselect {
  position: relative;
  width: min(100%, 360px);
}

.settings-multiselect > summary {
  min-height: 38px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 7px 10px;
  border: 1px solid var(--border-strong);
  border-radius: 7px;
  background: var(--field-bg);
  color: var(--text-primary);
  cursor: pointer;
  list-style: none;
}

.settings-multiselect > summary::-webkit-details-marker {
  display: none;
}

.settings-multiselect > summary span {
  display: grid;
  gap: 1px;
}

.settings-multiselect > summary strong {
  font-size: 11px;
}

.settings-multiselect > summary small {
  color: var(--text-secondary);
  font-size: 10px;
  font-weight: 600;
}

.settings-multiselect-options {
  position: absolute;
  top: calc(100% + 5px);
  left: 0;
  z-index: 25;
  width: min(360px, calc(100vw - 48px));
  max-height: min(280px, 42vh);
  display: grid;
  gap: 5px;
  overflow: auto;
  padding: 8px;
  border: 1px solid var(--border-strong);
  border-radius: 8px;
  background: var(--panel-bg);
  box-shadow: var(--shadow-strong);
}

.settings-multiselect-options .check-row {
  min-height: 26px;
  padding: 4px 6px;
  border: 1px solid var(--border-soft);
  border-radius: 6px;
  background: var(--panel-bg-subtle);
}

.settings-multiselect-options .check-row:has(input:checked) {
  border-color: color-mix(in srgb, var(--accent) 48%, var(--border-soft));
  background: var(--panel-bg-selected);
}

@media (max-width: 640px) {
  .settings-multiselect-options {
    position: static;
    width: 100%;
    margin-top: 5px;
    box-shadow: none;
  }
}

.drawer-actions {
  display: flex;
  gap: 8px;
  justify-content: flex-end;
  flex-wrap: wrap;
}

.context-list {
  display: grid;
  gap: 5px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-raised);
  color: var(--ink);
  font-size: 11px;
}

.context-list span {
  color: var(--muted);
  line-height: 1.35;
}

.composer {
  flex: 0 0 auto;
  border-top: 1px solid var(--line);
  padding: 8px 10px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  background: var(--surface-raised);
}

.assistant-foot {
  flex: 0 0 auto;
  min-height: 20px;
  display: grid;
  place-items: center;
  color: var(--green);
  font-size: 10px;
  background: var(--surface-raised);
}

.check-row {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  align-items: center;
  gap: 9px;
  min-height: 32px;
}

.check-row input {
  width: 16px;
  min-height: 16px;
  padding: 0;
}

.integration-fields {
  display: grid;
  gap: 8px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-raised);
}

.integration-fields.hidden { display: none; }

.validation-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.validation-panel {
  display: grid;
  gap: 4px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-muted);
}

.validation-panel.success {
  border-color: var(--status-ok-border);
  background: color-mix(in srgb, var(--status-ok-bg) 72%, transparent);
}

.validation-panel.danger {
  border-color: var(--status-danger-border);
  background: color-mix(in srgb, var(--status-danger-bg) 72%, transparent);
}

.validation-panel.working {
  border-color: color-mix(in srgb, var(--accent) 56%, var(--border-soft));
  background: color-mix(in srgb, var(--accent-soft) 72%, transparent);
}

.validation-panel strong {
  color: var(--ink);
  font-size: 11px;
}

.validation-panel small,
.validation-panel p {
  margin: 0;
  color: var(--muted);
  font-size: 10.5px;
  line-height: 1.35;
}

.external-intelligence-consent {
  display: grid;
  grid-template-columns: 16px minmax(0, 1fr);
  gap: 8px;
  align-items: start;
  margin-top: 4px;
  color: var(--ink);
  font-size: 11px;
  font-weight: 650;
  line-height: 1.45;
}

.external-intelligence-consent input[type="checkbox"] {
  width: 16px;
  min-width: 16px;
  height: 16px;
  min-height: 16px;
  margin: 1px 0 0;
  padding: 0;
  justify-self: start;
  accent-color: var(--accent);
}

.external-intelligence-validity { margin-top: 6px; padding-top: 12px; border-top: 1px solid var(--line); }
.external-intelligence-validity-heading,
.external-intelligence-progress > div { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.external-intelligence-validity-heading h5 { margin: 0 0 4px; font-size: 12px; }
.external-intelligence-validity-heading p { margin: 0; }
.external-intelligence-progress { display: grid; gap: 6px; margin: 10px 0; }
.external-intelligence-progress span,
.external-intelligence-progress small { color: var(--muted); font-size: 10.5px; }
.external-intelligence-progress progress { width: 100%; height: 8px; accent-color: var(--accent); }
.external-intelligence-validation-steps { display: grid; gap: 5px; margin: 10px 0; padding: 0; list-style: none; }
.external-intelligence-validation-steps li { display: grid; grid-template-columns: 18px 1fr; gap: 7px; padding: 7px 8px; border: 1px solid var(--line); border-radius: 6px; background: var(--surface-muted); }
.external-intelligence-validation-steps li > span { font-weight: 800; color: var(--muted); }
.external-intelligence-validation-steps li.passed > span { color: var(--status-ok-fg); }
.external-intelligence-validation-steps li.failed > span { color: var(--danger); }
.external-intelligence-validation-steps li.running > span { color: var(--accent); }
.external-intelligence-validation-steps strong,
.external-intelligence-validation-steps small { display: block; }
.external-intelligence-validation-steps small { margin-top: 2px; color: var(--muted); font-size: 10.5px; }
.external-intelligence-validation-steps .validation-step-error { color: var(--danger); }
.external-intelligence-consent { margin: 10px 0; padding: 10px; border: 1px solid var(--warning); border-radius: 7px; background: var(--surface-muted); }
.external-intelligence-consent p,
.external-intelligence-consent ul { margin: 7px 0; color: var(--muted); font-size: 11px; line-height: 1.45; }
.external-intelligence-failure dl { display: grid; grid-template-columns: max-content 1fr; gap: 5px 10px; margin: 8px 0 0; font-size: 10.5px; }
.external-intelligence-failure dt { font-weight: 700; }
.external-intelligence-failure dd { margin: 0; }

.settings-section {
  display: grid;
  gap: 8px;
}

.settings-section h4 {
  margin: 0;
  font-size: 12px;
  color: var(--ink);
}

.settings-section p {
  margin: 0;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.35;
}

.integration-store {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  gap: 10px;
  min-height: 0;
}

.integration-store-layout {
  display: grid;
  grid-template-columns: minmax(360px, 1fr) minmax(340px, .7fr);
  gap: 10px;
  min-height: 0;
}

.integration-store-list,
.integration-detail {
  min-height: 0;
  overflow: auto;
}

.integration-store-list {
  display: grid;
  align-content: start;
  gap: 10px;
}

.integration-search-row {
  display: grid;
  gap: 5px;
  padding: 8px;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  background: var(--surface-raised);
}

.integration-search-row label {
  display: grid;
  gap: 4px;
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .03em;
}

.integration-search-row input {
  min-height: 32px;
  font-size: 12px;
  text-transform: none;
  letter-spacing: 0;
}

.integration-search-row p {
  margin: 0;
  color: var(--muted);
  font-size: 10.5px;
  line-height: 1.35;
}

.integration-group {
  display: grid;
  gap: 7px;
}

.integration-group h3 {
  margin: 0;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .04em;
}

.integration-tile-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, 210px);
  gap: 8px;
  justify-content: start;
}

.integration-tile {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  grid-template-rows: auto auto minmax(28px, 1fr) auto;
  gap: 2px 8px;
  width: 210px;
  min-height: 92px;
  padding: 9px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-raised);
  color: var(--ink);
  text-align: left;
}

.integration-tile.not-configured {
  background: var(--surface-muted);
  border-color: var(--line);
}

.integration-tile.not-installed {
  background: var(--not-installed-bg);
  border-color: var(--not-installed-border);
}

.integration-tile.active {
  border-color: var(--accent);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent) 45%, transparent);
}

.integration-tile.enabled {
  background: var(--green-soft);
  border-color: color-mix(in srgb, var(--green) 52%, var(--line));
}

.integration-tile-icon {
  grid-row: 1 / span 3;
  display: grid;
  width: 28px;
  height: 28px;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-muted);
  color: var(--ink);
  font-size: 10px;
  font-weight: 800;
}

.integration-tile-icon.large {
  width: 36px;
  height: 36px;
  font-size: 11px;
}

.integration-tile-icon.branded {
  padding: 4px;
  background: var(--brand-mark-bg);
}

.integration-tile-icon.branded img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.integration-tile strong {
  overflow: hidden;
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.integration-vendor {
  overflow: hidden;
  color: var(--muted);
  font-size: 9.5px;
  font-weight: 800;
  text-overflow: ellipsis;
  text-transform: uppercase;
  white-space: nowrap;
}

.integration-tile small {
  color: var(--muted);
  font-size: 10.5px;
  line-height: 1.25;
}

.integration-tile em,
.integration-status-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  justify-self: start;
  min-width: 76px;
  min-height: 20px;
  padding: 2px 7px;
  border-radius: 999px;
  font-size: 10px;
  font-style: normal;
  font-weight: 800;
  line-height: 1;
  white-space: nowrap;
}

.integration-metadata-callout {
  display: grid;
  grid-template-columns: max-content minmax(0, 1fr);
  gap: 4px 8px;
  align-items: center;
  padding: 8px 9px;
  border: 1px solid var(--status-warn-border);
  border-radius: 8px;
  background: var(--orange-soft);
  color: var(--orange);
}

.integration-metadata-callout span {
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.integration-metadata-callout small {
  color: var(--ink);
  font-size: 11px;
  line-height: 1.25;
}

.integration-class-list {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  min-width: 0;
}

.integration-class-list b {
  display: inline-flex;
  align-items: center;
  min-height: 16px;
  max-width: 100%;
  padding: 1px 5px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--surface-muted);
  color: var(--muted);
  font-size: 9px;
  line-height: 1.1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.integration-class-list.detail b {
  font-size: 9.5px;
  background: var(--surface-raised);
}

.integration-tile em.neutral,
.integration-status-pill.neutral {
  color: var(--muted);
  background: var(--surface-muted);
}

.integration-tile em.not-installed,
.integration-status-pill.not-installed {
  color: var(--not-installed-ink);
  background: var(--not-installed-bg);
  border: 1px solid var(--not-installed-border);
}

.integration-tile em.ok,
.integration-status-pill.ok {
  color: var(--status-ok-fg);
  background: var(--status-ok-bg);
}

.integration-tile em.warn,
.integration-status-pill.warn {
  color: var(--status-warn-fg);
  background: var(--status-warn-bg);
}

.integration-tile em.danger,
.integration-status-pill.danger {
  color: var(--status-danger-fg);
  background: var(--status-danger-bg);
}

.integration-detail {
  display: grid;
  align-content: start;
  gap: 10px;
  padding: 10px;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  background: var(--surface-soft);
}

.integration-detail-head {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 8px;
  align-items: start;
  margin: -10px -10px 0;
  padding: 10px;
  border-bottom: 1px solid var(--line);
  border-radius: 8px 8px 0 0;
  background: var(--titlebar);
}

.integration-detail-head h3 {
  margin: 0;
  color: var(--ink);
  font-size: 16px;
}

.integration-detail-head p:not(.eyebrow),
.integration-status-row span:last-child,
.integration-placeholder p {
  margin: 0;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.35;
}

.integration-status-row,
.integration-detail-actions,
.integration-surface-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.integration-surface-row span {
  padding: 3px 6px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--surface-muted);
  color: var(--muted);
  font-size: 10px;
  font-weight: 700;
}

.integration-surface-row span.active {
  border-color: color-mix(in srgb, var(--green) 52%, var(--line));
  background: var(--green-soft);
  color: var(--green);
}

.integration-emery-hook {
  display: grid;
  gap: 5px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--accent-soft);
}

.integration-runtime-summary {
  display: grid;
  gap: 5px;
  padding: 8px;
  border: 1px solid color-mix(in srgb, var(--green) 42%, var(--line));
  border-radius: 8px;
  background: var(--green-soft);
}

.integration-runtime-summary strong {
  color: var(--green);
  font-size: 11px;
}

.integration-runtime-summary span {
  color: var(--muted);
  font-size: 10.5px;
  overflow-wrap: anywhere;
}

.integration-runtime-summary div {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}

.integration-runtime-summary b {
  padding: 2px 6px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--green-soft) 74%, var(--surface-raised));
  color: var(--green);
  font-size: 9.5px;
}

.integration-tool-router {
  display: grid;
  gap: 8px;
  padding: 9px;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  background: var(--surface-raised);
}

.integration-tool-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: start;
}

.integration-tool-head strong,
.integration-tool-card strong {
  color: var(--ink);
  font-size: 11.5px;
}

.integration-tool-head p,
.integration-tool-card p {
  margin: 2px 0 0;
  color: var(--muted);
  font-size: 10.5px;
  line-height: 1.35;
}

.integration-tool-list {
  display: grid;
  gap: 8px;
}

.integration-tool-card {
  display: grid;
  gap: 7px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-muted);
}

.integration-tool-card small {
  display: block;
  color: var(--muted);
  font-size: 10px;
}

.integration-tool-schema {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}

.integration-tool-schema span {
  padding: 2px 6px;
  border-radius: 999px;
  background: var(--accent-soft);
  color: var(--accent-ink);
  font-size: 9.5px;
  font-weight: 800;
}

.integration-emery-hook strong {
  color: var(--accent-ink);
  font-size: 11px;
}

.integration-emery-hook ul {
  margin: 0;
  padding-left: 16px;
  color: var(--muted);
  font-size: 10.5px;
  line-height: 1.35;
}

.integration-config {
  display: grid;
  gap: 10px;
  padding: 10px;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  background: var(--surface-raised);
}

.integration-config > .settings-section,
.integration-config > .integration-fields {
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-soft);
}

.integration-config > .settings-section > h4 {
  margin: -10px -10px 2px;
  padding: 8px 10px;
  border-bottom: 1px solid var(--line);
  border-radius: 8px 8px 0 0;
  background: var(--titlebar);
}

.installed-settings-grid {
  display: grid;
  gap: 8px;
}

.installed-setting-field {
  min-width: 0;
}

.installed-setting-field select[multiple] {
  min-height: 78px;
}

.integration-test-credentials {
  display: grid;
  gap: 7px;
  padding: 9px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-muted);
}

.integration-test-credentials h5 {
  margin: 0;
  color: var(--ink);
  font-size: 11px;
  text-transform: uppercase;
}

.integration-test-credentials p {
  margin: 0;
  color: var(--muted);
  font-size: 10.5px;
  line-height: 1.35;
}

.integration-config-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-raised);
}

.integration-config-summary span {
  display: grid;
  gap: 2px;
  min-width: 0;
  color: var(--ink);
  font-size: 10.5px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.integration-config-summary b {
  color: var(--muted);
  font-size: 9px;
  text-transform: uppercase;
}

.policies-regulations-drawer,
.regulatory-policy-settings {
  display: grid;
  gap: 14px;
}

.policy-settings-tabs {
  justify-content: flex-start;
  margin: -4px 0 2px;
}

.policy-settings-section-title {
  margin: 2px 0 0;
}

.regulatory-policy-head {
  padding-bottom: 12px;
  border-bottom: 1px solid var(--line);
}

.regulatory-policy-enable-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 14px 16px;
  border: 1px solid var(--accent);
  border-radius: 10px;
  background: var(--accent-soft);
}

.regulatory-policy-enable-card > div {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.regulatory-policy-enable-card p {
  margin: 0;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.45;
}

.regulatory-policy-switch {
  flex: 0 0 auto;
  margin: 0;
  font-weight: 800;
}

.regulatory-policy-options {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) minmax(280px, 1.5fr);
  gap: 12px;
  align-items: end;
}

.moss-framework-picker {
  display: grid;
  gap: 12px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface-raised);
}

.moss-framework-heading,
.moss-framework-summary,
.moss-framework-row {
  display: flex;
  align-items: center;
  gap: 12px;
}

.moss-framework-heading {
  justify-content: space-between;
}

.moss-framework-heading h5,
.moss-framework-heading p {
  margin: 0;
}

.moss-framework-search {
  display: grid;
  gap: 6px;
}

.moss-framework-search > span {
  color: var(--muted);
  font-size: .84rem;
  font-weight: 500;
}

.moss-framework-steps {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  padding: 0;
  margin: 0;
  list-style: none;
}

.moss-framework-steps li {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: var(--surface);
  color: var(--muted);
}

.moss-framework-steps b {
  display: grid;
  place-items: center;
  flex: 0 0 24px;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: var(--accent-soft);
  color: var(--accent);
}

.moss-framework-start {
  display: grid;
  justify-items: start;
  gap: 7px;
  padding: 16px;
  border: 1px dashed var(--line-strong);
  border-radius: 10px;
  background: var(--surface);
}

.moss-framework-start p {
  max-width: 720px;
  margin: 0;
  color: var(--muted);
}

.moss-framework-start-error {
  border-color: var(--warning);
}

.moss-framework-summary {
  flex-wrap: wrap;
  font-size: .84rem;
  color: var(--muted);
}

.moss-framework-summary span + span::before {
  content: "·";
  margin-right: 12px;
}

.moss-framework-list {
  display: grid;
  max-height: 360px;
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 10px;
}

.moss-framework-row {
  align-items: flex-start;
  padding: 11px 12px;
  cursor: pointer;
}

.moss-framework-row[hidden] {
  display: none;
}

.moss-framework-row + .moss-framework-row {
  border-top: 1px solid var(--line);
}

.moss-framework-row input[type="checkbox"] {
  flex: 0 0 auto;
  width: 16px;
  height: 16px;
  min-height: 16px;
  max-height: 16px;
  padding: 0;
  margin-top: 3px;
}

.moss-framework-row span,
.moss-framework-row b,
.moss-framework-row small {
  display: block;
}

.moss-framework-row small {
  margin-top: 3px;
  color: var(--muted);
}

.moss-framework-empty {
  padding: 12px;
}

@media (max-width: 760px) {
  .regulatory-policy-enable-card {
    align-items: flex-start;
    flex-direction: column;
  }

  .regulatory-policy-options {
    grid-template-columns: 1fr;
  }

  .moss-framework-steps {
    grid-template-columns: 1fr;
  }
}

.regulatory-provider-attribution {
  margin: 2px 0 0;
  color: var(--muted);
  font-size: 12px;
  font-weight: 650;
  letter-spacing: .02em;
  text-align: right;
}

.integration-placeholder {
  display: grid;
  gap: 5px;
  padding: 10px;
  border: 1px dashed var(--line-strong);
  border-radius: 8px;
  background: var(--surface-raised);
}

.integration-placeholder strong {
  color: var(--ink);
  font-size: 12px;
}

@media (max-width: 980px) {
  .integration-store-layout {
    grid-template-columns: minmax(0, 1fr);
  }
}

.foundation-grid {
  display: grid;
  gap: 7px;
}

.foundation-row {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(90px, .7fr) minmax(110px, .8fr) auto;
  gap: 8px;
  align-items: center;
  padding: 8px;
  border: 1px solid var(--border-soft);
  border-radius: 7px;
  background: var(--panel-bg-subtle);
}

.foundation-row > div {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.foundation-row strong,
.foundation-row b {
  overflow: hidden;
  color: var(--text-primary);
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.foundation-row span,
.foundation-row small {
  color: var(--muted);
  font-size: 10px;
  font-weight: 750;
}

.foundation-row p {
  grid-column: 1 / -1;
  color: var(--text-secondary);
}

.audit-mini-log {
  display: grid;
  gap: 4px;
  max-height: 140px;
  overflow: auto;
  padding: 8px;
  border: 1px solid var(--border-soft);
  border-radius: 7px;
  background: var(--panel-bg-subtle);
}

.audit-mini-log p {
  color: var(--text-secondary);
  font-family: var(--font-mono);
  font-size: 11px;
  line-height: 1.35;
}

.audit-mini-log strong {
  color: var(--text-primary);
}

.settings-textarea {
  min-height: 92px;
  resize: vertical;
}

.api-key-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  padding: 10px;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  background: var(--panel-bg);
}

.api-key-form .api-feature-box,
.api-key-form > .drawer-actions {
  grid-column: 1 / -1;
}

.api-feature-box {
  display: grid;
  gap: 4px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--soft);
}

.api-key-table {
  display: grid;
  gap: 4px;
  max-height: 190px;
  overflow: auto;
}

.api-key-row {
  display: grid;
  grid-template-columns: minmax(120px, 1fr) minmax(110px, 1fr) minmax(150px, 1.15fr) minmax(90px, .8fr) 72px 64px;
  gap: 8px;
  align-items: center;
  padding: 7px 8px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--panel-bg);
  font-size: 11px;
}

.api-key-row small {
  display: block;
  margin-top: 2px;
  color: var(--muted);
}

.a2a-agent-form {
  display: grid;
  grid-template-columns: minmax(180px, 1fr) 120px minmax(140px, .7fr) auto;
  gap: 8px;
  align-items: end;
  padding: 10px;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  background: var(--surface-raised);
}

.agent-farm-workspace {
  display: grid;
  gap: 12px;
}

.agent-farm-workspace-head {
  align-items: start;
}

.agent-farm-metrics {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 8px;
}

.agent-farm-metrics article {
  display: grid;
  gap: 2px;
  min-height: 74px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-raised);
}

.agent-farm-metrics strong {
  color: var(--ink);
  font-size: 24px;
  line-height: 1;
}

.agent-farm-metrics span {
  color: var(--ink);
  font-size: 12px;
  font-weight: 800;
}

.agent-farm-metrics small {
  color: var(--muted);
  font-size: 10px;
}

.agent-farm-dashboard {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(260px, .7fr);
  gap: 10px;
  align-items: start;
}

.agent-farm-card {
  min-width: 0;
}

.agent-farm-tabs {
  display: grid;
  gap: 10px;
}

.agent-farm-tab-list {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 4px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-raised);
}

.agent-farm-tab-list button {
  min-height: 34px;
  padding: 8px 12px;
  border: 1px solid transparent;
  border-radius: 6px;
  background: transparent;
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  line-height: 1.2;
  cursor: pointer;
  box-shadow: none;
}

.agent-farm-tab-list button:hover,
.agent-farm-tab-list button:focus-visible {
  background: var(--surface-soft);
  color: var(--ink);
}

.agent-farm-tab-list button.active {
  border-color: var(--accent);
  background: var(--accent-soft);
  color: var(--accent-ink);
}

.agent-farm-tab-panel {
  display: block;
}

.agent-farm-tab-panel[hidden] {
  display: none;
}

.agent-farm-primary,
.agent-farm-registry {
  grid-column: 1;
}

.agent-farm-source-list,
.agent-farm-policy-grid,
.agent-farm-guidance-grid {
  display: grid;
  gap: 8px;
}

.agent-farm-source-list article,
.agent-farm-policy-grid span,
.agent-farm-guidance-grid article {
  display: grid;
  gap: 4px;
  padding: 9px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-raised);
}

.agent-farm-source-list article span {
  justify-self: start;
  padding: 2px 7px;
  border-radius: 999px;
  background: var(--accent-soft);
  color: var(--accent-ink);
  font-size: 9px;
  font-weight: 900;
  line-height: 1.2;
  text-transform: uppercase;
}

.agent-farm-source-list strong,
.agent-farm-policy-grid b,
.agent-farm-guidance-grid strong {
  color: var(--ink);
  font-size: 12px;
}

.agent-farm-source-list p,
.agent-farm-policy-grid span,
.agent-farm-guidance-grid p {
  color: var(--muted);
  font-size: 10.5px;
  line-height: 1.35;
}

.agent-farm-guidance-grid p {
  margin: 0;
}

.agent-farm-step-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.agent-farm-step-card {
  position: relative;
  display: grid;
  gap: 7px;
  min-width: 0;
  padding: 12px 12px 12px 48px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-raised);
}

.agent-farm-step-wide {
  grid-column: 1 / -1;
}

.agent-farm-step-index {
  position: absolute;
  inset-block-start: 12px;
  inset-inline-start: 12px;
  display: grid;
  place-items: center;
  inline-size: 26px;
  block-size: 26px;
  border-radius: 50%;
  border: 1px solid var(--accent);
  background: var(--accent-soft);
  color: var(--accent-ink);
  font-size: 12px;
  font-weight: 900;
}

.agent-farm-step-card strong {
  color: var(--ink);
  font-size: 12px;
}

.agent-farm-step-card p {
  margin: 0;
  color: var(--muted);
  font-size: 10.5px;
  line-height: 1.35;
}

.agent-farm-runtime-guide {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 8px;
  margin-top: 10px;
}

.agent-farm-runtime-guide article {
  display: grid;
  gap: 6px;
  min-width: 0;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-raised);
}

.agent-farm-runtime-guide strong {
  color: var(--ink);
  font-size: 12px;
}

.agent-farm-runtime-guide p {
  margin: 0;
  color: var(--muted);
  font-size: 10.5px;
  line-height: 1.35;
}

.agent-farm-runtime-guide code {
  display: block;
  min-width: 0;
  overflow-wrap: anywhere;
  padding: 7px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--surface);
  color: var(--ink);
  font-size: 10px;
  line-height: 1.35;
}

.agent-farm-section-head {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 10px;
}

.agent-farm-section-head > div:first-child {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.agent-farm-section-head > div:first-child > strong,
.agent-farm-section-head > div:first-child > small {
  display: block;
}

.agent-farm-section-head > div:first-child > small {
  color: var(--muted);
  font-size: 11px;
  line-height: 1.35;
}

.agent-farm-section-head p {
  margin: 3px 0 0;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.35;
}

.agent-farm-summary-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 8px;
  margin-bottom: 10px;
}

.agent-farm-summary-grid article {
  display: grid;
  gap: 3px;
  min-height: 70px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-raised);
}

.agent-farm-summary-grid strong {
  color: var(--muted);
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
}

.agent-farm-summary-grid span {
  color: var(--ink);
  font-size: 20px;
  font-weight: 900;
  line-height: 1;
}

.agent-farm-summary-grid small {
  color: var(--muted);
  font-size: 10px;
}

.agent-farm-ops-hero {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 8px;
  margin-bottom: 10px;
}

.agent-farm-ops-hero article {
  display: grid;
  gap: 6px;
  min-width: 0;
  min-height: 120px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-raised);
}

.agent-farm-ops-hero.ok article:first-child {
  border-color: var(--status-ok-border);
  background: var(--status-ok-bg);
}

.agent-farm-ops-hero.warn article:first-child {
  border-color: var(--status-warn-border);
  background: var(--status-warn-bg);
}

.agent-farm-ops-hero.danger article:first-child {
  border-color: var(--status-danger-border);
  background: var(--status-danger-bg);
}

.agent-farm-ops-hero span {
  color: var(--muted);
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
}

.agent-farm-ops-hero strong {
  color: var(--ink);
  font-size: 27px;
  line-height: 1;
}

.agent-farm-ops-hero small {
  min-height: 28px;
  color: var(--muted);
  font-size: 10.5px;
  line-height: 1.35;
}

.agent-farm-ops-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.agent-farm-operational-details,
.system-operational-details {
  margin-top: 10px;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  background: var(--surface-raised);
  overflow: hidden;
}

.agent-farm-operational-details > summary,
.system-operational-details > summary {
  min-height: 54px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 12px;
  cursor: pointer;
  list-style: none;
  background: var(--surface-soft);
}

.agent-farm-operational-details > summary::-webkit-details-marker,
.system-operational-details > summary::-webkit-details-marker {
  display: none;
}

.agent-farm-operational-details > summary > span:first-child,
.system-operational-details > summary > span:first-child {
  display: grid;
  gap: 3px;
}

.agent-farm-operational-details > summary strong,
.system-operational-details > summary strong {
  color: var(--ink);
  font-size: 12px;
}

.agent-farm-operational-details > summary small,
.system-operational-details > summary small {
  color: var(--muted);
  font-size: 10.5px;
}

.agent-farm-operational-details[open] > summary,
.system-operational-details[open] > summary {
  border-bottom: 1px solid var(--line);
}

.agent-farm-operational-details > .agent-farm-ops-grid,
.system-operational-details-body {
  padding: 10px;
}

.agent-farm-current-attention {
  border-color: var(--status-warn-border);
}

.agent-farm-ops-panel {
  display: grid;
  gap: 10px;
  min-width: 0;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-raised);
}

.agent-farm-ops-panel.wide {
  grid-column: 1 / -1;
}

.agent-farm-ops-panel > strong {
  color: var(--ink);
  font-size: 12px;
}

.system-health-overview {
  display: grid;
  gap: 10px;
}

.system-health-card {
  position: relative;
  overflow: hidden;
}

.system-health-card::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 3px;
  background: var(--muted);
}

.system-health-card.ok::before { background: var(--green); }
.system-health-card.warn::before { background: var(--orange); }
.system-health-card.danger::before { background: var(--danger); }

.system-operational-details {
  margin-top: 0;
}

.system-operational-details-body {
  display: grid;
  gap: 10px;
}

.agent-farm-recommendation-list {
  display: grid;
  gap: 7px;
}

.agent-farm-recommendation-list div {
  display: grid;
  gap: 4px;
  min-width: 0;
  padding: 9px;
  border: 1px solid var(--status-neutral-border);
  border-radius: 8px;
  background: var(--status-neutral-bg);
}

.agent-farm-recommendation-list div.ok {
  border-color: var(--status-ok-border);
  background: var(--status-ok-bg);
}

.agent-farm-recommendation-list div.warn {
  border-color: var(--status-warn-border);
  background: var(--status-warn-bg);
}

.agent-farm-recommendation-list div.danger {
  border-color: var(--status-danger-border);
  background: var(--status-danger-bg);
}

.agent-farm-recommendation-list span {
  color: var(--muted);
  font-size: 9px;
  font-weight: 900;
  text-transform: uppercase;
}

.agent-farm-recommendation-list b {
  color: var(--ink);
  font-size: 12px;
}

.agent-farm-recommendation-list small {
  color: var(--muted);
  font-size: 10.5px;
  line-height: 1.35;
}

.agent-farm-class-grid {
  display: grid;
  gap: 6px;
}

.agent-farm-class-row {
  display: grid;
  grid-template-columns: minmax(160px, 1.2fr) repeat(5, minmax(90px, .8fr));
  gap: 8px;
  align-items: center;
  min-width: 0;
  padding: 9px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-raised);
  color: var(--muted);
  font-size: 10.5px;
}

.agent-farm-class-row.header {
  min-height: 34px;
  background: var(--surface);
  color: var(--ink);
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
}

.agent-farm-class-row strong {
  display: block;
  color: var(--ink);
  font-size: 12px;
}

.agent-farm-class-row small {
  display: block;
  margin-top: 2px;
  color: var(--muted);
  font-size: 10px;
  line-height: 1.3;
}

.agent-farm-health-grid,
.agent-farm-capacity-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.agent-farm-health-grid article,
.agent-farm-capacity-grid article {
  display: grid;
  gap: 10px;
  min-width: 0;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-raised);
}

.agent-farm-health-grid article.warn {
  border-color: var(--status-warn-border);
}

.agent-farm-health-grid article.danger {
  border-color: var(--status-danger-border);
}

.agent-farm-health-main {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 10px;
}

.agent-farm-health-main strong,
.agent-farm-capacity-grid > article > strong {
  display: block;
  color: var(--ink);
  font-size: 12px;
}

.agent-farm-health-main small {
  display: block;
  margin-top: 2px;
  color: var(--muted);
  font-size: 10px;
  line-height: 1.3;
}

.agent-farm-health-main span {
  flex: 0 0 auto;
  padding: 3px 7px;
  border: 1px solid var(--status-neutral-border);
  border-radius: 999px;
  background: var(--status-neutral-bg);
  color: var(--status-neutral-fg);
  font-size: 9px;
  font-weight: 900;
  line-height: 1.2;
  text-transform: uppercase;
}

.agent-farm-health-grid article.ok .agent-farm-health-main span {
  border-color: var(--status-ok-border);
  background: var(--status-ok-bg);
  color: var(--status-ok-fg);
}

.agent-farm-health-grid article.warn .agent-farm-health-main span {
  border-color: var(--status-warn-border);
  background: var(--status-warn-bg);
  color: var(--status-warn-fg);
}

.agent-farm-health-grid article.danger .agent-farm-health-main span {
  border-color: var(--status-danger-border);
  background: var(--status-danger-bg);
  color: var(--status-danger-fg);
}

.agent-farm-health-bars {
  display: grid;
  gap: 6px;
}

.agent-farm-health-bar {
  display: grid;
  grid-template-columns: minmax(82px, .75fr) minmax(42px, auto) minmax(120px, 1fr);
  align-items: center;
  gap: 8px;
  color: var(--muted);
  font-size: 10px;
}

.agent-farm-health-bar b {
  color: var(--ink);
  font-size: 10px;
  text-align: right;
}

.agent-farm-health-bar i,
.agent-farm-inline-meter {
  display: block;
  height: 7px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--surface-muted);
}

.agent-farm-health-bar em,
.agent-farm-inline-meter em {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: var(--accent);
}

.agent-farm-health-grid footer {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  color: var(--muted);
  font-size: 10px;
}

.agent-farm-worker-map {
  display: grid;
  gap: 8px;
}

.agent-farm-worker-map article {
  display: grid;
  grid-template-columns: minmax(170px, .78fr) 42px minmax(280px, 1.22fr);
  gap: 10px;
  align-items: center;
  min-width: 0;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
}

.agent-farm-worker-map article.warn {
  border-color: var(--status-warn-border);
}

.agent-farm-worker-map article.danger {
  border-color: var(--status-danger-border);
}

.agent-farm-worker-map-queue {
  display: grid;
  gap: 4px;
  min-width: 0;
  padding: 10px;
  border: 1px solid var(--status-neutral-border);
  border-radius: 8px;
  background: var(--status-neutral-bg);
}

.agent-farm-worker-map article.ok .agent-farm-worker-map-queue {
  border-color: var(--status-ok-border);
  background: var(--status-ok-bg);
}

.agent-farm-worker-map article.warn .agent-farm-worker-map-queue {
  border-color: var(--status-warn-border);
  background: var(--status-warn-bg);
}

.agent-farm-worker-map article.danger .agent-farm-worker-map-queue {
  border-color: var(--status-danger-border);
  background: var(--status-danger-bg);
}

.agent-farm-worker-map-queue span {
  color: var(--muted);
  font-size: 9px;
  font-weight: 900;
  text-transform: uppercase;
}

.agent-farm-worker-map-queue strong {
  min-width: 0;
  overflow: hidden;
  color: var(--ink);
  font-size: 14px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.agent-farm-worker-map-queue small {
  color: var(--muted);
  font-size: 10px;
  line-height: 1.3;
}

.agent-farm-worker-map-line {
  position: relative;
  height: 2px;
  background: var(--line);
}

.agent-farm-worker-map-line i {
  position: absolute;
  top: 50%;
  right: -1px;
  width: 8px;
  height: 8px;
  border-top: 2px solid var(--line);
  border-right: 2px solid var(--line);
  transform: translateY(-50%) rotate(45deg);
}

.agent-farm-worker-map-workers {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 7px;
  min-width: 0;
}

.agent-farm-worker-map-workers span {
  display: grid;
  gap: 3px;
  min-width: 0;
  min-height: 52px;
  padding: 8px;
  border: 1px solid var(--status-neutral-border);
  border-radius: 7px;
  background: var(--surface-raised);
}

.agent-farm-worker-map-workers span.ok {
  border-color: var(--status-ok-border);
}

.agent-farm-worker-map-workers span.danger {
  border-color: var(--status-danger-border);
  background: var(--status-danger-bg);
}

.agent-farm-worker-map-workers b,
.agent-farm-worker-map-workers small {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.agent-farm-worker-map-workers b {
  color: var(--ink);
  font-size: 11px;
}

.agent-farm-worker-map-workers small {
  color: var(--muted);
  font-size: 9.5px;
}

.agent-farm-worker-map p {
  grid-column: 1 / -1;
  margin: 0;
  color: var(--muted);
  font-size: 10.5px;
  line-height: 1.35;
}

.agent-farm-workclass-map {
  display: grid;
  gap: 10px;
  margin-bottom: 12px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-raised);
}

.agent-farm-workclass-map > strong {
  color: var(--ink);
  font-size: 12px;
}

.agent-farm-workclass-map .agent-graph-card {
  margin: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.agent-farm-workclass-map .agent-flow-canvas {
  width: 100%;
  max-width: 1180px;
  min-height: 430px;
  height: clamp(430px, var(--agent-flow-height, 54vh), 760px);
  margin-inline: auto;
}

.admin-agent-flow {
  position: relative;
  min-width: 900px;
  min-height: 380px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
}

.admin-agent-flow-band {
  position: absolute;
  left: 14px;
  z-index: 3;
  padding: 3px 8px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--surface-raised);
  color: var(--muted);
  font-size: 9px;
  font-weight: 900;
  text-transform: uppercase;
}

.admin-agent-flow-band.queue {
  top: 14px;
}

.admin-agent-flow-band.worker {
  top: 222px;
}

.admin-agent-flow-edges {
  position: absolute;
  inset: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

.admin-agent-flow-edges path {
  fill: none;
  stroke: var(--line-strong);
  stroke-width: 2;
  opacity: .72;
}

.admin-agent-flow-edges path.ok {
  stroke: var(--status-ok-fg);
}

.admin-agent-flow-edges path.warn {
  stroke: var(--status-warn-fg);
}

.admin-agent-flow-edges path.danger {
  stroke: var(--status-danger-fg);
}

.admin-agent-flow-node {
  position: absolute;
  z-index: 2;
  display: grid;
  gap: 4px;
  width: 156px;
  min-height: 86px;
  padding: 9px;
  border: 2px solid var(--status-neutral-border);
  border-radius: 8px;
  background: var(--surface-raised);
  color: var(--ink);
  text-align: left;
  transform: translateX(-50%);
  box-shadow: 0 10px 22px color-mix(in srgb, var(--rail-bg) 8%, transparent);
}

.admin-agent-flow-node:hover {
  border-color: var(--accent);
  background: var(--surface-selected);
}

.admin-agent-flow-node.queue.ok {
  border-color: var(--status-ok-border);
  background: var(--status-ok-bg);
}

.admin-agent-flow-node.queue.warn {
  border-color: var(--status-warn-border);
  background: var(--status-warn-bg);
}

.admin-agent-flow-node.queue.danger,
.admin-agent-flow-node.worker.danger {
  border-color: var(--status-danger-border);
  background: var(--status-danger-bg);
}

.admin-agent-flow-node.worker.ok {
  border-color: var(--status-ok-border);
}

.admin-agent-flow-node span {
  color: var(--muted);
  font-size: 9px;
  font-weight: 900;
  text-transform: uppercase;
}

.admin-agent-flow-node strong,
.admin-agent-flow-node small {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-agent-flow-node strong {
  font-size: 12px;
}

.admin-agent-flow-node small {
  color: var(--muted);
  font-size: 10px;
}

.agent-farm-ranked-list,
.agent-farm-impeded-list {
  display: grid;
  gap: 7px;
}

.agent-farm-ranked-list > div {
  display: grid;
  grid-template-columns: minmax(92px, 1fr) auto;
  gap: 5px 8px;
  align-items: center;
  min-width: 0;
}

.agent-farm-ranked-list span,
.agent-farm-ranked-list b {
  color: var(--muted);
  font-size: 10.5px;
}

.agent-farm-ranked-list b {
  color: var(--ink);
  text-align: right;
}

.agent-farm-ranked-list .agent-farm-inline-meter {
  grid-column: 1 / -1;
}

.agent-farm-efficiency-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
}

.agent-farm-efficiency-grid span {
  display: grid;
  gap: 2px;
  min-height: 58px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface);
}

.agent-farm-efficiency-grid b {
  color: var(--ink);
  font-size: 18px;
  line-height: 1;
}

.agent-farm-efficiency-grid small {
  color: var(--muted);
  font-size: 10px;
}

.agent-farm-performance-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 7px;
}

.routing-intelligence-controls {
  display: grid;
  gap: 7px;
}

.routing-intelligence-control {
  display: grid;
  gap: 9px;
  min-width: 0;
  padding: 9px 10px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface);
}

.routing-intelligence-control-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.routing-intelligence-control-head strong {
  min-width: 0;
  overflow: hidden;
  color: var(--ink);
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.routing-intelligence-control-head > div {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.routing-intelligence-control-head small {
  color: var(--muted);
  font-size: 10px;
}

.routing-intelligence-guidance {
  margin: 0;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.4;
}

.routing-intelligence-slider {
  position: relative;
  display: grid;
  grid-template-columns: repeat(3, minmax(74px, 1fr));
  gap: 4px;
  align-items: start;
}

.routing-intelligence-track {
  position: absolute;
  z-index: 0;
  top: 7px;
  right: calc(16.666% - 4px);
  left: calc(16.666% - 4px);
  height: 2px;
  overflow: hidden;
  border-radius: 999px;
  background: var(--line-strong);
}

.routing-intelligence-track i {
  display: block;
  width: 0;
  height: 100%;
  border-radius: inherit;
  background: var(--accent);
}

.routing-intelligence-control[data-routing-role="auto-route"] .routing-intelligence-track i {
  width: 50%;
}

.routing-intelligence-control[data-routing-role="enforce"] .routing-intelligence-track i {
  width: 100%;
}

.routing-intelligence-policy-slider[data-routing-role="auto-route"] .routing-intelligence-track i {
  width: 50%;
}

.routing-intelligence-step {
  position: relative;
  z-index: 1;
  display: grid;
  justify-items: center;
  gap: 4px;
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--muted);
  font: inherit;
  font-size: 10px;
  line-height: 1.2;
}

.routing-intelligence-step > span {
  display: grid;
  justify-items: center;
  gap: 2px;
  min-width: 0;
  text-align: center;
}

.routing-intelligence-step > span strong {
  color: inherit;
  font-size: 10px;
}

.routing-intelligence-step > span small {
  max-width: 210px;
  color: var(--muted);
  font-size: 9px;
  line-height: 1.3;
}

.routing-intelligence-policy-slider {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.routing-intelligence-policy-step {
  gap: 7px;
  min-width: 0;
  padding-inline: 4px;
}

.routing-intelligence-policy-step > i {
  width: 18px;
  height: 18px;
}

.routing-intelligence-policy-step > span strong {
  font-size: 12px;
}

.routing-intelligence-policy-step > span small {
  font-size: 10px;
}

button.routing-intelligence-step.available {
  color: var(--accent-ink);
  cursor: pointer;
}

.routing-intelligence-step > i {
  width: 14px;
  height: 14px;
  border: 2px solid var(--line-strong);
  border-radius: 50%;
  background: var(--surface);
}

.routing-intelligence-step.current > i {
  border-color: var(--accent);
  box-shadow: inset 0 0 0 3px var(--surface);
  background: var(--accent);
}

button.routing-intelligence-step.available:hover > i,
button.routing-intelligence-step.available:focus-visible > i {
  border-color: var(--accent);
}

button.routing-intelligence-step.available:focus-visible {
  border-radius: 4px;
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

.routing-intelligence-exception-action {
  display: flex;
  justify-content: flex-end;
}

.routing-intelligence-exception-action button {
  min-height: 30px;
}

.advanced-settings-head {
  display: grid;
  gap: 4px;
}

.advanced-settings-head h3,
.advanced-settings-head p,
.advanced-settings-domain-head h4,
.advanced-settings-domain-head p {
  margin: 0;
}

.advanced-settings-head p,
.advanced-settings-domain-head p {
  color: var(--muted);
  font-size: 11px;
  line-height: 1.45;
}

.advanced-settings-layout {
  display: grid;
  grid-template-columns: 180px minmax(0, 1fr);
  min-height: 420px;
  border: 1px solid var(--line);
  border-radius: 8px;
  overflow: hidden;
  background: var(--surface);
}

.advanced-settings-tree {
  display: grid;
  align-content: start;
  gap: 6px;
  padding: 12px;
  border-right: 1px solid var(--line);
  background: var(--soft);
}

.advanced-settings-tree > span {
  padding: 0 7px 4px;
  color: var(--muted);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.advanced-settings-tree button {
  display: grid;
  justify-items: start;
  gap: 2px;
  width: 100%;
  min-height: 48px;
  padding: 8px 10px;
  border: 1px solid transparent;
  background: transparent;
  color: var(--ink);
  text-align: left;
}

.advanced-settings-tree button.active {
  border-color: var(--accent-border);
  background: var(--accent-soft);
  color: var(--accent-ink);
}

.advanced-settings-tree button small {
  color: var(--muted);
  font-size: 9px;
}

.advanced-settings-domain {
  display: grid;
  align-content: start;
  gap: 12px;
  min-width: 0;
  padding: 16px;
}

.advanced-settings-domain-head {
  display: grid;
  gap: 3px;
  padding-bottom: 11px;
  border-bottom: 1px solid var(--line);
}

.routing-intelligence-advanced-settings {
  display: grid;
  gap: 12px;
}

.settings-section-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.settings-section-head > div {
  display: grid;
  gap: 3px;
}

.settings-section-head h4,
.settings-section-head p {
  margin: 0;
}

.settings-section-head p {
  color: var(--muted);
  font-size: 11px;
  line-height: 1.45;
}

.governed-skills-settings {
  display: grid;
  gap: 12px;
}

.governed-skill-group,
.governed-skill-effective-preview {
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface);
}

.governed-skill-group > summary,
.governed-skill-effective-preview > summary {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  min-height: 36px;
  padding: 8px 10px;
  cursor: pointer;
  background: var(--surface-soft);
}

.governed-skill-group > summary small,
.governed-skill-effective-preview > summary small,
.governed-skill-row small {
  color: var(--muted);
  font-size: 11px;
}

.governed-skill-group > .helper {
  margin: 10px 10px 0;
}

.governed-skill-group .personal-policy-list {
  margin: 0;
  padding: 0 10px;
}

.governed-skill-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
  min-height: 52px;
  padding: 8px 0;
}

.governed-skill-row > div {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.governed-skill-row p {
  margin: 0;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.4;
}

.governed-skill-row label {
  min-width: 118px;
}

.governed-skill-parameters {
  align-items: end;
}

.governed-skill-preview-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  background: var(--line);
}

.governed-skill-preview-grid > div {
  display: grid;
  gap: 4px;
  padding: 9px 10px;
  background: var(--surface);
}

.governed-skill-preview-grid p,
.governed-skill-preview-grid small {
  margin: 0;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.4;
}

@media (max-width: 760px) {
  .governed-skill-row,
  .governed-skill-preview-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}

.routing-intelligence-setting-list {
  display: grid;
  border: 1px solid var(--line);
  border-radius: 7px;
  overflow: hidden;
}

.routing-intelligence-setting-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: start;
  gap: 10px;
  min-height: 68px;
  padding: 10px 12px;
  border-bottom: 1px solid var(--line);
  background: var(--surface);
}

.routing-intelligence-setting-row:last-child {
  border-bottom: 0;
}

.routing-intelligence-setting-row > div:first-child {
  display: grid;
  gap: 3px;
}

.routing-intelligence-setting-row > div:first-child strong {
  color: var(--ink);
  font-size: 11px;
}

.routing-intelligence-setting-row > div:first-child small {
  max-width: 620px;
  color: var(--muted);
  font-size: 10px;
  line-height: 1.4;
}

.routing-intelligence-setting-row > button {
  justify-self: start;
}

.routing-intelligence-binary-slider button {
  min-width: 76px;
}

.routing-intelligence-binary-slider {
  justify-self: start;
}

.routing-intelligence-binary-slider button.active:disabled {
  opacity: 1;
  color: var(--accent-ink);
}

.routing-intelligence-ceiling-setting {
  align-items: start;
}

.routing-intelligence-ceiling-setting .routing-intelligence-policy-slider {
  width: 100%;
}

button.routing-intelligence-step.available:disabled {
  color: var(--muted);
  cursor: not-allowed;
  opacity: .55;
}

@media (max-width: 900px) {
  .advanced-settings-layout {
    grid-template-columns: 1fr;
  }

  .advanced-settings-tree {
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }

  .routing-intelligence-ceiling-setting .routing-intelligence-policy-slider {
    width: 100%;
  }
}

@media (max-width: 820px) {
  .routing-intelligence-policy-slider {
    gap: 6px;
  }

  .routing-intelligence-policy-step > span small {
    font-size: 9px;
  }
}

.routing-intelligence-advanced-settings > .helper {
  margin: 0;
  font-size: 11px;
  line-height: 1.45;
}

.agent-farm-performance-grid.quality {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.agent-farm-retention-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 7px;
}

.agent-farm-retention-grid article {
  min-height: 70px;
  padding: 9px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface);
}

.agent-farm-performance-grid article {
  min-height: 76px;
  padding: 9px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface);
}

.agent-farm-trend {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 7px;
  align-items: end;
}

.agent-farm-trend > div {
  display: grid;
  gap: 4px;
  justify-items: center;
  color: var(--muted);
  font-size: 9px;
}

.agent-farm-trend > div > i {
  display: flex;
  width: 100%;
  height: 44px;
  align-items: end;
  justify-content: center;
  gap: 2px;
  padding: 3px;
  border: 1px solid var(--line);
  border-radius: 5px;
  background: var(--surface-muted);
}

.agent-farm-trend > div > i em,
.agent-farm-trend > div > i b {
  width: 38%;
  border-radius: 3px 3px 0 0;
  background: var(--green);
}

.agent-farm-trend > div > i b {
  background: var(--danger);
}

.agent-farm-trend > p {
  grid-column: 1 / -1;
  display: flex;
  gap: 12px;
  margin: 0;
  font-size: 9px;
}

.agent-farm-trend > p span {
  display: inline-flex;
  gap: 4px;
  align-items: center;
}

.agent-farm-trend > p i {
  width: 8px;
  height: 8px;
  border-radius: 2px;
  background: var(--green);
}

.agent-farm-trend > p i.failed {
  background: var(--danger);
}

.agent-farm-activity-table {
  display: grid;
  gap: 5px;
}

.agent-farm-activity-row {
  display: grid;
  grid-template-columns: minmax(150px, 1.4fr) minmax(120px, 1fr) repeat(4, minmax(72px, .6fr));
  gap: 8px;
  align-items: center;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface);
  color: var(--muted);
  font-size: 10.5px;
}

.agent-farm-activity-row.header {
  background: var(--surface-muted);
  color: var(--ink);
  font-size: 9px;
  font-weight: 900;
  text-transform: uppercase;
}

.agent-farm-attention-row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 4px 8px;
  min-height: 52px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface);
}

.agent-farm-attention-row .badge {
  grid-row: 1 / span 2;
  align-self: start;
}

.agent-farm-attention-row strong,
.agent-farm-attention-row small {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.agent-farm-attention-row small {
  color: var(--muted);
  font-size: 10px;
}

.agent-farm-ledger-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  justify-content: flex-end;
}

.agent-farm-ledger-actions span {
  color: var(--muted);
  font-size: 10px;
}

.agent-farm-runtime-stack-wrap {
  display: grid;
  gap: 8px;
}

.agent-farm-runtime-stack {
  display: flex;
  height: 26px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--surface-muted);
}

.agent-farm-runtime-stack i {
  display: block;
  min-width: 4%;
  height: 100%;
  box-shadow: inset -1px 0 0 var(--project-stack-divider);
}

.agent-farm-runtime-stack-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 10px;
  align-items: center;
}

.agent-farm-runtime-stack-legend span {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: var(--muted);
  font-size: 10px;
}

.agent-farm-runtime-stack-legend b {
  color: var(--ink);
  font-size: 10px;
}


.agent-farm-usage-signal-strip {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 8px;
}

.agent-farm-usage-signal-strip article,
.agent-farm-usage-chart-card,
.agent-farm-usage-treemap-card,
.agent-farm-usage-breakdown-card,
.agent-farm-usage-attention-card {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-raised);
}

.agent-farm-usage-signal-strip article {
  display: grid;
  gap: 3px;
  min-height: 72px;
  padding: 10px;
}

.agent-farm-usage-signal-strip span,
.agent-farm-usage-card-head span {
  color: var(--muted);
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
}

.agent-farm-usage-signal-strip strong {
  color: var(--ink);
  font-size: 22px;
  line-height: 1;
}

.agent-farm-usage-signal-strip small {
  color: var(--muted);
  font-size: 10px;
}

.agent-farm-usage-layout,
.agent-farm-usage-lower {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(260px, .75fr);
  gap: 8px;
  margin-top: 8px;
}

.agent-farm-usage-chart-card,
.agent-farm-usage-treemap-card,
.agent-farm-usage-breakdown-card,
.agent-farm-usage-attention-card {
  display: grid;
  gap: 8px;
  padding: 10px;
}

.agent-farm-usage-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.agent-farm-usage-card-head strong {
  color: var(--ink);
  font-size: 12px;
}

.agent-farm-usage-chart {
  display: grid;
  gap: 8px;
  min-height: 238px;
}

.agent-farm-usage-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 7px 12px;
  align-items: center;
  min-height: 22px;
}

.agent-farm-usage-legend span {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: var(--muted);
  font-size: 10px;
}

.agent-farm-project-dot,
.agent-farm-line-swatch {
  display: inline-block;
  flex: 0 0 auto;
  inline-size: 9px;
  block-size: 9px;
  border-radius: 50%;
  background: var(--muted);
}

.agent-farm-project-dot.color-1,
.agent-farm-usage-column i.color-1,
.agent-farm-usage-treemap .color-1,
.agent-farm-runtime-stack .color-1 { background: var(--project-stack-1); }
.agent-farm-project-dot.color-2,
.agent-farm-usage-column i.color-2,
.agent-farm-usage-treemap .color-2,
.agent-farm-runtime-stack .color-2 { background: var(--project-stack-2); }
.agent-farm-project-dot.color-3,
.agent-farm-usage-column i.color-3,
.agent-farm-usage-treemap .color-3,
.agent-farm-runtime-stack .color-3 { background: var(--project-stack-3); }
.agent-farm-project-dot.color-4,
.agent-farm-usage-column i.color-4,
.agent-farm-usage-treemap .color-4,
.agent-farm-runtime-stack .color-4 { background: var(--project-stack-4); }
.agent-farm-project-dot.color-5,
.agent-farm-usage-column i.color-5,
.agent-farm-usage-treemap .color-5,
.agent-farm-runtime-stack .color-5 { background: var(--project-stack-5); }

.agent-farm-usage-treemap .color-1 { color: var(--project-stack-1-ink); }
.agent-farm-usage-treemap .color-2 { color: var(--project-stack-2-ink); }
.agent-farm-usage-treemap .color-3 { color: var(--project-stack-3-ink); }
.agent-farm-usage-treemap .color-4 { color: var(--project-stack-4-ink); }
.agent-farm-usage-treemap .color-5 { color: var(--project-stack-5-ink); }

.agent-farm-line-swatch {
  inline-size: 14px;
  block-size: 0;
  border-radius: 0;
  background: transparent;
}

.agent-farm-line-swatch.budget {
  border-top: 2px dashed var(--danger);
}

.agent-farm-line-swatch.forecast {
  border-top: 2px dashed var(--accent);
}

.agent-farm-usage-plot {
  position: relative;
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  align-items: end;
  gap: 8px;
  min-height: 194px;
  padding: 18px 6px 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
}

.agent-farm-usage-plot::before {
  content: "";
  position: absolute;
  inset: 18px 6px 24px;
  border-block: 1px solid var(--line);
  pointer-events: none;
}

.agent-farm-usage-plot article {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  align-items: end;
  gap: 5px;
  min-width: 0;
  height: 100%;
}

.agent-farm-usage-column {
  display: flex;
  flex-direction: column-reverse;
  min-height: 8px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 6px 6px 3px 3px;
  background: var(--surface-muted);
}

.agent-farm-usage-column i {
  display: block;
  min-height: 3px;
  box-shadow: inset 0 -1px 0 var(--project-stack-divider);
}

.agent-farm-usage-plot small {
  color: var(--muted);
  font-size: 10px;
  text-align: center;
}

.agent-farm-usage-budget-line,
.agent-farm-usage-forecast-line {
  position: absolute;
  inset-inline: 6px;
  z-index: 2;
  border-top: 1px dashed var(--danger);
  pointer-events: none;
}

.agent-farm-usage-forecast-line {
  border-top-color: var(--accent);
}

.agent-farm-usage-treemap {
  display: flex;
  flex-wrap: wrap;
  gap: 2px;
  min-height: 238px;
}

.agent-farm-usage-treemap div {
  display: grid;
  align-content: end;
  gap: 3px;
  min-width: 92px;
  min-height: 78px;
  padding: 10px;
  border: 1px solid var(--project-stack-divider);
  border-radius: 7px;
}

.agent-farm-usage-treemap strong,
.agent-farm-usage-treemap span,
.agent-farm-usage-treemap small {
  color: inherit;
  line-height: 1.15;
}

.agent-farm-usage-treemap strong {
  font-size: 11px;
}

.agent-farm-usage-treemap span {
  font-size: 16px;
  font-weight: 900;
}

.agent-farm-usage-treemap small {
  font-size: 12px;
  font-weight: 900;
}

.agent-farm-usage-lower {
  grid-template-columns: 1fr;
}

.agent-farm-usage-table.compact {
  gap: 4px;
  min-width: 0;
}

.agent-farm-usage-table.compact .agent-farm-usage-row {
  grid-template-columns: minmax(130px, 1.25fr) minmax(82px, .7fr) minmax(72px, .65fr) minmax(104px, .85fr) minmax(46px, .42fr) minmax(78px, .58fr);
  min-height: 38px;
  padding: 7px 8px;
}

.agent-farm-usage-table.compact .agent-farm-usage-row strong {
  display: flex;
  align-items: center;
  gap: 6px;
}

.agent-farm-usage-table.compact .agent-farm-usage-row > * {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

.agent-farm-usage-table.compact .agent-farm-usage-row > span {
  white-space: nowrap;
}

.agent-farm-usage-table.compact .agent-farm-usage-row small {
  display: inline;
  margin: 0;
}

.agent-farm-runtime-split {
  display: grid;
  grid-template-columns: auto minmax(46px, 1fr) auto;
  gap: 5px;
  align-items: center;
}

.agent-farm-runtime-split b,
.agent-farm-runtime-split small {
  color: var(--muted);
  font-size: 10px;
}

.agent-farm-runtime-split i {
  display: block;
  height: 7px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--surface-muted);
}

.agent-farm-runtime-split em {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: var(--accent);
}

.agent-farm-usage-row .ok { color: var(--status-ok-fg); }
.agent-farm-usage-row .warn { color: var(--status-warn-fg); }
.agent-farm-usage-row .danger { color: var(--status-danger-fg); }

.agent-farm-budget-pill {
  display: inline-flex;
  justify-content: center;
  max-width: 100%;
  padding: 3px 7px;
  border: 1px solid var(--status-neutral-border);
  border-radius: 999px;
  background: var(--status-neutral-bg);
  color: var(--status-neutral-fg);
  font-size: 9px;
  font-weight: 900;
  line-height: 1.2;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.agent-farm-budget-pill.ok {
  border-color: var(--status-ok-border);
  background: var(--status-ok-bg);
  color: var(--status-ok-fg);
}

.agent-farm-budget-pill.warn {
  border-color: var(--status-warn-border);
  background: var(--status-warn-bg);
  color: var(--status-warn-fg);
}

.agent-farm-budget-pill.danger {
  border-color: var(--status-danger-border);
  background: var(--status-danger-bg);
  color: var(--status-danger-fg);
}

.agent-farm-usage-attention-list {
  display: grid;
  gap: 7px;
}

.agent-farm-usage-attention-list div {
  display: grid;
  gap: 4px;
  padding: 9px;
  border: 1px solid var(--status-neutral-border);
  border-radius: 8px;
  background: var(--status-neutral-bg);
}

.agent-farm-usage-attention-list div.warn {
  border-color: var(--status-warn-border);
  background: var(--status-warn-bg);
}

.agent-farm-usage-attention-list div.danger {
  border-color: var(--status-danger-border);
  background: var(--status-danger-bg);
}

.agent-farm-usage-attention-list div.ok {
  border-color: var(--status-ok-border);
  background: var(--status-ok-bg);
}

.agent-farm-usage-attention-list span {
  color: var(--muted);
  font-size: 9px;
  font-weight: 900;
  text-transform: uppercase;
}

.agent-farm-usage-attention-list strong {
  color: var(--ink);
  font-size: 12px;
}

.agent-farm-usage-attention-list small {
  color: var(--muted);
  font-size: 10.5px;
  line-height: 1.35;
}

.agent-farm-monthly-chart {
  display: grid;
  gap: 8px;
  margin-bottom: 10px;
}

.agent-farm-monthly-chart article {
  display: grid;
  grid-template-columns: minmax(92px, .25fr) minmax(220px, 1fr);
  gap: 5px 10px;
  align-items: center;
  min-width: 0;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-raised);
}

.agent-farm-monthly-chart strong,
.agent-farm-monthly-chart span {
  display: block;
  color: var(--ink);
  font-size: 11px;
}

.agent-farm-monthly-chart span {
  color: var(--muted);
  font-weight: 800;
}

.agent-farm-monthly-chart small {
  grid-column: 2;
  color: var(--muted);
  font-size: 10px;
}

.agent-farm-stacked-bar {
  display: flex;
  height: 18px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--surface-muted);
}

.agent-farm-stacked-bar i:nth-child(1),
.executive-token-stack i:nth-child(1) { background: var(--project-stack-1); }
.agent-farm-stacked-bar i:nth-child(2),
.executive-token-stack i:nth-child(2) { background: var(--project-stack-2); }
.agent-farm-stacked-bar i:nth-child(3),
.executive-token-stack i:nth-child(3) { background: var(--project-stack-3); }
.agent-farm-stacked-bar i:nth-child(4),
.executive-token-stack i:nth-child(4) { background: var(--project-stack-4); }
.agent-farm-stacked-bar i:nth-child(n+5),
.executive-token-stack i:nth-child(n+5) { background: var(--project-stack-5); }

.agent-farm-usage-table {
  display: grid;
  gap: 5px;
}

.agent-farm-usage-row {
  display: grid;
  grid-template-columns: minmax(160px, 1.2fr) repeat(5, minmax(74px, .7fr));
  gap: 8px;
  align-items: center;
  min-width: 0;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-raised);
  color: var(--muted);
  font-size: 10.5px;
}

.agent-farm-usage-row.header {
  background: var(--surface);
  color: var(--ink);
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
}

.agent-farm-usage-row strong {
  display: block;
  color: var(--ink);
  font-size: 12px;
}

.agent-farm-usage-row small {
  display: block;
  margin-top: 2px;
  color: var(--muted);
  font-size: 10px;
}

.agent-farm-overview-section,
.agent-farm-worker-section {
  display: grid;
  gap: 8px;
}

.agent-farm-candidate-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 8px;
}

.agent-farm-candidate {
  display: grid;
  gap: 5px;
  min-height: 112px;
  padding: 9px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-raised);
}

.agent-farm-candidate span {
  justify-self: start;
  padding: 2px 7px;
  border-radius: 999px;
  background: var(--accent-soft);
  color: var(--accent-ink);
  font-size: 9px;
  font-weight: 900;
  line-height: 1.2;
  text-transform: uppercase;
}

.agent-farm-candidate strong {
  color: var(--ink);
  font-size: 12px;
  line-height: 1.2;
}

.agent-farm-candidate p {
  margin: 0;
  color: var(--muted);
  font-size: 10.5px;
  line-height: 1.35;
}

.agent-farm-decision-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.agent-farm-decision {
  display: grid;
  gap: 8px;
  padding: 10px;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  background: var(--surface-raised);
}

.agent-farm-decision p {
  margin: 0;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.35;
}

.agent-farm-path-list {
  display: grid;
  gap: 6px;
}

.agent-farm-path-list small {
  display: block;
  margin-top: 2px;
  color: var(--muted);
  font-size: 10px;
  line-height: 1.3;
}

.agent-farm-worker-form {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  align-items: end;
  padding: 10px;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  background: var(--surface-raised);
}

.agent-farm-worker-form .wide {
  grid-column: 1 / -1;
}

.agent-farm-worker-form button {
  justify-self: end;
}

.agent-farm-workspace .agent-farm-worker-form {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.agent-farm-workspace .agent-farm-configured-download-form {
  grid-template-columns: minmax(0, 1fr);
}

.agent-farm-workspace .agent-farm-configured-download-form .wide {
  grid-column: auto;
}

.agent-work-queue-create-form {
  margin: 12px 0 16px;
  padding: 14px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--surface-soft);
}

.agent-work-queue-create-form[hidden] {
  display: none;
}

.agent-farm-worker-assignments {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin: 10px 0 0;
  padding: 9px 10px 10px;
  border: 1px solid var(--line);
  border-radius: 6px;
}

.agent-farm-worker-assignments legend {
  padding: 0 4px;
  color: var(--muted);
  font-size: 12px;
}

.agent-farm-worker-assignment {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 30px;
  padding: 5px 9px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-raised);
  color: var(--text-primary);
  font-size: 12px;
  font-weight: 600;
  line-height: 1.2;
  cursor: pointer;
  user-select: none;
}

.agent-farm-worker-assignment:hover {
  border-color: var(--line-strong);
  background: var(--surface-soft);
}

.agent-farm-worker-assignment:has(input:checked) {
  border-color: var(--accent);
  background: var(--accent-soft);
  color: var(--accent-ink);
}

.agent-farm-worker-assignment:has(input:disabled) {
  opacity: .48;
  cursor: not-allowed;
}

.agent-farm-worker-assignment input[type="checkbox"] {
  appearance: none;
  display: grid;
  place-content: center;
  flex: 0 0 15px;
  width: 15px;
  height: 15px;
  min-height: 15px;
  margin: 0;
  padding: 0;
  border: 1px solid var(--line-strong);
  border-radius: 4px;
  background: var(--field-bg);
  color: var(--surface-raised);
}

.agent-farm-worker-assignment input[type="checkbox"]::before {
  content: "";
  width: 7px;
  height: 4px;
  border: solid currentColor;
  border-width: 0 0 2px 2px;
  opacity: 0;
  transform: translateY(-1px) rotate(-45deg) scale(.7);
}

.agent-farm-worker-assignment input[type="checkbox"]:checked {
  border-color: var(--accent-ink);
  background: var(--accent-ink);
}

.agent-farm-worker-assignment input[type="checkbox"]:checked::before {
  opacity: 1;
  transform: translateY(-1px) rotate(-45deg) scale(1);
}

.agent-farm-worker-assignment input[type="checkbox"]:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

.agent-work-queue-controls {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  margin-top: 10px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-soft);
}

.agent-work-queue-controls small {
  display: block;
  color: var(--muted);
}

.agent-work-queue-control-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.agent-farm-workspace .agent-farm-worker-form button {
  justify-self: stretch;
}

.agent-farm-workspace .a2a-agent-form {
  grid-template-columns: minmax(220px, 1fr) minmax(120px, .45fr) minmax(180px, .75fr);
}

.agent-farm-workspace .a2a-agent-form button {
  grid-column: 1 / -1;
  justify-self: stretch;
}

.agent-farm-workspace .a2a-agent-row {
  grid-template-columns: 1fr;
}

.agent-farm-workspace .a2a-agent-list {
  max-height: none;
  overflow: visible;
}

.agent-farm-workspace .a2a-agent-actions {
  justify-content: flex-start;
}

.integration-detail .agent-farm-candidate-grid {
  grid-template-columns: 1fr;
}

.integration-detail .agent-farm-candidate {
  min-height: auto;
}

.integration-detail .agent-farm-worker-form {
  grid-template-columns: 1fr;
}

.integration-detail .agent-farm-worker-form button {
  justify-self: stretch;
}

.integration-detail .agent-farm-overview-section .integration-config-summary {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

@media (max-width: 1100px) {
  .agent-farm-metrics {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .agent-farm-dashboard {
    grid-template-columns: 1fr;
  }

  .agent-farm-usage-layout,
  .agent-farm-usage-lower {
    grid-template-columns: 1fr;
  }

  .agent-farm-step-grid,
  .agent-farm-ops-hero,
  .agent-farm-ops-grid,
  .agent-farm-performance-grid,
  .agent-farm-performance-grid.quality,
  .agent-farm-retention-grid,
  .agent-farm-activity-row,
  .agent-farm-class-row,
  .agent-farm-health-grid,
  .agent-farm-capacity-grid,
  .agent-farm-worker-map article,
  .agent-farm-usage-table:not(.compact) .agent-farm-usage-row {
    grid-template-columns: 1fr;
  }

  .agent-farm-health-bar,
  .agent-farm-monthly-chart article {
    grid-template-columns: 1fr;
  }

  .agent-farm-monthly-chart small {
    grid-column: auto;
  }

  .agent-farm-decision-grid {
    grid-template-columns: 1fr;
  }

  .agent-farm-primary,
  .agent-farm-registry {
    grid-column: auto;
  }
}

.crewai-automation-form {
  grid-template-columns: minmax(220px, 0.85fr) minmax(320px, 1.15fr);
  align-items: start;
  gap: 10px 12px;
}

.crewai-automation-form label {
  min-width: 0;
}

.crewai-automation-form .wide,
.crewai-automation-form .form-actions {
  grid-column: 1 / -1;
}

.crewai-automation-form .settings-textarea {
  min-height: 92px;
  resize: vertical;
}

.crewai-automation-form .form-actions {
  display: flex;
  justify-content: flex-end;
}

.a2a-agent-list {
  display: grid;
  gap: 6px;
  max-height: 240px;
  overflow: auto;
}

.a2a-agent-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(150px, .55fr) auto;
  gap: 8px;
  align-items: start;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-raised);
}

.a2a-agent-row strong,
.a2a-agent-row small,
.a2a-agent-row span,
.a2a-agent-row em {
  display: block;
}

.a2a-agent-row strong {
  font-size: 12px;
}

.a2a-agent-row small,
.a2a-agent-row span {
  color: var(--muted);
  font-size: 10px;
  line-height: 1.35;
}

.a2a-agent-row p {
  margin: 3px 0;
  color: var(--ink);
  font-size: 11px;
}

.emery-capability-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 8px;
  margin-top: 6px;
}

.emery-capability-grid .check-row {
  min-height: 18px;
  font-size: 10px;
}

.a2a-agent-row em {
  color: var(--danger);
  font-size: 10px;
  font-style: normal;
}

.a2a-agent-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  justify-content: flex-end;
}

.key-reveal {
  display: grid;
  gap: 6px;
  padding: 10px;
  border: 1px solid var(--status-warn-border);
  border-radius: 8px;
  background: var(--status-warn-bg);
  color: var(--status-warn-fg);
}

.key-reveal textarea {
  min-height: 54px;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: 11px;
}

.segmented-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
}

.segmented-list label {
  display: grid;
  grid-template-columns: 14px minmax(0, 1fr);
  align-items: center;
  gap: 7px;
  min-height: 30px;
  padding: 6px 8px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--panel-bg);
  color: var(--text-primary);
  font-size: 12px;
}

.segmented-list label:has(input:checked) {
  border-color: var(--accent);
  background: var(--accent-soft);
  color: var(--link-fg);
}

.segmented-list input[type="checkbox"] {
  width: 13px;
  height: 13px;
  min-height: 13px;
  padding: 0;
  margin: 0;
}

.drawer-note {
  border: 1px solid var(--border-soft);
  background: var(--accent-soft);
  color: var(--accent-ink);
  border-radius: 8px;
  padding: 10px;
}

.toolbar-line {
  display: grid;
  grid-template-columns: minmax(200px, 1fr) auto;
  gap: 8px;
  align-items: end;
  margin-bottom: 8px;
}

.data-table {
  border: 1px solid var(--line);
  border-radius: 8px;
  overflow: auto;
  background: var(--surface-raised);
  max-width: 100%;
  min-width: 0;
}

.data-table .table-row {
  display: grid;
  gap: 8px;
  align-items: center;
  min-width: 620px;
  padding: 8px 10px;
  border-bottom: 1px solid var(--line);
}

.data-table .table-row:last-child {
  border-bottom: 0;
}

.data-table .table-row.head {
  background: var(--surface-muted);
  color: var(--muted);
  font-size: 10px;
  font-weight: 850;
  text-transform: uppercase;
}

.user-management {
  display: grid;
  grid-template-rows: auto auto minmax(180px, 1fr) auto auto;
  min-height: 0;
}

.user-sheet {
  max-height: clamp(210px, 34vh, 360px);
}

.data-row {
  display: grid;
  gap: 8px;
  align-items: center;
  min-width: 620px;
  padding: 8px 10px;
  border-bottom: 1px solid var(--line);
}

.data-row:last-child { border-bottom: 0; }

.admin-dashboard {
  display: grid;
  gap: 12px;
  min-height: 0;
}

.admin-overview-title {
  align-items: center;
  margin-bottom: 0;
  padding: 2px 2px 8px;
}

.admin-overview-title > button {
  white-space: nowrap;
}

.admin-posture-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.admin-posture-card {
  position: relative;
  min-height: 76px;
  display: grid;
  align-content: center;
  gap: 5px;
  padding: 13px 14px;
  overflow: hidden;
  border: 1px solid var(--line-strong);
  border-color: var(--line-strong);
  background: var(--surface-raised);
  text-align: left;
}

.admin-posture-card::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 3px;
  background: var(--muted);
}

.admin-posture-card.ok::before { background: var(--green); }
.admin-posture-card.warn::before { background: var(--orange); }
.admin-posture-card.danger::before { background: var(--danger); }

.admin-posture-card > span {
  color: var(--muted);
  font-size: 10px;
  font-weight: 850;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.admin-posture-card > strong {
  color: var(--ink);
  font-size: 18px;
  line-height: 1.2;
}

.admin-posture-card > small {
  color: var(--muted);
  font-size: 10.5px;
  line-height: 1.45;
}

.admin-overview-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(250px, .7fr);
  gap: 10px;
  align-items: start;
}

.admin-overview-primary {
  min-width: 0;
  display: grid;
  align-content: start;
  gap: 10px;
}

.admin-overview-card {
  min-width: 0;
  border: 1px solid var(--line-strong);
  border-radius: 9px;
  background: var(--surface-raised);
  overflow: hidden;
}

.admin-overview-card-head {
  min-height: 50px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 9px 12px;
  border-bottom: 1px solid var(--line);
  background: var(--surface-soft);
}

.admin-overview-card-head .eyebrow,
.admin-overview-card-head h3 {
  margin: 0;
}

.admin-overview-card-head .count {
  min-width: 26px;
  min-height: 22px;
  display: grid;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--muted);
  font-size: 10px;
  font-weight: 850;
}

.admin-attention-list,
.admin-inventory-list {
  display: grid;
}

.admin-attention-row {
  min-height: 59px;
  display: grid;
  grid-template-columns: 8px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-bottom: 1px solid var(--line);
}

.admin-attention-row:last-child { border-bottom: 0; }

.admin-attention-marker {
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: var(--muted);
}

.admin-attention-row.warn .admin-attention-marker { background: var(--orange); }
.admin-attention-row.danger .admin-attention-marker { background: var(--danger); }

.admin-attention-row strong {
  display: block;
  color: var(--ink);
  font-size: 11.5px;
}

.admin-attention-row p {
  margin: 3px 0 0;
  color: var(--muted);
  font-size: 10.5px;
}

.admin-attention-row button {
  min-height: 30px;
  white-space: nowrap;
}

.admin-all-clear {
  min-height: 96px;
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  align-items: center;
  gap: 11px;
  padding: 16px;
}

.admin-all-clear > span {
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: var(--green-soft);
  color: var(--green);
}

.admin-all-clear svg {
  width: 17px;
  height: 17px;
}

.admin-all-clear p {
  margin: 4px 0 0;
  color: var(--muted);
}

.admin-inventory-row {
  min-height: 56px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(90px, auto) auto;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  border-bottom: 1px solid var(--line);
}

.admin-inventory-row:last-child { border-bottom: 0; }

.admin-inventory-row > span {
  display: flex;
  align-items: baseline;
  gap: 7px;
  color: var(--ink);
  font-size: 11px;
}

.admin-inventory-row strong {
  font-size: 17px;
}

.admin-inventory-row small {
  max-width: 132px;
  color: var(--muted);
  font-size: 9.5px;
  text-align: right;
}

.admin-inventory-row button {
  min-height: 30px;
  white-space: nowrap;
}

.admin-recent-projects .admin-project-table {
  max-height: 240px;
  border: 0;
  border-radius: 0;
}

.admin-summary-grid,
.admin-detail-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.admin-summary-grid button,
.admin-detail-grid div {
  min-height: 58px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-raised);
  padding: 10px;
  text-align: left;
}

.admin-summary-grid strong,
.admin-detail-grid strong {
  display: block;
  font-size: 18px;
  color: var(--ink);
  line-height: 1.1;
}

.admin-summary-grid span,
.admin-detail-grid span {
  display: block;
  margin-top: 4px;
  color: var(--muted);
  font-size: 11px;
}

.admin-project-table {
  max-height: 48vh;
}

.admin-project-table .data-row {
  grid-template-columns: minmax(220px, 1.4fr) 112px minmax(150px, 180px) 76px auto;
  width: 100%;
  text-align: left;
  border-left: 0;
  border-right: 0;
  border-top: 0;
  border-radius: 0;
}

.admin-project-table .data-row > div {
  min-width: 0;
}

.admin-project-table .project-state-pill {
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-project-table .data-row:not(.data-head) {
  min-height: 48px;
  background: var(--surface-raised);
}

.admin-project-table .data-row > div:last-child {
  justify-self: end;
}

.admin-project-table .data-row > div:last-child button {
  min-height: 30px;
  white-space: nowrap;
}

.admin-project-table small {
  display: block;
  color: var(--muted);
  font-size: 11px;
  margin-top: 3px;
}

.admin-project-admin {
  display: grid;
  gap: 10px;
}

@media (max-width: 1180px) {
  .admin-posture-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .admin-overview-grid {
    grid-template-columns: 1fr;
  }
}

.admin-system {
  display: grid;
  gap: 10px;
  min-height: 0;
}

.system-tabs {
  display: flex;
  gap: 2px;
  padding: 0 2px;
  border: 0;
  border-radius: 0;
  background: transparent;
  overflow: auto hidden;
  align-items: flex-end;
}

.system-tabs button {
  min-height: 30px;
  border: 1px solid transparent;
  border-bottom: 0;
  border-radius: 7px 7px 0 0;
  background: transparent;
  color: var(--muted);
  font-size: 12px;
  font-weight: 750;
  white-space: nowrap;
}

.system-tabs button.active {
  position: relative;
  z-index: 1;
  margin-bottom: -1px;
  background: var(--surface-raised);
  border-color: var(--accent);
  border-bottom-color: var(--surface-raised);
  color: var(--accent-ink);
  box-shadow: inset 0 2px 0 var(--accent);
}

.system-metrics-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: 8px;
}

.system-metric-card {
  min-height: 86px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-raised);
}

.system-metric-card span {
  display: block;
  color: var(--muted);
  font-size: 10px;
  font-weight: 850;
  text-transform: uppercase;
}

.system-metric-card strong {
  display: block;
  margin-top: 5px;
  color: var(--ink);
  font-size: 18px;
  line-height: 1.2;
  overflow-wrap: anywhere;
}

.system-metric-card p {
  margin: 5px 0 0;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.35;
}

.support-screen {
  display: grid;
  gap: 10px;
}

.support-grid {
  display: grid;
  grid-template-columns: minmax(420px, .72fr) minmax(320px, .38fr);
  gap: 10px;
  align-items: stretch;
  min-width: 0;
}

.support-title-lockup {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  min-width: 0;
}

.support-headset-icon {
  display: inline-grid;
  width: 44px;
  height: 44px;
  place-items: center;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  background: var(--accent-soft);
  color: var(--accent-ink);
}

.support-headset-icon svg {
  width: 30px;
  height: 30px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.support-card {
  display: grid;
  gap: 8px;
  align-content: start;
  min-width: 0;
  overflow: hidden;
  padding: 10px;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  background: var(--surface-raised);
}

.support-card-strong {
  border-color: var(--line-strong);
  background: var(--surface-soft);
}

.support-issue-card {
  grid-column: 1 / -1;
  background: var(--surface-raised);
}

.support-card h3 {
  margin: 0;
  font-size: 13px;
}

.support-card p {
  margin: 0;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.4;
}

.support-chat-card {
  min-height: min(640px, calc(100vh - 170px));
  grid-template-rows: auto minmax(280px, 1fr) auto auto auto auto;
}

.support-chat-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(160px, 220px);
  gap: 10px;
  align-items: start;
  min-width: 0;
}

.support-chat-head label {
  min-width: 0;
}

.support-chat-log {
  display: grid;
  align-content: start;
  gap: 8px;
  min-height: 280px;
  max-height: calc(100vh - 380px);
  overflow: auto;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-soft);
}

.support-chat-message {
  display: grid;
  justify-self: start;
  gap: 5px;
  max-width: min(760px, 92%);
  padding: 8px 9px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-raised);
  color: var(--ink);
  font-size: 12px;
  line-height: 1.45;
}

.support-chat-message.user {
  margin-left: 22px;
  border-color: var(--accent);
  background: var(--accent-soft);
}

.support-chat-message.assistant {
  border-color: var(--line-strong);
  background: var(--surface-raised);
}

.support-chat-message p,
.support-chat-message ul,
.support-chat-message ol {
  margin: 0;
}

.support-chat-message ul,
.support-chat-message ol {
  padding-left: 18px;
}

.support-permission-panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 9px;
  border: 1px solid var(--accent);
  border-radius: 8px;
  background: var(--accent-soft);
}

.support-permission-panel strong {
  color: var(--accent-ink);
  font-size: 12px;
}

.support-policy-review {
  display: grid;
  gap: 8px;
  padding: 9px;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  background: var(--surface-raised);
}

.support-policy-head,
.support-policy-intent {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: start;
  min-width: 0;
}

.support-policy-head strong,
.support-policy-intent strong {
  font-size: 12px;
}

.support-policy-head p,
.support-policy-intent p {
  margin: 2px 0 0;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.4;
}

.support-policy-reasons {
  display: grid;
  gap: 3px;
  margin: 0;
  padding-left: 18px;
  color: var(--muted);
  font-size: 10.5px;
  line-height: 1.35;
}

.support-policy-intents {
  display: grid;
  gap: 7px;
}

.support-policy-intent {
  padding: 8px;
  border: 1px solid var(--line);
  border-left: 4px solid var(--line-strong);
  border-radius: 7px;
  background: var(--surface-soft);
}

.support-policy-intent.status-ready {
  border-left-color: var(--green);
}

.support-policy-intent.status-needs-approval,
.support-policy-intent.status-handoff,
.support-policy-intent.status-needs-review {
  border-left-color: var(--warning);
}

.support-policy-intent.status-blocked {
  border-left-color: var(--danger);
}

.support-policy-intent-title {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}

.support-policy-intent small {
  display: block;
  margin-top: 3px;
  color: var(--muted);
  font-size: 10.5px;
  line-height: 1.35;
}

.support-policy-decision.approved {
  color: var(--green);
  font-weight: 800;
}

.support-policy-decision.rejected {
  color: var(--danger);
  font-weight: 800;
}

.support-policy-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 6px;
}

.support-learning-events {
  display: grid;
  gap: 6px;
  padding-top: 8px;
  border-top: 1px solid var(--line);
}

.support-learning-events > strong {
  font-size: 12px;
}

.support-learning-events > div {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 4px 6px;
  align-items: center;
  padding: 6px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-soft);
}

.support-learning-events small {
  color: var(--muted);
  font-size: 10.5px;
}

.support-learning-events p {
  grid-column: 1 / -1;
  margin: 0;
  color: var(--muted);
  font-size: 10.5px;
  line-height: 1.35;
}

.support-permission-actions,
.support-chat-actions,
.support-chat-prompts {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}

.support-chat-prompts button {
  font-size: 11px;
}

.support-chat-composer {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: end;
  min-width: 0;
}

.support-chat-composer textarea {
  min-height: 58px;
  max-height: 140px;
  resize: vertical;
}

.support-form {
  display: grid;
  grid-template-columns: minmax(160px, 1fr) minmax(108px, .45fr);
  gap: 8px;
  align-items: end;
  min-width: 0;
}

.support-form > label {
  min-width: 0;
}

.support-issue-form {
  display: grid;
  grid-template-columns: minmax(150px, .45fr) minmax(180px, .55fr);
  gap: 8px;
  align-items: start;
  min-width: 0;
}

.support-issue-form label {
  min-width: 0;
}

.support-issue-form .wide {
  grid-column: 1 / -1;
}

.support-issue-form textarea {
  min-height: 62px;
  resize: vertical;
}

.support-issue-result {
  display: grid;
  gap: 8px;
}

.support-issue-note {
  display: grid;
  gap: 6px;
  max-height: 360px;
  overflow: auto;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-raised);
  color: var(--ink);
  font-size: 11px;
  line-height: 1.45;
}

.support-issue-note p,
.support-issue-note ul,
.support-issue-note ol {
  margin: 0;
}

.support-issue-note ul,
.support-issue-note ol {
  padding-left: 18px;
}

.support-debug {
  grid-column: 1 / -1;
  align-self: center;
  margin-bottom: 0;
}

.support-card-strong .drawer-actions {
  justify-content: flex-start;
  min-width: 0;
}

.support-card-strong .drawer-actions button {
  max-width: 100%;
}

.support-checklist {
  display: grid;
  gap: 6px;
  margin: 0;
  padding-left: 17px;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.35;
}

.support-result {
  border-color: var(--green);
}

.support-progress-panel {
  position: relative;
  z-index: 2;
  border-color: var(--accent);
  background: var(--accent-soft);
}

.support-progress-list {
  display: grid;
  gap: 3px;
  max-height: 160px;
  margin: 3px 0 0;
  padding-left: 18px;
  overflow: auto;
  color: var(--ink);
  font-size: 10.5px;
  line-height: 1.35;
}

.support-progress-list li:last-child {
  color: var(--accent-ink);
  font-weight: 800;
}

.support-result .drawer-actions {
  margin-top: 4px;
}

.support-list-card {
  min-height: 160px;
}

.support-work-card {
  align-content: start;
  grid-template-rows: auto minmax(0, auto) auto auto;
}

.support-work-card > .support-chat-head {
  grid-template-columns: minmax(0, 1fr) minmax(112px, .78fr);
  gap: 8px;
}

.support-work-card > .support-chat-head > button {
  width: 100%;
  min-width: 0;
  white-space: nowrap;
}

.support-work-card > .support-chat-head h3 {
  line-height: 1.08;
}

.support-work-card > .support-chat-head p {
  font-size: 10px;
  line-height: 1.3;
}

.support-bundles-head {
  margin-top: 6px;
  padding-top: 8px;
  border-top: 1px solid var(--line);
}

.support-work-list {
  display: grid;
  gap: 7px;
  max-height: min(360px, 42vh);
  overflow: auto;
}

.support-work-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: start;
  padding: 8px;
  border: 1px solid var(--line);
  border-left: 4px solid var(--accent);
  border-radius: 7px;
  background: var(--surface-raised);
}

.support-work-row.status-scheduled {
  border-left-color: var(--green);
}

.support-work-row.status-failed {
  border-left-color: var(--danger);
}

.support-work-row strong,
.support-work-row small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.support-work-row strong {
  font-size: 12px;
}

.support-work-row small {
  margin-top: 2px;
  color: var(--muted);
  font-size: 10.5px;
}

.support-work-row p {
  margin-top: 5px;
}

.support-work-row ol {
  display: grid;
  gap: 3px;
  max-height: 112px;
  margin: 6px 0 0;
  padding-left: 18px;
  overflow: auto;
  color: var(--muted);
  font-size: 10.5px;
}

.support-work-row code {
  color: var(--ink);
  font-size: 10.5px;
}

.support-work-actions {
  display: flex;
  justify-content: flex-end;
}

.support-scheduler {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  padding: 9px;
  border: 1px solid var(--accent);
  border-radius: 8px;
  background: var(--accent-soft);
}

.support-scheduler > div:first-child,
.support-scheduler label:nth-of-type(3),
.support-scheduler .check-row,
.support-scheduler-actions {
  grid-column: 1 / -1;
}

.support-scheduler strong {
  color: var(--accent-ink);
  font-size: 12px;
}

.support-scheduler input {
  min-width: 0;
}

.support-scheduler-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  justify-content: flex-end;
}

.support-bundle-list {
  display: grid;
  gap: 6px;
  max-height: 180px;
  overflow: auto;
}

.support-bundle-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
  padding: 7px 8px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-raised);
}

.support-bundle-row:hover,
.support-bundle-row:focus-within {
  border-color: var(--line-strong);
  background: var(--surface-selected);
}

.support-bundle-actions {
  display: flex;
  gap: 5px;
  align-items: center;
}

.support-delete-button {
  display: inline-flex;
  width: 24px;
  height: 24px;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 1px solid transparent;
  border-radius: 6px;
  background: transparent;
  color: var(--text-secondary);
  opacity: 0;
  transition: opacity .12s ease, border-color .12s ease, background .12s ease, color .12s ease;
}

.support-bundle-row:hover .support-delete-button,
.support-bundle-row:focus-within .support-delete-button {
  opacity: 1;
}

.support-delete-button:hover,
.support-delete-button:focus-visible {
  border-color: var(--danger);
  background: var(--danger-soft);
  color: var(--danger);
}

.support-delete-button svg {
  width: 14px;
  height: 14px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.support-bundle-row strong,
.support-bundle-row small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.support-bundle-row strong {
  font-size: 12px;
}

.support-bundle-row small {
  margin-top: 2px;
  color: var(--muted);
  font-size: 10.5px;
}

.system-performance-panel {
  display: grid;
  gap: 8px;
  padding: 10px;
  border: 1px solid var(--border-strong);
  border-radius: 8px;
  background: color-mix(in srgb, var(--panel-bg) 82%, transparent);
}

.system-log-panel {
  display: grid;
  grid-template-rows: auto minmax(220px, 1fr) auto;
  min-height: 0;
  border: 1px solid var(--border-strong);
  border-radius: 8px;
  overflow: hidden;
  background: var(--surface-raised);
}

.system-log-panel .artifact-filter-bar {
  border-width: 0 0 1px;
  border-radius: 0;
}

.scale-target-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  gap: 8px;
}

.scale-target-grid div {
  padding: 8px 10px;
  border: 1px solid var(--border-soft);
  border-radius: 7px;
  background: var(--panel-bg-subtle);
}

.scale-target-grid span {
  display: block;
  color: var(--muted);
  font-size: 10px;
  font-weight: 850;
  text-transform: uppercase;
}

.scale-target-grid strong {
  display: block;
  margin-top: 3px;
  font-size: 16px;
}

.performance-table {
  display: grid;
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-raised);
}

.performance-row {
  display: grid;
  grid-template-columns: minmax(190px, 1.5fr) repeat(5, minmax(80px, .7fr));
  min-width: 680px;
  border-top: 1px solid var(--line);
  background: var(--surface-raised);
}

.performance-row:first-child {
  border-top: 0;
}

.performance-row span {
  padding: 7px 8px;
  color: var(--ink);
  font-size: 11px;
  line-height: 1.25;
}

.performance-head span {
  color: var(--muted);
  font-size: 10px;
  font-weight: 850;
  text-transform: uppercase;
  background: var(--surface-muted);
}

.performance-row.ok span:nth-child(3) {
  color: var(--status-ok-fg);
  font-weight: 800;
}

.performance-row.warn span:nth-child(3) {
  color: var(--status-warn-fg);
  font-weight: 800;
}

.message-center {
  display: grid;
  gap: 10px;
}

.message-pane {
  display: grid;
  gap: 8px;
  min-height: 0;
  padding: 10px;
  border: 1px solid var(--border-soft);
  border-radius: 8px;
  background: var(--surface);
}

.message-inbox-pane {
  max-height: min(280px, 34vh);
}

.message-summary-list {
  display: grid;
  gap: 6px;
  overflow: auto;
  padding-right: 2px;
}

.message-pane-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.message-pane-title h3 {
  margin: 0;
  font-size: 13px;
}

.message-pane-title span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 750;
}

.message-summary-row {
  width: 100%;
  display: grid;
  grid-template-columns: minmax(112px, 0.8fr) minmax(0, 2fr) minmax(64px, auto);
  grid-template-rows: minmax(20px, auto) minmax(21px, auto);
  grid-template-areas:
    "from subject actions"
    "tags time assessment";
  gap: 3px 12px;
  align-items: center;
  justify-items: stretch;
  min-height: 56px;
  padding: 9px 12px;
  border: 1px solid var(--border-soft);
  border-radius: 7px;
  background: var(--surface-soft);
  color: var(--text);
  text-align: left;
  box-shadow: none;
}

.message-summary-row:hover,
.message-summary-row:focus-visible,
.message-summary-row.selected {
  border-color: var(--topbar-active-border);
  background: var(--accent-soft);
}

.message-cell-button {
  min-width: 0;
  min-height: 0;
  overflow: hidden;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  text-align: left;
  box-shadow: none;
  line-height: 1.25;
}

.message-cell-button:hover,
.message-cell-button:focus-visible {
  background: transparent;
  color: var(--accent-ink);
  box-shadow: none;
}

.message-from-cell {
  grid-area: from;
  overflow: hidden;
  color: var(--muted);
  font-size: 12px;
  font-weight: 750;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.message-subject-cell {
  grid-area: subject;
  overflow: hidden;
  color: var(--text);
  font-size: 13px;
  font-weight: 650;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.message-summary-row.unread .message-subject-cell {
  font-weight: 900;
}

.message-row-actions {
  grid-area: actions;
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 4px;
  white-space: nowrap;
}

.message-summary-row small,
.message-detail small {
  color: var(--muted);
  font-size: 11px;
}

.message-detail {
  display: grid;
  gap: 10px;
}

.message-detail-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 6px 12px;
  align-items: start;
}

.message-detail-head .message-badges,
.message-detail-head h3,
.message-detail-head small {
  grid-column: 1;
}

.message-detail h3 {
  margin: 0;
  font-size: 16px;
  overflow-wrap: anywhere;
}

.message-detail p {
  margin: 0;
  color: var(--text);
}

.message-actions,
.message-action-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.message-actions {
  align-items: center;
  justify-content: flex-end;
  grid-column: 2;
  grid-row: 1 / span 3;
}

.message-badges {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  gap: 8px;
  row-gap: 7px;
  align-items: center;
  max-width: 100%;
  padding-top: 2px;
}

.message-tags-cell {
  grid-area: tags;
  min-width: 0;
  min-height: 22px;
  overflow: hidden;
}

.message-time-cell {
  grid-area: time;
  justify-self: start;
  min-width: 0;
  min-height: 18px;
  overflow: hidden;
  color: var(--muted);
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.message-assessment-cell {
  grid-area: assessment;
  justify-self: end;
  min-width: 28px;
  min-height: 24px;
}

.message-badges span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 1 auto;
  min-width: 0;
  max-width: 100%;
  min-height: 18px;
  padding: 2px 7px;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--muted);
  background: var(--chip-muted);
  font-size: 10px;
  font-weight: 800;
  line-height: 1.1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.message-summary-row .message-badges {
  flex-wrap: nowrap;
}

.message-summary-row .message-badges span {
  max-width: 112px;
}

.message-icon-action {
  position: relative;
  width: 28px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--muted);
  box-shadow: none;
}

.message-icon-action::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: transparent;
}

.message-icon-action:hover,
.message-icon-action:focus-visible {
  background: transparent;
  color: var(--accent-ink);
  box-shadow: none;
}

.message-icon-action:hover::before,
.message-icon-action:focus-visible::before {
  background: var(--accent-soft);
}

.message-icon-action.ai {
  color: var(--accent-ink);
}

.message-icon-action:disabled {
  opacity: 0.5;
}

.message-icon-action svg,
.message-assessment-indicator svg {
  position: relative;
  z-index: 1;
  width: 17px;
  height: 17px;
}

.message-icon-action[data-tooltip]::after {
  content: attr(data-tooltip);
  position: absolute;
  right: 0;
  top: calc(100% + 6px);
  z-index: 20;
  max-width: 180px;
  padding: 4px 7px;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--surface-raised);
  color: var(--text);
  font-size: 11px;
  font-weight: 750;
  line-height: 1.2;
  opacity: 0;
  pointer-events: none;
  transform: translateY(2px);
  transition: opacity 120ms ease, transform 120ms ease;
  white-space: nowrap;
  box-shadow: var(--shadow);
}

.message-icon-action[data-tooltip]:hover::after,
.message-icon-action[data-tooltip]:focus-visible::after {
  opacity: 1;
  transform: translateY(0);
}

.message-assessment-indicator {
  width: 24px;
  height: 24px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  color: var(--muted);
}

.message-assessment-indicator.done {
  color: var(--status-ok-fg);
  background: transparent;
}

.message-assessment-indicator.working {
  color: var(--accent-ink);
  background: transparent;
}

.message-assessment-indicator.pending {
  width: 8px;
  height: 8px;
  margin: 8px;
  background: var(--border);
}

.message-badges .danger {
  color: var(--danger);
  background: var(--danger-soft);
  border-color: var(--status-danger-border);
}

.message-badges .warn {
  color: var(--orange);
  background: var(--orange-soft);
  border-color: var(--status-warn-border);
}

.message-badges .neutral {
  background: var(--soft);
}

.message-badges .tag {
  color: var(--accent-ink);
  background: var(--accent-soft);
  border-color: var(--topbar-active-border);
}

.message-detail-working {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 28px;
  padding: 0 8px;
  border: 1px solid var(--topbar-active-border);
  border-radius: 7px;
  background: var(--accent-soft);
  color: var(--accent-ink);
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap;
}

.message-detail-working svg {
  width: 16px;
  height: 16px;
}

.message-body {
  margin: 0;
  max-height: 220px;
  overflow: auto;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  padding: 10px;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--soft);
  color: var(--text);
  font: inherit;
}

.message-notes {
  display: grid;
  gap: 4px;
}

.message-notes strong {
  color: var(--muted);
  font-size: 11px;
  font-weight: 850;
  text-transform: uppercase;
}

.message-notes p {
  margin: 0;
}

.message-action {
  display: grid;
  gap: 4px;
  min-width: min(260px, 100%);
  padding: 10px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--surface-2);
}

.message-action span,
.message-delivery {
  color: var(--muted);
  font-size: 12px;
}

.message-support-assessment {
  position: relative;
  display: grid;
  gap: 9px;
  padding: 13px 13px 13px 15px;
  border: 1px solid color-mix(in srgb, var(--accent) 58%, var(--border));
  border-left: 5px solid var(--accent);
  border-radius: 8px;
  background: color-mix(in srgb, var(--accent-soft) 62%, var(--surface-raised));
  box-shadow: inset 0 1px 0 color-mix(in srgb, var(--surface-raised) 76%, white 24%), 0 10px 22px color-mix(in srgb, var(--accent) 16%, transparent);
}

.message-support-assessment-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}

.message-support-assessment-title {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  min-width: 0;
}

.message-support-ai-mark {
  width: 28px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  border: 1px solid var(--topbar-active-border);
  border-radius: 7px;
  background: var(--surface);
  color: var(--accent-ink);
  box-shadow: inset 0 1px 0 color-mix(in srgb, var(--surface-raised) 80%, white 20%), 0 2px 6px color-mix(in srgb, var(--accent) 14%, transparent);
}

.message-support-ai-mark svg {
  width: 17px;
  height: 17px;
}

.message-support-assessment-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 6px;
}

.message-support-assessment-actions button {
  min-height: 24px;
  padding: 3px 8px;
  font-size: 11px;
}

.message-support-assessment strong,
.message-support-assessment small {
  display: block;
}

.message-support-assessment small,
.message-support-assessment-actions > span,
.message-support-recommendation span {
  color: var(--muted);
  font-size: 11px;
}

.message-support-assessment p {
  margin: 0;
  color: var(--text);
}

.message-support-recommendation {
  display: grid;
  gap: 3px;
  padding: 8px;
  border: 1px solid var(--border-soft);
  border-radius: 6px;
  background: var(--surface);
}

.message-support-automation {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 9px;
  border: 1px solid var(--topbar-active-border);
  border-radius: 7px;
  background: var(--surface);
}

.message-support-automation strong {
  display: block;
  color: var(--accent-ink);
  font-size: 12px;
}

.message-support-automation-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 6px;
}

.message-support-automation-actions button {
  min-height: 28px;
  padding: 4px 9px;
  font-size: 11px;
}

.message-support-signals {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.message-support-signals span {
  padding: 3px 7px;
  border: 1px solid var(--border-soft);
  border-radius: 999px;
  background: var(--surface);
  color: var(--muted);
  font-size: 11px;
  font-weight: 750;
}

.message-support-assessment ol {
  margin: 0;
  padding-left: 18px;
  color: var(--text);
}

.message-support-assessment li + li {
  margin-top: 3px;
}

.message-support-knowledge {
  display: grid;
  gap: 4px;
  padding-top: 2px;
}

.message-support-knowledge > span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 850;
  text-transform: uppercase;
}

.message-support-knowledge small {
  display: block;
  overflow: hidden;
  color: var(--muted);
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.project-metrics-page {
  display: grid;
  gap: 9px;
}

.metrics-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 8px;
}

.metrics-grid-primary {
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 7px;
}

.metrics-grid-supporting {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

/* The budget summary has five cards; give each card the available width so
   governance labels such as "3 interventions" stay readable. */
.project-budget-page > .metrics-grid {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.project-budget-page > .metrics-grid .metric-card strong {
  font-size: 19px;
  line-height: 1.05;
}

.metric-card,
.metric-panel {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-raised);
}

.metric-card {
  min-height: 110px;
  padding: 10px;
  border-left-width: 1px;
  border-radius: 7px;
  box-shadow: none;
}

.metric-card-lead {
  grid-column: span 2;
  min-height: 110px;
}

.metric-card-label {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
}

.metric-card-label > span {
  display: block;
  color: var(--muted);
  font-size: 10px;
  font-weight: 850;
  text-transform: uppercase;
}

.metric-card strong {
  display: block;
  margin-top: 7px;
  color: var(--ink);
  font-size: 22px;
  line-height: 1.1;
  font-variant-numeric: tabular-nums lining-nums;
}

.metric-card p {
  display: -webkit-box;
  overflow: hidden;
  margin: 6px 0 0;
  color: var(--muted);
  font-size: 10.5px;
  line-height: 1.3;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}

.metric-card.ok { box-shadow: inset 3px 0 0 var(--green); }
.metric-card.warn { box-shadow: inset 3px 0 0 var(--orange); }
.metric-card.danger { box-shadow: inset 3px 0 0 var(--danger); }
.metric-card.neutral { box-shadow: inset 3px 0 0 var(--border-strong); }

.metric-status-dot,
.delivery-signal-mark,
.blocker-severity {
  width: 7px;
  height: 7px;
  flex: 0 0 7px;
  border-radius: 999px;
  background: var(--status-neutral-fg);
}

.metric-card.ok .metric-status-dot { background: var(--status-ok-fg); }
.metric-card.warn .metric-status-dot { background: var(--status-warn-fg); }
.metric-card.danger .metric-status-dot { background: var(--status-danger-fg); }

.metric-health-scale {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 7px;
  align-items: center;
  margin-top: 9px;
}

.metric-health-scale meter {
  width: 100%;
  height: 7px;
}

.metric-health-scale span {
  color: var(--muted);
  font-size: 9px;
  font-weight: 750;
  white-space: nowrap;
}

.metric-card-lead-body {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 126px;
  gap: 8px;
  align-items: end;
}

.metric-health-trend {
  min-width: 0;
  display: grid;
  gap: 2px;
  color: var(--status-danger-fg);
}

.metric-health-trend svg {
  width: 100%;
  height: 62px;
  overflow: visible;
}

.metric-health-trend polyline {
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  vector-effect: non-scaling-stroke;
}

.metric-health-trend circle {
  fill: var(--surface-raised);
  stroke: currentColor;
  stroke-width: 1.5;
  vector-effect: non-scaling-stroke;
}

.metric-health-trend .target {
  stroke: var(--chart-target);
  stroke-dasharray: 4 4;
  vector-effect: non-scaling-stroke;
}

.metric-health-trend span {
  color: var(--muted);
  font-size: 8px;
  font-weight: 750;
  text-align: center;
}

.delivery-planning-panel {
  display: grid;
  gap: 8px;
  padding: 10px 11px 7px;
}

.delivery-planning-head > div {
  display: grid;
  gap: 2px;
}

.delivery-planning-head p {
  margin: 0;
  color: var(--muted);
  font-size: 9.5px;
  font-weight: 850;
  letter-spacing: .035em;
  text-transform: uppercase;
}

.delivery-planning-head select {
  width: auto;
  min-height: 28px;
  padding: 3px 26px 3px 8px;
  font-size: 9.5px;
}

.delivery-planning-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 16px;
  color: var(--muted);
  font-size: 8.5px;
  font-weight: 700;
}

.delivery-planning-legend span {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}

.delivery-planning-legend span::before {
  width: 18px;
  height: 3px;
  display: block;
  border-radius: 2px;
  background: var(--chart-primary);
  content: "";
}

.delivery-planning-legend .completed::before {
  height: 7px;
  border-radius: 2px 2px 0 0;
  background: color-mix(in srgb, var(--chart-series-2) 62%, transparent);
}

.delivery-planning-legend .ideal::before,
.delivery-planning-legend .risk::before {
  height: 0;
  border-top: 1px dashed var(--chart-series-2);
  border-radius: 0;
  background: transparent;
}

.delivery-planning-legend .risk::before {
  border-top-color: var(--status-danger-fg);
}

.delivery-planning-plot {
  min-height: 205px;
  overflow: hidden;
}

.delivery-planning-plot svg {
  width: 100%;
  height: 230px;
  display: block;
}

.delivery-planning-plot .grid line {
  stroke: var(--chart-grid);
  stroke-width: 1;
  vector-effect: non-scaling-stroke;
}

.delivery-planning-plot .grid text,
.delivery-planning-plot .sprint-date {
  fill: var(--muted);
  font-size: 8px;
  font-variant-numeric: tabular-nums lining-nums;
}

.delivery-planning-plot .sprint-label {
  fill: var(--ink);
  font-size: 8.5px;
  font-weight: 750;
}

.delivery-planning-plot .completed-bar {
  fill: var(--chart-series-2);
  opacity: .4;
}

.delivery-planning-plot .planned-line,
.delivery-planning-plot .ideal-line {
  fill: none;
  stroke: var(--chart-primary);
  stroke-width: 2;
  vector-effect: non-scaling-stroke;
}

.delivery-planning-plot .ideal-line {
  stroke: var(--chart-series-2);
  stroke-width: 1.5;
  stroke-dasharray: 5 4;
}

.delivery-planning-plot .risk-line {
  stroke: var(--status-danger-fg);
  stroke-width: 1.25;
  stroke-dasharray: 5 4;
  vector-effect: non-scaling-stroke;
}

.delivery-planning-plot .planned-point {
  fill: var(--surface-raised);
  stroke: var(--chart-primary);
  stroke-width: 2;
  vector-effect: non-scaling-stroke;
}

.delivery-planning-empty {
  min-height: 150px;
  display: grid;
  place-content: center;
  gap: 4px;
  border-top: 1px solid var(--line-soft);
  color: var(--muted);
  text-align: center;
}

.delivery-planning-empty strong {
  color: var(--ink);
  font-size: 12px;
}

.delivery-planning-empty p {
  max-width: 440px;
  margin: 0;
  font-size: 10px;
}

.delivery-readiness-panel {
  gap: 10px;
  padding: 10px 11px 11px;
}

.delivery-readiness-head > div {
  display: grid;
  gap: 2px;
}

.delivery-readiness-head p,
.metric-section-head span {
  margin: 0;
  color: var(--muted);
  font-size: 9.5px;
  font-weight: 850;
  letter-spacing: .035em;
  text-transform: uppercase;
}

.delivery-readiness-chart {
  min-height: 132px;
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 7px;
}

.delivery-chart-axis {
  height: 88px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  color: var(--muted);
  font-size: 8.5px;
  font-variant-numeric: tabular-nums;
  text-align: right;
}

.delivery-chart-plot {
  position: relative;
  height: 132px;
  display: grid;
  grid-template-columns: repeat(8, minmax(44px, 1fr));
  gap: 7px;
  align-items: start;
  border-bottom: 1px solid var(--chart-grid);
  background: transparent;
}

.delivery-chart-target {
  position: absolute;
  top: 22px;
  left: 0;
  right: 0;
  z-index: 1;
  border-top: 1px dashed var(--chart-target);
  pointer-events: none;
}

.delivery-chart-target span {
  position: absolute;
  top: -13px;
  right: 0;
  color: var(--chart-target);
  font-size: 8.5px;
  font-weight: 750;
}

.delivery-chart-column {
  position: relative;
  z-index: 2;
  min-width: 0;
  display: grid;
  grid-template-rows: 12px 76px auto auto;
  gap: 3px;
  align-items: end;
  text-align: center;
}

.delivery-chart-column > span,
.delivery-chart-column small {
  color: var(--muted);
  font-size: 8.5px;
  font-variant-numeric: tabular-nums lining-nums;
}

.delivery-chart-track {
  width: min(30px, 72%);
  height: 76px;
  display: flex;
  align-items: flex-end;
  justify-self: center;
  overflow: hidden;
  border-radius: 3px 3px 0 0;
  background: color-mix(in srgb, var(--chart-track) 72%, transparent);
}

.delivery-chart-track i {
  width: 100%;
  height: max(2px, var(--metric-percent));
  display: block;
  border-radius: 3px 3px 0 0;
  background: var(--chart-primary);
}

.delivery-chart-column b {
  min-width: 0;
  overflow: hidden;
  color: var(--ink);
  font-size: 8.5px;
  line-height: 1.12;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.delivery-signal-section {
  display: grid;
  gap: 7px;
}

.metric-section-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 10px;
  padding: 0 2px;
}

.metric-section-head > div {
  display: grid;
  gap: 2px;
}

.metric-section-head strong {
  color: var(--ink);
  font-size: 13px;
}

.delivery-signal-band {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 7px;
}

.delivery-signal-card {
  min-width: 0;
  min-height: 72px;
  display: grid;
  grid-template-columns: 8px minmax(0, 1fr);
  gap: 7px;
  align-content: start;
  padding: 9px;
  border: 1px solid var(--status-neutral-border);
  border-radius: 7px;
  background: var(--surface-raised);
  box-shadow: inset 3px 0 0 var(--status-neutral-fg);
}

.delivery-signal-card.danger {
  border-color: var(--status-danger-border);
  box-shadow: inset 3px 0 0 var(--status-danger-fg);
}

.delivery-signal-card.warn {
  border-color: var(--status-warn-border);
  box-shadow: inset 3px 0 0 var(--status-warn-fg);
}

.delivery-signal-card.ok {
  border-color: var(--status-ok-border);
  box-shadow: inset 3px 0 0 var(--status-ok-fg);
}

.delivery-signal-card.danger .delivery-signal-mark { background: var(--status-danger-fg); }
.delivery-signal-card.warn .delivery-signal-mark { background: var(--status-warn-fg); }
.delivery-signal-card.ok .delivery-signal-mark { background: var(--status-ok-fg); }

.delivery-signal-card > div {
  min-width: 0;
  display: grid;
  gap: 3px;
}

.delivery-signal-card b {
  color: var(--muted);
  font-size: 9px;
  letter-spacing: .03em;
  text-transform: uppercase;
}

.delivery-signal-card strong {
  overflow: hidden;
  color: var(--ink);
  font-size: 11.5px;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.delivery-signal-card p {
  display: -webkit-box;
  overflow: hidden;
  margin: 0;
  color: var(--muted);
  font-size: 10px;
  line-height: 1.28;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.metric-blocker-panel {
  padding: 0;
  gap: 0;
  overflow: hidden;
}

.metric-blocker-panel .metric-panel-head {
  padding: 8px 10px;
  border-bottom: 1px solid var(--line);
  background: var(--titlebar);
}

.metric-blocker-panel .blocker-list {
  gap: 0;
}

.metric-blocker-panel .blocker-row {
  display: grid;
  grid-template-columns: 7px minmax(0, 1fr) auto;
  gap: 8px;
  align-items: start;
  padding: 8px 10px;
  border: 0;
  border-bottom: 1px solid var(--line);
  border-radius: 0;
  background: var(--surface-raised);
}

.metric-blocker-panel .blocker-row:last-child {
  border-bottom: 0;
}

.metric-blocker-panel .blocker-row .blocker-severity {
  margin-top: 3px;
  background: var(--status-danger-fg);
}

[data-theme="nordic-slate"] .badge {
  min-height: 18px;
  gap: 5px;
  padding: 2px 6px;
  border-radius: 5px;
  font-size: 9.5px;
  line-height: 1;
}

[data-theme="nordic-slate"] .badge.ok::before,
[data-theme="nordic-slate"] .badge.warn::before,
[data-theme="nordic-slate"] .badge.danger::before,
[data-theme="nordic-slate"] .badge.neutral::before {
  content: "";
  width: 5px;
  height: 5px;
  flex: 0 0 5px;
  border-radius: 999px;
  background: var(--status-neutral-fg);
}

[data-theme="nordic-slate"] .badge.ok::before { background: var(--status-ok-fg); }
[data-theme="nordic-slate"] .badge.warn::before { background: var(--status-warn-fg); }
[data-theme="nordic-slate"] .badge.danger::before { background: var(--status-danger-fg); }

[data-theme="nordic-slate"] .agent-farm-runtime-stack {
  height: 18px;
  border-radius: 5px;
  background: var(--chart-track);
}

[data-theme="nordic-slate"] .agent-farm-runtime-stack i {
  box-shadow: inset -1px 0 0 var(--project-stack-divider);
}

.what-if-page {
  display: grid;
  gap: 9px;
}

.what-if-page > .metrics-two-column {
  align-items: start;
}

.what-if-page .metric-panel-head {
  margin: -9px -9px 0;
  padding: 8px 9px;
  border-bottom: 1px solid var(--line);
  border-radius: 8px 8px 0 0;
  background: var(--titlebar);
}

.what-if-form-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(140px, 1fr));
  gap: 8px;
  align-items: start;
}

.what-if-prompt-label {
  display: grid;
  gap: 6px;
}

.what-if-prompt {
  min-height: 82px;
  resize: vertical;
}

.what-if-actions,
.what-if-examples {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.what-if-examples button {
  border-radius: 999px;
  font-size: 11px;
  background: var(--chip-muted);
}

.what-if-intent {
  border-left: 3px solid var(--accent);
}

.what-if-intent ul {
  margin: 0;
  padding-left: 18px;
  color: var(--ink);
  font-size: 12px;
  line-height: 1.45;
}

.what-if-original {
  margin: 0;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.35;
}

.what-if-story-picker {
  grid-column: 1 / -1;
  display: grid;
  gap: 5px;
  max-height: 156px;
  overflow: auto;
  padding: 7px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-muted);
}

.what-if-warnings {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.what-if-warnings span {
  padding: 4px 7px;
  border: 1px solid var(--status-warn-border);
  border-radius: 999px;
  background: var(--orange-soft);
  color: var(--orange);
  font-size: 11px;
  font-weight: 750;
}

.what-if-narrative p {
  margin: 0;
  color: var(--ink);
  font-size: 12px;
  line-height: 1.45;
}

.what-if-draft {
  border-left: 3px solid var(--green);
}

.what-if-draft > p {
  margin: 0;
  color: var(--ink);
  font-size: 12px;
  line-height: 1.45;
}

.what-if-draft-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.what-if-draft-meta span {
  padding: 3px 7px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--chip-muted);
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
}

.what-if-draft-list {
  display: grid;
  gap: 6px;
}

.what-if-draft-change {
  display: grid;
  gap: 3px;
  padding: 7px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-raised);
}

.what-if-draft-change strong,
.what-if-draft-change span {
  font-size: 11px;
  line-height: 1.35;
}

.what-if-draft-change span {
  color: var(--muted);
}

.what-if-impact-list {
  display: grid;
  gap: 8px;
}

.what-if-impact {
  display: grid;
  gap: 7px;
  padding: 9px;
  border: 1px solid var(--line-strong);
  border-left: 3px solid var(--green);
  border-radius: 7px;
  background: var(--surface-soft);
}

.what-if-impact.danger { border-left-color: var(--danger); }
.what-if-impact.warn { border-left-color: var(--orange); }
.what-if-impact.ok { border-left-color: var(--green); }

.what-if-impact-head {
  display: grid;
  gap: 3px;
}

.what-if-impact-head span {
  width: fit-content;
  padding: 2px 6px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--chip-muted);
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
}

.what-if-impact-head strong {
  color: var(--ink);
  font-size: 12px;
  line-height: 1.35;
}

.what-if-impact dl {
  display: grid;
  gap: 6px;
  margin: 0;
}

.what-if-impact dl div {
  display: grid;
  gap: 2px;
}

.what-if-impact dt {
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
}

.what-if-impact dd {
  margin: 0;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.35;
}

.what-if-options {
  border-left: 3px solid var(--accent);
}

.what-if-option-list {
  display: grid;
  gap: 8px;
}

.what-if-option {
  display: grid;
  gap: 7px;
  padding: 9px;
  border: 1px solid var(--line);
  border-left: 3px solid var(--border-strong);
  border-radius: 7px;
  background: var(--surface-raised);
}

.what-if-option.recommended {
  border-left-color: var(--green);
  background: color-mix(in srgb, var(--green-soft) 54%, var(--surface-raised));
}

.what-if-option-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
}

.what-if-option-head div {
  display: grid;
  gap: 2px;
}

.what-if-option-head strong {
  color: var(--ink);
  font-size: 12px;
  line-height: 1.35;
}

.what-if-option-head span,
.what-if-option p,
.what-if-option-grid span,
.what-if-option-grid li {
  color: var(--muted);
  font-size: 11px;
  line-height: 1.35;
}

.what-if-option p {
  margin: 0;
}

.what-if-option-head em {
  padding: 2px 6px;
  border: 1px solid var(--status-ok-border);
  border-radius: 999px;
  color: var(--status-ok-fg);
  background: var(--green-soft);
  font-size: 10px;
  font-style: normal;
  font-weight: 800;
}

.what-if-option-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 8px;
}

.what-if-option-grid div {
  display: grid;
  align-content: start;
  gap: 4px;
  padding: 8px;
  border: 1px solid var(--line-strong);
  border-radius: 7px;
  background: var(--surface-soft);
}

.what-if-option-grid h4 {
  margin: -8px -8px 4px;
  padding: 6px 8px;
  border-bottom: 1px solid var(--line);
  border-radius: 7px 7px 0 0;
  background: var(--titlebar);
  color: var(--ink);
  font-size: 10px;
  text-transform: uppercase;
}

.what-if-option-grid ul {
  margin: 0;
  padding-left: 16px;
}

.what-if-sprint-list,
.what-if-recommendations {
  display: grid;
  gap: 7px;
}

.what-if-sprint-row {
  display: grid;
  gap: 4px;
  padding: 8px;
  border: 1px solid var(--line-strong);
  border-left-width: 3px;
  border-radius: 7px;
  background: var(--surface-soft);
}

.what-if-sprint-row.ok { border-left-color: var(--green); }
.what-if-sprint-row.warn { border-left-color: var(--orange); }
.what-if-sprint-row.danger { border-left-color: var(--danger); }

.what-if-sprint-row div {
  display: flex;
  justify-content: space-between;
  gap: 8px;
}

.what-if-sprint-row strong,
.what-if-sprint-row span {
  font-size: 12px;
}

.what-if-sprint-row span,
.what-if-sprint-row p,
.what-if-recommendations p {
  margin: 0;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.35;
}

.pco-page {
  display: grid;
  gap: 9px;
}

.requirements-document {
  display: grid;
  gap: 10px;
}

.requirements-workspace {
  grid-template-columns: minmax(230px, 280px) minmax(0, 1fr);
  align-items: start;
}

.requirements-doc-list {
  display: grid;
  gap: 8px;
  align-content: start;
  max-height: calc(100vh - 210px);
  overflow: auto;
}

.requirements-doc-row {
  width: 100%;
  display: grid;
  gap: 3px;
  padding: 8px 9px;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: var(--surface-raised);
  color: var(--ink);
  text-align: left;
}

.requirements-list-label {
  margin: 3px 0 0;
  color: var(--muted);
  font-size: 10px;
  font-weight: 850;
  letter-spacing: 0;
  text-transform: uppercase;
}

.requirements-doc-row.active {
  border-color: var(--accent);
  background: var(--surface-selected);
}

.requirements-doc-row strong {
  overflow: hidden;
  font-size: 12px;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.requirements-doc-row span {
  overflow: hidden;
  color: var(--muted);
  font-size: 10px;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.requirements-create {
  display: grid;
  gap: 8px;
  margin-top: 4px;
  padding-top: 8px;
  border-top: 1px solid var(--line-strong);
}

.requirements-create > p {
  margin: 0;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.38;
}

.requirements-document-detail {
  min-width: 0;
}

.requirements-workbench {
  display: grid;
  gap: 10px;
  min-width: 0;
}

.requirements-hero,
.requirements-card,
.requirements-story-detail-head {
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  background: var(--surface-raised);
}

.requirements-hero {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 10px 12px;
}

.requirements-hero h3 {
  margin: 0;
  font-size: 17px;
  line-height: 1.18;
}

.requirements-hero p {
  max-width: 780px;
  margin: 3px 0 0;
  color: var(--muted);
  font-size: 11.5px;
  line-height: 1.35;
}

.requirements-hero-stats {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 6px;
  min-width: 220px;
}

.requirements-hero-stats span {
  display: grid;
  min-width: 66px;
  padding: 5px 7px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-muted);
  color: var(--muted);
  font-size: 10px;
  text-align: center;
}

.requirements-hero-stats strong {
  color: var(--ink);
  font-size: 15px;
  line-height: 1.1;
}

.requirements-workbench-grid {
  display: grid;
  grid-template-columns: minmax(420px, 1.35fr) minmax(300px, .85fr);
  grid-template-areas:
    "intent documents"
    "stories review"
    "stories review";
  gap: 10px;
  align-items: start;
  min-width: 0;
}

.requirements-workbench-grid.requirements-review-grid {
  grid-template-areas:
    "intent documents"
    "review review";
}

.requirements-manager-review {
  display: grid;
  gap: 10px;
}

.requirements-submitted-baseline .submitted-prd-body {
  max-height: none;
}

.submitted-baseline-facts {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.submitted-baseline-facts span {
  padding: 6px 9px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-muted);
  color: var(--muted);
  font-size: 11px;
}

.submitted-baseline-facts strong {
  color: var(--ink);
}

.requirements-authoring-wait > p {
  max-width: 72ch;
  margin: 0;
  color: var(--text-secondary);
  line-height: 1.5;
}

.requirements-grid-intent,
.requirements-grid-sources,
.requirements-grid-stories,
.requirements-grid-documents,
.requirements-grid-review,
.requirements-left-column,
.requirements-main-column,
.requirements-right-column {
  display: grid;
  gap: 10px;
  min-width: 0;
}

.requirements-grid-intent { grid-area: intent; }
.requirements-grid-sources { grid-area: documents; }
.requirements-grid-stories {
  grid-area: stories;
  align-self: stretch;
}
.requirements-grid-documents { grid-area: documents; }
.requirements-grid-review { grid-area: review; }

.requirements-grid-stories > .requirements-card,
.requirements-grid-stories > .story-planning-panel,
.requirements-grid-stories > * {
  min-width: 0;
}

.requirements-card {
  display: grid;
  gap: 9px;
  padding: 10px;
}

.requirements-card .metric-panel-head {
  align-items: start;
  margin: -10px -10px 0;
  padding: 8px 10px;
  border-bottom: 1px solid var(--line);
  border-radius: 8px 8px 0 0;
  background: var(--titlebar);
}

.requirements-card .metric-panel-head h3 {
  font-size: 13px;
}

.requirements-card .metric-panel-head p,
.requirements-change-card > p {
  margin: 2px 0 0;
  color: var(--muted);
  font-size: 10.8px;
  line-height: 1.35;
}

.requirements-document-review-card {
  gap: 12px;
}

.requirements-document-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-muted);
}

.requirements-document-summary > div {
  display: grid;
  gap: 3px;
  min-width: 0;
  padding: 9px 10px;
}

.requirements-document-summary > div + div { border-left: 1px solid var(--line); }
.requirements-document-summary span { color: var(--muted); font-size: 9.8px; }
.requirements-document-summary strong { overflow: hidden; font-size: 11.5px; text-overflow: ellipsis; white-space: nowrap; }

.requirements-document-summary-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.requirements-document-summary-actions p {
  margin: 0;
  color: var(--muted);
  font-size: 10.5px;
  line-height: 1.4;
}

.document-comments {
  display: grid;
  gap: 10px;
  padding-top: 12px;
  border-top: 3px solid var(--accent);
}

.document-discussion {
  display: grid;
  gap: 9px;
  padding-top: 11px;
  border-top: 3px solid var(--accent);
}

.document-discussion-head {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 12px;
}

.document-discussion-head h4,
.document-discussion-head p { margin: 0; }
.document-discussion-head h4 { font-size: 13px; }
.document-discussion-head > div:first-child > p:last-child {
  max-width: 760px;
  margin-top: 3px;
  color: var(--muted);
  font-size: 10.8px;
  line-height: 1.4;
}

.document-discussion-activity {
  display: inline-flex;
  flex: 0 0 auto;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-muted);
}

.document-discussion-activity span {
  display: inline-flex;
  align-items: baseline;
  gap: 4px;
  padding: 6px 8px;
  color: var(--text-secondary);
  font-size: 9.8px;
}

.document-discussion-activity span + span { border-left: 1px solid var(--line); }
.document-discussion-activity strong { color: var(--text); font-size: 11px; }

.document-discussion-composer {
  display: grid;
  gap: 5px;
  padding: 9px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: var(--surface-muted);
}

.document-discussion-composer label { font-size: 10.5px; font-weight: 800; }
.document-discussion-composer textarea { min-height: 64px; resize: vertical; }
.document-discussion-composer > div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.document-discussion-composer > div span { color: var(--muted); font-size: 9.8px; }
.document-discussion-composer button { min-height: 30px; }

.document-discussion-threads { display: grid; gap: 7px; }
.document-discussion-thread {
  padding: 9px 10px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: var(--panel-bg-subtle);
}
.document-discussion-thread > header > div {
  display: flex;
  align-items: baseline;
  gap: 6px;
}
.document-discussion-thread > header strong { font-size: 11.5px; }
.document-discussion-thread > header span { color: var(--muted); font-size: 9.5px; }
.document-discussion-thread > p {
  margin: 6px 0 0;
  white-space: pre-wrap;
  color: var(--text-secondary);
  font-size: 11.8px;
  line-height: 1.45;
}
.document-discussion-thread-actions {
  display: flex;
  align-items: flex-start;
  gap: 7px;
  flex-wrap: wrap;
  margin-top: 7px;
}
.document-discussion-thread-actions .review-thread-action { min-width: 0; }
.document-discussion-thread-actions .review-thread-action > summary {
  min-height: 24px;
  padding: 4px 7px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--surface-raised);
  list-style: none;
}
.document-discussion-thread-actions .review-thread-action > summary::-webkit-details-marker { display: none; }
.comment-relevance-actions,
.comment-relevance-summary { display: inline-flex; align-items: center; gap: 5px; }
.comment-relevance-actions { margin: 0; }
.comment-relevance-actions button,
.comment-relevance-summary > span {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-height: 24px;
  padding: 3px 7px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--surface-raised);
  color: var(--text-secondary);
  font-size: 10px;
}
.comment-relevance-actions button strong,
.comment-relevance-summary strong { color: var(--text); font-size: 10px; }
.comment-relevance-actions button[aria-pressed="true"] {
  border-color: var(--accent);
  background: var(--accent-soft);
  color: var(--accent-ink);
}
.comment-relevance-actions button[aria-pressed="true"] strong { color: inherit; }
.document-discussion-thread .review-thread-replies { margin-left: 12px; }
.architecture-review-journal .document-discussion { padding-top: 0; border-top: 0; }
.story-context-projections { display: grid; gap: 7px; margin-top: 9px; padding-top: 9px; border-top: 1px solid var(--line); }

.document-comments-head {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 12px;
}

.document-comments-head h2,
.document-comments-head h4,
.document-comments-head p { margin: 0; }
.document-comments-head h4 { font-size: 13px; }
.document-comments-head > div > p:last-child {
  margin-top: 3px;
  color: var(--muted);
  font-size: 10.8px;
  line-height: 1.4;
}

.document-comments-closed {
  display: grid;
  gap: 2px;
  margin: 0;
  padding: 9px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-muted);
  font-size: 10.8px;
  line-height: 1.4;
}

.document-comments-closed span { color: var(--muted); }

.document-regeneration-control {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-muted);
}

.document-regeneration-control p {
  display: grid;
  gap: 2px;
  margin: 0;
}

.document-regeneration-control span {
  color: var(--muted);
  font-size: 10.5px;
  line-height: 1.4;
}

@media (max-width: 760px) {
  .document-discussion-head,
  .document-discussion-composer > div,
  .document-comments-head,
  .document-regeneration-control {
    align-items: stretch;
    flex-direction: column;
  }

  .document-discussion-activity { align-self: flex-start; }
  .document-discussion-composer button { width: 100%; min-height: 44px; }
  .document-discussion-thread-actions,
  .comment-relevance-actions,
  .comment-relevance-summary { width: 100%; }
  .comment-relevance-actions button,
  .comment-relevance-summary > span { flex: 1; justify-content: center; min-height: 44px; }

  .document-regeneration-control button { min-height: 44px; }
}

.requirements-intent-card {
  background: var(--surface-raised);
}

.requirements-intent-card textarea {
  min-height: 138px;
  resize: vertical;
  font-size: 12px;
  line-height: 1.38;
}

.requirements-intent-accepted {
  display: flex;
  gap: 10px;
  align-items: center;
  justify-content: space-between;
  padding: 9px;
  border: 1px solid color-mix(in srgb, var(--success) 38%, var(--line));
  border-radius: 8px;
  background: color-mix(in srgb, var(--success) 10%, var(--surface-raised));
}

.requirements-intent-accepted strong,
.requirements-intent-accepted p {
  margin: 0;
}

.requirements-intent-accepted p {
  margin-top: 3px;
  color: var(--text-secondary);
  font-size: 10.8px;
  line-height: 1.4;
}

.requirements-intent-accepted button {
  flex: 0 0 auto;
}

.intent-builder-sidecar {
  display: grid;
  gap: 9px;
  margin-top: 3px;
  padding: 10px;
  border: 1px solid color-mix(in srgb, var(--accent) 46%, var(--line));
  border-radius: 8px;
  background: color-mix(in srgb, var(--accent-soft) 38%, var(--surface-raised));
}

.intent-clarification-lightbox {
  width: min(1120px, calc(100vw - 44px));
  height: min(780px, calc(100vh - 44px));
  height: min(780px, calc(100dvh - 44px));
  grid-template-rows: auto auto minmax(0, 1fr) auto auto;
}

.intent-clarification-lightbox > .intent-builder-head {
  grid-row: 1;
}

.intent-clarification-lightbox > .intent-builder-working,
.intent-clarification-lightbox > .intent-builder-error {
  grid-row: 2;
}

.intent-clarification-lightbox > .intent-clarification-body {
  grid-row: 3;
}

.intent-clarification-lightbox > .intent-builder-footer {
  grid-row: 4;
}

.intent-clarification-lightbox > .intent-clarification-actions {
  grid-row: 5;
}

.intent-clarification-progress {
  min-height: 30px;
  display: inline-flex;
  align-items: center;
  padding: 0 9px;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--muted);
  background: var(--surface-raised);
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap;
}

.intent-clarification-body {
  min-height: 0;
  display: grid;
  align-content: start;
  gap: 10px;
  overflow-y: auto;
  padding: 1px 4px 1px 0;
  scrollbar-gutter: stable;
}

.intent-clarification-body.review {
  overflow: hidden;
}

.intent-clarification-lightbox .intent-builder-ready {
  min-height: 0;
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(250px, .55fr);
  gap: 10px;
  padding: 0;
  border: 0;
  background: transparent;
  overflow: hidden;
}

.intent-review-editor,
.intent-review-preview {
  min-width: 0;
  min-height: 0;
  display: grid;
  align-content: start;
  gap: 8px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-raised);
}

.intent-review-editor {
  grid-template-rows: auto auto 1fr;
}

.intent-markdown-editor {
  padding-top: 8px;
  border-top: 1px solid var(--line);
}

.intent-markdown-editor summary {
  color: var(--accent-ink);
  font-size: 11px;
  font-weight: 800;
  cursor: pointer;
}

.intent-markdown-editor label {
  display: grid;
  gap: 5px;
  margin-top: 8px;
}

.intent-markdown-editor textarea {
  min-height: 240px;
  max-height: 360px;
  resize: vertical;
  font-family: var(--font-mono);
  font-size: 12px;
  line-height: 1.5;
}

.intent-markdown-editor button {
  margin-top: 7px;
}

.intent-revision-composer {
  display: grid;
  align-content: start;
  gap: 7px;
}

.intent-revision-composer textarea {
  min-height: 108px;
  max-height: 200px;
  resize: vertical;
}

.intent-review-preview {
  grid-template-rows: auto minmax(0, 1fr);
  overflow: hidden;
}

.intent-review-preview.artifact-preview-pane {
  overflow: hidden;
}

.intent-review-preview-head span {
  color: var(--muted);
  font-size: 10px;
  font-weight: 850;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.intent-review-preview-head p {
  margin: 2px 0 0;
  color: var(--muted);
  font-size: 10.8px;
}

.intent-review-preview .intent-builder-final-markdown {
  min-height: 0;
  max-height: none;
  overflow-y: auto;
  padding: 4px 6px 8px 2px;
  scrollbar-gutter: stable;
}

.intent-builder-working {
  width: 100%;
  max-height: none;
  margin: 0;
}

.intent-clarification-actions .helper {
  margin-right: auto;
}

.intent-builder-head,
.intent-builder-head-actions,
.intent-builder-footer,
.intent-builder-answer-actions {
  display: flex;
  align-items: center;
  gap: 7px;
}

.intent-builder-head {
  justify-content: space-between;
  align-items: flex-start;
}

.intent-builder-head h4,
.intent-builder-question h5,
.intent-builder-ready h5 {
  margin: 0;
  color: var(--ink);
}

.intent-builder-head h4 {
  font-size: 14px;
}

.intent-builder-head p:not(.eyebrow),
.intent-builder-question > p,
.intent-builder-ready p,
.intent-builder-error p {
  max-width: 72ch;
  margin: 3px 0 0;
  color: var(--muted);
  font-size: 10.8px;
  line-height: 1.4;
}

.intent-builder-head-actions {
  flex: 0 0 auto;
  justify-content: flex-end;
  flex-wrap: wrap;
}

.intent-builder-evaluation {
  display: grid;
  grid-template-columns: 138px minmax(0, 1fr);
  gap: 8px;
}

.intent-builder-clarity,
.intent-builder-field,
.intent-builder-question,
.intent-builder-ready,
.intent-builder-error {
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-raised);
}

.intent-builder-clarity {
  display: grid;
  align-content: start;
  gap: 4px;
  padding: 9px;
}

.intent-builder-clarity span,
.intent-builder-field > span,
.intent-builder-question-label {
  color: var(--muted);
  font-size: 9.5px;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.intent-builder-clarity strong {
  color: var(--accent-ink);
  font-size: 25px;
  line-height: 1;
}

.intent-builder-clarity small,
.intent-builder-field small {
  color: var(--muted);
  font-size: 9.5px;
  line-height: 1.3;
}

.intent-builder-summary {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 5px;
}

.intent-builder-field {
  min-width: 0;
  padding: 7px;
}

.intent-builder-field.covered {
  border-color: color-mix(in srgb, var(--green) 42%, var(--line));
}

.intent-builder-field.missing {
  border-style: dashed;
  background: var(--surface-muted);
}

.intent-builder-field.unknown {
  border-color: color-mix(in srgb, var(--orange) 48%, var(--line));
  background: color-mix(in srgb, var(--orange-soft) 55%, var(--surface-raised));
}

.intent-builder-field p {
  margin: 3px 0;
  overflow-wrap: anywhere;
  color: var(--ink);
  font-size: 10.8px;
  line-height: 1.4;
}

.intent-builder-transcript {
  display: grid;
  gap: 5px;
  max-height: 180px;
  padding-right: 4px;
  overflow-y: auto;
}

.intent-builder-message {
  max-width: 88%;
  padding: 7px 8px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-raised);
}

.intent-builder-message.answer {
  justify-self: end;
  background: var(--accent-soft);
}

.intent-builder-message strong {
  color: var(--muted);
  font-size: 9.5px;
}

.intent-builder-message p {
  margin: 2px 0 0;
  color: var(--ink);
  font-size: 10.8px;
  line-height: 1.4;
}

.intent-builder-question,
.intent-builder-ready,
.intent-builder-error {
  display: grid;
  gap: 7px;
  padding: 9px;
}

.intent-builder-question h5,
.intent-builder-ready h5 {
  font-size: 12.5px;
  line-height: 1.35;
}

.intent-builder-question textarea {
  min-height: 70px;
}

.intent-builder-question-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 8px;
}

.intent-builder-question-item {
  display: grid;
  align-content: start;
  gap: 6px;
  min-width: 0;
  padding: 9px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-muted);
}

.intent-builder-question-item > span {
  color: var(--accent-ink);
  font-size: 9.5px;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.intent-builder-question-item > p {
  margin: 0;
  color: var(--muted);
  font-size: 10.5px;
  line-height: 1.4;
}

.intent-builder-question-item label {
  display: grid;
  gap: 3px;
}

.intent-builder-question-item select {
  width: 100%;
}

.intent-builder-question-item textarea {
  min-height: 88px;
}

.intent-builder-answer-actions,
.intent-builder-footer {
  flex-wrap: wrap;
}

.intent-builder-footer {
  padding-top: 7px;
  border-top: 1px solid var(--line);
  color: var(--muted);
  font-size: 10.5px;
}

.intent-builder-footer button.selected {
  border-color: var(--accent);
  background: var(--accent-soft);
  color: var(--accent-ink);
}

.intent-builder-footer details {
  flex: 0 1 auto;
  margin-left: auto;
}

.intent-builder-footer details[open] {
  flex: 1 1 100%;
  margin-left: 0;
}

.intent-builder-footer details p {
  margin: 4px 0 0;
  color: var(--muted);
  line-height: 1.4;
}

@media (max-width: 720px) {
  .intent-builder-head,
  .intent-builder-evaluation {
    grid-template-columns: 1fr;
  }

  .intent-builder-head {
    display: grid;
  }

  .intent-builder-head-actions {
    justify-content: flex-start;
  }

  .intent-builder-summary {
    grid-template-columns: 1fr;
  }

  .intent-clarification-backdrop {
    padding: 8px;
  }

  .intent-clarification-lightbox {
    width: calc(100vw - 16px);
    height: calc(100dvh - 16px);
    padding: 11px;
  }

  .intent-clarification-body.review {
    overflow-y: auto;
  }

  .intent-clarification-lightbox .intent-builder-ready {
    grid-template-columns: 1fr;
    overflow: visible;
  }

  .intent-markdown-editor textarea {
    min-height: 260px;
  }

  .intent-review-preview .intent-builder-final-markdown {
    max-height: 360px;
  }

  .intent-revision-composer {
    grid-template-columns: 1fr;
  }
}

.requirements-info-card {
  align-content: start;
  min-height: 0;
  background: var(--surface-raised);
}

.requirements-info-summary {
  display: grid;
  gap: 7px;
  padding: 9px 9px 10px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-soft);
  overflow: visible;
}

.requirements-info-summary p {
  margin: 0;
  color: var(--ink);
  font-size: 11.3px;
  line-height: 1.55;
  overflow: visible;
}

.requirements-info-facts {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 5px;
}

.requirements-info-facts span {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  min-height: 22px;
  padding: 2px 7px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--surface-raised);
  color: var(--muted);
  font-size: 10px;
}

.requirements-info-facts strong {
  color: var(--ink);
  font-size: 11px;
}

.requirements-info-list {
  display: grid;
  gap: 5px;
  min-height: 0;
  overflow: visible;
}

.requirements-info-list-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-width: 0;
}

.requirements-info-list h4 {
  flex: 0 0 auto;
  margin: 0;
  color: var(--muted);
  font-size: 10.8px;
  text-transform: uppercase;
}

.requirements-info-inputs {
  display: grid;
  gap: 5px;
  max-height: 148px;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  padding-right: 4px;
  scrollbar-gutter: stable;
  scrollbar-width: thin;
}

.requirements-info-inputs::-webkit-scrollbar {
  width: 7px;
}

.requirements-info-inputs::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: var(--line-strong);
}

.requirements-info-list button {
  display: grid;
  grid-template-columns: 22px minmax(82px, .38fr) minmax(120px, 1fr);
  align-items: center;
  gap: 7px;
  min-width: 0;
  min-height: 28px;
  padding: 4px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--surface-raised);
  color: inherit;
  text-align: left;
}

.requirements-info-list button:hover {
  border-color: var(--line-strong);
  background: var(--surface-selected);
}

.requirements-info-list strong,
.requirements-info-list p {
  overflow: hidden;
  margin: 0;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.requirements-info-list strong {
  font-size: 11px;
}

.requirements-info-list p {
  color: var(--muted);
  font-size: 10.5px;
}

.requirements-input-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 7px;
}

.requirements-input-row button {
  justify-self: start;
}

.requirements-actions,
.requirements-approval-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}

.requirements-source-list,
.requirements-pco-list {
  display: grid;
  gap: 3px;
  max-height: 142px;
  overflow-x: hidden;
  overflow-y: auto;
  padding-right: 4px;
  scrollbar-gutter: stable;
  scrollbar-width: thin;
}

.requirements-source-list.generated {
  max-height: 118px;
}

.requirements-source-list::-webkit-scrollbar,
.requirements-pco-list::-webkit-scrollbar {
  width: 7px;
}

.requirements-source-list::-webkit-scrollbar-thumb,
.requirements-pco-list::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: var(--line-strong);
}

.requirements-source-list::-webkit-scrollbar-track,
.requirements-pco-list::-webkit-scrollbar-track {
  background: transparent;
}

.requirements-source-row {
  position: relative;
  display: block;
  width: 100%;
  min-width: 0;
  min-height: 30px;
  padding: 3px 4px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--surface-raised);
}

.requirements-source-row.context,
.requirements-source-row.document,
.requirements-source-row.approved {
  border-color: color-mix(in srgb, var(--green) 50%, var(--line));
  background: color-mix(in srgb, var(--green-soft) 72%, var(--surface-raised));
}
.requirements-source-row.note { background: var(--surface-muted); }
.requirements-source-row.draft {
  border-color: color-mix(in srgb, var(--orange) 54%, var(--line));
  background: color-mix(in srgb, var(--orange-soft) 72%, var(--surface-raised));
}
.requirements-source-row.pco {
  border-color: color-mix(in srgb, var(--purple) 54%, var(--line));
  background: color-mix(in srgb, var(--purple-soft) 72%, var(--surface-raised));
}

.requirements-row-action {
  margin: 4px 0 0 29px;
  min-height: 26px;
  padding: 4px 10px;
  font-size: 11px;
}

.requirements-doc-open {
  display: grid;
  grid-template-columns: 22px minmax(90px, .42fr) minmax(120px, 1fr);
  align-items: center;
  gap: 7px;
  min-width: 0;
  min-height: 24px;
  padding: 0 3px;
  border: 0;
  background: transparent;
  color: inherit;
  text-align: left;
}

.requirements-doc-open:hover {
  color: var(--accent-ink);
}

.requirements-doc-open.selected,
.requirement-comment-row.selected {
  outline: 2px solid color-mix(in srgb, var(--accent) 28%, transparent);
  background: var(--surface-selected);
}

.intent-review-toolbar {
  display: flex;
  min-height: 28px;
  align-items: center;
  gap: 6px;
  padding: 4px 6px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-muted);
  color: var(--muted);
  font-size: 10.5px;
}

.requirements-preview-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 6px;
}

.requirements-preview-actions button {
  min-height: 28px;
  padding: 5px 9px;
  font-size: 11px;
}

.requirements-preview-actions .danger-light {
  border-color: var(--danger);
  color: var(--danger);
  background: var(--danger-soft);
}

.intent-review-toolbar span,
.intent-review-toolbar strong {
  color: var(--ink);
  font-size: 10.5px;
}

.intent-review-toolbar small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.intent-review-toolbar button {
  min-height: 22px;
  padding: 3px 7px;
  font-size: 10.3px;
}

.requirement-comment-row {
  position: relative;
  padding-left: 30px;
  cursor: pointer;
}

.review-thread > .requirement-comment-row {
  padding: 7px 0 0;
  cursor: default;
}

.requirements-source-icon {
  position: relative;
  display: grid;
  width: 20px;
  height: 20px;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--surface-raised);
  color: var(--accent-ink);
}

.requirements-source-icon svg {
  width: 13px;
  height: 13px;
}

.requirements-source-icon.intent-accepted::after,
.comment-intent-marker.intent-accepted::after {
  content: "✓";
  position: absolute;
  right: -5px;
  bottom: -5px;
  display: grid;
  width: 13px;
  height: 13px;
  place-items: center;
  border: 1px solid var(--status-ok-border);
  border-radius: 999px;
  background: var(--status-ok-bg);
  color: var(--status-ok-fg);
  font-size: 9px;
  font-weight: 800;
  line-height: 1;
}

.requirements-source-icon.intent-excluded::after,
.comment-intent-marker.intent-excluded::after {
  content: "×";
  position: absolute;
  right: -5px;
  bottom: -5px;
  display: grid;
  width: 13px;
  height: 13px;
  place-items: center;
  border: 1px solid var(--status-danger-border);
  border-radius: 999px;
  background: var(--status-danger-bg);
  color: var(--status-danger-fg);
  font-size: 9px;
  font-weight: 800;
  line-height: 1;
}

.comment-intent-marker {
  position: absolute;
  top: 10px;
  left: 8px;
  width: 16px;
  height: 16px;
  border: 1px solid var(--line);
  border-radius: 5px;
  background: var(--surface-raised);
}

.requirements-source-row strong,
.requirements-pco-row strong {
  overflow: hidden;
  font-size: 11.5px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.requirements-source-row small,
.requirements-pco-row span {
  color: var(--muted);
  font-size: 10px;
}

.requirements-source-row p {
  display: block;
  margin: 0;
  overflow: hidden;
  color: var(--muted);
  font-size: 10.5px;
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.story-evidence-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-areas:
    "meta action"
    "preview action";
  align-items: center;
  column-gap: 7px;
  row-gap: 2px;
  overflow: hidden;
}

.story-evidence-row > div {
  grid-area: meta;
  display: grid;
  grid-template-columns: 20px minmax(0, 1fr);
  grid-template-rows: auto auto;
  align-items: center;
  column-gap: 6px;
  min-width: 0;
}

.story-evidence-row .requirements-source-icon {
  grid-row: 1 / span 2;
  flex: 0 0 auto;
}

.story-evidence-row strong,
.story-evidence-row small {
  display: block;
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.story-evidence-row p {
  grid-area: preview;
  min-width: 0;
  max-width: 100%;
}

.story-evidence-row button {
  grid-area: action;
  justify-self: end;
  max-width: 72px;
}

.requirements-workflow-active,
.requirements-impact-summary,
.requirements-mini-list {
  display: grid;
  gap: 4px;
  padding: 7px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-muted);
}

.requirements-workflow-active p,
.requirements-impact-summary p,
.requirements-mini-list span {
  margin: 0;
  color: var(--muted);
  font-size: 10.8px;
  line-height: 1.35;
}

.requirements-mini-list {
  max-height: 120px;
  overflow: auto;
}

.requirements-review-card textarea {
  min-height: 76px;
  font-size: 12px;
}

.requirements-pco-row {
  display: grid;
  gap: 3px;
  width: 100%;
  min-height: 0;
  padding: 8px;
  border-color: var(--line);
  background: var(--surface-muted);
  text-align: left;
}

.requirements-pco-row.active {
  border-color: var(--accent);
  background: var(--surface-selected);
}

.requirements-pco-create {
  padding-top: 8px;
  border-top: 1px solid var(--line);
}

.requirements-pco-create summary {
  cursor: pointer;
  color: var(--accent-ink);
  font-size: 12px;
  font-weight: 750;
}

.requirements-pco-detail {
  max-height: 420px;
  overflow: auto;
  padding-top: 8px;
  border-top: 1px solid var(--line);
}

.requirements-pco-detail .pco-detail {
  border: 0;
  box-shadow: none;
  padding: 0;
}

.requirements-story-detail-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px 10px;
}

.pco-create {
  border-left: 3px solid var(--accent);
}

.pco-create > p,
.pco-detail > p {
  margin: 0;
  color: var(--text-primary);
  font-size: 12px;
  line-height: 1.4;
}

.pco-form-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 8px;
  align-items: start;
}

.pco-form-grid .wide {
  grid-column: span 2;
}

.pco-form-grid .pco-span-2 { grid-column: span 2; }
.pco-form-grid .pco-span-3 { grid-column: span 3; }
.pco-form-grid .pco-span-6 { grid-column: 1 / -1; }

.pco-form-grid label {
  display: grid;
  gap: 4px;
  font-size: 10px;
}

.pco-form-grid input,
.pco-form-grid select,
.pco-form-grid textarea {
  min-height: 30px;
  padding: 5px 7px;
  font-size: 12px;
}

.pco-form-grid .pco-points-field {
  width: auto;
  max-width: none;
  justify-self: stretch;
}

.pco-points-field input {
  text-align: center;
  font-weight: 800;
}

.pco-points-field small {
  color: var(--muted);
  font-size: 10px;
  font-weight: 750;
}

.pco-form-grid textarea {
  min-height: 76px;
  resize: vertical;
}

.confluence-import-panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(220px, 0.8fr) auto;
  gap: 8px;
  align-items: end;
  padding: 8px;
  border: 1px solid var(--line);
  border-left: 3px solid var(--accent);
  border-radius: 8px;
  background: color-mix(in srgb, var(--accent-soft) 42%, transparent);
}

.confluence-import-panel.compact {
  margin-bottom: 8px;
}

.confluence-import-panel strong {
  color: var(--text-primary);
  font-size: 12px;
}

.confluence-import-panel p {
  margin: 2px 0 0;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.35;
}

.pco-label-picker {
  display: grid;
  gap: 5px;
  align-content: start;
}

.pco-label-picker > span {
  color: var(--text-secondary);
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
}

.pco-label-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  padding: 7px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--soft);
}

.pco-layout {
  display: grid;
  grid-template-columns: minmax(210px, 0.35fr) minmax(0, 1fr);
  gap: 9px;
  align-items: start;
}

.pco-list {
  align-content: start;
  max-height: 520px;
  overflow: auto;
}

.pco-list-row {
  display: grid;
  gap: 3px;
  width: 100%;
  padding: 8px;
  text-align: left;
  border: 1px solid var(--line);
  border-left: 3px solid var(--border-strong);
  border-radius: 7px;
  background: var(--panel-bg);
}

.pco-list-row.active {
  border-left-color: var(--green);
  background: color-mix(in srgb, var(--status-ok-bg) 35%, transparent);
}

.pco-list-row strong {
  overflow: hidden;
  color: var(--text-primary);
  font-size: 12px;
  line-height: 1.3;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pco-list-row span {
  color: var(--muted);
  font-size: 11px;
}

.pco-detail {
  border-left: 3px solid var(--green);
}

.pco-flow {
  display: flex;
  align-items: center;
  gap: 5px;
  overflow-x: auto;
  padding: 6px;
  border: 1px solid var(--line-strong);
  border-radius: var(--radius-sm);
  background: color-mix(in srgb, var(--accent-soft) 36%, transparent);
}

.pco-flow-step {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 5px;
  min-height: 26px;
  padding: 4px 7px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--panel-bg);
  color: var(--muted);
  font-size: 10px;
  font-weight: 850;
}

.pco-flow-step span {
  display: grid;
  place-items: center;
  width: 16px;
  height: 16px;
  border-radius: 999px;
  background: var(--soft);
  color: var(--muted);
  font-size: 9px;
}

.pco-flow-step.done {
  border-color: var(--status-ok-border);
  background: var(--green-soft);
  color: var(--status-ok-fg);
}

.pco-flow-step.active {
  border-color: var(--accent);
  background: var(--accent-soft);
  color: var(--link-fg);
}

.pco-flow-arrow {
  flex: 0 0 auto;
  color: var(--muted);
  font-size: 11px;
}

.pco-summary-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(120px, 1fr));
  gap: 7px;
}

.pco-summary-grid span {
  display: grid;
  gap: 2px;
  padding: 7px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--soft);
  color: var(--muted);
  font-size: 11px;
}

.pco-summary-grid strong {
  color: var(--text-primary);
  font-size: 13px;
}

.pco-section {
  display: grid;
  gap: 7px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel-bg);
}

.pco-story-row {
  display: grid;
  gap: 3px;
  padding: 7px;
  border: 1px solid var(--line);
  border-left: 3px solid var(--border-strong);
  border-radius: 7px;
  background: var(--soft);
}

.pco-story-row strong {
  color: var(--text-primary);
  font-size: 12px;
  line-height: 1.3;
}

.pco-story-row span,
.pco-story-row p {
  margin: 0;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.35;
}

.pco-option-list {
  display: grid;
  gap: 7px;
}

.pco-option {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 7px;
  align-items: start;
  padding: 8px;
  border: 1px solid var(--line);
  border-left: 3px solid var(--border-strong);
  border-radius: 7px;
  background: var(--panel-bg);
}

.pco-option.recommended {
  border-left-color: var(--green);
  background: color-mix(in srgb, var(--status-ok-bg) 35%, transparent);
}

.pco-option span {
  display: grid;
  gap: 3px;
}

.pco-option strong {
  color: var(--text-primary);
  font-size: 12px;
  line-height: 1.3;
}

.pco-option small {
  color: var(--muted);
  font-size: 11px;
  line-height: 1.35;
}

.pco-accept-date {
  display: grid;
  gap: 8px;
}

.pco-accept-date label {
  max-width: 260px;
}

.metrics-two-column {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 8px;
}

.metrics-two-column.project-budget-single {
  grid-template-columns: minmax(0, 1fr);
}

.project-budget-summary-panel .metrics-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.budgeting-request-list {
  display: grid;
  gap: 8px;
}

.budget-authority-brief {
  display: grid;
  grid-template-columns: minmax(280px, 1.2fr) minmax(420px, 1fr);
  gap: 12px;
  padding: 12px;
  border: 1px solid var(--border-strong);
  border-radius: var(--radius);
  background: var(--panel-bg);
}

.budget-authority-narrative {
  display: grid;
  align-content: center;
  gap: 6px;
}

.budget-authority-narrative h3,
.budget-authority-narrative p {
  margin: 0;
}

.budget-authority-narrative h3 {
  color: var(--text-primary);
  font-size: 16px;
}

.budget-authority-narrative > p {
  color: var(--text-secondary);
  font-size: 11px;
  line-height: 1.45;
}

.budget-authority-kpis {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  overflow: hidden;
  border: 1px solid var(--border-soft);
  border-radius: var(--radius-sm);
  background: var(--panel-bg-subtle);
}

.budget-authority-kpis > div {
  display: grid;
  align-content: center;
  gap: 4px;
  min-width: 0;
  padding: 9px;
  border-right: 1px solid var(--border-soft);
}

.budget-authority-kpis > div:last-child {
  border-right: 0;
}

.budget-authority-kpis strong {
  color: var(--text-primary);
  font-size: 17px;
  line-height: 1.05;
}

.budget-authority-kpis .danger strong { color: var(--danger); }
.budget-authority-kpis .warn strong { color: var(--orange); }
.budget-authority-kpis .ok strong { color: var(--green); }

.budget-authority-kpis span {
  color: var(--text-secondary);
  font-size: 9px;
  line-height: 1.3;
}

.budgeting-decision-panel,
.budget-portfolio-matrix-panel {
  padding: 0;
  overflow: hidden;
}

.budgeting-decision-panel > .metric-panel-head,
.budget-portfolio-matrix-panel > .metric-panel-head {
  margin: 0;
}

.budgeting-clear-state {
  display: grid;
  gap: 4px;
  padding: 14px;
  border-top: 1px solid var(--border-soft);
  background: var(--green-soft);
}

.budgeting-clear-state strong {
  color: var(--status-ok-fg);
  font-size: 12px;
}

.budgeting-clear-state p {
  margin: 0;
  color: var(--text-secondary);
  font-size: 10px;
  line-height: 1.4;
}

.budget-portfolio-matrix {
  overflow-x: auto;
}

.budget-portfolio-row {
  display: grid;
  grid-template-columns: minmax(145px, 1fr) minmax(86px, .55fr) minmax(145px, 1fr) minmax(120px, .8fr) minmax(120px, .8fr) minmax(165px, 1.15fr);
  min-width: 820px;
  border-top: 1px solid var(--border-soft);
  background: var(--row-bg);
}

.budget-portfolio-row > div,
.budget-portfolio-row > span {
  display: grid;
  align-content: center;
  gap: 3px;
  min-width: 0;
  padding: 9px;
  border-right: 1px solid var(--border-soft);
}

.budget-portfolio-row > :last-child {
  border-right: 0;
}

.budget-portfolio-head {
  border-top: 0;
  background: var(--panel-header-bg);
}

.budget-portfolio-head > span {
  color: var(--text-secondary);
  font-size: 9px;
  font-weight: 850;
  letter-spacing: .035em;
  text-transform: uppercase;
}

.budget-portfolio-row strong,
.budget-portfolio-row span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

.budget-portfolio-row strong {
  color: var(--text-primary);
  font-size: 11px;
}

.budget-portfolio-row div > span {
  color: var(--text-secondary);
  font-size: 9.5px;
}

.budget-portfolio-row .badge {
  justify-self: start;
  width: fit-content;
  white-space: normal;
}

.budgeting-request-card {
  display: grid;
  gap: 8px;
  padding: 9px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
}

.budgeting-approval-controls {
  grid-template-columns: minmax(150px, 220px) auto auto;
}

@media (max-width: 1100px) {
  .budget-authority-brief {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 760px) {
  .budget-authority-kpis {
    grid-template-columns: 1fr 1fr;
  }

  .budget-authority-kpis > div:nth-child(2) {
    border-right: 0;
  }

  .budget-authority-kpis > div:nth-child(-n+2) {
    border-bottom: 1px solid var(--border-soft);
  }
}

/* Shared categorical chart palette; themes own the series tokens. */
.budget-economics-panel,
.executive-token-panel {
  --budget-chart-1: var(--chart-series-1);
  --budget-chart-2: var(--chart-series-2);
  --budget-chart-3: var(--chart-series-3);
  --budget-chart-4: var(--chart-series-4);
  --budget-chart-5: var(--chart-series-5);
  --budget-chart-6: var(--chart-series-6);
  --budget-chart-7: var(--chart-series-7);
  --budget-chart-rest: var(--chart-series-rest);
}

.budget-economics-panel {
  gap: 10px;
}

.budget-economics-kpis,
.budget-economics-grid {
  display: grid;
  gap: 8px;
}

.budget-economics-kpis {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.budget-economics-grid {
  grid-template-columns: minmax(0, 1.35fr) minmax(260px, .75fr);
}

.budget-economics-chart-card {
  min-width: 0;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-raised);
}

.budget-spend-chart {
  display: grid;
  gap: 8px;
}

.budget-spend-plot {
  position: relative;
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  align-items: end;
  gap: 8px;
  min-height: 198px;
  padding: 18px 6px 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
}

.budget-spend-plot.executive {
  grid-template-columns: repeat(6, minmax(54px, 1fr));
  min-height: 220px;
  padding: 24px 10px 0 58px;
}

.budget-executive-spend-chart {
  display: grid;
  gap: 8px;
}

.budget-spend-chart-frame {
  position: relative;
  padding-left: 22px;
}

.budget-spend-y-axis-title {
  position: absolute;
  top: 50%;
  left: -48px;
  width: 118px;
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
  text-align: center;
  transform: rotate(-90deg);
}

.budget-spend-x-axis-title {
  display: block;
  margin-top: 5px;
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
  text-align: center;
}

.budget-spend-y-ticks {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.budget-spend-y-ticks span {
  position: absolute;
  inset-inline: 0;
  z-index: 0;
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr);
  align-items: center;
  transform: translateY(-50%);
}

.budget-spend-y-ticks b {
  padding-right: 6px;
  color: var(--muted);
  font-size: 9px;
  font-weight: 700;
  text-align: right;
}

.budget-spend-y-ticks i {
  border-top: 1px solid var(--line);
}

.budget-spend-plot.executive .agent-farm-usage-budget-line,
.budget-spend-plot.executive .agent-farm-usage-forecast-line {
  inset-inline: 58px 10px;
}

.budget-spend-plot.executive article {
  grid-template-rows: minmax(0, 1fr) 18px;
  align-items: stretch;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.budget-spend-bar-cell {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  height: 100%;
  min-height: 0;
}

.budget-spend-bar-cell > b {
  margin-bottom: 3px;
  color: var(--text-secondary);
  font-size: 9px;
  font-weight: 800;
  text-align: center;
}

.executive-runway-note {
  margin: -2px 0 0;
  color: var(--muted);
  font-size: 11px;
}

.budget-spend-plot.log-scale {
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--accent) 5%, transparent), transparent 44%),
    var(--surface);
}

.budget-spend-plot .agent-farm-usage-budget-line.log-scale {
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--danger) 18%, transparent);
}

.budget-spend-plot::before {
  content: "";
  position: absolute;
  inset: 18px 6px 24px;
  border-block: 1px solid var(--line);
  pointer-events: none;
}

.budget-spend-plot article {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  align-items: end;
  gap: 5px;
  min-width: 0;
  height: 100%;
}

.budget-spend-column {
  min-height: 7px;
  border: 1px solid var(--line);
  border-radius: 6px 6px 3px 3px;
  background: var(--budget-chart-2, var(--accent));
}

.budget-spend-column.executive-stack {
  display: flex;
  flex-direction: column-reverse;
  overflow: hidden;
  background: var(--surface-muted);
}

.budget-spend-column.executive-stack i {
  display: block;
  min-height: 3px;
  box-shadow: inset 0 -1px 0 var(--project-stack-divider);
}

.budget-spend-column.executive-stack i.color-1,
.budget-runtime-legend .executive-token-dot.color-1,
.executive-token-table .executive-token-dot.color-1 { background: var(--budget-chart-1, var(--project-stack-1)); }
.budget-spend-column.executive-stack i.color-2,
.budget-runtime-legend .executive-token-dot.color-2,
.executive-token-table .executive-token-dot.color-2 { background: var(--budget-chart-2, var(--project-stack-2)); }
.budget-spend-column.executive-stack i.color-3,
.budget-runtime-legend .executive-token-dot.color-3,
.executive-token-table .executive-token-dot.color-3 { background: var(--budget-chart-3, var(--project-stack-3)); }
.budget-spend-column.executive-stack i.color-4,
.budget-runtime-legend .executive-token-dot.color-4,
.executive-token-table .executive-token-dot.color-4 { background: var(--budget-chart-4, var(--project-stack-4)); }
.budget-spend-column.executive-stack i.color-5,
.budget-runtime-legend .executive-token-dot.color-5,
.executive-token-table .executive-token-dot.color-5 { background: var(--budget-chart-5, var(--project-stack-5)); }
.budget-spend-column.executive-stack i.color-6,
.budget-runtime-legend .executive-token-dot.color-6,
.executive-token-table .executive-token-dot.color-6 { background: var(--budget-chart-6, var(--project-stack-1)); }
.budget-spend-column.executive-stack i.color-7,
.budget-runtime-legend .executive-token-dot.color-7,
.executive-token-table .executive-token-dot.color-7 { background: var(--budget-chart-7, var(--project-stack-2)); }

.budget-spend-plot article.projected .budget-spend-column {
  background: var(--budget-chart-rest, var(--accent-soft));
  border-style: dashed;
}

.budget-spend-plot small {
  color: var(--muted);
  font-size: 10px;
  text-align: center;
}

.budget-runtime-mix {
  display: grid;
  grid-template-columns: 136px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
}

.budget-runtime-donut {
  --mix-share: 0;
  display: grid;
  place-items: center;
  align-content: center;
  width: 128px;
  height: 128px;
  border: 1px solid var(--line);
  border-radius: 50%;
  background: var(--mix-gradient, conic-gradient(var(--budget-chart-1, var(--accent)) 0% 100%));
  box-shadow: inset 0 0 0 22px var(--surface-raised);
}

.budget-runtime-donut strong {
  color: var(--ink);
  font-size: 22px;
  line-height: 1;
}

.budget-runtime-donut span {
  max-width: 86px;
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
  text-align: center;
}

.budget-runtime-legend {
  display: grid;
  gap: 7px;
}

.budget-runtime-legend article {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 2px 8px;
  align-items: center;
  min-width: 0;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface);
}

.budget-runtime-legend span {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  overflow: hidden;
  color: var(--ink);
  font-size: 11px;
  font-weight: 850;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.budget-runtime-legend b {
  color: var(--ink);
  font-size: 12px;
}

.budget-runtime-legend small {
  grid-column: 1 / -1;
  color: var(--muted);
  font-size: 10px;
}

.budget-project-economics-table .table-row {
  grid-template-columns: minmax(150px, 1.1fr) minmax(120px, .8fr) minmax(150px, .9fr) minmax(140px, .9fr);
}

.budget-project-economics-table .table-row > span {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.budget-project-economics-table .table-row strong {
  min-width: 0;
  overflow: hidden;
  color: var(--ink);
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.budget-project-economics-table .table-row small {
  overflow: hidden;
  color: var(--muted);
  font-size: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.budget-project-economics-table .table-row.head span {
  color: inherit;
  font-size: inherit;
}

.executive-insufficient-data {
  display: grid;
  gap: 4px;
  padding: 14px;
  border: 1px dashed var(--line);
  border-radius: 8px;
  background: var(--surface-raised);
  color: var(--muted);
}

.executive-insufficient-data strong {
  color: var(--ink);
  font-size: 14px;
}

.executive-insufficient-data p {
  max-width: 680px;
  margin: 0;
}

.budget-rate-table-wrap {
  display: grid;
  gap: 8px;
}

.budget-rate-table .table-row {
  grid-template-columns: minmax(110px, .8fr) minmax(160px, 1fr) minmax(96px, .55fr) minmax(96px, .55fr) 48px;
}

.budget-rate-table input {
  width: 100%;
  min-width: 0;
  height: 30px;
  padding: 4px 7px;
}

.budget-rate-table input:disabled {
  border-color: transparent;
  background: transparent;
  color: var(--ink);
  opacity: 1;
}

.budget-rate-table .table-row.editing input {
  border-color: var(--accent);
  background: var(--surface);
}

.budget-rate-edit {
  width: 30px;
  min-width: 30px;
  height: 30px;
  padding: 0;
  font-size: 15px;
  line-height: 1;
}

.settings-textarea.compact {
  min-height: 58px;
}

@media (max-width: 1100px) {
  .budget-economics-kpis,
  .budget-economics-grid {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 760px) {
  .budget-economics-kpis,
  .budget-economics-grid,
  .budget-runtime-mix,
  .budget-project-economics-table .table-row,
  .budget-rate-table .table-row {
    grid-template-columns: 1fr;
  }

  .budget-runtime-donut {
    justify-self: center;
  }
}

.metric-panel {
  padding: 9px;
  display: grid;
  gap: 8px;
}

.metric-panel-head {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  align-items: center;
}

.metric-panel-head h3 {
  margin: 0;
  font-size: 14px;
}

.metric-panel-head span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 750;
}

.metric-bars,
.signal-list,
.blocker-list,
.point-load-list {
  display: grid;
  gap: 7px;
}

.metric-bar-row {
  display: grid;
  grid-template-columns: minmax(150px, 0.75fr) minmax(160px, 1fr);
  gap: 8px;
  align-items: center;
}

.metric-bar-row strong,
.signal-row strong,
.blocker-row strong {
  display: block;
  font-size: 12px;
}

.metric-bar-row span,
.signal-row p,
.blocker-row p {
  display: block;
  margin: 2px 0 0;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.3;
}

.metric-bar-row meter {
  width: 100%;
  height: 10px;
}

.signal-row,
.blocker-row,
.point-load-row {
  border: 1px solid var(--line);
  border-radius: 7px;
  padding: 7px;
}

.point-load-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 4px 8px;
}

.point-load-row strong {
  font-size: 12px;
}

.point-load-row span {
  color: var(--ink);
  font-size: 12px;
  font-weight: 850;
}

.point-load-row p {
  grid-column: 1 / -1;
  margin: 0;
  color: var(--muted);
  font-size: 11px;
}

.developer-load-chart {
  display: grid;
  gap: 8px;
}

.developer-load-bar {
  display: grid;
  grid-template-columns: minmax(118px, 0.52fr) minmax(150px, 1fr);
  gap: 8px;
  align-items: center;
}

.developer-load-bar > div:first-child {
  min-width: 0;
}

.developer-load-bar strong,
.developer-load-bar span {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.developer-load-bar strong {
  font-size: 12px;
}

.developer-load-bar > div:first-child > span {
  margin-top: 2px;
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
}

.developer-load-track {
  height: 16px;
  overflow: hidden;
  border: 1px solid var(--border-soft);
  border-radius: 5px;
  background: var(--panel-bg-subtle);
}

.developer-load-track span {
  display: block;
  height: 100%;
  margin: 0;
  border-radius: 3px 0 0 3px;
  background: var(--chart-primary);
}

.metric-detail-actions {
  display: flex;
  justify-content: flex-end;
}

.em-agent-farm-panel {
  gap: 10px;
}

.em-agent-farm-kpis,
.em-agent-runtime-facts {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.em-agent-runtime-facts {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.em-agent-farm-kpis span,
.em-agent-runtime-facts span {
  display: grid;
  gap: 2px;
  min-height: 58px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface);
}

.em-agent-farm-kpis b,
.em-agent-runtime-facts b {
  color: var(--ink);
  font-size: 18px;
  line-height: 1;
}

.em-agent-farm-kpis small,
.em-agent-runtime-facts small {
  color: var(--muted);
  font-size: 10px;
}

.em-agent-farm-grid {
  margin: 0;
}

.em-agent-farm-subpanel {
  min-width: 0;
  background: var(--surface-raised);
}

.em-agent-capability-list,
.em-agent-attention-list {
  display: grid;
  gap: 7px;
}

.em-agent-capability-list > div {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 5px 8px;
  align-items: center;
  min-width: 0;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface);
}

.em-agent-capability-list > div.warn {
  border-color: var(--status-warn-border);
  background: var(--status-warn-bg);
}

.em-agent-capability-list > div.danger {
  border-color: var(--status-danger-border);
  background: var(--status-danger-bg);
}

.em-agent-capability-list strong,
.em-agent-attention-list strong {
  display: block;
  color: var(--ink);
  font-size: 12px;
}

.em-agent-capability-list span,
.em-agent-attention-list small {
  display: block;
  margin-top: 2px;
  color: var(--muted);
  font-size: 10.5px;
  line-height: 1.35;
}

.em-agent-capability-list b {
  color: var(--ink);
  font-size: 10px;
  text-align: right;
}

.em-agent-capability-list .agent-farm-inline-meter {
  grid-column: 1 / -1;
}

.em-agent-attention-list button {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 4px 8px;
  width: 100%;
  min-width: 0;
  min-height: 54px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface);
  color: var(--ink);
  text-align: left;
  box-shadow: none;
}

.em-agent-attention-list button:hover {
  border-color: var(--accent);
  background: var(--surface-selected);
}

.em-agent-attention-list .badge {
  grid-row: 1 / span 2;
  align-self: start;
}

.em-agent-attention-list strong,
.em-agent-attention-list small {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.metric-lightbox-backdrop {
  position: fixed;
  inset: 0;
  z-index: 90;
  display: grid;
  place-items: center;
  padding: 22px;
  background: var(--modal-scrim);
  backdrop-filter: blur(1.5px) saturate(0.86);
  -webkit-backdrop-filter: blur(1.5px) saturate(0.86);
}

.artifact-lightbox-backdrop {
  position: fixed;
  inset: 0;
  z-index: 92;
  display: grid;
  place-items: center;
  padding: 22px;
  background: var(--modal-scrim);
  backdrop-filter: blur(1.5px) saturate(0.86);
  -webkit-backdrop-filter: blur(1.5px) saturate(0.86);
}

.metric-lightbox,
.artifact-lightbox {
  position: relative;
  display: grid;
  gap: 12px;
  width: min(1040px, calc(100vw - 44px));
  max-height: calc(100vh - 44px);
  min-height: 0;
  overflow: hidden;
  padding: 14px;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  background: var(--panel-bg);
  box-shadow: var(--modal-shadow);
}

.jira-subscription-lightbox {
  width: min(760px, calc(100vw - 44px));
  height: min(680px, calc(100vh - 44px));
  height: min(680px, calc(100dvh - 44px));
  grid-template-rows: auto auto minmax(0, 1fr) auto;
}

.artifact-lightbox.permissions-lightbox {
  width: min(980px, calc(100vw - 44px));
  height: min(680px, calc(100vh - 44px));
  height: min(680px, calc(100dvh - 44px));
  grid-template-rows: auto minmax(0, 1fr);
}

.artifact-lightbox.coding-assistant-setup-lightbox {
  width: min(760px, calc(100vw - 44px));
  max-height: min(760px, calc(100vh - 44px));
  max-height: min(760px, calc(100dvh - 44px));
  grid-template-rows: auto minmax(0, 1fr) auto;
}

.coding-assistant-setup-steps {
  min-height: 0;
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 0 4px 0 0;
  overflow-y: auto;
  list-style: none;
  scrollbar-gutter: stable;
}

.coding-assistant-setup-steps > li {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  gap: 10px;
  padding: 11px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-raised);
}

.coding-assistant-setup-number {
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  border: 1px solid var(--topbar-active-border);
  border-radius: 999px;
  background: var(--accent-soft);
  color: var(--accent-ink);
  font-size: 12px;
  font-weight: 900;
}

.coding-assistant-setup-steps h3,
.coding-assistant-setup-steps p {
  margin: 0;
}

.coding-assistant-setup-steps h3 {
  font-size: 13px;
}

.coding-assistant-setup-steps p {
  margin-top: 4px;
  color: var(--muted);
  line-height: 1.45;
}

.coding-assistant-setup-actions,
.coding-assistant-command-row {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 9px;
}

.coding-assistant-setup-actions code,
.coding-assistant-command-row code {
  min-width: 0;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--panel-bg);
  color: var(--text);
  font-family: var(--mono-font, ui-monospace, SFMono-Regular, Consolas, monospace);
  overflow-wrap: anywhere;
}

.coding-assistant-command-row code {
  flex: 1;
}

.coding-assistant-command-row button {
  flex: 0 0 auto;
}

.coding-assistant-setup-footer .helper {
  margin-right: auto;
}

@media (max-width: 620px) {
  .coding-assistant-setup-actions,
  .coding-assistant-command-row {
    align-items: stretch;
    flex-direction: column;
  }

  .coding-assistant-setup-actions .button-link,
  .coding-assistant-command-row button {
    width: 100%;
    text-align: center;
  }
}

.permissions-lightbox-body {
  min-height: 0;
  display: grid;
  align-content: start;
  gap: 10px;
  overflow-y: auto;
  padding: 1px 5px 1px 1px;
  scrollbar-gutter: stable;
}

.permissions-user-summary,
.permissions-detail-section {
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-raised);
}

.permissions-user-summary {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) minmax(250px, auto);
  align-items: center;
  gap: 12px;
}

.permissions-user-avatar {
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  border: 1px solid var(--topbar-active-border);
  border-radius: 999px;
  background: var(--accent-soft);
  color: var(--accent-ink);
  font-size: 13px;
  font-weight: 900;
}

.permissions-user-summary h3,
.permissions-user-summary p,
.permissions-section-head h3,
.permissions-section-head p,
.permissions-scope-group h4 {
  margin: 0;
}

.permissions-user-summary p {
  margin-top: 3px;
  color: var(--muted);
  font-size: 11px;
  overflow-wrap: anywhere;
}

.permissions-user-summary dl {
  display: grid;
  grid-template-columns: repeat(2, minmax(110px, 1fr));
  gap: 7px;
  margin: 0;
}

.permissions-user-summary dl div {
  min-width: 0;
  padding: 7px 8px;
  border: 1px solid var(--border-soft);
  border-radius: 7px;
  background: var(--surface-soft);
}

.permissions-user-summary dt {
  color: var(--muted);
  font-size: 9px;
  font-weight: 850;
  text-transform: uppercase;
}

.permissions-user-summary dd {
  margin: 2px 0 0;
  color: var(--text-primary);
  font-size: 11px;
  font-weight: 800;
}

.permissions-detail-section {
  display: grid;
  gap: 10px;
}

.permissions-section-head,
.permissions-scope-group > div:first-child {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.permissions-section-head > span,
.permissions-scope-group > div:first-child > span {
  min-width: 25px;
  min-height: 22px;
  display: inline-grid;
  place-items: center;
  padding: 0 6px;
  border: 1px solid var(--border-soft);
  border-radius: 999px;
  background: var(--surface-soft);
  color: var(--text-secondary);
  font-size: 10px;
  font-weight: 850;
}

.permissions-chip-list {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}

.permissions-chip-list > span {
  padding: 4px 7px;
  border: 1px solid var(--border-soft);
  border-radius: 999px;
  background: var(--chip-bg);
  color: var(--text-secondary);
  font-size: 10px;
  font-weight: 750;
  overflow-wrap: anywhere;
}

.permissions-chip-list.persona-access-list > span {
  border-color: var(--topbar-active-border);
  background: var(--accent-soft);
  color: var(--accent-ink);
}

.permissions-scope-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.permissions-scope-group {
  min-width: 0;
  display: grid;
  align-content: start;
  gap: 8px;
  padding: 9px;
  border: 1px solid var(--border-soft);
  border-radius: 7px;
  background: var(--surface-soft);
}

.permissions-scope-group h4 {
  font-size: 11px;
}

@media (max-width: 680px) {
  .permissions-user-summary { grid-template-columns: auto minmax(0, 1fr); }
  .permissions-user-summary dl { grid-column: 1 / -1; }
  .permissions-scope-list { grid-template-columns: 1fr; }
}

.jira-subscription-picker-search {
  display: grid;
  gap: 6px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.jira-subscription-picker-search input {
  min-height: 40px;
  font-size: 13px;
  font-weight: 500;
  text-transform: none;
}

.jira-subscription-picker-results {
  min-height: 0;
  display: grid;
  align-content: start;
  gap: 7px;
  overflow-y: auto;
  padding: 2px 6px 2px 2px;
  scrollbar-gutter: stable;
}

.jira-subscription-picker-row {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 9px 10px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-raised);
}

.jira-subscription-picker-row > div {
  min-width: 0;
  display: grid;
  gap: 3px;
}

.jira-subscription-picker-row strong,
.jira-subscription-picker-row small {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.jira-subscription-picker-row small {
  color: var(--muted);
}

.jira-subscription-lightbox .lightbox-action-row {
  align-items: center;
}

.jira-subscription-lightbox .lightbox-action-row .helper {
  margin-right: auto;
}

.artifact-lightbox {
  width: min(980px, calc(100vw - 44px));
  grid-template-rows: auto auto minmax(0, 1fr);
}

.development-plan-lightbox {
  width: min(1060px, calc(100vw - 44px));
  height: calc(100vh - 44px);
  height: calc(100dvh - 44px);
  max-height: calc(100vh - 44px);
  max-height: calc(100dvh - 44px);
  grid-template-rows: auto auto minmax(120px, 1fr);
  overflow: hidden;
}

.development-plan-lightbox.process-setup-lightbox {
  width: min(940px, calc(100vw - 44px));
  height: auto;
  max-height: min(560px, calc(100vh - 44px));
  max-height: min(560px, calc(100dvh - 44px));
  grid-template-rows: auto minmax(0, auto);
}

.development-plan-lightbox.plan-submit-lightbox {
  width: min(980px, calc(100vw - 44px));
  height: auto;
  max-height: calc(100vh - 44px);
  max-height: calc(100dvh - 44px);
  grid-template-rows: auto minmax(0, 1fr);
}

.development-plan-lightbox.plan-review-lightbox {
  width: min(860px, calc(100vw - 44px));
  height: auto;
  max-height: calc(100vh - 44px);
  max-height: calc(100dvh - 44px);
  grid-template-rows: auto minmax(0, 1fr);
}

.process-setup-lightbox .development-process-setup {
  max-height: min(420px, calc(100vh - 138px));
  max-height: min(420px, calc(100dvh - 138px));
}

.development-process-setup {
  min-height: 0;
  overflow: hidden;
  display: grid;
  grid-template-columns: minmax(220px, .55fr) minmax(320px, 1fr) minmax(220px, .65fr);
  gap: 10px;
  align-items: start;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-soft);
}

.development-process-copy h3 {
  margin: 0 0 5px;
  color: var(--ink);
  font-size: 14px;
}

.development-process-copy p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.4;
}

.development-process-checklist {
  min-height: 0;
  max-height: min(232px, 25vh);
  overflow: auto;
  display: grid;
  gap: 7px;
  padding-right: 2px;
}

.development-process-step {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 8px;
  align-items: start;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-raised);
}

.development-process-step.process-node {
  grid-template-columns: auto minmax(220px, 1.15fr) minmax(160px, .85fr);
}

.process-node-fixed {
  width: 17px;
  height: 17px;
  margin-top: 2px;
  border: 1px solid var(--line-strong);
  border-radius: 5px;
  background: var(--surface-muted);
}

.process-node-action,
.process-node-result {
  min-width: 0;
}

.development-process-step .process-node-result {
  padding-left: 8px;
  border-left: 1px solid var(--line);
}

.process-node-result b {
  display: block;
  color: var(--ink);
  font-size: 12px;
  line-height: 1.3;
}

.development-process-step.waived {
  border-color: var(--status-danger-border);
  background: var(--status-danger-bg);
}

.development-process-step input {
  margin-top: 2px;
}

.development-process-step strong,
.development-process-step small {
  display: block;
}

.development-process-step strong {
  color: var(--ink);
  font-size: 12px;
}

.development-process-step.waived strong {
  color: var(--muted);
  text-decoration: line-through;
  text-decoration-thickness: 2px;
  text-decoration-color: var(--danger);
}

.development-process-step small {
  margin-top: 2px;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.35;
}

.development-process-reason {
  display: grid;
  gap: 5px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.development-process-reason textarea {
  min-height: 88px;
  max-height: min(160px, 20vh);
  resize: vertical;
}

.development-plan-grid {
  min-height: 0;
  overflow: auto;
  padding-bottom: 4px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 340px);
  gap: 12px;
}

.plan-submit-lightbox .development-plan-grid,
.plan-review-lightbox .development-plan-grid {
  max-height: calc(100vh - 150px);
  max-height: calc(100dvh - 150px);
}

.plan-submit-lightbox .development-plan-editor textarea {
  height: clamp(260px, 46vh, 520px);
  height: clamp(260px, 46dvh, 520px);
}

.plan-review-lightbox .development-plan-editor textarea {
  height: clamp(220px, 38vh, 420px);
  height: clamp(220px, 38dvh, 420px);
}

@media (max-width: 820px) {
  .development-plan-lightbox.process-setup-lightbox,
  .development-plan-lightbox.plan-submit-lightbox,
  .development-plan-lightbox.plan-review-lightbox {
    width: calc(100vw - 28px);
    max-height: calc(100vh - 28px);
    max-height: calc(100dvh - 28px);
  }

  .process-setup-lightbox .development-process-setup,
  .development-plan-grid {
    grid-template-columns: 1fr;
  }

  .process-setup-lightbox .development-process-checklist {
    max-height: min(260px, 34vh);
    max-height: min(260px, 34dvh);
  }

  .development-process-step.process-node,
  .work-process-row.process-node-row {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .development-process-step .process-node-result,
  .work-process-row .process-node-result {
    grid-column: 2;
    padding-left: 0;
    border-left: 0;
  }
}

.development-plan-editor,
.development-plan-context,
.development-plan-context-card {
  min-height: 0;
  display: grid;
  gap: 10px;
}

.development-plan-editor,
.development-plan-context {
  align-content: start;
}

.workflow-policy-card {
  gap: 14px;
}

.workflow-policy-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.workflow-policy-table {
  display: grid;
  gap: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-raised);
}

.workflow-policy-table h4 {
  margin: 0;
  padding: 10px 12px;
  border-bottom: 1px solid var(--line);
  color: var(--ink);
  font-size: 13px;
}

.workflow-policy-row {
  display: grid;
  grid-template-columns: minmax(180px, 1fr) minmax(142px, 172px);
  gap: 12px;
  align-items: center;
  min-height: 48px;
  padding: 8px 10px;
  border-bottom: 1px solid var(--line);
}

.workflow-policy-row:last-child {
  border-bottom: 0;
}

.workflow-policy-row > span {
  display: grid;
  align-content: center;
  gap: 2px;
  min-width: 0;
}

.workflow-policy-row > select {
  width: 100%;
  min-width: 0;
  min-height: 32px;
  font-size: 11px;
  font-weight: 750;
}

.workflow-policy-row strong,
.workflow-policy-row small {
  display: block;
}

.workflow-policy-row strong {
  color: var(--ink);
  font-size: 12px;
}

.workflow-policy-row small {
  color: var(--muted);
  font-size: 11px;
  line-height: 1.35;
}

.workflow-policy-heading {
  min-height: 34px;
  background: var(--surface-soft);
}

.workflow-policy-heading > span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.development-plan-editor textarea {
  min-height: 0;
  height: clamp(120px, 24vh, 300px);
  height: clamp(120px, 24dvh, 300px);
  font-family: var(--font-mono);
  font-size: 12px;
  line-height: 1.45;
}

.lightbox-action-row {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  justify-content: flex-end;
  align-items: center;
}

.development-plan-context-card {
  align-content: start;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--panel-bg-subtle);
}

.development-plan-context-card h3 {
  margin: 0;
  font-size: 13px;
}

.development-plan-preview {
  min-height: 0;
  max-height: min(360px, 42vh);
  overflow: auto;
  padding: 9px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--panel-bg);
}

.development-plan-preview h1,
.development-plan-preview h2,
.development-plan-preview h3 {
  margin: 0 0 6px;
  font-size: 13px;
}

.development-plan-preview p,
.development-plan-preview li {
  color: var(--text-secondary);
  font-size: 11.5px;
  line-height: 1.4;
}

.agent-choice-list {
  display: grid;
  gap: 6px;
}

.agent-choice {
  display: grid;
  grid-template-columns: 16px minmax(0, 1fr);
  gap: 7px;
  align-items: start;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--panel-bg);
}

.agent-choice.active {
  border-color: color-mix(in srgb, var(--accent) 58%, var(--border-soft));
  background: var(--accent-soft);
}

.agent-choice strong,
.agent-choice small {
  display: block;
}

.agent-choice small {
  color: var(--text-secondary);
  font-size: 11px;
  line-height: 1.35;
}

.requirements-document-lightbox {
  width: min(1460px, calc(100vw - 44px));
  height: min(880px, calc(100vh - 44px));
  height: min(880px, calc(100dvh - 44px));
  min-height: 320px;
  grid-template-rows: auto auto minmax(0, 1fr);
}

.requirements-document-lightbox:not(.note-lightbox) .markdown-document {
  max-width: min(100%, 104ch);
}

.requirements-document-workspace {
  display: grid;
  min-height: 0;
}

.requirements-document-workspace.with-discussion {
  grid-template-columns: minmax(0, 1.45fr) minmax(340px, .75fr);
  gap: 12px;
}

.requirements-document-source-pane,
.requirements-document-discussion-pane {
  min-height: 0;
  overflow: auto;
}

.requirements-document-discussion-pane {
  padding: 11px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel-bg-subtle);
}

.requirements-document-discussion-pane .document-discussion {
  padding-top: 0;
  border-top: 0;
}

.requirements-document-discussion-pane .document-discussion-head {
  align-items: stretch;
  flex-direction: column;
}

.requirements-document-discussion-pane .document-discussion-activity {
  align-self: flex-start;
}

.requirements-document-discussion-pane .document-regeneration-control {
  align-items: stretch;
  flex-direction: column;
}

.requirements-document-discussion-pane .document-regeneration-control .inline-actions {
  justify-content: flex-end;
}

.requirements-document-lightbox.note-lightbox {
  width: clamp(360px, 42vw, 620px);
  min-height: 220px;
  max-height: min(560px, calc(100vh - 44px));
}

.requirements-document-lightbox.note-lightbox .artifact-preview-pane {
  min-height: 120px;
}

@media (max-width: 980px) {
  .requirements-document-lightbox {
    height: calc(100vh - 24px);
    height: calc(100dvh - 24px);
  }

  .requirements-document-workspace.with-discussion {
    grid-template-columns: 1fr;
    grid-template-rows: minmax(280px, 1fr) minmax(280px, 1fr);
  }

  .requirements-document-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .requirements-document-summary > div:nth-child(3) { border-left: 0; border-top: 1px solid var(--line); }
  .requirements-document-summary > div:nth-child(4) { border-top: 1px solid var(--line); }
  .requirements-document-summary-actions { align-items: stretch; flex-direction: column; }
  .requirements-document-summary-actions button { min-height: 44px; }
}

.about-lightbox {
  width: min(780px, calc(100vw - 44px));
  grid-template-rows: auto auto minmax(0, 1fr);
}

.product-help-lightbox {
  width: min(780px, calc(100vw - 44px));
  max-height: min(760px, calc(100vh - 44px));
  grid-template-rows: auto minmax(0, 1fr);
}

.product-help-body {
  display: grid;
  grid-template-rows: minmax(220px, 1fr) auto auto;
  gap: 10px;
  min-height: 0;
}

.product-help-log {
  display: grid;
  align-content: start;
  gap: 8px;
  min-height: 240px;
  max-height: 470px;
  overflow: auto;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-soft);
}

.product-help-message {
  display: grid;
  justify-self: start;
  gap: 5px;
  max-width: 92%;
  padding: 8px 9px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-raised);
  font-size: 12px;
  line-height: 1.45;
}

.product-help-message.user {
  margin-left: 22px;
  border-color: var(--accent);
  background: var(--accent-soft);
}

.product-help-message.assistant {
  border-color: var(--line-strong);
  background: var(--surface-raised);
}

.product-help-message p,
.product-help-message ul,
.product-help-message ol {
  margin: 0;
}

.product-help-message ul,
.product-help-message ol {
  padding-left: 18px;
}

.product-help-citations {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  padding-top: 4px;
  border-top: 1px solid var(--line);
}

.product-help-citations span {
  max-width: 100%;
  overflow: hidden;
  padding: 2px 6px;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--muted);
  font-size: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.product-help-composer {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-raised);
}

.metric-lightbox-close {
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 2;
  min-width: 28px;
  min-height: 28px;
  padding: 0;
  font-size: 18px;
  line-height: 1;
}

.metric-lightbox-head {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  padding-right: 34px;
  align-items: start;
}

.metric-lightbox-head h2 {
  margin: 2px 0 4px;
  font-size: 18px;
}

.metric-lightbox-head p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.about-facts-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 8px;
}

.about-facts-grid div {
  min-width: 0;
  padding: 8px 9px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: color-mix(in srgb, var(--accent-soft) 38%, transparent);
}

.about-facts-grid span {
  display: block;
  color: var(--muted);
  font-size: 10px;
  font-weight: 850;
  text-transform: uppercase;
}

.about-facts-grid strong {
  display: block;
  margin-top: 3px;
  overflow: hidden;
  color: var(--ink);
  font-size: 12px;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.about-notices {
  display: grid;
  min-height: 0;
  gap: 8px;
}

.about-notices-box {
  min-height: 260px;
  max-height: min(48vh, 440px);
  margin: 0;
  overflow: auto;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--panel-bg-subtle);
  color: var(--text-primary);
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  font-size: 11px;
  line-height: 1.45;
  white-space: pre-wrap;
}

.artifact-preview-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.artifact-preview-meta span {
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--soft);
  padding: 3px 8px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 750;
}

.artifact-preview-pane {
  min-height: 360px;
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel-bg-subtle);
}

.artifact-preview-text {
  min-height: 100%;
  margin: 0;
  padding: 14px;
  color: var(--text-primary);
  font-family: var(--font-mono);
  font-size: 12px;
  line-height: 1.55;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

.artifact-markdown-preview {
  min-height: 100%;
  padding: 18px clamp(16px, 3vw, 34px);
  background: var(--panel-bg);
}

.artifact-markdown-preview .markdown-document {
  max-width: min(100%, 104ch);
  margin: 0 auto;
}

.artifact-preview-image {
  display: block;
  max-width: 100%;
  max-height: min(68vh, 720px);
  margin: 0 auto;
  object-fit: contain;
}

.artifact-preview-frame {
  width: 100%;
  min-height: min(68vh, 720px);
  border: 0;
  background: var(--panel-bg);
}

.artifact-preview-empty {
  display: grid;
  place-items: center;
  align-content: center;
  min-height: 360px;
  padding: 22px;
  text-align: center;
}

.artifact-preview-empty p {
  max-width: 520px;
  margin: 8px 0 0;
  font-size: 13px;
}

.efficiency-narrative {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  padding: 10px;
  border: 1px solid var(--border-soft);
  border-radius: 7px;
  background: var(--accent-soft);
}

.efficiency-narrative > p {
  grid-column: 1 / -1;
  margin: 0;
  color: var(--ink);
  font-size: 12px;
  line-height: 1.45;
}

.efficiency-narrative div {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.efficiency-narrative div.wide {
  grid-column: 1 / -1;
}

.efficiency-narrative strong {
  color: var(--accent-ink);
  font-size: 10px;
  text-transform: uppercase;
}

.efficiency-narrative span {
  color: var(--text-primary);
  font-size: 11px;
  line-height: 1.35;
}

.metric-sheet-wrap {
  overflow: auto;
  max-height: min(64vh, 620px);
  border: 1px solid var(--line);
  border-radius: 7px;
}

.metric-sheet {
  width: 100%;
  min-width: 760px;
  border-collapse: collapse;
  font-size: 11px;
}

.metric-sheet th,
.metric-sheet td {
  padding: 7px 8px;
  border-bottom: 1px solid var(--line);
  border-right: 1px solid var(--line);
  text-align: left;
  vertical-align: top;
}

.metric-sheet thead th {
  position: sticky;
  top: 0;
  z-index: 1;
  background: var(--accent-soft);
  color: var(--ink);
  font-size: 10px;
}

.metric-sheet tbody th {
  min-width: 170px;
  background: var(--panel-bg-subtle);
}

.metric-sheet strong,
.metric-sheet b,
.metric-sheet span {
  display: block;
}

.metric-sheet span {
  margin-top: 2px;
  color: var(--muted);
  font-size: 10px;
}

.metric-sheet td.active {
  background: var(--accent-soft);
}

.signal-row {
  display: grid;
  grid-template-columns: 9px minmax(0, 1fr);
  gap: 7px;
}

.signal-row > span {
  width: 8px;
  height: 8px;
  margin-top: 3px;
  border-radius: 999px;
  background: var(--border-strong);
}

.signal-row.ok > span { background: var(--green); }
.signal-row.warn > span { background: var(--orange); }
.signal-row.danger > span { background: var(--danger); }

.system-log-textarea {
  width: 100%;
  min-height: 430px;
  max-height: 58vh;
  padding: 10px 12px;
  border: 1px solid var(--border-soft);
  border-radius: 8px;
  background: var(--panel-bg-subtle);
  color: var(--text-primary);
  font-family: var(--font-mono);
  font-size: 11px;
  line-height: 1.55;
  resize: vertical;
  white-space: pre;
  overflow: auto;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--panel-bg) 55%, transparent);
}

.admin-actions-row {
  display: flex;
  gap: 8px;
  justify-content: flex-end;
}

.story-assignment-bar {
  display: flex;
  gap: 8px;
  justify-content: flex-end;
  align-items: center;
  flex-wrap: wrap;
  padding: 8px 10px;
  border-bottom: 1px solid var(--line);
  background: var(--titlebar);
}

.data-head {
  position: sticky;
  top: 0;
  z-index: 2;
  background: var(--titlebar);
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.data-head button {
  min-height: 24px;
  border: 0;
  border-radius: 0;
  background: transparent;
  padding: 0;
  color: inherit;
  text-align: left;
  font-size: inherit;
  font-weight: inherit;
  text-transform: inherit;
}

.user-table .data-row,
.user-sheet-row {
  grid-template-columns: minmax(110px, 1fr) 82px minmax(100px, .8fr) minmax(150px, 1fr) minmax(150px, 1fr) minmax(104px, .8fr) 84px;
}

.user-sheet-row.selected {
  background: var(--accent-soft);
  box-shadow: inset 3px 0 0 var(--accent);
}

.cell-link {
  min-height: 24px;
  border: 0;
  border-radius: 0;
  background: transparent;
  padding: 0;
  text-align: left;
  color: var(--ink);
  overflow-wrap: anywhere;
}

.cell-link.muted {
  color: var(--muted);
}

.persona-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}

.persona-pills span {
  border: 1px solid var(--border-soft);
  border-radius: 999px;
  background: var(--panel-bg-subtle);
  padding: 2px 6px;
  color: var(--text-secondary);
  font-size: 10px;
  font-weight: 750;
}

.row-actions {
  display: flex;
  gap: 5px;
  justify-content: flex-end;
}

.row-actions button {
  min-height: 26px;
  padding: 0 7px;
  font-size: 11px;
}

.mapping-table .data-row {
  grid-template-columns: minmax(150px, .72fr) minmax(270px, 1.35fr) minmax(210px, 1fr);
  gap: 10px;
  align-items: start;
}

.mapping-persona-head {
  align-items: flex-start;
  gap: 16px;
}

.project-access-stack {
  display: grid;
  gap: 12px;
}

.persona-mapping-panel {
  padding: 12px;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  background: var(--panel-bg);
}

.persona-mapping-panel .mapping-view-switch {
  margin: 0;
}

.mapping-view-switch {
  width: fit-content;
  display: grid;
  grid-template-columns: repeat(2, minmax(92px, 1fr));
  margin: 10px 0;
  padding: 2px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-muted);
}

.mapping-view-switch button {
  min-height: 28px;
  border: 0;
  background: transparent;
  color: var(--muted);
  font-size: 10.5px;
  font-weight: 750;
}

.mapping-panel-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding-top: 12px;
  border-top: 1px solid var(--line);
}

.mapping-panel-footer .mapping-save-note {
  margin: 0;
}

.architecture-work-assignment {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, .8fr);
  gap: 12px 18px;
  align-items: end;
  margin-top: 12px;
  padding: 12px;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  background: var(--surface-raised);
}

.architecture-work-assignment h4,
.architecture-work-assignment p {
  margin: 0;
}

.architecture-work-assignment > div:first-child {
  display: grid;
  gap: 4px;
}

.architecture-work-assignment > div:first-child > p:last-child {
  color: var(--text-secondary);
  font-size: 10px;
  line-height: 1.4;
}

.architecture-work-assignment-controls {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: end;
}

.architecture-work-assignment-controls label {
  display: grid;
  gap: 4px;
  color: var(--ink);
  font-size: 9.5px;
  font-weight: 800;
}

.architecture-work-assignment-controls select,
.architecture-work-assignment-controls button {
  min-height: 32px;
}

.architecture-work-assignment > .helper {
  grid-column: 1 / -1;
}

@media (max-width: 760px) {
  .architecture-work-assignment,
  .architecture-work-assignment-controls {
    grid-template-columns: minmax(0, 1fr);
  }

  .architecture-work-assignment-controls button {
    width: 100%;
  }
}

.mapping-panel-footer button {
  flex: 0 0 auto;
}

.mapping-view-switch button.active {
  border: 1px solid var(--accent);
  background: var(--surface-raised);
  color: var(--accent-ink);
  box-shadow: var(--shadow-xs);
}

[data-mapping-view-panel][hidden] {
  display: none;
}

.mapping-role-surface,
.mapping-permission-section {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-raised);
}

.mapping-role-head,
.mapping-role-row > summary {
  display: grid;
  grid-template-columns: minmax(124px, 1fr) minmax(168px, 1.45fr) minmax(68px, .5fr) minmax(92px, .68fr) minmax(50px, .4fr);
  gap: 10px;
  align-items: center;
}

.mapping-role-head {
  min-height: 30px;
  padding: 0 11px;
  border-bottom: 1px solid var(--line);
  background: var(--surface-muted);
  color: var(--text-secondary);
  font-size: 9px;
  font-weight: 850;
  letter-spacing: .045em;
  text-transform: uppercase;
}

.mapping-role-row {
  border-bottom: 1px solid var(--line);
}

.mapping-role-row:last-child {
  border-bottom: 0;
}

.mapping-role-row > summary {
  min-height: 48px;
  padding: 7px 11px;
  cursor: pointer;
  list-style-position: inside;
}

.mapping-role-row > summary:hover,
.mapping-role-row[open] > summary {
  background: color-mix(in srgb, var(--surface-selected) 38%, var(--surface-raised));
}

.mapping-role-row.dirty > summary {
  box-shadow: inset 3px 0 0 var(--accent);
}

.mapping-role-name {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 1px;
  align-items: start;
  min-width: 0;
}

.mapping-role-name strong {
  overflow: hidden;
  color: var(--ink);
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mapping-role-name small {
  color: var(--muted);
  font-size: 8px;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.mapping-role-description,
.mapping-role-count {
  color: var(--text-secondary);
  font-size: 10px;
  line-height: 1.3;
}

.mapping-role-action {
  color: var(--accent-ink);
  font-size: 9.5px;
  font-weight: 800;
  text-align: right;
}

.mapping-role-count {
  color: var(--ink);
  font-weight: 700;
}

.mapping-role-body {
  display: grid;
  gap: 8px;
  padding: 8px 11px 11px;
  border-top: 1px solid var(--line-soft);
  background: var(--panel-bg-subtle);
}

.mapping-role-members {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  min-height: 23px;
  align-items: center;
}

.mapping-member-chip {
  min-height: 24px;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 2px 3px 2px 8px;
  border: 1px solid color-mix(in srgb, var(--accent) 48%, var(--line));
  border-radius: 5px;
  background: var(--accent-soft);
  color: var(--accent-ink);
}

.mapping-member-chip[hidden],
.mapping-member-more[hidden] {
  display: none;
}

.mapping-member-chip b {
  font-size: 9.5px;
}

.mapping-member-chip button {
  width: 18px;
  min-width: 18px;
  min-height: 18px;
  padding: 0;
  border: 0;
  background: transparent;
  color: currentColor;
  font-size: 13px;
  line-height: 1;
}

.mapping-member-chip button:hover {
  background: color-mix(in srgb, var(--accent) 20%, transparent);
}

.mapping-member-chip.locked {
  border-color: var(--line-strong);
  background: var(--surface-muted);
  color: var(--ink);
}

.mapping-member-chip em {
  padding: 2px 4px;
  border-radius: 3px;
  background: var(--surface-raised);
  color: var(--muted);
  font-size: 8px;
  font-style: normal;
  font-weight: 850;
  text-transform: uppercase;
}

.mapping-member-more {
  min-height: 24px;
  padding: 0 8px;
  border-color: color-mix(in srgb, var(--accent) 45%, var(--line));
  background: var(--surface-raised);
  color: var(--accent-ink);
  font-size: 9.5px;
}

.mapping-role-add {
  display: grid;
  gap: 5px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-raised);
}

.mapping-role-add > label {
  color: var(--ink);
  font-size: 10px;
  font-weight: 800;
}

.mapping-role-add > small {
  color: var(--muted);
  font-size: 9px;
}

.mapping-role-search-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 6px;
}

.mapping-role-search-row input,
.mapping-role-search-row button {
  min-height: 30px;
  font-size: 10px;
}

.mapping-role-search-row button {
  min-width: 112px;
}

.mapping-role-candidates {
  max-height: 174px;
  overflow: auto;
  border: 1px solid var(--line-soft);
  border-radius: 5px;
}

.mapping-role-candidate {
  min-height: 38px;
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr) auto;
  gap: 7px;
  align-items: center;
  padding: 5px 8px;
  border-bottom: 1px solid var(--line-soft);
  background: var(--surface-raised);
  cursor: pointer;
}

.mapping-role-candidate:last-child {
  border-bottom: 0;
}

.mapping-role-candidate[hidden] {
  display: none;
}

.mapping-role-candidate.assigned {
  background: var(--surface-muted);
  color: var(--muted);
  cursor: not-allowed;
}

.mapping-role-candidate > span {
  min-width: 0;
  display: grid;
  gap: 1px;
}

.mapping-role-candidate b,
.mapping-role-candidate small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mapping-role-candidate b {
  color: var(--ink);
  font-size: 9.5px;
}

.mapping-role-candidate small,
.mapping-role-candidate em {
  color: var(--muted);
  font-size: 8.5px;
  font-style: normal;
}

.mapping-role-candidate.assigned em {
  color: var(--accent-ink);
  font-weight: 750;
}

.mapping-unassigned-row {
  min-height: 52px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 12px;
  align-items: center;
  padding: 8px 11px;
  border-top: 1px solid var(--line);
  background: color-mix(in srgb, var(--status-warn-bg) 30%, var(--surface-raised));
}

.mapping-unassigned-row strong,
.mapping-unassigned-row p {
  display: block;
  margin: 0;
}

.mapping-unassigned-row strong {
  color: var(--ink);
  font-size: 11px;
}

.mapping-unassigned-row p {
  margin-top: 2px;
  color: var(--muted);
  font-size: 9.5px;
}

.mapping-unassigned-row > b {
  font-size: 10px;
}

.mapping-permission-section {
  margin-top: 10px;
}

.mapping-permission-title {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: end;
  padding: 9px 11px;
  border-bottom: 1px solid var(--line);
  background: var(--surface-muted);
}

.mapping-permission-title h4,
.mapping-permission-title p {
  margin: 0;
}

.mapping-permission-title h4 {
  font-size: 11px;
}

.mapping-permission-title > p {
  max-width: 330px;
  color: var(--muted);
  font-size: 9.5px;
  text-align: right;
}

.mapping-table .data-head {
  align-items: center;
}

.mapping-persona-row {
  min-height: 88px;
  padding-block: 9px;
}

.mapping-persona-row.dirty {
  background: color-mix(in srgb, var(--surface-selected) 48%, var(--surface-raised));
}

.mapping-user-identity {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.mapping-user-identity strong,
.mapping-user-identity span,
.mapping-user-identity small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mapping-user-identity strong {
  color: var(--ink);
  font-size: 12px;
}

.mapping-user-identity span {
  color: var(--muted);
  font-size: 10.5px;
}

.persona-chip-editor {
  min-width: 0;
  display: grid;
  gap: 6px;
}

.persona-role-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  min-height: 22px;
  align-items: center;
}

.persona-role-chip {
  min-height: 22px;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 2px 3px 2px 7px;
  border: 1px solid color-mix(in srgb, var(--accent) 54%, var(--line));
  border-radius: 5px;
  background: var(--accent-soft);
  color: var(--accent-ink);
  white-space: nowrap;
}

.persona-role-chip[hidden],
.persona-role-empty[hidden] {
  display: none;
}

.persona-role-chip b {
  font-size: 9.5px;
  font-weight: 800;
}

.persona-role-chip button {
  width: 17px;
  min-width: 17px;
  min-height: 17px;
  display: grid;
  place-items: center;
  padding: 0;
  border: 0;
  border-radius: 3px;
  background: transparent;
  color: var(--accent-ink);
  font-size: 13px;
  line-height: 1;
}

.persona-role-chip button:hover {
  background: color-mix(in srgb, var(--accent) 20%, transparent);
}

.persona-role-chip.locked {
  border-color: var(--line-strong);
  background: var(--surface-muted);
  color: var(--ink);
}

.persona-role-chip em {
  padding: 2px 4px;
  border-radius: 3px;
  background: var(--surface-raised);
  color: var(--muted);
  font-size: 8px;
  font-style: normal;
  font-weight: 800;
  text-transform: uppercase;
}

.persona-role-empty {
  color: var(--muted);
  font-size: 10px;
}

.persona-chip-add {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 5px;
}

.persona-chip-add select,
.persona-chip-add button {
  min-height: 28px;
  font-size: 10px;
}

.persona-chip-add button {
  min-width: 46px;
  padding-inline: 7px;
}

.persona-role-help {
  min-height: 24px;
  display: block;
  color: var(--muted);
  font-size: 9.5px;
  line-height: 1.25;
}

.persona-mapping-inputs {
  display: none;
}

.mapping-add-disclosure {
  margin-top: 8px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-raised);
}

.mapping-add-disclosure summary {
  padding: 8px 10px;
  color: var(--accent-ink);
  font-size: 11px;
  font-weight: 800;
  cursor: pointer;
}

.mapping-add-disclosure .mapping-add-row {
  margin: 0;
  border: 0;
  border-top: 1px solid var(--line);
  border-radius: 0 0 7px 7px;
}

.mapping-save-note {
  padding-inline: 2px;
}

.mapping-add-row {
  display: grid;
  grid-template-columns: minmax(120px, .7fr) minmax(160px, 1fr) minmax(160px, 1fr) minmax(120px, auto);
  gap: 8px;
  align-items: end;
  margin-top: 8px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-raised);
}

.auth-domain-list {
  display: grid;
  gap: 6px;
}

.auth-domain-row {
  display: grid;
  grid-template-columns: minmax(150px, 1fr) minmax(100px, 130px) minmax(150px, 1fr) minmax(84px, auto);
  gap: 8px;
  align-items: center;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-raised);
}

.auth-domain-row > *,
.mapping-add-row > * {
  min-width: 0;
}

.auth-domain-row small {
  display: block;
  color: var(--muted);
  font-size: 10px;
}

.auth-domain-editor {
  margin-top: 2px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-raised);
}

.auth-domain-editor > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  min-height: 48px;
  padding: 9px 12px;
  color: var(--ink);
  cursor: pointer;
  list-style: none;
}

.auth-domain-editor > summary::-webkit-details-marker,
.auth-domain-advanced > summary::-webkit-details-marker {
  display: none;
}

.auth-domain-editor > summary > span {
  display: grid;
  gap: 2px;
}

.auth-domain-editor > summary strong {
  font-size: 12px;
}

.auth-domain-editor > summary small {
  color: var(--muted);
  font-size: 10.5px;
  font-weight: 500;
}

.auth-domain-editor > summary::after,
.auth-domain-advanced > summary::after {
  content: "";
  flex: 0 0 auto;
  width: 7px;
  height: 7px;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  transform: rotate(45deg);
  transition: transform 140ms ease;
}

.auth-domain-editor[open] > summary::after,
.auth-domain-advanced[open] > summary::after {
  transform: rotate(225deg);
}

.auth-domain-editor[open] > summary {
  border-bottom: 1px solid var(--line);
  background: var(--titlebar);
}

.auth-domain-editor-body {
  display: grid;
  gap: 0;
  padding: 0 14px;
}

.auth-domain-field-section {
  display: grid;
  gap: 10px;
  padding: 14px 0;
  border-bottom: 1px solid var(--line);
}

.auth-domain-field-section:last-child {
  border-bottom: 0;
}

.auth-domain-field-heading {
  display: grid;
  gap: 2px;
}

.auth-domain-field-heading h5,
.auth-domain-field-heading p {
  margin: 0;
}

.auth-domain-field-heading h5 {
  color: var(--ink);
  font-size: 11px;
}

.auth-domain-field-heading p {
  color: var(--muted);
  font-size: 10.5px;
  line-height: 1.4;
}

.auth-domain-field-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px 12px;
}

.auth-domain-identity-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.auth-domain-field-grid label,
.auth-domain-access-grid > label:first-child {
  display: grid;
  align-content: start;
  gap: 5px;
  min-width: 0;
}

.auth-domain-field-grid .auth-domain-field-wide {
  grid-column: 1 / -1;
}

.auth-domain-advanced {
  margin-top: 2px;
  border-top: 1px solid var(--line);
}

.auth-domain-advanced > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 2px 2px;
  color: var(--accent-ink);
  font-size: 10.5px;
  font-weight: 800;
  cursor: pointer;
  list-style: none;
}

.auth-domain-advanced > .auth-domain-field-grid {
  padding-top: 10px;
}

.auth-domain-access-grid {
  display: grid;
  grid-template-columns: minmax(280px, 1.6fr) minmax(240px, 1fr);
  gap: 12px;
  align-items: end;
}

.auth-domain-access-grid textarea {
  min-height: 58px;
}

.auth-domain-access-grid .check-row {
  min-height: 34px;
  margin-bottom: 1px;
}

.auth-domain-note {
  max-width: 880px;
}

@media (max-width: 960px) {
  .auth-domain-identity-grid,
  .auth-domain-field-grid,
  .auth-domain-access-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .auth-domain-field-grid .auth-domain-field-wide {
    grid-column: auto;
  }
}

.mapping-table .data-row small {
  display: block;
}

.persona-checks {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(92px, 1fr));
  gap: 4px 8px;
}

.mapping-table .persona-checks {
  gap: 3px 7px;
}

.mapping-table .approval-permission-checks {
  grid-template-columns: 1fr;
}

.mapping-table .check-row.compact {
  min-height: 22px;
  padding: 2px 4px;
  border: 1px solid transparent;
  border-radius: 5px;
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none;
}

.mapping-table .check-row.compact:has(input:checked) {
  border-color: transparent !important;
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none;
}

.mapping-table .check-row.compact:hover {
  border-color: transparent !important;
  background: transparent !important;
  background-color: transparent !important;
}

.check-row.compact {
  min-height: 24px;
  font-size: 12px;
}

.helper {
  margin: 6px 0 0;
  font-size: 11px;
}

.user-form-panel {
  margin-top: 6px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-soft);
  padding: 9px 10px;
  display: grid;
  gap: 7px;
  flex-shrink: 0;
}

.user-form-head {
  display: grid;
  grid-template-columns: minmax(130px, auto) minmax(0, 1fr);
  gap: 12px;
  align-items: end;
}

.user-form-panel h3 {
  margin-bottom: 0;
}

.user-form-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(120px, 1fr)) minmax(240px, 1.4fr);
  gap: 8px;
  align-items: start;
}

.form-label {
  display: block;
  margin-bottom: 6px;
  color: var(--ink);
  font-size: 12px;
  font-weight: 650;
}

.manager-picker {
  max-height: 112px;
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-raised);
}

.manager-picker label {
  min-height: 38px;
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  gap: 8px;
  align-items: center;
  padding: 6px 8px;
  border-bottom: 1px solid var(--line);
}

.manager-picker label:last-child {
  border-bottom: 0;
}

.manager-picker input {
  width: 14px;
  min-height: 14px;
  padding: 0;
}

.manager-picker strong {
  display: block;
  font-size: 12px;
}

.manager-picker small {
  display: block;
  margin-top: 1px;
  color: var(--muted);
  font-size: 10px;
  overflow-wrap: anywhere;
}

.form-personas {
  padding: 6px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-raised);
}

.user-form-footer {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
}

.user-auth-options {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 16px;
  align-items: center;
  min-width: 0;
}

.auth-check {
  width: fit-content;
  display: inline-grid;
  grid-template-columns: 14px auto;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
}

.auth-check input {
  width: 14px;
  min-height: 14px;
  padding: 0;
}

.form-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  white-space: nowrap;
}

.eyebrow {
  margin: 0 0 4px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0;
  font-size: 11px;
  font-weight: 800;
}

.empty {
  padding: 16px;
  color: var(--muted);
  font-size: 14px;
}

.authorization-empty {
  margin: 12px;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: var(--surface-muted);
  font-size: 12px;
}

.unauthorized-pane {
  min-height: 260px;
}

.authorization-message {
  max-width: 680px;
  border: 1px solid var(--line-strong);
  border-radius: var(--radius);
  background: var(--surface-raised);
  padding: 18px;
}

.authorization-message strong {
  display: block;
  color: var(--ink);
  font-size: 16px;
  margin-bottom: 8px;
}

.authorization-message p {
  margin: 8px 0 0;
  color: var(--muted);
  line-height: 1.5;
}

.executive-dashboard {
  display: grid;
  gap: 12px;
}

.executive-portfolio-brief {
  display: grid;
  grid-template-columns: minmax(280px, 1.35fr) minmax(360px, 1fr);
  gap: 12px;
  padding: 12px;
  border: 1px solid var(--border-strong);
  border-radius: var(--radius);
  background: var(--panel-bg);
}

.executive-portfolio-narrative {
  display: grid;
  align-content: center;
  gap: 6px;
  min-width: 0;
}

.executive-portfolio-narrative > span {
  color: var(--text-secondary);
  font-size: 10px;
  font-weight: 850;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.executive-portfolio-narrative p {
  margin: 0;
  color: var(--text-primary);
  font-size: 12px;
  line-height: 1.5;
}

.executive-portfolio-kpis {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border: 1px solid var(--border-soft);
  border-radius: var(--radius-sm);
  overflow: hidden;
  background: var(--panel-bg-subtle);
}

.executive-portfolio-kpis > div {
  --executive-kpi-color: var(--accent);
  --executive-kpi-soft: var(--accent-soft);
  display: grid;
  align-content: center;
  gap: 4px;
  min-width: 0;
  padding: 9px;
  border-right: 1px solid var(--border-soft);
  border-top: 2px solid var(--executive-kpi-color);
  background: color-mix(in srgb, var(--executive-kpi-soft) 42%, var(--panel-bg));
}

.executive-portfolio-kpis > div:nth-child(1) {
  --executive-kpi-color: var(--orange);
  --executive-kpi-soft: var(--orange-soft);
}

.executive-portfolio-kpis > div:nth-child(2) {
  --executive-kpi-color: var(--cyan);
  --executive-kpi-soft: var(--cyan-soft);
}

.executive-portfolio-kpis > div:nth-child(3) {
  --executive-kpi-color: var(--violet);
  --executive-kpi-soft: var(--violet-soft);
}

.executive-portfolio-kpis > div:nth-child(4) {
  --executive-kpi-color: var(--danger);
  --executive-kpi-soft: var(--danger-soft);
}

.executive-portfolio-kpis > div.ok {
  --executive-kpi-color: var(--teal);
  --executive-kpi-soft: var(--teal-soft);
}

.executive-portfolio-kpis > div.warn {
  --executive-kpi-color: var(--orange);
  --executive-kpi-soft: var(--orange-soft);
}

.executive-portfolio-kpis > div.danger {
  --executive-kpi-color: var(--danger);
  --executive-kpi-soft: var(--danger-soft);
}

.executive-portfolio-kpis > div:last-child {
  border-right: 0;
}

.executive-portfolio-kpis strong {
  color: var(--text-primary);
  font-size: 19px;
  line-height: 1;
}

.executive-portfolio-kpis .danger strong { color: var(--danger); }
.executive-portfolio-kpis .warn strong { color: var(--orange); }
.executive-portfolio-kpis .ok strong { color: var(--green); }

.executive-portfolio-kpis span {
  color: var(--text-secondary);
  font-size: 10px;
  line-height: 1.3;
}

.executive-matrix-panel {
  padding: 0;
  overflow: hidden;
}

.executive-matrix-panel > .metric-panel-head {
  margin: 0;
}

.executive-decision-matrix {
  overflow-x: auto;
}

.executive-matrix-row {
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(0, .66fr) minmax(0, 1fr) minmax(0, .92fr) minmax(0, .94fr) minmax(0, 1.28fr);
  min-width: 760px;
  border-top: 1px solid var(--border-soft);
  background: var(--row-bg);
}

.executive-matrix-row > div,
.executive-matrix-row > span {
  display: grid;
  align-content: center;
  gap: 4px;
  min-width: 0;
  padding: 9px;
  border-right: 1px solid var(--border-soft);
}

.executive-matrix-row > :last-child {
  border-right: 0;
}

.executive-matrix-head {
  border-top: 0;
  background: var(--panel-header-bg);
}

.executive-matrix-head > span {
  color: var(--text-secondary);
  font-size: 10px;
  font-weight: 750;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.executive-matrix-row strong,
.executive-matrix-row span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

.executive-matrix-row strong {
  color: var(--text-primary);
  font-size: 11.5px;
  line-height: 1.35;
}

.executive-matrix-row div > span:not(.badge) {
  display: -webkit-box;
  color: var(--text-secondary);
  font-size: 10px;
  line-height: 1.35;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.executive-matrix-row .badge {
  justify-self: start;
  width: fit-content;
}

.executive-matrix-confidence.danger { color: var(--danger); }
.executive-matrix-confidence.warn { color: var(--orange); }
.executive-matrix-confidence.ok { color: var(--green); }

.executive-matrix-row .executive-confidence {
  height: 12px;
  margin: 0;
}

.executive-matrix-row .executive-confidence b {
  display: none;
}

.executive-decision-queues {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.executive-priority-queue {
  padding: 0;
  overflow: hidden;
}

.executive-priority-queue > .metric-panel-head {
  margin: 0;
}

.executive-queue-list {
  display: grid;
}

.executive-queue-list > article {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 8px;
  align-items: start;
  padding: 9px;
  border-top: 1px solid var(--border-soft);
}

.executive-risk-queue .executive-queue-list > article {
  grid-template-columns: 64px minmax(0, 1fr);
}

.executive-risk-queue .badge {
  justify-self: start;
}

.executive-queue-list article > div {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.executive-queue-list strong,
.executive-queue-list span,
.executive-queue-list p {
  margin: 0;
}

.executive-queue-list strong {
  color: var(--text-primary);
  font-size: 11.5px;
}

.executive-queue-list span {
  color: var(--text-secondary);
  font-size: 10px;
  font-weight: 750;
}

.executive-queue-list p {
  color: var(--text-secondary);
  font-size: 10.5px;
  line-height: 1.35;
}

.executive-kpis {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.executive-kpis > div,
.executive-panel {
  border: 1px solid var(--border-soft);
  border-radius: var(--radius);
  background: var(--panel-bg);
  color: var(--text-primary);
  padding: 12px;
}

.executive-kpis span,
.executive-kpis small {
  display: block;
  color: var(--text-secondary);
  font-size: 11px;
}

.executive-kpis strong {
  display: block;
  color: var(--text-primary);
  font-size: 22px;
  line-height: 1.1;
  margin: 4px 0;
}

.executive-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(280px, 0.75fr);
  gap: 12px;
}

.executive-brief-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(300px, .75fr);
  gap: 12px;
  align-items: stretch;
}

.executive-brief {
  position: relative;
  overflow: hidden;
  padding-left: 15px;
}

.executive-brief::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 4px;
  background: var(--accent);
}

.executive-brief.ok::before { background: var(--ok); }
.executive-brief.warn::before { background: var(--orange); }
.executive-brief.danger::before { background: var(--danger); }

.executive-brief-body {
  display: grid;
  gap: 7px;
}

.executive-brief-body > span {
  color: var(--text-secondary);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.executive-brief-body > strong {
  color: var(--text-primary);
  font-size: 18px;
  line-height: 1.2;
}

.executive-brief-body > p {
  max-width: 720px;
  margin: 0;
  color: var(--text-secondary);
  font-size: 12px;
  line-height: 1.45;
}

.executive-brief-facts {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) repeat(2, minmax(0, .8fr));
  gap: 7px;
  margin-top: 2px;
}

.executive-brief-facts span {
  display: grid;
  gap: 2px;
  min-width: 0;
  padding: 7px 8px;
  border: 1px solid var(--border-soft);
  border-radius: 6px;
  background: var(--panel-bg-subtle);
}

.executive-brief-facts small {
  color: var(--text-secondary);
  font-size: 9px;
  font-weight: 750;
  text-transform: uppercase;
}

.executive-brief-facts b {
  overflow: hidden;
  color: var(--text-primary);
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.executive-question-list.compact article {
  padding: 7px 8px;
}

.executive-question-list.compact p {
  display: -webkit-box;
  margin-top: 3px;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.executive-project-outlook-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
}

.executive-project-outlook {
  display: grid;
  gap: 7px;
  min-width: 0;
  padding: 10px;
  border: 1px solid var(--border-soft);
  border-top: 3px solid var(--ok);
  border-radius: var(--radius-sm);
  background: var(--row-bg);
}

.executive-project-outlook.at-risk { border-top-color: var(--orange); }
.executive-project-outlook.critical { border-top-color: var(--danger); }

.executive-project-outlook header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}

.executive-project-outlook header strong,
.executive-project-outlook header span {
  display: block;
}

.executive-project-outlook header strong {
  color: var(--text-primary);
  font-size: 13px;
}

.executive-project-outlook header span {
  margin-top: 2px;
  color: var(--text-secondary);
  font-size: 10px;
}

.executive-project-outlook > p {
  margin: 0;
  color: var(--text-secondary);
  font-size: 11px;
  line-height: 1.4;
}

.executive-project-outlook > p b {
  color: var(--text-primary);
}

.executive-forecast-compact .executive-forecast-cone {
  margin-top: 0;
}

.executive-attention-grid,
.executive-evidence-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.executive-panel h3 {
  margin: 0 0 10px;
  font-size: 14px;
}

.executive-project-list,
.executive-movement-list,
.executive-risk-list {
  display: grid;
  gap: 8px;
}

.executive-project-list article,
.executive-movement-list article,
.executive-risk-list article {
  border: 1px solid var(--border-soft);
  border-radius: var(--radius-sm);
  background: var(--row-bg);
  color: var(--text-primary);
  padding: 10px;
}

.executive-project-list article {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 5px 10px;
}

.executive-project-list strong,
.executive-movement-list strong,
.executive-risk-list strong {
  display: block;
  font-size: 13px;
}

.executive-project-list span,
.executive-project-list small,
.executive-movement-list span,
.executive-movement-list small,
.executive-risk-list small {
  color: var(--text-secondary);
  font-size: 11px;
}

.executive-risk-list article {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 3px 7px;
  border-left: 3px solid var(--line-strong);
}

.executive-risk-list article.high { border-left-color: var(--danger); }
.executive-risk-list article.medium { border-left-color: var(--orange); }

.executive-risk-list article > span {
  grid-row: 1 / span 2;
  align-self: start;
  padding: 2px 5px;
  border: 1px solid var(--border-soft);
  border-radius: 999px;
  color: var(--text-secondary);
  font-size: 9px;
  font-weight: 850;
  text-transform: uppercase;
}

.executive-risk-list article > p,
.executive-risk-list article > small {
  grid-column: 2;
}

.executive-risk-list article > p {
  margin-top: 1px;
  color: var(--text-primary);
  font-weight: 750;
}

.executive-project-list p,
.executive-movement-list p,
.executive-risk-list p,
.executive-panel.narrative p {
  margin: 0;
  color: var(--text-secondary);
  font-size: 12px;
  line-height: 1.45;
}

.executive-movement-list article {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 6px 10px;
}

.executive-movement-list p,
.executive-movement-list small {
  grid-column: 1 / -1;
}

.executive-confidence {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  height: 18px;
  margin-top: 2px;
}

.executive-confidence::before {
  content: "";
  grid-column: 1;
  grid-row: 1;
  height: 7px;
  border-radius: 999px;
  background: var(--panel-bg-muted);
  border: 1px solid var(--border-soft);
}

.executive-confidence span {
  grid-column: 1;
  grid-row: 1;
  height: 7px;
  min-width: 4px;
  border-radius: 999px;
  background: var(--green);
}

.executive-confidence.at-risk span { background: var(--orange); }
.executive-confidence.critical span { background: var(--danger); }

.executive-confidence b {
  font-size: 10px;
  color: var(--text-secondary);
}

.executive-forecast-list,
.executive-question-list,
.executive-recommendation-list,
.executive-transparency-grid {
  display: grid;
  gap: 8px;
}

.executive-forecast-list article,
.executive-question-list article,
.executive-recommendation-list article,
.executive-transparency-grid article {
  border: 1px solid var(--border-soft);
  border-radius: var(--radius-sm);
  background: var(--row-bg);
  color: var(--text-primary);
  padding: 9px;
}

.executive-forecast-list strong,
.executive-question-list strong,
.executive-transparency-grid strong {
  display: block;
  font-size: 12px;
}

.executive-forecast-list p,
.executive-question-list p,
.executive-transparency-grid p {
  margin: 6px 0 0;
  color: var(--text-secondary);
  font-size: 11px;
  line-height: 1.4;
}

.executive-forecast-cone {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
  margin-top: 8px;
}

.executive-forecast-cone span {
  border: 1px solid var(--border-soft);
  border-radius: 6px;
  background: var(--panel-bg-subtle);
  padding: 6px;
  min-width: 0;
}

.executive-forecast-cone small,
.executive-question-list span {
  display: block;
  color: var(--text-secondary);
  font-size: 10px;
  font-weight: 750;
  text-transform: uppercase;
}

.executive-forecast-cone b {
  display: block;
  margin-top: 3px;
  font-size: 11px;
  color: var(--text-primary);
  overflow: hidden;
  text-overflow: ellipsis;
}

.executive-mini-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 5px;
  margin-top: 8px;
}

.executive-mini-metrics span {
  border: 1px solid var(--border-soft);
  border-radius: 5px;
  background: var(--panel-bg-subtle);
  padding: 5px;
  color: var(--text-secondary);
  font-size: 10px;
}

.executive-mini-metrics b {
  display: block;
  margin-top: 2px;
  color: var(--text-primary);
  font-size: 12px;
}

.executive-recommendation-list article {
  color: var(--text-primary);
  font-size: 12px;
  line-height: 1.45;
  border-left: 3px solid var(--accent);
}

.executive-token-panel {
  display: grid;
  gap: 10px;
}

.executive-token-kpis {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.executive-token-kpis span {
  display: grid;
  gap: 2px;
  min-height: 58px;
  padding: 8px;
  border: 1px solid var(--border-soft);
  border-radius: 7px;
  background: var(--panel-bg-subtle);
}

.executive-token-kpis b {
  color: var(--text-primary);
  font-size: 18px;
  line-height: 1;
}

.executive-token-kpis small {
  color: var(--text-secondary);
  font-size: 10px;
}

.executive-token-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(260px, .8fr);
  gap: 10px;
  align-items: start;
}

.executive-token-grid h4 {
  margin: 0 0 8px;
  color: var(--text-primary);
  font-size: 12px;
}

.executive-token-runway {
  display: grid;
  gap: 10px;
}

.executive-token-runway-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-width: 0;
}

.executive-token-runway-head h4 {
  margin: 0;
  color: var(--text-primary);
  font-size: 12px;
}

.executive-token-runway-head span {
  color: var(--text-secondary);
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap;
}

.executive-token-chart,
.executive-token-table {
  display: grid;
  gap: 7px;
}

.executive-token-chart article {
  display: grid;
  grid-template-columns: minmax(84px, .24fr) minmax(160px, 1fr);
  gap: 8px;
  align-items: center;
  min-width: 0;
  padding: 8px;
  border: 1px solid var(--border-soft);
  border-radius: 7px;
  background: var(--row-bg);
}

.executive-token-chart strong,
.executive-token-chart span {
  display: block;
  color: var(--text-primary);
  font-size: 11px;
}

.executive-token-chart span {
  color: var(--text-secondary);
  font-weight: 800;
}

.executive-token-stack-track {
  display: flex;
  align-items: center;
  height: 22px;
  overflow: hidden;
  border: 1px solid var(--border-soft);
  border-radius: 999px;
  background: var(--panel-bg-muted);
}

.executive-token-stack {
  display: flex;
  height: 100%;
  overflow: hidden;
  border-radius: 999px;
  background: var(--project-stack-divider);
}

.executive-token-stack i {
  display: block;
  height: 100%;
  min-width: 6px;
}

.executive-token-stack i.color-1,
.executive-token-dot.color-1 { background: var(--project-stack-1); }

.executive-token-stack i.color-2,
.executive-token-dot.color-2 { background: var(--project-stack-2); }

.executive-token-stack i.color-3,
.executive-token-dot.color-3 { background: var(--project-stack-3); }

.executive-token-stack i.color-4,
.executive-token-dot.color-4 { background: var(--project-stack-4); }

.executive-token-stack i.color-5,
.executive-token-dot.color-5 { background: var(--project-stack-5); }

.executive-token-dot {
  display: inline-block;
  width: 9px;
  height: 9px;
  flex: 0 0 auto;
  border-radius: 50%;
}

.executive-token-table article {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 3px 8px;
  align-items: center;
  min-width: 0;
  padding: 8px;
  border: 1px solid var(--border-soft);
  border-radius: 7px;
  background: var(--row-bg);
}

.executive-token-table span {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  overflow: hidden;
  color: var(--text-primary);
  font-size: 11px;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.executive-token-table b {
  color: var(--text-primary);
  font-size: 12px;
}

.executive-token-table small {
  grid-column: 1 / 3;
  color: var(--text-secondary);
  font-size: 10px;
}

.executive-token-table em {
  justify-self: end;
  padding: 2px 7px;
  border: 1px solid var(--border-soft);
  border-radius: 999px;
  font-size: 10px;
  font-style: normal;
  font-weight: 850;
}

.executive-token-table em.ok {
  border-color: var(--ok);
  background: var(--green-soft);
  color: var(--green);
}

.executive-token-table em.warn {
  border-color: var(--orange);
  background: var(--orange-soft);
  color: var(--orange);
}

.executive-token-table em.danger {
  border-color: var(--danger);
  background: var(--danger-soft);
  color: var(--danger);
}

@media (max-width: 1100px) {
  .executive-portfolio-brief {
    grid-template-columns: 1fr;
  }
  .executive-kpis,
  .executive-grid,
  .executive-brief-grid,
  .executive-project-outlook-grid,
  .executive-token-kpis,
  .executive-token-grid {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 760px) {
  .executive-portfolio-kpis,
  .executive-decision-queues {
    grid-template-columns: 1fr 1fr;
  }

  .executive-portfolio-kpis > div:nth-child(2) {
    border-right: 0;
  }

  .executive-portfolio-kpis > div:nth-child(-n+2) {
    border-bottom: 1px solid var(--border-soft);
  }

  .executive-kpis,
  .executive-grid,
  .executive-brief-grid,
  .executive-project-outlook-grid,
  .executive-token-kpis,
  .executive-token-grid,
  .executive-token-chart article {
    grid-template-columns: 1fr;
  }

  .executive-brief-facts {
    grid-template-columns: 1fr;
  }

  .executive-token-table article {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .executive-token-table small {
    grid-column: 1 / -1;
  }

  .executive-token-table em {
    justify-self: start;
  }
}

@media (max-width: 520px) {
  .executive-decision-queues {
    grid-template-columns: 1fr;
  }
}

.state-counts i.planning { background: var(--accent); }
.state-counts i.requirements,
.state-counts i.requirements-gathering { background: var(--orange); }
.state-counts i.development { background: var(--green); }
.state-counts i.released { background: var(--purple); }

/* Border hierarchy: containing surfaces use the stronger outline; nested rows, inputs, and detail chips keep --line. */
.login-panel,
.auth-panel-inner,
.auth-status-row,
.project-row,
.queue-group,
.activity-pane,
.gateway-card,
.integration-icons,
.project-detail-head,
.gate-command-center,
.named-gate-panel,
.gate-runbook-panel,
.project-context-strip,
.workflow-column,
.workflow-map-panel,
.workspace-view-switcher,
.workflow-step-row,
.workflow-map-step,
.project-lifecycle-card,
.readiness-card,
.artifact-summary-card,
.artifact-declare-card,
.story-table,
.story-workspace-tabs,
.sprint-planner-card,
.sprint-gantt,
.manual-story-card,
.story-label-panel,
.story-label-grid,
.story-git-card,
.git-story-card,
.system-metric-card,
.metric-card,
.metric-panel,
.what-if-sprint-row,
.what-if-story-picker,
.artifact-lightbox,
.metric-lightbox,
.about-lightbox,
.product-help-lightbox,
.user-form-panel,
.manager-picker,
.operation-drawer,
.operation-panel,
.settings-card,
.support-card,
.context-upload-card {
  border-color: var(--line-strong);
}

.portfolio {
  border-right-color: var(--line-strong);
}

.assistant-pane {
  border-left-color: var(--line-strong);
}

.main-activity-feed {
  border-top-color: var(--line-strong);
}

.project-header,
.assistant-header,
.assistant-actions,
.composer,
.data-head,
.user-sheet-head {
  border-color: var(--line-strong);
}

@media (max-width: 1100px) {
  .auth-layout { grid-template-columns: minmax(320px, 42vw) minmax(360px, 1fr); }
  .auth-brand-panel { padding: 42px 36px 28px; }
  .auth-product strong { font-size: 51px; }
  .auth-panel { padding: 36px; }
  .workspace { grid-template-columns: 72px minmax(184px, 210px) minmax(420px, 1fr); }
  .workspace.assistant-collapsed { grid-template-columns: 72px minmax(184px, 210px) minmax(420px, 1fr); }
  .mission { min-width: min(420px, 100%); }
  .assistant-pane { display: none; }
  .assistant-peek { display: flex; }
  .project-thread-runbook-grid,
  .workflow-accountability-grid,
  .workspace-focus-grid {
    grid-template-columns: 1fr 1fr;
  }
  .workflow-map-panel {
    grid-column: 1 / -1;
  }
}

@media (max-width: 1280px) {
  .story-row-controls {
    grid-template-columns: repeat(3, minmax(96px, 1fr));
  }

  .work-thread-work-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .pco-form-grid,
  .pco-summary-grid {
    grid-template-columns: repeat(2, minmax(140px, 1fr));
  }

  .pco-layout {
    grid-template-columns: minmax(180px, 0.42fr) minmax(0, 1fr);
  }
}

@media (min-width: 760px) and (max-width: 900px) {
  .auth-layout { grid-template-columns: 1fr; }
  .auth-brand-panel {
    min-height: auto;
    height: auto;
    grid-template-rows: auto auto;
    padding: 28px 22px;
    gap: 18px;
  }
  .auth-brand-top { gap: 20px; }
  .auth-logo {
    width: 60px;
    height: 14px;
  }
  .auth-product strong { font-size: 45px; }
  .auth-workflow {
    width: 100%;
    max-height: 250px;
    object-fit: cover;
    object-position: center;
  }
  .auth-status-row,
  .auth-footer { display: none; }
  .auth-panel {
    min-height: auto;
    padding: 28px 20px 36px;
    place-items: start center;
  }
  .auth-copy h1 { font-size: 28px; }
  .sso-button {
    grid-template-columns: 26px minmax(0, 1fr);
  }
  .sso-button em {
    grid-column: 2;
    justify-self: start;
  }
  .app-shell { grid-template-rows: auto minmax(0, 1fr); }
  .topbar, .workspace, .split, .bottom-grid, .summary-grid {
    grid-template-columns: 1fr;
  }
  .topbar { height: auto; position: relative; }
  .workspace {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: auto auto minmax(0, 1fr);
    height: auto;
    min-height: calc(100vh - 48px);
  }
  .workspace.assistant-collapsed {
    grid-template-columns: 1fr;
  }
  .icon-rail {
    grid-column: 1;
    grid-row: 1;
    min-height: auto;
    position: relative;
    top: auto;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-rows: auto;
    grid-auto-flow: column;
    overflow: auto hidden;
    z-index: 12;
  }
  .rail-primary {
    display: flex;
    gap: 8px;
    overflow: auto hidden;
  }
  .rail-button { width: 72px; }
  .profile-menu { align-self: center; }
  .profile-popover { left: 0; bottom: auto; top: 64px; }
  .portfolio {
    grid-column: 1;
    grid-row: 2;
    grid-template-rows: auto;
    height: auto;
    min-height: auto;
    max-height: none;
    overflow: visible;
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }
  .portfolio > .project-rail-head,
  .portfolio > .project-search,
  .portfolio > .project-list,
  .portfolio > .rail-work-queue,
  .portfolio > .rail-assigned-work {
    grid-row: auto;
  }
  .portfolio .project-list,
  .portfolio .queue-list {
    max-height: none;
    overflow: visible;
  }
  .rail-work-queue-list,
  .rail-assigned-work,
  .rail-assigned-work-list {
    max-height: none;
    overflow: visible;
  }
  .mission {
    grid-column: 1;
    grid-row: 3;
    min-height: 560px;
  }
  .project-header { grid-template-columns: 1fr; }
  .project-owner { justify-items: start; }
  .project-context-strip {
    align-items: stretch;
    flex-direction: column;
  }
  .project-context-strip button { width: 100%; }
  .project-thread-runbook-grid,
  .workflow-accountability-grid,
  .workspace-focus-grid {
    grid-template-columns: 1fr;
  }

  .workflow-map-panel {
    grid-column: auto;
    justify-items: stretch;
  }
  .developer-workbench-hero,
  .developer-panel-head,
  .gate-command-head,
  .gate-panel-head {
    align-items: stretch;
    flex-direction: column;
  }
  .gate-command-head {
    grid-template-columns: 1fr;
  }
  .gate-runbook-row {
    grid-template-columns: 18px minmax(0, 1fr);
  }
  .gate-runbook-row > b {
    grid-column: 2;
    justify-self: start;
  }
  .developer-workbench-hero > button,
  .developer-panel-head > button {
    width: 100%;
  }
  .work-thread-workbench,
  .work-thread-work-grid,
  .developer-work-jigsaw-grid,
  .work-thread-context-panels,
  .thread-artifacts-layout,
  .work-thread-panel.info,
  .developer-workbench-grid,
  .gate-command-grid,
  .gate-panel-facts,
  .developer-mode-strip,
  .mode-action-body,
  .developer-process-grid,
  .developer-workflow-graph {
    grid-template-columns: 1fr;
  }
  .developer-work-jigsaw-grid {
    grid-template-areas:
      "left"
      "process";
  }
  .work-thread-tabs {
    overflow: auto hidden;
  }
  .developer-case-step {
    grid-template-columns: 28px minmax(0, 1fr);
    align-items: start;
  }
  .developer-case-step > button,
  .developer-case-step > b,
  .developer-case-step-state {
    grid-column: 2;
    justify-self: start;
  }
  .developer-case-step-state {
    justify-items: start;
    min-width: 0;
  }
  .developer-stage-actions {
    display: grid;
    grid-template-columns: 1fr;
  }
  .developer-stage-actions label,
  .developer-stage-actions button,
  .developer-stage-actions select {
    width: 100%;
    min-width: 0;
  }
  .developer-evidence-row {
    grid-template-columns: 16px minmax(0, 1fr);
    align-items: start;
  }
  .developer-evidence-row button,
  .developer-evidence-row b {
    grid-column: 2;
    justify-self: start;
  }
  .developer-artifact-list button {
    grid-template-columns: 1fr;
  }
  .workflow-map-step {
    grid-template-columns: minmax(84px, .55fr) minmax(0, 1fr);
  }
  .workflow-map-step p,
  .workflow-map-step .badge {
    grid-column: 1 / -1;
    justify-self: start;
  }
  .project-detail-head { grid-template-columns: 1fr; }
  .project-metadata-panel { max-width: 100%; }
  .user-settings-screen .pane-title {
    align-items: stretch;
    flex-direction: column;
  }
  .user-settings-search {
    width: 100%;
    max-width: none;
  }
  .credential-mode-grid {
    grid-template-columns: 1fr;
  }
  .auth-domain-row,
  .mapping-add-row {
    grid-template-columns: 1fr;
    align-items: stretch;
  }
  .mapping-panel-footer {
    align-items: stretch;
    flex-direction: column;
  }
  .mapping-panel-footer button {
    width: 100%;
  }
  .project-lifecycle, .project-readiness-grid, .artifact-summary-grid, .artifact-form-grid, .artifact-filter-bar, .metrics-grid, .metrics-two-column, .project-budget-summary-panel .metrics-grid, .pco-form-grid, .pco-layout, .pco-summary-grid, .confluence-import-panel, .requirements-workspace, .requirements-workbench-grid, .support-grid, .support-form, .support-issue-form, .support-chat-head, .support-chat-composer, .support-permission-panel, .agent-clarification-panel, .agent-task-chat-composer, .agent-task-focus-facts { grid-template-columns: 1fr; }
  .requirements-workbench-grid {
    grid-template-areas:
      "intent"
      "documents"
      "stories"
      "review";
  }
  .requirements-hero { align-items: stretch; flex-direction: column; }
  .requirements-hero-stats { justify-content: flex-start; }
  .pco-form-grid .wide { grid-column: auto; }
  .metric-bar-row { grid-template-columns: 1fr; }
  .artifact-declare-head { grid-template-columns: 1fr; }
  .project-stage { min-height: 70px; }
  .project-flow-arrow { width: 2px; height: 18px; justify-self: center; }
  .project-flow-arrow::after {
    right: 50%;
    top: auto;
    bottom: -1px;
    transform: translateX(50%) rotate(135deg);
  }
  .queue-table-head { display: none; }
  .queue-table-row { grid-template-columns: 1fr; gap: 5px; }
  .user-form-grid { grid-template-columns: 1fr; }
  .user-form-head,
  .user-form-footer {
    grid-template-columns: 1fr;
    align-items: start;
  }
  .form-actions {
    justify-content: flex-start;
  }
  .user-management { min-height: auto; }
  .activity-table div { grid-template-columns: 1fr; }
  .integration-icons { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .kanban-head { grid-template-columns: 1fr; }
  .kanban-summary { grid-template-columns: repeat(4, minmax(64px, 1fr)); min-width: 0; }
  .kanban-board { grid-template-columns: repeat(5, minmax(172px, 172px)); }
  .a2a-agent-form,
  .crewai-automation-form,
  .a2a-agent-row,
  .agent-console-grid,
  .agent-dispatch-form,
  .agent-task-row,
  .agent-task-followup,
  .agent-task-execution-status { grid-template-columns: 1fr; }
  .a2a-agent-actions,
  .agent-task-actions { justify-content: flex-start; }
  .story-label-panel-head,
  .story-label-row { grid-template-columns: 1fr; }
  .sprint-form { grid-template-columns: 1fr; }
  .story-row,
  .story-sprint-table-head,
  .story-row-controls { grid-template-columns: 1fr; }
  .story-sprint-table-head span:last-child { text-align: left; }
  .story-row-action-cell {
    justify-items: start;
  }
  .story-status-stack { justify-items: start; }
  .story-form-grid { grid-template-columns: 1fr; }
  .git-lifecycle { grid-auto-flow: row; grid-auto-columns: auto; grid-template-columns: 1fr; }
  .git-stage { min-height: 68px; }
  .git-flow-arrow { width: 2px; height: 18px; justify-self: center; }
  .git-flow-arrow::after {
    right: 50%;
    top: auto;
    bottom: -1px;
    transform: translateX(50%) rotate(135deg);
  }
  .assistant-pane {
    position: fixed;
    top: 82px;
    right: 0;
    bottom: 0;
    z-index: 30;
    width: min(360px, calc(100vw - 18px));
    height: calc(100vh - 82px);
    box-shadow: -12px 0 28px color-mix(in srgb, var(--rail-bg) 18%, transparent);
  }
  .assistant-peek {
    position: fixed;
    top: 110px;
    right: 0;
    z-index: 31;
    grid-column: auto;
  }
}

.developer-issues-pane {
  gap: 12px;
}

.issue-table {
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  overflow: auto;
  background: var(--surface-raised);
}

.issue-row {
  display: grid;
  grid-template-columns: minmax(150px, 1.1fr) minmax(220px, 1.7fr) minmax(138px, 0.9fr) minmax(190px, 1fr);
  gap: 10px;
  align-items: center;
  min-width: 760px;
  padding: 8px 10px;
  border-top: 1px solid var(--line);
  font-size: 12px;
  background: var(--surface-raised);
}

.issue-row:first-child {
  border-top: 0;
}

.issue-head {
  position: sticky;
  top: 0;
  z-index: 1;
  background: var(--titlebar);
  border-bottom: 1px solid var(--line-strong);
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
}

.issue-row strong,
.issue-row b {
  display: block;
  overflow: hidden;
  color: var(--ink);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.issue-row small {
  display: block;
  overflow: hidden;
  margin-top: 3px;
  color: var(--muted);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.issue-subtask-row {
  background: var(--surface-soft);
}

.issue-subtask-row > div:first-child {
  padding-left: 18px;
  border-left: 3px solid var(--line-strong);
}

.issue-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  justify-content: flex-end;
}

.issue-link-list {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}

.issue-link-chip {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  min-height: 20px;
  gap: 4px;
  padding: 2px 6px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--chip-muted);
  color: var(--ink);
  font-size: 10px;
  font-weight: 800;
}

.issue-link-chip a {
  overflow: hidden;
  max-width: 92px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.issue-link-chip small {
  max-width: 72px;
  margin: 0;
  font-size: 9px;
}

.issue-link-chip button {
  width: 16px;
  min-width: 16px;
  height: 16px;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--muted);
  font-size: 12px;
}

.issue-link-actions {
  align-items: center;
}

.inline-issue-key {
  display: inline-flex;
  align-items: center;
  width: 132px;
  gap: 4px;
  margin: 0;
  font-size: 10px;
}

.inline-issue-key span {
  color: var(--muted);
  font-weight: 800;
}

.inline-issue-key input {
  min-width: 0;
  height: 26px;
  padding: 4px 6px;
  font-size: 11px;
}

.project-jira-setup-card {
  display: grid;
  gap: 12px;
  padding: 12px;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  background: color-mix(in srgb, var(--panel-bg-subtle) 86%, transparent);
}

.project-jira-setup-grid {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) auto;
  gap: 12px;
  align-items: end;
}

.project-jira-setup-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.mapping-panel,
.project-jira-user-mapping {
  display: grid;
  gap: 12px;
}

.project-jira-user-mapping {
  border-top: 1px solid var(--line);
  padding-top: 12px;
}

.jira-user-map-groups {
  display: grid;
  gap: 12px;
}

.jira-user-map-groups h4 {
  margin: 0 0 8px;
  font-size: 12px;
}

.jira-user-map-row {
  display: grid;
  grid-template-columns: minmax(180px, 1fr) minmax(180px, 260px) auto;
  gap: 10px;
  align-items: center;
  padding: 8px 0;
  border-top: 1px solid var(--line);
}

.jira-user-map-row strong,
.jira-user-map-row small {
  display: block;
}

.jira-user-map-row small {
  color: var(--muted);
  font-size: 11px;
}

@media (max-width: 900px) {
  .project-jira-setup-grid {
    grid-template-columns: 1fr;
  }
  .project-jira-setup-actions {
    justify-content: flex-start;
  }
  .jira-user-map-row {
    grid-template-columns: 1fr;
  }
}

.theme-options {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.theme-option {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: start;
  gap: 8px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-soft);
  cursor: pointer;
}

.theme-option input {
  width: auto;
  min-height: 0;
  margin: 3px 0 0;
}

.theme-option span {
  display: grid;
  gap: 2px;
}

.theme-option small {
  color: var(--muted);
  font-size: 11px;
  font-weight: 600;
  line-height: 1.25;
}

.theme-option.active {
  border-color: var(--accent);
  background: var(--accent-soft);
  box-shadow: inset 3px 0 0 var(--accent);
}

[data-theme="dark"] .topbar {
  background: var(--topbar-bg);
  border-bottom-color: var(--line);
}

[data-theme="dark"] .persona-chip,
[data-theme="dark"] .profile-menu summary,
[data-theme="dark"] .user-form-panel,
[data-theme="dark"] .manager-picker,
[data-theme="dark"] .form-personas,
[data-theme="dark"] .context-list,
[data-theme="dark"] .authorization-empty,
[data-theme="dark"] .authorization-message,
[data-theme="dark"] .project-row,
[data-theme="dark"] .queue-table-row,
[data-theme="dark"] .queue-row,
[data-theme="dark"] .requirements-source-card,
[data-theme="dark"] .requirements-story-card,
[data-theme="dark"] .support-card,
[data-theme="dark"] .metric-card,
[data-theme="dark"] .readiness-card,
[data-theme="dark"] .artifact-document,
[data-theme="dark"] .story-card,
[data-theme="dark"] .story-detail-card,
[data-theme="dark"] .integration-tile,
[data-theme="dark"] .integration-config,
[data-theme="dark"] .settings-section,
[data-theme="dark"] .project-jira-setup-card,
[data-theme="dark"] .data-row,
[data-theme="dark"] .data-table,
[data-theme="dark"] .operation-drawer,
[data-theme="dark"] .pane,
[data-theme="dark"] .login-panel {
  background-color: var(--surface-raised);
  border-color: var(--line);
  color: var(--ink);
  box-shadow: none;
}

[data-theme="dark"] .workspace,
[data-theme="dark"] .mission,
[data-theme="dark"] .main-panel-stack,
[data-theme="dark"] .workspace-tab-panel,
[data-theme="dark"] .story-table,
[data-theme="dark"] .artifact-table,
[data-theme="dark"] .support-progress-list,
[data-theme="dark"] .artifact-registry,
[data-theme="dark"] .requirements-workbench,
[data-theme="dark"] .generated-documents,
[data-theme="dark"] .requirements-doc-list,
[data-theme="dark"] .requirements-review-panel {
  background-color: var(--surface-soft);
  color: var(--ink);
}

[data-theme="dark"] .icon-rail,
[data-theme="dark"] .auth-brand-panel {
  background-color: var(--rail-bg);
  color: var(--rail-ink);
}

[data-theme="dark"] .portfolio {
  background-color: var(--surface-soft);
  border-right-color: var(--line-strong);
}

[data-theme="dark"] .project-rail-head,
[data-theme="dark"] .state-counts,
[data-theme="dark"] .project-list {
  background: transparent;
  color: var(--ink);
}

[data-theme="dark"] .project-tabs {
  background: transparent;
  border-color: var(--line-strong);
}

[data-theme="dark"] .project-tabs button {
  color: var(--muted);
}

[data-theme="dark"] .project-tabs button:hover {
  background: var(--panel-bg-muted);
  border-color: var(--line);
  color: var(--ink);
}

[data-theme="dark"] .project-tabs button.active {
  background: var(--surface-raised);
  border-color: var(--accent);
  color: var(--accent-ink);
}

[data-theme="dark"] .project-search,
[data-theme="dark"] .portfolio .project-list {
  background: var(--surface-raised);
  border-color: var(--line-strong);
  color: var(--ink);
}

[data-theme="dark"] .project-search input,
[data-theme="dark"] .portfolio .project-row {
  background: var(--surface-soft);
  border-color: var(--line);
  color: var(--ink);
}

[data-theme="dark"] .state-counts div {
  color: var(--muted);
}

[data-theme="dark"] .state-counts strong,
[data-theme="dark"] .project-main strong {
  color: var(--ink);
}

[data-theme="dark"] .rail-button,
[data-theme="dark"] .project-row,
[data-theme="dark"] .system-tabs button,
[data-theme="dark"] .profile-menu-item {
  color: var(--ink);
}

[data-theme="dark"] .rail-button:hover,
[data-theme="dark"] .rail-button.active,
[data-theme="dark"] .project-row.selected,
[data-theme="dark"] .system-tabs button.active,
[data-theme="dark"] .data-row:hover,
[data-theme="dark"] .queue-table-row:hover {
  background-color: var(--surface-selected);
  border-color: var(--accent);
  color: var(--accent-ink);
}

[data-theme="dark"] .assistant-pane,
[data-theme="dark"] .assistant-peek,
[data-theme="dark"] .profile-popover,
[data-theme="dark"] .metric-lightbox-card,
[data-theme="dark"] .artifact-lightbox-card,
[data-theme="dark"] .about-lightbox-card {
  background-color: var(--surface-raised);
  border-color: var(--line);
  color: var(--ink);
  box-shadow: var(--shadow-strong);
}

[data-theme="dark"] .assistant-header,
[data-theme="dark"] .activity-pane .pane-title,
[data-theme="dark"] .gateway-card .pane-title,
[data-theme="dark"] .feed-head,
[data-theme="dark"] .integration-detail-head,
[data-theme="dark"] .integration-config > .settings-section > h4,
[data-theme="dark"] .project-detail-head,
[data-theme="dark"] .story-sprint-head,
[data-theme="dark"] .story-sprint-table-head {
  background: var(--titlebar);
  border-color: var(--line-strong);
  color: var(--ink);
}

[data-theme="dark"] .assistant-intro,
[data-theme="dark"] .assistant-actions,
[data-theme="dark"] .chat-message.assistant,
[data-theme="dark"] .message.assistant,
[data-theme="dark"] .message-body code,
[data-theme="dark"] .chat-log,
[data-theme="dark"] .composer,
[data-theme="dark"] .activity-stream,
[data-theme="dark"] .activity-table,
[data-theme="dark"] .validation-panel,
[data-theme="dark"] .empty,
[data-theme="dark"] .summary-grid,
[data-theme="dark"] .admin-summary-grid button,
[data-theme="dark"] .integration-foundation-row,
[data-theme="dark"] .requirements-doc-row,
[data-theme="dark"] .requirements-pco-row,
[data-theme="dark"] .comment,
[data-theme="dark"] .check-row,
[data-theme="dark"] .theme-option,
[data-theme="dark"] .support-progress-row {
  background-color: var(--surface);
  border-color: var(--line);
  color: var(--ink);
}

[data-theme="dark"] .mapping-table .check-row.compact {
  background: transparent;
  border-color: transparent;
  color: var(--ink);
}

[data-theme="dark"] .mapping-table .check-row.compact:has(input:checked) {
  background: color-mix(in srgb, var(--accent-soft) 52%, transparent);
  border-color: color-mix(in srgb, var(--accent) 42%, transparent);
  color: var(--ink);
}

[data-theme="dark"] .mapping-table .check-row.compact:hover {
  background: color-mix(in srgb, var(--surface-muted) 48%, transparent);
  border-color: var(--line);
}

[data-theme="dark"] p,
[data-theme="dark"] small,
[data-theme="dark"] .helper,
[data-theme="dark"] .eyebrow,
[data-theme="dark"] .activity-table span,
[data-theme="dark"] .state-counts span,
[data-theme="dark"] .manager-picker small,
[data-theme="dark"] .theme-option small {
  color: var(--muted);
}

[data-theme="dark"] h1,
[data-theme="dark"] h2,
[data-theme="dark"] h3,
[data-theme="dark"] h4,
[data-theme="dark"] strong,
[data-theme="dark"] .data-head,
[data-theme="dark"] .project-title,
[data-theme="dark"] .story-title {
  color: var(--ink);
}

[data-theme="dark"] label,
[data-theme="dark"] .form-label,
[data-theme="dark"] .auth-form label,
[data-theme="dark"] .manager-picker strong,
[data-theme="dark"] .authorization-message strong {
  color: var(--ink);
}

[data-theme="dark"] :where(button, .button-link, input, select, textarea) {
  background-color: var(--field);
  border-color: var(--line);
  color: var(--ink);
}

[data-theme="dark"] input::placeholder,
[data-theme="dark"] textarea::placeholder {
  color: var(--placeholder);
}

[data-theme="dark"] input:focus,
[data-theme="dark"] select:focus,
[data-theme="dark"] textarea:focus,
[data-theme="dark"] .auth-form input:focus,
[data-theme="dark"] .auth-form select:focus {
  outline: 2px solid rgba(155, 189, 242, .24);
  border-color: var(--accent);
}

[data-theme="dark"] button.primary,
[data-theme="dark"] .button-link.primary,
[data-theme="midnight-pastel"] button.primary,
[data-theme="midnight-pastel"] .button-link.primary {
  background-color: var(--accent);
  border-color: var(--accent);
  color: #102033;
}

[data-theme="dark"] button.ghost {
  background-color: color-mix(in srgb, var(--panel-bg) 06%, transparent);
  border-color: var(--line);
  color: var(--ink);
}

[data-theme="dark"] .project-state-pill.planning,
[data-theme="dark"] .project-state-pill.in-progress,
[data-theme="dark"] .badge.neutral,
[data-theme="dark"] .llm-status,
[data-theme="dark"] .count,
[data-theme="dark"] .integration-status-pill.neutral,
[data-theme="dark"] .integration-tile em.neutral,
[data-theme="dark"] .integration-status-pill.not-installed,
[data-theme="dark"] .integration-tile em.not-installed,
[data-theme="dark"] .integration-surface-row span {
  background-color: var(--surface-selected);
  border-color: var(--line-strong);
  color: var(--ink);
}

[data-theme="dark"] .assistant-bubbles button {
  background-color: var(--surface-selected);
  border-color: color-mix(in srgb, var(--accent) 58%, var(--line));
  color: var(--accent-ink);
}

[data-theme="dark"] .project-state-pill.development,
[data-theme="dark"] .badge.ok,
[data-theme="dark"] .llm-status.ok {
  background-color: var(--green-soft);
  border-color: #28543a;
  color: var(--green);
}

[data-theme="dark"] .project-state-pill.requirements,
[data-theme="dark"] .project-state-pill.requirements-gathering,
[data-theme="dark"] .badge.warn {
  background-color: var(--orange-soft);
  border-color: #6a4b22;
  color: var(--orange);
}

[data-theme="dark"] .project-state-pill.released {
  background-color: var(--purple-soft);
  border-color: #4f4278;
  color: var(--purple);
}

[data-theme="dark"] .project-state-pill.action-required,
[data-theme="dark"] .badge.danger,
[data-theme="dark"] button.danger {
  background-color: var(--danger-soft);
  border-color: #6c3434;
  color: var(--danger);
}

[data-theme="dark"] .system-metric-card,
[data-theme="dark"] .admin-summary-grid button,
[data-theme="dark"] .admin-detail-grid div,
[data-theme="dark"] .admin-project-table button.data-row,
[data-theme="dark"] .activity-pane,
[data-theme="dark"] .gateway-card,
[data-theme="dark"] .activity-table,
[data-theme="dark"] .activity-table div,
[data-theme="dark"] .integration-icons,
[data-theme="dark"] .integration-search-row,
[data-theme="dark"] .integration-detail,
[data-theme="dark"] .integration-fields,
[data-theme="dark"] .integration-tool-router,
[data-theme="dark"] .integration-config-summary,
[data-theme="dark"] .integration-test-credentials,
[data-theme="dark"] .integration-placeholder,
[data-theme="dark"] .foundation-row,
[data-theme="dark"] .audit-mini-log,
[data-theme="dark"] .api-key-form,
[data-theme="dark"] .api-key-row,
[data-theme="dark"] .queue-group,
[data-theme="dark"] .queue-table-row,
[data-theme="dark"] .queue-row,
[data-theme="dark"] .queue-group h3,
[data-theme="dark"] .requirements-hero,
[data-theme="dark"] .requirements-card,
[data-theme="dark"] .requirements-story-detail-head,
[data-theme="dark"] .requirements-doc-row,
[data-theme="dark"] .requirements-info-summary,
[data-theme="dark"] .requirements-info-list button,
[data-theme="dark"] .requirements-source-row,
[data-theme="dark"] .requirements-pco-row,
[data-theme="dark"] .requirements-workflow-active,
[data-theme="dark"] .requirements-impact-summary,
[data-theme="dark"] .requirements-mini-list,
[data-theme="dark"] .support-card,
[data-theme="dark"] .support-bundle-row,
[data-theme="dark"] .support-list-card,
[data-theme="dark"] .system-performance-panel,
[data-theme="dark"] .performance-row,
[data-theme="dark"] .metric-card,
[data-theme="dark"] .metric-panel,
[data-theme="dark"] .signal-row,
[data-theme="dark"] .blocker-row,
[data-theme="dark"] .point-load-row,
[data-theme="dark"] .metric-sheet-wrap,
[data-theme="dark"] .metric-sheet tbody th,
[data-theme="dark"] .about-facts-grid div,
[data-theme="dark"] .about-notices-box,
[data-theme="dark"] .artifact-preview-pane,
[data-theme="dark"] .efficiency-narrative,
[data-theme="dark"] .story-assignment-bar {
  background: var(--surface-raised);
  border-color: var(--line);
  color: var(--ink);
}

[data-theme="dark"] .integration-config,
[data-theme="dark"] .integration-config > .settings-section,
[data-theme="dark"] .integration-config > .integration-fields,
[data-theme="dark"] .project-lifecycle-card,
[data-theme="dark"] .main-activity-feed,
[data-theme="dark"] .activity-textbox,
[data-theme="dark"] .issue-table,
[data-theme="dark"] .issue-row,
[data-theme="dark"] .kanban-head,
[data-theme="dark"] .kanban-summary span,
[data-theme="dark"] .kanban-card,
[data-theme="dark"] .kanban-board,
[data-theme="dark"] .kanban-column,
[data-theme="dark"] .kanban-column-head,
[data-theme="dark"] .kanban-column-body,
[data-theme="dark"] .kanban-story button,
[data-theme="dark"] .what-if-impact,
[data-theme="dark"] .what-if-sprint-row,
[data-theme="dark"] .what-if-option,
[data-theme="dark"] .what-if-draft-change,
[data-theme="dark"] .story-row,
[data-theme="dark"] .story-label-grid,
[data-theme="dark"] .manual-story-card,
[data-theme="dark"] .story-label-panel,
[data-theme="dark"] .sprint-planner-card,
[data-theme="dark"] .sprint-gantt,
[data-theme="dark"] .sprint-gantt-label,
[data-theme="dark"] .sprint-gantt-track,
[data-theme="dark"] .artifact-summary-card,
[data-theme="dark"] .artifact-declare-card,
[data-theme="dark"] .artifact-registry,
[data-theme="dark"] .artifact-filter-bar,
[data-theme="dark"] .artifact-table {
  background: var(--surface-raised);
  border-color: var(--line-strong);
  color: var(--ink);
}

[data-theme="dark"] .git-overview-card,
[data-theme="dark"] .git-story-card,
[data-theme="dark"] .story-git-card {
  background: var(--surface-raised);
  border-color: var(--line-strong);
  color: var(--ink);
}

[data-theme="dark"] .git-story-list,
[data-theme="dark"] .git-lifecycle,
[data-theme="dark"] .git-story-card dl div,
[data-theme="dark"] .story-git-card dl div {
  background: var(--surface-soft);
  border-color: var(--line-strong);
  color: var(--ink);
}

[data-theme="dark"] .git-overview-card > div:first-child,
[data-theme="dark"] .git-story-head {
  background: var(--titlebar);
  border-color: var(--line-strong);
  color: var(--ink);
}

[data-theme="dark"] .git-stage span {
  background: var(--surface-raised);
  border-color: var(--line-strong);
  color: var(--muted);
}

[data-theme="dark"] .git-stage.done span {
  background: color-mix(in srgb, var(--green-soft) 72%, var(--surface-raised));
  border-color: color-mix(in srgb, var(--green) 58%, var(--line-strong));
  color: var(--green);
}

[data-theme="dark"] .git-stage.active {
  color: var(--accent-ink);
}

[data-theme="dark"] .git-stage.active span {
  background: color-mix(in srgb, var(--accent-soft) 72%, var(--surface-raised));
  border-color: color-mix(in srgb, var(--accent) 62%, var(--line-strong));
  color: var(--accent-ink);
}

[data-theme="dark"] .git-flow-arrow {
  background: var(--line-strong);
}

[data-theme="dark"] .git-flow-arrow::after {
  border-color: var(--line-strong);
}

[data-theme="dark"] .kanban-viewport {
  background: var(--surface-soft);
}

[data-theme="dark"] .kanban-board,
[data-theme="dark"] .kanban-column,
[data-theme="dark"] .kanban-column-body,
[data-theme="dark"] .what-if-impact,
[data-theme="dark"] .what-if-sprint-row,
[data-theme="dark"] .what-if-option-grid div {
  background: var(--surface-soft);
  border-color: var(--line-strong);
  color: var(--ink);
}

[data-theme="dark"] .kanban-empty {
  background: var(--surface-raised);
  border-color: var(--line-strong);
  color: var(--muted);
}

[data-theme="dark"] .kanban-head,
[data-theme="dark"] .kanban-column-head,
[data-theme="dark"] .sprint-planner-head,
[data-theme="dark"] .artifact-declare-head,
[data-theme="dark"] .what-if-page .metric-panel-head,
[data-theme="dark"] .requirements-card .metric-panel-head {
  background: var(--titlebar);
  border-color: var(--line-strong);
  color: var(--ink);
}

[data-theme="dark"] .kanban-column-head b,
[data-theme="dark"] .kanban-story-progress,
[data-theme="dark"] .sprint-gantt-bar,
[data-theme="dark"] .what-if-impact-head span,
[data-theme="dark"] .what-if-draft-meta span,
[data-theme="dark"] .what-if-examples button {
  background: var(--chip-muted);
  border-color: var(--line);
  color: var(--ink);
}

[data-theme="dark"] .sprint-gantt,
[data-theme="dark"] .sprint-gantt-track {
  background: var(--surface-soft);
  border-color: var(--line-strong);
}

[data-theme="dark"] .sprint-gantt-label {
  background: var(--surface-raised);
  border-color: var(--line);
}

[data-theme="dark"] .sprint-gantt-axis {
  border-color: var(--line-strong);
  color: var(--muted);
}

[data-theme="dark"] .sprint-gantt-bar {
  background: color-mix(in srgb, var(--accent-soft) 74%, var(--surface-raised));
  border-color: color-mix(in srgb, var(--accent) 58%, var(--line-strong));
  color: var(--accent-ink);
}

[data-theme="dark"] .sprint-gantt-bar:hover {
  background: var(--surface-selected);
  border-color: var(--accent);
}

[data-theme="dark"] .kanban-story button:hover {
  background: var(--surface-selected);
  border-color: var(--accent);
}

[data-theme="dark"] .kanban-blockers em {
  background: var(--orange-soft);
  border-color: color-mix(in srgb, var(--orange) 58%, var(--line-strong));
  color: var(--orange);
}

[data-theme="dark"] .what-if-story-picker,
[data-theme="dark"] .requirements-info-summary,
[data-theme="dark"] .requirements-info-list button {
  background: var(--surface-muted);
  border-color: var(--line);
  color: var(--ink);
}

[data-theme="dark"] .story-row:hover,
[data-theme="dark"] .project-row:hover {
  background: var(--surface-selected);
  border-color: var(--accent);
}

[data-theme="dark"] .project-stage {
  background: rgba(34, 49, 73, .34);
}

[data-theme="dark"] .project-stage span {
  background: var(--surface-muted);
  border-color: var(--line-strong);
  color: var(--muted);
}

[data-theme="dark"] .project-stage.active {
  background: rgba(38, 59, 89, .48);
}

[data-theme="dark"] .issue-head {
  background: var(--titlebar);
  border-color: var(--line-strong);
  color: var(--muted);
}

[data-theme="dark"] .issue-link-chip {
  background: var(--surface-selected);
  border-color: var(--line-strong);
  color: var(--ink);
}

[data-theme="dark"] .project-flow-arrow {
  background: var(--line-strong);
}

[data-theme="dark"] .project-flow-arrow::after {
  border-color: var(--line-strong);
}

[data-theme="dark"] .integration-tile,
[data-theme="dark"] .integration-tool-card,
[data-theme="dark"] .integration-class-list b,
[data-theme="dark"] .integration-surface-row span,
[data-theme="dark"] .integration-tool-schema span,
[data-theme="dark"] .requirements-info-facts span,
[data-theme="dark"] .requirements-source-icon,
[data-theme="dark"] .comment-intent-marker {
  background: var(--surface-muted);
  border-color: var(--line);
  color: var(--ink);
}

[data-theme="dark"] .integration-tile.not-configured {
  background: var(--surface-soft);
}

[data-theme="dark"] .integration-tile.not-installed {
  background: var(--not-installed-bg);
  border-color: var(--not-installed-border);
}

[data-theme="dark"] .integration-tile.enabled,
[data-theme="dark"] .integration-runtime-summary,
[data-theme="dark"] .requirements-source-row.context,
[data-theme="dark"] .requirements-source-row.document,
[data-theme="dark"] .requirements-source-row.approved {
  background: var(--green-soft);
  border-color: color-mix(in srgb, var(--green) 52%, var(--line));
}

[data-theme="dark"] .integration-emery-hook,
[data-theme="dark"] .requirements-doc-row.active,
[data-theme="dark"] .requirements-doc-open.selected,
[data-theme="dark"] .requirement-comment-row.selected,
[data-theme="dark"] .requirements-pco-row.active {
  background: var(--surface-selected);
  border-color: var(--accent);
}

[data-theme="dark"] .requirements-source-row.draft {
  background: var(--orange-soft);
  border-color: color-mix(in srgb, var(--orange) 52%, var(--line));
}

[data-theme="dark"] .requirements-source-row.pco {
  background: var(--purple-soft);
  border-color: color-mix(in srgb, var(--purple) 52%, var(--line));
}

[data-theme="dark"] .support-card-strong,
[data-theme="dark"] .support-progress-panel,
[data-theme="dark"] .metric-sheet td.active {
  background: var(--surface-selected);
  border-color: var(--line-strong);
  color: var(--ink);
}

[data-theme="dark"] .support-bundle-row:hover,
[data-theme="dark"] .support-bundle-row:focus-within {
  background: var(--surface-selected);
  border-color: var(--accent);
}

[data-theme="dark"] .support-progress-list,
[data-theme="dark"] .about-notices-box,
[data-theme="dark"] .artifact-preview-text,
[data-theme="dark"] .activity-table p,
[data-theme="dark"] .performance-row span,
[data-theme="dark"] .integration-detail-head h3,
[data-theme="dark"] .integration-tool-head strong,
[data-theme="dark"] .integration-tool-card strong,
[data-theme="dark"] .integration-config-summary span,
[data-theme="dark"] .foundation-row strong,
[data-theme="dark"] .foundation-row b,
[data-theme="dark"] .audit-mini-log p,
[data-theme="dark"] .requirements-info-summary p,
[data-theme="dark"] .intent-review-toolbar span,
[data-theme="dark"] .intent-review-toolbar strong,
[data-theme="dark"] .what-if-intent ul,
[data-theme="dark"] .what-if-narrative p,
[data-theme="dark"] .what-if-draft > p,
[data-theme="dark"] .efficiency-narrative span,
[data-theme="dark"] .metric-sheet,
[data-theme="dark"] .system-log-textarea {
  color: var(--ink);
}

[data-theme="dark"] .integration-search-row label,
[data-theme="dark"] .integration-search-row p,
[data-theme="dark"] .integration-group h3,
[data-theme="dark"] .integration-vendor,
[data-theme="dark"] .integration-tile small,
[data-theme="dark"] .integration-class-list b,
[data-theme="dark"] .integration-detail-head p:not(.eyebrow),
[data-theme="dark"] .integration-status-row span:last-child,
[data-theme="dark"] .integration-placeholder p,
[data-theme="dark"] .integration-surface-row span,
[data-theme="dark"] .integration-runtime-summary span,
[data-theme="dark"] .integration-tool-head p,
[data-theme="dark"] .integration-tool-card p,
[data-theme="dark"] .integration-tool-card small,
[data-theme="dark"] .integration-emery-hook ul,
[data-theme="dark"] .integration-test-credentials p,
[data-theme="dark"] .integration-config-summary b,
[data-theme="dark"] .foundation-row span,
[data-theme="dark"] .foundation-row small,
[data-theme="dark"] .foundation-row p,
[data-theme="dark"] .requirements-info-list h4,
[data-theme="dark"] .requirements-info-list p,
[data-theme="dark"] .requirements-source-row small,
[data-theme="dark"] .requirements-source-row p,
[data-theme="dark"] .requirements-pco-row span {
  color: var(--muted);
}

[data-theme="dark"] .metric-sheet thead th {
  background: var(--surface-muted);
  color: var(--ink);
}

[data-theme="dark"] .developer-load-track {
  background: var(--field);
  border-color: var(--line);
}

[data-theme="dark"] .developer-load-track span {
  background: var(--chart-primary);
}

[data-theme="dark"] .system-tabs button.active,
[data-theme="dark"] .support-progress-list li:last-child,
[data-theme="dark"] .efficiency-narrative strong {
  color: var(--accent-ink);
}

[data-theme="dark"] .metric-lightbox,
[data-theme="dark"] .artifact-lightbox,
[data-theme="dark"] .about-lightbox {
  background: rgba(3, 8, 15, .66);
}

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

/* Theme contract layer
   New screens should prefer these semantic surfaces over raw palette variables. */
.theme-surface-page {
  background: var(--pane-bg);
  color: var(--text-primary);
}

.theme-surface-pane,
.theme-surface-card,
.theme-surface-subcard,
.theme-surface-row,
.theme-surface-header,
.theme-surface-chip,
.theme-surface-log,
.theme-surface-callout,
.theme-field,
.theme-action {
  color: var(--text-primary);
}

.theme-surface-pane {
  border: 1px solid var(--border-strong);
  background: var(--panel-bg);
}

.theme-surface-card {
  border: 1px solid var(--border-soft);
  background: var(--panel-bg);
}

.theme-surface-subcard {
  border: 1px solid var(--border-soft);
  background: var(--panel-bg-subtle);
}

.theme-surface-row {
  border: 1px solid var(--border-soft);
  background: var(--row-bg);
}

.theme-surface-header {
  border-bottom: 1px solid var(--border-strong);
  background: var(--panel-header-bg);
}

.theme-surface-chip {
  border: 1px solid var(--border-soft);
  background: var(--chip-bg);
  color: var(--text-secondary);
}

.theme-surface-chip.is-active,
.theme-surface-chip[aria-pressed="true"],
.theme-surface-chip[aria-selected="true"] {
  border-color: var(--accent);
  background: var(--row-bg-selected);
  color: var(--accent-ink);
}

.theme-surface-callout {
  border: 1px solid var(--border-soft);
  background: var(--accent-soft);
}

.theme-surface-log {
  border: 1px solid var(--terminal-border);
  background: var(--terminal-bg);
  color: var(--terminal-fg);
}

.theme-field {
  border: 1px solid var(--border-soft);
  background: var(--field-bg);
  color: var(--text-primary);
}

.theme-field::placeholder {
  color: var(--placeholder);
}

.theme-action {
  border: 1px solid var(--button-border);
  background: var(--button-bg);
  color: var(--button-fg);
}

.theme-action:hover,
.theme-action:focus-visible {
  background: var(--button-hover-bg);
  border-color: var(--button-hover-border);
  color: var(--button-hover-fg);
}

.theme-action.primary {
  border-color: var(--accent);
  background: var(--accent);
  color: var(--surface);
}

.theme-action.primary:hover,
.theme-action.primary:focus-visible {
  background: var(--accent-ink);
  border-color: var(--accent-ink);
}

.theme-action.danger {
  border-color: var(--danger);
  background: var(--danger);
  color: var(--surface);
}

.theme-action.danger:hover,
.theme-action.danger:focus-visible {
  background: var(--status-danger-fg);
  border-color: var(--status-danger-fg);
}

.theme-text-primary {
  color: var(--text-primary);
}

.theme-text-secondary,
.theme-text-muted {
  color: var(--text-secondary);
}

.theme-text-accent {
  color: var(--accent-ink);
}

.theme-status-success {
  border-color: var(--status-ok-border);
  background: var(--status-ok-bg);
  color: var(--status-ok-fg);
}

.theme-status-warning {
  border-color: var(--status-warn-border);
  background: var(--status-warn-bg);
  color: var(--status-warn-fg);
}

.theme-status-danger {
  border-color: var(--status-danger-border);
  background: var(--status-danger-bg);
  color: var(--status-danger-fg);
}

.theme-status-info {
  border-color: var(--status-neutral-border);
  background: var(--status-neutral-bg);
  color: var(--status-neutral-fg);
}

.theme-meter {
  background: var(--panel-bg-muted);
}

.theme-meter-fill {
  background: var(--accent);
}

body,
.workspace,
.mission,
.main-panel-stack,
.workspace-tab-panel,
.portfolio {
  background-color: var(--pane-bg);
  color: var(--text-primary);
}

.pane,
.assistant-pane,
.activity-pane,
.gateway-card,
.settings-section,
.operation-drawer,
.support-card,
.metric-card,
.metric-panel,
.executive-kpis > div,
.executive-panel,
.system-metric-card,
.readiness-card,
.story-detail-card,
.story-card,
.artifact-summary-card,
.artifact-declare-card,
.artifact-registry,
.integration-detail,
.integration-config,
.integration-fields,
.project-lifecycle-card,
.queue-group,
.kanban-card,
.what-if-impact,
.what-if-option,
.what-if-draft-change,
.sprint-planner-card,
.story-git-card,
.git-story-card,
.git-overview-card {
  background-color: var(--panel-bg);
  border-color: var(--border-soft);
  color: var(--text-primary);
}

.main-activity-feed,
.project-search,
.portfolio .project-list,
.data-table,
.story-table,
.issue-table,
.artifact-table,
.kanban-board,
.kanban-column,
.sprint-gantt,
.git-story-list,
.git-lifecycle,
.requirements-workbench,
.requirements-card,
.support-progress-list,
.system-performance-panel {
  background-color: var(--panel-bg-subtle);
  border-color: var(--border-strong);
  color: var(--text-primary);
}

.main-activity-feed {
  margin: 0;
  border: 0;
  border-top: 1px solid var(--border-strong);
  border-radius: 0;
  background-color: var(--panel-bg);
}

.pane-title,
.feed-head,
.assistant-header,
.metric-panel-head,
.data-head,
.queue-group h3,
.kanban-head,
.kanban-column-head,
.sprint-planner-head,
.artifact-declare-head,
.git-story-head,
.git-overview-card > div:first-child,
.story-sprint-head,
.story-sprint-table-head,
.story-assignment-bar,
.integration-detail-head,
.integration-config > .settings-section > h4,
.project-detail-head,
.executive-panel .metric-panel-head {
  background-color: var(--panel-header-bg);
  border-color: var(--border-strong);
  color: var(--text-primary);
}

.data-row,
.queue-table-row,
.queue-row,
.story-row,
.issue-row,
.kanban-story button,
.support-bundle-row,
.a2a-agent-form,
.a2a-agent-row,
.requirements-doc-row,
.requirements-source-row,
.requirements-pco-row,
.requirements-info-summary,
.requirements-info-list button,
.git-story-card dl div,
.story-git-card dl div,
.performance-row,
.signal-row,
.blocker-row,
.point-load-row,
.activity-table div,
.foundation-row,
.api-key-row,
.executive-project-list article,
.executive-risk-list article,
.executive-forecast-list article,
.executive-question-list article,
.executive-recommendation-list article,
.executive-transparency-grid article {
  background-color: var(--row-bg);
  border-color: var(--border-soft);
  color: var(--text-primary);
}

.data-row:hover,
.queue-table-row:hover,
.queue-row:hover,
.story-row:hover,
.issue-row:hover,
.project-row:hover,
.kanban-story button:hover,
.support-bundle-row:hover,
.support-bundle-row:focus-within {
  background-color: var(--row-bg-hover);
  border-color: var(--border-strong);
}

.data-table > .data-row.data-head,
.data-table > .table-row.head {
  min-height: 36px;
  background-color: var(--panel-header-bg);
  border-color: var(--border-strong);
  color: var(--text-secondary);
  font-size: 10px;
  font-weight: 850;
  letter-spacing: .035em;
  text-transform: uppercase;
}

.data-table > .data-row.data-head:hover,
.data-table > .table-row.head:hover {
  background-color: var(--panel-header-bg);
}

.mapping-role-head,
.story-sprint-table-head {
  background-color: var(--panel-header-bg);
  border-color: var(--border-strong);
  color: var(--text-secondary);
  font-size: 10px;
  font-weight: 850;
  letter-spacing: .035em;
  text-transform: uppercase;
}

.kanban-story button {
  border-color: color-mix(in srgb, var(--accent) 42%, var(--border-soft));
  background: color-mix(in srgb, var(--accent-soft) 58%, var(--row-bg));
  box-shadow:
    inset 3px 0 0 color-mix(in srgb, var(--accent) 76%, var(--border-strong)),
    0 2px 7px color-mix(in srgb, var(--rail-bg) 07%, transparent);
}

.kanban-story button:hover,
.kanban-story button:focus-visible {
  border-color: color-mix(in srgb, var(--accent) 74%, var(--border-strong));
  background: color-mix(in srgb, var(--accent-soft) 78%, var(--row-bg-hover));
  box-shadow:
    inset 3px 0 0 var(--accent),
    0 7px 18px color-mix(in srgb, var(--rail-bg) 12%, transparent);
}

.kanban-story-key {
  color: var(--accent-ink);
}

.kanban-story-points,
.kanban-mini-flags em {
  border-color: color-mix(in srgb, var(--accent) 34%, var(--border-soft));
  background: color-mix(in srgb, var(--accent-soft) 70%, var(--chip-bg));
  color: var(--accent-ink);
}

.project-row.selected,
.system-tabs button.active,
.project-tabs button.active,
.requirements-doc-open.selected,
.requirement-comment-row.selected,
.requirements-pco-row.active,
.integration-emery-hook,
.metric-sheet td.active {
  background-color: var(--row-bg-selected);
  border-color: var(--accent);
  color: var(--accent-ink);
}

.project-tabs,
.system-tabs {
  min-height: 31px;
  background-color: transparent;
  border: 0;
  align-items: flex-end;
  overflow-x: auto;
  overflow-y: visible;
}

.project-tabs button,
.system-tabs button {
  background-color: transparent;
  border-color: transparent;
  color: var(--text-secondary);
}

.project-tabs button:hover,
.system-tabs button:hover {
  background-color: var(--panel-bg-muted);
  border-color: var(--border-soft);
  color: var(--text-primary);
}

.project-tabs button.active,
.system-tabs button.active {
  position: relative;
  z-index: 1;
  margin-bottom: -1px;
  background-color: var(--pane-bg);
  border-color: var(--accent);
  border-bottom-color: var(--pane-bg);
  color: var(--accent-ink);
  box-shadow: inset 0 2px 0 var(--accent);
}

:where(button, .button-link, input, select, textarea) {
  background-color: var(--field-bg);
  border-color: var(--border-soft);
  color: var(--text-primary);
}

input::placeholder,
textarea::placeholder {
  color: var(--placeholder);
}

.project-state-pill,
.badge,
.count,
.llm-status,
.sync-badge,
.integration-status-pill {
  background-color: var(--chip-bg);
  border-color: var(--border-soft);
}

.check-row {
  color: var(--text-primary);
}

.mapping-table .check-row.compact,
.mapping-table .check-row.compact:has(input:checked),
.mapping-table .check-row.compact:hover {
  background: transparent !important;
  background-color: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

.theme-qa {
  display: grid;
  gap: 12px;
}

.theme-qa-toolbar {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(190px, 240px);
  gap: 8px 14px;
  align-items: end;
}

.theme-qa-toolbar label {
  display: grid;
  gap: 4px;
  width: min(100%, 280px);
  margin: 0;
  font-size: 11px;
  font-weight: 800;
  color: var(--text-secondary);
}

.theme-qa-toolbar select {
  width: 100%;
  min-width: 0;
}

.theme-qa-toolbar small {
  grid-column: 2;
  color: var(--text-secondary);
  font-size: 11px;
  line-height: 1.35;
}

.theme-qa-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 10px;
}

.theme-qa-card {
  display: grid;
  gap: 8px;
  padding: 10px;
  border: 1px solid var(--border-soft);
  border-radius: 8px;
  background: var(--panel-bg);
}

.theme-qa-card h3 {
  margin: -10px -10px 0;
  padding: 8px 10px;
  border-bottom: 1px solid var(--border-strong);
  border-radius: 8px 8px 0 0;
  background: var(--panel-header-bg);
  font-size: 13px;
}

.theme-qa-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}

.theme-qa-rail {
  width: 74px;
  min-height: 168px;
  display: grid;
  gap: 8px;
  justify-items: center;
  align-content: start;
  padding: 8px;
  border: 1px solid var(--rail-border);
  border-radius: 8px;
  background: var(--rail-bg);
}

.theme-qa-rail .profile-menu {
  justify-self: center;
  align-self: end;
}

.theme-qa-rail .profile-menu summary {
  width: 56px;
  min-height: 44px;
}

.theme-qa-surface {
  min-height: 44px;
  padding: 8px;
  border: 1px solid var(--border-soft);
  border-radius: 7px;
  background: var(--panel-bg-subtle);
  color: var(--text-secondary);
  font-size: 11px;
}

.theme-qa-text-samples {
  display: grid;
  gap: 6px;
  padding: 8px;
  border: 1px solid var(--border-soft);
  border-radius: 7px;
  background: var(--panel-bg-subtle);
  font-size: 12px;
  line-height: 1.35;
}

.theme-qa-text-samples a {
  color: var(--accent-ink);
  font-weight: 800;
}

.theme-text-secondary { color: var(--text-secondary); }
.theme-text-helper { color: var(--placeholder); }
.theme-text-success { color: var(--green); font-weight: 800; }
.theme-text-warning { color: var(--orange); font-weight: 800; }
.theme-text-danger { color: var(--danger); font-weight: 800; }

/* Final tab seam override: active tabs must visually merge into the pane below. */
.project-header.pane:has(.project-tabs) {
  background-color: var(--pane-bg) !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

.project-tabs,
.system-tabs {
  position: relative;
  border-bottom: 0 !important;
}

.project-tabs::before,
.system-tabs::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 0;
  height: 1px;
  background: var(--border-strong);
  pointer-events: none;
}

.project-tabs > button,
.system-tabs > button {
  position: relative;
  z-index: 1;
}

.project-tabs > button.active,
.system-tabs > button.active {
  position: relative !important;
  z-index: 2 !important;
  margin-bottom: -1px !important;
  background-color: var(--panel-bg) !important;
  border-bottom-color: transparent !important;
  box-shadow: inset 0 2px 0 var(--accent) !important;
}

.project-tabs > button.active::after,
.system-tabs > button.active::after {
  content: "";
  position: absolute;
  left: -3px;
  right: -3px;
  bottom: -3px;
  z-index: 3;
  height: 6px;
  background: var(--panel-bg);
  pointer-events: none;
}

/* Rail contract: the vertical persona/navigation rail follows theme-owned tokens. */
.icon-rail {
  background-color: var(--rail-bg) !important;
  border-right-color: var(--rail-border) !important;
  color: var(--rail-ink) !important;
}

.rail-button {
  color: var(--rail-muted) !important;
  background-color: transparent !important;
  border-color: transparent !important;
}

.rail-button:hover {
  background-color: var(--rail-hover-bg) !important;
  border-color: var(--rail-profile-border) !important;
  color: var(--rail-ink) !important;
}

.rail-button.active {
  background-color: var(--rail-active-bg) !important;
  border-color: var(--rail-profile-border) !important;
  color: var(--rail-ink) !important;
  box-shadow: inset 3px 0 0 var(--accent) !important;
}

.rail-button .rail-icon {
  background-color: var(--rail-icon-bg) !important;
  color: var(--rail-icon-ink) !important;
}

.rail-button.active .rail-icon {
  background-color: var(--rail-active-icon-bg) !important;
  color: var(--rail-active-icon-ink) !important;
}

.profile-menu summary {
  background-color: var(--rail-profile-bg) !important;
  border-color: var(--rail-profile-border) !important;
  color: var(--rail-ink) !important;
}

.profile-menu summary span {
  background-color: var(--rail-icon-bg) !important;
  color: var(--rail-icon-ink) !important;
}

html[data-theme] .profile-menu-item.danger {
  background-color: transparent !important;
  border-color: transparent !important;
  color: var(--danger) !important;
}

html[data-theme] .profile-menu-item.danger:hover,
html[data-theme] .profile-menu-item.danger:focus-visible {
  background-color: var(--danger-soft) !important;
  border-color: color-mix(in srgb, var(--danger) 42%, var(--border-soft)) !important;
  color: var(--danger) !important;
}

/* Support keeps the full Admin rail and the project rail, so both widths must be reserved. */
.workspace.support-workspace,
.workspace.support-workspace.assistant-collapsed {
  grid-template-columns: 168px minmax(196px, 230px) minmax(520px, 1fr);
}

/* Management project workspaces: one global rail, one project navigation level. */
.workspace.management-shell {
  grid-template-columns: 168px minmax(680px, 1fr) clamp(268px, 22vw, 324px);
  background: var(--pane-bg);
}

.workspace.management-shell.assistant-collapsed {
  grid-template-columns: 168px minmax(680px, 1fr);
}

.workspace.management-shell .portfolio {
  display: none;
}

.workspace.management-shell .mission {
  grid-column: 2;
  min-width: min(680px, 100%);
  background: var(--pane-bg);
}

.workspace.management-shell .assistant-pane {
  grid-column: 3;
}

.workspace.management-shell .assistant-peek {
  grid-column: 2;
}

.management-rail {
  width: 168px;
  padding: 14px 10px;
}

.management-rail .rail-primary {
  gap: 5px;
}

.management-rail .rail-button {
  width: 148px;
  min-height: 44px;
  grid-template-columns: 28px minmax(0, 1fr);
  justify-content: start;
  place-items: center start;
  gap: 10px;
  padding: 6px 10px;
  border-radius: 8px;
  text-align: left;
}

.management-rail .rail-button .rail-icon {
  width: 26px;
  height: 26px;
}

.management-rail .rail-button small {
  overflow: hidden;
  font-size: 11px;
  font-weight: 750;
  line-height: 1.2;
  white-space: normal;
}

.management-rail .profile-menu {
  width: 148px;
}

.management-rail .profile-menu summary {
  width: 148px;
  min-height: 44px;
  grid-template-columns: 28px minmax(0, 1fr);
  justify-content: start;
  gap: 10px;
  padding: 6px 10px;
}

.management-rail .profile-menu summary::after {
  content: "Profile";
  overflow: hidden;
  color: var(--rail-muted);
  font-size: 11px;
  font-weight: 750;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.management-rail .profile-popover {
  left: calc(100% + 8px);
  right: auto;
  bottom: 0;
}

.em-project-header {
  position: sticky;
  top: 0;
  z-index: 5;
  display: grid;
  grid-template-columns: minmax(230px, 320px) minmax(0, 1fr);
  align-items: end;
  gap: 12px 20px;
  min-height: 70px;
  padding: 10px 20px 0;
  border-bottom: 1px solid var(--border-strong);
  background: var(--panel-bg);
}

.em-project-context {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 3px 8px;
  min-width: 0;
  padding-bottom: 10px;
}

.em-project-context label {
  grid-column: 1 / -1;
  color: var(--text-secondary);
  font-size: 9px;
  font-weight: 850;
  letter-spacing: .05em;
  text-transform: uppercase;
}

.em-project-context select {
  width: 100%;
  min-height: 32px;
  overflow: hidden;
  border-color: var(--border-strong);
  background: var(--field-bg);
  color: var(--text-primary);
  font-size: 13px;
  font-weight: 800;
  text-overflow: ellipsis;
}

.em-project-tabs {
  display: flex;
  align-items: flex-end;
  gap: 2px;
  min-width: 0;
  overflow: auto hidden;
}

.em-project-tabs button {
  position: relative;
  flex: 0 0 auto;
  min-height: 38px;
  padding: 0 10px;
  border: 0;
  border-radius: 6px 6px 0 0;
  background: transparent;
  color: var(--text-secondary);
  font-size: 11px;
  font-weight: 750;
  white-space: nowrap;
}

.em-project-tabs button:hover,
.em-project-tabs button:focus-visible {
  background: var(--button-hover-bg);
  color: var(--text-primary);
}

.em-project-tabs button.active {
  color: var(--accent-ink);
  background: var(--panel-bg-subtle);
}

.em-project-tabs button.active::after {
  content: "";
  position: absolute;
  right: 8px;
  bottom: 0;
  left: 8px;
  height: 3px;
  border-radius: 3px 3px 0 0;
  background: var(--accent);
}

.em-project-tabs button.unavailable,
.em-project-tabs button.unavailable:hover {
  background: transparent;
  color: var(--text-secondary);
  cursor: not-allowed;
  opacity: .55;
}

.em-overview-card.unavailable {
  opacity: .72;
}

.em-overview-card.unavailable .em-delivery-bar,
.em-overview-card.unavailable .em-delivery-legend {
  filter: grayscale(.75);
}

.em-project-content {
  min-width: 0;
  padding: 18px 20px var(--workspace-end-space);
}

.em-project-content > .pane.artifact-pane {
  margin: 0;
}

.em-overview {
  display: grid;
  gap: 14px;
  max-width: 1240px;
  margin: 0 auto;
}

.em-overview .pane {
  margin: 0;
  border-color: var(--border-soft);
  border-radius: 10px;
  box-shadow: var(--shadow-card);
}

.em-overview-summary {
  display: grid;
  grid-template-columns: minmax(240px, .85fr) minmax(430px, 1.5fr);
  align-items: center;
  gap: 24px;
  padding: 18px 20px;
}

.em-overview-summary .eyebrow,
.em-card-heading .eyebrow {
  margin: 0 0 4px;
}

.em-overview-title-row {
  display: flex;
  align-items: center;
  gap: 9px;
  flex-wrap: wrap;
}

.em-overview-title-row h1 {
  margin: 0;
  font-size: 22px;
}

.em-overview-summary > div > p:last-child {
  max-width: 58ch;
  margin: 5px 0 0;
  color: var(--text-secondary);
  line-height: 1.5;
}

.em-lifecycle {
  display: grid;
  grid-template-columns: repeat(4, minmax(78px, 1fr));
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
}

.em-lifecycle li {
  position: relative;
  display: grid;
  justify-items: center;
  gap: 6px;
  color: var(--placeholder);
  text-align: center;
}

.em-lifecycle li:not(:last-child)::after {
  content: "";
  position: absolute;
  top: 14px;
  left: calc(50% + 18px);
  width: calc(100% - 36px);
  height: 2px;
  background: var(--border-strong);
}

.em-lifecycle li.done:not(:last-child)::after {
  background: var(--green);
}

.em-lifecycle li span {
  position: relative;
  z-index: 1;
  width: 29px;
  height: 29px;
  display: grid;
  place-items: center;
  border: 2px solid var(--border-strong);
  border-radius: 50%;
  background: var(--panel-bg);
  font-size: 11px;
  font-weight: 850;
}

.em-lifecycle li.done {
  color: var(--green);
}

.em-lifecycle li.done span {
  border-color: var(--green);
  background: var(--green-soft);
}

.em-lifecycle li.current {
  color: var(--accent-ink);
}

.em-lifecycle li.current span {
  border-color: var(--accent);
  background: var(--accent-soft);
}

.em-lifecycle li strong {
  font-size: 10px;
  font-weight: 800;
}

.em-overview-primary-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(300px, .8fr);
  gap: 14px;
}

.em-overview-card,
.em-readiness,
.em-activity {
  padding: 16px 18px;
}

.em-card-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.em-card-heading h2 {
  margin: 0;
  font-size: 14px;
}

.em-card-heading button {
  min-height: 28px;
  padding: 0 9px;
  border-color: var(--border-soft);
  background: var(--button-bg);
  color: var(--button-secondary-fg);
  font-size: 10px;
  font-weight: 800;
}

.em-delivery-total {
  display: flex;
  align-items: baseline;
  gap: 7px;
  margin-top: 18px;
}

.em-delivery-total strong {
  font-size: 28px;
  line-height: 1;
}

.em-delivery-total span {
  color: var(--text-secondary);
  font-size: 11px;
}

.em-delivery-bar {
  height: 12px;
  display: flex;
  gap: 2px;
  overflow: hidden;
  margin-top: 14px;
  border-radius: 999px;
  background: var(--soft);
}

.em-delivery-bar > span {
  flex: 0 0 var(--em-segment-size);
  min-width: 2px;
  background: var(--accent);
}

.em-delivery-bar > .planned { background: var(--purple); }
.em-delivery-bar > .development { background: var(--accent); }
.em-delivery-bar > .qa { background: var(--chart-series-1); }
.em-delivery-bar > .blocked { background: var(--danger); }
.em-delivery-bar > .completed { background: var(--green); }
.em-delivery-bar > .other,
.em-delivery-bar > .empty { background: var(--placeholder); }

.em-delivery-legend {
  display: grid;
  grid-template-columns: repeat(3, minmax(100px, 1fr));
  gap: 9px 12px;
  margin-top: 14px;
}

.em-delivery-legend > div {
  display: grid;
  grid-template-columns: 8px auto minmax(0, 1fr);
  align-items: center;
  gap: 6px;
}

.em-delivery-legend > div > span {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--accent);
}

.em-delivery-legend .planned > span { background: var(--purple); }
.em-delivery-legend .qa > span { background: var(--chart-series-1); }
.em-delivery-legend .blocked > span { background: var(--danger); }
.em-delivery-legend .completed > span { background: var(--green); }
.em-delivery-legend .other > span { background: var(--placeholder); }

.em-delivery-legend strong {
  font-size: 11px;
}

.em-delivery-legend small {
  overflow: hidden;
  color: var(--text-secondary);
  font-size: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.em-attention-list {
  display: grid;
  gap: 8px;
  margin-top: 14px;
}

.em-attention-item {
  display: grid;
  grid-template-columns: 8px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  min-width: 0;
  padding: 10px;
  border: 1px solid var(--border-soft);
  border-radius: 8px;
  background: var(--panel-bg-subtle);
}

.em-attention-item > span {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--placeholder);
}

.em-attention-item.high > span { background: var(--danger); }
.em-attention-item.medium > span { background: var(--orange); }
.em-attention-item.low > span { background: var(--accent); }

.em-attention-item strong {
  display: block;
  font-size: 11px;
}

.em-attention-item p,
.em-attention-empty p {
  margin: 3px 0 0;
  color: var(--text-secondary);
  font-size: 10px;
  line-height: 1.4;
}

.em-attention-item button {
  min-height: 27px;
  padding: 0 8px;
  font-size: 10px;
  font-weight: 800;
}

.em-attention-empty {
  padding: 16px;
  border: 1px solid var(--status-ok-border);
  border-radius: 8px;
  background: var(--green-soft);
}

.em-readiness-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(130px, 1fr));
  gap: 8px;
  margin-top: 14px;
}

.em-readiness-item {
  min-height: 64px;
  display: grid;
  grid-template-columns: 8px minmax(0, 1fr) auto;
  align-items: center;
  gap: 9px;
  padding: 10px;
  border-color: var(--border-soft);
  background: var(--panel-bg-subtle);
  text-align: left;
}

.em-readiness-item > div,
.pm-readiness-grid article > div {
  min-width: 0;
}

.pm-readiness-grid article > div {
  flex: 1 1 auto;
}

.readiness-fix {
  min-width: 48px;
  min-height: 30px;
  padding: 5px 8px;
  border-color: color-mix(in srgb, var(--orange) 42%, var(--border));
  background: var(--panel-bg);
  color: var(--text-primary);
  font-size: 9.5px;
  font-weight: 750;
  line-height: 1;
  white-space: nowrap;
}

.readiness-fix:hover,
.readiness-fix:focus-visible {
  border-color: var(--orange);
  background: var(--orange-soft);
}

.em-readiness-item > span {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--orange);
}

.em-readiness-item.ready > span { background: var(--green); }
.em-readiness-item.using-defaults > span { background: var(--accent); }

.em-readiness-item small {
  display: block;
  color: var(--text-secondary);
  font-size: 9px;
  font-weight: 750;
  text-transform: uppercase;
}

.em-readiness-item strong {
  display: block;
  margin-top: 3px;
  overflow: hidden;
  font-size: 10px;
  text-overflow: ellipsis;
}

.em-activity-list {
  display: grid;
  margin-top: 12px;
}

.em-activity-list article {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 9px 0;
  border-top: 1px solid var(--border-soft);
}

.em-activity-list article > span {
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--accent-soft);
  color: var(--accent-ink);
  font-size: 10px;
  font-weight: 850;
}

.em-activity-list strong {
  display: block;
  font-size: 11px;
}

.em-activity-list p,
.em-activity-empty {
  margin: 2px 0 0;
  color: var(--text-secondary);
  font-size: 10px;
}

.em-activity-list time {
  color: var(--placeholder);
  font-size: 10px;
  white-space: nowrap;
}

.em-overview-loading {
  padding: 24px;
}

.em-overview-loading p {
  margin-bottom: 0;
  color: var(--text-secondary);
}

.em-assistant-launcher {
  width: auto;
  min-height: 36px;
  margin: 0 18px 18px 0;
  padding: 0 14px;
  align-self: end;
  top: auto;
  bottom: 0;
  border-radius: 999px;
}

.em-assistant-launcher span {
  writing-mode: horizontal-tb;
  transform: none;
  font-size: 11px;
}

.em-destination-page,
.em-my-work {
  width: calc(100% - 32px);
  display: grid;
  gap: 12px;
  max-width: 1240px;
  margin: 0 auto;
}

.em-my-work-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 20px;
  padding: 4px 2px 8px;
}

.em-my-work-heading h1 {
  margin: 2px 0 5px;
  font-size: 24px;
  letter-spacing: -.02em;
}

.em-my-work-heading p {
  margin: 0;
  color: var(--text-secondary);
  font-size: 12px;
  line-height: 1.5;
}

.em-my-work-heading > span {
  flex: 0 0 auto;
  padding: 6px 9px;
  border: 1px solid var(--border-soft);
  border-radius: 999px;
  background: var(--panel-bg-subtle);
  color: var(--text-secondary);
  font-size: 10px;
  font-weight: 800;
  white-space: nowrap;
}

.em-my-work-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr));
  align-items: stretch;
  gap: 12px;
}

.em-my-work-project {
  min-width: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  border: 1px solid var(--border-soft);
  border-radius: 10px;
  background: var(--panel-bg);
  box-shadow: var(--shadow-card);
}

.em-my-work-project.selected {
  border-color: color-mix(in srgb, var(--accent) 52%, var(--border-soft));
  box-shadow: inset 3px 0 0 var(--accent), var(--shadow-card);
}

.em-my-work-project-head {
  width: 100%;
  min-height: 62px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  border: 0;
  border-bottom: 1px solid var(--border-soft);
  border-radius: 0;
  background: var(--panel-header-bg);
  color: var(--text-primary);
  text-align: left;
}

.em-my-work-project-head:hover,
.em-my-work-project-head:focus-visible {
  background: var(--button-hover-bg);
}

.em-my-work-project-head span:first-child,
.em-my-work-project-head strong,
.em-my-work-project-head small {
  min-width: 0;
  display: block;
}

.em-my-work-project-head strong {
  overflow: hidden;
  font-size: 13px;
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.em-my-work-project-head small {
  margin-top: 3px;
  color: var(--text-secondary);
  font-size: 10px;
  font-weight: 750;
}

.em-my-work-project-body {
  min-height: 82px;
  display: grid;
  align-content: start;
  gap: 8px;
  padding: 10px;
}

.em-my-work-project-body > button {
  width: 100%;
  min-height: 58px;
  display: grid;
  align-content: center;
  gap: 4px;
  padding: 10px 11px;
  border-color: var(--border-soft);
  background: var(--panel-bg-subtle);
  color: var(--text-primary);
  text-align: left;
}

.em-my-work-project-body > button:hover,
.em-my-work-project-body > button:focus-visible {
  border-color: var(--accent);
  background: var(--button-hover-bg);
}

.em-my-work-project-body strong,
.em-my-work-project-body small {
  display: block;
  line-height: 1.4;
}

.em-my-work-project-body strong {
  font-size: 11.5px;
}

.em-my-work-project-body small,
.em-my-work-project-body > p {
  margin: 0;
  color: var(--text-secondary);
  font-size: 10.5px;
}

.em-overview-lifecycle-column {
  min-width: 0;
  display: grid;
  gap: 10px;
}

.em-lifecycle-action {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
  padding: 11px 12px;
  border: 1px solid var(--border-soft);
  border-radius: 9px;
  background: var(--panel-bg-subtle);
}

.em-lifecycle-action.ready {
  border-color: color-mix(in srgb, var(--accent) 38%, var(--border-soft));
  background: color-mix(in srgb, var(--accent-soft) 34%, var(--panel-bg));
}

.em-lifecycle-action.blocked {
  border-color: color-mix(in srgb, var(--orange) 34%, var(--border-soft));
}

.em-lifecycle-action strong,
.em-lifecycle-action small {
  display: block;
}

.em-lifecycle-action strong {
  font-size: 11.5px;
}

.em-lifecycle-action small {
  margin-top: 3px;
  color: var(--text-secondary);
  font-size: 10px;
  line-height: 1.4;
}

.em-lifecycle-action button {
  min-height: 36px;
  white-space: nowrap;
}

.project-runbook-focus {
  margin: 0;
  padding: 14px 16px;
  border-color: var(--border-soft);
  border-radius: 10px;
  box-shadow: var(--shadow-card);
}

.project-runbook-focus-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding-bottom: 9px;
  border-bottom: 1px solid var(--border-soft);
}

.project-runbook-focus-head .eyebrow,
.project-runbook-focus-head h2 {
  margin: 0;
}

.project-runbook-focus-head h2 {
  margin-top: 2px;
  font-size: 15px;
}

.project-runbook-focus-head > span {
  flex: 0 0 auto;
  color: var(--text-secondary);
  font-size: 10px;
  font-weight: 800;
}

.project-runbook-focus-steps {
  display: grid;
  margin: 0;
  padding: 0;
  list-style: none;
}

.project-runbook-focus-steps > li {
  position: relative;
  min-width: 0;
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 8px 8px 8px 2px;
}

.project-runbook-focus-steps > li::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 10px;
  width: 2px;
  background: var(--border-strong);
}

.project-runbook-focus-steps > li:first-child::before {
  top: 50%;
}

.project-runbook-focus-steps > li:last-child::before {
  bottom: 50%;
}

.project-runbook-focus-steps > li.done::before {
  background: var(--green);
}

.project-runbook-focus-steps > li.current {
  margin: 2px 0;
  padding-block: 10px;
  border: 1px solid color-mix(in srgb, var(--accent) 38%, var(--border-soft));
  border-radius: 8px;
  background: color-mix(in srgb, var(--accent-soft) 32%, var(--panel-bg));
}

.project-runbook-focus-marker {
  z-index: 1;
  width: 16px;
  height: 16px;
  display: grid;
  place-items: center;
  border: 2px solid var(--border-strong);
  border-radius: 50%;
  background: var(--panel-bg);
  color: var(--panel-bg);
  font-size: 9px;
  font-weight: 900;
}

.project-runbook-focus-steps > li.done .project-runbook-focus-marker {
  border-color: var(--green);
  background: var(--green);
  color: var(--button-primary-fg);
}

.project-runbook-focus-steps > li.current .project-runbook-focus-marker {
  border: 5px solid var(--accent);
  background: var(--panel-bg);
}

.project-runbook-focus-copy,
.project-runbook-focus-copy > div {
  min-width: 0;
}

.project-runbook-focus-copy > div {
  display: flex;
  align-items: baseline;
  gap: 8px;
}

.project-runbook-focus-copy strong {
  font-size: 11.5px;
}

.project-runbook-focus-copy > div > span,
.project-runbook-focus-copy small,
.project-runbook-focus-copy p {
  color: var(--text-secondary);
  font-size: 10px;
}

.project-runbook-focus-copy > div > span {
  font-weight: 750;
}

.project-runbook-focus-copy small {
  display: block;
  margin-top: 2px;
}

.project-runbook-focus-copy p {
  margin: 5px 0 0;
  line-height: 1.4;
}

.project-runbook-focus-copy .project-runbook-focus-waiting {
  color: var(--text-primary);
  font-weight: 750;
}

.project-runbook-focus-steps > li > button {
  min-height: 34px;
  padding-inline: 12px;
  font-size: 10px;
  font-weight: 800;
  white-space: nowrap;
}

.project-runbook-focus-overflow {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 22px;
  padding-left: 2px;
  color: var(--text-secondary);
}

.project-runbook-focus-overflow span {
  width: 18px;
  color: var(--placeholder);
  font-size: 9px;
  letter-spacing: 1px;
  text-align: center;
  writing-mode: vertical-rl;
}

.project-runbook-focus-overflow small {
  font-size: 9.5px;
  font-weight: 750;
}

.project-runbook-focus.compact {
  height: 100%;
  padding: 12px 14px;
}

.project-runbook-focus.compact .project-runbook-focus-head {
  padding-bottom: 7px;
}

.project-runbook-focus.compact .project-runbook-focus-head h2 {
  font-size: 13px;
}

.project-runbook-focus.compact .project-runbook-focus-steps > li {
  gap: 8px;
  padding-block: 5px;
}

.project-runbook-focus.compact .project-runbook-focus-steps > li.current {
  padding-block: 7px;
}

.project-runbook-focus.compact .project-runbook-focus-copy strong {
  font-size: 10.5px;
}

.project-runbook-focus.compact .project-runbook-focus-copy small,
.project-runbook-focus.compact .project-runbook-focus-copy p,
.project-runbook-focus.compact .project-runbook-focus-copy > div > span {
  font-size: 9.5px;
}

.project-runbook-focus.compact .project-runbook-focus-copy p {
  margin-top: 3px;
}

.project-runbook-focus.compact .project-runbook-focus-steps > li > button {
  min-height: 30px;
  padding-inline: 9px;
  font-size: 9.5px;
}

.project-runbook-focus.compact .project-runbook-focus-overflow {
  min-height: 18px;
}

.story-runbook-focus-window {
  margin: 0;
  padding: 14px 16px;
  border-color: var(--border-soft);
  border-radius: 10px;
  box-shadow: var(--shadow-card);
}

.story-runbook-focus-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--border-soft);
}

.story-runbook-focus-head .eyebrow,
.story-runbook-focus-head h3,
.story-runbook-focus-head p {
  margin: 0;
}

.story-runbook-focus-head h3 {
  margin-top: 2px;
  font-size: 15px;
}

.story-runbook-focus-head p {
  max-width: 760px;
  margin-top: 3px;
  color: var(--text-secondary);
  font-size: 10.5px;
  line-height: 1.4;
}

.story-runbook-focus-head > span {
  flex: 0 0 auto;
  color: var(--text-secondary);
  font-size: 10px;
  font-weight: 800;
}

.story-runbook-focus-steps {
  display: grid;
  margin: 0;
  padding: 0;
  list-style: none;
}

.story-runbook-focus-steps > li {
  position: relative;
  min-width: 0;
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  align-items: start;
  gap: 10px;
  padding: 8px 8px 8px 2px;
}

.story-runbook-focus-steps > li::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 10px;
  width: 2px;
  background: var(--border-strong);
}

.story-runbook-focus-steps > li:first-child::before {
  top: 16px;
}

.story-runbook-focus-steps > li:last-child::before {
  bottom: calc(100% - 16px);
}

.story-runbook-focus-steps > li.done::before {
  background: var(--green);
}

.story-runbook-focus-steps > li.current {
  margin: 2px 0;
  padding: 11px 10px 11px 2px;
  border: 1px solid color-mix(in srgb, var(--accent) 38%, var(--border-soft));
  border-radius: 8px;
  background: color-mix(in srgb, var(--accent-soft) 28%, var(--panel-bg));
}

.story-runbook-focus-marker {
  z-index: 1;
  width: 16px;
  height: 16px;
  display: grid;
  place-items: center;
  border: 2px solid var(--border-strong);
  border-radius: 50%;
  background: var(--panel-bg);
  color: var(--panel-bg);
  font-size: 9px;
  font-weight: 900;
}

.story-runbook-focus-steps > li.done .story-runbook-focus-marker {
  border-color: var(--green);
  background: var(--green);
  color: var(--button-primary-fg);
}

.story-runbook-focus-steps > li.current .story-runbook-focus-marker {
  border: 5px solid var(--accent);
  background: var(--panel-bg);
}

.story-runbook-focus-copy {
  min-width: 0;
}

.story-runbook-step-title {
  min-width: 0;
  display: flex;
  align-items: baseline;
  gap: 8px;
}

.story-runbook-step-title strong {
  font-size: 11.5px;
}

.story-runbook-step-title > span {
  color: var(--text-secondary);
  font-size: 9.5px;
  font-weight: 800;
}

.story-runbook-step-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 5px 14px;
  margin-top: 3px;
}

.story-runbook-step-meta span {
  display: inline-flex;
  gap: 5px;
  color: var(--text-secondary);
  font-size: 10px;
}

.story-runbook-step-meta b {
  color: var(--muted);
  font-size: 9px;
  text-transform: uppercase;
}

.story-runbook-step-evidence {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 5px 9px;
  margin-top: 3px;
}

.story-runbook-evidence-link {
  min-height: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--accent-ink);
  font-size: 9.5px;
  font-weight: 800;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.story-runbook-evidence-state,
.story-runbook-step-evidence small {
  color: var(--text-secondary);
  font-size: 9.5px;
}

.story-runbook-evidence-state.warn {
  color: var(--orange);
  font-weight: 800;
}

.story-runbook-current-detail {
  display: grid;
  gap: 9px;
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px solid var(--border-soft);
}

.story-runbook-current-detail > p,
.story-runbook-current-action p,
.story-runbook-blocked {
  margin: 0;
  color: var(--text-secondary);
  font-size: 10.5px;
  line-height: 1.45;
}

.story-runbook-current-action {
  display: grid;
  gap: 8px;
}

.story-runbook-current-action .coding-assistant-continuation,
.story-runbook-current-action .agent-farm-action-summary,
.story-runbook-current-action .validation-panel {
  margin: 0;
  border-radius: 7px;
}

.story-runbook-current-action .agent-routing-recommendation {
  box-shadow: none;
}

.story-runbook-action-row,
.story-runbook-current-action .developer-stage-actions {
  display: flex;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 7px;
}

.story-runbook-action-row button,
.story-runbook-current-action .developer-stage-actions button {
  width: auto;
  min-height: 34px;
  white-space: nowrap;
}

/* The collapsed assistant floats in the mission's lower-right corner on desktop.
   Keep only the current runbook controls out of that lane so primary actions stay
   clickable without adding permanent whitespace to the rest of the workspace. */
@media (min-width: 1101px) {
  .workspace.assistant-collapsed .story-runbook-action-row,
  .workspace.assistant-collapsed .story-runbook-current-action .developer-stage-actions {
    padding-inline-end: 112px;
  }
}

.story-runbook-agent-operation {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 10px 11px;
  border: 1px solid color-mix(in srgb, var(--accent) 34%, var(--border-soft));
  border-radius: 7px;
  background: var(--surface-raised);
}

.story-runbook-agent-operation.warn {
  border-color: color-mix(in srgb, var(--warning) 44%, var(--border-soft));
}

.story-runbook-agent-operation.danger {
  border-color: color-mix(in srgb, var(--danger) 44%, var(--border-soft));
}

.story-runbook-agent-operation > div {
  min-width: 0;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 5px 8px;
}

.story-runbook-agent-operation strong {
  color: var(--text-primary);
  font-size: 10.5px;
}

.story-runbook-agent-operation time {
  flex-basis: 100%;
  color: var(--text-secondary);
  font-size: 9.5px;
}

.story-runbook-agent-operation > button {
  flex: 0 0 auto;
  width: auto;
  min-height: 36px;
  white-space: nowrap;
}

.story-runbook-mode-choice {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 0;
  border: 0;
}

.story-runbook-mode-choice > legend {
  color: var(--muted);
  font-size: 9px;
  font-weight: 850;
  text-transform: uppercase;
}

.story-runbook-mode-options {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
}

.story-runbook-mode-options > label {
  min-width: 0;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: start;
  gap: 8px;
  padding: 9px;
  border: 1px solid var(--border-soft);
  border-radius: 7px;
  background: var(--surface-raised);
  cursor: pointer;
}

.story-runbook-mode-options > label:has(input:checked) {
  border-color: var(--accent);
  background: var(--accent-soft);
}

.story-runbook-mode-options input {
  margin-top: 2px;
}

.story-runbook-mode-options span {
  display: grid;
  gap: 2px;
}

.story-runbook-mode-options strong {
  font-size: 10.5px;
}

.story-runbook-mode-options small {
  color: var(--text-secondary);
  font-size: 9.5px;
  line-height: 1.35;
}

.story-runbook-routing {
  padding: 7px 9px;
  border: 1px solid var(--border-soft);
  border-radius: 7px;
  background: var(--surface-raised);
}

.story-runbook-routing summary {
  font-size: 10px;
  font-weight: 800;
}

.story-runbook-focus-overflow {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 22px;
  color: var(--text-secondary);
}

.story-runbook-focus-overflow span {
  width: 18px;
  color: var(--placeholder);
  font-size: 9px;
  letter-spacing: 1px;
  text-align: center;
  writing-mode: vertical-rl;
}

.story-runbook-focus-overflow small {
  font-size: 9.5px;
  font-weight: 750;
}

.story-runbook-evidence-lightbox {
  width: min(760px, calc(100vw - 44px));
  max-height: min(720px, calc(100dvh - 44px));
  grid-template-rows: auto minmax(0, 1fr) auto;
}

.story-runbook-evidence-body {
  min-height: 0;
  display: grid;
  align-content: start;
  gap: 12px;
  overflow-y: auto;
}

.story-runbook-evidence-body section {
  display: grid;
  gap: 7px;
}

.story-runbook-evidence-body h3,
.story-runbook-evidence-body ul {
  margin: 0;
}

.story-runbook-evidence-body h3 {
  font-size: 12px;
}

.story-runbook-evidence-body ul {
  padding-left: 18px;
  color: var(--text-secondary);
  font-size: 10.5px;
}

.story-runbook-record-list {
  display: grid;
  gap: 6px;
}

.story-runbook-record-list article {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 9px 10px;
  border: 1px solid var(--border-soft);
  border-radius: 7px;
  background: var(--surface-raised);
}

.story-runbook-record-list article > div {
  display: grid;
  gap: 2px;
}

.story-runbook-record-list strong {
  font-size: 10.5px;
}

.story-runbook-record-list small,
.story-runbook-record-list time,
.story-runbook-record-list article > span {
  color: var(--text-secondary);
  font-size: 9.5px;
}

@container (max-width: 560px) {
  .story-runbook-focus-head,
  .story-runbook-record-list article {
    display: grid;
  }

  .story-runbook-mode-options {
    grid-template-columns: minmax(0, 1fr);
  }

  .story-runbook-agent-operation {
    align-items: stretch;
    flex-direction: column;
  }

  .story-runbook-agent-operation > button {
    align-self: flex-end;
  }
}

.em-page-intro {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  padding: 4px 2px 8px;
}

.em-page-intro .eyebrow {
  margin: 0 0 4px;
}

.em-page-intro h1 {
  margin: 0;
  font-size: 22px;
  letter-spacing: -.02em;
}

.em-page-intro p:last-child {
  max-width: 72ch;
  margin: 5px 0 0;
  color: var(--text-secondary);
  font-size: 12px;
  line-height: 1.5;
}

.em-page-intro > button {
  flex: 0 0 auto;
  min-height: 32px;
  font-size: 10px;
  font-weight: 800;
}

.em-content-group {
  overflow: hidden;
  margin: 0;
  padding: 0;
  border-color: var(--border-soft);
  border-radius: 10px;
  box-shadow: var(--shadow-card);
}

.em-content-group > summary {
  min-height: 66px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 28px;
  align-items: center;
  gap: 14px;
  padding: 12px 16px;
  cursor: pointer;
  list-style: none;
}

.em-content-group > summary::-webkit-details-marker {
  display: none;
}

.em-content-group > summary:hover,
.em-content-group > summary:focus-visible {
  background: var(--button-hover-bg);
}

.em-content-group > summary span,
.em-content-group > summary strong,
.em-content-group > summary small {
  display: block;
}

.em-content-group > summary strong {
  color: var(--text-primary);
  font-size: 13px;
}

.em-content-group > summary small {
  margin-top: 4px;
  color: var(--text-secondary);
  font-size: 10px;
  line-height: 1.4;
}

.em-content-group > summary b {
  position: relative;
  width: 28px;
  height: 28px;
  border: 1px solid var(--border-soft);
  border-radius: 7px;
  background: var(--button-bg);
}

.em-content-group > summary b::before,
.em-content-group > summary b::after {
  content: "";
  position: absolute;
  top: 13px;
  left: 8px;
  width: 10px;
  height: 2px;
  border-radius: 2px;
  background: var(--text-secondary);
}

.em-content-group > summary b::after {
  transform: rotate(90deg);
  transition: transform 120ms ease;
}

.em-content-group[open] > summary b::after {
  transform: rotate(0);
}

.em-content-group[open] > summary {
  border-bottom: 1px solid var(--border-soft);
  background: var(--panel-bg-subtle);
}

.em-content-group-body {
  min-width: 0;
  padding: 14px;
}

.em-content-group-body > .pane,
.em-content-group-body > .project-detail-page > section,
.em-content-group-body > .project-budget-page > section {
  margin: 0;
  box-shadow: none;
}

.em-content-group-body > .pane.artifact-pane {
  padding: 0;
  border: 0;
  background: transparent;
}

.em-content-group-body > .pane.artifact-pane > .pane-title {
  display: none;
}

.em-content-group-body > .pane.artifact-pane > .pane,
.em-content-group-body > .stories-viewport {
  margin: 0;
}

.em-story-monitor-card {
  overflow: hidden;
  margin: 0;
  padding: 0;
  border-color: var(--border-soft);
  border-radius: 10px;
  box-shadow: var(--shadow-card);
}

.em-story-monitor-filters {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) minmax(180px, .35fr);
  gap: 10px;
  padding: 12px 14px;
  border-bottom: 1px solid var(--border-soft);
  background: var(--panel-bg-subtle);
}

.em-story-monitor-filters label {
  display: grid;
  gap: 5px;
  color: var(--text-secondary);
  font-size: 9px;
  font-weight: 800;
  text-transform: uppercase;
}

.em-story-monitor-filters input,
.em-story-monitor-filters select {
  width: 100%;
  min-height: 34px;
  font-size: 11px;
  text-transform: none;
}

.em-story-monitor-table {
  min-width: 0;
  overflow: auto;
}

.em-story-monitor-row {
  width: 100%;
  min-width: 760px;
  display: grid;
  grid-template-columns: minmax(260px, 1.6fr) minmax(130px, .7fr) minmax(120px, .7fr) minmax(120px, .7fr) minmax(120px, .7fr);
  align-items: center;
  gap: 12px;
  min-height: 54px;
  padding: 9px 14px;
  border: 0;
  border-bottom: 1px solid var(--border-soft);
  border-radius: 0;
  background: var(--panel-bg);
  color: var(--text-primary);
  text-align: left;
  box-shadow: none;
}

.em-story-monitor-row.head {
  min-height: 34px;
  background: var(--panel-bg-subtle);
  color: var(--text-secondary);
  font-size: 9px;
  font-weight: 850;
  text-transform: uppercase;
}

.em-story-monitor-row > span {
  min-width: 0;
  overflow: hidden;
  font-size: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.em-story-monitor-row > span:first-child strong,
.em-story-monitor-row > span:first-child small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.em-story-monitor-row > span:first-child strong {
  font-size: 10px;
}

.em-story-monitor-row > span:first-child small {
  margin-top: 3px;
  color: var(--text-secondary);
  font-size: 10px;
}

.em-story-open {
  width: 100%;
  min-height: 34px;
  display: block;
  padding: 4px 6px;
  border: 0;
  background: transparent;
  color: var(--text-primary);
  text-align: left;
  box-shadow: none;
}

.em-story-open:hover,
.em-story-open:focus-visible {
  background: var(--row-bg-hover);
  color: var(--accent-ink);
}

.em-story-detail-summary {
  display: grid;
  grid-template-columns: repeat(5, minmax(120px, 1fr));
  gap: 1px;
  overflow: hidden;
  margin: 0;
  padding: 0;
  border-color: var(--border-soft);
  border-radius: 10px;
  background: var(--border-soft);
  box-shadow: var(--shadow-card);
}

.em-story-detail-summary > div {
  min-width: 0;
  padding: 13px 14px;
  background: var(--panel-bg);
}

.em-story-detail-summary span,
.em-story-detail-summary strong {
  display: block;
}

.em-story-detail-summary span {
  color: var(--text-secondary);
  font-size: 9px;
  font-weight: 800;
  text-transform: uppercase;
}

.em-story-detail-summary strong {
  margin-top: 5px;
  overflow: hidden;
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.em-story-detail-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.em-story-detail-grid > .pane {
  min-height: 180px;
  margin: 0;
  padding: 16px;
  border-color: var(--border-soft);
  border-radius: 10px;
  box-shadow: var(--shadow-card);
}

.em-story-detail-grid h2 {
  margin: 3px 0 10px;
  font-size: 14px;
}

.em-story-detail-grid p,
.em-story-detail-grid li {
  color: var(--text-secondary);
  font-size: 11px;
  line-height: 1.5;
}

.em-story-detail-grid ul {
  margin: 0;
  padding-left: 18px;
}

.em-story-acceptance-pane,
.em-story-acceptance-markdown {
  min-height: 0;
}

.em-story-acceptance-markdown.markdown-panel--scrollable,
.agent-task-acceptance-markdown.markdown-panel--scrollable {
  max-height: min(360px, 42vh);
  max-height: min(360px, 42dvh);
  padding-right: 8px;
}

.em-story-acceptance-markdown .markdown-document,
.agent-task-acceptance-markdown .markdown-document {
  max-width: none;
  margin: 0;
}

.requirements-generation-warning {
  margin: 0 18px 12px;
  padding: 9px 11px;
  border-left: 3px solid var(--status-warn-border);
  background: var(--status-warn-bg);
  color: var(--status-warn-fg);
  font-size: 12px;
  line-height: 1.45;
}

.em-story-labels {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-top: 12px;
}

.em-story-evidence-list {
  display: grid;
  gap: 8px;
  margin: 0;
}

.em-story-evidence-list > div {
  display: grid;
  grid-template-columns: 100px minmax(0, 1fr);
  gap: 12px;
  padding-bottom: 7px;
  border-bottom: 1px solid var(--border-soft);
}

.em-story-evidence-list dt {
  color: var(--text-secondary);
  font-size: 10px;
  font-weight: 750;
}

.em-story-evidence-list dd {
  margin: 0;
  overflow: hidden;
  font-size: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.em-story-jira-subtasks > p {
  margin: 5px 0 10px;
  color: var(--text-secondary);
  font-size: 10px;
}

.em-story-jira-subtasks > div {
  display: grid;
}

.em-story-jira-subtasks article {
  display: grid;
  grid-template-columns: minmax(76px, auto) minmax(0, 1fr) auto;
  gap: 8px;
  padding: 7px 0;
  border-top: 1px solid var(--border-soft);
  font-size: 9px;
}

.em-story-jira-subtasks article span {
  overflow: hidden;
  color: var(--text-secondary);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.em-story-jira-subtasks article small {
  color: var(--text-secondary);
}

.em-delegated-summary {
  display: grid;
  gap: 12px;
}

.em-delegated-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(110px, 1fr));
  gap: 8px;
}

.em-delegated-metrics > div {
  padding: 12px;
  border: 1px solid var(--border-soft);
  border-radius: 8px;
  background: var(--panel-bg-subtle);
}

.em-delegated-metrics span,
.em-delegated-metrics strong {
  display: block;
}

.em-delegated-metrics span {
  color: var(--text-secondary);
  font-size: 9px;
  font-weight: 800;
  text-transform: uppercase;
}

.em-delegated-metrics strong {
  margin-top: 4px;
  font-size: 20px;
}

.em-delegated-list {
  display: grid;
}

.em-delegated-list article {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 10px 2px;
  border-top: 1px solid var(--border-soft);
}

.em-delegated-list article strong {
  font-size: 11px;
}

.em-delegated-list article p {
  margin: 3px 0 0;
  color: var(--text-secondary);
  font-size: 10px;
}

.em-settings-summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(360px, .8fr);
  gap: 22px;
  align-items: center;
  margin: 0;
  padding: 16px 18px;
  border-color: var(--border-soft);
  border-radius: 10px;
  box-shadow: var(--shadow-card);
}

.em-settings-summary h2 {
  margin: 3px 0 5px;
  font-size: 16px;
}

.em-settings-summary p:last-child {
  margin: 0;
  color: var(--text-secondary);
  font-size: 11px;
  line-height: 1.45;
}

.em-settings-summary dl {
  display: grid;
  grid-template-columns: repeat(3, minmax(100px, 1fr));
  gap: 8px;
  margin: 0;
}

.em-settings-summary dl > div {
  min-width: 0;
  padding: 10px;
  border: 1px solid var(--border-soft);
  border-radius: 8px;
  background: var(--panel-bg-subtle);
}

.em-settings-summary dt,
.em-settings-summary dd {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.em-settings-summary dt {
  color: var(--text-secondary);
  font-size: 9px;
}

.em-settings-summary dd {
  margin: 4px 0 0;
  font-size: 10px;
  font-weight: 800;
}

.em-settings-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(180px, 1fr));
  gap: 10px;
}

.em-settings-card {
  min-height: 154px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  margin: 0;
  padding: 14px;
  border-color: var(--border-soft);
  border-radius: 10px;
  box-shadow: var(--shadow-card);
}

.em-settings-card > span {
  color: var(--text-secondary);
  font-size: 9px;
  font-weight: 800;
  text-transform: uppercase;
}

.em-settings-card > strong {
  margin-top: 5px;
  font-size: 13px;
}

.em-settings-card > p {
  margin: 7px 0 12px;
  color: var(--text-secondary);
  font-size: 10px;
  line-height: 1.45;
}

.em-settings-card > button {
  min-height: 30px;
  margin-top: auto;
  font-size: 10px;
  font-weight: 800;
}

.em-project-index {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(360px, 100%), 1fr));
  gap: 12px;
}

.em-project-index-card {
  min-height: 210px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 16px;
  border-color: var(--border-soft);
  border-radius: 10px;
  background: var(--panel-bg);
  color: var(--text-primary);
  text-align: left;
  box-shadow: var(--shadow-card);
}

.em-project-index-card > strong {
  margin-top: 13px;
  font-size: 17px;
  line-height: 1.25;
}

.em-project-index-card > p {
  min-height: 42px;
  margin: 6px 0 14px;
  color: var(--text-secondary);
  font-size: 11.5px;
  line-height: 1.5;
}

.em-project-index-card dl {
  width: 100%;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
  margin: auto 0 12px;
}

.em-project-index-card dl > div {
  min-width: 0;
  padding: 8px;
  border-radius: 7px;
  background: var(--panel-bg-subtle);
}

.em-project-index-card dt,
.em-project-index-card dd {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.em-project-index-card dt {
  color: var(--text-secondary);
  font-size: 9.5px;
}

.em-project-index-card dd {
  margin: 3px 0 0;
  font-size: 11.5px;
  font-weight: 800;
}

.em-project-index-card > span:last-child {
  color: var(--accent-ink);
  font-size: 11.5px;
  font-weight: 800;
}

.em-project-work-card {
  display: flex;
  flex-direction: column;
  align-self: stretch;
  height: 100%;
  min-width: 0;
  margin: 0;
  padding: 0;
  overflow: hidden;
  border: 1px solid var(--border-soft);
  border-radius: 10px;
  box-shadow: var(--shadow-card);
}

.em-project-work-card .em-project-index-card {
  min-height: 190px;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

.em-project-kickoff {
  border-top: 1px solid var(--border-soft);
  background: var(--panel-bg-subtle);
}

.em-project-kickoff > summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 9px;
  min-height: 52px;
  padding: 9px 11px;
  color: var(--text-primary);
  list-style: none;
  cursor: pointer;
}

.em-project-kickoff > summary::-webkit-details-marker {
  display: none;
}

.em-kickoff-summary-copy {
  min-width: 0;
}

.em-kickoff-summary-copy strong,
.em-kickoff-summary-copy small {
  display: block;
}

.em-kickoff-summary-copy strong {
  font-size: 11.5px;
}

.em-kickoff-summary-copy small {
  margin-top: 2px;
  color: var(--text-secondary);
  font-size: 9.5px;
}

.em-kickoff-status,
.em-kickoff-owner {
  padding: 3px 7px;
  border: 1px solid var(--border-soft);
  border-radius: 999px;
  background: var(--panel-bg);
  color: var(--text-secondary);
  font-size: 9px;
  font-weight: 800;
  white-space: nowrap;
}

.em-kickoff-status.ready {
  border-color: color-mix(in srgb, var(--accent) 48%, var(--border-soft));
  background: var(--accent-soft);
  color: var(--accent-ink);
}

.em-kickoff-status.active {
  border-color: var(--status-info-border);
  background: var(--status-info-bg);
  color: var(--status-info-fg);
}

.em-kickoff-status.attention {
  border-color: var(--status-warn-border);
  background: var(--status-warn-bg);
  color: var(--status-warn-fg);
}

.em-kickoff-steps {
  display: grid;
  gap: 0;
  margin: 0;
  padding: 0 10px 10px;
  list-style: none;
}

.em-kickoff-steps > li {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  min-height: 48px;
  padding: 7px 2px;
  border-top: 1px solid var(--border-soft);
}

.em-kickoff-steps > li.waiting {
  color: var(--text-secondary);
}

.em-kickoff-marker {
  width: 16px;
  height: 16px;
  display: grid;
  place-items: center;
  border: 1px solid var(--border-strong);
  border-radius: 50%;
  color: var(--text-secondary);
  font-size: 9px;
  font-weight: 900;
}

.em-kickoff-steps > li.done .em-kickoff-marker {
  border-color: var(--success);
  background: color-mix(in srgb, var(--success) 12%, var(--panel-bg));
  color: var(--success);
}

.em-kickoff-steps > li.current .em-kickoff-marker {
  border: 4px solid color-mix(in srgb, var(--accent) 28%, var(--panel-bg));
  background: var(--accent);
}

.em-kickoff-steps > li > div {
  min-width: 0;
}

.em-kickoff-steps > li > div > span,
.em-kickoff-steps > li > div > strong,
.em-kickoff-steps > li > div > small {
  display: block;
}

.em-kickoff-steps > li > div > span {
  color: var(--text-secondary);
  font-size: 9px;
  font-weight: 800;
  text-transform: uppercase;
}

.em-kickoff-steps > li > div > strong {
  margin-top: 2px;
  font-size: 11px;
}

.em-kickoff-steps > li > div > small {
  margin-top: 2px;
  overflow: hidden;
  color: var(--text-secondary);
  font-size: 9.5px;
  line-height: 1.35;
  text-overflow: ellipsis;
}

.em-kickoff-steps > li > button {
  min-height: 44px;
  max-width: 180px;
  padding: 5px 9px;
  font-size: 9.5px;
  white-space: normal;
}

.em-project-work-actions {
  display: grid;
  flex: 1 1 auto;
  align-content: start;
  gap: 6px;
  padding: 10px;
  border-top: 1px solid var(--border-soft);
  background: var(--panel-bg-subtle);
}

.em-project-work-actions > button {
  display: grid;
  gap: 3px;
  min-height: 52px;
  padding: 9px 10px;
  border-color: var(--border-soft);
  background: var(--panel-bg);
  text-align: left;
}

.em-project-work-actions > button.high {
  border-left: 3px solid var(--danger);
}

.em-project-work-actions > button.medium {
  border-left: 3px solid var(--orange);
}

.em-project-work-actions strong {
  color: var(--text-primary);
  font-size: 11.5px;
}

.em-project-work-actions small,
.em-project-work-actions > p {
  margin: 0;
  color: var(--text-secondary);
  font-size: 10.5px;
  line-height: 1.45;
}

.em-empty-state {
  grid-column: 1 / -1;
  padding: 28px;
  color: var(--text-secondary);
  text-align: center;
}

.em-empty-state strong {
  color: var(--text-primary);
  font-size: 12px;
}

.em-empty-state p {
  margin: 5px 0 0;
  font-size: 10px;
}

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

.pm-overview-primary-grid .em-overview-card {
  --product-area-color: var(--accent);
  --product-area-soft: var(--accent-soft);
  min-height: 150px;
  border-color: color-mix(in srgb, var(--product-area-color) 24%, var(--border-soft));
  border-top: 3px solid var(--product-area-color);
  background: color-mix(in srgb, var(--product-area-soft) 32%, var(--panel-bg));
}

.pm-overview-primary-grid .em-overview-card[data-product-area="requirements"] {
  --product-area-color: var(--violet);
  --product-area-soft: var(--violet-soft);
}

.pm-overview-primary-grid .em-overview-card[data-product-area="backlog"] {
  --product-area-color: var(--cyan);
  --product-area-soft: var(--cyan-soft);
}

.pm-overview-primary-grid .em-overview-card[data-product-area="delivery"] {
  --product-area-color: var(--accent);
  --product-area-soft: var(--accent-soft);
}

.pm-overview-primary-grid .metric-panel-head {
  background: transparent;
}

.pm-overview-primary-grid .em-empty-state {
  padding: 14px 0 0;
  border: 0;
  background: transparent;
  text-align: left;
}

.pm-overview-secondary-grid {
  display: grid;
  grid-template-columns: minmax(300px, .78fr) minmax(420px, 1.22fr);
  gap: 12px;
}

.pm-overview-value {
  display: inline-block;
  margin: 12px 8px 4px 0;
  color: var(--text-primary);
  font-size: 26px;
  line-height: 1;
}

.pm-overview .em-overview-card > p {
  margin: 6px 0 0;
  color: var(--text-secondary);
  font-size: 11px;
}

.pm-readiness-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 7px;
  margin-top: 10px;
}

.pm-readiness-grid article {
  --pm-readiness-color: var(--accent);
  --pm-readiness-soft: var(--accent-soft);
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 9px;
  border: 1px solid color-mix(in srgb, var(--pm-readiness-color) 24%, var(--border-soft));
  border-radius: 7px;
  background: color-mix(in srgb, var(--pm-readiness-soft) 42%, var(--panel-bg));
}

.pm-readiness-grid article[data-readiness="requirements"] {
  --pm-readiness-color: var(--violet);
  --pm-readiness-soft: var(--violet-soft);
}

.pm-readiness-grid article[data-readiness="architecture"] {
  --pm-readiness-color: var(--accent);
  --pm-readiness-soft: var(--accent-soft);
}

.pm-readiness-grid article[data-readiness="sources"] {
  --pm-readiness-color: var(--cyan);
  --pm-readiness-soft: var(--cyan-soft);
}

.pm-readiness-grid article[data-readiness="backlog-labels"] {
  --pm-readiness-color: var(--orange);
  --pm-readiness-soft: var(--orange-soft);
}

.pm-readiness-grid article[data-readiness="scope-changes"] {
  --pm-readiness-color: var(--teal);
  --pm-readiness-soft: var(--teal-soft);
}

.pm-readiness-grid article[data-readiness="product-records"] {
  --pm-readiness-color: var(--accent);
  --pm-readiness-soft: var(--accent-soft);
}

.pm-readiness-grid article > span {
  width: 7px;
  height: 7px;
  flex: 0 0 auto;
  border-radius: 50%;
  background: var(--warning);
}

.pm-readiness-grid article.ready > span {
  background: var(--pm-readiness-color);
}

.pm-readiness-grid small,
.pm-readiness-grid strong {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pm-readiness-grid small {
  color: var(--text-secondary);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .035em;
  text-transform: uppercase;
}

.pm-readiness-grid strong {
  margin-top: 2px;
  font-size: 11px;
}

.pm-section-stack {
  display: grid;
  gap: 10px;
}

.pm-domain-section {
  overflow: hidden;
  border: 1px solid var(--border-soft);
  border-radius: 8px;
  background: var(--panel-bg);
}

.pm-domain-section > summary {
  min-height: 54px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 9px 12px;
  cursor: pointer;
  list-style: none;
  background: var(--panel-bg-subtle);
}

.pm-domain-section > summary::-webkit-details-marker {
  display: none;
}

.pm-domain-section > summary span,
.pm-domain-section > summary strong,
.pm-domain-section > summary small {
  display: block;
}

.pm-domain-section > summary strong {
  color: var(--text-primary);
  font-size: 12px;
}

.pm-domain-section > summary small {
  margin-top: 3px;
  color: var(--text-secondary);
  font-size: 10px;
}

.pm-domain-section > summary b {
  color: var(--accent-ink);
  font-size: 10px;
  font-weight: 800;
}

.pm-domain-section[open] > summary {
  border-bottom: 1px solid var(--border-soft);
}

.pm-domain-section > div {
  padding: 10px;
}

.pm-domain-section .artifact-pane,
.pm-domain-section .pane {
  box-shadow: none;
}

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

.pm-project-info-grid article {
  padding: 16px;
}

.pm-project-info-grid > .pane,
.pm-project-info-note.pane {
  margin: 0;
  border: 1px solid var(--border-soft);
  border-radius: 10px;
  box-shadow: var(--shadow-card);
}

.pm-project-info-grid h2 {
  margin: 3px 0 6px;
  font-size: 15px;
}

.pm-project-info-grid p {
  margin: 0;
  color: var(--text-secondary);
  font-size: 11px;
  line-height: 1.5;
}

.pm-project-info-grid dl {
  display: grid;
  grid-template-columns: minmax(100px, .8fr) minmax(0, 1.2fr);
  gap: 8px;
  margin: 14px 0 0;
  font-size: 10px;
}

.pm-project-info-grid dt {
  color: var(--text-secondary);
}

.pm-project-info-grid dd {
  margin: 0;
  color: var(--text-primary);
  font-weight: 750;
}

.pm-project-info-note {
  margin-top: 12px;
  padding: 14px 16px;
}

.pm-project-info-note p {
  margin: 4px 0 0;
  color: var(--text-secondary);
  font-size: 11px;
}

@media (max-width: 1180px) {
  .workspace.support-workspace,
  .workspace.support-workspace.assistant-collapsed {
    grid-template-columns: 156px minmax(184px, 210px) minmax(420px, 1fr);
  }

  .workspace.management-shell {
    grid-template-columns: 156px minmax(620px, 1fr) 286px;
  }

  .workspace.management-shell.assistant-collapsed {
    grid-template-columns: 156px minmax(620px, 1fr);
  }

  .management-rail {
    width: 156px;
  }

  .management-rail .rail-button,
  .management-rail .profile-menu,
  .management-rail .profile-menu summary {
    width: 136px;
  }

  .em-project-header {
    grid-template-columns: minmax(210px, 270px) minmax(0, 1fr);
    padding-inline: 14px;
  }

  .pm-overview-primary-grid,
  .pm-overview-secondary-grid {
    grid-template-columns: 1fr;
  }

  .pm-readiness-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .pm-project-info-grid {
    grid-template-columns: 1fr;
  }

  .em-project-content {
    padding-inline: 14px;
  }

  .em-overview-summary {
    grid-template-columns: 1fr;
  }

  .em-lifecycle-action {
    grid-template-columns: 1fr;
    align-items: start;
  }

  .em-lifecycle-action button {
    width: fit-content;
  }

  .project-runbook-focus-steps > li {
    grid-template-columns: 18px minmax(0, 1fr);
  }

  .project-runbook-focus-steps > li > button {
    grid-column: 2;
    width: fit-content;
  }

  .em-overview-primary-grid {
    grid-template-columns: 1fr;
  }

  .em-readiness-grid {
    grid-template-columns: repeat(3, minmax(130px, 1fr));
  }

  .em-settings-summary {
    grid-template-columns: 1fr;
  }

  .em-settings-grid {
    grid-template-columns: repeat(2, minmax(210px, 1fr));
  }

  .em-story-detail-grid {
    grid-template-columns: 1fr;
  }

  .em-story-detail-summary {
    grid-template-columns: repeat(3, minmax(120px, 1fr));
  }
}

@media (max-width: 760px) {
  .generation-operation-status {
    grid-template-columns: minmax(0, 1fr);
  }

  .generation-operation-status > button {
    width: 100%;
    min-height: 44px;
  }

  .running-tasks-panel {
    top: calc(58px + env(safe-area-inset-top, 0px));
    bottom: env(safe-area-inset-bottom, 0px);
    width: min(390px, 88vw);
    height: auto;
  }

  .workspace.support-workspace,
  .workspace.support-workspace.assistant-collapsed {
    grid-template-columns: minmax(0, 1fr);
  }

  .workspace.support-workspace .management-rail {
    width: auto;
  }

  .em-my-work-heading {
    align-items: flex-start;
    flex-direction: column;
    gap: 10px;
  }

  .em-my-work-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .em-my-work-project-head,
  .em-my-work-project-body > button,
  .em-lifecycle-action button {
    min-height: 44px;
  }

  .em-lifecycle-action button {
    width: 100%;
  }

  .project-runbook-focus-head {
    align-items: flex-start;
    flex-direction: column;
    gap: 5px;
  }

  .project-runbook-focus-steps > li > button {
    width: 100%;
    min-height: 44px;
  }
}

/* Topbar contract: product title and persona controls follow the active theme. */
.topbar {
  background-color: var(--topbar-bg) !important;
  border-bottom-color: var(--topbar-border) !important;
  color: var(--topbar-ink) !important;
}

.persona-chip {
  background-color: var(--topbar-control-bg) !important;
  border-color: var(--topbar-control-border) !important;
  color: var(--topbar-ink) !important;
}

.permissions-topbar-button {
  background-color: var(--topbar-control-bg) !important;
  border-color: var(--topbar-control-border) !important;
  color: var(--topbar-ink) !important;
}

.message-envelope-button {
  background-color: var(--topbar-control-bg) !important;
  border-color: var(--topbar-control-border) !important;
  color: var(--topbar-ink) !important;
}

.persona-chip:hover,
.permissions-topbar-button:hover,
.permissions-topbar-button:focus-visible,
.message-envelope-button:hover,
.message-envelope-button:focus-visible {
  background-color: var(--topbar-control-hover-bg) !important;
  border-color: var(--topbar-active-border) !important;
}

.product-home {
  background: transparent !important;
  background-color: transparent !important;
  border-color: transparent !important;
  color: var(--topbar-ink) !important;
  box-shadow: none !important;
}

.product-home:hover {
  background: transparent !important;
  background-color: transparent !important;
  border-color: transparent !important;
  color: var(--topbar-ink) !important;
}

.persona-strip > span {
  color: var(--topbar-muted) !important;
}

.persona-chip.active {
  background-color: var(--topbar-active-bg) !important;
  border-color: var(--topbar-active-border) !important;
  color: var(--accent-ink) !important;
  box-shadow: inset 0 -2px 0 var(--accent) !important;
}

.persona-chip.pending {
  background-color: var(--topbar-active-bg) !important;
  border-color: var(--topbar-active-border) !important;
  color: var(--accent-ink) !important;
  opacity: 1 !important;
  filter: none;
}

.message-envelope-button.has-unread {
  background-color: var(--topbar-active-bg) !important;
  border-color: var(--topbar-active-border) !important;
  color: var(--accent-ink) !important;
}

/* Assistant edge contract: open and collapsed Emery chrome follows the theme. */
.assistant-pane {
  background-color: var(--panel-bg) !important;
  border-left-color: var(--border-strong) !important;
  color: var(--text-primary) !important;
}

.assistant-header,
.composer,
.assistant-foot {
  background-color: var(--panel-header-bg) !important;
  border-color: var(--border-strong) !important;
  color: var(--text-primary) !important;
}

.assistant-toggle {
  background-color: var(--field-bg) !important;
  border-color: var(--border-soft) !important;
  color: var(--text-primary) !important;
}

.assistant-peek {
  background-color: var(--panel-header-bg) !important;
  border-color: var(--border-strong) !important;
  color: var(--accent-ink) !important;
  box-shadow: var(--shadow-card) !important;
}

.assistant-peek span {
  color: var(--accent-ink) !important;
}

/* My Focus keeps the global rail, removes the project rail, and reserves one
   stable detail surface so selection never causes a distracting page reflow. */
.workspace.my-focus-workspace {
  grid-template-columns: 72px minmax(560px, 1fr) clamp(360px, 31vw, 440px);
}

.app-shell:has(.workspace.my-focus-workspace) {
  min-width: 0;
}

.workspace.my-focus-workspace.my-focus-drawer-open {
  grid-template-columns: 72px minmax(560px, 1fr) clamp(360px, 31vw, 440px);
}

.workspace.my-focus-workspace .portfolio {
  display: none;
}

.workspace.my-focus-workspace .mission {
  grid-column: 2;
  min-width: 0;
}

.workspace.my-focus-workspace .assistant-pane {
  grid-column: 3;
}

.my-focus-screen {
  min-height: 100%;
  display: grid;
  align-content: start;
  gap: 20px;
  padding: clamp(24px, 4vw, 52px);
  background:
    radial-gradient(circle at 45% -10%, color-mix(in srgb, var(--accent-soft) 35%, transparent), transparent 42%),
    var(--pane-bg);
}

.my-focus-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 24px;
}

.my-focus-heading h1 {
  margin: 2px 0 5px;
  font-size: clamp(24px, 2.3vw, 34px);
  line-height: 1.1;
}

.my-focus-heading p {
  margin: 0;
  color: var(--text-secondary);
}

.my-focus-count {
  padding: 6px 9px;
  border: 1px solid var(--border-soft);
  border-radius: 999px;
  background: var(--panel-bg-subtle);
  color: var(--text-secondary);
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap;
}

.my-focus-starter-banner {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  min-height: 66px;
  padding: 12px 14px;
  border: 1px solid color-mix(in srgb, var(--accent) 38%, var(--border-soft));
  border-radius: 12px;
  background: color-mix(in srgb, var(--accent-soft) 38%, var(--panel-bg));
  box-shadow: var(--shadow-card);
}

.my-focus-starter-banner strong,
.my-focus-starter-banner p {
  display: block;
  margin: 0;
}

.my-focus-starter-banner p {
  margin-top: 3px;
  color: var(--text-secondary);
}

.my-focus-mark {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: var(--accent-soft);
  color: var(--accent-ink);
}

.my-focus-mark svg {
  width: 22px;
  height: 22px;
}

.my-focus-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.my-focus-card {
  position: relative;
  min-width: 0;
  min-height: 132px;
  display: grid;
  grid-template-columns: 5px minmax(0, 1fr) auto;
  gap: 14px;
  align-items: stretch;
  padding: 16px 14px 14px 0;
  border: 1px solid var(--border-soft);
  border-radius: 13px;
  background: var(--panel-bg);
  box-shadow: var(--shadow-card);
  overflow: hidden;
  transition: border-color .16s ease, background-color .16s ease, transform .16s ease;
}

.my-focus-card:hover {
  border-color: var(--border-strong);
  transform: translateY(-1px);
}

.my-focus-card.selected {
  border-color: var(--accent);
  background: color-mix(in srgb, var(--accent-soft) 16%, var(--panel-bg));
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--accent) 75%, transparent), var(--shadow-card);
}

.my-focus-signal {
  width: 5px;
  height: 100%;
  border-radius: 0 5px 5px 0;
  background: var(--accent);
}

.my-focus-signal.danger { background: var(--danger); }
.my-focus-signal.warning { background: var(--orange); }
.my-focus-signal.complete { background: var(--text-tertiary); }
.my-focus-signal.active { background: var(--green); }

.my-focus-card-copy {
  position: relative;
  z-index: 2;
  min-width: 0;
  display: grid;
  align-content: start;
  gap: 7px;
  pointer-events: none;
}

.my-focus-card-copy > p {
  margin: 0;
  color: var(--text-tertiary);
  font-size: 10px;
  font-weight: 850;
  letter-spacing: .05em;
  text-transform: uppercase;
}

.my-focus-card-copy h2 {
  margin: 0;
  color: var(--text-primary);
  font-size: 15px;
  line-height: 1.34;
}

.my-focus-card-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: auto;
}

.my-focus-badge {
  display: inline-flex;
  align-items: center;
  min-height: 21px;
  max-width: 100%;
  padding: 2px 7px;
  border: 1px solid var(--status-neutral-border);
  border-radius: 999px;
  background: var(--status-neutral-bg);
  color: var(--status-neutral-fg);
  font-size: 10px;
  font-weight: 800;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.my-focus-badge.danger {
  border-color: var(--status-danger-border);
  background: var(--status-danger-bg);
  color: var(--status-danger-fg);
}

.my-focus-badge.warning {
  border-color: var(--status-warn-border);
  background: var(--status-warn-bg);
  color: var(--status-warn-fg);
}

.my-focus-badge.active {
  border-color: var(--status-ok-border);
  background: var(--status-ok-bg);
  color: var(--status-ok-fg);
}

.my-focus-badge.complete,
.my-focus-badge.muted {
  border-color: var(--border-soft);
  background: var(--panel-bg-muted);
  color: var(--text-secondary);
}

.my-focus-card-mark {
  position: relative;
  z-index: 2;
  align-self: start;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--accent-ink);
  pointer-events: none;
}

.my-focus-card-mark small {
  padding: 3px 6px;
  border-radius: 999px;
  background: var(--accent-soft);
  color: var(--accent-ink);
  font-size: 9px;
  font-weight: 850;
  letter-spacing: .03em;
  text-transform: uppercase;
}

.my-focus-card-mark svg,
.my-focus-remove svg {
  width: 19px;
  height: 19px;
}

.my-focus-chevron {
  position: relative;
  z-index: 3;
  width: 31px;
  min-height: 31px;
  display: grid;
  place-items: center;
  align-self: end;
  padding: 0;
  border-color: var(--border-soft);
  border-radius: 999px;
  background: var(--field-bg);
  color: var(--text-primary);
  transition: transform .16s ease, border-color .16s ease, background-color .16s ease;
}

.my-focus-chevron svg {
  display: block;
  width: 17px;
  height: 17px;
  stroke: currentColor;
}

.my-focus-card .my-focus-chevron {
  position: absolute;
  right: 13px;
  bottom: 13px;
}

.my-focus-card-selector {
  position: absolute;
  z-index: 1;
  inset: 0;
  width: 100%;
  height: 100%;
  padding: 0;
  border: 0;
  border-radius: inherit;
  background: transparent;
  cursor: pointer;
}

.my-focus-chevron:hover {
  border-color: var(--accent);
  background: var(--accent-soft);
}

.my-focus-chevron.open {
  transform: rotate(180deg);
}

.my-focus-empty {
  min-height: 300px;
  display: grid;
  justify-items: center;
  align-content: center;
  gap: 9px;
  padding: 36px;
  border: 1px dashed var(--border-strong);
  border-radius: 14px;
  background: color-mix(in srgb, var(--panel-bg) 70%, transparent);
  text-align: center;
}

.my-focus-empty h2,
.my-focus-empty p {
  margin: 0;
}

.my-focus-empty p {
  max-width: 430px;
  color: var(--text-secondary);
}

.my-focus-loading,
.my-focus-error {
  padding: 12px;
  border: 1px solid var(--border-soft);
  border-radius: 9px;
  background: var(--panel-bg-subtle);
  color: var(--text-secondary);
}

.my-focus-error {
  border-color: var(--status-danger-border);
  background: var(--status-danger-bg);
  color: var(--status-danger-fg);
}

.my-focus-loading.compact {
  margin: 0 0 12px;
  padding: 8px 10px;
  font-size: 11px;
}

.my-focus-drawer {
  grid-column: 3;
  grid-row: 1;
  min-width: 0;
  min-height: calc(100dvh - 48px);
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  border-left: 1px solid var(--border-strong);
  background: var(--panel-bg);
  box-shadow: var(--shadow-strong);
  color: var(--text-primary);
  overflow: hidden;
}

.my-focus-drawer.empty {
  grid-template-rows: minmax(0, 1fr);
  background: color-mix(in srgb, var(--panel-bg) 84%, var(--pane-bg));
  box-shadow: none;
}

.my-focus-drawer-placeholder {
  max-width: 270px;
  display: grid;
  justify-items: center;
  align-content: center;
  gap: 9px;
  margin: auto;
  padding: 28px;
  color: var(--text-secondary);
  text-align: center;
}

.my-focus-drawer-placeholder h2,
.my-focus-drawer-placeholder p {
  margin: 0;
}

.my-focus-drawer-placeholder h2 {
  color: var(--text-primary);
  font-size: 16px;
}

.my-focus-drawer-placeholder p {
  line-height: 1.5;
}

.my-focus-assistant-launcher {
  white-space: nowrap;
}

.my-focus-drawer > header {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: start;
  gap: 11px;
  padding: 17px 16px 15px;
  border-bottom: 1px solid var(--border-strong);
  background: var(--panel-header-bg);
}

.my-focus-drawer > header p,
.my-focus-drawer > header h2 {
  margin: 0;
}

.my-focus-drawer > header p {
  color: var(--text-tertiary);
  font-size: 10px;
  font-weight: 850;
  letter-spacing: .05em;
  text-transform: uppercase;
}

.my-focus-drawer > header h2 {
  margin-top: 4px;
  font-size: 15px;
  line-height: 1.3;
}

.my-focus-remove {
  width: 31px;
  min-height: 31px;
  padding: 0;
  border-radius: 999px;
  border-color: var(--accent);
  background: var(--accent-soft);
  color: var(--accent-ink);
  font-size: 19px;
}

.my-focus-drawer-scroll {
  min-height: 0;
  overflow: auto;
}

.my-focus-drawer-section {
  display: grid;
  gap: 10px;
  padding: 17px 18px;
  border-bottom: 1px solid var(--border-soft);
}

.my-focus-drawer-section > p {
  margin: 0;
  color: var(--text-secondary);
  line-height: 1.5;
}

.my-focus-section-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.my-focus-section-heading p {
  margin: 0;
}

.my-focus-section-heading > span:not(.my-focus-badge) {
  color: var(--text-tertiary);
  font-size: 11px;
  font-weight: 800;
}

.my-focus-progress {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.my-focus-progress > div {
  position: relative;
  display: grid;
  justify-items: center;
  gap: 6px;
  color: var(--text-tertiary);
  font-size: 9px;
  text-align: center;
}

.my-focus-progress > div::before {
  content: "";
  position: absolute;
  top: 5px;
  left: 0;
  right: 0;
  height: 2px;
  background: var(--border-strong);
}

.my-focus-progress > div:first-child::before { left: 50%; }
.my-focus-progress > div:last-child::before { right: 50%; }

.my-focus-progress span {
  position: relative;
  z-index: 1;
  width: 12px;
  height: 12px;
  border: 2px solid var(--border-strong);
  border-radius: 999px;
  background: var(--panel-bg);
}

.my-focus-progress .done,
.my-focus-progress .current {
  color: var(--text-primary);
}

.my-focus-progress .done::before,
.my-focus-progress .current::before {
  background: var(--green);
}

.my-focus-progress .done span {
  border-color: var(--green);
  background: var(--green);
}

.my-focus-progress .current span {
  border-color: var(--accent);
  background: var(--accent);
  box-shadow: 0 0 0 4px var(--accent-soft);
}

.my-focus-ownership {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin: 0;
}

.my-focus-ownership > div {
  display: grid;
  gap: 3px;
  padding: 9px;
  border: 1px solid var(--border-soft);
  border-radius: 8px;
  background: var(--panel-bg-subtle);
}

.my-focus-ownership dt {
  color: var(--text-tertiary);
  font-size: 9px;
  font-weight: 850;
  text-transform: uppercase;
}

.my-focus-ownership dd {
  margin: 0;
  font-weight: 750;
}

.my-focus-generated {
  display: grid;
  gap: 7px;
}

.my-focus-generated > button,
.my-focus-generated > div {
  min-width: 0;
  min-height: 48px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 2px 10px;
  align-items: center;
  padding: 8px 10px;
  border: 1px solid var(--border-soft);
  border-radius: 8px;
  background: var(--panel-bg-subtle);
  color: var(--text-primary);
  text-align: left;
}

.my-focus-generated > button:hover,
.my-focus-generated > button.selected {
  border-color: var(--accent);
  background: var(--accent-soft);
}

.my-focus-generated strong {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.my-focus-generated small {
  color: var(--text-tertiary);
}

.my-focus-generated span {
  grid-column: 2;
  grid-row: 1 / span 2;
  color: var(--accent-ink);
  font-size: 10px;
  font-weight: 850;
}

.my-focus-drawer-empty {
  padding: 12px;
  border: 1px dashed var(--border-soft);
  border-radius: 8px;
  background: var(--panel-bg-subtle);
  color: var(--text-tertiary) !important;
  text-align: center;
}

.my-focus-drawer > footer {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  padding: 12px 16px;
  border-top: 1px solid var(--border-strong);
  background: var(--panel-header-bg);
}

.my-focus-console-launch {
  min-width: 0;
  display: grid;
  gap: 3px;
  justify-items: start;
  padding: 10px 11px;
  border-color: var(--border-strong);
  background: var(--field-bg);
  color: var(--text-primary);
  text-align: left;
}

.my-focus-console-launch span {
  font-weight: 800;
}

.my-focus-console-launch small {
  max-width: 100%;
  color: var(--text-tertiary);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.my-focus-information-preview {
  display: grid;
  align-content: start;
  gap: 16px;
  padding: 17px 18px;
}

.my-focus-information-back {
  justify-self: start;
  border-color: transparent;
  background: transparent;
  color: var(--accent-ink);
}

.my-focus-information-heading {
  display: grid;
  gap: 5px;
}

.my-focus-information-heading p,
.my-focus-information-heading h3,
.my-focus-information-heading small {
  margin: 0;
}

.my-focus-information-heading h3 {
  font-size: 17px;
  line-height: 1.35;
}

.my-focus-information-heading small {
  color: var(--text-tertiary);
}

.my-focus-information-preview pre {
  min-height: 220px;
  margin: 0;
  padding: 14px;
  border: 1px solid var(--border-soft);
  border-radius: 9px;
  background: var(--panel-bg-subtle);
  color: var(--text-primary);
  font: 12px/1.6 var(--font-mono);
  overflow: auto;
  white-space: pre-wrap;
}

.my-focus-information-empty {
  display: grid;
  gap: 6px;
  padding: 18px;
  border: 1px dashed var(--border-strong);
  border-radius: 9px;
  background: var(--panel-bg-subtle);
  color: var(--text-secondary);
}

.my-focus-information-empty p {
  margin: 0;
  line-height: 1.5;
}

.my-focus-console-backdrop {
  padding: 24px;
}

.my-focus-console-lightbox {
  width: min(820px, calc(100vw - 40px));
  height: min(520px, calc(100dvh - 48px));
  min-height: 360px;
  display: grid;
  grid-template-rows: minmax(0, 1fr);
  border: 1px solid var(--border-strong);
  border-radius: 12px;
  background: var(--panel-bg);
  box-shadow: var(--shadow-strong);
  overflow: hidden;
}

.my-focus-console-lightbox > header {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 18px;
  padding: 14px 16px;
  border-bottom: 1px solid var(--border-strong);
  background: var(--panel-header-bg);
}

.my-focus-console-lightbox > header p,
.my-focus-console-lightbox > header h2,
.my-focus-console-lightbox > header small {
  margin: 0;
}

.my-focus-console-lightbox > header p {
  color: var(--text-tertiary);
  font-size: 10px;
  font-weight: 850;
  letter-spacing: .05em;
  text-transform: uppercase;
}

.my-focus-console-lightbox > header h2 {
  margin: 3px 0;
  font-size: 17px;
}

.my-focus-console-lightbox > header small {
  color: var(--text-secondary);
}

.my-focus-console-terminal {
  min-height: 0;
  padding: 15px 17px;
  border: 8px solid var(--terminal-border);
  background: var(--terminal-bg);
  color: var(--terminal-fg);
  overflow: auto;
}

.my-focus-console-terminal pre {
  margin: 0;
  font: 13px/1.55 var(--font-mono);
  white-space: pre-wrap;
}

.my-focus-console-lightbox > footer {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  padding: 11px 16px;
  border-top: 1px solid var(--border-strong);
  background: var(--panel-header-bg);
}

/* Shared Developer Work Console */
.artifact-lightbox.agent-lightbox.task-focused {
  width: min(880px, calc(100vw - 48px));
  height: min(620px, calc(100dvh - 48px));
  max-height: min(620px, calc(100dvh - 48px));
}

.my-focus-console-lightbox > .work-console,
.artifact-lightbox.agent-lightbox.task-focused > .work-console {
  height: 100%;
}

.work-console {
  position: relative;
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr) auto;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
  border-radius: inherit;
  background: var(--panel-bg);
  color: var(--text-primary);
}

.work-console.compact {
  grid-template-rows: auto minmax(0, 1fr) auto;
}

.work-console-header {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
  min-height: 70px;
  padding: 13px 56px 13px 17px;
  border-bottom: 1px solid var(--border-strong);
  background: var(--panel-header-bg);
}

.work-console-header > div {
  min-width: 0;
}

.work-console-header p,
.work-console-header h2,
.work-console-header small {
  margin: 0;
}

.work-console-header h2 {
  margin: 3px 0 2px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 17px;
  line-height: 1.25;
}

.work-console-header small {
  display: block;
  overflow: hidden;
  color: var(--text-secondary);
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 11px;
}

.work-console-status {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 27px;
  padding: 0 9px;
  border: 1px solid var(--border-soft);
  border-radius: 999px;
  background: var(--panel-bg-subtle);
  color: var(--text-secondary);
  font-size: 10px;
  font-weight: 850;
  white-space: nowrap;
}

.work-console-status::before {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--text-tertiary);
  content: "";
}

.work-console-status.active::before {
  background: var(--accent);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 18%, transparent);
}

.work-console-status.warn::before {
  background: var(--orange);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--orange) 18%, transparent);
}

.work-console-status.complete::before {
  background: var(--green);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--green) 18%, transparent);
}

.work-console-status.danger::before {
  background: var(--red);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--red) 18%, transparent);
}

.work-console-close {
  top: 18px;
  right: 15px;
}

.work-console-context {
  max-height: 205px;
  padding: 10px 14px 8px;
  overflow: auto;
  border-bottom: 1px solid var(--border-soft);
  background: var(--panel-bg);
}

.work-console-context .agent-task-focus-summary {
  gap: 6px;
}

.work-console-context .agent-task-focus-facts div,
.work-console-context .agent-task-focus-brief {
  padding: 6px 8px;
}

.work-console-context .agent-work-queue-controls {
  gap: 8px;
  margin: 0;
  padding: 6px 8px;
  border-color: var(--border-soft);
  background: var(--panel-bg-subtle);
}

.work-console-context .agent-work-queue-controls strong,
.work-console-context .agent-work-queue-controls small {
  font-size: 10px;
  line-height: 1.3;
}

.work-console-context .agent-work-queue-control-actions {
  gap: 5px;
}

.work-console-context .agent-work-queue-control-actions button {
  min-height: 30px;
  padding: 0 9px;
  font-size: 10px;
}

.work-console-session {
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  min-height: 0;
  padding: 10px;
  background: var(--panel-bg-muted);
}

.work-console-transcript {
  display: grid;
  align-content: start;
  gap: 6px;
  min-height: 0;
  padding: 14px 15px;
  overflow: auto;
  border: 1px solid var(--border-strong);
  border-bottom: 0;
  border-radius: 8px 8px 0 0;
  background: var(--panel-bg);
  color: var(--text-primary);
  scrollbar-color: var(--border-strong) transparent;
}

.work-console-message {
  position: relative;
  display: grid;
  grid-template-columns: max-content minmax(0, 1fr);
  gap: 2px 10px;
  width: min(100%, 760px);
  padding: 7px 9px 8px 12px;
  border-left: 2px solid var(--status-ok-fg);
  border-radius: 0 6px 6px 0;
  background: var(--panel-bg-subtle);
  color: var(--text-primary);
  font: 400 12px/1.55 var(--font-mono);
}

.work-console-message.user {
  justify-self: end;
  border-left-color: var(--accent);
  background: var(--panel-bg-selected);
}

.work-console-message.danger {
  border-left-color: var(--status-danger-fg);
}

.work-console-message strong {
  color: var(--status-ok-fg);
  font: 500 11px/1.5 var(--font-mono);
}

.work-console-message.user strong {
  color: var(--accent-ink);
}

.work-console-message > div {
  grid-column: 1 / -1;
  min-width: 0;
  color: var(--text-primary);
  overflow-wrap: anywhere;
}

.work-console-message > div p {
  margin: 0 0 6px;
}

.work-console-message > div p:last-child {
  margin-bottom: 0;
}

.work-console-message small {
  align-self: center;
  color: var(--text-secondary);
  font: 400 10px/1.4 var(--font-mono);
  text-align: right;
}

.work-console-composer {
  display: grid;
  gap: 6px;
  padding: 10px 11px 9px;
  border: 1px solid var(--border-strong);
  border-top-color: var(--border-soft);
  border-radius: 0 0 8px 8px;
  background: var(--panel-bg-subtle);
  color: var(--text-primary);
}

.work-console-composer > label {
  color: var(--text-secondary);
  font: 500 10px/1.4 var(--font-mono);
  letter-spacing: .02em;
}

.work-console-composer > div {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: stretch;
}

.work-console-composer textarea {
  min-height: 58px;
  max-height: 120px;
  resize: vertical;
  padding: 9px 10px;
  border-color: var(--border-strong);
  background: var(--field-bg);
  color: var(--text-primary);
  caret-color: var(--accent);
  font: 400 12px/1.5 var(--font-mono);
}

.work-console-composer textarea::placeholder {
  color: var(--text-tertiary);
}

.work-console-composer textarea:focus-visible {
  border-color: var(--accent);
  box-shadow: var(--focus-ring);
  outline: none;
}

.work-console-composer textarea:disabled {
  border-color: var(--border-soft);
  background: var(--panel-bg-muted);
  color: var(--text-secondary);
  cursor: not-allowed;
}

.work-console-composer textarea:disabled::placeholder {
  color: var(--text-secondary);
  opacity: 1;
}

.work-console-composer button {
  align-self: stretch;
  min-width: 76px;
  padding-inline: 14px;
}

.work-console-composer > p {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 5px;
  margin: 0;
  color: var(--text-secondary);
  font: 400 10px/1.4 var(--font-mono);
}

.work-console-state {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin-right: 3px;
  color: var(--text-secondary);
  font-weight: 500;
}

.work-console-state::before {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--text-tertiary);
  content: "";
}

.work-console-state.ready::before {
  background: var(--status-ok-fg);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--green) 18%, transparent);
}

.work-console-composer kbd {
  margin-left: auto;
  padding: 1px 5px;
  border: 1px solid var(--border-soft);
  border-radius: 4px;
  background: var(--panel-bg-muted);
  color: var(--text-secondary);
  font: inherit;
}

.work-console-footer {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  padding: 10px 15px;
  border-top: 1px solid var(--border-strong);
  background: var(--panel-header-bg);
}

.work-console .agent-task-plan-card {
  border-color: var(--border-soft);
  background: var(--panel-bg-subtle);
}

.work-console .agent-task-plan-card span,
.work-console .agent-task-plan-card pre,
.work-console .agent-task-plan-card strong {
  color: var(--text-primary);
  font-family: var(--font-mono);
}

.work-console .agent-task-choice-bubble {
  padding: 14px;
  border-color: var(--border-strong);
  border-radius: 8px;
  background: var(--panel-bg);
  box-shadow: none;
  color: var(--text-primary);
}

.work-console .agent-task-decision-label {
  color: var(--accent-ink);
}

.work-console .agent-task-decision-question,
.work-console .agent-task-choice-copy b {
  color: var(--text-primary);
}

.work-console .agent-task-decision-question {
  font-weight: 500;
}

.work-console .agent-task-choice-rows {
  border-color: var(--border-soft);
  border-radius: 6px;
  background: var(--panel-bg-subtle);
}

.work-console .agent-task-choice-row {
  border-color: var(--border-soft);
  color: var(--text-primary);
}

.work-console .agent-task-choice-row:hover {
  background: var(--panel-bg-muted);
}

.work-console .agent-task-choice-row.recommended {
  background: var(--panel-bg-selected);
}

.work-console .agent-task-choice-row:disabled {
  opacity: 1;
}

.work-console .agent-task-choice-number {
  border-color: var(--border-strong);
  color: var(--text-secondary);
}

.work-console .agent-task-choice-copy em {
  background: var(--panel-bg-muted);
  color: var(--text-secondary);
}

.work-console .agent-task-choice-copy small,
.work-console .agent-task-choice-arrow {
  color: var(--text-secondary);
}

.work-console .agent-task-custom-response-toggle,
.work-console .agent-task-decision-footer button {
  color: var(--text-secondary);
}

.work-console .agent-task-custom-response-toggle:hover,
.work-console .agent-task-decision-footer button:hover {
  background: var(--panel-bg-muted);
  color: var(--text-primary);
}

.work-console .agent-task-decision-footer {
  border-top-color: var(--border-soft);
}

.work-console-composer.read-only {
  gap: 0;
  padding-block: 8px;
}

.work-console-composer.read-only > label,
.work-console-composer.read-only > div {
  display: none;
}

.work-console-composer.read-only > p {
  min-height: 24px;
}

@media (max-width: 720px) {
  .artifact-lightbox.agent-lightbox.task-focused,
  .my-focus-console-lightbox {
    width: calc(100vw - 20px);
    height: calc(100dvh - 20px);
    max-height: calc(100dvh - 20px);
  }

  .work-console-header {
    grid-template-columns: minmax(0, 1fr);
    gap: 7px;
    padding-right: 50px;
  }

  .work-console-status {
    justify-self: start;
  }

  .work-console-context {
    max-height: 175px;
  }

  .work-console-context .agent-task-focus-facts {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .work-console-composer > div {
    grid-template-columns: minmax(0, 1fr);
  }

  .work-console-composer button {
    min-height: 40px;
  }

  .work-console-composer kbd,
  .work-console-composer kbd + span {
    display: none;
  }
}

.story-detail-focus-actions {
  display: grid;
  justify-items: end;
  gap: 7px;
}

.story-focus-control {
  min-height: 30px;
  gap: 6px;
  border-color: var(--border-soft);
  background: var(--panel-bg-subtle);
  color: var(--text-secondary);
  font-size: 10px;
}

.story-focus-control span {
  color: var(--accent-ink);
  line-height: 1;
}

.story-focus-control svg {
  width: 17px;
  height: 17px;
}

.story-focus-control.active {
  border-color: var(--accent);
  background: var(--accent-soft);
  color: var(--accent-ink);
}

@media (max-width: 1120px) {
  .workspace.my-focus-workspace,
  .workspace.my-focus-workspace.my-focus-drawer-open {
    grid-template-columns: 72px minmax(460px, 1fr) 370px;
  }
  .my-focus-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 900px) {
  .workspace.my-focus-workspace,
  .workspace.my-focus-workspace.my-focus-drawer-open {
    grid-template-columns: 72px minmax(0, 1fr);
  }
  .my-focus-drawer {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: min(440px, calc(100vw - 72px));
    z-index: 10;
  }
  .my-focus-drawer.empty {
    display: none;
  }
  .my-focus-starter-banner {
    grid-template-columns: auto 1fr;
  }
  .my-focus-starter-banner button {
    grid-column: 2;
    justify-self: start;
  }
}

/* Auth contract: login, first-use, and password-reset screens follow the active theme. */
.login-screen,
.auth-screen {
  background-color: var(--pane-bg) !important;
  color: var(--text-primary) !important;
}

.login-panel,
.auth-layout,
.auth-panel,
.auth-panel-inner {
  background-color: var(--panel-bg) !important;
  color: var(--text-primary) !important;
}

.login-panel {
  border-color: var(--border-soft) !important;
  box-shadow: var(--shadow-card) !important;
}

.auth-brand-panel {
  background-color: var(--rail-bg) !important;
  color: var(--rail-ink) !important;
}

.auth-product strong,
.auth-logo strong {
  color: var(--rail-ink) !important;
}

.auth-product > span,
.auth-status-row,
.auth-copyright {
  color: var(--rail-muted) !important;
}

.auth-status-row strong {
  color: var(--auth-status-ok) !important;
}

.auth-tabs {
  background-color: var(--panel-bg-subtle) !important;
  border-color: var(--border-soft) !important;
}

.auth-tabs span {
  color: var(--text-secondary) !important;
}

.auth-tabs span.active {
  background-color: var(--panel-bg) !important;
  color: var(--text-primary) !important;
  box-shadow: var(--shadow-card) !important;
}

.auth-copy h1,
.auth-form label {
  color: var(--text-primary) !important;
}

.auth-copy p:not(.eyebrow),
.auth-help,
.auth-divider,
.sso-button,
.sso-button em {
  color: var(--text-secondary) !important;
}

.auth-form input,
.auth-form select {
  background-color: var(--field-bg) !important;
  border-color: var(--border-soft) !important;
  color: var(--text-primary) !important;
  -webkit-text-fill-color: var(--text-primary) !important;
  caret-color: var(--accent-ink) !important;
}

.auth-form input::placeholder,
.auth-form select::placeholder {
  color: var(--placeholder) !important;
  -webkit-text-fill-color: var(--placeholder) !important;
}

.auth-form input:focus,
.auth-form select:focus {
  outline: 2px solid var(--focus-ring) !important;
  border-color: var(--accent) !important;
}

.auth-submit.secondary,
.sso-button {
  background-color: var(--field-bg) !important;
  border-color: var(--border-soft) !important;
  color: var(--text-primary) !important;
}

[data-company-primary] .sso-button.primary {
  width: 100%;
  min-height: 46px;
  background-color: var(--button-primary-bg) !important;
  border-color: var(--button-primary-bg) !important;
  color: var(--button-primary-fg) !important;
}

[data-company-primary] .sso-button.primary:hover:not(:disabled),
[data-company-primary] .sso-button.primary:focus-visible:not(:disabled) {
  background-color: var(--button-primary-hover-bg) !important;
  border-color: var(--button-primary-hover-bg) !important;
  color: var(--button-primary-fg) !important;
}

[data-company-primary] .sso-button.primary .sso-icon.enterprise {
  background-color: var(--button-primary-fg) !important;
  color: var(--button-primary-bg) !important;
}

.auth-divider::before,
.auth-divider::after {
  background-color: var(--border-soft) !important;
}

.sso-button em {
  background-color: var(--chip-bg) !important;
  border-color: var(--border-soft) !important;
}

.sso-icon.google,
.sso-icon.enterprise {
  background-color: var(--panel-bg-subtle) !important;
  border-color: var(--border-soft) !important;
  color: var(--accent-ink) !important;
}

/* Emery response contract: chat and prompt bubbles follow the active theme. */
.chat-log,
.support-chat-log {
  background-color: var(--panel-bg) !important;
  color: var(--text-primary) !important;
}

.message,
.chat-message,
.support-chat-message {
  background-color: var(--row-bg) !important;
  border-color: var(--border-soft) !important;
  color: var(--text-primary) !important;
}

.message.assistant,
.chat-message.assistant,
.support-chat-message.assistant {
  background-color: var(--panel-bg-subtle) !important;
  border-color: var(--border-soft) !important;
  color: var(--text-primary) !important;
}

.message.user,
.support-chat-message.user {
  background-color: var(--accent-soft) !important;
  border-color: color-mix(in srgb, var(--accent) 58%, var(--border-soft)) !important;
  color: var(--accent-ink) !important;
}

.message strong,
.chat-message strong,
.support-chat-message strong {
  color: inherit !important;
}

.message-body,
.message-body p,
.chat-message p,
.support-chat-message p {
  color: inherit !important;
}

.message-body code {
  background-color: var(--panel-bg-muted) !important;
  border-color: var(--border-soft) !important;
  color: var(--text-primary) !important;
}

.assistant-actions {
  background-color: var(--panel-bg) !important;
  border-color: var(--border-strong) !important;
}

.assistant-bubbles button {
  background-color: var(--chip-bg) !important;
  border-color: color-mix(in srgb, var(--accent) 52%, var(--border-soft)) !important;
  color: var(--accent-ink) !important;
}

.assistant-bubbles button:hover {
  background-color: var(--panel-bg-selected) !important;
  border-color: var(--accent) !important;
}

.llm-working,
.support-working {
  background-color: var(--orange-soft) !important;
  border-color: color-mix(in srgb, var(--orange) 48%, var(--border-soft)) !important;
  border-left-color: var(--orange) !important;
  box-shadow: var(--shadow-card) !important;
  color: var(--orange) !important;
}

.llm-working > span,
.support-working > span {
  border-color: color-mix(in srgb, var(--orange) 32%, var(--panel-bg)) !important;
  border-top-color: var(--orange) !important;
}

.llm-working strong,
.llm-working p,
.support-working strong,
.support-working p {
  color: var(--orange) !important;
}

/* Agent Console contract: graph, status panels, and activity rows stay polished in every theme. */
.developer-agent-console {
  color: var(--text-primary) !important;
}

.agent-console-head,
.agent-attention-summary,
.agent-graph-card,
.agent-activity-panel,
.agent-console-task,
.agent-task-row {
  background-color: var(--panel-bg) !important;
  border-color: var(--border-strong) !important;
  color: var(--text-primary) !important;
}

.agent-console-head p,
.agent-graph-head p,
.agent-attention-summary p,
.agent-attention-summary li,
.agent-activity-head p,
.agent-activity-row small,
.agent-activity-row p,
.agent-console-task p {
  color: var(--text-secondary) !important;
}

.agent-console-metrics span,
.agent-graph-legend span,
.agent-task-jira,
.agent-node-status,
.kanban-agent-status {
  background-color: var(--panel-bg-muted) !important;
  border-color: var(--border-soft) !important;
  color: var(--text-secondary) !important;
}

.agent-console-metrics strong,
.agent-flow-label strong,
.agent-console-task strong,
.agent-activity-row strong {
  color: var(--text-primary) !important;
}

.agent-flow-canvas {
  background-color: var(--panel-bg-subtle) !important;
  border-color: var(--border-strong) !important;
}

.agent-flow-group-box {
  background-color: color-mix(in srgb, var(--panel-bg-muted) 46%, transparent) !important;
  border-color: color-mix(in srgb, var(--border-strong) 74%, transparent) !important;
}

.agent-flow-group-box span,
.agent-flow-label span,
.agent-flow-label small,
.agent-flow-agent-label small {
  color: var(--text-secondary) !important;
}

.agent-flow-dev-icon {
  background-color: var(--panel-bg) !important;
  border-color: color-mix(in srgb, var(--accent) 66%, var(--border-strong)) !important;
}

.agent-flow-dev-icon::before,
.agent-flow-dev-icon::after {
  background-color: var(--accent) !important;
}

.agent-flow-canvas .react-flow__handle {
  background-color: var(--border-strong) !important;
  border-color: var(--panel-bg) !important;
}

.agent-flow-canvas .react-flow__edge-path {
  stroke: color-mix(in srgb, var(--accent) 44%, var(--border-strong)) !important;
}

.agent-flow-canvas .react-flow__edge-textbg {
  fill: var(--panel-bg) !important;
}

.agent-graph-legend .work,
.agent-node-status.work,
.agent-fallback-node.work {
  background-color: var(--green-soft) !important;
  border-color: color-mix(in srgb, var(--green) 60%, var(--border-soft)) !important;
  color: var(--green) !important;
}

.agent-graph-legend .input,
.agent-node-status.input,
.agent-fallback-node.input {
  background-color: var(--orange-soft) !important;
  border-color: color-mix(in srgb, var(--orange) 60%, var(--border-soft)) !important;
  color: var(--orange) !important;
}

.agent-graph-legend .error,
.agent-node-status.error,
.agent-fallback-node.error {
  background-color: var(--danger-soft) !important;
  border-color: color-mix(in srgb, var(--danger) 60%, var(--border-soft)) !important;
  color: var(--danger) !important;
}

.agent-node-status.done,
.agent-fallback-node.done {
  background-color: var(--green-soft) !important;
  border-color: color-mix(in srgb, var(--green) 60%, var(--border-soft)) !important;
  color: var(--green) !important;
}

.agent-node-status.idle,
.agent-fallback-node.idle {
  background-color: var(--accent-soft) !important;
  border-color: color-mix(in srgb, var(--accent) 54%, var(--border-soft)) !important;
  color: var(--accent-ink) !important;
}

.agent-attention-summary.ok {
  background-color: var(--green-soft) !important;
  border-color: color-mix(in srgb, var(--green) 58%, var(--border-soft)) !important;
}

.agent-attention-summary.warn {
  background-color: var(--orange-soft) !important;
  border-color: color-mix(in srgb, var(--orange) 58%, var(--border-soft)) !important;
}

.agent-attention-summary.danger {
  background-color: var(--danger-soft) !important;
  border-color: color-mix(in srgb, var(--danger) 58%, var(--border-soft)) !important;
}

.agent-attention-summary.neutral {
  background-color: var(--panel-bg-subtle) !important;
  border-color: var(--border-soft) !important;
}

/* Validation surfaces need state-specific contrast in every theme. */
html[data-theme] .validation-panel {
  background-color: var(--panel-bg-subtle) !important;
  border-color: var(--border-soft) !important;
  color: var(--text-primary) !important;
}

html[data-theme] .validation-panel strong,
html[data-theme] .validation-panel b {
  color: var(--text-primary) !important;
}

html[data-theme] .validation-panel p,
html[data-theme] .validation-panel small {
  color: var(--text-secondary) !important;
}

html[data-theme] .validation-panel.success {
  background-color: var(--green-soft) !important;
  border-color: color-mix(in srgb, var(--green) 62%, var(--border-soft)) !important;
}

html[data-theme] .validation-panel.success strong {
  color: var(--green) !important;
}

html[data-theme] .validation-panel.danger {
  background-color: var(--danger-soft) !important;
  border-color: color-mix(in srgb, var(--danger) 62%, var(--border-soft)) !important;
}

html[data-theme] .validation-panel.danger strong {
  color: var(--danger) !important;
}

html[data-theme] .validation-panel.working {
  background-color: var(--accent-soft) !important;
  border-color: color-mix(in srgb, var(--accent) 62%, var(--border-soft)) !important;
}

html[data-theme] .validation-panel.working strong {
  color: var(--accent-ink) !important;
}

/* Integration configuration surfaces follow the active theme, whether they are schema-driven or custom runtime panels. */
html[data-theme] .integration-config > .settings-section,
html[data-theme] .integration-config > .integration-fields,
html[data-theme] .integration-test-credentials,
html[data-theme] .integration-config-summary,
html[data-theme] .integration-placeholder,
html[data-theme] .integration-config .empty,
html[data-theme] .installed-setting-field,
html[data-theme] .a2a-registry-section,
html[data-theme] .a2a-agent-form {
  background-color: var(--panel-bg-subtle) !important;
  border-color: var(--border-soft) !important;
  color: var(--text-primary) !important;
}

html[data-theme] .integration-config-summary span,
html[data-theme] .integration-placeholder strong,
html[data-theme] .integration-test-credentials h5 {
  color: var(--text-primary) !important;
}

html[data-theme] .integration-config-summary b,
html[data-theme] .integration-placeholder p,
html[data-theme] .integration-test-credentials p,
html[data-theme] .integration-config .helper,
html[data-theme] .regulatory-provider-attribution {
  color: var(--text-secondary) !important;
}

html[data-theme] .integration-config .check-row,
html[data-theme] .a2a-agent-row {
  background-color: var(--row-bg) !important;
  border-color: var(--border-soft) !important;
  color: var(--text-primary) !important;
}

html[data-theme] .a2a-agent-row strong,
html[data-theme] .a2a-agent-row p {
  color: var(--text-primary) !important;
}

html[data-theme] .a2a-agent-row small,
html[data-theme] .a2a-agent-row span {
  color: var(--text-secondary) !important;
}

html[data-theme] .a2a-agent-row em {
  color: var(--danger) !important;
}

/* Work-product contract: design, artifacts, story evidence, and handoff surfaces follow the active theme. */
html[data-theme] .artifact-document,
html[data-theme] .story-editor-card,
html[data-theme] .implementation-card,
html[data-theme] .implementation-summary,
html[data-theme] .implementation-interactions article,
html[data-theme] .figma-card,
html[data-theme] .figma-object-card,
html[data-theme] .story-context-list li,
html[data-theme] .story-evidence-row,
html[data-theme] .handoff-card,
html[data-theme] .handoff-detail-card,
html[data-theme] .agent-dispatch-card,
html[data-theme] .artifact-summary-card,
html[data-theme] .artifact-declare-card,
html[data-theme] .artifact-registry,
html[data-theme] .artifact-filter-bar,
html[data-theme] .artifact-form,
html[data-theme] .artifact-table,
html[data-theme] .artifact-lightbox,
html[data-theme] .artifact-preview-pane,
html[data-theme] .artifact-preview-empty {
  background: var(--panel-bg) !important;
  border-color: var(--border-soft) !important;
  color: var(--text-primary) !important;
}

html[data-theme] .artifact-filter-bar,
html[data-theme] .artifact-table,
html[data-theme] .implementation-summary,
html[data-theme] .implementation-interactions article,
html[data-theme] .figma-object-card,
html[data-theme] .story-context-list li,
html[data-theme] .artifact-preview-pane {
  background: var(--panel-bg-subtle) !important;
  border-color: var(--border-strong) !important;
}

html[data-theme] .artifact-declare-head,
html[data-theme] .artifact-preview-meta span,
html[data-theme] .handoff-detail-card dl div,
html[data-theme] .handoff-detail-card section,
html[data-theme] .figma-object-preview,
html[data-theme] .artifact-preview-text,
html[data-theme] .button-like {
  background: var(--panel-header-bg) !important;
  border-color: var(--border-soft) !important;
  color: var(--text-primary) !important;
}

html[data-theme] .story-evidence-row.figma,
html[data-theme] .figma-object-card {
  background: var(--accent-soft) !important;
  border-color: color-mix(in srgb, var(--accent) 42%, var(--border-soft)) !important;
}

html[data-theme] .story-evidence-row.comment {
  background: var(--orange-soft) !important;
  border-color: color-mix(in srgb, var(--orange) 42%, var(--border-soft)) !important;
}

html[data-theme] .story-evidence-row.plan,
html[data-theme] .story-evidence-row.markdown {
  background: var(--green-soft) !important;
  border-color: color-mix(in srgb, var(--green) 42%, var(--border-soft)) !important;
}

html[data-theme] .handoff-card {
  background: var(--accent-soft) !important;
  border-color: color-mix(in srgb, var(--accent) 52%, var(--border-soft)) !important;
}

html[data-theme] .artifact-document p,
html[data-theme] .artifact-document li,
html[data-theme] .artifact-document ul,
html[data-theme] .artifact-summary-card span,
html[data-theme] .artifact-summary-card p,
html[data-theme] .artifact-declare-card p,
html[data-theme] .artifact-row small,
html[data-theme] .artifact-preview-meta span,
html[data-theme] .artifact-preview-empty p,
html[data-theme] .implementation-summary p,
html[data-theme] .implementation-summary li,
html[data-theme] .implementation-interactions small,
html[data-theme] .figma-object-card small,
html[data-theme] .figma-object-card p,
html[data-theme] .figma-file,
html[data-theme] .story-context-list span,
html[data-theme] .handoff-detail-card dt,
html[data-theme] .handoff-detail-card section span,
html[data-theme] .handoff-detail-card section p {
  color: var(--text-secondary) !important;
}

html[data-theme] .artifact-document h1,
html[data-theme] .artifact-document h2,
html[data-theme] .artifact-document h3,
html[data-theme] .artifact-summary-card strong,
html[data-theme] .artifact-row strong,
html[data-theme] .implementation-summary h1,
html[data-theme] .implementation-summary h2,
html[data-theme] .implementation-summary h3,
html[data-theme] .implementation-interactions strong,
html[data-theme] .figma-object-card strong,
html[data-theme] .story-context-list strong,
html[data-theme] .handoff-detail-card h4,
html[data-theme] .handoff-detail-card dd {
  color: var(--text-primary) !important;
}

html[data-theme] .artifact-preview-frame {
  background: var(--panel-bg) !important;
}

html[data-theme] .metric-lightbox-backdrop,
html[data-theme] .artifact-lightbox-backdrop {
  background: var(--modal-scrim) !important;
}

/* Agent lightbox contract: overlay console surfaces follow the active theme, not legacy light defaults. */
html[data-theme] .agent-lightbox-backdrop {
  background: var(--modal-scrim) !important;
}

html[data-theme] .agent-lightbox,
html[data-theme] .agent-lightbox .metric-lightbox-head,
html[data-theme] .agent-lightbox .agent-console-summary div,
html[data-theme] .agent-lightbox .agent-lightbox-details,
html[data-theme] .agent-lightbox .agent-lightbox-tasks,
html[data-theme] .agent-lightbox .agent-task-conversation,
html[data-theme] .agent-lightbox .agent-console-task,
html[data-theme] .agent-lightbox .agent-skill-cloud span,
html[data-theme] .agent-lightbox .agent-task-row {
  background: var(--panel-bg) !important;
  border-color: var(--border-strong) !important;
  color: var(--text-primary) !important;
}

html[data-theme] .agent-lightbox .agent-console-summary div,
html[data-theme] .agent-lightbox .agent-console-task,
html[data-theme] .agent-lightbox .agent-skill-cloud span,
html[data-theme] .agent-lightbox .agent-task-focus-facts div,
html[data-theme] .agent-lightbox .agent-task-focus-brief,
html[data-theme] .agent-lightbox .agent-task-chat,
html[data-theme] .agent-lightbox .agent-task-plan-card,
html[data-theme] .agent-lightbox .agent-task-followup textarea {
  background: var(--panel-bg-subtle) !important;
  border-color: var(--border-soft) !important;
}

html[data-theme] .agent-lightbox .agent-task-chat-message {
  background: var(--panel-bg) !important;
  border-color: var(--border-soft) !important;
}

html[data-theme] .agent-lightbox .agent-task-chat-message.user {
  background: var(--panel-bg-muted) !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

html[data-theme] .agent-lightbox.task-focused .agent-task-chat {
  background: var(--panel-bg) !important;
  border-color: transparent !important;
}

html[data-theme] .agent-lightbox.task-focused .agent-task-chat-message.agent,
html[data-theme] .agent-lightbox.task-focused .agent-task-chat-message.decision {
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

html[data-theme] .agent-lightbox.task-focused .agent-task-choice-bubble,
html[data-theme] .agent-lightbox.task-focused .agent-task-plan-bubble {
  background: var(--panel-bg) !important;
  border-color: var(--border-strong) !important;
}

html[data-theme] .agent-lightbox.task-focused .work-console .agent-task-choice-bubble,
html[data-theme] .my-focus-console-lightbox .work-console .agent-task-choice-bubble {
  border-color: var(--border-strong) !important;
  background: var(--panel-bg) !important;
}

html[data-theme] .agent-lightbox.task-focused .agent-task-artifact-panel {
  background: var(--panel-bg) !important;
  border-color: var(--border-soft) !important;
}

html[data-theme] .agent-lightbox .metric-lightbox-head p,
html[data-theme] .agent-lightbox .agent-console-summary span,
html[data-theme] .agent-lightbox .agent-lightbox-details p,
html[data-theme] .agent-lightbox .agent-lightbox-details dt,
html[data-theme] .agent-lightbox .agent-console-task small,
html[data-theme] .agent-lightbox .agent-console-task p,
html[data-theme] .agent-lightbox .agent-task-focus-title p,
html[data-theme] .agent-lightbox .agent-task-focus-facts span,
html[data-theme] .agent-lightbox .agent-task-focus-brief p,
html[data-theme] .agent-lightbox .agent-task-chat-message small,
html[data-theme] .agent-lightbox .agent-task-plan-card span,
html[data-theme] .agent-lightbox .agent-task-row small,
html[data-theme] .agent-lightbox .agent-task-row p {
  color: var(--text-secondary) !important;
}

html[data-theme] .agent-lightbox .metric-lightbox-head h2,
html[data-theme] .agent-lightbox .agent-console-summary strong,
html[data-theme] .agent-lightbox .agent-lightbox-details h4,
html[data-theme] .agent-lightbox .agent-lightbox-details dd,
html[data-theme] .agent-lightbox .agent-lightbox-tasks h4,
html[data-theme] .agent-lightbox .agent-task-focus-title h3,
html[data-theme] .agent-lightbox .agent-task-focus-facts strong,
html[data-theme] .agent-lightbox .agent-task-focus-brief strong,
html[data-theme] .agent-lightbox .agent-task-chat-message strong,
html[data-theme] .agent-lightbox .agent-task-chat-message div,
html[data-theme] .agent-lightbox .agent-task-plan-card pre,
html[data-theme] .agent-lightbox .agent-console-task strong,
html[data-theme] .agent-lightbox .agent-task-row strong {
  color: var(--text-primary) !important;
}

html[data-theme] .agent-lightbox .agent-task-followup textarea,
html[data-theme] .agent-lightbox .agent-task-chat-composer textarea {
  color: var(--text-primary) !important;
}

html[data-theme] .agent-lightbox .agent-task-followup textarea::placeholder,
html[data-theme] .agent-lightbox .agent-task-chat-composer textarea::placeholder {
  color: var(--placeholder) !important;
}

html[data-theme] .agent-lightbox .metric-lightbox-close,
html[data-theme] .agent-lightbox .agent-task-conversation-close {
  background: var(--panel-bg-muted) !important;
  border-color: var(--border-soft) !important;
  color: var(--text-primary) !important;
}

html[data-theme] .agent-lightbox .metric-lightbox-close:hover,
html[data-theme] .agent-lightbox .agent-task-conversation-close:hover {
  background: var(--panel-bg-selected) !important;
  color: var(--accent-ink) !important;
}

html[data-theme] .agent-lightbox .agent-node-status {
  background: var(--panel-bg-muted) !important;
  border-color: var(--border-soft) !important;
  color: var(--text-primary) !important;
}

html[data-theme] .agent-lightbox .agent-node-status.work {
  background: var(--green-soft) !important;
  border-color: color-mix(in srgb, var(--green) 56%, var(--border-soft)) !important;
  color: var(--green) !important;
}

html[data-theme] .agent-lightbox .agent-node-status.input {
  background: var(--orange-soft) !important;
  border-color: color-mix(in srgb, var(--orange) 56%, var(--border-soft)) !important;
  color: var(--orange) !important;
}

html[data-theme] .agent-lightbox .agent-node-status.error {
  background: var(--danger-soft) !important;
  border-color: color-mix(in srgb, var(--danger) 56%, var(--border-soft)) !important;
  color: var(--danger) !important;
}

html[data-theme] .agent-lightbox .agent-node-status.done,
html[data-theme] .agent-lightbox .agent-node-status.idle {
  background: var(--accent-soft) !important;
  border-color: color-mix(in srgb, var(--accent) 48%, var(--border-soft)) !important;
  color: var(--accent-ink) !important;
}

/* Stronger agent graph override: older graph shorthands should not leak another theme. */
html[data-theme] .developer-agent-console .agent-console-head,
html[data-theme] .developer-agent-console .agent-attention-summary,
html[data-theme] .developer-agent-console .agent-graph-card,
html[data-theme] .developer-agent-console .agent-activity-panel,
html[data-theme] .developer-agent-console .agent-console-task,
html[data-theme] .developer-agent-console .agent-task-row,
html[data-theme] .developer-agent-console .agent-console-metrics span,
html[data-theme] .developer-agent-console .agent-graph-legend span,
html[data-theme] .developer-agent-console .agent-fallback-node,
html[data-theme] .developer-agent-console .agent-task-jira,
html[data-theme] .kanban-agent-status {
  background: var(--panel-bg) !important;
  border-color: var(--border-strong) !important;
  color: var(--text-primary) !important;
}

html[data-theme] .developer-agent-console .agent-flow-canvas {
  background: var(--panel-bg-subtle) !important;
  border-color: var(--border-strong) !important;
}

html[data-theme] .developer-agent-console .agent-flow-group-box {
  background: color-mix(in srgb, var(--panel-bg-muted) 52%, transparent) !important;
  border-color: color-mix(in srgb, var(--border-strong) 78%, transparent) !important;
}

html[data-theme] .developer-agent-console .agent-flow-group-box span,
html[data-theme] .developer-agent-console .agent-flow-label span,
html[data-theme] .developer-agent-console .agent-flow-label small,
html[data-theme] .developer-agent-console .agent-console-task p,
html[data-theme] .developer-agent-console .agent-task-jira small,
html[data-theme] .developer-agent-console .agent-activity-row small,
html[data-theme] .developer-agent-console .agent-activity-row p,
html[data-theme] .kanban-agent-status em {
  color: var(--text-secondary) !important;
}

html[data-theme] .developer-agent-console .agent-flow-label strong,
html[data-theme] .developer-agent-console .agent-console-metrics strong,
html[data-theme] .developer-agent-console .agent-console-task strong,
html[data-theme] .developer-agent-console .agent-activity-row strong {
  color: var(--text-primary) !important;
}

html[data-theme] .developer-agent-console .agent-flow-dev-icon {
  background: var(--panel-bg) !important;
  border-color: color-mix(in srgb, var(--accent) 54%, var(--border-soft)) !important;
}

html[data-theme] .developer-agent-console .agent-flow-dev-icon::before,
html[data-theme] .developer-agent-console .agent-flow-dev-icon::after {
  background: var(--accent) !important;
}

html[data-theme] .developer-agent-console .agent-flow-canvas .react-flow__handle {
  background: var(--accent) !important;
  border-color: var(--panel-bg-subtle) !important;
}

html[data-theme] .developer-agent-console .agent-flow-canvas .react-flow__edge-textbg {
  fill: var(--panel-bg) !important;
}

html[data-theme] .developer-agent-console .agent-terminal-view {
  background: var(--panel-bg-subtle) !important;
  border-color: var(--border-strong) !important;
  color: var(--text-primary) !important;
}

html[data-theme] .developer-agent-console .agent-graph-warning,
html[data-theme] .developer-agent-console .agent-attention-summary.warn {
  background: var(--orange-soft) !important;
  border-color: color-mix(in srgb, var(--orange) 54%, var(--border-soft)) !important;
  color: var(--orange) !important;
}

html[data-theme] .developer-agent-console .agent-attention-summary.ok {
  background: var(--green-soft) !important;
  border-color: color-mix(in srgb, var(--green) 54%, var(--border-soft)) !important;
  color: var(--green) !important;
}

html[data-theme] .developer-agent-console .agent-attention-summary.danger {
  background: var(--danger-soft) !important;
  border-color: color-mix(in srgb, var(--danger) 54%, var(--border-soft)) !important;
  color: var(--danger) !important;
}

html[data-theme] .developer-agent-console .agent-attention-summary.neutral {
  background: var(--panel-bg-muted) !important;
  border-color: var(--border-soft) !important;
  color: var(--text-primary) !important;
}

html[data-theme] .developer-agent-console .agent-graph-legend .work,
html[data-theme] .developer-agent-console .agent-fallback-node.work,
html[data-theme] .developer-agent-console .agent-node-status.work {
  background: var(--green-soft) !important;
  border-color: color-mix(in srgb, var(--green) 56%, var(--border-soft)) !important;
  color: var(--green) !important;
}

html[data-theme] .developer-agent-console .agent-graph-legend .input,
html[data-theme] .developer-agent-console .agent-fallback-node.input,
html[data-theme] .developer-agent-console .agent-node-status.input {
  background: var(--orange-soft) !important;
  border-color: color-mix(in srgb, var(--orange) 56%, var(--border-soft)) !important;
  color: var(--orange) !important;
}

html[data-theme] .developer-agent-console .agent-graph-legend .error,
html[data-theme] .developer-agent-console .agent-fallback-node.error,
html[data-theme] .developer-agent-console .agent-node-status.error {
  background: var(--danger-soft) !important;
  border-color: color-mix(in srgb, var(--danger) 56%, var(--border-soft)) !important;
  color: var(--danger) !important;
}

html[data-theme] .developer-agent-console .agent-fallback-node.done,
html[data-theme] .developer-agent-console .agent-node-status.done,
html[data-theme] .developer-agent-console .agent-fallback-node.idle,
html[data-theme] .developer-agent-console .agent-node-status.idle {
  background: var(--accent-soft) !important;
  border-color: color-mix(in srgb, var(--accent) 48%, var(--border-soft)) !important;
  color: var(--accent-ink) !important;
}

html[data-theme] .developer-agent-console .react-flow__controls {
  overflow: hidden !important;
  border: 1px solid var(--border-strong) !important;
  border-radius: 8px !important;
  background: var(--panel-bg) !important;
  background-color: var(--panel-bg) !important;
  box-shadow: var(--shadow-card) !important;
}

html[data-theme] .developer-agent-console .react-flow__controls-button {
  width: 26px !important;
  height: 26px !important;
  min-height: 26px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--border-soft) !important;
  border-color: var(--border-soft) !important;
  border-radius: 0 !important;
  background: var(--panel-bg) !important;
  background-color: var(--panel-bg) !important;
  color: var(--text-primary) !important;
  fill: var(--text-primary) !important;
}

html[data-theme] .developer-agent-console .react-flow__controls-button:hover {
  background: var(--panel-bg-muted) !important;
  background-color: var(--panel-bg-muted) !important;
  color: var(--accent-ink) !important;
  fill: var(--accent-ink) !important;
}

html[data-theme] .developer-agent-console .react-flow__controls-button:last-child {
  border-bottom: 0 !important;
}

html[data-theme] .developer-agent-console .react-flow__controls-button svg {
  fill: currentColor !important;
  color: inherit !important;
}

html[data-theme] .developer-agent-console .react-flow__controls-button svg path {
  fill: currentColor !important;
}

html[data-theme] .agent-graph-card,
html[data-theme] .agent-graph-card .agent-graph-legend span,
html[data-theme] .agent-graph-card .agent-fallback-node {
  background: var(--panel-bg) !important;
  border-color: var(--border-strong) !important;
  color: var(--text-primary) !important;
}

html[data-theme] .agent-graph-card .agent-flow-canvas {
  background: var(--panel-bg-subtle) !important;
  border-color: var(--border-strong) !important;
}

html[data-theme] .agent-graph-card .agent-flow-group-box {
  background: color-mix(in srgb, var(--panel-bg-muted) 52%, transparent) !important;
  border-color: color-mix(in srgb, var(--border-strong) 78%, transparent) !important;
}

html[data-theme] .agent-graph-card .agent-flow-group-box span,
html[data-theme] .agent-graph-card .agent-flow-label span,
html[data-theme] .agent-graph-card .agent-flow-label small {
  color: var(--text-secondary) !important;
}

html[data-theme] .agent-graph-card .agent-flow-label strong {
  color: var(--text-primary) !important;
}

html[data-theme] .agent-graph-card .agent-flow-canvas .react-flow__handle {
  background: var(--accent) !important;
  border-color: var(--panel-bg-subtle) !important;
}

html[data-theme] .agent-graph-card .agent-flow-canvas .react-flow__edge-textbg {
  fill: var(--panel-bg) !important;
}

html[data-theme] .agent-graph-card .agent-graph-legend .work,
html[data-theme] .agent-graph-card .agent-fallback-node.work {
  background: var(--green-soft) !important;
  border-color: color-mix(in srgb, var(--green) 56%, var(--border-soft)) !important;
  color: var(--green) !important;
}

html[data-theme] .agent-graph-card .agent-graph-legend .input,
html[data-theme] .agent-graph-card .agent-fallback-node.input {
  background: var(--orange-soft) !important;
  border-color: color-mix(in srgb, var(--orange) 56%, var(--border-soft)) !important;
  color: var(--orange) !important;
}

html[data-theme] .agent-graph-card .agent-graph-legend .error,
html[data-theme] .agent-graph-card .agent-fallback-node.error {
  background: var(--danger-soft) !important;
  border-color: color-mix(in srgb, var(--danger) 56%, var(--border-soft)) !important;
  color: var(--danger) !important;
}

html[data-theme] .agent-graph-card .agent-fallback-node.done,
html[data-theme] .agent-graph-card .agent-fallback-node.idle {
  background: var(--accent-soft) !important;
  border-color: color-mix(in srgb, var(--accent) 48%, var(--border-soft)) !important;
  color: var(--accent-ink) !important;
}

html[data-theme] .agent-graph-card .react-flow__controls {
  overflow: hidden !important;
  border: 1px solid var(--border-strong) !important;
  border-radius: 8px !important;
  background: var(--panel-bg) !important;
  background-color: var(--panel-bg) !important;
  box-shadow: var(--shadow-card) !important;
}

html[data-theme] .agent-graph-card .react-flow__controls-button {
  width: 26px !important;
  height: 26px !important;
  min-height: 26px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--border-soft) !important;
  border-color: var(--border-soft) !important;
  border-radius: 0 !important;
  background: var(--panel-bg) !important;
  background-color: var(--panel-bg) !important;
  color: var(--text-primary) !important;
  fill: var(--text-primary) !important;
}

html[data-theme] .agent-graph-card .react-flow__controls-button:hover {
  background: var(--panel-bg-muted) !important;
  background-color: var(--panel-bg-muted) !important;
  color: var(--accent-ink) !important;
  fill: var(--accent-ink) !important;
}

html[data-theme] .agent-graph-card .react-flow__controls-button:last-child {
  border-bottom: 0 !important;
}

html[data-theme] .agent-graph-card .react-flow__controls-button svg,
html[data-theme] .agent-graph-card .react-flow__controls-button svg path {
  fill: currentColor !important;
  color: inherit !important;
}

/* Project Details contract: lifecycle, readiness, and Jira mapping panels use active theme surfaces. */
html[data-theme] .project-detail-page,
html[data-theme] .project-lifecycle-card,
html[data-theme] .project-jira-setup-card {
  background: var(--panel-bg) !important;
  border-color: var(--border-strong) !important;
  color: var(--text-primary) !important;
}

html[data-theme] .project-detail-head {
  background: var(--panel-header-bg) !important;
  border-color: var(--border-strong) !important;
  color: var(--text-primary) !important;
}

html[data-theme] .project-detail-head p,
html[data-theme] .project-stage,
html[data-theme] .project-stage em,
html[data-theme] .readiness-card span,
html[data-theme] .readiness-card p,
html[data-theme] .project-jira-setup-card .helper {
  color: var(--text-secondary) !important;
}

html[data-theme] .project-stage {
  background: color-mix(in srgb, var(--panel-bg-muted) 32%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--border-soft) 52%, transparent) !important;
}

html[data-theme] .project-stage span {
  background: var(--panel-bg-muted) !important;
  border-color: var(--border-strong) !important;
  color: var(--text-secondary) !important;
  box-shadow: none !important;
}

html[data-theme] .project-stage strong,
html[data-theme] .readiness-card strong {
  color: var(--text-primary) !important;
}

html[data-theme] .project-stage.done {
  background: color-mix(in srgb, var(--green-soft) 56%, transparent) !important;
  border-color: color-mix(in srgb, var(--green) 44%, var(--border-soft)) !important;
}

html[data-theme] .project-stage.done span {
  background: var(--green-soft) !important;
  border-color: color-mix(in srgb, var(--green) 58%, var(--border-soft)) !important;
  color: var(--green) !important;
}

html[data-theme] .project-stage.active {
  background: var(--panel-bg-selected) !important;
  border-color: color-mix(in srgb, var(--accent) 58%, var(--border-soft)) !important;
  color: var(--accent-ink) !important;
}

html[data-theme] .project-stage.active span {
  background: var(--accent-soft) !important;
  border-color: color-mix(in srgb, var(--accent) 62%, var(--border-soft)) !important;
  color: var(--accent-ink) !important;
}

html[data-theme] .project-stage.active.requirements,
html[data-theme] .project-stage.active.requirements-gathering {
  background: var(--orange-soft) !important;
  border-color: color-mix(in srgb, var(--orange) 58%, var(--border-soft)) !important;
  color: var(--orange) !important;
}

html[data-theme] .project-stage.active.requirements span,
html[data-theme] .project-stage.active.requirements-gathering span {
  background: var(--orange-soft) !important;
  border-color: color-mix(in srgb, var(--orange) 62%, var(--border-soft)) !important;
  color: var(--orange) !important;
}

html[data-theme] .project-stage.active.development {
  background: var(--green-soft) !important;
  border-color: color-mix(in srgb, var(--green) 58%, var(--border-soft)) !important;
  color: var(--green) !important;
}

html[data-theme] .project-stage.active.development span {
  background: var(--green-soft) !important;
  border-color: color-mix(in srgb, var(--green) 62%, var(--border-soft)) !important;
  color: var(--green) !important;
}

html[data-theme] .project-stage.active.released {
  background: var(--purple-soft) !important;
  border-color: color-mix(in srgb, var(--purple) 58%, var(--border-soft)) !important;
  color: var(--purple) !important;
}

html[data-theme] .project-stage.active.released span {
  background: var(--purple-soft) !important;
  border-color: color-mix(in srgb, var(--purple) 62%, var(--border-soft)) !important;
  color: var(--purple) !important;
}

html[data-theme] .project-flow-arrow {
  background: var(--border-strong) !important;
}

html[data-theme] .project-flow-arrow::after {
  border-color: var(--border-strong) !important;
}

html[data-theme] .readiness-card,
html[data-theme] .project-jira-setup-grid {
  background: var(--panel-bg-subtle) !important;
  border-color: var(--border-strong) !important;
  color: var(--text-primary) !important;
}

html[data-theme] .readiness-card.ok {
  background: var(--green-soft) !important;
  border-color: color-mix(in srgb, var(--green) 58%, var(--border-soft)) !important;
}

html[data-theme] .readiness-card.warn {
  background: var(--orange-soft) !important;
  border-color: color-mix(in srgb, var(--orange) 58%, var(--border-soft)) !important;
}

html[data-theme] .readiness-card.neutral {
  background: var(--panel-bg-subtle) !important;
  border-color: var(--border-soft) !important;
}

.git-context-banner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin: 12px 0;
  padding: 14px 16px;
  border: 1px solid var(--border-strong);
  background: var(--panel-bg-subtle);
  color: var(--text-primary);
}

.git-context-banner.missing {
  background: var(--orange-soft);
  border-color: color-mix(in srgb, var(--orange) 48%, var(--border-soft));
}

.git-context-banner span {
  display: block;
  margin-bottom: 3px;
  color: var(--text-secondary);
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.git-context-banner strong {
  display: block;
  color: var(--text-primary);
  font-size: 1rem;
}

.git-context-banner p {
  margin: 4px 0 0;
  color: var(--text-secondary);
}

.git-context-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: stretch;
  gap: 14px;
  min-width: 0;
}

.git-context-form label {
  margin: 0;
}

.repository-mapping-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(280px, 1fr));
  gap: 12px;
  align-items: start;
  min-width: 0;
}

.repository-mapping-card {
  min-width: 0;
  display: grid;
  gap: 12px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-raised);
}

.repository-mapping-card.add-row {
  border-style: dashed;
  background: color-mix(in srgb, var(--surface-soft) 84%, transparent);
}

.repository-mapping-card-head {
  min-width: 0;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.repository-mapping-card-head > div {
  min-width: 0;
  display: grid;
  gap: 2px;
}

.repository-mapping-card-head span:not(.badge) {
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .03em;
  text-transform: uppercase;
}

.repository-mapping-card-head strong,
.repository-mapping-card-head small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.repository-mapping-card-head strong {
  color: var(--ink);
  font-size: 13px;
}

.repository-mapping-card-head small {
  color: var(--muted);
  font-size: 11px;
}

.repository-mapping-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px 10px;
}

.repository-mapping-fields label {
  min-width: 0;
  display: grid;
  gap: 4px;
}

.repository-mapping-fields label.wide {
  grid-column: 1 / -1;
}

.repository-mapping-fields input {
  min-width: 0;
  width: 100%;
}

.repository-mapping-card .repository-primary-control,
.repository-mapping-card .repository-remove-control {
  width: fit-content;
  min-height: 28px;
}

.repository-mapping-card .repository-remove-control {
  color: var(--status-bad-fg);
}

.git-context-actions {
  position: sticky;
  bottom: 0;
  z-index: 2;
  padding-top: 12px;
  border-top: 1px solid var(--line);
  background: var(--surface-raised);
}

@media (max-width: 980px) {
  .repository-mapping-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 760px) {
  .git-context-banner,
  .git-context-form {
    grid-template-columns: 1fr;
    align-items: stretch;
  }

  .git-context-banner {
    display: grid;
  }

  .repository-mapping-fields {
    grid-template-columns: minmax(0, 1fr);
  }

  .repository-mapping-fields label.wide {
    grid-column: auto;
  }

  .git-context-actions {
    justify-content: stretch;
  }

  .git-context-actions button {
    flex: 1 1 180px;
  }
}

/* Mobile operational workspace */
.mobile-app-shell {
  min-height: 100dvh;
  background: var(--app-bg);
  color: var(--text-primary);
}

.mobile-topbar,
.mobile-bottom-nav,
.mobile-app-shell .mobile-scope-sheet {
  display: none;
}

@media (max-width: 759px) {
  html,
  body {
    min-width: 0;
    background: var(--app-bg);
  }

  .auth-screen {
    min-height: 100dvh;
    padding: 0;
  }

  .auth-layout {
    min-height: 100dvh;
    grid-template-columns: minmax(0, 1fr);
  }

  .auth-brand-panel {
    display: none;
  }

  .auth-panel {
    min-height: 100dvh;
    padding: max(24px, env(safe-area-inset-top)) 20px max(24px, env(safe-area-inset-bottom));
    place-items: center;
    background: var(--app-bg) !important;
  }

  .auth-panel-inner {
    width: min(100%, 420px);
    padding: 24px 20px;
    gap: 20px;
    border: 1px solid var(--border-soft);
    border-radius: 14px;
    background: var(--surface-raised) !important;
    box-shadow: var(--shadow-card);
  }

  .auth-copy h1 {
    font-size: 26px;
    line-height: 1.15;
  }

  .auth-copy p:not(.eyebrow) {
    font-size: 13px;
  }

  .auth-form input,
  .auth-form select,
  .auth-submit {
    min-height: 48px;
  }

  body:has(.mobile-app-shell) {
    overflow-x: hidden;
  }

  .mobile-app-shell {
    display: grid;
    grid-template-rows: auto auto minmax(0, 1fr) auto;
    width: 100%;
    min-height: 100dvh;
  }

  .mobile-app-shell button,
  .mobile-app-shell input {
    font: inherit;
  }

  .mobile-app-shell svg {
    display: block;
    width: 20px;
    height: 20px;
  }

  .mobile-topbar {
    position: sticky;
    top: 0;
    z-index: 40;
    display: grid;
    grid-template-columns: 78px minmax(0, 1fr) 44px 38px;
    align-items: center;
    gap: 10px;
    min-height: 58px;
    padding: max(8px, env(safe-area-inset-top)) 14px 8px;
    border-bottom: 1px solid var(--border-soft);
    background: color-mix(in srgb, var(--surface-raised) 94%, transparent);
    backdrop-filter: blur(18px);
  }

  .mobile-brand {
    display: flex;
    align-items: center;
    width: 76px;
    height: 34px;
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
  }

  .mobile-brand:hover { background: transparent; border-color: transparent; }
  .mobile-brand .product-wordmark { width: 74px; height: 28px; }
  .mobile-brand .product-wordmark img { width: 74px; height: auto; }

  .mobile-scope-button {
    min-width: 0;
    min-height: 38px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    padding: 7px 9px;
    border: 1px solid var(--border-soft);
    border-radius: 999px;
    background: var(--surface-soft);
    color: var(--text-primary);
    box-shadow: none;
    font-size: 12px;
    font-weight: 750;
  }

  .mobile-admin-context {
    min-width: 0;
    justify-self: center;
    color: var(--text-secondary);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .025em;
  }

  .mobile-scope-button span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .mobile-scope-button svg { width: 14px; height: 14px; transform: rotate(90deg); flex: 0 0 auto; }

  .mobile-avatar,
  .mobile-profile-avatar {
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    padding: 0;
    border: 1px solid var(--border-strong);
    border-radius: 50%;
    background: var(--rail-bg);
    color: var(--rail-ink);
    box-shadow: none;
    font-size: 12px;
    font-weight: 800;
  }

  .mobile-running-tasks-button {
    position: relative;
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    padding: 0;
    border: 1px solid var(--border-soft);
    border-radius: 50%;
    background: var(--surface-soft);
    color: var(--text-primary);
    box-shadow: none;
  }

  .mobile-running-tasks-button.has-tasks {
    border-color: var(--topbar-active-border);
    background: var(--topbar-active-bg);
  }

  .mobile-running-tasks-button.has-attention {
    border-color: var(--status-warn-border);
    color: var(--warning);
  }

  .mobile-running-tasks-button svg {
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
  }

  .mobile-running-tasks-button > span {
    position: absolute;
    top: -2px;
    right: -2px;
    min-width: 17px;
    height: 17px;
    display: grid;
    place-items: center;
    padding: 0 4px;
    border: 1px solid var(--surface-raised);
    border-radius: 999px;
    background: var(--accent-ink);
    color: var(--surface);
    font-size: 9px;
    font-weight: 850;
  }

  .mobile-showcase-banner {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 29px;
    padding: 5px 14px;
    border-bottom: 1px solid var(--status-warn-border);
    background: var(--status-warn-bg);
    color: var(--status-warn-fg);
    font-size: 11px;
  }

  .mobile-main {
    min-width: 0;
    padding-bottom: calc(76px + env(safe-area-inset-bottom));
  }

  .mobile-release-train {
    width: min(100%, 760px);
    margin: 0 auto;
  }

  .mobile-page {
    width: min(100%, 560px);
    margin: 0 auto;
    padding: 22px 16px 28px;
  }

  .mobile-page-intro { margin: 0 2px 18px; }
  .mobile-page-intro h1,
  .mobile-profile-head h1 {
    margin: 2px 0 6px;
    font-size: 25px;
    line-height: 1.16;
    letter-spacing: -0.035em;
  }

  .mobile-page-intro p:last-child,
  .mobile-profile-head p:last-child {
    margin: 0;
    color: var(--text-secondary);
    font-size: 13px;
    line-height: 1.45;
  }

  .mobile-eyebrow {
    margin: 0;
    color: var(--accent-ink);
    font-size: 10px;
    font-weight: 850;
    letter-spacing: .09em;
    text-transform: uppercase;
  }

  .mobile-priority-card {
    position: relative;
    overflow: hidden;
    padding: 18px;
    border: 1px solid var(--status-danger-border);
    border-radius: 14px;
    background: var(--surface-raised);
    box-shadow: 0 10px 28px color-mix(in srgb, var(--danger) 12%, transparent);
  }

  .mobile-priority-card::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    background: var(--danger);
  }

  .mobile-priority-card.warn { border-color: var(--status-warn-border); }
  .mobile-priority-card.warn::before { background: var(--orange); }

  .mobile-action-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    color: var(--text-secondary);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .055em;
    text-transform: uppercase;
  }

  .mobile-priority-pill {
    padding: 4px 7px;
    border-radius: 999px;
    background: var(--status-danger-bg);
    color: var(--status-danger-fg);
  }

  .mobile-priority-card h2 {
    margin: 14px 0 7px;
    font-size: 18px;
    line-height: 1.28;
    letter-spacing: -.02em;
  }

  .mobile-priority-card > p {
    margin: 0;
    color: var(--text-secondary);
    font-size: 12px;
    line-height: 1.5;
  }

  .mobile-action-buttons {
    display: grid;
    grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr);
    gap: 8px;
    margin-top: 16px;
  }

  .mobile-action-buttons button {
    min-height: 42px;
    padding: 9px 12px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 800;
  }

  .mobile-action-buttons .primary {
    border-color: var(--button-primary-bg);
    background: var(--button-primary-bg);
    color: var(--button-primary-fg);
  }

  .mobile-readonly-note { margin-top: 12px !important; color: var(--status-warn-fg) !important; }

  .mobile-quick-response {
    margin-top: 14px;
    padding-top: 13px;
    border-top: 1px solid var(--border-soft);
  }

  .mobile-quick-response summary {
    cursor: pointer;
    color: var(--accent-ink);
    font-size: 11px;
    font-weight: 800;
  }

  .mobile-quick-response label {
    display: block;
    margin: 12px 0 5px;
    font-size: 10px;
    font-weight: 800;
  }

  .mobile-quick-response textarea {
    width: 100%;
    min-height: 78px;
    resize: vertical;
  }

  .mobile-quick-response button {
    width: 100%;
    min-height: 40px;
    margin-top: 8px;
    border-color: var(--button-primary-bg);
    background: var(--button-primary-bg);
    color: var(--button-primary-fg);
    font-size: 11px;
    font-weight: 800;
  }

  .mobile-budget-decision {
    margin-top: 14px;
    padding-top: 13px;
    border-top: 1px solid var(--border-soft);
  }

  .mobile-budget-decision summary { cursor: pointer; color: var(--accent-ink); font-size: 11px; font-weight: 800; }
  .mobile-budget-summary { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin: 12px 0; }
  .mobile-budget-summary span { padding: 10px; border: 1px solid var(--border-soft); border-radius: 8px; background: var(--surface-soft); }
  .mobile-budget-summary strong,
  .mobile-budget-summary small { display: block; }
  .mobile-budget-summary strong { font-size: 13px; }
  .mobile-budget-summary small { margin-top: 3px; color: var(--text-secondary); font-size: 9px; }
  .mobile-budget-decision label { display: block; margin-top: 9px; font-size: 10px; font-weight: 800; }
  .mobile-budget-decision input,
  .mobile-budget-decision textarea { width: 100%; margin-top: 5px; }
  .mobile-budget-decision textarea { min-height: 70px; resize: vertical; }
  .mobile-budget-buttons { display: grid; grid-template-columns: 1fr 1.4fr; gap: 8px; margin-top: 10px; }
  .mobile-budget-buttons button { min-height: 40px; font-size: 11px; font-weight: 800; }
  .mobile-budget-buttons .primary { border-color: var(--button-primary-bg); background: var(--button-primary-bg); color: var(--button-primary-fg); }

  .mobile-task-context {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    margin-top: 14px;
    padding-top: 13px;
    border-top: 1px solid var(--border-soft);
  }

  .mobile-task-context > div {
    padding: 9px 10px;
    border: 1px solid var(--border-soft);
    border-radius: 8px;
    background: var(--surface-soft);
  }

  .mobile-task-context span,
  .mobile-task-context strong { display: block; }
  .mobile-task-context span { color: var(--text-secondary); font-size: 9px; font-weight: 750; text-transform: uppercase; }
  .mobile-task-context strong { margin-top: 3px; font-size: 11px; }
  .mobile-task-context p { grid-column: 1 / -1; margin: 0 !important; padding: 10px; border-radius: 8px; background: var(--surface-soft); }
  .mobile-task-context p strong { margin: 0 0 4px; color: var(--text-primary); }

  .mobile-next-section,
  .mobile-health-section,
  .mobile-story-work-section,
  .mobile-conversation-section,
  .mobile-profile-section {
    margin-top: 24px;
  }

  .mobile-section-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: 0 2px 9px;
  }

  .mobile-section-heading h2,
  .mobile-profile-section h2 {
    margin: 0;
    font-size: 13px;
  }

  .mobile-section-heading button,
  .mobile-section-heading span {
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--accent-ink);
    box-shadow: none;
    font-size: 11px;
    font-weight: 750;
  }

  .mobile-action-list {
    overflow: hidden;
    border: 1px solid var(--border-soft);
    border-radius: 12px;
    background: var(--surface-raised);
  }

  .mobile-action-row {
    width: 100%;
    min-height: 67px;
    display: grid;
    grid-template-columns: 8px minmax(0, 1fr) 18px;
    align-items: center;
    gap: 10px;
    padding: 11px 12px;
    border: 0;
    border-bottom: 1px solid var(--border-soft);
    border-radius: 0;
    background: var(--surface-raised);
    color: var(--text-primary);
    text-align: left;
    box-shadow: none;
    cursor: pointer;
    touch-action: manipulation;
  }

  .mobile-action-row:last-child { border-bottom: 0; }
  .mobile-action-row:active { background: var(--row-bg-hover); }
  .mobile-action-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--muted); }
  .mobile-action-dot.danger { background: var(--danger); }
  .mobile-action-dot.warn { background: var(--orange); }
  .mobile-action-copy { min-width: 0; }
  .mobile-action-copy strong { display: block; font-size: 12px; line-height: 1.35; }
  .mobile-action-copy small { display: block; margin-top: 4px; color: var(--text-secondary); font-size: 10px; }
  .mobile-row-chevron { color: var(--text-secondary); }
  .mobile-row-chevron svg { width: 16px; height: 16px; }

  .mobile-kpi-strip {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin-top: 18px;
  }

  .mobile-metric {
    min-width: 0;
    padding: 12px 10px;
    border: 1px solid var(--border-soft);
    border-top: 3px solid var(--line-strong);
    border-radius: 10px;
    background: var(--surface-raised);
  }

  .mobile-metric strong { display: block; font-size: 19px; line-height: 1; }
  .mobile-metric span { display: block; margin-top: 6px; color: var(--text-secondary); font-size: 9px; font-weight: 750; }
  .mobile-metric.danger { border-top-color: var(--danger); }
  .mobile-metric.warn { border-top-color: var(--orange); }
  .mobile-metric.ok { border-top-color: var(--green); }
  .mobile-metric.blue { border-top-color: var(--chart-primary); }
  .mobile-metric.purple { border-top-color: var(--purple); }

  .mobile-filter-tabs {
    display: flex;
    gap: 7px;
    margin-bottom: 12px;
    overflow-x: auto;
    scrollbar-width: none;
  }

  .mobile-filter-tabs button {
    flex: 0 0 auto;
    min-height: 34px;
    padding: 7px 12px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 750;
  }

  .mobile-filter-tabs button.active {
    border-color: var(--accent-ink);
    background: var(--accent-ink);
    color: var(--button-primary-fg);
  }

  .mobile-action-list-full .mobile-action-row { min-height: 74px; }
  .mobile-empty { padding: 26px 18px; text-align: center; }
  .mobile-empty.compact { padding: 14px; }
  .mobile-empty h2 { margin: 0; font-size: 14px; }
  .mobile-empty p { margin: 6px 0 0; color: var(--text-secondary); font-size: 12px; }

  .mobile-story-work-list,
  .mobile-conversation-list,
  .mobile-agent-work-list {
    overflow: hidden;
    border: 1px solid var(--border-soft);
    border-radius: 12px;
    background: var(--surface-raised);
  }

  .mobile-story-work-row,
  .mobile-conversation-row,
  .mobile-agent-work-row {
    width: 100%;
    min-height: 72px;
    display: grid;
    align-items: center;
    gap: 10px;
    padding: 12px;
    border: 0;
    border-bottom: 1px solid var(--border-soft);
    border-radius: 0;
    background: var(--surface-raised);
    color: var(--text-primary);
    text-align: left;
    box-shadow: none;
    cursor: pointer;
    touch-action: manipulation;
  }

  .mobile-story-work-row { grid-template-columns: auto minmax(0, 1fr) auto; }
  .mobile-story-work-row:last-child,
  .mobile-conversation-row:last-child,
  .mobile-agent-work-row:last-child { border-bottom: 0; }
  .mobile-story-key { align-self: start; padding: 4px 6px; border-radius: 6px; background: var(--accent-soft); color: var(--accent-ink); font-size: 9px; font-weight: 850; }
  .mobile-story-work-copy { min-width: 0; }
  .mobile-story-work-copy strong { display: block; font-size: 12px; line-height: 1.35; }
  .mobile-story-work-copy small { display: block; margin-top: 5px; color: var(--text-secondary); font-size: 10px; line-height: 1.35; }
  .mobile-story-signals { display: flex; align-items: center; gap: 5px; }
  .mobile-story-signals b,
  .mobile-story-signals em { padding: 3px 5px; border-radius: 999px; background: var(--surface-soft); color: var(--text-secondary); font-size: 8px; font-style: normal; font-weight: 800; }
  .mobile-story-signals svg { width: 15px; height: 15px; color: var(--text-secondary); }

  .mobile-conversation-row { grid-template-columns: minmax(0, 1fr) auto; }
  .mobile-conversation-row strong,
  .mobile-conversation-row small { display: block; }
  .mobile-conversation-row strong { font-size: 11px; }
  .mobile-conversation-row small { margin-top: 3px; color: var(--text-secondary); font-size: 9px; }
  .mobile-conversation-row p { display: -webkit-box; margin: 7px 0 0; overflow: hidden; color: var(--text-secondary); font-size: 11px; line-height: 1.4; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
  .mobile-conversation-row > svg { width: 15px; height: 15px; color: var(--text-secondary); }

  .mobile-agent-work-row { grid-template-columns: auto minmax(0, 1fr) auto; }
  .mobile-agent-work-status { display: inline-flex; width: fit-content; align-items: center; min-height: 22px; padding: 3px 7px; border: 1px solid var(--border-soft); border-radius: 999px; background: var(--surface-soft); color: var(--text-secondary); font-size: 8px; font-weight: 850; text-transform: uppercase; }
  .mobile-agent-work-status.active { border-color: var(--status-neutral-border); background: var(--accent-soft); color: var(--accent-ink); }
  .mobile-agent-work-status.warn { border-color: var(--status-warn-border); background: var(--status-warn-bg); color: var(--status-warn-fg); }
  .mobile-agent-work-status.danger { border-color: var(--status-danger-border); background: var(--status-danger-bg); color: var(--status-danger-fg); }
  .mobile-agent-work-status.ok { border-color: var(--status-ok-border); background: var(--status-ok-bg); color: var(--status-ok-fg); }
  .mobile-agent-work-copy { min-width: 0; }
  .mobile-agent-work-copy strong { display: block; font-size: 11px; line-height: 1.35; }
  .mobile-agent-work-copy small,
  .mobile-agent-work-copy em { display: block; margin-top: 4px; color: var(--text-secondary); font-size: 9px; font-style: normal; line-height: 1.35; }

  .mobile-agent-job-card,
  .mobile-agent-job-controls,
  .mobile-agent-reroute-card,
  .mobile-agent-job-story {
    margin-top: 14px;
    padding: 15px;
    border: 1px solid var(--border-soft);
    border-radius: 12px;
    background: var(--surface-raised);
  }
  .mobile-agent-job-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 11px; }
  .mobile-agent-job-facts > div { padding: 10px; border-radius: 8px; background: var(--surface-soft); }
  .mobile-agent-job-facts span,
  .mobile-agent-job-facts strong { display: block; }
  .mobile-agent-job-facts span { color: var(--text-secondary); font-size: 8px; font-weight: 800; text-transform: uppercase; }
  .mobile-agent-job-facts strong { margin-top: 5px; font-size: 11px; line-height: 1.35; }
  .mobile-agent-job-card > p,
  .mobile-agent-job-controls > p,
  .mobile-agent-reroute-card > p,
  .mobile-agent-job-story > p { margin: 11px 0 0; color: var(--text-secondary); font-size: 11px; line-height: 1.5; }
  .mobile-agent-job-controls > div:last-child { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; margin-top: 12px; }
  .mobile-agent-job-controls button,
  .mobile-agent-reroute-card button,
  .mobile-agent-job-story button { min-height: 40px; font-size: 10px; font-weight: 800; }
  .mobile-agent-job-card > button { width: 100%; min-height: 44px; margin-top: 12px; font-size: 11px; font-weight: 800; }
  .mobile-agent-reroute-card > strong { display: block; margin-top: 12px; font-size: 13px; }
  .mobile-agent-reroute-card > button { width: 100%; margin-top: 12px; }
  .mobile-agent-reroute-card details { margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--border-soft); }
  .mobile-agent-reroute-card summary { color: var(--accent-ink); font-size: 10px; font-weight: 800; }
  .mobile-agent-reroute-card label { display: grid; gap: 5px; margin-top: 10px; font-size: 9px; font-weight: 800; }
  .mobile-agent-reroute-card select { width: 100%; min-height: 40px; }
  .mobile-agent-reroute-card details button,
  .mobile-agent-job-story button { width: 100%; margin-top: 9px; }

  .mobile-back-button {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    min-height: 36px;
    margin: -5px 0 16px;
    padding: 6px 9px;
    border: 0;
    background: transparent;
    color: var(--accent-ink);
    box-shadow: none;
    font-size: 11px;
    font-weight: 800;
    cursor: pointer;
    touch-action: manipulation;
  }
  .mobile-back-button svg { width: 15px; height: 15px; transform: rotate(180deg); }

  .mobile-story-summary-card,
  .mobile-dispatch-card,
  .mobile-story-comments {
    margin-top: 14px;
    padding: 15px;
    border: 1px solid var(--border-soft);
    border-radius: 12px;
    background: var(--surface-raised);
  }
  .mobile-story-summary-card { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .mobile-story-summary-card > div { padding: 9px; border-radius: 8px; background: var(--surface-soft); }
  .mobile-story-summary-card span,
  .mobile-story-summary-card strong { display: block; }
  .mobile-story-summary-card span { color: var(--text-secondary); font-size: 9px; font-weight: 750; text-transform: uppercase; }
  .mobile-story-summary-card strong { margin-top: 4px; font-size: 12px; }
  .mobile-story-summary-card > p,
  .mobile-story-summary-card > details { grid-column: 1 / -1; margin: 0; color: var(--text-secondary); font-size: 11px; line-height: 1.5; }
  .mobile-story-summary-card summary { color: var(--accent-ink); font-weight: 800; }
  .mobile-story-summary-card details p { margin: 8px 0 0; }
  .mobile-dispatch-card p { margin: 10px 0 0; color: var(--text-secondary); font-size: 11px; line-height: 1.45; }
  .mobile-dispatch-card > button,
  .mobile-story-comments > button { width: 100%; min-height: 44px; margin-top: 11px; font-size: 11px; font-weight: 800; }
  .mobile-comment-thread { display: grid; gap: 8px; margin-top: 10px; }
  .mobile-comment-thread article { padding: 10px; border: 1px solid var(--border-soft); border-radius: 9px; background: var(--surface-soft); }
  .mobile-comment-thread article div { display: flex; justify-content: space-between; gap: 8px; }
  .mobile-comment-thread strong { font-size: 10px; }
  .mobile-comment-thread small { color: var(--text-secondary); font-size: 8px; }
  .mobile-comment-thread p { margin: 7px 0 0; font-size: 11px; line-height: 1.45; }
  .mobile-review-thread-state { display: flex; justify-content: flex-start !important; gap: 6px !important; margin-top: 7px; }
  .mobile-review-thread-state span { padding: 2px 5px; border: 1px solid var(--border-soft); border-radius: 999px; color: var(--text-secondary); font-size: 8px; font-weight: 750; }
  .mobile-review-resolution { margin-top: 8px; padding: 7px; border-left: 3px solid var(--accent); background: var(--surface-raised); }
  .mobile-review-resolution > p { margin-top: 4px; }
  .mobile-review-replies { display: grid !important; gap: 6px !important; margin: 9px 0 0 10px; padding-left: 8px; border-left: 2px solid var(--border-soft); }
  .mobile-review-replies article { padding: 8px; background: var(--surface-raised); }
  .mobile-story-comments > label { display: block; margin-top: 14px; font-size: 10px; font-weight: 800; }
  .mobile-story-comments > textarea { width: 100%; min-height: 84px; margin-top: 6px; resize: vertical; }
  .mobile-caught-up.compact { padding: 13px; }

  .mobile-dashboard-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
  }

  .mobile-dashboard-grid .mobile-metric { min-height: 86px; padding: 15px 13px; }
  .mobile-dashboard-grid .mobile-metric strong { font-size: 24px; }
  .mobile-dashboard-grid .mobile-metric span { font-size: 10px; }

  .mobile-project-health,
  .mobile-settings-row {
    width: 100%;
    min-height: 72px;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    margin-bottom: 8px;
    padding: 10px 12px;
    border: 1px solid var(--border-soft);
    border-radius: 10px;
    background: var(--surface-raised);
    color: var(--text-primary);
    text-align: left;
    box-shadow: none;
    cursor: pointer;
    touch-action: manipulation;
  }

  .mobile-project-health:active,
  .mobile-settings-row:active,
  .mobile-story-work-row:active,
  .mobile-conversation-row:active,
  .mobile-agent-work-row:active { background: var(--row-bg-hover); }

  .mobile-project-health:focus-visible,
  .mobile-settings-row:focus-visible,
  .mobile-story-work-row:focus-visible,
  .mobile-conversation-row:focus-visible,
  .mobile-agent-work-row:focus-visible,
  .mobile-action-row:focus-visible,
  .mobile-back-button:focus-visible {
    outline: 2px solid var(--focus-ring);
    outline-offset: 2px;
  }

  .mobile-project-health strong,
  .mobile-settings-row strong { display: block; font-size: 12px; }
  .mobile-project-health small,
  .mobile-settings-row small { display: block; margin-top: 4px; color: var(--text-secondary); font-size: 10px; }

  .mobile-health-ring {
    position: relative;
    display: grid;
    place-items: center;
    width: 45px;
    height: 45px;
    border-radius: 50%;
    background: conic-gradient(var(--green) var(--progress), var(--chart-track) 0);
  }

  .mobile-health-ring.risk { background: conic-gradient(var(--danger) var(--progress), var(--chart-track) 0); }
  .mobile-health-ring::after { content: ""; position: absolute; inset: 5px; border-radius: 50%; background: var(--surface-raised); }
  .mobile-health-ring strong { position: relative; z-index: 1; font-size: 10px; }

  .mobile-executive-signal-list {
    overflow: hidden;
    border: 1px solid var(--border-soft);
    border-radius: 12px;
    background: var(--surface-raised);
  }

  .mobile-executive-signal {
    display: grid;
    gap: 4px;
    padding: 13px 14px;
    border-bottom: 1px solid var(--border-soft);
    border-left: 3px solid var(--orange);
  }

  .mobile-executive-signal:last-child { border-bottom: 0; }
  .mobile-executive-signal.risk { border-left-color: var(--danger); }
  .mobile-executive-signal > span { color: var(--accent-ink); font-size: 8px; font-weight: 850; letter-spacing: .06em; text-transform: uppercase; }
  .mobile-executive-signal > strong { font-size: 12px; line-height: 1.35; }
  .mobile-executive-signal > small { color: var(--text-secondary); font-size: 9px; }
  .mobile-executive-signal > p { margin: 3px 0 0; color: var(--text-secondary); font-size: 11px; line-height: 1.45; }

  .mobile-executive-question-list {
    display: grid;
    gap: 8px;
  }

  .mobile-executive-question {
    padding: 13px 14px;
    border: 1px solid var(--border-soft);
    border-radius: 12px;
    background: var(--surface-raised);
  }

  .mobile-executive-question > span { display: inline-block; padding: 3px 6px; border-radius: 999px; background: var(--accent-soft); color: var(--accent-ink); font-size: 8px; font-weight: 850; text-transform: uppercase; }
  .mobile-executive-question > strong,
  .mobile-executive-question > small { display: block; }
  .mobile-executive-question > strong { margin-top: 8px; font-size: 12px; line-height: 1.4; }
  .mobile-executive-question > small { margin-top: 4px; color: var(--text-secondary); font-size: 9px; }
  .mobile-executive-question > p { margin: 7px 0 0; color: var(--text-secondary); font-size: 10px; line-height: 1.45; }

  .mobile-executive-brief,
  .mobile-executive-forecast,
  .mobile-executive-evidence {
    margin-top: 14px;
    padding: 15px;
    border: 1px solid var(--border-soft);
    border-radius: 12px;
    background: var(--surface-raised);
  }

  .mobile-executive-brief { border-left: 4px solid var(--green); }
  .mobile-executive-brief.warn { border-left-color: var(--orange); }
  .mobile-executive-brief.danger { border-left-color: var(--danger); }
  .mobile-executive-brief span,
  .mobile-executive-brief strong { display: block; }
  .mobile-executive-brief span { color: var(--text-secondary); font-size: 9px; font-weight: 800; text-transform: uppercase; }
  .mobile-executive-brief strong { margin-top: 5px; font-size: 13px; }
  .mobile-executive-brief p,
  .mobile-executive-forecast p { margin: 8px 0 0; color: var(--text-secondary); font-size: 11px; line-height: 1.5; }
  .mobile-executive-forecast > strong { font-size: 13px; }
  .mobile-executive-forecast > div { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; margin-top: 12px; }
  .mobile-executive-forecast span { min-width: 0; padding: 8px; border-radius: 8px; background: var(--surface-soft); }
  .mobile-executive-forecast small,
  .mobile-executive-forecast b { display: block; }
  .mobile-executive-forecast small { color: var(--text-secondary); font-size: 8px; }
  .mobile-executive-forecast b { margin-top: 4px; overflow-wrap: anywhere; font-size: 9px; }
  .mobile-executive-evidence { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .mobile-executive-evidence > div { padding: 10px; border-radius: 8px; background: var(--surface-soft); }
  .mobile-executive-evidence span,
  .mobile-executive-evidence strong { display: block; }
  .mobile-executive-evidence span { color: var(--text-secondary); font-size: 9px; }
  .mobile-executive-evidence strong { margin-top: 5px; font-size: 15px; }

  .mobile-executive-spend-posture {
    display: grid;
    gap: 9px;
    margin-top: 12px;
    padding: 12px;
    border: 1px solid var(--border-soft);
    border-radius: 10px;
    background: var(--surface-raised);
  }
  .mobile-executive-spend-posture div { display: flex; justify-content: space-between; gap: 10px; }
  .mobile-executive-spend-posture strong { font-size: 11px; }
  .mobile-executive-spend-posture span { color: var(--text-secondary); font-size: 9px; }
  .mobile-executive-spend-posture > i { display: block; height: 7px; overflow: hidden; border-radius: 999px; background: var(--chart-track); }
  .mobile-executive-spend-posture > i > b { display: block; height: 100%; border-radius: inherit; background: var(--chart-primary); }
  .mobile-executive-runtime-mix { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 8px; }
  .mobile-executive-runtime-mix > div { padding: 11px; border: 1px solid var(--border-soft); border-radius: 10px; background: var(--surface-raised); }
  .mobile-executive-runtime-mix span,
  .mobile-executive-runtime-mix strong { display: block; }
  .mobile-executive-runtime-mix span { color: var(--text-secondary); font-size: 9px; }
  .mobile-executive-runtime-mix strong { margin-top: 5px; font-size: 16px; }
  .mobile-executive-spend-projects { margin-top: 8px; overflow: hidden; border: 1px solid var(--border-soft); border-radius: 10px; background: var(--surface-raised); }
  .mobile-executive-spend-projects article { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 11px 12px; border-bottom: 1px solid var(--border-soft); }
  .mobile-executive-spend-projects article:last-child { border-bottom: 0; }
  .mobile-executive-spend-projects strong,
  .mobile-executive-spend-projects small { display: block; }
  .mobile-executive-spend-projects strong { font-size: 11px; }
  .mobile-executive-spend-projects small { margin-top: 3px; color: var(--text-secondary); font-size: 9px; }
  .mobile-executive-spend-projects article > b { font-size: 12px; }

  .mobile-caught-up,
  .mobile-profile-notice,
  .mobile-desktop-note {
    display: flex;
    gap: 12px;
    padding: 16px;
    border: 1px solid var(--status-ok-border);
    border-radius: 12px;
    background: var(--status-ok-bg);
  }

  .mobile-caught-up > span { color: var(--green); }
  .mobile-caught-up h2,
  .mobile-profile-notice h2 { margin: 0; font-size: 14px; }
  .mobile-caught-up p,
  .mobile-profile-notice p,
  .mobile-desktop-note p { margin: 4px 0 0; color: var(--text-secondary); font-size: 11px; line-height: 1.45; }

  .mobile-profile-head { display: flex; align-items: center; gap: 14px; margin-bottom: 22px; }
  .mobile-profile-avatar { flex: 0 0 auto; width: 52px; height: 52px; font-size: 15px; }
  .mobile-profile-notice { display: block; border-color: var(--status-warn-border); background: var(--status-warn-bg); }
  .mobile-profile-notice strong { color: var(--status-warn-fg); }
  .mobile-persona-list { display: grid; gap: 8px; margin-top: 9px; }
  .mobile-persona-list button {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 44px;
    padding: 10px 12px;
    border-radius: 9px;
    text-align: left;
  }
  .mobile-persona-list button.active { border-color: var(--accent-ink); background: var(--accent-soft); color: var(--accent-ink); }
  .mobile-persona-list small { font-size: 9px; text-transform: uppercase; }
  .mobile-permission-pills { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 9px; }
  .mobile-permission-pills span { padding: 6px 9px; border: 1px solid var(--border-soft); border-radius: 999px; background: var(--surface-raised); font-size: 10px; }
  .mobile-settings-row { grid-template-columns: minmax(0, 1fr) auto; margin-top: 9px; }
  .mobile-desktop-note { display: block; margin-top: 8px; border-color: var(--border-soft); background: var(--surface-soft); }
  .mobile-desktop-note strong { font-size: 11px; }
  .mobile-logout { width: 100%; min-height: 44px; margin-top: 24px; color: var(--danger); font-weight: 800; }

  .mobile-bottom-nav {
    position: fixed;
    inset: auto 0 0;
    z-index: 50;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    min-height: calc(62px + env(safe-area-inset-bottom));
    padding: 6px 7px env(safe-area-inset-bottom);
    border-top: 1px solid var(--border-soft);
    background: color-mix(in srgb, var(--surface-raised) 96%, transparent);
    backdrop-filter: blur(18px);
    box-shadow: var(--shadow-card);
  }

  .mobile-bottom-nav button {
    position: relative;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 3px;
    min-height: 48px;
    padding: 4px;
    border: 0;
    border-radius: 9px;
    background: transparent;
    color: var(--text-secondary);
    box-shadow: none;
    min-width: 0;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
  }

  .mobile-bottom-nav button.active { background: var(--accent-soft); color: var(--accent-ink); }
  .mobile-bottom-nav button > span { position: relative; }
  .mobile-bottom-nav button b { position: absolute; top: -7px; right: -11px; min-width: 16px; padding: 2px 4px; border: 2px solid var(--surface-raised); border-radius: 999px; background: var(--danger); color: var(--button-primary-fg); font-size: 8px; line-height: 1; }
  .mobile-bottom-nav small { font-size: 9px; font-weight: 750; }

  .mobile-admin-bottom-nav {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    padding-inline: max(54px, calc((100vw - 280px) / 2));
  }

  .mobile-sheet-scrim {
    position: fixed;
    inset: 0;
    z-index: 80;
    display: flex;
    align-items: flex-end;
    background: var(--modal-scrim);
    backdrop-filter: blur(2px);
  }

  .mobile-app-shell .mobile-scope-sheet {
    display: block;
    width: 100%;
    max-height: min(76dvh, 680px);
    overflow: auto;
    padding: 8px 16px calc(18px + env(safe-area-inset-bottom));
    border: 1px solid var(--border-strong);
    border-bottom: 0;
    border-radius: 18px 18px 0 0;
    background: var(--surface-raised);
    box-shadow: var(--modal-shadow);
  }

  .mobile-sheet-handle { width: 42px; height: 4px; margin: 0 auto 12px; border-radius: 999px; background: var(--line-strong); }
  .mobile-sheet-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
  .mobile-sheet-heading h2 { margin: 2px 0 0; font-size: 20px; }
  .mobile-sheet-heading button { display: grid; place-items: center; width: 36px; height: 36px; padding: 0; border-radius: 50%; }
  .mobile-project-search { display: flex; align-items: center; gap: 8px; margin: 16px 0 10px; padding: 0 11px; border: 1px solid var(--border-soft); border-radius: 9px; background: var(--field-bg); }
  .mobile-project-search > span { color: var(--text-secondary); }
  .mobile-project-search input { width: 100%; min-height: 42px; padding: 8px 0; border: 0; background: transparent; box-shadow: none; }
  .mobile-project-search input:focus { outline: 0; }
  .mobile-project-options { display: grid; gap: 6px; }
  .mobile-project-options button { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 54px; padding: 9px 11px; border-radius: 9px; text-align: left; }
  .mobile-project-options button.selected { border-color: var(--accent-ink); background: var(--accent-soft); color: var(--accent-ink); }
  .mobile-project-options strong { display: block; font-size: 12px; }
  .mobile-project-options small { display: block; margin-top: 3px; color: var(--text-secondary); font-size: 10px; }

  .mobile-app-shell .artifact-lightbox-backdrop,
  .mobile-app-shell .metric-lightbox-backdrop {
    padding: 12px;
  }

  .mobile-app-shell .artifact-lightbox,
  .mobile-app-shell .metric-lightbox {
    width: 100%;
    max-width: 100%;
    max-height: calc(100dvh - 24px);
  }
}
/* Developer workspace consolidation */
.developer-global-workspace {
  display: grid;
  gap: 16px;
  width: min(1180px, 100%);
  margin: 0 auto;
  padding: 18px 20px 32px;
}

.developer-global-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  padding: 4px 2px 10px;
  border-bottom: 1px solid var(--border-soft);
}

.developer-global-head h1,
.developer-project-title h1 {
  margin: 2px 0 5px;
  color: var(--text-primary);
  font-size: clamp(23px, 2.5vw, 32px);
  line-height: 1.1;
}

.developer-global-head p:not(.eyebrow),
.developer-project-title p:not(.eyebrow) {
  max-width: 680px;
  margin: 0;
  color: var(--text-secondary);
  line-height: 1.45;
}

.developer-global-summary {
  display: flex;
  align-items: center;
  gap: 10px;
  flex: none;
}

.developer-global-summary > span {
  display: grid;
  min-width: 78px;
  padding: 7px 10px;
  border: 1px solid var(--border-soft);
  border-radius: 9px;
  background: var(--panel-bg);
  color: var(--text-secondary);
  font-size: 10px;
  text-align: center;
}

.developer-global-summary strong {
  color: var(--text-primary);
  font-size: 18px;
}

.developer-focus-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.developer-focus-card-shell {
  display: grid;
}

.developer-focus-card {
  display: grid;
  gap: 9px;
  min-height: 154px;
  width: 100%;
  height: 100%;
  padding: 15px 52px 15px 16px;
  border: 1px solid var(--border-soft);
  border-left: 4px solid var(--accent);
  border-radius: 10px;
  background: var(--panel-bg);
  color: var(--text-primary);
  text-align: left;
  box-shadow: var(--shadow-card);
}

.developer-focus-toggle {
  position: absolute;
  top: 12px;
  right: 12px;
}

.developer-focus-card:hover,
.developer-focus-card:focus-visible,
.developer-work-row:hover,
.developer-work-row:focus-visible {
  border-color: var(--accent);
  background: var(--row-bg-hover);
}

.developer-focus-card.attention {
  border-left-color: var(--warning);
  border-color: color-mix(in srgb, var(--warning) 30%, var(--border-soft));
  border-left-color: var(--warning);
  background: color-mix(in srgb, var(--orange-soft) 38%, var(--panel-bg));
}

.developer-focus-card.qa {
  border-left-color: var(--success);
  border-color: color-mix(in srgb, var(--teal) 28%, var(--border-soft));
  border-left-color: var(--teal);
  background: color-mix(in srgb, var(--teal-soft) 38%, var(--panel-bg));
}

.developer-focus-card.agent {
  border-left-color: var(--info);
  border-color: color-mix(in srgb, var(--accent) 28%, var(--border-soft));
  border-left-color: var(--accent);
  background: color-mix(in srgb, var(--accent-soft) 38%, var(--panel-bg));
}

.developer-focus-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  color: var(--text-secondary);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .02em;
  text-transform: uppercase;
}

.developer-focus-card > strong {
  font-size: 14px;
  line-height: 1.3;
}

.developer-focus-card > p,
.developer-focus-card > small {
  margin: 0;
  color: var(--text-secondary);
  line-height: 1.4;
}

.developer-focus-card > small {
  align-self: end;
  font-size: 10px;
}

.developer-work-filters {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) minmax(150px, .55fr) minmax(160px, .55fr) auto auto;
  gap: 9px;
  align-items: end;
  padding: 12px;
  border: 1px solid var(--border-soft);
  border-radius: 10px;
  background: var(--panel-bg);
}

.developer-work-filters label {
  display: grid;
  gap: 5px;
  margin: 0;
  color: var(--text-secondary);
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
}

.developer-work-filters :where(input, select) {
  width: 100%;
  min-height: 35px;
}

.developer-work-filters > button {
  min-height: 35px;
}

.developer-work-groups {
  display: grid;
  gap: 9px;
}

.developer-work-pagination {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 12px;
  border: 1px solid var(--border-soft);
  border-radius: 10px;
  background: var(--panel-bg);
  color: var(--text-secondary);
  font-size: 11px;
}

.developer-work-pagination > div {
  display: flex;
  gap: 7px;
}

.developer-work-group {
  overflow: hidden;
  border: 1px solid var(--border-soft);
  border-radius: 10px;
  background: var(--panel-bg);
}

.developer-work-group summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 12px 14px;
  cursor: pointer;
  list-style: none;
}

.developer-work-group summary::-webkit-details-marker {
  display: none;
}

.developer-work-group summary > span {
  display: grid;
  gap: 2px;
}

.developer-work-group summary small {
  color: var(--text-secondary);
  font-size: 10px;
  font-weight: 500;
}

.developer-work-group summary > b {
  display: grid;
  place-items: center;
  min-width: 27px;
  height: 27px;
  border: 1px solid var(--border-soft);
  border-radius: 999px;
  background: var(--chip-bg);
  font-size: 11px;
}

.developer-work-list {
  display: grid;
  border-top: 1px solid var(--border-soft);
}

.developer-work-row {
  display: grid;
  grid-template-columns: minmax(180px, 240px) minmax(0, 1fr) minmax(150px, 200px);
  gap: 14px;
  align-items: center;
  text-align: left;
  width: 100%;
  padding: 11px 56px 11px 14px;
  border: 0;
  border-bottom: 1px solid var(--border-soft);
  border-radius: 0;
  background: var(--row-bg);
  color: var(--text-primary);
  text-align: left;
}

.developer-work-row-shell:last-child .developer-work-row {
  border-bottom: 0;
}

.developer-work-toggle {
  position: absolute;
  top: 50%;
  right: 14px;
  transform: translateY(-50%);
}

.developer-work-project {
  overflow: hidden;
  color: var(--text-secondary);
  font-size: 10px;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.developer-work-story {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.developer-work-row > .badge {
  justify-self: end;
}

.developer-work-story strong,
.developer-work-story small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.developer-work-story small,
.developer-work-group-empty {
  color: var(--text-secondary);
  font-size: 10px;
}

.developer-work-group-empty,
.developer-work-empty,
.developer-work-loading {
  padding: 24px;
  border: 1px dashed var(--border-strong);
  border-radius: 10px;
  background: var(--panel-bg-muted);
  color: var(--text-secondary);
  text-align: center;
}

.developer-work-empty strong {
  display: block;
  margin-bottom: 5px;
  color: var(--text-primary);
}

.developer-metric-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.developer-metric-card,
.developer-metric-note {
  padding: 16px;
  border: 1px solid var(--border-soft);
  border-radius: 10px;
  background: var(--panel-bg);
  box-shadow: var(--shadow-card);
}

.developer-metric-card {
  display: grid;
  gap: 7px;
}

.developer-metric-card > span {
  color: var(--text-secondary);
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
}

.developer-metric-card > strong {
  color: var(--text-primary);
  font-size: 28px;
  line-height: 1;
}

.developer-metric-card > p,
.developer-metric-note > p {
  margin: 0;
  color: var(--text-secondary);
  font-size: 11px;
  line-height: 1.4;
}

.developer-metric-note {
  display: grid;
  grid-template-columns: minmax(150px, .4fr) minmax(260px, 1fr);
  gap: 20px;
  align-items: center;
}

.developer-project-header {
  position: sticky;
  top: 0;
  z-index: 12;
  display: grid;
  gap: 12px;
  padding: 13px 17px 0;
  border-width: 0 0 1px;
  border-radius: 0;
  box-shadow: 0 5px 14px color-mix(in srgb, var(--rail-bg) 8%, transparent);
}

.developer-project-switcher {
  display: flex;
  align-items: center;
  gap: 8px;
}

.developer-project-switcher label {
  color: var(--text-secondary);
  font-size: 9px;
  font-weight: 800;
  text-transform: uppercase;
}

.developer-project-switcher select {
  width: min(310px, 55vw);
  min-height: 31px;
  font-weight: 750;
}

.developer-project-title {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
}

.developer-project-title h1 {
  font-size: 23px;
}

.developer-project-title p:not(.eyebrow) {
  font-size: 11px;
}

.developer-project-dashboard {
  display: grid;
  gap: 11px;
}

.developer-project-summary {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  padding: 16px;
  border: 1px solid var(--border-soft);
  border-radius: 10px;
  background: var(--panel-bg);
}

.developer-project-summary h2,
.developer-section-heading h3 {
  margin: 2px 0 5px;
  color: var(--text-primary);
}

.developer-project-summary p:not(.eyebrow),
.developer-section-heading p:not(.eyebrow) {
  max-width: 650px;
  margin: 0;
  color: var(--text-secondary);
  line-height: 1.4;
}

.developer-project-stat-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(72px, 1fr));
  gap: 6px;
  flex: none;
}

.developer-project-stat-grid span {
  display: grid;
  gap: 2px;
  padding: 8px 9px;
  border: 1px solid var(--border-soft);
  border-radius: 8px;
  background: var(--panel-bg-muted);
  color: var(--text-secondary);
  font-size: 9px;
  text-align: center;
}

.developer-project-stat-grid strong {
  color: var(--text-primary);
  font-size: 18px;
}

.developer-project-stat-grid span.warn {
  border-color: var(--status-warn-border);
  background: var(--orange-soft);
}

.developer-project-stat-grid span.ok {
  border-color: var(--status-ok-border);
  background: var(--green-soft);
}

.developer-project-readiness {
  display: grid;
  gap: 10px;
  padding: 14px;
  border: 1px solid var(--border-soft);
  border-radius: 10px;
  background: var(--panel-bg-muted);
}

.developer-environment-readiness {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(0, 3fr);
  gap: 11px;
}

.developer-section-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
}

.developer-section-heading h3 {
  font-size: 15px;
}

.developer-readiness-card-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.developer-readiness-card-grid.compact {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.developer-readiness-card {
  display: grid;
  align-content: start;
  gap: 6px;
  min-height: 126px;
  padding: 11px;
  border: 1px solid var(--border-soft);
  border-top: 3px solid var(--green);
  border-radius: 8px;
  background: var(--panel-bg);
}

.developer-readiness-card.unfinished {
  border-top-color: var(--warning);
}

.developer-readiness-card.neutral {
  border-top-color: var(--border-strong);
}

.developer-readiness-card > span {
  color: var(--text-secondary);
  font-size: 9px;
  font-weight: 800;
  text-transform: uppercase;
}

.developer-readiness-card > strong {
  color: var(--text-primary);
  font-size: 13px;
}

.developer-readiness-card > p {
  margin: 0;
  color: var(--text-secondary);
  font-size: 10px;
  line-height: 1.4;
}

.developer-readiness-card > button {
  align-self: end;
  justify-self: start;
  min-height: 28px;
}

.developer-project-section {
  overflow: hidden;
  border: 1px solid var(--border-soft);
  border-radius: 10px;
  background: var(--panel-bg);
}

.developer-project-section > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 52px;
  padding: 10px 14px;
  cursor: pointer;
  list-style: none;
}

.developer-project-section > summary::-webkit-details-marker {
  display: none;
}

.developer-project-section > summary > span {
  display: grid;
  gap: 3px;
}

.developer-project-section > summary strong {
  color: var(--text-primary);
  font-size: 13px;
}

.developer-project-section > summary small {
  color: var(--text-secondary);
  font-size: 10px;
}

.developer-project-section[open] > summary {
  border-bottom: 1px solid var(--border-soft);
  background: var(--panel-bg-muted);
}

.developer-project-section > :not(summary) {
  margin: 10px;
}

.developer-project-section .developer-project-story-inventory {
  margin: 10px;
}

.workspace.management-shell.persona-developer .management-rail {
  width: 100%;
  min-width: 0;
}

.workspace.management-shell.persona-developer .management-rail button {
  justify-content: flex-start;
  padding-inline: 12px;
}

@media (max-width: 1180px) {
  .developer-focus-grid {
    grid-template-columns: 1fr;
  }

  .developer-work-filters {
    grid-template-columns: minmax(0, 1fr) minmax(140px, .7fr);
  }

  .developer-work-filters > button {
    min-height: 35px;
  }

  .developer-metric-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .developer-project-summary {
    display: grid;
    align-items: start;
  }

  .developer-readiness-card-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }


  .developer-environment-readiness {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 820px) {
  .developer-global-workspace {
    padding: 14px 12px 90px;
  }

  .developer-global-head,
  .developer-metric-note {
    display: grid;
    grid-template-columns: 1fr;
    align-items: start;
  }

  .developer-work-filters,
  .developer-metric-grid,
  .developer-readiness-card-grid,
  .developer-project-stat-grid {
    grid-template-columns: 1fr;
  }

  .developer-work-row {
    grid-template-columns: 1fr auto;
  }

  .developer-work-project {
    grid-column: 1 / -1;
  }
}

@keyframes emery-browser-autofill-detected {
  from { opacity: 1; }
  to { opacity: 1; }
}

#app input:-webkit-autofill,
#app textarea:-webkit-autofill,
#app select:-webkit-autofill,
#app input:autofill,
#app textarea:autofill,
#app select:autofill {
  animation-name: emery-browser-autofill-detected;
  animation-duration: 0.001s;
  animation-iteration-count: 1;
}

/* Shared Markdown document surfaces */
.markdown-panel {
  min-width: 0;
  color: var(--text-primary);
}

.markdown-panel--card {
  padding: 12px;
  border: 1px solid var(--border-soft);
  border-radius: 8px;
  background: var(--panel-bg-subtle);
}

.markdown-panel--plain {
  border: 0;
  background: transparent;
}

.markdown-panel--scrollable {
  max-height: min(620px, 58vh);
  max-height: min(620px, 58dvh);
  overflow: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
}

.markdown-panel--scrollable:focus-visible {
  outline: 2px solid var(--accent-ink);
  outline-offset: -3px;
}

.development-plan-live-preview.markdown-panel--scrollable {
  max-height: min(360px, 38vh);
  max-height: min(360px, 38dvh);
}

.markdown-document {
  max-width: 78ch;
  margin-inline: auto;
  overflow-wrap: anywhere;
  color: var(--text-primary);
  font-size: 13px;
  line-height: 1.62;
}

.markdown-document > :first-child {
  margin-top: 0;
}

.markdown-document > :last-child {
  margin-bottom: 0;
}

.markdown-document h3,
.markdown-document h4,
.markdown-document h5,
.markdown-document h6 {
  color: var(--text-primary);
  line-height: 1.28;
  text-wrap: balance;
}

.markdown-document h3 {
  margin: 22px 0 9px;
  font-size: 18px;
}

.markdown-document h4 {
  margin: 18px 0 8px;
  font-size: 15px;
}

.markdown-document h5 {
  margin: 16px 0 7px;
  font-size: 13px;
}

.markdown-document h6 {
  margin: 14px 0 6px;
  font-size: 12px;
}

.markdown-document p {
  margin: 0 0 11px;
  color: var(--text-secondary);
}

.markdown-document ul,
.markdown-document ol {
  margin: 0 0 13px;
  padding-left: 24px;
  color: var(--text-secondary);
}

.markdown-document li {
  margin: 4px 0;
  padding-left: 2px;
}

.markdown-document li::marker {
  color: var(--accent-ink);
  font-weight: 750;
}

.markdown-document .markdown-task {
  display: flex;
  gap: 8px;
  align-items: start;
  padding-left: 0;
}

.markdown-document .markdown-task input {
  flex: 0 0 auto;
  margin: 3px 0 0;
  accent-color: var(--accent);
}

.markdown-document strong {
  color: var(--text-primary);
}

.markdown-document code {
  padding: 1px 5px;
  border: 1px solid var(--border-soft);
  border-radius: 5px;
  background: var(--panel-bg-muted);
  color: var(--text-primary);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .92em;
}

.markdown-document pre {
  max-width: 100%;
  margin: 12px 0 14px;
  overflow: auto;
  padding: 12px 14px;
  border: 1px solid var(--border-soft);
  border-radius: 7px;
  background: var(--panel-bg-muted);
  color: var(--text-primary);
  line-height: 1.55;
  tab-size: 2;
}

.markdown-document pre code {
  padding: 0;
  border: 0;
  background: transparent;
  font-size: 12px;
}

.markdown-diagram {
  display: grid;
  gap: 8px;
  max-width: 100%;
  margin: 12px 0 15px;
  padding: 12px;
  overflow: hidden;
  border: 1px solid var(--border-soft);
  border-radius: 9px;
  background: var(--panel-bg-muted);
}

.markdown-diagram-canvas {
  max-width: 100%;
  min-height: 80px;
  overflow: auto;
  padding: 8px;
  border-radius: 7px;
  background: var(--panel-bg);
}

.markdown-diagram-canvas svg {
  display: block;
  max-width: 100%;
  height: auto;
  margin-inline: auto;
}

.markdown-diagram-status,
.markdown-diagram-error {
  display: grid;
  min-height: 64px;
  margin: 0;
  place-items: center;
  color: var(--text-secondary);
  text-align: center;
}

.markdown-diagram-error {
  color: var(--status-warning-fg);
  background: var(--status-warning-bg);
}

.markdown-diagram-source {
  color: var(--text-secondary);
  font-size: 11px;
}

.markdown-diagram-source summary {
  width: fit-content;
  cursor: pointer;
  font-weight: 750;
}

.markdown-diagram-source pre {
  margin-bottom: 0;
}

.markdown-document blockquote {
  margin: 12px 0;
  padding: 9px 12px;
  border-left: 3px solid var(--accent);
  background: var(--accent-soft);
}

.markdown-document blockquote p {
  margin: 0;
  color: var(--text-primary);
}

.markdown-document a {
  color: var(--link-fg);
  text-decoration-thickness: 1px;
  text-underline-offset: 2px;
}

.markdown-document a:hover,
.markdown-document a:focus-visible {
  color: var(--link-hover-fg);
}

.markdown-document hr {
  margin: 18px 0;
  border: 0;
  border-top: 1px solid var(--border-soft);
}

.markdown-table-wrap {
  max-width: 100%;
  margin: 12px 0 15px;
  overflow-x: auto;
  border: 1px solid var(--border-soft);
  border-radius: 7px;
}

.markdown-document table {
  width: 100%;
  min-width: 420px;
  border-collapse: collapse;
  background: var(--panel-bg);
}

.markdown-document th,
.markdown-document td {
  padding: 8px 10px;
  border-bottom: 1px solid var(--border-soft);
  text-align: left;
  vertical-align: top;
}

.markdown-document th {
  background: var(--panel-header-bg);
  color: var(--text-primary);
  font-size: 11px;
  font-weight: 850;
}

.markdown-document td {
  color: var(--text-secondary);
  font-size: 12px;
}

.markdown-document tbody tr:last-child td {
  border-bottom: 0;
}

.markdown-unsafe-link {
  color: var(--text-secondary);
  font-size: .92em;
}

.markdown-panel--compact .markdown-document {
  max-width: none;
  font-size: 12px;
  line-height: 1.5;
}

.markdown-panel--compact .markdown-document h3 {
  margin-top: 15px;
  font-size: 15px;
}

.markdown-panel--compact .markdown-document h4 {
  margin-top: 13px;
  font-size: 13px;
}

.markdown-panel--compact .markdown-document h5 {
  margin-top: 12px;
  font-size: 12px;
}

.markdown-panel--compact .markdown-document h6 {
  margin-top: 11px;
  font-size: 11px;
}

.markdown-panel--compact .markdown-document p,
.markdown-panel--compact .markdown-document ul,
.markdown-panel--compact .markdown-document ol {
  margin-bottom: 8px;
}

/* Separate Agent Farm plan-review composition */
.plan-review-card {
  display: grid;
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--border-soft);
  border-radius: 8px;
  background: var(--panel-bg);
}

.plan-review-card__header {
  display: flex;
  gap: 16px;
  justify-content: space-between;
  align-items: start;
  padding: 16px 18px 13px;
  border-bottom: 1px solid var(--border-soft);
  background: var(--panel-header-bg);
}

.plan-review-card__header > div {
  min-width: 0;
}

.plan-review-card__eyebrow {
  margin: 0 0 4px;
  color: var(--accent-ink);
  font-size: 10px;
  font-weight: 850;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.plan-review-card__header h3 {
  margin: 0;
  color: var(--text-primary);
  font-size: 17px;
  line-height: 1.3;
}

.plan-review-card__description {
  max-width: 66ch;
  margin: 5px 0 0;
  color: var(--text-secondary);
  font-size: 12px;
  line-height: 1.45;
}

.plan-review-card__status {
  flex: 0 0 auto;
  padding: 4px 8px;
  border: 1px solid color-mix(in srgb, var(--accent) 68%, var(--border-soft));
  border-radius: 999px;
  background: var(--accent-soft);
  color: var(--accent-ink);
  font-size: 10px;
  font-weight: 800;
  white-space: nowrap;
}

.plan-review-card[data-review-status="closed"] .plan-review-card__status {
  border-color: var(--border-soft);
  background: var(--panel-bg-muted);
  color: var(--text-secondary);
}

.plan-review-card__document {
  max-height: min(620px, 56vh);
  max-height: min(620px, 56dvh);
  padding: 18px;
}

.plan-review-card__document .markdown-document {
  max-width: 82ch;
}

.plan-review-card__footer {
  display: grid;
  gap: 12px;
  padding: 14px 18px 16px;
  border-top: 1px solid var(--border-soft);
  background: var(--panel-bg-subtle);
}

.plan-review-card__guidance {
  margin: 0;
  color: var(--text-secondary);
  font-size: 11px;
  line-height: 1.45;
}

.plan-review-card__actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}

.plan-review-card__actions button {
  min-height: 38px;
  min-width: 112px;
  padding-inline: 14px;
}

/* Compact integrations for persona work surfaces */
.workflow-step-markdown {
  margin-top: 3px;
}

.workflow-step-markdown .markdown-document {
  color: var(--text-secondary);
  font-size: 11px;
  line-height: 1.35;
}

.workflow-step-markdown .markdown-document h3,
.workflow-step-markdown .markdown-document h4,
.workflow-step-markdown .markdown-document h5,
.workflow-step-markdown .markdown-document h6 {
  margin: 7px 0 3px;
  font-size: 11px;
}

.workflow-step-markdown .markdown-document p,
.workflow-step-markdown .markdown-document ul,
.workflow-step-markdown .markdown-document ol {
  margin-bottom: 4px;
}

.workflow-step-markdown .markdown-document ul,
.workflow-step-markdown .markdown-document ol {
  padding-left: 17px;
}

.developer-case-step .workflow-step-markdown {
  margin-top: 2px;
}

.work-process-copy {
  min-width: 0;
}

.developer-handoff-preview .persona-plan-markdown {
  max-height: min(340px, 38vh);
  max-height: min(340px, 38dvh);
}

.requirements-summary-markdown .markdown-document {
  color: var(--ink);
  font-size: inherit;
}

.requirements-workflow-active .requirements-summary-markdown,
.requirements-impact-summary .requirements-summary-markdown {
  margin-top: 1px;
}

.development-plan-document {
  min-height: 0;
  display: grid;
  gap: 5px;
}

.development-plan-document-label {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.development-plan-review-document {
  min-height: 180px;
  max-height: min(520px, 56vh);
  max-height: min(520px, 56dvh);
  background: var(--panel-bg);
}

@media (max-width: 760px) {
  .plan-review-card__header {
    display: grid;
    padding: 14px;
  }

  .plan-review-card__status {
    justify-self: start;
  }

  .plan-review-card__document {
    max-height: none;
    overflow: visible;
    padding: 14px;
  }

  .plan-review-card__footer {
    padding: 13px 14px 14px;
  }

  .plan-review-card__actions {
    display: grid;
    grid-template-columns: 1fr;
  }

  .plan-review-card__actions button {
    min-height: 44px;
    width: 100%;
  }

  .markdown-panel--card {
    padding: 10px;
  }

  .markdown-document {
    font-size: 14px;
    line-height: 1.6;
  }

  .mobile-story-summary-card > .mobile-story-markdown {
    grid-column: 1 / -1;
  }

  .mobile-story-summary-card details .mobile-story-markdown {
    margin-top: 8px;
  }

  .mobile-story-markdown .markdown-document {
    font-size: 11px;
    line-height: 1.5;
  }
}

/* Visual system cohesion: flat operational surfaces with semantic color. */
.eyebrow,
.plan-review-card__eyebrow {
  color: var(--text-secondary);
  font-size: 10.5px;
  font-weight: 750;
  letter-spacing: .045em;
}

.helper,
.pane-title p,
.settings-section-head p {
  color: var(--text-secondary);
  line-height: 1.5;
}

.topbar {
  box-shadow: 0 1px 0 color-mix(in srgb, var(--border-strong) 72%, transparent);
}

.persona-chip,
.permissions-topbar-button {
  min-height: 30px;
  padding-inline: 10px;
  border-radius: 8px;
  font-size: 11.5px;
  font-weight: 650;
}

.topbar-access .permissions-topbar-button {
  border-color: transparent !important;
  background: transparent !important;
  color: var(--accent-ink) !important;
}

.topbar-access .permissions-topbar-button:hover,
.topbar-access .permissions-topbar-button:focus-visible {
  border-color: var(--topbar-active-border) !important;
  background: var(--topbar-control-hover-bg) !important;
}

.persona-chip.active {
  box-shadow: inset 0 -2px 0 var(--accent);
}

.management-rail {
  border-right: 1px solid var(--rail-border);
}

.management-rail .rail-primary {
  gap: 7px;
}

.management-rail .rail-button,
.management-rail .profile-menu summary {
  border-radius: 9px;
}

.management-rail .rail-button small,
.management-rail .profile-menu summary::after {
  font-size: 11.5px;
  font-weight: 650;
}

.pane,
.assistant-pane,
.activity-pane,
.gateway-card,
.settings-section,
.operation-drawer,
.support-card,
.metric-card,
.metric-panel,
.executive-kpis > div,
.executive-panel,
.system-metric-card,
.readiness-card,
.story-detail-card,
.story-card,
.artifact-summary-card,
.artifact-declare-card,
.artifact-registry,
.integration-detail,
.integration-config,
.integration-fields,
.project-lifecycle-card,
.queue-group,
.kanban-card,
.what-if-impact,
.what-if-option,
.what-if-draft-change,
.sprint-planner-card,
.story-git-card,
.git-story-card,
.git-overview-card,
.admin-posture-card,
.admin-overview-card,
.developer-focus-card,
.developer-work-group,
.developer-metric-card,
.developer-metric-note,
.developer-project-section,
.plan-review-card {
  border-radius: var(--radius-card);
  box-shadow: none;
}

.pane :where(.pane, .settings-section, .operation-drawer, .artifact-pane),
.settings-section :where(.settings-section, .operation-drawer),
.integration-config :where(.settings-section, .integration-fields) {
  box-shadow: none;
}

.pane-title,
.feed-head,
.assistant-header,
.metric-panel-head,
.data-head,
.queue-group h3,
.kanban-head,
.kanban-column-head,
.sprint-planner-head,
.artifact-declare-head,
.git-story-head,
.git-overview-card > div:first-child,
.story-sprint-head,
.story-sprint-table-head,
.story-assignment-bar,
.integration-detail-head,
.integration-config > .settings-section > h4,
.project-detail-head,
.executive-panel .metric-panel-head,
.admin-overview-card-head,
.developer-work-group > summary,
.developer-project-section > summary,
.plan-review-card__header {
  background: var(--panel-header-bg);
  border-color: var(--border-soft);
}

.developer-work-group[open] > summary,
.developer-project-section[open] > summary {
  border-bottom: 1px solid var(--border-soft);
  background: var(--panel-header-bg-strong);
}

.data-table > .data-row.data-head,
.data-table > .table-row.head,
.mapping-role-head,
.story-sprint-table-head,
.issue-head,
.activity-table .head,
thead th {
  min-height: 38px;
  background: var(--panel-header-bg);
  border-color: var(--border-soft);
  color: var(--text-secondary);
  font-size: 10.5px;
  font-weight: 750;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.data-row,
.queue-table-row,
.queue-row,
.story-row,
.issue-row {
  min-height: 46px;
}

.badge,
.count,
.project-state-pill,
.llm-status,
.sync-badge,
.integration-status-pill {
  min-height: 20px;
  padding-inline: 7px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .005em;
}

button.primary,
.button-link.primary {
  box-shadow: 0 1px 1px color-mix(in srgb, var(--ink) 12%, transparent);
}

button.primary:hover:not(:disabled),
button.primary:focus-visible:not(:disabled),
.button-link.primary:hover,
.button-link.primary:focus-visible {
  box-shadow: 0 3px 8px color-mix(in srgb, var(--button-primary-bg) 24%, transparent);
}

/* Admin overview: each posture keeps a stable domain color while tone signals risk. */
.admin-posture-card {
  --posture-color: var(--accent);
  --posture-soft: var(--accent-soft);
  border-color: color-mix(in srgb, var(--posture-color) 24%, var(--border-soft));
  background: color-mix(in srgb, var(--posture-soft) 64%, var(--panel-bg));
}

.admin-posture-card[data-posture="health"] {
  --posture-color: var(--teal);
  --posture-soft: var(--teal-soft);
}

.admin-posture-card[data-posture="configuration"] {
  --posture-color: var(--orange);
  --posture-soft: var(--orange-soft);
}

.admin-posture-card[data-posture="governance"] {
  --posture-color: var(--violet);
  --posture-soft: var(--violet-soft);
}

.admin-posture-card[data-posture="staffing"] {
  --posture-color: var(--cyan);
  --posture-soft: var(--cyan-soft);
}

.admin-posture-card::before {
  background: var(--posture-color);
}

.admin-posture-card.ok::before { background: var(--green); }
.admin-posture-card.warn::before { background: var(--orange); }
.admin-posture-card.danger::before { background: var(--danger); }

.admin-posture-card > span {
  font-size: 10.5px;
  font-weight: 750;
  letter-spacing: .045em;
}

.admin-posture-card > strong {
  font-size: 19px;
  letter-spacing: -.018em;
}

.admin-posture-card > small {
  font-size: 11px;
  line-height: 1.45;
}

.admin-overview-card {
  border-color: var(--border-soft);
}

.admin-overview-card-head {
  min-height: 54px;
}

.admin-attention-row strong {
  font-size: 12px;
}

.admin-attention-row p {
  font-size: 11px;
  line-height: 1.45;
}

.admin-inventory-row > span {
  font-size: 11.5px;
}

.admin-inventory-row small {
  color: var(--text-secondary);
  font-size: 10px;
  line-height: 1.35;
}

/* Project workspaces: compact navigation, more legible content. */
.em-project-header {
  min-height: 74px;
  border-bottom-color: var(--border-soft);
  box-shadow: 0 1px 0 color-mix(in srgb, var(--border-soft) 72%, transparent);
}

.em-project-context label {
  font-size: 10px;
  font-weight: 750;
  letter-spacing: .045em;
}

.em-project-context select {
  min-height: 34px;
  font-size: 13px;
  font-weight: 650;
}

.em-project-tabs {
  gap: 4px;
}

.em-project-tabs button {
  min-height: 40px;
  padding-inline: 11px;
  font-size: 11.5px;
  font-weight: 650;
}

.em-project-tabs button.active {
  background: color-mix(in srgb, var(--accent-soft) 48%, var(--panel-bg));
}

.em-project-tabs button.active::after {
  height: 2px;
}

.em-project-content {
  padding: 20px 24px var(--workspace-end-space);
}

.em-overview {
  gap: 16px;
}

.em-overview .pane {
  border-color: var(--border-soft);
  border-radius: var(--radius-panel);
  box-shadow: none;
}

.em-overview-summary {
  padding: 20px 22px;
}

.em-overview-title-row h1 {
  font-size: 24px;
  line-height: 1.15;
}

.em-overview-summary > div > p:last-child {
  font-size: 12px;
}

.em-lifecycle li strong {
  font-size: 10.5px;
  font-weight: 700;
}

.em-card-heading h2 {
  font-size: 15px;
}

.em-card-heading button {
  min-height: 30px;
  font-size: 10.5px;
  font-weight: 700;
}

.em-attention-item {
  border-color: var(--border-soft);
  background: var(--panel-bg-subtle);
}

.em-attention-item.high {
  border-color: color-mix(in srgb, var(--danger) 30%, var(--border-soft));
  background: color-mix(in srgb, var(--danger-soft) 56%, var(--panel-bg));
}

.em-attention-item.medium {
  border-color: color-mix(in srgb, var(--orange) 30%, var(--border-soft));
  background: color-mix(in srgb, var(--orange-soft) 58%, var(--panel-bg));
}

.em-attention-item.low {
  border-color: color-mix(in srgb, var(--accent) 28%, var(--border-soft));
  background: color-mix(in srgb, var(--accent-soft) 56%, var(--panel-bg));
}

.em-attention-item strong {
  font-size: 12px;
}

.em-attention-item p,
.em-attention-empty p {
  font-size: 11px;
}

.em-attention-item button {
  min-height: 30px;
  font-size: 10.5px;
}

.em-readiness-item {
  --readiness-color: var(--accent);
  --readiness-soft: var(--accent-soft);
  min-height: 70px;
  border-color: color-mix(in srgb, var(--readiness-color) 24%, var(--border-soft));
  background: color-mix(in srgb, var(--readiness-soft) 52%, var(--panel-bg));
  box-shadow: inset 0 2px 0 color-mix(in srgb, var(--readiness-color) 72%, transparent);
}

.em-readiness-item[data-readiness="requirements"] {
  --readiness-color: var(--orange);
  --readiness-soft: var(--orange-soft);
}

.em-readiness-item[data-readiness="repositories"] {
  --readiness-color: var(--violet);
  --readiness-soft: var(--violet-soft);
}

.em-readiness-item[data-readiness="jira"] {
  --readiness-color: var(--cyan);
  --readiness-soft: var(--cyan-soft);
}

.em-readiness-item[data-readiness="team"] {
  --readiness-color: var(--teal);
  --readiness-soft: var(--teal-soft);
}

.em-readiness-item[data-readiness="policy"] {
  --readiness-color: var(--accent);
  --readiness-soft: var(--accent-soft);
}

.em-readiness-item small {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .035em;
}

.em-readiness-item strong {
  font-size: 11.5px;
  line-height: 1.35;
}

.em-activity-list strong {
  font-size: 12px;
}

.em-activity-list p,
.em-activity-empty,
.em-activity-list time {
  font-size: 11px;
}

/* Developer and QA operational lists share the same readable density. */
.developer-global-workspace {
  gap: 18px;
}

.developer-global-head p:not(.eyebrow),
.developer-project-title p:not(.eyebrow) {
  font-size: 12.5px;
}

.developer-work-filters {
  border-radius: var(--radius-card);
  background: var(--panel-bg-subtle);
}

.developer-work-filters label {
  font-size: 10.5px;
  font-weight: 750;
  letter-spacing: .035em;
}

.developer-work-group {
  border-color: var(--border-soft);
}

.developer-work-group summary {
  min-height: 56px;
}

.developer-work-group summary strong {
  font-size: 13px;
}

.developer-work-group summary small {
  font-size: 11px;
  line-height: 1.4;
}

/* Release Train coordination */
.tm-workspace {
  box-sizing: border-box;
  min-width: 0;
  width: 100%;
  padding: 12px;
  display: grid;
  gap: 10px;
  align-content: start;
}

.tm-workspace .pane {
  min-width: 0;
  border-radius: 8px;
  box-shadow: none;
}

.tm-hero {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) minmax(220px, 340px);
  gap: 12px 18px;
  align-items: start;
  padding: 14px 16px;
}

.tm-title {
  min-width: 0;
}

.tm-title > div {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.tm-title h1,
.tm-title p {
  margin: 0;
}

.tm-title h1 {
  color: var(--ink);
  font-size: clamp(1.15rem, 2vw, 1.55rem);
  line-height: 1.2;
}

.tm-title > p:last-child {
  margin-top: 6px;
  color: var(--text-secondary);
  font-size: 12px;
  line-height: 1.45;
}

.tm-train-switcher {
  color: var(--muted);
  font-size: 10px;
  font-weight: 850;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.tm-train-switcher select {
  width: 100%;
  min-height: 36px;
  margin-top: 5px;
  color: var(--ink);
  font-size: 12px;
  text-transform: none;
}

.tm-hero-facts {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1px;
  margin: 0;
  border: 1px solid var(--line);
  border-radius: 7px;
  overflow: hidden;
  background: var(--line);
}

.tm-hero-facts > div {
  min-width: 0;
  padding: 8px 10px;
  background: var(--panel-bg-subtle);
}

.tm-hero-facts dt,
.tm-hero-facts dd {
  margin: 0;
}

.tm-hero-facts dt {
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
}

.tm-hero-facts dd {
  margin-top: 3px;
  color: var(--ink);
  font-size: 12px;
  font-weight: 800;
}

.tm-command-strip {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
}

.tm-command-strip > article {
  position: relative;
  padding: 10px 12px;
  display: grid;
  gap: 3px;
  border-left: 3px solid var(--line-strong);
}

.tm-command-strip > article.ok { border-left-color: var(--status-ok-fg); }
.tm-command-strip > article.warn { border-left-color: var(--status-warn-fg); }
.tm-command-strip > article.danger { border-left-color: var(--status-danger-fg); }

.tm-command-strip span {
  color: var(--muted);
  font-size: 10px;
  font-weight: 850;
  text-transform: uppercase;
}

.tm-command-strip strong {
  color: var(--ink);
  font-size: 18px;
}

.tm-command-strip p {
  margin: 0;
  color: var(--text-secondary);
  font-size: 11px;
  line-height: 1.35;
}

.tm-overview-stack {
  display: grid;
  gap: 10px;
  min-width: 0;
}

.tm-overview-risk {
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(260px, .72fr);
  gap: 22px;
  padding: 18px 20px;
  border-color: var(--status-warn-border);
  background: color-mix(in srgb, var(--status-warn-bg) 46%, var(--panel-bg));
}

.tm-overview-risk.danger {
  border-color: var(--status-danger-border);
  background: color-mix(in srgb, var(--status-danger-bg) 44%, var(--panel-bg));
}

.tm-overview-risk.ok {
  border-color: var(--status-ok-border);
  background: color-mix(in srgb, var(--status-ok-bg) 38%, var(--panel-bg));
}

.tm-overview-risk-main {
  min-width: 0;
}

.tm-overview-risk-main h2,
.tm-overview-risk-main > p {
  margin: 0;
}

.tm-overview-risk-main h2 {
  max-width: 56ch;
  color: var(--ink);
  font-size: clamp(1.05rem, 1.8vw, 1.35rem);
  line-height: 1.25;
}

.tm-overview-risk-main > p:not(.eyebrow) {
  max-width: 76ch;
  margin-top: 7px;
  color: var(--text-secondary);
  font-size: 11.5px;
  line-height: 1.5;
}

.tm-overview-dependency-path {
  display: grid;
  grid-template-columns: minmax(120px, auto) auto minmax(120px, auto);
  align-items: center;
  justify-content: start;
  gap: 10px;
  margin-top: 14px;
}

.tm-overview-dependency-path > span {
  display: grid;
  gap: 2px;
  min-width: 130px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--panel-bg);
}

.tm-overview-dependency-path small {
  color: var(--muted);
  font-size: 8.5px;
  font-weight: 850;
  letter-spacing: .05em;
  text-transform: uppercase;
}

.tm-overview-dependency-path strong {
  color: var(--ink);
  font-size: 12px;
}

.tm-overview-dependency-path > b {
  color: var(--muted);
  font-size: 9px;
  font-weight: 750;
}

.tm-overview-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 14px;
}

.tm-overview-actions button {
  min-height: 36px;
}

.tm-overview-risk-facts {
  display: grid;
  align-content: start;
  gap: 0;
  min-width: 0;
  margin: 0;
  border-top: 1px solid color-mix(in srgb, var(--line-strong) 72%, transparent);
}

.tm-overview-risk-facts > div {
  display: grid;
  grid-template-columns: minmax(110px, 1fr) auto;
  gap: 12px;
  padding: 8px 0;
  border-bottom: 1px solid color-mix(in srgb, var(--line-strong) 72%, transparent);
}

.tm-overview-risk-facts dt,
.tm-overview-risk-facts dd {
  margin: 0;
  font-size: 10.5px;
}

.tm-overview-risk-facts dt {
  color: var(--muted);
}

.tm-overview-risk-facts dd {
  color: var(--ink);
  font-weight: 850;
  text-align: right;
}

.tm-overview-risk-facts dd.metric-negative {
  color: var(--status-danger-fg);
}

.tm-release-alignment,
.tm-overview-signals {
  padding: 14px 16px;
}

.tm-alignment-axis,
.tm-alignment-row {
  display: grid;
  grid-template-columns: minmax(150px, .65fr) minmax(260px, 2fr) minmax(150px, .72fr);
  gap: 14px;
  align-items: center;
}

.tm-alignment-axis {
  margin-top: 12px;
  color: var(--muted);
  font-size: 9px;
  font-weight: 750;
}

.tm-alignment-axis span:nth-child(2) {
  text-align: center;
}

.tm-alignment-axis span:last-child {
  text-align: right;
}

.tm-alignment-list {
  margin-top: 5px;
  border: 1px solid var(--line);
  border-radius: 7px;
  overflow: hidden;
}

.tm-alignment-row {
  min-height: 56px;
  padding: 8px 10px;
  border-top: 1px solid var(--line);
  background: var(--panel-bg);
}

.tm-alignment-row:first-child {
  border-top: 0;
}

.tm-alignment-row.train-qa {
  background: var(--panel-bg-subtle);
}

.tm-alignment-project,
.tm-alignment-forecast {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.tm-alignment-project strong {
  color: var(--ink);
  font-size: 11.5px;
}

.tm-alignment-project small,
.tm-alignment-forecast small {
  overflow: hidden;
  color: var(--muted);
  font-size: 9.5px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tm-alignment-forecast {
  justify-items: start;
}

.tm-alignment-track {
  position: relative;
  min-width: 0;
  height: 22px;
}

.tm-alignment-track::before {
  content: "";
  position: absolute;
  top: 10px;
  right: 0;
  left: 0;
  height: 2px;
  background: var(--line-strong);
}

.tm-alignment-marker {
  position: absolute;
  z-index: 1;
  top: 5px;
  width: 10px;
  height: 10px;
  border: 2px solid var(--panel-bg);
  border-radius: 50%;
  box-shadow: 0 0 0 1px var(--line-strong);
  transform: translateX(-50%);
}

.tm-alignment-marker.target {
  background: var(--panel-bg);
}

.tm-alignment-marker.forecast {
  background: var(--accent);
  box-shadow: 0 0 0 1px var(--accent);
}

.tm-alignment-marker.forecast.warn {
  background: var(--status-warn-fg);
  box-shadow: 0 0 0 1px var(--status-warn-fg);
}

.tm-alignment-marker.forecast.danger {
  background: var(--status-danger-fg);
  box-shadow: 0 0 0 1px var(--status-danger-fg);
}

.tm-alignment-marker.forecast.ok {
  background: var(--status-ok-fg);
  box-shadow: 0 0 0 1px var(--status-ok-fg);
}

.tm-alignment-qa {
  position: absolute;
  z-index: 1;
  top: 6px;
  height: 10px;
  min-width: 8px;
  border-radius: 5px;
  background: var(--accent);
}

.tm-alignment-qa.warn { background: var(--status-warn-fg); }
.tm-alignment-qa.danger { background: var(--status-danger-fg); }
.tm-alignment-qa.ok { background: var(--status-ok-fg); }

.tm-alignment-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 8px;
  color: var(--muted);
  font-size: 9px;
  font-weight: 750;
}

.tm-alignment-legend span {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}

.tm-alignment-legend i {
  width: 8px;
  height: 8px;
  border: 1px solid var(--line-strong);
  border-radius: 50%;
  background: var(--panel-bg);
}

.tm-alignment-legend i.forecast {
  border-color: var(--accent);
  background: var(--accent);
}

.tm-alignment-legend i.qa {
  width: 16px;
  border: 0;
  border-radius: 4px;
  background: var(--status-warn-fg);
}

.tm-overview-signal-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  margin-top: 10px;
  border: 1px solid var(--line);
  border-radius: 7px;
  overflow: hidden;
  background: var(--line);
}

.tm-overview-signal-grid > article {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  padding: 12px;
  background: var(--panel-bg);
}

.tm-overview-signal-grid > article > div {
  min-width: 0;
}

.tm-overview-signal-grid strong,
.tm-overview-signal-grid p {
  margin: 0;
}

.tm-overview-signal-grid strong {
  color: var(--ink);
  font-size: 11.5px;
}

.tm-overview-signal-grid p {
  margin-top: 3px;
  color: var(--text-secondary);
  font-size: 10px;
  line-height: 1.4;
}

.tm-overview-signal-grid .link-button {
  min-height: 30px;
  margin-top: 5px;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--accent);
  font-size: 10px;
  font-weight: 800;
}

.tm-view-tabs {
  display: flex;
  min-width: 0;
  overflow-x: auto;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--panel-bg);
}

.tm-view-tabs button {
  flex: 0 0 auto;
  min-height: 40px;
  padding: 0 16px;
  border: 0;
  border-bottom: 2px solid transparent;
  border-radius: 0;
  background: transparent;
  color: var(--text-secondary);
  font-size: 11px;
  font-weight: 800;
}

.tm-view-tabs button[aria-selected="true"] {
  border-bottom-color: var(--accent);
  color: var(--accent);
}

.tm-tab-panel {
  display: grid;
  gap: 10px;
  min-width: 0;
}

.tm-tab-panel[hidden] {
  display: none;
}

.tm-delivery-workspace {
  display: grid;
  gap: 10px;
  min-width: 0;
}

.tm-delivery-lenses {
  display: flex;
  gap: 4px;
  width: fit-content;
  max-width: 100%;
  overflow-x: auto;
  padding: 3px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface-muted);
}

.tm-delivery-lenses button {
  flex: 0 0 auto;
  min-height: 30px;
  border: 0;
  background: transparent;
  color: var(--text-secondary);
  font-size: 10px;
  font-weight: 800;
}

.tm-delivery-lenses button[aria-pressed="true"] {
  background: var(--panel-bg);
  color: var(--accent);
  box-shadow: inset 0 0 0 1px var(--line-strong);
}

[data-train-delivery-panel][hidden] {
  display: none;
}

.tm-milestone-delivery {
  display: grid;
  gap: 14px;
  padding: 16px;
}

.tm-signal-legend {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 6px;
}

.tm-signal-legend span {
  padding: 3px 7px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--panel-bg-subtle);
  font-size: 9px;
  font-weight: 850;
}

.tm-signal-legend .ok { color: var(--status-ok-fg); }
.tm-signal-legend .warn { color: var(--status-warn-fg); }
.tm-signal-legend .danger { color: var(--status-danger-fg); }

.tm-milestone-board {
  display: grid;
  grid-auto-columns: minmax(225px, 1fr);
  grid-auto-flow: column;
  gap: 8px;
  min-width: 0;
  overflow-x: auto;
  padding-bottom: 3px;
  scroll-snap-type: x proximity;
}

.tm-milestone-bucket {
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel-bg-subtle);
  scroll-snap-align: start;
}

.tm-milestone-bucket.beyond {
  border-color: var(--status-danger-border);
}

.tm-milestone-bucket > header {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  align-items: start;
  min-height: 64px;
  padding: 10px;
  border-bottom: 1px solid var(--line);
  background: var(--panel-bg);
}

.tm-milestone-bucket > header > div {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 2px 7px;
  min-width: 0;
}

.tm-milestone-bucket > header > div > span {
  grid-row: 1 / 3;
  align-self: center;
  color: var(--accent);
  font-size: 12px;
  font-weight: 900;
}

.tm-milestone-bucket.beyond > header > div > span {
  color: var(--status-danger-fg);
}

.tm-milestone-bucket.completed > header > div > span {
  color: var(--status-ok-fg);
}

.tm-milestone-bucket > header strong {
  overflow: hidden;
  color: var(--ink);
  font-size: 10.5px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tm-milestone-bucket > header small {
  color: var(--muted);
  font-size: 9px;
}

.tm-milestone-story-list {
  display: grid;
  gap: 6px;
  align-content: start;
  min-height: 130px;
  max-height: 430px;
  overflow-y: auto;
  padding: 8px;
}

.tm-milestone-story {
  display: grid;
  gap: 5px;
  min-width: 0;
  padding: 9px;
  border: 1px solid var(--line);
  border-left-width: 3px;
  border-radius: 6px;
  background: var(--panel-bg);
}

.tm-milestone-story.ok { border-left-color: var(--status-ok-fg); }
.tm-milestone-story.warn { border-left-color: var(--status-warn-fg); }
.tm-milestone-story.danger { border-left-color: var(--status-danger-fg); }

.tm-milestone-story > div,
.tm-milestone-story footer {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  min-width: 0;
}

.tm-milestone-story strong {
  color: var(--ink);
  font-size: 10px;
}

.tm-milestone-story > div > span:not(.tm-milestone-story-meta),
.tm-milestone-story footer {
  color: var(--muted);
  font-size: 8.5px;
  font-weight: 750;
}

.tm-milestone-story-meta {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 5px;
  color: var(--muted);
  font-size: 8.5px;
  font-weight: 750;
}

.tm-milestone-story-meta .badge {
  padding: 1px 4px;
  font-size: 7.5px;
}

.tm-milestone-story p {
  margin: 0;
  color: var(--text-primary);
  font-size: 10px;
  line-height: 1.35;
}

.tm-milestone-empty {
  display: grid;
  place-items: center;
  min-height: 112px;
  padding: 12px;
  color: var(--muted);
  font-size: 9.5px;
  line-height: 1.4;
  text-align: center;
}

.tm-milestone-finish {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
  align-items: center;
  padding-top: 4px;
  color: var(--muted);
  font-size: 9.5px;
}

.tm-milestone-finish strong {
  color: var(--ink);
}

.tm-milestone-finish .withheld {
  color: var(--status-danger-fg);
}

.tm-milestone-commitment {
  padding-left: 8px;
  border-left: 1px solid var(--line);
}

.tm-project-milestone-alignment {
  padding: 12px;
}

.tm-project-milestone-alignment td:first-child span {
  display: block;
  margin-top: 2px;
  color: var(--muted);
  font-size: 9px;
}

.tm-milestone-settings {
  display: grid;
  gap: 16px;
  padding: 16px;
}

.tm-milestone-form {
  display: grid;
  gap: 10px;
  min-width: 0;
}

.tm-milestone-list {
  display: grid;
  gap: 1px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--line);
}

.tm-milestone-setting-row {
  display: grid;
  grid-template-columns: 48px minmax(210px, 1fr) minmax(170px, .55fr) auto;
  gap: 10px;
  align-items: end;
  min-width: 0;
  padding: 10px;
  background: var(--panel-bg);
}

.tm-milestone-key {
  align-self: center;
  color: var(--accent);
  font-size: 13px;
  font-weight: 900;
}

.tm-milestone-setting-row label {
  display: grid;
  gap: 4px;
  min-width: 0;
  color: var(--muted);
  font-size: 9px;
  font-weight: 850;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.tm-milestone-setting-row input {
  width: 100%;
  min-height: 36px;
  color: var(--ink);
  font-size: 11px;
  text-transform: none;
}

.tm-milestone-setting-row .utility {
  min-height: 36px;
}

.tm-milestone-form-footer {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
}

.tm-milestone-form-footer > div {
  display: flex;
  gap: 12px;
  align-items: center;
}

.tm-milestone-form-footer span {
  color: var(--muted);
  font-size: 10px;
}

.tm-milestone-preview {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
  gap: 1px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--line);
}

.tm-milestone-preview article {
  position: relative;
  display: grid;
  gap: 3px;
  min-width: 0;
  padding: 12px;
  background: var(--panel-bg-subtle);
}

.tm-milestone-preview article::after {
  content: "";
  position: absolute;
  top: 18px;
  right: -1px;
  width: 1px;
  height: 16px;
  background: var(--line-strong);
}

.tm-milestone-preview span {
  color: var(--accent);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .06em;
}

.tm-milestone-preview strong {
  overflow: hidden;
  color: var(--ink);
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tm-milestone-preview small {
  color: var(--muted);
  font-size: 9.5px;
}

.tm-milestone-preview .train-qa span {
  color: var(--status-warn-fg);
}

.tm-milestone-preview .rtm span {
  color: var(--status-ok-fg);
}

.tm-primary-grid,
.tm-secondary-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(280px, .75fr);
  gap: 10px;
  align-items: start;
}

.tm-dependencies,
.tm-risks,
.tm-project-releases,
.tm-schedule,
.tm-burn-trends,
.tm-quality-flow,
.tm-questions,
.tm-what-if {
  padding: 12px;
}

.tm-dependency-workspace {
  display: grid;
  gap: 10px;
  min-width: 0;
}

.tm-dependency-toolbar {
  display: grid;
  grid-template-columns: minmax(135px, .55fr) minmax(150px, .65fr) minmax(125px, .5fr) minmax(210px, 1fr) auto;
  gap: 8px;
  align-items: end;
  padding: 10px;
}

.tm-dependency-toolbar label {
  display: grid;
  gap: 4px;
  color: var(--muted);
  font-size: 9px;
  font-weight: 850;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.tm-dependency-toolbar select,
.tm-dependency-toolbar input {
  width: 100%;
  min-height: 36px;
  color: var(--ink);
  font-size: 11px;
  text-transform: none;
}

.tm-dependency-toolbar > .badge {
  align-self: center;
}

.tm-dependency-workbench {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(285px, 340px);
  gap: 10px;
  align-items: start;
  min-width: 0;
}

.tm-dependency-detail {
  position: sticky;
  top: 8px;
  min-width: 0;
  padding: 12px;
}

.tm-dependency-detail-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
}

.tm-dependency-detail-heading h2 {
  margin: 2px 0 0;
  color: var(--ink);
  font-size: 15px;
}

.tm-dependency-detail-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  margin: 12px 0 0;
  border: 1px solid var(--line);
  border-radius: 7px;
  overflow: hidden;
  background: var(--line);
}

.tm-dependency-detail-list > div {
  min-width: 0;
  padding: 9px;
  background: var(--panel-bg-subtle);
}

.tm-dependency-detail-list > div.wide {
  grid-column: 1 / -1;
}

.tm-dependency-detail-list dt,
.tm-dependency-detail-list dd {
  margin: 0;
}

.tm-dependency-detail-list dt {
  color: var(--muted);
  font-size: 8.5px;
  font-weight: 850;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.tm-dependency-detail-list dd {
  margin-top: 4px;
  color: var(--text-secondary);
  font-size: 10.5px;
  line-height: 1.4;
  overflow-wrap: anywhere;
}

.tm-dependency-detail-list dd strong,
.tm-dependency-detail-list dd small {
  display: block;
}

.tm-dependency-detail-list dd strong {
  color: var(--ink);
}

.tm-dependency-detail-list dd small {
  margin-top: 2px;
  color: var(--muted);
}

.tm-dependency-detail-actions {
  display: grid;
  gap: 7px;
  margin-top: 10px;
}

.tm-dependency-detail-actions p {
  margin: 0;
  color: var(--text-secondary);
  font-size: 10.5px;
  line-height: 1.4;
}

.tm-dependency-row[tabindex] {
  cursor: pointer;
}

.tm-dependency-row[tabindex]:hover,
.tm-dependency-row[tabindex]:focus-visible,
.tm-dependency-row.selected {
  background: var(--surface-selected);
}

.tm-dependency-row[tabindex]:focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: -2px;
}

.tm-burn-chart-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-top: 10px;
}

.tm-burn-chart-card {
  --tm-chart-grid: color-mix(in srgb, var(--muted) 25%, transparent);
  --tm-chart-incoming: var(--status-warn-fg);
  --tm-chart-outgoing: var(--status-ok-fg);
  --tm-chart-backlog: var(--accent);
  min-width: 0;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--panel-bg-subtle);
}

.tm-burn-chart-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
}

.tm-burn-chart-heading h3,
.tm-burn-chart-heading p {
  margin: 0;
}

.tm-burn-chart-heading h3 {
  color: var(--ink);
  font-size: 13px;
}

.tm-burn-chart-heading p {
  margin-top: 2px;
  color: var(--muted);
  font-size: 10px;
}

.tm-burn-chart-heading > strong {
  flex: 0 0 auto;
  color: var(--ink);
  font-size: 12px;
}

.tm-burn-chart-heading > strong.metric-positive {
  color: var(--status-ok-fg);
}

.tm-burn-chart-heading > strong.metric-negative {
  color: var(--status-danger-fg);
}

.tm-burn-canvas {
  display: block;
  width: 100%;
  height: 190px;
  margin-top: 8px;
}

.tm-burn-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 2px;
  color: var(--text-secondary);
  font-size: 9.5px;
  font-weight: 750;
}

.tm-burn-legend span {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}

.tm-burn-legend i {
  width: 18px;
  border-top: 2px solid var(--tm-chart-incoming);
}

.tm-burn-legend i.outgoing {
  border-top-color: var(--tm-chart-outgoing);
  border-top-style: dashed;
}

.tm-burn-legend i.backlog {
  border-top-color: var(--tm-chart-backlog);
}

.tm-burn-insight,
.tm-burn-coverage-note {
  margin: 7px 0 0;
  color: var(--text-secondary);
  font-size: 10px;
  line-height: 1.4;
}

.tm-burn-empty {
  margin-top: 10px;
  padding: 14px;
  border: 1px solid var(--status-warn-border);
  border-radius: 7px;
  background: var(--status-warn-bg);
}

.tm-burn-empty strong,
.tm-burn-empty p {
  margin: 0;
}

.tm-burn-empty p {
  margin-top: 3px;
  color: var(--text-secondary);
  font-size: 10.5px;
}

.tm-burn-audit {
  margin-top: 10px;
  border-top: 1px solid var(--line);
}

.tm-burn-audit summary {
  padding: 9px 2px 0;
  color: var(--accent);
  cursor: pointer;
  font-size: 10.5px;
  font-weight: 800;
}

.tm-burn-audit-scroll {
  margin-top: 8px;
  overflow-x: auto;
}

.tm-burn-audit table {
  width: 100%;
  min-width: 560px;
  border-collapse: collapse;
  color: var(--text-secondary);
  font-size: 10px;
}

.tm-burn-audit th,
.tm-burn-audit td {
  padding: 7px 8px;
  border: 1px solid var(--line);
  text-align: left;
}

.tm-burn-audit th {
  background: var(--panel-header-bg);
  color: var(--muted);
  font-size: 9px;
  text-transform: uppercase;
}

.tm-burn-audit td small {
  display: block;
  margin-top: 2px;
  color: var(--muted);
}

.tm-workspace .em-card-heading {
  align-items: start;
}

.tm-workspace .em-card-heading p:not(.eyebrow) {
  margin: 3px 0 0;
  color: var(--text-secondary);
  font-size: 11px;
  line-height: 1.4;
}

.developer-work-row {
  min-height: 54px;
}

.developer-work-project {
  font-size: 11px;
  font-weight: 700;
}

.developer-work-story strong {
  font-size: 12.5px;
}

.developer-work-story small,
.developer-work-group-empty {
  font-size: 11px;
}

.developer-focus-card-head,
.developer-focus-card > small,
.developer-metric-card > span,
.developer-readiness-card > span {
  font-size: 10.5px;
}

.developer-focus-card > p,
.developer-metric-card > p,
.developer-metric-note > p,
.developer-readiness-card > p,
.developer-project-section > summary small {
  font-size: 11px;
}

.developer-project-section > summary strong {
  font-size: 13.5px;
}

@media (max-width: 1180px) {
  .em-project-content {
    padding-inline: 18px;
  }
}

.tm-dependency-table,
.tm-quality-table,
.tm-project-release-table {
  margin-top: 10px;
  display: grid;
  border: 1px solid var(--line);
  border-radius: 7px;
  overflow: hidden;
}

.tm-dependency-row,
.tm-quality-row,
.tm-project-release-row {
  min-width: 0;
  display: grid;
  align-items: center;
  gap: 8px;
  padding: 8px 9px;
  border-top: 1px solid var(--line);
  background: var(--panel-bg);
}

.tm-dependency-row {
  grid-template-columns: minmax(200px, 1.55fr) minmax(105px, .75fr) minmax(86px, .55fr) minmax(105px, .65fr) minmax(105px, .65fr);
}

.tm-project-release-row {
  grid-template-columns: minmax(210px, 1.35fr) minmax(150px, .9fr) minmax(90px, .55fr) minmax(105px, .6fr) minmax(95px, .55fr);
}

.tm-quality-row {
  grid-template-columns: minmax(155px, 1.2fr) repeat(3, minmax(72px, .5fr)) minmax(105px, .7fr) minmax(125px, .85fr) minmax(125px, .9fr);
}

.tm-dependency-row:first-child,
.tm-quality-row:first-child,
.tm-project-release-row:first-child {
  border-top: 0;
}

.tm-dependency-row.head,
.tm-quality-row.head,
.tm-project-release-row.head {
  padding-block: 7px;
  background: var(--panel-header-bg);
  color: var(--muted);
  font-size: 10px;
  font-weight: 850;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.tm-dependency-row > span,
.tm-quality-row > span,
.tm-project-release-row > span {
  min-width: 0;
  display: grid;
  justify-items: start;
  gap: 2px;
  color: var(--text-secondary);
  font-size: 11px;
}

.tm-dependency-row strong,
.tm-quality-row strong,
.tm-project-release-row strong {
  color: var(--ink);
  font-size: 11px;
  overflow-wrap: anywhere;
}

.tm-dependency-row small,
.tm-quality-row small,
.tm-project-release-row small {
  color: var(--muted);
  font-size: 10px;
  line-height: 1.3;
}

.tm-duration-form {
  display: flex;
  align-items: end;
  gap: 6px;
}

.tm-duration-form label {
  display: flex;
  align-items: center;
  gap: 6px;
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
}

.tm-duration-form input {
  width: 64px;
  min-height: 32px;
}

.tm-duration-form button {
  min-height: 32px;
}

.tm-gantt {
  position: relative;
  margin-top: 12px;
  padding-bottom: 34px;
  border: 1px solid var(--line);
  border-radius: 7px;
  overflow: hidden;
  background: var(--panel-bg-subtle);
}

.tm-gantt-axis,
.tm-gantt-row {
  display: grid;
  grid-template-columns: minmax(120px, 165px) minmax(260px, 1fr) minmax(105px, auto);
  align-items: center;
  gap: 10px;
}

.tm-gantt-axis {
  min-height: 30px;
  padding: 0 9px;
  border-bottom: 1px solid var(--line);
  color: var(--muted);
  font-size: 9px;
  font-weight: 800;
  text-transform: uppercase;
}

.tm-gantt-axis span:nth-child(2) { text-align: center; }
.tm-gantt-axis span:last-child { text-align: right; }

.tm-gantt-row {
  min-height: 47px;
  padding: 6px 9px;
  border-bottom: 1px solid var(--line);
}

.tm-gantt-row > span {
  min-width: 0;
  display: grid;
}

.tm-gantt-row > span strong {
  color: var(--ink);
  font-size: 11px;
}

.tm-gantt-row > span small {
  color: var(--muted);
  font-size: 9.5px;
  overflow-wrap: anywhere;
}

.tm-gantt-track {
  position: relative;
  height: 12px;
  border-radius: 999px;
  background:
    linear-gradient(90deg, transparent 24.75%, var(--line) 25%, transparent 25.25%, transparent 49.75%, var(--line) 50%, transparent 50.25%, transparent 74.75%, var(--line) 75%, transparent 75.25%),
    var(--surface-soft);
}

.tm-gantt-track i {
  position: absolute;
  top: 2px;
  height: 8px;
  min-width: 3px;
  border-radius: 999px;
  background: var(--accent);
}

.tm-gantt-track i.ok { background: var(--status-ok-fg); }
.tm-gantt-track i.warn { background: var(--status-warn-fg); }
.tm-gantt-track i.danger { background: var(--status-danger-fg); }

.tm-gantt-milestones {
  position: absolute;
  left: min(175px, 30%);
  right: 114px;
  bottom: 0;
  height: 32px;
}

.tm-gantt-milestones > i {
  position: absolute;
  bottom: 0;
  width: 1px;
  height: 28px;
  background: var(--muted);
}

.tm-gantt-milestones > i.forecast { background: var(--accent); }
.tm-gantt-milestones > i.forecast.warn { background: var(--status-warn-fg); }
.tm-gantt-milestones > i.forecast.danger { background: var(--status-danger-fg); }

.tm-gantt-milestones span {
  position: absolute;
  bottom: 3px;
  left: 4px;
  width: max-content;
  color: var(--muted);
  font-size: 8.5px;
  font-style: normal;
  font-weight: 800;
}

.tm-forecast-warning {
  margin: 8px 0 0;
  padding: 8px 10px;
  border: 1px solid var(--status-warn-fg);
  border-radius: 6px;
  background: var(--status-warn-bg);
  color: var(--text-secondary);
  font-size: 10.5px;
}

.tm-quality-row .metric-positive { color: var(--status-ok-fg); }
.tm-quality-row .metric-negative { color: var(--status-danger-fg); }

.tm-dependency-row p {
  margin: 2px 0 0;
  color: var(--text-secondary);
  font-size: 10px;
  line-height: 1.35;
}

.tm-risk-list,
.tm-question-list {
  margin-top: 10px;
  display: grid;
  gap: 6px;
}

.tm-risk-list > article {
  display: grid;
  grid-template-columns: 8px minmax(0, 1fr);
  gap: 8px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--panel-bg-subtle);
}

.tm-risk-list > article > span {
  width: 7px;
  height: 7px;
  margin-top: 4px;
  border-radius: 999px;
  background: var(--muted);
}

.tm-risk-list > article.high > span { background: var(--status-danger-fg); }
.tm-risk-list > article.medium > span { background: var(--status-warn-fg); }
.tm-risk-list strong,
.tm-question-list strong {
  color: var(--ink);
  font-size: 11px;
  line-height: 1.35;
}

.tm-risk-list p,
.tm-question-list p {
  margin: 3px 0;
  color: var(--text-secondary);
  font-size: 10.5px;
  line-height: 1.4;
}

.tm-risk-list small,
.tm-question-list small {
  color: var(--muted);
  font-size: 10px;
}

.tm-question-list > article {
  display: grid;
  gap: 3px;
  padding: 8px 9px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--panel-bg-subtle);
}

.tm-what-if {
  display: grid;
  gap: 10px;
}

.tm-what-if > label {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 4px 8px;
  color: var(--ink);
  font-size: 11px;
  font-weight: 750;
}

.tm-what-if output {
  color: var(--muted);
  font-size: 10px;
}

.tm-what-if input[type="range"] {
  grid-column: 1 / -1;
  width: 100%;
}

.tm-what-if dl {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  margin: 0;
  border: 1px solid var(--line);
  border-radius: 7px;
  overflow: hidden;
  background: var(--line);
}

.tm-what-if dl > div {
  padding: 8px;
  background: var(--panel-bg-subtle);
}

.tm-what-if dt,
.tm-what-if dd {
  margin: 0;
}

.tm-what-if dt {
  color: var(--muted);
  font-size: 9px;
  text-transform: uppercase;
}

.tm-what-if dd {
  margin-top: 3px;
  color: var(--ink);
  font-size: 14px;
  font-weight: 850;
}

.tm-what-if-warning {
  margin: 0;
  padding: 8px 9px;
  border: 1px solid var(--status-warn-border);
  border-radius: 6px;
  background: var(--status-warn-bg);
  color: var(--text-secondary);
  font-size: 10.5px;
  line-height: 1.4;
}

@media (max-width: 1100px) {
  .tm-command-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .tm-overview-risk {
    grid-template-columns: 1fr;
  }

  .tm-primary-grid,
  .tm-secondary-grid {
    grid-template-columns: 1fr;
  }

  .tm-dependency-toolbar {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .tm-dependency-toolbar > .badge {
    justify-self: start;
  }

  .tm-dependency-workbench {
    grid-template-columns: 1fr;
  }

  .tm-dependency-detail {
    position: static;
  }

  .tm-dependency-row {
    grid-template-columns: minmax(180px, 1.35fr) repeat(4, minmax(88px, .65fr));
  }
}

@media (max-width: 760px) {
  .workspace.management-shell,
  .workspace.management-shell.assistant-collapsed {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto minmax(0, 1fr);
  }

  .workspace.management-shell .management-rail {
    grid-column: 1;
    grid-row: 1;
    width: auto;
  }

  .workspace.management-shell .mission {
    grid-column: 1;
    grid-row: 2;
    min-width: 0;
  }

  .workspace.management-shell .assistant-peek {
    grid-column: 1;
  }

  .tm-workspace {
    padding: 8px;
  }

  .tm-hero {
    grid-template-columns: 1fr;
  }

  .tm-hero-facts {
    grid-column: 1;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .tm-command-strip {
    grid-template-columns: 1fr;
  }

  .tm-overview-risk {
    padding: 14px;
  }

  .tm-overview-dependency-path {
    grid-template-columns: 1fr;
  }

  .tm-overview-dependency-path > b {
    justify-self: start;
  }

  .tm-alignment-axis {
    display: none;
  }

  .tm-alignment-list {
    margin-top: 10px;
  }

  .tm-alignment-row {
    grid-template-columns: minmax(95px, .7fr) minmax(170px, 1.5fr);
    gap: 8px;
  }

  .tm-alignment-forecast {
    grid-column: 1 / -1;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
  }

  .tm-overview-signal-grid {
    grid-template-columns: 1fr;
  }

  .tm-view-tabs button {
    min-height: 44px;
    padding-inline: 14px;
  }

  .tm-milestone-setting-row {
    grid-template-columns: 42px minmax(0, 1fr);
  }

  .tm-milestone-setting-row label,
  .tm-milestone-setting-row .utility {
    grid-column: 2;
  }

  .tm-milestone-form-footer,
  .tm-milestone-form-footer > div {
    align-items: stretch;
    flex-direction: column;
  }

  .tm-dependency-toolbar,
  .tm-burn-chart-grid {
    grid-template-columns: 1fr;
  }

  .tm-dependency-toolbar select,
  .tm-dependency-toolbar input {
    min-height: 44px;
  }

  .tm-dependency-detail-list {
    grid-template-columns: 1fr;
  }

  .tm-dependency-detail-list > div.wide {
    grid-column: 1;
  }

  .tm-dependency-row,
  .tm-quality-row,
  .tm-project-release-row {
    grid-template-columns: 1fr;
    gap: 6px;
    padding: 10px;
  }

  .tm-dependency-row.head,
  .tm-quality-row.head,
  .tm-project-release-row.head {
    display: none;
  }

  .tm-dependency-row > span,
  .tm-quality-row > span,
  .tm-project-release-row > span {
    min-height: 0;
  }

  .tm-dependency-row > span::before,
  .tm-quality-row > span::before,
  .tm-project-release-row > span::before {
    content: attr(data-label);
    color: var(--muted);
    font-size: 9px;
    font-weight: 850;
    letter-spacing: .04em;
    text-transform: uppercase;
  }

  .tm-dependency-row button,
  .tm-quality-row button,
  .tm-project-release-row button {
    min-height: 44px;
  }

  .tm-what-if dl {
    grid-template-columns: 1fr;
  }

  .tm-duration-form {
    align-items: center;
  }

  .tm-gantt-axis,
  .tm-gantt-row {
    grid-template-columns: 105px minmax(180px, 1fr) 92px;
  }

  .tm-gantt {
    overflow-x: auto;
  }

  .tm-gantt-axis,
  .tm-gantt-row {
    min-width: 520px;
  }
}

.em-train-alignments,
.em-cross-project-dependencies {
  display: grid;
  gap: 10px;
}

.em-train-alignment-card {
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  background: var(--panel-bg);
}

.em-train-alignment-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 14px;
  border-bottom: 1px solid var(--line);
  background: var(--panel-bg-subtle);
}

.em-train-alignment-head h3,
.em-train-alignment-head p {
  margin: 0;
}

.em-train-alignment-head h3 {
  margin-top: 2px;
  color: var(--ink);
  font-size: 14px;
}

.em-train-alignment-head p:not(.eyebrow) {
  margin-top: 3px;
  color: var(--muted);
  font-size: 10px;
}

.em-train-schedule-facts {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1px;
  margin: 0;
  border-bottom: 1px solid var(--line);
  background: var(--line);
}

.em-train-schedule-facts > div {
  min-width: 0;
  padding: 9px 11px;
  background: var(--panel-bg);
}

.em-train-schedule-facts dt,
.em-train-schedule-facts dd {
  margin: 0;
}

.em-train-schedule-facts dt {
  color: var(--muted);
  font-size: 8px;
  font-weight: 850;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.em-train-schedule-facts dd {
  margin-top: 3px;
  color: var(--ink);
  font-size: 11px;
  font-weight: 850;
}

.em-train-schedule-facts small {
  display: block;
  margin-top: 2px;
  color: var(--muted);
  font-size: 8.5px;
}

.em-train-milestone-board {
  display: grid;
  grid-template-columns: repeat(var(--em-train-columns), minmax(144px, 1fr));
  gap: 8px;
  overflow-x: auto;
  padding: 12px;
  background: var(--panel-bg-subtle);
}

.em-train-milestone-bucket {
  min-width: 144px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--panel-bg);
}

.em-train-milestone-bucket.danger {
  border-color: color-mix(in srgb, var(--danger) 42%, var(--line));
}

.em-train-milestone-bucket > header {
  display: grid;
  gap: 2px;
  min-height: 58px;
  padding: 8px 9px;
  border-bottom: 1px solid var(--line);
  background: var(--panel-bg-subtle);
}

.em-train-milestone-bucket > header span {
  color: var(--accent);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.em-train-milestone-bucket > header strong {
  overflow: hidden;
  color: var(--ink);
  font-size: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.em-train-milestone-bucket > header small {
  color: var(--muted);
  font-size: 8.5px;
}

.em-train-milestone-bucket > div {
  display: grid;
  align-content: start;
  gap: 6px;
  min-height: 106px;
  padding: 7px;
}

.em-train-story-card {
  position: relative;
  display: grid;
  gap: 2px;
  min-width: 0;
  padding: 7px 8px;
  border: 1px solid var(--line);
  border-left: 3px solid var(--status-ok-fg);
  border-radius: 6px;
  background: var(--panel-bg);
}

.em-train-story-card.yellow {
  border-left-color: var(--status-warn-fg);
}

.em-train-story-card.red {
  border-left-color: var(--danger);
}

.em-train-story-card > .badge {
  position: absolute;
  top: 6px;
  right: 6px;
  padding: 2px 5px;
  font-size: 7.5px;
}

.em-train-story-card strong,
.em-train-story-card p,
.em-train-story-card small {
  min-width: 0;
  margin: 0;
}

.em-train-story-card strong {
  max-width: calc(100% - 42px);
  overflow: hidden;
  color: var(--ink);
  font-size: 9.5px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.em-train-story-card p {
  display: -webkit-box;
  overflow: hidden;
  color: var(--text-secondary);
  font-size: 9px;
  line-height: 1.3;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.em-train-story-card small,
.em-train-milestone-empty {
  color: var(--muted);
  font-size: 8.5px;
}

.em-train-milestone-empty {
  margin: 0;
  padding: 8px 2px;
}

.em-train-qa-strip {
  display: grid;
  grid-template-columns: minmax(120px, 1fr) minmax(20px, .35fr) minmax(120px, 1fr) minmax(20px, .35fr) minmax(120px, 1fr);
  align-items: center;
  gap: 8px;
  padding: 10px 14px;
  border-top: 1px solid var(--line);
}

.em-train-qa-strip span {
  display: grid;
  gap: 2px;
  text-align: center;
}

.em-train-qa-strip strong {
  color: var(--ink);
  font-size: 9.5px;
}

.em-train-qa-strip small {
  color: var(--muted);
  font-size: 8.5px;
}

.em-train-qa-strip i {
  height: 1px;
  background: var(--line-strong);
}

.em-dependency-spotlight {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(250px, .72fr);
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  background: var(--panel-bg);
}

.em-dependency-spotlight-main {
  min-width: 0;
  padding: 14px;
}

.em-dependency-spotlight .em-card-heading h3 {
  margin: 0;
  color: var(--ink);
  font-size: 15px;
}

.em-dependency-spotlight .em-card-heading p:not(.eyebrow) {
  margin: 3px 0 0;
  color: var(--muted);
  font-size: 10px;
}

.em-dependency-spotlight-path {
  display: grid;
  grid-template-columns: minmax(130px, 1fr) auto minmax(130px, 1fr);
  align-items: center;
  gap: 10px;
  margin-top: 12px;
}

.em-dependency-spotlight-path > span {
  min-width: 0;
  padding: 9px 10px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--panel-bg-subtle);
}

.em-dependency-spotlight-path small,
.em-dependency-spotlight-path strong,
.em-dependency-spotlight-path p {
  display: block;
  margin: 0;
}

.em-dependency-spotlight-path small {
  color: var(--muted);
  font-size: 8px;
  font-weight: 850;
  letter-spacing: .05em;
  text-transform: uppercase;
}

.em-dependency-spotlight-path strong {
  margin-top: 2px;
  color: var(--ink);
  font-size: 12px;
}

.em-dependency-spotlight-path p {
  margin-top: 2px;
  overflow: hidden;
  color: var(--text-secondary);
  font-size: 9.5px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.em-dependency-spotlight-path > b {
  color: var(--muted);
  font-size: 8.5px;
  font-weight: 800;
}

.em-dependency-spotlight-facts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  margin: 10px 0 0;
  border: 1px solid var(--line);
  border-radius: 7px;
  overflow: hidden;
  background: var(--line);
}

.em-dependency-spotlight-facts > div {
  min-width: 0;
  padding: 8px 9px;
  background: var(--panel-bg);
}

.em-dependency-spotlight-facts dt,
.em-dependency-spotlight-facts dd {
  margin: 0;
}

.em-dependency-spotlight-facts dt {
  color: var(--muted);
  font-size: 8px;
  font-weight: 850;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.em-dependency-spotlight-facts dd {
  margin-top: 3px;
  color: var(--text-secondary);
  font-size: 10px;
  line-height: 1.4;
  overflow-wrap: anywhere;
}

.em-dependency-actions.spotlight {
  justify-content: flex-start;
  margin-top: 10px;
}

.em-dependency-lifecycle {
  min-width: 0;
  padding: 14px;
  border-left: 1px solid var(--line);
  background: var(--panel-bg-subtle);
}

.em-dependency-lifecycle > .eyebrow {
  margin-bottom: 10px;
}

.em-dependency-lifecycle article {
  position: relative;
  display: grid;
  grid-template-columns: 16px minmax(0, 1fr);
  gap: 8px;
  min-height: 62px;
}

.em-dependency-lifecycle article:not(:last-child)::after {
  content: "";
  position: absolute;
  top: 14px;
  bottom: 0;
  left: 6px;
  width: 2px;
  background: var(--line-strong);
}

.em-dependency-lifecycle article > span {
  position: relative;
  z-index: 1;
  width: 12px;
  height: 12px;
  border: 2px solid var(--line-strong);
  border-radius: 50%;
  background: var(--panel-bg);
}

.em-dependency-lifecycle article.complete > span {
  border-color: var(--status-ok-fg);
  background: var(--status-ok-fg);
}

.em-dependency-lifecycle article.complete:not(:last-child)::after {
  background: var(--status-ok-fg);
}

.em-dependency-lifecycle strong,
.em-dependency-lifecycle p {
  margin: 0;
}

.em-dependency-lifecycle strong {
  color: var(--ink);
  font-size: 11px;
}

.em-dependency-lifecycle article.complete strong {
  color: var(--status-ok-fg);
}

.em-dependency-lifecycle p {
  margin-top: 3px;
  color: var(--text-secondary);
  font-size: 9.5px;
  line-height: 1.4;
}

.em-dependency-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1px;
  border: 1px solid var(--line);
  border-radius: 7px;
  overflow: hidden;
  background: var(--line);
}

.em-dependency-metrics > div {
  display: grid;
  gap: 2px;
  padding: 8px 10px;
  background: var(--panel-bg-subtle);
}

.em-dependency-metrics span {
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
}

.em-dependency-metrics strong {
  color: var(--ink);
  font-size: 17px;
}

.em-project-release-commitments {
  display: grid;
  gap: 6px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--panel-bg-subtle);
}

.em-project-release-commitments > div:first-child h3,
.em-project-release-commitments > div:first-child p {
  margin: 0;
}

.em-project-release-commitments > div:first-child h3 {
  color: var(--ink);
  font-size: 12px;
}

.em-project-release-commitments > div:first-child p {
  margin-top: 2px;
  color: var(--muted);
  font-size: 10px;
}

.em-project-release-commitments > div:last-child {
  display: grid;
  gap: 5px;
}

.em-project-release-commitments article {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 8px;
  align-items: center;
  padding-top: 5px;
  border-top: 1px solid var(--line);
}

.em-project-release-commitments article span {
  display: grid;
  min-width: 0;
}

.em-project-release-commitments article strong {
  overflow: hidden;
  color: var(--ink);
  font-size: 10.5px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.em-project-release-commitments article small {
  color: var(--muted);
  font-size: 9.5px;
}

.em-project-release-commitments article button {
  min-height: 30px;
  padding: 4px 8px;
  font-size: 10px;
}

.em-dependency-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--panel-bg-subtle);
}

.em-dependency-toolbar p {
  margin: 0;
  color: var(--text-secondary);
  font-size: 11px;
  line-height: 1.4;
}

.em-dependency-group {
  display: grid;
  gap: 7px;
}

.em-dependency-group > div:first-child h3,
.em-dependency-group > div:first-child p {
  margin: 0;
}

.em-dependency-group > div:first-child h3 {
  color: var(--ink);
  font-size: 12px;
}

.em-dependency-group > div:first-child p {
  margin-top: 2px;
  color: var(--muted);
  font-size: 10px;
}

.em-dependency-list {
  display: grid;
  gap: 6px;
}

.em-dependency-item {
  display: grid;
  grid-template-columns: minmax(220px, 1.4fr) minmax(150px, .65fr) minmax(170px, .7fr);
  gap: 10px;
  align-items: center;
  padding: 9px 10px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--panel-bg);
}

.em-dependency-item-main {
  min-width: 0;
}

.em-dependency-item-main > div {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 5px;
}

.em-dependency-item-main strong {
  color: var(--ink);
  font-size: 11px;
}

.em-dependency-item-main p {
  margin: 4px 0 2px;
  color: var(--text-secondary);
  font-size: 10.5px;
  line-height: 1.4;
}

.em-dependency-item-main small {
  color: var(--muted);
  font-size: 10px;
}

.em-dependency-item dl {
  display: grid;
  gap: 4px;
  margin: 0;
}

.em-dependency-item dl > div {
  display: flex;
  justify-content: space-between;
  gap: 7px;
}

.em-dependency-item dt,
.em-dependency-item dd {
  margin: 0;
  font-size: 10px;
}

.em-dependency-item dt {
  color: var(--muted);
}

.em-dependency-item dd {
  color: var(--ink);
  font-weight: 800;
}

.em-dependency-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 5px;
}

.em-dependency-actions button {
  min-height: 30px;
  padding: 4px 8px;
  font-size: 10px;
}

.em-dependency-editor {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  padding: 10px;
  border: 1px solid var(--accent);
  border-radius: 7px;
  background: var(--panel-bg-selected);
}

.em-dependency-editor > .em-card-heading {
  grid-column: 1 / -1;
}

.em-dependency-editor label {
  min-width: 0;
  color: var(--ink);
  font-size: 10px;
  font-weight: 800;
}

.em-dependency-editor input,
.em-dependency-editor select,
.em-dependency-editor textarea {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  margin-top: 4px;
  font-size: 11px;
}

.em-dependency-editor textarea {
  min-height: 68px;
  resize: vertical;
}

.em-dependency-editor > button.primary {
  grid-column: 1 / -1;
  justify-self: end;
  min-height: 36px;
}

.em-dependency-editor .em-confirm-check {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
}

.em-dependency-editor .em-confirm-check input {
  width: 18px;
  height: 18px;
  margin: 0;
}

.admin-release-setup-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  margin-block: 18px;
}

.admin-release-setup-card {
  display: grid;
  gap: 12px;
  align-content: start;
  padding: 18px;
  border: 1px solid var(--border);
  border-radius: 14px;
  background: var(--panel);
}

.admin-release-setup-card label,
.em-release-story-scope {
  display: grid;
  gap: 6px;
}

.em-release-story-scope {
  grid-column: 1 / -1;
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: 10px;
}

.em-release-story-scope > label {
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
}

@media (max-width: 900px) {
  .admin-release-setup-grid {
    grid-template-columns: 1fr;
  }

  .em-dependency-spotlight {
    grid-template-columns: 1fr;
  }

  .em-train-schedule-facts {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .em-dependency-lifecycle {
    border-top: 1px solid var(--line);
    border-left: 0;
  }

  .em-dependency-item {
    grid-template-columns: 1fr;
    align-items: start;
  }

  .em-dependency-actions {
    justify-content: flex-start;
  }
}

@media (max-width: 760px) {
  .em-train-schedule-facts {
    grid-template-columns: 1fr;
  }

  .em-train-qa-strip {
    grid-template-columns: 1fr;
  }

  .em-train-qa-strip i {
    display: none;
  }

  .em-dependency-metrics,
  .em-dependency-editor,
  .em-dependency-spotlight-facts {
    grid-template-columns: 1fr;
  }

  .em-dependency-spotlight-path {
    grid-template-columns: 1fr;
  }

  .em-dependency-editor > .em-card-heading,
  .em-dependency-editor > button.primary,
  .em-dependency-editor .em-confirm-check {
    grid-column: 1;
  }

  .em-dependency-toolbar {
    align-items: stretch;
    flex-direction: column;
  }

  .em-dependency-toolbar button,
  .em-dependency-actions button,
  .em-project-release-commitments article button {
    min-height: 44px;
  }

  .em-project-release-commitments article {
    grid-template-columns: 1fr auto;
  }

  .em-project-release-commitments article button {
    grid-column: 1 / -1;
  }
}

.sovereign-ai-reports {
  gap: 16px;
}

.sovereign-report-page-head,
.sovereign-report-section-head,
.sovereign-report-preview-head,
.sovereign-report-builder-actions,
.sovereign-report-export-actions {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.sovereign-report-page-head h3,
.sovereign-report-section-head h4,
.sovereign-report-section-head h5,
.sovereign-report-preview-head h4,
.sovereign-report-facts h5,
.sovereign-report-disclosures h5 {
  margin: 0;
}

.sovereign-report-page-head p,
.sovereign-report-section-head p,
.sovereign-report-preview-head p,
.sovereign-report-builder-actions p {
  margin: 4px 0 0;
  color: var(--text-secondary);
}

.sovereign-report-catalog {
  display: grid;
  grid-template-columns: repeat(5, minmax(170px, 1fr));
  gap: 8px;
}

.sovereign-report-card {
  display: grid;
  align-content: start;
  gap: 8px;
  min-height: 154px;
  padding: 14px;
  text-align: left;
  white-space: normal;
  border: 1px solid var(--border-soft);
  border-radius: var(--radius-card);
  background: var(--panel-bg);
  color: var(--text-primary);
  cursor: pointer;
  transition: border-color 160ms ease, background 160ms ease, box-shadow 160ms ease;
}

.sovereign-report-card:hover:not(:disabled) {
  border-color: var(--accent-border);
  background: var(--panel-bg-selected);
}

.sovereign-report-card.selected {
  border-color: var(--accent-ink);
  background: var(--panel-bg-selected);
  box-shadow: inset 3px 0 0 var(--accent-ink);
}

.sovereign-report-card:disabled {
  cursor: not-allowed;
  opacity: .62;
}

.sovereign-report-card-title {
  font-size: 14px;
  font-weight: var(--heading-weight);
}

.sovereign-report-card > span:not(.sovereign-report-card-title) {
  color: var(--text-secondary);
  font-size: 12px;
  line-height: 1.45;
}

.sovereign-report-card .sovereign-report-card-meta {
  align-self: end;
  color: var(--accent-ink);
  font-weight: 700;
}

.sovereign-report-builder,
.sovereign-report-preview,
.sovereign-report-history {
  min-width: 0;
  padding: 16px;
  border: 1px solid var(--border-soft);
  border-radius: var(--radius-card);
  background: var(--panel-bg);
}

.sovereign-report-form-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(150px, 1fr));
  gap: 10px;
  margin-top: 14px;
}

.sovereign-report-form-grid label {
  min-width: 0;
}

.sovereign-report-form-grid select,
.sovereign-report-form-grid input {
  width: 100%;
  min-height: 44px;
  margin-top: 5px;
}

.sovereign-report-field-muted {
  opacity: .64;
}

.sovereign-report-builder-actions {
  align-items: center;
  margin-top: 14px;
}

.sovereign-report-builder-actions button,
.sovereign-report-export-actions button,
.sovereign-report-section-head button {
  min-height: 44px;
}

.sovereign-report-builder-actions p {
  max-width: 720px;
  font-size: 12px;
}

.sovereign-report-output-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(240px, 320px);
  align-items: start;
  gap: 12px;
}

.sovereign-report-empty-preview {
  min-height: 220px;
  align-content: center;
  text-align: center;
  color: var(--text-secondary);
}

.sovereign-report-attribution {
  flex: 0 0 auto;
  padding: 6px 9px;
  border: 1px solid var(--accent-border);
  border-radius: 999px;
  color: var(--accent-ink);
  background: var(--accent-soft);
  font-size: 11px;
  font-weight: 750;
}

.sovereign-report-identity {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  margin: 14px 0;
  overflow: hidden;
  border: 1px solid var(--border-soft);
  border-radius: var(--radius-card);
  background: var(--border-soft);
}

.sovereign-report-identity > div {
  min-width: 0;
  padding: 10px;
  background: var(--panel-bg-subtle);
}

.sovereign-report-identity dt {
  color: var(--text-secondary);
  font-size: 10px;
  font-weight: 750;
  text-transform: uppercase;
}

.sovereign-report-identity dd {
  margin: 4px 0 0;
  overflow-wrap: anywhere;
  font-size: 12px;
}

.sovereign-report-digest {
  font-family: var(--font-mono);
  font-size: 10px !important;
}

.sovereign-report-export-actions {
  justify-content: flex-start;
  flex-wrap: wrap;
  margin-bottom: 14px;
}

.sovereign-report-metrics {
  display: grid;
  grid-template-columns: repeat(5, minmax(100px, 1fr));
  gap: 8px;
}

.sovereign-report-metric {
  display: grid;
  gap: 3px;
  min-width: 0;
  padding: 12px;
  border: 1px solid var(--border-soft);
  border-radius: var(--radius-card);
  background: var(--panel-bg-subtle);
}

.sovereign-report-metric strong {
  font-size: 22px;
  color: var(--accent-ink);
}

.sovereign-report-metric span {
  font-size: 11px;
  font-weight: 700;
}

.sovereign-report-metric small,
.sovereign-report-fact small {
  color: var(--text-secondary);
}

.sovereign-report-facts,
.sovereign-report-appendix,
.sovereign-report-disclosures,
.sovereign-report-provenance {
  margin-top: 16px;
}

.sovereign-report-fact {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 4px 10px;
  padding: 10px 0;
  border-bottom: 1px solid var(--border-soft);
}

.sovereign-report-fact > div {
  display: grid;
  gap: 3px;
}

.sovereign-report-fact small {
  grid-column: 1 / -1;
}

.sovereign-report-table-wrap {
  max-width: 100%;
  margin-top: 8px;
  overflow: auto;
  border: 1px solid var(--border-soft);
  border-radius: var(--radius-card);
}

.sovereign-report-table-wrap table {
  width: 100%;
  border-collapse: collapse;
  font-size: 11px;
}

.sovereign-report-table-wrap th,
.sovereign-report-table-wrap td {
  padding: 8px 10px;
  text-align: left;
  vertical-align: top;
  border-bottom: 1px solid var(--border-soft);
}

.sovereign-report-table-wrap th {
  position: sticky;
  top: 0;
  background: var(--panel-header-bg);
  color: var(--text-secondary);
  font-size: 10px;
  text-transform: uppercase;
}

.sovereign-report-disclosures {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.sovereign-report-disclosures section {
  padding: 12px;
  border: 1px solid var(--status-warn-border);
  border-radius: var(--radius-card);
  background: var(--status-warn-bg);
}

.sovereign-report-disclosures ul {
  margin: 8px 0 0;
  padding-left: 18px;
}

.sovereign-report-disclosures li + li {
  margin-top: 5px;
}

.sovereign-report-provenance summary {
  min-height: 44px;
  cursor: pointer;
  color: var(--accent-ink);
  font-weight: 700;
}

.sovereign-report-history-list {
  display: grid;
  gap: 6px;
  margin-top: 12px;
}

.sovereign-report-history-list button {
  display: grid;
  gap: 3px;
  min-height: 58px;
  padding: 10px;
  text-align: left;
  white-space: normal;
  border: 1px solid var(--border-soft);
  border-radius: var(--radius-card);
  background: var(--panel-bg-subtle);
  cursor: pointer;
}

.sovereign-report-history-list button.selected {
  border-color: var(--accent-ink);
  background: var(--panel-bg-selected);
}

.sovereign-report-history-list span,
.sovereign-report-history-list small,
.sovereign-report-empty {
  color: var(--text-secondary);
}

.sovereign-report-loading {
  min-height: 180px;
  display: grid;
  place-items: center;
  color: var(--text-secondary);
}

@media (max-width: 1280px) {
  .sovereign-report-catalog {
    grid-template-columns: repeat(3, minmax(180px, 1fr));
  }

  .sovereign-report-metrics {
    grid-template-columns: repeat(3, minmax(120px, 1fr));
  }
}

@media (max-width: 900px) {
  .sovereign-report-catalog,
  .sovereign-report-form-grid,
  .sovereign-report-output-layout,
  .sovereign-report-disclosures {
    grid-template-columns: 1fr;
  }

  .sovereign-report-identity {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .sovereign-report-builder-actions,
  .sovereign-report-page-head,
  .sovereign-report-preview-head {
    align-items: stretch;
    flex-direction: column;
  }
}

@media (max-width: 560px) {
  .sovereign-report-metrics,
  .sovereign-report-identity {
    grid-template-columns: 1fr;
  }
}

@media print {
  body.printing-sovereign-report * {
    visibility: hidden !important;
  }

  body.printing-sovereign-report [data-sovereign-report-preview],
  body.printing-sovereign-report [data-sovereign-report-preview] * {
    visibility: visible !important;
  }

  body.printing-sovereign-report [data-sovereign-report-preview] {
    position: absolute;
    inset: 0;
    width: 100%;
    padding: 0;
    border: 0;
    color: var(--report-print-ink);
    background: var(--report-print-surface);
  }

  body.printing-sovereign-report .sovereign-report-export-actions {
    display: none !important;
  }

  body.printing-sovereign-report .sovereign-report-table-wrap {
    overflow: visible;
  }
}