@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;600;800&family=Orbitron:wght@600;800&display=swap');

/* MMX_CRITICAL_HIDE_ADMINCHAT_MODALS_V1
   A White/AdminChat modálok HTML-je a nagy index elején van, a teljes dizájn CSS-e viszont
   lejjebb töltődik be. Watch.php-ből visszalépésnél a böngésző ezt egy pillanatra kirajzolhatta
   nyersen. Ezek a minimál szabályok már a head elején elrejtik, az .open állapot továbbra is nyitja. */
.mmxExtraAdminModal,
#mmxExtraAdminModal,
#mmxDbChatMembersModal,
#mmxRegRequestsModal{
  display:none;
}
.mmxExtraAdminModal.open,
#mmxExtraAdminModal.open,
#mmxDbChatMembersModal.open,
#mmxRegRequestsModal.open{
  display:flex;
}
:root{
  --bg0:#06080d;
  --bg1:#0a0f18;
  --panel: rgba(255,255,255,.055);
  --panel2: rgba(255,255,255,.035);
  --stroke: rgba(0,234,255,.22);
  --stroke2: rgba(255,255,255,.10);
  --cyan:#00eaff;
  --cyan2:#00b8ff;
  --vio:#c86bff;
  --red:#ff3d3d;
  --txt:#eaf3ff;
  --muted: rgba(230,245,255,.72);
  --muted2: rgba(230,245,255,.52);
  --shadow: 0 18px 50px rgba(0,0,0,.55);
  --shadow2: 0 0 22px rgba(0,234,255,.14);
  --r12:12px;
  --r16:16px;
  --r20:20px;
  --r24:24px;
}

*{box-sizing:border-box;}
html,body{height:100%;}
body{
  margin:0;
  font-family: Inter, Arial, sans-serif;
  color:var(--txt);
  overflow-x:hidden;
  background:
    radial-gradient(1200px 800px at 18% -10%, rgba(0,234,255,.20), transparent 55%),
    radial-gradient(900px 700px at 85% 0%, rgba(200,107,255,.14), transparent 60%),
    radial-gradient(1200px 900px at 50% 110%, rgba(0,184,255,.12), transparent 55%),
    linear-gradient(180deg, var(--bg0), var(--bg1));
}

/* steel grid + finom zaj */
body::before{
  content:"";
  position:fixed; inset:0;
  pointer-events:none;
  background:
    repeating-linear-gradient(90deg, rgba(255,255,255,.028) 0 1px, transparent 1px 26px),
    repeating-linear-gradient(0deg, rgba(0,234,255,.020) 0 1px, transparent 1px 26px);
  mix-blend-mode: overlay;
  opacity:.55;
}
body::after{
  content:"";
  position:fixed; inset:-20%;
  pointer-events:none;
  background: radial-gradient(closest-side, transparent 60%, rgba(0,0,0,.55) 100%);
  opacity:.65;
}

/* MMX_NO_LIVE_TOP_FILTER_FIX_V1
   Ha nincs live, ne maradjon a globális vignette/szűrő a felső részen.
   A live nézetnél marad az eredeti neon/CRT hangulat, de archív/főoldali nézeten tiszta a kép. */
body.mmx-live-idle::before,
body.mmx-live-idle::after{
  content:none!important;
  display:none!important;
}

/* INTRO (mobile smooth) — blur -> sharp + CRT off dot */
.mmx-intro{
  position:fixed; inset:0; z-index:99999;
  display:flex; align-items:center; justify-content:center;
  background:
    radial-gradient(1100px 700px at 50% 42%, rgba(0,234,255,.18), transparent 60%),
    radial-gradient(900px 650px at 45% 55%, rgba(200,107,255,.22), transparent 65%),
    radial-gradient(1200px 900px at 60% 110%, rgba(0,184,255,.12), transparent 55%),
    #000;
  overflow:hidden;
  opacity:1;
  will-change: opacity, transform, filter;
}
.mmx-intro::before{
  /* finom köd-réteg mozgással (olcsó) */
  content:"";
  position:absolute; inset:-25%;
  background:
    radial-gradient(closest-side at 30% 30%, rgba(200,107,255,.18), transparent 62%),
    radial-gradient(closest-side at 70% 55%, rgba(0,184,255,.16), transparent 62%),
    radial-gradient(closest-side at 55% 80%, rgba(200,107,255,.14), transparent 65%);
  filter: blur(18px);
  opacity:.9;
  animation:mmxFog 3.6s ease-in-out forwards;
  transform: translate3d(0,0,0);
}
@keyframes mmxFog{
  0%{transform:scale(1.06) translate3d(-1.2%, -1.0%, 0); opacity:.95;}
  55%{transform:scale(1.10) translate3d(1.2%, 1.0%, 0); opacity:.88;}
  100%{transform:scale(1.14) translate3d(2.4%, 2.0%, 0); opacity:.82;}
}
.mmx-intro .mmx-center{
  position:relative;
  text-align:center;
  padding:24px 26px;
  transform: translate3d(0,0,0);
  will-change: transform, filter, opacity;
}

/* a "kikapcs pont" – csak a legvégén villan fel */
.mmx-center::after{
  content:"";
  position:absolute;
  left:50%; top:50%;
  width:10px; height:10px;
  border-radius:50%;
  background: rgba(255,255,255,.98);
  transform: translate(-50%,-50%) scale(0);
  opacity:0;
  filter: blur(.2px);
  box-shadow:
    0 0 18px rgba(255,255,255,.95),
    0 0 48px rgba(120,220,255,.75),
    0 0 90px rgba(200,110,255,.55);
  pointer-events:none;
  will-change: transform, opacity, filter;
}

@keyframes mmxTvShutdown {
  0%   { transform: translate3d(0,0,0) scale(1); opacity:1; filter: brightness(1) saturate(1); }
  60%  { transform: translate3d(0,0,0) scaleX(1.03) scaleY(.04); opacity:1; filter: brightness(2.0) saturate(1.25); }
  85%  { transform: translate3d(0,0,0) scaleX(.02) scaleY(.02); opacity:1; filter: brightness(2.8) saturate(1.35); }
  95%  { transform: translate3d(0,0,0) scale(.001); opacity:1; filter: brightness(3.2) saturate(1.45); }
  100% { transform: translate3d(0,0,0) scale(.001); opacity:0; filter: brightness(3.2) saturate(1.45); }
}

@keyframes mmxDotPop {
  0%   { opacity:0; transform: translate(-50%,-50%) scale(0); filter: blur(.2px); }
  60%  { opacity:1; transform: translate(-50%,-50%) scale(1); filter: blur(.8px); }
  100% { opacity:0; transform: translate(-50%,-50%) scale(.2); filter: blur(1.2px); }
}

/* amikor lekapcsoljuk: a LOGÓ maga megy csík -> pont */
.mmx-intro.mmx-off .mmx-center{
  animation: mmxTvShutdown 560ms ease-in forwards;
}
.mmx-intro.mmx-off .mmx-center::after{
  animation: mmxDotPop 520ms ease-out forwards;
  animation-delay: 180ms;
}
.mmx-intro.mmx-off .mmx-title,
.mmx-intro.mmx-off .mmx-sub{
  animation: mmxTextFade 260ms ease-out forwards;
}
@keyframes mmxTextFade{
  to{ opacity:0; transform: translate3d(0,0,0) scale(.98); }
}
.mmx-intro .mmx-title{
  font-family:'Orbitron',sans-serif;
  font-weight:900;
  font-size:clamp(34px,8vw,86px);
  letter-spacing:1.2px;
  color:#fff;
  text-shadow: 0 0 26px rgba(0,234,255,.80), 0 0 120px rgba(200,107,255,.18);
  opacity:0;
  transform: translate3d(0,10px,0) scale(.98);
  animation:mmxIn .55s ease .10s forwards;
}
.mmx-intro .mmx-sub{
  margin-top:10px;
  font-weight:700;
  font-size:clamp(14px,3.3vw,18px);
  color: rgba(230,245,255,.85);
  letter-spacing:.18em;
  text-transform: uppercase;
  opacity:0;
  transform: translate3d(0,10px,0);
  animation:mmxIn .55s ease .22s forwards;
}
@keyframes mmxIn{
  to{opacity:1; transform: translate3d(0,0,0) scale(1);}
}
.mmx-intro .mmx-flare{
  position:absolute; left:50%; top:50%;
  width:min(110vw, 1200px);
  height:2px;
  transform: translate(-50%,-50%);
  background: linear-gradient(90deg, transparent, rgba(0,234,255,.95), rgba(200,107,255,.85), rgba(0,184,255,.95), transparent);
  box-shadow: 0 0 18px rgba(0,234,255,.55);
  opacity:0;
  animation:mmxFlare 3.6s ease forwards;
}
@keyframes mmxFlare{
  0%{opacity:0; transform:translate(-50%,-50%) scaleX(.65);}
  18%{opacity:.95; transform:translate(-50%,-50%) scaleX(1.0);}
  42%{opacity:.55;}
  70%{opacity:.18;}
  100%{opacity:0; transform:translate(-50%,-50%) scaleX(.85);}
}

/* a weboldal "élesedik" az intro végére */
body.mmx-blur #siteRoot{
  filter: blur(14px) saturate(1.05) contrast(1.04);
  transform: translate3d(0,0,0);
}
body.mmx-blur.mmx-unblur #siteRoot{
  transition: filter 950ms ease;
  filter: blur(0px) saturate(1) contrast(1);
}

/* CRT kikapcs: fényes pont + összecsukás */
.mmx-intro.mmx-off{  animation:mmxFade 780ms ease forwards;
}
@keyframes mmxFade{to{opacity:0; visibility:hidden;}}

.mmx-intro .mmx-crt{
  position:absolute; left:50%; top:50%;
  width:2px; height:2px;
  transform: translate(-50%,-50%) scale(0.2);
  border-radius:999px;
  background: rgba(255,255,255,0);
  box-shadow: 0 0 0 rgba(255,255,255,0);
  pointer-events:none;
}
.mmx-intro.mmx-off .mmx-crt{  animation:mmxCRT 780ms ease forwards;
}
@keyframes mmxCRT{
  0%{
    width:72vw; height:2px;
    transform: translate(-50%,-50%) scaleX(1) scaleY(1);
    background: rgba(255,255,255,.95);
    box-shadow: 0 0 18px rgba(255,255,255,.75), 0 0 42px rgba(0,234,255,.35);
    opacity:1;
  }
  55%{
    width:10px; height:2px;
    transform: translate(-50%,-50%) scaleX(1) scaleY(1);
    opacity:1;
  }
  100%{
    width:2px; height:2px;
    transform: translate(-50%,-50%) scale(0.25);
    background: rgba(255,255,255,.95);
    box-shadow: 0 0 24px rgba(255,255,255,.85), 0 0 60px rgba(200,107,255,.20);
    opacity:0;
  }
}

/* ha watch-ból jövünk vissza: nincs intro, nincs blur */
html.mmx-skip-intro .mmx-intro{display:none !important;}
html.mmx-skip-intro body #siteRoot{filter:none !important;}
/* MMX_ADMINCHAT_APP_SKIP_MAIN_INTRO_V2: adminchat appból ne villanjon be a DJ MusicMixx / Non-stop intro */
html.mmx-adminchat-app .mmx-intro,
html.mmx-adminchat-boot .mmx-intro{display:none !important;}
html.mmx-adminchat-app body #siteRoot,
html.mmx-adminchat-boot body #siteRoot{filter:none !important;}

/* LAYOUT */
.container{
  max-width:1280px;
  margin:18px auto 28px;
  padding:0 14px 22px;
  position:relative;
}

/* DJ LOGO */
.section-logo{
  text-align:center;
  margin:28px 0 14px;
  position:relative;
}
.section-logo::before,
.section-logo::after{
  content:"";
  position:absolute; top:50%;
  width:min(32%, 320px);
  height:1px;
  background: linear-gradient(90deg, transparent, rgba(0,234,255,.35), transparent);
  opacity:.9;
}
.section-logo::before{left:0;}
.section-logo::after{right:0;}
.section-logo span{
  font-family:'Orbitron',sans-serif;
  font-weight:800;
  font-size:clamp(30px,7vw,76px);
  color:#fff;
  letter-spacing:1px;
  text-shadow:
    0 0 18px rgba(0,234,255,.55),
    0 0 50px rgba(0,184,255,.18);
}


/* Headline */
h2{
  margin:18px 0 12px;
  text-align:center;
  font-family:'Orbitron',sans-serif;
  letter-spacing:.6px;
  font-weight:800;
  font-size:clamp(18px, 2.2vw, 26px);
  color: rgba(235,250,255,.92);
  text-shadow: 0 0 16px rgba(0,234,255,.12);
}

/* TOP ICONS + VIP */
#topIcons{
  position:fixed;
  top:14px;
  right:16px;
  z-index:1000;
  display:flex;
  flex-direction:row;
  align-items:center;
  justify-content:center;
  gap:12px;
  padding:0;
  background:transparent;
  border:0;
  border-radius:0;
  box-shadow:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  pointer-events:auto;
}
#topIcons .ico, #topIcons .ico *, #topIcons a, #topIcons a *{ pointer-events:auto; }

