:root{--ath-yu-kno-player-bottom:18px;--ath-yu-kno-nav-height:76px}

/* YŪ KNŌ full player */
.ath-yu-kno-player[hidden]{display:none!important}
.ath-yu-kno-player{position:fixed;left:50%;bottom:var(--ath-yu-kno-player-bottom);z-index:1000050;width:min(1120px,calc(100vw - 24px));transform:translateX(-50%);font-family:inherit;color:#fff;pointer-events:none}
.ath-yu-kno-player *{box-sizing:border-box}
.ath-yu-kno-player__bar{pointer-events:auto;display:grid;grid-template-columns:minmax(220px,1.45fr) auto minmax(210px,1fr) 34px;align-items:center;gap:18px;padding:12px 14px;border:1px solid rgba(124,154,210,.22);border-radius:22px;background:rgba(4,10,21,.96);box-shadow:0 18px 58px rgba(0,0,0,.52),0 0 0 1px rgba(255,255,255,.025) inset;backdrop-filter:blur(18px)}
.ath-yu-kno-player__track{display:flex;align-items:center;min-width:0;gap:11px}
.ath-yu-kno-player__cover{width:54px;height:54px;display:grid;place-items:center;overflow:hidden;flex:0 0 auto;border:1px solid rgba(255,255,255,.1);border-radius:12px;background:#111a2a;color:#65f69b}
.ath-yu-kno-player__cover img{width:100%;height:100%;object-fit:cover}
.ath-yu-kno-player__copy{display:flex;flex-direction:column;min-width:0}
.ath-yu-kno-player__copy small{font-size:9px;letter-spacing:.2em;text-transform:uppercase;color:#55e99a;font-weight:800}
.ath-yu-kno-player__copy strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#fff;font-size:15px;margin-top:2px}
.ath-yu-kno-player__copy span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#99a2b3;font-size:12px;margin-top:2px}
.ath-yu-kno-player__controls{display:flex;align-items:center;gap:8px}
.ath-yu-kno-player__controls button,.ath-yu-kno-player__collapse{appearance:none;border:0;background:transparent;color:#fff;display:grid;place-items:center;cursor:pointer}
.ath-yu-kno-player__controls button{width:36px;height:36px;border-radius:50%}
.ath-yu-kno-player__controls button svg{width:20px;height:20px;fill:currentColor}
.ath-yu-kno-player__controls .ath-yu-kno-player__play{width:48px;height:48px;background:#42df83;color:#06110b;box-shadow:0 0 24px rgba(66,223,131,.26)}
.ath-yu-kno-player__controls .ath-yu-kno-player__play svg{width:25px;height:25px}
.ath-yu-kno-player__video[hidden]{display:none!important}
.ath-yu-kno-player__video{width:auto!important;padding:0 10px!important;border:1px solid rgba(66,223,131,.35)!important;border-radius:999px!important;background:rgba(66,223,131,.08)!important;color:#75f0a7!important;grid-auto-flow:column!important;gap:5px!important;font-size:11px!important;font-weight:800!important}
.ath-yu-kno-player__video:hover,.ath-yu-kno-player__video:focus-visible{background:rgba(66,223,131,.16)!important;outline:none}
.ath-yu-kno-player__video svg{width:18px!important;height:18px!important;fill:currentColor!important;stroke:currentColor}
.ath-yu-kno-player__timeline{display:grid;grid-template-columns:36px 1fr 36px;align-items:center;gap:8px;font-size:10px;color:#aeb6c7}
.ath-yu-kno-player__timeline input{appearance:none;width:100%;height:4px;border-radius:999px;background:linear-gradient(90deg,#42df83 calc(var(--ath-yu-kno-progress,0)*1%),rgba(255,255,255,.14) 0);outline:0}
.ath-yu-kno-player__timeline input::-webkit-slider-thumb{appearance:none;width:12px;height:12px;border-radius:50%;background:#fff;box-shadow:0 0 0 3px rgba(66,223,131,.2)}
.ath-yu-kno-player__timeline input::-moz-range-thumb{width:12px;height:12px;border:0;border-radius:50%;background:#fff}
.ath-yu-kno-player__collapse{width:34px;height:34px;border-radius:50%;font-size:22px;color:#aeb6c7}

/* There is only one compact view: the user-menu mini player below. Never render
   the old internal floating mini button as a third player surface. */
.ath-yu-kno-player__mini{display:none!important}

/* When minimized, keep the playback engine alive off-screen while only the
   user-menu mini player is visible. */
.ath-yu-kno-player.is-menu-hosted{position:fixed!important;left:-10000px!important;right:auto!important;top:0!important;bottom:auto!important;width:1px!important;height:1px!important;overflow:hidden!important;transform:none!important;opacity:.001!important;pointer-events:none!important;z-index:-1!important}
.ath-yu-kno-player.is-menu-hosted .ath-yu-kno-player__bar{display:none!important}

/* Remove only legacy music-player surfaces. Do not alter the Hustle menu,
   bottom navigation, account settings, or any other site markup. */
.ath-app-dock-player,
.ath-app-dock-player__reveal,
[data-ath-account-mini-player],
.play-block-player,
#plyr-playlist,
.plyr-playlist.fixed-bottom{display:none!important;visibility:hidden!important;pointer-events:none!important}
html.ath-dock-player-expanded,html.open-player{--ath-app-dock-player-height:0px!important}

/* Our one compact player inside the existing user menu. It intentionally uses
   no legacy data-ath-account-mini-player selector, so old app-dock JS cannot bind. */
.ath-yu-kno-menu-mini[hidden]{display:none!important}
.ath-yu-kno-menu-mini{display:grid;grid-template-columns:58px minmax(0,1fr) auto;align-items:center;gap:12px;margin:0 0 16px;padding:12px;border:1px solid rgba(255,255,255,.12);border-radius:22px;background:linear-gradient(135deg,rgba(15,25,45,.98),rgba(6,12,23,.98));box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 12px 28px rgba(0,0,0,.2);color:#fff}
.ath-yu-kno-menu-mini__cover{width:58px;height:58px;display:grid;place-items:center;overflow:hidden;border-radius:15px;color:#42df83;background:#0c1426;box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
.ath-yu-kno-menu-mini__cover img{display:block;width:100%;height:100%;object-fit:cover}
.ath-yu-kno-menu-mini__cover span{font-size:24px;font-weight:900;line-height:1}
.ath-yu-kno-menu-mini__meta{display:grid;gap:3px;min-width:0}
.ath-yu-kno-menu-mini__meta>span{color:#42df83;font-size:9px;line-height:1;font-weight:900;letter-spacing:.14em;text-transform:uppercase}
.ath-yu-kno-menu-mini__meta strong,.ath-yu-kno-menu-mini__meta small{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.ath-yu-kno-menu-mini__meta strong{color:#fff;font-size:15px;line-height:1.2;font-weight:850}
.ath-yu-kno-menu-mini__meta small{color:#9da9c2;font-size:11px;line-height:1.2;font-weight:650}
.ath-yu-kno-menu-mini__controls{display:flex;align-items:center;gap:7px}
.ath-yu-kno-menu-mini__controls button{appearance:none;display:grid;place-items:center;width:40px;height:40px;margin:0;padding:0;border:1px solid rgba(255,255,255,.1);border-radius:50%;color:#fff;background:rgba(255,255,255,.055);cursor:pointer;-webkit-tap-highlight-color:transparent}
.ath-yu-kno-menu-mini__controls button[data-ath-yu-kno-menu-play]{color:#06110b;border-color:transparent;background:#42df83;box-shadow:0 8px 18px rgba(66,223,131,.24)}
.ath-yu-kno-menu-mini__controls button[data-ath-yu-kno-menu-full]{color:#42df83}
.ath-yu-kno-menu-mini__controls svg{width:19px;height:19px;fill:currentColor;stroke:none}
.ath-yu-kno-menu-mini__pause-icon{display:none}
.ath-yu-kno-menu-mini__controls button.is-playing .ath-yu-kno-menu-mini__play-icon{display:none}
.ath-yu-kno-menu-mini__controls button.is-playing .ath-yu-kno-menu-mini__pause-icon{display:block}

/* Reserve enough space only while the full player is visible. */
html.ath-yu-kno-player-expanded body:not(.wp-admin){padding-bottom:calc(var(--ath-yu-kno-nav-height,76px) + 122px + max(16px,env(safe-area-inset-bottom)))!important}

/* Video view uses the same YŪ KNŌ YouTube instance. */
.ath-yu-kno-player__video-overlay{position:fixed;inset:0;z-index:2147483000;display:grid;place-items:center;padding:18px;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .18s ease,visibility .18s ease}
.ath-yu-kno-player__video-overlay.is-open{opacity:1;visibility:visible;pointer-events:auto}
.ath-yu-kno-player__video-backdrop{position:absolute;inset:0;border:0;background:rgba(0,0,0,.82);backdrop-filter:blur(12px);cursor:pointer}
.ath-yu-kno-player__video-stage{position:relative;z-index:1;width:min(960px,94vw);aspect-ratio:16/9;overflow:hidden;border:1px solid rgba(255,255,255,.16);border-radius:22px;background:#000;box-shadow:0 32px 90px rgba(0,0,0,.72)}
.ath-yu-kno-player__video-close{position:absolute;z-index:4;top:10px;right:10px;width:40px;height:40px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.2);border-radius:50%;background:rgba(0,0,0,.72);color:#fff;font-size:28px;line-height:1;cursor:pointer}
.ath-yu-kno-player__video-overlay .ath-yu-kno-player__engine{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;overflow:hidden!important;opacity:1!important;pointer-events:auto!important;transform:none!important}
.ath-yu-kno-player__video-overlay .ath-yu-kno-player__engine iframe{display:block!important;width:100%!important;height:100%!important;border:0!important}
html.ath-yu-kno-video-open,html.ath-yu-kno-video-open body{overflow:hidden!important}

@media(max-width:760px){
  :root{--ath-yu-kno-player-bottom:14px}
  .ath-yu-kno-player{width:calc(100vw - 12px)}
  .ath-yu-kno-player__bar{grid-template-columns:minmax(0,1fr) auto 30px;gap:9px;border-radius:20px;padding:10px}
  .ath-yu-kno-player__cover{width:46px;height:46px}
  .ath-yu-kno-player__copy small{display:none}
  .ath-yu-kno-player__copy strong{font-size:13px}
  .ath-yu-kno-player__copy span{font-size:11px}
  .ath-yu-kno-player__controls{gap:2px}
  .ath-yu-kno-player__controls button{width:30px;height:30px}
  .ath-yu-kno-player__controls .ath-yu-kno-player__play{width:44px;height:44px}
  .ath-yu-kno-player__video{width:34px!important;padding:0!important}
  .ath-yu-kno-player__video span{display:none}
  .ath-yu-kno-player__timeline{grid-column:1/-1;grid-row:2;grid-template-columns:30px 1fr 30px;gap:6px;padding:0 4px}
  .ath-yu-kno-player__collapse{grid-column:3;grid-row:1}
  html.ath-yu-kno-player-expanded body:not(.wp-admin){padding-bottom:calc(var(--ath-yu-kno-nav-height,72px) + 118px + env(safe-area-inset-bottom) + 10px)!important}
  .ath-yu-kno-player__video-stage{width:96vw;border-radius:16px}
}
@media(max-width:520px){
  .ath-yu-kno-menu-mini{grid-template-columns:52px minmax(0,1fr) auto;gap:10px;padding:10px;border-radius:19px;margin-bottom:14px}
  .ath-yu-kno-menu-mini__cover{width:52px;height:52px;border-radius:13px}
  .ath-yu-kno-menu-mini__meta strong{font-size:14px}
  .ath-yu-kno-menu-mini__controls{gap:5px}
  .ath-yu-kno-menu-mini__controls button{width:36px;height:36px}
  .ath-yu-kno-menu-mini__controls svg{width:17px;height:17px}
}

/* Mood Match radio mode: one catalog-wide queue filtered to a single vibe. */
.ath-yu-kno-player__mood{width:auto!important;padding:0 10px!important;border:1px solid rgba(66,223,131,.28)!important;border-radius:999px!important;background:rgba(66,223,131,.07)!important;color:#dfffea!important;grid-auto-flow:column!important;gap:5px!important;font-size:11px!important;font-weight:850!important}
.ath-yu-kno-player__mood:hover,.ath-yu-kno-player__mood:focus-visible,.ath-yu-kno-player__mood.is-active{background:rgba(66,223,131,.17)!important;border-color:rgba(66,223,131,.55)!important;color:#72f1a8!important;outline:none}
.ath-yu-kno-player__mood svg{width:17px!important;height:17px!important;fill:currentColor!important}
.ath-yu-kno-player__mood-panel[hidden]{display:none!important}
.ath-yu-kno-player__mood-panel{position:absolute;left:0;right:0;bottom:calc(100% + 10px);pointer-events:auto;padding:14px;border:1px solid rgba(124,154,210,.22);border-radius:22px;background:rgba(4,10,21,.985);box-shadow:0 22px 70px rgba(0,0,0,.65);backdrop-filter:blur(20px)}
.ath-yu-kno-player__mood-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
.ath-yu-kno-player__mood-head>div{display:grid;gap:2px}
.ath-yu-kno-player__mood-head span{font-size:9px;line-height:1;font-weight:900;letter-spacing:.16em;color:#42df83;text-transform:uppercase}
.ath-yu-kno-player__mood-head strong{font-size:17px;line-height:1.2;color:#fff}
.ath-yu-kno-player__mood-head button{appearance:none;width:34px;height:34px;border:1px solid rgba(255,255,255,.12);border-radius:50%;background:rgba(255,255,255,.05);color:#fff;font-size:22px;line-height:1;cursor:pointer}
.ath-yu-kno-player__mood-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;max-height:min(52vh,420px);overflow:auto;padding:1px}
.ath-yu-kno-player__mood-choice{position:relative;isolation:isolate;overflow:hidden;min-height:76px;padding:12px;border:1px solid rgba(255,255,255,.1);border-radius:14px;background:#0d1728;color:#fff;text-align:left;cursor:pointer}
.ath-yu-kno-player__mood-choice-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}\n.ath-yu-kno-player__mood-choice::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,transparent 20%,rgba(0,0,0,.68))}
.ath-yu-kno-player__mood-choice span{position:relative;z-index:1;display:block;font-size:13px;font-weight:900;text-shadow:0 2px 8px #000}
.ath-yu-kno-player__mood-choice:hover,.ath-yu-kno-player__mood-choice:focus-visible{border-color:#42df83;outline:none;transform:translateY(-1px)}
.ath-yu-kno-player__mood-panel.is-loading .ath-yu-kno-player__mood-choice{pointer-events:none;opacity:.55}
.ath-yu-kno-player__mood-status{min-height:16px;margin-top:10px;color:#9da9c2;font-size:11px;font-weight:700}
.ath-yu-kno-player__mood-status.is-loading{color:#72f1a8}
.ath-yu-kno-player__mood-status.is-error{color:#ff9b9b}

@media(max-width:760px){
  .ath-yu-kno-player__mood{width:34px!important;padding:0!important}
  .ath-yu-kno-player__mood span{display:none}
  .ath-yu-kno-player__mood-panel{left:0;right:0;padding:11px;border-radius:18px;bottom:calc(100% + 8px)}
  .ath-yu-kno-player__mood-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;max-height:48vh}
  .ath-yu-kno-player__mood-choice{min-height:68px;padding:10px}
}

/* Active Mood Match artwork on the bottom/mobile Mood control. */
.ath-yu-kno-player__mood.has-mood-image{position:relative;overflow:hidden;background-image:linear-gradient(90deg,rgba(4,10,21,.58),rgba(4,10,21,.22)),var(--ath-yu-kno-active-mood-image)!important;background-size:cover!important;background-position:center!important;border-color:rgba(255,255,255,.38)!important;color:#fff!important;text-shadow:0 1px 5px rgba(0,0,0,.8)}
.ath-yu-kno-player__mood.has-mood-image svg{opacity:0;width:0!important;margin:0!important}
@media(max-width:760px){.ath-yu-kno-player__mood.has-mood-image{width:38px!important;height:38px!important;padding:0!important;background-image:var(--ath-yu-kno-active-mood-image)!important;background-size:cover!important;background-position:center!important;box-shadow:inset 0 0 0 1px rgba(255,255,255,.28),0 4px 14px rgba(0,0,0,.28)}.ath-yu-kno-player__mood.has-mood-image svg,.ath-yu-kno-player__mood.has-mood-image span{display:none!important}}

/* My Playlists button + panel. Adds one control; the player's size and layout are unchanged. */
.ath-yu-kno-player__playlists{width:auto!important;max-width:150px;padding:0 10px!important;border:1px solid rgba(102,185,255,.3)!important;border-radius:999px!important;background:rgba(102,185,255,.07)!important;color:#dcefff!important;grid-auto-flow:column!important;gap:5px!important;font-size:11px!important;font-weight:850!important}
.ath-yu-kno-player__playlists span{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.ath-yu-kno-player__playlists svg{width:17px!important;height:17px!important;fill:currentColor!important;flex:0 0 auto}
.ath-yu-kno-player__playlists:hover,.ath-yu-kno-player__playlists:focus-visible,.ath-yu-kno-player__playlists.is-active,.ath-yu-kno-player__playlists[aria-expanded="true"]{background:rgba(102,185,255,.18)!important;border-color:rgba(102,185,255,.6)!important;color:#8fd0ff!important;outline:none}
.ath-yu-kno-player__playlist-panel[hidden]{display:none!important}
.ath-yu-kno-player__playlist-panel{position:absolute;left:0;right:0;bottom:calc(100% + 10px);pointer-events:auto;padding:14px;border:1px solid rgba(124,154,210,.22);border-radius:22px;background:rgba(4,10,21,.985);box-shadow:0 22px 70px rgba(0,0,0,.65);backdrop-filter:blur(20px);color:#fff}
.ath-yu-kno-player__playlist-head{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.ath-yu-kno-player__playlist-head>div{flex:1 1 auto;min-width:0;display:grid;gap:2px}
.ath-yu-kno-player__playlist-head span{font-size:9px;line-height:1;font-weight:900;letter-spacing:.16em;color:#66b9ff;text-transform:uppercase}
.ath-yu-kno-player__playlist-head strong{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:17px;line-height:1.2;color:#fff}
.ath-yu-kno-player__playlist-head button{appearance:none;flex:0 0 34px;width:34px;height:34px;padding:0;border:1px solid rgba(255,255,255,.12);border-radius:50%;background:rgba(255,255,255,.05);color:#fff;font-size:22px;line-height:1;cursor:pointer}
.ath-yu-kno-player__playlist-back[hidden]{display:none!important}
.ath-yu-kno-player__playlist-body{max-height:min(52vh,440px);overflow:auto;padding:1px;overscroll-behavior:contain}
.ath-yu-kno-pl__grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:8px}
.ath-yu-kno-pl__card{appearance:none;display:grid;grid-template-columns:52px minmax(0,1fr);align-items:center;gap:10px;min-width:0;padding:8px;border:1px solid rgba(255,255,255,.09);border-radius:14px;background:#0b1424;color:#fff;text-align:left;cursor:pointer}
.ath-yu-kno-pl__card:hover,.ath-yu-kno-pl__card:focus-visible{border-color:#66b9ff;outline:none}
.ath-yu-kno-pl__card.is-active{border-color:#42df83;background:rgba(66,223,131,.08)}
.ath-yu-kno-pl__cover,.ath-yu-kno-pl__art{display:grid;place-items:center;overflow:hidden;border-radius:10px;background:#15233a;color:rgba(255,255,255,.4)}
.ath-yu-kno-pl__cover{width:52px;height:52px;font-size:20px}
.ath-yu-kno-pl__cover img,.ath-yu-kno-pl__art img{width:100%;height:100%;object-fit:cover;display:block}
.ath-yu-kno-pl__meta,.ath-yu-kno-pl__song{display:grid;gap:2px;min-width:0}
.ath-yu-kno-pl__meta strong,.ath-yu-kno-pl__song strong{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:13px;font-weight:900}
.ath-yu-kno-pl__meta small,.ath-yu-kno-pl__song small{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:rgba(234,242,255,.55);font-size:11px}
.ath-yu-kno-pl__actions{display:flex;align-items:center;gap:8px;margin-bottom:10px}
.ath-yu-kno-pl__actions small{margin-left:auto;color:rgba(234,242,255,.5);font-size:11px;font-weight:800}
.ath-yu-kno-pl__play,.ath-yu-kno-pl__shuffle{appearance:none;display:inline-flex;align-items:center;gap:6px;height:38px;padding:0 15px;border-radius:999px;font-size:12px;font-weight:950;cursor:pointer}
.ath-yu-kno-pl__play{border:0;background:#42df83;color:#06110b}
.ath-yu-kno-pl__shuffle{border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.05);color:#fff}
.ath-yu-kno-pl__play svg,.ath-yu-kno-pl__shuffle svg{width:16px;height:16px;fill:currentColor}
.ath-yu-kno-pl__tracks{display:grid;gap:2px;margin:0;padding:0;list-style:none}
.ath-yu-kno-pl__tracks button{appearance:none;width:100%;display:grid;grid-template-columns:22px 42px minmax(0,1fr) 18px;align-items:center;gap:10px;padding:6px 8px;border:0;border-radius:12px;background:transparent;color:#fff;text-align:left;cursor:pointer}
.ath-yu-kno-pl__tracks button:hover,.ath-yu-kno-pl__tracks button:focus-visible{background:rgba(255,255,255,.06);outline:none}
.ath-yu-kno-pl__num{color:rgba(234,242,255,.45);font-size:11px;font-weight:900;text-align:center}
.ath-yu-kno-pl__art{width:42px;height:42px;font-size:16px}
.ath-yu-kno-pl__tracks button.is-current{background:rgba(66,223,131,.1)}
.ath-yu-kno-pl__tracks button.is-current strong{color:#72f1a8}
.ath-yu-kno-pl__eq{display:none;align-items:flex-end;gap:2px;height:14px}
.ath-yu-kno-pl__eq i{display:block;width:3px;height:40%;border-radius:2px;background:#42df83}
.ath-yu-kno-pl__tracks button.is-current .ath-yu-kno-pl__eq{display:flex}
.ath-yu-kno-pl__tracks button.is-playing .ath-yu-kno-pl__eq i{animation:athPlEq .9s ease-in-out infinite}
.ath-yu-kno-pl__eq i:nth-child(2){animation-delay:.2s!important}.ath-yu-kno-pl__eq i:nth-child(3){animation-delay:.4s!important}
@keyframes athPlEq{0%,100%{height:30%}50%{height:100%}}
.ath-yu-kno-pl__empty{margin:6px 2px;color:rgba(234,242,255,.6);font-size:13px;line-height:1.45}
.ath-yu-kno-pl__skeleton{height:56px;margin-bottom:6px;border-radius:14px;background:rgba(255,255,255,.06)}
@media(max-width:760px){
  .ath-yu-kno-player__playlists{width:34px!important;padding:0!important}
  .ath-yu-kno-player__playlists span{display:none}
  .ath-yu-kno-player__playlist-panel{padding:11px;border-radius:18px;bottom:calc(100% + 8px)}
  .ath-yu-kno-player__playlist-body{max-height:50vh}
  .ath-yu-kno-pl__grid{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){.ath-yu-kno-pl__eq i{animation:none!important;height:70%}}

/* Phone layout: song + playback controls on top; Mood / Playlists / Video on
   the left of the progress bar underneath. Same height as the original player. */
@media(max-width:760px){
  .ath-yu-kno-player .ath-yu-kno-player__bar{grid-template-columns:38px 38px 38px minmax(0,1fr) 30px 44px 30px 30px;grid-template-rows:auto auto;column-gap:6px;row-gap:8px}
  .ath-yu-kno-player .ath-yu-kno-player__controls{display:contents}
  .ath-yu-kno-player .ath-yu-kno-player__track{grid-column:1/5;grid-row:1}
  .ath-yu-kno-player [data-ath-yu-kno-player-prev]{grid-column:5;grid-row:1}
  .ath-yu-kno-player .ath-yu-kno-player__play{grid-column:6;grid-row:1}
  .ath-yu-kno-player [data-ath-yu-kno-player-next]{grid-column:7;grid-row:1}
  .ath-yu-kno-player .ath-yu-kno-player__collapse{grid-column:8;grid-row:1}
  .ath-yu-kno-player .ath-yu-kno-player__mood{grid-column:1;grid-row:2;justify-self:center}
  .ath-yu-kno-player .ath-yu-kno-player__playlists{grid-column:2;grid-row:2;justify-self:center}
  .ath-yu-kno-player .ath-yu-kno-player__video{grid-column:3;grid-row:2;justify-self:center}
  .ath-yu-kno-player .ath-yu-kno-player__timeline{grid-column:4/-1;grid-row:2;padding:0}
  .ath-yu-kno-player .ath-yu-kno-player__mood,.ath-yu-kno-player .ath-yu-kno-player__playlists,.ath-yu-kno-player .ath-yu-kno-player__video{width:34px!important;height:34px!important}
}