/* Residue Paths — 4point54 page layer */

a{color:var(--accent);text-decoration:none;border-bottom:1px solid transparent}
a:hover{border-bottom-color:var(--accent)}
a:focus-visible{outline:1px solid var(--accent);outline-offset:3px}

.topbar{
  position:sticky;top:0;z-index:20;
  background:rgba(9,11,14,.9);backdrop-filter:blur(12px);
  border-bottom:1px solid var(--rule);
}
.topbar .wrap{
  display:flex;align-items:center;justify-content:space-between;
  gap:16px;padding-top:14px;padding-bottom:14px;
}
.brand{
  font-family:var(--mono);font-size:11px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--ink2);border:0;
}
.brand b{color:var(--ink);font-weight:500}
.nav{display:flex;flex-wrap:wrap;gap:8px 16px}
.nav a{
  font-family:var(--mono);font-size:10px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--ink3);border:0;
}
.nav a:hover{color:var(--ink)}

/* Hero */
.hero{
  position:relative;min-height:92vh;display:flex;align-items:center;
  padding:88px 0 72px;border-bottom:1px solid var(--rule);overflow:hidden;
}
.hero-geo{position:absolute;inset:0;z-index:0;pointer-events:none}
.hero-geo svg{display:block;width:100%;height:100%}
.hero-fore{position:relative;z-index:1}
.lede{
  font-family:var(--sans);font-weight:300;font-size:1.05rem;
  line-height:1.65;color:var(--ink2);max-width:60ch;margin-top:22px;
}
.lede strong{color:var(--ink);font-weight:500}

.plane-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:28px}
.plane{
  font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;
  padding:6px 10px;border:1px solid var(--rule2);color:var(--ink3);border-radius:2px;
}
.plane i{
  display:inline-block;width:7px;height:7px;border-radius:50%;
  margin-right:7px;vertical-align:middle;
}
.plane .c{background:var(--content)}
.plane .m{background:var(--accent)}
.plane .s{background:var(--synth)}
.plane .f{background:var(--ink3)}

/* Prose helpers */
.narrow-prose{max-width:66ch;color:var(--ink2);font-size:1rem;line-height:1.7;margin-top:18px}
.narrow-prose + .narrow-prose{margin-top:14px}
.narrow-prose strong{color:var(--ink);font-weight:500}
.mono-inline{
  font-family:var(--mono);font-size:.86em;color:var(--accent);
  letter-spacing:.02em;
}

/* Equation / formal block */
.eq{
  margin-top:28px;border:1px solid var(--rule);background:var(--panel);
  border-radius:2px;overflow:hidden;
}
.eq-h{
  display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;
  padding:12px 16px;border-bottom:1px solid var(--rule);background:var(--panel2);
  font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink3);
}
.eq-b{padding:22px 20px 20px}
.eq-math{
  margin:0 0 14px;padding:14px 8px;
  overflow-x:auto;
  border:1px solid var(--rule);
  background:var(--bg2);
  border-radius:2px;
  text-align:center;
}
.eq-math:last-of-type{margin-bottom:0}
.eq-math .katex{font-size:1.12em;color:var(--ink)}
.eq-math .katex-display{margin:0.4em 0}
.eq-note{margin-top:14px;font-size:.9rem;color:var(--ink2);max-width:62ch;line-height:1.55}
/* Inline math in prose */
.narrow-prose .katex,
.claim .katex,
.eq-note .katex{font-size:1.02em}
body .katex{color:inherit}
body .katex .mord, body .katex .mrel, body .katex .mbin{color:var(--ink)}
.narrow-prose .katex .mord,
.eq-note .katex .mord{color:var(--ink2)}
.eq-math .katex .mord,
.eq-math .katex .mrel,
.eq-math .katex .mbin,
.eq-math .katex .mop{color:var(--ink)}

