/* Faultory · case-file edition. Silver-gelatin photographs, newsprint, carbon ink, evidence red.
   Fonts: Bodoni Moda (headlines), Courier Prime (typed labels), Atkinson Hyperlegible Next (reading).
   All SIL Open Font License 1.1; licences in /assets/fonts/LICENSES.txt.
   Isometric figure styles adapted from the Anatomy kit (MIT). */
@font-face{font-family:"Bodoni Moda";src:url("/assets/fonts/bodoni-moda-var.f7a525470383.woff2") format("woff2");font-weight:500 900;font-style:normal;font-display:swap}
@font-face{font-family:"Courier Prime";src:url("/assets/fonts/courier-prime-400.79036939406e.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Courier Prime";src:url("/assets/fonts/courier-prime-700.e534c4ef3710.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"Atkinson Hyperlegible Next";src:url("/assets/fonts/atkinson-next-var.cb15d0c36cbb.woff2") format("woff2");font-weight:200 800;font-style:normal;font-display:swap}

:root{
  color-scheme:light;
  /* Neutrals follow archival photographs and newsprint: grey with the faint warmth of aged paper. */
  --paper:#e6e4de;--paper-deep:#d8d5cd;--sheet:#f7f6f2;--white:#fff;
  --grid:#d9d6ce;--grid-strong:#bcb8ae;--rule:#c8c4ba;--rule-strong:#8f8b82;
  --ink:#121212;--ink-2:#2f2e2b;--muted:#5b5953;
  /* Evidence red: stamps, the pen trace, key phrases. Deep red for small text. */
  --pen:#c8102e;--pen-deep:#9b0c22;--pen-wash:#f5dfe1;
  --verdant:#1f6440;--verdant-deep:#154a2f;--verdant-wash:#dcebe1;
  --manila:#d9c38f;--manila-deep:#a88c4f;
  --carbon:#0d0d0d;--carbon-2:#1b1b1b;--carbon-rule:#333;--on-carbon:#efeeea;--on-carbon-muted:#aaa8a1;--pen-bright:#ff4d5e;
  --display:"Bodoni Moda","Bodoni 72",Didot,Georgia,serif;
  --sans:"Atkinson Hyperlegible Next",system-ui,-apple-system,"Segoe UI",sans-serif;
  --mono:"Courier Prime","Courier New",Courier,monospace;
  --gutter:clamp(16px,4vw,48px);--radius:4px;--ease:cubic-bezier(.22,.7,.1,1);
  font-family:var(--sans);font-size:17px;line-height:1.6;background:var(--paper);color:var(--ink);font-synthesis:none;-webkit-text-size-adjust:100%;text-size-adjust:100%
}
*,*:before,*:after{box-sizing:border-box}
body{margin:0;background:var(--paper);min-height:100vh;display:flex;flex-direction:column}
main{flex:1 0 auto;overflow-x:clip}
img,svg{max-width:100%}
[hidden]{display:none!important}
a{color:var(--ink);text-decoration-color:var(--pen);text-decoration-thickness:1.5px;text-underline-offset:.2em}
a:hover{color:var(--pen-deep);text-decoration-thickness:2px}
button,input,select{font:inherit;color:inherit}
button{cursor:pointer}
button:disabled{cursor:default;opacity:.55}
:where(a,button,input,select,summary,[tabindex]):focus-visible{outline:3px solid var(--pen);outline-offset:3px;border-radius:2px}
h1,h2,h3,h4,p,ol,ul,dl,dd,figure{margin-top:0}
h1,h2,h3{font-family:var(--display);font-optical-sizing:auto;font-weight:800;line-height:1.02;letter-spacing:-.012em;color:inherit;overflow-wrap:break-word}
h1{font-size:clamp(2.4rem,1.3rem + 3.8vw,4.8rem);font-weight:880;margin-bottom:1.2rem}
h2{font-size:clamp(1.85rem,1.2rem + 2vw,3rem);margin-bottom:1rem}
h3{font-size:clamp(1.2rem,1.08rem + .4vw,1.45rem);font-weight:760;line-height:1.15;margin-bottom:.55rem}
h4{font-size:1rem;line-height:1.4;margin-bottom:.5rem}
p,li{line-height:1.65}
strong{font-weight:700}
.wrap{width:100%;max-width:1320px;margin-inline:auto;padding-inline:var(--gutter)}
.kicker,.phase-kicker,.step-no,.rail-label{font-family:var(--mono);font-weight:700;font-size:.82rem;letter-spacing:.06em;text-transform:uppercase;line-height:1.45;color:var(--muted);margin-bottom:.9rem}
.lead{font-size:clamp(1.08rem,1rem + .35vw,1.28rem);line-height:1.6;max-width:40rem;color:var(--ink-2)}
.small,.date{font-size:.86rem;color:var(--muted)}
.pen-ink{color:var(--pen)}
.dash{font-family:var(--sans);font-weight:500}   /* Bodoni's em dash is a hairline; set dashes in the reading face */
.skip{position:fixed;z-index:60;top:.5rem;left:.5rem;background:var(--pen);color:var(--white);padding:.8rem 1rem;border-radius:var(--radius);transform:translateY(-160%)}
.skip:focus{transform:none;color:var(--white)}
.icon{width:1em;height:1em;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;vertical-align:-.13em;flex-shrink:0;display:inline-block}

/* A strip of paper torn from a pad, with a typed label on it */
.label-strip{display:inline-block;padding:.38rem 1rem .32rem;background:var(--sheet);color:var(--ink);font-family:var(--mono);font-weight:700;font-size:.8rem;letter-spacing:.07em;text-transform:uppercase;-webkit-mask:url("/assets/torn.svg") center/100% 100% no-repeat;mask:url("/assets/torn.svg") center/100% 100% no-repeat;transform:rotate(-1.2deg);margin-bottom:1.1rem}
.label-strip.red{background:var(--pen);color:var(--white)}

/* Buttons and links */
.button{display:inline-flex;align-items:center;justify-content:center;gap:.7rem;min-height:50px;padding:.8rem 1.35rem;border:2px solid var(--ink);border-radius:2px;background:var(--ink);color:var(--sheet);font-family:var(--mono);font-weight:700;font-size:.92rem;letter-spacing:.05em;text-transform:uppercase;line-height:1.25;text-decoration:none;box-shadow:4px 4px 0 var(--pen);transition:transform .18s var(--ease),box-shadow .18s var(--ease),background-color .18s ease}
.button:hover{color:var(--white);background:var(--pen);border-color:var(--pen);box-shadow:4px 4px 0 var(--ink);transform:translate(-1px,-1px)}
.button:active{transform:translate(2px,2px);box-shadow:1px 1px 0 var(--ink)}
.button-small{min-height:46px;padding:.6rem 1rem;font-size:.84rem}
.noir .button{background:var(--sheet);color:var(--ink);border-color:var(--sheet);box-shadow:4px 4px 0 var(--pen)}
.noir .button:hover{background:var(--pen);border-color:var(--pen);color:var(--white);box-shadow:4px 4px 0 var(--sheet)}
.text-button{display:inline-flex;align-items:center;min-height:44px;padding:.4rem 0;border:0;background:none;color:var(--ink);text-decoration:underline;text-decoration-color:var(--pen);text-underline-offset:.22em;font-size:.92rem;text-align:left}
.text-button:hover{color:var(--pen-deep)}
.text-link{display:inline-flex;align-items:center;gap:.45rem;min-height:44px;font-family:var(--mono);font-weight:700;font-size:.9rem;letter-spacing:.05em;text-transform:uppercase;color:var(--ink);text-decoration:none;border-bottom:2px solid var(--pen);line-height:1.2;padding-top:.2rem}
.text-link:hover{color:var(--pen-deep)}
.noir .text-link,.method .text-link{color:var(--on-carbon);border-bottom-color:var(--pen-bright)}
.noir .text-link:hover,.method .text-link:hover{color:var(--white)}
.back-link{display:inline-flex;align-items:center;gap:.5rem;min-height:44px;font-family:var(--mono);font-weight:700;font-size:.84rem;letter-spacing:.05em;text-transform:uppercase;color:inherit;text-decoration:none;margin-bottom:1rem;opacity:.85}
.back-link:hover{opacity:1;color:inherit}

/* Masthead on carbon */
.masthead{background:var(--carbon);color:var(--on-carbon);border-bottom:1px solid var(--carbon-rule);position:relative;z-index:5}
.masthead-row{display:flex;align-items:center;justify-content:space-between;gap:.6rem 2rem;min-height:72px;flex-wrap:wrap}
.brand{display:inline-flex;align-items:center;gap:.6rem;min-height:44px;color:inherit;text-decoration:none}
.brand:hover{color:inherit}
.brand-word{font-family:var(--display);font-optical-sizing:auto;font-weight:860;font-size:1.6rem;letter-spacing:-.01em;line-height:1}
.mark{width:36px;height:36px;flex-shrink:0}
.mark-bg{fill:var(--carbon-2)}
.mark-lens{fill:none;stroke:var(--on-carbon);stroke-width:2.4}
.mark-handle{fill:none;stroke:var(--on-carbon);stroke-width:3.6;stroke-linecap:round}
.mark-trace{fill:none;stroke:var(--pen-bright);stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.primary-nav{display:flex;flex-wrap:wrap;align-items:center;gap:.1rem 1.5rem;font-family:var(--mono);font-weight:700;font-size:.84rem;letter-spacing:.06em;text-transform:uppercase}
.primary-nav a{position:relative;display:inline-flex;align-items:center;gap:.45rem;min-height:44px;color:var(--on-carbon-muted);text-decoration:none}
.primary-nav a:hover,.primary-nav a[aria-current]{color:var(--white)}
.primary-nav a[aria-current]:after{content:"";position:absolute;left:0;right:0;bottom:7px;height:2px;background:var(--pen-bright)}
.nav-count{display:inline-grid;place-items:center;min-width:1.45rem;height:1.45rem;padding:0 .35rem;border-radius:999px;background:var(--pen);color:var(--white);font-size:.72rem;line-height:1;letter-spacing:0}
.masthead :focus-visible{outline-color:var(--pen-bright)}
.network-notice{margin-top:1rem;padding-block:.8rem;background:var(--ink);color:var(--sheet)}

/* Noir bands: a real archival photograph drifting slowly behind the heading, with film grain */
.noir{position:relative;background:var(--carbon);color:var(--on-carbon);overflow:hidden;isolation:isolate}
.noir .kicker,.noir .phase-kicker{color:var(--on-carbon-muted)}
.noir .lead{color:#d6d4cd}
.noir a:not(.button):not(.text-link):not(.back-link):not(.wall-link){color:var(--on-carbon);text-decoration-color:var(--pen-bright)}
.noir :focus-visible{outline-color:var(--pen-bright)}
.noir-photo{position:absolute;inset:0;z-index:-2;margin:0;overflow:hidden}
.noir-photo img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 35%;transform:scale(1.06);backface-visibility:hidden}
.noir-photo:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#0d0d0df5 0%,#0d0d0dd4 40%,#0d0d0d73 72%,#0d0d0d99 100%),linear-gradient(0deg,#0d0d0de6 0%,#0d0d0d00 45%)}
.grain{position:absolute;inset:-60px;z-index:-1;background:url("/assets/grain.png");opacity:.6;pointer-events:none}
.motion .noir-photo img{animation:drift 46s ease-in-out infinite alternate;animation-play-state:paused}
.motion.is-playing .noir-photo img{animation-play-state:running}
.motion .grain{animation:grain 1.2s steps(6) infinite;animation-play-state:paused}
.motion.is-playing .grain{animation-play-state:running}
@keyframes drift{from{transform:scale(1.06) translate3d(-1.6%,0,0)}to{transform:scale(1.16) translate3d(1.6%,-1.6%,0)}}
@keyframes grain{0%{transform:translate(0,0)}20%{transform:translate(-24px,18px)}40%{transform:translate(16px,-30px)}60%{transform:translate(-30px,-12px)}80%{transform:translate(22px,26px)}100%{transform:translate(0,0)}}
.photo-credit{position:relative;z-index:2;max-width:1320px;margin:0 auto;padding:.6rem var(--gutter) .7rem;font-family:var(--mono);font-size:.72rem;line-height:1.45;color:var(--muted);text-align:right}
.photo-credit a{color:var(--muted)!important}
.noir .photo-credit,.noir .photo-credit a{color:var(--on-carbon-muted)!important}

/* Home hero */
.hero{min-height:min(880px,94vh);display:flex;flex-direction:column}
.hero .noir-photo:after{background:linear-gradient(90deg,#0d0d0df7 0%,#0d0d0de0 34%,#0d0d0d59 64%,#0d0d0d47 100%),linear-gradient(0deg,#0d0d0d 0%,#0d0d0d00 40%)}
.hero-grid{position:relative;z-index:2;flex:1;display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1fr);align-items:center;padding-block:clamp(40px,7vw,96px) clamp(24px,4vw,40px)}
.hero-copy{container-type:inline-size;min-width:0;position:relative;z-index:3}
.hero h1{font-size:clamp(2rem,10.6cqi,4.6rem);line-height:.98;letter-spacing:-.018em;color:var(--white);text-shadow:0 2px 24px #000a}
.hero h1 .pen-ink{color:var(--pen-bright)}
.hero .lead{max-width:30rem;margin-bottom:1.7rem;color:#dedcd5}
.hero-actions{display:flex;flex-wrap:wrap;align-items:center;gap:1.2rem 1.8rem}
.hero-note{font-family:var(--mono);font-size:.84rem;color:var(--on-carbon-muted);margin:1.3rem 0 1.6rem;max-width:30rem}
.hero-figure{position:absolute;z-index:2;right:var(--gutter);bottom:0;height:min(92%,600px);width:auto;max-width:40%;object-fit:contain;object-position:right bottom;filter:drop-shadow(0 24px 30px #000c) contrast(1.05);pointer-events:none}
.magnifier{position:absolute;z-index:1;left:0;top:0;width:clamp(120px,11vw,170px);pointer-events:none;transform:translate3d(var(--mx,62vw),var(--my,22vh),0) rotate(-16deg);filter:drop-shadow(0 18px 22px #000d);will-change:transform}
.magnifier-lens{position:absolute;left:calc((var(--lx,.56) - var(--lr,.43)) * 100%);top:calc((var(--ly,.21) - var(--lr,.43) * var(--ratio,.49)) * 100%);width:calc(var(--lr,.43) * 200%);aspect-ratio:1;border-radius:50%;overflow:hidden;background:#000}
.magnifier-lens img{position:absolute;left:0;top:0;max-width:none;object-fit:cover;object-position:50% 35%}
.magnifier-lens:after{content:"";position:absolute;inset:0;border-radius:50%;box-shadow:inset 0 0 18px #000c,inset 10px -12px 26px #ffffff26}
.magnifier-glass{position:relative;display:block;width:100%;height:auto}

/* Wall of case-file prints, pinned at the foot of the hero */
.case-wall{position:relative;z-index:3;padding-bottom:clamp(20px,3vw,36px)}
.wall-head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:.4rem 2rem;padding-top:1.1rem;border-top:1px solid var(--carbon-rule)}
.wall-head .kicker{margin:0;color:var(--on-carbon)}
.wall-note{margin:0;font-size:.84rem;color:var(--on-carbon-muted)}
.wall{list-style:none;margin:0;padding:2.6rem 0 0;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:1.4rem}
.wall-link{position:relative;display:grid;gap:.2rem;color:var(--on-carbon);text-decoration:none}
.wall-print{position:relative;display:block;aspect-ratio:4/3;padding:6px 6px 9px;background:var(--sheet);box-shadow:0 18px 26px -16px #000;transform:rotate(-2deg);transition:transform .25s var(--ease)}
.wall-card:nth-child(even) .wall-print{transform:rotate(1.8deg)}
.wall-print:before{content:"";position:absolute;z-index:3;left:50%;top:-7px;width:14px;height:14px;margin-left:-7px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#ff8a95 0 18%,var(--pen) 45%,#5d0613 100%);box-shadow:0 3px 4px #000a}
.wall-photo{display:block;width:100%;height:100%;object-fit:cover}
.wall-cutout{position:absolute;z-index:2;right:-10%;bottom:-2px;height:132%;width:auto;max-width:80%;object-fit:contain;object-position:right bottom;filter:drop-shadow(0 10px 10px #000b);pointer-events:none}
.wall-link:hover .wall-print,.wall-link:focus-visible .wall-print{transform:rotate(0) translateY(-6px)}
.wall-tag{margin-top:.8rem;font-family:var(--mono);font-weight:700;font-size:.74rem;letter-spacing:.05em;text-transform:uppercase;color:var(--on-carbon-muted)}
.wall-title{font-family:var(--display);font-weight:760;font-size:1.05rem;line-height:1.2}
.wall-link:hover .wall-title{color:var(--pen-bright)}

/* Page heads on carbon */
.page-head{padding-block:clamp(48px,8vw,108px) clamp(36px,5vw,64px)}
.page-head h1{max-width:15ch;color:var(--white)}
.page-head .lead{margin-bottom:0}
.page-head .wrap{position:relative;z-index:2}
.head-figure{position:absolute;z-index:1;right:max(var(--gutter),calc((100vw - 1320px)/2 + var(--gutter)));bottom:0;height:90%;max-height:460px;width:auto;max-width:34vw;object-fit:contain;object-position:right bottom;filter:drop-shadow(0 20px 26px #000c) contrast(1.05);pointer-events:none}
.head-figure.object{bottom:10%;height:62%;max-height:300px;transform:rotate(-6deg)}
.head-figure.print-object{padding:6px;background:var(--sheet);box-shadow:0 22px 30px -18px #000;filter:none;transform:rotate(5deg);opacity:.92}

/* Recorder section (Fig. 01) */
.record-section{padding-block:clamp(56px,8vw,104px);border-bottom:1px solid var(--rule)}
.record-grid{display:grid;grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr);gap:clamp(2rem,5vw,4.5rem);align-items:center}
.record-copy p:not(.kicker){color:var(--ink-2);max-width:32rem}
.recorder{margin:0;min-width:0}
.recorder-plate{position:relative;background:var(--sheet);border:1px solid var(--rule);padding:40px clamp(6px,1.5vw,18px) 36px;box-shadow:0 22px 40px -30px #1d1d1dcc}
.plate-corners{position:absolute;inset:14px 16px;pointer-events:none;font-family:var(--mono);font-size:.74rem;line-height:1;color:var(--muted)}
.plate-corners span{position:absolute;white-space:nowrap}
.plate-corners [data-corner="fig"]{top:0;left:0;color:var(--ink);font-weight:700}
.plate-corners [data-corner="title"]{top:0;right:0}
.plate-corners [data-corner="hint"]{bottom:0;left:0}
.plate-corners [data-corner="readout"]{bottom:0;right:0;color:var(--pen-deep);font-weight:700}
.recorder-caption{margin-top:1rem}
.record-picker{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:.9rem}
.record-chip{display:inline-flex;align-items:center;gap:.5rem;min-height:44px;padding:.35rem .8rem .35rem .45rem;border:1px solid var(--rule-strong);border-radius:2px;background:var(--sheet);font-family:var(--mono);font-weight:700;font-size:.78rem;letter-spacing:.03em;color:var(--ink-2)}
.record-chip:hover{border-color:var(--ink);color:var(--ink)}
.record-chip[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:var(--sheet)}
.chip-trace{width:46px;height:20px;background:var(--paper);flex-shrink:0}
.chip-trace .trace-pen{stroke:var(--pen);stroke-width:1.4;fill:none;vector-effect:non-scaling-stroke;stroke-linejoin:round}
.record-chip[aria-pressed="true"] .chip-trace{background:var(--carbon-2)}
.record-chip[aria-pressed="true"] .chip-trace .trace-pen{stroke:var(--pen-bright)}
.record-now{font-size:.95rem;color:var(--ink-2);margin-bottom:.35rem;min-height:3.2em}
.record-note{font-size:.84rem;color:var(--muted);margin:0}
.record-note a{font-weight:700;white-space:nowrap}
.iso-svg{display:block;width:100%;height:auto;overflow:visible}
.iso-svg path,.iso-svg circle{vector-effect:non-scaling-stroke}
.recorder{--anatomy-paper:#f7f6f2;--anatomy-face:#fff;--anatomy-top:#fbfaf8;--anatomy-shade-0:#d3d0c8;--anatomy-shade-1:#dddad3;--anatomy-shade-2:#e7e5df;--anatomy-shade-3:#efeee9;--anatomy-lit-top:#fff;--anatomy-lit-shade:#eceae4;--anatomy-hi:#121212;--anatomy-mid:#77746c;--anatomy-lo:#aeaaa0;--anatomy-faint:#d0ccc3;--anatomy-lit:#000;--anatomy-halo:#3d3a35;--anatomy-halo-opacity:.24;--anatomy-dot:#222;--anatomy-weight:.6px}
.iso-fill{fill:var(--anatomy-paper);stroke:none}
.iso-solid[data-lit]>.iso-fill{fill:var(--anatomy-face)}
.iso-shade,.iso-top{stroke:none}
.iso-shade[data-shade="0"]{fill:var(--anatomy-shade-0)}
.iso-shade[data-shade="1"]{fill:var(--anatomy-shade-1)}
.iso-shade[data-shade="2"]{fill:var(--anatomy-shade-2)}
.iso-shade[data-shade="3"]{fill:var(--anatomy-shade-3)}
.iso-top{fill:var(--anatomy-top)}
.iso-solid[data-lit]>.iso-top{fill:var(--anatomy-lit-top)}
.iso-solid[data-lit]>.iso-shade{fill:var(--anatomy-lit-shade)}
.iso-solid[data-seamless]>.iso-shade,.iso-solid[data-seamless]>.iso-top{stroke-width:.4;stroke-linejoin:round}
.iso-solid[data-seamless]>.iso-shade[data-shade="0"]{stroke:var(--anatomy-shade-0)}
.iso-solid[data-seamless]>.iso-shade[data-shade="1"]{stroke:var(--anatomy-shade-1)}
.iso-solid[data-seamless]>.iso-shade[data-shade="2"]{stroke:var(--anatomy-shade-2)}
.iso-solid[data-seamless]>.iso-shade[data-shade="3"]{stroke:var(--anatomy-shade-3)}
.iso-solid[data-seamless]>.iso-top{stroke:var(--anatomy-top)}
.iso-solid[data-lit]>.iso-edge{stroke:var(--anatomy-lit)}
.iso-halo{fill:var(--anatomy-halo);stroke:none;filter:blur(9px);opacity:var(--anatomy-halo-opacity);transform:translateY(3px)}
.iso-line{fill:none;stroke:var(--anatomy-lo);stroke-width:var(--anatomy-weight);stroke-linecap:round;stroke-linejoin:round}
.iso-line[data-tone="hi"]{stroke:var(--anatomy-hi)}
.iso-line[data-tone="mid"]{stroke:var(--anatomy-mid)}
.iso-line[data-tone="lo"]{stroke:var(--anatomy-lo)}
.iso-line[data-tone="faint"]{stroke:var(--anatomy-faint)}
.iso-line[data-tone="lit"]{stroke:var(--anatomy-lit)}
.iso-dots circle{fill:var(--anatomy-dot);stroke:none;opacity:.32}
.iso-dots[data-tone="hi"] circle{opacity:.85}
.iso-dots[data-tone="mid"] circle{opacity:.45}
.iso-dots[data-tone="lo"] circle{opacity:.22}
.iso-dots[data-tone="faint"] circle{opacity:.12}
.rec-paper .iso-fill{fill:#fdfdfb}
.rec-grid{fill:none;stroke:#dad6cd;stroke-width:.5}
.rec-grid-major{stroke:#b8b3a8;stroke-width:.75}
.rec-trace{fill:none;stroke:var(--pen);stroke-width:1.6;stroke-linejoin:round;stroke-linecap:round}
.rec-trace-old{opacity:.5}
.rec-ink>.iso-top{fill:var(--pen)}
.rec-ink>.iso-shade{fill:var(--pen-deep)}
.rec-lamp .iso-top{transition:fill .3s ease}
.recorder[data-state="writing"] .rec-lamp .iso-top{fill:var(--pen)}
.recorder[data-state="writing"] .rec-lamp .iso-shade{fill:var(--pen-deep)}

/* Sections */
.section{padding-block:clamp(56px,8vw,104px)}
.section-head{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr) auto;gap:1rem 2.5rem;align-items:end;margin-bottom:clamp(1.6rem,3vw,2.6rem)}
.section-head h2{margin-bottom:0}
.section-head .kicker{margin-bottom:.6rem}
.section-intro{margin:0;color:var(--ink-2);max-width:34rem}
.section-head>.text-link{justify-self:end;white-space:nowrap}

/* Channels: each case as a filed record */
.channels{border-top:3px double var(--ink)}
.channel{position:relative;display:grid;grid-template-columns:9rem minmax(0,1.15fr) minmax(0,1fr) 9rem;gap:.6rem 1.8rem;align-items:center;padding:1.3rem .75rem;border-bottom:1px solid var(--rule);transition:background-color .15s ease}
.channel:hover{background:#efede8}
.channel-id{display:grid;gap:.2rem;align-self:start;margin:0;font-family:var(--mono);font-size:.76rem;line-height:1.35;color:var(--muted)}
.channel-no{font-size:1.02rem;font-weight:700;color:var(--ink);letter-spacing:.04em}
.channel-body{min-width:0}
.channel-title{margin-bottom:.3rem}
.channel-title a{color:var(--ink);text-decoration:none}
.channel-title a:after{content:"";position:absolute;inset:0;z-index:1}
.channel:hover .channel-title a{color:var(--pen-deep)}
.channel-title a:focus-visible{outline:none}
.channel:focus-within{outline:3px solid var(--pen);outline-offset:-3px}
.channel-topic{font-family:var(--mono);font-size:.84rem;font-weight:700;color:var(--pen-deep);margin-bottom:.35rem}
.channel-deck{font-size:.93rem;color:var(--ink-2);margin:0;max-width:36rem}
.channel-trace{height:72px;border:1px solid var(--rule);background:var(--sheet);overflow:hidden}
.channel-meta{display:grid;gap:.15rem;align-self:stretch;align-content:center;margin:0;font-family:var(--mono);font-size:.78rem;line-height:1.45;color:var(--muted);border-left:1px dashed var(--rule-strong);padding-left:1rem}
.channel-status{font-weight:700;color:var(--ink)}
.channel-status[data-state="progress"]{color:var(--pen-deep)}
.channel-status[data-state="complete"]{color:var(--verdant)}
.channel-status[data-state]:before{content:"";display:inline-block;width:.55rem;height:.55rem;margin-right:.4rem;border-radius:50%;background:currentColor;vertical-align:.05em}
.channel-photo{display:block;width:100%;max-width:8rem;aspect-ratio:4/3;height:auto;margin-top:.8rem;object-fit:cover;background:var(--paper-deep);border:5px solid var(--white);border-bottom-width:9px;box-shadow:0 10px 14px -10px #000a;transform:rotate(-2deg);filter:contrast(1.06)}
.channel:nth-child(even) .channel-photo{transform:rotate(1.6deg)}
.channels-home .channel{grid-template-columns:8rem minmax(0,1.2fr) minmax(0,1fr) 8.5rem}

/* Trace strips */
.trace-strip{display:block;width:100%;height:100%}
.trace-strip .grid-minor{fill:none;stroke:var(--grid);stroke-width:1;vector-effect:non-scaling-stroke}
.trace-strip .grid-major{fill:none;stroke:var(--grid-strong);stroke-width:1;vector-effect:non-scaling-stroke}
.trace-strip .trace-ref{fill:none;stroke:var(--muted);stroke-width:1;stroke-dasharray:3 4;opacity:.75;vector-effect:non-scaling-stroke}
.trace-strip .trace-ghost{fill:none;stroke:var(--pen);stroke-width:1.3;opacity:.35;vector-effect:non-scaling-stroke}
.trace-strip .trace-pen{fill:none;stroke:var(--pen);stroke-width:1.7;stroke-linejoin:round;stroke-linecap:round;vector-effect:non-scaling-stroke}
.trace-note{font-size:.86rem;color:var(--muted);margin:1.6rem 0 .8rem}

/* Method band on carbon, with a real fingerprint card */
.method{position:relative;background:var(--carbon);color:var(--on-carbon);padding-block:clamp(56px,8vw,104px);overflow:hidden}
.method h2,.method h3{color:var(--on-carbon)}
.method .kicker{color:var(--on-carbon-muted)}
.method .pen-ink{color:var(--pen-bright)}
.method-head{max-width:44rem;position:relative;z-index:1}
.method-card{position:absolute;right:max(var(--gutter),calc((100vw - 1320px)/2 + var(--gutter)));top:clamp(36px,5vw,64px);width:min(24vw,300px);height:auto;padding:6px;background:var(--sheet);transform:rotate(5deg);box-shadow:0 24px 30px -18px #000;opacity:.9;pointer-events:none}
.method-trace{display:block;width:100%;height:110px;margin:clamp(1.5rem,3vw,2.5rem) 0 0;position:relative}
.method-ticks{stroke:var(--carbon-rule);stroke-width:1;vector-effect:non-scaling-stroke}
.method-pen{fill:none;stroke:var(--pen-bright);stroke-width:1.8;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.method-stages{list-style:none;padding:0;margin:0 0 2rem;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--carbon-rule)}
.method-stages li{padding:1.3rem 1.4rem 0 1.2rem;border-left:1px solid var(--carbon-rule)}
.method-stages li:first-child{border-left:0;padding-left:0}
.stage-no{display:block;font-family:var(--mono);font-weight:700;font-size:.82rem;color:var(--pen-bright);margin-bottom:.7rem}
.method-stages h3{font-size:1.25rem}
.method-stages p{font-size:.94rem;color:var(--on-carbon-muted);margin:0}

/* Shelf: the Field Kit and the creator's books */
.kit-feature{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(1.5rem,4vw,3.5rem);align-items:center;padding:clamp(1.2rem,3vw,2.2rem);margin-bottom:1.6rem;background:var(--carbon);color:var(--on-carbon);box-shadow:8px 8px 0 var(--pen)}
.kit-feature img{display:block;width:100%;height:auto;box-shadow:0 18px 30px -18px #000}
.kit-feature h3{font-size:clamp(1.5rem,1.1rem + 1.4vw,2.3rem);color:var(--white)}
.kit-feature p{color:#d6d4cd}
.kit-feature .ebook-disclosure{color:var(--on-carbon-muted)}
.kit-feature ul{margin:0 0 1.4rem;padding-left:1.1rem;color:#d6d4cd}
.kit-feature li::marker{color:var(--pen-bright)}
.kit-feature .button{background:var(--sheet);color:var(--ink);border-color:var(--sheet)}
.kit-feature .button:hover{background:var(--pen);border-color:var(--pen);color:var(--white)}
.shelf-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.2rem}

/* Closing with a real typewriter */
.closing{position:relative;border-top:1px solid var(--rule);background:var(--sheet);overflow:hidden}
.closing-inner{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:1.5rem 4rem;align-items:end;padding-block:clamp(56px,8vw,96px)}
.closing h2{margin:0;font-size:clamp(2rem,1.2rem + 2.6vw,3.6rem)}
.closing p{color:var(--ink-2);max-width:34rem}
.closing-object{display:block;width:min(100%,340px);height:auto;margin:0 0 1.4rem auto;transform:rotate(-3deg);filter:drop-shadow(0 18px 18px #0005)}

/* Product placements (the creator's own products, always disclosed) */
.ebook{display:grid;grid-template-columns:var(--cover,78px) minmax(0,1fr);gap:1rem 1.15rem;align-items:start;background:var(--sheet);border:1px solid var(--rule);padding:1rem;box-shadow:0 10px 18px -16px #000a}
.ebook-cover-frame{aspect-ratio:3/4;display:grid;place-items:center;background:var(--paper-deep);overflow:hidden}
.ebook-cover{display:block;width:100%;height:100%;object-fit:contain}
.ebook-copy{min-width:0}
.ebook-disclosure{font-family:var(--mono);font-weight:700;font-size:.72rem;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);margin-bottom:.35rem}
.ebook-title,.ebook h2{font-family:var(--display);font-weight:780;font-size:1.08rem;line-height:1.2;margin-bottom:.4rem;color:var(--ink)}
.ebook-summary{font-size:.88rem;color:var(--ink-2);margin-bottom:.5rem}
.ebook-link{display:inline-flex;align-items:center;gap:.4rem;min-height:44px;font-family:var(--mono);font-size:.84rem;font-weight:700;color:var(--ink)}
.noir .ebook{background:#ffffff12;border-color:#ffffff26;box-shadow:none;color:var(--on-carbon)}
.noir .ebook-title{color:var(--white)}
.noir .ebook-disclosure{color:var(--on-carbon-muted)}
.noir .ebook-link{color:var(--on-carbon)}
.ebook-teaser{--cover:52px;max-width:34rem;padding:.75rem}
.ebook-teaser .ebook-summary{display:none}
.ebook-teaser .ebook-link{min-height:36px}
.ebook-inline{--cover:72px;margin-block:1.5rem}
.ebook-shelf{--cover:96px;padding:1.1rem}
.ebook-sidebar{--cover:56px;padding:.8rem;gap:.8rem;margin-top:1.4rem}
.ebook-sidebar .ebook-summary{display:none}
.ebook-sidebar .ebook-title{font-size:.95rem}
.ebook-results{--cover:96px;margin-block:2rem}
.ebook-catalog-list{display:grid;gap:1.2rem;margin-block:1.6rem}
.ebook-catalog{--cover:150px;padding:1.3rem}
.ebook-catalog h2{font-size:1.5rem}
.ebook[data-ebook-id="fieldkit"] .ebook-cover-frame{aspect-ratio:.707;background:var(--carbon)}

/* Archive */
.archive{padding-block:clamp(28px,4vw,44px) clamp(56px,8vw,96px)}
.archive-tools{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr) auto;gap:1rem 1.4rem;align-items:end;padding:1.2rem;background:var(--sheet);border:1px solid var(--rule);box-shadow:0 10px 18px -16px #000a}
.field{display:grid;gap:.45rem;font-family:var(--mono);font-size:.8rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-2)}
.field input,.field select{width:100%;min-width:0;min-height:50px;padding:.7rem .9rem;border:1px solid var(--rule-strong);border-radius:2px;background:var(--white);color:var(--ink);font-family:var(--sans);font-size:1rem;font-weight:400;letter-spacing:0;text-transform:none}
.archive-count{grid-column:1/-1;margin:0;font-family:var(--mono);font-size:.82rem;color:var(--muted)}
.empty-state{padding:1.5rem;border:1px dashed var(--rule-strong);background:var(--sheet);color:var(--ink-2)}

/* Investigation header: a noir band built from the case's own lead photograph */
.case-head{padding-block:clamp(22px,4vw,40px) clamp(28px,4vw,44px)}
.case-head h1{max-width:20ch;font-size:clamp(2.1rem,1.15rem + 3.2vw,4.1rem);color:var(--white)}
.case-head .noir-photo:after{background:#0d0d0dc2}
.case-facts{display:flex;flex-wrap:wrap;gap:.6rem 2.2rem;margin:1.5rem 0 0}
.case-facts div{display:grid;gap:.1rem}
.case-facts dt{font-family:var(--mono);font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;color:var(--on-carbon-muted)}
.case-facts dd{margin:0;font-weight:700;font-size:.95rem;color:var(--white)}
.case-record{margin:0}
.case-record-strip{position:relative;height:clamp(100px,13vw,160px);background:var(--sheet);border:1px solid #ffffff30;overflow:hidden}
.case-record-ch{position:absolute;top:.55rem;left:.7rem;font-family:var(--mono);font-size:.74rem;font-weight:700;color:var(--ink);background:var(--sheet);padding:.1rem .35rem}
.trace-strip-large .trace-pen{stroke-width:2.2}
.case-record figcaption{font-size:.84rem;color:var(--on-carbon-muted);margin-top:.6rem;max-width:62rem}
.case-record figcaption strong{color:var(--on-carbon)}

/* Prints: toned photographs on white card, taped down; cut-out figures step out of them */
.print-plate{margin:0;min-width:0}
.print{position:relative;background:var(--white);padding:10px 10px 16px;box-shadow:0 26px 40px -24px #000;transform:rotate(-1.4deg)}
.print:before,.print:after{content:"";position:absolute;z-index:5;top:-12px;width:84px;height:26px;background:#efece2c4;box-shadow:0 1px 3px #0003}
.print:before{left:-18px;transform:rotate(-32deg)}
.print:after{right:-18px;transform:rotate(30deg)}
.print-photo{display:block;width:100%;height:auto;background:var(--paper-deep)}
.print.has-cutout{margin-left:clamp(28px,9%,64px)}
.print-cutout{position:absolute;z-index:4;left:calc(-1 * clamp(28px,9%,64px) - 6%);bottom:-1px;height:76%;width:auto;max-width:60%;object-fit:contain;object-position:left bottom;transform:rotate(1.4deg);filter:drop-shadow(0 16px 16px #000a);pointer-events:none}
.print-plate figcaption{margin-top:1.1rem;font-size:.86rem;line-height:1.5;color:var(--ink-2)}
.noir .print-plate figcaption{color:var(--on-carbon-muted)}
.print-date{display:inline-block;margin-right:.35rem;padding:.05rem .4rem;background:var(--pen);color:var(--white);font-family:var(--mono);font-size:.74rem;font-weight:700;vertical-align:.08em}
.credit{display:block;margin-top:.3rem;font-family:var(--mono);font-size:.72rem;color:var(--muted)}
.noir .credit{color:var(--on-carbon-muted)}
.credit a{color:inherit!important}
.case-head-grid.has-print{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(2rem,5vw,4.5rem);align-items:center;margin-bottom:clamp(1.8rem,3vw,2.6rem)}
.case-print .print{transform:rotate(1.6deg)}
.case-print .print-cutout{transform:rotate(-1.6deg)}
.record-print{margin:1.6rem 0 2rem;max-width:34rem}
.record-print .print{transform:rotate(-.8deg)}
@supports (animation-timeline:view()){
  .float-up{animation:float-up linear both;animation-timeline:view();animation-range:entry 0% exit 100%}
  @keyframes float-up{from{translate:0 24px}to{translate:0 -24px}}
}

/* Investigation layout */
.investigation-layout{display:grid;grid-template-columns:250px minmax(0,1fr);gap:clamp(2rem,5vw,4.5rem);padding-block:clamp(32px,5vw,56px) clamp(56px,8vw,96px);align-items:start}
.case-rail{position:sticky;top:1rem;max-height:calc(100vh - 2rem);overflow-y:auto;overscroll-behavior:contain;padding-right:.3rem}
.stage-nav{display:grid;gap:.3rem;margin-bottom:1.4rem}
.phase-button{display:flex;align-items:center;gap:.75rem;width:100%;min-height:48px;padding:.55rem .8rem;border:1px solid transparent;background:none;text-align:left;font-family:var(--mono);font-weight:700;font-size:.84rem;letter-spacing:.03em;text-transform:uppercase;color:var(--ink-2)}
.phase-button:hover{background:var(--sheet);border-color:var(--rule)}
.phase-no{font-size:.78rem;color:var(--muted)}
.phase-button[aria-pressed="true"]{background:var(--ink);color:var(--sheet);border-color:var(--ink);box-shadow:3px 3px 0 var(--pen)}
.phase-button[aria-pressed="true"] .phase-no{color:var(--pen-bright)}
.progress-summary{padding:1rem;border:1px solid var(--rule);background:var(--sheet)}
.rail-label{margin-bottom:.6rem}
.progress-summary progress{display:block;width:100%;height:10px;appearance:none;-webkit-appearance:none;border:1px solid var(--rule-strong);background:var(--paper);overflow:hidden}
.progress-summary progress::-webkit-progress-bar{background:var(--paper)}
.progress-summary progress::-webkit-progress-value{background:var(--pen)}
.progress-summary progress::-moz-progress-bar{background:var(--pen)}
.progress-summary [data-progress-label]{font-size:.9rem;font-weight:700;margin:.6rem 0 .2rem}
.progress-summary .small{margin-bottom:.1rem}
.rail-link{display:inline-flex;align-items:center;gap:.4rem;min-height:44px;margin-top:.8rem;font-family:var(--mono);font-size:.84rem;font-weight:700}
.investigation{min-width:0;max-width:46rem}
.investigation>.notice{margin-bottom:1rem}
.notice{padding:.9rem 1rem;background:var(--pen-wash);border:1px solid #ebb3bb;color:var(--ink)}
.phase{padding-bottom:1rem}
.phase+.phase{margin-top:3rem}
.investigation.enhanced .phase+.phase{margin-top:0}
.phase-kicker{color:var(--pen-deep)}
.phase h2{font-size:clamp(1.8rem,1.2rem + 1.6vw,2.7rem)}
.phase>p{font-size:1.04rem}
.phase>.button{margin-top:1.6rem}
.findings-stamp{display:inline-block;margin:0 0 1rem;padding:.2rem .7rem;border:3px solid var(--pen);border-radius:5px;color:var(--pen);font-family:var(--mono);font-size:.86rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;transform:rotate(-4deg);opacity:.88}
.timeline-head{display:flex;align-items:center;gap:1rem;margin-top:2.2rem}
.timeline-head h3{margin:0}
.timeline-watch{width:64px;height:auto;transform:rotate(-12deg);filter:drop-shadow(0 6px 6px #0005)}
.timeline{list-style:none;padding:0;margin:1rem 0 1.6rem;border-left:2px solid var(--ink)}
.timeline li{position:relative;display:grid;grid-template-columns:minmax(7.5rem,10rem) minmax(0,1fr);gap:.3rem 1.2rem;padding:.75rem 0 .75rem 1.3rem;border-bottom:1px dashed var(--rule-strong)}
.timeline li:before{content:"";position:absolute;left:-6px;top:1.2rem;width:10px;height:10px;border-radius:50%;background:var(--paper);border:2px solid var(--pen)}
.timeline time{font-family:var(--mono);font-size:.84rem;font-weight:700;color:var(--ink);padding-top:.15rem}
.timeline p{margin:0;font-size:.97rem}
.editorial-caveat{font-size:.9rem;color:var(--muted);border-left:3px solid var(--rule-strong);padding-left:1rem}

/* Exhibits: manila evidence tags */
.exhibit{position:relative;margin-top:1.6rem;padding:1.3rem 1.4rem 1rem;background:var(--sheet);border:1px solid var(--rule);box-shadow:0 12px 20px -18px #000b}
.exhibit-head{position:relative;display:flex;align-items:center;justify-content:space-between;gap:1rem;margin:-1.3rem -1.4rem 1rem;padding:.6rem 1.4rem .6rem 2.6rem;background:var(--manila);border-bottom:1px solid var(--manila-deep)}
.exhibit-head:before{content:"";position:absolute;left:1rem;top:50%;width:12px;height:12px;margin-top:-6px;border-radius:50%;background:var(--paper);box-shadow:inset 0 1px 2px #0006,0 0 0 2px var(--manila-deep)}
.exhibit-tag{font-family:var(--mono);font-size:.86rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--ink)}
.exhibit h3{font-size:1.3rem}
.exhibit p{font-size:.98rem}
.mark-button{display:inline-flex;align-items:center;gap:.5rem;min-height:40px;padding:.3rem .75rem .3rem .4rem;border:1px solid var(--manila-deep);border-radius:2px;background:#ffffff8c;font-family:var(--mono);font-size:.76rem;font-weight:700;letter-spacing:.03em;text-transform:uppercase;color:var(--ink-2)}
.mark-button:hover{border-color:var(--ink);background:var(--white)}
.mark-box{display:grid;place-items:center;width:22px;height:22px;border:2px solid var(--ink-2);background:var(--white)}
.mark-box svg{width:14px;height:14px;fill:none;stroke:transparent;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.mark-button[aria-pressed="true"]{background:var(--verdant-wash);border-color:var(--verdant);color:var(--verdant-deep)}
.mark-button[aria-pressed="true"] .mark-box{background:var(--verdant);border-color:var(--verdant)}
.mark-button[aria-pressed="true"] .mark-box svg{stroke:var(--white)}
.source-ref{font-family:var(--mono);font-size:.8rem;color:var(--muted);margin:.4rem 0 0}
.source-ref a{font-weight:700}

/* Reasoning: ruled index cards with a red header line */
.reasoning-step{position:relative;margin-top:1.8rem;padding:1.4rem 1.4rem 1.3rem;background:var(--white);border:1px solid var(--rule);box-shadow:0 14px 22px -18px #000b}
.reasoning-step:before{content:"";position:absolute;left:0;right:0;top:3.4rem;height:2px;background:var(--pen);opacity:.75}
.reasoning-step fieldset{background:repeating-linear-gradient(transparent 0 31px,#d6dde6 31px 32px);background-position:0 6px}
.step-no{margin-bottom:1.4rem}
fieldset{border:0;margin:0;padding:0;min-width:0}
legend{font-family:var(--display);font-weight:760;font-size:1.24rem;line-height:1.3;margin-bottom:1rem;padding:0}
.choice{position:relative;display:grid;grid-template-columns:24px minmax(0,1fr);gap:.8rem;align-items:start;padding:.85rem 1rem;margin-bottom:.5rem;border:1px solid var(--rule);background:var(--white);cursor:pointer;transition:border-color .15s ease,background-color .15s ease}
.choice:hover{border-color:var(--rule-strong)}
.choice input{appearance:none;-webkit-appearance:none;width:22px;height:22px;margin:.1rem 0 0;border:2px solid var(--ink-2);border-radius:50%;background:var(--white);display:grid;place-items:center;cursor:pointer}
.choice input:before{content:"";width:10px;height:10px;border-radius:50%;background:var(--pen);transform:scale(0);transition:transform .15s var(--ease)}
.choice input:checked{border-color:var(--pen)}
.choice input:checked:before{transform:scale(1)}
.choice:has(input:checked){border-color:var(--pen);background:var(--pen-wash)}
.choice span{font-size:.98rem;line-height:1.55}
.form-error{color:var(--pen-deep);font-weight:700;font-size:.92rem;margin:.6rem 0 0}
.step-actions{display:flex;flex-wrap:wrap;align-items:center;gap:.8rem 1.4rem;margin-top:1.1rem}
.reasoning-feedback{margin-top:1.2rem;padding:1.1rem 1.2rem;background:var(--paper);border-left:4px solid var(--ink-2)}
.reasoning-feedback:focus{outline:none}
.reasoning-feedback:focus-visible{outline:3px solid var(--pen);outline-offset:2px}
.reasoning-feedback h4{display:flex;align-items:center;gap:.55rem;font-family:var(--mono);font-weight:700;font-size:.9rem;letter-spacing:.04em;text-transform:uppercase}
.reasoning-feedback[data-outcome="supported"]{background:var(--verdant-wash);border-left-color:var(--verdant)}
.reasoning-feedback[data-outcome="supported"] h4{color:var(--verdant-deep)}
.reasoning-feedback[data-outcome="supported"] h4:before{content:"";width:18px;height:18px;flex-shrink:0;border-radius:50%;background:var(--verdant) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 8.5 6.8 11 12 5' fill='none' stroke='%23fff' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/14px no-repeat}
.reasoning-feedback[data-outcome="review"]{background:var(--pen-wash);border-left-color:var(--pen)}
.reasoning-feedback[data-outcome="review"] h4{color:var(--pen-deep)}
.reasoning-feedback[data-outcome="review"] h4:before{content:"";width:18px;height:18px;flex-shrink:0;border-radius:50%;border:2px solid var(--pen);background:var(--white)}
.reasoning-feedback p{font-size:.97rem}
.reasoning-feedback p:last-child{margin-bottom:0}

/* Findings */
.cause-chain{list-style:none;counter-reset:cause;padding:0;margin:1rem 0 0;position:relative}
.cause-chain:before{content:"";position:absolute;left:15px;top:18px;bottom:-18px;width:2px;background:var(--ink)}
.cause-chain li{counter-increment:cause;position:relative;padding:.55rem 0 .95rem 3rem}
.cause-chain li:before{content:counter(cause,decimal-leading-zero);position:absolute;left:0;top:.45rem;display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--paper);border:2px solid var(--ink);font-family:var(--mono);font-size:.76rem;font-weight:700}
.cause-outcome{position:relative;display:flex;flex-wrap:wrap;align-items:baseline;gap:.4rem .8rem;margin:.6rem 0 2rem;padding:.9rem 1rem .9rem 3rem;background:var(--ink);color:var(--sheet);font-weight:700;box-shadow:4px 4px 0 var(--pen)}
.cause-outcome:before{content:"";position:absolute;left:9px;top:50%;width:14px;height:14px;margin-top:-7px;border-radius:50%;background:var(--pen-bright)}
.cause-outcome span{font-family:var(--mono);font-size:.76rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--on-carbon-muted)}
.uncertainty{margin:2rem 0;padding:1.3rem 1.4rem;border:1px solid var(--rule-strong);background:repeating-linear-gradient(135deg,var(--sheet) 0 10px,var(--paper) 10px 11px)}
.uncertainty h3{font-size:1.25rem}
.uncertainty p:last-child{margin-bottom:0}
.takeaways{padding-left:1.2rem}
.takeaways li{margin-bottom:.5rem}
.takeaways li::marker{color:var(--pen)}
.source-record{margin-top:3.5rem;padding-top:2rem;border-top:3px double var(--ink)}
.source-record h2{font-size:clamp(1.55rem,1.15rem + 1vw,2.1rem)}
.source-record ol{list-style:none;padding:0;margin:1.2rem 0 1.6rem}
.source-record li{display:grid;grid-template-columns:2.6rem minmax(0,1fr);gap:.8rem;padding:.75rem 0;border-bottom:1px dashed var(--rule-strong)}
.source-record li:target{background:var(--pen-wash)}
.source-id{font-family:var(--mono);font-size:.84rem;font-weight:700;color:var(--pen-deep);padding-top:.1rem}
.source-record li a{font-weight:700;overflow-wrap:anywhere}
.source-record li p{font-size:.86rem;color:var(--muted);margin:.15rem 0 0}

/* Documents */
.document{max-width:calc(46rem + 2 * var(--gutter));padding-block:clamp(32px,5vw,56px) clamp(56px,8vw,96px)}
.document h2{font-size:clamp(1.5rem,1.15rem + 1vw,2rem);margin-top:2.6rem;padding-top:1.2rem;border-top:1px solid var(--rule)}
.document>h2:first-child,.document>.ebook+h2{margin-top:1rem}
.document p,.document li{font-size:1.04rem}
.notebook-tools{margin-top:2.5rem;padding:1.4rem;border:1px solid var(--rule);background:var(--sheet)}
.notebook-tools h2{margin-top:0;padding-top:0;border-top:0}
.tool-row{display:flex;flex-wrap:wrap;align-items:center;gap:1rem 1.4rem}
.import-label{display:grid;gap:.4rem;font-size:.9rem;font-weight:700}
.import-label input{font-size:.88rem;max-width:100%}
details{margin-top:1.2rem}
summary{cursor:pointer;min-height:44px;display:flex;align-items:center;font-weight:700}
.channels-notebook{margin-top:1.5rem}
.channels-notebook .channel{grid-template-columns:7rem minmax(0,1.2fr) minmax(0,.9fr) 9rem}
.people{list-style:none;padding:0;margin:1.4rem 0 0;display:grid;grid-template-columns:repeat(auto-fill,minmax(168px,1fr));gap:1.2rem}
.person a{display:grid;gap:.15rem;color:var(--ink);text-decoration:none}
.person-cutout{display:block;width:100%;height:210px;object-fit:contain;object-position:center bottom;padding-top:.8rem;background:var(--carbon);margin-bottom:.6rem;filter:contrast(1.05)}
.person-name{font-family:var(--display);font-weight:780;font-size:1.05rem;line-height:1.2}
.person-role{font-size:.86rem;color:var(--ink-2);line-height:1.45}
.person-case{font-family:var(--mono);font-size:.74rem;color:var(--muted);margin-top:.2rem}
.person a:hover .person-name{color:var(--pen-deep)}
.credit-list{list-style:none;padding:0;margin:1.6rem 0}
.credit-row{display:grid;grid-template-columns:120px minmax(0,1fr);gap:1.2rem;padding:1.2rem 0;border-top:1px dashed var(--rule-strong)}
.credit-thumb{display:block;width:120px;height:90px;object-fit:cover;border:4px solid var(--white);box-shadow:0 6px 10px -8px #000a}
.credit-caption{font-weight:700;margin-bottom:.4rem}
.credit-facts{display:grid;gap:.25rem;margin:0;font-size:.88rem}
.credit-facts div{display:grid;grid-template-columns:5.5rem minmax(0,1fr);gap:.6rem}
.credit-facts dt{font-family:var(--mono);font-size:.76rem;color:var(--muted);padding-top:.1rem}
.credit-facts dd{margin:0;overflow-wrap:anywhere}

/* 404 */
.loose-end{display:block;width:100%;max-width:640px;height:auto;margin:1.5rem 0 2rem;background:var(--sheet);border:1px solid #ffffff30}
.loose-end .grid-minor{fill:none;stroke:var(--grid);stroke-width:1}
.loose-end .trace-pen{fill:none;stroke:var(--pen);stroke-width:2.2;stroke-linejoin:round;stroke-linecap:round}
.loose-tip{fill:var(--sheet);stroke:var(--pen);stroke-width:2.2}

/* Footer */
.colophon{background:var(--carbon);color:var(--on-carbon-muted);margin-top:auto;border-top:4px solid var(--pen)}
.colophon-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:1.8rem 4rem;padding-block:clamp(40px,6vw,64px)}
.colophon .brand{color:var(--on-carbon)}
.colophon-line{font-family:var(--display);font-weight:800;font-size:clamp(1.4rem,1rem + 1.2vw,2rem);line-height:1.15;color:var(--on-carbon);margin:1.2rem 0 0;max-width:20ch}
.colophon-line span{color:var(--pen-bright)}
.colophon-nav{display:flex;flex-wrap:wrap;align-content:start;gap:.2rem 1.4rem}
.colophon-nav a,.colophon-nav .text-button{display:inline-flex;align-items:center;min-height:44px;color:var(--on-carbon);text-decoration:none;font-family:var(--mono);font-weight:700;font-size:.8rem;letter-spacing:.06em;text-transform:uppercase}
.colophon-nav a:hover,.colophon-nav .text-button:hover{color:var(--pen-bright)}
.colophon-nav .text-button{text-decoration:underline;text-decoration-color:var(--pen-bright)}
.colophon-credit{grid-column:1/-1;margin:0;padding-top:1.4rem;border-top:1px solid var(--carbon-rule);font-size:.88rem}
.colophon-credit a{color:var(--on-carbon)}
.colophon-credit a:hover{color:var(--pen-bright)}
.colophon :focus-visible{outline-color:var(--pen-bright)}

/* Update and consent bars */
.update-bar,.consent{position:fixed;z-index:40;left:50%;bottom:16px;transform:translateX(-50%);width:min(760px,calc(100% - 24px));background:var(--carbon);color:var(--on-carbon);box-shadow:6px 6px 0 var(--pen);border:1px solid var(--carbon-rule)}
.update-bar{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem 1.2rem;padding:.9rem 1.1rem}
.update-bar p{margin:0;flex:1 1 16rem;font-size:.94rem}
.update-bar .button{background:var(--pen);border-color:var(--pen);color:var(--white);box-shadow:none}
.update-bar .text-button,.consent a{color:var(--on-carbon)}
.update-bar :focus-visible,.consent :focus-visible{outline-color:var(--pen-bright)}
.consent .wrap.consent-inner{max-width:none;padding:1rem 1.15rem;display:flex;flex-wrap:wrap;align-items:center;gap:.8rem 1.4rem}
.consent p{margin:0;flex:1 1 20rem;font-size:.92rem;line-height:1.5}
.consent-actions{display:flex;flex-wrap:wrap;gap:.6rem}
.consent-actions button{min-height:44px;padding:.55rem 1rem;border-radius:2px;border:1px solid var(--on-carbon-muted);background:transparent;color:var(--on-carbon);font-family:var(--mono);font-weight:700;font-size:.8rem;letter-spacing:.04em;text-transform:uppercase}
.consent-actions button[data-analytics-choice="granted"]{background:var(--on-carbon);border-color:var(--on-carbon);color:var(--carbon)}
.consent-actions button:hover{border-color:var(--white)}

/* Layout breakpoints: 1060, 760 and 480 pixels */
@media (max-width:1060px){
  .hero-grid{grid-template-columns:1fr}
  .hero-figure{height:min(70%,420px);max-width:46%;opacity:.55}
  .record-grid{grid-template-columns:1fr}
  .section-head{grid-template-columns:1fr auto}
  .section-intro{grid-column:1/-1;grid-row:2}
  .channel,.channels-home .channel,.channels-notebook .channel{grid-template-columns:7.5rem minmax(0,1fr) 8.5rem;grid-template-areas:"id body meta" "id trace meta"}
  .channel-id{grid-area:id}.channel-body{grid-area:body}.channel-trace{grid-area:trace;height:60px}.channel-meta{grid-area:meta}
  .wall{grid-template-columns:repeat(3,minmax(0,1fr));row-gap:2.8rem}
  .method-stages{grid-template-columns:repeat(2,minmax(0,1fr))}
  .method-stages li:nth-child(3){border-left:0;padding-left:0}
  .method-stages li{padding-bottom:1.4rem}
  .method-card{width:min(34vw,260px);opacity:.45}
  .kit-feature{grid-template-columns:1fr}
  .shelf-row{grid-template-columns:repeat(2,minmax(0,1fr))}
  .investigation-layout{grid-template-columns:1fr}
  .case-rail{position:static;max-height:none;overflow:visible;padding-right:0;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:1rem;align-items:start}
  .stage-nav{grid-column:1/-1;grid-template-columns:repeat(4,minmax(0,1fr));margin-bottom:0}
  .phase-button{flex-direction:column;align-items:flex-start;gap:.15rem;font-size:.78rem}
  .rail-link{margin-top:0}
  .ebook-sidebar{grid-column:1/-1;margin-top:0}
  .closing-inner{grid-template-columns:1fr}
  .case-head-grid.has-print{grid-template-columns:1fr}
  .case-print{max-width:560px}
  .head-figure{opacity:.4}
}
@media (max-width:760px){
  :root{font-size:16px}
  .masthead-row{min-height:0;padding-block:.6rem;gap:.2rem 1rem}
  .primary-nav{width:100%;gap:0 1rem;font-size:.74rem}
  .hero{min-height:0}
  .hero .noir-photo:after{background:linear-gradient(0deg,#0d0d0d 0%,#0d0d0dd9 55%,#0d0d0d66 100%)}
  .hero-figure,.magnifier,.head-figure,.method-card{display:none}
  .section-head{grid-template-columns:1fr}
  .section-head>.text-link{justify-self:start}
  .channel,.channels-home .channel,.channels-notebook .channel{grid-template-columns:minmax(0,1fr);grid-template-areas:"id" "trace" "body" "meta";gap:.7rem;padding-inline:.25rem}
  .channel-id{display:flex;flex-wrap:wrap;gap:.2rem .8rem;align-items:baseline;position:relative;padding-right:5.5rem;min-height:3rem}
  .channel-photo{position:absolute;right:0;top:-.2rem;width:4.8rem;margin:0}
  .channel-meta{display:flex;flex-wrap:wrap;gap:.2rem 1rem;border-left:0;padding-left:0}
  .archive-tools{grid-template-columns:1fr}
  .wall{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:1rem;padding:2.8rem 4px 1rem;margin-inline:-4px}
  .wall-card{flex:0 0 58%;scroll-snap-align:start}
  .method-stages{grid-template-columns:1fr}
  .method-stages li{border-left:0;padding-left:0;border-top:1px solid var(--carbon-rule)}
  .method-stages li:first-child{border-top:0}
  .shelf-row{grid-template-columns:1fr}
  .case-rail{grid-template-columns:1fr}
  .stage-nav{grid-template-columns:repeat(2,minmax(0,1fr))}
  .timeline li{grid-template-columns:1fr}
  .colophon-grid{grid-template-columns:1fr}
  .credit-row{grid-template-columns:1fr}
  .plate-corners [data-corner="title"]{display:none}
  .closing-object{margin-left:0}
}
@media (max-width:480px){
  .hero-actions .button{width:100%}
  .recorder-plate{padding:36px 4px 34px}
  .plate-corners{inset:12px 12px}
  .plate-corners [data-corner="hint"]{display:none}
  .record-chip{font-size:.74rem;padding-right:.6rem}
  .exhibit,.reasoning-step{padding:1.1rem 1rem}
  .exhibit-head{margin:-1.1rem -1rem 1rem;padding-left:2.3rem;flex-wrap:wrap}
  .choice{padding:.75rem .8rem}
  .ebook{--cover:64px!important;padding:.85rem;gap:.85rem}
  .case-facts{gap:.6rem 1.4rem}
  .cause-outcome{padding-left:2.6rem}
  .print:before,.print:after{width:60px;height:20px}
}
@media (prefers-reduced-motion:reduce){
  *,*:before,*:after{transition-duration:0s!important;animation:none!important;scroll-behavior:auto!important}
}
@media print{
  .masthead,.colophon,.case-rail,.update-bar,.consent,.record-picker,.ebook,.case-wall,.magnifier,.grain,.noir-photo,.hero-figure,.head-figure,.method-card{display:none!important}
  .noir{background:none;color:var(--ink)}
  .noir h1,.case-facts dd{color:var(--ink)}
  .print,.wall-print,.channel-photo{transform:none!important;box-shadow:none!important}
  .phase[hidden]{display:block!important}
}
