/* PABLO/OS — brand kit: #0b0b0b / #f5f5f0 / #d0ff00 · Inter 900 + JetBrains Mono · zero radius, sharp edges */

@font-face{
  font-family:"Inter Var";
  src:url("/assets/fonts/inter-var.woff2") format("woff2");
  font-weight:100 900; font-style:normal; font-display:swap;
}
@font-face{
  font-family:"JetBrains Mono Var";
  src:url("/assets/fonts/jetbrains-mono-var.woff2") format("woff2");
  font-weight:100 800; font-style:normal; font-display:swap;
}

:root{
  --bg:#0b0b0b;
  --bg-deep:#060606;
  --fg:#f5f5f0;
  --lime:#d0ff00;
  --dim:rgba(245,245,240,.52);
  --faint:rgba(245,245,240,.44);
  --hair:rgba(245,245,240,.14);
  --hair-strong:rgba(245,245,240,.3);
  --sans:"Inter Var",system-ui,-apple-system,sans-serif;
  --mono:"JetBrains Mono Var",ui-monospace,SFMono-Regular,Menlo,monospace;
  --pad:clamp(1.25rem,4vw,4rem);
  --ease:cubic-bezier(.19,1,.22,1);
}

*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; border-radius:0; }
html{ scroll-behavior:smooth; }
html.js.fine{ cursor:none; }
html.js.fine a, html.js.fine button, html.js.fine input, html.js.fine label{ cursor:none; }