/* Definition list / lenses */
.lens-grid{display:grid;gap:1px;background:var(--rule);border:1px solid var(--rule);margin-top:28px}
@media(min-width:800px){.lens-grid{grid-template-columns:1fr 1fr 1fr}}
.lens{
  background:var(--panel);padding:20px 18px;
}
.lens .k{
  font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--accent);margin-bottom:10px;
}
.lens h3{
  font-family:var(--serif);font-weight:400;font-size:1.25rem;line-height:1.2;
  margin:0 0 10px;max-width:18ch;
}
.lens p{margin:0;color:var(--ink2);font-size:.92rem;line-height:1.5}
.lens .ex{
  margin-top:12px;font-family:var(--mono);font-size:10px;letter-spacing:.04em;
  color:var(--ink3);line-height:1.5;border-top:1px solid var(--rule);padding-top:10px;
}

/* Rule / theorem grids */
.rule-grid{display:grid;gap:1px;background:var(--rule);border:1px solid var(--rule);margin-top:28px}
@media(min-width:760px){.rule-grid{grid-template-columns:1fr 1fr}}
.rule-cell{background:var(--panel);padding:20px 18px}
.rule-cell .n{
  font-family:var(--mono);font-size:10px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--accent);margin-bottom:8px;
}
.rule-cell h3{
  font-family:var(--serif);font-weight:400;font-size:1.25rem;
  line-height:1.2;margin-bottom:8px;max-width:24ch;
}
.rule-cell p{font-size:.95rem;color:var(--ink2);max-width:48ch;margin:0}

/* Chamber */
.chamber-stage{display:grid;gap:18px}
@media(min-width:800px){.chamber-stage{grid-template-columns:1.15fr .85fr}}
.plane-box{
  border:1px solid var(--rule);background:var(--bg2);
  border-radius:2px;padding:16px;min-height:168px;
}
.plane-box .pl{
  font-family:var(--mono);font-size:10px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--ink3);margin-bottom:14px;
}
.tokens{display:flex;flex-wrap:wrap;gap:6px}
.tok{
  font-family:var(--mono);font-size:11px;letter-spacing:.04em;
  color:var(--content);border:1px solid var(--rule2);
  padding:5px 8px;border-radius:2px;
  transition:opacity .55s ease,transform .55s ease;
}
.chamber.is-purging .tok,.chamber.is-done .tok{opacity:0;transform:translateY(-8px)}
.stream-line{margin-top:16px;height:1px;background:var(--rule2);position:relative}
.stream-line::after{
  content:"";position:absolute;left:0;top:-2px;width:8px;height:5px;
  border-radius:50%;background:var(--accent);transition:opacity .4s;
}
.chamber.is-purging .stream-line::after,.chamber.is-done .stream-line::after{opacity:.25}
.mlist{display:flex;flex-direction:column;gap:7px}
.mrow{
  display:flex;justify-content:space-between;gap:10px;
  font-family:var(--mono);font-size:11px;letter-spacing:.04em;
  color:var(--ink3);border:1px solid var(--rule);padding:8px 10px;border-radius:2px;
  opacity:.4;transform:translateY(4px);
  transition:opacity .5s ease,transform .5s ease,color .3s,border-color .3s;
}
.mrow b{color:var(--ink3);font-weight:500}
.chamber.is-purging .mrow,.chamber.is-done .mrow{
  opacity:1;transform:none;color:var(--ink2);border-color:var(--rule2);
}
.chamber.is-done .mrow b{color:var(--accent)}
.controls{display:flex;flex-wrap:wrap;align-items:center;gap:14px;margin-top:18px}
button.act{
  font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--accent);background:transparent;border:1px solid var(--rule2);
  padding:10px 14px;border-radius:2px;cursor:pointer;
}
button.act:hover{border-color:var(--accent);background:var(--accentwash)}
button.act:focus-visible{outline:1px solid var(--accent);outline-offset:3px}
button.act:disabled{opacity:.45;cursor:not-allowed}
button.ghost{color:var(--ink3);border-color:var(--rule)}
button.ghost:hover{color:var(--ink);border-color:var(--rule2);background:transparent}
.status{
  font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink3);
}
.status.on{color:var(--accent)}

