@font-face{font-family:"Inter Display";src:url("/assets/fonts/InterDisplay-Regular.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Inter Display";src:url("/assets/fonts/InterDisplay-Medium.woff2") format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Inter Display";src:url("/assets/fonts/InterDisplay-SemiBold.woff2") format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"Inter Display";src:url("/assets/fonts/InterDisplay-Bold.woff2") format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:"Inter Display";src:url("/assets/fonts/InterDisplay-Black.woff2") format("woff2");font-weight:900;font-display:swap}

:root{
  --paper:#F4F0E6;--sheet:#FBF8F1;--ink:#1E1F1D;--ink2:#4A4B47;--rule:rgba(30,31,29,.18);--red:#B33A24;
  --pad:clamp(1.25rem,5vw,4.5rem);
  --sans:"Inter Display",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --serif:Georgia,"Times New Roman",serif;
}
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:400 1.0625rem/1.6 var(--serif)}
h1,h2,h3,h4{margin:0;font-weight:400}
p{margin:0}
a{color:inherit}
:focus-visible{outline:2px solid var(--red);outline-offset:3px}
.defs{position:absolute;width:0;height:0;overflow:hidden}
.frame{max-width:1440px;margin:0 auto}
.g{padding-inline:var(--pad)}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:1rem;top:-5rem;z-index:2;background:var(--ink);color:var(--paper);padding:.75rem 1rem;font:600 1rem/1 var(--sans)}
.skip:focus{top:1rem}

/* header */
.top{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.5rem 2rem;padding:1rem var(--pad);border-bottom:1px solid var(--ink)}
.brand-group{display:flex;align-items:center;flex-wrap:wrap;gap:.25rem 1.25rem}
.brand{display:flex;align-items:center;gap:.6rem;font:900 1.75rem/1 var(--sans);letter-spacing:-.03em}
.glyph{width:40px;height:30px;flex:none}
.g-ink{fill:none;stroke:var(--ink);stroke-width:2.2}
.g-red{fill:none;stroke:var(--red);stroke-width:1.6;stroke-dasharray:4 2.5}
.g-redf{fill:var(--red)}
.concept{font:500 .8125rem/1.3 var(--sans);color:var(--ink2)}
.back{display:inline-block;padding:.6rem 0;font:600 .9375rem/1.3 var(--sans);text-underline-offset:.2em}

/* opening plate */
.open{padding-top:clamp(2.5rem,6vw,5rem)}
.open-head{display:grid;gap:1.25rem}
.plate00{display:flex;flex-direction:column;gap:.15rem;max-width:16rem;font:500 .875rem/1.4 var(--sans);color:var(--ink2)}
.plate00 b{font-weight:700;color:var(--ink)}
h1{font:400 clamp(2.5rem,1.1rem + 5.6vw,6.5rem)/1 var(--serif);letter-spacing:-.025em;max-width:13ch}
.open-fig{margin:clamp(2rem,4vw,3.5rem) 0 0;border-block:1px solid var(--rule);overflow:hidden}
.open-fig svg{display:block;width:230%;height:auto;margin-left:-65%}
.open-foot{display:grid;gap:1.25rem;padding-block:2rem clamp(3rem,6vw,5rem)}
.lead{font-size:clamp(1.125rem,1rem + .5vw,1.375rem);line-height:1.5;max-width:36em}
.disclose{font:500 .875rem/1.5 var(--sans);color:var(--ink2);max-width:30em}
@media (min-width:900px){
  .open-head{grid-template-columns:repeat(12,1fr);align-items:end}
  .plate00{grid-column:1/4;padding-bottom:.7rem}
  h1{grid-column:4/13}
  .open-fig svg{width:100%;margin-left:0}
  .open-foot{grid-template-columns:repeat(12,1fr)}
  .lead{grid-column:4/10}
  .disclose{grid-column:10/13;padding-top:.35rem}
}

/* sections */
.sec{padding-block:clamp(3.5rem,7vw,6.5rem);border-top:1px solid var(--ink)}
.sec-h{font:400 clamp(2rem,1.4rem + 2.6vw,3.5rem)/1.05 var(--serif);letter-spacing:-.015em}
.sec-lead{margin-top:1rem;max-width:34em;color:var(--ink2)}

