


:root{--ink:oklch(25% .012 150);--chalk:oklch(98% .005 105);--coral:oklch(68.454% .1746 31.15);--blue:oklch(68.579% .1496 257.94);--yellow:oklch(86.407% .1437 90.65);--green:oklch(75.572% .1188 160.96);--ease:cubic-bezier(.22,1,.36,1);--content:1240px;color:var(--ink);background:var(--chalk);font-family:Monument,Arial,sans-serif;font-synthesis:none;scroll-behavior:smooth}
*{box-sizing:border-box}html{background:var(--chalk)}body{margin:0;overflow-x:clip;background:var(--chalk)}button,input{font:inherit;color:inherit}button,a{touch-action:manipulation;-webkit-tap-highlight-color:transparent}button{cursor:pointer;border:0}button:disabled{cursor:default}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid var(--ink);outline-offset:4px}h1,h2,p,figure{margin:0}h1,h2{font-family:Gooper,Georgia,serif;font-weight:600;letter-spacing:-.035em;line-height:1.02;text-wrap:balance}p{text-wrap:pretty}img,svg{display:block}img{max-width:100%}[hidden]{display:none!important}.wrap{width:min(var(--content),calc(100% - 96px));margin-inline:auto}.skip-link{position:fixed;top:12px;left:12px;padding:13px 18px;background:var(--chalk);border:2px solid var(--ink);z-index:20;transform:translateY(-180%)}.skip-link:focus{transform:none}

.hero{min-height:830px;background:var(--yellow);border-bottom:3px solid var(--ink);position:relative;overflow:hidden}.site-header{height:98px;display:flex;align-items:center;justify-content:space-between;gap:30px;position:relative;z-index:5}.brand{display:flex;align-items:center;gap:8px}.brand>span:first-child{width:38px;flex:none}.wordmark{font-family:Gooper,Georgia,serif;font-weight:600;font-size:42px;line-height:1;letter-spacing:-.04em}.wordmark>span{color:var(--coral)}.site-header nav{display:flex;gap:32px;font-size:14px}.site-header nav a{padding:12px 0}.site-header nav a:hover{text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:6px}.nav-cta{display:flex;align-items:center;gap:18px;background:var(--ink);color:var(--chalk);border-radius:999px;padding:13px 19px;min-height:46px;font-size:13px;font-weight:500}.nav-cta span{font-size:19px;line-height:1}.hero-inner{height:660px;display:grid;grid-template-columns:minmax(470px,.88fr) minmax(500px,1.12fr);align-items:center;position:relative}.hero-copy{z-index:3;padding-bottom:18px}.hero-kicker{display:inline-flex;align-items:center;border:2px solid var(--ink);border-radius:999px;padding:9px 14px;font-size:12px;font-weight:500;margin-bottom:25px;background:var(--chalk)}.hero h1{font-size:clamp(58px,6.6vw,92px);max-width:700px}.hero h1 em{font-style:normal;color:var(--coral);text-shadow:2px 2px 0 var(--ink),-2px -2px 0 var(--ink),2px -2px 0 var(--ink),-2px 2px 0 var(--ink)}.hero-description{max-width:520px;font-size:18px;line-height:1.55;margin-top:25px}.hero-waitlist{margin-top:30px;scroll-margin-top:30px}.waitlist-form label{display:block;font-size:13px;font-weight:500;margin-bottom:10px}.signup-row{display:flex;max-width:545px}.signup-row input{width:100%;height:61px;background:var(--chalk);border:2px solid var(--ink);border-radius:10px 0 0 10px;padding:0 17px;font-size:14px;min-width:0}.signup-row input::placeholder{color:oklch(43% .01 150);opacity:1}.signup-row button{height:61px;flex:none;background:var(--green);border:2px solid var(--ink);border-left:0;border-radius:0 10px 10px 0;padding:0 19px;font-size:13px;font-weight:500;display:flex;align-items:center;gap:18px;transition:background 160ms ease,color 160ms ease}.signup-row button:hover{background:var(--ink);color:var(--chalk)}.signup-row button span{font-size:19px}.waitlist-form[data-state="error"] input{outline:3px solid var(--coral);outline-offset:2px}.form-note,.form-status{font-size:11px;line-height:1.5;margin-top:9px}.form-status:not(:empty){font-weight:500}.hero-character{height:100%;position:relative}.mascot-button{position:absolute;width:min(650px,57vw);right:-20px;top:-46px;padding:0;background:transparent;border-radius:48%;transform:rotate(2deg);z-index:2}.mascot-button img,.mascot-button svg{width:100%;height:auto}.mascot-status{position:absolute;right:12px;bottom:52px;background:var(--coral);border:2px solid var(--ink);border-radius:999px;padding:11px 16px;font-size:12px;font-weight:500;transform:rotate(-5deg);z-index:3}.hero-foot{height:72px;display:flex;align-items:center;gap:24px;border-top:2px solid var(--ink);font-family:Gooper,Georgia,serif;font-size:26px}.hero-foot span:nth-child(2){color:var(--chalk);text-shadow:1.5px 1.5px 0 var(--ink),-1.5px -1.5px 0 var(--ink),1.5px -1.5px 0 var(--ink),-1.5px 1.5px 0 var(--ink)}.hero-foot b{font-size:24px;font-weight:400;margin-left:auto}

.manifesto{background:var(--ink);color:var(--chalk);padding:118px 0 126px}.manifesto-inner{display:grid;grid-template-columns:.52fr 1.48fr;align-items:start;gap:50px}.manifesto p{font-size:15px;line-height:1.6;max-width:280px;padding-top:8px}.manifesto h2{font-size:clamp(48px,6vw,82px);max-width:900px}.manifesto h2 span{color:var(--yellow)}

.feature{border-bottom:3px solid var(--ink);padding:110px 0 96px}.feature-coral{background:var(--coral)}.feature-blue{background:var(--blue)}.feature-yellow{background:var(--yellow)}.feature-green{background:var(--green)}.feature-inner{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(280px,.7fr);column-gap:80px;align-items:end}.feature-heading p{font-size:13px;font-weight:500;margin-bottom:20px}.feature-heading h2{font-size:clamp(44px,5.2vw,72px);max-width:820px}.feature-body{padding-bottom:6px}.feature-body>p:first-child{font-size:17px;line-height:1.6;max-width:420px}.feature-art{grid-column:1/-1;margin-top:65px}.feature-art>div{width:100%}.feature-art figcaption{display:flex;justify-content:space-between;align-items:center;gap:20px;min-height:52px;font-size:12px;font-weight:500}.scene-toggle{background:transparent;display:flex;align-items:center;gap:10px;padding:12px 0 12px 12px;min-height:44px;font-size:12px}.scene-toggle:hover{text-decoration:underline;text-underline-offset:4px}.scene-toggle:disabled{opacity:.55;text-decoration:none}.scene-toggle [data-scene-icon]{font-size:13px}.factory-art{width:min(980px,84%);margin-left:auto}.voice-art{width:100%}.voice-art .nv-component{aspect-ratio:112/50}.voice-art .nv-art,.voice-art .nv-component>img{width:100%;max-width:none;aspect-ratio:112/50}.context-art{width:min(900px,78%)}.feature-inner-reverse .feature-heading{grid-column:2}.feature-inner-reverse .feature-body{grid-column:1;grid-row:1}.feature-inner-reverse .feature-heading h2{max-width:740px}.feature-inner-reverse .feature-art{grid-column:1/-1}.feature-blue .feature-body{max-width:390px}.feature-yellow .feature-body{justify-self:end}.feature-yellow .context-art{margin-left:0}.feature-green{padding-bottom:110px}

.theme-picker{display:flex;gap:8px;flex-wrap:wrap;margin-top:25px}.theme-picker button{background:transparent;border:2px solid var(--ink);border-radius:999px;padding:10px 14px;min-height:42px;font-size:11px}.theme-picker button[aria-pressed="true"]{background:var(--ink);color:var(--chalk)}.theme-status{font-size:11px;margin-top:11px}.rewards-art{width:min(850px,78%);margin-left:auto}.reward-stage{height:520px;position:relative;display:flex;align-items:center;justify-content:center}.reward-card{position:absolute;width:410px;height:300px;border:3px solid var(--ink);border-radius:14px;background:var(--chalk);padding:25px 28px;display:flex;flex-direction:column;justify-content:space-between;box-shadow:7px 7px 0 var(--ink);transform:rotate(-3deg);transition:transform 400ms var(--ease),background 180ms ease}.reward-card[data-theme="daydream"]{background:var(--blue);transform:rotate(4deg)}.reward-card[data-theme="coral"]{background:var(--coral);transform:rotate(-7deg)}.reward-card-back{box-shadow:none}.reward-card-back.one{background:var(--blue);transform:translate(-70px,15px) rotate(-12deg)}.reward-card-back.two{background:var(--yellow);transform:translate(72px,-5px) rotate(10deg)}.reward-top,.reward-bottom{display:flex;justify-content:space-between;font-size:11px;font-weight:500}.reward-card strong{font-family:Gooper,Georgia,serif;font-size:112px;line-height:1;text-align:center;letter-spacing:-.04em}.reward-burst{position:absolute;right:9%;top:8%;font-size:80px}.rewards-art figcaption{justify-content:flex-end}

.faq{padding:120px 0 130px;display:grid;grid-template-columns:.75fr 1.25fr;gap:100px}.faq-intro h2{font-size:clamp(54px,6vw,80px)}.faq-intro p{font-size:15px;margin-top:22px}.faq-list details{border-bottom:2px solid var(--ink)}.faq-list details:first-child{border-top:2px solid var(--ink)}.faq-list summary{list-style:none;cursor:pointer;min-height:82px;padding:22px 0;display:flex;justify-content:space-between;align-items:center;gap:25px;font-size:16px;font-weight:500}.faq-list summary::-webkit-details-marker{display:none}.faq-list summary span{font-size:26px;transition:transform 180ms var(--ease)}.faq-list details[open] summary span{transform:rotate(45deg)}.faq-list details>p{font-size:14px;line-height:1.7;max-width:650px;padding:0 45px 28px 0}

