@font-face{font-family:Poppins;src:url(./Poppins-Medium-Cxde2ZoM.ttf)format("truetype");font-weight:500 700;font-display:swap}:root{--inset-top:env(safe-area-inset-top,0px);--inset-right:env(safe-area-inset-right,0px);--inset-bottom:env(safe-area-inset-bottom,0px);--inset-left:env(safe-area-inset-left,0px);--bg-top:#2f6f69;--bg-bottom:#173a3a;--yellow:#fffc00;--yellow-press:#e8e400;--green:#4ade3a;--ink:#111;--pill-bg:#141418d1;--pill-ink:#fff;--disabled-bg:#ffffffd1;--disabled-ink:#11111159;--night:#0b1530;--font:"Poppins", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif}*{box-sizing:border-box}html,body{background:var(--bg-bottom);touch-action:none;overscroll-behavior:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;width:100%;height:100%;font-family:var(--font);color:#fff;margin:0;overflow:hidden}#bg{background:linear-gradient(180deg, var(--bg-top) 0%, var(--bg-top) 55%, var(--bg-bottom) 100%);transition:background .6s;position:fixed;top:0;bottom:0;left:0;right:0}#app{width:100%;height:100%;display:block;position:fixed;top:0;bottom:0;left:0;right:0}.hud{pointer-events:none;position:fixed;top:0;bottom:0;left:0;right:0}.hud button{pointer-events:auto}.room-title{white-space:nowrap;transform-origin:0 100%;text-shadow:0 2px 8px #00000040;opacity:0;font-size:clamp(20px,6.2vw,30px);font-style:italic;font-weight:600;transition:opacity .3s;position:absolute;top:0;left:0}.room-title.show{opacity:1}.progress{top:calc(var(--inset-top) + 12px);right:calc(var(--inset-right) + 16px);background:#00000038;border-radius:999px;align-items:center;gap:8px;padding:10px 12px;font-size:14px;font-weight:600;display:flex;position:absolute}.progress-track{background:#ffffff40;border-radius:999px;width:clamp(48px,16vw,120px);height:8px;overflow:hidden}.progress-fill{border-radius:inherit;background:var(--yellow);width:5%;height:100%;transition:width .4s cubic-bezier(.34,1.56,.64,1)}.progress-label{text-align:right;font-variant-numeric:tabular-nums;min-width:2.6em}.hints{left:0;right:0;bottom:calc(var(--inset-bottom) + 150px);justify-items:center;display:grid;position:absolute}.hint{background:var(--pill-bg);color:var(--pill-ink);opacity:0;border-radius:999px;grid-area:1/1;padding:7px 14px;font-size:13px;transition:transform .35s,opacity .35s;transform:translateY(8px)}.hint.show{opacity:1;transform:none}.toast{left:50%;bottom:calc(var(--inset-bottom) + 150px);background:var(--pill-bg);width:max-content;max-width:calc(100% - 32px);color:var(--pill-ink);text-align:center;opacity:0;border-radius:16px;padding:9px 16px;font-size:14px;transition:opacity .3s,transform .3s;position:absolute;transform:translate(-50%,8px)}.toast.show{opacity:1;transform:translate(-50%)}.avatar{left:calc(var(--inset-left) + 4px);aspect-ratio:1/1.05;pointer-events:none;width:min(42vw,200px);position:absolute;bottom:0}.avatar img{filter:drop-shadow(0 4px 10px #00000040);width:92%;display:none;position:absolute;bottom:24%;left:4%}.avatar.has-bitmoji img{display:block}.avatar .box{left:0;bottom:calc(var(--inset-bottom) + 6px);filter:drop-shadow(0 6px 10px #0000004d);width:100%;animation:2.4s ease-in-out infinite bob;position:absolute}@keyframes bob{50%{transform:translateY(-4px)rotate(-1deg)}}.controls{right:calc(var(--inset-right) + 16px);bottom:calc(var(--inset-bottom) + 20px);flex-direction:column;align-items:flex-end;gap:12px;display:flex;position:absolute}.controls .row{align-items:center;gap:12px;display:flex}.btn{font:inherit;color:var(--ink);background:var(--yellow);cursor:pointer;border:0;margin:0;font-weight:600;transition:transform .12s,background .2s,opacity .2s;box-shadow:0 4px #0000002e,0 6px 16px #0003}.btn:active:not(:disabled){background:var(--yellow-press);transform:translateY(2px)scale(.96)}.btn:disabled{background:var(--disabled-bg);color:var(--disabled-ink);box-shadow:none;cursor:default}.btn.pill{border-radius:999px;min-width:132px;height:48px;padding:0 22px;font-size:17px}.btn.round{border-radius:50%;place-items:center;width:48px;height:48px;display:grid}.btn[hidden]{display:none}.btn.round svg{width:26px;height:26px;fill:var(--ink)}.btn.flash{background:var(--green)}.btn.pop{animation:.35s pop}@keyframes pop{40%{transform:scale(1.12)}}.mode-switch{top:calc(var(--inset-top) + 12px);left:calc(var(--inset-left) + 16px);background:#00000038;border-radius:999px;padding:4px;display:flex;position:absolute}.mode-switch button{color:#fff;font:inherit;white-space:nowrap;cursor:pointer;background:0 0;border:0;border-radius:999px;margin:0;padding:7px 10px;font-size:12.5px;font-weight:600;transition:background .2s,color .2s}.mode-switch button[aria-selected=true]{background:var(--yellow);color:var(--ink)}.btn.add{left:calc(var(--inset-left) + 16px);bottom:calc(var(--inset-bottom) + 20px);justify-content:center;align-items:center;gap:6px;min-width:0;padding:0 20px 0 14px;display:none;position:absolute}.btn.add svg{width:22px;height:22px;fill:var(--ink)}.design-mode .btn.add{display:flex}.design-mode .progress,.design-mode .avatar,.design-mode .hints,.design-mode #btnShuffle{display:none}.btn.round.danger{background:#ffd9d4}.btn.round.danger svg{fill:#b4232c}.catalog{--panel:#fbf7f0;--panel-ink:#3b302b;--panel-muted:#8a7a70;--tile:#fff;--tile-empty:#f1ebe3;left:0;top:calc(var(--inset-top) + 60px);bottom:calc(var(--inset-bottom) + 12px);background:var(--panel);width:min(78vw,380px);color:var(--panel-ink);border-radius:0 22px 22px 0;flex-direction:column;transition:transform .3s cubic-bezier(.2,.8,.2,1);display:flex;position:fixed;transform:translate(-105%);box-shadow:0 10px 40px #00000059}.catalog.open{transform:none}.catalog-header{padding:14px 12px 6px calc(var(--inset-left) + 16px);justify-content:space-between;align-items:center;display:flex}.catalog-header h2{margin:0;font-size:18px;font-weight:600}.catalog-close{background:var(--tile-empty);cursor:pointer;border:0;border-radius:50%;place-items:center;width:36px;height:36px;display:grid}.catalog-close svg{width:20px;height:20px;fill:var(--panel-ink)}.catalog-body{overscroll-behavior:contain;touch-action:pan-y;padding:0 12px 16px calc(var(--inset-left) + 12px);flex:1;overflow-y:auto}.cat-head{letter-spacing:.06em;text-transform:uppercase;color:var(--panel-muted);align-items:center;gap:10px;margin:14px 0 8px;font-size:12px;font-weight:600;display:flex}.cat-head:after{content:"";background:#3b302b24;flex:1;height:1px}.cat-grid{grid-template-columns:repeat(auto-fill,minmax(max(76px,25% - 6px),1fr));gap:8px;display:grid}.cat-tile{background:var(--tile);color:var(--panel-ink);font:inherit;cursor:pointer;border:0;border-radius:14px;flex-direction:column;align-items:center;gap:4px;margin:0;padding:6px 6px 8px;transition:transform .12s;display:flex;box-shadow:0 1px 3px #00000014}.cat-tile:active{transform:scale(.95)}.cat-tile canvas{aspect-ratio:1;background:var(--tile-empty);border-radius:10px;width:100%;transition:background .3s}.cat-tile.ready canvas{background:0 0}.cat-tile span{text-align:center;-webkit-line-clamp:2;-webkit-box-orient:vertical;font-size:11.5px;line-height:1.2;display:-webkit-box;overflow:hidden}#night{background:var(--night);opacity:0;pointer-events:none;position:fixed;top:0;bottom:0;left:0;right:0}#loading{background:var(--bg-bottom);place-items:center;transition:opacity .4s;display:grid;position:fixed;top:0;bottom:0;left:0;right:0}#loading.done{opacity:0;pointer-events:none}.spinner{border:4px solid #fff3;border-top-color:var(--yellow);border-radius:50%;width:40px;height:40px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion:reduce){.avatar .box,.spinner{animation:none}}
