/* MFP-2 — DIAS-aligned light / dark / auto theme
   Tokens match DIAS web/portal (shell.css + theme.css).
   Toggle: Light → Dark → Auto (system). Storage key: mfp2-theme
   Aliases --bg0/--bg1/--ink/--line keep existing class rules working.
*/

/* Ensure HTML hidden attribute always wins over CSS display rules */
[hidden] { display: none !important; }

:root,
[data-theme="light"] {
  color-scheme: light;
  --bg: #ffffff;
  --surface: #f5f5f3;
  --surface2: #ececea;
  --border: #e0e0dc;
  --text: #141413;
  --muted: #4f4e48;
  --muted2: #2f2e2a;
  --accent: #1d4ed8;
  --accent-soft: #1e40af;
  --accent-blue: #1d4ed8;
  --accent-blue-dim: rgba(29, 78, 216, 0.1);
  --accent-dim: rgba(29, 78, 216, 0.1);
  --input-bg: #ffffff;
  --pos: #0f6b38;
  --neg: #b91c1c;
  --warn: #9a3412;
  --warn-bg: rgba(154, 52, 18, 0.1);
  --warn-border: rgba(154, 52, 18, 0.35);
  --ok: #0f6b38;
  --accent2: #b45309;
  --btn-fg: #ffffff;
  --flash-bg: rgba(37, 99, 235, 0.08);
  --current-row: #eef2ff;
  --diag-fill: #ececea;
  --diag-fill2: #f5f5f3;
  --diag-stroke: #e0e0dc;
  --diag-accent: #2563eb;
  --diag-gold: #b45309;
  --diag-text: #1a1a1a;
  --diag-muted: #6f6f68;

  /* MFP-2 aliases (legacy class names) */
  --bg0: var(--bg);
  --bg1: var(--surface);
  --bg2: var(--surface2);
  --ink: var(--text);
  --line: var(--border);

  --font: "Source Sans 3", "Segoe UI", sans-serif;
  --display: "Libre Baskerville", Georgia, serif;
  --mono: "IBM Plex Mono", ui-monospace, monospace;
  --radius: 8px;
  --max: 1100px;
}

[data-theme="dark"],
:root[data-theme-resolved="dark"] {
  color-scheme: dark;
  --bg: #0f1117;
  --surface: #171a22;
  --surface2: #1e2330;
  --border: #343b4d;
  --text: #f0f2f7;
  --muted: #b0b8c7;
  --muted2: #d2d7e2;
  --accent: #60a5fa;
  --accent-soft: #93c5fd;
  --accent-blue: #60a5fa;
  --accent-blue-dim: rgba(96, 165, 250, 0.2);
  --accent-dim: rgba(96, 165, 250, 0.18);
  --input-bg: #171a22;
  --pos: #4ade80;
  --neg: #f87171;
  --warn: #fbbf24;
  --warn-bg: rgba(251, 191, 36, 0.14);
  --warn-border: rgba(251, 191, 36, 0.4);
  --ok: #4ade80;
  --accent2: #fbbf24;
  --btn-fg: #ffffff;
  --flash-bg: rgba(96, 165, 250, 0.16);
  --current-row: #1a2438;
  --diag-fill: #1e2330;
  --diag-fill2: #171a22;
  --diag-stroke: #343b4d;
  --diag-accent: #60a5fa;
  --diag-gold: #fbbf24;
  --diag-text: #f0f2f7;
  --diag-muted: #b0b8c7;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --bg: #0f1117;
    --surface: #171a22;
    --surface2: #1e2330;
    --border: #343b4d;
    --text: #f0f2f7;
    --muted: #b0b8c7;
    --muted2: #d2d7e2;
    --accent: #60a5fa;
    --accent-soft: #93c5fd;
    --accent-blue: #60a5fa;
    --accent-blue-dim: rgba(96, 165, 250, 0.2);
    --accent-dim: rgba(96, 165, 250, 0.18);
    --input-bg: #171a22;
    --pos: #4ade80;
    --neg: #f87171;
    --warn: #fbbf24;
    --warn-bg: rgba(251, 191, 36, 0.14);
    --warn-border: rgba(251, 191, 36, 0.4);
    --ok: #4ade80;
    --accent2: #fbbf24;
    --btn-fg: #ffffff;
    --flash-bg: rgba(96, 165, 250, 0.16);
    --current-row: #1a2438;
    --diag-fill: #1e2330;
    --diag-fill2: #171a22;
    --diag-stroke: #343b4d;
    --diag-accent: #60a5fa;
    --diag-gold: #fbbf24;
    --diag-text: #f0f2f7;
    --diag-muted: #b0b8c7;
  }
}

* { box-sizing: border-box; }
html, body {
  margin: 0; padding: 0;
  font-family: var(--font);
  background: var(--bg);
  color: var(--text);
  line-height: 1.5;
  min-height: 100%;
}

a { color: var(--accent); text-decoration: none; }
a:hover { text-decoration: underline; color: var(--accent-soft); }

/*
  Single-click integrity (site-wide)
  ──────────────────────────────────
  Two ways a trackpad “click” becomes a double-click requirement:

  A) Focus-steal — tabindex / role=button shells take the first press as focus.
     Handled in mfp2.js installSingleClickFix (mousedown preventDefault).

  B) Text-selection micro-drag — Chromium treats ≥~5px movement on selectable
     text as a drag-select and cancels link/row activation. Second clean click
     works. Fix: user-select / -webkit-user-drag none on chrome clickables.
     Do NOT apply to long-form reading/editing surfaces (inputs, article body).
*/
.side a,
.side .brand-block,
a.ck-nav-item,
a.btn,
a.btn-ghost,
a.hz-btn,
button,
.btn,
.btn-ghost,
.mfp2-crumbs a,
.mfp2-pipeline a,
.mfp2-focus a,
.mfp2-journey a,
.hz-top a,
.hz-board a,
.hz-cell a,
.hz-btn,
.hz-seg-chip,
.pp-masthead a,
.pp-masthead button,
.desk-nav a,
.desk-nav-links a,
.create-steps a,
.create-mode,
.craft-tab,
.plan-table a,
.bp-table a,
.bp-layout-link,
.bp-layout-cell a,
table.data a,
.create-list-table a,
.cand-table a,
.task-lede-actions a,
.task-stage-chips button,
.sidebar-role-btn,
table.plan-table a,
summary,
[role="button"],
[tabindex="0"],
[data-href],
tr.is-clickable,
tr.list-row,
tr.plan-row,
.arc-hit,
th.sortable,
.mfp2-theme-toggle,
.mfp2-theme-fab,
.mfp2-rail-fab,
.mfp2-nav-toggle,
.mfp2-rail-tabs button,
.mfp2-rail-act {
  user-select: none;
  -webkit-user-select: none;
  -webkit-user-drag: none;
}

/* Demo watch — control looks live but is incomplete / needs re-test */
.mfp-needs-work,
button.mfp-needs-work,
a.mfp-needs-work,
[role="button"].mfp-needs-work {
  outline: 2px solid #c62828 !important;
  outline-offset: 2px;
  box-shadow: 0 0 0 3px rgba(198, 40, 40, 0.22) !important;
  position: relative;
}
.mfp-needs-work::after {
  content: attr(data-mfp-needs) " NEEDS WORK";
  position: absolute;
  top: -0.55rem;
  right: -0.15rem;
  z-index: 5;
  font-size: 0.58rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #fff;
  background: #c62828;
  padding: 0.08rem 0.28rem;
  border-radius: 3px;
  pointer-events: none;
  white-space: nowrap;
  max-width: 11rem;
  overflow: hidden;
  text-overflow: ellipsis;
}
.mfp-needs-work[data-mfp-needs=""]::after,
.mfp-needs-work:not([data-mfp-needs])::after {
  content: "NEEDS WORK";
}

/* Reading / typing must stay selectable */
input,
textarea,
select,
[contenteditable="true"],
[contenteditable=""],
.md-editor,
.arc-body-text,
.archive-read-body,
.prose,
.ba-type-body,
.ba-pf-body,
.lp-body {
  user-select: text;
  -webkit-user-select: text;
  -webkit-user-drag: auto;
}

.shell { display: grid; grid-template-columns: 220px 1fr; min-height: 100vh; }

.side {
  background: var(--surface);
  border-right: 1px solid var(--border);
  padding: 1rem 0.85rem 1.25rem;
}
.side .brand-block {
  margin: 0 0 0.85rem;
}
.side .brand-text {
  min-width: 0;
}
.side .mfp2-nav-toggle {
  display: none;
}
/* Keep side nav above task/drawer backdrops so menu links stay single-click */
.shell > .side {
  position: relative;
  z-index: 100;
}

/*
  Narrow / Cursor Simple Browser: compact top bar + drawer.
  Do NOT stack the full nav above the page — that looked "broken".
*/
@media (max-width: 900px) {
  .shell {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
  }
  .side,
  .shell > .side {
    position: sticky;
    top: 0;
    z-index: 100; /* above task/drawer backdrops */
    border-right: 0;
    border-bottom: 1px solid var(--border);
    padding: 0.55rem 0.75rem;
    box-shadow: 0 1px 0 color-mix(in srgb, var(--border) 80%, transparent);
  }
  .side .brand-block {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    margin: 0;
  }
  .side .brand-mark {
    width: 1.85rem;
    height: 1.85rem;
    margin: 0;
    font-size: 1rem;
    border-radius: 6px;
    flex-shrink: 0;
  }
  .side .mark {
    font-size: 1.05rem;
    margin: 0;
    line-height: 1.1;
  }
  .side .tag {
    display: none;
  }
  .side .mfp2-theme-toggle {
    display: none; /* FAB handles theme on narrow */
  }
  .side .mfp2-nav-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-left: auto;
    margin-right: 4.5rem; /* room for theme FAB */
    min-width: 2.4rem;
    height: 2.1rem;
    padding: 0 0.65rem;
    border: 1px solid var(--border);
    border-radius: 6px;
    background: var(--bg);
    color: var(--text);
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    cursor: pointer;
    font-family: var(--font);
  }
  .side .mfp2-nav-toggle:hover {
    border-color: var(--accent);
    color: var(--accent);
  }
  .side nav,
  .side .note {
    display: none;
  }
  body.mfp2-nav-open .side nav {
    display: block;
    margin-top: 0.55rem;
    max-height: min(70vh, 28rem);
    overflow: auto;
    border-top: 1px solid var(--border);
    padding-top: 0.45rem;
  }
  body.mfp2-nav-open .side .note {
    display: block;
    margin-top: 0.65rem;
  }
  .main {
    padding: 1rem 1rem 2.5rem;
    max-width: none;
  }
}
.side .brand-mark {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2.35rem;
  height: 2.35rem;
  margin: 0 0 0.45rem;
  border-radius: 8px;
  background: var(--text);
  color: var(--bg);
  font-family: var(--display);
  font-size: 1.25rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1;
}
.side .brand-logo {
  display: none; /* Decandia film frame parked — Forge mark via Imagine later */
}
.side .mark {
  font-family: var(--display);
  font-size: 1.2rem;
  letter-spacing: -0.01em;
  margin: 0 0 0.15rem;
  color: var(--text);
  font-weight: 700;
}
.side .mark-brack {
  font-weight: 400;
  letter-spacing: 0;
  color: var(--muted);
}
.side .tag {
  font-size: 0.68rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--muted);
  margin: 0 0 0.15rem;
}
.side nav a {
  display: block;
  padding: 0.45rem 0.6rem;
  border-radius: var(--radius);
  color: var(--text);
  text-decoration: none;
  font-size: 0.92rem;
  margin-bottom: 0.2rem;
  /* Trackpad micro-drags otherwise select text and cancel the first click
     (feels like “menu needs a double-click”). Keep keyboard focus intact. */
  user-select: none;
  -webkit-user-select: none;
  -webkit-user-drag: none;
}
.side nav a:hover, .side nav a[aria-current="page"] {
  background: var(--surface2);
  text-decoration: none;
  color: var(--text);
}
.mfp2-nav-group {
  margin: 0.15rem 0 0.35rem;
}
.mfp2-nav-group > a {
  font-weight: 600;
}
.mfp2-nav-sub {
  display: flex;
  flex-direction: column;
  gap: 0.05rem;
  padding: 0.15rem 0 0.25rem 0.55rem;
  border-left: 2px solid var(--border);
  margin: 0.15rem 0 0.2rem 0.35rem;
}
.mfp2-nav-sub a {
  font-size: 0.82rem !important;
  padding: 0.3rem 0.5rem !important;
  color: var(--muted) !important;
  margin-bottom: 0 !important;
}
.mfp2-nav-sub a:hover,
.mfp2-nav-sub a[aria-current="page"] {
  color: var(--text) !important;
}
.side .note {
  margin-top: 1.5rem;
  font-size: 0.75rem;
  color: var(--muted);
  border-top: 1px solid var(--border);
  padding-top: 0.75rem;
}

.mfp2-theme-toggle {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  width: 100%;
  justify-content: center;
  margin: 0 0 1rem;
  padding: 0.3rem 0.7rem;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--bg);
  color: var(--muted2);
  font-size: 11px;
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
  font-family: var(--font);
  line-height: 1.2;
}
.mfp2-theme-toggle:hover {
  color: var(--text);
  border-color: var(--accent-blue);
}
.mfp2-theme-toggle-icon { font-size: 13px; line-height: 1; }

/* Always-visible theme control (all screens) */
.mfp2-theme-fab {
  position: fixed;
  top: 0.75rem;
  right: 0.75rem;
  z-index: 1200;
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.3rem 0.7rem;
  border-radius: 6px;
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--text);
  font: inherit;
  font-size: 0.78rem;
  font-weight: 600;
  cursor: pointer;
  box-shadow: 0 4px 16px rgba(0,0,0,0.12);
  height: auto;
  width: auto;
  max-height: none;
  line-height: 1.2;
}
.mfp2-theme-fab:hover {
  border-color: var(--accent);
  color: var(--accent);
}
body.mfp2-rail-open .mfp2-theme-fab {
  right: calc(0.75rem + var(--mfp2-rail-w, 360px));
}
@media (max-width: 900px) {
  /* Keep FAB compact — never stretch between top and bottom */
  .mfp2-theme-fab {
    top: 0.55rem;
    bottom: auto;
    right: 0.55rem;
    height: auto;
    width: auto;
    z-index: 50;
  }
  body.mfp2-rail-open .mfp2-theme-fab { right: 0.55rem; }
}

.main { padding: 1.5rem 1.75rem 3rem; max-width: var(--max); min-width: 0; }
.eyebrow {
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--accent2);
  margin: 0 0 0.35rem;
}
h1 {
  font-family: var(--display);
  font-weight: 400;
  font-size: 1.85rem;
  margin: 0 0 0.5rem;
  line-height: 1.25;
  color: var(--text);
}
.lede { color: var(--muted); max-width: 42rem; margin: 0 0 1.5rem; }

.grid { display: grid; gap: 0.85rem; }
.grid-2 { grid-template-columns: 1fr 1fr; }
.grid-3 { grid-template-columns: 1fr 1fr 1fr; }
@media (max-width: 800px) {
  .grid-2, .grid-3 { grid-template-columns: 1fr; }
}

.tile, .panel {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 1rem 1.1rem;
}
.tile h2, .tile h3, .panel h2 {
  font-family: var(--display);
  font-weight: 400;
  font-size: 1.05rem;
  margin: 0 0 0.4rem;
  color: var(--text);
}
.tile p { margin: 0; font-size: 0.9rem; color: var(--muted); }
.tile a.more { display: inline-block; margin-top: 0.65rem; font-size: 0.85rem; }

.badge {
  display: inline-block;
  font-size: 0.68rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  padding: 0.15rem 0.45rem;
  border-radius: 3px;
  border: 1px solid var(--border);
  color: var(--muted);
}
.badge-ok { border-color: var(--ok); color: var(--ok); }
.badge-warn { border-color: var(--warn); color: var(--warn); }
.badge-fit { border-color: var(--ok); color: var(--ok); background: color-mix(in srgb, var(--ok) 12%, transparent); }
.badge-miss { border-color: var(--warn); color: var(--warn); background: color-mix(in srgb, var(--warn) 12%, transparent); }
.badge-pinned { border-color: var(--ok); color: var(--ok); font-weight: 600; }

/* Layout QA · selected row + parent→child chain */
#jobs-table tbody tr.job-row--selected,
#jobs-table tbody tr.job-row--selected td {
  outline: 2px solid var(--accent);
  outline-offset: -2px;
  background: color-mix(in srgb, var(--accent) 12%, transparent);
}
#jobs-table tbody tr.job-row--child td:first-child {
  padding-left: calc(0.6rem + (var(--chain-depth, 1) * 0.85rem));
  border-left: 3px solid color-mix(in srgb, var(--accent) 45%, var(--border));
}
.job-chain {
  margin: 0.5rem 0 0.65rem;
  padding: 0.45rem 0.55rem;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--surface);
}
.job-chain__label { margin: 0 0 0.35rem; }
.job-chain__list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.job-chain__item {
  padding: 0.25rem 0.35rem 0.25rem calc(0.35rem + (var(--chain-depth, 0) * 0.9rem));
  border-left: 2px solid color-mix(in srgb, var(--accent) 40%, var(--border));
  margin: 0.15rem 0;
  cursor: pointer;
  font-size: 0.8rem;
}
.job-chain__item.is-selected {
  background: color-mix(in srgb, var(--accent) 12%, transparent);
  border-left-color: var(--accent);
}
.proof-panel {
  margin: 0.5rem 0 0;
}
.proof-panel__frame {
  border: 1px dashed var(--border);
  border-radius: 6px;
  padding: 0.65rem 0.75rem;
  background: color-mix(in srgb, var(--surface) 80%, var(--bg));
  min-height: 5.5rem;
}
.proof-panel__placeholder .proof-panel__ghost {
  margin-top: 0.55rem;
  height: 4.5rem;
  border: 1px solid var(--line);
  border-radius: 4px;
  background:
    repeating-linear-gradient(
      -12deg,
      transparent,
      transparent 8px,
      color-mix(in srgb, var(--muted) 10%, transparent) 8px,
      color-mix(in srgb, var(--muted) 10%, transparent) 16px
    );
}
.fixture-banner {
  position: sticky;
  top: 0;
  z-index: 2;
}
.chip-workflow {
  font-size: 0.7rem;
  vertical-align: middle;
}

table.data {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.88rem;
}
table.data th, table.data td {
  text-align: left;
  padding: 0.5rem 0.6rem;
  border-bottom: 1px solid var(--border);
  vertical-align: top;
  color: var(--text);
}
table.data th { color: var(--muted); font-weight: 600; font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.04em; }

label { display: block; font-size: 0.8rem; color: var(--muted); margin: 0.75rem 0 0.25rem; }
.field { display: block; margin: 0.65rem 0; }
.field span { display: block; font-size: 0.8rem; color: var(--muted); margin-bottom: 0.25rem; }
input, select, textarea {
  width: 100%;
  background: var(--input-bg);
  border: 1px solid var(--border);
  color: var(--text);
  border-radius: var(--radius);
  padding: 0.5rem 0.65rem;
  font: inherit;
}
textarea { min-height: 110px; resize: vertical; }
button, .btn {
  display: inline-block;
  background: var(--surface);
  color: var(--text);
  border: 1px solid color-mix(in srgb, var(--text) 28%, var(--border));
  border-radius: 6px;
  padding: 0.3rem 0.7rem; /* ~25% shorter than 0.4rem */
  font: inherit;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.01em;
  cursor: pointer;
  text-decoration: none;
  box-shadow:
    0 1px 2px rgba(20, 20, 19, 0.08),
    0 1px 0 rgba(255, 255, 255, 0.55) inset;
  filter: none;
  line-height: 1.2;
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
}
button:hover, .btn:hover {
  border-color: var(--accent);
  background: var(--accent-dim);
  color: var(--text);
  filter: none;
  text-decoration: none;
  box-shadow:
    0 2px 4px rgba(20, 20, 19, 0.1),
    0 1px 0 rgba(255, 255, 255, 0.55) inset;
}
button:disabled, .btn:disabled {
  opacity: 0.45;
  cursor: default;
  box-shadow: none;
}
/* Retained / pressed (tabs, scopes, toggles) — light blue while active */
button.on, .btn.on,
.create-mode.on, .craft-tab.on, .create-step.on,
.btn[aria-pressed="true"], button[aria-pressed="true"],
.create-mode.is-tools-on, .craft-layout-btn.is-open {
  background: color-mix(in srgb, var(--accent) 16%, var(--surface)) !important;
  border-color: color-mix(in srgb, var(--accent) 55%, var(--text) 12%) !important;
  color: var(--accent) !important;
  font-weight: 700;
  box-shadow:
    0 1px 2px color-mix(in srgb, var(--accent) 22%, transparent),
    0 1px 0 rgba(255, 255, 255, 0.45) inset;
}
/* Action flash — blue ~3s, brief pulse, then off */
@keyframes mfp2-btn-action-flash {
  0%, 78% {
    background: color-mix(in srgb, var(--accent) 18%, var(--surface));
    border-color: var(--accent);
    color: var(--accent);
    box-shadow:
      0 1px 3px color-mix(in srgb, var(--accent) 28%, transparent),
      0 1px 0 rgba(255, 255, 255, 0.45) inset;
  }
  86% {
    background: var(--accent);
    border-color: var(--accent);
    color: #fff;
    box-shadow: 0 2px 6px color-mix(in srgb, var(--accent) 40%, transparent);
  }
  100% {
    background: var(--surface);
    border-color: color-mix(in srgb, var(--text) 28%, var(--border));
    color: var(--muted2, var(--text));
    box-shadow:
      0 1px 2px rgba(20, 20, 19, 0.08),
      0 1px 0 rgba(255, 255, 255, 0.55) inset;
  }
}
.mfp2-btn-flash:not(.on):not([aria-pressed="true"]):not(.is-tools-on) {
  animation: mfp2-btn-action-flash 3s ease-out forwards;
}
/* Rare filled CTA — ink, not bright blue */
.btn-primary {
  background: var(--text);
  color: var(--bg);
  border-color: var(--text);
}
.btn-primary:hover {
  background: var(--accent);
  border-color: var(--accent);
  color: var(--btn-fg);
  filter: none;
}
.btn-ghost {
  background: var(--surface);
  color: var(--text);
  border: 1px solid color-mix(in srgb, var(--text) 28%, var(--border));
  border-radius: 6px;
  padding: 0.3rem 0.7rem;
  line-height: 1.2;
  font-size: 0.72rem;
  font-weight: 700;
  box-shadow:
    0 1px 2px rgba(20, 20, 19, 0.08),
    0 1px 0 rgba(255, 255, 255, 0.55) inset;
}
.btn-ghost:hover { color: var(--text); border-color: var(--accent); background: var(--accent-dim); filter: none; }
.btn-ghost.on {
  background: color-mix(in srgb, var(--accent) 16%, var(--surface)) !important;
  border-color: color-mix(in srgb, var(--accent) 42%, var(--border)) !important;
  color: var(--accent) !important;
}

.steps { display: flex; flex-wrap: wrap; gap: 0.35rem; align-items: center; margin: 1rem 0; }
.step {
  background: var(--surface2);
  border: 1px solid var(--border);
  padding: 0.35rem 0.55rem;
  border-radius: var(--radius);
  font-size: 0.78rem;
  font-family: var(--mono);
  color: var(--text);
  text-decoration: none;
}
.step:hover { border-color: var(--accent); text-decoration: none; }
.step-arrow { color: var(--muted); font-size: 0.75rem; }

.list-clean { list-style: none; padding: 0; margin: 0; }
.list-clean li {
  padding: 0.65rem 0;
  border-bottom: 1px solid var(--border);
  font-size: 0.9rem;
  color: var(--text);
}
.list-clean li strong { display: block; margin-bottom: 0.15rem; }

.flash {
  background: var(--flash-bg);
  border: 1px solid var(--accent);
  color: var(--text);
  padding: 0.65rem 0.85rem;
  border-radius: var(--radius);
  margin: 0.75rem 0;
  font-size: 0.88rem;
  display: none;
}
.flash.show { display: block; }

.checkrow {
  display: flex; gap: 0.6rem; align-items: flex-start;
  padding: 0.55rem 0; border-bottom: 1px solid var(--border);
}
.checkrow input { width: auto; margin-top: 0.2rem; }
.checkrow label { margin: 0; color: var(--text); font-size: 0.9rem; }

.toolbar {
  display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: center;
  margin: 0 0 1rem; justify-content: space-between;
}
.toolbar .left, .toolbar .right { display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: center; }
.row-between { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 0.5rem; }
.status-pill {
  font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.06em;
  padding: 0.25rem 0.55rem; border-radius: 3px; border: 1px solid var(--border);
  color: var(--muted);
}
.status-pill.draft { color: var(--muted); }
.status-pill.briefs_ready { color: var(--accent2); border-color: var(--accent2); }
.status-pill.approved { color: var(--ok); border-color: var(--ok); }

.meta { font-size: 0.82rem; color: var(--muted); }

