:root{
  --bg:#0c0b09;
  --ink:#ece7dc;
  --mute:#8a8478;
  --line:#2c2822;
  --card:#14120f;
  --cu:#c4894a;
  --si:#9aa8b4;
  --cool:#6a9a96;
  --au:#c4a35a;
  --block:#8a5a52;
  --serif:"Iowan Old Style","Palatino Linotype",Palatino,"Times New Roman",serif;
  --sans:ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  --mono:ui-monospace,"SF Mono",Menlo,Consolas,monospace;
  --r:10px;
  --ease:cubic-bezier(.22,1,.36,1);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;height:100vh;overflow-y:scroll}
body{
  margin:0;
  min-height:100%;
  background:var(--bg);
  color:var(--ink);
  font:400 17px/1.5 var(--serif);
}
.kicker,.idx,nav a,table,dl,.fine,.k,.chip,.legend,.slice-formula,.subhead{
  font-family:var(--sans);
}
.kicker,.k{
  margin:0 0 8px;
  font:500 11px/1 var(--sans);
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--cu);
}
.top,.layout,footer,.toc,.cockpit-bar{max-width:1320px;margin:0 auto;padding:0 24px}
.top{padding:48px 24px 24px}
h1{
  font:500 42px/1.1 var(--serif);
  letter-spacing:-.02em;
  margin:0 0 16px;
}
.lede{max-width:min(72ch,100%);margin:0;color:var(--mute);font-size:18px;overflow-wrap:anywhere}
.lede strong{color:var(--ink);font-weight:500}
.toc{
  display:flex;flex-wrap:wrap;gap:8px 16px;
  padding:16px 24px 28px;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  margin-bottom:36px;
}
.toc a{
  color:var(--mute);
  text-decoration:none;
  font:500 12.5px/1.3 var(--sans);
  letter-spacing:.04em;
}
.toc a:hover,.toc a:focus-visible{color:var(--ink)}
.layout{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:24px;
  align-items:start;
  padding-bottom:64px;
}
.layout.cockpit{
  grid-template-columns:minmax(280px,420px) minmax(0,1fr);
  max-width:1320px;
  gap:24px 28px;
}
.spine{
  list-style:none;
  margin:0;
  padding:0 0 0 28px;
  border-left:2px solid var(--line);
}
.stratum{
  position:relative;
  margin:0 0 10px;
  padding:18px 18px 16px 20px;
  background:var(--card);
  border:1px solid var(--line);
  border-radius:var(--r);
  cursor:pointer;
  outline:none;
  transition:border-color 200ms var(--ease), background 200ms var(--ease);
}
.stratum::before{
  content:"";
  position:absolute;
  left:-32px;top:28px;
  width:10px;height:10px;
  border-radius:50%;
  background:var(--line);
  box-shadow:0 0 0 4px var(--bg);
}
.stratum.on{
  border-color:color-mix(in srgb,var(--cu) 55%, transparent);
  background:color-mix(in srgb,var(--cu) 8%, var(--card));
}
.stratum.on::before{background:var(--cu)}
.stratum:hover,.stratum:focus-visible{border-color:color-mix(in srgb,var(--si) 50%, var(--line))}
.idx{
  display:block;
  font:500 11px/1 var(--mono);
  letter-spacing:.12em;
  color:var(--mute);
  margin-bottom:6px;
}
.stratum h2,.inspect h3, .block h2{
  font:500 26px/1.15 var(--serif);
  letter-spacing:-.015em;
  margin:0 0 8px;
}
.block h2{font-size:28px}
.stratum p{margin:0;color:var(--mute)}
.stratum.on p{color:var(--ink)}
.k{color:var(--au)}
.inspect{
  background:var(--card);
  border:1px solid var(--line);
  border-radius:var(--r);
  padding:16px 16px 14px;
}
.inspect h3{margin:0 0 10px}
.inspect p{margin:0;color:var(--mute);font-size:15.5px}
.params{margin:16px 0 0;display:grid;grid-template-columns:auto 1fr;gap:6px 14px}
.params dt{margin:0;font:500 11px/1.3 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--cu)}
.params dd{margin:0;font:400 13.5px/1.4 var(--sans);color:var(--ink);overflow-wrap:anywhere}
.tw{overflow:auto;margin:8px 0 16px}
table{width:100%;border-collapse:collapse;font-size:14px}
th,td{text-align:left;padding:8px 10px 8px 0;border-bottom:1px solid var(--line);vertical-align:top}
thead th{color:var(--mute);font-weight:500;letter-spacing:.06em;text-transform:uppercase;font-size:11px}
tbody th{font-weight:500;white-space:nowrap}
.fine{font-size:13.5px;color:var(--mute);max-width:76ch}
.fine a,.footer a{color:var(--si)}
footer{padding:24px 24px 48px;color:var(--mute);font-size:14px;border-top:1px solid var(--line)}
footer p{margin:0 0 8px;max-width:76ch}
.block{margin:48px 0 0;padding-top:28px;border-top:1px solid var(--line)}
.sub{margin:0 0 16px;color:var(--mute);max-width:min(70ch,100%);overflow-wrap:anywhere}
.subhead{font:500 15px/1.3 var(--sans);letter-spacing:.04em;margin:28px 0 8px;color:var(--au)}
.demo{margin:16px 0 12px;background:var(--card);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;outline:none}
.demo:focus-visible{border-color:var(--cu)}
.demo-head{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px;padding:12px 14px 0}
.demo-meta{font:500 12px/1 var(--mono);color:var(--mute);font-variant-numeric:tabular-nums}
.demo svg,.volume svg{display:block;width:100%;height:auto}
.demo svg [data-f]{opacity:.14;transition:opacity 280ms var(--ease)}
.demo svg [data-on="1"]{opacity:1}
.demo-cap{margin:0;padding:12px 14px 4px;color:var(--mute);font-size:15px;min-height:3em}
.demo-ctrl{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:10px 14px 14px}
.demo-ctrl button,.chip{
  font:500 13px/1 var(--sans);color:var(--ink);background:#1c1a16;
  border:1px solid var(--line);border-radius:8px;padding:8px 12px;min-height:36px;cursor:pointer
}
.demo-ctrl button:hover,.demo-ctrl button:focus-visible,
.chip:hover,.chip:focus-visible{border-color:var(--cu)}
.demo-ctrl button[aria-pressed="true"],.chip[aria-pressed="true"]{
  border-color:var(--cu);
  color:var(--ink);
  background:color-mix(in srgb,var(--cu) 12%, var(--card));
}
.demo-ctrl button:disabled{opacity:.4;cursor:not-allowed}
.demo-kbd{margin-left:auto;font:400 12px/36px var(--mono);color:var(--mute)}
.demo-bar{height:3px;background:var(--line);margin:10px 14px 0}
.demo-bar i{display:block;height:3px;width:0;background:var(--cu);transition:width 280ms var(--ease)}
.demo,.stratum,.volume,.chip{scroll-margin-top:72px}

