/* MUSIC FM — Charts premium experience · 2026-10-09 */
.mf-chart-body{background:#f4f7fb;color:#07182f}
.mfc-chart-page{--mfc-navy:#06172e;--mfc-navy-2:#0a2445;--mfc-blue:#0d6efd;--mfc-cyan:#12b9d6;--mfc-red:#e12b4c;--mfc-purple:#7856ff;--mfc-ink:#091a31;--mfc-muted:#6c7a8d;--mfc-line:#dbe4ef;--mfc-paper:#fff;--mfc-soft:#eef4fa;--mfc-control-radius:6px;position:relative;direction:rtl;overflow:clip;padding:28px 0 86px;background:linear-gradient(180deg,#eef4fa 0,#f8fafc 400px,#f4f7fb 100%);isolation:isolate}
.mfc-chart-page:before{content:"";position:absolute;inset:0 0 auto;height:520px;z-index:-1;pointer-events:none;background:linear-gradient(90deg,rgba(13,110,253,.05) 1px,transparent 1px),linear-gradient(rgba(13,110,253,.05) 1px,transparent 1px);background-size:46px 46px;mask-image:linear-gradient(#000,transparent)}
.mfc-chart-page *{box-sizing:border-box}
.mfc-chart-page button,.mfc-chart-page input{font:inherit}
.mfc-chart-shell{width:min(1480px,calc(100% - 40px));margin-inline:auto;display:grid;gap:22px}

/* HERO */
.mfc-chart-hero{min-height:510px;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(430px,.9fr);background:var(--mfc-paper);border:1px solid #d4deea;box-shadow:0 24px 70px rgba(11,31,58,.12);position:relative;overflow:hidden}
.mfc-chart-hero:after{content:"20";position:absolute;right:-26px;bottom:-100px;font-size:370px;line-height:1;font-weight:1000;letter-spacing:-32px;color:#eef4fb;z-index:0;pointer-events:none;user-select:none}
.mfc-chart-hero-copy{position:relative;z-index:2;padding:62px 68px;display:flex;flex-direction:column;justify-content:center;border-left:1px solid #e0e7ef;background:linear-gradient(145deg,#fff 0 68%,#f7fbff 100%)}
.mfc-chart-kicker{display:flex;align-items:center;gap:12px;width:max-content;color:var(--mfc-blue);font-size:12px;font-weight:950;letter-spacing:.12em}.mfc-chart-kicker:before{content:"";width:38px;height:2px;background:linear-gradient(90deg,var(--mfc-blue),var(--mfc-cyan))}.mfc-chart-kicker b{color:#92a0b2;font-weight:900}.mfc-chart-date{margin:20px 0 0;color:#637287;font-size:13px;font-weight:850}
.mfc-chart-hero h1{margin:12px 0 18px;color:var(--mfc-ink);font-size:clamp(58px,6.4vw,98px);font-weight:1000;line-height:.88;letter-spacing:-5px}.mfc-chart-hero h1 strong{font-weight:1000;color:var(--mfc-blue)}
.mfc-chart-intro{max-width:690px;margin:0;color:#56667a;font-size:17px;line-height:1.85;font-weight:650}
.mfc-chart-hero-actions{display:flex;align-items:center;gap:10px;margin-top:30px}.mfc-primary-action,.mfc-secondary-action{min-height:50px;border-radius:3px;display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:0 18px;text-decoration:none;font-weight:950;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease,background .2s ease}.mfc-primary-action{border:1px solid var(--mfc-navy);background:var(--mfc-navy);color:#fff;box-shadow:0 10px 24px rgba(6,23,46,.16)}.mfc-secondary-action{border:1px solid #d6e0eb;background:#fff;color:var(--mfc-ink)}.mfc-primary-action svg,.mfc-secondary-action svg{width:17px;height:17px}.mfc-primary-action:hover,.mfc-secondary-action:hover{transform:translateY(-2px)}

.mfc-chart-leader{position:relative;z-index:2;display:grid;grid-template-rows:minmax(0,1fr) auto;background:var(--mfc-navy);color:#fff;min-width:0}.mfc-leader-art{position:relative;min-height:300px;overflow:hidden;background:#10233d}.mfc-leader-art:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 35%,rgba(6,23,46,.26) 70%,var(--mfc-navy) 100%)}.mfc-leader-art img{width:100%;height:100%;object-fit:cover;display:block;transform:scale(1.015)}.mfc-leader-number{position:absolute;z-index:3;right:24px;bottom:12px;font-size:118px;line-height:.8;font-weight:1000;letter-spacing:-10px;color:#fff;text-shadow:0 12px 30px rgba(0,0,0,.28)}.mfc-leader-number:before{content:"#";font-size:26px;vertical-align:top;margin-left:5px;color:#54d7ef}.mfc-leader-shine{position:absolute;left:-60px;top:-60px;width:180px;height:180px;border:1px solid rgba(255,255,255,.22);transform:rotate(22deg);box-shadow:0 0 0 22px rgba(255,255,255,.025),0 0 0 44px rgba(255,255,255,.018)}
.mfc-leader-info{position:relative;padding:23px 26px 27px}.mfc-leader-info:before{content:"";position:absolute;top:0;right:26px;width:56px;height:3px;background:linear-gradient(90deg,var(--mfc-blue),var(--mfc-cyan))}.mfc-leader-topline{display:flex;align-items:center;justify-content:space-between;gap:10px;color:#b8c6d7;font-size:11px;font-weight:900;letter-spacing:.05em}.mfc-leader-topline em{font-style:normal;color:#d7e3ef}.mfc-leader-topline em.is-up{color:#54e0c0}.mfc-leader-topline em.is-down{color:#ff7890}.mfc-leader-topline em.is-new{color:#70cfff}
.mfc-leader-info h2{margin:9px 0 4px;font-size:31px;line-height:1.08;font-weight:1000;letter-spacing:-1.1px}.mfc-leader-info p{margin:0;color:#b8c6d7;font-size:14px;font-weight:750}.mfc-leader-actions{display:flex;align-items:center;gap:8px;margin-top:18px}.mfc-icon-action,.mfc-like-action,.mfc-vote-action{height:42px;border-radius:3px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.08);color:#fff;display:inline-flex;align-items:center;justify-content:center;gap:7px;cursor:pointer;transition:.2s ease}.mfc-icon-action{width:42px;background:#fff;color:var(--mfc-navy);border-color:#fff}.mfc-icon-action svg,.mfc-like-action svg,.mfc-vote-action svg{width:15px;height:15px}.mfc-like-action{padding:0 13px}.mfc-like-action.is-active{background:rgba(225,43,76,.16);border-color:rgba(255,101,128,.38);color:#ff7790}.mfc-vote-action{margin-right:auto;padding:0 14px;background:linear-gradient(135deg,#0d6efd,#10b7d4);border-color:transparent;font-weight:950}.mfc-vote-action small{min-width:18px;padding-right:6px;border-right:1px solid rgba(255,255,255,.25);font-size:10px}.mfc-vote-action.is-active,.mfc-vote-action:disabled{background:rgba(255,255,255,.1);color:#aee8df;cursor:default;opacity:1}
.mfc-chart-leader--empty{align-content:center;justify-items:center;padding:40px;text-align:center}.mfc-chart-leader--empty strong{font-size:28px}.mfc-chart-leader--empty span{margin-top:8px;color:#a9b9cb}

/* 2 / 3 */
.mfc-podium{display:grid;grid-template-columns:1fr 1fr;gap:14px}.mfc-podium-card{position:relative;display:grid;grid-template-columns:112px 120px minmax(0,1fr) auto;align-items:stretch;min-height:126px;background:#fff;border:1px solid #d8e1eb;box-shadow:0 12px 34px rgba(12,36,67,.07);overflow:hidden}.mfc-podium-card:before{content:"";position:absolute;inset:0 auto 0 0;width:3px;background:linear-gradient(var(--mfc-blue),var(--mfc-cyan))}.mfc-podium-rank{display:flex;align-items:center;justify-content:center;background:#f6f9fc;border-left:1px solid #e3eaf2;color:#0a2343;font-size:54px;font-weight:1000;letter-spacing:-4px}.mfc-podium-card img{width:120px;height:100%;min-height:124px;object-fit:cover;display:block}.mfc-podium-copy{min-width:0;padding:20px 19px;align-self:center}.mfc-podium-status{display:flex;align-items:center;gap:10px;color:#8a98aa;font-size:10px;font-weight:900}.mfc-podium-status em{font-style:normal}.mfc-podium-status em.is-up{color:#049b7f}.mfc-podium-status em.is-down{color:#d92d50}.mfc-podium-status em.is-new{color:#0d6efd}.mfc-podium-copy h3{margin:8px 0 3px;color:#0b1d34;font-size:20px;line-height:1.12;font-weight:1000;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mfc-podium-copy p{margin:0;color:#6c7a8d;font-size:13px;font-weight:750}.mfc-podium-actions{display:flex;align-items:center;gap:6px;padding:0 18px 0 22px}.mfc-mini-play,.mfc-mini-like,.mfc-mini-vote{height:38px;border:1px solid #d9e2ec;border-radius:3px;background:#fff;color:#183450;display:inline-flex;align-items:center;justify-content:center;gap:6px;cursor:pointer;font-weight:900}.mfc-mini-play{width:38px;background:#071a33;color:#fff;border-color:#071a33}.mfc-mini-like{padding:0 10px}.mfc-mini-vote{padding:0 12px}.mfc-mini-play svg,.mfc-mini-like svg,.mfc-mini-vote svg{width:14px;height:14px}.mfc-mini-like.is-active{color:#d92d50;background:#fff3f5;border-color:#ffd3dc}.mfc-mini-vote.is-active,.mfc-mini-vote:disabled{background:#eef9f7;color:#087f6b;border-color:#ccece6;cursor:default;opacity:1}.mfc-mini-vote small{font-size:9px;color:inherit;opacity:.7}

/* BOARD */
.mfc-chart-board{background:#fff;border:1px solid #d6e0ea;box-shadow:0 16px 50px rgba(10,34,64,.07)}.mfc-board-head{min-height:118px;padding:0 30px;display:flex;align-items:center;justify-content:space-between;gap:24px;border-bottom:1px solid #dde5ee;background:linear-gradient(180deg,#fff,#fbfdff)}.mfc-board-head>div:first-child span{display:block;color:#0d6efd;font-size:10px;font-weight:950;letter-spacing:.14em}.mfc-board-head h2{margin:5px 0 0;color:#07182f;font-size:34px;font-weight:1000;letter-spacing:-1.3px}.mfc-board-period{padding-right:22px;border-right:1px solid #dfe6ef;min-width:180px}.mfc-board-period small{display:block;color:#8a96a7;font-size:10px;font-weight:900}.mfc-board-period strong{display:block;margin-top:5px;color:#1a2f49;font-size:14px;font-weight:950}
.mfc-chart-list{display:grid}.mfc-chart-row{min-height:92px;display:grid;grid-template-columns:82px 70px minmax(220px,1.35fr) 150px 150px 260px;align-items:center;border-bottom:1px solid #e6ecf2;position:relative;transition:background .18s ease,transform .18s ease}.mfc-chart-row:last-child{border-bottom:0}.mfc-chart-row:hover{background:#f9fbfe}.mfc-chart-row:before{content:"";position:absolute;right:0;top:0;bottom:0;width:3px;background:transparent;transition:background .18s ease}.mfc-chart-row:hover:before{background:var(--mfc-blue)}.mfc-row-rank{align-self:stretch;display:flex;align-items:center;justify-content:center;border-left:1px solid #e7edf3;color:#132d4d;font-size:28px;font-weight:1000;letter-spacing:-2px;background:#fbfcfe}.mfc-row-cover{padding:10px}.mfc-row-cover img{width:52px;height:52px;display:block;object-fit:cover;border-radius:2px;box-shadow:0 5px 15px rgba(13,35,62,.16)}.mfc-row-song{min-width:0;padding:0 12px}.mfc-row-song strong{display:block;color:#101f34;font-size:16px;line-height:1.25;font-weight:950;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mfc-row-song span{display:block;margin-top:4px;color:#738095;font-size:12px;font-weight:720;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mfc-row-move{display:grid;gap:2px;padding:0 14px}.mfc-row-move b{font-size:15px;font-weight:1000}.mfc-row-move span{font-size:10px;font-weight:800;color:#8996a8}.mfc-row-move.is-up b{color:#07947b}.mfc-row-move.is-down b{color:#d52f4d}.mfc-row-move.is-new b{color:#0d6efd}.mfc-row-move.is-same b{color:#718096}.mfc-row-numbers{display:flex;align-items:center;gap:18px;color:#69788c}.mfc-row-numbers span{display:flex;align-items:center;gap:6px;font-size:11px}.mfc-row-numbers svg{width:13px;height:13px;color:#9ba8b8}.mfc-row-numbers b{color:#42536a;font-size:11px}.mfc-row-actions{display:flex;align-items:center;justify-content:flex-end;gap:7px;padding-left:18px}.mfc-row-like,.mfc-row-vote,.mfc-row-play{height:38px;border-radius:3px;border:1px solid #d7e1eb;background:#fff;color:#17344f;display:inline-flex;align-items:center;justify-content:center;gap:6px;cursor:pointer;font-weight:900;transition:.18s ease}.mfc-row-like{width:38px}.mfc-row-vote{min-width:94px;padding:0 12px}.mfc-row-play{width:38px;background:#071a33;border-color:#071a33;color:#fff}.mfc-row-like svg,.mfc-row-vote svg,.mfc-row-play svg{width:14px;height:14px}.mfc-row-like:hover,.mfc-row-vote:hover{border-color:#9db5d0;background:#f7fbff}.mfc-row-like.is-active{color:#d92d50;border-color:#ffd0da;background:#fff5f7}.mfc-row-vote.is-active,.mfc-row-vote:disabled{color:#087f6b;border-color:#c9e9e3;background:#effaf8;cursor:default;opacity:1}.mfc-row-play:hover{background:#0e2b51}
.mfc-chart-empty{padding:74px 25px;text-align:center}.mfc-chart-empty>span{color:#0d6efd;font-size:10px;font-weight:950;letter-spacing:.14em}.mfc-chart-empty h3{margin:9px 0 7px;font-size:28px}.mfc-chart-empty p{margin:0;color:#718096}

/* CTA */
.mfc-chart-community-callout{min-height:190px;display:flex;align-items:center;justify-content:space-between;gap:30px;padding:36px 42px;background:var(--mfc-navy);color:#fff;position:relative;overflow:hidden}.mfc-chart-community-callout:after{content:"MUSIC FM";position:absolute;left:-10px;bottom:-28px;font-size:92px;font-weight:1000;letter-spacing:-6px;color:rgba(255,255,255,.035);white-space:nowrap;pointer-events:none}.mfc-chart-community-callout>div,.mfc-chart-community-callout>button{position:relative;z-index:1}.mfc-chart-community-callout span{color:#57d7ec;font-size:10px;font-weight:950;letter-spacing:.14em}.mfc-chart-community-callout h2{margin:5px 0 5px;font-size:32px;font-weight:1000}.mfc-chart-community-callout p{margin:0;color:#b9c8d8;font-size:14px}.mfc-chart-community-callout button{height:48px;padding:0 18px;border:1px solid rgba(255,255,255,.25);border-radius:3px;background:#fff;color:#07182f;display:inline-flex;align-items:center;gap:9px;font-weight:950;cursor:pointer}.mfc-chart-community-callout button svg{width:16px;height:16px}

/* MODAL */
.mfc-chart-modal{position:fixed;inset:0;z-index:10030;display:grid;place-items:center;padding:22px;visibility:hidden;opacity:0;pointer-events:none;transition:opacity .22s ease,visibility .22s ease}.mfc-chart-modal.is-open{visibility:visible;opacity:1;pointer-events:auto}.mfc-chart-modal-backdrop{position:absolute;inset:0;border:0;background:rgba(2,12,26,.62);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);cursor:default}.mfc-chart-sheet{position:relative;width:min(720px,100%);max-height:min(760px,calc(100vh - 44px));display:flex;flex-direction:column;background:#fff;border:1px solid rgba(255,255,255,.45);box-shadow:0 35px 110px rgba(0,0,0,.34);transform:translateY(24px) scale(.985);transition:transform .26s cubic-bezier(.2,.8,.2,1)}.mfc-chart-modal.is-open .mfc-chart-sheet{transform:translateY(0) scale(1)}.mfc-sheet-head{min-height:102px;padding:0 26px;display:flex;align-items:center;justify-content:space-between;gap:20px;border-bottom:1px solid #e1e8ef}.mfc-sheet-head span{display:block;color:#0d6efd;font-size:9px;font-weight:950;letter-spacing:.14em}.mfc-sheet-head h2{margin:4px 0 0;color:#0b1e35;font-size:26px;font-weight:1000}.mfc-sheet-close{width:42px;height:42px;border:1px solid #dce4ed;background:#fff;color:#203a57;border-radius:3px;display:grid;place-items:center;cursor:pointer}.mfc-sheet-close svg{width:15px;height:15px}.mfc-sheet-search{height:56px;margin:20px 26px 0;display:flex;align-items:center;border:1px solid #cfd9e4;background:#fbfdff}.mfc-sheet-search svg{width:16px;height:16px;margin:0 16px;color:#7f8da0}.mfc-sheet-search input{width:100%;height:100%;border:0;outline:0;background:transparent;padding:0 0 0 16px;color:#10233b;font-weight:800}.mfc-sheet-search input::placeholder{color:#98a4b4}.mfc-sheet-search:focus-within{border-color:#8eb8ec;box-shadow:0 0 0 3px rgba(13,110,253,.08)}.mfc-sheet-note{margin:10px 26px 0;color:#7d8999;font-size:11px;font-weight:700}.mfc-suggest-results{padding:16px 26px 26px;overflow:auto;overscroll-behavior:contain}.mfc-suggest-loading{min-height:220px;display:grid;place-items:center;align-content:center;gap:12px;color:#718096}.mfc-suggest-loading span{width:25px;height:25px;border:2px solid #d6e2ef;border-top-color:#0d6efd;border-radius:50%;animation:mfc-spin .75s linear infinite}.mfc-suggest-loading b{font-size:12px}.mfc-suggest-list{display:grid;border-top:1px solid #e5ebf1}.mfc-suggest-item{min-height:78px;display:grid;grid-template-columns:58px minmax(0,1fr) auto;align-items:center;gap:13px;border-bottom:1px solid #e7edf3;padding:9px 0}.mfc-suggest-item img{width:58px;height:58px;object-fit:cover;border-radius:2px}.mfc-suggest-copy{min-width:0}.mfc-suggest-copy strong{display:block;color:#10243c;font-size:14px;font-weight:950;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mfc-suggest-copy span{display:block;margin-top:3px;color:#7b8798;font-size:11px;font-weight:750}.mfc-suggest-item button{height:38px;min-width:110px;padding:0 12px;border:1px solid #d7e0e9;border-radius:3px;background:#071a33;color:#fff;display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:900;cursor:pointer}.mfc-suggest-item button.is-done,.mfc-suggest-item button:disabled{background:#eef9f7;border-color:#cbe9e3;color:#087f6b;cursor:default;opacity:1}.mfc-suggest-add{position:relative;width:12px;height:12px;display:inline-block}.mfc-suggest-add:before,.mfc-suggest-add:after{content:"";position:absolute;inset:50% auto auto 50%;width:12px;height:2px;background:currentColor;transform:translate(-50%,-50%)}.mfc-suggest-add:after{transform:translate(-50%,-50%) rotate(90deg)}.mfc-suggest-empty{padding:52px 20px;text-align:center;color:#738095}.mfc-suggest-empty strong{display:block;color:#263c56;font-size:17px}.mfc-suggest-empty span{display:block;margin-top:5px;font-size:12px}

/* TOAST */
.mfc-chart-toast{position:fixed;z-index:10060;left:50%;bottom:28px;transform:translate(-50%,18px);min-width:260px;max-width:min(520px,calc(100% - 30px));padding:13px 17px;border-radius:3px;background:#07192f;color:#fff;box-shadow:0 18px 50px rgba(0,0,0,.24);font-size:12px;font-weight:850;text-align:center;opacity:0;visibility:hidden;transition:.22s ease}.mfc-chart-toast.is-visible{opacity:1;visibility:visible;transform:translate(-50%,0)}.mfc-chart-toast.is-error{background:#9d1732}
.mfc-chart-page .is-working{pointer-events:none;opacity:.55}
.mfc-chart-page [data-chart-item].is-flash{animation:mfc-row-flash .65s ease}
@keyframes mfc-spin{to{transform:rotate(360deg)}}
@keyframes mfc-row-flash{0%,100%{box-shadow:none}45%{box-shadow:inset 0 0 0 2px rgba(13,110,253,.28)}}

@media(max-width:1180px){
 .mfc-chart-hero{grid-template-columns:minmax(0,1fr) 390px}.mfc-chart-hero-copy{padding:48px 44px}.mfc-chart-hero h1{font-size:68px}.mfc-podium-card{grid-template-columns:82px 96px minmax(0,1fr)}.mfc-podium-card img{width:96px}.mfc-podium-actions{grid-column:3;padding:0 16px 14px;justify-content:flex-start}.mfc-podium-rank{grid-row:1/3}.mfc-chart-row{grid-template-columns:72px 66px minmax(190px,1.2fr) 120px 120px 220px}
}

@media(max-width:900px){
 .mfc-chart-page{padding-top:12px}.mfc-chart-shell{width:min(100% - 22px,760px);gap:12px}.mfc-chart-hero{grid-template-columns:1fr;min-height:0}.mfc-chart-hero:after{display:none}.mfc-chart-hero-copy{order:1;padding:38px 28px 34px;border-left:0;border-bottom:1px solid #e0e7ef}.mfc-chart-hero h1{font-size:64px}.mfc-chart-leader{order:2;grid-template-columns:46% 54%;grid-template-rows:auto;min-height:290px}.mfc-leader-art{min-height:290px}.mfc-leader-info{align-self:end;padding:26px 22px}.mfc-leader-number{font-size:84px}.mfc-leader-actions{flex-wrap:wrap}.mfc-vote-action{margin-right:0}.mfc-podium{grid-template-columns:1fr}.mfc-podium-card{grid-template-columns:88px 110px minmax(0,1fr) auto}.mfc-podium-rank{grid-row:auto}.mfc-podium-card img{width:110px}.mfc-podium-actions{grid-column:auto;padding:0 18px}.mfc-chart-row{grid-template-columns:58px 58px minmax(0,1fr) auto;min-height:82px}.mfc-row-rank{font-size:23px}.mfc-row-cover{padding:8px}.mfc-row-cover img{width:44px;height:44px}.mfc-row-move{display:none}.mfc-row-numbers{display:none}.mfc-row-actions{padding-left:12px}.mfc-row-vote span{display:none}.mfc-row-vote{min-width:38px;width:38px;padding:0}.mfc-board-head{min-height:100px;padding:0 20px}.mfc-chart-community-callout{padding:30px}.mfc-chart-community-callout:after{font-size:70px}
}

@media(max-width:600px){
 .mfc-chart-page{padding:6px 0 calc(92px + env(safe-area-inset-bottom));background:#f5f8fb}.mfc-chart-shell{width:100%;gap:10px}.mfc-chart-hero,.mfc-chart-board,.mfc-podium-card,.mfc-chart-community-callout{border-left:0;border-right:0;box-shadow:none}.mfc-chart-hero-copy{padding:30px 18px 26px}.mfc-chart-kicker{font-size:10px}.mfc-chart-kicker:before{width:26px}.mfc-chart-date{margin-top:15px;font-size:11px}.mfc-chart-hero h1{font-size:52px;letter-spacing:-3px;line-height:.9;margin-top:10px}.mfc-chart-intro{font-size:14px;line-height:1.72}.mfc-chart-hero-actions{margin-top:22px;display:grid;grid-template-columns:1fr auto}.mfc-primary-action,.mfc-secondary-action{min-height:46px;padding:0 14px;font-size:12px}.mfc-secondary-action span{display:none}.mfc-chart-leader{grid-template-columns:1fr;grid-template-rows:240px auto}.mfc-leader-art{min-height:240px}.mfc-leader-number{font-size:86px;right:16px;bottom:6px}.mfc-leader-info{padding:20px 18px 22px}.mfc-leader-info h2{font-size:25px}.mfc-leader-actions{gap:6px}.mfc-vote-action{margin-right:auto}.mfc-podium{gap:8px}.mfc-podium-card{grid-template-columns:62px 78px minmax(0,1fr);min-height:96px}.mfc-podium-rank{font-size:38px;letter-spacing:-3px}.mfc-podium-card img{width:78px;min-height:94px}.mfc-podium-copy{padding:13px 12px}.mfc-podium-copy h3{font-size:15px}.mfc-podium-copy p{font-size:11px}.mfc-podium-actions{grid-column:2/4;padding:8px 10px 10px;border-top:1px solid #e8edf3;justify-content:flex-end}.mfc-mini-play,.mfc-mini-like,.mfc-mini-vote{height:34px}.mfc-board-head{min-height:88px;padding:0 16px}.mfc-board-head h2{font-size:26px}.mfc-board-period{min-width:0;padding-right:12px}.mfc-board-period strong{font-size:11px}.mfc-chart-row{grid-template-columns:46px 56px minmax(0,1fr) 90px;min-height:76px}.mfc-row-rank{font-size:20px}.mfc-row-cover img{width:42px;height:42px}.mfc-row-song{padding:0 8px}.mfc-row-song strong{font-size:13px}.mfc-row-song span{font-size:10px}.mfc-row-actions{gap:4px;padding-left:7px}.mfc-row-like,.mfc-row-vote,.mfc-row-play{width:28px;min-width:28px;height:32px;padding:0}.mfc-row-like svg,.mfc-row-vote svg,.mfc-row-play svg{width:12px;height:12px}.mfc-chart-community-callout{min-height:160px;padding:26px 18px}.mfc-chart-community-callout h2{font-size:26px}.mfc-chart-community-callout p{font-size:12px;max-width:230px}.mfc-chart-community-callout button{height:44px;padding:0 13px}.mfc-chart-community-callout button span{display:none}.mfc-chart-modal{padding:0;align-items:end}.mfc-chart-sheet{width:100%;max-height:88dvh;border:0;border-radius:14px 14px 0 0;padding-bottom:env(safe-area-inset-bottom);transform:translateY(100%)}.mfc-chart-modal.is-open .mfc-chart-sheet{transform:translateY(0)}.mfc-sheet-head{min-height:82px;padding:0 18px}.mfc-sheet-head h2{font-size:22px}.mfc-sheet-close{width:38px;height:38px}.mfc-sheet-search{margin:14px 16px 0;height:52px}.mfc-sheet-note{margin:8px 16px 0}.mfc-suggest-results{padding:12px 16px 20px}.mfc-suggest-item{grid-template-columns:52px minmax(0,1fr) auto;min-height:72px}.mfc-suggest-item img{width:52px;height:52px}.mfc-suggest-item button{min-width:42px;width:42px;padding:0}.mfc-suggest-item button span:not(.mfc-suggest-add){display:none}.mfc-chart-toast{bottom:calc(78px + env(safe-area-inset-bottom))}
}

@media(prefers-reduced-motion:reduce){.mfc-chart-page *{scroll-behavior:auto!important;animation:none!important;transition:none!important}.mfc-chart-modal-backdrop{backdrop-filter:none;-webkit-backdrop-filter:none}}

body.mfc-modal-open{overflow:hidden}

/* ========================================================================== 
   CHARTS LIVE SCORE — refinement pass 2026-10-09
   ========================================================================== */
.mfc-chart-page .mfc-leader-score{position:relative;display:flex;align-items:baseline;gap:7px;width:max-content;margin-top:15px;padding-top:12px;border-top:1px solid rgba(255,255,255,.16);color:#fff}
.mfc-chart-page .mfc-leader-score small{color:#8fdff0;font-size:9px;font-weight:950;letter-spacing:.08em}
.mfc-chart-page .mfc-leader-score strong{font-size:24px;line-height:1;color:#fff;font-weight:1000;font-variant-numeric:tabular-nums}
.mfc-chart-page .mfc-leader-score>span:not(.mfc-score-pop){color:#b9c8d8;font-size:10px;font-weight:850}
.mfc-chart-page .mfc-podium-score{position:relative;display:flex;align-items:baseline;gap:4px;margin-top:9px;width:max-content;color:#0a2343}
.mfc-chart-page .mfc-podium-score strong{font-size:16px;line-height:1;color:#0a2343;font-weight:1000;font-variant-numeric:tabular-nums}
.mfc-chart-page .mfc-podium-score>span:not(.mfc-score-pop){color:#7d8b9c;font-size:9px;font-weight:850}

.mfc-chart-pulse{min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:30px;padding:0 28px;border:1px solid #d8e2ec;background:#fff;box-shadow:0 8px 28px rgba(10,34,64,.045)}
.mfc-pulse-title{display:flex;align-items:center;gap:13px;min-width:210px}.mfc-live-dot{width:9px;height:9px;border-radius:50%;background:#0dbb95;box-shadow:0 0 0 5px rgba(13,187,149,.11);animation:mfc-live-dot 1.7s ease-in-out infinite}.mfc-pulse-title small{display:block;color:#0d6efd;font-size:8px;font-weight:1000;letter-spacing:.16em}.mfc-pulse-title strong{display:block;margin-top:2px;color:#0a1d35;font-size:14px;font-weight:1000}
.mfc-pulse-factors{display:flex;align-items:center;gap:0;height:100%}.mfc-pulse-factors>span{min-height:46px;display:grid;grid-template-columns:18px auto;grid-template-rows:auto auto;align-content:center;column-gap:8px;min-width:150px;padding:0 22px;border-right:1px solid #e2e9f0;color:#1a3552}.mfc-pulse-factors>span:first-child{border-right:0}.mfc-pulse-factors svg{grid-row:1/3;width:15px;height:15px;align-self:center;color:#0d6efd}.mfc-pulse-factors b{color:#1a3552;font-size:11px;font-weight:950}.mfc-pulse-factors em{color:#7b899a;font-size:9px;font-style:normal;font-weight:850}

.mfc-chart-page .mfc-chart-row{grid-template-columns:82px 70px minmax(220px,1.35fr) 126px 170px 260px}
.mfc-chart-page .mfc-chart-row.is-top-three{background:linear-gradient(90deg,#fff 0,#fff 62%,#f8fbff 100%)}
.mfc-chart-page .mfc-chart-row.is-top-three:before{background:linear-gradient(180deg,#0d6efd,#12b9d6)}
.mfc-chart-page .mfc-row-rank{gap:1px}.mfc-chart-page .mfc-row-rank small{font-size:10px;color:#92a2b5;font-weight:1000;align-self:center;margin-top:-8px}.mfc-chart-page .mfc-row-rank b{font:inherit;color:inherit}
.mfc-chart-page .mfc-row-score{position:relative;display:flex;align-items:baseline;justify-content:flex-start;gap:4px;padding:0 12px;border-right:1px solid #edf1f5;border-left:1px solid #edf1f5;white-space:nowrap}
.mfc-chart-page .mfc-row-score small{display:block;margin-left:5px;color:#8592a3;font-size:9px;font-weight:900}.mfc-chart-page .mfc-row-score strong{color:#0b63d8;font-size:18px;line-height:1;font-weight:1000;font-variant-numeric:tabular-nums}.mfc-chart-page .mfc-row-score>span:not(.mfc-score-pop){color:#8492a3;font-size:9px;font-weight:850}
.mfc-chart-page .mfc-row-numbers{gap:14px}.mfc-chart-page .mfc-row-numbers span{min-width:42px}.mfc-chart-page .mfc-row-numbers svg{color:#71839a}.mfc-chart-page .mfc-row-numbers b{font-variant-numeric:tabular-nums;color:#304761}

.mfc-score-pop{position:absolute;z-index:8;left:50%;top:-13px;transform:translate(-50%,0);min-width:34px;padding:3px 6px;background:#071a33!important;color:#fff!important;border:1px solid rgba(255,255,255,.15);box-shadow:0 8px 22px rgba(6,23,46,.2);font-size:10px!important;line-height:1.2!important;font-weight:1000!important;text-align:center;pointer-events:none;animation:mfc-score-pop .86s cubic-bezier(.2,.8,.2,1) both}.mfc-score-pop.is-minus{background:#9d1732!important}
.mfc-chart-page [data-chart-item].is-rank-jump{z-index:2;animation:mfc-rank-jump .85s cubic-bezier(.2,.8,.2,1)}

/* Explicit contrast guards. Site-wide legacy styles must never turn text dark
   inside the navy chart surfaces. */
.mfc-chart-page .mfc-chart-leader,
.mfc-chart-page .mfc-chart-leader h2,
.mfc-chart-page .mfc-chart-leader h3,
.mfc-chart-page .mfc-chart-leader strong,
.mfc-chart-page .mfc-chart-leader button,
.mfc-chart-page .mfc-chart-community-callout,
.mfc-chart-page .mfc-chart-community-callout h2,
.mfc-chart-page .mfc-chart-community-callout strong{color:#fff!important}
.mfc-chart-page .mfc-chart-leader p,.mfc-chart-page .mfc-chart-community-callout p{color:#c3d0de!important}
.mfc-chart-page .mfc-chart-leader .mfc-icon-action{background:#fff!important;color:#07182f!important}
.mfc-chart-page .mfc-primary-action,.mfc-chart-page .mfc-mini-play,.mfc-chart-page .mfc-row-play,.mfc-chart-page .mfc-suggest-item button:not(.is-done):not(:disabled){color:#fff!important}
.mfc-chart-page .mfc-primary-action span,.mfc-chart-page .mfc-mini-play span,.mfc-chart-page .mfc-row-play span,.mfc-chart-page .mfc-suggest-item button:not(.is-done):not(:disabled) span{color:inherit!important}
.mfc-chart-page .mfc-vote-action{color:#fff!important}.mfc-chart-page .mfc-vote-action.is-active,.mfc-chart-page .mfc-vote-action:disabled{color:#b7f1e7!important}
.mfc-chart-page .mfc-chart-community-callout button{color:#07182f!important}
.mfc-chart-page .mfc-chart-community-callout button span{color:inherit!important}
.mfc-chart-page .mfc-chart-toast{color:#fff!important}

/* Actions react instantly; do not dim the control while the server confirms. */
.mfc-chart-page .is-working{opacity:1!important}.mfc-chart-page button.is-working{transform:translateY(0)!important;box-shadow:inset 0 0 0 999px rgba(13,110,253,.035)}

@keyframes mfc-live-dot{0%,100%{box-shadow:0 0 0 4px rgba(13,187,149,.10)}50%{box-shadow:0 0 0 8px rgba(13,187,149,.025)}}
@keyframes mfc-score-pop{0%{opacity:0;transform:translate(-50%,7px) scale(.85)}22%{opacity:1;transform:translate(-50%,-2px) scale(1)}100%{opacity:0;transform:translate(-50%,-18px) scale(.96)}}
@keyframes mfc-rank-jump{0%{transform:translateY(0)}35%{transform:translateY(-5px);box-shadow:0 14px 35px rgba(13,110,253,.13)}100%{transform:translateY(0)}}

@media(max-width:1180px){
 .mfc-chart-page .mfc-chart-row{grid-template-columns:72px 66px minmax(180px,1.2fr) 112px 150px 220px}.mfc-pulse-factors>span{min-width:132px;padding-inline:16px}
}
@media(max-width:900px){
 .mfc-chart-pulse{padding:15px 18px;align-items:flex-start;flex-direction:column;gap:13px}.mfc-pulse-factors{width:100%;overflow:auto;overscroll-behavior-inline:contain}.mfc-pulse-factors>span{min-width:138px;border-right:1px solid #e2e9f0}.mfc-pulse-factors>span:first-child{border-right:1px solid #e2e9f0}
 .mfc-chart-page .mfc-chart-row{grid-template-columns:58px 58px minmax(0,1fr) 132px;grid-template-rows:auto auto;min-height:88px}.mfc-chart-page .mfc-row-rank{grid-row:1/3}.mfc-chart-page .mfc-row-cover{grid-row:1/3}.mfc-chart-page .mfc-row-song{grid-column:3;grid-row:1;padding-top:12px;align-self:end}.mfc-chart-page .mfc-row-score{grid-column:3;grid-row:2;align-self:start;border:0;padding:4px 8px 10px}.mfc-chart-page .mfc-row-score small{margin-left:3px}.mfc-chart-page .mfc-row-score strong{font-size:14px}.mfc-chart-page .mfc-row-actions{grid-column:4;grid-row:1/3;align-self:stretch}.mfc-chart-page .mfc-row-numbers{display:none}
}
@media(max-width:600px){
 .mfc-chart-pulse{border-left:0;border-right:0;box-shadow:none}.mfc-pulse-title strong{font-size:13px}.mfc-pulse-factors{margin-inline:-4px;width:calc(100% + 8px)}.mfc-pulse-factors>span{min-width:120px;padding:0 12px}.mfc-pulse-factors b{font-size:10px}
 .mfc-chart-page .mfc-chart-row{grid-template-columns:46px 54px minmax(0,1fr) 96px;min-height:82px}.mfc-chart-page .mfc-row-song{padding:9px 7px 0}.mfc-chart-page .mfc-row-score{padding:2px 7px 9px}.mfc-chart-page .mfc-row-score small{font-size:8px}.mfc-chart-page .mfc-row-score strong{font-size:13px}.mfc-chart-page .mfc-row-actions{padding-left:6px}.mfc-chart-page .mfc-row-like,.mfc-chart-page .mfc-row-vote,.mfc-chart-page .mfc-row-play{width:28px;min-width:28px}.mfc-chart-page .mfc-row-vote span{display:none}
 .mfc-chart-page .mfc-leader-score{margin-top:12px}.mfc-chart-page .mfc-leader-score strong{font-size:21px}
}
.mfc-chart-page .mfc-chart-leader .mfc-leader-topline,.mfc-chart-page .mfc-chart-leader .mfc-leader-topline span{color:#b8c6d7!important}
.mfc-chart-page .mfc-chart-leader .mfc-like-action.is-active{color:#ff8aa0!important}

/* ========================================================================== 
   MOBILE CHART ACTIONS — premium compact controls 2026-10-09
   Keep the chart controls square and refined even when global site button
   rules define a large min-height/padding.
   ========================================================================== */
@media(max-width:600px){
  .mfc-chart-page .mfc-chart-row{
    grid-template-columns:46px 54px minmax(0,1fr) 124px;
  }
  .mfc-chart-page .mfc-row-actions{
    width:124px;
    min-width:124px;
    padding:0 7px 0 4px;
    gap:5px;
    justify-content:center;
    align-items:center;
    align-self:stretch;
  }
  .mfc-chart-page .mfc-row-like,
  .mfc-chart-page .mfc-row-vote,
  .mfc-chart-page .mfc-row-play{
    box-sizing:border-box!important;
    flex:0 0 36px!important;
    width:36px!important;
    min-width:36px!important;
    max-width:36px!important;
    height:36px!important;
    min-height:36px!important;
    max-height:36px!important;
    padding:0!important;
    margin:0!important;
    border-radius:var(--mfc-control-radius)!important;
    line-height:1!important;
    gap:0!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    -webkit-tap-highlight-color:transparent;
    touch-action:manipulation;
    box-shadow:0 3px 9px rgba(9,31,57,.045);
  }
  .mfc-chart-page .mfc-row-play{
    border-color:#0a203b!important;
    background:#081c35!important;
    color:#fff!important;
    box-shadow:0 5px 12px rgba(7,26,51,.16);
  }
  .mfc-chart-page .mfc-row-vote{
    border-color:#d6e2ed!important;
    background:#fbfdff!important;
    color:#173b5b!important;
  }
  .mfc-chart-page .mfc-row-like{
    border-color:#d9e4ee!important;
    background:#fff!important;
    color:#173b5b!important;
  }
  .mfc-chart-page .mfc-row-vote.is-active,
  .mfc-chart-page .mfc-row-vote:disabled{
    border-color:#c8ebe4!important;
    background:#f0fbf8!important;
    color:#43a998!important;
  }
  .mfc-chart-page .mfc-row-like.is-active{
    border-color:#ffc8d4!important;
    background:#fff4f7!important;
    color:#df3154!important;
  }
  .mfc-chart-page .mfc-row-like svg,
  .mfc-chart-page .mfc-row-vote svg,
  .mfc-chart-page .mfc-row-play svg{
    width:17px!important;
    height:17px!important;
    flex:none!important;
  }
  .mfc-chart-page .mfc-row-play svg{
    width:18px!important;
    height:18px!important;
  }
  .mfc-chart-page .mfc-row-like:active,
  .mfc-chart-page .mfc-row-vote:active,
  .mfc-chart-page .mfc-row-play:active{
    transform:scale(.93)!important;
  }
}

@media(max-width:380px){
  .mfc-chart-page .mfc-chart-row{
    grid-template-columns:42px 50px minmax(0,1fr) 116px;
  }
  .mfc-chart-page .mfc-row-actions{
    width:116px;
    min-width:116px;
    padding-inline:4px;
    gap:4px;
  }
  .mfc-chart-page .mfc-row-like,
  .mfc-chart-page .mfc-row-vote,
  .mfc-chart-page .mfc-row-play{
    flex-basis:34px!important;
    width:34px!important;
    min-width:34px!important;
    max-width:34px!important;
    height:34px!important;
    min-height:34px!important;
    max-height:34px!important;
    border-radius:var(--mfc-control-radius)!important;
  }
}


/* CHART ACTION SHAPE UNIFICATION — 2026-10-09
   One visual language for every play / like / vote control. */
.mfc-chart-page .mfc-icon-action,
.mfc-chart-page .mfc-like-action,
.mfc-chart-page .mfc-vote-action,
.mfc-chart-page .mfc-mini-play,
.mfc-chart-page .mfc-mini-like,
.mfc-chart-page .mfc-mini-vote,
.mfc-chart-page .mfc-row-play,
.mfc-chart-page .mfc-row-like,
.mfc-chart-page .mfc-row-vote{
  border-radius:var(--mfc-control-radius)!important;
}

@media(max-width:600px){
  /* Top cards and the full chart now use the exact same corner language. */
  .mfc-chart-page .mfc-mini-play,
  .mfc-chart-page .mfc-mini-like,
  .mfc-chart-page .mfc-mini-vote{
    min-height:36px!important;
    height:36px!important;
    max-height:36px!important;
    border-radius:var(--mfc-control-radius)!important;
  }
  .mfc-chart-page .mfc-mini-play{
    width:36px!important;
    min-width:36px!important;
    max-width:36px!important;
    padding:0!important;
  }
  .mfc-chart-page .mfc-row-play,
  .mfc-chart-page .mfc-row-like,
  .mfc-chart-page .mfc-row-vote{
    border-radius:var(--mfc-control-radius)!important;
  }
}

/* V3: keep the live #1 visually distinct from the latest locked official result. */
.mfc-last-official{position:relative;display:block;margin-top:15px;padding:13px 46px 13px 14px;border:1px solid #dbe6ef;background:#f8fbfd;color:var(--mfc-ink);text-decoration:none;transition:background .2s ease,border-color .2s ease}.mfc-last-official:hover{background:#f1f7fb;border-color:#cbdbe8}.mfc-last-official>span{display:block;color:#0d6efd;font-size:8px;font-weight:1000;letter-spacing:1px}.mfc-last-official>strong{display:block;margin-top:4px;font-size:13px}.mfc-last-official>small{display:block;margin-top:3px;color:#7b8fa2;font-size:9px}.mfc-last-official>svg{position:absolute;right:15px;top:50%;width:14px;height:14px;transform:translateY(-50%)}
@media(max-width:560px){.mfc-last-official{padding:12px 42px 12px 12px}.mfc-last-official>strong{font-size:12px}}