/* ============ Trace: tokens ============ */
:root{
  --paper:#F6F7F7; --surface:#FFFFFF; --surface-2:#ECEFF0; --surface-3:#E2E7E8;
  --ink:#0F1618; --ink-2:#465156; --ink-3:#646F75;
  --rule:#D5DBDD; --rule-2:#E5E9EA;
  --link:#1A5FAE;
  --series-a:#1e63ba; --series-b:#A8500F;
  --sig-soft:#F3E4D6; --ghost:#EDF0F1;
  --shadow:0 1px 2px rgba(15,22,24,.05), 0 14px 34px -26px rgba(15,22,24,.34);
  --fict:#8F5300;
  --fs-d:clamp(2.3rem,1.3rem + 3.6vw,3.9rem);
  --fs-h1:clamp(1.85rem,1.3rem + 2vw,2.7rem);
  --fs-h2:clamp(1.32rem,1.08rem + 1.05vw,1.8rem);
  --fs-b:1rem; --fs-s:.885rem; --fs-m:.725rem;
  --rail:196px;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --paper:#14181A; --surface:#1C2124; --surface-2:#232A2D; --surface-3:#2B3336;
    --ink:#E8ECEC; --ink-2:#A4AFB3; --ink-3:#939FA4;
    --rule:#2E3639; --rule-2:#242B2E; --link:#6FA8E8;
    --series-a:#3987e5; --series-b:#d95926;
    --sig-soft:#31211A; --ghost:#20272A; --fict:#E0A24A;
    --shadow:0 1px 2px rgba(0,0,0,.5), 0 16px 36px -26px rgba(0,0,0,.9);
  }
}
:root[data-theme="dark"]{
  --paper:#14181A; --surface:#1C2124; --surface-2:#232A2D; --surface-3:#2B3336;
  --ink:#E8ECEC; --ink-2:#A4AFB3; --ink-3:#939FA4;
  --rule:#2E3639; --rule-2:#242B2E; --link:#6FA8E8;
  --series-a:#3987e5; --series-b:#d95926;
  --sig-soft:#31211A; --ghost:#20272A; --fict:#E0A24A;
  --shadow:0 1px 2px rgba(0,0,0,.5), 0 16px 36px -26px rgba(0,0,0,.9);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}*{transition:none!important;animation:none!important}}
body{background:var(--paper);color:var(--ink);margin:0;padding:0;
  font-family:"Source Serif 4",Georgia,"Times New Roman",serif;font-size:var(--fs-b);line-height:1.62;
  -webkit-font-smoothing:antialiased}
h1,h2,h3,h4{font-family:Archivo,"Helvetica Neue",Arial,sans-serif;font-weight:600;margin:0;
  text-wrap:balance;letter-spacing:-.018em}
h1{font-size:var(--fs-h1);line-height:1.04;letter-spacing:-.028em;font-weight:700}
h1.big{font-size:var(--fs-d);line-height:.98;letter-spacing:-.032em}
h2{font-size:var(--fs-h2);line-height:1.14}
h3{font-size:1.02rem;line-height:1.32;letter-spacing:-.006em}
h4{font-size:var(--fs-s);line-height:1.35}
p{margin:0}
img{max-width:100%;display:block}
a{color:var(--link);text-underline-offset:2px;text-decoration-thickness:.5px}
a:hover{text-decoration-thickness:1.4px}
:focus-visible{outline:2px solid var(--link);outline-offset:3px;border-radius:2px}
.skip{position:absolute;left:-9999px;top:0;z-index:60;background:var(--surface);color:var(--ink);
  border:1px solid var(--rule);padding:10px 16px;font-family:Archivo,sans-serif;font-size:.9rem;text-decoration:none}
.skip:focus{left:12px;top:12px}
.mono,.num{font-family:"IBM Plex Mono",ui-monospace,SFMono-Regular,monospace;font-variant-numeric:tabular-nums}
.eyebrow{font-family:"IBM Plex Mono",monospace;font-size:var(--fs-m);letter-spacing:.15em;
  text-transform:uppercase;color:var(--ink-3)}
.prose{display:flex;flex-direction:column;gap:14px;color:var(--ink-2);max-width:70ch}
.prose strong{color:var(--ink);font-weight:600}
.small{font-family:"IBM Plex Mono",monospace;font-size:var(--fs-m);color:var(--ink-3);line-height:1.6}
.stack{display:flex;flex-direction:column}
.g8{gap:8px}.g12{gap:12px}.g18{gap:18px}.g26{gap:26px}

/* ============ shell + rail ============ */
.shell{display:grid;grid-template-columns:minmax(0,1fr);min-height:100vh;overflow-x:clip}
.rail{position:sticky;top:0;z-index:30;background:var(--paper);border-bottom:1px solid var(--rule);
  display:flex;align-items:center;gap:12px;padding:9px 16px;min-width:0}
.mark{font-family:"IBM Plex Mono",monospace;font-size:.8rem;letter-spacing:.16em;color:var(--ink);
  text-decoration:none;white-space:nowrap;font-weight:500;flex:none}
.mark:hover{color:var(--series-b);text-decoration:none}
.tabs{display:flex;gap:2px;overflow-x:auto;flex:1 1 0;min-width:0;scrollbar-width:none;-ms-overflow-style:none}
/* below the desktop rail breakpoint the strip wraps: a hidden-scrollbar strip
   leaves later nav items unreachable with no affordance that they exist */
@media (max-width:999px){
  .rail{flex-wrap:wrap;row-gap:2px}
  .tabs{flex-wrap:wrap;overflow:visible;row-gap:0;flex:1 1 auto}
  .tab{padding:5px 8px}
}
@media (max-width:430px){
  .rail{padding:8px 14px}
  .tab{font-size:.78rem;padding:5px 6px;gap:5px}
}
.tabs::-webkit-scrollbar{display:none}
.tab{display:flex;align-items:center;gap:7px;text-decoration:none;color:var(--ink-3);
  font-family:Archivo,sans-serif;font-size:.82rem;letter-spacing:.05em;text-transform:uppercase;
  padding:6px 9px;white-space:nowrap;border-radius:2px}
.tab .bar{display:block;width:1.5px;height:9px;background:var(--rule);flex:none}
.tab:hover{color:var(--ink);text-decoration:none}
.tab:hover .bar{background:var(--ink-3)}
.tab[aria-current="page"]{color:var(--ink);font-weight:600}
.tab[aria-current="page"] .bar{background:var(--series-b);height:15px}
.subnav{display:none}

.theme{display:flex;border:1px solid var(--rule);border-radius:3px;overflow:hidden;flex:none;background:var(--surface)}
.theme button{appearance:none;border:0;background:transparent;cursor:pointer;width:29px;height:26px;
  display:grid;place-items:center;color:var(--ink-3);padding:0;border-right:1px solid var(--rule);
  transition:background .12s,color .12s}
.theme button:last-child{border-right:0}
.theme button:hover{background:var(--surface-2);color:var(--ink)}
.theme button[aria-pressed="true"]{background:var(--surface-3);color:var(--series-b)}
.theme svg{width:14px;height:14px;display:block}

main{min-width:0;padding-inline:18px;overflow-x:clip}
.inner{max-width:960px;margin:0 auto;padding-block:0 92px}
section{scroll-margin-top:66px}

/* page header */
.pagehead{padding-top:clamp(30px,4.5vw,58px);display:flex;flex-direction:column;gap:14px;
  border-bottom:1px solid var(--ink);padding-bottom:24px}
.pagehead .kicker{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.pagehead .lede{font-family:"Source Serif 4",Georgia,serif;font-size:clamp(1.05rem,.95rem + .5vw,1.24rem);
  color:var(--ink-2);max-width:60ch;line-height:1.5}

/* section heads */
.sechead{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;border-top:1px solid var(--ink);
  padding-top:12px;margin-top:clamp(42px,5.5vw,76px);margin-bottom:20px}
.sechead h2{flex:1 1 auto}
.sechead .count{font-family:"IBM Plex Mono",monospace;font-size:var(--fs-m);color:var(--ink-3);letter-spacing:.08em}
.sechead.thin{border-top-color:var(--rule);margin-top:clamp(30px,4vw,48px)}

/* ============ figures ============ */
figure{margin:0;display:flex;flex-direction:column;gap:9px}
figcaption{font-family:"IBM Plex Mono",monospace;font-size:var(--fs-m);color:var(--ink-3);
  line-height:1.55;max-width:78ch}
.tracebox{border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);padding:4px 0 0;overflow:hidden}
svg.trace{width:100%;height:auto;display:block}
.diagram{border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);padding:14px 0;overflow-x:auto}
.diagram svg{width:100%;min-width:440px;height:auto;display:block}

/* placeholder frames */
.frame{aspect-ratio:3/2;width:100%;max-width:100%;border:1px solid var(--rule);background:var(--ghost);
  display:grid;place-items:center;padding:18px;text-align:center;flex:0 0 auto}
.frame.sq{aspect-ratio:1/1}
.frame.wide{aspect-ratio:16/9}
.frame .ph{display:flex;flex-direction:column;gap:6px;align-items:center}
.frame .ph .n{font-family:"IBM Plex Mono",monospace;font-size:10px;letter-spacing:.13em;
  text-transform:uppercase;color:var(--series-b)}
.frame .ph .d{font-family:Archivo,sans-serif;font-size:var(--fs-s);color:var(--ink-2);max-width:28ch;line-height:1.4}
.plategrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:22px;align-items:start}
.plate{display:flex;flex-direction:column;gap:8px}
.plate figcaption{font-size:var(--fs-m)}

/* ============ overview masthead ============ */
.mast{padding-top:clamp(30px,5vw,64px);display:flex;flex-direction:column;gap:26px}
.mast-top{display:grid;grid-template-columns:1fr auto;gap:44px;align-items:center}
@media (max-width:680px){.mast-top{grid-template-columns:1fr;gap:22px}}
.mast h1 .sur{display:block}
.role{font-family:Archivo,sans-serif;font-size:clamp(1.05rem,.95rem + .6vw,1.32rem);font-weight:500;
  color:var(--ink-2);margin-top:18px;max-width:58ch;line-height:1.4}
.portrait{width:232px;height:232px;flex:none;overflow:hidden;background:var(--ghost)}
.portrait img{width:100%;height:100%;object-fit:cover;display:block}
@media (max-width:680px){.portrait{width:150px;height:150px}}

