/* ══════════════════════════════════════════════════════════
   LATTICE — Design System
   Matching civiclattice.com
   White · Hot pink · DM Sans · Pill buttons
   ══════════════════════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,300;0,9..40,400;0,9..40,500;0,9..40,600;0,9..40,700;1,9..40,400&family=DM+Serif+Display:ital@0;1&display=swap');

/* ── TOKENS ─────────────────────────────────────────────── */
:root {
  /* Brand */
  --pink:       #e8336d;
  --pink-dark:  #c4215a;
  --pink-pale:  #fef0f5;
  --pink-mid:   #fbd6e4;

  /* Neutrals */
  --black:      #111111;
  --gray-dark:  #333333;
  --gray:       #555555;
  --gray-lt:    #999999;
  --gray-xlt:   #cccccc;
  --border:     #e8e8e8;
  --border-lt:  #f0f0f0;
  --border-faint: #f0f0f0;
  --text:       #111111;
  --track:      rgba(0,0,0,.06);
  --bg:         #ffffff;
  --bg-soft:    #f8f8f8;
  --bg-mid:     #f2f2f2;

  /* Status */
  --green:        #1a7a42;
  --green-pale:   #f0faf4;
  --green-border: #b0ddc0;
  --red:          #c0143c;
  --red-pale:     #fff0f3;
  --red-border:   #ffc0cf;
  --amber:        #b26a00;

  /* Icon system (Lattice Icons v3). Reference base colours so they follow the
     active theme automatically — the dark block redefines the base vars, and
     var() resolves at use-time, so icons adapt with no per-theme icon rules. */
  --icon-primary:   var(--black);
  --icon-secondary: var(--gray);
  --icon-muted:     var(--gray-lt);
  --icon-accent:    var(--pink);
  --icon-danger:    var(--red);
  --icon-success:   var(--green);
  --icon-warning:   var(--amber);

  /* Shadows */
  --sh-sm:  0 1px 4px  rgba(0,0,0,.06);
  --sh-md:  0 4px 16px rgba(0,0,0,.08);
  --sh-lg:  0 4px 32px rgba(0,0,0,.10);
  --sh-xl:  0 12px 48px rgba(0,0,0,.12);

  --r:    8px;
  --r-lg: 16px;
  --r-xl: 20px;
}

/* ── Lattice Icons v3 — inline SVG utility (currentColor, theme-aware) ────────
   Icons are 24×24 stroke-only SVGs coloured via currentColor. Size with the
   sm/lg modifiers; colour with the semantic modifiers (default = secondary). */
.lattice-icon           { width: 20px; height: 20px; color: var(--icon-secondary); flex: 0 0 auto; }
.lattice-icon.sm        { width: 16px; height: 16px; }
.lattice-icon.lg        { width: 24px; height: 24px; }
.lattice-icon.xl        { width: 32px; height: 32px; }
.lattice-icon.primary   { color: var(--icon-primary); }
.lattice-icon.muted     { color: var(--icon-muted); }
.lattice-icon.accent    { color: var(--icon-accent); }
.lattice-icon.success   { color: var(--icon-success); }
.lattice-icon.warning   { color: var(--icon-warning); }
.lattice-icon.danger    { color: var(--icon-danger); }

/* ── RESET ───────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html, body {
  height: 100%;
  font-family: 'DM Sans', sans-serif;
  font-size: 14px;
  color: var(--black);
  background: var(--bg);
  -webkit-font-smoothing: antialiased;
}

/* ── BUTTONS ─────────────────────────────────────────────── */
.btn-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 11px 24px;
  background: var(--pink);
  color: #fff;
  border: none;
  border-radius: 100px;
  font-family: 'DM Sans', sans-serif;
  font-size: 13.5px;
  font-weight: 600;
  cursor: pointer;
  transition: all .15s;
  text-decoration: none;
  position: relative;
  letter-spacing: .01em;
}
.btn-primary:hover { background: var(--pink-dark); transform: translateY(-1px); box-shadow: 0 6px 20px rgba(232,51,109,.28); }
.btn-primary:active { transform: translateY(0); }
.btn-primary:disabled { opacity: .5; cursor: not-allowed; transform: none; box-shadow: none; }

.btn-secondary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 11px 24px;
  background: var(--black);
  color: #fff;
  border: none;
  border-radius: 100px;
  font-family: 'DM Sans', sans-serif;
  font-size: 13.5px;
  font-weight: 600;
  cursor: pointer;
  transition: all .15s;
  text-decoration: none;
  letter-spacing: .01em;
}
.btn-secondary:hover { background: var(--gray-dark); transform: translateY(-1px); }

.btn-ghost {
  background: transparent;
  border: 1.5px solid var(--border);
  border-radius: 100px;
  color: var(--gray);
  font-family: 'DM Sans', sans-serif;
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  padding: 9px 20px;
  transition: all .12s;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.btn-ghost:hover { border-color: var(--pink); color: var(--pink); }

.btn-link {
  background: none;
  border: none;
  font-family: 'DM Sans', sans-serif;
  font-size: 13px;
  font-weight: 500;
  color: var(--gray-lt);
  cursor: pointer;
  padding: 4px 0;
  transition: color .12s;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 5px;
}
.btn-link:hover { color: var(--gray-dark); }

/* Loading spinner on buttons */
.btn-loading { color: transparent !important; position: relative; }
.btn-loading::after {
  content: '';
  position: absolute;
  width: 16px; height: 16px;
  border: 2.5px solid rgba(255,255,255,.4);
  border-top-color: #fff;
  border-radius: 50%;
  animation: spin .65s linear infinite;
  top: 50%; left: 50%;
  transform: translate(-50%,-50%);
}
@keyframes spin { to { transform: translate(-50%,-50%) rotate(360deg); } }

/* ── FORM ELEMENTS ───────────────────────────────────────── */
.field-group { display: flex; flex-direction: column; gap: 6px; margin-bottom: 16px; }

.field-label {
  font-size: 11px;
  font-weight: 700;
  color: var(--gray-dark);
  letter-spacing: .07em;
  text-transform: uppercase;
}

.field-input {
  width: 100%;
  padding: 12px 16px;
  border: 1.5px solid var(--border);
  border-radius: var(--r);
  font-family: 'DM Sans', sans-serif;
  font-size: 14px;
  color: var(--black);
  background: var(--bg);
  outline: none;
  transition: border .15s, box-shadow .15s;
}
.field-input:focus { border-color: var(--pink); box-shadow: 0 0 0 4px rgba(232,51,109,.10); }
.field-input.error { border-color: var(--red); }
.field-input::placeholder { color: var(--gray-xlt); }

/* ── STATUS BARS ─────────────────────────────────────────── */
.status-bar {
  padding: 10px 14px;
  border-radius: var(--r);
  font-size: 13px;
  display: none;
  align-items: center;
  gap: 8px;
  margin-bottom: 14px;
  font-weight: 500;
}
.status-bar.show { display: flex; }
.status-bar.success { background: var(--green-pale);  border: 1px solid var(--green-border); color: var(--green); }
.status-bar.error   { background: var(--red-pale);    border: 1px solid var(--red-border);   color: var(--red); }

/* ── TOAST ───────────────────────────────────────────────── */
#toastContainer {
  position: fixed;
  bottom: 22px; right: 22px;
  z-index: 9999;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.toast {
  background: var(--black);
  color: #fff;
  padding: 11px 18px;
  border-radius: 100px;
  font-size: 13px;
  font-weight: 500;
  box-shadow: var(--sh-lg);
  display: flex;
  align-items: center;
  gap: 9px;
  animation: toastIn .25s ease;
  border-left: 3px solid var(--pink);
}
@keyframes toastIn { from { transform: translateX(20px); opacity: 0; } to { transform: translateX(0); opacity: 1; } }

/* ── TOPBAR ──────────────────────────────────────────────── */
.topbar {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 200;
  height: 56px;
  background: var(--bg);
  border-bottom: 1px solid var(--border);
  display: flex;
  align-items: center;
  padding: 0 28px;
  gap: 16px;
}
.brand-wrap { display: flex; align-items: center; gap: 12px; text-decoration: none; }
.brand-logo-img { height: 24px; width: auto; }
.brand-divider { width: 1px; height: 18px; background: var(--border); }
.brand-sub { font-size: 11px; font-weight: 500; color: var(--gray-lt); letter-spacing: .06em; text-transform: uppercase; }
.topbar-spacer { flex: 1; }

/* ── CARD ────────────────────────────────────────────────── */
.card {
  background: var(--bg);
  border: 1.5px solid var(--border);
  border-radius: var(--r-xl);
  padding: 32px 36px;
  box-shadow: var(--sh-lg);
}
.card-title { font-size: 20px; font-weight: 700; color: var(--black); margin-bottom: 6px; letter-spacing: -.02em; }
.card-desc  { font-size: 14px; color: var(--gray); line-height: 1.6; margin-bottom: 22px; }

/* ── MODAL ───────────────────────────────────────────────── */
.modal-overlay {
  position: fixed; inset: 0;
  z-index: 500;
  background: rgba(0,0,0,.4);
  backdrop-filter: blur(4px);
  display: flex;
  align-items: center;
  justify-content: center;
  animation: fadeIn .15s ease;
}
.modal-overlay.hidden { display: none; }
.modal-box {
  background: var(--bg);
  border: 1.5px solid var(--border);
  border-radius: var(--r-xl);
  padding: 36px;
  width: 480px;
  max-width: 95vw;
  box-shadow: var(--sh-xl);
  animation: riseIn .3s cubic-bezier(.16,1,.3,1);
}
.modal-title { font-size: 20px; font-weight: 700; color: var(--black); margin-bottom: 6px; letter-spacing: -.02em; }
.modal-desc  { font-size: 14px; color: var(--gray); margin-bottom: 22px; line-height: 1.6; }
.modal-actions { display: flex; gap: 10px; justify-content: flex-end; margin-top: 24px; }

/* ── ANIMATIONS ──────────────────────────────────────────── */
@keyframes fadeIn   { from { opacity: 0; } to { opacity: 1; } }
@keyframes riseIn   { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: translateY(0); } }

/* ── FOOTER ──────────────────────────────────────────────── */
.site-footer {
  padding: 16px 36px;
  border-top: 1px solid var(--border);
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-shrink: 0;
}
.footer-brand { font-size: 12px; color: var(--gray-lt); }
.footer-brand strong { color: var(--gray); }
.footer-links { display: flex; gap: 20px; }
.footer-links a { font-size: 12px; color: var(--gray-lt); text-decoration: none; transition: color .12s; }
.footer-links a:hover { color: var(--pink); }

/* ═══════════════════════════════════════════════════════════
   CUSTOM CONTENT BUILDER (left panel)
   cc- prefix = custom content
   ═══════════════════════════════════════════════════════════ */

.cc-section {
  margin: 16px 0 0;
  padding: 14px 16px 16px;
  border-top: 2px solid var(--border);
  background: var(--bg-soft);
  border-radius: 0 0 var(--r-xl) var(--r-xl);
}
.cc-section-hdr {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .07em;
  text-transform: uppercase;
  color: var(--pink);
  margin-bottom: 4px;
}
.cc-section-desc {
  font-size: 11.5px;
  color: var(--gray-lt);
  line-height: 1.5;
  margin-bottom: 14px;
}

/* Goal block */
.cc-goal-block {
  background: var(--bg);
  border: 1.5px solid var(--border);
  border-radius: var(--r-xl);
  padding: 10px 12px;
  margin-bottom: 10px;
}

/* Row layouts */
.cc-goal-row,
.cc-policy-row,
.cc-action-row {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  padding: 4px 0;
}
.cc-policy-block {
  margin: 6px 0 6px 16px;
  padding-left: 10px;
  border-left: 2px solid var(--border-lt);
}

/* Badges — match doc output badges */
.cc-badge {
  flex-shrink: 0;
  font-family: 'JetBrains Mono', monospace;
  font-size: 9.5px;
  font-weight: 700;
  padding: 2px 7px;
  border-radius: 100px;
  background: var(--pink-pale);
  color: var(--pink);
  margin-top: 1px;
}
.cc-badge-pol {
  background: #f0f4ff;
  color: #4a6cf7;
}
.cc-badge-act {
  background: #f0faf4;
  color: #2a8f5a;
}

/* Text spans */
.cc-goal-text  { font-size: 12.5px; font-weight: 600; color: var(--black); flex: 1; line-height: 1.5; }
.cc-pol-text   { font-size: 12px;   color: var(--gray);  flex: 1; line-height: 1.5; }
.cc-act-text   { font-size: 11.5px; color: var(--gray-lt); font-style: italic; flex: 1; line-height: 1.5; }

/* Delete button */
.cc-del {
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  border: none;
  background: transparent;
  color: var(--gray-lt);
  font-size: 11px;
  cursor: pointer;
  border-radius: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  transition: opacity .12s, background .12s, color .12s;
  margin-top: 1px;
}
.cc-goal-row:hover .cc-del,
.cc-policy-row:hover .cc-del,
.cc-action-row:hover .cc-del { opacity: 1; }
.cc-del:hover { background: var(--red-pale); color: var(--red); }

/* Add buttons */
.cc-add-btn {
  display: flex;
  align-items: center;
  gap: 5px;
  margin-top: 6px;
  padding: 5px 10px;
  border-radius: 100px;
  border: 1.5px dashed var(--border);
  background: transparent;
  font-family: 'DM Sans', sans-serif;
  font-size: 11.5px;
  font-weight: 600;
  cursor: pointer;
  transition: all .12s;
  color: var(--gray-lt);
}
.cc-add-btn:hover { border-color: var(--pink); color: var(--pink); background: var(--pink-pale); }
.cc-add-goal { color: var(--pink); border-color: var(--pink); background: var(--pink-pale); margin-top: 10px; }
.cc-add-goal:hover { background: var(--pink-mid); color: #fff; border-color: var(--pink-mid); }
.cc-add-pol  { font-size: 11px; margin-left: 0; }
.cc-add-act  { font-size: 10.5px; margin-left: 16px; }

/* Inline input row */
.cc-input-wrap {
  display: flex;
  gap: 6px;
  margin-top: 8px;
  align-items: center;
}
.cc-input {
  flex: 1;
  padding: 7px 10px;
  border: 1.5px solid var(--pink-mid);
  border-radius: var(--r);
  font-family: 'DM Sans', sans-serif;
  font-size: 12.5px;
  background: var(--bg);
  color: var(--black);
  outline: none;
  transition: border-color .12s;
}
.cc-input:focus { border-color: var(--pink); box-shadow: 0 0 0 3px var(--pink-pale); }
.cc-submit {
  padding: 7px 14px;
  border-radius: var(--r);
  border: none;
  background: var(--pink);
  color: #fff;
  font-family: 'DM Sans', sans-serif;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  transition: background .12s;
  white-space: nowrap;
}
.cc-submit:hover { background: var(--pink-dark, #c4215a); }

/* ── State Required section divider in output panel ─────── */
.doc-section-divider {
  display: flex;
  align-items: center;
  gap: 14px;
  margin: 28px 0 16px;
  padding: 0 4px;
}
.doc-section-divider::before,
.doc-section-divider::after {
  content: '';
  flex: 1;
  height: 1.5px;
  background: var(--border);
}
.doc-section-label {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--pink);
  background: var(--pink-pale);
  padding: 4px 14px;
  border-radius: 100px;
  white-space: nowrap;
  border: 1.5px solid var(--pink-mid, #f0a0bb);
}

/* ── State-required compliance blocks and stubs ─────────── */
.doc-compliance-block {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin: 0 0 16px;
  padding: 8px 14px;
  background: var(--pink-pale, #fef0f5);
  border: 1px solid var(--pink-mid, #fbd6e4);
  border-radius: 6px;
  font-size: 11.5px;
  color: var(--gray, #555);
  line-height: 1.5;
}
.doc-compliance-icon { flex-shrink: 0; font-size: 12px; color: var(--pink); margin-top: 1px; }
.doc-compliance-text { flex: 1; }
.doc-compliance-stub {
  margin: 8px 0 16px;
  padding: 24px;
  background: repeating-linear-gradient(45deg, var(--bg-soft, #f8f8f8), var(--bg-soft, #f8f8f8) 8px, var(--bg-mid, #f0f0f0) 8px, var(--bg-mid, #f0f0f0) 16px);
  border-radius: 8px;
  text-align: center;
}
.doc-compliance-stub-icon { font-size: 18px; color: var(--gray-lt); margin-bottom: 6px; }
.doc-compliance-stub-title { font-size: 13px; font-weight: 600; color: var(--gray-dark, #333); margin-bottom: 4px; }
.doc-compliance-stub-desc { font-size: 11.5px; color: var(--gray-lt); line-height: 1.5; }
.doc-state-tag { font-size: 11px; font-weight: 600; opacity: .55; letter-spacing: .04em; font-family: 'DM Sans', sans-serif; vertical-align: middle; }

/* ── SR_ Overlay group header ─────────────────────────────── */
.doc-overlay-header {
  display: flex;
  align-items: baseline;
  gap: 7px;
  margin: 18px 0 4px;
  padding: 4px 10px;
  background: none;
  border-left: 2px solid var(--border, #e5e5e5);
  border-radius: 0;
  font-size: 11px;
  line-height: 1.4;
}
.doc-overlay-icon  { color: var(--gray-lt, #aaa); font-size: 11px; flex-shrink: 0; }
.doc-overlay-label { font-weight: 600; color: var(--gray, #666); }
.doc-overlay-note  { color: var(--gray-lt, #888); font-style: italic; }
/* State-required goal badge */
.doc-goal-badge-sr {
  background: var(--pink-pale, #fef0f5) !important;
  color: var(--pink, #e8336d) !important;
  border: 1px solid var(--pink-mid, #fbd6e4) !important;
}
/* Overlay goal row — subtle left border to visually group */
.doc-goal-overlay { border-left: 2px solid var(--pink-mid, #fbd6e4); padding-left: 8px; }

/* ── SR overlay acknowledgment row in right panel ─────────── */
/* Compact presence row — replaces heavy compliance block for overlay SR elements */
.doc-sr-ack {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 5px 10px;
  margin: 4px 0;
  background: var(--bg-soft, #f8f8f8);
  border: 1px solid var(--border, #e5e5e5);
  border-radius: 6px;
  font-size: 11.5px;
}
.doc-sr-ack-badge {
  font-family: 'JetBrains Mono', monospace;
  font-size: 9px;
  font-weight: 700;
  background: var(--pink-pale, #fef0f5);
  color: var(--pink, #e8336d);
  border: 1px solid var(--pink-mid, #fbd6e4);
  padding: 2px 6px;
  border-radius: 100px;
  white-space: nowrap;
  flex-shrink: 0;
}
.doc-sr-ack-title {
  font-weight: 500;
  color: var(--gray, #555);
  flex: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.doc-sr-ack-target {
  font-size: 11px;
  color: var(--gray-lt, #888);
  font-style: italic;
  white-space: nowrap;
  flex-shrink: 0;
}
.doc-sr-ack-citation {
  font-size: 10.5px;
  color: var(--gray-lt, #aaa);
  font-style: italic;
  white-space: nowrap;
  flex-shrink: 0;
}

/* ═══════════════════════════════════════════════════════════
   OUTPUT PANEL — add goal / policy / action buttons
   Always visible black pills — no hover required
   ═══════════════════════════════════════════════════════════ */

.doc-plus-btn {
  display: block;
  width: 100%;
  margin-top: 8px;
  padding: 5px 0;
  background: #111111;
  color: #ffffff;
  border: none;
  border-radius: 6px;
  font-family: 'DM Sans', sans-serif;
  font-size: 11.5px;
  font-weight: 500;
  cursor: pointer;
  text-align: center;
  opacity: 1;
  transition: background .15s;
}
.doc-plus-btn:hover { background: var(--pink); }

/* "add goal" — small pill, not full width */
.btn-add-goal {
  display: inline-block;
  width: auto;
  padding: 5px 14px;
  border-radius: 100px;
  margin-top: 12px;
}

/* ── Inline input row ─────────────────────────────────────── */
.doc-add-row {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin: 8px 0 4px;
  animation: docAddSlide .15s ease;
}
@keyframes docAddSlide {
  from { opacity: 0; transform: translateY(-4px); }
  to   { opacity: 1; transform: translateY(0); }
}
.doc-add-input {
  width: 100%;
  box-sizing: border-box;
  padding: 8px 11px;
  border: 1.5px solid var(--pink-mid, #f0a0bb);
  border-radius: var(--r);
  font-family: 'DM Sans', sans-serif;
  font-size: 13px;
  line-height: 1.5;
  background: var(--bg);
  color: var(--black);
  outline: none;
  resize: vertical;
  transition: border-color .12s, box-shadow .12s;
}
.doc-add-input:focus {
  border-color: var(--pink);
  box-shadow: 0 0 0 3px var(--pink-pale, #fff0f5);
}
.doc-add-btn-row {
  display: flex;
  align-items: center;
  gap: 6px;
}
.doc-add-ok {
  width: 28px; height: 28px;
  border-radius: 8px; border: none;
  background: var(--pink); color: #fff;
  font-size: 14px; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: background .12s; flex-shrink: 0;
}
.doc-add-ok:hover { background: #c4215a; }
.doc-add-spark {
  width: 28px; height: 28px;
  border-radius: 8px; border: 1.5px solid var(--pink-mid, #f0a0bb);
  background: transparent; color: var(--pink);
  font-size: 13px; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: all .12s; flex-shrink: 0;
}
.doc-add-spark:hover { background: var(--pink); color: #fff; border-color: var(--pink); }
.doc-add-spark img { filter: none; }
.doc-add-cancel {
  width: 28px; height: 28px;
  border-radius: 8px; border: 1.5px solid var(--border);
  background: transparent; color: var(--gray-lt);
  font-size: 13px; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: all .12s; flex-shrink: 0;
}
.doc-add-cancel:hover { border-color: var(--red); color: var(--red); }

/* ── Custom (user-added) items ───────────────────────────── */
.doc-goal-custom { }
.doc-goal-badge-custom { background: var(--pink) !important; }
.doc-policy-custom { border-color: var(--border) !important; background: var(--bg) !important; }
.doc-action-custom { }

/* ── Delete button on custom items ──────────────────────── */
.doc-item-del {
  flex-shrink: 0; margin-left: auto;
  width: 18px; height: 18px;
  border: none; background: transparent;
  color: transparent; font-size: 10px;
  cursor: pointer; border-radius: 4px;
  display: flex; align-items: center; justify-content: center;
  transition: all .12s;
}
.doc-goal-custom:hover .doc-item-del,
.doc-policy-custom:hover .doc-item-del,
.doc-action-custom:hover .doc-item-del { color: var(--gray-lt); }
.doc-item-del:hover { background: #ffe8ec; color: var(--red) !important; }
/* Edit workspace (Update): item controls are discoverable BY DEFAULT — not
   invisible-until-hover — so a first-time user can see where edit / rewrite /
   delete live. Subtle at rest, brighten on hover (Create-editor pattern).
   Scoped to page-update so the Create editor is unchanged. */
body.page-update .doc-item-edit,
body.page-update .doc-item-del{color:var(--gray-lt)}
body.page-update .doc-action:hover .doc-item-edit,
body.page-update .doc-goal-hd:hover .doc-item-edit,
body.page-update .doc-policy-top:hover .doc-item-edit{color:var(--gray)}

/* ── DARK MODE ───────────────────────────────────────────── */
[data-theme="dark"] {
  --pink:         #e8336d;
  --pink-dark:    #c4215a;
  --pink-pale:    #2a0f1a;
  --pink-mid:     #4a1628;

  --black:        #f0f0f0;
  --gray-dark:    #f0f0f0;
  --gray:         #cccccc;
  --gray-lt:      #999999;
  --gray-xlt:     #666666;
  --border:       #333333;
  --border-lt:    #2a2a2a;
  --border-faint: #2a2a2a;
  --text:         #f0f0f0;
  --track:        rgba(255,255,255,.09);
  --bg:           #111111;
  --bg-soft:      #1a1a1a;
  --bg-mid:       #222222;
  /* Surface vars used inline (var(--gray-bg)/var(--bg-card)) were undefined, so in
     dark mode they fell back to LIGHT hardcoded colours while text vars flipped to
     near-white → invisible headings / white pills. Define them for dark only, so
     light mode (which relies on the inline fallbacks) is untouched. */
  --gray-bg:      #232326;
  --bg-card:      #1c1c1e;

  --green:        #3dba6a;
  --green-pale:   #0a1f12;
  --green-border: #1a4a2a;
  --red:          #e8335a;
  --red-pale:     #1f0a0e;
  --red-border:   #4a1020;
  --amber:        #dca23a;

  --sh-sm:  0 1px 4px  rgba(0,0,0,.3);
  --sh-md:  0 4px 16px rgba(0,0,0,.4);
  --sh-lg:  0 4px 32px rgba(0,0,0,.5);
  --sh-xl:  0 12px 48px rgba(0,0,0,.6);
}

/* btn-secondary uses --black as its background, which inverts to #f0f0f0
   in dark mode — white text on near-white = invisible. Override to a fixed
   dark charcoal so it always reads as a dark-filled button. */
[data-theme="dark"] .btn-secondary            { background: #2d2d2d; color: #f0f0f0; }
[data-theme="dark"] .btn-secondary:hover       { background: #3d3d3d; }

[data-theme="dark"] html,
[data-theme="dark"] body {
  background: var(--bg);
  color: var(--black);
}


/* ══════════════════════════════════════════════════════════
   PLANNER PAGE STYLES
   ══════════════════════════════════════════════════════════ */

/* ══════════════════════════════════════════════════════════
   LATTICE PLANNER — White / Pink design system
   matching civiclattice.com
   ══════════════════════════════════════════════════════════ */
:root {
  --pink:       #e8336d;
  --pink-dark:  #c4215a;
  --pink-pale:  #fef0f5;
  --pink-mid:   #fbd6e4;
  --black:      #111111;
  --gray-dark:  #333333;
  --gray:       #555555;
  --gray-lt:    #999999;
  --gray-xlt:   #cccccc;
  --border:     #e8e8e8;
  --border-lt:  #f0f0f0;
  --bg:         #ffffff;
  --bg-soft:    #f8f8f8;
  --bg-mid:     #f2f2f2;
  --green:      #1a7a42;
  --green-pale: #f0faf4;
  --green-border:#b0ddc0;
  --red:        #c0143c;
  --red-pale:   #fff0f3;
  --red-border: #ffc0cf;
  --amber:      #b26a00;
  --sh-sm: 0 1px 4px rgba(0,0,0,.06);
  --sh-md: 0 4px 16px rgba(0,0,0,.08);
  --sh-lg: 0 4px 32px rgba(0,0,0,.10);
  --r: 8px; --r-lg: 14px;
}

html[data-theme="dark"] {
  --pink:         #e8336d;
  --pink-dark:    #c4215a;
  --pink-pale:    #2a0f1a;
  --pink-mid:     #4a1628;
  --black:        #f0f0f0;
  --gray-dark:    #f0f0f0;
  --gray:         #cccccc;
  --gray-lt:      #999999;
  --gray-xlt:     #666666;
  --border:       #333333;
  --border-lt:    #2a2a2a;
  --bg:           #111111;
  --bg-soft:      #1a1a1a;
  --bg-mid:       #222222;
  --green:        #3dba6a;
  --green-pale:   #0a1f12;
  --green-border: #1a4a2a;
  --red:          #e8335a;
  --red-pale:     #1f0a0e;
  --red-border:   #4a1020;
  --amber:        #dca23a;
  --sh-sm: 0 1px 4px rgba(0,0,0,.3);
  --sh-md: 0 4px 16px rgba(0,0,0,.4);
  --sh-lg: 0 4px 32px rgba(0,0,0,.5);
}

html[data-theme="dark"] body { background: var(--bg-soft); color: var(--black); }

html[data-theme="dark"] .doc-el-header,
html[data-theme="dark"] .custom-el-card-header { background:#1c2840; }
html[data-theme="dark"] .doc-prologue-header { background:#1a2d46; }
html[data-theme="dark"] .doc-prologue-header:hover { background:#1f3554; }
html[data-theme="dark"] .btn-advisor-badge { background:#1c3049; border-color:#2a4262; }
html[data-theme="dark"] .advisor-win-hdr,
html[data-theme="dark"] .advisor-win-footer { background:#1a1a1a; }
/* Advisor window dark mode fixes */
html[data-theme="dark"] .advisor-win { box-shadow:0 12px 48px rgba(0,0,0,.6),0 2px 8px rgba(0,0,0,.4); }
html[data-theme="dark"] .advisor-win-close { color:#999; }
html[data-theme="dark"] .advisor-win-close:hover { color:#fff; }
html[data-theme="dark"] .advisor-win-input { background:var(--bg-soft);color:var(--black); }
html[data-theme="dark"] .advisor-win-input::placeholder { color:var(--gray-lt); }
html[data-theme="dark"] .advisor-win-input:focus { background:#1f0d14; }
html[data-theme="dark"] .advisor-win-submit,
html[data-theme="dark"] .advisor-win-insert { background:var(--pink);color:#fff; }
html[data-theme="dark"] .advisor-win-submit:hover,
html[data-theme="dark"] .advisor-win-insert:hover { background:var(--pink-dark); }
html[data-theme="dark"] .advisor-win-submit:disabled { background:#444;color:#888;cursor:not-allowed; }
html[data-theme="dark"] .advisor-win-copy,
html[data-theme="dark"] .advisor-win-regen { color:var(--gray);border-color:var(--border); }
html[data-theme="dark"] .advisor-win-copy:hover,
html[data-theme="dark"] .advisor-win-regen:hover { color:var(--pink);border-color:var(--pink); }
html[data-theme="dark"] .advisor-win-discard { color:var(--gray-lt); }
html[data-theme="dark"] .advisor-win-hint { color:var(--gray-lt); }
html[data-theme="dark"] .advisor-win-ctx-label { color:var(--gray); }
html[data-theme="dark"] .advisor-win-result { color:var(--black); }
html[data-theme="dark"] .advisor-win-actions { background:var(--bg-mid); }
html[data-theme="dark"] .advisor-win-output { background:var(--bg-mid); }
html[data-theme="dark"] .toast-item { background:#2a2a2a;color:#fff;box-shadow:0 4px 24px rgba(0,0,0,.7); }
html[data-theme="dark"] .field-input::placeholder,
html[data-theme="dark"] input.q-inp::placeholder,
html[data-theme="dark"] textarea.q-ta::placeholder,
html[data-theme="dark"] .doc-inline-input::placeholder,
html[data-theme="dark"] .doc-add-input::placeholder,
html[data-theme="dark"] .impl-chip-input::placeholder { color:var(--gray-lt); }
html[data-theme="dark"] .toast { background:#2a2a2a;color:#fff;box-shadow:0 4px 24px rgba(0,0,0,.7); }
html[data-theme="dark"] .modal { background:var(--bg-soft);border-color:var(--border); }
html[data-theme="dark"] .modal-inp { background:var(--bg);color:var(--black);border-color:var(--border); }
html[data-theme="dark"] .modal-inp::placeholder { color:var(--gray-lt); }
html[data-theme="dark"] select.modal-inp { color:var(--black); }
html[data-theme="dark"] .doc-inline-input,
html[data-theme="dark"] .checkbox-opt,
html[data-theme="dark"] .radio-opt { background:var(--bg-soft); color:var(--black); border-color:var(--border); }
html[data-theme="dark"] select.q-sel,
html[data-theme="dark"] input.q-inp,
html[data-theme="dark"] textarea.q-ta { background:var(--bg); color:var(--black); border-color:var(--border); }
html[data-theme="dark"] .jurisdiction-dropdown { background:var(--bg); }
html[data-theme="dark"] .user-dropdown { background:var(--bg); }
html[data-theme="dark"] .doc-goal { border-color:var(--border); }
html[data-theme="dark"] .doc-policy { border-color:var(--border); }
html[data-theme="dark"] .cc-badge-pol { background:#1a2040; color:#8da8f7; }
html[data-theme="dark"] .cc-badge-act { background:#0d2018; color:#5ab87a; }
html[data-theme="dark"] .user-dropdown-item.danger:hover { background:var(--red-pale); }
html[data-theme="dark"] .doc-item-del:hover { background:var(--red-pale); }

*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%;font-family:'DM Sans',sans-serif;background:var(--bg-soft);color:var(--black);font-size:14px;-webkit-font-smoothing:antialiased}

/* ── TOPBAR ── */
/* duplicate topbar removed */
.btn-back{display:flex;align-items:center;gap:6px;padding:7px 14px;border-radius:100px;font-size:12px;font-weight:500;cursor:pointer;transition:all .15s;border:1.5px solid var(--border);background:transparent;color:var(--gray-lt);font-family:'DM Sans',sans-serif;text-decoration:none}
.btn-back:hover{border-color:var(--pink);color:var(--pink)}
.tb-divider{width:1px;height:20px;background:var(--border)}
.brand-logo-img{height:22px;width:auto}
.brand-sub{font-size:10.5px;font-weight:600;color:var(--gray-lt);letter-spacing:.07em;text-transform:uppercase}
.topbar-spacer{flex:1}
#serverBadge{font-size:11px;font-weight:500;cursor:default;color:var(--gray-lt);letter-spacing:.02em}
.jurisdiction-menu{position:relative;display:flex;align-items:center}
.jurisdiction-pill{background:var(--bg-soft);border:1.5px solid var(--border);border-radius:100px;padding:6px 14px;color:var(--gray);font-size:12px;font-weight:500;cursor:pointer;transition:all .15s;white-space:nowrap;font-family:'DM Sans',sans-serif}
.jurisdiction-pill:hover{border-color:var(--pink);color:var(--pink);background:var(--pink-pale)}
.jurisdiction-dropdown{position:absolute;top:calc(100% + 8px);left:0;background:var(--bg);border:1.5px solid var(--border);border-radius:12px;box-shadow:0 8px 24px rgba(0,0,0,.15);min-width:200px;padding:6px;z-index:9999;display:none;flex-direction:column;gap:2px}
.jurisdiction-dropdown.open{display:flex}
.jd-item{display:block;padding:9px 14px;border-radius:8px;font-size:13px;font-weight:500;cursor:pointer;transition:background .12s;border:none;background:none;width:100%;text-align:left;font-family:'DM Sans',sans-serif;color:var(--black)}
.jd-item:hover{background:var(--bg-soft);color:var(--pink)}
.jd-divider{height:1px;background:var(--border);margin:4px 2px}
.jd-progress{padding:10px 14px 8px;margin-bottom:4px}
.progress-wrap{display:flex;align-items:center;gap:8px;color:var(--pink);font-size:11px;font-weight:600}
.progress-bar-mini{width:72px;height:3px;background:var(--border);border-radius:2px}
.progress-fill{height:100%;background:var(--pink);border-radius:2px;transition:width .4s ease}
.btn-tb{display:flex;align-items:center;gap:6px;padding:7px 16px;border-radius:100px;font-size:12px;font-weight:600;cursor:pointer;transition:all .15s;border:none;font-family:'DM Sans',sans-serif}
.btn-pdf{background:var(--bg-soft);color:var(--gray);border:1.5px solid var(--border)}.btn-pdf:hover{border-color:var(--gray);color:var(--black)}
.btn-docx{background:var(--pink);color:#fff}.btn-docx:hover{background:var(--pink-dark);transform:translateY(-1px);box-shadow:0 4px 12px rgba(232,51,109,.3)}
.btn-docx:disabled{opacity:.5;cursor:not-allowed;transform:none;box-shadow:none}
.btn-advisor-upgrade{background:linear-gradient(135deg,#e8336d,#c4215a);color:#fff;border:none;padding:7px 16px;border-radius:100px;font-size:12px;font-weight:700;cursor:pointer;font-family:'DM Sans',sans-serif;display:flex;align-items:center;gap:6px;transition:all .15s;box-shadow:0 2px 8px rgba(232,51,109,.3)}
.btn-advisor-upgrade:hover{transform:translateY(-1px);box-shadow:0 4px 14px rgba(232,51,109,.4)}
.btn-advisor-badge{background:#1c3049;color:#fff;border:1.5px solid #2a4262;padding:7px 14px;border-radius:100px;font-size:11px;font-weight:600;font-family:'DM Sans',sans-serif;display:flex;align-items:center;gap:6px;cursor:pointer;transition:all .15s;box-shadow:0 0 0 rgba(232,51,109,0)}.btn-advisor-badge:hover{border-color:var(--pink);box-shadow:0 0 10px rgba(232,51,109,.25)}
.btn-advisor-badge .badge-dot{width:7px;height:7px;border-radius:50%;background:#4caf50;display:inline-block;box-shadow:0 0 6px rgba(76,175,80,.6)}
.btn-advisor-trial{background:transparent;color:var(--gray);border:1.5px dashed var(--border);padding:7px 14px;border-radius:100px;font-size:11px;font-weight:600;font-family:'DM Sans',sans-serif;display:flex;align-items:center;gap:6px;cursor:pointer;transition:all .15s}.btn-advisor-trial:hover{border-color:var(--pink);color:var(--pink)}

/* ── LAYOUT ── */
.app-layout{display:flex;margin-top:56px;height:calc(100vh - 56px)}

/* ── SIDEBAR ── */
.sidebar{width:310px;flex-shrink:0;background:var(--bg);border-right:1px solid var(--border);overflow-y:auto;padding:12px 0;display:flex;flex-direction:column}
/* Persistent company + Terms block pinned to the bottom of a left panel.
   Shared by Create (.sidebar), Update (.up-cal-left); Monitor overrides in monitor.css. */
.sidebar-legal{margin-top:auto;flex-shrink:0;display:flex;flex-direction:row;align-items:center;flex-wrap:wrap;gap:5px;padding:7px 18px;font-size:10.5px;opacity:.55}
.sidebar-legal:hover{opacity:.9}
.sidebar-legal .sl-co{font-weight:600;color:var(--gray-lt);text-decoration:none}
.sidebar-legal .sl-sep{color:var(--gray-lt)}
.sidebar-legal a{color:var(--gray-lt);text-decoration:none;line-height:1.4}
.sidebar-legal a:hover{color:var(--pink)}
body.page-update .up-cal-left .sidebar-legal{padding-left:0;padding-right:0}
.sidebar::-webkit-scrollbar{width:3px}.sidebar::-webkit-scrollbar-thumb{background:var(--border);border-radius:2px}
/* ── Element toggle row ── */
.sidebar-item-row{display:flex;align-items:center;gap:0}
.el-toggle{flex-shrink:0;width:26px;height:26px;display:flex;align-items:center;justify-content:center;background:transparent;border:none;cursor:pointer;padding:0;margin-left:4px}
.el-toggle-knob{width:12px;height:12px;border-radius:50%;border:1.5px solid var(--gray-lt);background:transparent;transition:all .15s;flex-shrink:0}
.el-toggle.on .el-toggle-knob{background:var(--pink);border-color:var(--pink)}
/* Hidden element — faded text */
.sidebar-item.el-hidden{opacity:.35}
.sidebar-item.el-hidden .sidebar-code{color:var(--gray-lt)}

.sidebar-group-label{padding:10px 16px 4px;font-size:9.5px;font-weight:700;letter-spacing:.1em;color:var(--gray-xlt);text-transform:uppercase}
.sidebar-item{display:flex;align-items:center;gap:9px;padding:8px 14px;cursor:pointer;transition:all .12s;color:var(--gray-lt);font-size:12px;font-weight:500;border-left:2px solid transparent;user-select:none}
.sidebar-item:hover{background:var(--bg-soft);color:var(--gray-dark)}
.sidebar-item.active{background:var(--pink-pale);color:var(--pink);border-left-color:var(--pink)}
.sidebar-code{font-family:'JetBrains Mono',monospace;font-size:9px;background:var(--bg-mid);padding:2px 5px;border-radius:4px;flex-shrink:0;color:var(--gray-lt)}
.sidebar-item.active .sidebar-code{background:var(--pink-mid);color:var(--pink-dark)}
.sidebar-dot{margin-left:auto;width:6px;height:6px;border-radius:50%;background:var(--border);flex-shrink:0}
.sidebar-lock{display:inline-flex;align-items:center;margin-left:4px;color:var(--gray-lt);opacity:.7;cursor:help;flex-shrink:0}
.sidebar-lock:hover{opacity:1;color:var(--gray)}
.sidebar-info{display:inline-flex;align-items:center;margin-left:4px;color:var(--gray-lt);opacity:.7;cursor:help;flex-shrink:0}
.sidebar-info:hover{opacity:1;color:var(--pink)}
.sr-state-badge{font-family:'JetBrains Mono',monospace;font-size:7.5px;font-weight:700;letter-spacing:.04em;background:var(--pink-pale);color:var(--pink);border:1px solid var(--pink-mid,#fbd6e4);padding:1px 5px;border-radius:3px;flex-shrink:0;text-transform:uppercase;margin-left:2px;cursor:help}
.sidebar-dot.done{background:var(--green)}.sidebar-dot.partial{background:var(--amber)}

/* ── INPUT PANEL ── */
.input-panel{width:438px;flex-shrink:0;background:var(--bg);border-right:1px solid var(--border);overflow-y:auto;display:flex;flex-direction:column}
.input-panel::-webkit-scrollbar{width:4px}.input-panel::-webkit-scrollbar-thumb{background:var(--border);border-radius:2px}
.el-header{padding:20px 22px 14px;border-bottom:1px solid var(--border-lt);position:sticky;top:0;z-index:10;background:var(--bg)}
.el-badge{display:inline-flex;align-items:center;gap:6px;background:var(--pink);color:#fff;padding:3px 10px;border-radius:100px;font-size:10px;font-weight:700;letter-spacing:.05em;font-family:'JetBrains Mono',monospace;margin-bottom:8px}
.el-title{font-size:18px;font-weight:700;color:var(--black);line-height:1.2;margin-bottom:4px;letter-spacing:-.01em}
.el-desc{color:var(--gray-lt);font-size:12.5px;line-height:1.5}
.q-body{padding:16px 20px;display:flex;flex-direction:column;gap:6px}

/* ── PROLOGUE ACCORDION ── */
.prologue-accordion{margin:0 20px 6px;border:1.5px solid var(--border);border-radius:var(--r-lg);overflow:hidden;background:var(--bg)}
.prologue-trigger{display:flex;align-items:center;gap:10px;padding:12px 14px;cursor:pointer;user-select:none;transition:background .12s;background:var(--bg-soft)}
.prologue-trigger:hover{background:var(--pink-pale)}
.prologue-icon{font-size:12px;transition:transform .25s;color:var(--pink)}
.prologue-trigger.open .prologue-icon{transform:rotate(90deg)}
.prologue-label{font-size:13px;font-weight:600;color:var(--black);flex:1}
.prologue-sub{font-size:10.5px;color:var(--gray-lt)}
.prologue-body{display:none;padding:0 16px 16px;border-top:1px solid var(--border-lt);max-height:380px;overflow-y:auto}
.prologue-body.open{display:block}
.prologue-body::-webkit-scrollbar{width:3px}.prologue-body::-webkit-scrollbar-thumb{background:var(--border);border-radius:2px}
.prologue-section{margin-top:13px}
.prologue-section-title{font-size:10px;font-weight:700;color:var(--gray-lt);text-transform:uppercase;letter-spacing:.08em;margin-bottom:5px}
.prologue-text{font-size:12px;line-height:1.65;color:var(--gray)}
.prologue-text p{margin-bottom:7px}
.prologue-text ul{margin-left:15px;margin-bottom:7px}
.prologue-text li{margin-bottom:4px}
.prologue-locked{display:inline-flex;align-items:center;gap:5px;padding:3px 9px;background:var(--bg-mid);border-radius:100px;font-size:10px;color:var(--gray-lt);font-weight:600;letter-spacing:.04em}

/* ── QUESTION CARDS ── */
.q-group{margin-bottom:5px}
.q-card{background:var(--bg);border:1.5px solid var(--border);border-radius:var(--r-lg);overflow:visible;transition:box-shadow .15s,border-color .15s}
.q-card:hover{box-shadow:var(--sh-sm);border-color:var(--pink-mid)}
.q-header{padding:12px 14px;display:flex;align-items:flex-start;gap:10px}
.q-num{font-family:'JetBrains Mono',monospace;font-size:9px;color:var(--gray-lt);flex-shrink:0;margin-top:3px;min-width:22px;font-weight:600}
.q-content{flex:1;min-width:0}
.q-text{font-size:13px;font-weight:600;color:var(--black);line-height:1.5;margin-bottom:9px}
.q-hint{font-size:11.5px;color:var(--gray);line-height:1.4;margin-bottom:9px;padding:8px 11px;background:var(--pink-pale);border-radius:var(--r);border-left:2.5px solid var(--pink)}

/* ── POLICY PREVIEW CHIPS ── */
.policy-preview{margin-top:10px;display:flex;flex-direction:column;gap:4px}
.pp-section-label{font-size:9.5px;font-weight:700;color:var(--gray-lt);text-transform:uppercase;letter-spacing:.08em;margin-top:5px;margin-bottom:3px;padding-left:2px}
.pp-cross-badge{font-size:8px;font-weight:700;background:rgba(0,0,0,.06);color:inherit;border-radius:4px;padding:1px 5px;flex-shrink:0;margin-right:2px}
.pp-row{display:flex;align-items:center;gap:7px;padding:5px 9px;border-radius:6px;font-size:11px;cursor:default;transition:background .12s;position:relative}
.pp-row.on{background:var(--green-pale);border:1px solid var(--green-border);color:var(--green)}
.pp-row.off{background:var(--red-pale);border:1px solid var(--red-border);color:var(--red);text-decoration:line-through;opacity:.7}
.pp-dot{width:6px;height:6px;border-radius:50%;flex-shrink:0}
.pp-row.on .pp-dot{background:var(--green)}.pp-row.off .pp-dot{background:var(--red)}
.pp-code{font-family:'JetBrains Mono',monospace;font-size:9.5px;font-weight:600;letter-spacing:.03em;white-space:nowrap;flex-shrink:0}
.pp-text{flex:1;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:11px}
#lattice-tooltip{display:none;position:fixed;z-index:99999;background:var(--black);color:rgba(255,255,255,.9);font-size:10.5px;line-height:1.55;padding:9px 12px;border-radius:8px;max-width:260px;white-space:normal;box-shadow:0 6px 24px rgba(0,0,0,.2);pointer-events:none;font-family:'DM Sans',sans-serif}
#lattice-tooltip strong{color:var(--pink-mid);font-size:9.5px;display:block;margin-bottom:3px;text-transform:uppercase;letter-spacing:.06em;font-weight:700}
.pp-tooltip{display:none !important}

/* ── INPUTS ── */
.radio-group,.checkbox-group{display:flex;flex-direction:column;gap:5px}
.radio-opt,.checkbox-opt{display:flex;align-items:center;gap:9px;padding:9px 11px;border-radius:var(--r);border:1.5px solid var(--border);cursor:pointer;transition:all .12s;background:var(--bg-soft)}
.radio-opt:hover,.checkbox-opt:hover{background:var(--pink-pale);border-color:var(--pink-mid)}
.radio-opt.sel,.checkbox-opt.sel{background:var(--pink-pale);border-color:var(--pink)}
.radio-opt input,.checkbox-opt input{display:none}
.radio-dot{width:15px;height:15px;border-radius:50%;border:2px solid var(--border);display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .12s}
.radio-opt.sel .radio-dot{border-color:var(--pink)}
.radio-inner{width:7px;height:7px;border-radius:50%;background:var(--pink);display:none}
.radio-opt.sel .radio-inner{display:block}
.check-box{width:15px;height:15px;border-radius:4px;border:2px solid var(--border);display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .12s}
.checkbox-opt.sel .check-box{border-color:var(--pink);background:var(--pink)}
.check-mark{color:#fff;font-size:9px;display:none}.checkbox-opt.sel .check-mark{display:block}
.opt-label{font-size:13px;color:var(--black);font-weight:400}
select.q-sel{width:100%;padding:9px 12px;border:1.5px solid var(--border);border-radius:var(--r);font-family:'DM Sans',sans-serif;font-size:13px;color:var(--black);background:var(--bg);cursor:pointer;outline:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23999' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;padding-right:32px}
select.q-sel:focus{border-color:var(--pink);box-shadow:0 0 0 3px rgba(232,51,109,.10)}
input.q-inp,textarea.q-ta{width:100%;padding:9px 12px;border:1.5px solid var(--border);border-radius:var(--r);font-family:'DM Sans',sans-serif;font-size:13px;color:var(--black);background:var(--bg);outline:none;transition:border .12s}
input.q-inp:focus,textarea.q-ta:focus{border-color:var(--pink);box-shadow:0 0 0 3px rgba(232,51,109,.10)}
textarea.q-ta{resize:vertical;min-height:72px;line-height:1.5}


/* ── RANK INPUT ── */
.sr-rank-list{display:flex;flex-direction:column;gap:5px;margin-top:8px}
.sr-rank-item{display:flex;align-items:center;gap:8px;padding:8px 10px;background:var(--bg-mid);border:1.5px solid var(--border);border-radius:8px}
.sr-rank-n{font-size:10px;font-weight:700;color:var(--gray-lt);min-width:16px;text-align:center;flex-shrink:0}
.sr-rank-label{flex:1;font-size:13px;color:var(--black);line-height:1.35}
.sr-rank-btns{display:flex;flex-direction:column;gap:2px;flex-shrink:0}
.sr-rank-up,.sr-rank-dn{font-size:10px;padding:1px 5px;border:1px solid var(--border);border-radius:4px;background:var(--bg);cursor:pointer;color:var(--gray);line-height:1.4}
.sr-rank-up:hover:not(:disabled),.sr-rank-dn:hover:not(:disabled){background:var(--bg-mid);color:var(--black);border-color:var(--gray-lt)}
.sr-rank-up:disabled,.sr-rank-dn:disabled{opacity:.25;cursor:not-allowed}
.sr-rank-custom{border-style:dashed;background:var(--bg)}
.sr-rank-custom-inp{flex:1;border:none;background:transparent;font-size:13px;color:var(--black);font-family:'DM Sans',sans-serif;outline:none;padding:0}
.sr-rank-custom-inp::placeholder{color:var(--gray-xlt)}

/* ── NESTED ── */
.nested-wrap{margin-top:8px;padding:0 14px 12px 32px;border-top:1px dashed var(--border);animation:slideDown .2s ease}
@keyframes slideDown{from{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}
.nested-tag{font-size:9.5px;font-weight:700;color:var(--gray-lt);text-transform:uppercase;letter-spacing:.08em;margin-bottom:7px;margin-top:10px}

/* ── CUSTOM ELEMENT BUILDER ── */
.custom-el-card{border:1.5px solid var(--border);border-radius:var(--r-lg);margin-bottom:12px;overflow:hidden}
.custom-el-card-header{background:#1a2535;color:#fff;padding:10px 14px;display:flex;align-items:center;gap:10px;font-family:'JetBrains Mono',monospace;font-size:12px}
.custom-el-title-badge{background:rgba(232,51,109,.25);color:var(--pink-mid);padding:2px 8px;border-radius:100px;font-size:10px;font-weight:700}
.custom-el-name{font-family:'DM Sans',sans-serif;font-size:13px;font-weight:600}
.btn-remove-el{margin-left:auto;background:rgba(255,255,255,.1);border:none;color:rgba(255,255,255,.5);cursor:pointer;padding:3px 9px;border-radius:100px;font-size:11px;transition:all .12s}
.btn-remove-el:hover{background:rgba(192,20,60,.4);color:#fff}
.custom-el-body{padding:14px;display:flex;flex-direction:column;gap:10px}
.custom-field-label{font-size:11px;font-weight:700;color:var(--gray-dark);margin-bottom:4px;display:block;letter-spacing:.04em;text-transform:uppercase}
.goal-card-body{padding:10px 12px;display:flex;flex-direction:column;gap:8px}
.btn-remove-row:hover{background:var(--red-pale)}
.btn-add-el{width:100%;padding:11px;border:1.5px dashed var(--border);border-radius:var(--r-lg);background:transparent;color:var(--gray-lt);font-size:12px;font-weight:600;cursor:pointer;transition:all .15s;font-family:'DM Sans',sans-serif;display:flex;align-items:center;justify-content:center;gap:7px}
.btn-add-el:hover{border-color:var(--pink);color:var(--pink);background:var(--pink-pale)}
.btn-primary-sm{padding:8px 18px;border-radius:100px;font-family:'DM Sans',sans-serif;font-size:12px;font-weight:600;cursor:pointer;transition:all .15s;border:none;background:var(--pink);color:#fff}
.btn-primary-sm:hover{background:var(--pink-dark)}
.btn-secondary-sm{padding:8px 18px;border-radius:100px;font-family:'DM Sans',sans-serif;font-size:12px;font-weight:500;cursor:pointer;transition:all .15s;background:transparent;color:var(--gray);border:1.5px solid var(--border)}
.btn-secondary-sm:hover{border-color:var(--pink);color:var(--pink)}

/* ── COMMON CODES STRIP ── */
.common-codes-strip{padding:8px 12px;background:var(--black);border-radius:var(--r);margin-bottom:6px;display:flex;align-items:center;flex-wrap:wrap;gap:6px}
.common-codes-label{font-size:9.5px;color:rgba(255,255,255,.35);text-transform:uppercase;letter-spacing:.08em;margin-right:2px}
.common-code-tag{font-family:'JetBrains Mono',monospace;font-size:9.5px;background:rgba(232,51,109,.2);color:var(--pink-mid);padding:2px 7px;border-radius:100px}

/* ── OUTPUT PANEL ── */
.output-panel{flex:1;overflow-y:auto;background:var(--bg);position:relative}
.output-panel::-webkit-scrollbar{width:5px}.output-panel::-webkit-scrollbar-thumb{background:var(--border);border-radius:2px}
.doc-wrap{max-width:960px;margin:0 auto;padding:44px 40px 100px}

/* ── DOCUMENT STYLES ── */
.doc-cover{text-align:center;padding:0;margin-bottom:52px;background:var(--bg)}
.doc-cover-bar{height:3px;background:var(--pink);width:100%}
.doc-cover-inner{padding:52px 40px 48px}
.doc-watermark{display:inline-block;font-family:'JetBrains Mono',monospace;font-size:9px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--gray-lt);border:1px solid var(--border);border-radius:100px;padding:3px 12px;margin-bottom:40px}
.doc-jurisdiction-name{font-family:'DM Serif Display',serif;font-size:48px;font-weight:400;color:var(--black);line-height:1.1;letter-spacing:-.02em;margin-bottom:6px}
.doc-jurisdiction-state{font-family:'DM Serif Display',serif;font-size:20px;font-weight:400;color:var(--gray-lt);font-style:italic;margin-bottom:24px}
.doc-cover-divider{display:flex;align-items:center;justify-content:center;gap:12px;margin-bottom:24px}
.doc-cover-divider-line{flex:1;max-width:80px;height:1px;background:var(--border)}
.doc-cover-divider-dot{width:5px;height:5px;border-radius:50%;background:var(--pink)}
.doc-plan-title{font-family:'DM Sans',sans-serif;font-size:11px;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--gray);margin-bottom:8px}
.doc-plan-year{font-family:'DM Serif Display',serif;font-size:15px;font-style:italic;color:var(--pink);margin-bottom:44px}
.doc-cover-footer{border-top:1px solid var(--border);padding-top:18px;display:flex;align-items:center;justify-content:center;gap:16px}
.doc-meta{font-size:10px;color:var(--gray-lt);letter-spacing:.04em;line-height:1.8}
.doc-meta strong{color:var(--gray);font-weight:600}

/* Prologue in output */
.doc-prologue{margin-bottom:44px}
.doc-prologue-header{background:#1a2d46;color:#fff;padding:16px 22px;border-radius:var(--r) var(--r) 0 0;display:flex;align-items:center;gap:12px;cursor:pointer;user-select:none;transition:background .15s}
.doc-prologue-header:hover{background:#1f3554}
.doc-prologue-tag{font-family:'JetBrains Mono',monospace;font-size:10px;background:rgba(232,51,109,.2);color:var(--pink-mid);padding:3px 8px;border-radius:100px;letter-spacing:.04em}
.doc-prologue-title{font-size:15px;font-weight:700;flex:1}
.doc-prologue-toggle{font-size:11px;color:rgba(255,255,255,.4);font-style:italic;margin-left:auto}
.doc-prologue-body{border:1.5px solid var(--border);border-top:none;border-radius:0 0 var(--r) var(--r);max-height:0;overflow:hidden;transition:max-height .4s ease}
.doc-prologue-body.open{max-height:3600px}
.doc-prologue-inner{padding:26px 30px;font-size:13px;line-height:1.75;color:var(--gray)}
.doc-prologue-inner h3{font-size:14px;color:var(--black);margin:18px 0 8px;padding-bottom:4px;border-bottom:1px solid var(--border-lt);font-weight:700}
.doc-prologue-inner p{margin-bottom:10px}
.doc-prologue-inner ul{margin-left:20px;margin-bottom:10px}
.doc-prologue-inner li{margin-bottom:5px}
.doc-readonly-badge{display:inline-flex;align-items:center;gap:5px;padding:3px 10px;background:var(--bg-mid);border-radius:100px;font-size:10px;color:var(--gray-lt);font-weight:600;letter-spacing:.05em;text-transform:uppercase;margin-bottom:14px}

/* Element sections */
.doc-element{margin-bottom:44px}
.doc-el-header{display:flex;align-items:center;gap:12px;padding:14px 22px;background:#1a2535;color:#fff;border-radius:var(--r) var(--r) 0 0}
.doc-el-header-toggle{cursor:pointer;user-select:none;transition:background .12s}
.doc-el-header-toggle:hover{background:#21303e}
.doc-el-chevron{margin-left:auto;font-size:10px;opacity:.5;flex-shrink:0;font-style:normal}
.doc-el-code{font-family:'JetBrains Mono',monospace;font-size:11px;background:rgba(232,51,109,.2);padding:3px 9px;border-radius:100px;color:var(--pink-mid)}
.doc-el-title{font-size:16px;font-weight:700;letter-spacing:.01em}
.doc-custom-tag{font-size:11px;font-weight:600;opacity:.5;letter-spacing:.04em;font-family:'DM Sans',sans-serif;vertical-align:middle}
.doc-el-body{border:1.5px solid var(--border);border-top:none;border-radius:0 0 var(--r) var(--r);padding:26px;overflow:hidden}

/* Exhibits */
.doc-exhibit{margin:18px 0;border-radius:var(--r);overflow:hidden;border:2px dashed var(--border)}
.doc-exhibit-placeholder{background:repeating-linear-gradient(45deg,var(--bg-soft),var(--bg-soft) 10px,var(--bg-mid) 10px,var(--bg-mid) 20px);padding:30px 24px;text-align:center}
.doc-exhibit-id{font-family:'JetBrains Mono',monospace;font-size:11px;font-weight:600;color:var(--pink);background:var(--pink-pale);padding:3px 10px;border-radius:100px;display:inline-block;margin-bottom:8px}
.doc-exhibit-name{font-size:13px;font-weight:700;color:var(--black);margin-bottom:4px}
.doc-exhibit-sub{font-size:11.5px;color:var(--gray-lt)}
.doc-exhibit img{width:100%;display:block}

/* Intro paragraph */
.doc-intro{font-size:13px;color:var(--gray);line-height:1.75;margin-bottom:24px;padding:14px 18px;background:var(--pink-pale);border-left:3px solid var(--pink);border-radius:0 var(--r) var(--r) 0;font-style:italic}

/* Goal */
.doc-goal{margin-bottom:24px}
.doc-goal-hd{display:flex;align-items:flex-start;gap:11px;margin-bottom:10px}
.doc-goal-badge{font-family:'JetBrains Mono',monospace;font-size:9.5px;background:var(--pink);color:#fff;padding:3px 9px;border-radius:100px;white-space:nowrap;flex-shrink:0;margin-top:3px;font-weight:600}
.doc-goal-text{font-family:'DM Serif Display',serif;font-size:15px;font-weight:400;color:var(--black);line-height:1.4;word-break:break-word;overflow-wrap:break-word;min-width:0;flex:1}
.doc-policies{margin-left:20px;display:flex;flex-direction:column;gap:7px;min-width:0;overflow:hidden}

/* Policy */
.doc-policy{display:flex;flex-direction:column;gap:4px;padding:10px 14px;border-radius:var(--r);border:1.5px solid var(--border);font-size:13px;background:var(--bg);transition:all .2s;overflow:hidden;min-width:0}
.doc-policy.triggered{border-color:var(--border)!important}
.doc-goal.triggered .doc-goal-text{color:var(--black)}
.doc-policy-custom{background:var(--bg)!important;border-color:var(--border)!important}
.doc-policy-custom.triggered{background:var(--bg)!important;border-color:var(--border)!important}
.doc-policy-top{display:flex;align-items:flex-start;gap:10px;min-width:0}
.doc-policy-code{font-family:'JetBrains Mono',monospace;font-size:9.5px;color:var(--gray-lt);white-space:nowrap;flex-shrink:0;margin-top:3px;min-width:54px}
.doc-policy.triggered .doc-policy-code{color:var(--pink)}
.doc-policy-text{line-height:1.6;color:var(--black);word-break:break-word;overflow-wrap:break-word;min-width:0;flex:1}

/* Actions */
.doc-actions{margin-left:16px;margin-top:6px;display:flex;flex-direction:column;gap:0}
.doc-action{display:flex;gap:8px;font-size:12px;color:var(--gray);padding:4px 8px;border-left:2px solid var(--border);min-width:0;overflow:visible;align-items:flex-start}
.doc-action-code{font-family:'JetBrains Mono',monospace;font-size:9.5px;color:var(--gray-lt);white-space:nowrap;flex-shrink:0;min-width:64px;padding-top:2px}
.doc-action-ai{border-left-color:var(--pink)!important}
.doc-action-ai .doc-action-text{color:var(--pink)}
.doc-action-ai .doc-action-code{color:var(--pink-mid)}
.doc-action-text{color:var(--gray)}
.doc-action-text{word-break:break-word;overflow-wrap:break-word;min-width:0;flex:1;line-height:1.6}
.doc-action-buttons{display:flex;align-items:center;gap:2px;flex-shrink:0;margin-left:auto;align-self:flex-start}

/* Placeholder */

/* ── ✦ Spark button — inline Lattice Spark trigger ─────── */
.spark-btn{
  width:20px;height:20px;border-radius:50%;
  border:1.5px solid var(--pink-mid,#f0a0bb);
  background:var(--pink-pale,#fff0f5);
  color:var(--pink);font-size:10px;font-weight:700;
  display:inline-flex;align-items:center;justify-content:center;
  cursor:pointer;flex-shrink:0;
  transition:all .15s;
  position:relative;
  line-height:1;
  vertical-align:middle;
  align-self:center;
  margin-top:0;
}
.spark-btn:hover{background:var(--pink);color:#fff;border-color:var(--pink);transform:scale(1.15)}
.spark-locked{border-color:var(--border);background:var(--bg-mid);color:var(--gray-xlt)}
.spark-locked:hover{background:#f0c842;color:#7a6000;border-color:#e0b020;transform:scale(1.15)}

/* doc-btn-row — wraps + button and spark button side by side */
.doc-btn-row{display:flex;align-items:center;gap:6px;margin-top:8px;flex-wrap:wrap}
.doc-btn-row>.doc-add-row{flex:0 0 100%;margin-top:6px}

/* ── Floating Advisor window ────────────────────────────── */
/* Advisor modal — shared inner bits only. The overlay/card/header/textarea/button
   are inline-styled in JS (agent.js, update-spark.js) to match Monitor's "Ask Spark"
   panel exactly; these reusable pieces (streamed result + post-generation actions +
   optional context line) stay in CSS. */
.advisor-win-context{font-size:12px;color:var(--gray-lt);line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.advisor-win-ctx-label{font-weight:700;color:var(--gray)}
.advisor-win-result{
  font-size:13px;color:var(--black);
  line-height:1.65;white-space:pre-wrap;
  font-family:'DM Sans',sans-serif;
}
.advisor-generating{color:var(--gray-lt);font-style:italic;font-size:12.5px}
.advisor-win-insert-row{
  display:flex;gap:6px;flex-wrap:wrap;align-items:center;
  padding-top:12px;margin-top:10px;
  border-top:1px solid var(--border);
}
.advisor-win-insert{
  padding:6px 14px;background:var(--pink);color:#fff;
  border:none;border-radius:100px;
  font-size:11.5px;font-weight:700;cursor:pointer;
  font-family:'DM Sans',sans-serif;transition:background .15s;
}
.advisor-win-insert:hover{background:var(--pink-dark,#c2185b)}
.advisor-win-copy,.advisor-win-regen{
  padding:6px 14px;background:transparent;color:var(--gray);
  border:1.5px solid var(--border);border-radius:100px;
  font-size:11.5px;font-weight:600;cursor:pointer;
  font-family:'DM Sans',sans-serif;transition:all .12s;
}
.advisor-win-copy:hover,.advisor-win-regen:hover{border-color:var(--pink);color:var(--pink)}
.advisor-win-discard{
  padding:6px 8px;background:transparent;color:var(--gray-lt);
  border:none;font-size:11.5px;cursor:pointer;
  font-family:'DM Sans',sans-serif;margin-left:auto;
}





/* ── Edit button on custom items ── */
.doc-item-edit{background:none;border:none;color:#ccc;font-size:12px;cursor:pointer;padding:2px 5px;line-height:1;margin-left:4px;opacity:1;transition:all .15s;border-radius:4px;flex-shrink:0;align-self:flex-start;margin-top:1px}
.doc-goal-hd:hover .doc-item-edit,
.doc-policy-top:hover .doc-item-edit,
.doc-action:hover .doc-item-edit,
.doc-action-custom:hover .doc-item-edit{color:#666}
.doc-item-edit:hover{color:var(--pink);background:var(--pink-pale)}

@keyframes fadeIn{from{opacity:0}to{opacity:1}}
.doc-placeholder{text-align:center;padding:22px;color:var(--gray-lt);font-size:12.5px;background:repeating-linear-gradient(45deg,transparent,transparent 10px,rgba(0,0,0,.012) 10px,rgba(0,0,0,.012) 20px);border:1.5px dashed var(--border);border-radius:var(--r);margin:14px 0}

/* ── Add buttons in output panel ── */
.doc-plus-btn{display:inline-flex;align-items:center;gap:4px;padding:4px 13px;background:#888;color:#fff;border:none;border-radius:100px;font-family:'DM Sans',sans-serif;font-size:10.5px;font-weight:600;cursor:pointer;transition:background .15s;white-space:nowrap;margin-top:0;align-self:center;width:auto}
.doc-plus-btn:hover{background:var(--pink)}
/* Inline input */
.doc-add-row{display:flex;flex-direction:column;gap:6px;margin:8px 0 4px;animation:docAddSlide .15s ease}
@keyframes docAddSlide{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}
.doc-add-input{width:100%;box-sizing:border-box;padding:8px 10px;border:1.5px solid var(--pink-mid,#f0a0bb);border-radius:var(--r);font-family:'DM Sans',sans-serif;font-size:12.5px;line-height:1.5;background:var(--bg);color:var(--black);outline:none;resize:vertical}
.doc-add-input:focus{border-color:var(--pink);box-shadow:0 0 0 3px var(--pink-pale,#fff0f5)}
.doc-add-btn-row{display:flex;align-items:center;gap:6px}
.doc-add-ok{width:26px;height:26px;border-radius:7px;border:none;background:var(--pink);color:#fff;font-size:13px;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.doc-add-ok:hover{background:#c4215a}
.doc-add-spark{width:26px;height:26px;border-radius:7px;border:1.5px solid var(--pink-mid,#f0a0bb);background:transparent;color:var(--pink);font-size:13px;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .12s}
.doc-add-spark:hover{background:var(--pink);color:#fff;border-color:var(--pink)}
.doc-add-spark img{filter:none}
.doc-add-cancel{width:26px;height:26px;border-radius:7px;border:1.5px solid var(--border);background:transparent;color:var(--gray-lt);font-size:12px;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.doc-add-cancel:hover{border-color:var(--red);color:var(--red)}
/* Custom items */
/* custom items look identical to system — no special styling */
.doc-item-del{flex-shrink:0;margin-left:4px;width:18px;height:18px;border:none;background:transparent;color:#ccc;font-size:10px;cursor:pointer;border-radius:4px;display:flex;align-items:center;justify-content:center;transition:all .12s;align-self:flex-start;margin-top:1px}
.doc-goal:hover .doc-item-del,.doc-policy:hover .doc-item-del,.doc-action:hover .doc-item-del,.doc-action-custom:hover .doc-item-del{color:#999}
.doc-item-del:hover{background:#ffe8ec;color:var(--red)!important}

/* ── MODAL ── */
.modal-overlay-inner{position:fixed;inset:0;z-index:500;background:rgba(0,0,0,.4);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;animation:fadeIn .15s ease}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
.modal{background:var(--bg);border-radius:var(--r-lg);padding:32px;width:480px;box-shadow:var(--sh-lg);border:1.5px solid var(--border)}
.modal-title-inner{font-size:20px;font-weight:700;color:var(--black);margin-bottom:5px;letter-spacing:-.02em}
.modal-sub{font-size:13px;color:var(--gray);margin-bottom:22px;line-height:1.6}
.modal-field{margin-bottom:14px}
.modal-label{font-size:11px;font-weight:700;color:var(--gray-dark);margin-bottom:6px;display:block;letter-spacing:.06em;text-transform:uppercase}
.modal-inp{width:100%;padding:11px 14px;border:1.5px solid var(--border);border-radius:var(--r);font-family:'DM Sans',sans-serif;font-size:14px;outline:none;color:var(--black)}
.modal-inp:focus{border-color:var(--pink);box-shadow:0 0 0 3px rgba(232,51,109,.10)}
.modal-actions-inner{display:flex;gap:10px;justify-content:flex-end;margin-top:22px}

/* ── TOAST ── */
.toast-wrap{position:fixed;bottom:22px;right:22px;z-index:1000;display:flex;flex-direction:column;gap:8px}
.toast-item{background:var(--black);color:#fff;padding:11px 18px;border-radius:100px;font-size:13px;font-weight:500;box-shadow:var(--sh-lg);display:flex;align-items:center;gap:9px;animation:toastIn .25s ease;border-left:3px solid var(--pink)}
@keyframes toastIn{from{transform:translateX(20px);opacity:0}to{transform:translateX(0);opacity:1}}

/* ── PRINT ── */
@media print{
  .topbar,.sidebar,.input-panel,.toast-wrap{display:none!important}
  .output-panel{overflow:visible}.app-layout{margin-top:0;height:auto}
  .doc-wrap{padding:20px 40px;max-width:100%}
  .doc-el-header,.doc-prologue-header{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .doc-prologue-body{max-height:none!important;overflow:visible!important}
}

/* ── User icon pill + dropdown ───────────────────────── */
.user-pill{position:relative;display:flex;align-items:center;cursor:pointer;user-select:none}
.user-avatar{width:32px;height:32px;border-radius:50%;background:var(--pink);color:#fff;font-size:13px;font-weight:700;display:flex;align-items:center;justify-content:center;border:2px solid transparent;transition:border-color .15s}
.user-pill:hover .user-avatar{border-color:rgba(232,51,109,.5)}
.user-dropdown{position:absolute;top:calc(100% + 8px);right:0;background:var(--bg);border:1.5px solid var(--border);border-radius:12px;box-shadow:0 8px 24px rgba(0,0,0,.12);min-width:220px;padding:6px;z-index:999;display:none;flex-direction:column;gap:2px}
.user-dropdown.open{display:flex}
.user-dropdown-email{font-size:11px;color:var(--gray);padding:6px 10px 8px;border-bottom:1px solid var(--border);margin-bottom:4px;word-break:break-all}
.user-dropdown-item{display:flex;align-items:center;gap:8px;padding:7px 10px;border-radius:8px;font-size:12px;font-weight:500;cursor:pointer;transition:background .12s;border:none;background:none;width:100%;text-align:left;font-family:'DM Sans',sans-serif;color:var(--black)}
.user-dropdown-item:hover{background:var(--bg-soft)}
.user-dropdown-item.danger{color:#e8336d}
.user-dropdown-item.danger:hover{background:#fff0f0}

/* ── Share modal ─────────────────────────────────────── */
.share-overlay{position:fixed;inset:0;background:rgba(0,0,0,.5);backdrop-filter:blur(4px);z-index:9999;display:flex;align-items:center;justify-content:center}
.share-box{background:var(--bg);border-radius:20px;padding:36px 40px;max-width:460px;width:90%;box-shadow:0 24px 64px rgba(0,0,0,.2);position:relative}
.share-title{font-family:'DM Serif Display',serif;font-size:20px;color:#111;margin:0 0 6px;font-weight:400}
.share-desc{font-size:13px;color:#666;line-height:1.6;margin:0 0 20px}
.share-link-row{display:flex;gap:8px;margin-bottom:16px}
.share-link-input{flex:1;padding:10px 14px;border:1.5px solid var(--border);border-radius:10px;font-size:12px;color:#333;font-family:'DM Sans',sans-serif;outline:none;background:#f9f9f9}
.share-copy-btn{padding:10px 16px;background:var(--pink);color:#fff;border:none;border-radius:10px;font-size:12px;font-weight:700;cursor:pointer;white-space:nowrap;transition:background .15s}
.share-copy-btn:hover{background:var(--pink-dark)}
.share-revoke-btn{width:100%;padding:10px;background:none;border:1.5px solid var(--border);border-radius:10px;font-size:13px;color:#999;cursor:pointer;font-family:'DM Sans',sans-serif;transition:all .15s}
.share-revoke-btn:hover{border-color:#e33;color:#e33}
.share-close{position:absolute;top:16px;right:18px;background:none;border:none;font-size:20px;color:#999;cursor:pointer}


/* ══════════════════════════════════════════════════════════
   DASHBOARD PAGE STYLES
   ══════════════════════════════════════════════════════════ */


body.page-dashboard html, body.page-dashboard body { height: 100%; overflow: hidden; background: var(--bg-soft); }

body.page-dashboard .dash-layout { display: flex; flex-direction: column; height: 100vh; }


body.page-dashboard /* TOPBAR */
.dash-topbar { height: 56px; background: var(--bg); border-bottom: 1px solid var(--border); display: flex; align-items: center; padding: 0 28px; gap: 14px; flex-shrink: 0; }

body.page-dashboard .dash-logo { display: flex; align-items: center; text-decoration: none; }

body.page-dashboard .dash-logo img { height: 24px; width: auto; }

body.page-dashboard .topbar-divider { width: 1px; height: 18px; background: var(--border); }

body.page-dashboard .topbar-sub { font-size: 11px; font-weight: 600; color: var(--gray-lt); letter-spacing: .07em; text-transform: uppercase; }

body.page-dashboard .topbar-spacer { flex: 1; }

body.page-dashboard /* ── User icon pill + dropdown menu ─────────────────────── */
.user-pill {position:relative;display:flex;align-items:center;cursor:pointer;user-select:none}

body.page-dashboard .user-avatar {width:32px;height:32px;border-radius:50%;background:var(--pink);color:#fff;font-size:13px;font-weight:700;display:flex;align-items:center;justify-content:center;border:2px solid transparent;transition:border-color .15s}

body.page-dashboard .user-pill:hover .user-avatar {border-color:rgba(232,51,109,.5)}

body.page-dashboard .user-dropdown {position:absolute;top:calc(100% + 8px);right:0;background:var(--bg);border:1.5px solid var(--border);border-radius:12px;box-shadow:0 8px 24px rgba(0,0,0,.12);min-width:200px;padding:8px;z-index:999;display:none;flex-direction:column;gap:2px}

body.page-dashboard .user-dropdown.open {display:flex}

body.page-dashboard .user-dropdown-email {font-size:11px;color:var(--gray);padding:6px 10px 10px;border-bottom:1px solid var(--border);margin-bottom:4px;word-break:break-all}

body.page-dashboard .user-dropdown-item {display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:8px;font-size:13px;font-weight:500;cursor:pointer;transition:background .12s;border:none;background:none;width:100%;text-align:left;font-family:'DM Sans',sans-serif;color:var(--black)}

body.page-dashboard .user-dropdown-item:hover {background:var(--bg-soft)}

body.page-dashboard .user-dropdown-item.danger {color:#e8336d}

body.page-dashboard .user-dropdown-item.danger:hover {background:#fff0f0}


body.page-dashboard /* Dark mode modal fixes */
html[data-theme="dark"] #onboardingOverlay > div {
  background: var(--bg) !important;
  color: var(--black) !important;
}

body.page-dashboard html[data-theme="dark"] .user-dropdown {
  background: var(--bg);
  border-color: var(--border);
}

body.page-dashboard html[data-theme="dark"] .user-dropdown-email {
  color: var(--gray);
  border-color: var(--border);
}

body.page-dashboard html[data-theme="dark"] .user-dropdown-item {
  color: var(--black);
}

body.page-dashboard html[data-theme="dark"] .user-dropdown-item:hover {
  background: var(--bg-soft);
}

body.page-dashboard html[data-theme="dark"] .user-credits-block {
  background: var(--bg-soft) !important;
  border-color: var(--border) !important;
}

body.page-dashboard html[data-theme="dark"] .plan-card {
  background: var(--bg);
  border-color: var(--border);
}

body.page-dashboard html[data-theme="dark"] .plan-card-new {
  background: var(--bg);
  border-color: var(--border);
}

body.page-dashboard /* ── Advisor upgrade/active button ──────────────────────── */
.btn-advisor-upgrade {background:linear-gradient(135deg,#e8336d,#c4215a);color:#fff;border:none;padding:7px 16px;border-radius:100px;font-size:12px;font-weight:700;cursor:pointer;font-family:'DM Sans',sans-serif;display:flex;align-items:center;gap:6px;transition:all .15s;box-shadow:0 2px 8px rgba(232,51,109,.3)}

body.page-dashboard .btn-advisor-upgrade:hover {transform:translateY(-1px);box-shadow:0 4px 14px rgba(232,51,109,.4)}

body.page-dashboard .btn-advisor-badge {background:#1c3049;color:#fff;border:1.5px solid #2a4262;padding:7px 14px;border-radius:100px;font-size:11px;font-weight:600;font-family:'DM Sans',sans-serif;display:flex;align-items:center;gap:6px;cursor:default}

body.page-dashboard .btn-advisor-badge .badge-dot {width:7px;height:7px;border-radius:50%;background:#4caf50;display:inline-block;box-shadow:0 0 6px rgba(76,175,80,.6)}

body.page-dashboard .user-avatar { width: 26px; height: 26px; background: var(--pink); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 11px; font-weight: 700; color: #fff; }

body.page-dashboard .user-email { font-size: 12px; font-weight: 500; color: var(--gray-dark); max-width: 200px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }



body.page-dashboard /* BODY */
.dash-body { flex: 1; overflow-y: auto; padding: 44px 52px 100px; }

body.page-dashboard .dash-body::-webkit-scrollbar { width: 4px; }

body.page-dashboard .dash-body::-webkit-scrollbar-thumb { background: var(--border); border-radius: 2px; }


body.page-dashboard /* HEADER */
.dash-header { display: flex; align-items: flex-end; justify-content: space-between; margin-bottom: 40px; gap: 20px; }

body.page-dashboard .dash-greeting { font-size: 30px; font-weight: 700; color: var(--black); line-height: 1.1; margin-bottom: 7px; letter-spacing: -.02em; }

body.page-dashboard .dash-greeting em { color: var(--pink); font-style: italic; }

body.page-dashboard .dash-subtitle { font-size: 13px; color: var(--gray-lt); }


body.page-dashboard /* SECTION LABEL */
.section-label { font-size: 10px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--gray-lt); margin-bottom: 16px; display: flex; align-items: center; gap: 12px; }

body.page-dashboard .section-label::after { content: ''; flex: 1; height: 1px; background: var(--border); }


body.page-dashboard /* PLAN GRID */
.plan-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 16px; margin-bottom: 52px; }


body.page-dashboard .plan-card {
  background: var(--bg); border: 1.5px solid var(--border); border-radius: var(--r-xl);
  padding: 24px; cursor: pointer; transition: all .2s; position: relative; overflow: hidden;
  display: flex; flex-direction: column; min-height: 180px; text-decoration: none;
  box-shadow: var(--sh-sm);
}


body.page-dashboard .plan-card::before {
  content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: var(--pink); transform: scaleX(0); transform-origin: left; transition: transform .25s ease;
  border-radius: var(--r-xl) var(--r-xl) 0 0;
}

body.page-dashboard .plan-card:hover { border-color: var(--pink-mid); transform: translateY(-2px); box-shadow: var(--sh-md); }

body.page-dashboard .plan-card:hover::before { transform: scaleX(1); }

body.page-dashboard .plan-card:hover .card-actions { opacity: 1; }


body.page-dashboard /* Card action buttons — appear on hover at bottom */
.card-actions {
  position: absolute; top: 16px; right: 16px;
  display: flex; gap: 6px;
  opacity: 0; transition: opacity .15s;
}

body.page-dashboard .card-btn {
  width: 28px; height: 28px;
  border-radius: 8px; border: 1.5px solid var(--border);
  background: var(--bg); cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  font-size: 13px; transition: all .12s;
  color: var(--gray-lt);
}

body.page-dashboard .card-btn:hover { border-color: var(--pink); color: var(--pink); background: var(--pink-pale); transform: scale(1.08); }

body.page-dashboard .card-btn.delete:hover { border-color: var(--red); color: var(--red); background: var(--red-pale); }

body.page-dashboard .card-btn.duplicate:hover { border-color: var(--pink); color: var(--pink); background: var(--pink-pale); }


body.page-dashboard .plan-id { font-size: 10px; font-weight: 600; color: var(--gray-lt); letter-spacing: .07em; text-transform: uppercase; margin-bottom: 10px; padding-right: 110px; }

body.page-dashboard .plan-name { font-size: 17px; font-weight: 700; color: var(--black); line-height: 1.3; margin-bottom: 4px; letter-spacing: -.01em;  padding-right: 110px; }

body.page-dashboard .plan-state { font-size: 12px; color: var(--gray-lt); margin-bottom: 14px; }

body.page-dashboard .plan-tags { display: flex; gap: 6px; margin-bottom: 14px; flex-wrap: wrap; }

body.page-dashboard .plan-tag { font-size: 10px; font-weight: 600; padding: 3px 10px; border-radius: 100px; background: var(--pink-pale); color: var(--pink); white-space: nowrap; }

body.page-dashboard .plan-tag.tag-blue { background: #eef3ff; color: #3a5bc7; }

body.page-dashboard .plan-tag.tag-green { background: #edfaf3; color: var(--green); }

body.page-dashboard .plan-footer { margin-top: auto; }

body.page-dashboard .plan-progress-row { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; }

body.page-dashboard .plan-progress-bar { flex: 1; height: 4px; background: var(--border); border-radius: 2px; overflow: hidden; }

body.page-dashboard .plan-progress-fill { height: 100%; background: var(--pink); border-radius: 2px; transition: width .6s ease; }

body.page-dashboard .plan-pct { font-size: 11px; font-weight: 700; color: var(--pink); white-space: nowrap; }

body.page-dashboard .plan-updated { font-size: 11px; color: var(--gray-lt); display: flex; align-items: center; gap: 5px; }

/* Monitor button injected into eligible plan cards */
body.page-dashboard .plan-monitor-wrap { margin-top: 10px; }

body.page-dashboard .plan-monitor-btn {
  display: block; width: 100%;
  padding: 7px 12px;
  font-family: 'DM Sans', sans-serif; font-size: 11px; font-weight: 700;
  text-align: center; letter-spacing: .02em;
  background: transparent;
  color: var(--gray-lt);
  border: 1.5px dashed var(--border);
  border-radius: 8px;
  cursor: pointer;
  transition: all .18s;
}

body.page-dashboard .plan-monitor-btn:hover {
  background: var(--bg-mid);
  border-color: var(--pink);
  border-style: solid;
  color: var(--pink);
}

body.page-dashboard .plan-monitor-btn.has-import {
  background: var(--pink-pale);
  border: 1.5px solid var(--pink-mid);
  border-style: solid;
  color: var(--pink-dark);
}

body.page-dashboard .plan-monitor-btn.has-import:hover {
  background: var(--pink-mid);
  border-color: var(--pink);
  color: var(--pink-dark);
}

body.page-dashboard .plan-monitor-btn:disabled {
  opacity: .5; cursor: not-allowed;
}

/* Dark mode */
body.page-dashboard html[data-theme="dark"] .plan-monitor-btn { color: var(--gray); border-color: var(--border); }
body.page-dashboard html[data-theme="dark"] .plan-monitor-btn:hover { background: rgba(232,51,109,.12); border-color: var(--pink); color: var(--pink); }
body.page-dashboard html[data-theme="dark"] .plan-monitor-btn.has-import { background: rgba(232,51,109,.15); border-color: var(--pink); color: #f4a4bf; }

body.page-dashboard /* New plan card */
.plan-card-new { background: var(--bg); border: 1.5px dashed var(--border); border-radius: var(--r-xl); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; color: var(--gray-lt); font-size: 13px; font-weight: 500; min-height: 180px; cursor: pointer; transition: all .2s; box-shadow: none; }

body.page-dashboard .plan-card-new::before { display: none; }

body.page-dashboard .plan-card-new:hover { border-color: var(--pink); color: var(--pink); background: var(--pink-pale); transform: translateY(-2px); }

body.page-dashboard .new-icon { font-size: 28px; opacity: .5; transition: opacity .15s; }

body.page-dashboard .plan-card-new:hover .new-icon { opacity: 1; }


body.page-dashboard /* ACTIVITY */
.activity-list { background: var(--bg); border: 1.5px solid var(--border); border-radius: var(--r-xl); overflow: hidden; box-shadow: var(--sh-sm); }

body.page-dashboard .activity-row { display: flex; align-items: center; gap: 14px; padding: 13px 20px; border-bottom: 1px solid var(--border-lt); transition: background .12s; font-size: 13px; }

body.page-dashboard .activity-row:last-child { border-bottom: none; }

body.page-dashboard .activity-row:hover { background: var(--bg-soft); }

body.page-dashboard .activity-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--pink); flex-shrink: 0; }

body.page-dashboard .activity-text { color: var(--gray); flex: 1; }

body.page-dashboard .activity-text strong { color: var(--black); font-weight: 600; }

body.page-dashboard .activity-time { font-size: 11px; color: var(--gray-lt); white-space: nowrap; }


body.page-dashboard /* EMPTY STATE */
.empty-state { text-align: center; padding: 60px 40px; border: 1.5px dashed var(--border); border-radius: var(--r-xl); margin-bottom: 16px; background: var(--bg); }

body.page-dashboard .empty-icon { font-size: 36px; margin-bottom: 14px; opacity: .35; }

body.page-dashboard .empty-title { font-size: 18px; font-weight: 700; color: var(--gray-lt); margin-bottom: 8px; letter-spacing: -.01em; }

body.page-dashboard .empty-desc { font-size: 13px; color: var(--gray-lt); line-height: 1.6; }


body.page-dashboard /* MODALS */
.modal-overlay { display: none; }

body.page-dashboard .modal-overlay.open { display: flex; }


body.page-dashboard /* Delete confirm modal — red accent */
.modal-box.danger .modal-title { color: var(--red); }

body.page-dashboard .modal-box.danger .btn-danger {
  background: var(--red); color: #fff; border: none;
  padding: 11px 24px; border-radius: 100px;
  font-family: 'DM Sans', sans-serif; font-size: 13.5px; font-weight: 600;
  cursor: pointer; transition: all .15s;
}

body.page-dashboard .modal-box.danger .btn-danger:hover { background: #a01030; transform: translateY(-1px); }

/* ── Module type tags on plan cards ─────────────────────── */
body.page-dashboard .plan-tag.tag-update  { background: #eef3ff; color: #3a5bc7; }
body.page-dashboard .plan-tag.tag-monitor { background: var(--bg-mid); color: var(--gray-lt); }

/* ── Project Type Modal (platform launcher) ──────────────── */
body.page-dashboard .ptm-box{width:min(880px,calc(100vw - 48px));padding:40px 36px 36px;position:relative}
body.page-dashboard .ptm-headline{font-family:'DM Serif Display',serif;font-size:26px;color:var(--black);letter-spacing:-.02em;margin-bottom:6px}
body.page-dashboard .ptm-subhead{font-size:14px;color:var(--gray);margin-bottom:28px;line-height:1.5}
body.page-dashboard .ptm-close{position:absolute;top:18px;right:18px;background:none;border:none;font-size:14px;color:var(--gray-lt);cursor:pointer;padding:5px 8px;border-radius:6px;line-height:1;transition:color .15s}
body.page-dashboard .ptm-close:hover{color:var(--black)}
body.page-dashboard .ptm-cards{display:grid;grid-template-columns:1fr 1fr 1fr;gap:16px}
@media(max-width:700px){body.page-dashboard .ptm-cards{grid-template-columns:1fr}}
body.page-dashboard .ptm-card{border:1.5px solid var(--border);border-radius:16px;padding:26px 22px;display:flex;flex-direction:column;background:var(--bg-soft);transition:border-color .15s,box-shadow .15s,transform .15s}
body.page-dashboard .ptm-card:not(.ptm-card-disabled):hover{border-color:var(--pink-mid);box-shadow:var(--sh-md);transform:translateY(-2px)}
body.page-dashboard .ptm-card-disabled{opacity:.5;border-style:dashed}
body.page-dashboard .ptm-card-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
body.page-dashboard .ptm-icon{font-size:20px;line-height:1;color:var(--gray-lt)}
body.page-dashboard .ptm-badge{font-size:9px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:3px 10px;border-radius:100px}
body.page-dashboard .ptm-badge-active{background:var(--green-pale);color:var(--green);border:1px solid var(--green-border)}
body.page-dashboard .ptm-badge-beta{background:#eef3ff;color:#3a5bc7;border:1px solid #c5d3f5}
body.page-dashboard .ptm-badge-dev{background:var(--bg-mid);color:var(--gray-lt);border:1px solid var(--border)}
body.page-dashboard .ptm-title{font-family:'DM Serif Display',serif;font-size:19px;color:var(--black);letter-spacing:-.01em;margin-bottom:10px}
body.page-dashboard .ptm-desc{font-size:13px;color:var(--gray);line-height:1.65;flex:1;margin-bottom:20px}
body.page-dashboard .ptm-cta{align-self:flex-start}
body.page-dashboard .ptm-cta-disabled{padding:9px 20px;border-radius:100px;font-family:'DM Sans',sans-serif;font-size:13px;font-weight:600;background:var(--bg-mid);color:var(--gray-lt);border:1.5px solid var(--border);cursor:not-allowed;align-self:flex-start}


body.page-dashboard /* ── Advisor upgrade modal ── */
.advisor-upgrade-overlay {position:fixed;inset:0;background:rgba(0,0,0,.5);backdrop-filter:blur(4px);z-index:9999;display:flex;align-items:center;justify-content:center;animation:fadeIn .15s ease}

body.page-dashboard .advisor-upgrade-box {background:var(--bg);border-radius:20px;padding:40px 44px;max-width:400px;width:90%;box-shadow:0 24px 64px rgba(0,0,0,.2);position:relative;text-align:center}

body.page-dashboard .advisor-upgrade-close {position:absolute;top:16px;right:18px;background:none;border:none;font-size:20px;color:var(--gray-lt);cursor:pointer}

body.page-dashboard .advisor-upgrade-icon {font-size:28px;margin-bottom:12px}

body.page-dashboard .advisor-upgrade-title {font-family:'DM Serif Display',serif;font-size:22px;color:var(--black);margin:0 0 8px;font-weight:400}

body.page-dashboard .advisor-upgrade-desc {font-size:13px;color:var(--gray);line-height:1.7;margin:0 0 20px}

body.page-dashboard .advisor-upgrade-features {background:var(--bg-soft);border:1px solid var(--border);border-radius:12px;padding:14px 18px;margin-bottom:20px;text-align:left}

body.page-dashboard .advisor-upgrade-feature {font-size:12.5px;color:var(--gray-dark);padding:5px 0;border-bottom:1px solid var(--border-lt)}

body.page-dashboard .advisor-upgrade-feature:last-child {border-bottom:none}

body.page-dashboard .advisor-upgrade-btn {width:100%;padding:13px;background:var(--pink);color:#fff;border:none;border-radius:10px;font-family:'DM Sans',sans-serif;font-size:14px;font-weight:700;cursor:pointer;margin-bottom:10px;transition:background .15s}

body.page-dashboard .advisor-upgrade-btn:hover {background:var(--pink-dark)}

body.page-dashboard .advisor-upgrade-note {font-size:11px;color:var(--gray-lt);margin:0}

.advisor-plan-card{border:2px solid var(--border);border-radius:12px;padding:14px 12px;text-align:center;cursor:pointer;transition:border-color .15s,background .15s;background:var(--bg-soft)}
.advisor-plan-card:hover{border-color:var(--pink-mid)}
.advisor-plan-card.advisor-plan-selected{border-color:var(--pink);background:var(--pink-pale)}

/* ══════════════════════════════════════════════════════════
   INDEX PAGE STYLES
   ══════════════════════════════════════════════════════════ */


body.page-login :root {
  --pink: #e8336d;
  --pink-dark: #c4215a;
  --pink-pale: #fef0f5;
  --black: #111111;
  --gray-dark: #333333;
  --gray: #666666;
  --gray-lt: #999999;
  --border: #e8e8e8;
  --bg: #ffffff;
  --bg-soft: #f8f8f8;
}

body.page-login *, body.page-login *::before, body.page-login *::after { box-sizing: border-box; margin: 0; padding: 0; }

body.page-login html, body.page-login body {
  height: 100%;
  font-family: 'DM Sans', sans-serif;
  background: var(--bg);
  color: var(--black);
  -webkit-font-smoothing: antialiased;
  overflow: hidden;
}


body.page-login /* PAGE TRANSITIONS */
.page {
  position: fixed; inset: 0;
  display: flex; flex-direction: column;
  transition: opacity .38s ease, transform .38s ease;
}

body.page-login .page.hidden { opacity: 0; pointer-events: none; transform: translateY(14px); }

body.page-login .page.exiting { opacity: 0; transform: translateY(-14px); pointer-events: none; }


body.page-login /* BODY */
.page-body {
  flex: 1; display: flex; align-items: center; justify-content: center; padding: 40px 24px;
}

body.page-login .page-center {
  width: 100%; max-width: 480px; text-align: center;
  animation: riseIn .55s cubic-bezier(.16,1,.3,1) both;
}

@keyframes riseIn {
  from {opacity:0;transform:translateY(22px)}
  to   {opacity:1;transform:translateY(0)}
}


body.page-login .wordmark { margin-bottom: 8px; }

body.page-login .wordmark img { height: 56px; width: auto; }

body.page-login .tagline {
  font-size: 11.5px; font-weight: 600; color: var(--gray-lt);
  letter-spacing: .1em; text-transform: uppercase; margin-bottom: 36px;
}


body.page-login /* CARD */
.auth-card {
  background: var(--bg); border: 1.5px solid var(--border); border-radius: 20px;
  padding: 38px 42px; text-align: left; box-shadow: 0 4px 32px rgba(0,0,0,.06);
}

body.page-login .card-title { font-size: 21px; font-weight: 700; color: var(--black); margin-bottom: 8px; letter-spacing: -.02em; line-height: 1.2; }

body.page-login .card-desc { font-size: 14px; color: var(--gray); line-height: 1.6; margin-bottom: 26px; }


body.page-login /* FIELD */
.field-wrap { margin-bottom: 14px; }

body.page-login .field-label { display: block; font-size: 11px; font-weight: 700; color: var(--gray-dark); letter-spacing: .07em; text-transform: uppercase; margin-bottom: 7px; }

body.page-login .field-input {
  width: 100%; padding: 13px 16px; border: 1.5px solid var(--border); border-radius: 12px;
  font-family: 'DM Sans', sans-serif; font-size: 15px; color: var(--black);
  background: var(--bg); outline: none; transition: border .15s, box-shadow .15s;
}

body.page-login .field-input:focus { border-color: var(--pink); box-shadow: 0 0 0 4px rgba(232,51,109,.10); }

body.page-login .field-input.error { border-color: #e33; }

body.page-login .field-input::placeholder { color: #bbb; }


body.page-login /* STATUS */
.status-msg { display: none; font-size: 13px; padding: 10px 14px; border-radius: 10px; margin-bottom: 14px; font-weight: 500; align-items: center; gap: 8px; }

body.page-login .status-msg.show { display: flex; }

body.page-login .status-msg.error { background: #fff0f3; color: #c0143c; border: 1px solid #ffc0cf; }

body.page-login .status-msg.success { background: #f0faf4; color: #1a7a42; border: 1px solid #b0ddc0; }


body.page-login /* BUTTON */
.btn-pill {
  width: 100%; padding: 14px 24px; background: var(--pink); color: #fff; border: none;
  border-radius: 100px; font-family: 'DM Sans', sans-serif; font-size: 15px; font-weight: 600;
  cursor: pointer; transition: all .15s; margin-top: 4px; position: relative; letter-spacing: .01em;
}

body.page-login .btn-pill:hover:not(:disabled) { background: var(--pink-dark); transform: translateY(-1px); box-shadow: 0 6px 20px rgba(232,51,109,.30); }

body.page-login .btn-pill:disabled { opacity: .5; cursor: not-allowed; transform: none; box-shadow: none; }

body.page-login .btn-pill.loading { color: transparent; }

body.page-login .btn-pill.loading::after {
  content: ''; position: absolute; width: 18px; height: 18px;
  border: 2.5px solid rgba(255,255,255,.4); border-top-color: #fff;
  border-radius: 50%; animation: spin .65s linear infinite;
  top: 50%; left: 50%; transform: translate(-50%,-50%);
}

@keyframes spin {
  to { transform: translate(-50%,-50%) rotate(360deg); }
}


body.page-login .card-note { text-align: center; margin-top: 16px; font-size: 12px; color: var(--gray-lt); line-height: 1.6; }

body.page-login .card-note a { color: var(--pink); text-decoration: none; }

body.page-login .card-note a:hover { text-decoration: underline; }


body.page-login /* OTP DIGITS */
.otp-digits { display: flex; gap: 10px; justify-content: center; margin-bottom: 10px; }

body.page-login .otp-digit {
  width: 54px; height: 64px; border: 1.5px solid var(--border); border-radius: 14px;
  font-family: 'DM Sans', sans-serif; font-size: 28px; font-weight: 700; color: var(--black);
  background: var(--bg); text-align: center; outline: none; transition: all .15s; caret-color: var(--pink);
}

body.page-login .otp-digit:focus { border-color: var(--pink); box-shadow: 0 0 0 4px rgba(232,51,109,.10); transform: translateY(-2px); }

body.page-login .otp-digit.filled { border-color: var(--pink); background: var(--pink-pale); color: var(--pink-dark); }

body.page-login .otp-digit.digit-error { border-color: #e33; background: #fff0f0; animation: shake .35s ease; }

@keyframes shake {
  0%, 100% {transform:translateX(0)}
  20%      {transform:translateX(-6px)}
  40%      {transform:translateX(6px)}
  60%      {transform:translateX(-3px)}
  80%      {transform:translateX(3px)}
}


body.page-login /* EMAIL BADGE */
.email-badge {
  display: inline-flex; align-items: center; gap: 9px;
  padding: 9px 16px; background: var(--bg-soft); border: 1.5px solid var(--border);
  border-radius: 100px; margin-bottom: 24px;
}

body.page-login .email-badge-icon { width: 26px; height: 26px; background: var(--pink); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 12px; flex-shrink: 0; }

body.page-login .email-badge-addr { font-size: 13px; font-weight: 600; color: var(--black); }


body.page-login /* RESEND */
.resend-row { text-align: center; margin-top: 16px; }

body.page-login .timer-txt { font-size: 13px; color: var(--gray-lt); }

body.page-login .timer-num { font-weight: 700; color: var(--pink); }

body.page-login .btn-resend { background: none; border: none; font-family: 'DM Sans', sans-serif; font-size: 13px; font-weight: 600; color: var(--pink); cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }

body.page-login .btn-back-link { display: inline-flex; align-items: center; gap: 5px; font-size: 13px; color: var(--gray-lt); cursor: pointer; background: none; border: none; font-family: 'DM Sans', sans-serif; margin-top: 14px; transition: color .12s; }

body.page-login .btn-back-link:hover { color: var(--gray-dark); }


body.page-login /* FOOTER */
.site-footer { padding: 16px 36px; border-top: 1px solid var(--border); display: flex; align-items: center; justify-content: space-between; flex-shrink: 0; }

body.page-login .footer-brand { font-size: 12px; color: var(--gray-lt); }

body.page-login .footer-brand strong { color: var(--gray); }

body.page-login .footer-links { display: flex; gap: 20px; }

body.page-login .footer-links a { font-size: 12px; color: var(--gray-lt); text-decoration: none; transition: color .12s; }

body.page-login .footer-links a:hover { color: var(--pink); }


body.page-login /* DEV BANNER */
#devBanner { position: fixed; bottom: 16px; left: 50%; transform: translateX(-50%); background: var(--black); border-radius: 100px; padding: 8px 20px; font-size: 12px; font-weight: 600; color: rgba(255,255,255,.65); z-index: 1000; white-space: nowrap; display: none; }

body.page-login #devBanner span { color: var(--pink); }

/* ══════════════════════════════════════════════════════════
   SHARE PAGE STYLES
   ══════════════════════════════════════════════════════════ */

/* ══════════════════════════════════════════════════════════
   LATTICE PLANNER — White / Pink design system
   matching civiclattice.com
   ══════════════════════════════════════════════════════════ */
:root {
  --pink:       #e8336d;
  --pink-dark:  #c4215a;
  --pink-pale:  #fef0f5;
  --pink-mid:   #fbd6e4;
  --black:      #111111;
  --gray-dark:  #333333;
  --gray:       #555555;
  --gray-lt:    #999999;
  --gray-xlt:   #cccccc;
  --border:     #e8e8e8;
  --border-lt:  #f0f0f0;
  --bg:         #ffffff;
  --bg-soft:    #f8f8f8;
  --bg-mid:     #f2f2f2;
  --green:      #1a7a42;
  --green-pale: #f0faf4;
  --green-border:#b0ddc0;
  --red:        #c0143c;
  --red-pale:   #fff0f3;
  --red-border: #ffc0cf;
  --amber:      #b26a00;
  --sh-sm: 0 1px 4px rgba(0,0,0,.06);
  --sh-md: 0 4px 16px rgba(0,0,0,.08);
  --sh-lg: 0 4px 32px rgba(0,0,0,.10);
  --r: 8px; --r-lg: 14px;
}

*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%;font-family:'DM Sans',sans-serif;background:var(--bg-soft);color:var(--black);font-size:14px;-webkit-font-smoothing:antialiased}

/* ── TOPBAR ── */
body.page-share .topbar{position:fixed;top:0;left:0;right:0;z-index:200;height:56px;background:var(--bg);border-bottom:1px solid var(--border);display:flex;align-items:center;padding:0 22px;gap:12px;box-shadow:var(--sh-sm)}
.btn-back{display:flex;align-items:center;gap:6px;padding:7px 14px;border-radius:100px;font-size:12px;font-weight:500;cursor:pointer;transition:all .15s;border:1.5px solid var(--border);background:transparent;color:var(--gray-lt);font-family:'DM Sans',sans-serif;text-decoration:none}
.btn-back:hover{border-color:var(--pink);color:var(--pink)}
.tb-divider{width:1px;height:20px;background:var(--border)}
.brand-logo-img{height:22px;width:auto}
.brand-sub{font-size:10.5px;font-weight:600;color:var(--gray-lt);letter-spacing:.07em;text-transform:uppercase}
.topbar-spacer{flex:1}
#serverBadge{font-size:11px;font-weight:500;cursor:default;color:var(--gray-lt);letter-spacing:.02em}
.jurisdiction-pill{background:var(--bg-soft);border:1.5px solid var(--border);border-radius:100px;padding:6px 14px;color:var(--gray);font-size:12px;font-weight:500;cursor:pointer;transition:all .15s;white-space:nowrap}
.jurisdiction-pill:hover{border-color:var(--pink);color:var(--pink);background:var(--pink-pale)}
.progress-wrap{display:flex;align-items:center;gap:8px;color:var(--pink);font-size:11px;font-weight:600}
.progress-bar-mini{width:72px;height:3px;background:var(--border);border-radius:2px}
.progress-fill{height:100%;background:var(--pink);border-radius:2px;transition:width .4s ease}
.btn-tb{display:flex;align-items:center;gap:6px;padding:7px 16px;border-radius:100px;font-size:12px;font-weight:600;cursor:pointer;transition:all .15s;border:none;font-family:'DM Sans',sans-serif}
.btn-pdf{background:var(--bg-soft);color:var(--gray);border:1.5px solid var(--border)}.btn-pdf:hover{border-color:var(--gray);color:var(--black)}
.btn-docx{background:var(--pink);color:#fff}.btn-docx:hover{background:var(--pink-dark);transform:translateY(-1px);box-shadow:0 4px 12px rgba(232,51,109,.3)}
.btn-docx:disabled{opacity:.5;cursor:not-allowed;transform:none;box-shadow:none}
.btn-share{background:var(--bg-soft);color:var(--gray);border:1.5px solid var(--border)}.btn-share:hover{border-color:var(--pink);color:var(--pink)}
.btn-advisor-upgrade{background:linear-gradient(135deg,#e8336d,#c4215a);color:#fff;border:none;padding:7px 16px;border-radius:100px;font-size:12px;font-weight:700;cursor:pointer;font-family:'DM Sans',sans-serif;display:flex;align-items:center;gap:6px;transition:all .15s;box-shadow:0 2px 8px rgba(232,51,109,.3)}
.btn-advisor-upgrade:hover{transform:translateY(-1px);box-shadow:0 4px 14px rgba(232,51,109,.4)}
.btn-advisor-badge{background:#1c3049;color:#fff;border:1.5px solid #2a4262;padding:7px 14px;border-radius:100px;font-size:11px;font-weight:600;font-family:'DM Sans',sans-serif;display:flex;align-items:center;gap:6px;cursor:default}
.btn-advisor-badge .badge-dot{width:7px;height:7px;border-radius:50%;background:#4caf50;display:inline-block;box-shadow:0 0 6px rgba(76,175,80,.6)}
.btn-advisor-trial{background:transparent;color:var(--gray);border:1.5px dashed var(--border);padding:7px 14px;border-radius:100px;font-size:11px;font-weight:600;font-family:'DM Sans',sans-serif;display:flex;align-items:center;gap:6px;cursor:pointer;transition:all .15s}.btn-advisor-trial:hover{border-color:var(--pink);color:var(--pink)}

/* ── LAYOUT ── */
.app-layout{display:flex;margin-top:56px;height:calc(100vh - 56px)}

/* ── SIDEBAR ── */
.sidebar{width:240px;flex-shrink:0;background:var(--bg);border-right:1px solid var(--border);overflow-y:auto;padding:12px 0;display:flex;flex-direction:column}
.sidebar::-webkit-scrollbar{width:3px}.sidebar::-webkit-scrollbar-thumb{background:var(--border);border-radius:2px}
/* ── Element toggle row ── */
.sidebar-item-row{display:flex;align-items:center;gap:0}
.el-toggle{flex-shrink:0;width:26px;height:26px;display:flex;align-items:center;justify-content:center;background:transparent;border:none;cursor:pointer;padding:0;margin-left:4px}
.el-toggle-knob{width:12px;height:12px;border-radius:50%;border:1.5px solid var(--gray-lt);background:transparent;transition:all .15s;flex-shrink:0}
.el-toggle.on .el-toggle-knob{background:var(--pink);border-color:var(--pink)}
/* Hidden element — faded text */
.sidebar-item.el-hidden{opacity:.35}
.sidebar-item.el-hidden .sidebar-code{color:var(--gray-lt)}

.sidebar-group-label{padding:10px 16px 4px;font-size:9.5px;font-weight:700;letter-spacing:.1em;color:var(--gray-xlt);text-transform:uppercase}
.sidebar-item{display:flex;align-items:center;gap:9px;padding:8px 14px;cursor:pointer;transition:all .12s;color:var(--gray-lt);font-size:12px;font-weight:500;border-left:2px solid transparent;user-select:none}
.sidebar-item:hover{background:var(--bg-soft);color:var(--gray-dark)}
.sidebar-item.active{background:var(--pink-pale);color:var(--pink);border-left-color:var(--pink)}
.sidebar-code{font-family:'JetBrains Mono',monospace;font-size:9px;background:var(--bg-mid);padding:2px 5px;border-radius:4px;flex-shrink:0;color:var(--gray-lt)}
.sidebar-item.active .sidebar-code{background:var(--pink-mid);color:var(--pink-dark)}
.sidebar-dot{margin-left:auto;width:6px;height:6px;border-radius:50%;background:var(--border);flex-shrink:0}
.sidebar-dot.done{background:var(--green)}.sidebar-dot.partial{background:var(--amber)}

/* ── INPUT PANEL ── */
.input-panel{width:438px;flex-shrink:0;background:var(--bg);border-right:1px solid var(--border);overflow-y:auto;display:flex;flex-direction:column}
.input-panel::-webkit-scrollbar{width:4px}.input-panel::-webkit-scrollbar-thumb{background:var(--border);border-radius:2px}
.el-header{padding:20px 22px 14px;border-bottom:1px solid var(--border-lt);position:sticky;top:0;z-index:10;background:var(--bg)}
.el-badge{display:inline-flex;align-items:center;gap:6px;background:var(--pink);color:#fff;padding:3px 10px;border-radius:100px;font-size:10px;font-weight:700;letter-spacing:.05em;font-family:'JetBrains Mono',monospace;margin-bottom:8px}
.el-title{font-size:18px;font-weight:700;color:var(--black);line-height:1.2;margin-bottom:4px;letter-spacing:-.01em}
.el-desc{color:var(--gray-lt);font-size:12.5px;line-height:1.5}
.q-body{padding:16px 20px;display:flex;flex-direction:column;gap:6px}

/* ── PROLOGUE ACCORDION ── */
.prologue-accordion{margin:0 20px 6px;border:1.5px solid var(--border);border-radius:var(--r-lg);overflow:hidden;background:var(--bg)}
.prologue-trigger{display:flex;align-items:center;gap:10px;padding:12px 14px;cursor:pointer;user-select:none;transition:background .12s;background:var(--bg-soft)}
.prologue-trigger:hover{background:var(--pink-pale)}
.prologue-icon{font-size:12px;transition:transform .25s;color:var(--pink)}
.prologue-trigger.open .prologue-icon{transform:rotate(90deg)}
.prologue-label{font-size:13px;font-weight:600;color:var(--black);flex:1}
.prologue-sub{font-size:10.5px;color:var(--gray-lt)}
.prologue-body{display:none;padding:0 16px 16px;border-top:1px solid var(--border-lt);max-height:380px;overflow-y:auto}
.prologue-body.open{display:block}
.prologue-body::-webkit-scrollbar{width:3px}.prologue-body::-webkit-scrollbar-thumb{background:var(--border);border-radius:2px}
.prologue-section{margin-top:13px}
.prologue-section-title{font-size:10px;font-weight:700;color:var(--gray-lt);text-transform:uppercase;letter-spacing:.08em;margin-bottom:5px}
.prologue-text{font-size:12px;line-height:1.65;color:var(--gray)}
.prologue-text p{margin-bottom:7px}
.prologue-text ul{margin-left:15px;margin-bottom:7px}
.prologue-text li{margin-bottom:4px}
.prologue-locked{display:inline-flex;align-items:center;gap:5px;padding:3px 9px;background:var(--bg-mid);border-radius:100px;font-size:10px;color:var(--gray-lt);font-weight:600;letter-spacing:.04em}

/* ── QUESTION CARDS ── */
.q-group{margin-bottom:5px}
.q-card{background:var(--bg);border:1.5px solid var(--border);border-radius:var(--r-lg);overflow:visible;transition:box-shadow .15s,border-color .15s}
.q-card:hover{box-shadow:var(--sh-sm);border-color:var(--pink-mid)}
.q-header{padding:12px 14px;display:flex;align-items:flex-start;gap:10px}
.q-num{font-family:'JetBrains Mono',monospace;font-size:9px;color:var(--gray-lt);flex-shrink:0;margin-top:3px;min-width:22px;font-weight:600}
.q-content{flex:1;min-width:0}
.q-text{font-size:13px;font-weight:600;color:var(--black);line-height:1.5;margin-bottom:9px}
.q-hint{font-size:11.5px;color:var(--gray);line-height:1.4;margin-bottom:9px;padding:8px 11px;background:var(--pink-pale);border-radius:var(--r);border-left:2.5px solid var(--pink)}

/* ── POLICY PREVIEW CHIPS ── */
.policy-preview{margin-top:10px;display:flex;flex-direction:column;gap:4px}
.pp-section-label{font-size:9.5px;font-weight:700;color:var(--gray-lt);text-transform:uppercase;letter-spacing:.08em;margin-top:5px;margin-bottom:3px;padding-left:2px}
.pp-row{display:flex;align-items:center;gap:7px;padding:5px 9px;border-radius:6px;font-size:11px;cursor:default;transition:background .12s;position:relative}
.pp-row.on{background:var(--green-pale);border:1px solid var(--green-border);color:var(--green)}
.pp-row.off{background:var(--red-pale);border:1px solid var(--red-border);color:var(--red);text-decoration:line-through;opacity:.7}
.pp-dot{width:6px;height:6px;border-radius:50%;flex-shrink:0}
.pp-row.on .pp-dot{background:var(--green)}.pp-row.off .pp-dot{background:var(--red)}
.pp-code{font-family:'JetBrains Mono',monospace;font-size:9.5px;font-weight:600;letter-spacing:.03em;white-space:nowrap;flex-shrink:0}
.pp-text{flex:1;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:11px}
#lattice-tooltip{display:none;position:fixed;z-index:99999;background:var(--black);color:rgba(255,255,255,.9);font-size:10.5px;line-height:1.55;padding:9px 12px;border-radius:8px;max-width:260px;white-space:normal;box-shadow:0 6px 24px rgba(0,0,0,.2);pointer-events:none;font-family:'DM Sans',sans-serif}
#lattice-tooltip strong{color:var(--pink-mid);font-size:9.5px;display:block;margin-bottom:3px;text-transform:uppercase;letter-spacing:.06em;font-weight:700}
.pp-tooltip{display:none !important}

/* ── INPUTS ── */
.radio-group,.checkbox-group{display:flex;flex-direction:column;gap:5px}
.radio-opt,.checkbox-opt{display:flex;align-items:center;gap:9px;padding:9px 11px;border-radius:var(--r);border:1.5px solid var(--border);cursor:pointer;transition:all .12s;background:var(--bg-soft)}
.radio-opt:hover,.checkbox-opt:hover{background:var(--pink-pale);border-color:var(--pink-mid)}
.radio-opt.sel,.checkbox-opt.sel{background:var(--pink-pale);border-color:var(--pink)}
.radio-opt input,.checkbox-opt input{display:none}
.radio-dot{width:15px;height:15px;border-radius:50%;border:2px solid var(--border);display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .12s}
.radio-opt.sel .radio-dot{border-color:var(--pink)}
.radio-inner{width:7px;height:7px;border-radius:50%;background:var(--pink);display:none}
.radio-opt.sel .radio-inner{display:block}
.check-box{width:15px;height:15px;border-radius:4px;border:2px solid var(--border);display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .12s}
.checkbox-opt.sel .check-box{border-color:var(--pink);background:var(--pink)}
.check-mark{color:#fff;font-size:9px;display:none}.checkbox-opt.sel .check-mark{display:block}
.opt-label{font-size:13px;color:var(--black);font-weight:400}
select.q-sel{width:100%;padding:9px 12px;border:1.5px solid var(--border);border-radius:var(--r);font-family:'DM Sans',sans-serif;font-size:13px;color:var(--black);background:var(--bg);cursor:pointer;outline:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23999' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;padding-right:32px}
select.q-sel:focus{border-color:var(--pink);box-shadow:0 0 0 3px rgba(232,51,109,.10)}
input.q-inp,textarea.q-ta{width:100%;padding:9px 12px;border:1.5px solid var(--border);border-radius:var(--r);font-family:'DM Sans',sans-serif;font-size:13px;color:var(--black);background:var(--bg);outline:none;transition:border .12s}
input.q-inp:focus,textarea.q-ta:focus{border-color:var(--pink);box-shadow:0 0 0 3px rgba(232,51,109,.10)}
textarea.q-ta{resize:vertical;min-height:72px;line-height:1.5}

/* ── NESTED ── */
.nested-wrap{margin-top:8px;padding:0 14px 12px 32px;border-top:1px dashed var(--border);animation:slideDown .2s ease}
@keyframes slideDown{from{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}
.nested-tag{font-size:9.5px;font-weight:700;color:var(--gray-lt);text-transform:uppercase;letter-spacing:.08em;margin-bottom:7px;margin-top:10px}

/* ── CUSTOM ELEMENT BUILDER ── */
.custom-el-card{border:1.5px solid var(--border);border-radius:var(--r-lg);margin-bottom:12px;overflow:hidden}
.custom-el-card-header{background:#1a2535;color:#fff;padding:10px 14px;display:flex;align-items:center;gap:10px;font-family:'JetBrains Mono',monospace;font-size:12px}
.custom-el-title-badge{background:rgba(232,51,109,.25);color:var(--pink-mid);padding:2px 8px;border-radius:100px;font-size:10px;font-weight:700}
.custom-el-name{font-family:'DM Sans',sans-serif;font-size:13px;font-weight:600}
.btn-remove-el{margin-left:auto;background:rgba(255,255,255,.1);border:none;color:rgba(255,255,255,.5);cursor:pointer;padding:3px 9px;border-radius:100px;font-size:11px;transition:all .12s}
.btn-remove-el:hover{background:rgba(192,20,60,.4);color:#fff}
.custom-el-body{padding:14px;display:flex;flex-direction:column;gap:10px}
.custom-field-label{font-size:11px;font-weight:700;color:var(--gray-dark);margin-bottom:4px;display:block;letter-spacing:.04em;text-transform:uppercase}
.goal-card-body{padding:10px 12px;display:flex;flex-direction:column;gap:8px}
.btn-remove-row:hover{background:var(--red-pale)}
.btn-add-el{width:100%;padding:11px;border:1.5px dashed var(--border);border-radius:var(--r-lg);background:transparent;color:var(--gray-lt);font-size:12px;font-weight:600;cursor:pointer;transition:all .15s;font-family:'DM Sans',sans-serif;display:flex;align-items:center;justify-content:center;gap:7px}
.btn-add-el:hover{border-color:var(--pink);color:var(--pink);background:var(--pink-pale)}
.btn-primary-sm{padding:8px 18px;border-radius:100px;font-family:'DM Sans',sans-serif;font-size:12px;font-weight:600;cursor:pointer;transition:all .15s;border:none;background:var(--pink);color:#fff}
.btn-primary-sm:hover{background:var(--pink-dark)}
.btn-secondary-sm{padding:8px 18px;border-radius:100px;font-family:'DM Sans',sans-serif;font-size:12px;font-weight:500;cursor:pointer;transition:all .15s;background:transparent;color:var(--gray);border:1.5px solid var(--border)}
.btn-secondary-sm:hover{border-color:var(--pink);color:var(--pink)}

/* ── COMMON CODES STRIP ── */
.common-codes-strip{padding:8px 12px;background:var(--black);border-radius:var(--r);margin-bottom:6px;display:flex;align-items:center;flex-wrap:wrap;gap:6px}
.common-codes-label{font-size:9.5px;color:rgba(255,255,255,.35);text-transform:uppercase;letter-spacing:.08em;margin-right:2px}
.common-code-tag{font-family:'JetBrains Mono',monospace;font-size:9.5px;background:rgba(232,51,109,.2);color:var(--pink-mid);padding:2px 7px;border-radius:100px}

/* ── OUTPUT PANEL ── */
.output-panel{flex:1;overflow-y:auto;background:var(--bg);position:relative}
.output-panel::-webkit-scrollbar{width:5px}.output-panel::-webkit-scrollbar-thumb{background:var(--border);border-radius:2px}
.doc-wrap{max-width:780px;margin:0 auto;padding:44px 28px 100px}

/* ── DOCUMENT STYLES ── */
.doc-cover{text-align:center;padding:0;margin-bottom:52px;background:var(--bg)}
.doc-cover-bar{height:3px;background:var(--pink);width:100%}
.doc-cover-inner{padding:52px 40px 48px}
.doc-watermark{display:inline-block;font-family:'JetBrains Mono',monospace;font-size:9px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--gray-lt);border:1px solid var(--border);border-radius:100px;padding:3px 12px;margin-bottom:40px}
.doc-jurisdiction-name{font-family:'DM Serif Display',serif;font-size:48px;font-weight:400;color:var(--black);line-height:1.1;letter-spacing:-.02em;margin-bottom:6px}
.doc-jurisdiction-state{font-family:'DM Serif Display',serif;font-size:20px;font-weight:400;color:var(--gray-lt);font-style:italic;margin-bottom:24px}
.doc-cover-divider{display:flex;align-items:center;justify-content:center;gap:12px;margin-bottom:24px}
.doc-cover-divider-line{flex:1;max-width:80px;height:1px;background:var(--border)}
.doc-cover-divider-dot{width:5px;height:5px;border-radius:50%;background:var(--pink)}
.doc-plan-title{font-family:'DM Sans',sans-serif;font-size:11px;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--gray);margin-bottom:8px}
.doc-plan-year{font-family:'DM Serif Display',serif;font-size:15px;font-style:italic;color:var(--pink);margin-bottom:44px}
.doc-cover-footer{border-top:1px solid var(--border);padding-top:18px;display:flex;align-items:center;justify-content:center;gap:16px}
.doc-meta{font-size:10px;color:var(--gray-lt);letter-spacing:.04em;line-height:1.8}
.doc-meta strong{color:var(--gray);font-weight:600}

/* Prologue in output */
.doc-prologue{margin-bottom:44px}
.doc-prologue-header{background:#1a2d46;color:#fff;padding:16px 22px;border-radius:var(--r) var(--r) 0 0;display:flex;align-items:center;gap:12px;cursor:pointer;user-select:none;transition:background .15s}
.doc-prologue-header:hover{background:#1f3554}
.doc-prologue-tag{font-family:'JetBrains Mono',monospace;font-size:10px;background:rgba(232,51,109,.2);color:var(--pink-mid);padding:3px 8px;border-radius:100px;letter-spacing:.04em}
.doc-prologue-title{font-size:15px;font-weight:700;flex:1}
.doc-prologue-toggle{font-size:11px;color:rgba(255,255,255,.4);font-style:italic;margin-left:auto}
.doc-prologue-body{border:1.5px solid var(--border);border-top:none;border-radius:0 0 var(--r) var(--r);max-height:0;overflow:hidden;transition:max-height .4s ease}
.doc-prologue-body.open{max-height:3600px}
.doc-prologue-inner{padding:26px 30px;font-size:13px;line-height:1.75;color:var(--gray)}
.doc-prologue-inner h3{font-size:14px;color:var(--black);margin:18px 0 8px;padding-bottom:4px;border-bottom:1px solid var(--border-lt);font-weight:700}
.doc-prologue-inner p{margin-bottom:10px}
.doc-prologue-inner ul{margin-left:20px;margin-bottom:10px}
.doc-prologue-inner li{margin-bottom:5px}
.doc-readonly-badge{display:inline-flex;align-items:center;gap:5px;padding:3px 10px;background:var(--bg-mid);border-radius:100px;font-size:10px;color:var(--gray-lt);font-weight:600;letter-spacing:.05em;text-transform:uppercase;margin-bottom:14px}

/* Element sections */
.doc-element{margin-bottom:44px}
.doc-el-header{display:flex;align-items:center;gap:12px;padding:14px 22px;background:#1a2535;color:#fff;border-radius:var(--r) var(--r) 0 0}
.doc-el-header-toggle{cursor:pointer;user-select:none;transition:background .12s}
.doc-el-header-toggle:hover{background:#21303e}
.doc-el-chevron{margin-left:auto;font-size:10px;opacity:.5;flex-shrink:0;font-style:normal}
.doc-el-code{font-family:'JetBrains Mono',monospace;font-size:11px;background:rgba(232,51,109,.2);padding:3px 9px;border-radius:100px;color:var(--pink-mid)}
.doc-el-title{font-size:16px;font-weight:700;letter-spacing:.01em}
.doc-custom-tag{font-size:11px;font-weight:600;opacity:.5;letter-spacing:.04em;font-family:'DM Sans',sans-serif;vertical-align:middle}
.doc-el-body{border:1.5px solid var(--border);border-top:none;border-radius:0 0 var(--r) var(--r);padding:26px;overflow:hidden}

/* Exhibits */
.doc-exhibit{margin:18px 0;border-radius:var(--r);overflow:hidden;border:2px dashed var(--border)}
.doc-exhibit-placeholder{background:repeating-linear-gradient(45deg,var(--bg-soft),var(--bg-soft) 10px,var(--bg-mid) 10px,var(--bg-mid) 20px);padding:30px 24px;text-align:center}
.doc-exhibit-id{font-family:'JetBrains Mono',monospace;font-size:11px;font-weight:600;color:var(--pink);background:var(--pink-pale);padding:3px 10px;border-radius:100px;display:inline-block;margin-bottom:8px}
.doc-exhibit-name{font-size:13px;font-weight:700;color:var(--black);margin-bottom:4px}
.doc-exhibit-sub{font-size:11.5px;color:var(--gray-lt)}
.doc-exhibit img{width:100%;display:block}

/* Intro paragraph */
.doc-intro{font-size:13px;color:var(--gray);line-height:1.75;margin-bottom:24px;padding:14px 18px;background:var(--pink-pale);border-left:3px solid var(--pink);border-radius:0 var(--r) var(--r) 0;font-style:italic}

/* Goal */
.doc-goal{margin-bottom:24px}
.doc-goal-hd{display:flex;align-items:flex-start;gap:11px;margin-bottom:10px}
.doc-goal-badge{font-family:'JetBrains Mono',monospace;font-size:9.5px;background:var(--pink);color:#fff;padding:3px 9px;border-radius:100px;white-space:nowrap;flex-shrink:0;margin-top:3px;font-weight:600}
.doc-goal-text{font-family:'DM Serif Display',serif;font-size:15px;font-weight:400;color:var(--black);line-height:1.4;word-break:break-word;overflow-wrap:break-word;min-width:0;flex:1}
.doc-policies{margin-left:20px;display:flex;flex-direction:column;gap:7px;min-width:0;overflow:hidden}

/* Policy */
.doc-policy{display:flex;flex-direction:column;gap:4px;padding:10px 14px;border-radius:var(--r);border:1.5px solid var(--border);font-size:13px;background:var(--bg);transition:all .2s;overflow:hidden;min-width:0}
.doc-policy.triggered{border-color:var(--border)!important}
.doc-goal.triggered .doc-goal-text{color:var(--black)}
.doc-policy-custom{background:var(--bg)!important;border-color:var(--border)!important}
.doc-policy-custom.triggered{background:var(--bg)!important;border-color:var(--border)!important}
.doc-policy-top{display:flex;align-items:flex-start;gap:10px;min-width:0}
.doc-policy-code{font-family:'JetBrains Mono',monospace;font-size:9.5px;color:var(--gray-lt);white-space:nowrap;flex-shrink:0;margin-top:3px;min-width:54px}
.doc-policy.triggered .doc-policy-code{color:var(--pink)}
.doc-policy-text{line-height:1.6;color:var(--black);word-break:break-word;overflow-wrap:break-word;min-width:0;flex:1}

/* Actions */
.doc-actions{margin-left:16px;margin-top:6px;display:flex;flex-direction:column;gap:0}
.doc-action{display:flex;gap:8px;font-size:12px;color:var(--gray);padding:4px 8px;border-left:2px solid var(--border);min-width:0;overflow:visible;align-items:flex-start}
.doc-action-code{font-family:'JetBrains Mono',monospace;font-size:9.5px;color:var(--gray-lt);white-space:nowrap;flex-shrink:0;min-width:64px;padding-top:2px}
.doc-action-text{word-break:break-word;overflow-wrap:break-word;min-width:0;flex:1;line-height:1.6}
.doc-action-buttons{display:flex;align-items:center;gap:2px;flex-shrink:0;margin-left:auto;align-self:flex-start}

/* Placeholder */

/* ── ✦ Spark button — inline Lattice Spark trigger ─────── */
.spark-btn{
  width:20px;height:20px;border-radius:50%;
  border:1.5px solid var(--pink-mid,#f0a0bb);
  background:var(--pink-pale,#fff0f5);
  color:var(--pink);font-size:10px;font-weight:700;
  display:inline-flex;align-items:center;justify-content:center;
  cursor:pointer;flex-shrink:0;
  transition:all .15s;
  position:relative;
  line-height:1;
  vertical-align:middle;
  align-self:center;
  margin-top:0;
}
.spark-btn:hover{background:var(--pink);color:#fff;border-color:var(--pink);transform:scale(1.15)}
.spark-locked{border-color:var(--border);background:var(--bg-mid);color:var(--gray-xlt)}
.spark-locked:hover{background:#f0c842;color:#7a6000;border-color:#e0b020;transform:scale(1.15)}

/* doc-btn-row — wraps + button and spark button side by side */
.doc-btn-row{display:flex;align-items:center;gap:6px;margin-top:8px;flex-wrap:wrap}
.doc-btn-row>.doc-add-row{flex:0 0 100%;margin-top:6px}

/* ── Floating Advisor window ────────────────────────────── */
/* Advisor modal — shared inner bits only. The overlay/card/header/textarea/button
   are inline-styled in JS (agent.js, update-spark.js) to match Monitor's "Ask Spark"
   panel exactly; these reusable pieces (streamed result + post-generation actions +
   optional context line) stay in CSS. */
.advisor-win-context{font-size:12px;color:var(--gray-lt);line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.advisor-win-ctx-label{font-weight:700;color:var(--gray)}
.advisor-win-result{
  font-size:13px;color:var(--black);
  line-height:1.65;white-space:pre-wrap;
  font-family:'DM Sans',sans-serif;
}
.advisor-generating{color:var(--gray-lt);font-style:italic;font-size:12.5px}
.advisor-win-insert-row{
  display:flex;gap:6px;flex-wrap:wrap;align-items:center;
  padding-top:12px;margin-top:10px;
  border-top:1px solid var(--border);
}
.advisor-win-insert{
  padding:6px 14px;background:var(--pink);color:#fff;
  border:none;border-radius:100px;
  font-size:11.5px;font-weight:700;cursor:pointer;
  font-family:'DM Sans',sans-serif;transition:background .15s;
}
.advisor-win-insert:hover{background:var(--pink-dark,#c2185b)}
.advisor-win-copy,.advisor-win-regen{
  padding:6px 14px;background:transparent;color:var(--gray);
  border:1.5px solid var(--border);border-radius:100px;
  font-size:11.5px;font-weight:600;cursor:pointer;
  font-family:'DM Sans',sans-serif;transition:all .12s;
}
.advisor-win-copy:hover,.advisor-win-regen:hover{border-color:var(--pink);color:var(--pink)}
.advisor-win-discard{
  padding:6px 8px;background:transparent;color:var(--gray-lt);
  border:none;font-size:11.5px;cursor:pointer;
  font-family:'DM Sans',sans-serif;margin-left:auto;
}






/* Advisor window — planner dark mode overrides */
html[data-theme="dark"] .advisor-win { box-shadow:0 12px 48px rgba(0,0,0,.6),0 2px 8px rgba(0,0,0,.4); }
html[data-theme="dark"] .advisor-win-close { color:#999; }
html[data-theme="dark"] .advisor-win-close:hover { color:#fff; }
html[data-theme="dark"] .advisor-win-input { background:var(--bg-soft);color:var(--black); }
html[data-theme="dark"] .advisor-win-input::placeholder { color:var(--gray-lt); }
html[data-theme="dark"] .advisor-win-input:focus { background:#1f0d14; }
html[data-theme="dark"] .advisor-win-submit,
html[data-theme="dark"] .advisor-win-insert { background:var(--pink);color:#fff; }
html[data-theme="dark"] .advisor-win-submit:hover,
html[data-theme="dark"] .advisor-win-insert:hover { background:var(--pink-dark); }
html[data-theme="dark"] .advisor-win-submit:disabled { background:#444;color:#888;cursor:not-allowed; }
html[data-theme="dark"] .advisor-win-copy,
html[data-theme="dark"] .advisor-win-regen { color:var(--gray);border-color:var(--border); }
html[data-theme="dark"] .advisor-win-copy:hover,
html[data-theme="dark"] .advisor-win-regen:hover { color:var(--pink);border-color:var(--pink); }
html[data-theme="dark"] .advisor-win-discard { color:var(--gray-lt); }
html[data-theme="dark"] .advisor-win-hint { color:var(--gray-lt); }
html[data-theme="dark"] .advisor-win-ctx-label { color:var(--gray); }
html[data-theme="dark"] .advisor-win-result { color:var(--black); }
html[data-theme="dark"] .advisor-win-actions { background:var(--bg-mid); }
html[data-theme="dark"] .advisor-win-output { background:var(--bg-mid); }
html[data-theme="dark"] .toast-item { background:#2a2a2a;color:#fff;box-shadow:0 4px 24px rgba(0,0,0,.7); }
html[data-theme="dark"] .field-input::placeholder,
html[data-theme="dark"] input.q-inp::placeholder,
html[data-theme="dark"] textarea.q-ta::placeholder,
html[data-theme="dark"] .doc-inline-input::placeholder,
html[data-theme="dark"] .doc-add-input::placeholder,
html[data-theme="dark"] .impl-chip-input::placeholder { color:var(--gray-lt); }
html[data-theme="dark"] .toast { background:#2a2a2a;color:#fff;box-shadow:0 4px 24px rgba(0,0,0,.7); }
html[data-theme="dark"] .modal { background:var(--bg-soft);border-color:var(--border); }
html[data-theme="dark"] .modal-inp { background:var(--bg);color:var(--black);border-color:var(--border); }
html[data-theme="dark"] .modal-inp::placeholder { color:var(--gray-lt); }
html[data-theme="dark"] select.modal-inp { color:var(--black); }
/* ── Edit button on custom items ── */
.doc-item-edit{background:none;border:none;color:#ccc;font-size:12px;cursor:pointer;padding:2px 5px;line-height:1;margin-left:4px;opacity:1;transition:all .15s;border-radius:4px;flex-shrink:0;align-self:flex-start;margin-top:1px}
.doc-goal-hd:hover .doc-item-edit,
.doc-policy-top:hover .doc-item-edit,
.doc-action:hover .doc-item-edit,
.doc-action-custom:hover .doc-item-edit{color:#666}
.doc-item-edit:hover{color:var(--pink);background:var(--pink-pale)}

/* ── Upgrade modal ─────────────────────────────────────── */
.advisor-upgrade-overlay{
  position:fixed;inset:0;background:rgba(0,0,0,.5);
  backdrop-filter:blur(4px);z-index:9999;
  display:flex;align-items:center;justify-content:center;
  animation:fadeIn .15s ease;
}
.advisor-upgrade-box{
  background:var(--bg);border-radius:20px;padding:40px 44px;
  max-width:400px;width:90%;box-shadow:0 24px 64px rgba(0,0,0,.2);
  position:relative;text-align:center;
}
.advisor-upgrade-close{position:absolute;top:16px;right:18px;background:none;border:none;font-size:20px;color:#999;cursor:pointer}
.advisor-upgrade-icon{font-size:28px;margin-bottom:12px}
.advisor-upgrade-title{font-family:'DM Serif Display',serif;font-size:22px;color:var(--black);margin:0 0 8px;font-weight:400}
.advisor-upgrade-desc{font-size:13px;color:var(--gray);line-height:1.7;margin:0 0 20px}
.advisor-upgrade-features{background:var(--bg-soft);border:1px solid var(--border);border-radius:12px;padding:14px 18px;margin-bottom:20px;text-align:left}
.advisor-upgrade-feature{font-size:12.5px;color:var(--gray-dark);padding:5px 0;border-bottom:1px solid var(--border-lt)}
.advisor-upgrade-feature:last-child{border-bottom:none}
.advisor-upgrade-btn{width:100%;padding:13px;background:var(--pink);color:#fff;border:none;border-radius:10px;font-family:'DM Sans',sans-serif;font-size:14px;font-weight:700;cursor:pointer;margin-bottom:10px;transition:background .15s}
.advisor-upgrade-btn:hover{background:#c4215a}
.advisor-upgrade-note{font-size:11px;color:#aaa}

@keyframes fadeIn{from{opacity:0}to{opacity:1}}
.doc-placeholder{text-align:center;padding:22px;color:var(--gray-lt);font-size:12.5px;background:repeating-linear-gradient(45deg,transparent,transparent 10px,rgba(0,0,0,.012) 10px,rgba(0,0,0,.012) 20px);border:1.5px dashed var(--border);border-radius:var(--r);margin:14px 0}

/* ── Add buttons in output panel ── */
.doc-plus-btn{display:inline-flex;align-items:center;gap:4px;padding:4px 13px;background:#888;color:#fff;border:none;border-radius:100px;font-family:'DM Sans',sans-serif;font-size:10.5px;font-weight:600;cursor:pointer;transition:background .15s;white-space:nowrap;margin-top:0;align-self:center;width:auto}
.doc-plus-btn:hover{background:var(--pink)}
/* Inline input */
.doc-add-row{display:flex;flex-direction:column;gap:6px;margin:8px 0 4px;animation:docAddSlide .15s ease}
@keyframes docAddSlide{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}
.doc-add-input{width:100%;box-sizing:border-box;padding:8px 10px;border:1.5px solid var(--pink-mid,#f0a0bb);border-radius:var(--r);font-family:'DM Sans',sans-serif;font-size:12.5px;line-height:1.5;background:var(--bg);color:var(--black);outline:none;resize:vertical}
.doc-add-input:focus{border-color:var(--pink);box-shadow:0 0 0 3px var(--pink-pale,#fff0f5)}
.doc-add-btn-row{display:flex;align-items:center;gap:6px}
.doc-add-ok{width:26px;height:26px;border-radius:7px;border:none;background:var(--pink);color:#fff;font-size:13px;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.doc-add-ok:hover{background:#c4215a}
.doc-add-spark{width:26px;height:26px;border-radius:7px;border:1.5px solid var(--pink-mid,#f0a0bb);background:transparent;color:var(--pink);font-size:13px;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .12s}
.doc-add-spark:hover{background:var(--pink);color:#fff;border-color:var(--pink)}
.doc-add-spark img{filter:none}
.doc-add-cancel{width:26px;height:26px;border-radius:7px;border:1.5px solid var(--border);background:transparent;color:var(--gray-lt);font-size:12px;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.doc-add-cancel:hover{border-color:var(--red);color:var(--red)}
/* Custom items */
/* custom items look identical to system — no special styling */
.doc-item-del{flex-shrink:0;margin-left:4px;width:18px;height:18px;border:none;background:transparent;color:#ccc;font-size:10px;cursor:pointer;border-radius:4px;display:flex;align-items:center;justify-content:center;transition:all .12s;align-self:flex-start;margin-top:1px}
.doc-goal:hover .doc-item-del,.doc-policy:hover .doc-item-del,.doc-action:hover .doc-item-del,.doc-action-custom:hover .doc-item-del{color:#999}
.doc-item-del:hover{background:#ffe8ec;color:var(--red)!important}

/* ── MODAL ── */
.modal-overlay-inner{position:fixed;inset:0;z-index:500;background:rgba(0,0,0,.4);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;animation:fadeIn .15s ease}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
.modal{background:var(--bg);border-radius:var(--r-lg);padding:32px;width:480px;box-shadow:var(--sh-lg);border:1.5px solid var(--border)}
.modal-title-inner{font-size:20px;font-weight:700;color:var(--black);margin-bottom:5px;letter-spacing:-.02em}
.modal-sub{font-size:13px;color:var(--gray);margin-bottom:22px;line-height:1.6}
.modal-field{margin-bottom:14px}
.modal-label{font-size:11px;font-weight:700;color:var(--gray-dark);margin-bottom:6px;display:block;letter-spacing:.06em;text-transform:uppercase}
.modal-inp{width:100%;padding:11px 14px;border:1.5px solid var(--border);border-radius:var(--r);font-family:'DM Sans',sans-serif;font-size:14px;outline:none;color:var(--black)}
.modal-inp:focus{border-color:var(--pink);box-shadow:0 0 0 3px rgba(232,51,109,.10)}
.modal-actions-inner{display:flex;gap:10px;justify-content:flex-end;margin-top:22px}

/* ── TOAST ── */
.toast-wrap{position:fixed;bottom:22px;right:22px;z-index:1000;display:flex;flex-direction:column;gap:8px}
.toast-item{background:var(--black);color:#fff;padding:11px 18px;border-radius:100px;font-size:13px;font-weight:500;box-shadow:var(--sh-lg);display:flex;align-items:center;gap:9px;animation:toastIn .25s ease;border-left:3px solid var(--pink)}
@keyframes toastIn{from{transform:translateX(20px);opacity:0}to{transform:translateX(0);opacity:1}}

/* ── PRINT ── */
@media print{
  .topbar,.sidebar,.input-panel,.toast-wrap{display:none!important}
  .output-panel{overflow:visible}.app-layout{margin-top:0;height:auto}
  .doc-wrap{padding:20px 40px;max-width:100%}
  .doc-el-header,.doc-prologue-header{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .doc-prologue-body{max-height:none!important;overflow:visible!important}
}

/* ── User icon pill + dropdown ───────────────────────── */
.user-pill{position:relative;display:flex;align-items:center;cursor:pointer;user-select:none}
.user-avatar{width:32px;height:32px;border-radius:50%;background:var(--pink);color:#fff;font-size:13px;font-weight:700;display:flex;align-items:center;justify-content:center;border:2px solid transparent;transition:border-color .15s}
.user-pill:hover .user-avatar{border-color:rgba(232,51,109,.5)}
.user-dropdown{position:absolute;top:calc(100% + 8px);right:0;background:var(--bg);border:1.5px solid var(--border);border-radius:12px;box-shadow:0 8px 24px rgba(0,0,0,.12);min-width:220px;padding:6px;z-index:999;display:none;flex-direction:column;gap:2px}
.user-dropdown.open{display:flex}
.user-dropdown-email{font-size:11px;color:var(--gray);padding:6px 10px 8px;border-bottom:1px solid var(--border);margin-bottom:4px;word-break:break-all}
.user-dropdown-item{display:flex;align-items:center;gap:8px;padding:7px 10px;border-radius:8px;font-size:12px;font-weight:500;cursor:pointer;transition:background .12s;border:none;background:none;width:100%;text-align:left;font-family:'DM Sans',sans-serif;color:var(--black)}
.user-dropdown-item:hover{background:var(--bg-soft)}
.user-dropdown-item.danger{color:#e8336d}
.user-dropdown-item.danger:hover{background:#fff0f0}
.credits-box{margin:4px 4px 6px;padding:10px 14px;background:var(--bg-soft);border-radius:10px;border:1px solid var(--border)}
.credits-box-title{font-size:10px;font-weight:700;color:var(--gray-lt);text-transform:uppercase;letter-spacing:.07em;margin-bottom:8px}
.credits-box-bar{height:3px;background:var(--border);border-radius:3px;overflow:hidden;margin-bottom:7px}
.credits-box-bar>div{height:100%;width:0%;border-radius:3px;transition:width .4s ease;background:var(--pink)}
.credits-box-footer{display:flex;align-items:center;justify-content:space-between}
.credits-box-pct{font-size:11px;font-weight:600;color:var(--black)}
.credits-box-footer #creditsResetLabel{font-size:11px;color:var(--gray-lt)}

/* ── Share modal ─────────────────────────────────────── */
.share-overlay{position:fixed;inset:0;background:rgba(0,0,0,.5);backdrop-filter:blur(4px);z-index:9999;display:flex;align-items:center;justify-content:center}
.share-box{background:var(--bg);border-radius:20px;padding:36px 40px;max-width:460px;width:90%;box-shadow:0 24px 64px rgba(0,0,0,.2);position:relative}
.share-title{font-family:'DM Serif Display',serif;font-size:20px;color:var(--black);margin:0 0 6px;font-weight:400}
.share-desc{font-size:13px;color:var(--gray);line-height:1.6;margin:0 0 20px}
.share-link-row{display:flex;gap:8px;margin-bottom:16px}
.share-link-input{flex:1;padding:10px 14px;border:1.5px solid var(--border);border-radius:10px;font-size:12px;color:var(--black);font-family:'DM Sans',sans-serif;outline:none;background:var(--bg-soft)}
.share-copy-btn{padding:10px 16px;background:var(--pink);color:#fff;border:none;border-radius:10px;font-size:12px;font-weight:700;cursor:pointer;white-space:nowrap;transition:background .15s}
.share-copy-btn:hover{background:var(--pink-dark)}
.share-revoke-btn{width:100%;padding:10px;background:none;border:1.5px solid var(--border);border-radius:10px;font-size:13px;color:var(--gray-lt);cursor:pointer;font-family:'DM Sans',sans-serif;transition:all .15s}
.share-revoke-btn:hover{border-color:#e33;color:#e33}
.share-close{position:absolute;top:16px;right:18px;background:none;border:none;font-size:20px;color:var(--gray-lt);cursor:pointer}


/* ── Share page overrides ── */
body{overflow:auto!important;height:auto!important}
.share-topbar{position:sticky;top:0;z-index:100;background:var(--bg);border-bottom:1.5px solid var(--border);padding:0 28px;height:54px;display:flex;align-items:center;justify-content:space-between}
.share-topbar-left{display:flex;align-items:center;gap:12px}
.tb-logo{font-family:'DM Serif Display',serif;font-size:20px;color:var(--pink);letter-spacing:.02em;text-decoration:none}
.tb-badge{font-size:11px;font-weight:600;color:var(--gray-lt);letter-spacing:.06em;text-transform:uppercase;background:var(--bg-soft);border:1px solid var(--border);border-radius:20px;padding:3px 10px}
.tb-plan{font-size:13px;color:var(--gray);font-weight:500}
.tb-cta{font-size:13px;color:var(--pink);text-decoration:none;font-weight:600}
.share-body{max-width:900px;margin:0 auto;padding:32px 24px 80px}
.error-box{text-align:center;padding:60px;color:#c0143c;background:#fff0f3;border-radius:16px;border:1px solid #ffc0cf;font-size:14px;margin-top:40px}
.doc-order-btns,.btn-add-el{display:none!important}


/* ══════════════════════════════════════════════════════════
   ADMIN PAGE STYLES
   ══════════════════════════════════════════════════════════ */


body.page-admin * {box-sizing:border-box;margin:0;padding:0}

body.page-admin body {background:var(--bg-soft);font-family:"DM Sans",sans-serif;color:var(--black)}

body.page-admin .topbar {background:var(--bg);border-bottom:1.5px solid var(--border);padding:0 32px;height:56px;display:flex;align-items:center;gap:16px;position:sticky;top:0;z-index:100}

body.page-admin .topbar-badge {background:var(--pink);color:#fff;font-size:10px;font-weight:700;padding:2px 10px;border-radius:100px;text-transform:uppercase;letter-spacing:.06em}

body.page-admin .topbar-spacer {flex:1}

body.page-admin .topbar-email {font-size:12px;color:var(--gray-lt)}

body.page-admin .topbar-btn {background:none;border:1.5px solid var(--border);border-radius:100px;padding:6px 16px;font-size:12px;font-weight:600;cursor:pointer;color:var(--gray);font-family:"DM Sans",sans-serif;transition:all .15s}

body.page-admin .topbar-btn:hover {border-color:var(--pink);color:var(--pink)}

body.page-admin .topbar-btn.danger {color:var(--red);border-color:var(--red-border)}

body.page-admin .page {max-width:1400px;margin:0 auto;padding:32px 24px}

body.page-admin .stats-grid {display:grid;grid-template-columns:repeat(6,1fr);gap:12px;margin-bottom:24px}

body.page-admin .stat-card {background:var(--bg);border:1.5px solid var(--border);border-radius:14px;padding:16px 18px}

body.page-admin .stat-label {font-size:10px;font-weight:700;color:var(--gray-lt);text-transform:uppercase;letter-spacing:.06em;margin-bottom:6px}

body.page-admin .stat-value {font-size:26px;font-weight:700;color:var(--black);line-height:1}

body.page-admin .stat-sub {font-size:10px;color:var(--gray-lt);margin-top:4px}

body.page-admin .stat-cost-bar {height:4px;background:var(--border);border-radius:2px;margin-top:8px;overflow:hidden}

body.page-admin .stat-cost-fill {height:100%;border-radius:2px;background:var(--pink);transition:width .4s ease}


body.page-admin /* ── Tabs ── */
.tabs {display:flex;gap:4px;background:var(--bg);border:1.5px solid var(--border);border-radius:12px;padding:4px;margin-bottom:24px;width:fit-content}

body.page-admin .tab-btn {padding:8px 20px;border-radius:8px;font-size:13px;font-weight:600;cursor:pointer;color:var(--gray-lt);border:none;background:transparent;font-family:"DM Sans",sans-serif;transition:all .15s}

body.page-admin .tab-btn.active {background:var(--pink);color:#fff}

body.page-admin .tab-content {display:none}

body.page-admin .tab-content.active {display:block}


body.page-admin /* ── Shared section styles ── */
.section {background:var(--bg);border:1.5px solid var(--border);border-radius:16px;margin-bottom:24px;overflow:hidden}

body.page-admin .section-hdr {padding:16px 24px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:12px}

body.page-admin .section-title {font-size:14px;font-weight:700;color:var(--black)}

body.page-admin .section-count {font-size:11px;color:var(--gray-lt);background:var(--bg-soft);padding:2px 8px;border-radius:100px}

body.page-admin .search {border:1.5px solid var(--border);border-radius:100px;padding:6px 14px;font-size:12px;font-family:"DM Sans",sans-serif;color:var(--black);background:var(--bg);outline:none;width:220px;transition:border-color .15s;margin-left:auto}

body.page-admin .search:focus {border-color:var(--pink)}

body.page-admin table {width:100%;border-collapse:collapse}

body.page-admin th {font-size:10px;font-weight:700;color:var(--gray-lt);text-transform:uppercase;letter-spacing:.06em;padding:9px 10px;text-align:left;background:var(--bg-soft);border-bottom:1px solid var(--border)}
body.page-admin th.th-sort {cursor:pointer;user-select:none;white-space:nowrap;transition:color .12s}
body.page-admin th.th-sort:hover {color:var(--pink)}
body.page-admin th.th-sort .sort-icon {display:inline-block;margin-left:5px;opacity:.3;font-size:9px;font-style:normal;width:10px;text-align:center;vertical-align:middle}
body.page-admin th.th-sort.asc .sort-icon,body.page-admin th.th-sort.desc .sort-icon {opacity:1;color:var(--pink)}

body.page-admin td {font-size:12px;padding:9px 10px;border-bottom:1px solid var(--border-lt);color:var(--black);vertical-align:middle}

body.page-admin .user-row {cursor:pointer}

body.page-admin .user-row:hover td {background:var(--bg-soft)}

body.page-admin .plans-row td {padding:0;border-bottom:1px solid var(--border)}

body.page-admin .plans-inner {padding:8px 16px 12px 40px;background:var(--bg-soft);display:none}

body.page-admin .plans-row.open .plans-inner {display:block}

body.page-admin .plan-item {display:flex;align-items:center;gap:12px;padding:8px 12px;border-radius:8px;font-size:12px;margin-bottom:4px;background:var(--bg);border:1px solid var(--border)}

body.page-admin .plan-item:last-child {margin-bottom:0}

body.page-admin .plan-name {font-weight:600;flex:1;color:var(--black)}

body.page-admin .plan-id {font-size:10px;color:var(--gray-lt);font-family:"JetBrains Mono",monospace}

body.page-admin .plan-meta {color:var(--gray-lt);font-size:11px;min-width:60px}

body.page-admin .progress-bar {height:5px;background:var(--border);border-radius:3px;overflow:hidden;width:70px;display:inline-block;vertical-align:middle;margin-right:5px}

body.page-admin .progress-fill {height:100%;background:var(--pink);border-radius:3px}

body.page-admin .pill {display:inline-block;font-size:10px;font-weight:700;padding:2px 8px;border-radius:100px}

body.page-admin .pill-pink {background:var(--pink-pale);color:var(--pink)}

body.page-admin .pill-gray {background:var(--bg-mid);color:var(--gray)}

body.page-admin .credit-bar {height:4px;background:var(--border);border-radius:2px;overflow:hidden;width:55px;display:inline-block;vertical-align:middle;margin-right:5px}

body.page-admin .credit-fill {height:100%;border-radius:2px}

body.page-admin .action-btn {background:none;border:1px solid var(--border);border-radius:8px;padding:5px 10px;font-size:11px;font-weight:600;cursor:pointer;color:var(--gray);font-family:"DM Sans",sans-serif;transition:all .12s;margin-right:4px}

body.page-admin .action-btn:hover {border-color:var(--pink);color:var(--pink)}

body.page-admin .action-btn.danger:hover {border-color:var(--red);color:var(--red)}

body.page-admin .credit-editor {display:flex;align-items:center;gap:5px}

body.page-admin .action-btn-icon {background:none;border:1px solid var(--border);border-radius:6px;width:26px;height:26px;display:inline-flex;align-items:center;justify-content:center;font-size:13px;cursor:pointer;color:var(--gray);font-family:"DM Sans",sans-serif;transition:all .12s;flex-shrink:0}
body.page-admin .action-btn-icon:hover {border-color:var(--pink);color:var(--pink)}
body.page-admin .action-btn-icon.danger:hover {border-color:#e53e3e;color:#e53e3e}
body.page-admin .credit-inp {border:1.5px solid var(--border);border-radius:8px;padding:4px 6px;font-size:12px;font-family:"DM Sans",sans-serif;width:62px;color:var(--black);background:var(--bg);outline:none}
body.page-admin .credit-inp:focus {border-color:var(--pink)}

body.page-admin .chevron {font-size:9px;color:var(--gray-lt);margin-left:4px;display:inline-block;transition:transform .2s}

body.page-admin .chevron.open {transform:rotate(90deg)}

body.page-admin .no-plans {font-size:11px;color:var(--gray-lt);padding:8px 0}


body.page-admin /* ── Library tab ── */
.lib-layout {display:grid;grid-template-columns:340px 1fr;gap:24px;align-items:start}

body.page-admin .lib-upload {background:var(--bg);border:1.5px solid var(--border);border-radius:16px;padding:24px;position:sticky;top:80px}

body.page-admin .lib-upload h3 {font-size:13px;font-weight:700;margin-bottom:16px;color:var(--black)}

body.page-admin .form-group {margin-bottom:14px}

body.page-admin .form-group label {display:block;font-size:11px;font-weight:700;color:var(--gray-lt);text-transform:uppercase;letter-spacing:.05em;margin-bottom:5px}

body.page-admin .form-group input, body.page-admin .form-group select {width:100%;background:var(--bg-soft);border:1.5px solid var(--border);border-radius:8px;color:var(--black);font-family:"DM Sans",sans-serif;font-size:13px;padding:8px 12px;outline:none;transition:border-color .2s}

body.page-admin .form-group input:focus, body.page-admin .form-group select:focus {border-color:var(--pink)}

body.page-admin .drop-zone {border:2px dashed var(--border);border-radius:10px;padding:28px 16px;text-align:center;cursor:pointer;transition:all .2s;margin-bottom:14px}

body.page-admin .drop-zone:hover, body.page-admin .drop-zone.drag-over {border-color:var(--pink);background:var(--pink-pale)}

body.page-admin .drop-zone .dz-icon {font-size:28px;margin-bottom:6px}

body.page-admin .drop-zone .dz-label {font-size:12px;color:var(--gray-lt)}

body.page-admin .drop-zone .dz-label strong {color:var(--pink)}

body.page-admin .drop-zone .dz-file {font-size:11px;color:#1a7a42;margin-top:6px;display:none}

body.page-admin #libFileInput {display:none}

body.page-admin .upload-btn {width:100%;padding:11px;border-radius:8px;border:none;font-family:"DM Sans",sans-serif;font-size:13px;font-weight:700;cursor:pointer;background:var(--pink);color:#fff;transition:opacity .2s}

body.page-admin .upload-btn:disabled {opacity:.45;cursor:not-allowed}

body.page-admin .upload-btn:hover:not(:disabled) {opacity:.85}

body.page-admin .lib-progress {height:4px;background:var(--border);border-radius:2px;margin-top:10px;overflow:hidden;display:none}

body.page-admin .lib-progress-fill {height:100%;background:var(--pink);width:0%;transition:width .3s;border-radius:2px}

body.page-admin .lib-status {font-size:11px;margin-top:8px;color:var(--gray-lt);min-height:16px;text-align:center}

body.page-admin .lib-status.ok {color:#1a7a42}

body.page-admin .lib-status.err {color:var(--red)}


body.page-admin .lib-files {background:var(--bg);border:1.5px solid var(--border);border-radius:16px;overflow:hidden}

body.page-admin .lib-files-hdr {padding:14px 20px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:10px}

body.page-admin .lib-files-hdr h3 {font-size:13px;font-weight:700;color:var(--black);flex:1}

body.page-admin .lib-file-row {display:grid;grid-template-columns:1fr auto auto auto;align-items:center;gap:16px;padding:12px 20px;border-bottom:1px solid var(--border-lt);transition:background .15s}

body.page-admin .lib-file-row:hover {background:var(--bg-soft)}

body.page-admin .lib-file-row:last-child {border-bottom:none}

body.page-admin .lib-file-name {font-size:13px;font-weight:600;color:var(--black)}

body.page-admin .lib-file-meta {font-size:11px;color:var(--gray-lt);margin-top:2px}

body.page-admin .lib-file-count {font-size:11px;font-weight:700;color:var(--pink);background:var(--pink-pale);padding:2px 8px;border-radius:100px;white-space:nowrap}

body.page-admin .lib-file-date {font-size:11px;color:var(--gray-lt);white-space:nowrap}

body.page-admin .lib-empty {padding:48px;text-align:center;color:var(--gray-lt);font-size:13px}

body.page-admin .lib-empty .lib-empty-icon {font-size:36px;margin-bottom:10px}

body.page-admin .lib-stats {display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:24px}

body.page-admin .lib-stat {background:var(--bg);border:1.5px solid var(--border);border-radius:12px;padding:16px 20px}

body.page-admin .lib-stat .num {font-size:26px;font-weight:700;color:var(--pink)}

body.page-admin .lib-stat .lbl {font-size:10px;font-weight:700;color:var(--gray-lt);text-transform:uppercase;letter-spacing:.06em;margin-top:4px}


body.page-admin .toast {position:fixed;bottom:24px;right:24px;background:#222;border:1px solid #333;color:#eee;padding:12px 18px;border-radius:10px;font-size:13px;opacity:0;transition:opacity .3s;z-index:9999;pointer-events:none}

body.page-admin .toast.show {opacity:1}

body.page-admin .toast.ok {border-color:#1a7a42}

body.page-admin .toast.err {border-color:var(--red)}

body.page-admin .role-badge {display:inline-block;font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;padding:2px 7px;border-radius:100px;margin-left:5px;vertical-align:middle}
body.page-admin .role-badge.admin {background:#e8f4fd;color:#1a6a9a;border:1px solid #b3d9f2}
body.page-admin .role-badge.superadmin {background:#fde8f0;color:#a31445;border:1px solid #f2b3cc}
body.page-admin .role-badge.monitor {background:#e8f5e9;color:#2e7d32;border:1px solid #a5d6a7}
body.page-admin .rb-badge {display:inline-flex;align-items:center;justify-content:center;min-width:16px;height:16px;padding:0 4px;border-radius:100px;background:#e53e3e;color:#fff;font-size:10px;font-weight:700;margin-left:5px;vertical-align:middle}

/* ── Plan status badges ───────────────────────────────── */
body.page-admin .plan-status-badge {display:inline-flex;align-items:center;gap:3px;font-size:10px;font-weight:700;letter-spacing:.04em;padding:3px 8px;border-radius:100px;white-space:nowrap}
body.page-admin .plan-free     {background:var(--bg-mid);color:var(--gray-lt);border:1px solid var(--border)}
body.page-admin .plan-paid     {background:#dcfce7;color:#166534;border:1px solid #86efac}
body.page-admin .plan-beta     {background:#ede9fe;color:#6c63ff;border:1px solid #c4b5fd}
body.page-admin .plan-trial    {background:#dbeafe;color:#1e40af;border:1px solid #93c5fd}
body.page-admin .plan-pastdue  {background:#fef9c3;color:#854d0e;border:1px solid #fde047}
body.page-admin .plan-canceled {background:#fee2e2;color:#991b1b;border:1px solid #fca5a5}

/* ── Beta bypass action button ───────────────────────── */
body.page-admin .action-btn-bypass {display:inline-flex;align-items:center;gap:3px;padding:3px 7px;border-radius:6px;font-family:'DM Sans',sans-serif;font-size:11px;font-weight:600;cursor:pointer;border:1.5px solid;white-space:nowrap;transition:all .12s;line-height:1.4}
body.page-admin .action-btn-bypass.grant {background:#f5f0ff;color:#6c63ff;border-color:#c4b5fd}
body.page-admin .action-btn-bypass.grant:hover {background:#6c63ff;color:#fff;border-color:#6c63ff}
body.page-admin .action-btn-bypass.revoke {background:#fff0f4;color:#a31445;border-color:#f2b3cc}
body.page-admin .action-btn-bypass.revoke:hover {background:#a31445;color:#fff;border-color:#a31445}
body.page-admin .action-btn-bypass-locked {font-size:10px;color:var(--gray-lt);white-space:nowrap}

/* Sidebar code pill — on/off toggle */
.el-abbr-toggle{cursor:pointer;transition:all .15s}
.el-abbr-toggle:hover{opacity:0.75;transform:scale(1.08)}
.sidebar-item.el-hidden .el-abbr-toggle{background:transparent!important;color:var(--gray-lt)!important;border:1.5px solid var(--gray-lt)!important}
.sidebar-item:not(.el-hidden) .el-abbr-toggle{background:var(--pink)!important;color:#fff!important;border-color:var(--pink)!important}

/* Source color — AI generated = pink text, user written = blue text */
.doc-text-ai { color: var(--pink) !important; }
.doc-text-user { color: #2563eb !important; }
.doc-goal-text.doc-text-ai { color: var(--pink) !important; }
.doc-goal-text.doc-text-user { color: #2563eb !important; }
.doc-policy-text.doc-text-ai { color: var(--pink) !important; }
.doc-policy-text.doc-text-user { color: #2563eb !important; }
.doc-action-text.doc-text-ai { color: var(--pink) !important; }
.doc-action-text.doc-text-user { color: #2563eb !important; }


/* ── Snapshot modal ──────────────────────────────────────── */
.snap-overlay{position:fixed;inset:0;background:rgba(0,0,0,.5);backdrop-filter:blur(4px);z-index:9999;display:flex;align-items:center;justify-content:center}
.snap-box{background:var(--bg);border-radius:20px;padding:32px 36px 28px;width:500px;max-width:94vw;max-height:82vh;display:flex;flex-direction:column;box-shadow:0 24px 64px rgba(0,0,0,.2);position:relative}
.snap-close{position:absolute;top:16px;right:18px;background:none;border:none;font-size:20px;color:#999;cursor:pointer;line-height:1}
.snap-close:hover{color:var(--black)}
.snap-title{font-family:'DM Serif Display',serif;font-size:20px;color:var(--black);margin:0 0 6px;font-weight:400}
.snap-desc{font-size:13px;color:var(--gray);margin-bottom:18px;line-height:1.5}
.snap-create-row{display:flex;gap:8px;margin-bottom:4px}
.snap-label-input{flex:1;padding:9px 13px;border:1.5px solid var(--border);border-radius:10px;font-family:'DM Sans',sans-serif;font-size:13px;color:var(--black);background:var(--bg);outline:none;min-width:0}
.snap-label-input:focus{border-color:var(--pink);box-shadow:0 0 0 3px rgba(232,51,109,.10)}
.btn-snap-save{padding:9px 16px;background:var(--pink);color:#fff;border:none;border-radius:10px;font-size:13px;font-weight:600;cursor:pointer;white-space:nowrap;font-family:'DM Sans',sans-serif;transition:background .15s}
.btn-snap-save:hover{background:var(--pink-dark)}
.btn-snap-save:disabled{opacity:.55;cursor:default}
.snap-divider{height:1px;background:var(--border);margin:16px 0 12px}
.snap-list{overflow-y:auto;flex:1;display:flex;flex-direction:column;gap:6px}
.snap-empty{font-size:13px;color:var(--gray-lt);text-align:center;padding:20px 0}
.snap-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 12px;border:1.5px solid var(--border);border-radius:10px;background:var(--bg-soft)}
.snap-row:hover{border-color:var(--pink);background:var(--pink-pale, #fff5f8)}
.snap-info{flex:1;min-width:0}
.snap-label{font-size:13px;font-weight:600;color:var(--black);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.snap-time{font-size:11px;color:var(--gray-lt);margin-top:2px}
.snap-btns{display:flex;gap:6px;flex-shrink:0}
.btn-snap-restore{padding:6px 12px;background:none;border:1.5px solid var(--border);border-radius:8px;font-size:12px;font-weight:600;color:var(--gray-dark);cursor:pointer;font-family:'DM Sans',sans-serif;transition:all .15s}
.btn-snap-restore:hover{border-color:var(--pink);color:var(--pink)}
.btn-snap-delete{padding:6px 9px;background:none;border:1.5px solid var(--border);border-radius:8px;font-size:12px;color:#bbb;cursor:pointer;font-family:'DM Sans',sans-serif;transition:all .15s}
.btn-snap-delete:hover{border-color:#e33;color:#e33}


/* ── Plan Health modal ──────────────────────────────────────── */
.health-box{max-height:86vh}
.health-body{overflow-y:auto;flex:1;display:flex;flex-direction:column;gap:0;padding-right:2px}
.health-summary{font-size:12px;color:var(--gray-lt);margin-bottom:16px;font-weight:500;letter-spacing:.01em}
.health-section{margin-bottom:16px}
.health-section-title{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;margin-bottom:7px;padding-bottom:5px;border-bottom:1.5px solid var(--border)}
.health-strength-title{color:#2a8a4a}
.health-warning-title{color:#a06000}
.health-gap-title{color:var(--red,#c0143c)}
.health-item{display:flex;gap:9px;align-items:baseline;font-size:13px;line-height:1.55;padding:3px 0;color:var(--black)}
.health-icon{font-size:11px;flex-shrink:0;font-weight:700}
.health-strength .health-icon{color:#2a8a4a}
.health-warning .health-icon{color:#a06000}
.health-gap     .health-icon{color:var(--red,#c0143c)}
.health-clear{text-align:center;font-size:13px;color:#2a8a4a;font-weight:600;padding:18px 0}


/* ── Action implementation metadata panels ─────────────────── */
/* 82px = border(2) + padding-left(8) + code min-width(64) + gap(8) — aligns with action text */
.action-impl-panel{padding:0 0 8px 82px}

/* "+" add button — subtle, appears below each action */
.impl-add-btn{background:none;border:none;padding:2px 0;font-size:11px;font-weight:500;color:var(--gray-lt);cursor:pointer;font-family:'DM Sans',sans-serif;transition:color .15s;text-align:left}
.impl-add-btn:hover{color:var(--pink)}

/* Summary row — always visible when metadata exists */
.impl-summary{display:flex;align-items:center;gap:6px;padding:2px 0}

/* Plain text summary (phase · priority · lead agency) */
.impl-summary-text{font-size:11px;font-weight:500;color:var(--gray-lt)}

/* ▸ Details toggle */
.impl-toggle-btn{background:none;border:none;padding:1px 4px;font-size:11px;font-weight:600;color:var(--gray-lt);cursor:pointer;font-family:'DM Sans',sans-serif;transition:color .15s;margin-left:2px}
.impl-toggle-btn:hover{color:var(--pink)}

/* Expanded form area */
.impl-expanded{padding:8px 0 4px;display:flex;flex-direction:column;gap:5px}

/* Label + control row */
.impl-field-row{display:flex;align-items:baseline;gap:8px}
.impl-field-label{font-size:10px;font-weight:700;color:var(--gray-lt);text-transform:uppercase;letter-spacing:.06em;min-width:110px;flex-shrink:0}

/* Select inputs */
.impl-select{font-family:'DM Sans',sans-serif;font-size:12px;padding:3px 6px;border:1.5px solid var(--border);border-radius:6px;background:var(--bg-soft);color:var(--black);cursor:pointer;outline:none;transition:border-color .15s;flex:1;min-width:0}
.impl-select:focus{border-color:var(--pink)}

/* Text input (lead agency) */
.impl-text-inp{font-family:'DM Sans',sans-serif;font-size:12px;padding:3px 8px;border:1.5px solid var(--border);border-radius:6px;background:var(--bg-soft);color:var(--black);outline:none;transition:border-color .15s;flex:1;min-width:0}
.impl-text-inp:focus{border-color:var(--pink)}

/* Chip tag fields (supporting agencies, dependencies, etc.) */
.impl-chip-field{flex:1;min-width:0}
.impl-chips{display:flex;flex-wrap:wrap;align-items:center;gap:4px;padding:3px 6px;border:1.5px solid var(--border);border-radius:6px;background:var(--bg-soft);min-height:30px;transition:border-color .15s}
.impl-chips:focus-within{border-color:var(--pink)}
.impl-chip-tag{display:inline-flex;align-items:center;gap:3px;padding:2px 6px;background:var(--border);border-radius:12px;font-size:11px;font-weight:500;color:var(--black)}
.impl-chip-del{background:none;border:none;padding:0 1px;font-size:12px;cursor:pointer;color:var(--gray-lt);line-height:1;font-family:'DM Sans',sans-serif;transition:color .12s}
.impl-chip-del:hover{color:var(--red,#c0143c)}
.impl-chip-input{border:none;background:none;outline:none;font-family:'DM Sans',sans-serif;font-size:12px;color:var(--black);min-width:60px;flex:1}
.impl-chip-input::placeholder{color:var(--gray-lt)}

/* Notes textarea */
.impl-notes{font-family:'DM Sans',sans-serif;font-size:12px;padding:4px 8px;border:1.5px solid var(--border);border-radius:6px;background:var(--bg-soft);color:var(--black);outline:none;resize:vertical;transition:border-color .15s;flex:1;min-width:0;line-height:1.5}
.impl-notes:focus{border-color:var(--pink)}

/* Remove button */
.impl-remove-btn{background:none;border:none;padding:4px 0 0;font-size:11px;font-weight:500;color:#bbb;cursor:pointer;font-family:'DM Sans',sans-serif;text-align:left;transition:color .15s;margin-top:2px}
.impl-remove-btn:hover{color:var(--red,#c0143c)}


/* ── Planner footer ─────────────────────────────────────────── */
/* ── Help & Feedback modal ───────────────────────────────── */
.help-type-row{display:flex;gap:8px;margin-bottom:4px}
.help-type-btn{flex:1;padding:9px 12px;border:1.5px solid var(--border);border-radius:10px;background:var(--bg-soft);font-size:12px;font-weight:500;color:var(--gray);cursor:pointer;font-family:'DM Sans',sans-serif;transition:all .15s;text-align:center}
.help-type-btn:hover{border-color:var(--pink);color:var(--pink)}
.help-type-btn.active{border-color:var(--pink);background:var(--pink-pale);color:var(--pink);font-weight:600}
.help-textarea{width:100%;min-height:120px;padding:10px 14px;border:1.5px solid var(--border);border-radius:10px;font-size:13px;font-family:'DM Sans',sans-serif;color:var(--black);background:var(--bg);outline:none;resize:vertical;line-height:1.6;box-sizing:border-box;transition:border-color .15s}
.help-textarea:focus{border-color:var(--pink)}

/* ── SVG icon system ────────────────────────────────────────── */
.icon-svg{display:inline-block;vertical-align:middle;width:15px;height:15px;object-fit:contain;position:relative;top:-1px;flex-shrink:0}
[data-theme="dark"] .icon-svg{filter:invert(1) brightness(1.8)}
.planner-footer{height:34px;display:flex;align-items:center;padding:0 24px;border-top:1px solid var(--border);font-size:11px;color:var(--gray-lt);gap:0;flex-shrink:0}
.planner-footer a{color:var(--gray-lt);text-decoration:none;font-weight:600}
.planner-footer a:hover{color:var(--black)}
.pf-dot{margin:0 6px;opacity:.4}

/* ── Planner / Update topbar tagline ───────────────────────── */
body.page-planner .topbar-sub,
body.page-update  .topbar-sub{font-size:11px;font-weight:600;color:var(--gray-lt);letter-spacing:.07em;text-transform:uppercase}

/* ── Implementation Matrix overlay ──────────────────────────── */
.impl-matrix-overlay{position:fixed;inset:0;z-index:700;background:rgba(0,0,0,.5);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;animation:fadeIn .15s ease}
/* overflow:visible is required — any non-visible overflow on the box becomes
   the sticky container, anchoring thead/td.im-sticky to the modal box instead
   of to .impl-matrix-body. Border-radius corner clipping is handled by giving
   the header (top corners) and body (bottom corners) their own border-radius. */
.impl-matrix-box{background:var(--bg);border-radius:16px;border:1.5px solid var(--border);width:calc(100vw - 48px);max-width:1600px;height:calc(100vh - 72px);display:flex;flex-direction:column;overflow:visible;box-shadow:0 24px 80px rgba(0,0,0,.18)}
/* Top corners: overflow:hidden clips header content at the rounded top corners */
.impl-matrix-header{display:flex;align-items:center;gap:16px;padding:18px 22px 16px;border-bottom:1.5px solid var(--border);flex-shrink:0;border-radius:16px 16px 0 0;overflow:hidden}
.impl-matrix-title{font-family:'DM Serif Display',serif;font-size:20px;color:var(--black);letter-spacing:-.01em}
.impl-matrix-subtitle{font-size:11px;color:var(--gray-lt);margin-top:2px}
.impl-matrix-close{background:none;border:none;cursor:pointer;color:var(--gray-lt);padding:4px;border-radius:6px;transition:color .15s;line-height:1;display:flex;align-items:center}
.impl-matrix-close:hover{color:var(--black)}
/* min-height:0 is required: flex items default to min-height:auto, which prevents the item
   from shrinking to its flex allocation — without it the table expands the body to full
   content height, overflow:auto never scrolls, and position:sticky never fires.
   padding:0 removes sticky threshold offset so top:0/left:0 fire at the true edge. */
.impl-matrix-body{flex:1;min-height:0;overflow:auto;padding:0;border-radius:0 0 16px 16px}
.impl-matrix-table{border-collapse:collapse;width:max-content;min-width:100%;font-size:12px;font-family:'DM Sans',sans-serif}
.impl-matrix-table th{background:var(--bg-mid);border:1px solid var(--border);padding:8px 11px;text-align:left;font-size:10px;font-weight:700;color:var(--gray-lt);text-transform:uppercase;letter-spacing:.07em;white-space:nowrap;position:sticky;top:0;z-index:2}
.impl-matrix-table td{border:1px solid var(--border);padding:7px 11px;vertical-align:top;color:var(--black);line-height:1.5;background:var(--bg)}
.impl-matrix-table tr:nth-child(even) td{background:var(--bg-soft)}
.impl-matrix-table tr:hover td{background:var(--pink-pale)}
.im-narrow{white-space:nowrap;width:80px;max-width:80px;overflow:hidden;text-overflow:ellipsis}
.im-code{font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--gray-lt)}
.im-action{max-width:300px}
.im-element{max-width:160px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.im-empty{color:var(--gray-lt);font-style:italic}
.im-chip{display:inline-block;padding:2px 7px;background:var(--border);border-radius:10px;font-size:10px;margin:1px 2px 1px 0;white-space:nowrap}

/* ── Element group rows ──────────────────────────────────────── */
/* sticky left:0 keeps the group label visible when scrolling horizontally;
   z:3 is above data sticky cells (z:2) but below the corner header cell (z:4) */
.im-group-row td{background:var(--bg-soft);padding:7px 14px;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--gray);border-top:2px solid var(--border);border-bottom:1px solid var(--border);position:sticky;left:0;z-index:3}
/* Group rows should not pick up hover highlight from data rows */
.impl-matrix-table tr.im-group-row:hover td{background:var(--bg-soft)}

/* ── Meta columns (agency / deps / kpis / funding) ──────────── */
/* Bounded width so pills don't balloon the column */
.im-meta{max-width:200px;min-width:70px}
/* Chips stack vertically and wrap inside the cell */
.im-meta .im-chip{display:block;white-space:normal;word-break:break-word;margin:2px 0}
/* Overflow pills hidden by default; revealed when row is expanded */
.im-meta .im-chip.im-pill-hidden{display:none}
tr.im-expanded .im-meta .im-chip.im-pill-hidden{display:block}

/* ── Action text truncation ──────────────────────────────────── */
/* 3-line clamp — text must be a direct text node in .im-action-text (no child span) */
td.im-action .im-action-text{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;word-break:break-word}
/* Expanded state: class lives on the tr so one click reveals both text + meta pills */
tr.im-expanded td.im-action .im-action-text{display:block;-webkit-line-clamp:unset;overflow:visible}
/* Per-row Details/Less toggle button */
.im-expand-btn{display:block;margin-top:5px;font-size:10px;font-weight:600;color:var(--pink);cursor:pointer;background:none;border:none;padding:0;font-family:'DM Sans',sans-serif;letter-spacing:.02em;line-height:1.4}
.im-expand-btn:hover{opacity:.7}

/* ── Frozen columns ──────────────────────────────────────────── */
/* Col 1: Action ID — z:2 ensures it layers above all non-positioned cells */
.impl-matrix-table th.im-sticky,
.impl-matrix-table td.im-sticky{position:sticky;left:0;z-index:2}
/* Col 2 (unused, retained for future use) */
.impl-matrix-table th.im-sticky-2,
.impl-matrix-table td.im-sticky-2{position:sticky;left:102px;z-index:2;box-shadow:2px 0 6px -2px rgba(0,0,0,.10)}
/* Corner cells: z:4 sits above both sticky header row (z:2 on th) and sticky col (z:2) */
.impl-matrix-table thead th.im-sticky,
.impl-matrix-table thead th.im-sticky-2{z-index:4}
/* !important guarantees opaque backgrounds regardless of cascade conflicts.
   All three states (default / even-row / hover) must carry !important so
   they override each other correctly by specificity when stacked. */
.impl-matrix-table td.im-sticky,
.impl-matrix-table td.im-sticky-2{background:var(--bg) !important}
.impl-matrix-table tr:nth-child(even) td.im-sticky,
.impl-matrix-table tr:nth-child(even) td.im-sticky-2{background:var(--bg-soft) !important}
.impl-matrix-table tr:hover td.im-sticky,
.impl-matrix-table tr:hover td.im-sticky-2{background:var(--pink-pale) !important}
.impl-matrix-table thead th.im-sticky,
.impl-matrix-table thead th.im-sticky-2{background:var(--bg-mid) !important}

/* ── Matrix toolbar controls (single Expand All / Collapse All toggle) ─── */
.im-view-toggle{font-family:'DM Sans',sans-serif;font-size:11px;font-weight:600;padding:5px 12px;border:1px solid var(--border);border-radius:20px;background:none;color:var(--gray);cursor:pointer;letter-spacing:.02em;white-space:nowrap;transition:color .15s,border-color .15s,background .15s;flex-shrink:0}
.im-view-toggle:hover{color:var(--gray-dark);border-color:var(--gray-lt);background:var(--bg-soft)}

/* ── Sidebar matrix item ─────────────────────────────────────── */
.sidebar-matrix-item{color:var(--gray);border-left-color:transparent}
.sidebar-matrix-item:hover{background:var(--bg-soft);color:var(--gray-dark)}
.sidebar-matrix-icon{font-size:16px;line-height:1;opacity:.6}
.sidebar-matrix-badge{font-size:9px;font-weight:700;color:var(--pink);background:var(--pink-pale);padding:2px 6px;border-radius:100px;text-transform:uppercase;letter-spacing:.04em;white-space:nowrap}

/* ── Admin invite button ─────────────────────────────────────── */
body.page-admin .invite-btn{background:#e8336d;color:#fff;border-color:#e8336d;font-weight:600;flex-shrink:0}
body.page-admin .invite-btn:hover{background:#c4215a;border-color:#c4215a}

/* ── People & Organizations ──────────────────────────────────── */
body.page-admin .po-org-bucket{border:1.5px solid var(--border);border-radius:14px;margin-bottom:10px;overflow:hidden}
body.page-admin .po-org-hdr{display:flex;align-items:center;gap:8px;padding:13px 18px;background:var(--bg);cursor:pointer;user-select:none;transition:background .12s}
body.page-admin .po-org-hdr:hover{background:var(--bg-soft)}
body.page-admin .po-members-wrap{border-top:1px solid var(--border)}
body.page-admin .po-user-row{display:flex;align-items:center;gap:14px;padding:9px 18px;border-bottom:1px solid var(--border-lt);cursor:pointer;transition:background .1s}
body.page-admin .po-user-row:last-of-type{border-bottom:none}
body.page-admin .po-user-row:hover{background:var(--bg-soft)}
body.page-admin .po-inline-select{font-size:11px;padding:2px 5px;border:1px solid var(--border);border-radius:4px;background:var(--bg,#fff);color:var(--gray);cursor:pointer;width:100%;max-width:100%;box-sizing:border-box}
body.page-admin .po-inline-select:hover{border-color:var(--gray-lt)}
body.page-admin .po-status-sel[data-status="active"]{color:var(--green)}
body.page-admin .po-status-sel[data-status="pending"]{color:var(--amber)}
body.page-admin .po-status-sel[data-status="disabled"]{color:var(--gray-lt)}

/* ── Demo City dashboard card ────────────────────────────────── */
.plan-card-demo{position:relative;background:linear-gradient(135deg,#0a1a2e 0%,#0f2544 60%,#1a3a5e 100%);border:1.5px solid #2a4a7a;cursor:pointer;transition:transform .15s,box-shadow .15s}
.plan-card-demo:hover{transform:translateY(-2px);box-shadow:0 8px 32px rgba(0,0,0,.25)}
.plan-card-demo .plan-name{color:#e8f4ff;font-size:17px}
.plan-card-demo .plan-state{color:#7a9ec0;font-size:11px}
.plan-card-demo .plan-footer{border-top:1px solid #2a4a7a;padding-top:10px;margin-top:12px}
.demo-card-badge{position:absolute;top:12px;right:12px;font-size:9px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;background:#e8336d;color:#fff;padding:3px 8px;border-radius:100px}
.plan-tag.tag-demo{background:rgba(232,51,109,.15);color:#e8336d;border:1px solid rgba(232,51,109,.3)}

/* ── Demo walkthrough UI ─────────────────────────────────────── */
#demoUI{position:fixed;inset:0;z-index:9000;pointer-events:none}
/* Full-screen click blocker (transparent; spot provides the visual dim) */
#demoDim{position:fixed;inset:0;z-index:9000;pointer-events:auto;transition:background .2s}
/* Spotlight: box-shadow dims everything outside the rounded rect */
#demoSpot{position:fixed;z-index:9001;pointer-events:none;border-radius:12px;border:2px solid rgba(232,51,109,.75);box-shadow:0 0 0 9999px rgba(0,0,0,.62),0 0 24px rgba(232,51,109,.18);transition:top .2s ease,left .2s ease,width .2s ease,height .2s ease;display:none}
.demo-tip{position:fixed;z-index:9002;width:320px;box-sizing:border-box;background:var(--bg);border:1.5px solid var(--border);border-radius:14px;padding:20px 22px 18px;box-shadow:0 16px 48px rgba(0,0,0,.22);pointer-events:auto;animation:demoTipIn .18s ease}
.demo-tip-center{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);width:380px;animation:demoTipCenterIn .2s ease}
.demo-tip-step{font-size:10px;font-weight:700;color:var(--pink);text-transform:uppercase;letter-spacing:.08em;margin-bottom:6px}
.demo-tip-title{font-family:'DM Serif Display',serif;font-size:19px;color:var(--black);margin-bottom:8px;line-height:1.25}
.demo-tip-body{font-size:13px;color:var(--gray);line-height:1.65}
@keyframes demoTipIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
@keyframes demoTipCenterIn{from{opacity:0;transform:translate(-50%,-46%)}to{opacity:1;transform:translate(-50%,-50%)}}
.demo-nav{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);z-index:9003;display:flex;align-items:center;gap:12px;background:var(--bg);border:1.5px solid var(--border);border-radius:100px;padding:8px 14px;box-shadow:0 8px 32px rgba(0,0,0,.18);pointer-events:auto;white-space:nowrap}
.demo-nav-btn{border:none;background:none;cursor:pointer;font-size:13px;font-weight:600;font-family:'DM Sans',sans-serif;padding:5px 12px;border-radius:100px;transition:all .15s;color:var(--gray)}
.demo-nav-btn:hover{background:var(--bg-soft);color:var(--black)}
.demo-nav-next{background:#e8336d;color:#fff !important;padding:5px 18px}
.demo-nav-next:hover{background:#c4215a !important}
.demo-nav-exit{color:var(--gray-lt)}
.demo-nav-dots{display:flex;gap:5px;align-items:center}
.demo-dot{width:6px;height:6px;border-radius:50%;background:var(--border);transition:all .2s}
.demo-dot.active{background:#e8336d;width:18px;border-radius:3px}
/* Spark-button ring (step 5) */
@keyframes demoSparkPulse{0%,100%{box-shadow:0 0 0 4px rgba(232,51,109,.22);transform:scale(1)}50%{box-shadow:0 0 0 12px rgba(232,51,109,0);transform:scale(1.1)}}
.demo-spark-ring{position:fixed;border-radius:50%;border:2px solid #e8336d;pointer-events:none;z-index:9004;animation:demoSparkPulse 1.2s ease-in-out infinite}
.demo-pill-ring{position:fixed;border-radius:8px;border:2px solid #e8336d;pointer-events:none;z-index:9004;animation:demoSparkPulse 1.2s ease-in-out infinite}
/* Dashboard demo-complete pulse */
@keyframes demoCardPulse{0%,100%{box-shadow:0 0 0 0 rgba(232,51,109,0)}50%{box-shadow:0 0 0 4px rgba(232,51,109,.35)}}
.plan-card.demo-pulse-card{animation:demoCardPulse 1.4s ease-in-out 3}

/* ── Lattice Update workspace ────────────────────────────── */
body.page-update .up-source-card{border:1.5px solid var(--border);border-radius:12px;padding:13px 16px;background:var(--bg-soft);display:flex;align-items:center;gap:14px;cursor:pointer;transition:border-color .15s,background .15s,box-shadow .15s;user-select:none}
body.page-update .up-source-card:hover{border-color:var(--pink-mid);background:var(--bg);box-shadow:var(--sh-sm)}
body.page-update .up-source-card.up-source-selected{border-color:var(--pink);background:var(--pink-pale)}
body.page-update .up-source-icon{width:38px;height:38px;border-radius:10px;background:var(--bg);border:1.5px solid var(--border);display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:15px;font-weight:700;color:var(--gray-lt);transition:border-color .15s,color .15s}
body.page-update .up-source-card.up-source-selected .up-source-icon{border-color:var(--pink-mid);color:var(--pink)}
body.page-update .up-drop-zone{border:2px dashed var(--border);border-radius:12px;padding:32px 24px;text-align:center;cursor:pointer;transition:border-color .15s,background .15s}
body.page-update .up-drop-zone:hover,body.page-update .up-drop-zone.up-drop-hover{border-color:var(--pink);background:var(--pink-pale)}
body.page-update .up-status-msg{font-size:12px;padding:8px 12px;border-radius:8px;margin-top:8px}
body.page-update .up-status-loading{color:var(--gray-lt);background:var(--bg-mid)}
body.page-update .up-status-success{color:var(--green);background:var(--green-pale);border:1px solid var(--green-border)}
body.page-update .up-status-error{color:var(--red);background:var(--red-pale);border:1px solid var(--red-border)}
/* ── Review Intake panel ── */
body.page-update .up-replace-btn{font-size:11px;font-weight:600;color:var(--gray-lt);background:none;border:1.5px solid var(--border);border-radius:8px;padding:5px 12px;cursor:pointer;font-family:'DM Sans',sans-serif;transition:color .12s,border-color .12s}
body.page-update .up-replace-btn:hover{color:var(--red);border-color:var(--red)}

/* ── 3-Panel Calibration Workspace ── */
body.page-update #upWorkspace{position:fixed;top:56px;left:0;right:0;bottom:0;z-index:10;background:var(--bg)}
body.page-update #upCalWorkspace{position:fixed;top:56px;left:0;right:0;bottom:0;z-index:10;background:var(--bg)}
/* Default layout — same column order as Lattice Create: nav | info | plan */
body.page-update .up-cal-layout{display:grid;grid-template-columns:268px 380px 1fr;height:100%;overflow:hidden}
body.page-update .up-cal-left{overflow-y:auto;padding:22px 20px 40px;background:var(--bg-soft);border-right:1.5px solid var(--border);display:flex;flex-direction:column;gap:0}
body.page-update .up-cal-center{overflow-y:auto;padding:22px 32px 40px;background:var(--bg)}
body.page-update .up-cal-right{overflow-y:auto;padding:24px 28px 60px;background:var(--bg-soft);border-left:1.5px solid var(--border)}
/* ── Floating Issue Rail (fixed overlay — SR/SA steps only) ─────────────────
   Sits at right:0. Total width = 36px tab + plan-column width.
   Plan column = 100vw - 268px nav - 380px center = 100vw - 648px.
   Total panel  = 100vw - 648px + 36px = 100vw - 612px.
   translateX(content-width) = translateX(100vw - 648px) → only tab peeks.
   Grid stays 268px 380px 1fr at ALL times — never changes.                  */
body.page-update #ucRailPanel{position:fixed;top:56px;right:0;bottom:0;width:calc(100vw - 612px);display:flex;flex-direction:row;z-index:40;transform:translateX(calc(100vw - 612px));transition:transform .28s cubic-bezier(.4,0,.2,1);pointer-events:none}
/* rail-visible: content off screen, 36px tab peeks from right edge of nav+center block */
body.page-update #ucRailPanel.rail-visible{transform:translateX(calc(100vw - 648px))}
/* rail-open: full panel covers the plan column */
body.page-update #ucRailPanel.rail-visible.rail-open{transform:translateX(0);pointer-events:auto}
/* Tab — always interactive when visible */
body.page-update .up-rail-tab{width:36px;flex-shrink:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:14px 0;background:var(--bg-soft);border-left:1.5px solid var(--border);border-top:1.5px solid var(--border);border-bottom:1.5px solid var(--border);border-radius:10px 0 0 10px;cursor:pointer;font-family:'DM Sans',sans-serif;transition:background .15s,border-color .15s;box-shadow:-3px 0 12px rgba(0,0,0,.07);pointer-events:auto}
body.page-update .up-rail-tab:hover{background:var(--pink-pale);border-color:var(--pink-mid)}
body.page-update .up-rail-tab-icon{font-size:14px;color:var(--gray-lt);line-height:1;transition:color .15s}
body.page-update .up-rail-tab:hover .up-rail-tab-icon{color:var(--pink)}
body.page-update .up-rail-tab-label{writing-mode:vertical-rl;text-orientation:mixed;transform:rotate(180deg);font-size:9px;font-weight:700;color:var(--gray-lt);text-transform:uppercase;letter-spacing:.1em;line-height:1;transition:color .15s}
body.page-update .up-rail-tab:hover .up-rail-tab-label{color:var(--pink)}
body.page-update .up-rail-tab-count{background:var(--pink);color:#fff;border-radius:100px;font-size:9px;font-weight:700;padding:2px 5px;font-family:'DM Sans',sans-serif;line-height:1.4;min-width:14px;text-align:center}
/* Rail content — fills remaining width after the 36px tab */
body.page-update .up-rail-content{flex:1;min-width:0;overflow-y:auto;padding:20px 22px 60px;background:var(--bg-soft);border-left:1.5px solid var(--border);box-shadow:-6px 0 32px rgba(0,0,0,.12)}

/* Back link */
body.page-update .up-cal-back{display:inline-flex;align-items:center;font-size:11px;font-weight:700;color:var(--gray-lt);text-decoration:none;padding:4px 0;margin-bottom:20px;transition:color .12s;letter-spacing:.02em}
body.page-update .up-cal-back:hover{color:var(--black)}

/* Workflow steps */
body.page-update .up-wf-step{display:flex;align-items:flex-start;gap:10px;padding:9px 10px;border-radius:10px;margin-bottom:3px;position:relative}
/* ⓘ info icon on each rail step (Lattice v3 'information' glyph, currentColor) */
body.page-update .up-wf-info{position:absolute;top:6px;right:6px;width:16px;height:16px;border:none;background:transparent;color:var(--gray-lt);cursor:pointer;padding:0;opacity:.5;display:flex;align-items:center;justify-content:center;transition:opacity .12s,color .12s}
body.page-update .up-wf-info:hover{opacity:1;color:var(--pink)}
body.page-update .up-wf-info svg{width:14px;height:14px}
/* Floating "what is this step?" window */
body.page-update .up-si-backdrop,body .up-si-backdrop{position:fixed;inset:0;z-index:4000;background:rgba(20,22,28,.5);display:flex;align-items:center;justify-content:center;padding:24px;backdrop-filter:blur(2px)}
.up-si-window{position:relative;background:var(--bg,#fff);color:var(--gray-dark,#2a2a2a);border:1px solid var(--border,#e2e2e2);border-radius:16px;max-width:520px;width:100%;max-height:82vh;overflow-y:auto;padding:26px 28px 24px;box-shadow:0 24px 60px rgba(0,0,0,.28);font-family:'DM Sans',sans-serif}
.up-si-close{position:absolute;top:12px;right:14px;width:26px;height:26px;border:none;background:transparent;color:var(--gray-lt,#999);font-size:20px;line-height:1;cursor:pointer;border-radius:6px}
.up-si-close:hover{background:var(--bg-soft,#f2f2f2);color:var(--gray-dark,#333)}
.up-si-eyebrow{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.09em;color:var(--pink,#e0457b)}
.up-si-title{margin:4px 0 0;font-size:22px;font-weight:400;font-family:'DM Serif Display',Georgia,serif;color:var(--black,#1a1a1a);display:flex;align-items:center;gap:9px}
.up-si-ticon{display:inline-flex;align-items:center;color:var(--pink,#e0457b)}
.up-si-ticon svg{width:22px;height:22px}
.up-si-tagline{font-size:13.5px;color:var(--gray,#666);margin:5px 0 4px;line-height:1.5}
.up-si-section{margin-top:16px}
.up-si-h{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--gray-lt,#8a8a8a);margin-bottom:5px}
.up-si-section p{margin:0;font-size:13.5px;line-height:1.6;color:var(--gray-dark,#333)}
.up-si-magic{background:var(--pink-pale,#fdeef4);border:1px solid var(--pink-mid,#f3c4d8);border-radius:10px;padding:12px 14px}
.up-si-magic .up-si-h{color:var(--pink,#d83f77)}
.up-si-youdo{background:var(--bg-soft,#f6f6f6);border-radius:10px;padding:12px 14px}
.up-si-list{margin:4px 0 0;padding-left:18px}
.up-si-list li{font-size:13px;line-height:1.55;color:var(--gray-dark,#333);margin-bottom:3px}
.up-si-fgroup{font-size:11px;font-weight:700;color:var(--pink,#d83f77);margin:10px 0 3px;letter-spacing:.02em}
.up-si-flist{margin:0 0 4px;padding-left:18px;list-style:disc}
.up-si-flist li{font-size:12.5px;line-height:1.5;color:var(--gray-dark,#333);margin-bottom:4px}
.up-si-flist b{color:var(--black,#1a1a1a);font-weight:700}
@media (prefers-color-scheme:dark){
  .up-si-window{background:var(--bg,#1c1e24)}
  .up-si-magic{background:rgba(224,69,123,.12)}
  .up-si-youdo{background:rgba(255,255,255,.05)}
}
:root[data-theme="dark"] .up-si-window{background:var(--bg,#1c1e24)}
:root[data-theme="light"] .up-si-window{background:#fff}
body.page-update .up-wf-step.wf-complete{background:var(--green-pale)}
body.page-update .up-wf-step.wf-complete.wf-clickable{cursor:pointer;transition:background .15s,box-shadow .15s}
body.page-update .up-wf-step.wf-complete.wf-clickable:hover{background:#ddf2e6;box-shadow:0 0 0 1.5px var(--green-border)}
body.page-update .up-wf-step.wf-active{background:var(--pink-pale)}
body.page-update .up-wf-step.wf-locked{opacity:.38}
body.page-update .up-wf-dot{width:20px;height:20px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:9px;font-weight:700;color:#fff;margin-top:1px}
body.page-update .up-wf-dot.dot-complete{background:var(--green)}
body.page-update .up-wf-dot.dot-active{background:var(--pink)}
body.page-update .up-wf-dot.dot-locked{background:var(--border);color:var(--gray-lt)}
/* Nested sub-steps under a multi-step stage (Normalize) — Pass A spine.
   Indented, lighter, and grouped by a left rule so the stage header dominates. */
body.page-update .up-wf-step.up-wf-substep{margin-left:24px;padding:6px 9px;border-left:2px solid var(--border);border-radius:0 8px 8px 0}
body.page-update .up-wf-step.up-wf-substep .up-wf-dot{width:14px;height:14px;font-size:8px;margin-top:2px}

/* Calibration choice buttons (legacy, kept for compat) */
body.page-update .up-cal-choice{border:1.5px solid var(--border);border-radius:10px;padding:14px 16px;background:var(--bg);cursor:pointer;text-align:left;font-size:14px;font-weight:600;color:var(--black);font-family:'DM Sans',sans-serif;transition:border-color .15s,background .15s,box-shadow .15s;user-select:none;line-height:1.3}
body.page-update .up-cal-choice:hover{border-color:var(--pink-mid);background:var(--bg-soft);box-shadow:var(--sh-sm)}
body.page-update .up-cal-choice.uc-selected{border-color:var(--pink);background:var(--pink-pale);color:var(--pink)}

/* Detected-term chip grid */
body.page-update .up-cal-chips{display:flex;flex-wrap:wrap;gap:8px}
body.page-update .up-cal-chip{display:inline-flex;align-items:center;padding:9px 18px;border:1.5px solid var(--border);border-radius:100px;background:var(--bg);font-size:13px;font-weight:600;color:var(--black);cursor:pointer;font-family:'DM Sans',sans-serif;transition:border-color .15s,background .15s,color .15s,box-shadow .15s;user-select:none;white-space:nowrap}
body.page-update .up-cal-chip:hover{border-color:var(--pink-mid);background:var(--bg-soft);box-shadow:var(--sh-sm)}
body.page-update .up-cal-chip.uc-selected{border-color:var(--pink);background:var(--pink-pale);color:var(--pink)}
body.page-update .up-cal-chip.uc-used{border-color:var(--border-lt);color:var(--gray-xlt);background:var(--bg-soft);cursor:default;pointer-events:none}

/* Back and ghost buttons in center panel */
body.page-update .up-cal-back-btn{font-size:13px;font-weight:600;color:var(--gray-lt);background:none;border:1.5px solid var(--border);border-radius:8px;padding:10px 18px;cursor:pointer;font-family:'DM Sans',sans-serif;transition:color .12s,border-color .12s}
body.page-update .up-cal-back-btn:hover{color:var(--black);border-color:var(--gray-lt)}
body.page-update .up-cal-ghost-btn{font-size:12px;font-weight:600;color:var(--gray-lt);background:none;border:none;padding:10px 6px;cursor:pointer;font-family:'DM Sans',sans-serif;transition:color .12s;text-decoration:underline;text-underline-offset:2px}
body.page-update .up-cal-ghost-btn:hover{color:var(--red)}

/* Hierarchy confirm display (Q4 center panel) */
body.page-update .up-cal-hierarchy-confirm{background:var(--bg-soft);border:1.5px solid var(--border);border-radius:12px;padding:20px 24px;font-family:'JetBrains Mono',monospace;font-size:13px;color:var(--black);line-height:1.8;display:inline-block;min-width:200px}

/* Right panel highlight rows */
body.page-update .up-cal-highlight-row{font-size:10.5px;font-family:'JetBrains Mono',monospace;line-height:1.5;color:var(--gray);background:var(--bg);border:1px solid var(--border);border-radius:7px;padding:7px 11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
body.page-update .up-cal-highlight-row mark{background:var(--pink-pale);color:var(--pink);padding:0 2px;border-radius:3px;font-weight:700}

/* Right panel hierarchy tree */
body.page-update .up-cal-tree{font-family:'JetBrains Mono',monospace;font-size:11.5px;line-height:1.7;color:var(--gray)}
body.page-update .up-cal-tree .tree-l1{font-size:12px;font-weight:700;color:var(--black);padding:5px 0 2px;border-bottom:1px solid var(--border-lt);margin-bottom:3px}
body.page-update .up-cal-tree .tree-l2{color:var(--gray);padding-left:16px}
body.page-update .up-cal-tree .tree-l3{color:var(--gray-lt);padding-left:32px}
body.page-update .up-cal-tree .tree-l4{color:var(--gray-lt);padding-left:48px;font-size:10.5px}
body.page-update .up-cal-tree .tree-limpl{color:var(--gray-lt);padding-left:32px;font-size:10px;font-style:italic;opacity:.7}
body.page-update .up-cal-tree .tree-group{margin-bottom:10px}

/* Right panel interpreted elements (legacy, kept for compat) */
body.page-update .up-cal-elem{display:flex;align-items:center;gap:10px;padding:10px 13px;border-radius:10px;border:1px solid var(--border);background:var(--bg);margin-bottom:5px;transition:border-color .15s}
body.page-update .up-cal-elem.elem-confirmed{border-color:var(--green-border);background:var(--green-pale)}
body.page-update .up-cal-elem.elem-candidate{opacity:.7}

/* ── Hierarchy Review right panel ── */
body.page-update .up-rv-tree{display:flex;flex-direction:column;gap:0}
body.page-update .up-rv-group{margin-bottom:24px}
/* Base item — overridden per level below */
body.page-update .up-rv-item{display:flex;align-items:flex-start;gap:6px;padding:8px 12px;border-radius:8px;border:1px solid var(--border);background:var(--bg);transition:border-color .12s,background .12s;flex-wrap:wrap}
body.page-update .up-rv-item:hover{border-color:var(--pink-mid)}
body.page-update .up-rv-item.rv-approved{border-color:var(--green-border)!important;background:var(--green-pale)!important}
body.page-update .up-rv-item.rv-ignored{opacity:.4;background:var(--bg-soft)!important}
body.page-update .up-rv-item.rv-ignored .up-rv-title{text-decoration:line-through;color:var(--gray-lt)}
/* Narrative: plan prose that stays in the plan but is not a hierarchy node */
body.page-update .up-rv-item.rv-narrative{border-style:dashed!important;border-color:#b8c9e0!important;background:#f5f8fc!important;margin-left:0!important;flex-wrap:wrap}
/* Approved narrative — keep dashed border but go green */
body.page-update .up-rv-item.rv-narrative.rv-approved{background:var(--green-pale)!important;border-color:var(--green-border)!important}
/* Actions row floats to the top-right on its own line; title spans the full width below */
body.page-update .up-rv-item.rv-narrative .up-rv-actions{order:-1;width:100%;justify-content:flex-end;margin-bottom:4px}
body.page-update .up-rv-item.rv-narrative .up-rv-title{width:100%;flex:none!important;font-weight:400!important;font-size:11px!important;font-style:italic!important;color:var(--gray-lt)!important;letter-spacing:0!important}
body.page-update .rv-badge-narrative{background:#e8f0ff;color:#4a6fa5;border:1px solid #c0d0e8}
body.page-update .up-rv-btn.rv-btn-narrative-active{border-color:#7ba3e8!important;background:#edf2ff!important;color:#3a5bc7!important}
/* ── Level-specific item styles — Lattice Create inspired ── */
/* L1 — Element / major division: bold serif, bottom rule only, spacious */
body.page-update .up-rv-l1{padding:18px 0 14px;border:none;border-bottom:2px solid var(--border-lt);border-radius:0;background:transparent;margin-bottom:12px!important}
body.page-update .up-rv-item.up-rv-l1.rv-approved{background:var(--green-pale)!important;border-bottom-color:var(--green-border)!important}
body.page-update .up-rv-l1:not(.rv-approved):not(.rv-conf-low):not(.rv-conf-med){border-left:none}
/* L2 — Goal / Objective: bordered card, full width */
body.page-update .up-rv-l2{margin-left:0;padding:12px 14px;border:1.5px solid var(--border)!important;border-radius:10px;margin-bottom:6px!important}
/* L3 — Policy / Strategy: inset card */
body.page-update .up-rv-l3{margin-left:18px;padding:9px 13px;border:1px solid var(--border-lt)!important;border-radius:8px;background:var(--bg-soft)!important;margin-bottom:4px!important}
/* L4 — Action / Implementation: left-bar accent, no box */
body.page-update .up-rv-l4{margin-left:36px;padding:5px 10px;border:none!important;border-left:2px solid var(--border)!important;border-radius:0;background:transparent!important;margin-bottom:3px!important}
/* Impl — AI / auto-generated: pink left-bar, italic */
body.page-update .up-rv-limpl{margin-left:36px;padding:4px 10px;border:none!important;border-left:2px solid var(--pink-mid)!important;border-radius:0;background:transparent!important;margin-bottom:3px!important;opacity:1}
body.page-update .up-rv-limpl .up-rv-title{font-style:italic;color:var(--gray-lt)!important;font-size:12px!important;font-family:'DM Sans',sans-serif!important}
/* ── Title typography — level-specific ── */
body.page-update .up-rv-title{flex:1;font-size:13px;font-family:'DM Sans',sans-serif;color:var(--gray-dark,#444);line-height:1.55;word-break:break-word;min-width:0;padding-right:4px;display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
body.page-update .up-rv-title-text{flex:1;min-width:0;word-break:break-word}
body.page-update .up-rv-l1 .up-rv-title{font-size:19px;font-weight:400;color:var(--black);letter-spacing:-.015em;font-family:'DM Serif Display',serif;line-height:1.3}
body.page-update .up-rv-l2 .up-rv-title{font-size:14px;font-weight:600;color:var(--black);font-family:'DM Sans',sans-serif;line-height:1.45}
body.page-update .up-rv-l3 .up-rv-title{font-size:13px;font-weight:500;color:var(--gray-dark,#3a3a3a);font-family:'DM Sans',sans-serif}
body.page-update .up-rv-l4 .up-rv-title{font-size:12.5px;color:var(--gray);font-weight:400;font-family:'DM Sans',sans-serif}
/* ── ID prefix — fixed small DM Sans label, consistent at every level ─────
   Never inherits the level font so "Objective 7" and "Objective 8" always
   look identical regardless of which depth the parser assigned them.        */
body.page-update .up-rv-id-badge{flex-shrink:0;white-space:nowrap;color:var(--gray-lt);font-family:'DM Sans',sans-serif;font-size:11px;font-weight:500;letter-spacing:.01em;line-height:1.4}
/* Labeled L1 items (numbered sections mis-classified at depth 0) get DM Sans
   to match their L2 counterparts — element headings without a badge keep
   DM Serif Display via the base .up-rv-l1 rule unchanged.                  */
body.page-update .up-rv-item.rv-labeled.up-rv-l1 .up-rv-title{font-family:'DM Sans',sans-serif;font-size:15px;font-weight:700;letter-spacing:-.01em;color:var(--black)}
/* ── Actions ── */
body.page-update .up-rv-actions{display:flex;gap:3px;flex-shrink:0;align-items:center}
body.page-update .up-rv-btn{font-size:11px;font-weight:600;padding:3px 8px;border-radius:5px;border:1px solid var(--border);background:var(--bg-soft);color:var(--gray-lt);cursor:pointer;font-family:'DM Sans',sans-serif;transition:all .12s;white-space:nowrap;line-height:1.4}
body.page-update .up-rv-btn:hover{border-color:var(--gray-lt);color:var(--black);background:var(--bg)}
body.page-update .up-rv-btn.rv-btn-active-ok{border-color:var(--green-border)!important;background:var(--green-pale)!important;color:var(--green)!important}
/* Lock: hide Edit + Delete once item is accepted; only the ✓ lock button remains */
body.page-update .up-rv-item.rv-approved .up-rv-edit-btn,
body.page-update .up-rv-item.rv-approved .up-rv-delete-btn{display:none!important}
body.page-update .up-rv-btn.rv-btn-active-skip{border-color:var(--red-border)!important;background:var(--red-pale)!important;color:var(--red)!important}
/* ── Rename wrap — multi-line textarea ── */
body.page-update .up-rv-rename-wrap{display:none;width:100%;flex-direction:column;gap:6px;margin-top:6px}
body.page-update .up-rv-rename-wrap.rv-editing{display:flex}
body.page-update .up-rv-rename-wrap-btns{display:flex;gap:4px}
body.page-update .up-rv-rename-input{width:100%;font-size:13px;font-family:'DM Sans',sans-serif;padding:7px 10px;border:1.5px solid var(--pink-mid);border-radius:7px;background:var(--bg);color:var(--black);outline:none;resize:vertical;min-height:44px;line-height:1.5;box-sizing:border-box}
body.page-update .up-rv-rename-input:focus{border-color:var(--pink);box-shadow:0 0 0 2px var(--pink-pale)}
body.page-update .up-rv-level-wrap{display:none;gap:3px;align-items:center;width:100%;margin-top:4px;flex-wrap:wrap}
body.page-update .up-rv-level-wrap.rv-picking{display:flex}
body.page-update .up-rv-level-btn,body.page-update .up-rv-extract-level-btn{font-size:9.5px;font-weight:700;padding:3px 8px;border-radius:5px;border:1.5px solid var(--border);background:var(--bg-soft);color:var(--gray-lt);cursor:pointer;font-family:'DM Sans',sans-serif;transition:all .12s}
body.page-update .up-rv-level-btn:hover,body.page-update .up-rv-extract-level-btn:hover{border-color:var(--pink);color:var(--pink);background:var(--pink-pale)}
body.page-update .up-rv-level-btn.rv-level-current,body.page-update .up-rv-extract-level-btn.rv-level-current{border-color:var(--pink)!important;background:var(--pink-pale)!important;color:var(--pink)!important}
body.page-update .up-rv-summary{display:flex;gap:5px;flex-wrap:nowrap;overflow-x:auto;margin-bottom:14px;padding-bottom:2px}
body.page-update .up-rv-stat{background:var(--bg-soft);border:1px solid var(--border);border-radius:8px;padding:7px 10px;text-align:center;min-width:52px;flex:1}
body.page-update .up-rv-stat.up-rv-stat-impl{border-style:dashed;opacity:.8}
body.page-update .up-rv-stat-n{font-size:16px;font-weight:700;color:var(--black);letter-spacing:-.02em;line-height:1.2}
body.page-update .up-rv-stat-label{font-size:8px;font-weight:600;color:var(--gray-lt);text-transform:uppercase;letter-spacing:.07em;margin-top:2px}
/* Live approval meter: the approved count climbs 0→total as items are approved */
body.page-update .up-rv-stat-live{position:relative;transition:border-color .3s ease,background .3s ease}
body.page-update .up-rv-stat-appr{color:var(--pink);font-variant-numeric:tabular-nums}
body.page-update .up-rv-stat-tot{font-size:11px;font-weight:600;color:var(--gray-lt);letter-spacing:0}
body.page-update .up-rv-stat-track{height:3px;border-radius:2px;background:var(--border);margin-top:5px;overflow:hidden}
body.page-update .up-rv-stat-fill{height:100%;border-radius:2px;background:var(--pink);width:0;transition:width .5s cubic-bezier(.22,1,.36,1)}
body.page-update .up-rv-stat.is-complete{border-color:var(--green);background:color-mix(in srgb,var(--green) 8%,var(--bg-soft))}
body.page-update .up-rv-stat.is-complete .up-rv-stat-appr{color:var(--green)}
body.page-update .up-rv-stat.is-complete .up-rv-stat-fill{background:var(--green)}
body.page-update .up-rv-stat-bump{animation:upRvStatBump .42s ease}
@keyframes upRvStatBump{0%{transform:scale(1)}35%{transform:scale(1.09)}100%{transform:scale(1)}}
@media (prefers-reduced-motion:reduce){body.page-update .up-rv-stat-bump{animation:none}body.page-update .up-rv-stat-fill{transition:none}}

/* ── Hierarchy Definition workspace inputs ─────────────────── */
body.page-update .up-hd-level-row{display:flex;align-items:center;gap:4px;margin-bottom:4px}
body.page-update .up-hd-level-label{font-size:11px;font-weight:700;color:var(--gray-lt);min-width:56px;text-align:right;flex-shrink:0}
body.page-update .up-hd-level-input{flex:1 1 auto;min-width:0;font-size:13px;font-weight:600;padding:9px 12px;border:1.5px solid var(--border);border-radius:8px;font-family:'DM Sans',sans-serif;color:var(--black);background:var(--bg);transition:border-color .15s;outline:none}
body.page-update .up-hd-level-input:focus{border-color:var(--pink);box-shadow:0 0 0 3px rgba(232,51,109,.08)}
body.page-update .up-hd-move-btn{flex-shrink:0;width:20px;height:20px;box-sizing:border-box;padding:0;display:inline-flex;align-items:center;justify-content:center;font-size:10px;line-height:1;color:var(--gray-lt);background:none;border:1px solid var(--border);border-radius:4px;cursor:pointer;font-family:'DM Sans',sans-serif;transition:color .12s,border-color .12s}
body.page-update .up-hd-move-btn:hover{color:var(--black);border-color:var(--gray-lt)}
body.page-update .up-hd-remove-btn{flex-shrink:0;width:20px;height:20px;box-sizing:border-box;padding:0;display:inline-flex;align-items:center;justify-content:center;font-size:11px;line-height:1;color:var(--gray-lt);background:none;border:1px solid var(--border);border-radius:4px;cursor:pointer;transition:color .12s,border-color .12s}
body.page-update .up-hd-remove-btn:hover{color:var(--pink);border-color:var(--pink)}
body.page-update .up-hd-add-btn{font-size:11px;font-weight:700;color:var(--pink);background:none;border:1.5px dashed var(--pink-mid);border-radius:8px;padding:7px 14px;cursor:pointer;font-family:'DM Sans',sans-serif;transition:color .12s,border-color .12s,background .12s;margin-top:4px;display:inline-flex;align-items:center;gap:4px}
body.page-update .up-hd-add-btn:hover{border-color:var(--pink);background:var(--pink-pale)}
body.page-update .up-hd-metadata-input{width:210px;font-size:13px;font-weight:600;padding:9px 12px;border:1.5px solid var(--border);border-radius:8px;font-family:'DM Sans',sans-serif;color:var(--black);background:var(--bg);transition:border-color .15s;outline:none}
body.page-update .up-hd-metadata-input:focus{border-color:var(--pink);box-shadow:0 0 0 3px rgba(232,51,109,.08)}
body.page-update .up-hd-section-label{font-size:10px;font-weight:700;color:var(--gray-lt);text-transform:uppercase;letter-spacing:.08em;margin-bottom:8px}
body.page-update .up-hd-divider{border:none;border-top:1px solid var(--border-lt);margin:12px 0}
body.page-update .up-hd-confirm-card{background:var(--green-pale);border:1.5px solid var(--green-border);border-radius:12px;padding:16px 20px;margin-top:0}
body.page-update .up-hd-confirm-hdr{font-size:13px;font-weight:700;color:var(--black);margin-bottom:5px}
body.page-update .up-hd-confirm-sub{font-size:11px;color:var(--gray);line-height:1.55}
/* Hierarchy term highlights in right-panel source preview */
body.page-update .up-preview-mark{background:rgba(232,51,109,.18);color:var(--pink);border-radius:3px;padding:0 1px;font-weight:700}

/* ── v2 parser: confidence dots + sequence-break warnings ───────── */
body.page-update .hp-conf-dot{display:inline-block;font-size:8px;margin-right:3px;vertical-align:middle;line-height:1;cursor:default}
body.page-update .hp-conf-med{color:#e8a820}
body.page-update .hp-conf-low{color:var(--pink)}
body.page-update .hp-seq-breaks{margin-top:8px;padding:8px 11px;background:var(--bg-soft);border:1px solid var(--border);border-radius:8px;font-size:10px;color:var(--gray);line-height:1.7}
body.page-update .hp-seq-breaks-hdr{font-size:9px;font-weight:700;color:var(--gray-lt);text-transform:uppercase;letter-spacing:.06em;margin-bottom:4px}
/* Truncation/coverage warning — more urgent visual weight */
body.page-update .hp-seq-breaks.hp-seq-breaks-warn{background:#fff2f5;border-color:var(--pink-mid);color:#c0204e}
body.page-update .hp-seq-breaks.hp-seq-breaks-warn .hp-seq-breaks-hdr{color:#c0204e}
body.page-update .hp-conf-banner{margin-bottom:10px;padding:6px 10px;border-radius:7px;font-size:10px;line-height:1.45;transition:background .3s,color .3s,border-color .3s}
body.page-update .hp-conf-banner-med{background:#fff9ec;color:var(--amber);border:1px solid #f5dea0}
body.page-update .hp-conf-banner-low{background:#fff2f5;color:#c0204e;border:1px solid #faaabf}
body.page-update .hp-conf-banner-ok{background:var(--green-pale);color:var(--green);border:1px solid var(--green-border)}
/* Synthetic (implied) nodes in preview tree */
body.page-update .up-cal-tree .tree-synthetic{opacity:.55;font-style:italic}
/* Synthetic (implied) nodes in review tree */
body.page-update .up-rv-item.rv-synthetic{opacity:.7;border-style:dashed!important;background:var(--bg-soft)!important}
body.page-update .up-rv-item.rv-synthetic .up-rv-title{font-style:italic;color:var(--gray-lt)!important}
body.page-update .up-rv-synth-badge{display:inline-block;font-size:8px;font-weight:600;padding:1px 5px;border-radius:4px;margin-left:5px;vertical-align:middle;line-height:1.5;white-space:nowrap;background:#f0f0f8;color:#6060a0;border:1px solid #c8c8e8;font-style:normal}

/* ── v2 review tree: confidence highlighting ─────────────────────── */
body.page-update .up-rv-item.rv-conf-med{border-color:#f5dea0!important;background:#fffbf0!important}
body.page-update .up-rv-item.rv-conf-low{border-color:var(--pink-mid)!important;background:#fff5f7!important}
/* Source tags */
body.page-update .rv-badge{display:inline-block;font-size:8px;font-weight:700;padding:1px 6px;border-radius:4px;margin-left:5px;vertical-align:middle;line-height:1.5;white-space:nowrap}
body.page-update .rv-badge-manual{background:#e8f0ff;color:#3a5bc7;border:1px solid #c5d3f5}
body.page-update .rv-badge-promoted{background:#f3eaff;color:#7c3aed;border:1px solid #d4b8f7}
/* Split widget */
body.page-update .up-rv-split-wrap{display:none;width:100%;margin-top:6px}
body.page-update .up-rv-split-wrap.rv-splitting{display:block}
body.page-update .up-rv-split-note{font-size:9px;color:var(--gray-lt);margin-bottom:3px;line-height:1.4}
body.page-update .up-rv-split-input{width:100%;font-size:10.5px;font-family:'JetBrains Mono',monospace;padding:6px 9px;border:1.5px solid var(--pink-mid);border-radius:6px;resize:vertical;min-height:56px;outline:none;color:var(--black);background:var(--bg);box-sizing:border-box}
/* Warning rows */
body.page-update .up-rv-warn{padding:8px 10px;border-radius:8px;border:1px solid #f5dea0;background:#fffbf0;margin-bottom:5px}
body.page-update .up-rv-warn-text{font-size:10px;color:var(--amber);font-weight:600;line-height:1.4;margin-bottom:5px}
body.page-update .up-rv-warn-actions{display:flex;gap:4px;flex-wrap:wrap}
/* Candidate rows */
body.page-update .up-rv-cand{padding:8px 10px;border-radius:8px;border:1px solid var(--border);background:var(--bg-soft);margin-bottom:5px}
body.page-update .up-rv-cand-text{font-size:10.5px;font-family:'JetBrains Mono',monospace;color:var(--gray);margin-bottom:5px;line-height:1.5;word-break:break-word}
body.page-update .up-rv-cand-actions{display:flex;gap:4px;flex-wrap:wrap}
/* Section header for warnings/candidates */
body.page-update .up-rv-sec-hdr{font-size:9px;font-weight:700;color:var(--gray-lt);text-transform:uppercase;letter-spacing:.1em;margin-bottom:8px;padding-top:10px;border-top:1px solid var(--border-lt)}
/* Correction tools section (center panel) */
body.page-update .up-hr-tools{margin-top:18px;padding-top:16px;border-top:1px solid var(--border-lt)}
body.page-update .up-hr-add-form{background:var(--bg-soft);border:1px solid var(--border);border-radius:10px;padding:12px 14px;margin-top:10px;display:none}
body.page-update .up-hr-add-form.hr-form-open{display:block}
body.page-update .up-hr-add-label{font-size:9px;font-weight:700;color:var(--gray-lt);text-transform:uppercase;letter-spacing:.08em;margin-bottom:4px}
body.page-update .up-hr-add-select{font-size:12px;font-weight:600;padding:7px 10px;border:1.5px solid var(--border);border-radius:7px;font-family:'DM Sans',sans-serif;color:var(--black);background:var(--bg);outline:none;cursor:pointer;transition:border-color .14s}
body.page-update .up-hr-add-input{width:100%;font-size:12px;padding:7px 10px;border:1.5px solid var(--border);border-radius:7px;font-family:'DM Sans',sans-serif;color:var(--black);background:var(--bg);outline:none;box-sizing:border-box;transition:border-color .14s}
body.page-update .up-hr-add-input:focus,body.page-update .up-hr-add-select:focus{border-color:var(--pink);box-shadow:0 0 0 2px rgba(232,51,109,.08)}

/* ── Issue Queue — center panel ────────────────────────────────── */
body.page-update .up-hr-iq{display:flex;flex-direction:column;gap:0}
body.page-update .up-hr-iq-group{margin-bottom:14px}
body.page-update .up-hr-iq-group-hdr{font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.1em;margin-bottom:8px;display:flex;align-items:center;gap:8px}
body.page-update .up-hr-iq-group-critical{color:var(--pink)}
body.page-update .up-hr-iq-group-warn{color:var(--amber)}
body.page-update .up-hr-iq-group-neutral{color:var(--gray-lt)}
body.page-update .iq-group-count{font-size:9px;font-weight:600;padding:1px 7px;border-radius:100px;background:var(--bg-soft);border:1px solid var(--border);color:var(--gray-lt);text-transform:none;letter-spacing:0}
body.page-update .up-hr-iq-card{padding:7px 10px;border-radius:7px;border:1px solid var(--border);background:var(--bg);margin-bottom:5px;transition:border-color .12s}
body.page-update .up-hr-iq-card:last-child{margin-bottom:0}
body.page-update .up-hr-iq-card.iq-critical{border-color:var(--pink-mid);background:#fff5f7}
body.page-update .up-hr-iq-card.iq-embedded{border-color:#f5c89a;background:#fffaf4}
body.page-update .up-hr-iq-card.iq-embedded .up-hr-iq-title{color:var(--amber)}
body.page-update .up-hr-iq-card.iq-gap{border-color:#f5dea0;background:#fffbf0}
body.page-update .up-hr-iq-card.iq-frag{background:var(--bg-soft)}
body.page-update .up-hr-iq-card.iq-synth{border-style:dashed;background:var(--bg-soft)}
body.page-update .up-hr-iq-card.iq-resolved{border-color:var(--green-border)!important;background:var(--green-pale)!important;opacity:.75}
body.page-update .up-hr-iq-card.iq-resolved .up-hr-iq-title{color:var(--green)!important;font-style:italic}
body.page-update .up-hr-iq-card.iq-resolved .up-hr-iq-title::before{content:'✓ ';font-style:normal}
body.page-update .up-hr-iq-card.iq-resolved .up-hr-iq-meta{color:var(--green);opacity:.7}
body.page-update .up-hr-iq-title{font-size:11px;font-weight:600;color:var(--black);line-height:1.4;margin-bottom:3px}
body.page-update .up-hr-iq-card.iq-critical .up-hr-iq-title{color:#c0204e}
body.page-update .up-hr-iq-card.iq-gap .up-hr-iq-title{color:var(--amber)}
body.page-update .up-hr-iq-meta{font-size:10px;color:var(--gray-lt);line-height:1.5;margin-bottom:3px;word-break:break-word}
body.page-update .up-hr-iq-mono{font-family:'JetBrains Mono',monospace!important;font-size:10.5px!important;font-weight:400!important;word-break:break-word}
body.page-update .up-hr-iq-actions{display:flex;gap:4px;flex-wrap:wrap;margin-top:6px}
body.page-update .iq-resolved-badge{display:inline-block;font-size:8px;font-weight:700;padding:1px 6px;border-radius:4px;margin-left:6px;vertical-align:middle;background:var(--green-pale);color:var(--green);border:1px solid var(--green-border)}
body.page-update .up-hr-iq-empty{font-size:11px;color:var(--gray-lt);font-style:italic;padding:4px 0}

/* Inline issue banners injected onto tree nodes by _calInjectInlineIssues */
body.page-update .iq-inline-wrap{margin:4px 0 2px;display:flex;flex-direction:column;gap:3px;width:100%}
body.page-update .iq-inline-issue{display:flex;flex-direction:column;gap:3px;padding:6px 10px 6px 8px;border-radius:0 4px 4px 0;border-left:3px solid var(--pink);background:var(--bg-soft);font-size:11px;line-height:1.4}
body.page-update .iq-inline-resolved{opacity:.65}
body.page-update .iq-inline-collapsed{padding-top:3px;padding-bottom:3px;gap:0}
body.page-update .iq-inline-collapsed .iq-inline-text{display:none}
body.page-update .iq-inline-collapsed .iq-inline-actions{display:none}
/* Plan Audit: keep Flag/Dismiss visible after a decision so it's reversible in place */
body.page-update .iq-inline-collapsed.iq-inline-keepactions .iq-inline-actions{display:flex}
body.page-update .iq-inline-collapsed .iq-inline-hdr{cursor:pointer}
body.page-update .iq-inline-hdr{display:flex;align-items:center;gap:8px}
body.page-update .iq-inline-label{font-weight:700;font-size:8px;text-transform:uppercase;letter-spacing:.06em;flex-shrink:0}
body.page-update .iq-inline-actions{display:flex;gap:4px;flex-shrink:0;margin-left:auto}
body.page-update .iq-inline-text{color:var(--gray);word-break:break-word}
body.page-update .iq-inline-subtext{color:var(--gray-lt);font-size:10px}

/* AI finding type badge — used in right-panel inline banners */
body.page-update .up-hr-find-type{font-size:8px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;padding:1px 5px;border-radius:3px;border:1px solid currentColor;flex-shrink:0}

/* Issue count status line */
body.page-update .up-hr-issue-status{margin-bottom:10px;min-height:16px}
body.page-update .iq-status-ok{color:var(--green);font-size:11px;font-weight:600}
body.page-update .iq-status-warn{color:var(--pink);font-size:11px;font-weight:600}
body.page-update .iq-status-neutral{color:var(--gray-lt);font-size:11px;font-weight:600}

/* Confidence progress hero (Plan Review center panel) */
body.page-update .up-hr-conf-hero{margin-bottom:14px}
body.page-update .up-hr-conf-hero-row{display:flex;align-items:center;gap:10px;margin-bottom:8px}
body.page-update .up-hr-conf-hero-pct{font-size:34px;font-weight:700;line-height:1;letter-spacing:-.02em;flex-shrink:0}
body.page-update .up-hr-conf-hero-meta{flex:1;min-width:0}
body.page-update .up-hr-conf-hero-lbl{font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--gray-lt);margin-bottom:1px}
body.page-update .up-hr-conf-hero-tier{font-size:13px;font-weight:600}
body.page-update .up-hr-conf-confirmed{font-size:10px;color:var(--green);font-weight:600;flex-shrink:0;white-space:nowrap;background:var(--green-pale);border:1px solid var(--green-border);border-radius:5px;padding:2px 7px}
body.page-update .up-hr-conf-bar-track{height:5px;background:var(--border);border-radius:3px;overflow:hidden;margin-bottom:6px}
body.page-update .up-hr-conf-bar-fill{height:100%;border-radius:3px;transition:width .5s ease}
body.page-update .up-hr-conf-note{font-size:10px;color:var(--pink);line-height:1.4}
/* Auto-match row inside the banner */
body.page-update .up-hr-autorow{display:flex;align-items:center;gap:6px;margin:4px 0 2px;flex-wrap:wrap}
body.page-update .up-hr-autorow-spark{font-size:11px;color:var(--pink);flex-shrink:0}
body.page-update .up-hr-autorow-text{font-size:11px;color:var(--gray);font-weight:600;flex:1;min-width:0}
/* Auto-match toggle pill */
body.page-update .up-hr-automatch-toggle{margin-left:auto;flex-shrink:0;font-size:10px;font-weight:600;padding:2px 8px;border-radius:10px;border:1px solid var(--green);background:var(--green-pale,#f0fdf4);color:var(--green);cursor:pointer;transition:background .15s,color .15s}
body.page-update .up-hr-automatch-toggle.am-off{border-color:var(--border);background:var(--bg-mid);color:var(--gray)}
body.page-update .up-hr-automatch-toggle:hover{opacity:.8}
/* Clear auto-matches link */
body.page-update .up-hr-automatch-clear{font-size:9px;color:var(--gray-lt);background:none;border:none;cursor:pointer;padding:0 2px;text-decoration:underline;flex-shrink:0}
body.page-update .up-hr-automatch-clear:hover{color:var(--pink)}
/* Pending-item nav row */
body.page-update .up-hr-nav-row{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:6px 0 2px;padding:6px 8px;background:#fef9ec;border:1px solid #f0dc9a;border-radius:6px}
body.page-update .up-hr-nav-label{font-size:11px;font-weight:600;color:#7a5c00}
body.page-update .up-hr-nav-btns{display:flex;gap:4px;flex-shrink:0}
body.page-update .up-hr-nav-btn{font-size:11px;font-weight:600;padding:3px 10px;border-radius:5px;border:1px solid #e0c860;background:#fffbe6;color:#7a5c00;cursor:pointer;transition:background .12s}
body.page-update .up-hr-nav-btn:hover{background:#fff3c0;border-color:#c9a800}
/* Flash highlight when nav scrolls to an item */
body.page-update .rv-nav-highlight{outline:2px solid var(--pink)!important;outline-offset:2px;border-radius:7px;transition:outline .1s}

/* Extraction quality tier badge */
body.page-update .up-hr-qual-badge{font-size:9px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;border:1px solid;border-radius:4px;padding:1px 6px}
body.page-update .up-hr-conf-footer{margin-top:4px}
/* Sub-label in tier row — no bold */
body.page-update .up-hr-conf-hero-tier{font-size:12px;font-weight:400;color:var(--gray)}

/* Remaining issues hero */
body.page-update .up-hr-remaining-hero{display:flex;align-items:center;gap:10px;margin-bottom:10px}
body.page-update .up-hr-remaining-num{font-size:34px;font-weight:700;color:var(--pink);line-height:1;letter-spacing:-.02em;flex-shrink:0}
body.page-update .up-hr-remaining-meta{display:flex;flex-direction:column;gap:2px}
body.page-update .up-hr-remaining-lbl{font-size:12px;font-weight:600;color:var(--black)}
body.page-update .up-hr-remaining-detail{font-size:10px;color:var(--gray-lt)}

/* Numbered category rows (compact summary in center panel) */
body.page-update .up-hr-cats{display:flex;flex-direction:column;gap:5px;margin-bottom:14px}
body.page-update .up-hr-cat{display:flex;align-items:center;gap:7px;padding:7px 10px;background:var(--bg);border:1px solid var(--border);border-radius:7px}
body.page-update .up-hr-cat-num{width:16px;height:16px;border-radius:50%;background:var(--border);display:inline-flex;align-items:center;justify-content:center;font-size:9px;font-weight:700;color:var(--gray-mid);flex-shrink:0;line-height:1}
body.page-update .up-hr-cat-label{font-size:11px;font-weight:600;color:var(--black);flex-shrink:0}
body.page-update .up-hr-cat-count{font-size:14px;font-weight:700;flex-shrink:0}
body.page-update .up-hr-cat-detail{font-size:10px;color:var(--gray-lt);flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* Auto-match callout (Plan Review center panel) */
body.page-update .up-hr-automark-row{display:flex;align-items:center;gap:7px;padding:8px 10px;background:#fff8fa;border:1px solid var(--pink-mid);border-radius:7px;margin-bottom:14px}
body.page-update .up-hr-automark-spark{font-size:12px;color:var(--pink);flex-shrink:0}
body.page-update .up-hr-automark-text{font-size:11px;color:var(--gray);font-weight:500}

/* Issue focus — highlight a tree item when navigated from issue queue */
body.page-update .up-rv-item.issue-focus{outline:2px solid var(--pink)!important;outline-offset:1px;animation:iq-focus-pulse 2s ease forwards}
@keyframes iq-focus-pulse{0%,60%{background:var(--pink-pale)!important;border-color:var(--pink)!important}100%{background:inherit;border-color:inherit}}

/* Continue CTA — shown after hierarchy approval */
body.page-update .up-hr-cta-continue{font-size:11px!important;padding:7px 16px!important;display:inline-block}

/* Compact approved bar shown after structure approval */
body.page-update .up-hr-approved-bar{display:flex;align-items:center;gap:12px;padding:8px 12px;background:#f0faf4;border:1px solid #b2dfc4;border-radius:8px;flex-wrap:wrap}
body.page-update .up-hr-approved-label{font-size:11px;font-weight:700;color:#1a7a3f;white-space:nowrap}

/* Phase 1E: Hierarchy role accordion inside Plan Alignment */
/* Hierarchy role toggle (kept for legacy compat, no longer rendered after redesign) */
body.page-update .up-la-hr-toggle{display:flex;align-items:center;gap:6px;width:100%;background:none;border:1.5px solid var(--border);border-radius:7px;padding:7px 10px;font-size:11px;font-weight:700;color:var(--gray);cursor:pointer;font-family:'DM Sans',sans-serif;transition:border-color .12s,color .12s}
body.page-update .up-la-hr-toggle:hover{border-color:var(--gray-lt);color:var(--black)}
body.page-update .up-la-hr-badge{font-size:9px;font-weight:700;padding:1px 6px;border-radius:10px;background:#e8f0fe;color:#1a56db;letter-spacing:.02em}
/* Inline (always-visible) hierarchy role panel — no overflow:hidden, no accordion */
body.page-update .up-la-hr-inline{border:1px solid var(--border);border-radius:7px;overflow:visible;margin-top:0}
body.page-update .up-la-hr-panel{margin-top:6px;border:1px solid var(--border);border-radius:7px;overflow:hidden}
body.page-update .up-la-hr-table{width:100%;border-collapse:collapse;font-size:10px}
body.page-update .up-la-hr-table th{font-size:8px;font-weight:700;text-transform:uppercase;letter-spacing:.07em;color:var(--gray-xlt);padding:5px 8px;background:var(--bg-soft);border-bottom:1px solid var(--border);text-align:left}
body.page-update .up-la-hr-table td{padding:5px 8px;border-bottom:1px solid var(--border-xlt, #f0f0f0);color:var(--gray);vertical-align:middle}
body.page-update .up-la-hr-table tr:last-child td{border-bottom:none}
body.page-update .up-la-hr-table tr.la-hr-container td{background:#fafbff}
body.page-update .up-la-hr-role-btn{font-size:9px;font-weight:700;padding:2px 7px;border-radius:10px;border:1.5px solid var(--border);background:none;cursor:pointer;font-family:'DM Sans',sans-serif;transition:background .12s,border-color .12s,color .12s;color:var(--gray-lt)}
body.page-update .up-la-hr-role-btn.role-active-container{background:#e8f0fe;border-color:#93b4f5;color:#1a56db}
body.page-update .up-la-hr-role-btn.role-active-substantive{background:#f0faf4;border-color:#b2dfc4;color:#1a7a3f}
/* Step 2 structure summary */
body.page-update .up-la-struct-box{background:var(--bg-soft);border:1px solid var(--border);border-radius:7px;padding:10px 14px;margin-bottom:14px}
body.page-update .up-la-struct-lbl{font-size:8px;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--gray-lt);margin-bottom:8px}
body.page-update .up-la-struct-chain{display:flex;align-items:center;gap:4px;flex-wrap:wrap;margin-bottom:5px}
body.page-update .up-la-struct-level{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:700;color:var(--gray)}
body.page-update .up-la-struct-count{font-size:9px;font-weight:700;padding:1px 5px;border-radius:8px;background:#e8f0fe;color:#1a56db;line-height:1.5}
body.page-update .up-la-struct-arrow{font-size:10px;color:var(--gray-lt)}
body.page-update .up-la-struct-total{font-size:10px;color:var(--gray-lt)}
/* Level Roles table explainer footnote */
body.page-update .up-la-hr-explain{font-size:9px;color:var(--gray-lt);padding:6px 9px;border-top:1px solid var(--border-xlt,#f0f0f0);line-height:1.5}
body.page-update .up-la-hr-explain strong{color:var(--gray)}
/* Metadata / attached terms row */
body.page-update .up-la-hr-table tr.la-hr-meta td{background:#fafafa;color:var(--gray-lt)}
body.page-update .up-la-hr-meta-badge{font-size:9px;font-weight:700;padding:2px 7px;border-radius:10px;border:1.5px solid var(--border);background:none;color:var(--gray-lt);letter-spacing:.02em}
/* Post-alignment section label */
body.page-update .up-la-post-section-label{font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--gray-lt);margin-bottom:8px;display:flex;align-items:center;gap:7px}
/* View button on proposal cards */
body.page-update .up-la-prop-view-btn{font-size:9px;font-weight:700;padding:2px 8px;border-radius:5px;border:1.5px solid var(--border);background:none;cursor:pointer;color:var(--gray);font-family:'DM Sans',sans-serif;margin-left:auto;transition:border-color .12s,color .12s}
body.page-update .up-la-prop-view-btn:hover{border-color:var(--pink);color:var(--pink)}

/* ── Alignment step indicator ───────────────────────────────────── */
body.page-update .up-la-step-bar{display:flex;align-items:center;justify-content:flex-start;gap:18px;margin-bottom:22px;padding:9px 12px;background:var(--bg-soft);border:1px solid var(--border);border-radius:8px;overflow:hidden}
body.page-update .up-la-step{display:flex;align-items:center;gap:6px;flex-shrink:0;min-width:0}
body.page-update .up-la-step.active .up-la-step-label{color:var(--black);font-weight:700}
body.page-update .up-la-step.done .up-la-step-label{color:var(--green)}
body.page-update .up-la-step.done{cursor:pointer}
body.page-update .up-la-step.done:hover .up-la-step-label{text-decoration:underline}
body.page-update .up-la-step.pending{opacity:.45}
body.page-update .up-la-step-label{font-size:10.5px;color:var(--gray-lt);transition:color .15s;white-space:nowrap}
body.page-update .up-la-step-num{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:50%;border:1.5px solid var(--border);font-size:9px;font-weight:700;color:var(--gray-lt);background:var(--bg);flex-shrink:0}
body.page-update .up-la-step-num.active{border-color:var(--pink);color:var(--pink);background:#fff8fb}
body.page-update .up-la-step-num.done{border-color:var(--green);color:var(--green);background:#f0faf4;font-size:10px}

/* Advanced (level-roles) disclosure — single-row summary with an explicit expand button */
body.page-update .up-la-adv-summary{display:flex;align-items:center;gap:8px;cursor:pointer;list-style:none;white-space:nowrap;overflow:hidden}
body.page-update .up-la-adv-summary::-webkit-details-marker{display:none}
body.page-update .up-la-adv-btn{display:inline-flex;align-items:center;gap:5px;flex-shrink:0;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--gray);background:var(--bg-soft);border:1px solid var(--border);border-radius:5px;padding:3px 10px}
body.page-update .up-la-adv-summary:hover .up-la-adv-btn{border-color:var(--pink);color:var(--pink)}
body.page-update .up-la-adv-caret{display:inline-block;font-size:9px;transition:transform .15s}
body.page-update details.up-la-adv[open] .up-la-adv-caret{transform:rotate(90deg)}
body.page-update .up-la-adv-desc{font-size:11px;color:var(--gray-lt);overflow:hidden;text-overflow:ellipsis;min-width:0}

/* Element Distribution — horizontal table, one row per element, a column per level */
body.page-update .up-la-dist-table{width:100%;border-collapse:collapse;table-layout:fixed;font-size:10px}
body.page-update .up-la-dist-table th{font-size:8.5px;font-weight:700;text-transform:uppercase;letter-spacing:.03em;color:var(--gray-lt);padding:2px 4px;border-bottom:1px solid var(--border)}
body.page-update .up-la-dist-table td{padding:3px 4px;border-bottom:1px solid var(--border-lt,#eee);color:var(--gray-lt);vertical-align:middle}
body.page-update .up-la-dist-table th.num,body.page-update .up-la-dist-table td.num{width:40px;text-align:right}
body.page-update .up-la-dist-table th.tot,body.page-update .up-la-dist-table td.tot{color:var(--black);font-weight:700}
body.page-update .up-la-dist-table td.nm{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.page-update .up-la-dist-code{display:inline-block;font-size:8px;font-weight:700;padding:1px 5px;border-radius:3px;background:var(--pink-pale);color:var(--pink);border:1px solid var(--pink-mid);margin-right:5px;vertical-align:middle}
body.page-update .up-la-dist-table td.num .z{color:var(--gray-xlt,#c8c8c8)}
body.page-update .up-la-dist-row.nav{cursor:pointer}
body.page-update .up-la-dist-row.nav:hover td{background:var(--pink-pale)}
body.page-update .up-la-dist-row.nav:hover .up-la-dist-code{background:var(--pink);color:#fff}
@keyframes upLaNavFlash{0%{background:var(--pink-pale)}100%{background:transparent}}
body.page-update .up-la-nav-flash{animation:upLaNavFlash 1.4s ease-out;border-radius:6px}

/* ── Container definition rows (Step 1) ─────────────────────────── */
body.page-update .up-la-cont-row{display:flex;align-items:center;gap:8px;padding:3px 10px;border:1px solid var(--border);border-radius:6px;margin-bottom:4px;background:var(--bg)}
body.page-update .up-la-cont-drag{flex-shrink:0;cursor:grab;color:var(--gray-xlt,#c0c0c0);font-size:12px;line-height:1;user-select:none;touch-action:none;padding:2px 1px}
body.page-update .up-la-cont-drag:active{cursor:grabbing}
body.page-update .up-la-cont-row:hover .up-la-cont-drag{color:var(--gray-lt)}
body.page-update .up-la-cont-dragging{background:var(--pink-pale,#fff8fb);border-color:var(--pink-mid,#f9bfd8);box-shadow:0 4px 14px rgba(0,0,0,.16);position:relative;z-index:3}
body.up-la-reordering{user-select:none;cursor:grabbing}
body.page-update .up-la-cont-name{font-size:11px;color:var(--gray);font-weight:500;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
body.page-update .up-la-cont-code-inp{font-size:10px;font-weight:700;font-family:'DM Sans',sans-serif;color:var(--pink);background:var(--pink-pale,#fff8fb);border:1.5px solid var(--pink-mid,#f9bfd8);border-radius:5px;padding:2px 7px;width:62px;text-align:center;text-transform:uppercase;outline:none;transition:border-color .12s}
body.page-update .up-la-cont-code-inp:focus{border-color:var(--pink)}
body.page-update .up-la-cont-count{font-size:10px;color:var(--gray-lt);flex-shrink:0;white-space:nowrap}
body.page-update .up-la-cont-remove{background:none;border:none;cursor:pointer;font-size:14px;color:var(--gray-lt);padding:0 2px;line-height:1;opacity:0;transition:opacity .12s,color .12s;flex-shrink:0}
body.page-update .up-la-cont-row:hover .up-la-cont-remove{opacity:1}
body.page-update .up-la-cont-remove:hover{color:var(--red,#c0392b)}
body.page-update .up-la-cont-notice{font-size:11px;color:var(--gray-lt);font-style:italic;padding:10px 0;line-height:1.5}
body.page-update .up-la-cont-add-inp{font-size:11px;padding:5px 9px;border:1.5px solid var(--border);border-radius:6px;outline:none;font-family:'DM Sans',sans-serif;color:var(--gray)}
body.page-update .up-la-cont-add-inp:focus{border-color:var(--pink)}
body.page-update .up-la-cont-add-code{text-transform:uppercase;font-weight:700;color:var(--pink)}

/* ── Confirmed container summary (Step 2) ───────────────────────── */
body.page-update .up-la-cont-confirmed{display:flex;align-items:flex-start;flex-direction:column;gap:8px;padding:10px 12px;background:var(--green-pale,#f0faf4);border:1px solid var(--green-border,#b2dfc4);border-radius:8px}
body.page-update .up-la-cont-confirmed-label{font-size:10px;font-weight:700;color:var(--green);letter-spacing:.01em}
body.page-update .up-la-cont-chips{display:flex;flex-wrap:wrap;gap:5px}
body.page-update .up-la-cont-chip{display:inline-flex;align-items:center;gap:5px;font-size:10px;color:var(--gray);padding:2px 8px 2px 4px;border:1px solid var(--border);border-radius:10px;background:var(--bg)}
body.page-update .up-la-cont-chip-code{font-size:9px;font-weight:700;color:var(--pink);background:var(--pink-pale,#fff8fb);border:1px solid var(--pink-mid,#f9bfd8);border-radius:7px;padding:1px 5px}
body.page-update .up-la-cont-redefine{font-size:10px;color:var(--gray-lt);background:none;border:none;cursor:pointer;text-decoration:underline;padding:0;font-family:'DM Sans',sans-serif}
body.page-update .up-la-cont-redefine:hover{color:var(--gray)}

/* Issue count summary row above queue */
body.page-update .up-hr-iq-summary{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:10px;padding:6px 8px;background:var(--bg-soft);border-radius:7px;border:1px solid var(--border)}
body.page-update .up-hr-iq-summary-chip{font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.07em;padding:2px 7px;border-radius:12px;white-space:nowrap}
body.page-update .up-hr-iq-summary-chip.chip-crit{background:#fff0f4;color:var(--pink);border:1px solid var(--pink-mid)}
body.page-update .up-hr-iq-summary-chip.chip-high{background:#fff0f4;color:var(--pink);border:1px solid var(--pink-mid)}
body.page-update .up-hr-iq-summary-chip.chip-med{background:#fff9ec;color:var(--amber);border:1px solid #f5dea0}
body.page-update .up-hr-iq-summary-chip.chip-low{background:var(--bg-soft);color:var(--gray-lt);border:1px solid var(--border)}
body.page-update .up-hr-iq-summary-chip.chip-ok{background:#f0faf4;color:#1a7a3f;border:1px solid #b2dfc4}

/* Body text preview in review tree */
/* Body text — always own full-width row, below title + actions */
body.page-update .up-rv-body{width:100%;flex-basis:100%;font-size:10.5px;color:var(--gray);line-height:1.5;margin-top:6px;padding:5px 8px;background:var(--bg-soft);border-radius:5px;border-left:2px solid var(--border);word-break:break-word;position:relative;white-space:pre-wrap}
body.page-update .up-rv-body-rest{}
body.page-update .up-rv-body-toggle{background:none;border:none;padding:0 2px;font-size:9px;color:var(--pink);cursor:pointer;margin-left:3px;vertical-align:middle}
body.page-update .up-rv-body-toggle:hover{text-decoration:underline}
/* Table-like body (flattened table data detected) */
body.page-update .up-rv-body.up-rv-body-table{border-left-color:#4a90d9;background:#f4f8ff;font-size:10px;color:var(--gray-dark);flex-wrap:wrap;gap:6px}
body.page-update .up-rv-body-table-badge{display:inline-block;font-size:8px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:#7a5c00;background:#ffe87a;border-radius:4px;padding:1px 5px;margin-right:6px;vertical-align:middle;flex-shrink:0}
/* Bullet list body — integrated inside Plan Review card, no gray box */
body.page-update .up-rv-body.up-rv-body-bullets{background:transparent;border:none;border-left:2px solid var(--border);padding:0 0 0 10px;margin-top:4px;flex-direction:column;align-items:flex-start;gap:2px}
body.page-update .up-rv-body-bullet-list{margin:0;padding:0 0 0 14px;list-style:disc;font-size:12px;color:var(--gray);line-height:1.55;width:100%}
body.page-update .up-rv-body-bullet-list li{padding:1px 0}
body.page-update .up-rv-body.up-rv-body-bullets .up-rv-body-btns{margin-top:4px;opacity:0;transition:opacity .12s}
body.page-update .up-rv-item:hover .up-rv-body.up-rv-body-bullets .up-rv-body-btns{opacity:1}
/* Pipe-table toggle button (collapsed by default) */
body.page-update .up-rv-table-toggle{display:inline-flex;align-items:center;gap:5px;font-size:9px;font-weight:700;color:#1a4a7a;background:#deeafc;border:1px solid #b3cef0;border-radius:5px;padding:2px 8px;cursor:pointer;font-family:'DM Sans',sans-serif;letter-spacing:.03em;margin-bottom:2px}
body.page-update .up-rv-table-toggle:hover{background:#c7e0ff}
body.page-update .up-rv-table-toggle.up-rv-table-open{background:#b3cef0}
body.page-update .up-rv-table-rowcount{font-weight:400;opacity:.75}
body.page-update .up-rv-table-wrap{width:100%;overflow-x:auto;margin-top:2px}
/* Inline pipe-table rendering inside Plan Review body boxes */
body.page-update .up-rv-body-pipe-table{width:100%;border-collapse:collapse;font-size:10px;margin:4px 0 2px;font-family:'DM Sans',sans-serif}
/* Recognized table title / caption */
body.page-update .up-rv-body-table-caption{caption-side:top;text-align:left;font-weight:700;font-size:11px;color:var(--gray-dark,#3a3a3a);padding:3px 2px;font-family:'DM Sans',sans-serif;letter-spacing:.01em}
body.page-update .up-rv-body-table-caption.up-rv-table-cap-bottom{caption-side:bottom;font-weight:400;font-style:italic;font-size:10px;color:var(--gray);padding-top:4px}
body.page-update .up-rv-body-pipe-table th{background:#deeafc;font-weight:700;color:#1a3a6a;text-align:left;padding:3px 7px;border:1px solid #b3cef0;font-size:9px;text-transform:uppercase;letter-spacing:.04em}
body.page-update .up-rv-body-pipe-table th[colspan]{text-align:center;font-size:10px;letter-spacing:.02em;background:#c7d9f5}
body.page-update .up-rv-body-pipe-table td{padding:3px 7px;border:1px solid #d0e2f5;vertical-align:top;color:var(--gray-dark);line-height:1.35}
body.page-update .up-rv-body-pipe-table tr:nth-child(even) td{background:#edf4ff}
/* Body action buttons (edit, extract) — appear inline after body text */
body.page-update .up-rv-body-btns{display:inline-flex;gap:3px;margin-left:6px;vertical-align:middle;flex-shrink:0}
body.page-update .up-rv-body-act-btn{font-size:9px;padding:1px 6px;border:1px solid var(--border);border-radius:4px;background:var(--bg);color:var(--gray);cursor:pointer;white-space:nowrap;line-height:1.5}
body.page-update .up-rv-body-act-btn:hover{background:var(--bg-mid);border-color:var(--gray-xlt)}
body.page-update .up-rv-body-extract-btn{border-color:#f5c89a;color:var(--amber);background:#fffaf4}
body.page-update .up-rv-body-extract-btn:hover{background:#fff0e0}
body.page-update .up-rv-body-absorb-btn{border-color:#b8d8f0;color:#1a5c8a;background:#f0f8ff}
body.page-update .up-rv-body-absorb-btn:hover{background:#dceefa}
body.page-update .up-rv-body-delete-btn{border-color:#fac8d0;color:#c0204e;background:#fff5f7}
body.page-update .up-rv-body-delete-btn:hover{background:#ffe0e6}
body.page-update .up-rv-body-narr-btn{border-color:#d4bef5;color:#6b3fa0;background:#f8f2ff}
body.page-update .up-rv-body-narr-btn:hover{background:#ede5fa}
/* Narrative body — clean policy-like card, no buttons, DM Sans font */
/* ── Break card (§ section divider broken out from body box) ── */
body.page-update .up-rv-break-card{display:flex;flex-direction:column;gap:0;padding:8px 10px;margin:4px 0;border:1px dashed var(--border);border-radius:6px;background:var(--bg-soft)}
body.page-update .up-rv-break-card:hover{border-color:var(--gray-lt)}
body.page-update .up-rv-break-card.rv-approved{border-color:var(--green-border)!important;background:var(--green-pale)!important;border-style:solid!important}
body.page-update .up-rv-break-header{display:flex;align-items:center;gap:6px;flex:1;min-width:0}
body.page-update .up-rv-break-icon{font-size:10px;font-weight:700;color:var(--gray-lt);flex-shrink:0}
body.page-update .up-rv-break-title{font-size:11px;font-weight:600;color:var(--gray);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:120px}
body.page-update .up-rv-break-unlabeled{color:var(--gray-lt);font-weight:400;font-style:italic}
/* Type selector — replaces the old static SECTION badge */
body.page-update .up-rv-break-type-sel{font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--gray);background:var(--bg);border:1px solid var(--border);border-radius:4px;padding:1px 4px;flex-shrink:0;cursor:pointer;outline:none;height:20px}
body.page-update .up-rv-break-type-sel:focus{border-color:var(--pink)}
/* Approve button active state (when the card is already approved) */
body.page-update .up-rv-break-approve-btn.up-rv-break-approved-active{color:var(--green)!important;font-weight:700}
/* Always show actions on approved break cards so the user can toggle approval */
body.page-update .up-rv-break-card.rv-approved .up-rv-break-actions{opacity:1}
body.page-update .up-rv-break-actions{margin-left:auto;flex-shrink:0;opacity:0;transition:opacity .12s}
body.page-update .up-rv-break-card:hover .up-rv-break-actions{opacity:1}
body.page-update .up-rv-break-body{margin-top:6px;padding-left:2px}
body.page-update .up-rv-break-body-list{margin:0 0 0 16px;padding:0;list-style:disc;font-size:12px;color:var(--gray);line-height:1.55}
body.page-update .up-rv-break-body-prose{font-size:12px;color:var(--gray);line-height:1.55;white-space:pre-wrap}
body.page-update .up-rv-break-rename-wrap{display:flex;align-items:center;gap:4px;padding:6px 0 2px;width:100%}
body.page-update .up-rv-break-rename-input{flex:1;font-size:11px;padding:2px 6px;border:1px solid var(--border);border-radius:4px;outline:none}
body.page-update .up-rv-break-rename-input:focus{border-color:var(--pink)}
/* Absorbed body: content stays formatted, toolbar removed */
/* Absorbed body: structural reset (both manual + auto). Bullets/tables preserved. */
body.page-update .up-rv-body.up-rv-body-absorbed{background:transparent;border:none;padding:0;margin-top:6px;display:block}
body.page-update .up-rv-body.up-rv-body-absorbed .up-rv-body-bullet-list{margin-left:18px;list-style:disc}
/* MANUAL absorb reads as a continuation of the item above — it INHERITS that
   item's text style PER LEVEL (mirrors .up-rv-title), not a fixed size, and shows
   the ENTIRE text (no …more collapse). Base is a fallback for uncovered levels. */
body.page-update .up-rv-body.up-rv-body-absorbed-manual{font-family:'DM Sans',sans-serif;font-size:13px;color:var(--gray-dark,#3a3a3a);line-height:1.55;white-space:pre-wrap}
body.page-update .up-rv-l1 .up-rv-body.up-rv-body-absorbed-manual{font-family:'DM Serif Display',serif;font-size:19px;font-weight:400;color:var(--black);line-height:1.3}
body.page-update .up-rv-item.rv-labeled.up-rv-l1 .up-rv-body.up-rv-body-absorbed-manual{font-family:'DM Sans',sans-serif;font-size:15px;font-weight:700}
body.page-update .up-rv-l2 .up-rv-body.up-rv-body-absorbed-manual{font-family:'DM Sans',sans-serif;font-size:14px;font-weight:600;color:var(--black);line-height:1.45}
body.page-update .up-rv-l3 .up-rv-body.up-rv-body-absorbed-manual{font-family:'DM Sans',sans-serif;font-size:13px;font-weight:500;color:var(--gray-dark,#3a3a3a);line-height:1.55}
body.page-update .up-rv-l4 .up-rv-body.up-rv-body-absorbed-manual{font-family:'DM Sans',sans-serif;font-size:12.5px;font-weight:400;color:var(--gray);line-height:1.55}
body.page-update .up-rv-body.up-rv-body-absorbed-manual .up-rv-body-preview,
body.page-update .up-rv-body.up-rv-body-absorbed-manual .up-rv-body-rest{font:inherit;color:inherit}
/* Show the full absorbed text — reveal the truncated remainder, drop the toggle */
body.page-update .up-rv-body.up-rv-body-absorbed-manual .up-rv-body-rest{display:inline!important}
body.page-update .up-rv-body.up-rv-body-absorbed-manual .up-rv-body-toggle{display:none}
body.page-update .up-rv-body-unabsorb-btn{display:none;font-size:9px;color:var(--gray-lt);background:none;border:none;cursor:pointer;padding:2px 0;text-decoration:underline}
body.page-update .up-rv-item:hover .up-rv-body-unabsorb-btn{display:inline}
/* ⎋ Break button in body box */
body.page-update .up-rv-body-break-btn{color:#7a5c00!important;background:#fff8e0!important;border-color:#e8d88a!important}
body.page-update .up-rv-body-break-btn:hover{background:#fff1b8!important;border-color:#c9b94a!important}
/* ✓ Keep — approve a body block to stay as-is */
body.page-update .up-rv-body-keep-btn{color:var(--green)!important;background:var(--green-pale)!important;border-color:var(--green-border)!important;font-weight:600}
body.page-update .up-rv-body-keep-btn:hover{background:color-mix(in srgb,var(--green) 16%,var(--bg))!important;border-color:var(--green)!important}
/* Kept body: content stays; ✓ kept badge doubles as undo (shows on hover) */
body.page-update .up-rv-body.up-rv-body-kept{background:transparent;border:none;border-left:2px solid var(--green);padding:2px 0 2px 8px;margin-top:4px;display:block}
body.page-update .up-rv-body.up-rv-body-kept .up-rv-body-bullet-list{margin-left:18px}
body.page-update .up-rv-body-kept-badge{display:inline-block;margin-top:3px;font-size:9px;font-weight:600;color:var(--green);background:var(--green-pale);border:1px solid var(--green-border);border-radius:4px;padding:1px 6px;cursor:pointer;line-height:1.5}
body.page-update .up-rv-body-kept-badge:hover{background:color-mix(in srgb,var(--green) 16%,var(--bg))}
body.page-update .up-rv-body.up-rv-body-narr-mode{display:flex;align-items:flex-start;gap:8px;padding:6px 8px;border-left:2px solid #c0a8e8;border-top:none;border-right:none;border-bottom:none;background:transparent;border-radius:0;margin-top:4px;font-style:normal!important;white-space:normal}
body.page-update .up-rv-body.up-rv-body-narr-mode.up-rv-body-narr-accepted{border-left-color:var(--green)}
body.page-update .up-rv-body-narr-pill{flex-shrink:0;background:none;border:none;padding:0;font-size:12px;color:#b09ad4;cursor:pointer;line-height:1.4;margin-top:1px}
body.page-update .up-rv-body-narr-pill:hover{color:#6b3fa0}
body.page-update .up-rv-body-narr-text{flex:1;font-family:'DM Sans',sans-serif;font-size:13px;font-weight:400;font-style:normal!important;color:var(--gray-dark,#444);line-height:1.55}
body.page-update .up-rv-body-narr-accept-btn{flex-shrink:0;background:none;border:1px solid var(--border);border-radius:4px;padding:1px 7px;font-size:12px;color:var(--gray-mid);cursor:pointer;line-height:1.4;margin-top:1px;transition:background .15s,border-color .15s,color .15s}
body.page-update .up-rv-body-narr-accept-btn:hover{background:var(--green-pale);border-color:var(--green-border);color:var(--green)}
/* Edit / Delete on narrative text blocks — parity with other items */
body.page-update .up-rv-body-narr-actions{flex-shrink:0;display:inline-flex;align-items:center;gap:4px;margin-top:1px}
body.page-update .up-rv-body-narr-icon{background:none;border:1px solid var(--border);border-radius:4px;padding:1px 6px;font-size:11px;color:var(--gray-mid);cursor:pointer;line-height:1.4;transition:background .15s,border-color .15s,color .15s}
body.page-update .up-rv-body-narr-icon:hover{background:var(--bg-mid);border-color:var(--gray-xlt);color:var(--gray)}
body.page-update .up-rv-body-narr-del:hover{background:#fff0f4;border-color:var(--pink-mid);color:var(--pink)}
/* Once accepted, hide Edit/Delete (leave only ✓ to undo) — like approved items */
body.page-update .up-rv-body.up-rv-body-narr-accepted .up-rv-body-narr-icon{display:none}
body.page-update .up-rv-body-narr-accept-btn.narr-accepted{background:var(--green-pale);border-color:var(--green-border);color:var(--green);font-weight:600}
/* Move up/down reorder buttons (inside more panel) */
body.page-update .up-rv-move-btn{color:var(--gray-mid);border-color:var(--border);background:var(--bg-soft);padding:1px 6px;font-size:10px;min-width:22px}
body.page-update .up-rv-move-btn:hover{background:#e8e8ee;color:var(--black)}
/* Add-after button (inside more panel) */
body.page-update .up-rv-add-after-btn{font-weight:600;color:var(--green)!important;border-color:var(--green-border)!important;background:var(--green-pale)!important}
body.page-update .up-rv-add-after-btn:hover{background:#d8f2e2!important}
/* Delete button — red tint, subtle */
body.page-update .up-rv-delete-btn{color:#b33;border-color:#e9b8b8;background:#fff5f5}
body.page-update .up-rv-delete-btn:hover{background:#fde8e8;border-color:#c87a7a}
/* Skip button — pushed right inside more panel */
body.page-update .up-rv-skip-btn{margin-left:auto}
/* Alignment mode: hide review-only controls */
body.page-update .up-mode-alignment .up-rv-skip-btn{display:none}
body.page-update .up-mode-alignment .up-rv-move-btn{display:none}
/* Edit/more toggle button */
body.page-update .up-rv-edit-btn{color:var(--gray-mid);border-color:var(--border);background:var(--bg-soft)}
body.page-update .up-rv-edit-btn:hover,.up-rv-edit-btn.mp-active{background:#e8e8ee;color:var(--black)}
/* Accept button — always rightmost, weighted */
body.page-update .up-rv-accept-btn{font-weight:600}
/* More / Edit panel — collapsible secondary actions row */
body.page-update .up-rv-more-panel{display:none;width:100%;flex-basis:100%;flex-wrap:wrap;align-items:center;gap:4px;padding:6px 0 2px;margin-top:4px;border-top:1px solid var(--border)}
body.page-update .up-rv-more-panel.mp-open{display:flex}
/* Inline body edit wrap */
body.page-update .up-rv-body-edit-wrap{display:none;width:100%;flex-basis:100%;margin-top:6px;border:1.5px solid var(--pink-mid);border-radius:7px;overflow:hidden;background:var(--bg)}
body.page-update .up-rv-body-edit-wrap.bew-open{display:block}
/* Hide the read-only body card while its edit textarea is open */
body.page-update .up-rv-body.bew-active{display:none}
body.page-update .up-rv-body-edit-input{width:100%;font-size:11px;font-family:'JetBrains Mono',monospace;padding:8px 10px;border:none;background:var(--bg);color:var(--black);resize:vertical;min-height:72px;outline:none;box-sizing:border-box;line-height:1.5}
body.page-update .up-rv-body-edit-btns{display:flex;gap:4px;padding:5px 8px;background:var(--bg-soft);border-top:1px solid var(--border)}
/* Inline extract wrap */
body.page-update .up-rv-body-extract-wrap{display:none;width:100%;flex-basis:100%;margin-top:6px;border:1.5px solid #f5c89a;border-radius:7px;padding:10px 12px;background:#fffaf4}
body.page-update .up-rv-body-extract-wrap.bxw-open{display:block}
body.page-update .up-rv-body-extract-hdr{font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--amber);margin-bottom:7px}
body.page-update .up-rv-body-extract-input{width:100%;font-size:11px;font-family:'JetBrains Mono',monospace;padding:6px 9px;border:1.5px solid #f5c89a;border-radius:6px;background:var(--bg);color:var(--black);outline:none;box-sizing:border-box;margin-bottom:7px}
body.page-update .up-rv-body-extract-input:focus{border-color:#c57a00}
body.page-update .up-rv-body-extract-levels{display:flex;align-items:center;gap:4px;flex-wrap:wrap;margin-bottom:7px}
body.page-update .up-rv-body-extract-level-lbl{font-size:9px;color:var(--gray-lt);margin-right:2px}

/* Unattached text cards in issue queue */
body.page-update .up-hr-iq-card.iq-unattached{border-color:#cac8e8;background:#f9f8ff}

/* Strikethrough items — proposed deletions from source document */
body.page-update .up-rv-item.rv-strikethrough{border-left-color:#f59e0b;background:#fffbeb!important}
body.page-update .rv-title-strikethrough{text-decoration:line-through;opacity:.65}
body.page-update .rv-badge-strikethrough{display:inline-flex;align-items:center;font-size:8px;font-weight:700;padding:1px 6px;border-radius:100px;background:#fef3c7;color:#92400e;border:1px solid #fcd34d;margin-left:5px;vertical-align:middle;white-space:nowrap;cursor:default}

/* Auto-marked items — visually distinct from green manual approval */
body.page-update .up-rv-item.rv-automarked{border-left-color:#7ba3e8}
body.page-update .rv-badge-auto{display:inline-flex;align-items:center;font-size:8px;font-weight:700;padding:1px 6px;border-radius:100px;background:#dde8ff;color:#3a5bc7;border:1px solid #a8bfe8;margin-left:5px;vertical-align:middle;white-space:nowrap;cursor:default}
body.page-update .rv-btn-auto-accept{color:#3a5bc7!important;border-color:#a8bfe8!important;font-weight:600}
body.page-update .rv-btn-auto-accept:hover{background:#e8f0ff!important;border-color:#7ba3e8!important}

/* Pattern auto-mark summary line (center panel) */
body.page-update .up-hr-pattern-status{font-size:10px;margin-bottom:8px;min-height:14px}
body.page-update .up-hr-pattern-note{color:#3a5bc7;font-weight:600}

/* ── Plan Audit panel ──────────────────────────────────────────── */

/* Risk summary block */
body.page-update .up-sa-risk{background:var(--bg-soft);border:1px solid var(--border);border-radius:9px;padding:12px 14px;margin-bottom:16px}
body.page-update .up-sa-risk:empty{display:none}

/* Confidence hero — prominent progress indicator */
body.page-update .up-sa-conf-hero{padding-bottom:12px;border-bottom:1px solid var(--border);margin-bottom:12px}
body.page-update .up-sa-conf-hero-row{display:flex;align-items:center;gap:12px;margin-bottom:8px}
body.page-update .up-sa-conf-hero-pct{font-size:34px;font-weight:700;line-height:1;letter-spacing:-.02em;flex-shrink:0}
body.page-update .up-sa-conf-hero-meta{display:flex;flex-direction:column;gap:1px}
body.page-update .up-sa-conf-hero-lbl{font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--gray-lt)}
body.page-update .up-sa-conf-hero-tier{font-size:13px;font-weight:600}
body.page-update .up-sa-conf-bar-track{height:5px;background:var(--border);border-radius:3px;overflow:hidden}
body.page-update .up-sa-conf-bar-fill{height:100%;border-radius:3px;transition:width .5s ease}
body.page-update .up-sa-conf-cov{font-size:10px;color:var(--gray-lt);margin-top:5px}
body.page-update .up-sa-review-chip{font-size:9px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:2px 7px;border-radius:4px;background:var(--green-pale);border:1px solid var(--green-border);color:var(--green);flex-shrink:0;margin-left:auto;white-space:nowrap}
body.page-update .up-sa-review-chip.up-sa-review-chip-partial{background:var(--bg-soft);border-color:var(--border);color:var(--gray-lt)}

/* Auto-detection callout (app-at-work indicator) */
body.page-update .up-sa-automark-row{display:flex;align-items:center;gap:7px;padding:8px 10px;background:#fff8fa;border:1px solid var(--pink-mid);border-radius:7px;margin-bottom:10px}
body.page-update .up-sa-automark-spark{font-size:13px;color:var(--pink);flex-shrink:0}
body.page-update .up-sa-automark-text{font-size:11px;color:var(--gray);font-weight:500}

/* Dynamic issues-remaining count */
body.page-update .up-sa-issues-count{font-size:13px;font-weight:700;color:var(--pink);margin-bottom:10px}
body.page-update .up-sa-issues-clear{color:var(--green)}

/* Numbered issue categories */
body.page-update .up-sa-cats{display:flex;flex-direction:column;gap:7px}
body.page-update .up-sa-cat{background:var(--bg);border:1px solid var(--border);border-radius:8px;padding:9px 11px}
body.page-update .up-sa-cat-hdr{display:flex;align-items:center;gap:6px;margin-bottom:4px;flex-wrap:wrap}
body.page-update .up-sa-cat-num{width:17px;height:17px;border-radius:50%;background:var(--border);display:inline-flex;align-items:center;justify-content:center;font-size:9px;font-weight:700;color:var(--gray-mid);flex-shrink:0;line-height:1}
body.page-update .up-sa-cat-label{font-size:11px;font-weight:600;color:var(--black);flex:1;min-width:0}
body.page-update .up-sa-cat-count{font-size:14px;font-weight:700;flex-shrink:0}
body.page-update .up-sa-cat-auto{font-size:9px;font-weight:700;color:var(--pink);text-transform:uppercase;letter-spacing:.05em;flex-shrink:0}
body.page-update .up-sa-cat-items{font-size:10px;color:var(--gray-lt);line-height:1.5}

/* Controls (run / skip) */
body.page-update .up-sa-controls{margin-bottom:12px}

/* Running state spinner */
body.page-update .up-sa-running{display:flex;flex-direction:column;align-items:flex-start;gap:6px;padding:14px 0}
body.page-update .up-sa-spinner{width:20px;height:20px;border:2px solid var(--border);border-top-color:var(--pink);border-radius:50%;animation:sa-spin .7s linear infinite}
@keyframes sa-spin{to{transform:rotate(360deg)}}

/* Results section — remaining-issues hero */
body.page-update .up-sa-results-hero{padding:10px 12px;background:var(--bg-soft);border:1px solid var(--border);border-radius:8px;margin-bottom:12px}
body.page-update .up-sa-results-hero-row{display:flex;align-items:center;gap:12px}
body.page-update .up-sa-results-remaining{font-size:32px;font-weight:700;line-height:1;letter-spacing:-.02em;flex-shrink:0}
body.page-update .up-sa-results-hero-meta{display:flex;flex-direction:column;gap:2px}
body.page-update .up-sa-results-hero-lbl{font-size:12px;font-weight:600;color:var(--black)}
body.page-update .up-sa-results-hero-detail{font-size:10px;color:var(--gray-lt)}
body.page-update .up-sa-results-hdr{font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--gray-lt);margin-bottom:10px}
body.page-update .up-sa-result-card{padding:9px 12px;border-radius:8px;border:1px solid var(--border);background:var(--bg);margin-bottom:7px}
body.page-update .up-sa-result-card:last-child{margin-bottom:0}
body.page-update .up-sa-rc-label{font-size:10px;font-weight:700;margin-bottom:4px}
body.page-update .up-sa-rc-body{font-size:11px;color:var(--gray);line-height:1.5}
body.page-update .up-sa-rc-example{font-size:10px;font-family:'JetBrains Mono',monospace;color:var(--gray-lt);background:var(--bg-soft);padding:2px 6px;border-radius:4px;margin-top:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
body.page-update .up-sa-rc-conf{font-size:9px;color:var(--pink);font-weight:700;margin-left:6px}

/* Card color variants */
body.page-update .up-sa-card-ok{border-color:var(--green-border);background:#f0faf4}
body.page-update .up-sa-card-ok .up-sa-rc-label{color:var(--green)}
body.page-update .up-sa-card-med{border-color:#f5dea0;background:#fffbf0}
body.page-update .up-sa-card-med .up-sa-rc-label{color:var(--amber)}
body.page-update .up-sa-card-high{border-color:#cac8e8;background:#f0f0ff}
body.page-update .up-sa-card-high .up-sa-rc-label{color:var(--pink)}
body.page-update .up-sa-card-crit{border-color:var(--pink-mid);background:#fff5f7}
body.page-update .up-sa-card-crit .up-sa-rc-label{color:var(--pink)}

/* Placeholder notice */
body.page-update .up-sa-placeholder-note{font-size:9px;color:var(--gray-lt);font-style:italic;text-align:center;margin-top:10px;padding:6px;background:var(--bg-soft);border-radius:6px;border:1px solid var(--border)}

/* ── Plan Audit: AI suggestion cards ───────────────────────── */

/* Summary bar */
body.page-update .sa-summary-bar{display:flex;align-items:flex-start;gap:8px;padding:9px 12px;background:var(--bg-soft);border:1px solid var(--border);border-radius:8px;margin-bottom:6px;flex-wrap:wrap}
body.page-update .sa-sg-risk-badge{font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;flex-shrink:0;padding-top:1px}
body.page-update .sa-summary-text{font-size:11px;color:var(--gray);line-height:1.5;flex:1;min-width:0}
body.page-update .sa-quality-notes{font-size:10px;color:var(--gray);line-height:1.5;padding:6px 12px 6px 12px;background:#fffbf0;border:1px solid #f5dea0;border-radius:6px;margin-bottom:12px}

/* Plan Readiness Score hero + category bars */
body.page-update .up-sa-readiness-hero{padding:12px 14px;background:var(--bg-soft);border:1px solid var(--border);border-radius:10px;margin-bottom:12px;--rd-good:var(--green);--rd-needs:var(--pink);--rd-na:var(--gray-400,#9aa0a6);--rd-fair-bar:#e39a1e;--rd-fair-ink:var(--amber)}
[data-theme="dark"] body.page-update .up-sa-readiness-hero{--rd-fair-bar:#e6ab48}
body.page-update .up-sa-readiness-top{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;margin-bottom:2px}
body.page-update .up-sa-readiness-lbl{font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--gray-lt);margin-bottom:2px}
body.page-update .up-sa-readiness-score{font-size:28px;font-weight:800;line-height:1;letter-spacing:-.03em;white-space:nowrap}
body.page-update .up-sa-readiness-tier{font-size:12px;font-weight:700;letter-spacing:0;margin-left:6px}
/* Right column: review-complete pill + the "what this score means" note stacked
   underneath it, filling the space beside the score instead of squeezing under it. */
body.page-update .up-sa-readiness-right{display:flex;flex-direction:column;align-items:flex-end;gap:5px;flex-shrink:0}
body.page-update .up-sa-readiness-sub{font-size:10.5px;color:var(--gray-lt);line-height:1.4;text-align:left;max-width:190px}
/* In the gauge layout the info column is left-aligned, so the chip shouldn't push right */
body.page-update .up-sa-gauge-info .up-sa-review-chip{margin-left:0}
body.page-update .up-sa-gauge-info .up-sa-dismiss-note{margin:0}
/* Honesty note: what dismissed findings are adding to the score */
body.page-update .up-sa-dismiss-note{font-size:10px;color:var(--amber,#b45309);background:#fff9ec;border:1px solid #f5dea0;border-radius:6px;padding:4px 8px;margin:0 0 8px;line-height:1.45;cursor:help}
body.page-update .up-sa-dismiss-note b{font-weight:800}
/* Category dot-bar rows */
body.page-update .up-sa-cat-rows{display:flex;flex-direction:column;gap:7px}
body.page-update .up-sa-cat-row{display:flex;flex-direction:column;gap:5px}
body.page-update .up-sa-cat-row-head{display:flex;align-items:center;gap:6px;width:100%}
/* Clickable category → its findings group */
body.page-update .up-sa-cat-row-link{cursor:pointer;border-radius:5px;margin:0 -4px;padding:1px 4px;transition:background .12s}
body.page-update .up-sa-cat-row-link:hover{background:var(--bg-soft)}
body.page-update .up-sa-cat-row-link:hover .up-sa-cat-row-lbl{color:var(--pink)}
/* Flash the target findings group when jumped to */
body.page-update .sa-fgroup-flash{animation:saFgroupFlash 1.4s ease}
@keyframes saFgroupFlash{0%,100%{background:transparent}15%{background:var(--pink-pale)}}
@media (prefers-reduced-motion:reduce){body.page-update .sa-fgroup-flash{animation:none}}
body.page-update .up-sa-cat-row-lbl{font-size:10px;font-weight:500;color:var(--gray);min-width:90px;flex-shrink:0}
body.page-update .up-sa-cat-row-dots{display:flex;gap:2px;flex:1}
body.page-update .up-sa-dot{width:10px;height:10px;border-radius:2px;background:var(--border);flex-shrink:0}
body.page-update .up-sa-dot.up-sa-dot-on{background:var(--green)}
body.page-update .up-sa-cat-row-score{font-size:10px;font-weight:700;min-width:26px;text-align:right;flex-shrink:0}
body.page-update .up-sa-cat-row-na{color:var(--gray-400,#9aa0a6);font-weight:600;font-style:italic;font-size:9px}
/* Radial gauge headline */
body.page-update .up-sa-gauge-row{display:flex;align-items:center;gap:14px;margin-bottom:12px}
body.page-update .up-sa-gauge{width:86px;height:86px;flex-shrink:0}
body.page-update .up-sa-gauge-num{font-size:32px;font-weight:800;letter-spacing:-.03em}
body.page-update .up-sa-gauge-tier{font-size:11px;font-weight:700}
body.page-update .up-sa-gauge-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:5px;align-items:flex-start}
/* Semantic status rows (word leads, number secondary, slim calm bar) */
body.page-update .up-sa-cat-bar{width:100%;height:7px;border-radius:5px;background:var(--border);overflow:hidden;display:block}
body.page-update .up-sa-cat-bar-fill{display:block;height:100%;border-radius:5px}
body.page-update .up-sa-cat-bar-na{border:1px dashed var(--gray-300,#cbd0d6);background:transparent;box-sizing:border-box}
body.page-update .up-sa-cat-statuswrap{display:flex;align-items:baseline;gap:6px;justify-content:flex-end;margin-left:auto;flex-shrink:0}
body.page-update .up-sa-cat-status{font-size:11px;font-weight:600;white-space:nowrap}
body.page-update .up-sa-cat-status-na{color:var(--gray-400,#9aa0a6);font-style:italic;font-weight:500}
body.page-update .up-sa-cat-num{font-size:10px;color:var(--gray-lt);min-width:22px;text-align:right}
/* Expandable per-dimension explainer */
body.page-update .up-sa-cat-group{display:flex;flex-direction:column}
body.page-update .up-sa-cat-row-caret{font-size:8px;color:var(--gray-400,#9aa0a6);width:9px;flex-shrink:0;transition:transform .12s;line-height:1}
body.page-update .up-sa-cat-row-open .up-sa-cat-row-caret{transform:rotate(90deg)}
body.page-update .up-sa-cat-row-lbl{min-width:98px}
body.page-update .up-sa-cat-explain{margin:2px 0 4px 15px;padding:7px 9px;border-left:2px solid var(--border);background:var(--bg-soft);border-radius:0 5px 5px 0}
body.page-update .up-sa-cat-explain-blurb{font-size:10px;color:var(--black);line-height:1.4}
body.page-update .up-sa-cat-explain-stat{font-size:10px;font-weight:600;color:var(--gray);margin-top:3px}
body.page-update .up-sa-cat-explain-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:6px}
body.page-update .up-sa-cat-explain-wt{font-size:9px;color:var(--gray-400,#9aa0a6);text-transform:uppercase;letter-spacing:.03em;white-space:nowrap}
body.page-update .up-sa-cat-explain-link{font-size:10px;font-weight:600;color:var(--pink);cursor:pointer;white-space:nowrap}
body.page-update .up-sa-cat-explain-link:hover{text-decoration:underline}
body.page-update .up-sa-cat-explain-none{font-size:9px;color:var(--gray-400,#9aa0a6);font-style:italic}
/* Per-dimension Prev/Next finding nav inside the explainer */
body.page-update .up-sa-cat-nav{display:flex;align-items:center;gap:5px;white-space:nowrap}
body.page-update .up-sa-cat-nav-count{font-size:9px;font-weight:600;color:var(--gray);margin-right:1px}
body.page-update .up-sa-cat-nav-btn{font-size:9px;font-weight:600;color:var(--pink);background:var(--surface,#fff);border:1px solid var(--pink-mid,#f3c6d1);border-radius:4px;padding:2px 6px;cursor:pointer;transition:background .12s,color .12s}
body.page-update .up-sa-cat-nav-btn:hover{background:var(--pink);color:#fff;border-color:var(--pink)}
/* Issue summary chips */
body.page-update .up-sa-chip-row{display:flex;gap:5px;flex-wrap:wrap;margin-bottom:10px}
body.page-update .up-sa-chip{font-size:9px;font-weight:600;padding:3px 7px;border-radius:100px;border:1px solid var(--border);color:var(--gray)}
body.page-update .up-sa-chip-struct{background:#fff9ec;color:var(--amber);border-color:#f5dea0}
body.page-update .up-sa-chip-impl{background:#fff0f3;color:var(--pink);border-color:var(--pink-mid)}
body.page-update .up-sa-chip-meas{background:#f0f0ff;color:var(--pink);border-color:#cac8e8}
body.page-update .up-sa-chip-elem{background:#f0f4ff;color:#3060c8;border-color:#c8d8f8}
body.page-update .up-sa-chip-content{background:var(--bg-soft);color:var(--gray-lt);border-color:var(--border)}
/* sub-metrics row */
body.page-update .up-sa-sub-metrics{display:flex;gap:8px;flex-wrap:wrap}
body.page-update .up-sa-sub-metric{font-size:9px;font-weight:600;padding:2px 6px;border-radius:4px;background:var(--bg);border:1px solid var(--border);color:var(--gray-lt)}

/* suggestedFix inline hint */
body.page-update .sa-sg-fix-suggestion{font-size:10px;color:#3060c8;background:#eef3ff;border:1px solid #c8d8f8;border-radius:5px;padding:5px 8px;margin:4px 0 3px;line-height:1.5}

/* Suggestion card */
body.page-update .sa-suggestion-card{padding:10px 12px;border-radius:8px;border:1px solid var(--border);background:var(--bg);margin-bottom:8px;transition:opacity .15s,border-color .15s,background .15s}
body.page-update .sa-suggestion-card.sa-sg-accepted{opacity:.65;border-color:var(--green-border);background:#f0faf4}
body.page-update .sa-suggestion-card.sa-sg-rejected{opacity:.38;background:var(--bg-soft)}

/* Card header: type badge + conf badge + title */
body.page-update .sa-sg-header{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-bottom:6px}
body.page-update .sa-sg-title{font-size:11px;font-weight:600;color:var(--black);flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* Type badges */
body.page-update .sa-sg-type-badge{font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;padding:2px 6px;border-radius:4px;flex-shrink:0;white-space:nowrap}
body.page-update .sa-sg-type-badge.sg-type-attach{background:#e8f0ff;color:#3060c8}
body.page-update .sa-sg-type-badge.sg-type-promote{background:#edf9e8;color:#3a7a28}
body.page-update .sa-sg-type-badge.sg-type-narrative{background:var(--bg-soft);color:var(--gray-mid)}
body.page-update .sa-sg-type-badge.sg-type-synthetic{background:#f0f0ff;color:var(--pink)}
body.page-update .sa-sg-type-badge.sg-type-warn{background:#fff8dc;color:var(--amber)}
body.page-update .sa-sg-type-badge.sg-type-crit{background:#fff0f3;color:var(--pink)}
body.page-update .sa-sg-type-badge.sg-type-conf{background:var(--bg-soft);color:var(--gray-mid)}
body.page-update .sa-sg-type-badge.sg-type-ok{background:#f0faf4;color:var(--green)}
body.page-update .sa-sg-type-badge.sg-type-quality{background:#f0f4ff;color:#3060c8}
body.page-update .sa-sg-type-badge.sg-type-impl{background:#fff0f3;color:var(--pink);border-color:var(--pink-mid)}
body.page-update .sa-sg-type-badge.sg-type-align{background:#eef8f0;color:var(--green);border-color:var(--green-border)}

/* Finding group headers */
body.page-update .sa-finding-group{margin-bottom:16px}
body.page-update .sa-finding-group-hdr{font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--gray-lt);padding:6px 0 7px;border-bottom:1px solid var(--border);margin-bottom:8px;display:flex;align-items:center;gap:6px}
body.page-update .sa-finding-group-ct{background:var(--bg-soft);border:1px solid var(--border);border-radius:100px;padding:1px 6px;font-size:9px;font-weight:700;color:var(--gray-lt);letter-spacing:0;text-transform:none;margin-left:auto}

/* Confidence badges */
body.page-update .sa-sg-conf-badge{font-size:9px;padding:2px 5px;border-radius:4px;border:1px solid;flex-shrink:0;text-transform:uppercase;letter-spacing:.04em;white-space:nowrap}
body.page-update .sa-sg-conf-badge.sa-sg-conf-high{color:var(--green);border-color:var(--green-border)}
body.page-update .sa-sg-conf-badge.sa-sg-conf-medium{color:var(--amber);border-color:#f5dea0}
body.page-update .sa-sg-conf-badge.sa-sg-conf-low{color:var(--gray-lt);border-color:var(--border)}

/* Rationale, target, meta */
body.page-update .sa-sg-rationale{font-size:11px;color:var(--gray);line-height:1.5;margin-bottom:5px}
body.page-update .sa-sg-target{font-size:10px;color:var(--gray-lt);margin-bottom:3px}
body.page-update .sa-sg-meta{font-size:10px;color:var(--gray-lt);margin-bottom:3px}
body.page-update .sa-sg-target code,body.page-update .sa-sg-meta code{font-family:'JetBrains Mono',monospace;font-size:9px;background:var(--bg-soft);padding:1px 4px;border-radius:3px;border:1px solid var(--border)}

/* Suggestion action buttons */
body.page-update .sa-sg-actions{display:flex;gap:6px;align-items:center;margin-top:7px;flex-wrap:wrap}
/* Base reset for all SA action buttons */
body.page-update .sa-sg-fix-btn,body.page-update .sa-sg-improve-btn,body.page-update .sa-sg-accept-btn,body.page-update .sa-sg-reject-btn,body.page-update .sa-sg-focus-btn,body.page-update .sa-sg-undo-btn,body.page-update .sa-sg-accepted-lbl,body.page-update .sa-sg-rejected-lbl,body.page-update .sa-sg-applied-lbl,body.page-update .sa-sg-needs-review-lbl{font-size:10px;padding:4px 9px;border-radius:5px;border:1px solid var(--border);cursor:pointer;background:var(--bg-soft);color:var(--gray);font-family:inherit;line-height:1.3}
/* Fix — blue (structural correction) */
body.page-update .sa-sg-fix-btn{color:#3060c8;border-color:#c8d8f8;background:#eef3ff}
body.page-update .sa-sg-fix-btn:hover{background:#dce8ff}
/* Improve — green (soft refinement) */
body.page-update .sa-sg-improve-btn{color:var(--green);border-color:var(--green-border);background:#f0faf4}
body.page-update .sa-sg-improve-btn:hover{background:#d8f5e4}
/* Accept */
body.page-update .sa-sg-accept-btn{color:var(--green);border-color:var(--green-border);background:#f0faf4}
body.page-update .sa-sg-accept-btn:hover{background:#d8f5e4}
/* Ignore */
body.page-update .sa-sg-reject-btn{color:var(--gray-lt)}
body.page-update .sa-sg-reject-btn:hover{background:var(--border)}
/* View */
body.page-update .sa-sg-focus-btn{color:var(--pink);border-color:var(--pink-mid);background:#fff5f9}
body.page-update .sa-sg-focus-btn:hover{background:#e4e4ff}
/* Undo */
body.page-update .sa-sg-undo-btn{color:var(--gray-lt);border-color:var(--border)}
body.page-update .sa-sg-undo-btn:hover{background:var(--border);color:var(--gray)}
/* Status label chips (non-interactive) */
body.page-update .sa-sg-accepted-lbl{color:var(--green);border-color:var(--green-border);background:#f0faf4;cursor:default}
body.page-update .sa-sg-rejected-lbl{color:var(--gray-lt);border-color:var(--border);cursor:default}
/* Phase 2E decision buttons + labels */
body.page-update .sa-sg-needswork-btn{background:#f0faf4;color:var(--green);border:1px solid var(--green-border)}
body.page-update .sa-sg-defer-btn{background:var(--bg-soft);color:var(--gray-mid);border:1px solid var(--border)}
body.page-update .sa-sg-needswork-lbl{font-size:9px;font-weight:700;color:var(--green);background:#f0faf4;border:1px solid var(--green-border);border-radius:4px;padding:2px 7px;white-space:nowrap}
body.page-update .sa-sg-deferred-lbl{font-size:9px;font-weight:700;color:var(--gray-lt);background:var(--bg-soft);border:1px solid var(--border);border-radius:4px;padding:2px 7px;white-space:nowrap}
body.page-update .sa-suggestion-card.sa-sg-needs-work-queued{background:#f0faf4;border-color:var(--green-border)}
body.page-update .sa-suggestion-card.sa-sg-deferred{opacity:0.7}
body.page-update .sa-sg-applied-lbl{color:#3060c8;border-color:#c8d8f8;background:#eef3ff;cursor:default}
body.page-update .sa-sg-needs-review-lbl{color:var(--amber);border-color:#f5dea0;background:#fff8dc;cursor:default}
/* "Resolve manually" note */
body.page-update .sa-sg-manual-note{font-size:10px;color:var(--gray-lt);font-style:italic;align-self:center}
/* Applied card state */
body.page-update .sa-suggestion-card.sa-sg-applied{border-color:#c8d8f8;background:#eef3ff}
/* Needs-review card state */
body.page-update .sa-suggestion-card.sa-sg-needs-review{border-color:#f5dea0;background:#fffbf0}
/* Not-found transient message */
body.page-update .sa-not-found-msg{font-size:10px;color:var(--pink);background:#fff0f3;border:1px solid var(--pink-mid);border-radius:6px;padding:6px 10px;margin-bottom:8px;animation:sa-fade-out 3.5s ease forwards}
@keyframes sa-fade-out{0%,70%{opacity:1}100%{opacity:0}}

/* Conversation thread */
body.page-update .sa-messages{display:flex;flex-direction:column;gap:6px;max-height:180px;overflow-y:auto;padding:4px 0;margin-top:14px;margin-bottom:6px}
body.page-update .sa-msg{font-size:11px;line-height:1.5;padding:7px 10px;border-radius:7px;max-width:95%;word-break:break-word}
body.page-update .sa-msg-ai{background:var(--bg-soft);border:1px solid var(--border);color:var(--gray);align-self:flex-start}
body.page-update .sa-msg-user{background:#f0f0ff;border:1px solid #cac8e8;color:#3030a0;align-self:flex-end;text-align:right}

/* Follow-up input bar */
body.page-update .sa-followup-bar{display:flex;gap:6px;align-items:center;padding:8px 0 0;border-top:1px solid var(--border);margin-top:4px}
body.page-update .sa-followup-input{flex:1;min-width:0;font-size:11px;font-family:inherit;padding:6px 9px;border:1px solid var(--border);border-radius:6px;background:var(--bg);color:var(--black);outline:none}
body.page-update .sa-followup-input:focus{border-color:var(--gray-mid)}
body.page-update .sa-followup-send{font-size:11px;padding:6px 13px;border:1px solid var(--border);border-radius:6px;background:var(--bg-soft);color:var(--gray);cursor:pointer;font-family:inherit;flex-shrink:0;white-space:nowrap}
body.page-update .sa-followup-send:hover{background:var(--border)}
body.page-update .sa-followup-send:disabled{opacity:.45;cursor:default}

/* Audit-focus highlight (applied by _calSAFocusNode, removed after 3s) */
@keyframes audit-focus-pulse{
  0%{box-shadow:0 0 0 0 rgba(200,60,100,.35)}
  40%{box-shadow:0 0 0 5px rgba(200,60,100,.12)}
  100%{box-shadow:0 0 0 0 rgba(200,60,100,0)}
}
body.page-update .audit-focus{animation:audit-focus-pulse 1.1s ease 2;border-color:var(--pink-mid)!important;background:#fff8fa!important}

/* ── Plan Update Workspace ──────────────────────────────────────────── */
body.page-update .up-uw-search{width:100%;max-width:260px;padding:6px 10px;font-size:11px;font-family:'DM Sans',sans-serif;border:1px solid var(--border);border-radius:7px;background:var(--bg);color:var(--black);outline:none}
body.page-update .up-uw-search:focus{border-color:var(--pink-mid)}
body.page-update .up-uw-group{margin-bottom:10px}
body.page-update .up-uw-group-hdr{font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--gray-lt);padding:4px 0 5px;border-bottom:1px solid var(--border);margin-bottom:4px}
body.page-update .up-uw-item{padding:8px 10px;border-radius:8px;border:1px solid var(--border);background:var(--bg);cursor:pointer;margin-bottom:4px;transition:border-color .1s,background .1s}
body.page-update .up-uw-item:hover{border-color:var(--pink-mid);background:var(--pink-pale)}
body.page-update .up-uw-item-sel{border-color:var(--pink-mid)!important;background:var(--pink-pale)!important}
body.page-update .up-uw-section{margin-bottom:12px}
body.page-update .up-uw-section-label{font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--gray-lt);margin-bottom:4px}
body.page-update .up-uw-section-group{border:1px solid var(--border);border-radius:9px;padding:12px 14px;margin-bottom:14px}
body.page-update .up-uw-section-group-label{font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--gray);margin-bottom:10px}

/* Audit guidance — acknowledged audit recommendations carried into the item box */
body.page-update .up-uw-guidance{border:1px solid var(--pink-mid);border-radius:8px;background:var(--pink-pale);margin-bottom:14px;overflow:hidden}
body.page-update .up-uw-guid-sum{display:flex;align-items:center;gap:7px;padding:8px 11px;cursor:pointer;list-style:none;user-select:none}
body.page-update .up-uw-guid-sum::-webkit-details-marker{display:none}
body.page-update .up-uw-guid-spark{font-size:11px;color:var(--pink);flex-shrink:0}
body.page-update .up-uw-guid-lbl{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--pink);flex:1}
body.page-update .up-uw-guid-count{font-size:10px;font-weight:700;color:#fff;background:var(--pink);border-radius:100px;min-width:16px;height:16px;padding:0 5px;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}
body.page-update .up-uw-guid-chev{font-size:10px;color:var(--pink);transition:transform .15s;flex-shrink:0}
body.page-update .up-uw-guidance[open] .up-uw-guid-chev{transform:rotate(90deg)}
body.page-update .up-uw-guid-body{padding:2px 11px 10px;border-top:1px solid var(--pink-mid)}
body.page-update .up-uw-guid-item{padding:8px 0;border-bottom:1px dashed var(--border)}
body.page-update .up-uw-guid-item:last-child{border-bottom:none}
body.page-update .up-uw-guid-type{font-size:8px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--pink);margin-bottom:3px}
body.page-update .up-uw-guid-title{font-size:11px;font-weight:600;color:var(--black);line-height:1.4;margin-bottom:3px}
body.page-update .up-uw-guid-action{font-size:11px;color:var(--gray);line-height:1.5}

/* Spark generation row — Phase 1A */
body.page-update .up-uw-spark-row{display:flex;align-items:center;gap:5px;flex-wrap:wrap;padding:3px 0 10px;margin-top:-6px}
body.page-update .up-uw-spark-row-label{font-size:10px;font-weight:700;color:var(--pink);flex-shrink:0;opacity:.7;margin-right:1px}
body.page-update .up-uw-spark-btn{font-size:10px;font-weight:600;padding:3px 9px;border-radius:100px;border:1.5px solid var(--pink-mid);background:var(--pink-pale);color:var(--pink);cursor:pointer;font-family:inherit;line-height:1.3;transition:background .12s,border-color .12s,color .12s;white-space:nowrap}
body.page-update .up-uw-spark-btn:hover{background:var(--pink-mid);border-color:var(--pink)}
body.page-update .up-uw-spark-btn.up-uw-spark-btn-gen{background:var(--bg-soft);border-color:var(--border);color:var(--gray)}
body.page-update .up-uw-spark-btn.up-uw-spark-btn-gen:hover{background:var(--pink-pale);border-color:var(--pink-mid);color:var(--pink)}

/* Spark undo toast — fixed bottom-right, auto-dismisses */
.up-uw-spark-undo-toast{position:fixed;bottom:20px;right:20px;background:var(--black,#111);color:#fff;font-size:11px;padding:9px 14px;border-radius:8px;display:flex;align-items:center;gap:8px;z-index:9999;box-shadow:0 4px 20px rgba(0,0,0,.3);animation:up-uw-toast-in .2s ease}
@keyframes up-uw-toast-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
.up-uw-spark-undo-btn{background:none;border:1px solid rgba(255,255,255,.3);color:#fff;font-size:10px;font-weight:600;padding:3px 9px;border-radius:5px;cursor:pointer;font-family:inherit;line-height:1.4;transition:background .12s}
.up-uw-spark-undo-btn:hover{background:rgba(255,255,255,.18)}

/* ══ Phase 1C: Live Plan Preview, Breadcrumb, View Toggle ══════════════════ */

/* View toggle bar */
body.page-update .up-uw-view-toggle-bar{display:flex;align-items:center;margin-bottom:6px}
body.page-update .up-uw-view-toggle{display:flex;gap:2px;opacity:.65;transition:opacity .15s}
body.page-update .up-uw-view-toggle:hover{opacity:1}
body.page-update .up-uw-vt-btn{font-size:9px;font-weight:500;padding:3px 9px;border-radius:100px;border:1px solid transparent;background:none;color:var(--gray-lt);cursor:pointer;font-family:inherit;transition:all .15s;line-height:1.3}
body.page-update .up-uw-vt-btn:hover{color:var(--gray);border-color:var(--border)}
body.page-update .up-uw-vt-btn.up-uw-vt-on{background:var(--bg-soft);color:var(--gray);border-color:var(--border)}

/* Breadcrumb */
body.page-update .up-uw-breadcrumb-row{display:flex;align-items:center;flex-wrap:wrap;gap:2px;padding:4px 0 8px;min-height:24px}
body.page-update .up-uw-bc-elem{font-size:9px;font-weight:700;padding:2px 6px;border-radius:3px;background:var(--pink-pale);color:var(--pink);font-family:'JetBrains Mono',monospace}
body.page-update .up-uw-bc-sep{font-size:9px;color:var(--gray-xlt);padding:0 1px}
body.page-update .up-uw-bc-anc{font-size:10px;color:var(--gray-lt);background:none;border:none;cursor:pointer;font-family:inherit;padding:0;transition:color .1s}
body.page-update .up-uw-bc-anc:hover{color:var(--pink)}
body.page-update .up-uw-bc-cur{font-size:10px;color:var(--black);font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:160px;display:inline-flex;align-items:center;gap:3px}
body.page-update .up-uw-bc-anc{display:inline-flex;align-items:center;gap:3px}
body.page-update .up-uw-bc-type{font-size:8px;font-weight:700;color:var(--gray-xlt);text-transform:uppercase;letter-spacing:.04em;flex-shrink:0}

/* Plan preview container */
body.page-update .up-uw-preview > .up-uw-pv-*{font-size:11px}

/* Element headers */
body.page-update .up-uw-pv-elem{margin-bottom:2px}
body.page-update .up-uw-pv-elem-hdr{display:flex;align-items:center;gap:6px;padding:5px 6px;border-radius:6px;cursor:pointer;background:var(--bg-soft);border:1px solid var(--border);transition:background .1s;user-select:none}
body.page-update .up-uw-pv-elem-hdr:hover{background:var(--bg-mid)}
body.page-update .up-uw-pv-elem.up-uw-pv-path > .up-uw-pv-elem-hdr{border-color:var(--pink-mid);background:var(--pink-pale)}
body.page-update .up-uw-pv-elem-id{font-size:8px;font-weight:600;font-family:'JetBrains Mono',monospace;color:var(--gray-xlt);min-width:0;flex-shrink:0;letter-spacing:.03em}
body.page-update .up-uw-pv-elem-name{font-size:11px;font-weight:700;color:var(--black);flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
body.page-update .up-uw-pv-elem-n{font-size:9px;color:var(--gray-xlt);flex-shrink:0}
body.page-update .up-uw-pv-elem-chg{font-size:8px;font-weight:700;padding:1px 5px;border-radius:100px;background:var(--pink-pale);color:var(--pink);flex-shrink:0}
body.page-update .up-uw-pv-elem-chev{font-size:8px;color:var(--gray-xlt);flex-shrink:0}
body.page-update .up-uw-pv-elem-body{padding:3px 0 3px 4px;border-left:2px solid var(--border);margin-left:8px;margin-bottom:4px}

/* Node rows */
body.page-update .up-uw-pv-node{border-radius:4px;cursor:pointer;transition:background .1s}
body.page-update .up-uw-pv-node:hover{background:var(--bg-soft)}
body.page-update .up-uw-pv-node.up-uw-pv-sel{background:var(--pink-pale);border-left:2px solid var(--pink);margin-left:-2px}
body.page-update .up-uw-pv-node.up-uw-pv-path > .up-uw-pv-node-row .up-uw-pv-text{color:var(--black)}
body.page-update .up-uw-pv-node.up-uw-pv-retired{opacity:.5}
body.page-update .up-uw-pv-node.up-uw-pv-container > .up-uw-pv-node-row .up-uw-pv-type{color:var(--gray-xlt);font-style:italic}
body.page-update .up-uw-pv-node.up-uw-pv-container > .up-uw-pv-node-row .up-uw-pv-text{color:var(--gray-lt);font-weight:600;font-size:9px;text-transform:uppercase;letter-spacing:.04em}
body.page-update .up-uw-pv-node-row{display:flex;align-items:center;gap:5px;padding:3px 6px 3px 0;min-height:22px}
body.page-update .up-uw-pv-dot{width:6px;height:6px;border-radius:50%;flex-shrink:0}
body.page-update .up-uw-pv-type{font-size:8px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--gray-xlt);min-width:36px;flex-shrink:0}
body.page-update .up-uw-pv-type.up-uw-pv-type-dim{font-size:7px;font-weight:500;text-transform:none;letter-spacing:0;opacity:.45;min-width:28px}
body.page-update .up-uw-pv-text{font-size:10px;color:var(--gray);flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.4}
body.page-update .up-uw-pv-sel .up-uw-pv-text{color:var(--pink);font-weight:600}
body.page-update .up-uw-pv-tog{background:none;border:none;color:var(--gray-xlt);font-size:8px;cursor:pointer;padding:0 2px;flex-shrink:0;line-height:1;transition:color .1s}
body.page-update .up-uw-pv-tog:hover{color:var(--gray)}

/* Replacement chain indicators */
body.page-update .up-uw-pv-chain{font-size:9px;color:var(--gray-xlt);padding:1px 6px 3px;font-style:italic}
body.page-update .up-uw-pv-chain-new{color:var(--gray-lt)}

/* ── Phase 2A: Document view (pv2-) — Create Experience Convergence ── */
/* Visual reference: Create right panel. Capability reference: Update workspace. */

/* Element sections — chapter rhythm */
body.page-update .pv2-elem{margin-bottom:20px}
body.page-update .pv2-elem-hdr{display:flex;align-items:center;gap:8px;padding:12px 10px 6px;cursor:pointer;background:transparent;border:none;margin-top:24px;transition:opacity .1s;user-select:none}
body.page-update .pv2-elem:first-child .pv2-elem-hdr{margin-top:8px}
body.page-update .pv2-elem-hdr:hover{opacity:.8}
body.page-update .pv2-elem.pv2-elem-path > .pv2-elem-hdr .pv2-elem-name{color:var(--pink)}
/* Element name leads — chapter heading */
body.page-update .pv2-elem-name{font-size:15px;font-weight:700;color:var(--black);order:1;flex:1;min-width:0}
/* Element code chip — quiet identifier, trails the name */
body.page-update .pv2-elem-code{font-family:'JetBrains Mono',monospace;font-size:9px;font-weight:700;color:var(--pink);background:var(--pink-pale);border:1px solid var(--pink-mid);padding:2px 6px;border-radius:100px;flex-shrink:0;letter-spacing:.03em;order:2}
body.page-update .pv2-elem-n{font-size:9px;color:var(--gray-xlt);flex-shrink:0;opacity:.6;order:4}
body.page-update .pv2-elem-chg{font-size:8px;font-weight:700;padding:1px 5px;border-radius:100px;background:var(--pink-pale);color:var(--pink);flex-shrink:0;order:3}
body.page-update .pv2-elem-chev{font-size:8px;color:var(--gray-xlt);flex-shrink:0;order:5}
/* Element body — left-border for depth orientation */
body.page-update .pv2-elem-body{padding:2px 0 8px 0;margin-top:2px;margin-bottom:4px}

/* Node — ambient status via left-border, not filled pills */
body.page-update .pv2-node{border-radius:3px;cursor:pointer;border-left:3px solid transparent;transition:background .1s,border-color .12s}
body.page-update .pv2-node:hover{background:var(--bg-soft)}
body.page-update .pv2-node.pv2-node-sel{background:var(--bg-soft);box-shadow:inset 0 0 0 1px var(--border)}
body.page-update .pv2-node.pv2-node-path > .pv2-doc-row .pv2-text{color:var(--black)}
body.page-update .pv2-node.pv2-node-retired{opacity:.45}
body.page-update .pv2-node.pv2-node-container{cursor:default;border-left-color:transparent!important}
/* Goal separator — chapter rhythm */
body.page-update .pv2-node.pv2-node-goal{margin-top:36px;border-top:1px solid var(--border-lt,#eee)}
body.page-update .pv2-elem-body > .pv2-node.pv2-node-goal:first-child{margin-top:10px;border-top:none}
/* Action metadata */
body.page-update .pv2-action-meta{display:flex;align-items:center;gap:5px;margin-top:3px;flex-wrap:wrap}
body.page-update .pv2-meta-tag{font-size:9px;color:var(--gray-xlt);font-weight:500}
body.page-update .pv2-meta-sep{font-size:9px;color:var(--gray-xlt);opacity:.4}
/* Cross-element impact pills */
body.page-update .pv2-impact-pills{display:flex;align-items:center;gap:3px;flex-wrap:wrap;margin-top:4px}
body.page-update .pv2-impact-pill{font-size:8px;font-weight:600;padding:1px 6px;border-radius:100px;background:var(--bg-mid,#f5f5f5);color:var(--gray-lt);border:1px solid var(--border);white-space:nowrap;cursor:default;line-height:1.5}
body.page-update .pv2-impact-pill-hidden{display:none}
body.page-update .pv2-impact-pills.pv2-pills-expanded .pv2-impact-pill-hidden{display:inline-block}
body.page-update .pv2-impact-more{font-size:8px;font-weight:600;color:var(--gray-xlt);background:none;border:none;cursor:pointer;padding:1px 3px;font-family:inherit;line-height:1.5;transition:color .1s}
body.page-update .pv2-impact-more:hover{color:var(--gray)}
/* Status ambient: colored left-border communicates change state */
body.page-update .pv2-node[data-status="Revise"]{border-left-color:var(--amber,#f59e0b)}
body.page-update .pv2-node[data-status="Replace"]{border-left-color:#c2410c}
body.page-update .pv2-node[data-status="Remove"]{border-left-color:var(--pink)}
body.page-update .pv2-node[data-status="New"]{border-left-color:#1d4ed8}

/* Container headers — section dividers */
body.page-update .pv2-container-hdr{display:flex;align-items:center;gap:8px;padding:7px 10px;user-select:none;background:var(--bg-soft);border-radius:6px;border:1px solid var(--border);margin:4px 0}
body.page-update .pv2-container-label{font-size:12px;font-weight:600;color:var(--gray);flex:1;min-width:0}
body.page-update .doc-container-badge{font-family:'JetBrains Mono',monospace;font-size:9.5px;font-weight:700;background:var(--gray);color:#fff;padding:3px 8px;border-radius:100px;white-space:nowrap;flex-shrink:0}
body.page-update .pv2-tog{background:none;border:none;color:var(--gray-xlt);font-size:8px;cursor:pointer;padding:0 3px;line-height:1;flex-shrink:0;transition:color .1s}
body.page-update .pv2-tog:hover{color:var(--gray)}
body.page-update .pv2-tog-ph{display:inline-block;width:16px}

/* Status dot — ambient micro-signal, subdued */
body.page-update .pv2-status-dot{display:inline-block;width:6px;height:6px;border-radius:50%;flex-shrink:0;margin-right:2px;opacity:.4}

/* Doc row — 3-col grid: [44px number] [1fr content] [28px controls] */
body.page-update .pv2-doc-row{display:grid;grid-template-columns:64px 1fr 52px;align-items:flex-start;min-height:32px}
body.page-update .pv2-num-col{display:flex;flex-direction:column;align-items:flex-end;padding:7px 8px 5px 0;gap:3px;flex-shrink:0}
body.page-update .pv2-doc-content{padding:7px 4px 5px 0;min-width:0}
body.page-update .pv2-doc-controls{display:flex;flex-direction:row;align-items:center;justify-content:flex-end;padding:6px 6px 5px 2px;gap:5px;opacity:0.4;transition:opacity .12s;width:52px}
body.page-update .pv2-node:hover .pv2-doc-controls{opacity:1}
body.page-update .pv2-edge-edit{background:none;border:1px solid var(--border);border-radius:50%;width:18px;height:18px;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:9px;color:var(--gray-xlt);padding:0;transition:border-color .1s,color .1s,background .1s;flex-shrink:0;line-height:1}
body.page-update .pv2-edge-edit:hover{border-color:var(--pink-mid);color:var(--pink);background:var(--pink-pale)}
/* Spark edge control — secondary action */
body.page-update .pv2-edge-spark{background:none;border:1px solid var(--border);border-radius:50%;width:18px;height:18px;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:9px;color:var(--gray-xlt);padding:0;transition:border-color .1s,color .1s,background .1s;flex-shrink:0;line-height:1}
body.page-update .pv2-edge-spark:hover{border-color:var(--pink-mid);color:var(--pink);background:var(--pink-pale)}
/* Inline Details expansion panel */
body.page-update .pv2-details-panel{display:none}
body.page-update .pv2-details-panel.pv2-details-open{display:block;padding:10px 8px 10px 64px;border-top:1px solid var(--border-lt,#eee);margin-top:2px;animation:pv2-fade-in .15s ease}
@keyframes pv2-fade-in{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}
body.page-update .pv2-details-panel .pv2-drawer-preview{display:none}
body.page-update .pv2-details-panel .pv2-drawer-row{margin-bottom:7px}
/* Goal + policy details: less left padding (no wide code column to align with) */
body.page-update .doc-goal .pv2-details-panel.pv2-details-open{padding-left:14px}
body.page-update .doc-policy .pv2-details-panel.pv2-details-open{padding-left:14px}
/* Metadata rows from earlier phases */
body.page-update .pv2-drawer-meta-section{margin-bottom:10px;padding-bottom:8px;border-bottom:1px solid var(--border-lt,#eee)}
body.page-update .pv2-drawer-meta-row{display:flex;align-items:flex-start;gap:6px;font-size:10px;margin-bottom:4px;padding:3px 6px;background:var(--bg-soft);border-radius:4px;flex-wrap:wrap}
body.page-update .pv2-drawer-meta-type{font-size:8px;font-weight:700;padding:1px 5px;border-radius:3px;background:var(--bg-mid);color:var(--gray-lt);flex-shrink:0;line-height:1.5}
body.page-update .pv2-drawer-meta-label{font-weight:600;color:var(--gray);min-width:36px;flex-shrink:0}
body.page-update .pv2-drawer-meta-text{color:var(--gray-xlt);flex:1;line-height:1.4;min-width:0}
/* Details btn on goals and policies — same as action context */
body.page-update .doc-goal .pv2-details-btn,body.page-update .doc-policy .pv2-details-btn{font-size:9px;font-weight:600;font-family:'DM Sans',sans-serif;border:none;background:none;color:var(--gray-xlt);cursor:pointer;padding:2px 3px;transition:color .1s;white-space:nowrap}
body.page-update .doc-goal .pv2-details-btn:hover,body.page-update .doc-policy .pv2-details-btn:hover{color:var(--black)}
/* Non-action node meta line (Details link) */
body.page-update .pv2-node-meta{display:flex;align-items:center;margin-top:3px}
body.page-update .pv2-node-meta .pv2-details-btn{margin-left:0}
/* Number chips */
body.page-update .pv2-num-goal{font-family:'JetBrains Mono',monospace;font-size:12px;font-weight:700;background:var(--pink-pale);border:1.5px solid var(--pink-mid);color:var(--pink);padding:4px 10px;border-radius:100px;white-space:nowrap;line-height:1.2;letter-spacing:.02em}
body.page-update .pv2-num-policy{font-family:'JetBrains Mono',monospace;font-size:8.5px;color:var(--gray-xlt);opacity:.7;white-space:nowrap;line-height:1.2}
body.page-update .pv2-num-action{font-family:'JetBrains Mono',monospace;font-size:8px;color:var(--gray-xlt);opacity:.5;white-space:nowrap;line-height:1.2}
/* Typography scale — converged with Create panel */
body.page-update .pv2-text{flex:1;min-width:0;line-height:1.55;white-space:normal}
body.page-update .pv2-text-goal{font-size:18px;font-weight:800;color:var(--black);line-height:1.4}
body.page-update .pv2-text-policy{font-size:14px;font-weight:400;color:#333}
body.page-update .pv2-text-action{font-size:12px;font-weight:400;color:#1d4ed8}
body.page-update .pv2-text-deep{font-size:11.5px;font-weight:400;color:#999}

/* Narrative — prose block, not a data row */
body.page-update .pv2-narrative-block{background:var(--pink-pale);border-radius:6px;padding:10px 12px;margin:6px 0 8px;border-left:3px solid var(--pink-mid)}
body.page-update .pv2-narrative-text{font-size:13px;font-weight:400;font-family:'DM Sans',sans-serif;color:var(--gray);line-height:1.7;white-space:normal;margin:0}

/* Inline edit — selected state */
body.page-update .pv2-edit-wrap{padding:6px 0 4px}
body.page-update .pv2-edit-hdr{display:flex;align-items:center;gap:5px;margin-bottom:4px;padding:0 4px}
body.page-update .pv2-edit-type{font-size:8px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--pink)}
body.page-update .pv2-inline-ta{width:100%;box-sizing:border-box;font-size:12px;font-family:'DM Sans',sans-serif;color:var(--black);border:1.5px solid var(--pink-mid);border-radius:6px;padding:6px 8px;line-height:1.55;resize:none;overflow:hidden;min-height:60px;background:#fff;outline:none;transition:border-color .12s}
body.page-update .pv2-inline-ta:focus{border-color:var(--pink)}
body.page-update .pv2-ctrl-row{display:flex;align-items:center;gap:5px;flex-wrap:wrap;padding:5px 2px 3px;margin-top:5px}
body.page-update .pv2-status-sel{font-size:9px;font-weight:600;font-family:'DM Sans',sans-serif;border:1px solid var(--border);border-radius:5px;padding:3px 6px;background:#fff;color:var(--gray);cursor:pointer}
/* Spark — subdued pink pill, matching Update Spark treatment */
body.page-update .pv2-spark-btn{font-size:10px;font-weight:600;font-family:'DM Sans',sans-serif;padding:3px 9px;border-radius:100px;border:1.5px solid var(--pink-mid);background:var(--pink-pale);color:var(--pink);cursor:pointer;transition:background .12s,border-color .12s,color .12s;white-space:nowrap;line-height:1.3}
body.page-update .pv2-spark-btn:hover{background:var(--pink-mid);border-color:var(--pink)}
body.page-update .pv2-spark-gen{background:var(--bg-soft);border-color:var(--border);color:var(--gray-lt)}
body.page-update .pv2-spark-gen:hover{background:var(--pink-pale);border-color:var(--pink-mid);color:var(--pink)}
body.page-update .pv2-details-btn{font-size:9px;font-weight:600;font-family:'DM Sans',sans-serif;border:none;background:none;color:var(--gray-xlt);cursor:pointer;padding:3px 2px;margin-left:auto;transition:color .1s}
body.page-update .pv2-details-btn:hover{color:var(--black)}
body.page-update .pv2-kids-tog{padding:2px 4px}
body.page-update .pv2-kids-tog-btn{font-size:8px;font-weight:600;color:var(--gray-xlt);background:none;border:none;cursor:pointer;padding:2px 0;font-family:'DM Sans',sans-serif}
body.page-update .pv2-chain{font-size:9px;color:var(--gray-xlt);padding:1px 6px 3px;font-style:italic}
body.page-update .pv2-chain-new{color:var(--gray-lt)}

/* ── Phase 2B: Action Details Drawer ──────────────────────────────────── */
body.page-update #ucUWPreviewWrap{position:relative}
/* Constrain the Edit document to a readable line length, centered — matches the
   Create module's .doc-wrap (max-width 780px). Calc-padding centers the content
   column while the scroll container stays full-width (scrollbar at panel edge)
   and it degrades to a 20px gutter on narrow panels. */
body.page-update #ucUWPreview{box-sizing:border-box;padding-left:max(20px, calc((100% - 780px) / 2));padding-right:max(20px, calc((100% - 780px) / 2))}
body.page-update .pv2-drawer{position:absolute;top:0;right:0;width:256px;max-height:calc(100vh - 190px);display:flex;flex-direction:column;background:#fff;border-left:1px solid var(--border);box-shadow:-3px 0 12px rgba(0,0,0,.06);transform:translateX(100%);transition:transform .22s cubic-bezier(.4,0,.2,1);z-index:20;overflow:hidden}
body.page-update .pv2-drawer.pv2-drawer-open{transform:translateX(0)}
body.page-update .pv2-drawer-hdr{display:flex;align-items:center;gap:6px;padding:9px 10px 8px;border-bottom:1px solid var(--border);flex-shrink:0}
body.page-update .pv2-drawer-title{font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--gray-lt);flex:1;min-width:0}
body.page-update .pv2-drawer-close{background:none;border:none;font-size:16px;line-height:1;color:var(--gray-xlt);cursor:pointer;padding:0 2px;transition:color .1s;flex-shrink:0}
body.page-update .pv2-drawer-close:hover{color:var(--gray)}
body.page-update .pv2-drawer-body{flex:1;overflow-y:auto;padding:10px 10px 16px}
body.page-update .pv2-drawer-preview{font-size:11px;color:var(--gray);line-height:1.55;margin-bottom:12px;padding-bottom:10px;border-bottom:1px solid var(--border-lt,#eee)}
body.page-update .pv2-drawer-row{margin-bottom:9px}
body.page-update .pv2-drawer-label{display:block;font-size:8px;font-weight:700;color:var(--gray-xlt);text-transform:uppercase;letter-spacing:.06em;margin-bottom:3px}
body.page-update .pv2-drawer-input{width:100%;box-sizing:border-box;font-size:11px;font-family:'DM Sans',sans-serif;border:1px solid var(--border);border-radius:5px;padding:4px 7px;color:var(--black);background:#fff;outline:none;transition:border-color .1s}
body.page-update .pv2-drawer-input:focus{border-color:var(--pink-mid)}
body.page-update .pv2-drawer-sel{width:100%;box-sizing:border-box;font-size:11px;font-family:'DM Sans',sans-serif;border:1px solid var(--border);border-radius:5px;padding:4px 7px;color:var(--black);background:#fff;outline:none;cursor:pointer;transition:border-color .1s}
body.page-update .pv2-drawer-sel:focus{border-color:var(--pink-mid)}
body.page-update .pv2-drawer-ta{width:100%;box-sizing:border-box;font-size:11px;font-family:'DM Sans',sans-serif;line-height:1.55;border:1px solid var(--border);border-radius:5px;padding:4px 7px;color:var(--black);background:#fff;outline:none;resize:vertical;min-height:60px;transition:border-color .1s}
body.page-update .pv2-drawer-ta:focus{border-color:var(--pink-mid)}

/* ══ Phase 1B: Navigation and review intelligence ══════════════════════════ */

/* Readiness score pill */
body.page-update .up-uw-readiness-pill{display:flex;align-items:center;gap:6px;padding:7px 10px;background:var(--bg-soft);border:1px solid var(--border);border-radius:8px 8px 8px 8px;cursor:pointer;transition:background .12s;flex-wrap:wrap;user-select:none}
body.page-update .up-uw-readiness-pill:hover{background:var(--bg-mid)}
body.page-update .up-uw-readiness-score{font-size:18px;font-weight:800;letter-spacing:-.03em;line-height:1;flex-shrink:0}
body.page-update .up-uw-readiness-label{font-size:10px;font-weight:600;color:var(--gray);flex:1;min-width:0}
body.page-update .up-uw-readiness-issue{font-size:9px;color:var(--gray-lt);background:var(--bg-mid);padding:2px 6px;border-radius:100px;white-space:nowrap;flex-shrink:0}
body.page-update .up-uw-readiness-chevron{font-size:9px;color:var(--gray-xlt);flex-shrink:0}
body.page-update .up-uw-readiness-body{padding:8px 10px;border:1px solid var(--border);border-top:none;border-radius:0 0 8px 8px;background:var(--bg-soft);margin-top:-1px;margin-bottom:2px}
body.page-update .up-uw-rd-row{display:flex;align-items:center;gap:6px;font-size:10px;color:var(--gray);padding:2px 0;line-height:1.4}
body.page-update .up-uw-rd-icon{font-size:9px;font-weight:700;width:14px;text-align:center;flex-shrink:0;color:var(--gray-lt)}

/* Panel toggles (collapsible sections) */
body.page-update .up-uw-nav-wrap{margin-bottom:6px}
body.page-update .up-uw-findings-wrap{margin-bottom:8px}
body.page-update .up-uw-panel-toggle{display:flex;align-items:center;justify-content:space-between;width:100%;background:none;border:none;border-bottom:1px solid var(--border);padding:5px 0 4px;font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--gray-lt);cursor:pointer;font-family:inherit;transition:color .12s;text-align:left}
body.page-update .up-uw-panel-toggle:hover{color:var(--gray)}
body.page-update .up-uw-chevron{font-size:8px;opacity:.6;flex-shrink:0}

/* Element navigator */
body.page-update .up-uw-nav-panel{padding:4px 0 6px}
body.page-update .up-uw-nav-item{display:flex;align-items:center;gap:5px;padding:4px 6px;border-radius:5px;cursor:pointer;transition:background .1s;font-size:10px;color:var(--gray)}
body.page-update .up-uw-nav-item:hover{background:var(--bg-soft)}
body.page-update .up-uw-nav-item.up-uw-nav-item-on{background:var(--pink-pale);color:var(--pink)}
body.page-update .up-uw-nav-id{font-weight:700;min-width:28px;font-family:'JetBrains Mono',monospace;font-size:9px;flex-shrink:0}
/* Element nav row: [code chip] name … [count] [findings badge] */
body.page-update .up-uw-nav-code{font-family:'JetBrains Mono',monospace;font-size:8.5px;font-weight:700;color:var(--pink);background:var(--pink-pale);border:1px solid var(--pink-mid);border-radius:4px;padding:1px 4px;flex-shrink:0;min-width:34px;text-align:center;letter-spacing:.02em}
body.page-update .up-uw-nav-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px;font-weight:500;color:var(--gray-dark)}
body.page-update .up-uw-nav-n{font-size:10px;color:var(--gray-lt);flex-shrink:0;min-width:20px;text-align:right}
body.page-update .up-uw-nav-pending{font-size:9px;font-weight:700;padding:1px 6px;border-radius:100px;background:#fffbeb;color:#b45309;border:1px solid #fcd34d;flex-shrink:0}
body.page-update .up-uw-nav-elem-on .up-uw-nav-name{color:var(--pink)}
body.page-update .up-uw-nav-elem-on .up-uw-nav-code{background:#fff;border-color:var(--pink)}
body.page-update .up-uw-nav-legend{display:flex;justify-content:flex-end;gap:14px;padding:0 8px 6px;font-size:8.5px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--gray-lt)}
body.page-update .up-uw-nav-legend-flag{color:#b45309}
body.page-update .up-uw-nav-bit{font-size:8px;font-weight:700;padding:1px 4px;border-radius:3px;flex-shrink:0}
body.page-update .up-uw-nav-bit-r{background:#fff9ec;color:var(--amber)}
body.page-update .up-uw-nav-bit-n{background:#eff6ff;color:#1d4ed8}
body.page-update .up-uw-nav-bit-x{background:var(--pink-pale);color:var(--pink)}

/* Findings queue */
body.page-update .up-uw-findings-badge{font-size:9px;font-weight:700;background:var(--pink-pale);color:var(--pink);border:1px solid var(--pink-mid);padding:1px 6px;border-radius:100px;margin-left:4px;flex-shrink:0}
body.page-update .up-uw-findings-panel{padding:4px 0 6px}
body.page-update .up-uw-fq-group{margin-bottom:7px}
body.page-update .up-uw-fq-hdr{display:flex;align-items:center;gap:5px;padding:2px 0 3px}
body.page-update .up-uw-fq-icon{font-size:9px;color:var(--gray-xlt);width:12px;text-align:center;flex-shrink:0}
body.page-update .up-uw-fq-label{font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--gray);flex:1;min-width:0}
body.page-update .up-uw-fq-count{font-size:9px;font-weight:700;color:var(--pink);flex-shrink:0}
body.page-update .up-uw-fq-item{display:flex;align-items:center;gap:5px;padding:3px 4px;border-radius:4px;cursor:pointer;transition:background .1s}
body.page-update .up-uw-fq-item:hover{background:var(--bg-soft)}
body.page-update .up-uw-fq-elem{font-size:8px;font-weight:700;padding:1px 5px;border-radius:3px;background:var(--pink-pale);color:var(--pink);flex-shrink:0;font-family:'JetBrains Mono',monospace}
body.page-update .up-uw-fq-elem.up-uw-fq-elem-none{background:var(--bg-mid);color:var(--gray-lt)}
body.page-update .up-uw-fq-text{font-size:10px;color:var(--gray);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0}
body.page-update .up-uw-fq-more{font-size:9px;color:var(--gray-xlt);padding:2px 4px}

/* Status filter pills */
body.page-update .up-uw-filter-pills-row{display:flex;gap:4px;flex-wrap:wrap;padding:3px 0 2px}
body.page-update .up-uw-fpill{font-size:10px;font-weight:500;padding:3px 7px;border-radius:100px;border:1px solid var(--border);background:var(--bg-soft);color:var(--gray-lt);cursor:pointer;font-family:inherit;transition:all .12s;display:inline-flex;align-items:center;gap:3px;line-height:1.3}
body.page-update .up-uw-fpill:hover{border-color:var(--gray-lt);color:var(--gray)}
body.page-update .up-uw-fpill.up-uw-fpill-on{background:var(--pink-pale);border-color:var(--pink-mid);color:var(--pink);font-weight:600}
body.page-update .up-uw-fpill-n{font-size:9px;opacity:.7}
body.page-update .up-uw-input{width:100%;padding:6px 9px;font-size:12px;font-family:'DM Sans',sans-serif;border:1px solid var(--border);border-radius:7px;background:var(--bg);color:var(--black);outline:none;box-sizing:border-box;transition:border-color .1s}
body.page-update .up-uw-input:focus{border-color:var(--pink-mid)}
body.page-update .up-uw-textarea{width:100%;padding:7px 9px;font-size:12px;font-family:'DM Sans',sans-serif;line-height:1.55;border:1px solid var(--border);border-radius:7px;background:var(--bg);color:var(--black);outline:none;resize:vertical;box-sizing:border-box;transition:border-color .1s}
body.page-update .up-uw-textarea:focus{border-color:var(--pink-mid)}
body.page-update .up-uw-select{padding:6px 9px;font-size:11px;font-family:'DM Sans',sans-serif;border:1px solid var(--border);border-radius:7px;background:var(--bg);color:var(--black);outline:none;cursor:pointer;width:100%}
body.page-update .up-uw-select:focus{border-color:var(--pink-mid)}
body.page-update .up-uw-linkage-btn{padding:5px 11px;font-size:11px;font-weight:600;font-family:'DM Sans',sans-serif;border:1.5px solid var(--border);border-radius:100px;background:var(--bg);color:var(--gray-lt);cursor:pointer;transition:border-color .12s,color .12s,background .12s}
body.page-update .up-uw-linkage-btn:hover{border-color:var(--pink-mid);color:var(--pink)}
body.page-update .up-uw-linkage-on{border-color:var(--pink-mid)!important;background:var(--pink-pale)!important;color:var(--pink)!important}

/* ── Nav element header (expandable row) ── */
body.page-update .up-uw-nav-elem-hdr{display:flex;align-items:center;gap:5px;padding:5px 6px;border-radius:5px;cursor:pointer;transition:background .1s;font-size:10px;color:var(--gray);user-select:none}
body.page-update .up-uw-nav-elem-hdr:hover{background:var(--bg-soft)}
body.page-update .up-uw-nav-elem-hdr.up-uw-nav-elem-on{background:var(--pink-pale);color:var(--pink)}

/* ── Nav hierarchy tree ── */
body.page-update .up-uw-nav-tree{padding:2px 0 4px;border-left:1.5px solid var(--border);margin-left:10px;margin-bottom:4px}
body.page-update .up-uw-nav-tree-node{display:flex;align-items:baseline;gap:4px;padding:3px 8px;cursor:pointer;transition:background .1s;border-radius:0 4px 4px 0;line-height:1.35}
body.page-update .up-uw-nav-tree-node:hover{background:var(--bg-soft)}
body.page-update .up-uw-nav-tree-node.up-uw-nav-tree-sel{background:var(--pink-pale)}
body.page-update .up-uw-nav-tree-type{font-size:8px;font-weight:700;color:var(--gray-xlt);text-transform:uppercase;letter-spacing:.05em;flex-shrink:0;min-width:26px}
body.page-update .up-uw-nav-tree-code{font-size:9px;font-weight:700;color:var(--gray-lt);font-family:'JetBrains Mono',monospace;flex-shrink:0}
body.page-update .up-uw-nav-tree-text{font-size:10px;color:var(--gray);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0}
body.page-update .up-uw-nav-tree-sel .up-uw-nav-tree-text{color:var(--pink);font-weight:600}

/* ── Context / audit panel ── */
body.page-update .up-uw-ctx-panel{border:1px solid var(--border);border-radius:8px;padding:10px 12px;margin-top:10px;background:var(--bg)}
body.page-update .up-uw-ctx-hdr{display:flex;align-items:flex-start;gap:6px;margin-bottom:8px;padding-bottom:6px;border-bottom:1px solid var(--border)}
body.page-update .up-uw-ctx-title{font-size:10px;font-weight:600;color:var(--black);flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.4}
body.page-update .up-uw-ctx-badge{font-size:8px;font-weight:700;padding:2px 6px;border-radius:100px;flex-shrink:0;white-space:nowrap}
body.page-update .up-uw-ctx-badge-ok{background:var(--green-pale);color:var(--green);border:1px solid var(--green-border)}
body.page-update .up-uw-ctx-badge-warn{background:#fffbeb;color:#b45309;border:1px solid #fcd34d}
body.page-update .up-uw-ctx-finding{border:1px solid var(--border);border-radius:6px;padding:7px 9px;margin-bottom:5px;background:#fff}
body.page-update .up-uw-ctx-finding-open{border-color:#fcd34d;background:#fffbeb}
body.page-update .up-uw-ctx-finding-hdr{display:flex;align-items:flex-start;gap:6px;margin-bottom:3px}
body.page-update .up-uw-ctx-finding-chip{font-size:8px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;padding:1px 5px;border-radius:3px;background:#fff3cd;color:#92400e;flex-shrink:0;margin-top:1px}
body.page-update .up-uw-ctx-finding-title{font-size:10px;font-weight:600;color:var(--black);line-height:1.35;flex:1;min-width:0}
body.page-update .up-uw-ctx-finding-action{font-size:10px;color:var(--gray-lt);line-height:1.45;padding-left:0}
body.page-update .up-uw-ctx-done-btn{flex-shrink:0;margin-left:auto;font-size:9px;font-weight:700;padding:1px 5px;border-radius:3px;border:1px solid var(--green-border);background:#f0faf4;color:var(--green);cursor:pointer;opacity:0;transition:opacity .12s;line-height:1.4}
body.page-update .up-uw-ctx-finding-open:hover .up-uw-ctx-done-btn{opacity:1}
body.page-update .up-uw-ctx-spark-row{display:flex;align-items:center;gap:5px;flex-wrap:wrap;padding-top:2px}

/* Context panel lives in the right panel (between breadcrumb and content) */
body.page-update #ucRightWorkspace #ucUWContext:not(:empty){margin-bottom:4px}
body.page-update #ucRightWorkspace .up-uw-ctx-panel{margin-top:4px;margin-bottom:0}

/* Findings badge on the view-toggle button */
body.page-update .up-uw-findings-badge{font-size:8px;font-weight:700;padding:1px 5px;border-radius:100px;background:var(--pink-pale);color:var(--pink);border:1px solid var(--pink-mid);margin-left:3px;vertical-align:middle;line-height:1.5}

/* ── Alignment Proposals ── */
body.page-update .up-la-proposal-card{border:1.5px solid var(--border);border-radius:9px;padding:11px 13px;margin-bottom:8px;background:#fff;transition:border-color .12s,opacity .15s}
body.page-update .up-la-proposal-card.prop-accepted{border-color:var(--green-border);background:var(--green-pale)}
body.page-update .up-la-proposal-card.prop-rejected{opacity:.45}
body.page-update .up-la-proposal-card.prop-deferred{border-style:dashed;opacity:.65}
body.page-update .up-la-prop-hdr{display:flex;align-items:center;gap:6px;margin-bottom:5px;flex-wrap:wrap}
body.page-update .up-la-prop-type-chip{font-size:8px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;padding:1px 6px;border-radius:4px;background:var(--pink-pale);color:var(--pink);border:1px solid var(--pink-mid)}
body.page-update .up-la-prop-conf{font-size:9px;font-weight:700}
body.page-update .up-la-prop-count{font-size:9px;color:var(--gray-lt);margin-left:auto}
body.page-update .up-la-prop-dec{font-size:9px;font-weight:700;padding:1px 7px;border-radius:4px}
body.page-update .prop-dec-accepted{background:var(--green-pale);color:var(--green);border:1px solid var(--green-border)}
body.page-update .prop-dec-rejected{background:#fef2f2;color:#dc2626;border:1px solid #fca5a5}
body.page-update .prop-dec-deferred{background:var(--bg-soft);color:var(--gray-lt);border:1px solid var(--border)}
body.page-update .up-la-prop-title{font-size:11px;font-weight:700;color:var(--black);margin-bottom:3px;line-height:1.35}
body.page-update .up-la-prop-rationale{font-size:10px;color:var(--gray-lt);line-height:1.5;margin-bottom:7px}
body.page-update .up-la-prop-items{display:flex;flex-direction:column;gap:3px;margin-bottom:8px}
body.page-update .up-la-prop-item{display:flex;align-items:baseline;gap:4px;font-size:9px}
body.page-update .up-la-prop-item-cur{font-weight:700;color:var(--gray-lt);min-width:26px;text-align:center;flex-shrink:0}
body.page-update .up-la-prop-item-arrow{color:var(--gray-xlt, #d0d0d0);flex-shrink:0}
body.page-update .up-la-prop-item-new{font-weight:700;color:var(--pink);min-width:26px;text-align:center;flex-shrink:0}
body.page-update .up-la-prop-item-title{color:var(--gray-lt);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
body.page-update .up-la-prop-more{font-size:9px;color:var(--gray-xlt, #d0d0d0);padding-left:4px;margin-top:2px}
body.page-update .up-la-prop-actions{display:flex;gap:5px}
body.page-update .up-la-prop-btn{font-size:9px;font-weight:700;padding:3px 10px;border-radius:5px;border:1.5px solid var(--border);background:none;cursor:pointer;font-family:'DM Sans',sans-serif;color:var(--gray);transition:border-color .12s,color .12s,background .12s}
body.page-update .prop-accept-btn:hover{border-color:var(--green-border);color:var(--green);background:var(--green-pale)}
body.page-update .prop-reject-btn:hover{border-color:#fca5a5;color:#dc2626;background:#fef2f2}
body.page-update .prop-defer-btn:hover{border-color:var(--border);color:var(--gray-lt)}
body.page-update .prop-undo-btn:hover{border-color:var(--pink-mid);color:var(--pink);background:var(--pink-pale)}

/* ── Phase 2A.5: Create-parity overrides for Update context ── */

/* Element header badges in dark header */
body.page-update .doc-el-header .pv2-elem-n{color:rgba(255,255,255,.4);background:none;border:none;font-size:9px;opacity:1}
body.page-update .doc-el-header .pv2-elem-chg{background:rgba(232,51,109,.25);color:var(--pink-mid);font-size:8px;font-weight:700;padding:1px 5px;border-radius:100px}
body.page-update .doc-el-header .doc-el-chevron{opacity:.4}

/* Status left-border — all node types, reserve space with transparent */
body.page-update .doc-goal{border-left:3px solid transparent;padding-left:0;margin-left:0}
body.page-update .doc-policy{border-left:3px solid transparent;padding-left:11px}
body.page-update .doc-action{border-left:3px solid var(--border)}
body.page-update .doc-goal[data-status="Revise"]{border-left-color:var(--amber,#f59e0b)}
body.page-update .doc-goal[data-status="Replace"]{border-left-color:#c2410c}
body.page-update .doc-goal[data-status="Remove"]{border-left-color:var(--pink)}
body.page-update .doc-goal[data-status="New"]{border-left-color:#1d4ed8}
body.page-update .doc-policy[data-status="Revise"]{border-left-color:var(--amber,#f59e0b)}
body.page-update .doc-policy[data-status="Replace"]{border-left-color:#c2410c}
body.page-update .doc-policy[data-status="Remove"]{border-left-color:var(--pink)}
body.page-update .doc-policy[data-status="New"]{border-left-color:#1d4ed8}
body.page-update .doc-action[data-status="Revise"]{border-left-color:var(--amber,#f59e0b)}
body.page-update .doc-action[data-status="Replace"]{border-left-color:#c2410c}
body.page-update .doc-action[data-status="Remove"]{border-left-color:var(--pink)}
body.page-update .doc-action[data-status="New"]{border-left-color:#1d4ed8}
/* AI-generated items match the Create module's pink source accent: pink text +
   pink left-border, overriding the blue 'New' status border for AI content. */
body.page-update .doc-goal.pv2-ai,body.page-update .doc-policy.pv2-ai,body.page-update .doc-action.pv2-ai{border-left-color:var(--pink)!important}

/* Retired items — Remove is fully dimmed, Replace is lightly dimmed */
body.page-update .doc-goal[data-status="Remove"],body.page-update .doc-policy[data-status="Remove"],body.page-update .doc-action[data-status="Remove"]{opacity:.45}
body.page-update .pv2-node-retired{opacity:.55}

/* Selected highlight — goal: header row only (prevents bleed into child policy gaps) */
body.page-update .pv2-node-sel.doc-goal > .doc-goal-hd{background:var(--bg-soft);border-radius:4px;box-shadow:inset 0 0 0 1px var(--border)}
/* Selected highlight — policy and action: neutral fill (not pink) so it doesn't
   compete with the pink AI-generated text or the status left-border legend. */
body.page-update .pv2-node-sel.doc-policy,body.page-update .pv2-node-sel.doc-action{background:var(--bg-soft);box-shadow:inset 0 0 0 1px var(--border)}

/* Status dot indicator */
body.page-update .pv2-stat-dot{display:inline-block;width:7px;height:7px;border-radius:50%;flex-shrink:0;opacity:.7;margin-right:2px}

/* Hover controls container (always present in HTML, visibility via opacity) */
body.page-update .pv2-upd-ctrl{display:flex;align-items:center;gap:2px;flex-shrink:0;opacity:.55;transition:opacity .1s;margin-left:4px}
body.page-update .doc-goal-hd:hover .pv2-upd-ctrl,body.page-update .doc-policy-top:hover .pv2-upd-ctrl,body.page-update .doc-action:hover .pv2-upd-ctrl{opacity:1}
/* Delete button in card header (matches doc-item-del style) */
body.page-update .pv2-del-btn{flex-shrink:0;width:18px;height:18px;border:none;background:transparent;color:var(--gray-lt);font-size:13px;cursor:pointer;padding:0;line-height:1;display:flex;align-items:center;justify-content:center;border-radius:3px;transition:background .1s,color .1s}
body.page-update .doc-goal-hd:hover .pv2-del-btn,body.page-update .doc-policy-top:hover .pv2-del-btn,body.page-update .doc-action:hover .pv2-del-btn{color:var(--gray-lt)}
body.page-update .pv2-del-btn:hover{background:#ffe8ec;color:var(--red)!important}

/* Card footer — Details button bottom-right */
body.page-update .pv2-card-footer{display:flex;justify-content:flex-end;padding:5px 0 2px;opacity:0;transition:opacity .1s}
body.page-update .doc-goal:hover .pv2-card-footer,body.page-update .doc-policy:hover .pv2-card-footer,body.page-update .doc-action:hover .pv2-card-footer{opacity:1}
/* Footer Details btn — same style as existing pv2-details-btn */
body.page-update .pv2-card-footer .pv2-details-btn{font-size:9px;font-weight:600;font-family:'DM Sans',sans-serif;border:none;background:none;color:var(--gray-lt);cursor:pointer;padding:2px 3px;transition:color .1s;white-space:nowrap}
body.page-update .pv2-card-footer .pv2-details-btn:hover{color:var(--black)}

/* Insert-between row (+ button that appears on hover between siblings) */
body.page-update .pv2-insert-row{display:flex;align-items:center;justify-content:center;height:26px;margin:2px 0;opacity:0;transition:opacity .12s;position:relative;z-index:1}
body.page-update .pv2-insert-row:hover,.pv2-insert-row.uw-picking{opacity:1}
body.page-update .pv2-insert-row::before{content:'';position:absolute;left:0;right:0;top:50%;height:0;border-top:1px dashed var(--border)}
body.page-update .pv2-insert-row.uw-picking::before{border-top-color:var(--pink-mid)}
body.page-update .pv2-insert-btn{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:50%;border:1.5px solid var(--border);background:var(--bg);color:var(--gray-lt);font-size:14px;font-weight:400;cursor:pointer;line-height:1;padding:0;font-family:'DM Sans',sans-serif;transition:border-color .1s,color .1s,background .1s}
body.page-update .pv2-insert-btn:hover{border-color:var(--pink);color:var(--pink);background:var(--pink-pale)}
/* Inline insert type picker */
body.page-update .pv2-itype-row{position:relative;z-index:2;display:flex;align-items:center;gap:5px;flex-wrap:wrap;background:var(--bg);border:1.5px solid var(--pink-mid);border-radius:7px;padding:5px 8px;box-shadow:0 2px 8px rgba(0,0,0,.08)}
body.page-update .pv2-itype-label{font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--gray-xlt);flex-shrink:0;margin-right:2px}
body.page-update .pv2-itype-btn{font-size:10px;font-weight:500;padding:3px 9px;border-radius:100px;border:1px solid var(--border);background:var(--bg-soft);color:var(--gray);cursor:pointer;font-family:'DM Sans',sans-serif;transition:all .1s;white-space:nowrap}
body.page-update .pv2-itype-btn:hover{border-color:var(--pink-mid);color:var(--pink);background:var(--pink-pale)}
body.page-update .pv2-itype-btn-def{border-color:var(--pink-mid);background:var(--pink-pale);color:var(--pink);font-weight:600}
body.page-update .pv2-itype-more{font-size:9px;color:var(--gray-xlt);background:none;border:none;cursor:pointer;padding:2px 4px;font-family:'DM Sans',sans-serif}
body.page-update .pv2-itype-more-group{display:inline;gap:4px}
body.page-update .pv2-itype-cancel{margin-left:auto;font-size:11px;color:var(--gray-xlt);background:none;border:none;cursor:pointer;padding:2px 4px;line-height:1;flex-shrink:0}
body.page-update .pv2-itype-cancel:hover{color:var(--pink)}

/* In Update context, details btn style (legacy — now handled by .pv2-card-footer) */
body.page-update .doc-action .pv2-details-btn{font-size:9px;font-weight:600;font-family:'DM Sans',sans-serif;border:none;background:none;color:var(--gray-xlt);cursor:pointer;padding:2px 3px;transition:color .1s;white-space:nowrap}
body.page-update .doc-action .pv2-details-btn:hover{color:var(--black)}

/* Replacement chain styling */
body.page-update .pv2-chain{font-size:9px;color:var(--gray-xlt);padding:1px 6px 2px;font-style:italic}
body.page-update .pv2-chain-new{color:var(--gray-lt)}

/* Narrative block — use doc-intro style but add Update marker */
body.page-update .pv2-upd-narr{cursor:default}

/* ── Inline body text block (tables + prose beneath goal/policy/action) ─── */
body.page-update .doc-body-block{margin:6px 0 4px;padding-left:14px}
body.page-update .doc-goal .doc-body-block{padding-left:0}
body.page-update .doc-action-body-wrap .doc-body-block{padding-left:24px}
body.page-update .doc-body-prose{font-size:12px;color:var(--gray);line-height:1.6;margin:0 0 4px;white-space:pre-wrap}
body.page-update .doc-body-bullets{margin:4px 0 4px 16px;padding:0;list-style:disc;font-size:12px;color:var(--gray);line-height:1.6}
body.page-update .doc-body-bullets li{padding:1px 0}
body.page-update .doc-body-table{width:100%;border-collapse:collapse;font-size:11px;margin:6px 0 8px;color:var(--gray)}
body.page-update .doc-body-table th{background:var(--bg-lt,#f7f8fa);font-weight:700;color:var(--black);text-align:left;padding:5px 8px;border:1px solid var(--border)}
body.page-update .doc-body-table th[colspan]{text-align:center;background:#eef2f8;font-size:11px}
body.page-update .doc-body-table td{padding:4px 8px;border:1px solid var(--border);vertical-align:top;line-height:1.45}
body.page-update .doc-body-table tr:nth-child(even) td{background:var(--bg-lt,#f7f8fa)}

/* Responsive stack for narrow screens */
@media (max-width:900px){
  body.page-update .up-cal-layout{grid-template-columns:1fr;height:auto;overflow:visible}
  body.page-update #upCalWorkspace{position:static;overflow-y:auto}
  body.page-update .up-cal-left{border-right:none;border-bottom:1.5px solid var(--border)}
  body.page-update .up-cal-right{border-left:none;border-top:1.5px solid var(--border)}
}

/* ── Plan Alignment hierarchy overlays (Phase 2D.1) ────────────────────────
   Alignment-specific badges injected into HRTree nodes post-render.         */
body.page-update .cal-align-badge{font-size:8px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;border-radius:3px;padding:1px 5px;vertical-align:middle;margin-left:5px;white-space:nowrap;display:inline-block}
body.page-update .cal-align-accepted{background:#d1fae5;color:#059669;border:1px solid #a7f3d0}
body.page-update .cal-align-deferred{background:#fef3c7;color:#d97706;border:1px solid #fde68a}
body.page-update .cal-align-rejected{background:#fee2e2;color:#dc2626;border:1px solid #fecaca}
body.page-update .cal-align-rejected-node{opacity:.6}
body.page-update .cal-align-prov{font-size:8px;color:var(--gray-lt);margin-left:5px;font-style:italic;white-space:nowrap;display:inline-block}
body.page-update .cal-align-elem{font-size:8px;font-weight:700;border:1px solid currentColor;border-radius:3px;padding:0 4px;margin-left:4px;vertical-align:middle;white-space:nowrap;display:inline-block}
body.page-update .cal-align-hi{background:var(--pink-pale,#fff0f5)!important;border-color:var(--pink-mid,#f9a8d4)!important;outline:2px solid var(--pink-mid,#f9a8d4)}
body.page-update .cal-audit-dot{display:inline-block;vertical-align:middle;flex-shrink:0;margin-left:5px}
/* Finding-count flag on each card — bumped up from 9px so it reads at a glance */
body.page-update .cal-audit-dot-pending{font-size:13px;font-weight:800}
body.page-update .cal-audit-dot-clear{font-size:13px;font-weight:700}
body.page-update #ucRightReviewTree .cal-obj-finding-chips{display:flex;flex-wrap:wrap;gap:2px;margin-top:3px}
body.page-update #ucRightReviewTree .cal-obj-finding-chip{font-size:8px;padding:1px 4px;border-radius:3px;border:1px solid;white-space:nowrap}

/* ── Plan Alignment & Audit — Card-based right panel (Phase 2D.0) ───────────
   These styles apply to the planObject cards shown in the right panel during
   Plan Alignment and Plan Audit. No document-mode renderer is used here.    */
body.page-update .cal-obj-cards{padding:8px 0}
body.page-update .cal-obj-elem-group{margin-bottom:10px}
body.page-update .cal-obj-elem-hdr{display:flex;align-items:center;gap:5px;padding:4px 8px 4px 10px;background:var(--bg-soft);border-radius:5px;margin-bottom:4px;font-size:10px}
body.page-update .cal-obj-elem-id{font-size:9px;font-weight:800;text-transform:uppercase;letter-spacing:.07em;flex-shrink:0}
body.page-update .cal-obj-elem-name{font-size:9px;font-weight:600;color:var(--gray);flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.page-update .cal-obj-elem-ct{font-size:8px;font-weight:700;padding:1px 6px;border-radius:100px;background:var(--bg);border:1px solid var(--border);color:var(--gray-lt);flex-shrink:0;margin-left:auto}
body.page-update .cal-obj-card{padding:5px 8px 5px 9px;margin-bottom:3px;border-radius:5px;border:1px solid var(--border);background:var(--bg);cursor:pointer;transition:border-color .1s,background .1s}
body.page-update .cal-obj-card:hover{border-color:var(--gray-mid);background:var(--bg-soft)}
body.page-update .cal-obj-card.cal-obj-node-sel{border-color:var(--gray-mid)!important;background:#f0f3ff!important;outline:2px solid #c8d4f8}
body.page-update .cal-obj-card-accepted{border-color:var(--green-border);background:#f5fbf7}
body.page-update .cal-obj-card-deferred{border-color:#f5dea0;background:#fffdf2}
body.page-update .cal-obj-card-rejected{opacity:.55}
body.page-update .cal-obj-card-hdr{display:flex;align-items:center;gap:4px;flex-wrap:wrap;margin-bottom:2px}
body.page-update .cal-obj-code{font-size:9px;font-weight:800;letter-spacing:.04em;color:var(--gray);background:var(--bg-soft);border:1px solid var(--border);border-radius:4px;padding:1px 5px;flex-shrink:0;white-space:nowrap}
body.page-update .cal-obj-type{font-size:8px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--gray-xlt);flex-shrink:0}
body.page-update .cal-obj-title{font-size:10px;color:var(--gray);line-height:1.35;word-break:break-word}
body.page-update .cal-obj-state{font-size:8px;font-weight:700;padding:1px 6px;border-radius:100px;flex-shrink:0;white-space:nowrap}
body.page-update .cal-obj-state-accepted{background:#d1fae5;color:#059669}
body.page-update .cal-obj-state-deferred{background:#fef3c7;color:#d97706}
body.page-update .cal-obj-state-rejected{background:#fee2e2;color:#dc2626}
body.page-update .cal-obj-prov{font-size:8px;color:var(--gray-xlt);font-style:italic;flex-shrink:0}
body.page-update .cal-obj-finding-chips{display:flex;flex-wrap:wrap;gap:3px;margin-top:3px}
body.page-update .cal-obj-finding-chip{font-size:8px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;padding:1px 5px;border-radius:3px;border:1px solid transparent;white-space:nowrap}
/* ── Repair Map banner (Repair Map phase) ─────────────────────── */
body.page-update .cal-repair-map{background:var(--bg-soft,#f8f9fb);border:1px solid var(--border-lt,#e8ecf0);border-radius:6px;padding:7px 10px;margin-bottom:8px}
body.page-update .cal-repair-map-hdr{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
body.page-update .cal-repair-map-lbl{font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--gray)}
body.page-update .cal-repair-map-ct{font-size:9px;background:var(--gray-xlt,#eee);border-radius:100px;padding:1px 7px;color:var(--gray)}
body.page-update .cal-repair-map-crit{font-size:9px;background:#fee2e2;color:#dc2626;border-radius:100px;padding:1px 7px;font-weight:700}
body.page-update .cal-repair-map-queued{font-size:9px;background:#d1fae5;color:#059669;border-radius:100px;padding:1px 7px;font-weight:700}
/* ── Repair group cards ─────────────────────────────────────────── */
body.page-update .cal-rg-card{background:#fff;border:1.5px solid var(--border-lt,#e8ecf0);border-radius:7px;padding:9px 11px;margin-bottom:6px}
body.page-update .cal-rg-card-queued{border-color:var(--green-border,#a7f3d0);background:#f5fbf7}
body.page-update .cal-rg-card-deferred{border-color:#f5dea0;background:#fffdf2}
body.page-update .cal-rg-card-hdr{display:flex;align-items:center;gap:5px;flex-wrap:wrap;margin-bottom:5px}
body.page-update .cal-rg-label{font-size:10px;color:var(--gray);line-height:1.4;margin-bottom:5px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
body.page-update .cal-rg-chips{display:flex;flex-wrap:wrap;gap:3px;margin-bottom:6px}
body.page-update .cal-rg-code-chip{font-size:8px;font-weight:700;background:var(--bg-soft,#f2f4f8);border:1px solid var(--border-lt,#e0e4ea);border-radius:4px;padding:1px 5px;color:var(--gray);text-transform:uppercase}
body.page-update .cal-rg-code-more{background:var(--gray-xlt,#eee);color:var(--gray-lt)}
body.page-update .cal-rg-count{font-size:9px;font-weight:700;background:var(--bg-soft);border:1px solid var(--border-lt);border-radius:100px;padding:1px 7px;color:var(--gray-mid)}
body.page-update .cal-rg-progress{height:4px;background:var(--bg-soft);border-radius:100px;overflow:hidden;margin-bottom:3px}
body.page-update .cal-rg-progress-bar{height:100%;background:var(--green,#22c55e);border-radius:100px;transition:width .3s}
body.page-update .cal-rg-progress-lbl{font-size:8px;color:var(--gray-lt);margin-bottom:5px}
/* ── Workspace placeholder rows ─────────────────────────────────── */
body.page-update .uw-list-placeholder{display:flex;align-items:center;gap:6px;padding:5px 10px;border:1.5px dashed var(--border-lt,#d0d8e8);border-radius:5px;margin:2px 0;background:#fcfdff}
body.page-update .uw-ph-icon{font-size:11px;color:var(--gray-lt)}
body.page-update .uw-ph-code{font-size:9px;font-weight:700;color:var(--gray-lt);text-transform:uppercase}
body.page-update .uw-ph-label{font-size:10px;color:var(--gray-lt);font-style:italic;flex:1}
body.page-update .uw-ph-add-btn{font-size:9px;font-weight:600;color:var(--gray);background:var(--bg-soft);border:1px solid var(--border-lt);border-radius:4px;padding:2px 8px;cursor:pointer;white-space:nowrap}
body.page-update .uw-ph-add-btn:hover{background:var(--gray-xlt);border-color:var(--gray-mid)}
/* ── Audit right-panel placeholder cards ─────────────────────────── */
body.page-update .cal-ph-card{background:#fafcff;border:1.5px dashed #c8d4f0;border-radius:6px;padding:8px 10px;margin:3px 0;margin-left:4px}
body.page-update .cal-ph-card-hdr{display:flex;align-items:center;gap:6px;margin-bottom:4px}
body.page-update .cal-ph-code{font-size:9px;font-weight:700;color:var(--gray);text-transform:uppercase;background:var(--bg-soft);border:1px solid var(--border-lt);border-radius:4px;padding:1px 6px}
body.page-update .cal-ph-type{font-size:8px;color:var(--gray-lt);font-style:italic}
body.page-update .cal-ph-action{font-size:10px;color:var(--gray-lt);line-height:1.35;margin-bottom:5px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
body.page-update .cal-ph-btns{display:flex;gap:5px}
body.page-update .cal-ph-add-btn{font-size:9px;font-weight:600;color:#1d4ed8;background:#eff6ff;border:1px solid #bfdbfe;border-radius:4px;padding:2px 10px;cursor:pointer}
body.page-update .cal-ph-add-btn:hover{background:#dbeafe}
/* ── Doc-view placeholder rows (.doc-ph-*) ───────────────────────── */
.doc-ph-row{display:flex;align-items:center;gap:7px;padding:5px 10px 5px 14px;border:1.5px dashed #c8d4f0;border-radius:5px;margin:3px 0;background:#fafcff}
.doc-ph-badge{font-size:10px;color:#93a8d4;font-weight:700;flex-shrink:0}
.doc-ph-code{font-size:9px;font-weight:700;color:#6b7fb5;text-transform:uppercase;background:#eef2fc;border:1px solid #c8d4f0;border-radius:4px;padding:1px 6px;flex-shrink:0}
.doc-ph-label{font-size:10px;color:#8899bb;font-style:italic;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.doc-ph-add{font-size:9px;font-weight:600;color:#1d4ed8;background:#eff6ff;border:1px solid #bfdbfe;border-radius:4px;padding:2px 9px;cursor:pointer;white-space:nowrap;flex-shrink:0}
.doc-ph-add:hover{background:#dbeafe}

/* ── Cross-module switcher (Create ⇄ Update ⇄ Monitor) — shared topbar control.
   Rendered by ui-shell.js into #moduleSwitcher; theme-var driven (light + dark). */
.mod-switcher{display:inline-flex;align-items:center;gap:2px;background:var(--bg-soft);border:1px solid var(--border);border-radius:100px;padding:2px;flex-shrink:0}
.mod-switcher-item{font-size:12px;font-weight:600;color:var(--gray-lt);padding:4px 12px;border-radius:100px;text-decoration:none;cursor:pointer;transition:background .12s,color .12s;white-space:nowrap;line-height:1.4;font-family:'DM Sans',sans-serif}
.mod-switcher-item:hover{color:var(--black);background:var(--bg)}
.mod-switcher-item.active{color:#fff;background:var(--pink);cursor:default}
.mod-switcher-item.active:hover{background:var(--pink)}
