/* Artwork above, every listening control within reach. */ html #globalPlayer.omu-player-refined{--mp-paper:#fff;--mp-ink:#202a38;--mp-muted:#5e6a7b;--mp-line:#e1e6ed;transition:none!important;transform:none!important;max-width:400px!important;color:var(--mp-ink);font-family:'Pretendard Variable',Pretendard,-apple-system,BlinkMacSystemFont,'Noto Sans KR',sans-serif} html #globalPlayer.omu-player-refined:not(.player-expanded){width:min(400px,calc(100vw - 32px))!important;max-width:400px!important;right:16px!important;left:auto!important;bottom:max(16px,env(safe-area-inset-bottom))!important;height:auto!important} html #globalPlayer.omu-player-refined.player-expanded{width:min(340px,calc(100vw - 32px))!important;max-width:340px!important;right:16px!important;left:auto!important;bottom:max(16px,env(safe-area-inset-bottom))!important;height:auto!important} #globalPlayer.omu-player-refined button{font-family:inherit;touch-action:manipulation;transition:background-color .16s,color .16s,transform .16s} #globalPlayer.omu-player-refined button:disabled{opacity:.38;cursor:not-allowed} #globalPlayer.omu-player-refined button:active:not(:disabled){transform:scale(.97)!important} #globalPlayer.omu-player-refined :is(button,input,[role=slider]):focus-visible{outline:3px solid #8a9bae!important;outline-offset:3px!important} /* Compact light dock with the same controls on mouse and touch devices. */ #globalPlayer.omu-player-refined #minimizedPlayer{display:flex;height:64px!important;padding:8px 10px 10px!important;gap:6px;background:#fff!important;color:#30343e;border:1px solid #e0e4ec!important;border-radius:12px!important;box-shadow:0 6px 24px #1f29371a!important;backdrop-filter:none!important} #globalPlayer.omu-player-refined #minimizedPlayer .minimized-shell{height:44px!important;padding:0!important;gap:9px!important;min-width:0;flex:1 1 0;background:transparent!important;border-radius:7px!important;box-shadow:none!important} #globalPlayer.omu-player-refined #minimizedPlayer .minimized-disc{width:42px!important;height:42px!important;flex-basis:42px!important;border:1px solid #e5e7ee!important;border-radius:7px!important;background:#f3f4f7!important;box-shadow:none!important;animation:none!important} #globalPlayer.omu-player-refined #minimizedPlayer .minimized-title{font-size:13px!important;line-height:1.4!important;font-weight:650!important;color:#30343e!important;letter-spacing:-.3px} #globalPlayer.omu-player-refined #minimizedPlayer .minimized-artist{font-size:11px!important;line-height:1.4!important;color:#858b97!important;margin-top:2px!important} #globalPlayer.omu-player-refined #minimizedPlayer .minimized-expand-cue{width:14px;height:14px;flex:none;color:#9097a4;margin-left:auto} #globalPlayer.omu-player-refined #minimizedPlayer .minimized-controls{gap:3px!important;flex:none} #globalPlayer.omu-player-refined #minimizedPlayer .minimized-controls button{width:44px!important;height:44px!important;min-width:44px!important;min-height:44px!important;flex:0 0 44px;padding:0!important;background:transparent!important;color:#687180!important;border:0!important;border-radius:50%!important;box-shadow:none!important} #globalPlayer.omu-player-refined #minimizedPlayer .minimized-controls button:hover{background:#f1f3f7!important} #globalPlayer.omu-player-refined #minimizedPlayer .minimized-controls .minimized-play-toggle{background:var(--omu-primary,#6D3BE8)!important;color:#fff!important} #globalPlayer.omu-player-refined #minimizedPlayer .minimized-controls .minimized-play-toggle:hover{background:var(--omu-primary-hover,#5D32C5)!important} #globalPlayer.omu-player-refined #minimizedPlayer .minimized-previous-btn:not(.hidden):not([hidden]){display:inline-flex!important} #globalPlayer.omu-player-refined #minimizedPlayer .minimized-controls svg{width:19px;height:19px} #globalPlayer.omu-player-refined #minimizedProgress{left:13px!important;right:13px!important;bottom:5px!important;height:2px!important;background:#e4e7ee!important;border-radius:2px} #globalPlayer.omu-player-refined #minimizedProgress span{background:var(--omu-primary-muted, #AF93F2)!important} /* Full-bleed art stays at the top at every viewport size. */ #globalPlayer.omu-player-refined #playerContainer{display:block;position:relative;background:#fff!important;border:1px solid #d8e0e9!important;border-radius:15px!important;box-shadow:0 16px 52px #192b432b!important;max-height:calc(var(--omu-player-safe-viewport-height,100dvh) - 36px)!important;overflow:hidden!important;isolation:isolate} #globalPlayer.omu-player-refined .player-compact-main{display:block;min-height:0;max-height:inherit;border-radius:14px;overflow:hidden;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#c1ccda transparent;overscroll-behavior:contain} #globalPlayer.omu-player-refined #playerThumbnailArea{position:relative;display:block!important;width:100%;height:220px!important;min-height:0!important;max-height:none!important;aspect-ratio:auto!important;padding:0!important;background:#e5eaf1!important;border-radius:0;overflow:hidden!important} #globalPlayer.omu-player-refined #playerDisplayImage,#globalPlayer.omu-player-refined #playerDisplayVideo{position:absolute!important;inset:0;width:100%!important;height:100%!important;max-width:none!important;max-height:none!important;aspect-ratio:auto;margin:0!important;border:0;border-radius:0!important;box-shadow:none!important;object-fit:cover;object-position:center;grid-area:auto!important} #globalPlayer.omu-player-refined #playerVisualScrim{display:block!important;pointer-events:none;background:linear-gradient(180deg,#101c2b2e,transparent 38%,transparent 63%,#101c2b2e);z-index:1} #globalPlayer.omu-player-refined .player-stream-meta{position:absolute!important;top:12px!important;left:12px!important;z-index:2} #globalPlayer.omu-player-refined #playerRadioBadge{background:#fffffff0!important;color:var(--omu-primary, #6D3BE8)!important;border:0!important;border-radius:4px!important;font-size:9px;letter-spacing:.05em;padding:4px 7px;box-shadow:none!important} #globalPlayer.omu-player-refined #playerModeHint{background:#fffffff0!important;color:#4c5a6d!important;border:0!important;font-size:10px} #globalPlayer.omu-player-refined #playerTopControls{position:absolute!important;display:flex;top:8px;right:8px;gap:4px;margin:0;z-index:3} #globalPlayer.omu-player-refined #playerTopControls button{width:44px;height:44px;min-width:44px;min-height:44px;padding:0;color:#3b4c63!important;background:#fffffff2!important;border:1px solid #ffffffa6!important;border-radius:8px!important;box-shadow:0 2px 8px #17273d14!important;backdrop-filter:none!important} #globalPlayer.omu-player-refined #playerTopControls button:hover{background:#fff!important;color:#1e304b!important} #globalPlayer.omu-player-refined #playerTopControls svg{width:18px;height:18px} #globalPlayer.omu-player-refined #playerLikeBtn{position:absolute;right:10px;bottom:10px;display:flex;align-items:center;justify-content:center;gap:7px;min-width:64px;min-height:44px;height:44px;padding:0 11px;border:1px solid #ffffffba!important;border-radius:22px!important;background:#fffffff2!important;color:#34455f!important;box-shadow:0 2px 10px #1523381c!important;z-index:3} #globalPlayer.omu-player-refined #playerLikeBtn svg{width:20px;height:20px;flex:none} #globalPlayer.omu-player-refined #playerLikeCount{font-size:12px;font-weight:700;font-variant-numeric:tabular-nums;line-height:1;color:inherit} #globalPlayer.omu-player-refined #playerLikeBtn[aria-pressed=true]{color:var(--omu-primary, #6D3BE8)!important;background:var(--omu-primary-subtle, #FBFAFE)!important;border-color:var(--omu-primary-soft, #F5F1FD)!important} #globalPlayer.omu-player-refined #playerLikeBtn[aria-pressed=true] svg{fill:var(--omu-primary, #6D3BE8);stroke:var(--omu-primary, #6D3BE8)} #globalPlayer.omu-player-refined .player-compact-body{display:flex;flex-direction:column;min-width:0;padding:12px 14px 13px;background:#fff} #globalPlayer.omu-player-refined #playerInfoOverlay{position:static!important;padding:0!important;background:transparent!important;pointer-events:auto;grid-area:auto!important;min-width:0;flex:none} #globalPlayer.omu-player-refined #playerTitle{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap!important;margin:0;font-size:20px!important;font-weight:730!important;line-height:1.4!important;letter-spacing:-.5px;color:#202b3b!important;text-shadow:none!important} #globalPlayer.omu-player-refined #playerArtist{font-size:12px!important;color:#56657a!important;line-height:1.5!important;margin:3px 0 0!important;text-shadow:none!important} #globalPlayer.omu-player-refined #playerCreator{font-size:10px!important;line-height:1.35;color:#66768b!important;margin:2px 0 0!important;text-shadow:none!important} #globalPlayer.omu-player-refined #progressContainer{position:relative;height:28px!important;min-height:28px!important;flex:0 0 28px!important;width:100%!important;margin:2px 0 0!important;background:linear-gradient(#dce3ed,#dce3ed) center/100% 3px no-repeat!important;border-radius:0;cursor:pointer;touch-action:none} #globalPlayer.omu-player-refined #progressBar{top:12px!important;height:3px!important;background:var(--omu-primary, #6D3BE8)!important;border-radius:3px} #globalPlayer.omu-player-refined #progressBar>div{position:absolute;right:-4px;top:50%;width:8px;height:8px;transform:translateY(-50%);border-radius:50%;background:var(--omu-primary, #6D3BE8)!important;opacity:1!important;box-shadow:none!important} #globalPlayer.omu-player-refined #playerTimeDisplay{display:flex;justify-content:space-between;align-items:center;padding:0!important;margin-top:-4px;color:#5e6d82!important;font-size:10px;line-height:1.4;font-variant-numeric:tabular-nums;flex:none} #globalPlayer.omu-player-refined #playerControlsOverlay{position:static!important;display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr));align-items:center;justify-items:center;gap:0;padding:5px 0 4px!important;opacity:1!important;pointer-events:auto!important;background:transparent!important;grid-area:auto!important;flex:none} #globalPlayer.omu-player-refined #playerControlsOverlay>.shuffle-control-shell,#globalPlayer.omu-player-refined #playerControlsOverlay>.repeat-control-shell{position:relative;width:100%;display:grid;place-items:center} #globalPlayer.omu-player-refined #playerControlsOverlay button{display:flex;align-items:center;justify-content:center;width:44px!important;height:44px!important;min-width:44px;padding:0!important;border:0!important;border-radius:9px!important;background:transparent!important;color:#465a74!important;box-shadow:none!important} #globalPlayer.omu-player-refined #playerControlsOverlay #playPauseBtn{width:50px!important;height:50px!important;min-width:50px;flex:0 0 50px;color:#fff!important;background:var(--omu-primary, #6D3BE8)!important;border-radius:50%!important;box-shadow:none!important} #globalPlayer.omu-player-refined #playerControlsOverlay button:hover:not(:disabled){background:#eef3f8!important} #globalPlayer.omu-player-refined #playerControlsOverlay #playPauseBtn:hover{background:var(--omu-primary-hover, #5D32C5)!important} #globalPlayer.omu-player-refined #playerControlsOverlay svg{width:22px;height:22px} #globalPlayer.omu-player-refined #playerControlsOverlay #shuffleBtn svg,#globalPlayer.omu-player-refined #playerControlsOverlay #repeatBtn svg{width:18px;height:18px} #globalPlayer.omu-player-refined #playerControlsOverlay .player-option-label{display:none} #globalPlayer.omu-player-refined #playerControlsOverlay [aria-pressed=true]:not(#playPauseBtn){background:var(--omu-primary-soft, #F5F1FD)!important;color:#263e61!important} #globalPlayer.omu-player-refined #shuffleStateBadge,#globalPlayer.omu-player-refined #repeatModeBadge{position:absolute;right:calc(50% - 23px);bottom:0;font-size:8px;color:#3a5b8c!important;pointer-events:none} #globalPlayer.omu-player-refined #shuffleStateBadge[data-shuffle-state=off]{display:none!important} /* Volume is a single slim row, followed by five always-visible tools. */ #globalPlayer.omu-player-refined .player-volume-row{display:flex;align-items:center;gap:5px;border-top:1px solid #e5ebf2;margin-top:2px;padding-top:2px;min-height:44px;flex:none} #globalPlayer.omu-player-refined .player-volume-control{display:flex;align-items:center;gap:6px;flex:1;min-width:0;padding:0;margin:0} #globalPlayer.omu-player-refined .player-volume-slider-wrap{position:static!important;inset:auto!important;display:flex;align-items:center;gap:8px;flex:1;min-width:0;opacity:1!important;visibility:visible!important;transform:none!important;background:transparent!important;border:0!important;padding:0!important;box-shadow:none!important} #globalPlayer.omu-player-refined .player-volume-label{font-size:10px;color:#64758c;flex:none} #globalPlayer.omu-player-refined #volumeSlider{width:100%;min-width:0;height:44px;appearance:none;-webkit-appearance:none;accent-color:#667d9b;background:linear-gradient(#d7e0ec,#d7e0ec) center/100% 3px no-repeat!important;cursor:pointer} #globalPlayer.omu-player-refined #volumeSlider::-webkit-slider-thumb{width:10px;height:10px;border:0;border-radius:50%;background:var(--omu-primary, #6D3BE8)!important;appearance:none;-webkit-appearance:none} #globalPlayer.omu-player-refined #volumeSlider::-moz-range-thumb{width:10px;height:10px;border:0;border-radius:50%;background:var(--omu-primary, #6D3BE8)!important} #globalPlayer.omu-player-refined .player-volume-row button{display:flex;align-items:center;justify-content:center;width:44px;height:44px;min-width:44px;min-height:44px;padding:0;border:0!important;border-radius:7px!important;background:transparent!important;color:#526986!important;box-shadow:none!important} #globalPlayer.omu-player-refined .player-volume-row button svg{width:18px;height:18px;flex:none} #globalPlayer.omu-player-refined .player-volume-row #addSongToPlaylistBtn,#globalPlayer.omu-player-refined .player-volume-row #radioDjTalkToggleBtn{flex-direction:column;gap:1px} #globalPlayer.omu-player-refined .player-volume-row .player-utility-label,#globalPlayer.omu-player-refined #radioDjTalkToggleLabel{font-size:9px;line-height:1.3;color:inherit} #globalPlayer.omu-player-refined #playerBottomControls{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr));padding:0!important;margin-top:4px;gap:4px!important;background:transparent!important;border:0!important;flex:none} #globalPlayer.omu-player-refined #playerBottomControls>button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;height:49px;min-height:49px;min-width:44px;width:100%;padding:4px 3px!important;border:1px solid #e0e7f0!important;border-radius:7px!important;font-size:10px;font-weight:600;line-height:1.2;letter-spacing:-.25px;color:#415773!important;background:#f3f6fa!important;box-shadow:none!important;white-space:nowrap} #globalPlayer.omu-player-refined #playerBottomControls>button:hover:not(:disabled){background:#e8eff7!important;border-color:#c9d7e8!important} #globalPlayer.omu-player-refined #playerBottomControls>button svg{width:17px;height:17px;flex:none} #globalPlayer.omu-player-refined #lyricsBtnLabel,#globalPlayer.omu-player-refined #playerBottomControls .player-utility-label{display:inline!important;font-size:10px!important;line-height:1.2;color:inherit;letter-spacing:-.3px} #globalPlayer.omu-player-refined #lyricsBtn.is-active{background:#e3ebf6!important;color:#2a456c!important;border-color:#b8cce6!important} #globalPlayer.omu-player-refined #playerKakaoExternalBanner{margin:8px 0 0!important;padding:8px;background:#fff8e2!important;color:#7c692e!important;border:1px solid #eaddaf;border-radius:7px;font-size:11px} #globalPlayer.omu-player-refined #playerKakaoExternalBanner>div{flex-direction:column;align-items:stretch} #globalPlayer.omu-player-refined #playerKakaoExternalBanner button{min-height:44px} @media(max-width:1023px){ html #globalPlayer.omu-player-refined,html #globalPlayer.omu-player-refined:not(.player-expanded){right:12px!important;width:min(400px,calc(100vw - 24px))!important;max-width:400px!important;bottom:calc(var(--omu-player-mobile-bottom-offset,0px) + max(10px,env(safe-area-inset-bottom)))!important} html #globalPlayer.omu-player-refined.player-expanded{right:12px!important;width:min(340px,calc(100vw - 24px))!important;max-width:340px!important;bottom:calc(var(--omu-player-mobile-bottom-offset,0px) + max(10px,env(safe-area-inset-bottom)))!important} #globalPlayer.omu-player-refined #playerContainer{max-height:calc(var(--omu-player-safe-viewport-height,100dvh) - var(--omu-player-mobile-bottom-offset,0px) - max(10px,env(safe-area-inset-bottom)) - 16px)!important} } @media(max-width:639px){ #globalPlayer.omu-player-refined #minimizedPlayer{height:64px!important;padding:8px 8px 10px!important;gap:4px!important;border-radius:12px!important} #globalPlayer.omu-player-refined #minimizedPlayer .minimized-shell{height:44px!important;gap:8px!important} #globalPlayer.omu-player-refined #minimizedPlayer .minimized-disc{width:38px!important;height:38px!important;flex-basis:38px!important;border-radius:6px!important} #globalPlayer.omu-player-refined #minimizedPlayer .minimized-title{font-size:13px!important} #globalPlayer.omu-player-refined #minimizedPlayer .minimized-artist{font-size:11px!important} #globalPlayer.omu-player-refined #minimizedPlayer .minimized-previous-btn:not(.hidden):not([hidden]){display:none!important} #globalPlayer.omu-player-refined #minimizedPlayer .minimized-controls{gap:0!important} #globalPlayer.omu-player-refined #minimizedPlayer .minimized-expand-cue{width:12px;height:12px} #globalPlayer.omu-player-refined #playerThumbnailArea{height:min(220px,calc((100vw - 24px)/1.72))!important} #globalPlayer.omu-player-refined .player-compact-body{padding:11px 13px 12px} #globalPlayer.omu-player-refined #playerTitle{font-size:17px!important} } @media(max-width:359px){ #globalPlayer.omu-player-refined .player-compact-body{padding-inline:12px} #globalPlayer.omu-player-refined #playerTitle{font-size:18px!important} #globalPlayer.omu-player-refined #minimizedPlayer .minimized-expand-cue{display:none} #globalPlayer.omu-player-refined #playerBottomControls{gap:3px!important} #globalPlayer.omu-player-refined #playerBottomControls>button{padding-inline:2px!important} } @media(prefers-reduced-motion:reduce){#globalPlayer.omu-player-refined,#globalPlayer.omu-player-refined *{animation:none!important;transition:none!important}} /* Runtime visibility remains authoritative, including radio-only actions. */ #globalPlayer.omu-player-refined[hidden],#globalPlayer.omu-player-refined.hidden,html body #globalPlayer.omu-player-refined #playerContainer.hidden,html body #globalPlayer.omu-player-refined #minimizedPlayer.hidden,html body #globalPlayer.omu-player-refined :is(#playerContainer,#minimizedPlayer) .hidden,html body #globalPlayer.omu-player-refined :is(#playerContainer,#minimizedPlayer) [hidden]{display:none!important} /* Short landscape windows keep every primary action on screen, with art still above. */ @media(max-height:520px) and (min-width:560px){ html #globalPlayer.omu-player-refined.player-expanded{width:min(500px,calc(100vw - 24px))!important;max-width:500px!important} #globalPlayer.omu-player-refined #playerThumbnailArea{height:64px!important} #globalPlayer.omu-player-refined #playerDisplayImage,#globalPlayer.omu-player-refined #playerDisplayVideo{object-position:center 46%} #globalPlayer.omu-player-refined #playerTopControls{top:16px;right:8px} #globalPlayer.omu-player-refined #playerLikeBtn{top:16px;bottom:auto;left:12px;right:auto} #globalPlayer.omu-player-refined .player-stream-meta{top:26px!important;left:90px!important} #globalPlayer.omu-player-refined .player-compact-body{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:12px;row-gap:3px;padding:8px!important} #globalPlayer.omu-player-refined #playerInfoOverlay{grid-row:1;grid-column:1/-1;padding-right:92px!important} #globalPlayer.omu-player-refined #playerTitle{font-size:16px!important;line-height:1.4!important} #globalPlayer.omu-player-refined #playerArtist,#globalPlayer.omu-player-refined #playerCreator{display:none!important} #globalPlayer.omu-player-refined #playerTimeDisplay{grid-row:1;grid-column:2;align-self:center;justify-self:end;gap:12px;min-width:80px;width:auto;margin:0;font-size:10px} #globalPlayer.omu-player-refined #progressContainer{grid-row:2;grid-column:1/-1;height:28px!important;min-height:28px!important;margin:0!important} #globalPlayer.omu-player-refined #playerControlsOverlay{grid-row:3;grid-column:1;height:48px;min-height:48px;padding:0!important} #globalPlayer.omu-player-refined #playerControlsOverlay #playPauseBtn{width:48px!important;height:48px!important;min-width:48px;flex-basis:48px} #globalPlayer.omu-player-refined .player-volume-row{grid-row:3;grid-column:2;align-self:center;min-height:44px;height:44px;margin:0;padding:0;border:0} #globalPlayer.omu-player-refined #playerBottomControls{grid-row:4;grid-column:1/-1;margin:0;gap:5px!important} #globalPlayer.omu-player-refined #playerBottomControls>button{height:44px;min-height:44px;padding-block:3px!important;gap:3px} #globalPlayer.omu-player-refined #playerKakaoExternalBanner{grid-column:1/-1;grid-row:5} } @media(max-height:360px) and (min-width:560px){ #globalPlayer.omu-player-refined #playerThumbnailArea{height:58px!important} #globalPlayer.omu-player-refined #playerTopControls{top:7px} #globalPlayer.omu-player-refined #playerLikeBtn{top:7px} #globalPlayer.omu-player-refined .player-stream-meta{top:17px!important} } /* Small translucent visuals retain generous, separate 44px hit targets. */ #globalPlayer.omu-player-refined #playerTopControls{gap:0} #globalPlayer.omu-player-refined #playerTopControls button{position:relative;color:#4b5563!important;background:transparent!important;border:0!important;border-radius:6px!important;box-shadow:none!important;backdrop-filter:none!important} #globalPlayer.omu-player-refined #playerTopControls button::before{content:'';position:absolute;inset:6px;border:1px solid #e2e6ed;border-radius:6px;background:#fffffff2;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);pointer-events:none} #globalPlayer.omu-player-refined #playerTopControls button:hover{color:#30343e!important;background:transparent!important} #globalPlayer.omu-player-refined #playerTopControls button:hover::before{background:#f2f4f8;border-color:#d8deea} #globalPlayer.omu-player-refined #playerTopControls button svg{position:relative;width:16px;height:16px;z-index:1;stroke-width:1.7} #globalPlayer.omu-player-refined #playerLikeBtn{position:absolute;min-width:54px;height:44px;min-height:44px;padding:0 8px;gap:5px;background:transparent!important;border:0!important;border-radius:6px!important;color:#4b5563!important;box-shadow:none!important} #globalPlayer.omu-player-refined #playerLikeBtn::before{content:'';position:absolute;inset:6px 2px;border:1px solid #e2e6ed;border-radius:6px;background:#fffffff2;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);pointer-events:none} #globalPlayer.omu-player-refined #playerLikeBtn svg{position:relative;width:16px;height:16px;z-index:1;stroke-width:1.7} #globalPlayer.omu-player-refined #playerLikeCount{position:relative;z-index:1;font-size:10px;font-weight:650;line-height:1} #globalPlayer.omu-player-refined #playerLikeBtn:hover::before{background:#f2f4f8} #globalPlayer.omu-player-refined #playerLikeBtn[aria-pressed=true]{color:var(--omu-primary-ink, #572FBA)!important;background:transparent!important;border-color:transparent!important} #globalPlayer.omu-player-refined #playerLikeBtn[aria-pressed=true] svg{fill:var(--omu-primary-ink, #572FBA);stroke:var(--omu-primary-ink, #572FBA)} #globalPlayer.omu-player-refined #playerLikeBtn:disabled,#globalPlayer.omu-player-refined #playerTopControls button:disabled{opacity:.6} /* 1:1 artwork: the expanded player shows the cover as an inset square card. Short landscape windows keep the compact strip layout defined above. */ @media not all and (max-height:520px) and (min-width:560px){ #globalPlayer.omu-player-refined .player-compact-main{padding-top:10px} #globalPlayer.omu-player-refined #playerThumbnailArea{--mp-art-size:min(168px,calc(100% - 24px),max(120px,calc(var(--omu-player-safe-viewport-height,100dvh) - var(--omu-player-mobile-bottom-offset,0px) - 300px)));width:var(--mp-art-size)!important;height:auto!important;aspect-ratio:1/1!important;margin:0 auto!important;border-radius:12px!important;background:#e9edf3!important;box-shadow:0 10px 28px #17273d26,0 0 0 1px #17273d0f!important} #globalPlayer.omu-player-refined #playerDisplayImage,#globalPlayer.omu-player-refined #playerDisplayVideo{border-radius:inherit!important} #globalPlayer.omu-player-refined #playerVisualScrim{border-radius:inherit;background:linear-gradient(180deg,#101c2b40,transparent 30%,transparent 70%,#101c2b40)} #globalPlayer.omu-player-refined .player-compact-body{padding:10px 12px 12px} #globalPlayer.omu-player-refined #playerTitle{font-size:19px!important} /* Easier seeking: thicker track that grows under the pointer, visible thumb */ #globalPlayer.omu-player-refined #progressContainer{margin-top:3px!important;background-size:100% 4px!important} #globalPlayer.omu-player-refined #progressBar{top:12px!important;height:4px!important;border-radius:4px} #globalPlayer.omu-player-refined #progressBar>div{width:12px;height:12px;right:-6px;box-shadow:0 1px 4px #17273d40!important;transition:transform .15s} #globalPlayer.omu-player-refined #progressContainer:hover #progressBar>div,#globalPlayer.omu-player-refined #progressContainer:focus-visible #progressBar>div{transform:translateY(-50%) scale(1.25)} #globalPlayer.omu-player-refined #playerControlsOverlay{padding:3px 0 3px!important} #globalPlayer.omu-player-refined #playerControlsOverlay #playPauseBtn{width:48px!important;height:48px!important;min-width:48px;flex-basis:48px;box-shadow:none!important} #globalPlayer.omu-player-refined #playerControlsOverlay #playPauseBtn svg{width:24px;height:24px} } @media (max-width:559px),(max-width:639px) and (min-height:521px){ #globalPlayer.omu-player-refined #playerThumbnailArea{--mp-art-size:min(156px,calc(100% - 24px),max(112px,calc(var(--omu-player-safe-viewport-height,100dvh) - var(--omu-player-mobile-bottom-offset,0px) - 300px)))} #globalPlayer.omu-player-refined .player-compact-main{padding-top:10px} #globalPlayer.omu-player-refined .player-compact-body{padding:10px 12px 12px} } /* Icon-only controls: one stroke icon set, no boxed labels. Names stay in title/aria-label. */ #globalPlayer.omu-player-refined .omu-icon{display:block;flex:none} #globalPlayer.omu-player-refined #playerControlsOverlay svg{width:24px;height:24px} #globalPlayer.omu-player-refined #playerControlsOverlay #shuffleBtn svg,#globalPlayer.omu-player-refined #playerControlsOverlay #repeatBtn svg{width:20px;height:20px} #globalPlayer.omu-player-refined #playerControlsOverlay #playPauseBtn svg{width:24px;height:24px} #globalPlayer.omu-player-refined .omu-icon-play{transform:translateX(1px)} #globalPlayer.omu-player-refined #playerControlsOverlay button{border-radius:50%!important} /* Toggle state: tinted icon plus a small dot instead of ON/ALL text */ #globalPlayer.omu-player-refined #shuffleStateBadge{display:none!important} #globalPlayer.omu-player-refined #repeatModeBadge{display:none!important} #globalPlayer.omu-player-refined #repeatModeBadge[data-repeat-mode=one]:not(.hidden){display:grid!important;place-items:center;right:calc(50% - 19px);top:6px;bottom:auto;min-width:13px;height:13px;padding:0 3px;border-radius:7px;background:#27364c;color:#fff!important;font-size:8px;font-weight:700;line-height:1} #globalPlayer.omu-player-refined #playerControlsOverlay [aria-pressed=true]:not(#playPauseBtn){position:relative;background:transparent!important;color:var(--omu-primary-ink,#572FBA)!important} #globalPlayer.omu-player-refined #playerControlsOverlay [aria-pressed=true]:not(#playPauseBtn)::after{content:'';position:absolute;left:50%;bottom:5px;width:4px;height:4px;margin-left:-2px;border-radius:50%;background:currentColor} /* Hide the text labels; buttons keep their accessible names */ #globalPlayer.omu-player-refined .player-volume-row .player-volume-label,#globalPlayer.omu-player-refined #playerBottomControls .player-utility-label,#globalPlayer.omu-player-refined .player-volume-row .player-utility-label,#globalPlayer.omu-player-refined #lyricsBtnLabel,#globalPlayer.omu-player-refined #radioDjTalkToggleLabel{display:none!important} /* Shared icon button look for the tool buttons */ #globalPlayer.omu-player-refined :is(#addSongToPlaylistBtn,#radioDjTalkToggleBtn,#volumeToggleBtn,#playerBottomControls>button){display:flex!important;flex-direction:row!important;align-items:center;justify-content:center;gap:0!important;height:44px!important;min-height:44px!important;min-width:44px!important;padding:0!important;border:0!important;border-radius:12px!important;background:transparent!important;color:#5a6a80!important;box-shadow:none!important;font-size:0} #globalPlayer.omu-player-refined :is(#addSongToPlaylistBtn,#radioDjTalkToggleBtn,#volumeToggleBtn,#playerBottomControls>button):hover:not(:disabled){background:#eef2f7!important;color:#1f2d40!important} #globalPlayer.omu-player-refined :is(#addSongToPlaylistBtn,#radioDjTalkToggleBtn,#playerBottomControls>button) svg{width:21px!important;height:21px!important} #globalPlayer.omu-player-refined #volumeToggleBtn svg{width:20px!important;height:20px!important} #globalPlayer.omu-player-refined :is(#lyricsBtn.is-active,#radioDjTalkToggleBtn[aria-pressed=true]){background:#e8effa!important;color:var(--omu-primary-ink,#572FBA)!important} /* One volume row, then one evenly spaced toolbar (4-6 icons depending on mode) */ @media not all and (max-height:520px) and (min-width:560px){ #globalPlayer.omu-player-refined .player-compact-body{flex-flow:row wrap!important;align-items:center} #globalPlayer.omu-player-refined .player-compact-body>*{flex:0 0 100%!important;min-width:0} #globalPlayer.omu-player-refined #playerInfoOverlay{order:1} #globalPlayer.omu-player-refined #progressContainer{order:2;flex:0 0 100%!important} #globalPlayer.omu-player-refined #playerTimeDisplay{order:3} #globalPlayer.omu-player-refined #playerControlsOverlay{order:4} #globalPlayer.omu-player-refined .player-volume-row,#globalPlayer.omu-player-refined #playerBottomControls{display:contents!important} #globalPlayer.omu-player-refined .player-volume-control{order:5;flex:0 0 100%;gap:4px;margin-top:2px!important;padding:2px 2px 0!important;border-top:1px solid #edf1f6} #globalPlayer.omu-player-refined #volumeSlider{height:40px} #globalPlayer.omu-player-refined #lyricsBtn{order:6} #globalPlayer.omu-player-refined #playlistBtn{order:7} #globalPlayer.omu-player-refined #addSongToPlaylistBtn{order:8} #globalPlayer.omu-player-refined #randomPlayBtn{order:9} #globalPlayer.omu-player-refined #radioDjTalkToggleBtn{order:10} #globalPlayer.omu-player-refined :is(#addSongToPlaylistBtn,#radioDjTalkToggleBtn,#playerBottomControls>button){flex:1 1 0!important;width:auto!important;margin-top:2px} #globalPlayer.omu-player-refined #playerKakaoExternalBanner{order:12} } /* The primary close action is always available, including the minimized touch dock. */ html #globalPlayer.omu-player-refined #minimizedPlayer .minimized-controls .minimized-close-btn,html #globalPlayer.omu-player-refined #playerCloseBtn{display:inline-flex!important;align-items:center;justify-content:center;visibility:visible!important} /* ==== v4 (2026-10-10): refined light player ==== Card: "지금 재생 중" header row, artwork with a soft tinted backdrop (--mp-art, js/omu-player-save.js), title + like, seek, transport, volume, then labelled tools: 가사 · 재생목록 · 저장 · 카톡 공유. Selectors start with "html body #globalPlayer.omu-player-refined" (2,1,2+) so they beat the layers above, while the runtime .hidden / [hidden] rule (2,2,2) still wins: never add a second class to a display rule. */ html body #globalPlayer.omu-player-refined{--mp4-accent:var(--omu-primary,#6D3BE8);--mp4-accent-hover:var(--omu-primary-hover,#5D32C5);--mp4-accent-ink:var(--omu-primary-ink,#572FBA);--mp4-soft:var(--omu-primary-soft,#F5F1FD);--mp4-ink:#1d1d1f;--mp4-text:#3a3a40;--mp4-muted:#6b6b74;--mp4-line:#ececf1;--mp4-fill:#f3f3f6} html body #globalPlayer.omu-player-refined .mp-sr{position:absolute!important;width:1px!important;height:1px!important;margin:-1px!important;padding:0!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;white-space:nowrap!important;border:0!important} html body #globalPlayer.omu-player-refined.player-expanded{width:min(360px,calc(100vw - 32px))!important;max-width:360px!important} @media(max-width:1023px){html body #globalPlayer.omu-player-refined.player-expanded{width:min(360px,calc(100vw - 24px))!important;max-width:360px!important}} /* Card + tinted backdrop */ html body #globalPlayer.omu-player-refined #playerContainer{border:1px solid rgba(0,0,0,.07)!important;border-radius:24px!important;background:#fff!important;box-shadow:0 30px 80px -24px rgba(17,17,26,.4),0 2px 8px rgba(17,17,26,.06)!important} html body #globalPlayer.omu-player-refined #playerContainer::before{content:"";position:absolute;inset:-60px -60px auto;height:300px;z-index:0;background:var(--mp-art,none) center/cover no-repeat;filter:blur(42px) saturate(1.6);opacity:.55;pointer-events:none} html body #globalPlayer.omu-player-refined #playerContainer::after{content:"";position:absolute;inset:0 0 auto;height:340px;z-index:0;background:linear-gradient(180deg,rgba(255,255,255,.2) 0%,rgba(255,255,255,.72) 50%,#fff 82%);pointer-events:none} html body #globalPlayer.omu-player-refined .player-compact-main{position:relative;z-index:1;padding:0!important;background:transparent!important} /* Header row */ html body #globalPlayer.omu-player-refined .mp-head{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:10px 10px 2px 18px} html body #globalPlayer.omu-player-refined .mp-head__label{display:inline-flex;align-items:center;gap:8px;margin:0;color:var(--mp4-text);font-size:12px;font-weight:750;letter-spacing:.04em;line-height:1} html body #globalPlayer.omu-player-refined .mp-head__eq{display:inline-flex;align-items:flex-end;gap:2px;height:12px} html body #globalPlayer.omu-player-refined .mp-head__eq i{display:block;width:3px;height:100%;border-radius:2px;background:var(--mp4-accent);transform:scaleY(.4);transform-origin:bottom} html body #globalPlayer.omu-player-refined:has(#pauseIcon:not(.hidden)) .mp-head__eq i{animation:mp4-eq 1s ease-in-out infinite} html body #globalPlayer.omu-player-refined .mp-head__eq i:nth-child(2){animation-delay:-.33s} html body #globalPlayer.omu-player-refined .mp-head__eq i:nth-child(3){animation-delay:-.66s} html body #globalPlayer.omu-player-refined #playerTopControls{position:static!important;display:flex!important;gap:2px!important;margin:0!important;inset:auto!important} html body #globalPlayer.omu-player-refined #playerTopControls button{position:relative;display:grid;place-items:center;width:40px!important;height:40px!important;min-width:40px!important;min-height:40px!important;padding:0!important;border:0!important;border-radius:50%!important;background:rgba(255,255,255,.6)!important;color:var(--mp4-text)!important;box-shadow:none!important;backdrop-filter:blur(8px)!important} html body #globalPlayer.omu-player-refined #playerTopControls button::before{display:none!important} html body #globalPlayer.omu-player-refined #playerTopControls button:hover{background:#fff!important;color:var(--mp4-ink)!important} html body #globalPlayer.omu-player-refined #playerTopControls svg{width:18px!important;height:18px!important;stroke-width:2!important} /* Artwork */ @media not all and (max-height:520px) and (min-width:560px){ html body #globalPlayer.omu-player-refined #playerThumbnailArea{--mp-art-size:min(236px,calc(100% - 56px),max(140px,calc(var(--omu-player-safe-viewport-height,100dvh) - var(--omu-player-mobile-bottom-offset,0px) - 440px)));width:var(--mp-art-size)!important;height:var(--mp-art-size)!important;aspect-ratio:1/1!important;margin:8px auto 0!important;border-radius:18px!important;background:var(--mp4-fill)!important;box-shadow:0 24px 44px -20px rgba(17,17,26,.6),0 0 0 1px rgba(0,0,0,.05)!important} } html body #globalPlayer.omu-player-refined #playerVisualScrim{background:linear-gradient(180deg,rgba(0,0,0,.18),transparent 34%)!important} /* Body: title + like, seek, transport, volume, tools */ html body #globalPlayer.omu-player-refined .player-compact-body{position:relative;z-index:1;display:flex!important;flex-flow:column nowrap!important;align-items:stretch!important;gap:0;padding:18px 20px 16px!important;background:transparent!important} html body #globalPlayer.omu-player-refined .player-compact-body>*{flex:none!important} html body #globalPlayer.omu-player-refined .mp-titlebar{order:1;display:flex;align-items:center;gap:12px;min-width:0} html body #globalPlayer.omu-player-refined #playerInfoOverlay{order:1!important;flex:1 1 auto!important;min-width:0;text-align:left!important} html body #globalPlayer.omu-player-refined #playerTitle{font-size:19px!important;font-weight:800!important;line-height:1.35!important;letter-spacing:-.02em!important;color:var(--mp4-ink)!important} html body #globalPlayer.omu-player-refined #playerArtist{margin-top:2px!important;font-size:14px!important;font-weight:500!important;color:var(--mp4-muted)!important;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} html body #globalPlayer.omu-player-refined #playerCreator{font-size:12px!important;color:var(--mp4-muted)!important} html body #globalPlayer.omu-player-refined #playerLikeBtn{order:2!important;position:static!important;inset:auto!important;flex:none;display:inline-flex;align-items:center;gap:6px;height:40px!important;min-height:40px!important;min-width:40px!important;padding:0 13px!important;border:1px solid var(--mp4-line)!important;border-radius:999px!important;background:rgba(255,255,255,.85)!important;color:var(--mp4-text)!important;box-shadow:none!important} html body #globalPlayer.omu-player-refined #playerLikeBtn::before{display:none!important} html body #globalPlayer.omu-player-refined #playerLikeBtn svg{width:19px!important;height:19px!important;stroke-width:1.9!important} html body #globalPlayer.omu-player-refined #playerLikeCount{font-size:13px!important;font-weight:750!important} html body #globalPlayer.omu-player-refined #playerLikeBtn:hover:not(:disabled){border-color:var(--mp4-accent)!important;color:var(--mp4-accent-ink)!important} html body #globalPlayer.omu-player-refined #playerLikeBtn[aria-pressed=true]{border-color:transparent!important;background:var(--mp4-soft)!important;color:var(--mp4-accent)!important} html body #globalPlayer.omu-player-refined #playerLikeBtn[aria-pressed=true] svg{fill:var(--mp4-accent);stroke:var(--mp4-accent)} html body #globalPlayer.omu-player-refined #progressContainer{order:2;margin:10px 0 0!important;background-image:linear-gradient(#e6e6ec,#e6e6ec)!important;background-size:100% 4px!important} html body #globalPlayer.omu-player-refined #progressBar{background:var(--mp4-accent)!important} html body #globalPlayer.omu-player-refined #progressBar>div{background:var(--mp4-accent)!important} html body #globalPlayer.omu-player-refined #playerTimeDisplay{order:3;display:flex!important;justify-content:space-between!important;align-items:center;width:100%!important;margin-top:-2px!important;color:var(--mp4-muted)!important;font-size:12px!important;font-weight:600} html body #globalPlayer.omu-player-refined #playerTimeDisplay .player-time-separator{display:none} html body #globalPlayer.omu-player-refined #playerControlsOverlay{order:4;padding:6px 0 4px!important} html body #globalPlayer.omu-player-refined #playerControlsOverlay button{color:var(--mp4-text)!important} html body #globalPlayer.omu-player-refined #playerControlsOverlay button:hover:not(:disabled){background:var(--mp4-fill)!important;color:var(--mp4-ink)!important} html body #globalPlayer.omu-player-refined #playerControlsOverlay #playPauseBtn{width:58px!important;height:58px!important;min-width:58px!important;flex-basis:58px!important;background:var(--mp4-accent)!important;color:#fff!important;box-shadow:0 14px 26px -12px var(--mp4-accent)!important} html body #globalPlayer.omu-player-refined #playerControlsOverlay #playPauseBtn:hover{background:var(--mp4-accent-hover)!important} html body #globalPlayer.omu-player-refined #playerControlsOverlay #playPauseBtn svg{width:26px!important;height:26px!important} html body #globalPlayer.omu-player-refined #playerControlsOverlay [aria-pressed=true]:not(#playPauseBtn){color:var(--mp4-accent)!important} html body #globalPlayer.omu-player-refined .player-volume-row{order:5;display:flex!important;align-items:center;gap:6px;min-height:40px;margin:2px 0 0!important;padding:0!important;border:0!important} html body #globalPlayer.omu-player-refined .player-volume-control{flex:1 1 auto!important;margin:0!important;padding:0!important;border:0!important} html body #globalPlayer.omu-player-refined #volumeToggleBtn{width:36px!important;min-width:36px!important;height:36px!important;min-height:36px!important;color:var(--mp4-muted)!important} html body #globalPlayer.omu-player-refined #volumeSlider{height:36px!important;background-image:linear-gradient(#e6e6ec,#e6e6ec)!important;background-size:100% 4px!important} html body #globalPlayer.omu-player-refined #volumeSlider::-webkit-slider-thumb{width:14px!important;height:14px!important;background:#fff!important;box-shadow:0 0 0 1px rgba(0,0,0,.12),0 2px 6px rgba(0,0,0,.2)!important} html body #globalPlayer.omu-player-refined #volumeSlider::-moz-range-thumb{width:14px!important;height:14px!important;background:#fff!important;box-shadow:0 0 0 1px rgba(0,0,0,.12),0 2px 6px rgba(0,0,0,.2)!important} html body #globalPlayer.omu-player-refined #addSongToPlaylistBtn{display:none!important} html body #globalPlayer.omu-player-refined #radioDjTalkToggleBtn{flex:none!important;width:auto!important;padding:0 12px!important;height:34px!important;min-height:34px!important;border-radius:999px!important;background:var(--mp4-soft)!important;color:var(--mp4-accent-ink)!important;font-size:12px!important;gap:6px!important} html body #globalPlayer.omu-player-refined #radioDjTalkToggleBtn svg{width:16px!important;height:16px!important} html body #globalPlayer.omu-player-refined #radioDjTalkToggleLabel{display:inline!important;font-size:12px!important;font-weight:750} /* Labelled tools */ html body #globalPlayer.omu-player-refined #playerBottomControls{order:6;display:grid!important;grid-template-columns:none!important;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:6px!important;margin:12px 0 0!important;padding:12px 0 0!important;border:0!important;border-top:1px solid var(--mp4-line)!important;background:transparent!important} html body #globalPlayer.omu-player-refined #playerBottomControls>button{display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:6px!important;width:auto!important;height:auto!important;min-height:66px!important;min-width:0!important;padding:4px 2px!important;margin:0!important;border:0!important;border-radius:14px!important;background:transparent!important;color:var(--mp4-text)!important;box-shadow:none!important;font-size:12px!important;opacity:1} html body #globalPlayer.omu-player-refined #playerBottomControls>#lyricsBtn{order:1} html body #globalPlayer.omu-player-refined #playerBottomControls>#playlistBtn{order:2} html body #globalPlayer.omu-player-refined #playerBottomControls>#playerSaveBtn{order:3} html body #globalPlayer.omu-player-refined #playerBottomControls>#kakaoShareBtn{order:4;background:transparent!important;border:0!important;box-shadow:none!important} html body #globalPlayer.omu-player-refined #playerBottomControls>#randomPlayBtn{display:none!important} html body #globalPlayer.omu-player-refined #playerBottomControls>button>span{display:grid!important} html body #globalPlayer.omu-player-refined #playerBottomControls .mp-act__icon{position:relative;place-items:center;width:42px;height:42px;border-radius:14px;background:var(--mp4-fill);color:var(--mp4-ink);transition:background .16s,color .16s,transform .16s} html body #globalPlayer.omu-player-refined #playerBottomControls .mp-act__icon svg{width:21px!important;height:21px!important} html body #globalPlayer.omu-player-refined #playerBottomControls>button>.mp-act__label{display:block!important;font-size:12px;font-weight:750;line-height:1.2;color:var(--mp4-text);white-space:nowrap;letter-spacing:-.01em} html body #globalPlayer.omu-player-refined #playerBottomControls>button:hover:not(:disabled) .mp-act__icon{background:#e9e9ef;transform:translateY(-1px)} html body #globalPlayer.omu-player-refined #playerBottomControls>button:disabled{opacity:.4!important} html body #globalPlayer.omu-player-refined #playerBottomControls>#lyricsBtn.is-active .mp-act__icon, html body #globalPlayer.omu-player-refined #playerBottomControls>#playlistBtn[aria-expanded=true] .mp-act__icon, html body #globalPlayer.omu-player-refined.mp-save-open #playerBottomControls>#playerSaveBtn .mp-act__icon{background:var(--mp4-accent);color:#fff} html body #globalPlayer.omu-player-refined #playerBottomControls>#lyricsBtn.is-active>.mp-act__label, html body #globalPlayer.omu-player-refined #playerBottomControls>#playlistBtn[aria-expanded=true]>.mp-act__label{color:var(--mp4-accent-ink)} html body #globalPlayer.omu-player-refined #playerBottomControls .mp-act__icon--kakao{background:#FEE500;color:#29241c} html body #globalPlayer.omu-player-refined #playerBottomControls>#kakaoShareBtn:hover:not(:disabled) .mp-act__icon--kakao{background:#f5dc00} html body #globalPlayer.omu-player-refined #playerBottomControls .mp-act__icon--kakao svg{width:22px!important;height:22px!important} html body #globalPlayer.omu-player-refined #playerBottomControls .mp-act__badge{position:absolute;top:-5px;right:-7px;display:grid;place-items:center;min-width:19px;height:19px;padding:0 5px;border:2px solid #fff;border-radius:999px;background:var(--mp4-accent);color:#fff;font-size:10px;font-weight:800;line-height:1;font-variant-numeric:tabular-nums} html body #globalPlayer.omu-player-refined #playerBottomControls .mp-act__badge[hidden]{display:none!important} html body #globalPlayer.omu-player-refined #playerKakaoExternalBanner{order:7} /* Save-to-playlist sheet */ html body #globalPlayer.omu-player-refined .mp-save{position:absolute;inset:0;z-index:40;display:flex;align-items:flex-end;background:rgba(17,17,26,.32);border-radius:inherit} html body #globalPlayer.omu-player-refined .mp-save[hidden]{display:none!important} html body #globalPlayer.omu-player-refined .mp-save__panel{display:flex;flex-direction:column;gap:12px;width:100%;max-height:90%;padding:18px 18px 16px;border-radius:22px 22px 0 0;background:#fff;box-shadow:0 -16px 40px -18px rgba(17,17,26,.4);animation:mp4-up .22s cubic-bezier(.2,.8,.2,1)} html body #globalPlayer.omu-player-refined .mp-save__head{display:flex;align-items:center;justify-content:space-between;gap:10px} html body #globalPlayer.omu-player-refined .mp-save__title{margin:0;color:var(--mp4-ink);font-size:17px;font-weight:800;letter-spacing:-.02em} html body #globalPlayer.omu-player-refined .mp-save__close{display:grid;place-items:center;width:38px;height:38px;padding:0;border:0;border-radius:50%;background:var(--mp4-fill);color:var(--mp4-text);cursor:pointer} html body #globalPlayer.omu-player-refined .mp-save__close svg{width:18px;height:18px} html body #globalPlayer.omu-player-refined .mp-save__song{display:flex;align-items:center;gap:12px;min-width:0;padding:10px;border-radius:16px;background:var(--mp4-fill)} html body #globalPlayer.omu-player-refined .mp-save__song img{width:48px;height:48px;flex:none;border-radius:11px;object-fit:cover;background:#e6e6ec} html body #globalPlayer.omu-player-refined .mp-save__song-copy{min-width:0} html body #globalPlayer.omu-player-refined .mp-save__song-title{margin:0;overflow:hidden;color:var(--mp4-ink);font-size:15px;font-weight:750;text-overflow:ellipsis;white-space:nowrap} html body #globalPlayer.omu-player-refined .mp-save__song-artist{margin:2px 0 0;overflow:hidden;color:var(--mp4-muted);font-size:13px;text-overflow:ellipsis;white-space:nowrap} html body #globalPlayer.omu-player-refined .mp-save__status{margin:0;color:var(--mp4-muted);font-size:13px;line-height:1.5} html body #globalPlayer.omu-player-refined .mp-save__status:empty{display:none} html body #globalPlayer.omu-player-refined .mp-save__status[data-tone=error]{color:#b4233c} html body #globalPlayer.omu-player-refined .mp-save__status[data-tone=success]{color:#2f6b4c;font-weight:700} html body #globalPlayer.omu-player-refined .mp-save__list{display:grid;gap:8px;min-height:0;margin:0;padding:0;overflow-y:auto;list-style:none;overscroll-behavior:contain} html body #globalPlayer.omu-player-refined .mp-save__item{display:grid;grid-template-columns:44px minmax(0,1fr) 32px;align-items:center;gap:12px;width:100%;padding:8px 10px 8px 8px;border:1px solid var(--mp4-line);border-radius:14px;background:#fff;color:var(--mp4-ink);text-align:left;cursor:pointer;transition:border-color .15s,background .15s} html body #globalPlayer.omu-player-refined .mp-save__item:hover{border-color:var(--mp4-accent);background:var(--mp4-soft)} html body #globalPlayer.omu-player-refined .mp-save__item[aria-busy=true]{opacity:.6;cursor:progress} html body #globalPlayer.omu-player-refined .mp-save__cover{display:block;width:44px;height:44px;overflow:hidden;border-radius:10px;background:linear-gradient(135deg,var(--mp4-soft),#e9e9ef)} html body #globalPlayer.omu-player-refined .mp-save__cover img{width:100%;height:100%;object-fit:cover} html body #globalPlayer.omu-player-refined .mp-save__item-copy{display:grid;min-width:0} html body #globalPlayer.omu-player-refined .mp-save__item-name{overflow:hidden;font-size:15px;font-weight:750;text-overflow:ellipsis;white-space:nowrap} html body #globalPlayer.omu-player-refined .mp-save__item-count{color:var(--mp4-muted);font-size:12px;font-weight:600} html body #globalPlayer.omu-player-refined .mp-save__item-add{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--mp4-soft);color:var(--mp4-accent-ink);font-size:20px;font-weight:600;line-height:1} html body #globalPlayer.omu-player-refined .mp-save__empty{padding:6px 2px;color:var(--mp4-muted);font-size:14px;line-height:1.5} html body #globalPlayer.omu-player-refined .mp-save__new{display:flex;gap:8px} html body #globalPlayer.omu-player-refined .mp-save__new input{flex:1 1 auto;min-width:0;height:46px!important;padding:0 14px!important;border:1px solid #d6d6de!important;border-radius:12px!important;background:#fff!important;color:var(--mp4-ink)!important;font:inherit!important;font-size:15px!important;box-shadow:none!important} html body #globalPlayer.omu-player-refined .mp-save__new input:focus{outline:none!important;border-color:var(--mp4-accent)!important;box-shadow:0 0 0 3px var(--mp4-soft)!important} html body #globalPlayer.omu-player-refined .mp-save__new button{flex:none;height:46px;padding:0 16px;border:0;border-radius:12px;background:var(--mp4-accent);color:#fff;font-size:14px;font-weight:800;cursor:pointer} html body #globalPlayer.omu-player-refined .mp-save__new button:hover{background:var(--mp4-accent-hover)} html body #globalPlayer.omu-player-refined .mp-save__new.is-locked :is(input,button){opacity:.55} html body #globalPlayer.omu-player-refined .mp-save__manage{align-self:center;min-height:36px;padding:0 6px;border:0;background:none;color:var(--mp4-muted);font-size:13px;font-weight:650;text-decoration:underline;text-underline-offset:3px;cursor:pointer} html body #globalPlayer.omu-player-refined .mp-save__manage:hover{color:var(--mp4-accent-ink)} /* Minimized dock */ html body #globalPlayer.omu-player-refined #minimizedPlayer{height:72px!important;padding:10px 10px 12px!important;gap:6px!important;border:1px solid rgba(0,0,0,.07)!important;border-radius:20px!important;background:rgba(255,255,255,.96)!important;box-shadow:0 20px 44px -20px rgba(17,17,26,.4),0 2px 6px rgba(17,17,26,.05)!important;backdrop-filter:saturate(180%) blur(20px)!important;-webkit-backdrop-filter:saturate(180%) blur(20px)!important} html body #globalPlayer.omu-player-refined #minimizedPlayer .minimized-shell{height:50px!important;gap:12px!important} html body #globalPlayer.omu-player-refined #minimizedPlayer .minimized-disc{width:50px!important;height:50px!important;flex-basis:50px!important;border:0!important;border-radius:12px!important;box-shadow:0 6px 14px -8px rgba(17,17,26,.5)!important} html body #globalPlayer.omu-player-refined #minimizedPlayer .minimized-title{font-size:14px!important;font-weight:750!important;color:var(--mp4-ink)!important} html body #globalPlayer.omu-player-refined #minimizedPlayer .minimized-artist{font-size:12px!important;color:var(--mp4-muted)!important} html body #globalPlayer.omu-player-refined #minimizedPlayer .minimized-controls button{color:var(--mp4-text)!important} html body #globalPlayer.omu-player-refined #minimizedPlayer .minimized-controls button:hover{background:var(--mp4-fill)!important} html body #globalPlayer.omu-player-refined #minimizedPlayer .minimized-controls .minimized-play-toggle{background:var(--mp4-accent)!important;color:#fff!important;box-shadow:0 10px 20px -10px var(--mp4-accent)!important} html body #globalPlayer.omu-player-refined #minimizedPlayer .minimized-controls .minimized-play-toggle:hover{background:var(--mp4-accent-hover)!important} html body #globalPlayer.omu-player-refined #minimizedProgress{left:16px!important;right:16px!important;bottom:6px!important;height:3px!important;background:#ececf1!important} html body #globalPlayer.omu-player-refined #minimizedProgress span{background:var(--mp4-accent)!important} @media(max-width:639px){ html body #globalPlayer.omu-player-refined #minimizedPlayer{height:68px!important;padding:9px 8px 11px!important;border-radius:18px!important} html body #globalPlayer.omu-player-refined #minimizedPlayer .minimized-disc{width:46px!important;height:46px!important;flex-basis:46px!important} html body #globalPlayer.omu-player-refined .player-compact-body{padding:14px 16px 14px!important} html body #globalPlayer.omu-player-refined #playerTitle{font-size:18px!important} } /* Short landscape windows: keep the strip layout above, tools in one compact row. */ @media(max-height:520px) and (min-width:560px){ html body #globalPlayer.omu-player-refined .mp-head{position:absolute;top:0;right:0;z-index:5;padding:4px} html body #globalPlayer.omu-player-refined .mp-head__label{display:none} html body #globalPlayer.omu-player-refined .player-compact-body{display:grid!important} html body #globalPlayer.omu-player-refined #playerBottomControls>button{flex-direction:row!important;min-height:44px!important;gap:6px!important} html body #globalPlayer.omu-player-refined #playerBottomControls .mp-act__icon{width:30px;height:30px;border-radius:9px} } @keyframes mp4-eq{0%,100%{transform:scaleY(.35)}50%{transform:scaleY(1)}} @keyframes mp4-up{from{transform:translateY(24px);opacity:0}to{transform:none;opacity:1}} @media(prefers-reduced-motion:reduce){html body #globalPlayer.omu-player-refined :is(.mp-head__eq i,.mp-save__panel){animation:none!important}}