:root{
  --ink:#1c1a17; --ink-2:#4a443c; --ink-3:#6f675c;
  --paper:#faf7f1; --paper-2:#f2ece1; --card:#ffffff;
  --line:#e0d7c7; --line-2:#cdc0a9;
  --olive:#5c6b3f; --olive-2:#7c8a58; --olive-soft:#eef1e4;
  --terra:#a6522f; --terra-soft:#f8eae1;
  --gold:#9a7b26; --gold-soft:#f7f0db;
  --blue:#355b73; --blue-soft:#e6eef3;
  --red:#8c2f2f; --red-soft:#f8e7e5;
  --radius:10px;
  --mono:ui-monospace,"SF Mono",Menlo,Consolas,monospace;
  --serif:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;
  --sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --ink:#ece7dd; --ink-2:#c3bbac; --ink-3:#978e7f;
    --paper:#15150f; --paper-2:#1d1d16; --card:#1f1f18;
    --line:#35342a; --line-2:#4a4838;
    --olive:#a8bb7e; --olive-2:#8d9d68; --olive-soft:#242a1a;
    --terra:#d68b5f; --terra-soft:#2d1e15;
    --gold:#d4b45c; --gold-soft:#2a2414;
    --blue:#8db4cc; --blue-soft:#17242c;
    --red:#d98a84; --red-soft:#2e1817;
  }
}
:root[data-theme="dark"]{
  --ink:#ece7dd; --ink-2:#c3bbac; --ink-3:#978e7f;
  --paper:#15150f; --paper-2:#1d1d16; --card:#1f1f18;
  --line:#35342a; --line-2:#4a4838;
  --olive:#a8bb7e; --olive-2:#8d9d68; --olive-soft:#242a1a;
  --terra:#d68b5f; --terra-soft:#2d1e15;
  --gold:#d4b45c; --gold-soft:#2a2414;
  --blue:#8db4cc; --blue-soft:#17242c;
  --red:#d98a84; --red-soft:#2e1817;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--paper); color:var(--ink);
  font-family:var(--sans); font-size:16px; line-height:1.62;
}
.wrap{max-width:1040px; margin:0 auto; padding:0 16px 96px}

/* ---------- masthead ---------- */
.mast{border-bottom:1px solid var(--line); background:var(--paper-2); margin-bottom:34px}
.mast .wrap{padding-top:34px; padding-bottom:30px}
.eyebrow{
  font-family:var(--mono); font-size:11px; letter-spacing:.14em; text-transform:uppercase;
  color:var(--terra); margin:0 0 10px
}
h1{
  font-family:var(--serif); font-weight:600; font-size:clamp(1.7rem,4.4vw,2.5rem);
  line-height:1.18; margin:0 0 12px; letter-spacing:-.01em
}
.sub{color:var(--ink-2); font-size:1.02rem; margin:0; max-width:68ch}
.metaline{
  margin-top:18px; padding-top:14px; border-top:1px solid var(--line);
  font-family:var(--mono); font-size:11.5px; color:var(--ink-3);
  display:flex; flex-wrap:wrap; gap:6px 20px
}
.langswitch{float:right; font-family:var(--mono); font-size:11.5px}
.langswitch a{color:var(--olive); text-decoration:none; border-bottom:1px solid var(--line-2)}

/* ---------- typography ---------- */
h2{
  font-family:var(--serif); font-size:1.42rem; font-weight:600; letter-spacing:-.005em;
  margin:52px 0 6px; padding-bottom:9px; border-bottom:2px solid var(--olive)
}
h2 .num{font-family:var(--mono); font-size:.68em; color:var(--olive); margin-right:10px; font-weight:400}
h3{font-size:1.04rem; font-weight:650; margin:30px 0 8px; color:var(--ink)}
h4{font-size:.9rem; font-weight:650; margin:20px 0 6px; color:var(--ink-2);
   font-family:var(--mono); letter-spacing:.04em; text-transform:uppercase}
p{margin:0 0 13px; max-width:78ch}
ul,ol{margin:0 0 14px; padding-left:21px; max-width:78ch}
li{margin-bottom:6px}
strong{font-weight:650}
a{color:var(--olive)}
.lede{font-size:1.07rem; color:var(--ink-2)}

/* ---------- callouts ---------- */
.note{
  border-left:3px solid var(--line-2); background:var(--paper-2);
  padding:14px 18px; margin:20px 0; border-radius:0 var(--radius) var(--radius) 0;
}
.note.warn{border-left-color:var(--terra); background:var(--terra-soft)}
.note.key{border-left-color:var(--gold); background:var(--gold-soft)}
.note.roots{border-left-color:var(--olive); background:var(--olive-soft)}
.note p:last-child{margin-bottom:0}
.note .lbl{
  font-family:var(--mono); font-size:10.5px; letter-spacing:.12em; text-transform:uppercase;
  color:var(--ink-3); display:block; margin-bottom:6px
}

/* ---------- tables ---------- */
.tblwrap{overflow-x:auto; margin:18px 0 24px; border:1px solid var(--line); border-radius:var(--radius)}
table{border-collapse:collapse; width:100%; font-size:14px; min-width:640px; background:var(--card)}
th,td{padding:9px 12px; text-align:left; vertical-align:top; border-bottom:1px solid var(--line)}
th{
  background:var(--paper-2); font-family:var(--mono); font-size:10.5px; letter-spacing:.07em;
  text-transform:uppercase; color:var(--ink-2); font-weight:600; white-space:nowrap
}
tbody tr:last-child td{border-bottom:none}
td.nm{font-weight:650; white-space:nowrap}

