:root{--ink:#171814;--paper:#f6f0e3;--yellow:#ffd536;--blue:#2257e6;--tomato:#f04b35;--lime:#bde95b;--muted:#62645d;--white:#fffdf7}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;line-height:1.55}.shell{width:min(920px,calc(100% - 34px));margin:auto}button,input,textarea,select{font:inherit}button{color:inherit}header{border-bottom:2px solid var(--ink);background:rgba(246,240,227,.94)}.nav{display:flex;align-items:center;justify-content:center;gap:30px;padding:18px 0}.brand{display:flex;align-items:center;gap:10px;color:var(--ink);font-size:19px;font-weight:950;letter-spacing:-.03em;text-decoration:none}.mark{display:grid;width:38px;height:35px;place-items:center;border:2px solid var(--ink);border-radius:52% 48% 43% 57%;background:var(--yellow);box-shadow:3px 3px 0 var(--ink);transform:rotate(-6deg)}.navlinks{display:flex;align-items:center;gap:18px}.navlinks a{color:var(--ink);font-size:14px;font-weight:850;text-decoration:none}.navlinks .pill{padding:8px 13px;border:2px solid var(--ink);border-radius:999px;background:#fff}
.hero{display:flex;flex-direction:column;align-items:center;padding:70px 0 44px;text-align:center}.eyebrow,.section-kicker{font-size:12px;font-weight:950;letter-spacing:.14em;text-transform:uppercase}.eyebrow{display:inline-block;padding:7px 12px;border:2px solid var(--ink);background:var(--lime);transform:rotate(-1deg)}.hero h1{margin:25px auto 21px;font-size:clamp(58px,10vw,98px);line-height:.88;letter-spacing:-.075em}.hero h1 em{position:relative;color:var(--blue);font-family:Georgia,"Times New Roman",serif;font-weight:400}.hero h1 em::after{content:"";position:absolute;right:0;bottom:-5px;left:3%;z-index:-1;height:11px;border-radius:50%;background:var(--yellow);transform:rotate(-1deg)}.dek{max-width:680px;margin:0 auto;color:var(--muted);font-size:clamp(18px,2.3vw,22px)}.maker-note{display:flex;align-items:center;gap:16px;max-width:680px;margin:30px auto 0;padding:18px 22px;border:2px dashed var(--ink);background:#fff;text-align:left;transform:rotate(.35deg)}.scribble{display:grid;flex:0 0 62px;width:62px;height:58px;place-items:center;border:2px solid var(--ink);border-radius:47% 53% 56% 44%;background:var(--tomato);color:#fff;font-family:"Comic Sans MS","Bradley Hand",cursive;font-size:18px;font-weight:900;transform:rotate(-8deg)}.maker-note strong{display:block;font-size:17px}.maker-note p{margin:3px 0 0;color:var(--muted);font-size:14px}.trust-strip{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 22px;padding:14px 18px;border:2px solid var(--ink);background:var(--yellow);font-size:13px;font-weight:900;text-align:center}
.studio{margin-top:30px;margin-bottom:85px;border:2px solid var(--ink);background:var(--white);box-shadow:10px 10px 0 var(--ink)}.studio-head{padding:35px 22px 25px;text-align:center}.tape{display:inline-block;padding:5px 11px;background:var(--blue);color:#fff;font-size:11px;font-weight:950;letter-spacing:.16em;transform:rotate(-1.5deg)}.studio-head h2{margin:14px 0 0;font-size:clamp(38px,7vw,62px);line-height:1;letter-spacing:-.06em}.studio-head p{margin:5px 0 0;color:var(--muted)}.editor{padding:0 34px 30px}.field{display:block;text-align:left}.field>span,.choice-block legend,.settings-row label{display:block;margin-bottom:8px;font-size:13px;font-weight:950;letter-spacing:.07em;text-transform:uppercase}.field i{color:var(--muted);font-size:11px;font-style:normal;font-weight:700;letter-spacing:0;text-transform:none}.field textarea,.field input,.settings-row select{width:100%;border:2px solid var(--ink);border-radius:0;background:#fff;color:var(--ink)}.field textarea{min-height:145px;padding:18px;resize:vertical;font-family:Georgia,serif;font-size:25px;line-height:1.35}.field input{height:48px;padding:0 13px}.field small{display:block;margin-top:5px;color:var(--muted);font-size:12px;text-align:right}.mini-fields{display:grid;grid-template-columns:1fr 1fr;gap:15px;margin-top:16px}.choice-block{margin:28px 0 0;padding:0;border:0;text-align:center}.choice-block legend{width:100%;text-align:center}.choice-block legend small{display:inline-block;margin-left:6px;padding:2px 7px;border:1.5px solid var(--ink);border-radius:999px;background:var(--yellow);font-size:10px;letter-spacing:.03em;vertical-align:1px}.themes{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.theme,.type-mood{display:flex;align-items:center;justify-content:center;gap:9px;min-height:54px;border:2px solid #c9c6bd;background:#fff;cursor:pointer;font-size:13px;font-weight:850;transition:.14s}.theme:hover,.type-mood:hover{border-color:var(--ink)}.theme.active,.type-mood.active{border-color:var(--ink);box-shadow:4px 4px 0 var(--ink);transform:translate(-2px,-2px)}.swatch{width:27px;height:27px;border:1.5px solid var(--ink);border-radius:50%}.swatch.paper{background:linear-gradient(135deg,#f7edda 50%,#e54b38 50%)}.swatch.subway{background:linear-gradient(135deg,#1647c9 50%,#ffd730 50%)}.swatch.tomato{background:linear-gradient(135deg,#f25a42 50%,#ffd5ca 50%)}.swatch.midnight{background:linear-gradient(135deg,#121416 50%,#70f2ce 50%)}.swatch.bodega{background:linear-gradient(135deg,#145f45 50%,#f4edc6 50%)}.swatch.taxi{background:linear-gradient(135deg,#ffd000 50%,#171814 50%)}.swatch.gallery{background:linear-gradient(135deg,#f7f5ee 50%,#2449f2 50%)}.swatch.cherry{background:linear-gradient(135deg,#f6b1c0 50%,#bd1743 50%)}.swatch.concrete{background:linear-gradient(135deg,#c6c4bc 50%,#ff6a2d 50%)}.type-moods{display:grid;grid-template-columns:repeat(5,1fr);gap:9px}.type-mood{min-height:80px;flex-direction:column;gap:0}.type-mood b{font-size:26px;line-height:1.1}.type-mood span{color:var(--muted);font-size:11px}.serif{font-family:Georgia,serif}.clean{font-family:Arial,sans-serif;font-weight:900}.soft{font-family:"Trebuchet MS",sans-serif}.mono{font-family:"Courier New",monospace}.poster{font-family:Impact,Haettenschweiler,sans-serif;letter-spacing:.02em}.bookish{font-family:Palatino,"Palatino Linotype",serif;font-style:italic}.scribble-type{font-family:"Comic Sans MS","Bradley Hand",cursive;transform:rotate(-4deg)}.narrow{font-family:"Arial Narrow",Impact,sans-serif;letter-spacing:-.06em}.fashion{font-family:Didot,"Bodoni 72","Times New Roman",serif;font-weight:400}.deadpan{font-family:Verdana,Geneva,sans-serif;font-size:22px!important;font-weight:400}.settings-row{display:grid;grid-template-columns:1.25fr 1fr 1fr;gap:13px;margin-top:28px}.settings-row label{text-align:left}.settings-row select{height:48px;padding:0 11px;text-transform:none;letter-spacing:0}.settings-row input[type=range]{width:100%;accent-color:var(--blue)}.toggle-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:11px;margin-top:23px}.check{display:flex;align-items:center;gap:8px;padding:9px 12px;border:1.5px solid var(--ink);background:#fff;font-size:13px;font-weight:800;cursor:pointer}.check input{width:17px;height:17px;accent-color:var(--blue)}.surprise{padding:10px 14px;border:2px solid var(--ink);background:var(--yellow);font-size:13px;font-weight:950;cursor:pointer;transform:rotate(-1deg)}
.preview-wrap{padding:34px;border-top:2px dashed var(--ink);background:#e8e2d8;text-align:center}.preview-label{display:flex;justify-content:space-between;max-width:680px;margin:0 auto 10px;color:#50534d;font-size:11px;font-weight:950;letter-spacing:.13em}.canvas-frame{display:flex;align-items:center;justify-content:center;max-width:680px;min-height:360px;margin:auto;padding:18px;border:2px solid var(--ink);background:#cbc5ba;box-shadow:7px 7px 0 var(--ink)}canvas{display:block;max-width:100%;max-height:690px;width:auto;height:auto;background:#fff;box-shadow:0 8px 25px rgba(0,0,0,.18)}.fit-note{margin:17px 0 10px;color:var(--muted);font-size:13px;font-weight:800}.download{display:inline-flex;align-items:center;justify-content:center;gap:14px;min-width:260px;padding:15px 23px;border:2px solid var(--ink);background:var(--blue);color:#fff;box-shadow:5px 5px 0 var(--ink);font-size:16px;font-weight:950;cursor:pointer}.download:hover{transform:translate(-2px,-2px);box-shadow:7px 7px 0 var(--ink)}.download span{font-size:21px}.privacy{max-width:650px;margin:20px auto 0;color:#4e514b;font-size:13px}.privacy strong{display:block;color:var(--ink);font-size:14px}
.how,.guide,.maker-bottom{padding:74px 0;text-align:center}.how h2,.guide h2,.maker-bottom h2,.faq h2{max-width:760px;margin:10px auto 32px;font-size:clamp(40px,6vw,62px);line-height:.98;letter-spacing:-.055em}.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.steps article,.guide-grid article{padding:24px 18px;border:2px solid var(--ink);background:#fff;box-shadow:5px 5px 0 var(--ink);text-align:center}.steps article:nth-child(2){background:#e4ebff;transform:rotate(.45deg)}.steps article:nth-child(3){background:#edf7d1}.steps b{display:grid;width:43px;height:40px;margin:0 auto 13px;place-items:center;border:2px solid var(--ink);border-radius:50%;background:var(--yellow)}.steps h3,.guide-grid h3{margin:0 0 6px;font-size:21px}.steps p,.guide-grid p{margin:0;color:var(--muted);font-size:14px}.guide{border-top:2px solid var(--ink)}.guide-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.guide-grid article:nth-child(2){background:#e5ebff}.guide-grid article:nth-child(3){background:#fee0d8}.guide-grid article:nth-child(4){background:#edf7d1}.guide-grid span{display:inline-block;margin-bottom:12px;padding:4px 9px;border:1.5px solid var(--ink);background:var(--yellow);font-family:"Courier New",monospace;font-size:13px;font-weight:900}.faq{padding:75px 0;background:var(--ink);color:#fff;text-align:center}.faq .section-kicker{color:var(--yellow)}.faq-grid{display:grid;grid-template-columns:1fr 1fr;gap:11px;text-align:left}.faq details{border:1.5px solid #6d6f68;background:#272923}.faq summary{padding:17px 18px;cursor:pointer;font-weight:900;list-style:none}.faq summary::-webkit-details-marker{display:none}.faq summary::after{content:"+";float:right;color:var(--yellow);font-size:20px}.faq details[open] summary::after{content:"−"}.faq details p{margin:0;padding:0 18px 18px;color:#d5d6cf;font-size:14px}.maker-bottom{max-width:700px}.stamp{display:inline-block;padding:6px 10px;border:2px solid var(--ink);background:var(--tomato);color:#fff;font-size:11px;font-weight:950;letter-spacing:.13em;transform:rotate(-2deg)}.maker-bottom h2{margin-bottom:18px}.maker-bottom p{max-width:610px;margin:0 auto 18px;color:var(--muted);font-size:17px}.maker-bottom a{display:inline-block;color:var(--ink);font-weight:950}footer{padding:31px 0;border-top:2px solid var(--ink);color:var(--muted);font-size:13px;text-align:center}footer a{color:inherit}footer span{font-size:12px}
:focus-visible{outline:4px solid rgba(34,87,230,.35);outline-offset:3px}@media(max-width:760px){.themes{grid-template-columns:repeat(2,1fr)}.themes .theme:last-child:nth-child(odd){grid-column:1/-1;width:calc(50% - 4.5px);justify-self:center}.type-moods{grid-template-columns:repeat(3,1fr)}.settings-row{grid-template-columns:1fr}.steps{grid-template-columns:1fr}.steps article{max-width:560px;width:100%;margin:auto}.faq-grid{grid-template-columns:1fr}.canvas-frame{min-height:260px}.preview-wrap,.editor{padding-right:20px;padding-left:20px}}@media(max-width:540px){.shell{width:min(100% - 24px,920px)}.nav{gap:14px}.navlinks{gap:10px}.navlinks a:first-child,.navlinks a:nth-child(2){display:none}.hero{padding-top:52px}.hero h1{font-size:56px}.maker-note{align-items:flex-start;padding:16px;text-align:left}.scribble{flex-basis:48px;width:48px;height:46px;font-size:14px}.trust-strip{display:grid;grid-template-columns:1fr 1fr;gap:7px}.studio{box-shadow:6px 6px 0 var(--ink)}.editor{padding-right:14px;padding-left:14px}.field textarea{font-size:21px}.mini-fields{grid-template-columns:1fr}.themes{grid-template-columns:1fr 1fr}.theme{justify-content:flex-start;padding-left:12px}.type-moods{grid-template-columns:repeat(2,1fr)}.preview-wrap{padding:24px 12px 27px}.canvas-frame{min-height:220px;padding:10px;box-shadow:4px 4px 0 var(--ink)}.download{width:100%;min-width:0}.guide-grid{grid-template-columns:1fr}.how,.guide,.maker-bottom{padding:58px 0}}@media(max-width:380px){.theme b{font-size:12px}.preview-label{letter-spacing:.07em}.hero h1{font-size:49px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