/* Example flow */
.flow-steps{
  display:grid;gap:1px;background:var(--rule);border:1px solid var(--rule);margin-top:22px;
}
@media(min-width:800px){.flow-steps{grid-template-columns:repeat(4,1fr)}}
.flow-step{background:var(--panel);padding:16px 14px}
.flow-step .n{
  font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--accent);margin-bottom:8px;
}
.flow-step h3{
  font-family:var(--serif);font-weight:400;font-size:1.15rem;line-height:1.2;margin:0 0 8px;
}
.flow-step p{margin:0;color:var(--ink2);font-size:.9rem;line-height:1.45}

/* Match article .wrap width (full column, stacked) */
.ex-layout{
  display:flex;flex-direction:column;gap:32px;margin-top:28px;
  width:100%;
  max-width:none;
}
.ex-prompt-wrap,.ex-residue-wrap{width:100%;max-width:none}
.ex-prompt{border:1px solid var(--rule);background:var(--panel);border-radius:2px;width:100%;max-width:none}
.ex-prompt .ph{
  padding:12px 14px;border-bottom:1px solid var(--rule);background:var(--panel2);
  display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;
}
.ex-prompt .ph span{
  font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink3);
}
.ex-prompt .ph b{color:var(--accent);font-weight:500}
.ex-prompt .pb{padding:16px}
.ex-prompt .label{
  font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink3);margin:14px 0 8px;
}
.ex-prompt .label:first-child{margin-top:0}
.ex-prompt pre,.ex-prompt .blob{
  font-family:var(--mono);font-size:11.5px;line-height:1.55;color:var(--content);
  white-space:pre-wrap;word-break:break-word;margin:0;
  border:1px solid var(--rule);padding:12px;border-radius:2px;background:var(--bg2);
}
.ex-prompt .blob.answer{color:var(--ink2)}
.ex-prompt .blob.cot{color:var(--ink3)}
.ex-prompt .dies{
  margin-top:14px;padding-top:12px;border-top:1px solid var(--rule);
  font-family:var(--mono);font-size:10px;letter-spacing:.06em;line-height:1.55;color:var(--ink3);
}
.ex-prompt .dies b{color:var(--ink2);font-weight:500}

.ex-tabs{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:16px}
.ex-tab{
  font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;
  padding:7px 10px;border:1px solid var(--rule2);background:transparent;color:var(--ink3);
  border-radius:2px;cursor:pointer;
}
.ex-tab:hover{color:var(--ink);border-color:var(--ink3)}
.ex-tab[aria-selected="true"]{
  color:var(--accent);border-color:var(--accent-lo);background:var(--accentwash);
}
.ex-tab:focus-visible{outline:1px solid var(--accent);outline-offset:3px}

.residue{border:1px solid var(--rule);background:var(--panel);border-radius:2px;display:none}
.residue.on{display:block}
.residue .rh{
  padding:14px 16px;border-bottom:1px solid var(--rule);background:var(--panel2);
  display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;align-items:baseline;
}
.residue .rh h3{font-family:var(--serif);font-weight:400;font-size:1.35rem;line-height:1.15;margin:0}
.residue .rh .tid{
  font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);
}
.residue .rb{padding:18px 16px 20px}
.residue .claim-mini{
  font-family:var(--serif);font-style:italic;font-size:1.05rem;line-height:1.45;
  color:var(--ink2);max-width:54ch;margin:0 0 18px;
}
.res-grid{display:grid;gap:1px;background:var(--rule);border:1px solid var(--rule)}
@media(min-width:700px){.res-grid{grid-template-columns:1fr 1fr}}
.res-cell{background:var(--bg2);padding:14px 14px 16px}
.res-cell h4{
  font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink3);margin:0 0 10px;
}
.res-cell.dies h4{color:var(--ink2)}
.res-cell.left h4{color:var(--accent)}
.res-cell.risk h4{color:var(--synth)}
.res-cell ul{margin:0;padding-left:1.05rem;color:var(--ink2);font-size:.9rem}
.res-cell li{margin-bottom:6px}
.res-cell p{margin:0;color:var(--ink2);font-size:.92rem;line-height:1.5}
.chip-row{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}
.rchip{
  font-family:var(--mono);font-size:10px;letter-spacing:.04em;
  border:1px solid var(--rule2);padding:5px 8px;border-radius:2px;color:var(--accent);
  background:var(--panel);
}