.slot-rows {
  display: flex;
  flex-direction: column;
  gap: 0;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  overflow: hidden;
}
.slot-row-head,
.slot-row {
  display: grid;
  grid-template-columns: 5.5rem 7rem minmax(8rem, 1.4fr) 6.5rem 4.5rem minmax(10rem, 1.6fr) auto;
  gap: 0.55rem 0.75rem;
  align-items: center;
  padding: 0.55rem 0.85rem;
}
.slot-row-head {
  background: var(--bg);
  border-bottom: 1px solid var(--border);
  font-size: 0.65rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--muted);
  font-weight: 600;
}
.slot-row {
  background: var(--surface);
  border-bottom: 1px solid var(--border);
  border-left: 4px solid var(--border);
  transition: background 0.12s;
  color: var(--text);
}
.slot-row:last-child { border-bottom: 0; }
.slot-row:hover { background: var(--surface2); }
.slot-row.c-blue { border-left-color: var(--accent-blue); }
.slot-row.c-green { border-left-color: var(--pos); }
.slot-row.c-amber { border-left-color: var(--warn); }
.slot-row.c-red { border-left-color: var(--neg); }
.slot-row .code {
  font-family: var(--mono); font-size: 0.78rem; color: var(--text); font-weight: 500;
}
.slot-row .pages {
  font-family: var(--mono); font-size: 0.72rem; color: var(--muted);
}
.slot-row .title {
  font-family: var(--display); font-weight: 400; font-size: 0.98rem;
  margin: 0; line-height: 1.25; color: var(--text);
}
.slot-row .meta { font-size: 0.78rem; color: var(--muted); }
.slot-row .arts {
  display: flex; flex-wrap: wrap; gap: 0.25rem 0.5rem; align-items: center;
  font-size: 0.78rem;
}
.slot-row .arts a { white-space: nowrap; }
.slot-row .actions {
  display: flex; flex-wrap: wrap; gap: 0.35rem; justify-content: flex-end;
  font-size: 0.82rem;
}
@media (max-width: 900px) {
  .slot-row-head { display: none; }
  .slot-row {
    grid-template-columns: 1fr 1fr;
    gap: 0.35rem 0.65rem;
  }
  .slot-row .title { grid-column: 1 / -1; }
  .slot-row .arts { grid-column: 1 / -1; }
  .slot-row .actions { grid-column: 1 / -1; justify-content: flex-start; }
}

.slot-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 0.65rem;
}
.slot-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-left-width: 4px;
  border-radius: var(--radius);
  padding: 0.75rem 0.85rem;
  text-decoration: none;
  color: inherit;
  display: block;
  transition: border-color 0.15s, background 0.15s;
}
.slot-card:hover { background: var(--surface2); text-decoration: none; color: inherit; }
.slot-card.c-blue { border-left-color: var(--accent-blue); }
.slot-card.c-green { border-left-color: var(--pos); }
.slot-card.c-amber { border-left-color: var(--warn); }
.slot-card.c-red { border-left-color: var(--neg); }
.slot-card .code {
  font-family: var(--mono); font-size: 0.72rem; color: var(--muted);
}
.slot-card h3 {
  font-family: var(--display); font-weight: 400; font-size: 1rem;
  margin: 0.2rem 0 0.35rem; color: var(--text);
}
.slot-card .meta { font-size: 0.78rem; color: var(--muted); }
.chip-row { display: flex; flex-wrap: wrap; gap: 0.3rem; margin-top: 0.45rem; }
.toc-filter.on {
  border-color: var(--accent);
  color: var(--accent);
  background: var(--accent-dim, rgba(37, 99, 235, 0.08));
}
.chip {
  font-size: 0.65rem; font-family: var(--mono);
  padding: 0.12rem 0.35rem; border-radius: 3px;
  background: var(--bg); border: 1px solid var(--border); color: var(--text);
}
button.chip {
  cursor: pointer;
  font: inherit;
}
.chip.on {
  border-color: var(--accent);
  color: var(--accent);
  background: var(--accent-dim, rgba(37, 99, 235, 0.08));
}
.chip.demo-auth {
  border-color: var(--warn, #b45309);
  color: var(--warn, #b45309);
  background: color-mix(in srgb, var(--warn, #b45309) 10%, var(--surface, #fff));
  font-weight: 500;
}

.inline-form { display: grid; gap: 0.35rem; }
.inline-form.row { grid-template-columns: 1fr 1fr; gap: 0.65rem; }
@media (max-width: 700px) { .inline-form.row { grid-template-columns: 1fr; } }

.mini {
  font-size: 0.8rem; color: var(--muted); margin: 0.25rem 0 0;
}

.rec-list { display: flex; flex-direction: column; gap: 0.85rem; }
.rec-card {
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 1rem 1.1rem;
  color: var(--text);
}
.rec-card header {
  display: flex; justify-content: space-between; align-items: flex-start; gap: 0.75rem;
}
.rec-card h3 {
  font-family: var(--display); font-weight: 400; font-size: 1.05rem;
  margin: 0.15rem 0 0.35rem; color: var(--text);
}
.rec-card h4 {
  font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.06em;
  color: var(--muted); margin: 0.75rem 0 0.35rem; font-weight: 600;
}
.rec-rationale { font-size: 0.9rem; margin: 0.5rem 0; color: var(--text); }
.rec-cols {
  display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem;
}
@media (max-width: 700px) { .rec-cols { grid-template-columns: 1fr; } }
.rec-cols ul {
  margin: 0; padding-left: 1.1rem; font-size: 0.82rem; color: var(--muted);
}
.rec-card table.checks td { font-size: 0.8rem; }
.rec-actions {
  display: flex; flex-wrap: wrap; gap: 0.4rem; margin-top: 0.85rem;
}

/* Review-deck diagram hooks */
.diag text { fill: var(--diag-text); }
.diag .muted { fill: var(--diag-muted); }
.diag rect.box { fill: var(--diag-fill); stroke: var(--diag-accent); }
.diag rect.box2 { fill: var(--diag-fill2); stroke: var(--diag-stroke); }
.diag rect.gold { fill: var(--diag-fill); stroke: var(--diag-gold); }

/* —— Workflow crumbs (C-1) —— */
.mfp2-evidence {
  margin: 0 0 0.65rem;
  padding: 0.45rem 0.65rem;
  border-left: 3px solid var(--accent);
  background: var(--accent-dim);
  border-radius: 0 var(--radius) var(--radius) 0;
  font-size: 0.78rem;
  color: var(--text);
  line-height: 1.4;
}
.mfp2-evidence strong { color: var(--accent); }
.mfp2-rule-banner {
  margin: 0 0 0.75rem;
  padding: 0.4rem 0.65rem;
  border: 1px solid var(--warn-border);
  background: var(--warn-bg);
  border-radius: var(--radius);
  font-size: 0.75rem;
  color: var(--text);
}

.mfp2-focus {
  margin: 0 0 1rem;
  padding: 0.7rem 0.9rem;
  border-left: 3px solid var(--accent);
  background: var(--accent-dim);
  border-radius: 0 var(--radius) var(--radius) 0;
  font-size: 0.95rem;
  color: var(--text);
  line-height: 1.45;
}
.mfp2-focus-role {
  display: inline-block;
  font-family: var(--mono);
  font-size: 0.72rem;
  font-weight: 500;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--accent);
  margin-right: 0.45rem;
}
.mfp2-nav-more {
  display: block;
  margin-top: 0.65rem;
  padding-top: 0.5rem;
  border-top: 1px solid var(--border);
}
.mfp2-nav-more a {
  font-size: 0.88rem;
  color: var(--muted2);
}
.mfp2-journey {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.85rem;
  margin-bottom: 1rem;
}
@media (max-width: 720px) {
  .mfp2-journey { grid-template-columns: 1fr; }
}
.mfp2-journey .tile {
  margin: 0;
}
.mfp2-journey .tile.primary {
  border-color: var(--accent);
}
.mfp2-journey h2 {
  margin: 0 0 0.35rem;
  font-size: 1.05rem;
}
.mfp2-journey .steps {
  margin-top: 0.55rem;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.2rem 0.25rem;
}
.steps-compact {
  gap: 0.2rem 0.25rem;
}
.steps-compact .step {
  font-size: 0.68rem;
  padding: 0.22rem 0.4rem;
  line-height: 1.25;
  white-space: nowrap;
}
.steps-compact .step-arrow {
  font-size: 0.65rem;
  flex-shrink: 0;
}
.mfp2-journey-4 .tile.primary .btn {
  font-size: 0.82rem;
  padding: 0.4rem 0.7rem;
  white-space: nowrap;
}
.walk-spine .steps-compact .step {
  font-size: 0.72rem;
}
.mfp2-collapse {
  margin: 0.85rem 0;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
  padding: 0.5rem 0.85rem;
}
.mfp2-collapse > summary {
  cursor: pointer;
  font-weight: 600;
  font-size: 0.92rem;
  padding: 0.35rem 0;
  color: var(--muted2);
}
.mfp2-collapse[open] > summary {
  margin-bottom: 0.65rem;
  color: var(--text);
}

.mfp2-crumbs {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.15rem 0.1rem;
  margin: 0 0 0.65rem;
  padding: 0.35rem 0.45rem;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  font-size: 0.7rem;
  line-height: 1.25;
  font-weight: 500;
}
.mfp2-crumbs a, .mfp2-crumbs span {
  color: var(--muted);
  text-decoration: none;
  padding: 0.12rem 0.28rem;
  border-radius: 4px;
  white-space: nowrap;
}
.mfp2-crumbs a:hover { color: var(--accent); background: var(--accent-dim); text-decoration: none; }
.mfp2-crumbs [aria-current="step"] {
  color: var(--text);
  font-weight: 600;
  background: var(--accent-dim);
}
.mfp2-crumbs .sep { color: var(--muted2); opacity: 0.5; padding: 0 0.05rem; pointer-events: none; }

/* —— Research rail (C-2/C-3) — dockable, pin/unpin —— */
:root { --mfp2-rail-w: 360px; }

.mfp2-rail-fab {
  position: fixed;
  right: 0.85rem;
  bottom: 0.85rem;
  z-index: 1100;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.3rem 0.7rem;
  border-radius: 6px;
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--text);
  font: inherit;
  font-size: 0.78rem;
  font-weight: 600;
  cursor: pointer;
  box-shadow: 0 2px 10px rgba(0,0,0,0.08);
  line-height: 1.2;
}
.mfp2-rail-fab:hover {
  border-color: var(--accent);
  background: var(--accent-dim);
  color: var(--text);
  filter: none;
}
body.mfp2-rail-open .mfp2-rail-fab { display: none; }

#mfp2-research-rail {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  width: var(--mfp2-rail-w);
  z-index: 1200;
  display: flex;
  flex-direction: column;
  background: var(--surface);
  border-left: 1px solid var(--border);
  box-shadow: -4px 0 24px rgba(0,0,0,0.08);
  transform: translateX(100%);
  transition: transform 0.2s ease;
  /* Closed rail must not intercept clicks (transform alone is not enough in all engines) */
  pointer-events: none;
}
#mfp2-research-rail.is-open {
  transform: translateX(0);
  pointer-events: auto;
}

body.mfp2-rail-open .shell > .main {
  margin-right: var(--mfp2-rail-w);
  transition: margin-right 0.2s ease;
}
body.mfp2-rail-resizing #mfp2-research-rail,
body.mfp2-rail-resizing.mfp2-rail-open .shell > .main {
  transition: none !important;
}
@media (max-width: 900px) {
  body.mfp2-rail-open .shell > .main { margin-right: 0; }
  #mfp2-research-rail { width: min(100vw, 400px); }
  .mfp2-rail-resize { display: none; }
}

.mfp2-rail-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  padding: 0.75rem 0.85rem;
  border-bottom: 1px solid var(--border);
  flex-shrink: 0;
}
.mfp2-rail-head h2 {
  margin: 0;
  font-family: var(--display);
  font-weight: 400;
  font-size: 1rem;
  color: var(--text);
}
.mfp2-rail-actions { display: flex; gap: 0.35rem; flex-shrink: 0; }
.mfp2-rail-actions button {
  font-size: 0.72rem;
  padding: 0.3rem 0.5rem;
  background: transparent;
  color: var(--text);
  border: 1px solid var(--border);
}
.mfp2-rail-actions button[aria-pressed="true"] {
  border-color: var(--accent);
  background: var(--accent-dim);
  color: var(--accent);
}

.mfp2-rail-tabs {
  display: flex;
  gap: 0;
  border-bottom: 1px solid var(--border);
  flex-shrink: 0;
}
.mfp2-rail-tabs button {
  flex: 1;
  background: transparent;
  color: var(--muted);
  border: none;
  border-bottom: 2px solid transparent;
  border-radius: 0;
  padding: 0.55rem 0.4rem;
  font-size: 0.72rem;
  font-weight: 600;
}
.mfp2-rail-tabs button[aria-selected="true"] {
  color: var(--accent);
  border-bottom-color: var(--accent);
  filter: none;
}

.mfp2-rail-body {
  flex: 1;
  min-height: 0;
  overflow: auto;
  padding: 0.85rem;
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
}
.mfp2-rail-body .hint {
  font-size: 0.75rem;
  color: var(--muted);
  margin: 0;
}
.mfp2-rail-body .hint.mfp2-rail-ctx-board {
  color: var(--text);
  font-weight: 600;
  padding: 0.35rem 0.5rem;
  border: 1px solid color-mix(in srgb, var(--accent, #3a6ea5) 35%, var(--border));
  border-radius: 6px;
  background: color-mix(in srgb, var(--accent, #3a6ea5) 8%, transparent);
}
.mfp2-rail-search {
  display: flex;
  gap: 0.35rem;
}
.mfp2-rail-search input { flex: 1; margin: 0; }
.mfp2-rail-search button {
  flex-shrink: 0;
  padding: 0.45rem 0.65rem;
  font-size: 0.78rem;
}
.mfp2-rail-results {
  list-style: none;
  margin: 0;
  padding: 0;
}
.mfp2-rail-results li {
  padding: 0.55rem 0;
  border-bottom: 1px solid var(--border);
  font-size: 0.82rem;
}
.mfp2-rail-results li strong { display: block; color: var(--text); margin-bottom: 0.1rem; }
.mfp2-rail-results .src {
  font-size: 0.68rem;
  font-family: var(--mono);
  color: var(--muted);
}
.mfp2-rail-results .why {
  font-size: 0.75rem;
  color: var(--muted);
  margin-top: 0.2rem;
}
.mfp2-rail-row-acts {
  display: flex;
  flex-wrap: wrap;
  gap: 0.3rem;
  margin-top: 0.4rem;
}
.mfp2-rail-act {
  font-size: 0.68rem !important;
  padding: 0.2rem 0.45rem !important;
  background: var(--bg) !important;
  color: var(--text) !important;
  border: 1px solid var(--border) !important;
  border-radius: 4px !important;
  font-weight: 600 !important;
  cursor: pointer;
}
.mfp2-rail-act:hover {
  border-color: var(--accent) !important;
  background: var(--accent-dim) !important;
  filter: none !important;
  color: var(--accent) !important;
}
.mfp2-rail-fab kbd {
  font-family: var(--mono);
  font-size: 0.65rem;
  opacity: 0.85;
  border: 1px solid rgba(255,255,255,0.35);
  border-radius: 3px;
  padding: 0.05rem 0.3rem;
}
.mfp2-rail-toast {
  position: fixed;
  bottom: 4.5rem;
  right: 1rem;
  z-index: 1300;
  background: var(--surface);
  color: var(--text);
  border: 1px solid var(--accent);
  border-radius: var(--radius);
  padding: 0.5rem 0.75rem;
  font-size: 0.78rem;
  box-shadow: 0 4px 16px rgba(0,0,0,0.12);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.15s;
}
.mfp2-rail-toast.show { opacity: 1; }

.wf-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 0.85rem;
  margin: 0 0 0.75rem;
  font-size: 0.72rem;
  color: var(--muted);
}
.wf-legend span { display: inline-flex; align-items: center; gap: 0.3rem; }
.wf-legend i {
  display: inline-block;
  width: 0.55rem;
  height: 0.55rem;
  border-radius: 2px;
}
.wf-legend .c-blue i { background: var(--accent-blue); }
.wf-legend .c-green i { background: var(--pos); }
.wf-legend .c-amber i { background: var(--warn); }
.wf-legend .c-red i { background: var(--neg); }

.mfp2-act { display: none; }
.mfp2-act.on { display: block; }

.create-steps {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  margin: 0 0 0.85rem;
}
.create-step {
  font: inherit;
  font-size: 0.78rem;
  font-weight: 600;
  padding: 0.4rem 0.7rem;
  border-radius: 6px;
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--muted);
  cursor: pointer;
}
.create-step:hover { color: var(--text); border-color: var(--accent); }
.create-step.on {
  background: var(--accent-dim);
  border-color: var(--accent);
  color: var(--text);
}

/* Create editor — form left · research/chat right */
.mfp2-editor {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 360px);
  gap: 0;
  margin: 0.5rem 0 1.5rem;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--bg);
  min-height: 70vh;
  overflow: hidden;
  align-items: stretch;
}
@media (max-width: 960px) {
  .mfp2-editor { grid-template-columns: 1fr; }
}
.mfp2-editor-form {
  padding: 1rem 1.15rem 1.5rem;
  border-right: 1px solid var(--border);
  overflow: auto;
  min-height: 0;
}
@media (max-width: 960px) {
  .mfp2-editor-form { border-right: 0; border-bottom: 1px solid var(--border); }
}
.mfp2-editor-meta {
  margin-bottom: 0.85rem;
  padding: 0.75rem 0.85rem;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
}
.mfp2-form-field { margin-bottom: 0.85rem; display: block; }
.mfp2-form-field .mfp2-field-label { display: block; margin-bottom: 0.25rem; }
.mfp2-char {
  display: block;
  margin-top: 0.15rem;
  padding-right: 0.15rem;
  text-align: right;
  font-family: inherit;
  font-size: 0.5rem;
  font-style: italic;
  font-weight: 400;
  line-height: 1.2;
  color: #5c5b56;
  letter-spacing: 0.01em;
}
.mfp2-char::before { content: "("; }
.mfp2-char::after  { content: ")"; }
[data-theme="dark"] .mfp2-char,
:root[data-theme-resolved="dark"] .mfp2-char {
  color: #8b919c;
}
.mfp2-char.ok {
  color: #2f6b4f;
  font-style: italic;
}
.mfp2-char.short,
.mfp2-char.long {
  color: #9a5b1a;
  font-style: italic;
  font-weight: 400;
}
[data-theme="dark"] .mfp2-char.ok,
:root[data-theme-resolved="dark"] .mfp2-char.ok {
  color: #6fbf94;
}
[data-theme="dark"] .mfp2-char.short,
[data-theme="dark"] .mfp2-char.long,
:root[data-theme-resolved="dark"] .mfp2-char.short,
:root[data-theme-resolved="dark"] .mfp2-char.long {
  color: #e0a45a;
}
.mfp2-char .apl2-tag {
  font-style: normal;
  font-size: 0.62rem;
  opacity: 0.85;
  margin-left: 0.25rem;
}

.mfp2-img-slots {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(148px, 1fr));
  gap: 0.65rem;
}
.mfp2-img-slot {
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 0.5rem 0.5rem 0.4rem;
  background: var(--surface);
  cursor: grab;
  display: flex;
  flex-direction: column;
  gap: 0;
  transition: box-shadow 0.15s;
}
.mfp2-img-slot:hover { box-shadow: 0 2px 8px rgba(0,0,0,0.07); }
.mfp2-img-slot-head {
  display: flex;
  align-items: center;
  gap: 0.3rem;
  margin-bottom: 0.35rem;
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--text);
}
.mfp2-img-slot-head .chip { font-size: 0.65rem; padding: 0.05rem 0.35rem; }
/* Thumbnail — relative so overlay buttons can position inside */
.mfp2-thumb {
  position: relative;
  aspect-ratio: 4/3;
  border-radius: 5px;
  border: 1.5px dashed var(--border);
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--surface2);
  background-size: cover;
  background-position: center;
  overflow: hidden;
  font-size: 0.7rem;
  color: var(--muted);
  cursor: pointer;
}
.mfp2-thumb.empty {
  flex-direction: column;
  gap: 0.25rem;
  text-align: center;
  padding: 0.5rem;
}
.mfp2-thumb.empty::before {
  content: "+";
  font-size: 1.4rem;
  font-weight: 300;
  color: var(--muted);
  line-height: 1;
}
.mfp2-thumb.empty span { font-size: 0.65rem; color: var(--muted); line-height: 1.3; }
.mfp2-thumb.filled {
  border-style: solid;
  border-color: transparent;
  background-color: #3a4458;
}
/* Caption overlay on filled thumbnails */
.mfp2-thumb-caption {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 0.3rem 0.35rem 0.25rem;
  background: linear-gradient(transparent, rgba(0,0,0,0.55));
  color: #fff;
  font-size: 0.62rem;
  line-height: 1.25;
  text-shadow: 0 1px 2px rgba(0,0,0,0.4);
}
/* Clear × — top-right of filled thumbnail */
.mfp2-thumb-clear {
  position: absolute;
  top: 0.2rem;
  right: 0.2rem;
  width: 1.2rem;
  height: 1.2rem;
  border-radius: 50%;
  background: rgba(0,0,0,0.45);
  color: #fff;
  font-size: 0.7rem;
  line-height: 1.2rem;
  text-align: center;
  border: none;
  cursor: pointer;
  opacity: 0;
  transition: opacity 0.15s;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font);
}
.mfp2-img-slot:hover .mfp2-thumb-clear { opacity: 1; }
.mfp2-thumb-clear:hover { background: rgba(180,0,0,0.7); }

