:root{--bg: #f5f3ee;--surface: #ffffff;--surface2: #ebe7dd;--text: #2b2f36;--muted: #8d8778;--accent: #2f7d8c;--accent-soft: #e0edf1;--accent-ink: #ffffff;--danger: #b3372f;--radius: 20px;--shadow: 0 2px 14px rgba(60, 70, 90, .08);--ring: 0 0 0 2px var(--accent);--card-border: rgba(47, 125, 140, .14);--glow: 0 8px 28px rgba(47, 125, 140, .18)}[data-theme=dark]{--bg: #141824;--surface: rgba(26, 33, 43, .78);--surface2: #242e3d;--text: #edeae3;--muted: #99a1b0;--accent: #8fd8e8;--accent-soft: #1c3038;--accent-ink: #0e1418;--shadow: 0 10px 34px rgba(0, 0, 0, .42);--ring: 0 0 0 2px var(--accent);--card-border: rgba(143, 216, 232, .18);--glow: 0 10px 48px rgba(143, 216, 232, .38)}@media(prefers-color-scheme:dark){:root:not([data-theme=light]){--bg: #141824;--surface: rgba(26, 33, 43, .78);--surface2: #242e3d;--text: #edeae3;--muted: #99a1b0;--accent: #8fd8e8;--accent-soft: #1c3038;--accent-ink: #0e1418;--shadow: 0 10px 34px rgba(0, 0, 0, .42);--ring: 0 0 0 2px var(--accent);--card-border: rgba(143, 216, 232, .18);--glow: 0 10px 48px rgba(143, 216, 232, .38)}}*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{margin:0;color:var(--text);font-family:Nunito,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;-webkit-tap-highlight-color:transparent;background:radial-gradient(720px 420px at 15% -6%,rgba(143,216,232,.12),transparent 62%),radial-gradient(680px 400px at 85% 8%,rgba(120,200,225,.1),transparent 62%),radial-gradient(900px 500px at 50% 110%,rgba(143,216,232,.06),transparent 60%),var(--bg);background-attachment:fixed;min-height:100svh}[data-theme=light] body{background:radial-gradient(560px 340px at 12% -4%,rgba(47,125,140,.08),transparent 60%),var(--bg);background-attachment:fixed}#app{max-width:720px;margin:0 auto;padding:20px 18px 120px;position:relative;z-index:1}#ambient{position:fixed;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;opacity:.8}header.top{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:6px 2px 0}.brand{display:flex;align-items:center;gap:13px}.brand .logo{width:54px;height:54px;border-radius:18px;flex:none;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 20px #8fd8e859,var(--shadow);overflow:hidden}.brand .logo img{width:54px;height:54px;display:block}.brand h1{font-size:33px;margin:0;font-weight:900;letter-spacing:-.01em;line-height:1.05;background:linear-gradient(120deg,#fff 20%,var(--accent) 50%,#fff 80%);background-size:220% auto;-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 12px rgba(143,216,232,.35))}.brand p{margin:3px 0 0;color:var(--muted);font-size:11.5px;font-weight:600;text-align:left;white-space:nowrap}.controls{display:flex;gap:8px;align-items:center}.iconbtn{width:44px;height:44px;border-radius:50%;border:1px solid var(--card-border);background:var(--surface);color:var(--text);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:var(--shadow);padding:0;font-family:inherit;transition:transform .15s,border-color .2s}.iconbtn:hover{transform:translateY(-1px);border-color:var(--accent)}.iconbtn svg{width:20px;height:20px}.pill{border:1px solid var(--card-border);background:var(--surface);color:var(--text);border-radius:999px;padding:10px 15px;font-size:14px;font-weight:800;font-family:inherit;cursor:pointer;box-shadow:var(--shadow);min-height:44px;transition:border-color .2s,transform .15s}.pill:hover{border-color:var(--accent)}.pill:active{transform:scale(.96)}.honest{display:inline-flex;align-items:center;gap:8px;color:var(--accent);font-weight:800;font-size:13px;letter-spacing:.06em;margin:20px 0 2px}.honest:before{content:"";width:8px;height:8px;border-radius:50%;background:var(--accent);animation:pulse 2.4s infinite}@keyframes pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.45;transform:scale(.8)}}.hint{text-align:center;color:var(--muted);font-size:14px;margin:26px 0 0;font-weight:600}.master-wrap{display:flex;justify-content:center;margin:22px 0 4px}.masterbtn{width:84px;height:84px;border-radius:50%;border:none;background:linear-gradient(150deg,#a5e3f2,var(--accent) 55%,#7cc3d3);color:var(--accent-ink);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:var(--glow),0 6px 22px #00000040;transition:transform .15s;position:relative;font-family:inherit}[data-theme=light] .masterbtn{background:linear-gradient(150deg,#2f7d8c,#3d93a3)}.masterbtn:active{transform:scale(.93)}.masterbtn svg{width:34px;height:34px}.masterbtn.is-playing:after{content:"";position:absolute;inset:-7px;border-radius:50%;border:2px solid var(--accent);opacity:.7;animation:ringpulse 2s ease-out infinite}@keyframes ringpulse{0%{transform:scale(.86);opacity:.8}to{transform:scale(1.12);opacity:0}}.nowplaying{text-align:center;color:var(--muted);font-size:13.5px;font-weight:700;margin:10px 0 0;display:flex;align-items:center;justify-content:center;gap:8px;min-height:20px}.nowplaying .np-dot{width:7px;height:7px;border-radius:50%;background:var(--accent);animation:pulse 1.6s infinite;flex:none}h2{font-size:12.5px;text-transform:uppercase;letter-spacing:2px;color:var(--muted);margin:38px 0 14px;font-weight:900;display:flex;align-items:center;gap:10px}h2:before{content:"";width:22px;height:3px;border-radius:2px;background:var(--accent);flex:none}.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}@media(min-width:560px){.grid{grid-template-columns:repeat(3,1fr)}}.tile{background:var(--surface);border:1px solid var(--card-border);border-radius:var(--radius);padding:20px 14px 14px;box-shadow:var(--shadow);cursor:pointer;user-select:none;transition:border-color .2s,box-shadow .2s,transform .15s;min-height:188px;display:flex;flex-direction:column;justify-content:space-between;align-items:stretch;text-align:center;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.tile:hover{transform:translateY(-3px)}.tile:active{transform:scale(.98)}.tile-top{display:flex;flex-direction:column;align-items:center}.medal{width:58px;height:58px;border-radius:18px;background:var(--accent-soft);color:var(--accent);display:inline-flex;align-items:center;justify-content:center;margin-bottom:10px;position:relative;flex:none;transition:background .2s,color .2s,transform .2s,box-shadow .2s}.medal svg{width:28px;height:28px}.medal.sm{width:48px;height:48px;margin-bottom:0;border-radius:15px}.medal.sm svg{width:24px;height:24px}.lockbadge{position:absolute;right:-6px;bottom:-6px;width:24px;height:24px;border-radius:50%;background:var(--accent);color:var(--accent-ink);display:inline-flex;align-items:center;justify-content:center;border:2px solid var(--bg)}.lockbadge svg{width:12px;height:12px}.tile .name{font-weight:800;font-size:15px;letter-spacing:.01em}.tile .lockrow{font-size:12px;color:var(--muted);margin-top:4px;font-weight:700}.tile.active{border-color:var(--accent);box-shadow:var(--shadow),0 0 0 1.5px var(--accent),var(--glow)}.tile.active .medal{background:var(--accent);color:var(--accent-ink);box-shadow:var(--glow)}.tile.locked .medal{background:var(--surface2);color:var(--muted)}.tile.unavailable{opacity:.45}.tile input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:26px;background:transparent;cursor:pointer;margin:10px 0 0}.tile input[type=range]::-webkit-slider-runnable-track{height:6px;border-radius:99px;background:var(--surface2)}.tile input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:20px;height:20px;border-radius:50%;background:var(--accent);margin-top:-7px;border:3px solid var(--bg);box-shadow:0 0 0 1.5px var(--accent),0 2px 8px #0000004d}.tile input[type=range]::-moz-range-track{height:6px;border-radius:99px;background:var(--surface2)}.tile input[type=range]::-moz-range-thumb{width:14px;height:14px;border-radius:50%;background:var(--accent);border:3px solid var(--bg);box-shadow:0 0 0 1.5px var(--accent)}.tile input[type=range]:disabled{opacity:.3}.pack-card{background:var(--surface);border:1px solid var(--card-border);border-radius:var(--radius);padding:14px 16px 14px 14px;box-shadow:var(--shadow);margin-bottom:12px;display:flex;align-items:center;justify-content:space-between;gap:12px;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);transition:transform .15s,border-color .2s}.pack-card:hover{transform:translateY(-2px);border-color:var(--accent)}.pack-card .pinfo{display:flex;gap:14px;align-items:center;min-width:0}.pack-art{width:64px;height:64px;border-radius:16px;overflow:hidden;flex:none;border:1px solid var(--card-border)}.pack-art svg{width:100%;height:100%;display:block}.pack-card .pname{font-weight:900;font-size:16px;display:flex;align-items:center;gap:8px}.pack-card .pdesc{color:var(--muted);font-size:13px;margin-top:3px;font-weight:600}.checkbadge{display:inline-flex;width:22px;height:22px;border-radius:50%;background:var(--accent);color:var(--accent-ink);align-items:center;justify-content:center;flex:none}.checkbadge svg{width:13px;height:13px}.btn{background:linear-gradient(150deg,var(--accent),var(--accent) 70%,#a8dbe8);color:var(--accent-ink);border:none;border-radius:999px;padding:13px 22px;font-size:15px;font-weight:800;font-family:inherit;cursor:pointer;white-space:nowrap;transition:transform .15s,box-shadow .2s;box-shadow:0 4px 16px #0000002e}[data-theme=light] .btn{background:linear-gradient(150deg,#2f7d8c,#3d93a3)}.btn:hover{transform:translateY(-1px)}.btn:active{transform:scale(.97)}.btn.ghost{background:var(--surface2);color:var(--text);box-shadow:none}.btn.small{padding:10px 16px;font-size:14px}.timer{background:var(--surface);border:1px solid var(--card-border);border-radius:var(--radius);padding:18px;box-shadow:var(--shadow);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.timer .row{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:10px}.timer .row.presets{flex-wrap:nowrap}.timer .row.presets .pill{flex:1 1 0;padding:10px 6px;font-size:13px;text-align:center;white-space:nowrap}.timer .row.customrow{justify-content:center}.timer .row:last-child{margin-bottom:0}.timer .tcount{display:inline-flex;align-items:center;gap:8px;color:var(--muted);font-weight:700}.timer .tcount svg{width:20px;height:20px}.timer .count{font-variant-numeric:tabular-nums;font-weight:900;font-size:20px;color:var(--text)}.timer input[type=number]{width:140px;padding:10px;border-radius:12px;border:1px solid var(--card-border);background:var(--bg);color:var(--text);font-family:inherit;font-size:15px;font-weight:700;text-align:center}.mixrow{display:flex;gap:8px;margin-bottom:10px;flex-wrap:wrap}.mixrow input{flex:1;min-width:140px;padding:12px 16px;border-radius:14px;border:1px solid var(--card-border);background:var(--surface);color:var(--text);font-family:inherit;font-size:15px;font-weight:600}.mixrow input:focus{outline:none;border-color:var(--accent);box-shadow:var(--ring)}.mixitem{display:flex;align-items:center;justify-content:space-between;background:var(--surface);border:1px solid var(--card-border);border-radius:14px;padding:12px 8px 12px 16px;margin-bottom:8px;box-shadow:var(--shadow)}.mixitem .mname{font-weight:800}.mixitem .mactions{display:flex;gap:4px}.linkbtn{background:none;border:none;color:var(--accent);font-weight:800;cursor:pointer;font-size:14px;padding:8px 10px;font-family:inherit;border-radius:10px;transition:background .15s}.linkbtn:hover{background:var(--accent-soft)}.linkbtn.danger{color:var(--danger)}.overlay{position:fixed;inset:0;background:#080c129e;display:flex;align-items:flex-end;justify-content:center;z-index:50;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);animation:fadein .25s ease}@keyframes fadein{0%{opacity:0}}@media(min-width:560px){.overlay{align-items:center;padding:20px}}.sheet{background:var(--bg);border:1px solid var(--card-border);border-radius:26px 26px 0 0;padding:26px 20px 22px;width:100%;max-width:560px;max-height:88vh;overflow:auto;position:relative;animation:sheetup .32s cubic-bezier(.2,.9,.3,1.1)}@keyframes sheetup{0%{transform:translateY(40px);opacity:0}}@media(min-width:560px){.sheet{border-radius:26px}}.sheet h2{margin:4px 40px 6px 0;font-size:22px;text-transform:none;letter-spacing:0;color:var(--text)}.sheet h2:before{display:none}.sheet-close{position:absolute;top:16px;right:16px}.offer{background:var(--surface);border:1px solid var(--card-border);border-radius:20px;padding:0;margin-bottom:14px;box-shadow:var(--shadow);overflow:hidden;position:relative}.offer.hero{border:1.5px solid var(--accent);box-shadow:var(--glow)}.offer-art{height:86px;position:relative;overflow:hidden}.offer-art svg{width:100%;height:100%;display:block}.offer-body{padding:16px 18px 18px}.offer .otitle{font-weight:900;font-size:17px;display:flex;justify-content:space-between;align-items:center;gap:8px}.offer .otitle-l{display:inline-flex;align-items:center;gap:12px}.offer .odesc{color:var(--muted);font-size:14px;margin:8px 0 14px;font-weight:600;line-height:1.55}.offer .btn{width:100%}.tag{background:var(--accent);color:var(--accent-ink);font-size:11.5px;font-weight:900;letter-spacing:.06em;text-transform:uppercase;border-radius:999px;padding:6px 13px;white-space:nowrap}.ad-slot{margin:28px 0;padding:20px;text-align:center;font-size:12px;color:var(--muted);border:1px dashed var(--muted);border-radius:var(--radius);font-weight:600}footer{margin-top:40px;color:var(--muted);font-size:13px;text-align:center;line-height:1.7;font-weight:600}.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%);background:var(--text);color:var(--bg);padding:13px 22px;border-radius:999px;font-size:14px;font-weight:700;z-index:99;box-shadow:var(--shadow);max-width:90vw;text-align:center;animation:sheetup .25s ease}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:1ms!important;transition-duration:1ms!important}#ambient{display:none}}