:root[data-theme=ios]{--font:-apple-system, BlinkMacSystemFont, "SF Pro Text", "SF Pro Display", "Pretendard Variable", Pretendard, "Apple SD Gothic Neo", system-ui, "Noto Sans KR", "Segoe UI", Roboto, sans-serif;--ink:#000000e6;--ink-dim:#3c3c43a8;--glass:#ffffff9e;--glass-thick:#ffffffdb;--line:#3c3c4329;--tint:#007aff;--green:#34c759;--amber:#34c759;--amber-hi:#007aff;--ios-shadow:0 6px 24px #14324621, inset 0 .5px 0 #ffffffd9;--ios-blur:blur(22px) saturate(180%);--ease:cubic-bezier(.2, .9, .25, 1)}[data-theme=ios] html,[data-theme=ios] body,[data-theme=ios] #root,:root[data-theme=ios] body{font-family:var(--font);letter-spacing:-.012em;-webkit-font-smoothing:antialiased;color:var(--ink);background:#cfe9f0}[data-theme=ios] .chip,[data-theme=ios] .hint,[data-theme=ios] .toast,[data-theme=ios] .gtoast,[data-theme=ios] .status,[data-theme=ios] .small,[data-theme=ios] .tag{color:var(--ink);background:var(--glass);box-shadow:var(--ios-shadow);-webkit-backdrop-filter:var(--ios-blur);backdrop-filter:var(--ios-blur);border:.5px solid #ffffffa6}[data-theme=ios] .hud button{-webkit-tap-highlight-color:transparent}[data-theme=ios] .title{padding:6px 16px 6px 8px}[data-theme=ios] .title b{letter-spacing:-.015em;font-size:15px;font-weight:650}[data-theme=ios] .title small{color:var(--ink-dim);font-size:11px;font-weight:500}[data-theme=ios] .icon{min-width:40px;height:40px;color:var(--ink);transition:background .18s, transform .18s var(--ease)}[data-theme=ios] .icon:hover{background:#3c3c4314}[data-theme=ios] .icon:active{background:#3c3c4329;transform:scale(.92)}[data-theme=ios] .title .icon{color:var(--tint)}[data-theme=ios] .presence{padding:6px 13px;font-size:12.5px;font-weight:560}[data-theme=ios] .presence .dot{background:#aeaeb2}[data-theme=ios] .presence.on .dot{background:var(--green);box-shadow:0 0 0 3px #34c75938}[data-theme=ios] .presence.connecting .dot{background:#ff9f0a}[data-theme=ios] .presence .dim{color:var(--ink-dim)}[data-theme=ios] .hint{text-align:center;color:var(--ink);border-radius:18px;max-width:min(92vw,420px);padding:8px 16px;font-size:13px;line-height:1.4}[data-theme=ios] .toast{color:var(--ink);font-weight:600}[data-theme=ios] .gtoast{font-size:13.5px;font-weight:500}[data-theme=ios] .status{color:var(--ink);font-size:13px}[data-theme=ios] .small{width:54px;height:54px;color:var(--tint);transition:transform .18s var(--ease), background .18s}[data-theme=ios] .small:hover{background:var(--glass-thick)}[data-theme=ios] .small:active{background:var(--glass-thick);transform:scale(.9)}[data-theme=ios] .label{letter-spacing:-.005em;color:#1c1c1ed1;text-shadow:0 0 10px #fffffff2,0 0 3px #ffffffe6;font-size:11.5px;font-weight:600}[data-theme=ios] .count{color:var(--ink-dim);text-shadow:0 0 8px #ffffffe6}[data-theme=ios] .light.calm{width:88px;height:88px;color:var(--tint);-webkit-backdrop-filter:var(--ios-blur);backdrop-filter:var(--ios-blur);transition:transform .2s var(--ease), box-shadow .2s;background:#ffffffc7;border:.5px solid #ffffffe6;box-shadow:0 12px 32px #143c5a33,inset 0 0 0 5px #ffffff8c,inset 0 .5px #fff}[data-theme=ios] .light.calm svg{width:38px;height:38px}[data-theme=ios] .light.calm:active{transform:scale(.93);box-shadow:0 6px 18px #143c5a33,inset 0 0 0 5px #ffffff8c}[data-theme=ios] .sound-cta{top:calc(max(14px, env(safe-area-inset-top)) + 104px);color:#fff;transition:transform .18s var(--ease);background:#007affeb;border:0;padding:11px 20px;font-size:15px;font-weight:600;animation:none;box-shadow:0 10px 26px #007aff59}[data-theme=ios] .sound-cta:active{transform:translate(-50%)scale(.96)}[data-theme=ios] .sound-cta svg{color:#fff}[data-theme=ios] .tag{background:#ffffffb8;padding:2px 9px;font-size:11px;font-weight:600;box-shadow:0 2px 8px #14324624}[data-theme=ios] .tag.me{color:#fff;background:var(--tint);border-color:#ffffff80}[data-theme=ios] .mini{color:var(--tint);transition:transform .18s var(--ease), background .18s;background:#007aff1f;border:0;padding:6px 13px;font-size:13px;font-weight:600}[data-theme=ios] .mini:hover{background:#007aff33}[data-theme=ios] .mini:active{transform:scale(.95)}[data-theme=ios] .sheet .wide{color:#fff;background:var(--tint);transition:transform .18s var(--ease), opacity .18s;border:0;border-radius:14px;padding:13px;font-size:16px;font-weight:600}[data-theme=ios] .sheet .wide:active{opacity:.9;transform:scale(.98)}[data-theme=ios] .scrim{height:var(--vvh,100%);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:#00000042;align-items:flex-end;padding:0;animation:.3s both scrimIn}@media (width>=640px){[data-theme=ios] .scrim{align-items:center;padding:16px}}[data-theme=ios] .sheet{width:min(100%,520px);max-height:min(calc(var(--vvh,100vh) * .88), 720px);padding:8px 16px calc(18px + env(safe-area-inset-bottom) + var(--vv-hidden,0px) + var(--inapp-bottom,0px));color:var(--ink);-webkit-backdrop-filter:blur(40px)saturate(180%);backdrop-filter:blur(40px)saturate(180%);animation:sheetUp .42s var(--ease) both;background:#f2f2f7e0;border:.5px solid #fffc;border-radius:28px 28px 0 0;box-shadow:0 -10px 50px #0003}@media (width>=640px){[data-theme=ios] .sheet{border-radius:28px}}[data-theme=ios] .sheet:before{content:"";background:#3c3c434d;border-radius:3px;width:36px;height:5px;margin:2px auto 10px;display:block}[data-theme=ios] .sheet header{margin-bottom:12px}[data-theme=ios] .sheet h3{letter-spacing:-.02em;font-size:20px;font-weight:700}[data-theme=ios] .sheet .x{color:#3c3c4399;width:30px;height:30px;transition:transform .18s var(--ease), background .18s;background:#78788029}[data-theme=ios] .sheet .x:active{background:#78788047;transform:scale(.9)}[data-theme=ios] .sheet .sub{color:var(--ink-dim);font-size:13.5px}[data-theme=ios] .sheet .sub.warn{color:#ff3b30}@keyframes sheetUp{0%{opacity:0;transform:translateY(40px)}to{opacity:1;transform:none}}@keyframes scrimIn{0%{opacity:0}to{opacity:1}}[data-theme=ios] .sheet section{background:#ffffffeb;border-radius:14px;margin:0 0 18px;padding:0 16px 2px}[data-theme=ios] .sheet section>h4{text-transform:none;letter-spacing:0;color:var(--ink-dim);margin:0;padding:13px 0 4px;font-size:13px;font-weight:600}[data-theme=ios] .row{border-top:.5px solid var(--line);min-height:46px;padding:8px 0;font-size:16px}[data-theme=ios] section>h4+.row{border-top:0}[data-theme=ios] .keys li{color:var(--ink-dim);border-top:.5px solid var(--line);padding:7px 0;font-size:14px}[data-theme=ios] .keys li:first-child{border-top:0}[data-theme=ios] kbd{min-width:24px;color:var(--ink);background:#78788024;border:0;border-bottom:1.5px solid #3c3c432e;border-radius:7px;padding:1px 7px}[data-theme=ios] .credits{color:var(--ink-dim);padding:6px 0 10px;font-size:12.5px}[data-theme=ios] .switch{background:#78788052;border-radius:16px;width:51px;height:31px;transition:background .25s}[data-theme=ios] .switch:after{width:27px;height:27px;transition:transform .28s cubic-bezier(.3,1.4,.5,1);top:2px;left:2px;box-shadow:0 3px 8px #00000047,0 0 0 .5px #0000000a}[data-theme=ios] .switch.on{background:var(--green)}[data-theme=ios] .switch.on:after{transform:translate(20px)}[data-theme=ios] .row input[type=range]{appearance:none;background:linear-gradient(to right, var(--tint) var(--v,50%), #78788047 var(--v,50%));border-radius:2px;outline:none;width:46%;height:4px}[data-theme=ios] .row input[type=range]::-webkit-slider-thumb{appearance:none;background:#fff;border-radius:50%;width:26px;height:26px;box-shadow:0 2px 8px #00000047,0 0 0 .5px #0000000f}[data-theme=ios] .row input[type=range]::-moz-range-thumb{background:#fff;border:0;border-radius:50%;width:26px;height:26px;box-shadow:0 2px 8px #00000047}[data-theme=ios] .row input[type=range]::-moz-range-track{background:#78788047;border-radius:2px;height:4px}[data-theme=ios] .row input[type=range]::-moz-range-progress{background:var(--tint);border-radius:2px;height:4px}[data-theme=ios] .lang-pick select,[data-theme=ios] select.pick{color:var(--tint);background:#7676801f;border:0;border-radius:9px;padding:7px 12px;font-weight:500}[data-theme=ios] .people li{border-bottom:.5px solid var(--line);padding:11px 2px;font-size:16px}[data-theme=ios] .people li.me{color:var(--tint);font-weight:600}[data-theme=ios] .people li em{color:var(--ink-dim)}[data-theme=ios] .people .dot{background:var(--green)}[data-theme=ios] .room{border:.5px solid var(--line);transition:transform .18s var(--ease), background .18s;background:#ffffffeb;border-radius:14px;padding:12px 14px}[data-theme=ios] .room:hover:not(:disabled){background:#fff}[data-theme=ios] .room:active:not(:disabled){transform:scale(.985)}[data-theme=ios] .room.cur{border-color:var(--tint);background:#007aff12}[data-theme=ios] .room .rn em{color:var(--tint);font-weight:600}[data-theme=ios] .room .meter{background:#78788033}[data-theme=ios] .room .meter i{background:var(--green)}[data-theme=ios] .tracks{background:#ffffffeb;border-radius:14px;gap:0;margin:0 0 14px;overflow-x:hidden}[data-theme=ios] .track{color:var(--ink);border:0;border-top:.5px solid var(--line);background:0 0;border-radius:0;padding:12px 44px 12px 16px;transition:background .18s;position:relative}[data-theme=ios] li:first-child>.track{border-top:0}[data-theme=ios] .track b{font-size:16px;font-weight:600}[data-theme=ios] .track small{color:var(--ink-dim);font-size:13px}[data-theme=ios] .track:active{background:#3c3c431a}[data-theme=ios] .track.on{box-shadow:none;border-color:var(--line)}[data-theme=ios] .track.on:after{content:"";top:50%;border-right:2.5px solid var(--tint);border-bottom:2.5px solid var(--tint);width:7px;height:13px;margin-top:-9px;position:absolute;inset-inline-end:18px;transform:rotate(45deg)}[data-theme=ios] .welcome{z-index:50;height:var(--vvh,auto);padding:max(24px, env(safe-area-inset-top)) 24px calc(max(28px, env(safe-area-inset-bottom)) + var(--vv-hidden,0px) + var(--inapp-bottom,0px));text-align:center;color:var(--ink);pointer-events:auto;transition:opacity .9s ease, transform .9s var(--ease);background:radial-gradient(60% 40% at 18% 12%,#ffffffb3,#0000 70%),radial-gradient(80% 60% at 85% 95%,#c6f0dce6,#0000 70%),linear-gradient(#a9dcf5 0%,#d3eef0 52%,#f2faf6 100%);flex-direction:column;justify-content:center;align-items:center;gap:4px;display:flex;position:fixed;inset:0}[data-theme=ios] .welcome.done{opacity:0;pointer-events:none;transform:scale(1.05)}[data-theme=ios] .welcome .flower{place-items:center;width:210px;height:210px;margin-bottom:18px;display:grid;position:relative}[data-theme=ios] .welcome .flower i{background:#ffffff80;border:.5px solid #ffffffe6;border-radius:50%;width:96px;height:96px;animation:7s ease-in-out infinite breathe;position:absolute;box-shadow:0 8px 24px #3c8caa29,inset 0 0 18px #fff9}[data-theme=ios] .welcome .flower i:first-child{--r:0deg}[data-theme=ios] .welcome .flower i:nth-child(2){--r:60deg}[data-theme=ios] .welcome .flower i:nth-child(3){--r:120deg}[data-theme=ios] .welcome .flower i:nth-child(4){--r:180deg}[data-theme=ios] .welcome .flower i:nth-child(5){--r:240deg}[data-theme=ios] .welcome .flower i:nth-child(6){--r:300deg}@keyframes breathe{0%,to{transform:rotate(var(--r)) translateY(-14px) scale(.78);opacity:.7}50%{transform:rotate(var(--r)) translateY(-44px) scale(1);opacity:1}}[data-theme=ios] .welcome .app{border-radius:23.5px;width:104px;height:104px;position:relative;overflow:hidden;box-shadow:0 14px 36px #1e506e4d,0 0 0 .5px #ffffffb3}[data-theme=ios] .welcome .app img{width:100%;height:100%;display:block}[data-theme=ios] .welcome h2{letter-spacing:-.03em;color:var(--ink);margin:0;font-size:34px;font-weight:750}[data-theme=ios] .welcome p{color:var(--ink-dim);letter-spacing:-.01em;margin:4px 0 0;font-size:17px}[data-theme=ios] .welcome .actions-w{flex-direction:column;align-items:center;gap:6px;min-height:112px;margin-top:30px;display:flex}[data-theme=ios] .welcome .cta{min-width:232px;font:inherit;letter-spacing:-.01em;color:#fff;background:var(--tint);cursor:pointer;animation:ctaIn .7s var(--ease) both;transition:transform .18s var(--ease), opacity .18s;border:0;border-radius:15px;padding:15px 30px;font-size:17px;font-weight:650;box-shadow:0 12px 28px #007aff57}[data-theme=ios] .welcome .cta:active{opacity:.92;transform:scale(.97)}[data-theme=ios] .welcome .plainbtn{font:inherit;color:var(--tint);cursor:pointer;animation:ctaIn .7s .1s var(--ease) both;background:0 0;border:0;padding:10px 16px;font-size:15.5px;font-weight:500}[data-theme=ios] .welcome .plainbtn:active{opacity:.5}@keyframes ctaIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}[data-theme=ios] .welcome .spinner{background:conic-gradient(#3c3c4300,#3c3c43b8);border-radius:50%;width:30px;height:30px;margin:10px 0 0;animation:.9s linear infinite spin;-webkit-mask:radial-gradient(farthest-side,#0000 calc(100% - 3.5px),#000 calc(100% - 3px));mask:radial-gradient(farthest-side,#0000 calc(100% - 3.5px),#000 calc(100% - 3px))}[data-theme=ios] .welcome .opening{color:var(--ink-dim);margin-top:12px;font-size:14px}@keyframes spin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion:reduce){[data-theme=ios] .welcome .flower i{transform:rotate(var(--r)) translateY(-30px) scale(.9);animation:none}}