.ex-all{margin-top:28px;border:1px solid var(--rule);border-radius:2px;overflow:hidden}
.ex-all .ah{
  padding:12px 16px;background:var(--panel2);border-bottom:1px solid var(--rule);
  font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink3);
}
.ex-table,.tbl{width:100%;border-collapse:collapse;font-size:.88rem}
.ex-table th,.ex-table td,.tbl th,.tbl td{
  text-align:left;padding:12px 14px;border-bottom:1px solid var(--rule);vertical-align:top;
}
.ex-table th,.tbl th{
  font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--ink3);font-weight:400;background:var(--panel);
}
.ex-table td:first-child,.tbl td:first-child{
  font-family:var(--mono);color:var(--accent);white-space:nowrap;
}
.ex-table tr:last-child td,.tbl tr:last-child td{border-bottom:0}
.ex-table .name{font-family:var(--serif);font-style:italic;color:var(--ink);display:block;margin-bottom:4px}
.ex-table .res{font-family:var(--mono);font-size:11px;color:var(--accent);line-height:1.5}
.ex-table .note{color:var(--ink3);font-size:.85rem;margin-top:4px;line-height:1.45}
.tbl-wrap{margin-top:28px;border:1px solid var(--rule);border-radius:2px;overflow-x:auto}

/* Path cards */
.adv-list{display:grid;gap:1px;background:var(--rule);border:1px solid var(--rule);margin-top:28px}
@media(min-width:800px){.adv-list{grid-template-columns:1fr 1fr}}
.adv-cell{background:var(--panel);padding:20px 18px}
.adv-cell .id{
  font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink3);margin-bottom:8px;
}
.adv-cell h3{font-family:var(--serif);font-weight:400;font-size:1.35rem;line-height:1.15;margin:0 0 10px}
.adv-cell p{color:var(--ink2);font-size:.95rem;max-width:48ch;margin:0 0 10px}
.adv-cell .meta{
  font-family:var(--mono);font-size:10px;letter-spacing:.06em;color:var(--ink3);line-height:1.55;
}
.adv-cell .meta b{color:var(--accent);font-weight:500}

/* Theorems */
.th-list{margin-top:28px;border-top:1px solid var(--rule)}
.th-row{
  display:grid;gap:8px 24px;padding:16px 0;border-bottom:1px solid var(--rule);
}
@media(min-width:720px){.th-row{grid-template-columns:minmax(160px,240px) 1fr}}
.th-row strong{font-family:var(--serif);font-weight:400;font-size:1.15rem;line-height:1.25}
.th-row span{color:var(--ink2);font-size:.95rem;max-width:58ch}

/* Refs */
.refs{margin-top:22px;columns:1;gap:28px}
@media(min-width:800px){.refs{columns:2}}
.refs li{
  break-inside:avoid;margin-bottom:10px;font-size:.88rem;color:var(--ink2);
  list-style:none;padding-left:0;line-height:1.45;
}
.refs .r-id{font-family:var(--mono);font-size:10px;color:var(--accent);letter-spacing:.06em}
.refs .r-t{color:var(--ink)}

/* Footer */
.foot{padding:64px 0 80px;border-top:1px solid var(--rule);color:var(--ink3);font-size:.9rem}
.foot p{max-width:62ch;margin-bottom:10px;line-height:1.6}
.foot .links{
  margin-top:18px;display:flex;flex-wrap:wrap;gap:10px 18px;
  font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;
}
.foot .links a{color:var(--ink2);border:0}
.foot .links a:hover{color:var(--accent)}

/* Tag variants */
.tag.mech{color:var(--accent);border-color:var(--accent-lo)}
.tag.spec{color:var(--synth);border-color:rgba(184,154,90,.35)}
.tag.lit{color:var(--ink2);border-color:var(--rule2)}

@media(max-width:760px){
  .hero{min-height:auto;padding:48px 0 32px}
  .hero-geo{opacity:.5}
  .section{padding:64px 0}
}
@media(prefers-reduced-motion:reduce){
  .hero-geo{opacity:.7}
}