/* chips and buttons */
fieldset{border:0;margin:0;padding:0;min-width:0}
legend{padding:0;margin-bottom:.6rem;font:600 .875rem/1.3 var(--sans);color:var(--ink2)}
.chips{display:flex;flex-wrap:wrap;gap:.5rem}
.chip{position:relative;display:inline-flex}
.chip input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.chip span{display:inline-flex;align-items:center;min-height:44px;padding:.5rem 1rem;border:1px solid var(--ink);font:500 .9375rem/1.2 var(--sans)}
.chip input:hover+span{background:rgba(30,31,29,.07)}
.chip input:checked+span{background:var(--ink);color:var(--paper);box-shadow:inset 0 -3px 0 var(--red)}
.chip--check input:checked+span::before{content:"";width:.5rem;height:.5rem;margin-right:.5rem;background:var(--paper)}
.chip input:focus-visible+span{outline:2px solid var(--red);outline-offset:2px}
.chip input:disabled{cursor:not-allowed}
.chip input:disabled+span{border-style:dashed;color:var(--ink2);text-decoration:line-through;background:transparent}
.btn,.btn-line{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:.7rem 1.25rem;border:1px solid var(--ink);border-radius:0;font:600 .9375rem/1.2 var(--sans);text-decoration:none;cursor:pointer}
.btn{background:var(--ink);color:var(--paper)}
.btn:hover{background:#3A3B37}
.btn-line{background:transparent;color:var(--ink)}
.btn-line:hover{background:rgba(30,31,29,.07)}
.btn-line:disabled{opacity:.4;cursor:not-allowed}
.btn-lg{min-height:56px;padding:1rem 1.75rem;font-size:1.0625rem}

/* archive */
.index{display:grid;gap:1.25rem 4rem}
.filters{margin-top:.75rem}
.filters fieldset+fieldset{margin-top:1.25rem}
.filter-foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.75rem;margin-top:1.5rem;padding-top:1rem;border-top:1px solid var(--rule)}
.count{font:600 .9375rem/1.3 var(--sans)}
@media (min-width:1100px){
  .index{grid-template-columns:5fr 7fr}
  .index .sec-h,.index .sec-lead{grid-column:1}
  .index .sec-lead{margin-top:0}
  .filters{grid-column:2;grid-row:1/span 2;margin-top:.5rem}
}
.plates{display:grid;gap:3.5rem 2.5rem;margin-top:clamp(2.5rem,5vw,4rem);align-items:start}
.plate{border-top:1px solid var(--ink);padding-top:1rem}
.plate-fig{margin:0 0 1.1rem;background:var(--sheet);border:1px solid var(--rule)}
.plate-fig svg,.insp-fig svg{display:block;width:100%;height:auto}
.plate-meta{display:grid;grid-template-columns:auto 1fr;column-gap:1.1rem;row-gap:.3rem;align-items:start}
.plate-meta>*{grid-column:2}
.plate-no{grid-column:1;grid-row:1/span 4;font:900 clamp(2.75rem,2rem + 2.4vw,4rem)/.82 var(--sans);letter-spacing:-.04em}
.plate-meta h3{font:400 clamp(1.375rem,1.1rem + .9vw,1.75rem)/1.15 var(--serif)}
.plate-tags{font:500 .875rem/1.3 var(--sans);color:var(--ink2)}
.essence{max-width:30em}
.inspect{justify-self:start;margin-top:.6rem}
.empty{display:grid;gap:1rem;justify-items:start;padding:2rem 0;border-top:1px solid var(--ink)}
@media (min-width:700px){.plates{grid-template-columns:1fr 1fr}}
@media (min-width:1100px){
  .plates{grid-template-columns:repeat(12,1fr);column-gap:3rem}
  .plate{grid-column:span 5}
  .plate--wide{grid-column:span 7}
  .plate--drop{margin-top:5rem}
  .empty{grid-column:1/-1}
}

