@font-face{font-family:Pretendard;src:url(/assets/PretendardVariable-CJuje-Rk.woff2) format("woff2");font-weight:45 920;font-style:normal;font-display:swap}@layer base,desktop;@layer base{html{-webkit-text-size-adjust:100%;text-size-adjust:100%;height:100%;overflow:hidden;background-color:var(--bg);color-scheme:light dark}html.standalone body{overflow:hidden}.skip-link{position:absolute;top:-100%;left:16px;z-index:99999;padding:12px 24px;background:var(--primary, #3b82f6);color:#fff;border-radius:0 0 var(--radius-s, 14px) var(--radius-s, 14px);font-size:14px;font-weight:600;text-decoration:none;transition:top .2s ease}.skip-link:focus{top:0;outline:2px solid #fff;outline-offset:2px}:root{--bg: #121212;--surface-1: #1A1A1A;--surface-2: #262626;--surface-3: #404040;--divider: var(--surface-2);--primary: #3b82f6;--primary-rgb: 59, 130, 246;--accent: var(--primary);--accent-rgb: var(--primary-rgb);--text-main: #ffffff;--text-sub: #a1a1aa;--text-muted: #52525b;--radius-l: 32px;--radius-m: 20px;--radius-s: 14px;--glass-bg: rgba(38, 38, 38, .75);--glass-border: transparent;--glass-blur: 16px;--scrollbar-thumb: rgba(255, 255, 255, .2);--scrollbar-thumb-hover: rgba(255, 255, 255, .4);--scrollbar-thumb-active: rgba(255, 255, 255, .6);--scrollbar-thumb-ff: rgba(255, 255, 255, .25);--safe-top: env(safe-area-inset-top, 0px);--safe-right: env(safe-area-inset-right, 0px);--safe-left: env(safe-area-inset-left, 0px);--safe-bottom: env(safe-area-inset-bottom, 0px);--header-height: calc(60px + var(--safe-top));--nav-height: 72px}html.is-booting *,html.is-booting *:before,html.is-booting *:after{transition:none!important}html.is-booting header,html.is-booting .bottom-nav{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}html.is-booting .tab-content{animation:none!important}html.setup-boot-block header,html.setup-boot-block .tab-content,html.setup-boot-block .bottom-nav{pointer-events:none!important}html[data-theme=dark],html[data-theme=dark] body{color-scheme:dark}html[data-theme=light],html[data-theme=light] body{color-scheme:light;--bg: #f8f9fa;--surface-1: #ffffff;--surface-2: #f1f3f5;--surface-3: #B7B9BB;--divider: var(--surface-3);--primary: #3b82f6;--primary-rgb: 59, 130, 246;--accent: var(--primary);--accent-rgb: var(--primary-rgb);--text-main: #212529;--text-sub: #495057;--text-muted: #868e96;--glass-bg: rgba(255, 255, 255, .85);--glass-border: rgba(0, 0, 0, .06);--scrollbar-thumb: rgba(0, 0, 0, .2);--scrollbar-thumb-hover: rgba(0, 0, 0, .4);--scrollbar-thumb-active: rgba(0, 0, 0, .6);--scrollbar-thumb-ff: rgba(0, 0, 0, .2)}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;-webkit-user-drag:none;margin:0;padding:0}input,textarea,[contenteditable=true]{user-select:text;-webkit-user-select:text;-webkit-touch-callout:default}button,input,select,textarea{font-family:inherit}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background-color:var(--scrollbar-thumb);border:2px solid transparent;border-radius:10px;background-clip:padding-box}::-webkit-scrollbar-thumb:hover{background-color:var(--scrollbar-thumb-hover)}::-webkit-scrollbar-thumb:active{background-color:var(--scrollbar-thumb-active)}@supports (-moz-appearance:none){*{scrollbar-width:thin;scrollbar-color:var(--scrollbar-thumb-ff) transparent}}body{background-color:var(--bg);color:var(--text-main);font-family:Pretendard,sans-serif;-webkit-text-size-adjust:100%;text-size-adjust:100%;height:100vh;height:100dvh;height:var(--app-height, 100dvh);min-height:0;max-height:var(--app-height, 100dvh);display:flex;flex-direction:column;overflow:hidden;transition:background-color .4s cubic-bezier(.2,.8,.2,1)}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}header{height:var(--header-height);padding:var(--safe-top) calc(24px + var(--safe-right)) 0 calc(24px + var(--safe-left));display:flex;justify-content:space-between;align-items:center;background:var(--glass-bg);backdrop-filter:blur(var(--glass-blur));-webkit-backdrop-filter:blur(var(--glass-blur));position:fixed;top:0;left:0;right:0;z-index:2500;overflow:hidden;transition:background-color .3s ease;transform:translateZ(0);will-change:transform}.header-progress-bg{position:absolute;top:0;left:0;bottom:0;width:0%;background-color:var(--primary);opacity:0;z-index:1;transition:width .4s cubic-bezier(.2,.8,.2,1),opacity .4s ease;pointer-events:none}header.loading .header-progress-bg{opacity:.15}.header-content-wrapper{position:relative;z-index:5;display:flex;flex-direction:column;justify-content:center;height:100%}.header-default-content{transition:transform 1s cubic-bezier(.08,.82,.17,1),opacity .5s ease;transform:translateY(0);opacity:1}.app-logo{color:var(--text-main);display:flex;align-items:center;cursor:pointer;user-select:none}.logo-svg{display:block;overflow:visible}.logo-header{height:16px;width:auto}.logo-brand{height:28px;width:auto}.logo-welcome{height:22px;width:auto;margin-top:3px;margin-bottom:11.8px}.logo-welcome>.wg{opacity:.15;animation:ghostIn .4s 2.5s both}@keyframes ghostIn{to{opacity:1}}@keyframes wlr{0%{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}@keyframes wrl{0%{clip-path:inset(0 0 0 100%)}to{clip-path:inset(0 0 0 0)}}@keyframes wtb{0%{clip-path:inset(0 0 100% 0)}to{clip-path:inset(0 0 0 0)}}@keyframes wbt{0%{clip-path:inset(100% 0 0 0)}to{clip-path:inset(0 0 0 0)}}@keyframes wdiag{0%{clip-path:inset(0 100% 100% 0)}to{clip-path:inset(0 0 0 0)}}.logo-welcome>.wl{animation-duration:var(--wd, .15s);animation-timing-function:cubic-bezier(.15,.5,.05,1);animation-delay:calc(var(--wt, 0ms) + .5s);animation-fill-mode:both}.logo-welcome>.wlr{animation-name:wlr}.logo-welcome>.wrl{animation-name:wrl}.logo-welcome>.wtb{animation-name:wtb}.logo-welcome>.wbt{animation-name:wbt}.logo-welcome>.wdiag{animation-name:wdiag}[data-theme=light] .app-logo{color:#212529}.header-loading-text{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;align-items:center;font-size:14px;font-weight:600;color:var(--text-main);white-space:nowrap;transform:translateY(100%);opacity:0;transition:transform 1s cubic-bezier(.08,.82,.17,1),opacity .5s ease;z-index:6;pointer-events:none}header.loading .header-default-content{transform:translateY(-150%);opacity:0}header.loading .header-loading-text{transform:translateY(0);opacity:1}.header-right{position:relative;top:auto;right:auto;transform:none;z-index:5;display:flex;align-items:center;gap:10px}.role-badge{font-size:11px;font-weight:700;background:#80808026;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);color:var(--text-sub);padding:6px 14px;border-radius:100px;display:flex;align-items:center;gap:6px;transition:all .3s;cursor:pointer;touch-action:manipulation}.role-dot{width:6px;height:6px;background:var(--text-muted);border-radius:50%;transition:transform .2s,background .2s}.role-badge.connected{background:var(--primary);color:#fff}.role-badge.connected .role-dot{background:#fff}.role-badge.connected.remote{background:#f59e0b}.tab-content{animation:none;flex:1;min-height:0;-webkit-overflow-scrolling:touch;display:none;flex-direction:column;overflow:hidden;overscroll-behavior-y:contain;padding-top:var(--header-height)}.tab-content.active{display:flex;opacity:1;visibility:visible;pointer-events:auto}.tab-body{flex:1;display:flex;flex-direction:column;min-height:0;width:100%;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior-y:contain;padding-bottom:calc(var(--nav-height) + var(--safe-bottom) + var(--safe-nav-bottom, 0px) + 24px)}@media(min-width:1280px){.tab-body{padding-bottom:24px}}body.mode-video #tab-play:not(.active){display:flex;position:absolute;top:0;left:-100vw;width:100%;height:100%;opacity:0;visibility:hidden;pointer-events:none}#tab-play.active{display:flex}.tab-header{padding:32px 32px 12px;display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.tab-title{font-size:28px;font-weight:800;color:var(--text-main);letter-spacing:-.03em}.youtube-settings-note{display:none;margin:0 20px 18px;padding:12px 14px;border-radius:16px;background:var(--glass-bg);border:1px solid rgba(255,255,255,.08);color:var(--text-main);font-size:13px;line-height:1.45;letter-spacing:-.01em;backdrop-filter:blur(var(--glass-blur));-webkit-backdrop-filter:blur(var(--glass-blur));box-shadow:0 10px 28px #00000047}body.mode-youtube #youtube-settings-note{display:block}#youtube-settings-disabled-wrap{position:relative}body.mode-youtube #youtube-settings-disabled-wrap{filter:blur(7px) saturate(.95);opacity:.55;pointer-events:none;transform:translateZ(0);will-change:filter}html[data-theme=light] .youtube-settings-note{border:1px solid rgba(0,0,0,.06);box-shadow:0 10px 28px #0000001f}html[data-theme=light] body.mode-youtube #youtube-settings-disabled-wrap{filter:blur(6px) saturate(.95);opacity:.62}.invite-code-value{font-variant-numeric:tabular-nums;letter-spacing:.1em;padding:2px 0;border-radius:var(--radius-s);transition:all .3s cubic-bezier(.2,.8,.2,1)}.invite-code-value.copied{color:var(--accent);text-shadow:0 0 6px rgba(var(--accent-rgb, 99, 102, 241),.4)}.tab-action-btn{background:var(--surface-2);color:var(--text-sub);border:none;width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s;position:relative}.tab-action-btn:active{transform:scale(.9);background:var(--surface-3)}.tab-action-btn svg{width:20px;height:20px;fill:currentColor}.tab-action-btn.active,.tab-action-btn.active-one{background:var(--primary);color:#fff}.tab-action-btn.active-one:after{content:"1";position:absolute;font-size:9px;font-weight:800;top:-2px;right:-2px;background:#fff;color:var(--primary);width:14px;height:14px;border-radius:50%;display:flex;align-items:center;justify-content:center;border:2px solid var(--bg)}#tab-play{justify-content:flex-start;padding-top:calc(var(--header-height) + 10px)}#tab-play .tab-body{padding-bottom:calc(var(--nav-height) + var(--safe-bottom) + var(--safe-nav-bottom, 0px))}.vinyl-wrapper{flex-shrink:1;flex-basis:min(55vw,320px);min-height:160px;aspect-ratio:1;margin:auto auto 0;position:relative;display:flex;justify-content:center;align-items:center;border-radius:50%;background:transparent}#visualizerCanvas{width:100%;height:100%;border-radius:50%;background:transparent}.video-wrapper{width:100%;max-width:600px;aspect-ratio:16/9;margin:0 auto;background:#000;border-radius:var(--radius-m);overflow:hidden;display:none;align-items:center;justify-content:center;visibility:hidden;pointer-events:none;box-shadow:none;position:relative;transition:opacity .3s}.video-screen{width:100%;height:100%;object-fit:contain}.fullscreen-btn{position:absolute;bottom:12px;right:12px;background:#0009;border:none;color:#fff;width:40px;height:40px;border-radius:8px;display:flex;align-items:center;justify-content:center;cursor:pointer;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);transition:opacity .3s;opacity:0;z-index:10}.video-wrapper:hover .fullscreen-btn,.video-wrapper:active .fullscreen-btn{opacity:1}.fullscreen-btn svg{width:24px;height:24px;fill:currentColor}body.mode-video .vinyl-wrapper{display:none}body.mode-video .video-wrapper{display:flex;height:auto;opacity:1;visibility:visible;pointer-events:auto}.track-box{flex-shrink:0;text-align:center;width:100%;padding:0 24px;box-sizing:border-box;margin:24px 0 6px}.track-title-wrapper{position:relative;width:100%;height:32px;margin:0 auto 6px;overflow:hidden;-webkit-mask-image:linear-gradient(to right,transparent 0,black 24px,black calc(100% - 24px),transparent 100%);mask-image:linear-gradient(to right,transparent 0,black 24px,black calc(100% - 24px),transparent 100%)}.track-title{font-size:20px;font-weight:700;color:var(--text-main);letter-spacing:-.5px;line-height:32px;display:inline-block;white-space:nowrap;width:auto;min-width:100%;text-align:center;padding:0 24px;box-sizing:border-box}.track-title.marquee{width:auto;animation:marquee-pingpong var(--marquee-duration, 10s) cubic-bezier(.4,0,.2,1) infinite;will-change:transform}@keyframes marquee-pingpong{0%,20%{transform:translate(0)}50%,70%{transform:translate(var(--marquee-offset))}to{transform:translate(0)}}.track-artist{display:none;font-size:15px;color:var(--text-sub);font-weight:500}.controls-area{flex-shrink:0;width:100%;padding:0 24px 24px;display:flex;flex-direction:column;gap:12px;margin-top:auto}.progress-bar{width:100%;position:relative;display:flex;flex-direction:column;gap:8px}input[type=range]{-webkit-appearance:none;appearance:none;width:100%;background:transparent;cursor:pointer;height:32px;margin:0;touch-action:none!important}input[type=range]::-webkit-slider-runnable-track{width:100%;height:6px;background:var(--surface-2);border-radius:100px;border:none}input[type=range]::-moz-range-track{width:100%;height:6px;background:var(--surface-2);border-radius:100px;border:none}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;height:16px;width:16px;border-radius:50%;background-color:var(--text-sub);margin-top:-5px;transform:scale(1);filter:none;box-shadow:none!important;transition:transform .2s cubic-bezier(.2,.8,.2,1),filter .2s,background-color .2s}input[type=range]::-moz-range-thumb{height:16px;width:16px;border-radius:50%;background-color:var(--text-sub);border:none;transform:scale(1);filter:none;box-shadow:none!important;transition:transform .2s cubic-bezier(.2,.8,.2,1),filter .2s,background-color .2s}input[type=range]:active::-webkit-slider-thumb{transform:scale(1.25);filter:none;box-shadow:none!important}input[type=range]:active::-moz-range-thumb{transform:scale(1.25);filter:none;box-shadow:none!important}.time-info{display:flex;justify-content:space-between;font-size:12px;font-weight:600;color:var(--text-sub);font-variant-numeric:tabular-nums}.play-controls-left{display:flex;justify-content:flex-start;align-items:center;gap:16px;margin:6px 0;width:100%}.play-btn-group{display:flex;align-items:center;gap:16px}.vol-group-playback{display:flex;align-items:center;gap:8px;margin-left:auto;width:100px;min-width:80px}.vol-group-playback svg{width:18px;height:18px;fill:var(--text-sub);flex-shrink:0}#volume-slider{width:100%;margin:0}#volume-slider::-webkit-slider-runnable-track{height:4px}#volume-slider::-moz-range-track{height:4px}#volume-slider::-webkit-slider-thumb{height:12px;width:12px;margin-top:-4px}#volume-slider::-moz-range-thumb{height:12px;width:12px;border:none}.ctrl-btn-small{width:32px;height:32px;border-radius:50%;background:transparent;border:none;color:var(--text-sub);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s}.ctrl-btn-small:hover{color:var(--text-main);background:var(--surface-2)}.ctrl-btn{background:transparent;border:none;color:var(--text-main);cursor:pointer;padding:8px;opacity:.8;transition:opacity .2s}.ctrl-btn:active{opacity:.5}.ctrl-btn svg{width:32px;height:32px;fill:currentColor}.play-fab{width:64px;height:64px;border-radius:50%;background:var(--text-main);color:var(--bg);border:none;display:flex;align-items:center;justify-content:center;transition:transform .2s}.play-fab:active{transform:scale(.92)}.play-fab:disabled{opacity:.3}.play-fab svg{width:28px;height:28px;fill:currentColor}.playlist-title-area{display:flex;align-items:center;gap:8px}.playlist-ul{list-style:none;padding:0 16px;margin:0;display:flex;flex-direction:column;gap:8px;flex:1}.track-item{background:transparent;padding:16px;border-radius:var(--radius-m);display:flex;align-items:center;gap:16px;cursor:pointer;transition:background .2s;border-bottom:1px solid transparent}.track-item:active,.track-item.active{background:var(--surface-2)}.track-item.active .track-idx,.track-item.active .track-name{color:var(--primary);font-weight:700}.track-idx{font-size:14px;color:var(--text-muted);font-weight:600;width:24px;text-align:center}.track-name{flex:1;font-size:16px;font-weight:500;color:var(--text-main);display:flex;align-items:center;gap:8px;min-width:0}.track-name-text{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;min-width:0}.type-icon{width:16px;height:16px;flex-shrink:0;fill:var(--text-sub)}.playing-indicator{display:none;align-items:flex-end;gap:2px;width:16px;height:12px}.track-item.active .playing-indicator,.sub-track-item.active .playing-indicator{display:flex}.playing-indicator .bar{width:3px;height:100%;background:var(--primary);border-radius:1px;animation:playingWave .6s ease-in-out infinite alternate}.playing-indicator .bar:nth-child(2){animation-delay:-.4s;height:70%}.playing-indicator .bar:nth-child(3){animation-delay:-.2s;height:85%}@keyframes playingWave{0%{height:20%}to{height:100%}}.sub-playlist{list-style:none;padding:0 0 8px 48px;margin:-4px 0 8px;display:flex;flex-direction:column;gap:2px;animation:fadeIn .2s ease-out}.sub-track-item{padding:8px 12px;border-radius:var(--radius-s);font-size:13px;color:var(--text-sub);cursor:pointer;display:flex;align-items:center;gap:10px;transition:all .2s}.sub-track-item:hover{background:var(--surface-2);color:var(--text-main)}.sub-track-item.active{color:var(--primary);font-weight:700;background:color-mix(in srgb,var(--primary) 10%,transparent)}.sub-idx{font-size:11px;font-weight:800;width:20px;opacity:.5}.sub-name{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sub-track-item.loading{font-style:italic;font-size:11px;opacity:.6}.expand-toggle{width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:50%;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);color:var(--text-muted);background:transparent;border:none}.expand-toggle:hover{background:var(--surface-3);color:var(--text-main)}.expand-toggle svg{width:20px;height:20px;fill:currentColor;transition:transform .3s cubic-bezier(.4,0,.2,1)}.expand-toggle.active svg{transform:rotate(180deg)}.track-item.is-playlist{position:relative}.btn-playlist-remove{display:flex;align-items:center;justify-content:center;width:28px;height:28px;flex-shrink:0;background:none;border:none;border-radius:50%;cursor:pointer;opacity:0;transition:opacity .15s,color .15s;color:var(--text-muted);padding:0}.btn-playlist-remove svg{width:16px;height:16px;fill:currentColor}.track-item:hover .btn-playlist-remove,.track-item:focus-within .btn-playlist-remove{opacity:.6}.track-item:hover .btn-playlist-remove:hover{opacity:1;color:#ff4d4f}.track-item.active .btn-playlist-remove{opacity:.5}.track-item.active .btn-playlist-remove:hover{opacity:1;color:#ff4d4f}@media(hover:none){.btn-playlist-remove{opacity:.5}}.section-group{background:transparent;border-radius:0;margin:0 44px;padding:0 0 44px;border-bottom:1px dotted var(--surface-3)}[data-theme=light] .section-group{border-bottom:1px dotted var(--surface-3)}.section-group:last-of-type,#last-setting-section{border-bottom:none;padding-bottom:44px}#battery-section{border-bottom:1px dotted var(--surface-3)}#device-list:last-child{border-bottom-left-radius:inherit;border-bottom-right-radius:inherit;overflow:hidden}.section-header-row{padding:44px 0 16px;border-bottom:none;display:flex;justify-content:space-between;align-items:center}#tab-settings>.tab-body>.section-group:first-of-type .section-header-row,#tab-settings .settings-subtab-panel>.section-group:first-of-type .section-header-row,#tab-connect>.tab-body>.section-group:first-of-type .section-header-row,#desktop-connect-content>.section-group:first-of-type .section-header-row{padding-top:24px}#youtube-settings-disabled-wrap .section-group:first-child .section-header-row{padding-top:56px}.section-title{font-size:18px;font-weight:700;color:var(--text-main);text-transform:none;letter-spacing:-.5px}.badge-host-ctrl{font-size:11px;font-weight:600;color:var(--text-sub);background:var(--surface-2);padding:4px 10px;border-radius:100px;letter-spacing:-.2px}.host-ctrl-locked{opacity:.4;pointer-events:none;user-select:none}.section-row{padding:10px 0;display:flex;justify-content:space-between;align-items:center;background:transparent;color:var(--text-main);font-size:16px;font-weight:500}.section-row:last-child{border-bottom:none}input[type=range]{margin:0;display:block;width:100%}.section-row.clickable{cursor:pointer}.section-row.clickable:active{background:var(--surface-2)}.row-label{display:flex;align-items:center;gap:12px}.row-val{color:var(--text-sub);font-size:14px;font-weight:500;display:flex;align-items:center;gap:6px}.reverb-sliders-area{overflow:hidden;opacity:1;padding-top:24px;transition:max-height .35s cubic-bezier(.2,.8,.2,1),opacity .25s ease,padding-top .35s cubic-bezier(.2,.8,.2,1)}#woofer-cutoff-control:not(.collapsed){max-height:100px}#reverb-sliders-area:not(.collapsed){max-height:380px}#eq-sliders-area:not(.collapsed){max-height:200px}.reverb-sliders-area.collapsed{max-height:0;opacity:0;padding-top:0;pointer-events:none}.eq-container{display:flex;justify-content:space-between;padding:0;height:160px}input[type=range].eq-slider{-webkit-appearance:none;appearance:none;background:transparent;cursor:pointer;width:100px;height:32px;transform:rotate(-90deg);position:absolute;top:50%;left:50%;margin-left:-50px;margin-top:-16px}input[type=range].eq-slider::-webkit-slider-runnable-track{width:100%;height:6px;background:var(--surface-2);border-radius:3px;cursor:pointer}input[type=range].eq-slider::-moz-range-track{width:100%;height:6px;background:var(--surface-2);border-radius:3px;cursor:pointer}input[type=range].eq-slider::-webkit-slider-thumb{-webkit-appearance:none;height:16px;width:16px;border-radius:50%;background-color:var(--text-sub);margin-top:-5px;transform:scale(1);filter:none;transition:transform .2s cubic-bezier(.2,.8,.2,1),filter .2s,background-color .2s}input[type=range].eq-slider::-moz-range-thumb{height:16px;width:16px;border-radius:50%;background-color:var(--text-sub);border:none;transform:scale(1);filter:none;transition:transform .2s cubic-bezier(.2,.8,.2,1),filter .2s,background-color .2s}input[type=range].eq-slider:active::-webkit-slider-thumb{transform:scale(1.25);filter:none}input[type=range].eq-slider:active::-moz-range-thumb{transform:scale(1.25);filter:none}.eq-band{position:relative;height:160px;display:flex;flex-direction:column;justify-content:space-between;align-items:center;flex:1;min-width:0;padding:10px 0}.eq-val{margin-bottom:auto;z-index:2;font-size:11px;color:var(--primary);font-weight:700}.eq-label{margin-top:auto;z-index:2;font-size:11px;color:var(--text-sub);font-weight:500}.slider-wrap{padding:6px 0}#tab-settings .channel-grid{padding-top:12px;padding-left:0;padding-right:0}.channel-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:12px 0}.ch-opt{background:var(--surface-1);color:var(--text-sub);padding:18px 12px;border-radius:var(--radius-m);font-size:14px;font-weight:700;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;transition:all .3s cubic-bezier(.2,.8,.2,1);border:2px solid var(--surface-2)}.ch-opt svg{width:32px;height:32px;fill:currentColor;opacity:1;transition:opacity .2s;flex-shrink:0}.ch-opt.active,.ch-opt.selected{background:rgba(var(--primary-rgb),.08);border-color:var(--primary);border-width:2px;color:var(--primary);box-shadow:0 4px 14px rgba(var(--primary-rgb),.22)}.ch-opt.active svg,.ch-opt.selected svg{opacity:1;fill:var(--primary)}.slider-header{display:flex;justify-content:space-between;margin-bottom:8px;font-size:14px;font-weight:500;color:var(--text-sub)}.val-disp{color:var(--primary)}.btn-action{background:var(--primary);color:#fff;border:none;padding:0 24px;border-radius:var(--radius-m);font-weight:700;cursor:pointer}.device-row{display:flex;align-items:center;gap:16px;padding:16px;min-height:61px;box-sizing:border-box;border-radius:var(--radius-m);background:transparent;transition:background .2s;border-bottom:1px solid transparent}.device-row:active{background:var(--surface-2)}.device-row .d-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:16px;font-weight:500;color:var(--text-main)}.d-order{font-size:14px;color:var(--text-muted);font-weight:600;width:24px;text-align:center;flex-shrink:0}.d-op-badge{color:var(--primary);font-size:10px;font-weight:700;margin-left:6px}.d-actions{display:flex;gap:4px;align-items:center;flex-shrink:0}.d-op-btn{font-size:11px;padding:4px 10px;border-radius:100px;border:1px solid transparent;background:var(--surface-2);color:var(--text-sub);cursor:pointer;transition:all .15s}.d-op-btn.active{background:var(--primary);color:#fff;border-color:var(--primary)}.d-status{font-size:11px;font-weight:800;padding:4px 10px;border-radius:100px}.d-status.active{background:#52c41a33;color:#52c41a}.d-status.inactive{background:#ff4d4f33;color:#ff4d4f}.btn-kick-device{display:flex;align-items:center;justify-content:center;width:28px;height:28px;flex-shrink:0;background:none;border:none;border-radius:50%;cursor:pointer;opacity:0;transition:opacity .15s,color .15s;color:var(--text-muted);padding:0}.btn-kick-device svg{width:16px;height:16px;fill:currentColor}.device-row:hover .btn-kick-device{opacity:.6}.device-row:hover .btn-kick-device:hover{opacity:1;color:#ff4d4f}@media(pointer:coarse){.btn-kick-device{opacity:.5}}.rename-device-btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;height:56px;padding:0;margin-top:24px;border:none;border-radius:20px;background:#007aff14;color:#007aff;font-size:15px;font-weight:600;cursor:pointer;transition:background .2s,transform .2s}.rename-device-btn:hover{background:#007aff1f}.rename-device-btn:active{background:#007aff2e;transform:scale(.97)}.rename-device-btn svg{width:20px;height:20px;fill:#007aff}.leave-session-btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;height:56px;padding:0;margin-top:12px;border:none;border-radius:20px;background:#ff3b3014;color:#ff3b30;font-size:15px;font-weight:600;cursor:pointer;transition:background .2s,transform .2s}.leave-session-btn:hover{background:#ff3b301f}.leave-session-btn:active{background:#ff3b302e;transform:scale(.97)}.leave-session-btn svg{width:20px;height:20px;fill:#ff3b30}#tab-guide>.tab-header{padding-bottom:0}.help-block{background:transparent;padding:24px 0;margin:0 44px}.help-title{font-size:17px;font-weight:700;color:var(--text-main);margin-bottom:12px;display:flex;align-items:center;gap:10px}.help-title svg{width:22px;height:22px;fill:var(--primary)}.help-desc{font-size:14px;color:var(--text-sub);line-height:1.6}.help-list{margin-top:10px;margin-left:20px;color:var(--text-sub);font-size:13px;line-height:1.6}.help-list li{margin-bottom:4px}.bottom-nav{position:fixed;bottom:0;left:0;right:0;z-index:100;display:flex;justify-content:space-around;align-items:center;border-radius:0;padding:10px 16px calc(10px + var(--safe-bottom) + var(--safe-nav-bottom, 0px));backdrop-filter:blur(var(--glass-blur));-webkit-backdrop-filter:blur(var(--glass-blur));background:var(--glass-bg);box-shadow:none;border:none;transition:transform .3s cubic-bezier(.2,.8,.2,1);view-transition-name:bottom-nav}.nav-blur-halo{display:none}[data-theme=light] .bottom-nav{background:var(--glass-bg);box-shadow:none;border:none}[data-theme=dark] .bottom-nav{background:var(--glass-bg);backdrop-filter:blur(var(--glass-blur));-webkit-backdrop-filter:blur(var(--glass-blur));box-shadow:none;border:none}.nav-item{background:none;border:none;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;width:auto;min-width:0;position:relative;padding:0;margin:0;flex:1;min-height:44px;cursor:pointer;transition:color .2s;color:#b0b8c1}.nav-item svg{width:24px;height:24px;fill:currentColor;transition:transform .2s}.nav-item span{display:block;font-size:10px;font-weight:500;text-align:center;line-height:1.2;color:#6b7684}.nav-item.active,.nav-item.active span{color:var(--primary)}.nav-item.active svg{fill:var(--primary);transform:none}.nav-item:active svg{transform:scale(.9)}[data-theme=dark] .nav-item{color:#6b7684}[data-theme=dark] .nav-item span{color:#8b95a1}[data-theme=dark] .nav-item.active,[data-theme=dark] .nav-item.active span{color:var(--primary)}[data-theme=dark] .nav-item.active svg{fill:var(--primary)}.nav-icon-wrapper{position:relative;display:inline-flex}.chat-badge{position:absolute;top:-6px;right:-8px;min-width:16px;height:16px;padding:0 4px;background:#ef4444;color:#fff;font-size:10px;font-weight:700;border-radius:8px;display:none;align-items:center;justify-content:center;line-height:1}.chat-badge.show{display:flex}.toast{position:fixed;bottom:110px;left:0;right:0;display:flex;justify-content:center;transform:translateY(20px);background:none;pointer-events:none;opacity:0;transition:opacity .2s cubic-bezier(.4,0,.6,1),transform .2s cubic-bezier(.4,0,.6,1);z-index:7000}.toast>span{background:#ffffffd9;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);color:#000;padding:14px 28px;border-radius:100px;font-size:14px;font-weight:600;white-space:nowrap}.toast.show{opacity:1;transform:translateY(0);transition:opacity .7s cubic-bezier(.08,.82,.17,1.15),transform .7s cubic-bezier(.08,.82,.17,1.15)}.dialog-overlay{position:fixed;inset:0;display:none;align-items:center;justify-content:center;padding:24px;background:#0009;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);z-index:6000;animation:fadeIn .3s ease-out}.dialog-overlay.show{display:flex}.dialog{width:100%;max-width:400px;border-radius:var(--radius-l);background:var(--glass-bg);border:1px solid var(--glass-border);overflow:hidden;box-shadow:0 24px 64px #00000080;animation:modalSlideUp .4s cubic-bezier(.16,1,.3,1);display:flex;flex-direction:column}.dialog-header{display:flex;align-items:center;justify-content:space-between;padding:24px 28px 12px}.dialog-title{font-size:18px;font-weight:800;letter-spacing:-.02em;color:var(--text-main)}.dialog-close{width:32px;height:32px;border-radius:50%;border:none;background:var(--surface-2);color:var(--text-sub);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s}.dialog-close:active{transform:scale(.9);background:var(--surface-3)}.dialog-close svg{width:18px;height:18px;fill:currentColor}.dialog-message{padding:12px 28px 24px;font-size:15px;color:var(--text-sub);line-height:1.6;white-space:pre-wrap;word-break:keep-all}.dialog-input{display:block;width:100%;margin-top:12px;padding:12px 4px;border:none;border-bottom:2px solid var(--surface-3);border-radius:0;background:none;color:var(--text-main);font-size:15px;font-family:inherit;outline:none;transition:border-bottom-color .2s ease;box-sizing:border-box}.dialog-input:focus{border-bottom-color:var(--primary);outline:none}.dialog-input.invalid{border-bottom-color:#ef4444}.dialog-hint{font-size:12px;color:var(--text-muted);margin-top:8px;min-height:16px;transition:color .2s}.dialog-hint.error{color:#ef4444}@keyframes shake{0%,to{transform:translate(0)}20%{transform:translate(-6px)}40%{transform:translate(5px)}60%{transform:translate(-4px)}80%{transform:translate(3px)}}.dialog-input.shake{animation:shake .4s ease}.dialog-actions{padding:0 28px 32px;display:flex;justify-content:flex-end;gap:10px}.dialog-secondary{border:1px solid var(--glass-border);background:var(--surface-2);color:var(--text-main);border-radius:18px;padding:16px 24px;font-size:15px;font-weight:700;cursor:pointer;min-width:100px;transition:transform .2s,box-shadow .2s}.dialog-secondary:active{transform:scale(.97);box-shadow:none}.dialog-primary{border:none;background:var(--primary);color:#fff;border-radius:18px;padding:16px 32px;font-size:16px;font-weight:700;cursor:pointer;min-width:100px;box-shadow:0 4px 12px #3b82f64d;transition:transform .2s,box-shadow .2s}.dialog-primary:active{transform:scale(.97);box-shadow:none}[data-theme=dark] .toast>span{background:#1e1e1ed9;color:#fff}.onboarding-overlay{position:fixed;inset:0;max-height:var(--app-height, 100dvh);background:var(--bg);z-index:2000;display:none;flex-direction:column;overflow:hidden;padding-top:calc(var(--safe-top) + 16px)}body:has(#setup-overlay.active) header,body:has(#media-source-overlay.active) header,body:has(#youtube-url-overlay.active) header{z-index:1}body:has(#setup-overlay.active) .bottom-nav,body:has(#media-source-overlay.active) .bottom-nav,body:has(#youtube-url-overlay.active) .bottom-nav{opacity:0;pointer-events:none;z-index:1;transform:translateY(20px)}body.overlay-open header{z-index:1}body.overlay-open .bottom-nav{opacity:0;pointer-events:none;z-index:1;transform:translateY(20px)}#setup-desktop-brand{display:none}.setup-mobile-view{display:flex;flex-direction:column;flex:1;width:100%;height:100%;position:relative}#youtube-url-overlay .setup-header-text,#media-source-overlay .setup-header-text{margin-top:40px;margin-bottom:20px}.onboarding-overlay.active{display:flex}.onboarding-card{flex:1;width:100%;display:flex;flex-direction:column;background:transparent;overflow:hidden;position:relative;padding:0;margin:0}.onboarding-card>div:not(.ob-actions){flex:none;padding:0 28px;display:flex;flex-direction:column;justify-content:flex-start;align-items:stretch}.onboarding-card{overflow:hidden}#setup-welcome-area,#setup-code-area,#setup-join-area,#setup-role-area{display:none;flex:1;overflow-y:auto;overflow-x:hidden;padding-top:0;width:100%;flex-direction:column}#setup-role-area .setup-header-text{margin-bottom:42px}.ob-actions{flex:none;display:flex;flex-direction:row;gap:12px;padding:16px 28px calc(24px + env(safe-area-inset-bottom,0));margin-top:auto;background:var(--bg);width:100%;z-index:100;border-top:none}.onboarding-card.full-screen{border-radius:0;box-shadow:none;min-height:100%}.setup-card{padding:32px 28px 24px}.ob-slider-viewport{overflow:hidden;width:100%;margin:4px 0}.ob-slider-track{display:flex;width:100%;transition:transform .6s cubic-bezier(.4,0,.2,1)}.ob-slide{flex:0 0 100%;width:100%;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;text-align:center;gap:16px;padding:0;height:auto}.ob-slide .setup-header-text{width:100%;text-align:center}.ob-slide .ob-title,.ob-slide .ob-desc,.ob-slide .ob-icon-circle{opacity:0;transition:opacity .3s ease-out}.ob-slide.active .ob-icon-circle,.ob-slide.active .ob-title,.ob-slide.active .ob-desc{opacity:1;transition:opacity .5s cubic-bezier(.4,0,.2,1) .15s}.ob-slide .ob-title{font-size:24px;font-weight:800;margin-bottom:8px;color:var(--text-main)}.ob-slide .ob-desc{font-size:14px;color:var(--text-sub);line-height:1.6;word-break:keep-all}.ob-slide .ob-icon-circle{margin:0 auto}.ob-icon-circle{width:84px;height:84px;background:var(--surface-2);border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--primary);margin-bottom:4px}.ob-icon-circle svg{width:38px;height:38px;fill:currentColor}.ob-title{font-size:20px;font-weight:800;color:var(--text-main);letter-spacing:-.5px}.ob-desc{font-size:15.5px;color:var(--text-sub);line-height:1.6;word-break:keep-all;padding:0 16px}.ob-dots{display:flex;align-items:center;justify-content:center;gap:8px}.ob-dot{width:8px;height:8px;border-radius:50%;background:var(--surface-3);cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1)}.ob-dot.active{background:var(--primary);width:24px;border-radius:12px}.ob-nav-row{display:flex;align-items:center;justify-content:center;gap:10px;margin-top:24px;margin-bottom:8px}.ob-nav-arrow{appearance:none;-webkit-appearance:none;border:none;outline:none;background:none;color:var(--text-sub, #888);width:20px;height:20px;display:flex;align-items:center;justify-content:center;padding:0;margin:0;cursor:pointer;border-radius:50%;transition:color .2s,background .15s}.ob-nav-arrow svg{display:block;flex-shrink:0}.ob-nav-arrow:hover{color:var(--primary);background:rgba(var(--primary-rgb, 0, 122, 255),.08)}.ob-nav-arrow:active{transform:scale(.9)}.setup-mobile-view .ob-nav-arrow{display:none}.ob-actions.vertical{flex-direction:column;gap:16px}.ob-actions.horizontal-with-back{flex-direction:row;gap:12px;align-items:center}.btn-ob-primary,.btn-ob-secondary{flex:1;height:56px;border-radius:20px;font-size:15px;font-weight:600;cursor:pointer;border:none;font-family:inherit;transition:transform .2s,box-shadow .2s,background .2s;display:flex;align-items:center;justify-content:center}.btn-ob-icon{width:60px;min-width:60px;height:56px;border-radius:20px;background:var(--surface-2);color:var(--text-sub);display:flex;align-items:center;justify-content:center;border:none;cursor:pointer;transition:transform .2s,background .2s}.btn-ob-icon:active{background:var(--surface-3);transform:scale(.97)}.btn-ob-icon svg{width:24px;height:24px;fill:currentColor;margin-right:2px}.ob-actions.vertical .btn-ob-primary,.ob-actions.vertical .btn-ob-secondary{flex:none;height:56px;width:100%;font-size:15px}.btn-ob-primary{background:var(--primary);color:#fff;box-shadow:0 4px 12px #3b82f64d}.btn-ob-secondary{background:var(--surface-2);color:var(--text-main)}.btn-ob-text-link{background:transparent;color:var(--text-sub);text-decoration:underline;text-underline-offset:4px;font-size:14px;font-weight:500;cursor:pointer;border:none;font-family:inherit;display:flex;align-items:center;justify-content:center;transition:color .2s,background .2s,opacity .2s;flex:1;height:56px;border-radius:20px}.btn-ob-text-link:active{opacity:.7;background:#ffffff0d}.ob-actions.vertical .btn-ob-text-link{flex:none;height:56px;width:100%;font-size:14px;padding:0;margin-top:0}.setup-header-text{width:100%;margin-bottom:56px;text-align:left;flex:none;padding-top:0}.setup-header-text h2{font-size:24px;font-weight:800;margin-bottom:8px;letter-spacing:-.03em;color:var(--text-main);line-height:1.2}.setup-header-text p{font-size:16px;color:var(--text-sub);line-height:1.5;word-break:keep-all}.setup-code-label{text-align:center;width:100%;margin-bottom:8px;font-size:13px;color:var(--text-sub);font-weight:700;text-transform:uppercase;letter-spacing:.05em;opacity:.8}.setup-graphic-container{width:100%;height:auto;min-height:120px;display:flex;flex-direction:column;justify-content:center;align-items:center;margin-bottom:16px;position:relative;background:transparent;border-radius:0;padding:0;overflow:hidden;border:none}.setup-guide-unified{display:flex;flex-direction:column;gap:40px;margin-bottom:24px;width:100%}.setup-unified-item{display:flex;flex-direction:column;align-items:center;justify-content:center;background:transparent;border:none;border-radius:0;padding:0;text-align:center;box-shadow:none}.setup-unified-item .setup-inner-desc{margin-top:6px;font-size:12px;color:var(--text-sub);font-weight:600;line-height:1.4;word-break:keep-all}.setup-code-area-bottom{margin-top:40px;padding:16px 0 32px;border-top:none;text-align:center;width:100%;flex:none}.setup-code-area-bottom .setup-code-label{font-size:13px;margin-bottom:8px;color:var(--text-sub)}.setup-inner-desc{font-size:11.5px;font-weight:700;color:var(--text-sub);text-align:center;margin-top:10px;line-height:1.4;word-break:keep-all;padding:0 10px}#setup-role-grid.channel-grid{padding:0 8px;margin-top:12px;width:100%}#setup-role-grid .ch-opt{background:var(--surface-2);border:2px solid transparent}#setup-role-grid .ch-opt:active{transform:scale(.97);background:var(--surface-3)}#setup-role-grid .ch-opt.selected{background:rgba(var(--primary-rgb),.08);border-color:var(--primary);box-shadow:0 2px 8px rgba(var(--primary-rgb),.15)}.setup-graphic-svg{width:100%;height:100%;max-width:280px}.graphic-host{fill:var(--primary)}.graphic-guest{fill:#8b95a1}.graphic-accent{fill:var(--primary);opacity:.1}.graphic-device{fill:#000;stroke:var(--surface-3);stroke-width:1}.graphic-line{stroke:var(--surface-3);stroke-width:1.2;stroke-dasharray:4 4;fill:none}.graphic-line-active{stroke:var(--primary);stroke-width:2;stroke-dasharray:5 5;opacity:.4;fill:none;animation:graphic-pulse 2s infinite}@keyframes graphic-pulse{0%{stroke-dashoffset:0}to{stroke-dashoffset:-20}}.graphic-text{font-size:10px;font-weight:700;fill:var(--text-sub)}.setup-code{font-size:32px;font-weight:900;letter-spacing:.12em;color:var(--text-main);margin-right:-.12em;align-self:center;font-variant-numeric:tabular-nums}.setup-join-input{width:100%;box-sizing:border-box;text-align:center;background:none;border:none;border-bottom:2px solid var(--surface-3);border-radius:0;padding:8px 0;font-size:32px;font-weight:900;letter-spacing:.12em;color:var(--text-main);caret-color:var(--text-main);align-self:center;font-family:inherit;font-variant-numeric:tabular-nums;transition:border-bottom-color .3s ease;outline:none;box-shadow:none}.setup-join-input::placeholder{color:var(--text-muted);opacity:.3}.setup-join-input:focus{border-bottom-color:var(--primary);outline:none;box-shadow:none}.setup-join-area{margin-top:12px;width:100%;display:flex;flex-direction:column;gap:10px}#youtube-url-overlay .setup-card.full-screen{height:100%;max-height:100%;overflow:hidden}#youtube-url-overlay .setup-card.full-screen .setup-join-area{flex:1;min-height:0;overflow-y:auto}#youtube-url-overlay .setup-card.full-screen .ob-actions{flex-shrink:0}#youtube-url-overlay #youtube-preview-thumb{max-height:35vh;width:100%;object-fit:cover}.setup-slot-list{margin-top:12px;width:100%;display:flex;flex-direction:column;gap:12px;margin-bottom:8px}.btn-ob-primary:hover{box-shadow:0 6px 16px #3b82f659}.btn-ob-secondary:hover{background:var(--surface-3)}.btn-ob-primary:active,.btn-ob-secondary:active{transform:scale(.97)}.btn-ob-primary:active{box-shadow:none}.btn-ob-secondary:active{background:var(--surface-3)}.sync-card-title{font-size:18px;font-weight:800;margin-bottom:24px;color:var(--text-main)}.sync-status-text{font-size:16px;color:var(--primary);font-weight:700;margin-top:16px;min-height:24px}.manual-sync-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#0009;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);z-index:3000;display:none;align-items:center;justify-content:center;opacity:0;transition:opacity .2s ease-out}.manual-sync-overlay.show{display:flex;opacity:1;animation:fadeInScale .2s forwards}@keyframes fadeInScale{0%{opacity:0;transform:scale(.98)}to{opacity:1;transform:scale(1)}}.sync-glass-panel{width:350px;background:var(--glass-bg);backdrop-filter:blur(var(--glass-blur));-webkit-backdrop-filter:blur(var(--glass-blur));box-shadow:0 30px 60px #0006;border-radius:var(--radius-l);padding:32px 28px;display:flex;flex-direction:column;align-items:center;gap:24px;position:relative;animation:fadeInScale .4s cubic-bezier(.16,1,.3,1)}.sync-glass-panel.panel-compact{padding:32px 28px 24px;gap:16px}.panel-compact .sync-header{margin-bottom:0}.panel-compact .sync-actions-row{margin-top:12px}.sync-header{width:100%;text-align:center;display:flex;flex-direction:column;gap:4px;margin-bottom:4px}.sync-label{font-size:14px;font-weight:800;color:var(--text-sub);letter-spacing:1.2px}.sync-value-wrapper{display:flex;align-items:baseline;justify-content:center;gap:2px}.sync-main-val{font-size:40px;font-weight:800;color:var(--text-main);font-variant-numeric:tabular-nums}.sync-unit{font-size:14px;font-weight:600;color:var(--text-sub)}.sync-control-row{display:flex;width:100%;height:100px;gap:12px}.sync-group-side{flex:1;display:flex;gap:8px;align-items:center}.btn-nudge{border:none;border-radius:16px;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;background:var(--surface-2);color:var(--text-main);transition:all .1s}.btn-nudge:active{background:var(--surface-3);transform:scale(.97)}.btn-nudge svg{fill:currentColor}.btn-nudge span{font-size:11px;font-weight:700;opacity:.6}.btn-nudge svg{width:20px;height:20px;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;fill:none}.btn-nudge.large{flex:2;height:100%;font-size:14px}.btn-nudge.large svg{width:32px;height:32px}.btn-nudge.small{flex:1;height:100%}.btn-nudge.small svg{width:18px;height:18px;opacity:.6}.sync-divider{width:1px;background:var(--surface-3);height:100%}.sync-actions-row{display:flex;width:100%;gap:12px;margin-top:24px}.sync-popup-reset-btn,.sync-done-btn{height:56px;border-radius:20px;font-size:14px;font-weight:600;letter-spacing:1px;cursor:pointer;transition:transform .1s,background .2s;border:none;display:flex;align-items:center;justify-content:center;flex:1}.sync-popup-reset-btn{background:var(--surface-2);color:var(--text-sub)}.sync-done-btn{background:var(--text-main);color:var(--bg);box-shadow:0 8px 20px #00000026}#media-source-overlay .file-select-btn-large{border-radius:var(--radius-m);background:var(--surface-2);transition:all .2s cubic-bezier(.2,.8,.2,1)}#media-source-overlay .file-select-btn-large:hover{background:var(--surface-3)}#media-source-overlay .file-select-btn-large:active{transform:scale(.97);background:var(--surface-3)}.sync-popup-reset-btn:active,.sync-done-btn:active{transform:scale(.97)}@keyframes modalSlideUp{0%{opacity:0;transform:translateY(20px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.demo-btn{display:inline-flex;align-items:center;gap:8px;background:var(--primary);color:#fff;padding:12px 24px;border-radius:12px;border:none;font-weight:600;font-size:14px;cursor:pointer;transition:transform .2s;font-family:inherit}.demo-btn:active{transform:scale(.95)}.file-select-btn-large{width:100%;height:56px;padding:0 20px;font-size:15px}.chat-empty,.list-empty-state{display:flex;align-items:center;justify-content:center;color:var(--text-muted);font-size:14px;text-align:center;line-height:1.6}.chat-empty,.list-empty-state{flex:1}.list-empty-state{padding:20px}.chat-group{display:flex;flex-direction:column;max-width:90%;animation:bubbleIn .2s ease-out}.chat-group.mine{align-self:flex-end;align-items:flex-end}.chat-group.others{align-self:flex-start;align-items:flex-start}.chat-row{display:flex;align-items:flex-end;gap:6px}.chat-bubble{max-width:100%;min-width:0;padding:10px 14px;border-radius:14px;font-size:14px;line-height:1.4;overflow-wrap:anywhere;word-break:break-word}@keyframes bubbleIn{0%{opacity:0;transform:translateY(8px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.chat-bubble.mine{background:var(--primary);color:#fff;border-bottom-right-radius:4px}.chat-bubble.others{background:var(--surface-2);color:var(--text-main);border-bottom-left-radius:4px}.chat-bubble:has(.chat-youtube-btn){background:transparent;padding:0}.chat-bubble.has-youtube{background:transparent;padding:0}.chat-sender{font-size:11px;font-weight:700;color:var(--text-sub);margin-bottom:4px;margin-left:2px;text-transform:none}.chat-group.mine .chat-sender{text-align:right;margin-left:0;margin-right:2px}.chat-crown{vertical-align:middle;margin-right:2px;width:14px;height:14px}.chat-badge-host{color:#f5c842}.chat-badge-op{color:#999}.chat-join-order{font-size:.8em;opacity:.5;margin-left:2px}.chat-group.system{align-self:stretch;max-width:100%;align-items:stretch}.chat-group.system .chat-sender{display:none}.chat-group.system .chat-row{width:calc(100% + 32px);margin:0 -16px}.chat-group.system .chat-bubble{background:var(--surface-2);color:var(--text-sub);font-size:12px;text-align:center;width:100%;border-radius:0;padding:10px 16px}.chat-group.system .chat-time{display:none}.chat-text{font-size:14px;line-height:1.5}.chat-time{font-size:10px;font-weight:500;color:var(--text-muted);font-variant-numeric:tabular-nums;margin-bottom:2px;white-space:nowrap}.chat-input-wrapper{display:flex;align-items:center;width:100%;border-bottom:2px solid var(--surface-3);padding-bottom:6px;transition:border-bottom-color .2s;outline:none}.chat-input-wrapper:focus-within{border-bottom-color:var(--primary)}.chat-input{flex:1;background:none;border:none;border-radius:0;padding:10px 4px;font-size:16px;font-weight:500;color:var(--text-main);box-shadow:none;outline:none;-webkit-appearance:none}.chat-input:focus{outline:none;box-shadow:none}.chat-input::placeholder{color:var(--text-muted);opacity:.5}.chat-send-btn{width:36px;height:36px;border:none;background:transparent;color:var(--surface-3);display:flex;justify-content:center;align-items:center;cursor:pointer;flex-shrink:0;box-shadow:none;margin-bottom:0;transition:color .2s ease,transform .2s,opacity .2s}.chat-input:not(:placeholder-shown)+.chat-send-btn{color:var(--primary)}.chat-send-btn:active{transform:scale(.92);opacity:.8}.chat-send-btn svg{width:24px;height:24px;fill:currentColor}.chat-preview-btn{border:none;color:inherit;font:inherit;text-align:left;width:100%;display:flex;justify-content:space-between;align-items:center;height:56px;padding:0 20px;margin-top:20px;background:var(--surface-2);border-radius:20px;cursor:pointer;transition:background .2s,transform .2s;position:relative;overflow:visible}.chat-preview-left,.chat-preview-right{position:relative;z-index:1}.chat-preview-right{display:flex;align-items:center;gap:8px;flex-shrink:0}.chat-preview-btn .role-badge{font-size:11px;padding:4px 10px}.chat-preview-btn:hover{background:var(--surface-3)}.chat-preview-btn:active{background:var(--surface-3);transform:scale(.97)}.chat-preview-left{display:flex;align-items:center;gap:12px;overflow:visible;min-width:0}.chat-preview-icon{width:20px;height:20px;fill:var(--text-sub);flex-shrink:0;transform:translateY(2px)}.chat-icon-wrapper{position:relative;flex-shrink:0}.chat-preview-text{font-size:15px;font-weight:600;line-height:1;color:var(--text-sub);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.chat-preview-badge{position:absolute;top:-6px;right:-8px;background:#ef4444;color:#fff;font-size:10px;font-weight:700;min-width:16px;height:16px;line-height:16px;text-align:center;padding:0 4px;border-radius:8px;display:none;z-index:2}.chat-preview-badge.show{display:block}.chat-backdrop{position:fixed;inset:0;z-index:999;background:transparent;visibility:hidden;-webkit-tap-highlight-color:transparent}.chat-backdrop.open{visibility:visible}.chat-drawer{position:fixed;left:0;right:0;bottom:0;height:50vh;max-height:calc(var(--app-height, 100dvh) * .5);background:var(--surface-1);border-top-left-radius:20px;border-top-right-radius:20px;box-shadow:0 -8px 32px #0003;transform:translateY(100%);transition:transform .2s cubic-bezier(.4,0,.6,1),visibility 0s .2s;z-index:1000;display:flex;flex-direction:column;visibility:hidden}[data-theme=light] .chat-drawer{box-shadow:0 -8px 32px #00000014}.chat-drawer.open{transform:translateY(0);visibility:visible;transition:transform .6s cubic-bezier(.08,.82,.17,1),visibility 0s 0s}.chat-drawer-header{display:flex;justify-content:space-between;align-items:center;padding:16px;border-bottom:none}@media(max-width:1279px){.chat-drawer-header{justify-content:center;padding:16px;background:transparent;cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none}}@media(max-width:1279px){.chat-drawer-header:before{content:"";width:36px;height:4px;border-radius:2px;background:var(--text-sub);opacity:.35}}.chat-drawer-title{font-size:20px;font-weight:700;color:var(--text-main)}.chat-drawer-close{background:none;border:none;width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--text-sub);transition:background .2s}.chat-drawer-close:active{background:var(--surface-2)}.chat-drawer-close svg{width:20px;height:20px;fill:currentColor}@media(max-width:1279px){.chat-drawer-title,.chat-drawer-close{display:none}}.chat-drawer-messages{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:12px;-webkit-overflow-scrolling:touch;overscroll-behavior-y:none}@media(max-width:1279px){.chat-drawer-messages{scrollbar-width:none;-ms-overflow-style:none}.chat-drawer-messages::-webkit-scrollbar{display:none}}.chat-drawer-input{display:flex;align-items:flex-end;gap:12px;padding:10px 16px;padding-bottom:calc(10px + var(--safe-bottom) + var(--safe-nav-bottom, 0px));background:var(--surface-1)}.chat-youtube-btn{display:flex;flex-direction:column;align-items:flex-start;gap:8px;background:red;border:none;color:#fff;padding:14px 16px;border-radius:14px;font-size:13px;cursor:pointer;margin:0;transition:all .2s cubic-bezier(.2,.8,.2,1);width:100%;max-width:260px;box-shadow:0 4px 12px #ff000026}.chat-group.mine .chat-youtube-btn{border-bottom-right-radius:4px}.chat-group.others .chat-youtube-btn{border-bottom-left-radius:4px}.chat-yt-play-row{display:flex;align-items:center;gap:6px;font-weight:800;color:#fff;font-size:14px;font-family:Pretendard,sans-serif;letter-spacing:-.3px}.chat-yt-title{font-size:13px;color:#ffffffe6;line-height:1.45;text-align:left;word-break:break-all;display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.chat-youtube-btn:active{transform:scale(.97);background:#d90000}.chat-timestamp{color:var(--primary);cursor:pointer;text-decoration:underline;font-weight:600;transition:opacity .15s}.chat-bubble.mine .chat-timestamp{color:#fff}.chat-timestamp:active{opacity:.7}:focus-visible{outline:2px solid var(--primary);outline-offset:2px}[data-theme=light] .chat-preview-btn,[data-theme=light] .file-select-btn{background:#fff;box-shadow:none;border:none}[data-theme=light] .chat-preview-btn .chat-preview-text,[data-theme=light] .file-select-btn,[data-theme=light] .file-select-btn span{color:#444}[data-theme=light] .chat-preview-btn .chat-preview-icon,[data-theme=light] .file-select-btn svg{fill:#444}[data-theme=light] .file-select-btn .btn-icon-bg.youtube svg{fill:red}@keyframes blink-primary-light{0%{box-shadow:inset 0 0 0 100px #3b82f666}50%{box-shadow:none}}.blink-hint{animation:blink-primary-light .8s step-end 3}.file-select-btn{display:flex;align-items:center;width:100%;height:72px;margin-top:auto;gap:10px;background:var(--surface-2);border-radius:20px;padding:0 20px;border:2px solid transparent;cursor:pointer;font-family:inherit;transition:all .2s cubic-bezier(.2,.8,.2,1);appearance:none;-webkit-appearance:none;outline:none;color:var(--text-sub);text-align:left}.file-select-btn:hover{background:var(--surface-3);transform:translateY(-2px);box-shadow:0 4px 12px #0000000d}.file-select-btn:active{background:var(--surface-3);color:var(--text-main);transform:scale(.97)}.file-select-btn span{font-size:15px;font-weight:600;letter-spacing:-.3px;flex:1}.btn-icon-bg{width:44px;height:44px;border-radius:14px;background:transparent;display:flex;align-items:center;justify-content:center;margin-right:16px;color:var(--text-main);transition:color .2s}.btn-icon-bg.youtube{color:red}.file-select-btn:hover .btn-icon-bg{background:transparent;color:var(--primary)}.file-select-btn:hover .btn-icon-bg.youtube{color:red}.btn-icon-bg svg{width:24px;height:24px;fill:currentColor}#btn-sync,#btn-media-source{height:56px;padding:0 20px;font-size:14px;gap:12px;display:flex;align-items:center;justify-content:flex-start;color:var(--text-sub)}[data-theme=light] #btn-sync,[data-theme=light] #btn-media-source{color:#444}[data-theme=light] .chat-preview-btn:hover,[data-theme=light] .file-select-btn:hover,[data-theme=light] .btn-copy-invite-link:hover{background:#f0f0f0}[data-theme=light] .chat-preview-btn:active,[data-theme=light] .file-select-btn:active,[data-theme=light] .btn-copy-invite-link:active{background:#e8e8e8}#btn-sync svg,#btn-media-source svg{width:20px;height:20px;fill:currentColor;margin:0}#btn-sync span,#btn-media-source span{font-size:15px;font-weight:600;color:currentColor}#btn-sync:hover,#btn-media-source:hover{background:var(--surface-3)}#btn-sync:active,#btn-media-source:active{background:var(--surface-3);transform:scale(.97)}.graphic-room{opacity:.9;stroke-width:1.5;fill:none;stroke-linecap:round;stroke-linejoin:round}.graphic-room rect{stroke:var(--text-muted)}.graphic-tv{fill:var(--surface-2);stroke:none;opacity:.8}.graphic-listener{fill:var(--surface-3);stroke:none}.graphic-speaker{fill:var(--surface-1);stroke:var(--text-sub);stroke-width:2;transition:fill .3s,stroke .3s,stroke-width .3s;cursor:pointer}.graphic-speaker:hover{stroke:var(--text-main)}.graphic-speaker.active{stroke:var(--primary);fill:#000}.spk-driver{fill:var(--surface-3);stroke:none;transition:all .3s}.graphic-speaker.active .spk-driver{fill:var(--primary);stroke:none}.desktop-help-section,.play-header-desktop{display:none}.qr-container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:16px 0;min-height:120px}.qr-container canvas,.qr-container img{max-width:220px;max-height:220px;border-radius:var(--radius-s, 14px)}.qr-svg{width:200px;height:200px}.qr-svg path{stroke:var(--text-main)!important;fill:var(--text-main)!important}.qr-placeholder{font-size:13px;color:var(--text-sub);text-align:center;padding:32px 0}.btn-copy-invite-link{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;height:56px;padding:0;margin-top:14px;border:none;border-radius:20px;background:var(--surface-2);color:var(--text-sub);font-size:15px;font-weight:600;cursor:pointer;transition:background .2s,transform .2s}.btn-copy-invite-link svg{width:20px;height:20px;fill:currentColor}.btn-copy-invite-link:hover{background:var(--surface-3)}.btn-copy-invite-link:active{background:var(--surface-3);transform:scale(.97)}.number-stepper{display:flex;align-items:center;justify-content:center;gap:12px;padding:8px 20px}.stepper-btn{position:relative;display:block;width:36px;height:36px;border-radius:50%;border:none;background:var(--surface-2);color:var(--text);font-size:0;padding:0;cursor:pointer;transition:background .15s;-webkit-tap-highlight-color:transparent;user-select:none}.stepper-btn:before{content:"";position:absolute;top:50%;left:50%;width:11px;height:1.5px;background:currentColor;opacity:.8;transform:translate(-50%,-50%)}.stepper-btn[data-dir="1"]:after{content:"";position:absolute;top:50%;left:50%;width:1.5px;height:11px;background:currentColor;opacity:.8;transform:translate(-50%,-50%)}.stepper-btn:active{background:var(--surface-3)}.stepper-btn:disabled{opacity:.3;cursor:default}.stepper-value{width:48px;text-align:center;font-size:22px;font-weight:700;line-height:36px;font-variant-numeric:tabular-nums;color:var(--text);cursor:pointer;border-bottom:2px solid var(--divider, #333);padding-bottom:2px;transition:border-color .15s;flex-shrink:0}.stepper-value.editing{border-bottom-color:var(--primary, #4a90d9)}.stepper-input{width:100%;background:transparent;border:none;color:var(--text);font-size:22px;font-weight:700;text-align:center;font-variant-numeric:tabular-nums;outline:none;padding:0;line-height:36px;-moz-appearance:textfield}.stepper-input::-webkit-outer-spin-button,.stepper-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.connect-device-list{display:flex;flex-direction:column;gap:0}.connect-device-list .section-row{border-bottom:1px solid var(--surface-3)}.connect-device-list .section-row:last-child{border-bottom:none}.settings-subtab-nav{display:none}.settings-subtab-panel{display:block}.settings-subtab-panel[data-panel=connect],.settings-device-section,.settings-subtab-panel[data-panel=help]{display:none}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}}@layer desktop{@media(min-width:1280px){body{display:grid;grid-template-columns:1fr 420px 420px;grid-template-rows:var(--header-height) 1fr 1fr;grid-template-areas:"header header header" "tab-play tab-playlist tab-settings" "tab-play tab-chat tab-settings";gap:0;padding-bottom:0;padding-right:24px;padding-left:24px;background:var(--bg);overflow:hidden;height:var(--app-height, 100vh);max-height:var(--app-height, 100vh)}header{grid-area:header;position:relative;width:100vw;margin-left:-24px;padding-left:24px;padding-right:24px;box-sizing:border-box;box-shadow:none;background:var(--glass-bg);border-bottom:none;margin-bottom:0}.bottom-nav,.nav-blur-halo,.bottom-nav:before{display:none}#btn-chat-close,#chat-preview-btn{display:none}#tab-play,.chat-drawer,#tab-playlist,#tab-settings,#tab-guide,#tab-connect{padding-top:0;display:flex;flex-direction:column;opacity:1;visibility:visible;pointer-events:auto;position:relative;transform:none;height:100%;top:0;left:0;width:100%;background:transparent;border-radius:0;border:none;box-shadow:none;overflow:hidden}.tab-body,.chat-drawer-messages{flex:1;overflow-y:auto;padding-bottom:16px;scrollbar-gutter:stable}#tab-play .tab-body{padding-bottom:0}#tab-play .controls-area{margin-top:auto;margin-bottom:0;padding-bottom:40px}.tab-header,.chat-drawer-header{flex:none;padding:32px 32px 16px;position:relative;background:transparent;z-index:10;border-bottom:none;margin-bottom:0}.tab-title,.chat-drawer-title,.track-title{font-size:24px;font-weight:800;letter-spacing:-.02em;color:var(--text-main)}#tab-play{grid-area:tab-play;flex-direction:column;justify-content:flex-start;align-items:center;padding:0 0 0 8px;border-right:1px solid var(--divider);min-width:0;min-height:0;max-width:100%;gap:16px;overflow-y:auto;overflow-x:hidden}#tab-playlist{padding:0 0 0 8px;border-right:1px solid var(--divider);border-bottom:1px solid var(--divider)}.chat-drawer{padding:0;border-right:1px solid var(--divider);background:transparent;box-shadow:none}#tab-settings{padding:0 0 0 8px}.play-header-desktop{display:none}.play-action-buttons{position:relative;bottom:auto;left:auto;right:auto;width:100%;max-width:calc(100% - 80px);margin-left:auto;margin-right:auto;gap:12px;margin-top:auto;padding-bottom:0;flex-shrink:0;justify-content:center}.play-action-buttons .file-select-btn-large{padding:0 20px;font-size:15px}.vinyl-wrapper{width:clamp(160px,min(22vw,30vh),320px);height:clamp(160px,min(22vw,30vh),320px);flex-shrink:0;flex-basis:auto;aspect-ratio:auto;min-height:auto;margin-top:auto;margin-bottom:0}.video-wrapper{width:100%;max-width:min(90%,1080px,calc((100vh - 360px) * 16 / 9));margin:auto auto 0;border-radius:20px;box-shadow:none}.controls-area{max-width:100%;padding:0 32px 32px;margin-top:auto;flex-grow:0}.play-controls-left{margin-bottom:24px}.chat-drawer{grid-area:tab-chat}.chat-backdrop{display:none!important}.chat-drawer-header{cursor:default;touch-action:auto}.chat-drawer-header:before{display:none}#tab-playlist{grid-area:tab-playlist}#tab-settings{grid-area:tab-settings}#tab-guide,#tab-connect{display:none}.settings-subtab-nav{display:flex!important;gap:4px;padding:16px 20px 0;border-bottom:1px solid var(--divider);margin:0 12px}.subtab-pill{flex:1;padding:10px 0;font-size:13px;font-weight:600;color:var(--text-sub);background:none;border:none;border-bottom:2px solid transparent;cursor:pointer;transition:color .2s,border-color .2s;text-align:center}.subtab-pill:hover{color:var(--text-main)}.subtab-pill.active{color:var(--primary);border-bottom-color:var(--primary)}.settings-subtab-panel{display:none}.settings-subtab-panel.active{display:block}.settings-device-section{display:none}#desktop-connect-content .qr-container,#desktop-connect-content .device-list,#desktop-connect-content .number-stepper{margin-left:20px;margin-right:20px}#setup-overlay{position:fixed;inset:0;z-index:5000;background:var(--bg);backdrop-filter:none;-webkit-backdrop-filter:none}#setup-overlay .setup-card.full-screen{position:fixed;inset:0;width:100vw;max-width:none;height:var(--app-height, 100vh);max-height:var(--app-height, 100vh);border-radius:0;border:none;outline:none;box-shadow:none;background:transparent;padding:0;transform:none;display:grid;grid-template-columns:1fr 480px;grid-template-rows:1fr;overflow:hidden}#setup-desktop-brand{display:flex;flex:1;background:var(--bg);flex-direction:column;justify-content:flex-start;align-items:flex-start;text-align:left;padding:0;color:var(--text-main);position:relative;overflow:hidden}#setup-desktop-brand .brand-content{display:none}.desktop-step-header{display:block;padding:clamp(48px,7vh,80px) clamp(48px,5vw,80px) 0;width:100%;z-index:2}.desktop-step-header .logo-svg{height:clamp(22px,calc(-34px + 4.375vw),29px);width:auto;margin-top:clamp(3px,calc(-18px + 1.625vw),5px);margin-bottom:12px}.desktop-step-header h2{font-size:clamp(24px,calc(-40px + 5vw),32px);font-weight:800;letter-spacing:-.03em;color:var(--text-main);margin-bottom:8px;line-height:1.2}.desktop-step-header p{font-size:clamp(16px,1.25vw,18px);color:var(--text-sub);opacity:.75;line-height:1.5}.desktop-diagram-area{display:flex;flex:1;width:100%;align-items:center;justify-content:center;padding:clamp(16px,3vh,40px) clamp(40px,6vw,100px);position:relative;overflow:visible}#setup-overlay .setup-mobile-view .setup-header-text{display:none}#setup-overlay .setup-mobile-view{width:480px;min-width:480px;background:var(--surface-1);height:100%;box-shadow:none;padding:0;overflow-y:auto;scrollbar-gutter:stable;-ms-overflow-style:auto;display:flex;flex-direction:column;justify-content:center}#setup-overlay .setup-mobile-view::-webkit-scrollbar{width:8px;height:8px}#setup-overlay .setup-mobile-view::-webkit-scrollbar-track{margin-top:20px;margin-bottom:20px;background:transparent}#setup-overlay .setup-mobile-view::-webkit-scrollbar-thumb{background-color:var(--scrollbar-thumb);border:2px solid transparent;border-radius:10px;background-clip:padding-box}#setup-overlay .setup-mobile-view::-webkit-scrollbar-thumb:hover{background-color:var(--scrollbar-thumb-hover)}#setup-overlay .setup-mobile-view::-webkit-scrollbar-thumb:active{background-color:var(--scrollbar-thumb-active)}.desktop-diagram-area #ob-slider-area{width:100%;display:flex!important;flex-direction:column;align-items:center;justify-content:center;transform:scale(1);transform-origin:center center}@media(min-height:750px){.desktop-diagram-area #ob-slider-area{transform:scale(1.1)}}@media(min-height:900px){.desktop-diagram-area #ob-slider-area{transform:scale(1.2)}}.desktop-diagram-area .ob-slider-viewport{width:clamp(320px,60%,560px)}.desktop-diagram-area .ob-nav-row{margin-top:24px}.desktop-diagram-area .ob-icon-circle{width:clamp(72px,8vw,100px);height:clamp(72px,8vw,100px)}.desktop-diagram-area .ob-icon-circle svg{width:clamp(32px,3.5vw,44px);height:clamp(32px,3.5vw,44px)}.desktop-diagram-area .ob-slide .ob-title{font-size:clamp(22px,2.2vw,28px)}.desktop-diagram-area .ob-slide .ob-desc{font-size:clamp(13px,1.1vw,15px)}.ob-nav-arrow{width:22px;height:22px}.desktop-diagram-area .setup-graphic-container{width:100%!important;max-width:none!important;max-height:none!important;height:auto!important;min-height:0;margin:0!important;display:flex;align-items:center;justify-content:center}.desktop-diagram-area .setup-graphic-svg{max-width:clamp(480px,60vw,780px);width:100%;height:auto}.desktop-diagram-area .setup-guide-unified{width:100%!important;display:flex!important;flex-direction:column;align-items:center;gap:clamp(40px,6vh,72px);margin:0!important}.desktop-diagram-area .setup-guide-unified .setup-graphic-svg{max-width:clamp(420px,55vw,680px)!important;height:clamp(100px,16vh,200px)!important}.desktop-diagram-area .setup-unified-item .setup-inner-desc{font-size:clamp(14px,1.3vw,18px)}#setup-overlay .setup-mobile-view .ob-actions{background:var(--surface-1);padding:16px 36px 40px 44px;border-top:none;margin-top:auto;flex-shrink:0}#setup-overlay #setup-welcome-area,#setup-overlay #setup-code-area,#setup-overlay #setup-join-area,#setup-overlay #setup-role-area{flex:1;flex-direction:column;justify-content:center;align-items:stretch}.setup-mobile-view>div:not(.ob-actions,.setup-header-pill){padding-left:44px;padding-right:36px}#media-source-overlay,#youtube-url-overlay{position:relative;grid-area:tab-play;z-index:5000;background:var(--bg);backdrop-filter:none;-webkit-backdrop-filter:none;border-right:1px solid var(--divider);padding:0;border-radius:0;overflow-x:hidden;overflow-y:scroll;scrollbar-gutter:stable;-ms-overflow-style:auto;display:none;height:100%;max-height:100%;min-height:0;min-width:0;width:100%;max-width:100%;box-sizing:border-box;inset:auto}#media-source-overlay.active,#youtube-url-overlay.active{display:flex;flex-direction:column}#media-source-overlay::-webkit-scrollbar,#youtube-url-overlay::-webkit-scrollbar{width:8px;height:8px}#media-source-overlay::-webkit-scrollbar-track,#youtube-url-overlay::-webkit-scrollbar-track{margin-top:20px;margin-bottom:20px;background:transparent}#media-source-overlay::-webkit-scrollbar-thumb,#youtube-url-overlay::-webkit-scrollbar-thumb{background-color:#ffffff26;border:2px solid transparent;border-radius:10px;background-clip:padding-box}#media-source-overlay::-webkit-scrollbar-thumb:hover,#youtube-url-overlay::-webkit-scrollbar-thumb:hover{background-color:#ffffff59}#media-source-overlay::-webkit-scrollbar-thumb:active,#youtube-url-overlay::-webkit-scrollbar-thumb:active{background-color:#ffffff8c}#media-source-overlay .setup-card.full-screen,#youtube-url-overlay .setup-card.full-screen{position:relative;top:0;left:0;transform:none;width:100%;height:auto;min-height:100%;max-height:none;border-radius:0;border:none;box-shadow:none;background:transparent;padding:0;display:flex;flex-direction:column}#setup-role-area .setup-graphic-container{margin-left:0;margin-right:0;width:100%}.setup-card.full-screen>*{flex-shrink:0}#media-source-overlay .setup-card.full-screen>div:not(.ob-actions),#youtube-url-overlay .setup-card.full-screen>div:not(.ob-actions){padding-left:40px;padding-right:40px}#media-source-overlay .setup-card.full-screen .ob-actions,#youtube-url-overlay .setup-card.full-screen .ob-actions{background:transparent;padding-left:40px;padding-right:40px;padding-bottom:40px}#youtube-url-overlay .setup-card.full-screen{height:100%;max-height:100%;overflow:hidden}#youtube-url-overlay .setup-card.full-screen .setup-join-area{flex:1;min-height:0;overflow-y:auto}#youtube-url-overlay .setup-card.full-screen .ob-actions{flex-shrink:0;margin-top:auto}#youtube-url-overlay #youtube-preview{max-height:calc(100vh - 420px);overflow-y:auto}#youtube-url-overlay #youtube-preview-thumb{max-height:40vh;width:100%;object-fit:cover}.desktop-help-section{display:block;margin-top:28px}button[data-tab=guide]{display:none}.section-group{background:transparent;margin:0 12px;box-shadow:none;border:none;border-radius:0;border-bottom:1px dotted var(--divider)}.section-group:last-of-type,#last-setting-section,#battery-section{border-bottom:none}#tab-settings .channel-grid{padding:12px 20px}.section-header-row{border-bottom:none;padding:44px 20px 16px}.rename-device-btn,.leave-session-btn{margin-left:20px;margin-right:20px;width:calc(100% - 40px)}#youtube-settings-disabled-wrap .section-group:first-of-type .section-header-row{padding-top:44px}.section-title{font-size:17px;font-weight:700;color:var(--text-main);text-transform:none;letter-spacing:normal}.slider-wrap{padding:6px 20px}.slider-header{font-weight:500;color:var(--text-sub);margin-bottom:8px}.slider-header>span{color:var(--text-sub)}.slider-header .val-disp{font-weight:700;color:var(--primary)}.help-block{background:transparent;margin:0 16px 16px;padding:16px;border:none;box-shadow:none}.playlist-ul{margin:0 16px}.tab-body{-ms-overflow-style:auto;overflow-y:scroll;scrollbar-gutter:stable}.tab-body::-webkit-scrollbar{width:8px;height:8px}.tab-body::-webkit-scrollbar-track{margin-top:10px;margin-bottom:20px;background:transparent}.tab-body::-webkit-scrollbar-thumb{background-color:#ffffff26;border:2px solid transparent;border-radius:10px;background-clip:padding-box}.tab-body::-webkit-scrollbar-thumb:hover{background-color:#ffffff59}.tab-body::-webkit-scrollbar-thumb:active{background-color:#ffffff8c}.chat-drawer-messages{-ms-overflow-style:auto;overflow-y:scroll;scrollbar-gutter:stable;padding-left:24px}.chat-group.system .chat-row{width:calc(100% + 40px);margin:0 -16px 0 -24px}.chat-drawer-messages::-webkit-scrollbar{width:8px;height:8px}.chat-drawer-messages::-webkit-scrollbar-track{margin-bottom:20px;background:transparent}.chat-drawer-messages::-webkit-scrollbar-thumb{background-color:#ffffff26;border:2px solid transparent;border-radius:10px;background-clip:padding-box}.chat-drawer-messages::-webkit-scrollbar-thumb:hover{background-color:#ffffff59}.chat-drawer-messages::-webkit-scrollbar-thumb:active{background-color:#ffffff8c}[data-theme=light] .tab-body::-webkit-scrollbar-thumb{background-color:#0003}[data-theme=light] .tab-body::-webkit-scrollbar-thumb:hover{background-color:#0006}[data-theme=light] .tab-body::-webkit-scrollbar-thumb:active{background-color:#0009}[data-theme=light] .chat-drawer-messages::-webkit-scrollbar-thumb{background-color:#0003}[data-theme=light] .chat-drawer-messages::-webkit-scrollbar-thumb:hover{background-color:#0006}[data-theme=light] .chat-drawer-messages::-webkit-scrollbar-thumb:active{background-color:#0009}.track-item{border-bottom:none}.chat-drawer-input{background:transparent}.play-action-buttons{justify-content:center}.play-action-buttons .file-select-btn{height:56px;width:160px!important;min-width:160px!important;padding:0 16px;border-radius:20px;flex:none!important;justify-content:center;align-items:center}.play-action-buttons span{display:block;font-size:15px;font-weight:600}.play-action-buttons .file-select-btn svg{width:22px;height:22px;margin:0 8px 0 0}}}