.links{display:flex;flex-wrap:wrap;gap:2px 26px;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.links a{font-family:Archivo,sans-serif;font-size:var(--fs-s);font-weight:500;color:var(--ink);text-decoration:none;display:inline-flex;align-items:center;gap:8px;padding:11px 0}

.links a:hover{color:var(--series-b)}
.links a .dot{width:4px;height:4px;border-radius:50%;background:var(--series-a);flex:none}
.links a.todo .dot{background:transparent;border:1px solid var(--series-b)}
.links a.todo{color:var(--ink-2)}

.readout{display:grid;grid-template-columns:repeat(auto-fit,minmax(148px,1fr));border-top:1px solid var(--rule)}
.readout{column-gap:30px}
.readout.two{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}

/* ---- CV page: contact line, education list, narrow peer-review table ---- */
.cvcontact{font-size:var(--fs-s);color:var(--ink-2);margin:6px 0 0;line-height:1.7}
.edulist{display:flex;flex-direction:column;gap:13px;margin-top:4px}
.edu2 .e1{margin:0;display:flex;flex-wrap:wrap;align-items:baseline;gap:8px}
.edu2 .e1 b{font-family:Archivo,sans-serif;font-size:var(--fs-s)}
.edu2 .e2{color:var(--ink-2);font-size:var(--fs-s);flex:1 1 auto}
.edu2 .ew{color:var(--ink-3);font-size:var(--fs-m);white-space:nowrap}
.edu2 .e3{margin:2px 0 0;color:var(--ink-3);font-size:var(--fs-m)}
table.jt.narrow{min-width:0}
table.jt.narrow td.j{font-weight:400;font-family:"Source Serif 4",Georgia,serif}
.readout .cell{padding:15px 0;display:flex;flex-direction:column;gap:3px}

.readout .v{font-family:"IBM Plex Mono",monospace;font-size:1.28rem;font-weight:500;color:var(--ink);
  font-variant-numeric:tabular-nums;line-height:1.1}
.readout .v em{font-style:normal;font-size:.72em;color:var(--ink-3)}
.readout .k{font-family:Archivo,sans-serif;font-size:var(--fs-m);color:var(--ink-2);line-height:1.35}

/* ============ gateway cards ============ */
.gates{display:flex;flex-direction:column;border-top:1px solid var(--rule)}
.gate{display:grid;grid-template-columns:minmax(150px,220px) minmax(0,1fr) auto;gap:6px 26px;align-items:baseline;text-decoration:none;color:inherit;
  padding:20px 0 22px;border-bottom:1px solid var(--rule-2)}
@media (max-width:640px){.gate{grid-template-columns:1fr auto}.gate .gd{grid-column:1/-1}}
.gate:hover{text-decoration:none}
.gate:hover .gt{color:var(--series-b)}
.gate:hover .go{transform:translateX(3px)}
.gate .gk{font-family:"IBM Plex Mono",monospace;font-size:var(--fs-m);letter-spacing:.11em;
  text-transform:uppercase;color:var(--ink-3)}
.gate .gt{font-family:Archivo,sans-serif;font-weight:600;font-size:1.14rem;line-height:1.2;
  letter-spacing:-.016em;color:var(--ink);transition:color .13s}
.gate .gd{font-size:var(--fs-s);color:var(--ink-2);line-height:1.5}
.gate .gf{margin-top:auto;padding-top:10px;display:flex;align-items:baseline;gap:8px}
.gate .gn{font-family:"IBM Plex Mono",monospace;font-size:1.05rem;color:var(--series-b);
  font-variant-numeric:tabular-nums}
.gate .gl{font-family:Archivo,sans-serif;font-size:var(--fs-m);color:var(--ink-3)}
.gate .go{margin-left:auto;color:var(--ink-3);transition:transform .13s}

/* ============ ledger / facts ============ */
.facts{display:flex;flex-direction:column;border-top:1px solid var(--rule)}
.fact{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px;align-items:baseline;
  padding:12px 0;border-bottom:1px solid var(--rule-2)}
.fact .l{font-size:var(--fs-s);color:var(--ink-2);line-height:1.5}
.fact .l b{color:var(--ink);font-weight:600}
.fact .r{font-family:"IBM Plex Mono",monospace;font-size:var(--fs-s);color:var(--ink);
  font-variant-numeric:tabular-nums;white-space:nowrap;text-align:right}

/* ============ timeline ============ */
.tl{display:flex;flex-direction:column;border-left:1.5px solid var(--rule);padding-left:0;margin-left:5px}
.tl .step{display:grid;grid-template-columns:auto 1fr;gap:16px;padding:0 0 26px 0;position:relative}
.tl .step:last-child{padding-bottom:0}
.tl .yr{font-family:"IBM Plex Mono",monospace;font-size:var(--fs-m);color:var(--ink-3);
  padding-left:16px;position:relative;top:2px;white-space:nowrap;min-width:7ch}
.tl .yr::before{content:"";position:absolute;left:-6px;top:7px;width:11px;height:1.5px;background:var(--rule)}
.tl .step.key .yr{color:var(--series-b)}
.tl .step.key .yr::before{background:var(--series-b);width:17px;left:-6px}
.tl .b{display:flex;flex-direction:column;gap:6px;min-width:0}
.tl .b h3{font-size:1rem}
.tl .b p{font-size:var(--fs-s);color:var(--ink-2);line-height:1.55;max-width:62ch}

/* ============ video cards ============ */
.vids{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px;align-items:start}
.vid{display:flex;flex-direction:column;gap:9px;text-decoration:none;color:inherit}
.vid:hover{text-decoration:none}
.vid .shot{aspect-ratio:16/9;border:1px solid var(--rule);background:var(--surface-2);position:relative;
  display:grid;place-items:center;overflow:hidden}
.vid:hover .shot{border-color:var(--series-b)}
.vid .shot img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.vid .play{width:46px;height:46px;border-radius:50%;border:1.5px solid var(--series-b);position:relative;z-index:1;
  display:grid;place-items:center;background:var(--surface);color:var(--series-b);transition:transform .14s;box-shadow:0 1px 6px rgba(0,0,0,.25)}
.vid:hover .play{transform:scale(1.07)}
.vid .play svg{width:16px;height:16px;margin-left:2px}
.vid .vt{font-family:Archivo,sans-serif;font-weight:600;font-size:var(--fs-s);line-height:1.35;color:var(--ink)}
.vid:hover .vt{color:var(--series-b)}
.vid .vm{font-family:"IBM Plex Mono",monospace;font-size:var(--fs-m);color:var(--ink-3)}

/* ============ awards ============ */
.awards{display:grid;grid-template-columns:repeat(auto-fit,minmax(258px,1fr));gap:0;border-top:1px solid var(--rule)}
.award{display:grid;grid-template-columns:150px 1fr;gap:20px;padding:24px 26px 24px 0;
  border-bottom:1px solid var(--rule-2);border-right:1px solid var(--rule-2)}
.award .logo{width:150px;height:78px;align-self:start;display:flex;align-items:center;justify-content:flex-start;
  padding:8px;box-sizing:border-box;border-radius:3px;overflow:visible}
.award .logo img{display:block;width:auto;height:auto;max-width:100%;max-height:58px;
  object-fit:contain;object-position:center left;background:none;border:0;padding:0}
/* Used only where no official logo asset is available. It is deliberately typographic
   so it reads as a name set in type, not as an imitation of a brand mark. */
.logo .plate{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;
  text-align:left;width:100%;min-height:44px;padding:7px 10px 8px;box-sizing:border-box;
  border-left:2px solid var(--ink-3);background:var(--surface-2);border-radius:0 3px 3px 0;
  font-family:Archivo,sans-serif;font-size:12.5px;font-weight:700;line-height:1.15;
  letter-spacing:-.01em;color:var(--ink);text-transform:none}
.logo .plate .sub{font-weight:500;font-size:10px;letter-spacing:.03em;color:var(--ink-3);
  text-transform:uppercase;margin-top:3px}
.award .an a{color:inherit;text-decoration:none}
.award .an a:hover{color:var(--series-b)}
.award .logo span{font-family:"IBM Plex Mono",monospace;font-size:8px;letter-spacing:.08em;color:var(--ink-3);line-height:1.3}
.award .b{display:flex;flex-direction:column;gap:4px;min-width:0}
.award .an{font-family:Archivo,sans-serif;font-weight:600;font-size:var(--fs-s);line-height:1.3;color:var(--ink)}
.award .ab{font-family:"IBM Plex Mono",monospace;font-size:var(--fs-m);color:var(--ink-3)}
.award .ad{font-size:var(--fs-s);color:var(--ink-2);line-height:1.5}

/* ============ publications ============ */
.pubgroup{display:flex;flex-direction:column;margin-bottom:28px}
.pubgroup > .lbl{display:flex;align-items:center;gap:11px;margin-bottom:6px;flex-wrap:wrap}
.pubgroup > .lbl .line{flex:1;height:1px;background:var(--rule-2);min-width:20px}
.pub{border-top:1px solid var(--rule-2);padding:15px 0;display:grid;grid-template-columns:auto 1fr;gap:14px}
.pub:first-of-type{border-top:1px solid var(--rule)}
.pub .yr{font-family:"IBM Plex Mono",monospace;font-size:var(--fs-s);color:var(--ink-3);padding-top:2px;
  font-variant-numeric:tabular-nums;min-width:4ch}
.pub .body{display:flex;flex-direction:column;gap:7px;min-width:0}
.pub .t{font-family:Archivo,sans-serif;font-weight:600;font-size:1rem;line-height:1.35;
  color:var(--ink);letter-spacing:-.008em}
a.t{text-decoration:none}
a.t:hover{color:var(--series-b)}
.pub .a{font-size:var(--fs-s);color:var(--ink-2);line-height:1.5}
.pub .a b{color:var(--ink);font-weight:600}
.pub .v{font-size:var(--fs-s);color:var(--ink-2);display:flex;flex-wrap:wrap;gap:4px 10px;align-items:baseline}
.pub .v i{font-style:italic}
.pub .v .vn{display:inline}
.pub .v .doi{font-family:"IBM Plex Mono",monospace;font-size:var(--fs-m)}
.flag{font-family:"IBM Plex Mono",monospace;font-size:10px;letter-spacing:.09em;text-transform:uppercase;
  padding:2px 6px;border:1px solid var(--series-b);color:var(--series-b);border-radius:2px;white-space:nowrap}
.flag.cool{border-color:var(--series-a);color:var(--series-a)}
.flag.mute{border-color:var(--rule);color:var(--ink-3)}
details.note{margin-top:2px}
details.note summary{font-family:Archivo,sans-serif;font-size:var(--fs-s);color:var(--link);cursor:pointer;
  list-style:none;display:inline-flex;align-items:center;gap:6px;width:fit-content}
details.note summary::-webkit-details-marker{display:none}
details.note summary::before{content:"+";font-family:"IBM Plex Mono",monospace;font-size:.9em}
details.note[open] summary::before{content:"\2212"}
details.note .in{font-size:var(--fs-s);color:var(--ink-2);line-height:1.6;padding:9px 0 2px 13px;
  max-width:66ch;border-left:2px solid var(--rule);margin-top:8px}

/* ============ instrument ============ */
.instrument{border-top:1px solid var(--ink);border-bottom:1px solid var(--rule);background:transparent;overflow:hidden}
.inst-h{padding:14px 0 12px;border-bottom:1px solid var(--rule-2);
  display:flex;flex-direction:column;gap:3px}
.inst-h .t{font-family:Archivo,sans-serif;font-weight:600;font-size:1rem}
.inst-h .s{font-family:"IBM Plex Mono",monospace;font-size:var(--fs-m);color:var(--ink-3)}
.inst-b{padding:16px 0 20px;display:flex;flex-direction:column;gap:14px}
.inst-b > *{min-width:0}
.hero-read{display:flex;flex-wrap:wrap;align-items:baseline;gap:11px}
.hero-read .big{font-family:"IBM Plex Mono",monospace;font-size:clamp(1.85rem,1.2rem + 2vw,2.7rem);
  font-weight:500;color:var(--series-b);font-variant-numeric:tabular-nums;line-height:1}
.hero-read .cap{font-size:var(--fs-s);color:var(--ink-2);max-width:48ch;line-height:1.5}
.ctl{display:flex;flex-wrap:wrap;align-items:center;gap:12px}
.ctl label{font-family:Archivo,sans-serif;font-size:var(--fs-s);font-weight:500;white-space:nowrap}
.ctl input[type=range]{flex:1 1 220px;min-width:140px;accent-color:var(--series-b)}
.ctl .val{font-family:"IBM Plex Mono",monospace;font-size:var(--fs-s);color:var(--series-b);
  font-variant-numeric:tabular-nums;white-space:nowrap;min-width:9ch}
.svgwrap{overflow-x:auto;min-width:0;max-width:100%}
svg.chart{width:100%;min-width:520px;height:auto;display:block}
details.tbl{border-top:1px solid var(--rule-2);padding-top:10px}
details.tbl summary{font-family:Archivo,sans-serif;font-size:var(--fs-s);cursor:pointer;color:var(--ink-2)}
details.tbl table{border-collapse:collapse;width:100%;margin-top:10px;font-size:var(--fs-s)}
details.tbl th,details.tbl td{text-align:left;padding:7px 10px;border-bottom:1px solid var(--rule-2)}
details.tbl th{font-family:"IBM Plex Mono",monospace;font-size:var(--fs-m);text-transform:uppercase;
  letter-spacing:.07em;color:var(--ink-3);font-weight:500}
details.tbl td.num{font-family:"IBM Plex Mono",monospace;font-variant-numeric:tabular-nums}

/* ============ research: the approach loop, methods band, comparison table ============ */
.rloop{list-style:none;margin:22px 0 0;padding:0;display:grid;
  grid-template-columns:repeat(auto-fit,minmax(178px,1fr));gap:0;
  border:1px solid var(--rule);border-radius:3px;overflow:hidden;background:var(--surface)}
.rloop li{padding:15px 16px 16px;border-right:1px solid var(--rule-2);display:flex;
  flex-direction:column;gap:5px;position:relative}
.rloop li:last-child{border-right:none}
.rloop .ln{font-size:var(--fs-m);color:var(--series-a);font-weight:500}
.rloop .lt{font-family:Archivo,sans-serif;font-weight:600;font-size:var(--fs-s);line-height:1.25}
.rloop .ld{font-size:var(--fs-m);color:var(--ink-2);line-height:1.5}
.rloop li::after{content:"";position:absolute;right:-6px;top:26px;width:10px;height:10px;
  border-top:1.4px solid var(--rule);border-right:1.4px solid var(--rule);
  transform:rotate(45deg);background:var(--surface);z-index:2}
.rloop li:last-child::after{display:none}
@media (max-width:900px){
  .rloop{grid-template-columns:1fr}
  .rloop li{border-right:none;border-bottom:1px solid var(--rule-2)}
  .rloop li:last-child{border-bottom:none}
  .rloop li::after{right:auto;left:24px;top:auto;bottom:-6px;transform:rotate(135deg)}
}
.rloop-back{margin:9px 0 0;font-family:"IBM Plex Mono",monospace;font-size:var(--fs-m);
  color:var(--ink-3);text-align:right}
@media (max-width:900px){.rloop-back{text-align:left}}

.mband{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:0;
  border-top:1px solid var(--rule)}
.mband > div{padding:13px 18px 15px 0;display:flex;flex-direction:column;gap:5px}
.mband .mk{font-family:"IBM Plex Mono",monospace;font-size:var(--fs-m);letter-spacing:.07em;
  text-transform:uppercase;color:var(--ink-3)}
.mband .mv{font-size:var(--fs-s);color:var(--ink-2);line-height:1.5}

table.ctab{width:100%;border-collapse:collapse;font-size:var(--fs-s);min-width:640px}
table.ctab th,table.ctab td{text-align:left;vertical-align:top;padding:11px 14px 11px 0;
  border-bottom:1px solid var(--rule-2)}
table.ctab thead th{font-family:Archivo,sans-serif;font-weight:600;color:var(--ink);
  border-bottom:1px solid var(--rule)}
table.ctab tbody th{font-family:"IBM Plex Mono",monospace;font-size:var(--fs-m);
  letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3);font-weight:500;white-space:nowrap}
