:root{
  --bg:#fdfdfc; --ink:#151515; --muted:#64676a; --line:#e4e2dc; --card:#ffffff;
  --shadow: 0 20px 80px rgba(20,20,20,.06); --mx:.5; --my:.5;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
}
*{box-sizing:border-box} html{scroll-behavior:smooth} body{margin:0;background:var(--bg);color:var(--ink);cursor:default}
body:before{content:"";position:fixed;inset:0;background:radial-gradient(circle at calc(var(--mx)*100%) calc(var(--my)*100%),rgba(0,0,0,.038),transparent 24rem);pointer-events:none;z-index:-1}
a{color:inherit;text-decoration:none;border-bottom:1px solid currentColor} button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}.page-shell{width:min(1140px,calc(100% - 48px));margin:0 auto}.site-header{height:96px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{font-weight:800;font-size:22px;border:0}.site-header nav{display:flex;gap:28px;align-items:center;font-size:13px}.icon-link{border:0;font-weight:800}.hero{min-height:520px;display:grid;grid-template-columns:1fr 290px;gap:72px;align-items:center}.hero-copy{max-width:720px;font-size:21px;line-height:1.55;letter-spacing:-.02em}.hero-copy p{margin:0 0 28px}.focus-card{justify-self:end;width:290px;padding:30px 26px;border:1px solid var(--line);border-radius:10px;background:rgba(255,255,255,.42);box-shadow:var(--shadow);backdrop-filter:blur(10px)}.focus-card button{display:block;width:100%;padding:13px 0;text-align:left;border-radius:7px;transition:.2s}.focus-card button:hover{transform:translateX(8px);background:rgba(0,0,0,.04)}.eyebrow{display:block;color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.08em;margin-bottom:20px}.section{border-top:1px solid var(--line);padding:34px 0}.section-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}.section-head a{font-size:12px;border:0;color:var(--muted)}.row{position:relative;display:grid;grid-template-columns:1fr 80px;gap:24px;padding:22px 0;border-bottom:1px solid var(--line);transition:.25s}.row:hover{padding-left:18px;background:linear-gradient(90deg,rgba(0,0,0,.035),transparent)}.row h2{font-size:18px;margin:0 0 8px}.row p{grid-column:1;margin:0;color:var(--muted);max-width:620px;line-height:1.55}.row span{text-align:right;color:var(--muted)}.writing-list a{display:grid;grid-template-columns:1fr 170px;padding:13px 0;border-bottom:1px solid var(--line);font-weight:700}.writing-list time{font-weight:400;color:var(--muted);text-align:right}.lab p{font-size:28px;margin:0 0 26px}.lab-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.lab-tile{border:1px solid var(--line);border-radius:10px;padding:26px;background:var(--card);text-align:left;transition:.25s}.lab-tile:hover{transform:translateY(-5px) rotate(-1deg);box-shadow:var(--shadow)}footer{height:86px;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;color:var(--muted);font-size:12px}.cursor-dot{position:fixed;left:-10px;top:-10px;width:20px;height:20px;border:1px solid rgba(0,0,0,.32);border-radius:50%;pointer-events:none;z-index:20;transition:width .2s,height .2s}.grain{position:fixed;inset:0;pointer-events:none;opacity:.18;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.18'/%3E%3C/svg%3E")}.toast{position:fixed;left:50%;bottom:28px;transform:translate(-50%,20px);padding:12px 16px;background:#111;color:#fff;border-radius:999px;font-size:13px;opacity:0;pointer-events:none;transition:.25s;z-index:30}.toast.show{opacity:1;transform:translate(-50%,0)}.side-panel{position:fixed;right:24px;top:110px;width:min(360px,calc(100% - 48px));padding:28px;border:1px solid var(--line);background:var(--card);box-shadow:var(--shadow);border-radius:14px;transform:translateX(120%);transition:.3s;z-index:25}.side-panel.open{transform:translateX(0)}.close-panel{position:absolute;right:16px;top:12px;font-size:24px}.side-panel p{font-size:18px;line-height:1.55}.reveal{opacity:0;transform:translateY(18px);transition:.75s ease}.reveal.visible{opacity:1;transform:translateY(0)}.dark{--bg:#11110f;--ink:#f2efe7;--muted:#aaa49a;--line:#34312c;--card:#181714}.dark .cursor-dot{border-color:rgba(255,255,255,.5)}.blueprint{background-image:linear-gradient(rgba(0,0,0,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(0,0,0,.045) 1px,transparent 1px);background-size:28px 28px}@media(max-width:850px){.site-header{height:auto;padding:26px 0;align-items:flex-start}.site-header nav{gap:14px;flex-wrap:wrap;justify-content:flex-end}.hero{grid-template-columns:1fr;gap:22px;padding:54px 0}.hero-copy{font-size:18px}.focus-card{justify-self:stretch;width:auto}.writing-list a,.row{grid-template-columns:1fr}.writing-list time,.row span{text-align:left}.lab-grid{grid-template-columns:1fr}.cursor-dot{display:none}}


/* Top scroll veil: sharp text, no blur. It paints the page background over
   the upper slice of the viewport so content naturally fades as it exits. */
body:after{
  content:"";
  position:fixed;
  top:0;
  left:0;
  right:0;
  height:min(150px,18vh);
  pointer-events:none;
  z-index:14;
  opacity:0;
  transition:opacity .22s ease;
  background:linear-gradient(
    to bottom,
    var(--bg) 0%,
    color-mix(in srgb, var(--bg) 94%, transparent) 24%,
    color-mix(in srgb, var(--bg) 62%, transparent) 58%,
    transparent 100%
  );
}

body.is-scrolled:after{opacity:1}

/* Project rows can now be links for deep-dive pages. */
a.row{
  border-left:0;
  border-right:0;
  border-top:0;
  text-decoration:none;
  color:inherit;
}
a.row:visited{color:inherit}

/* Editorial hover: the selected row stays crisp, neighbors soften,
   distant rows recede. No blur. */
.project-list.is-hovering .row,
.writing-list.is-hovering a{
  opacity:.55;
  transition:opacity .38s ease, padding-left .28s ease, transform .28s ease, background .28s ease, color .28s ease;
}

.project-list.is-hovering .row.is-near-hover,
.writing-list.is-hovering a.is-near-hover{
  opacity:.75;
}

.project-list.is-hovering .row.is-active-hover,
.writing-list.is-hovering a.is-active-hover{
  opacity:1;
}

.writing-list a{
  position:relative;
  transition:opacity .38s ease, padding-left .28s ease, transform .28s ease, color .28s ease;
}

.writing-list a:after{
  content:"";
  position:absolute;
  left:0;
  bottom:-1px;
  width:0;
  height:1px;
  background:currentColor;
  transition:width .34s ease;
}

.writing-list a:hover,
.writing-list a.is-active-hover{
  padding-left:12px;
}

.writing-list a:hover:after,
.writing-list a.is-active-hover:after{
  width:100%;
}

.writing-list a:hover time,
.writing-list a.is-active-hover time{
  color:var(--ink);
}

.row,
.writing-list a{
  filter:none!important;
}

/* Deep-dive page layout */
.article-shell{width:min(1180px,calc(100% - 48px));margin:0 auto;display:grid;grid-template-columns:210px minmax(0,780px);gap:72px}
.side-nav{position:sticky;top:28px;height:calc(100vh - 56px);padding:28px 0;display:flex;flex-direction:column;justify-content:space-between;border-right:1px solid var(--line)}
.side-nav a,.side-nav button{width:max-content;border:0;color:var(--muted);font-size:12px;text-align:left}.side-nav a:hover,.side-nav button:hover{color:var(--ink)}
.side-nav .article-brand{font-weight:800;font-size:18px;color:var(--ink)}
.side-nav-links{display:grid;gap:14px}.side-nav-bottom{display:grid;gap:14px}
.article-main{padding:88px 0 96px}.article-hero{min-height:72vh;display:flex;flex-direction:column;justify-content:center}.article-kicker{color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.08em;margin-bottom:20px}.article-title{font-size:clamp(44px,8vw,92px);line-height:.92;letter-spacing:-.07em;margin:0 0 30px}.article-dek{font-size:clamp(20px,3vw,30px);line-height:1.35;letter-spacing:-.045em;max-width:760px;color:var(--ink)}
.article-section{border-top:1px solid var(--line);padding:56px 0}.article-section h2{font-size:26px;letter-spacing:-.05em;margin:0 0 16px}.article-section p{font-size:18px;line-height:1.65;color:var(--muted);max-width:700px}.pull-note{font-size:24px!important;line-height:1.35!important;color:var(--ink)!important;letter-spacing:-.04em;border-left:1px solid var(--ink);padding-left:22px;margin:34px 0}
.concept-card{border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.55);box-shadow:var(--shadow);padding:24px;margin:28px 0}.concept-card h3{margin:0 0 10px;font-size:18px}.concept-card p{font-size:15px;margin:0;color:var(--muted)}
.core-demo{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:28px}.core-controls{display:grid;gap:10px}.signal-toggle{border:1px solid var(--line);border-radius:10px;background:var(--card);padding:16px;text-align:left;transition:.25s}.signal-toggle strong{display:block;margin-bottom:6px}.signal-toggle span{display:block;color:var(--muted);font-size:13px;line-height:1.45}.signal-toggle.active{background:var(--ink);color:var(--bg);transform:translateX(6px)}.signal-toggle.active span{color:rgba(255,255,255,.72)}
.health-panel{border:1px solid var(--line);border-radius:14px;padding:22px;background:var(--card);position:sticky;top:28px}.health-score{font-size:72px;line-height:1;letter-spacing:-.08em;margin:8px 0}.meter{height:8px;background:var(--line);border-radius:999px;overflow:hidden;margin:16px 0}.meter-fill{height:100%;width:86%;background:var(--ink);border-radius:999px;transition:width .35s ease}.health-caption{font-size:14px!important}.micro-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:20px}.micro-cell{min-height:80px;border:1px solid var(--line);border-radius:10px;padding:12px;font-size:12px;color:var(--muted);transition:.25s}.micro-cell.good{background:rgba(0,0,0,.045);color:var(--ink)}.micro-cell.warn{transform:translateY(-4px);background:var(--ink);color:var(--bg)}
.loop-demo{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-top:30px}.loop-step{border:1px solid var(--line);border-radius:10px;padding:18px;min-height:120px;background:var(--card);transition:.3s}.loop-step strong{display:block;margin-bottom:18px}.loop-step span{color:var(--muted);font-size:13px;line-height:1.45}.loop-step:hover,.loop-step.active{transform:translateY(-6px);background:var(--ink);color:var(--bg)}.loop-step:hover span,.loop-step.active span{color:rgba(255,255,255,.72)}
.hidden-prompt{margin-top:26px;font-size:13px;color:var(--muted)}.hidden-prompt button{border-bottom:1px solid currentColor}.artifact-reveal{max-height:0;overflow:hidden;transition:max-height .5s ease}.artifact-reveal.open{max-height:420px}.artifact-list{display:grid;gap:12px;margin-top:18px}.artifact-list div{border:1px solid var(--line);border-radius:10px;padding:16px;background:var(--card)}
@media(max-width:850px){.article-shell{display:block}.side-nav{position:static;height:auto;border-right:0;border-bottom:1px solid var(--line);padding:24px 0}.side-nav-links{display:flex;flex-wrap:wrap}.article-main{padding:48px 0}.core-demo,.loop-demo{grid-template-columns:1fr}.health-panel{position:static}.micro-grid{grid-template-columns:1fr 1fr}}