.closing{background:var(--ink);color:var(--chalk);height:620px;overflow:hidden}.closing-inner{display:grid;grid-template-columns:1.1fr .9fr;height:100%;align-items:center}.closing-inner>div:first-child{position:relative;z-index:2}.closing-inner p{font-size:14px;margin-bottom:22px}.closing h2{font-size:clamp(70px,8.5vw,96px);line-height:.95}.closing .closing-cta{display:inline-flex;align-items:center;gap:28px;background:var(--yellow);color:var(--ink);border-radius:999px;padding:17px 22px;margin-top:34px;font-size:14px;font-weight:500}.closing .closing-cta span{font-size:22px}.closing small{display:block;margin-top:13px;font-size:10px}.closing-character{align-self:end;position:relative;height:560px}.closing-character #footer-mascot{position:absolute;width:520px;max-width:50vw;bottom:-150px;right:-20px;transform:rotate(-8deg)}.site-footer{height:104px;display:flex;align-items:center;justify-content:space-between;gap:25px}.site-footer .wordmark{font-size:34px}.site-footer p{font-size:11px}.motion-toggle{background:transparent;display:flex;align-items:center;gap:9px;min-height:44px;padding:10px 0 10px 12px;font-size:11px}.motion-toggle:hover{text-decoration:underline;text-underline-offset:4px}