table.ctab td{color:var(--ink-2);line-height:1.5}

/* submitted and in-preparation entries */
.spubs{display:flex;flex-direction:column;gap:0;border-top:1px solid var(--rule)}
.spub{padding:15px 0 16px;border-bottom:1px solid var(--rule-2)}
.spub:last-child{border-bottom:none}
.spub .st{font-family:Archivo,sans-serif;font-weight:600;font-size:var(--fs-s);color:var(--ink);
  text-decoration:none;display:inline-block}
.spub .st:hover{text-decoration:underline;text-underline-offset:3px}
.spub .sd{margin:5px 0 0;font-size:var(--fs-s);color:var(--ink-2);line-height:1.55}
.spub .ss{margin:8px 0 0;font-size:var(--fs-m);color:var(--ink-3);display:flex;
  flex-wrap:wrap;gap:8px;align-items:baseline}
.spub .ss .k{font-family:"IBM Plex Mono",monospace;letter-spacing:.07em;text-transform:uppercase}
.spub .sl{color:var(--series-a);text-decoration:none;border-bottom:1px solid var(--rule)}
.spub .sl:hover{border-bottom-color:var(--series-a)}

/* ============ tables ============ */
.tw{overflow-x:auto;min-width:0;max-width:100%}
table.jt td:nth-child(2){white-space:nowrap}
.jt{width:100%;border-collapse:collapse;font-size:var(--fs-s);min-width:460px}
table.jt th,table.jt td{text-align:left;padding:10px 12px 10px 0;border-bottom:1px solid var(--rule-2);vertical-align:top}
table.jt thead th{font-family:"IBM Plex Mono",monospace;font-size:var(--fs-m);letter-spacing:.09em;
  text-transform:uppercase;color:var(--ink-3);font-weight:500;border-bottom:1px solid var(--rule)}
table.jt td.j{font-family:Archivo,sans-serif;font-weight:600;color:var(--ink);font-size:var(--fs-s)}
table.jt td.p{color:var(--ink-2)}
table.jt th.num,table.jt td.num{text-align:right;padding-right:0;white-space:nowrap}
table.jt tfoot td{border-bottom:none;border-top:1px solid var(--rule);color:var(--ink);padding-top:11px}

/* ---- provenance label: what kind of evidence a number rests on ---- */
.prov{display:inline-block;font-family:"IBM Plex Mono",monospace;font-size:.66rem;letter-spacing:.07em;
  text-transform:uppercase;color:var(--ink-3);border:1px solid var(--rule);border-radius:2px;
  padding:2px 6px;margin-left:6px;white-space:nowrap;vertical-align:1px;background:var(--surface);max-width:100%}
