body.is-loading{overflow:hidden}.app-preloader{position:fixed;inset:0;z-index:9999;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#020202;color:var(--text);opacity:1;visibility:visible;transition:opacity .35s ease,visibility .35s ease}.app-preloader.is-hidden{opacity:0;visibility:hidden;pointer-events:none}.preloader-logo{width:min(44vw,230px);aspect-ratio:1;object-fit:cover;display:block;margin-bottom:24px;filter:drop-shadow(0 0 22px rgba(214,164,76,.12))}.app-preloader p{margin:0;color:#c99a45;font-size:clamp(.95rem,3.6vw,1.25rem);font-weight:400;letter-spacing:.09em}.preloader-dots{display:flex;gap:11px;align-items:center;margin-top:20px}.preloader-dots i{display:block;width:6px;height:6px;border-radius:50%;background:#d7a84d;opacity:.35;animation:preloaderDot 1.4s ease-in-out infinite}.preloader-dots i:nth-child(1){animation-delay:0s}.preloader-dots i:nth-child(2){animation-delay:.1s}.preloader-dots i:nth-child(3){animation-delay:.2s}.preloader-dots i:nth-child(4){animation-delay:.3s}.preloader-dots i:nth-child(5){animation-delay:.4s}.preloader-dots i:nth-child(6){animation-delay:.5s}.preloader-dots i:nth-child(7){animation-delay:.6s}@keyframes preloaderDot{0%,100%{opacity:.25;transform:scale(.75)}50%{opacity:1;transform:scale(1.45)}}@media(prefers-reduced-motion:reduce){.preloader-dots i{animation:none}.app-preloader{transition:none}}
:root{--bg:#050505;--panel:#111;--panel2:#171717;--line:#2b2b2b;--text:#f7f7f7;--muted:#aaa;--gold:#f4bc38;--red:#ff2d2d;--safe:env(safe-area-inset-bottom)}
*{box-sizing:border-box}html{background:#000}body{margin:0;background:radial-gradient(circle at top,#17110a 0,#050505 34rem);color:var(--text);font-family:Inter,Segoe UI,Arial,sans-serif}.app-shell{width:min(100%,720px);min-height:100vh;margin:auto;padding-bottom:calc(92px + var(--safe));background:#050505}.topbar{height:88px;display:flex;align-items:center;justify-content:center;position:sticky;top:0;z-index:20;background:rgba(5,5,5,.95);border-bottom:1px solid #171717}.brand{display:grid;text-align:center;color:var(--gold);line-height:1}.brand .crown{font-size:1.1rem}.brand strong{font-family:Georgia,serif;font-size:1.7rem;letter-spacing:.08em}.brand small{font-size:.7rem;letter-spacing:.25em;margin-top:5px}.icon-button{border:0;background:transparent;color:var(--gold);font-size:1.65rem;padding:10px}.topbar .icon-button{position:absolute;right:14px}.hero{position:relative;min-height:290px;background:#161616 center/cover no-repeat;overflow:hidden}.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.8),rgba(0,0,0,.1)),linear-gradient(0deg,rgba(0,0,0,.82),transparent 55%)}.hero-copy{position:absolute;z-index:2;left:24px;right:24px;bottom:26px}.hero-kicker{display:inline-block;background:#111;color:var(--gold);font-size:.72rem;font-weight:800;padding:7px 10px;border-radius:5px}.hero h1{font-family:Georgia,serif;font-size:2.2rem;margin:11px 0 7px;max-width:80%;text-shadow:0 2px 16px #000}.hero p{margin:0;color:#ddd}.hero-actions{display:flex;align-items:center;gap:10px;margin-top:15px}.out-now{display:inline-block;background:var(--red);font-weight:900;padding:7px 10px;border-radius:5px}.listen-now{border:1px solid var(--gold);background:rgba(0,0,0,.72);color:#fff;font-weight:800;padding:8px 14px;border-radius:6px;cursor:pointer}.listen-now:hover{background:var(--gold);color:#111}.library{padding:16px}.search-wrap{position:relative}.search-wrap input{width:100%;border:1px solid var(--line);background:var(--panel2);color:#fff;border-radius:13px;padding:15px 45px 15px 16px;font-size:1rem;outline:none}.search-wrap span{position:absolute;right:16px;top:10px;font-size:1.5rem;color:#ccc}.genre-bar{display:flex;gap:8px;overflow-x:auto;padding:13px 0 5px;scrollbar-width:none}.genre-bar::-webkit-scrollbar{display:none}.genre-chip{border:1px solid var(--line);background:var(--panel);color:#fff;border-radius:10px;padding:9px 13px;white-space:nowrap}.genre-chip.active{background:var(--gold);color:#111;border-color:var(--gold);font-weight:800}.section-title{display:flex;align-items:center;justify-content:space-between;margin:19px 2px 8px}.section-title h2{color:var(--gold);font-size:1rem;margin:0;text-transform:uppercase;letter-spacing:.03em}.section-title span{font-size:.78rem;color:var(--muted)}.status-box{padding:24px;background:var(--panel);border:1px solid var(--line);border-radius:12px;color:var(--muted)}.track-list{border:1px solid var(--line);border-radius:13px;overflow:hidden}.track-row{display:grid;grid-template-columns:58px 1fr auto auto;gap:11px;align-items:center;width:100%;border:0;border-bottom:1px solid #272727;background:#0d0d0d;color:#fff;text-align:left;padding:9px}.track-row:last-child{border-bottom:0}.track-row.active{background:#1a160b}.track-row img{width:58px;aspect-ratio:16/9;object-fit:cover;border-radius:5px}.track-copy{min-width:0}.track-copy strong{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:.92rem}.track-copy small{display:block;color:var(--muted);margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.track-duration{font-size:.8rem}.track-play{color:var(--gold);font-size:1rem}.mini-player{position:fixed;z-index:30;left:50%;bottom:0;transform:translateX(-50%);width:min(100%,720px);display:grid;grid-template-columns:minmax(0,1fr) auto auto auto auto;align-items:center;background:rgba(10,10,10,.98);border-top:1px solid var(--gold);padding:8px 10px calc(8px + var(--safe));box-shadow:0 -12px 35px rgba(0,0,0,.55)}.hidden{display:none!important}.mini-info{display:flex;align-items:center;gap:10px;min-width:0;border:0;background:transparent;color:#fff;text-align:left}.mini-info img{width:54px;height:48px;object-fit:cover;border-radius:5px}.mini-info span{min-width:0}.mini-info strong,.mini-info small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mini-info small{color:var(--gold);margin-top:4px}.control-button{border:0;background:transparent;color:#fff;font-size:1.15rem;padding:11px}.control-button.primary{border:2px solid var(--gold);border-radius:50%;width:46px;height:46px;color:var(--gold);padding:0}.now-playing-dialog,.menu-dialog{width:min(100% - 14px,680px);max-height:96vh;border:1px solid #4b4130;border-radius:22px;background:#070707;color:#fff;padding:0}.now-playing-dialog::backdrop,.menu-dialog::backdrop{background:rgba(0,0,0,.88);backdrop-filter:blur(5px)}.dialog-header{height:64px;display:flex;align-items:center;justify-content:space-between;padding:0 12px;border-bottom:1px solid #222}.video-stage{aspect-ratio:16/9;background:#000}.video-stage iframe{width:100%;height:100%;border:0}.now-playing-content{padding:18px}.now-playing-content h1{font-size:1.55rem;margin:0 0 5px}.artist{color:var(--gold);font-weight:700;margin:0 0 8px}.muted{color:var(--muted)}.full-controls{display:grid;grid-template-columns:repeat(5,1fr);align-items:center;margin:21px 0}.full-controls button{border:0;background:transparent;color:#fff;font-size:1.4rem;height:55px}.full-controls .main-play{width:58px;border-radius:50%;background:var(--gold);color:#111;font-size:1.5rem;justify-self:center}.full-controls button.active{color:var(--gold)}.comments-head{display:flex;align-items:center;gap:8px;border-top:1px solid #252525;padding-top:15px}.comments-head h2{font-size:1rem;color:var(--gold)}.comments-head span{color:var(--muted)}.comment{display:grid;grid-template-columns:42px 1fr auto;gap:10px;padding:12px 0;border-top:1px solid #242424}.comment img{width:42px;height:42px;border-radius:50%;object-fit:cover;background:#222}.comment strong{font-size:.88rem}.comment time{color:#888;font-size:.72rem;margin-left:7px}.comment p{margin:5px 0 0;font-size:.86rem;line-height:1.35}.comment .likes{color:#aaa;font-size:.78rem}.menu-dialog{padding-bottom:12px}.links-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:15px}.link-tile{display:grid;place-items:center;gap:7px;min-height:88px;border:1px solid var(--line);border-radius:12px;background:var(--panel);color:#fff;text-decoration:none;text-align:center;padding:10px}.link-tile .link-dot{display:block;width:14px;height:14px;border-radius:50%;background:var(--gold);box-shadow:0 0 12px rgba(217,177,75,.35)}.link-tile span{font-size:.78rem}.legal-links{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;padding:12px;border-top:1px solid #222;font-size:.8rem}.legal-links a,.legal-links span{color:#aaa;text-decoration:none}.skeleton{animation:pulse 1.3s infinite alternate}@keyframes pulse{to{opacity:.65}}
@media(max-width:480px){.hero{min-height:250px}.hero h1{font-size:1.85rem}.mini-player{grid-template-columns:minmax(0,1fr) auto auto auto}.mini-player #previousButton{display:none}.track-row{grid-template-columns:54px 1fr auto auto}.links-grid{grid-template-columns:repeat(3,1fr)}}

/* v3.5 preloader */
.preloader-splash{width:min(100vw,100vh);height:min(100vw,100vh);max-width:100%;max-height:100%;object-fit:contain;display:block}.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}

/* v3.6 international UI + refined loader + links menu */
.app-preloader{background:#020202}
.preloader-logo{
  width:min(30vw,150px);
  aspect-ratio:1;
  object-fit:contain;
  display:block;
  margin-bottom:20px;
  opacity:.74;
  filter:drop-shadow(0 0 14px rgba(214,164,76,.10));
  animation:preloaderLogo 2.4s ease-in-out infinite;
}
.app-preloader p{font-size:clamp(.82rem,3vw,1.05rem);letter-spacing:.14em;color:#c99a45;opacity:.9}
.preloader-dots{gap:9px;margin-top:16px}
.preloader-dots i{width:5px;height:5px}
@keyframes preloaderLogo{0%,100%{opacity:.62;transform:scale(.985)}50%{opacity:.82;transform:scale(1.015)}}
@media(prefers-reduced-motion:reduce){.preloader-logo{animation:none}}

.menu-dialog{width:min(100% - 18px,680px);max-height:92vh;padding-bottom:0;overflow:hidden}
.menu-dialog .dialog-header{position:sticky;top:0;z-index:3;background:rgba(7,7,7,.97)}
.links-content{padding:6px 15px 22px;overflow:auto;max-height:calc(92vh - 64px)}
.link-section{margin-top:18px}
.link-section h3{display:flex;align-items:center;gap:8px;margin:0 0 10px;color:var(--gold);font-size:.84rem;font-weight:700;letter-spacing:.045em}
.link-section h3::after{content:"";height:1px;flex:1;background:linear-gradient(90deg,var(--gold),transparent)}
.service-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}
.service-tile{min-height:112px;border:1px solid #343434;border-radius:13px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;color:#fff;text-decoration:none;background:linear-gradient(180deg,#171717,#0d0d0d);transition:transform .15s ease,border-color .15s ease}
.service-tile:hover{transform:translateY(-1px);border-color:var(--gold)}
.service-mark{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;font-weight:900;font-size:1.08rem;background:#222;color:#fff}
.service-tile strong{font-size:.82rem;text-align:center}
.service-tile small{font-size:.68rem;color:#aaa}
.service-tile.spotify{border-color:#185f35;background:radial-gradient(circle at 50% 15%,rgba(30,215,96,.14),transparent 55%),#0d0d0d}.service-tile.spotify .service-mark{background:#1ed760;color:#07130a}
.service-tile.apple{border-color:#6b2637;background:radial-gradient(circle at 50% 15%,rgba(250,74,109,.15),transparent 55%),#0d0d0d}.service-tile.apple .service-mark{background:#fa4a6d}
.service-tile.amazon{border-color:#283d72;background:radial-gradient(circle at 50% 15%,rgba(65,145,255,.15),transparent 55%),#0d0d0d}.service-tile.amazon .service-mark{background:#2586df}
.service-tile.youtube{border-color:#712323;background:radial-gradient(circle at 50% 15%,rgba(255,0,0,.15),transparent 55%),#0d0d0d}.service-tile.youtube .service-mark{background:#e62117}
.service-tile.laut{border-color:#70521e;background:radial-gradient(circle at 50% 15%,rgba(244,188,56,.13),transparent 55%),#0d0d0d}.service-tile.laut .service-mark{background:#d5892b}
.official-links{display:grid;gap:8px}.official-row{display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:66px;padding:11px 14px;border:1px solid #5b4516;border-radius:12px;color:#fff;text-decoration:none;background:linear-gradient(90deg,rgba(244,188,56,.045),rgba(255,255,255,.015))}.official-row span{min-width:0}.official-row strong,.official-row small{display:block}.official-row strong{font-size:.9rem}.official-row small{margin-top:4px;color:#aaa;font-size:.72rem}.official-row b{font-size:1.75rem;color:var(--gold);font-weight:300}
.social-grid{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid #343434;border-radius:12px;overflow:hidden;background:#101010}.social-tile{min-height:82px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;color:#fff;text-decoration:none;border-right:1px solid #2c2c2c}.social-tile:last-child{border-right:0}.social-dot{width:26px;height:26px;border-radius:50%;background:var(--gold);box-shadow:0 0 12px rgba(244,188,56,.16)}.social-tile strong{font-size:.75rem;font-weight:500}
.info-links{border:1px solid #343434;border-radius:12px;overflow:hidden;background:#101010}.info-links a,.info-links>div{min-height:49px;padding:0 14px;display:flex;align-items:center;justify-content:space-between;color:#fff;text-decoration:none;border-bottom:1px solid #282828}.info-links>*:last-child{border-bottom:0}.info-links b{font-size:1.55rem;color:var(--gold);font-weight:300}.info-links small{color:#aaa}
@media(max-width:480px){.preloader-logo{width:min(34vw,132px)}.service-grid{grid-template-columns:repeat(2,1fr)}.service-tile{min-height:102px}.social-grid{grid-template-columns:repeat(3,1fr)}}

/* v3.7 loader + branded links */
.app-preloader{gap:0}
.app-preloader p{margin-top:0}
.preloader-logo{display:none!important}
.service-tile{min-height:116px}
.service-logo{width:44px;height:44px;display:block;object-fit:contain}
.official-row{justify-content:flex-start}
.official-logo{width:40px;height:40px;flex:0 0 40px;object-fit:contain}
.official-row span{flex:1}
.social-grid{grid-template-columns:repeat(5,1fr)}
.social-tile{border-right:1px solid #2c2c2c;padding:10px 5px}
.social-logo{width:32px;height:32px;display:block;object-fit:contain}
.pending-link{opacity:.58;cursor:default}
@media(max-width:560px){.social-grid{grid-template-columns:repeat(3,1fr)}.social-tile:nth-child(3n){border-right:0}.social-tile:nth-child(n+4){border-top:1px solid #2c2c2c}}


/* v3.9 mobile UX refinement */
.icon-button{min-width:44px;min-height:44px;display:inline-grid;place-items:center;padding:0;line-height:1;border-radius:12px}
.topbar .icon-button{right:max(10px,env(safe-area-inset-right))}
.dialog-header{height:64px;padding-left:max(12px,env(safe-area-inset-left));padding-right:max(12px,env(safe-area-inset-right))}
.dialog-header .icon-button{background:#121212;border:1px solid #3a3325;color:var(--gold);font-size:1.5rem}
.now-playing-dialog,.menu-dialog{margin-top:max(8px,env(safe-area-inset-top));max-height:calc(100dvh - max(16px,env(safe-area-inset-top)) - max(10px,env(safe-area-inset-bottom)))}
.menu-dialog .links-content{max-height:calc(100dvh - 88px - env(safe-area-inset-top) - env(safe-area-inset-bottom))}
.track-row{grid-template-columns:46px minmax(0,1fr) auto 34px;gap:10px;min-height:58px;padding:6px 9px}
.track-row img{width:46px;height:34px;aspect-ratio:auto;border-radius:5px}
.track-copy strong{font-size:.9rem}
.track-copy small{display:none!important}
.track-duration{font-size:.78rem;color:#ddd}
.track-play{display:grid;place-items:center;width:34px;height:34px;font-size:.95rem}
.social-grid{grid-template-columns:repeat(3,1fr)}
.social-tile{border-right:1px solid #2c2c2c;min-height:82px}
.social-tile:nth-child(3n){border-right:0}.social-tile:nth-child(n+4){border-top:1px solid #2c2c2c}
@media(max-width:480px){
  .hero{min-height:235px}
  .hero-copy{left:20px;right:20px;bottom:20px}
  .hero h1{font-size:clamp(1.45rem,7vw,1.8rem);line-height:1.06;max-width:92%;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
  .hero p{font-size:.9rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .hero-actions{margin-top:11px}
  .out-now,.listen-now{min-height:44px;display:inline-flex;align-items:center}
  .track-row{grid-template-columns:44px minmax(0,1fr) auto 34px}
  .track-row img{width:44px;height:32px}
  .mini-player{padding-left:max(8px,env(safe-area-inset-left));padding-right:max(8px,env(safe-area-inset-right))}
  .control-button{min-width:44px;min-height:44px}
}


/* v3.10 hero image-first layout */
.hero{min-height:290px}
.hero::after{background:linear-gradient(0deg,rgba(0,0,0,.22),transparent 38%)}
.hero-badge{position:absolute;z-index:2;left:18px;top:18px;background:rgba(8,8,8,.82);border:1px solid rgba(217,177,75,.45);backdrop-filter:blur(4px)}
.hero-info{padding:14px 18px 17px;background:#080808;border-bottom:1px solid #1d1d1d}
.hero-info h1{margin:0;color:#fff;font-family:Inter,Segoe UI,Arial,sans-serif;font-size:1.18rem;line-height:1.25;font-weight:750;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.hero-info .hero-actions{margin-top:12px}
@media(max-width:480px){
  .hero{min-height:245px}
  .hero-badge{left:14px;top:14px}
  .hero-info{padding:12px 14px 15px}
  .hero-info h1{font-size:1.05rem}
}

/* v3.11 compact release line below the unobstructed hero image */
.hero-badge{display:none!important}
.hero-release-line{
  display:flex;
  align-items:baseline;
  gap:7px;
  min-width:0;
}
.hero-release-label{
  flex:0 0 auto;
  color:var(--gold);
  font-size:.72rem;
  font-weight:850;
  letter-spacing:.055em;
  white-space:nowrap;
}
.hero-release-separator{
  flex:0 0 auto;
  color:#76663b;
  font-weight:800;
}
.hero-info .hero-release-line h1{
  min-width:0;
  margin:0;
  font-size:1.12rem;
  line-height:1.22;
  font-weight:760;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  display:block;
}
@media(max-width:480px){
  .hero-release-line{gap:6px}
  .hero-release-label{font-size:.66rem}
  .hero-info .hero-release-line h1{font-size:1rem}
}

/* v3.13 — compact mini player with explicit expand control */
.mini-player{
  grid-template-columns:44px 48px minmax(0,1fr) 48px 44px 44px;
  gap:6px;
  padding:7px 9px calc(7px + var(--safe));
}
.mini-expand{
  width:44px;
  height:44px;
  border:0;
  background:transparent;
  color:var(--gold);
  font-size:1.65rem;
  line-height:1;
  border-radius:50%;
  display:grid;
  place-items:center;
}
.mini-expand:active{background:#1b1b1b}
.mini-thumb{
  width:48px;
  height:42px;
  object-fit:cover;
  border-radius:5px;
  display:block;
}
.mini-label{
  min-width:0;
  color:#fff;
  font-size:.75rem;
  font-weight:800;
  letter-spacing:.08em;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
@media(max-width:420px){
  .mini-player{
    grid-template-columns:40px 44px minmax(0,1fr) 44px 40px 40px;
    gap:4px;
    padding-left:6px;
    padding-right:6px;
  }
  .mini-expand{width:40px;height:40px}
  .mini-thumb{width:44px;height:40px}
  .mini-label{font-size:.67rem;letter-spacing:.055em}
  .mini-player .control-button{padding:7px}
  .mini-player .control-button.primary{width:42px;height:42px}
}

/* v3.15 — compact mini player, one primary Play/Pause button */
.mini-player{
  grid-template-columns:44px 48px minmax(0,1fr) 48px 44px;
}
@media(max-width:420px){
  .mini-player{
    grid-template-columns:40px 44px minmax(0,1fr) 44px 40px;
  }
}

/* v3.18 mini player layout */
.mini-player{grid-template-columns:44px 48px minmax(0,1fr) 56px 44px;gap:7px;align-items:center}
.mini-main-play{width:54px!important;height:54px!important;min-width:54px;border-radius:50%;font-size:1.3rem!important;justify-self:end}
.mini-library-button{width:44px;height:44px;padding:0!important;display:grid;place-items:center;font-size:1.25rem!important}
@media(max-width:420px){.mini-player{grid-template-columns:40px 44px minmax(0,1fr) 50px 40px;gap:5px;padding-left:6px;padding-right:6px}.mini-main-play{width:48px!important;height:48px!important;min-width:48px}.mini-library-button{width:40px;height:40px}}

/* v3.21 — exact requested hero button */
.hero-actions-single{
  margin-top:12px;
  display:flex;
}
.hero-play-new-release{
  min-height:58px;
  padding:0 24px;
  border:0;
  border-radius:10px;
  background:#ff1f2d;
  color:#fff;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  font-size:1.05rem;
  font-weight:800;
  box-shadow:0 8px 22px rgba(255,31,45,.22);
  -webkit-tap-highlight-color:transparent;
}
.hero-play-new-release:active{
  transform:scale(.985);
}
.hero-play-new-release .hero-play-icon{
  font-size:1.15rem;
  line-height:1;
}

/* v3.21 — icon appearance from the supplied reference screenshot.
   Arrangement/order stays exactly as it already is. */
.service-tile,
.social-tile{
  background:#0b0b0b!important;
  border:1.5px solid var(--gold)!important;
  border-radius:14px!important;
  box-shadow:none!important;
  min-height:108px;
  padding:14px 10px 12px!important;
  display:flex!important;
  flex-direction:column;
  align-items:center!important;
  justify-content:center!important;
  gap:9px!important;
  text-align:center!important;
}
.service-tile .service-logo,
.social-tile .social-logo{
  width:46px!important;
  height:46px!important;
  object-fit:contain!important;
  filter:none!important;
  opacity:1!important;
}
.service-tile strong,
.social-tile strong{
  font-size:.88rem!important;
  line-height:1.1;
  font-weight:600!important;
  color:#fff!important;
}
.service-tile span,
.service-tile small{
  display:none!important;
}

/* Official-link rows keep their current position/layout, but use cleaner logos. */
.official-links img,
.official-logo{
  width:42px!important;
  height:42px!important;
  object-fit:contain!important;
  filter:none!important;
  opacity:1!important;
}

@media(max-width:420px){
  .hero-play-new-release{
    width:100%;
    min-height:56px;
    font-size:1rem;
  }
  .service-tile,
  .social-tile{
    min-height:100px;
    padding:12px 8px 10px!important;
  }
  .service-tile .service-logo,
  .social-tile .social-logo{
    width:42px!important;
    height:42px!important;
  }
}

/* v3.21 — repaired mini-player controls */
.mini-player{
  grid-template-columns:44px 48px minmax(0,1fr) 56px 44px;
  gap:7px;
  align-items:center;
}
.mini-main-play{
  width:54px!important;
  height:54px!important;
  min-width:54px;
  border-radius:50%;
  font-size:1.3rem!important;
  justify-self:end;
}
.mini-library-button{
  width:44px;
  height:44px;
  padding:0!important;
  display:grid;
  place-items:center;
  font-size:1.25rem!important;
}
@media(max-width:420px){
  .mini-player{
    grid-template-columns:40px 44px minmax(0,1fr) 50px 40px;
    gap:5px;
  }
  .mini-main-play{
    width:48px!important;
    height:48px!important;
    min-width:48px;
  }
  .mini-library-button{
    width:40px;
    height:40px;
  }
}

/* v3.22 — final mini player: no text label, controls only */
.mini-player{
  grid-template-columns:44px 48px minmax(0,1fr) 56px 44px;
}
.mini-thumb{grid-column:2}
.mini-main-play{grid-column:4}
.mini-library-button{grid-column:5}
@media(max-width:420px){
  .mini-player{
    grid-template-columns:40px 44px minmax(0,1fr) 50px 40px;
  }
}

/* v3.23 — exact requested cleanup */

/* No release/title line below hero; only one large CTA */
.hero-release-line,
.hero-release-label,
.hero-release-separator{
  display:none!important;
}
.hero-actions-single{
  margin:14px 22px 0;
}
.hero-play-new-release{
  width:100%;
  min-height:58px;
  border:0;
  border-radius:10px;
  background:#ff202d;
  color:#fff;
  font-size:1.05rem;
  font-weight:850;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:11px;
  box-shadow:0 8px 22px rgba(255,32,45,.24);
}
.hero-play-icon{font-size:1.15rem}

/* Mini player: actual 16:9 thumbnail + previous + large play + next + expand on far right */
.mini-player{
  grid-template-columns:minmax(92px,120px) 42px 56px 42px 44px;
  gap:6px;
  align-items:center;
  padding:7px 8px calc(7px + var(--safe));
}
.mini-thumb-wide{
  width:100%!important;
  height:auto!important;
  aspect-ratio:16/9!important;
  object-fit:cover!important;
  border-radius:6px!important;
  display:block;
}
.mini-step{
  width:42px;
  height:42px;
  padding:0!important;
  display:grid;
  place-items:center;
}
.mini-main-play{
  width:54px!important;
  height:54px!important;
  min-width:54px;
  border-radius:50%;
  font-size:1.3rem!important;
}
.mini-expand-right{
  width:44px!important;
  height:44px!important;
  display:grid!important;
  place-items:center!important;
  justify-self:end;
  border:1px solid #5a4821!important;
  border-radius:10px!important;
  color:var(--gold)!important;
  background:#111!important;
  font-size:1.35rem!important;
}
@media(max-width:420px){
  .mini-player{
    grid-template-columns:minmax(82px,104px) 38px 50px 38px 40px;
    gap:4px;
    padding-left:6px;
    padding-right:6px;
  }
  .mini-step{width:38px;height:38px}
  .mini-main-play{width:48px!important;height:48px!important;min-width:48px}
  .mini-expand-right{width:40px!important;height:40px!important}
}

/* Links: brand-logo card look from the supplied reference, arrangement untouched */
.service-tile,
.social-tile{
  background:#0b0b0b!important;
  border:1.5px solid var(--gold)!important;
  border-radius:13px!important;
  min-height:108px;
  padding:13px 8px 11px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:9px!important;
  text-align:center!important;
  box-shadow:none!important;
}
.brand-icon-shell{
  width:48px;
  height:48px;
  display:grid;
  place-items:center;
}
.service-logo,
.social-logo{
  width:46px!important;
  height:46px!important;
  object-fit:contain!important;
  filter:none!important;
  opacity:1!important;
}
.service-tile strong,
.social-tile strong{
  color:#fff!important;
  font-size:.88rem!important;
  font-weight:600!important;
  line-height:1.1;
}
.social-grid{
  display:grid!important;
}

/* v3.24 — expand button belongs on the far left */
.mini-player{
  grid-template-columns:44px minmax(92px,120px) 42px 56px 42px;
}
.mini-expand-left{
  width:44px!important;
  height:44px!important;
  display:grid!important;
  place-items:center!important;
  justify-self:start;
  border:1px solid #5a4821!important;
  border-radius:10px!important;
  color:var(--gold)!important;
  background:#111!important;
  font-size:1.35rem!important;
}
@media(max-width:420px){
  .mini-player{
    grid-template-columns:40px minmax(82px,104px) 38px 50px 38px;
  }
  .mini-expand-left{
    width:40px!important;
    height:40px!important;
  }
}

/* v3.25 — requested layout only */
.hero{
  width:100%!important;
  aspect-ratio:16/9!important;
  min-height:0!important;
  height:auto!important;
  background-size:cover!important;
  background-position:center!important;
}
.hero-info{padding:12px 18px 16px!important;}
.hero-actions-single{margin:0!important;justify-content:flex-start!important;}
.hero-play-new-release{
  width:50%!important;
  max-width:320px!important;
  min-width:190px!important;
  min-height:50px!important;
  margin:0!important;
}

.mini-player{
  grid-template-columns:44px 1fr 44px 64px 44px 1fr 44px!important;
  gap:6px!important;
  align-items:center!important;
  padding:7px 10px calc(7px + var(--safe))!important;
}
.mini-player #openNowPlaying{grid-column:1!important;justify-self:start!important;}
.mini-player #previousButton{grid-column:3!important;display:grid!important;}
.mini-player #playPauseButton{grid-column:4!important;justify-self:center!important;}
.mini-player #nextButton{grid-column:5!important;display:grid!important;}
.mini-player #queueButton{grid-column:7!important;justify-self:end!important;}
.mini-expand,.mini-library-button{
  width:44px!important;height:44px!important;padding:0!important;display:grid!important;place-items:center!important;
  border:1px solid #5a4821!important;border-radius:10px!important;background:#111!important;color:var(--gold)!important;
  font-size:1.25rem!important;
}
.mini-step{width:44px!important;height:44px!important;padding:0!important;display:grid!important;place-items:center!important;}
.mini-main-play{
  width:60px!important;height:60px!important;min-width:60px!important;border:2px solid var(--gold)!important;
  border-radius:50%!important;font-size:1.45rem!important;padding:0!important;
}
@media(max-width:480px){
  .hero{aspect-ratio:16/9!important;min-height:0!important;}
  .hero-play-new-release{width:50%!important;min-width:175px!important;max-width:none!important;font-size:.92rem!important;}
  .mini-player{grid-template-columns:40px 1fr 38px 56px 38px 1fr 40px!important;gap:3px!important;padding-left:6px!important;padding-right:6px!important;}
  .mini-expand,.mini-library-button{width:40px!important;height:40px!important;}
  .mini-step{width:38px!important;height:38px!important;}
  .mini-main-play{width:54px!important;height:54px!important;min-width:54px!important;}
}

/* v3.26 — compact Social Media section only */
.compact-social-grid{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:8px!important;
  margin-top:8px!important;
}
.compact-social-tile{
  min-height:58px!important;
  height:58px!important;
  padding:7px 9px!important;
  border:1px solid #6f5618!important;
  border-radius:10px!important;
  background:#0d0d0d!important;
  display:flex!important;
  flex-direction:row!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:8px!important;
  color:#fff!important;
  text-decoration:none!important;
  text-align:left!important;
  box-sizing:border-box!important;
}
.compact-social-icon{
  width:30px!important;
  height:30px!important;
  min-width:30px!important;
  display:grid!important;
  place-items:center!important;
}
.compact-social-icon img{
  width:28px!important;
  height:28px!important;
  object-fit:contain!important;
  display:block;
}
.compact-social-tile>span:last-child{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:.78rem!important;
  font-weight:650!important;
}
@media(max-width:520px){
  .compact-social-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  .compact-social-tile{
    min-height:54px!important;
    height:54px!important;
  }
}

/* v3.27 — force social brand icons to render */
#socialLinks{
  display:grid!important;
}
#socialLinks .compact-social-tile{
  display:flex!important;
  visibility:visible!important;
  opacity:1!important;
}
#socialLinks .compact-social-logo{
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
  width:30px!important;
  height:30px!important;
  min-width:30px!important;
  object-fit:contain!important;
  filter:none!important;
}
#socialLinks .compact-social-tile span{
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
}

/* v3.29 — iOS playback reliability: keep YouTube iframe alive while minimized */
.now-playing-dialog.player-minimized{
  position:fixed!important;
  left:-20px!important;
  top:-20px!important;
  width:2px!important;
  height:2px!important;
  min-width:0!important;
  min-height:0!important;
  max-width:2px!important;
  max-height:2px!important;
  padding:0!important;
  margin:0!important;
  border:0!important;
  opacity:.001!important;
  overflow:hidden!important;
  pointer-events:none!important;
  z-index:-1!important;
}
.now-playing-dialog.player-minimized .dialog-header,
.now-playing-dialog.player-minimized .now-playing-content{
  display:none!important;
}
.now-playing-dialog.player-minimized .video-stage{
  display:block!important;
  width:2px!important;
  height:2px!important;
  min-height:2px!important;
  overflow:hidden!important;
}

/* v1.0 — YouTube interaction shortcuts in the full player */
.youtube-actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  margin:4px 0 18px;
}
.youtube-action-button{
  min-height:44px;
  border:1px solid #5a4821;
  border-radius:10px;
  background:#111;
  color:#fff;
  font:inherit;
  font-size:.86rem;
  font-weight:700;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  padding:9px 12px;
}
.youtube-action-button:active{
  border-color:var(--gold);
  transform:scale(.985);
}
@media(max-width:420px){
  .youtube-actions{gap:7px}
  .youtube-action-button{
    font-size:.78rem;
    padding:8px 7px;
  }
}


/* ================================================================
   v1.1 RESPONSIVE TABLET / DESKTOP
   Mobile layout below 900px is intentionally untouched.
   ================================================================ */

.desktop-sidebar{display:none}

/* Tablet / small laptop */
@media (min-width:900px){
  body{
    background:
      radial-gradient(circle at 70% 10%,rgba(212,166,55,.055),transparent 30%),
      #020202;
  }

  .app-shell{
    width:min(100%,1320px)!important;
    margin:0 auto!important;
    display:grid!important;
    grid-template-columns:240px minmax(0,1fr)!important;
    grid-template-rows:auto 1fr!important;
    column-gap:0!important;
    background:#050505!important;
    border-left:1px solid #171717;
    border-right:1px solid #171717;
  }

  .topbar{
    grid-column:1 / -1!important;
    grid-row:1!important;
    height:82px!important;
  }

  .topbar #menuButton{
    display:none!important;
  }

  .desktop-sidebar{
    display:block!important;
    grid-column:1!important;
    grid-row:2!important;
    align-self:stretch;
    min-height:calc(100vh - 82px);
    padding:18px 14px 120px;
    border-right:1px solid #29200d;
    background:linear-gradient(180deg,#070707 0%,#030303 100%);
  }
.desktop-side-section{
    margin:0 0 24px;
  }

  .desktop-side-section h3{
    margin:0 4px 9px;
    color:var(--gold);
    font-size:.72rem;
    letter-spacing:.05em;
    font-weight:800;
  }

  .desktop-service-links,
  .desktop-social-links{
    display:grid;
    grid-template-columns:1fr;
    gap:7px;
  }

  .desktop-service-links .service-tile,
  .desktop-social-links .social-tile{
    min-height:48px!important;
    height:48px!important;
    border:1px solid #655017!important;
    border-radius:9px!important;
    padding:6px 9px!important;
    background:#0b0b0b!important;
    display:flex!important;
    flex-direction:row!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:9px!important;
    text-align:left!important;
  }

  .desktop-service-links .service-logo,
  .desktop-social-links .social-logo,
  .desktop-social-links .compact-social-logo{
    width:27px!important;
    height:27px!important;
    min-width:27px!important;
    object-fit:contain!important;
    display:block!important;
  }

  .desktop-service-links strong,
  .desktop-social-links strong,
  .desktop-social-links span{
    display:block!important;
    color:#fff!important;
    font-size:.76rem!important;
    font-weight:650!important;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }

  .desktop-official-links{
    display:grid;
    gap:7px;
  }

  .desktop-official-links .official-link{
    min-height:52px!important;
  }

  .app-shell > main{
    grid-column:2!important;
    grid-row:2!important;
    width:100%!important;
    min-width:0!important;
    max-width:1080px!important;
    justify-self:center!important;
    padding-bottom:24px;
  }

  /* The hero remains exactly 16:9 on tablet and desktop. */
  .hero{
    width:100%!important;
    aspect-ratio:16/9!important;
    min-height:0!important;
    height:auto!important;
  }

  .library{
    padding:20px 22px 30px!important;
  }

  .search-wrap input{
    padding-top:17px!important;
    padding-bottom:17px!important;
  }

  .track-row{
    min-height:64px;
  }

  /* Mini player spans only the content area, not the sidebar. */
  .mini-player{
    left:calc(50% + 120px)!important;
    width:min(calc(100% - 240px),1080px)!important;
    max-width:1080px!important;
  }

  /* Larger full player: video left, metadata/controls/comments right. */
  .now-playing-dialog:not(.player-minimized){
    width:min(94vw,1040px)!important;
    max-width:1040px!important;
    max-height:90vh!important;
    grid-template-columns:minmax(360px,44%) minmax(0,56%);
    grid-template-rows:64px minmax(0,1fr);
    overflow:hidden;
  }

  .now-playing-dialog:not(.player-minimized)[open]{
    display:grid!important;
  }

  .now-playing-dialog:not(.player-minimized) .dialog-header{
    grid-column:1 / -1;
    grid-row:1;
  }

  .now-playing-dialog:not(.player-minimized) .video-stage{
    grid-column:1;
    grid-row:2;
    align-self:start;
    width:100%;
  }

  .now-playing-dialog:not(.player-minimized) .now-playing-content{
    grid-column:2;
    grid-row:2;
    overflow-y:auto;
    padding:24px!important;
  }

  .now-playing-dialog:not(.player-minimized) .now-playing-content h1{
    font-size:1.8rem!important;
  }
}

/* Normal desktop / large laptop */
@media (min-width:1200px){
  .app-shell{
    width:min(100%,1480px)!important;
    grid-template-columns:280px minmax(0,1fr)!important;
  }

  .desktop-sidebar{
    padding-left:18px;
    padding-right:18px;
  }

  .app-shell > main{
    max-width:1120px!important;
  }

  .mini-player{
    left:calc(50% + 140px)!important;
    width:min(calc(100% - 280px),1120px)!important;
    max-width:1120px!important;
  }

  .library{
    padding-left:28px!important;
    padding-right:28px!important;
  }
}

/* Very wide desktop: avoid stretching the app indefinitely. */
@media (min-width:1600px){
  .app-shell{
    width:1480px!important;
  }
}


/* v1.1.1 — INFO section for tablet/desktop sidebar */
@media (min-width:900px){
  .desktop-info-section{
    margin-top:4px;
    padding-top:2px;
  }

  .desktop-info-links{
    display:grid;
    gap:6px;
  }

  .desktop-info-links a,
  .desktop-info-links > div{
    min-height:42px;
    padding:0 10px;
    border:1px solid #332a17;
    border-radius:8px;
    background:#0a0a0a;
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:space-between;
    text-decoration:none;
    font-size:.74rem;
  }

  .desktop-info-links a b{
    color:var(--gold);
    font-size:1rem;
    font-weight:600;
  }

  .desktop-info-links small{
    color:#cfcfcf;
    font-size:.68rem;
  }
}


/* v1.1.7 — compact round pull-to-refresh indicator */
.pull-refresh-indicator{
  --pull-distance:0px;
  position:fixed;
  z-index:80;
  top:calc(env(safe-area-inset-top,0px) + 34px);
  left:clamp(18px,5.5vw,34px);
  transform:translateY(calc(-54px + var(--pull-distance)));
  width:42px;
  height:42px;
  padding:0;
  border:1px solid var(--gold);
  border-radius:50%;
  background:rgba(8,8,8,.94);
  color:var(--gold);
  display:none;
  align-items:center;
  justify-content:center;
  box-shadow:0 6px 20px rgba(0,0,0,.38);
  pointer-events:none;
  opacity:0;
  transition:opacity .12s ease;
}
.pull-refresh-indicator.visible{opacity:1}
.pull-refresh-indicator.ready{
  background:rgba(16,13,7,.97);
  box-shadow:0 0 0 2px rgba(212,166,55,.10),0 6px 20px rgba(0,0,0,.38);
}
.pull-refresh-indicator.refreshing .pull-refresh-arrow{
  animation:pull-refresh-spin .75s linear infinite;
}
.pull-refresh-arrow{
  display:block;
  color:var(--gold);
  font-size:1.18rem;
  font-weight:800;
  line-height:1;
}
@keyframes pull-refresh-spin{
  to{transform:rotate(360deg)}
}
@media(max-width:899px){
  .pull-refresh-indicator{display:flex}
}
@media(max-width:390px){
  .pull-refresh-indicator{
    width:38px;
    height:38px;
    left:16px;
  }
  .pull-refresh-arrow{font-size:1.05rem}
}
@media(min-width:900px){
  .pull-refresh-indicator{display:none!important}
}



/* v1.2.2 — New Release Notifications toggle */
.info-toggle-row,
.desktop-push-toggle{
  width:100%;
  border:0;
  color:#fff;
  background:transparent;
  font:inherit;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:space-between;
  text-align:left;
  box-sizing:border-box;
}

.info-links .info-toggle-row{
  min-height:62px;
  padding:10px 14px;
  border-top:1px solid #2b2b2b;
}

.info-toggle-row > span,
.desktop-push-toggle > span{
  display:grid;
  gap:3px;
  min-width:0;
}

.info-toggle-row strong,
.desktop-push-toggle strong{
  font-weight:500;
  color:#fff;
}

.info-toggle-row small,
.desktop-push-toggle small{
  color:#aaa;
  font-size:.72rem;
}

.toggle-switch{
  width:42px;
  height:24px;
  min-width:42px;
  border:1px solid #555;
  border-radius:14px;
  background:#222;
  position:relative;
  display:block;
  transition:.18s ease;
}

.toggle-switch em{
  position:absolute;
  top:3px;
  left:3px;
  width:16px;
  height:16px;
  border-radius:50%;
  background:#999;
  transition:.18s ease;
}

.info-toggle-row.is-on .toggle-switch,
.desktop-push-toggle.is-on .toggle-switch{
  border-color:var(--gold);
  background:rgba(212,166,55,.20);
}

.info-toggle-row.is-on .toggle-switch em,
.desktop-push-toggle.is-on .toggle-switch em{
  left:21px;
  background:var(--gold);
}

@media(min-width:900px){
  .desktop-push-toggle{
    min-height:50px;
    padding:7px 10px;
    border:1px solid #332a17;
    border-radius:8px;
    background:#0a0a0a;
    margin-bottom:6px;
  }

  .desktop-push-toggle strong{
    font-size:.72rem;
    line-height:1.15;
  }

  .desktop-push-toggle small{
    font-size:.62rem;
  }

  .desktop-push-toggle .toggle-switch{
    width:34px;
    height:20px;
    min-width:34px;
  }

  .desktop-push-toggle .toggle-switch em{
    width:14px;
    height:14px;
    top:2px;
    left:2px;
  }

  .desktop-push-toggle.is-on .toggle-switch em{
    left:17px;
  }
}

/* v1.2.2 layout refinement: dedicated Notifications section */
.notification-section{margin-top:18px}
.notification-links .info-toggle-row{min-height:72px;padding:12px 14px;border-top:0}
.desktop-notification-section{margin-top:14px}
.desktop-notification-links .desktop-push-toggle{margin-bottom:0}




/* v1.6.3 — Links / Legal Notice / Privacy use the same header + close control */
.unified-close-button{
  width:40px;
  height:40px;
  padding:0;
  display:grid;
  place-items:center;
  border:1px solid var(--gold);
  border-radius:7px;
  background:#0a0a0a;
  color:#fff;
  font-size:1.55rem;
  line-height:1;
  outline:none;
  box-shadow:none;
}
.unified-close-button:focus,
.unified-close-button:focus-visible{
  outline:none;
  border-color:var(--gold);
  box-shadow:0 0 0 1px rgba(212,166,55,.22);
}
.legal-dialog-content{
  line-height:1.62;
  padding-top:16px;
}
.legal-dialog-content h2{
  margin:26px 0 8px;
  color:var(--gold);
  font-size:1.08rem;
}
.legal-dialog-content h2:first-child{margin-top:0}
.legal-dialog-content p{margin:0 0 14px}
.legal-dialog-content a{color:#e0c56b}
.legal-dialog-content .updated{opacity:.65}
.legal-dialog-content .note{
  border-left:3px solid var(--gold);
  padding-left:12px;
  opacity:.9;
}


/* v1.6.5 — consistent focus style, no browser-default blue outlines */
button,
a,
[role="button"],
input,
select,
textarea {
  -webkit-tap-highlight-color: transparent;
}

button:focus,
button:focus-visible,
a:focus,
a:focus-visible,
[role="button"]:focus,
[role="button"]:focus-visible,
input:focus,
input:focus-visible,
select:focus,
select:focus-visible,
textarea:focus,
textarea:focus-visible {
  outline: none !important;
  box-shadow: 0 0 0 1px rgba(212,166,55,.28) !important;
}

.icon-button:focus,
.icon-button:focus-visible,
.unified-close-button:focus,
.unified-close-button:focus-visible,
.mini-control:focus,
.mini-control:focus-visible,
.player-control:focus,
.player-control:focus-visible {
  outline: none !important;
  border-color: var(--gold) !important;
  box-shadow: 0 0 0 1px rgba(212,166,55,.28) !important;
}

/* Prevent Chromium/Edge focus indication from painting a blue border on embedded controls. */
:focus-visible {
  outline-color: var(--gold);
}


/* v1.6.6 — prevent Chromium/Edge from drawing a blue focus ring
   around the complete Now Playing dialog */
#nowPlayingDialog:focus,
#nowPlayingDialog:focus-visible,
.now-playing-dialog:focus,
.now-playing-dialog:focus-visible {
  outline: none !important;
  border-color: #4b4130 !important;
  box-shadow: none !important;
}


/* v1.6.7 — compact player identity + YouTube actions */
.now-playing-content h1{font-size:1.28rem!important;line-height:1.25;margin-bottom:5px}
.artist{display:flex;align-items:baseline;gap:6px;flex-wrap:wrap}
.subscriber-count{color:#8f8f8f;font-size:.72rem;font-weight:500;white-space:nowrap}
.youtube-actions{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:7px!important}
.youtube-action-button{min-width:0;padding:8px 6px!important;font-size:.78rem!important;white-space:nowrap}
.subscribe-action{color:var(--gold)}
@media(max-width:360px){.youtube-action-button{font-size:.72rem!important;padding:8px 4px!important}.subscriber-count{font-size:.68rem}}


/* v1.6.7 — bottom mini-player Play/Pause mirrors the full-player Play/Pause */
#playPauseButton.mini-main-play{
  width:58px !important;
  height:58px !important;
  min-width:58px !important;
  min-height:58px !important;
  padding:0 !important;
  border:0 !important;
  border-radius:50% !important;
  background:var(--gold) !important;
  color:#111 !important;
  display:grid !important;
  place-items:center !important;
  font-size:1.45rem !important;
  line-height:1 !important;
  box-shadow:none !important;
}
#playPauseButton.mini-main-play:hover{filter:brightness(1.05)}
#playPauseButton.mini-main-play:focus,
#playPauseButton.mini-main-play:focus-visible{
  outline:none !important;
  box-shadow:0 0 0 1px rgba(212,166,55,.28) !important;
}


/* v1.6.7 correction — restore framed scroll areas for Legal Notice + Privacy */
#imprintDialog,
#privacyDialog{
  overflow:hidden !important;
}

#imprintDialog .legal-dialog-content,
#privacyDialog .legal-dialog-content{
  flex:1 1 auto !important;
  min-height:0 !important;
  overflow-y:auto !important;
  -webkit-overflow-scrolling:touch;
  margin:0 12px 12px !important;
  padding:16px !important;
  border:1px solid #4b4130 !important;
  border-radius:16px !important;
  background:#070707 !important;
}

#imprintDialog .dialog-header,
#privacyDialog .dialog-header{
  flex:0 0 auto !important;
}


/* v1.6.7 — slightly more breathing room around mini-player Play/Pause */
.mini-controls{
  column-gap:14px !important;
}
@media (max-width:380px){
  .mini-controls{
    column-gap:10px !important;
  }
}


/* v1.6.7 — real mini-player spacing fix.
   Previous/Play/Next are direct grid children, so use dedicated spacer columns. */
.mini-player{
  grid-template-columns:44px 1fr 44px 14px 64px 14px 44px 1fr 44px !important;
  gap:0 !important;
}

.mini-player #openNowPlaying{
  grid-column:1 !important;
}
.mini-player #previousButton{
  grid-column:3 !important;
}
.mini-player #playPauseButton{
  grid-column:5 !important;
}
.mini-player #nextButton{
  grid-column:7 !important;
}
.mini-player #queueButton{
  grid-column:9 !important;
}

@media(max-width:420px){
  .mini-player{
    grid-template-columns:40px 1fr 38px 10px 58px 10px 38px 1fr 40px !important;
    gap:0 !important;
  }
}


/* v1.6.9 — Android/Chrome YouTube player compatibility.
   Keep the minimized iframe off-screen, but never shrink the actual
   YouTube player viewport to 2×2 px. */
.now-playing-dialog.player-minimized{
  left:-420px !important;
  top:-260px !important;
  width:356px !important;
  height:200px !important;
  min-width:356px !important;
  min-height:200px !important;
  max-width:356px !important;
  max-height:200px !important;
  opacity:.001 !important;
  overflow:hidden !important;
  pointer-events:none !important;
  z-index:-1 !important;
}

.now-playing-dialog.player-minimized .video-stage{
  display:block !important;
  width:356px !important;
  height:200px !important;
  min-width:356px !important;
  min-height:200px !important;
  overflow:hidden !important;
}

.now-playing-dialog.player-minimized #youtubePlayer,
.now-playing-dialog.player-minimized #youtubePlayer iframe{
  display:block !important;
  width:356px !important;
  height:200px !important;
  min-width:356px !important;
  min-height:200px !important;
}


/* v1.6.10 — fixed Now Playing header + scrollable player body */
.now-playing-dialog:not(.player-minimized){
  overflow:hidden !important;
  display:flex !important;
  flex-direction:column !important;
}

.now-playing-dialog:not(.player-minimized) .dialog-header{
  position:relative !important;
  top:auto !important;
  flex:0 0 64px !important;
  width:100% !important;
  z-index:4 !important;
  background:rgba(7,7,7,.98) !important;
}

.now-playing-dialog:not(.player-minimized) .player-scroll-frame{
  flex:1 1 auto !important;
  min-height:0 !important;
  overflow-y:auto !important;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
  width:100% !important;
}

@media(max-width:899px){
  .now-playing-dialog:not(.player-minimized) .player-scroll-frame{
    display:block !important;
  }
  .now-playing-dialog:not(.player-minimized) .video-stage{
    width:100% !important;
  }
}

@media(min-width:900px){
  .now-playing-dialog:not(.player-minimized){
    width:min(94vw,1040px) !important;
    max-width:1040px !important;
    max-height:90vh !important;
  }

  .now-playing-dialog:not(.player-minimized) .player-scroll-frame{
    display:grid !important;
    grid-template-columns:minmax(360px,44%) minmax(0,56%) !important;
    align-items:start !important;
  }

  .now-playing-dialog:not(.player-minimized) .video-stage{
    grid-column:1 !important;
    width:100% !important;
    align-self:start !important;
  }

  .now-playing-dialog:not(.player-minimized) .now-playing-content{
    grid-column:2 !important;
    overflow:visible !important;
    padding:24px !important;
  }
}

/* Minimized Android/iOS compatibility player stays off-screen and unchanged in size. */
.now-playing-dialog.player-minimized .player-scroll-frame{
  display:block !important;
  width:356px !important;
  height:200px !important;
  overflow:hidden !important;
}