/* MMX_WHITE_ADMIN_MENU_V2 - White admin ikonok hamburger menüben */
#topIcons.mmx-white-admin-icons{
  width:auto;
  padding:0;
  background:transparent;
  border:0;
  box-shadow:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  pointer-events:auto;
}
.mmx-admin-menu{position:relative;pointer-events:auto;}
.mmx-admin-menu-btn{
  width:42px;
  height:42px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:14px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(7,10,18,.92);
  color:#f8fafc;
  cursor:pointer;
  box-shadow:0 14px 34px rgba(0,0,0,.38);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}
.mmx-admin-menu-btn:hover{background:rgba(16,20,31,.96)}
.mmx-admin-menu-grid{width:18px;height:18px;display:grid;grid-template-columns:repeat(2,1fr);gap:3px}
.mmx-admin-menu-grid i{display:block;border-radius:5px;background:linear-gradient(180deg,#fff,#cbd5e1);opacity:.98}
.mmx-admin-menu-panel{
  position:absolute;
  right:0;
  top:48px;
  width:min(308px, calc(100vw - 16px));
  display:none;
  flex-direction:column;
  gap:0;
  padding:6px 0 8px;
  border-radius:22px;
  background:rgba(0,0,0,.97);
  border:1px solid rgba(255,255,255,.10);
  box-shadow:0 26px 70px rgba(0,0,0,.58);
  overflow:hidden;
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
}
.mmx-admin-menu.open .mmx-admin-menu-panel{display:flex;}
.mmx-admin-menu-header{padding:6px 14px 8px;display:flex;align-items:center;justify-content:space-between;gap:8px}
.mmx-admin-menu-title{font-size:19px;line-height:1.05;font-weight:1000;color:#fff;letter-spacing:-.02em}
.mmx-admin-menu-section-title{padding:7px 14px 4px;color:rgba(255,255,255,.52);font-size:12px;font-weight:900;letter-spacing:.01em}
.mmx-admin-menu-divider{height:1px;background:rgba(255,255,255,.14);margin:3px 0}
.mmx-admin-menu-panel .ico,
.mmx-admin-menu-panel .mmx-admin-menu-item{
  width:100%;
  min-height:48px;
  box-sizing:border-box;
  display:flex !important;
  align-items:center;
  justify-content:flex-start !important;
  gap:9px;
  padding:8px 14px;
  border-radius:0;
  background:transparent;
  border:0;
  color:#fff;
  text-decoration:none;
  font-size:14px !important;
  font-weight:1000;
  position:relative;
  text-align:left;
  box-shadow:none;
}
.mmx-admin-menu-panel .ico:hover,
.mmx-admin-menu-panel .mmx-admin-menu-item:hover{transform:none !important;background:rgba(255,255,255,.06)}
.mmx-admin-menu-iconbox{width:34px;height:34px;border-radius:12px;background:rgba(255,255,255,.09);display:inline-flex;align-items:center;justify-content:center;flex:0 0 34px;color:#f3f4f6;font-size:17px}
.mmx-admin-menu-copy{min-width:0;display:flex;flex-direction:column;gap:2px;flex:1}
.mmx-admin-menu-label{display:block;line-height:1.05;color:#fff}
.mmx-admin-menu-meta{display:block;font-size:11px;font-weight:900;color:rgba(255,255,255,.50);line-height:1.05}
.mmx-admin-menu-tail{margin-left:auto;display:inline-flex;align-items:center;justify-content:flex-end;min-width:30px;color:rgba(255,255,255,.88);font-size:12px;font-weight:1000}
.mmx-admin-menu-tail.is-state{color:#7dd3fc}
.mmx-admin-menu-tail.mmx-download-master-state{color:#86efac}
.mmx-admin-menu-tail.mmx-livechat-master-state{color:#86efac}
.mmx-admin-menu-tail.mmx-liveoverlay-master-state{color:#86efac}
.mmx-admin-menu-tail.mmx-maintenance-menu-state{color:#86efac}
.mmx-admin-menu-item.is-off .mmx-livechat-master-state{color:#fca5a5}
.mmx-admin-menu-item.is-off .mmx-liveoverlay-master-state{color:#fca5a5}
.mmx-admin-menu-item.is-off .mmx-maintenance-menu-state{color:#fca5a5}
.mmx-admin-menu-panel .miniDot{position:static;width:10px;height:10px;border-radius:999px;display:inline-block;box-shadow:0 0 0 2px rgba(255,255,255,.08)}
.mmx-admin-menu-panel #reportBadge{position:static;display:inline-flex;align-items:center;justify-content:center;min-width:22px;height:22px;padding:0 7px;border-radius:999px;background:#ef4444;color:#fff;font-size:11px;font-weight:1000;box-shadow:none}
.mmx-admin-menu-panel #whiteOnlineNow{margin-left:auto}
.mmx-admin-menu-panel .mmx-push-diag-state{margin-left:auto;font-size:12px;font-weight:1000;color:#9fffe9;opacity:.92}
.mmx-admin-menu-panel .mmx-maintenance-toggle{position:relative;right:auto;top:auto;z-index:auto;width:100%;box-sizing:border-box;justify-content:flex-start;border-radius:0;padding:8px 14px;background:transparent;box-shadow:none}
.mmx-admin-menu-panel .mmx-maintenance-toggle:hover{background:rgba(255,255,255,.06)}
.mmx-admin-menu-panel .mmx-maintenance-label{margin-left:2px;display:flex;flex-direction:column;gap:4px}
.mmx-admin-menu-panel .mmx-maintenance-label small{display:block;color:rgba(255,255,255,.50);font-size:12px;font-weight:900;line-height:1.1}
#mmxAdminChatDiagModal{
  position:fixed; inset:0; z-index:100006; display:none; align-items:center; justify-content:center;
  background:rgba(0,0,0,.62); padding:16px; box-sizing:border-box;
}
#mmxAdminChatDiagModal.open{display:flex;}
#mmxAdminChatDiagBox{
  width:min(760px, calc(100vw - 24px)); max-height:min(82vh, 760px); overflow:auto;
  border-radius:22px; background:rgba(6,8,13,.97); border:1px solid rgba(0,234,255,.26);
  box-shadow:0 24px 70px rgba(0,0,0,.62),0 0 28px rgba(0,234,255,.10); color:#eaffff;
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
}
.mmxPushDiagHead{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;border-bottom:1px solid rgba(255,255,255,.10);}
.mmxPushDiagTitle{font-weight:1000;font-size:17px;text-shadow:0 0 12px rgba(0,234,255,.22);}
.mmxPushDiagClose{border:0;border-radius:12px;background:rgba(255,255,255,.10);color:#fff;font-weight:1000;padding:8px 11px;cursor:pointer;}
.mmxPushDiagBody{padding:14px 16px 16px;}
.mmxPushDiagTop{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:12px;}
.mmxPushDiagCheck,.mmxPushDiagAdmin{border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.055);border-radius:15px;padding:10px;}
.mmxPushDiagCheck b,.mmxPushDiagAdmin b{display:block;font-size:12px;color:rgba(235,250,255,.72);margin-bottom:4px;}
.mmxPushDiagOk{color:#79ff9b;font-weight:1000;}.mmxPushDiagBad{color:#ff8c8c;font-weight:1000;}
.mmxPushDiagAdmins{display:flex;flex-direction:column;gap:10px;}
.mmxPushDiagAdminHead{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px;}
.mmxPushDiagAdminName{font-size:15px;font-weight:1000;}
.mmxPushDiagAdminState{font-size:12px;font-weight:1000;border-radius:999px;padding:4px 8px;background:rgba(255,255,255,.08);}
.mmxPushDiagAdminState.ok{color:#79ff9b;}.mmxPushDiagAdminState.warn{color:#ffd36a;}.mmxPushDiagAdminState.bad{color:#ff8c8c;}
.mmxPushDiagDevices{display:flex;flex-direction:column;gap:6px;margin-top:8px;}
.mmxPushDiagDevice{font-size:12px;line-height:1.35;color:rgba(235,250,255,.80);border-top:1px solid rgba(255,255,255,.08);padding-top:7px;word-break:break-word;}
.mmxPushDiagActions{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end;}
.mmxPushDiagTest,.mmxPushDiagImport{border:0;border-radius:11px;background:linear-gradient(180deg,rgba(0,234,255,.24),rgba(0,138,255,.16));color:#eaffff;font-weight:1000;padding:8px 10px;cursor:pointer;}
.mmxPushDiagImport{background:linear-gradient(180deg,rgba(121,255,155,.22),rgba(0,190,120,.14));}
.mmxPushDiagTest:disabled,.mmxPushDiagImport:disabled{opacity:.55;cursor:wait;}
#mmxPushDiagMsg{font-size:13px;color:rgba(235,250,255,.78);margin:8px 0 12px;min-height:18px;}
@media (max-width:640px){
  #mmxAdminChatDiagModal{padding:8px;align-items:flex-start;padding-top:calc(12px + env(safe-area-inset-top));}
  #mmxAdminChatDiagBox{width:calc(100vw - 16px);max-height:calc(100vh - 24px);border-radius:18px;}
  .mmxPushDiagTop{grid-template-columns:1fr 1fr;}
  .mmxPushDiagHead{padding:12px;}.mmxPushDiagBody{padding:12px;}
}


#topIcons .ico{
  position:relative;
  cursor:pointer;
  font-size:18px;
  color: rgba(200,250,255,.92);
  user-select:none;
  display:flex; align-items:center; justify-content:center;
  transition: transform .18s ease, filter .18s ease, opacity .18s ease;
}

#topIcons .miniDot{
  position:absolute;
  right:-2px;
  top:-2px;
  width:8px;
  height:8px;
  border-radius:50%;
  background: #ffd24a;
  box-shadow: 0 0 10px rgba(255,210,74,.55);
}

#topIcons .ico:hover{
  transform: translateY(-1px);
  filter: drop-shadow(0 0 18px rgba(255,255,255,.22)) drop-shadow(0 0 34px rgba(0,183,255,.18));
}
#topIcons .ico.link{
  font-size:22px;
  color: rgba(0,234,255,.82);
  text-decoration:none;
}
#topIcons .ico.link:hover{ color: rgba(0,234,255,1); }

#reportBadge{
  position:absolute;
  right:-10px;
  top:-8px;
  min-width:18px;
  height:18px;
  padding:0 6px;
  border-radius:999px;
  background: linear-gradient(180deg, #ff4b4b, #ff1f1f);
  color:#fff;
  font-size:12px;
  display:none;
  align-items:center;
  justify-content:center;
  border:1px solid rgba(255,255,255,.25);
  box-shadow: 0 0 14px rgba(255,50,50,.25);
}



#whiteOnlineNow{
  min-width:30px; height:24px; padding:0 8px; border-radius:999px;
  display:flex; align-items:center; justify-content:center;
  font-size:14px; font-weight:900; color:#eaffff;
  background:rgba(0,0,0,.34); border:1px solid rgba(0,234,255,.26);
  box-shadow:0 0 14px rgba(0,234,255,.16);
  text-shadow:0 0 10px rgba(0,234,255,.35);
  pointer-events:auto; user-select:none;
}

#whiteOnlineGraphBtn{cursor:pointer;font-family:inherit;text-align:left;}
#whiteOnlineGraphBtn:hover #whiteOnlineNow{background:rgba(0,234,255,.14);}
#mmxOnlineGraphModal{
  position:fixed; inset:0; z-index:100002; display:none; align-items:center; justify-content:center;
  padding:18px; background:rgba(0,0,0,.72); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
}
#mmxOnlineGraphModal.open{display:flex;}
.mmxOnlineGraphBox{
  width:min(1060px, calc(100vw - 24px)); max-height:min(760px, calc(100vh - 24px)); overflow:hidden;
  border-radius:24px; background:linear-gradient(180deg, rgba(10,14,24,.98), rgba(4,6,10,.98));
  border:1px solid rgba(0,234,255,.24); box-shadow:0 30px 90px rgba(0,0,0,.68), 0 0 34px rgba(0,234,255,.12);
  color:#eaffff;
}
.mmxOnlineGraphHead{display:flex;align-items:center;gap:12px;padding:14px 16px;border-bottom:1px solid rgba(255,255,255,.08);}
.mmxOnlineGraphTitle{font-size:16px;font-weight:1000;letter-spacing:.2px;}
.mmxOnlineGraphSub{font-size:12px;color:rgba(226,247,255,.68);font-weight:800;margin-top:2px;}
.mmxOnlineGraphClose{margin-left:auto;width:38px;height:38px;border-radius:14px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.07);color:#fff;font-size:24px;font-weight:900;cursor:pointer;}
.mmxOnlineGraphBody{position:relative;padding:14px 14px 16px;}
.mmxOnlineGraphControls{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 10px;flex-wrap:wrap;}
.mmxOnlineGraphTabs{display:flex;gap:7px;padding:4px;border-radius:16px;background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.08);}
.mmxOnlineGraphTabs button,.mmxOnlineGraphPager button{border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.06);color:#eaffff;border-radius:12px;padding:8px 12px;font-weight:1000;cursor:pointer;font-family:inherit;}
.mmxOnlineGraphTabs button.active{background:rgba(0,234,255,.18);border-color:rgba(0,234,255,.35);box-shadow:0 0 18px rgba(0,234,255,.10);}
.mmxOnlineGraphPager{display:flex;align-items:center;gap:8px;margin-left:auto;}
.mmxOnlineGraphPager button{min-width:38px;font-size:18px;line-height:1;}
.mmxOnlineGraphPager strong{min-width:210px;text-align:center;font-size:12px;font-weight:1000;color:rgba(234,255,255,.88);}
#mmxOnlineGraphCanvas{width:100%;height:430px;display:block;border-radius:18px;background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.08);}
.mmxOnlineGraphLegend{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin:10px 2px 0;font-size:12px;font-weight:900;color:rgba(234,255,255,.82);}
.mmxOnlineGraphLegend span{display:inline-flex;align-items:center;gap:6px;}
.mmxOnlineGraphLegend i{width:18px;height:3px;border-radius:99px;display:inline-block;background:currentColor;}
.mmxOnlineGraphTip{position:absolute;left:24px;top:24px;min-width:230px;display:none;pointer-events:none;padding:10px 12px;border-radius:14px;background:rgba(0,0,0,.82);border:1px solid rgba(0,234,255,.22);box-shadow:0 14px 40px rgba(0,0,0,.44);font-size:12px;font-weight:900;line-height:1.45;}
.mmxOnlineGraphEmpty{display:none;padding:22px;text-align:center;color:rgba(234,255,255,.72);font-weight:900;}
@media(max-width:720px){
  /* MMX_ONLINE_GRAPH_MOBILE_FULLSCREEN_V1: web marad, mobilon a stat panel kitölti a képernyőt. */
  #mmxOnlineGraphModal{padding:0;align-items:stretch;justify-content:stretch;background:rgba(0,0,0,.88)}
  .mmxOnlineGraphBox{width:100vw;max-width:none;height:100vh;height:100dvh;max-height:none;border-radius:0;border-left:0;border-right:0;display:flex;flex-direction:column;overflow:hidden}
  .mmxOnlineGraphHead{padding:calc(10px + env(safe-area-inset-top)) 12px 10px;flex:0 0 auto}
  .mmxOnlineGraphTitle{font-size:15px}.mmxOnlineGraphSub{font-size:11px;line-height:1.25}
  .mmxOnlineGraphClose{width:40px;height:40px;border-radius:13px;flex:0 0 auto}
  .mmxOnlineGraphBody{padding:10px 8px calc(10px + env(safe-area-inset-bottom));flex:1 1 auto;min-height:0;display:flex;flex-direction:column}
  .mmxOnlineGraphControls{align-items:stretch;gap:8px;margin-bottom:8px;flex:0 0 auto}
  .mmxOnlineGraphPager{width:100%;justify-content:space-between;margin-left:0}
  .mmxOnlineGraphPager strong{min-width:0;flex:1;font-size:11px}
  .mmxOnlineGraphTabs{width:100%;justify-content:space-between;gap:5px}
  .mmxOnlineGraphTabs button{flex:1;padding:8px 8px}
  #mmxOnlineGraphCanvas{height:auto;flex:1 1 auto;min-height:0;border-radius:12px}
  .mmxOnlineGraphLegend{margin:8px 2px 0;font-size:11px;gap:8px;max-height:46px;overflow:auto;flex:0 0 auto}
  .mmxOnlineGraphTip{min-width:190px;max-width:calc(100vw - 22px);font-size:11px;line-height:1.35;border-radius:12px}
  /* MMX_MOBILE_HIDE_SMILE_BUTTON_V2: NINCS általános CSS-rejtés, mert az túl könnyen elkapja a chat indító gombot is. */
}

.mmx-download-master-toggle{cursor:pointer;font-family:inherit;text-align:left;}
.mmx-download-master-toggle .mmx-download-master-state{
  margin-left:auto;
  min-width:32px;
  height:24px;
  padding:0 8px;
  border-radius:999px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(44,255,107,.16);
  border:1px solid rgba(44,255,107,.34);
  color:#dffff0;
  font-weight:900;
}
.mmx-download-master-toggle.is-off .mmx-download-master-state{
  background:rgba(255,60,60,.16);
  border-color:rgba(255,60,60,.36);
  color:#ffdede;
}

#topVip a{ width:32px; height:32px; display:flex; align-items:center; justify-content:center; text-decoration:none; }
#topVip img{
  width:28px; height:28px; object-fit:contain;
  border-radius:10px;
  opacity:.95;
  filter: drop-shadow(0 0 8px rgba(0,234,255,.22));
  transition: transform .18s ease, filter .18s ease;
}
#topVip a:hover img{
  transform: translateY(-1px) scale(1.03);
  filter: drop-shadow(0 0 14px rgba(0,234,255,.45));
}

/* REPORT PANEL */
#reportPanel{
  position:fixed;
  right:16px;
  top:62px;
  z-index:1000;
  width:380px;
  max-width:calc(100vw - 32px);
  background:
    radial-gradient(120% 100% at 10% 0%, rgba(0,234,255,.10), transparent 55%),
    linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.03));
  border:1px solid rgba(0,234,255,.18);
  border-radius:18px;
  box-shadow: var(--shadow), var(--shadow2);
  display:none;
  overflow:hidden;
  backdrop-filter: blur(12px);
}
#reportPanel .head{
  display:flex; align-items:center; justify-content:space-between;
  padding:12px 14px;
  border-bottom:1px solid rgba(0,234,255,.18);
}
#reportPanel .head .t{font-weight:800;color:rgba(235,250,255,.92);}
#reportPanel .head .x{
  cursor:pointer;color:#ff8c8c;font-weight:900;
  padding:2px 10px;border-radius:12px;
  border:1px solid rgba(255,120,120,.25);
}
#reportPanel .head .x:hover{box-shadow:0 0 14px rgba(255,120,120,.18);}
#reportPanel .list{max-height:380px;overflow:auto;padding:10px;}

.notifSection{
  margin:6px 0 10px;
  padding:8px 10px;
  border:1px dashed rgba(0,234,255,.22);
  border-radius:14px;
  color: rgba(190,250,255,.92);
  font-size:12px;
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  background: rgba(0,0,0,.18);
}
.notifSection .right{opacity:.95;font-weight:900;color:#fff;}

.repItem{
  border:1px solid rgba(0,234,255,.16);
  background: linear-gradient(180deg, rgba(0,0,0,.38), rgba(0,0,0,.22));
  border-radius:16px;
  padding:10px 12px;
  margin-bottom:10px;
  cursor:pointer;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.repItem:hover{
  transform: translateY(-2px);
  box-shadow: 0 0 22px rgba(0,234,255,.14);
  border-color: rgba(0,234,255,.28);
}
.repItem.comItem{border-color: rgba(80,255,160,.22);}
.repItem.comItem:hover{box-shadow:0 0 20px rgba(80,255,160,.12);}

.repTop{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:6px;}
.repMix{
  color: rgba(0,234,255,.92);
  font-size:13px;
  opacity:.95;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:280px;
}
.repCount{
  color:#fff;
  background: linear-gradient(180deg, #ff4b4b, #ff2424);
  border-radius:999px;
  padding:2px 9px;
  font-size:12px;
  border:1px solid rgba(255,255,255,.18);
  box-shadow: 0 0 14px rgba(255,50,50,.18);
}
.repSnippet{color: rgba(210,255,255,.88);font-size:12px;opacity:.92;word-break:break-word;}
.repMeta{margin-top:6px;font-size:11px;color: rgba(170,210,235,.55);display:flex;justify-content:space-between;gap:10px;}
.repBtns{display:flex;gap:8px;justify-content:flex-end;margin-top:10px;}
.repBtn{
  border:1px solid rgba(0,234,255,.20);
  background: rgba(0,0,0,.18);
  color: rgba(200,250,255,.92);
  padding:6px 10px;
  border-radius:14px;
  cursor:pointer;
  font-size:12px;
  transition: transform .18s ease, box-shadow .18s ease;
}
.repBtn:hover{transform:translateY(-1px);box-shadow:0 0 14px rgba(0,234,255,.12);}
.repBtn.close{
  border:1px solid rgba(255,80,80,.28);
  color:#ffb1b1;
}
.repBtn.close:hover{box-shadow:0 0 14px rgba(255,80,80,.14);}

/* LIVE VIDEO */
.video-box{
  position:relative;
  overflow:hidden;
  border-radius:var(--r24);
  width:100%;
  aspect-ratio:16/9;
  display:flex; align-items:center; justify-content:center;
  background:
    radial-gradient(120% 120% at 0% 0%, rgba(0,234,255,.12), transparent 55%),
    linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02));
  box-shadow: var(--shadow);
}
.video-box::before{
  content:"";
  position:absolute; inset:0;
  padding:2px;
  border-radius:var(--r24);
  background: linear-gradient(135deg, rgba(0,234,255,.85), rgba(200,107,255,.35), rgba(0,184,255,.65));
  -webkit-mask:
    linear-gradient(#000 0 0) content-box,
    linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
          mask-composite: exclude;
  opacity:.85;
  pointer-events:none;
}
.video-box video{
  width:100%;
  height:100%;
  object-fit:contain;
  border-radius:calc(var(--r24) - 2px);
  background:#000;
}
.video-box:hover{ box-shadow: 0 0 28px rgba(0,234,255,.16), var(--shadow); }

/* MMX_LIVE_VIDEO_CHAT_WIDTH_V1
   A live ablak a chat szélességéhez igazodik (max 860px),
   a 16:9 arány marad, ezért nem nyúlik és nem vágódik le. */
#liveBox{
  width:100%;
  max-width:1032px; /* weben +20% nagyobb videóablak (860px -> 1032px) */
  margin:42px auto 16px;
  aspect-ratio:16/9;
  overflow:visible;
}
#liveBox video{
  width:100%;
  height:100%;
  object-fit:contain;
}

@media (max-width:760px){
  #liveBox{
    width:100%;
    max-width:100%;
    margin:38px 0 14px;
    overflow:visible;
  }
  .live-badge{top:-46px;}
}

