:root {
  color-scheme: dark;
  --bg: #070a0f;
  --surface: #0d131c;
  --surface-2: #121b27;
  --surface-3: #182332;
  --line: #263345;
  --text: #f3f6fa;
  --muted: #94a3b7;
  --gold: #dec16b;
  --gold-strong: #f0d681;
  --green: #9fbd72;
  --blue: #72a9e1;
  --accent-bg: #292617;
  --accent-border: #8c7846;
  --home-halo: rgba(147, 126, 75, .13);
  --home-mid: #172235;
  --timeline-bg: #090e15;
  --timeline-header: #0e1620;
  --timeline-space: #080e16;
  --control: var(--surface-2);
  --control-hover: var(--surface-3);
  --control-border: var(--line);
  --selected: var(--accent-bg);
  --selected-border: var(--accent-border);
  --selected-text: var(--gold-strong);
  --canvas-card: var(--surface-2);
  --canvas-card-border: color-mix(in srgb, var(--line) 55%, var(--muted));
  --timeline-lane-alt: color-mix(in srgb, var(--timeline-space) 70%, var(--surface-2));
  --timeline-grid: color-mix(in srgb, var(--line) 75%, transparent);
  --timeline-lane-1: #d1d7e0;
  --timeline-lane-2: #e3c36d;
  --timeline-lane-3: #b58ad0;
  --timeline-lane-4: #6e91bd;
  --shadow-accent: color-mix(in srgb, var(--gold) 32%, transparent);
  --scene-inner: #101823;
  --scene-outer: #06090e;
  --scene-stars: #1a2430;
  --radius: 16px;
  font-family: "Space Grotesk", "Segoe UI", system-ui, sans-serif;
}

:root[data-tradition="catholic"] {
  --bg: #0d090c;
  --surface: #171117;
  --surface-2: #201820;
  --surface-3: #2a1d27;
  --line: #40303b;
  --gold: #d27d77;
  --gold-strong: #f2aaa2;
  --accent-bg: #321d24;
  --accent-border: #aa6266;
  --home-halo: rgba(174, 75, 77, .16);
  --home-mid: #2c1a24;
  --timeline-bg: #10090d;
  --timeline-header: #20131a;
  --timeline-space: #0d080c;
  --scene-inner: #29171d;
  --scene-outer: #0d080c;
  --scene-stars: #49303a;
}

:root[data-tradition="protestant"] {
  --bg: #080e0b;
  --surface: #101b16;
  --surface-2: #17241d;
  --surface-3: #203128;
  --line: #2d4338;
  --gold: #80bd87;
  --gold-strong: #b3dfaa;
  --accent-bg: #1d3024;
  --accent-border: #629f70;
  --home-halo: rgba(82, 156, 93, .15);
  --home-mid: #182a22;
  --timeline-bg: #09120d;
  --timeline-header: #14231a;
  --timeline-space: #071009;
  --scene-inner: #15271d;
  --scene-outer: #070e0a;
  --scene-stars: #2a4534;
}

:root[data-theme="light"] {
  color-scheme: light;
  --bg: #f4f6f8;
  --surface: #ffffff;
  --surface-2: #edf1f5;
  --surface-3: #e3eaf1;
  --line: #c9d3de;
  --text: #1b2938;
  --muted: #526477;
  --gold: #806515;
  --gold-strong: #6b5310;
  --blue: #285f9b;
  --green: #4c7430;
  --accent-bg: #f8efd3;
  --accent-border: #a98a3a;
  --home-halo: rgba(181, 151, 72, .15);
  --home-mid: #e7edf5;
  --timeline-bg: #f2f5f8;
  --timeline-header: #fff;
  --timeline-space: #edf2f7;
  --timeline-lane-1: #536273;
  --timeline-lane-2: #95701b;
  --timeline-lane-3: #765499;
  --timeline-lane-4: #386893;
  --scene-inner: #f7f9fc;
  --scene-outer: #e1e9f2;
  --scene-stars: #c9d5e2;
  --scene-label: #1b2938;
  --scene-subtitle: #526477;
  --scene-node-stroke: #203246;
}
:root[data-theme="light"][data-tradition="catholic"] {
  --bg: #faf5f5;
  --surface-2: #f6eaea;
  --surface-3: #eddcdd;
  --line: #dcc7c9;
  --gold: #9b464f;
  --gold-strong: #82333e;
  --accent-bg: #fae5e6;
  --accent-border: #bc727a;
  --home-halo: rgba(174, 75, 77, .13);
  --home-mid: #f5e5e8;
  --timeline-bg: #faf3f4;
  --timeline-space: #f6ebed;
  --scene-inner: #fcf8f9;
  --scene-outer: #f1e2e6;
  --scene-stars: #dcc6cb;
}
:root[data-theme="light"][data-tradition="protestant"] {
  --bg: #f4f8f4;
  --surface-2: #eaf2e9;
  --surface-3: #deebdf;
  --line: #c7d8ca;
  --gold: #3e754a;
  --gold-strong: #2d643a;
  --accent-bg: #e4f3e5;
  --accent-border: #75a680;
  --home-halo: rgba(82, 156, 93, .13);
  --home-mid: #e2efe5;
  --timeline-bg: #f1f7f2;
  --timeline-space: #eaf3eb;
  --scene-inner: #f7fbf7;
  --scene-outer: #e0ede2;
  --scene-stars: #c4d9c7;
}

* { box-sizing: border-box; }
html, body { width: 100%; height: 100%; margin: 0; overflow: hidden; background: var(--bg); color: var(--text); }
button, input, select { font: inherit; }
button { color: inherit; }
[hidden] { display: none !important; }

