:root{color-scheme:light}html,body{margin:0;padding:0;height:100%;background:#fff2df;font-family:Poppins,Nunito,system-ui,sans-serif;overflow:hidden;overscroll-behavior:none}#app{position:fixed;inset:0;height:100dvh;width:100dvw;overflow:hidden;touch-action:none;user-select:none}#app canvas{position:absolute;inset:0;width:100%;height:100%;display:block}.phone{position:absolute;left:50%;bottom:0;width:360px;height:640px;transform-origin:center bottom;pointer-events:none}.phone>*{pointer-events:auto}[hidden],.hidden{display:none!important}.overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;pointer-events:none}.overlay.hidden{display:none}.overlay *{pointer-events:auto}.home-screen{justify-content:flex-start;padding-top:22%;text-align:center}.wordmark{font-family:Poppins,Nunito,system-ui,sans-serif;font-weight:800;font-size:46px;letter-spacing:-.5px;line-height:1;margin:0 0 22px}.wordmark .sky{color:#1b2a4a;-webkit-text-stroke:5px #ffffff;paint-order:stroke fill}.wordmark .hop{color:#ffd166;-webkit-text-stroke:5px #1b2a4a;paint-order:stroke fill;text-shadow:0 4px 0 rgba(27,42,74,.18);margin-left:2px}.tagline-pill{background:#f3fbfe;color:#4d705f;font-weight:700;font-size:13px;padding:10px 20px;border-radius:999px;box-shadow:0 6px 16px #1e140a14;margin-bottom:26px;white-space:nowrap}.best-card{background:#fffbfb;border-radius:18px;box-shadow:0 8px 20px #1e140a1f;padding:10px 26px 12px;margin-bottom:26px;min-width:100px}.best-card .label{font-weight:700;font-size:11px;color:#1b2a4a;margin-bottom:2px}.best-card .value{font-weight:800;font-size:22px;color:#ff7a59}.play-btn{width:96px;height:96px;border-radius:50%;border:none;background:linear-gradient(180deg,#ffd579,#fec15b);box-shadow:0 0 0 14px #fec15b38,0 12px 26px #fea53c73;display:flex;align-items:center;justify-content:center;cursor:pointer}.play-btn svg{width:34px;height:34px;margin-left:4px}.pause-btn{position:absolute;top:22px;right:22px;width:34px;height:34px;border-radius:50%;border:none;background:#fff;box-shadow:0 4px 10px #1e140a2e;display:flex;align-items:center;justify-content:center;cursor:pointer;pointer-events:auto}.pause-btn svg{width:12px;height:12px}.zone-progress{position:absolute;top:92px;left:50%;transform:translate(-50%);display:flex;gap:5px;pointer-events:none}.zone-progress .seg{width:26px;height:6px;border-radius:999px;background:#fff6;overflow:hidden}.zone-progress .seg .fill{height:100%;width:0%;background:#fff;border-radius:999px;transition:width .15s linear}.zone-progress .seg.current .fill{background:#ff7a59}.card-screen{align-items:center;justify-content:center;background:#14141e47;display:flex;opacity:0;pointer-events:none;transition:opacity .28s ease}.card-screen.visible{opacity:1;pointer-events:auto}.card-screen:not(.visible) *{pointer-events:none}.card-screen .card{transform:translateY(12px);transition:transform .28s ease}.card-screen.visible .card{transform:translateY(0)}.card{background:#fff;border-radius:20px;box-shadow:0 16px 40px #140a0547;padding:26px 26px 22px;width:240px;text-align:center}.card h2{font-family:Poppins,Nunito,system-ui,sans-serif;font-weight:700;font-size:21px;color:#ff6f74;margin:0 0 16px;line-height:1.25}.new-best-badge{display:inline-block;font-size:11px;font-weight:700;color:#fff;background:#ff7a59;border-radius:999px;padding:3px 10px;margin-bottom:12px}.stat-row{display:flex;justify-content:space-between;align-items:baseline;padding:8px 0;border-bottom:1px dashed #e7dfd6;font-family:Poppins,Nunito,system-ui,sans-serif}.stat-row:last-of-type{border-bottom:none}.stat-row .label{font-weight:600;font-size:12px;color:#a59e95}.stat-row .value{font-weight:700;font-size:16px;color:#485168}.card-btn{width:100%;border:none;border-radius:999px;padding:13px 0;font-weight:700;font-size:14px;color:#fff;background:linear-gradient(180deg,#ff8b62,#ff7f5c);box-shadow:0 10px 22px #ff7f5c66;margin-top:18px;cursor:pointer}.card-btn.secondary{background:#f3f1ee;color:#485168;box-shadow:none;margin-top:10px}.card-btn.mute{background:#fff;color:#485168;border:1px solid #e7dfd6;box-shadow:none;margin-top:10px}