.overlay{
  position:absolute;
  inset:12px;
  display:block;
  z-index:12;
  pointer-events:none;
}
.viewer-badge,.live-badge{
  position:absolute;
  display:flex; align-items:center; gap:7px;
  font-weight:800;
  font-size:13px;
  border-radius:999px;
  padding:7px 12px;
  color:#fff;
  background: rgba(0,0,0,.35);
  border:1px solid rgba(255,255,255,.10);
  backdrop-filter: blur(10px);
  box-shadow: 0 0 14px rgba(0,234,255,.10);
}
.viewer-badge{right:0;bottom:0;}
.live-badge{
  left:50%;
  top:-50px;
  right:auto;
  transform:translateX(-50%);
  z-index:20;
}
.viewer-badge svg{width:18px;height:18px;fill:var(--cyan);}
.live-badge{
  font-family:'Orbitron',sans-serif;
  letter-spacing:1.1px;
  font-weight:900;
  color:#ffd6d6;
  border:1px solid rgba(255,52,52,.72);
  background: linear-gradient(180deg, rgba(190,0,0,.74), rgba(110,0,0,.62));
  box-shadow:
    0 0 0 1px rgba(255,90,90,.16) inset,
    0 0 22px rgba(255,22,22,.34),
    0 0 42px rgba(255,0,0,.18);
  animation:mmxLiveBadgePulse 4.2s infinite ease-in-out;
}
@keyframes mmxLiveBadgePulse{
  0%,100%{transform:translateX(-50%) scale(1); opacity:.84; box-shadow:0 0 0 1px rgba(255,90,90,.16) inset, 0 0 18px rgba(255,22,22,.28), 0 0 34px rgba(255,0,0,.14);}
  50%{transform:translateX(-50%) scale(1.10); opacity:1; box-shadow:0 0 0 1px rgba(255,120,120,.24) inset, 0 0 34px rgba(255,18,18,.48), 0 0 62px rgba(255,0,0,.26);}
}

/* === MMX_VIEWER_SMILE_BURST_FX_V6: közös 50/100 smile robbanás videó-ölés nélkül ===
   Nincs canvas, nincs filter/conic-gradient, nincs többszáz részecske.
   50-nél like robbanás 5 mp, 100-nál szív-robbanás 10 mp; kb. 50% vizuális fedéssel, hogy a videó nézhető maradjon. */
