/* Sopal v2 — isolated stylesheet (Astruct-inspired warm cream sidebar + white
   main panel with a rounded top-left corner). Scoped to /sopal-v2 only. */

*, *::before, *::after { box-sizing: border-box; }

:root {
  --sidebar-bg: #f5f2ed;
  --sidebar-fg: #1a1a1a;
  --sidebar-active: #ebe7e0;
  --sidebar-active-fg: #1a1a1a;
  --sidebar-hover: rgba(26, 26, 26, 0.04);
  --sidebar-divider: rgba(26, 26, 26, 0.08);

  --main-panel: #ffffff;
  --main-fg: #1a1a1a;
  --main-border: #e8e5e0;
  --main-muted: #f7f5f1;
  --muted-fg: #787570;
  --soft-fg: #9b9994;

  --accent: #f0ece6;
  --ring: #c4bfb6;
  --focus: #1f6f5f;

  --button: #1a1a1a;
  --button-hover: #2c2c2c;
  --button-fg: #ffffff;

  --danger: #b91c1c;
  --danger-bg: #fef2f2;
  --danger-border: #fecaca;

  --warn-bg: #fffbeb;
  --warn-border: #fde68a;
  --warn-border-strong: #fde68a;
  --warn-fg: #92400e;

  --surface: #ffffff;
  --surface-hover: #fafaf6;
  --success-bg: #ecfdf5;
  --success-mute: #d1fae5;
  --success-fg: #047857;
  --success-strong: #065f46;
  --success-border: #a7f3d0;
  --mark-bg: #fff3bf;

  --radius-sm: 6px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);
  --shadow-md: 0 4px 14px rgba(0, 0, 0, 0.06);
  --shadow-lg: 0 20px 40px rgba(0, 0, 0, 0.12);
}

