/* Menu compact, centré et fond global visible — 21/07/2026 */
:root{--mz-glass:rgba(10,10,10,.56);--mz-line:rgba(255,48,65,.18);--mz-#e30613:#ff3041}
html{background:#040404!important}
body{background:transparent!important;min-height:100vh!important}
.radio-studio-bg{position:fixed!important;inset:0!important;z-index:-10!important;display:block!important;opacity:1!important;visibility:visible!important}
body:before{content:"";position:fixed;inset:0;z-index:-9;pointer-events:none;background:linear-gradient(180deg,rgba(4,4,4,.28),rgba(4,4,4,.48))!important}
main,section,footer,.site-footer,.hero,.about-section,.emissions-section,.book-section,.contact-section,.mz-premium-daily,.mz-media-hub{background-color:transparent!important}
.mz-premium-daily,.mz-media-hub{background-image:none!important}

/* Barre réellement compacte et centrée */
.topbar{position:fixed!important;top:12px!important;left:50%!important;right:auto!important;transform:translateX(-50%)!important;width:min(1480px,calc(100% - 28px))!important;height:62px!important;min-height:62px!important;padding:6px 10px!important;margin:0!important;display:grid!important;grid-template-columns:132px minmax(0,1fr) 272px!important;align-items:center!important;gap:10px!important;border:1px solid var(--mz-line)!important;border-radius:18px!important;background:linear-gradient(135deg,rgba(10,10,10,.72),rgba(10,10,10,.48))!important;box-shadow:0 14px 42px rgba(0,0,0,.30),inset 0 1px rgba(255,255,255,.08)!important;backdrop-filter:blur(14px) saturate(135%)!important;-webkit-backdrop-filter:blur(14px) saturate(135%)!important;overflow:visible!important;animation:mzMenuEnter .72s cubic-bezier(.2,.8,.2,1) both!important;transition:height .28s ease,background .28s ease,box-shadow .28s ease,transform .28s ease!important}
.topbar:before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(105deg,transparent 15%,rgba(255,255,255,.12) 42%,transparent 67%);transform:translateX(-120%);animation:mzMenuShine 7s ease-in-out 1.1s infinite}
.topbar .logo{position:relative!important;inset:auto!important;width:124px!important;max-width:124px!important;height:44px!important;display:flex!important;align-items:center!important;justify-content:flex-start!important;margin:0!important;padding:0 4px!important}
.topbar .logo img{width:118px!important;height:auto!important;max-height:40px!important;object-fit:contain!important}
.topbar .main-nav{position:static!important;display:flex!important;align-items:center!important;justify-content:center!important;gap:clamp(7px,.72vw,13px)!important;min-width:0!important;width:100%!important;margin:0!important;padding:0!important;background:transparent!important;box-shadow:none!important;border:0!important;white-space:nowrap!important}
.topbar .main-nav>a{position:relative!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;min-height:32px!important;padding:0 2px!important;margin:0!important;border:0!important;background:transparent!important;color:rgba(240,249,255,.82)!important;font-size:clamp(9px,.66vw,11px)!important;font-weight:720!important;letter-spacing:.015em!important;text-decoration:none!important;transform:translateY(0);transition:color .22s ease,transform .22s ease!important}
.topbar .main-nav>a:after{content:"";position:absolute;left:50%;bottom:2px;width:0;height:2px;border-radius:99px;background:linear-gradient(90deg,#ff3041,#ff3041);box-shadow:0 0 12px rgba(255,48,65,.6);transform:translateX(-50%);transition:width .25s ease}
.topbar .main-nav>a:hover,.topbar .main-nav>a.active{color:#ffffff!important;transform:translateY(-1px)!important}
.topbar .main-nav>a:hover:after,.topbar .main-nav>a.active:after{width:78%}

/* Player réduit et transparent afin de laisser voir le fond */
.topbar .main-nav .menu-radio-player.radio-dock.compact-radio{grid-column:3!important;position:absolute!important;right:10px!important;top:6px!important;left:auto!important;bottom:auto!important;transform:none!important;width:262px!important;min-width:262px!important;height:50px!important;min-height:50px!important;margin:0!important;padding:5px 7px!important;display:grid!important;grid-template-columns:38px minmax(0,1fr) 34px 66px!important;gap:6px!important;border-radius:14px!important;border:1px solid rgba(255,255,255,.12)!important;background:rgba(10,10,10,.43)!important;box-shadow:inset 0 1px rgba(255,255,255,.06),0 8px 24px rgba(0,0,0,.18)!important;backdrop-filter:blur(8px)!important;overflow:hidden!important;animation:mzPlayerFloat 4.5s ease-in-out infinite!important}
.topbar .menu-radio-player .radio-premium-cover-wrap,.topbar .menu-radio-player .radio-premium-cover{width:38px!important;height:38px!important;min-width:38px!important;min-height:38px!important;max-width:38px!important;max-height:38px!important;border-radius:10px!important}
.topbar .menu-radio-player .radio-premium-station{font-size:6px!important}.topbar .menu-radio-player .radio-premium-title{font-size:9px!important}.topbar .menu-radio-player .radio-premium-artist{font-size:7px!important}
.topbar .menu-radio-player .radio-premium-play{width:32px!important;height:32px!important;min-width:32px!important;font-size:10px!important}
.topbar .menu-radio-player .radio-premium-volume{height:28px!important;padding:0 5px!important;gap:3px!important;background:rgba(255,255,255,.045)!important}
.topbar .menu-radio-player .radio-volume-mute{width:16px!important;min-width:16px!important;font-size:10px!important}
.topbar .menu-radio-player .radio-premium-volume input{width:34px!important;height:3px!important}
.topbar.is-scrolled{height:56px!important;min-height:56px!important;background:rgba(10,10,10,.78)!important;box-shadow:0 12px 34px rgba(0,0,0,.38)!important}
.topbar.is-scrolled .main-nav .menu-radio-player{top:3px!important}

@keyframes mzMenuEnter{from{opacity:0;transform:translate(-50%,-18px) scale(.98)}to{opacity:1;transform:translate(-50%,0) scale(1)}}
@keyframes mzMenuShine{0%,70%{transform:translateX(-120%)}86%,100%{transform:translateX(120%)}}
@keyframes mzPlayerFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-1.5px)}}

@media(max-width:1180px) and (min-width:901px){
 .topbar{grid-template-columns:104px minmax(0,1fr) 224px!important}
 .topbar .logo{width:100px!important}.topbar .logo img{width:96px!important}
 .topbar .main-nav{gap:6px!important}.topbar .main-nav>a{font-size:8.5px!important}
 .topbar .main-nav .menu-radio-player.radio-dock.compact-radio{width:216px!important;min-width:216px!important;grid-template-columns:34px minmax(0,1fr) 30px!important}
 .topbar .menu-radio-player .radio-premium-volume{display:none!important}
 .topbar .menu-radio-player .radio-premium-cover-wrap,.topbar .menu-radio-player .radio-premium-cover{width:34px!important;height:34px!important;min-width:34px!important;min-height:34px!important}
}
@media(max-width:900px){
 .topbar{top:8px!important;width:calc(100% - 16px)!important;height:58px!important;min-height:58px!important;grid-template-columns:1fr auto!important;padding:7px 10px!important;overflow:visible!important}
 .topbar .logo{width:118px!important}.topbar .logo img{width:112px!important}
 .topbar .menu-btn{display:flex!important;position:relative!important;inset:auto!important;margin:0!important}
 .topbar .main-nav{display:none!important;position:absolute!important;top:66px!important;left:0!important;right:0!important;width:100%!important;padding:14px!important;border:1px solid var(--mz-line)!important;border-radius:18px!important;background:rgba(10,10,10,.90)!important;backdrop-filter:blur(18px)!important;box-shadow:0 22px 50px rgba(0,0,0,.40)!important;white-space:normal!important;animation:mzMobileOpen .3s ease both!important}
 .topbar .main-nav.is-open,.topbar .main-nav.open{display:flex!important;flex-direction:column!important;align-items:stretch!important}
 .topbar .main-nav>a{font-size:13px!important;min-height:38px!important}
 .topbar .main-nav .menu-radio-player.radio-dock.compact-radio{position:relative!important;inset:auto!important;width:100%!important;min-width:0!important;height:52px!important;min-height:52px!important;margin-top:8px!important;grid-template-columns:40px minmax(0,1fr) 36px 72px!important}
}
@keyframes mzMobileOpen{from{opacity:0;transform:translateY(-10px) scale(.98)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.topbar,.topbar:before,.topbar .menu-radio-player{animation:none!important}}
