@import"https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Instrument+Serif:ital@0;1&family=Manrope:wght@400;500;600;700&display=swap";:root{color:#181815;background:#f3f0e7;font-family:Manrope,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility;--ink: #181815;--paper: #f3f0e7;--acid: #d8ff35;--pink: #ff6c9f;--blue: #3764ff;--line: rgba(24, 24, 21, .22)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{min-width:320px;min-height:100vh;margin:0;overflow-x:hidden}button,textarea,input{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{color:inherit}.noise{position:fixed;z-index:10;inset:0;pointer-events:none;opacity:.16;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.16'/%3E%3C/svg%3E");mix-blend-mode:multiply}.site-header{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;width:min(1180px,calc(100% - 48px));margin:0 auto;padding:24px 0;border-bottom:1px solid var(--line)}.brand{display:flex;gap:10px;align-items:center;color:var(--ink);font-family:DM Mono,monospace;font-size:12px;letter-spacing:.1em;text-decoration:none}.brand strong{padding:2px 4px;background:var(--acid);font-weight:500}.brand-mark{display:grid;width:26px;height:26px;place-items:center;border:1px solid var(--ink);border-radius:50%}.header-link,.make-own-link{color:var(--ink);font-size:13px;font-weight:600;text-underline-offset:4px}main{position:relative}.creator-hero{width:min(940px,calc(100% - 48px));margin:0 auto;padding:100px 0 110px;text-align:center}.eyebrow{display:inline-flex;align-items:center;gap:10px;font-family:DM Mono,monospace;font-size:11px;letter-spacing:.12em}.eyebrow span{width:7px;height:7px;background:var(--pink);border-radius:50%;box-shadow:0 0 0 4px #ff6c9f2e}h1{margin:34px 0 24px;font-family:"Instrument Serif",Georgia,serif;font-size:clamp(58px,8.5vw,104px);font-weight:400;letter-spacing:-.045em;line-height:.87}h1 em{color:var(--blue);font-weight:400}.hero-copy{max-width:610px;margin:0 auto 44px;color:#4d4c47;font-size:16px;line-height:1.7}.prompt-card{position:relative;max-width:760px;margin:0 auto;padding:18px;border:1px solid var(--ink);background:#fffdf7;box-shadow:9px 9px 0 var(--ink);text-align:left}.prompt-card:before{position:absolute;top:-24px;right:38px;width:78px;height:34px;background:#d8ff35c7;content:"";rotate:3deg}.prompt-card label{display:block;margin:2px 0 12px;font-family:DM Mono,monospace;font-size:11px;letter-spacing:.08em;text-transform:uppercase}.textarea-wrap{position:relative}textarea{width:100%;min-height:130px;resize:vertical;border:1px solid var(--line);border-radius:0;outline:none;background:#f8f6ef;padding:18px 18px 35px;color:var(--ink);font-size:17px;line-height:1.55;transition:border-color .18s ease,box-shadow .18s ease}textarea:focus{border-color:var(--blue);box-shadow:0 0 0 3px #3764ff21}textarea::placeholder{color:#99978e}.character-count{position:absolute;right:14px;bottom:12px;color:#79776f;font-family:DM Mono,monospace;font-size:10px}.primary-button{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:58px;border:1px solid var(--ink);background:var(--acid);padding:0 22px;font-size:14px;font-weight:700;cursor:pointer;box-shadow:4px 4px 0 var(--ink);transition:translate .14s ease,box-shadow .14s ease}.prompt-card .primary-button{width:100%;margin-top:14px}.primary-button:hover{translate:2px 2px;box-shadow:2px 2px 0 var(--ink)}.primary-button:active{translate:4px 4px;box-shadow:0 0 0 var(--ink)}.primary-button svg,.fake-send svg{width:20px;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8}.result-card{max-width:760px;margin:28px auto 0;border:1px solid var(--ink);background:#fffdf7;padding:24px;text-align:left}.result-card[hidden]{display:none}.result-heading{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:20px}.result-kicker{color:var(--blue);font-family:DM Mono,monospace;font-size:10px;letter-spacing:.1em}.result-heading h2{margin:4px 0 0;font-family:"Instrument Serif",Georgia,serif;font-size:31px;font-weight:400}.success-seal{display:grid;flex:0 0 auto;width:44px;height:44px;place-items:center;background:var(--acid);border:1px solid var(--ink);border-radius:50%}.success-seal svg,.copy-button svg,.completion-icon svg{width:21px;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:2}.link-field{display:flex;border:1px solid var(--ink)}.link-field input{min-width:0;flex:1;border:0;outline:none;background:#f3f0e7;padding:14px;font-family:DM Mono,monospace;font-size:11px}.copy-button{display:flex;align-items:center;gap:8px;min-width:102px;justify-content:center;border:0;border-left:1px solid var(--ink);background:var(--ink);color:#fff;cursor:pointer}.result-actions{display:flex;gap:18px;margin-top:16px}.text-button{border:0;background:transparent;padding:0;color:var(--ink);font-size:12px;font-weight:600;text-decoration:underline;text-underline-offset:4px;cursor:pointer}.privacy-note{margin:19px 0 0;color:#6d6a62;font-size:11px}.how-it-works{border-top:1px solid var(--ink);border-bottom:1px solid var(--ink);background:#20201e;color:#f3f0e7;padding:80px max(24px,calc((100vw - 1180px)/2))}.section-heading{display:grid;grid-template-columns:1fr 2fr;gap:30px;margin-bottom:60px}.section-number{font-family:DM Mono,monospace;font-size:11px;letter-spacing:.1em}.section-heading h2{margin:0;font-family:"Instrument Serif",Georgia,serif;font-size:clamp(44px,5.5vw,74px);font-weight:400;letter-spacing:-.03em;line-height:.96}.steps{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid rgba(255,255,255,.3)}.steps article{position:relative;min-height:310px;padding:24px 28px 0 0}.steps article+article{border-left:1px solid rgba(255,255,255,.3);padding-left:28px}.steps article>span{font-family:DM Mono,monospace;font-size:10px}.step-icon{display:grid;width:72px;height:72px;place-items:center;margin:54px 0 28px;background:var(--pink);color:var(--ink);font-family:"Instrument Serif",Georgia,serif;font-size:28px;rotate:-3deg}.steps article:nth-child(2) .step-icon{background:var(--acid);rotate:3deg}.steps article:nth-child(3) .step-icon{background:var(--blue);color:#fff;rotate:-2deg}.step-icon svg{width:34px;fill:currentColor}.steps h3{margin:0 0 12px;font-size:15px}.steps p{max-width:290px;margin:0;color:#bdbbb3;font-size:13px;line-height:1.65}.site-footer{display:flex;justify-content:space-between;width:min(1180px,calc(100% - 48px));margin:0 auto;padding:26px 0 34px;color:#727068;font-family:DM Mono,monospace;font-size:9px;letter-spacing:.06em;text-transform:uppercase}.tutorial{width:min(1000px,calc(100% - 48px));margin:0 auto;padding:70px 0 100px;text-align:center}.tutorial-intro h1{margin:28px 0 18px;font-size:clamp(56px,8vw,90px)}.tutorial-intro>p{color:#68665f;font-size:14px}.lesson-shell{margin:50px auto 30px;border:1px solid var(--ink);background:#fffdf7;box-shadow:10px 10px 0 var(--ink);text-align:left}.lesson-topbar{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;height:46px;border-bottom:1px solid var(--ink);padding:0 16px;font-family:DM Mono,monospace;font-size:9px;letter-spacing:.08em}.window-dots{display:flex;gap:6px}.window-dots i{width:8px;height:8px;border:1px solid var(--ink);border-radius:50%;background:var(--pink)}.window-dots i:nth-child(2){background:#ffd15c}.window-dots i:nth-child(3){background:var(--acid)}.lesson-status{justify-self:end;color:var(--blue)}.lesson-stage{position:relative;min-height:490px;overflow:hidden;padding:35px 12% 70px;background:linear-gradient(rgba(24,24,21,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(24,24,21,.035) 1px,transparent 1px);background-size:28px 28px;text-align:center}.stage-step{margin-bottom:45px;font-family:DM Mono,monospace;font-size:10px;letter-spacing:.12em}.fake-logo{display:grid;width:48px;height:48px;margin:0 auto 18px;place-items:center;border:1px solid var(--ink);border-radius:50%;background:var(--acid)}.fake-logo svg{width:26px;fill:currentColor}.lesson-stage h2{margin:0 0 28px;font-family:"Instrument Serif",Georgia,serif;font-size:39px;font-weight:400}.fake-composer{position:relative;display:flex;align-items:center;width:min(640px,100%);min-height:86px;margin:0 auto;border:1px solid var(--ink);background:#fff;padding:18px 72px 18px 28px;box-shadow:5px 5px #1818152e;font-size:15px;line-height:1.55;text-align:left;transition:box-shadow .18s ease}.fake-composer.is-focused{box-shadow:0 0 0 3px #3764ff38,5px 5px #1818152e}.typing-caret{display:inline-block;width:1px;height:18px;margin-left:1px;background:var(--blue);animation:blink .7s steps(1) infinite}.fake-send{position:absolute;top:50%;right:13px;bottom:auto;display:grid;width:39px;height:39px;place-items:center;border:1px solid var(--ink);border-radius:50%;background:#d8d6ce;color:#77756f;translate:0 -50%;transition:background .18s ease,color .18s ease,transform .12s ease}.fake-send.is-active{background:var(--ink);color:#fff}.fake-send.is-clicked{transform:scale(.86)}.cursor{position:absolute;top:345px;left:13%;z-index:3;width:28px;filter:drop-shadow(2px 2px 0 white)}.cursor svg{fill:var(--ink);stroke:#fff;stroke-width:1}.move-to-box{top:295px;left:34%;transition:top .75s cubic-bezier(.2,.7,.2,1),left .75s cubic-bezier(.2,.7,.2,1)}.cursor-click{top:300px;left:34%;transform:scale(.78)}.move-to-send{top:330px;left:calc(82% - 63px);transition:top .75s cubic-bezier(.2,.7,.2,1),left .75s cubic-bezier(.2,.7,.2,1)}.cursor-click-send{top:330px;left:calc(82% - 63px);transform:scale(.78)}.completion{max-width:570px;margin:0 auto;animation:reveal .35s ease both}.completion[hidden]{display:none}.completion-icon{display:grid;width:64px;height:64px;margin:0 auto 19px;place-items:center;border:1px solid var(--ink);border-radius:50%;background:var(--acid);box-shadow:4px 4px 0 var(--ink)}.completion h3{margin:0 0 10px;font-family:"Instrument Serif",Georgia,serif;font-size:42px;font-weight:400}.completion>p{max-width:470px;margin:0 auto 23px;color:#65635c;font-size:13px;line-height:1.6}.completion .primary-button{min-width:290px}.completion .paste-tip{margin-top:18px;font-size:11px}kbd{border:1px solid var(--line);border-bottom-color:var(--ink);background:#fff;padding:2px 5px;color:var(--ink);font-family:DM Mono,monospace;font-size:9px}.lesson-footer{display:flex;align-items:center;gap:20px;min-height:54px;border-top:1px solid var(--ink);padding:0 18px}.progress-track{flex:1;height:5px;overflow:hidden;background:#dfddd5}.progress-track span{display:block;width:0;height:100%;background:var(--blue);transition:width .24s linear}.make-own-link{display:inline-block;margin-top:16px}@keyframes blink{50%{opacity:0}}@keyframes reveal{0%{opacity:0;transform:translateY(8px)}}@media(max-width:720px){.site-header,.site-footer,.creator-hero,.tutorial{width:min(100% - 28px,1180px)}.site-header{padding:18px 0}.header-link{display:none}.creator-hero{padding:70px 0 80px}h1{font-size:clamp(48px,15vw,70px);line-height:.92}.prompt-card{padding:13px;box-shadow:6px 6px 0 var(--ink)}.result-heading h2{font-size:26px}.section-heading,.steps{grid-template-columns:1fr}.steps article{min-height:260px}.steps article+article{border-top:1px solid rgba(255,255,255,.3);border-left:0;padding-left:0}.step-icon{margin:40px 0 24px}.site-footer{flex-direction:column;gap:4px}.tutorial{padding-top:48px}.lesson-topbar{grid-template-columns:1fr 1fr}.lesson-topbar>span:nth-child(2){display:none}.lesson-stage{min-height:480px;padding:28px 18px 60px}.stage-step{margin-bottom:36px}.lesson-stage h2{font-size:34px}.fake-composer{min-height:104px}.cursor{left:5%}.move-to-box,.cursor-click{left:23%}.move-to-send,.cursor-click-send{left:calc(100% - 66px)}.completion h3{font-size:35px}.completion .primary-button{width:calc(100% - 14px);min-width:0}.lesson-footer{gap:12px}.lesson-footer .text-button{white-space:nowrap;font-size:10px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}