@font-face{font-family:Plex;src:url(fonts/PlexSans.ttf)}@font-face{font-family:STIX;src:url(fonts/STIX.ttf)}@font-face{font-family:Mono;src:url(fonts/PlexMono.ttf)}:root{--bg:#f3f3e9;--panel:#fafcf8;--ink:#203c33;--line:#8c9b91;--accent:#b45a35}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font-family:Plex,Arial,sans-serif}button,input,a{ -webkit-tap-highlight-color:transparent}button,a{color:inherit}button{font:inherit;cursor:pointer;border:1px solid var(--line);background:transparent;padding:11px 15px;border-radius:3px}button:hover,a:hover{background:#e4e9de}button:disabled{opacity:.5;cursor:not-allowed}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid var(--accent);outline-offset:3px}a{text-decoration:none}header,main,footer{max-width:1500px;margin:auto}header{height:98px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);padding:0 4%}.brand{display:flex;align-items:center;gap:12px;font-size:25px;font-weight:600;letter-spacing:-1px}.brand img{width:38px}.brand span{font:11px Mono;margin-left:12px}nav{display:flex;gap:30px;font-size:13px}.quiet{border:0;font-size:12px}main{padding:0 4%}.hero{display:grid;grid-template-columns:1.15fr 1fr;align-items:center;min-height:365px;border-bottom:1px solid var(--line)}.eyebrow,.tag{font:10px Mono,monospace;letter-spacing:1.4px}.hero h1{font:56px/1.02 STIX,Georgia,serif;margin:22px 0;letter-spacing:-1.8px}h1 em{font-weight:400}.lede{font-size:15px;line-height:1.7}.hero-drawing{position:relative;min-height:290px;display:grid;place-content:center}.hero-drawing img{width:195px}.note{position:absolute;font:10px Mono;border:1px solid var(--line);padding:13px 16px;background:var(--panel)}.n1{top:40px;left:20px;transform:rotate(-8deg)}.n2{top:18px;right:30px;transform:rotate(6deg)}.n3{bottom:45px;right:0;transform:rotate(-5deg)}.draw-label{font:11px Mono;text-align:center}.section-top{display:flex;align-items:center;justify-content:space-between;padding:29px 0 20px}h2{font:32px/1.13 STIX;margin:0}h3{font:23px STIX;margin:0 0 10px}.tag{font-size:9px;border:1px solid var(--line);padding:7px;letter-spacing:.6px}.workspace{border:1px solid var(--line);display:grid;grid-template-columns:235px 1fr 255px;background:var(--panel)}aside{padding:23px 19px}aside .eyebrow{font-size:9px;letter-spacing:.6px}.template{width:100%;text-align:left;position:relative;padding:18px 10px 18px 33px;border:0;border-bottom:1px solid #c9d0c7;border-radius:0}.template span{position:absolute;left:8px}.template strong{font-size:13px;font-weight:500;display:block}.template small{display:block;font-size:10px;margin-top:6px}.template.active{background:#e6ecdf;border-left:3px solid var(--ink)}.aside-foot{font-size:11px;line-height:1.8;margin-top:90px}.compose{border-left:1px solid var(--line);border-right:1px solid var(--line);padding:22px}.compose-title{display:flex;justify-content:space-between;align-items:center}.compose-title>span{font:10px Mono}.fields{display:grid;grid-template-columns:1fr 110px;gap:12px}label{display:block;font-size:11px;margin:10px 0}input:not([type=checkbox]){display:block;width:100%;border:1px solid var(--line);border-radius:2px;background:var(--bg);font:12px Plex;color:var(--ink);padding:10px;margin-top:7px}#recipient{font:10px Mono}#steps{margin-top:22px}.step{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid #d4dbd1}.step-number{font:11px Mono;border:1px solid var(--line);padding:8px}.step div{flex:1}.step strong{font-size:12px;font-weight:500}.step small{display:block;font-size:10px;margin-top:4px}.step button{padding:5px 8px;font-size:12px}.permission{display:flex;align-items:center;gap:7px;margin:18px 0}.permission input{accent-color:var(--ink)}.permission small{display:block;font-size:10px;margin-top:3px}.compose-actions{display:flex;flex-wrap:wrap;gap:7px}.compose-actions button{font-size:11px}.primary{background:var(--ink);color:var(--panel);border-color:var(--ink)}.primary:hover{background:#345a49}.primary span{margin-left:20px}#message{font-size:11px;min-height:14px}.review{display:flex;flex-direction:column;background:#edf0e6}.review p{font-size:12px;line-height:1.6}#receipt{flex:1}.receipt-icon{display:block;font-size:56px;font-weight:200;margin-top:25px}.review h3{font-size:29px}.review button{font-size:11px;width:100%;margin-top:22px}.local-note{font-size:10px;line-height:1.5;margin-top:13px}.check{border-bottom:1px solid var(--line);padding:12px 0;font-size:11px}.check strong{display:block;margin-bottom:5px}.result-title{margin-top:22px!important}.principles{padding:65px 0;display:grid;grid-template-columns:1.2fr 1fr 1fr 1fr;gap:32px;border-bottom:1px solid var(--line)}.principles h2{font-size:31px}.principles article span{font:11px Mono;color:var(--ink)}.principles article h3{font-size:22px;margin-top:20px}.principles p:not(.eyebrow){font-size:12px;line-height:1.75}.closing{min-height:245px;display:flex;align-items:center;justify-content:space-between}.closing img{width:85px}.closing h2{font-size:41px}.closing a{font-size:13px;border-bottom:1px solid;padding:12px 0}footer{padding:28px 4%;border-top:1px solid var(--line);display:flex;justify-content:space-between;font-size:10px;gap:20px}dialog{max-width:470px;width:90%;background:var(--bg);color:var(--ink);border:1px solid;padding:35px}dialog::backdrop{background:#203c3380}dialog h2{font-size:65px}dialog p{font-size:14px;line-height:1.7}#close{position:absolute;right:15px;top:10px;border:0;font-size:25px}[hidden]{display:none!important}#intro{position:fixed;inset:0;z-index:20;background:var(--bg);display:grid;place-items:center}#skip{position:absolute;top:30px;right:4%}.intro-stage{width:600px;height:350px;position:relative;text-align:center}.slip{position:absolute;top:80px;width:150px;padding:24px 15px;border:1px solid var(--ink);background:var(--panel);font:13px Mono;animation:pack 8s both}.slip.a{left:0;--x:225px;transform:rotate(-8deg)}.slip.b{left:225px;--x:0px;animation-delay:.4s}.slip.c{left:450px;--x:-225px;animation-delay:.8s}.intro-line{position:absolute;top:110px;left:75px;right:75px;height:1px;background:var(--ink);transform-origin:left;animation:line 6s both}.intro-mark{position:absolute;width:180px;left:210px;top:15px;animation:mark 9s both}.intro-stage h1{position:absolute;top:190px;width:100%;font:52px STIX;animation:reveal 9s both}.intro-stage p{position:absolute;top:290px;width:100%;font:12px Mono;animation:reveal 9s both}.intro-caption{position:absolute;bottom:40px;font:10px Mono}.nojs{padding:20px}@keyframes pack{0%{opacity:0}15%,55%{opacity:1}80%,100%{transform:translateX(var(--x)) scale(.3);opacity:0}}@keyframes line{0%,25%{transform:scaleX(0)}50%,75%{transform:scaleX(1)}100%{opacity:0}}@keyframes mark{0%,65%{opacity:0;transform:scale(.6)}85%,100%{opacity:1;transform:scale(1)}}@keyframes reveal{0%,80%{opacity:0;transform:translateY(15px)}100%{opacity:1;transform:translateY(0)}}@media(min-width:1600px){.hero{min-height:410px}}@media(max-width:1050px){.workspace{grid-template-columns:190px 1fr}.review{grid-column:1/-1;border-top:1px solid var(--line);display:block}.review button{width:auto}.receipt-icon{display:none}.review h3{font-size:24px}.local-note{display:block}.aside-foot{margin-top:35px}.principles{grid-template-columns:1fr 1fr}.hero h1{font-size:49px}}@media(max-width:650px){header{height:77px}.brand{font-size:21px}.brand span,nav{display:none}.hero{grid-template-columns:1fr;padding-top:20px}.hero h1{font-size:46px}.hero-drawing{min-height:225px}.hero-drawing img{width:145px}.n1{left:5px;top:22px}.n2{right:0;top:0}.n3{bottom:30px}.section-top{display:block}.section-top .tag{display:inline-block;margin-top:13px}.workspace{display:block}aside{padding:16px}.template{display:inline-block;width:100%;padding:12px 12px 12px 35px}.aside-foot{display:none}.compose{border:0;border-top:1px solid var(--line);padding:17px}.fields{grid-template-columns:1fr 90px}.principles{gap:25px;padding:40px 0}.principles>div{grid-column:1/-1}.principles article:last-child{grid-column:1/-1}.closing{gap:15px;flex-wrap:wrap;padding:30px 0}.closing h2{font-size:30px}.closing img{width:58px}.closing a{margin-left:auto}footer{flex-wrap:wrap}.intro-stage{transform:scale(.55)}.intro-caption{max-width:260px;text-align:center;line-height:1.6}}@media(prefers-reduced-motion:reduce){*{animation:none!important;scroll-behavior:auto!important}}