/* BA form image slots — thumbs at bottom of form */
.ba-field-image {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}
.ba-img-row {
  display: grid;
  grid-template-columns: 7.5rem minmax(0, 1fr);
  gap: 0.65rem;
  align-items: start;
}
.ba-img-thumb {
  width: 7.5rem;
  aspect-ratio: 4 / 3;
  border-radius: 6px;
  border: 1px solid var(--border);
  background: var(--surface2, #f0f0f0) center / cover no-repeat;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.ba-img-thumb.empty {
  border-style: dashed;
  cursor: pointer;
  color: var(--muted);
  font-size: 0.68rem;
  text-align: center;
  padding: 0.35rem;
}
.ba-img-thumb.filled {
  border-style: solid;
  background-color: #2a3140;
}
.ba-img-side {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
  min-width: 0;
}
.ba-img-role {
  font-size: 0.65rem;
  color: var(--muted);
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.ba-img-pick {
  align-self: flex-start;
  font-size: 0.72rem !important;
  padding: 0.2rem 0.45rem !important;
}
.ba-img-url-fold {
  margin: 0;
  font-size: 0.68rem;
  color: var(--muted);
}
.ba-img-url-fold > summary {
  cursor: pointer;
  user-select: none;
  list-style: none;
}
.ba-img-url-fold > summary::-webkit-details-marker { display: none; }
.ba-img-url-fold[open] > summary { margin-bottom: 0.25rem; }
.ba-img-url-fold input.ba-type-image {
  width: 100%;
  font-size: 0.72rem;
  padding: 0.25rem 0.4rem;
}
body.create-page.desk-form-locked #form-fields {
  opacity: 0.72;
  pointer-events: none;
}
body.create-page.desk-form-locked #form-fields::before {
  content: none;
}
#craft-writer-finished.is-finished {
  border-color: color-mix(in srgb, var(--ok, #2f7a4a) 55%, var(--border));
  background: color-mix(in srgb, var(--ok, #2f7a4a) 12%, var(--bg));
}
/* Footer: frame code + reorder arrows */
.mfp2-img-slot-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 0.3rem;
  padding-top: 0.25rem;
  border-top: 1px solid var(--border);
}
.mfp2-img-slot-foot code {
  font-size: 0.62rem;
  color: var(--muted);
  font-family: var(--mono);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 7rem;
}
.mfp2-img-order {
  display: flex;
  gap: 0.1rem;
}
.mfp2-img-order button {
  font: inherit;
  font-size: 0.7rem;
  width: 1.4rem;
  height: 1.4rem;
  border: 1px solid var(--border);
  border-radius: 4px;
  background: var(--surface);
  color: var(--muted);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  line-height: 1;
  transition: background 0.1s, color 0.1s;
}
.mfp2-img-order button:hover:not(:disabled) {
  background: var(--surface2);
  color: var(--text);
  border-color: var(--accent);
}
.mfp2-img-order button:disabled { opacity: 0.3; cursor: default; }
.mfp2-thumb span { line-height: 1.2; }

.mfp2-editor-rail {
  display: flex;
  flex-direction: column;
  background: var(--surface);
  min-height: 420px;
}
.mfp2-erail-head {
  padding: 0.75rem 0.85rem 0.4rem;
  border-bottom: 1px solid var(--border);
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.5rem;
}
.mfp2-erail-head h2 {
  margin: 0;
  font-size: 0.95rem;
  font-family: var(--display);
}
.mfp2-erail-head a {
  white-space: nowrap;
}
.mfp2-erail-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.2rem;
  padding: 0.45rem 0.55rem;
  border-bottom: 1px solid var(--border);
}
.mfp2-erail-tabs button {
  font: inherit;
  font-size: 0.75rem;
  font-weight: 600;
  padding: 0.22rem 0.55rem;
  border: 1px solid transparent;
  border-radius: 6px;
  background: transparent;
  color: var(--muted);
  cursor: pointer;
  line-height: 1.2;
}
.mfp2-erail-tabs button.on {
  background: color-mix(in srgb, var(--accent) 16%, var(--surface));
  color: var(--accent);
  border-color: color-mix(in srgb, var(--accent) 42%, var(--border));
  font-weight: 650;
}
.mfp2-erail-body {
  flex: 1;
  display: flex;
  flex-direction: column;
  padding: 0.55rem 0.65rem 0.7rem;
  gap: 0.4rem;
  min-height: 0;
  overflow: hidden;
}
/* Visually hidden utility (accessible labels) */
.visually-hidden {
  position: absolute; width: 1px; height: 1px; padding: 0;
  margin: -1px; overflow: hidden; clip: rect(0,0,0,0);
  white-space: nowrap; border: 0;
}
/* Attach / paperclip icon button — hides native file input completely */
.rail-attach-btn {
  position: relative; overflow: hidden;
  display: inline-flex; align-items: center; justify-content: center;
  width: 1.8rem; height: 1.8rem; flex-shrink: 0;
  border: 1px solid var(--border); border-radius: 6px;
  background: var(--surface); color: var(--muted);
  cursor: pointer; transition: color 0.12s, border-color 0.12s;
}
.rail-attach-btn:hover { color: var(--text); border-color: var(--accent); }
/* Cover the full button area so click opens the picker, but input is invisible */
.rail-attach-btn input[type="file"],
.chat-attach-infield input[type="file"] {
  position: absolute; inset: 0;
  opacity: 0; width: 100%; height: 100%;
  cursor: pointer; font-size: 0;
}
/* Chat-context attach button sits inside the input wrap (legacy class) */
.chat-attach-infield {
  position: relative;
  overflow: hidden;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.85rem;
  height: 1.85rem;
  flex-shrink: 0;
  border: none;
  border-radius: 6px;
  background: transparent;
  color: var(--muted);
  cursor: pointer;
  transition: color 0.12s;
}
.chat-attach-infield:hover { color: var(--text); }
.mfp2-erail-search {
  display: flex;
  gap: 0.35rem;
  flex-shrink: 0;
  align-items: center;
}
.mfp2-erail-search input { flex: 1; margin: 0; }
.mfp2-erail-scroll {
  flex: 1;
  min-height: 0;
  overflow: auto;
  display: flex;
  flex-direction: column;
}
.mfp2-erail-results {
  list-style: none;
  margin: 0;
  padding: 0;
  flex: 1;
}
.mfp2-erail-results li {
  padding: 0.55rem 0;
  border-bottom: 1px solid var(--border);
  font-size: 0.85rem;
}
.mfp2-erail-results .src {
  font-size: 0.72rem;
  color: var(--muted);
  margin: 0.15rem 0;
}
.mfp2-erail-results .why {
  font-size: 0.78rem;
  color: var(--muted2);
  margin-bottom: 0.35rem;
}
.rail-card { padding: 0.55rem 0; border-bottom: 1px solid color-mix(in srgb, var(--border) 85%, transparent); }
.rail-card--web {
  padding: 0.4rem 0;
}
.rail-card--web .rail-card-title {
  margin-bottom: 0.1rem;
}
.rail-card--web .rail-card-meta {
  margin-bottom: 0.15rem;
}
.rail-card.on {
  background: color-mix(in srgb, var(--accent) 10%, transparent);
  margin: 0 -0.35rem;
  padding-left: 0.35rem;
  padding-right: 0.35rem;
  border-radius: 6px;
}

/* Universal notebook rail (Chat · Sources · Images) */
.nb-rail .mfp2-erail-head h2 {
  font-size: 0.95rem;
  letter-spacing: -0.01em;
}
.nb-rail-tabs {
  gap: 0.15rem;
  padding: 0.2rem 0.45rem;
}
.nb-rail-note:empty,
.nb-rail-note[hidden] {
  display: none !important;
}
.nb-chat {
  display: flex;
  flex-direction: column;
  min-height: 0;
  flex: 1;
}
.nb-chat-context {
  flex-shrink: 0;
  padding: 0.35rem 0.5rem;
  border-bottom: 1px solid var(--border);
  background: transparent;
  display: block;
}
.nb-chat-context .chat-src-chip {
  margin: 0;
  align-self: auto;
}
.chat-desk-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.3rem;
}
.chat-desk-quiet {
  appearance: none;
  margin: 0 0 0 auto;
  padding: 0.15rem 0.25rem;
  border: 0;
  background: transparent;
  color: var(--muted);
  font: inherit;
  font-size: 0.68rem;
  font-weight: 500;
  cursor: pointer;
  box-shadow: none !important;
  border-radius: 0 !important;
}
.chat-desk-quiet:hover {
  color: var(--text);
  box-shadow: none !important;
}
.chat-desk-quiet[hidden] {
  display: none !important;
}
/* Subtle in-item suggests — text links above the ask box */
.chat-suggest {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.15rem 0.45rem;
  padding: 0 0.15rem 0.35rem;
  margin: 0;
}
.chat-suggest-label {
  font-size: 0.62rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: color-mix(in srgb, var(--muted) 85%, transparent);
  margin-right: 0.1rem;
}
.chat-suggest-link {
  appearance: none;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--muted);
  font: inherit;
  font-size: 0.7rem;
  font-weight: 500;
  cursor: pointer;
  text-decoration: underline;
  text-decoration-color: color-mix(in srgb, var(--border) 80%, transparent);
  text-underline-offset: 0.15em;
  box-shadow: none !important;
  border-radius: 0 !important;
  line-height: 1.3;
}
.chat-suggest-link:hover,
.chat-suggest-link:focus-visible {
  color: var(--accent);
  text-decoration-color: color-mix(in srgb, var(--accent) 45%, transparent);
  outline: none;
  box-shadow: none !important;
}
.chat-p2-jobs {
  padding-top: 0.3rem;
  margin-top: 0.1rem;
  border-top: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
}
.chat-sources-banner {
  margin: 0.25rem 0 0;
  padding: 0.2rem 0.35rem;
  font-size: 0.68rem;
  color: var(--accent, #2a5a4a);
  background: color-mix(in srgb, var(--accent, #2a5a4a) 8%, transparent);
  border-radius: 4px;
}
.chat-sources-banner[hidden] { display: none !important; }
.nb-src-badge {
  display: inline-block;
  margin-left: 0.35rem;
  padding: 0.05rem 0.3rem;
  font-size: 0.58rem;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: var(--muted);
  border: 1px solid var(--border);
  border-radius: 3px;
  vertical-align: middle;
}
.nb-src-badge--quote {
  color: var(--accent, #2a5a4a);
  border-color: color-mix(in srgb, var(--accent, #2a5a4a) 40%, var(--border));
}
.nb-upload-note { opacity: 0.85; margin-top: 0.15rem !important; }
.rail-match {
  display: block;
  margin-top: 0.1rem;
  color: color-mix(in srgb, var(--accent, #2a5a4a) 80%, var(--muted));
}
.nb-broaden-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  margin-top: 0.4rem;
}
.chat-post-acts {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.15rem 0.2rem;
  margin-top: 0.35rem;
  padding-top: 0.2rem;
}
.chat-fc-items {
  margin-top: 0.4rem;
  padding-top: 0.25rem;
  border-top: 1px dashed var(--border);
}
.chat-fc-item { margin-top: 0.3rem; }
.chat-fc-wl { opacity: 0.85; }
.nb-chat-context .chat-qa-strip {
  border: 0;
  background: transparent;
  padding: 0;
  width: 100%;
}
.nb-chat-empty {
  padding: 1.25rem 0.85rem;
  text-align: left;
}
.nb-chat-empty-title {
  margin: 0 0 0.35rem;
  font-size: 0.95rem;
  font-weight: 650;
}
.nb-images .img-briefing-strip {
  margin: 0 0 0.35rem;
}
.nb-rail .mfp2-chat-compose {
  border-top: 1px solid var(--border);
}

/* NotebookLM Sources panel */
.nb-sources {
  padding: 0.45rem 0.55rem 0.25rem;
  border-bottom: 1px solid var(--border);
  background: color-mix(in srgb, var(--surface) 92%, var(--bg));
}
.nb-section-head {
  display: flex;
  align-items: baseline;
  gap: 0.4rem;
  margin-bottom: 0.35rem;
}
.nb-section-head strong {
  font-size: 0.78rem;
}
.nb-section-head .meta {
  font-size: 0.68rem;
  color: var(--muted);
}
.nb-section-head .btn-ghost {
  margin-left: auto;
  font-size: 0.68rem;
  padding: 0.1rem 0.35rem;
}
.nb-empty {
  margin: 0 0 0.45rem;
  color: var(--muted);
}
.nb-src-list {
  list-style: none;
  margin: 0 0 0.55rem;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}
.nb-src-item {
  display: grid;
  grid-template-columns: 1.25rem 1fr auto;
  gap: 0.4rem;
  align-items: start;
  padding: 0.3rem 0.35rem;
  border-radius: 8px;
  background: color-mix(in srgb, #c4b5a5 16%, var(--surface));
}
.nb-src-main {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}
.nb-quote-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem 0.55rem;
}
.nb-quote-meta label {
  display: flex;
  align-items: center;
  gap: 0.25rem;
  color: var(--muted);
}
.nb-quote-field {
  width: 7.5rem;
  max-width: 40vw;
  font: inherit;
  font-size: 0.75rem;
  padding: 0.15rem 0.35rem;
  border: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
  border-radius: 4px;
  background: var(--surface);
  color: var(--text);
}
.nb-paste-url {
  margin: 0.35rem 0 0.75rem;
  padding: 0.45rem 0.5rem;
  border-radius: 8px;
  background: color-mix(in srgb, var(--surface) 88%, #c4b5a5);
}
.nb-paste-url-row {
  display: flex;
  gap: 0.35rem;
  margin-top: 0.25rem;
}
.nb-paste-url-row input {
  flex: 1;
  min-width: 0;
  font: inherit;
  font-size: 0.8rem;
  padding: 0.3rem 0.45rem;
  border: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
  border-radius: 6px;
  background: var(--surface);
  color: var(--text);
}
.chat-fc-stale {
  margin: 0.25rem 0 0;
  padding: 0.35rem 0.5rem;
  font-size: 0.78rem;
  color: color-mix(in srgb, #9a3412 75%, var(--text));
  background: color-mix(in srgb, #fef3c7 55%, var(--surface));
  border-radius: 6px;
}
.chat-fc-progress {
  margin-bottom: 0.25rem;
}
.chat-fc-fix {
  margin: 0.2rem 0 0.35rem;
  padding: 0.35rem 0.45rem;
  border-left: 2px solid color-mix(in srgb, var(--accent) 55%, transparent);
  background: color-mix(in srgb, var(--surface) 92%, var(--accent));
  border-radius: 0 6px 6px 0;
  line-height: 1.35;
}
.ba-fc-stale {
  position: relative;
}
.ba-fc-stale .mfp2-field-label {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.35rem 0.5rem;
}
.ba-fc-stale-badge {
  font-size: 0.65rem;
  font-weight: 650;
  letter-spacing: 0.01em;
  color: color-mix(in srgb, #9a3412 80%, var(--text));
  background: color-mix(in srgb, #fef3c7 70%, var(--surface));
  border: 1px solid color-mix(in srgb, #f59e0b 35%, transparent);
  border-radius: 4px;
  padding: 0.08rem 0.35rem;
}
.ba-fc-stale input,
.ba-fc-stale textarea {
  outline: 1px solid color-mix(in srgb, #f59e0b 45%, transparent);
}
.nb-arch-filters {
  display: flex;
  flex-direction: column;
  gap: 0.28rem;
  margin: 0.15rem 0 0.35rem;
}
.nb-filter-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.25rem 0.4rem;
}
.nb-filter-label {
  font-size: 0.65rem;
  font-weight: 650;
  color: var(--muted);
  min-width: 2.4rem;
}
.nb-filter-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.2rem;
}
.nb-filter-chip {
  font: inherit;
  font-size: 0.68rem;
  font-weight: 600;
  padding: 0.18rem 0.45rem;
  border: 1px solid color-mix(in srgb, var(--border) 90%, transparent);
  border-radius: 999px;
  background: transparent;
  color: var(--muted);
  cursor: pointer;
}
.nb-filter-chip:hover {
  color: var(--text);
  border-color: color-mix(in srgb, var(--accent) 40%, var(--border));
}
.nb-filter-chip.on {
  color: var(--text);
  background: var(--surface);
  border-color: color-mix(in srgb, var(--accent) 55%, var(--border));
  box-shadow: 0 1px 2px rgba(0,0,0,0.05);
}
.chat-p2-fidelity .chat-suggest-link.on {
  font-weight: 650;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.nb-src-open {
  border: 0;
  background: transparent;
  padding: 0;
  margin: 0;
  text-align: left;
  cursor: pointer;
  font: inherit;
  color: inherit;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.08rem;
}
.nb-src-open .rail-card-title {
  font-size: 0.8rem;
  font-weight: 650;
  color: var(--text);
  margin: 0;
}
.nb-src-open:hover .rail-card-title { color: var(--accent); }
.nb-mode {
  display: inline-flex;
  gap: 0.15rem;
  padding: 0.12rem;
  border-radius: 8px;
  background: color-mix(in srgb, var(--border) 55%, transparent);
  margin-bottom: 0.15rem;
}
.nb-mode-btn {
  font: inherit;
  font-size: 0.72rem;
  font-weight: 650;
  padding: 0.28rem 0.65rem;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--muted);
  cursor: pointer;
}
.nb-mode-btn.on {
  background: var(--surface);
  color: var(--text);
  box-shadow: 0 1px 2px rgba(0,0,0,0.06);
}
.nb-results-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.5rem;
  padding: 0.35rem 0 0.15rem;
  border-bottom: 0;
  list-style: none;
}
.nb-results-head strong { font-size: 0.75rem; }
.nb-searching { color: var(--muted); font-size: 0.8rem; }
.nb-wl-note { list-style: none; padding: 0.15rem 0 0.35rem; }
.nb-wl-note .why { margin: 0; font-size: 0.68rem; }
.nb-whitelist {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem 0.45rem;
  margin: 0.45rem 0 0.15rem;
}
.nb-whitelist-label {
  font-size: 0.68rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  opacity: 0.55;
  flex: 0 0 auto;
}
.nb-whitelist-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.28rem;
}
.nb-wl-chip {
  border: 1px solid rgba(40, 36, 32, 0.16);
  background: rgba(255, 255, 255, 0.72);
  color: inherit;
  font: inherit;
  font-size: 0.72rem;
  line-height: 1.2;
  padding: 0.18rem 0.45rem;
  border-radius: 3px;
  cursor: pointer;
}
.nb-wl-chip:hover {
  border-color: rgba(40, 36, 32, 0.35);
  background: #fff;
}
.mfp2-erail-results .trusted .meta,
.hit-card.trusted .magazine {
  color: #2f5d3a;
}
.rail-card--wl .rail-brand::after {
  content: none;
}
.chat-src-chip {
  align-self: flex-start;
  margin: 0 0 0.35rem 0.15rem;
  font: inherit;
  font-size: 0.68rem;
  font-weight: 650;
  padding: 0.2rem 0.55rem;
  border-radius: 6px;
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--muted);
  cursor: pointer;
  line-height: 1.2;
}
.chat-src-chip.on {
  border-color: color-mix(in srgb, var(--accent) 42%, var(--border));
  color: var(--accent);
  background: color-mix(in srgb, var(--accent) 16%, var(--surface));
}
.chat-src-chip:hover { color: var(--accent); }

/* Notebook-style source rows (Spark / LLM notebook cues) */
.rail-card--nb {
  padding: 0.35rem 0.2rem;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
}
.rail-card--nb.on {
  background: color-mix(in srgb, #c4b5a5 22%, var(--surface));
  margin: 0;
  padding: 0.4rem 0.45rem;
  border-radius: 10px;
  border-bottom-color: transparent;
}
.rail-nb-row {
  display: grid;
  grid-template-columns: 1.25rem 1fr auto;
  gap: 0.45rem;
  align-items: start;
}
.rail-nb-check {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding-top: 0.35rem;
  cursor: pointer;
}
.rail-nb-check input {
  margin: 0;
  width: 0.95rem;
  height: 0.95rem;
  accent-color: var(--accent);
}
.rail-nb-open {
  display: flex;
  gap: 0.55rem;
  align-items: flex-start;
  text-align: left;
  border: 0;
  background: transparent;
  padding: 0;
  margin: 0;
  cursor: pointer;
  color: inherit;
  font: inherit;
  min-width: 0;
}
.rail-nb-mark {
  flex-shrink: 0;
  width: 1.65rem;
  height: 1.65rem;
  border-radius: 6px;
  object-fit: cover;
  border: 1px solid var(--border);
  background: var(--surface);
  margin-top: 0.1rem;
}
.rail-nb-mark--ph {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.72rem;
  font-weight: 700;
  color: var(--muted);
  background: color-mix(in srgb, var(--accent) 8%, var(--surface));
}
.rail-nb-copy {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.12rem;
}
.rail-card--nb .rail-card-title {
  font-size: 0.84rem;
  font-weight: 650;
  line-height: 1.3;
  color: var(--text);
  margin: 0;
}
.rail-nb-open:hover .rail-card-title {
  color: var(--accent);
}
.rail-card--nb .rail-card-meta {
  margin: 0;
  font-size: 0.68rem;
}
.rail-syn--nb {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  margin: 0.1rem 0 0;
  font-size: 0.72rem;
  line-height: 1.35;
  color: var(--muted);
}
.rail-nb-ext {
  flex-shrink: 0;
  width: 1.6rem;
  height: 1.6rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 6px;
  border: 1px solid transparent;
  color: var(--muted);
  text-decoration: none;
  font-size: 0.85rem;
  background: transparent;
  cursor: pointer;
  margin-top: 0.15rem;
}
.rail-nb-ext:hover {
  border-color: var(--border);
  color: var(--accent);
  background: var(--surface);
}
.mfp2-rail-row-acts--quiet {
  padding-left: 1.7rem;
  margin-top: 0.15rem;
  opacity: 0;
  max-height: 0;
  overflow: hidden;
  transition: opacity 0.12s ease, max-height 0.12s ease;
}
.rail-card--nb:hover .mfp2-rail-row-acts--quiet,
.rail-card--nb:focus-within .mfp2-rail-row-acts--quiet {
  opacity: 1;
  max-height: 3rem;
}
.mfp2-rail-row-acts--quiet .mfp2-rail-act {
  font-size: 0.62rem;
  padding: 0.12rem 0.35rem;
}

/* Source guide in reader (notebook cue) */
.archive-read-card--nb {
  width: min(34rem, 96vw);
  border-radius: 14px;
}
.source-guide {
  margin: 0.35rem 0 0.75rem;
  padding: 0.7rem 0.8rem;
  border-radius: 10px;
  background: color-mix(in srgb, #d8e4f0 55%, var(--surface));
  border: 1px solid color-mix(in srgb, #9db4c9 35%, var(--border));
}
.source-guide[hidden] { display: none !important; }
.source-guide-head {
  margin-bottom: 0.3rem;
}
.source-guide-label {
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: color-mix(in srgb, var(--text) 70%, #3a5a7a);
}
.source-guide-text {
  margin: 0;
  font-size: 0.9rem;
  line-height: 1.45;
  color: var(--text);
}
.archive-read-more {
  font-size: 0.75rem;
}
.archive-read-more > summary {
  cursor: pointer;
  color: var(--muted);
  list-style: none;
  padding: 0.35rem 0.5rem;
}
.archive-read-more > summary::-webkit-details-marker { display: none; }
.archive-read-more-body {
  display: flex;
  flex-wrap: wrap;
  gap: 0.3rem;
  padding: 0.15rem 0 0.25rem;
}
.rail-card-top {
  display: flex;
  gap: 0.55rem;
  align-items: flex-start;
}
.rail-thumb {
  flex-shrink: 0;
  width: 3.6rem;
  height: 3.6rem;
  padding: 0;
  border: 1px solid var(--border);
  border-radius: 6px;
  overflow: hidden;
  background: var(--surface);
  cursor: pointer;
  display: block;
}
.rail-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.rail-thumb.ph {
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--display);
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--muted);
  background: color-mix(in srgb, var(--accent) 8%, var(--surface));
}
.rail-select {
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.1rem;
  font-size: 0.62rem;
  font-weight: 700;
  color: var(--muted);
  cursor: pointer;
  margin-top: 0.15rem;
}
.rail-select input { margin: 0; }
.rail-card-main { min-width: 0; flex: 1; }
.rail-card-title {
  display: block;
  font-size: 0.88rem;
  font-weight: 700;
  line-height: 1.25;
  color: var(--accent);
  margin: 0 0 0.2rem;
  text-decoration: none;
}
.rail-card-title:hover { text-decoration: underline; }
.rail-card-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem 0.65rem;
  font-size: 0.7rem;
  color: var(--muted);
  margin-bottom: 0.25rem;
}
.rail-brand { font-weight: 600; color: var(--muted); }
.rail-date { font-family: var(--mono); font-size: 0.65rem; }
.rail-kind {
  font-family: var(--mono);
  font-size: 0.58rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--muted);
}
.rail-syn {
  margin: 0.35rem 0 0;
  font-size: 0.82rem;
  line-height: 1.4;
  color: var(--text);
  background: color-mix(in srgb, var(--accent) 6%, var(--bg));
  border: 1px solid color-mix(in srgb, var(--accent) 18%, var(--border));
  border-radius: 6px;
  padding: 0.4rem 0.5rem;
}
.rail-syn--compact {
  margin: 0.2rem 0 0;
  padding: 0;
  background: transparent;
  border: 0;
  font-size: 0.78rem;
  line-height: 1.35;
  color: var(--muted2, var(--text));
}
.rail-syn--compact.is-expanded {
  color: var(--text);
}
.rail-more {
  display: inline;
  border: 0;
  background: none;
  padding: 0;
  margin: 0;
  font: inherit;
  font-weight: 600;
  color: var(--accent);
  cursor: pointer;
  text-decoration: underline;
}
.rail-syn-label {
  display: block;
  font-family: var(--mono);
  font-size: 0.58rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--accent);
  font-weight: 700;
  margin-bottom: 0.15rem;
}
.rail-syn.muted {
  color: var(--muted);
  font-style: italic;
  background: var(--surface);
}
.mfp2-rail-row-acts {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem;
  margin-top: 0.35rem;
  padding-left: 4.15rem;
}
.mfp2-rail-row-acts--tight {
  padding-left: 0;
  margin-top: 0.25rem;
}

/* Archive read overlay */
.archive-read {
  position: fixed;
  inset: 0;
  z-index: 60;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  background: color-mix(in srgb, var(--bg) 55%, transparent);
}
.archive-read.open,
.archive-read:not([hidden]) {
  display: flex;
}
.archive-read[hidden] { display: none !important; }
.archive-read-card {
  width: min(36rem, 96vw);
  max-height: min(88vh, 52rem);
  overflow: auto;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 12px;
  box-shadow: 0 16px 48px color-mix(in srgb, var(--text) 18%, transparent);
  padding: 0.85rem 1rem 1rem;
}
.archive-read-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 0.45rem;
}
.archive-read-head h3 {
  margin: 0;
  font-family: var(--display);
  font-size: 1.15rem;
  line-height: 1.25;
}
.archive-read-hero {
  margin: 0 0 0.65rem;
  border-radius: 8px;
  overflow: hidden;
  border: 1px solid var(--border);
  max-height: 12rem;
}
.archive-read-hero img {
  width: 100%;
  height: 12rem;
  object-fit: cover;
  display: block;
}
.archive-read-deck {
  font-size: 0.92rem;
  line-height: 1.4;
  margin: 0.35rem 0 0.65rem;
  color: var(--text);
}
.archive-read-body {
  font-size: 0.86rem;
  line-height: 1.5;
  white-space: pre-wrap;
  color: var(--text);
  margin-bottom: 0.85rem;
}
.archive-read-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  padding-top: 0.35rem;
  border-top: 1px solid var(--border);
}
.mfp2-chat-panel {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
}
.mfp2-chat-log {
  flex: 1;
  min-height: 0;
  overflow: auto;
  padding: 0.35rem 0 0.75rem;
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
}
.mfp2-chat-msg {
  padding: 0.5rem 0.65rem;
  border-radius: 8px;
  font-size: 0.85rem;
  line-height: 1.45;
  white-space: normal;
}
.nb-rail .mfp2-chat-msg {
  font-size: 0.72rem;
  line-height: 1.4;
  padding: 0.4rem 0.55rem;
}
.nb-rail .mfp2-chat-msg .md-body h2,
.nb-rail .mfp2-chat-msg .md-body h3,
.nb-rail .mfp2-chat-msg .md-body h4 {
  font-size: 0.8rem;
  margin: 0.45rem 0 0.25rem;
}
.nb-rail .mfp2-chat-msg .md-body p {
  margin: 0 0 0.45rem;
}
.nb-rail .mfp2-chat-msg .md-body ul,
.nb-rail .mfp2-chat-msg .md-body ol {
  margin: 0.2rem 0 0.55rem;
}
.nb-rail .mfp2-chat-msg .md-body li {
  margin: 0 0 0.7rem; /* breath between research / search items */
}
.nb-rail .mfp2-chat-msg .md-body li:last-child {
  margin-bottom: 0.25rem;
}
.mfp2-chat-msg .md-body {
  white-space: normal;
}
.mfp2-chat-msg .md-body p {
  margin: 0 0 0.55rem;
}
.mfp2-chat-msg .md-body p:last-child { margin-bottom: 0; }
.mfp2-chat-msg .md-body h2,
.mfp2-chat-msg .md-body h3,
.mfp2-chat-msg .md-body h4 {
  font-family: var(--display);
  font-size: 1rem;
  margin: 0.55rem 0 0.3rem;
  line-height: 1.25;
}
.mfp2-chat-msg .md-body h2:first-child,
.mfp2-chat-msg .md-body h3:first-child { margin-top: 0; }
.mfp2-chat-msg .md-body ul,
.mfp2-chat-msg .md-body ol {
  margin: 0.25rem 0 0.55rem;
  padding-left: 1.2rem;
}
.mfp2-chat-msg .md-body li { margin: 0.15rem 0; }
.mfp2-chat-msg .md-body code {
  font-family: var(--mono, ui-monospace, monospace);
  font-size: 0.78em;
  padding: 0.05rem 0.25rem;
  border-radius: 4px;
  background: var(--surface2, var(--surface));
}
.mfp2-chat-msg .md-body pre.md-code {
  margin: 0.35rem 0;
  padding: 0.45rem 0.55rem;
  overflow: auto;
  max-height: 12rem;
  border-radius: 6px;
  border: 1px solid var(--border);
  background: var(--surface);
  font-size: 0.75rem;
  white-space: pre-wrap;
}
.mfp2-chat-msg .md-body pre.md-code code {
  padding: 0;
  background: transparent;
}
.mfp2-chat-msg .md-body a { color: var(--accent); }
.mfp2-chat-msg.user {
  align-self: flex-end;
  background: var(--accent-dim);
  max-width: 92%;
}
.mfp2-chat-msg.bot {
  align-self: stretch;
  background: var(--bg);
  border: 1px solid var(--border);
  transition: border-color 0.15s, background 0.15s, box-shadow 0.15s;
}
/* Non-draft replies / status tips — whisper, no card chrome */
.mfp2-chat-msg.bot:not(.draft) {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0.05rem 0 !important;
  margin: 0.05rem 0 !important;
  color: color-mix(in srgb, var(--muted) 75%, transparent);
  font-size: 0.62rem !important;
  font-style: italic;
  font-weight: 400;
  line-height: 1.3;
  opacity: 0.72;
}
.mfp2-chat-msg.bot:not(.draft) .chat-draft-head {
  display: none; /* status/reply chrome off — drafts keep their head */
}
.mfp2-chat-msg.bot:not(.draft) .chat-draft-body,
.mfp2-chat-msg.bot:not(.draft) .md-body {
  margin: 0 !important;
  padding: 0 !important;
  max-height: none;
  overflow: visible;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  font-size: inherit !important;
  font-style: italic;
  font-weight: 400;
  color: inherit;
  white-space: normal;
}
.mfp2-chat-msg.bot:not(.draft) .md-body p {
  margin: 0 0 0.15rem !important;
}
.mfp2-chat-msg.bot:not(.draft) .md-body p:last-child {
  margin-bottom: 0 !important;
}
.mfp2-chat-msg.bot:not(.draft) .md-body strong {
  font-weight: 500;
  font-style: italic;
  color: inherit;
}
.mfp2-chat-msg.bot.quiet {
  padding: 0 !important;
  opacity: 0.58;
  font-size: 0.58rem !important;
  letter-spacing: 0.01em;
}
.nb-rail .mfp2-chat-msg.bot:not(.draft),
body.create-page .nb-rail .mfp2-chat-msg.bot:not(.draft) {
  font-size: 0.62rem !important;
  line-height: 1.3 !important;
  padding: 0.05rem 0 !important;
}
.nb-rail .mfp2-chat-msg.bot.quiet,
body.create-page .nb-rail .mfp2-chat-msg.bot.quiet {
  font-size: 0.58rem !important;
  opacity: 0.58;
}
.mfp2-chat-msg.bot.is-copied {
  border-color: var(--accent);
  background: var(--accent-dim);
  box-shadow: inset 0 0 0 1px var(--accent);
}
.mfp2-chat-msg.bot.muted { color: var(--muted); font-size: 0.8rem; }
.chat-copy-btn,
.mfp2-rail-copy-btn {
  appearance: none;
  display: inline-flex;
  align-items: center;
  margin-top: 0.45rem;
  padding: 0.22rem 0.5rem;
  border: 1px solid var(--border);
  border-radius: 5px;
  background: var(--surface);
  color: var(--muted);
  font: inherit;
  font-size: 0.68rem;
  font-weight: 600;
  cursor: pointer;
  transition: border-color 0.15s, background 0.15s, color 0.15s;
}
.chat-copy-btn:hover,
.mfp2-rail-copy-btn:hover {
  border-color: var(--accent);
  color: var(--text);
  background: var(--accent-dim);
}
.chat-copy-btn.is-copied,
.mfp2-rail-copy-btn.is-copied {
  border-color: var(--accent);
  background: var(--accent);
  color: var(--btn-fg);
}
.chat-copy-btn.is-copy-fail,
.mfp2-rail-copy-btn.is-copy-fail {
  border-color: var(--neg);
  color: var(--neg);
  background: transparent;
}
.mfp2-rail-ask-answer {
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
  padding: 0.55rem 0.65rem;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--bg);
  transition: border-color 0.15s, background 0.15s, box-shadow 0.15s;
}
.mfp2-rail-ask-answer.is-copied {
  border-color: var(--accent);
  background: var(--accent-dim);
  box-shadow: inset 0 0 0 1px var(--accent);
}
.mfp2-chat-msg.draft .chat-draft-body {
  margin: 0.35rem 0;
  padding: 0.45rem;
  max-height: none;
  overflow: visible;
  font: inherit;
  font-size: 0.82rem;
  white-space: normal;
  background: var(--surface);
  border-radius: 6px;
  border: 1px dashed var(--border);
}
/* Handoff / dossier blobs in chat — collapsed by default; draft stays fully open */
.chat-handoff-fold {
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
}
.chat-handoff-fold > summary {
  list-style: none;
  cursor: pointer;
  color: var(--muted);
  font-size: 0.72rem;
  line-height: 1.35;
  user-select: none;
}
.chat-handoff-fold > summary::-webkit-details-marker { display: none; }
.chat-handoff-fold > summary .chat-handoff-more {
  color: var(--accent);
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 2px;
  margin-left: 0.25rem;
}
.chat-handoff-fold[open] > summary .chat-handoff-more::before {
  content: "(less)";
}
.chat-handoff-fold[open] > summary .chat-handoff-more {
  font-size: 0;
}
.chat-handoff-fold[open] > summary .chat-handoff-more::before {
  font-size: 0.72rem;
  color: var(--accent);
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.chat-handoff-fold .chat-handoff-preview {
  display: block;
  margin-top: 0.25rem;
  color: var(--muted);
  font-size: 0.7rem;
  white-space: pre-wrap;
  max-height: 3.2em;
  overflow: hidden;
}
.chat-handoff-fold[open] .chat-handoff-preview { display: none; }
.chat-handoff-fold .chat-handoff-full {
  display: none;
  margin-top: 0.35rem;
  max-height: 12rem;
  overflow: auto;
  font-size: 0.72rem;
  line-height: 1.4;
  white-space: pre-wrap;
  opacity: 0.9;
}
.chat-handoff-fold[open] .chat-handoff-full { display: block; }
.chat-draft-label {
  margin: 0 0 0.2rem;
  color: var(--muted);
  font-size: 0.68rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.chat-draft-head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.2rem 0.65rem;
  margin-bottom: 0.25rem;
}
.chat-draft-acts {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.1rem 0.2rem;
  margin-top: 0;
  padding-top: 0;
  border-top: 0;
}
.chat-draft-sep {
  color: var(--muted);
  font-size: 0.75rem;
  opacity: 0.55;
}
.chat-draft-act {
  appearance: none;
  border: 0;
  background: transparent;
  padding: 0.05rem 0.1rem;
  margin: 0;
  font: inherit;
  font-size: 0.72rem;
  font-weight: 600;
  color: var(--muted);
  cursor: pointer;
  border-radius: 3px;
  box-shadow: none;
  filter: none;
}
.chat-draft-act:hover {
  color: var(--text);
  background: transparent;
  filter: none;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.chat-draft-act.quiet {
  font-weight: 500;
  color: var(--muted);
}
.ba-on-form-banner.other-draft a,
.ba-on-form-banner a.chat-put-ba {
  display: inline;
  padding: 0;
  margin-left: 0.15rem;
  border: 0;
  background: none;
  color: var(--accent);
  font: inherit;
  font-size: inherit;
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 2px;
  border-radius: 0;
  box-shadow: none;
}
.ba-on-form-banner.other-draft a:hover,
.ba-on-form-banner a.chat-put-ba:hover {
  filter: none;
}
.mfp2-chat-compose {
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  padding: 0.5rem 0.55rem 0.6rem;
  border-top: 1px solid var(--border);
  background: var(--surface);
  z-index: 20;
}
.mfp2-chat-input-wrap {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--bg);
  padding: 0.45rem 0.5rem 0.4rem;
  transition: border-color 0.12s ease, box-shadow 0.12s ease;
}
.mfp2-chat-input-wrap:focus-within {
  border-color: color-mix(in srgb, var(--accent) 45%, var(--border));
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 12%, transparent);
}
.mfp2-chat-compose textarea,
.mfp2-chat-input-wrap textarea {
  display: block;
  position: relative;
  z-index: 1;
  width: 100%;
  box-sizing: border-box;
  margin: 0;
  resize: none;
  min-height: 2.75rem;
  max-height: 8rem;
  border: 0;
  border-radius: 0;
  padding: 0.2rem 0.2rem 0.15rem;
  background: var(--bg);
  color: var(--text);
  -webkit-text-fill-color: var(--text);
  caret-color: var(--text);
  font: inherit;
  font-size: 0.84rem;
  line-height: 1.45;
  outline: none;
  box-shadow: none;
  /* Avoid stacked placeholder/value ghosts from overlays or interim voice text */
  isolation: isolate;
}
.mfp2-chat-compose textarea::placeholder,
.mfp2-chat-input-wrap textarea::placeholder {
  color: var(--muted);
  -webkit-text-fill-color: var(--muted);
  opacity: 0.85;
}
.mfp2-chat-compose textarea:not(:placeholder-shown)::placeholder,
.mfp2-chat-input-wrap textarea:not(:placeholder-shown)::placeholder {
  opacity: 0;
  color: transparent;
  -webkit-text-fill-color: transparent;
}
body[data-mfp2-page="create.html"] #rail-search-row[hidden],
body[data-mfp2-page="create.html"] #rail-compose[hidden] {
  display: none !important;
}
.mfp2-chat-actions {
  display: flex;
  align-items: center;
  gap: 0.2rem;
  min-height: 1.85rem;
}
.mfp2-chat-actions-spacer {
  flex: 1 1 auto;
  min-width: 0.5rem;
}
/* Shared quiet icon tools — attach + mic */
button.chat-tool-btn,
label.chat-tool-btn,
.chat-tool-btn {
  appearance: none;
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.85rem;
  height: 1.85rem;
  margin: 0;
  padding: 0 !important;
  border: 1px solid transparent;
  border-radius: 6px;
  background: transparent !important;
  color: var(--muted);
  cursor: pointer;
  box-shadow: none;
  filter: none;
  flex-shrink: 0;
  line-height: 0;
  font: inherit;
  font-weight: 500;
  transition: color 0.12s ease, background 0.12s ease, border-color 0.12s ease;
}
button.chat-tool-btn:hover,
label.chat-tool-btn:hover,
.chat-tool-btn:hover {
  color: var(--text);
  background: color-mix(in srgb, var(--text) 6%, transparent) !important;
  border-color: color-mix(in srgb, var(--border) 80%, transparent);
  filter: none;
}
button.chat-tool-btn:focus-visible,
label.chat-tool-btn:focus-within,
.chat-tool-btn:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--accent) 55%, transparent);
  outline-offset: 1px;
}
.chat-tool-btn svg {
  display: block;
  pointer-events: none;
}
.chat-tool-btn input[type="file"] {
  position: absolute;
  inset: 0;
  opacity: 0;
  width: 100%;
  height: 100%;
  cursor: pointer;
  font-size: 0;
  border: 0;
  padding: 0;
  margin: 0;
}
/* Mic recording state */
button.chat-tool-btn.is-recording,
#chat-mic.is-recording {
  color: #fff !important;
  background: #c45c4a !important;
  border-color: #c45c4a;
  animation: chat-mic-pulse 1.1s ease-in-out infinite;
}
@keyframes chat-mic-pulse {
  0%, 100% { box-shadow: 0 0 0 0 color-mix(in srgb, #c45c4a 35%, transparent); }
  50% { box-shadow: 0 0 0 5px color-mix(in srgb, #c45c4a 0%, transparent); }
}
/* Send — compact filled square (6px), aligned with tools */
button.mfp2-chat-send,
.mfp2-chat-send {
  appearance: none;
  position: static;
  width: 1.85rem;
  height: 1.85rem;
  padding: 0 !important;
  margin: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--text);
  border-radius: 6px;
  background: var(--text) !important;
  color: var(--bg) !important;
  cursor: pointer;
  box-shadow: none;
  filter: none;
  flex-shrink: 0;
  line-height: 0;
  font: inherit;
  transition: opacity 0.12s ease, transform 0.08s ease;
}
button.mfp2-chat-send:hover,
.mfp2-chat-send:hover {
  filter: none;
  opacity: 0.9;
  background: var(--text) !important;
  color: var(--bg) !important;
  border-color: var(--text);
}
.mfp2-chat-send:active {
  transform: scale(0.96);
}
.mfp2-chat-send:disabled {
  opacity: 0.35;
  cursor: default;
}
.mfp2-chat-send svg {
  display: block;
}
.mfp2-chat-hint {
  margin: 0;
  font-size: 0.64rem;
  color: var(--muted);
  letter-spacing: 0.01em;
  line-height: 1.35;
}
body[data-mfp2-page="create.html"] #rail-compose:not([hidden]) {
  display: flex !important;
  flex-shrink: 0;
  box-shadow: none;
  position: relative;
}

.create-context {
  margin: 0.25rem 0 0.35rem;
  padding: 0.4rem 0.55rem;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: color-mix(in srgb, var(--surface) 88%, transparent);
  font-size: 0.75rem;
}
.create-context-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem 0.85rem;
}
.create-context-grid em {
  font-style: normal;
  color: var(--muted);
  font-weight: 600;
  margin-right: 0.25rem;
  font-size: 0.65rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.create-context-grid .ok { color: var(--ok, #2a7); }
.create-context-grid .warn { color: var(--warn, #a65); }
.create-context-empty { color: var(--muted); }
.create-refs {
  margin: 0 0 0.55rem;
  padding: 0.4rem 0.55rem;
  border: 1px solid color-mix(in srgb, var(--accent) 35%, var(--border));
  border-radius: 6px;
  background: color-mix(in srgb, var(--accent) 6%, var(--bg));
}
.create-refs-head {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  font-size: 0.78rem;
  margin-bottom: 0.25rem;
}
.create-refs-list {
  list-style: none;
  margin: 0;
  padding: 0;
  font-size: 0.78rem;
}
.create-refs-list li {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.35rem 0.55rem;
  padding: 0.25rem 0;
  border-top: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
}
.create-refs-list li:first-child { border-top: 0; }
.create-refs-help {
  margin: 0 0 0.35rem;
  color: var(--muted);
  font-size: 0.72rem;
  line-height: 1.35;
}

.shell .main:has(.mfp2-editor),
.shell .main:has(.create-desk-panel) {
  max-width: none;
}

.stage-split {
  margin: -0.25rem 0 0.85rem;
  max-width: 40rem;
  line-height: 1.4;
}
.preplan-steps {
  margin: 0 0 0.85rem;
}
.preplan-steps a.create-step {
  text-decoration: none;
}
.preplan-steps a.create-step:hover {
  text-decoration: none;
}

/* Pre-plan — compact chrome (scales to many titles) */
.preplan-chrome {
  margin: 0 0 0.45rem;
}
.preplan-chrome-row {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: 0.55rem 1rem;
}
.preplan-mag {
  flex: 1 1 16rem;
  min-width: 0;
}
.preplan-mag-label {
  display: block;
  font-size: 0.65rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--muted);
  margin: 0 0 0.2rem;
}
.preplan-mag-combo {
  display: grid;
  grid-template-columns: minmax(7rem, 11rem) minmax(12rem, 1fr);
  gap: 0.35rem;
  max-width: 36rem;
}
.preplan-mag-combo input[type="search"],
.preplan-mag-combo select {
  width: 100%;
  min-width: 0;
  font-size: 0.85rem;
  padding: 0.35rem 0.5rem;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--surface);
  color: var(--text);
}
.preplan-mag-combo select {
  font-weight: 600;
}
.preplan-meta {
  margin: 0.3rem 0 0;
  font-size: 0.75rem;
  color: var(--muted);
  line-height: 1.35;
}
.preplan-meta strong { color: var(--text); font-weight: 600; }
.preplan-hint { color: var(--muted2, var(--muted)); }
.preplan-chrome-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  align-items: center;
}
.preplan-sec-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.4rem 0.75rem;
  margin: 0 0 0.2rem;
}
.preplan-sec-head h2 {
  margin: 0;
  font-size: 0.9rem;
  font-weight: 600;
}
.preplan-tools {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.15rem;
  padding: 0.15rem;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--bg);
}
.preplan-tools .btn-tool {
  appearance: none;
  border: 0;
  background: transparent;
  color: var(--text);
  font: inherit;
  font-size: 0.72rem;
  font-weight: 700;
  padding: 0.22rem 0.5rem;
  border-radius: 6px;
  cursor: pointer;
  text-decoration: none;
  line-height: 1.2;
}
.preplan-tools .btn-tool:hover {
  background: color-mix(in srgb, var(--accent) 12%, transparent);
  color: var(--accent);
  text-decoration: none;
}
.preplan-tools .btn-tool.is-locked,
.preplan-tools .btn-tool[aria-pressed="true"] {
  background: color-mix(in srgb, var(--warn, #b45309) 14%, transparent);
  color: var(--warn, #9a5b1a);
}
.preplan-tools .btn-tool[aria-pressed="false"] {
  background: color-mix(in srgb, var(--ok, #15803d) 12%, transparent);
  color: var(--ok, #166534);
}
.preplan-tools .tool-sep {
  width: 1px;
  height: 1rem;
  background: var(--border);
  margin: 0 0.15rem;
}
.preplan-sec-note {
  margin: 0 0 0.4rem;
}

/* legacy title-picker kept inert if referenced elsewhere */
.title-picker { display: none !important; }

.preplan-page .preplan-head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: 0.65rem 1rem;
  margin-bottom: 0.45rem;
}
.preplan-page .eyebrow { margin-bottom: 0.15rem; }
.preplan-page h1 { margin: 0 0 0.15rem; font-size: 1.45rem; }
.preplan-page .lede.compact {
  margin: 0;
  font-size: 0.85rem;
  max-width: 36rem;
}
.preplan-page .preplan-toolbar {
  margin: 0;
  padding: 0;
  border: 0;
  gap: 0.45rem;
}
body[data-mfp2-page="preplan.html"] .mfp2-focus {
  margin: 0 0 0.35rem;
  padding: 0.28rem 0.55rem;
  font-size: 0.75rem;
  line-height: 1.35;
}
body[data-mfp2-page="preplan.html"] .mfp2-crumbs {
  margin: 0 0 0.3rem;
  font-size: 0.68rem;
  padding: 0.25rem 0.4rem;
}
body[data-mfp2-page="preplan.html"] .flash {
  margin: 0 0 0.35rem;
  padding: 0.35rem 0.55rem;
  font-size: 0.78rem;
}
.preplan-page .tile-tight {
  margin: 0 0 0.55rem;
  padding: 0.55rem 0.65rem;
}
.preplan-page .preplan-steps {
  margin: 0 0 0.55rem;
}
.bp-scroll {
  max-height: min(52vh, 28rem);
  overflow: auto;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--bg);
}
.bp-scroll-sm { max-height: min(28vh, 14rem); }
.bp-scroll thead th {
  position: sticky;
  top: 0;
  z-index: 1;
  background: var(--surface);
  box-shadow: 0 1px 0 var(--border);
}

.ap-review {
  margin: 0 0 0.55rem;
  padding: 0.55rem 0.65rem;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--surface);
}
.ap-review-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.45rem 0.75rem;
  margin-bottom: 0.4rem;
}
.ap-review-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  margin-left: auto;
}

/* Blueprint table — denser, lockable */
table.bp-dense {
  font-size: 0.74rem;
}
table.bp-dense th,
table.bp-dense td {
  padding: 0.16rem 0.3rem;
  vertical-align: middle;
}
table.bp-dense th {
  font-size: 0.62rem;
  letter-spacing: 0.03em;
  white-space: nowrap;
}
table.bp-dense input,
table.bp-dense select {
  font-size: 0.74rem;
  padding: 0.12rem 0.25rem;
  min-height: 0;
}
table.bp-dense.bp-locked button[data-del] {
  opacity: 0.55;
  cursor: not-allowed;
}
table.bp-dense.bp-locked {
  background: color-mix(in srgb, var(--panel, var(--surface)) 92%, var(--muted));
}
.bp-row-acts {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.3rem;
  white-space: nowrap;
}
.bp-row-acts .btn-ghost,
.bp-row-acts .btn-tool {
  font-size: 0.68rem;
  padding: 0.18rem 0.45rem;
  line-height: 1.2;
}
.bp-row-acts [data-edit].is-editing {
  border-color: var(--accent);
  color: var(--accent);
  background: color-mix(in srgb, var(--accent) 10%, transparent);
}
#bp-table tbody tr:not(.bp-editing) input,
#bp-table tbody tr:not(.bp-editing) select {
  opacity: 0.88;
  background: color-mix(in srgb, var(--surface) 88%, var(--border));
}
#bp-table tbody tr.bp-editing input,
#bp-table tbody tr.bp-editing select {
  opacity: 1;
  background: var(--input-bg, var(--surface));
  outline: 1px solid color-mix(in srgb, var(--accent) 35%, var(--border));
}