html[data-motion="paused"]{scroll-behavior:auto}html[data-motion="paused"] *,html[data-motion="paused"] *::before,html[data-motion="paused"] *::after{animation-play-state:paused!important;transition:none!important}
@media(max-width:1060px){.wrap{width:calc(100% - 64px)}.hero{min-height:780px}.hero-inner{height:610px;grid-template-columns:minmax(400px,.95fr) minmax(380px,1.05fr)}.hero h1{font-size:clamp(56px,7vw,74px)}.mascot-button{width:min(570px,58vw);right:-60px;top:-20px}.mascot-status{right:0;bottom:45px}.hero-description{font-size:16px;max-width:440px}.signup-row{max-width:490px}.manifesto{padding-block:98px}.manifesto-inner{grid-template-columns:1fr;gap:36px}.manifesto p{max-width:390px}.feature{padding-block:90px 80px}.feature-inner{column-gap:48px}.feature-body>p:first-child{font-size:15px}.feature-art{margin-top:50px}.factory-art{width:90%}.context-art,.rewards-art{width:86%}.reward-stage{height:430px}.reward-card{width:340px;height:255px}.reward-card strong{font-size:91px}.faq{gap:60px;padding-block:100px}.closing{height:560px}.closing-character{height:500px}.closing-character #footer-mascot{width:450px}}
@media(max-width:760px){.wrap{width:calc(100% - 40px)}.site-header{height:82px}.brand>span:first-child{width:30px}.wordmark{font-size:34px}.site-header nav{display:none}.nav-cta{font-size:11px;min-height:42px;padding:10px 14px;gap:10px}.hero{min-height:0}.hero-inner{height:auto;display:flex;flex-direction:column;padding-top:34px}.hero-copy{text-align:center;padding:0}.hero-kicker{font-size:10px;margin-bottom:19px}.hero h1{font-size:clamp(48px,13vw,70px);line-height:1.04}.hero-description{font-size:14px;line-height:1.6;margin:21px auto 0;max-width:430px}.hero-waitlist{margin:24px auto 0;max-width:500px;text-align:left}.waitlist-form label{text-align:center;font-size:11px}.signup-row input,.signup-row button{height:55px}.signup-row button{font-size:11px;padding-inline:13px;gap:8px}.signup-row input{font-size:12px;padding-inline:12px}.form-note,.form-status{text-align:center;font-size:9px}.hero-character{height:425px;width:100%;max-width:500px;margin:15px auto 0}.mascot-button{width:500px;max-width:112vw;right:50%;transform:translateX(50%) rotate(2deg);top:-12px}.mascot-status{right:50%;transform:translateX(50%) rotate(-5deg);bottom:17px;white-space:nowrap;font-size:10px}.hero-foot{height:60px;font-size:20px;gap:14px}.manifesto{padding-block:75px 80px}.manifesto-inner{gap:27px}.manifesto p{font-size:13px;max-width:280px}.manifesto h2{font-size:clamp(39px,10vw,60px)}.feature{padding-block:72px 60px}.feature-inner,.feature-inner-reverse{display:flex;flex-direction:column;align-items:stretch;gap:0}.feature-heading p{font-size:11px;margin-bottom:15px}.feature-heading h2{font-size:clamp(39px,10.3vw,56px)}.feature-body{padding:0;margin-top:21px}.feature-body>p:first-child{font-size:14px;line-height:1.65;max-width:470px}.feature-art,.factory-art,.context-art,.rewards-art{width:100%;margin:39px 0 0}.feature-art figcaption{font-size:10px;min-height:45px}.scene-toggle{font-size:10px}.voice-art .nv-component{aspect-ratio:760/500;overflow:hidden}.voice-art .nv-art,.voice-art .nv-component>img{width:147.368421%;aspect-ratio:112/50}.reward-stage{height:330px}.reward-card{width:245px;height:190px;padding:18px;box-shadow:5px 5px 0 var(--ink)}.reward-card-back.one{transform:translate(-40px,10px) rotate(-12deg)}.reward-card-back.two{transform:translate(42px,-4px) rotate(10deg)}.reward-card strong{font-size:65px}.reward-top,.reward-bottom{font-size:8px}.reward-burst{font-size:52px;right:3%}.theme-picker{margin-top:20px}.faq{padding-block:78px 85px;display:block}.faq-intro h2{font-size:55px}.faq-intro p{margin-top:15px}.faq-list{margin-top:36px}.faq-list summary{min-height:72px;font-size:13px}.faq-list details>p{font-size:13px;padding-right:16px}.closing{height:585px}.closing-inner{display:block;padding-top:66px;position:relative}.closing-inner p{font-size:12px;margin-bottom:18px}.closing h2{font-size:68px}.closing .closing-cta{font-size:12px;margin-top:25px;padding:14px 18px}.closing small{font-size:9px}.closing-character{position:absolute;inset:auto 0 0;height:300px}.closing-character #footer-mascot{width:330px;max-width:none;right:-40px;bottom:-104px}.site-footer{height:88px}.site-footer .wordmark{font-size:30px}.site-footer p{display:none}.motion-toggle{font-size:10px}}
@media(max-width:420px){.wrap{width:calc(100% - 32px)}.site-header{height:76px}.brand>span:first-child{width:26px}.wordmark{font-size:30px}.nav-cta{padding-inline:11px}.hero-inner{padding-top:25px}.hero h1{font-size:clamp(42px,12.7vw,56px)}.hero-description{font-size:13px}.signup-row{display:grid;grid-template-columns:1fr auto}.signup-row input{border-radius:9px 0 0 9px}.signup-row button{border-radius:0 9px 9px 0;padding-inline:10px}.signup-row button span{display:none}.hero-character{height:360px}.mascot-button{width:425px;top:0}.hero-foot{font-size:17px}.manifesto h2,.feature-heading h2{font-size:38px}.feature{padding-block:62px 54px}.reward-stage{height:290px}.reward-card{width:210px;height:164px;padding:15px}.reward-card strong{font-size:55px}.faq-intro h2{font-size:48px}.closing{height:540px}.closing h2{font-size:57px}.closing-character #footer-mascot{width:300px}}
@media(prefers-reduced-motion:reduce){:root{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}

/* One small, decorative cameo; never intercept clicks or expand the page. */

/* Quiet hero revision + local typography study */







:root{
  --font-display:Gooper,Georgia,serif;
  --font-body:Monument,Arial,sans-serif;
  --display-weight:600;
  --display-tracking:-.035em;
  --paper:#f7f7f2;
  --paper-line:rgba(37,43,38,.10);
  --paper-line-width:1.25px;
  font-family:var(--font-body);
}
html[data-type-preset="bookmania"]{--font-display:Bookmania,Georgia,serif;--font-body:Graphik,Arial,sans-serif;--display-weight:600;--display-tracking:-.025em}
html[data-type-preset="henrietta"]{--font-display:Henrietta,Georgia,serif;--font-body:Graphik,Arial,sans-serif;--display-weight:600;--display-tracking:-.03em}
body,button,input{font-family:var(--font-body)}
h1,h2,.wordmark,.reward-card strong{font-family:var(--font-display);font-weight:var(--display-weight);letter-spacing:var(--display-tracking)}

.hero{
  min-height:924px;
  background-color:var(--paper);
  background-image:linear-gradient(to right,var(--paper-line) var(--paper-line-width),transparent var(--paper-line-width)),linear-gradient(to bottom,var(--paper-line) var(--paper-line-width),transparent var(--paper-line-width));
  background-size:44px 44px;
  background-position:-1px -1px;
  border-bottom:0;
  overflow:visible;
  z-index:1;
}
.site-header{height:100px}
.brand{gap:10px}
.brand>span:first-child{width:40px}
.wordmark{font-size:40px}
.nav-cta{
  min-height:52px;
  padding:13px 20px;
  border:2px solid var(--ink);
  border-radius:9px;
  background:var(--yellow);
  color:var(--ink);
  box-shadow:5px 5px 0 var(--chalk);
  font-size:14px;
  transition:transform 160ms var(--ease),box-shadow 160ms var(--ease),background 160ms ease;
}
.nav-cta:hover{background:#ffe477;transform:translate(2px,2px);box-shadow:3px 3px 0 var(--chalk)}
.hero-inner{
  height:780px;
  grid-template-columns:minmax(440px,.9fr) minmax(520px,1.1fr);
  align-items:center;
}
.hero-copy{grid-column:2;grid-row:1;padding:0 0 44px;z-index:3;transform:translate(-88px,-55px)}
.hero h1{
  max-width:650px;
  font-size:clamp(60px,6vw,82px);
  line-height:.96;
  letter-spacing:var(--display-tracking);
}
.hero h1 mark{
  display:inline;
  color:inherit;
  background:linear-gradient(transparent 59%,#f5ce55 59%,#f5ce55 94%,transparent 94%);
  padding:0 .05em;
}
.hero-description{max-width:545px;margin-top:28px;font-size:18px;line-height:1.55}
.hero-waitlist{margin-top:32px}
.waitlist-form label{font-size:14px;margin-bottom:11px}
.signup-row{max-width:560px}
.signup-row input{height:62px;border-radius:9px 0 0 9px;background:#fffdf7;font-size:16px}
.signup-row button{height:62px;border-radius:0 9px 9px 0;font-size:14px;padding-inline:20px;background:var(--blue)}
.form-note,.form-status{font-size:12px;margin-top:10px}
.hero-character{grid-column:1;grid-row:1;height:100%;z-index:4}
.mascot-button{width:min(570px,50vw);right:auto;left:-178px;top:auto;bottom:-185px;transform:rotate(7deg);transform-origin:50% 82%}
.mascot-status{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}
main{
  background-color:var(--chalk);
  background-image:linear-gradient(var(--paper) 0 28px,transparent 28px),linear-gradient(to right,rgba(37,43,38,.075) var(--paper-line-width),transparent var(--paper-line-width)),linear-gradient(to bottom,rgba(37,43,38,.075) var(--paper-line-width),transparent var(--paper-line-width));
  background-size:100% 100%,44px 44px,44px 44px;
  background-position:0 0,-1px -1px,-1px calc(var(--overview-grid-anchor, 0px) - 1px);
}
.manifesto{position:relative;z-index:0;padding-top:245px;background:var(--ink);border-radius:28px;margin-bottom:88px}
.manifesto::before{display:none}
.mascot-trail{position:absolute;inset:0;width:100%;height:100%;overflow:hidden;border-radius:inherit;pointer-events:none;color:color-mix(in srgb,var(--ink) 97.5%,var(--chalk) 2.5%)}
.mascot-trail path{stroke:currentColor;stroke-width:clamp(16px,2vw,32px);stroke-linecap:round;stroke-linejoin:round}
.manifesto-inner{position:relative;z-index:1;width:min(var(--content),calc(100% - 96px))}

.feature{
  width:min(var(--content),calc(100% - 96px));
  margin:0 auto 44px;
  padding:72px 0 48px;
  color:var(--chalk);
  background:var(--ink);
  border:0;
  border-radius:28px;
  overflow:hidden;
}
.feature-coral,.feature-blue,.feature-yellow,.feature-green{background:var(--ink)}
.feature .feature-inner{width:calc(100% - 88px)}
.feature-heading p{color:rgba(248,245,236,.72)}
.feature-art,.factory-art,.voice-art,.context-art,.rewards-art{
  width:100%;
  margin:52px 0 0;
  padding:30px 34px 0;
  color:var(--ink);
  border-radius:22px;
  overflow:hidden;
}
.feature-coral .feature-art{background:var(--coral)}
.feature-blue .feature-art{background:var(--blue)}
.feature-yellow .feature-art{background:var(--yellow)}
.feature-green .feature-art{background:var(--green)}
.feature-art figcaption{padding-inline:2px}
.feature .theme-picker button{color:var(--chalk);border-color:var(--chalk)}
.feature .theme-picker button[aria-pressed="true"]{color:var(--ink);background:var(--chalk)}

.type-lab{
  position:fixed;
  z-index:30;
  left:50%;
  bottom:18px;
  width:min(860px,calc(100% - 32px));
  min-height:76px;
  transform:translateX(-50%);
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:18px;
  padding:13px 52px 13px 16px;
  color:var(--chalk);
  background:rgba(31,34,31,.96);
  border:1px solid rgba(255,255,255,.2);
  border-radius:12px;
  box-shadow:0 12px 38px rgba(0,0,0,.2);
  backdrop-filter:blur(12px);
}
.type-lab-heading{display:grid;gap:2px;white-space:nowrap}
.type-lab-heading strong{font-size:13px;font-weight:500}
.type-lab-heading span,.type-lab>p{font-size:10px;line-height:1.35;color:rgba(255,255,255,.65)}
.type-lab-options{display:flex;justify-content:center;gap:6px}
.type-lab-options button{min-height:42px;padding:8px 12px;border:1px solid rgba(255,255,255,.24);border-radius:7px;background:transparent;color:var(--chalk);font-size:12px}
.type-lab-options button span{opacity:.48;margin-right:5px}
.type-lab-options button[aria-pressed="true"]{background:var(--chalk);color:var(--ink);border-color:var(--chalk)}
.type-lab>p{max-width:145px}
.type-lab-close{position:absolute;right:12px;top:50%;width:32px;height:32px;transform:translateY(-50%);border-radius:50%;background:transparent;color:var(--chalk);font-size:23px;line-height:1}
.type-lab-close:hover{background:rgba(255,255,255,.1)}

@media(max-width:1060px){
  .hero{min-height:880px}
  .hero-inner{height:760px;grid-template-columns:minmax(360px,.85fr) minmax(460px,1.15fr)}
  .hero-copy{transform:translate(-44px,-45px)}
  .hero h1{font-size:clamp(60px,7.7vw,82px)}
  .mascot-button{width:min(520px,50vw);left:-158px;right:auto;top:auto;bottom:-170px}
}
@media(max-width:760px){
  .site-header{height:82px}
  .brand>span:first-child{width:31px}
  .wordmark{font-size:34px}
  .nav-cta{min-height:44px;padding:10px 13px;font-size:12px;box-shadow:4px 4px 0 var(--chalk)}
  .hero{min-height:0;background-size:32px 32px}
  .hero-inner{height:auto;padding-top:54px}
  .hero-copy{grid-column:auto;grid-row:auto;padding:0;text-align:center;transform:none}
  .hero h1{font-size:clamp(52px,14vw,74px);line-height:.97}
  .hero-description{max-width:500px;margin:24px auto 0;font-size:16px;line-height:1.55}
  .hero-waitlist{max-width:520px;margin-top:28px}
  .waitlist-form label{font-size:13px}
  .signup-row input,.signup-row button{height:58px}
  .signup-row input{font-size:16px}
  .signup-row button{font-size:12px}
  .form-note,.form-status{font-size:11px}
  .hero-character{grid-column:auto;grid-row:auto;height:430px;width:100%;max-width:none;margin-top:10px}
  .mascot-button{width:470px;max-width:112vw;left:-152px;right:auto;top:auto;bottom:-125px;transform:rotate(8deg);transform-origin:50% 82%}
  .manifesto{padding-top:205px}
  .manifesto{border-radius:20px;margin-bottom:56px}
  .manifesto-inner{width:calc(100% - 40px)}
  .feature{width:calc(100% - 40px);margin-bottom:28px;border-radius:20px;padding:58px 0 24px}
  .feature .feature-inner{width:calc(100% - 40px)}
  .feature-art,.factory-art,.voice-art,.context-art,.rewards-art{margin-top:38px;padding:18px 18px 0;border-radius:15px}
  .type-lab{grid-template-columns:1fr;gap:9px;padding:13px 46px 13px 14px}
  .type-lab-heading{display:flex;align-items:baseline;gap:8px}
  .type-lab-options{justify-content:flex-start;overflow-x:auto}
  .type-lab-options button{flex:none}
  .type-lab>p{display:none}
}
@media(max-width:420px){
  .hero-inner{padding-top:42px}
  .hero h1{font-size:clamp(46px,13.7vw,60px)}
  .hero-description{font-size:15px}
  .hero-character{height:380px}
  .mascot-button{width:410px;left:-138px;top:auto;bottom:-115px}
  .manifesto{padding-top:185px}
  .manifesto{border-radius:16px;margin-bottom:40px}
  .manifesto-inner{width:calc(100% - 32px)}
  .feature{width:calc(100% - 32px);border-radius:16px}
  .feature .feature-inner{width:calc(100% - 32px)}
  .feature-art,.factory-art,.voice-art,.context-art,.rewards-art{padding:14px 14px 0;border-radius:12px}
}

/* The black section peeks into the first screen, while the character crosses
   its top edge. Keep the mascot anchored to the same viewport corner. */
:root{--hero-peek:clamp(68px,calc(46px + 3.6svh),96px)}
.hero{
  --hero-mascot-size:min(42vw,64svh,700px);
  --hero-eye-clearance:clamp(10px,calc(var(--hero-mascot-size) * .03),20px);
  min-height:max(680px,calc(100svh - var(--hero-peek)));
  display:flex;
  flex-direction:column;
  overflow:visible;
}
.hero-inner{
  position:static;
  display:flex;
  flex:1;
  height:auto;
  min-height:580px;
  align-items:flex-start;
  justify-content:center;
  padding:clamp(56px,8svh,100px) 0 calc(clamp(92px,12svh,140px) - var(--hero-peek));
}
.hero-copy{
  width:min(700px,62vw);
  flex:none;
  padding:0;
  margin-left:0;
  transform:none;
  text-align:center;
}
.hero h1{max-width:none;font-size:clamp(58px,5.2vw,82px);line-height:1.02}
.hero-description{margin:28px auto 0;max-width:560px;transform:translateY(9px) scale(.963758)}
.hero-cta{position:relative;top:5px}
.hero-waitlist{max-width:560px;margin:32px auto 0;text-align:center}
.signup-row{margin-inline:auto}
.hero-character{
  position:absolute;
  inset:0;
  width:auto;
  max-width:none;
  height:auto;
  margin:0;
  pointer-events:none;
  z-index:2;
}
.mascot-button{
  width:var(--hero-mascot-size);
  max-width:none;
  left:calc(var(--hero-mascot-size) * -.22);
  bottom:calc(var(--hero-mascot-size) * -.25 - var(--hero-peek));
  top:auto;
  right:auto;
  transform:rotate(7deg);
  transform-origin:50% 82%;
  pointer-events:auto;
}
/* Compact overview, with enough clearance for the overlapping hero mascot. */
.manifesto{padding-block:clamp(120px,calc(5vw + 60px),176px) 64px}
@media(min-width:1001px){
  .hero{
    --hero-mascot-base:min(42vw,64svh,700px,max(340px,calc(50vw - 208px)));
    --hero-mascot-size:calc(var(--hero-mascot-base) * 1.03);
    --hero-band-height:clamp(24px,3.6svh,34px);
    /* The eye bottom and the black edge now follow the same scaled mascot size. */
    --hero-mascot-lift:calc(var(--hero-mascot-size) * .015 - 3px);
    --hero-peek:clamp(0px,calc(var(--hero-mascot-size) * .123 - var(--hero-eye-clearance) - var(--hero-band-height)),52px);
    background-position:-1px calc(100% - var(--hero-band-height));
  }
  .mascot-button{bottom:calc(var(--hero-mascot-size) * -.25 - var(--hero-peek) + var(--hero-mascot-lift))}
  .hero::after{
    content:"";
    position:absolute;
    inset:auto 0 0;
    height:var(--hero-band-height);
    background:var(--ink);
    border-radius:28px 28px 0 0;
    pointer-events:none;
    z-index:1;
  }
  .manifesto{
    border-radius:0 0 28px 28px;
    /* Center within the full dark panel, including the band at the hero's foot. */
    --overview-inset:calc((clamp(120px,calc(5vw + 60px),176px) + 64px)/2);
    --overview-band-half:calc(clamp(24px,3.6svh,34px)/2);
    padding-block:calc(var(--overview-inset) - var(--overview-band-half)) calc(var(--overview-inset) + var(--overview-band-half));
  }
}
@media(max-width:1000px){
  .hero{
    --hero-mascot-size:clamp(340px,62vw,560px);
    --hero-peek:clamp(20px,calc(var(--hero-mascot-size) * .108 - var(--hero-eye-clearance)),48px);
    background-position:-1px 100%;
  }
  .hero-inner{min-height:0;padding:48px 0 calc(var(--hero-mascot-size) * .86 + 48px - var(--hero-peek))}
  .hero-copy{width:min(650px,100%);margin:0}
  .hero h1{font-size:clamp(44px,7.8vw,74px)}
  .hero-description{max-width:520px}
  .manifesto{padding-top:clamp(124px,15vw,164px)}
}
@media(max-width:760px){
  .hero{--hero-mascot-size:clamp(330px,76vw,500px)}
  .hero-inner{padding-top:38px;padding-bottom:calc(var(--hero-mascot-size) * .86 + 36px - var(--hero-peek))}
  .hero h1{font-size:clamp(38px,9.4vw,66px)}
  .hero-description{margin-top:24px;font-size:16px}
  .hero-waitlist{margin-top:26px}
  .manifesto{padding-block:clamp(110px,18vw,145px) 48px}
}
@media(max-width:420px){
  .site-header{gap:12px}
  .site-header .brand{gap:6px}
  .site-header .brand>span:first-child{width:26px}
  .site-header .wordmark{font-size:28px}
  .nav-cta{font-size:10px;gap:6px;padding-inline:9px;white-space:nowrap}
  .hero h1{font-size:clamp(34px,9.4vw,40px)}
  .hero-description{font-size:15px}
}

/* A sharper headline serif contrasts with the supporting typewriter copy. */

.nav-cta{background:var(--yellow);box-shadow:5px 5px 0 var(--coral)}
.nav-cta:hover{background:#ffe477;box-shadow:3px 3px 0 var(--coral)}
.hero h1{
  font-family:Henrietta,Georgia,serif;
  font-size:clamp(60px,5.8vw,88px);
  font-weight:600;
  line-height:1.02;
  letter-spacing:-.035em;
  color:var(--ink);
}
.hero h1 span{display:block}
.hero-description{
  font-family:'PT Mono',monospace;
  font-size:17px;
  line-height:1.65;
  letter-spacing:-.025em;
  max-width:590px;
  margin-top:32px;
}
@media(max-width:760px){
  .nav-cta{box-shadow:4px 4px 0 var(--coral)}
  .hero h1{font-size:clamp(38px,10vw,68px)}
  .hero-description{font-size:14px;line-height:1.6;margin-top:26px;max-width:470px}
}
@media(max-width:420px){
  .hero h1{font-size:clamp(32px,10vw,42px)}
  .hero-description{font-size:13px;letter-spacing:-.035em}
}

/* One clear invitation; the email form opens in the native modal layer. */
html{scrollbar-gutter:stable}
html.waitlist-open{overflow:hidden}
.hero-waitlist{margin-top:36px}
.hero-cta{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:76px;
  padding:15px 32px;
  border:2px solid var(--ink);
  border-radius:12px;
  background:var(--yellow);
  box-shadow:6px 6px 0 var(--coral);
  font-family:Gooper,Georgia,serif;
  font-size:27px;
  font-weight:600;
  letter-spacing:-.025em;
  transition:transform 160ms var(--ease),box-shadow 160ms var(--ease),background 160ms ease;
}
.hero-cta:hover{background:#ffe477;transform:translate(2px,2px);box-shadow:4px 4px 0 var(--coral)}
.hero-cta:active{transform:translate(5px,5px);box-shadow:1px 1px 0 var(--coral)}
.hero-cta-note{margin-top:21px;font-size:13px}
.waitlist-dialog{
  width:min(500px,calc(100% - 32px));
  max-height:calc(100dvh - 32px);
  padding:42px 34px 30px;
  border:2px solid var(--ink);
  border-radius:16px;
  color:var(--ink);
  background:var(--paper);
  box-shadow:8px 8px 0 var(--coral);
  overflow:auto;
}
.waitlist-dialog::backdrop{background:rgba(25,29,24,.58)}
.dialog-close{position:absolute;top:10px;right:10px;display:grid;place-items:center;width:44px;height:44px;background:transparent;border-radius:50%;font-size:30px;line-height:1}
.dialog-close:hover{background:var(--yellow)}
.waitlist-dialog h2{font-family:Henrietta,Georgia,serif;font-size:46px;line-height:1.02;padding-right:26px}
.waitlist-dialog>p{font-size:15px;line-height:1.6;margin-top:18px;max-width:340px}
.waitlist-dialog .waitlist-form{margin-top:28px}
.waitlist-dialog label{text-align:left;font-size:13px}
.waitlist-dialog .signup-row{display:flex;flex-direction:column;gap:12px}
.waitlist-dialog input{border:2px solid var(--ink);border-radius:8px;height:56px;background:#fff;font-size:16px}
.waitlist-dialog .signup-row button{justify-content:center;gap:24px;border:2px solid var(--ink);border-radius:8px;background:var(--yellow);height:56px;font-size:14px}
.waitlist-dialog .signup-row button:hover{background:var(--ink);color:var(--yellow)}
.waitlist-dialog .form-note,.waitlist-dialog .form-status{text-align:left;font-size:12px;line-height:1.5}
.waitlist-dialog .form-note{margin-top:18px}
@media(max-width:760px){
  .hero-cta{font-size:23px;min-height:68px;padding:12px 28px}
  .hero-cta-note{font-size:12px}
  .waitlist-dialog{padding:40px 24px 24px}
  .waitlist-dialog h2{font-size:38px}
}
@media(max-width:360px){.hero-cta{font-size:21px;padding-inline:24px}}

.site-header .brand>.wordmark{width:auto;white-space:nowrap}

/* Temporary local font evaluation: crop only the sample's empty canvas with CSS. */
.hero h1.seller-font-preview{display:flex;flex-direction:column;align-items:center;gap:clamp(10px,1.3vw,20px);padding-block:8px}
.hero h1.seller-font-preview>span{display:block;overflow:hidden;flex:none}
.hero h1.seller-font-preview img{display:block;max-width:none;height:auto}
.hero h1.preview-remove-white img{filter:url(#preview-ink)}
.font-review-panel{position:fixed;right:20px;bottom:20px;z-index:12;width:430px;max-width:calc(100% - 32px);padding:14px;background:var(--chalk);color:var(--ink);border:2px solid var(--ink);border-radius:12px;box-shadow:4px 4px 0 var(--coral);font-family:Arial,sans-serif}
.font-review-panel>p:first-child{font-size:12px;font-weight:700;margin-bottom:9px}
.font-review-options{display:flex;gap:5px}
.font-review-options button{flex:1;min-width:0;min-height:42px;padding:8px 7px;background:transparent;border:1px solid var(--ink);border-radius:6px;font-size:12px;font-weight:600}
.font-review-options button[aria-pressed="true"]{background:var(--yellow);border-width:2px}
.font-review-options button:hover{background:var(--yellow)}
.font-review-status{font-size:11px;line-height:1.4;margin-top:9px}
.font-review-source{display:inline-block;font-size:11px;text-decoration:underline;text-underline-offset:3px;margin-top:5px;padding-block:3px}
.font-review-shape{display:flex;align-items:center;gap:14px;margin-top:10px;padding-top:10px;border-top:1px solid rgb(25 32 25 / 18%)}
.font-review-shape>span{font-size:12px;font-weight:600;flex:1}
.font-review-shape .font-review-options{display:flex;flex:3}
.hero h1.seller-font-preview.headline-arranged{gap:clamp(17px,2vw,30px);padding-block:18px}
.hero h1.seller-font-preview>.arranged-sample-line{position:relative;overflow:visible}
.hero h1 .arranged-sample-glyph{position:absolute;display:block;height:100%;overflow:hidden;transform-origin:50% 65%}
.hero h1 .arranged-text-line{white-space:nowrap}
.hero h1 .arranged-text-letter{display:inline-block;transform-origin:50% 70%}
.hero h1.headline-arranged:not(.seller-font-preview):not(.trable-headline){line-height:1.16;padding-block:.1em}
@media(max-width:760px){.font-review-panel{right:16px;bottom:12px;padding:10px;width:320px}.font-review-options{display:grid;grid-template-columns:1fr 1fr}.font-review-options button{min-height:44px}}

/* Local supporting typography sets; headline lettering and wordmark stay independent. */
.font-review-panel{max-height:calc(100dvh - 32px);overflow-y:auto}
.font-review-panel button,.font-review-panel select{font-family:Arial,sans-serif}
.font-review-set{margin-top:10px;padding-top:10px;border-top:1px solid rgb(25 32 25 / 18%)}
.font-review-set label{display:block;font-size:12px;font-weight:600;margin-bottom:7px}
.font-review-set select{width:100%;min-height:44px;border:1px solid var(--ink);border-radius:6px;background:var(--chalk);color:var(--ink);padding:8px;font-size:14px}
.font-review-set select:focus-visible{outline:3px solid var(--ink);outline-offset:3px}
.font-review-set-note{font-size:11px;line-height:1.45;margin-top:7px}
html[data-support-type]{--support-body:Graphik,Arial,sans-serif;--support-heading:Graphik,Arial,sans-serif;--support-heading-weight:500}
html[data-support-type="monument"]{--support-body:Monument,Arial,sans-serif;--support-heading:Monument,Arial,sans-serif}
html[data-support-type="editorial"]{--support-heading:Henrietta,Georgia,serif;--support-heading-weight:600}
html[data-support-type] body{font-family:var(--support-body)}
html[data-support-type] :is(.hero-description,.hero-cta,.nav-cta,.closing-cta,.waitlist-dialog input,.waitlist-dialog button,.scene-toggle,.theme-picker button,.motion-toggle){font-family:var(--support-body)}
html[data-support-type] :is(main h2,.waitlist-dialog h2){font-family:var(--support-heading);font-weight:var(--support-heading-weight);letter-spacing:-.025em;line-height:1.12}
html[data-support-type] :is(.feature-heading h2,.manifesto h2,.faq-intro h2,.closing h2){font-size:clamp(2.125rem,4.2vw,3.5rem)}
html[data-support-type] :is(.manifesto h2,.closing h2){line-height:1.18}
html[data-support-type] .waitlist-dialog h2{font-size:clamp(1.75rem,3vw,2rem);line-height:1.2}
html[data-support-type] .hero-description{font-size:1.0625rem;line-height:1.55;letter-spacing:0;max-width:48ch}
html[data-support-type] :is(.feature-body>p:first-child,.faq-list details>p,.manifesto p,.faq-intro p,.waitlist-dialog>p){font-size:clamp(1rem,1.5vw,1.125rem);line-height:1.6;letter-spacing:0}
html[data-support-type] .feature-body>p:first-child{max-width:45ch}
html[data-support-type] .faq-list details>p{max-width:65ch}
html[data-support-type] .faq-list summary{font-size:clamp(1.125rem,1.7vw,1.25rem);line-height:1.35;font-weight:500}
html[data-support-type] :is(.hero-cta,.closing-cta){font-size:clamp(1.0625rem,1.5vw,1.125rem);font-weight:500;letter-spacing:0;line-height:1.25}
html[data-support-type] .nav-cta{font-size:clamp(.9375rem,1.3vw,1rem);font-weight:500}
html[data-support-type] :is(.feature-heading>p,.feature-art figcaption,.hero-cta-note,.closing small,.site-footer p,.theme-status,.scene-toggle,.motion-toggle,.theme-picker button,.waitlist-dialog label,.waitlist-dialog .form-note,.waitlist-dialog .form-status){font-size:.875rem;line-height:1.45;letter-spacing:0}
html[data-support-type] .waitlist-dialog input{font-size:1rem}
html[data-support-type] .waitlist-dialog .signup-row button{font-size:1rem;font-weight:500}
@media(max-width:760px){
  html[data-support-type] :is(.feature-heading>p,.feature-art figcaption,.hero-cta-note,.closing small,.site-footer p,.theme-status,.scene-toggle,.motion-toggle){font-size:.8125rem}
  .font-review-set select{font-size:16px}
}

/* Keep the local comparison tools out of the composition until requested. */
.font-review-panel>p:first-child{padding-right:40px;min-height:28px;display:flex;align-items:center}
.font-review-close{position:absolute;top:5px;right:5px;width:44px;height:44px;background:transparent;border-radius:6px;color:var(--ink);font-size:25px;line-height:1}
.font-review-close:hover{background:var(--yellow)}
.font-review-launcher{position:fixed;right:20px;bottom:20px;z-index:12;min-height:44px;padding:10px 17px;border:2px solid var(--ink);border-radius:9px;background:var(--chalk);color:var(--ink);box-shadow:3px 3px 0 var(--coral);font:600 13px Arial,sans-serif}
.font-review-launcher:hover{background:var(--yellow)}
@media(max-width:760px){.font-review-launcher{right:16px;bottom:12px}}

/* A warmer supporting voice for the handmade Trable headline. */



html[data-support-type="degular"]{--support-body:'Degular Text',Arial,sans-serif;--support-heading:Degular,Arial,sans-serif;--support-heading-weight:700}
html[data-support-type="degular"] .hero-description{font-size:clamp(1.1875rem,1.8vw,1.4375rem);line-height:1.45;max-width:46ch;letter-spacing:.005em}
html[data-support-type="degular"] :is(.hero-cta,.nav-cta,.closing-cta,.waitlist-dialog .signup-row button,.faq-list summary){font-weight:700}

/* Exact Trable lettering, cropped with CSS from the unchanged local seller sample. */
.site-header .brand>.wordmark.trable-wordmark,.site-footer .wordmark.trable-wordmark{display:block;width:144px;flex:none;line-height:1}
@media(max-width:760px){.site-header .brand>.wordmark.trable-wordmark,.site-footer .wordmark.trable-wordmark{width:116px}}


/* Side-by-side feature stories; only the component's own colored frame remains. */
.feature.feature-horizontal{padding:48px 0}
.feature-horizontal .feature-inner{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.15fr);gap:48px;align-items:center}
.feature-horizontal .feature-copy{grid-column:1;grid-row:1;min-width:0}
.feature-horizontal .feature-body{padding:0;margin:24px 0 0;max-width:42ch;justify-self:start}
.feature-horizontal .feature-body>p:first-child{max-width:42ch}
.feature-horizontal .feature-heading>p{margin-bottom:16px}
.feature-horizontal .feature-art{grid-column:2;grid-row:1;width:100%;margin:0;padding:0;background:transparent;border:0;border-radius:0;overflow:visible;color:var(--chalk);min-width:0}
.feature-horizontal .feature-art figcaption{gap:12px;padding:8px 0 0;min-height:44px;align-items:center}
.feature-horizontal .scene-toggle{flex:none}
.feature-horizontal .feature-inner-reverse{grid-template-columns:minmax(0,1.15fr) minmax(0,.9fr)}
.feature-horizontal .feature-inner-reverse .feature-copy{grid-column:2}
.feature-horizontal .feature-inner-reverse .feature-art{grid-column:1}
html[data-support-type] .feature-horizontal .feature-heading h2,.feature-horizontal .feature-heading h2{font-size:clamp(2rem,3.35vw,3rem);line-height:1.12}
.feature-horizontal .feature-heading h2 br{display:none}
@media(min-width:901px) and (max-width:1100px){
  .feature-horizontal .feature-inner{gap:30px;width:calc(100% - 56px)}
}
@media(max-width:900px){
  .feature.feature-horizontal{padding:32px 0}
  .feature-horizontal .feature-inner,.feature-horizontal .feature-inner-reverse{display:flex;flex-direction:column;align-items:stretch;gap:30px}
  .feature-horizontal .feature-copy{order:0}
  .feature-horizontal .feature-art{order:1}
  .feature-horizontal .feature-body{margin-top:18px;max-width:52ch}
  .feature-horizontal .feature-body>p:first-child{max-width:52ch}
}

/* Ink borders frame the colored scenes on the open page. */
.feature-horizontal .nf-art>g>rect[width="752"],
.feature-horizontal .nv-art>[data-part="stage"],
.feature-horizontal .nc-art [data-part="stage"]{stroke:#191D18}

/* Keep voice copy in the shared grid, with the ribbon scene spanning behind it. */
@media(min-width:901px){
  .feature-blue.feature-horizontal .feature-inner{display:grid;position:relative}
  .feature-blue.feature-horizontal .feature-copy{
    /* Center the copy in the space from the blue frame's outer edge (643/1120)
       to the viewport edge, retaining the shared chapter text width. */
    --voice-stage-right:57.410714cqw;
    --voice-page-gutter:calc((100vw - 100cqw) / 2);
    --voice-copy-width:calc((100cqw - var(--feature-column-gap)) * .4146341463);
    position:relative;grid-column:1/-1;grid-row:1;z-index:2;
    width:var(--voice-copy-width);
    margin-left:calc((var(--voice-stage-right) + 100cqw + var(--voice-page-gutter) - var(--voice-copy-width)) / 2);
    padding-top:12.410714cqw;padding-bottom:88px;
  }
  .feature-blue.feature-horizontal .voice-art{grid-column:1/-1;grid-row:1;width:100%;align-self:stretch;display:flex;flex-direction:column}
  .feature-blue.feature-horizontal .nv-component{aspect-ratio:112/53;overflow:visible}
  .feature-blue.feature-horizontal .nv-art,.feature-blue.feature-horizontal .nv-component>img{width:100%;aspect-ratio:112/50}
  .feature-blue.feature-horizontal .voice-art figcaption{position:relative;margin-top:auto}
  .feature-green.feature-horizontal .feature-art{align-self:stretch;display:flex;flex-direction:column}
  .feature-green.feature-horizontal .feature-art .reward-stage{height:auto;min-height:var(--reward-art-height);flex:1}
}
@media(max-width:900px){
  .feature-blue.feature-horizontal .voice-art{width:calc(100% + 40px);margin-inline:-20px}
  .feature-blue.feature-horizontal .voice-art figcaption{padding-inline:20px}
  .feature-blue.feature-horizontal .nv-component{aspect-ratio:1.1;overflow:hidden}
  .feature-blue.feature-horizontal .nv-art,.feature-blue.feature-horizontal .nv-component>img{width:180%;max-width:none;aspect-ratio:112/50;margin-left:-10%}
}

/* Open feature sections: the artwork supplies the color, spacing supplies the structure. */
.feature,.feature.feature-horizontal{
  width:min(1320px,calc(100% - 96px));
  margin:0 auto;
  padding:clamp(48px,4.2vw,64px) 0;
  background:transparent;
  color:var(--ink);
  border:0;
  border-radius:0;
  overflow:visible;
}
.feature .feature-inner{width:100%}
.feature .feature-heading>p{color:var(--ink)}
.feature-horizontal .feature-art{color:var(--ink)}
.feature-horizontal .feature-inner{grid-template-columns:minmax(0,.85fr) minmax(0,1.2fr);gap:64px}
.feature-horizontal .feature-inner-reverse{grid-template-columns:minmax(0,1.2fr) minmax(0,.85fr)}
.feature .theme-picker button{color:var(--ink);border-color:var(--ink)}
.feature .theme-picker button[aria-pressed="true"]{color:var(--chalk);background:var(--ink)}
@media(max-width:1100px){
  .feature-horizontal .feature-inner{gap:40px}
}
@media(max-width:900px){
  .feature,.feature.feature-horizontal{width:calc(100% - 48px);padding:40px 0}
  .feature-horizontal .feature-inner{gap:32px}
  .feature-blue.feature-horizontal .voice-art{width:100%;margin-inline:0}
  .feature-blue.feature-horizontal .voice-art figcaption{padding-inline:0}
}

/* Handwritten chapter titles, with a quiet irregular baseline. */


html .feature .feature-heading h2.handwritten-title{
  font-family:Kalam,cursive;
  font-weight:700;
  font-size:clamp(3.5rem,5.8vw,5.25rem);
  line-height:1.15;
  letter-spacing:-.025em;
  white-space:nowrap;
  transform:rotate(-2deg);
  transform-origin:left center;
  margin-block:8px 12px;
}
.handwritten-title>span{display:inline-block}
.handwritten-title>span:nth-child(4n+1){transform:translateY(.018em) rotate(-3deg)}
.handwritten-title>span:nth-child(4n+2){transform:translateY(-.035em) rotate(2deg)}
.handwritten-title>span:nth-child(4n+3){transform:translateY(.028em) rotate(-1deg)}
.handwritten-title>span:nth-child(4n){transform:translateY(-.015em) rotate(3deg)}
html .feature-blue .feature-heading h2.handwritten-title,
html .feature-green .feature-heading h2.handwritten-title{transform:rotate(1.5deg)}
html[data-section-lettering="alfredino"] .feature .feature-heading h2.handwritten-title{font-family:Alfredino,cursive;font-weight:400;letter-spacing:0}
html[data-section-lettering="clean"] .feature .feature-heading h2.handwritten-title{font-family:var(--support-heading,Gooper);font-weight:var(--support-heading-weight,600);font-size:clamp(3rem,4.8vw,4.5rem);transform:none}
html[data-section-lettering="clean"] .handwritten-title>span{transform:none}
html .handwritten-title>.section-trable-sample{display:block;max-width:100%;overflow:hidden;transform:none}
.section-trable-sample>img{display:block;max-width:none;height:auto;filter:url(#preview-ink)}
@media(min-width:901px) and (max-width:1100px){
  html .feature .feature-heading h2.handwritten-title{font-size:3.6rem}
}
@media(max-width:900px){
  html .feature .feature-heading h2.handwritten-title{font-size:clamp(3.25rem,12vw,4.5rem)}
}

/* More substantial supporting text for the expressive Trable lettering. */


html:is([data-support-type="bricolage"],[data-support-type="new-spirit"]){--support-body:Bricolage,Arial,sans-serif;--support-heading:Bricolage,Arial,sans-serif;--support-heading-weight:650}
html:is([data-support-type="bricolage"],[data-support-type="new-spirit"]) body{font-weight:500;font-optical-sizing:auto}
html:is([data-support-type="bricolage"],[data-support-type="new-spirit"]) .feature-body>p:first-child{
  font-size:clamp(1.125rem,1.55vw,1.375rem);
  font-weight:500;
  line-height:1.5;
  letter-spacing:-.012em;
  max-width:36ch;
}
html:is([data-support-type="bricolage"],[data-support-type="new-spirit"]) .hero-description{font-size:clamp(1.125rem,1.7vw,1.375rem);font-weight:500;line-height:1.5;max-width:46ch;letter-spacing:-.01em}
html:is([data-support-type="bricolage"],[data-support-type="new-spirit"]) :is(.hero-cta,.nav-cta,.closing-cta,.faq-list summary){font-weight:650}
html:is([data-support-type="bricolage"],[data-support-type="new-spirit"]) .feature-heading>p{font-weight:600}
html[data-support-type="new-spirit"] :is(.hero-description,.feature-body>p:first-child,.faq-list details>p,.manifesto p,.faq-intro p){font-family:'New Spirit',Georgia,serif;font-weight:400;letter-spacing:0}
@media(min-width:901px) and (max-width:1100px){
  html:is([data-support-type="bricolage"],[data-support-type="new-spirit"]) .feature-blue .feature-body>p:first-child{font-size:1.125rem}
}

/* Product overview and a shared top edge for each feature story. */
:root{
  --overview-gap:64px;
  --overview-paragraph-gap:22px;
  --overview-copy-size:clamp(1.0625rem,1.45vw,1.25rem);
  --feature-column-gap:64px;
  --reward-frame-radius:32px;
  --reward-frame-border:4px;
  --reward-art-height:440px;
  --reward-card-width:62%;
  --reward-card-height:260px;
  --reward-card-type:clamp(4rem,7vw,6rem);
}
.manifesto .manifesto-inner{display:grid;grid-template-columns:1fr 1.15fr;gap:var(--overview-gap);align-items:start}
.manifesto .overview-heading{align-self:center;padding-block:64px}
.manifesto #manifesto-title{font-family:var(--support-body,Monument,Arial,sans-serif);font-size:clamp(4rem,9vw,8rem);line-height:1.12;font-weight:400;color:#fff}
.manifesto #manifesto-title .overview-noggin{display:block;font-family:'Trable-Regular',sans-serif;font-weight:400;font-synthesis:none;font-feature-settings:'ss01' 1;letter-spacing:0;color:var(--yellow);white-space:nowrap}
.faq-panel{position:relative;overflow:hidden;height:756px;margin-top:132px;background:var(--ink);color:var(--chalk);border-radius:28px}
.faq-mascot-outline{position:absolute;bottom:-145px;left:-115px;width:clamp(330px,33vw,510px);height:auto;pointer-events:none;transform:rotate(18deg);opacity:.08}
.faq-mascot-outline svg{display:block;width:100%;height:auto;transform:scale(1.15);transform-origin:left bottom}
.faq-panel .faq{position:relative;height:100%;min-height:0;--faq-edge:max(48px,calc((100vw - var(--content))/2))}
.faq-panel .faq-intro,.faq-panel .faq-list{translate:0 -24px}
.faq-panel .faq-list{min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:rgb(247 247 242 / 30%) transparent}
.faq-panel .faq-intro{margin-left:calc(-1 * var(--faq-edge));margin-right:-100px;text-align:center;padding-inline:24px}
.faq-panel #faq-title{font-family:'Trable-Regular',sans-serif;font-synthesis:none;font-feature-settings:'ss01' 1;white-space:nowrap;font-size:clamp(3.5rem,5.4vw,5rem);font-weight:400;line-height:1.15;letter-spacing:0;color:var(--yellow)}
@media(max-width:1060px){.faq-panel .faq{--faq-edge:32px}.faq-panel .faq-intro{margin-right:-60px}}
@media(max-width:760px){.faq-panel .faq-intro{margin:0;padding:0}}
.faq-panel .faq-list details{border-color:rgb(247 247 242 / 30%)}
.faq-panel .faq-list summary span{color:var(--yellow)}
.faq-panel summary:focus-visible{outline:2px solid var(--yellow);outline-offset:6px;border-radius:4px}
@media(max-width:760px){.faq-panel{height:auto;border-radius:20px;padding-bottom:250px}.faq-panel .faq{height:auto}.faq-panel .faq-list{overflow:visible}.faq-mascot-outline{width:330px;left:-75px;bottom:-95px}}
.overview-jumbled-letter,.faq-jumbled-letter{display:inline-block;transform-origin:50% 70%}
.manifesto #manifesto-title .overview-question{display:inline-block;color:inherit;transform:translateY(-.08em)}
.manifesto .overview-copy p{max-width:none;font-size:var(--overview-copy-size);line-height:1.65;font-weight:400}
.manifesto .overview-copy p+p{margin-top:var(--overview-paragraph-gap)}
.feature-horizontal .feature-inner{container-type:inline-size;align-items:start;gap:var(--feature-column-gap)}
.feature-green.feature-horizontal .reward-stage{height:var(--reward-art-height);background:var(--green);border:var(--reward-frame-border) solid var(--ink);border-radius:var(--reward-frame-radius);overflow:hidden}
.feature-green.feature-horizontal .reward-card{width:var(--reward-card-width);height:var(--reward-card-height)}
.feature-green.feature-horizontal .reward-card strong{font-size:var(--reward-card-type)}
@media(min-width:901px){
  .manifesto .overview-heading{transform:translateY(12px)}
  /* SVG stage tops: factory 1/760; context 31/760; voice 139/1120, including their strokes. */
  .feature-coral.feature-horizontal .feature-copy{padding-top:calc((100cqw - var(--feature-column-gap)) * .00077022)}
  .feature-yellow.feature-horizontal .feature-copy{padding-top:calc((100cqw - var(--feature-column-gap)) * .02387677)}
}
@media(max-width:1100px){
  :root{--feature-column-gap:40px;--overview-gap:40px;--reward-card-height:220px}
}
@media(max-width:900px){
  :root{--feature-column-gap:32px;--overview-gap:32px;--reward-art-height:330px;--reward-card-height:190px;--reward-card-type:4rem}
  .manifesto .manifesto-inner{grid-template-columns:1fr}
  .manifesto .overview-heading{padding-block:32px 16px}
  .manifesto #manifesto-title{font-size:clamp(3.5rem,12vw,6rem)}
  .feature-horizontal .feature-copy{padding-top:0}
}

/* Figtree remains the baseline hero font; comparison presets control their own copy. */

html:not([data-support-type]) body #hero .hero-description{font-family:Figtree,Arial,sans-serif;font-weight:600;letter-spacing:0}

/* Supporting type comparisons. Trable lettering and illustration type remain independent. */
@font-face{font-family:'Chelsea Market';src:url('assets/logo/type-lab/fonts/chelsea-market-400.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}
html[data-support-type="chelsea-market"]{--support-body:'Chelsea Market',Arial,sans-serif;--support-heading:'Chelsea Market',Arial,sans-serif;--support-heading-weight:400}
html[data-support-type="chelsea-market"] body{font-weight:400}
html[data-support-type="chelsea-market"] :is(.hero-description,.hero-cta,.nav-cta,.closing-cta,.waitlist-dialog .signup-row button,.faq-list summary,.feature-heading>p,.waitlist-dialog label){font-weight:400;letter-spacing:0}


html[data-support-type="figtree"]{--support-body:Figtree,Arial,sans-serif;--support-heading:Figtree,Arial,sans-serif;--support-heading-weight:650;--support-control-weight:600}
html[data-support-type="tt-commons"]{--support-body:'TT Commons Pro',Arial,sans-serif;--support-heading:'TT Commons Pro',Arial,sans-serif;--support-heading-weight:600;--support-control-weight:600}
html[data-support-type="satoshi"]{--support-body:Satoshi,Arial,sans-serif;--support-heading:Satoshi,Arial,sans-serif;--support-heading-weight:700;--support-control-weight:500}
html[data-support-type="bricolage-figtree"]{--support-body:Figtree,Arial,sans-serif;--support-heading:Bricolage,Arial,sans-serif;--support-heading-weight:650;--support-control-weight:600}
html:is([data-support-type="figtree"],[data-support-type="tt-commons"],[data-support-type="satoshi"],[data-support-type="bricolage-figtree"]) body{font-weight:400;font-optical-sizing:auto}
html:is([data-support-type="figtree"],[data-support-type="tt-commons"],[data-support-type="satoshi"],[data-support-type="bricolage-figtree"]) .hero-description{font-weight:500}
html:is([data-support-type="figtree"],[data-support-type="tt-commons"],[data-support-type="satoshi"],[data-support-type="bricolage-figtree"]) :is(.hero-cta,.nav-cta,.closing-cta,.waitlist-dialog .signup-row button,.faq-list summary){font-weight:var(--support-control-weight)}

/* Let the voice ribbons cross the page gutters; the scene keeps its original scale. */
html{overflow-x:clip}
.feature-blue.feature-horizontal .nv-component,
.feature-blue.feature-horizontal .nv-art{overflow:visible}

/* Shared chapter typography and spacing, using Create as the reference. */
html .feature.feature-horizontal .feature-heading>p{
  font-size:1rem;
  line-height:1.5;
  margin-bottom:20px;
}
html[data-section-lettering="trable"] .feature .feature-heading h2.handwritten-title{
  font-size:clamp(4.5rem,7.8vw,7rem);
}
html .feature.feature-horizontal .feature-body{
  width:100%;
  max-width:none;
  margin-top:36px;
}
html .feature.feature-horizontal .feature-body>p:first-child{
  max-width:none;
  font-size:clamp(1.1875rem,1.6vw,1.375rem);
  line-height:1.6;
  letter-spacing:0;
}
@media(max-width:900px){
  html .feature.feature-horizontal .feature-body{margin-top:28px;max-width:56ch}
  html .feature.feature-horizontal .feature-heading>p{font-size:.9375rem;margin-bottom:16px}
  html[data-section-lettering="trable"] .feature .feature-heading h2.handwritten-title{font-size:clamp(3.5rem,16vw,4.75rem)}
  html .feature.feature-horizontal .feature-body>p:first-child{font-size:1.125rem;line-height:1.65}
}

/* Licensed Trable: native text at the approved draft's dimensions and offsets. */
.hero h1.trable-headline{display:flex;flex-direction:column;align-items:center;gap:clamp(10px,1.3vw,20px);padding-block:8px}
.hero h1.trable-headline.headline-arranged{gap:clamp(17px,2vw,30px);padding-block:18px}
@media(min-width:1001px){
  /* Approved editor composition: 110% of the previous 1.13 headline scale. */
  .hero h1.trable-headline{transform:translateY(-70.4024px) scale(1.243);transform-origin:50% 0}
}
.trable-text-line{display:block;position:relative;container-type:inline-size;flex:none;width:100%;overflow:visible}
.trable-letter{position:absolute;display:block;height:100%;transform-origin:50% 65%}
.trable-ink{position:absolute;display:block;font-family:'Trable-Regular',sans-serif;font-weight:400;font-style:normal;font-synthesis:none;font-feature-settings:'ss01' 1;font-kerning:normal;line-height:1;letter-spacing:0;text-transform:none;white-space:pre;color:#000}
/* Use the approved face before the decorative lettering script runs, too. */
h1,h2,.wordmark{font-family:'Trable-Regular',sans-serif}
.trable-heavy-g{-webkit-text-stroke:2px #000;paint-order:stroke fill}
.trable-o-bowl{position:absolute;inset:0;clip-path:inset(33.333% 0 0)}
.trable-o-hat{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
html .handwritten-title>.section-trable-text{display:block;max-width:100%;transform:none}

/* Collect: two slow, opposing loops for backgrounds and companions. */
.feature-green.feature-horizontal .reward-stage.reward-gallery{
  display:flex;flex-direction:column;align-items:stretch;justify-content:center;
  gap:14px;container-type:inline-size;padding:28px 0 32px;
  height:auto;min-height:0;aspect-ratio:1.65;flex:none;
}
.reward-gallery-label{padding-inline:24px;font-size:13px;line-height:1.2;color:var(--ink)}
.reward-window{width:100%;overflow:hidden;flex:none;--reward-gap:16px;--loop-width:200%}
.reward-track{display:flex;width:100%;animation:reward-drift 64s linear infinite;animation-play-state:paused}
.reward-group{display:flex;flex:0 0 var(--loop-width);gap:var(--reward-gap);padding-right:var(--reward-gap);box-sizing:border-box}
.reward-backgrounds .reward-track{animation-direction:reverse}
.reward-background{flex:0 0 calc((100% - 5 * var(--reward-gap)) / 6);aspect-ratio:1.32;position:relative;overflow:hidden;border:3px solid #191D18;border-radius:14px;background:#f7f7f2}
.reward-background span{position:absolute;bottom:10px;left:10px;background:#f7f7f2;color:#191D18;border:1.5px solid #191D18;border-radius:20px;padding:4px 8px;font-size:11px;z-index:1}
.reward-background::before,.reward-background::after{content:"";position:absolute}
.reward-background--daybreak{background:#f6ce55}
.reward-background--daybreak::before{width:45%;aspect-ratio:1;border-radius:50%;background:#f26852;left:28%;top:15%}
.reward-background--daybreak::after{width:140%;height:55%;background:#f7f7f2;border:3px solid #191D18;border-radius:50%;left:-20%;top:66%}
.reward-background--blue-hour{background:#5c9af5}
.reward-background--blue-hour::before{width:60%;aspect-ratio:1;border:3px solid #191D18;border-radius:50%;background:#f7f7f2;right:-10%;top:-20%}
.reward-background--blue-hour::after{width:140%;height:45%;border:3px solid #191D18;border-radius:50%;background:#222823;left:-20%;bottom:-15%;transform:rotate(-20deg)}
.reward-background--meadow{background:#dceabb}
.reward-background--meadow::before{width:100%;height:100%;border:3px solid #191D18;border-radius:50%;background:#62c797;left:-30%;top:20%}
.reward-background--meadow::after{width:100%;height:100%;border:3px solid #191D18;border-radius:50%;background:#f6ce55;right:-55%;top:5%}
.reward-background--orbit{background:#222823}
.reward-background--orbit::before{width:80%;height:40%;border:3px solid #62c797;border-radius:50%;left:10%;top:25%;transform:rotate(-30deg)}
.reward-background--orbit::after{width:26%;aspect-ratio:1;background:#f6ce55;border:3px solid #191D18;border-radius:50%;left:38%;top:25%}
.reward-background--peach{background:#f26852}
.reward-background--peach::before{width:75%;aspect-ratio:1;border:3px solid #191D18;background:#f6ce55;border-radius:28%;right:-20%;top:-20%;transform:rotate(25deg)}
.reward-background--tidal{background:#dbe9f9}
.reward-background--tidal::before{width:130%;height:80%;border:3px solid #191D18;background:#5c9af5;border-radius:50%;left:-40%;top:30%}
.reward-background--tidal::after{width:100%;height:75%;border:3px solid #191D18;background:#62c797;border-radius:50%;right:-45%;top:5%}
.reward-characters{--loop-width:220%;margin-top:0}
.reward-characters .reward-track{animation-duration:70s}
.reward-character{flex:0 0 calc((100% - 10 * var(--reward-gap)) / 11);aspect-ratio:1;background:var(--chalk);border:3px solid #191D18;border-radius:13px;display:grid;place-items:center;overflow:hidden}
.reward-character>svg,.reward-character>img{width:88%;height:94%;object-fit:contain}
.reward-character--dreamer [data-layer="hat"] path{fill:#a5b6d6}
.reward-character--stargazer [data-layer="hat"] path{fill:#5c9af5}
.reward-character--stargazer [data-layer="face"] path{fill:#f6ce55}
.reward-character--sunny [data-layer="hat"] path{fill:#f6ce55}
.reward-character--explorer [data-layer="hat"] path{fill:#62c797}
.reward-character--night-owl [data-layer="hat"] path{fill:#343c50}
.reward-character--rose [data-layer="hat"] path{fill:#f26852}
.reward-gallery[data-active="true"] .reward-track{animation-play-state:running}
html[data-motion="paused"] .reward-track{animation-play-state:paused}
@keyframes reward-drift{from{transform:translateX(0)}to{transform:translateX(calc(-1 * var(--loop-width)))}}
@media(prefers-reduced-motion:reduce){.reward-gallery .reward-track{animation:none}}
@media(max-width:600px){
  .feature-green.feature-horizontal .reward-stage.reward-gallery{padding:20px 0;gap:10px;aspect-ratio:auto}
  .reward-window{--reward-gap:10px}
  .reward-gallery-label{padding-inline:16px;font-size:11px}
  .reward-background,.reward-character{border-width:2px;border-radius:10px}
  .reward-background span{font-size:9px;left:5px;bottom:6px;padding:3px 5px}
}

/* Size the colored frames themselves, rather than their different SVG canvases.
   Seven CSS pixels matches the former desktop Converse outline. */
.feature-horizontal{--feature-frame-stroke:7px}
.feature-horizontal :is(.nf-component,.nv-component,.nc-component){
  box-sizing:border-box;padding:calc(var(--feature-frame-stroke) / 2);
  width:100%;height:auto;overflow:visible;
}
.feature-horizontal .nf-component{aspect-ratio:752/462}
.feature-horizontal .nc-component{aspect-ratio:630/382;margin-bottom:15%}
.feature-blue.feature-horizontal .nv-component{aspect-ratio:490/324}
.feature-horizontal .nf-art,
.feature-horizontal .nc-art,
.feature-blue.feature-horizontal .nv-art{
  display:block;width:100%;height:auto;max-width:none;margin:0;overflow:visible;
}
.feature-horizontal .nf-art{aspect-ratio:752/462}
.feature-horizontal .nc-art{aspect-ratio:630/382}
.feature-blue.feature-horizontal .nv-art{aspect-ratio:490/324}
.feature-horizontal .nf-art>g>rect[width="752"],
.feature-horizontal .nv-art>[data-part="stage"],
.feature-horizontal .nc-art [data-part="stage"]{
  stroke:#191D18;stroke-width:var(--feature-frame-stroke);vector-effect:non-scaling-stroke;
}
.feature-green.feature-horizontal .reward-stage.reward-gallery{
  border-width:var(--feature-frame-stroke);border-color:#191D18;aspect-ratio:752/462;
}
.feature-blue.feature-horizontal .voice-art{width:100%;margin:0;align-self:start}
@media(min-width:901px){
  .feature-blue.feature-horizontal .feature-inner{grid-template-columns:minmax(0,1.2fr) minmax(0,.85fr)}
  .feature-blue.feature-horizontal .feature-copy{
    grid-column:2;grid-row:1;width:auto;margin:0;padding:0;align-self:center;
  }
  .feature-blue.feature-horizontal .voice-art{grid-column:1;grid-row:1}
  .feature-coral.feature-horizontal .feature-copy,
  .feature-yellow.feature-horizontal .feature-copy{padding-top:0}
}
@media(max-width:900px){
  .feature-horizontal{--feature-frame-stroke:4px}
  .feature-blue.feature-horizontal .voice-art{width:100%;margin:0}
  .feature-blue.feature-horizontal .nv-component{margin-top:12%}
}

/* One shared gap between feature frames, using Create → Converse as reference.
   The same breathing room also accommodates Connect’s overhanging mascot. */
.feature-horizontal .nc-component{margin-bottom:0}
@media(min-width:901px){
  .feature.feature-horizontal + .feature.feature-horizontal{padding-top:clamp(150px,14vw,220px)}
}
@media(max-width:900px){
  .feature.feature-horizontal + .feature.feature-horizontal{padding-top:80px}
}
@media(max-width:900px){
  .feature-horizontal .context-mobile-clearance{transform:translateX(60px)}
}

/* A slightly calmer desktop scale, preserving the established section spacing. */
@media(min-width:901px){
  .feature.feature-horizontal{width:min(1220px,calc(100% - 112px))}
  html[data-section-lettering="trable"] .feature .feature-heading h2.handwritten-title{
    font-size:clamp(4.25rem,7.2vw,6.5rem);
  }
  html .feature.feature-horizontal .feature-body>p:first-child{
    font-size:clamp(1.125rem,1.48vw,1.275rem);
  }
}


.reward-character--axolotl>img{transform:scaleX(-1)}

/* One-time chapter reveals: animate the wrappers, preserving the lettering. */
.feature-copy[data-text-reveal] > :is(.feature-heading,.feature-body){
  opacity:1;
  transform:translate3d(0,0,0);
  transition:opacity 650ms cubic-bezier(.23,1,.32,1),transform 650ms cubic-bezier(.23,1,.32,1);
}
.feature-copy[data-text-reveal] > .feature-body{transition-delay:70ms}
.feature-copy[data-text-reveal="pending"] > :is(.feature-heading,.feature-body){
  opacity:0;
  transform:translate3d(0,22px,0);
  transition:none;
}
.feature-copy[data-text-reveal="pending"] > .feature-body{transform:translate3d(0,16px,0)}
.feature-copy[data-text-reveal="instant"] > :is(.feature-heading,.feature-body){transition:none}
html[data-motion="paused"] .feature-copy[data-text-reveal] > :is(.feature-heading,.feature-body){
  opacity:1;transform:none;transition:none;
}
@media(prefers-reduced-motion:reduce),print{
  .feature-copy[data-text-reveal] > :is(.feature-heading,.feature-body){
    opacity:1;transform:none;transition:none;
  }
}






/* Penguin uses the shared image sizing and a padded square SVG canvas. */





/* Individual Collect character palettes. */
.reward-character--dreamer{background:#dce6f8}
.reward-character--scholar{background:#f6ce55}
.reward-character--stargazer{background:#343c50}
.reward-character--sunny{background:#f8dfa0}
.reward-character--explorer{background:#cee4ce}
.reward-character--night-owl{background:#a5b6d6}
.reward-character--rose{background:#efb8b1}
.reward-character--moai{background:#e2e3e2}
.reward-character--axolotl{background:#dcd5ec}
.reward-character--mudskipper{background:#e2d9bf}
.reward-character--orangutan{background:#dce4cf}
.reward-character--singing-fish{background:#dbe2cf}
.reward-character--anteater{background:#e6dcd0}
.reward-character--penguin{background:#d9e6ed}
.reward-character--capybara-alligator{background:#e3dfc9}
.reward-character--squirrel{background:#e7d8c6}
.reward-character--alien{background:#d8dfea}
.reward-character--orangutan-male{background:#dce4cf}

/* Create paragraph width trial — remove this block to restore the original wrap. */
@media(min-width:1200px){
  html .feature.feature-coral.feature-horizontal .feature-body>p:first-child{
    width:calc(100% + 16px);
    max-width:24.25em;
  }
}

/* Feature spacing trial: move copy outward without changing its line wrapping. */
@media(min-width:901px){
  .feature.feature-horizontal .feature-copy{
    position:relative;
    left:clamp(-28px,-2vw,-18px);
  }
  .feature.feature-horizontal .feature-inner-reverse .feature-copy{
    left:clamp(18px,2vw,28px);
  }
}

/* Give the hero supporting copy more room below the headline and bring its CTA
   closer to the black edge without moving either element out of the white area. */
.hero-description{margin-top:48px}
.hero-waitlist{margin-top:46px}
@media(max-width:760px){
  .hero-description{margin-top:32px;transform:translateY(-4px) scale(.963758)}
  html[data-support-type] .hero-description{
    font-size:clamp(.75rem,3.2vw,.8125rem);
    line-height:1.6;
  }
  .hero-waitlist{margin-top:42px}
}

/* Footer navigation and signup share one row when there is room. */
.site-footer{height:auto;min-height:120px;display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:24px;padding-block:26px}
.footer-information{display:flex;gap:24px;align-items:center;justify-content:center;min-width:0}
.footer-legal{display:flex;justify-content:center;gap:20px}
.footer-legal a{display:inline-flex;align-items:center;min-height:44px;font-size:13px;white-space:nowrap;text-decoration:underline;text-underline-offset:4px}
.site-footer .footer-information p{display:block;font-size:12px;white-space:nowrap}
.footer-cta{white-space:nowrap}
#features{scroll-margin-top:24px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
@media(max-width:1100px){
  .site-footer{grid-template-columns:auto 1fr;gap:12px 24px}
  .site-footer .footer-information{grid-column:1/-1;grid-row:2;flex-wrap:wrap;gap:8px 24px}
  .footer-cta{grid-column:2;grid-row:1;justify-self:end}
}
@media(max-width:600px){
  .site-footer{grid-template-columns:1fr;justify-items:center;gap:16px;padding-block:28px 32px}
  .site-footer .footer-information{flex-direction:column;gap:8px;width:100%}
  .footer-legal{flex-wrap:wrap;gap:0 20px}
  .footer-cta{grid-column:1;grid-row:3;justify-self:center}
}


/* Signup states and verification. */
.signup-row button:disabled{opacity:.65;cursor:default}

.waitlist-trap{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
#waitlist-challenge{min-height:65px;margin:8px auto;max-width:100%}

.reward-character--trex{background:#e3dfc9}
