/*
 * Stage 2 Proposal Inspector — admin-only page styles.
 * No dependency on the public reader's styles.css.
 *
 * Layout: two-pane (list left, detail right). Banner up top
 * with filter chips. Designed for desktop primarily; small
 * screens collapse to single column.
 */

:root {
  --bg: #faf6ee;
  --bg-pane: #fffdf8;
  --bg-list-hover: #f3ead8;
  --bg-list-active: #eadcb8;
  --ink: #1c1917;
  --ink-soft: #3a342c;
  --muted: #6b6357;
  --rule: #d8d0c1;
  --rule-soft: #ece4d3;
  --accent: #6b3a17;
  --accent-soft: #a0623c;
  --warn-bg: #f7e8d6;

  --conf-high-bg:   #d8eed4;
  --conf-high-ink:  #244e1d;
  --conf-med-bg:    #fbe7c2;
  --conf-med-ink:   #6d4710;
  --conf-low-bg:    #f4cfc6;
  --conf-low-ink:   #6b1f10;

  --hebrew-font: "SBL Hebrew", "Ezra SIL", "Times New Roman", serif;
  --greek-font:  "SBL Greek", "Cardo", "Times New Roman", serif;
  --ui-font:     -apple-system, "Segoe UI", system-ui, sans-serif;
  --mono-font:   ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
}

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; height: 100%; }

body {
  background: var(--bg);
  color: var(--ink);
  font-family: var(--ui-font);
  font-size: 14px;
  line-height: 1.5;
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

/* ---------- Banner ---------- */
.banner {
  background: var(--bg-pane);
  border-bottom: 1px solid var(--rule);
  padding: 12px 20px 10px;
  flex: 0 0 auto;
  position: sticky;
  top: 0;
  z-index: 10;
}
.banner-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
}
.banner-row-controls {
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px dashed var(--rule-soft);
  gap: 18px;
}
.banner-title {
  font-size: 17px;
  font-weight: 700;
  letter-spacing: 0.01em;
  color: var(--accent);
}
.banner-warning {
  font-family: var(--mono-font);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.08em;
  color: var(--accent);
  background: var(--warn-bg);
  padding: 3px 8px;
  border-radius: 3px;
}
.banner-meta {
  font-family: var(--mono-font);
  font-size: 11px;
  color: var(--muted);
  margin-left: auto;
}

/* ---------- Controls ---------- */
.control-group {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  flex-wrap: wrap;
}
.control-group-flex { margin-left: auto; gap: 12px; }
.control-label {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--muted);
  font-weight: 600;
  margin-right: 4px;
}
.chip {
  font-family: var(--ui-font);
  font-size: 12px;
  font-weight: 500;
  padding: 3px 9px;
  border-radius: 11px;
  border: 1px solid var(--rule);
  background: var(--bg);
  color: var(--ink-soft);
  cursor: pointer;
  user-select: none;
  line-height: 1.4;
}
.chip:hover { background: var(--bg-list-hover); }
.chip-filter.active {
  background: var(--accent);
  color: white;
  border-color: var(--accent);
}
.chip-filter.chip-high.active { background: var(--conf-high-ink); border-color: var(--conf-high-ink); }
.chip-filter.chip-medium.active { background: var(--conf-med-ink); border-color: var(--conf-med-ink); }
.chip-filter.chip-low.active { background: var(--conf-low-ink); border-color: var(--conf-low-ink); }

.control-toggle {
  font-size: 12px;
  color: var(--muted);
  display: inline-flex;
  align-items: center;
  gap: 4px;
  cursor: pointer;
}

.kbd-hint {
  font-size: 11px;
  color: var(--muted);
}
kbd {
  font-family: var(--mono-font);
  font-size: 10px;
  background: var(--bg);
  border: 1px solid var(--rule);
  border-bottom-width: 2px;
  border-radius: 3px;
  padding: 1px 4px;
  margin: 0 1px;
  color: var(--ink-soft);
}

/* ---------- Layout ---------- */
.layout {
  flex: 1 1 auto;
  display: grid;
  grid-template-columns: 340px 1fr;
  min-height: 0;
}
@media (max-width: 800px) {
  .layout { grid-template-columns: 1fr; }
}

.list-pane {
  background: var(--bg-pane);
  border-right: 1px solid var(--rule);
  overflow-y: auto;
  max-height: calc(100vh - 110px);
}
.list-status {
  padding: 12px 16px;
  font-size: 12px;
  color: var(--muted);
  border-bottom: 1px solid var(--rule-soft);
}

.proposal-list {
  list-style: none;
  padding: 0;
  margin: 0;
}
.proposal-list > li {
  padding: 10px 16px;
  border-bottom: 1px solid var(--rule-soft);
  cursor: pointer;
  transition: background 0.05s ease;
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 4px 10px;
  align-items: baseline;
}
.proposal-list > li:hover { background: var(--bg-list-hover); }
.proposal-list > li.active {
  background: var(--bg-list-active);
  border-left: 3px solid var(--accent);
  padding-left: 13px;
}
.proposal-list > li.reviewed { opacity: 0.55; }
.proposal-list > li.reviewed .li-rendering::after {
  content: " ✓";
  color: var(--conf-high-ink);
}

.li-rank {
  font-family: var(--mono-font);
  font-size: 11px;
  color: var(--muted);
  font-weight: 600;
  grid-column: 1;
  grid-row: 1 / 3;
  padding-top: 2px;
}
.li-rendering {
  font-size: 14px;
  font-weight: 600;
  color: var(--ink);
  grid-column: 2;
}
.li-confidence {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  padding: 1px 6px;
  border-radius: 8px;
  grid-column: 3;
  grid-row: 1;
}
.li-lemma {
  grid-column: 2 / 4;
  font-size: 12px;
  color: var(--muted);
  display: flex;
  gap: 8px;
  align-items: baseline;
}
.li-lemma .lemma-script { color: var(--ink-soft); }
.li-lemma .lemma-script.hebrew { font-family: var(--hebrew-font); font-size: 14px; direction: rtl; unicode-bidi: isolate; }
.li-lemma .lemma-script.greek { font-family: var(--greek-font); font-size: 14px; }
.li-lemma .lemma-strong { font-family: var(--mono-font); font-size: 10px; }

.conf-high   { background: var(--conf-high-bg);   color: var(--conf-high-ink); }
.conf-medium { background: var(--conf-med-bg);    color: var(--conf-med-ink); }
.conf-low    { background: var(--conf-low-bg);    color: var(--conf-low-ink); }

/* ---------- Detail pane ---------- */
.detail-pane {
  overflow-y: auto;
  max-height: calc(100vh - 110px);
  padding: 24px 32px 60px;
  background: var(--bg);
}
.empty-state {
  max-width: 600px;
  margin: 80px auto;
  text-align: center;
  color: var(--muted);
}
.empty-state h2 {
  font-size: 20px;
  font-weight: 600;
  color: var(--ink-soft);
  margin-bottom: 8px;
}
.empty-state.empty-state-batch {
  background: var(--bg-pane);
  border: 1px dashed var(--rule);
  padding: 32px;
  border-radius: 6px;
}
.empty-state code {
  font-family: var(--mono-font);
  font-size: 12px;
  background: var(--bg);
  padding: 2px 4px;
  border-radius: 3px;
}

/* ---------- Proposal detail ---------- */
.detail { max-width: 780px; }

.detail-header {
  border-bottom: 1px solid var(--rule);
  padding-bottom: 14px;
  margin-bottom: 18px;
}
.detail-lemma-row {
  display: flex;
  align-items: baseline;
  gap: 14px;
  flex-wrap: wrap;
  margin-bottom: 6px;
}
.detail-lemma {
  font-size: 32px;
  line-height: 1.1;
  color: var(--ink);
}
.detail-lemma.hebrew { font-family: var(--hebrew-font); direction: rtl; unicode-bidi: isolate; }
.detail-lemma.greek { font-family: var(--greek-font); }
.detail-translit {
  font-size: 16px;
  color: var(--ink-soft);
  font-style: italic;
}
.detail-strong {
  font-family: var(--mono-font);
  font-size: 12px;
  color: var(--muted);
  padding: 2px 6px;
  background: var(--bg-pane);
  border: 1px solid var(--rule);
  border-radius: 3px;
}
.detail-traditional {
  font-size: 14px;
  color: var(--muted);
}
.detail-traditional strong {
  color: var(--ink-soft);
  font-weight: 600;
}

.detail-proposed {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
  margin: 14px 0 4px;
}
.detail-proposed-label {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--muted);
  font-weight: 600;
}
.detail-proposed-rendering {
  font-size: 30px;
  font-weight: 600;
  color: var(--accent);
  line-height: 1.1;
}
.detail-confidence {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 3px 10px;
  border-radius: 11px;
}

