/* /blog - a temple in unix.
   Hand-set: two monos, box-drawing chrome, Maya bar-and-dot numerals in
   terminal characters, one ASCII temple. Dark basalt by default; limestone
   when the visitor prefers light. No frameworks, no scripts. */

:root{
  --bg:#0e0f0c;
  --panel:#141610;
  --ink:#d8d4c6;
  --dim:#8b8d80;
  --faint:#5b5d52;
  --gold:#d2a94a;
  --gold-dim:#8a6d2f;
  --jade:#63bd95;
  --err:#d47b6a;
  --line:#282a22;
  --mark:#3a3218;
  --disp:"Space Mono",Menlo,monospace;
  --mono:"JetBrains Mono","Space Mono",Menlo,Consolas,monospace;
  color-scheme:dark;
}
@media (prefers-color-scheme: light){
  :root{
    --bg:#f2efe6; --panel:#e9e5d7;
    --ink:#292820; --dim:#7c7869; --faint:#a9a493;
    --gold:#966f1b; --gold-dim:#c3b183; --jade:#2b6f58; --err:#a4462f;
    --line:#d9d3c2; --mark:#ecdca6;
    color-scheme:light;
  }
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
}

body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:var(--mono);
  font-size:.95rem;
  line-height:1.8;
  -webkit-font-smoothing:antialiased;
}
main,header.site,footer.site{
  width:min(46rem,92%);
  margin-left:auto;margin-right:auto;
}
a{color:var(--jade);text-decoration:underline;text-decoration-color:color-mix(in srgb,var(--jade) 45%,transparent);text-underline-offset:3px}
a:hover{color:var(--gold);text-decoration-color:var(--gold)}
a:focus-visible{outline:1px solid var(--gold);outline-offset:3px}
::selection{background:var(--mark);color:var(--ink)}

/* ---- site chrome ---- */
header.site{padding-top:2.2rem}
.crumbs{color:var(--dim);font-size:.85rem}
.crumbs a{color:var(--dim)}
.crumbs a:hover{color:var(--gold)}
.crumbs .sep{color:var(--faint);padding:0 .35ch}

/* box-drawing + geometric glyphs need full system mono coverage; the
   webfont subsets drop them and misalign the art */
pre.temple{
  font-family:Menlo,Consolas,"DejaVu Sans Mono","Cascadia Mono",monospace;
  color:var(--gold);
  text-align:center;
  line-height:1.06;
  font-size:clamp(.55rem,2.4vw,.85rem);
  margin:2.2rem auto 0;
  overflow-x:hidden;
  user-select:none;
}
pre.temple .base{color:var(--gold-dim)}

.tagline{
  font-family:var(--disp);
  text-align:center;
  color:var(--gold);
  font-style:italic;
  font-size:1.05rem;
  margin:1.6rem 0 0;
}

.prompt{
  font-family:var(--disp);
  margin:2.4rem 0 0;
  font-size:1rem;
}
.prompt .ps1{color:var(--dim)}
.prompt .cmd{color:var(--ink);font-weight:700}
.cursor{
  display:inline-block;width:.6ch;height:1.05em;
  background:var(--gold);vertical-align:text-bottom;margin-left:.2ch;
  animation:blink 1.2s steps(1) infinite;
}
@keyframes blink{50%{opacity:0}}

/* ---- index tree ---- */
.tree{margin:1.2rem 0 3rem;font-size:.95rem;font-family:Menlo,Consolas,"DejaVu Sans Mono","Cascadia Mono",monospace}
.tree .row{display:block;white-space:pre-wrap}
.tree .branch{color:var(--faint)}
.tree .date{color:var(--dim)}
.tree .desc{color:var(--dim)}
.tree .lnk{color:var(--jade)}
.tree a{text-decoration:none;border-bottom:1px solid color-mix(in srgb,var(--jade) 40%,transparent)}
.tree a:hover{color:var(--gold);border-bottom-color:var(--gold)}

/* ---- article ---- */
.art-head{margin:2.6rem 0 2.8rem;border-bottom:1px solid var(--line);padding-bottom:2rem}
.art-date{color:var(--dim);font-size:.82rem}
.art-title{
  font-family:var(--disp);font-weight:700;
  font-size:clamp(1.5rem,4.6vw,2.2rem);
  line-height:1.25;margin:.6rem 0 1rem;color:var(--ink);
  letter-spacing:-.01em;
}
.art-standfirst{color:var(--dim);font-style:italic;margin:0 0 1rem;max-width:60ch}
.art-byline{color:var(--gold);font-size:.85rem}
.art-reviewing{color:var(--dim);font-size:.85rem;margin-top:.8rem}

.essay p{margin:0 0 1.25em;max-width:70ch}
.essay em{font-style:italic}
.kaq{font-style:italic}

/* section head: maya numeral + slug + rule to the margin */
.sect{display:flex;align-items:center;gap:1.1rem;margin:3.2rem 0 1.4rem}
.sect h2{
  font-family:var(--disp);font-weight:700;font-size:1rem;
  letter-spacing:.04em;margin:0;color:var(--ink);white-space:nowrap;
}
.sect h2::before{content:"";}
.sect .rule{flex:1;border-top:1px solid var(--line);min-width:2rem}
pre.mnum{
  margin:0;font-family:Menlo,Consolas,"DejaVu Sans Mono","Cascadia Mono",monospace;
  color:var(--gold);
  font-size:.72rem;line-height:1.25;text-align:center;user-select:none;
}

.pull{
  margin:2.2rem 0;padding:.2rem 0 .2rem 1.4rem;
  border-left:3px double var(--gold);
}
.pull p{font-style:italic;color:var(--ink);margin:0;max-width:56ch}

/* ---- errata log ---- */
.errata{margin-top:1rem}
.errata-class{
  font-family:var(--disp);font-weight:700;font-size:.9rem;
  color:var(--gold);margin:2.4rem 0 1rem;
}
.errata-class::before{content:"── ";color:var(--faint);font-weight:400}
.errata-class::after{content:" ──";color:var(--faint);font-weight:400}
.errata-item{
  background:var(--panel);
  border-left:2px solid var(--gold-dim);
  padding:.8rem 1.1rem;margin:0 0 .8rem;
  font-size:.88rem;line-height:1.7;
}
.errata-item .path{color:var(--jade);word-break:break-all}
.errata-item .tag{color:var(--err);font-weight:700}
.errata-item .tag.warn{color:var(--gold)}
.errata-item p{margin:.3rem 0 0;max-width:68ch}
.errata-item code,.essay code{
  font-family:var(--mono);font-size:.92em;color:var(--dim);
}
.note{color:var(--dim);font-size:.85rem;font-style:italic;max-width:68ch}

/* ---- footer ---- */
footer.site{
  margin-top:4rem;padding:1.6rem 0 2.6rem;
  border-top:1px solid var(--line);
  color:var(--faint);font-size:.82rem;line-height:1.9;
}
footer.site .cm::before{content:"# ";color:var(--faint)}
footer.site a{color:var(--dim)}
footer.site a:hover{color:var(--gold)}

@media (max-width:600px){
  body{font-size:.9rem}
  .sect{gap:.8rem}
  .sect h2{white-space:normal}
}
