/* ============================================================
   pabloio — the definitive site. control room / reputation machine.
   nirnor-inspired: eloquently expressed silence, but alive.
   paper + ink + hairlines, lime as a mark only.
   ============================================================ */

/* ---------- fonts (self-hosted, latin subsets, variable) ---------- */
@font-face{ font-family:"Ibarra Real Nova"; src:url("/assets/fonts/ibarra.woff2") format("woff2"); font-weight:400 700; font-style:normal; font-display:swap; }
@font-face{ font-family:"Ibarra Real Nova"; src:url("/assets/fonts/ibarra-italic.woff2") format("woff2"); font-weight:400 700; font-style:italic; font-display:swap; }
@font-face{ font-family:"Inter"; src:url("/assets/fonts/inter.woff2") format("woff2"); font-weight:400 700; font-style:normal; font-display:swap; }
@font-face{ font-family:"JetBrains Mono"; src:url("/assets/fonts/jbmono.woff2") format("woff2"); font-weight:400 700; font-style:normal; font-display:swap; }

/* ---------- tokens ---------- */
:root{
  --paper:      #eceae4;
  --paper-high: #f3f2ee;
  --ink:        #1a1a1a;
  --ink-soft:   #3c3c3c;
  --muted:      #7e7e7e;
  --faint:      #a39f96;
  --hairline:   #d5d2c9;
  --lime:       #d0ff00;
  --night:      #141412;
  --night-text:     #e7e4dc;
  --night-hairline: rgba(236,234,228,.15);
  --night-faint:    rgba(236,234,228,.42);
  --night-ghost:    rgba(236,234,228,.05);

  --serif: "Ibarra Real Nova", "Iowan Old Style", Georgia, serif;
  --sans:  "Inter", -apple-system, "Helvetica Neue", Arial, sans-serif;
  --mono:  "JetBrains Mono", "SFMono-Regular", Menlo, monospace;
  --mono-size: 11px;
  --mono-track: .14em;

  --ease:    cubic-bezier(.16, 1, .3, 1);
  --ease-io: cubic-bezier(.65, 0, .35, 1);

  --maxw: 1180px;
  --wprose: 720px;
  --pad: clamp(20px, 5vw, 72px);
  --gap-section: clamp(88px, 13vh, 168px);
}

