:root{--bg-1:#fff5fb;--bg-2:#f3eeff;--pink:#ff5fa2;--pink-soft:#ffd3e6;--violet:#8c6cff;--violet-soft:#e4dcff;--yellow:#ffd84d;--ink:#4a3a5c;--ink-soft:#8a7a9c;--card:#fff;--radius:20px;--radius-sm:14px;--shadow:0 4px 14px #8c6cff29;--shadow-sm:0 2px 6px #8c6cff24;--ring:0 0 0 3px #fff, 0 0 0 6px var(--pink);--font:"Fredoka", system-ui, sans-serif;--safe-top:env(safe-area-inset-top,0px);--safe-bottom:env(safe-area-inset-bottom,0px);--safe-left:env(safe-area-inset-left,0px);--safe-right:env(safe-area-inset-right,0px)}@font-face{font-family:Fredoka;font-style:normal;font-display:swap;font-weight:400;src:url(./fredoka-latin-400-normal-17JuUzdy.woff2)format("woff2"),url(./fredoka-latin-400-normal-DbXSrOeS.woff)format("woff")}@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")}*,:before,:after{box-sizing:border-box}html,body{height:100%;font-family:var(--font);color:var(--ink);background:linear-gradient(180deg, var(--bg-1), var(--bg-2));touch-action:manipulation;overscroll-behavior:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;margin:0;overflow:hidden}body{padding:var(--safe-top) var(--safe-right) var(--safe-bottom) var(--safe-left)}#app{height:100%}button{font:inherit;color:inherit;cursor:pointer;touch-action:manipulation;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;background:0 0;border:0;padding:0}button:focus-visible{outline:3px solid var(--violet);outline-offset:2px}img{-webkit-user-drag:none;user-drag:none}.sr-only{clip:rect(0 0 0 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.play{background:linear-gradient(180deg, var(--bg-1), var(--bg-2));grid-template-rows:52px minmax(0,1fr);grid-template-columns:minmax(0,1fr);height:100%;display:grid;position:relative}.play>*{min-width:0}.play-main{flex-direction:column;min-width:0;min-height:0;display:flex}.stage{min-height:0;box-shadow:var(--shadow);z-index:1;border-radius:0 0 26px 26px;flex:0 0 52%;position:relative;overflow:hidden}@media (height<=700px){.stage{flex-basis:45%}}.panel{background:var(--card);z-index:2;border-radius:26px 26px 0 0;flex-direction:column;flex:1 1 0;min-width:0;min-height:0;margin-top:-14px;padding-top:6px;display:flex;position:relative;box-shadow:0 -4px 14px #8c6cff1f}@media (width>=768px),(orientation:landscape) and (width>=560px){.play-main{flex-direction:row}.stage{border-radius:0 26px 26px 0;flex:0 0 55%}.panel{border-radius:26px 0 0;flex:1 1 0;margin-top:0;margin-left:-14px;padding-left:14px;box-shadow:-4px 0 14px #8c6cff1f}}.topbar{align-items:center;gap:4px;min-width:0;padding:0 6px;display:flex}.icon-btn{width:44px;height:44px;color:var(--violet);box-shadow:var(--shadow-sm);background:#fff;border-radius:50%;flex:none;place-items:center;display:grid}.icon-btn:disabled{opacity:.4;cursor:default}.icon-btn:active:not(:disabled){transform:scale(.92)}.icon-btn--dice:active:not(:disabled){transform:rotate(18deg)scale(.92)}.icon-btn--sound[aria-pressed=false]{color:var(--ink-soft)}.steps{scrollbar-width:none;flex:1 1 0;gap:2px;min-width:0;padding:2px;display:flex;overflow-x:auto}.steps::-webkit-scrollbar{display:none}.step-btn{border-radius:16px;flex:0 0 44px;place-items:center;height:48px;display:grid;position:relative}.step-btn .asset,.step-btn .asset img,.step-btn .asset-fallback{width:34px;height:34px;display:block}.step-btn .asset img{object-fit:contain}.step-btn[aria-current=step]{box-shadow:0 0 0 2.5px var(--pink), var(--shadow-sm);background:#fff}.step-btn .check{background:#4cc36b;border:1.5px solid #fff;border-radius:50%;width:17px;height:17px;padding:2px;display:none;position:absolute;bottom:3px;right:1px}.step-btn.is-done .check{display:block}.asset{line-height:0;display:inline-block}.asset-fallback{color:var(--ink);border-radius:50%;place-items:center;font-size:15px;font-weight:700;line-height:1;display:inline-grid}.stage-bg{background:linear-gradient(#fff0f8 0%,#f3eeff 78%,#ffd3e6 78%,#ffc2dd 100%);position:absolute;inset:0}.stage-bg-img{object-fit:cover;object-position:50% 78%;width:100%;height:100%;transition:opacity .4s;position:absolute;inset:0}.doll-cam{transform-origin:0 0;transition:transform .45s;position:absolute}.doll-hop{width:100%;height:100%;position:relative}.doll-svg{width:100%;height:100%;display:block;overflow:visible}.doll-svg [data-slot]{pointer-events:none}.fx-layer,.bubble-layer{pointer-events:none;position:absolute;inset:0;overflow:hidden}.fx-layer{z-index:3}.bubble-layer{z-index:4}.tool-sprite{pointer-events:none;will-change:transform;position:absolute;top:0;left:0}.tool-sprite img{object-fit:contain;width:100%;height:100%;display:block}.zzz{color:#9d8fc4;pointer-events:none;font-weight:700;display:none;position:absolute;top:6%;left:63%}.is-blank .zzz{display:block}.zzz span{font-size:calc(var(--u,.25) * 34px);opacity:0;animation:3.2s ease-in-out infinite zzz;position:absolute}.zzz span:nth-child(2){animation-delay:1s;left:16%}.zzz span:nth-child(3){animation-delay:2s;left:34%}@keyframes zzz{0%{opacity:0;transform:translate(0)scale(.6)}25%{opacity:1}to{transform:translate(calc(var(--u,.25) * 40px), calc(var(--u,.25) * -90px)) scale(1.2);opacity:0}}.waking [data-slot=eyes]{transform-box:fill-box;transform-origin:50% 40%;animation:.5s ease-out .55s both eyes-open}.waking [data-slot=brows],.waking [data-slot=nose],.waking [data-slot=mouth],.waking [data-slot=marks]{animation:.6s ease-out .55s both fade-in}@keyframes eyes-open{0%{opacity:.4;transform:scaleY(.08)}to{opacity:1;transform:scaleY(1)}}@keyframes fade-in{0%{opacity:0}to{opacity:1}}.bubble{border:2.5px solid var(--pink);width:max-content;max-width:min(78%,280px);color:var(--ink);box-shadow:var(--shadow-sm);text-align:center;background:#fff;border-radius:18px;padding:7px 14px;font-size:16px;font-weight:600;line-height:1.2;animation:.25s cubic-bezier(.2,.9,.3,1.3) pop-in;position:absolute}.bubble:after{content:"";left:var(--tail,30px);border-right:2.5px solid var(--pink);border-bottom:2.5px solid var(--pink);background:#fff;width:12px;height:12px;position:absolute;bottom:-9px;transform:translate(-50%)rotate(45deg)}@keyframes pop-in{0%{opacity:0;transform:scale(.7)}to{opacity:1;transform:scale(1)}}.tabs{scrollbar-width:none;flex:none;gap:6px;padding:2px 10px 4px;display:flex;overflow-x:auto}.tabs::-webkit-scrollbar{display:none}.tabs[hidden]{display:none}.tab{background:var(--bg-2);min-width:62px;height:52px;color:var(--ink);border-radius:16px;flex-direction:column;flex:none;justify-content:center;align-items:center;gap:1px;padding:2px 8px 0;display:flex}.tab .asset,.tab .asset img,.tab .asset-fallback{width:28px;height:28px;font-size:13px;display:block}.tab .asset img{object-fit:contain}.tab-label{font-size:11px;font-weight:600;line-height:1.1}.tab[aria-current=true]{box-shadow:0 0 0 2.5px var(--pink), var(--shadow-sm);background:#fff}.hint{background:var(--pink-soft);color:var(--ink);text-align:center;border-radius:14px;flex:none;margin:2px 14px 0;padding:6px 12px;font-size:14px;font-weight:600}.hint[hidden]{display:none}.grid{overscroll-behavior:contain;-webkit-overflow-scrolling:touch;flex:1 1 0;grid-template-columns:repeat(4,minmax(0,1fr));align-content:start;gap:8px;min-height:0;padding:6px 12px 8px;display:grid;overflow-y:auto}@media (width>=768px),(orientation:landscape) and (width>=560px){.grid{grid-template-columns:repeat(auto-fill,minmax(78px,1fr))}}.soon{text-align:center;min-height:120px;color:var(--ink-soft);grid-column:1/-1;align-content:center;place-items:center;gap:6px;display:grid}.soon strong{color:var(--violet);font-size:20px}.tile{box-shadow:var(--shadow-sm);background:#fff;border:2.5px solid #0000;border-radius:18px;grid-template-rows:auto auto;grid-template-columns:minmax(0,1fr);align-content:start;gap:2px;padding:4px 4px 3px;display:grid;position:relative}.tile .thumb{background:var(--bg-2);border-radius:13px;width:100%;height:0;padding-bottom:100%;display:block;position:relative;overflow:hidden}.tile .thumb img,.tile .thumb .fb{width:100%;height:100%;position:absolute;inset:0}.tile .thumb img{object-fit:cover;object-position:50% 80%}.tile .thumb img.pet-thumb{object-fit:contain;object-position:50% 100%;padding:4px}.tile .thumb .fb{color:var(--ink);background:var(--pink-soft);place-items:center;font-size:26px;font-weight:700;display:grid}.tile .thumb svg{width:100%;height:100%;display:block;position:absolute;inset:0}.tile .name{text-align:center;white-space:nowrap;text-overflow:ellipsis;color:var(--ink);font-size:11px;font-weight:600;line-height:1.1;overflow:hidden}.tile[aria-pressed=true]{border-color:var(--pink);box-shadow:0 0 0 3px #ff5fa247,0 0 14px #ff5fa273}.check{background:var(--pink);width:22px;height:22px;box-shadow:var(--shadow-sm);border:2px solid #fff;border-radius:50%;padding:3px;display:none;position:absolute;top:-3px;right:-3px}[aria-pressed=true]>.check{display:block}.bounce{animation:.34s cubic-bezier(.3,.7,.4,1.4) bounce}@keyframes bounce{0%{transform:scale(1)}35%{transform:scale(.88)}70%{transform:scale(1.1)}to{transform:scale(1)}}.colors,.styles,.patterns{scrollbar-width:none;flex:none;align-items:center;gap:8px;padding:6px 12px;display:flex;overflow-x:auto}.colors::-webkit-scrollbar{display:none}.styles::-webkit-scrollbar{display:none}.patterns::-webkit-scrollbar{display:none}.colors[hidden],.styles[hidden],.patterns[hidden]{display:none}.swatch{border-radius:50%;flex:0 0 44px;width:44px;height:44px;padding:0;position:relative}.swatch .dot{width:100%;height:100%;box-shadow:0 0 0 1.5px #4a3a5c2e, var(--shadow-sm);border:3px solid #fff;border-radius:50%;display:block}.swatch .dot--auto{background:conic-gradient(#4a3026,#b4532a,#f0c76a,#ffa6c9,#8a55d6,#4c7dff,#4a3026)}.swatch[aria-pressed=true] .dot{box-shadow:0 0 0 3px var(--pink), 0 0 12px #ff5fa28c}.grid--swatches{grid-template-columns:repeat(5,minmax(0,1fr));justify-items:center;gap:10px 6px;padding-top:10px}@media (width>=768px),(orientation:landscape) and (width>=560px){.grid--swatches{grid-template-columns:repeat(auto-fill,minmax(56px,1fr))}}.swatch--pattern .dot{border-radius:14px;overflow:hidden}.swatch--pattern{border-radius:14px}.swatch--pattern .dot svg{display:block}.swatch--big{flex:none;width:52px;height:52px}.swatch--none .dot{background:#fff;place-items:center;display:grid}.styles{gap:6px;padding-bottom:2px}.chip{background:var(--bg-2);min-width:64px;height:36px;color:var(--ink);border:2.5px solid #0000;border-radius:18px;flex:none;padding:0 14px;font-size:14px;font-weight:600}.chip[aria-pressed=true]{border-color:var(--pink);color:#c23a78;background:#fff;box-shadow:0 0 10px #ff5fa266}.swatch .check{width:20px;height:20px;padding:2.5px;top:-4px;right:-4px}.nav{padding:6px 12px calc(8px + var(--safe-bottom));flex:none;gap:8px;display:flex}.nav [hidden]{display:none}.btn{min-width:0;height:48px;box-shadow:var(--shadow-sm);border-radius:24px;flex:1 1 0;padding:0 14px;font-size:17px;font-weight:700}.btn:disabled{opacity:.4;cursor:default}.btn:active:not(:disabled){transform:scale(.96)}.btn--primary{background:linear-gradient(180deg, #ff7fb8, var(--pink));color:#fff}.btn--secondary{background:var(--violet-soft);color:var(--violet)}.btn--ready{background:linear-gradient(180deg, #ffe680, var(--yellow));color:#7a5a00;flex:none}.btn.glow{animation:1.4s ease-in-out infinite glow}@keyframes glow{0%,to{box-shadow:0 0 0 0 #ff5fa28c, var(--shadow-sm)}50%{box-shadow:0 0 0 9px #ff5fa200, var(--shadow-sm)}}.dialog-backdrop{z-index:50;background:#4a3a5c73;place-items:center;display:grid;position:fixed;inset:0}.dialog{text-align:center;width:min(86vw,360px);box-shadow:var(--shadow);background:#fff;border-radius:24px;padding:20px}.dialog h2{color:var(--violet);margin:0 0 6px;font-size:22px}.dialog p{margin:0 0 14px}.dialog-buttons{gap:8px;display:flex}@media (prefers-reduced-motion:reduce){.doll-cam{transition:none}.bounce,.btn.glow,.bubble{animation:none}.waking [data-slot]{animation:none!important}.zzz span{opacity:.8;animation:none}}@media (height<=700px){.tab{min-width:58px;height:46px}.tab .asset,.tab .asset img,.tab .asset-fallback{width:24px;height:24px}.colors,.styles,.patterns{padding:2px 12px}.nav{padding:3px 12px calc(6px + var(--safe-bottom))}.btn{height:44px;font-size:16px}.hint{padding:3px 10px;font-size:13px}}.stage-pet{aspect-ratio:1;cursor:pointer;z-index:1;width:33.3%;position:absolute;bottom:8.4%;left:65.8%}.stage-pet[hidden]{display:none}.pet-bob{transform-origin:50% 100%;width:100%;height:100%;animation:2.4s ease-in-out infinite pet-bob}.pet-bob .asset,.pet-bob img,.pet-bob .asset-fallback{object-fit:contain;width:100%;height:100%;display:block}.pet-bob .asset-fallback{border-radius:50%;font-size:40px}@keyframes pet-bob{0%,to{transform:translateY(0)scale(1)}50%{transform:translateY(-2.2%)scale(1.02,.985)}}.stage-pet.hop .pet-bob{animation:.5s ease-out pet-hop}@keyframes pet-hop{0%{transform:translateY(0)scale(1.05,.9)}35%{transform:translateY(-22%)scale(.96,1.06)}70%{transform:translateY(0)scale(1.06,.92)}to{transform:translateY(0)scale(1)}}@media (prefers-reduced-motion:reduce){.pet-bob,.stage-pet.hop .pet-bob{animation:none}}.title{background:linear-gradient(180deg, var(--bg-1), var(--bg-2));height:100%;position:relative;overflow:hidden}.title-stage{position:absolute;inset:0}.title-stage .stage{box-shadow:none;border-radius:0;flex:none;position:absolute;inset:0}.title-logo{top:calc(10px + var(--safe-top));pointer-events:none;z-index:5;place-items:center;margin:0;display:grid;position:absolute;left:0;right:0}.title-logo .logo-img,.title-logo .logo-img img{object-fit:contain;filter:drop-shadow(0 3px 6px #8c6cff40);width:min(78vw,420px);height:auto;max-height:20vh;display:block}.title-logo .asset-fallback{display:none}.logo-text{color:var(--pink);text-shadow:0 3px #fff,0 6px 12px #8c6cff4d;text-align:center;font-size:clamp(34px,11vw,56px);font-weight:700;line-height:1}.title-buttons{left:0;right:0;bottom:calc(18px + var(--safe-bottom));z-index:5;justify-items:center;gap:10px;padding:0 28px;display:grid;position:absolute}.btn--big{border-radius:30px;flex:none;min-width:min(78vw,300px);height:60px;font-size:24px}.title-buttons .btn--secondary{background:#fff;flex:none;min-width:min(60vw,220px)}.title-sound{top:calc(10px + var(--safe-top));z-index:6;position:absolute;right:10px}.finale{background:#2a1d3d;height:100%;position:relative;overflow:hidden}.finale .stage{box-shadow:none;border-radius:0;flex:none;position:absolute;inset:0}.flash{opacity:0;pointer-events:none;z-index:30;background:#fff;position:absolute;inset:0}.flash.go{opacity:1;transition:none}.flash:not(.go){transition:opacity .5s ease-out}.polaroid-wrap{z-index:20;padding:calc(10px + var(--safe-top)) 16px calc(12px + var(--safe-bottom));background:#3c285a80;flex-direction:column;justify-content:center;align-items:center;gap:8px;display:flex;position:absolute;inset:0;overflow-y:auto}.polaroid-wrap[hidden]{display:none}.polaroid-wrap.in .polaroid{animation:.7s cubic-bezier(.2,.9,.3,1.1) both polaroid-in}@keyframes polaroid-in{0%{opacity:0;transform:translateY(40vh)rotate(8deg)scale(.7)}to{opacity:1;transform:translateY(0)rotate(-2deg)scale(1)}}.polaroid{background:#fff;border-radius:6px;flex:none;gap:6px;margin:0;padding:12px 12px 8px;display:grid;transform:rotate(-2deg);box-shadow:0 10px 30px #1e0a3c73}.polaroid .photo{aspect-ratio:3/4;background:var(--bg-2);border-radius:3px;place-items:center;height:min(42vh,380px);display:grid;overflow:hidden}.polaroid .photo img{object-fit:cover;width:100%;height:100%;display:block}.photo-loading{color:var(--ink-soft);text-align:center;padding:12px;font-weight:600}.polaroid figcaption{text-align:center;gap:2px;display:grid}.name-label{color:var(--ink-soft);font-size:12px;font-weight:600;line-height:1}.name-field{border:0;border-bottom:2.5px dashed var(--pink-soft);text-align:center;width:100%;font:600 20px var(--font);color:var(--ink);-webkit-user-select:text;user-select:text;background:0 0;outline:none;padding:2px 4px}.name-field:focus{border-bottom-color:var(--pink)}.finale-msg{color:#fff;text-align:center;text-shadow:0 1px 4px #1e0a3c99;min-height:18px;margin:0;font-size:15px;font-weight:600}.finale-buttons{flex:none;grid-template-columns:1fr 1fr;gap:8px;width:min(92vw,380px);display:grid}.finale-buttons .btn{flex:none;height:46px;font-size:16px}.finale-buttons .btn--wide{grid-column:1/-1}@media (height<=700px){.polaroid .photo{height:min(36vh,300px)}.finale-buttons .btn{height:42px;font-size:15px}}@media (orientation:landscape) and (height<=520px){.polaroid-wrap{flex-flow:wrap;gap:14px 24px}.polaroid .photo{height:min(70vh,300px)}.finale-buttons{width:min(46vw,340px)}}.album{background:linear-gradient(180deg, var(--bg-1), var(--bg-2));flex-direction:column;height:100%;display:flex}.album-bar{padding:calc(8px + var(--safe-top)) 10px 8px;flex:none;align-items:center;gap:10px;display:flex}.album-bar h1{color:var(--violet);flex:1;margin:0;font-size:26px}.album-count{color:var(--ink-soft);padding-right:6px;font-weight:600}.album-grid{min-height:0;padding:4px 14px calc(18px + var(--safe-bottom));flex:1 1 0;grid-template-columns:repeat(2,minmax(0,1fr));align-content:start;gap:12px;display:grid;overflow-y:auto}@media (width>=560px){.album-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (width>=900px){.album-grid{grid-template-columns:repeat(5,minmax(0,1fr))}}.album-empty{text-align:center;color:var(--ink-soft);grid-column:1/-1;margin-top:30vh;font-size:18px;font-weight:600}.album-card{position:relative}.album-open{width:100%;box-shadow:var(--shadow);transform:rotate(var(--tilt,-1.2deg));background:#fff;border-radius:6px;gap:4px;padding:8px 8px 6px;display:grid}.album-card:nth-child(2n){--tilt:1.4deg}.album-pic{aspect-ratio:3/4;background:var(--bg-2);border-radius:3px;display:block;overflow:hidden}.album-pic img{object-fit:cover;width:100%;height:100%;display:block}.album-name{text-align:center;color:var(--ink);text-overflow:ellipsis;white-space:nowrap;min-height:22px;font-size:16px;font-weight:600;overflow:hidden}.album-del{z-index:2;place-items:center;width:44px;height:44px;display:grid;position:absolute;top:-8px;right:-6px}.album-del svg{background:var(--pink);width:26px;height:26px;box-shadow:var(--shadow-sm);border:2px solid #fff;border-radius:50%;padding:5px}