/* project text */
.plate-more{margin-top:1.25rem;border-top:1px solid var(--rule)}
.plate-more summary{min-height:44px;padding:.8rem 0;font:600 .9375rem/1.3 var(--sans);cursor:pointer}
.plate-body{display:grid;gap:1.75rem;padding-top:.75rem}
.pb-aside h4,.pb-sec h4,.sb-sec h4{margin-bottom:.4rem;font:600 .8125rem/1.3 var(--sans);color:var(--ink2)}
.pb-text{display:grid;gap:1.25rem}
.pb-sec p{max-width:38em}
.key,.moves{list-style:none;counter-reset:k;margin:.25rem 0 0;padding:0;font:400 .9375rem/1.45 var(--sans)}
.key li,.moves li{counter-increment:k;display:grid;grid-template-columns:1.6rem 1fr;gap:.6rem;padding:.3rem 0}
.key li::before,.moves li::before{content:counter(k);display:grid;place-items:center;width:1.5rem;height:1.5rem;border:1.5px solid var(--red);border-radius:50%;color:var(--red);font:600 .75rem/1 var(--sans)}
.facts{width:100%;margin-top:1.25rem;border-collapse:collapse;font:400 .875rem/1.4 var(--sans)}
.facts caption{text-align:left;font-weight:600;padding-bottom:.4rem}
.facts th,.facts td{text-align:left;vertical-align:top;padding:.45rem 0;border-top:1px solid var(--rule)}
.facts th{width:40%;padding-right:1rem;font-weight:500;color:var(--ink2)}

/* inspector */
.inspector{margin-top:clamp(2.5rem,5vw,4rem);padding:clamp(1rem,3vw,2rem);border:1px solid var(--ink);background:var(--sheet)}
.insp-bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.75rem;padding-bottom:1rem;border-bottom:1px solid var(--rule)}
.insp-pos{font:600 .875rem/1.3 var(--sans);color:var(--ink2)}
.insp-btns{display:flex;flex-wrap:wrap;gap:.5rem}
.insp-head{display:grid;gap:.35rem;padding:1.25rem 0 1.25rem}
.insp-head h3{font:400 clamp(1.75rem,1.2rem + 2vw,2.75rem)/1.1 var(--serif)}
.insp-grid{display:grid;gap:2rem}
.insp-fig{margin:0;border:1px solid var(--rule);background:var(--paper)}
.insp-fig figcaption{padding:.6rem .8rem;border-top:1px solid var(--rule);font:400 .8125rem/1.4 var(--sans);color:var(--ink2)}
.insp-body .plate-body{padding-top:0}
@media (min-width:1100px){
  .insp-grid{grid-template-columns:7fr 5fr;align-items:start}
  .insp-fig{position:sticky;top:1rem}
}

/* builder */
.builder .g{display:grid;gap:2.5rem}
@media (min-width:1100px){
  .builder .g{grid-template-columns:5fr 1fr 6fr;align-items:start}
  .b-head,.bform{grid-column:1}
  .b-out{grid-column:3;grid-row:1/span 2}
}
.bform{display:grid;gap:1.75rem}
.bform fieldset{padding-top:1.1rem;border-top:1px solid var(--ink)}
.bform legend{float:left;width:100%;margin-bottom:.75rem;font:600 1.125rem/1.3 var(--sans);color:var(--ink)}
.bform fieldset>:not(legend){clear:both}
.step{display:inline-block;min-width:2.1rem;font-weight:900;color:var(--ink2)}
.hint{margin-bottom:.6rem;font:400 .875rem/1.45 var(--sans);color:var(--ink2)}
.combo{margin:.75rem 0 0}
.err{margin-bottom:.6rem;font:600 .875rem/1.4 var(--sans);color:var(--red)}
.err-summary{padding:1rem 1.25rem;border:2px solid var(--red);background:var(--sheet)}
.err-summary h3{margin-bottom:.4rem;font:600 1rem/1.3 var(--sans)}
.err-summary ul{margin:0;padding-left:1.2rem;font:400 .9375rem/1.5 var(--sans)}
.err-summary a{color:var(--red)}
.b-actions{display:flex;flex-wrap:wrap;gap:.75rem}
.status{min-height:1.4em;font:500 .9375rem/1.4 var(--sans);color:var(--ink2)}
.sample-note{margin-bottom:.75rem;font:500 .875rem/1.45 var(--sans);color:var(--ink2)}

