:root{color-scheme:light;font-family:Inter,ui-rounded,SF Pro Rounded,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background:#efe6f8;--cream: #fff2dd;--peach: #ffd9bb;--ink: #2e334d;--muted: #7f7897;--green: #45cf74}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body,#app{width:100%;height:100%;margin:0;overflow:hidden;overscroll-behavior:none;touch-action:none}body{position:fixed;inset:0;background:radial-gradient(circle at 50% 14%,rgba(255,255,255,.58),transparent 26rem),linear-gradient(180deg,#f4ecfb,#eadff6 58%,#efe5f7)}canvas{display:block;width:100%;height:100%;touch-action:none}#vignette{pointer-events:none;position:fixed;inset:0;background:radial-gradient(circle at 50% 40%,transparent 52%,rgba(154,122,176,.13) 100%),linear-gradient(180deg,rgba(255,255,255,.4),transparent 22%,rgba(255,220,242,.22));mix-blend-mode:multiply}#ui{position:fixed;inset:0;pointer-events:none;color:var(--ink);-webkit-user-select:none;user-select:none}button{font:inherit;color:inherit}.topbar{position:absolute;top:max(12px,env(safe-area-inset-top));left:50%;width:min(94vw,460px);transform:translate(-50%);display:grid;grid-template-columns:1fr auto auto;gap:8px;align-items:center;pointer-events:auto}.level-title{min-width:0;border:1px solid rgba(255,255,255,.76);border-radius:999px;padding:8px 12px;background:#fff8fcc7;box-shadow:0 8px 24px #5b49751f;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.level-title strong,.level-title span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.level-title strong{font-size:13px;line-height:1.1}.level-title span{margin-top:2px;color:var(--muted);font-size:11px}.hud-chip,.icon-btn,.reward-btn,.level-btn,.pill-btn{border:0;box-shadow:0 8px 22px #5f4b7421}.hud-chip{min-width:74px;border-radius:999px;padding:9px 11px;background:#fff9f0e0;font-size:12px;font-weight:750;text-align:center}.icon-btn{width:40px;height:40px;border-radius:50%;background:#ffd0ad;font-size:18px;cursor:pointer}.bottom-ui{position:absolute;left:50%;bottom:max(12px,env(safe-area-inset-bottom));width:min(94vw,460px);transform:translate(-50%);display:grid;gap:8px;pointer-events:auto}.reward-row,.level-row,.quick-row{display:flex;justify-content:center;gap:8px;align-items:center}.reward-btn{position:relative;display:inline-flex;gap:7px;align-items:center;justify-content:center;min-width:132px;height:42px;border-radius:999px;background:linear-gradient(180deg,#55df85,#32be64);color:#113a24;font-size:15px;font-weight:850;cursor:pointer}.play-dot{width:22px;height:22px;border-radius:50%;background:#ffffffb8;position:relative}.play-dot:after{content:"";position:absolute;top:6px;left:8px;border-top:5px solid transparent;border-bottom:5px solid transparent;border-left:8px solid #1a7f45}.level-btn,.pill-btn{min-width:42px;height:36px;border-radius:999px;background:#fff8f0e6;font-size:12px;font-weight:800;cursor:pointer}.level-btn.locked{background:#ded9e3;color:#90899a;cursor:default}.pill-btn{padding:0 13px}.quick-row .pill-btn{background:#ffffffd1}.panel-backdrop{position:absolute;inset:0;display:grid;place-items:center;padding:18px;background:#44305b3d;pointer-events:auto;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.panel-backdrop.hidden,.toast.hidden{display:none}.panel{width:min(92vw,390px);border-radius:24px;padding:22px;background:linear-gradient(180deg,#fff8ee,#ffe8d2);box-shadow:0 24px 70px #372d4740;text-align:center}.panel h2{margin:0 0 8px;font-size:26px;letter-spacing:0}.panel p{margin:8px 0 14px;color:#716a81}.stars{display:flex;justify-content:center;gap:8px;margin:12px 0;min-height:42px}.star{width:40px;height:40px;transform:scale(.9);color:#c8c0ce;font-size:34px;filter:drop-shadow(0 5px 5px rgba(128,92,40,.14))}.star.on{color:#ffc94f;animation:star-pop .52s cubic-bezier(.18,.88,.25,1.24) both}@keyframes star-pop{0%{transform:scale(.2) rotate(-18deg)}70%{transform:scale(1.18) rotate(8deg)}to{transform:scale(1) rotate(0)}}.panel-row,.toggle-row{display:flex;gap:10px;align-items:center;justify-content:center}.toggle-row{justify-content:space-between;margin:14px 0;padding:12px 14px;border-radius:16px;background:#ffffff8c;font-weight:750}.big-btn{min-width:120px;height:44px;border:0;border-radius:999px;background:linear-gradient(180deg,#ff9fca,#ff78b3);color:#451c34;font-weight:850;cursor:pointer}.big-btn.ghost{background:#ffffffad}.big-btn:disabled{opacity:.55;cursor:default}.level-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin:16px 0}.level-cell{aspect-ratio:1;border:0;border-radius:14px;background:#fff5e8;color:#332c47;font-weight:900;box-shadow:inset 0 -2px #7a5d771c;cursor:pointer}.level-cell.locked{background:#ded9e3;color:#8e8897;cursor:default}.level-cell small{display:block;margin-top:2px;color:#8f8299;font-size:10px}.toast{position:absolute;left:50%;bottom:calc(max(12px,env(safe-area-inset-bottom)) + 164px);transform:translate(-50%);max-width:min(86vw,360px);border-radius:999px;padding:10px 15px;background:#322d48e0;color:#fff;font-size:13px;font-weight:750;text-align:center;pointer-events:none}@media(max-height:720px){.bottom-ui{gap:6px}.quick-row .pill-btn:nth-child(3){display:none}.reward-btn{height:38px}.level-row{gap:5px}.level-btn{min-width:36px;height:32px}}