*, *::before, *::after{ box-sizing:border-box; margin:0; padding:0; }
html{ background:var(--paper); -webkit-text-size-adjust:100%; }
body{
  background:var(--paper); color:var(--ink);
  font:400 16px/1.7 var(--sans);
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
a{ color:inherit; text-decoration:none; }
::selection{ background:var(--lime); color:var(--ink); }
:focus-visible{ outline:2px solid var(--ink); outline-offset:4px; }
body > footer :focus-visible{ outline-color:var(--paper); }
img,svg{ max-width:100%; display:block; }
hr{ border:0; border-top:1px solid var(--hairline); }

.wrap{ width:100%; max-width:var(--maxw); margin:0 auto; padding-left:var(--pad); padding-right:var(--pad); }
.wrap-prose{ width:100%; max-width:var(--wprose); margin:0 auto; padding-left:var(--pad); padding-right:var(--pad); }

/* machine voice ---------------------------------------------------------- */
.mono{ font:500 var(--mono-size)/1.6 var(--mono); letter-spacing:var(--mono-track); text-transform:lowercase; color:var(--faint); }
.tag{ display:inline-block; }
.tag::before{ content:"[ "; }
.tag::after{ content:" ]"; }

/* section scaffolding ---------------------------------------------------- */
main > section, main > .about-prose, main > article{ }
section{ padding-top:var(--gap-section); }
.sec-head{
  display:flex; align-items:baseline; gap:16px;
  padding-bottom:clamp(28px,4vh,52px);
  border-bottom:1px solid var(--hairline);
  margin-bottom:clamp(28px,4vh,52px);
  flex-wrap:wrap;
}
.sec-head .idx{ margin-left:auto; }
.sec-title{ font:500 clamp(26px,4.4vw,44px)/1.02 var(--serif); letter-spacing:-.015em; min-width:0; }
.view-all{ color:var(--muted); transition:color .3s var(--ease); }
.view-all:hover{ color:var(--ink); }

/* ---------- header ---------- */
header.bar{
  position:sticky; top:0; z-index:50;
  background:rgba(236,234,228,.82);
  backdrop-filter:saturate(120%) blur(9px);
  -webkit-backdrop-filter:saturate(120%) blur(9px);
  border-bottom:1px solid transparent;
  transition:border-color .4s var(--ease), background .4s var(--ease);
}
header.bar.scrolled{ border-bottom-color:var(--hairline); }
.bar-in{ display:flex; align-items:center; gap:24px; height:62px; }
.wordmark{ display:inline-flex; align-items:baseline; gap:2px; }
.wordmark .p{ font:500 italic 23px/1 var(--serif); letter-spacing:-.01em; }
.wordmark .io{
  font:500 10px/1 var(--mono); letter-spacing:.12em;
  background:var(--lime); color:var(--ink);
  padding:3px 5px 2px; transform:translateY(-2px);
}
.bar nav{ margin-left:auto; display:flex; gap:clamp(14px,2.4vw,30px); align-items:center; }
.bar nav a{
  font:500 var(--mono-size)/1 var(--mono); letter-spacing:.1em; text-transform:lowercase;
  color:var(--muted); position:relative; padding:6px 0;
}
.bar nav a::after{ content:""; position:absolute; left:0; right:100%; bottom:2px; height:1px; background:var(--ink); transition:right .45s var(--ease); }
.bar nav a:hover{ color:var(--ink); }
.bar nav a:hover::after{ right:0; }
.bar nav a[aria-current="page"]{ color:var(--ink); }
.bar nav a.n-hide{ display:none; }
@media(min-width:640px){ .bar nav a.n-hide{ display:inline; } }

/* ---------- hero ---------- */
.hero{ padding-top:clamp(56px,10vh,120px); padding-bottom:8px; }
.hero .kick{ margin-bottom:clamp(26px,4vh,44px); }
.kick{ color:var(--faint); }
.hero .kick .dot{ display:inline-block; width:7px; height:7px; border-radius:50%; background:var(--lime); vertical-align:middle; margin-right:9px; }
h1.thesis{ font:400 clamp(38px,8.1vw,104px)/.98 var(--serif); letter-spacing:-.028em; max-width:15ch; }
h1.thesis .ln{ display:block; overflow:hidden; }
h1.thesis .ln > span{ display:block; }
h1.thesis em{ font-style:italic; }
.hero-mark{ background:linear-gradient(transparent 62%, var(--lime) 62%, var(--lime) 92%, transparent 92%); padding:0 .04em; }
.hero-grid{ margin-top:clamp(40px,6vh,72px); display:grid; gap:clamp(22px,3vw,48px); grid-template-columns:1fr; align-items:end; }
@media(min-width:820px){ .hero-grid{ grid-template-columns:1.5fr 1fr; } }
.subline{ font:400 clamp(17px,2vw,21px)/1.5 var(--serif); color:var(--ink-soft); max-width:34ch; min-width:0; }
.subline em{ font-style:italic; }
.hero-side{ min-width:0; }
.hero-aside{ color:var(--muted); margin-bottom:14px; }
.cred{ font:400 14px/1.6 var(--sans); color:var(--muted); padding-top:14px; border-top:1px solid var(--hairline); }
.cred b{ font-weight:500; color:var(--ink); }

/* ---------- currently ---------- */
.log{ display:grid; gap:0; border-top:1px solid var(--hairline); }
.log-row{ display:grid; grid-template-columns:minmax(0,1fr); gap:4px 20px; padding:16px 0; border-bottom:1px solid var(--hairline); align-items:baseline; }
@media(min-width:680px){ .log-row{ grid-template-columns:120px minmax(0,1fr) auto; } }
.log-row .when{ color:var(--faint); }
.log-row .what{ font:400 16px/1.55 var(--sans); color:var(--ink-soft); min-width:0; }
.log-row .what b{ font-weight:500; color:var(--ink); }
.log-row .state{ color:var(--muted); white-space:nowrap; }
.pulse{ display:inline-block; width:6px; height:6px; border-radius:50%; background:var(--lime); margin-right:7px; vertical-align:middle; }

/* ---------- current builds ---------- */
.builds{ display:grid; gap:0; border-top:1px solid var(--hairline); }
.build{ display:grid; grid-template-columns:minmax(0,1fr); gap:10px 24px; padding:clamp(22px,3vw,34px) 0; border-bottom:1px solid var(--hairline); position:relative; transition:background .5s var(--ease); }
@media(min-width:760px){ .build{ grid-template-columns:26px minmax(0,1.7fr) minmax(0,1fr); align-items:start; } }
.build:hover{ background:var(--paper-high); }
.build .badge{ padding-top:6px; }
.badge .status{ display:inline-block; width:11px; height:11px; border-radius:50%; box-shadow:0 0 0 1px var(--hairline) inset; }
.badge .status.live{ background:var(--lime); box-shadow:none; }
.badge .status.building{ background:transparent; box-shadow:0 0 0 1.5px var(--faint) inset; }
.build .main{ min-width:0; }
.build .name{ font:500 clamp(21px,2.6vw,30px)/1.08 var(--serif); letter-spacing:-.012em; display:flex; align-items:baseline; gap:10px; flex-wrap:wrap; }
.build .name .dom{ font:500 var(--mono-size)/1 var(--mono); letter-spacing:.08em; text-transform:lowercase; color:var(--faint); }
.build .kind{ margin-top:6px; color:var(--muted); }
.build .one{ margin-top:10px; color:var(--ink-soft); max-width:44ch; font-size:15px; }
.build .receipt{ padding-top:6px; min-width:0; display:flex; flex-direction:column; gap:8px; }
.build .receipt .r-line{ font:500 var(--mono-size)/1.5 var(--mono); letter-spacing:.08em; text-transform:lowercase; color:var(--muted); }
.build .receipt .r-line b{ color:var(--ink); font-weight:500; }
.build .receipt .price{ font:500 15px/1 var(--mono); letter-spacing:.02em; color:var(--ink); }
.build .arrow{ position:absolute; top:clamp(22px,3vw,34px); right:2px; color:var(--faint); transition:transform .5s var(--ease), color .5s var(--ease); }
.build:hover .arrow{ transform:translate(3px,-3px); color:var(--ink); }
@media(max-width:759px){ .build .arrow{ display:none; } }
.builds-note{ margin-top:clamp(26px,4vh,40px); font:400 italic clamp(17px,2.2vw,23px)/1.4 var(--serif); color:var(--ink); max-width:32ch; }
.builds-note .hero-mark{ font-style:italic; }

/* ---------- proof ledger ---------- */
.ledger{ border-top:1px solid var(--hairline); }
.led-row{ display:grid; grid-template-columns:minmax(0,1fr); gap:2px 22px; padding:15px 0; border-bottom:1px solid var(--hairline); align-items:baseline; position:relative; }
@media(min-width:640px){ .led-row{ grid-template-columns:112px 14px minmax(0,1fr); } }
.led-row .date{ color:var(--faint); font:500 var(--mono-size)/1.6 var(--mono); letter-spacing:.08em; }
.led-row .node{ display:none; }
@media(min-width:640px){
  .led-row .node{ display:block; position:relative; height:1em; }
  .led-row .node::before{ content:""; position:absolute; left:4px; top:.34em; width:6px; height:6px; border-radius:50%; background:var(--paper); box-shadow:0 0 0 1px var(--faint) inset; }
  .led-row:hover .node::before{ background:var(--lime); box-shadow:none; }
  .led-row .node::after{ content:""; position:absolute; left:6.5px; top:-15px; bottom:-15px; width:1px; background:var(--hairline); }
  .led-row:first-child .node::after{ top:.5em; }
  .led-row:last-child .node::after{ bottom:auto; height:.34em; }
}
.led-row .ev{ font:400 15.5px/1.55 var(--sans); color:var(--ink-soft); min-width:0; }
.led-row .ev b{ font-weight:500; color:var(--ink); }
.led-row .ev .amt{ font:500 12px/1 var(--mono); letter-spacing:.04em; color:var(--muted); white-space:nowrap; }

/* ---------- operating notes ---------- */
.notes{ display:grid; gap:0; border-top:1px solid var(--hairline); }
.note{ display:grid; grid-template-columns:minmax(0,1fr); gap:6px 28px; padding:clamp(22px,3vw,32px) 0; border-bottom:1px solid var(--hairline); position:relative; transition:padding-left .5s var(--ease); }
@media(min-width:720px){ .note{ grid-template-columns:118px minmax(0,1fr); align-items:baseline; } }
.note:hover{ padding-left:12px; }
.note .n-date{ color:var(--faint); font:500 var(--mono-size)/1.8 var(--mono); letter-spacing:.08em; }
.note .n-body{ min-width:0; }
.note .n-title{ font:500 clamp(20px,2.5vw,28px)/1.12 var(--serif); letter-spacing:-.012em; display:inline; background-image:linear-gradient(var(--ink),var(--ink)); background-size:0% 1px; background-repeat:no-repeat; background-position:0 1.06em; transition:background-size .5s var(--ease); }
.note:hover .n-title{ background-size:100% 1px; }
.note .n-desc{ display:block; margin-top:9px; color:var(--muted); max-width:52ch; font-size:15px; }
.note .n-read{ display:block; margin-top:12px; color:var(--muted); }
.note:hover .n-read{ color:var(--ink); }

/* ---------- the operating system ---------- */
.loop{ display:flex; flex-wrap:wrap; align-items:center; gap:10px 6px; padding:clamp(28px,4vh,44px) 0; border-top:1px solid var(--hairline); border-bottom:1px solid var(--hairline); }
.loop .step{ font:500 var(--mono-size)/1 var(--mono); letter-spacing:.12em; text-transform:lowercase; color:var(--ink); padding:9px 14px; border:1px solid var(--hairline); background:var(--paper-high); transition:border-color .4s var(--ease); }
.loop .step:hover{ border-color:var(--ink); }
.loop .to{ color:var(--faint); font:500 13px/1 var(--mono); }
.loop .step.wrap-back::after{ content:"→ idea"; margin-left:10px; color:var(--faint); font-weight:500; letter-spacing:.08em; }
.os-lines{ margin-top:clamp(44px,7vh,90px); display:grid; gap:clamp(30px,5vh,62px); }
.os-line{ font:400 clamp(24px,4vw,46px)/1.14 var(--serif); letter-spacing:-.018em; max-width:20ch; min-width:0; }
.os-line em{ font-style:italic; }
.os-line.right{ margin-left:auto; text-align:right; max-width:22ch; }
.os-line .small{ display:block; font:400 16px/1.6 var(--sans); color:var(--muted); margin-top:14px; letter-spacing:0; }

/* ---------- work with me ---------- */
.work-in{ padding:clamp(40px,7vh,90px) 0; border-top:1px solid var(--hairline); display:grid; gap:22px; }
.work-line{ font:400 clamp(24px,4.4vw,52px)/1.08 var(--serif); letter-spacing:-.02em; max-width:22ch; min-width:0; }
.work-line em{ font-style:italic; }
.work-cta{ display:inline-flex; align-items:baseline; gap:10px; width:max-content; max-width:100%; font:500 var(--mono-size)/1 var(--mono); letter-spacing:.1em; text-transform:lowercase; color:var(--ink); padding-bottom:5px; border-bottom:1px solid var(--ink); transition:gap .4s var(--ease); }
.work-cta:hover{ gap:16px; }
.work-cta .sw{ background:linear-gradient(transparent 55%, var(--lime) 55%); }

/* ---------- footer ---------- */
body > footer{ background:var(--night); color:var(--night-text); margin-top:var(--gap-section); padding-top:clamp(64px,10vh,128px); position:relative; overflow:hidden; }
body > footer ::selection{ background:var(--lime); color:var(--ink); }
.foot-big{ font:400 italic clamp(30px,6.6vw,88px)/1.02 var(--serif); letter-spacing:-.02em; color:var(--night-text); max-width:16ch; }
.foot-big .hero-mark{ background:linear-gradient(transparent 60%, var(--lime) 60%, var(--lime) 90%, transparent 90%); color:var(--night-text); }
.foot-grid{ margin-top:clamp(48px,8vh,96px); display:grid; gap:36px 24px; grid-template-columns:1fr; padding-bottom:clamp(40px,6vh,72px); border-bottom:1px solid var(--night-hairline); }
@media(min-width:720px){ .foot-grid{ grid-template-columns:1.4fr 1fr 1fr; } }
.foot-col h4{ color:var(--night-faint); margin-bottom:18px; }
.foot-col a, .foot-col p{ display:block; font-size:15px; color:var(--night-text); margin-bottom:10px; min-width:0; }
.foot-col a{ color:var(--night-faint); transition:color .3s var(--ease); width:max-content; max-width:100%; }
.foot-col a:hover{ color:var(--night-text); }
.foot-col p{ color:var(--night-faint); line-height:1.6; }
.foot-nav{ display:flex; flex-wrap:wrap; gap:14px 22px; }
.foot-nav a{ margin-bottom:0; }
.foot-bottom{ display:flex; flex-wrap:wrap; gap:14px 24px; align-items:baseline; padding:clamp(24px,3vh,36px) 0 clamp(20px,3vh,32px); }
.foot-bottom .prov{ font:400 13px/1.6 var(--sans); color:var(--night-faint); max-width:64ch; min-width:0; }
.foot-bottom .prov b{ color:var(--night-text); font-weight:500; }
.colophon{ margin-left:auto; }
.watermark{ font:500 clamp(56px,17vw,240px)/.8 var(--mono); letter-spacing:.02em; color:var(--night-ghost); text-transform:uppercase; padding:clamp(10px,3vh,40px) 0 clamp(6px,2vh,22px); user-select:none; pointer-events:none; white-space:nowrap; }

/* ---------- inner-page hero ---------- */
.page-hero{ padding-top:clamp(56px,10vh,120px); padding-bottom:clamp(8px,2vh,20px); }
.page-hero .kick{ color:var(--faint); margin-bottom:clamp(18px,3vh,30px); }
.ph-title{ font:400 clamp(34px,6.4vw,72px)/1.02 var(--serif); letter-spacing:-.022em; max-width:16ch; }
.ph-title em{ font-style:italic; }
.ph-intro{ margin-top:clamp(22px,3.5vh,34px); max-width:44ch; color:var(--ink-soft); font:400 clamp(16px,1.7vw,19px)/1.6 var(--serif); }

/* ---------- builds page groups ---------- */
section.sub{ padding-top:clamp(48px,7vh,86px); }
.grp-head{ display:flex; align-items:baseline; gap:16px; flex-wrap:wrap; margin-bottom:4px; }
.grp-title{ font:500 clamp(20px,2.6vw,28px)/1.1 var(--serif); letter-spacing:-.01em; }
.grp-note{ color:var(--muted); font-size:14px; }

/* ---------- prose / essays ---------- */
.essay-header{ padding-top:clamp(56px,10vh,110px); }
.essay-header .kick{ color:var(--faint); margin-bottom:18px; }
.essay-header h1{ font:400 clamp(30px,5vw,54px)/1.08 var(--serif); letter-spacing:-.016em; }
.essay-header .desc{ margin-top:18px; font:400 italic clamp(17px,2.2vw,22px)/1.5 var(--serif); color:var(--muted); }
.essay-header hr{ margin-top:clamp(28px,4vh,44px); }
.prose{ padding-top:clamp(24px,4vh,40px); font:400 clamp(17px,1.5vw,19px)/1.9 var(--serif); color:var(--ink); }
.prose > * + *{ margin-top:1.5em; }
.prose h2{ font:500 1.4em/1.3 var(--serif); letter-spacing:-.005em; margin-top:2.2em; }
.prose h3{ font:500 1.14em/1.35 var(--serif); margin-top:2em; }
.prose em{ font-style:italic; }
.prose b, .prose strong{ font-weight:600; }
.prose a{ text-decoration:underline; text-decoration-color:var(--hairline); text-underline-offset:.22em; transition:background-color .2s var(--ease); }
.prose a:hover{ background:var(--lime); }
.prose blockquote{ border-left:1px solid var(--ink); padding-left:1.4em; font-style:italic; color:var(--ink-soft); }
.prose ul{ padding-left:1.3em; } .prose li + li{ margin-top:.5em; }
.prose code{ font:500 .82em/1 var(--mono); background:var(--paper-high); padding:.1em .35em; }
.prose hr{ margin-block:2.4em; width:4rem; }
.prose--worldview{ font-size:clamp(18px,1.9vw,21px); }
.essay-footer{ margin-top:clamp(44px,7vh,80px); padding-top:1.4rem; border-top:1px solid var(--hairline); display:flex; justify-content:space-between; gap:1.5rem; flex-wrap:wrap; }
.essay-footer a{ color:var(--muted); font:500 var(--mono-size)/1.6 var(--mono); letter-spacing:.1em; text-transform:lowercase; }
.essay-footer a:hover{ color:var(--ink); }

/* ---------- about ---------- */
.about-prose{ margin-top:clamp(32px,5vh,52px); font:400 clamp(17px,1.5vw,19px)/1.9 var(--serif); }
.about-prose > * + *{ margin-top:1.5em; }
.about-prose h2{ font:500 var(--mono-size)/1 var(--mono); letter-spacing:.14em; text-transform:lowercase; color:var(--muted); margin-top:3em; }
.about-prose h2::before{ content:"[ "; color:var(--faint); } .about-prose h2::after{ content:" ]"; color:var(--faint); }
.about-prose a{ text-decoration:underline; text-decoration-color:var(--hairline); text-underline-offset:.22em; }
.about-prose a:hover{ background:var(--lime); }
.about-prose em{ font-style:italic; }

/* ---------- system page ---------- */
.eq-wrap{ padding-top:clamp(48px,7vh,80px); }
.equation{ display:flex; align-items:baseline; gap:clamp(.8rem,2.5vw,1.6rem); flex-wrap:wrap; }
.equation .term{ font:400 clamp(1.6rem,4.2vw,3rem)/1 var(--serif); letter-spacing:-.01em; }
.equation .term--filter{ font:500 clamp(1rem,2.6vw,1.8rem)/1 var(--mono); background:var(--lime); padding:.15em .5em; letter-spacing:.06em; }
.equation .arrow{ font:500 clamp(1rem,2.4vw,1.6rem)/1 var(--mono); color:var(--faint); }
.eq-caption{ margin-top:1.6rem; color:var(--muted); max-width:40ch; font-size:15px; }
.doc-group{ padding-top:clamp(48px,7vh,88px); }
.doc-label{ display:block; color:var(--faint); margin-bottom:clamp(18px,3vh,30px); }
.doc-line{ font:400 clamp(22px,3.4vw,38px)/1.28 var(--serif); letter-spacing:-.012em; max-width:26ch; padding:clamp(14px,2.2vh,24px) 0; }
.doc-line:nth-child(even){ margin-left:auto; }
@media(min-width:861px){ .doc-line:nth-child(even){ padding-left:clamp(0px,10vw,8rem); } }
.doc-line em{ font-style:italic; }
.doc-closing{ padding-top:var(--gap-section); text-align:center; }
.doc-closing p{ font:400 italic clamp(26px,5vw,56px)/1.2 var(--serif); }

/* ---------- reading ---------- */
.reading-list{ border-top:1px solid var(--hairline); }
.reading-item{ display:grid; grid-template-columns:minmax(0,1fr); gap:8px 28px; padding:clamp(20px,3vw,30px) 0; border-bottom:1px solid var(--hairline); align-items:baseline; }
@media(min-width:640px){ .reading-item{ grid-template-columns:150px minmax(0,1fr); } }
.reading-item .kind{ color:var(--faint); }
.reading-item h3{ display:inline; font:500 clamp(19px,2.3vw,25px)/1.25 var(--serif); }
.reading-item a:hover h3{ background:var(--lime); }
.reading-item .creator{ font:400 italic 16px/1 var(--serif); color:var(--muted); margin-left:.5em; }
.reading-item .note{ display:block; margin-top:8px; color:var(--ink-soft); font-size:15px; line-height:1.65; max-width:52ch; }

/* ---------- subscribe ---------- */
.subscribe-form{ margin-top:clamp(28px,4vh,40px); display:flex; max-width:30rem; border-bottom:1px solid var(--ink); }
.subscribe-form input{ flex:1; min-width:0; border:0; background:transparent; font:500 15px/1 var(--mono); padding:.9rem .2rem; color:var(--ink); outline:none; }
.subscribe-form input::placeholder{ color:var(--faint); }
.subscribe-form button{ border:0; background:transparent; cursor:pointer; color:var(--ink); font:500 var(--mono-size)/1 var(--mono); letter-spacing:.16em; text-transform:lowercase; padding:.9rem .4rem; }
.subscribe-form button:hover{ background:var(--lime); }
.subscribe-msg{ margin-top:1.1rem; color:var(--muted); font:500 var(--mono-size)/1.6 var(--mono); letter-spacing:.1em; min-height:1.2em; }

/* ---------- 404 ---------- */
.nf-line{ padding-top:clamp(20px,4vh,40px); color:var(--muted); font:400 clamp(18px,2.2vw,24px)/1.5 var(--serif); }
.nf-line a{ text-decoration:underline; text-decoration-color:var(--hairline); text-underline-offset:.2em; color:var(--ink); }
.nf-line a:hover{ background:var(--lime); }

/* ============================================================
   entrance life — gated behind html.js (JS-off keeps all visible)
   ============================================================ */
[data-rise]{ opacity:1; }
@media (prefers-reduced-motion: no-preference){
  html.js [data-rise]{ opacity:0; transform:translateY(18px); transition:opacity .9s var(--ease), transform .9s var(--ease); }
  html.js [data-rise].in{ opacity:1; transform:none; }

  html.js h1.thesis .ln > span{ transform:translateY(105%); transition:transform 1s var(--ease); }
  html.js h1.thesis.in .ln > span{ transform:translateY(0); }
  html.js h1.thesis .ln:nth-child(2) > span{ transition-delay:.09s; }
  html.js h1.thesis .ln:nth-child(3) > span{ transition-delay:.18s; }

  .hero .kick .dot{ animation:beat 3.4s var(--ease-io) infinite; }
  @keyframes beat{ 0%,100%{ box-shadow:0 0 0 0 rgba(208,255,0,.55); } 50%{ box-shadow:0 0 0 6px rgba(208,255,0,0); } }
  .badge .status.live{ animation:beat 3.4s var(--ease-io) infinite; }
}

@media (prefers-reduced-motion: reduce){
  *{ scroll-behavior:auto !important; }
  [data-rise]{ opacity:1 !important; transform:none !important; }
  h1.thesis .ln > span{ transform:none !important; }
}

/* ---------- print ---------- */
@media print{
  header.bar, body > footer, .watermark{ display:none; }
  body{ background:#fff; }
}