/* The complete archive remains available through the adjacent reading view. */
#chronik[data-view="3d"] #timeline,
#chronik[data-view="3d"] .timeline-end { display:none; }
#spatial-root { --spatial-orange:#ff934f; --spatial-teal:#062f34; position:relative; }
#spatial-root [hidden] { display:none !important; }
.spatial-viewbar { position:sticky; top:176px; z-index:5; display:flex; align-items:center; justify-content:space-between; gap:18px; padding:17px 0; background:var(--paper,#f4f1e8); border-bottom:1px solid var(--line,#b6c6bd); }
.spatial-view-label { font-size:13px; color:var(--muted,#536e6b); }
.spatial-view-switch { display:flex; flex-wrap:nowrap; padding:4px; border:1px solid var(--ink,#063f45); border-radius:5px; }
.spatial-view-switch button { display:flex; align-items:center; justify-content:center; gap:9px; min-height:42px; padding:8px 15px; font-size:13px; white-space:nowrap; border-radius:2px; transition:color .16s,background .16s; }
.spatial-view-switch button.active { background:var(--ink,#063f45); color:var(--paper,#f4f1e8); }
.spatial-view-switch button:not(.active):not(:disabled):hover { background:#a8d7d045; }
.spatial-view-switch svg { width:17px; height:17px; fill:none; stroke:currentColor; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; }
.spatial-fallback { padding:18px 0; font-size:13px; max-width:720px; }
#spatial-timeline { padding:24px 0 43px; scroll-margin-top:84px; }
#chronik[data-view="list"] .month-section { scroll-margin-top:78px; }
.spatial-stage { position:relative; height:clamp(555px,53vw,660px); min-height:555px; isolation:isolate; overflow:hidden; background:radial-gradient(ellipse at 52% 58%,#155b5d 0%,#062f34 66%); border:1px solid #285657; border-radius:3px; color:#f4f1e8; }
.spatial-stage::after { content:""; position:absolute; inset:0; z-index:1; pointer-events:none; background:linear-gradient(180deg,#062f3478 0%,transparent 24%,transparent 70%,#062f34cf 100%); box-shadow:inset 0 0 90px #001d2420; }
#spatial-canvas { display:block; position:absolute; inset:0; width:100%; height:100%; outline-offset:-5px; touch-action:none; user-select:none; cursor:grab; }
#spatial-canvas:active { cursor:grabbing; }
#spatial-canvas:focus-visible { outline:3px solid var(--spatial-orange); }
.spatial-stage-heading { position:absolute; top:30px; left:32px; z-index:2; pointer-events:none; }
.spatial-stage-heading>p { font-size:9px; font-weight:400; letter-spacing:1.7px; color:#b0d5cc; }
.spatial-stage-heading>h2 { margin-top:7px; font-size:clamp(31px,3.1vw,48px); line-height:1.12; letter-spacing:-1.7px; font-weight:400; }
.spatial-dimension { position:absolute; right:27px; top:34px; z-index:2; display:flex; align-items:center; gap:7px; font-size:9px; color:#a8d7d0; pointer-events:none; }
.spatial-dimension>i { height:5px; width:5px; border:1px solid var(--spatial-orange); border-radius:50%; }
.spatial-date { position:absolute; bottom:26px; left:32px; display:flex; flex-direction:column; z-index:2; pointer-events:none; text-shadow:0 2px 10px #062f3466; }
#spatial-date-year { font-size:clamp(60px,7vw,100px); line-height:.9; letter-spacing:-5px; font-weight:700; color:#f4f1e8; }
#spatial-date-label { margin-top:12px; font-size:11px; letter-spacing:.4px; color:#bdded4; }
.spatial-stage-instruction { position:absolute; bottom:28px; right:28px; z-index:2; max-width:236px; display:flex; align-items:flex-start; gap:12px; font-size:11px; line-height:1.55; color:#c6e1d9; pointer-events:none; }
.spatial-stage-instruction svg { width:29px; height:29px; flex-shrink:0; fill:none; stroke:#ff934f; stroke-width:1.25; stroke-linecap:round; stroke-linejoin:round; margin-top:2px; overflow:visible; }
.spatial-loading { position:absolute; inset:44% 15% auto; text-align:center; z-index:3; color:#c7e1d7; font-size:13px; }
.spatial-empty { position:absolute; inset:24% 12% auto; z-index:3; text-align:center; }
.spatial-empty>span { display:block; color:var(--spatial-orange); font-size:58px; line-height:1; margin-bottom:20px; }
.spatial-empty>h3 { font-size:24px; font-weight:400; letter-spacing:-.5px; }
.spatial-empty>p { color:#bfd9d2; font-size:12px; margin-top:12px; }
#spatial-timeline.is-empty .spatial-date,#spatial-timeline.is-empty .spatial-stage-instruction { display:none; }
.spatial-navigation { display:flex; gap:25px; align-items:center; padding:20px 0 12px; }
.spatial-transport { display:flex; align-items:center; gap:6px; flex-shrink:0; }
.spatial-transport button { display:grid; place-items:center; width:36px; height:36px; border-radius:50%; transition:background .18s; }
.spatial-transport .spatial-step { font-size:21px; }
.spatial-transport .spatial-step:not(:disabled):hover { background:#a8d7d050; }
.spatial-transport .spatial-play { width:42px; height:42px; background:var(--ink,#063f45); color:var(--paper,#f4f1e8); }
.spatial-transport .spatial-play:not(:disabled):hover { background:#176169; }
.spatial-play svg { height:15px; width:15px; fill:currentColor; }
.spatial-play .spatial-play-icon { margin-left:2px; }
.spatial-play .spatial-pause-icon { display:none; fill:none; stroke:currentColor; stroke-width:3; }
.spatial-play.is-playing .spatial-play-icon { display:none; }
.spatial-play.is-playing .spatial-pause-icon { display:block; }
.spatial-scrubber { flex:1; min-width:0; }
#spatial-range { display:block; -webkit-appearance:none; appearance:none; width:100%; height:24px; margin:0; background:transparent; accent-color:var(--ink,#063f45); cursor:ew-resize; }
#spatial-range::-webkit-slider-runnable-track { height:3px; background:linear-gradient(to right,var(--ink,#063f45) var(--spatial-progress,0%),#b6c6bd var(--spatial-progress,0%)); border:0; border-radius:4px; }
#spatial-range::-moz-range-track { height:3px; background:#b6c6bd; border:0; border-radius:4px; }
#spatial-range::-moz-range-progress { height:3px; background:var(--ink,#063f45); border-radius:4px; }
#spatial-range::-webkit-slider-thumb { -webkit-appearance:none; width:15px; height:15px; border-radius:50%; background:var(--orange,#ff803e); border:3px solid var(--paper,#f4f1e8); box-shadow:0 0 0 1px var(--orange,#ff803e); margin-top:-6px; }
#spatial-range::-moz-range-thumb { width:10px; height:10px; border-radius:50%; background:var(--orange,#ff803e); border:3px solid var(--paper,#f4f1e8); box-shadow:0 0 0 1px var(--orange,#ff803e); }
.spatial-range-labels { display:flex; justify-content:space-between; gap:8px; font-size:9px; color:var(--muted,#536e6b); margin-top:3px; line-height:1.4; }
#spatial-range-current { color:var(--ink,#063f45); text-align:center; }
.spatial-years { display:flex; align-items:center; justify-content:space-between; gap:9px; padding:8px 0 18px; border-bottom:1px solid var(--line,#b6c6bd); overflow:auto; scrollbar-width:thin; }
.spatial-years button { position:relative; border:1px solid transparent; border-radius:2px; min-width:45px; padding:5px 8px; font-size:11px; letter-spacing:.5px; }
.spatial-years button::after { content:""; position:absolute; height:3px; width:3px; background:var(--muted,#536e6b); border-radius:50%; top:-5px; left:50%; }
.spatial-years button:hover { border-color:var(--line,#b6c6bd); }
.spatial-years button.active { background:var(--ink,#063f45); color:var(--paper,#f4f1e8); }
.spatial-years button.active::after { background:var(--orange,#ff803e); }
.spatial-meta { display:flex; justify-content:space-between; align-items:flex-start; gap:15px; padding-top:16px; font-size:10px; color:var(--muted,#536e6b); }
.spatial-point-key { display:flex; align-items:center; gap:7px; white-space:nowrap; font-size:9px; }
.spatial-point-key>i { width:4px; height:4px; border-radius:50%; background:var(--orange,#ff803e); box-shadow:0 0 0 3px #ff803e15; }
.spatial-count-hint { font-size:9px; color:var(--muted,#536e6b); margin-top:6px; max-width:650px; }
.spatial-sr { position:absolute !important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }

dialog.spatial-detail { width:min(760px,calc(100% - 40px)); max-height:90dvh; padding:29px 36px 26px; overflow:auto; border:1px solid var(--ink,#063f45); background:var(--paper,#f4f1e8); color:var(--ink,#063f45); }
dialog.spatial-detail::backdrop { background:#001c23b8; backdrop-filter:blur(7px); }
.spatial-detail-header { display:flex; align-items:center; justify-content:space-between; gap:16px; border-bottom:1px solid var(--line,#b6c6bd); padding-bottom:18px; }
.spatial-detail-header .eyebrow { font-size:9px; }
#spatial-detail-close { width:32px; height:32px; font-size:28px; line-height:1; display:grid; place-items:center; margin-right:-8px; }
.spatial-source-record { padding-top:28px; }
.spatial-source-record>time { font-size:11px; color:var(--muted,#536e6b); }
.spatial-source-record>h2 { font-size:clamp(25px,3vw,38px); line-height:1.15; letter-spacing:-1.1px; margin:12px 0; max-width:640px; }
.spatial-source-byline { font-size:10px; color:var(--muted,#536e6b); margin-bottom:22px; }
.spatial-source-record .entry-photo { margin:22px 0; }
.spatial-source-record .entry-photo img { width:100%; max-height:400px; object-fit:contain; background:#e7e8de; }
.spatial-source-record .entry-photo figcaption { font-size:10px; margin-top:9px; }
.spatial-source-body { font-size:17px; line-height:1.75; margin:24px 0; white-space:pre-line; overflow-wrap:anywhere; }
.spatial-source-record .source-detail { border-top:1px solid var(--line,#b6c6bd); padding-top:16px; }
.spatial-source-record .source-detail>summary { font-size:16px; }
.spatial-source-record .source-content { font-size:16px; text-align:left; }
.spatial-source-record .source-content p { margin-bottom:12px; }
.spatial-source-record .primary-documents article { text-align:left; }
.spatial-source-record .channel-preview { width:min(100%,450px); }
.spatial-detail-footer { border-top:1px solid var(--line,#b6c6bd); padding-top:21px; margin-top:25px; }
#spatial-read-entry { display:flex; align-items:center; justify-content:space-between; gap:30px; width:100%; padding:15px 18px; background:var(--ink,#063f45); color:var(--paper,#f4f1e8); font-size:12px; text-align:left; }
#spatial-read-entry>span:last-child { font-size:18px; }

@media (min-width:1500px) { .spatial-stage { height:690px; } }
@media (max-width:1100px) {
  .spatial-stage-heading { left:25px; top:26px; }
  .spatial-dimension { right:22px; top:29px; }
  .spatial-stage-heading>p { font-size:8px; letter-spacing:1.2px; }
  .spatial-date { left:25px; }
  .spatial-stage-instruction { right:22px; max-width:210px; font-size:10px; }
  .spatial-stage { min-height:555px; }
}
@media (max-width:750px) {
  .spatial-viewbar { top:190px; gap:10px; padding:12px 0; }
  .spatial-view-label { display:none; }
  .spatial-view-switch { width:100%; }
  .spatial-view-switch button { flex:1; min-width:0; min-height:37px; font-size:11px; padding:7px 10px; gap:8px; }
  .spatial-view-switch svg { width:16px; height:16px; }
  #spatial-timeline { padding:17px 0 35px; scroll-margin-top:72px; }
  .spatial-stage { margin:0 -2%; height:480px; min-height:480px; }
  .spatial-stage-heading { top:22px; left:20px; }
  .spatial-stage-heading>p { font-size:7px; letter-spacing:1px; max-width:220px; }
  .spatial-stage-heading>h2 { margin-top:6px; font-size:33px; letter-spacing:-1.4px; }
  .spatial-dimension { display:none; }
  .spatial-date { bottom:23px; left:20px; }
  #spatial-date-year { font-size:63px; letter-spacing:-3.5px; }
  #spatial-date-label { font-size:9px; margin-top:10px; letter-spacing:0; }
  .spatial-stage-instruction { right:17px; bottom:23px; max-width:155px; font-size:10px; gap:8px; line-height:1.5; }
  .spatial-stage-instruction svg { width:22px; height:22px; margin-top:3px; }
  .spatial-navigation { gap:16px; padding-top:16px; }
  .spatial-transport { gap:1px; }
  .spatial-transport .spatial-step { width:27px; height:32px; font-size:18px; }
  .spatial-transport .spatial-play { height:36px; width:36px; }
  .spatial-play svg { height:13px; width:13px; }
  .spatial-range-labels { font-size:8px; }
  #spatial-range-current { max-width:128px; }
  .spatial-years { gap:3px; padding:7px 0 15px; }
  .spatial-years button { min-width:35px; padding:5px 4px; font-size:9px; letter-spacing:0; }
  .spatial-meta { display:block; font-size:9px; line-height:1.65; padding-top:13px; }
  .spatial-point-key { margin-top:9px; font-size:8px; }
  .spatial-count-hint { font-size:8px; margin-top:9px; }
  .spatial-empty { inset:27% 8% auto; }
  .spatial-empty>h3 { font-size:21px; }
  .spatial-empty>p { font-size:11px; }
  dialog.spatial-detail { padding:22px 23px; width:calc(100% - 22px); max-height:92dvh; }
  .spatial-source-record { padding-top:22px; }
  .spatial-source-record>h2 { font-size:28px; }
  .spatial-source-body { font-size:16px; line-height:1.75; }
}
@media (max-width:380px) {
  .spatial-stage-instruction { max-width:135px; font-size:9px; }
  .spatial-stage-instruction svg { display:none; }
  #spatial-date-year { font-size:57px; }
  #spatial-range-current { display:none; }
  .spatial-navigation { gap:9px; }
}
@media (prefers-reduced-motion:reduce) {
  .spatial-view-switch button,.spatial-transport button { transition:none; }
}
