@font-face{font-family:Champ;src:url('assets/champ-700.woff') format('woff');font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:Degular;src:url('assets/degular-600.woff2') format('woff2');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:Degular;src:url('assets/degular-700.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:Degular;src:url('assets/degular-500.woff2') format('woff2');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:Organichand;src:url('assets/handwritten-400.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}

:root{--yellow:#c8e3a4;--butter:#e4f2cf;--orange:#f2a65a;--pink:#ffd89b;--soft-pink:#fff1d9;--lilac:#9ccf9a;--purple:#1f4d2b;--cyan:#f6efe0;--pale-blue:#fbf7ee;--ink:#11100f;--paper:#fffefa;--accent:#d9531e;--on-accent:#11100f;--wine:#670a2e;--heading:Champ,Arial,sans-serif;--body:Degular,Arial,sans-serif;--radius:90px;--gutter:24px;--space:140px;--hero-inset:calc(var(--gutter) + 42px)}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:105px}
body{margin:0;color:var(--ink);background:var(--paper);font-family:var(--body);font-size:19px;font-weight:600;line-height:1.25;-webkit-font-smoothing:antialiased}
button,input,textarea{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer;color:inherit}a{color:inherit;text-decoration:none}button{border:0}img{display:block;max-width:100%;height:auto}button:disabled{cursor:default;opacity:.38}svg{display:block}h1,h2,h3,p,figure{margin:0}h1,h2,h3{font-family:var(--heading);font-weight:700}h1,h2{letter-spacing:-.01em;line-height:.87}h2{font-size:clamp(44px,5.42vw,84px)}h3{font-size:30px;line-height:.94}p{line-height:1.32}button:focus-visible,a:focus-visible,summary:focus-visible,[tabindex]:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid var(--purple);outline-offset:5px}section[id]{scroll-margin-top:95px}[hidden]{display:none!important}.eyebrow{text-transform:uppercase;letter-spacing:.12em;font-size:13px;font-weight:700}.handwritten{font-family:Organichand,cursive;font-size:28px;line-height:.98;font-weight:400;color:var(--purple)}.fine-print{font-size:14px;line-height:1.4}.section-space{padding:var(--space) 5.6%}.rounded-panel{border-radius:var(--radius);margin:0 18px;position:relative;overflow:hidden}.section-intro{position:relative}.section-intro .eyebrow{margin-bottom:23px}.section-intro>p:not(.eyebrow):not(.handwritten){margin-top:25px;font-size:20px}.centered{text-align:center}.text-link{display:inline-flex;align-items:center;gap:10px;font-size:17px;min-height:44px}.text-link:hover{text-decoration:underline;text-underline-offset:5px}.text-link>span:last-child{transition:transform .2s}.text-link:hover>span:last-child{transform:translate(2px,-2px)}
.split-button{display:inline-flex;align-items:stretch;background:none;padding:0;color:var(--on-accent);font-weight:700;font-size:18px;line-height:1;white-space:nowrap;min-height:54px;text-align:center}.split-button>span{display:flex;align-items:center;justify-content:center;background:var(--accent);border-radius:8px;padding:17px 22px;transition:filter .2s,transform .2s}.split-button>span:last-child{width:54px;padding:0;font-size:24px;margin-left:-1px}.split-button:hover>span{filter:brightness(.94)}.split-button:hover>span:last-child{transform:translateX(4px)}.split-button.small{min-height:44px;font-size:16px}.split-button.small>span{padding:13px 18px}.split-button.small>span:last-child{width:44px;padding:0;font-size:21px}.split-button.warm{--accent:var(--orange);--on-accent:var(--ink)}
.skip-link{position:fixed;top:-100px;left:20px;z-index:1000;background:white;padding:16px}.skip-link:focus{top:10px}.site-header{height:94px;position:absolute;top:0;left:0;width:100%;z-index:20;padding:20px var(--gutter);display:flex;align-items:center;justify-content:space-between;gap:16px}.wordmark{display:inline-flex;align-items:center;gap:8px;white-space:nowrap}.wordmark>span:first-of-type{font-family:var(--heading);font-size:34px;letter-spacing:-1.5px;line-height:1}.wordmark img{width:31px;height:31px;object-fit:contain}.wordmark-note{font-size:9px;line-height:1.2;letter-spacing:1.7px;margin-left:7px}.desktop-nav{display:flex;align-items:center;gap:5px}.desktop-nav>a{padding:12px 16px;background:var(--butter);border-radius:50px;font-size:17px;transition:background .2s;min-height:44px}.desktop-nav>a:hover{background:var(--paper)}.sign-in{background:none;font-size:17px;min-height:44px;display:flex;align-items:center;gap:15px}.sign-in-icon{display:flex;align-items:center;justify-content:center;width:36px;height:36px;color:var(--yellow);background:var(--ink);border-radius:50%}.menu-toggle{display:none}.site-header.scrolled{position:fixed;height:80px;background:var(--yellow);box-shadow:0 2px 0 #00000008;animation:nav-enter .25s ease-out}.mobile-nav{display:none}@keyframes nav-enter{from{transform:translateY(-100%)}to{transform:translateY(0)}}
.hero{min-height:990px;height:min(76vw,1080px);max-height:1150px;position:relative;isolation:isolate;background:var(--yellow);overflow:hidden;border-radius:0 0 var(--radius) var(--radius)}.hero-ribbon{position:absolute;inset:0;width:100%;height:100%;z-index:-1}.hero-copy{position:relative;padding:166px 0 130px var(--hero-inset);z-index:3;width:65%;pointer-events:none}.hero-copy>*{pointer-events:auto}.hero-copy .eyebrow{margin-bottom:25px}.hero h1{font-size:clamp(80px,8.33vw,134px);line-height:.82;letter-spacing:-.022em;max-width:11ch}.hero-description{font-size:19px;line-height:1.22;width:420px;max-width:90%;margin-top:31px}.hero-actions{display:flex;align-items:center;gap:22px;margin-top:24px;flex-wrap:wrap}.play-small{display:inline-flex;background:var(--ink);color:var(--yellow);border-radius:50%;width:28px;height:28px;align-items:center;justify-content:center;font-size:11px;padding-left:2px}.hero-copy .fine-print{max-width:420px;margin-top:18px}.hero-art{position:absolute;right:0;top:0;width:51%;height:100%;pointer-events:none}.floating-book{position:absolute;background:#31312d;border-radius:1px 5px 6px 2px;transform-style:preserve-3d;box-shadow:7px 7px 0 #ddd5bc,10px 10px 0 #756d54,20px 28px 25px #30261335}.floating-book img{width:100%;height:100%;object-fit:cover;border-radius:inherit;position:relative;z-index:1}.floating-book:before{content:"";position:absolute;left:-12px;top:1px;height:100%;width:14px;background:linear-gradient(90deg,#252c24,#565d52 45%,#222824);transform:skewY(-17deg);transform-origin:right}.floating-book:after{content:"";position:absolute;inset:0;z-index:2;background:linear-gradient(90deg,#ffffff00 1%,#fff4 2%,#0003 3%,#fff0 6%);border-radius:inherit;pointer-events:none}.book-main{width:41%;top:23%;left:13%;transform:perspective(1600px) rotateY(-16deg) rotateZ(-12deg);z-index:3;animation:float-main 8s ease-in-out infinite}.book-garden{width:32%;top:12%;right:0%;transform:rotate(17deg);z-index:2;animation:float-side 10s ease-in-out infinite}.book-food{width:30%;top:62%;right:6%;transform:rotate(16deg);z-index:4;animation:float-side 9s -3s ease-in-out infinite}.book-peek{width:210px;left:28%;bottom:-125px;transform:rotate(-31deg);z-index:1}.hero-hand{position:absolute;right:5%;top:49%;font-size:29px;transform:rotate(5deg);text-align:center;max-width:170px;z-index:5}.starburst{display:flex;align-items:center;justify-content:center;aspect-ratio:1;clip-path:polygon(100% 50%,90% 58%,96% 69%,84% 73%,85% 85%,73% 84%,69% 96%,58% 90%,50% 100%,42% 90%,31% 96%,27% 84%,15% 85%,16% 73%,4% 69%,10% 58%,0 50%,10% 42%,4% 31%,16% 27%,15% 15%,27% 16%,31% 4%,42% 10%,50% 0,58% 10%,69% 4%,73% 16%,85% 15%,84% 27%,96% 31%,90% 42%);text-align:center}.starburst>span{font-family:var(--heading);font-size:24px;line-height:.93;transform:rotate(-8deg)}.hero-sticker{position:absolute;top:65%;left:3%;width:140px;background:var(--soft-pink);z-index:5;transform:rotate(12deg)}.hero-scroll{position:absolute;bottom:42px;left:var(--hero-inset);display:flex;align-items:center;gap:25px;font-size:16px;min-height:44px}.hero-scroll span{border:1px solid #1117;border-radius:50%;width:36px;height:36px;display:grid;place-items:center}.edition-label{position:absolute;right:var(--gutter);bottom:48px;font-size:11px;letter-spacing:.1em}.margin-note{position:absolute;top:0;left:1%;transform:rotate(-8deg);text-align:center;font-size:25px}@keyframes float-main{0%,100%{translate:0 0;rotate:0deg}50%{translate:0 -16px;rotate:2deg}}@keyframes float-side{0%,100%{translate:0 0}50%{translate:0 13px}}
.guides{padding-left:0;padding-right:0;padding-bottom:110px}.guides .section-intro{margin:0 5.6%}.shelf-toolbar{margin:68px var(--gutter) 25px;display:flex;align-items:center;justify-content:space-between}.shelf-toolbar>span{font-size:14px}.round-controls{display:flex;gap:8px}.round-controls button,.sample-pager button{border-radius:50%;width:46px;height:46px;background:var(--ink);color:white;font-size:22px}.round-controls button:disabled{background:#777}.guide-shelf{display:flex;gap:25px;overflow-x:auto;padding:25px 28px 40px;scroll-snap-type:x mandatory;scrollbar-width:none;scroll-behavior:smooth;align-items:stretch}.guide-shelf::-webkit-scrollbar{display:none}.guide-card{flex:0 0 calc((100vw - 138px)/4.35);min-width:250px;max-width:350px;background:var(--card-color);padding:11px 11px 18px;border-radius:24px;scroll-snap-align:center;transform:rotate(var(--turn));display:flex;flex-direction:column;transition:transform .3s;text-align:left;position:relative;overflow:hidden}.guide-card:hover{transform:rotate(0) translateY(-10px)}.guide-card .cover-wrap{border-radius:15px;overflow:hidden;aspect-ratio:816/1056;position:relative}.guide-card img{width:100%;height:100%;object-fit:cover;transition:transform .4s}.guide-card:hover img{transform:scale(1.035)}.guide-card .cover-wrap:after{content:'Take a closer look';position:absolute;bottom:12px;left:50%;transform:translate(-50%,20px);opacity:0;white-space:nowrap;background:white;color:#111;border-radius:30px;padding:9px 16px;font-size:14px;transition:.3s}.guide-card:hover .cover-wrap:after,.guide-card:focus-visible .cover-wrap:after{transform:translate(-50%,0);opacity:1}.guide-card h3{font-size:27px;line-height:1;margin:9px 2px}.guide-card .guide-deck{font-size:16px;line-height:1.14;margin:0 2px}.guide-category{font-size:12px;border-radius:30px;background:#fff9;color:#111;align-self:flex-start;padding:4px 9px;margin-top:12px}.shelf-bottom{margin:30px 5.6% 0;display:flex;align-items:center;justify-content:space-between}.shelf-bottom .handwritten{font-size:24px;transform:rotate(-3deg)}
.how{background:var(--soft-pink);padding:90px 5.3% 100px;isolation:isolate}.how:before{content:'';position:absolute;z-index:-1;width:950px;height:580px;border:100px solid #fff5;border-radius:50%;transform:rotate(-22deg);top:230px;left:-150px}.panel-heading{display:flex;align-items:center;justify-content:space-between;gap:30px}.panel-heading h2{font-size:clamp(42px,5.42vw,84px)}.panel-heading .handwritten{transform:rotate(5deg);text-align:center;margin-right:auto;margin-left:30px}.step-cards{display:grid;grid-template-columns:repeat(4,1fr);margin:85px 15px 0;gap:0;align-items:stretch}.step-card{padding:28px 21px 30px;border-radius:24px;transform:rotate(-4deg);box-shadow:0 4px 0 #00000003;transition:transform .3s;position:relative}.step-card:nth-child(2){transform:rotate(5deg) translateY(-13px);z-index:2}.step-card:nth-child(3){transform:rotate(-2deg) translateY(-9px);z-index:3}.step-card:nth-child(4){transform:rotate(4deg)}.step-card:hover{transform:rotate(0) translateY(-18px);z-index:5}.step-card.cyan{background:var(--cyan)}.step-card.pink{background:var(--pink)}.step-card.yellow{background:var(--yellow)}.step-card.lilac{background:var(--lilac)}.step-card>.handwritten{color:var(--ink);text-align:center;font-size:27px}.step-card>p:not(.handwritten){font-size:17px;line-height:1.13;margin-top:13px}.step-card>p.step-footnote{font-size:12px;margin-top:15px}.step-card h3{font-size:31px;line-height:.95}.step-art{height:210px;position:relative;margin:15px 0 25px;display:flex;align-items:center;justify-content:center}.idea-art{flex-direction:column;padding-top:48px;gap:10px;transform:rotate(-5deg)}.idea-sun{position:absolute;font-size:80px;right:0;top:-15px}.mini-search{border:3px solid var(--ink);background:#fff5;padding:10px 12px;border-radius:9px;width:95%;font-size:20px;display:flex;justify-content:space-between;align-items:center}.mini-search b{font-size:24px}.idea-line{display:flex;align-items:center;gap:12px;width:88%;font-size:16px}.idea-line i{height:6px;flex:1;background:var(--ink);border-radius:10px}.idea-line:last-child i{flex:0 0 46%;opacity:.5}.paper-icon{width:118px;height:145px;background:var(--butter);border:3px solid var(--ink);border-radius:3px;padding:16px;transform:rotate(-12deg);box-shadow:9px 10px 0 var(--ink)}.paper-icon b{font-family:var(--heading);font-size:44px}.paper-icon i{display:block;background:var(--ink);height:4px;width:100%;margin-top:9px}.paper-icon i:last-child{width:60%}.giant-pencil{font-size:146px;position:absolute;right:-7px;bottom:-5px;transform:rotate(-15deg);font-family:Arial,sans-serif}.little-star{font-size:53px;position:absolute;right:0;top:-5px}.editing-art img{width:115px;transform:rotate(8deg);box-shadow:4px 5px 0 #111;border:2px solid #111}.edit-bubble{position:absolute;left:-4px;top:28px;font-size:17px;padding:9px 10px;border:2px solid #111;border-radius:25px;background:var(--paper);transform:rotate(-6deg)}.art-swatches{position:absolute;display:flex;bottom:4px;left:16px;transform:rotate(-7deg)}.art-swatches i{border:2px solid #111;background:var(--purple);width:33px;height:33px;border-radius:50%;margin-left:-4px}.art-swatches i:nth-child(2){background:var(--pink)}.art-swatches i:nth-child(3){background:var(--cyan)}.file-icon{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:9px;width:111px;height:137px;border:3px solid #111;border-radius:8px;background:var(--soft-pink);font-family:var(--heading);font-size:29px;transform:rotate(-9deg);box-shadow:8px 8px 0 #111}.file-icon span{font-size:57px;line-height:1;font-family:var(--body)}.export-check{position:absolute;right:13px;top:9px;border:3px solid #111;background:var(--yellow);border-radius:50%;width:57px;height:57px;font-size:40px;text-align:center}.file-tag{position:absolute;bottom:0;right:0;font-family:Organichand;font-size:31px;transform:rotate(-7deg)}
.inside{display:grid;grid-template-columns:.9fr 1.1fr;gap:65px;padding-top:180px;padding-bottom:175px;align-items:center}.inside-copy .eyebrow{margin-bottom:26px}.inside-copy h2{font-size:clamp(48px,5vw,77px)}.inside-copy>p:not(.eyebrow):not(.handwritten){font-size:20px;max-width:370px;margin:28px 0}.inside-note{margin-top:35px;transform:rotate(-4deg)}.inside-art{position:relative;min-width:0;padding-top:45px}.page-spread{display:flex;align-items:center;gap:9px;transform:rotate(-7deg);filter:drop-shadow(9px 18px 16px #29251725)}.page-spread img{width:calc(50% - 4px);box-shadow:1px 0 0 #dad2ba,3px 3px 0 #e3ddc8,5px 5px 0 #c1b699}.page-spread img:first-child{transform:perspective(1000px) rotateY(7deg);transform-origin:right}.page-spread img:last-child{transform:perspective(1000px) rotateY(-7deg);transform-origin:left}.inside-sticker{background:var(--yellow);position:absolute;width:128px;right:-10px;top:-25px;transform:rotate(10deg)}.image-caption{font-size:13px;text-align:center;margin-top:52px;color:#595448}.niches{background:var(--pink);padding:90px 20px 80px;text-align:center;isolation:isolate}.niches h2{font-size:29px;line-height:1.1;margin:18px 0 35px}.niches>.eyebrow{font-size:12px}.niche-links{display:flex;flex-direction:column;align-items:center;position:relative;z-index:2}.niche-links button{font-family:var(--heading);background:none;font-size:clamp(42px,5.9vw,88px);letter-spacing:-.012em;line-height:.99;padding:3px 12px;position:relative;transition:color .2s}.niche-links button>span{position:absolute;right:-45px;opacity:0;transition:opacity .2s}.niche-links button:hover,.niche-links button:focus-visible{color:var(--wine)}.niche-links button:hover>span,.niche-links button:focus-visible>span{opacity:1}.niche-note{position:absolute;left:5%;top:120px;font-size:25px;transform:rotate(-9deg);color:var(--wine)}.niche-caption{font-size:17px;margin-top:36px}.niche-preview{width:175px;position:absolute;top:57%;right:3%;transform:rotate(12deg);pointer-events:none;opacity:0;transition:opacity .2s,transform .3s;z-index:1;box-shadow:8px 10px 0 #0003}.niches:has(.niche-links button:hover) .niche-preview,.niches:has(.niche-links button:focus-visible) .niche-preview{opacity:1;transform:rotate(16deg) translateY(-20px)}
.studio{padding-bottom:130px}.studio-layout{display:grid;grid-template-columns:1.35fr 1fr;gap:70px;margin-top:70px;align-items:center}.studio-visual{background:var(--pale-blue);border-radius:32px;padding:35px 25px 20px;transform:rotate(-2deg)}.studio-visual figure{box-shadow:0 10px 35px #002d321a;border-radius:8px;overflow:hidden;background:var(--paper)}.studio-visual figcaption{font-size:12px;padding:12px 8px;text-align:center;color:#56524a}.studio-watch{display:flex;align-items:center;justify-content:center;gap:12px;min-height:60px;font-size:17px;margin-top:10px}.studio-watch span{border-radius:50%;display:grid;place-items:center;width:40px;height:40px;background:var(--ink);color:white;font-size:14px}.studio-features{display:flex;flex-direction:column}.studio-features article{display:flex;gap:21px;padding:24px 0;border-bottom:1px solid #1112}.studio-features article:first-child{padding-top:0}.studio-features article:last-child{border:0;padding-bottom:0}.studio-features article>span{flex-shrink:0;width:34px;height:34px;display:grid;place-items:center;background:var(--yellow);border-radius:50%;font-size:14px}.studio-features h3{font-family:var(--body);font-weight:700;font-size:25px;line-height:1.1}.studio-features p{font-size:18px;margin-top:8px;max-width:38ch}.watch{background:var(--pale-blue);padding:80px 5.3% 32px}.watch-heading{display:flex;justify-content:space-between;align-items:center;gap:35px;margin-bottom:48px}.watch-heading h2{font-size:clamp(38px,4.2vw,64px);margin-top:25px;line-height:.95}.watch-heading .handwritten{transform:rotate(5deg);font-size:27px;text-align:center}.video-frame{border:8px solid var(--ink);border-radius:24px;overflow:hidden;background:#090909}.video-frame video{width:100%;height:auto;display:block;aspect-ratio:960/564}.video-chapters{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:24px}.video-chapters button{min-height:48px;padding:10px;background:#fff8;border-radius:9px;font-size:16px;transition:background .2s}.video-chapters button:hover{background:#fff}.video-note{font-size:12px;text-align:center;margin:18px 0 0}.sell{text-align:center;padding-top:120px;padding-bottom:120px}.sell h2{margin:25px 0 26px}.sell>p:not(.eyebrow):not(.fine-print){font-size:20px}.platforms{display:flex;justify-content:center;align-items:center;gap:60px;margin:55px 0 32px;flex-wrap:wrap}.platforms>span{font-size:35px;letter-spacing:-.04em;font-weight:700}.platforms .platform-etsy{font-family:Georgia,serif;font-size:47px;font-weight:400}.platforms .platform-shopify{font-style:italic}.sell .fine-print{color:#575149;font-size:13px}
.pricing{background:var(--yellow);padding:85px 5.3% 65px}.billing-toggle{display:flex;justify-content:center;background:var(--butter);border-radius:50px;padding:5px;width:max-content;margin:40px auto;gap:4px}.billing-toggle button{padding:12px 18px;min-height:44px;border-radius:50px;background:none;font-size:17px}.billing-toggle button[aria-pressed=true]{background:var(--ink);color:#fff}.billing-toggle button>span{font-size:12px;margin-left:7px}.price-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:23px;align-items:stretch}.price-card{background:var(--butter);border-radius:24px;padding:35px 28px 28px;display:flex;flex-direction:column;position:relative;border:2px solid transparent}.price-card.featured{background:var(--paper);border-color:var(--ink);transform:rotate(-1deg)}.price-badge{position:absolute;right:15px;top:-17px;background:var(--purple);color:#fff;padding:8px 16px;font-size:14px;border-radius:30px;transform:rotate(5deg)}.price-card h3{font-size:35px}.price-tagline{font-size:17px;margin-top:12px;min-height:42px}.price-number{font-family:var(--heading);font-size:62px;line-height:1.1;letter-spacing:-.035em;margin-top:23px}.price-number>span{font-family:var(--body);font-size:17px;letter-spacing:0;margin-left:5px}.billing-note{min-height:18px;font-size:14px;margin-top:4px}.price-card ul{list-style:none;margin:25px 0 30px;padding:25px 0 0;border-top:1px solid #1113;display:flex;flex-direction:column;gap:13px;flex:1}.price-card li{font-size:17px;line-height:1.15;display:flex;gap:9px}.price-card li:before{content:'✓';font-weight:700}.price-card .split-button>span:first-child{flex:1}/* The unfeatured plans fill their button with --ink, so they need their own text colour.
   Inheriting --on-accent put near-black text on a near-black fill: contrast 1.1, invisible. */
.price-card:not(.featured) .split-button{--accent:var(--ink);--on-accent:#fff}.free-option{text-align:center;font-size:17px;margin:35px auto 0;max-width:820px}.free-option button{background:none;font-weight:700;text-decoration:underline;text-underline-offset:4px;min-height:44px;padding:5px 10px}.pricing-fine{text-align:center;font-size:13px;line-height:1.5;margin-top:18px}
.faq{position:relative;text-align:center;isolation:isolate;overflow:hidden}.faq:before{content:'';position:absolute;z-index:-1;right:-16%;top:31%;width:130%;height:600px;border:90px solid color-mix(in srgb,var(--soft-pink) 55%,#fff);border-radius:50%;transform:rotate(-18deg)}.faq .handwritten{transform:rotate(-5deg);margin-bottom:24px}.faq-list{max-width:790px;margin:48px auto 25px;text-align:left}.faq-list details{background:var(--soft-pink);border-radius:14px;margin-bottom:10px;padding:0 24px}.faq-list summary{display:flex;align-items:center;justify-content:space-between;gap:25px;min-height:65px;cursor:pointer;list-style:none;font-size:20px;line-height:1.18;padding:17px 0}.faq-list summary::-webkit-details-marker{display:none}.faq-list summary:after{content:'+';font-size:27px;font-weight:500}.faq-list details[open] summary:after{content:'−'}.faq-list details[open] summary{font-weight:700}.faq-list details p{padding:0 30px 24px 0;font-size:18px;line-height:1.35;max-width:70ch}.final-cta{background:var(--soft-pink);display:grid;grid-template-columns:1fr 1fr;min-height:740px;margin-bottom:18px}.cta-art{position:relative;min-height:100%;overflow:hidden;background:var(--yellow);display:flex;align-items:center;justify-content:center}.cta-spread{flex:none;background:none;padding:0;position:relative;width:min(84%,660px);aspect-ratio:1632/1056;border-radius:10px;overflow:hidden;transform:rotate(-2deg);box-shadow:0 26px 60px #00000032;transition:transform .4s}.cta-spread img{position:absolute;top:0;width:50%;height:100%;object-fit:cover;display:block}.cta-spread img:nth-of-type(1){left:0}.cta-spread img:nth-of-type(2){left:50%}.cta-gutter{position:absolute;left:50%;top:0;bottom:0;width:3.4%;transform:translateX(-50%);background:linear-gradient(90deg,#0000 0,#00000026 42%,#0000003a 50%,#00000026 58%,#0000 100%)}.cta-spread:hover{transform:rotate(-1deg) translateY(-6px)}.cta-spread:hover .spine-peek,.cta-spread:focus-visible .spine-peek{transform:translate(-50%,0);opacity:1}.cta-copy{padding:75px 45px 70px 60px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center}.cta-copy h2{font-size:clamp(42px,4.8vw,74px);margin:35px 0 25px}.cta-copy>.handwritten{transform:rotate(-5deg);font-size:27px}.cta-copy>p:not(.handwritten):not(.fine-print){font-size:20px;max-width:32ch}.cta-copy>.split-button{margin-top:25px}.cta-copy .fine-print{margin-top:18px;font-size:13px}.site-footer{background:var(--purple);color:#fff;padding:75px 5.6% 0;overflow:hidden}.footer-top{display:grid;grid-template-columns:1.35fr .6fr 1fr;gap:70px}.footer-top .wordmark>span:first-of-type{font-size:43px}.footer-top p{margin-top:21px;font-size:17px;line-height:1.35}.footer-top nav{display:flex;flex-direction:column;align-items:flex-start;gap:7px;font-size:17px}.footer-top nav strong{font-size:13px;text-transform:uppercase;letter-spacing:.1em;margin-bottom:10px;color:var(--butter)}.footer-top nav a{min-height:30px}.footer-top a:hover{text-decoration:underline;text-underline-offset:5px}.footer-contact .handwritten{color:var(--butter);font-size:27px;margin:0 0 22px;transform:rotate(-3deg)}.footer-contact>a{font-size:25px}.footer-contact>p:not(.handwritten){font-size:16px}.footer-bottom{border-top:1px solid #ffffff35;margin-top:65px;padding:25px 0;display:flex;align-items:center;justify-content:space-between;gap:20px;font-size:12px}.footer-bottom>div{display:flex;gap:18px}.footer-bottom button{background:none;color:inherit;min-height:35px;padding:5px 0;font-size:12px}.footer-big{font-family:var(--heading);font-size:26vw;line-height:.78;letter-spacing:-.075em;color:var(--butter);margin:45px 0 -2vw -1.2vw}

.reviews{padding-top:20px;padding-bottom:100px;overflow:hidden;text-align:center}.reviews h2{font-size:clamp(42px,4.9vw,75px)}.reviews .section-intro>p:not(.eyebrow){font-size:16px}.reviews-shelf{display:flex;gap:23px;overflow-x:auto;scroll-snap-type:x mandatory;padding:25px 5px 25px;margin-top:35px;scrollbar-width:thin;scrollbar-color:var(--lilac) transparent;text-align:left}.review-card{flex:0 0 370px;scroll-snap-align:start;border-radius:25px;background:var(--review-color);padding:30px;display:flex;flex-direction:column}.quote-mark{font-family:var(--heading);font-size:68px;line-height:.8;color:var(--purple)}.review-card blockquote{font-size:20px;line-height:1.3;margin:15px 0 28px;flex:1}.review-card figcaption{display:flex;flex-direction:column;gap:3px;border-top:1px solid #1112;padding-top:18px;font-size:17px}.review-card figcaption span{font-size:14px}.reviews>.handwritten{font-size:25px;margin-top:30px;transform:rotate(-3deg)}.comparison{max-width:1000px;margin:35px auto 0;border-top:1px solid #1113}.comparison>summary{cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:center;gap:25px;min-height:65px;font-size:20px}.comparison>summary::-webkit-details-marker{display:none}.comparison>summary>span{font-size:25px;transition:transform .2s}.comparison[open]>summary>span{transform:rotate(45deg)}.comparison-scroll{overflow:auto;background:var(--butter);border-radius:20px;padding:15px}.comparison table{width:100%;min-width:690px;border-collapse:collapse;text-align:left;font-size:15px}.comparison th,.comparison td{padding:14px 11px;border-bottom:1px solid #1112;vertical-align:top}.comparison th{font-weight:700}.comparison thead th{font-size:18px}.comparison tbody th{max-width:220px}.comparison tr:last-child>*{border-bottom:0}
@media(max-width:599px){.reviews{padding-top:0;padding-bottom:70px}.reviews h2{font-size:41px}.reviews-shelf{gap:15px;margin-top:25px}.review-card{flex-basis:285px;padding:25px}.review-card blockquote{font-size:18px}.reviews>.handwritten{font-size:22px}.comparison>summary{font-size:18px}.comparison-scroll{padding:9px;border-radius:12px}}

/* Isolated review UI. Never connects to Octavo's APIs or checkout. */
.preview-tools{position:fixed;bottom:18px;right:20px;z-index:40;display:flex;align-items:center;gap:8px;border-radius:12px;background:#fffefaee;backdrop-filter:blur(12px);color:#181514;border:1px solid #1112;box-shadow:0 4px 20px #0001;padding:5px 5px 5px 13px;font-size:12px}.preview-dot{width:7px;height:7px;border-radius:50%;background:#368154}.preview-tools>a{background:#eee9fb;border-radius:7px;font-size:13px;min-height:36px;padding:8px 13px;margin-left:5px;display:inline-flex;align-items:center;gap:5px;text-decoration:none;color:inherit}
.preview-tools>button{background:#eee9fb;border-radius:7px;font-size:13px;min-height:36px;padding:8px 13px;margin-left:5px}.preview-tools>button>span{margin-left:5px}.customizer{position:fixed;right:20px;bottom:78px;width:360px;max-width:calc(100vw - 32px);max-height:calc(100dvh - 110px);overflow:auto;background:var(--paper);color:#111;border:1px solid #1112;border-radius:23px;z-index:45;box-shadow:0 12px 70px #0003;padding:25px}.customizer header{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}.customizer h2{font-size:32px;margin-top:12px}.customizer .eyebrow{font-size:10px}.close-button{width:44px;height:44px;flex-shrink:0;border-radius:50%;background:#111;color:white;font-family:Arial,sans-serif;font-size:27px;font-weight:400;display:grid;place-items:center}.customizer>p{font-size:15px;margin-top:20px}.customizer fieldset{border:0;padding:0;margin:25px 0}.customizer legend{font-size:16px;margin-bottom:12px}.palette-options{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.palette-options button{background:#f0ede7;border:2px solid transparent;padding:10px 7px;border-radius:10px;flex:1;font-size:12px}.palette-options button[aria-pressed=true]{border-color:var(--purple)}.palette-options button span{display:block;width:30px;height:30px;border-radius:50%;margin:0 auto 7px;border:1px solid #1112}.control-label{display:flex;align-items:center;justify-content:space-between;font-size:16px;margin:18px 0 9px}.control-label input{background:none;border:1px solid #ddd;height:35px;width:55px;padding:2px;border-radius:5px}.check-control{display:flex;gap:9px;align-items:center;font-size:16px;min-height:44px;margin-top:15px}.check-control input{width:19px;height:19px;accent-color:var(--purple)}.customizer>.control-note{font-size:12px;color:#625c56;margin:0}.customizer textarea{width:100%;font-size:15px;border:1px solid #ccc;border-radius:8px;padding:11px;resize:vertical;min-height:80px;color:#111;background:#fff}.customizer-actions{display:flex;flex-direction:column;gap:8px;margin-top:16px}.customizer-actions button{min-height:42px;background:#eee9fb;border-radius:8px;font-size:15px}.customizer-actions button:first-child{background:var(--purple);color:white}.customizer>.save-status{font-size:12px;margin-top:13px;color:#625c56}.editing-copy [data-edit]{outline:2px dashed #6740a380;outline-offset:6px;cursor:text}.editing-copy [data-edit]:focus{outline:2px solid var(--purple);background:#ffffff45}dialog{border:0;border-radius:30px;max-width:calc(100vw - 32px);max-height:calc(100dvh - 45px);padding:28px;background:var(--paper);color:var(--ink);box-shadow:0 20px 80px #0004}dialog::backdrop{background:#160d287d;backdrop-filter:blur(7px)}body:has(dialog[open]){overflow:hidden}.dialog-top{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:20px}.sample-dialog{width:930px;overflow:auto}.sample-content{display:grid;grid-template-columns:1fr 1fr;gap:38px;align-items:center}.sample-content>img{width:100%;max-height:74vh;object-fit:contain;filter:drop-shadow(5px 6px 6px #0002)}.sample-content h2{font-size:43px;margin:25px 0 20px;line-height:.98}.sample-content>div>p:not(.handwritten){font-size:19px;line-height:1.3}.sample-content .sample-note{font-size:14px!important;color:#5a514a;margin:20px 0}.sample-content .split-button{margin-top:20px}.sample-pager{display:flex;gap:18px;align-items:center;margin:24px 0;font-size:15px}.action-dialog{width:520px;padding:45px}.action-dialog>.close-button{position:absolute;right:20px;top:20px}.action-dialog>.handwritten{font-size:25px;margin:20px 0 27px}.action-dialog h2{font-size:45px;line-height:.98;margin-bottom:24px}.action-dialog>p:not(.handwritten){font-size:18px;line-height:1.35}.action-dialog>.dialog-note{font-size:14px!important;margin:18px 0 25px;color:#585045}.action-dialog>a{display:block;font-size:14px;text-decoration:underline;text-underline-offset:4px;margin-top:25px;min-height:30px}.noscript-note{background:white;padding:30px;position:fixed;bottom:0;z-index:100;width:100%;font-size:18px}

@media(min-width:1700px){:root{--gutter:32px}.hero-copy{padding-top:195px}.hero-description{width:490px;font-size:23px}.hero-art{right:3%;width:49%}.hero-actions{margin-top:30px}.guide-card{flex-basis:calc((100vw - 160px)/5.2);max-width:390px}.step-art{height:250px}.step-card h3{font-size:39px}.step-card>p:not(.handwritten){font-size:20px}}
@media(max-width:1199px){:root{--space:110px;--radius:65px;--hero-inset:calc(var(--gutter) + 20px)}.wordmark-note{display:none}.desktop-nav>a{padding:12px 12px;font-size:16px}.sign-in{font-size:15px}.hero{height:980px;min-height:950px}.hero-copy{width:67%;padding-top:164px}.hero h1{font-size:9vw}.hero-description{width:350px;font-size:18px}.hero-actions{max-width:360px;gap:9px}.hero-art{width:50%}.book-main{width:47%;top:29%;left:8%}.book-garden{width:34%;top:17%;right:-4%}.book-food{width:37%;top:65%;right:7%}.hero-hand{top:51%;right:2%;font-size:25px}.hero-sticker{top:65%;width:115px}.starburst>span{font-size:21px}.hero-copy .fine-print{font-size:13px}.panel-heading .handwritten{font-size:23px;margin-left:0}.how{padding:70px 4.5% 75px}.step-cards{margin:65px 0 0}.step-card{padding:25px 17px}.step-card h3{font-size:27px}.step-card>p:not(.handwritten){font-size:16px}.step-art{height:180px}.mini-search{font-size:17px}.inside{gap:35px}.inside-copy h2{font-size:5.1vw}.inside-sticker{width:100px}.margin-note{left:-2%;font-size:21px}.guides h2{font-size:5.4vw}.studio-layout{gap:40px}.studio-visual{padding:23px 18px 15px}.studio-features h3{font-size:23px}.studio-features p{font-size:17px}.price-card{padding:32px 20px 25px}.price-card h3{font-size:31px}.price-number{font-size:55px}.price-card li{font-size:16px}.price-card .split-button{font-size:15px}.price-card .split-button>span{padding:16px 12px}.platforms{gap:40px}.cta-copy{padding:65px 30px}.footer-top{gap:35px}.footer-bottom{font-size:11px}}
@media(max-width:959px){:root{--gutter:20px}.desktop-nav,.sign-in{display:none}.menu-toggle{display:flex;align-items:center;gap:20px;background:var(--orange);padding:11px 15px;border-radius:8px;min-height:46px;font-size:18px}.menu-toggle>span{font-size:23px}.site-header{height:88px}.site-header.scrolled{height:76px}.mobile-nav:not([hidden]){position:absolute;left:16px;right:16px;top:82px;display:flex;flex-direction:column;gap:4px;background:var(--butter);border:1px solid #1112;border-radius:20px;padding:17px;box-shadow:0 20px 30px #1112}.mobile-nav a,.mobile-nav button{text-align:left;font-size:23px;min-height:46px;padding:8px 15px;border-radius:8px;background:none}.mobile-nav button{background:var(--accent);color:var(--on-accent)}.hero{min-height:1060px;height:110vw}.hero-copy{width:70%;padding-top:153px}.hero h1{font-size:9.2vw}.hero-description{font-size:18px;width:350px;max-width:82%}.hero-art{width:53%}.book-main{top:43%;left:8%;width:50%}.book-garden{top:18%;width:35%;right:-9%}.book-food{top:74%;right:6%;width:40%}.hero-hand{top:35%;font-size:26px;right:5%}.hero-sticker{top:66%;left:7%;width:100px}.book-peek{left:21%;width:180px;bottom:-100px}.hero-scroll{bottom:26px}.edition-label{bottom:38px;font-size:9px}.guides .margin-note{position:static;margin:0 0 25px;transform:rotate(-4deg);font-size:25px}.guides h2{font-size:57px}.shelf-toolbar{margin-top:45px}.guide-card{flex-basis:32vw;min-width:230px}.panel-heading{flex-wrap:wrap;gap:24px}.panel-heading h2{font-size:58px}.panel-heading .handwritten{margin-left:auto;margin-right:0}.panel-heading .split-button{display:none}.step-cards{grid-template-columns:repeat(2,1fr);gap:16px;margin:50px 20px 0}.step-card{padding:25px 23px}.step-card h3{font-size:33px}.step-card>p:not(.handwritten){font-size:18px}.step-card:nth-child(2){transform:rotate(3deg)}.step-card:nth-child(3){transform:rotate(2deg)}.step-card:nth-child(4){transform:rotate(-3deg)}.step-art{height:195px}.idea-art{max-width:220px;margin-left:auto;margin-right:auto}.inside{grid-template-columns:1fr;gap:45px;padding-top:100px;padding-bottom:100px}.inside-copy{text-align:center}.inside-copy h2{font-size:65px}.inside-copy>p:not(.eyebrow):not(.handwritten){margin:25px auto;max-width:420px}.inside-art{max-width:640px;width:90%;margin:0 auto}.inside-note{display:none}.inside-sticker{right:-15px;top:0;width:110px}.niche-note{position:static;margin-bottom:30px;font-size:25px;transform:rotate(-4deg)}.niches h2{margin-bottom:25px}.niche-links button{font-size:6.9vw}.niche-preview{display:none}.studio-layout{grid-template-columns:1fr;max-width:700px;margin-left:auto;margin-right:auto;gap:50px}.studio-features{display:grid;grid-template-columns:1fr 1fr;gap:25px}.studio-features article{padding:0;border:0;gap:13px}.studio-features p{font-size:18px}.watch{padding:60px 5% 30px}.watch-heading h2{font-size:43px}.watch-heading .handwritten{font-size:23px;flex-shrink:0}.video-chapters{grid-template-columns:1fr 1fr;gap:8px}.price-cards{gap:12px}.pricing{padding-left:4%;padding-right:4%}.price-card{padding:30px 15px 20px;border-radius:18px}.price-card h3{font-size:29px}.price-number{font-size:47px}.price-tagline{font-size:15px}.price-card li{font-size:15px}.price-card ul{gap:14px}.price-card .split-button{font-size:14px}.price-card .split-button>span:first-child{padding:12px 7px}.price-card .split-button>span:last-child{width:35px}.price-badge{font-size:12px}.final-cta{min-height:600px;grid-template-columns:.85fr 1fr}.cta-copy h2{font-size:46px}.cta-copy>p:not(.handwritten):not(.fine-print){font-size:18px}.cta-copy .fine-print br{display:none}.footer-top{grid-template-columns:1fr 1fr;gap:45px}.footer-contact{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;align-items:center}.footer-contact .handwritten{margin:0}.footer-contact>p:not(.handwritten){grid-column:2;margin-top:10px}.footer-bottom{flex-wrap:wrap}.footer-bottom>span:nth-child(2){order:3;flex-basis:100%}.footer-big{margin-top:25px}}
@media(max-width:599px){:root{--gutter:16px;--radius:46px;--space:78px}body{font-size:18px}html{scroll-padding-top:84px}section[id]{scroll-margin-top:83px}h2{font-size:44px;line-height:.92}.section-space{padding-left:20px;padding-right:20px}.rounded-panel{margin-left:8px;margin-right:8px}.site-header{height:80px;padding:16px}.wordmark>span:first-of-type{font-size:31px}.wordmark img{width:29px;height:29px}.wordmark-note{display:block;font-size:8px;margin-left:5px}.menu-toggle{font-size:16px;gap:13px;min-height:45px;padding:10px 13px}.hero{height:auto;min-height:1070px;border-radius:0 0 48px 48px}.hero-copy{width:100%;padding:165px 16px 0;pointer-events:auto}.hero-copy .eyebrow{font-size:11px;letter-spacing:.09em;margin-bottom:21px}.hero h1{font-size:clamp(48px,12.1vw,72px);line-height:.86;max-width:none;letter-spacing:-.02em}.hero-description{font-size:18px;line-height:1.24;width:100%;max-width:100%;margin-top:24px}.hero-actions{max-width:none;margin-top:22px;gap:11px;flex-wrap:wrap}.split-button{font-size:16px;min-height:49px}.split-button>span{padding:15px 17px}.split-button>span:last-child{width:47px;font-size:21px}.hero-actions .text-link{font-size:15px}.hero-copy .fine-print{margin-top:11px;font-size:12px;line-height:1.4;max-width:330px}.hero-art{top:auto;bottom:18px;height:390px;width:100%;right:0}.book-main{width:39%;top:12%;left:24%;transform:perspective(1000px) rotateY(-15deg) rotateZ(-13deg)}.book-garden{width:31%;top:2%;right:-5%;transform:rotate(19deg)}.book-food{width:26%;top:53%;right:8%;transform:rotate(14deg)}.hero-hand{position:fixed;display:none}.hero:before{content:'Your next big idea.\A A real, finished guide.';white-space:pre;position:absolute;top:104px;right:23px;font-family:Organichand;font-size:24px;line-height:.95;transform:rotate(5deg);color:var(--purple);z-index:4;text-align:center}.hero-sticker{width:86px;top:53%;left:4%;transform:rotate(9deg)}.starburst>span{font-size:18px}.book-peek{display:none}.hero-ribbon{width:180%;left:-50%;top:300px;height:850px}.hero-scroll{bottom:20px;font-size:12px;gap:10px}.hero-scroll span{width:29px;height:29px}.edition-label{display:none}.section-intro .eyebrow{font-size:11px;margin-bottom:18px}.section-intro>p:not(.eyebrow):not(.handwritten){font-size:18px;margin-top:20px}.desktop-only{display:none}.guides{padding:76px 0 65px}.guides .section-intro{margin:0 25px}.guides .margin-note{font-size:24px;margin-bottom:24px}.guides h2{font-size:44px}.guides .eyebrow{display:none}.shelf-toolbar{margin:30px 16px 10px}.shelf-toolbar>span{font-size:12px}.round-controls button{width:44px;height:44px;font-size:21px}.guide-shelf{gap:19px;padding:25px 20px 32px}.guide-card{flex:0 0 68vw;min-width:0;max-width:310px;border-radius:22px;padding:10px 10px 16px}.guide-card h3{font-size:26px}.guide-card .guide-deck{font-size:16px}.guide-card .cover-wrap{border-radius:13px}.shelf-bottom{margin:20px 20px 0;display:block;text-align:center}.shelf-bottom .handwritten{font-size:23px}.shelf-bottom .text-link{margin-top:16px;font-size:16px}.how{padding:48px 24px 50px}.panel-heading{display:block;text-align:center}.panel-heading h2{font-size:43px}.panel-heading .handwritten{font-size:25px;margin-top:22px;transform:rotate(-3deg)}.step-cards{margin:42px 3px 0;grid-template-columns:1fr;gap:30px}.step-card{padding:24px 24px 29px;display:grid;grid-template-columns:1fr 1fr;column-gap:10px;border-radius:22px;transform:rotate(-2deg);max-width:390px;margin:0 auto;width:100%}.step-card:nth-child(2){transform:rotate(2deg)}.step-card:nth-child(3){transform:rotate(-2deg)}.step-card:nth-child(4){transform:rotate(2deg)}.step-card>.handwritten{text-align:left;font-size:25px;grid-column:1}.step-card h3{grid-column:1;grid-row:2;font-size:29px;align-self:end;margin-bottom:13px}.step-art{grid-column:2;grid-row:1/3;margin:0;height:150px;width:100%;min-width:0}.step-card>p:not(.handwritten){grid-column:1/-1;font-size:17px;line-height:1.2;margin-top:8px}.step-card>p.step-footnote{font-size:12px}.mini-search{font-size:13px;padding:6px 8px;border-width:2px;border-radius:5px}.mini-search b{font-size:16px}.idea-art{gap:6px;padding-top:40px;transform:rotate(-4deg)}.idea-sun{font-size:57px;top:-2px}.idea-line{font-size:11px;gap:6px}.idea-line i{height:4px}.paper-icon{width:83px;height:111px;padding:11px;border-width:2px;box-shadow:5px 6px 0 #111}.paper-icon b{font-size:30px}.paper-icon i{height:3px;margin-top:8px}.giant-pencil{font-size:90px;right:-11px;bottom:1px}.little-star{font-size:37px;right:0;top:0}.editing-art img{width:79px}.edit-bubble{font-size:11px;top:11px;padding:7px;left:-8px}.art-swatches{bottom:6px;left:9px}.art-swatches i{width:23px;height:23px}.file-icon{width:78px;height:105px;font-size:21px;border-width:2px;box-shadow:5px 6px 0 #111}.file-icon span{font-size:39px}.export-check{width:40px;height:40px;font-size:27px;right:-5px;top:0;border-width:2px}.file-tag{font-size:24px;bottom:-3px;right:-7px}.inside{padding-top:85px;padding-bottom:80px;gap:24px}.inside-copy .eyebrow{font-size:11px;margin-bottom:22px}.inside-copy h2{font-size:46px}.inside-copy>p:not(.eyebrow):not(.handwritten){font-size:18px;max-width:300px;margin:23px auto}.inside-art{width:95%;padding-top:40px}.inside-sticker{width:83px;right:-7px;top:3px}.inside-sticker>span{font-size:17px}.page-spread{gap:5px;transform:rotate(-5deg)}.page-spread img{width:calc(50% - 2px)}.image-caption{font-size:11px;margin-top:29px}.niches{padding:52px 15px 46px}.niches>.eyebrow{font-size:10px}.niches h2{font-size:25px;margin:15px 0 22px}.niche-note{font-size:23px;margin-bottom:25px}.niche-links button{font-size:clamp(27px,7.45vw,43px);line-height:1.05;min-height:44px;padding:4px 0}.niche-links button>span{display:none}.niche-caption{font-size:13px;margin-top:27px}.studio{padding-top:80px;padding-bottom:75px}.studio h2{font-size:40px}.studio-layout{margin-top:40px;gap:40px}.studio-visual{padding:18px 12px 10px;border-radius:22px;transform:rotate(-1.5deg)}.studio-visual figcaption{font-size:10px;padding:9px 5px}.studio-watch{font-size:14px;min-height:50px;margin-top:6px}.studio-watch span{width:31px;height:31px;font-size:11px}.studio-features{grid-template-columns:1fr;gap:23px}.studio-features article>span{width:30px;height:30px;font-size:12px}.studio-features h3{font-size:24px}.studio-features p{font-size:17px}.watch{padding:50px 18px 25px}.watch-heading{display:block;text-align:center;margin-bottom:30px}.watch-heading .eyebrow{font-size:11px}.watch-heading h2{font-size:36px;line-height:.98;margin-top:20px}.watch-heading .handwritten{font-size:24px;margin-top:23px;transform:rotate(-4deg)}.video-frame{border-width:5px;border-radius:15px}.video-chapters{gap:7px;margin-top:18px}.video-chapters button{font-size:13px;min-height:45px;padding:10px 6px}.video-note{font-size:11px;line-height:1.3;margin-top:16px}.sell{padding-top:77px;padding-bottom:75px}.sell h2{font-size:43px;margin:22px 0}.sell>.eyebrow{font-size:11px}.sell>p:not(.eyebrow):not(.fine-print){font-size:18px}.platforms{gap:20px 29px;margin:33px 0 26px}.platforms>span{font-size:28px}.platforms .platform-etsy{font-size:34px}.sell .fine-print{font-size:11px}.pricing{padding:55px 20px 43px}.pricing h2{font-size:46px}.billing-toggle{margin:30px auto 38px}.billing-toggle button{font-size:15px;padding:12px 14px}.billing-toggle button>span{font-size:10px;margin-left:4px}.price-cards{grid-template-columns:1fr;gap:22px}.price-card{border-radius:20px;padding:28px 25px}.price-card.featured{transform:rotate(-1deg)}.price-card h3{font-size:34px}.price-tagline{font-size:17px;min-height:0;margin-top:9px}.price-number{font-size:62px;margin-top:20px}.price-number>span{font-size:17px}.billing-note{font-size:13px}.price-card ul{margin:22px 0 25px;padding-top:23px;gap:13px}.price-card li{font-size:17px}.price-card .split-button{font-size:17px;min-height:49px}.price-card .split-button>span:last-child{width:48px}.price-badge{font-size:13px;right:20px}.free-option{font-size:16px;margin-top:26px}.pricing-fine{font-size:12px;line-height:1.4;margin-top:14px}.faq{padding-top:85px;padding-bottom:80px}.faq h2{font-size:45px}.faq .handwritten{font-size:25px}.faq-list{margin-top:35px;margin-bottom:23px}.faq-list details{padding:0 18px;border-radius:12px}.faq-list summary{font-size:18px;min-height:65px;gap:17px}.faq-list details p{font-size:16px;padding:0 0 20px;line-height:1.4}.faq:before{border-width:55px;width:160%;height:650px;right:-28%}.final-cta{grid-template-columns:1fr;min-height:0}.cta-art{min-height:340px;order:2}.cta-spread{width:86%}.cta-copy{padding:48px 24px 40px;text-align:center;align-items:center}.cta-copy h2{font-size:46px;margin:27px 0 23px}.cta-copy>.handwritten{font-size:25px}.cta-copy>p:not(.handwritten):not(.fine-print){font-size:18px;max-width:30ch}.cta-copy>.split-button{margin-top:23px}.cta-copy .fine-print{font-size:12px;max-width:260px}.site-footer{padding:52px 24px 35px}.footer-top{grid-template-columns:1fr 1fr;gap:34px 20px}.footer-top>div:first-child{grid-column:1/-1}.footer-top .wordmark>span:first-of-type{font-size:39px}.footer-top p{font-size:16px;margin-top:17px}.footer-top nav{gap:5px;font-size:16px}.footer-top nav a{min-height:34px}.footer-top nav strong{font-size:11px}.footer-contact{grid-column:2;display:block;align-self:start}.footer-contact .handwritten{font-size:23px;margin:0 0 18px}.footer-contact>a{font-size:15px;overflow-wrap:anywhere}.footer-contact>p:not(.handwritten){font-size:13px;margin-top:16px}.footer-contact br{display:none}.footer-bottom{margin-top:40px;padding-top:21px;gap:15px;font-size:11px}.footer-bottom>div{gap:17px}.footer-bottom>span:nth-child(2){font-size:10px}.footer-bottom button{font-size:11px;min-height:44px}.footer-big{font-size:25.5vw;margin:20px 0 -10px -4px;letter-spacing:-.075em}.preview-tools{bottom:12px;right:12px;font-size:11px;padding-left:10px}.preview-tools>button{font-size:12px;min-height:38px;padding:8px 11px}.customizer{right:12px;bottom:70px;padding:23px;max-height:calc(100dvh - 90px)}.sample-dialog{padding:19px;border-radius:22px}.dialog-top{margin-bottom:17px}.dialog-top .eyebrow{font-size:10px}.sample-content{grid-template-columns:1fr;gap:25px}.sample-content>img{max-height:56vh;max-width:280px;margin:auto}.sample-content>div{padding:0 5px 10px}.sample-content h2{font-size:34px;margin:20px 0 16px}.sample-content .handwritten{font-size:23px}.sample-content>div>p:not(.handwritten){font-size:17px}.sample-content .sample-note{font-size:13px!important}.action-dialog{padding:34px 27px;border-radius:25px}.action-dialog>.handwritten{margin-top:29px}.action-dialog h2{font-size:38px}.action-dialog>p:not(.handwritten){font-size:17px}.action-dialog>.close-button{right:14px;top:14px}}
@media(max-width:370px){.wordmark-note{display:none}.hero{min-height:1100px}.hero h1{font-size:12vw}.hero-description{font-size:17px}.hero-actions{gap:5px}.hero-actions .split-button{font-size:15px}.hero-copy .fine-print{font-size:11px}.hero-art{height:370px}.niche-links button{font-size:7vw}.guides h2{font-size:39px}.panel-heading h2{font-size:38px}.step-card{padding:22px 18px}.step-card h3{font-size:26px}.how{padding-left:20px;padding-right:20px}.inside-copy h2{font-size:42px}.studio h2{font-size:36px}.watch-heading h2{font-size:32px}.billing-toggle button{padding:12px}.preview-tools{font-size:10px}}
/* Cover-only research study; product-page samples keep their existing reader. */
.cover-study-note{max-width:680px;margin:10px auto 0;padding:0 24px;text-align:center;font-size:13px;line-height:1.4;color:#595448}
.variant-heading{font-size:16px;margin-bottom:11px}
.cover-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}
.cover-options button{border:2px solid transparent;background:#f0ede7;border-radius:10px;padding:8px 7px;font-size:12px;line-height:1.15;display:flex;flex-direction:column;align-items:center;gap:8px}
.cover-options button[aria-pressed=true]{border-color:var(--purple);background:#e9e2f8}
.cover-options img{width:54px;aspect-ratio:816/1056;object-fit:cover;box-shadow:2px 3px 3px #1112}
.cover-selection-status{font-size:11px;margin:10px 0 14px;color:#5a514a;line-height:1.4}
.cover-research{background:#f0ede7;border-radius:12px;padding:0 14px;margin-top:16px}
.cover-research summary{font-size:17px;cursor:pointer;padding:13px 0;min-height:46px}
.cover-research p{font-size:15px;line-height:1.4;margin:0 0 12px}
.cover-research #cover-scope{font-size:12px;color:#5a514a}
.cover-research a{display:block;font-size:13px;text-decoration:underline;text-underline-offset:3px;line-height:1.3;padding-bottom:15px}
#download-cover{font-size:15px;margin-top:8px}
.sample-dialog.is-cover-concept .sample-content{align-items:start}
.sample-dialog.is-cover-concept .sample-content>img{position:sticky;top:0}
.sample-dialog.is-cover-concept .sample-content h2{font-size:37px;margin:18px 0}
.sample-dialog.is-cover-concept .sample-content .sample-note{font-size:12px!important;margin:14px 0 20px}
.sample-dialog.is-cover-concept .split-button{margin-top:12px}
@media(max-width:599px){.hero:before{content:'Real-life needs.\A Fresh cover ideas.'}.edition-label{display:block;bottom:67px;font-size:8px;right:16px;letter-spacing:.04em}.cover-study-note{font-size:12px}.shelf-toolbar>span{max-width:220px;padding-right:14px}.sample-dialog.is-cover-concept .sample-content>img{position:static;max-height:48vh}.sample-dialog.is-cover-concept .sample-content h2{font-size:32px}}

/* The niche list keeps its original styling; each niche now maps to one of the
   six new concepts. The caption keeps the covers-only caveat. Below 960px the
   hover cover preview is hidden, so the decorative arrow is hidden with it. */
.niche-caption>span{display:inline-block;margin-top:8px;font-size:13px}
@media(max-width:959px){.niche-links button>span{display:none}}

/* Keep the floating cover clear of every line of the desktop headline. */
@media(min-width:1200px){.hero h1{font-size:clamp(80px,7.65vw,123px)}.book-main{left:18%}.hero-art{z-index:2}}
@media(min-width:960px) and (max-width:1199px){.hero h1{font-size:8vw}.book-main{left:13%}.hero-art{z-index:2}}
/* The text block and arrow block rebound independently; their color surfaces
   squash without distorting the entire label. Transforms are driven by WAAPI. */
.split-button.has-split-motion{position:relative;isolation:isolate;overflow:visible;touch-action:manipulation;transition:scale .15s cubic-bezier(.4,0,.2,1)}
.split-button.has-split-motion>span{position:relative;background:none;filter:none;transition:none;flex-shrink:0;overflow:visible}
.split-button.has-split-motion:hover>span{filter:none;transform:none}
.split-button.has-split-motion>.split-text-section{transform-origin:center left}
.split-button.has-split-motion>.split-icon-section{transform-origin:center right}
.split-surface{position:absolute;inset:0;border-radius:inherit;background:var(--accent);pointer-events:none;transform-origin:center}
.split-label,.split-icon{position:relative;z-index:1;display:block;pointer-events:none}
.split-label{white-space:pre;font-kerning:none}
.split-char{display:inline-block;transform-origin:center;white-space:pre}
.has-nav-motion{overflow:visible;touch-action:manipulation}
.nav-label{display:inline-block;white-space:pre;font-kerning:none;pointer-events:none}
.menu-toggle>.nav-label{font-size:inherit}
.has-nav-motion.is-animating .split-char{will-change:transform}
.split-button.is-animating>.split-text-section,.split-button.is-animating>.split-icon-section,.split-button.is-animating .split-surface,.split-button.is-animating .split-char{will-change:transform}
@media(prefers-reduced-motion:no-preference){.split-button.has-split-motion:is(:active,.is-pressed):not(:disabled){scale:.955 .925}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.split-button.has-split-motion:is(:active,.is-pressed):not(:disabled) .split-surface{filter:brightness(.92)}}
/* 2026-09-10 hero simplification (Nash): header aligned to the hero copy's left edge, floating books and sticker hidden for now */
@media(min-width:600px){.site-header{padding-left:var(--hero-inset);padding-right:var(--hero-inset)}}
.hero-art .floating-book,.book-peek,.hero-sticker,.hero-hand,.hero:before{display:none!important}

/* 2026-09-10 site-wide edge alignment: every section's content shares the hero copy's left edge */
@media(min-width:600px){
.section-space{padding-left:var(--hero-inset);padding-right:var(--hero-inset)}
.guides{padding-left:0;padding-right:0}.shelf-toolbar{margin-left:var(--hero-inset);margin-right:var(--hero-inset)}.guide-shelf{padding-left:var(--hero-inset);padding-right:var(--hero-inset)}.guides .section-intro{margin-left:var(--hero-inset);margin-right:var(--hero-inset)}.shelf-bottom{margin-left:var(--hero-inset);margin-right:var(--hero-inset)}
.how,.niches,.watch,.pricing{padding-left:calc(var(--hero-inset) - 18px);padding-right:calc(var(--hero-inset) - 18px)}
.step-cards{margin-left:0;margin-right:0}
.cta-copy{padding-left:calc(var(--hero-inset) - 18px)}
.site-footer{padding-left:var(--hero-inset);padding-right:var(--hero-inset)}
}
.accent-options{display:flex;gap:8px;margin-top:10px}.accent-options button{width:44px;height:44px;border-radius:50%;border:3px solid transparent;box-shadow:0 0 0 1px #1112}.accent-options button[aria-pressed=true]{border-color:var(--paper);box-shadow:0 0 0 2px var(--ink)}.customizer fieldset>.control-note{font-size:12px;color:#625c56;margin:-4px 0 12px;line-height:1.35}
/* Cinematic scroll layer: everything is visible at rest; only elements below the first viewport start offset, and they settle as they arrive */
/* Vanilla motion layer removed 2026-09-10: page is static except the "Where it sells" section. */
/* 2026-09-10 right-edge consistency: video, FAQ and CTA copy share the same 66px edges as everything else */
@media(min-width:600px){.video-frame{margin-left:0;margin-right:0;width:auto}.faq-list{max-width:none;margin-left:0;margin-right:0;width:100%}.cta-copy{padding-right:calc(var(--hero-inset) - 18px)}}

/* Motion (2026-09-10): only the "Where it sells" section animates. Headline fills from outline to ink as it scrolls past; the storefront row is a scroll-reactive band. Everything else is the original static page. */
@media(prefers-reduced-motion:no-preference){
.mask-host{position:relative;color:transparent;-webkit-text-stroke:2px var(--ink)}.mask-reveal{position:absolute;inset:0;color:var(--ink);-webkit-text-stroke:0;clip-path:inset(100% 0 0 0);pointer-events:none}
.platforms.marquee-row{display:block;white-space:nowrap;overflow:hidden;width:calc(100% + 2*var(--hero-inset));margin-left:calc(-1*var(--hero-inset))}.marquee-track{display:flex;flex-wrap:nowrap;will-change:transform;width:max-content}.marquee-content{display:flex;flex-shrink:0;align-items:baseline}.marquee-content>span{padding:0 34px;flex-shrink:0;line-height:1;margin:0}.marquee-content>i{align-self:center}.marquee-content>i{width:10px;height:10px;border-radius:50%;background:var(--orange);flex-shrink:0}
}

/* The bookshelf (2026-09-11): six spines in a row, one open at a time. Flex-basis transitions do the sliding; the cover and copy fade in a beat after the spine widens. */
.guide-spines{display:flex;gap:10px;height:min(600px,70vh);min-height:480px;margin:54px var(--hero-inset) 0;position:relative}
.guide-spine{flex:1 1 0;min-width:0;background:var(--card-color);border-radius:24px;position:relative;overflow:hidden;transition:flex-grow .7s cubic-bezier(.22,.8,.2,1),transform .35s;will-change:flex-grow}
.guide-spine.is-open{flex-grow:4.6}
.guide-spine:not(.is-open):hover{transform:translateY(-6px)}
.spine-label{position:absolute;inset:0;width:100%;height:100%;background:none;padding:26px 0 28px;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:16px;transition:opacity .35s;cursor:pointer;text-align:center}
.spine-title{writing-mode:vertical-rl;transform:rotate(180deg);font-family:var(--heading);font-size:clamp(22px,2vw,30px);line-height:1;letter-spacing:-.01em;white-space:nowrap;max-height:78%;overflow:hidden;text-overflow:ellipsis}
.spine-category{writing-mode:vertical-rl;transform:rotate(180deg);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:#111c;white-space:nowrap;order:-1}
.guide-spine.is-open .spine-label{opacity:0;pointer-events:none}
.spine-body{position:absolute;inset:0;padding:24px;display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1fr);gap:24px;align-items:end;opacity:0;transform:translateX(24px);transition:opacity .45s ease .2s,transform .6s cubic-bezier(.22,.8,.2,1) .15s;pointer-events:none}
.guide-spine.is-open .spine-body{opacity:1;transform:none;pointer-events:auto}
.spine-cover{background:none;padding:0;border-radius:16px;overflow:hidden;aspect-ratio:816/1056;max-height:100%;align-self:center;position:relative;box-shadow:0 18px 40px #00000022;transform:rotate(-3deg);transition:transform .4s;text-align:center}
.spine-cover img{width:100%;height:100%;object-fit:cover;display:block}
.spine-cover:hover{transform:rotate(-1deg) translateY(-6px)}
.spine-peek{position:absolute;bottom:12px;left:50%;transform:translate(-50%,20px);opacity:0;white-space:nowrap;background:white;color:#111;border-radius:30px;padding:9px 16px;font-size:14px;transition:.3s}
.spine-cover:hover .spine-peek,.spine-cover:focus-visible .spine-peek{transform:translate(-50%,0);opacity:1}
.spine-copy{display:flex;flex-direction:column;align-items:flex-start;padding-bottom:6px;min-width:0}
.spine-copy h3{font-size:clamp(26px,2.4vw,38px);line-height:.96;margin:10px 0 12px;text-wrap:balance}
.spine-copy .guide-deck{font-size:17px;line-height:1.25;margin:0}
.guides .cover-study-note{margin-left:var(--hero-inset);margin-right:var(--hero-inset)}
@media(max-width:1024px){.guide-spines{height:520px;min-height:0;gap:8px}.guide-spine.is-open{flex-grow:5.5}.spine-body{padding:18px;gap:16px}.spine-title{font-size:20px}}
@media(max-width:700px){.guide-spines{flex-direction:column;height:auto;min-height:0;margin:32px 16px 0;gap:8px}.guide-spine{flex:none;height:64px;transition:height .6s cubic-bezier(.22,.8,.2,1)}.guide-spine.is-open{height:auto;min-height:420px}.guide-spine:not(.is-open):hover{transform:none}.spine-label{flex-direction:row;justify-content:space-between;padding:0 18px;gap:10px}.spine-title{writing-mode:horizontal-tb;transform:none;font-size:20px;max-height:none;max-width:100%}.spine-category{display:none}.spine-body{position:relative;inset:auto;grid-template-columns:1fr;gap:14px;padding:16px;align-items:start}.spine-cover{max-width:220px;margin:0 auto;align-self:start}.spine-copy h3{font-size:28px}.spine-copy .guide-deck{font-size:16px}.guides .cover-study-note{margin-left:16px;margin-right:16px}}

/* Hero copy v2: longer headline and subhead, books removed so the column can breathe */
.hero-copy{width:94%;max-width:1180px}
.hero h1{font-size:clamp(40px,4.45vw,66px);line-height:.92;letter-spacing:-.018em;max-width:none;text-wrap:pretty}
@media(min-width:1200px){.hero h1{font-size:clamp(54px,4.45vw,66px)}}
@media(min-width:960px) and (max-width:1199px){.hero h1{font-size:4.9vw}}
.hero-description{width:620px;max-width:92%;font-size:20px;line-height:1.34;margin-top:27px}
@media(min-width:1700px){.hero-description{width:680px;font-size:21px}}
.hero-copy .fine-print{max-width:520px}
@media(max-width:1199px){.hero-copy{width:92%}.hero h1{font-size:5.2vw}.hero-description{width:540px;font-size:19px}.hero-actions{max-width:none}}
@media(max-width:959px){.hero{min-height:0;height:auto;padding-bottom:74px}.hero-copy{width:100%;padding-right:var(--hero-inset)}.hero h1{font-size:6.4vw}.hero-description{width:100%;max-width:620px}}
@media(max-width:599px){.hero{min-height:0;height:auto;padding-bottom:104px}.hero-copy{width:100%;max-width:none;padding-right:16px}.hero h1{font-size:clamp(34px,8.6vw,46px);line-height:.98;max-width:none}.hero-description{font-size:17px;line-height:1.35}.hero-copy .fine-print{max-width:330px}.hero-art{display:none}.hero:before{display:none}}
@media(max-width:599px){.platforms.marquee-row{width:calc(100% + 40px);margin-left:-20px}}
@media(max-width:1199px){.hero h1 br{display:none}.hero h1{text-wrap:balance}}
/* Longer guide titles need to fit the spine without an ellipsis */
.spine-title{font-size:clamp(18px,1.68vw,26px);max-height:88%}
@media(max-width:1024px){.spine-title{font-size:18px}}
@media(max-width:700px){.spine-title{font-size:19px;max-height:none}}
/* Reading view: the first pages at full size, the rest as a strip */
.sample-dialog:has(#guide-read:not([hidden])){width:min(1080px,94vw);max-height:92vh}
.guide-read{display:grid;grid-template-columns:minmax(0,1fr) 296px;gap:34px;align-items:start}
.read-head{grid-column:1/-1;border-bottom:2px solid var(--ink);padding-bottom:18px}
.read-head .eyebrow{color:#555}
.read-head h2{font-size:clamp(30px,3.4vw,46px);line-height:.98;margin:10px 0 8px}
.read-deck{font-size:19px;max-width:46ch}
.read-meta{margin-top:10px;font-size:13px;letter-spacing:.04em;text-transform:uppercase;color:#6b6659;font-weight:700}
.read-pages{display:flex;flex-direction:column;gap:22px}
.read-page{margin:0}
.read-page img{width:100%;height:auto;border-radius:6px;box-shadow:0 10px 26px #0000001f;border:1px solid #0000000f}
.read-page figcaption{margin-top:7px;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:#6b6659}
.read-rest{grid-column:1;margin-top:28px;border-top:1px solid #0000001a;padding-top:20px}
.rest-heading{font-size:13px;letter-spacing:.1em;text-transform:uppercase;font-weight:700;color:#6b6659;margin-bottom:14px}
.rest-strip{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:12px}
.rest-strip figure{margin:0}
.rest-strip img{width:100%;height:auto;border-radius:3px;box-shadow:0 4px 10px #00000016;border:1px solid #0000000f}
.rest-strip figcaption{margin-top:5px;font-size:11px;color:#6b6659;text-align:center}
.read-note{grid-column:1;margin-top:22px;font-size:13px;line-height:1.45;color:#6b6659;max-width:62ch}
.read-aside{position:sticky;top:0;display:flex;flex-direction:column;gap:14px}
.read-aside .split-button{width:100%}
@media(max-width:860px){.guide-read{grid-template-columns:1fr;gap:24px}.read-aside{position:static;border-top:1px solid #0000001a;padding-top:20px}.read-rest,.read-note{grid-column:1}.read-pages{gap:16px}}
@media(max-width:599px){.sample-dialog:has(#guide-read:not([hidden])){width:auto;max-height:92dvh}.read-head h2{font-size:30px}.read-deck{font-size:17px}.rest-strip{grid-template-columns:repeat(auto-fill,minmax(74px,1fr));gap:9px}}
/* How it works, domino fan: overlapping cards that tip further right with each step */
.step-cards{grid-template-columns:repeat(4,minmax(0,1fr));gap:0;margin:76px var(--hero-inset) 0;align-items:stretch}
.step-card{padding:26px 18px 30px 48px;border:2px solid var(--ink);border-radius:22px;box-shadow:9px 10px 0 #16150f1a;margin-left:-14px;position:relative;transform:rotate(calc(-2deg + var(--fan,0) * 1.4deg));transition:transform .3s,box-shadow .3s}
.step-card:nth-child(1){--fan:0;margin-left:0;z-index:4}
.step-card:nth-child(2){--fan:1;z-index:3}
.step-card:nth-child(3){--fan:2;z-index:2}
.step-card:nth-child(4){--fan:3;z-index:1}
.step-card:hover{transform:rotate(calc(-2deg + var(--fan,0) * 1.4deg)) translateY(-7px);box-shadow:9px 16px 0 #16150f1f}
.step-card.cyan{background:var(--hx-sage)}
.step-card.pink{background:var(--hx-peach)}
.step-card.yellow{background:var(--hx-gold)}
.step-card.lilac{background:var(--hx-amber)}
.step-card>.handwritten{text-align:left}
.step-card .step-art{height:214px;margin:14px 0 22px}
@media(max-width:1199px){.step-cards{margin-left:var(--hero-inset);margin-right:var(--hero-inset)}.step-card{padding:24px 14px 28px 42px}}
@media(max-width:959px){.step-cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:54px var(--hero-inset) 0}.step-card .step-art{height:168px;margin:10px 0 16px}.step-card{margin-left:0;padding:24px 22px 28px;transform:rotate(calc(-2deg + var(--fan,0) * 1.4deg))}.step-card:hover{transform:rotate(calc(-2deg + var(--fan,0) * 1.4deg)) translateY(-5px)}}
@media(max-width:599px){.step-cards{grid-template-columns:1fr;gap:26px;margin:42px 16px 0}.step-card{transform:rotate(calc(-1.5deg + var(--fan,0) * 1deg));padding:24px 22px 28px;max-width:420px}.step-card .step-art{height:150px;margin:0}}
/* Open spine: sit the copy just above centre rather than on the floor */
.spine-body{align-items:center}
.spine-copy{justify-content:center;padding-bottom:0;transform:translateY(-4%)}
@media(max-width:700px){.spine-body{align-items:start}.spine-copy{transform:none}}
/* Hero background: the wordmark stood on its edge, like a spine beside the copy */
.hero-mark{position:absolute;inset:0;z-index:-1;display:flex;align-items:center;justify-content:flex-end;padding-right:clamp(10px,2.2vw,34px);pointer-events:none;overflow:hidden}
.hero-mark span{font-family:var(--heading);font-weight:700;font-size:clamp(104px,12.4vw,178px);line-height:1;letter-spacing:-.03em;color:var(--orange);opacity:.34;writing-mode:vertical-rl;transform:rotate(180deg)}
@media(max-width:959px){.hero-mark span{font-size:clamp(92px,13vw,130px);opacity:.3}}
@media(max-width:599px){.hero-mark{align-items:flex-end;padding-right:6px}.hero-mark span{font-size:74px;opacity:.2;margin-bottom:92px}}
/* How it works: bone-paper ground so all four card hues read at full strength */
.how{background:var(--how-ground,var(--cyan))}
.how:before{border-color:#ffffffcc}
/* Tablet: step 4's "Yours to sell." was landing on top of the PDF icon */
@media(max-width:959px) and (min-width:600px){.step-card.lilac .step-art{justify-content:flex-start;padding-left:4px}.step-card.lilac .file-tag{font-size:23px;bottom:2px}}
@media(max-width:1199px) and (min-width:600px){.step-card.lilac .file-icon{width:94px;height:116px;font-size:24px;box-shadow:6px 6px 0 #111}.step-card.lilac .file-icon span{font-size:44px}.step-card.lilac .export-check{width:44px;height:44px;font-size:30px;right:4px}.step-card.lilac .file-tag{font-size:24px}}
@media(max-width:599px){.step-card.lilac .file-tag{display:none}}
/* Inside a finished guide: the burst was too small for its own line, so "All yours." sat outside it */
.inside-sticker{width:180px;right:-44px;top:-112px}
.inside-sticker>span{font-size:25px;line-height:1.02}
@media(max-width:1199px){.inside-sticker{width:156px;right:-34px;top:-92px}.inside-sticker>span{font-size:22px}}
@media(max-width:959px){.inside-sticker{width:158px;right:-40px;top:-78px}}
@media(max-width:599px){.inside-sticker{width:118px;right:-4px;top:6px}.inside-sticker>span{font-size:17px}}
/* Inside headline: at every width below 1920 the last line was overflowing its column and orphaning "it." */
@media(min-width:960px){.inside-copy h2{font-size:clamp(40px,4.2vw,77px)}}
/* Inside a finished guide: give the exported pages a real edge against the white section */
.page-spread img{border:2px solid var(--ink);box-shadow:2px 0 0 #dad2ba,4px 4px 0 #e3ddc8,7px 7px 0 #c1b699,9px 9px 0 var(--ink)}
@media(max-width:599px){.page-spread img{border-width:1.5px;box-shadow:1px 0 0 #dad2ba,3px 3px 0 #e3ddc8,5px 5px 0 #c1b699,6px 6px 0 var(--ink)}}
/* Inside a finished guide: the two pages hang from a washing line on two pegs each */
.page-spread{position:relative;align-items:flex-start;overflow:visible;--peg-w:17px;--peg-h:46px}
.page-spread .peg-line{position:absolute;left:-16%;right:-5%;top:calc(var(--peg-h) * -.3);height:3px;background:var(--ink);border-radius:3px;z-index:1}
.page-hang{position:relative;width:calc(50% - 4px);z-index:2}
.peg{position:absolute;top:calc(var(--peg-h) * -.52);width:var(--peg-w);height:var(--peg-h);z-index:4;border:2px solid var(--ink);border-radius:calc(var(--peg-w) * .28);background:linear-gradient(100deg,#f0cf98 0 38%,#d8ab63 38% 62%,#c1924b 62%)}
.peg:before{content:'';position:absolute;left:50%;top:34%;width:2px;height:44%;margin-left:-1px;background:#00000047;border-radius:2px}
.peg:after{content:'';position:absolute;left:-2px;right:-2px;top:34%;height:calc(var(--peg-h) * .1);background:linear-gradient(#efece4,#a8a094);border-top:2px solid var(--ink);border-bottom:2px solid var(--ink)}
.peg-a{left:16%}
.peg-b{right:18%}
.page-hang:last-of-type .peg-a{left:20%}
.page-hang:last-of-type .peg-b{right:14%}
@media(max-width:1199px){.page-spread{--peg-w:15px;--peg-h:40px}}
@media(max-width:959px){.page-spread{--peg-w:16px;--peg-h:43px}}
@media(max-width:599px){.page-spread{--peg-w:11px;--peg-h:29px}.page-spread .peg-line{height:2px;left:-12%;right:-2%}.page-spread .page-sway>img{border-width:1.5px}.page-hang{width:calc(50% - 2px)}}
@media(min-width:960px){.inside-art{padding-right:clamp(6px,1.5vw,30px)}}
/* With the washing line across the top, the burst moves to the foot of the spread */
.inside-sticker{top:auto;bottom:-34px;right:-26px}
@media(max-width:1199px){.inside-sticker{top:auto;bottom:-28px;right:-20px}}
@media(max-width:959px){.inside-sticker{top:auto;bottom:-26px;right:auto;left:-14px}}
@media(max-width:599px){.inside-sticker{top:auto;bottom:-12px;right:auto;left:-6px}}
/* The sheets swing on their pegs, as if a window were open somewhere */
.page-spread{filter:none}
.page-sway{transform-origin:50% 0;animation:sheet-sway 9.2s ease-in-out infinite;will-change:transform,translate}
.page-hang:last-of-type .page-sway{animation-duration:11.3s;animation-delay:-4.1s}
.page-spread .page-sway>img{width:100%;border:2px solid var(--ink);box-shadow:9px 15px 17px #29251724}
.page-spread .page-hang:first-of-type .page-sway>img{transform:perspective(1000px) rotateY(7deg);transform-origin:right}
.page-spread .page-hang:last-of-type .page-sway>img{transform:perspective(1000px) rotateY(-7deg);transform-origin:left}
.peg{box-shadow:2px 4px 5px #2925171f}
@keyframes sheet-sway{
  0%{transform:skewX(-1.15deg)}
  24%{transform:skewX(.72deg)}
  46%{transform:skewX(-.38deg)}
  70%{transform:skewX(1.02deg)}
  100%{transform:skewX(-1.15deg)}
}
@media(prefers-reduced-motion:reduce){.page-sway{animation:none;transform:skewX(-.5deg)}.page-hang:last-of-type .page-sway{transform:skewX(.45deg)}}
.hw-line{display:block;width:-moz-fit-content;width:fit-content}
/* The wheel the site runs on, re-tuned to Matcha (2026-09-13). Measured in OKLCH, this palette occupies
   exactly two hue bands and nothing else: 39 to 87 for the warms (accent, orange, pink, soft-pink, cyan,
   pale-blue) and 125 to 150 for the greens (butter, yellow, lilac, purple). The Reef wheel sat outside both,
   at hue 189 for its teal and 29 for its coral, which is why those panels read as a different site. Every
   value below is inside a band, every one clears 10:1 on the ink text, and the closest pair is .075 apart
   in OKLab so all six stay tellable at a glance. */
:root{--hx-lime:#c8e69f;--hx-mint:#dbfbd4;--hx-sage:#95cf9a;--hx-gold:#ffe0a2;--hx-amber:#feae55;--hx-peach:#ffc09e}
/* Niches: wheel pink ground, the site's purple for handwriting and hover. Under the cursor the word is rewritten in Organichand, the same hand as every margin note, a third larger so its lowercase matches Champ's. The row grows to fit and the rows below step down with it, the way the reference did. */
.niches{background:var(--orange)}
.niche-note{color:var(--purple)}
.niche-links button{font-family:var(--heading);font-style:normal;line-height:1;transition:color .18s}
.niche-links button>.niche-name{position:static;opacity:1;display:inline-block;transition:none;font-family:var(--heading);letter-spacing:-.012em}
.niche-links button:hover,.niche-links button:focus-visible{color:var(--purple)}
.niche-links button:hover>.niche-name,.niche-links button:focus-visible>.niche-name{font-family:Organichand,cursive;font-weight:400;font-size:1.3em;letter-spacing:0;line-height:1}
.niche-links button>span:last-child{right:auto;left:calc(100% - 8px);font-family:var(--heading);font-style:normal;font-weight:700;letter-spacing:0}
.niche-caption>span{color:var(--purple)}
/* Preview: one cover or two, fanned, at the right of the list */
.niche-preview{display:flex;align-items:flex-end;justify-content:flex-end;width:auto;right:4%;top:50%;transform:none;box-shadow:none;pointer-events:none;opacity:0;transition:opacity .2s,transform .3s;z-index:1}
.niche-preview .niche-cover{width:175px;height:auto;display:block;border:2px solid var(--ink);box-shadow:8px 10px 0 #0003;transform:rotate(12deg)}
.niche-preview[data-count="2"] .niche-cover:first-child{transform:rotate(-7deg) translateY(10px);z-index:1}
.niche-preview[data-count="2"] .niche-cover:last-child{margin-left:-46px;transform:rotate(9deg) translateY(-14px);z-index:2}
.niches:has(.niche-links button:hover) .niche-preview,.niches:has(.niche-links button:focus-visible) .niche-preview{opacity:1;transform:translateY(-22px)}
@media(max-width:1199px){.niche-preview .niche-cover{width:150px}.niche-preview[data-count="2"] .niche-cover:last-child{margin-left:-40px}}
/* No hover on touch: the cover preview stays off below 960px, as the base layout intended */
@media(max-width:959px){.niche-preview{display:none}}
/* The video section moves onto the wheel: the studio frame and the Watch panel were a pale cyan that belonged to no hue on it. Violet is Nash's pick: it carries the eye down into the purple footer, and the dark screenshot and the dark player read as screens against it. */
/* Palette pass, 2026-09-11. Everything that was still painted in a colour predating the wheel now comes off it.
   --soft-pink was a tint of the retired magenta #fd48f2; it is now a 28% tint of the wheel pink, which is what the
   CTA ground, the hero burst, the step-4 file icon and the review card all wanted. --orange becomes the wheel amber
   exactly. The FAQ rings and answer cards were the last pale cyan on the site: they move to tints of the wheel teal,
   the one hue nothing else spends, so the section reads as a cool breath between the yellow pricing and the pink CTA.
   The three paint chips in the step-3 artwork were literally showing the old magenta and old cyan; they now show the
   site's own pink and sky. After this, no colour on the page sits off the wheel. */
.art-swatches i:nth-child(2){background:var(--hx-peach)}
.art-swatches i:nth-child(3){background:var(--hx-gold)}
/* Contrast on the pink panel: purple can never clear AA for small text on the wheel pink, so the caption line
   (not handwriting, so not bound by the purple rule) goes back to ink, and the phone size of the handwritten note
   goes to 25px, matching desktop, which puts it in the large-text band where its 4:1 against the pink is enough. */
.niche-caption>span{color:var(--ink)}
@media(max-width:599px){.niche-note{font-size:25px}}
/* Same large-text rule on the tablet step: the Watch note dropped to 23px there, just under the band, so it goes to 25px. */
@media(max-width:959px){.watch-heading .handwritten{font-size:25px}}
/* The Watch panel carried a 32px bottom pad only because the recording disclaimer sat in it. With the note gone the
   chapter row was left hard against the panel edge, so the bottom pad comes up to sit alongside the other panels. */
.watch{padding-bottom:60px}
@media(max-width:959px){.watch{padding-bottom:48px}}
@media(max-width:599px){.watch{padding-bottom:38px}}
/* New hero headline is two sentences on two lines. Below 370px the first one ran a few pixels wide and the wrap
   landed mid-sentence, so the size steps down just enough to keep one sentence per line. */
@media(max-width:370px){.hero h1{font-size:8.9vw}}
/* Closing panel art is an open guide: two real facing pages from the meal prep build, the same ones the
   look-inside viewer shows. A spread is wide rather than tall, so unlike the cover card it is sized off the
   column width and not off the panel height, and the percentage steps up as the column narrows. */
@media(min-width:960px) and (max-width:1199px){.cta-spread{width:88%}}
/* The spread is sized off the column width, so as the column narrows the artwork gets shorter
   while the panel stays 740 tall and the green around it grows. Measured at 1024: 296px of
   artwork with 222px of empty green above and below. This band drops the panel to match. */
@media(min-width:960px) and (max-width:1199px){.final-cta{min-height:640px}}
/* Two facing pages need width. Below 960 the .85/1 split leaves the art column at 360px or less,
   which puts each page under 170px wide, so the panel stacks through that whole band and the
   spread takes the full width instead. Measured at 820: 339px side by side against 580px stacked. */
@media(min-width:600px) and (max-width:959px){
  .final-cta{grid-template-columns:1fr;min-height:0}
  .cta-art{min-height:0;padding:40px 0;order:2}
  .cta-spread{width:74%}
}
/* Below 436 the closing headline breaks its own lines and strands a single word. Measured against the
   longest line, "Finish it tonight.", which needs 8.08px of width for every 1px of font size against a
   column of viewport minus 64. Under that width the size tracks the viewport so the three authored lines
   stay three lines; at 436 and up the fixed 46px fits and takes over. */
@media(max-width:435px){.cta-copy h2{font-size:calc(12.2vw - 8px)}}
/* Premium scroll pass (2026-09-11). The hero copy, watermark and scroll cue hold at zero opacity until cinematic.js starts
   the load sequence. The head script sets cin-boot only when motion is allowed and clears it after 1.5s if the script never runs. */
html.cin-boot .hero-copy>*,html.cin-boot .hero-mark,html.cin-boot .hero-scroll{opacity:0}
/* Line-mask headline reveal. Each <br> line sits in its own clip and slides up into place. The padding gives the chunky
   face room for ascenders and descenders inside the clip, the negative margin cancels it in layout, and .done lifts the
   clip once the reveal has played so nothing is ever cropped at rest. */
.line-mask{display:block;overflow:hidden;padding:.14em 0 .16em;margin:-.14em 0 -.16em}
.line-mask.done{overflow:visible}
.line-in{display:block}

/* The live offer band, and the report dialog. Both came from the React landing
   this page replaces; see components/site/offer-band.tsx and report.tsx. */
#offer-band{position:fixed;left:0;right:0;bottom:0;z-index:60;display:block;text-align:center;
  background:var(--accent);color:var(--on-accent);font-size:13px;font-weight:700;letter-spacing:.02em;
  padding:14px 16px;padding-bottom:max(14px,env(safe-area-inset-bottom));transition:opacity .3s}
#offer-band:hover{opacity:.9}
.report-open{background:none;color:inherit;margin-top:16px;font-size:15px;font-weight:700;min-height:44px;
  display:inline-flex;align-items:center;gap:9px;border-radius:999px;padding:9px 17px;
  box-shadow:inset 0 0 0 1px #ffffff55}
.report-open:before{content:'\21BA';font-size:16px}
.report-open:hover{box-shadow:inset 0 0 0 1px #fff}
.report-dialog{width:520px}
.report-dialog h2{margin-bottom:20px}
.report-kinds{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:22px}
.report-kinds button{background:var(--soft-pink);color:var(--ink);border-radius:999px;padding:10px 15px;
  font-size:14px;font-weight:600;min-height:44px}
.report-kinds button[aria-pressed=true]{background:var(--ink);color:var(--paper)}
.report-dialog label{display:block;font-size:14px;font-weight:700;margin:0 0 7px}
.report-dialog label i{font-style:normal;font-weight:500;opacity:.62}
.report-dialog textarea,.report-dialog input[type=email]{width:100%;border:2px solid #1110;background:var(--soft-pink);
  border-radius:12px;padding:13px 15px;font-size:16px;margin-bottom:18px;resize:vertical;color:var(--ink)}
.report-dialog textarea:focus-visible,.report-dialog input[type=email]:focus-visible{border-color:var(--purple);outline:0}
.report-hp{position:absolute;left:-9999px;width:0;height:0;opacity:0}
.report-status{font-size:14px;margin-top:14px;min-height:20px}
.report-status.is-bad{color:#a3311a}
.report-dialog .split-button{margin-top:2px}
.footer-top nav strong.nav-group{margin-top:24px}
@media(max-width:599px){
  #offer-band{font-size:11.5px;padding:14px;padding-bottom:max(14px,env(safe-area-inset-bottom))}
  .report-dialog{width:auto}
  .report-kinds button{font-size:13px;padding:10px 12px}
}

/* ---- North-east arrow ---------------------------------------------------
   U+2197 has no text glyph anywhere in the Degular stack, so iOS fell through
   to Apple Color Emoji and painted a blue tile inside the rust button. Drawn
   here instead: one blunt mitred arrow at Champ's weight, carried as a mask so
   it takes the colour of whatever it sits in and follows the palette switcher. */
:root{
  --ico-ne:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='2%202%2020%2020'%3E%3Cpath%20d='M2.3%209.5H13.5V5.2L21.7%2012L13.5%2018.8V14.5H2.3Z'%20transform='rotate(-45%2012%2012)'/%3E%3C/svg%3E");
  --ico-s:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='2%202%2020%2020'%3E%3Cpath%20d='M2.3%209.5H13.5V5.2L21.7%2012L13.5%2018.8V14.5H2.3Z'%20transform='rotate(90%2012%2012)'/%3E%3C/svg%3E");
  --ico-w:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='2%202%2020%2020'%3E%3Cpath%20d='M2.3%209.5H13.5V5.2L21.7%2012L13.5%2018.8V14.5H2.3Z'%20transform='rotate(180%2012%2012)'/%3E%3C/svg%3E");
  --ico-e:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='2%202%2020%2020'%3E%3Cpath%20d='M2.3%209.5H13.5V5.2L21.7%2012L13.5%2018.8V14.5H2.3Z'/%3E%3C/svg%3E")}
.ico-ne{display:inline-block;flex:none;width:1.1em;height:1.1em;vertical-align:-.17em;background:currentColor;
  -webkit-mask:var(--ico-ne) center/contain no-repeat;mask:var(--ico-ne) center/contain no-repeat}
.ico-s{-webkit-mask-image:var(--ico-s);mask-image:var(--ico-s)}
.ico-w{-webkit-mask-image:var(--ico-w);mask-image:var(--ico-w)}
.ico-e{-webkit-mask-image:var(--ico-e);mask-image:var(--ico-e)}
.sign-in-icon .ico-ne{width:21px;height:21px}
.split-button>span:last-child .ico-ne{width:1.05em;height:1.05em}
.hero-scroll .ico-s,.sample-pager .ico-ne{width:1.05em;height:1.05em}
.split-icon>.ico-ne{display:block}

/* ---- Wordmark lockup ----------------------------------------------------
   Desktop keeps the note beside the name on two lines. The phone header has no
   room beside it, so the note drops to its own row under the name and runs as
   one line; both breaks are CSS, so neither width owns a hard <br>. */
.wordmark-note>span{display:block}
@media(max-width:599px){
  .wordmark{flex-wrap:wrap;row-gap:2px;white-space:normal}
  /* Sized off the gap left by the fixed-width Menu button, so the line always
     lands clear of it instead of sliding under it on a narrower phone. */
  .wordmark-note{display:block;flex:0 0 100%;margin-left:0;line-height:1;white-space:nowrap;
    font-size:min(10px,calc((100vw - 165px)/16.8));letter-spacing:.18em}
  .wordmark-note>span{display:inline}
}
@media(max-width:370px){.wordmark-note{display:block}}
@media(max-width:339px){.wordmark-note{display:none}}

/* ---- Hero copy clears the watermark -------------------------------------
   The vertical Octavo mark owns a column down the right edge of the phone hero.
   Reserve it so the paragraph and the fine print wrap before they reach it
   rather than running across the letters. */
@media(max-width:599px){
  .hero{--mark-col:76px}
  .hero-description,.hero-copy .fine-print{max-width:calc(100% - var(--mark-col));text-wrap:pretty}
  /* With the character in the corner the fine print has to give up a little more
     room than the mark alone needs: his head reaches further in than the letters do. */
  html.has-char .hero-copy .fine-print{max-width:calc(100% - 120px)}
}

/* ---- Footer tap targets -------------------------------------------------
   The footer links were 14px (the legal row), 20px (the email) and 30 to 34px
   (the nav). All under the 44px floor, and the three legal links sat in one
   row 17px apart, which is a miss-tap. Grown to 44px of hit area; the legal row
   pulls its own margin back in so the footer keeps the height it had. */
@media(max-width:959px){
  .footer-top nav a{min-height:44px;display:flex;align-items:center}
  /* inline-flex drops the whitespace text node before the arrow, so the space
     has to come back as a gap */
  .footer-contact>a{min-height:44px;display:inline-flex;align-items:center;gap:5px}
  .footer-bottom a{min-height:44px;display:inline-flex;align-items:center;margin-block:-13px}
}

/* ---- Sign in on a phone -------------------------------------------------
   The header's Sign in is hidden below 960px and the menu only ever carried
   Start free, so on a phone there was no way into an existing account at all:
   a returning customer had to press Start free and find the sign in link at
   the foot of the sign up page. The two account actions now sit together
   below a rule, with Sign in first, because the person hunting for it is
   scanning downward and should meet it before the button that is not for
   them. Start free keeps the emphasis: it is still the primary action for
   everybody arriving for the first time. */
@media(max-width:959px){
  .mobile-nav .nav-rule{height:1px;background:#1114;margin:9px 15px 5px}
  .mobile-nav a.nav-start{
    background:var(--accent);color:var(--on-accent);
    display:flex;align-items:center;justify-content:space-between;gap:12px;
  }
  .mobile-nav a.nav-signin{font-weight:600}
}
