
:root{
  --paper:#F2F0EC; --surface:#FFFFFF; --surface-2:#EAE7E1;
  --ink:#1C1B19; --muted:#6C665D; --line:#DEDAD2; --line-2:#C9C3B8;
  --brass:#8A6A3B; --brass-soft:#8A6A3B14;
  --patina:#3E5C61; --patina-soft:#3E5C6114;
  --ok:#3F6B4A; --ok-soft:#3F6B4A16;
  --warn:#966A1E; --warn-soft:#966A1E18;
  --stop:#9E3B2F; --stop-soft:#9E3B2F16;
  --f-display:"Instrument Serif",Georgia,serif;
  --f-body:"Archivo",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --f-mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --measure:64ch;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --paper:#14161A; --surface:#1B1E23; --surface-2:#232830;
  --ink:#E8E5DF; --muted:#9A948B; --line:#282C33; --line-2:#39404A;
  --brass:#C69A5E; --brass-soft:#C69A5E1F;
  --patina:#7FA9B0; --patina-soft:#7FA9B01F;
  --ok:#68A97C; --ok-soft:#68A97C1F;
  --warn:#D2A353; --warn-soft:#D2A3531F;
  --stop:#DB7C6C; --stop-soft:#DB7C6C1F;
}}
:root[data-theme="dark"]{
  --paper:#14161A; --surface:#1B1E23; --surface-2:#232830;
  --ink:#E8E5DF; --muted:#9A948B; --line:#282C33; --line-2:#39404A;
  --brass:#C69A5E; --brass-soft:#C69A5E1F;
  --patina:#7FA9B0; --patina-soft:#7FA9B01F;
  --ok:#68A97C; --ok-soft:#68A97C1F;
  --warn:#D2A353; --warn-soft:#D2A3531F;
  --stop:#DB7C6C; --stop-soft:#DB7C6C1F;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--f-body);
  font-size:15px;line-height:1.62;-webkit-font-smoothing:antialiased}
a{color:var(--brass)}
.shell{max-width:1080px;margin:0 auto;padding:0 28px}

/* ---- header ---- */
header.top{border-bottom:1px solid var(--line);background:var(--surface);position:sticky;top:0;z-index:20}
.top .shell{display:flex;align-items:center;gap:26px;height:62px}
.brand{display:flex;align-items:baseline;gap:9px;text-decoration:none;color:var(--ink);
  margin-right:auto;white-space:nowrap}
.brand b{font-family:var(--f-display);font-size:21px;font-weight:400;letter-spacing:.005em}
.brand span{font-family:var(--f-mono);font-size:10px;letter-spacing:.13em;text-transform:uppercase;color:var(--brass)}
nav.main{display:flex;gap:22px;align-items:center}
nav.main a{font-size:13.5px;text-decoration:none;color:var(--muted);padding:4px 0;border-bottom:1.5px solid transparent}
nav.main a:hover{color:var(--ink)}
nav.main a.on{color:var(--ink);border-bottom-color:var(--brass)}
.btn{display:inline-block;font-size:13.5px;font-weight:600;text-decoration:none;
  padding:8px 16px;border-radius:2px;border:1px solid var(--brass);color:var(--brass);background:transparent;cursor:pointer;font-family:inherit}
.btn:hover{background:var(--brass-soft)}
.btn.solid{background:var(--brass);color:#fff;border-color:var(--brass)}
.btn.solid:hover{filter:brightness(1.07)}
.btn.quiet{border-color:var(--line-2);color:var(--muted)}
.btn.quiet:hover{background:var(--surface-2);color:var(--ink)}

/* ---- profile chip ---- */
.who{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink)}
.avatar{width:32px;height:32px;border-radius:50%;background:var(--brass);color:#fff;
  display:grid;place-items:center;font-weight:600;font-size:13px;flex:none;overflow:hidden}
.avatar img{width:100%;height:100%;object-fit:cover}
.who .nm{font-size:13px;line-height:1.2}
.who .rl{font-family:var(--f-mono);font-size:10px;color:var(--muted);letter-spacing:.04em}

/* ---- type ---- */
h1{font-family:var(--f-display);font-weight:400;font-size:clamp(34px,5vw,52px);
  line-height:1.06;letter-spacing:-.005em;margin:0 0 18px;text-wrap:balance}
