
:root { --paper:#faf8f3; --ink:#1c1b19; --navy:#1f2f55; --red:#e3452b; --rule:#d9d4c7; --muted:#6b675f; }
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin:0; background:var(--paper); color:var(--ink);
  font: 1.125rem/1.62 "Palatino Linotype", Palatino, "Book Antiqua", "TeX Gyre Pagella", Georgia, serif; }
a { color: var(--navy); text-underline-offset: .18em; text-decoration-thickness: .06em; }
a:hover { color: var(--red); }
.label, figcaption, footer { font-family: Inter, -apple-system, "Segoe UI", Helvetica, Arial, sans-serif; }
.label { font-size:.72rem; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); margin:0 0 .6rem; }

.masthead, main, footer { width:min(92vw, 640px); margin-inline:auto; }
.masthead { padding: 18vh 0 10vh; }
h1 { font-weight:400; font-style:italic; font-size: clamp(2.5rem, 9vw, 4.4rem); line-height:1.02; letter-spacing:-.01em; margin:.2em 0 .5em; }
.standfirst { font-size:1.3rem; line-height:1.45; color:var(--navy); margin:0; max-width: 30ch; }
h2 { font-weight:400; font-style:italic; font-size:1.9rem; line-height:1.15; margin:0 0 .6em; }
p { margin: 0 0 1em; }
ul { padding-left: 1.1em; margin: 0 0 1em; }
li { margin-bottom:.45em; }
.intro { border-top:1px solid var(--rule); padding-top:2.2rem; margin-bottom:5rem; }

/* the red thread */
.thread { position:relative; border-left:1.5px solid var(--red); margin-left:.3rem; padding-left: clamp(1rem, 5vw, 2.2rem); }
.part { padding: 3.2rem 0 1rem; position:relative; }
.part:first-child { padding-top:.2rem; }
.part::before, .prompt::before { content:""; position:absolute; left: calc(-1 * clamp(1rem, 5vw, 2.2rem) - .42rem); width:.7rem; height:.7rem; border-radius:50%; }
.part::before { top: calc(100% - 3.1rem); background:var(--red); }
.part:first-child::before { top:.5rem; }
.prompt { position:relative; margin: 3.4rem 0 1.4rem; font-family: Inter, -apple-system, "Segoe UI", Helvetica, Arial, sans-serif; font-size:.95rem; line-height:1.5; color:var(--navy); }
.prompt::before { top:.2rem; background:var(--paper); border:1.5px solid var(--red); }
.prompt p:last-child { margin:0; }
.prompt .label { margin-bottom:.3rem; }
.piece figure { margin: 0 0 1.3rem; }
.piece img { display:block; width:100%; height:auto; background:#fff; border:1px solid var(--rule); }
figcaption { display:flex; flex-wrap:wrap; gap:.2rem .7rem; align-items:baseline; margin-top:.7rem; font-size:.78rem; color:var(--muted); }
figcaption .no { color:var(--red); letter-spacing:.08em; }
figcaption .title { letter-spacing:.14em; text-transform:uppercase; color:var(--ink); }
figcaption .medium { margin-left:auto; }
.reply p:first-child::first-line, .piece > p:first-of-type::first-line { }
.after, .machines, .sources { border-top:1px solid var(--rule); margin-top:5rem; padding-top:2.2rem; }
.sources ul { list-style:none; padding:0; font-size:1rem; }
footer { margin-top:5rem; padding: 2rem 0 5rem; border-top:1px solid var(--rule); font-size:.82rem; line-height:1.55; color:var(--muted); }
footer p { margin:0 0 .6em; }
@media print { .thread { border-left:0; padding-left:0 } .prompt::before, .part::before { display:none } .piece { break-inside: avoid } }

/* transcript */
.transcript h1 { font-size: clamp(2.2rem, 8vw, 3.6rem); }
.reply .who { margin: 2.2rem 0 .8rem; }
.prompt.cut { color: var(--muted); font-style: italic; }
.prompt ul, .prompt ol { margin: .4em 0 0 1.1em; padding: 0; }
.prompt p { margin: 0 0 .6em; }
details.work { margin: 0 0 1.2rem; font-family: Inter, -apple-system, "Segoe UI", Helvetica, Arial, sans-serif; font-size: .8rem; line-height: 1.5; color: var(--muted); }
details.work summary { cursor: pointer; letter-spacing: .1em; text-transform: uppercase; font-size: .7rem; }
details.work ul { list-style: none; padding: .6rem 0 0 .9rem; margin: 0; border-left: 1px solid var(--rule); }
details.work li { margin-bottom: .3em; }
details.work li.th { font-style: italic; }
figure.sent { margin: 0 0 1.3rem; max-width: 300px; }
figure.sent img { display: block; width: 100%; height: auto; background: #fff; border: 1px solid var(--rule); }
p.file { font-family: Inter, -apple-system, "Segoe UI", Helvetica, Arial, sans-serif; font-size: .8rem; color: var(--muted); }
.transcript .part { padding: 3rem 0 .2rem; }
.transcript .part::before { top: 3.15rem; }
.transcript .part:first-child { padding-top: .2rem; }
.transcript .part:first-child::before { top: .35rem; }