.proj-bar{
  display:flex;flex-wrap:wrap;gap:8px;
  margin:0 0 14px;
}
.chip-off{
  cursor:default;
  color:var(--mute);
  border-style:dashed;
  background:transparent;
  white-space:nowrap;
}
.chip-off:hover,.chip-off:focus-visible{border-color:var(--line)}
.slice-formula{
  margin:0 0 8px;
  font:500 13px/1.45 var(--mono);
  color:var(--au);
  font-variant-numeric:tabular-nums;
  overflow-wrap:anywhere;
}
.proj-note{margin-bottom:12px}
.volume{
  margin:8px 0 16px;
  background:var(--card);
  border:1px solid var(--line);
  border-radius:var(--r);
  overflow:hidden;
}
.volume-scroll{overflow:auto}
#lattice{min-width:0}
.volume-hint{display:none;padding:0 14px 12px}
.cell .mark{color:inherit}
#lattice .board{cursor:pointer}
#lattice .board:focus{outline:none}
#lattice .board:focus .hit,
#lattice .board:hover .hit{stroke:var(--ink);stroke-width:1.4}
.time-bar{margin:8px 0 18px}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.legend{
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  flex-wrap:wrap;
  gap:10px 18px;
  font:500 12px/1.3 var(--sans);
  color:var(--mute);
}
.swatch{
  display:inline-block;
  width:12px;height:12px;
  margin-right:6px;
  vertical-align:-1px;
  border:1px solid var(--line);
  border-radius:2px;
  background:transparent;
}
.swatch.measured{background:color-mix(in srgb,var(--cu) 55%, transparent);border-color:var(--cu)}
.swatch.documented{background:color-mix(in srgb,var(--si) 50%, transparent);border-color:var(--si)}
.swatch.unmeasured{background:transparent;border-color:var(--au);border-style:dashed}
.swatch.posted{background:color-mix(in srgb,var(--au) 28%, transparent);border-color:var(--au)}
.swatch.goal{background:transparent;border-color:var(--cool);border-style:dotted}
.swatch.blocked{
  border-color:var(--block);
  background:repeating-linear-gradient(-45deg, transparent, transparent 3px, color-mix(in srgb,var(--block) 55%, transparent) 3px, color-mix(in srgb,var(--block) 55%, transparent) 4px);
}
.swatch.unknown{background:transparent}