h2{font-family:var(--f-display);font-weight:400;font-size:30px;line-height:1.15;margin:0 0 14px;letter-spacing:-.004em}
h3{font-size:15px;font-weight:600;margin:0 0 6px}
p{margin:0 0 14px;max-width:var(--measure)}
.lede{font-size:17px;color:var(--muted);max-width:var(--measure)}
.eyebrow{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.15em;text-transform:uppercase;
  color:var(--brass);margin:0 0 14px}
.rule{height:1px;background:var(--line);border:0;margin:0}
section{padding:64px 0}
.mono{font-family:var(--f-mono)}

/* ---- catalog grid ---- */
.cat{display:grid;grid-template-columns:repeat(auto-fit,minmax(268px,1fr));gap:1px;
  background:var(--line);border:1px solid var(--line)}
.svc{background:var(--surface);padding:22px 22px 20px;display:flex;flex-direction:column;gap:9px}
.svc .idx{font-family:var(--f-mono);font-size:10px;color:var(--muted);letter-spacing:.1em}
.svc h3{font-size:16.5px;margin:0}
.svc p{font-size:13.5px;color:var(--muted);margin:0;max-width:none;line-height:1.55}
.svc .meta{margin-top:auto;padding-top:12px;display:flex;flex-wrap:wrap;gap:6px}
.svc.has-vid{grid-column:1/-1}
.svc.has-vid p{max-width:var(--measure)}
.tag{font-family:var(--f-mono);font-size:10px;letter-spacing:.05em;padding:2.5px 7px;
  border-radius:2px;background:var(--patina-soft);color:var(--patina)}
.tag.brass{background:var(--brass-soft);color:var(--brass)}
.svc h3 a{color:var(--ink);text-decoration:none;border-bottom:1px solid var(--line-2)}
.svc h3 a:hover{color:var(--brass);border-bottom-color:var(--brass)}
.ext{font-family:var(--f-mono);font-size:11px;margin-left:5px;color:var(--muted)}
.svc h3 a:hover .ext{color:var(--brass)}

/* ---- consulting offerings ---- */
.offer{background:var(--surface);border:1px solid var(--line);padding:22px 24px;
  display:flex;flex-direction:column;gap:10px}
.offer h3{font-size:16.5px;margin:0}
.offer p{font-size:13.5px;color:var(--muted);margin:0;max-width:none;line-height:1.58}
.offer .meta{margin-top:auto;padding-top:10px;display:flex;flex-wrap:wrap;gap:6px}
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(212px,1fr));gap:1px;
  background:var(--line);border:1px solid var(--line)}
.steps>div{background:var(--surface);padding:20px 22px}
.steps .idx{display:block;font-family:var(--f-mono);font-size:10px;letter-spacing:.1em;
  color:var(--brass);margin-bottom:9px}
.steps h3{margin:0 0 6px;font-size:15.5px}
.steps p{margin:0;font-size:13.5px;color:var(--muted);max-width:none;line-height:1.58}
.linklist{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:10px 20px;
  font-size:14px;align-items:center}

/* ---- status pills ---- */
.pill{display:inline-block;font-family:var(--f-mono);font-size:10px;font-weight:600;
  letter-spacing:.07em;text-transform:uppercase;padding:2.5px 8px;border-radius:2px}
.pill.ok{background:var(--ok-soft);color:var(--ok)}
.pill.warn{background:var(--warn-soft);color:var(--warn)}
.pill.stop{background:var(--stop-soft);color:var(--stop)}
.pill.idle{background:var(--surface-2);color:var(--muted)}

/* ---- cards / panels ---- */
.panel{background:var(--surface);border:1px solid var(--line);padding:22px 24px}
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px}

/* ---- forms ---- */
form.stack{display:flex;flex-direction:column;gap:15px;max-width:440px}
label{display:block;font-size:12px;font-weight:600;letter-spacing:.02em;color:var(--muted);margin-bottom:5px}
input,select,textarea{width:100%;font-family:inherit;font-size:14.5px;color:var(--ink);
  background:var(--surface);border:1px solid var(--line-2);border-radius:2px;padding:9px 11px}
