:root {
  --paper: #f7f7f4;
  --paper-bright: #fffefb;
  --ink: #16231f;
  --ink-soft: #52605a;
  --line: rgba(22, 35, 31, 0.17);
  --accent: #b95737;
  --sage: #83958a;
}

* { box-sizing: border-box; }
.visually-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0 0 0 0) !important; white-space: nowrap !important; border: 0 !important; }
html { background: var(--paper); color: var(--ink); scroll-behavior: smooth; scrollbar-gutter: stable; }
/* Let the modal own scrolling without losing the underlying reading position. */
html:has(.archive-dialog:modal) { overflow: hidden; }
.archive-dialog:modal { overscroll-behavior: contain; }
.spatial-curtain { position: fixed; z-index: 10000; inset: 0; overflow: hidden; background: radial-gradient(ellipse at 50% 46%, #fffef8 0, #f0eee7 65%, #deded4 100%); }
.spatial-curtain canvas { display: block; width: 100%; height: 100%; }
.spatial-curtain-caption { position: absolute; left: 24px; bottom: 23px; margin: 0; color: var(--ink-soft); font: 11px/1.4 ui-monospace, monospace; letter-spacing: .12em; }
.spatial-curtain-skip { position: absolute; right: 24px; bottom: 16px; min-height: 44px; padding: 10px 18px; border: 1px solid var(--line); border-radius: 999px; background: var(--paper-bright); color: var(--ink); cursor: pointer; font-size: 12px; }
.spatial-curtain-skip:focus-visible { outline: 2px solid var(--accent); outline-offset: 4px; }
@media (max-width: 480px) { .spatial-curtain-caption { font-size: 9px; left: 16px; bottom: 74px; } .spatial-curtain-skip { right: 16px; } }
body { margin: 0; min-width: 320px; font-family: Inter, "Helvetica Neue", "PingFang SC", "Noto Sans CJK SC", Arial, sans-serif; }
button, a { font: inherit; }
button { color: inherit; }
.workspace { position: relative; min-height: 100svh; overflow-x: clip; isolation: isolate; background:
  radial-gradient(circle at 50% 47%, #fff 0 28%, rgba(249,249,246,.94) 62%, #f1f2ef 100%); }
.workspace::before { content: ""; position: absolute; inset: 0; background-image: linear-gradient(rgba(36,50,45,.025) 1px, transparent 1px), linear-gradient(90deg, rgba(36,50,45,.021) 1px, transparent 1px); background-size: 48px 48px; mask-image: radial-gradient(circle, #000 0 55%, transparent 86%); pointer-events: none; }
.masthead { position: sticky; z-index: 30; top: 0; height: 78px; padding: 0 38px; display: grid; grid-template-columns: 1fr auto auto; gap: 12px; align-items: center; border-bottom: 1px solid var(--line); background: rgba(250,250,247,.94); }
.wordmark { display: inline-flex; align-items: center; gap: 11px; color: var(--ink); text-decoration: none; text-transform: uppercase; letter-spacing: .13em; font: 600 11px/1.2 Inter, sans-serif; }
.wordmark-mark { width: 25px; height: 13px; border: 1px solid currentColor; border-radius: 50%; transform: rotate(-18deg); position: relative; }
.wordmark-mark::after { content: ""; position: absolute; width: 3px; height: 3px; border-radius: 50%; background: currentColor; inset: 4px auto auto 10px; }
.source-state { justify-self: end; display: flex; gap: 8px; align-items: center; padding: 8px 10px; border: 1px solid transparent; border-radius: 999px; color: var(--ink-soft); background: transparent; cursor: pointer; font: 500 10px/1.2 ui-monospace, SFMono-Regular, Consolas, monospace; letter-spacing: .035em; transition: border-color .25s ease, background .25s ease; }
.source-state:hover, .source-state:focus-visible { border-color: var(--line); background: rgba(255,255,255,.32); outline: none; }
.source-dot { width: 6px; height: 6px; border-radius: 50%; background: #60866e; box-shadow: 0 0 0 4px rgba(96,134,110,.12); }
.read-memory-book { margin-left: auto; min-height: 44px; padding: 10px 18px; border: 1px solid var(--ink); border-radius: 999px; background: var(--ink); color: var(--paper-bright, #f6f1e8); font-family: inherit; font-size: 12px; line-height: 1.3; cursor: pointer; transition: transform .2s ease, background .2s ease; }
.read-memory-book:hover { transform: translateY(-2px); background: #344a40; }
.read-memory-book:focus-visible { outline: 2px solid var(--accent); outline-offset: 4px; }
[data-public-site="true"] .source-state { display: none; }
[data-public-site="true"] .masthead { grid-template-columns: 1fr auto; }
@media (max-width: 600px) { .read-memory-book { padding: 8px 12px; font-size: 11px; } }
@keyframes reader-arrival { from { opacity: 0; transform: translateY(22px) scale(.975); } to { opacity: 1; transform: none; } }
@keyframes paper-unfold { from { opacity: 0; transform: translateY(12px) scale(.94); } to { opacity: 1; transform: none; } }
[data-motion="full"] .archive-dialog[open] { animation: reader-arrival .38s cubic-bezier(.16,1,.3,1) both; }
[data-motion="full"] [data-book-state="open"] .book-spread { animation: paper-unfold .7s cubic-bezier(.16,1,.3,1) both; }
.experience-stage[hidden], .hero[hidden] { display: none !important; }
.hero { position: relative; min-height: calc(100svh - 78px); contain: layout paint style; }
.intro { position: absolute; z-index: 12; left: 3.6vw; top: 5.7vh; max-width: 400px; transition: opacity .5s ease, transform .65s cubic-bezier(.16,1,.3,1); }
.eyebrow { margin: 0 0 17px; text-transform: uppercase; letter-spacing: .18em; color: var(--accent); font: 650 10px/1.2 ui-monospace, SFMono-Regular, Consolas, monospace; }
.intro h1 { margin: 0; font-family: "Iowan Old Style", "Songti SC", "STSong", serif; font-weight: 400; font-size: clamp(32px, 3.2vw, 58px); line-height: 1.14; letter-spacing: -.045em; }
.intro-copy { width: min(340px, 80vw); margin: 21px 0 0; color: var(--ink-soft); font-size: 12px; line-height: 1.85; letter-spacing: .025em; }
.scene-shell { position: absolute; inset: 0; perspective: 920px; perspective-origin: 52% 46%; transform-style: preserve-3d; contain: layout style; }
.memory-scene { position: absolute; inset: 50% auto auto 50%; width: 0; height: 0; transform-style: preserve-3d; }
[data-preview-visible="true"] .memory-scene { transform-style: flat; }
.memory-card { --card-width: clamp(116px, 11vw, 176px); --card-height: calc(var(--card-width) * .7); position: absolute; z-index: 5; left: calc(var(--card-width) * -.5); top: calc(var(--card-height) * -.5); width: var(--card-width); height: var(--card-height); padding: 0; border: 0; background: transparent; cursor: pointer; transform-style: preserve-3d; backface-visibility: hidden; contain: layout style; }
[data-motion="full"][data-paused="false"] .memory-card { will-change: transform, opacity; }
.memory-card.role-primary { --role-scale: 1.06; }
.memory-card.role-supporting { --role-scale: 1; }
.memory-card.role-ambient { --role-scale: .9; }
.film-frame { position: absolute; inset: 0; display: block; overflow: hidden; border: 1px solid rgba(255,255,252,.46); border-radius: 2px; background: rgba(255,255,252,.05); box-shadow: inset 0 0 0 1px rgba(20,31,27,.055), inset 0 1px 0 rgba(255,255,255,.34), 0 9px 22px rgba(33,37,34,.12), 0 1px 3px rgba(33,37,34,.08); transition: transform .68s cubic-bezier(.16,1,.3,1), box-shadow .68s ease, filter .5s ease; transform: scale(var(--role-scale)); backface-visibility: hidden; }
/* An unbound photograph has no paper mount; stamp/ticket/book keep their carriers. */
.memory-card[data-binding="film"] .film-frame { padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: 0 9px 22px rgba(33,37,34,.12), 0 1px 3px rgba(33,37,34,.08); }
.memory-card[data-binding="film"] .film-frame::before { content: none; }
.film-image { position: absolute; left: 0; top: 50%; width: 100%; aspect-ratio: 1; background-size: var(--sprite-size-x, 400%) var(--sprite-size-y, 400%); background-position: var(--sprite-x) var(--sprite-y); transform: translateY(-50%); }
.film-image--ambient { background-image: var(--ambient-atlas-url, url("./assets/notion-seed-flower-gallery-ambient.webp")); transform: translateY(-50%) scale(1.075); opacity: .94; transition: opacity .62s ease, transform .75s cubic-bezier(.16,1,.3,1); }
.film-image--sharp { background-image: var(--display-atlas-url, url("./assets/notion-seed-flower-gallery.webp")); opacity: 0; transform: translateY(-50%) scale(1.035); transition: opacity .62s ease .06s, transform .75s cubic-bezier(.16,1,.3,1); }
[data-preview-treatment="sharp"] .film-image--ambient { opacity: 0; }
[data-preview-treatment="sharp"] .film-image--sharp { opacity: 1; transform: translateY(-50%) scale(1); }
.film-number { position: absolute; left: 7px; bottom: 2px; color: #39423e; font: 600 8px/1 ui-monospace, monospace; letter-spacing: .15em; }
.memory-card[data-binding="film"] .film-number { z-index: 3; left: 6px; bottom: 5px; color: rgba(255,255,252,.68); opacity: .42; text-shadow: 0 1px 3px rgba(18,25,22,.62); transition: opacity .42s ease; }
.memory-card[data-binding="film"]:focus-visible .film-number, .memory-card[data-binding="film"].is-focused .film-number { opacity: .68; }
.memory-card:focus-visible, .memory-card.is-focused { z-index: 1000 !important; outline: none; }
.memory-card.is-preview-releasing { z-index: 900 !important; pointer-events: none; }
.memory-card.is-transition-source { z-index: 85; pointer-events: none; }
.memory-card:focus-visible .film-frame, .memory-card.is-focused .film-frame { transform: scale(calc(var(--role-scale) * 1.24)) translate3d(0,-4px,86px) rotateZ(-.35deg); box-shadow: inset 0 0 0 1px rgba(20,31,27,.045), inset 0 1px 0 rgba(255,255,255,.42), 0 22px 46px rgba(25,31,28,.19), 0 2px 5px rgba(25,31,28,.1); filter: saturate(1.025); }
.memory-card[data-binding="film"]:focus-visible .film-frame, .memory-card[data-binding="film"].is-focused .film-frame { box-shadow: 0 22px 46px rgba(25,31,28,.19), 0 2px 5px rgba(25,31,28,.1); }
.memory-card:focus-visible .film-image--ambient, .memory-card.is-focused .film-image--ambient { opacity: 0; transform: translateY(-50%) scale(1.02); }
.memory-card:focus-visible .film-image--sharp, .memory-card.is-focused .film-image--sharp { opacity: 1; transform: translateY(-50%) scale(1); }
.memory-card.is-preview-entering .film-frame { animation: preview-lift .68s cubic-bezier(.16,1,.3,1) both; }
.memory-card:focus-visible .film-frame { outline: 2px solid var(--accent); outline-offset: 4px; }
.memory-card[data-binding="stamp"] .film-frame { left: 15%; right: 15%; border: 6px dotted rgba(255,255,252,.96); border-bottom-width: 6px; outline: 1px solid rgba(22,35,31,.14); outline-offset: -6px; }
.memory-card[data-binding="stamp"] .film-number { display: none; }
.memory-card[data-binding="ticket"] .film-frame { border: 1px solid rgba(22,35,31,.18); border-right: 23px solid rgba(250,249,245,.96); border-radius: 4px; }
.memory-card[data-binding="ticket"] .film-frame::after { content: ""; position: absolute; z-index: 3; right: 17px; top: 0; bottom: 0; border-left: 1px dashed rgba(22,35,31,.35); }
.memory-card[data-binding="ticket"] .film-number { left: auto; right: 4px; bottom: 50%; z-index: 4; transform: translateY(50%) rotate(90deg); }
.memory-card[data-binding="book"] .film-frame { left: 23%; right: 23%; top: -36%; bottom: -36%; border: 1px solid rgba(22,35,31,.19); border-left: 12px solid #e8e3d8; border-radius: 1px 5px 5px 1px; box-shadow: -6px 7px 0 #c9c2b4, 0 18px 34px rgba(33,37,34,.2); }
.memory-card[data-binding="book"] .film-frame::after { content: ""; position: absolute; z-index: 3; left: 7px; top: 0; bottom: 0; border-left: 1px solid rgba(22,35,31,.22); }
.memory-card[data-binding="book"] .film-number { display: none; }
/* Native photo aspect, sampling only the image inside its padded atlas cell. */
.memory-card[data-binding="film"][data-photo-crop="true"] {
  --photo-edge: clamp(116px, 11vw, 176px);
  --card-width: calc(var(--photo-edge) * var(--photo-width-factor));
  --card-height: calc(var(--photo-edge) * var(--photo-height-factor));
}
.memory-card[data-binding="film"][data-photo-crop="true"] .film-image {
  inset: 0; width: 100%; height: 100%; aspect-ratio: auto;
  background-size: var(--photo-size-x) var(--photo-size-y);
  background-position: var(--photo-position-x) var(--photo-position-y);
  transform: none;
}
.memory-card[data-binding="film"][data-photo-crop="true"] .film-image--sharp { opacity: 1; }
.memory-card[data-binding="film"][data-photo-crop="true"].is-focused .film-image--sharp,
.memory-card[data-binding="film"][data-photo-crop="true"]:focus-visible .film-image--sharp { opacity: 1; transform: none; }
.memory-card[data-binding="film"][data-photo-crop="true"] .film-image--ambient { opacity: 0; }
.replay-prelude, .skip-prelude { min-height: 44px; padding: 10px 15px; border: 1px solid var(--line); border-radius: 999px; background: var(--paper-bright); cursor: pointer; font-size: 11px; }
.skip-prelude { position: absolute; z-index: 25; bottom: 5vh; right: 4vw; }
.skip-prelude[hidden] { display: none; }
.replay-prelude:focus-visible, .skip-prelude:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
[data-motion="limited"] .replay-prelude, [data-motion="reduced"] .replay-prelude { display: none; }
[data-opening="true"] .orbit-guide, [data-opening="true"] .scene-center,
[data-opening="true"] .scene-controls, [data-opening="true"] .entry-cue { opacity: 0; pointer-events: none; }
[data-opening="true"] .intro { opacity: .45; }
[data-opening="true"] .film-frame { box-shadow: 0 18px 26px rgba(33,37,34,.18), 0 1px 2px rgba(33,37,34,.18); }
@media (max-width: 760px) {
  .memory-card[data-binding="film"][data-photo-crop="true"] { --photo-edge: clamp(88px, 19vw, 130px); }
}
@media (prefers-reduced-motion: reduce) { .replay-prelude { display: none; } }
.scene-center { position: absolute; z-index: 2; left: 50%; top: 50%; width: 135px; height: 135px; transform: translate(-50%,-50%); border: 1px solid rgba(22,35,31,.18); border-radius: 50%; display: grid; place-content: center; text-align: center; background: rgba(242,239,232,.88); color: var(--ink-soft); text-transform: uppercase; letter-spacing: .14em; font: 500 8px/1.4 ui-monospace, monospace; }
.scene-center strong { display: block; color: var(--ink); font: 400 33px/1 "Iowan Old Style", serif; letter-spacing: -.03em; }
.orbit-guide { position: absolute; left: 50%; top: 50%; width: 83vw; height: 38vh; border: 1px solid rgba(22,35,31,.13); border-radius: 50%; pointer-events: none; transition: opacity .4s ease; transform-style: preserve-3d; }
.orbit-guide span { position: absolute; right: 9%; top: -15px; color: rgba(22,35,31,.45); text-transform: uppercase; letter-spacing: .15em; font: 500 7px/1 ui-monospace, monospace; }
.orbit-guide--ascending { transform: translate(-54%,-64%) rotateZ(-14deg) rotateX(67deg) rotateY(-8deg); border-color: rgba(185,87,55,.24); }
.orbit-guide--counter { width: 72vw; height: 45vh; transform: translate(-45%,-37%) rotateZ(21deg) rotateX(58deg) rotateY(13deg); border-color: rgba(74,110,98,.25); }
.metadata-card { position: absolute; z-index: 54; left: 50%; top: 50%; width: min(226px, calc(100vw - 32px)); padding: 13px 14px 12px; overflow: hidden; border: 1px solid rgba(22,35,31,.14); border-radius: 2px; visibility: hidden; opacity: 0; pointer-events: none; background: rgba(255,255,252,.96); box-shadow: 0 18px 42px rgba(35,43,38,.12), 0 2px 7px rgba(35,43,38,.06); clip-path: inset(0 0 82% 0 round 2px); transform: translate3d(-8px,12px,0) scale(.96); transform-origin: 18% 18%; transition: clip-path .48s cubic-bezier(.16,1,.3,1), transform .48s cubic-bezier(.16,1,.3,1), opacity .3s ease, visibility 0s linear .5s; }
[data-preview-visible="true"] .metadata-card { visibility: visible; opacity: 1; clip-path: inset(0 0 0 0 round 2px); transform: translate3d(0,0,0) scale(1); transition-delay: .08s; }
.metadata-card > * { opacity: 0; transform: translateY(6px); transition: opacity .3s ease, transform .38s cubic-bezier(.16,1,.3,1); }
[data-preview-visible="true"] .metadata-card > * { opacity: 1; transform: translateY(0); }
[data-preview-visible="true"] .metadata-index { transition-delay: .14s; }
[data-preview-visible="true"] .metadata-card h2 { transition-delay: .18s; }
[data-preview-visible="true"] .metadata-caption { transition-delay: .22s; }
[data-preview-visible="true"] .metadata-card dl { transition-delay: .26s; }
[data-preview-visible="true"] .metadata-instruction { transition-delay: .3s; }
.metadata-card.is-switching { opacity: .62; transform: translate3d(5px,1px,0) scale(.985); }
.metadata-card.is-switching > * { opacity: 0; transform: translateY(-5px); transition-delay: 0s !important; }
.metadata-card::before { content: ""; position: absolute; left: -1px; top: -1px; width: 31px; border-top: 2px solid var(--accent); }
.metadata-index { margin: 0 0 9px; color: var(--accent); font: 600 8px/1 ui-monospace, monospace; letter-spacing: .14em; }
.metadata-card h2 { display: -webkit-box; overflow: hidden; margin: 0; font: 400 18px/1.18 "Iowan Old Style", "Songti SC", serif; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.metadata-caption { display: -webkit-box; overflow: hidden; min-height: 0; margin: 8px 0 10px; color: var(--ink-soft); font-size: 9px; line-height: 1.55; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.metadata-card dl { margin: 0; border-top: 1px solid var(--line); }
.metadata-card dl div { display: grid; grid-template-columns: 36px 1fr; padding: 5px 0; border-bottom: 1px solid var(--line); font-size: 8px; line-height: 1.3; }
.metadata-card dt { color: #7a837f; }
.metadata-card dd { overflow: hidden; margin: 0; text-overflow: ellipsis; white-space: nowrap; }
.metadata-instruction { margin: 8px 0 0; color: var(--accent); font: 600 7px/1.45 ui-monospace, monospace; letter-spacing: .04em; }
.scene-controls { position: absolute; z-index: 18; left: 3.6vw; bottom: 5.3vh; display: flex; align-items: center; gap: 16px; color: #6c7772; font: 500 8px/1 ui-monospace, monospace; letter-spacing: .045em; }
.motion-toggle { display: inline-flex; align-items: center; gap: 9px; padding: 8px 12px; border: 1px solid var(--line); background: rgba(255,255,255,.25); border-radius: 999px; cursor: pointer; font-size: 9px; }
.motion-toggle:disabled { cursor: default; opacity: .72; }
.archive-branch { padding: 8px 0; border: 0; border-bottom: 1px solid rgba(22,35,31,.35); color: var(--ink-soft); background: transparent; cursor: pointer; font-size: 8px; letter-spacing: .05em; }
.archive-branch:hover, .archive-branch:focus-visible { color: var(--accent); border-color: currentColor; outline: none; }
.pause-icon { width: 8px; height: 9px; border-left: 2px solid currentColor; border-right: 2px solid currentColor; }
[data-paused="true"] .pause-icon { border: 0; width: 0; height: 0; border-top: 5px solid transparent; border-bottom: 5px solid transparent; border-left: 8px solid currentColor; }
.entry-cue { position: absolute; left: 50%; bottom: 20px; transform: translateX(-50%); display: grid; justify-items: center; gap: 7px; margin: 0; color: #818a86; text-transform: uppercase; letter-spacing: .19em; font: 500 7px/1 ui-monospace, monospace; }
.entry-cue span { display: block; width: 1px; height: 21px; background: var(--ink-soft); }
[data-transitioning="true"] .intro { opacity: .24; transform: translateY(-9px); }
[data-transitioning="true"] .metadata-card { opacity: 0; transform: translateY(16px); pointer-events: none; }
[data-transitioning="true"] .orbit-guide, [data-transitioning="true"] .scene-center { opacity: .06; }
[data-transitioning="true"] .scene-controls, [data-transitioning="true"] .entry-cue { opacity: 0; pointer-events: none; }

.atelier { position: relative; z-index: 3; min-height: calc(100svh - 78px); padding: 0 clamp(22px, 5vw, 76px) 54px; background:
  radial-gradient(circle at 71% 45%, rgba(185,87,55,.1), transparent 31%),
  linear-gradient(90deg, rgba(22,35,31,.026) 1px, transparent 1px),
  linear-gradient(rgba(22,35,31,.023) 1px, transparent 1px),
  #ede8de;
  background-size: auto, 46px 46px, 46px 46px, auto;
}
.atelier-header { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; min-height: 58px; max-width: 1320px; margin: 0 auto; border-bottom: 1px solid var(--line); }
.atelier-header p { margin: 0; color: var(--accent); font: 650 8px/1 ui-monospace, monospace; letter-spacing: .16em; }
.atelier-release-id { justify-self: end; overflow: hidden; max-width: 220px; color: var(--ink-soft); text-overflow: ellipsis; white-space: nowrap; font: 500 8px/1 ui-monospace, monospace; }
.stage-back, .collection-rebind, .archive-rebind-button { padding: 7px 0; border: 0; border-bottom: 1px solid transparent; color: var(--ink-soft); background: transparent; cursor: pointer; font-size: 9px; letter-spacing: .04em; }
.stage-back { justify-self: start; }
.stage-back:hover, .stage-back:focus-visible, .collection-rebind:hover, .collection-rebind:focus-visible, .archive-rebind-button:hover, .archive-rebind-button:focus-visible { color: var(--accent); border-color: currentColor; outline: none; }
.atelier-layout { display: grid; grid-template-columns: minmax(290px, .72fr) minmax(440px, 1.28fr); align-items: center; gap: clamp(50px, 8vw, 130px); max-width: 1180px; min-height: calc(100svh - 190px); margin: 0 auto; padding: clamp(48px, 6vw, 82px) 0; }
.atelier-copy { align-self: center; }
.atelier-kicker { margin: 0 0 18px; color: var(--accent); font: 650 8px/1 ui-monospace, monospace; letter-spacing: .15em; }
.atelier-copy h2 { max-width: 510px; margin: 0; font: 400 clamp(42px, 5.2vw, 73px)/1.02 "Iowan Old Style", "Songti SC", serif; letter-spacing: -.055em; }
.atelier-intro { max-width: 470px; margin: 28px 0 36px; color: var(--ink-soft); font-size: 11px; line-height: 1.9; }
.atelier-memory-meta { max-width: 470px; margin: 0; border-top: 1px solid var(--line); }
.atelier-memory-meta div { display: grid; grid-template-columns: 75px 1fr; gap: 14px; padding: 10px 0; border-bottom: 1px solid var(--line); font-size: 9px; line-height: 1.5; }
.atelier-memory-meta dt { color: #7a837f; }
.atelier-memory-meta dd { margin: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.atelier-format-stage { position: relative; display: grid; justify-items: center; align-content: center; min-height: min(670px, calc(100svh - 175px)); padding: clamp(35px, 5vw, 64px); border: 1px solid rgba(22,35,31,.17); background: rgba(247,243,234,.66); box-shadow: 0 30px 70px rgba(40,45,41,.1); touch-action: pan-y; outline: none; }
.atelier-format-stage::before { content: "DRAG / ← →"; position: absolute; right: 17px; top: 17px; color: #8b958f; font: 600 7px/1 ui-monospace, monospace; letter-spacing: .12em; }
.atelier-format-stage:focus-visible { outline: 2px solid var(--accent); outline-offset: 5px; }
.atelier-format-index { justify-self: start; align-self: start; margin: 0 0 25px; color: var(--accent); font: 650 8px/1 ui-monospace, monospace; letter-spacing: .15em; }
.atelier-object { margin: auto; border: 0; color: inherit; font: inherit; text-align: left; }
.atelier-object:not(:disabled)[data-object="book"] { cursor: pointer; }
.atelier-object:not(:disabled)[data-object="book"]:hover { transform: translateY(-4px) rotate(-1deg); }
.atelier-object:not(:disabled):focus-visible { outline: 3px solid rgba(185,87,55,.38); outline-offset: 7px; }
.atelier-format-copy { width: min(430px, 100%); margin: 35px auto 15px; text-align: center; }
.atelier-format-copy h3 { margin: 0; font: 400 31px/1.15 "Iowan Old Style", "Songti SC", serif; }
.atelier-format-copy p { min-height: 34px; margin: 10px 0 0; color: var(--ink-soft); font-size: 9px; line-height: 1.7; }
.atelier-format-navigation { display: grid; grid-template-columns: 36px 76px 36px; align-items: center; justify-content: center; gap: 8px; margin: 2px 0 19px; }
.atelier-format-navigation button { width: 36px; height: 36px; border: 1px solid var(--line); border-radius: 50%; background: transparent; cursor: pointer; }
.atelier-format-navigation button:hover, .atelier-format-navigation button:focus-visible { color: var(--paper-bright); border-color: var(--ink); background: var(--ink); outline: none; }
.atelier-format-progress { color: var(--ink-soft); text-align: center; font: 600 8px/1 ui-monospace, monospace; letter-spacing: .14em; }
.atelier-confirm { min-height: 42px; padding: 0 22px; border: 1px solid var(--ink); border-radius: 999px; color: var(--paper-bright); background: var(--ink); cursor: pointer; font-size: 10px; letter-spacing: .05em; }
.atelier-confirm:hover, .atelier-confirm:focus-visible { background: #2d3a35; outline: 3px solid rgba(22,35,31,.13); outline-offset: 3px; }

.collection { position: relative; z-index: 3; min-height: 100svh; padding: clamp(72px, 9vw, 128px) clamp(22px, 5vw, 76px) 48px; border-top: 1px solid var(--line); background:
  radial-gradient(circle at 83% 18%, rgba(185,87,55,.085), transparent 26%),
  linear-gradient(90deg, rgba(22,35,31,.028) 1px, transparent 1px),
  linear-gradient(rgba(22,35,31,.024) 1px, transparent 1px),
  #eeeae1;
  background-size: auto, 52px 52px, 52px 52px, auto;
  content-visibility: auto;
  contain-intrinsic-size: auto 1050px;
}
.collection-heading { display: grid; grid-template-columns: minmax(150px,.55fr) minmax(420px,1.45fr) minmax(240px,.8fr); align-items: end; gap: clamp(28px, 5vw, 80px); max-width: 1320px; margin: 0 auto clamp(48px, 7vw, 90px); }
.collection-kicker { align-self: start; margin: 9px 0 0; color: var(--accent); font: 650 8px/1.5 ui-monospace, monospace; letter-spacing: .16em; }
.collection-heading h2 { margin: 0; font: 400 clamp(42px, 5.2vw, 82px)/1.03 "Iowan Old Style", "Songti SC", serif; letter-spacing: -.055em; }
.collection-intro { margin: 0 0 4px; color: var(--ink-soft); font-size: 11px; line-height: 1.85; }
.collection-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 22px; max-width: 1320px; margin: 0 auto; padding: 13px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.collection-actions { position: relative; display: flex; align-items: center; gap: 20px; }
.collection-rebind { color: var(--accent); }
.collection-sort-menu { position: relative; }
.collection-sort-menu summary { padding: 8px 11px; border: 1px solid var(--line); border-radius: 999px; color: var(--ink-soft); background: rgba(255,255,255,.25); cursor: pointer; list-style: none; font-size: 9px; }
.collection-sort-menu summary::-webkit-details-marker { display: none; }
.collection-sort-menu summary::after { content: " +"; }
.collection-sort-menu[open] summary::after { content: " −"; }
.collection-sort-menu fieldset { position: absolute; z-index: 12; top: calc(100% + 9px); left: 0; display: grid; gap: 2px; width: 235px; margin: 0; padding: 8px; border: 1px solid var(--line); background: var(--paper-bright); box-shadow: 0 18px 45px rgba(31,37,33,.16); }
.collection-sort-menu legend { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.collection-sort-menu label { display: grid; grid-template-columns: 20px 1fr; align-items: center; min-height: 39px; padding: 0 9px; cursor: pointer; font-size: 9px; }
.collection-sort-menu label:hover, .collection-sort-menu label:has(input:checked) { background: rgba(22,35,31,.06); }
.collection-sort-menu input { accent-color: var(--ink); }
.collection-release-state { margin: 0; color: var(--ink-soft); text-transform: uppercase; letter-spacing: .08em; font: 500 8px/1.4 ui-monospace, monospace; }
.collection-stage { display: grid; grid-template-columns: minmax(210px, .35fr) minmax(0, 1.65fr); gap: clamp(35px, 6vw, 92px); max-width: 1320px; min-height: 520px; margin: 0 auto; padding: clamp(42px, 6vw, 76px) 0; }
.collection-stage-copy { align-self: start; position: sticky; top: 116px; }
.collection-format-index { margin: 0 0 17px; color: var(--accent); font: 650 8px/1 ui-monospace, monospace; letter-spacing: .15em; }
.collection-format-title { max-width: 330px; margin: 0; font: 400 clamp(28px, 3vw, 45px)/1.12 "Iowan Old Style", "Songti SC", serif; letter-spacing: -.04em; }
.collection-format-description { max-width: 310px; margin: 20px 0 26px; color: var(--ink-soft); font-size: 10px; line-height: 1.8; }
.collection-open-featured { padding: 9px 0; border: 0; border-bottom: 1px solid var(--ink); background: transparent; cursor: pointer; font-size: 9px; letter-spacing: .06em; }
.collection-open-featured:hover, .collection-open-featured:focus-visible { color: var(--accent); border-color: var(--accent); outline: none; }
.collection-items { align-self: start; display: grid; gap: clamp(14px, 2vw, 27px); min-width: 0; }
.collection-item { position: relative; min-width: 0; padding: 0; overflow: hidden; border: 0; color: var(--ink); background: transparent; cursor: pointer; text-align: left; transition: transform .35s cubic-bezier(.16,1,.3,1), box-shadow .35s ease; }
.collection-item:hover, .collection-item:focus-visible { z-index: 2; outline: none; transform: translateY(-7px) rotate(0deg) !important; }
.collection-item:focus-visible { outline: 2px solid var(--accent); outline-offset: 5px; }
.collection-item.is-arrival-target:focus-visible { outline: 2px solid var(--accent); outline-offset: 5px; }
.collection-thumb { position: relative; display: block; overflow: hidden; background: #ecece8; }
.collection-thumb::before { content: ""; position: absolute; left: 50%; top: 50%; width: 100%; aspect-ratio: 1; background-image: var(--display-atlas-url, url("./assets/notion-seed-flower-gallery.webp")); background-size: var(--sprite-size-x, 400%) var(--sprite-size-y, 400%); background-position: var(--sprite-x) var(--sprite-y); transform: translate(-50%,-50%); }
.collection-item-copy { display: grid; gap: 4px; min-width: 0; }
.collection-item-copy strong { overflow: hidden; font: 500 10px/1.2 Inter, sans-serif; text-overflow: ellipsis; white-space: nowrap; }
.collection-item-copy small, .collection-item-number { color: #717d77; text-transform: uppercase; letter-spacing: .11em; font: 600 7px/1 ui-monospace, monospace; }

[data-archive-view="stamp"] .collection-items { grid-template-columns: repeat(4, minmax(0, 1fr)); }
[data-archive-view="stamp"] .collection-item { aspect-ratio: 1 / 1.08; padding: 8px; border: 6px dotted #eeeae1; outline: 1px solid rgba(22,35,31,.13); outline-offset: -6px; background: #f4f0e7; box-shadow: 0 12px 25px rgba(37,43,39,.09); transform: rotate(var(--object-tilt)); }
[data-archive-view="stamp"] .collection-thumb { height: calc(100% - 33px); filter: saturate(.82) contrast(.94); }
[data-archive-view="stamp"] .collection-item-copy { position: absolute; inset: auto 13px 10px; grid-template-columns: 1fr auto; align-items: end; }
[data-archive-view="stamp"] .collection-item-copy small { display: none; }

[data-archive-view="ticket"] .collection-items { grid-template-columns: repeat(2, minmax(0, 1fr)); }
[data-archive-view="ticket"] .collection-item { display: grid; grid-template-columns: 42% 1fr 36px; min-height: 142px; padding: 13px; border: 1px solid rgba(22,35,31,.18); border-radius: 5px; background: #f2ede2; box-shadow: 0 12px 27px rgba(37,43,39,.075); }
[data-archive-view="ticket"] .collection-item::after { content: ""; position: absolute; top: 0; right: 35px; bottom: 0; border-left: 1px dashed rgba(22,35,31,.27); }
[data-archive-view="ticket"] .collection-thumb { min-height: 116px; }
[data-archive-view="ticket"] .collection-item-copy { align-content: center; padding: 12px 16px; }
[data-archive-view="ticket"] .collection-item-copy strong { font-family: "Iowan Old Style", "Songti SC", serif; font-size: 17px; }
[data-archive-view="ticket"] .collection-item-number { align-self: center; justify-self: center; transform: rotate(90deg); white-space: nowrap; }

[data-archive-view="book"] .collection-items { grid-template-columns: repeat(6, minmax(72px, 1fr)); align-items: end; gap: clamp(10px, 1.4vw, 20px); padding: 12px 4px 30px; border-bottom: 15px solid #c8bda8; box-shadow: 0 9px 0 #ded7ca, 0 18px 22px rgba(42,45,41,.12); }
[data-archive-view="book"] .collection-item { aspect-ratio: .68 / 1; padding: 10px 10px 18px 16px; border-radius: 1px 5px 5px 1px; background: #e8e1d3; box-shadow: -5px 5px 0 #c6bba7, 0 12px 22px rgba(31,37,33,.13); transform: rotate(var(--object-tilt)); }
[data-archive-view="book"] .collection-item::before { content: ""; position: absolute; z-index: 2; left: 9px; top: 0; bottom: 0; border-left: 1px solid rgba(22,35,31,.22); box-shadow: 2px 0 4px rgba(22,35,31,.1); }
[data-archive-view="book"] .collection-thumb { height: calc(100% - 42px); filter: saturate(.78) contrast(.93); }
[data-archive-view="book"] .collection-item-copy { padding: 8px 2px 0; }
[data-archive-view="book"] .collection-item-number { position: absolute; right: 8px; bottom: 8px; }

[data-archive-view="mixed"] .collection-items { grid-template-columns: repeat(6, minmax(72px, 1fr)); align-items: start; grid-auto-flow: dense; }
[data-archive-view="mixed"] .collection-item { min-height: 0; background: #fffefb; box-shadow: 0 14px 30px rgba(37,43,39,.1); transform: rotate(var(--object-tilt)); }
[data-archive-view="mixed"] .collection-item[data-object="film"] { grid-column: span 2; aspect-ratio: 1.43; padding: 7px 7px 24px; border: 1px solid rgba(22,35,31,.16); }
[data-archive-view="mixed"] .collection-item[data-object="film"] .collection-thumb { height: 100%; }
[data-archive-view="mixed"] .collection-item[data-object="film"] .collection-item-copy { position: absolute; left: 10px; right: 10px; bottom: 7px; grid-template-columns: 1fr auto; }
[data-archive-view="mixed"] .collection-item[data-object="film"] .collection-item-copy small { display: none; }
[data-archive-view="mixed"] .collection-item[data-object="stamp"] { grid-column: span 2; aspect-ratio: 1; padding: 9px 9px 28px; border: 7px dotted #eeeae1; outline: 1px solid rgba(22,35,31,.13); outline-offset: -7px; }
[data-archive-view="mixed"] .collection-item[data-object="stamp"] .collection-thumb { height: 100%; }
[data-archive-view="mixed"] .collection-item[data-object="stamp"] .collection-item-copy { position: absolute; left: 15px; right: 15px; bottom: 10px; grid-template-columns: 1fr auto; }
[data-archive-view="mixed"] .collection-item[data-object="stamp"] .collection-item-copy small { display: none; }
[data-archive-view="mixed"] .collection-item[data-object="ticket"] { grid-column: span 3; display: grid; grid-template-columns: 48% 1fr 31px; min-height: 132px; padding: 11px; border: 1px solid rgba(22,35,31,.18); border-radius: 5px; }
[data-archive-view="mixed"] .collection-item[data-object="ticket"]::after { content: ""; position: absolute; top: 0; right: 30px; bottom: 0; border-left: 1px dashed rgba(22,35,31,.27); }
[data-archive-view="mixed"] .collection-item[data-object="ticket"] .collection-thumb { min-height: 108px; }
[data-archive-view="mixed"] .collection-item[data-object="ticket"] .collection-item-copy { align-content: center; padding: 10px 14px; }
[data-archive-view="mixed"] .collection-item[data-object="ticket"] .collection-item-number { align-self: center; justify-self: center; transform: rotate(90deg); white-space: nowrap; }
[data-archive-view="mixed"] .collection-item[data-object="book"] { grid-column: span 1; aspect-ratio: .68; padding: 9px 9px 29px 15px; border-radius: 1px 5px 5px 1px; background: #e8e1d3; box-shadow: -5px 5px 0 #c6bba7, 0 12px 22px rgba(31,37,33,.13); }
[data-archive-view="mixed"] .collection-item[data-object="book"]::before { content: ""; position: absolute; z-index: 2; left: 8px; top: 0; bottom: 0; border-left: 1px solid rgba(22,35,31,.22); }
[data-archive-view="mixed"] .collection-item[data-object="book"] .collection-thumb { height: 100%; }
[data-archive-view="mixed"] .collection-item[data-object="book"] .collection-thumb::before { width: auto; height: 100%; }
[data-archive-view="mixed"] .collection-item[data-object="book"] .collection-item-copy { padding-top: 7px; }
[data-archive-view="mixed"] .collection-item[data-object="book"] .collection-item-number { display: none; }
.collection-footnote { display: flex; justify-content: space-between; gap: 30px; max-width: 1320px; margin: 0 auto; padding-top: 18px; border-top: 1px solid var(--line); color: var(--ink-soft); font: 500 8px/1.6 ui-monospace, monospace; letter-spacing: .05em; }
.collection-footnote p { max-width: 520px; margin: 0; text-align: right; }
.grain { position: fixed; z-index: 90; inset: 0; pointer-events: none; opacity: .026; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.8'/%3E%3C/svg%3E"); background-size: 180px 180px; contain: strict; }
.focus-veil { position: fixed; z-index: 9; inset: 78px 0 0; pointer-events: none; background: rgba(229,225,216,.26); opacity: 0; transition: opacity .4s ease; }
[data-focused="true"] .focus-veil { opacity: 1; }
[data-focused="true"] .intro { opacity: .72; }
.toast { position: fixed; z-index: 100; left: 50%; bottom: 27px; padding: 11px 17px; border-radius: 999px; color: var(--paper-bright); background: var(--ink); transform: translate(-50%, 30px); opacity: 0; pointer-events: none; transition: .35s ease; font-size: 10px; letter-spacing: .05em; }
.toast.is-visible { transform: translate(-50%, 0); opacity: 1; }

dialog { color: var(--ink); }
dialog::backdrop { background: rgba(22, 29, 26, .44); backdrop-filter: blur(7px); }
.archive-dialog, .source-dialog { max-height: calc(100svh - 40px); padding: 0; overflow: auto; border: 1px solid rgba(22,35,31,.22); background: var(--paper-bright); box-shadow: 0 35px 100px rgba(21,28,25,.3); }
.archive-dialog { width: min(1080px, calc(100vw - 40px)); }
.source-dialog { width: min(920px, calc(100vw - 40px)); }
.dialog-close-row { position: sticky; z-index: 50; top: 0; display: flex; align-items: center; justify-content: flex-end; gap: 16px; min-height: 64px; padding: 8px 16px; background: var(--paper-bright); border-bottom: 1px solid var(--line); }
.dialog-dismiss-hint { margin-right: auto; color: var(--ink-soft); font-size: 11px; }
.dialog-close { min-height: 44px; padding: 0 18px; border: 1px solid var(--line); border-radius: 999px; background: rgba(243,240,233,.85); cursor: pointer; letter-spacing: .04em; font-size: 12px; }
.archive-dialog[data-closing="true"] { pointer-events: none; }
.dialog-close:hover, .dialog-close:focus-visible { border-color: var(--ink); outline: none; }
.archive-dialog-layout { min-height: min(610px, 78vh); display: grid; grid-template-columns: 1.1fr .9fr; align-items: center; gap: clamp(30px, 7vw, 88px); padding: 16px clamp(28px, 6vw, 76px) 64px; background:
  radial-gradient(circle at 24% 45%, rgba(185,87,55,.08), transparent 32%),
  linear-gradient(90deg, rgba(22,35,31,.028) 1px, transparent 1px),
  linear-gradient(rgba(22,35,31,.025) 1px, transparent 1px);
  background-size: auto, 38px 38px, 38px 38px;
}
.archive-object { --object-w: min(330px, 36vw); position: relative; width: var(--object-w); height: calc(var(--object-w) * .82); margin: 0 auto; padding: 18px; background: #eee9dc; box-shadow: 0 25px 60px rgba(31,37,33,.21); transform: rotate(-3.5deg); transition: width .55s cubic-bezier(.16,1,.3,1), height .55s cubic-bezier(.16,1,.3,1), border-radius .4s ease, transform .55s cubic-bezier(.16,1,.3,1); }
.archive-object::after { content: ""; position: absolute; pointer-events: none; }
.archive-object-image { position: relative; display: block; width: 100%; height: calc(100% - 20px); overflow: hidden; background: #ecece8; }
.archive-object-image::before { content: ""; position: absolute; left: 50%; top: 50%; width: 100%; aspect-ratio: 1; background-image: var(--display-atlas-url, url("./assets/notion-seed-flower-gallery.webp")); background-size: var(--sprite-size-x, 400%) var(--sprite-size-y, 400%); background-position: var(--sprite-x) var(--sprite-y); filter: saturate(.86) contrast(.95); transform: translate(-50%,-50%); }
.archive-object-caption { display: block; height: 20px; padding-top: 9px; color: #48534e; text-transform: uppercase; letter-spacing: .15em; font: 600 7px/1 ui-monospace, monospace; }
.archive-object[data-object="stamp"] { --object-w: min(320px, 35vw); height: var(--object-w); border: 8px dotted var(--paper-bright); outline: 1px solid rgba(22,35,31,.12); outline-offset: -8px; transform: rotate(-4deg); }
.archive-object[data-object="stamp"] .archive-object-image { height: calc(100% - 23px); }
.archive-object[data-object="ticket"] { --object-w: min(390px, 42vw); height: calc(var(--object-w) * .54); padding: 15px 46px 15px 15px; border-radius: 5px; transform: rotate(2deg); }
.archive-object[data-object="ticket"]::after { right: 30px; top: 0; bottom: 0; border-left: 1px dashed rgba(22,35,31,.36); }
.archive-object[data-object="ticket"] .archive-object-image { height: 100%; }
.archive-object[data-object="ticket"] .archive-object-caption { position: absolute; right: 7px; top: 50%; width: 70px; height: auto; padding: 0; transform: translate(29px,-50%) rotate(90deg); text-align: center; white-space: nowrap; }
.archive-object[data-object="book"] { --object-w: min(270px, 30vw); height: calc(var(--object-w) * 1.35); padding: 17px 17px 24px 30px; border-radius: 2px 8px 8px 2px; transform: rotate(-1deg); box-shadow: -10px 12px 0 #c8c0ae, 0 27px 62px rgba(31,37,33,.25); }
.archive-object[data-object="book"]::after { left: 18px; top: 0; bottom: 0; border-left: 1px solid rgba(22,35,31,.22); box-shadow: 3px 0 5px rgba(22,35,31,.1); }
.archive-object[data-object="book"] .archive-object-image { height: calc(100% - 26px); }
.archive-object[data-object="book"] .archive-object-image::before { width: auto; height: 100%; }
.archive-copy { max-width: 330px; }
.archive-index, .source-panel-kicker { margin: 0 0 18px; color: var(--accent); text-transform: uppercase; letter-spacing: .17em; font: 650 9px/1 ui-monospace, monospace; }
.archive-title { margin: 0; font: 400 clamp(36px, 4.2vw, 62px)/1.05 "Iowan Old Style", "Songti SC", serif; letter-spacing: -.05em; }
.archive-meta { margin: 14px 0 30px; color: #76817c; font: 500 9px/1.4 ui-monospace, monospace; }
.archive-note { margin: 0; font: 400 16px/1.85 "Iowan Old Style", "Songti SC", serif; }
.archive-binding-state { margin: 30px 0 8px; padding-top: 15px; border-top: 1px solid var(--line); color: var(--ink-soft); font-size: 9px; }
.archive-binding-state strong { color: var(--ink); font-weight: 600; }
.archive-rebind-button { color: var(--accent); }
.archive-explanation { margin: 18px 0 0; color: var(--ink-soft); font-size: 10px; line-height: 1.7; }

.archive-editorial { position: relative; padding: clamp(55px, 7vw, 88px) clamp(28px, 7vw, 86px) 42px; overflow: hidden; border-top: 1px solid var(--line); background:
  linear-gradient(90deg, transparent 0 8.5%, rgba(185,87,55,.11) 8.5% calc(8.5% + 1px), transparent calc(8.5% + 1px)),
  repeating-linear-gradient(0deg, transparent 0 31px, rgba(57,76,68,.055) 31px 32px),
  #eee8dc;
}
.archive-editorial::before { content: ""; position: absolute; top: 28px; right: 9%; width: 116px; height: 25px; background: rgba(205,188,150,.48); box-shadow: 0 1px 3px rgba(50,45,35,.08); transform: rotate(3deg); }
.archive-editorial-header { display: grid; grid-template-columns: 1fr 2fr 1fr; align-items: end; gap: 25px; margin-bottom: 58px; padding-bottom: 17px; border-bottom: 1px solid rgba(22,35,31,.22); }
.archive-editorial-header p, .archive-editorial-source { margin: 0; color: var(--accent); text-transform: uppercase; letter-spacing: .13em; font: 650 7px/1.5 ui-monospace, monospace; }
.archive-editorial-header h3 { margin: 0; font: 400 clamp(31px, 4vw, 52px)/1.06 "Iowan Old Style", "Songti SC", serif; letter-spacing: -.04em; }
.archive-editorial-source { justify-self: end; max-width: 180px; overflow: hidden; color: var(--ink-soft); text-overflow: ellipsis; white-space: nowrap; }
.archive-editorial-body { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); align-items: start; gap: 34px clamp(24px, 4vw, 58px); min-height: 380px; }
.editorial-block { min-width: 0; }
.editorial-heading { grid-column: 1 / -1; margin: 11px 0 -4px; }
.editorial-heading h2, .editorial-heading h3, .editorial-heading h4 { max-width: 720px; margin: 0; font-family: "Iowan Old Style", "Songti SC", serif; font-weight: 400; line-height: 1.13; letter-spacing: -.035em; }
.editorial-heading h2 { font-size: clamp(30px, 3.6vw, 47px); }
.editorial-heading h3 { font-size: clamp(25px, 3vw, 37px); }
.editorial-heading h4 { font-size: 23px; }
.editorial-paragraph { grid-column: span 6; }
.editorial-paragraph p { margin: 0; color: #394842; font: 400 14px/2 "Iowan Old Style", "Songti SC", serif; }
.editorial-block strong { font-weight: 700; }
.editorial-block em { font-style: italic; }
.editorial-block s { opacity: .58; }
.editorial-block u { text-decoration-color: rgba(185,87,55,.55); text-decoration-thickness: 1px; text-underline-offset: 3px; }
.editorial-block code { padding: 2px 5px; border-radius: 3px; background: rgba(22,35,31,.07); font: 500 .82em/1.4 ui-monospace, monospace; }
.editorial-quote { grid-column: 2 / span 5; padding: 8px 0 8px 24px; border-left: 2px solid var(--accent); transform: rotate(-.4deg); }
.editorial-quote blockquote { margin: 0; font: italic 400 clamp(21px, 2.6vw, 31px)/1.5 "Iowan Old Style", "Songti SC", serif; }
.editorial-callout { grid-column: span 6; display: grid; grid-template-columns: auto 1fr; gap: 13px; padding: 17px 20px; border: 1px solid rgba(22,35,31,.16); background: rgba(247,242,231,.72); box-shadow: 0 10px 22px rgba(40,45,41,.055); transform: rotate(.35deg); }
.editorial-callout span:first-child { font-size: 20px; }
.editorial-callout p { margin: 0; color: var(--ink-soft); font-size: 11px; line-height: 1.8; }
.editorial-list { grid-column: span 6; padding: 20px 24px; border: 1px solid rgba(22,35,31,.14); background: rgba(255,255,255,.25); }
.editorial-list ul, .editorial-list ol { display: grid; gap: 10px; margin: 0; padding-left: 19px; color: #394842; font: 400 12px/1.7 "Iowan Old Style", "Songti SC", serif; }
.editorial-link { color: inherit; text-decoration-color: rgba(185,87,55,.55); text-decoration-thickness: 1px; text-underline-offset: .18em; }
.editorial-link:hover { color: var(--accent); text-decoration-color: currentColor; }
.editorial-link:focus-visible { border-radius: 2px; outline: 2px solid rgba(185,87,55,.38); outline-offset: 2px; }
.editorial-table { grid-column: 1 / -1; }
.editorial-table-scroll { max-width: 100%; overflow-x: auto; border: 1px solid rgba(22,35,31,.16); background: rgba(255,255,255,.24); overscroll-behavior-inline: contain; scrollbar-width: thin; }
.editorial-table-scroll:focus-visible { outline: 3px solid rgba(185,87,55,.3); outline-offset: 3px; }
.editorial-table table { width: max-content; min-width: 100%; border-collapse: collapse; color: #394842; font: 400 11px/1.6 "Iowan Old Style", "Songti SC", serif; }
.editorial-table th, .editorial-table td { max-width: 22rem; padding: 11px 13px; border-right: 1px solid rgba(22,35,31,.13); border-bottom: 1px solid rgba(22,35,31,.13); text-align: left; vertical-align: top; overflow-wrap: anywhere; }
.editorial-table th { color: var(--ink); background: rgba(185,87,55,.075); font-weight: 650; }
.editorial-table tr:last-child > * { border-bottom: 0; }
.editorial-table tr > *:last-child { border-right: 0; }
.editorial-divider { grid-column: 1 / -1; height: 1px; margin: 12px 0; background: rgba(22,35,31,.22); }
.editorial-image { grid-column: span 7; position: relative; margin: 9px 0; padding: 13px 13px 36px; background: #f5f0e5; box-shadow: 0 18px 40px rgba(38,42,39,.14); transform: rotate(-1.1deg); }
.editorial-image:nth-of-type(even) { grid-column: 6 / span 7; transform: rotate(.8deg); }
.editorial-image::before { content: ""; position: absolute; z-index: 2; left: 50%; top: -13px; width: 86px; height: 24px; background: rgba(204,186,148,.52); transform: translateX(-50%) rotate(-2deg); }
.editorial-image-visual { position: relative; display: block; aspect-ratio: 1; min-height: 0; overflow: hidden; background: #ecece8; }
.editorial-image-visual::before { content: ""; position: absolute; inset: 0; background-image: var(--display-atlas-url, url("./assets/notion-seed-flower-gallery.webp")); background-size: var(--sprite-size-x, 400%) var(--sprite-size-y, 400%); background-position: var(--sprite-x) var(--sprite-y); }
.editorial-image-visual--document-only::before { display: none; }
.editorial-image-document { position: absolute; z-index: 1; inset: 0; width: 100%; height: 100%; object-fit: contain; background: #ecece8; }
.editorial-image-visual[data-image-error="true"]::after { content: "图片暂不可用"; position: absolute; inset: 0; display: grid; place-items: center; color: var(--ink-soft); font: 500 8px/1.5 ui-monospace, monospace; letter-spacing: .08em; }
.editorial-image figcaption { position: absolute; left: 15px; right: 15px; bottom: 13px; overflow: hidden; color: var(--ink-soft); text-overflow: ellipsis; white-space: nowrap; font: 500 8px/1 ui-monospace, monospace; letter-spacing: .04em; }
.archive-editorial-footer { display: flex; justify-content: space-between; gap: 35px; margin-top: 65px; padding-top: 15px; border-top: 1px solid rgba(22,35,31,.2); color: var(--ink-soft); font: 500 8px/1.6 ui-monospace, monospace; }
.archive-editorial-footer p { max-width: 530px; margin: 0; text-align: right; }

.book-reader[hidden], .book-navigation[hidden], .book-spread[hidden], .book-page[hidden] { display: none !important; }
.archive-dialog[data-archive-kind="book"] { width: min(1180px, calc(100vw - 40px)); overflow-x: hidden; background: #e9e3d8; }
.archive-dialog[data-archive-kind="book"] .archive-dialog-layout,
.archive-dialog[data-archive-kind="book"] .archive-editorial { display: none; }
.book-reader { min-height: min(760px, calc(100svh - 88px)); padding: 8px clamp(24px, 5vw, 68px) 34px; background:
  radial-gradient(circle at 50% 46%, rgba(255,255,255,.72), transparent 42%),
  linear-gradient(90deg, rgba(22,35,31,.032) 1px, transparent 1px),
  linear-gradient(rgba(22,35,31,.027) 1px, transparent 1px),
  #e9e3d8;
  background-size: auto, 38px 38px, 38px 38px;
}
.book-reader-header { display: flex; align-items: flex-end; justify-content: space-between; gap: 28px; padding: 4px 0 22px; border-bottom: 1px solid rgba(22,35,31,.18); }
.book-reader-header p { margin: 0 0 8px; color: var(--accent); text-transform: uppercase; letter-spacing: .15em; font: 650 8px/1 ui-monospace, monospace; }
.book-reader-title { max-width: 720px; margin: 0; font: 400 clamp(27px, 3.8vw, 48px)/1.05 "Iowan Old Style", "Songti SC", serif; letter-spacing: -.045em; }
.book-reader-meta { display: block; margin-top: 8px; color: var(--ink-soft); font: 500 8px/1.5 ui-monospace, monospace; }
.book-rebind-button { flex: 0 0 auto; color: var(--accent); }
.book-reader-actions, .book-picker-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.book-reader-actions button, .book-picker-actions button { min-height: 44px; padding: 8px 14px; border: 1px solid rgba(22,35,31,.18); border-radius: 999px; color: var(--ink-soft); background: rgba(255,254,251,.55); cursor: pointer; font-size: 12px; transition: background .2s ease, border-color .2s ease; }
.book-reader-actions button:hover { background: var(--paper-bright); border-color: var(--ink-soft); }
.book-reader-actions button:focus-visible, .book-picker-actions button:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.book-content-summary, .book-selection-count, .book-photo-picker-help { color: var(--ink-soft); font-size: 12px; line-height: 1.7; overflow-wrap: anywhere; }
.book-photo-picker { margin: 16px 0; padding: 16px; border: 1px solid rgba(22,35,31,.2); background: rgba(255,255,255,.35); }
.book-photo-picker fieldset { min-width: 0; margin: 0 0 14px; padding: 0; border: 0; }
.book-photo-picker legend { padding: 0; font-size: 16px; }
.book-photo-options { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 120px), 1fr)); gap: 12px; }
.book-photo-option { min-width: 0; display: grid; grid-template-columns: 20px minmax(0, 1fr); gap: 6px; padding: 8px; border: 1px solid rgba(22,35,31,.22); border-radius: 4px; cursor: pointer; }
.book-photo-option:has(:checked) { border-color: var(--accent); background: rgba(185,87,55,.08); }
.book-photo-option:focus-within { outline: 2px solid var(--accent); outline-offset: 2px; }
.book-photo-option input { width: 18px; height: 18px; margin: 2px 0; accent-color: var(--accent); }
.book-photo-option-title { font-size: 12px; line-height: 1.5; overflow-wrap: anywhere; }
.book-photo-thumbnail { grid-column: 1 / -1; display: block; aspect-ratio: 1.3; background-image: var(--display-atlas-url); background-size: var(--sprite-size-x, 400%) var(--sprite-size-y, 400%); background-position: var(--sprite-x) var(--sprite-y); }
.book-reader-stage { display: grid; min-height: 520px; place-items: center; padding: clamp(26px, 4.5vh, 52px) 0 28px; perspective: 1800px; touch-action: pan-y; }
.book-reader-shell { position: relative; width: min(900px, 86vw); aspect-ratio: 1.62; transform-style: preserve-3d; }
.book-spread { position: absolute; inset: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); opacity: 0; transform: scale(.82); transform-style: preserve-3d; transition: opacity .34s ease, transform .72s cubic-bezier(.16,1,.3,1); }
[data-book-state="open"] .book-spread { opacity: 1; transform: scale(1); }
.book-page { position: relative; min-width: 0; padding: clamp(27px, 3.8vw, 48px); overflow: auto; border: 1px solid rgba(22,35,31,.14); color: #26352f; background:
  repeating-linear-gradient(0deg, transparent 0 30px, rgba(57,76,68,.045) 30px 31px),
  #f3ede1;
  box-shadow: 0 23px 48px rgba(33,38,34,.16);
  scrollbar-width: thin;
}
.book-page--left { border-radius: 7px 1px 1px 7px; box-shadow: inset -20px 0 26px -28px rgba(23,30,26,.55), -9px 23px 48px rgba(33,38,34,.13); }
.book-page--right { border-radius: 1px 7px 7px 1px; box-shadow: inset 20px 0 26px -28px rgba(23,30,26,.55), 9px 23px 48px rgba(33,38,34,.13); }
.book-page--measure { position: absolute; inset: 0 50% 0 0; z-index: -1; visibility: hidden; overflow: hidden; pointer-events: none; box-shadow: none; }
.book-page[data-oversized-block="true"] { overscroll-behavior: contain; }
.book-page-number { position: absolute; right: 23px; bottom: 18px; color: #8a8f89; font: 600 7px/1 ui-monospace, monospace; letter-spacing: .12em; }
.book-page--left .book-page-number { right: auto; left: 23px; }
.book-page-kicker { margin: 0 0 18px; color: var(--accent); text-transform: uppercase; letter-spacing: .14em; font: 650 7px/1.4 ui-monospace, monospace; }
.book-page-title { margin: 0; font: 400 clamp(27px, 3vw, 42px)/1.08 "Iowan Old Style", "Songti SC", serif; letter-spacing: -.04em; }
.book-page-meta { margin: 14px 0 24px; color: var(--ink-soft); font: 500 8px/1.55 ui-monospace, monospace; }
.book-frontispiece-image { position: relative; display: block; width: min(100%, 260px); aspect-ratio: 1.25; margin: 25px 0 0 auto; overflow: hidden; background: #deddd7; box-shadow: 0 13px 26px rgba(32,38,34,.14); transform: rotate(1.2deg); }
.book-frontispiece-image::before { content: ""; position: absolute; inset: 0; background-image: var(--display-atlas-url, url("./assets/notion-seed-flower-gallery.webp")); background-size: var(--sprite-size-x, 400%) var(--sprite-size-y, 400%); background-position: var(--sprite-x) var(--sprite-y); }
.book-page .editorial-block { display: block; margin: 0 0 22px; padding: 0; transform: none; }
.book-page .editorial-heading { margin-top: 7px; }
.book-page .editorial-heading h2, .book-page .editorial-heading h3, .book-page .editorial-heading h4 { font-size: clamp(22px, 2.35vw, 31px); }
.book-page .editorial-paragraph p { font-size: 13px; line-height: 1.9; }
.book-page .editorial-quote { padding-left: 17px; }
.book-page .editorial-quote blockquote { font-size: clamp(18px, 2vw, 25px); }
.book-page .editorial-callout { grid-template-columns: auto 1fr; padding: 14px; }
.book-page .editorial-list { padding: 15px 18px; }
.book-page .editorial-table th, .book-page .editorial-table td { max-width: 15rem; padding: 8px 9px; font-size: 10px; }
.book-page .editorial-image { width: min(100%, 280px); margin: 18px auto 26px; padding: 10px 10px 31px; }
.book-page .editorial-image::before { width: 68px; height: 19px; top: -10px; }
.book-page .editorial-image figcaption { position: static; margin-top: 12px; overflow: visible; white-space: pre-wrap; overflow-wrap: anywhere; text-overflow: clip; font-size: 12px; line-height: 1.7; }
.book-colophon { display: grid; min-height: 100%; align-content: center; }
.book-colophon dl { display: grid; gap: 10px; margin: 26px 0 0; padding-top: 18px; border-top: 1px solid rgba(22,35,31,.18); }
.book-colophon div { display: grid; grid-template-columns: 78px 1fr; gap: 14px; }
.book-colophon dt { color: var(--ink-soft); font: 600 7px/1.5 ui-monospace, monospace; text-transform: uppercase; letter-spacing: .11em; }
.book-colophon dd { margin: 0; overflow-wrap: anywhere; font-size: 10px; line-height: 1.55; }
.book-blank { display: grid; min-height: 100%; place-items: center; color: rgba(22,35,31,.32); font: italic 400 15px/1.6 "Iowan Old Style", "Songti SC", serif; }
.book-cover { position: absolute; z-index: 4; left: 25%; top: 0; width: 50%; height: 100%; padding: 24px 24px 31px 43px; overflow: hidden; border: 0; border-radius: 2px 10px 10px 2px; color: var(--ink); background: #e6dece; box-shadow: -13px 15px 0 #beb5a3, 0 31px 65px rgba(25,31,28,.28); cursor: pointer; text-align: left; transform-origin: left center; transform-style: preserve-3d; transition: left .72s cubic-bezier(.16,1,.3,1), transform .92s cubic-bezier(.7,0,.2,1), opacity .2s .42s ease, box-shadow .45s ease; }
.book-cover::before { content: ""; position: absolute; left: 25px; top: 0; bottom: 0; border-left: 1px solid rgba(22,35,31,.23); box-shadow: 4px 0 7px rgba(22,35,31,.1); }
.book-cover:hover, .book-cover:focus-visible { outline: 3px solid rgba(185,87,55,.34); outline-offset: 5px; box-shadow: -13px 15px 0 #beb5a3, 0 36px 74px rgba(25,31,28,.34); }
.book-cover-image { position: relative; display: block; height: 63%; overflow: hidden; background: #dadbd6; }
.book-cover-image::before { content: ""; position: absolute; inset: 0; background-image: var(--display-atlas-url, url("./assets/notion-seed-flower-gallery.webp")); background-size: var(--sprite-size-x, 400%) var(--sprite-size-y, 400%); background-position: var(--sprite-x) var(--sprite-y); filter: saturate(.9) contrast(.97); }
.book-cover-copy { display: grid; gap: 7px; padding-top: 18px; }
.book-cover-copy small { color: #56605a; font: 600 6px/1 ui-monospace, monospace; letter-spacing: .14em; }
.book-cover-copy strong { max-height: 2.2em; overflow: hidden; font: 400 clamp(21px, 2.4vw, 31px)/1.1 "Iowan Old Style", "Songti SC", serif; letter-spacing: -.035em; }
.book-cover-copy > span { color: var(--accent); font: 600 8px/1 ui-monospace, monospace; letter-spacing: .08em; }
[data-book-state="open"] .book-cover { left: 50%; pointer-events: none; opacity: 0; transform: rotateY(-178deg); box-shadow: none; }
.book-turning-page { position: absolute; z-index: 6; top: 0; bottom: 0; width: 50%; margin: 0; pointer-events: none; transform-style: preserve-3d; backface-visibility: hidden; will-change: transform, opacity; }
.book-turning-page--next { left: 50%; transform-origin: left center; }
.book-turning-page--previous { left: 0; transform-origin: right center; }
.book-turn-shadow { position: absolute; z-index: 4; inset: 0; pointer-events: none; opacity: 0; background: linear-gradient(90deg, rgba(20,25,22,.45), rgba(20,25,22,.12) 22%, transparent 58%); will-change: opacity; }
.book-turning-page--previous .book-turn-shadow { background: linear-gradient(270deg, rgba(20,25,22,.45), rgba(20,25,22,.12) 22%, transparent 58%); }
.book-navigation { display: grid; grid-template-columns: auto 1fr 38px auto 38px; align-items: center; gap: 12px; max-width: 900px; margin: 0 auto; }
.book-navigation button { min-width: 38px; min-height: 34px; border: 1px solid rgba(22,35,31,.25); border-radius: 999px; background: rgba(247,243,235,.72); cursor: pointer; }
.book-navigation button:hover, .book-navigation button:focus-visible { border-color: var(--ink); outline: 2px solid rgba(185,87,55,.2); outline-offset: 2px; }
.book-navigation button:disabled { cursor: not-allowed; opacity: .32; }
.book-close-cover { padding: 0 15px; color: var(--accent); font-size: 8px; letter-spacing: .06em; }
.book-page-status { min-width: 80px; color: var(--ink-soft); text-align: center; font: 600 8px/1 ui-monospace, monospace; letter-spacing: .1em; }
.book-reader-hint { margin: 18px 0 0; color: var(--ink-soft); text-align: center; font-size: 9px; line-height: 1.6; }

.source-dialog--wizard { width: min(960px, calc(100vw - 40px)); min-height: min(690px, calc(100svh - 40px)); padding-bottom: 0; overflow-x: hidden; }
.source-wizard-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 30px; margin: 0 clamp(28px, 5vw, 64px) 32px; }
.source-dialog h2 { max-width: 640px; margin: 0 0 11px; font: 400 clamp(31px, 4.2vw, 54px)/1.08 "Iowan Old Style", "Songti SC", serif; letter-spacing: -.045em; }
.source-wizard-header > div > p:last-child { max-width: 610px; margin: 0; color: var(--ink-soft); font-size: 11px; line-height: 1.7; }
.connection-badge { flex: 0 0 auto; margin-top: 3px; padding: 7px 10px; border: 1px solid var(--line); border-radius: 999px; color: var(--ink-soft); background: rgba(255,255,255,.35); font: 600 8px/1 ui-monospace, monospace; letter-spacing: .07em; }
.connection-badge[data-connected="true"] { color: #496c57; border-color: rgba(73,108,87,.28); background: rgba(96,134,110,.09); }
.source-wizard-layout { display: grid; grid-template-columns: 168px 1fr; min-height: 405px; margin: 0 clamp(28px, 5vw, 64px); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.source-wizard-steps { display: flex; flex-direction: column; padding: 19px 20px 19px 0; border-right: 1px solid var(--line); }
.source-wizard-steps button { display: grid; grid-template-columns: 29px 1fr; align-items: center; width: 100%; min-height: 47px; padding: 0 12px; border: 0; border-radius: 3px; color: #75807b; background: transparent; cursor: pointer; text-align: left; font-size: 10px; letter-spacing: .08em; }
.source-wizard-steps button span { font: 600 8px/1 ui-monospace, monospace; }
.source-wizard-steps button:hover, .source-wizard-steps button:focus-visible { color: var(--ink); background: rgba(255,255,255,.35); outline: none; }
.source-wizard-steps button.is-active { color: var(--paper-bright); background: var(--ink); }
.source-wizard-panels { padding: 30px 0 34px clamp(30px, 4vw, 52px); }
.source-wizard-panels > section { max-width: 580px; }
.source-wizard-panels h3 { margin: 0 0 12px; font: 400 clamp(25px, 3vw, 37px)/1.15 "Iowan Old Style", "Songti SC", serif; letter-spacing: -.03em; }
.source-step-index { margin: 0 0 13px; color: var(--accent); font: 650 8px/1 ui-monospace, monospace; letter-spacing: .15em; }
.source-step-copy { max-width: 530px; margin: 0 0 24px; color: var(--ink-soft); font-size: 11px; line-height: 1.7; }
.connection-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin: 0 0 26px; }
.connection-summary div { padding: 13px 14px; border: 1px solid var(--line); background: rgba(255,255,255,.25); }
.connection-summary dt { margin-bottom: 7px; color: #7a837f; text-transform: uppercase; letter-spacing: .08em; font-size: 7px; }
.connection-summary dd { margin: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font: 500 9px/1.3 ui-monospace, monospace; }
.source-primary, .source-secondary { min-height: 37px; padding: 0 14px; border-radius: 999px; cursor: pointer; font-size: 9px; letter-spacing: .04em; }
.source-primary { border: 1px solid var(--ink); color: var(--paper-bright); background: var(--ink); }
.source-primary:hover, .source-primary:focus-visible { background: #2b3934; outline: 2px solid rgba(22,35,31,.16); outline-offset: 2px; }
.source-primary:disabled { border-color: #a7aaa6; color: #f3f0e9; background: #a7aaa6; cursor: not-allowed; }
.source-secondary { margin-left: 6px; border: 1px solid var(--line); background: transparent; }
.source-secondary:hover, .source-secondary:focus-visible { border-color: var(--ink); outline: none; }
.connection-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 7px; }
.connection-actions .source-secondary { margin-left: 0; }
.manual-import { display: grid; grid-template-columns: 1fr 1fr; gap: 11px 14px; margin: 22px 0 0; padding: 18px 0 0; border-top: 1px solid var(--line); }
.manual-import > div:first-child, .manual-import-actions, .manual-import-note { grid-column: 1 / -1; }
.manual-import h4 { margin: 0; font: 500 15px/1.3 "Iowan Old Style", "Songti SC", serif; }
.manual-import label { display: grid; gap: 6px; color: var(--ink-soft); font-size: 8px; letter-spacing: .04em; }
.manual-import label:nth-of-type(1) { grid-column: 1 / -1; }
.manual-import input { min-width: 0; min-height: 35px; padding: 7px 9px; border: 1px solid var(--line); border-radius: 2px; color: var(--ink); background: rgba(255,255,255,.4); font: 500 9px/1.3 ui-monospace, monospace; }
.manual-import input:focus-visible { border-color: var(--ink); outline: 2px solid rgba(22,35,31,.12); outline-offset: 2px; }
.manual-import input[type="file"] { padding: 6px; }
.manual-import input[type="file"]::file-selector-button { margin-right: 8px; padding: 5px 8px; border: 0; border-radius: 999px; color: var(--paper-bright); background: var(--ink); font: inherit; cursor: pointer; }
.manual-import-actions { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.manual-file-summary { color: var(--ink-soft); font: 500 8px/1.4 ui-monospace, monospace; }
.manual-import-note { margin: 0; color: #7a837f; font-size: 8px; line-height: 1.55; }
.manual-import-note code { overflow-wrap: anywhere; color: var(--ink); font: 600 8px/1.5 ui-monospace, monospace; }
.connect-notion-button[hidden], .disconnect-notion-button[hidden], .oauth-setup-checklist[hidden] { display: none; }
.oauth-setup-checklist { display: grid; gap: 0; margin: 22px 0 0; padding: 0; border-top: 1px solid var(--line); list-style: none; }
.oauth-setup-checklist li { display: grid; grid-template-columns: 30px 1fr; gap: 10px; padding: 10px 0; border-bottom: 1px solid var(--line); }
.oauth-setup-checklist li > span { color: var(--accent); font: 650 8px/1.6 ui-monospace, monospace; }
.oauth-setup-checklist p { margin: 0; color: var(--ink-soft); font-size: 9px; line-height: 1.6; }
.oauth-setup-checklist code { overflow-wrap: anywhere; color: var(--ink); font: 600 8px/1.5 ui-monospace, monospace; }
.oauth-configuration-note { max-width: 520px; margin: 17px 0 0; color: #7a837f; font-size: 9px; line-height: 1.55; }
.source-page-list { display: grid; gap: 7px; max-height: 225px; margin: 0 0 22px; overflow: auto; }
.source-page-option { display: grid; grid-template-columns: 20px 1fr auto; align-items: center; gap: 10px; min-height: 58px; padding: 9px 13px; border: 1px solid var(--line); background: rgba(255,255,255,.25); cursor: pointer; }
.source-page-option:has(input:checked) { border-color: var(--ink); background: rgba(255,255,255,.55); box-shadow: inset 3px 0 0 var(--accent); }
.source-page-option input { accent-color: var(--ink); }
.source-page-option span { display: grid; gap: 4px; }
.source-page-option strong { font: 500 12px/1.2 inherit; }
.source-page-option small { color: #7a837f; font-size: 8px; }
.source-page-option em { padding: 5px 7px; border-radius: 999px; color: var(--ink-soft); background: rgba(22,35,31,.06); font: 600 7px/1 ui-monospace, monospace; }
.source-empty { color: var(--ink-soft); font-size: 11px; }
.mapping-summary { display: grid; grid-template-columns: 1fr auto; gap: 6px 16px; margin: 0 0 17px; }
.mapping-summary strong { font: 500 13px/1.3 inherit; }
.mapping-summary span { color: var(--ink-soft); font-size: 9px; }
.mapping-summary em { grid-column: 1 / -1; justify-self: start; color: var(--accent); font: 600 8px/1 ui-monospace, monospace; }
.mapping-preview { margin-bottom: 22px; border-top: 1px solid var(--line); }
.mapping-preview > div { display: grid; grid-template-columns: 104px 1fr; gap: 15px; padding: 10px 0; border-bottom: 1px solid var(--line); }
.mapping-preview code { color: var(--accent); font-size: 8px; }
.mapping-preview output { overflow: hidden; color: var(--ink-soft); font-size: 9px; line-height: 1.45; text-overflow: ellipsis; white-space: nowrap; }
.mapping-preview > div[data-mapped="false"] output { color: #9a8379; font-style: italic; }
.publish-gates { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 0 0 25px; padding: 0; list-style: none; }
.publish-gates li { padding: 11px 12px; border: 1px solid var(--line); color: #8a766f; background: rgba(255,255,255,.22); font-size: 9px; }
.publish-gates li[data-passed="true"] { color: #496c57; border-color: rgba(73,108,87,.25); }
.worker-progress { display: grid; grid-template-columns: 160px 1fr; align-items: center; gap: 12px; margin: -8px 0 20px; }
.worker-progress[hidden] { display: none; }
.worker-progress progress { width: 100%; height: 5px; border: 0; border-radius: 999px; overflow: hidden; background: rgba(22,35,31,.1); accent-color: #60866e; }
.worker-progress progress::-webkit-progress-bar { background: rgba(22,35,31,.1); }
.worker-progress progress::-webkit-progress-value { background: #60866e; }
.worker-progress span { color: var(--ink-soft); font: 500 8px/1.4 ui-monospace, monospace; }
.candidate-actions { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 15px; margin: 0 0 14px; padding: 13px; border: 1px solid rgba(73,108,87,.25); background: rgba(73,108,87,.055); }
.candidate-actions[hidden] { display: none; }
.candidate-actions p { display: grid; gap: 4px; margin: 0; color: var(--ink-soft); font-size: 8px; }
.candidate-actions strong { overflow: hidden; color: var(--ink); font: 600 8px/1.3 ui-monospace, monospace; text-overflow: ellipsis; white-space: nowrap; }
.release-controls { display: flex; align-items: center; gap: 12px; margin: 0 0 16px; }
.release-history-summary { color: var(--ink-soft); font: 500 8px/1.4 ui-monospace, monospace; }
.source-panel-note { max-width: 530px; margin: 18px 0 0; color: var(--ink-soft); font-size: 9px; line-height: 1.65; }
.source-wizard-message { min-height: 42px; margin: 0 clamp(28px, 5vw, 64px); padding: 14px 0; color: var(--ink-soft); font: 500 9px/1.5 ui-monospace, monospace; }
.source-wizard-message[data-tone="success"] { color: #496c57; }
.source-wizard-message[data-tone="error"] { color: #a34e37; }

[data-scene="diagonal"] .orbit-guide, [data-scene="diagonal"] .scene-center { opacity: 0; }
[data-scene="diagonal"] .memory-scene { transform-style: preserve-3d; }
[data-scene="diagonal"][data-preview-visible="true"] .memory-scene { transform-style: flat; }
[data-scene="diagonal"] .memory-card { animation: diagonal-flow 38s linear infinite; animation-delay: var(--delay); }
[data-paused="true"][data-scene="diagonal"] .memory-card { animation-play-state: paused; }
[data-motion="limited"] .memory-card:nth-child(n+13) { display: none; }
[data-motion="limited"][data-scene="diagonal"] .memory-card { animation: none !important; transform: translate3d(calc((var(--grid-x) - var(--grid-center-x)) * 15vw), calc((var(--grid-y) - var(--grid-center-y)) * 13vh), 0) rotate(calc((var(--grid-x) - var(--grid-center-x)) * 2deg)) scale(.82); opacity: .82; }
[data-motion="limited"] .scene-controls p, [data-motion="reduced"] .scene-controls p { display: none; }
[data-motion="reduced"] .memory-card { animation: none !important; transform: translate3d(calc((var(--grid-x) - var(--grid-center-x)) * 15vw), calc((var(--grid-y) - var(--grid-center-y)) * 13vh), 0) rotate(calc((var(--grid-x) - var(--grid-center-x)) * 2deg)) scale(.82); opacity: .82; }
[data-motion="reduced"] .orbit-guide, [data-motion="reduced"] .scene-center { display: none; }

@keyframes diagonal-flow {
  0% { transform: translate3d(-70vw, calc(-33vh + var(--diagonal-offset-y)), -620px) rotateY(57deg) rotateZ(-13deg) scale(.43); opacity: 0; }
  4% { transform: translate3d(-62vw, calc(-29vh + var(--diagonal-offset-y)), -520px) rotateY(48deg) rotateZ(-12deg) scale(.5); opacity: .2; }
  20% { transform: translate3d(-38vw, calc(-19vh + var(--diagonal-offset-y)), -255px) rotateY(29deg) rotateZ(-9deg) scale(.69); opacity: .63; }
  41% { transform: translate3d(-8vw, calc(-5vh + var(--diagonal-offset-y)), 85px) rotateY(9deg) rotateZ(-6deg) scale(.95); opacity: .94; }
  52% { transform: translate3d(8vw, calc(3vh + var(--diagonal-offset-y)), 245px) rotateY(-2deg) rotateZ(-4deg) scale(1.14); opacity: 1; }
  65% { transform: translate3d(27vw, calc(13vh + var(--diagonal-offset-y)), 40px) rotateY(-15deg) rotateZ(-2deg) scale(.88); opacity: .82; }
  82% { transform: translate3d(53vw, calc(26vh + var(--diagonal-offset-y)), -350px) rotateY(-36deg) rotateZ(3deg) scale(.59); opacity: .4; }
  90% { transform: translate3d(68vw, calc(33vh + var(--diagonal-offset-y)), -590px) rotateY(-50deg) rotateZ(6deg) scale(.45); opacity: 0; }
  91%, 100% { transform: translate3d(-70vw, calc(-33vh + var(--diagonal-offset-y)), -620px) rotateY(57deg) rotateZ(-13deg) scale(.43); opacity: 0; }
}

@keyframes preview-lift {
  0% { transform: scale(var(--role-scale)) translate3d(0,0,0) rotateZ(0); box-shadow: 0 13px 28px rgba(33,37,34,.18), 0 2px 4px rgba(33,37,34,.1); }
  58% { transform: scale(calc(var(--role-scale) * 1.275)) translate3d(0,-6px,96px) rotateZ(-.5deg); box-shadow: 0 28px 58px rgba(25,31,28,.25), 0 2px 5px rgba(25,31,28,.14); }
  100% { transform: scale(calc(var(--role-scale) * 1.24)) translate3d(0,-4px,86px) rotateZ(-.35deg); box-shadow: 0 24px 52px rgba(25,31,28,.24), 0 2px 5px rgba(25,31,28,.14); }
}

@media (max-width: 900px) {
  .masthead { padding: 0 18px; grid-template-columns: 1fr auto; }
  .source-state { display: none; }
  .intro { left: 20px; top: 40px; max-width: 82vw; }
  .intro-copy { display: none; }
  .scene-shell { transform: scale(.88); }
  .metadata-card { width: min(218px, calc(100vw - 32px)); }
  .scene-controls { left: 18px; right: 18px; bottom: 30px; flex-wrap: wrap; }
  .scene-controls p, .entry-cue { display: none; }
  .memory-card { --card-width: clamp(88px, 19vw, 130px); }
  .atelier-layout { grid-template-columns: minmax(230px, .65fr) minmax(390px, 1.35fr); gap: 35px; }
  .atelier-copy h2 { font-size: 47px; }
  .atelier-format-stage { min-height: 610px; padding-inline: 30px; }
  .collection-heading { grid-template-columns: 1.2fr .8fr; }
  .collection-kicker { grid-column: 1 / -1; }
  .collection-stage { grid-template-columns: 190px minmax(0, 1fr); gap: 35px; }
  [data-archive-view="stamp"] .collection-items { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  [data-archive-view="ticket"] .collection-items { grid-template-columns: 1fr; }
  [data-archive-view="book"] .collection-items { grid-template-columns: repeat(4, minmax(66px, 1fr)); }
  [data-archive-view="mixed"] .collection-items { grid-template-columns: repeat(4, minmax(66px, 1fr)); }
  [data-archive-view="mixed"] .collection-item[data-object="ticket"] { grid-column: span 4; }
}

@media (max-width: 620px) {
  .masthead { height: 64px; }
  .wordmark { font-size: 9px; }
  .hero { min-height: calc(100svh - 64px); }
  .intro { top: 26px; }
  .intro h1 { font-size: 31px; }
  .eyebrow { margin-bottom: 12px; }
  .scene-shell { transform: translateY(6vh) scale(.74); }
  .metadata-card { width: min(210px, calc(100vw - 28px)); padding: 12px; }
  .metadata-caption { min-height: 0; margin: 8px 0; }
  .metadata-card dl { display: none; }
  .scene-controls { bottom: 17px; gap: 9px 14px; }
  .archive-branch { font-size: 7px; }
  .atelier { padding: 0 20px 38px; }
  .atelier-header { grid-template-columns: 1fr auto; }
  .atelier-header p { display: none; }
  .atelier-release-id { max-width: 130px; }
  .atelier-layout { display: block; min-height: 0; padding: 40px 0 15px; }
  .atelier-copy h2 { font-size: 41px; }
  .atelier-intro { margin: 22px 0 28px; }
  .atelier-memory-meta { margin-bottom: 35px; }
  .atelier-format-stage { min-height: 580px; padding: 42px 18px 35px; }
  .atelier-format-stage::before { right: 12px; top: 13px; }
  .atelier-format-copy { margin-top: 30px; }
  .atelier-object[data-object="stamp"] { --object-w: min(260px, 68vw); }
  .atelier-object[data-object="ticket"] { --object-w: min(320px, 78vw); }
  .atelier-object[data-object="book"] { --object-w: min(210px, 55vw); }
  .archive-dialog-layout { grid-template-columns: 1fr; min-height: auto; padding: 4px 22px 45px; gap: 35px; }
  .archive-dialog[data-archive-kind="book"] { width: calc(100vw - 20px); max-height: calc(100svh - 20px); }
  .book-reader { min-height: calc(100svh - 68px); padding: 4px 16px 24px; }
  .book-reader-header { display: block; padding-bottom: 16px; }
  .book-reader-title { font-size: 27px; }
  .book-rebind-button { margin-top: 0; }
  .book-reader-actions { margin-top: 16px; }
  .book-reader-stage { min-height: 465px; padding: 25px 0 20px; perspective: 1100px; }
  .book-reader-shell { width: min(78vw, 380px); aspect-ratio: .72; }
  .book-spread { grid-template-columns: 1fr; transform: translateX(5%) scale(.88); }
  [data-book-state="open"] .book-spread { transform: translateX(0) scale(1); }
  .book-page { padding: 29px 25px 43px; border-radius: 6px; }
  .book-page--left { box-shadow: 0 22px 45px rgba(33,38,34,.16); }
  .book-page--measure { inset: 0; }
  .book-cover { left: 0; width: 100%; padding: 20px 20px 27px 37px; }
  [data-book-state="open"] .book-cover { left: 0; opacity: 0; transform: translateX(-18%) rotateY(-104deg); }
  .book-cover-image { height: 65%; }
  .book-navigation { grid-template-columns: auto 1fr 36px auto 36px; gap: 8px; }
  .book-close-cover { padding-inline: 11px; }
  .book-turning-page { left: 0; width: 100%; transform-origin: center center; }
  .archive-object[data-object="stamp"] { --object-w: min(270px, 70vw); }
  .archive-object[data-object="ticket"] { --object-w: min(330px, 78vw); }
  .archive-object[data-object="book"] { --object-w: min(220px, 58vw); }
  .archive-copy { max-width: none; }
  .archive-editorial { padding: 55px 22px 32px; background-position: 0, 0; }
  .archive-editorial-header { display: block; margin-bottom: 40px; }
  .archive-editorial-header h3 { margin: 12px 0; }
  .archive-editorial-source { display: block; }
  .archive-editorial-body { display: block; }
  .editorial-block { margin-bottom: 28px; }
  .editorial-heading { margin-top: 40px; }
  .editorial-quote { padding-left: 18px; }
  .editorial-image, .editorial-image:nth-of-type(even) { margin: 38px 0; transform: rotate(-.6deg); }
  .editorial-image-visual { min-height: 240px; }
  .archive-editorial-footer { display: block; margin-top: 45px; }
  .archive-editorial-footer p { margin-top: 8px; text-align: left; }
  .source-dialog--wizard { width: calc(100vw - 20px); max-height: calc(100svh - 20px); }
  .source-wizard-header { display: block; margin: 0 22px 24px; }
  .connection-badge { display: inline-block; margin-top: 16px; }
  .source-wizard-layout { display: block; margin: 0 22px; }
  .source-wizard-steps { flex-direction: row; padding: 10px 0; overflow-x: auto; border-right: 0; border-bottom: 1px solid var(--line); }
  .source-wizard-steps button { flex: 0 0 94px; grid-template-columns: 25px 1fr; min-height: 37px; }
  .source-wizard-panels { padding: 25px 0 32px; }
  .connection-summary, .publish-gates { grid-template-columns: 1fr; }
  .source-secondary { display: block; margin: 8px 0 0; }
  .mapping-preview > div { grid-template-columns: 82px 1fr; }
  .source-wizard-message { margin: 0 22px; }
  .collection { padding: 65px 20px 36px; }
  .collection-heading { display: block; margin-bottom: 45px; }
  .collection-kicker { margin: 0 0 20px; }
  .collection-heading h2 { font-size: 42px; }
  .collection-intro { margin-top: 23px; }
  .collection-toolbar { display: block; overflow: visible; }
  .collection-actions { flex-wrap: wrap; gap: 10px 17px; }
  .collection-sort-menu { flex-basis: 100%; }
  .collection-sort-menu fieldset { width: min(260px, calc(100vw - 40px)); }
  .collection-release-state { margin-top: 9px; }
  .collection-stage { display: block; min-height: 0; padding: 38px 0 50px; }
  .collection-stage-copy { position: static; margin-bottom: 36px; }
  [data-archive-view="stamp"] .collection-items { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  [data-archive-view="ticket"] .collection-item { grid-template-columns: 39% 1fr 29px; min-height: 118px; padding: 10px; }
  [data-archive-view="ticket"] .collection-thumb { min-height: 96px; }
  [data-archive-view="ticket"] .collection-item-copy { padding: 8px 11px; }
  [data-archive-view="ticket"] .collection-item-copy strong { font-size: 14px; }
  [data-archive-view="ticket"] .collection-item::after { right: 28px; }
  [data-archive-view="book"] .collection-items { grid-template-columns: repeat(3, minmax(64px, 1fr)); gap: 13px; }
  [data-archive-view="mixed"] .collection-items { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 17px 13px; }
  [data-archive-view="mixed"] .collection-item[data-object="film"],
  [data-archive-view="mixed"] .collection-item[data-object="stamp"],
  [data-archive-view="mixed"] .collection-item[data-object="ticket"] { grid-column: span 2; }
  [data-archive-view="mixed"] .collection-item[data-object="book"] { grid-column: span 1; min-width: 0; }
  [data-archive-view="mixed"] .collection-item[data-object="ticket"] { grid-template-columns: 42% 1fr 27px; min-height: 112px; }
  [data-archive-view="mixed"] .collection-item[data-object="ticket"] .collection-thumb { min-height: 90px; }
  [data-archive-view="mixed"] .collection-item[data-object="ticket"] .collection-item-copy { padding: 8px 9px; }
  [data-archive-view="mixed"] .collection-item[data-object="ticket"]::after { right: 26px; }
  .collection-footnote { display: block; }
  .collection-footnote p { margin-top: 8px; text-align: left; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
  [data-book-state="open"] .book-cover { display: none; }
}