.mmx-viewer-fx-layer{
  position:fixed;
  inset:0;
  z-index:2147483000;
  pointer-events:none;
  overflow:hidden;
  opacity:0;
  visibility:hidden;
  contain:layout style paint;
}
.mmx-viewer-fx-layer.is-active{opacity:1;visibility:visible;}
.mmx-smile-burst{
  position:absolute;
  left:var(--x,50%);
  top:var(--y,44%);
  width:1em;
  height:1em;
  line-height:1;
  font-size:var(--fs,42px);
  opacity:0;
  transform:translate3d(-50%,-50%,0) scale(.25) rotate(var(--r0,0deg));
  animation:mmxSmileWallPop var(--dur,1180ms) ease-out forwards;
  will-change:transform, opacity;
  text-shadow:none;
}
.mmx-smile-burst::before{content:var(--ico,"👍");}
.mmx-smile-burst.is-heart::before{content:var(--ico,"💖");}
.mmx-smile-burst.is-soft{opacity:.46;}
@keyframes mmxSmileWallPop{
  0%{opacity:0;transform:translate3d(-50%,-50%,0) scale(.22) rotate(var(--r0,0deg));}
  12%{opacity:.50;}
  58%{opacity:.48;}
  100%{opacity:0;transform:translate3d(calc(-50% + var(--dx,0px)),calc(-50% + var(--dy,-18px)),0) scale(var(--sc,1.18)) rotate(var(--r1,8deg));}
}
@media (max-width:720px){
  .mmx-smile-burst{font-size:var(--fsm,32px);}
}
@media (prefers-reduced-motion: reduce){
  .mmx-viewer-fx-layer{display:none!important;}
}
/* 100 néző repedés effekt eltávolítva, végleg. */

/* === REACTIONS: FACEBOOK-SZERŰ LIKE / SZÍV / ÖLELÉS — LASSÚ, OLDALRA SODRÓDÓ, TÁVOLODÓ ÚSZÁS === */
.reactions-layer{
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:9;
  overflow:hidden;
  contain:layout style paint;
  perspective:900px;
  transform-style:preserve-3d;
}
.reaction-float{
  position:absolute;
  bottom:2px;
  left:0;
  width:var(--icon-size, 40px);
  height:var(--icon-size, 40px);
  opacity:0;
  will-change:transform, opacity;
  animation:mmxReactionFloatDrift var(--dur, 4200ms) linear forwards;
  transform:translate3d(0,0,0) scale(.92);
  transform-origin:center bottom;
  filter:drop-shadow(0 8px 14px rgba(0,0,0,.22));
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
}
.reaction-float .reaction-sprite,
.react-btn .reaction-sprite{
  display:block;
  width:100%;
  height:100%;
  background-repeat:no-repeat;
  background-position:center center;
  background-size:contain;
}
.reaction-float .reaction-sprite{
  will-change:transform, filter;
  animation:
    mmxReactionSpriteDrift calc(var(--dur, 4200ms) * .44) ease-in-out infinite alternate,
    mmxReactionBreath 1180ms ease-in-out infinite;
  transform-origin:center center;
}
.reaction-float.like{ filter:drop-shadow(0 8px 14px rgba(24,119,242,.22)); }
.reaction-float.heart{ filter:drop-shadow(0 8px 14px rgba(229,57,90,.20)); }
.reaction-float.wow, .reaction-float.hug{ filter:drop-shadow(0 8px 14px rgba(245,145,40,.22)); }
@keyframes mmxReactionFloatDrift{
  0%{
    opacity:0;
    transform:translate3d(0, 12px, 0) scale(.94);
  }
  8%{
    opacity:.80;
    transform:translate3d(calc(var(--drift, 0px) * .03 + var(--sway, 0px) * -.18), calc(var(--rise, 340px) * -.05), 0) scale(.90);
  }
  24%{
    opacity:.80;
    transform:translate3d(calc(var(--drift, 0px) * .20 + var(--sway, 0px) * -.85), calc(var(--rise, 340px) * -.24), 0) scale(.78);
  }
  46%{
    opacity:.78;
    transform:translate3d(calc(var(--drift, 0px) * .46 + var(--sway, 0px) * .62), calc(var(--rise, 340px) * -.48), 0) scale(.64);
  }
  68%{
    opacity:.66;
    transform:translate3d(calc(var(--drift, 0px) * .72 + var(--sway, 0px) * -1.10), calc(var(--rise, 340px) * -.70), 0) scale(.50);
  }
  84%{
    opacity:.28;
    transform:translate3d(calc(var(--drift, 0px) * .90 + var(--sway, 0px) * .75), calc(var(--rise, 340px) * -.86), 0) scale(.42);
  }
  100%{
    opacity:0;
    transform:translate3d(calc(var(--drift, 0px) + var(--sway, 0px) * -.18), calc(var(--rise, 340px) * -1), 0) scale(.34);
  }
}
@keyframes mmxReactionSpriteDrift{
  0%{ transform:translate3d(calc(var(--sway, 0px) * -.32), 0, 0) rotate(calc(var(--rot, 0deg) * -.55)) scale(1); }
  50%{ transform:translate3d(calc(var(--sway, 0px) * .10), -1px, 0) rotate(calc(var(--rot, 0deg) * .12)) scale(1.02); }
  100%{ transform:translate3d(calc(var(--sway, 0px) * .38), 0, 0) rotate(calc(var(--rot, 0deg) * .48)) scale(1); }
}
@keyframes mmxReactionBreath{
  0%,100%{ filter:brightness(1) saturate(1); }
  50%{ filter:brightness(1.04) saturate(1.04); }
}

/* === LIVE ACTIONS SOR (MEGOSZTÁS + LIKE + SZÍV + ÖLELÉS EGY SORBAN) === */
.live-actions{
  max-width:980px;
  margin:14px auto 10px;
  display:flex;
  gap:12px;
  justify-content:center;
  align-items:center;
  flex-wrap:nowrap;
}

/* REACTION GOMBOK (a share mellett) — nincs plusz bubi, maga az ikon a kör */
.react-btn{
  width:58px;
  height:58px;
  min-width:58px;
  min-height:58px;
  border:0;
  border-radius:50%;
  background:transparent;
  box-shadow:none;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0;
  transition: transform .16s ease, filter .16s ease;
  user-select:none;
  -webkit-tap-highlight-color: transparent;
}
.react-btn:hover{ transform: translateY(-2px) scale(1.06); }
.react-btn:active{ transform: translateY(0) scale(.94); }
.react-btn .reaction-sprite{
  width:56px;
  height:56px;
  opacity:.80;
  filter:drop-shadow(0 10px 18px rgba(0,0,0,.24));
}
.react-btn.like:hover{ filter: drop-shadow(0 0 12px rgba(24,119,242,.28)); }
.react-btn.heart:hover{ filter: drop-shadow(0 0 12px rgba(229,57,90,.26)); }
.react-btn.wow:hover, .react-btn.hug:hover{ filter: drop-shadow(0 0 12px rgba(243,156,18,.28)); }

/* SHARE BTN (felülírja az inline stílust) */
#shareBtn{
  background: linear-gradient(180deg, #2b87ff, #1667d9) !important;
  border:1px solid rgba(255,255,255,.18) !important;
  border-radius:18px !important;
  box-shadow: 0 12px 26px rgba(24,119,242,.22) !important;
  padding:12px 18px !important;
  display:inline-flex !important;
  align-items:center !important;
  gap:10px !important;
  transition: transform .18s ease, box-shadow .18s ease, filter .18s ease;
  white-space:nowrap;
  height:44px;
}
#shareBtn:hover{
  transform: translateY(-1px);
  box-shadow: 0 14px 30px rgba(24,119,242,.28) !important;
  filter: drop-shadow(0 0 10px rgba(24,119,242,.20));
}

/* IFRAME */
iframe{
  box-shadow: 0 16px 42px rgba(0,0,0,.50), 0 0 18px rgba(0,234,255,.08);
}

/* NEON FUTÓCSÍK (opcionális) */
#neon-wrap{
  width:100%;
  overflow:hidden;
  background:
    radial-gradient(120% 120% at 10% 0%, rgba(0,234,255,.10), transparent 62%),
    linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02));
  border:1px solid rgba(0,234,255,.16);
  border-radius:18px;
  max-width:980px;
  margin:12px auto 18px;
  box-shadow: 0 18px 44px rgba(0,0,0,.45), 0 0 22px rgba(0,234,255,.10);
  position:relative;
  backdrop-filter: blur(10px);
}
#neon-wrap::before{
  content:"";
  position:absolute; inset:0;
  pointer-events:none;
  background: linear-gradient(90deg, transparent, rgba(0,234,255,.14), transparent);
  opacity:.55;
}
#neon-text{
  display:inline-block;
  padding-left:100%;
  white-space:nowrap;
  font-size:18px;
  line-height:52px;
  color: rgba(210,255,255,.95);
  text-shadow: 0 0 12px rgba(0,234,255,.22);
  animation: neonScroll 18s linear infinite;
  font-family:'Orbitron',sans-serif;
  font-weight:800;
  letter-spacing:.6px;
}
@keyframes neonScroll{
  from { transform:translateX(0); }
  to   { transform:translateX(-100%); }
}

/* RADIO MINI (2026 deck glass player) */
.radio-mini-wrap{
  margin:18px auto 24px;
  max-width:760px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:0;
  padding:0 10px;
  box-sizing:border-box;
}
.radio-mini-social{display:none !important;}
.radio-mini{
  position:relative;
  margin:0;
  width:min(640px,100%);
  min-height:104px;
  display:grid;
  grid-template-columns:82px minmax(0,1fr);
  align-items:center;
  gap:14px;
  padding:13px 15px;
  border-radius:26px;
  overflow:hidden;
  background:
    radial-gradient(circle at 12% 0%, rgba(0,234,255,.18), transparent 34%),
    radial-gradient(circle at 92% 100%, rgba(200,107,255,.14), transparent 36%),
    linear-gradient(145deg, rgba(9,14,26,.96), rgba(3,6,13,.96));
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 18px 52px rgba(0,0,0,.48), inset 0 1px 0 rgba(255,255,255,.10);
  backdrop-filter:blur(14px);
}
.radio-mini:before{
  content:"";
  position:absolute;
  left:0;right:0;top:0;
  height:3px;
  background:linear-gradient(90deg, rgba(0,234,255,.70), rgba(200,107,255,.55), rgba(255,255,255,.30));
  opacity:.85;
}
.radio-mini:after{content:none !important;}
.radio-mini img{
  position:relative;
  z-index:1;
  width:82px;
  height:82px;
  border-radius:22px;
  object-fit:cover;
  border:1px solid rgba(255,255,255,.18);
  box-shadow:0 14px 30px rgba(0,0,0,.38), 0 0 24px rgba(0,234,255,.10);
}
.radio-mini-text{position:relative;z-index:1;min-width:0;padding-right:0;}
.rm-title{
  font-family:'Orbitron',sans-serif;
  font-weight:900;
  font-size:14px;
  color:rgba(255,255,255,.94);
  letter-spacing:.06em;
  text-transform:uppercase;
  margin:0 0 7px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.rm-meta-line{
  position:relative;
  display:block;
  min-height:20px;
  margin:1px 0;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}
.rm-label{display:none !important;}
.rm-now{
  position:relative;
  min-width:0;
  overflow:hidden;
  white-space:nowrap;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  font-size:15px;
  line-height:1.22;
  font-weight:900;
  color:#050505;
}
.rm-song{
  color:#111;
  font-size:13px;
  font-weight:750;
}
.rm-now span{
  display:inline-block;
  white-space:nowrap;
  will-change:transform;
  max-width:none;
}
.rm-now.marquee span{animation:rm-marquee var(--marquee-duration,18s) linear infinite;}
@keyframes rm-marquee{from{transform:translateX(0)}to{transform:translateX(var(--marquee-distance))}}
/* MMX_FIX_NO_TEXT_FRAMES_V1: előadó/cím sorokon nincs külön keret, háttér vagy címke */
.radio-mini .rm-meta-line,
.radio-mini .rm-now,
.radio-mini .rm-artist,
.radio-mini .rm-song{
  border:0 !important;
  outline:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}

.rm-controls{
  display:flex;
  align-items:center;
  gap:10px;
  margin-top:9px;
}
#rmPlay{
  min-width:86px;
  background:linear-gradient(135deg, rgba(0,234,255,.94), rgba(255,255,255,.92));
  color:#061018;
  border:none;
  padding:9px 14px;
  border-radius:999px;
  font-weight:1000;
  cursor:pointer;
  transition:transform .18s ease, filter .18s ease, box-shadow .18s ease;
  box-shadow:0 12px 26px rgba(0,0,0,.30), 0 0 18px rgba(0,234,255,.13);
}
#rmPlay:hover{transform:translateY(-1px) scale(1.02);filter:brightness(1.04);box-shadow:0 16px 34px rgba(0,0,0,.34), 0 0 24px rgba(0,234,255,.17);}
#rmVol{
  width:100%;
  min-width:90px;
  height:5px;
  accent-color:rgba(0,234,255,.95);
}


/* MMX_NO_LIVE_RADIO_PLAYER_LIGHT_FIX_V1
   Live nélkül ne maradjon sötét/neon filter a rádió playeren.
   A futó szöveg fekete marad, a player háttere világos, áttetsző üveg legyen. */