[data-theme="dark"] {
  --sidebar-bg: #181715;
  --sidebar-fg: #ececea;
  --sidebar-active: #262422;
  --sidebar-active-fg: #ffffff;
  --sidebar-hover: rgba(255, 255, 255, 0.05);
  --sidebar-divider: rgba(255, 255, 255, 0.08);

  --main-panel: #1f1d1b;
  --main-fg: #ececea;
  --main-border: #2c2a27;
  --main-muted: #25231f;
  --muted-fg: #9b9994;
  --soft-fg: #6b6963;

  --accent: #2a2724;
  --ring: #3a3633;
  --focus: #34d399;

  --button: #f5f2ed;
  --button-hover: #ffffff;
  --button-fg: #1a1a1a;

  --danger: #fca5a5;
  --danger-bg: rgba(185, 28, 28, 0.18);
  --danger-border: rgba(252, 165, 165, 0.4);

  --warn-bg: rgba(245, 158, 11, 0.12);
  --warn-border: rgba(245, 158, 11, 0.35);
  --warn-border-strong: rgba(245, 158, 11, 0.4);
  --warn-fg: #fbbf24;

  --surface: #242220;
  --surface-hover: #2b2927;
  --success-bg: rgba(16, 185, 129, 0.14);
  --success-mute: rgba(52, 211, 153, 0.25);
  --success-fg: #34d399;
  --success-strong: #6ee7b7;
  --success-border: rgba(52, 211, 153, 0.35);
  --mark-bg: rgba(245, 158, 11, 0.35);

  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.3);
  --shadow-md: 0 4px 14px rgba(0, 0, 0, 0.4);
  --shadow-lg: 0 20px 40px rgba(0, 0, 0, 0.55);
}
[data-theme="dark"] .palette,
[data-theme="dark"] .modal,
[data-theme="dark"] .doc-drawer { background: var(--main-panel); color: var(--main-fg); }
[data-theme="dark"] .palette-input { color: var(--main-fg); }
[data-theme="dark"] .palette-item.active,
[data-theme="dark"] .palette-item:hover { background: rgba(255,255,255,0.06); }
[data-theme="dark"] .doc-drawer-text { background: rgba(255,255,255,0.04); border-color: rgba(255,255,255,0.06); color: var(--main-fg); }
[data-theme="dark"] .text-input,
[data-theme="dark"] .text-area,
[data-theme="dark"] .select-input { background: var(--main-muted); border-color: var(--ring); color: var(--main-fg); }
[data-theme="dark"] .ghost-button:hover,
[data-theme="dark"] .icon-button:hover { background: rgba(255,255,255,0.06); }
[data-theme="dark"] .card { background: var(--main-panel); border-color: var(--main-border); }
[data-theme="dark"] .recent-item:hover { background: rgba(255,255,255,0.04); }
[data-theme="dark"] .tile { background: var(--main-panel); border-color: var(--main-border); color: var(--main-fg); }
[data-theme="dark"] .tile:hover { background: rgba(255,255,255,0.04); border-color: var(--ring); }
[data-theme="dark"] .tile-icon { background: rgba(255,255,255,0.06); color: var(--main-fg); }
[data-theme="dark"] .project-row { background: var(--main-panel); border-color: var(--main-border); color: var(--main-fg); }
[data-theme="dark"] .project-row:hover { background: rgba(255,255,255,0.04); }
[data-theme="dark"] .home-hero { background: var(--main-panel); border-color: var(--main-border); }
[data-theme="dark"] .home-hero h2 { color: var(--main-fg); }
[data-theme="dark"] .recent-decision-card { background: var(--main-panel); border-color: var(--main-border); color: var(--main-fg); }
[data-theme="dark"] .recent-decision-card:hover { background: rgba(255,255,255,0.04); }
[data-theme="dark"] .nav-thread-preview,
[data-theme="dark"] .doc-list-meta,
[data-theme="dark"] .palette-section,
[data-theme="dark"] .palette-hint,
[data-theme="dark"] .doc-mention-meta { color: var(--soft-fg); }
[data-theme="dark"] .resume-chip { background: linear-gradient(135deg, rgba(16,185,129,0.18) 0%, rgba(34,197,94,0.12) 100%); border-color: rgba(167,243,208,0.3); }
[data-theme="dark"] .resume-chip-body strong { color: #d1fae5; }
[data-theme="dark"] .resume-chip-body .muted,
[data-theme="dark"] .resume-chip-preview { color: #d1fae5; }
[data-theme="dark"] .doc-list a,
[data-theme="dark"] .pinned-row .doc-list a { background: rgba(255,255,255,0.04); border-color: rgba(255,255,255,0.06); color: var(--main-fg); }
[data-theme="dark"] .doc-list a:hover { background: rgba(255,255,255,0.07); }
[data-theme="dark"] .pinned-row { background: rgba(245,158,11,0.1); border-color: rgba(245,158,11,0.3); }
[data-theme="dark"] .pinned-row-title { color: #fbbf24; }
[data-theme="dark"] .analysis-overview,
[data-theme="dark"] .doc-drawer-text,
[data-theme="dark"] .whatsnew-entry p { color: var(--main-fg); }
[data-theme="dark"] .citation-chip { background: rgba(99,102,241,0.18); color: #c7d2fe; border-color: rgba(199,210,254,0.3); }
[data-theme="dark"] .citation-unknown { background: rgba(255,255,255,0.05); color: var(--muted-fg); border-color: rgba(255,255,255,0.08); }
[data-theme="dark"] .doc-tag { background: rgba(99,102,241,0.18); color: #c7d2fe; border-color: rgba(199,210,254,0.3); }
[data-theme="dark"] .ref-tag { background: rgba(99,102,241,0.18); color: #c7d2fe; border-color: rgba(199,210,254,0.3); }
[data-theme="dark"] .tag-filter { background: rgba(255,255,255,0.04); color: var(--soft-fg); }
[data-theme="dark"] .tag-filter.active { background: var(--main-fg); color: var(--main-panel); }
[data-theme="dark"] .tag-filter:hover { background: rgba(255,255,255,0.08); color: var(--main-fg); }
[data-theme="dark"] .check-item.idle .check-status,
[data-theme="dark"] .check-item.pending .check-status { color: var(--soft-fg); }
[data-theme="dark"] .file-zone-label { background: rgba(255,255,255,0.03); border-color: rgba(255,255,255,0.1); color: var(--soft-fg); }
[data-theme="dark"] .file-zone-label:hover { background: rgba(255,255,255,0.06); border-color: var(--ring); color: var(--main-fg); }
[data-theme="dark"] .nav-item { color: rgba(236, 236, 234, 0.78); }
[data-theme="dark"] .nav-item:hover { background: rgba(255,255,255,0.05); color: var(--sidebar-fg); }
[data-theme="dark"] .nav-item.active { background: rgba(255,255,255,0.08); color: var(--sidebar-active-fg); }
[data-theme="dark"] .nav-group-title { color: rgba(236, 236, 234, 0.45); }
[data-theme="dark"] .nav-subgroup-title { color: rgba(236, 236, 234, 0.4); }
[data-theme="dark"] .nav-divider { background: rgba(255,255,255,0.06); }
[data-theme="dark"] .project-switcher-trigger { background: rgba(255,255,255,0.05); border-color: rgba(255,255,255,0.1); color: var(--sidebar-fg); }
[data-theme="dark"] .project-switcher-trigger:hover { background: rgba(255,255,255,0.08); }
[data-theme="dark"] .project-menu { background: var(--main-panel); border-color: var(--main-border); color: var(--main-fg); }
[data-theme="dark"] .sidebar-empty p { color: var(--soft-fg); }
[data-theme="dark"] .sidebar-brand { border-bottom-color: var(--sidebar-divider); color: var(--sidebar-fg); }
[data-theme="dark"] .brand-pill { background: rgba(255,255,255,0.08); color: var(--sidebar-fg); }
[data-theme="dark"] .split-action { background: rgba(139,92,246,0.14); border-color: rgba(196,181,253,0.35); }
[data-theme="dark"] .split-status { color: #c4b5fd; }
[data-theme="dark"] .tag-filter.active { background: #ececea; color: #1a1a1a; }
[data-theme="dark"] .crumb { color: var(--muted-fg); }
[data-theme="dark"] .crumb a, [data-theme="dark"] a.crumb { color: var(--soft-fg); }
[data-theme="dark"] .crumb.current { color: var(--main-fg); }
[data-theme="dark"] .main-header { background: rgba(31, 29, 27, 0.92); border-bottom-color: var(--main-border); }
[data-theme="dark"] .palette-hint-btn { background: rgba(255,255,255,0.05); border-color: rgba(255,255,255,0.1); color: var(--main-fg); }
[data-theme="dark"] .palette-hint-btn:hover { background: rgba(255,255,255,0.1); }
[data-theme="dark"] .kbd-key { color: var(--soft-fg); }
[data-theme="dark"] .ghost-button { color: var(--main-fg); border-color: var(--main-border); background: transparent; }
[data-theme="dark"] .ghost-button:hover { background: rgba(255,255,255,0.06); }
[data-theme="dark"] .dark-button { background: var(--button); color: var(--button-fg); }
[data-theme="dark"] .card { background: var(--main-panel); border-color: var(--main-border); }
[data-theme="dark"] .card-head { border-bottom-color: var(--main-border); }
[data-theme="dark"] .text-input::placeholder,
[data-theme="dark"] .text-area::placeholder { color: rgba(236, 236, 234, 0.35); }
[data-theme="dark"] kbd { background: rgba(255,255,255,0.08) !important; border-color: rgba(255,255,255,0.12) !important; color: var(--main-fg) !important; }
[data-theme="dark"] .status-pill { background: rgba(255,255,255,0.06); color: var(--soft-fg); }
[data-theme="dark"] .home-hero p { color: var(--soft-fg); }
[data-theme="dark"] .page-sub { color: var(--soft-fg); }
[data-theme="dark"] .modal-head { border-bottom-color: var(--main-border); }
[data-theme="dark"] .doc-drawer-foot { background: rgba(255,255,255,0.03); border-top-color: var(--main-border); }
[data-theme="dark"] .doc-drawer-head { border-bottom-color: var(--main-border); }
[data-theme="dark"] .recent-item { background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.04); }
[data-theme="dark"] .recent-item:hover { background: rgba(255,255,255,0.07); }
[data-theme="dark"] .recent-item .muted { color: var(--soft-fg); }
[data-theme="dark"] .storage-bar { background: rgba(255,255,255,0.06); }
[data-theme="dark"] .storage-footer { background: rgba(255,255,255,0.04); border-color: var(--main-border); }
[data-theme="dark"] .palette-input::placeholder { color: var(--soft-fg); }

html, body { min-height: 100%; margin: 0; }
/* Belt-and-braces: any single rogue element shouldn't make the page horizontally
   scrollable on phones. Set on body too because mobile Safari clips to body. */
html, body { overflow-x: hidden; }
.sopal-shell { max-width: 100%; }

/* `display: flex` etc. on labels/cards would otherwise override the user-agent
   `[hidden] { display: none }` rule. Keep the hidden attribute authoritative. */
[hidden] { display: none !important; }

body {
  background: var(--sidebar-bg);
  color: var(--main-fg);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 14px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
}

button, input, textarea, select { font: inherit; color: inherit; }
button { cursor: pointer; }
a { color: inherit; text-decoration: none; }

.muted { color: var(--muted-fg); }

/* ---------- Shell ---------- */

.sopal-shell {
  display: grid;
  grid-template-columns: 264px minmax(0, 1fr);
  min-height: 100vh;
  background: var(--sidebar-bg);
}

.sopal-sidebar {
  position: sticky;
  top: 0;
  height: 100vh;
  display: flex;
  flex-direction: column;
  background: var(--sidebar-bg);
  overflow: hidden;
  z-index: 30;
  transition: width 0.18s ease;
}
.sopal-sidebar.collapsed { width: 64px; }
.sopal-sidebar.collapsed .nav-label,
.sopal-sidebar.collapsed .nav-group-title,
.sopal-sidebar.collapsed .nav-divider,
.sopal-sidebar.collapsed .sidebar-empty,
.sopal-sidebar.collapsed .project-switcher,
.sopal-sidebar.collapsed .nav-thread-label,
.sopal-sidebar.collapsed .nav-thread-preview,
.sopal-sidebar.collapsed .brand-pill,
.sopal-sidebar.collapsed .sidebar-brand a { display: none; }
.sopal-sidebar.collapsed .sidebar-brand { justify-content: center; padding: 0; }
.sopal-sidebar.collapsed .nav-item {
  justify-content: center;
  padding: 10px 0;
}
.sopal-sidebar.collapsed .nav-item-sub { padding-left: 0; }
.sidebar-collapse-btn {
  display: inline-flex;
  width: 26px;
  height: 26px;
  align-items: center;
  justify-content: center;
  border-radius: 6px;
  background: transparent;
  border: 0;
  cursor: pointer;
  color: var(--muted-fg, #6b6b6b);
  transition: background-color 0.12s;
}
.sidebar-collapse-btn:hover { background: rgba(0,0,0,0.06); }
.sidebar-collapse-btn svg { width: 16px; height: 16px; }

.sidebar-brand {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  height: 56px;
  padding: 0 18px;
  border-bottom: 1px solid var(--sidebar-divider);
  font-size: 18px;
  font-weight: 700;
  letter-spacing: -0.02em;
}

.sidebar-brand a { color: var(--sidebar-fg); }

.brand-pill {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-weight: 600;
  color: var(--muted-fg);
  padding: 2px 6px;
  border: 1px solid var(--sidebar-divider);
  border-radius: 999px;
  background: rgba(26, 26, 26, 0.03);
}

.beta-tag {
  display: inline-block;
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  font-weight: 600;
  color: var(--muted-fg);
  padding: 1px 6px;
  margin-left: 4px;
  border: 1px solid var(--sidebar-divider);
  border-radius: 999px;
  background: rgba(26, 26, 26, 0.04);
  vertical-align: 1px;
}
[data-theme="dark"] .beta-tag { background: rgba(255,255,255,0.07); color: var(--muted-fg); }

.sidebar-scroll {
  flex: 1;
  overflow-y: auto;
  padding: 6px 10px 12px;
  /* Fade the bottom edge so any overflowing items below the fold visibly
     bleed off — gives a scroll-affordance on tight viewports without
     reserving room for a permanent scrollbar. */
  -webkit-mask-image: linear-gradient(to bottom, #000 0, #000 calc(100% - 16px), transparent 100%);
          mask-image: linear-gradient(to bottom, #000 0, #000 calc(100% - 16px), transparent 100%);
}
.sidebar-scroll::-webkit-scrollbar { width: 4px; }
.sidebar-scroll::-webkit-scrollbar-thumb { background: rgba(0,0,0,0.12); border-radius: 999px; }
[data-theme="dark"] .sidebar-scroll::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.12); }

/* Side-nav section labels — sentence case, slightly larger, looser tracking
 * to match the older Sopal sidebar look (the user's preferred styling). */
.nav-group-title {
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
  color: rgba(26, 26, 26, 0.55);
  padding: 14px 10px 6px;
}
.nav-group-title.row {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.nav-subgroup-title {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
  color: rgba(26, 26, 26, 0.5);
  padding: 10px 10px 4px;
}

.nav-divider {
  height: 1px;
  background: var(--sidebar-divider);
  margin: 8px 4px;
}

.nav-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 6px 10px;
  border-radius: 7px;
  color: rgba(26, 26, 26, 0.7);
  font-size: 13px;
  font-weight: 500;
  transition: background-color 0.12s, color 0.12s;
}
.nav-item:hover { background: var(--sidebar-hover); color: var(--sidebar-fg); }
.nav-item.active {
  background: var(--sidebar-active);
  color: var(--sidebar-active-fg);
  font-weight: 600;
}
.nav-item-sub { padding-left: 26px; font-size: 12.5px; }
.nav-item.small { font-size: 12.5px; }

.nav-thread {
  display: flex;
  flex-direction: column;
  gap: 1px;
  margin: 0 4px;
  padding: 6px 10px;
  border-radius: 8px;
  color: var(--sidebar-fg);
  text-decoration: none;
  border: 1px solid transparent;
  transition: background-color 0.12s, border-color 0.12s;
}
.nav-thread:hover { background: var(--sidebar-hover); border-color: rgba(0,0,0,0.05); }
.nav-thread-label { font-size: 12px; font-weight: 600; line-height: 1.25; }
.nav-thread-preview {
  font-size: 11.5px;
  color: var(--muted-fg, #6b6b6b);
  line-height: 1.3;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.nav-icon {
  display: inline-flex;
  width: 16px;
  height: 16px;
  flex-shrink: 0;
}
.nav-icon svg { width: 16px; height: 16px; }
.nav-label { flex: 1; min-width: 0; line-height: 1.2; }

.sidebar-empty {
  margin: 8px 8px 0;
  padding: 12px 14px;
  border: 1px dashed var(--sidebar-divider);
  border-radius: 9px;
  color: var(--muted-fg);
  font-size: 12.5px;
}
.sidebar-empty p { margin: 0 0 8px; }

.sidebar-foot {
  border-top: 1px solid var(--sidebar-divider);
  padding: 10px;
}

/* Project switcher */
.project-switcher { position: relative; padding: 4px 4px 8px; }
.project-switcher-trigger {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 9px 12px;
  background: rgba(235, 231, 224, 0.55);
  border: 0;
  border-radius: 9px;
  font-size: 13px;
  font-weight: 600;
  color: var(--sidebar-fg);
  text-align: left;
}
.project-switcher-trigger .truncate {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.project-switcher-trigger:hover { background: rgba(235, 231, 224, 0.85); }
.project-switcher-trigger .chev { display: inline-flex; opacity: 0.5; }
.project-switcher-trigger .chev svg { width: 14px; height: 14px; }

.project-menu {
  /* Inline expansion — pushes the per-project nav down rather than overlapping
     it. Avoids the click-confusion that came from the popover sitting on top
     of Overview / Contract / Library / Assistant items. */
  position: static;
  margin: 6px 0 4px;
  padding: 6px;
  background: var(--surface);
  border: 1px solid var(--main-border);
  border-radius: 10px;
  box-shadow: var(--shadow-lg);
}
.project-menu-row {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 8px 10px;
  background: transparent;
  border: 0;
  border-radius: 7px;
  font-size: 13px;
  font-weight: 500;
  color: var(--main-fg);
  text-align: left;
}
.project-menu-row:hover { background: var(--accent); }
.project-menu-row.active { background: var(--accent); }
.project-menu-row.create { color: var(--muted-fg); }
.project-menu-row.create:hover { color: var(--main-fg); }
.project-menu-row svg { width: 14px; height: 14px; }
.project-menu-divider { height: 1px; background: var(--sidebar-divider); margin: 6px 0; }

.icon-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 6px;
  color: var(--muted-fg);
}
.icon-button:hover { background: var(--sidebar-hover); color: var(--main-fg); }
.icon-button svg { width: 14px; height: 14px; }

/* ---------- Main pane ---------- */

.main {
  min-width: 0;
  display: flex;
  flex-direction: column;
  background: var(--main-panel);
  border-top-left-radius: 16px;
  box-shadow: -1px 0 0 rgba(0, 0, 0, 0.02);
  min-height: 100vh;
}

.main-header {
  position: sticky;
  top: 0;
  z-index: 20;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  height: 56px;
  padding: 0 24px;
  border-bottom: 1px solid var(--main-border);
  background: rgba(255, 255, 255, 0.92);
  backdrop-filter: blur(12px);
  border-top-left-radius: 16px;
}
.header-left, .header-right {
  display: flex;
  align-items: center;
  gap: 10px;
}
.breadcrumb {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  flex-wrap: wrap;
}
.breadcrumb .crumb {
  color: rgba(26, 26, 26, 0.45);
  text-decoration: none;
}
.breadcrumb a.crumb:hover { color: var(--main-fg); text-decoration: underline; }
.breadcrumb .crumb.current { color: var(--main-fg); font-weight: 500; }
.crumb-sep {
  display: inline-flex;
  width: 14px;
  color: rgba(26, 26, 26, 0.2);
}
.crumb-sep svg { width: 14px; height: 14px; }

.page-body {
  flex: 1;
  overflow: visible;
}
.page-shell {
  width: min(1280px, calc(100% - 48px));
  margin: 0 auto;
  padding: 28px 0 56px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.page-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}
.page-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.page-title {
  margin: 0;
  font-size: 24px;
  font-weight: 700;
  letter-spacing: -0.015em;
}
.page-sub {
  margin: 4px 0 0;
  color: var(--muted-fg);
  font-size: 14px;
  max-width: 760px;
}

.section-head {
  margin-bottom: 14px;
}
.section-head.row {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
}
.section-head h3 {
  margin: 0;
  font-size: 16px;
  font-weight: 650;
}
.section-head p {
  margin: 4px 0 0;
  color: var(--muted-fg);
  font-size: 13px;
}

/* ---------- Buttons ---------- */

.dark-button, .ghost-button, .link-button, .send-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  border: 1px solid var(--main-border);
  border-radius: var(--radius-md);
  padding: 9px 14px;
  font-size: 13px;
  font-weight: 600;
  background: var(--surface);
  color: var(--main-fg);
  transition: background-color 0.14s, border-color 0.14s, color 0.14s, transform 0.06s;
}
/* Clamp child SVGs so the inline icons don't blow up to fill flex space. */
.dark-button svg, .ghost-button svg, .link-button svg, .send-button svg {
  width: 14px; height: 14px; flex-shrink: 0;
}
.send-button svg { width: 16px; height: 16px; }
.dark-button { background: var(--button); color: var(--button-fg); border-color: var(--button); }
.dark-button:hover { background: var(--button-hover); }
.dark-button:active, .ghost-button:active { transform: scale(0.985); }
.ghost-button:hover { background: var(--main-muted); }
.link-button { background: transparent; border-color: transparent; color: var(--muted-fg); padding: 6px 10px; }
.link-button:hover { color: var(--main-fg); background: var(--main-muted); }
.link-button.small { font-size: 12.5px; padding: 4px 8px; }
.compact { padding: 5px 9px; font-size: 12px; }
.ghost-button.danger { color: var(--danger); border-color: var(--danger-border); }
.ghost-button.danger:hover { background: var(--danger-bg); }
.send-button {
  width: 36px;
  height: 36px;
  padding: 0;
  background: var(--button);
  color: var(--button-fg);
  border-color: var(--button);
}
.send-button:hover { background: var(--button-hover); }

/* ---------- Cards ---------- */

.card {
  background: var(--surface);
  border: 1px solid var(--main-border);
  border-radius: 12px;
}
.card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  padding: 16px 18px;
  border-bottom: 1px solid var(--main-border);
}
.card-head h3 {
  margin: 0;
  font-size: 15px;
  font-weight: 650;
}
.card-head p {
  margin: 2px 0 0;
  color: var(--muted-fg);
  font-size: 12.5px;
}
.card-body {
  padding: 18px;
}
.card-foot {
  border-top: 1px solid var(--main-border);
  padding: 10px 18px;
  display: flex;
  justify-content: center;
  background: #fcfbf9;
  border-bottom-left-radius: 12px;
  border-bottom-right-radius: 12px;
}

.card-empty {
  background: var(--main-panel);
  border: 1px dashed var(--main-border);
  border-radius: 14px;
  padding: 56px 20px;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 12px;
}
.card-empty-icon {
  width: 56px;
  height: 56px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--main-muted);
  color: var(--muted-fg);
  border-radius: 50%;
}
.card-empty-icon svg { width: 26px; height: 26px; }
.card-empty h4 { margin: 0; font-size: 16px; font-weight: 650; }
.card-empty p { margin: 0; max-width: 460px; color: var(--muted-fg); font-size: 13.5px; }
.card-empty-actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  justify-content: center;
}
.card-empty-hint { font-size: 12px; color: var(--muted-fg); max-width: 480px; margin-top: 4px; }

/* ---------- Forms ---------- */

.text-input, .select-input, .text-area {
  width: 100%;
  border: 1px solid var(--main-border);
  border-radius: 8px;
  background: var(--surface);
  color: var(--main-fg);
  outline: none;
  transition: border-color 0.12s, box-shadow 0.12s;
}
.text-input, .select-input { height: 38px; padding: 0 12px; font-size: 13.5px; }
.select-input.compact, .text-input.compact { height: 32px; padding: 0 10px; font-size: 13px; }
.text-area {
  min-height: 120px;
  padding: 12px 14px;
  resize: vertical;
  line-height: 1.55;
  font-size: 13.5px;
}
.text-input:focus, .select-input:focus, .text-area:focus {
  border-color: var(--ring);
  box-shadow: 0 0 0 3px rgba(196, 191, 182, 0.35);
}

.input-group {
  display: flex;
  align-items: stretch;
  border: 1px solid var(--main-border);
  border-radius: 8px;
  overflow: hidden;
  background: var(--surface);
}
.input-group:focus-within {
  border-color: var(--ring);
  box-shadow: 0 0 0 3px rgba(196, 191, 182, 0.35);
}
.input-group .text-input {
  border: 0;
  border-radius: 0;
  flex: 1;
}
.input-group .prefix, .input-group .suffix {
  display: flex;
  align-items: center;
  padding: 0 12px;
  background: var(--main-muted);
  color: var(--muted-fg);
  font-size: 13px;
  font-weight: 600;
}

.form-label, .calc-form .form-label {
  display: block;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--muted-fg);
  margin-bottom: 6px;
}

.calc-form, .search-form, .context-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.calc-form label, .context-form label, .filters-grid label {
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--muted-fg);
}
/* Inputs / radio options inside an uppercase label should NOT inherit the
   uppercase + letter-spacing — that turns "The claimant" into "THE CLAIMANT". */
.calc-form .radio-option, .context-form .radio-option,
.modal-body .radio-option, .radio-group .radio-option {
  text-transform: none;
  letter-spacing: 0;
  font-weight: 500;
  color: var(--main-fg);
}
.calc-form .span-2, .context-form .span-2, .calc-form .span-all, .context-form .span-all,
.search-form .span-2, .search-form .span-all { grid-column: span 2; }

.search-form .span-all { grid-column: 1 / -1; }
.search-form select { min-width: 160px; }

.radio-group {
  display: flex;
  gap: 8px;
}
.radio-option {
  flex: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 10px 14px;
  border: 1px solid var(--main-border);
  border-radius: 8px;
  background: var(--main-panel);
  color: var(--main-fg);
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  text-transform: none;
  letter-spacing: 0;
}
.radio-option input { accent-color: var(--button); }
.radio-option:has(input:checked) {
  background: var(--accent);
  border-color: rgba(26, 26, 26, 0.3);
}

.check-line {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  text-transform: none;
  letter-spacing: 0;
  color: var(--main-fg);
  font-weight: 500;
}
.check-line input { accent-color: var(--button); }

.eot-block, .eot-block-2 {
  margin-top: 4px;
  padding: 12px;
  border: 1px solid var(--main-border);
  border-radius: 8px;
  background: #fcfbf9;
}
.eot-days {
  display: flex;
  gap: 12px;
  margin-top: 10px;
}
.eot-days label { flex: 0 0 auto; }

/* ---------- Empty state ---------- */

.empty-state {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 20px;
  border: 1px dashed var(--main-border);
  border-radius: 10px;
  background: #fcfbf9;
  color: var(--muted-fg);
}
.empty-state strong {
  color: var(--main-fg);
  font-size: 14px;
  font-weight: 650;
}
.empty-state p { margin: 0; max-width: 660px; }

/* ---------- Skeleton + thinking ---------- */

.skeleton-row {
  height: 14px;
  margin-bottom: 10px;
  border-radius: 6px;
  background: linear-gradient(90deg, #f3efea 0%, #ebe7e0 50%, #f3efea 100%);
  background-size: 200% 100%;
  animation: skeleton 1.4s ease-in-out infinite;
}
.skeleton-row:nth-child(2) { width: 80%; }
.skeleton-row:nth-child(3) { width: 60%; }
@keyframes skeleton { 0% { background-position: 0 0; } 100% { background-position: 200% 0; } }

.thinking-row {
  display: flex;
  align-items: center;
  gap: 10px;
  color: var(--muted-fg);
  font-size: 13px;
}
.thinking-dots { display: inline-flex; gap: 4px; }
.thinking-dots i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--muted-fg);
  animation: tdot 1.2s ease-in-out infinite;
}
.thinking-dots i:nth-child(2) { animation-delay: 0.15s; }
.thinking-dots i:nth-child(3) { animation-delay: 0.3s; }
@keyframes tdot {
  0%, 60%, 100% { transform: translateY(0); opacity: 0.5; }
  30% { transform: translateY(-3px); opacity: 1; }
}

/* ---------- Errors ---------- */

.error-banner {
  border: 1px solid var(--danger-border);
  background: var(--danger-bg);
  color: var(--danger);
  border-radius: 9px;
  padding: 10px 12px;
  font-size: 13px;
}

/* ---------- Home ---------- */

.home-shell {
  width: min(1280px, calc(100% - 48px));
  margin: 0 auto;
  padding: 28px 0 56px;
  display: flex;
  flex-direction: column;
  gap: 28px;
}
.home-hero {
  padding: 24px 28px;
  border: 1px solid var(--main-border);
  border-radius: 14px;
  background: linear-gradient(180deg, var(--main-muted) 0%, #ffffff 100%);
}
.home-hero h2 {
  margin: 0 0 4px;
  font-size: 22px;
  font-weight: 650;
  letter-spacing: -0.01em;
}
.home-hero p { margin: 0; color: var(--muted-fg); max-width: 620px; }

.home-section { display: flex; flex-direction: column; gap: 4px; }

.tile-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 10px;
}
.tile {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 14px 16px;
  background: var(--surface);
  border: 1px solid var(--main-border);
  border-radius: 12px;
  transition: background-color 0.12s, border-color 0.12s, transform 0.12s;
}
.tile:hover {
  background: var(--surface-hover);
  border-color: var(--ring);
  transform: translateY(-1px);
}
.tile-icon {
  display: inline-flex;
  width: 32px;
  height: 32px;
  align-items: center;
  justify-content: center;
  background: var(--accent);
  border-radius: 8px;
  color: var(--main-fg);
}
.tile-icon svg { width: 16px; height: 16px; }
.tile strong { font-size: 14px; font-weight: 650; }

.project-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.project-row {
  display: grid;
  grid-template-columns: auto 40px 1fr auto auto auto auto;
  align-items: center;
  gap: 14px;
  padding: 14px 16px;
  border: 1px solid var(--main-border);
  border-radius: 11px;
  background: var(--surface);
  text-decoration: none;
  color: inherit;
  transition: background-color 0.12s, border-color 0.12s;
}
.project-row-fav {
  background: transparent;
  border: 0;
  font-size: 16px;
  line-height: 1;
  color: rgba(0,0,0,0.25);
  cursor: pointer;
  padding: 0 4px;
}
.project-row-fav:hover { color: #d97706; }
.project-row.is-favourite .project-row-fav { color: #d97706; }
.fav-star { color: #d97706; font-size: 13px; margin-left: 2px; }
.project-menu-row-wrap {
  display: flex;
  align-items: center;
  gap: 4px;
}
.project-menu-row-fav {
  background: transparent;
  border: 0;
  font-size: 13px;
  line-height: 1;
  padding: 4px 6px;
  color: rgba(0,0,0,0.25);
  cursor: pointer;
}
.project-menu-row-fav:hover { color: #d97706; }
.project-menu-row-wrap .project-menu-row { flex: 1; }
[data-theme="dark"] .project-menu-row-fav { color: rgba(255,255,255,0.35); }
.project-row:hover {
  background: var(--surface-hover);
  border-color: var(--ring);
}
.project-row-icon {
  display: inline-flex;
  width: 36px;
  height: 36px;
  align-items: center;
  justify-content: center;
  background: var(--accent);
  border-radius: 9px;
  color: var(--main-fg);
}
.project-row-icon svg { width: 16px; height: 16px; }
.project-row-text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.project-row-text strong {
  font-size: 14px;
  font-weight: 650;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.project-row-text span {
  color: var(--muted-fg);
  font-size: 12.5px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.status-pill {
  font-size: 11.5px;
  padding: 3px 8px;
  border-radius: 999px;
  background: var(--accent);
  color: var(--muted-fg);
  white-space: nowrap;
}
.row-chev { color: var(--muted-fg); display: inline-flex; }
.row-chev svg { width: 16px; height: 16px; }

/* ---------- Research grid ---------- */

.research-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(360px, 0.85fr);
  gap: 16px;
  align-items: start;
}
.detail-panel {
  position: sticky;
  top: 76px;
  max-height: calc(100vh - 96px);
  overflow: auto;
}
.results-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.result-row {
  border: 1px solid var(--main-border);
  border-radius: 10px;
  padding: 14px 16px;
  background: var(--main-panel);
  color: var(--main-fg);
  cursor: pointer;
  transition: background-color 0.12s, border-color 0.12s;
}
.result-row:hover { background: var(--main-muted); border-color: var(--ring); }
.result-row:focus-visible { outline: 2px solid var(--ring); outline-offset: 1px; }
.result-row h4 { margin: 0 0 6px; font-size: 14px; font-weight: 650; color: var(--main-fg); }
.result-row p {
  margin: 0;
  color: var(--muted-fg);
  font-size: 13px;
  line-height: 1.55;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.result-row mark { background: var(--mark-bg); padding: 0 2px; border-radius: 2px; }
.result-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 14px;
  color: var(--muted-fg);
  font-size: 12px;
  margin-bottom: 8px;
}

.decision-meta-block {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  gap: 8px 16px;
  padding: 12px 18px 4px;
  border-top: 1px solid var(--main-border);
  background: #fcfbf7;
  font-size: 12.5px;
}
.decision-meta-block > div { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.decision-meta-block dt { color: var(--muted-fg); font-size: 11px; text-transform: uppercase; letter-spacing: 0.04em; margin: 0; }
.decision-meta-block dd { margin: 0; font-size: 13px; font-weight: 600; color: var(--main-fg); overflow: hidden; text-overflow: ellipsis; }

.decision-text {
  font-size: 13px;
  line-height: 1.7;
  color: var(--main-fg);
  font-family: ui-serif, Georgia, "Times New Roman", serif;
}
.decision-text p {
  margin: 0 0 12px;
}
.decision-text p:last-child { margin-bottom: 0; }
.decision-text-trunc { margin: 14px 0 0; font-size: 12px; }

/* Filters */
.filters {
  grid-column: 1 / -1;
  border: 1px solid var(--main-border);
  border-radius: 8px;
  background: #fcfbf9;
  padding: 0;
}
.filters[open] { padding-bottom: 12px; }
.filters > summary {
  cursor: pointer;
  list-style: none;
  padding: 8px 12px;
  font-size: 12.5px;
  color: var(--muted-fg);
  user-select: none;
}
.filters > summary::-webkit-details-marker { display: none; }
.filters-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  padding: 0 12px;
}

/* ---------- Adjudicator stats ---------- */

.adj-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 10px;
}
.adj-card {
  display: flex;
  flex-direction: column;
  gap: 4px;
  text-align: left;
  padding: 13px 14px;
  background: var(--surface);
  border: 1px solid var(--main-border);
  border-radius: 10px;
  color: var(--main-fg);
  transition: background-color 0.12s, border-color 0.12s;
}
.adj-card:hover { background: var(--surface-hover); border-color: var(--ring); }
.adj-card strong { font-size: 14px; font-weight: 650; }
.adj-card-row { color: var(--muted-fg); font-size: 12px; }
.rate-pill {
  align-self: flex-start;
  margin-top: 6px;
  padding: 2px 8px;
  background: var(--success-bg);
  border: 1px solid #a7f3d0;
  border-radius: 999px;
  color: var(--success-fg);
  font-size: 11.5px;
  font-weight: 600;
}

.metric-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}
.metric-grid.compact { gap: 8px; margin-bottom: 14px; }

.doc-list-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 14px;
  margin-bottom: 14px;
}
.doc-list-col { display: flex; flex-direction: column; gap: 6px; }
.doc-list-title {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--muted-fg, #6b6b6b);
}
.doc-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
.doc-list li { margin: 0; }
.doc-list a {
  display: flex;
  flex-direction: column;
  gap: 1px;
  padding: 6px 8px;
  border-radius: 6px;
  background: rgba(0,0,0,0.02);
  border: 1px solid rgba(0,0,0,0.05);
  text-decoration: none;
  color: inherit;
  transition: background-color 0.12s, border-color 0.12s;
}
.doc-list a:hover { background: rgba(0,0,0,0.04); border-color: rgba(0,0,0,0.1); }
.doc-list-name {
  font-size: 13px;
  font-weight: 500;
  line-height: 1.3;
  word-break: break-word;
}
.doc-list-meta {
  font-size: 11.5px;
  color: var(--muted-fg, #6b6b6b);
}
.metric {
  padding: 10px 12px;
  border: 1px solid var(--main-border);
  border-radius: 9px;
  background: #fcfbf9;
  display: flex;
  flex-direction: column;
}
.metric strong { font-size: 18px; font-weight: 700; }
.metric span { color: var(--muted-fg); font-size: 11.5px; }

.mini-list { display: flex; flex-direction: column; gap: 8px; }
.mini-item {
  border: 1px solid var(--main-border);
  border-radius: 9px;
  padding: 10px 12px;
  background: var(--surface);
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.mini-item[tabindex] { cursor: pointer; }
.mini-item[tabindex]:hover { background: var(--surface-hover); border-color: var(--ring); }
.mini-item strong { font-size: 13px; font-weight: 650; }
.mini-item span { font-size: 12px; }

/* ---------- Toolbar ---------- */

.toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

/* ---------- Due date layout ---------- */

.due-grid {
  display: grid;
  grid-template-columns: 280px minmax(0, 1fr);
  gap: 16px;
  align-items: start;
}
.scenario-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.scenario-card {
  display: flex;
  flex-direction: column;
  gap: 2px;
  text-align: left;
  background: var(--surface);
  border: 1px solid var(--main-border);
  border-radius: 10px;
  padding: 14px 16px;
  cursor: pointer;
  transition: background-color 0.12s, border-color 0.12s;
}
.scenario-card:hover { background: var(--surface-hover); border-color: var(--ring); }
.scenario-card strong { font-size: 13.5px; font-weight: 650; }
.scenario-card .muted { font-size: 12px; }
.section-tag { font-size: 11.5px; color: var(--success-fg); font-weight: 600; margin-top: 4px; }
.scenario-card.active {
  background: var(--success-bg);
  border-color: #6ee7b7;
}
.scenario-card.active .section-tag { color: var(--success-strong); }

.calc-card .card-head .loc-row {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  text-transform: none;
  letter-spacing: 0;
  font-size: 12.5px;
  color: var(--muted-fg);
}

.section-badge {
  font-size: 11px;
  font-weight: 650;
  padding: 4px 10px;
  border-radius: 999px;
  background: var(--success-bg);
  color: var(--success-strong);
  border: 1px solid #a7f3d0;
}

.provision {
  margin: 0 18px 14px;
  border: 1px solid var(--main-border);
  border-radius: 9px;
  background: #fcfbf9;
  font-size: 12.5px;
  color: var(--muted-fg);
}
.provision summary {
  cursor: pointer;
  list-style: none;
  padding: 10px 14px;
  font-weight: 600;
  color: var(--success-fg);
  user-select: none;
}
.provision summary::-webkit-details-marker { display: none; }
.provision summary::before {
  content: "";
  display: inline-block;
  border-left: 5px solid currentColor;
  border-top: 4px solid transparent;
  border-bottom: 4px solid transparent;
  margin-right: 8px;
  transition: transform 0.2s;
}
.provision[open] summary::before { transform: rotate(90deg); }
.provision-body { padding: 0 14px 12px; line-height: 1.7; }
.provision-body p { margin: 0 0 6px; }

.calc-result {
  border: 1px solid var(--main-border);
  border-radius: 10px;
  background: #fcfbf9;
  padding: 16px;
}
.calc-result-tag {
  display: inline-block;
  padding: 2px 8px;
  background: var(--accent);
  border-radius: 999px;
  font-size: 11px;
  font-weight: 650;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--muted-fg);
  margin-bottom: 8px;
}
.calc-result strong {
  display: block;
  font-size: 22px;
  font-weight: 700;
  color: var(--success-fg);
  margin-bottom: 6px;
}
.calc-result p { margin: 0 0 12px; color: var(--muted-fg); }
.calc-result dl {
  display: grid;
  grid-template-columns: 180px minmax(0, 1fr);
  gap: 6px 14px;
  margin: 0 0 14px;
}
.calc-result dt { color: var(--muted-fg); font-size: 12px; }
.calc-result dd { margin: 0; font-size: 13px; }

/* ---------- Interest layout ---------- */

.interest-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 16px;
  align-items: start;
}
.tab-strip {
  display: flex;
  background: var(--accent);
  border-radius: 10px;
  padding: 3px;
  margin-bottom: 18px;
}
.tab-strip-btn {
  flex: 1;
  padding: 8px 14px;
  background: transparent;
  border: 0;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 600;
  color: var(--muted-fg);
}
.tab-strip-btn.active {
  background: var(--surface);
  color: var(--main-fg);
  box-shadow: var(--shadow-sm);
}

.interest-result { font-size: 13.5px; }
.result-headline {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 14px 16px;
  border-radius: 10px;
  background: var(--success-bg);
  border: 1px solid #a7f3d0;
  margin-bottom: 16px;
}
.result-headline strong {
  font-size: 26px;
  font-weight: 700;
  color: var(--success-strong);
}
.result-headline .muted { color: var(--success-strong); opacity: 0.75; }

.result-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
.result-table td {
  padding: 8px 0;
  border-bottom: 1px solid var(--main-border);
}
.result-table td:first-child { color: var(--muted-fg); }
.result-table td:last-child { text-align: right; font-weight: 600; }
.result-table tr:last-child td { border-bottom: 0; }
.result-total {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px 0 0;
  border-top: 1px solid var(--main-border);
  margin-top: 6px;
  font-size: 15px;
}
.result-total strong { font-size: 18px; font-weight: 700; color: var(--success-strong); }

.breakdown { margin-top: 16px; border-top: 1px solid var(--main-border); padding-top: 12px; }
.breakdown-toggle {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: var(--main-muted);
  border: 1px solid var(--main-border);
  border-radius: 8px;
  padding: 10px 14px;
  font-size: 13px;
  font-weight: 600;
  color: var(--main-fg);
}
.breakdown-toggle .chev { display: inline-flex; transition: transform 0.2s; }
.breakdown-toggle .chev svg { width: 14px; height: 14px; }
.breakdown-toggle.open .chev { transform: rotate(180deg); }
.breakdown-body {
  border: 1px solid var(--main-border);
  border-top: 0;
  border-radius: 0 0 8px 8px;
  max-height: 360px;
  overflow: auto;
}
.breakdown-table { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.breakdown-table th {
  text-align: left;
  background: var(--main-muted);
  color: var(--muted-fg);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-size: 10.5px;
  padding: 8px 12px;
  border-bottom: 1px solid var(--main-border);
}
.breakdown-table th.num, .breakdown-table td.num { text-align: right; }
.breakdown-table td { padding: 7px 12px; border-bottom: 1px solid #f4ede4; font-variant-numeric: tabular-nums; }

/* ---------- Project workspace ---------- */

.project-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}
.project-grid .span-all { grid-column: 1 / -1; }

.kv {
  display: grid;
  grid-template-columns: 160px minmax(0, 1fr);
  gap: 8px 16px;
  margin: 0;
}
.kv dt { color: var(--muted-fg); font-size: 12.5px; }
.kv dd { margin: 0; font-size: 13.5px; font-weight: 500; }

.quick-link-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 14px;
}

.recent-list { display: flex; flex-direction: column; gap: 8px; }
.recent-item {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 10px 12px;
  border: 1px solid var(--main-border);
  border-radius: 9px;
  background: var(--surface);
}
.recent-item:hover { background: var(--surface-hover); }
.recent-item strong { font-size: 13px; font-weight: 600; }
.recent-item .muted { font-size: 12px; }

/* ---------- Context manager ---------- */

.context-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 16px;
  align-items: start;
}
.context-form .text-area { min-height: 180px; }
.file-zone { display: flex; flex-direction: column; gap: 6px; }
.file-zone-label {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 16px;
  border: 1px dashed var(--main-border);
  border-radius: 10px;
  background: var(--surface);
  color: var(--muted-fg);
  cursor: pointer;
  font-size: 13px;
  font-weight: 500;
  text-transform: none;
  letter-spacing: 0;
}
.file-zone-label:hover { background: var(--surface-hover); border-color: var(--ring); color: var(--main-fg); }
.file-zone.drag-over .file-zone-label { background: var(--success-bg); border-color: #10b981; color: var(--success-strong); }
.file-zone-label svg { width: 18px; height: 18px; }
.file-zone-label input { display: none; }
.file-status { font-size: 12.5px; }

.context-list { display: flex; flex-direction: column; gap: 10px; max-height: 540px; overflow: auto; }
.context-item {
  border: 1px solid var(--main-border);
  border-radius: 10px;
  padding: 12px 14px;
  background: var(--surface);
}
.context-item-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 6px;
}
.context-item-actions { display: flex; gap: 8px; margin-top: 8px; }
.context-item details summary { cursor: pointer; color: var(--muted-fg); font-size: 12px; }
.context-item details pre {
  margin: 8px 0 0;
  padding: 10px;
  background: var(--main-muted);
  border: 1px solid var(--main-border);
  border-radius: 8px;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 12px;
  white-space: pre-wrap;
  max-height: 280px;
  overflow: auto;
}

/* ---------- Chat ---------- */

.chat-shell { gap: 14px; }
.chat-page-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
}
.chat-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 16px;
  align-items: stretch;
  min-height: calc(100vh - 220px);
}
.chat-layout.with-helper {
  grid-template-columns: minmax(0, 1fr) 280px;
}
.chat-pane {
  display: flex;
  flex-direction: column;
  min-height: 480px;
  background: var(--surface);
  border: 1px solid var(--main-border);
  border-radius: 16px;
  overflow: hidden;
}

.chat-empty {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 18px;
  padding: 48px 24px;
  text-align: center;
}
.chat-empty-title {
  margin: 0;
  font-size: 36px;
  font-weight: 300;
  letter-spacing: -0.02em;
}
.chat-empty-sub {
  margin: 0;
  max-width: 540px;
  color: var(--muted-fg);
  font-size: 14px;
}

.composer-card {
  width: min(680px, 100%);
  background: var(--main-muted);
  border: 1px solid var(--main-border);
  border-radius: 16px;
  overflow: hidden;
}
.composer-card .composer-row {
  display: flex;
  align-items: flex-end;
  gap: 6px;
  padding: 12px 14px 6px;
}
.composer-card textarea {
  flex: 1;
  min-height: 70px;
  border: 0;
  background: transparent;
  resize: none;
  padding: 4px 4px 0;
}
.composer-card textarea:focus { box-shadow: none; }
.composer-card .icon-button { background: transparent; }

.composer-active {
  margin: 12px 16px 14px;
  background: var(--surface);
  border: 1px solid var(--main-border);
  border-radius: 14px;
  box-shadow: var(--shadow-sm);
}
.composer-active .composer-row {
  display: flex;
  align-items: flex-end;
  gap: 6px;
  padding: 10px 12px 4px;
}
.composer-active textarea {
  flex: 1;
  min-height: 36px;
  border: 0;
  background: transparent;
  resize: none;
  padding: 6px 4px;
}
.composer-active textarea:focus { box-shadow: none; }

.composer-row textarea { outline: none; font-size: 14px; line-height: 1.55; color: var(--main-fg); }
.composer-row .icon-button { width: 32px; height: 32px; }
.composer-row .icon-button svg { width: 16px; height: 16px; }
.composer-row .send-button { flex-shrink: 0; }

.composer-meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  padding: 6px 14px 12px;
  font-size: 11.5px;
}
.composer-meta .check {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--muted-fg);
}
.composer-meta .check input { accent-color: var(--button); }
.composer-meta .kbd-hint { margin-left: auto; }

