/* MuzGar v3: scoped visual redesign; pre-existing classes/IDs preserved. */
:root{color-scheme:dark;--mg-bg:#081013;--mg-card:#101d20;--mg-card2:#17272a;--mg-line:rgba(240,246,242,.1);--mg-text:#f5f8f4;--mg-muted:#a5b6b4;--mg-gold:#e9c27b;--mg-accent:#67d7c2;--mg-r:18px;--mg-shadow:0 18px 44px rgba(0,0,0,.22)}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;color:var(--mg-text);background:radial-gradient(circle at 12% 0%,#143332 0%,transparent 34%),radial-gradient(circle at 98% 22%,#142525 0%,transparent 32%),var(--mg-bg);font:400 15px/1.55 system-ui,-apple-system,"Segoe UI",Arial,sans-serif;text-align:left;min-width:0}
body,button,input,textarea,select{font-family:system-ui,-apple-system,"Segoe UI",Arial,sans-serif!important}
a{color:inherit;transition:color .16s ease,background-color .16s ease;text-decoration:none}
a:hover{color:var(--mg-accent)}
button{cursor:pointer}img{max-width:100%;height:auto}
:focus-visible{outline:2px solid var(--mg-accent)!important;outline-offset:3px}
.main-center-block{width:min(1320px,calc(100% - 48px));margin:auto;max-width:100%;text-align:left}
.body2{background:none!important;min-height:100vh}
.head-block{height:116px;display:flex;align-items:center;justify-content:flex-start;position:relative;padding:0 24px}
.logo{position:relative;left:auto;top:auto;display:block;width:245px;height:85px;margin:0;background-image:url(/images/logo.png);background-size:contain;background-position:left center;background-repeat:no-repeat;filter:drop-shadow(0 3px 18px rgba(233,194,123,.14))}
.content-block{background:rgba(15,27,30,.94);border:1px solid var(--mg-line);border-radius:26px;box-shadow:0 28px 86px rgba(0,0,0,.28);padding:0 23px 18px;overflow:visible;display:flow-root}
.top-menu{height:auto!important;min-height:61px;display:flex;flex-wrap:wrap;align-items:center;gap:5px;margin:0 -23px 18px!important;padding:8px 18px;background:#12272a!important;border-bottom:1px solid var(--mg-line);border-radius:25px 25px 0 0;float:none!important;list-style:none}
.top-menu li,.top-menu li:last-child{height:auto!important;float:none!important;position:relative;list-style:none}
.top-menu-link,.menu-more-link{background:transparent!important;border:0;display:inline-flex;align-items:center;justify-content:center;height:41px;line-height:normal;padding:0 14px;border-radius:12px;color:#d9e9e5!important;font-weight:650;letter-spacing:.01em;font-size:13px;text-transform:none}
.top-menu-link:hover,.top-menu-link[aria-current="page"],.top-menu-link.is-active{color:#061915!important;background:var(--mg-gold)!important}
.mob-menu{display:none}
.search-block{position:relative;width:100%;height:auto;min-height:56px;margin:0 0 24px;padding:0;float:none;background:transparent}
.search-block form{display:flex;align-items:center;gap:8px;max-width:680px;margin:0!important;position:relative}
.search-block .form-text,.search-block input[name="story"]{display:block;min-height:53px;width:100%;float:none;padding:0 62px 0 20px!important;color:var(--mg-text);background:#0b181b;border:1px solid rgba(255,255,255,.16);border-radius:16px;font-size:15px;box-shadow:inset 0 1px 4px rgba(0,0,0,.17)}
.search-block .form-text:focus{border-color:var(--mg-accent);outline:none}
.search-block .form-search{position:absolute;right:10px;top:10px;width:34px;height:33px;padding:8px;background:var(--mg-gold);border-radius:11px;object-fit:contain;border:0}
.left-col{width:calc(100% - 337px);margin:0 23px 0 0;float:left;color:var(--mg-text);min-width:0}
.right-col{width:314px;float:right;margin:0;color:var(--mg-text)}
.main-block{background:var(--mg-card)!important;border:1px solid var(--mg-line);border-radius:var(--mg-r);box-shadow:0 6px 22px rgba(0,0,0,.12);overflow:hidden;margin:0 0 18px;padding:0}
.main-block-title{color:var(--mg-text);font-size:18px;font-weight:760;line-height:1.35;letter-spacing:-.02em;padding:17px 19px;border-bottom:1px solid var(--mg-line);background:linear-gradient(120deg,rgba(233,194,123,.09),transparent 65%);min-height:0;height:auto}
.main-block-title h1{font-size:21px;color:var(--mg-text);line-height:1.4}
.main-block-title img{display:none!important}
.main-block-content{padding:10px 13px 13px;display:flow-root;background:transparent!important}
.cols-news{width:calc(50% - 9px);margin:0 18px 0 0;float:left;color:var(--mg-text)}
.cols-news:nth-child(2){margin-right:0}
.cols-news:first-child{margin-right:18px}
.top-news{display:flex;align-items:center;gap:12px;min-height:63px;margin:3px 0;padding:8px 10px;background:transparent;border-radius:12px;color:var(--mg-text)}
.top-news:hover{background:var(--mg-card2)}
.top-news-image{flex:none;overflow:hidden;border-radius:10px;width:47px;height:47px}
.top-news-image img{width:100%;height:100%;object-fit:cover}
.top-news-title{color:var(--mg-text);font-weight:680;font-size:14px;line-height:1.34;min-width:0}
.top-news-title i{display:block;color:var(--mg-muted);font-size:12px;font-style:normal;font-weight:450}
.top-singer{display:block;position:relative;color:#d9e6e3;padding:10px 10px 10px 36px;margin-bottom:3px;border-radius:9px;border-bottom:1px solid rgba(255,255,255,.05);font-size:13px;line-height:1.4}
.top-singer:hover{background:var(--mg-card2)}
.top-singer i{position:absolute;left:7px;top:9px;font-style:normal;color:var(--mg-gold);font-weight:800}
.main-news{display:flex;align-items:center;gap:15px;min-width:0;min-height:94px;padding:13px 10px;margin:0;border-bottom:1px solid var(--mg-line);position:relative;background:transparent;transition:background-color .17s}
.main-news:last-child{border-bottom:0}.main-news:hover{background:#192b2e}
.main-news-image,.track-card{position:relative;flex:0 0 68px;width:68px;height:68px;overflow:hidden;border-radius:14px;margin:0!important;background:#223533;float:none!important}
.main-news-image img,.track-card img{width:100%;height:100%;display:block;object-fit:cover}
.track-card__play{position:absolute;left:0;right:0;top:0;bottom:0;margin:auto;width:37px;height:37px;border:none;border-radius:50%;display:grid;place-items:center;background:rgba(4,23,25,.75);color:white;cursor:pointer;box-shadow:0 6px 16px rgba(0,0,0,.24);backdrop-filter:blur(5px)}
.track-card__play:hover{background:var(--mg-gold);color:#0b1c1c;transform:scale(1.04)}
.track-card__play svg{width:18px;height:18px;fill:currentColor}.track-card .ico-pause{display:none}.track-card.playing .ico-play{display:none}.track-card.playing .ico-pause{display:block}
.main-news-text{min-width:0;flex:1;float:none!important;width:auto!important;margin:0!important;padding:0!important;overflow:hidden}
.main-news-title{display:block;color:var(--mg-text);font-size:15px;font-weight:720;line-height:1.33;overflow-wrap:anywhere}
.main-news-title .top-news-title-author{display:block;color:var(--mg-muted);font-size:12px;font-weight:540;margin-bottom:5px}
.main-news-title i{display:block;font-size:15px;font-weight:720;font-style:normal;color:var(--mg-text)}
.main-news.playing .main-news-title i,.main-news.playing .main-news-title{color:var(--mg-accent)}
.main-news-right{flex:0 0 auto;display:flex;align-items:center;gap:8px;margin:0;padding:0;float:none!important}
.main-news-more{margin:0!important;flex:none}.main-news-more a{display:block}
.main-news-rating{display:none}
.track-mini{display:flex;gap:8px;align-items:center;opacity:0;max-height:0;margin:0;overflow:hidden;transition:opacity .2s,max-height .2s}
.main-news.playing .track-mini{opacity:1;max-height:30px;margin-top:5px}
.mini-current,.mini-duration{font-size:11px;color:var(--mg-muted);font-variant-numeric:tabular-nums}
.mini-range,.tp-range{accent-color:var(--mg-gold);min-width:0;cursor:pointer}
.main-block .navigation,.bottom-nav,.nav-load{text-align:center;color:var(--mg-muted)}
.nav-load a,#nav-load a{display:inline-block;padding:10px 23px;background:#254341;color:var(--mg-text);border-radius:12px}
.footer{background:transparent!important;border:none!important;padding:23px 8px 32px;box-shadow:none;color:var(--mg-muted)}
.footer-menu a{color:var(--mg-muted);padding:6px 12px;display:inline-block}.footer-menu a:hover{color:var(--mg-gold)}
.footer-text{color:var(--mg-muted);font-size:12px;line-height:1.7}
.footer-right{max-width:100%}
input:not([type=range]):not([type=image]):not([type=hidden]),textarea,select{border-radius:11px;background:#14272a;border:1px solid var(--mg-line);color:var(--mg-text)}
input[type=submit],button:not(.track-card__play):not(.tp-action):not(.tp-vol-btn):not(.mg-control){border-radius:11px}
/* Full track page: preserve the entire existing .track-player hierarchy */
.full-news{--track-bg:none;position:relative;overflow:hidden;border-radius:18px;background:#15302f;padding:21px;margin:0 0 15px;isolation:isolate}
.full-news::before{content:"";position:absolute;inset:-35px;background-image:var(--track-bg);background-position:center;background-size:cover;filter:blur(38px) brightness(.34);z-index:-2;opacity:.82}
.full-news::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(120deg,rgba(4,16,19,.65),rgba(8,37,39,.69))}
.full-news-player{border:0!important;border-radius:16px;background:rgba(6,18,21,.42)!important;padding:18px!important;box-shadow:none!important;backdrop-filter:none!important}
.track-player{width:100%;max-width:100%;display:flex;align-items:center;gap:22px}
.track-player__cover{flex:0 0 200px;max-width:200px;overflow:hidden;border-radius:16px;animation:none!important}
.track-player__cover img{width:200px;height:200px;max-width:100%;object-fit:cover;border-radius:15px}
.track-player__body{flex:1;min-width:0}
.track-player__title{color:white;font-size:clamp(21px,2.4vw,28px);line-height:1.2;margin:0 0 8px;font-weight:830}
.track-player__artist,.track-player__artist a{color:#e7f3ed;font-size:14px}
.track-player__submeta{display:flex;gap:8px;flex-wrap:wrap;margin:9px 0;color:#dce5df}
.track-player__info{display:flex;gap:7px;flex-wrap:wrap;margin:11px 0;color:#e4f0e7}
.tp-info{background:rgba(250,250,250,.11);border-radius:8px;color:#d4e5df;padding:5px 8px;font-size:11px}
.tp-info span,.tp-ico{color:#dbece4}
.tp-meta-genre{background:rgba(233,194,123,.12);color:var(--mg-gold)}
.tp-meta-genre a{color:inherit}
.track-player__controls{display:flex;gap:12px;align-items:center;margin:17px 0 7px}
.tp-action{height:42px!important;display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid rgba(255,255,255,.15);border-radius:12px!important;padding:0 18px;background:#f0c982!important;color:#0c2524!important;font-weight:780;font-size:13px;white-space:nowrap}
.tp-action svg{width:18px;height:18px;color:inherit;fill:currentColor}.tp-action:hover{background:var(--mg-accent)!important;color:#0b2220!important}
.tp-download{margin-left:0!important;box-shadow:none!important;background:rgba(255,255,255,.13)!important;color:#fff!important}.tp-download:hover{background:rgba(255,255,255,.23)!important}
.tp-ico-pause{display:none}.track-player.playing .tp-ico-play{display:none}.track-player.playing .tp-ico-pause{display:block}
.track-player__bar{display:flex!important;max-height:45px!important;opacity:1!important;gap:9px;align-items:center;margin:15px 0 0}
.tp-time{color:#d5e4e1;font-size:12px;font-variant-numeric:tabular-nums}.tp-volume{display:flex;align-items:center;gap:8px}.tp-vol-range{accent-color:var(--mg-gold)}
.dle-rating-line{display:flex;align-items:center;gap:10px;margin:15px 0;color:#e3e5e2}.dle-rating-empty{color:var(--mg-gold)}
body.mg-has-player{padding-bottom:112px}
/* Persistent player, created lazily on first play */
#mg-audio-bar{position:fixed;left:50%;bottom:14px;transform:translate(-50%,130%);z-index:2147480000;display:grid;grid-template-columns:minmax(0,1.2fr) auto minmax(0,1.2fr);align-items:center;gap:16px;width:min(1110px,calc(100vw - 28px));height:85px;padding:11px 17px;color:white;background:rgba(17,37,38,.98);border:1px solid rgba(233,194,123,.24);border-radius:19px;box-shadow:0 20px 65px rgba(0,0,0,.56);transition:transform .28s ease;visibility:hidden}
#mg-audio-bar.mg-visible{transform:translate(-50%,0);visibility:visible}
.mg-now{min-width:0;display:flex;align-items:center;gap:12px}
.mg-cover{flex:0 0 57px;width:57px;height:57px;border-radius:10px;object-fit:cover;background:#284341}
.mg-now-text{min-width:0;overflow:hidden}.mg-now-title,.mg-now-artist{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mg-now-title{font-size:14px;font-weight:750}.mg-now-artist{font-size:12px;color:var(--mg-muted)}
.mg-center{display:flex;align-items:center;gap:7px}.mg-right{display:flex;align-items:center;justify-content:flex-end;gap:9px;min-width:0}
.mg-control{display:grid;place-items:center;flex-shrink:0;width:34px;height:34px;padding:0;border:0;border-radius:50%;background:transparent;color:#dbe9e5}.mg-control:hover{background:rgba(255,255,255,.12)}.mg-control svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8}
.mg-control.mg-primary{width:43px;height:43px;background:var(--mg-gold);color:#102322}.mg-primary svg{fill:currentColor;stroke:none}
.mg-seek{display:flex;align-items:center;gap:9px;min-width:0;width:100%}.mg-time{color:var(--mg-muted);font-size:11px;font-variant-numeric:tabular-nums;white-space:nowrap}
#mg-audio-bar input[type=range]{min-width:0;width:100%;margin:0;accent-color:var(--mg-gold);cursor:pointer;background:transparent}
#mg-audio-bar .mg-volume-range{width:80px}.mg-seek-range{flex:1}.mg-error{color:#ffb4a7;font-size:11px;max-width:110px}
.mg-loading .mg-primary{opacity:.6;cursor:wait}
.mg-nav-loading .left-col{opacity:.62;transition:opacity .16s}
@media(max-width:1040px){.main-center-block{width:min(100% - 24px,970px)}.content-block{padding:0 14px 16px}.top-menu{margin-left:-14px!important;margin-right:-14px!important}.left-col{width:calc(100% - 282px);margin-right:16px}.right-col{width:266px}.main-news-right{display:none}.track-player__cover{flex-basis:155px}.track-player__cover img{width:155px;height:155px}}
@media(max-width:750px){.main-center-block{width:100%;padding:0 9px}.head-block{height:85px;padding:0 8px}.logo{width:195px;height:67px}.content-block{padding:0 10px 12px;border-radius:17px}.mob-menu{display:block!important;min-height:47px;line-height:47px;margin:0 -10px;padding:0 17px;background:#183333;color:var(--mg-gold);font-weight:760;cursor:pointer;border-radius:16px 16px 0 0}.top-menu{display:none;clear:both;float:none;position:relative;margin:0 -10px 12px!important;padding:9px;border-radius:0;background:#142b2b!important}.top-menu.mg-open{display:flex!important;flex-direction:column;align-items:stretch;gap:4px}.top-menu li{display:block;width:100%}.top-menu-link{display:flex!important;justify-content:flex-start;width:100%}.search-block{margin:12px 0 17px}.search-block form{max-width:100%}.left-col,.right-col{width:100%;float:none;margin:0}.right-col{margin-top:18px}.main-block-title{font-size:16px;padding:14px}.main-block-title h1{font-size:19px}.cols-news{float:none;width:100%;margin:0!important}.main-news{gap:10px;min-height:77px;padding:9px 5px}.main-news-image,.track-card{flex-basis:55px;width:55px;height:55px;border-radius:10px}.main-news-title i{font-size:14px}.track-card__play{width:32px;height:32px}.main-block-content{padding:8px}.full-news{padding:10px}.full-news-player{padding:10px!important}.track-player{flex-direction:column;gap:15px}.track-player__cover{flex-basis:auto;width:140px;max-width:140px}.track-player__cover img{width:140px;height:140px}.track-player__body{width:100%;text-align:center}.track-player__artist,.track-player__submeta,.track-player__info,.track-player__controls,.track-player__bar{justify-content:center}.track-player__info{gap:5px}.tp-info{font-size:10px}.footer-menu{text-align:center}.footer-text{text-align:center}body.mg-has-player{padding-bottom:111px}#mg-audio-bar{bottom:0;left:0;transform:translateY(130%);width:100%;height:93px;padding:8px 11px 12px;border-radius:15px 15px 0 0;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:46px 22px;gap:3px 8px}#mg-audio-bar.mg-visible{transform:translateY(0)}.mg-now{grid-column:1;grid-row:1}.mg-cover{width:42px;height:42px;flex-basis:42px}.mg-now-title{font-size:13px}.mg-center{grid-column:2;grid-row:1}.mg-center .mg-control[data-act=prev],.mg-center .mg-control[data-act=next]{width:27px}.mg-center .mg-primary{width:39px;height:39px}.mg-right{grid-row:2;grid-column:1 / -1}.mg-right .mg-control[data-act=mute],.mg-volume-range,.mg-right .mg-control[data-act=close]{display:none}.mg-seek{width:100%}.mg-right .mg-seek{order:1}.mg-time{font-size:10px}}
@media(max-width:380px){.mg-center .mg-control[data-act=prev],.mg-center .mg-control[data-act=next]{display:none}.track-player__info{gap:3px}.tp-action{padding:0 11px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}}


/* MuzGar TOP FIX v1 — 2026-10-31
   Restores flex layout for weekly/monthly charts after legacy base CSS.
   Keeps all existing HTML tags, classes, and IDs unchanged.
*/
.cols-news .top-news {
  display: flex !important;
  align-items: center;
  gap: 13px;
  position: relative;
  padding: 9px 12px !important;
  min-height: 75px;
  margin: 2px 0 !important;
  border-radius: 12px;
  background-image: none !important;
  text-align: left;
  box-sizing: border-box;
}
.cols-news .top-news-image,
.cols-news .top-news:hover .top-news-image {
  display: block;
  position: relative !important;
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  left: auto !important;
  float: none !important;
  flex: 0 0 48px;
  width: 48px !important;
  height: 48px !important;
  min-width: 48px;
  margin: 0;
  padding: 0;
  border: 0 !important;
  border-radius: 12px !important;
  overflow: hidden;
  background: #243a3d;
  box-sizing: border-box;
}
.cols-news .top-news-image img,
.cols-news .top-news:hover .top-news-image img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none;
  margin: 0;
  border-radius: inherit !important;
  object-fit: cover;
  object-position: center;
}
.cols-news .top-news-title,
.cols-news .top-news:hover .top-news-title {
  display: block;
  flex: 1 1 0;
  min-width: 0;
  max-width: 100%;
  margin: 0;
  padding: 0;
  font-size: 14px;
  line-height: 1.38;
  color: var(--mg-text, #f5f8f4);
  overflow-wrap: anywhere;
}
.cols-news .top-news-title-author {
  display: block;
  font-weight: 700;
  line-height: 1.4;
}
.cols-news .top-news-title i {
  display: block;
  margin-top: 3px;
  color: var(--mg-muted, #a5b6b4);
  font-size: 12px;
  font-weight: 450;
  font-style: normal;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.cols-news .top-news:hover {
  background: var(--mg-card2, #17272a);
}
.cols-news .top-news:hover .top-news-title-author {
  color: var(--mg-gold, #e9c27b);
}
@media (max-width: 750px) {
  .cols-news .top-news {gap: 11px; padding: 8px 10px !important; min-height: 69px;}
  .cols-news .top-news-image,
  .cols-news .top-news:hover .top-news-image {
    flex-basis: 43px;
    width: 43px !important;
    height: 43px !important;
    min-width: 43px;
    border-radius: 10px !important;
  }
}