:root{color-scheme:dark;--bg:#090a12;--panel:#11131f;--soft:#191c2b;--text:#f6f3ff;--muted:#a7a8b5;--accent:#9b7cff;--accent2:#6ee7d8;--line:hsla(0,0%,100%,.08)}*{box-sizing:border-box}html{background:var(--bg);scroll-behavior:smooth}body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background:radial-gradient(circle at 80% 0,rgba(155,124,255,.18),transparent 28rem),var(--bg);color:var(--text);padding-bottom:110px}button,input,textarea{font:inherit}.shell{max-width:1180px;margin:auto;padding:32px 18px 60px}.hero{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;padding:16px 0 32px}.eyebrow{font-size:.75rem;letter-spacing:.18em;color:var(--accent2);font-weight:800}.hero h1{font-size:clamp(2.2rem,6vw,4.8rem);line-height:.95;letter-spacing:-.05em;max-width:850px;margin:12px 0 16px}.hero p{max-width:660px;color:var(--muted);font-size:1.02rem;line-height:1.65}.playButton{border:1px solid var(--line);background:var(--text);color:#12131b;border-radius:999px;padding:14px 22px;font-weight:800;font-size:.95rem;white-space:nowrap;cursor:pointer;display:flex;align-items:center;gap:8px;transition:transform .15s ease,background .2s ease;flex-shrink:0}.playButton:hover{transform:scale(1.02)}.playButton.playing{background:var(--accent2);color:#090a12}.navBar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;background:rgba(17,19,31,.75);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid var(--line);border-radius:16px;padding:8px 12px;margin-bottom:28px;overflow:visible}.navLink{color:var(--muted);text-decoration:none;font-size:.82rem;font-weight:600;padding:6px 12px;border-radius:999px;transition:.15s ease;white-space:nowrap}.navLink:hover{color:var(--text);background:hsla(0,0%,100%,.08)}section{margin-bottom:32px;scroll-margin-top:20px}.sectionTitle{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px;flex-wrap:wrap}.sectionTitle>div:first-child{display:flex;align-items:center;gap:10px;min-width:0}.sectionTitle span{color:var(--accent);font-size:.72rem;font-weight:900;letter-spacing:.12em}.sectionTitle h2{margin:0;font-size:1.22rem;white-space:nowrap}.sectionTitle small{color:var(--muted);font-size:.82rem}.btnActionGroup{gap:8px;flex-shrink:0}.btnAction,.btnActionGroup{display:inline-flex;align-items:center}.btnAction{padding:6px 13px;font-size:.8rem;font-weight:600;border-radius:999px;gap:5px;white-space:nowrap;cursor:pointer;line-height:1.2;transition:all .15s ease}.btnAction.share{background:rgba(110,231,216,.12);border:1px solid rgba(110,231,216,.35);color:var(--accent2)}.btnAction.share:hover{background:rgba(110,231,216,.24);border-color:var(--accent2);transform:translateY(-1px)}.btnAction.reset{background:hsla(0,0%,100%,.05);border:1px solid var(--line);color:var(--muted)}.btnAction.reset:hover{background:hsla(0,0%,100%,.1);color:var(--text);border-color:hsla(0,0%,100%,.18);transform:translateY(-1px)}.scenarioGrid{display:grid;grid-template-columns:repeat(3,1fr);grid-gap:14px;gap:14px}.scenarioCard{min-height:165px;text-align:left;padding:18px;border:1px solid var(--line);border-radius:18px;background:rgba(17,19,31,.8);color:var(--text);cursor:pointer;transition:transform .2s ease,border-color .2s ease,background .2s ease;display:flex;flex-direction:column;position:relative}.scenarioCard.active,.scenarioCard:hover{transform:translateY(-3px);border-color:rgba(155,124,255,.7);background:linear-gradient(145deg,rgba(155,124,255,.15),rgba(17,19,31,.9))}.scenarioCard.active{box-shadow:0 0 20px rgba(155,124,255,.2)}.scenarioTop{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}.scenarioEmoji{font-size:2rem;display:block}.scenarioPlayBadge{font-size:.74rem;font-weight:700;padding:4px 10px;border-radius:999px;background:hsla(0,0%,100%,.08);color:var(--muted);transition:.15s ease;white-space:nowrap}.scenarioCard.active .scenarioPlayBadge,.scenarioCard:hover .scenarioPlayBadge{background:var(--accent2);color:#090a12}.scenarioPlayBadge.playing{background:hsla(0,100%,74%,.22);color:#ff9a9a;border:1px solid hsla(0,100%,74%,.35)}.scenarioCard.active .scenarioPlayBadge.playing,.scenarioCard:hover .scenarioPlayBadge.playing{background:#ff5252;color:#fff}.scenarioName{display:block;font-weight:800;font-size:1.02rem;margin-bottom:5px}.scenarioCard small{color:var(--muted);line-height:1.45;font-size:.85rem}.panel{background:rgba(17,19,31,.86);border:1px solid var(--line);border-radius:22px;padding:22px}.filterRow{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:18px;overflow:visible}.filterBtn{border:1px solid var(--line);background:rgba(25,28,43,.65);color:var(--muted);border-radius:999px;padding:6px 14px;font-size:.82rem;font-weight:600;cursor:pointer;transition:.15s ease;white-space:nowrap}.filterBtn.active,.filterBtn:hover{background:var(--accent);color:#fff;border-color:var(--accent)}.mixerGrid{display:grid;grid-template-columns:repeat(3,1fr);grid-gap:14px 18px;gap:14px 18px}.soundControl{background:rgba(12,14,23,.65);border:1px solid var(--line);border-radius:14px;padding:12px 14px;display:flex;flex-direction:column;gap:8px;transition:border-color .15s ease}.soundControl.activeSound{border-color:rgba(155,124,255,.45);background:rgba(155,124,255,.08)}.soundControlHeader{justify-content:space-between}.soundControlHeader,.soundControlTitle{display:flex;align-items:center;gap:8px}.soundControlTitle{min-width:0}.soundControlTitle b{font-size:.9rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.soundToggleBtn{width:26px;height:26px;border-radius:50%;border:1px solid var(--line);background:hsla(0,0%,100%,.06);color:var(--muted);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0;font-size:.68rem;transition:all .15s ease;padding:0}.soundToggleBtn:hover{background:hsla(0,0%,100%,.16);color:var(--text);transform:scale(1.1)}.soundToggleBtn.active{background:var(--accent2);color:#090a12;border-color:var(--accent2);box-shadow:0 0 10px rgba(110,231,216,.45)}.soundToggleBtn.active:hover{background:#ff7676;color:#fff;border-color:#ff7676;box-shadow:0 0 10px hsla(0,100%,73%,.45)}.soundControl output{color:var(--accent2);font-weight:700;font-size:.88rem;font-feature-settings:"tnum";font-variant-numeric:tabular-nums;flex-shrink:0}.soundControl input[type=range]{width:100%;accent-color:var(--accent);cursor:pointer;height:5px}.ghost,.primary,.shareBtn{border-radius:12px;padding:8px 16px;font-size:.86rem;cursor:pointer;display:inline-flex;align-items:center;gap:6px;white-space:nowrap;transition:.15s ease}.ghost{background:transparent;color:var(--text);border:1px solid var(--line)}.ghost:hover{background:hsla(0,0%,100%,.06)}.shareBtn{background:rgba(110,231,216,.12);border:1px solid rgba(110,231,216,.35);color:var(--accent2);font-weight:700}.shareBtn:hover{background:rgba(110,231,216,.22)}.primary{border:0;background:var(--accent);color:#fff;font-weight:700}.primary:hover{opacity:.92;transform:translateY(-1px)}.primary:disabled{opacity:.45;cursor:not-allowed;transform:none}.twoColumns{display:grid;grid-template-columns:1fr 1fr;grid-gap:18px;gap:18px}.panel p{color:var(--muted);line-height:1.55}.promptChips{display:flex;gap:7px;flex-wrap:wrap;margin:8px 0 12px;overflow:visible}.chip{background:rgba(155,124,255,.08);border:1px solid rgba(155,124,255,.22);color:var(--text);border-radius:999px;padding:5px 12px;font-size:.8rem;cursor:pointer;transition:.15s ease;white-space:nowrap}.chip:hover{background:rgba(155,124,255,.22);border-color:var(--accent)}.promptPanel textarea{width:100%;min-height:100px;resize:vertical;background:#0c0e17;border:1px solid var(--line);border-radius:14px;color:var(--text);padding:12px;margin:6px 0 10px;font-size:.95rem}.inlineControl,.saveRow{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.inlineControl input,.saveRow input{background:#0c0e17;border:1px solid var(--line);border-radius:12px;color:var(--text);padding:9px 12px;font-size:.92rem}.inlineControl input[type=number]{width:85px}.switchLabel{color:var(--muted);font-size:.88rem}.countdown{font-size:2.5rem;font-weight:900;letter-spacing:-.05em;margin-top:14px;font-feature-settings:"tnum";font-variant-numeric:tabular-nums}.live{color:var(--accent2)!important}.banner{padding:12px 16px;border-radius:12px;font-size:.88rem;line-height:1.45;display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:20px}.banner.info{background:rgba(110,231,216,.12);border:1px solid rgba(110,231,216,.3);color:#bdf8f1}.banner.warning{background:rgba(255,190,92,.1);border:1px solid rgba(255,190,92,.3);color:#e8c98b}.saveRow input{flex:1 1;min-width:150px}.presetList{margin-top:12px;display:grid;grid-gap:8px;gap:8px}.preset{display:flex;background:#0c0e17;border:1px solid var(--line);border-radius:12px;overflow:hidden;align-items:center}.preset button{border:0;background:transparent;color:var(--text);padding:9px 12px;text-align:left;cursor:pointer;font-size:.86rem}.preset .presetLoad{flex:1 1;display:flex;align-items:center;gap:8px}.preset .presetShare{color:var(--accent2);font-size:.82rem;font-weight:600}.preset .delete{color:#ff9a9a;font-size:1.1rem}.bottomPlayer{position:fixed;bottom:0;left:0;right:0;z-index:99;background:rgba(12,14,23,.94);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-top:1px solid hsla(0,0%,100%,.12);box-shadow:0 -8px 32px rgba(0,0,0,.65);padding:9px 16px;transition:transform .2s ease}.bottomPlayerInner{max-width:1180px;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:14px}.bottomPlayerLeft{display:flex;align-items:center;gap:12px;min-width:0;flex:1 1}.statusDot{width:10px;height:10px;border-radius:50%;background:#474a5e;flex-shrink:0;transition:background .2s ease,box-shadow .2s ease}.statusDot.active{background:var(--accent2);box-shadow:0 0 12px var(--accent2);animation:pulseDot 2s ease-in-out infinite}.bottomPlayerText{min-width:0}.bottomPlayerTitle{font-weight:800;font-size:.94rem;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.bottomPlayerMeta{font-size:.76rem;color:var(--muted);display:flex;align-items:center;gap:8px;white-space:nowrap}.bottomPlayerMeta .timerTag{color:var(--accent2);font-weight:700}.bottomPlayerCenter{display:flex;align-items:center;gap:10px;flex-shrink:0}.bottomPlayBtn{background:var(--accent2);color:#090a12;border:0;border-radius:999px;padding:8px 20px;font-weight:800;font-size:.9rem;cursor:pointer;display:inline-flex;align-items:center;gap:7px;box-shadow:0 2px 14px rgba(110,231,216,.25);transition:transform .15s ease,background .15s ease}.bottomPlayBtn:hover{transform:scale(1.03)}.bottomPlayBtn.paused{background:var(--text);color:#090a12;box-shadow:none}.bottomPlayerRight{display:flex;align-items:center;gap:8px;flex-shrink:0}.bottomNavBtn{background:hsla(0,0%,100%,.05);border:1px solid var(--line);color:var(--muted);border-radius:999px;padding:6px 12px;font-size:.78rem;font-weight:600;cursor:pointer;text-decoration:none;transition:.15s ease;white-space:nowrap}.bottomNavBtn:hover{color:var(--text);background:hsla(0,0%,100%,.1)}footer{border-top:1px solid var(--line);margin-top:48px;padding-top:20px;display:flex;justify-content:space-between;color:var(--muted);font-size:.82rem}footer b{color:var(--text)}@media (max-width:980px){.mixerGrid,.scenarioGrid{grid-template-columns:repeat(2,1fr)}}@media (max-width:800px){.hero{align-items:flex-start;flex-direction:column;padding-bottom:20px}.twoColumns{grid-template-columns:1fr}.hero h1{font-size:2.8rem}.bottomPlayerRight .bottomNavBtn{display:none}}@media (max-width:580px){.shell{padding:16px 12px 36px}.mixerGrid,.scenarioGrid{grid-template-columns:1fr}.scenarioCard{min-height:130px;padding:15px}.hero h1{font-size:2.2rem}.hero p{font-size:.94rem}.panel{padding:16px 12px}.filterBtn{padding:5px 11px;font-size:.78rem}.btnAction{padding:5px 10px;font-size:.76rem}.bottomPlayer{padding:7px 10px}.bottomPlayBtn{padding:8px 16px}.bottomPlayBtn,.bottomPlayerTitle{font-size:.85rem}footer{flex-direction:column;gap:8px}}.iosInstallBanner{background:linear-gradient(135deg,rgba(155,124,255,.15),rgba(110,231,216,.12));border:1px solid rgba(155,124,255,.35);border-radius:16px;padding:14px 18px;margin-bottom:24px;display:flex;align-items:center;justify-content:space-between;gap:16px;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);animation:bannerFadeIn .3s ease}@keyframes bannerFadeIn{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}.iosInstallContent{display:flex;align-items:center;gap:14px}.iosIcon{font-size:2rem;line-height:1}.iosInstallContent b{display:block;font-size:.95rem;color:var(--text);margin-bottom:3px}.iosInstallContent p{margin:0;font-size:.84rem;color:var(--muted);line-height:1.4}.iosInstallActions{display:flex;align-items:center;gap:8px;flex-shrink:0}.mini{padding:7px 14px;font-size:.8rem;font-weight:700;border-radius:999px;cursor:pointer}.standaloneBadge{display:inline-flex;align-items:center;gap:6px;background:rgba(110,231,216,.14);border:1px solid rgba(110,231,216,.35);color:var(--accent2);padding:4px 10px;border-radius:999px;font-size:.72rem;font-weight:700;margin-left:10px}.nightModeOverlay{position:fixed;inset:0;background:#000;z-index:99999;display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:calc(30px + env(safe-area-inset-top, 0px)) 20px calc(30px + env(safe-area-inset-bottom, 0px));color:#f6f3ff;-webkit-user-select:none;-moz-user-select:none;user-select:none;touch-action:manipulation}.nightModeTop{text-align:center}.nightModeTop h3{margin:0 0 4px;font-size:1.1rem;color:hsla(0,0%,100%,.85);font-weight:600}.nightModeTop p{margin:0;font-size:.82rem;color:hsla(0,0%,100%,.45)}.nightModeCenter{text-align:center;display:flex;flex-direction:column;align-items:center;gap:12px}.nightModeClock{font-size:clamp(4.2rem,16vw,7.5rem);font-weight:200;letter-spacing:-.04em;color:rgba(246,243,255,.88);font-feature-settings:"tnum";font-variant-numeric:tabular-nums;text-shadow:0 0 40px rgba(155,124,255,.25)}.nightModeAlarmBadge{display:inline-flex;align-items:center;gap:8px;background:rgba(110,231,216,.08);border:1px solid rgba(110,231,216,.25);color:var(--accent2);padding:8px 18px;border-radius:999px;font-size:.9rem;font-weight:600}.nightPulse{width:8px;height:8px;background:var(--accent2);border-radius:50%;box-shadow:0 0 10px var(--accent2);animation:pulseDot 2s ease-in-out infinite}@keyframes pulseDot{0%,to{transform:scale(.9);opacity:.5}50%{transform:scale(1.3);opacity:1}}.nightModeBottom{display:flex;flex-direction:column;align-items:center;gap:12px}.nightModeExitBtn{background:hsla(0,0%,100%,.12);border:1px solid hsla(0,0%,100%,.2);color:var(--text);padding:12px 28px;border-radius:999px;font-size:.95rem;font-weight:700;cursor:pointer;transition:all .2s}.nightModeExitBtn:hover{background:hsla(0,0%,100%,.25)}.iosModalBackdrop{position:fixed;inset:0;background:rgba(0,0,0,.75);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:10000;display:flex;align-items:center;justify-content:center;padding:20px}.iosModalCard{background:var(--panel);border:1px solid var(--line);border-radius:20px;max-width:480px;width:100%;padding:26px;color:var(--text);box-shadow:0 20px 50px rgba(0,0,0,.6)}.iosModalCard h3{margin:0 0 14px;font-size:1.35rem;display:flex;align-items:center;gap:10px}.iosModalSteps{display:flex;flex-direction:column;gap:14px;margin:20px 0}.iosModalStep{display:flex;align-items:flex-start;gap:12px;font-size:.92rem;line-height:1.45}.stepNum{justify-content:center;width:26px;height:26px;background:var(--accent);color:#090a12;font-weight:800;font-size:.82rem;border-radius:50%;flex-shrink:0}.alarmControlsRow,.stepNum{display:flex;align-items:center}.alarmControlsRow{flex-wrap:wrap;gap:10px;margin-top:14px}.btnTestAlarm{background:rgba(110,231,216,.12);border:1px solid rgba(110,231,216,.3);color:var(--accent2);font-size:.85rem;font-weight:700;padding:8px 14px;border-radius:999px;cursor:pointer;transition:all .2s}.btnTestAlarm:hover{background:rgba(110,231,216,.24)}.btnNightMode{background:rgba(155,124,255,.14);border:1px solid rgba(155,124,255,.35);color:var(--text);font-size:.85rem;font-weight:700;padding:8px 14px;border-radius:999px;cursor:pointer;display:inline-flex;align-items:center;gap:6px;transition:all .2s}.btnNightMode:hover{background:rgba(155,124,255,.28)}@media (max-width:768px){.iosInstallBanner{flex-direction:column;align-items:flex-start}.iosInstallActions{width:100%;justify-content:flex-end}body{padding-bottom:calc(115px + env(safe-area-inset-bottom, 0px))}.bottomPlayer{padding-bottom:calc(8px + env(safe-area-inset-bottom, 0px))}}