:root{--paper:#fbf6e9;--paper-2:#f4ecd6;--ink:#2b2a26;--ink-soft:#5a564c;--red:#e24a3a;--yellow:#f3c03a;--blue:#4a7bd6;--green:#6bb26b;--pink:#f28aaa;--lilac:#b49ad6;--btn-radius:18px 10px 22px 8px / 12px 22px 8px 18px;--wob-radius:14px 10px 16px 8px / 10px 16px 8px 14px}*{box-sizing:border-box}html,body{margin:0;padding:0}html{min-height:100%}body{min-height:100vh;color:var(--ink);background:radial-gradient(at 0 0,#f0e6c8 0%,#0000 60%),radial-gradient(at 100% 100%,#efe1b8 0%,#0000 55%),#f4ecd6;font-family:Kalam,cursive}body:before{content:"";pointer-events:none;opacity:.55;mix-blend-mode:multiply;z-index:1;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0.1  0 0 0 0 0.08  0 0 0 0 0.06  0 0 0 0.08 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");position:fixed;inset:0}#root{z-index:2;flex-direction:column;min-height:100vh;display:flex;position:relative}.hand{font-family:Caveat,cursive;font-weight:600}.print{font-family:Patrick Hand,cursive}.mono{font-family:Courier New,monospace}.wob{background:var(--paper);border-radius:var(--wob-radius);position:relative}.wob:before{content:"";border:2.5px solid var(--ink);border-radius:var(--wob-radius);pointer-events:none;position:absolute;inset:-2px}.wob-2,.wob-2:before{border-radius:8px 14px 6px 16px/14px 6px 16px 8px}.wob-3,.wob-3:before{border-radius:16px 6px 14px 10px/6px 14px 10px 16px}.btn{background:var(--paper);color:var(--ink);border-radius:var(--btn-radius);cursor:pointer;border:none;padding:10px 18px;font-family:Kalam,cursive;font-size:15px;font-weight:700;transition:transform 80ms;position:relative}.btn:before{content:"";border:2.5px solid var(--ink);border-radius:var(--btn-radius);pointer-events:none;position:absolute;inset:0}.btn:hover{transform:translate(-1px,-1px)rotate(-.5deg)}.btn:active{transform:translate(1px,1px)}.btn:disabled{opacity:.55;cursor:not-allowed;transform:none}.btn.primary{background:var(--red);color:#fff9ea}.btn.yellow{background:var(--yellow);color:#2b2a26}.btn.blue{background:var(--blue);color:#fff9ea}.btn.green{background:var(--green);color:#fff9ea}.btn.ghost{background:0 0}.btn.ghost:before{border:none}.btn.small{padding:6px 12px;font-size:13px}.btn.block{text-align:center;width:100%;padding:14px;font-size:17px;display:block}.chip{background:var(--paper);color:var(--ink);border:2px solid var(--ink);cursor:pointer;-webkit-user-select:none;user-select:none;border-radius:14px 8px 16px 6px/8px 16px 6px 14px;align-items:center;gap:6px;padding:4px 12px;font-family:Kalam,cursive;font-size:14px;font-weight:700;display:inline-flex}.chip.on{background:var(--yellow)}.chip.on.red{background:var(--red);color:#fff9ea}.chip.on.blue{background:var(--blue);color:#fff9ea}.chip.on.green{background:var(--green);color:#fff9ea}.chip.on.pink{background:var(--pink)}.chip.on.lilac{background:var(--lilac);color:#fff9ea}.squiggle{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='60' height='8' viewBox='0 0 60 8'><path d='M1 4 Q 8 0 15 4 T 30 4 T 45 4 T 60 4' stroke='%23e24a3a' stroke-width='2.5' fill='none' stroke-linecap='round'/></svg>");background-position:0 100%;background-repeat:repeat-x;padding-bottom:6px}.app-shell{flex-direction:column;width:100%;max-width:520px;min-height:100vh;margin:0 auto;display:flex;position:relative}@media (width>=640px){.app-shell{border-left:1px dashed #2b2a262e;border-right:1px dashed #2b2a262e;min-height:100vh;box-shadow:0 10px 50px -15px #0000002e}}.screen{flex:1;padding:24px 20px 40px;animation:.35s both slideIn;position:relative}@keyframes slideIn{0%{opacity:0;transform:translate(14px)}to{opacity:1;transform:none}}@media (width>=640px){.screen{padding:40px 32px 56px}}.field{margin-bottom:18px}.field label{color:var(--ink);margin-bottom:4px;font-family:Caveat,cursive;font-size:22px;display:block}.input,.textarea,.select{background:var(--paper);width:100%;color:var(--ink);border:none;border-radius:14px 8px 16px 10px/8px 16px 10px 14px;outline:none;padding:10px 12px;font-family:Kalam,cursive;font-size:16px;display:block;position:relative}.input-wrap{border-radius:14px 8px 16px 10px/8px 16px 10px 14px;position:relative}.input-wrap:before{content:"";border:2.5px solid var(--ink);pointer-events:none;border-radius:14px 8px 16px 10px/8px 16px 10px 14px;position:absolute;inset:0}.input-wrap.err:before{border-color:var(--red)}.input-wrap.err:after{content:"";background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='60' height='6' viewBox='0 0 60 6'><path d='M1 3 Q 8 0 16 3 T 31 3 T 46 3 T 60 3' stroke='%23e24a3a' stroke-width='2' fill='none' stroke-linecap='round'/></svg>") repeat-x;height:6px;position:absolute;bottom:-8px;left:4px;right:4px}.textarea{resize:none;min-height:80px}.err-msg{color:var(--red);margin-top:6px;font-family:Caveat,cursive;font-size:18px}.steps{justify-content:center;align-items:center;gap:10px;margin-bottom:14px;display:flex}.step-dot{background:var(--paper);border:2px solid var(--ink);border-radius:50%;width:10px;height:10px}.step-dot.on{background:var(--ink)}.step-dot.done{background:var(--green)}@keyframes pop{0%{opacity:0;transform:scale(.3)rotate(0)}60%{opacity:1}to{opacity:1;transform:scale(1)rotate(12deg)}}.pop{animation:.6s ease-out both pop}.hero{background:var(--paper-2);border-radius:20px 14px 22px 10px/14px 22px 10px 20px;justify-content:center;align-items:center;width:100%;height:180px;margin-bottom:18px;font-size:90px;display:flex;position:relative}.hero:before{content:"";border:2.5px solid var(--ink);pointer-events:none;border-radius:20px 14px 22px 10px/14px 22px 10px 20px;position:absolute;inset:0}.tape{background:#f7de78bf;border-left:1px dashed #0000000f;border-right:1px dashed #0000000f;width:54px;height:18px;position:absolute;top:-8px;left:20px;transform:rotate(-8deg);box-shadow:0 1px #0000000d}.tape.blue{background:#b0d1f3cc}.tape.pink{background:#ffc0d2cc}.tape.r{left:auto;right:22px;transform:rotate(6deg)}.ava{width:34px;height:34px;color:var(--ink);border:2px solid var(--ink);border-radius:50%;justify-content:center;align-items:center;font-family:Caveat,cursive;font-size:20px;font-weight:700;display:flex}.stars{cursor:pointer;gap:2px;display:inline-flex}.star{color:var(--ink-soft);font-size:24px;transition:transform .1s}.star.on{color:var(--yellow)}.star:hover{transform:scale(1.2)rotate(-5deg)}.rot-l{transform:rotate(-1.2deg)}.rot-r{transform:rotate(1.2deg)}.scribble{opacity:.5;background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='300' height='14' viewBox='0 0 300 14'><path d='M2 7 Q 20 1 40 7 T 80 7 T 120 7 T 160 7 T 200 7 T 240 7 T 280 7 T 300 7' stroke='%232b2a26' stroke-width='2' fill='none' stroke-linecap='round'/></svg>") 50% repeat-x;height:14px;margin:16px 0}.heart-btn{cursor:pointer;color:var(--ink-soft);background:0 0;border:none;font-size:22px;transition:transform .15s}.heart-btn.on{color:var(--red)}.heart-btn:hover{transform:scale(1.25)rotate(-10deg)}.heart-pop{animation:.4s ease-out pop}.h1{margin:0;font-family:Caveat,cursive;font-size:40px;font-weight:700;line-height:1}.h2{margin:0;font-family:Caveat,cursive;font-size:28px;font-weight:700}.muted{color:var(--ink-soft)}.arrow{vertical-align:middle;width:40px;height:24px;display:inline-block}