body{
  background:var(--bg);
  color:var(--fg);
  font-family:var(--mono);
  font-size:clamp(.84rem,.75rem + .3vw,1rem);
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
/* film grain + scanlines — typographic surfaces only, per the kit */
body::before{
  content:""; position:fixed; inset:0; z-index:90; pointer-events:none; opacity:.05;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='0.6'/%3E%3C/svg%3E");
}
body::after{
  content:""; position:fixed; inset:0; z-index:90; pointer-events:none; opacity:.035;
  background:repeating-linear-gradient(0deg, transparent 0 2px, var(--fg) 2px 3px);
}

::selection{ background:var(--lime); color:#0b0b0b; }
mark{ background:var(--lime); color:#0b0b0b; padding:0 .18em; }

a{ color:inherit; text-decoration:none; }
button{ font:inherit; color:inherit; background:none; border:0; }
:focus-visible{ outline:2px solid var(--lime); outline-offset:3px; }

.skip{
  position:fixed; top:-4rem; left:var(--pad); z-index:200;
  background:var(--lime); color:#0b0b0b; padding:.6rem 1rem;
  font-family:var(--mono); transition:top .2s;
}
.skip:focus{ top:0; }

/* ---------- boot ---------- */
.boot{ display:none; }
.js .boot{
  display:flex; position:fixed; inset:0; z-index:150;
  background:var(--bg); align-items:center; justify-content:center;
  transition:clip-path .7s var(--ease);
  clip-path:inset(0 0 0 0);
}
.boot.done{ clip-path:inset(0 0 100% 0); pointer-events:none; }
.boot.gone{ display:none; }
.boot-inner{ width:min(560px,86vw); }
.boot-log{
  font-family:var(--mono); font-size:.8rem; line-height:1.7;
  color:var(--dim); min-height:12.5em; white-space:pre-wrap;
}
.boot-log .ok{ color:var(--lime); }
.boot-bar{ height:2px; background:var(--hair); margin-top:1.2rem; }
.boot-fill{ height:100%; width:0%; background:var(--lime); }
.boot-pct{ font-family:var(--mono); font-size:.75rem; color:var(--lime); margin-top:.5rem; }
.boot-skip{
  margin-top:1.4rem; font-family:var(--mono); font-size:.72rem;
  color:var(--faint); border:1px solid var(--hair); padding:.35rem .9rem;
}
.boot-skip:hover{ color:#0b0b0b; background:var(--lime); border-color:var(--lime); }

/* ---------- chrome ---------- */
.progress{
  position:fixed; top:0; left:0; height:2px; width:100%; z-index:120;
  background:var(--lime); transform-origin:0 50%; transform:scaleX(0);
}
.topbar{
  position:fixed; top:0; left:0; right:0; z-index:110;
  display:flex; align-items:center; justify-content:space-between;
  gap:1rem; padding:.8rem var(--pad);
  background:rgba(11,11,11,.72); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
  border-bottom:1px solid var(--hair);
}
.brand{
  font-family:var(--sans); font-weight:900; letter-spacing:.04em;
  font-size:1rem; text-transform:uppercase;
}
.brand-slash{ color:var(--lime); }
.topnav{ display:flex; gap:1.4rem; }
.topnav a{
  font-family:var(--mono); font-size:.72rem; color:var(--dim);
  letter-spacing:.06em; transition:color .2s;
}
.topnav a:hover, .topnav a.active{ color:var(--lime); }
.topbar-right{ display:flex; align-items:center; gap:1rem; }
.readout{ font-family:var(--mono); font-size:.72rem; color:var(--dim); letter-spacing:.08em; font-variant-numeric:tabular-nums; }
.palette-hint{
  font-family:var(--mono); font-size:.72rem; color:var(--fg);
  border:1px solid var(--hair-strong); padding:.28rem .6rem; transition:all .2s;
}
.palette-hint:hover{ background:var(--lime); color:#0b0b0b; border-color:var(--lime); }

/* ---------- hero ---------- */
.hero{
  position:relative; min-height:100svh;
  display:flex; flex-direction:column; justify-content:center;
  padding:7rem var(--pad) 5rem; overflow:hidden;
}
.field{ position:absolute; inset:0; width:100%; height:100%; }
.hero-ghost{
  position:absolute; right:-4vw; top:50%; transform:translateY(-50%);
  font-family:var(--sans); font-weight:900; font-size:46vw; line-height:1;
  color:transparent; -webkit-text-stroke:1px rgba(208,255,0,.14);
  pointer-events:none; user-select:none;
}
.hero-inner{ position:relative; max-width:1280px; }
.kick{
  font-family:var(--mono); font-size:.78rem; color:var(--lime);
  letter-spacing:.14em; text-transform:lowercase; margin-bottom:2rem;
}
.thesis{
  font-family:var(--sans); font-weight:900; text-transform:uppercase;
  font-size:clamp(2.6rem,8.2vw,7rem); line-height:.94; letter-spacing:-.015em;
}
.thesis-line{ display:block; overflow:hidden; padding-bottom:.06em; margin-bottom:-.06em; }
.tw{ display:inline-block; }
.js .tw{ transform:translateY(120%) rotate(3deg); transition:transform .9s var(--ease); }
.js .on .tw{ transform:none; }
.thesis-hollow .tw{ color:transparent; -webkit-text-stroke:2.5px var(--fg); }
.thesis-accent{ background:var(--lime); color:#0b0b0b; -webkit-text-stroke:0; padding:0 .1em; }
.sub{
  margin-top:2.2rem; max-width:46rem;
  font-family:var(--mono); font-size:clamp(.82rem,1.05vw,.98rem); color:var(--dim); line-height:1.8;
}
.chips{ display:flex; flex-wrap:wrap; gap:.6rem; margin-top:2.4rem; list-style:none; }
.chip{
  display:flex; align-items:center; gap:.55rem;
  font-family:var(--mono); font-size:.72rem; letter-spacing:.08em; text-transform:uppercase;
  border:1px solid var(--hair-strong); padding:.5rem .85rem;
}
.dot{ width:7px; height:7px; display:inline-block; flex:none; }
.dot-live{ background:var(--lime); animation:pulse 2.2s infinite; }
.dot-warn{ background:var(--fg); animation:pulse 2.2s infinite; }
.dot-zero{ border:1px solid var(--lime); background:none; }
.dot-int{ border:1px solid var(--hair-strong); background:none; }
@keyframes pulse{ 0%,100%{ opacity:1 } 50%{ opacity:.35 } }
.scrollcue{
  position:absolute; bottom:2rem; left:var(--pad);
  display:flex; align-items:center; gap:.8rem;
  font-family:var(--mono); font-size:.7rem; letter-spacing:.18em; text-transform:uppercase; color:var(--dim);
}
.scrollcue-line{ width:3.4rem; height:1px; background:var(--dim); position:relative; overflow:hidden; }
.scrollcue-line::after{
  content:""; position:absolute; inset:0; background:var(--lime);
  transform:translateX(-100%); animation:cue 2.2s var(--ease) infinite;
}
@keyframes cue{ 0%{ transform:translateX(-100%) } 55%{ transform:translateX(0) } 100%{ transform:translateX(100%) } }

/* ---------- ticker ---------- */
.ticker{
  border-top:1px solid var(--hair); border-bottom:1px solid var(--hair);
  overflow:hidden; padding:.85rem 0; background:var(--bg-deep);
}
.ticker-track{
  display:inline-flex; gap:2.2rem; align-items:center; white-space:nowrap;
  font-family:var(--sans); font-weight:900; font-size:.95rem; letter-spacing:.06em;
  width:max-content; animation:tick 30s linear infinite; padding-right:2.2rem;
}
.ticker:hover .ticker-track{ animation-play-state:paused; }
.tick-sep{ color:var(--lime); }
@keyframes tick{ from{ transform:translateX(0) } to{ transform:translateX(-50%) } }

/* ---------- sections ---------- */
.sec{ padding:clamp(5rem,12vh,9rem) var(--pad); max-width:1400px; margin:0 auto; }
.sec-head{ margin-bottom:3.2rem; position:relative; }
.sec-index{
  font-family:var(--mono); font-size:.72rem; color:var(--lime); letter-spacing:.3em; display:block; margin-bottom:.8rem;
}
.sec h2{
  font-family:var(--sans); font-weight:900; text-transform:uppercase;
  font-size:clamp(1.7rem,4.4vw,3.4rem); letter-spacing:-.01em; line-height:1;
}
.sec-note{ margin-top:1.1rem; color:var(--dim); max-width:44rem; }
.law{
  margin-top:1.6rem; font-family:var(--sans); font-weight:900; text-transform:uppercase;
  font-size:clamp(1rem,2vw,1.5rem); letter-spacing:.01em;
}
.js [data-reveal]{ opacity:0; transform:translateY(26px); transition:opacity .8s var(--ease), transform .8s var(--ease); }
.js [data-reveal].on{ opacity:1; transform:none; }

/* ---------- /proc ---------- */
.proc-table{ list-style:none; border-top:1px solid var(--hair); }
.proc-row{
  display:grid; grid-template-columns:15rem 7.5rem 1fr 11rem;
  gap:1.2rem; align-items:baseline;
  padding:1.05rem 0; border-bottom:1px solid var(--hair);
  font-family:var(--mono); font-size:.84rem; transition:background .2s, color .2s;
}
@media (hover:hover) and (pointer:fine){
  .proc-row:hover{ background:var(--lime); color:#0b0b0b; padding-left:.8rem; padding-right:.8rem; }
  .proc-row:hover .proc-desc, .proc-row:hover .proc-int{ color:#0b0b0b; }
  .proc-row:hover .dot{ background:#0b0b0b; border-color:#0b0b0b; animation:none; }
}
.proc-name{ font-weight:700; letter-spacing:.02em; }
.proc-int{ color:var(--dim); font-size:.76rem; }
.proc-desc{ color:var(--dim); }
.proc-state{ display:flex; align-items:center; gap:.55rem; font-size:.72rem; letter-spacing:.12em; justify-self:end; }

/* ---------- /bin ---------- */
.group-label{
  font-family:var(--mono); font-weight:500; font-size:.74rem; letter-spacing:.22em; text-transform:uppercase;
  color:var(--dim); margin:3.4rem 0 .9rem;
}
.bin-list{ list-style:none; border-top:1px solid var(--hair); }
.bin-row{
  position:relative; display:grid;
  grid-template-columns:3.2rem 15rem 12rem 1fr 10rem 2rem;
  gap:1.2rem; align-items:baseline;
  padding:1.35rem 0; border-bottom:1px solid var(--hair);
  transition:background .2s, color .2s, padding .2s;
}
@media (hover:hover) and (pointer:fine){
  a.bin-row:hover{ background:var(--lime); color:#0b0b0b; padding-left:.9rem; padding-right:.9rem; }
  a.bin-row:hover .bin-kind, a.bin-row:hover .bin-line, a.bin-row:hover .bin-no{ color:#0b0b0b; }
  a.bin-row:hover .dot{ background:#0b0b0b; border-color:#0b0b0b; animation:none; }
  a.bin-row:hover .bin-arrow{ transform:translateX(.5rem); }
  a.bin-row:hover::after{ opacity:.14; }
}
.bin-row::after{
  content:attr(data-ghost); position:fixed; left:50%; top:50%; z-index:-1;
  transform:translate(-50%,-50%);
  font-family:var(--sans); font-weight:900; font-size:16vw; letter-spacing:-.02em; white-space:nowrap;
  color:transparent; -webkit-text-stroke:1px rgba(208,255,0,.5);
  opacity:0; transition:opacity .25s; pointer-events:none;
}
.bin-no{ font-family:var(--mono); font-size:.72rem; color:var(--dim); letter-spacing:.1em; }
.bin-name{ font-family:var(--sans); font-weight:800; font-size:clamp(1.05rem,1.8vw,1.45rem); letter-spacing:-.01em; }
.bin-kind{ font-family:var(--mono); font-size:.74rem; color:var(--dim); letter-spacing:.04em; }
.bin-line{ font-family:var(--mono); font-size:.8rem; color:var(--dim); }
.bin-price{ display:flex; align-items:center; gap:.55rem; font-family:var(--mono); font-size:.74rem; letter-spacing:.06em; justify-self:end; }
.bin-arrow{ font-family:var(--mono); transition:transform .25s var(--ease); justify-self:end; }
.bin-static{ color:var(--dim); }

/* ---------- /ledger ---------- */
.zero{
  border:3px solid var(--lime); padding:clamp(1.6rem,4vw,3rem);
  margin-bottom:3.4rem; position:relative; overflow:hidden;
}
.zero-label{ font-family:var(--mono); font-size:.74rem; letter-spacing:.3em; text-transform:uppercase; color:var(--lime); }
.zero-figure{
  font-family:var(--sans); font-weight:900;
  font-size:clamp(3.4rem,12vw,10rem); line-height:1; letter-spacing:-.02em;
  margin:.6rem 0; font-variant-numeric:tabular-nums;
}
.zero-line{ color:var(--dim); max-width:40rem; line-height:1.9; }
.ledger{ list-style:none; border-top:1px solid var(--hair); counter-reset:none; }
.ledger-row{
  display:grid; grid-template-columns:8.5rem 8.5rem 1fr 12rem;
  gap:1.2rem; align-items:baseline;
  padding:1.05rem 0; border-bottom:1px solid var(--hair);
  font-family:var(--mono); font-size:.82rem;
}
.ledger-row time{ color:var(--faint); font-size:.76rem; letter-spacing:.04em; }
.ledger-proj{ color:var(--dim); font-size:.76rem; letter-spacing:.06em; text-transform:uppercase; }
.ledger-what{ color:var(--dim); }
.ledger-what strong{ color:var(--fg); font-weight:700; }
.ledger-metric{ color:var(--lime); font-size:.74rem; justify-self:end; text-align:right; letter-spacing:.04em; }

/* ---------- /doctrine ---------- */
.sec-doctrine{ max-width:none; background:var(--bg-deep); border-top:1px solid var(--hair); border-bottom:1px solid var(--hair); }
.sec-doctrine > .sec-head, .sec-doctrine > .equation, .sec-doctrine > .eq-caption, .sec-doctrine > .creed{ max-width:1400px; margin-left:auto; margin-right:auto; }
.sec-doctrine > .sec-head{ margin-bottom:3.2rem; }
.equation{
  display:flex; flex-wrap:wrap; align-items:center; gap:clamp(.8rem,2.4vw,2rem);
  font-family:var(--sans); font-weight:900;
  font-size:clamp(1.4rem,4.6vw,3.6rem); letter-spacing:-.01em;
}
.eq-filter{ color:var(--lime); }
.eq-arrow{ color:var(--faint); animation:pulse 2.6s infinite; font-weight:400; }
.eq-caption{ margin-top:1.6rem; color:var(--dim); max-width:44rem; }
.creed{ margin-top:2rem; }
.creed-line{
  font-family:var(--sans); font-weight:800;
  font-size:clamp(1.7rem,4.6vw,4rem); line-height:1.14; letter-spacing:-.015em;
  padding:clamp(3rem,16vh,22vh) 0; max-width:62rem;
}
.creed-line mark{ background:none; color:var(--lime); padding:0; }
.creed-lower{ text-transform:lowercase; }
.js .creed-line .cw{ opacity:.38; transition:opacity .3s linear; }
.js .creed-line .cw.lit{ opacity:1; }

/* ---------- /loop ---------- */
.loop-rail{
  display:flex; flex-wrap:wrap; align-items:center; gap:1rem;
  font-family:var(--mono); font-size:clamp(.8rem,1.4vw,1.05rem); letter-spacing:.14em;
}
.loop-step{ border:1px solid var(--hair-strong); padding:.85rem 1.3rem; white-space:nowrap; }
.loop-accent{ border:3px solid var(--lime); color:var(--lime); font-weight:700; }
.loop-link{ flex:1 1 2.5rem; min-width:2.5rem; height:1px; background:var(--hair-strong); position:relative; overflow:hidden; }
.loop-link::after{
  content:""; position:absolute; top:0; bottom:0; width:40%;
  background:var(--lime); transform:translateX(-110%); animation:travel 2.4s linear infinite;
}
.loop-link:nth-of-type(4)::after{ animation-delay:.4s } .loop-link:nth-of-type(6)::after{ animation-delay:.8s }
.loop-link:nth-of-type(8)::after{ animation-delay:1.2s } .loop-link:nth-of-type(10)::after{ animation-delay:1.6s }
@keyframes travel{ to{ transform:translateX(280%) } }
.loop-return{ font-size:1.6rem; color:var(--lime); animation:spin 6s linear infinite; display:inline-block; }
@keyframes spin{ to{ transform:rotate(-360deg) } }
.loop-note{ margin-top:2rem; color:var(--dim); }

/* ---------- /work ---------- */
.sec-work{ text-align:left; padding-bottom:8rem; }
.work-lead{
  font-family:var(--sans); font-weight:900; text-transform:uppercase;
  font-size:clamp(2rem,6.4vw,5.4rem); line-height:1; letter-spacing:-.015em; max-width:60rem;
}
.work-body{ margin-top:1.8rem; color:var(--dim); line-height:1.9; max-width:44rem; }
.work-cta{
  display:inline-flex; align-items:center; gap:.8rem;
  margin-top:2.6rem; padding:1.1rem 1.8rem;
  border:3px solid var(--lime); color:var(--fg);
  font-family:var(--mono); font-size:clamp(.85rem,1.4vw,1.05rem); letter-spacing:.04em;
  transition:background .2s, color .2s;
}
.work-cta:hover{ background:var(--lime); color:#0b0b0b; }
.work-cta:hover .work-prompt{ color:#0b0b0b; }
.work-prompt{ color:var(--lime); font-weight:700; }
.work-anti{ margin-top:1.6rem; font-size:.78rem; color:var(--faint); letter-spacing:.04em; }

/* ---------- footer ---------- */
.footer{
  position:relative; overflow:hidden;
  background:var(--bg-deep); border-top:1px solid var(--hair);
  padding:5rem var(--pad) 2.5rem;
}
.footer-ghost{
  position:absolute; left:50%; bottom:-.18em; transform:translateX(-50%);
  font-family:var(--sans); font-weight:900; font-size:16vw; line-height:1; white-space:nowrap;
  color:transparent; -webkit-text-stroke:1px rgba(245,245,240,.07);
  pointer-events:none; user-select:none;
}
.footer-grid{
  position:relative; display:grid; grid-template-columns:repeat(3,1fr);
  gap:2.5rem; max-width:1400px; margin:0 auto;
}
.footer-h{
  font-family:var(--mono); font-weight:700; font-size:.74rem;
  letter-spacing:.24em; text-transform:uppercase; color:var(--lime); margin-bottom:1rem;
}
.footer-col p{ color:var(--dim); font-size:.82rem; line-height:1.8; max-width:26rem; }
.footer-col ul{ list-style:none; }
.footer-col li{ margin-bottom:.55rem; }
.footer-col a{ color:var(--dim); font-size:.82rem; border-bottom:1px solid transparent; transition:color .2s; }
.footer-col a:hover{ color:var(--lime); }
.footer-closing{
  position:relative; margin:4.5rem auto 0; max-width:1400px;
  font-family:var(--sans); font-weight:900; text-transform:lowercase;
  font-size:clamp(1.3rem,3.4vw,2.4rem); letter-spacing:-.01em;
}
.footer-colophon{ position:relative; margin:2.2rem auto 0; max-width:1400px; color:var(--faint); font-size:.72rem; letter-spacing:.04em; }
.footer-copy{ position:relative; margin:.6rem auto 0; max-width:1400px; color:var(--faint); font-size:.72rem; }

/* ---------- command palette ---------- */
.palette{
  position:fixed; inset:0; z-index:160;
  background:rgba(6,6,6,.82); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
  display:flex; align-items:flex-start; justify-content:center; padding-top:16vh;
}
.palette[hidden]{ display:none; }
.palette-box{ width:min(620px,92vw); background:var(--bg); border:1px solid var(--lime); box-shadow:0 0 0 1px rgba(208,255,0,.15), 0 30px 80px rgba(0,0,0,.6); }
.palette-input{
  width:100%; background:none; border:0; border-bottom:1px solid var(--hair);
  color:var(--fg); font-family:var(--mono); font-size:1rem; padding:1.1rem 1.2rem; outline:none;
}
.palette-input::placeholder{ color:var(--faint); }
.palette-list{ list-style:none; max-height:46vh; overflow-y:auto; }
.palette-list li{
  display:flex; justify-content:space-between; gap:1rem;
  padding:.8rem 1.2rem; font-family:var(--mono); font-size:.84rem; color:var(--dim);
}
.palette-list li .pk{ color:var(--faint); font-size:.72rem; letter-spacing:.08em; }
.palette-list li.sel{ background:var(--lime); color:#0b0b0b; }
.palette-list li.sel .pk{ color:#0b0b0b; }
.palette-foot{ padding:.7rem 1.2rem; border-top:1px solid var(--hair); color:var(--faint); font-size:.7rem; letter-spacing:.08em; }

/* ---------- cursor ---------- */
.cursor{ display:none; }
.js.fine .cursor{
  display:block; position:fixed; left:0; top:0; z-index:170; pointer-events:none;
  mix-blend-mode:normal;
}
.cursor-dot{
  position:absolute; left:-3px; top:-3px; width:6px; height:6px; background:var(--lime);
}
.cursor-ring{
  position:absolute; left:-17px; top:-17px; width:34px; height:34px;
  border:1px solid rgba(208,255,0,.6);
  transition:transform .18s var(--ease), opacity .18s;
}
.cursor.is-link .cursor-ring{ transform:scale(1.7); }
.cursor-tag{
  position:absolute; left:24px; top:14px; white-space:nowrap;
  font-family:var(--mono); font-size:.62rem; letter-spacing:.14em; text-transform:uppercase;
  color:#0b0b0b; background:var(--lime); padding:.14rem .45rem;
  opacity:0; transition:opacity .15s;
}
.cursor.is-link .cursor-tag{ opacity:1; }

/* ---------- 404 ---------- */
.err{ min-height:80vh; display:flex; flex-direction:column; justify-content:center; }
.err-thesis{ font-size:clamp(2.2rem,7vw,6rem); }
.err-sub{ margin-top:2rem; }
.err-cta{ margin-top:2.4rem; }

/* ---------- responsive ---------- */
@media (max-width:960px){
  .topnav{ display:none; }
  .proc-row{ grid-template-columns:1fr auto; grid-template-areas:"name state" "int state" "desc desc"; row-gap:.3rem; }
  .proc-name{ grid-area:name } .proc-int{ grid-area:int } .proc-desc{ grid-area:desc } .proc-state{ grid-area:state; align-self:center }
  .bin-row{ grid-template-columns:2.4rem 1fr auto; grid-template-areas:"no name price" "no kind price" "no line arrow"; row-gap:.3rem; }
  .bin-no{ grid-area:no } .bin-name{ grid-area:name } .bin-kind{ grid-area:kind } .bin-line{ grid-area:line } .bin-price{ grid-area:price } .bin-arrow{ grid-area:arrow }
  .ledger-row{ grid-template-columns:1fr auto; grid-template-areas:"date metric" "proj metric" "what what"; row-gap:.3rem; }
  .ledger-row time{ grid-area:date } .ledger-proj{ grid-area:proj } .ledger-what{ grid-area:what } .ledger-metric{ grid-area:metric; align-self:center }
  .footer-grid{ grid-template-columns:1fr; }
  .hero-ghost{ font-size:70vw; opacity:.7; }
}

/* ---------- reduced motion ---------- */
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{ animation:none !important; transition:none !important; }
  .js .tw, .js [data-reveal]{ transform:none; opacity:1; }
  .js .creed-line .cw{ opacity:1; }
  .ticker-track{ animation:none; white-space:normal; width:auto; flex-wrap:wrap; }
  .field, .cursor{ display:none !important; }
  html.js.fine, html.js.fine a, html.js.fine button, html.js.fine input{ cursor:auto; }
  .boot{ display:none !important; }
}