:root{--paper: #fffdf7;--ink: #34302a;--sun: #ffcf4a;--sky: #5bb9d6;--coral: #ff7a6b;--leaf: #7bc47f;--shadow: 0 18px 40px -18px rgba(60, 48, 30, .45)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body{height:100%}[x-cloak]{display:none}a{color:inherit;text-decoration:none}body{font-family:Fredoka,sans-serif;color:var(--ink);background:radial-gradient(1200px 600px at 10% -5%,#fff2cf 0%,transparent 55%),radial-gradient(1000px 700px at 110% 10%,#d7eef6 0%,transparent 50%),#fbf3e2;min-height:100vh;padding:32px 18px 64px}.wrap{max-width:1080px;margin:0 auto}header.hero{text-align:center;margin-bottom:26px}.badge{display:inline-flex;align-items:center;gap:8px;background:#fff;border:2px solid var(--ink);padding:6px 14px;border-radius:999px;font-weight:600;font-size:.9rem;box-shadow:3px 3px 0 var(--ink);transform:rotate(-1.5deg)}h1{font-family:"Baloo 2",cursive;font-size:clamp(2.2rem,6vw,3.6rem);line-height:1.05;margin:14px 0 6px;letter-spacing:-1px}h1 .pop{color:var(--coral)}h1 .pop2{color:var(--sky)}.sub{font-size:1.02rem;color:#766c5c;max-width:580px;margin:0 auto}.panel{display:grid;grid-template-columns:340px 1fr;gap:22px;margin-top:30px;align-items:start}@media(max-width:820px){.panel{grid-template-columns:1fr}}.controls{background:#fff;border:2.5px solid var(--ink);border-radius:22px;padding:22px;box-shadow:var(--shadow);position:sticky;top:18px}@media(max-width:820px){.controls{position:static}}.field{margin-bottom:18px}.field label{display:block;font-weight:600;margin-bottom:7px;font-size:.95rem}.field .hint{font-size:.78rem;color:#9a8f7c;font-weight:400;margin-top:5px}input[type=text]{width:100%;font-family:"Baloo 2",cursive;font-size:1.4rem;padding:12px 14px;border:2.5px solid var(--ink);border-radius:14px;background:var(--paper);color:var(--ink);outline:none;transition:.15s}input[type=text]:focus{box-shadow:0 0 0 4px var(--sun)}.seg{display:flex;gap:8px;flex-wrap:wrap}.seg button{flex:1;min-width:64px;font-family:Fredoka,sans-serif;font-weight:600;font-size:.92rem;padding:10px 8px;border-radius:12px;cursor:pointer;border:2.5px solid var(--ink);background:#fff;color:var(--ink);transition:.12s}.seg button.on{background:var(--sun);box-shadow:inset 2px 2px #00000014}.seg button:active{transform:translateY(1px)}.dlbtn{width:100%;font-family:"Baloo 2",cursive;font-size:1.25rem;font-weight:700;padding:14px;border-radius:16px;cursor:pointer;border:2.5px solid var(--ink);background:var(--leaf);color:var(--ink);box-shadow:4px 4px 0 var(--ink);transition:.1s;display:flex;align-items:center;justify-content:center;gap:9px}.dlbtn:hover{transform:translate(-1px,-1px);box-shadow:5px 5px 0 var(--ink)}.dlbtn:active{transform:translate(2px,2px);box-shadow:2px 2px 0 var(--ink)}.stage{background:#fff;border:2.5px solid var(--ink);border-radius:22px;padding:18px;box-shadow:var(--shadow);overflow:auto}.stage .cap{font-size:.8rem;color:#9a8f7c;text-align:center;margin-top:10px;font-weight:500}canvas{display:block;width:100%;height:auto;border-radius:12px;background:#fff}