.detail-section {
  margin-top: 22px;
}
.detail-section h3 {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--muted);
  margin: 0 0 8px;
  padding-bottom: 4px;
  border-bottom: 1px solid var(--rule-soft);
}
.detail-section p {
  margin: 0 0 8px;
  color: var(--ink-soft);
}
.detail-section ul {
  margin: 0;
  padding-left: 20px;
}
.detail-section li {
  margin-bottom: 4px;
  color: var(--ink-soft);
}

.detail-section.admin-reasoning {
  background: rgba(180, 140, 60, 0.06);
  border-left: 3px solid rgba(180, 140, 60, 0.35);
  padding: 10px 14px;
  border-radius: 4px;
}
.detail-section.admin-reasoning h3 {
  border-bottom-color: rgba(180, 140, 60, 0.18);
}
.detail-section.admin-reasoning p {
  color: var(--muted);
  font-size: 13px;
  font-style: italic;
}
.admin-tag {
  display: inline-block;
  margin-left: 6px;
  padding: 1px 6px;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  background: rgba(180, 140, 60, 0.18);
  color: rgba(120, 90, 30, 1);
  border-radius: 3px;
  vertical-align: middle;
}

.root-block {
  background: var(--bg-pane);
  border: 1px solid var(--rule);
  padding: 10px 14px;
  border-radius: 4px;
  font-size: 13px;
}

.refs-list { list-style: none; padding-left: 0; }
.refs-list li {
  padding: 4px 8px;
  margin-bottom: 4px;
  border-left: 3px solid var(--rule);
  font-size: 13px;
  background: var(--bg-pane);
}
.refs-list li.ref-verse {
  border-left-color: var(--accent-soft);
}
.ref-verse-tag {
  display: inline-block;
  font-family: var(--mono-font);
  font-size: 11px;
  color: var(--accent);
  font-weight: 600;
  margin-right: 6px;
}