body.mmx-live-idle .radio-mini{
  background:
    radial-gradient(circle at 12% 0%, rgba(0,234,255,.16), transparent 34%),
    radial-gradient(circle at 92% 100%, rgba(200,107,255,.10), transparent 36%),
    linear-gradient(145deg, rgba(255,255,255,.92), rgba(255,255,255,.74)) !important;
  border-color:rgba(0,0,0,.10) !important;
  box-shadow:0 14px 38px rgba(0,0,0,.16), inset 0 1px 0 rgba(255,255,255,.76) !important;
  color:#050505 !important;
  backdrop-filter:blur(8px) saturate(1.02) !important;
  -webkit-backdrop-filter:blur(8px) saturate(1.02) !important;
}
body.mmx-live-idle .radio-mini:before{
  background:linear-gradient(90deg, rgba(0,183,255,.34), rgba(200,107,255,.22), rgba(0,0,0,.08)) !important;
  opacity:.55 !important;
}
body.mmx-live-idle .radio-mini img{
  border-color:rgba(0,0,0,.12) !important;
  box-shadow:0 10px 24px rgba(0,0,0,.20) !important;
}
body.mmx-live-idle .radio-mini .rm-title,
body.mmx-live-idle .radio-mini .rm-now,
body.mmx-live-idle .radio-mini .rm-artist,
body.mmx-live-idle .radio-mini .rm-song,
body.mmx-live-idle .radio-mini .rm-now span{
  color:#050505 !important;
  text-shadow:none !important;
}
body.mmx-live-idle .radio-mini .rm-song{color:#111 !important;}
body.mmx-live-idle #rmPlay{
  background:linear-gradient(135deg, rgba(255,255,255,.98), rgba(0,234,255,.26)) !important;
  color:#061018 !important;
  box-shadow:0 10px 22px rgba(0,0,0,.18) !important;
}
body.mmx-live-idle #rmVol{accent-color:#111 !important;}


/* ARCHIVE GRID */
.grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  gap:18px;
  align-items:start;
  margin-top:14px;
  overflow:visible;
}
.post{
  position:relative;
  z-index:1;
  border-radius:22px;
  overflow:visible;
  border:1px solid rgba(0,234,255,.14);
  background:
    radial-gradient(120% 120% at 10% 0%, rgba(0,234,255,.09), transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02));
  box-shadow: 0 18px 46px rgba(0,0,0,.42);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
  backdrop-filter: blur(10px);
}
.post:hover{
  transform: translateY(-3px);
  border-color: rgba(0,234,255,.26);
  box-shadow: 0 22px 60px rgba(0,0,0,.52), 0 0 24px rgba(0,234,255,.12);
}
.post.mmx-download-pop-open{
  z-index:9999;
}
.video-thumb{
  display:block;
  position:relative;
  aspect-ratio: 16/9;
  overflow:hidden;
  background:#000;
}
.video-thumb img,
.video-thumb .hover-preview-video{
  width:100%;
  height:100%;
  object-fit:cover;
  transform: scale(1.01);
  transition: transform .28s ease, filter .28s ease, opacity .18s ease;
  filter: saturate(1.05) contrast(1.05);
}
.video-thumb img{ display:block; }
.video-thumb .hover-preview-video{
  position:absolute;
  inset:0;
  opacity:0;
  background:#000;
  pointer-events:none;
}
.video-thumb.preview-active .hover-preview-video{ opacity:1; }
.video-thumb.preview-active img{ opacity:0; }
.post:hover .video-thumb img,
.post:hover .video-thumb .hover-preview-video{transform: scale(1.06); filter: saturate(1.15) contrast(1.10);}

.video-new-badge{
  position:absolute;
  left:16px;
  bottom:16px;
  z-index:4;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:96px;
  min-height:34px;
  padding:7px 12px;
  border-radius:999px;
  font-family:'Orbitron',sans-serif;
  font-weight:800;
  font-size:11px;
  letter-spacing:.45px;
  text-transform:uppercase;
  color:rgba(3,19,26,.62);
  background:linear-gradient(180deg, rgba(228,255,248,.52), rgba(192,255,244,.34));
  border:1px solid rgba(255,255,255,.28);
  box-shadow:0 6px 14px rgba(0,0,0,.14), 0 0 10px rgba(190,255,245,.08);
  backdrop-filter: blur(4px);
  pointer-events:none;
  user-select:none;
  animation:mmxNewPulse 3.2s ease-in-out infinite;
}
.video-new-badge.is-hidden{ display:none !important; }
@keyframes mmxNewPulse{
  0%,100%{ transform:scale(1); box-shadow:0 6px 14px rgba(0,0,0,.14), 0 0 10px rgba(190,255,245,.06); }
  50%{ transform:scale(1.03); box-shadow:0 7px 18px rgba(0,0,0,.18), 0 0 14px rgba(190,255,245,.12); }
}

