:root{
  --ink:#10291f;--ink-2:#34493f;--muted:#5d6f66;--paper:#f6f1e6;--paper-2:#efe7d6;--white:#fffdf8;
  --line:#10291f;--hair:#d8cfbb;--mark:#d9f36b;--mark-2:#f4d35e;--red:#b33a2b;--red-soft:#f7dcd5;--blue:#2c4a8a;--blue-soft:#dbe3f3;--green-soft:#dcebd2;
  --serif:"Iowan Old Style","Palatino Linotype",Palatino,"Book Antiqua",Georgia,"Times New Roman",serif;
  --sans:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;font-family:var(--sans);color:var(--ink);background:var(--paper);line-height:1.6;font-size:17px;-webkit-font-smoothing:antialiased}
img,svg{max-width:100%;display:block}
a{color:var(--ink);text-decoration-color:var(--red);text-decoration-thickness:2px;text-underline-offset:3px}
a:hover{background:var(--mark)}
:focus-visible{outline:3px solid var(--red);outline-offset:2px}
.skip{position:absolute;left:-999px;top:8px;background:var(--ink);color:#fff;padding:8px 14px;z-index:10}
.skip:focus{left:8px}
.wrap{max-width:1180px;margin:0 auto;padding:0 28px}
.narrow{max-width:780px}
h1,h2,h3{font-family:var(--serif);font-weight:700;line-height:1.08;letter-spacing:-.01em;margin:0 0 .5em;text-wrap:balance}
h1{font-size:clamp(2.6rem,6.4vw,5rem)}
h2{font-size:clamp(2rem,4vw,3.1rem)}
h3{font-size:1.35rem}
p{margin:0 0 1em}
.hl{background:linear-gradient(transparent 58%,var(--mark) 58%,var(--mark) 92%,transparent 92%);padding:0 .08em}
.kicker{font-family:var(--mono);font-size:.8rem;letter-spacing:.04em;text-transform:uppercase;color:var(--red);margin:0 0 1rem;display:block}
.lead{font-size:1.2rem;color:var(--ink-2);max-width:38em}
.muted{color:var(--muted)}
.small{font-size:.86rem}
/* header */
.site-header{border-bottom:2px solid var(--line);background:var(--paper)}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;height:68px;gap:16px}
.brand{display:flex;align-items:center;gap:10px;font-family:var(--serif);font-weight:700;color:var(--ink);text-decoration:none;font-size:1.35rem}
.brand:hover{background:none}
.brand img{width:30px;height:30px}
.nav{display:flex;gap:26px;align-items:center}
.nav a{color:var(--ink);text-decoration:none;font-size:.95rem}
.nav a:hover{background:var(--mark)}
@media (max-width:860px){.nav a:not(.btn){display:none}}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;background:var(--mark);color:var(--ink);text-decoration:none;font-weight:700;border:2px solid var(--line);border-radius:0;padding:12px 22px;font-size:1rem;cursor:pointer;font-family:var(--sans);box-shadow:4px 4px 0 var(--line);transition:transform .1s,box-shadow .1s}
.btn:hover{background:var(--mark);transform:translate(2px,2px);box-shadow:2px 2px 0 var(--line)}
.btn:active{transform:translate(4px,4px);box-shadow:0 0 0 var(--line)}
.btn-sm{padding:7px 14px;font-size:.88rem;box-shadow:3px 3px 0 var(--line)}
.btn-text{font-weight:700;text-decoration:underline;text-decoration-color:var(--red);text-decoration-thickness:2px;text-underline-offset:5px;color:var(--ink)}
.btn[disabled]{opacity:.6;cursor:wait}
/* hero */
.hero{padding:76px 0 40px;text-align:center}
.hero h1{max-width:15em;margin:0 auto .45em}
.hero .lead{margin:0 auto 34px}
.hero-actions{display:flex;justify-content:center;align-items:center;gap:28px;flex-wrap:wrap}
.hero-note{font-family:var(--mono);font-size:.8rem;color:var(--muted);margin-top:30px}
.hero-note span{display:inline-block;margin:0 10px}
@media (max-width:700px){.hero{padding:48px 0 24px}.hero-note span{display:block;margin:4px 0}}
/* annotated sample */
.sample{padding:40px 0 88px}
.sample-frame{border:2px solid var(--line);background:var(--white);box-shadow:10px 10px 0 var(--paper-2)}
.sample-top{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;border-bottom:2px solid var(--line);padding:12px 18px;font-family:var(--mono);font-size:.8rem}
.sample-top .q{display:flex;gap:18px;flex-wrap:wrap}
.sample-top b{color:var(--muted);font-weight:400}
.stamp{border:2px solid var(--red);color:var(--red);font-weight:700;text-transform:uppercase;letter-spacing:.06em;padding:2px 8px;transform:rotate(-2deg);display:inline-block;font-size:.75rem}
.sample-grid{display:grid;grid-template-columns:1.25fr 1fr}
@media (max-width:900px){.sample-grid{grid-template-columns:1fr}}
.page-copy{padding:30px 34px;border-right:2px dashed var(--hair);font-family:var(--serif);font-size:1.02rem;color:#2f3b35}
@media (max-width:900px){.page-copy{border-right:0;border-bottom:2px dashed var(--hair);padding:24px}}
.page-copy .crumb{font-family:var(--mono);font-size:.75rem;color:var(--muted);margin-bottom:10px}
.page-copy h3{font-size:1.7rem;margin-bottom:.4em}
.page-copy h4{font-family:var(--serif);font-size:1.15rem;margin:1.1em 0 .3em}
.page-copy p{margin:0 0 .8em}
.ref{display:inline-block;font-family:var(--mono);font-size:.7rem;font-weight:700;background:var(--ink);color:var(--paper);padding:0 5px;margin-left:4px;vertical-align:2px}
.page-copy del{color:var(--red);text-decoration-thickness:2px}
.mark-y{background:var(--mark-2)}
.mark-b{background:var(--blue-soft);border-bottom:2px solid var(--blue)}
.notes{padding:24px;display:flex;flex-direction:column;gap:16px;background:repeating-linear-gradient(var(--white),var(--white) 31px,#f1ebdd 32px)}
.note{border:2px solid var(--line);background:var(--white);padding:14px 16px;position:relative}
.note .n{position:absolute;top:-12px;left:-12px;background:var(--ink);color:var(--paper);font-family:var(--mono);font-size:.72rem;font-weight:700;padding:2px 6px}
.note .type{font-family:var(--mono);font-size:.72rem;text-transform:uppercase;letter-spacing:.06em;font-weight:700}
.t-miss{color:var(--red)}.t-link{color:var(--blue)}.t-edit{color:#4f6b12}
.note p{margin:.25em 0 .5em;font-weight:600}
.note .why{font-size:.84rem;color:var(--ink-2);border-top:1px dotted var(--hair);padding-top:6px;margin:0}
.note .why b{font-family:var(--mono);font-size:.7rem;text-transform:uppercase;color:var(--muted)}
.note .choices{display:flex;gap:6px;margin-top:10px;font-family:var(--mono);font-size:.72rem}
.note .choices span{border:1.5px solid var(--line);padding:1px 7px}
.note .choices span.on{background:var(--mark)}
.sample-caption{font-family:var(--mono);font-size:.78rem;color:var(--muted);margin-top:22px;text-align:center}
/* section basics */
section{padding:96px 0}
@media (max-width:700px){section{padding:64px 0}}
.rule{border-top:2px solid var(--line)}
.green{background:var(--ink);color:var(--paper)}
.green h2,.green h3{color:var(--paper)}.green .lead,.green p{color:#cfdcd2}.green .kicker{color:var(--mark)}
.green a{color:var(--paper)}
.head-split{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:end;margin-bottom:56px}
@media (max-width:900px){.head-split{grid-template-columns:1fr;gap:12px}}
.head-split h2{margin:0}.head-split .lead{margin:0}
/* marks list */
.marks{list-style:none;margin:0;padding:0;border-top:2px solid var(--line)}
.marks li{display:grid;grid-template-columns:90px 1fr 1.1fr;gap:32px;padding:34px 0;border-bottom:2px solid var(--line);align-items:start}
@media (max-width:860px){.marks li{grid-template-columns:1fr;gap:10px}}
.marks .num{font-family:var(--serif);font-size:3.2rem;line-height:1;font-weight:700}
.marks h3{font-size:1.7rem;margin-bottom:.3em}
.marks .examples{font-family:var(--mono);font-size:.85rem;color:var(--ink-2);margin:0;padding:0;list-style:none}
.marks .examples li{display:block;border:0;padding:0 0 6px 18px;position:relative}
.marks .examples li::before{content:"→";position:absolute;left:0;color:var(--red)}
.swatch{display:inline-block;padding:0 6px;font-family:var(--mono);font-size:.78rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;margin-bottom:10px}
.s-miss{background:var(--red-soft);color:var(--red)}.s-link{background:var(--blue-soft);color:var(--blue)}.s-edit{background:var(--green-soft);color:#3e5510}
/* timeline */
.timeline{list-style:none;padding:0;margin:0;position:relative;max-width:820px}
.timeline::before{content:"";position:absolute;left:21px;top:8px;bottom:8px;border-left:2px dashed #6c8a7a}
.timeline li{position:relative;padding:0 0 38px 76px}
.timeline li:last-child{padding-bottom:0}
.timeline .dot{position:absolute;left:0;top:0;width:44px;height:44px;display:grid;place-items:center;background:var(--mark);color:var(--ink);font-family:var(--mono);font-weight:700;border:2px solid var(--paper)}
.timeline h3{font-size:1.45rem;margin-bottom:.2em}
.timeline p{margin:0;max-width:36em}
/* principles */
.principles{display:grid;grid-template-columns:repeat(2,1fr);gap:0;border:2px solid var(--line);background:var(--white)}
.principles > div{padding:30px;border-bottom:2px solid var(--line)}
.principles > div:nth-child(odd){border-right:2px solid var(--line)}
.principles > div:nth-last-child(-n+2){border-bottom:0}
@media (max-width:760px){.principles{grid-template-columns:1fr}.principles > div{border-right:0!important;border-bottom:2px solid var(--line)!important}.principles > div:last-child{border-bottom:0!important}}
.principles h3{font-size:1.3rem}
.principles p{margin:0;color:var(--ink-2)}
/* pen */
.pen{display:grid;grid-template-columns:1.2fr 1fr;gap:64px;align-items:center}
@media (max-width:900px){.pen{grid-template-columns:1fr;gap:36px}}
.pull{font-family:var(--serif);font-size:clamp(1.8rem,3.4vw,2.6rem);line-height:1.2;margin:0 0 24px;font-style:italic}
.decisions{border:2px solid var(--line);background:var(--white)}
.decisions div{display:grid;grid-template-columns:110px 1fr;border-bottom:2px solid var(--line)}
.decisions div:last-child{border-bottom:0}
.decisions dt{font-family:var(--mono);font-weight:700;text-transform:uppercase;font-size:.8rem;padding:16px;border-right:2px solid var(--line)}
.decisions dd{margin:0;padding:16px;color:var(--ink-2)}
.d-keep{background:var(--mark)}.d-edit{background:var(--mark-2)}.d-drop{background:var(--red-soft);color:var(--red)}
/* about */
.about{display:grid;grid-template-columns:1fr 1fr;gap:64px}
@media (max-width:900px){.about{grid-template-columns:1fr;gap:28px}}
.about dl{margin:0;border-top:2px solid var(--line)}
.about dl div{padding:16px 0;border-bottom:1px solid var(--hair);display:grid;grid-template-columns:160px 1fr;gap:16px}
@media (max-width:560px){.about dl div{grid-template-columns:1fr;gap:2px}}
.about dt{font-family:var(--mono);font-size:.8rem;text-transform:uppercase;color:var(--muted);padding-top:3px}
.about dd{margin:0}
/* waitlist */
.waitlist{background:var(--mark);border-top:2px solid var(--line);border-bottom:2px solid var(--line)}
.wl{display:grid;grid-template-columns:.9fr 1.1fr;gap:56px;align-items:start}
@media (max-width:900px){.wl{grid-template-columns:1fr;gap:28px}}
.wl .lead{color:var(--ink)}
.promise{list-style:none;padding:0;margin:20px 0 0;font-family:var(--mono);font-size:.9rem}
.promise li{padding:6px 0;border-bottom:1px solid rgba(16,41,31,.25)}
.promise li::before{content:"✓ ";font-weight:700}
.form-card{background:var(--white);border:2px solid var(--line);padding:30px;box-shadow:10px 10px 0 var(--line)}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
@media (max-width:600px){.form-grid{grid-template-columns:1fr}.form-card{padding:20px;box-shadow:6px 6px 0 var(--line)}}
.field{display:flex;flex-direction:column;gap:6px}
.field.full{grid-column:1/-1}
label{font-weight:700;font-size:.92rem}
.opt{font-weight:400;color:var(--muted);font-size:.84rem}
input[type=email],input[type=text],select{font:inherit;font-size:1rem;padding:11px 12px;border:2px solid var(--line);border-radius:0;background:#fff;color:var(--ink);width:100%}
input:focus,select:focus{outline:none;box-shadow:4px 4px 0 var(--mark-2)}
input[aria-invalid=true]{border-color:var(--red)}
.consent{display:flex;gap:10px;align-items:flex-start;font-weight:400;font-size:.92rem;color:var(--ink-2)}
.consent input{margin-top:4px;width:18px;height:18px;flex:none;accent-color:var(--ink)}
.hp{position:absolute!important;left:-10000px;width:1px;height:1px;overflow:hidden}
.form-actions{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-top:10px}
.form-msg{padding:12px 14px;font-size:.95rem;margin-top:18px;border:2px solid var(--line)}
.form-msg[hidden]{display:none}
.form-msg.ok{background:var(--green-soft)}
.form-msg.err{background:var(--red-soft);color:#7a2015;border-color:var(--red)}
.field-err{color:var(--red)}
/* faq */
.faq{display:grid;grid-template-columns:repeat(2,1fr);gap:0 56px}
@media (max-width:800px){.faq{grid-template-columns:1fr}}
.faq div{border-top:2px solid var(--line);padding:22px 0 18px}
.faq dt{font-family:var(--serif);font-weight:700;font-size:1.25rem;margin-bottom:8px}
.faq dd{margin:0;color:var(--ink-2)}
/* footer */
.site-footer{background:var(--ink);color:#bfcdc4;padding:56px 0 30px;font-size:.92rem}
.site-footer a{color:var(--paper)}
.site-footer a:hover{background:none;color:var(--mark)}
.foot-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:36px}
@media (max-width:760px){.foot-grid{grid-template-columns:1fr}}
.site-footer h2{font-family:var(--mono);font-size:.78rem;text-transform:uppercase;letter-spacing:.08em;color:var(--mark);margin-bottom:12px}
.site-footer ul{list-style:none;padding:0;margin:0}.site-footer li{margin-bottom:6px}
.site-footer .brand{color:var(--paper)}
.foot-about{margin-top:14px}
.foot-bottom{border-top:1px solid #2c4a3d;margin-top:36px;padding-top:20px;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:.84rem}
/* legal */
.legal{padding:56px 0 88px}
.legal h1{font-size:clamp(2.2rem,4.4vw,3.2rem)}
.legal h2{font-size:1.5rem;margin-top:1.8em}
.legal table{border-collapse:collapse;width:100%;margin:1em 0;font-size:.95rem;border:2px solid var(--line)}
.legal th,.legal td{border:1px solid var(--hair);padding:10px 12px;text-align:left;vertical-align:top;background:var(--white)}
.legal th{width:34%;background:var(--paper-2);font-weight:600}
.legal li{margin-bottom:.4em}
.notfound{padding:120px 0;text-align:center}
.notfound .code{font-family:var(--serif);font-size:6rem;font-weight:700;line-height:1;margin:0 0 10px}
.notfound .lead{margin:0 auto 30px}
.sample-fig{margin:0}
.kicker-ink{color:var(--ink)}
h2.kicker{font-family:var(--mono);font-size:.8rem;font-weight:400;text-align:center;margin-bottom:1.4rem}
.site-footer .brand img{outline:1px solid #4d6b5c}
@media (min-width:901px){
  .timeline{display:grid;grid-template-columns:1fr 1fr;gap:40px 56px;max-width:none}
  .timeline::before{display:none}
  .timeline li{padding:0 0 0 68px}
}