:root{--ink:#24221d;--muted:#57534a;--ochre:#e4b928;--pale:#faf4df;--edge:#d6d2c7;--focus:#725300;--font:"Trebuchet MS",Calibri,"Gill Sans",sans-serif;color-scheme:light}
*{box-sizing:border-box}
html{background:#fff;color:var(--ink);font-family:var(--font);font-size:18px;line-height:1.6;-webkit-text-size-adjust:100%}
body{margin:0}
body,button{font-family:var(--font)}
a{color:inherit;text-underline-offset:.2em;text-decoration-thickness:1.5px;overflow-wrap:anywhere}
a:hover{text-decoration-thickness:3px}
a:focus-visible,button:focus-visible{outline:3px solid var(--focus);outline-offset:4px}
button{font-size:1rem;color:var(--ink)}
[hidden]{display:none!important}
.wrap{width:min(100% - 36px,1200px);margin-inline:auto}
.skip{position:absolute;z-index:20;top:-100px;left:18px;padding:12px 20px;border-radius:24px;background:var(--ink);color:white}
.skip:focus{top:12px}
.mast{display:flex;justify-content:space-between;align-items:center;gap:18px;padding-block:25px 22px}
.name{display:flex;align-items:center;gap:12px;min-height:52px;text-decoration:none;font-size:18px;line-height:1.15}
.name strong{font-size:26px;letter-spacing:-.6px}
.stamp{width:33px;height:40px;background:var(--ochre);border-radius:9px 16px 9px 15px;transform:rotate(-8deg);position:relative;flex-shrink:0}
.stamp:after{content:"";position:absolute;width:23px;height:4px;left:6px;top:21px;border-radius:50%;background:var(--ink);transform:rotate(-12deg)}
.tag{display:none;font-size:17px;color:var(--muted)}
.tabs{display:flex;flex-wrap:wrap;gap:8px;padding-bottom:20px;border-bottom:2px solid var(--ink)}
.tabs a{display:flex;align-items:center;justify-content:center;flex:1 1 44%;min-height:48px;padding:9px 12px;text-align:center;text-decoration:none;border-radius:24px;background:#f3f2ee;font-size:16px;line-height:1.3;font-weight:700}
.tabs a:last-child{flex-grow:1}
.tabs a.sel,.tabs a:hover{background:var(--ochre)}
.tabs a[aria-current="page"]{box-shadow:inset 0 0 0 2px var(--ink)}
h1,h2,h3{line-height:1.15;margin:0;font-weight:700;text-wrap:balance}
h1{font-size:clamp(2.2rem,5.1vw,4.3rem);letter-spacing:-.055em;max-width:19ch}
h2{font-size:clamp(1.45rem,2.4vw,2rem);letter-spacing:-.025em;max-width:30ch}
h3{font-size:1.12rem;max-width:32ch}
p{margin:17px 0;max-width:67ch}
.hero{padding-top:34px;display:grid;gap:18px}
.kicker{font-size:17px;font-weight:700;margin:0 0 18px;color:var(--muted)}
.hero h1{position:relative;max-width:18ch}
.hero h1:after{content:"";display:block;width:56%;height:8px;background:var(--ochre);border-radius:60% 24% 65% 20%;transform:rotate(-2deg);margin-top:13px}
.deck{font-size:1.12rem;line-height:1.55;color:var(--muted);max-width:57ch;margin-block:23px}
.fact{border-left:6px solid var(--ochre);padding-left:18px;max-width:55ch;font-size:1rem}
.pill{display:inline-flex;gap:25px;align-items:center;justify-content:space-between;min-height:52px;background:var(--ochre);padding:12px 21px;border-radius:40px;font-size:18px;font-weight:700;text-decoration:none;margin-block:10px}
.pill span,.go span,.source-a span,.turn-a span{font-size:1.2em;flex-shrink:0}
.go{min-height:48px;display:inline-flex;align-items:center;justify-content:space-between;gap:18px;font-size:18px;font-weight:700;padding-block:9px}
.art{position:relative;min-width:0;margin:12px 0 34px;isolation:isolate}
.art img{display:block;width:100%;height:auto;aspect-ratio:10/7;object-fit:cover;border-radius:24px;position:relative;z-index:1;background:transparent;font-size:16px}
.art.home-art img{aspect-ratio:22/17}
.art figcaption{position:relative;z-index:1;font-size:16px;color:var(--muted);padding:14px 3px 0;max-width:52ch}
.cut{position:absolute;inset:0 0 46px;overflow:hidden;z-index:0;background:#f9f8f4;border-radius:24px}
.paper{position:absolute;left:15%;top:15%;width:65%;height:67%;background:white;transform:rotate(-9deg);border-radius:20px;box-shadow:5px 8px 0 #e5e2d8;clip-path:polygon(0 2%,98% 0,100% 96%,78% 100%,51% 97%,19% 100%,1% 98%)}
.ribbon{position:absolute;left:24%;top:8%;width:28%;height:77%;background:var(--ochre);transform:rotate(29deg);border-radius:24px 24px 50% 18px}
.arc{position:absolute;width:57%;height:49%;left:31%;top:35%;border:3px solid var(--ink);border-left-color:transparent;border-bottom-color:transparent;border-radius:50%;transform:rotate(-30deg)}
.art img.img-missing{visibility:hidden}
.route{margin-top:23px;border-radius:28px;background:var(--ochre);padding:28px 24px 18px;position:relative}
.route>h2{max-width:24ch;font-size:1.8rem}
.fork{margin-top:27px}
.branch{padding:23px 0;border-top:2px solid #8d6a14}
.branch h2{font-size:1.4rem}
.branch p{margin:14px 0 3px}
.read-grid{display:grid;gap:28px;margin-block:30px 55px}
.bit{padding-block:26px}
.bit h2:after{content:"";display:block;width:52px;height:6px;border-radius:50%;background:var(--ochre);transform:rotate(-3deg);margin-top:14px}
.words{align-self:start;background:var(--pale);border-radius:24px;padding:25px;font-size:18px}
.words h3{margin-top:21px}
.words p{margin-bottom:0}
.word-btn{background:white;border:2px solid var(--ink);min-height:48px;padding:9px 18px;border-radius:30px;font-weight:700;cursor:pointer}
.word-btn:disabled{cursor:default;border-style:dashed}
.intro{padding-block:14px 15px;max-width:960px}
.intro h1{font-size:clamp(2.15rem,4.7vw,3.9rem);max-width:23ch;margin-top:20px}
.crumb{display:flex;align-items:center;flex-wrap:wrap;gap:9px;font-size:16px;line-height:1.4;color:var(--muted);margin-bottom:7px}
.crumb-a{display:inline-flex;align-items:center;gap:8px;min-height:44px}
.crumb-a span{display:none}
.copy{max-width:760px;padding-bottom:48px;margin-inline:auto}
.copy .bit{border-bottom:1px solid var(--edge);padding-block:27px}
.copy .bit:last-child{border-bottom:0}
.copy .art{margin-block:35px}
.copy .words{margin-top:35px}
.source-a{min-height:48px;display:flex;align-items:center;justify-content:space-between;gap:20px;font-size:18px;font-weight:700;padding:10px 0;margin-block:5px}
.source-copy .bit{scroll-margin-top:20px}
.turn{border-radius:24px;background:var(--pale);padding:22px 25px;margin:15px auto 54px;max-width:760px}
.turn>span{display:block;color:var(--muted);font-size:16px}
.turn-a{display:flex;align-items:center;justify-content:space-between;min-height:52px;gap:20px;font-weight:700;font-size:20px}
.foot{border-top:2px solid var(--ink);padding-block:23px 35px;display:grid;gap:5px;font-size:16px}
.foot p{margin:0;max-width:65ch}
.foot nav{display:flex;align-items:center;flex-wrap:wrap;gap:8px 22px}
.foot-a{display:inline-flex;align-items:center;gap:10px;min-height:48px;font-size:16px}
.foot-a span{display:none}
.err{padding-block:55px 100px}
.err h1{font-size:clamp(2rem,4vw,3.6rem)}
@media(min-width:680px){.wrap{width:min(100% - 64px,1200px)}.mast{padding-block:30px}.tag{display:block}.tabs{flex-wrap:nowrap;gap:9px}.tabs a{flex:1 1 0;font-size:17px;min-height:52px}.hero{gap:30px;padding-top:55px}.art.home-art{max-width:640px;width:100%;margin-inline:auto}.route{padding:36px}.fork{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:25px}.branch{padding:22px 0 0}.branch h2{font-size:1.35rem}.read-grid{grid-template-columns:1.4fr 1fr;gap:45px;margin-block:45px 70px}.intro{padding-top:22px}.intro .deck{max-width:61ch}.copy{padding-top:7px}.foot{grid-template-columns:1fr auto;align-items:start;gap:30px}}
@media(min-width:1040px){.hero{grid-template-columns:minmax(0,1.2fr) minmax(0,.9fr);gap:60px;align-items:center;padding-bottom:30px}.art.home-art{margin:20px 0 0}.hero h1{font-size:3.9rem}.hero .deck{max-width:46ch}.hero .fact{max-width:47ch}.route{margin-top:25px}.route>h2{font-size:2.1rem;max-width:26ch}.fork{gap:42px}.read-grid{grid-template-columns:1.4fr .8fr;gap:100px}.copy{margin-left:150px;margin-right:0}.intro{padding-left:50px}.intro h1{margin-top:30px}.intro .deck{max-width:60ch}.turn{margin-left:150px}.foot p{max-width:67ch}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation:none!important;transition:none!important}}
@media print{html{font-size:12pt}.wrap{width:100%}.tabs,.tag,.word-btn,.skip,.turn,.art,.foot nav{display:none}.mast{padding-block:0 12px}.hero,.read-grid{display:block}.route{background:none;border:1pt solid #777}.fork{display:block}.copy,.intro{padding:0;margin:0;max-width:100%}.bit{break-inside:avoid}.foot{display:block}.words{background:none;padding:12px 0}.go,.source-a{min-height:0}.intro h1,.hero h1{font-size:27pt}}
