:root{--paper:#F4EEDF;--ink:#14213D;--indigo:#4F46E5;--line:rgba(20,33,61,.09)}
*{box-sizing:border-box;margin:0}html{scroll-behavior:smooth}
body{font:400 1.05rem/1.65 'Plus Jakarta Sans',sans-serif;color:var(--ink);background:var(--paper);background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:40px 40px}
body::before{content:"";position:fixed;inset:0;pointer-events:none;background:radial-gradient(520px circle at var(--mx,70%) var(--my,25%),rgba(79,70,229,.12),transparent 62%)}
a{color:var(--indigo);text-underline-offset:4px}.wrap{max-width:1100px;margin:auto;padding:4.5rem 1.4rem}
.mono,.fig,nav a{font-family:'JetBrains Mono',monospace;font-size:.82rem}
.skip{position:absolute;left:-999px}.skip:focus{left:1rem;top:1rem;background:var(--ink);color:#fff;padding:.5rem;z-index:99}
.bar{position:fixed;top:0;left:0;height:3px;width:calc(var(--p,0)*100%);background:var(--indigo);z-index:60}
.top{position:sticky;top:0;z-index:50;display:flex;justify-content:space-between;align-items:center;padding:.8rem 1.4rem;background:rgba(244,238,223,.88);backdrop-filter:blur(8px);border-bottom:1.5px solid var(--ink)}
.logo{font:800 1.1rem 'Plus Jakarta Sans';color:var(--ink);text-decoration:none;border:2px solid var(--ink);padding:.1rem .5rem}
nav{display:flex;gap:1.6rem}nav a{color:var(--ink);text-decoration:none;position:relative}
nav a::after{content:"";position:absolute;left:0;bottom:-4px;height:2px;width:0;background:var(--indigo);transition:width .3s}
nav a:hover::after,nav a[aria-current]::after{width:100%}
.nav-toggle{display:none;font:inherit;background:none;border:1.5px solid var(--ink);padding:.3rem .7rem;color:var(--ink)}
.hero{display:grid;grid-template-columns:1.15fr .85fr;gap:3rem;align-items:center;min-height:82vh}
h1{font-weight:800;font-size:clamp(2.4rem,6.2vw,4.9rem);line-height:1.04;letter-spacing:-.035em}
h2{font-weight:800;font-size:clamp(1.8rem,4vw,2.8rem);letter-spacing:-.02em;margin-bottom:2rem}
h3{font-size:1.25rem;margin:.4rem 0}.page h1{font-size:clamp(2.2rem,5vw,3.8rem);margin-bottom:1.2rem}
.rot{display:block;color:var(--indigo);font:500 1.2rem 'JetBrains Mono';letter-spacing:0;margin-top:1rem;min-height:2rem}
.rot::after{content:"|";animation:bl 1s steps(1) infinite}@keyframes bl{50%{opacity:0}}
.lead{max-width:34rem;margin:1.2rem 0 2rem}.btn{display:inline-block;padding:.8rem 1.4rem;border:1.5px solid var(--ink);background:var(--ink);color:#fff;text-decoration:none;font-weight:700;margin:0 .6rem .6rem 0;transition:transform .25s,box-shadow .25s}
.btn.alt{background:none;color:var(--ink)}.btn:hover{transform:translate(-3px,-3px);box-shadow:5px 5px 0 var(--indigo)}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1.6rem}
.card{position:relative;border:1.5px solid var(--ink);background:rgba(255,255,255,.55);padding:1.6rem;transition:transform .25s,box-shadow .25s,opacity .7s}
.card::before{content:"+";position:absolute;top:-.85rem;left:-.5rem;font:700 1rem 'JetBrains Mono';color:var(--indigo)}
.card:hover{transform:translate(-5px,-5px);box-shadow:7px 7px 0 var(--indigo)}.fig{color:var(--indigo)}.card p{margin-bottom:1rem}
.note{font:700 1.5rem 'Caveat',cursive;color:var(--indigo)}
.draw svg{width:100%;height:auto}.draw svg *{stroke-dasharray:1400;stroke-dashoffset:1400;animation:d 2.6s .3s ease forwards}
.draw text{stroke:none;stroke-dasharray:none;stroke-dashoffset:0;animation:none;font:700 26px 'Caveat';fill:#4F46E5}
@keyframes d{to{stroke-dashoffset:0}}
.marq{overflow:hidden;border-block:1.5px solid var(--ink);padding:1rem 0;background:rgba(255,255,255,.4)}
.marq div{display:flex;gap:3rem;width:max-content;animation:m 28s linear infinite;font:600 1rem 'JetBrains Mono'}@keyframes m{to{transform:translateX(-50%)}}
.rv{opacity:0;transform:translateY(26px);transition:opacity .7s,transform .7s;transition-delay:calc(var(--i,0)*100ms)}.rv.in{opacity:1;transform:none}
ul.clean{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:.6rem}ul.clean li{border:1.5px solid var(--ink);padding:.3rem .8rem;font:500 .85rem 'JetBrains Mono'}
footer{border-top:1.5px solid var(--ink);padding:2rem 1.4rem;text-align:center;font-size:.9rem}
@media(max-width:760px){.hero{grid-template-columns:1fr;min-height:auto}.nav-toggle{display:block}nav{display:none;position:absolute;top:100%;left:0;right:0;flex-direction:column;background:var(--paper);padding:1rem 1.4rem;border-bottom:1.5px solid var(--ink)}nav.open{display:flex}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.rv{opacity:1;transform:none}.draw svg *{stroke-dashoffset:0}}