.title{
  display:block;
  text-align:center;
  color: rgba(240,252,255,.95);
  font-weight:900;
  margin:10px 10px 6px;
  text-decoration:none;
  letter-spacing:.2px;
  line-height:1.2;
}
.title:hover{color:#fff; text-shadow:0 0 16px rgba(0,234,255,.12);}
.meta{
  display:flex;
  align-items:center;
  justify-content:center;
  flex-wrap:wrap;
  gap:4px 7px;
  text-align:center;
  color: rgba(200,230,245,.62);
  font-size:12px;
  margin:0 12px 10px;
  line-height:1.35;
}
.meta-part{display:inline-flex;align-items:center;white-space:nowrap;}
.meta-dot{opacity:.65;}
.meta-comments{
  display:inline-flex;
  align-items:center;
  gap:4px;
  white-space:nowrap;
  color:rgba(200,230,245,.62);
  font-weight:600;
}
.meta-comments svg{
  width:15px;
  height:15px;
  stroke:currentColor;
  fill:none;
  stroke-width:1.75;
  stroke-linecap:round;
  stroke-linejoin:round;
  filter:none;
}
.btn-container{text-align:center;margin:10px 0 16px;}
.btn-download{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding:10px 14px;
  border-radius:999px;
  text-decoration:none;
  font-weight:900;
  letter-spacing:.3px;
  color: rgba(210,255,255,.92);
  background: rgba(0,0,0,.22);
  border:1px solid rgba(0,234,255,.18);
  box-shadow: 0 12px 26px rgba(0,0,0,.35);
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.btn-download:hover{
  transform: translateY(-1px);
  background: rgba(0,234,255,.08);
  box-shadow: 0 14px 32px rgba(0,0,0,.45), 0 0 18px rgba(0,234,255,.12);
}
.btn-container{position:relative;display:flex;justify-content:center;align-items:center;}
.indexDownloadWrap{z-index:120;}
.btn-download.is-locked{
  color:#ffe9a6;
  border-color:rgba(255,224,130,.34);
  cursor:pointer;
}
button.btn-download{font-family:inherit;border-style:solid;}
.indexDownloadGateBubble{
  position:absolute;
  top:calc(100% + 9px);
  left:50%;
  transform:translateX(-50%);
  display:none;
  width:min(330px, calc(100vw - 28px));
  box-sizing:border-box;
  padding:13px;
  border-radius:16px;
  border:1px solid rgba(126,232,255,.20);
  background:rgba(8,14,18,.97);
  color:#cfeff4;
  box-shadow:0 14px 32px rgba(0,0,0,.42);
  z-index:10000;
  font-size:13px;
  line-height:1.35;
  text-align:left;
}
.indexDownloadGateBubble.show{display:block;}
.indexDownloadGateBubble b{color:#fff;}
.indexDownloadGateBubble .small{display:block;color:#9fc5cc;font-size:12px;margin-top:4px;}
.indexDownloadGateBubble .gateLinks{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px;}
.indexDownloadGateBubble .gateLinks a,
.indexDownloadGateBubble .gateLinks button{
  appearance:none;
  border:1px solid rgba(0,234,255,.22);
  background:rgba(0,234,255,.08);
  color:#dff;
  border-radius:999px;
  padding:8px 10px;
  text-decoration:none;
  font-weight:900;
  cursor:pointer;
  font-size:12px;
}
.indexDownloadGateBubble .pwaInstallHelp{display:none;color:#ffe9a6;font-weight:800;}

/* FOOTER */
.footer-emboss-wrap{
  max-width:1280px;
  margin:28px auto 18px;
  padding:0 14px;
}
.footer-emboss{
  position:relative;
  border-radius:18px;
  padding:14px 14px;
  text-align:center;
  background: linear-gradient(180deg, rgba(255,255,255,0.06), rgba(255,255,255,0.02) 35%, rgba(0,0,0,0.22) 100%);
  border:1px solid rgba(0,234,255,0.12);
  box-shadow: 0 0 18px rgba(0,234,255,0.10), inset 0 2px 2px rgba(255,255,255,0.08), inset 0 -10px 18px rgba(0,0,0,0.55), inset 0 0 0 1px rgba(255,255,255,0.04);
  backdrop-filter: blur(10px);
}
.footer-emboss:before{
  content:"";
  position:absolute;
  inset:8px;
  border-radius:16px;
  background: linear-gradient(180deg, rgba(255,255,255,0.09), rgba(255,255,255,0.03) 45%, rgba(0,0,0,0.35) 100%);
  box-shadow: inset 0 2px 6px rgba(0,0,0,0.65), inset 0 -2px 6px rgba(255,255,255,0.05);
  opacity:0.85;
  pointer-events:none;
}
.footer-emboss .footer-text{
  position:relative;
  z-index:1;
  font-family:'Orbitron',sans-serif;
  font-weight:800;
  letter-spacing:0.6px;
  font-size:12px;
  color: rgba(220, 235, 240, 0.65);
  text-shadow: 0 1px 0 rgba(255,255,255,0.12), 0 -1px 0 rgba(0,0,0,0.65), 0 0 10px rgba(0,234,255,0.10);
}
.footer-emboss .footer-text b{
  color: rgba(230, 250, 255, 0.80);
  text-shadow: 0 1px 0 rgba(255,255,255,0.14), 0 -1px 0 rgba(0,0,0,0.70), 0 0 14px rgba(0,234,255,0.16);
}

/* LOGIN BAR + FORM */
.loginbar{margin:38px 0 22px;text-align:center;font-size:12px;}
.loginbar.guest{opacity:.55;}
.loginbar.logged{opacity:1;}
.loginbar form{
  display:inline-flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:center;
  justify-content:center;
  padding:12px 12px;
  border-radius:18px;
  background: rgba(0,0,0,.18);
  border:1px solid rgba(0,234,255,.14);
  box-shadow: 0 12px 28px rgba(0,0,0,.35);
  backdrop-filter: blur(10px);
}
.loginbar input[type="text"],
.loginbar input[type="password"]{
  width: 160px;
  max-width: 42vw;
  padding:10px 12px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.06);
  color: rgba(240,252,255,.95);
  outline:none;
}
.loginbar input::placeholder{color: rgba(220,235,245,.45);}
.loginbar input:focus{
  border-color: rgba(0,234,255,.35);
  box-shadow: 0 0 0 3px rgba(0,234,255,.10);
}
.loginbar button{
  padding:10px 14px;
  border-radius:999px;
  border:1px solid rgba(0,234,255,.20);
  background: rgba(0,234,255,.10);
  color: rgba(230,250,255,.95);
  font-weight:900;
  cursor:pointer;
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.loginbar button:hover{
  transform: translateY(-1px);
  background: rgba(0,234,255,.16);
  box-shadow: 0 0 18px rgba(0,234,255,.12);
}

.loginbar .vip-name{
  color: var(--vio);
  font-weight:900;
  text-shadow:0 0 12px rgba(200,107,255,.25);
}
.loginbar .admin-name{
  color:#ff9a9a;
  font-weight:900;
  text-shadow:0 0 12px rgba(255,120,120,.18);
}
.loginbar a{color:#ff8c8c;text-decoration:none;}
.loginbar a:hover{text-decoration:underline;}

/* Responsive */
@media (max-width:520px){
  #topIcons:not(.mmx-white-admin-icons){gap:10px;padding:0;border-radius:0;}
  .mmx-admin-menu-btn{width:40px;height:40px;border-radius:13px;}
  .mmx-admin-menu-panel{top:46px;right:0;width:min(calc(100vw - 10px), 312px);border-radius:20px;}
  .mmx-admin-menu-title{font-size:18px;}
  .mmx-admin-menu-panel .ico,.mmx-admin-menu-panel .mmx-admin-menu-item{min-height:46px;padding:7px 12px;font-size:13px!important;}
  .mmx-admin-menu-iconbox{width:32px;height:32px;border-radius:11px;}
  .radio-mini-wrap{max-width:100%;padding:0 6px;margin:14px auto 20px;}
  .radio-mini{width:100%;max-width:100%;min-height:88px;grid-template-columns:62px minmax(0,1fr);gap:10px;padding:10px 11px;border-radius:20px;}
  .radio-mini img{width:62px;height:62px;border-radius:17px;}
  .rm-title{font-size:12px;margin-bottom:5px;letter-spacing:.045em;}
  .rm-meta-line{min-height:20px;margin:2px 0;border-radius:9px;}
  .rm-now{font-size:12px;padding:2px 7px;line-height:1.25;}
  .rm-controls{margin-top:7px;gap:8px;}
  #rmPlay{min-width:74px;padding:8px 11px;font-size:12px;}
  #rmVol{min-width:70px;}
  .radio-mini-social{display:none;}
  .repMix{max-width:220px;}
  .grid{gap:14px;}

  /* ACTION SOR: KICSINYÍT, DE EGYBEN MARAD */
  .live-actions{gap:8px;}
  #shareBtn{
    padding:10px 12px !important;
    border-radius:16px !important;
    height:42px;
    font-size:13px;
    gap:8px !important;
  }
  .react-btn{
    width:42px;
    height:42px;
    min-width:42px;
    min-height:42px;
  }
  .react-btn .reaction-sprite{width:40px;height:40px;opacity:.80;}
}


/* MMX_RADIO_COMPACT_DJ_V1 - a régi nagy rádiókártya helyett karcsú MusicMixx deck */
.radio-mini-wrap{
  width:min(720px, calc(100vw - 24px)) !important;
  max-width:720px !important;
  margin:10px auto 12px !important;
  padding:0 !important;
  display:flex !important;
  justify-content:center !important;
}
.radio-mini{
  width:min(560px, 100%) !important;
  min-height:68px !important;
  grid-template-columns:50px minmax(0,1fr) !important;
  gap:10px !important;
  padding:8px 10px !important;
  border-radius:20px !important;
  background:
    radial-gradient(90% 140% at 0% 0%, rgba(0,234,255,.14), transparent 44%),
    radial-gradient(90% 120% at 100% 100%, rgba(200,107,255,.10), transparent 44%),
    linear-gradient(180deg, rgba(9,13,24,.74), rgba(5,8,15,.68)) !important;
  border:1px solid rgba(255,255,255,.11) !important;
  box-shadow:0 12px 30px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.08) !important;
  backdrop-filter:blur(12px) saturate(1.08) !important;
  -webkit-backdrop-filter:blur(12px) saturate(1.08) !important;
}
.radio-mini:before{
  height:1px !important;
  background:linear-gradient(90deg, transparent, rgba(0,234,255,.62), rgba(200,107,255,.36), transparent) !important;
  opacity:.78 !important;
}
.radio-mini img{
  width:50px !important;
  height:50px !important;
  border-radius:15px !important;
  border:1px solid rgba(255,255,255,.13) !important;
  box-shadow:0 8px 18px rgba(0,0,0,.30), 0 0 16px rgba(0,234,255,.08) !important;
}
.radio-mini-text{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) 76px !important;
  grid-template-areas:
    "title controls"
    "artist controls"
    "song controls" !important;
  align-items:center !important;
  column-gap:10px !important;
  row-gap:1px !important;
  padding:0 !important;
  min-width:0 !important;
}
.radio-mini-text > .rm-title{grid-area:title !important;}
.radio-mini-text > .rm-meta-line:nth-child(2){grid-area:artist !important;}
.radio-mini-text > .rm-meta-line:nth-child(3){grid-area:song !important;}
.radio-mini-text > .rm-controls{grid-area:controls !important;}
.rm-title{
  margin:0 !important;
  display:flex !important;
  align-items:center !important;
  gap:7px !important;
  font-family:Inter, Arial, sans-serif !important;
  font-size:10px !important;
  line-height:1.1 !important;
  font-weight:1000 !important;
  letter-spacing:.10em !important;
  color:rgba(233,250,255,.76) !important;
  text-transform:uppercase !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}
.rm-title:after{
  content:"ON AIR";
  flex:0 0 auto;
  padding:3px 6px;
  border-radius:999px;
  background:rgba(0,234,255,.12);
  border:1px solid rgba(0,234,255,.20);
  color:rgba(160,245,255,.92);
  font-size:9px;
  line-height:1;
  letter-spacing:.08em;
  box-shadow:0 0 12px rgba(0,234,255,.08);
}
.rm-meta-line{
  min-height:15px !important;
  margin:0 !important;
}
.rm-now,
.rm-now span,
.rm-artist,
.rm-song{
  color:rgba(245,252,255,.94) !important;
  text-shadow:none !important;
}
.rm-now{
  font-size:13px !important;
  line-height:1.15 !important;
  font-weight:950 !important;
}
.rm-song{
  color:rgba(215,232,240,.66) !important;
  font-size:11.5px !important;
  font-weight:750 !important;
}
.rm-controls{
  margin:0 !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:stretch !important;
  justify-content:center !important;
  gap:6px !important;
}
#rmPlay{
  width:40px !important;
  min-width:40px !important;
  height:34px !important;
  align-self:flex-end !important;
  padding:0 !important;
  border-radius:13px !important;
  background:linear-gradient(135deg, rgba(255,255,255,.96), rgba(0,234,255,.72)) !important;
  color:#051018 !important;
  font-size:14px !important;
  line-height:34px !important;
  font-weight:1000 !important;
  box-shadow:0 8px 18px rgba(0,0,0,.26), 0 0 16px rgba(0,234,255,.12) !important;
}
#rmVol{
  width:76px !important;
  min-width:76px !important;
  height:4px !important;
  accent-color:rgba(0,234,255,.92) !important;
  opacity:.86 !important;
}
body.mmx-live-idle .radio-mini{
  background:
    radial-gradient(90% 140% at 0% 0%, rgba(0,234,255,.14), transparent 44%),
    radial-gradient(90% 120% at 100% 100%, rgba(200,107,255,.10), transparent 44%),
    linear-gradient(180deg, rgba(9,13,24,.74), rgba(5,8,15,.68)) !important;
  border-color:rgba(255,255,255,.11) !important;
  box-shadow:0 12px 30px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.08) !important;
  color:rgba(245,252,255,.94) !important;
}
body.mmx-live-idle .radio-mini img{border-color:rgba(255,255,255,.13) !important;box-shadow:0 8px 18px rgba(0,0,0,.30), 0 0 16px rgba(0,234,255,.08) !important;}
body.mmx-live-idle .radio-mini .rm-title,
body.mmx-live-idle .radio-mini .rm-now,
body.mmx-live-idle .radio-mini .rm-artist,
body.mmx-live-idle .radio-mini .rm-song,
body.mmx-live-idle .radio-mini .rm-now span{color:rgba(245,252,255,.94) !important;}
body.mmx-live-idle .radio-mini .rm-song{color:rgba(215,232,240,.66) !important;}
body.mmx-live-idle #rmPlay{background:linear-gradient(135deg, rgba(255,255,255,.96), rgba(0,234,255,.72)) !important;color:#051018 !important;box-shadow:0 8px 18px rgba(0,0,0,.26), 0 0 16px rgba(0,234,255,.12) !important;}
body.mmx-live-idle #rmVol{accent-color:rgba(0,234,255,.92) !important;}
@media (max-width:520px){
  .radio-mini-wrap{width:calc(100vw - 16px) !important;margin:8px auto 10px !important;padding:0 !important;}
  .radio-mini{width:100% !important;min-height:58px !important;grid-template-columns:42px minmax(0,1fr) !important;gap:8px !important;padding:7px 8px !important;border-radius:17px !important;}
  .radio-mini img{width:42px !important;height:42px !important;border-radius:13px !important;}
  .radio-mini-text{grid-template-columns:minmax(0,1fr) 38px !important;column-gap:7px !important;row-gap:0 !important;}
  .rm-title{font-size:9.5px !important;letter-spacing:.08em !important;}
  .rm-title:after{display:none !important;}
  .rm-meta-line{min-height:14px !important;}
  .rm-now{font-size:11.5px !important;line-height:1.12 !important;}
  .rm-song{font-size:10.5px !important;}
  .rm-controls{gap:0 !important;align-items:flex-end !important;}
  #rmPlay{width:36px !important;min-width:36px !important;height:32px !important;border-radius:12px !important;font-size:13px !important;line-height:32px !important;}
  #rmVol{display:none !important;}
}


/* MMX_DUAL_FILL_VU_METER_V3 - két soros valós VU: folyamatos LED sor, csak az utolsó aktív LED mozog */
.radio-mini-text{
  grid-template-areas:
    "title controls"
    "artist controls"
    "song controls"
    "vu controls" !important;
  row-gap:2px !important;
}
.radio-mini-text > .rm-vu-wrap{grid-area:vu !important;}
.rm-vu-wrap{
  position:relative;
  z-index:2;
  min-width:0;
  display:grid;
  grid-template-columns:16px minmax(0,1fr);
  grid-template-rows:repeat(2, 8px);
  align-items:center;
  gap:2px 5px;
  height:18px;
  margin-top:2px;
  pointer-events:none;
}
.rm-vu-name{
  color:rgba(190,226,235,.52);
  font-size:7px;
  line-height:1;
  font-weight:1000;
  letter-spacing:.10em;
  text-align:right;
  text-shadow:0 0 8px rgba(0,234,255,.10);
}
.rm-vu{
  --vu-pos:0;
  display:grid;
  grid-template-columns:repeat(18, minmax(2px, 1fr));
  align-items:center;
  gap:2px;
  height:7px;
  min-width:0;
  padding:1px 2px;
  border-radius:999px;
  background:linear-gradient(180deg, rgba(0,0,0,.32), rgba(0,0,0,.18));
  border:1px solid rgba(255,255,255,.055);
  box-shadow:inset 0 1px 5px rgba(0,0,0,.46), 0 0 12px rgba(0,234,255,.035);
  overflow:hidden;
}
.rm-vu i{
  display:block;
  height:100%;
  min-width:2px;
  border-radius:4px;
  opacity:.17;
  transform:scaleY(.62);
  transform-origin:center center;
  background:rgba(50,255,130,.88);
  box-shadow:0 0 0 rgba(50,255,130,0);
  transition:opacity .035s linear, transform .035s linear, box-shadow .035s linear, filter .035s linear;
}
.rm-vu i:nth-child(n+14):nth-child(-n+16){background:rgba(255,174,44,.95);}
.rm-vu i:nth-child(n+17){background:rgba(255,54,74,.96);}
.rm-vu i.is-on{
  opacity:.76;
  transform:scaleY(.88);
  filter:saturate(1.06) brightness(.98);
}
.rm-vu i.is-led{
  opacity:1;
  transform:scaleY(1.16);
  filter:saturate(1.28) brightness(1.18);
}
.rm-vu i.is-led:nth-child(-n+13){box-shadow:0 0 8px rgba(50,255,130,.62), 0 0 14px rgba(50,255,130,.18);}
.rm-vu i.is-led:nth-child(n+14):nth-child(-n+16){box-shadow:0 0 9px rgba(255,174,44,.72), 0 0 16px rgba(255,174,44,.22);}
.rm-vu i.is-led:nth-child(n+17){box-shadow:0 0 11px rgba(255,54,74,.82), 0 0 20px rgba(255,54,74,.26);}
.rm-vu.is-disabled{opacity:.36;filter:grayscale(.5);}
@media (max-width:520px){
  .radio-mini{min-height:66px !important;}
  .radio-mini-text{
    grid-template-columns:minmax(0,1fr) 38px !important;
    grid-template-areas:
      "title controls"
      "artist controls"
      "song controls"
      "vu controls" !important;
    row-gap:1px !important;
  }
  .rm-vu-wrap{grid-template-columns:13px minmax(0,1fr);grid-template-rows:repeat(2, 7px);height:16px;gap:1px 4px;margin-top:1px;}
  .rm-vu-name{font-size:6.5px;letter-spacing:.06em;}
  .rm-vu{height:6px;gap:1px;padding:1px 2px;}
}