/* ---------- pills ---------- */
.pill{
  display:inline-block; font-family:var(--mono); font-size:10px; letter-spacing:.05em;
  padding:2px 7px; border-radius:20px; white-space:nowrap; line-height:1.6;
  border:1px solid transparent
}
.p-meat{background:var(--red-soft); color:var(--red); border-color:var(--red)}
.p-dairy{background:var(--blue-soft); color:var(--blue); border-color:var(--blue)}
.p-meze{background:var(--olive-soft); color:var(--olive); border-color:var(--olive)}
.p-bake{background:var(--gold-soft); color:var(--gold); border-color:var(--gold)}
.p-retail{background:var(--terra-soft); color:var(--terra); border-color:var(--terra)}
.p-corp{background:var(--paper-2); color:var(--ink-2); border-color:var(--line-2)}
.rd{font-family:var(--mono); font-size:10.5px; font-weight:600; white-space:nowrap}
.rd-a{color:var(--olive)} .rd-b{color:var(--gold)} .rd-c{color:var(--terra)}

/* ---------- person cards ---------- */
.people{display:grid; gap:16px; margin:22px 0 10px}
@media(min-width:760px){ .people{grid-template-columns:1fr 1fr} }
.card{
  background:var(--card); border:1px solid var(--line); border-radius:var(--radius);
  padding:17px 19px 15px; display:flex; flex-direction:column
}
.card.wide{grid-column:1/-1}
.card .cname{font-family:var(--serif); font-size:1.14rem; font-weight:600; margin:0 0 2px; line-height:1.3}
.card .crole{font-family:var(--mono); font-size:10.5px; letter-spacing:.05em; text-transform:uppercase; color:var(--terra); margin:0 0 10px}
.card .ctags{margin:0 0 11px; display:flex; flex-wrap:wrap; gap:5px}
.card p{font-size:14.2px; margin:0 0 10px; max-width:none}
.card .fact{
  font-family:var(--mono); font-size:11px; color:var(--ink-3); line-height:1.75;
  border-top:1px solid var(--line); padding-top:9px; margin-top:auto
}
.card .fact b{color:var(--ink-2); font-weight:600}
.flag{
  display:block; font-size:12.6px; background:var(--terra-soft); color:var(--terra);
  border-radius:6px; padding:7px 10px; margin:0 0 10px; line-height:1.5
}
.flag::before{content:"⚑ "; font-weight:700}

/* ---------- phases ---------- */
.phase{
  border:1px solid var(--line); border-left:4px solid var(--olive); border-radius:0 var(--radius) var(--radius) 0;
  padding:14px 18px; margin:0 0 14px; background:var(--card)
}
.phase h3{margin:0 0 3px; font-family:var(--serif); font-size:1.1rem; font-weight:600}
.phase .when{font-family:var(--mono); font-size:10.5px; letter-spacing:.07em; text-transform:uppercase; color:var(--ink-3); margin:0 0 9px}
.phase ul{margin-bottom:0; font-size:14.2px}

/* ---------- gateway (index) ---------- */
.gate{display:grid; gap:18px; margin:32px 0}
@media(min-width:720px){ .gate{grid-template-columns:1fr 1fr} }
.gatecard{
  display:block; text-decoration:none; color:inherit; background:var(--card);
  border:1px solid var(--line); border-radius:var(--radius); padding:26px 24px;
  transition:border-color .15s, transform .15s
}
.gatecard:hover{border-color:var(--olive); transform:translateY(-2px)}
.gatecard .lang{font-family:var(--mono); font-size:11px; letter-spacing:.16em; color:var(--terra); text-transform:uppercase}
.gatecard .t{font-family:var(--serif); font-size:1.28rem; font-weight:600; margin:9px 0 7px; line-height:1.3}
.gatecard .d{font-size:14px; color:var(--ink-2); margin:0}
.gatecard .go{font-family:var(--mono); font-size:11.5px; color:var(--olive); margin-top:13px; display:block}

.filetree{
  font-family:var(--mono); font-size:12.5px; line-height:1.95; background:var(--paper-2);
  border:1px solid var(--line); border-radius:var(--radius); padding:16px 18px; overflow-x:auto;
  color:var(--ink-2)
}
.filetree b{color:var(--ink); font-weight:600}

/* ---------- footer ---------- */
footer{
  margin-top:60px; padding-top:20px; border-top:1px solid var(--line);
  font-size:11.5px; line-height:1.75; color:var(--ink-3); max-width:none
}
footer p{font-size:11.5px; max-width:none; margin-bottom:9px}
footer .brand{font-family:var(--mono); letter-spacing:.08em; text-transform:uppercase; color:var(--ink-2)}

/* ---------- print ---------- */
@media print{
  :root{--paper:#fff;--paper-2:#fff;--card:#fff}
  body{font-size:10.5pt}
  .wrap{max-width:none;padding:0}
  .mast{border:none;margin-bottom:18px}
  .langswitch{display:none}
  h2{page-break-after:avoid} .card,.phase,.note{page-break-inside:avoid}
  .people{grid-template-columns:1fr 1fr}
}