.matrix{
  width:100%;
  border-collapse:separate;
  border-spacing:4px;
  font:500 12px/1.25 var(--sans);
}
.matrix th{
  border:0;
  padding:6px 8px;
  color:var(--mute);
  font-weight:500;
  text-transform:none;
  letter-spacing:0;
  font-size:12px;
  vertical-align:bottom;
}
.matrix th.corner{width:140px}
.matrix td{border:0;padding:0;vertical-align:stretch}
.cell{
  display:block;
  width:100%;
  min-height:52px;
  min-width:56px;
  padding:8px 8px 6px;
  border:1px solid var(--line);
  border-radius:6px;
  background:transparent;
  color:var(--mute);
  text-align:left;
  cursor:pointer;
  font:500 11px/1.25 var(--sans);
}
.cell:hover,.cell:focus-visible{border-color:var(--ink)}
.cell[aria-pressed="true"]{box-shadow:0 0 0 1px var(--au)}
.cell .mark{display:block;font:500 10px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;margin-bottom:4px}
.cell.measured{background:color-mix(in srgb,var(--cu) 28%, var(--card));color:var(--ink);border-color:color-mix(in srgb,var(--cu) 55%, var(--line))}
.cell.documented{background:color-mix(in srgb,var(--si) 22%, var(--card));color:var(--ink);border-color:color-mix(in srgb,var(--si) 50%, var(--line))}
.cell.unmeasured{background:transparent;border-color:var(--au);border-style:dashed;color:var(--au)}
.cell.posted{background:color-mix(in srgb,var(--au) 14%, var(--card));border-color:var(--au);color:var(--ink)}
.cell.goal{background:transparent;border-color:var(--cool);border-style:dotted;color:var(--cool)}
.cell.blocked{
  color:color-mix(in srgb,var(--block) 80%, var(--ink));
  border-color:color-mix(in srgb,var(--block) 50%, var(--line));
  background:repeating-linear-gradient(-45deg, var(--card), var(--card) 7px, color-mix(in srgb,var(--block) 16%, var(--card)) 7px, color-mix(in srgb,var(--block) 16%, var(--card)) 8px);
}
.cell.unknown{color:transparent}
.cell.unknown .mark{color:var(--line)}
.cell.dim{opacity:.38}
.inv-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
  margin:16px 0 20px;
}
.inv-card{
  background:var(--card);
  border:1px solid var(--line);
  border-radius:var(--r);
  padding:14px 14px 12px;
}
.inv-card h3{font:500 16px/1.2 var(--serif);margin:0 0 4px}
.inv-card p{margin:0 0 10px;font-size:13.5px;color:var(--mute)}
.stepper{
  display:flex;align-items:center;gap:8px;
}
.stepper span{
  min-width:2.2em;
  text-align:center;
  font:500 18px/1 var(--mono);
  font-variant-numeric:tabular-nums;
}
.stepper button{
  width:36px;height:36px;padding:0;
  font:500 18px/1 var(--sans);
  color:var(--ink);background:#1c1a16;
  border:1px solid var(--line);border-radius:8px;cursor:pointer;
}
.stepper button:hover,.stepper button:focus-visible{border-color:var(--cu)}
.stepper button:disabled{opacity:.35;cursor:not-allowed}
.reach-row,.intent-row{margin:8px 0 16px}
.reach-row .chips,.intent-row .chips{margin:8px 0}
.mem-row{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.receipt-bar{
  background:var(--card);
  border:1px solid var(--line);
  border-radius:var(--r);
  padding:16px 16px 14px;
  margin:8px 0 12px;
}
.receipt-status{
  margin:0 0 8px;
  font:500 18px/1.3 var(--serif);
}
.receipt-bar .demo-ctrl{padding:8px 0 10px}
.receipt-bar .swatch{margin-right:8px}
.field{
  display:flex;flex-direction:column;gap:4px;
  margin:8px 0 0;
  font:500 11px/1.3 var(--sans);
  letter-spacing:.08em;text-transform:uppercase;color:var(--cu);
}
.field input{
  font:400 14px/1.3 var(--mono);
  text-transform:none;letter-spacing:0;
  color:var(--ink);background:#1c1a16;
  border:1px solid var(--line);border-radius:8px;
  padding:8px 10px;min-height:36px;
}
.field input:focus{outline:none;border-color:var(--cu)}
.field-row{
  display:grid;
  grid-template-columns:2fr 1fr 1fr;
  gap:12px;
  margin:12px 0;
}
.gis svg{background:#0a1218;min-width:0;cursor:crosshair}
.gis .pin{cursor:crosshair}
.mmi{
  width:100%;
  border-collapse:separate;
  border-spacing:4px;
}
.mmi th,.mmi td{border:0;padding:0;vertical-align:stretch}
.mmi th{font:500 11px/1.2 var(--sans);letter-spacing:.06em;text-transform:uppercase;color:var(--mute);padding:6px}
.mmi .cell{min-height:64px;color:var(--ink)}
.mmi .cell.unknown{color:var(--mute)}
.mmi .cell.unknown .mark{color:var(--line)}
@media(max-width:980px){
  .field-row{grid-template-columns:1fr}
}
.comm-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
}
.comm-col{
  background:var(--card);
  border:1px solid var(--line);
  border-radius:var(--r);
  padding:16px 16px 12px;
}
.comm-col h3{
  font:500 14px/1.3 var(--sans);
  letter-spacing:.08em;
  text-transform:uppercase;
  margin:0 0 12px;
}
.comm-col.can h3{color:var(--au)}
.comm-col.cannot h3{color:var(--block)}
.comm-col.unk h3{color:var(--mute)}
.comm-col ul{margin:0;padding:0;list-style:none}
.comm-col li{
  margin:0 0 10px;
  padding:0 0 10px;
  border-bottom:1px solid var(--line);
  font-size:15px;
  color:var(--ink);
}
.comm-col li:last-child{margin:0;padding:0;border:0}
.comm-col li span{
  display:block;
  margin-top:4px;
  font:400 12.5px/1.4 var(--sans);
  color:var(--mute);
}
code{font-family:var(--mono);font-size:.92em}

.cockpit-bar{
  position:sticky;top:0;z-index:20;
  max-width:1320px;margin:0 auto;
  padding:10px 24px 12px;
  background:color-mix(in srgb,var(--bg) 92%, transparent);
  border-bottom:1px solid var(--line);
  display:grid;
  grid-template-columns:1fr;
  gap:8px;
}
.cockpit-bar .slice-formula{margin:0;font-size:12px;color:var(--au)}
.bar-end{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.bar-status{margin:0;font:500 13px/1 var(--sans);color:var(--ink);display:flex;align-items:center;gap:2px}
.config h2{font-size:24px}
.stage{min-width:0}
.fold{
  margin:16px 0;
  border:1px solid var(--line);
  border-radius:var(--r);
  background:var(--card);
  padding:4px 12px 8px;
}
.fold > summary{
  cursor:pointer;
  font:500 14px/36px var(--sans);
  list-style:none;
  color:var(--ink);
}
.fold > summary::-webkit-details-marker{display:none}
.fold > summary::before{content:"+ ";color:var(--cu)}
.fold[open] > summary::before{content:"– "}
.fold .inner{padding:0 0 8px}
.ledger{
  max-width:1320px;margin:24px auto 0;padding:0 24px 48px;
  color:var(--ink);
}
.ledger > summary{
  cursor:pointer;
  font:500 14px/36px var(--sans);
  color:var(--mute);
  border:1px solid var(--line);
  border-radius:8px;
  padding:4px 14px;
  background:var(--card);
}
.ledger .inner{padding-top:8px}
.bar-extra{margin-top:16px}
body:not(.people-on) [data-people-chip]{border-style:dashed}
@media(min-width:981px){
  .config,.stage{
    max-height:calc(100vh - 9.5rem);
    overflow:auto;
    padding-right:4px;
    overscroll-behavior:contain;
  }
}
@media(max-width:980px){
  .layout,.layout.cockpit{grid-template-columns:1fr}
  .stage{order:-1}
  .inspect{position:static}
  .comm-grid{grid-template-columns:1fr}
  .inv-grid{grid-template-columns:1fr}
  h1{font-size:32px}
  .volume-hint{display:block}
  .params{grid-template-columns:1fr}
  .cockpit-bar{padding:8px 16px}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .stratum,.demo svg [data-f],.demo-bar i,.cell{transition:none}
}