/* sheet */
.sheet{background:var(--sheet);border:1px solid var(--ink)}
.tb{display:grid;grid-template-columns:1fr 1fr;margin:0;border-bottom:1px solid var(--ink)}
.tb>div{padding:.6rem .9rem;border-bottom:1px solid var(--rule);border-right:1px solid var(--rule)}
.tb dt{font:500 .75rem/1.3 var(--sans);color:var(--ink2)}
.tb dd{margin:.15rem 0 0;font:600 .9375rem/1.35 var(--sans)}
.tb .tb-no,.tb .tb-wide,.tb .tb-scale{grid-column:1/-1}
.tb-no h3{font:400 1.5rem/1.2 var(--serif)}
@media (min-width:600px){.tb{grid-template-columns:repeat(4,1fr)}.tb .tb-wide{grid-column:span 2}}
.sb{display:grid;gap:1.5rem;padding:clamp(1rem,2.5vw,1.5rem)}
.gen{margin:0}
.gen svg{display:block;width:100%;height:auto;background:var(--paper);border:1px solid var(--rule)}
.legend{display:flex;flex-wrap:wrap;gap:.25rem 1.25rem;margin:.6rem 0 0;padding:0;list-style:none;font:400 .8125rem/1.4 var(--sans);color:var(--ink2)}
.sb-sec p{font-size:1rem;max-width:38em}
.seq,.qs{margin:.25rem 0 0;padding-left:1.4rem;font-size:1rem}
.seq li,.qs li{padding:.15rem 0}
.tension{padding-left:1rem;border-left:3px solid var(--ink)}

/* method */
.m-head{margin-bottom:2.5rem}
.stages{list-style:none;counter-reset:s;margin:0;padding:0 var(--pad);display:grid}
.stages li{counter-increment:s;display:grid;grid-template-columns:3rem 1fr;gap:.25rem 1rem;padding:1rem 0 1.5rem;border-top:1px solid var(--ink)}
.stages li::before{content:counter(s,decimal-leading-zero);grid-row:1/span 2;font:900 1.5rem/1 var(--sans)}
.stages h3{font:600 1.125rem/1.3 var(--sans)}
.stages p{font-size:1rem;color:var(--ink2)}
@media (min-width:900px){
  .stages{grid-template-columns:repeat(5,1fr);gap:1.75rem}
  .stages li{grid-template-columns:1fr}
  .stages li::before{grid-row:auto;margin-bottom:.9rem;font-size:2.25rem}
}

/* closing */
.closing{display:grid;justify-items:start;gap:1.5rem;padding:clamp(3.5rem,7vw,6rem) var(--pad);border-top:1px solid var(--ink)}
.close-line{max-width:22ch;font:400 clamp(1.625rem,1.2rem + 2vw,2.75rem)/1.15 var(--serif)}
.colophon{max-width:40em;font:400 .875rem/1.5 var(--sans);color:var(--ink2)}

/* drawing language */
svg.d .earth{fill:url(#he)}
svg.d .void{fill:#FBF8F1}
svg.d .gr{fill:none;stroke:var(--ink);stroke-width:1.5}
svg.d .cut{fill:url(#hc);stroke:var(--ink);stroke-width:1.2}
svg.d .tm{fill:url(#ht);stroke:var(--ink);stroke-width:1}
svg.d .gl{fill:none;stroke:var(--ink2);stroke-width:1}
svg.d .ln{fill:none;stroke:var(--ink);stroke-width:.8}
svg.d .ray{fill:none;stroke:var(--ink2);stroke-width:1;stroke-dasharray:4 4}
svg.d .lift{fill:none;stroke:var(--ink);stroke-width:.9;stroke-dasharray:3 3}
svg.d .cm{fill:none;stroke:var(--red);stroke-width:1.5;stroke-dasharray:12 5 2 5}
svg.d .cmf{fill:var(--red)}
svg.d .cmt{fill:var(--red);font:700 18px var(--sans)}
svg.d .mk circle{fill:#FBF8F1;stroke:var(--red);stroke-width:1.5}
svg.d .mk text{fill:var(--red);font:700 13px var(--sans);text-anchor:middle;dominant-baseline:central}
svg.d .lv{fill:var(--ink2);font:600 12px var(--sans);text-anchor:middle;dominant-baseline:central}

@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* Allow user text-spacing preferences to reflow on narrow screens. */
.open-head > * { min-width:0; overflow-wrap:anywhere; }