*{box-sizing:border-box}
:root{--ink:#242e29;--paper:#f6f5ef;--muted:#58675d;--line:#d5dbcf;--accent:#285e47;--panel:#e9ede3;--ui-accent:var(--accent);--ui-muted:var(--muted);--ui-border:var(--line)}
body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.65 system-ui,sans-serif}
a{color:inherit;text-underline-offset:5px}a:hover{color:var(--accent)}
:focus-visible{outline:3px solid var(--accent);outline-offset:5px}
header,main,footer{width:min(1240px,calc(100% - 96px));margin:auto}
header{display:flex;justify-content:space-between;align-items:center;padding:30px 0;border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:14px;text-decoration:none;font-size:16px;line-height:1.15;letter-spacing:-.02em}
.brand strong{font-size:12px;font-weight:450;letter-spacing:.01em}
.stamp{width:43px;height:43px;display:grid;place-items:center;background:var(--ink);color:var(--paper);font:600 25px/1 ui-monospace,monospace;border-radius:50%}
header nav{display:flex;gap:34px;font-size:13px;font-weight:550}header nav a{text-decoration:none}
main{padding:84px 0 100px;min-height:65vh}
footer{padding:25px 0 40px;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:16px;font-size:12px;color:var(--muted)}
h1,h2,h3{font-weight:450;line-height:1.08;letter-spacing:-.045em;text-wrap:balance}
h1{font-size:clamp(42px,6.5vw,88px);margin:20px 0 28px}
h2{font-size:clamp(26px,3.3vw,43px)}h3{font-size:24px}
.label,.eyebrow{font:500 11px/1.6 ui-monospace,monospace;text-transform:uppercase;letter-spacing:.12em;color:var(--muted)}
.intro{font-size:clamp(18px,2vw,22px);max-width:44ch;color:var(--muted);line-height:1.6}
.reading{max-width:760px;margin:auto}.reading.index-page{max-width:none;min-height:390px;position:relative;padding:28px 32% 30px 0}
.index-page:after{content:"";position:absolute;right:2%;top:38px;width:23%;aspect-ratio:1;background:repeating-linear-gradient(135deg,transparent 0 14px,var(--line) 14px 15px);border-radius:50%;border:1px solid var(--line);pointer-events:none}
.index-page h1{max-width:12ch}
.prose{font:19px/1.85 Georgia,serif;margin-top:38px}
.prose h2{font-family:system-ui,sans-serif;font-size:30px;margin-top:2em}
.prose p,.feature p,.intro{overflow-wrap:anywhere}.prose a{overflow-wrap:anywhere}
.prose img{max-width:100%;height:auto}.prose figure{margin:32px 0}
.prose blockquote{border-left:2px solid var(--accent);margin:32px 0;padding-left:24px;color:var(--muted)}
.button{display:inline-block;background:var(--accent);color:#fff;text-decoration:none;border:0;border-radius:4px;padding:14px 24px;font:550 14px/1.5 system-ui,sans-serif;cursor:pointer}.button:hover{background:var(--ink);color:var(--paper)}
.feature{border-top:1px solid var(--line);padding:32px 0;max-width:900px;margin-left:auto}.feature h2{margin:0 0 14px;max-width:25ch}.feature h2 a{text-decoration:none}.feature h2 a:hover{text-decoration:underline}.feature p{color:var(--muted);max-width:65ch}
.skip{position:absolute;left:-100vw}.skip:focus{left:16px;top:16px;background:var(--paper);padding:12px;z-index:10}
.cms{--paper:#f2f4f0}
.cms header{padding-block:24px}.cms main{padding-block:44px}.cms footer{font-size:12px}
.sign-in{position:relative;max-width:1050px;margin:30px auto 45px;min-height:470px;padding:50px 44% 50px 0}
.sign-in:after{content:"";position:absolute;right:0;top:0;width:34%;height:100%;border:1px solid #c5d1c4;border-radius:120px 120px 4px 4px;background:repeating-linear-gradient(0deg,transparent 0 25px,#c5d1c4 25px 26px),linear-gradient(135deg,#d9e5d6,#edf0e6)}
.sign-in h1{font-size:clamp(42px,5.6vw,76px);max-width:13ch}.sign-in .intro{font-size:17px}.sign-in .button{margin:18px 0 0}.sign-in-note{font-size:12px;color:var(--muted)}
.cms h1{font-size:clamp(32px,4vw,54px)}
html[data-style="ink"]{--paper:#1d2925;--ink:#f1efe3;--muted:#b5c4b9;--line:#425449;--accent:#acd2b3;--panel:#283c30}
html[data-style="ink"] .button{color:#1d2925}
html[data-style="studio"]{--paper:#f9eee7;--ink:#3d2831;--muted:#73545f;--line:#dac3bf;--accent:#8b3544;--panel:#f4ddd1}
@media(max-width:760px){header,main,footer{width:calc(100% - 40px)}header{padding:22px 0;gap:22px;flex-wrap:wrap}header nav{gap:22px}main{padding:44px 0 65px}.reading.index-page{padding:0;min-height:310px}.index-page:after{display:none}.sign-in{padding:12px 0;min-height:0}.sign-in:after{display:none}.sign-in h1{font-size:48px}.cms main{padding-block:28px}footer{flex-wrap:wrap}.prose{font-size:18px}.feature{padding:26px 0}}