textarea{min-height:120px;resize:vertical;line-height:1.55}
input:focus,select:focus,textarea:focus{outline:2px solid var(--brass);outline-offset:-1px;border-color:var(--brass)}
.hint{font-size:12px;color:var(--muted);margin-top:5px}
.notice{border-left:3px solid var(--brass);background:var(--surface);padding:14px 18px;margin:0 0 22px}
.notice.bad{border-left-color:var(--stop)}
.notice.good{border-left-color:var(--ok)}
.notice p{margin:0;font-size:14px}

/* ---- tables ---- */
.scroll{overflow-x:auto;border:1px solid var(--line);background:var(--surface)}
table{border-collapse:collapse;width:100%;font-size:13px}
th{font-family:var(--f-mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;
  color:var(--muted);text-align:left;padding:10px 14px;background:var(--surface-2);
  border-bottom:1px solid var(--line-2);white-space:nowrap}
td{padding:9px 14px;border-bottom:1px solid var(--line);vertical-align:top}
tr:last-child td{border-bottom:0}
td.num{font-family:var(--f-mono);font-variant-numeric:tabular-nums}

/* ---- figure ---- */
figure{margin:0}
figure svg{display:block;width:100%;height:auto}
figcaption{font-size:12.5px;color:var(--muted);margin-top:12px;max-width:var(--measure)}
.dw-fill{fill:var(--surface)} .dw-line{stroke:var(--line-2);fill:none}
.dw-accent{stroke:var(--brass);fill:none} .dw-accent-f{fill:var(--brass-soft);stroke:var(--brass)}
.dw-patina-f{fill:var(--patina-soft);stroke:var(--patina)}
.dw-t{fill:var(--ink);font-family:"Archivo",sans-serif;font-size:12px}
.dw-m{fill:var(--muted);font-family:"JetBrains Mono",monospace;font-size:9.5px}
.dw-b{fill:var(--brass);font-family:"JetBrains Mono",monospace;font-size:9.5px}

footer.bot{border-top:1px solid var(--line);margin-top:40px;padding:26px 0 46px;
  font-size:12.5px;color:var(--muted)}
footer.bot .shell{display:flex;gap:18px;flex-wrap:wrap;align-items:baseline}

:focus-visible{outline:2px solid var(--brass);outline-offset:2px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip{position:absolute;left:-9999px;top:0;z-index:40}
.skip:focus{left:10px;top:10px;padding:8px 14px;background:var(--surface);color:var(--ink);
  border:1px solid var(--brass);border-radius:2px;text-decoration:none;font-size:13.5px}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
@media (max-width:1040px){nav.main{gap:16px}}
/* The nav is never hidden — before the header can get cramped it folds onto its
   own row, which scrolls sideways if it has to, so every page stays reachable
   from a phone. */
@media (max-width:900px){
  .top .shell{gap:12px;height:auto;flex-wrap:wrap;padding-top:10px;padding-bottom:8px}
  nav.main{order:3;flex:1 0 100%;overflow-x:auto;padding-bottom:3px}
  nav.main a{white-space:nowrap}
}
@media (max-width:720px){
  .shell{padding:0 18px} section{padding:44px 0}
  .top .shell{gap:10px}
  nav.main{gap:15px} nav.main a{font-size:13px}
  .brand{gap:7px} .brand b{font-size:18px}
  .btn{padding:7px 12px;font-size:12.5px}
  .who .nm,.who .rl{display:none}
}
@media (max-width:420px){.brand span{display:none}}

/* ---- executive summary strips ---- */
.xs-list{display:flex;flex-direction:column;gap:1px;background:var(--line);border:1px solid var(--line)}
.xs{background:var(--surface)}
.xs summary{list-style:none;cursor:pointer;display:grid;grid-template-columns:150px 1fr 24px;gap:16px;
  align-items:baseline;padding:16px 20px}
.xs summary::-webkit-details-marker{display:none}
.xs summary:hover{background:var(--surface-2)}
.xs-k{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--brass)}
.xs-t{font-family:var(--f-display);font-size:21px;line-height:1.25;color:var(--ink);text-wrap:balance}
.xs-x{position:relative;width:18px;height:18px;align-self:center}
.xs-x::before,.xs-x::after{content:"";position:absolute;background:var(--brass);left:50%;top:50%;transform:translate(-50%,-50%)}
.xs-x::before{width:14px;height:1.5px}
.xs-x::after{width:1.5px;height:14px;transition:transform .2s}
.xs[open] .xs-x::after{transform:translate(-50%,-50%) rotate(90deg)}
.xs-b{padding:0 20px 22px 186px;display:flex;flex-direction:column;gap:10px}
.xs-b p{margin:0;font-size:14px;color:var(--muted);max-width:var(--measure)}
.xs-b p.hint{font-size:12px}
.vid{margin:4px 0 8px;max-width:820px}
.vid video{display:block;width:100%;height:auto;background:#14161A;border:1px solid var(--line-2)}
@media (max-width:720px){.xs summary{grid-template-columns:1fr 24px}.xs-k{grid-column:1/-1}.xs-b{padding-left:20px}}

/* ---- the owner's own words ---- */
blockquote.own{margin:22px 0 0;padding:4px 0 4px 18px;border-left:2px solid var(--brass);max-width:var(--measure)}
blockquote.own p{font-family:var(--f-display);font-size:19px;line-height:1.35;color:var(--ink);margin:0 0 10px}
blockquote.own cite{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);font-style:normal}
q{quotes:"“" "”"}

/* ---- engagements ---- */
.eng-list{display:flex;flex-direction:column;gap:1px;background:var(--line);border:1px solid var(--line)}
.eng{background:var(--surface);padding:20px 22px 18px;display:flex;flex-direction:column;gap:8px}
.eng-h{display:grid;grid-template-columns:34px 1fr auto;gap:12px;align-items:baseline}
.eng-h .idx{font-family:var(--f-mono);font-size:11px;color:var(--brass);letter-spacing:.1em}
.eng-h h3{font-family:var(--f-display);font-weight:400;font-size:22px;margin:0}
.eng p{margin:0;font-size:14px;color:var(--muted);max-width:none;line-height:1.58}
.eng p.why{font-size:13px;border-left:2px solid var(--brass);padding-left:10px}
.eng p.prec{font-size:13px}
.eng p.prec strong{color:var(--ink);font-weight:600}
.eng .meta{display:flex;flex-wrap:wrap;gap:6px;padding-top:4px}
.price{font-family:var(--f-mono);font-size:15px;color:var(--ink);white-space:nowrap;font-variant-numeric:tabular-nums}
.price span{font-size:11px;color:var(--muted)}
.price.locked{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);
  border:1px dashed var(--line-2);padding:3px 8px;border-radius:2px}