.mfp2-journey-4 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
@media (min-width: 1100px) {
  .mfp2-journey-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}
.walk-spine {
  margin-bottom: 0.75rem;
  padding: 0.65rem 0.85rem;
}
.walk-spine .steps { margin: 0; }

/* Create desk — dense, fills viewport */
.create-top {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.45rem 0.75rem;
  margin: 0 0 0.45rem;
  padding: 0.35rem 0;
}
.create-mode-tabs {
  display: inline-flex;
  gap: 0.2rem;
  margin-left: 0.35rem;
}
.create-mode {
  font: inherit;
  font-size: 0.78rem;
  padding: 0.21rem 0.65rem; /* ~25% shorter */
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--surface);
  color: var(--muted);
  cursor: pointer;
  line-height: 1.2;
}
.create-mode:hover { color: var(--text); border-color: var(--accent); }
.create-mode.on {
  color: var(--accent);
  border-color: color-mix(in srgb, var(--accent) 42%, var(--border));
  background: color-mix(in srgb, var(--accent) 16%, var(--surface));
  font-weight: 650;
}
.create-list-panel { margin-top: 0.25rem; }
.create-list-lede { margin: 0 0 0.55rem; }
.create-list-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem 0.55rem;
  align-items: end;
  margin-bottom: 0.45rem;
  padding: 0.5rem 0.55rem;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--surface);
}
.create-list-filters .clf {
  display: flex;
  flex-direction: column;
  gap: 0.12rem;
  margin: 0;
  font-size: 0.72rem;
}
.create-list-filters .clf span {
  font-family: var(--mono);
  font-size: 0.6rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--muted);
}
.create-list-filters select,
.create-list-filters input {
  font: inherit;
  font-size: 0.78rem;
  padding: 0.28rem 0.4rem;
  min-width: 7.5rem;
}
.create-list-filters #f-q { min-width: 11rem; }
.scope-chips { margin: 0.35rem 0 0.5rem; }
.scope-chips .scope { font-size: 0.82rem; }
.scope-chips .scope:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}
.create-list-scroll {
  overflow: auto;
  max-height: calc(100vh - 12.5rem);
  border: 1px solid var(--border);
  border-radius: 8px;
}
.create-list-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.8rem;
}
.create-list-table th {
  position: sticky;
  top: 0;
  z-index: 1;
  background: var(--surface);
  text-align: left;
  font-size: 0.62rem;
  font-family: var(--mono);
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: var(--muted);
  padding: 0.4rem 0.45rem;
  border-bottom: 1px solid var(--border);
  white-space: nowrap;
}
.create-list-table th.sortable { cursor: pointer; }
.create-list-table th.sortable.on { color: var(--text); }
.create-list-table th.sortable.on.asc::after { content: " ↑"; }
.create-list-table th.sortable.on.desc::after { content: " ↓"; }
.create-list-table td {
  padding: 0.55rem 0.45rem;
  border-bottom: 1px solid var(--border);
  vertical-align: top;
}
.create-list-table tr.list-row { cursor: pointer; }
.create-list-table tr.list-row:hover { background: color-mix(in srgb, var(--accent) 6%, transparent); }
.create-list-table .syn {
  max-width: 12rem;
  color: var(--muted);
  font-size: 0.74rem;
  line-height: 1.35;
  white-space: normal;
}
.create-list-table .linkish {
  font: inherit;
  font-weight: 600;
  color: var(--text);
  background: none;
  border: 0;
  padding: 0;
  cursor: pointer;
  text-align: left;
}
.create-list-table .linkish:hover { color: var(--accent); text-decoration: underline; }
.create-list-table .muted-link { opacity: 0.7; }
.create-list-table .st-pill {
  font-size: 0.68rem;
  font-family: var(--mono);
  color: var(--muted);
  white-space: nowrap;
}
.create-desk-panel { margin-top: 0.15rem; }

