:root { --ink:#24211f; --plum:#372631; --red:#a7443b; --paper:#f7f7f5; --mono:ui-monospace,SFMono-Regular,Consolas,monospace; --ui:-apple-system,BlinkMacSystemFont,'Segoe UI',Inter,Roboto,Helvetica,Arial,sans-serif; }
* { box-sizing:border-box; }
body { margin:0; background:var(--plum) url('assets/plum-bookcloth.png') center/660px; color:var(--ink); font-family:Baskerville,'Iowan Old Style','Palatino Linotype','Times New Roman',serif; }
button,input,textarea,select { font:inherit; }
[hidden] { display:none!important; }
button,a { -webkit-tap-highlight-color:transparent; }
button { cursor:pointer; }
button:disabled { cursor:default; opacity:.35; }
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,[tabindex]:focus-visible { outline:3px solid #a9453c; outline-offset:4px; }
.skip { position:absolute;left:16px;top:-100px;z-index:40;background:white;padding:12px; }
.skip:focus { top:8px; }

/* ---------- the book: taller stage (1536 x 1204, paper bottom edge at 93.7%) ---------- */
.stage { position:relative;container-type:inline-size;width:min(100%,1536px);aspect-ratio:1536/1204;margin:auto;background:url('assets/candidates/book-stage.tall-01.png') center/100% 100% no-repeat; }
.stage.blocked > :not(.masthead):not(.stage-notice) { visibility:hidden; }
 /* a slip of the book's own paper, laid on the empty right page */
.stage-notice { position:absolute;left:57.5%;top:22%;width:29%;z-index:12;transform:rotate(-1.3deg);background:#f6f3ec;padding:2.1cqw 2.1cqw 1.9cqw;box-shadow:.1cqw .4cqw .9cqw #44372b33,0 .05cqw .15cqw #44372b26;color:var(--ink);font-family:Baskerville,'Iowan Old Style','Palatino Linotype','Times New Roman',serif; }
.stage-notice::before { content:'A note from the diary';display:block;font:.58cqw var(--mono);letter-spacing:.17em;text-transform:uppercase;color:#68635f;padding-bottom:.7cqw;margin-bottom:1.1cqw;border-bottom:1px solid #7775; }
.stage-notice[data-kind=loading]::before { content:'One moment'; }
.stage-notice[data-kind=error]::before { content:'Something went wrong';color:var(--red); }
.stage-notice::after { content:'';position:absolute;right:1.6cqw;top:-.55cqw;width:2.6cqw;height:1.1cqw;background:#e9e2d3cc;transform:rotate(-4deg);box-shadow:0 .05cqw .12cqw #0002; }
.stage-notice p { margin:0;font-size:1.45cqw;line-height:1.3;text-wrap:pretty; }
.stage-notice .form-actions { justify-content:flex-start;margin-top:1.4cqw;gap:.8cqw; }
.stage-notice .form-actions button { font:.62cqw var(--mono);letter-spacing:.14em;text-transform:uppercase;padding:.75cqw 1.25cqw;min-height:2.6cqw;border:1px solid var(--plum);background:#fff;color:var(--ink); }
.stage-notice .form-actions .primary { background:var(--plum);color:#fff; }
.stage-notice[data-kind=loading] p::after { content:'';display:inline-block;width:.5cqw;height:.5cqw;margin-left:.5cqw;border-radius:50%;background:#c75147;vertical-align:middle;animation:notice-pulse 1.2s ease-in-out infinite; }
@keyframes notice-pulse { 0%,100% { opacity:.25 } 50% { opacity:1 } }
.masthead { position:absolute;inset:0 4% auto;display:flex;align-items:center;justify-content:space-between;height:4.25%;color:#f4e9ec;z-index:10; }
.masthead button { border:0;background:none;color:inherit;min-height:44px;padding:0 5px; }
.wordmark { font-size:1.9cqw;letter-spacing:-.02em; }
.top-links { display:flex;align-items:center;gap:1.7cqw;font-size:1.05cqw; }
.live-date { display:flex;align-items:center;gap:8px;font:.67cqw var(--mono);letter-spacing:.05em; }
.live-date i { height:6px;width:6px;border-radius:50%;background:#c75147; }
.save-status { font:.62cqw var(--mono);letter-spacing:.08em;text-transform:uppercase;color:#e6dce0;min-width:7cqw;text-align:right;white-space:nowrap; }
.save-status[data-kind=saving],.save-status[data-kind=loading] { color:#e9d9a8; }
.save-status[data-kind=saved] { color:#cfe3c7; }
.save-status[data-kind=failed] { color:#f3b1a8;font-weight:700; }
.save-status:empty { display:none; }

/* ---------- story column ---------- */
.story { position:absolute;left:9.8%;top:8.2%;width:34.5%;height:46.5%;z-index:2;display:flex;flex-direction:column; }
.story > * { flex:none; }
.date,.eyebrow,.sample-label { font-size:.7cqw;letter-spacing:.17em;text-transform:uppercase;line-height:1.4; }
.date { margin:0 0 1cqw; }
.eyebrow { font-size:.62cqw;letter-spacing:.08em;margin:0; }
h1 { font-weight:400;letter-spacing:-.027em;font-size:3.4cqw;line-height:1.07;margin:1.9cqw 0 1.3cqw;max-width:33cqw;text-wrap:pretty; }
.body-copy { flex:0 1 auto;min-height:0;overflow:hidden;max-width:26cqw; }
.story.clipped .body-copy { -webkit-mask-image:linear-gradient(#000 calc(100% - 2.6cqw),transparent);mask-image:linear-gradient(#000 calc(100% - 2.6cqw),transparent); }
.body-copy p { font-size:1.45cqw;line-height:1.22;margin:0 0 .9cqw;white-space:pre-line; }
.story-tools { display:flex;flex-wrap:wrap;gap:.4cqw 1.4cqw;margin:.3cqw 0 0; }
.continue { background:none;border:0;padding:0;color:var(--red);font-style:italic;font-size:1.05cqw;line-height:1.3;text-align:left; }
.narrator { font-size:1.45cqw;line-height:1.25;font-style:italic;margin:1cqw 0 0;max-width:31cqw; }
.sample-label { border-top:1px solid #7775;padding-top:.7cqw;margin:1cqw 0 0;font-size:.55cqw;color:#68635f;max-width:25cqw; }

/* ---------- media: mounted on a page, or printed across the spread ---------- */
.media { position:absolute;margin:0;z-index:3;--l:44.5;--w:50.3;--t:7.3;left:calc(var(--l)*1%);width:calc(var(--w)*1%);top:calc(var(--t)*1%); }
.print { background:#fbfbf8;padding:.75cqw .75cqw .9cqw;box-shadow:.1cqw .45cqw 1.1cqw #27192133,0 .05cqw .15cqw #27192126; }
.print img { display:block;width:100%;height:auto; }
.print img.pending { min-height:12cqw;background:#e9e5de; }
.print figcaption { font:.56cqw var(--mono);letter-spacing:.06em;margin:.55cqw 0 0;color:#3b3531; }
.media[data-placement=page] .print { transform:rotate(-.6deg); }
.media[data-placement=spread] { --gl:calc((50 - var(--l)) / var(--w));--gr:calc(1 - var(--gl));--s:.05; }
.media[data-placement=spread] .sizer { visibility:hidden;position:relative; }
.part { position:absolute;top:0;bottom:0;overflow:hidden; }
.part .print { position:absolute;top:0;transform:none; }
.part.lf { left:0;width:calc((var(--gl) - var(--s))*100%); }
.part.lf .print { left:0;width:calc(100% / (var(--gl) - var(--s))); }
.part.lc { left:calc((var(--gl) - var(--s))*100%);width:calc(var(--s)*100%); }
.part.lc .print { width:calc(100% / var(--s));left:calc(-100% * (var(--gl) - var(--s)) / var(--s)); }
.part.rc { left:calc(var(--gl)*100%);width:calc(var(--s)*100%); }
.part.rc .print { width:calc(100% / var(--s));left:calc(-100% * var(--gl) / var(--s)); }
.part.rf { left:calc((var(--gl) + var(--s))*100%);width:calc((var(--gr) - var(--s))*100%); }
.part.rf .print { width:calc(100% / (var(--gr) - var(--s)));left:calc(-100% * (var(--gl) + var(--s)) / (var(--gr) - var(--s))); }
.warp { position:absolute;inset:0; }
.part.lc .warp { transform-origin:left center;transform:perspective(700px) rotateY(22deg) scaleX(1.12); }
.part.rc .warp { transform-origin:right center;transform:perspective(700px) rotateY(-22deg) scaleX(1.12); }
.part.lc::after,.part.rc::after { content:'';position:absolute;inset:0;pointer-events:none; }
.part.lc::after { background:linear-gradient(to right,transparent 0,#1a0e1420 55%,#1a0e1478 100%); }
.part.rc::after { background:linear-gradient(to left,transparent 0,#1a0e1418 60%,#1a0e1460 100%),linear-gradient(to right,#ffffff80 0,transparent 8%); }

/* ---------- quote pocket ---------- */
.pocket { position:absolute;left:5.7%;top:53.2%;width:30%;aspect-ratio:4/3;z-index:5; }
.negative { position:absolute;left:21%;top:17%;width:64%;height:17%;background:#141414;transform:rotate(-2.5deg);padding:.5cqw .45cqw;box-shadow:0 .1cqw .25cqw #0005;overflow:hidden; }
.negative::before,.negative::after { content:'';height:.28cqw;left:3%;right:3%;position:absolute;background:repeating-linear-gradient(90deg,#d2cdc4 0 .42cqw,transparent .42cqw .72cqw); }
.negative::before { top:.11cqw; }.negative::after { bottom:.11cqw; }
.negative img { width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.15);opacity:.85; }
.second-sheet { position:absolute;left:22%;top:31%;width:50%;height:36%;background:#ece9e2;transform:rotate(3deg);box-shadow:0 .1cqw .3cqw #00000022; }
.pocket-material { position:absolute;inset:0;width:100%;height:100%;opacity:.66;pointer-events:none; }
.pocket blockquote { position:absolute;left:18%;top:36%;width:52%;min-height:38%;background:#f6f3ec;transform:rotate(-1.5deg);box-shadow:.1cqw .3cqw .5cqw #44372b33;margin:0;padding:1.5cqw .7cqw 1.1cqw;text-align:center; }
.pocket blockquote p { font:1.05cqw/1.3 var(--mono);letter-spacing:.04em;margin:0 0 .9cqw;overflow-wrap:anywhere; }
.pocket cite { font:.5cqw var(--mono);letter-spacing:.1em;font-style:normal;text-transform:uppercase; }

/* ---------- annotation accent ---------- */
.accent { position:absolute;z-index:6;font-size:1.15cqw;font-style:italic;line-height:1.2;transform:rotate(3deg);white-space:nowrap;color:#2c2622; }
.accent[data-at=quote] { left:34.8%;top:61.2%; }
.accent[data-at=transcript] { left:37.5%;top:74%;transform:rotate(-3deg); }
.accent[data-at=media] { left:40%;top:57%; }

/* ---------- the screen: a computer display showing the saved conversation ---------- */
.screen { position:absolute;z-index:4;left:52%;top:7.3%;width:43%;height:58.1%;font-family:var(--ui);color:#1f1d1c; }
.screen-bezel { position:relative;width:100%;height:100%;background:#2a2829;border-radius:1cqw;padding:1.1cqw .9cqw .9cqw;box-shadow:0 .25cqw .6cqw #1a10152e,0 .9cqw 1.8cqw #1a101540,inset 0 0 0 .08cqw #4a4648,inset 0 .1cqw 0 #5a5658; }
.screen-camera { position:absolute;left:50%;top:.42cqw;width:.3cqw;height:.3cqw;border-radius:50%;background:#0d0c0c;box-shadow:inset 0 0 0 .06cqw #3d3a3c,0 0 .12cqw #7a7577;transform:translateX(-50%); }
.window { height:100%;display:flex;flex-direction:column;background:#f6f5f2;border-radius:.35cqw;overflow:hidden;box-shadow:inset 0 0 0 1px #c9c4bc; }
.window-bar { display:flex;align-items:center;gap:.8cqw;padding:.5cqw .8cqw;background:#e7e4df;border-bottom:1px solid #c9c4bc; }
.traffic { display:flex;gap:.35cqw;flex:none; }
.traffic i { width:.62cqw;height:.62cqw;border-radius:50%;display:block; }
.traffic i:nth-child(1) { background:#ec6a5e; }.traffic i:nth-child(2) { background:#f4bf4f; }.traffic i:nth-child(3) { background:#61c554; }
.window-title { flex:1 1 auto;min-width:0;text-align:center; }
.window-title h2 { margin:0;font:600 .72cqw/1.3 var(--ui);letter-spacing:.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.t-source { margin:.1cqw 0 0;font:.58cqw/1.3 var(--ui);color:#6b655f;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
#expand-chat { flex:none;border:1px solid #b9b2a8;background:#fbfaf8;color:#1f1d1c;padding:.3cqw .7cqw;border-radius:.3cqw;font:500 .62cqw var(--ui);min-height:2cqw; }
#expand-chat:hover { background:#fff; }
.t-scroll { flex:1 1 auto;min-height:0;overflow-y:scroll;overscroll-behavior:contain;padding:.9cqw 1cqw;scrollbar-width:thin;scrollbar-color:#8d847c #e7e2d9;scrollbar-gutter:stable; }
.t-scroll::-webkit-scrollbar { width:.55cqw; }.t-scroll::-webkit-scrollbar-thumb { background:#9a938b;border-radius:1cqw;border:.12cqw solid #e7e2d9; }.t-scroll::-webkit-scrollbar-track { background:#e7e2d9; }
.messages { list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.9cqw; }
.msg { display:flex;gap:.6cqw;align-items:flex-start;max-width:88%; }
.msg[data-side=me] { align-self:flex-end;flex-direction:row-reverse; }
.msg[data-side=source] { max-width:100%; }
.avatar { flex:none;width:1.7cqw;height:1.7cqw;border-radius:50%;background:#2a2829;color:#fff;font:600 .72cqw/1.7cqw var(--ui);text-align:center;margin-top:.1cqw; }
.msg[data-side=me] .avatar { background:#6b4e7a; }
.msg[data-side=source] .avatar { background:#8d847c; }
.bubble { min-width:0;background:#fff;border:1px solid #dcd7cf;border-radius:.7cqw;padding:.55cqw .85cqw .6cqw;box-shadow:0 .08cqw .2cqw #2a28290d; }
.msg[data-side=me] .bubble { background:#ebe3f2;border-color:#d8cce2;border-top-right-radius:.2cqw; }
.msg[data-side=them] .bubble { border-top-left-radius:.2cqw; }
.msg[data-side=source] .bubble { background:#fbfaf8; }
.who { display:block;font:600 .6cqw/1.3 var(--ui);color:#4d4743;margin:0 0 .25cqw; }
.msg .text p { margin:0 0 .5cqw;font:.86cqw/1.45 var(--ui);white-space:pre-wrap;overflow-wrap:anywhere; }
.msg .text p:last-child { margin-bottom:0; }
.msg pre { margin:.4cqw 0 .5cqw;padding:.55cqw .7cqw;background:#2a2829;color:#eae6e0;border-radius:.35cqw;font:.72cqw/1.45 var(--mono);white-space:pre-wrap;overflow-wrap:anywhere; }
.msg-empty { font:.86cqw/1.5 var(--ui);color:#6b655f;padding:1cqw;background:#fbfaf8;border:1px dashed #c9c4bc;border-radius:.5cqw; }
.composer { display:flex;align-items:center;gap:.6cqw;padding:.55cqw .8cqw;border-top:1px solid #c9c4bc;background:#eeebe6; }
.composer-field { flex:1 1 auto;background:#fbfaf8;border:1px solid #d6d1c9;border-radius:1cqw;padding:.4cqw .9cqw;font:.62cqw/1.3 var(--ui);color:#8d847c; }
.screen.empty #expand-chat { display:none; }

/* ---------- receipts ---------- */
.receipts { position:absolute;left:51.4%;top:61.9%;width:23.5%;z-index:6; }
.receipts h2 { font-weight:400;font-style:italic;font-size:1.13cqw;margin:0 0 1cqw; }
.receipt-row { display:grid;grid-template-columns:repeat(3,1fr);gap:.65cqw; }
.receipt { background:#f8f8f5;border:1px solid #a49d9366;box-shadow:0 .1cqw .25cqw #3331;padding:.35cqw;color:var(--ink);height:10.1cqw;display:flex;flex-direction:column;gap:.5cqw; }
.receipt-inner { display:flex;align-items:center;justify-content:center;height:calc(100% - 1.2cqw);width:100%;background:#e8e7e3;box-shadow:inset 0 0 0 1px #aaa4;overflow:hidden;font:.55cqw var(--mono);color:#666; }
.receipt-inner img { width:100%;height:100%;object-fit:contain;background:#f2f2f0; }
.receipt-caption { font-size:.49cqw;letter-spacing:.025em;white-space:nowrap; }

/* ---------- incident report ---------- */
.incident { position:absolute;left:75.2%;top:53.2%;width:24%;aspect-ratio:1605/1235;z-index:7;transform:rotate(2deg); }
.incident>img { display:block;width:100%;height:100%; }
.incident-words { position:absolute;left:9%;right:9%;top:14%;bottom:12%; }
.department { font:.5cqw var(--mono);letter-spacing:.1em;text-transform:uppercase;white-space:nowrap;margin:0 0 .3cqw; }
.incident h2 { font-size:1.25cqw;font-weight:600;letter-spacing:.05em;text-transform:uppercase;margin:0 0 .55cqw; }
.incident dl { margin:0;font:.62cqw/1.3 var(--mono);border:1px solid #6b655f; }
.incident dl div { display:flex;border-top:1px solid #6b655f;min-height:1.75cqw;align-items:center; }
.incident dl div:first-child { border-top:0; }
.incident dl .stamp-row { min-height:2.4cqw; }
.incident dt { width:27%;padding:.25cqw .3cqw .25cqw .45cqw;text-transform:uppercase;letter-spacing:.05em; }
.incident dt::after { content:':'; }
.incident dd { width:73%;margin:0;border-left:1px solid #6b655f;padding:.25cqw .4cqw;overflow-wrap:anywhere; }
.stamp { position:absolute;right:2%;bottom:3.1cqw;border:.18cqw solid #ad4a3d;color:#ad4a3d;font:bold 1.45cqw/1 var(--mono);letter-spacing:.04em;padding:.22cqw .4cqw;transform:rotate(-8deg);margin:0;text-transform:uppercase;box-shadow:inset 0 0 0 .06cqw #ad4a3d;opacity:.92; }
.filed { position:absolute;right:3%;bottom:0;font-size:.85cqw;font-style:italic;margin:0;white-space:nowrap; }
.filed span { text-decoration:underline; }
/* the same card at any size (library tiles and previews): sizes relative to the card itself */
.incident.card-scaled { position:relative;left:auto;top:auto;width:100%;transform:none;container-type:inline-size;font-family:Baskerville,'Iowan Old Style','Palatino Linotype','Times New Roman',serif;color:var(--ink); }
.incident.card-scaled .department,.incident.card-scaled h2,.incident.card-scaled dt,.incident.card-scaled dd,.incident.card-scaled .filed { color:var(--ink); }
.incident.card-scaled .stamp { color:#ad4a3d; }
.incident.card-scaled .incident-words { left:9%;right:9%;top:14%;bottom:12%; }
.incident.card-scaled .department { font-size:max(6px,1.9cqw);margin-bottom:1.4cqw; }
.incident.card-scaled h2 { font-size:4.6cqw;margin-bottom:2cqw; }
.incident.card-scaled dl { font-size:max(7px,2.5cqw); }
.incident.card-scaled dl div { min-height:6.6cqw; }
.incident.card-scaled dl .stamp-row { min-height:9.5cqw; }
.incident.card-scaled dt,.incident.card-scaled dd { padding:1cqw 1.2cqw; }
.incident.card-scaled .stamp { font-size:5.6cqw;border-width:.7cqw;padding:1cqw 1.5cqw;bottom:12.5cqw;right:3%; }
.incident.card-scaled .filed { font-size:max(7px,3.2cqw);bottom:0; }

/* ---------- footer ---------- */
.page-footer { position:absolute;left:3.6%;right:3.6%;bottom:.5%;display:flex;justify-content:space-between;align-items:center;color:#f4e9ec;font:.66cqw var(--mono);letter-spacing:.14em;text-transform:uppercase; }
.page-footer button { min-width:130px;min-height:44px;background:none;color:inherit;border:0;padding:0; }
.page-footer button:first-child { text-align:left; }.page-footer button:last-child { text-align:right; }
#page-number { color:#5a5047;position:absolute;left:50%;transform:translate(-50%,-4.3cqw);white-space:nowrap;font-size:.62cqw;letter-spacing:.1em; }
.proof-note { color:#e6dce0;font:11px/1.6 system-ui,sans-serif;text-align:center;margin:0 auto 18px;padding:8px 18px; }.proof-note a { color:inherit; }

/* ---------- entry layouts (desktop composition on the taller stage) ---------- */
.stage[data-layout=story] .media[data-size=medium] { --l:46.5;--w:46; }
.stage[data-layout=story] .media[data-size=small] { --l:48;--w:40; }
.stage[data-layout=story] .media[data-placement=page] { --l:51.5;--w:43.5; }
.stage[data-layout=story] .media[data-placement=page][data-size=medium] { --w:38; }
.stage[data-layout=story] .media[data-placement=page][data-size=small] { --w:30; }
.stage[data-layout=story] .screen { display:none; }

.stage[data-layout=conversation] .story { height:44%; }
.stage[data-layout=conversation] .media { --l:8.5;--w:28;--t:53; }
.stage[data-layout=conversation] .media[data-size=small] { --w:24; }
.stage[data-layout=conversation] .pocket,.stage[data-layout=conversation] .accent[data-at=quote] { display:none; }
.stage[data-layout=conversation] .screen { left:52%;top:7.3%;width:43%;height:58.1%; }
.stage[data-layout=conversation] .receipts { left:52%;top:68.9%;width:21%; }
.stage[data-layout=conversation] .receipt { height:9cqw; }
.stage[data-layout=conversation] .incident { left:75.5%;top:68.1%;width:21.5%; }

.stage[data-layout=comic] .media { --l:10;--w:80;--t:7.3; }
.stage[data-layout=comic] .media[data-size=medium] { --l:14;--w:72; }
.stage[data-layout=comic] .media[data-size=small] { --l:18;--w:64; }
.stage[data-layout=comic] .print img { aspect-ratio:2.4/1;object-fit:cover; }
.stage[data-layout=comic] .story { top:58.1%;height:28.2%; }
.stage[data-layout=comic] h1 { font-size:2.3cqw;margin:.8cqw 0 .8cqw; }
.stage[data-layout=comic] .pocket,.stage[data-layout=comic] .screen,.stage[data-layout=comic] .accent[data-at=quote] { display:none; }
.stage[data-layout=comic] .receipts { left:52%;top:59.8%;width:21%; }
.stage[data-layout=comic] .receipt { height:9cqw; }
.stage[data-layout=comic] .incident { left:75.5%;top:58.1%;width:21.5%; }

.stage[data-layout=mixed] .story { height:41.5%; }
.stage[data-layout=mixed] .pocket,.stage[data-layout=mixed] .accent[data-at=quote] { display:none; }
.stage[data-layout=mixed] .screen { left:7%;top:51.5%;width:32%;height:33.2%; }
.stage[data-layout=mixed] .media { --l:51.5;--w:43.5;--t:7.3; }
.stage[data-layout=mixed] .media[data-size=medium] { --w:38; }
.stage[data-layout=mixed] .media[data-size=small] { --w:30; }
.stage[data-layout=mixed] .receipts { left:51.4%;top:61.5%;width:23.5%; }
.stage[data-layout=mixed] .incident { left:75.2%;top:58.1%;width:24%; }
.stage[data-layout=mixed] .accent[data-at=transcript] { left:7.5%;top:86%; }

/* ---------- Library ---------- */
.library { width:min(100%,1536px);margin:auto;padding:28px 4% 60px;color:#f4e9ec;font-family:var(--ui); }
.library-head { display:flex;flex-wrap:wrap;gap:22px 40px;align-items:flex-end;justify-content:space-between;padding-bottom:22px;border-bottom:1px solid #6a5663; }
.library-back { background:none;border:0;color:#e6dce0;padding:0;min-height:44px;font:13px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase; }
.library h1 { font-family:Baskerville,'Iowan Old Style','Palatino Linotype','Times New Roman',serif;font-weight:400;font-size:44px;letter-spacing:-.02em;margin:4px 0 2px; }
.library-sub { margin:0;font-size:13px;color:#d9ccd3; }
.library-tools { display:flex;flex-wrap:wrap;gap:12px 18px;align-items:flex-end;font-size:13px; }
.library-tools label { margin:0;font-weight:500;color:#e6dce0; }
.library-tools input[type=search],.library-tools select { margin-top:5px;min-width:200px;background:#fcfcf9;color:var(--ink);border:1px solid #b7a9ac;padding:9px 12px;font-size:14px;min-height:40px; }
.library-search input { min-width:260px; }
.library-types { display:flex;border:1px solid #b7a9ac;background:#2d2028;border-radius:3px;overflow:hidden; }
.library-types button,.library-tags button,#library-clear { background:none;border:0;color:#e6dce0;padding:0 14px;min-height:40px;font-size:13px; }
.library-types button[aria-pressed=true] { background:#fcfcf9;color:var(--ink); }
.library-tags { display:flex;flex-wrap:wrap;gap:6px; }
.library-tags button { border:1px solid #b7a9ac;border-radius:20px;min-height:34px;padding:0 12px;font-size:12px; }
.library-tags button[aria-pressed=true] { background:#fcfcf9;color:var(--ink); }
#library-clear { text-decoration:underline; }
.library-state { font-size:13px;color:#d9ccd3;margin:18px 0 14px;min-height:20px; }
.library-state button { margin-left:8px;background:#fcfcf9;color:var(--ink);border:1px solid #b7a9ac;padding:6px 12px;min-height:36px; }
.library-grid { display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:28px 22px;align-items:start; }
.lib-tile { display:block;width:100%;background:none;border:0;padding:0;text-align:left;color:#f4e9ec; }
.lib-thumb { background:#fbfbf8;padding:8px 8px 10px;box-shadow:0 2px 6px #1a101566,0 12px 28px #1a101540;min-height:120px;display:flex;align-items:center;justify-content:center; }
.lib-thumb img { display:block;width:100%;height:auto;min-height:60px;background:#e9e5de; }
.lib-thumb .incident { width:100%;z-index:auto; }
.lib-tile[data-detached] .lib-thumb { opacity:.72;outline:1px dashed #b7a9ac;outline-offset:4px; }
.lib-meta { display:flex;flex-direction:column;gap:3px;padding:10px 2px 0; }
.lib-type { font:10px/1.3 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:#d9ccd3; }
.lib-name { font-size:14px;line-height:1.35;color:#fff;overflow-wrap:anywhere; }
.lib-entry { font-size:12px;color:#d9ccd3; }
.library-more { justify-content:center;margin-top:30px; }
.library-more button { background:#fcfcf9;color:var(--ink);border:1px solid #b7a9ac;padding:10px 18px;min-height:44px; }
#library-preview { width:min(94vw,1100px); }
.preview-body { display:grid;grid-template-columns:minmax(0,2fr) minmax(240px,1fr);gap:22px;align-items:start; }
.preview-figure { background:#efece6;min-height:200px;display:flex;align-items:center;justify-content:center;padding:12px; }
.preview-figure img { max-width:100%;max-height:62vh;display:block;object-fit:contain; }
.preview-figure .incident { width:min(100%,520px);z-index:auto; }
.preview-meta { margin:0;font-size:13px;line-height:1.5; }.preview-meta dt { font-weight:600;margin-top:8px; }.preview-meta dd { margin:0;overflow-wrap:anywhere;color:#4d4743; }
.preview-edit { margin-top:14px;border-top:1px solid #ccc3c7;padding-top:6px; }.preview-edit label { margin:10px 0; }.preview-edit .form-actions { justify-content:flex-start;margin-top:8px; }

/* ---------- dialogs ---------- */
dialog { width:min(92vw,680px);max-height:90dvh;overflow:auto;padding:26px;border:1px solid #b7a9ac;background:#fcfcf9;color:var(--ink);box-shadow:0 18px 65px #0004;font-family:system-ui,sans-serif; }
dialog::backdrop { background:#24111cc4;backdrop-filter:blur(3px); }
.dialog-heading { display:flex;align-items:center;justify-content:space-between;gap:16px; }.dialog-heading h2 { font:normal 28px/1.2 Baskerville,serif;margin:0 0 16px; }.dialog-heading button { width:44px;height:44px;background:none;border:0;font-size:28px;align-self:flex-start; }
.form-note { color:#5a5155;font-size:13px;line-height:1.5; }
label { display:block;font-size:13px;font-weight:600;margin:14px 0; }label small { font-weight:400;color:#6b6166;font-size:11px; }
input,textarea,select { display:block;width:100%;padding:10px;border:1px solid #b9afb2;background:white;border-radius:0;margin-top:6px;color:var(--ink);font-size:16px;font-weight:400; }
textarea { resize:vertical; }.form-pair { display:grid;grid-template-columns:1fr 1fr;gap:14px; }
.form-actions { display:flex;gap:12px;justify-content:flex-end;align-items:center;flex-wrap:wrap;margin-top:20px; }.form-actions button,.form-actions a { display:inline-flex;align-items:center;min-height:44px;padding:8px 14px;border:1px solid #b9afb2;background:#fff;color:var(--ink);font-size:14px;text-decoration:none; }.form-actions .primary { background:var(--plum);color:white;border-color:var(--plum); }
.form-error { color:#9b251b;font-size:13px; }
.check-label { display:flex;gap:10px;align-items:flex-start;font-weight:400;line-height:1.45; }
.check-label input { width:auto;margin:3px 0 0;display:inline-block; }
.check-label code { font-size:12px;background:#eee9e6;padding:1px 4px; }
.file-label input[type=file] { padding:7px;font-size:13px; }
.file-current { display:block;font-weight:400;font-size:12px;color:#5a5155;margin-top:4px; }
fieldset.transcript-fields { border:1px solid #d6cdd0;padding:4px 14px 12px;margin:16px 0; }
fieldset.transcript-fields legend { font-size:12px;letter-spacing:.08em;text-transform:uppercase;padding:0 6px;color:#5a5155; }
.recovery { background:#fff4e8;border:1px solid #e3c7a6;padding:10px 12px; }.recovery button { margin-top:6px;margin-right:6px;min-height:36px;border:1px solid #b9afb2;background:#fff;padding:6px 10px;font-size:13px; }
.conflict-actions { justify-content:flex-start;background:#fff4e8;border:1px solid #e3c7a6;padding:10px; }
.index-item { width:100%;background:none;border:0;border-top:1px solid #ccc3c7;padding:18px 2px;text-align:left;min-height:60px;font-size:18px; }.index-item small { display:block;font-size:11px;letter-spacing:.08em;margin-bottom:6px;text-transform:uppercase; }
.index-tools { border-top:1px solid #ccc3c7;margin-top:14px;padding-top:12px;font-size:14px; }.index-tools .form-actions { justify-content:flex-start;margin-top:10px; }
.moment { padding:18px 0;border-top:1px solid #ccc3c7; }.moment p { font:italic 24px/1.35 Baskerville,serif; }.moment small { font-size:12px; }
#lightbox { width:min(94vw,1200px); }#original-image { max-width:100%;max-height:65vh;display:block;margin:auto;object-fit:contain; }#original-name { font-size:12px;overflow-wrap:anywhere; }
#reader { width:min(92vw,820px);font-family:Baskerville,'Iowan Old Style','Palatino Linotype','Times New Roman',serif; }
#reader .form-note { font-family:system-ui,sans-serif; }
#reader-body { max-height:68dvh;overflow:auto;padding:4px 10px 4px 2px;scrollbar-width:thin; }
.reader-prose p { font-size:20px;line-height:1.5;margin:0 0 18px;white-space:pre-line; }
.reader-prose .narrator { font-size:20px;margin-top:26px; }
#reader .messages { gap:16px; }#reader .msg { max-width:92%; }#reader .avatar { width:30px;height:30px;font:600 13px/30px var(--ui); }#reader .bubble { border-radius:12px;padding:10px 14px; }#reader .who { font-size:12px;margin-bottom:4px; }#reader .msg .text p { font-size:17px;line-height:1.5;margin-bottom:10px;font-family:var(--ui); }#reader .msg pre { font-size:13px;padding:10px 14px;margin:8px 0 10px;border-radius:6px; }
.login { min-height:100dvh;display:flex;align-items:center;justify-content:center;padding:24px; }
.login-card { width:min(92vw,420px);background:#fcfcf9;color:var(--ink);border:1px solid #b7a9ac;box-shadow:0 18px 65px #0005;padding:34px 30px 26px;font-family:system-ui,sans-serif; }
.login-wordmark { font-family:Baskerville,'Iowan Old Style','Palatino Linotype','Times New Roman',serif;font-size:30px;letter-spacing:-.02em;margin:0 0 6px; }
.login-card h1 { font:400 11px/1.5 var(--mono);letter-spacing:.14em;text-transform:uppercase;margin:0 0 18px;color:#5a5155; }
.login-note { font-size:14px;line-height:1.5;color:#5a5155;margin:0 0 6px; }
.login-card label { margin:12px 0; }
#edit:disabled { opacity:.45; }
.toast { position:fixed;left:50%;bottom:22px;transform:translateX(-50%);background:#fff;color:var(--ink);box-shadow:0 3px 22px #0004;padding:12px 20px;z-index:100;max-width:90vw;font:14px/1.4 system-ui,sans-serif;opacity:0;pointer-events:none;transition:opacity .15s; }.toast.shown { opacity:1; }

/* ---------- one reading column on tablets and phones ---------- */
@media (max-width:1000px) {
 body { padding:0 10px; }
 .stage { aspect-ratio:auto;display:flex;flex-direction:column;gap:28px;padding:90px 25px 30px;background-size:240% 113%;background-position:20% center;margin:0 auto;max-width:700px; }
 .stage.blocked > :not(.masthead):not(.stage-notice) { display:none; }
 .stage-notice { position:relative;left:auto;top:auto;transform:rotate(-.6deg);width:100%;margin:0;padding:22px 22px 20px; }.stage-notice::before { font-size:10px;padding-bottom:8px;margin-bottom:12px; }.stage-notice::after { right:18px;top:-7px;width:36px;height:14px; }.stage-notice p { font-size:21px; }.stage-notice .form-actions { margin-top:16px;gap:10px; }.stage-notice .form-actions button { font-size:11px;padding:10px 14px;min-height:44px; }.stage-notice[data-kind=loading] p::after { width:7px;height:7px;margin-left:7px; }
 .masthead { position:absolute;top:0;left:0;right:0;height:auto;min-height:60px;padding:6px 5px;gap:10px;color:#f4e9ec;background:var(--plum) url('assets/plum-bookcloth.png') center/660px; }.masthead button { min-width:44px;padding:0 6px; }.wordmark { font-size:25px; }.top-links { gap:10px;font-size:13px;flex-wrap:wrap;justify-content:flex-end;row-gap:0; }.live-date { display:none; }.save-status { font-size:10px;min-width:0; }
 .story,.media,.pocket,.screen,.receipts,.incident,.accent,.accent[data-at] { position:relative;inset:auto;left:auto;top:auto;width:100%;height:auto;transform:none; }
 .story { order:1;display:block; }.media { order:2; }.screen { order:3; }.accent[data-at=transcript],.accent[data-at=media] { order:4; }.pocket { order:5; }.accent[data-at=quote] { order:6; }.receipts { order:7; }.incident { order:8; }.page-footer { order:9; }
 .stage[data-layout] .story { height:auto;top:auto; }
 .date { font-size:11px;margin-bottom:12px; }.eyebrow { font-size:9px;line-height:1.6;letter-spacing:.07em;max-width:280px; }h1,.stage[data-layout=comic] h1 { font-size:40px;line-height:1.06;margin:28px 0 22px;max-width:540px; }
 .body-copy { max-width:100%;overflow:visible; }.story.clipped .body-copy { -webkit-mask-image:none;mask-image:none; }.body-copy p { font-size:21px;line-height:1.4;margin-bottom:20px; }
 .story-tools { gap:8px 20px;margin:0 0 6px; }.continue { font-size:17px;min-height:44px; }
 .narrator { font-size:21px;max-width:100%;margin:18px 0 0; }.sample-label { max-width:100%;font-size:9px;padding-top:10px;margin-top:22px; }
 .stage[data-layout] .media { --l:0;--w:100;--t:0;left:auto;width:100%;top:auto; }
 .media[data-placement=spread] .sizer { visibility:visible; }.media[data-placement=spread] .part { display:none; }
 .media[data-placement=page] .print { transform:none; }.print { padding:8px 8px 12px; }.print figcaption { font-size:10px;margin-top:10px; }.stage[data-layout=comic] .print img { aspect-ratio:auto; }
 .stage[data-layout] .screen { left:auto;top:auto;width:100%;height:auto;display:block; }.stage[data-layout=story] .screen,.stage[data-layout=comic] .screen { display:none; }
 .screen-bezel { padding:10px 8px 8px;border-radius:10px; }.screen-camera { display:none; }.window { height:auto;max-height:66vh; }
 .window-bar { padding:8px 10px;gap:8px; }.traffic { gap:5px; }.traffic i { width:10px;height:10px; }.window-title h2 { font-size:12px; }.t-source { font-size:10px; }#expand-chat { font-size:12px;padding:8px 12px;min-height:44px;min-width:44px;border-radius:5px; }
 .t-scroll { padding:12px 12px;max-height:50vh; }.messages { gap:12px; }.msg { max-width:92%;gap:8px; }.avatar { width:26px;height:26px;font:600 12px/26px var(--ui); }.bubble { border-radius:12px;padding:8px 12px 9px; }.who { font-size:11px;margin-bottom:3px; }.msg .text p { font-size:16px;margin-bottom:8px; }.msg pre { font-size:13px;padding:10px 12px;margin:6px 0 8px;border-radius:6px; }.msg-empty { font-size:15px;padding:14px; }
 .composer { padding:8px 10px; }.composer-field { font-size:12px;padding:7px 12px;border-radius:14px; }
 .pocket,.stage[data-layout=conversation] .pocket,.stage[data-layout=comic] .pocket,.stage[data-layout=mixed] .pocket { display:block;width:min(100%,410px);align-self:center;margin-top:-15px;aspect-ratio:4/3; }
 .negative { padding:5px 4px; }.negative::before,.negative::after { height:4px;background-size:12px 100%; }.pocket blockquote { padding:20px 14px; }.pocket blockquote p { font-size:15px;margin-bottom:14px; }.pocket cite { font-size:9px; }
 .accent,.stage[data-layout=conversation] .accent,.stage[data-layout=comic] .accent,.stage[data-layout=mixed] .accent { display:block;width:auto;align-self:flex-end;margin:-22px 12px 0 0;font-size:17px;transform:rotate(-2deg); }
 .stage[data-layout] .receipts { left:auto;top:auto;width:100%;margin:0; }.receipts h2 { font-size:23px;margin:0 0 15px; }.receipt-row { gap:12px; }.receipt,.stage[data-layout] .receipt { height:170px;padding:6px;gap:10px; }.receipt-inner { height:calc(100% - 24px);font-size:9px; }.receipt-caption { font-size:8px;letter-spacing:0; }
 .stage[data-layout] .incident { left:auto;top:auto;width:min(100% + 26px,510px);max-width:calc(100% + 26px);align-self:center;margin:-5px -13px 0;container-type:inline-size; }
 .incident-words { left:9%;right:9%;top:14%;bottom:12%; }.department { font-size:max(8px,1.9cqw);margin-bottom:1.4cqw; }.incident h2 { font-size:4.6cqw;margin-bottom:2cqw; }.incident dl { font-size:max(11px,2.5cqw); }.incident dl div { min-height:6.6cqw; }.incident dl .stamp-row { min-height:9.5cqw; }.incident dt,.incident dd { padding:1cqw 1.2cqw; }.stamp { font-size:5.6cqw;border-width:.7cqw;padding:1cqw 1.5cqw;bottom:12.5cqw;right:3%; }.filed { font-size:max(11px,3.2cqw);bottom:0; }
 .page-footer { position:relative;inset:auto;font-size:10px;letter-spacing:.1em;color:#423737;margin-top:4px; }.page-footer button { min-width:85px; }#page-number { position:static;transform:none;font-size:10px; }.proof-note { font-size:10px;margin:12px auto; }
 .library { padding:20px 12px 50px; }.library h1 { font-size:34px; }.library-grid { grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:20px 14px; }.library-search input,.library-tools input[type=search],.library-tools select { min-width:0;width:100%; }.library-tools { width:100%; }.library-search { flex:1 1 100%; }
 .preview-body { grid-template-columns:1fr; }
}
@media (max-width:420px) { .stage { padding-left:20px;padding-right:20px; }h1,.stage[data-layout=comic] h1 { font-size:35px; }.top-links { gap:6px;font-size:12px; }#moments { display:none; }.wordmark { font-size:22px; }.receipt,.stage[data-layout] .receipt { height:145px; }.form-pair { grid-template-columns:1fr;gap:0; } }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { transition:none!important;scroll-behavior:auto!important;animation:none!important; } }