@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Libre+Caslon+Display&display=swap');
:root{--paper:#f5f3ec;--ink:#25392f;--quiet:#58665c;--line:#cdd3c8;--accent:#d1deab;--panel:#e8ece1;--white:#fffef9;--serif:'Libre Caslon Display',Georgia,serif;--sans:'DM Sans',Arial,sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.65 var(--sans);-webkit-font-smoothing:antialiased}a{color:inherit;text-underline-offset:4px}a:hover{color:#4a643a}button,input,select,textarea{font:inherit}button,a,input,select,textarea{outline-offset:5px}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid #416326}button{cursor:pointer}.wrap{width:min(1240px,calc(100% - 96px));margin:auto}.skip{position:absolute;top:-80px;left:20px;background:var(--ink);color:white;padding:10px;z-index:5}.skip:focus{top:12px}.site-header{display:flex;align-items:center;justify-content:space-between;padding:28px 0;border-bottom:1px solid var(--line);gap:24px}.brand{font-family:var(--serif);font-size:32px;letter-spacing:-1.5px;text-decoration:none;line-height:1}.brand span{font-family:var(--sans);font-size:10px;letter-spacing:1px;display:block;margin-top:9px}.nav{display:flex;align-items:center;gap:30px;font-size:13px}.nav a{text-decoration:none}.nav a[aria-current=page]{border-bottom:1px solid var(--ink)}.nav .contact-link{padding:10px 18px;border:1px solid var(--ink);border-radius:4px}.eyebrow{font-size:11px;letter-spacing:1.7px;text-transform:uppercase;font-weight:600;display:flex;align-items:center;gap:10px}.dot{width:6px;height:6px;border-radius:50%;background:#698845;display:inline-block}.hero{display:grid;grid-template-columns:1.08fr 1fr;gap:80px;align-items:center;padding:85px 0 90px}.hero h1{font:clamp(56px,6.2vw,88px)/1.02 var(--serif);letter-spacing:-2.5px;margin:25px 0 25px;text-wrap:balance}.hero h1 em{font-weight:400;color:#637b52}.hero .intro{max-width:430px;color:var(--quiet);font-size:17px}.button{display:inline-flex;gap:25px;align-items:center;text-decoration:none;background:var(--ink);border:1px solid var(--ink);color:var(--white);padding:13px 20px;border-radius:4px;font-size:13px;transition:background .2s,transform .2s}.button:hover{color:white;background:#425b47;transform:translateY(-2px)}.button:active{transform:translateY(1px)}.button.light{color:var(--ink);background:transparent}.hero-actions{display:flex;align-items:center;gap:25px;margin-top:30px}.text-link{font-size:13px;text-decoration:none;border-bottom:1px solid var(--ink)}.bench{position:relative;padding:30px;background:#e5e9dd;border:1px solid #d6ddca;border-radius:6px;transform:rotate(1deg);box-shadow:8px 14px 0 #eae9e1}.bench-head{display:flex;justify-content:space-between;align-items:center;font-size:10px;letter-spacing:1px;margin-bottom:25px}.bench-head .live{display:flex;gap:7px;align-items:center}.paper{background:var(--white);border:1px solid #d7ddce;border-radius:4px;padding:25px;transform:rotate(-1deg);box-shadow:0 8px 20px #25392f0a}.paper h2{font:30px/1.1 var(--serif);margin:0 0 20px;letter-spacing:-.5px}.mini-label{font:10px/1.5 var(--sans);letter-spacing:1px;text-transform:uppercase;color:var(--quiet)}.sample-line{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line);padding:13px 0;gap:10px;font-size:12px}.sample-line code{font-size:11px}.tag{background:#e7edda;color:#425b30;padding:3px 7px;border-radius:3px;font-size:10px;white-space:nowrap}.tag.review{background:#f2ebdb;color:#725d35}.sample-total{border-top:1px solid var(--ink);padding-top:18px;display:flex;justify-content:space-between;align-items:end}.sample-total strong{font:37px/1 var(--serif)}.bench-note{font:italic 16px/1.5 var(--serif);margin:24px 0 0;color:#58654d}.ribbon{padding:22px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;justify-content:space-between;gap:25px;font-size:12px;color:var(--quiet)}.ribbon strong{color:var(--ink);font-weight:500}.section{padding:85px 0}.section-heading{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:35px}.section-heading h2,.large-title{font:clamp(40px,4vw,58px)/1.05 var(--serif);letter-spacing:-1px;margin:12px 0}.section-heading p{max-width:330px;margin:0;color:var(--quiet);font-size:14px}.work-grid{display:grid;grid-template-columns:1.15fr 1fr;gap:30px}.project{color:inherit;text-decoration:none;display:block}.project-visual{min-height:270px;padding:30px;background:var(--panel);border:1px solid #d7ddce;border-radius:5px;transition:transform .25s,box-shadow .25s}.project:hover .project-visual{transform:translateY(-4px);box-shadow:0 9px 22px #25392f0b}.project:nth-child(2) .project-visual{background:#ede6dc}.project-topline{display:flex;justify-content:space-between;font-size:10px;text-transform:uppercase;letter-spacing:1px;margin-bottom:20px}.code-fragment{background:#fffdf7;padding:20px;border-radius:3px;font:12px/2 monospace;color:#697261;overflow:hidden;white-space:nowrap}.code-fragment .changed{display:block;background:#e6efd9;margin:3px -8px;padding:0 8px;color:#36542c}.project-meta{display:flex;justify-content:space-between;gap:15px;margin-top:20px}.project h3{font:30px/1.15 var(--serif);margin:5px 0 8px;letter-spacing:-.5px}.project p{font-size:14px;color:var(--quiet);max-width:480px;margin:0}.arrow-circle{border:1px solid var(--line);border-radius:50%;height:35px;width:35px;display:grid;place-items:center;flex-shrink:0}.studio-note{display:grid;grid-template-columns:.65fr 1.35fr;gap:80px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:65px 0}.studio-note h2{font:48px/1.12 var(--serif);letter-spacing:-1px;margin:0}.studio-note p{color:var(--quiet);max-width:580px}.studio-note .signature{font:italic 28px var(--serif);color:var(--ink)}.process{display:grid;grid-template-columns:repeat(3,1fr);gap:45px}.step{border-top:1px solid var(--line);padding-top:20px}.step-number{font:italic 26px var(--serif);color:#738666}.step h3{font-size:17px;font-weight:500;margin:15px 0 8px}.step p{font-size:14px;color:var(--quiet);margin:0}.contact{display:flex;justify-content:space-between;align-items:center;gap:40px;padding:60px 0;border-top:1px solid var(--line)}.contact h2{font:46px/1.1 var(--serif);letter-spacing:-1px;margin:0 0 12px}.contact p{color:var(--quiet);font-size:14px;margin:0}.footer{padding:25px 0 30px;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:20px;font-size:11px;color:var(--quiet)}.footer a{text-decoration:none}.footer-nav{display:flex;gap:22px}.page-heading{padding:75px 0 50px;max-width:780px}.page-heading h1{font:clamp(48px,6vw,76px)/1.05 var(--serif);letter-spacing:-2px;margin:20px 0}.page-heading p{max-width:610px;color:var(--quiet);font-size:17px}.article-grid{display:grid;grid-template-columns:250px 1fr;gap:80px;padding:15px 0 80px}.article-grid aside{font-size:12px;color:var(--quiet)}.article-grid aside p{border-top:1px solid var(--line);padding-top:16px}.prose{max-width:720px}.prose h2{font:36px/1.2 var(--serif);margin:32px 0 15px}.prose h2:first-child{margin-top:0}.prose p{color:var(--quiet)}.note-panel{background:var(--panel);padding:32px;border-radius:4px;margin:30px 0}.note-panel blockquote{font:30px/1.3 var(--serif);margin:10px 0}.note-panel p{font-size:13px}.notebook{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center;padding:50px;background:#e8ece1;border-radius:5px;margin-top:45px}.notebook h3{font:38px/1.1 var(--serif);margin:15px 0}.notebook p{font-size:14px;color:var(--quiet)}.equation{font:italic 30px/1.6 var(--serif);padding:30px;background:var(--white);border:1px solid var(--line);transform:rotate(-2deg);text-align:center}.equation small{display:block;font:12px var(--sans);margin-top:18px;color:var(--quiet)}.demo-layout{display:grid;grid-template-columns:1fr 1fr;gap:30px}.demo-panel{background:var(--white);border:1px solid var(--line);border-radius:5px;padding:30px}.demo-panel h2{font:30px var(--serif);margin:0 0 20px}.demo-fields{display:grid;grid-template-columns:1fr 1fr;gap:15px}.demo-fields label:first-child{grid-column:1/-1}label{display:block;font-size:12px;color:var(--quiet)}input,select,textarea{width:100%;margin:6px 0 15px;border:1px solid var(--line);padding:10px 12px;border-radius:3px;background:#fffef9;color:var(--ink)}textarea{font:12px/1.8 monospace;resize:vertical;min-height:260px}.demo-output{background:var(--panel)}.result-number{font:62px/1 var(--serif);margin:30px 0 10px}.result-detail{font-size:14px;color:var(--quiet)}.demo-caption{font-size:12px;color:var(--quiet);margin:16px 0}.download-row{display:flex;flex-wrap:wrap;gap:20px;margin:25px 0}.download-row a{font-size:13px}.tabs{display:flex;gap:8px;margin:15px 0}.tabs button{background:none;border:1px solid var(--line);border-radius:3px;padding:8px 15px;font-size:12px;color:var(--ink)}.tabs button[aria-pressed=true]{background:var(--ink);color:var(--white)}.finding-list{list-style:none;padding:0;margin:0}.finding-list li{padding:13px 0;border-bottom:1px solid var(--line);font-size:13px;display:flex;gap:12px}.finding-list .ok{color:#48663a}.finding-list .warn{color:#886639}.details{font-size:13px;color:var(--quiet);margin-top:35px}.details summary{cursor:pointer;padding:15px 0;border-top:1px solid var(--line)}.details pre{white-space:pre-wrap}.privacy{max-width:700px;padding-bottom:70px}.muted{color:var(--quiet)}.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
@media(max-width:1000px){.wrap{width:calc(100% - 56px)}.hero{gap:40px}.hero h1{font-size:64px}.bench{padding:22px}.paper{padding:20px}.article-grid{grid-template-columns:180px 1fr;gap:40px}.studio-note{gap:40px}.notebook{gap:25px;padding:30px}}
@media(max-width:700px){.wrap{width:calc(100% - 36px)}.site-header{padding:22px 0;gap:12px}.brand{font-size:29px}.brand span{font-size:8px}.nav{gap:16px;font-size:12px}.nav .contact-link{display:none}.hero{grid-template-columns:1fr;gap:45px;padding:48px 0 50px}.hero h1{font-size:62px;letter-spacing:-2px;max-width:430px}.hero .intro{font-size:16px}.bench{margin:0 4px;transform:rotate(.5deg)}.ribbon{flex-wrap:wrap;gap:10px 25px;font-size:11px}.section{padding:55px 0}.section-heading{align-items:start;flex-direction:column;gap:15px}.section-heading h2{font-size:44px}.work-grid,.studio-note,.process,.article-grid,.demo-layout,.notebook{grid-template-columns:1fr}.work-grid{gap:35px}.project-visual{min-height:245px}.studio-note{gap:20px;padding:45px 0}.studio-note h2{font-size:42px}.process{gap:25px}.contact{align-items:start;flex-direction:column;padding:45px 0;gap:25px}.contact h2{font-size:40px}.footer{font-size:10px;flex-direction:column}.page-heading{padding:45px 0 30px}.page-heading h1{font-size:58px}.article-grid{gap:25px}.article-grid aside{display:flex;gap:20px;flex-wrap:wrap}.notebook{padding:25px;gap:25px}.notebook h3{font-size:34px}.equation{font-size:25px}.demo-panel{padding:23px}.demo-fields{gap:12px}.hero-actions{gap:20px}.button{padding:12px 17px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;transform:none!important}}

/* Reproduction paths and readable sample inputs. */
.page-heading h1{text-wrap:balance}
.source-review{margin-top:60px;padding-top:45px;border-top:1px solid var(--line);max-width:820px}
.source-review h2{font:40px/1.15 var(--serif);letter-spacing:-.7px;margin:12px 0 20px}
.source-review>p{color:var(--quiet)}
.source-review .finding-list strong{min-width:115px;font-weight:500}
.source-review .download-row{align-items:center}
.sample-table{width:100%;border-collapse:collapse;font-size:14px;margin:20px 0}
.sample-table caption{text-align:left;color:var(--quiet);font-size:12px;padding-bottom:12px}
.sample-table th,.sample-table td{text-align:left;padding:13px 5px;border-bottom:1px solid var(--line)}
.sample-table thead th{font-size:11px;font-weight:500;text-transform:uppercase;letter-spacing:1px;color:var(--quiet)}
.sample-table tbody th{font-weight:400}
.run-code{font-size:13px;line-height:1.9;background:var(--panel);padding:20px;white-space:pre-wrap;overflow-wrap:anywhere;border-radius:4px}
.details pre{overflow-wrap:anywhere}
.hero-actions,.footer-nav,.bench-head{flex-wrap:wrap}
.bench-head{gap:10px}
.nav a{padding-block:8px}
@media(max-width:700px){.source-review{margin-top:40px;padding-top:30px}.source-review h2{font-size:34px}.source-review .finding-list strong{min-width:90px}.sample-table{font-size:13px}}