.create-top h1 {
  margin: 0;
  font-size: 1.05rem;
  font-family: var(--display);
  font-weight: 700;
  letter-spacing: -0.02em;
}
.create-top-left,
.create-top-right {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem 0.45rem;
}
/* Desk nav back-links in top-left */
.desk-nav-links {
  display: flex;
  align-items: center;
  gap: 0.2rem;
  margin-left: 0.25rem;
  padding-left: 0.5rem;
  border-left: 1px solid var(--border);
}
.desk-nav-link {
  font-size: 0.78rem;
  color: var(--muted);
  text-decoration: none;
  padding: 0.28rem 0.55rem;
  border: 1px solid transparent;
  border-radius: 6px;
  transition: color 0.12s, border-color 0.12s, background 0.12s;
}
.desk-nav-link:hover,
.desk-nav-link.on {
  color: var(--text);
  border-color: var(--accent);
  background: color-mix(in srgb, var(--accent) 8%, var(--surface));
}
/* Desk toolbar: art picker + workflow buttons inline */
.desk-toolbar-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.35rem 0.45rem;
}
#art-pick {
  width: auto;
  min-width: 11rem;
  max-width: 16rem;
  margin: 0;
  font-size: 0.82rem;
  padding: 0.28rem 0.45rem;
}
.desk-wf-btns {
  display: flex;
  align-items: center;
  gap: 0.2rem;
  padding-left: 0.45rem;
  border-left: 1px solid var(--border);
}
/* Make create-mode apply to links too */
a.create-mode {
  text-decoration: none;
  display: inline-flex;
  align-items: center;
}
/* Disabled workflow buttons */
.desk-wf-btns .create-mode:disabled {
  opacity: 0.38;
  cursor: not-allowed;
}
.desk-wf-btns .create-mode:disabled:hover {
  color: var(--muted);
  border-color: var(--border);
  background: var(--surface);
}
/* Blank desk state */
.desk-blank {
  padding: 2.5rem 1.5rem;
  text-align: center;
  color: var(--muted);
}
.desk-blank-title {
  font-size: 1.15rem;
  font-weight: 600;
  color: var(--text);
  margin: 0 0 0.35rem;
  font-family: var(--display, Newsreader, Georgia, serif);
}
.desk-blank-copy {
  font-size: 0.88rem;
  margin: 0 0 1.1rem;
  max-width: 28rem;
  margin-left: auto;
  margin-right: auto;
  line-height: 1.45;
}
.desk-blank-pick-wrap {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0.35rem;
  width: min(100%, 22rem);
  margin: 0 auto 1rem;
  text-align: left;
}
.desk-blank-pick-label {
  font-size: 0.68rem;
  font-family: var(--mono);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--muted);
}
#desk-blank-pick {
  width: 100%;
  font: inherit;
  font-size: 0.92rem;
  padding: 0.45rem 0.55rem;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--surface);
  color: var(--text);
}
.desk-blank-actions {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 0.5rem;
}
body.create-blank .desk-wf-btns {
  display: none;
}
body.create-blank #art-pick {
  min-width: 16rem;
  max-width: 22rem;
  border-color: var(--accent);
}
.create-top .btn,
.create-top .btn-ghost,
.create-brief-link {
  font-size: 0.78rem;
  padding: 0.32rem 0.65rem;
}
.create-top .meta { font-size: 0.72rem; }
.create-meta-line {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.25rem 0.4rem;
  font-size: 0.82rem;
  line-height: 1.35;
}
.create-meta-line code { font-size: 0.75rem; }
.create-meta-map { margin-top: 0.35rem; }
.create-panel-hint { margin: 0 0 0.45rem; }
.create-brief-strip {
  margin: 0.45rem 0 0.35rem;
  padding: 0.45rem 0.55rem;
  background: var(--surface2);
  border: 1px solid var(--border);
  border-radius: 6px;
  font-size: 0.82rem;
}
.create-brief-strip em {
  color: var(--muted);
  font-style: normal;
  font-weight: 600;
  margin-right: 0.25rem;
}
.mfp2-erail-results .assist-hero,
.mfp2-erail-results .assist-item {
  background: color-mix(in srgb, var(--accent-dim) 55%, var(--surface));
  border-radius: 6px;
  margin: 0.25rem 0;
}
.mfp2-erail-results .assist-hero .btn {
  font-size: 0.75rem;
  padding: 0.28rem 0.5rem;
}
.create-ready-actions { margin-top: 0.55rem; }
.create-ai-report {
  margin: 0.65rem 0 0;
  padding: 0.55rem 0.65rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--surface);
  font-size: 0.82rem;
}
.create-ai-report ul { margin: 0.25rem 0 0; padding-left: 1.1rem; }
.create-ai-report .warn { color: var(--warn); }
.create-ai-report .ok { color: var(--ok); }

/* ——— Layout Preview (left column takeover; research rail stays) ——— */
.lp-fullscreen {
  grid-column: 1;
  grid-row: 1;
  z-index: 5;
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 0;
  height: 100%;
  overflow: hidden;
  background: var(--bg);
  border-right: 1px solid var(--border);
}
.lp-fullscreen[hidden] {
  display: none !important;
}
.create-desk-panel:has(.lp-fullscreen:not([hidden])) .create-desk-left {
  display: none;
}
.lp-fs-head {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.45rem 0.65rem;
  padding: 0.4rem 0.55rem 0.4rem 0.4rem;
  border-bottom: 1px solid var(--border);
  background: var(--surface);
  flex-shrink: 0;
}
.lp-fs-head-left {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  min-width: 0;
  margin-right: auto;
}
.lp-fs-head-left #btn-layout-preview-close {
  flex-shrink: 0;
  font-weight: 650;
  padding: 0.28rem 0.7rem;
}
.lp-fs-title {
  margin: 0;
  font-size: 0.95rem;
  font-family: var(--display);
  font-weight: 600;
}
.lp-fs-badge {
  margin-left: 0;
  font-size: 0.65rem;
  color: var(--muted);
  border: 1px solid var(--border);
  border-radius: 6px;
  padding: 0.12rem 0.45rem;
}
.lp-fs-stage {
  flex: 1;
  overflow: auto;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: flex-start;
  padding: 0.55rem 0.65rem 0.7rem;
  min-height: 0;
  /* Dark desk under the spread — pages read as paper */
  background:
    radial-gradient(ellipse 80% 60% at 50% 40%, #3a3630 0%, #252320 70%, #1c1a18 100%);
}
.lp-fs-nav {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.5rem;
  padding: 0.55rem 1rem;
  border-top: 1px solid var(--border);
  background: var(--surface);
}
button.lp-nav-btn,
.lp-nav-btn {
  appearance: none;
  font: inherit;
  font-size: 1.25rem;
  background: var(--surface) !important;
  border: 1px solid var(--border);
  border-radius: 6px;
  padding: 0.1rem 0.6rem !important;
  cursor: pointer;
  color: var(--text) !important;
  line-height: 1;
  font-weight: 600;
  filter: none !important;
}
.lp-nav-btn:hover:not(:disabled) {
  background: var(--accent-dim) !important;
  border-color: var(--accent);
  color: var(--text) !important;
}
.lp-nav-btn:disabled { opacity: 0.3; cursor: default; }
.lp-nav-label { font-family: var(--mono); font-size: 0.78rem; color: var(--muted); }

.lp-compose-opts {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  width: 100%;
  order: 5;
  padding-top: 0.15rem;
}
button.lp-opt-btn,
.lp-opt-btn {
  appearance: none;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.1rem;
  padding: 0.35rem 0.55rem !important;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: #f7f4ee !important;
  color: #2a2a26 !important;
  cursor: pointer;
  text-align: left;
  font: inherit;
  font-weight: 600;
  min-width: 8.5rem;
  max-width: 14rem;
  filter: none !important;
}
.lp-opt-btn:hover {
  border-color: #6b8f71;
  background: #fff !important;
  color: #2a2a26 !important;
}
.lp-opt-btn.on {
  border-color: #3d6b4f;
  background: #eef4ef !important;
  box-shadow: inset 0 0 0 1px #3d6b4f;
}
.lp-opt-name {
  font-size: 0.72rem;
  font-weight: 700;
  color: #2a2a26;
}
.lp-opt-blurb {
  font-size: 0.58rem;
  line-height: 1.3;
  color: #6b6860;
  font-weight: 500;
}
.lp-compose-status {
  margin: 0;
  padding: 0.35rem 0.75rem;
  font-size: 0.68rem;
  color: #4a564c;
  background: #e8efe9;
  border-bottom: 1px solid #d0ddd2;
  flex-shrink: 0;
}
.lp-compose-wait {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.55rem;
  min-height: 18rem;
  padding: 2rem;
  text-align: center;
}
.lp-compose-spinner {
  width: 1.6rem;
  height: 1.6rem;
  border: 2px solid #c8d0c9;
  border-top-color: #3d6b4f;
  border-radius: 50%;
  animation: lp-spin 0.7s linear infinite;
}
@keyframes lp-spin {
  to { transform: rotate(360deg); }
}
.lp-compose-wait-title {
  margin: 0;
  font-family: var(--display);
  font-size: 1.05rem;
  font-weight: 600;
}
.lp-compose-wait-sub {
  margin: 0;
  font-size: 0.72rem;
  color: #6b6860;
}

/* Fixed magazine page ratio — preview scales to stage, not stretched to viewport */
.lp-fs-stage .lp-spread {
  width: min(100%, calc((100dvh - 11rem) * 420 / 297));
  max-width: 100%;
  margin: 0.35rem auto auto;
  flex: 0 0 auto;
  min-height: 0;
  height: auto;
  aspect-ratio: 420 / 297;
  align-items: stretch;
  filter: drop-shadow(0 14px 36px rgba(0, 0, 0, 0.42));
}
.lp-fs-stage .lp-spread.lp-single {
  width: min(52%, calc((100dvh - 11rem) * 210 / 297));
  max-width: 100%;
  aspect-ratio: 210 / 297;
  grid-template-columns: 1fr;
}
.lp-spread {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  max-width: none;
  margin: 0;
  align-items: stretch;
}
.lp-spread.lp-single {
  grid-template-columns: 1fr;
  justify-content: stretch;
}
/* Health cascade 1 — same BA fields, clearly different page architectures */
.lp-layout-badge {
  position: absolute;
  top: 0.4rem;
  right: 0.55rem;
  z-index: 3;
  margin: 0;
  padding: 0.12rem 0.35rem;
  font-family: "IBM Plex Mono", ui-monospace, monospace;
  font-size: 0.5rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #5a5348;
  background: rgba(255, 252, 245, 0.55);
  border: 1px solid rgba(70, 55, 35, 0.12);
  border-radius: 0;
  opacity: 0.32;
  pointer-events: none;
  transition: opacity 0.15s ease;
}
.lp-page:hover .lp-layout-badge,
.lp-fs-stage:hover .lp-layout-badge {
  opacity: 0.75;
  background: rgba(255, 252, 245, 0.9);
}

/* Classic — title/deck live in a named overlay frame over a capped lead picture. */
.lp-spread.lp-var-dps-classic .lp-page.left .lp-hero-stack {
  position: relative;
  flex: 0 0 auto;
  height: 40%;
  min-height: 0;
  margin: 0 0 0.28rem;
  overflow: hidden;
  background: #24201b;
}
.lp-spread.lp-var-dps-classic .lp-page.left .lp-hero-stack > .lp-frame.main {
  width: 100%;
  height: 100%;
  max-height: none;
  margin: 0;
  aspect-ratio: auto;
  background-position: center 22%;
}
.lp-spread.lp-var-dps-classic .lp-hero-overlay {
  position: absolute;
  inset: auto 0 0;
  z-index: 2;
  padding: 1.5rem 0.8rem 0.65rem;
  color: #fffaf1;
  background: linear-gradient(0deg, rgba(16, 13, 10, 0.9) 0%, rgba(16, 13, 10, 0.6) 55%, transparent 100%);
  pointer-events: none;
}
.lp-spread.lp-var-dps-classic .lp-hero-overlay .lp-kicker { color: rgba(255, 250, 241, 0.76); }
.lp-spread.lp-var-dps-classic .lp-hero-overlay .lp-hed {
  color: #fff;
  letter-spacing: -0.02em;
  font-size: clamp(1.18rem, 2vw, 1.75rem);
  line-height: 0.98;
}
.lp-spread.lp-var-dps-classic .lp-hero-overlay .lp-stand {
  color: rgba(255, 250, 241, 0.92);
  font-size: clamp(0.57rem, 0.82vw, 0.72rem);
  line-height: 1.23;
}
.lp-spread.lp-var-dps-classic .lp-page.right > .lp-frame.support {
  max-height: 12%;
  min-height: 2.4rem;
  margin: 0.18rem 0 0.24rem;
}

/* Opener — title/deck over photo; crop keeps faces out of the overlay. */
.lp-spread.lp-var-dps-health-opener .lp-page.lp-opener-photo {
  padding: 0;
  gap: 0;
  background: #151310;
  color: #f7f2e8;
}
.lp-spread.lp-var-dps-health-opener .lp-page.lp-opener-photo .lp-layout-badge {
  color: #f7f2e8;
  background: rgba(0, 0, 0, 0.45);
  border-color: rgba(255, 255, 255, 0.2);
}
.lp-spread.lp-var-dps-health-opener .lp-page.lp-opener-photo .lp-hero,
.lp-spread.lp-var-dps-health-opener .lp-page.lp-opener-photo .lp-frame.main {
  flex: 1 1 auto;
  width: 100%;
  min-height: 0;
  max-height: none;
  aspect-ratio: auto;
  margin: 0;
  border-radius: 0;
  background-position: center 22%;
}
.lp-spread.lp-var-dps-health-opener .lp-opener-caption {
  position: absolute;
  inset: auto 0 0;
  padding: 1.8rem 0.85rem 0.85rem;
  background: linear-gradient(0deg, rgba(12, 10, 8, 0.94) 0%, rgba(12, 10, 8, 0.62) 58%, transparent 100%);
  margin: 0;
  z-index: 2;
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}
.lp-spread.lp-var-dps-health-opener .lp-opener-caption .lp-kicker {
  color: rgba(247, 242, 232, 0.72);
}
.lp-spread.lp-var-dps-health-opener .lp-opener-caption .lp-hed {
  color: #fff;
  font-size: clamp(1.32rem, 2.25vw, 1.9rem);
  line-height: 1;
}
.lp-spread.lp-var-dps-health-opener .lp-opener-caption .lp-stand,
.lp-spread.lp-var-dps-health-opener .lp-opener-caption .lp-gap {
  color: rgba(247, 242, 232, 0.88);
  border: none;
  padding-left: 0;
  max-width: 100%;
}
.lp-spread.lp-var-dps-health-opener .lp-page.lp-opener-copy {
  background: linear-gradient(180deg, #faf6ef 0%, #f0ebe1 100%);
}
.lp-spread.lp-var-dps-health-opener .lp-page.lp-opener-copy > .lp-frame.support {
  max-height: 11%;
  min-height: 2.2rem;
  margin: 0.2rem 0;
}

/* Split — asymmetric image-led left · copy-led right */
.lp-spread.lp-var-dps-health-split .lp-page.left {
  background: linear-gradient(180deg, #f8f5ef 0%, #ebe4d6 100%);
}
.lp-spread.lp-var-dps-health-split .lp-mast-compact .lp-hed {
  font-size: clamp(1.2rem, 1.85vw, 1.55rem);
  text-align: left;
}
.lp-spread.lp-var-dps-health-split .lp-mast-compact .lp-stand {
  text-align: left;
  max-width: 100%;
  margin-inline: 0;
}
.lp-spread.lp-var-dps-health-split .lp-page.left .lp-frame.main {
  max-height: 43%;
  aspect-ratio: 5 / 4;
  background-position: center 20%;
}
.lp-spread.lp-var-dps-health-split .lp-flow-split {
  flex: 1 1 auto;
  min-height: 0;
}
.lp-spread.lp-var-dps-health-split .lp-page.right > .lp-frame.support {
  max-height: 14%;
}
.lp-spread.lp-var-dps-health-split .lp-page.right .lp-subhead {
  text-align: left;
  width: 100%;
}

/* Panel — real hero + 2-col main · ~30% service column */
.lp-spread.lp-var-dps-health-panel .lp-page.left .lp-frame.main {
  max-height: 29%;
  aspect-ratio: 3 / 2;
  background-position: center 25%;
}
.lp-spread.lp-var-dps-health-panel .lp-panel-page {
  background: #f3eee4;
}
.lp-spread.lp-var-dps-health-panel .lp-panel-grid {
  display: grid;
  grid-template-columns: minmax(0, 2.2fr) minmax(0, 0.95fr);
  gap: 0.42rem;
  flex: 1 1 auto;
  min-height: 0;
  align-items: stretch;
}
.lp-spread.lp-var-dps-health-panel .lp-panel-main {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
}
.lp-spread.lp-var-dps-health-panel .lp-panel-main .lp-flow {
  flex: 1 1 auto;
}
.lp-spread.lp-var-dps-health-panel .lp-panel-main > .lp-frame.support {
  max-height: 12%;
  min-height: 2rem;
}
.lp-spread.lp-var-dps-health-panel .lp-page-sidebar,
.lp-spread.lp-var-dps-health-panel .lp-panel-forced {
  margin: 0;
  padding: 0.55rem 0.6rem;
  max-height: none;
  height: 100%;
  border-left: none;
  border-top: 2px solid #c4a574;
  border-radius: 0;
  background: #e8dfcf;
  box-shadow: inset 0 0 0 1px rgba(70, 55, 35, 0.14);
}
.lp-spread.lp-var-dps-health-panel .lp-page-sidebar-head {
  font-size: 0.66rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

/* Mag F Home / DIY — Lead photo without type overlay; dense type pack; paired supports. */
.lp-spread.lp-var-dps-magf-home .lp-page {
  display: flex;
  flex-direction: column;
  gap: 0.32rem;
  min-height: 0;
}
.lp-spread.lp-var-dps-magf-home .lp-page.lp-home-lead > .lp-frame.main,
.lp-spread.lp-var-dps-magf-home .lp-page.lp-home-lead > .lp-hero {
  flex: 0 0 42%;
  width: 100%;
  max-height: 42%;
  min-height: 0;
  aspect-ratio: auto;
  margin: 0;
  background-size: cover;
  background-position: center 28%;
  background-repeat: no-repeat;
}
.lp-spread.lp-var-dps-magf-home .lp-mast-below {
  flex: 0 0 auto;
  margin: 0;
  padding: 0.05rem 0 0;
}
.lp-spread.lp-var-dps-magf-home .lp-mast-below .lp-hed {
  font-size: clamp(1.05rem, 1.85vw, 1.55rem);
  line-height: 1.02;
  letter-spacing: -0.02em;
  margin: 0.08rem 0 0.18rem;
}
.lp-spread.lp-var-dps-magf-home .lp-mast-below .lp-stand {
  margin: 0;
  font-size: clamp(0.55rem, 0.78vw, 0.68rem);
  line-height: 1.28;
}
.lp-spread.lp-var-dps-magf-home .lp-home-closer {
  flex: 1 1 auto;
  min-height: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  gap: 0.18rem;
}
.lp-spread.lp-var-dps-magf-home .lp-home-closer .lp-home-body {
  flex: 1 1 auto;
  min-height: 0;
  overflow: hidden;
  font-size: 0.55rem;
  line-height: 1.32;
}
.lp-spread.lp-var-dps-magf-home .lp-home-closer .lp-home-body p {
  margin: 0 0 0.32em;
}
.lp-spread.lp-var-dps-magf-home .lp-page.lp-home-copy {
  gap: 0.38rem;
}
.lp-spread.lp-var-dps-magf-home .lp-home-supports {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.38rem;
  flex: 0 0 auto;
  height: 26%;
  max-height: 28%;
  min-height: 0;
}
.lp-spread.lp-var-dps-magf-home .lp-home-supports > .lp-frame {
  width: 100%;
  height: 100%;
  max-height: none;
  min-height: 0;
  aspect-ratio: auto;
  margin: 0;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.lp-spread.lp-var-dps-magf-home .lp-home-cols {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.45rem;
  flex: 1 1 auto;
  min-height: 0;
  overflow: hidden;
  align-content: start;
}
.lp-spread.lp-var-dps-magf-home .lp-home-col {
  display: flex;
  flex-direction: column;
  gap: 0.16rem;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
}
.lp-spread.lp-var-dps-magf-home .lp-home-col .lp-subhead {
  margin: 0;
  font-size: 0.62rem;
}
.lp-spread.lp-var-dps-magf-home .lp-home-col .lp-home-body {
  flex: 1 1 auto;
  min-height: 0;
  overflow: hidden;
  font-size: 0.52rem;
  line-height: 1.3;
}
.lp-spread.lp-var-dps-magf-home .lp-home-col .lp-home-body p {
  margin: 0 0 0.3em;
}
.lp-spread.lp-var-dps-magf-home .lp-home-quotes {
  flex: 0 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.4rem;
  padding-top: 0.18rem;
  border-top: 1px solid rgba(70, 55, 35, 0.16);
  margin-top: 0.1rem;
}
.lp-spread.lp-var-dps-magf-home .lp-home-quotes .lp-pullq {
  margin: 0;
  font-size: clamp(0.62rem, 0.95vw, 0.78rem);
  line-height: 1.2;
  text-align: left;
}

@media (max-width: 820px) {
  .lp-spread {
    grid-template-columns: 1fr;
    gap: 0.55rem;
    filter: none;
  }
}
.lp-page {
  background:
    linear-gradient(165deg, #fbf8f2 0%, #f5f0e6 55%, #f1ebe0 100%);
  color: #1c1b19;
  border-radius: 0;
  box-shadow: none;
  /* ~5% top · ~7% side · extra foot for folio so copy isn’t sliced */
  padding: 4% 6.5% 7%;
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 0.28rem;
  font-family: "Libre Baskerville", Georgia, "Times New Roman", serif;
  aspect-ratio: auto;
  width: 100%;
  height: 100%;
  min-height: 0;
  overflow: hidden;
  box-sizing: border-box;
}
.lp-page.left {
  border-radius: 3px 0 0 3px;
  padding-right: 1.05rem;
  box-shadow: inset -14px 0 22px -18px rgba(40, 28, 12, 0.28);
}
.lp-page.right {
  border-radius: 0 3px 3px 0;
  padding-left: 1.05rem;
  border-left: 1px solid rgba(70, 55, 35, 0.14);
  box-shadow: inset 14px 0 22px -18px rgba(40, 28, 12, 0.22);
  gap: 0.3rem;
  justify-content: flex-start;
}
.lp-page::after {
  content: attr(data-folio);
  position: absolute;
  bottom: 0.45rem;
  font-family: "IBM Plex Mono", ui-monospace, monospace;
  font-size: 0.62rem;
  letter-spacing: 0.04em;
  color: #8a867c;
  z-index: 2;
}
.lp-page-overflow-note {
  position: absolute;
  right: 0.62rem;
  bottom: 0.38rem;
  z-index: 4;
  margin: 0;
  padding: 0.12rem 0.28rem;
  background: #5d4227;
  color: #fffaf1;
  font-family: "IBM Plex Mono", ui-monospace, monospace;
  font-size: 0.43rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  line-height: 1.1;
  text-transform: uppercase;
}
.lp-page-has-overflow::after { opacity: 0.28; }
.lp-page.left::after { left: 1.1rem; }
.lp-page.right::after { right: 1.1rem; }
.lp-mast {
  flex: 0 0 auto;
  display: flex;
  flex-direction: column;
  gap: 0.22rem;
}
.lp-kicker {
  margin: 0;
  font-family: "Source Sans 3", system-ui, sans-serif;
  font-size: 0.58rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #6b6860;
}
.lp-hed {
  margin: 0;
  font-size: clamp(1.55rem, 2.9vw, 2.45rem);
  line-height: 1.04;
  letter-spacing: -0.018em;
  font-weight: 700;
  color: #141210;
}
.lp-stand {
  margin: 0.1rem 0 0;
  font-size: clamp(0.78rem, 1.15vw, 0.95rem);
  line-height: 1.36;
  font-style: italic;
  color: #2a2620;
  max-width: 38em;
}
/* Full page measure: equal columns edge-to-edge under the hero (no right-hand void) */
.lp-flow {
  flex: 1 1 auto;
  align-self: stretch;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  min-height: 0;
  /* Do not clip mid-sentence — page overflow is reported honestly */
  overflow: visible;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  column-gap: 0.85rem;
  margin: 0;
  font-size: 0.6rem;
  line-height: 1.32;
  text-align: left;
  box-sizing: border-box;
}
.lp-col {
  min-width: 0;
  max-width: 100%;
  overflow: visible;
  display: flex;
  flex-direction: column;
  gap: 0;
  justify-content: flex-start;
  box-sizing: border-box;
}
.lp-col > p {
  margin: 0 0 0.28em;
  text-align: justify;
  hyphens: auto;
  -webkit-hyphens: auto;
  text-wrap: pretty;
  flex-shrink: 0;
  max-width: 100%;
  padding-inline: 0.04rem;
  overflow-wrap: break-word;
  color: #1a1815;
}
.lp-col > p:last-child { margin-bottom: 0; }
.lp-col > p:first-of-type {
  padding-left: 0.06rem;
}
.lp-body {
  margin: 0;
  font-size: 0.6rem;
  line-height: 1.32;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  column-gap: 1rem;
  width: 100%;
}
.lp-subhead {
  margin: 0.08rem 0 0.22em;
  font-size: clamp(0.72rem, 1vw, 0.88rem);
  font-weight: 700;
  line-height: 1.15;
  flex-shrink: 0;
  letter-spacing: -0.01em;
}
/* Page-2 continued hed — sits above the wide band */
.lp-page.right > .lp-subhead.lp-continued {
  margin: 0 0 0.2rem;
  font-size: clamp(0.76rem, 1.12vw, 0.94rem);
  line-height: 1.15;
  flex: 0 0 auto;
}
.lp-page.right .lp-flow {
  flex: 1 1 auto;
  min-height: 0;
}
.lp-pullq {
  margin: 0.35em 0;
  padding: 0.3rem 0.15rem 0.3rem 0.65rem;
  border-left: 3px solid rgba(90, 70, 45, 0.55);
  font-size: clamp(0.62rem, 0.86vw, 0.72rem);
  font-style: italic;
  line-height: 1.25;
  color: #1c1915;
  max-width: 100%;
  max-height: 5.2em;
  overflow: hidden;
  box-sizing: border-box;
}
.lp-page-sidebar {
  margin-top: 0.3rem;
  padding: 0.35rem 0.45rem 0.4rem;
  background: #ebe4d8;
  border: none;
  border-top: 2px solid #c4a574;
  border-radius: 0;
  flex: 0 0 auto;
  width: 100%;
  max-height: 27%;
  overflow: visible;
  box-sizing: border-box;
}
.lp-page-sidebar-head { margin: 0 0 0.14rem; font-size: 0.68rem; }
.lp-page-sidebar-copy {
  font-size: 0.55rem;
  line-height: 1.28;
}
.lp-page-sidebar-copy p { margin: 0 0 0.28em; }
.lp-frame {
  position: relative;
  border-radius: 0;
  background: #d8d4cb center 26% / cover no-repeat;
  background-size: cover;
  background-position: center 26%;
  min-height: 2.4rem;
  display: flex;
  align-items: flex-end;
  justify-content: flex-start;
  padding: 0.35rem 0.4rem;
  overflow: hidden;
  flex: 0 0 auto;
  box-sizing: border-box;
  max-width: 100%;
  min-width: 0;
}
.lp-frame.lp-has-photo {
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.08);
}
/* Hero — capped landscape (never viewport-tall) */
.lp-frame.main,
.lp-fs-stage .lp-frame.main {
  width: 100%;
  max-width: 100%;
  flex: 0 0 auto;
  aspect-ratio: 3 / 2;
  height: auto;
  min-height: 0;
  max-height: 38%;
  margin: 0.15rem 0 0.35rem;
}
/* Wide band — secondary beat only */
.lp-frame.wide,
.lp-fs-stage .lp-frame.wide {
  width: 100%;
  flex: 0 0 auto;
  aspect-ratio: 16 / 9;
  height: auto;
  min-height: 0;
  max-height: 18%;
  margin: 0.15rem 0 0.3rem;
}
/* Support / inset — detail frames, not page-spanning */
.lp-frame.support,
.lp-frame.inset,
.lp-frame.support.inset {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  align-self: stretch;
  margin: 0.25em 0 0.35em;
  aspect-ratio: 4 / 3;
  height: auto;
  min-height: 2.2rem;
  max-height: 14%;
  flex: 0 0 auto;
}
/* Empty image frames — quiet InDesign-style placeholders (not prototype hatch) */
.lp-frame.empty {
  border: 1px solid rgba(90, 78, 62, 0.28);
  background:
    linear-gradient(180deg, #f3efe6 0%, #ebe6dc 100%);
  color: #5c564c;
  font-family: "IBM Plex Mono", ui-monospace, monospace;
  font-size: 0.58rem;
  font-weight: 500;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 0.55rem;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.35);
}
.lp-frame-empty-inner {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.2rem;
  width: 100%;
  height: 100%;
  min-height: 3.2rem;
  z-index: 1;
}
.lp-frame-empty-cross {
  position: absolute;
  inset: 12%;
  pointer-events: none;
  opacity: 0.22;
  background:
    linear-gradient(to top right, transparent calc(50% - 0.5px), rgba(70, 60, 48, 0.55) calc(50% - 0.5px), rgba(70, 60, 48, 0.55) calc(50% + 0.5px), transparent calc(50% + 0.5px)),
    linear-gradient(to top left, transparent calc(50% - 0.5px), rgba(70, 60, 48, 0.55) calc(50% - 0.5px), rgba(70, 60, 48, 0.55) calc(50% + 0.5px), transparent calc(50% + 0.5px));
}
.lp-frame-empty-name {
  position: relative;
  font-size: 0.56rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #4a453c;
}
.lp-frame.empty .lp-empty-hint {
  position: relative;
  margin: 0;
  font-family: "Source Sans 3", system-ui, sans-serif;
  font-size: 0.62rem;
  font-weight: 500;
  letter-spacing: 0.01em;
  color: #6e685c;
  opacity: 1;
}
.lp-frame.empty.support,
.lp-frame.empty.inset,
.lp-frame.empty.support.inset {
  min-height: 3.5rem;
  max-height: 16%;
  aspect-ratio: 4 / 3;
}
.lp-frame.empty.main {
  min-height: 5rem;
  max-height: 38%;
}
.lp-frame.empty.wide {
  min-height: 3.5rem;
  max-height: 18%;
}
.lp-frame-tag {
  background: rgba(0, 0, 0, 0.42);
  color: #fff;
  padding: 0.12rem 0.35rem;
  border-radius: 2px;
  font-family: "Source Sans 3", system-ui, sans-serif;
  font-size: 0.5rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  max-width: calc(100% - 1.4rem);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  opacity: 0;
  transition: opacity 0.15s ease;
}
.lp-drag-handle {
  position: absolute;
  top: 0.2rem;
  right: 0.25rem;
  color: rgba(255,255,255,0.85);
  font-size: 0.7rem;
  line-height: 1;
  opacity: 0;
  transition: opacity 0.15s ease;
}
/* Magazine-clean by default; labels appear on hover for editing */
.lp-frame:hover .lp-frame-tag,
.lp-frame:hover .lp-drag-handle,
.lp-frame.empty .lp-frame-tag,
.lp-layout-dragging .lp-frame-tag {
  opacity: 1;
}
.lp-empty-hint { display: block; font-weight: 500; opacity: 0.85; margin-top: 0.2rem; }
.lp-empty-copy {
  margin: 0;
  font-size: 0.72rem;
  color: #8a867c;
  font-style: italic;
}
/*
 * Empty text frames — project InDesign text frames on the page.
 * Hairline box, frame name, quiet “Awaiting copy” — not warning chrome.
 */
.lp-gap {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 0.12rem;
  margin: 0.28rem 0;
  padding: 0.5rem 0.6rem 0.55rem;
  border: 1px solid rgba(70, 60, 48, 0.22);
  border-radius: 0;
  background: rgba(255, 252, 246, 0.55);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.4);
  color: #4a453c;
  font-family: "Source Sans 3", system-ui, sans-serif;
  box-sizing: border-box;
}
.lp-gap::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 2px;
  background: rgba(90, 70, 45, 0.28);
}
.lp-gap-frame {
  font-family: "IBM Plex Mono", ui-monospace, monospace;
  font-size: 0.52rem;
  font-weight: 500;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: #7a7368;
}
.lp-gap-label {
  font-family: "Libre Baskerville", Georgia, "Times New Roman", serif;
  font-size: 0.78rem;
  font-weight: 400;
  font-style: italic;
  letter-spacing: 0;
  text-transform: none;
  color: #2c2924;
  line-height: 1.25;
}
.lp-gap-hint {
  font-size: 0.6rem;
  font-weight: 500;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: #8a8378;
  opacity: 1;
}
.lp-gap-hed {
  min-height: 2.8rem;
  padding-top: 0.65rem;
  padding-bottom: 0.65rem;
}
.lp-gap-hed .lp-gap-label {
  font-size: 1.15rem;
  font-style: normal;
  font-weight: 700;
}
.lp-gap-stand { min-height: 2.35rem; }
.lp-gap-sub { min-height: 1.7rem; }
.lp-gap-pq {
  min-height: 2.6rem;
  width: 100%;
  border-left: none;
  padding-left: 0.85rem;
}
.lp-gap-pq::before {
  width: 3px;
  background: rgba(90, 70, 45, 0.35);
}
.lp-gap-pq .lp-gap-label {
  font-size: 0.92rem;
}
.lp-gap-body { min-height: 5rem; width: 100%; }
.lp-gap-side { min-height: 3.6rem; width: 100%; }
.lp-support-row {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 0.35rem;
  margin-top: 0.4rem;
}
.lp-page-sidebar .lp-gap { margin: 0.25rem 0; background: rgba(255, 252, 246, 0.7); }
.lp-overflow-banner {
  margin: 0.45rem 0 0;
  max-width: none;
  width: 100%;
  padding: 0.35rem 0.55rem;
  border: 1px solid rgba(90, 78, 62, 0.22);
  background: rgba(255, 252, 246, 0.92);
  color: #5c564c;
  font-size: 0.68rem;
  font-family: "Source Sans 3", system-ui, sans-serif;
  border-radius: 0;
  flex-shrink: 0;
}
.lp-label { display: block; font-weight: 600; }
.lp-band { display: block; color: var(--muted); font-family: var(--mono, "IBM Plex Mono", monospace); font-size: 0.62rem; }

/* Legacy inline layout-preview chrome (unused by fullscreen path) */
.layout-preview {
  margin: 0.65rem 0 0;
  padding: 0.45rem 0.55rem 0.55rem;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--surface);
}
.layout-preview-head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.35rem 0.75rem;
  margin-bottom: 0.4rem;
  font-size: 0.8rem;
}
.layout-preview-head .mini { color: var(--muted); }
.layout-preview-stage {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  min-height: 4.5rem;
}

.create-fit-miss .chip { border-color: var(--warn-border); color: var(--warn); }

.improve-board {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 0.65rem;
  margin-top: 0.35rem;
}
@media (max-width: 900px) {
  .improve-board { grid-template-columns: 1fr; }
}
.improve-col {
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--surface);
  padding: 0.45rem 0.5rem 0.55rem;
  min-height: 8rem;
}
.improve-col h3 {
  margin: 0 0 0.4rem;
  font-size: 0.82rem;
  font-weight: 600;
}
.improve-col ul { margin: 0; padding: 0; list-style: none; }
.improve-card {
  border: 1px solid var(--border);
  border-radius: 6px;
  padding: 0.4rem 0.45rem;
  margin-bottom: 0.4rem;
  background: var(--bg, transparent);
  font-size: 0.8rem;
}
.improve-card .chip-row { margin-top: 0.35rem; gap: 0.25rem; }
.yn-flash {
  display: inline-block;
  min-width: 1.6rem;
  text-align: center;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.yn-flash.y { color: var(--ok); }
.yn-flash.n { color: var(--warn); }

/* Create desk fills the viewport — no clipped top / dead bottom */
html:has(body[data-mfp2-page="create.html"]) {
  height: 100%;
}
body[data-mfp2-page="create.html"] {
  height: 100%;
  overflow: hidden;
}
body[data-mfp2-page="create.html"] .shell {
  height: 100%;
  max-height: 100dvh;
  overflow: hidden;
  align-items: stretch;
}
body[data-mfp2-page="create.html"] .shell > .side {
  height: 100%;
  max-height: 100dvh;
  overflow-y: auto;
}
body[data-mfp2-page="create.html"] .main {
  padding: 0.4rem 0.75rem 0.3rem;
  display: flex;
  flex-direction: column;
  min-height: 0;
  height: 100%;
  max-height: 100%;
  overflow: hidden;
}
body[data-mfp2-page="create.html"] .mfp2-crumbs-host {
  display: none !important;
}
body[data-mfp2-page="create.html"] .mfp2-focus {
  margin: 0 0 0.35rem;
  padding: 0.3rem 0.55rem;
  font-size: 0.78rem;
}
body[data-mfp2-page="create.html"] .mfp2-crumbs {
  margin: 0 0 0.3rem;
  font-size: 0.72rem;
}
body[data-mfp2-page="create.html"] .flash {
  margin: 0 0 0.35rem;
}
body[data-mfp2-page="create.html"] .mfp2-editor {
  /* legacy; desk now uses .create-desk-panel */
  display: contents;
}
body[data-mfp2-page="create.html"] #panel-desk.create-desk-panel {
  flex: 1;
  min-height: 0;
}
body[data-mfp2-page="create.html"] .mfp2-editor-form {
  padding: 0.4rem 0.65rem 0.75rem;
}
body[data-mfp2-page="create.html"] .mfp2-editor-meta {
  margin-bottom: 0.25rem;
  padding: 0.25rem 0.4rem;
  font-size: 0.75rem;
}
body[data-mfp2-page="create.html"] .create-brief-strip {
  margin-top: 0.25rem;
  padding: 0.3rem 0.4rem;
  font-size: 0.72rem;
}
body[data-mfp2-page="create.html"] .create-brand-enrich {
  margin: 0.15rem 0 0.3rem;
  padding: 0.25rem 0.4rem;
  font-size: 0.72rem;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: color-mix(in srgb, var(--accent) 6%, var(--surface));
  color: var(--text);
}
body[data-mfp2-page="create.html"] .create-brand-enrich[hidden] {
  display: none;
}
body[data-mfp2-page="create.html"] #desk-gate {
  margin: 0.15rem 0 0.3rem;
  font-size: 0.72rem;
}
body[data-mfp2-page="create.html"] .create-steps {
  margin: 0 0 0.3rem;
  gap: 0.25rem;
}
body[data-mfp2-page="create.html"] .create-step {
  font-size: 0.72rem;
  padding: 0.28rem 0.55rem;
}
body[data-mfp2-page="create.html"] .mfp2-form-field {
  margin-bottom: 0.5rem;
}
body[data-mfp2-page="create.html"] .mfp2-form-field .mfp2-field-label,
body[data-mfp2-page="create.html"] .mfp2-form-field > span:first-child {
  font-size: 0.78rem;
  margin-bottom: 0.15rem;
}
/* Autosize BA fields even if data-mfp2-page is late */
textarea.ba-autosize {
  display: block;
  width: 100%;
  box-sizing: border-box;
  overflow: hidden !important;
  resize: none !important;
  white-space: pre-wrap;
  line-height: 1.45;
  min-height: 0;
  max-height: none !important;
}
textarea.ba-autosize[data-key="body1"] { min-height: 6.5rem; }
textarea.ba-autosize[data-key="body2"] { min-height: 3.5rem; }
/* Short fields must not inherit body min-heights */
textarea.ba-autosize[data-key="title"],
textarea.ba-autosize[data-key="standfirst"],
textarea.ba-autosize[data-key="subtitle1"],
textarea.ba-autosize[data-key="subtitle2"],
textarea.ba-autosize[data-key="pullquote1"],
textarea.ba-autosize[data-key="pullquote2"] {
  min-height: 0 !important;
}

