:root{color:#4d2f18;font-synthesis:none;--cream:#fff8e8;--paper:#fffdf5;--brown:#4d2f18;--red:#ef625d;--yellow:#ffc94d;--blue:#55afe0;--green:#54aa50;--purple:#8b73d7;--paper-shadow:0 7px 0 #71481f24, 0 13px 24px #71481f21;background:#fff8e8;font-family:Arial Rounded MT Bold,PingFang SC,Microsoft YaHei,system-ui,sans-serif}*{box-sizing:border-box}body{background:radial-gradient(circle at 15% 20%, #eebc5914 0 1px, transparent 1.5px) 0 0 / 11px 11px, var(--cream);min-width:320px;min-height:100vh;margin:0;overflow-x:hidden}button{font:inherit}button:focus-visible{outline-offset:3px;outline:4px solid #234c9a}.app-shell{width:min(1500px,100%);min-height:100vh;margin:0 auto;padding:18px 26px 24px;position:relative;overflow-x:clip}.topbar{grid-template-columns:auto minmax(480px,1fr) auto;align-items:center;gap:24px;min-height:112px;display:grid}h1{background:var(--paper);box-shadow:var(--paper-shadow);letter-spacing:.06em;text-shadow:0 3px #fff,0 5px #5c360f1f;border:3px solid #fff;border-radius:22% 16% 20% 15%/18% 22% 16% 24%;margin:0;padding:10px 22px 14px;font-size:clamp(2rem,3.4vw,3.35rem);line-height:.95;transform:rotate(-1deg)}.title-red{color:#ea5245}.title-green{color:#29a267}.top-actions{gap:16px;display:flex}.top-actions button,.edit-actions button,.celebration-card button{color:#fff;box-shadow:var(--paper-shadow);cursor:pointer;border:4px solid #fff;border-radius:20px;justify-content:center;align-items:center;gap:10px;min-height:58px;padding:0 22px;font-size:1.15rem;font-weight:900;transition:transform .15s,filter .15s;display:inline-flex}.top-actions button:hover:not(:disabled),.edit-actions button:hover:not(:disabled),.celebration-card button:hover{filter:saturate(1.08);transform:translateY(-3px)rotate(-1deg)}.top-actions svg,.edit-actions svg{fill:none;stroke:currentColor;stroke-width:2.5px;stroke-linecap:round;stroke-linejoin:round;width:30px;height:30px}.top-actions .slash{stroke:#fff4a8;stroke-width:3px}.sound-button{background:var(--green)}.sound-button.is-muted{background:#8d9b78}.restart-button{background:var(--red)}.scene-tabs{z-index:2;justify-content:center;gap:8px;margin:0;display:flex;position:relative}.scene-tab{color:#304b71;cursor:pointer;border:4px solid #fff;border-bottom-width:2px;border-radius:24px 24px 8px 8px;align-items:center;gap:9px;padding:14px 16px 16px;font-size:1rem;font-weight:900;transition:transform .16s;display:inline-flex;transform:translateY(5px);box-shadow:0 4px #5a35192b}.scene-tab:hover,.scene-tab.is-active{transform:translateY(0)}.scene-tab svg{fill:#ffffff73;stroke:currentColor;stroke-width:2px;stroke-linecap:round;stroke-linejoin:round;width:27px;height:27px}.tab-garden{color:#6d3e10;background:#ffd262}.tab-ocean{background:#70c5ea}.tab-space{background:#b49be8}.game-layout{grid-template-columns:240px minmax(0,1fr);align-items:stretch;gap:22px;display:grid}.side-panel,.game-canvas,.sticker-tray{background:var(--paper);box-shadow:var(--paper-shadow);border:7px solid #fff}.side-panel{border-radius:22px 28px 20px 25px;flex-direction:column;justify-content:center;padding:28px 20px 20px;display:flex;position:relative}.side-panel:before,.side-panel:after{content:"";background:#f56b64ba;width:96px;height:24px;position:absolute;top:-12px;left:50%;transform:translate(-50%)rotate(-3deg);box-shadow:0 2px 2px #5031111a}.side-panel:after{background:#ffcd48c7;inset:auto -22px -11px auto;transform:rotate(-11deg)}.progress-copy{text-align:center;white-space:nowrap;font-size:1.55rem;font-weight:900}.progress-copy strong{color:var(--red);vertical-align:-.08em;font-size:3.4rem}.progress-track{background:#ead8b0;border-radius:10px;height:11px;margin:6px 8px 24px;overflow:hidden}.progress-track span{background:var(--red);border-radius:inherit;height:100%;transition:width .3s;display:block}.instruction{text-align:center;background:#fffaf0;border:3px solid #f3e6c8;border-radius:24px 18px 26px 20px;padding:26px 12px;font-size:1.35rem;font-weight:900;line-height:1.45;box-shadow:0 4px #eadbbd}.edit-actions{grid-template-columns:1fr 1fr;gap:12px;margin-top:26px;display:grid}.edit-actions button{background:var(--blue);border-radius:16px;flex-direction:column;min-height:74px;padding:10px 4px;font-size:.95rem}.edit-actions .clear-button{background:#f38a31}.edit-actions button:disabled{opacity:.4;cursor:default;filter:grayscale(.2)}.game-canvas{aspect-ratio:2;touch-action:none;isolation:isolate;background-image:url(/assets/scene-sprite.png);background-repeat:no-repeat;background-size:100% 300%;border-radius:24px 20px 27px 21px;min-height:410px;position:relative;overflow:hidden}.scene-garden{background-position:0 0}.scene-ocean{background-position:0}.scene-space{background-position:0 100%}.canvas-hint{color:#654522;pointer-events:none;background:#fffdf5e0;border:3px solid #fff;border-radius:16px;padding:12px 22px;font-size:1.3rem;font-weight:900;animation:1.8s ease-in-out infinite hintFloat;position:absolute;top:51%;left:50%;transform:translate(-50%,-50%)rotate(-1deg);box-shadow:0 4px #55351624}.placed-sticker{aspect-ratio:1;width:clamp(90px,10vw,145px);transform:translate(-50%, -50%) rotate(var(--rotation));cursor:grab;touch-action:none;z-index:2;-webkit-user-select:none;user-select:none;position:absolute}.placed-sticker:active{cursor:grabbing}.placed-sticker.is-active:after{content:"";filter:drop-shadow(0 2px #3f78bd);pointer-events:none;border:3px dashed #fff;border-radius:20px;position:absolute;inset:-8px}.placed-sticker .sticker-sprite{width:100%;height:100%}.sticker-tools{pointer-events:none;transform:rotate(calc(var(--rotation) * -1));position:absolute;inset:0}.sticker-tools button{color:#fff;cursor:pointer;pointer-events:auto;border:3px solid #fff;border-radius:50%;place-items:center;width:38px;height:38px;padding:7px;display:grid;position:absolute;box-shadow:0 3px #2d2b2b38}.sticker-tools svg{fill:none;stroke:currentColor;stroke-width:3px;stroke-linecap:round;width:100%;height:100%}.tool-delete{background:var(--red);top:-24px;left:-24px}.tool-rotate{background:#397ecc;bottom:-24px;right:-24px}.sticker-tray{outline-offset:-13px;border-width:5px;border-color:#fff;border-radius:24px 28px 20px 24px;outline:2px dashed #dfb86f;margin-top:22px;padding:32px 24px 18px;position:relative}.sticker-tray h2{background:var(--red);color:#fff;white-space:nowrap;border:4px solid #fff;border-radius:13px 18px 11px 16px;margin:0;padding:10px 48px;font-size:1.45rem;position:absolute;top:-25px;left:50%;transform:translate(-50%)rotate(-1deg);box-shadow:0 5px #5c361726}.sticker-list{grid-template-columns:repeat(10,minmax(70px,1fr));align-items:center;gap:10px;display:grid}.sticker-choice{cursor:grab;aspect-ratio:1;background:0 0;border:3px solid #0000;border-radius:20px;padding:3px;transition:transform .16s,background .16s,border-color .16s;position:relative}.sticker-choice:hover{transform:translateY(-6px)rotate(-2deg)}.sticker-choice.is-selected{border-color:var(--purple);background:#8b73d714;transform:translateY(-5px)}.choice-check{background:var(--purple);color:#fff;border:3px solid #fff;border-radius:50%;place-items:center;width:28px;height:28px;font-size:.9rem;display:grid;position:absolute;top:-5px;right:-4px;box-shadow:0 2px #2d1a5a33}.sticker-sprite{background-image:url(/assets/stickers.png);background-size:500% 200%;background-position:var(--sprite-x) var(--sprite-y);filter:drop-shadow(0 4px 2px #492d1533);pointer-events:none;background-repeat:no-repeat;width:100%;height:100%;display:block}.celebration{z-index:20;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#25264766;place-items:center;padding:20px;display:grid;position:fixed;inset:0}.celebration-card{background:var(--paper);text-align:center;border:7px solid #fff;border-radius:35px 28px 38px 30px;width:min(440px,92vw);padding:40px 28px 34px;animation:.45s cubic-bezier(.2,1.45,.4,1) popIn;box-shadow:0 16px #462a1529,0 28px 70px #1f192d4d}.celebration-stars{color:var(--yellow);letter-spacing:.2em;font-size:2.3rem}.celebration h2{color:var(--red);margin:8px 0;font-size:3rem}.celebration p{margin:0 0 26px;font-size:1.25rem;font-weight:800}.celebration-card button{background:var(--green);margin:0 auto;font-size:1.2rem}.confetti{pointer-events:none;position:absolute;inset:0;overflow:hidden}.confetti i{--x:calc((var(--i) * 47) % 100);left:calc(var(--x) * 1%);background:hsl(calc(var(--i) * 53deg), 78%, 60%);width:14px;height:28px;animation:confettiFall 2.6s calc(var(--i) * -.08s) linear infinite;transform:rotate(calc(var(--i) * 19deg));border-radius:4px;position:absolute;top:-40px}@keyframes hintFloat{50%{transform:translate(-50%,calc(-50% - 5px))rotate(1deg)}}@keyframes popIn{0%{opacity:0;transform:scale(.55)rotate(-7deg)}}@keyframes confettiFall{to{top:110%;transform:translate(70px)rotate(720deg)}}@media (width<=1100px){.app-shell{padding:14px 16px 22px}.topbar{grid-template-columns:1fr auto;gap:10px 16px;padding-bottom:10px}.scene-tabs{grid-area:2/1/auto/-1}.game-layout{grid-template-columns:190px 1fr;gap:14px}.game-canvas{min-height:340px}.side-panel{padding:18px 14px 16px}.instruction{padding:18px 7px;font-size:1.05rem}.sticker-list{grid-template-columns:repeat(5,1fr);row-gap:3px}.sticker-choice{max-height:110px}}@media (width<=720px){.app-shell{padding:10px 10px 24px}.topbar{grid-template-columns:1fr auto;gap:8px;min-height:74px}h1{padding:10px 14px;font-size:clamp(1.65rem,9vw,2.4rem)}.top-actions{gap:7px}.top-actions button{gap:0;min-height:48px;padding:0 11px;font-size:0}.top-actions svg{width:28px;height:28px}.scene-tabs{justify-content:stretch;gap:4px}.scene-tab{border-width:3px;flex:1;justify-content:center;padding:10px 5px 12px;font-size:.82rem}.scene-tab svg{width:22px;height:22px}.game-layout{flex-direction:column-reverse;gap:10px;display:flex}.game-canvas{border-width:5px;width:100%;min-height:0}.side-panel{grid-template-columns:1fr auto;align-items:center;padding:10px 12px;display:grid}.progress-copy{text-align:left;font-size:1.05rem}.progress-copy strong{font-size:1.85rem}.progress-track{grid-column:1;height:8px;margin:2px 16px 0 0}.instruction{display:none}.edit-actions{grid-area:1/2/span 2;gap:7px;margin:0;display:flex}.edit-actions button{width:54px;min-height:52px;padding:5px;font-size:.68rem}.edit-actions svg{width:21px;height:21px}.sticker-tray{margin-top:32px;padding:24px 12px 10px}.sticker-tray h2{padding:8px 30px;font-size:1.1rem;top:-22px}.sticker-list{grid-template-columns:repeat(5,1fr);gap:1px}.sticker-choice{border-width:2px;border-radius:13px;padding:0}.choice-check{border-width:2px;width:23px;height:23px}.placed-sticker{width:clamp(70px,20vw,105px)}.canvas-hint{white-space:nowrap;padding:8px 12px;font-size:.85rem}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}