.starter-chips {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
  max-width: 720px;
}
.starter-chip {
  padding: 8px 14px;
  border-radius: 999px;
  border: 1px solid var(--main-border);
  background: var(--surface);
  color: var(--muted-fg);
  font-size: 12.5px;
  font-weight: 500;
}
.starter-chip:hover { color: var(--main-fg); border-color: var(--ring); }

.chat-stream-wrap {
  flex: 1;
  overflow-y: auto;
  padding: 20px 0;
  background: var(--surface);
}
.chat-stream { width: min(720px, calc(100% - 32px)); margin: 0 auto; display: flex; flex-direction: column; gap: 16px; }
.message-stack { display: flex; flex-direction: column; gap: 18px; }

.message { display: flex; }
.msg-user { justify-content: flex-end; }
.msg-user .bubble {
  max-width: 88%;
  padding: 10px 14px;
  background: var(--accent);
  color: var(--main-fg);
  border-radius: 14px 14px 4px 14px;
  font-size: 14px;
  line-height: 1.55;
  white-space: pre-wrap;
}
.msg-assistant { justify-content: flex-start; }
.msg-assistant .message-body {
  max-width: 92%;
  font-size: 14px;
  line-height: 1.65;
}
.message-body .md > *:first-child { margin-top: 0; }
.message-body .md > *:last-child { margin-bottom: 0; }
.message-body .md p { margin: 0 0 8px; line-height: 1.55; }
.message-body .md h3 { font-size: 15px; font-weight: 650; margin: 14px 0 6px; }
.message-body .md h4 { font-size: 13.5px; font-weight: 650; margin: 12px 0 4px; }
.message-body .md ul, .message-body .md ol {
  margin: 4px 0 8px;
  padding-left: 20px;
}
.message-body .md li { margin-bottom: 2px; line-height: 1.5; }
.message-body .md li > p { margin: 0 0 4px; }
.message-body .md code {
  background: var(--accent);
  padding: 1px 6px;
  border-radius: 4px;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 12.5px;
}
.message-body .md em { font-style: italic; }
.message-body .md a { color: var(--focus); text-decoration: underline; text-underline-offset: 2px; }
.message-actions { display: inline-flex; margin-top: 8px; }

/* ---------- Helper panel (agent only) ---------- */

.helper-panel { display: flex; flex-direction: column; gap: 12px; }
.helper-card {
  background: var(--surface);
  border: 1px solid var(--main-border);
  border-radius: 12px;
  padding: 14px 16px;
}
.helper-card h4,
.helper-card summary {
  margin: 0;
  font-size: 11.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--muted-fg);
}
/* Collapsible variant — uses <details>/<summary>. */
.helper-card summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
  list-style: none;
  user-select: none;
  padding-bottom: 0;
}
.helper-card summary::-webkit-details-marker { display: none; }
.helper-card summary::after {
  content: "+";
  display: inline-flex;
  width: 16px;
  height: 16px;
  align-items: center;
  justify-content: center;
  border-radius: 4px;
  background: var(--main-muted);
  color: var(--muted-fg);
  font-weight: 600;
}
.helper-card[open] summary::after { content: "−"; }
.helper-card[open] summary { margin-bottom: 8px; }
.helper-card ul { margin: 0; padding-left: 20px; font-size: 13px; line-height: 1.6; }
.helper-card .muted { font-size: 12.5px; }
.helper-actions { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }

/* ---------- Mode tabs ---------- */

.mode-tabs {
  display: inline-flex;
  align-items: center;
  background: var(--accent);
  border-radius: 10px;
  padding: 3px;
  gap: 3px;
}
.mode-tab {
  padding: 6px 14px;
  background: transparent;
  border: 0;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 600;
  color: var(--muted-fg);
}
.mode-tab.active {
  background: var(--surface);
  color: var(--main-fg);
  box-shadow: var(--shadow-sm);
}

/* ---------- Modal ---------- */

.modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 80;
  background: rgba(15, 17, 20, 0.45);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 18px;
  animation: fade 0.16s ease-out;
}
@keyframes fade { from { opacity: 0; } to { opacity: 1; } }
.modal {
  width: min(560px, 100%);
  background: var(--surface);
  border-radius: 16px;
  box-shadow: var(--shadow-lg);
  overflow: hidden;
}

.modal-backdrop:has(.doc-drawer) {
  align-items: stretch;
  justify-content: flex-end;
  padding: 0;
}

