:root{--bg:#fbfaf7;--fg:#1d1d1f;--muted:#5d5d63;--line:#dcd8cf;--card:#ffffff;--accent:#1f5fa8;--code:#f0ede6}
@media (prefers-color-scheme:dark){:root{--bg:#15161a;--fg:#e8e6e1;--muted:#a3a3a8;--line:#32343a;--card:#1c1d22;--accent:#7db3ee;--code:#23252b}}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--fg);font:17px/1.6 Charter,"Iowan Old Style","Palatino Linotype",Georgia,serif}
header,main,footer{max-width:46rem;margin:0 auto;padding:0 16px}
header{padding-top:2.5rem}
.kicker{font:600 .8rem/1.2 system-ui,-apple-system,"Segoe UI",sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:0 0 .5rem}
h1{font-size:clamp(1.9rem,6vw,2.6rem);line-height:1.15;margin:.2rem 0 1rem}
h2{font-size:1.6rem;line-height:1.25;margin:0 0 .25rem}
h4{font:600 1rem/1.3 system-ui,-apple-system,"Segoe UI",sans-serif;margin:1.5rem 0 .3rem}
a{color:var(--accent)}
.intro{font-size:1.05rem}
nav ol{padding-left:1.4rem;margin:1.2rem 0 0;font:.95rem/1.7 system-ui,-apple-system,"Segoe UI",sans-serif}
.len{color:var(--muted);font-size:.85em}
section{margin-top:3rem;padding-top:1.5rem;border-top:1px solid var(--line)}
.meta{margin:0 0 .6rem;color:var(--muted);font:.85rem/1.4 system-ui,-apple-system,"Segoe UI",sans-serif}
.player{position:relative;width:100%;aspect-ratio:16/9;background:#000;border-radius:6px;overflow:hidden;margin:1rem 0 .4rem}
.player iframe,.player video{position:absolute;inset:0;width:100%;height:100%;border:0;background:#000}
.note{margin:0 0 1rem;color:var(--muted);font:.8rem/1.4 system-ui,-apple-system,sans-serif}
details{margin-top:1rem;border:1px solid var(--line);border-radius:6px;background:var(--card)}
summary{cursor:pointer;padding:.75rem 1rem;font:600 1rem/1.3 system-ui,-apple-system,"Segoe UI",sans-serif}
summary:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.making{padding:0 1rem 1rem;border-top:1px solid var(--line)}
.making h4:first-child{margin-top:1rem}
.making p{margin:.5rem 0}
.chapters{list-style:none;padding:0;margin:.3rem 0 0;font:.9rem/1.7 system-ui,-apple-system,sans-serif}
.chapters .t{font-variant-numeric:tabular-nums;color:var(--muted);display:inline-block;min-width:3rem}
footer{margin:4rem auto 3rem;color:var(--muted);font-size:.9rem;border-top:1px solid var(--line);padding-top:1rem}
@media (min-width:700px){body{font-size:18px}}

.subtitle { margin: -0.4rem 0 1rem; font-size: 1.15rem; opacity: 0.8; }
.making ul{margin:.4rem 0 .6rem;padding-left:1.2rem}
.making li{margin:.15rem 0}
.making blockquote{margin:.8rem 0;padding:.2rem 0 .2rem .9rem;border-left:3px solid var(--accent)}
.making blockquote p{margin:0;font-style:italic}
.making cite{display:block;margin-top:.2rem;color:var(--muted);font:.85rem system-ui,sans-serif;font-style:normal}
.making code{font-size:.9em;background:var(--code);padding:0 .25rem;border-radius:3px}