@media (max-width:720px){.eng-h{grid-template-columns:34px 1fr}.eng-h .price{grid-column:2}}


/* ---- about: capabilities and eras ---- */
.cap-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1px;background:var(--line);border:1px solid var(--line);margin-top:14px}
.cap{background:var(--surface);padding:16px 18px;display:flex;flex-direction:column;gap:6px}
.cap h3{font-size:14.5px;margin:0}
.cap p{font-size:13px;color:var(--muted);margin:0;max-width:none;line-height:1.55}
.cap-sheet{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;text-decoration:none;margin-top:auto;padding-top:6px}
table.era{margin-top:12px}
table.era th{font-family:var(--f-mono);font-size:11px;text-transform:none;letter-spacing:0;white-space:nowrap;vertical-align:top;background:transparent;border-bottom:1px solid var(--line);padding:11px 14px 11px 0;width:110px}
table.era td{padding:11px 0 11px 14px;font-size:13.5px}
table.era .muted-line{color:var(--muted);font-size:12.5px}

/* ---- drawing sheets (views/sheets.js) ----
   An architect's sheet: paper, a double border with zone ticks, general notes,
   a title block and a stamp. Motion is CSS only, so the reduced-motion rule
   above stops it; every base state is the finished drawing, never a faded-in
   one, so a still sheet is a complete sheet. */
.sheet{margin:0 0 30px}
.sheet-paper{background:var(--surface);border:1px solid var(--line-2);
  box-shadow:0 1px 0 var(--line),0 18px 40px -26px rgba(0,0,0,.45)}