.evidence-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.evidence-chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  background: var(--bg-pane);
  border: 1px solid var(--rule);
  padding: 3px 8px;
  border-radius: 11px;
  font-size: 11px;
  color: var(--ink-soft);
}
.evidence-chip-key {
  font-family: var(--mono-font);
  font-size: 10px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.evidence-chip-val {
  font-weight: 600;
}

.alternatives {
  border: 1px solid var(--rule);
  border-radius: 4px;
  background: var(--bg-pane);
  padding: 0;
  overflow: hidden;
}
.alternatives summary {
  cursor: pointer;
  padding: 8px 14px;
  background: var(--bg-list-hover);
  font-weight: 600;
  font-size: 12px;
  color: var(--ink-soft);
  user-select: none;
}
.alternatives[open] summary {
  border-bottom: 1px solid var(--rule);
}
.alternatives-list {
  padding: 8px 14px 12px;
  list-style: none;
  margin: 0;
}
.alternatives-list li {
  padding: 8px 0;
  border-bottom: 1px dashed var(--rule-soft);
}
.alternatives-list li:last-child { border-bottom: 0; }
.alt-rendering {
  font-weight: 600;
  color: var(--accent);
  margin-right: 8px;
}
.alt-case {
  color: var(--ink-soft);
  font-size: 13px;
}

.narrator-block, .questions-block {
  background: var(--bg-pane);
  border: 1px solid var(--rule);
  border-left: 4px solid var(--accent-soft);
  padding: 10px 14px;
  border-radius: 4px;
}
.narrator-ref {
  font-family: var(--mono-font);
  font-size: 11px;
  color: var(--accent);
  font-weight: 600;
  margin-top: 4px;
}

.detail-actions {
  margin-top: 24px;
  padding-top: 14px;
  border-top: 1px solid var(--rule);
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  align-items: center;
}
.action-btn {
  font-family: var(--ui-font);
  font-size: 13px;
  font-weight: 600;
  padding: 6px 14px;
  border-radius: 4px;
  border: 1px solid var(--accent);
  background: var(--accent);
  color: white;
  cursor: pointer;
}
.action-btn:hover { background: var(--accent-soft); border-color: var(--accent-soft); }
.action-btn.action-secondary {
  background: var(--bg-pane);
  color: var(--accent);
}
.action-btn.action-secondary:hover {
  background: var(--bg-list-hover);
}
.action-btn.action-reviewed {
  background: var(--conf-high-bg);
  color: var(--conf-high-ink);
  border-color: var(--conf-high-ink);
}

.copy-toast {
  font-size: 12px;
  color: var(--conf-high-ink);
  opacity: 0;
  transition: opacity 0.15s ease;
}
.copy-toast.show { opacity: 1; }

.meta-foot {
  margin-top: 22px;
  font-family: var(--mono-font);
  font-size: 11px;
  color: var(--muted);
  border-top: 1px dashed var(--rule-soft);
  padding-top: 10px;
}
.meta-foot dt {
  display: inline;
  font-weight: 600;
}
.meta-foot dd {
  display: inline;
  margin: 0 12px 0 4px;
}
.meta-foot dl { margin: 0; }

/* ===== Admin tabs (added 2026-05-14, shared shell across admin pages) ===== */
.admin-tabs {
  display: flex;
  gap: 4px;
  padding: 14px 32px 0 32px;
  margin: 0;
  border-bottom: 1px solid var(--rule, #d8d0c1);
  background: var(--bg, #faf6ee);
  max-width: 100%;
  position: sticky;
  top: 0;
  z-index: 50;
}
.admin-tab {
  display: inline-block;
  padding: 8px 16px;
  font-size: 13px;
  font-weight: 500;
  color: var(--muted, #5e564b);
  text-decoration: none;
  border: 1px solid transparent;
  border-bottom: none;
  border-top-left-radius: 6px;
  border-top-right-radius: 6px;
  margin-bottom: -1px;
  transition: color 0.1s, background-color 0.1s;
}
.admin-tab:hover {
  color: var(--ink, #1c1917);
  background: rgba(127, 127, 127, 0.06);
}
.admin-tab.active {
  color: var(--ink, #1c1917);
  background: var(--bg, #faf6ee);
  border-color: var(--rule, #d8d0c1);
  border-bottom-color: var(--bg, #faf6ee);
  font-weight: 600;
}

/* ===== Rotate-to-landscape prompt (2026-05-18 Curtis) =====
   The Proposal Inspector is dense editorial chrome with multi-column
   layouts. On narrow portrait viewports (typical phone-in-portrait),
   show a friendly rotation prompt instead of squishing the page. */
#rotate-prompt {
  display: none;
  position: fixed;
  inset: 0;
  background: var(--bg, #faf6ee);
  z-index: 10000;
  align-items: center;
  justify-content: center;
  padding: 24px;
  text-align: center;
  font-family: var(--sans, -apple-system, system-ui, sans-serif);
}
.rotate-prompt-card {
  max-width: 280px;
}
.rotate-prompt-icon {
  font-size: 64px;
  color: var(--muted, #6b6256);
  margin-bottom: 12px;
  animation: rotate-prompt-spin 2.5s ease-in-out infinite;
  display: inline-block;
}
@keyframes rotate-prompt-spin {
  0%, 45% { transform: rotate(0deg); }
  55%, 100% { transform: rotate(90deg); }
}
.rotate-prompt-card h2 {
  font-size: 18px;
  font-weight: 600;
  margin: 0 0 8px;
  color: var(--ink, #1c1917);
  font-family: var(--serif, "Iowan Old Style", "Charter", "Georgia", serif);
}
.rotate-prompt-card p {
  font-size: 13px;
  line-height: 1.5;
  color: var(--muted, #6b6256);
  margin: 0;
}

/* ===== Inspector section tabs (Phase 17 Layer 2, 2026-05-19) =====
   Sits below the admin-tabs row. Switches between Glossary / Comments /
   Decisions / Databases inside the inspector page. Bookmarkable via
   ?tab=<name>. */
.inspector-tabs {
  display: flex;
  gap: 2px;
  padding: 0 28px;
  background: var(--bg-pane);
  border-bottom: 1px solid var(--rule);
  position: sticky;
  top: 0;
  z-index: 9;
}
.inspector-tab {
  background: transparent;
  border: 0;
  border-bottom: 2px solid transparent;
  padding: 8px 14px;
  font-family: var(--ui-font);
  font-size: 13px;
  font-weight: 500;
  color: var(--muted);
  cursor: pointer;
  border-radius: 0;
}
.inspector-tab:hover {
  color: var(--ink);
  background: var(--bg-list-hover);
}
.inspector-tab.active {
  color: var(--accent);
  border-bottom-color: var(--accent);
  font-weight: 600;
}
.inspector-tab-count {
  display: inline-block;
  margin-left: 4px;
  padding: 1px 6px;
  background: var(--bg);
  border-radius: 8px;
  font-size: 10px;
  font-weight: 600;
  color: var(--muted);
  vertical-align: middle;
}
.inspector-section { display: flex; flex-direction: column; flex: 1 1 auto; min-height: 0; }
.inspector-section[hidden] { display: none; }

/* Placeholder panes for Decisions / Databases */
.placeholder-pane {
  flex: 1 1 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 40px 24px;
  background: var(--bg);
}
.placeholder-card {
  max-width: 540px;
  background: var(--bg-pane);
  border: 1px dashed var(--rule);
  border-radius: 6px;
  padding: 28px 32px;
  color: var(--ink-soft);
}
.placeholder-card h2 {
  margin: 0 0 12px;
  font-size: 18px;
  color: var(--accent);
}
.placeholder-card p { margin: 0 0 10px; font-size: 13px; line-height: 1.55; }
.placeholder-card code {
  font-family: var(--mono-font);
  font-size: 12px;
  background: var(--bg);
  padding: 1px 5px;
  border-radius: 3px;
}
.placeholder-hint { color: var(--muted); font-size: 12px; }

/* ===== Resource panels per glossary entry (Phase 17 Layer 1b) =====
   Sit below the existing detail content. Each is a <details> with a
   styled summary acting as a section toggle. Defaults: Sample verses
   + Linked comments open; the rest collapsed. */
.resource-section {
  margin-top: 22px;
  border: 1px solid var(--rule);
  border-radius: 4px;
  background: var(--bg-pane);
  overflow: hidden;
}
.resource-section > summary {
  cursor: pointer;
  padding: 8px 14px;
  background: var(--bg-list-hover);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--muted);
  user-select: none;
  list-style: none;
  display: flex;
  align-items: center;
  gap: 8px;
}
.resource-section > summary::-webkit-details-marker { display: none; }
.resource-section > summary::before {
  content: "▸";
  font-size: 10px;
  color: var(--accent-soft);
  transition: transform 0.1s ease;
  display: inline-block;
}
.resource-section[open] > summary::before {
  transform: rotate(90deg);
}
.resource-section[open] > summary {
  border-bottom: 1px solid var(--rule);
}
.resource-count {
  margin-left: auto;
  background: var(--bg);
  border: 1px solid var(--rule);
  border-radius: 8px;
  padding: 1px 8px;
  font-size: 10px;
  color: var(--muted);
  font-weight: 600;
}
.resource-section-body {
  padding: 12px 14px;
  font-size: 13px;
  color: var(--ink-soft);
}
.resource-section-body .empty {
  color: var(--muted);
  font-style: italic;
  font-size: 12px;
}

/* Sample verses list */
.sample-verses-list { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.sample-verses-list li { margin: 0; }
.sample-verse-link {
  display: inline-block;
  padding: 4px 10px;
  background: var(--bg);
  border: 1px solid var(--rule);
  border-radius: 4px;
  font-family: var(--mono-font);
  font-size: 12px;
  color: var(--accent);
  text-decoration: none;
}
.sample-verse-link:hover { background: var(--bg-list-hover); border-color: var(--accent-soft); }

/* Decision-history blocks */
.decision-history-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 8px; }
.decision-history-block {
  background: var(--bg);
  border-left: 3px solid var(--accent-soft);
  padding: 8px 12px;
  border-radius: 3px;
  font-size: 12px;
}
.decision-history-stamp {
  font-family: var(--mono-font);
  font-size: 10px;
  color: var(--muted);
  font-weight: 600;
  letter-spacing: 0.04em;
  margin-bottom: 4px;
}
.decision-history-body {
  color: var(--ink-soft);
  white-space: pre-wrap;
  word-wrap: break-word;
}

/* Cross-language correspondences */
.crosslang-grid {
  display: grid;
  grid-template-columns: 110px 1fr;
  gap: 6px 12px;
  align-items: baseline;
}
.crosslang-label {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--muted);
  font-weight: 600;
}
.crosslang-value { color: var(--ink); font-size: 14px; }
.crosslang-value.hebrew { font-family: var(--hebrew-font); direction: rtl; unicode-bidi: isolate; font-size: 20px; }
.crosslang-value.greek { font-family: var(--greek-font); font-size: 18px; }
.crosslang-value.italic { font-style: italic; color: var(--ink-soft); }

/* MACULA peek table */
.macula-peek-table {
  width: 100%;
  font-size: 12px;
  border-collapse: collapse;
}
.macula-peek-table th, .macula-peek-table td {
  text-align: left;
  padding: 4px 8px;
  border-bottom: 1px dashed var(--rule-soft);
  vertical-align: top;
}
.macula-peek-table th {
  width: 130px;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--muted);
  font-weight: 600;
}
.macula-peek-table tr:last-child td,
.macula-peek-table tr:last-child th { border-bottom: 0; }
.macula-peek-table .lemma-cell.hebrew { font-family: var(--hebrew-font); direction: rtl; unicode-bidi: isolate; font-size: 16px; }
.macula-peek-table .lemma-cell.greek { font-family: var(--greek-font); font-size: 15px; }
.macula-peek-table code { font-family: var(--mono-font); font-size: 11px; background: var(--bg); padding: 1px 5px; border-radius: 3px; }

/* Linked comments list */
.linked-comments-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 8px; }
.linked-comment {
  background: var(--bg);
  border: 1px solid var(--rule);
  border-radius: 4px;
  padding: 8px 12px;
}
.linked-comment-head {
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin-bottom: 4px;
  font-size: 11px;
}
.linked-comment-tag {
  font-weight: 600;
  color: var(--accent);
}
.linked-comment-stamp {
  font-family: var(--mono-font);
  font-size: 10px;
  color: var(--muted);
}
.linked-comment-body {
  font-size: 12px;
  color: var(--ink-soft);
  white-space: pre-wrap;
  word-wrap: break-word;
}

/* ===== Comments tab — list + detail (Phase 17 Layer 2) ===== */
.comments-list > li {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 2px 10px;
  padding: 10px 16px;
}
.comments-list .ci-kind {
  grid-column: 1;
  grid-row: 1 / 3;
  align-self: start;
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-weight: 700;
  background: var(--bg);
  border: 1px solid var(--rule);
  color: var(--muted);
  padding: 2px 6px;
  border-radius: 8px;
  margin-top: 2px;
}
.comments-list .ci-kind.kind-word { color: var(--accent); border-color: var(--accent-soft); }
.comments-list .ci-kind.kind-verse { color: var(--conf-high-ink); border-color: var(--conf-high-ink); }
.comments-list .ci-kind.kind-chapter,
.comments-list .ci-kind.kind-book { color: var(--conf-med-ink); border-color: var(--conf-med-ink); }
.comments-list .ci-tag {
  font-size: 13px;
  font-weight: 600;
  color: var(--ink);
  grid-column: 2;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.comments-list .ci-when {
  font-family: var(--mono-font);
  font-size: 10px;
  color: var(--muted);
  grid-column: 3;
  text-align: right;
}
.comments-list .ci-snippet {
  grid-column: 2 / 4;
  font-size: 12px;
  color: var(--muted);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.comment-detail-meta {
  font-family: var(--mono-font);
  font-size: 11px;
  color: var(--muted);
  margin-bottom: 10px;
}
.comment-detail-body {
  font-size: 14px;
  color: var(--ink);
  line-height: 1.6;
  background: var(--bg-pane);
  padding: 14px 18px;
  border: 1px solid var(--rule);
  border-radius: 4px;
  white-space: pre-wrap;
  word-wrap: break-word;
}
.comment-ref-block {
  margin-top: 18px;
  background: var(--bg-pane);
  border: 1px solid var(--rule);
  border-radius: 4px;
  padding: 10px 14px;
}
.comment-ref-block h4 {
  margin: 0 0 6px;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--muted);
}
.comment-ref-block dl { margin: 0; display: grid; grid-template-columns: 110px 1fr; gap: 4px 12px; }
.comment-ref-block dt { font-size: 11px; color: var(--muted); font-weight: 600; }
.comment-ref-block dd { margin: 0; font-size: 12px; color: var(--ink-soft); word-break: break-word; }
.comment-actions {
  margin-top: 16px;
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.comment-actions .action-btn { font-size: 12px; padding: 5px 12px; }
.comments-empty-archive {
  background: var(--bg-pane);
  border: 1px dashed var(--rule);
  padding: 24px 28px;
  border-radius: 6px;
  margin: 24px;
  color: var(--ink-soft);
}
.comments-empty-archive h3 {
  margin: 0 0 8px;
  color: var(--accent);
  font-size: 15px;
}
.comments-empty-archive code {
  font-family: var(--mono-font);
  font-size: 12px;
  background: var(--bg);
  padding: 1px 5px;
  border-radius: 3px;
}

/* ===== Decisions tab — list + detail (Phase 17 Layer 3) ===== */
.decisions-list > li {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 2px 10px;
  padding: 10px 16px;
}
.decisions-list .di-cat {
  grid-column: 1;
  grid-row: 1 / 3;
  align-self: start;
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-weight: 700;
  background: var(--bg);
  border: 1px solid var(--rule);
  color: var(--muted);
  padding: 2px 6px;
  border-radius: 8px;
  margin-top: 2px;
  text-align: center;
  min-width: 56px;
}
.di-cat.di-cat-feedback { color: var(--accent); border-color: var(--accent-soft); }
.di-cat.di-cat-project  { color: var(--conf-high-ink); border-color: var(--conf-high-ink); }
.di-cat.di-cat-session  { color: var(--conf-med-ink); border-color: var(--conf-med-ink); }
.di-cat.di-cat-phase    { color: var(--conf-low-ink, #b56934); border-color: var(--conf-low-ink, #b56934); }
.di-cat.di-cat-system   { color: var(--muted); border-color: var(--rule); }
.decisions-list .di-name {
  font-size: 13px;
  font-weight: 600;
  color: var(--ink);
  grid-column: 2;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.decisions-list .di-date {
  font-family: var(--mono-font);
  font-size: 10px;
  color: var(--muted);
  grid-column: 3;
  text-align: right;
}
.decisions-list .di-brief {
  grid-column: 2 / 4;
  font-size: 12px;
  color: var(--muted);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.decision-detail-desc {
  margin: 4px 0 0;
  font-size: 13px;
  color: var(--ink-soft);
  line-height: 1.5;
  font-style: italic;
}
.decision-detail-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  margin: 10px 0 6px;
}
.decision-detail-meta .di-cat {
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-weight: 700;
  background: var(--bg);
  border: 1px solid var(--rule);
  color: var(--muted);
  padding: 2px 6px;
  border-radius: 8px;
}
.decision-meta-date {
  font-family: var(--mono-font);
  font-size: 11px;
  color: var(--muted);
}
.decision-tag {
  font-size: 10px;
  font-weight: 600;
  color: var(--muted);
  background: var(--bg);
  border: 1px dashed var(--rule);
  padding: 1px 6px;
  border-radius: 8px;
}
.decision-detail-filename {
  margin-top: 4px;
  font-size: 11px;
  color: var(--muted);
}
.decision-detail-filename code {
  font-family: var(--mono-font);
  font-size: 11px;
  background: var(--bg);
  padding: 1px 5px;
  border-radius: 3px;
}

.decision-body {
  margin-top: 14px;
  font-size: 13.5px;
  line-height: 1.65;
  color: var(--ink);
}
.decision-body p { margin: 0 0 10px; }
.decision-body .md-h { margin: 18px 0 8px; font-weight: 600; color: var(--ink); line-height: 1.3; }
.decision-body .md-h1 { font-size: 18px; color: var(--accent); }
.decision-body .md-h2 { font-size: 16px; }
.decision-body .md-h3 { font-size: 14px; }
.decision-body .md-h4, .decision-body .md-h5, .decision-body .md-h6 {
  font-size: 13px; text-transform: uppercase; letter-spacing: 0.05em; color: var(--muted);
}
.decision-body .md-list { margin: 6px 0 12px 22px; padding: 0; }
.decision-body .md-list li { margin: 2px 0; }
.decision-body .md-hr {
  border: 0;
  border-top: 1px solid var(--rule);
  margin: 16px 0;
}
.decision-body .md-bq {
  margin: 8px 0;
  padding: 6px 14px;
  border-left: 3px solid var(--rule);
  color: var(--ink-soft);
  background: var(--bg-pane);
  font-style: italic;
}
.decision-body .md-inline-code {
  font-family: var(--mono-font);
  font-size: 12px;
  background: var(--bg-pane);
  padding: 1px 5px;
  border-radius: 3px;
  border: 1px solid var(--rule);
}
.decision-body .md-code {
  margin: 8px 0;
  padding: 10px 12px;
  background: var(--bg-pane);
  border: 1px solid var(--rule);
  border-radius: 4px;
  font-family: var(--mono-font);
  font-size: 12px;
  overflow-x: auto;
  white-space: pre;
}
.decision-body a { color: var(--accent); text-decoration: underline; }

.decision-crosslinks { margin-top: 18px; }
.decision-crosslinks-list {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 6px;
}
.decision-crosslink {
  background: var(--bg);
  border: 1px solid var(--rule);
  border-radius: 12px;
  padding: 3px 10px;
  font-size: 12px;
  color: var(--accent);
  cursor: pointer;
  font-family: inherit;
}
.decision-crosslink:hover { background: var(--bg-list-hover); }

.decision-actions {
  margin-top: 18px;
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.decision-source-path {
  font-family: var(--mono-font);
  font-size: 10px;
  color: var(--muted);
  word-break: break-all;
}

/* ===== Memory cross-references panel — Phase 17 Layer 3c ===== */
.memory-refs-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 8px; }
.memory-ref-card {
  background: var(--bg);
  border: 1px solid var(--rule);
  border-radius: 4px;
  padding: 8px 12px;
}
.memory-ref-head {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 4px;
}
.memory-ref-link {
  background: transparent;
  border: 0;
  padding: 0;
  font-family: inherit;
  font-size: 13px;
  font-weight: 600;
  color: var(--accent);
  cursor: pointer;
  text-align: left;
  text-decoration: underline;
  text-decoration-style: dotted;
  text-underline-offset: 2px;
}
.memory-ref-link:hover { text-decoration-style: solid; }
.memory-ref-cat {
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-weight: 700;
  background: var(--bg-pane);
  border: 1px solid var(--rule);
  color: var(--muted);
  padding: 1px 6px;
  border-radius: 8px;
}
.memory-ref-cat.memory-ref-cat-feedback { color: var(--accent); border-color: var(--accent-soft); }
.memory-ref-cat.memory-ref-cat-project  { color: var(--conf-high-ink); border-color: var(--conf-high-ink); }
.memory-ref-cat.memory-ref-cat-session  { color: var(--conf-med-ink); border-color: var(--conf-med-ink); }
.memory-ref-cat.memory-ref-cat-phase    { color: var(--conf-low-ink, #b56934); border-color: var(--conf-low-ink, #b56934); }
.memory-ref-snippet {
  font-size: 12px;
  color: var(--ink-soft);
  line-height: 1.5;
  font-style: italic;
  margin: 2px 0 4px;
}
.memory-ref-foot {
  font-size: 10px;
  color: var(--muted);
}
.memory-ref-foot code {
  font-family: var(--mono-font);
  font-size: 10px;
  background: var(--bg-pane);
  padding: 1px 4px;
  border-radius: 2px;
}

/* ===== Phase 17 Layer 5a — hover-jump icons =====
 *
 * Three flavours of affordance, one visual idiom:
 *   1. .hover-jump  — explicit arrow link emitted next to inline verse
 *      refs (decoration of free text via decorateRefsInString).
 *   2. .has-hover-jump  — a row/link that is itself the jump target;
 *      the .hover-jump-glyph child reveals on hover.
 *   3. .ref-with-jump  — wrapper span that holds the original text +
 *      the .hover-jump arrow as siblings.
 *
 * Default state: glyph invisible. On row hover: glyph fades in at low
 * opacity. On glyph hover: full ink + pointer cursor. Click navigates
 * (handled natively via <a href> opening in a new tab so the inspector
 * state is preserved while the user verifies).
 */
.hover-jump,
.hover-jump-glyph {
  display: inline-block;
  font-family: var(--mono-font);
  font-size: 12px;
  line-height: 1;
  color: var(--muted);
  opacity: 0;
  margin-left: 6px;
  text-decoration: none;
  transition: opacity 120ms ease, color 120ms ease, transform 120ms ease;
  vertical-align: baseline;
  pointer-events: none; /* default: not clickable until parent is hovered */
}
.hover-jump {
  /* Inline arrows wrap with their preceding text — keep them inline. */
  padding: 0 2px;
  border-radius: 3px;
}
/* Reveal on parent row hover. We catch every parent context the arrows
 * live in: ref pills, refs-list <li>, decision-history bodies, linked
 * comments, memory cross-refs, MACULA peek rows, and the ref-with-jump
 * wrapper itself. */
.has-hover-jump:hover .hover-jump-glyph,
.ref-with-jump:hover .hover-jump,
.refs-list li:hover .hover-jump,
.decision-history-block:hover .hover-jump,
.linked-comment:hover .hover-jump,
.memory-ref-card:hover .hover-jump,
.macula-peek-row-jumpable:hover .hover-jump,
.detail-section:hover > p .hover-jump {
  opacity: 0.55;
  pointer-events: auto;
}
.hover-jump:hover,
.has-hover-jump:hover .hover-jump-glyph:hover,
.hover-jump-glyph:hover {
  opacity: 1;
  color: var(--accent);
  cursor: pointer;
  transform: translateX(1px);
}
/* Sample-verse pill: the whole pill is a link; the arrow glyph sits
 * on the right edge and only shows on hover. */
.sample-verse-link.has-hover-jump {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.sample-verse-link .hover-jump-glyph {
  margin-left: 2px;
}
.sample-verse-link:hover .hover-jump-glyph {
  opacity: 0.85;
  color: var(--accent);
}

/* Visual nicety — when the inline ref + arrow appear together, keep
 * them on the same line so the arrow doesn't orphan to a new wrap. */
.ref-with-jump {
  white-space: nowrap;
}

/* Show the prompt in portrait mobile. KEEP the admin tabs visible
   at the top so users can navigate to Reader / Dev Tools without
   first rotating. Curtis: "On the rotate screen, you should keep
   the tabs up so people can get out of it if they want, while
   still in vertical mode." */
@media (max-width: 880px) and (orientation: portrait) {
  #rotate-prompt {
    display: flex;
  }
  /* Hide the dense editorial chrome — books sidebar, the inspector
     content area — but keep the admin tabs accessible up top. */
  body.admin-mode .sidebar,
  body.admin-mode .sidebar-toggle,
  body.admin-mode .admin-layout-with-sidebar > *:not(.admin-tabs) {
    display: none !important;
  }
  body.admin-mode .admin-layout-with-sidebar {
    margin-left: 0 !important;
  }
  /* Pin the admin tabs at the top, above the rotate-prompt overlay
     so users can switch pages from this empty state. admin.css sets
     z-index: 900 on .admin-tabs with equal specificity, and loads
     AFTER this stylesheet — so !important is needed to win. */
  body.admin-mode .admin-tabs {
    z-index: 10001 !important;
    background: var(--bg, #faf6ee) !important;
  }
}

/* ===== Phase 17 Layer 4b — Databases tab =====
 *
 * Two-level UI:
 *   Level 1 (.db-level-1) — sources list, .db-source-card grid.
 *   Level 2 (.db-level-2) — per-source peek pane with header controls
 *                            (book/verse/file selectors) and a body that
 *                            swaps in one of five layouts (macula table,
 *                            bsb rendering, spans columns, notes list,
 *                            prototype detail).
 * Read-only on every source. */
.db-level { display: flex; flex-direction: column; flex: 1 1 auto; min-height: 0; }

.db-sources-pane {
  flex: 1 1 auto;
  overflow: auto;
  padding: 20px 24px 32px;
  background: var(--bg);
}
.db-sources-status {
  font-size: 12px;
  color: var(--muted);
  margin-bottom: 16px;
  font-style: italic;
}
.db-sources-status:empty { display: none; }
.db-sources-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 16px;
}
.db-source-card {
  display: flex;
  flex-direction: column;
  gap: 8px;
  background: var(--bg-pane);
  border: 1px solid var(--rule);
  border-radius: 6px;
  padding: 14px 16px;
  text-align: left;
  font: inherit;
  color: inherit;
  cursor: pointer;
  transition: border-color 120ms ease, background 120ms ease, transform 120ms ease;
}
.db-source-card:hover {
  background: var(--bg-list-hover);
  border-color: var(--accent-soft);
  transform: translateY(-1px);
}
.db-source-head {
  display: flex;
  align-items: center;
  gap: 10px;
}
.db-source-name {
  font-weight: 700;
  font-size: 14px;
  color: var(--accent);
}
.db-source-desc {
  font-size: 12px;
  line-height: 1.5;
  color: var(--ink-soft);
}
.db-source-stats {
  font-size: 11px;
  font-family: var(--mono-font);
  color: var(--muted);
}
.db-source-foot {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: auto;
  padding-top: 6px;
  border-top: 1px dashed var(--rule);
  font-size: 11px;
}
.db-source-license { color: var(--muted); }
.db-source-open { color: var(--accent); font-weight: 600; }

/* Kind chips — color-coded by data-source kind. */
.db-kind-chip {
  display: inline-block;
  padding: 2px 8px;
  font-size: 10px;
  font-family: var(--mono-font);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  border-radius: 3px;
  border: 1px solid currentColor;
  background: var(--bg);
}
.db-chip-macula { color: #2f7d4a; }   /* green */
.db-chip-bsb { color: #2b5fa3; }      /* blue */
.db-chip-spans { color: #b3601a; }    /* orange */
.db-chip-notes { color: var(--muted); }
.db-chip-span-prototype {
  color: #6c3aa3;                     /* purple */
  border-style: dashed;
}

/* Level-2 back button + controls */
.db-back-btn {
  background: transparent;
  border: 1px solid var(--rule);
  color: var(--accent);
  font: inherit;
  font-size: 12px;
  padding: 4px 10px;
  border-radius: 3px;
  cursor: pointer;
  margin-right: 12px;
}
.db-back-btn:hover { background: var(--bg-list-hover); border-color: var(--accent-soft); }

.db-source-controls {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
}
.db-ctl {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
}
.db-ctl-label {
  font-size: 11px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.db-select, .db-input {
  font: inherit;
  font-size: 12px;
  padding: 3px 6px;
  border: 1px solid var(--rule);
  border-radius: 3px;
  background: var(--bg-pane);
  color: var(--ink);
  min-width: 80px;
}
.db-input { width: 80px; }

/* Peek pane body */
.db-peek-pane {
  flex: 1 1 auto;
  overflow: auto;
  padding: 20px 24px 32px;
  background: var(--bg);
}
.db-peek-empty {
  padding: 40px 0;
  text-align: center;
  color: var(--muted);
  font-style: italic;
  font-size: 13px;
}
.db-peek-head {
  display: flex;
  align-items: baseline;
  gap: 12px;
  margin-bottom: 16px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--rule);
}
.db-peek-head strong {
  font-size: 16px;
  color: var(--accent);
}
.db-peek-counts {
  font-size: 11px;
  font-family: var(--mono-font);
  color: var(--muted);
}
.db-skeleton {
  padding: 20px;
  font-style: italic;
  color: var(--muted);
  text-align: center;
}
.db-error {
  padding: 14px 18px;
  background: #fff3e6;
  border: 1px solid #d99a4a;
  border-radius: 4px;
  color: #6b3a17;
  font-size: 12px;
}
.db-empty {
  padding: 24px;
  text-align: center;
  color: var(--muted);
  font-style: italic;
}

/* MACULA peek — dense per-morph table */
.db-table-wrap {
  overflow-x: auto;
  border: 1px solid var(--rule);
  border-radius: 4px;
}
.db-morph-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 11px;
  font-family: var(--mono-font);
}
.db-morph-table th {
  text-align: left;
  background: var(--bg-list-hover);
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-size: 10px;
  padding: 6px 8px;
  border-bottom: 1px solid var(--rule);
  white-space: nowrap;
}
.db-morph-table td {
  padding: 5px 8px;
  border-bottom: 1px solid var(--rule);
  vertical-align: top;
  white-space: nowrap;
}
.db-morph-table tr:hover td { background: var(--bg-list-hover); }
.db-morph-table .db-cell-rtl {
  direction: rtl;
  font-family: "SBL Hebrew", serif;
  font-size: 14px;
  white-space: nowrap;
}
.db-morph-table code {
  font-family: inherit;
  font-size: 10px;
  background: var(--bg);
  padding: 1px 3px;
  border-radius: 2px;
}

/* BSB peek — reconstructed plain text with per-span hover-tooltips */
.db-bsb-render {
  font-size: 16px;
  line-height: 1.8;
  padding: 16px 18px;
  background: var(--bg-pane);
  border: 1px solid var(--rule);
  border-radius: 4px;
}
.db-bsb-span {
  border-radius: 2px;
  padding: 1px 2px;
  cursor: help;
  transition: background 120ms ease;
}
.db-bsb-kind-source { background: transparent; }
.db-bsb-kind-source:hover { background: rgba(107,58,23,0.10); }
.db-bsb-kind-supplied {
  background: rgba(107,58,23,0.05);
  color: var(--ink-soft);
  font-style: italic;
}
.db-bsb-kind-supplied:hover { background: rgba(107,58,23,0.18); }
.db-bsb-protected {
  font-weight: 600;
  text-decoration: underline dotted var(--accent-soft);
  text-underline-offset: 3px;
}

/* Spans peek — rigid + smoothed side-by-side */
.db-spans-cols {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}
.db-spans-col {
  display: flex;
  flex-direction: column;
  gap: 8px;
  background: var(--bg-pane);
  border: 1px solid var(--rule);
  border-radius: 4px;
  padding: 14px 14px 18px;
}
.db-spans-col-title {
  margin: 0 0 6px;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--muted);
  font-weight: 700;
}
.db-spans-col-body {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.db-span-chip {
  background: var(--bg);
  border: 1px solid var(--rule);
  border-radius: 3px;
  font-size: 12px;
}
.db-span-chip > summary {
  cursor: pointer;
  padding: 6px 10px;
  list-style: none;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
}
.db-span-chip > summary::-webkit-details-marker { display: none; }
.db-span-chip[open] > summary { border-bottom: 1px solid var(--rule); }
.db-span-kind-source { border-left: 3px solid var(--rule); }
.db-span-kind-supplied {
  border-left: 3px dashed var(--accent-soft);
  background: rgba(107,58,23,0.04);
}
.db-span-protected { border-left-color: var(--accent); }
.db-span-text {
  font-weight: 600;
  color: var(--ink);
}
.db-span-meta {
  font-size: 10px;
  font-family: var(--mono-font);
  color: var(--muted);
  text-transform: lowercase;
}
.db-span-json {
  margin: 0;
  padding: 8px 12px;
  font-family: var(--mono-font);
  font-size: 11px;
  background: var(--bg);
  white-space: pre;
  overflow-x: auto;
  color: var(--ink-soft);
}

/* Notes peek — list of ref + glossary_token + body */
.db-notes-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.db-note-row {
  background: var(--bg-pane);
  border: 1px solid var(--rule);
  border-left: 3px solid var(--accent-soft);
  border-radius: 4px;
  padding: 10px 14px;
}
.db-note-head {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 6px;
  font-size: 12px;
}
.db-note-ref {
  font-family: var(--mono-font);
  font-size: 11px;
  background: var(--bg);
  padding: 1px 5px;
  border-radius: 2px;
}
.db-note-tok {
  background: var(--bg);
  border: 1px solid var(--rule);
  font: inherit;
  font-size: 11px;
  color: var(--accent);
  padding: 1px 8px;
  border-radius: 10px;
  cursor: pointer;
}
.db-note-tok:hover { background: var(--accent); color: white; border-color: var(--accent); }
.db-note-body {
  font-size: 13px;
  line-height: 1.55;
  color: var(--ink);
}

/* Note: db-note-row participates in the .has-hover-jump hover idiom
   from Layer 5a — hover the row, the ref's arrow fades in. */
.db-note-row:hover .hover-jump {
  opacity: 0.55;
  pointer-events: auto;
}

/* Span-prototype peek — collapsible sections */
.db-proto-status {
  padding: 8px 12px;
  background: #fff3e6;
  border: 1px dashed #d99a4a;
  border-radius: 4px;
  font-size: 11px;
  color: #6b3a17;
  margin-bottom: 14px;
}
.db-proto-section {
  margin-bottom: 12px;
  border: 1px solid var(--rule);
  border-radius: 4px;
  background: var(--bg-pane);
  overflow: hidden;
}
.db-proto-section > summary {
  cursor: pointer;
  padding: 8px 14px;
  background: var(--bg-list-hover);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--muted);
  user-select: none;
  list-style: none;
  display: flex;
  align-items: center;
  gap: 8px;
}
.db-proto-section > summary::-webkit-details-marker { display: none; }
.db-proto-section > summary::before {
  content: "▸";
  font-size: 10px;
  color: var(--accent-soft);
  transition: transform 0.1s ease;
}
.db-proto-section[open] > summary::before { transform: rotate(90deg); }
.db-proto-section[open] > summary { border-bottom: 1px solid var(--rule); }
.db-proto-prose {
  padding: 12px 14px;
  font-size: 12px;
  line-height: 1.55;
  color: var(--ink);
}
.db-proto-decisions {
  margin: 0;
  padding: 10px 14px 12px 32px;
  font-size: 12px;
  line-height: 1.5;
  color: var(--ink);
}
.db-proto-decisions li { margin-bottom: 6px; }
.db-proto-section .db-spans-col-body {
  padding: 10px 14px;
}

/* Tighter Spans columns on narrower viewports */
@media (max-width: 1100px) {
  .db-spans-cols { grid-template-columns: 1fr; }
}

/* ============================================================
   Phase 18A.3 — Citations tab + per-entry citations panel
   ============================================================ */

/* Citations tab list view */
.citations-list { padding: 0; margin: 0; list-style: none; }
.citation-list-item {
  display: block;
  padding: 8px 12px;
  border-bottom: 1px solid var(--rule, #ddd);
  cursor: pointer;
  transition: background 120ms ease;
}
.citation-list-item:hover { background: rgba(0, 0, 0, 0.04); }
.citation-list-item.active {
  background: rgba(80, 90, 130, 0.10);
  border-left: 3px solid var(--accent, #335);
  padding-left: 9px;
}
.citation-list-line1 {
  font-family: var(--serif, serif);
  font-size: 0.95rem;
  font-weight: 600;
}
.citation-list-arrow { color: var(--muted); }
.citation-list-otref { color: var(--accent, #335); }
.citation-list-line2 {
  font-size: 11px;
  color: var(--muted);
  margin-top: 3px;
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}
.citation-list-conf {
  font-family: var(--mono, monospace);
  font-size: 10px;
  background: rgba(0, 0, 0, 0.06);
  padding: 1px 5px;
  border-radius: 2px;
}
.citation-list-glossary {
  font-size: 10px;
  color: var(--accent, #335);
}

/* Type badges — match the reader's color scheme. */
.citation-type {
  display: inline-block;
  padding: 1px 7px;
  font-size: 10px;
  font-family: var(--sans);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  border-radius: 8px;
  font-weight: 600;
}
.citation-type-verbatim {
  background: rgba(80, 140, 80, 0.18);
  color: #2c6c2c;
}
.citation-type-paraphrastic {
  background: rgba(180, 140, 60, 0.18);
  color: #8a6a1f;
}
.citation-type-echo {
  background: rgba(0, 0, 0, 0.06);
  color: var(--muted);
}

/* Detail pane */
#citations-detail .detail-header { margin-bottom: 14px; }
#citations-detail .detail-title {
  font-family: var(--serif, serif);
  font-weight: 600;
  font-size: 1.2rem;
  margin: 0 0 6px;
}
#citations-detail .detail-arrow { color: var(--muted); margin: 0 4px; }
#citations-detail .detail-pill-row {
  display: flex;
  gap: 10px;
  align-items: center;
  font-size: 11px;
  color: var(--muted);
}
.citation-confidence {
  font-family: var(--mono, monospace);
  font-size: 11px;
  color: var(--muted);
}
.citation-source {
  font-size: 11px;
  color: var(--muted);
}

#citations-detail section {
  margin-bottom: 14px;
  padding: 10px 12px;
  background: rgba(0, 0, 0, 0.025);
  border-radius: 4px;
  border-left: 3px solid var(--rule, #ddd);
}
#citations-detail .citation-detail-nt {
  border-left-color: var(--accent, #5a7);
}
#citations-detail .citation-detail-ot {
  border-left-color: #8a6a1f;
}
#citations-detail .resource-section-summary {
  font-family: var(--sans);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--muted);
  font-weight: 600;
  margin-bottom: 4px;
}
#citations-detail .citation-detail-body {
  font-family: var(--serif, serif);
  font-size: 0.96rem;
  line-height: 1.55;
}
.citation-detail-deferred {
  font-style: italic;
  color: var(--muted);
  font-size: 0.88rem !important;
  border-left: 2px dashed var(--rule, #ccc);
  padding-left: 8px;
}
.citation-glossary-chip {
  display: inline-block;
  padding: 2px 8px;
  margin: 2px 4px 2px 0;
  background: rgba(80, 90, 130, 0.12);
  color: var(--accent, #335);
  font-family: var(--sans);
  font-size: 11px;
  border-radius: 3px;
  font-weight: 500;
  border: 0;
  cursor: pointer;
}
.citation-glossary-chip:hover {
  background: rgba(80, 90, 130, 0.22);
}

/* Book-filter select dropdown (next to chip filters) */
.chip-select {
  font-family: var(--sans);
  font-size: 12px;
  padding: 4px 8px;
  border: 1px solid var(--rule, #ddd);
  border-radius: 3px;
  background: var(--bg, #fff);
  color: var(--text, #222);
  cursor: pointer;
}

/* Per-entry "Citations involving this entry" panel (Layer 1b section 7) */
.entry-citations-list {
  list-style: none;
  padding: 0;
  margin: 0;
}
.entry-citation {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  font-size: 12px;
  padding: 5px 0;
  border-bottom: 1px dotted var(--rule, #eee);
}
.entry-citation:last-child { border-bottom: 0; }
.entry-citation-ntref { font-family: var(--serif, serif); font-weight: 500; }
.entry-citation-arrow { color: var(--muted); }
.entry-citation-otref { font-family: var(--serif, serif); color: var(--accent, #335); }
.entry-citation-conf {
  font-family: var(--mono, monospace);
  font-size: 10px;
  background: rgba(0, 0, 0, 0.05);
  padding: 0 4px;
  border-radius: 2px;
  margin-left: auto;
}
.entry-citation-more {
  font-size: 11px;
  color: var(--muted);
  font-style: italic;
  padding: 6px 0 2px;
}
.entry-citation-jump-tab {
  background: none;
  border: 0;
  color: var(--accent, #335);
  cursor: pointer;
  text-decoration: underline;
  font: inherit;
  padding: 0;
}

/* ===== Phase 18B.3 — Roots tab + per-entry root-cousins panel ===== */

.roots-list { padding: 0; margin: 0; list-style: none; }
.roots-row {
  padding: 10px 14px;
  border-bottom: 1px solid var(--rule, rgba(0, 0, 0, 0.06));
  cursor: pointer;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.roots-row:hover { background: var(--bg-soft, rgba(0, 0, 0, 0.03)); }
.roots-row.active {
  background: var(--accent-soft, rgba(60, 80, 200, 0.08));
  border-left: 3px solid var(--accent, #335);
  padding-left: 11px;
}
.roots-row-main {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
}
.roots-row-root {
  font-family: var(--serif-heb, var(--serif));
  font-size: 18px;
  font-weight: 600;
}
.roots-row-meta {
  font-size: 11px;
  color: var(--muted, #777);
  font-variant-numeric: tabular-nums;
}
.roots-row-glossary {
  font-size: 11px;
  color: var(--fg-soft, #555);
}

#roots-detail-pane .detail {
  padding: 18px 22px;
  overflow-y: auto;
}
.root-detail-head {
  display: flex;
  align-items: baseline;
  gap: 18px;
  flex-wrap: wrap;
  margin-bottom: 18px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--rule, rgba(0, 0, 0, 0.1));
}
.root-detail-title {
  font-family: var(--serif-heb, var(--serif));
  font-size: 32px;
  margin: 0;
}
.root-detail-meta {
  font-size: 12px;
  color: var(--muted, #777);
}
.root-detail-section { margin-bottom: 22px; }
.root-detail-section h3 {
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--muted, #777);
  margin: 0 0 8px;
}
.root-detail-glossary-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  gap: 6px;
}
.root-glossary-card {
  padding: 10px 12px;
  border: 1px solid var(--rule, rgba(0, 0, 0, 0.12));
  border-radius: 4px;
  background: var(--bg-card, #fff);
  cursor: pointer;
  font: inherit;
  text-align: left;
}
.root-glossary-card:hover {
  background: var(--bg-soft, rgba(0, 0, 0, 0.03));
  border-color: var(--accent, #335);
}
.rgc-key { font-weight: 600; }
.root-lemmas-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
.root-lemmas-table th,
.root-lemmas-table td {
  padding: 6px 8px;
  border-bottom: 1px solid var(--rule, rgba(0, 0, 0, 0.06));
  text-align: left;
  vertical-align: top;
}
.root-lemmas-table th {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--muted, #777);
  font-weight: 600;
}
.rl-lemma {
  font-family: var(--serif-heb, var(--serif));
  font-size: 16px;
  font-weight: 600;
}
.rl-count {
  font-variant-numeric: tabular-nums;
  color: var(--muted, #555);
}
.rl-gloss-link {
  background: var(--bg-soft, rgba(0, 0, 0, 0.04));
  border: 1px solid var(--rule, rgba(0, 0, 0, 0.1));
  border-radius: 3px;
  padding: 1px 6px;
  font-size: 11px;
  cursor: pointer;
  font-family: inherit;
}
.rl-gloss-link:hover { background: var(--accent-soft, rgba(60, 80, 200, 0.1)); }
.rl-sample {
  display: inline-block;
  margin-right: 4px;
  font-size: 11px;
  color: var(--muted, #666);
}
.root-detail-footer details {
  font-size: 12px;
  color: var(--muted, #666);
}
.root-detail-footer ul { margin: 6px 0 0; padding-left: 18px; }

/* ----- Per-glossary-entry "Root cousins" resource panel ----- */
.root-cousins-host { padding: 4px 2px; }
.root-cousins-head {
  display: flex;
  align-items: baseline;
  gap: 12px;
  margin-bottom: 10px;
}
.rc-root {
  font-family: var(--serif-heb, var(--serif));
  font-size: 18px;
  font-weight: 600;
}
.rc-meta {
  font-size: 11px;
  color: var(--muted, #777);
}
.rc-section-label {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--muted, #777);
  margin: 8px 0 4px;
}
.rc-glossary-cousins {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}
.rc-glossary-cousins li { margin: 0; }
.rc-cousin-link {
  padding: 3px 8px;
  background: var(--bg-soft, rgba(0, 0, 0, 0.04));
  border: 1px solid var(--rule, rgba(0, 0, 0, 0.1));
  border-radius: 3px;
  font: inherit;
  font-size: 12px;
  cursor: pointer;
}
.rc-cousin-link:hover {
  background: var(--accent-soft, rgba(60, 80, 200, 0.1));
  border-color: var(--accent, #335);
}
.rc-common-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;
  margin-top: 4px;
}
.rc-common-table th,
.rc-common-table td {
  padding: 4px 6px;
  border-bottom: 1px solid var(--rule, rgba(0, 0, 0, 0.06));
  text-align: left;
  vertical-align: top;
}
.rc-common-table th {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--muted, #777);
  font-weight: 600;
}
.rc-lemma {
  font-family: var(--serif-heb, var(--serif));
  font-size: 14px;
}
.rc-count {
  font-variant-numeric: tabular-nums;
  color: var(--muted, #555);
}
.rc-more {
  font-size: 11px;
  color: var(--muted, #777);
  font-style: italic;
  margin-top: 4px;
}

/* ===== Phase 21 — Coverage Gap Editor ===== */
.cg-row {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 8px 12px;
  border-bottom: 1px solid var(--rule, #e5e5e5);
  cursor: pointer;
}
.cg-row:hover { background: var(--hover, #f6f6f6); }
.cg-row.active { background: var(--active, #e8f0ff); }
.cg-row-done { opacity: 0.6; }
.cg-row-main {
  display: flex;
  align-items: baseline;
  gap: 8px;
  flex-wrap: wrap;
}
.cg-row-ref { font-weight: 600; font-family: var(--mono, monospace); font-size: 12px; }
.cg-row-depth { font-size: 11px; color: var(--muted, #777); font-variant-numeric: tabular-nums; }
.cg-row-lemma { font-family: var(--serif-heb, var(--serif)); font-size: 14px; }
.cg-row-sugg {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  padding: 1px 6px;
  background: #fff3d6;
  color: #735200;
  border-radius: 3px;
}
.cg-row-decided {
  margin-left: auto;
  font-size: 11px;
  color: var(--muted, #777);
  font-variant-numeric: tabular-nums;
}
.cg-detail-head {
  display: flex;
  align-items: baseline;
  gap: 16px;
  padding: 12px 16px;
  border-bottom: 1px solid var(--rule, #e5e5e5);
}
.cg-ref { margin: 0; font-size: 18px; }
.cg-progress { color: var(--muted, #777); font-variant-numeric: tabular-nums; }
.cg-prev-next { margin-left: auto; }
.cg-bsb, .cg-spans, .cg-gap { padding: 12px 16px; border-bottom: 1px solid var(--rule, #e5e5e5); }
.cg-bsb h3, .cg-spans h3, .cg-gap h3 {
  margin: 0 0 8px;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--muted, #555);
}
.cg-bsb-text { margin: 0; font-size: 14px; line-height: 1.5; }
.cg-table {
  border-collapse: collapse;
  font-size: 12px;
  width: 100%;
}
.cg-table th, .cg-table td {
  border: 1px solid var(--rule, #e5e5e5);
  padding: 4px 8px;
  text-align: left;
  vertical-align: top;
}
.cg-table th {
  background: var(--rule-bg, #fafafa);
  font-weight: 600;
  text-transform: uppercase;
  font-size: 10px;
  letter-spacing: 0.05em;
}
.cg-table code { font-size: 11px; }
.cg-span-idx { width: 32px; font-variant-numeric: tabular-nums; }
.cg-span-text { font-family: var(--serif, serif); }
.cg-actions .chip { font-size: 11px; padding: 2px 8px; cursor: pointer; }
.cg-tag {
  font-size: 9px;
  padding: 1px 4px;
  border-radius: 3px;
  margin-left: 4px;
  text-transform: uppercase;
}
.cg-tag-pn { background: #e8e8ff; color: #2222aa; }
.cg-tag-supplied { background: #ffe5e5; color: #aa2222; }
.cg-gap-dec {
  padding: 2px 6px;
  border-radius: 3px;
  font-size: 11px;
  font-weight: 600;
}
.cg-gap-dec-bsb-drop { background: #d6f5d6; color: #135013; }
.cg-gap-dec-force-anchor { background: #d6e6ff; color: #133560; }
.cg-gap-dec-needs-realignment { background: #fde2d6; color: #6b3a13; }
.cg-gap-pending { color: var(--muted, #999); }

/* =====================================================================
 * MACULA-as-oracle Databases-tab peek panes (2026-05-22)
 * Used by: macula-ext-index, paraphrase-aliases, llm-verification,
 * audit-report. Generic stats-grid + verdict chips.
 * ===================================================================== */
.db-stats-grid {
  display: grid;
  grid-template-columns: max-content 1fr;
  gap: 6px 18px;
  margin: 12px 0;
  font-size: 13px;
}
.db-stats-grid dt {
  color: var(--muted, #666);
  font-weight: 500;
}
.db-stats-grid dd {
  margin: 0;
  font-variant-numeric: tabular-nums;
}
.db-stats-grid .db-stats-pct {
  color: var(--muted, #999);
  font-size: 11px;
  margin-left: 4px;
}
.db-stats-highlight {
  color: #aa2222;
  font-weight: 600;
}
.db-stats-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;
  margin: 12px 0;
}
.db-stats-table th, .db-stats-table td {
  border: 1px solid var(--rule, #e5e5e5);
  padding: 4px 8px;
  text-align: left;
}
.db-stats-table th {
  background: var(--rule-bg, #fafafa);
  font-weight: 600;
  text-transform: uppercase;
  font-size: 10px;
  letter-spacing: 0.05em;
}
.db-stats-table code { font-size: 11px; }
.db-verdict-verified { color: #135013; font-weight: 600; }
.db-verdict-wrong    { color: #aa2222; font-weight: 600; }
.db-verdict-uncertain{ color: #8a6500; font-weight: 600; }
.db-peek-note {
  font-size: 11px;
  color: var(--muted, #666);
  margin-top: 12px;
  line-height: 1.5;
}
.db-peek-files {
  margin: 12px 0;
  font-size: 12px;
}
.db-peek-files ul {
  margin: 4px 0 0 16px;
  padding: 0;
}
.db-peek-files code { font-size: 11px; }

/* ===========================================================================
 * Lemma Distribution tab (2026-05-23)
 * Migrated from admin/lemma-distribution/styles.css. All class names
 * prefixed `ld-` to avoid collision with the Inspector's existing
 * .row/.breakdown/.tab/.table-host selectors.
 * =========================================================================== */

.inspector-section[data-section="lemma-distribution"] .layout-single {
  display: block;
  padding: 14px 24px 32px;
}
.ld-select {
  padding: 4px 8px;
  border: 1px solid var(--rule);
  background: var(--panel, #fffbf3);
  border-radius: 4px;
  font: inherit;
  font-size: 13px;
}
.ld-search {
  flex: 1;
  min-width: 200px;
  padding: 5px 10px;
  border: 1px solid var(--rule);
  background: var(--panel, #fffbf3);
  border-radius: 4px;
  font: inherit;
  font-size: 13px;
}
.ld-totals {
  background: var(--panel, #fffbf3);
  border: 1px solid var(--rule);
  border-radius: 5px;
  padding: 10px 14px;
  margin-bottom: 14px;
  font-size: 12.5px;
  color: var(--muted);
}
.ld-totals strong { color: var(--ink); font-weight: 600; }
.ld-table-host {
  border: 1px solid var(--rule);
  border-radius: 6px;
  overflow: hidden;
  background: var(--panel, #fffbf3);
}
table.ld-dist { width: 100%; border-collapse: collapse; font-size: 13.5px; }
table.ld-dist th, table.ld-dist td {
  padding: 8px 12px;
  text-align: left;
  border-bottom: 1px solid var(--rule);
  vertical-align: top;
}
table.ld-dist th {
  background: #f3ecda;
  font-weight: 600;
  font-size: 11.5px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--muted);
  position: sticky;
  top: 0;
}
table.ld-dist tr:last-child td { border-bottom: none; }
table.ld-dist tr.ld-row.ld-expandable { cursor: pointer; }
table.ld-dist tr.ld-row.ld-expandable:hover { background: #f1ead8; }
table.ld-dist tr.ld-row.ld-expanded { background: #e9dfc1; }
table.ld-dist td.ld-col-text { font-family: serif; font-size: 15px; }
table.ld-dist td.ld-col-lemma { font-family: serif; font-size: 16px; padding-right: 6px; }
table.ld-dist td.ld-col-lemma[lang="he"] { direction: rtl; text-align: right; }
table.ld-dist td.ld-col-num { font-variant-numeric: tabular-nums; text-align: right; white-space: nowrap; }
table.ld-dist td.ld-col-factor strong { color: var(--accent); font-weight: 700; }
.ld-text { font-family: serif; font-size: 14px; }
.ld-count { color: var(--muted); font-variant-numeric: tabular-nums; }
.ld-mono { color: var(--muted); font-size: 11.5px; font-family: ui-monospace, "Menlo", monospace; }
.ld-muted { color: var(--muted); font-size: 12.5px; }

tr.ld-breakdown td { background: #fcf7e8; padding: 0; }
.ld-breakdown-inner { padding: 12px 16px 16px; }
.ld-bd-cross { font-size: 12px; color: var(--muted); margin-top: 4px; }
.ld-bd-cross strong { color: var(--ink); }
.ld-bd-list {
  list-style: none; padding: 0; margin: 6px 0 0;
  display: grid;
  grid-template-columns: max-content 1fr max-content max-content;
  column-gap: 14px; row-gap: 6px;
  align-items: baseline;
}
.ld-bd-list .ld-bd-row { display: contents; }
.ld-bd-lemma { font-family: serif; font-size: 15px; }
.ld-bd-lemma[lang="he"] { direction: rtl; text-align: right; }
.ld-bd-trunc { color: var(--muted); font-size: 12px; margin-top: 8px; font-style: italic; }

.ld-load-more {
  display: block;
  margin: 14px auto 0;
  padding: 7px 16px;
  background: var(--panel, #fffbf3);
  color: var(--accent);
  border: 1px solid var(--rule);
  border-radius: 4px;
  font-family: inherit;
  font-size: 13px;
  cursor: pointer;
}
.ld-load-more:hover { background: #f1ead8; }

/* 2026-05-23 — Books sidebar retired from the Proposal Inspector.
   admin.css applies margin-left: var(--sidebar-w) to every
   .admin-layout-with-sidebar; here we add the .admin-no-sidebar
   modifier to opt out per-page. */
body.admin-mode .admin-layout-with-sidebar.admin-no-sidebar { margin-left: 0; }

/* 2026-05-23 — Full-screen workspace toggle.
   When body.admin-fullscreen is on, hide the top admin-tabs row and the
   inspector-tabs row to give the active tool maximum vertical real
   estate. A floating exit pill stays pinned top-right so the user
   always has a way out. Toggle via the icon button in the admin-tabs
   action group, or Shift+F from anywhere on the page. */
/* Specificity chain: admin.css also targets body.admin-mode .admin-tabs
   with display:flex; matching both body classes wins the cascade
   without resorting to !important. */
body.admin-mode.admin-fullscreen .admin-tabs,
body.admin-mode.admin-fullscreen .inspector-tabs { display: none; }

.admin-fullscreen-exit {
  display: none;
  position: fixed;
  top: 12px;
  right: 16px;
  z-index: 10010;
  padding: 6px 12px;
  background: var(--accent, #6b3a17);
  color: #fff;
  border: none;
  border-radius: 4px;
  font: 12.5px / 1 var(--sans, -apple-system, system-ui, sans-serif);
  letter-spacing: 0.04em;
  cursor: pointer;
  box-shadow: 0 4px 14px -4px rgba(28, 25, 23, 0.4);
}
.admin-fullscreen-exit:hover { background: #8c4e22; }
body.admin-fullscreen .admin-fullscreen-exit { display: block; }

/* 2026-05-23 — Admin history dropdown. Mirrors the reader's
   reader-nav-history-panel visually but sits in the admin chrome. */
.admin-history-panel {
  background: var(--panel, #fffbf3);
  border: 1px solid var(--rule);
  border-radius: 6px;
  box-shadow: 0 12px 32px -8px rgba(28, 25, 23, 0.25);
  padding: 6px;
  min-width: 280px;
  max-width: 380px;
  max-height: 70vh;
  overflow-y: auto;
  z-index: 10020;
}
.admin-history-item {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 7px 10px;
  background: transparent;
  border: none;
  font: 13px / 1.4 var(--sans, system-ui, sans-serif);
  text-align: left;
  cursor: pointer;
  border-radius: 4px;
  color: var(--ink);
}
.admin-history-item:hover { background: #f1ead8; }
.admin-history-item.is-admin { color: var(--accent); }
.admin-history-marker {
  width: 18px;
  text-align: center;
  font-size: 13px;
  flex-shrink: 0;
}
.admin-history-label { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.admin-history-sub {
  font-size: 11px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-feature-settings: "tnum";
  flex-shrink: 0;
}

/* 2026-05-23 — "Originally proposed" subtitle. Shown when the live
   glossary rendering differs from the Stage 2 LLM-proposed rendering.
   Quiet styling — historical context, not a primary value. */
.detail-original-proposal {
  margin-top: 6px;
  font-size: 12.5px;
  color: var(--muted);
  display: flex;
  align-items: baseline;
  gap: 6px;
}
.detail-original-label {
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-size: 10.5px;
}
.detail-original-rendering {
  font-family: var(--serif, "Times New Roman", serif);
  font-size: 14px;
  color: var(--accent);
  text-decoration: line-through;
  text-decoration-color: rgba(107, 58, 23, 0.4);
}