/* in a narrow readout cell the chip must wrap rather than bleed off the page */
.readout .k .prov{display:inline-block;margin-left:0;margin-top:6px}
@media (max-width:900px){.readout .k .prov{white-space:normal}}
.provrow{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.provrow .prov{margin-left:0}

/* ============ Safe Life: numbered method steps ============ */
.steps{list-style:none;margin:4px 0 0;padding:0;display:flex;flex-direction:column;gap:2px;counter-reset:st}
.steps li{display:grid;grid-template-columns:30px 1fr;gap:2px 14px;align-items:baseline;
  padding:11px 0;border-bottom:1px solid var(--rule-2)}
.steps li:last-child{border-bottom:none}
.steps .stn{grid-row:1/3;font-size:var(--fs-m);color:var(--ink-3);font-variant-numeric:tabular-nums}
.steps .stt{font-family:Archivo,sans-serif;font-weight:600;font-size:var(--fs-s)}
.steps .std{font-size:var(--fs-s);color:var(--ink-2);line-height:1.5}
@media (max-width:520px){.steps li{grid-template-columns:24px 1fr;gap:2px 10px}}

/* ============ Safe Life: three compact phone shells ============
   The screen image is the design. The shell adds only the bezel, and the app mark
   is overlaid on the plate the screen leaves for it so the real SVG stays exact. */
.phones{display:flex;flex-wrap:wrap;gap:clamp(16px,2.2vw,26px);justify-content:center;
  align-items:flex-start;margin-top:6px}
.phone{margin:0;flex:0 1 288px;max-width:300px;min-width:0}
.ph-shell{position:relative;width:100%;max-width:300px;margin:0 auto;border-radius:26px;
  padding:9px;background:linear-gradient(160deg,#2b3438,#151c1f);
  box-shadow:0 1px 2px rgba(15,22,24,.16),0 10px 28px rgba(15,22,24,.16)}
.ph-screen{display:block;width:100%;height:auto;border-radius:19px;background:#FFFFFF}
/* the pale plate the generated screen reserves for the mark, measured from the assets */
.ph-mark{position:absolute;left:calc(9px + 3.83%);top:calc(9px + 0.97%);
  width:7.34%;height:auto;aspect-ratio:1/1;object-fit:contain;padding:.9%;
  border-radius:5px;z-index:3}
.phone figcaption{margin-top:14px}
.ph-t{font-family:Archivo,sans-serif;font-weight:600;font-size:var(--fs-s);margin:0 0 8px}
.ph-f{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:5px}
.ph-f li{display:flex;justify-content:space-between;align-items:baseline;gap:10px;
  font-size:var(--fs-m);color:var(--ink-2);border-bottom:1px solid var(--rule-2);padding-bottom:5px}
.ph-f .fw{min-width:0}
.ph-f .fr{font-family:"IBM Plex Mono",monospace;font-size:.7rem;letter-spacing:.06em;
  text-transform:uppercase;white-space:nowrap;padding:1px 7px;border-radius:2px;border:1px solid}
.ph-f .fr.r-high{color:#A32617;border-color:#A32617}
.ph-f .fr.r-medium{color:#8F5300;border-color:#8F5300}
.ph-f .fr.r-low{color:var(--ink-3);border-color:var(--rule)}
.ph-a{margin:10px 0 0;display:flex;flex-wrap:wrap;gap:5px;align-items:baseline}
.ph-a .k{font-family:"IBM Plex Mono",monospace;font-size:.68rem;letter-spacing:.07em;
  text-transform:uppercase;color:var(--ink-3);width:100%;margin-bottom:2px}
.ph-a span:not(.k){font-family:"IBM Plex Mono",monospace;font-size:.7rem;color:var(--ink-2);
  border:1px solid var(--rule);border-radius:2px;padding:2px 7px;background:var(--surface)}
.ph-n{margin:10px 0 0;font-size:var(--fs-m);color:var(--ink-3);line-height:1.5}
.phcap{text-align:center;margin-top:22px}
@media (max-width:620px){
  .phones{flex-direction:column;align-items:center}
  .phone{flex:0 1 auto;width:100%;max-width:300px}
}
.geo{display:flex;flex-wrap:wrap;gap:7px}
.geo span{font-family:"IBM Plex Mono",monospace;font-size:var(--fs-m);border:1px solid var(--rule);
  padding:4px 9px;border-radius:2px;color:var(--ink-2);background:var(--surface)}
.delta{display:grid;grid-template-columns:1fr auto 1fr;gap:16px;align-items:center;border:1px solid var(--rule);
  border-radius:3px;background:var(--surface);padding:16px 18px}
@media (max-width:560px){.delta{grid-template-columns:1fr;gap:10px}.delta .arrow{transform:rotate(90deg);justify-self:start}}
.delta .obs{display:flex;flex-direction:column;gap:3px}
.delta .obs .d{font-family:"IBM Plex Mono",monospace;font-size:var(--fs-m);color:var(--ink-3);
  letter-spacing:.08em;text-transform:uppercase}
.delta .obs .n{font-family:"IBM Plex Mono",monospace;font-size:1.5rem;font-weight:500;
  font-variant-numeric:tabular-nums;line-height:1.1}
.delta .obs .s{font-family:Archivo,sans-serif;font-size:var(--fs-m);color:var(--ink-2)}
.delta .obs.now .n{color:var(--series-b)}
.delta .obs.then .n{color:var(--ink-3)}
.delta .arrow{color:var(--ink-3);display:grid;place-items:center}

/* ============ callouts, contact, footer ============ */
.draftbar{border:1px solid var(--series-b);background:var(--sig-soft);border-radius:3px;padding:11px 14px;
  display:flex;gap:10px;align-items:flex-start}
.draftbar .dt{font-family:"IBM Plex Mono",monospace;font-size:10px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--series-b);flex:none;padding-top:2px}
.draftbar p{font-size:var(--fs-s);color:var(--ink-2);line-height:1.55}
.pull{border-left:2px solid var(--series-b);padding:2px 0 2px 16px;font-size:1.06rem;line-height:1.55;
  color:var(--ink);max-width:56ch}
.contact{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:20px}
.cbox{display:flex;flex-direction:column;gap:5px}
.cbox .k{font-family:"IBM Plex Mono",monospace;font-size:var(--fs-m);letter-spacing:.1em;
  text-transform:uppercase;color:var(--ink-3)}
.cbox .v{font-family:Archivo,sans-serif;font-size:var(--fs-s)}
footer.pagefoot{margin-top:54px;border-top:1px solid var(--rule);padding-top:16px;
  display:flex;flex-direction:column;gap:6px}
footer.pagefoot p{font-family:"IBM Plex Mono",monospace;font-size:var(--fs-m);color:var(--ink-3);line-height:1.6}
.footnav{display:flex;flex-wrap:wrap;gap:6px 22px;font-family:Archivo,sans-serif;font-size:var(--fs-s)}
.footnav a{color:var(--ink-2);text-decoration:none;border-bottom:1px solid var(--rule)}
.footnav a:hover{color:var(--ink);border-bottom-color:var(--ink-3)}
.footline{margin-top:4px}
.backlink{display:inline-flex;align-items:center;gap:7px;font-family:Archivo,sans-serif;
  font-size:var(--fs-m);letter-spacing:.06em;text-transform:uppercase;text-decoration:none;color:var(--ink-3)}
.backlink:hover{color:var(--series-b);text-decoration:none}

/* ============ desktop rail ============ */
@media (min-width:1000px){
  .shell{grid-template-columns:var(--rail) minmax(0,1fr)}
  .rail{flex-direction:column;align-items:stretch;justify-content:flex-start;gap:18px;height:100vh;
    border-bottom:0;border-right:1px solid var(--rule);padding:26px 16px 26px 22px;overflow-y:auto}
  .tabs{flex-direction:column;gap:0;overflow:visible;flex:0 1 auto}
  .tab{padding:7px 0;gap:10px}
  .tab .bar{width:14px;height:1.5px}
  .tab[aria-current="page"] .bar{width:24px;height:1.5px}
  .subnav{display:flex;flex-direction:column;gap:0;margin:2px 0 8px 24px;
    border-left:1px solid var(--rule-2);padding-left:12px}
  .subnav a{font-family:Archivo,sans-serif;font-size:.84rem;color:var(--ink-3);
    text-decoration:none;padding:4px 0;line-height:1.35}
  .subnav a:hover{color:var(--ink);text-decoration:none}
  .subnav a[aria-current="true"]{color:var(--series-b)}
  .theme{align-self:flex-start;margin-top:auto}
  main{padding-inline:40px}
  .inner{padding-block:0 110px}
  section{scroll-margin-top:26px}
}

/* ============ currently ============ */
.nowbox{border:1px solid var(--rule);border-left:2px solid var(--series-b);border-radius:3px;
  background:var(--surface);padding:15px 18px 17px;display:flex;flex-direction:column;gap:11px;scroll-margin-top:66px}
.nowhead{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;
  border-bottom:1px solid var(--rule-2);padding-bottom:9px}
.nowdate{font-size:var(--fs-m);color:var(--series-b);margin-left:auto}
.nowlist{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px}
.nowlist li{display:grid;grid-template-columns:auto 1fr;gap:11px;align-items:baseline;
  font-size:var(--fs-s);color:var(--ink-2);line-height:1.52}
.nowlist li b{color:var(--ink);font-weight:600}
.nowlist .nb{width:9px;height:1.5px;background:var(--series-b);flex:none;position:relative;top:-4px}
.todo-vid .shot{border-style:dashed}
.todo-vid .play{border-color:var(--rule);color:var(--ink-3)}
.todo-vid .vt{color:var(--ink-2)}

/* ============ download / document list ============ */
.dl{display:flex;flex-direction:column;border-top:1px solid var(--rule)}
.dlrow{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:16px;align-items:center;
  padding:13px 0;border-bottom:1px solid var(--rule-2)}
.dlrow .di{font-family:"IBM Plex Mono",monospace;font-size:10px;letter-spacing:.1em;color:var(--ink-3);
  border:1px solid var(--rule);border-radius:2px;padding:5px 7px;background:var(--surface)}
.dlrow .db{display:flex;flex-direction:column;gap:2px;min-width:0}
.dlrow .dt2{font-family:Archivo,sans-serif;font-weight:600;font-size:var(--fs-s);color:var(--ink)}
.dlrow .dd{font-size:var(--fs-s);color:var(--ink-2);line-height:1.45}
.dlrow .ds{font-family:"IBM Plex Mono",monospace;font-size:var(--fs-m);color:var(--series-b);white-space:nowrap}

/* ============ logo proposals ============ */
.logogrid{display:grid;grid-template-columns:1fr;gap:20px;align-items:start}
@media (min-width:620px){.logogrid{grid-template-columns:1fr 1fr}}
.logocard{border:1px solid var(--rule);border-radius:3px;background:var(--surface);overflow:hidden;
  display:flex;flex-direction:column;gap:0}
.logocard.primary{grid-column:1/-1;border-color:var(--series-b)}
.logocard .lg{display:grid;place-items:center;padding:26px;background:var(--surface-2);
  border-bottom:1px solid var(--rule);color:var(--ink)}
.logocard .lg svg{width:88px;height:88px;display:block}
.logocard.primary .lg{padding:34px}
.logocard.primary .lg svg{width:116px;height:116px;color:var(--series-b)}
.logocard .lgm{padding:14px 16px;display:flex;flex-direction:column;gap:5px}
.logocard .lgn{font-family:Archivo,sans-serif;font-weight:600;font-size:var(--fs-s);color:var(--ink)}
.logocard .lgd{font-size:var(--fs-s);color:var(--ink-2);line-height:1.5}
.lgrow{display:flex;flex-wrap:wrap;align-items:center;gap:12px;padding:0 16px 16px}
.lgrow .chip{width:52px;height:52px;border-radius:9px;display:grid;place-items:center;flex:none;
  border:1px solid var(--rule)}
.lgrow .chip svg{width:32px;height:32px}
.lgrow .chip.dark{background:#0F1618;color:#F6F7F7;border-color:#0F1618}
.lgrow .chip.light{background:#F6F7F7;color:#0F1618;border-color:var(--rule)}
.lgrow .chip.sig{background:var(--series-b);color:#fff;border-color:var(--series-b)}
.lgrow .tiny{width:24px;height:24px;display:grid;place-items:center;flex:none;color:var(--ink)}
.lgrow .tiny svg{width:24px;height:24px}
.lgrow .lgcap{font-size:var(--fs-m);color:var(--ink-3)}

/* ============ v3 additions ============ */
.crumb{padding-top:clamp(22px,3.2vw,36px)}
.crumb + .pagehead{padding-top:12px}
.titleline{font-family:Archivo,sans-serif;font-size:1.02rem;font-weight:600;color:var(--ink);line-height:1.45}
.dim{color:var(--ink-3);font-weight:400;font-size:var(--fs-s)}
.kicker{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.brandrow{display:flex;align-items:center;margin-bottom:6px}
.ewlogo{height:30px;width:auto}
.orglogo{max-height:32px;max-width:100%;width:auto;height:auto;object-fit:contain;
  object-position:left center;display:block}
.orglogo.tall{max-height:46px}
@media (max-width:520px){.orglogo{max-height:28px}.orglogo.tall{max-height:38px}}
.grouph{font-size:1rem;margin:22px 0 8px;display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.grouph .dim{font-size:var(--fs-m)}
.pubgroup .pub:first-of-type{border-top:1px solid var(--rule)}

.semgrid{display:grid;grid-template-columns:1fr;gap:18px;margin-top:20px;align-items:start}
@media (min-width:640px){.semgrid{grid-template-columns:1fr 1fr}}
.semgrid img,.prodgrid img{width:100%;height:auto;background:var(--ghost)}
.prodgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px;align-items:start}
.prodgrid img{aspect-ratio:1/1;object-fit:cover}

.roles{display:flex;flex-direction:column;border-top:1px solid var(--ink)}
.rolecard{display:grid;grid-template-columns:150px 1fr;gap:6px 26px;padding:24px 0;border-bottom:1px solid var(--rule);text-decoration:none;color:inherit}
.rolecard:hover{text-decoration:none}
.rolecard:hover .rc-org{color:var(--series-b)}
.rolecard > *{grid-column:2}
.rc-when{grid-column:1;grid-row:1;font-size:var(--fs-m);color:var(--ink-3);padding-top:6px;line-height:1.5}
.rc-org{font-family:Archivo,sans-serif;font-weight:700;font-size:1.25rem;letter-spacing:-.018em;color:var(--ink);line-height:1.2;transition:color .13s}
.rc-title{font-family:Archivo,sans-serif;font-weight:500;font-size:var(--fs-b);color:var(--ink-2)}
.rc-where{font-family:"IBM Plex Mono",monospace;font-size:var(--fs-m);color:var(--ink-3);line-height:1.5}
.rc-sum{font-size:var(--fs-s);color:var(--ink-2);line-height:1.55;max-width:66ch;margin-top:6px}
.rc-go{font-family:Archivo,sans-serif;font-size:var(--fs-m);letter-spacing:.06em;text-transform:uppercase;color:var(--series-b);margin-top:8px;white-space:nowrap}
@media (max-width:640px){.rolecard{grid-template-columns:minmax(0,1fr)}
  .rolecard > *{grid-column:1}.rc-when{grid-column:1;grid-row:auto;padding-top:0}}

/* ============ v10: calls to action, publication cards, evidence points ============ */
.cta{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}
.btn{display:inline-flex;align-items:center;font-family:Archivo,sans-serif;font-size:var(--fs-s);font-weight:500;
  text-decoration:none;color:var(--paper);background:var(--ink);border:1px solid var(--ink);
  padding:9px 16px;border-radius:2px;transition:background .13s,color .13s}
.btn:hover{background:var(--ink-2);border-color:var(--ink-2);text-decoration:none}
.btn.ghost{background:transparent;color:var(--ink);border-color:var(--rule)}
.btn.ghost:hover{background:var(--surface-2);color:var(--ink);border-color:var(--ink-3)}
.prose.lead{max-width:74ch}
.seclink{font-family:Archivo,sans-serif;font-size:var(--fs-m);letter-spacing:.06em;text-transform:uppercase;
  color:var(--ink-3);text-decoration:none;white-space:nowrap}
.seclink:hover{color:var(--series-b)}

.pubs{display:flex;flex-direction:column;border-top:1px solid var(--rule)}
.pubcard{display:flex;flex-direction:column;gap:7px;padding:20px 0;border-bottom:1px solid var(--rule)}
.pubcard .pt{font-family:Archivo,sans-serif;font-weight:600;font-size:1.06rem;line-height:1.3;
  letter-spacing:-.012em;color:var(--ink);text-decoration:none;max-width:74ch}
a.pt:hover{color:var(--series-b);text-decoration:none}
.pubcard .pm{font-family:"IBM Plex Mono",monospace;font-size:var(--fs-m);color:var(--ink-3);line-height:1.5}
.pubcard .pm i{font-style:italic}
.pubcard .pl{font-size:var(--fs-s);color:var(--ink-2);line-height:1.55;max-width:74ch}
.pubcard .px{display:flex;flex-wrap:wrap;gap:6px 18px;margin-top:2px}
.pubcard .px a{font-family:Archivo,sans-serif;font-size:var(--fs-m);letter-spacing:.05em;text-transform:uppercase;
  color:var(--series-b);text-decoration:none;border-bottom:1px solid transparent}
.pubcard .px a:hover{border-bottom-color:var(--series-b)}
.pubnote{margin-top:16px;max-width:74ch;font-size:var(--fs-s);color:var(--ink-2);line-height:1.55}

.rc-ev{display:flex;flex-direction:column;gap:4px;margin-top:10px}
.rc-ev span{position:relative;padding-left:16px;font-family:Archivo,sans-serif;font-size:var(--fs-s);
  color:var(--ink-2);line-height:1.45;max-width:66ch}
.rc-ev span::before{content:"";position:absolute;left:0;top:.62em;width:7px;height:1px;background:var(--series-b)}

.gate.wide{padding-right:0}
.gate.wide .gd{max-width:72ch}
section > .gate.wide{border-top:1px solid var(--rule)}
.nowlist{border-top:1px solid var(--rule);padding:6px 0 0}
.nowlist li a{white-space:nowrap}


/* ============ SafeLife Context: reconstructed product screens ============ */
.sl-teal{--sl-teal:#0E6F6A}
.subh{font-family:Archivo,sans-serif;font-weight:600;font-size:1.02rem;letter-spacing:-.006em;
  color:var(--ink);margin-top:34px;padding-bottom:8px;border-bottom:1px solid var(--rule)}
.miles{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.miles li{display:grid;grid-template-columns:104px minmax(140px,220px) minmax(0,1fr);gap:4px 22px;
  align-items:baseline;padding:13px 0;border-bottom:1px solid var(--rule-2)}
.miles .my{font-size:var(--fs-m);color:var(--ink-3);letter-spacing:.04em}
.miles .mt{font-family:Archivo,sans-serif;font-weight:600;font-size:var(--fs-s);color:var(--ink);line-height:1.3}
.miles .md{font-size:var(--fs-s);color:var(--ink-2);line-height:1.55;max-width:72ch}
@media (max-width:760px){.miles li{grid-template-columns:84px minmax(0,1fr)}.miles .md{grid-column:2}}
.pics{display:grid;gap:14px;margin-top:20px}
.pics figure{margin:0;min-width:0}
.pics img{width:100%;aspect-ratio:3/2;object-fit:cover;display:block;background:var(--ghost)}
.pics figcaption{font-size:var(--fs-m);color:var(--ink-3);margin-top:6px;line-height:1.45}
.pics.one{grid-template-columns:minmax(0,1fr);max-width:620px}
.pics.two{grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}
.slbrand{display:flex;gap:18px;align-items:flex-start;border-top:1px solid var(--rule);
  border-bottom:1px solid var(--rule);padding:20px 0;margin-bottom:22px}
.slmark{flex:none;display:inline-flex;padding:6px;background:#FFFFFF;border:1px solid var(--rule);border-radius:6px}
.slmark img{width:64px;height:64px;display:block}
.slname{font-family:Archivo,sans-serif;font-weight:700;font-size:1.16rem;letter-spacing:-.018em;color:var(--ink)}
.sldesc{font-family:Archivo,sans-serif;font-size:var(--fs-s);color:var(--ink-2);margin-top:2px}
.slone{font-size:var(--fs-s);color:var(--ink-3);margin-top:6px;max-width:60ch}
.slnotice{margin-top:26px;padding:11px 14px;border-left:3px solid #0E6F6A;background:var(--surface-2);
  font-family:Archivo,sans-serif;font-size:var(--fs-s);color:var(--ink-2);line-height:1.5}

.stages{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));border-top:1px solid var(--rule);
  border-bottom:1px solid var(--rule)}
.stages .sg{display:flex;flex-direction:column;gap:5px;padding:14px 16px 14px 0;border-right:1px solid var(--rule-2)}
.stages .sg:last-child{border-right:0;padding-right:0}
.stages .sn{font-family:"IBM Plex Mono",monospace;font-size:var(--fs-m);color:var(--series-b);letter-spacing:.08em}
.stages .st{font-family:Archivo,sans-serif;font-weight:600;font-size:var(--fs-s);color:var(--ink);line-height:1.25}
.stages .sd{font-size:var(--fs-m);color:var(--ink-2);line-height:1.45}
@media (max-width:900px){.stages{grid-template-columns:repeat(2,minmax(0,1fr))}
  .stages .sg{border-right:1px solid var(--rule-2);border-bottom:1px solid var(--rule-2)}
  .stages .sg:nth-child(2n){border-right:0;padding-right:0}
  .stages .sg:last-child{border-bottom:0}}
@media (max-width:520px){.stages{grid-template-columns:minmax(0,1fr)}
  .stages .sg{border-right:0;padding-right:0}}
.slscreens{display:flex;flex-direction:column;gap:26px;margin-top:22px}
.slscreen{border:1px solid var(--rule);border-radius:4px;overflow:hidden;background:var(--surface)}
.slbar{display:flex;align-items:baseline;gap:12px;padding:10px 14px;background:#0E6F6A;color:#FFFFFF}
.slnum{font-size:var(--fs-m);letter-spacing:.12em;text-transform:uppercase;opacity:.82}
.sltitle{font-family:Archivo,sans-serif;font-weight:600;font-size:var(--fs-s)}
.slbody{padding:14px;display:flex;flex-direction:column;gap:13px}
.slpurpose{padding:0 14px 14px;font-size:var(--fs-s);color:var(--ink-2);line-height:1.5;max-width:78ch}
.slpurpose b{color:var(--ink);font-weight:600}
.slcap{display:inline-block;margin-top:5px;font-style:italic;color:var(--ink-3)}
.slfict{font-family:"IBM Plex Mono",monospace;font-size:var(--fs-m);letter-spacing:.04em;color:var(--fict);
  border:1px dashed var(--fict);border-radius:3px;padding:6px 10px;align-self:flex-start}
.slh{font-family:Archivo,sans-serif;font-size:var(--fs-m);letter-spacing:.11em;text-transform:uppercase;
  color:var(--ink-3);margin-top:2px}
.slmeta{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:11px 22px}
.slmeta > div{display:flex;flex-direction:column;gap:2px}
.slmeta .k{font-family:"IBM Plex Mono",monospace;font-size:var(--fs-m);letter-spacing:.1em;
  text-transform:uppercase;color:var(--ink-3)}
.slmeta .v{font-family:Archivo,sans-serif;font-size:var(--fs-s);color:var(--ink);line-height:1.4}

.slrows{display:flex;flex-direction:column;border-top:1px solid var(--rule-2)}
.slrow{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:8px 14px;align-items:center;
  padding:9px 0;border-bottom:1px solid var(--rule-2)}
@media (max-width:600px){.slrow{grid-template-columns:auto auto;justify-content:start}
  .slrow .slwhat{grid-column:1/-1;order:3}}
.slbadge{font-family:Archivo,sans-serif;font-size:var(--fs-m);font-weight:500;letter-spacing:.04em;
  color:#FFFFFF;padding:3px 8px;border-radius:2px;white-space:nowrap}
.slbadge.amber{background:#8F5300}
.slbadge.teal{background:#0E6F6A}
.slbadge.slate{background:#41525A}
.slwhat{font-family:Archivo,sans-serif;font-size:var(--fs-s);color:var(--ink);line-height:1.4}
.slrisk{font-family:Archivo,sans-serif;font-size:var(--fs-m);font-weight:600;white-space:nowrap;
  padding:3px 8px;border-radius:2px;border:1px solid transparent}
.slrisk.r-high{color:#FFFFFF;background:#A32617}
.slrisk.r-med{color:#FFFFFF;background:#8F5300}
.slrisk.r-low{color:#FFFFFF;background:#41525A}
.slactions{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px}
.slactions .k{font-family:"IBM Plex Mono",monospace;font-size:var(--fs-m);letter-spacing:.1em;
  text-transform:uppercase;color:var(--ink-3);margin-right:6px}
.slactions span:not(.k){font-family:Archivo,sans-serif;font-size:var(--fs-m);color:var(--ink-2);
  border:1px solid var(--rule);border-radius:2px;padding:4px 10px;background:var(--surface-2)}
.slwarn b{color:var(--ink);font-weight:600}
.slwarn{font-size:var(--fs-s);color:var(--ink-2);line-height:1.5;padding-left:12px;
  border-left:2px solid #8F5300;max-width:76ch}
.sltags{display:flex;flex-wrap:wrap;gap:6px}
.sltags span{font-family:Archivo,sans-serif;font-size:var(--fs-m);color:var(--ink-2);
  border:1px solid var(--rule);border-radius:2px;padding:4px 9px}
.sltags.cats span{font-size:var(--fs-s);padding:5px 11px}

.slshot{display:flex;flex-direction:column;gap:8px;margin:0}
.slframe{position:relative;line-height:0;background:var(--surface-2);border:1px solid var(--rule)}
.slframe img{width:100%;height:auto;display:block}
.slbox{position:absolute;border:2px solid #A32617;box-shadow:0 0 0 1px rgba(255,255,255,.85);border-radius:1px}
.slbox .sltab{position:absolute;left:-2px;bottom:100%;margin-bottom:3px;white-space:nowrap;
  font-family:Archivo,sans-serif;font-size:11px;font-weight:600;line-height:1.25;letter-spacing:.01em;
  color:#FFFFFF;background:#A32617;padding:3px 7px;border-radius:2px}
.slbox.below .sltab{bottom:auto;top:100%;margin-bottom:0;margin-top:3px}
.slbox.end .sltab{left:auto;right:-2px}
.slbox.r-med{border-color:#8F5300}
.slbox.r-med .sltab{background:#8F5300}
.slbox.r-low{border-color:#41525A}
.slbox.r-low .sltab{background:#41525A}
.slbox.r-done{border-color:#0E6F6A;border-style:dashed}
.slbox.r-done .sltab{background:#0E6F6A}
@media (max-width:560px){.slbox .sltab{font-size:10px;padding:2px 5px}}
.slba{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:14px}
.slba figure{margin:0;display:flex;flex-direction:column;gap:6px}

/* ============ CV page ============ */
.cvjobs{display:flex;flex-direction:column;border-top:1px solid var(--rule)}
.cvjob{padding:20px 0;border-bottom:1px solid var(--rule)}
.cvh{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 16px}
.cvo{font-family:Archivo,sans-serif;font-weight:700;font-size:1.14rem;letter-spacing:-.018em;color:var(--ink)}
.cvo a{color:inherit;text-decoration:none;border-bottom:1px solid var(--rule)}
.cvo a:hover{color:var(--series-b);border-bottom-color:var(--series-b)}
.cvw{font-size:var(--fs-m);color:var(--ink-3);margin-left:auto;white-space:nowrap}
@media (max-width:700px){.cvw{margin-left:0;white-space:normal;line-height:1.5}}
@media (max-width:640px){.cvw{margin-left:0}}
.cvr{font-family:Archivo,sans-serif;font-size:var(--fs-s);color:var(--ink-2);margin-top:3px}
.cvb{margin:10px 0 0;padding:0;list-style:none;display:flex;flex-direction:column;gap:7px}
.cvb li{position:relative;padding-left:17px;font-size:var(--fs-s);color:var(--ink-2);line-height:1.55;max-width:76ch}
.cvb li::before{content:"";position:absolute;left:0;top:.66em;width:8px;height:1px;background:var(--series-b)}
.cvb.plain{margin-top:0;border-top:1px solid var(--rule);padding-top:14px}
.cvpubs{margin:0;padding:0 0 0 22px;display:flex;flex-direction:column;gap:11px;
  border-top:1px solid var(--rule);padding-top:14px}
.cvpubs li{font-size:var(--fs-s);color:var(--ink-2);line-height:1.55;max-width:78ch}
.cvpubs li b{color:var(--ink)}


/* ============ v11 components ============ */
/* method / actor / status cards: ruled grid, no boxes */
.quad{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:34px;border-top:1px solid var(--rule)}
.quad.q3{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:640px){.quad,.quad.q3{grid-template-columns:minmax(0,1fr)}}
.quad > div{display:flex;flex-direction:column;gap:5px;padding:16px 0 18px;border-bottom:1px solid var(--rule-2)}
.quad .qt{font-family:Archivo,sans-serif;font-weight:600;font-size:var(--fs-s);color:var(--ink);line-height:1.3}
.quad .qd{font-size:var(--fs-s);color:var(--ink-2);line-height:1.5}

/* the recurring research question, set as a rule-marked block */
.qblock{border-left:2px solid var(--series-b);padding:2px 0 2px 16px;margin:18px 0;
  font-family:"Source Serif 4",Georgia,serif;font-size:1.06rem;line-height:1.55;color:var(--ink);max-width:66ch}
.chain{display:flex;flex-wrap:wrap;gap:6px 0;align-items:center;margin:16px 0 0;
  font-family:"IBM Plex Mono",monospace;font-size:var(--fs-m);color:var(--ink-2)}
.chain span{white-space:nowrap}
.chain span + span::before{content:"\2192";color:var(--series-b);padding:0 9px}

/* case blocks on the Safe Life page */
.case{border-top:2px solid var(--ink);padding-top:16px;margin-top:clamp(30px,4vw,46px)}
.case > h3{font-family:Archivo,sans-serif;font-weight:700;font-size:1.22rem;letter-spacing:-.018em;color:var(--ink)}
.case .sub{font-family:"IBM Plex Mono",monospace;font-size:var(--fs-m);letter-spacing:.11em;
  text-transform:uppercase;color:var(--ink-3);margin-top:18px;padding-bottom:7px;border-bottom:1px solid var(--rule-2)}
.case .sub + *{margin-top:12px}

/* ordered workflow list */
.olist{counter-reset:o;list-style:none;margin:14px 0 0;padding:0;display:flex;flex-direction:column;gap:9px}
.olist li{counter-increment:o;position:relative;padding-left:30px;font-size:var(--fs-s);
  color:var(--ink-2);line-height:1.55;max-width:74ch}
.olist li::before{content:counter(o);position:absolute;left:0;top:0;font-family:"IBM Plex Mono",monospace;
  font-size:var(--fs-m);color:var(--series-b)}

/* v11 timeline: milestone text with its evidence photograph beside it */
.tl11{display:flex;flex-direction:column;border-left:1.5px solid var(--rule);margin-left:5px}
.tl11 .ms{display:grid;grid-template-columns:88px minmax(0,1fr);gap:6px 16px;padding:0 0 30px;position:relative}
.tl11 .ms:last-child{padding-bottom:4px}
.tl11 .yr{font-family:"IBM Plex Mono",monospace;font-size:var(--fs-m);color:var(--ink-3);
  padding-left:16px;position:relative;top:3px;line-height:1.4}
.tl11 .yr::before{content:"";position:absolute;left:-6px;top:8px;width:11px;height:1.5px;background:var(--rule)}
.tl11 .ms.key .yr{color:var(--series-b)}
.tl11 .ms.key .yr::before{background:var(--series-b);width:17px}
.tl11 .bd{display:grid;grid-template-columns:minmax(0,1fr);gap:10px 20px;min-width:0}
.tl11 .bd.withpic{grid-template-columns:minmax(0,1.35fr) minmax(190px,.85fr)}
@media (max-width:720px){.tl11 .bd.withpic{grid-template-columns:minmax(0,1fr)}
  .tl11 .ms{grid-template-columns:minmax(0,1fr)}.tl11 .yr{top:0;padding-left:16px}}
.tl11 h3{font-family:Archivo,sans-serif;font-weight:600;font-size:1rem;color:var(--ink);line-height:1.3}
.tl11 p{font-size:var(--fs-s);color:var(--ink-2);line-height:1.55;margin-top:5px;max-width:62ch}
.tl11 figure{margin:0;min-width:0}
.tl11 figure img{width:100%;aspect-ratio:3/2;object-fit:cover;display:block;background:var(--ghost)}
.tl11 figcaption{font-size:var(--fs-m);color:var(--ink-3);margin-top:5px;line-height:1.4}

/* product formats with a status label */
.formats{display:grid;grid-template-columns:repeat(auto-fit,minmax(215px,1fr));gap:20px;margin-top:20px}
.fmt{display:flex;flex-direction:column;gap:7px;min-width:0}
.fmt img{width:100%;aspect-ratio:1/1;object-fit:cover;border:1px solid var(--rule);background:#FFFFFF;display:block}
.fmt .fs{align-self:flex-start;font-family:Archivo,sans-serif;font-size:10.5px;font-weight:600;letter-spacing:.07em;
  text-transform:uppercase;color:var(--paper);background:var(--ink-2);padding:3px 7px;border-radius:2px}
.fmt .fn{font-family:Archivo,sans-serif;font-weight:600;font-size:var(--fs-s);color:var(--ink);line-height:1.3}
.fmt .fg{font-family:"IBM Plex Mono",monospace;font-size:var(--fs-m);color:var(--ink-3)}
.fmt .fd{font-size:var(--fs-s);color:var(--ink-2);line-height:1.5}

/* evidence and operating artifacts */
.arts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:34px;border-top:1px solid var(--rule)}
@media (max-width:640px){.arts{grid-template-columns:minmax(0,1fr)}}
.art{display:flex;flex-direction:column;gap:6px;padding:18px 0 20px;border-bottom:1px solid var(--rule-2)}
.art .at{font-family:Archivo,sans-serif;font-weight:600;font-size:var(--fs-s);color:var(--ink);line-height:1.3}
.art .ak{font-family:"IBM Plex Mono",monospace;font-size:var(--fs-m);color:var(--ink-3);line-height:1.45}
.art .ad{font-size:var(--fs-s);color:var(--ink-2);line-height:1.5}
.art .aa{font-family:Archivo,sans-serif;font-size:var(--fs-m);letter-spacing:.05em;text-transform:uppercase;
  color:var(--ink-3);margin-top:4px}

/* actor paths on the Bilqees page */
.paths{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:34px;border-top:1px solid var(--rule)}
@media (max-width:640px){.paths{grid-template-columns:minmax(0,1fr)}}
.path{display:flex;flex-direction:column;gap:8px;padding:20px 0 22px;border-bottom:1px solid var(--rule-2)}
.path .pt{font-family:Archivo,sans-serif;font-weight:600;font-size:1rem;color:var(--ink);line-height:1.3}
.path .pd{font-size:var(--fs-s);color:var(--ink-2);line-height:1.55}
.path .pb{margin-top:auto;padding-top:10px}
.path .pb a{display:inline-flex;align-items:center;font-family:Archivo,sans-serif;font-size:var(--fs-s);
  font-weight:500;text-decoration:none;color:var(--ink);border:1px solid var(--rule);
  padding:7px 13px;border-radius:2px;transition:background .13s,border-color .13s}
.path .pb a:hover{background:var(--surface-2);border-color:var(--ink-3);text-decoration:none}

/* publication cards with question / approach / finding */
.qaf{display:flex;flex-direction:column;gap:9px;margin-top:10px}
.qaf > div{display:grid;grid-template-columns:96px minmax(0,1fr);gap:4px 16px;align-items:baseline}
@media (max-width:560px){.qaf > div{grid-template-columns:minmax(0,1fr)}}
.qaf .k{font-family:"IBM Plex Mono",monospace;font-size:var(--fs-m);letter-spacing:.1em;
  text-transform:uppercase;color:var(--ink-3)}
.qaf .t{font-size:var(--fs-s);color:var(--ink-2);line-height:1.55;max-width:70ch}
.cite{font-family:"IBM Plex Mono",monospace;font-size:var(--fs-m);color:var(--ink-3);line-height:1.55;
  margin-top:10px;max-width:78ch}
.cite b{color:var(--ink-2);font-weight:500}

/* status line under a research item */
.statline{font-family:Archivo,sans-serif;font-size:var(--fs-m);color:var(--ink-2);margin-top:8px}
.statline b{color:var(--ink);font-weight:600}

/* ============ paper figures ============ */
.figbox{border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);padding:16px 0 12px;overflow-x:auto}
.figbox svg.fig{width:100%;min-width:560px;height:auto;display:block}
.figbox figcaption{padding:10px 4px 0}

/* ============ segmented controls for instruments ============ */
.ctl .ctl-l{font-family:Archivo,sans-serif;font-size:var(--fs-s);font-weight:500;white-space:nowrap}
.seg{display:inline-flex;flex-wrap:wrap;border:1px solid var(--rule);border-radius:3px;overflow:hidden;background:var(--surface)}
.seg button{appearance:none;border:0;border-right:1px solid var(--rule);background:transparent;cursor:pointer;
  font-family:Archivo,sans-serif;font-size:var(--fs-s);color:var(--ink-2);padding:7px 12px;line-height:1.2;transition:background .12s,color .12s}
.seg button:last-child{border-right:0}
.seg button:hover{background:var(--surface-2);color:var(--ink)}
.seg button[aria-pressed="true"]{background:var(--ink);color:var(--paper)}
.inst-b .ctl + .ctl{margin-top:-4px}
.instrument .small{margin-top:0}

/* ============ per-paper palettes, taken from each manuscript's own figures and validated for both themes ============ */
.shell[data-paper="est"]{--series-a:#4c9a4c;--series-b:#c04ac0}
.shell[data-paper="ieee"]{--series-a:#3f7fd6;--series-b:#d24a8c}
.shell[data-paper="fuel"]{--series-a:#2f6fd0;--series-b:#d23a2e}
.shell[data-paper="frontiers"]{--series-a:#4472c4;--series-b:#c0392b}
.shell[data-paper="acs"]{--series-a:#3e8ec2;--series-b:#b47800}
.shell[data-paper="jem"]{--series-a:#4e85dd;--series-b:#bd720e}
.shell[data-paper="awwa"]{--series-a:#418ad1;--series-b:#bd7208}
.shell[data-paper="etr"]{--series-a:#2f6f9f;--series-b:#d9541e}
.shell[data-paper="fabs"]{--series-a:#2a6db3;--series-b:#3a9a4a}
.shell[data-paper="dbp"]{--series-a:#398dcb;--series-b:#ca681d}
.shell[data-paper="ew"]{--series-a:#0d93b2;--series-b:#c46a12}
.shell[data-paper="patent"]{--series-a:#1393bf;--series-b:#c7692b}
.shell[data-paper="engro"]{--series-a:#4a5fb5;--series-b:#9a6206}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]) .shell[data-paper="est"]{--series-a:#4d9b4d;--series-b:#c34dc3}
  :root:not([data-theme="light"]) .shell[data-paper="ieee"]{--series-a:#4686de;--series-b:#d44c8e}
  :root:not([data-theme="light"]) .shell[data-paper="fuel"]{--series-a:#4384e7;--series-b:#e24a3c}
  :root:not([data-theme="light"]) .shell[data-paper="frontiers"]{--series-a:#5584d8;--series-b:#db5342}
  :root:not([data-theme="light"]) .shell[data-paper="acs"]{--series-a:#4b9acf;--series-b:#c1851d}
  :root:not([data-theme="light"]) .shell[data-paper="jem"]{--series-a:#5a91eb;--series-b:#d07b00}
  :root:not([data-theme="light"]) .shell[data-paper="awwa"]{--series-a:#4e96df;--series-b:#ca7e21}
  :root:not([data-theme="light"]) .shell[data-paper="etr"]{--series-a:#458dc4;--series-b:#db5620}
  :root:not([data-theme="light"]) .shell[data-paper="fabs"]{--series-a:#4789d1;--series-b:#3d9d4d}
  :root:not([data-theme="light"]) .shell[data-paper="dbp"]{--series-a:#4799d8;--series-b:#df6e0d}
  :root:not([data-theme="light"]) .shell[data-paper="ew"]{--series-a:#1a9fbe;--series-b:#d67a24}
  :root:not([data-theme="light"]) .shell[data-paper="patent"]{--series-a:#00a0d3;--series-b:#d47639}
  :root:not([data-theme="light"]) .shell[data-paper="engro"]{--series-a:#7a8ce0;--series-b:#C08A18}
}
:root[data-theme="dark"] .shell[data-paper="est"]{--series-a:#4d9b4d;--series-b:#c34dc3}
:root[data-theme="dark"] .shell[data-paper="ieee"]{--series-a:#4686de;--series-b:#d44c8e}
:root[data-theme="dark"] .shell[data-paper="fuel"]{--series-a:#4384e7;--series-b:#e24a3c}
:root[data-theme="dark"] .shell[data-paper="frontiers"]{--series-a:#5584d8;--series-b:#db5342}
:root[data-theme="dark"] .shell[data-paper="acs"]{--series-a:#4b9acf;--series-b:#c1851d}
:root[data-theme="dark"] .shell[data-paper="jem"]{--series-a:#5a91eb;--series-b:#d07b00}
:root[data-theme="dark"] .shell[data-paper="awwa"]{--series-a:#4e96df;--series-b:#ca7e21}
:root[data-theme="dark"] .shell[data-paper="etr"]{--series-a:#458dc4;--series-b:#db5620}
:root[data-theme="dark"] .shell[data-paper="fabs"]{--series-a:#4789d1;--series-b:#3d9d4d}
:root[data-theme="dark"] .shell[data-paper="dbp"]{--series-a:#4799d8;--series-b:#df6e0d}
:root[data-theme="dark"] .shell[data-paper="ew"]{--series-a:#1a9fbe;--series-b:#d67a24}
:root[data-theme="dark"] .shell[data-paper="patent"]{--series-a:#00a0d3;--series-b:#d47639}
:root[data-theme="dark"] .shell[data-paper="engro"]{--series-a:#7a8ce0;--series-b:#C08A18}

.shell[data-paper] .pagehead{border-top:3px solid var(--series-b);padding-top:18px}
.shell[data-paper] .crumb + .pagehead{padding-top:16px}
.swatchline{display:flex;align-items:center;gap:9px;font-family:"IBM Plex Mono",monospace;font-size:var(--fs-m);color:var(--ink-3)}
.swatchline .sw{display:inline-flex;gap:3px}
.swatchline .sw i{display:block;width:14px;height:14px;border-radius:2px}
.shell[data-paper] .theme button[aria-pressed="true"]{color:var(--series-b)}

/* ============ page transitions ============ */
main{transition:opacity .2s cubic-bezier(.4,0,1,1)}
html.entering main{transition:opacity .32s cubic-bezier(0,0,.2,1), transform .32s cubic-bezier(0,0,.2,1)}
html.leaving main{opacity:0}
html.entering main{opacity:0;transform:translateY(6px)}
@media (prefers-reduced-motion: reduce){
  main{transition:none}
}

/* ============ everywater page ============ */
.tl .pics{display:grid;grid-template-columns:repeat(auto-fill,minmax(148px,1fr));gap:10px;margin-top:10px;max-width:680px}
.tl .pics figure{margin:0;min-width:0}
.tl .pics img{width:100%;aspect-ratio:3/2;object-fit:cover;display:block;background:var(--ghost)}
.tl .pics figure.wide{grid-column:span 2}
.tl .pics figure.wide img{aspect-ratio:3/1;object-fit:contain;background:#FFFFFF}
.tl .pics figcaption{font-family:"IBM Plex Mono",monospace;font-size:var(--fs-m);color:var(--ink-3);margin-top:5px;line-height:1.4}
.photogrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:16px;margin-top:18px;align-items:start}
.photogrid figure{margin:0;min-width:0}
.photogrid img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block;background:var(--ghost)}
.photogrid figcaption{font-size:var(--fs-m);color:var(--ink-3);margin-top:6px;line-height:1.45}
.prodcards{display:grid;grid-template-columns:repeat(auto-fit,minmax(168px,1fr));gap:16px;margin-top:18px}
.prodcard{display:flex;flex-direction:column;gap:6px;min-width:0}
.prodcard img{width:100%;aspect-ratio:1/1;object-fit:cover;border:1px solid var(--rule);background:#FFFFFF;display:block}
.prodcard .pn{font-family:Archivo,sans-serif;font-weight:600;font-size:var(--fs-s);line-height:1.3;color:var(--ink)}
.prodcard .pg{font-family:"IBM Plex Mono",monospace;font-size:var(--fs-m);color:var(--ink-2);letter-spacing:.04em}
.prodcard .pd{font-size:var(--fs-m);color:var(--ink-3);line-height:1.45}
.spec-reads{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px 20px;border-top:1px solid var(--rule-2);padding-top:12px}
.spec-reads div{min-width:0}
.spec-reads .k{display:block;font-family:"IBM Plex Mono",monospace;font-size:var(--fs-m);text-transform:uppercase;letter-spacing:.07em;color:var(--ink-3);margin-bottom:3px}
.spec-reads .v{font-size:var(--fs-s);color:var(--ink);line-height:1.45}
.spec-reads .v.long{grid-column:1/-1}
.seg button{white-space:nowrap}
.ctl[hidden]{display:none}
.fibrepair{display:grid;grid-template-columns:1fr;gap:16px;margin-top:18px}
@media (min-width:640px){.fibrepair{grid-template-columns:1fr 1fr}}
.fibrepair img{width:100%;height:auto;display:block}
.fibrepair figcaption{font-size:var(--fs-m);color:var(--ink-3);margin-top:6px;line-height:1.45}
.stagebar{display:flex;flex-wrap:wrap;gap:4px 10px;font-family:"IBM Plex Mono",monospace;font-size:var(--fs-m);color:var(--ink-2);margin-top:16px}
.stagebar span+span::before{content:"\2192";margin-right:10px;color:var(--ink-3)}

/* ============ logos ============ */
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]) .ph-f .fr.r-high{color:#F08C7E;border-color:#F08C7E}
  :root:not([data-theme="light"]) .ph-f .fr.r-medium{color:#E0A24A;border-color:#E0A24A}
  :root:not([data-theme="light"]) .orglogo{background:#F2F4F4;border-radius:3px;padding:5px 8px}
  :root:not([data-theme="light"]) .award .logo, :root:not([data-theme="light"]) .edurow .logo{background:#F2F4F4;border:1px solid rgba(255,255,255,.10)}
  :root:not([data-theme="light"]) .logo .plate{background:var(--surface-2);border-left-color:var(--ink-3);color:var(--ink)}
  :root:not([data-theme="light"]) .ewlogo{filter:invert(1) hue-rotate(180deg)}
}
:root[data-theme="dark"] .ph-f .fr.r-high{color:#F08C7E;border-color:#F08C7E}
:root[data-theme="dark"] .ph-f .fr.r-medium{color:#E0A24A;border-color:#E0A24A}
:root[data-theme="dark"] .orglogo{background:#F2F4F4;border-radius:3px;padding:5px 8px}
:root[data-theme="dark"] .award .logo, :root[data-theme="dark"] .edurow .logo{background:#F2F4F4;border:1px solid rgba(255,255,255,.10)}
:root[data-theme="dark"] .logo .plate{background:var(--surface-2);border-left-color:var(--ink-3);color:var(--ink)}
:root[data-theme="dark"] .ewlogo{filter:invert(1) hue-rotate(180deg)}
:root[data-theme="light"] .ewlogo,:root[data-theme="light"] .orglogo,:root[data-theme="light"] .award .logo img,:root[data-theme="light"] .edurow .logo img{filter:none}
.edu{display:flex;flex-direction:column;border-top:1px solid var(--rule)}
.edurow{display:grid;grid-template-columns:120px minmax(0,1fr) auto;gap:8px 26px;padding:24px 0;border-bottom:1px solid var(--rule-2);align-items:start}
.edurow .logo{width:120px;min-height:58px;display:flex;align-items:center;justify-content:flex-start;
  padding:6px;box-sizing:border-box;border-radius:3px;flex:none}
.edurow .logo img{display:block;width:auto;height:auto;max-width:100%;max-height:44px;
  object-fit:contain;object-position:center left;background:none;border:0;padding:0}
.edurow .deg{font-family:Archivo,sans-serif;font-weight:600;font-size:1.02rem;line-height:1.3;color:var(--ink)}
.edurow .inst{font-size:var(--fs-s);color:var(--ink-2);line-height:1.5;margin-top:3px}
.edurow .det{font-size:var(--fs-s);color:var(--ink-3);line-height:1.5;margin-top:4px}
.edurow .when{font-family:"IBM Plex Mono",monospace;font-size:var(--fs-s);color:var(--ink-3);white-space:nowrap;padding-top:4px}
@media (max-width:640px){.edurow{grid-template-columns:1fr}.edurow .logo{min-height:44px}.edurow .logo img{max-height:38px}.edurow .when{padding-top:0}}
.heroimg{margin:26px 0 0}
.heroimg img{width:100%;height:auto;display:block;aspect-ratio:3/2;object-fit:cover}
.heroimg figcaption{padding-top:8px}

/* ============ mentoring forms ============ */
.forms{display:flex;flex-direction:column;gap:0;margin-top:20px;border-top:1px solid var(--rule)}
.mform{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px 26px;
  padding:26px 0 30px;border-bottom:1px solid var(--rule-2)}
.mform h3{grid-column:1/-1;font-family:Archivo,sans-serif;font-weight:600;font-size:1.12rem;
  letter-spacing:-.014em;color:var(--ink);line-height:1.25}
.mform .fblurb{grid-column:1/-1;font-size:var(--fs-s);color:var(--ink-2);line-height:1.55;max-width:68ch;margin:-6px 0 4px}
.frow{display:flex;flex-direction:column;gap:5px;min-width:0}
.frow.wide{grid-column:1/-1}
.frow label{font-family:"IBM Plex Mono",monospace;font-size:var(--fs-m);letter-spacing:.07em;
  text-transform:uppercase;color:var(--ink-3)}
.frow input,.frow select,.frow textarea{font-family:Archivo,sans-serif;font-size:var(--fs-s);color:var(--ink);
  background:transparent;border:0;border-bottom:1px solid var(--rule);padding:7px 0;width:100%;
  border-radius:0;appearance:none;transition:border-color .14s}
.frow textarea{border:1px solid var(--rule);padding:9px 10px;resize:vertical;line-height:1.5}
.frow select{background-image:linear-gradient(45deg,transparent 50%,var(--ink-3) 50%),linear-gradient(135deg,var(--ink-3) 50%,transparent 50%);
  background-position:calc(100% - 9px) 55%,calc(100% - 4px) 55%;background-size:5px 5px,5px 5px;background-repeat:no-repeat;padding-right:22px}
.frow input:focus,.frow select:focus,.frow textarea:focus{outline:none;border-color:var(--series-b)}
.frow input::placeholder,.frow textarea::placeholder{color:var(--ink-3);opacity:.75}
.frow.send{display:flex;flex-direction:row;align-items:center;gap:16px;flex-wrap:wrap;margin-top:4px}
.mform button{font-family:Archivo,sans-serif;font-weight:600;font-size:var(--fs-s);color:var(--paper);
  background:var(--ink);border:0;padding:10px 20px;border-radius:2px;cursor:pointer;transition:background .14s}
.mform button:hover{background:var(--series-b)}
.fnote{font-family:"IBM Plex Mono",monospace;font-size:var(--fs-m);color:var(--series-a);line-height:1.5;max-width:52ch}
.fnote.warn{color:var(--series-b)}
.steps3{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:0;margin-top:16px;border-top:1px solid var(--rule)}
.s3{display:grid;grid-template-columns:auto 1fr;gap:14px;padding:18px 22px 20px 0;border-bottom:1px solid var(--rule-2);align-items:start}
.s3 .n{font-family:"IBM Plex Mono",monospace;font-size:1.1rem;color:var(--series-b);line-height:1.2}
.s3 b{font-family:Archivo,sans-serif;font-size:var(--fs-s);color:var(--ink);display:block;margin-bottom:4px}
.s3 p{font-size:var(--fs-s);color:var(--ink-2);line-height:1.5}

/* the EveryWater case study borrows the ew palette but is not a paper detail page */
.shell[data-paper="ew"] .pagehead{border-top:0;padding-top:14px}

/* An instrument is drawn by instruments.js. With scripting off the controls cannot
   do anything and the plot area stays empty, so the body is removed and one line of
   explanation takes its place. The surrounding prose carries the finding either way. */
.inst-nojs{margin:0;padding:14px 0 2px;font-size:var(--fs-s);color:var(--ink-2);line-height:1.5}