/* Create desk tidy — denser chrome, essential actions first */
body[data-mfp2-page="create.html"] .create-top {
  gap: 0.35rem 0.75rem;
  padding-bottom: 0.35rem;
  margin-bottom: 0.35rem;
}
body[data-mfp2-page="create.html"] .create-top h1 {
  font-size: 1.25rem;
  margin: 0;
}
body[data-mfp2-page="create.html"] .desk-nav-link {
  font-size: 0.75rem;
  padding: 0.12rem 0.35rem;
}
body[data-mfp2-page="create.html"] .desk-nav-quiet {
  background: none;
  border: 1px solid var(--border);
  border-radius: 4px;
  cursor: pointer;
  color: var(--muted);
}
body[data-mfp2-page="create.html"] .desk-nav-danger {
  background: none;
  border: 1px solid color-mix(in srgb, var(--warn, #c0392b) 55%, var(--border));
  border-radius: 4px;
  cursor: pointer;
  color: var(--warn, #c0392b);
}
body[data-mfp2-page="create.html"] .desk-toolbar-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem;
}
body[data-mfp2-page="create.html"] .desk-wf-btns {
  gap: 0.25rem;
}
body[data-mfp2-page="create.html"] .desk-wf-btns .create-mode {
  font-size: 0.75rem;
  padding: 0.21rem 0.55rem;
}
body[data-mfp2-page="create.html"] .desk-wf-primary {
  /* Action confirm is flash-on-click — not a permanent blue outline */
  border-color: var(--border) !important;
  color: var(--muted2, var(--text)) !important;
  font-weight: 650;
}
body[data-mfp2-page="create.html"] .desk-more {
  position: relative;
  font-size: 0.72rem;
}
body[data-mfp2-page="create.html"] .desk-more > summary {
  cursor: pointer;
  color: var(--muted);
  list-style: none;
  padding: 0.28rem 0.45rem;
}
body[data-mfp2-page="create.html"] .desk-more > summary::-webkit-details-marker { display: none; }
body[data-mfp2-page="create.html"] .desk-more-menu {
  position: absolute;
  right: 0;
  top: 100%;
  z-index: 5;
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  min-width: 8rem;
  padding: 0.35rem;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--surface);
  box-shadow: 0 6px 18px rgba(0,0,0,0.08);
}
body[data-mfp2-page="create.html"] .desk-more-menu .create-mode {
  font-size: 0.72rem;
  padding: 0.28rem 0.45rem;
  text-align: left;
  text-decoration: none;
}
body[data-mfp2-page="create.html"] .desk-article-head {
  padding: 0.35rem 0.55rem 0.25rem;
}
body[data-mfp2-page="create.html"] .desk-article-title {
  font-size: 1.05rem;
  margin: 0.1rem 0 0;
  line-height: 1.25;
}
body[data-mfp2-page="create.html"] .desk-article-kicker,
body[data-mfp2-page="create.html"] .desk-head-meta {
  font-size: 0.68rem;
}
body[data-mfp2-page="create.html"] .create-desk-left .mfp2-editor-form {
  padding: 0.3rem 0.55rem 0.65rem;
}
body[data-mfp2-page="create.html"] .mfp2-form-field {
  margin-bottom: 0.4rem;
}
body[data-mfp2-page="create.html"] .mfp2-form-field input,
body[data-mfp2-page="create.html"] .mfp2-form-field textarea,
body[data-mfp2-page="create.html"] .mfp2-form-field select {
  font-size: 0.88rem;
  padding: 0.35rem 0.45rem;
}
body[data-mfp2-page="create.html"] .mfp2-form-field .mfp2-field-label,
body[data-mfp2-page="create.html"] .mfp2-form-field > span:first-child {
  font-size: 0.68rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  color: var(--muted);
}
body[data-mfp2-page="create.html"] .sw-widget-tools {
  padding: 0.15rem 0.3rem;
  gap: 0.2rem;
}
body[data-mfp2-page="create.html"] .sw-widget .ea-tool,
body[data-mfp2-page="create.html"] button.ea-tool {
  font-size: 0.68rem;
  padding: 0.18rem 0.4rem;
}
body[data-mfp2-page="create.html"] .ea-tools-more {
  font-size: 0.68rem;
}
body[data-mfp2-page="create.html"] .ea-tools-more > summary {
  cursor: pointer;
  color: var(--muted);
  padding: 0.18rem 0.35rem;
  list-style: none;
  white-space: nowrap;
}
body[data-mfp2-page="create.html"] .ea-tools-more > summary::-webkit-details-marker { display: none; }
body[data-mfp2-page="create.html"] .ea-tools-more[open] > summary { color: var(--accent); }
body[data-mfp2-page="create.html"] .ea-tools-more .ea-tools {
  display: flex;
  flex-wrap: wrap;
  gap: 0.15rem;
  padding: 0.15rem 0 0.1rem;
}
body[data-mfp2-page="create.html"] .sw-widget-foot {
  padding: 0.2rem 0.35rem;
  gap: 0.35rem;
}
body[data-mfp2-page="create.html"] .sw-widget-foot .btn,
body[data-mfp2-page="create.html"] .sw-widget-foot .btn-ghost {
  font-size: 0.72rem;
  padding: 0.22rem 0.5rem;
}
body[data-mfp2-page="create.html"] .create-ready-actions {
  gap: 0.3rem;
}
body[data-mfp2-page="create.html"] .desk-ready-more {
  margin-top: 0.45rem;
  font-size: 0.75rem;
}
body[data-mfp2-page="create.html"] .desk-ready-more > summary {
  cursor: pointer;
  color: var(--muted);
}
body[data-mfp2-page="create.html"] .create-desk-panel {
  height: calc(100vh - 6.5rem);
  max-height: calc(100vh - 6.5rem);
}

.sw-widget-instr {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem 0.5rem;
  padding: 0.25rem 0.45rem;
}
.sw-widget-instr > label {
  font-size: 0.68rem;
  color: var(--muted);
  flex-shrink: 0;
}
.sw-instr-wrap {
  position: relative;
  flex: 1;
  min-width: 12rem;
  display: block;
}
.sw-instr-wrap #sw-instruction {
  width: 100%;
  box-sizing: border-box;
  padding-right: 2.2rem;
  height: 1.85rem;
  margin: 0;
}
.sw-instr-wrap .sw-go-send {
  right: 0.28rem;
  bottom: 0.18rem;
  width: 1.45rem;
  height: 1.45rem;
}
/* Quiet Accept — not a giant primary CTA */
.sw-widget-foot .ea-batch #sw-accept-all.btn {
  background: transparent;
  color: var(--text);
  border: 1px solid var(--border);
  font-weight: 600;
}
.sw-widget-foot .ea-batch #sw-accept-all.btn:hover:not(:disabled) {
  border-color: var(--accent);
  color: var(--accent);
}
.mfp2-chat-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem 0.65rem;
  padding: 0.25rem 0.45rem 0.15rem;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
  flex-shrink: 0;
}
.mfp2-chat-toolbar .mini {
  margin-right: auto;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-size: 0.65rem;
}
body[data-mfp2-page="create.html"] #rail-chat:not([hidden]) {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
}
body[data-mfp2-page="create.html"] textarea.ba-just-filled,
body[data-mfp2-page="create.html"] input.ba-just-filled {
  outline: 2px solid var(--accent, #2a6);
  outline-offset: 2px;
  background: color-mix(in srgb, var(--accent, #2a6) 8%, var(--input-bg, #fff));
}
.ba-on-form-banner {
  margin: 0.35rem 0 0.5rem;
  padding: 0.4rem 0.55rem;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--accent-dim, color-mix(in srgb, var(--accent, #2a6) 12%, transparent));
  line-height: 1.35;
}
.ba-on-form-banner[hidden] { display: none !important; }
.ba-on-form-banner .chat-draft-act {
  margin-left: 0.25rem;
}
body.create-page .mfp2-erail-head,
.nb-rail > .mfp2-erail-head[hidden] {
  display: none !important;
}
body.create-page .nb-rail-tabs {
  align-items: center;
  padding: 0.4rem 0.5rem;
}
body.create-page .nb-rail-tabs .nb-refs-icon {
  margin-left: auto;
}
body.create-page .nb-rail .mfp2-erail-body {
  padding-top: 0;
}
body.create-page .nb-chat-context {
  padding: 0.4rem 0.5rem 0.35rem;
}
/* Quiet references affordance — only when sources are ticked */
.nb-refs-icon {
  appearance: none;
  margin: 0 0 0 auto;
  padding: 0.2rem;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: color-mix(in srgb, var(--muted) 70%, transparent);
  cursor: pointer;
  line-height: 0;
  flex-shrink: 0;
  opacity: 0.55;
  transition: opacity 0.12s ease, color 0.12s ease, background 0.12s ease;
}
.nb-refs-icon:hover,
.nb-refs-icon:focus-visible {
  opacity: 1;
  color: var(--muted);
  background: color-mix(in srgb, var(--text) 5%, transparent);
  outline: none;
}
.nb-refs-icon[hidden] {
  display: none !important;
}
.citations-sheet {
  position: fixed;
  inset: 0;
  z-index: 1400;
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
  padding: 1rem;
  background: color-mix(in srgb, #1a1814 28%, transparent);
}
.citations-sheet[hidden] {
  display: none !important;
}
.citations-card {
  width: min(22rem, 100%);
  max-height: min(70vh, 28rem);
  display: flex;
  flex-direction: column;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 12px;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.14);
  overflow: hidden;
}
.citations-head {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.65rem 0.75rem;
  border-bottom: 1px solid var(--border);
}
.citations-head h3 {
  margin: 0;
  flex: 1;
  font-size: 0.88rem;
  font-weight: 650;
}
.citations-list {
  list-style: none;
  margin: 0;
  padding: 0.35rem 0.5rem;
  overflow-y: auto;
  flex: 1 1 auto;
}
.citations-item {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 0.25rem;
  align-items: start;
  padding: 0.35rem 0.25rem;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 65%, transparent);
}
.citations-item:last-child {
  border-bottom: 0;
}
.citations-open {
  display: grid;
  grid-template-columns: 1.25rem 1fr;
  gap: 0.35rem;
  align-items: start;
  border: 0;
  background: transparent;
  padding: 0;
  margin: 0;
  text-align: left;
  cursor: pointer;
  font: inherit;
  color: inherit;
  min-width: 0;
}
.citations-num {
  font-size: 0.68rem;
  color: var(--muted);
  padding-top: 0.15rem;
}
.citations-body {
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
  min-width: 0;
}
.citations-title {
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--text);
  line-height: 1.3;
}
.citations-open:hover .citations-title {
  color: var(--accent);
}
.citations-meta {
  font-size: 0.68rem;
  color: var(--muted);
}
.citations-ext {
  font-size: 0.75rem;
  color: var(--muted);
  text-decoration: none;
  padding: 0.15rem 0.25rem;
}
.citations-ext:hover {
  color: var(--accent);
}
.citations-acts {
  display: flex;
  gap: 0.35rem;
  padding: 0.45rem 0.75rem 0.65rem;
  border-top: 1px solid var(--border);
}
.citations-acts .btn-ghost {
  font-size: 0.72rem;
}
body[data-mfp2-page="create.html"] .mfp2-editor-rail {
  min-height: 0;
}
body[data-mfp2-page="create.html"] .mfp2-chat-log {
  min-height: 0;
  max-height: none;
  flex: 1;
}
body[data-mfp2-page="create.html"] .mfp2-erail-body {
  overflow: hidden;
}
.mfp2-erail-body .hint {
  flex-shrink: 0;
  margin: 0;
  font-size: 0.68rem;
  color: var(--muted);
  line-height: 1.3;
}
body[data-mfp2-page="create.html"] #rail-compose:not([hidden]) {
  display: flex !important;
  flex-direction: column;
  flex-shrink: 0;
  box-shadow: none;
  position: relative;
}
body[data-mfp2-page="create.html"] #rail-chat:not([hidden]) {
  display: flex;
  flex: 1;
  min-height: 0;
}
/* Research FAB duplicates the AI panel on Create — hide it so chat compose stays clear */
body[data-mfp2-page="create.html"] #mfp2-rail-fab,
body[data-mfp2-page="create.html"] #mfp2-theme-fab,
body[data-mfp2-page="create.html"] #mfp2-research-rail {
  display: none !important;
}
body[data-mfp2-page="create.html"].mfp2-rail-open .shell > .main {
  margin-right: 0 !important;
}
/* Desk fills remaining viewport under crumbs so chat compose never clips */
body[data-mfp2-page="create.html"] .shell > .main {
  display: flex;
  flex-direction: column;
  height: 100dvh;
  max-height: 100dvh;
  overflow: hidden;
  padding-top: 0.65rem;
  padding-bottom: 0.5rem;
  box-sizing: border-box;
}
body[data-mfp2-page="create.html"] .mfp2-crumbs-host {
  flex-shrink: 0;
}
/* Keep Create chrome (Articles / Desk / Issue / Brief) clickable — never crush under the desk */
body[data-mfp2-page="create.html"] .create-top,
body[data-mfp2-page="create.html"] .flash {
  flex-shrink: 0;
  position: relative;
  z-index: 20;
}
body[data-mfp2-page="create.html"] .desk-nav-links {
  display: inline-flex;
  align-items: center;
  gap: 0.2rem;
}
body[data-mfp2-page="create.html"] .desk-nav-links[hidden] {
  display: none !important;
}
body[data-mfp2-page="create.html"] #panel-list.create-list-panel {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
}
body[data-mfp2-page="create.html"] #panel-desk.create-desk-panel {
  flex: 1 1 0;
  min-height: 0;
  height: auto !important;
  max-height: none !important;
}
body[data-mfp2-page="create.html"] .create-desk-left {
  min-height: 0;
  height: 100%;
  overflow: hidden;
}
body[data-mfp2-page="create.html"] .create-desk-left .desk-article-head {
  flex-shrink: 0;
}
body[data-mfp2-page="create.html"] .create-desk-left .mfp2-editor-form {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  padding-bottom: 0.35rem;
}
body[data-mfp2-page="create.html"] .craft-chrome,
body[data-mfp2-page="create.html"] .desk-meta-fold,
body[data-mfp2-page="create.html"] .ba-on-form-banner,
body[data-mfp2-page="create.html"] .create-basis,
body[data-mfp2-page="create.html"] .create-refs {
  flex-shrink: 0;
}
/* Active craft panel fills remaining left column */
body[data-mfp2-page="create.html"] .mfp2-act.on[data-panel="md"],
body[data-mfp2-page="create.html"] #panel-md.mfp2-act.on {
  display: flex !important;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
  overflow: hidden;
}
body[data-mfp2-page="create.html"] #panel-md .create-panel-hint,
body[data-mfp2-page="create.html"] #panel-md .chip-row {
  flex-shrink: 0;
}
body[data-mfp2-page="create.html"] #panel-md .md-editor {
  flex: 1 1 auto;
  min-height: 0;
  height: auto;
  resize: none;
  overflow: auto;
}
body[data-mfp2-page="create.html"] .mfp2-act.on[data-panel="text"] {
  display: flex !important;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
}
body[data-mfp2-page="create.html"] .mfp2-act.on[data-panel="images"],
body[data-mfp2-page="create.html"] .mfp2-act.on[data-panel="ready"] {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
}
body[data-mfp2-page="create.html"] .mfp2-editor-rail {
  min-height: 0;
  overflow: hidden;
}

