/* Reading and graph views share the same ledger and evidence controls. */
[hidden] { display: none !important; }
#mechanism-shell { min-height: 240px; }

.mechanism-view-switch {
  display: inline-flex;
  gap: 5px;
  padding: 5px;
  margin-bottom: 20px;
  border: 1px solid var(--line);
  border-radius: 13px;
  background: var(--paper-deep);
}

.mechanism-view-switch button {
  min-height: 44px;
  padding: 10px 24px;
  border: 0;
  border-radius: 9px;
  background: transparent;
  color: var(--ink-soft);
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
}

.mechanism-view-switch button[aria-pressed="true"] {
  background: var(--forest);
  color: var(--white);
  box-shadow: 0 3px 10px rgba(20, 36, 31, .12);
}

.mechanism-list { padding: 32px clamp(18px, 4vw, 56px); scroll-margin-top: 164px; }
.mechanism-list-heading { max-width: 820px; }
.mechanism-list-heading .eyebrow { margin: 0 0 8px; }
.mechanism-list-heading h3 { font-size: clamp(24px, 3vw, 34px); line-height: 1.2; margin: 0 0 12px; letter-spacing: -.025em; }
.mechanism-list-heading > p:last-child { color: var(--ink-soft); font-size: 14px; }
.mechanism-list-heading > p:last-child a { color: var(--forest); font-weight: 750; text-decoration: underline; text-underline-offset: 3px; }
.research-overview { margin: 28px 0; overflow: hidden; border: 1px solid rgba(36,86,72,.28); border-radius: 18px; background: #f5f8f1; }
.research-overview > header { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 28px; align-items: end; padding: 24px; border-bottom: 1px solid rgba(36,86,72,.18); background: linear-gradient(135deg,#edf5e6,#f8f7ef); }
.research-overview h4 { margin: 4px 0 8px; font-size: clamp(22px,2.5vw,31px); line-height: 1.18; }.research-overview header p:last-child { max-width: 780px; margin: 0; color: var(--ink-soft); font-size: 14px; }
.research-overview dl { display: grid; grid-template-columns: repeat(2,minmax(90px,1fr)); margin: 0; border: 1px solid rgba(36,86,72,.18); border-radius: 12px; overflow: hidden; background: rgba(255,255,255,.66); }.research-overview dl div { padding: 11px 14px; border-right: 1px solid rgba(36,86,72,.14); border-bottom: 1px solid rgba(36,86,72,.14); }.research-overview dl div:nth-child(even) { border-right: 0; }.research-overview dl div:nth-last-child(-n+2) { border-bottom: 0; }.research-overview dt { font: 800 18px var(--font-mono); }.research-overview dd { margin: 3px 0 0; color: var(--ink-faint); font-size: 9px; text-transform: uppercase; }
.research-columns { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); }.research-columns > details { min-width: 0; padding: 18px; border-right: 1px solid var(--line); }.research-columns > details:last-child { border-right: 0; }.research-columns summary { color: var(--forest); font-size: 13px; font-weight: 800; cursor: pointer; }.research-columns ul, .detail-paper-list { list-style: none; margin: 14px 0 0; padding: 0; }.research-columns li + li, .detail-paper-list li + li { margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--line); }.research-columns li p, .detail-paper-list p { margin: 6px 0 0; color: var(--ink-soft); font-size: 12px; line-height: 1.55; }.research-columns li span, .detail-paper-list span { display: block; margin-top: 4px; color: var(--ink-faint); font: 9px/1.5 var(--font-mono); }.research-columns a, .detail-paper-list a { color: var(--forest-2); text-decoration: underline; text-underline-offset: 3px; }.research-reviewed { margin: 0; padding: 11px 18px; border-top: 1px solid var(--line); color: var(--ink-faint); font: 9px var(--font-mono); text-transform: uppercase; }
.research-overview-error { padding: 18px; border-color: var(--line); background: #f7f5ee; }.research-overview-error p { margin: 5px 0 0; color: var(--ink-soft); font-size: 13px; }
.research-conflicts { margin: 0 18px 16px; padding: 14px 16px; border: 1px solid rgba(233,132,74,.5); border-left: 5px solid var(--orange); border-radius: 11px; background: #fff7ef; }.research-conflicts > p { margin: 4px 0 10px; color: #70442f; font-size: 12px; }.research-conflicts details + details { margin-top: 8px; }.research-conflicts summary { color: #8c431e; font-size: 12px; font-weight: 800; cursor: pointer; }.research-conflicts details p { margin: 7px 0; color: var(--ink-soft); font-size: 12px; }.research-conflicts ul { margin: 8px 0 0; padding-left: 18px; }.research-conflicts li + li { margin-top: 9px; }.research-conflicts a { color: #8c431e; font-size: 11px; font-weight: 750; text-decoration: underline; text-underline-offset: 3px; }.research-conflicts blockquote { margin: 4px 0 0; color: var(--ink-soft); font: 10px/1.55 var(--font-mono); white-space: pre-wrap; }
.list-tools { display: flex; align-items: flex-end; flex-wrap: wrap; gap: 16px; margin: 26px 0 12px; }
.list-search { flex: 1 1 300px; }
.list-search label, .list-scope label { display: block; font-size: 12px; font-weight: 700; margin-bottom: 7px; }
.list-search input { width: 100%; min-height: 44px; padding: 10px 13px; border: 1px solid var(--line); border-radius: 10px; background: #fffefa; font-size: 14px; color: var(--ink); }
.list-scope { flex: 0 1 235px; }.list-scope select { width: 100%; min-height: 44px; padding: 10px 34px 10px 12px; border: 1px solid var(--line); border-radius: 10px; background: #fffefa; color: var(--ink); font-size: 13px; }
.list-expand-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.list-expand-actions button { min-height: 44px; }
.list-result-count { font-family: var(--font-mono); font-size: 12px; color: var(--ink-soft); margin: 18px 0; }
.list-empty { padding: 26px; border: 1px dashed var(--line-strong); border-radius: 12px; background: #fffefa; }
.mechanism-rows { list-style: none; margin: 0; padding: 0; }
.mechanism-row { display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 20px; padding: 28px 0; border-top: 1px solid var(--line); }
.mechanism-number { font-family: var(--font-mono); font-size: 14px; color: var(--forest); width: 40px; height: 40px; display: grid; place-items: center; border: 1px solid #ccd5be; background: #e9efdf; border-radius: 10px; }
.mechanism-body { min-width: 0; }
.mechanism-row-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 12px; margin-bottom: 10px; font-size: 12px; color: var(--ink-soft); }
.research-scope-badge { display: inline-flex; align-items: center; min-height: 27px; padding: 4px 9px; border: 1px solid rgba(36,86,72,.28); border-radius: 999px; background: #eef5e8; color: var(--forest-2); font: 700 9px var(--font-mono); }
.mechanism-body > h4 { margin: 0 0 10px; font-size: clamp(17px, 2vw, 21px); line-height: 1.55; overflow-wrap: anywhere; }
.mechanism-linked-records { margin: 0 0 10px; font-size: 14px; color: var(--ink-soft); }
.mechanism-linked-records > span { display: inline-block; margin: 0 5px; }
.entity-link { padding: 0; border: 0; background: transparent; text-align: left; font: inherit; font-weight: 700; color: var(--forest); text-decoration: underline; text-decoration-color: #a8bbab; text-underline-offset: 4px; cursor: pointer; overflow-wrap: anywhere; }
.entity-link:hover { color: var(--forest-2); text-decoration-color: currentColor; }
.mechanism-statement { max-width: 920px; margin: 0 0 14px; color: var(--ink-soft); font-size: 15px; }
.mechanism-copy-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 12px; margin: 0 0 12px; }
.mechanism-copy-actions .tool-button { min-height: 40px; }
.copy-prompt-status { color: var(--forest); font-size: 12px; }
.copy-prompt-status:empty { margin: 0; }
.tool-button:disabled { cursor: wait; opacity: .6; }
.prompt-copy-dialog { width: min(760px, calc(100% - 32px)); max-height: calc(100dvh - 32px); padding: 24px; border: 1px solid var(--line); border-radius: 18px; background: #fffefa; color: var(--ink); box-shadow: var(--shadow); }
.prompt-copy-dialog::backdrop { background: rgba(20, 36, 31, .55); }
.prompt-copy-dialog h3 { margin: 0 0 12px; }
.prompt-copy-dialog p { font-size: 14px; color: var(--ink-soft); }
.prompt-copy-dialog textarea { display: block; width: 100%; min-height: 220px; max-height: 50dvh; resize: vertical; padding: 14px; border: 1px solid var(--line); border-radius: 9px; font-family: var(--font-mono); font-size: 13px; line-height: 1.5; }
.prompt-copy-dialog form { display: flex; justify-content: flex-end; margin-top: 16px; }
.mechanism-details > summary,
.component-directory > summary { width: fit-content; padding: 8px 0; color: var(--forest); font-size: 13px; font-weight: 700; cursor: pointer; outline-offset: 4px; }
.mechanism-details[open] > summary { margin-bottom: 12px; }
.mechanism-detail-content { border: 1px solid var(--line); border-radius: 14px; background: #fffefa; padding: 0 22px; overflow-wrap: anywhere; }
.list-loading { padding: 18px 0; color: var(--ink-soft); }
.list-detail-section { padding: 20px 0; }
.list-detail-section + .list-detail-section { border-top: 1px solid var(--line); }
.list-detail-section h5 { margin: 0 0 12px; font-size: 13px; color: var(--forest); }
.list-detail-section p { margin: 8px 0 14px; font-size: 14px; color: var(--ink-soft); }
.list-detail-section .list-event-title { font-weight: 700; color: var(--ink); }
.list-research-detail { margin: 0 -22px; padding: 20px 22px; background: #f4f7ee; }.list-research-detail .research-plain-language { color: var(--ink); font-size: 16px; line-height: 1.7; }.detail-paper-list strong { font-size: 13px; }
.list-participants { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.list-participants li { padding: 12px 14px; border-radius: 9px; background: #f1f5eb; font-size: 14px; }
.list-participants li > span { display: block; margin-top: 4px; font-size: 12px; color: var(--ink-soft); }
.list-participants p { font-size: 12px; margin-bottom: 0; }
.mechanism-facts { margin: 12px 0 18px; font-size: 13px; }
.mechanism-facts > div { display: grid; grid-template-columns: minmax(100px, 160px) minmax(0, 1fr); gap: 12px; padding: 9px 0; border-bottom: 1px solid #ede9dd; }
.mechanism-facts dt { font-weight: 650; color: var(--ink-soft); }
.mechanism-facts dd { margin: 0; }
.mechanism-facts small { display: block; margin-top: 5px; }
.list-evidence + .list-evidence { margin-top: 22px; padding-top: 22px; border-top: 1px dashed var(--line); }
.list-evidence h6 { font-size: 15px; margin: 0; }
.list-evidence .list-evidence-locator { font-family: var(--font-mono); font-size: 12px; }
.list-source-passage { margin: 12px 0 0; padding: 16px; border-left: 3px solid #b8c8aa; background: #f5f3ec; font-family: var(--font-sans); font-size: 14px; line-height: 1.75; white-space: pre-wrap; overflow-wrap: anywhere; }
.component-directory { margin-top: 24px; padding: 20px 24px; border: 1px solid var(--line); border-radius: 14px; background: #fffefa; }
.component-directory > summary { font-size: 16px; }
.component-directory > p { max-width: 800px; font-size: 14px; color: var(--ink-soft); }
.component-list { list-style: none; margin: 0; padding: 0; }
.component-list li { padding: 16px 0; border-top: 1px solid var(--line); }
.component-list h4 { margin: 0; font-size: 15px; }
.component-list h4 > span { display: inline-block; margin-left: 8px; color: var(--ink-faint); font-size: 12px; font-weight: 400; }
.component-list p { margin: 7px 0 0; font-size: 14px; color: var(--ink-soft); }
.list-footer-note { margin: 24px 0 0; color: var(--ink-soft); font-size: 13px; }

/* List entries expand in place; entity neighborhoods remain usable anywhere
   in the long reading view without scrolling back to the map. */
#mechanism-shell[data-view="list"] .detail-drawer {
  position: fixed;
  top: 16px;
  bottom: 16px;
  right: 16px;
  max-height: calc(100dvh - 32px);
  border: 1px solid var(--line);
  border-radius: 18px;
}

@media (max-width: 560px) {
  .mechanism-list { padding: 24px 16px; scroll-margin-top: 210px; }
  .mechanism-row { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .mechanism-number { height: 30px; width: 36px; font-size: 12px; }
  .mechanism-detail-content { padding: 0 14px; }
  .list-participants { grid-template-columns: 1fr; }
  .mechanism-facts > div { grid-template-columns: 1fr; gap: 3px; }
  .list-expand-actions { width: 100%; }
  .research-overview > header { grid-template-columns: 1fr; }.research-columns { grid-template-columns: 1fr; }.research-columns > details { border-right: 0; border-bottom: 1px solid var(--line); }.research-columns > details:last-child { border-bottom: 0; }.list-scope { flex: 1 1 100%; }
  .list-expand-actions button { flex: 1; padding: 8px; }
  .component-directory { padding: 16px; }
  #mechanism-shell[data-view="list"] .detail-drawer { width: calc(100% - 16px); right: 8px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}