.palette-hint-btn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 8px;
  border-radius: 6px;
  background: rgba(0,0,0,0.04);
  border: 1px solid rgba(0,0,0,0.08);
  cursor: pointer;
  font-family: inherit;
}
.palette-hint-btn:hover { background: rgba(0,0,0,0.08); }
.theme-toggle-label { font-size: 12px; font-weight: 500; color: var(--main-fg); letter-spacing: 0.01em; }
[data-theme="dark"] .theme-toggle-label { color: var(--main-fg); }
@media (max-width: 720px) { .theme-toggle-label { display: none; } }
.kbd-key {
  font-size: 11px;
  font-weight: 600;
  color: var(--muted-fg, #6b6b6b);
  font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  letter-spacing: 0.04em;
}
.composer-textarea-wrap {
  position: relative;
  flex: 1;
  display: flex;
  flex-direction: column;
}
.composer-textarea-wrap textarea { width: 100%; }
.doc-mention-pop {
  position: absolute;
  bottom: calc(100% + 6px);
  left: 0;
  right: 0;
  max-height: 240px;
  overflow-y: auto;
  background: var(--surface);
  border: 1px solid rgba(0,0,0,0.08);
  border-radius: 10px;
  box-shadow: 0 8px 24px rgba(15,17,20,0.14);
  z-index: 60;
  padding: 4px;
}
.doc-mention-pop[hidden] { display: none; }
.doc-mention-row {
  display: grid;
  grid-template-columns: 70px 1fr auto;
  align-items: center;
  gap: 8px;
  width: 100%;
  padding: 7px 9px;
  border: 0;
  background: transparent;
  border-radius: 7px;
  text-align: left;
  cursor: pointer;
  font-size: 13px;
  color: inherit;
}
.doc-mention-row:hover, .doc-mention-row.active { background: rgba(0,0,0,0.04); }
.doc-mention-bucket {
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--muted-fg, #6b6b6b);
}
.doc-mention-name { font-weight: 500; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.doc-mention-meta { font-size: 11.5px; color: var(--muted-fg, #6b6b6b); }
.doc-mention-empty { padding: 12px; color: var(--muted-fg, #6b6b6b); font-size: 12.5px; text-align: center; }
.ref-tags { display: inline-flex; flex-wrap: wrap; gap: 4px; }
.ref-tag {
  display: inline-flex;
  align-items: center;
  padding: 2px 8px;
  border-radius: 999px;
  background: #eef2ff;
  color: #3730a3;
  font-size: 11px;
  font-weight: 600;
  border: 1px solid #c7d2fe;
}

.analysis-history-row {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 8px;
}
.analysis-history-row .select-input.compact {
  font-size: 12px;
  padding: 4px 8px;
  width: auto;
  flex: 1;
  max-width: 360px;
}

.projects-tabs {
  display: flex;
  gap: 4px;
  margin-bottom: 12px;
  border-bottom: 1px solid rgba(0,0,0,0.08);
}
.projects-tab {
  padding: 8px 14px;
  font-size: 13px;
  font-weight: 500;
  color: var(--muted-fg, #6b6b6b);
  text-decoration: none;
  border-bottom: 2px solid transparent;
  margin-bottom: -1px;
  transition: color 0.12s, border-color 0.12s;
}
.projects-tab:hover { color: inherit; }
.projects-tab.active { color: inherit; border-bottom-color: currentColor; font-weight: 600; }

.archived-row {
  display: grid !important;
  grid-template-columns: 40px 1fr auto auto;
  gap: 12px;
  align-items: center;
  padding: 14px 16px;
  border-radius: 12px;
  background: rgba(0,0,0,0.02);
  border: 1px solid rgba(0,0,0,0.06);
  cursor: default;
  margin-bottom: 8px;
}

.pin-badge {
  display: inline-block;
  font-size: 9.5px;
  font-weight: 700;
  letter-spacing: 0.06em;
  padding: 1px 5px;
  border-radius: 3px;
  background: #fef3c7;
  color: var(--warn-fg);
  vertical-align: middle;
}

.doc-tag-row {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 6px;
  align-items: center;
}
.doc-tag {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 8px;
  border-radius: 999px;
  background: #eef2ff;
  color: #3730a3;
  font-size: 11px;
  font-weight: 600;
  border: 1px solid #c7d2fe;
}
.doc-tag-x {
  background: transparent;
  border: 0;
  padding: 0;
  color: inherit;
  font-size: 13px;
  line-height: 1;
  cursor: pointer;
  margin-left: 2px;
}
.doc-tag-add {
  font-size: 11px;
  padding: 2px 6px;
  border-radius: 6px;
}

.tag-filter-row {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  padding: 8px 18px 0;
}
.tag-filter {
  font-size: 12px;
  padding: 3px 10px;
  border-radius: 999px;
  background: rgba(0,0,0,0.04);
  color: var(--muted-fg, #6b6b6b);
  text-decoration: none;
  border: 1px solid transparent;
}
.tag-filter:hover { background: rgba(0,0,0,0.08); }
.tag-filter.active { background: #1f2937; color: #fff; }

.context-item.is-pinned { border-left: 3px solid #f59e0b; padding-left: 10px; }
.doc-pin-on { background: #fef3c7 !important; border-color: #f59e0b !important; color: var(--warn-fg) !important; }

.citation-chip {
  display: inline-flex;
  align-items: center;
  padding: 1px 8px;
  border-radius: 999px;
  background: #eef2ff;
  color: #3730a3;
  font-size: 12px;
  font-weight: 600;
  border: 1px solid #c7d2fe;
  cursor: pointer;
  margin: 0 2px;
  font-family: inherit;
  vertical-align: baseline;
}
.citation-chip:hover { background: #e0e7ff; }
.citation-unknown { background: rgba(0,0,0,0.04); color: var(--muted-fg, #6b6b6b); border-color: rgba(0,0,0,0.08); cursor: default; }

.pinned-row {
  margin-bottom: 14px;
  padding: 10px 12px;
  border-radius: 10px;
  background: var(--warn-bg);
  border: 1px solid #fde68a;
}
.pinned-row-title {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 11.5px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--warn-fg);
  margin-bottom: 6px;
}
.pinned-row-title svg { width: 14px; height: 14px; }
.pinned-row .doc-list a { background: var(--surface); }

.home-hero-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}
.whatsnew-btn {
  flex-shrink: 0;
  margin-top: 4px;
}

.shortcut-modal { width: min(560px, 100%); }
.shortcut-body {
  padding: 12px 20px 20px !important;
  display: flex;
  flex-direction: column;
  gap: 14px !important;
}
.shortcut-group-title {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--muted-fg, #6b6b6b);
  margin-bottom: 6px;
}
.shortcut-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
.shortcut-row {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 6px 8px;
  border-radius: 6px;
}
.shortcut-row:hover { background: rgba(0,0,0,0.03); }
.shortcut-keys {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  flex-shrink: 0;
  min-width: 130px;
}
.shortcut-keys kbd {
  display: inline-flex;
  align-items: center;
  padding: 2px 6px;
  border-radius: 4px;
  background: rgba(0,0,0,0.05);
  border: 1px solid rgba(0,0,0,0.08);
  border-bottom-width: 2px;
  font-size: 11px;
  font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  font-weight: 600;
  color: var(--main-fg, #1a1a1a);
}
.shortcut-plus { font-size: 11px; color: var(--muted-fg, #6b6b6b); }
.shortcut-label { font-size: 13px; }

.whatsnew-modal { width: min(620px, 100%); }
.whatsnew-body {
  padding: 8px 20px 20px !important;
  display: flex;
  flex-direction: column;
  gap: 18px !important;
  max-height: 70vh;
  overflow-y: auto;
}
.whatsnew-entry { padding: 4px 0; }
.whatsnew-entry header { display: flex; align-items: baseline; gap: 8px; margin-bottom: 4px; }
.whatsnew-entry h3 { margin: 0; font-size: 14px; font-weight: 600; }
.whatsnew-date {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--muted-fg, #6b6b6b);
}
.whatsnew-entry p { margin: 0; font-size: 13px; line-height: 1.55; color: #2c2c2c; }

.nav-thread-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
}
.nav-thread-pin {
  background: transparent;
  border: 0;
  padding: 0 2px;
  font-size: 13px;
  color: #d97706;
  cursor: pointer;
  line-height: 1;
}
.nav-thread.is-pinned { background: rgba(245, 158, 11, 0.06); }
.nav-thread.is-pinned .nav-thread-pin { color: #d97706; }
.nav-thread:not(.is-pinned) .nav-thread-pin { color: rgba(0,0,0,0.25); }
.nav-thread:not(.is-pinned) .nav-thread-pin:hover { color: #d97706; }

.recent-item-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
}
.recent-pin-btn {
  background: transparent;
  border: 0;
  padding: 0 2px;
  font-size: 14px;
  color: rgba(0,0,0,0.25);
  cursor: pointer;
  line-height: 1;
  flex-shrink: 0;
}
.recent-pin-btn:hover { color: #d97706; }
.recent-item.is-pinned { border-left: 3px solid #f59e0b; padding-left: 13px; }
.recent-item.is-pinned .recent-pin-btn { color: #d97706; }

.storage-footer {
  margin-top: 28px;
  padding: 14px 16px;
  border-radius: 10px;
  background: var(--main-muted);
  border: 1px solid var(--main-border);
}
.storage-bar {
  width: 100%;
  height: 6px;
  background: rgba(0,0,0,0.06);
  border-radius: 999px;
  overflow: hidden;
  margin-bottom: 6px;
}
.storage-bar-fill {
  height: 100%;
  background: var(--focus, #1f6f5f);
  transition: width 0.2s;
}
.storage-bar-fill.high { background: #f59e0b; }

.category-pill {
  display: inline-flex;
  align-items: center;
  padding: 2px 9px;
  border-radius: 999px;
  background: #eef2ff;
  color: #3730a3;
  font-size: 11px;
  font-weight: 600;
  border: 1px solid #c7d2fe;
}
[data-theme="dark"] .category-pill { background: rgba(99, 102, 241, 0.18); color: #c7d2fe; border-color: rgba(199, 210, 254, 0.3); }

.notes-textarea {
  width: 100%;
  min-height: 100px;
  resize: vertical;
  font-family: inherit;
  font-size: 13.5px;
  line-height: 1.55;
}
.notes-status { font-size: 12px; }

.bulk-toolbar {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 12px;
  padding: 8px 12px;
  border-radius: 8px;
  background: rgba(0,0,0,0.03);
  border: 1px solid rgba(0,0,0,0.06);
  font-size: 13px;
}
.bulk-toolbar.active { background: #eef2ff; border-color: #c7d2fe; }
[data-theme="dark"] .bulk-toolbar { background: rgba(255,255,255,0.04); border-color: var(--main-border); }
[data-theme="dark"] .bulk-toolbar.active { background: rgba(99,102,241,0.18); border-color: rgba(199,210,254,0.3); }
.bulk-select-all { display: inline-flex; align-items: center; gap: 6px; cursor: pointer; user-select: none; }
.bulk-select-all input { margin: 0; }

.project-row-check {
  display: inline-flex;
  align-items: center;
  padding: 0 4px 0 0;
  cursor: pointer;
}
.project-row-check input { margin: 0; cursor: pointer; transform: scale(1.1); }
.project-row.is-selected,
.archived-row.is-selected {
  background: rgba(99,102,241,0.06);
  border-color: rgba(99,102,241,0.3);
}

.saved-search-edit {
  font-size: 12px;
  line-height: 1;
  color: var(--muted-fg, #6b6b6b);
  padding: 0 2px;
  cursor: pointer;
}
.saved-search-edit:hover { color: var(--main-fg); }

.split-action {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  border-radius: 8px;
  background: #f5f3ff;
  border: 1px solid #ddd6fe;
}
.split-action[hidden] { display: none; }
.split-status { font-size: 12px; color: #5b21b6; }

.saved-search-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin: 12px 0 4px;
}
.saved-search-eyebrow {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--muted-fg, #6b6b6b);
  margin-right: 4px;
}
.saved-search-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px 4px 12px;
  border-radius: 999px;
  background: rgba(0,0,0,0.04);
  border: 1px solid rgba(0,0,0,0.08);
  font-size: 12px;
  font-weight: 500;
  color: inherit;
  cursor: pointer;
  transition: background-color 0.12s;
}
.saved-search-chip:hover { background: rgba(0,0,0,0.08); }
.saved-search-x {
  font-size: 14px;
  line-height: 1;
  color: var(--muted-fg, #6b6b6b);
  padding: 0 2px;
  cursor: pointer;
}
.saved-search-x:hover { color: #991b1b; }

.palette-backdrop {
  align-items: flex-start;
  padding-top: 14vh;
}
.palette {
  width: min(640px, 100%);
  background: var(--surface);
  border-radius: 14px;
  box-shadow: 0 24px 60px rgba(15, 17, 20, 0.28);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  max-height: 60vh;
}
.palette-input-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  border-bottom: 1px solid rgba(0,0,0,0.06);
}
.palette-icon { color: var(--muted-fg, #6b6b6b); display: inline-flex; }
.palette-icon svg { width: 17px; height: 17px; }
.palette-input {
  flex: 1;
  border: 0;
  outline: none;
  font-size: 15px;
  background: transparent;
  font-family: inherit;
}
.palette-kbd {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.05em;
  padding: 2px 8px;
  border-radius: 5px;
  background: rgba(0,0,0,0.05);
  color: var(--muted-fg, #6b6b6b);
}
.palette-list {
  list-style: none;
  margin: 0;
  padding: 6px;
  overflow-y: auto;
  flex: 1;
}
.palette-empty { padding: 18px; color: var(--muted-fg, #6b6b6b); font-size: 13px; text-align: center; }
.palette-item {
  display: grid;
  grid-template-columns: 90px 1fr auto;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  border-radius: 8px;
  cursor: pointer;
  font-size: 13px;
}
.palette-item.active { background: rgba(0,0,0,0.04); }
.palette-section {
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--muted-fg, #6b6b6b);
}
.palette-label { font-weight: 500; }
.palette-hint { font-size: 11.5px; color: var(--muted-fg, #6b6b6b); text-align: right; }
@media (max-width: 620px) {
  .palette { max-height: 80vh; }
  .palette-item { grid-template-columns: 70px 1fr; }
  .palette-hint { grid-column: 2; text-align: left; }
}
.doc-drawer {
  width: min(560px, 100%);
  height: 100%;
  background: var(--surface);
  display: flex;
  flex-direction: column;
  box-shadow: var(--shadow-lg);
  animation: drawer-in 0.18s ease-out;
}
@keyframes drawer-in { from { transform: translateX(20px); opacity: 0.4; } to { transform: none; opacity: 1; } }
.doc-drawer-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding: 22px 24px 14px;
  border-bottom: 1px solid rgba(0,0,0,0.06);
}
.doc-drawer-head h2 { margin: 4px 0 0; font-size: 17px; font-weight: 650; line-height: 1.3; }
.doc-drawer-eyebrow {
  margin: 0;
  font-size: 11px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  font-weight: 600;
  color: var(--muted-fg, #6b6b6b);
}
.doc-drawer-meta { margin: 6px 0 0; font-size: 12px; }
.doc-drawer-body {
  flex: 1;
  overflow-y: auto;
  padding: 16px 24px 24px;
}
.doc-drawer-text {
  margin: 0;
  font-family: var(--font-mono, ui-monospace, "SF Mono", Menlo, Consolas, monospace);
  font-size: 12.5px;
  line-height: 1.55;
  white-space: pre-wrap;
  color: #2c2c2c;
  background: rgba(0,0,0,0.02);
  border: 1px solid rgba(0,0,0,0.06);
  border-radius: 8px;
  padding: 14px 16px;
}
.doc-drawer-foot {
  display: flex;
  gap: 8px;
  padding: 12px 24px 18px;
  border-top: 1px solid rgba(0,0,0,0.06);
  background: rgba(0,0,0,0.015);
}
.doc-drawer-head-text { flex: 1; min-width: 0; }
.doc-drawer-name-input {
  font-size: 15px;
  font-weight: 600;
  width: 100%;
  margin-top: 2px;
}
.doc-drawer-text-input {
  font-family: var(--font-mono, ui-monospace, "SF Mono", Menlo, Consolas, monospace);
  font-size: 12.5px;
  line-height: 1.55;
  width: 100%;
  min-height: 320px;
  resize: vertical;
}
.context-item-title-btn {
  background: none;
  border: 0;
  padding: 0;
  margin: 0;
  font: inherit;
  color: inherit;
  cursor: pointer;
  text-align: left;
  display: inline-flex;
}
.context-item-title-btn:hover strong { text-decoration: underline; text-underline-offset: 3px; }
.context-item-title-btn strong { font-size: 14px; }
@media (max-width: 620px) {
  .doc-drawer { width: 100%; }
  .doc-drawer-head, .doc-drawer-body, .doc-drawer-foot { padding-left: 16px; padding-right: 16px; }
}

.resume-chip {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  margin-top: 16px;
  padding: 10px 14px;
  background: linear-gradient(135deg, #ecfdf5 0%, #f0fdf4 100%);
  border: 1px solid #a7f3d0;
  border-radius: 12px;
  text-decoration: none;
  color: inherit;
  transition: transform 0.12s, box-shadow 0.12s;
  max-width: 100%;
}
.resume-chip:hover { transform: translateY(-1px); box-shadow: 0 6px 16px rgba(16, 185, 129, 0.18); }
.resume-chip-icon {
  display: inline-flex;
  width: 28px; height: 28px;
  align-items: center; justify-content: center;
  border-radius: 8px;
  background: var(--success-mute);
  color: var(--success-fg);
  flex-shrink: 0;
}
.resume-chip-icon svg { width: 16px; height: 16px; }
.resume-chip-body { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.resume-chip-body strong { font-size: 13.5px; font-weight: 600; color: var(--success-strong); }
.resume-chip-body .muted { font-size: 12px; }
.resume-chip-preview {
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  font-size: 12px;
  color: #374151;
  margin-top: 2px;
}
.resume-chip-chev {
  display: inline-flex;
  width: 18px; height: 18px;
  color: var(--success-fg);
  flex-shrink: 0;
}
.resume-chip-chev svg { width: 16px; height: 16px; }
@media (max-width: 620px) {
  .resume-chip { display: flex; }
}
.modal-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 18px 20px 8px;
}
.modal-head h2 { margin: 0; font-size: 17px; font-weight: 650; }
.modal-body {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 8px 20px 20px;
}
.modal-body label {
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--muted-fg);
}
.modal-body .row-2 {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}
.modal-body .span-all { grid-column: 1 / -1; }
.modal-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 6px;
}

/* ---------- Mobile ---------- */

.mobile-toggle { display: none; }
.mobile-backdrop { display: none; }

@media (max-width: 980px) {
  .sopal-shell { grid-template-columns: 1fr; }
  .sopal-sidebar {
    position: fixed;
    inset: 0 auto 0 0;
    width: 280px;
    transform: translateX(-100%);
    transition: transform 0.22s ease-out;
    box-shadow: var(--shadow-lg);
    background: var(--sidebar-bg);
  }
  .sopal-shell.drawer-open .sopal-sidebar { transform: translateX(0); }
  .sopal-shell.drawer-open .mobile-backdrop {
    display: block;
    position: fixed;
    inset: 0;
    background: rgba(15, 17, 20, 0.4);
    z-index: 25;
  }
  .main { border-top-left-radius: 0; }
  .main-header { border-top-left-radius: 0; }
  .mobile-toggle { display: inline-flex; }
  .research-grid, .stats-grid-shell, .due-grid, .interest-grid, .context-grid, .project-grid, .chat-layout.with-helper {
    grid-template-columns: 1fr;
  }
  .detail-panel { position: static; max-height: none; }
  .filters-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .scenario-list { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; }
  .helper-panel { order: -1; }
}

@media (max-width: 620px) {
  .main-header { padding: 0 14px; }
  .page-shell { width: calc(100% - 28px); padding: 18px 0 40px; }
  .home-tiles, .tile-grid { grid-template-columns: 1fr; }
  .filters-grid { grid-template-columns: 1fr; }
  .scenario-list { grid-template-columns: 1fr; }
  .modal-body .row-2 { grid-template-columns: 1fr; }
  .calc-result dl { grid-template-columns: 130px minmax(0, 1fr); }
  .chat-empty-title { font-size: 28px; }
}

/* ---------- Visual fixes (post v2 audit) ---------- */

/* Sidebar "+ New context" was wrapping; let the icon and label stay on one line. */
.new-project { white-space: nowrap; padding: 9px 10px; gap: 6px; }
.dark-button, .ghost-button, .link-button, .send-button { white-space: nowrap; }

/* Top-of-content page title was duplicating the header breadcrumb; visually
   muted versions look cleaner. The h1 stays for SEO/structure but is smaller
   in the page body when a breadcrumb is also above it. */
.page-shell .page-title { font-size: 22px; }

/* Decision search: search button was filling a 1fr grid track. Pin it. */
.search-form .dark-button { width: 160px; justify-self: end; }
.search-form .select-input { max-width: 220px; }

/* Filters details was rendering as an empty bordered shell. Tidy it. */
.filters {
  margin-top: 0;
  background: #fdfcf9;
  border-radius: 9px;
}
.filters[open] { padding: 0 12px 12px; }
.filters > summary {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 0 4px;
  font-weight: 600;
  color: var(--main-fg);
}
.filters > summary::before {
  content: "+";
  display: inline-flex;
  width: 16px;
  height: 16px;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--main-border);
  border-radius: 4px;
  font-size: 13px;
  line-height: 1;
  color: var(--muted-fg);
}
.filters[open] > summary::before { content: "−"; }

/* ============ Decision Search v2: borderless search bar + pager ============
   Replaces the old card-wrapped form (heavy border) with a clean two-row
   layout: large search input + Search button on top, sort/filters/save on
   the second row. Pager controls below the result list (and a copy at the
   top of the list when there's overflow) replace the old "Load more" CTA. */

.search-form-v2 {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.search-row-main {
  display: flex;
  gap: 10px;
  align-items: stretch;
}
.search-row-main .text-input {
  flex: 1;
  font-size: 15px;
  height: 44px;
  border-radius: 10px;
}
.search-row-main .dark-button {
  height: 44px;
  padding: 0 22px;
  border-radius: 10px;
}
.search-row-meta {
  display: flex;
  gap: 14px;
  align-items: center;
  flex-wrap: wrap;
}
.search-meta-label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12.5px;
  color: var(--muted-fg);
}
.search-meta-label .select-input {
  height: 30px;
  padding: 2px 26px 2px 10px;
  font-size: 12.5px;
  border-radius: 7px;
}
.filters-v2 {
  position: relative;
}
.filters-v2 > summary {
  list-style: none;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  border: 1px solid var(--main-border);
  border-radius: 999px;
  font-size: 12.5px;
  font-weight: 500;
  color: var(--main-fg);
  background: transparent;
  transition: background-color 0.12s, border-color 0.12s;
}
.filters-v2 > summary::-webkit-details-marker { display: none; }
.filters-v2 > summary::marker { content: ""; }
.filters-v2 > summary:hover { background: rgba(0,0,0,0.03); }
.filters-v2[open] > summary { background: var(--main-muted); border-color: var(--ring); }
.filters-v2 > summary::after {
  content: "▾";
  font-size: 10px;
  color: var(--muted-fg);
  transition: transform 0.15s;
}
.filters-v2[open] > summary::after { transform: rotate(180deg); }
.filters-v2 > .filters-grid {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  z-index: 5;
  background: var(--main-panel);
  border: 1px solid var(--main-border);
  border-radius: 12px;
  padding: 14px;
  box-shadow: var(--shadow-md);
  display: grid;
  grid-template-columns: repeat(2, minmax(180px, 1fr));
  gap: 10px;
  width: 460px;
  max-width: calc(100vw - 320px);
}
[data-theme="dark"] .filters-v2 > summary { color: var(--main-fg); border-color: var(--main-border); }
[data-theme="dark"] .filters-v2 > summary:hover { background: rgba(255,255,255,0.05); }

/* Results shell + pager controls */
.results-shell { display: flex; flex-direction: column; gap: 14px; }
.results-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}
.results-head h3 { margin: 0; font-size: 15px; font-weight: 600; }
.results-list { display: flex; flex-direction: column; gap: 10px; }

.pager-wrap { display: flex; justify-content: flex-end; }
.pager {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 4px;
  padding: 4px;
  border: 1px solid var(--main-border);
  border-radius: 10px;
  background: var(--main-panel);
}
.pager-btn {
  min-width: 32px;
  height: 30px;
  padding: 0 10px;
  border: 0;
  background: transparent;
  font-family: inherit;
  font-size: 12.5px;
  font-weight: 500;
  color: var(--main-fg);
  border-radius: 7px;
  cursor: pointer;
  transition: background-color 0.12s, color 0.12s;
}
.pager-btn:hover:not(:disabled) { background: rgba(0,0,0,0.05); }
.pager-btn:disabled { opacity: 0.35; cursor: not-allowed; }
.pager-btn.active {
  background: var(--main-fg);
  color: var(--main-panel);
}
.pager-step { font-weight: 500; }
.pager-ellipsis {
  min-width: 24px;
  text-align: center;
  color: var(--muted-fg);
  font-size: 12.5px;
}
.pager-meta {
  margin-left: 10px;
  padding: 0 6px;
  font-size: 11.5px;
  color: var(--muted-fg);
  border-left: 1px solid var(--main-border);
  align-self: stretch;
  display: inline-flex;
  align-items: center;
}
[data-theme="dark"] .pager-btn:hover:not(:disabled) { background: rgba(255,255,255,0.06); }
[data-theme="dark"] .pager-btn.active { background: var(--main-fg); color: var(--main-panel); }

@media (max-width: 720px) {
  .pager { width: 100%; justify-content: center; }
  .pager-meta { width: 100%; border-left: 0; margin-left: 0; padding: 6px 0 0; justify-content: center; }
  .filters-v2 > .filters-grid { width: calc(100vw - 32px); max-width: none; left: 0; }
}

/* Jurisdiction picker on Research Agent. Tab-style row of pills above the
   composer, with a muted inline warning under the row when the active
   jurisdiction isn't in the supported set. */
.jurisdiction-bar {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
  margin: -8px 0 12px;
  font-size: 12.5px;
}
.jurisdiction-tabs {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px;
  border: 1px solid var(--main-border);
  border-radius: 9px;
  background: var(--main-panel);
}
.jurisdiction-tab {
  position: relative;
  font: inherit;
  font-size: 12.5px;
  font-weight: 500;
  height: 28px;
  padding: 0 12px;
  border: 0;
  background: transparent;
  color: var(--main-fg);
  border-radius: 6px;
  cursor: pointer;
  transition: background-color 0.12s, color 0.12s;
}
.jurisdiction-tab:hover { background: rgba(0,0,0,0.04); }
.jurisdiction-tab.active {
  background: var(--main-fg);
  color: var(--main-panel);
}
.jurisdiction-tab.limited::after {
  content: "";
  position: absolute;
  top: 5px;
  right: 6px;
  width: 5px;
  height: 5px;
  border-radius: 999px;
  background: #f59e0b;
}
.jurisdiction-tab.active.limited::after { background: #fcd34d; }
.jurisdiction-tag { display: none; }
.jurisdiction-warn {
  flex-basis: 100%;
  padding: 8px 12px;
  border-radius: 8px;
  background: var(--warn-bg, rgba(245, 158, 11, 0.1));
  border: 1px solid var(--warn-border, rgba(245, 158, 11, 0.35));
  color: var(--warn-fg);
  font-size: 12.5px;
  line-height: 1.45;
}
[data-theme="dark"] .jurisdiction-tab:hover { background: rgba(255,255,255,0.06); }
[data-theme="dark"] .jurisdiction-warn { color: #fbbf24; }

/* Persistent reviewer mode-strip — replaces the old "click a tile, the
   picker disappears, only a Change link remains" UX. Tiles for every mode
   stay visible above the document, with the active one highlighted. */
.mode-strip {
  display: flex;
  align-items: stretch;
  gap: 8px;
  flex-wrap: wrap;
  margin: -4px 0 4px;
}
.mode-strip-label {
  display: inline-flex;
  align-items: center;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  padding-right: 8px;
}
.mode-strip-tab {
  flex: 1;
  min-width: 240px;
  display: inline-flex;
  align-items: center;
  gap: 12px;
  padding: 10px 14px;
  border: 1px solid var(--main-border);
  border-radius: 10px;
  background: var(--main-panel);
  text-decoration: none;
  color: var(--main-fg);
  transition: background-color 0.12s, border-color 0.12s, box-shadow 0.12s;
}
.mode-strip-tab:hover { background: rgba(0,0,0,0.03); border-color: var(--ring); }
.mode-strip-tab.active {
  border-color: var(--main-fg);
  background: var(--main-fg);
  color: var(--main-panel);
  box-shadow: var(--shadow-sm);
}
.mode-strip-tab.active .muted,
.mode-strip-tab.active .mode-strip-icon { color: rgba(255,255,255,0.78); }
.mode-strip-icon {
  flex: 0 0 32px;
  display: inline-flex;
  width: 32px;
  height: 32px;
  align-items: center;
  justify-content: center;
  background: rgba(0,0,0,0.04);
  border-radius: 8px;
  color: var(--muted-fg);
}
.mode-strip-tab.active .mode-strip-icon { background: rgba(255,255,255,0.15); }
.mode-strip-icon svg { width: 16px; height: 16px; }
.mode-strip-body { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.mode-strip-body strong { font-size: 13px; font-weight: 600; }
.mode-strip-body .muted { font-size: 11.5px; }
.review-pick-hint { padding: 12px 0; }
[data-theme="dark"] .mode-strip-tab:hover { background: rgba(255,255,255,0.04); }

/* ============ Drafting workspace (doc editor + AI chat) ============
   Two-column layout: a Word-style editable document on the left, an AI chat
   on the right that rewrites the document. The editor is a contenteditable
   div styled to look like a real document page. */

.drafting-shell { gap: 12px; }

.drafting-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 6px 10px;
  border: 1px solid var(--main-border);
  border-radius: 10px;
  background: var(--main-panel);
  flex-wrap: wrap;
}
.drafting-toolbar-left,
.drafting-toolbar-right {
  display: flex;
  align-items: center;
  gap: 4px;
}
.drafting-toolbar .toolbar-sep {
  width: 1px;
  height: 18px;
  background: var(--main-border);
  margin: 0 4px;
}
.drafting-toolbar .ghost-button {
  height: 28px;
  padding: 0 8px;
  font-size: 12px;
  min-width: 28px;
  justify-content: center;
}
.drafting-savestate {
  font-size: 11.5px;
  margin-right: 6px;
}

.drafting-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr);
  gap: 14px;
  align-items: stretch;
  /* Stretch the workspace down to the bottom of the viewport so the editor
     and chat fill the available space. */
  min-height: calc(100vh - 280px);
}

.drafting-doc-card {
  padding: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.drafting-editor {
  flex: 1;
  padding: 36px 48px;
  font-family: "Source Serif Pro", "Charter", Georgia, "Times New Roman", serif;
  font-size: 14.5px;
  line-height: 1.65;
  color: #1a1a1a;
  background: var(--surface);
  overflow: auto;
  min-height: 480px;
}
.drafting-editor:focus { outline: none; }
.drafting-editor h1 {
  font-size: 22px;
  font-weight: 700;
  margin: 0 0 16px;
  letter-spacing: -0.005em;
  text-align: center;
  text-transform: none;
}
.drafting-editor h2 {
  font-size: 15px;
  font-weight: 700;
  margin: 22px 0 8px;
  letter-spacing: 0.005em;
}
.drafting-editor h3 {
  font-size: 13.5px;
  font-weight: 700;
  margin: 16px 0 6px;
}
.drafting-editor p { margin: 0 0 12px; }
.drafting-editor ul,
.drafting-editor ol { margin: 8px 0 14px; padding-left: 24px; }
.drafting-editor li { margin: 3px 0; }
.drafting-editor table {
  width: 100%;
  border-collapse: collapse;
  margin: 12px 0 16px;
  font-size: 13px;
}
.drafting-editor th,
.drafting-editor td {
  border: 1px solid #d8d4cd;
  padding: 6px 9px;
  text-align: left;
  vertical-align: top;
}
.drafting-editor th {
  background: #f5f2ed;
  font-weight: 600;
}
.drafting-editor strong { font-weight: 700; }

[data-theme="dark"] .drafting-editor { background: #1a1817; color: #ececea; }
[data-theme="dark"] .drafting-editor th { background: #25231f; }
[data-theme="dark"] .drafting-editor th,
[data-theme="dark"] .drafting-editor td { border-color: #3a3633; }
[data-theme="dark"] .drafting-editor h1,
[data-theme="dark"] .drafting-editor h2,
[data-theme="dark"] .drafting-editor h3 { color: #ececea; }
[data-theme="dark"] .drafting-editor h2 { border-color: #3a3633; }
[data-theme="dark"] .aa-master-body h1,
[data-theme="dark"] .aa-master-body h2,
[data-theme="dark"] .aa-master-body h3 { color: #ececea; }

.drafting-chat-card {
  padding: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.drafting-chat-head {
  padding: 14px 16px;
  border-bottom: 1px solid var(--main-border);
}
.drafting-chat-head h3 { margin: 0 0 2px; font-size: 14px; font-weight: 600; }
.drafting-chat-head .muted { font-size: 12px; }
.drafting-chat-stream {
  flex: 1;
  overflow-y: auto;
  padding: 14px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.drafting-chat-form {
  border-top: 1px solid var(--main-border);
  padding: 10px 12px;
  background: var(--main-panel);
}
.drafting-chat-form .composer-row {
  display: flex;
  gap: 8px;
  align-items: end;
}
.drafting-chat-form textarea {
  flex: 1;
  min-height: 38px;
  font-size: 13px;
}
.drafting-chat-form .composer-meta {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 6px;
  font-size: 11.5px;
}

@media (max-width: 1024px) {
  .drafting-grid {
    grid-template-columns: 1fr;
    min-height: 0;
  }
  .drafting-editor { min-height: 360px; padding: 24px 24px; }
}

/* ============ Complex Agent: Adjudication Application ============ */

.aa-shell { gap: 14px; }

.aa-stage-bar {
  display: flex;
  align-items: stretch;
  gap: 6px;
  padding: 6px;
  border: 1px solid var(--main-border);
  border-radius: 10px;
  background: var(--main-panel);
  overflow-x: auto;
}
.aa-stage {
  flex: 1;
  min-width: 110px;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  border-radius: 7px;
  font-size: 12.5px;
  color: var(--muted-fg);
  background: transparent;
  border: 0;
  cursor: pointer;
  font-family: inherit;
  text-align: left;
  transition: background-color 0.12s, color 0.12s;
}
.aa-stage:hover { background: rgba(0,0,0,0.04); color: var(--main-fg); }
.aa-stage.done { color: var(--main-fg); }
.aa-stage.active { background: var(--main-fg); color: var(--main-panel); font-weight: 600; }
.aa-stage.active:hover { background: var(--main-fg); }
[data-theme="dark"] .aa-stage:hover { background: rgba(255,255,255,0.06); }
.aa-stage-num {
  display: inline-flex;
  width: 20px;
  height: 20px;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: rgba(0,0,0,0.06);
  font-size: 11px;
  font-weight: 700;
}
.aa-stage.active .aa-stage-num { background: rgba(255,255,255,0.18); }

.aa-header-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.aa-progress-pill {
  font-size: 12px;
  font-weight: 600;
  padding: 4px 10px;
  border-radius: 999px;
  background: var(--main-muted);
  border: 1px solid var(--main-border);
  color: var(--main-fg);
}
.aa-deadline-pill {
  font-size: 12px;
  font-weight: 600;
  padding: 4px 10px;
  border-radius: 999px;
  border: 1px solid;
}
.aa-deadline-pill.ok       { background: rgba(16,185,129,0.10); border-color: rgba(16,185,129,0.35); color: var(--success-fg); }
.aa-deadline-pill.soon     { background: rgba(245,158,11,0.12); border-color: rgba(245,158,11,0.35); color: var(--warn-fg); }
.aa-deadline-pill.urgent   { background: rgba(220,38,38,0.10);  border-color: rgba(220,38,38,0.40);  color: #991b1b; }
.aa-deadline-pill.overdue  { background: rgba(220,38,38,0.18);  border-color: rgba(220,38,38,0.55);  color: #7f1d1d; }
[data-theme="dark"] .aa-deadline-pill.ok      { color: #6ee7b7; }
[data-theme="dark"] .aa-deadline-pill.soon    { color: #fbbf24; }
[data-theme="dark"] .aa-deadline-pill.urgent,
[data-theme="dark"] .aa-deadline-pill.overdue { color: #fca5a5; }

.aa-warnings { display: flex; flex-direction: column; gap: 6px; }
.aa-warning {
  padding: 8px 12px;
  border-radius: 8px;
  background: rgba(245,158,11,0.10);
  border: 1px solid rgba(245,158,11,0.35);
  font-size: 12.5px;
  color: var(--warn-fg);
}
.aa-warning strong {
  display: inline-block;
  margin-right: 6px;
  text-transform: uppercase;
  font-size: 10.5px;
  letter-spacing: 0.04em;
}
[data-theme="dark"] .aa-warning { color: #fbbf24; }

/* Stage 1 — intake */
.aa-intake-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}
.aa-doc-slot { display: flex; flex-direction: column; gap: 8px; }
.aa-doc-label {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--muted-fg);
}
.aa-intake-meta { grid-column: span 2; display: flex; gap: 12px; align-items: end; flex-wrap: wrap; }
.aa-intake-meta label { display: flex; flex-direction: column; gap: 4px; font-size: 12.5px; color: var(--muted-fg); }
.aa-intake-deadline-link { padding-bottom: 8px; font-size: 12.5px; }
.aa-intake-actions { grid-column: span 2; display: flex; align-items: center; gap: 14px; }
.aa-intake-help { font-size: 12px; max-width: 480px; }
.aa-intake-error {
  grid-column: span 2;
  margin-top: 4px;
  padding: 10px 14px;
  border-radius: 8px;
  background: var(--danger-bg);
  border: 1px solid var(--danger-border);
  color: var(--danger);
  font-size: 13px;
  line-height: 1.5;
}
.aa-intake-error[hidden] { display: none; }

@media (max-width: 800px) {
  .aa-intake-grid { grid-template-columns: 1fr; }
  .aa-intake-meta, .aa-intake-actions { grid-column: span 1; }
}

/* Stage 1 — s 79 scenario picker */
.aa-s79-picker {
  margin: 0 0 18px;
  padding: 14px 16px;
  background: var(--main-muted);
  border-radius: 10px;
}
.aa-s79-picker .aa-doc-label { display: block; }
.aa-s79-help { margin: 4px 0 12px; font-size: 12.5px; }
.aa-s79-options {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 8px;
}
.aa-s79-option {
  display: flex;
  gap: 10px;
  padding: 10px 12px;
  background: var(--main-panel);
  border: 1px solid var(--main-border);
  border-radius: 9px;
  cursor: pointer;
  transition: border-color 0.12s, background-color 0.12s;
}
.aa-s79-option:hover { border-color: var(--ring); }
.aa-s79-option.active {
  border-color: var(--main-fg);
  background: var(--main-fg);
  color: var(--main-panel);
}
.aa-s79-option.active .muted { color: rgba(255,255,255,0.78); }
.aa-s79-option input[type="radio"] { margin-top: 3px; }
.aa-s79-body { display: flex; flex-direction: column; gap: 4px; flex: 1; min-width: 0; }
.aa-s79-body strong { font-size: 13px; font-weight: 600; }
.aa-s79-body .muted { font-size: 11.5px; line-height: 1.4; }

.aa-doc-help { margin: 0 0 6px; font-size: 12px; }
.aa-doc-slot-optional textarea { background: rgba(0,0,0,0.02); }

/* Stage 2 — dispute table */
.aa-dispute-table .card-head { align-items: flex-start; flex-wrap: wrap; gap: 12px; }
.aa-table-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.aa-dispute-table .aa-table { min-width: 720px; }
.aa-dispute-table .card-body { overflow-x: auto; }
.aa-extract-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  padding: 10px 14px;
  margin-bottom: 12px;
  background: var(--main-muted);
  border-radius: 8px;
  font-size: 12.5px;
}
.aa-extract-summary span strong { font-weight: 600; }
.aa-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 12.5px;
}
.aa-table th,
.aa-table td {
  padding: 8px 6px;
  border-bottom: 1px solid var(--main-border);
  vertical-align: top;
}
.aa-table th {
  font-weight: 600;
  text-align: left;
  font-size: 11.5px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--muted-fg);
}
.aa-col-item { width: 130px; }
.aa-col-money { width: 110px; }
.aa-col-status { width: 130px; }
.aa-col-issue { width: 130px; }
.aa-col-actions { width: 40px; }
.aa-cell {
  width: 100%;
  font: inherit;
  font-size: 12.5px;
  border: 1px solid transparent;
  background: transparent;
  padding: 4px 6px;
  border-radius: 5px;
  color: var(--main-fg);
}
.aa-cell:hover, .aa-cell:focus {
  border-color: var(--main-border);
  background: var(--main-panel);
  outline: none;
}
.aa-cell-multi { resize: vertical; min-height: 36px; }
.aa-cell-num { text-align: right; }

/* Status select gets a soft colour wash so the row's posture is readable
   at a glance without having to read the dropdown value. JS mirrors the
   select's current value into data-aa-status so the CSS can target it
   (because select[value=...] doesn't reflect the runtime selection). */
.aa-cell[data-aa-cell="status"] { font-weight: 500; }
select.aa-cell[data-aa-status="disputed"] {
  background: #fef2f2;
  color: #991b1b;
}
select.aa-cell[data-aa-status="admitted"] {
  background: var(--success-bg);
  color: var(--success-strong);
}
select.aa-cell[data-aa-status="partial"] {
  background: #fef3c7;
  color: var(--warn-fg);
}
select.aa-cell[data-aa-status="jurisdictional"] {
  background: #ede9fe;
  color: #5b21b6;
}

/* Currency cell: $ prefix + bare number input. The input stores the raw
   number for clean parsing on save; the prefix is presentational only. */
.aa-currency-cell {
  display: inline-flex;
  align-items: stretch;
  width: 100%;
  border: 1px solid transparent;
  border-radius: 6px;
  background: transparent;
}
.aa-currency-cell:focus-within {
  border-color: var(--main-border);
  background: var(--main-panel);
}
.aa-currency-prefix {
  display: inline-flex;
  align-items: center;
  padding: 0 4px 0 6px;
  color: var(--muted-fg);
  font-size: 13px;
  font-weight: 500;
  user-select: none;
  pointer-events: none;
}
.aa-currency-cell .aa-cell-num {
  border: none;
  background: transparent;
  padding-left: 0;
  flex: 1;
}
.aa-currency-cell .aa-cell-num:focus {
  border: none;
  background: transparent;
  outline: none;
}

/* Stage 3+ — three-pane workspace (legacy CSS retained in case any code
   path still renders the original 3-pane variant). */
.aa-three-pane {
  display: grid;
  grid-template-columns: minmax(220px, 260px) minmax(0, 1fr) minmax(0, 1.3fr);
  gap: 14px;
  align-items: stretch;
  min-height: calc(100vh - 320px);
}

/* New 2-pane layout: items nav (left) + RFI chat (centre).
   The master document moved to a fullscreen modal accessed from the
   workspace toolbar — gives the chat much more horizontal room. */
.aa-workspace-toolbar {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 6px 4px 0;
  flex-wrap: wrap;
}
.aa-two-pane {
  display: grid;
  grid-template-columns: minmax(240px, 280px) minmax(0, 1fr);
  gap: 14px;
  align-items: stretch;
  min-height: calc(100vh - 340px);
}
@media (max-width: 1024px) {
  .aa-two-pane { grid-template-columns: 1fr; min-height: 0; }
}

/* Fullscreen master document modal */
.aa-master-modal {
  width: min(1100px, 96vw);
  max-width: 1100px;
  height: min(90vh, 920px);
  display: flex;
  flex-direction: column;
}
.aa-master-modal-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}
.aa-master-modal-actions {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
.aa-master-modal-body {
  flex: 1;
  overflow: hidden;
  padding: 0;
  display: flex;
  flex-direction: column;
}
.aa-master-modal .aa-master-body {
  flex: 1;
  overflow-y: auto;
  margin: 0;
}
.aa-disputes-nav { padding: 0; display: flex; flex-direction: column; }
.aa-disputes-list { padding: 8px; overflow-y: auto; flex: 1; gap: 4px; display: flex; flex-direction: column; }
.aa-nav-item {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  text-align: left;
  padding: 8px 10px;
  border: 0;
  background: transparent;
  border-radius: 7px;
  cursor: pointer;
  font: inherit;
  color: var(--main-fg);
  gap: 2px;
}
.aa-nav-item:hover { background: rgba(0,0,0,0.04); }
.aa-nav-item.active { background: var(--main-fg); color: var(--main-panel); }
.aa-nav-item.active .aa-nav-meta { color: rgba(255,255,255,0.78); }
.aa-nav-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.aa-nav-label { font-size: 13px; font-weight: 500; }
.aa-nav-meta { font-size: 11.5px; }
.aa-nav-dot {
  flex: 0 0 16px;
  width: 16px;
  height: 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  font-size: 10.5px;
  line-height: 1;
}
.aa-nav-dot.idle        { color: var(--muted-fg); }
.aa-nav-dot.in-progress { color: #d97706; }
.aa-nav-dot.ready       { color: #1d4ed8; background: rgba(99,102,241,0.15); font-weight: 700; }
.aa-nav-dot.ok          { color: #fff; background: #047857; font-weight: 700; }
.aa-nav-ready-to-draft .aa-nav-meta { color: #1d4ed8; }
[data-theme="dark"] .aa-nav-dot.ready { color: #93c5fd; background: rgba(99,102,241,0.25); }
[data-theme="dark"] .aa-nav-ready-to-draft .aa-nav-meta { color: #93c5fd; }
.aa-nav-item.active .aa-nav-dot.idle,
.aa-nav-item.active .aa-nav-dot.in-progress { color: rgba(255,255,255,0.78); }

.aa-disputes-foot {
  border-top: 1px solid var(--main-border);
  padding: 8px 10px;
}
.aa-disputes-foot .ghost-button { width: 100%; justify-content: center; }

.aa-rfi-error {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 4px;
}
.aa-rfi-retry { white-space: nowrap; }

.aa-artifacts-modal { max-width: 720px; width: 100%; }
.aa-artifacts-body section { padding: 12px 0; border-bottom: 1px solid var(--main-border); }
.aa-artifacts-body section:last-child { border-bottom: 0; }
.aa-artifacts-body h4 {
  margin: 0 0 8px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--muted-fg);
}
.aa-artifact-list { padding-left: 20px; margin: 0; font-size: 13px; line-height: 1.55; }
.aa-artifact-list li { margin: 3px 0; }
.aa-statdec {
  padding: 12px 14px;
  background: rgba(0,0,0,0.03);
  border-radius: 8px;
  font-size: 13px;
  line-height: 1.55;
  max-height: 320px;
  overflow-y: auto;
}
.aa-artifact-actions { margin-top: 10px; }
[data-theme="dark"] .aa-statdec { background: rgba(255,255,255,0.04); }

.aa-defs-modal { max-width: 640px; width: 100%; }
.aa-defs-list { display: flex; flex-direction: column; gap: 6px; max-height: 340px; overflow-y: auto; padding-right: 2px; }
.aa-def-row {
  display: grid;
  grid-template-columns: 180px 1fr auto;
  gap: 6px;
  padding: 6px 0;
  align-items: start;
  border-bottom: 1px dashed var(--main-border);
}
.aa-def-row:last-child { border-bottom: 0; }
.aa-def-term { font-weight: 600; }
.aa-def-meaning { resize: vertical; min-height: 48px; }
.aa-def-add-row {
  display: grid;
  grid-template-columns: 180px 1fr auto;
  gap: 6px;
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid var(--main-border);
}

.aa-rfi-pane { display: flex; flex-direction: column; padding: 0; overflow: hidden; }
.aa-rfi-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.aa-rfi-round-count {
  font-size: 11.5px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--muted-fg);
  background: var(--main-muted);
  border: 1px solid var(--main-border);
  border-radius: 999px;
  padding: 4px 10px;
}
.aa-rfi-stream {
  flex: 1;
  overflow-y: auto;
  padding: 14px 16px;
}
.aa-rfi-empty {
  margin: 8px 0;
}

/* RFI table — replaces the chat-style stream. One row per RFI, with the
   most recent unanswered row showing a textarea + Submit button. The Edit
   button on answered rows clears the answer so the user can refine. */
.aa-rfi-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  font-size: 13px;
  line-height: 1.5;
  table-layout: fixed;
}
.aa-rfi-table thead th {
  text-align: left;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--muted-fg);
  padding: 8px 10px;
  border-bottom: 1px solid var(--main-border);
  background: var(--main-panel);
  position: sticky;
  top: 0;
  z-index: 1;
}
.aa-rfi-table tbody td {
  padding: 10px;
  border-bottom: 1px solid var(--main-border);
  vertical-align: top;
  background: var(--main-panel);
}
.aa-rfi-table tbody tr.answered td { background: rgba(16,185,129,0.04); }
.aa-rfi-table tbody tr.pending td { background: var(--main-muted); }
.aa-rfi-table tbody tr:last-child td { border-bottom: none; }
.aa-rfi-col-num { width: 78px; }
.aa-rfi-col-q   { width: 38%; }
.aa-rfi-col-a   { width: auto; }
.aa-rfi-col-act { width: 96px; text-align: right; }
.aa-rfi-num {
  font-weight: 700;
  font-size: 12px;
  letter-spacing: 0.02em;
  color: var(--main-fg);
  background: var(--accent);
  border: 1px solid var(--main-border);
  border-radius: 6px;
  padding: 3px 8px;
  white-space: nowrap;
  display: inline-block;
}
.aa-rfi-table .aa-rfi-col-q p { margin: 0 0 6px; }
.aa-rfi-table .aa-rfi-col-q p:last-child { margin-bottom: 0; }
.aa-rfi-table .aa-rfi-col-q ol,
.aa-rfi-table .aa-rfi-col-q ul { margin: 4px 0 6px; padding-left: 18px; }
.aa-rfi-answer-view {
  font-size: 13px;
  line-height: 1.5;
}
.aa-rfi-answer-text p { margin: 0 0 6px; }
.aa-rfi-answer-text p:last-child { margin-bottom: 0; }
.aa-rfi-answer-form {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin: 0;
}
.aa-rfi-answer-input {
  width: 100%;
  min-height: 44px;
  font-size: 13px;
  resize: vertical;
}
@media (max-width: 720px) {
  .aa-rfi-table, .aa-rfi-table thead, .aa-rfi-table tbody, .aa-rfi-table tr, .aa-rfi-table td, .aa-rfi-table th { display: block; }
  .aa-rfi-table thead { display: none; }
  .aa-rfi-table tbody tr {
    border: 1px solid var(--main-border);
    border-radius: 9px;
    margin-bottom: 10px;
    overflow: hidden;
  }
  .aa-rfi-table tbody td {
    border-bottom: 1px solid var(--main-border);
    padding: 10px 12px;
  }
  .aa-rfi-table tbody td:last-child { border-bottom: none; }
  .aa-rfi-col-num { width: 100%; }
  .aa-rfi-col-act { width: 100%; text-align: left; }
}
.aa-rfi-thinking {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  background: var(--main-muted);
  border-radius: 8px;
  font-size: 12.5px;
  color: var(--muted-fg);
}
.aa-rfi-footer {
  border-top: 1px solid var(--main-border);
  padding: 10px 14px;
  display: flex;
  gap: 8px;
  background: var(--main-panel);
}

.aa-master-pane { display: flex; flex-direction: column; padding: 0; overflow: hidden; }
.aa-master-actions { display: flex; gap: 6px; flex-wrap: wrap; }
.aa-master-foot {
  border-top: 1px solid var(--main-border);
  padding: 8px 14px;
  font-size: 12px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.aa-draft-all-status-inline {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  padding: 0 8px;
}
.aa-master-body {
  flex: 1;
  overflow-y: auto;
  padding: 28px 36px;
  background: var(--surface);
  font-family: "Source Serif Pro", "Charter", Georgia, "Times New Roman", serif;
  font-size: 14px;
  line-height: 1.6;
  color: #1a1a1a;
}
.aa-master-body h1 { font-size: 20px; font-weight: 700; text-align: center; margin: 0 0 14px; }
.aa-master-body h2 { font-size: 15px; font-weight: 700; margin: 18px 0 8px; border-bottom: 1px solid #d8d4cd; padding-bottom: 4px; }
.aa-master-body h3 { font-size: 13.5px; font-weight: 700; margin: 14px 0 6px; }
.aa-master-body p { margin: 0 0 10px; }
.aa-master-body ol, .aa-master-body ul { margin: 8px 0 12px; padding-left: 24px; }
.aa-master-body .aa-toc {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 14px 16px;
  margin: 0 0 28px;
  background: #f7f5f1;
  border: 1px solid #e8e5e0;
  border-radius: 9px;
  font-family: Inter, -apple-system, "Segoe UI", sans-serif;
  font-size: 12.5px;
}
.aa-master-body .aa-toc-label {
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin-bottom: 6px;
}
.aa-master-body .aa-toc-link {
  display: flex;
  gap: 10px;
  padding: 4px 6px;
  border-radius: 5px;
  text-decoration: none;
  color: #1a1a1a;
}
.aa-master-body .aa-toc-link:hover { background: rgba(0,0,0,0.05); }
.aa-master-body .aa-toc-num {
  flex: 0 0 36px;
  font-variant-numeric: tabular-nums;
  font-weight: 600;
  color: #6b6b6b;
}
.aa-master-body .aa-toc-text { flex: 1; }
.aa-master-body .aa-toc-indent-1 { padding-left: 22px; font-size: 12px; }
[data-theme="dark"] .aa-master-body .aa-toc { background: #25231f; border-color: #3a3633; }
[data-theme="dark"] .aa-master-body .aa-toc-link { color: #ececea; }
[data-theme="dark"] .aa-master-body .aa-toc-num { color: #9b9994; }
[data-theme="dark"] .aa-master-body .aa-toc-link:hover { background: rgba(255,255,255,0.05); }

.aa-master-body .aa-issue-tag {
  display: inline-block;
  font-size: 10px;
  font-weight: 600;
  padding: 1px 6px;
  margin-left: 8px;
  background: rgba(99,102,241,0.12);
  color: #4338ca;
  border-radius: 999px;
  vertical-align: middle;
}
[data-theme="dark"] .aa-master-body { background: #1a1817; color: #ececea; }
[data-theme="dark"] .aa-master-body h2 { border-bottom-color: #3a3633; }

@media (max-width: 1280px) {
  .aa-three-pane {
    grid-template-columns: 1fr;
    min-height: 0;
  }
  .aa-disputes-nav, .aa-rfi-pane, .aa-master-pane { min-height: 360px; }
}

/* Stage 5 — Review */
.aa-review {
  display: grid;
  grid-template-columns: minmax(280px, 380px) minmax(0, 1fr);
  gap: 14px;
  align-items: stretch;
  min-height: calc(100vh - 320px);
}
.aa-review-summary { display: flex; flex-direction: column; }
.aa-review-summary .card-head {
  /* The summary column is narrow and the action row has 6+ buttons, so stack
     vertically here instead of inheriting the default left-title / right-actions
     row. Buttons wrap to additional lines when the column is too narrow. */
  flex-direction: column;
  align-items: stretch;
  gap: 12px;
}
.aa-review-summary .card-body { display: flex; flex-direction: column; gap: 18px; }
.aa-review-checklist h4,
.aa-review-scenario h4 {
  margin: 0 0 8px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--muted-fg);
}
.aa-review-checklist ul { margin: 0; padding-left: 20px; font-size: 13px; line-height: 1.65; }
.aa-review-checklist li { padding: 1px 0; }
.aa-review-scenario p { margin: 0; font-size: 13px; line-height: 1.5; }
.aa-review-master { display: flex; flex-direction: column; padding: 0; }
.aa-review-master .aa-master-body { flex: 1; }
.aa-review-actions {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}
.aa-review-actions > button {
  /* Compact buttons fit two-per-row in the narrow summary column. */
  flex: 1 1 calc(50% - 3px);
  justify-content: flex-start;
  white-space: nowrap;
}

@media (max-width: 1024px) {
  .aa-review { grid-template-columns: 1fr; min-height: 0; }
  .aa-review-summary .card-head { flex-direction: row; align-items: flex-start; }
  .aa-review-actions > button { flex: 0 0 auto; }
}

/* Adjudicator toolbar should be inline, not a 2-col grid. */
.toolbar { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.toolbar .text-input { flex: 1; min-width: 220px; }
.toolbar .select-input { width: auto; min-width: 200px; }

/* Adjudicator card was tall and sparse — tighten. */
.adj-card { padding: 12px; gap: 2px; }
.adj-card strong { font-size: 13.5px; }
.adj-card-row { font-size: 11.5px; }

/* When the right detail panel has no content yet, hide it on wide screens to
   avoid wasting half a row. The .detail-panel.empty class is added by JS when
   appropriate; the CSS-only equivalent is to dim the empty placeholder. */
.detail-panel .empty-state { background: transparent; border-style: dashed; }

/* Due-date Result panel was missing — make sure both calc-card and the result
   are full-width inside the right column of due-grid. */
#due-result:empty { display: none; }
.calc-card .card-head .loc-row { display: inline-flex; align-items: center; gap: 8px; flex-wrap: wrap; text-transform: none; letter-spacing: 0; font-size: 12.5px; }
.calc-card .card-head .loc-row select { padding: 4px 22px 4px 8px; height: 28px; font-size: 12.5px; }

/* Hide the old "sopal.com.au" right-corner link that was floating with no
   left-side content on the home page when there are no breadcrumbs. The
   .header-right link still appears but stays muted. */
.header-right .link-button.small { font-size: 12px; padding: 4px 8px; }

/* ---------- Review workspace (claim-check pattern) ---------- */

.review-shell { gap: 18px; }

.review-mode-picker {
  background: var(--surface);
  border: 1px solid var(--main-border);
  border-radius: 14px;
  padding: 28px 28px 32px;
}
.review-mode-picker h3 {
  margin: 0 0 4px;
  font-size: 18px;
  font-weight: 650;
}
.review-mode-picker p { margin: 0 0 18px; color: var(--muted-fg); }

.mode-tile-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 12px;
}
.mode-tile {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 16px 18px;
  border: 1px solid var(--main-border);
  border-radius: 12px;
  background: var(--surface);
  transition: background-color 0.12s, border-color 0.12s, transform 0.12s;
  text-decoration: none;
  color: var(--main-fg);
}
.mode-tile:hover {
  background: var(--surface-hover);
  border-color: var(--ring);
  transform: translateY(-1px);
}
.mode-tile-icon {
  display: inline-flex;
  width: 36px;
  height: 36px;
  align-items: center;
  justify-content: center;
  background: var(--accent);
  border-radius: 9px;
  color: var(--main-fg);
  flex-shrink: 0;
}
.mode-tile-icon svg { width: 18px; height: 18px; }
.mode-tile-body { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.mode-tile-body strong { font-size: 14px; font-weight: 650; }
.mode-tile-body .muted { font-size: 12.5px; }

.review-meta-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 14px;
  background: #fdfcf9;
  border: 1px solid var(--main-border);
  border-radius: 10px;
  font-size: 13px;
}
.review-meta-bar .review-meta-left { display: inline-flex; align-items: center; gap: 8px; flex-wrap: wrap; }

.review-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(360px, 0.85fr);
  gap: 16px;
  align-items: start;
  min-height: 70vh;
}
.review-left { display: flex; flex-direction: column; gap: 14px; }
.review-right { display: flex; flex-direction: column; gap: 14px; position: sticky; top: 76px; max-height: calc(100vh - 96px); overflow: auto; }
.review-right .card { background: var(--surface); }

.review-doc-card .card-body { padding: 14px 16px; }
.review-chat-card .card-body, .review-chat-card .review-chat { display: contents; }
.review-chat-card { display: flex; flex-direction: column; min-height: 360px; }
.review-chat {
  display: flex;
  flex-direction: column;
  flex: 1;
}
.review-chat .review-message-area {
  flex: 1;
  overflow-y: auto;
  padding: 14px 16px;
  background: var(--surface);
  min-height: 220px;
}
.review-chat .composer-active.review-composer {
  margin: 0;
  border-top: 1px solid var(--main-border);
  border-radius: 0 0 12px 12px;
  border-left: 0;
  border-right: 0;
  border-bottom: 0;
  box-shadow: none;
}

/* Document upload zone */
.doc-input { display: flex; flex-direction: column; gap: 12px; }
.upload-zone {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: 6px;
  padding: 28px 18px;
  border: 1.5px dashed var(--main-border);
  border-radius: 12px;
  background: #fcfbf7;
  cursor: pointer;
  transition: background-color 0.12s, border-color 0.12s;
}
.upload-zone:hover, .upload-zone.drag-over {
  background: #f4f1ea;
  border-color: var(--ring);
}
.upload-icon { display: inline-flex; color: var(--muted-fg); }
.upload-icon svg { width: 28px; height: 28px; }
.upload-primary { font-size: 14px; font-weight: 500; color: var(--main-fg); }
.upload-browse { color: var(--focus); text-decoration: underline; }
.upload-sub { font-size: 12px; }

.paste-fallback summary {
  cursor: pointer;
  list-style: none;
  font-size: 12.5px;
  color: var(--muted-fg);
  padding: 6px 0;
}
.paste-fallback summary::before {
  content: "+";
  display: inline-block;
  width: 14px;
  margin-right: 6px;
  color: var(--muted-fg);
}
.paste-fallback[open] summary::before { content: "−"; }
.paste-fallback summary::-webkit-details-marker { display: none; }
.paste-fallback .text-area { min-height: 140px; }
.paste-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 8px;
  gap: 10px;
}

.doc-loaded { display: flex; flex-direction: column; gap: 10px; }
.doc-loaded-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
}
.doc-preview {
  margin: 0;
  padding: 12px;
  background: var(--main-muted);
  border: 1px solid var(--main-border);
  border-radius: 8px;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 12.5px;
  white-space: pre-wrap;
  max-height: 240px;
  overflow: auto;
}

/* Analysis pane */
.review-analysis-card { min-height: 360px; }
.analysis-action {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 14px;
}
.analysis-summary {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-bottom: 14px;
}
.analysis-summary-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
}
.summary-counts {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.analysis-copy-btn { flex-shrink: 0; }
.sc-pill {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 10px;
  border-radius: 999px;
  font-size: 11.5px;
  font-weight: 600;
  border: 1px solid;
}
.sc-pill strong { font-weight: 700; font-size: 13px; }
.sc-pill.sc-pass { background: var(--success-bg); color: var(--success-fg); border-color: var(--success-border); }
.sc-pill.sc-fail { background: #fef2f2; color: #991b1b; border-color: #fecaca; }
.sc-pill.sc-warn { background: var(--warn-bg); color: var(--warn-fg); border-color: var(--warn-border-strong); }
.sc-pill.sc-info { background: #eff6ff; color: #1e40af; border-color: #bfdbfe; }
.analysis-overview { font-size: 13px; line-height: 1.6; color: #2c2c2c; }
.analysis-overview p { margin: 0 0 8px; }

.check-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.check-item {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  gap: 10px;
  align-items: flex-start;
  padding: 10px 12px;
  border: 1px solid var(--main-border);
  border-radius: 9px;
  background: var(--surface);
}
.check-item.idle, .check-item.pending { background: #fbfaf6; }
.check-item.pass { background: #f0fdf6; border-color: #bff0d4; }
.check-item.fail { background: #fef4f4; border-color: #fbcfcf; }
.check-item.warn { background: var(--warn-bg); border-color: var(--warn-border-strong); }
.check-item.info { background: #f3f7ff; border-color: #c8d8f4; }
.check-status {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 700;
  background: var(--surface);
  border: 1px solid var(--main-border);
  margin-top: 1px;
}
.check-item.pass .check-status { background: #34d399; color: #fff; border-color: #34d399; }
.check-item.fail .check-status { background: #ef4444; color: #fff; border-color: #ef4444; }
.check-item.warn .check-status { background: #f59e0b; color: #fff; border-color: #f59e0b; }
.check-item.info .check-status { background: #3b82f6; color: #fff; border-color: #3b82f6; }
.check-item.idle .check-status, .check-item.pending .check-status { color: var(--muted-fg); }
.check-body strong { display: block; font-size: 13px; font-weight: 650; line-height: 1.35; margin-bottom: 4px; }
.check-detail { font-size: 12.5px; line-height: 1.55; color: #3a3a3a; }
.check-detail p { margin: 0 0 6px; }
.check-detail p:last-child { margin-bottom: 0; }

.analysis-block { margin-top: 14px; }
.analysis-block h4 {
  margin: 0 0 6px;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--muted-fg);
}
.analysis-block ul { margin: 0; padding-left: 20px; font-size: 13px; line-height: 1.55; }
.analysis-block li { margin-bottom: 4px; }

/* Mobile: stack the review grid */
@media (max-width: 1100px) {
  .review-grid { grid-template-columns: 1fr; }
  .review-right { position: static; max-height: none; }
}

/* ---------- Mobile (≤620px) — proper phone layout ---------- */
@media (max-width: 620px) {
  /* Tighten the main pane so content uses the full viewport width. */
  .main { border-top-left-radius: 0; box-shadow: none; }
  .main-header {
    height: 52px;
    padding: 0 12px;
    gap: 8px;
  }
  /* Single-line breadcrumb on phones — only show the LAST crumb so we don't
     wrap the header to two lines on long project names. The earlier
     crumbs collapse to a "..." prefix instead. */
  .breadcrumb {
    font-size: 12.5px;
    gap: 4px;
    flex-wrap: nowrap;
    overflow: hidden;
    min-width: 0;
    flex: 1;
  }
  .breadcrumb .crumb,
  .breadcrumb .crumb-sep { white-space: nowrap; flex-shrink: 0; }
  .breadcrumb .crumb.current {
    overflow: hidden;
    text-overflow: ellipsis;
    flex: 1;
    min-width: 0;
  }
  /* Hide every crumb and separator EXCEPT the current page on phones — and
     swap in a back-arrow on the very first separator slot to act as
     visual "back" affordance. */
  .breadcrumb .crumb:not(.current),
  .breadcrumb .crumb-sep { display: none; }
  .header-right .link-button { display: none; }

  .page-shell {
    width: 100%;
    padding: 16px 14px 56px;
    gap: 14px;
  }

  /* Project row: stack check+icon+text on top, status pill on bottom — no overflow. */
  .project-row {
    grid-template-columns: auto 36px minmax(0, 1fr);
    grid-template-rows: auto auto;
    grid-template-areas:
      "check icon text"
      "meta meta meta";
    gap: 6px 12px;
    padding: 12px 14px;
  }
  .project-row-check { grid-area: check; }
  .project-row-icon { grid-area: icon; width: 32px; height: 32px; }
  .project-row-icon svg { width: 14px; height: 14px; }
  .project-row-text { grid-area: text; }
  .project-row .status-pill,
  .project-row .category-pill {
    grid-area: meta;
    justify-self: start;
    white-space: normal;
    line-height: 1.4;
  }
  .project-row .row-chev { display: none; }

  /* Home hero: lighter padding so it doesn't dominate the viewport. */
  .home-hero { padding: 18px 16px; }
  .home-hero h2 { font-size: 19px; }
  .home-hero p { font-size: 13.5px; }
  .home-hero .dark-button { width: 100%; justify-content: center; }

  /* Tile grid: full-width, looser tap target. */
  .tile-grid, .home-tiles { grid-template-columns: 1fr; gap: 8px; }
  .tile { padding: 12px 14px; min-height: auto; }

  /* Metric grids (project overview / adjudicator detail / home metrics) stack
     into 2 columns on phone — 3 columns squashed text. */
  .metric-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .metric-grid.compact { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .metric strong { font-size: 17px; }
  .metric label { font-size: 11px; }

  /* Quick-link row inside project overview — three buttons, stack vertically. */
  .quick-link-row { flex-direction: column; }
  .quick-link-row .ghost-button { width: 100%; justify-content: center; }

  /* Section heads: stack title and action button. */
  .page-head, .section-head.row {
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
  }
  .page-head .dark-button,
  .section-head.row .dark-button { width: 100%; justify-content: center; }

  .page-title { font-size: 20px; }
  .page-sub { font-size: 13px; }

  /* Decision search: search form readable and stacked. */
  .search-form {
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .search-form .span-2,
  .search-form .span-all { grid-column: 1; }
  .search-form .dark-button { width: 100%; justify-self: stretch; }
  .search-form .select-input { max-width: none; }
  .filters-grid { grid-template-columns: 1fr; }
  .research-grid, .stats-grid-shell { grid-template-columns: 1fr; gap: 12px; }

  /* Adjudicator + result cards: padding tightened. */
  .result-row { padding: 12px 14px; }
  .adj-card { padding: 11px 12px; }
  .adj-grid { grid-template-columns: 1fr; }

  /* Decision detail: header pieces wrap onto rows. */
  .decision-meta-block { padding: 10px 14px 4px; gap: 6px 12px; }
  .decision-meta-block dd { font-size: 12.5px; }

  /* Calculators stacked. */
  .due-grid, .interest-grid, .tool-grid { grid-template-columns: 1fr; gap: 12px; }
  .scenario-list { display: grid; grid-template-columns: 1fr; gap: 8px; }
  .calc-form { grid-template-columns: 1fr; }
  .calc-form .span-2, .calc-form .span-all { grid-column: 1; }

  /* Project workspace: collapse the 2-column grid. */
  .project-grid { grid-template-columns: 1fr; gap: 12px; }
  .context-grid { grid-template-columns: 1fr; gap: 12px; }
  .context-form { grid-template-columns: 1fr; }
  .context-form .span-2, .context-form .span-all { grid-column: 1; }

  /* Chat: full-bleed, helper panel BELOW the chat (not above as the broader
     ≤980 rule had it via order: -1). */
  .chat-layout, .chat-layout.with-helper {
    grid-template-columns: 1fr;
    gap: 12px;
  }
  .helper-panel { order: 0; }
  .chat-pane { min-height: 60vh; }
  .chat-empty { padding: 28px 16px; }
  .chat-empty-title { font-size: 24px; }
  .composer-card { width: 100%; border-radius: 14px; }
  .composer-card textarea, .composer-active textarea { font-size: 16px; }
  /* iOS won't zoom on focus when the input is ≥16px font-size */
  .text-input, .select-input, .text-area { font-size: 16px; }
  .composer-meta { font-size: 11.5px; gap: 8px; }
  .composer-meta .kbd-hint { display: none; }

  /* Review workspace columns stack. */
  .review-grid { grid-template-columns: 1fr; gap: 12px; }
  .review-right { position: static; max-height: none; }

  /* Mode tabs: stretch full width. */
  .mode-tabs { display: flex; width: 100%; }
  .mode-tab { flex: 1; }

  /* Modal: full-bleed-ish on phones. */
  .modal { border-radius: 14px; }
  .modal-body .row-2 { grid-template-columns: 1fr; }
  .modal-body .span-all { grid-column: 1; }

  /* Result tables on calculators wrap better. */
  .result-table td { padding: 6px 0; font-size: 12.5px; }
  .result-total { font-size: 14px; }
  .result-total strong { font-size: 16px; }

  /* Sidebar drawer: don't be wider than the viewport. */
  .sopal-sidebar { width: min(280px, 86vw); }
  .nav-item { font-size: 14px; padding: 10px 12px; }
}

/* Smaller phones — keep header readable. */
@media (max-width: 380px) {
  .home-tiles { grid-template-columns: 1fr; }
  .breadcrumb { font-size: 12px; }
  .page-title { font-size: 18px; }
  .home-hero h2 { font-size: 18px; }
}

/* Recently-viewed decisions on home — return-visitor convenience. */
.recent-decisions-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 10px;
}
.recent-decision-card {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 12px 14px;
  background: var(--surface);
  border: 1px solid var(--main-border);
  border-radius: 10px;
  color: var(--main-fg);
  transition: background-color 0.12s, border-color 0.12s;
}
.recent-decision-card:hover {
  background: var(--surface-hover);
  border-color: var(--ring);
}
.recent-decision-card strong {
  font-size: 13.5px;
  font-weight: 650;
  line-height: 1.35;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.recent-decision-card .muted { font-size: 12px; }

@media (max-width: 620px) {
  .recent-decisions-grid { grid-template-columns: 1fr; }
}

/* Analysis block visual treatment — recommendations and missing-info now read
   as actionable lists, not bare ULs. */
.analysis-block {
  margin-top: 16px;
  padding: 12px 14px;
  border: 1px solid var(--main-border);
  border-radius: 10px;
  background: var(--surface);
}
.analysis-block header {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
}
.analysis-block h4 {
  margin: 0;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--muted-fg);
}
.analysis-block-icon {
  display: inline-flex;
  width: 22px;
  height: 22px;
  align-items: center;
  justify-content: center;
  border-radius: 6px;
}
.analysis-block-icon svg { width: 14px; height: 14px; }

.analysis-block-recs {
  background: linear-gradient(180deg, #ecfdf5 0%, #ffffff 80%);
  border-color: #bbf7d0;
}
.analysis-block-recs .analysis-block-icon { background: #34d399; color: #fff; }
.analysis-block-recs h4 { color: var(--success-strong); }
.analysis-block-recs ol {
  margin: 0;
  padding-left: 22px;
  font-size: 13px;
  line-height: 1.55;
  color: #134e3a;
}
.analysis-block-recs li { margin-bottom: 6px; }
.analysis-block-recs li::marker { color: var(--success-fg); font-weight: 700; }

.analysis-block-missing {
  background: linear-gradient(180deg, #eff6ff 0%, #ffffff 80%);
  border-color: #bfdbfe;
}
.analysis-block-missing .analysis-block-icon { background: #3b82f6; color: #fff; }
.analysis-block-missing h4 { color: #1e3a8a; }
.analysis-block-missing ul {
  margin: 0;
  padding-left: 22px;
  font-size: 13px;
  line-height: 1.55;
  color: #1e3a52;
}
.analysis-block-missing li { margin-bottom: 4px; }

/* Subtler styling for the analysis summary blockquote. */
.analysis-overview {
  margin: 12px 0 0;
  padding: 10px 14px;
  border-left: 3px solid var(--ring);
  background: var(--main-muted);
  border-radius: 0 8px 8px 0;
  font-size: 13px;
  color: #2c2c2c;
  line-height: 1.55;
}
.analysis-overview p { margin: 0 0 6px; }
.analysis-overview p:last-child { margin-bottom: 0; }
.analysis-overview h3, .analysis-overview h4 {
  font-size: 13px;
  font-weight: 650;
  margin: 4px 0;
}

/* Suggestion chips inside review chat empty state. */
.review-empty-with-suggestions { gap: 8px; }
.review-empty-with-suggestions .chip-row { margin-top: 6px; }
.review-empty-with-suggestions .chip {
  font-size: 12.5px;
  text-align: left;
  white-space: normal;
  line-height: 1.4;
  padding: 8px 12px;
}

/* ---------- AA master document — cover page + per-item meta tables ---------- */
/* The cover page sits at the top of the master document. Modelled on the
 * formal styling commonly used for QLD adjudication applications: large
 * centred title, a brief opening line citing s 79(2) BIF Act, and bordered
 * tables for Claimant / Respondent / Application details. */
.aa-master-body .aa-cover {
  margin: 0 0 28px;
  padding: 0 0 18px;
  border-bottom: 2px solid var(--main-fg);
}
.aa-master-body .aa-cover-title {
  font-size: 22px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-align: center;
  margin: 0 0 14px;
  text-transform: uppercase;
}
.aa-master-body .aa-cover-opener {
  font-size: 13.5px;
  margin: 0 0 18px;
  line-height: 1.55;
}
.aa-master-body .aa-cover-section {
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin: 14px 0 6px;
  border: 0;
  padding: 0;
}
.aa-master-body table.aa-cover-table {
  width: 100%;
  border-collapse: collapse;
  margin: 0 0 14px;
  font-size: 12.5px;
}
.aa-master-body table.aa-cover-table th,
.aa-master-body table.aa-cover-table td {
  border: 1px solid #888;
  padding: 6px 10px;
  text-align: left;
  vertical-align: top;
}
.aa-master-body table.aa-cover-table th {
  background: #f0ece4;
  font-weight: 600;
  width: 38%;
}
[data-theme="dark"] .aa-master-body table.aa-cover-table th {
  background: rgba(255,255,255,0.08);
}

/* Compact per-item summary table that sits under each "4.x Item" heading. */
.aa-master-body table.aa-item-meta {
  width: auto;
  min-width: 380px;
  max-width: 100%;
  border-collapse: collapse;
  margin: 4px 0 12px;
  font-size: 12px;
}
.aa-master-body table.aa-item-meta th,
.aa-master-body table.aa-item-meta td {
  border: 1px solid #b8b3aa;
  padding: 4px 8px;
  text-align: left;
  vertical-align: top;
}
.aa-master-body table.aa-item-meta th {
  background: #faf7f1;
  font-weight: 600;
  width: 180px;
}
[data-theme="dark"] .aa-master-body table.aa-item-meta th {
  background: rgba(255,255,255,0.05);
}

/* Visual separator between the section-editor row and the export row. */
.aa-master-actions-sep {
  display: inline-block;
  width: 1px;
  height: 20px;
  background: rgba(0,0,0,0.18);
  margin: 0 4px;
}
[data-theme="dark"] .aa-master-actions-sep { background: rgba(255,255,255,0.18); }

/* Master-modal sub-modals (cover details, intro, summary, overarching). */
.aa-edit-modal {
  width: min(720px, 92vw);
  max-height: 88vh;
  display: flex;
  flex-direction: column;
}
.aa-edit-modal .modal-body {
  flex: 1;
  overflow-y: auto;
}
.aa-edit-hint {
  font-size: 12.5px;
  margin: 0 0 12px;
  line-height: 1.5;
}
.aa-edit-foot {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 16px;
  border-top: 1px solid var(--card-bd);
}
.aa-edit-foot .spacer { flex: 1; }

/* Word-style contenteditable editor for HTML sections. */
.aa-edit-html {
  border: 1px solid var(--card-bd);
  border-radius: 6px;
  padding: 14px 18px;
  min-height: 280px;
  max-height: 60vh;
  overflow-y: auto;
  font-family: "Source Serif Pro", Georgia, "Times New Roman", serif;
  font-size: 13.5px;
  line-height: 1.6;
  background: var(--main-panel);
  outline: none;
}
.aa-edit-html:focus { border-color: var(--ring); box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15); }
.aa-edit-html p { margin: 0 0 10px; }
.aa-edit-html h3 { font-size: 14px; font-weight: 700; margin: 12px 0 6px; }
.aa-edit-html h4 { font-size: 13px; font-weight: 700; margin: 10px 0 4px; }

/* Cover-meta editor — two-column grid of labelled inputs. */
.aa-cover-modal {
  width: min(820px, 92vw);
  max-height: 88vh;
  display: flex;
  flex-direction: column;
}
.aa-cover-modal .modal-body {
  flex: 1;
  overflow-y: auto;
}
.aa-cover-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px 14px;
  margin: 4px 0 0;
}
.aa-cover-field {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 12px;
}
.aa-cover-field span {
  color: var(--muted);
  font-weight: 500;
}
.aa-cover-field input.text-input {
  font-size: 13px;
  padding: 6px 9px;
}
@media (max-width: 720px) {
  .aa-cover-grid { grid-template-columns: 1fr; }
}

.aa-cover-group-title {
  margin: 18px 0 8px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--muted-fg);
  padding-bottom: 4px;
  border-bottom: 1px solid var(--main-border);
}
.aa-cover-group-title:first-of-type { margin-top: 6px; }

/* Screen-reader-only visually-hidden helper used for table column headers
   that don't need a visual label (e.g. the action column on the RFI table). */
.visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* ---------- Help & Support pages ---------- */
.help-shell { max-width: 980px; }
.help-shell .page-title { margin-bottom: 6px; }
.help-shell .page-sub { margin-bottom: 32px; }
.help-group { margin-bottom: 32px; }
.help-group:last-of-type { margin-bottom: 0; }
.help-group-title {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--muted-fg);
  margin: 0 0 12px;
  padding-bottom: 6px;
  border-bottom: 1px solid var(--main-border);
}
.help-card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 14px;
}
.help-card {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 16px 18px;
  border: 1px solid var(--main-border);
  border-radius: 12px;
  background: var(--main-panel);
  color: inherit;
  text-decoration: none;
  transition: border-color 0.12s, transform 0.06s;
}
.help-card:hover {
  border-color: var(--ring);
  transform: translateY(-1px);
}
.help-card h3 {
  margin: 0;
  font-size: 14.5px;
  font-weight: 650;
  color: var(--main-fg);
}
.help-card p {
  margin: 0;
  font-size: 13px;
  line-height: 1.5;
  color: var(--muted-fg);
}
.help-card-cta {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin-top: auto;
  padding-top: 8px;
  font-size: 12.5px;
  font-weight: 500;
  color: var(--focus);
}
.help-card-cta svg { width: 14px; height: 14px; }
.help-contact {
  margin-top: 32px;
  padding: 18px 20px;
  border: 1px solid var(--main-border);
  border-radius: 12px;
  background: var(--main-muted);
}
.help-contact p {
  margin: 0;
  font-size: 13.5px;
  line-height: 1.55;
}
.help-contact a {
  color: var(--focus);
  text-decoration: underline;
}

/* Article pages */
.help-article-shell { max-width: 760px; }
.help-article-cat {
  font-size: 11.5px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin: 0 0 6px;
}
.help-article-shell .page-title { margin-bottom: 24px; }
.help-article-body {
  font-size: 15px;
  line-height: 1.65;
  color: var(--main-fg);
}
.help-article-body p.lead {
  font-size: 16.5px;
  line-height: 1.6;
  color: var(--main-fg);
  margin: 0 0 24px;
}
.help-article-body h2 {
  margin: 32px 0 12px;
  font-size: 18px;
  font-weight: 650;
  color: var(--main-fg);
}
.help-article-body h3 {
  margin: 22px 0 8px;
  font-size: 15px;
  font-weight: 650;
  color: var(--main-fg);
}
.help-article-body p { margin: 0 0 14px; }
.help-article-body ul,
.help-article-body ol {
  margin: 0 0 16px;
  padding-left: 22px;
}
.help-article-body li { margin-bottom: 6px; }
.help-article-body strong { font-weight: 650; color: var(--main-fg); }
.help-article-body dl { margin: 0 0 16px; }
.help-article-body dt {
  font-weight: 650;
  color: var(--main-fg);
  margin-top: 12px;
}
.help-article-body dd {
  margin: 4px 0 8px 0;
  color: var(--main-fg);
}
.help-related {
  margin-top: 40px;
  padding-top: 24px;
  border-top: 1px solid var(--main-border);
}
.help-back {
  margin-top: 32px;
  font-size: 13px;
}
.help-back a {
  color: var(--focus);
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.help-back a:hover { text-decoration: underline; }

/* ---------- Sidebar auth row ---------- */
.sidebar-auth {
  margin-top: 12px;
  padding: 12px 14px;
  border: 1px solid var(--main-border);
  border-radius: 10px;
  background: var(--main-panel);
}
.sidebar-auth.guest p {
  margin: 0 0 10px;
  font-size: 12.5px;
  line-height: 1.5;
  color: var(--muted-fg);
}
.sidebar-auth.guest .dark-button { width: 100%; justify-content: center; }
.sidebar-auth.checking {
  padding: 8px 14px;
  background: transparent;
  border-style: dashed;
}
.sidebar-auth.checking .muted { font-size: 12px; }
.sidebar-auth-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.sidebar-auth-row + .sidebar-auth-row { margin-top: 6px; }
.sidebar-auth-name {
  font-size: 13px;
  font-weight: 600;
  color: var(--main-fg);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.sidebar-auth .link-button {
  font-size: 12px;
  background: transparent;
  border: 0;
  padding: 0;
  color: var(--focus);
  cursor: pointer;
  text-decoration: underline;
}
.sopal-sidebar.collapsed .sidebar-auth { display: none; }

/* ---------- Settings page ---------- */
.settings-shell { max-width: 760px; }
.settings-card {
  margin-top: 14px;
  padding: 16px 20px;
  border: 1px solid var(--main-border);
  border-radius: 12px;
  background: var(--main-panel);
}
.settings-card.settings-card-muted { background: var(--main-muted); }
.settings-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}
.settings-card-head h3 {
  margin: 0;
  font-size: 14px;
  font-weight: 650;
}
.settings-card p {
  margin: 0 0 12px;
  font-size: 13.5px;
  line-height: 1.55;
  color: var(--muted-fg);
}
.settings-card p:last-child { margin-bottom: 0; }
.settings-pill {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  padding: 3px 8px;
  border-radius: 999px;
}
.settings-pill-on {
  background: rgba(16,185,129,0.12);
  color: var(--success-fg);
}
.settings-pill-off {
  background: var(--main-muted);
  color: var(--muted-fg);
}
.settings-dl {
  display: grid;
  grid-template-columns: 140px minmax(0, 1fr);
  gap: 6px 14px;
  margin: 0 0 12px;
  font-size: 13.5px;
}
.settings-dl dt { color: var(--muted-fg); font-weight: 500; }
.settings-dl dd { margin: 0; color: var(--main-fg); }
.settings-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 10px;
}
.settings-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.settings-status { margin-top: 12px; font-size: 12.5px; }

/* ---------- Project quickstart (empty-state walkthrough on Project Overview) ---------- */
.project-quickstart { margin-bottom: 14px; }
.project-quickstart-list {
  margin: 0;
  padding-left: 18px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  font-size: 13.5px;
  line-height: 1.55;
}
.project-quickstart-list li {
  padding-left: 2px;
}
.project-quickstart-list li strong {
  display: block;
  font-size: 14px;
  font-weight: 650;
  color: var(--main-fg);
  margin-bottom: 2px;
}
.project-quickstart-list li span {
  display: block;
  color: var(--muted-fg);
  margin-bottom: 8px;
}
.project-quickstart-foot {
  margin: 16px 0 0;
  font-size: 12.5px;
}
.project-quickstart-foot a {
  color: var(--focus);
  text-decoration: underline;
}

/* ---------- Firm Settings card ---------- */

.firm-card { display: flex; flex-direction: column; gap: 14px; }
.firm-form { margin: 0; }
.firm-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px 18px;
}
.firm-field { display: flex; flex-direction: column; gap: 6px; }
.firm-field > span,
.firm-field > legend { font-weight: 600; font-size: 13px; color: var(--main-fg); }
.firm-field-wide { grid-column: 1 / -1; }
.firm-field small { font-size: 12px; color: var(--muted); }
.firm-form-actions { display: flex; align-items: center; gap: 12px; margin-top: 14px; }
.firm-swatches { border: 0; padding: 0; margin: 0; }
.firm-swatches legend { padding: 0 0 6px; font-weight: 600; font-size: 13px; }
.swatch-row { display: flex; flex-wrap: wrap; gap: 8px; }
.swatch {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 10px;
  border: 1px solid var(--card-border);
  border-radius: 6px;
  background: var(--card-bg);
  cursor: pointer;
  font-size: 12px;
  font-variant-numeric: tabular-nums;
  user-select: none;
}
.swatch input { position: absolute; opacity: 0; pointer-events: none; }
.swatch.selected { border-color: var(--swatch); box-shadow: 0 0 0 2px color-mix(in srgb, var(--swatch) 22%, transparent); }
.swatch-chip {
  display: inline-block;
  width: 18px;
  height: 18px;
  border-radius: 4px;
  background: var(--swatch);
  border: 1px solid rgba(0, 0, 0, 0.2);
}
.swatch-label { color: var(--muted); }

.firm-logo-row { display: flex; gap: 14px; align-items: flex-start; }
.firm-logo-preview {
  width: 140px;
  height: 100px;
  border: 1px dashed var(--card-border);
  border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--surface);
  overflow: hidden;
  flex-shrink: 0;
}
.firm-logo-preview img { max-width: 100%; max-height: 100%; object-fit: contain; }
.firm-logo-actions { display: flex; flex-direction: column; gap: 8px; flex: 1; min-width: 0; }
.firm-logo-actions small { font-size: 12px; color: var(--muted); }

.firm-preview-wrap { margin-top: 8px; border-top: 1px solid var(--card-border); padding-top: 12px; }
.firm-preview-wrap > summary {
  cursor: pointer;
  font-weight: 600;
  font-size: 13px;
  list-style: none;
}
.firm-preview-wrap > summary::-webkit-details-marker { display: none; }
.firm-preview-wrap > summary::before {
  content: "▸ ";
  display: inline-block;
  transition: transform 0.15s;
}
.firm-preview-wrap[open] > summary::before { transform: rotate(90deg); }
.firm-preview-pane {
  margin-top: 12px;
  padding: 18px;
  background: #ece9e2;
  border-radius: 8px;
  display: flex;
  justify-content: center;
}
.firm-preview-stage { display: flex; justify-content: center; }
.firm-preview-sheet {
  background: var(--surface);
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.12);
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.firm-preview-inner { display: flex; flex-direction: column; height: 100%; }
.firm-preview-body {
  padding: 6px 14px 12px;
  font-size: 9.5px;
  line-height: 1.45;
  flex: 1;
}
.firm-preview-h1 {
  font-size: 12px;
  text-align: center;
  margin: 4px 0 6px;
  letter-spacing: 0.05em;
  font-weight: 700;
  color: #111;
}
.firm-preview-h2 {
  font-size: 10px;
  margin: 6px 0 3px;
  font-weight: 700;
  color: var(--firm-accent);
  border-bottom: 1px solid var(--firm-accent);
  padding-bottom: 1px;
}
.firm-preview-meta { margin: 0 0 2px; }
.firm-preview-p { margin: 0 0 4px; text-align: justify; }
.firm-preview-stage .firm-page-header { padding: 8px 14px 4px; }
.firm-preview-stage .firm-cover-header { border-bottom: 1px solid var(--firm-accent); padding-bottom: 4px; }
.firm-preview-stage .firm-cover-logo img { max-height: 22px; max-width: 80px; }
.firm-preview-stage .firm-cover-letterhead { font-size: 6.5px; line-height: 1.3; text-align: right; }

@media (max-width: 720px) {
  .firm-form-grid { grid-template-columns: 1fr; }
  .firm-logo-row { flex-direction: column; }
  .firm-logo-preview { width: 100%; height: 120px; }
}

/* ---------- Firm-paper paginated layout (AA master modal + reused inline) ---------- */

.firm-paper-modal { width: min(1200px, 96vw); height: min(94vh, 980px); }
.firm-paper-stage {
  background: #ece9e2;
  padding: 24px 0;
  overflow-y: auto;
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 18px;
}
.firm-paper-stack {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 18px;
  padding-bottom: 24px;
  width: 100%;
}
.firm-paper {
  width: var(--firm-page-width, 794px);
  min-height: var(--firm-page-height, 1123px);
  background: var(--surface);
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.12), 0 0 0 1px rgba(0, 0, 0, 0.04);
  display: flex;
  flex-direction: column;
  font-family: var(--firm-font, "Source Serif Pro", Georgia, serif);
  color: #1a1a1a;
  font-size: 11.5pt;
  line-height: 1.55;
  position: relative;
}
.firm-paper-content {
  padding: var(--firm-margin-top, 56px) var(--firm-margin-right, 96px) var(--firm-margin-bottom, 40px) var(--firm-margin-left, 96px);
  flex: 1;
}
.firm-paper-cover .firm-paper-content { padding-top: 12px; }
.firm-page-header {
  padding: 36px 56px 0;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
}
.firm-cover-header { padding-bottom: 14px; border-bottom: 2pt solid var(--firm-accent, #243043); }
.firm-cover-logo img { max-height: 96px; max-width: 240px; object-fit: contain; }
.firm-cover-letterhead {
  font-size: 10pt;
  line-height: 1.45;
  text-align: right;
  color: #2a2a2a;
  white-space: pre-line;
}
.firm-running-header {
  justify-content: flex-end;
  padding-top: 18px;
  padding-bottom: 6px;
  border-bottom: 1pt solid #d6d2c6;
}
.firm-running-name {
  font-size: 9.5pt;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--firm-accent, #243043);
  font-weight: 600;
}
.firm-page-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px 56px 24px;
  font-size: 9pt;
  color: #555;
  border-top: 1pt solid #d6d2c6;
  margin-top: auto;
}
.firm-footer-right { font-variant-numeric: tabular-nums; }

/* Inside-paper typography overrides — make AA-master content read like a real document */
.firm-paper h1 {
  font-size: 22pt;
  font-weight: 700;
  text-align: center;
  margin: 0 0 16px;
  color: #111;
}
.firm-paper h2 {
  font-size: 14pt;
  font-weight: 700;
  margin: 22px 0 8px;
  padding-bottom: 4px;
  border-bottom: 1pt solid var(--firm-accent, #243043);
  color: var(--firm-accent, #243043);
}
.firm-paper h3 { font-size: 12pt; font-weight: 700; margin: 14px 0 6px; }
.firm-paper h4 { font-size: 11pt; font-weight: 700; margin: 10px 0 4px; }
.firm-paper p { margin: 0 0 10px; text-align: justify; hyphens: auto; }
.firm-paper ul, .firm-paper ol { margin: 4px 0 12px 20px; padding: 0; }
.firm-paper li { margin: 0 0 4px; }
.firm-paper table { width: 100%; border-collapse: collapse; margin: 8px 0 14px; font-size: 10.5pt; }
.firm-paper th, .firm-paper td { border: 1pt solid #888; padding: 5px 8px; text-align: left; vertical-align: top; }
.firm-paper th { background: #f0ece4; font-weight: 600; }
.firm-paper .aa-toc { display: none; }
.firm-paper .aa-cover { padding: 0 0 18pt; margin: 0 0 24pt; border-bottom: 0; }
.firm-paper .aa-cover-title {
  font-size: 24pt;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  text-align: center;
  margin: 0 0 16pt;
  color: #111;
}
.firm-paper .aa-cover-opener { font-size: 11.5pt; margin: 0 0 18pt; text-align: justify; }
.firm-paper .aa-cover-section {
  font-size: 10.5pt;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin: 16pt 0 6pt;
  border: 0;
  padding: 0;
  color: #111;
}
.firm-paper table.aa-cover-table { width: 100%; }
.firm-paper table.aa-cover-table th { width: 38%; }
.firm-paper table.aa-item-meta { width: auto; min-width: 60%; margin: 4px 0 12px; font-size: 10pt; }
.firm-paper table.aa-item-meta th { width: 180px; background: #faf7f1; }
.firm-paper .aa-issue-tag {
  display: inline-block;
  font-size: 9pt;
  padding: 1px 6px;
  margin-left: 6px;
  background: #e0e7ff;
  border-radius: 999px;
}
.firm-paper-probe {
  position: absolute;
  left: -99999px;
  top: 0;
  visibility: hidden;
  font-family: var(--firm-font, "Source Serif Pro", Georgia, serif);
  font-size: 11.5pt;
  line-height: 1.55;
}
.firm-page-label-tag { font-size: 11px; margin-left: 6px; font-weight: 400; text-transform: uppercase; letter-spacing: 0.05em; }

@media (max-width: 1100px) {
  .firm-paper-stage { padding: 16px; }
  .firm-paper {
    width: 100%;
    max-width: var(--firm-page-width, 794px);
    min-height: 0;
  }
}

/* ---------- Word-style ribbon + paginated A4 canvas (drafting agents) ---------- */

/* When a drafting/document-editing shell is on the page, lock the chrome so
   that ONLY the document body scrolls — sidebar, top nav, ribbon and AI chat
   all stay pinned. Without this lock, the whole page would scroll as one
   when the user pages down through a long document.
   Uses :has() so we don't have to mark up the page-body or main-area from JS.
   Modern browsers (>= 2023) all support :has(). */
body:has(.word-shell),
body:has(.aa-shell) {
  height: 100vh;
  overflow: hidden;
}
body:has(.word-shell) .sopal-shell,
body:has(.aa-shell) .sopal-shell {
  height: 100vh;
  min-height: 0;
}
body:has(.word-shell) .main-area,
body:has(.aa-shell) .main-area {
  height: 100vh;
  min-height: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
body:has(.word-shell) .page-body,
body:has(.aa-shell) .page-body {
  flex: 1;
  min-height: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
body:has(.word-shell) .page-shell.word-shell {
  flex: 1;
  min-height: 0;
  padding-top: 18px;
  padding-bottom: 0;
  height: 100%;
  overflow: hidden;
  gap: 8px;
}
/* AA workspace: same chrome lock, but the page-shell itself scrolls so
   forms/cards inside each stage flow normally — head + stage-bar stay sticky
   at the top of the scroll surface so the user always sees where they are
   in the workflow. */
body:has(.aa-shell) .page-shell.aa-shell {
  flex: 1;
  min-height: 0;
  padding-top: 18px;
  padding-bottom: 32px;
  height: 100%;
  overflow-y: auto;
}
body:has(.aa-shell) .page-shell.aa-shell > .chat-page-head,
body:has(.aa-shell) .page-shell.aa-shell > .aa-stage-bar {
  position: sticky;
  top: 0;
  z-index: 8;
  background: var(--main-panel);
}
body:has(.aa-shell) .page-shell.aa-shell > .aa-stage-bar { top: 64px; }

/* Outer shell: lays out ribbon → find bar → editor + chat. Slimmer gaps so the
   ribbon and the page sheet sit close together like Word's print layout. */
.word-shell { gap: 8px; }
.word-shell > .chat-page-head { flex: 0 0 auto; }
.word-shell > .word-ribbon { flex: 0 0 auto; }
.word-shell > .word-find-bar { flex: 0 0 auto; }
.word-shell > .word-grid {
  flex: 1;
  min-height: 0;
}

/* ---- The ribbon itself ------------------------------------------------- */
.word-ribbon {
  background: linear-gradient(#fafaf9, #f4f3ef);
  border: 1px solid var(--main-border);
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.02);
}

/* Top row: undo/redo + find on the left, save state + file actions on the right.
   Visually a thin "quick access toolbar" strip above the formatting groups. */
.ribbon-quick-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 6px 10px;
  background: linear-gradient(#fff, #f7f6f1);
  border-bottom: 1px solid #e6e2d8;
  flex-wrap: wrap;
}
.ribbon-quick-left,
.ribbon-quick-right {
  display: flex;
  align-items: center;
  gap: 4px;
  flex-wrap: wrap;
}
.ribbon-quick-sep {
  width: 1px;
  height: 18px;
  background: #d6d2c6;
  margin: 0 6px;
}
.ribbon-savestate {
  font-size: 11.5px;
  padding: 0 4px;
  white-space: nowrap;
}
.ribbon-page-readout {
  font-size: 11.5px;
  color: #555;
  font-variant-numeric: tabular-nums;
  padding: 0 6px;
}

.ribbon-flat-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  height: 26px;
  padding: 0 8px;
  font-size: 12px;
  border-radius: 5px;
  border: 1px solid transparent;
  background: transparent;
  color: #2d2a26;
  cursor: pointer;
  font-family: inherit;
}
.ribbon-flat-btn .rb-glyph {
  font-size: 14px;
  line-height: 1;
}
.ribbon-flat-btn:hover { background: #ecebe6; border-color: #d6d2c6; }
.ribbon-flat-btn.primary { color: #234b8c; }
.ribbon-flat-btn.primary:hover { background: #e6efff; border-color: #b9cdef; }
.ribbon-flat-btn.danger { color: #8a2828; }
.ribbon-flat-btn.danger:hover { background: #fbe8e8; border-color: #e9b8b8; }
.ribbon-flat-btn svg { width: 14px; height: 14px; }

/* Main row: the formatting groups, separated by faint vertical rules. */
.ribbon-main-row {
  display: flex;
  align-items: stretch;
  gap: 0;
  padding: 6px 8px 4px;
  flex-wrap: wrap;
}
.ribbon-group {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 0 10px;
  border-right: 1px solid #e1ddd0;
  min-height: 70px;
}
.ribbon-group:last-child { border-right: 0; }
.ribbon-group-stack {
  display: flex;
  flex-direction: column;
  gap: 3px;
  flex: 1;
  width: 100%;
}
.ribbon-line {
  display: flex;
  align-items: center;
  gap: 2px;
  flex-wrap: nowrap;
}
.ribbon-divider-vert {
  width: 1px;
  height: 18px;
  background: #d6d2c6;
  margin: 0 4px;
}
.ribbon-group-label {
  font-size: 10px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #8a8780;
  margin-top: 2px;
  padding-top: 2px;
  font-weight: 500;
}

/* The icon button — square-ish, hover-and-active states like Word */
.ribbon-icon-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 26px;
  min-width: 26px;
  padding: 0 6px;
  border-radius: 4px;
  border: 1px solid transparent;
  background: transparent;
  font: inherit;
  font-size: 12px;
  color: #2d2a26;
  cursor: pointer;
  position: relative;
}
.ribbon-icon-btn:hover { background: #ecebe6; border-color: #d6d2c6; }
.ribbon-icon-btn.is-active {
  background: #e0e6ef;
  border-color: #aac1de;
  color: #1a3055;
}
.ribbon-icon-btn .rb-grow { font-size: 8px; margin-left: 1px; }
.ribbon-icon-btn .rb-clear { font-size: 9px; margin-left: 1px; vertical-align: super; }
.rb-bold { font-family: Georgia, serif; }
.rb-italic { font-family: Georgia, serif; font-style: italic; }

.rb-color-bar,
.rb-hl-bar {
  display: block;
  position: absolute;
  bottom: 3px;
  left: 4px;
  right: 4px;
  height: 3px;
  border-radius: 1px;
  background: #c00000;
}
.ribbon-icon-btn.rb-color,
.ribbon-icon-btn.rb-highlight { padding-bottom: 7px; }
.rb-hl-icon {
  background: rgba(255, 245, 157, 0.85);
  padding: 0 2px;
  border-radius: 2px;
}

.ribbon-color-wrap { position: relative; display: inline-flex; }
.ribbon-color-pop {
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  z-index: 12;
  background: var(--surface);
  border: 1px solid #d6d2c6;
  border-radius: 6px;
  padding: 6px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.16);
  display: grid;
  grid-template-columns: repeat(7, 18px);
  gap: 4px;
}
.ribbon-color-pop[hidden] { display: none; }
.word-swatch {
  width: 18px;
  height: 18px;
  border-radius: 3px;
  border: 1px solid rgba(0, 0, 0, 0.15);
  cursor: pointer;
  padding: 0;
}
.word-swatch.is-clear {
  background: repeating-linear-gradient(45deg, #fff, #fff 4px, #eee 4px, #eee 8px) !important;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 10px;
}
.ribbon-color-auto {
  grid-column: 1 / -1;
  margin-top: 4px;
  height: 22px;
  font-size: 11px;
  border: 1px solid #d6d2c6;
  background: #f7f6f1;
  border-radius: 4px;
  cursor: pointer;
}
.ribbon-color-auto:hover { background: #ecebe6; }

/* The native <select> — restyled to fit the ribbon look */
.ribbon-select {
  height: 24px;
  padding: 0 6px;
  font: inherit;
  font-size: 12px;
  background: var(--surface);
  border: 1px solid #d6d2c6;
  border-radius: 4px;
  color: #2d2a26;
  cursor: pointer;
}
.ribbon-select:hover { background: #fafaf9; }
.ribbon-select:focus { outline: none; border-color: #6b8bb8; box-shadow: 0 0 0 2px rgba(107, 139, 184, 0.18); }
.ribbon-font-select { width: 132px; }
.ribbon-size-select { width: 56px; }
.ribbon-linespace-select { width: 60px; }
.ribbon-style-select { width: 110px; }

/* Alignment glyphs — drawn with stacked horizontal bars */
.rb-align {
  display: inline-block;
  width: 14px;
  height: 12px;
  position: relative;
}
.rb-align::before,
.rb-align::after {
  content: "";
  position: absolute;
  left: 0;
  height: 1.5px;
  background: currentColor;
  border-radius: 1px;
}
.rb-align::before { top: 2px; }
.rb-align::after { top: 8px; }
.rb-align-l::before { width: 14px; }
.rb-align-l::after  { width: 9px; }
.rb-align-c::before { width: 14px; left: 0; }
.rb-align-c::after  { width: 10px; left: 2px; }
.rb-align-r::before { width: 14px; left: 0; }
.rb-align-r::after  { width: 9px; left: 5px; }
.rb-align-j::before { width: 14px; }
.rb-align-j::after  { width: 14px; }
.rb-align-l,
.rb-align-c,
.rb-align-r,
.rb-align-j {
  background-image: linear-gradient(currentColor, currentColor);
  background-repeat: no-repeat;
  background-size: 14px 1.5px;
  background-position: 0 5px;
}

/* Mini "style preview" tiles in the Styles group, just like Word's gallery */
.ribbon-style-preview {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 28px;
  padding: 0 8px;
  border: 1px solid #d6d2c6;
  border-radius: 4px;
  font-size: 11px;
  color: #555;
  background: var(--surface);
  cursor: default;
}
.rb-sp-h1 { font-family: "Calibri", "Source Serif Pro", serif; font-size: 11.5px; color: #234b8c; }
.rb-sp-h2 { font-family: "Calibri", "Source Serif Pro", serif; font-size: 11px; color: #234b8c; font-weight: 600; }
.rb-sp-p  { font-family: "Calibri", "Source Serif Pro", serif; font-size: 11px; }

/* ---- Find / Replace inline bar ---------------------------------------- */
.word-find-bar {
  background: #fff8d8;
  border: 1px solid #e3d99a;
  border-radius: 8px;
  padding: 8px 10px;
}
.word-find-bar[hidden] { display: none; }
.wfb-row {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.wfb-row label { font-size: 12px; display: flex; align-items: center; gap: 6px; color: #5a4f1f; }
.wfb-input { width: 200px; height: 28px; font-size: 12.5px; }
.wfb-status { font-size: 11.5px; }
mark.wfb-match { background: rgba(255, 235, 59, 0.55); color: inherit; padding: 0 1px; border-radius: 2px; }
mark.wfb-match.is-active { background: rgba(255, 152, 0, 0.55); outline: 1px solid #cc7000; }

/* ---- Page canvas + paginated sheet ------------------------------------ */
.word-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr);
  /* One row taking full available height; min:0 lets children shrink so
     internal-scroll surfaces (canvas, chat stream) actually engage. */
  grid-template-rows: minmax(0, 1fr);
  gap: 14px;
  align-items: stretch;
  min-height: 0;
}

.word-doc-card {
  padding: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  background: transparent;
  border: 1px solid var(--main-border);
  min-height: 0;
  height: 100%;
}
.word-canvas {
  background: #ece9e2;
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  padding: 28px 24px 32px;
  display: flex;
  justify-content: center;
}

/* The AI chat sidebar — also internal-scroll so the chrome around it
   (sidebar + ribbon + canvas + the chat composer) all stay put. */
.word-shell .drafting-chat-card {
  height: 100%;
  min-height: 0;
}
.word-shell .drafting-chat-stream { min-height: 0; }
[data-theme="dark"] .word-canvas { background: #1c1a16; }

.word-page-stack {
  display: flex;
  flex-direction: column;
  gap: 18px;
  width: 100%;
  align-items: center;
}

/* Single tall sheet — A4-width, white, with running header + footer strips
   pinned at top/bottom. The contenteditable scrolls inside; page-break
   overlays are absolutely positioned over it at every page-content-height. */
.word-page {
  width: var(--firm-page-width, 794px);
  max-width: 100%;
  min-height: var(--firm-page-height, 1123px);
  background: var(--surface);
  box-shadow:
    0 4px 18px rgba(0, 0, 0, 0.10),
    0 0 0 1px rgba(0, 0, 0, 0.05);
  border-radius: 1px;
  display: flex;
  flex-direction: column;
  position: relative;
  font-family: var(--firm-font, "Source Serif Pro", "Times New Roman", Georgia, serif);
  color: #1a1a1a;
}
[data-theme="dark"] .word-page { background: #232017; color: #e9e6df; }

.word-page-running-header {
  height: 28px;
  padding: 6px var(--firm-margin-right, 96px) 0 var(--firm-margin-left, 96px);
  font-size: 9.5pt;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--firm-accent, #243043);
  font-weight: 600;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  border-bottom: 1px dashed #e6e2d8;
}
.wph-name:empty::before { content: ""; }

.word-page-body {
  flex: 1;
  position: relative;
  display: flex;
  flex-direction: column;
}

.drafting-editor.word-editor {
  flex: 1;
  padding: var(--firm-margin-top, 96px) var(--firm-margin-right, 96px) var(--firm-margin-bottom, 96px) var(--firm-margin-left, 96px);
  min-height: calc(var(--firm-page-height, 1123px) - 56px);
  background: transparent;
  font-family: inherit;
  font-size: 12pt;
  line-height: 1.55;
  color: inherit;
  outline: none;
  position: relative;
  z-index: 1;
  width: auto;
  max-width: none;
  box-shadow: none;
}
.drafting-editor.word-editor:focus { outline: none; }

/* Page-break dividers — drawn over the editor as horizontal rules with a
   "Page N" label sitting on top, mimicking the gap between Word pages. */
.word-page-overlays {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 2;
}
.word-page-divider {
  position: absolute;
  left: 0;
  right: 0;
  height: 28px;
  margin-top: -14px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(#ece9e2, #ece9e2);
  border-top: 1px solid #d3cfc4;
  border-bottom: 1px solid #d3cfc4;
}
.word-page-divider .wpd-label {
  font-size: 10px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #8a857a;
  background: #ece9e2;
  padding: 0 8px;
}
[data-theme="dark"] .word-page-divider { background: #1c1a16; border-color: #34302a; }
[data-theme="dark"] .word-page-divider .wpd-label { background: #1c1a16; color: #98927f; }

.word-page-running-footer {
  height: 28px;
  padding: 0 var(--firm-margin-right, 96px) 6px var(--firm-margin-left, 96px);
  font-size: 9pt;
  color: #555;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-top: 1px dashed #e6e2d8;
}
.wpf-right { font-variant-numeric: tabular-nums; }

/* ---- Editor typography (inside .word-editor) -------------------------- */
.drafting-editor.word-editor h1,
.drafting-editor.word-editor h2,
.drafting-editor.word-editor h3,
.drafting-editor.word-editor p,
.drafting-editor.word-editor ul,
.drafting-editor.word-editor ol,
.drafting-editor.word-editor table,
.drafting-editor.word-editor th,
.drafting-editor.word-editor td,
.drafting-editor.word-editor blockquote {
  font-family: inherit;
}
.drafting-editor.word-editor blockquote {
  margin: 12px 0 12px 24px;
  padding: 4px 14px;
  border-left: 3px solid var(--firm-accent, #243043);
  color: #444;
  font-style: italic;
}
.drafting-editor.word-editor .manual-page-break {
  height: 12px;
  margin: 14px 0;
  border-top: 1.5px dashed #b8b3a4;
  position: relative;
}
.drafting-editor.word-editor .manual-page-break::before {
  content: "Page break";
  position: absolute;
  top: -8px;
  left: 50%;
  transform: translateX(-50%);
  background: var(--surface);
  padding: 0 8px;
  font-size: 9.5px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #8a857a;
}
.drafting-editor.word-editor img { max-width: 100%; height: auto; }

/* Keep the legacy single-class .drafting-editor styles for the AA edit
   sub-modal which still uses that class on its own.
   (Reset some of the earlier inherited styles for word-mode.) */
.word-doc-card.drafting-doc-card {
  background: transparent;
  padding: 0;
  display: block;
}
.drafting-editor.word-editor {
  width: auto;
  max-width: none;
  box-shadow: none;
}

/* ---- Compact ribbon for narrower viewports --------------------------- */
@media (max-width: 1280px) {
  .ribbon-style-preview { display: none; }
  .ribbon-font-select { width: 110px; }
}
@media (max-width: 1100px) {
  .ribbon-group { padding: 0 6px; }
  .ribbon-group-label { font-size: 9px; }
}
@media (max-width: 980px) {
  .word-grid { grid-template-columns: 1fr; min-height: 0; }
  .word-page { width: 100%; min-height: 720px; }
  .word-canvas { padding: 16px 8px; }
  .drafting-editor.word-editor {
    padding: 32px 28px;
    min-height: 520px;
  }
  /* Below desktop sizes the locked-shell becomes too cramped — release the
     body lock and let the page scroll normally with the document inline. */
  body:has(.word-shell),
  body:has(.aa-shell) {
    height: auto;
    overflow: visible;
  }
  body:has(.word-shell) .sopal-shell,
  body:has(.aa-shell) .sopal-shell {
    height: auto;
    min-height: 100vh;
  }
  body:has(.word-shell) .main-area,
  body:has(.aa-shell) .main-area {
    height: auto;
    min-height: 100vh;
    overflow: visible;
  }
  body:has(.word-shell) .page-body,
  body:has(.aa-shell) .page-body {
    flex: 1 1 auto;
    overflow: visible;
    display: block;
  }
  body:has(.word-shell) .page-shell.word-shell,
  body:has(.aa-shell) .page-shell.aa-shell {
    flex: none;
    height: auto;
    overflow: visible;
    padding-bottom: 32px;
  }
}

/* ---------- Legacy drafting editor styles (still used elsewhere) ---------- */

.drafting-doc-card {
  background: #ece9e2;
  padding: 24px;
  display: flex;
  justify-content: center;
  overflow-y: auto;
}
.drafting-editor {
  width: 794px;
  max-width: 100%;
  min-height: 1080px;
  background: var(--surface);
  padding: 64px 96px;
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.10), 0 0 0 1px rgba(0, 0, 0, 0.04);
  font-family: "Source Serif Pro", "Times New Roman", Georgia, serif;
  font-size: 12pt;
  line-height: 1.55;
  color: #1a1a1a;
}
.drafting-editor h1 {
  font-size: 20pt;
  font-weight: 700;
  text-align: center;
  margin: 0 0 14px;
  color: #111;
}
.drafting-editor h2 {
  font-size: 14pt;
  font-weight: 700;
  margin: 18px 0 6px;
  border-bottom: 1pt solid #c4bfb1;
  padding-bottom: 3px;
  color: #1a1a1a;
}
.drafting-editor h3 { font-size: 12.5pt; font-weight: 700; margin: 12px 0 4px; }
.drafting-editor p { margin: 0 0 10px; text-align: justify; hyphens: auto; }
.drafting-editor ul, .drafting-editor ol { margin: 4px 0 10px 22px; padding: 0; }
.drafting-editor table { width: 100%; border-collapse: collapse; margin: 8px 0 14px; font-size: 11pt; }
.drafting-editor th, .drafting-editor td { border: 1pt solid #888; padding: 5px 8px; text-align: left; vertical-align: top; }
.drafting-editor th { background: #f0ece4; font-weight: 600; }

/* Print stylesheet — when the user prints from the SPA itself, hide chrome */
@media print {
  .sopal-sidebar, .main-header, .drafting-toolbar, .drafting-chat-card,
  .aa-master-modal-head, .modal-backdrop > .modal:not(.firm-paper-modal) {
    display: none !important;
  }
  .firm-paper-stage { background: var(--surface); padding: 0; gap: 0; }
  .firm-paper { box-shadow: none; page-break-after: always; }
  .firm-paper:last-child { page-break-after: auto; }
}

/* ============================================================
   Multi-instance drafting: instance bar, drafts list, sidebar
   instance expansion.
   ============================================================ */

.draft-instance-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 8px 14px;
  margin: 0 0 10px;
  background: #fdfcf9;
  border: 1px solid var(--main-border);
  border-radius: 10px;
  font-size: 13px;
  flex-wrap: wrap;
}
.draft-instance-bar-left {
  display: flex;
  align-items: center;
  gap: 10px;
  flex: 1;
  min-width: 0;
}
.draft-instance-bar-right {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
.draft-instance-title {
  font-size: 13.5px;
  font-weight: 650;
  background: transparent;
  border: 1px solid transparent;
  border-radius: 6px;
  padding: 5px 8px;
  margin: -5px -8px;
  min-width: 200px;
  max-width: 360px;
  outline: none;
  color: inherit;
}
.draft-instance-title:hover { border-color: var(--main-border); background: var(--surface); }
.draft-instance-title:focus { border-color: var(--ring); background: var(--surface); }
.draft-instance-switch {
  height: 28px;
  border: 1px solid var(--main-border);
  border-radius: 6px;
  background: var(--surface);
  padding: 0 24px 0 8px;
  font-size: 12.5px;
}

/* Drafts-list page rows. */
.drafts-listing-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin: 10px 0 6px;
}
.drafts-listing-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.draft-listing-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 14px;
  background: var(--surface);
  border: 1px solid var(--main-border);
  border-radius: 10px;
  transition: border-color 0.1s, background-color 0.1s;
}
.draft-listing-row:hover { border-color: var(--ring); background: #fdfcf9; }
.draft-listing-open {
  flex: 1;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 12px;
  background: transparent;
  border: 0;
  padding: 0;
  text-align: left;
  cursor: pointer;
  color: inherit;
}
.draft-listing-icon {
  display: inline-flex;
  width: 32px;
  height: 32px;
  border-radius: 8px;
  background: var(--accent);
  align-items: center;
  justify-content: center;
  color: var(--main-fg);
  flex-shrink: 0;
}
.draft-listing-icon svg { width: 16px; height: 16px; }
.draft-listing-text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.draft-listing-text strong { font-size: 14px; font-weight: 600; }
.draft-listing-text .muted { font-size: 12px; }
.draft-listing-actions { display: inline-flex; gap: 6px; flex-shrink: 0; }

/* Sidebar: expandable drafting-agent rows. */
.nav-agent-row { display: flex; flex-direction: column; }
.nav-agent-head { display: flex; align-items: stretch; gap: 0; }
.nav-agent-head .nav-item { flex: 1; min-width: 0; }
.nav-item-agent {
  display: flex;
  align-items: center;
  gap: 10px;
}
.nav-instance-count {
  margin-left: auto;
  font-size: 11px;
  color: var(--muted-fg);
  background: var(--sidebar-active);
  padding: 1px 6px;
  border-radius: 9px;
  min-width: 18px;
  text-align: center;
}
.nav-agent-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  border: 0;
  background: transparent;
  color: var(--muted-fg);
  cursor: pointer;
  border-radius: 5px;
  margin-right: 6px;
  flex-shrink: 0;
}
.nav-agent-toggle:hover { background: var(--sidebar-hover); color: var(--sidebar-fg); }
.nav-agent-toggle svg { width: 12px; height: 12px; transition: transform 0.12s; }
.nav-agent-toggle.open svg { transform: rotate(90deg); }
.nav-agent-instances {
  display: none;
  flex-direction: column;
  margin: 0 8px 4px 36px;
  border-left: 1px solid var(--sidebar-divider);
  padding-left: 6px;
  gap: 1px;
}
.nav-agent-instances.open { display: flex; }
.nav-instance-item {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 4px 8px;
  font-size: 12.5px;
  color: var(--sidebar-fg);
  text-decoration: none;
  border-radius: 5px;
  cursor: pointer;
}
.nav-instance-item:hover { background: var(--sidebar-hover); }
.nav-instance-item.active { background: var(--sidebar-active); font-weight: 600; }
.nav-instance-bullet {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--muted-fg);
  flex-shrink: 0;
}
.nav-instance-bullet.new {
  width: 14px;
  height: 14px;
  border-radius: 4px;
  background: transparent;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--muted-fg);
  font-size: 13px;
  line-height: 1;
}
.nav-instance-text {
  flex: 1;
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.nav-instance-add {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 4px 8px;
  border: 0;
  background: transparent;
  color: var(--muted-fg);
  font-size: 12px;
  cursor: pointer;
  border-radius: 5px;
  text-align: left;
}
.nav-instance-add:hover { background: var(--sidebar-hover); color: var(--sidebar-fg); }

/* AA snapshot bar — sits between the page head and the stage bar. */
.aa-snapshot-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 8px 14px;
  margin: 0 0 12px;
  background: #fdfcf9;
  border: 1px solid var(--main-border);
  border-radius: 10px;
  font-size: 13px;
  flex-wrap: wrap;
}
.aa-snapshot-bar-left { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.aa-snapshot-bar-right { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.aa-snapshot-label { font-weight: 650; }
.aa-snapshot-bar select { min-width: 220px; }
.aa-snapshot-list { display: flex; flex-direction: column; gap: 8px; }
.aa-snapshot-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 12px;
  border: 1px solid var(--main-border);
  border-radius: 8px;
  background: var(--surface);
}
.aa-snapshot-meta { display: flex; flex-direction: column; min-width: 0; }
.aa-snapshot-meta strong { font-size: 13.5px; }
.aa-snapshot-meta .muted { font-size: 12px; }
.aa-snapshot-actions { display: inline-flex; gap: 6px; flex-shrink: 0; }


/* ---------- Onboarding overlay (first-run guided tour) ---------- */

.onb-backdrop {
  position: fixed;
  inset: 0;
  z-index: 120;
  background: rgba(15, 17, 20, 0.55);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  animation: fade 0.18s ease-out;
}
.onb-card {
  width: min(620px, 100%);
  max-height: calc(100vh - 48px);
  overflow-y: auto;
  background: var(--surface);
  border-radius: 18px;
  box-shadow: var(--shadow-lg);
  display: flex;
  flex-direction: column;
}
.onb-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 18px 24px 0;
}
.onb-progress { display: flex; align-items: center; gap: 8px; }
.onb-dot {
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: #e5e2db;
  display: inline-block;
  transition: width 0.18s ease, background 0.18s ease;
}
.onb-dot.done { background: #b7b1a4; }
.onb-dot.active { background: var(--button); width: 22px; }
.onb-skip {
  background: none;
  border: 0;
  color: var(--muted-fg);
  font-size: 12.5px;
  font-weight: 500;
  cursor: pointer;
  padding: 4px 6px;
}
.onb-skip:hover { color: var(--main-fg); text-decoration: underline; }

.onb-body { padding: 12px 28px 26px; }
.onb-step { display: flex; flex-direction: column; gap: 14px; }
.onb-step.welcome { gap: 12px; }
.onb-eyebrow {
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--muted-fg);
}
.onb-step h2 {
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -0.01em;
  margin: 0;
}
.onb-step p {
  margin: 0;
  font-size: 14px;
  color: #2c2c2c;
  line-height: 1.55;
}
.onb-muted { color: var(--muted-fg); font-size: 13px; }

.onb-tile-grid { display: grid; gap: 10px; margin-top: 4px; }
.onb-tile-grid.one-col { grid-template-columns: 1fr; }
.onb-tile-grid.two-col { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.onb-tile {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  padding: 14px 16px;
  text-align: left;
  background: var(--surface);
  border: 1.5px solid var(--main-border);
  border-radius: 12px;
  cursor: pointer;
  transition: border-color 0.15s, background 0.15s, transform 0.05s;
}
.onb-tile:hover { border-color: var(--ring); background: var(--main-muted); }
.onb-tile:active { transform: scale(0.99); }
.onb-tile.selected { border-color: var(--button); background: var(--main-muted); }
.onb-tile strong { font-size: 14px; font-weight: 650; color: var(--main-fg); }
.onb-tile span { font-size: 12.5px; color: var(--muted-fg); line-height: 1.45; }

.onb-field { display: flex; flex-direction: column; gap: 6px; font-size: 12.5px; font-weight: 600; color: var(--muted-fg); }
.onb-logo-row { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.onb-logo-preview {
  width: 56px;
  height: 56px;
  object-fit: contain;
  background: var(--main-muted);
  border: 1px solid var(--main-border);
  border-radius: 10px;
  padding: 4px;
}
.onb-logo-placeholder {
  width: 56px;
  height: 56px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--main-muted);
  border: 1px dashed var(--ring);
  border-radius: 10px;
  font-size: 11px;
  color: var(--muted-fg);
  font-weight: 500;
}
.onb-file-button { font-weight: 500; cursor: pointer; }

.onb-tour-list { display: flex; flex-direction: column; gap: 10px; margin-top: 4px; }
.onb-tour-row {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 12px 14px;
  background: var(--main-muted);
  border: 1px solid var(--main-border);
  border-radius: 12px;
}
.onb-tour-icon {
  width: 32px;
  height: 32px;
  flex-shrink: 0;
  border-radius: 8px;
  background: var(--surface);
  border: 1px solid var(--main-border);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--main-fg);
}
.onb-tour-icon svg { width: 16px; height: 16px; }
.onb-tour-text strong { display: block; font-size: 13.5px; font-weight: 650; margin-bottom: 2px; }
.onb-tour-text p { font-size: 12.5px; color: var(--muted-fg); line-height: 1.5; }

.onb-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 6px;
  flex-wrap: wrap;
}
.onb-actions .onb-spacer { flex: 1; }
.onb-actions .dark-button[disabled] { opacity: 0.45; cursor: not-allowed; }

@media (max-width: 560px) {
  .onb-tile-grid.two-col { grid-template-columns: 1fr; }
  .onb-body { padding: 10px 20px 22px; }
  .onb-top { padding: 16px 20px 0; }
  .onb-step h2 { font-size: 19px; }
}


/* ---------- Login wall ---------- */

.auth-wall {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--sidebar-bg);
  padding: 24px;
}
.auth-wall-card {
  width: 100%;
  max-width: 400px;
  background: var(--surface);
  border: 1px solid var(--main-border);
  border-radius: var(--radius-xl);
  box-shadow: var(--shadow-md);
  padding: 32px 32px 24px;
  color: var(--main-fg);
}
.auth-wall-brand {
  font-size: 20px;
  font-weight: 700;
  letter-spacing: -0.02em;
  margin-bottom: 18px;
}
.auth-wall-card h1 {
  font-size: 19px;
  font-weight: 650;
  margin: 0 0 6px;
  letter-spacing: -0.01em;
}
.auth-wall-sub { margin: 0 0 18px; font-size: 13px; line-height: 1.5; }
.auth-wall-card form { display: flex; flex-direction: column; gap: 12px; }
.auth-wall-card form label { display: flex; flex-direction: column; gap: 5px; font-size: 12.5px; font-weight: 550; }
.auth-wall-card .row-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.auth-wall-card .dark-button { margin-top: 4px; width: 100%; justify-content: center; }
.auth-wall-switch { margin: 16px 0 0; font-size: 12.5px; text-align: center; }
.auth-wall-switch .link-button { font-size: 12.5px; text-decoration: underline; }
.auth-wall-checking { display: flex; flex-direction: column; gap: 10px; align-items: flex-start; }

/* ---------- New-project contract-first modal ---------- */

.modal-wide { max-width: 560px; width: 100%; }
.modal-wide .modal-body { max-height: 72vh; overflow-y: auto; }
.project-upload-intro { margin: 0 0 14px; font-size: 13px; line-height: 1.55; color: var(--muted-fg); }
.project-upload-zone { cursor: pointer; }
.project-upload-list {
  list-style: none;
  margin: 12px 0 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.project-upload-list li {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  background: var(--main-muted);
  border: 1px solid var(--main-border);
  border-radius: var(--radius-md);
  font-size: 12.5px;
}
.project-upload-list li .doc-list-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 550; }
.project-upload-list li .doc-list-meta { color: var(--soft-fg); font-size: 11.5px; white-space: nowrap; }
.warn-banner {
  background: var(--warn-bg);
  border: 1px solid var(--warn-border);
  color: var(--warn-fg);
  border-radius: var(--radius-md);
  padding: 8px 12px;
  font-size: 12.5px;
  line-height: 1.5;
}
.project-doc-note { font-size: 12px; margin: 0; }

.drafting-generate-cta { display: flex; flex-direction: column; gap: 10px; align-items: flex-start; text-align: left; }
.drafting-generate-cta .dark-button { display: inline-flex; align-items: center; gap: 7px; }
.drafting-generate-cta .dark-button svg { width: 14px; height: 14px; }

/* ---------- Reviewer wizard ---------- */

.rw-shell {
  max-width: 1400px;
  margin: 0 auto;
  padding: 28px 36px 48px;
}
.rw-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 26px;
  flex-wrap: wrap;
}
.rw-header-left { display: flex; align-items: flex-start; gap: 10px; min-width: 0; }
.rw-back { margin-top: 3px; }
.rw-back svg { width: 16px; height: 16px; }
.rw-title { font-size: 22px; font-weight: 700; letter-spacing: -0.015em; margin: 0; }
.rw-sub { margin: 3px 0 0; font-size: 12.5px; }
.rw-header-right { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }

.rw-dots { display: flex; align-items: center; gap: 6px; }
.rw-dot {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: none;
  background: none;
  padding: 4px 6px;
  border-radius: var(--radius-md);
  cursor: pointer;
  color: var(--soft-fg);
  font-size: 11.5px;
  font-weight: 550;
}
.rw-dot:not(:disabled):hover { background: var(--surface-hover); }
.rw-dot:disabled { cursor: default; opacity: 0.55; }
.rw-dot-num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px; height: 20px;
  border-radius: 999px;
  border: 1.5px solid var(--ring);
  font-size: 10.5px;
  font-weight: 650;
}
.rw-dot-done { color: var(--muted-fg); }
.rw-dot-done .rw-dot-num { background: var(--success-bg); border-color: var(--success-border); color: var(--success-fg); }
.rw-dot-current { color: var(--main-fg); }
.rw-dot-current .rw-dot-num { background: var(--button); border-color: var(--button); color: var(--button-fg); }
.rw-dot-line { width: 16px; height: 1.5px; background: var(--main-border); }
@media (max-width: 860px) { .rw-dot-label { display: none; } }

.rw-step-pane {
  transition: transform 0.3s cubic-bezier(0.22, 0.8, 0.3, 1), opacity 0.3s ease;
  transform: translateX(0);
  opacity: 1;
}
.rw-enter-from-right { transform: translateX(36px); opacity: 0; }
.rw-enter-from-left { transform: translateX(-36px); opacity: 0; }
@media (prefers-reduced-motion: reduce) {
  .rw-step-pane { transition: none; }
  .rw-enter-from-right, .rw-enter-from-left { transform: none; opacity: 1; }
}

.rw-step { max-width: 760px; margin: 6vh auto 0; text-align: center; }
.rw-question { font-size: 26px; font-weight: 700; letter-spacing: -0.02em; margin: 0 0 8px; }
.rw-question-sub { margin: 0 0 30px; font-size: 14px; }
.rw-choice-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.rw-choice-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
@media (max-width: 720px) { .rw-choice-row, .rw-choice-grid { grid-template-columns: 1fr; } }
.rw-choice-card {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 7px;
  padding: 22px 22px 20px;
  text-align: left;
  background: var(--surface);
  border: 1.5px solid var(--main-border);
  border-radius: var(--radius-lg);
  cursor: pointer;
  font: inherit;
  color: var(--main-fg);
  transition: border-color 0.15s, background 0.15s, transform 0.15s, box-shadow 0.15s;
}
.rw-choice-card:hover { border-color: var(--ring); background: var(--surface-hover); transform: translateY(-2px); box-shadow: var(--shadow-md); }
.rw-choice-card.selected { border-color: var(--focus); background: var(--success-bg); }
.rw-choice-card strong { font-size: 15.5px; font-weight: 650; }
.rw-choice-card .muted { font-size: 12.5px; line-height: 1.5; }
.rw-choice-icon { color: var(--muted-fg); }
.rw-choice-icon svg { width: 20px; height: 20px; }
.rw-choice-tick {
  position: absolute;
  top: 12px; right: 14px;
  color: var(--success-fg);
  font-weight: 700;
}

.rw-step-upload { text-align: center; }
.rw-upload-zone { cursor: pointer; padding: 40px 24px; }
.rw-upload-list {
  list-style: none;
  margin: 14px 0 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
  text-align: left;
}
.rw-upload-list li {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 12px;
  background: var(--main-muted);
  border: 1px solid var(--main-border);
  border-radius: var(--radius-md);
  font-size: 12.5px;
}
.rw-doc-kind {
  flex: 0 0 auto;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-weight: 650;
  color: var(--success-fg);
  background: var(--success-bg);
  border: 1px solid var(--success-border);
  border-radius: 999px;
  padding: 2px 8px;
}
.rw-upload-list .doc-list-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 550; }
.rw-upload-list .doc-list-meta { color: var(--soft-fg); white-space: nowrap; }
.rw-paste { margin-top: 14px; text-align: left; }
.rw-paste summary { cursor: pointer; font-size: 13px; color: var(--muted-fg); }
.rw-paste textarea { width: 100%; margin-top: 10px; }
.rw-paste-foot { display: flex; align-items: center; justify-content: space-between; margin-top: 8px; }
.rw-upload-error { margin-top: 12px; }
.rw-upload-error:not([hidden]) {
  background: var(--danger-bg);
  border: 1px solid var(--danger-border);
  color: var(--danger);
  border-radius: var(--radius-md);
  padding: 9px 12px;
  font-size: 12.5px;
}
.rw-step-actions { display: flex; align-items: center; justify-content: center; gap: 14px; margin-top: 26px; flex-wrap: wrap; }
.rw-run-btn { display: inline-flex; align-items: center; gap: 8px; padding: 12px 26px; font-size: 14.5px; }
.rw-run-btn svg { width: 16px; height: 16px; }

/* Workspace */
.rw-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 18px;
  align-items: start;
}
@media (max-width: 1100px) { .rw-workspace { grid-template-columns: 1fr; } }
.rw-doc-col { padding: 0; overflow: hidden; display: flex; flex-direction: column; position: sticky; top: 16px; max-height: calc(100vh - 110px); }
@media (max-width: 1100px) { .rw-doc-col { position: static; max-height: 560px; } }
.rw-analysis-col { display: flex; flex-direction: column; gap: 18px; min-width: 0; }

.rw-doc-tabs {
  display: flex;
  gap: 2px;
  padding: 8px 8px 0;
  border-bottom: 1px solid var(--main-border);
  overflow-x: auto;
}
.rw-doc-tab {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1px;
  padding: 8px 12px;
  border: 1px solid transparent;
  border-bottom: none;
  border-radius: var(--radius-md) var(--radius-md) 0 0;
  background: none;
  cursor: pointer;
  font: inherit;
  color: var(--muted-fg);
  max-width: 220px;
}
.rw-doc-tab:hover { background: var(--surface-hover); }
.rw-doc-tab.active { background: var(--surface); border-color: var(--main-border); color: var(--main-fg); margin-bottom: -1px; }
.rw-doc-tab-name { font-size: 12.5px; font-weight: 550; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rw-doc-tab-meta { font-size: 10px; text-transform: uppercase; letter-spacing: 0.05em; }
.rw-doc-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 14px;
  border-bottom: 1px solid var(--main-border);
  flex-wrap: wrap;
}
.rw-view-toggle { margin: 0; }
.rw-view-hint { font-size: 11.5px; }
.rw-doc-view { flex: 1; min-height: 320px; overflow: auto; }
.rw-doc-frame { width: 100%; height: 100%; min-height: 520px; border: none; display: block; }
.rw-paper {
  padding: 26px 30px;
  font-family: "Source Serif Pro", "Charter", Georgia, "Times New Roman", serif;
  font-size: 13.5px;
  line-height: 1.75;
  color: var(--main-fg);
  background: var(--surface);
  white-space: normal;
  word-break: break-word;
}

mark.rw-ann {
  position: relative;
  padding: 1px 2px;
  border-radius: 3px;
  cursor: pointer;
  color: inherit;
  background: var(--mark-bg);
  border-bottom: 2px solid var(--warn-border-strong);
}
mark.rw-ann-fail { background: rgba(239, 68, 68, 0.16); border-bottom-color: #ef4444; }
mark.rw-ann-warn { background: var(--mark-bg); border-bottom-color: var(--warn-border-strong); }
mark.rw-ann-pass { background: var(--success-bg); border-bottom-color: var(--success-border); }
mark.rw-ann-info { background: rgba(59, 130, 246, 0.13); border-bottom-color: rgba(59, 130, 246, 0.55); }
.rw-ann-chip {
  font-family: Inter, -apple-system, sans-serif;
  font-size: 9px;
  font-weight: 700;
  margin-left: 2px;
  color: var(--muted-fg);
}
[data-theme="dark"] mark.rw-ann { color: var(--main-fg); }
[data-theme="dark"] mark.rw-ann-fail { background: rgba(239, 68, 68, 0.28); }
[data-theme="dark"] mark.rw-ann-info { background: rgba(96, 165, 250, 0.24); }

.rw-thinking-wrap { display: flex; flex-direction: column; gap: 12px; }
.rw-thinking {
  font-size: 12.5px;
  line-height: 1.7;
  color: var(--muted-fg);
  background: var(--main-muted);
  border: 1px solid var(--main-border);
  border-radius: var(--radius-md);
  padding: 14px 16px;
  max-height: 380px;
  overflow-y: auto;
  white-space: pre-wrap;
  word-break: break-word;
}
.rw-thinking:empty::before { content: "…"; opacity: 0.6; }
[data-rw-thinking]:not(.rw-thinking-done)::after {
  content: "▋";
  display: inline-block;
  margin-left: 1px;
  animation: rw-caret 1.1s steps(2) infinite;
  opacity: 0.7;
}
@keyframes rw-caret { 50% { opacity: 0; } }
@media (prefers-reduced-motion: reduce) { [data-rw-thinking]::after { animation: none; } }
.rw-notes-details { margin-bottom: 14px; }
.rw-notes-details summary { cursor: pointer; font-size: 12.5px; color: var(--muted-fg); }
.rw-notes-details .rw-thinking { margin-top: 8px; max-height: 260px; }

.rw-pills { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 12px; }
.rw-summary { font-size: 13.5px; line-height: 1.6; margin-bottom: 16px; }
.rw-check-list { margin-bottom: 18px; }
.rw-ann-section h4, .rw-recs h4, .rw-missing h4 {
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--muted-fg);
  margin: 18px 0 10px;
}
.rw-ann-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.rw-ann-card {
  display: flex;
  gap: 10px;
  padding: 10px 12px;
  background: var(--surface);
  border: 1px solid var(--main-border);
  border-left-width: 3px;
  border-radius: var(--radius-md);
  cursor: pointer;
  transition: border-color 0.15s, background 0.15s;
}
.rw-ann-card:hover { background: var(--surface-hover); }
.rw-ann-card-fail { border-left-color: #ef4444; }
.rw-ann-card-warn { border-left-color: var(--warn-border-strong); }
.rw-ann-card-pass { border-left-color: var(--success-border); }
.rw-ann-card-info { border-left-color: rgba(59, 130, 246, 0.55); }
.rw-ann-card-num {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px; height: 20px;
  border-radius: 999px;
  background: var(--main-muted);
  border: 1px solid var(--main-border);
  font-size: 10.5px;
  font-weight: 700;
  color: var(--muted-fg);
}
.rw-ann-card-body { min-width: 0; }
.rw-ann-card-body blockquote {
  margin: 0 0 5px;
  font-size: 12px;
  font-style: italic;
  color: var(--muted-fg);
  border-left: 2px solid var(--main-border);
  padding-left: 8px;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.rw-ann-card-body p { margin: 0 0 4px; font-size: 12.5px; line-height: 1.5; }
.rw-ann-card-meta { font-size: 11px; }
.rw-recs ol, .rw-missing ul { margin: 0; padding-left: 20px; font-size: 13px; line-height: 1.6; }

.rw-flash { animation: rw-flash-anim 1.2s ease; }
@keyframes rw-flash-anim {
  0% { box-shadow: 0 0 0 3px var(--focus); }
  100% { box-shadow: 0 0 0 0 transparent; }
}
@media (prefers-reduced-motion: reduce) { .rw-flash { animation: none; outline: 2px solid var(--focus); } }
mark.rw-ann.rw-flash { animation: none; outline: 2px solid var(--focus); outline-offset: 1px; }

.rw-chat-card { display: flex; flex-direction: column; }
.rw-chat { display: flex; flex-direction: column; min-height: 220px; max-height: 420px; }
.rw-chat .message-area { flex: 1; overflow-y: auto; padding: 12px 14px; }
.rw-chat .review-composer { border-top: 1px solid var(--main-border); padding: 10px 12px; }
.rw-analysis-card .card-body { max-height: none; }
.rw-analysis-actions { display: flex; gap: 8px; }

/* ---------- Dev chat (owner-only) ---------- */

.devchat {
  position: fixed;
  right: 22px;
  bottom: 22px;
  z-index: 320;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 12px;
  font-family: Inter, -apple-system, "Segoe UI", sans-serif;
}
.devchat-fab {
  width: 52px;
  height: 52px;
  border-radius: 999px;
  border: none;
  background: var(--button);
  color: var(--button-fg);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: var(--shadow-lg);
  transition: transform 0.15s, box-shadow 0.15s;
}
.devchat-fab:hover { transform: translateY(-2px) scale(1.04); }
.devchat-fab svg { width: 22px; height: 22px; }
.devchat-panel {
  width: min(400px, calc(100vw - 44px));
  height: min(560px, calc(100vh - 120px));
  display: flex;
  flex-direction: column;
  background: var(--surface);
  color: var(--main-fg);
  border: 1px solid var(--main-border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-lg);
  overflow: hidden;
}
.devchat-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 12px 14px;
  border-bottom: 1px solid var(--main-border);
  background: var(--main-muted);
}
.devchat-head strong { font-size: 14px; }
.devchat-sub { display: block; font-size: 11px; color: var(--muted-fg); margin-top: 1px; }
.devchat-head-actions { display: flex; gap: 4px; }
.devchat-iconbtn {
  border: none;
  background: none;
  color: var(--muted-fg);
  cursor: pointer;
  padding: 5px;
  border-radius: var(--radius-sm);
  display: inline-flex;
}
.devchat-iconbtn:hover { background: var(--surface-hover); color: var(--main-fg); }
.devchat-iconbtn svg { width: 15px; height: 15px; }
.devchat-stream {
  flex: 1;
  overflow-y: auto;
  padding: 14px;
  display: flex;
  flex-direction: column;
  gap: 9px;
}
.devchat-msg { font-size: 13px; line-height: 1.55; max-width: 92%; word-break: break-word; }
.devchat-user {
  align-self: flex-end;
  background: var(--button);
  color: var(--button-fg);
  padding: 8px 12px;
  border-radius: 14px 14px 4px 14px;
  white-space: pre-wrap;
}
.devchat-assistant {
  align-self: flex-start;
  background: var(--main-muted);
  border: 1px solid var(--main-border);
  padding: 9px 12px;
  border-radius: 14px 14px 14px 4px;
}
.devchat-assistant p { margin: 0 0 8px; }
.devchat-assistant p:last-child { margin-bottom: 0; }
.devchat-assistant pre { overflow-x: auto; font-size: 11.5px; background: rgba(0,0,0,0.06); padding: 8px; border-radius: 6px; }
[data-theme="dark"] .devchat-assistant pre { background: rgba(255,255,255,0.06); }
.devchat-system {
  align-self: center;
  color: var(--muted-fg);
  font-size: 11.5px;
  text-align: center;
  padding: 2px 8px;
}
.devchat-statusline {
  align-self: flex-start;
  color: var(--muted-fg);
  font-size: 11.5px;
  font-family: ui-monospace, "SF Mono", Menlo, monospace;
  padding: 2px 4px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}
.devchat-statusline::after {
  content: "▋";
  margin-left: 3px;
  animation: rw-caret 1.1s steps(2) infinite;
  opacity: 0.6;
}
@media (prefers-reduced-motion: reduce) { .devchat-statusline::after { animation: none; } }
.devchat-form {
  display: flex;
  align-items: flex-end;
  gap: 8px;
  padding: 10px 12px;
  border-top: 1px solid var(--main-border);
}
.devchat-input {
  flex: 1;
  resize: none;
  border: 1px solid var(--main-border);
  border-radius: var(--radius-md);
  background: var(--main-muted);
  color: var(--main-fg);
  font: inherit;
  font-size: 13px;
  padding: 8px 10px;
  max-height: 120px;
}
.devchat-input:focus { outline: 2px solid var(--ring); outline-offset: 0; }
.devchat-send {
  border: none;
  background: var(--button);
  color: var(--button-fg);
  width: 36px;
  height: 36px;
  border-radius: var(--radius-md);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
}
.devchat-send svg { width: 16px; height: 16px; }
@media (max-width: 640px) {
  .devchat { right: 12px; bottom: 12px; }
}