@font-face{font-family:Inter;src:url(../../assets/fonts/inter-400.woff2?v=8909904a) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:Inter;src:url(../../assets/fonts/inter-700.woff2?v=6f56409f) format("woff2");font-weight:700;font-style:normal;font-display:swap}

:root{
  --ink:#161814;
  --paper:#d8d1c2;
  --paper-light:#eee9de;
  --card:#c7bfaf;
  --kraft:#a99070;
  --amber:#bf542e;
  --pink:#ed6689;
  --olive:#77884d;
  --acid:#d6ff3f;
  --line:rgba(22,24,20,.24);
  --accent:var(--amber);
  --stage-progress:.14;
}

html[data-active-stage="found"]{--accent:#bf542e}
html[data-active-stage="disassembled"]{--accent:#e56b87}
html[data-active-stage="workshop"]{--accent:#d6ff3f}
html[data-active-stage="recombined"]{--accent:#8fa358}
html[data-active-stage="reread"]{--accent:#7059bb}
html[data-active-stage="resonances"]{--accent:#315c86}
html[data-active-stage="reflection"]{--accent:#11150f}

*{box-sizing:border-box}
html{scroll-behavior:smooth;overflow-x:clip;background:var(--paper)}
body{margin:0;overflow-x:clip;background:var(--paper);color:var(--ink);font-family:Inter,Arial,sans-serif}
img{display:block;max-width:100%}
a{color:inherit}
button,input,textarea,select{font:inherit}

.skip-link{position:fixed;z-index:100;left:1rem;top:-5rem;padding:.8rem 1rem;color:var(--ink);background:var(--acid);font-size:.72rem;font-weight:700;letter-spacing:.08em;text-decoration:none}
.skip-link:focus{top:1rem}

.pack-header{position:sticky;z-index:30;top:0;height:4.4rem;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 clamp(1rem,2.4vw,2.5rem);background:rgba(216,209,194,.9);border-bottom:1px solid var(--line);backdrop-filter:blur(18px) saturate(1.2)}
.pack-header a{justify-self:start;font-size:.68rem;font-weight:700;letter-spacing:.12em;text-decoration:none;text-transform:uppercase}
.pack-header p{margin:0;font-size:.67rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
.pack-header>span{justify-self:end;font-size:.68rem;font-weight:700;letter-spacing:.12em}

.pack-hero{position:relative;isolation:isolate;min-height:calc(100svh - 4.4rem);display:grid;grid-template-columns:repeat(12,minmax(0,1fr));grid-template-rows:auto 1fr auto;gap:1rem;padding:clamp(2rem,4vw,4rem) clamp(1rem,3vw,3.5rem) 2rem;overflow:hidden;background:
  linear-gradient(90deg,transparent calc(50% - .5px),rgba(22,24,20,.09) 50%,transparent calc(50% + .5px)),
  linear-gradient(var(--paper-light),var(--paper))}
.pack-hero::before{content:"";position:absolute;z-index:-2;width:min(58vw,52rem);aspect-ratio:1;right:-8vw;top:8%;border:1px dashed rgba(22,24,20,.24);border-radius:50%;box-shadow:0 0 0 2.4rem rgba(255,255,255,.14),0 0 0 7rem rgba(255,255,255,.08)}
.pack-hero::after{content:"";position:absolute;z-index:-1;inset:auto 0 14% 0;height:1px;background:linear-gradient(90deg,transparent,var(--ink) 18% 82%,transparent);opacity:.28}

.hero-copy{grid-column:1/7;grid-row:1/3;align-self:center;position:relative;z-index:3}
.eyebrow{margin:0 0 1.2rem;font-size:.62rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase}
.hero-copy h1{margin:0;font-size:clamp(5.5rem,12.2vw,12.5rem);font-weight:700;line-height:.66;letter-spacing:-.105em;text-transform:uppercase}
.hero-copy h1 span{display:block;width:max-content}
.hero-copy h1 span:first-child{font-size:.34em;line-height:1.05;letter-spacing:-.06em;color:var(--amber);transform:translateX(.07em)}
.hero-copy h1 span:nth-child(2){transform:translateX(-.035em)}
.hero-copy h1 span:last-child{color:transparent;-webkit-text-stroke:2px var(--ink);transform:translateX(.42em)}
.hero-subtitle{max-width:15ch;margin:2rem 0 0 18%;font-size:clamp(1.4rem,2.8vw,2.8rem);font-weight:700;line-height:.92;letter-spacing:-.055em}
.hero-intro{max-width:38ch;margin:1.35rem 0 0 18%;font-size:clamp(.95rem,1.2vw,1.15rem);line-height:1.5}

.hero-object{--fold-x:0px;--fold-y:0px;grid-column:7/13;grid-row:1/3;align-self:center;justify-self:end;position:relative;width:min(100%,42rem);height:min(76svh,49rem);margin:0;transform:translate(var(--fold-x),var(--fold-y)) rotate(1.8deg);transition:transform .22s ease-out}
.hero-object::before{content:"";position:absolute;z-index:-1;inset:-1.2rem 1.4rem 1.1rem -1rem;background:#f5f1e7;clip-path:polygon(7% 0,100% 4%,94% 100%,0 94%)}
.hero-object img{width:100%;height:100%;object-fit:cover;object-position:50% 52%;clip-path:polygon(8% 0,100% 4%,95% 91%,76% 100%,0 94%,3% 12%);filter:saturate(.94) contrast(1.02)}
.hero-object figcaption{position:absolute;right:1.4rem;bottom:1.5rem;padding:.5rem .65rem;color:#fff;background:var(--panel-dark,var(--ink));font-size:.58rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;transform:rotate(-1.8deg)}
.cut-mark{position:absolute;z-index:2;display:block;width:7rem;height:7rem;border-color:var(--acid);pointer-events:none}
.cut-mark-a{left:-1.3rem;top:22%;border-left:5px solid var(--acid);border-top:5px solid var(--acid)}
.cut-mark-b{right:-.4rem;bottom:13%;border-right:5px solid var(--acid);border-bottom:5px solid var(--acid)}

.hero-route{grid-column:1/10;grid-row:3;align-self:end;display:flex;align-items:center;gap:.8rem;flex-wrap:wrap;padding-top:1.1rem;border-top:1px solid var(--ink);font-size:.63rem;font-weight:700;letter-spacing:.13em;text-transform:uppercase}
.hero-route i{font-style:normal;color:var(--amber)}
.dieline{position:absolute;z-index:-1;right:-4rem;bottom:-6rem;width:31rem;height:24rem;opacity:.24;transform:rotate(-8deg)}
.dieline i{position:absolute;border:1px dashed var(--ink)}
.dieline i:nth-child(1){inset:22% 34% 28% 34%}
.dieline i:nth-child(2){inset:22% 0 28% 66%}
.dieline i:nth-child(3){inset:22% 66% 28% 0}
.dieline i:nth-child(4){inset:0 34% 78% 34%}
.dieline i:nth-child(5){inset:72% 34% 0 34%}

.process-layout{display:grid;grid-template-columns:minmax(13rem,18vw) minmax(0,1fr);align-items:start;border-top:1px solid var(--ink)}
.process-rail{position:sticky;z-index:20;top:4.4rem;height:calc(100svh - 4.4rem);padding:clamp(1rem,2.5vw,2.5rem);display:grid;grid-template-rows:auto 1fr auto;background:var(--panel-dark,var(--ink));color:#f3efe5;transition:background .55s ease}
.process-rail>p{margin:0;display:flex;align-items:baseline;gap:.3rem}
.process-rail>p span{font-size:clamp(2.8rem,4vw,4.4rem);font-weight:700;line-height:1;color:var(--acid)}
.process-rail>p i{font-style:normal;font-size:.65rem;letter-spacing:.14em;color:#a9ad9f}
.process-rail ol{align-self:center;margin:0;padding:0;list-style:none;display:grid;gap:.2rem}
.process-rail a{display:grid;grid-template-columns:2.2rem 1fr;gap:.65rem;align-items:center;padding:.75rem 0;border-bottom:1px solid rgba(255,255,255,.14);color:#92978b;text-decoration:none;text-transform:uppercase}
.process-rail a b{font-size:.58rem;letter-spacing:.12em}
.process-rail a span{font-size:.63rem;font-weight:700;letter-spacing:.12em}
.process-rail a[aria-current="step"]{color:#fff}
.process-rail a[aria-current="step"] b{color:var(--acid)}
.rail-progress{position:relative;width:2px;height:7rem;background:rgba(255,255,255,.16)}
.rail-progress span{position:absolute;inset:0;background:var(--acid);transform:scaleY(var(--stage-progress));transform-origin:top;transition:transform .6s cubic-bezier(.2,.8,.2,1)}

.process-story{min-width:0}
.process-stage{position:relative;min-height:100svh;padding:clamp(3.5rem,7vw,8rem) clamp(1rem,5vw,6rem);display:grid;grid-template-columns:minmax(0,.9fr) minmax(20rem,1.1fr);gap:clamp(2rem,6vw,7rem);align-items:center;border-bottom:1px solid var(--line);overflow:hidden}
.process-stage::after{content:"";position:absolute;width:12rem;height:12rem;border:1px dashed currentColor;opacity:.14;transform:rotate(45deg);pointer-events:none}
.process-stage:nth-child(odd)::after{right:-4rem;top:8%}
.process-stage:nth-child(even)::after{left:-5rem;bottom:8%}
.stage-copy{position:relative;z-index:2;max-width:40rem}
.stage-index{margin:0 0 1.2rem;color:var(--accent);font-size:.65rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase}
.stage-copy h2,.workshop-lead h2,.resonance-lead h2,.reflection-lead h2,.context-documentation h2{margin:0;font-size:clamp(3.5rem,7vw,8rem);font-weight:700;line-height:.79;letter-spacing:-.075em}
.stage-copy>p:not(.stage-index),.reflection-lead>p:not(.stage-index),.context-documentation header>p:last-child{max-width:38ch;margin:1.8rem 0 0;font-size:clamp(1rem,1.35vw,1.25rem);line-height:1.55}
.stage-copy blockquote{margin:2.2rem 0 0;padding:1rem 0 1rem 1.3rem;border-left:6px solid var(--accent);font-size:clamp(1.1rem,1.7vw,1.55rem);font-weight:700;line-height:1.25}

.cut-photo{position:relative;margin:0;min-width:0}
.cut-photo::before{content:"";position:absolute;z-index:-1;inset:-1rem;background:rgba(255,255,255,.5);clip-path:polygon(0 4%,96% 0,100% 96%,7% 100%)}
.cut-photo img{width:100%;height:min(72svh,48rem);object-fit:cover;clip-path:polygon(3% 0,100% 4%,96% 100%,0 95%)}
.cut-photo figcaption{display:flex;justify-content:space-between;gap:1rem;margin-top:.8rem;font-size:.6rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.material-notes{margin:2.4rem 0 0;display:grid;grid-template-columns:repeat(3,1fr);border-block:1px solid var(--line)}
.material-notes div{padding:1rem .6rem 1rem 0;border-right:1px solid var(--line)}
.material-notes div:last-child{padding-left:.8rem;border-right:0}
.material-notes dt{font-size:.56rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#5f5b53}
.material-notes dd{margin:.35rem 0 0;font-size:.78rem;font-weight:700}

.stage-found{background:var(--paper-light)}
.stage-found .stage-index{color:#7a2e17}
.stage-found .photo-found img{object-position:52% 51%}
.stage-disassembled{background:#2c2c28;color:#f2eee3}
.stage-disassembled .stage-index{color:#ff9ab2}
.stage-disassembled .stage-copy{order:2}
.stage-disassembled .cut-photo{order:1}
.stage-disassembled .cut-photo::before{background:rgba(255,255,255,.08)}
.stage-disassembled .stage-copy blockquote{color:#fff}

.stage-workshop{min-height:auto;display:block;padding-inline:clamp(1rem,4vw,4.5rem);background:#20221f;color:#f2eee3}
.stage-workshop::before{content:"PRESS / CUT / ROLL / REPEAT";position:absolute;right:-.08em;top:.04em;color:rgba(255,255,255,.035);font-size:clamp(5rem,12vw,13rem);font-weight:700;line-height:.8;letter-spacing:-.08em;writing-mode:vertical-rl;pointer-events:none}
.stage-workshop .stage-index{color:var(--acid)}
.workshop-lead{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1fr) minmax(22rem,.8fr);gap:clamp(2rem,6vw,7rem);align-items:end;margin-bottom:clamp(3rem,6vw,6rem)}
.workshop-lead .stage-index{grid-column:1/-1;margin-bottom:0}
.workshop-lead h2{max-width:9ch}
.workshop-thesis{display:grid;gap:1.2rem}
.workshop-thesis p{margin:0;color:#c9ccc3;font-size:clamp(1rem,1.2vw,1.16rem);line-height:1.58}
.machine-score{position:relative;z-index:2;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));grid-template-rows:repeat(3,minmax(14rem,27vh));gap:clamp(.7rem,1.2vw,1.2rem)}
.machine{min-width:0;min-height:0;margin:0;display:grid;grid-template-rows:minmax(0,1fr) auto;background:#f3eee2;color:var(--ink);border:1px solid rgba(255,255,255,.2)}
.machine img{width:100%;height:100%;min-height:0;object-fit:cover;filter:saturate(.72) contrast(1.04);transition:filter .35s ease}
.machine:hover img{filter:saturate(1) contrast(1.02)}
.machine figcaption{min-height:5.8rem;padding:.85rem 1rem;display:grid;align-content:start;gap:.35rem}
.machine figcaption b{font-size:.62rem;letter-spacing:.11em;text-transform:uppercase}
.machine figcaption span{max-width:34ch;font-size:.72rem;line-height:1.4}
.machine-force{grid-column:1/5;grid-row:1/3}
.machine-wait{grid-column:5/8;grid-row:1/2}
.machine-density{grid-column:8/13;grid-row:1/2}
.machine-edge{grid-column:5/9;grid-row:2/4}
.machine-repeat{grid-column:9/13;grid-row:2/4}
.machine-rhythm{grid-column:1/5;grid-row:3/4}
.machine-force img{object-position:51% 54%}
.machine-wait img{object-position:54% 48%}
.machine-density img{object-position:50% 48%}
.machine-edge img{object-position:49% 50%}
.machine-repeat img{object-position:50% 56%}
.machine-rhythm img{object-position:50% 56%}

.stage-recombined{grid-template-columns:minmax(18rem,.7fr) minmax(0,1.3fr);background:#aeb792}
.stage-recombined .stage-index{color:#243314}
.recombined-pair{display:grid;grid-template-columns:1fr 1fr;gap:clamp(.7rem,1.5vw,1.4rem);align-items:end}
.recombined-pair .cut-photo:first-child{transform:translateY(-5%)}
.recombined-pair .cut-photo:last-child{transform:translateY(5%)}
.recombined-pair .cut-photo img{height:min(68svh,45rem)}
.stage-reread{background:#ed7b91}
.stage-reread .stage-index{color:#351018}
.stage-reread .stage-copy{order:2}
.stage-reread .cut-photo{order:1}
.sign-ledger{margin-top:2.5rem;display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--ink)}
.sign-ledger span{min-height:6.5rem;padding:1rem;display:flex;flex-direction:column;justify-content:space-between;border-right:1px solid var(--ink);border-bottom:1px solid var(--ink)}
.sign-ledger span:nth-child(even){border-right:0}
.sign-ledger span:nth-child(n+3){border-bottom:0}
.sign-ledger b{font-size:clamp(1.7rem,3vw,3rem);letter-spacing:-.06em}
.sign-ledger i{font-style:normal;font-size:.58rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase}

.stage-resonances{min-height:auto;display:block;padding-inline:clamp(1rem,4vw,4.5rem);background:#ece7dc}
.stage-resonances .stage-index{color:#315c86}
.resonance-lead{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(22rem,.72fr);gap:clamp(2rem,6vw,7rem);align-items:end;margin-bottom:clamp(4rem,7vw,8rem)}
.resonance-lead .stage-index{grid-column:1/-1;margin-bottom:0}
.resonance-lead h2{max-width:11ch}
.resonance-lead>div{display:grid;gap:1.2rem}
.resonance-lead>div p{margin:0;font-size:clamp(.95rem,1.18vw,1.15rem);line-height:1.58}
.resonance-lead>div p:first-child{padding-left:1.1rem;border-left:5px solid #315c86}
.reading-wall{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(1.4rem,3.6vw,4rem) clamp(1rem,2.2vw,2.4rem);align-items:start}
.reading{margin:0;padding:.7rem;background:#faf7ef;box-shadow:0 1.2rem 2.8rem rgba(22,24,20,.12)}
.reading img{width:100%;object-fit:cover}
.reading figcaption{padding:.8rem .25rem .35rem;display:grid;grid-template-columns:minmax(5rem,.28fr) minmax(0,1fr);gap:1rem;align-items:start}
.reading figcaption b{font-size:.62rem;letter-spacing:.12em;text-transform:uppercase}
.reading figcaption span{font-size:.74rem;line-height:1.42}
.reading-table{grid-column:1/7;transform:rotate(-1.1deg)}
.reading-blue{grid-column:8/13;margin-top:12%;transform:rotate(1.4deg)}
.reading-books{grid-column:3/11;transform:rotate(-.6deg)}
.reading-field{grid-column:1/7;margin-top:5%;transform:rotate(.8deg)}
.reading-contrast{grid-column:7/13;transform:rotate(-1.2deg)}
.reading-table img,.reading-blue img{aspect-ratio:3/4}
.reading-books img,.reading-field img,.reading-contrast img{aspect-ratio:4/3}
.reading-conclusion{grid-column:2/12;margin:clamp(2rem,5vw,5rem) 0 0;padding:clamp(2rem,4vw,4rem);color:#f4f0e7;background:#171a17;font-size:clamp(1.5rem,3.1vw,3.4rem);font-weight:700;line-height:1.08;letter-spacing:-.045em}

.stage-reflection{min-height:auto;display:block;padding-bottom:clamp(4rem,8vw,9rem);background:#e8e3d8}
.stage-reflection .stage-index{color:#11150f}
.reflection-lead{display:grid;grid-template-columns:minmax(0,1fr) minmax(18rem,.62fr);gap:clamp(2rem,6vw,7rem);align-items:end;margin-bottom:clamp(3rem,7vw,7rem)}
.reflection-lead .stage-index{grid-column:1/-1;margin-bottom:0}
.reflection-lead h2{max-width:10ch}
.reflection-lead>p:not(.stage-index){margin:0}
.final-object{position:relative;margin:0;display:grid;grid-template-columns:minmax(0,1fr) auto;background:#f7f4ed;border:1px solid var(--ink)}
.final-object::before{content:"FINAL / 07";position:absolute;z-index:2;left:1rem;top:1rem;padding:.45rem .55rem;background:var(--acid);font-size:.58rem;font-weight:700;letter-spacing:.12em}
.final-object img{width:100%;height:min(86svh,58rem);object-fit:cover;object-position:50% 47%}
.final-object figcaption{padding:1rem;display:flex;flex-direction:column;justify-content:space-between;border-left:1px solid var(--ink);font-size:.58rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;writing-mode:vertical-rl}

.context-documentation{padding:clamp(4rem,8vw,9rem) clamp(1rem,5vw,6rem);background:#191b17;color:#f1ede3}
.context-documentation header{display:grid;grid-template-columns:minmax(0,1fr) minmax(18rem,.65fr);gap:clamp(2rem,6vw,7rem);align-items:end}
.context-documentation header>p:first-child{grid-column:1/-1;margin:0 0 .2rem;color:var(--acid);font-size:.62rem;font-weight:700;letter-spacing:.15em;text-transform:uppercase}
.context-documentation h2{max-width:10ch}
.context-documentation header>p:last-child{margin:0;color:#c7c9c0}
.context-images{margin-top:clamp(3rem,6vw,6rem);display:grid;grid-template-columns:minmax(0,1.2fr) minmax(18rem,.8fr);gap:1rem;align-items:end}
.context-images figure{margin:0}
.context-images figure:first-child{transform:translateY(-8%)}
.context-images img{width:100%;height:min(65svh,46rem);object-fit:cover;filter:saturate(.78)}
.context-images figure:last-child img{height:min(78svh,52rem);object-position:50% 40%}
.context-images figcaption{margin-top:.65rem;color:#aeb1a7;font-size:.58rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
.network-note{margin-top:clamp(3rem,6vw,6rem);padding:clamp(1.5rem,3vw,3rem);display:grid;grid-template-columns:minmax(11rem,.35fr) minmax(0,1fr);gap:1.2rem clamp(2rem,5vw,6rem);color:var(--ink);background:#d8d1c2}
.network-note p{margin:0;color:#5c3e2c;font-size:.65rem;font-weight:700;line-height:1.4;letter-spacing:.13em;text-transform:uppercase}
.network-note blockquote{grid-column:2;margin:0;font-size:clamp(1.35rem,2.2vw,2.45rem);font-weight:700;line-height:1.12;letter-spacing:-.035em}
.network-note span{grid-column:2;max-width:62ch;font-size:.76rem;line-height:1.5}
.network-note a{grid-column:2;justify-self:start;font-size:.7rem;font-weight:700;letter-spacing:.1em;text-decoration:none;text-transform:uppercase;border-bottom:1px solid currentColor}
.external-context{margin-top:clamp(3rem,6vw,6rem);padding:1.2rem 0;display:grid;grid-template-columns:1fr auto;gap:2rem;align-items:end;border-block:1px solid rgba(255,255,255,.22)}
.external-context p{margin:0;color:var(--acid);font-size:.64rem;font-weight:700;letter-spacing:.13em;text-transform:uppercase}
.external-context span{display:block;max-width:48rem;margin-top:.45rem;color:#aeb1a7;font-size:.7rem;line-height:1.45}
.external-context a{font-size:clamp(1.7rem,3vw,3.2rem);font-weight:700;letter-spacing:-.055em;text-decoration:none;border-bottom:2px solid var(--acid)}

.pack-footer{padding:2rem clamp(1rem,3vw,3.5rem);display:flex;justify-content:space-between;gap:2rem;background:var(--paper);border-top:1px solid var(--ink);font-size:.64rem;line-height:1.55}
.pack-footer p{margin:0}.pack-footer div:last-child{text-align:right}.pack-footer a{display:inline-block;margin-top:.7rem;font-weight:700;text-decoration:none;border-bottom:1px solid currentColor}

@media(max-width:1200px){
  .machine-score{grid-template-columns:1fr 1fr;grid-template-rows:none;grid-auto-rows:minmax(32rem,62vh)}
  .machine-force,.machine-wait,.machine-density,.machine-edge,.machine-repeat,.machine-rhythm{grid-column:auto;grid-row:auto}
}

@media(max-width:1050px){
  .pack-hero{min-height:auto;grid-template-rows:auto auto auto;padding-top:3rem}
  .hero-copy{grid-column:1/8;grid-row:1/2}
  .hero-object{grid-column:7/13;grid-row:1/3;height:48rem}
  .hero-route{grid-column:1/7;grid-row:2;align-self:end;margin-top:3rem}
  .process-layout{grid-template-columns:11rem minmax(0,1fr)}
  .process-stage{grid-template-columns:1fr;padding-inline:clamp(1rem,5vw,4rem)}
  .stage-copy{max-width:48rem}
  .stage-disassembled .stage-copy,.stage-reread .stage-copy{order:1}
  .stage-disassembled .cut-photo,.stage-reread .cut-photo{order:2}
  .stage-recombined{grid-template-columns:1fr}
  .workshop-lead,.resonance-lead{grid-template-columns:1fr}
  .workshop-lead .stage-index,.resonance-lead .stage-index{grid-column:auto}
}

@media(max-width:760px){
  .pack-header{height:3.8rem;grid-template-columns:1fr auto}.pack-header p{display:none}
  .pack-hero{min-height:auto;display:flex;flex-direction:column;padding:2rem 1rem 1rem}
  .hero-copy{order:1}
  .hero-copy h1{font-size:clamp(4.7rem,27vw,8rem);line-height:.68}
  .hero-copy h1 span:first-child{font-size:.3em}
  .hero-copy h1 span:last-child{transform:translateX(.14em);-webkit-text-stroke:1.4px var(--ink)}
  .hero-subtitle,.hero-intro{margin-left:0}
  .hero-object{order:2;width:100%;height:72svh;margin:2rem 0 1rem;transform:rotate(1.2deg)}
  .hero-route{order:3;width:100%;font-size:.54rem;gap:.45rem}
  .dieline{display:none}
  .process-layout{display:block}
  .process-rail{top:3.8rem;height:auto;padding:.65rem 1rem;grid-template-columns:auto minmax(0,1fr);grid-template-rows:auto auto;gap:.5rem 1rem}
  .process-rail>p{grid-row:1/3}.process-rail>p span{font-size:1.8rem}
  .process-rail ol{grid-column:2;display:flex;overflow-x:auto;scrollbar-width:none;gap:1rem}
  .process-rail ol::-webkit-scrollbar{display:none}
  .process-rail li{flex:0 0 auto}
  .process-rail a{display:flex;grid-template-columns:none;gap:.4rem;padding:.35rem 0;border:0;white-space:nowrap}
  .process-rail a span{font-size:.55rem}
  .rail-progress{grid-column:2;width:100%;height:2px}
  .rail-progress span{transform:scaleX(var(--stage-progress));transform-origin:left}
  .process-stage{min-height:auto;padding:5rem 1rem;gap:2.7rem}
  .stage-copy h2,.workshop-lead h2,.resonance-lead h2,.reflection-lead h2,.context-documentation h2{font-size:clamp(3.2rem,17vw,5.5rem);line-height:.82}
  .cut-photo img{height:72svh}
  .material-notes{grid-template-columns:1fr}.material-notes div,.material-notes div:last-child{padding:1rem 0;border-right:0;border-bottom:1px solid var(--line)}.material-notes div:last-child{border-bottom:0}
  .recombined-pair{display:block}.recombined-pair .cut-photo{transform:none}.recombined-pair .cut-photo+figure{margin-top:3rem}.recombined-pair .cut-photo img{height:68svh}
  .sign-ledger{grid-template-columns:1fr}.sign-ledger span,.sign-ledger span:nth-child(even),.sign-ledger span:nth-child(n+3){border-right:0;border-bottom:1px solid var(--ink)}.sign-ledger span:last-child{border-bottom:0}
  .workshop-lead,.resonance-lead,.reflection-lead,.context-documentation header{display:block}.workshop-lead h2,.resonance-lead h2,.reflection-lead h2,.context-documentation h2{margin-top:1rem}.workshop-thesis,.resonance-lead>div,.reflection-lead>p:not(.stage-index),.context-documentation header>p:last-child{margin-top:1.5rem}
  .stage-workshop,.stage-resonances{padding-inline:1rem}
  .stage-workshop::before{display:none}
  .machine-score{margin-inline:-1rem;padding-inline:1rem;display:flex;gap:.85rem;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding:1rem;scrollbar-width:none}
  .machine-score::-webkit-scrollbar{display:none}
  .machine{flex:0 0 min(84vw,25rem);height:72svh;scroll-snap-align:start}
  .machine figcaption{min-height:6.6rem}
  .reading-wall{display:block}
  .reading{margin:0 0 2.8rem;transform:none}
  .reading-blue,.reading-field{margin-top:0}
  .reading figcaption{grid-template-columns:1fr;gap:.45rem}
  .reading-conclusion{margin:4rem 0 0}
  .final-object{display:block}.final-object img{height:78svh}.final-object figcaption{display:flex;flex-direction:row;border-top:1px solid var(--ink);border-left:0;writing-mode:horizontal-tb}
  .context-documentation{padding:5rem 1rem}
  .context-images{grid-template-columns:1fr;margin-top:3rem}.context-images figure:first-child{transform:none}.context-images img,.context-images figure:last-child img{height:68svh}
  .network-note{grid-template-columns:1fr}.network-note blockquote,.network-note span,.network-note a{grid-column:1}
  .external-context{grid-template-columns:1fr;align-items:start}.external-context a{justify-self:start}
  .pack-footer{flex-direction:column}.pack-footer div:last-child{text-align:left}
}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .hero-object{transition:none;transform:rotate(1.8deg)}
  .rail-progress span{transition:none}
}

/* v1.146 PROJECT WIDE CANVAS
   Keep the process navigation compact so ultrawide space goes to the work. */
@media(min-width:1600px){
  .hero-object{width:min(100%,50rem);height:min(78svh,56rem)}
}

@media(min-width:2200px){
  .process-layout{grid-template-columns:minmax(18rem,22rem) minmax(0,1fr)}
  .pack-header a,.pack-header p,.pack-header>span{font-size:clamp(.72rem,.48vw,.9rem)}
  .pack-hero{grid-template-columns:repeat(14,minmax(0,1fr));gap:clamp(2rem,3vw,5rem);padding:clamp(3rem,5vw,7rem) clamp(3rem,6vw,10rem) clamp(2.5rem,4vw,5rem)}
  .hero-copy{grid-column:1/7}
  .eyebrow{margin-bottom:clamp(1.2rem,2vw,2.4rem);font-size:clamp(.7rem,.48vw,.9rem)}
  .hero-copy h1{font-size:clamp(9rem,11.8vw,17rem)}
  .hero-copy h1 span:last-child{-webkit-text-stroke:clamp(2px,.1vw,4px) var(--ink)}
  .hero-subtitle{margin-top:clamp(2rem,3vw,3.8rem);font-size:clamp(2rem,2.55vw,3.6rem)}
  .hero-intro{max-width:43ch;margin-top:clamp(1.4rem,2vw,2.4rem);font-size:clamp(1.08rem,.9vw,1.38rem)}
  .hero-object{grid-column:8/15;width:min(100%,72rem);height:min(84svh,76rem)}
  .hero-object figcaption{font-size:clamp(.62rem,.42vw,.82rem)}
  .hero-route{grid-column:1/11;font-size:clamp(.66rem,.42vw,.82rem)}
}

@media(min-width:2200px){html{font-size:clamp(17px,.78vw,21px)}}

/* ─────────────────────────────────────────────────────────────
   Dunkle Darstellung.
   Diese Seite reiht gesetzte Farbflächen aneinander, keine Palette.
   Jede Fläche bekommt darum ihr eigenes dunkles Gegenstück und behält
   ihren Charakter: Oliv bleibt oliv, Rosa bleibt rosa, Karton bleibt
   Karton. Eine gemeinsame Schriftfarbe passt sonst zu keiner Hälfte.
   ───────────────────────────────────────────────────────────── */
[data-theme="dark"] {
  --paper: #1a1813;
  --paper-light: #26221b;
  --ink: #ded7c8;
  --panel-dark: #161814;
  --card: #241f18;
  --line: rgba(222, 215, 200, .22);
  --amber: #e08a5f;
}

[data-theme="dark"] .stage-recombined { background: #2a2e22; }
[data-theme="dark"] .stage-reread     { background: #3a2028; }
[data-theme="dark"] .stage-reflection { background: #1e1b16; }
[data-theme="dark"] .stage-resonances { background: #201d17; }
[data-theme="dark"] .machine          { background: #232019; }
[data-theme="dark"] .final-object     { background: #26221b; }
[data-theme="dark"] .reading          { background: #26221b; }
[data-theme="dark"] .network-note     { background: #221f19; color: var(--ink); }
[data-theme="dark"] .pack-header      { background: rgba(26, 24, 19, .9); }
[data-theme="dark"] .hero-object::before { background: #221f19; }

/* Die letzte helle Fläche und die dunklen Akzentschriften, die auf
   dunklem Grund nicht mehr tragen. */
[data-theme="dark"] .stage-found { background: #211e18; }
[data-theme="dark"] .stage-recombined .stage-index { color: #cfe0a8; }
[data-theme="dark"] .stage-reread .stage-index { color: #f2b7c2; }
[data-theme="dark"] .network-note p { color: #d8b89a; }
[data-theme="dark"] .stage-resonances .stage-index,
[data-theme="dark"] .resonance-lead>div p:first-child { color: #9dc4e8; }
[data-theme="dark"] .skip-link { color: #161814; }
[data-theme="dark"] .stage-found .stage-index { color: #e8a07e; }
[data-theme="dark"] .material-notes dt { color: #b3ada2; }
[data-theme="dark"] .stage-reflection .stage-index { color: #b3ada2; }

/* ─────────────────────────────────────────────────────────────
   Schrift auf der Signalfarbe bleibt in beiden Darstellungen dunkel.
   --ink ist im dunklen Thema hell; ohne diese Regel verschwindet
   jede Beschriftung auf dem Acid-Grund. Vollständig erzeugt aus
   allen Stellen, die diesen Grund setzen.
   ───────────────────────────────────────────────────────────── */
[data-theme="dark"] .skip-link { color: #101010; }
[data-theme="dark"] .rail-progress span { color: #101010; }
[data-theme="dark"] .final-object::before { color: #101010; }

/* Die Kopfzeile trägt einen fest notierten hellen Grund. */
[data-theme="dark"] .pack-header { background: rgba(26,24,19,.9); }

/* Die Prozessstufen ohne eigene Farbe lagen im dunklen Thema alle auf
   dem Grund auf, zwischen 1.01 und 1.07. Sie bekommen die gemeinsame
   Flaeche, die Maschinen und die Lesewand die Stufe darueber. Olive
   und Rosa bleiben, sie tragen Bedeutung.
   Grund #1a1813 -> Flaeche #2f2c26 (1.28) -> Karte #3d3933 (1.21). */
[data-theme="dark"] { --panel-dark: #2f2c26; }
[data-theme="dark"] .stage-found,
[data-theme="dark"] .stage-resonances,
[data-theme="dark"] .stage-reflection,
[data-theme="dark"] .stage-workshop { background: #2f2c26; }
[data-theme="dark"] .machine,
[data-theme="dark"] .reading-conclusion,
[data-theme="dark"] .final-object,
[data-theme="dark"] .reading,
[data-theme="dark"] .network-note,
[data-theme="dark"] .hero-object::before { background: #3d3933; }