@font-face{font-family:Fredoka;font-style:normal;font-display:swap;font-weight:500;src:url(./fredoka-latin-500-normal-B0JifZgm.woff2)format("woff2"),url(./fredoka-latin-500-normal-BL692wg7.woff)format("woff")}@font-face{font-family:Fredoka;font-style:normal;font-display:swap;font-weight:600;src:url(./fredoka-latin-600-normal-C4zohCW5.woff2)format("woff2"),url(./fredoka-latin-600-normal-CcrEjrB4.woff)format("woff")}@font-face{font-family:Fredoka;font-style:normal;font-display:swap;font-weight:700;src:url(./fredoka-latin-700-normal-BOIZVyIN.woff2)format("woff2"),url(./fredoka-latin-700-normal-C8FeHd3X.woff)format("woff")}:root{--cream:#fff1dc;--cream-2:#ffe6c4;--ink:#3b2a26;--ink-soft:#7a615a;--coral:#ff7a59;--wood:#d39a62;--wood-dark:#a86b3c;--white:#fff;--shadow:#5c341e29;--press:#5c341e38;--current:#ff5a5f;--book:#ff7a59;--radius:22px;--safe-t:env(safe-area-inset-top,0px);--safe-b:env(safe-area-inset-bottom,0px);--safe-l:env(safe-area-inset-left,0px);--safe-r:env(safe-area-inset-right,0px);--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}[hidden]{display:none!important}html,body{overscroll-behavior:none;background:var(--cream);height:100%;color:var(--ink);-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-text-size-adjust:100%;margin:0;font-family:Fredoka,ui-rounded,SF Pro Rounded,system-ui,sans-serif;font-weight:500;overflow:hidden}body{background:radial-gradient(circle at 20% 10%, #ffffffb3 0 2px, transparent 3px) 0 0 / 38px 38px, radial-gradient(circle at 70% 60%, #ffbe8c40 0 2px, transparent 3px) 0 0 / 46px 46px, var(--cream);position:fixed;inset:0}button{font:inherit;color:inherit;cursor:pointer;touch-action:manipulation;background:0 0;border:0;padding:0}img{-webkit-user-drag:none}.icon{width:1em;height:1em;display:inline-flex}.icon svg{width:100%;height:100%}#app{position:absolute;inset:0}.screen{transition:opacity .28s,transform .28s;position:absolute;inset:0}.screen.enter{opacity:0;transform:scale(.97)}.screen.exit{opacity:0;pointer-events:none;transform:scale(1.02)}.spacer{flex:1}.topbar{padding:calc(12px + var(--safe-t)) calc(16px + var(--safe-r)) 8px calc(16px + var(--safe-l));align-items:center;gap:12px;display:flex}.topbar h1{margin:0;font-size:32px;font-weight:700}.round-btn{background:var(--white);width:58px;height:58px;color:var(--ink);box-shadow:0 5px 0 var(--shadow);border-radius:50%;flex:none;place-items:center;font-size:28px;transition:transform 80ms,box-shadow 80ms,opacity .2s;display:grid}.round-btn.small{width:46px;height:46px;font-size:22px}.round-btn.pressed,.tool.pressed,.swatch.pressed,.size.pressed,.big-action.pressed,.big-round.pressed,.pill-btn.pressed{box-shadow:0 1px 0 var(--shadow);transform:translateY(4px)}.round-btn.dim{opacity:.4}.round-btn.on{background:#ffe27a}.round-btn.danger{color:#e03131}.round-btn.camera{background:var(--coral);color:#fff}.round-btn.magic.on{background:conic-gradient(from 90deg,#ffadad,#ffd6a5,#fdffb6,#caffbf,#9bf6ff,#bdb2ff,#ffc6ff,#ffadad)}.pill-btn{background:var(--coral);color:#fff;box-shadow:0 5px 0 var(--press);border-radius:999px;align-items:center;gap:10px;padding:14px 26px;font-size:22px;font-weight:600;text-decoration:none;display:inline-flex}.btn-text{color:var(--ink-soft);padding:10px 20px;font-size:20px}.shelf-screen{background:linear-gradient(#ffe9cc 0%,#0000 40%);flex-direction:column;display:flex}.logo{letter-spacing:1px;text-shadow:0 4px #5c341e1f;display:flex;font-size:clamp(38px,6vw,60px)!important}.logo span{animation:2.8s ease-in-out infinite bob;animation-delay:calc(var(--i) * .12s);display:inline-block}@keyframes bob{0%,to{transform:translateY(0)rotate(-3deg)}50%{transform:translateY(-6px)rotate(3deg)}}.shelf-actions{padding:8px calc(16px + var(--safe-r)) 16px calc(16px + var(--safe-l));gap:16px;display:flex}.big-action{color:#fff;height:92px;box-shadow:0 7px 0 var(--press);border-radius:28px;flex:1;justify-content:center;align-items:center;gap:14px;font-size:28px;font-weight:700;transition:transform 80ms,box-shadow 80ms;display:flex;position:relative}.big-action .icon{font-size:44px}.big-action.free{background:linear-gradient(135deg,#ff8a65,#ff5a7a)}.big-action.gallery{background:linear-gradient(135deg,#5ec2ff,#6f7dff)}.badge{min-width:38px;height:38px;color:var(--ink);box-shadow:0 3px 0 var(--shadow);background:#ffd43b;border-radius:999px;place-items:center;padding:0 10px;font-size:20px;display:grid;position:absolute;top:-8px;right:-6px}.bookshelf{-webkit-overflow-scrolling:touch;padding:0 calc(24px + var(--safe-r)) calc(24px + var(--safe-b)) calc(24px + var(--safe-l));background:repeating-linear-gradient(to bottom, transparent 0 238px, var(--wood) 238px 256px, var(--wood-dark) 256px 264px);background-attachment:local;flex:1;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));grid-auto-rows:264px;column-gap:18px;display:grid;overflow-y:auto}.book{background:var(--book);width:150px;height:204px;animation:.5s cubic-bezier(.3,1.4,.5,1) both book-in;animation-delay:calc(var(--i) * 50ms);transform-origin:bottom;border-radius:8px 16px 16px 8px;place-self:end center;margin-bottom:26px;transition:transform .15s;display:flex;position:relative;box-shadow:inset -6px 0 #0000001a,0 6px #0000001f}.book.pressed{transform:translateY(-10px)rotate(-3deg)scale(1.04)}@keyframes book-in{0%{opacity:0;transform:translateY(30px)scale(.8)}}.book-spine{background:#00000024;border-radius:8px 0 0 8px;width:18px;box-shadow:inset -2px 0 #ffffff40}.book-cover{flex-direction:column;flex:1;justify-content:center;align-items:center;gap:6px;padding:10px 8px;display:flex}.book-cover img{background:#ffffffd9;border-radius:50%;width:100px;height:100px;padding:6px}.book-title{color:#fff;text-align:center;text-shadow:0 2px #0000002e;font-size:17px;font-weight:700;line-height:1.05}.book-screen{background:linear-gradient(180deg, color-mix(in srgb, var(--book) 30%, var(--cream)) 0%, var(--cream) 60%);flex-direction:column;display:flex}.book-heading{align-items:center;gap:10px;display:flex}.book-heading img{width:64px;height:64px}.pages{padding:16px calc(28px + var(--safe-r)) calc(28px + var(--safe-b)) calc(28px + var(--safe-l));flex:1;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));grid-auto-rows:max-content;align-content:start;gap:26px;display:grid;overflow-y:auto}.page-card{min-height:min-content;box-shadow:0 7px 0 var(--shadow);animation:.45s cubic-bezier(.3,1.4,.5,1) both book-in;animation-delay:calc(min(var(--i), 12) * 60ms);background:#fff;border:5px solid #fff;border-radius:18px;transition:transform .15s;position:relative;overflow:hidden}.page-card:nth-child(odd){rotate:-1.2deg}.page-card:nth-child(2n){rotate:1.2deg}.page-card.pressed{transform:scale(1.04)}.page-card canvas{aspect-ratio:4/3;border-radius:12px;width:100%;height:auto;display:block}.page-card.loading{aspect-ratio:4/3;background:linear-gradient(90deg,#fff 0%,#fff4e6 50%,#fff 100%) 0 0/200% 100%;animation:1.2s linear infinite shimmer}@keyframes shimmer{to{background-position:-200% 0}}.page-badge{width:52px;height:52px;box-shadow:0 4px 0 var(--shadow);background:#ffd43b;border-radius:50%;place-items:center;font-size:30px;display:grid;position:absolute;bottom:10px;right:10px}.editor-screen{padding-bottom:calc(12px + var(--safe-b));background:linear-gradient(180deg, color-mix(in srgb, var(--book) 18%, var(--cream)), var(--cream));grid-template:"top top top""tools stage colors"1fr/auto 1fr auto;gap:8px 12px;display:grid}.editor-top{grid-area:top;padding-bottom:0}.editor-top .round-btn{width:54px;height:54px;font-size:26px}.top-cover{width:48px;height:48px}.tools{padding-left:calc(12px + var(--safe-l));flex-direction:column;grid-area:tools;align-self:center;gap:10px;display:flex}.tool-grid{grid-template-columns:repeat(2,64px);gap:8px;display:grid}.tool{width:64px;height:58px;box-shadow:0 4px 0 var(--shadow);outline-offset:-4px;background:#fff;border-radius:18px;outline:4px solid #0000;place-items:center;font-size:32px;transition:transform .12s,box-shadow 80ms;display:grid}.tool canvas{width:60px;height:45px}.tool.active{outline-color:var(--current);background:#fffaf0;transform:scale(1.08)}.tool-fill .icon{color:var(--current);filter:drop-shadow(0 0 1px #00000080)}.pale-color .tool:not(.tool-stickers){background:#9c8a82}.pale-color .tool.active{outline-color:var(--ink)}.pale-color .size.active span{box-shadow:0 0 0 2px var(--ink-soft)}.tool-stickers{color:#b35900;background:linear-gradient(135deg,#ffe066,#ffb84d)}.tool-stickers.active{outline-color:#ff922b}.sizes{box-shadow:0 4px 0 var(--shadow);background:#fff;border-radius:20px;justify-content:space-around;padding:6px;display:flex}.size{border-radius:50%;place-items:center;width:40px;height:40px;display:grid}.size span{background:var(--ink-soft);border-radius:50%;display:block}.size-0 span{width:8px;height:8px}.size-1 span{width:16px;height:16px}.size-2 span{width:28px;height:28px}.size.active{background:#ffefd6}.size.active span{background:var(--current);box-shadow:0 0 0 2px #00000040}.colors{padding-right:calc(12px + var(--safe-r));grid-area:colors;grid-template-columns:repeat(2,50px);align-self:center;gap:8px;display:grid}.swatch{background:var(--c);width:50px;height:50px;box-shadow:inset 0 -5px 0 #00000024, 0 3px 0 var(--shadow);border:4px solid #fff;border-radius:50%;transition:transform .12s}.swatch.active{border-color:var(--ink);transform:scale(1.14)}.stage-wrap{grid-area:stage;place-items:center;min-width:0;min-height:0;display:grid;position:relative}.stage{box-shadow:0 0 0 6px white, 0 10px 0 6px var(--shadow);touch-action:none;background:#fff;border-radius:20px;position:relative;overflow:hidden}.stage .layer{pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.stage.wipe{animation:.45s wipe}@keyframes wipe{25%{transform:rotate(-2deg)scale(.98)}50%{transform:rotate(2deg)scale(.98)}75%{transform:rotate(-1deg)}}.stage-loading{background:color-mix(in srgb, var(--cream) 85%, transparent);z-index:5;place-items:center;transition:opacity .35s;display:grid;position:absolute;inset:0}.stage-loading.done{opacity:0;pointer-events:none}.loader{color:var(--coral);font-size:72px;animation:.9s ease-in-out infinite wiggle}@keyframes wiggle{0%,to{transform:rotate(-18deg)translate(-12px)}50%{transform:rotate(18deg)translate(12px)}}.flash{pointer-events:none;z-index:6;background:#fff;animation:.6s ease-out forwards flash;position:absolute;inset:0}@keyframes flash{0%{opacity:1}to{opacity:0}}.sticker-layer{pointer-events:none;position:absolute;inset:0}.sticker{aspect-ratio:1;touch-action:none;position:absolute}.sticker-inner,.sticker-inner img{width:100%;height:100%;display:block}.sticker-layer.interactive .sticker{pointer-events:auto}.sticker.pop-in .sticker-inner{animation:.45s cubic-bezier(.3,1.6,.5,1) pop-in}@keyframes pop-in{0%{opacity:0;transform:scale(.2)rotate(-20deg)}}.sticker.poof{opacity:0;transition:scale .2s,opacity .2s;scale:.3}.sticker.selected .sticker-inner{outline-offset:-4%;border-radius:16%;outline:4px dashed #3b2a268c}.sticker-handle{width:46px;height:46px;color:var(--ink);box-shadow:0 3px 0 var(--shadow), 0 0 0 3px #3b2a2626;touch-action:none;background:#fff;border-radius:50%;place-items:center;margin:-23px;font-size:24px;font-weight:700;display:none;position:absolute}.sticker.selected .sticker-handle{display:grid}.sticker-handle.del{color:#fff;background:#ff6b6b;top:8%;left:8%}.sticker-handle.turn{color:#fff;background:#74c0fc;inset:auto 8% 8% auto}.sticker-handle.flip{top:auto;bottom:8%;left:8%}.tray{left:calc(8px + var(--safe-l));right:calc(8px + var(--safe-r));padding:10px 12px calc(12px + var(--safe-b));z-index:10;background:#fff;border-radius:28px 28px 0 0;transition:transform .32s cubic-bezier(.3,1.2,.5,1);position:absolute;bottom:0;transform:translateY(110%);box-shadow:0 -6px 30px #5c341e33}.tray.open{transform:none}.tray-tabs{scrollbar-width:none;gap:8px;padding-bottom:8px;display:flex;overflow-x:auto}.tray-tab,.tray-close{background:#fff4e6;border-radius:16px;flex:none;place-items:center;width:56px;height:56px;display:grid}.tray-tab img{width:44px;height:44px}.tray-tab .emoji{font-size:34px}.tray-tab.active{background:#ffd8a8;box-shadow:inset 0 0 0 3px #ff922b}.tray-close{background:#f1f3f5;margin-left:auto;font-size:30px;position:sticky;right:0}.tray-grid{touch-action:pan-x;scrollbar-width:none;grid-template-rows:repeat(2,92px);grid-auto-columns:92px;grid-auto-flow:column;gap:8px;display:grid;overflow-x:auto}.sticker-cell{touch-action:pan-x;background:#fffaf2;border-radius:20px;place-items:center;transition:transform .12s;display:grid}.sticker-cell:active{transform:scale(.92)}.sticker-cell img{pointer-events:none;width:78px;height:78px}.sticker-cell .emoji{pointer-events:none;font-size:58px;line-height:1}.glyph-thumb{background:var(--c);color:#fff;pointer-events:none;border-radius:16px;place-items:center;width:70px;height:70px;font-size:46px;font-weight:700;line-height:1;display:grid;box-shadow:inset 0 -6px #2814142e}.sticker-ghost .glyph-thumb{width:110px;height:110px;font-size:72px}.sticker-ghost{pointer-events:none;z-index:1000;filter:drop-shadow(0 8px 10px #00000040);place-items:center;width:120px;height:120px;display:grid;position:fixed;top:0;left:0}.sticker-ghost img{width:100%;height:100%}.sticker-ghost .emoji{font-size:96px}@media (orientation:portrait){.editor-screen{grid-template:"top""stage"1fr"tools""colors"/1fr}.stage-wrap{margin:8px calc(18px + var(--safe-r)) 8px calc(18px + var(--safe-l))}.tools{flex-direction:row;justify-content:center;align-items:center;padding:0 12px}.tool-grid{grid-template-columns:repeat(10,58px)}.tool{width:58px}.tool canvas{width:54px;height:40px}.sizes{flex-direction:column;gap:2px;padding:4px}.size{width:36px;height:32px}.colors{grid-template-columns:repeat(9,46px);justify-content:center;padding:0 12px}.swatch{width:46px;height:46px}}@media (orientation:portrait) and (width<=700px){.tool-grid{grid-template-columns:repeat(5,54px)}.tool{width:54px;height:50px}.colors{grid-template-columns:repeat(9,36px);gap:6px}.swatch{border-width:3px;width:36px;height:36px}.editor-top .round-btn{width:44px;height:44px;font-size:22px}}@media (orientation:landscape) and (height<=600px){.tool-grid{grid-template-columns:repeat(2,52px);gap:6px}.tool{width:52px;height:44px}.tool canvas{width:46px;height:34px}.colors{grid-template-columns:repeat(2,38px);gap:6px}.swatch{border-width:3px;width:38px;height:38px}.editor-top .round-btn{width:44px;height:44px;font-size:22px}}.gallery-screen{flex-direction:column;display:flex}.gallery-grid{padding:16px calc(28px + var(--safe-r)) calc(28px + var(--safe-b)) calc(28px + var(--safe-l));flex:1;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));grid-auto-rows:max-content;align-content:start;gap:28px;display:grid;overflow-y:auto}.art-card{box-shadow:0 8px 0 var(--shadow);rotate:var(--tilt);animation:.45s cubic-bezier(.3,1.4,.5,1) both book-in;animation-delay:calc(var(--i) * 40ms);background:#fff;border-radius:8px;padding:12px 12px 34px;position:relative}.art-card:before{content:"";background:#ffd666bf;width:70px;height:24px;position:absolute;top:-12px;left:50%;translate:-50%;rotate:-3deg}.art-open{width:100%;display:block}.art-open img{aspect-ratio:4/3;object-fit:cover;border-radius:4px;width:100%;display:block}.art-actions{gap:8px;display:flex;position:absolute;bottom:-14px;right:-10px}.gallery-empty{text-align:center;color:var(--ink-soft);margin:auto;font-size:26px}.gallery-empty .icon{color:var(--coral);opacity:.6;font-size:90px}.modal-backdrop{z-index:100;-webkit-backdrop-filter:blur(4px);background:#3c1e0f59;place-items:center;padding:24px;animation:.2s fade-in;display:grid;position:fixed;inset:0}.modal-backdrop.out{opacity:0;transition:opacity .2s}@keyframes fade-in{0%{opacity:0}}.modal{max-width:min(720px,100%);max-height:100%;box-shadow:0 12px 0 var(--shadow);background:#fff;border-radius:32px;padding:28px;animation:.35s cubic-bezier(.3,1.5,.5,1) pop-in;overflow:auto}.confirm{flex-direction:column;align-items:center;gap:24px;font-size:24px;display:flex}.confirm p{margin:0}.confirm-icon{color:var(--ink-soft);font-size:90px}.confirm-buttons{gap:36px;display:flex}.big-round{color:#fff;width:96px;height:96px;box-shadow:0 6px 0 var(--press);border-radius:50%;place-items:center;font-size:50px;display:grid}.big-round.no{background:#adb5bd}.big-round.yes{background:#51cf66}.big-round.yes.danger{background:#fa5252}.bg-picker{grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:14px;width:min(640px,80vw);display:grid}.bg-option{box-shadow:0 0 0 3px #f1e4d4, 0 4px 0 var(--shadow);border-radius:16px;transition:transform .12s;overflow:hidden}.bg-option canvas{aspect-ratio:4/3;width:100%;display:block}.bg-option.active{box-shadow:0 0 0 5px var(--coral)}.bg-option.pressed{transform:scale(.95)}.gate{text-align:center;width:min(420px,80vw)}.gate h2{margin:8px 0}.gate p{color:var(--ink-soft);font-size:20px}.gate strong{color:var(--ink)}.gate-lock{color:var(--coral);font-size:48px}.gate-dots{justify-content:center;gap:14px;margin:12px 0 18px;display:flex}.gate-dots span{background:#e9ecef;border-radius:50%;width:18px;height:18px}.gate-dots span.on{background:var(--coral)}.gate-dots.shake{animation:.4s wipe}.gate-keys{grid-template-columns:repeat(5,1fr);gap:10px;margin-bottom:12px;display:grid}.gate-key{background:#fff4e6;border-radius:18px;height:64px;font-size:28px;font-weight:600}.gate-key.pressed{background:#ffd8a8}.parents{-webkit-user-select:text;user-select:text;width:min(560px,82vw);font-size:18px}.parents h2{margin-top:0}.parents h3{margin:18px 0 4px}.parents p{color:var(--ink-soft);margin:0 0 6px;line-height:1.4}.parents a{color:#1c7ed6}.export{flex-direction:column;align-items:center;gap:14px;display:flex}.export-img{-webkit-touch-callout:default;border-radius:12px;width:min(600px,76vw);box-shadow:0 0 0 4px #f1e4d4}.hint{color:var(--ink-soft);margin:0;font-size:16px}.toast{left:50%;bottom:calc(28px + var(--safe-b));z-index:200;background:var(--ink);color:#fff;border-radius:999px;padding:14px 26px;font-size:20px;transition:opacity .35s,transform .35s;animation:.35s cubic-bezier(.3,1.5,.5,1) toast-in;position:fixed;translate:-50%;box-shadow:0 6px 20px #0003}.toast.out{opacity:0;transform:translateY(20px)}@keyframes toast-in{0%{opacity:0;transform:translateY(40px)}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important}}.page-card.locked canvas{opacity:.45}.page-badge.lock{background:var(--ink);color:#fff;font-size:26px}.page-card:not(.locked) .page-badge.lock{display:none}.shop{text-align:center;flex-direction:column;align-items:center;width:min(560px,82vw);font-size:18px;display:flex}.shop h2{margin:6px 0 4px}.shop-lock{color:var(--coral);font-size:44px}.shop-lead,.shop-note{color:var(--ink-soft);margin:0 0 8px;line-height:1.4}.shop-note{font-size:16px}.shop-body{flex-direction:column;align-self:stretch;align-items:center;gap:14px;margin:12px 0 4px;display:flex}.shop-option{text-align:left;-webkit-user-select:text;user-select:text;background:#fff8ec;border-radius:20px;align-self:stretch;padding:16px 18px}.shop-option h3{justify-content:space-between;gap:12px;margin:0 0 10px;display:flex}.shop-option p{margin:0 0 8px;line-height:1.4}.shop-price{color:var(--coral)}.shop-paypal{min-height:48px}.shop-link{color:#1c7ed6;font-weight:600}.shop-code-row{gap:10px;display:flex}.shop-input{min-width:0;font:inherit;letter-spacing:.06em;text-transform:uppercase;color:var(--ink);-webkit-user-select:text;user-select:text;border:3px solid #f1e4d4;border-radius:999px;flex:1;padding:10px 16px;font-size:22px}.shop-input:focus{border-color:var(--coral);outline:none}.shop .pill-btn:disabled{opacity:.5}.shop-error{color:#e03131;font-weight:600}.shop-status{color:var(--ink-soft);margin:0}.shop-done{margin:0;font-size:24px;font-weight:700}.shop-code{letter-spacing:.06em;-webkit-user-select:text;user-select:text;margin:0;font-size:30px;font-weight:700}.shop-code-box{flex-wrap:wrap;justify-content:center;align-items:center;gap:8px 16px;display:flex}.copy-code{background:var(--ink);padding:8px 18px;font-size:18px}.parents .pill-btn{margin-top:6px}