/* MMX_FLAT_PUSH_VU_V4 - fizikai VU kinézet: szögletes LED sor, egy előretolt LED, bubimentes gombok */
.rm-vu{
  height:8px !important;
  gap:2px !important;
  padding:2px 3px !important;
  border-radius:3px !important;
  background:linear-gradient(180deg, #030506, #080b0e) !important;
  border:1px solid rgba(255,255,255,.12) !important;
  box-shadow:inset 0 1px 4px rgba(0,0,0,.70), 0 0 0 1px rgba(0,0,0,.22) !important;
  overflow:hidden !important;
}
.rm-vu i{
  height:100% !important;
  border-radius:1px !important;
  opacity:.11 !important;
  transform:none !important;
  filter:none !important;
  box-shadow:none !important;
  transition:opacity .028s linear, filter .028s linear, box-shadow .028s linear !important;
}
.rm-vu i.is-on{
  opacity:.88 !important;
  transform:none !important;
  filter:saturate(1.08) brightness(1.02) !important;
  box-shadow:0 0 5px rgba(50,255,130,.32) !important;
}
.rm-vu i.is-led{
  opacity:1 !important;
  transform:none !important;
  filter:saturate(1.35) brightness(1.22) !important;
  animation:mmxVuPushLed .08s linear;
}
.rm-vu i.is-led:nth-child(-n+13){box-shadow:0 0 7px rgba(50,255,130,.72), 0 0 13px rgba(50,255,130,.20) !important;}
.rm-vu i.is-led:nth-child(n+14):nth-child(-n+16){box-shadow:0 0 8px rgba(255,174,44,.82), 0 0 15px rgba(255,174,44,.24) !important;}
.rm-vu i.is-led:nth-child(n+17){box-shadow:0 0 9px rgba(255,54,74,.92), 0 0 18px rgba(255,54,74,.28) !important;}
@keyframes mmxVuPushLed{from{opacity:.72;filter:brightness(1.05)}to{opacity:1;filter:brightness(1.24)}}
#rmPlay{
  border-radius:6px !important;
  background:linear-gradient(180deg, rgba(18,25,34,.98), rgba(7,11,17,.98)) !important;
  border:1px solid rgba(0,234,255,.26) !important;
  color:rgba(226,250,255,.96) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.09), 0 5px 12px rgba(0,0,0,.24) !important;
}
#rmPlay:hover{filter:brightness(1.08) !important;}
@media (max-width:520px){
  .rm-vu{height:7px !important;gap:1px !important;padding:1px 2px !important;border-radius:2px !important;}
}



/* MMX_ONAIR_CONTROLS_ORANGE_TAGS_V5 - hangerő + play az ON AIR sorban, bubimentes beépített címkék */
.radio-mini-text{
  grid-template-columns:minmax(0,1fr) !important;
  grid-template-areas:
    "title"
    "artist"
    "song"
    "vu" !important;
  row-gap:2px !important;
}
.radio-mini-text > .rm-title{grid-area:title !important;}
.radio-mini-text > .rm-controls{grid-area:title !important;}
.radio-mini-text > .rm-meta-line:nth-child(2){grid-area:artist !important;}
.radio-mini-text > .rm-meta-line:nth-child(3){grid-area:song !important;}
.radio-mini-text > .rm-vu-wrap{grid-area:vu !important;}
.rm-title{
  min-height:28px !important;
  padding-right:132px !important;
  display:flex !important;
  align-items:center !important;
  gap:8px !important;
  white-space:nowrap !important;
}
.rm-title:after{
  border-radius:4px !important;
  padding:4px 7px !important;
  background:rgba(255,132,0,.10) !important;
  border:1px solid rgba(255,132,0,.38) !important;
  color:rgba(255,186,92,.98) !important;
  box-shadow:inset 0 0 0 1px rgba(255,132,0,.05), 0 0 10px rgba(255,132,0,.12) !important;
}
.rm-controls{
  justify-self:end !important;
  align-self:center !important;
  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  justify-content:flex-end !important;
  gap:7px !important;
  width:auto !important;
  min-width:0 !important;
  margin:0 !important;
  padding:0 !important;
}
#rmVol{
  order:1 !important;
  display:block !important;
  width:78px !important;
  min-width:78px !important;
  height:4px !important;
  opacity:.92 !important;
  accent-color:#ff8a00 !important;
  margin:0 !important;
}
#rmPlay{
  order:2 !important;
  width:32px !important;
  min-width:32px !important;
  height:24px !important;
  line-height:22px !important;
  padding:0 !important;
  border-radius:4px !important;
  background:linear-gradient(180deg, rgba(18,24,31,.98), rgba(5,8,12,.98)) !important;
  border:1px solid rgba(255,132,0,.40) !important;
  color:rgba(255,205,136,.98) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08), 0 0 10px rgba(255,132,0,.12) !important;
}
#rmPlay:hover{filter:brightness(1.12) !important;box-shadow:inset 0 1px 0 rgba(255,255,255,.10), 0 0 13px rgba(255,132,0,.20) !important;}

/* a szűrő ne külön bubis doboz legyen, hanem az oldalba süllyesztett sín */
@media (max-width:520px){
  .radio-mini{min-height:66px !important;}
  .radio-mini-text{
    grid-template-columns:minmax(0,1fr) !important;
    grid-template-areas:
      "title"
      "artist"
      "song"
      "vu" !important;
    row-gap:1px !important;
  }
  .rm-title{min-height:26px !important;padding-right:96px !important;font-size:9px !important;gap:5px !important;}
  .rm-title:after{display:inline-flex !important;padding:3px 5px !important;font-size:8px !important;border-radius:3px !important;}
  .rm-controls{gap:5px !important;}
  #rmVol{display:block !important;width:56px !important;min-width:56px !important;height:3px !important;}
  #rmPlay{width:28px !important;min-width:28px !important;height:23px !important;line-height:21px !important;font-size:12px !important;border-radius:4px !important;}
}
@media (max-width:370px){
  .rm-title{padding-right:82px !important;}
  .rm-title:after{display:none !important;}
  #rmVol{width:50px !important;min-width:50px !important;}
  #rmPlay{width:26px !important;min-width:26px !important;}
}



/* MMX_PRETTY_48_DOT_PUSH_VU_V8 - 48 db apró, fényes kerek LED soronként; a sor végét egy külön pötty tolja */
.rm-vu-wrap{
  grid-template-columns:13px minmax(0,1fr) !important;
  grid-template-rows:repeat(2, 9px) !important;
  width:100% !important;
  height:20px !important;
  gap:2px 6px !important;
  margin-top:2px !important;
  align-items:center !important;
}
.rm-vu-name{
  font-size:7px !important;
  font-weight:900 !important;
  letter-spacing:.10em !important;
  color:rgba(255,186,92,.62) !important;
  text-shadow:0 0 7px rgba(255,132,0,.18) !important;
}
.rm-vu{
  --rm-vu-dot:3.15px;
  --rm-vu-leds:48;
  position:relative !important;
  display:grid !important;
  grid-template-columns:repeat(var(--rm-vu-leds), minmax(0,1fr)) !important;
  justify-content:stretch !important;
  align-items:center !important;
  justify-items:center !important;
  gap:0 !important;
  width:100% !important;
  min-width:0 !important;
  height:9px !important;
  min-height:9px !important;
  padding:1px 5px !important;
  border-radius:999px !important;
  background:
    linear-gradient(90deg, rgba(39,255,112,.035), rgba(255,155,22,.038) 72%, rgba(255,36,56,.05)),
    linear-gradient(180deg, rgba(0,0,0,.92), rgba(8,10,12,.86)) !important;
  border:1px solid rgba(255,162,28,.30) !important;
  box-shadow:
    inset 0 1px 5px rgba(0,0,0,.82),
    inset 0 -1px 0 rgba(255,255,255,.035),
    0 0 13px rgba(255,132,0,.10) !important;
  overflow:hidden !important;
}
.rm-vu:before{
  content:"" !important;
  position:absolute !important;
  inset:1px 4px !important;
  border-radius:999px !important;
  background:linear-gradient(180deg, rgba(255,255,255,.09), rgba(255,255,255,0) 58%) !important;
  pointer-events:none !important;
}
.rm-vu i{
  position:relative !important;
  z-index:1 !important;
  width:var(--rm-vu-dot) !important;
  min-width:var(--rm-vu-dot) !important;
  height:var(--rm-vu-dot) !important;
  min-height:var(--rm-vu-dot) !important;
  justify-self:center !important;
  align-self:center !important;
  border-radius:50% !important;
  opacity:.24 !important;
  transform:scale(.92) !important;
  filter:saturate(1.05) brightness(.88) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.08),
    0 0 2px rgba(0,0,0,.75) !important;
  transition:opacity .035s linear, filter .035s linear, box-shadow .035s linear, transform .035s linear !important;
}
.rm-vu i.is-on{
  opacity:.94 !important;
  transform:scale(1.08) !important;
  filter:saturate(1.42) brightness(1.22) !important;
  box-shadow:
    0 0 5px currentColor,
    0 0 10px currentColor,
    inset 0 0 0 1px rgba(255,255,255,.24) !important;
}
.rm-vu i.is-led{
  opacity:1 !important;
  transform:scale(1.55) !important;
  filter:saturate(1.85) brightness(1.65) !important;
  box-shadow:
    0 0 10px currentColor,
    0 0 20px currentColor,
    0 0 30px currentColor,
    inset 0 0 0 1px rgba(255,255,255,.34) !important;
  animation:mmxVuDotPush .06s linear !important;
}
.rm-vu i:nth-child(-n+36){
  background:#25ff6c !important;
  color:rgba(37,255,108,.86) !important;
}
.rm-vu i:nth-child(n+37):nth-child(-n+44){
  background:#ff9b16 !important;
  color:rgba(255,155,22,.92) !important;
}
.rm-vu i:nth-child(n+45){
  background:#ff2738 !important;
  color:rgba(255,39,56,.98) !important;
}
.rm-vu i.is-led:nth-child(-n+36){
  box-shadow:0 0 9px rgba(37,255,108,.90), 0 0 18px rgba(37,255,108,.28), inset 0 0 0 1px rgba(255,255,255,.22) !important;
}
.rm-vu i.is-led:nth-child(n+37):nth-child(-n+44){
  box-shadow:0 0 10px rgba(255,155,22,.98), 0 0 19px rgba(255,155,22,.34), inset 0 0 0 1px rgba(255,255,255,.22) !important;
}
.rm-vu i.is-led:nth-child(n+45){
  box-shadow:0 0 11px rgba(255,39,56,1), 0 0 21px rgba(255,39,56,.38), inset 0 0 0 1px rgba(255,255,255,.22) !important;
}
.rm-vu.is-disabled{opacity:.38 !important;filter:grayscale(.45) !important;}
@keyframes mmxVuDotPush{from{transform:scale(1.10);opacity:.88}to{transform:scale(1.55);opacity:1}}
@media (max-width:520px){
  .rm-vu-wrap{grid-template-columns:11px minmax(0,1fr) !important;grid-template-rows:repeat(2, 8px) !important;height:18px !important;gap:1px 4px !important;margin-top:1px !important;}
  .rm-vu-name{font-size:6px !important;}
  .rm-vu{--rm-vu-dot:2.65px;height:8px !important;min-height:8px !important;padding:1px 4px !important;border-radius:999px !important;}
  .rm-vu i.is-led{transform:scale(1.46) !important;}
}
@media (max-width:370px){
  .rm-vu{--rm-vu-dot:2.25px;padding-left:3px !important;padding-right:3px !important;}
  .rm-vu-name{font-size:5.7px !important;}
}


/* MMX_CONTINUOUS_FLOW_VU_V11 - fix színskála lágy átmenettel */
.rm-vu-wrap{
  grid-template-columns:13px minmax(0,1fr) !important;
  grid-template-rows:repeat(2, 11px) !important;
  width:100% !important;
  height:24px !important;
  gap:2px 6px !important;
  margin-top:3px !important;
  align-items:center !important;
}
.rm-vu-name{
  font-size:7px !important;
  font-weight:1000 !important;
  letter-spacing:.08em !important;
  color:rgba(255,188,96,.72) !important;
  text-shadow:0 0 8px rgba(255,132,0,.18) !important;
}
.rm-vu{
  --vu-level:0%;
  --vu-peak:0%;
  position:relative !important;
  display:block !important;
  width:100% !important;
  min-width:0 !important;
  height:11px !important;
  min-height:11px !important;
  padding:0 !important;
  border-radius:4px !important;
  overflow:hidden !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,0) 36%),
    linear-gradient(180deg, rgba(18,22,24,.98), rgba(5,6,8,.98)) !important;
  border:1px solid rgba(255,255,255,.10) !important;
  box-shadow:
    inset 0 1px 5px rgba(0,0,0,.92),
    inset 0 -1px 0 rgba(255,255,255,.035),
    0 0 0 1px rgba(0,0,0,.22),
    0 0 14px rgba(255,100,0,.06) !important;
}
.rm-vu:before{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,0) 45%),
    repeating-linear-gradient(90deg, rgba(255,255,255,.045) 0 1px, transparent 1px calc(100% / 12)) !important;
  pointer-events:none !important;
  z-index:0 !important;
}
.rm-vu i{display:none !important;}
.rm-vu .rm-vu-fill,
.rm-vu .rm-vu-peak{position:absolute !important;display:block !important;pointer-events:none !important;}
.rm-vu .rm-vu-fill{
  left:0 !important;
  top:0 !important;
  bottom:0 !important;
  width:100% !important;
  min-width:100% !important;
  border-radius:3px !important;
  overflow:hidden !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.16), rgba(255,255,255,0) 42%),
    linear-gradient(90deg,
      #14ff48 0%,
      #25ff4f 68%,
      #7dff36 72%,
      #ff9f18 76%,
      #ff9f18 86%,
      #ff6d17 89%,
      #ff2e39 92%,
      #ff2e39 100%) !important;
  clip-path:inset(0 calc(100% - var(--vu-level)) 0 0) !important;
  -webkit-clip-path:inset(0 calc(100% - var(--vu-level)) 0 0) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.18),
    0 0 8px rgba(37,255,92,.18) !important;
  z-index:1 !important;
  transition:clip-path .055s linear, -webkit-clip-path .055s linear !important;
}
.rm-vu .rm-vu-fill::before{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  background:linear-gradient(180deg, rgba(255,255,255,.16), rgba(255,255,255,0) 45%, rgba(0,0,0,.10) 100%) !important;
  pointer-events:none !important;
}
.rm-vu .rm-vu-fill::after{
  content:none !important;
}
.rm-vu .rm-vu-peak{
  top:1px !important;
  bottom:1px !important;
  left:var(--vu-peak) !important;
  width:2px !important;
  transform:translateX(-50%) !important;
  border-radius:2px !important;
  background:#29ff55 !important;
  box-shadow:
    0 0 7px rgba(41,255,85,.58),
    0 0 13px rgba(41,255,85,.24) !important;
  z-index:2 !important;
  opacity:0 !important;
  transition:left .045s linear, opacity .045s linear, background .045s linear, box-shadow .045s linear !important;
}
.rm-vu .rm-vu-peak.is-orange{
  background:#ff9f18 !important;
  box-shadow:0 0 7px rgba(255,159,24,.64), 0 0 13px rgba(255,159,24,.28) !important;
}
.rm-vu .rm-vu-peak.is-red{
  background:#ff2e39 !important;
  box-shadow:0 0 7px rgba(255,46,57,.72), 0 0 13px rgba(255,46,57,.34) !important;
}
.rm-vu.is-active .rm-vu-peak{opacity:1 !important;}
.rm-vu.is-disabled{opacity:.34 !important;filter:grayscale(.58) !important;}
@media (max-width:520px){
  .rm-vu-wrap{grid-template-columns:11px minmax(0,1fr) !important;grid-template-rows:repeat(2, 10px) !important;height:22px !important;gap:2px 5px !important;}
  .rm-vu-name{font-size:6px !important;}
  .rm-vu{height:10px !important;min-height:10px !important;}
}
@media (max-width:370px){
  .rm-vu-wrap{grid-template-columns:10px minmax(0,1fr) !important;gap:2px 4px !important;}
  .rm-vu-name{font-size:5.7px !important;}
  .rm-vu{height:9px !important;min-height:9px !important;}
}