.source-pick .source-item {
  display: grid;
  grid-template-columns: 6.5rem 1fr;
  gap: 0.5rem;
  align-items: start;
  padding: 0.55rem 0;
  border-bottom: 1px solid var(--border);
}
.source-pick .source-item.on { background: var(--accent-dim); margin: 0 -0.4rem; padding-left: 0.4rem; padding-right: 0.4rem; border-radius: 6px; }
.source-toggle {
  font: inherit;
  font-size: 0.72rem;
  font-weight: 600;
  padding: 0.35rem 0.45rem;
  border-radius: 6px;
  border: 1px solid var(--border);
  background: var(--input-bg);
  color: var(--text);
  cursor: pointer;
}
.source-item.on .source-toggle {
  border-color: var(--accent);
  background: var(--accent-dim);
}
.draft-blocks { display: flex; flex-direction: column; gap: 0.75rem; margin-top: 0.75rem; }
.draft-block {
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
  padding: 0.55rem 0.65rem 0.65rem;
}
.draft-block.locked {
  border-color: var(--warn-border);
  background: var(--warn-bg);
}
.draft-block-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.4rem;
  margin-bottom: 0.35rem;
}
.draft-block textarea {
  width: 100%;
  font: inherit;
  font-size: 0.9rem;
  line-height: 1.45;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--input-bg);
  color: var(--text);
  padding: 0.5rem 0.55rem;
  resize: vertical;
}
.draft-block.locked textarea { border-color: var(--warn-border); }

/* ——— Create desk: form (⅔) | splitter | research (⅓) — user-resizable ——— */
.create-desk-panel {
  --desk-rail-pct: 33.333%;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 7px minmax(240px, var(--desk-rail-pct));
  grid-template-rows: minmax(0, 1fr);
  align-items: stretch;
  gap: 0;
  flex: 1;
  min-height: 0;
  height: calc(100vh - 7.25rem);
  max-height: calc(100vh - 7.25rem);
  border: 1px solid var(--border);
  border-radius: 10px;
  overflow: hidden;
  background: var(--bg);
}
.create-desk-left {
  display: flex;
  flex-direction: column;
  grid-row: 1;
  grid-column: 1;
  min-width: 0;
  min-height: 0;
  height: 100%;
  overflow: hidden;
  z-index: 0;
}
.create-desk-left .sw-widget-wrap {
  flex-shrink: 0;
}
.create-desk-left .mfp2-editor-form {
  flex: 1;
  min-height: 0;
  overflow: auto;
  padding: 0.4rem 0.65rem 0.75rem;
}
button.desk-split,
.desk-split {
  appearance: none;
  grid-row: 1;
  grid-column: 2;
  position: relative;
  z-index: 2;
  width: 7px;
  min-width: 7px;
  margin: 0;
  padding: 0 !important;
  border: 0;
  border-left: 1px solid var(--border);
  border-right: 1px solid var(--border);
  border-radius: 0;
  background: var(--surface) !important;
  color: transparent !important;
  font-size: 0;
  line-height: 0;
  box-shadow: none;
  filter: none !important;
  cursor: col-resize;
  touch-action: none;
  user-select: none;
}
.desk-split::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 3px;
  height: 2.25rem;
  transform: translate(-50%, -50%);
  border-radius: 2px;
  background: color-mix(in srgb, var(--muted) 55%, transparent);
  pointer-events: none;
}
.desk-split:hover,
.desk-split:focus-visible,
body.desk-splitting .desk-split {
  background: color-mix(in srgb, var(--accent) 18%, var(--surface));
  outline: none;
}
.desk-split:hover::after,
.desk-split:focus-visible::after,
body.desk-splitting .desk-split::after {
  background: var(--accent);
}
body.desk-splitting {
  cursor: col-resize;
  user-select: none;
}
body.desk-splitting iframe,
body.desk-splitting textarea,
body.desk-splitting input {
  pointer-events: none;
}
.create-desk-panel .mfp2-editor-rail {
  grid-row: 1;
  grid-column: 3;
  align-self: stretch;
  min-width: 0;
  min-height: 0;
  height: 100%;
  max-height: 100%;
  display: flex;
  flex-direction: column;
  background: var(--surface);
  overflow: hidden;
}
#desk-blank.desk-blank:not([hidden]) {
  grid-column: 1 / -1;
  grid-row: 1;
  z-index: 4;
  align-self: stretch;
  background: var(--bg);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
@media (max-width: 900px) {
  .create-desk-panel {
    grid-template-columns: 1fr;
    height: auto;
    min-height: 70vh;
  }
  .desk-split { display: none; }
  .create-desk-left { border-right: 0; border-bottom: 1px solid var(--border); }
  .create-desk-panel .mfp2-editor-rail {
    grid-column: 1;
    min-height: 320px;
  }
}

/* Research image gallery — compact thumbs, 2–4 across */
.mfp2-img-gallery,
.mfp2-rail-img-gallery {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(4.75rem, 1fr));
  gap: 0.35rem;
  list-style: none;
  padding: 0;
  margin: 0.25rem 0 0.65rem;
}
.rail-gallery-card,
.mfp2-rail-img-card {
  position: relative;
  display: flex;
  flex-direction: column;
  margin: 0;
  padding: 0;
  border: 1px solid var(--border);
  border-radius: 6px;
  overflow: hidden;
  background: var(--surface);
  cursor: pointer;
  transition: border-color 0.12s, box-shadow 0.12s;
}
.rail-gallery-card:hover,
.mfp2-rail-img-card:hover {
  border-color: color-mix(in srgb, var(--accent) 45%, var(--border));
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06);
}
.rail-gallery-card.rg-selected,
.mfp2-rail-img-card.rg-selected {
  border-color: var(--accent);
  box-shadow: 0 0 0 1px var(--accent);
}
.rail-gallery-card .rg-thumb,
.mfp2-rail-img-card .rg-thumb {
  aspect-ratio: 1;
  overflow: hidden;
  background: color-mix(in srgb, var(--muted) 10%, var(--surface));
}
.rail-gallery-card img,
.mfp2-rail-img-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.rg-check {
  display: none;
  position: absolute;
  top: 3px;
  right: 3px;
  z-index: 2;
  background: var(--accent);
  color: #fff;
  border-radius: 50%;
  width: 15px;
  height: 15px;
  font-size: 9px;
  font-weight: 700;
  align-items: center;
  justify-content: center;
  line-height: 1;
}
.rail-gallery-card.rg-selected .rg-check,
.mfp2-rail-img-card.rg-selected .rg-check {
  display: flex;
}
.rg-ph {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--muted);
}
.rail-gallery-cap,
.mfp2-rail-img-cap {
  padding: 0.28rem 0.3rem 0.35rem;
  font-size: 0.62rem;
  line-height: 1.3;
  color: var(--muted);
  word-break: break-word;
}
.rail-gallery-cap strong,
.mfp2-rail-img-cap strong {
  display: inline;
  font-weight: 600;
  color: var(--text);
  font-size: 0.62rem;
}
.rail-gallery-cap .rg-more,
.mfp2-rail-img-cap .rg-more {
  color: var(--accent);
  font-weight: 600;
  margin-left: 0.15rem;
}
.rail-gallery-overlay { display: none; } /* legacy hover overlay unused */
.rgo-meta {
  display: block;
  font-size: 0.55rem;
  opacity: 0.8;
  margin-top: 0.12rem;
  color: var(--muted);
}
.rail-img-place-bar {
  display: none;
  align-items: center;
  gap: 0.5rem;
  padding: 0.35rem 0.4rem;
  background: color-mix(in srgb, var(--accent) 8%, var(--bg));
  border: 1px solid color-mix(in srgb, var(--accent) 25%, transparent);
  border-radius: 5px;
  position: sticky;
  top: 0;
  z-index: 10;
  margin-bottom: 0.4rem;
}
.rail-img-place-bar.rg-active { display: flex; }
.mfp2-rail-results li.mfp2-rail-gallery-wrap {
  padding: 0;
  border-bottom: 0;
}
.mfp2-erail-results > li:has(.mfp2-img-gallery) {
  padding: 0;
  border-bottom: 0;
}
.mfp2-erail-results > li:has(.rail-gallery-section-head) {
  list-style: none;
}

/* Global floating research rail — left-edge resize */
.mfp2-rail-resize {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  width: 7px;
  margin-left: -3px;
  cursor: col-resize;
  z-index: 5;
  touch-action: none;
  background: transparent;
}
.mfp2-rail-resize::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 3px;
  height: 2.25rem;
  transform: translate(-50%, -50%);
  border-radius: 2px;
  background: color-mix(in srgb, var(--muted) 45%, transparent);
  pointer-events: none;
}
.mfp2-rail-resize:hover::after,
body.mfp2-rail-resizing .mfp2-rail-resize::after {
  background: var(--accent);
}
body.mfp2-rail-resizing {
  cursor: col-resize;
  user-select: none;
}
body.mfp2-rail-resizing iframe,
body.mfp2-rail-resizing textarea,
body.mfp2-rail-resizing input {
  pointer-events: none;
}
.sw-widget-wrap {
  flex-shrink: 0;
}
.sw-widget {
  border: 0;
  border-bottom: 1px solid var(--border);
  border-radius: 0;
  background: var(--bg);
  overflow: hidden;
}
.sw-widget-head {
  display: none; /* chrome folded into tools row */
}
.sw-widget-title h2 {
  margin: 0;
  font-family: var(--display);
  font-size: 0.88rem;
  font-weight: 700;
  letter-spacing: -0.01em;
  line-height: 1.2;
}
.sw-widget-title h2 span {
  color: var(--accent);
  font-style: italic;
  font-weight: 400;
}
.sw-widget-chrome {
  display: flex;
  align-items: center;
  gap: 0.25rem;
}
.sw-widget-chrome .icon-btn,
.sw-widget-tools .icon-btn {
  appearance: none;
  height: 1.35rem;
  min-width: 1.35rem;
  padding: 0 0.3rem;
  border-radius: 6px;
  border: 1px solid var(--border);
  background: var(--bg);
  color: var(--muted);
  cursor: pointer;
  font: inherit;
  font-size: 0.65rem;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.sw-widget-chrome .icon-btn:disabled,
.sw-widget-tools .icon-btn:disabled { opacity: 0.3; cursor: default; }
.sw-widget-chrome .icon-btn:hover:not(:disabled),
.sw-widget-tools .icon-btn:hover:not(:disabled) {
  border-color: var(--accent);
  color: var(--accent);
}
.sw-widget-chrome select,
.sw-widget-tools select {
  font: inherit;
  font-size: 0.62rem;
  font-weight: 600;
  height: 1.35rem;
  padding: 0 0.15rem;
  border-radius: 4px;
  border: 1px solid var(--border);
  background: var(--bg);
  color: var(--muted);
}
.sw-widget .ea-save {
  font-family: var(--mono);
  font-size: 0.55rem;
  color: var(--muted);
}
.sw-widget .ea-save.ok { color: var(--ok); }
.sw-widget-tools {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.15rem 0.2rem;
  padding: 0.2rem 0.4rem;
  border-bottom: 1px solid var(--border);
  background: var(--surface);
}
.sw-widget .ea-tools {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.15rem;
  flex: 1;
  min-width: 0;
}
.sw-widget .ea-tool,
button.ea-tool {
  appearance: none;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  padding: 0.16rem 0.35rem !important;
  border-radius: 4px;
  border: 1px solid var(--border);
  background: var(--bg) !important;
  color: var(--text) !important;
  font: inherit;
  font-size: 0.62rem;
  font-weight: 600;
  white-space: nowrap;
  filter: none !important;
}
.sw-widget .ea-tool:hover {
  border-color: var(--accent);
  background: color-mix(in srgb, var(--accent) 6%, var(--bg));
}
.sw-widget .ea-tool.primary {
  background: var(--text);
  color: var(--bg);
  border-color: var(--text);
}
.sw-widget .ea-tool.busy {
  border-color: var(--accent);
  color: var(--accent);
}
.sw-widget .ea-mic {
  appearance: none;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  margin-left: auto;
  height: 1.65rem;
  padding: 0 0.55rem;
  border-radius: 4px;
  border: 1px solid var(--text);
  background: var(--text);
  color: var(--bg);
  font: inherit;
  font-size: 0.68rem;
  font-weight: 700;
  flex-shrink: 0;
}
.sw-widget .ea-mic svg { width: 0.85rem; height: 0.85rem; }
.sw-widget .ea-mic:hover {
  background: color-mix(in srgb, var(--text) 88%, var(--accent));
  border-color: var(--text);
  color: var(--bg);
  filter: none;
}
/* Language cycle — same quiet chrome as tools (never solid accent) */
.sw-widget .sw-lang-btn,
button.sw-lang-btn {
  appearance: none;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2rem;
  height: 1.65rem;
  padding: 0 0.4rem !important;
  border-radius: 6px;
  border: 1px solid var(--border);
  background: var(--bg) !important;
  color: var(--text) !important;
  font: inherit;
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  filter: none !important;
}
.sw-widget .sw-lang-btn:hover,
button.sw-lang-btn:hover {
  border-color: var(--accent);
  background: var(--accent-dim) !important;
  color: var(--text) !important;
}
.sw-widget-instr {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 0.35rem 0.5rem;
  align-items: center;
  padding: 0.22rem 0.45rem;
  border-bottom: 1px solid var(--border);
}
.sw-widget-instr label {
  font-size: 0.68rem;
  font-weight: 700;
  color: var(--muted);
  margin: 0;
  white-space: nowrap;
}
.sw-widget-instr input {
  width: 100%;
  box-sizing: border-box;
  font: inherit;
  font-size: 0.78rem;
  padding: 0.28rem 2.1rem 0.28rem 0.45rem;
  border: 1px solid var(--border);
  border-radius: 4px;
  background: var(--input-bg, var(--bg));
  color: var(--text);
  margin: 0;
  height: 1.85rem;
}
.sw-widget-foot {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem 0.65rem;
  padding: 0.18rem 0.45rem 0.22rem;
  font-size: 0.65rem;
}
.sw-widget-foot .scope { flex: 1; min-width: 8rem; color: var(--muted); }
.sw-widget-foot .scope strong { color: var(--text); font-weight: 700; }
.sw-widget-foot .legend {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  color: var(--muted);
  font-size: 0.6rem;
}
.sw-widget-foot .legend i {
  display: inline-block;
  width: 0.45rem;
  height: 0.45rem;
  border-radius: 1px;
  border: 1px solid var(--border);
  margin-right: 0.12rem;
  vertical-align: 0;
}
.sw-widget-foot .sw-human { background: var(--text); }
.sw-widget-foot .sw-del { background: var(--neg); }
.sw-widget-foot .sw-add { background: var(--ok); }
.sw-widget-foot .sw-ai { background: var(--accent); }
.sw-widget-foot .ea-batch {
  display: flex;
  gap: 0.25rem;
  margin-left: auto;
}
.sw-widget-foot .ea-batch .btn,
.sw-widget-foot .ea-batch .btn-ghost {
  font-size: 0.65rem;
  padding: 0.18rem 0.4rem;
  line-height: 1.2;
}
.sw-pending-note {
  font-size: 0.72rem;
  font-style: italic;
  color: var(--muted);
  margin: 0.2rem 0 0;
}
.sw-field-pending {
  outline: 1px dashed color-mix(in srgb, var(--accent) 45%, var(--border));
  outline-offset: 2px;
  border-radius: 4px;
}
body[data-mfp2-page="create.html"] .mfp2-editor {
  display: contents;
}
@media (max-width: 900px) {
  body[data-mfp2-page="create.html"] .create-desk-panel {
    grid-template-columns: 1fr;
    height: auto;
    min-height: 70vh;
  }
  body[data-mfp2-page="create.html"] .desk-split { display: none; }
  body[data-mfp2-page="create.html"] .mfp2-editor-rail {
    grid-column: 1;
    border-left: 0;
    border-top: 1px solid var(--border);
    min-height: 280px;
  }
}
body[data-mfp2-page="create.html"] .create-desk-left .mfp2-editor-form {
  order: 1;
  min-width: 0;
  overflow: auto;
}
body[data-mfp2-page="create.html"] .mfp2-editor-rail {
  order: unset;
  grid-column: 3;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
}

/* ═══════════════════════════════════════════════════════════════
   JOURNEY PIPELINE — visual workflow strip (Jul 2026)
   Renders in .mfp2-crumbs-host via crumbsHtml()
════════════════════════════════════════════════════════════════ */
.mfp2-pipeline {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0;
  padding: 0.45rem 0 0.55rem;
  overflow-x: auto;
  scrollbar-width: none;
}
.mfp2-pipeline::-webkit-scrollbar { display: none; }
.mfp2-ps {
  display: flex;
  align-items: center;
  gap: 0.28rem;
  font-size: 0.69rem;
  font-weight: 500;
  color: var(--muted);
  text-decoration: none;
  padding: 0.18rem 0.55rem;
  border-radius: 20px;
  white-space: nowrap;
  transition: background 0.1s;
}
.mfp2-ps:hover { background: var(--accent-dim); color: var(--accent); }
.mfp2-ps-n {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.25rem;
  height: 1.25rem;
  border-radius: 50%;
  font-size: 0.6rem;
  font-weight: 700;
  background: var(--border);
  color: var(--muted);
  flex-shrink: 0;
  transition: background 0.15s, color 0.15s;
}
.mfp2-ps-active {
  color: var(--accent);
  font-weight: 700;
}
.mfp2-ps-active .mfp2-ps-n {
  background: var(--accent);
  color: #fff;
}
.mfp2-ps-arr {
  font-size: 0.65rem;
  color: var(--border);
  padding: 0 0.05rem;
  user-select: none;
}
.mfp2-focus {
  font-size: 0.72rem;
  color: var(--muted);
  margin: 0 0 0.05rem;
  padding: 0.18rem 0.6rem;
  background: var(--surface);
  border-left: 3px solid var(--accent);
  border-radius: 0 4px 4px 0;
  display: flex;
  align-items: center;
  gap: 0.55rem;
  flex-wrap: wrap;
}
.mfp2-focus .mfp2-focus-role {
  font-weight: 700;
  color: var(--text);
  font-size: 0.69rem;
}
.mfp2-focus .mfp2-next-hint {
  margin-left: auto;
  font-size: 0.65rem;
  color: var(--accent);
  text-decoration: none;
  font-weight: 600;
  white-space: nowrap;
}
.mfp2-focus .mfp2-next-hint:hover { text-decoration: underline; }

/* ═══════════════════════════════════════════════════════════════
   EDITORIAL COCKPIT — index.html dashboard (Jul 2026)
════════════════════════════════════════════════════════════════ */
.ck-header {
  display: flex;
  align-items: baseline;
  gap: 0.75rem;
  margin: 0 0 0.85rem;
  flex-wrap: wrap;
}
.ck-header h1 { margin: 0; font-size: 1.45rem; }
.ck-header .ck-date { font-size: 0.72rem; color: var(--muted); margin-left: auto; }
.ck-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0.6rem;
  margin-bottom: 1rem;
}
@media (max-width: 900px) { .ck-grid { grid-template-columns: repeat(2,1fr); } }
@media (max-width: 560px) { .ck-grid { grid-template-columns: 1fr; } }
.ck-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 0.75rem 0.9rem 0.8rem;
  transition: border-color 0.15s, box-shadow 0.15s;
  text-decoration: none;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  color: inherit;
}
.ck-card-main {
  text-decoration: none;
  color: inherit;
  display: block;
  cursor: pointer;
  flex: 1;
}
.ck-card-plan {
  font-size: 0.68rem;
  font-weight: 600;
  color: var(--accent);
  text-decoration: none;
  align-self: flex-start;
  user-select: none;
  -webkit-user-select: none;
}
.ck-card-plan:hover { text-decoration: underline; }
.ck-card:hover { border-color: var(--accent); box-shadow: 0 1px 6px var(--accent-dim); }
.ck-card-title { font-weight: 700; font-size: 0.88rem; margin: 0 0 0.12rem; }
.ck-card-sub { font-size: 0.69rem; color: var(--muted); margin: 0 0 0.5rem; }
.ck-card-press {
  font-size: 0.65rem;
  font-family: var(--mono);
  color: var(--accent);
  font-weight: 600;
  margin-bottom: 0.45rem;
}
.ck-bar-wrap { background: var(--border); border-radius: 3px; height: 6px; overflow: hidden; margin-bottom: 0.35rem; }
.ck-bar { height: 100%; border-radius: 3px; background: var(--accent); transition: width 0.4s; }
.ck-bar-ok { background: var(--ok); }
.ck-card-stats { font-size: 0.65rem; color: var(--muted); display: flex; gap: 0.5rem; flex-wrap: wrap; }
.ck-card-stats strong { color: var(--text); }

.ck-section-head {
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--muted);
  margin: 0 0 0.55rem;
}

/* Needs-attention panel */
.ck-actions {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 0.65rem 0.9rem;
  margin-bottom: 1rem;
}
.ck-action-row {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  padding: 0.38rem 0;
  border-bottom: 1px solid var(--border);
  font-size: 0.82rem;
}
.ck-action-row:last-child { border-bottom: none; }
.ck-action-dot {
  width: 0.5rem; height: 0.5rem;
  border-radius: 50%;
  flex-shrink: 0;
  background: var(--accent);
}
.ck-action-dot.warn { background: var(--warn); }
.ck-action-dot.ok { background: var(--ok); }
.ck-action-count { font-weight: 700; min-width: 1.5rem; }
.ck-action-link {
  margin-left: auto;
  font-size: 0.72rem;
  font-weight: 600;
  color: var(--accent);
  text-decoration: none;
  white-space: nowrap;
}
.ck-action-link:hover { text-decoration: underline; }

/* Stage distribution bar */
.ck-stages {
  display: flex;
  gap: 0.35rem;
  flex-wrap: wrap;
  margin-bottom: 1rem;
}
.ck-stage {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.18rem;
  padding: 0.35rem 0.6rem;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 6px;
  min-width: 3.5rem;
}
.ck-stage-n { font-size: 1.25rem; font-weight: 700; line-height: 1; }
.ck-stage-l { font-size: 0.58rem; color: var(--muted); text-align: center; }
.ck-stage-n.active { color: var(--accent); }
.ck-stage-n.ok { color: var(--ok); }
.ck-stage-n.warn { color: var(--warn); }

/* Quick nav grid */
.ck-nav-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0.5rem;
  margin-top: 0.85rem;
}
@media (max-width: 700px) { .ck-nav-grid { grid-template-columns: repeat(2,1fr); } }
.ck-nav-item {
  display: block;
  padding: 0.6rem 0.75rem;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  text-decoration: none;
  color: var(--text);
  font-size: 0.82rem;
  font-weight: 600;
  transition: border-color 0.12s, background 0.12s;
}
.ck-nav-item:hover { border-color: var(--accent); background: var(--accent-dim); }
.ck-nav-item .ck-nav-step { font-size: 0.58rem; color: var(--muted); font-weight: 400; display: block; margin-bottom: 0.18rem; }
.ck-nav-item .ck-nav-arr { color: var(--muted); font-weight: 400; margin-left: 0.2rem; }

/* Post-accept banner (issue.html propose flow) */
.cand-accepted-banner {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  flex-wrap: wrap;
  background: color-mix(in srgb, var(--ok) 10%, var(--surface));
  border: 1px solid color-mix(in srgb, var(--ok) 35%, var(--border));
  border-radius: var(--radius);
  padding: 0.6rem 1rem;
  margin: 0.5rem 0;
  font-size: 0.85rem;
}
.cand-accepted-banner .cand-accepted-msg { flex: 1; min-width: 0; }
.cand-accepted-banner .btn-sm {
  font-size: 0.72rem;
  font-weight: 700;
  padding: 0.22rem 0.65rem;
  border-radius: 6px;
  background: var(--accent);
  color: #fff;
  border: none;
  text-decoration: none;
  display: inline-block;
  white-space: nowrap;
  font-weight: 600;
}

/* Cascade market comparison grid */
.cas-mkt-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 0.65rem;
  margin-top: 0.65rem;
}
.cas-mkt-card {
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 0.7rem 0.85rem;
  background: var(--surface);
}
.cas-mkt-card.live { border-color: color-mix(in srgb, var(--ok) 50%, var(--border)); }
.cas-mkt-card.pending { border-color: color-mix(in srgb, var(--warn) 40%, var(--border)); }
.cas-mkt-card.na { opacity: 0.55; }
.cas-mkt-code { font-weight: 700; font-size: 0.85rem; margin-bottom: 0.3rem; }
.cas-mkt-title { font-size: 0.72rem; color: var(--muted); margin-bottom: 0.5rem; }
.cas-mkt-row { display: flex; justify-content: space-between; font-size: 0.72rem; margin-bottom: 0.22rem; }
.cas-mkt-row .label { color: var(--muted); }

