@font-face{font-family:Haas;src:url('/assets/NeueHaasDisplayMediu.ttf') format('truetype');font-weight:400 700;font-display:swap}
:root{font-family:Haas,Arial,sans-serif;color:#121212;background:#d7d9d4;--hand:'Caveat','Segoe Print',cursive}
*{box-sizing:border-box}body{margin:0;padding:8px;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button,input{font:inherit}a,button,input{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible,input:focus-visible{outline:3px solid #185abb;outline-offset:5px}.sr-only,.skip:not(:focus){position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.skip:focus{position:fixed;top:10px;left:10px;z-index:10;background:white;padding:12px}
.board{position:relative;min-height:calc(100svh - 16px);padding:27px 19px 24px;background:#fcfcf7;border:3px solid #8e948e;box-shadow:inset 0 0 0 2px #e4e7df;overflow:hidden}
.intro{position:relative}.name-heading{margin:0 -12px;font-size:15.1vw;line-height:.9;letter-spacing:-.073em;font-weight:600;transform:rotate(-2deg)}.name-heading b{display:block;font-weight:600;white-space:nowrap}.name-heading span{display:block;font-family:var(--hand);font-size:30px;font-weight:500;letter-spacing:-.03em;margin-top:10px;margin-left:5px;transform:rotate(3deg);width:fit-content}.bio{font-family:var(--hand);font-size:25px;font-weight:500;margin:18px 0 0 28px;line-height:1.1;transform:rotate(-2deg)}.portrait-sticker{display:none}
.board-content{display:flex;flex-direction:column;gap:64px;margin-top:68px}.signup{padding:0 8px;max-width:355px}.signup h2{font-family:var(--hand);font-size:37px;font-weight:600;line-height:1;margin:0 0 12px;transform:rotate(-2deg)}.signup p{font-family:var(--hand);font-size:25px;line-height:1.15;margin:0 0 25px;font-weight:500}form{display:flex;flex-wrap:wrap;gap:14px}input{width:100%;min-width:0;border:0;border-bottom:2px solid #222;border-radius:0;background:transparent;min-height:48px;padding:12px 0 10px;font-size:16px;color:#111}input::placeholder{color:#757571}button{display:inline-flex;align-items:center;gap:20px;min-height:48px;font-family:var(--hand);font-size:29px;line-height:1;background:none;border:0;border-bottom:2px solid #222;border-radius:0;padding:0 0 2px;margin-left:auto;cursor:pointer;transform:rotate(-3deg)}button:hover{color:#174a99;border-color:#174a99}
.notes{display:grid;grid-template-columns:1fr 1fr;gap:12px 0;padding:0 8px 18px 1px}.note{--tilt:-5deg;position:relative;isolation:isolate;display:flex;flex-direction:column;gap:13px;padding:25px 19px 39px;min-height:177px;transform:rotate(var(--tilt));transition:transform .18s ease}.note::after{content:'';position:absolute;inset:0;z-index:-1;clip-path:url(#sticky-paper);background:linear-gradient(#fff29c 0%,#fff29c 13%,#ecdf78 78%,#fff2a1 100%)}.note::before{content:'';position:absolute;z-index:-2;left:9%;right:4%;top:42%;bottom:1%;border-radius:35%;background:#23281238;filter:blur(7px);transform:translateY(5px) skewY(3deg)}.note-title{font-family:var(--hand);font-size:34px;font-weight:600;line-height:1;letter-spacing:-.035em}.note-copy{font-family:var(--hand);font-size:23px;line-height:1.02;font-weight:500}.arrow{position:absolute;bottom:12px;right:18px;font-family:var(--hand);font-size:32px;line-height:1}.pink{--tilt:6deg;margin-top:27px;margin-left:-6px;z-index:2}.green{--tilt:2deg;margin-left:10px;margin-right:-5px;margin-top:-9px;z-index:3}.peach{--tilt:-7deg;margin-top:20px;margin-left:6px;z-index:4}.note:hover{transform:rotate(var(--tilt)) translateY(-4px)}.note:active{transform:rotate(var(--tilt)) translateY(-1px)}
footer{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px;margin-top:62px;padding:0 6px;color:#666862;font-size:13px}.handle{font-family:var(--hand);font-size:22px;transform:rotate(-3deg)}footer nav{display:flex;gap:18px}footer a{display:inline-flex;align-items:center;min-height:44px}footer a:hover{text-decoration:underline;text-underline-offset:4px}.tray{position:absolute;bottom:0;left:0;right:0;height:5px;background:#bcc2b9;box-shadow:0 -1px 0 #8d968d}
@media(min-width:600px){body{padding:14px}.board{padding:35px 32px 24px;min-height:calc(100svh - 28px)}.name-heading{font-size:15.8vw;margin-left:-19px;margin-right:-19px}.name-heading span{font-size:40px}.bio{font-size:30px;margin-left:80px}.signup{max-width:390px}.notes{max-width:550px;margin-left:auto;gap:12px 10px}.note{min-height:223px;padding:28px 29px 44px}.note-title{font-size:43px}.note-copy{font-size:28px}}
@media(min-width:1000px){body{padding:18px}.board{min-height:calc(100svh - 36px);padding:44px 42px 22px;display:flex;flex-direction:column}.name-heading{font-size:16.4vw;margin:-6px -31px 0;letter-spacing:-.078em}.name-heading span{font-size:42px;margin:15px 0 0 27px}.bio{font-size:31px;position:absolute;left:28%;bottom:-4px;margin:0;transform:rotate(-3deg)}.board-content{display:grid;grid-template-columns:1fr 1.2fr;gap:7vw;margin:72px 2vw 0;align-items:center;flex:1}.signup{padding:0;margin-top:35px;max-width:360px}.signup h2{font-size:41px}.signup p{font-size:28px}.notes{width:100%;max-width:530px;gap:10px 0;transform:rotate(-1deg);margin-right:12px}.note{min-height:205px;padding:28px 25px 40px}.note-title{font-size:42px}.note-copy{font-size:27px}.pink{margin-top:32px}.green{margin-top:-12px;margin-left:26px}.peach{margin-top:19px;margin-left:-1px}footer{margin-top:52px;padding:0 14px}.handle{font-size:23px}}
@media(max-width:359px){.portrait-sticker{right:0}.board{padding-left:15px;padding-right:15px}.notes{padding-left:0;padding-right:2px}.note{padding-left:15px;padding-right:14px;min-height:175px}.note-title{font-size:30px}.note-copy{font-size:22px}.bio{margin-left:8px;font-size:24px}.signup{padding:0 2px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}

.portrait-sticker{display:block;position:absolute;right:-18px;top:90px;width:138px;height:auto;z-index:3;transform:rotate(8deg);clip-path:polygon(46% .7%,50% .7%,54% 2%,56% 4%,56% 7%,57% 8%,56% 11%,55% 13%,59% 14%,62% 16%,66% 18%,70% 22%,72% 28%,74% 35%,75% 40%,75% 44%,72% 47%,68% 49%,67% 52%,67% 58%,67% 63%,68% 70%,69% 77%,70% 83%,67% 87%,71% 89%,73% 92%,77% 94%,77% 96%,73% 97%,66% 96%,60% 94%,58% 92%,59% 87%,57% 85%,54% 79%,52% 74%,49% 69%,48% 64%,47% 60%,47% 57%,46% 61%,46% 66%,45% 70%,45% 75%,44% 81%,43% 85%,42% 87%,43% 91%,43% 93%,38% 94%,30% 96%,24% 96%,21% 95%,21% 93%,25% 91%,28% 88%,32% 86%,31% 83%,32% 78%,32% 73%,31% 68%,29% 63%,28% 57%,27% 51%,26% 49%,23% 48%,20% 45%,19% 42%,19% 38%,20% 33%,22% 29%,24% 25%,27% 21%,30% 18%,35% 16%,36% 14%,40% 13%,39% 11%,38% 9%,39% 7%,40% 4%,42% 2%);}
@media(max-width:599px){.intro{padding-bottom:132px}.bio{max-width:200px}}
@media(min-width:600px) and (max-width:999px){.intro{padding-bottom:175px}.portrait-sticker{top:140px;width:185px;right:0}}
@media(min-width:1000px){.portrait-sticker{top:calc(100% - 27px);right:-17px;width:173px}.notes{margin-top:70px}}

.note-title.cut30-wordmark{font-family:Impact,'Arial Narrow',sans-serif;font-weight:900;font-style:normal;font-size:38px;line-height:1;letter-spacing:-.025em;display:block;transform:scaleX(.86);transform-origin:left center}
@media(min-width:600px){.note-title.cut30-wordmark{font-size:48px}}

/* Full-bleed enamel surface and edge-to-edge masthead. */
body{padding:0;background:#fafbf7}
.board{border:0;box-shadow:none;min-height:100svh;padding-top:32px;background-color:#fafbf7;background-image:radial-gradient(ellipse at 24% 16%,#ffffffb3,transparent 53%),linear-gradient(112deg,#53665b06,transparent 42%,#89937a07);isolation:isolate}
.board::before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:url('/assets/fiber.webp') repeat;background-size:650px 650px;mix-blend-mode:multiply;opacity:.055}
.board::after{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(176deg,transparent 23%,#607a6905 23.5%,transparent 25%),linear-gradient(3deg,transparent 60%,#607a6906 61%,transparent 63%)}
.tray{display:none}
.name-heading{width:100vw;position:relative;left:50%;margin:0;transform:translateX(-50%) rotate(-2deg);font-size:18.05vw;letter-spacing:-.078em;line-height:.91}
.name-heading b{display:block;white-space:nowrap}
.name-heading span{margin-left:24px;font-size:30px;padding-top:8px}
.portrait-sticker{top:calc(18vw + 20px);right:-20px;width:158px;transform:rotate(7deg)}
@media(max-width:599px){.intro{padding-bottom:154px}.bio{margin-left:12px;max-width:210px}}
@media(min-width:600px){.board{padding-top:40px;min-height:100svh}.name-heading{font-size:18.05vw;margin:0}.name-heading span{font-size:40px;margin-left:40px}.portrait-sticker{top:calc(17vw + 18px);right:-18px;width:205px}}
@media(min-width:600px) and (max-width:999px){.intro{padding-bottom:190px}}
@media(min-width:1000px){.board{padding-top:38px;min-height:100svh}.name-heading{font-size:18.05vw;margin:0}.name-heading span{font-size:42px;margin-left:45px}.bio{left:23%;bottom:5px}.portrait-sticker{top:calc(17vw + 2px);right:12px;width:200px}.board-content{margin-top:110px}.notes{margin-top:70px}}

/* Larger portrait sticker. */
.portrait-sticker{width:220px;right:-32px}
@media(max-width:599px){.intro{padding-bottom:240px}}
@media(min-width:600px){.portrait-sticker{width:285px;right:-28px}}
@media(min-width:600px) and (max-width:999px){.intro{padding-bottom:290px}}
@media(min-width:1000px){.portrait-sticker{width:300px;right:0}.notes{margin-top:160px}}

/* Mobile first load: all existing content in one viewport, without clipping it. */
@media(max-width:999px){
 .board{height:100svh;min-height:0;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:30svh auto minmax(140px,1fr) 44px;gap:clamp(8px,1.6svh,16px);padding:18px 20px max(8px,env(safe-area-inset-bottom));overflow:visible}
 .intro{padding:0;min-height:0}
 .name-heading{width:calc(100vw - 6px);font-size:18.05vw;line-height:.9}
 .name-heading span{font-size:27px;margin:7px 0 0 22px;padding:0}
 .bio{font-size:25px;line-height:1.06;margin:12px 0 0 8px;max-width:190px}
 .portrait-sticker{top:65px;right:0;height:calc(30svh - 60px);max-height:225px;width:auto;transform:rotate(7deg)}
 .board-content{display:contents;margin:0}
 .signup{padding:0 6px;margin:0;max-width:none;width:100%;align-self:center}
 .signup h2{font-size:31px;margin:0 0 6px}
 .signup p{font-size:23px;line-height:1.1;margin:0 0 10px}
 form{flex-wrap:nowrap;gap:16px;align-items:end}
 input{width:0;flex:1;min-width:0;min-height:44px;padding:10px 0 8px;font-size:16px}
 button{flex-shrink:0;min-height:44px;font-size:25px;gap:7px;margin:0;padding:0 0 2px}
 .links{min-height:0;display:flex;align-items:center;padding:5px 4px 0}
 .notes{width:100%;max-width:520px;margin:0 auto;padding:0;gap:13px;transform:none}
 .note{min-height:142px;height:clamp(142px,21svh,190px);padding:19px 18px 31px;gap:9px}
 .green{margin:0;--tilt:3deg}.peach{margin:9px 0 0;--tilt:-5deg}
 .note-title{font-size:31px}.note-title.cut30-wordmark{font-size:35px}
 .note-copy{font-size:22px;line-height:1.03}.arrow{font-size:29px;bottom:9px;right:16px}
 footer{margin:0;padding:0 3px;gap:8px;flex-wrap:nowrap;align-self:end;font-size:13px;min-width:0}
 .handle{font-size:20px}footer nav{gap:10px}footer a{min-height:44px}
}
@media(max-width:359px){.portrait-sticker{right:0}.board{padding-left:15px;padding-right:15px;gap:8px}.bio{font-size:23px;max-width:160px}.signup p{font-size:22px}form{gap:10px}button{font-size:23px}.note{padding-left:15px;padding-right:13px}.note-title{font-size:28px}.note-copy{font-size:21px}footer{font-size:12px;gap:6px}footer nav{gap:8px}.handle{font-size:17px}}
/* Allow natural scrolling for landscape, an open keyboard, or enlarged text. */
@media(max-width:999px) and (max-height:520px){.board{height:auto;min-height:100svh;grid-template-rows:170px auto 170px 44px}.portrait-sticker{height:125px}.note{height:145px}}

/* Handwritten name tucked into the masthead's angled top edge. */
.name-heading span{position:absolute;top:-20px;left:24px;margin:0;padding:0;z-index:1;transform:rotate(3deg);line-height:1}
@media(max-width:999px){.name-heading span{top:-18px;left:22px;font-size:27px}}

/* A physical label for the signup action. */
.signup form{gap:10px;align-items:stretch}
.signup input{border:2px solid #181818;border-radius:2px 0 3px 1px;padding:12px 10px;background:#ffffff75;min-height:48px}
.signup button{font-family:Haas,Arial,sans-serif;font-size:16px;font-weight:700;letter-spacing:-.02em;background:#181818;color:#fff;border:2px solid #181818;border-radius:1px 3px 1px 2px;padding:10px 14px;min-height:48px;gap:9px;box-shadow:3px 3px 0 #fafbf7,5px 5px 0 #181818;transform:rotate(-2deg);transition:transform .15s,box-shadow .15s}
.signup button span{font-family:Arial,sans-serif;font-size:23px;line-height:1}
.signup button:hover{background:#303030;color:#fff;border-color:#181818;transform:rotate(-2deg) translateY(-2px)}
.signup button:active{transform:rotate(-2deg) translate(3px,3px);box-shadow:none}
@media(max-width:359px){.signup input{padding:10px 8px;font-size:14px}.signup button{font-size:14px;padding:10px 9px;gap:5px}}

/* Increase the portrait without changing the one-screen layout. */
.portrait-sticker{transform:rotate(7deg) scale(1.3);transform-origin:top right}

/* Pull the portrait into the masthead. */
.portrait-sticker{translate:0 -35px}

.bio{max-width:none;white-space:nowrap}
@media(max-width:599px){.bio{font-size:clamp(20px,5.65vw,25px)}}

.erased-sketch{position:absolute;inset:0;width:100%;height:100%;color:#465d63;opacity:.045;filter:blur(1.3px);pointer-events:none;z-index:-1}
.motto-sticker{position:absolute;top:128px;left:14px;padding:9px 13px 11px;background:#ff651f;color:#171714;font-family:Impact,'Arial Narrow',sans-serif;font-size:25px;line-height:.88;letter-spacing:-.02em;transform:rotate(-7deg);border:1px solid #d74e0c;border-radius:3px;box-shadow:1px 3px 3px #0003;isolation:isolate}
.motto-sticker span{position:absolute;right:9px;bottom:9px;font-size:21px}
.board-scribble{position:absolute;bottom:64px;left:25px;font-family:var(--hand);font-size:19px;transform:rotate(-3deg);line-height:1}
.board-scribble>span{display:block;margin-left:24px;font-size:21px}.board-scribble small{position:absolute;left:138px;top:4px;white-space:nowrap;font-size:17px}.board-scribble small s{opacity:.4;margin-right:3px}
.board-marker{position:absolute;right:28px;bottom:72px;width:143px;height:18px;transform:rotate(9deg);filter:drop-shadow(1px 4px 2px #0003);pointer-events:none}
.marker-barrel{position:absolute;left:25px;width:102px;height:18px;border:1px solid #a9aaa5;border-radius:4px 3px 3px 4px;background:linear-gradient(#d0d2cc,#fff 28%,#eeeee8 70%,#b9bcb5);display:flex;flex-direction:column;justify-content:center;padding-left:9px}
.marker-barrel b{font:900 10px/.95 Impact,'Arial Narrow',sans-serif;letter-spacing:.1px}.marker-barrel em{font:normal 3.7px/1.5 Arial,sans-serif;letter-spacing:.35px}.marker-cap{position:absolute;left:0;top:-5px;width:19px;height:21px;border-radius:5px 2px 2px 5px;background:linear-gradient(#444,#111 60%,#303030);transform:rotate(-18deg)}
.marker-neck{position:absolute;left:126px;top:3px;width:10px;height:12px;background:linear-gradient(#444,#111 70%,#333);border-radius:0 4px 4px 0}.marker-tip{position:absolute;left:135px;top:6px;width:8px;height:6px;background:#15191c;clip-path:polygon(0 0,75% 0,100% 65%,0 100%)}
.portrait-sticker{cursor:pointer}.portrait-sticker.wiggle{animation:sticker-wiggle .45s ease-in-out}
@keyframes sticker-wiggle{0%,100%{transform:rotate(7deg) scale(1.3)}35%{transform:rotate(-2deg) scale(1.33)}70%{transform:rotate(11deg) scale(1.3)}}
.note:active::after{transform:skewY(-2deg) translateY(-3px);filter:brightness(1.025)}
.note::after{transition:transform .16s,filter .16s}
@media(min-width:1000px){.motto-sticker{top:calc(17vw + 65px);left:15px;font-size:33px}.board-scribble{bottom:79px;left:50px}.board-marker{bottom:85px;right:50px}}
@media(max-width:999px){.motto-sticker{top:clamp(108px,16svh,142px);font-size:clamp(19px,2.9svh,25px)}.board-scribble{bottom:60px;font-size:16px}.board-scribble>span{font-size:18px}.board-scribble small{left:108px;font-size:15px}.board-marker{width:143px;right:24px;bottom:65px;scale:.8;transform-origin:right center}}
@media(max-width:359px){.motto-sticker{left:8px;padding:6px 10px 8px;top:100px;font-size:18px}.motto-sticker span{font-size:17px;right:6px;bottom:6px}.board-scribble{left:20px;bottom:57px;font-size:14px}.board-scribble>span{font-size:16px}.board-scribble small{left:94px;font-size:13px}.board-marker{scale:.64;right:20px;bottom:59px}}
@media(prefers-reduced-motion:reduce){.portrait-sticker.wiggle{animation:none}}
@media(max-width:359px){.board-scribble{bottom:40px}.board-marker{bottom:42px}}

.board-scribble small{position:static}

.board-marker{scale:1.4;transform-origin:right center}
@media(max-width:999px){.board-marker{scale:1.12}}
@media(max-width:359px){.board-marker{scale:.9}}

.masthead-version{position:absolute;right:20px;top:100%;padding-top:6px;font-family:var(--hand);font-size:18px;font-weight:500;line-height:1;letter-spacing:0;white-space:nowrap;transform:rotate(3deg)}
.masthead-version s{opacity:.4;margin-right:4px}
@media(max-width:599px){.masthead-version{right:16px;padding-top:5px;font-size:16px}}

.builder-proverb{position:absolute;left:44px;bottom:89px;margin:0;font-family:var(--hand);transform:rotate(-4deg);line-height:1.05}
.builder-proverb p{margin:0 0 4px;font-size:30px;font-weight:700}
.builder-proverb cite{display:block;font-size:18px;font-style:normal}
.builder-proverb small{display:block;margin-top:3px;font-size:15px}
@media(max-width:999px){.builder-proverb{left:25px;bottom:62px}.builder-proverb p{font-size:25px}.builder-proverb cite{font-size:15px}.builder-proverb small{font-size:13px}.board-marker{bottom:66px}}
@media(max-width:599px) and (max-height:720px){.builder-proverb{bottom:48px;left:20px}.builder-proverb p{font-size:20px;margin-bottom:2px}.builder-proverb cite{font-size:12px}.builder-proverb small{font-size:11px;margin-top:1px}.links{padding-bottom:35px}.note{min-height:125px;height:clamp(125px,20svh,145px)}.note-copy{font-size:20px}.board-marker{bottom:55px;scale:.8}}

.masthead-version{top:calc(100% - 10px);padding-top:0}

.marker-tip{top:6px;height:6px;clip-path:polygon(0 0,72% 10%,100% 35%,100% 65%,72% 90%,0 100%)}

/* Desktop: separate the portrait from a note grid that can hold four links. */
@media(min-width:1000px){
 .board{min-height:100svh;padding-bottom:24px}
 .intro{min-height:calc(17vw + 130px)}
 .portrait-sticker{top:calc(15vw - 10px);right:0;width:clamp(150px,12vw,210px);transform-origin:top right}
 .motto-sticker{top:calc(17vw + 20px);font-size:28px}
 .bio{left:23%;bottom:100px}
 .board-content{grid-template-columns:minmax(270px,.85fr) minmax(0,1.45fr);gap:6vw;margin:50px 2vw 130px;align-items:center}
 .signup{max-width:400px;margin:0}
 .links{padding-right:clamp(145px,14vw,240px)}
 .notes{grid-template-columns:repeat(2,minmax(0,1fr));max-width:580px;width:100%;gap:22px 18px;margin:0;transform:none;padding:0}
 .note{min-height:185px;padding:24px 21px 30px;margin:0;gap:14px}
 .note-title{font-size:35px}.note-title.cut30-wordmark{font-size:42px}.note-copy{font-size:25px}
 .green{--tilt:3deg}.peach{--tilt:-5deg}
 .note:nth-child(3){--tilt:-3deg}.note:nth-child(4){--tilt:4deg}
 footer{margin-top:auto}
}
@media(min-width:1000px){.note{aspect-ratio:1;min-height:185px}.notes{max-width:500px}}
@media(min-width:1000px) and (max-width:1199px){.board-content{gap:35px;grid-template-columns:minmax(250px,.8fr) minmax(0,1.2fr)}.links{padding-right:90px}.note{padding:18px 15px;min-height:160px}.note-title{font-size:29px}.note-title.cut30-wordmark{font-size:35px}.note-copy{font-size:22px}}

@media(min-width:1000px){.portrait-sticker{width:clamp(190px,15vw,260px)}.links{padding-right:clamp(180px,18vw,290px)}}
@media(min-width:1000px) and (max-width:1199px){.links{padding-right:125px}}

/* Fluorescent equipment label with a lifted lower corner. */
.motto-sticker{padding:5px;background:#ff6b16;border:2px solid #191914;border-radius:0;transform:rotate(-5deg);box-shadow:2px 4px 3px #0003;font-size:25px;line-height:.95}
.motto-sticker .motto-notice{position:static;display:block;background:#191914;color:#ff7c24;padding:3px 7px 4px;font-family:Haas,Arial,sans-serif;font-size:11px;font-weight:700;letter-spacing:.22em;line-height:1;text-align:left}
.motto-sticker strong{display:block;padding:7px 6px 5px;font-family:Impact,'Arial Narrow',sans-serif;font-weight:900;letter-spacing:-.025em;line-height:.95}
.motto-sticker::after{content:'';position:absolute;right:-2px;bottom:-2px;width:12px;height:12px;background:linear-gradient(135deg,#ffb17b 47%,#7d340d 50%,#fafbf7 56%);filter:drop-shadow(-1px -1px 1px #0003)}
@media(min-width:1000px){.motto-sticker{font-size:29px}}
@media(max-width:999px){.motto-sticker{font-size:clamp(19px,2.9svh,25px)}}
@media(max-width:359px){.motto-sticker{padding:4px;font-size:18px}.motto-sticker .motto-notice{font-size:9px;padding:3px 5px}.motto-sticker strong{padding:5px 4px}}

/* Slight adhesive lift, without a drawn paper triangle. */
.motto-sticker{border-bottom-right-radius:7px;box-shadow:0 1px 1px #0002,1px 3px 3px #0002;background:linear-gradient(155deg,#ff701c 0%,#ff6b16 82%,#ff7b2c 100%)}
.motto-sticker::after{right:-1px;bottom:-1px;width:22px;height:18px;border-bottom-right-radius:7px;background:radial-gradient(ellipse at 100% 100%,#ffc28b55,transparent 70%);filter:none;pointer-events:none}
.motto-sticker::before{content:'';position:absolute;right:1px;bottom:-3px;width:24px;height:8px;border-radius:50%;background:#33201338;filter:blur(3px);transform:rotate(-10deg);z-index:-1}

/* Satin vinyl: printed color under a continuous laminate reflection. */
.motto-sticker{
 background:linear-gradient(118deg,#e95108 0%,#ff761d 28%,#ff8129 43%,#f96912 67%,#eb590b 100%);
 border-color:#25231c;border-radius:2px 2px 6px 2px;
 box-shadow:inset 0 1px 0 #ffd3a27a,inset 1px 0 0 #ffb56b4d,inset 0 -1px 1px #81300080,0 1px 1px #0005,1px 3px 4px #38281c38;
}
.motto-sticker .motto-notice{background:linear-gradient(110deg,#23241e,#35352b 45%,#20211c);color:#ff8b37}
.motto-sticker strong{color:#20221b;text-shadow:0 1px 0 #ffb56925}
.motto-sticker::after{
 inset:0;width:auto;height:auto;border-radius:inherit;
 background-image:linear-gradient(116deg,transparent 8%,#fff3d81a 24%,#fff5db38 37%,#fff7e918 47%,transparent 58%,#7331050a 82%,#ffcf8d20),url('/assets/fiber.webp');
 background-size:100% 100%,180px 180px;background-blend-mode:screen;
 opacity:.55;mix-blend-mode:soft-light;pointer-events:none;
}
.motto-sticker::before{right:1px;bottom:-2px;width:30px;height:9px;background:#30211640;filter:blur(3px);transform:rotate(-5deg)}

.board-equation{position:absolute;top:-16px;left:160px;font-family:var(--hand);font-size:30px;font-weight:500;font-style:normal;letter-spacing:0;line-height:1;transform:rotate(5deg);white-space:nowrap}
@media(max-width:999px){.board-equation{top:-15px;left:98px;font-size:23px}}

.board-equation{left:auto;right:-15px;top:calc(17vw + 100px);font-size:25px;transform:rotate(6deg);z-index:2}
@media(max-width:999px){.board-equation{right:-10px;top:135px;font-size:20px}}
@media(max-width:359px){.board-equation{right:-8px;top:112px;font-size:17px}}

.portrait-sticker{clip-path:none;filter:url(#portrait-outline);right:28px}
@media(min-width:1000px){.portrait-sticker{width:clamp(115px,9vw,156px);right:65px}}

/* Keep the equation directly beneath the portrait's feet. */
.board-equation{right:90px;top:calc(15vw - 45px + clamp(115px,9vw,156px) * 3.46);transform:rotate(-3deg)}
@media(max-width:999px){.board-equation{right:53px;top:calc(30px + min(30svh - 60px,225px) * 1.3 + 8px);font-size:20px}}
@media(max-width:359px){.board-equation{font-size:17px}}
@media(max-width:999px) and (max-height:520px){.board-equation{top:201px}}

/* Reminder takes the marker's bottom-right spot; marker moves to its old spot. */
.motto-sticker{left:auto;right:35px;top:auto;bottom:75px;font-size:25px}
.board-marker{right:auto;left:45px;bottom:auto;top:calc(17vw + 110px);transform-origin:left center}
@media(max-width:999px){.motto-sticker{right:25px;top:auto;bottom:65px;font-size:20px}.board-marker{left:30px;right:auto;top:165px;bottom:auto}}
@media(max-width:599px) and (max-height:720px){.motto-sticker{right:20px;bottom:49px;font-size:16px;padding:4px}.motto-sticker .motto-notice{font-size:8px;padding:2px 4px}.motto-sticker strong{padding:4px}.board-marker{top:143px}}
@media(max-width:359px){.motto-sticker{top:auto;left:auto;right:20px;bottom:49px;font-size:15px}.board-marker{left:23px;top:139px;bottom:auto}}

/* An envelope opens into the actual signup form. */
.signup{position:relative;min-height:150px;isolation:isolate}
.signup .envelope-trigger{display:block;position:relative;width:100%;height:140px;margin:0;padding:0;border:1px solid #c6c4b7;border-radius:3px;background:repeating-linear-gradient(45deg,#607994 0 1px,#cad4dc 1px 4px);box-shadow:1px 5px 6px #262e292e;transform:rotate(-3deg);color:#19283b;text-align:left;animation:envelope-arrive .8s ease-out both,envelope-nudge .65s ease-in-out 1.8s}
.signup .envelope-trigger:hover{transform:rotate(-2deg) translateY(-2px);border-color:#aaa99f;color:#19283b}
.envelope-front{position:absolute;inset:24% 0 0;background:linear-gradient(154deg,#fffef5,#eae7d9);clip-path:polygon(0 0,50% 31%,100% 0,100% 100%,0 100%);padding:30px 23px 14px;display:flex;flex-direction:column;justify-content:center;gap:1px}
.signup .envelope-front #email-title{font-family:var(--hand);font-size:39px;font-weight:700;line-height:1}
.signup .envelope-copy{font-family:var(--hand);font-size:23px;line-height:1.1;letter-spacing:0}
.signup .envelope-flap{position:absolute;inset:0 0 auto;height:63%;background:linear-gradient(168deg,#fffef6,#e5e1d3);clip-path:polygon(0 0,100% 0,50% 100%);transform-origin:top;transition:transform .35s;filter:drop-shadow(0 2px 1px #0003)}
.signup .open-me{position:absolute;right:8px;top:-26px;font-family:var(--hand);font-size:23px;color:#252a23;transform:rotate(7deg);letter-spacing:0}
.signup .envelope-card{position:absolute;inset:-8px 5px auto;z-index:3;background:#fffef7;padding:16px 15px 18px;border:1px solid #d4d0c1;box-shadow:0 4px 9px #0002;flex-wrap:nowrap;align-items:stretch;gap:8px;animation:card-out .3s ease-out}
.signup .envelope-card[hidden],.signup .envelope-close[hidden]{display:none}
.card-title{position:absolute;top:13px;left:16px;font:700 26px/1 var(--hand)}
.signup .envelope-card input,.signup .envelope-card button{margin-top:38px}
.signup .envelope-card input{width:0;flex:1;min-width:0}
.signup .envelope-card button{font-size:14px;padding:8px;gap:5px;flex-shrink:0}
.signup .envelope-close{position:absolute;right:9px;top:-6px;z-index:4;min-height:36px;width:36px;padding:0;display:flex;align-items:center;justify-content:center;border:0;background:none;color:#222;box-shadow:none;transform:none;font:26px/1 Arial}
.is-open .envelope-flap{transform:rotateX(180deg)}.is-open .open-me{visibility:hidden}
@keyframes envelope-arrive{from{opacity:0;translate:-100px 0}to{opacity:1;translate:0 0}}
@keyframes envelope-nudge{0%,100%{translate:0 0}35%{translate:7px 0}65%{translate:-3px 0}}
@keyframes card-out{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:999px){.signup{min-height:140px}.signup .envelope-trigger{height:130px}.signup .envelope-front #email-title{font-size:34px}.signup .envelope-copy{font-size:22px}}
@media(max-width:599px) and (max-height:720px){.signup{min-height:115px}.signup .envelope-trigger{height:105px}.envelope-front{padding:20px 16px 8px}.signup .envelope-front #email-title{font-size:29px}.signup .envelope-copy{font-size:20px}.signup .envelope-card{padding:12px 9px}.signup .envelope-card button{font-size:12px}.signup .envelope-card input{font-size:14px;padding:8px}}
@media(prefers-reduced-motion:reduce){.signup .envelope-trigger,.signup .envelope-card{animation:none}.signup .envelope-flap{transition:none}}
@media(max-width:999px){.board{grid-template-rows:34svh auto minmax(140px,1fr) 44px}.signup .open-me{left:12px;right:auto}}
@media(max-width:599px) and (max-height:720px){.board{grid-template-rows:32svh auto minmax(140px,1fr) 44px}}
@media(max-width:999px){.note{height:clamp(125px,18svh,155px);min-height:125px}.signup .envelope-card{top:8px}.signup .envelope-close{top:10px}}

/* Simple signup with a red marker circle. */
.signup{min-height:0;padding:18px 21px 22px;position:relative}
.signup h2{font-family:var(--hand);font-size:30px;line-height:1.1;margin:0 0 12px;white-space:nowrap}
.signup form{display:flex;flex-wrap:nowrap;gap:10px;align-items:stretch}
.signup input{width:0;flex:1;min-width:0;border:0;border-bottom:2px solid #222;background:transparent;padding:8px 0;min-height:44px;font-size:18px}
.signup button{flex:0 0 46px;display:flex;align-items:center;justify-content:center;padding:0;margin:0;min-height:44px;background:#191919;color:#fff;border:0;box-shadow:none;border-radius:2px;transform:rotate(-2deg);font:28px/1 Arial,sans-serif}
.signup button:hover{background:#333;transform:rotate(-2deg);border:0}
.signup-circle{position:absolute;inset:-9px -12px;width:calc(100% + 24px);height:calc(100% + 18px);overflow:visible;pointer-events:none;transform:rotate(-3deg)}
.signup-circle path{fill:none;stroke:#bd2925;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke;opacity:.9}
@media(max-width:999px){.signup{padding:14px 16px 18px;min-height:0}.signup h2{font-size:27px;margin-bottom:9px}}
@media(max-width:359px){.signup{padding:12px 12px 16px}.signup h2{font-size:23px}.signup input{font-size:16px}}

.signup form{position:relative}
.signup input{border:0}
.signup-circle{inset:-10px -13px;width:calc(100% + 26px);height:calc(100% + 20px)}
.signup h2{margin-bottom:23px}

.signup input::placeholder{font-family:var(--hand);font-size:26px;font-weight:500;color:#62655d;opacity:1}
.signup button,.signup button:hover{background:transparent;color:#20241e;border:0;box-shadow:none}
.submit-sketch{display:block;width:48px;height:44px;overflow:visible}
.submit-sketch path{fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.signup button:hover .submit-sketch{transform:rotate(2deg)}

/* Align the form contents inside the marker oval. */
.signup h2{transform:none;margin-left:14px}
.signup form{align-items:center;height:62px;padding:0 14px}
.signup input{height:48px;min-height:48px;padding:0;line-height:48px;margin:0;font-family:var(--hand);font-size:26px}
.signup button{height:44px;min-height:44px;margin:0;transform:none;flex-basis:48px}
.signup button:hover{transform:none}
.signup-circle{inset:-5px -7px;width:calc(100% + 14px);height:calc(100% + 10px);transform:rotate(-1deg)}

.signup input:focus,.signup input:focus-visible{outline:none;box-shadow:none}
.signup form:focus-within .signup-circle path{stroke:#a71919;stroke-width:3.5;opacity:1}

.signup h2{margin-bottom:8px}

.signup button:hover .submit-sketch path:first-child{fill:#20241e;stroke:#20241e}
.signup button:hover .submit-sketch path:last-child{stroke:#fff}

.marker-cap{height:18px;top:-3px;border-radius:4px 2px 2px 4px}

/* Current featured link. */
.cut30-highlight{position:absolute;left:14px;top:calc(17vw + 30px);display:flex;flex-direction:column;gap:8px;padding:19px 18px 23px;background:linear-gradient(165deg,#d6f58f,#b7da72 80%,#d3ecaa);color:#19231a;transform:rotate(-5deg);box-shadow:1px 4px 5px #17251530;border-radius:1px 1px 5px 1px;max-width:220px}
.cut30-highlight strong{font:900 42px/.95 Impact,'Arial Narrow',sans-serif;letter-spacing:-.025em}
.cut30-highlight span{font:500 24px/1.05 var(--hand)}
.cut30-highlight:hover{transform:rotate(-3deg) translateY(-2px)}
.board-marker{left:245px;right:auto;top:auto;bottom:88px;scale:1.1}
@media(max-width:999px){.cut30-highlight{top:125px;left:12px;max-width:178px;padding:15px 16px 20px}.cut30-highlight strong{font-size:35px}.cut30-highlight span{font-size:23px}.board-marker{left:30px;top:auto;bottom:160px;scale:.85}}
@media(max-width:599px) and (max-height:720px){.cut30-highlight{top:104px;padding:10px 12px 13px;max-width:160px;gap:5px}.cut30-highlight strong{font-size:29px}.cut30-highlight span{font-size:20px}.board-marker{left:28px;top:auto;bottom:104px;scale:.65}}
@media(max-width:999px){.board-marker{left:auto;right:27px;bottom:43px;scale:.7;transform-origin:right center}}
@media(max-width:599px) and (max-height:720px){.board-marker{left:auto;right:23px;bottom:29px;scale:.55}}

.cut30-highlight{translate:0 18px}

.board-marker{left:48px;right:auto;top:auto;bottom:61px;scale:1.1;transform-origin:left center}
@media(max-width:999px){.board-marker{left:28px;right:auto;bottom:39px;scale:.7}}
@media(max-width:599px) and (max-height:720px){.board-marker{left:23px;right:auto;bottom:29px;scale:.55}}

.builder-proverb{translate:0 -16px}
.board-marker{translate:0 -16px}



.builder-proverb{transform:none}
.motto-sticker{transform:rotate(1deg)}

.signup-fields{display:flex;align-items:center;gap:10px;width:100%}
.signup .formkit-alert-error{position:absolute;top:100%;left:14px;right:0;margin:9px 0 0;padding:0;list-style:none;color:#a71919;font:16px/1.2 var(--hand)}
.signup .formkit-alert-error:empty{display:none}
.signup .formkit-alert-success{font:500 27px/1.1 var(--hand);color:#20241e;padding:0;margin:0}
.signup button[data-active]{opacity:.5;pointer-events:none}

.board-menu{position:fixed;right:15px;top:10px;z-index:50;font:600 17px var(--hand);background:#fafbf7ed;border:1px solid #252922;border-radius:3px;box-shadow:1px 2px 2px #0002}.board-menu summary{padding:6px 10px;cursor:pointer}.board-menu nav{display:flex;flex-direction:column;padding:4px 14px 10px;min-width:130px}.board-menu a{padding:9px 0}.board-menu a:hover{text-decoration:underline}

.full-site-link{position:absolute;bottom:2px;left:50%;transform:translateX(-50%);font:11px/1.4 Haas,Arial,sans-serif;color:#74776f;padding:5px 12px;white-space:nowrap;text-decoration:none}
.full-site-link:hover{text-decoration:underline;text-underline-offset:3px;color:#20241e}
@media(max-width:999px){.board>footer{translate:0 -12px}.full-site-link{bottom:max(0px,env(safe-area-inset-bottom))}}

/* A real marker occupies the former highlight-note position. */
.sharpie-marker{position:absolute;left:0;top:calc(17vw + 48px);width:330px;height:auto;transform:rotate(7deg);pointer-events:none;z-index:2}
@media(max-width:999px){.sharpie-marker{left:0;top:139px;width:205px}}
@media(max-width:599px) and (max-height:720px){.sharpie-marker{top:115px;width:180px}}
.sharpie-marker{mask-image:url('/assets/sharpie-marker.png');mask-size:100% 100%;mask-repeat:no-repeat}