/* =====================================================
   💬 MMX_AI_WIDGET (fixed jobb alsó, mobilbarát)
===================================================== */
#mmxAiDock{
  position: fixed;
  right: calc(16px + env(safe-area-inset-right));
  bottom: calc(16px + env(safe-area-inset-bottom));
  z-index: 100000;
  font-family: Inter, Arial, sans-serif;
  pointer-events: none;
}
#mmxAiDock *{ box-sizing:border-box; }

#mmxAiBtn{
  pointer-events: auto;
  border: 1px solid rgba(0,234,255,.22);
  background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.03));
  color: rgba(240,252,255,.95);
  border-radius: 999px;
  padding: 12px 14px;
  cursor: pointer;
  font-weight: 900;
  letter-spacing: .2px;
  box-shadow: 0 14px 34px rgba(0,0,0,.45), 0 0 22px rgba(0,234,255,.12);
  backdrop-filter: blur(10px);
  display: inline-flex;
  align-items: center;
  gap: 10px;
  user-select:none;
  -webkit-tap-highlight-color: transparent;
  transition: transform .14s ease, filter .14s ease;
}
#mmxAiBtn:hover{
  transform: translateY(-1px);
  filter: drop-shadow(0 0 12px rgba(0,234,255,.18));
}
#mmxAiBtn .dot{
  width:10px;height:10px;border-radius:50%;
  background: rgba(0,234,255,.92);
  box-shadow: 0 0 14px rgba(0,234,255,.40);
}

#mmxAiPanel{
  pointer-events: auto;
  position: absolute;
  right: 0;
  bottom: 56px;
  width: 360px;
  max-width: calc(100vw - 32px);
  height: 520px;
  max-height: calc(100vh - 140px);
  border-radius: 18px;
  overflow: hidden;
  border: 1px solid rgba(0,234,255,.18);
  background:
    radial-gradient(120% 100% at 10% 0%, rgba(0,234,255,.10), transparent 55%),
    linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.03));
  box-shadow: 0 18px 50px rgba(0,0,0,.55), 0 0 18px rgba(0,234,255,.10);
  backdrop-filter: blur(12px);
  display: none;
}
#mmxAiPanel.open{ display:block; }

#mmxAiHead{
  display:flex; align-items:center; justify-content:space-between;
  padding: 10px 12px;
  border-bottom: 1px solid rgba(0,234,255,.18);
}
#mmxAiHead .t{
  font-family: Orbitron, Inter, Arial, sans-serif;
  font-weight: 800;
  letter-spacing: .6px;
  color: rgba(235,250,255,.92);
}
#mmxAiHead .x{
  cursor:pointer;
  border: 1px solid rgba(255,120,120,.25);
  background: rgba(0,0,0,.18);
  color: #ffb1b1;
  border-radius: 12px;
  padding: 4px 10px;
  font-weight: 900;
}
#mmxAiHead .x:hover{ box-shadow: 0 0 14px rgba(255,120,120,.18); }

#mmxAiLog{
  height: calc(100% - 104px);
  overflow: auto;
  padding: 10px 12px;
  display:flex;
  flex-direction:column;
  gap: 8px;
}
.mmxMsg{
  max-width: 86%;
  padding: 10px 12px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(0,0,0,.22);
  color: rgba(240,252,255,.95);
  white-space: pre-wrap;
  word-break: break-word;
  box-shadow: 0 10px 22px rgba(0,0,0,.28);
}
.mmxMe{
  align-self:flex-end;
  border-color: rgba(0,184,255,.22);
  background: rgba(0,234,255,.08);
}
.mmxAi{
  align-self:flex-start;
  border-color: rgba(200,107,255,.18);
  background: rgba(0,0,0,.20);
}

#mmxAiFoot{
  display:flex;
  gap: 8px;
  padding: 10px 12px;
  border-top: 1px solid rgba(0,234,255,.12);
}
#mmxAiIn{
  flex: 1;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.06);
  color: rgba(240,252,255,.95);
  padding: 10px 12px;
  outline: none;
}
#mmxAiIn::placeholder{ color: rgba(220,235,245,.45); }
#mmxAiIn:focus{
  border-color: rgba(0,234,255,.35);
  box-shadow: 0 0 0 3px rgba(0,234,255,.10);
}
#mmxAiSend{
  border: 1px solid rgba(0,234,255,.20);
  background: rgba(0,234,255,.10);
  color: rgba(230,250,255,.95);
  padding: 10px 12px;
  border-radius: 14px;
  cursor: pointer;
  font-weight: 900;
}
#mmxAiSend:hover{
  background: rgba(0,234,255,.16);
  box-shadow: 0 0 18px rgba(0,234,255,.12);
}
#mmxAiSmall{
  font-size: 11px;
  color: rgba(170,210,235,.55);
  padding: 0 12px 10px;
}

/* Mobil */
@media (max-width:520px){
  #mmxAiPanel{
    width: min(92vw, 420px);
    height: min(70vh, 560px);
    bottom: 58px;
  }
  #mmxAiBtn{ padding: 11px 13px; }
}
/* MMX_AI_WIDGET TWEAK v1 (grey glass) */
#mmxAiBtn{
  background: rgba(8,10,14,.55);
  border-color: rgba(255,255,255,.10);
  box-shadow: 0 12px 30px rgba(0,0,0,.55), 0 0 14px rgba(0,234,255,.08);
}
#mmxAiPanel{
  background: linear-gradient(180deg, rgba(8,10,14,.78), rgba(8,10,14,.56));
  border-color: rgba(255,255,255,.10);
  box-shadow: 0 18px 50px rgba(0,0,0,.62), 0 0 14px rgba(0,234,255,.06);
}
#mmxAiPanel, #mmxAiBtn{
  backdrop-filter: blur(16px) saturate(.90);
}
.mmxMsg{
  background: rgba(0,0,0,.28);
  border-color: rgba(255,255,255,.09);
}
.mmxMe{
  background: rgba(0,234,255,.06);
}
/* MMX_AI_WIDGET TWEAK v1 (grey glass) */
#mmxAiBtn{
  background: rgba(8,10,14,.55);
  border-color: rgba(255,255,255,.10);
  box-shadow: 0 12px 30px rgba(0,0,0,.55), 0 0 14px rgba(0,234,255,.08);
}
#mmxAiPanel{
  background: linear-gradient(180deg, rgba(8,10,14,.78), rgba(8,10,14,.56));
  border-color: rgba(255,255,255,.10);
  box-shadow: 0 18px 50px rgba(0,0,0,.62), 0 0 14px rgba(0,234,255,.06);
}
#mmxAiPanel, #mmxAiBtn{
  backdrop-filter: blur(16px) saturate(.90);
}
.mmxMsg{
  background: rgba(0,0,0,.28);
  border-color: rgba(255,255,255,.09);
}
.mmxMe{
  background: rgba(0,234,255,.06);
}
/* MMX_AI_WIDGET END */

/* MMX_AI_POSITION_FIX_V2
   - Telepítés sáv ne takarja a Chat gombot
   - Chat ablak teteje ne lógjon ki / X mindig elérhető legyen mobilon is
   - Csak pozíció + méretezés, működéshez nem nyúl
*/
#mmxAiDock{
  right: calc(14px + env(safe-area-inset-right)) !important;
  bottom: calc(86px + env(safe-area-inset-bottom)) !important;
  z-index: 100000 !important;
}
#mmxAiPanel{
  position: fixed !important;
  right: calc(14px + env(safe-area-inset-right)) !important;
  bottom: calc(146px + env(safe-area-inset-bottom)) !important;
  width: 360px !important;
  max-width: calc(100vw - 28px) !important;
  height: min(520px, calc(100dvh - 170px)) !important;
  max-height: calc(100dvh - 170px) !important;
  overflow: hidden !important;
}
#mmxAiPanel.open{
  display: flex !important;
  flex-direction: column !important;
}
#mmxAiHead{
  flex: 0 0 auto !important;
  min-height: 52px !important;
  position: relative !important;
  z-index: 5 !important;
}
#mmxAiLog{
  flex: 1 1 auto !important;
  min-height: 0 !important;
  height: auto !important;
}
#mmxAiSmall,
#mmxAiFoot{
  flex: 0 0 auto !important;
}
@media (max-width:520px){
  #mmxAiDock{
    right: calc(10px + env(safe-area-inset-right)) !important;
    bottom: calc(82px + env(safe-area-inset-bottom)) !important;
  }
  #mmxAiPanel{
    left: calc(10px + env(safe-area-inset-left)) !important;
    right: calc(10px + env(safe-area-inset-right)) !important;
    top: calc(12px + env(safe-area-inset-top)) !important;
    bottom: calc(84px + env(safe-area-inset-bottom)) !important;
    width: auto !important;
    height: auto !important;
    max-width: none !important;
    max-height: none !important;
    border-radius: 18px !important;
  }
  #mmxAiHead{
    min-height: 56px !important;
    padding: 12px 12px !important;
  }
  #mmxAiHead .x{
    min-width: 38px !important;
    min-height: 34px !important;
  }
}


/* =========================
   PWA INSTALL (PC) - sáv
   ========================= */
.pwa-install{
  position:fixed;
  left:14px; right:14px; bottom:14px;
  z-index:9990;
  display:none;
}
.pwa-install.show{display:block;}
.pwa-install .pwa-box{
  display:flex;
  gap:12px;
  align-items:center;
  justify-content:space-between;
  padding:12px 14px;
  border-radius:18px;
  background: rgba(10,15,24,.92);
  border:1px solid rgba(0,234,255,.22);
  box-shadow: 0 18px 50px rgba(0,0,0,.55), 0 0 22px rgba(0,234,255,.14);
  backdrop-filter: blur(8px);
}
.pwa-install .pwa-txt{min-width:0;}
.pwa-install .pwa-txt b{display:block; font-weight:800;}
.pwa-install .pwa-sub{font-size:13px; color: rgba(230,245,255,.72); margin-top:2px;}
.pwa-install .pwa-actions{display:flex; gap:10px; flex-wrap:wrap;}
.pwa-btn{
  appearance:none;
  border:1px solid rgba(0,234,255,.35);
  background: rgba(0,234,255,.12);
  color:#eaf3ff;
  padding:10px 14px;
  border-radius:14px;
  font-weight:700;
  cursor:pointer;
}
.pwa-btn:hover{background: rgba(0,234,255,.18);}
.pwa-btn.secondary{
  border-color: rgba(255,255,255,.18);
  background: rgba(255,255,255,.06);
}
.pwa-btn.secondary:hover{background: rgba(255,255,255,.10);}
@media (max-width: 520px){
  .pwa-install{left:10px; right:10px; bottom:10px;}
  .pwa-install .pwa-box{flex-direction:column; align-items:stretch;}
  .pwa-install .pwa-actions{justify-content:flex-end;}
}