/* ── Chat quick-action chips (create.html AI rail) ── */
.chat-qa-strip {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.3rem;
  padding: 0.4rem 0.7rem 0.35rem;
  border-bottom: 1px solid var(--border);
  background: color-mix(in srgb, var(--surface) 60%, transparent);
}
.chat-qa-strip--ease {
  align-items: center;
  gap: 0.3rem;
}
.chat-qa-more {
  position: relative;
  flex: 0 0 auto;
}
.chat-qa-more > summary {
  list-style: none;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 0.2rem;
  font-size: 0.7rem;
  font-weight: 700;
  color: var(--muted2, var(--text));
  padding: 0.2rem 0.55rem;
  border-radius: 6px;
  border: 1px solid var(--border);
  background: var(--bg);
  line-height: 1.2;
  white-space: nowrap;
  box-sizing: border-box;
}
.chat-qa-more > summary::-webkit-details-marker { display: none; }
.chat-qa-more > summary::after {
  content: "";
  width: 0;
  height: 0;
  border-left: 3.5px solid transparent;
  border-right: 3.5px solid transparent;
  border-top: 4px solid currentColor;
  opacity: 0.55;
  margin-left: 0.1rem;
}
.chat-qa-more > summary:hover {
  border-color: var(--accent);
  background: color-mix(in srgb, var(--accent) 8%, var(--bg));
  color: var(--accent);
}
.chat-qa-more[open] > summary {
  background: color-mix(in srgb, var(--accent) 16%, var(--surface));
  border-color: color-mix(in srgb, var(--accent) 55%, var(--text) 12%);
  color: var(--accent);
}
.chat-qa-more-body {
  position: absolute;
  top: calc(100% + 0.25rem);
  left: 0;
  z-index: 40;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0.25rem;
  min-width: 9.5rem;
  padding: 0.35rem;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--surface);
  box-shadow:
    0 6px 18px rgba(20, 20, 19, 0.12),
    0 1px 0 rgba(255, 255, 255, 0.5) inset;
}
.chat-qa-more-body .chat-qa-btn,
.chat-qa-more-body .chat-draft-act {
  width: 100%;
  justify-content: flex-start;
  text-align: left;
}
.chat-qa-strip--ease .chat-qa-more {
  flex: 0 0 auto;
}
.chat-qa-strip--ease .chat-qa-more[open] {
  flex: 0 0 auto;
}
.chat-qa-btn {
  font-size: 0.7rem;
  font-weight: 600;
  padding: 0.2rem 0.55rem;
  border-radius: 6px;
  border: 1px solid var(--border);
  background: var(--bg);
  color: var(--muted2, var(--text));
  cursor: pointer;
  transition: border-color 0.12s, background 0.12s, color 0.12s;
  white-space: nowrap;
  line-height: 1.2;
}
.chat-qa-btn:hover {
  border-color: var(--accent);
  background: color-mix(in srgb, var(--accent) 8%, var(--bg));
  color: var(--accent);
}
/* Primary = default grey; flash-on-click confirms (not a permanent blue chip) */
.chat-qa-btn--primary {
  border-color: var(--border);
  background: var(--bg);
  color: var(--muted2, var(--text));
  font-weight: 650;
}
.chat-qa-btn--primary:hover {
  border-color: var(--accent);
  background: color-mix(in srgb, var(--accent) 8%, var(--bg));
  color: var(--accent);
}
.chat-qa-btn.on,
.chat-qa-btn--primary.on {
  background: color-mix(in srgb, var(--accent) 16%, var(--surface)) !important;
  border-color: color-mix(in srgb, var(--accent) 42%, var(--border)) !important;
  color: var(--accent) !important;
}
.mfp2-chat-msg .chat-draft-acts {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  margin-top: 0.35rem;
}

/* ── BA field status strip in chat panel ── */
.chat-ba-status {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem;
  padding: 0.35rem 0.7rem;
  border-bottom: 1px solid var(--border);
  background: color-mix(in srgb, var(--surface) 40%, transparent);
  min-height: 0;
}
.chat-ba-status[hidden] { display: none; }
.ba-fs-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  font-size: 0.56rem;
  font-weight: 400;
  padding: 0.1rem 0.35rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg);
  cursor: default;
}
.ba-fs-chip.ba-fs-ok { border-color: color-mix(in srgb, var(--ok) 50%, var(--border)); }
.ba-fs-chip.ba-fs-empty { opacity: 0.6; }
.ba-fs-chip.ba-fs-over { border-color: color-mix(in srgb, var(--warn) 60%, var(--border)); color: var(--warn); }
.ba-fs-chip.ba-fs-short { border-color: color-mix(in srgb, var(--accent) 40%, var(--border)); }
.ba-fs-label { color: var(--muted); font-weight: 400; }
.ba-fs-count { font-family: var(--mono); font-weight: 400; }
.ba-fs-chip.ba-fs-ok .ba-fs-count { color: var(--ok); }
.ba-fs-chip.ba-fs-over .ba-fs-count { color: var(--warn); }

/* ── Cockpit card dim state ── */
.ck-card-dim { opacity: 0.6; }

/* ── Brief form (WF1 compact) ── */
.brief-page .brief-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.35rem 0.85rem;
  margin: 0 0 0.2rem;
  padding: 0;
}
.brief-page .brief-head-main { min-width: min(100%, 14rem); flex: 1; }
.brief-page .brief-head .lede {
  font-size: 0.72rem;
  margin: 0;
  max-width: 40rem;
  color: var(--muted);
  line-height: 1.3;
}
.brief-page .brief-article-title {
  font-size: 1.55rem;
  font-weight: 700;
  line-height: 1.2;
  margin: 0 0 0.35rem;
  letter-spacing: -0.01em;
  color: var(--text);
}
.brief-page .brief-article-title[hidden] { display: none; }
.brief-page .brief-field-title {
  margin-bottom: 0.85rem;
}
.brief-page .brief-label-article-title {
  font-size: 0.85rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--text);
}
.brief-page .brief-form input#title.brief-article-title-input {
  width: 100%;
  font-size: 1.65rem;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: -0.02em;
  color: var(--text);
  padding: 0.65rem 0.75rem;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--surface);
}
.brief-page .brief-form input#title.brief-article-title-input:focus {
  outline: 2px solid color-mix(in srgb, var(--accent) 45%, transparent);
  outline-offset: 1px;
  border-color: var(--accent);
}
.brief-page .brief-input-row--textarea {
  align-items: flex-start;
}
.brief-page .brief-input-row--textarea textarea {
  flex: 1;
  min-width: 0;
}
.brief-page textarea.brief-autosize {
  overflow: hidden;
  resize: none;
  field-sizing: content; /* progressive; JS fallback below */
}
.brief-page #hl.brief-autosize {
  min-height: 2.75rem;
}
.brief-page #must.brief-autosize {
  min-height: 4.5rem; /* ~3 rows — expand only as content grows */
}
.brief-page #facts.brief-autosize {
  min-height: 2.75rem; /* ~2 rows — expand to fit text */
}
.brief-page .brief-tpl-warn {
  margin: 0;
  padding: 0.4rem 0.55rem;
  border-radius: 5px;
  border: 1px solid color-mix(in srgb, var(--warn, #b86b00) 45%, var(--border));
  background: color-mix(in srgb, var(--warn, #b86b00) 12%, var(--surface));
  color: var(--text);
}
.brief-page .brief-tpl-warn a { color: var(--accent); font-weight: 600; }

/* Issue board — blueprint Layout + BA chips */
.tpl-chip { margin-top: 0.2rem; line-height: 1.35; }
.tpl-chip.ok code {
  font-size: 0.68rem;
  padding: 0.05rem 0.25rem;
  border-radius: 3px;
  background: var(--bg2, var(--surface));
}
.tpl-chip.warn {
  color: var(--warn, #9a5b1a);
  font-weight: 600;
}
.tpl-chip.warn a { color: var(--accent); }
.act.act-blocked-tpl {
  opacity: 0.55;
  cursor: not-allowed;
  text-decoration: line-through;
}
.brief-page .brief-head-tools {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.25rem;
}
.brief-page .brief-head-tools .btn-ghost {
  padding: 0.22rem 0.45rem;
  font-size: 0.72rem;
}
.brief-page .brief-head-tools #art-pick {
  width: auto;
  min-width: 10rem;
  max-width: 16rem;
  font-size: 0.75rem;
  padding: 0.22rem 0.35rem;
}
.brief-page .brief-meta-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.3rem 0.45rem;
  margin: 0 0 0.35rem;
  min-height: 0;
}
.brief-page .brief-meta-row:empty,
.brief-page .brief-meta-row:not(:has(:not(:empty))) {
  display: none;
}
.brief-page #wf-status-line { margin: 0; }
.brief-page #ap:empty { display: none; }

body[data-mfp2-page="brief.html"] .mfp2-focus {
  margin: 0 0 0.25rem;
  padding: 0.22rem 0.5rem;
  font-size: 0.72rem;
  line-height: 1.3;
}
body[data-mfp2-page="brief.html"] .mfp2-pipeline {
  margin: 0 0 0.2rem;
}
body[data-mfp2-page="brief.html"] .flash {
  margin: 0 0 0.3rem;
  padding: 0.35rem 0.55rem;
  font-size: 0.78rem;
}
body[data-mfp2-page="brief.html"] .flash:not(.show),
body[data-mfp2-page="brief.html"] .flash:empty {
  display: none;
  margin: 0;
  padding: 0;
}

.brief-form {
  max-width: 36rem;
  display: flex;
  flex-direction: column;
  gap: 0.7rem;
  padding: 0.85rem 1rem 1.1rem;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--surface);
}
.brief-form .brief-owner { margin: 0; opacity: 0.75; }
.brief-field { display: flex; flex-direction: column; gap: 0.25rem; }
.brief-field label {
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: var(--muted);
  margin: 0;
}
.brief-hint {
  text-transform: none;
  font-weight: 500;
  letter-spacing: 0;
  opacity: 0.75;
  margin-left: 0.35rem;
  font-size: 0.7rem;
}
.brief-label-row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.5rem;
}
.brief-tools { display: flex; gap: 0.15rem; }
.brief-form input[type="text"],
.brief-form input:not([type]),
.brief-form textarea,
.brief-form select {
  width: 100%;
  font-size: 0.9rem;
  padding: 0.4rem 0.55rem;
  border-radius: 5px;
  border: 1px solid var(--border);
  background: var(--bg);
  color: var(--text);
  min-height: 0;
}
.brief-form textarea {
  min-height: 0;
  resize: vertical;
  line-height: 1.4;
}
.brief-input-row {
  display: flex;
  gap: 0.3rem;
  align-items: stretch;
}
.brief-input-row input { flex: 1; }
.brief-icon-btn,
.brief-text-btn {
  font: inherit;
  font-size: 0.72rem;
  font-weight: 700;
  padding: 0.22rem 0.45rem;
  border-radius: 6px;
  border: 1px solid color-mix(in srgb, var(--text) 28%, var(--border));
  background: var(--surface);
  color: var(--muted);
  cursor: pointer;
  white-space: nowrap;
  box-shadow:
    0 1px 2px rgba(20, 20, 19, 0.08),
    0 1px 0 rgba(255, 255, 255, 0.55) inset;
}
.brief-icon-btn:hover,
.brief-text-btn:hover {
  color: var(--text);
  border-color: var(--accent);
}
.brief-alloc {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.55rem 0.75rem;
  align-items: end;
  padding-top: 0.15rem;
}
.brief-layout {
  grid-column: 1 / -1;
  margin: 0;
}
.brief-details {
  font-size: 0.8rem;
  border-top: 1px solid var(--border);
  padding-top: 0.45rem;
}
.brief-details summary {
  cursor: pointer;
  color: var(--muted);
  font-size: 0.78rem;
}
.brief-details #ba-component-list {
  margin-top: 0.4rem;
  padding: 0.45rem 0.55rem;
  background: var(--bg);
  border-radius: 4px;
}
.brief-check {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  font-size: 0.85rem;
  margin: 0.15rem 0 0;
  cursor: pointer;
  border: 0;
  padding: 0;
}
.brief-check input { width: auto; margin: 0; }
.brief-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem;
  margin: 0;
}
.brief-actions-top {
  position: sticky;
  top: 0;
  z-index: 2;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.4rem 0.75rem;
  margin: 0 0 0.35rem;
  padding: 0.35rem 0;
  border-bottom: 1px solid var(--border);
  background: var(--bg, var(--surface, #fff));
}
.brief-actions-left,
.brief-actions-right {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem;
}
.brief-actions-right {
  margin-left: auto;
}
.brief-actions .brief-open-desk {
  font-weight: 650;
}
.brief-actions .btn,
.brief-actions .btn-ghost {
  padding: 0.32rem 0.65rem;
  font-size: 0.78rem;
}
.brief-actions .autosave-hint {
  font-size: 0.72rem;
  margin-left: 0.15rem;
  color: var(--muted);
}
.brief-task-box:empty { display: none; }
.brief-task-box .flash { margin: 0; padding: 0.45rem 0.55rem; font-size: 0.8rem; }
#create-handoff { margin: 0; }
#create-handoff a {
  font-size: 0.8rem;
  color: var(--muted);
}
#create-handoff a:hover { color: var(--accent); }
.brief-secondary { margin-top: 1rem; max-width: 36rem; }
.brief-approve-btns {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  margin-top: 0.45rem;
}
.brief-approve-btns .btn,
.brief-approve-btns .btn-ghost {
  padding: 0.28rem 0.55rem;
  font-size: 0.75rem;
}
@media (max-width: 560px) {
  .brief-alloc { grid-template-columns: 1fr; }
}

/* Brief desk: form left · AI right (mirrors Create) */
.brief-page .brief-desk.create-desk-panel {
  --desk-rail-pct: 36%;
  height: calc(100vh - 7rem);
  max-height: calc(100vh - 7rem);
  margin-top: 0.15rem;
}
.brief-page .brief-desk .create-desk-left {
  overflow: auto;
  padding: 0.35rem 0.55rem 0.65rem;
}
.brief-page .brief-desk .brief-form {
  max-width: none;
  border: 0;
  padding: 0;
  background: transparent;
  gap: 0.5rem;
}
.brief-page .brief-desk .brief-owner {
  font-size: 0.72rem;
  margin: 0 0 0.1rem;
}
.brief-page .brief-desk .brief-cover {
  margin-bottom: 0.75rem;
}
.brief-page .brief-desk .mfp2-editor-rail {
  grid-column: 3;
  grid-row: 1;
  min-width: 0;
  height: 100%;
}
.brief-page .brief-desk .mfp2-chat-panel { display: flex; flex-direction: column; min-height: 0; }
.brief-page .brief-desk #brief-chat-log {
  flex: 1;
  min-height: 8rem;
  overflow: auto;
  padding: 0.35rem 0.15rem 0.55rem;
}
.brief-page .brief-desk .brief-put { margin-top: 0.35rem; }
body[data-mfp2-page="brief.html"] .mfp2-rail-fab { display: none; }
@media (max-width: 900px) {
  .brief-page .brief-desk.create-desk-panel {
    grid-template-columns: 1fr;
    height: auto;
    max-height: none;
  }
  .brief-page .brief-desk .desk-split { display: none; }
  .brief-page .brief-desk .mfp2-editor-rail {
    grid-column: 1;
    grid-row: auto;
    min-height: 22rem;
    border-top: 1px solid var(--border);
  }
}

/* Article Package Spine — .md surface */
.md-editor {
  width: 100%;
  min-height: 28rem;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 0.88rem;
  line-height: 1.45;
  padding: 0.75rem 0.85rem;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
  color: inherit;
  resize: vertical;
}
#btn-surface-ba.on,
#btn-surface-md.on {
  border-color: var(--accent);
  color: var(--accent);
}

/* Cross-surface package bridge */
.surface-bridge {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem 0.45rem;
  margin: 0.35rem 0 0.55rem;
  padding: 0.35rem 0.45rem;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: color-mix(in srgb, var(--surface) 88%, var(--accent) 12%);
}
.surface-bridge .sb-label {
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--muted);
  margin-right: 0.15rem;
}
.surface-bridge .sb-chip {
  appearance: none;
  border: 1px solid var(--border);
  background: var(--bg, var(--surface));
  color: inherit;
  font: inherit;
  font-size: 0.72rem;
  font-weight: 600;
  padding: 0.12rem 0.45rem;
  border-radius: 3px;
  cursor: pointer;
}
.surface-bridge .sb-chip.on {
  border-color: var(--accent);
  color: var(--accent);
}
.surface-bridge .sb-flow {
  margin-left: auto;
  font-size: 0.68rem;
  color: var(--muted);
}
.chat-empty-hint { padding: 0.6rem 0.2rem; color: var(--muted); }

/* —— UX ease v1 —— writer calm chrome */
.task-more-filters {
  margin: 0.35rem 0 0.55rem;
  max-width: 42rem;
}
.task-more-filters > summary {
  cursor: pointer;
  font-size: 0.78rem;
  color: var(--muted);
  list-style: none;
}
.task-more-filters > summary::-webkit-details-marker { display: none; }
.task-more-filters[open] > summary { margin-bottom: 0.35rem; }
.tasks-page .lede { margin-bottom: 0.65rem; max-width: 36rem; }
.tasks-page th[data-sort="rag"],
.tasks-page td.rag-cell,
.tasks-page th[data-sort="role"],
.tasks-page td.role-cell { /* keep for now — hide via class if rows mark them */ }

.brief-head-more { position: relative; }
.brief-head-more > summary {
  cursor: pointer;
  list-style: none;
  font-size: 0.72rem;
  color: var(--muted);
  padding: 0.22rem 0.45rem;
  border: 1px solid var(--border);
  border-radius: 6px;
}
.brief-head-more > summary::-webkit-details-marker { display: none; }
.brief-head-more-menu {
  position: absolute;
  right: 0;
  top: calc(100% + 0.25rem);
  z-index: 20;
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  min-width: 9rem;
  padding: 0.35rem;
  background: var(--surface, #fff);
  border: 1px solid var(--border);
  border-radius: 6px;
  box-shadow: 0 4px 14px rgba(0,0,0,0.08);
}
.brief-secondary-actions {
  margin: 0.25rem 0 0.65rem;
  max-width: 28rem;
}
.brief-secondary-actions > summary {
  cursor: pointer;
  font-size: 0.72rem;
  color: var(--muted);
  list-style: none;
}
.brief-secondary-actions > summary::-webkit-details-marker { display: none; }
.brief-page .brief-actions-top {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.4rem 0.75rem;
  margin-bottom: 0.25rem;
}
.brief-page .brief-owner {
  margin: 0 0 0.45rem;
}
body[data-ux-ease="1"].create-page .desk-nav-links .desk-nav-quiet,
body[data-ux-ease="1"].create-page .desk-nav-links .desk-nav-danger {
  opacity: 0.65;
}

/* ═══════════════════════════════════════════════════════════
   Button form-factor (binding): slightly rounded corners ONLY.
   Bold · slightly smaller type · darker border · soft shadow.
   Shorter height · light-blue retained · flash-on-action.
   Circular icon controls (send, mic) are excluded.
   ═══════════════════════════════════════════════════════════ */
:root {
  --mfp2-btn-radius: 6px;
  --mfp2-btn-pad-y: 0.22rem;
  --mfp2-btn-pad-x: 0.65rem;
  --mfp2-btn-size: 0.72rem;
  --mfp2-btn-border: color-mix(in srgb, var(--text) 28%, var(--border));
  --mfp2-btn-shadow:
    0 1px 2px rgba(20, 20, 19, 0.08),
    0 1px 0 rgba(255, 255, 255, 0.55) inset;
}
/* Text buttons — 6px, short, bold, darker border + shadow */
button:not(.mfp2-chat-send):not(.mfp2-chat-mic):not(.icon-btn):not(.sw-lang-btn):not(.craft-icon-btn):not(.rail-attach-btn):not(.chat-attach-infield):not(.nb-refs-icon):not(.chat-suggest-link):not(.chat-desk-quiet):not(.chat-tool-btn),
.btn,
.btn-ghost,
.btn-tool,
.btn-sm,
.btn-go,
.create-mode,
.craft-tab,
.craft-layout-btn,
.chat-src-chip,
.chat-qa-btn,
.brief-text-btn,
.brief-icon-btn,
.mfp2-erail-tabs button,
.mfp2-theme-toggle,
.mfp2-theme-fab,
.mfp2-rail-fab,
.mfp2-nav-toggle,
.ea-tool,
.hz-seg-chip,
.hz-btn,
.sb-chip,
.lp-opt-btn,
.create-step {
  border-radius: var(--mfp2-btn-radius) !important;
  border-color: var(--mfp2-btn-border) !important;
  font-size: var(--mfp2-btn-size) !important;
  font-weight: 700 !important;
  letter-spacing: 0.01em;
  box-shadow: var(--mfp2-btn-shadow) !important;
}
button:not(.mfp2-chat-send):not(.mfp2-chat-mic):not(.icon-btn):not(.sw-lang-btn):not(.craft-icon-btn):not(.rail-attach-btn):not(.chat-attach-infield):not(.nb-refs-icon):not(.chat-suggest-link):not(.chat-desk-quiet):not(.chat-tool-btn),
.btn,
.btn-ghost,
.btn-tool,
.btn-sm,
.btn-go,
.create-mode,
.craft-tab,
.craft-layout-btn,
.chat-src-chip,
.chat-qa-btn,
.brief-text-btn,
.brief-icon-btn,
.mfp2-erail-tabs button,
.ea-tool,
.hz-btn,
.lp-opt-btn,
.create-step {
  padding-top: var(--mfp2-btn-pad-y) !important;
  padding-bottom: var(--mfp2-btn-pad-y) !important;
  line-height: 1.2 !important;
}
/* Icon / square controls — 6px corners only (keep square padding) */
.mfp2-chat-send,
.mfp2-chat-mic,
.icon-btn,
.sw-lang-btn,
.craft-icon-btn,
.rail-attach-btn,
.chat-attach-infield,
.chat-tool-btn,
.lp-nav-btn,
.nb-refs-icon {
  border-radius: var(--mfp2-btn-radius) !important;
}
button:hover:not(:disabled):not(.mfp2-chat-send):not(.mfp2-chat-mic):not(.chat-suggest-link):not(.chat-desk-quiet):not(.chat-tool-btn),
.btn:hover,
.btn-ghost:hover,
.btn-tool:hover,
.create-mode:hover,
.craft-tab:hover,
.craft-layout-btn:hover,
.chat-src-chip:hover,
.chat-qa-btn:hover,
.brief-text-btn:hover,
.brief-icon-btn:hover,
.ea-tool:hover,
.hz-btn:hover {
  box-shadow:
    0 2px 4px rgba(20, 20, 19, 0.1),
    0 1px 0 rgba(255, 255, 255, 0.55) inset !important;
}
/* Retained on — light blue (tabs, scopes, pressed toggles) */
button.on:not(.mfp2-chat-send),
.btn.on,
.create-mode.on,
.craft-tab.on,
.create-step.on,
.mfp2-erail-tabs button.on,
.chat-src-chip.on,
.chat-qa-btn.on,
.hz-seg-chip.on,
.sb-chip.on,
.lp-opt-btn.on,
.btn[aria-pressed="true"],
button[aria-pressed="true"],
.create-mode.is-tools-on {
  background: color-mix(in srgb, var(--accent) 16%, var(--surface)) !important;
  border-color: color-mix(in srgb, var(--accent) 55%, var(--text) 12%) !important;
  color: var(--accent) !important;
  font-weight: 700 !important;
  box-shadow:
    0 1px 2px color-mix(in srgb, var(--accent) 22%, transparent),
    0 1px 0 rgba(255, 255, 255, 0.45) inset !important;
}

/* —— Research / result cards (Chat + Brief) —— */
.chat-cards {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.55rem;
  margin: 0.45rem 0 0.65rem;
}
.chat-card {
  display: grid;
  grid-template-columns: 4.6rem 1fr;
  gap: 0.55rem;
  align-items: start;
  padding: 0.4rem;
  border: 1px solid var(--border, #ddd);
  border-radius: 6px;
  background: var(--surface, #fff);
}
.chat-card-thumb {
  width: 4.6rem;
  height: 5.6rem;
  border-radius: 4px;
  background: #f0f0f0 center/cover no-repeat;
  border: 1px solid var(--border, #e5e5e5);
}
.chat-card-thumb.empty {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.62rem;
  color: var(--muted, #888);
  text-align: center;
  padding: 0.2rem;
}
.chat-card-body { min-width: 0; }
.chat-card-title {
  font-size: 0.78rem;
  font-weight: 650;
  line-height: 1.25;
  margin: 0 0 0.2rem;
}
.chat-card-title-link {
  color: inherit;
  text-decoration: none;
}
.chat-card-title-link:hover {
  color: var(--accent, #2a5db0);
  text-decoration: underline;
}
.chat-card-thumb-link { display: block; text-decoration: none; }
.chat-card-view { font-weight: 600; }
.chat-card-meta {
  font-size: 0.66rem;
  color: var(--muted, #777);
  margin: 0 0 0.25rem;
}
.chat-card-syn {
  font-size: 0.7rem;
  line-height: 1.35;
  color: var(--text, #333);
  margin: 0 0 0.3rem;
}
.chat-card-acts {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem 0.45rem;
  font-size: 0.66rem;
}
.chat-card-acts a,
.chat-card-acts button {
  background: none;
  border: none;
  padding: 0;
  color: var(--accent, #2a5db0);
  cursor: pointer;
  font: inherit;
  text-decoration: underline;
}
.chat-cards-label {
  font-size: 0.68rem;
  color: var(--muted, #777);
  margin: 0 0 0.25rem;
}