.launch {
  position: fixed; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: clamp(4px, 2vh, 18px); isolation: isolate; overflow: hidden;
  background:
    radial-gradient(ellipse 46% 54% at 50% 54%, var(--home-halo), transparent 76%),
    radial-gradient(ellipse 75% 75% at 50% 12%, var(--home-mid) 0, transparent 68%),
    linear-gradient(color-mix(in srgb, var(--gold) 2%, transparent) 1px, transparent 1px),
    linear-gradient(90deg, color-mix(in srgb, var(--gold) 2%, transparent) 1px, transparent 1px), var(--bg);
  background-size: auto, auto, 60px 60px, 60px 60px, auto;
  z-index: 20;
}
.launch::before, .launch::after { content: ""; position: absolute; z-index: -1; pointer-events: none; }
.launch::before { width: min(78vw, 750px); aspect-ratio: 1; border: 1px solid color-mix(in srgb, var(--gold) 8%, transparent); border-radius: 50%; box-shadow: 0 0 0 85px color-mix(in srgb, var(--gold) 2%, transparent), 0 0 0 170px color-mix(in srgb, var(--gold) 1%, transparent); }
.launch::after { bottom: 0; width: min(90vw, 900px); height: 1px; background: linear-gradient(90deg, transparent, var(--accent-border), transparent); }
.launch-copy { z-index: 1; text-align: center; }
.launch h1 { margin: 5px 0 3px; color: #f5f0e4; font-size: clamp(3.2rem, 6.4vw, 5.5rem); font-weight: 680; line-height: 1; letter-spacing: -.058em; text-shadow: 0 10px 35px #0008; }
.launch-copy .eyebrow { color: var(--gold-strong); font-size: .65rem; letter-spacing: .29em; }
.launch-copy > p:last-child { margin: 9px 0 0; color: #a9b4c0; font-size: clamp(.88rem, 1.5vw, 1.06rem); letter-spacing: .015em; }
.eyebrow { margin: 0; color: var(--gold); font-size: .66rem; font-weight: 800; letter-spacing: .18em; }
.launch-hint { z-index: 1; margin: 0; color: #778598; font-size: .63rem; font-weight: 750; letter-spacing: .19em; }
.launch-hint span { margin-inline: 7px; color: var(--gold); }
.theme-toggle { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 32px; padding: 6px 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface-2); color: var(--text); cursor: pointer; font-size: .68rem; font-weight: 750; white-space: nowrap; }
.theme-toggle:hover { border-color: var(--accent-border); background: var(--surface-3); }
.theme-toggle:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }
.theme-toggle span:first-child { font-size: .9rem; line-height: 1; }
.launch-theme-toggle { position: absolute; z-index: 3; top: 20px; right: 20px; }
.tradition-bar .theme-toggle { margin-left: auto; }
@media (max-width: 480px) { .tradition-bar .theme-toggle { padding-inline: 8px; } .tradition-bar .theme-toggle span:last-child { display: none; } }

.church-trigger { z-index: 1; min-width: 0; padding: 0; border: 0; background: transparent; display: grid; justify-items: center; gap: 2px; cursor: pointer; }
.church-trigger:focus-visible { outline: 2px solid var(--gold); outline-offset: 5px; border-radius: 16px; }
.church-scene { width: min(360px, 86vw); aspect-ratio: 360 / 310; display: grid; place-items: center; transition: transform 1.25s cubic-bezier(.16,1,.3,1), filter .6s; filter: drop-shadow(0 23px 28px #0009); }
.church-trigger:hover .church-scene { transform: translateY(-7px) scale(1.025); filter: drop-shadow(0 30px 30px #000a); }
.opening .church-scene, .opening .church-trigger:hover .church-scene { transform: translateY(4px) scale(1.04); }
.church-art { width: 100%; height: 100%; overflow: visible; }
.church-ground { opacity: .8; }
.church-step { fill: var(--surface); stroke: var(--gold); stroke-width: 1.5; }
.church-half-dome, .church-dome { fill: url("#church-dome-fill"); stroke: var(--gold-strong); stroke-width: 1.7; stroke-linejoin: round; }
.church-half-dome-ribs, .church-dome-ribs { fill: none; stroke: var(--gold); stroke-width: 1; opacity: .48; }
.church-drum, .church-wing, .church-facade { fill: url("#church-stone"); stroke: var(--gold); stroke-width: 1.6; stroke-linejoin: round; }
.church-drum-window, .church-window, .church-arcade { fill: var(--timeline-space); stroke: var(--gold); stroke-width: 1.4; }
.church-cross { fill: none; stroke: var(--gold-strong); stroke-width: 3.2; stroke-linecap: round; filter: drop-shadow(0 0 6px var(--gold)); }
.church-cornice { fill: none; stroke: var(--gold); stroke-width: 1.6; opacity: .7; }
.church-stone-lines { fill: none; stroke: var(--gold); stroke-width: 1; opacity: .23; }
.church-window-line { fill: none; stroke: var(--gold); stroke-width: 1.2; opacity: .8; }
.church-door-arch { fill: var(--surface-3); stroke: var(--gold-strong); stroke-width: 2; }
.church-doorway { fill: #050d16; stroke: var(--gold); stroke-width: 1; }
.church-interior-light { opacity: .08; transition: opacity .9s .18s ease; }
.church-interior-path { fill: var(--gold-strong); opacity: 0; transition: opacity .8s .3s ease; }
.church-door { transform-box: view-box; transition: transform 1.18s .12s cubic-bezier(.2,.75,.2,1); }
.church-door-left { transform-origin: 136px 210px; }
.church-door-right { transform-origin: 224px 210px; }
.church-door-panel { fill: url("#church-door-fill"); stroke: var(--gold-strong); stroke-width: 1.6; }
.church-door-inlay { fill: none; stroke: var(--gold); stroke-width: 1; opacity: .7; }
.church-door-grain { fill: none; stroke: var(--gold); stroke-width: .8; opacity: .28; }
.church-door-knob { fill: var(--gold-strong); }
.church-threshold { fill: var(--surface-3); stroke: var(--gold); stroke-width: 1.4; }
.opening .church-door-left { transform: scaleX(.17) skewY(5deg); }
.opening .church-door-right { transform: scaleX(.17) skewY(-5deg); }
.opening .church-interior-light { opacity: 1; }
.opening .church-interior-path { opacity: .22; }
.open-label { display: inline-flex; align-items: center; gap: 20px; padding: 13px 20px 13px 24px; border: 1px solid var(--accent-border); border-radius: 9px; background: var(--accent-bg); color: var(--gold-strong); box-shadow: inset 0 1px #e3c98127, 0 12px 28px #0005; font-size: .72rem; font-weight: 850; letter-spacing: .14em; transition: border-color .25s, background .25s, transform .25s, box-shadow .25s; }
.open-label span { font-size: 1.05rem; line-height: .7; font-weight: 400; }
.church-trigger:hover .open-label { border-color: var(--gold-strong); background: var(--surface-3); transform: translateY(-2px); box-shadow: inset 0 1px #e3c98140, 0 16px 30px #0008; }
.opening .open-label { opacity: .65; }
.launch.choosing .church-scene { width: min(285px, 62vw, 34vh); }
.launch.choosing .church-trigger { cursor: default; }
.launch.choosing .open-label { display: none; }
.home-perspectives { z-index: 2; width: min(620px, 92vw); display: grid; justify-items: center; gap: 10px; text-align: center; }
.home-perspectives[hidden] { display: none; }
.home-perspective-options { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); width: 100%; gap: 8px; }
.home-tradition-choice { min-height: 75px; padding: 11px 9px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface-2); color: var(--text); text-align: left; cursor: pointer; }
.home-tradition-choice strong, .home-tradition-choice small { display: block; }
.home-tradition-choice strong { font-size: .84rem; }
.home-tradition-choice small { margin-top: 4px; color: var(--muted); font-size: .63rem; line-height: 1.3; }
.home-tradition-choice:hover { border-color: var(--gold); }
.home-tradition-choice[aria-pressed="true"] { border-color: var(--accent-border); background: var(--accent-bg); box-shadow: 0 0 0 1px var(--gold); }
.home-tradition-choice[aria-pressed="true"] strong { color: var(--gold-strong); }
.home-tradition-choice:focus-visible, .home-enter:focus-visible, .home-tour:focus-visible { outline: 2px solid var(--gold); outline-offset: 3px; }
.home-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
.home-enter { padding: 9px 18px; border: 1px solid var(--accent-border); border-radius: 8px; background: var(--accent-bg); color: var(--gold-strong); cursor: pointer; font-size: .72rem; font-weight: 800; }
.home-enter:hover { filter: brightness(1.15); }
.home-tour { padding: 9px 18px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface-2); color: var(--text); cursor: pointer; font-size: .72rem; font-weight: 800; }
.home-tour:hover { border-color: var(--gold); color: var(--gold-strong); }
.home-tour span { margin-left: 5px; color: var(--gold); }
@media (max-height: 640px) {
  .launch { gap: 0; }
  .launch h1 { font-size: clamp(3rem, 5.5vw, 4.4rem); }
  .church-scene { width: min(330px, 82vw, 53vh); }
  .launch-hint { margin-top: 8px; }
}
@media (max-width: 480px) {
  .launch-copy { padding-inline: 18px; }
  .launch-copy .eyebrow { font-size: .56rem; letter-spacing: .2em; }
  .launch h1 { font-size: clamp(3.2rem, 13vw, 4.5rem); }
  .church-scene { width: min(360px, 92vw); }
  .home-perspective-options { grid-template-columns: 1fr; gap: 5px; }
  .home-tradition-choice { min-height: 0; padding: 7px 10px; }
  .home-tradition-choice strong { font-size: .76rem; }
  .home-tradition-choice small { margin-top: 1px; }
  .launch.choosing .church-scene { width: min(205px, 45vw, 27vh); }
}
@media (prefers-reduced-motion: reduce) {
  .church-scene, .church-door, .church-interior-light, .church-interior-path, .open-label { transition-duration: .01ms !important; transition-delay: 0ms !important; }
}

.application { height: 100%; display: grid; grid-template-rows: auto minmax(0,1fr); opacity: 0; }
.tradition-bar { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 5px; min-height: 42px; padding: 5px 10px; border-bottom: 1px solid var(--line); background: var(--surface); }
.tradition-choice { padding: 5px 10px; border: 1px solid var(--control-border); border-radius: 7px; background: var(--control); color: var(--text); cursor: pointer; font-size: .7rem; font-weight: 750; }
.tradition-choice[aria-pressed="true"] { border-color: var(--selected-border); background: var(--selected); color: var(--selected-text); }
.tradition-choice:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }
.auto-open-control { display: inline-flex; align-items: center; gap: 6px; min-height: 32px; padding: 4px 8px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface-2); color: var(--text); cursor: pointer; font-size: .68rem; font-weight: 700; white-space: nowrap; }
.auto-open-control input { margin: 0; accent-color: var(--gold); width: 16px; height: 16px; cursor: pointer; }
.auto-open-control:focus-within { outline: 2px solid var(--gold); outline-offset: 2px; }
.record-node-option[aria-pressed="true"], .timeline-result[aria-pressed="true"], .timeline-prelude-event[aria-pressed="true"] { border-color: var(--selected-border); background: var(--selected); color: var(--selected-text); }
.perspective-label { color: var(--gold-strong); font-size: .72rem; font-weight: 800; }
@media (max-width: 780px) { .tradition-bar { justify-content: flex-start; } }
@media (max-width: 480px) { .auto-open-control { font-size: .64rem; padding-inline: 6px; } }
.mobile-nav, .mobile-world-close { display: none; }
.application.revealed { animation: reveal .42s ease-out forwards; }
@keyframes reveal { to { opacity: 1; } }
.app-header { display: none; align-items: center; justify-content: space-between; padding: 0 18px; border-bottom: 1px solid var(--line); background: var(--surface); }
.brand { display: flex; align-items: center; gap: 10px; border: 0; background: transparent; text-align: left; cursor: pointer; }
.brand-mark { display: grid; place-items: center; width: 34px; height: 34px; border: 1px solid var(--accent-border); border-radius: 9px; color: var(--gold); font-size: 1.35rem; }
.church-mark { width: 23px; height: 23px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.brand strong, .brand small { display: block; }
.brand strong { font-size: 1rem; }
.brand small { margin-top: 2px; color: var(--muted); font-size: .68rem; }
.header-actions { display: flex; align-items: center; gap: 8px; }
.content-stat { color: var(--muted); font-size: .72rem; margin-right: 7px; }
.button, .tool-button, .icon-button, .segment, .record-tab {
  border: 1px solid var(--line); border-radius: 9px; background: var(--surface-2); cursor: pointer;
}
.button { padding: 8px 13px; font-size: .78rem; font-weight: 700; }
.button.primary { border-color: var(--selected-border); background: var(--selected); color: var(--selected-text); }
.support-button {
  display: inline-flex; align-items: center; gap: 6px;
  border-color: var(--accent-border);
  background: var(--accent-bg);
  color: var(--gold-strong);
  text-decoration: none;
  white-space: nowrap;
}
.support-button:hover, .support-button:focus-visible {
  border-color: var(--gold);
  background: var(--surface-3);
  color: var(--gold-strong);
}
.button.active { border-color: var(--selected-border); background: var(--selected); color: var(--selected-text); }
.button:hover, .tool-button:hover { background: var(--surface-3); }

.workspace {
  --world-width: 210px;
  --inspector-width: 390px;
  position: relative; min-height: 0; display: grid;
  grid-template-columns: var(--world-width) minmax(420px, 1fr) var(--inspector-width);
  transition: grid-template-columns .22s ease;
}
.world-rail { min-height: 0; display: flex; flex-direction: column; padding: 14px 10px; border-right: 1px solid var(--line); background: var(--surface); overflow: hidden; transition: width .2s, padding .2s; }
.rail-home { display: flex; align-items: center; gap: 10px; min-height: 43px; width: 100%; margin-bottom: 13px; padding: 5px 7px; border: 0; border-bottom: 1px solid var(--line); background: transparent; text-align: left; cursor: pointer; }
.rail-home span { display: grid; place-items: center; flex: 0 0 30px; height: 30px; border: 1px solid var(--accent-border); border-radius: 8px; color: var(--gold); font-size: 1.2rem; }
.rail-home strong { font-size: .88rem; }
.rail-home:hover strong, .rail-home:focus-visible strong { color: var(--gold-strong); }
.rail-heading { height: 30px; display: flex; align-items: center; justify-content: space-between; padding: 0 7px; color: var(--muted); font-size: .63rem; font-weight: 800; letter-spacing: .13em; }
.icon-button { width: 25px; height: 25px; padding: 0; color: var(--muted); }
.world-list { display: grid; align-content: start; flex: 1; min-height: 0; gap: 5px; margin-top: 8px; overflow-y: auto; scrollbar-width: thin; }
.tour-launch { display: flex; align-items: center; justify-content: center; border: 1px solid var(--accent-border); border-radius: 9px; background: var(--selected); color: var(--selected-text); font: inherit; font-weight: 750; cursor: pointer; }
.tour-launch:hover, .tour-launch:focus-visible { border-color: var(--gold); color: var(--gold-strong); }
.tour-launch span:first-child { color: var(--gold); font-size: 1rem; }
.guided-tour { position: absolute; z-index: 9; top: 20px; right: calc(var(--inspector-width) + 20px); width: min(340px, calc(100% - var(--world-width) - var(--inspector-width) - 40px)); padding: 15px 17px; border: 1px solid var(--accent-border); border-radius: 13px; background: var(--surface); box-shadow: 0 15px 40px #0007; color: var(--text); }
.guided-tour[hidden] { display: none; }
.guided-tour-progress { margin: 0 0 7px; color: var(--gold); font-size: .61rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.guided-tour h2 { margin: 0 0 7px; font-size: 1rem; }
.guided-tour-detail { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 4; overflow: hidden; min-height: 2.8em; margin: 0 0 12px; color: var(--muted); font-size: .72rem; line-height: 1.45; }
.guided-tour-controls { display: flex; flex-wrap: wrap; gap: 6px; }
.guided-tour-controls button { min-height: 34px; padding: 6px 9px; border: 1px solid var(--line); border-radius: 7px; background: var(--control); color: var(--text); font: inherit; font-size: .67rem; cursor: pointer; }
.guided-tour-controls button:hover, .guided-tour-controls button:focus-visible { border-color: var(--gold); }
.guided-tour-controls button[hidden] { display: none; }
.tour-cursor { position: absolute; z-index: 10; width: 18px; height: 18px; border: 2px solid var(--gold-strong); border-radius: 50%; background: var(--gold); box-shadow: 0 0 0 5px #d7b86b33, 0 0 19px var(--gold); transform: translate(-50%,-50%); pointer-events: none; }
.tour-cursor[hidden] { display: none; }
.tour-cursor.tap { animation: tour-tap .55s ease-out; }
.tour-hover { outline: 2px solid var(--gold) !important; outline-offset: 2px; }
@keyframes tour-tap { 50% { box-shadow: 0 0 0 18px #d7b86b22, 0 0 22px var(--gold); } }
@media (prefers-reduced-motion: reduce) { .tour-cursor { transition: none; animation: none !important; } }
.rail-footer { display: grid; gap: 10px; padding: 12px 7px 2px; border-top: 1px solid var(--line); }
.rail-footer .content-stat { margin: 0; line-height: 1.4; }
.rail-footer-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
.rail-footer-actions > * { min-width: 0; min-height: 58px; padding: 5px 3px; flex-direction: column; justify-content: center; gap: 3px; text-align: center; white-space: normal; font-size: .65rem; line-height: 1.15; }
.rail-footer-actions > * span:first-child { font-size: 1rem; }
.world-group-label { margin: 9px 8px 2px; color: #66758a; font-size: .56rem; font-weight: 850; letter-spacing: .11em; text-transform: uppercase; }
.world-group-label:first-child { margin-top: 2px; }
.tradition-group-label { margin-top: 17px; padding-top: 15px; border-top: 1px solid var(--line); color: var(--gold); }
.world-button { width: 100%; display: grid; grid-template-columns: 8px 1fr; gap: 9px; align-items: center; padding: 10px; border: 1px solid transparent; border-radius: 9px; background: transparent; color: #afbbca; text-align: left; cursor: pointer; font-size: .76rem; }
.world-button::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--muted); }
.world-button:hover { background: var(--surface); color: var(--text); }
.world-button.active { border-color: var(--selected-border); background: var(--selected); color: var(--selected-text); }
.world-button.active::before { background: var(--gold); box-shadow: 0 0 9px var(--gold); }
.workspace.worlds-collapsed { --world-width: 58px; }
.worlds-collapsed .world-rail { padding-inline: 8px; }
.worlds-collapsed .tour-launch-label { display: none; }
.worlds-collapsed .rail-home strong, .worlds-collapsed .rail-footer .content-stat, .worlds-collapsed .rail-support span:last-child { display: none; }
.worlds-collapsed .rail-footer { padding-inline: 0; }
.worlds-collapsed .rail-footer-actions { grid-template-columns: 1fr; }
.worlds-collapsed .rail-footer-actions > * { min-height: 40px; }
.worlds-collapsed .rail-home { justify-content: center; padding-inline: 0; }
.worlds-collapsed .rail-heading span, .worlds-collapsed .world-button, .worlds-collapsed .world-group-label { font-size: 0; }
.worlds-collapsed .world-group-label { height: 1px; margin: 5px 9px; background: var(--line); }
.worlds-collapsed .tradition-group-label { padding: 0; border: 0; background: var(--gold); }
.worlds-collapsed .world-button { display: grid; grid-template-columns: 1fr; place-items: center; padding: 12px; }
.worlds-collapsed .world-button::before { width: 9px; height: 9px; }

.stage { position: relative; min-width: 0; overflow: hidden; background: var(--bg); }
#scene-canvas { width: 100%; height: 100%; display: block; touch-action: none; cursor: grab; }
#scene-canvas:active { cursor: grabbing; }
.scene-heading { position: absolute; top: 22px; left: 24px; max-width: min(580px,70%); pointer-events: none; text-shadow: 0 2px 15px #000; }
.scene-heading h2 { margin: 5px 0 3px; font-size: clamp(1.15rem,2vw,1.65rem); }
.scene-heading p:last-child { margin: 0; color: var(--muted); font-size: .75rem; line-height: 1.45; }
.stage-toolbar { position: absolute; left: 18px; right: 18px; bottom: 17px; display: flex; align-items: center; gap: 7px; pointer-events: none; }
.tool-button { padding: 7px 10px; color: #cbd5e2; font-size: .72rem; pointer-events: auto; }
.touch-control, .mobile-gesture-help { display: none; }
.node-spacing { display: inline-flex; align-items: center; gap: 7px; padding: 5px 9px; border: 1px solid var(--control-border); border-radius: 8px; background: var(--control); color: var(--text); font-size: .67rem; font-weight: 700; white-space: nowrap; pointer-events: auto; }
.node-spacing[hidden] { display: none; }
.node-spacing input { width: 88px; margin: 0; accent-color: var(--gold); cursor: pointer; }
.node-spacing output { min-width: 3.3em; color: var(--gold-strong); text-align: right; }
.timeline-spacing { margin-left: auto; }
.gesture-help { margin-left: auto; color: #68768a; font-size: .66rem; text-shadow: 0 1px 6px #000; }
.inspector-reopen {
  position: absolute; z-index: 3; right: 15px; top: 17px; padding: 8px 12px;
  border: 1px solid var(--selected-border); border-radius: 9px; background: var(--selected);
  color: var(--gold-strong); font-size: .72rem; font-weight: 750; cursor: pointer;
}

.timeline-stage { position: absolute; inset: 0; z-index: 2; display: grid; grid-template-columns: minmax(0,1fr); grid-template-rows: auto minmax(0,1fr) auto; background: var(--timeline-bg); }
.writings-stage { position: absolute; inset: 0; z-index: 3; overflow-y: auto; overscroll-behavior: contain; container-type: inline-size; background: radial-gradient(ellipse 95% 38% at 50% -8%, color-mix(in srgb, var(--gold) 13%, transparent), transparent 73%), var(--timeline-bg); scrollbar-color: var(--line) transparent; }
.metaplot-stage { position: absolute; inset: 0; z-index: 3; overflow: hidden; background: #171717; color: #eee; }
.metaplot-stage canvas { display: block; width: 100%; height: 100%; touch-action: none; cursor: grab; }
.metaplot-stage canvas:active { cursor: grabbing; }
.metaplot-workspace { position: relative; padding: 2px 2px 17px; border-bottom: 1px solid var(--line); }
.metaplot-header h3 { margin: 5px 0 3px; font-size: 1.15rem; }
.metaplot-header .eyebrow { margin: 0; color: var(--gold-strong); }
.metaplot-count { margin: 0; color: var(--muted); font-size: .72rem; }
.metaplot-actions { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; margin-top: 15px; }
.metaplot-actions input { grid-column: 1 / -1; width: 100%; min-height: 39px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 7px; background: var(--surface-2); color: var(--text); }
.metaplot-actions button { padding: 8px 9px; border: 1px solid var(--line); border-radius: 7px; background: var(--surface-2); color: var(--text); cursor: pointer; }
.metaplot-details button { padding: 7px 9px; border: 1px solid #484848; border-radius: 7px; background: #2b2b2b; color: #f4f4f4; cursor: pointer; }
.metaplot-actions button:hover,.metaplot-details button:hover,.metaplot-results button:hover { border-color: var(--gold); }
.metaplot-results { width: 100%; max-height: 260px; overflow-y: auto; margin-top: 8px; padding: 6px; border: 1px solid var(--line); border-radius: 9px; background: var(--surface-2); color: var(--text); }
.metaplot-results button { display: block; width: 100%; padding: 8px; border: 1px solid transparent; border-radius: 6px; background: transparent; color: var(--text); text-align: left; cursor: pointer; }
.metaplot-workspace-hint { margin: 12px 0 0; color: var(--muted); font-size: .72rem; line-height: 1.45; }
.metaplot-active .browse-hint,.metaplot-active .control-section { display: none; }
.metaplot-details { position: absolute; z-index: 2; right: 16px; bottom: 17px; width: min(280px, calc(100% - 32px)); max-height: min(40vh, 300px); overflow-y: auto; padding: 12px; border: 1px solid #484848; border-radius: 10px; background: #242424f2; color: #f4f4f4; font-size: .8rem; }
.metaplot-details strong,.metaplot-details small { display: block; }
.metaplot-details small { margin-top: 3px; color: #b8b8b8; }
.metaplot-details p { margin: 7px 0; }
.metaplot-neighbors { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 10px; }
.metaplot-neighbors button { padding: 5px 7px; font-size: .72rem; }
.metaplot-help { position: absolute; left: 18px; bottom: 14px; color: #aaa; font-size: .7rem; pointer-events: none; }
:root[data-theme="light"] .metaplot-stage { background: #f7f9fc; color: #263746; }
:root[data-theme="light"] .metaplot-details { border-color: #c9d3de; background: #fffffff2; color: #1b2938; }
:root[data-theme="light"] .metaplot-details small { color: #526477; }
:root[data-theme="light"] .metaplot-details button { border-color: #c9d3de; background: #edf1f5; color: #1b2938; }
:root[data-theme="light"] .metaplot-help { color: #526477; }
@media (max-width: 780px) { .metaplot-details { right: 9px; bottom: 9px; max-height: 27vh; } .metaplot-help { display: block; max-width: 54%; left: 12px; bottom: 10px; font-size: .62rem; line-height: 1.35; } }
.writings-hero { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 15px 24px 14px; border-bottom: 1px solid var(--line); background: var(--timeline-header); }
.workspace.inspector-collapsed .writings-hero { padding-right: 155px; }
.writings-heading { min-width: 0; }
.writings-hero h2 { margin: 4px 0 3px; font-size: clamp(1.15rem,2vw,1.65rem); line-height: 1.2; }
.writings-summary { max-width: 560px; margin: 0; color: var(--muted); font-size: .73rem; line-height: 1.4; }
.writings-hero-info { display: none; }
.writings-figures { display: flex; gap: 15px; flex: 0 0 auto; }
.writings-stat { display: grid; gap: 1px; text-align: center; }
.writings-stat strong { color: var(--gold-strong); font-size: 1.25rem; line-height: 1; }
.writings-stat span { color: var(--muted); font-size: .52rem; font-weight: 800; letter-spacing: .08em; white-space: nowrap; }
.writings-controls { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; padding: 13px clamp(20px,3.4vw,52px); border-bottom: 1px solid var(--line); background: var(--surface); }
.writings-view-tabs { display: flex; padding: 3px; border: 1px solid var(--accent-border); border-radius: 9px; background: var(--accent-bg); }
.writings-view-tab { min-width: 58px; padding: 8px 11px; border: 0; border-radius: 6px; background: transparent; color: var(--muted); font-size: .7rem; font-weight: 800; cursor: pointer; }
.writings-view-tab[aria-pressed="true"] { background: var(--surface-3); color: var(--gold-strong); box-shadow: inset 0 0 0 1px var(--accent-border); }
.writings-tabs { display: flex; padding: 3px; border: 1px solid var(--line); border-radius: 9px; background: var(--bg); }
.writings-tab { padding: 8px 10px; border: 0; border-radius: 6px; background: transparent; color: var(--muted); font-size: .7rem; font-weight: 750; cursor: pointer; }
.writings-tab[aria-pressed="true"] { background: var(--accent-bg); color: var(--gold-strong); box-shadow: inset 0 0 0 1px var(--accent-border); }
.writings-tab-short { display: none; }
.writings-search { flex: 1 1 180px; min-width: 120px; max-width: 350px; padding: 9px 12px; border: 1px solid var(--line); border-radius: 8px; outline: 0; background: var(--bg); color: var(--text); font-size: .76rem; }
.writings-search:focus { border-color: var(--gold); }
.writings-outside { display: inline-flex; align-items: center; gap: 7px; color: var(--muted); font-size: .72rem; cursor: pointer; }
.writings-outside input { accent-color: var(--gold); }
.writings-content { min-width: 0; padding: 18px 24px 24px; }
.writings-shelves { min-width: 0; }
.writings-node-pane { min-width: 0; }
.writings-node-header { display: flex; align-items: end; justify-content: space-between; gap: 10px; margin-bottom: 12px; }
.writings-node-header small { color: var(--gold); font-size: .58rem; font-weight: 800; letter-spacing: .16em; }
.writings-node-header h3 { margin: 4px 0 0; font-size: 1.35rem; font-weight: 400; }
.writings-node-back { padding: 8px 10px; border: 1px solid var(--line); border-radius: 7px; background: var(--surface-2); color: var(--gold-strong); font-size: .68rem; cursor: pointer; white-space: nowrap; }
.writings-node-canvas-wrap { position: relative; height: clamp(380px,56vh,560px); overflow: hidden; border: 1px solid var(--accent-border); border-radius: 12px; background: var(--scene-outer); box-shadow: inset 0 0 60px #0007, 0 10px 28px #0003; }
.writings-node-canvas { display: block; width: 100%; height: 100%; touch-action: none; cursor: grab; }
.writings-node-canvas:active { cursor: grabbing; }
.writings-node-tools { position: absolute; top: 12px; right: 12px; display: flex; gap: 5px; }
.writings-node-tools button { min-width: 32px; min-height: 32px; padding: 4px 8px; border: 1px solid var(--line); border-radius: 6px; background: var(--surface-2); color: var(--text); cursor: pointer; font-size: .72rem; }
.writings-node-hint { position: absolute; bottom: 7px; left: 12px; margin: 0; color: var(--muted); font-size: .59rem; pointer-events: none; }
.writings-node-choices { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 11px; }
.writings-node-choice { padding: 7px 9px; border: 1px solid var(--line); border-radius: 7px; background: var(--surface-2); color: var(--text); font-size: .68rem; cursor: pointer; }
.writings-node-choice:hover,.writings-node-choice[aria-pressed="true"] { border-color: var(--accent-border); background: var(--accent-bg); color: var(--gold-strong); }
.writings-shelf { margin-bottom: 29px; }
.writings-shelf-heading { display: flex; align-items: baseline; gap: 10px; margin: 0 0 11px; padding-bottom: 9px; border-bottom: 1px solid var(--line); }
.writings-shelf-heading span { color: var(--gold); font-size: .58rem; font-weight: 850; letter-spacing: .13em; text-transform: uppercase; }
.writings-shelf-heading h3 { margin: 0; font-size: 1.16rem; font-weight: 400; }
.writings-shelf-heading small { margin-left: auto; color: var(--muted); font-size: .62rem; white-space: nowrap; }
.writings-grid { display: grid; grid-template-columns: repeat(auto-fill,minmax(140px,1fr)); gap: 9px; }
.writings-book { position: relative; display: flex; flex-direction: column; align-items: flex-start; min-height: 114px; padding: 11px 12px 10px 16px; overflow: hidden; border: 1px solid var(--line); border-radius: 8px; background: linear-gradient(145deg, var(--surface-2), var(--surface)); text-align: left; cursor: pointer; transition: transform .15s, border-color .15s, background .15s; }
.writings-book::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 3px; background: color-mix(in srgb, var(--gold) 70%, transparent); }
.writings-book:hover { transform: translateY(-2px); border-color: var(--gold); }
.writings-book[aria-pressed="true"] { border-color: var(--gold); background: var(--accent-bg); box-shadow: 0 0 0 1px var(--accent-border), 0 8px 25px #0004; }
.writings-book.outside { opacity: .67; }
.writings-book-spine { color: var(--gold); font-size: .68rem; line-height: 1; }
.writings-book strong { margin-top: 7px; color: var(--text); font-size: .83rem; font-weight: 600; line-height: 1.15; }
.writings-book small { margin-top: 5px; color: var(--muted); font-size: .62rem; }
.writings-book-status { margin-top: auto; padding-top: 8px; color: var(--gold); font-size: .53rem; font-weight: 800; letter-spacing: .045em; text-transform: uppercase; }
.writings-book.outside .writings-book-status { color: var(--muted); }
.writings-empty { color: var(--muted); }
.writings-footer { padding: 20px clamp(20px,3.4vw,52px) 35px; border-top: 1px solid var(--line); color: var(--muted); font-size: .67rem; line-height: 1.6; }
.writings-footer p { max-width: 850px; }
.writings-sources { display: flex; flex-wrap: wrap; gap: 8px 17px; }
.writings-sources a { color: var(--gold); text-decoration: underline; text-underline-offset: 3px; }
.writings-canons-pane { min-width: 0; height: 100%; }
.writings-canon-comparison { display: flex; flex-direction: column; min-width: 0; height: 100%; padding: 14px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); }
.writings-canon-top { display: flex; align-items: end; justify-content: space-between; flex-wrap: wrap; gap: 10px 16px; }
.writings-canon-top small { color: var(--gold); font-size: .58rem; font-weight: 800; letter-spacing: .14em; }
.writings-canon-top h3 { margin: 3px 0 0; font-size: 1.27rem; font-weight: 400; }
.writings-canon-filters { display: flex; flex-wrap: wrap; gap: 5px; }
.writings-canon-filter,.writings-canon-select,.writings-canon-search { min-height: 32px; padding: 6px 9px; border: 1px solid var(--line); border-radius: 7px; background: var(--surface-2); color: var(--text); font-size: .67rem; font-weight: 700; }
.writings-canon-filter { cursor: pointer; }
.writings-canon-filter[aria-pressed="true"] { border-color: var(--accent-border); background: var(--accent-bg); color: var(--gold-strong); }
.writings-canon-search { width: 125px; font-weight: 400; }
.writings-canon-picker { position: relative; margin-top: 10px; align-self: flex-start; color: var(--text); font-size: .68rem; }
.writings-canon-picker > summary { cursor: pointer; padding: 6px 9px; border: 1px solid var(--line); border-radius: 7px; background: var(--surface-2); font-weight: 700; }
.writings-canon-picker-body { position: absolute; z-index: 8; top: calc(100% + 4px); left: 0; display: grid; grid-template-columns: repeat(2, minmax(180px, 1fr)); gap: 3px 14px; width: min(520px, calc(100vw - 80px)); max-height: 320px; overflow: auto; padding: 12px; border: 1px solid var(--line); border-radius: 9px; background: var(--surface); box-shadow: 0 12px 28px #0008; }
.writings-canon-picker-actions { display: flex; grid-column: 1 / -1; gap: 6px; margin-bottom: 5px; }
.writings-canon-picker-item { display: flex; align-items: center; gap: 7px; padding: 5px 3px; cursor: pointer; }
.writings-canon-picker-item input { accent-color: var(--gold); }
.writings-canon-note { margin: 9px 0 12px; color: var(--muted); font-size: .66rem; line-height: 1.45; }
.writings-canon-note-toggle { display: none; }
.writings-canon-note strong { color: #ffdda0; }
.writings-canon-scroll-hint { display: none; margin: -5px 0 8px; color: var(--gold-strong); font-size: .62rem; font-weight: 700; }
.writings-canon-scroll { min-width: 0; min-height: 0; flex: 1 1 auto; overflow: auto; border: 1px solid var(--line); border-radius: 8px; scrollbar-color: var(--line) transparent; }
.writings-canon-table { width: 100%; min-width: 720px; border-spacing: 0; border-collapse: separate; table-layout: fixed; text-align: left; }
.writings-canon-table th,.writings-canon-table td { border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.writings-canon-table tr > :last-child { border-right: 0; }
.writings-canon-table thead th { position: sticky; z-index: 2; top: 0; height: 61px; padding: 5px; background: var(--surface-2); vertical-align: middle; }
.writings-canon-table thead th:first-child { z-index: 4; left: 0; width: var(--canon-book-width, 155px); padding-left: 12px; color: var(--muted); font-size: .65rem; text-transform: uppercase; letter-spacing: .08em; }
.writings-canon-witness { display: grid; width: 100%; gap: 3px; padding: 7px 6px; border: 1px solid transparent; border-radius: 6px; background: transparent; color: var(--text); text-align: center; cursor: pointer; }
.writings-canon-witness strong { font-size: .73rem; }
.writings-canon-witness small { color: var(--muted); font-size: .59rem; }
.writings-canon-witness:hover,.writings-canon-witness[aria-pressed="true"] { border-color: var(--accent-border); background: var(--accent-bg); color: var(--gold-strong); }
.writings-canon-group th { padding: 8px 12px; background: var(--accent-bg); color: var(--gold-strong); font-size: .62rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.writings-canon-table tbody tr:not(.writings-canon-group):hover td,.writings-canon-table tbody tr:not(.writings-canon-group):hover th { background: var(--surface-2); }
.writings-canon-table tbody td { height: 35px; padding: 5px; text-align: center; }
.writings-canon-book { position: sticky; z-index: 1; left: 0; padding: 0 8px; background: var(--surface); }
.writings-canon-book button { display: block; width: 100%; padding: 7px 3px; border: 0; background: transparent; color: var(--text); font-size: .69rem; font-weight: 700; text-align: left; cursor: pointer; }
.writings-canon-book button:hover { color: var(--gold-strong); }
.writings-canon-status { display: inline-block; min-width: 96px; padding: 4px 6px; border: 1px solid; border-radius: 5px; font-size: .6rem; font-weight: 800; white-space: nowrap; }
.writings-canon-status.canonical { border-color: #398d69; background: #173d31; color: #b9f2d4; }
.writings-canon-status.read { border-color: #bd842e; background: #4b3416; color: #ffdda0; }
.writings-canon-status.uncertain { border-color: #3c98a5; background: #163b46; color: #b9eff5; }
.writings-canon-status.disputed { border-color: #9165bd; background: #38234c; color: #e7c9ff; }
.writings-canon-status.reported { border-color: #c77951; background: #4b2a1f; color: #ffd0b6; }
.writings-canon-status.mentioned { border-color: #5e8fcb; background: #1b385a; color: #c5e0ff; }
.writings-canon-status.not_counted { border-color: #ad6387; background: #462638; color: #ffd0e5; }
.writings-canon-status.unassessed { border-color: #66768b; background: #283342; color: #d4dfed; }
.writings-canon-status.missing { border-color: #bb5d67; background: #4b242b; color: #ffc2c8; }
.writings-canon-status.outside-scope { border-color: #4c5c6c; background: #1c2732; color: #adbdca; }
.writings-canon-empty { padding: 24px; color: var(--muted); font-size: .74rem; text-align: center; }
.writings-canon-filter:focus-visible,.writings-canon-select:focus-visible,.writings-canon-search:focus-visible,.writings-canon-scroll:focus-visible,.writings-canon-witness:focus-visible,.writings-canon-book button:focus-visible { outline: 2px solid var(--gold); outline-offset: -2px; }
.writings-stage.canons-mode { display: flex; flex-direction: column; overflow: hidden; }
.writings-stage.canons-mode .writings-hero,.writings-stage.canons-mode .writings-controls { flex: 0 0 auto; }
.writings-stage.canons-mode .writings-content { flex: 1 1 auto; min-height: 0; padding-block: 12px; }
.canon-vault-work { color: var(--gold-strong); font-weight: 750; }
.canon-vault-type { width: fit-content; margin: 5px 0 8px; padding: 4px 7px; border: 1px solid var(--accent-border); border-radius: 5px; background: var(--accent-bg); color: var(--gold-strong); font-size: .64rem; font-weight: 800; }
.canon-vault-count { color: var(--muted); font-size: .73rem; }
.canon-vault-sources { display: grid; gap: 7px; margin-top: 12px; }
.canon-vault-sources a { width: fit-content; font-size: .7rem; }
.canon-vault-source-orders { margin-top: 18px; padding: 12px; border: 1px solid var(--line); border-radius: 9px; background: var(--surface-2); }
.canon-vault-order-disclosure > summary { color: var(--gold-strong); font-size: .75rem; font-weight: 800; cursor: pointer; }
.canon-vault-order-intro,.canon-vault-order-note { color: var(--muted); font-size: .66rem; line-height: 1.5; }
.canon-vault-order-group + .canon-vault-order-group { margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--line); }
.canon-vault-order-group h4 { margin: 11px 0 5px; color: var(--text); font-size: .73rem; }
.canon-vault-order-list { columns: 2 160px; column-gap: 22px; margin: 10px 0 2px; padding-left: 23px; color: var(--text); font-size: .66rem; line-height: 1.5; }
.canon-vault-order-list li { break-inside: avoid; padding: 2px 0 2px 3px; }
.canon-vault-order-list li::marker { color: var(--gold-strong); font-size: .6rem; }
.canon-vault-section { margin-top: 20px; padding-top: 12px; border-top: 1px solid var(--line); }
.canon-vault-section h4 { margin: 0 0 9px; color: var(--gold-strong); font-size: .76rem; }
.canon-vault-disclosure { margin: 8px 0; }
.canon-vault-disclosure summary { color: var(--muted); font-size: .68rem; font-weight: 750; cursor: pointer; }
.canon-vault-books { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 9px; }
.canon-vault-book { padding: 6px 8px; border: 1px solid var(--line); border-radius: 6px; background: var(--surface-2); color: var(--text); font-size: .66rem; cursor: pointer; }
.canon-vault-book:hover { border-color: var(--accent-border); color: var(--gold-strong); }
.canon-vault-book:focus-visible,.canon-vault-disclosure summary:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }
.canon-vault-caution { margin-top: 18px; padding-top: 12px; border-top: 1px solid var(--line); color: var(--muted); font-size: .7rem; }
.writings-tab:focus-visible,.writings-view-tab:focus-visible,.writings-node-back:focus-visible,.writings-node-choice:focus-visible,.writings-node-tools button:focus-visible,.writings-node-canvas:focus-visible,.writings-book:focus-visible,.writings-sources a:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }
.writings-stage.nodes-mode { display: flex; flex-direction: column; overflow: hidden; }
.writings-stage.nodes-mode .writings-hero,.writings-stage.nodes-mode .writings-controls { flex: 0 0 auto; }
.writings-stage.nodes-mode .writings-content { flex: 1 1 auto; min-height: 0; padding-block: 12px 10px; }
.writings-stage.nodes-mode .writings-node-pane { display: flex; flex-direction: column; height: 100%; min-height: 0; }
.writings-stage.nodes-mode .writings-node-canvas-wrap { flex: 1 1 auto; min-height: 0; height: auto; }
.writings-stage.nodes-mode .writings-node-choices { flex: 0 0 auto; max-height: 62px; overflow-y: auto; }
.writings-stage.nodes-mode .writings-footer { display: none; }
@container (max-width: 760px) { .writings-hero { align-items: flex-start; flex-direction: column; gap: 9px; } .writings-figures { gap: 21px; } }
@media (max-width: 780px) { .writings-hero,.workspace.inspector-collapsed .writings-hero { padding: 15px 17px 13px; } .writings-controls { padding: 10px 16px; gap: 9px; } .writings-tabs { width: 100%; } .writings-tab { flex: 1; min-height: 40px; } .writings-view-tab { min-height: 40px; } .writings-search { max-width: none; min-height: 42px; font-size: 1rem; } .writings-content { padding: 16px; } .writings-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } .writings-book { min-height: 105px; } .writings-stage.nodes-mode { display: block; overflow-y: auto; } .writings-stage.nodes-mode .writings-content { padding: 14px 16px; } .writings-stage.nodes-mode .writings-node-pane { height: auto; } .writings-stage.nodes-mode .writings-node-canvas-wrap { height: 390px; flex: none; } .writings-stage.nodes-mode .writings-node-choices { max-height: none; } .writings-node-hint { max-width: 70%; line-height: 1.3; } .writings-footer { padding: 18px 16px 30px; } }
@media (max-width: 780px) { .writings-stage.canons-mode { display: flex; overflow: hidden; } .writings-stage.canons-mode .writings-content { padding: 10px; } .writings-canon-comparison { padding: 10px; } .writings-canon-filters { width: 100%; } .writings-canon-search { flex: 1 1 110px; } }
@container (max-width: 780px) { .writings-canon-scroll-hint { display: block; } }
@media (max-width: 780px) {
  .writings-hero,.workspace.inspector-collapsed .writings-hero { display: flex; align-items: center; padding: 8px 12px; min-height: 46px; }
  .writings-heading { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; width: 100%; gap: 0 8px; }
  .writings-hero .eyebrow,.writings-hero .writings-summary,.writings-hero .writings-figures { display: none; }
  .writings-hero h2 { margin: 0; font-size: 1rem; }
  .writings-hero-info { display: inline-block; padding: 5px 8px; border: 1px solid var(--line); border-radius: 6px; background: var(--surface-2); color: var(--muted); font-size: .65rem; font-weight: 700; cursor: pointer; }
  .writings-hero.info-open { align-items: flex-start; flex-direction: column; }
  .writings-hero.info-open .writings-summary { display: block; flex: 1 0 100%; margin-top: 7px; }
  .writings-hero.info-open .writings-figures:not([hidden]) { display: flex; margin-top: 8px; }
  .writings-controls { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 6px; padding: 7px 10px; }
  .writings-view-tabs,.writings-tabs { width: 100%; min-width: 0; padding: 2px; }
  .writings-view-tab,.writings-tab { flex: 1 1 0; min-width: 0; min-height: 36px; padding: 5px 2px; font-size: .65rem; }
  .writings-tab-full { display: none; }
  .writings-tab-short { display: inline; }
  .writings-search { grid-column: 1 / -1; width: 100%; min-height: 38px; }
  .writings-outside { grid-column: 1 / -1; }
  .writings-content { padding: 10px; }
  .writings-shelf { margin-bottom: 18px; }
  .writings-shelf-heading { margin-bottom: 8px; padding-bottom: 7px; }
  .writings-book { min-height: 94px; }
  .writings-stage.canons-mode .writings-controls { grid-template-columns: 1fr; }
  .writings-stage.canons-mode .writings-hero { display: none; }
  .writings-stage.canons-mode .writings-content { padding: 6px; }
  .writings-canon-comparison { padding: 8px; }
  .writings-canon-top small { display: none; }
  .writings-canon-top h3 { font-size: 1.05rem; }
  .writings-canon-filters { display: grid; grid-template-columns: auto auto minmax(0,1fr); gap: 5px; }
  .writings-canon-filter,.writings-canon-select { min-width: 0; padding-inline: 7px; font-size: .62rem; }
  .writings-canon-search { grid-column: 1 / -1; width: 100%; min-height: 36px; font-size: 1rem; }
  .writings-canon-tools { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 3px 6px; margin-top: 6px; }
  .writings-canon-picker { margin-top: 0; }
  .writings-canon-note-toggle { display: block; padding: 3px 0; border: 0; background: transparent; color: var(--gold-strong); font-size: .65rem; font-weight: 700; cursor: pointer; }
  .writings-canon-note { display: none; margin: 4px 0 8px; }
  .writings-canon-comparison.note-open .writings-canon-note { display: block; }
  .writings-canon-scroll-hint { margin: 3px 0 6px; }
  .writings-canon-table { --canon-book-width: 118px; --canon-witness-width: 112px; }
  .writings-canon-table thead th:first-child { padding-left: 8px; }
  .writings-canon-status { min-width: 0; width: 100%; font-size: .56rem; }
}
.timeline-header { position: relative; z-index: 3; min-width: 0; padding: 17px 20px 12px; border-bottom: 1px solid var(--line); background: var(--timeline-header); }
.timeline-header h2 { margin: 4px 0 9px; font-size: 1.12rem; }
.timeline-switches { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 7px 12px; }
.timeline-modes { display: flex; flex-wrap: wrap; gap: 6px; }
.timeline-mode { padding: 7px 10px; border: 1px solid var(--control-border); border-radius: 8px; background: var(--control); color: var(--text); cursor: pointer; font-size: .68rem; font-weight: 750; }
.timeline-mode.active { border-color: var(--selected-border); background: var(--selected); color: var(--selected-text); }
.scene-modes { display: flex; gap: 4px; padding: 3px; border: 1px solid var(--control-border); border-radius: 9px; background: var(--surface); pointer-events: auto; }
.scene-modes[hidden] { display: none; }
.scene-mode { padding: 5px 9px; border: 0; border-radius: 6px; background: transparent; color: var(--muted); cursor: pointer; font-size: .65rem; font-weight: 750; white-space: nowrap; }
.scene-mode.active { background: var(--selected); color: var(--selected-text); }
.scene-mode:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }
.scene-mode-group { max-width: min(220px, 34vw); padding: 5px 8px; border: 1px solid var(--control-border); border-radius: 6px; background: var(--control); color: var(--text); font: 700 .65rem system-ui, sans-serif; cursor: pointer; }
.scene-mode-group:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }
.genealogy-stage { position: absolute; inset: 0; overflow: hidden; background: var(--scene-inner); }
.genealogy-stage[hidden] { display: none; }
.genealogy-active .scene-heading, .genealogy-active .stage-toolbar { display: none; }
.genealogy-world { display: flex; flex-direction: column; width: 100%; height: 100%; color: var(--text); font-family: Georgia, 'Times New Roman', serif; --gene-map-paper: color-mix(in srgb, var(--scene-inner) 91%, var(--gold)); }
.genealogy-visually-hidden { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.genealogy-world-controls { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 9px 20px; background: var(--surface-2); border-bottom: 1px solid var(--line); font-family: system-ui, sans-serif; }
.genealogy-world-modes { display: flex; gap: 4px; padding: 3px; border: 1px solid var(--control-border); border-radius: 8px; background: var(--surface); }
.genealogy-world-mode { padding: 8px 10px; border: 0; border-radius: 6px; background: transparent; color: var(--muted); cursor: pointer; white-space: nowrap; font: 750 .65rem system-ui, sans-serif; }
.genealogy-world-mode.active { background: var(--selected); color: var(--selected-text); box-shadow: inset 0 0 0 1px var(--selected-border); }
.genealogy-search-wrap { position: relative; width: min(245px,32vw); z-index: 4; }
.genealogy-world-search { min-width: 130px; width: 100%; padding: 9px 12px; border: 1px solid var(--control-border); border-radius: 8px; background: var(--surface); color: var(--text); font: .7rem system-ui, sans-serif; }
.genealogy-world-search::placeholder { color: var(--muted); }
.genealogy-search-results { position: absolute; top: calc(100% + 5px); right: 0; left: 0; max-height: 220px; overflow-y: auto; padding: 4px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); box-shadow: 0 12px 26px #0003; }
.genealogy-search-result { display: grid; gap: 2px; width: 100%; padding: 7px 8px; border: 0; border-radius: 5px; background: transparent; color: var(--text); text-align: left; cursor: pointer; font: .62rem system-ui, sans-serif; }
.genealogy-search-result:hover, .genealogy-search-result:focus-visible { background: var(--surface-3); }
.genealogy-search-result strong { font-size: .62rem; }
.genealogy-search-result span { overflow: hidden; color: var(--muted); font-size: .53rem; text-overflow: ellipsis; white-space: nowrap; }
.genealogy-map-wrap { display: flex; flex-direction: column; flex: 1; min-height: 0; background: var(--scene-inner); }
.genealogy-map-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 37px; padding: 4px 18px; border-bottom: 1px solid var(--line); background: var(--surface); font-family: system-ui, sans-serif; }
.genealogy-map-legend { display: flex; flex-wrap: wrap; gap: 11px; color: var(--muted); font-size: .61rem; font-weight: 650; }
.genealogy-map-legend span:first-child { color: var(--gold-strong); }
.genealogy-map-legend .genealogy-legend-luke { color: var(--blue); }
.genealogy-map-legend .genealogy-legend-family { color: var(--muted); }
.genealogy-map-legend .genealogy-legend-association { color: var(--green); }
.genealogy-map-legend .genealogy-legend-interpretation { color: var(--timeline-lane-3); }
.genealogy-map-tools { display: flex; gap: 4px; }
.genealogy-map-count { align-self: center; margin-right: 8px; color: var(--muted); font: 750 .55rem system-ui, sans-serif; white-space: nowrap; }
.genealogy-map-tools button { min-width: 30px; min-height: 27px; padding: 3px 7px; border: 1px solid var(--control-border); border-radius: 5px; background: var(--control); color: var(--text); cursor: pointer; font: 750 .62rem system-ui, sans-serif; }
.genealogy-map-tools button:hover { background: var(--control-hover); }
.genealogy-map-viewport { position: relative; flex: 1; min-height: 0; overflow: hidden; background: var(--gene-map-paper); }
.genealogy-map, .genealogy-map * { user-select: none; -webkit-user-select: none; }
.genealogy-map { display: block; width: 100%; height: 100%; background: var(--gene-map-paper); cursor: grab; touch-action: none; }
.genealogy-map:active { cursor: grabbing; }
.genealogy-marginalia { position: absolute; top: 22px; z-index: 1; width: min(24%, 190px); padding: 16px 16px 12px; border: 1px solid var(--line); border-left: 3px solid var(--gold); border-radius: 8px; background: var(--surface); box-shadow: 0 7px 20px #0002; color: var(--text); visibility: hidden; opacity: 0; transform: translateY(5px); transition: opacity .25s, transform .25s, visibility 0s linear .25s; pointer-events: none; }
.genealogy-map-viewport.is-overview .genealogy-marginalia { visibility: visible; opacity: 1; transform: translateY(0); transition: opacity .25s, transform .25s; }
.genealogy-marginalia-origin { left: 18px; }
.genealogy-marginalia-witnesses { right: 18px; }
.genealogy-marginalia-kicker { color: var(--gold-strong); font: 800 .48rem system-ui, sans-serif; letter-spacing: .15em; }
.genealogy-marginalia h3 { margin: 9px 0 8px; color: var(--text); font: 700 1rem/1.1 Georgia, serif; }
.genealogy-marginalia p { margin: 0; font: .6rem/1.5 system-ui, sans-serif; }
.genealogy-marginalia-rule { display: block; margin-top: 12px; color: var(--gold); text-align: center; letter-spacing: .45em; }
.genealogy-marginalia-route { display: grid; gap: 3px; margin-top: 12px; padding-left: 9px; border-left: 3px solid var(--gold); font: .57rem/1.45 system-ui, sans-serif; }
.genealogy-marginalia-route.luke { border-color: var(--blue); }
.genealogy-marginalia-route strong { color: var(--gold-strong); font-size: .5rem; letter-spacing: .1em; }
.genealogy-marginalia-route.luke strong { color: var(--blue); }
.genealogy-marginalia .genealogy-marginalia-caption { margin-top: 12px; color: var(--muted); font-size: .52rem; }
.gene-map-paper { fill: var(--gene-map-paper); }
.gene-map-band.band-0 { fill: color-mix(in srgb, var(--gold) 5%, transparent); }
.gene-map-band.band-1 { fill: color-mix(in srgb, var(--blue) 4%, transparent); }
.gene-map-band.band-2 { fill: color-mix(in srgb, var(--gold) 8%, transparent); }
.gene-map-band.band-3 { fill: color-mix(in srgb, var(--blue) 6%, transparent); }
.gene-map-era-rule { fill: none; stroke: var(--line); stroke-width: 1; stroke-dasharray: 12 10; opacity: .65; }
.gene-map-era { fill: var(--muted); font: 700 28px Georgia, serif; letter-spacing: 4px; opacity: .7; }
.gene-map-edge { fill: none; stroke-width: 2.2; vector-effect: non-scaling-stroke; transition: opacity .18s, filter .18s; }
.gene-map-edge.lineage { stroke: var(--gold); }
.gene-map-edge.lineage.luke { stroke: var(--blue); }
.gene-map-edge.lineage.matthew { stroke: var(--gold); }
.gene-map-edge.family { stroke: var(--muted); stroke-width: 1.6; stroke-dasharray: 5 4; }
.gene-map-edge.association { stroke: var(--green); stroke-width: 1.5; stroke-dasharray: 3 6; }
.gene-map-edge.interpretation { stroke: var(--timeline-lane-3); stroke-width: 2.2; stroke-dasharray: 9 4 2 4; }
.gene-map-node { cursor: pointer; transition: opacity .18s, filter .18s; }
.gene-map-node.dimmed { opacity: .28; }
.gene-map-node rect { fill: var(--gold); stroke: var(--gold-strong); stroke-width: 1.5; }
.gene-map-node.luke rect { fill: var(--blue); stroke: var(--blue); }
.gene-map-node.relative rect { fill: var(--surface-2); stroke: var(--line); }
.gene-map-node.landmark rect { fill: var(--selected); stroke: var(--gold); stroke-width: 2.5; filter: drop-shadow(0 3px 5px #0003); }
.gene-map-node-title { fill: var(--bg); font: 800 12px system-ui, sans-serif; letter-spacing: .03em; dominant-baseline: middle; }
.gene-map-node.relative .gene-map-node-title, .gene-map-node.landmark .gene-map-node-title { fill: var(--text); }
.gene-map-node-subtitle { fill: var(--bg); font: 600 8px system-ui, sans-serif; }
.gene-map-node.relative .gene-map-node-subtitle, .gene-map-node.landmark .gene-map-node-subtitle { fill: var(--muted); }
.gene-map-node:hover rect, .gene-map-node:focus-visible rect { stroke: var(--gold-strong); stroke-width: 3; }
.genealogy-map.has-spotlight .gene-map-node:not(.spotlight-selected):not(.spotlight-neighbor) { opacity: .17; }
.genealogy-map.has-spotlight .gene-map-edge:not(.spotlight-link) { opacity: .08; }
.genealogy-map.has-spotlight .gene-map-node.spotlight-selected rect { stroke: var(--gold-strong); stroke-width: 4; filter: drop-shadow(0 0 9px var(--gold)); }
.genealogy-map.has-spotlight .gene-map-node.spotlight-selected.luke rect { stroke: var(--blue); filter: drop-shadow(0 0 9px var(--blue)); }
.genealogy-map.has-spotlight .gene-map-node.spotlight-neighbor rect { stroke: var(--blue); stroke-width: 2.8; filter: drop-shadow(0 0 5px var(--blue)); }
.genealogy-map.has-spotlight .gene-map-edge.spotlight-link { opacity: 1; stroke-width: 3.7; filter: drop-shadow(0 0 4px var(--gold)); }
.genealogy-map.has-spotlight .gene-map-edge.spotlight-link.luke { filter: drop-shadow(0 0 4px var(--blue)); }
.genealogy-map.has-spotlight .gene-map-edge.spotlight-link.association { filter: drop-shadow(0 0 4px var(--green)); }
.genealogy-map.has-spotlight .gene-map-edge.spotlight-link.interpretation { filter: drop-shadow(0 0 4px var(--timeline-lane-3)); }
.genealogy-spotlight { position: absolute; top: 14px; left: 14px; z-index: 2; display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; width: min(280px, calc(100% - 28px)); padding: 10px 11px; border: 1px solid var(--line); border-left: 3px solid var(--gold); border-radius: 8px; background: color-mix(in srgb, var(--surface) 94%, transparent); box-shadow: 0 8px 20px #0003; color: var(--text); backdrop-filter: blur(6px); font-family: system-ui, sans-serif; }
.genealogy-spotlight[hidden] { display: none; }
.genealogy-spotlight-copy { display: grid; gap: 2px; min-width: 0; }
.genealogy-spotlight-copy small { color: var(--gold-strong); font-size: .59rem; font-weight: 850; letter-spacing: .12em; }
.genealogy-spotlight-copy strong { overflow: hidden; font-size: .8rem; text-overflow: ellipsis; white-space: nowrap; }
.genealogy-spotlight-copy span { color: var(--muted); font-size: .66rem; }
.genealogy-spotlight-actions { display: grid; gap: 4px; flex: none; }
.genealogy-spotlight-actions button { padding: 4px 7px; border: 1px solid var(--control-border); border-radius: 5px; background: var(--control); color: var(--text); cursor: pointer; font-size: .63rem; white-space: nowrap; }
.genealogy-spotlight-actions button:hover { background: var(--control-hover); }
.genealogy-spotlight-actions .genealogy-spotlight-open { border-color: var(--gold); }
@media (prefers-reduced-motion: reduce) { .gene-map-edge, .gene-map-node { transition: none; } }
.genealogy-landmarks { display: flex; align-items: center; gap: 6px; padding: 8px 16px; overflow-x: auto; border-top: 1px solid var(--line); background: var(--surface-2); white-space: nowrap; font-family: system-ui, sans-serif; }
.genealogy-landmarks span { margin-right: 8px; color: var(--muted); font-size: .54rem; font-weight: 850; letter-spacing: .12em; }
.genealogy-landmarks button { padding: 6px 10px; border: 1px solid var(--control-border); border-radius: 20px; background: var(--control); color: var(--text); cursor: pointer; font-size: .61rem; font-weight: 750; }
.genealogy-landmarks button:hover { background: var(--control-hover); }
.genealogy-world-note { margin: 0; padding: 6px 16px; background: var(--surface-2); color: var(--muted); font: .54rem/1.3 system-ui, sans-serif; }
.genealogy-world button:focus-visible, .genealogy-world input:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }
@media (max-width: 680px) { .genealogy-marginalia { display: none; } }
.timeline-views { display: flex; gap: 3px; padding: 3px; border: 1px solid var(--control-border); border-radius: 9px; background: var(--surface); }
.timeline-view { padding: 5px 8px; border: 0; border-radius: 6px; background: transparent; color: var(--muted); cursor: pointer; font-size: .65rem; font-weight: 750; }
.timeline-view.active { background: var(--selected); color: var(--selected-text); }
.timeline-view:focus-visible, .timeline-mode:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }
.timeline-note { margin: 9px 0 0; color: #a2b0c2; font-size: .65rem; line-height: 1.42; }
.timeline-prelude { display: flex; align-items: center; gap: 5px; min-width: 0; max-width: 100%; margin-top: 9px; overflow-x: auto; scrollbar-width: thin; white-space: nowrap; }
.timeline-prelude strong { margin-right: 3px; color: var(--gold); font-size: .59rem; text-transform: uppercase; }
.timeline-prelude-event { flex: 0 0 auto; padding: 4px 7px; border: 1px solid var(--control-border); border-radius: 6px; background: var(--control); color: var(--text); cursor: pointer; font-size: .58rem; }
.timeline-prelude-event:hover { border-color: var(--gold); }
.timeline-controls { display: grid; grid-template-columns: minmax(110px,1fr) minmax(95px,135px) 30px 30px auto; gap: 5px; min-width: 0; margin-top: 10px; }
.timeline-controls input, .timeline-controls select, .timeline-controls button { min-width: 0; padding: 6px 7px; border: 1px solid var(--control-border); border-radius: 7px; background: var(--surface); color: var(--text); font-size: .63rem; }
.timeline-controls input { outline: none; }
.timeline-controls input:focus { border-color: var(--gold); }
.timeline-controls button { cursor: pointer; font-weight: 750; }
.timeline-controls button:hover { background: var(--control-hover); }
.timeline-results { position: absolute; top: calc(100% - 4px); left: 20px; right: 20px; z-index: 10; display: grid; gap: 2px; max-height: 250px; padding: 6px; overflow-y: auto; border: 1px solid var(--line); border-radius: 8px; background: var(--surface-2); box-shadow: 0 14px 25px #0009; }
.timeline-results p { margin: 5px; color: var(--muted); font-size: .67rem; }
.timeline-results small { padding: 5px; color: var(--muted); font-size: .6rem; }
.timeline-result { padding: 7px 8px; border: 0; border-radius: 5px; background: transparent; color: var(--text); cursor: pointer; text-align: left; font-size: .63rem; }
.timeline-result:hover { background: var(--surface-3); }
.timeline-result-heading { padding: 5px 8px; color: var(--gold-strong); font-size: .62rem; }
.timeline-viewport { min-height: 0; overflow: auto; cursor: grab; touch-action: none; scrollbar-color: var(--line) var(--timeline-space); }
.timeline-viewport.dragging { cursor: grabbing; user-select: none; }
.timeline-viewport:focus-visible { outline: 2px solid var(--gold); outline-offset: -2px; }
.timeline-space { position: relative; min-height: 0; overflow: hidden; background: var(--timeline-space); }
.timeline-space canvas { display: block; width: 100%; height: 100%; cursor: grab; touch-action: none; }
.timeline-space canvas:active { cursor: grabbing; }
.timeline-space-guide { position: absolute; right: 12px; bottom: 12px; left: 12px; width: max-content; max-width: calc(100% - 24px); padding: 7px 9px; border: 1px solid var(--line); border-radius: 7px; background: var(--surface-2); color: var(--text); font-size: .6rem; pointer-events: none; }
.timeline-surface { position: relative; min-height: 100%; padding-bottom: 34px; }
.timeline-period-row { position: relative; height: 49px; border-bottom: 1px solid var(--line); background: var(--surface); }
.timeline-period { position: absolute; top: 8px; height: 32px; padding: 8px 10px; overflow: hidden; border-left: 2px solid var(--gold); background: var(--accent-bg); color: var(--gold-strong); font-size: .57rem; font-weight: 750; white-space: nowrap; }
.timeline-period:nth-child(even) { background: var(--surface-3); border-left-color: var(--blue); color: var(--text); }
.timeline-axis { position: relative; height: 39px; border-bottom: 1px solid var(--line); background: var(--timeline-header); }
.timeline-tick { position: absolute; top: 9px; padding-left: 6px; border-left: 1px solid var(--line); color: var(--muted); font-size: .59rem; white-space: nowrap; }
.timeline-lane { position: relative; border-bottom: 1px solid var(--timeline-grid); background: linear-gradient(#ffffff05 1px, transparent 1px) 0 31px / 100% 70px; }
.timeline-lane:nth-child(even) { background-color: var(--timeline-lane-alt); }
.timeline-lane-label { position: sticky; left: 0; z-index: 2; width: max-content; margin: 0; padding: 8px 13px; border-radius: 0 0 7px 0; background: var(--surface-3); color: var(--text); font-size: .6rem; text-transform: uppercase; letter-spacing: .08em; }
.timeline-event { position: absolute; width: 164px; min-height: 55px; padding: 7px 8px; overflow: hidden; border: 1px solid var(--canvas-card-border); border-left: 3px solid var(--timeline-lane-1); border-radius: 7px; background: var(--canvas-card); color: var(--text); cursor: pointer; text-align: left; box-shadow: 0 5px 12px #0005; }
.timeline-lane:nth-of-type(2) .timeline-event { border-left-color: var(--timeline-lane-2); }
.timeline-lane:nth-of-type(3) .timeline-event { border-left-color: var(--timeline-lane-3); }
.timeline-lane:nth-of-type(4) .timeline-event { border-left-color: var(--timeline-lane-4); }
.timeline-event small, .timeline-event strong { display: block; }
.timeline-event small { margin-bottom: 3px; color: var(--muted); font-size: .52rem; white-space: nowrap; }
.timeline-event strong { display: -webkit-box; overflow: hidden; -webkit-line-clamp: 2; -webkit-box-orient: vertical; font-size: .63rem; line-height: 1.22; }
.timeline-event:hover, .timeline-event.selected { z-index: 1; border-color: var(--gold); background: var(--selected); box-shadow: 0 0 15px var(--shadow-accent); }
.timeline-cluster { border-left-color: var(--gold); background: var(--accent-bg); }
.timeline-cluster strong { color: var(--gold-strong); }
.timeline-event.muted { opacity: .22; }
.timeline-footer { display: flex; justify-content: space-between; gap: 12px; padding: 8px 13px; border-top: 1px solid var(--line); color: var(--muted); font-size: .58rem; }
.timeline-footer span:first-child { color: var(--gold-strong); white-space: nowrap; }

.inspector {
  position: relative; min-height: 0; display: grid;
  grid-template-rows: auto auto minmax(0,1fr); border-left: 1px solid var(--line);
  background: var(--surface); overflow: visible;
}
.inspector-resizer {
  position: absolute; z-index: 8; left: -5px; top: 0; bottom: 0; width: 10px;
  cursor: col-resize; touch-action: none;
}
.inspector-resizer::after {
  content: ""; position: absolute; left: 4px; top: 0; bottom: 0; width: 1px;
  background: transparent; transition: background .16s;
}
.inspector-resizer:hover::after, .workspace.resizing .inspector-resizer::after { background: var(--gold); }
.inspector-header { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 14px 14px 12px; border-bottom: 1px solid var(--line); background: var(--surface); }
.inspector-header > div:first-child { min-width: 0; }
.inspector-header h2 { margin: 3px 0 0; font-size: 1rem; }
.inspector-actions { display: flex; align-items: center; gap: 8px; flex: none; }
.inspector-actions .auto-open-control { min-height: 30px; padding-inline: 6px; font-size: .64rem; }
.auto-open-detail { display: inline; }
.inspector-collapse {
  width: 30px; height: 30px; padding: 0; border: 1px solid var(--line); border-radius: 8px;
  background: var(--surface-2); color: var(--muted); font-size: 1.15rem; cursor: pointer;
}
.inspector-collapse:hover { color: var(--text); border-color: #536176; }
.segmented { display: flex; padding: 3px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface-2); }
.workspace-switcher { margin: 10px 12px 0; }
.segment { padding: 6px 9px; border: 0; background: transparent; color: var(--muted); font-size: .69rem; font-weight: 700; }
.workspace-switcher .segment { flex: 1; padding-block: 8px; }
.segment.active { background: var(--surface-3); color: var(--text); }
.panel-view { display: none; min-height: 0; }
.panel-view.active { display: block; }
.panel-scroll { height: 100%; overflow-y: auto; padding: 14px; scrollbar-width: thin; }
.browse-hint { margin: 2px 2px 13px; color: var(--muted); font-size: .72rem; line-height: 1.5; }
.control-section { padding: 13px 2px; border-top: 1px solid var(--line); }
.coverage-disclosure { margin-top: 12px; padding: 11px 2px; border-top: 1px solid var(--line); color: var(--muted); }
.coverage-disclosure > summary { color: var(--text); font-size: .7rem; font-weight: 750; cursor: pointer; }
.coverage-disclosure > summary:focus-visible, .coverage-open:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }
.coverage-body { padding: 7px 2px 2px; font-size: .67rem; line-height: 1.5; }
.coverage-body p { color: var(--muted); }
.coverage-metrics { display: grid; grid-template-columns: 1fr auto; gap: 4px 9px; margin: 11px 0; }
.coverage-metrics dt { color: var(--muted); }
.coverage-metrics dd { margin: 0; color: var(--text); font-weight: 750; }
.coverage-open { padding: 6px 9px; border: 1px solid var(--accent-border); border-radius: 7px; background: var(--accent-bg); color: var(--text); font-size: .66rem; cursor: pointer; }
.audit-findings { margin-top: 13px; padding-top: 10px; border-top: 1px solid var(--line); }
.audit-group { margin-top: 12px; }
.audit-group h4 { margin: 0 0 7px; color: var(--gold-strong); font-size: .67rem; }
.audit-finding { display: grid; gap: 2px; margin: 6px 0; padding: 7px; border: 1px solid var(--line); border-radius: 6px; background: var(--surface-2); }
.audit-finding strong { color: var(--gold-strong); }
.audit-more { color: var(--muted); }
.scene-guide { display: grid; gap: 7px; padding: 13px 2px; border-top: 1px solid var(--line); }
.scene-guide-intro { margin: -1px 0 3px; color: var(--muted); font-size: .68rem; line-height: 1.5; }
.journey-phase { border: 1px solid var(--line); border-radius: 9px; background: var(--surface-2); }
.journey-phase summary { display: grid; grid-template-columns: 22px 1fr auto; align-items: center; gap: 8px; padding: 9px 10px; cursor: pointer; list-style: none; }
.journey-phase summary::-webkit-details-marker { display: none; }
.journey-phase summary strong { font-size: .69rem; }
.journey-phase summary small { color: var(--muted); font-size: .59rem; }
.phase-number { display: grid; place-items: center; width: 21px; height: 21px; border-radius: 50%; background: var(--accent-bg); color: var(--gold-strong); font-size: .61rem; font-weight: 850; }
.journey-module-list { display: grid; gap: 4px; padding: 0 7px 7px; }
.journey-module { display: grid; grid-template-columns: 24px 1fr; align-items: center; gap: 7px; padding: 7px 8px; border: 1px solid transparent; border-radius: 7px; background: var(--surface); color: var(--text); text-align: left; cursor: pointer; }
.journey-module:hover { border-color: var(--accent-border); background: var(--surface-3); color: var(--text); }
.journey-module span { color: var(--gold); font-size: .63rem; font-weight: 850; }
.journey-module strong { font-size: .65rem; font-weight: 700; }
.section-title { display: flex; justify-content: space-between; margin-bottom: 7px; color: #d6dee9; font-size: .7rem; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.section-title span:last-child { color: var(--muted); }
.search-box { display: flex; align-items: center; gap: 7px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 9px; background: var(--surface-2); }
.search-box input { width: 100%; border: 0; outline: 0; background: transparent; color: var(--text); font-size: .74rem; }
.search-box kbd { padding: 2px 6px; border: 1px solid #39475a; border-radius: 5px; color: #77869a; font: .62rem/1.2 Consolas,monospace; }
.search-results { display: grid; gap: 5px; margin-top: 8px; }
.search-result { padding: 8px 9px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface-2); cursor: pointer; }
.search-result:hover { border-color: #52627a; }
.search-result strong, .search-result small { display: block; }
.search-result strong { font-size: .72rem; }
.search-result small { margin-top: 3px; color: var(--muted); font-size: .62rem; }

#lab-view.active { display: block; min-height: 0; }
.metaphysics-panel { padding-top: 12px; }
.lab-intro { padding: 4px 2px 13px; }
.lab-intro h3 { margin: 5px 0 5px; font-size: .95rem; }
.lab-intro > p:last-child { margin: 0; color: var(--muted); font-size: .72rem; line-height: 1.48; }
.lab-domain-switcher { display: grid; grid-template-columns: repeat(auto-fit,minmax(86px,1fr)); gap: 6px; margin-bottom: 13px; }
.lab-domain {
  padding: 9px 8px; border: 1px solid var(--line); border-radius: 9px; background: var(--surface-2);
  color: var(--muted); cursor: pointer; font-size: .7rem; font-weight: 750;
}
.lab-domain:hover { border-color: #52627a; color: var(--text); }
.lab-domain.active { border-color: var(--selected-border); background: var(--selected); color: var(--selected-text); }
.lab-outcome { margin: 0 0 13px; }
.lab-outcome-card { padding: 12px; border: 1px solid #5b654e; border-radius: 12px; background: linear-gradient(145deg,#17231f,#101a20 70%); }
.lab-outcome-card.inconsistent { border-color: #805350; background: linear-gradient(145deg,#25191a,#151920 72%); }
.lab-outcome-card.predicting { border-color: #85734a; background: linear-gradient(145deg,#272315,#171b1e 72%); }
.lab-outcome-heading { display: grid; gap: 4px; }
.lab-outcome-heading strong { font-size: .9rem; line-height: 1.25; }
.lab-outcome-heading .eyebrow { font-size: .62rem; }
.lab-baseline-note, .lab-outcome-explanation, .lab-outcome-repair, .lab-diagram-mode { margin: 9px 0 0; font-size: .76rem; line-height: 1.5; }
.lab-baseline-note, .lab-diagram-mode { color: #b3c1cc; }
.lab-outcome-repair { color: #cfdfbe; }
.lab-change-list { display: grid; gap: 6px; margin-top: 10px; }
.lab-change { display: grid; grid-template-columns: 1fr auto; gap: 2px 8px; align-items: center; padding: 8px; border: 1px solid #475263; border-radius: 8px; background: var(--surface-2); }
.lab-change strong { font-size: .72rem; }
.lab-change span { grid-column: 1; color: #c4d0dc; font-size: .7rem; line-height: 1.35; }
.lab-reset-field { grid-column: 2; grid-row: 1 / 3; padding: 5px 7px; border: 1px solid #536579; border-radius: 6px; background: var(--surface-3); color: #b8d9fa; font-size: .69rem; cursor: pointer; }
.lab-outcome-actions { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 11px; }
.lab-outcome-button, .lab-reveal { padding: 8px 10px; border: 1px solid var(--accent-border); border-radius: 7px; background: var(--accent-bg); color: var(--gold-strong); font-size: .73rem; font-weight: 700; cursor: pointer; }
.lab-outcome-button:hover, .lab-reveal:hover, .lab-reset-field:hover { filter: brightness(1.18); }
.lab-outcome-button:focus-visible, .lab-reveal:focus-visible, .lab-reset-field:focus-visible, .diagnostic-source-link:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }
.lab-view-diagram { display: none; }
.lab-more-issues { display: block; margin-top: 7px; color: #e1b7a9; font-size: .7rem; }
.lab-prediction { margin-top: 11px; padding: 10px; border-left: 3px solid var(--gold); border-radius: 6px; background: var(--accent-bg); }
.lab-prediction strong { font-size: .76rem; }
.lab-prediction p { margin: 5px 0 9px; color: #d5cfb8; font-size: .73rem; line-height: 1.45; }
.lab-section { padding: 12px 0; border-top: 1px solid var(--line); }
.lab-presets { display: flex; flex-wrap: wrap; gap: 6px; }
.preset-chip {
  padding: 6px 8px; border: 1px solid var(--line); border-radius: 999px; background: var(--surface-2);
  color: #aeb9c8; cursor: pointer; font-size: .64rem;
}
.preset-chip:hover { border-color: #57667b; color: var(--text); }
.preset-chip.active { border-color: var(--selected-border); background: var(--selected); color: var(--selected-text); }
.lab-fields { display: grid; gap: 8px; }
.lab-field { display: grid; gap: 7px; padding: 10px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface-2); }
.lab-field.changed { border-color: var(--selected-border); background: var(--selected); }
.lab-field-copy strong, .lab-field-copy small { display: block; }
.lab-field-copy strong { font-size: .78rem; }
.lab-field-copy small { margin-top: 3px; color: var(--muted); font-size: .72rem; line-height: 1.4; }
.lab-field select {
  width: 100%; padding: 7px 28px 7px 8px; border: 1px solid var(--line); border-radius: 7px;
  outline: none; background: var(--surface); color: var(--text); font-size: .76rem;
}
.lab-field select:focus { border-color: var(--gold); box-shadow: 0 0 0 2px var(--shadow-accent); }
.lab-analysis { display: grid; gap: 9px; padding: 12px 0; border-top: 1px solid var(--line); }
.lab-no-issues { margin: 0; color: var(--muted); font-size: .75rem; line-height: 1.45; }
.lab-analysis[aria-busy="true"] { opacity: .55; pointer-events: none; }
.lab-status { display: grid; grid-template-columns: 25px 1fr; gap: 2px 8px; padding: 12px; border: 1px solid; border-radius: 11px; }
.lab-status.coherent { border-color: #486344; background: #111c15; }
.lab-status.inconsistent { border-color: #744746; background: #211415; }
.lab-status .status-mark { grid-row: span 2; display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: #ffffff12; font-weight: 900; }
.lab-status strong { align-self: center; font-size: .76rem; }
.lab-status p { grid-column: 2; margin: 3px 0 0; color: #b9c4d0; font-size: .67rem; line-height: 1.48; }
.diagnostic-card { padding: 12px; border: 1px solid #6d4545; border-left: 3px solid #c56c67; border-radius: 10px; background: #171113; }
.diagnostic-card.warning { border-color: #6d5e3d; border-left-color: #d8ad55; background: #1b1810; }
.diagnostic-label { display: inline-block; padding: 3px 6px; border-radius: 999px; background: #ffffff0b; color: #e2a5a0; font-size: .58rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.diagnostic-card h4 { margin: 8px 0 5px; font-size: .78rem; }
.diagnostic-card p { margin: 5px 0; color: #c1cad5; font-size: .68rem; line-height: 1.5; }
.diagnostic-rule { margin: 9px 0 5px; padding: 7px 8px; border-radius: 6px; background: #080c12; color: var(--gold-strong); font-size: .64rem; }
.diagnostic-card .diagnostic-repair { color: #cbd8bd; }
.diagnostic-sources { display: block; margin-top: 8px; color: #8493a7; font-size: .61rem; line-height: 1.4; }
.diagnostic-source-list { display: grid; gap: 3px; margin-top: 10px; padding-top: 9px; border-top: 1px solid #5a4545; }
.diagnostic-source-list strong { color: #e8d496; font-size: .7rem; }
.diagnostic-source-link { color: #a8d3fb; font-size: .72rem; line-height: 1.4; }
.diagnostic-source-list small { color: #abb7c5; font-size: .68rem; line-height: 1.4; }
.diagnostic-chain { margin-top: 10px; border-top: 1px solid #5a4545; }
.diagnostic-chain summary { padding: 9px 0 4px; color: #e8d496; cursor: pointer; font-size: .67rem; font-weight: 700; }
.diagnostic-chain-stages { display: grid; gap: 7px; margin-top: 6px; }
.diagnostic-chain-stage { display: grid; gap: 3px; padding: 7px 8px; border: 1px solid #4b4142; border-radius: 6px; }
.diagnostic-chain-stage strong { color: #e8d496; font-size: .62rem; }
.diagnostic-chain-stage a, .diagnostic-chain-stage span { color: #a8d3fb; font-size: .67rem; }
.diagnostic-chain-stage small { color: #aebac8; font-size: .62rem; line-height: 1.4; }
.text-action { margin-top: 9px; padding: 0; border: 0; background: transparent; color: #83b7ea; cursor: pointer; font-size: .65rem; text-align: left; }
.text-action:hover { color: #b8d9fa; }
.lab-disclaimer { margin: 1px 3px 4px; color: #738196; font-size: .61rem; line-height: 1.45; }
.filioque-comparison { display: grid; gap: 8px; }
.filioque-comparison > h4, .guide-body > h4 { margin: 4px 2px 0; color: var(--gold); font-size: .65rem; letter-spacing: .08em; text-transform: uppercase; }
.comparison-grid { display: grid; gap: 7px; }
.comparison-card { padding: 11px; border: 1px solid var(--line); border-left: 3px solid var(--line); border-radius: 9px; background: var(--surface-2); }
.comparison-card.active { border-color: var(--selected-border); border-left-color: var(--gold); background: var(--selected); }
.comparison-card strong, .guide-card strong { color: #e2e8ef; font-size: .7rem; }
.comparison-card p, .comparison-card li, .guide-card p { color: #abb7c6; font-size: .64rem; line-height: 1.48; }
.comparison-card p, .guide-card p { margin: 5px 0 0; }
.comparison-card ul { margin: 7px 0 0; padding-left: 17px; }
.comparison-card li + li { margin-top: 4px; }
.lab-guide-drawer { border: 1px solid var(--line); border-radius: 10px; background: var(--surface); }
.lab-guide-drawer summary { padding: 10px 11px; color: #cbd4df; cursor: pointer; font-size: .69rem; font-weight: 750; }
.guide-body { display: grid; gap: 7px; padding: 0 10px 11px; }
.guide-card { padding: 9px 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface-2); }
.source-card a { color: #8bc0f0; font-size: .68rem; font-weight: 750; line-height: 1.4; }
.filioque-timeline { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.filioque-timeline li { display: grid; grid-template-columns: 72px 1fr; gap: 8px; color: #aeb9c7; font-size: .64rem; line-height: 1.45; }
.filioque-timeline strong { color: var(--gold-strong); }
.principle-drawer { margin-bottom: 18px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); }
.principle-drawer summary { padding: 10px 11px; color: #cbd4df; cursor: pointer; font-size: .69rem; font-weight: 750; }
.principle-drawer > div { display: grid; gap: 7px; padding: 0 10px 11px; }
.principle-drawer h4 { margin: 8px 0 1px; color: var(--gold); font-size: .66rem; letter-spacing: .08em; text-transform: uppercase; }
.term-search { width: 100%; box-sizing: border-box; padding: 8px 10px; border: 1px solid var(--line); border-radius: 7px; background: var(--surface-2); color: var(--text); font: inherit; font-size: .7rem; }
.term-search-empty { margin: 4px 0; color: var(--muted); font-size: .68rem; }
.term-card, .principle-card { padding: 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface-2); }
.term-card strong, .term-card small { display: block; }
.term-card strong, .principle-card strong { font-size: .7rem; }
.term-card small { margin-top: 2px; color: var(--gold); font-size: .6rem; }
.term-question { display: block; margin-top: 6px; color: #91acd0; font-size: .62rem; font-weight: 700; }
.term-card p, .principle-card p { margin: 5px 0 0; color: #aebac8; font-size: .64rem; line-height: 1.48; }
.term-card .term-contrast, .principle-card .principle-implication { color: #7f8da0; }
.term-card .term-example { color: #a8c1a2; }

#vault-view.active { display: grid; min-height: 0; }
.empty-vault { align-self: center; padding: 28px; text-align: center; color: var(--muted); }
.empty-vault span { color: var(--gold); font-size: 2.3rem; }
.empty-vault h3 { margin: 12px 0 5px; color: var(--text); }
.empty-vault p { margin: 0 auto; max-width: 290px; font-size: .75rem; line-height: 1.55; }
.vault-content { min-height: 0; display: grid; grid-template-rows: auto auto minmax(0,1fr); }
.record-heading { padding: 14px 15px 11px; }
.record-context { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.record-context > span { color: #748297; font-size: .61rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.record-heading h3 { margin: 4px 0; font-size: 1.08rem; }
.record-heading > p:last-child { margin: 0; color: var(--muted); font-size: .67rem; }
.record-heading > #record-meta { margin: 0; color: var(--muted); font-size: .67rem; }
.evidence-summary { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 9px; }
.evidence-chip { padding: 4px 7px; border: 1px solid var(--accent-border); border-radius: 7px; background: var(--accent-bg); color: var(--text); font-size: .62rem; cursor: pointer; }
.evidence-chip:disabled { opacity: .48; cursor: default; }
.evidence-chip:not(:disabled):hover { border-color: var(--gold); }
.evidence-chip:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }
.evidence-warning { flex-basis: 100%; margin: 3px 0 0; color: #e5bb8c; font-size: .62rem; line-height: 1.45; }
.record-tabs { display: flex; gap: 2px; padding: 0 10px; border-bottom: 1px solid var(--line); overflow-x: auto; scrollbar-width: none; }
.record-tab { flex: 0 0 auto; padding: 8px 8px; border: 0; border-bottom: 2px solid transparent; border-radius: 0; background: transparent; color: var(--muted); font-size: .66rem; font-weight: 700; }
.record-tab.active { border-bottom-color: var(--gold); color: var(--text); }
.record-tab span { display: inline-grid; place-items: center; min-width: 16px; padding: 1px 4px; border-radius: 8px; background: var(--surface-3); }
.record-body { min-height: 0; overflow-y: auto; padding: 14px 15px 28px; scrollbar-width: thin; }
.record-body h4 { margin: 17px 0 6px; color: var(--gold-strong); font-size: .69rem; letter-spacing: .08em; text-transform: uppercase; }
.record-body h4:first-child { margin-top: 0; }
.record-body p, .record-body li { color: #c2ccd8; font-size: .75rem; line-height: 1.6; }
.record-body ul { padding-left: 18px; }
.record-body .evidence-guidance { margin: 0 0 12px; padding: 9px 10px; border-left: 2px solid var(--gold); background: var(--surface-2); color: var(--muted); font-size: .68rem; }
.record-study { margin-top: 18px; padding-top: 9px; border-top: 1px solid var(--line); }
.record-study h3 { color: var(--text); font-size: .84rem; line-height: 1.4; }
.record-study h5 { margin: 15px 0 6px; color: var(--gold-strong); font-size: .73rem; }
.record-study p { margin: 7px 0 12px; }
.scripture-entry { padding: 0 0 10px; border-bottom: 1px solid var(--line); }
.scripture-entry h4 { letter-spacing: 0; text-transform: none; }
.scripture-entry blockquote { margin: 7px 0; padding-left: 10px; border-left: 2px solid var(--accent-border); color: var(--text); font-family: Georgia,serif; font-size: .76rem; line-height: 1.5; }
.scripture-translation { display: block; margin: 3px 0 7px; color: var(--muted); font-size: .63rem; }
.resource-entry small { display: block; margin-top: 3px; color: var(--muted); font-size: .65rem; line-height: 1.4; }
.related-records { display: grid; gap: 5px; }
.quote-card { margin-bottom: 9px; padding: 12px; border: 1px solid var(--line); border-left: 3px solid var(--gold); border-radius: 9px; background: var(--surface-2); }
.quote-card blockquote { margin: 0 0 9px; color: #e5eaf0; font-family: Georgia,serif; font-size: .84rem; line-height: 1.55; }
.quote-card cite { display: block; color: var(--gold-strong); font-size: .67rem; font-style: normal; }
.quote-verification { display: block; margin-top: 4px; color: var(--muted); font-size: .6rem; }
.quote-card p { margin: 8px 0 0; font-size: .68rem; }
.quote-card a, .source-link { color: #83b7ea; }
.quote-context { margin-top: 9px; border-top: 1px solid var(--line); }
.quote-context summary { padding-top: 8px; color: #b8cce0; cursor: pointer; font-size: .67rem; font-weight: 700; }
.quote-context small { display: block; margin-top: 7px; color: var(--muted); font-size: .61rem; }
.data-block { padding: 10px; border-radius: 8px; background: var(--bg); color: #aebbd0; white-space: pre-wrap; overflow-wrap: anywhere; font: .65rem/1.5 Consolas,monospace; }
.error-banner { position: fixed; left: 50%; bottom: 20px; transform: translateX(-50%); padding: 10px 14px; border: 1px solid #a94c4c; border-radius: 8px; background: #321719; z-index: 50; font-size: .75rem; }
.workspace.inspector-collapsed { --inspector-width: 0px !important; }
.workspace.inspector-collapsed .inspector { display: none; }
.workspace.resizing, .workspace.resizing * { cursor: col-resize !important; user-select: none !important; }
.inspector[aria-busy="true"] .panel-view { opacity: .48; pointer-events: none; }

@media (max-width: 1100px) {
  .workspace { --world-width: 58px; --inspector-width: 350px !important; grid-template-columns: var(--world-width) minmax(360px,1fr) var(--inspector-width); }
  .world-rail { padding-inline: 8px; }
  .rail-home strong, .rail-footer .content-stat, .rail-support span:last-child { display: none; }
  .rail-footer { padding-inline: 0; }
  .rail-footer-actions { grid-template-columns: 1fr; }
  .rail-footer-actions > * { min-height: 40px; }
  .rail-home { justify-content: center; padding-inline: 0; }
  .rail-heading span, .world-button, .world-group-label { font-size: 0; }
  .world-group-label { height: 1px; margin: 5px 9px; background: var(--line); }
  .world-button { display: grid; grid-template-columns: 1fr; place-items: center; padding: 12px; }
  .world-button::before { width: 9px; height: 9px; }
  .tour-launch-label { display: none; }
  .gesture-help { display: none; }
}
@media (max-width: 780px) {
  .lab-view-diagram { display: inline-block; }
  html, body { height: 100%; height: 100dvh; }
  .application { height: 100%; height: 100dvh; grid-template-rows: auto 56px minmax(0,1fr) auto; }
  .app-header { display: flex; min-width: 0; padding: 0 14px; }
  .brand { min-width: 0; padding: 0; }
  .brand-mark { width: 32px; height: 32px; flex: 0 0 auto; }
  .brand strong { font-size: .95rem; }
  .brand small { font-size: .61rem; }
  .button { padding-inline: 9px; font-size: .7rem; }
  .support-button span:last-child { display: none; }
  .support-button { min-width: 40px; min-height: 40px; justify-content: center; padding-inline: 8px; font-size: 1rem; }
  .workspace { display: block; position: relative; min-height: 0; overflow: clip; }
  .stage { height: 100%; min-height: 0; }
  .world-rail, .workspace.worlds-collapsed .world-rail {
    position: absolute; z-index: 8; inset: 0; width: 100%; height: 100%;
    padding: 14px 16px; border: 0; background: var(--surface);
    visibility: hidden; transform: translateY(100%); transition: transform .24s ease, visibility .24s;
  }
  .rail-home { display: none; }
  .rail-footer { display: grid; padding: 10px 0 2px; }
  .rail-footer-actions, .workspace.worlds-collapsed .rail-footer-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rail-footer-actions > *, .workspace.worlds-collapsed .rail-footer-actions > * { min-height: 48px; }
  .tour-launch-label, .workspace.worlds-collapsed .tour-launch-label { display: inline; }
  .rail-footer .rail-support span:last-child, .workspace.worlds-collapsed .rail-footer .rail-support span:last-child { display: inline; }
  .guided-tour { top: 10px; right: 10px; width: min(340px, calc(100% - 20px)); padding: 12px 14px; }
  .world-rail.open { visibility: visible; transform: translateY(0); }
  .rail-heading { display: flex; height: 34px; padding: 0 3px; font-size: .72rem; }
  .rail-heading span, .world-button, .world-group-label,
  .workspace.worlds-collapsed .rail-heading span,
  .workspace.worlds-collapsed .world-button,
  .workspace.worlds-collapsed .world-group-label { font-size: revert; }
  .rail-heading span { color: var(--gold); font-size: .72rem !important; }
  #collapse-worlds { display: none; }
  .mobile-world-close { display: block; width: 36px; height: 36px; font-size: 1.25rem; }
  .world-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); align-content: start; gap: 7px; max-height: none; margin-top: 10px; padding-bottom: 20px; }
  .world-group-label, .workspace.worlds-collapsed .world-group-label { grid-column: 1 / -1; height: auto; margin: 13px 2px 2px; background: transparent; color: #8292a7; font-size: .65rem !important; }
  .world-button, .workspace.worlds-collapsed .world-button { display: grid; grid-template-columns: 8px minmax(0,1fr); place-items: initial; min-height: 48px; padding: 10px 12px; border-color: var(--line); background: var(--surface); font-size: .79rem !important; line-height: 1.25; }
  .world-button::before, .workspace.worlds-collapsed .world-button::before { width: 7px; height: 7px; align-self: center; }
  .inspector { position: absolute; z-index: 7; inset: 0; width: 100%; box-shadow: none; visibility: hidden; transform: translateY(100%); transition: transform .24s ease, visibility .24s; }
  .inspector.open { visibility: visible; transform: translateY(0); }
  .inspector-resizer { display: none; }
  .workspace.inspector-collapsed .inspector { display: grid; visibility: hidden; transform: translateY(100%); }
  .inspector-header { padding: 12px 16px; }
  .inspector-collapse { width: 40px; height: 40px; font-size: 1.35rem; }
  .workspace-switcher { margin: 8px 12px 0; }
  .workspace-switcher .segment { min-height: 42px; font-size: .76rem; }
  .panel-scroll { padding: 16px; }
  .search-box { min-height: 44px; }
  .search-box input, .lab-field select { font-size: 1rem; }
  .search-result, .journey-module { min-height: 44px; }
  .browse-hint, .lab-intro > p:last-child, .lab-field-copy small { font-size: .84rem; }
  .lab-field-copy strong, .lab-outcome-heading strong { font-size: .9rem; }
  .lab-domain-switcher { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .lab-domain, .preset-chip, .lab-outcome-button, .lab-reveal { min-height: 42px; font-size: .76rem; }
  .record-heading h3 { font-size: 1.25rem; }
  .record-heading > p:last-child { font-size: .76rem; line-height: 1.4; }
  .record-tab { min-height: 44px; font-size: .76rem; }
  .record-body { padding: 16px 18px 32px; }
  .record-body p, .record-body li { font-size: .9rem; line-height: 1.65; }
  .record-body h4 { font-size: .75rem; }
  .quote-card blockquote { font-size: .98rem; }
  .scene-heading { top: 17px; left: 16px; right: 16px; max-width: none; padding-right: 94px; }
  .scene-heading h2 { font-size: 1.17rem; }
  .scene-heading p:last-child { display: -webkit-box; overflow: hidden; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
  .stage-toolbar { left: 12px; right: 12px; bottom: 12px; flex-wrap: wrap; }
  .genealogy-world-controls { padding: 7px 10px; }
  .genealogy-world-mode { padding: 7px 8px; font-size: .6rem; }
  .genealogy-search-wrap { width: min(190px,26vw); }
  .tool-button { min-height: 40px; padding: 8px 12px; font-size: .78rem; background: var(--surface-2); }
  #toggle-orbit { display: none; }
  .touch-control { display: inline-block; }
.touch-control.active { border-color: var(--selected-border); background: var(--selected); color: var(--selected-text); }
  .touch-zoom { min-width: 42px; font-size: 1.15rem; line-height: 1; }
  .mobile-gesture-help { display: block; flex: 1 0 100%; color: #a5b3c5; font-size: .66rem; text-shadow: 0 1px 5px #000; }
  .node-spacing { min-height: 40px; }
  .inspector-reopen { display: none; }
  .timeline-header { max-height: 45dvh; padding: 13px 14px 10px; overflow-y: auto; }
  .timeline-header h2 { margin-bottom: 7px; }
  .timeline-switches { align-items: stretch; }
  .timeline-modes { flex: 1 1 100%; }
  .timeline-mode, .timeline-view { min-height: 38px; font-size: .72rem; }
  .timeline-note { margin-top: 6px; }
  .timeline-controls { grid-template-columns: minmax(0,1fr) 42px 42px 56px; gap: 6px; }
  .timeline-controls input { grid-column: 1 / -1; }
  .timeline-controls select { grid-column: 1; }
  .timeline-controls input, .timeline-controls select { min-height: 40px; font-size: 1rem; }
  .timeline-controls button { min-height: 40px; font-size: .78rem; }
  .timeline-results { position: static; max-height: 160px; margin-top: 6px; }
  .timeline-space-guide, .timeline-footer span:last-child { display: none; }
  .timeline-footer { padding: 7px 12px; }
.mobile-nav { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); min-height: 64px; padding: 5px 6px max(5px,env(safe-area-inset-bottom)); border-top: 1px solid var(--line); background: var(--surface); }
  .mobile-nav button { display: grid; align-content: center; justify-items: center; gap: 1px; min-width: 0; min-height: 50px; padding: 2px; border: 0; border-radius: 9px; background: transparent; color: #9eacbf; font-size: .65rem; font-weight: 700; cursor: pointer; }
  .mobile-nav button span:first-child { font-size: 1.25rem; line-height: 1.15; }
.mobile-nav button.active { background: var(--selected); color: var(--selected-text); }
  .mobile-nav button:focus-visible, .mobile-world-close:focus-visible { outline: 2px solid var(--gold); outline-offset: -2px; }
  .timeline-footer span:last-child { display: none; }
}
@media (max-width: 380px) {
  .brand small { display: none; }
  .world-list { grid-template-columns: 1fr; }
  .scene-heading { padding-right: 88px; }
  .timeline-note, .timeline-prelude { display: none; }
}
@media (max-width: 390px) {
  .inspector-header h2 { font-size: .9rem; }
  .auto-open-detail { display: none; }
}
@media (max-width: 600px) {
  .genealogy-world-controls { flex-wrap: wrap; gap: 6px; }
  .genealogy-world-modes { width: 100%; }
  .genealogy-world-mode { flex: 1; padding: 7px 3px; font-size: .55rem; }
  .genealogy-search-wrap { width: 100%; }
  .genealogy-world-search { min-height: 34px; }
  .genealogy-map-legend span:last-child { display: none; }
  .genealogy-map-count { display: none; }
  .genealogy-world-note { display: none; }
}
@media (max-width: 780px) and (prefers-reduced-motion: reduce) {
  .world-rail, .inspector { transition-duration: .01ms; }
}

/* Light surfaces for copy and panels that use fixed dark-theme colors above. */
:root[data-theme="light"] .launch h1 { color: var(--text); text-shadow: none; }
:root[data-theme="light"] .launch-copy > p:last-child,
:root[data-theme="light"] .launch-hint,
:root[data-theme="light"] .world-group-label,
:root[data-theme="light"] .world-button,
:root[data-theme="light"] .tool-button,
:root[data-theme="light"] .gesture-help,
:root[data-theme="light"] .mobile-gesture-help,
:root[data-theme="light"] .timeline-note,
:root[data-theme="light"] .section-title,
:root[data-theme="light"] .record-body p,
:root[data-theme="light"] .record-body li,
:root[data-theme="light"] .quote-card blockquote,
:root[data-theme="light"] .mobile-nav button { color: var(--text); text-shadow: none; }
:root[data-theme="light"] .scene-heading { text-shadow: none; }
:root[data-theme="light"] .church-scene { filter: drop-shadow(0 18px 22px #34465c33); }
:root[data-theme="light"] .church-trigger:hover .church-scene { filter: drop-shadow(0 22px 24px #34465c44); }
:root[data-theme="light"] .open-label:hover,
:root[data-theme="light"] .church-trigger:hover .open-label { background: var(--surface-3); color: var(--gold-strong); }
:root[data-theme="light"] .writings-node-canvas-wrap { box-shadow: inset 0 0 40px #34465c18, 0 8px 24px #34465c22; }
:root[data-theme="light"] .writings-canon-note strong { color: var(--gold-strong); }
:root[data-theme="light"] .timeline-lane { background-image: linear-gradient(#1b29380b 1px, transparent 1px); }
:root[data-theme="light"] .timeline-event { box-shadow: 0 5px 12px #34465c24; }
:root[data-theme="light"] .search-box kbd { border-color: var(--line); color: var(--muted); }
:root[data-theme="light"] .lab-outcome-card { border-color: #a2ba9d; background: #edf6ed; }
:root[data-theme="light"] .lab-outcome-card.inconsistent { border-color: #d6aaa8; background: #fcf0ee; }
:root[data-theme="light"] .lab-outcome-card.predicting { border-color: #d5c394; background: #faf4e7; }
:root[data-theme="light"] .lab-status.coherent { border-color: #9dba9a; background: #edf6ed; }
:root[data-theme="light"] .lab-status.inconsistent { border-color: #d6aaa8; background: #fcf0ee; }
:root[data-theme="light"] .diagnostic-card { border-color: #d6aaa8; border-left-color: #bb655f; background: #fcf0ee; }
:root[data-theme="light"] .diagnostic-card.warning { border-color: #d5c394; border-left-color: #a57c27; background: #faf4e7; }
:root[data-theme="light"] .diagnostic-rule { background: var(--surface); }
:root[data-theme="light"] .lab-baseline-note,
:root[data-theme="light"] .lab-diagram-mode,
:root[data-theme="light"] .lab-change span,
:root[data-theme="light"] .lab-status p,
:root[data-theme="light"] .diagnostic-card p,
:root[data-theme="light"] .diagnostic-source-list small,
:root[data-theme="light"] .diagnostic-chain-stage small,
:root[data-theme="light"] .comparison-card p,
:root[data-theme="light"] .comparison-card li,
:root[data-theme="light"] .guide-card p,
:root[data-theme="light"] .filioque-timeline li,
:root[data-theme="light"] .term-card p,
:root[data-theme="light"] .principle-card p,
:root[data-theme="light"] .lab-prediction p { color: var(--muted); }
:root[data-theme="light"] .comparison-card strong,
:root[data-theme="light"] .guide-card strong,
:root[data-theme="light"] .lab-guide-drawer summary,
:root[data-theme="light"] .principle-drawer summary { color: var(--text); }
:root[data-theme="light"] .lab-outcome-repair,
:root[data-theme="light"] .term-card .term-example,
:root[data-theme="light"] .diagnostic-card .diagnostic-repair { color: #3e754a; }
:root[data-theme="light"] .preset-chip,
:root[data-theme="light"] .lab-reset-field,
:root[data-theme="light"] .diagnostic-chain summary,
:root[data-theme="light"] .diagnostic-chain-stage strong,
:root[data-theme="light"] .diagnostic-source-list strong { color: var(--gold-strong); }
:root[data-theme="light"] .diagnostic-source-link,
:root[data-theme="light"] .diagnostic-chain-stage a,
:root[data-theme="light"] .diagnostic-chain-stage span,
:root[data-theme="light"] .source-card a,
:root[data-theme="light"] .quote-card a,
:root[data-theme="light"] .source-link,
:root[data-theme="light"] .text-action { color: #285f9b; }
:root[data-theme="light"] .quote-context summary { color: var(--muted); }
:root[data-theme="light"] .data-block { color: var(--text); }
:root[data-theme="light"] .evidence-warning { color: #946226; }
:root[data-theme="light"] .writings-canon-status { color: var(--text); }
:root[data-theme="light"] .writings-canon-status.canonical { background: #dff2e7; }
:root[data-theme="light"] .writings-canon-status.read { background: #faedcf; }
:root[data-theme="light"] .writings-canon-status.uncertain { background: #dff2f4; }
:root[data-theme="light"] .writings-canon-status.disputed { background: #eee3f6; }
:root[data-theme="light"] .writings-canon-status.reported { background: #fae7dc; }
:root[data-theme="light"] .writings-canon-status.mentioned { background: #e0ecfa; }
:root[data-theme="light"] .writings-canon-status.not_counted { background: #f8e5ed; }
:root[data-theme="light"] .writings-canon-status.unassessed { background: #e8edf3; }
:root[data-theme="light"] .writings-canon-status.missing { background: #f9e4e6; }
:root[data-theme="light"] .writings-canon-status.outside-scope { background: #e7ecf0; }