.sheet-paper svg{display:block;width:100%;height:auto}
.sheet figcaption{font-size:13px;color:var(--muted);margin-top:12px;max-width:none;line-height:1.55}
.sh-fig-no{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.1em;color:var(--brass);margin-right:6px}
.sheet figcaption a{margin-left:6px}
/* paper + frame */
.sh-paper{fill:var(--surface)}
.sh-border{fill:none;stroke:var(--ink);stroke-width:.8;opacity:.75}
.sh-z{fill:var(--muted);font-family:"JetBrains Mono",monospace;font-size:8px;letter-spacing:.1em}
.sh-ln{stroke:var(--line-2);fill:none;stroke-width:1}
/* type on the sheet */
.sh-t{fill:var(--ink);font-family:"Archivo",sans-serif;font-size:12.5px}
.sh-c{fill:var(--ink);font-family:"Archivo",sans-serif;font-size:10.5px}
.sh-h{fill:var(--ink);font-family:"Instrument Serif",Georgia,serif;font-size:19px}
.sh-k{fill:var(--brass);font-family:"JetBrains Mono",monospace;font-size:9.5px;letter-spacing:.15em}
.sh-m{fill:var(--muted);font-family:"JetBrains Mono",monospace;font-size:9.5px;letter-spacing:.03em}
.sh-n{fill:var(--ink);font-family:"Archivo",sans-serif;font-size:11px}
.sh-b{fill:var(--brass);font-family:"JetBrains Mono",monospace;font-size:9.5px}
.sh-p{fill:var(--patina);font-family:"JetBrains Mono",monospace;font-size:9.5px}
.sh-r{fill:var(--stop);font-family:"JetBrains Mono",monospace;font-size:9.5px}
.sh-ok{fill:var(--ok);font-family:"JetBrains Mono",monospace;font-size:9.5px}
.sh-no{fill:var(--ink);font-family:"Instrument Serif",Georgia,serif;font-size:26px}
.sh-cover-eyebrow{fill:var(--brass);font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.18em}
.sh-cover-title{fill:var(--ink);font-family:"Instrument Serif",Georgia,serif;font-size:44px}
/* shapes */
.sh-box{fill:var(--surface);stroke:var(--line-2);stroke-width:1}
.sh-box-b{fill:var(--brass-soft);stroke:var(--brass);stroke-width:1.2}
.sh-box-p{fill:var(--patina-soft);stroke:var(--patina);stroke-width:1.2}
.sh-chip{fill:var(--surface-2);stroke:var(--line-2);stroke-width:.8}
.sh-subnet{fill:var(--patina-soft);stroke:var(--patina);stroke-width:1;stroke-dasharray:6 4}
.sh-ring{fill:none;stroke:var(--brass);stroke-width:1.4;stroke-dasharray:3 2.5}
.sh-field{fill:url(#hatch);stroke:var(--patina);stroke-width:1}
.sh-ep{fill:var(--surface);stroke:var(--line-2);stroke-width:.8}
.sh-site{fill:var(--surface);stroke:var(--line-2);stroke-width:1}
.sh-site.p{fill:var(--patina-soft);stroke:var(--patina)}
.sh-fab{stroke-width:1.2}
.sh-fab.a{fill:var(--brass-soft);stroke:var(--brass)}
.sh-fab.b{fill:var(--patina-soft);stroke:var(--patina)}
.sh-track{fill:var(--surface-2);stroke:var(--line-2);stroke-width:.8}
.sh-loop{fill:none;stroke:var(--line-2);stroke-width:1.4;stroke-dasharray:5 4;animation:sh-flow 1.3s linear infinite}
.sh-cloud{fill:none;stroke:var(--stop);stroke-width:1;opacity:.75}
/* dimension lines, leaders, stamp */
.sh-dim line{stroke:var(--patina);stroke-width:.9}
.sh-leader circle{fill:var(--brass)}
.sh-leader path{stroke:var(--brass);stroke-width:.9;fill:none}
.sh-stamp rect{fill:none;stroke:var(--stop);stroke-width:1.6;opacity:.8}
.sh-stamp text{fill:var(--stop);font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.16em;opacity:.85}
/* motion */
.sh-flow{fill:none;stroke:var(--brass);stroke-width:1.3;stroke-dasharray:5 4;animation:sh-flow 1.1s linear infinite}
.sh-flow.p{stroke:var(--patina)}
.sh-path{fill:none;stroke:var(--line-2);stroke-width:.9;stroke-dasharray:2 3}
.sh-path.r{stroke:var(--stop)}
@keyframes sh-flow{to{stroke-dashoffset:-18}}
/* a packet along a path. Base state = the start of the path, visible. */
.sh-dot{fill:var(--brass);offset-rotate:0deg;animation:sh-travel var(--dur,4s) linear infinite var(--at,0s)}
.sh-dot.p{fill:var(--patina)} .sh-dot.r{fill:var(--stop)} .sh-dot.ok{fill:var(--ok)}
@keyframes sh-travel{0%{offset-distance:0%;opacity:0}5%{opacity:1}90%{opacity:1}96%,100%{offset-distance:100%;opacity:0}}
/* the refused cross: always drawn, brightens as the probe arrives */
.sh-stop line{stroke:var(--stop);stroke-width:2;stroke-linecap:round}
.sh-stop{animation:sh-blink var(--dur,4s) linear infinite var(--at,0s)}
@keyframes sh-blink{0%,84%{opacity:.35}90%,100%{opacity:1}}
/* progress bars: base = full, animation refills from empty */
.sh-bar{fill:var(--brass);transform-box:fill-box;transform-origin:left center;animation:sh-grow var(--dur,6s) ease-in-out infinite var(--at,0s)}
@keyframes sh-grow{0%{transform:scaleX(0)}18%,100%{transform:scaleX(1)}}
/* a gate diamond that passes when its wave completes */
.sh-gate{fill:var(--surface);stroke:var(--ok);stroke-width:1.4;animation:sh-pass var(--dur,6s) linear infinite var(--at,0s)}
@keyframes sh-pass{0%,10%{fill:var(--surface)}14%,100%{fill:var(--ok)}}
/* the serving badge that fails over and back */
.sh-serve rect{fill:var(--ok);}
.sh-serve text{fill:#fff;font-family:"JetBrains Mono",monospace;font-size:10px;letter-spacing:.14em}
.sh-serve{animation:sh-swing 12s ease-in-out infinite}
@keyframes sh-swing{0%,38%{transform:translateX(0)}46%,84%{transform:translateX(var(--dx,460px))}92%,100%{transform:translateX(0)}}
/* the drift gauge on S-05: base = low drift, cycle rises then is driven down */
.sh-drift{fill:var(--stop);transform-box:fill-box;transform-origin:left center;transform:scaleX(.12);animation:sh-drift 9s ease-in-out infinite}
@keyframes sh-drift{0%{transform:scaleX(.12)}40%{transform:scaleX(.62)}70%,100%{transform:scaleX(.12)}}

/* ---- the set page: tools, present mode, print ---- */
.sheet-tools{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:18px}
.sheet-set .sheet-slot{scroll-margin-top:74px}
.present-nav{position:fixed;left:50%;bottom:16px;transform:translateX(-50%);z-index:30;
  display:flex;gap:8px;align-items:center;background:var(--surface);border:1px solid var(--line-2);
  padding:6px 10px;border-radius:3px;box-shadow:0 8px 24px -12px rgba(0,0,0,.4);font-size:12.5px}
body.presenting header.top,body.presenting footer.bot,body.presenting .sheet-tools,
body.presenting main>section:first-child{display:none}
body.presenting{background:var(--paper)}
body.presenting .sheet-set{max-width:none;padding:0}
body.presenting .sheet-slot{scroll-margin-top:0;min-height:100vh;display:flex;align-items:center;justify-content:center;padding:18px 24px 70px;box-sizing:border-box}
body.presenting .sheet{margin:0;width:min(100%,calc((100vh - 96px) * 1.538))}
body.presenting .sheet figcaption{text-align:center;max-width:none}
@media print{
  header.top,footer.bot,.sheet-tools,.present-nav,.skip,main>section:first-child{display:none!important}
  @page{size:landscape;margin:8mm}
  body{background:#fff}
  .sheet-set{max-width:none;padding:0}
  .sheet-slot{break-after:page;page-break-after:always}
  .sheet-paper{box-shadow:none;border:0}
  .sheet figcaption{font-size:10px}
  .sh-flow,.sh-loop,.sh-dot,.sh-stop,.sh-bar,.sh-gate,.sh-serve,.sh-drift{animation:none!important}
}

/* ---- drawing: flows and the enclave ---- */
.dw-flow{stroke-dasharray:4 3;animation:dw-flow 1.2s linear infinite}
@keyframes dw-flow{to{stroke-dashoffset:-14}}
.dw-enclave{fill:none;stroke:var(--patina);stroke-dasharray:6 4}
.dw-p{fill:var(--patina);font-family:"JetBrains Mono",monospace;font-size:9.5px}
.dw-patina{stroke:var(--patina);fill:none}
