/* V57 — Responsive global VYNEXA: téléphone, tablette et PC */
:root{--vx-mobile-bar:64px;--vx-bottom-bar:68px}
html,body{max-width:100%;overflow-x:hidden}
img,video,canvas,svg{max-width:100%}
main,.center,.card,.glass,.panel,.item,.previewCard,.kpi{min-width:0}
input,textarea,select,button{max-width:100%}
.vx-mobile-top,.vx-mobile-bottom,.vx-mobile-drawer,.vx-mobile-backdrop{display:none}

/* Desktop large — plus aéré sans étirer les cartes */
@media(min-width:1181px){
  .layout{max-width:1560px!important;grid-template-columns:minmax(190px,220px) minmax(0,1fr) minmax(260px,310px)!important}
  .layout.admin{grid-template-columns:minmax(220px,250px) minmax(0,1fr) minmax(260px,310px)!important}
  .center{min-width:0}
}

/* Tablette */
@media(min-width:901px) and (max-width:1180px){
  .layout,.layout.admin{grid-template-columns:76px minmax(0,1fr) minmax(230px,270px)!important}
  .right{min-width:0}
  .profileHero{grid-template-columns:96px minmax(0,1fr)!important}
  .profileHero>#profileActions{grid-column:1/-1;justify-content:flex-start;flex-wrap:wrap}
}

/* Téléphone/tablette portrait */
@media(max-width:900px){
  html{scroll-padding-top:calc(var(--vx-mobile-bar) + 10px)}
  body.vx-has-mobile-nav{padding-top:var(--vx-mobile-bar)!important;padding-bottom:calc(var(--vx-bottom-bar) + env(safe-area-inset-bottom,0px))!important}
  .app{padding:8px 8px 18px!important;min-height:calc(100dvh - var(--vx-mobile-bar))!important}
  .layout,.layout.admin{display:block!important;width:100%!important;max-width:100%!important;margin:0!important}
  .left,.right{display:none!important}
  .center,main{width:100%!important;max-width:100%!important;margin:0!important}
  .glass,.card,.panel{border-radius:16px!important}
  .pad{padding:13px!important}
  .top{padding:8px!important;position:relative!important;top:auto!important}
  .top .search{min-width:0}
  .grid2,.grid3,.grid4,.formgrid,.paygrid,.cryptoRow{grid-template-columns:1fr!important}
  .between{align-items:flex-start!important;flex-wrap:wrap!important}
  .row{flex-wrap:wrap}
  .profileHero{grid-template-columns:1fr!important;text-align:center!important;padding:16px 13px!important;gap:12px!important}
  .profileHero>#avatarWrap{display:flex;justify-content:center}
  .profileHero>div:nth-child(2)>.row{justify-content:center!important}
  .profileHero .statsRow{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));width:100%!important;gap:8px!important}
  .profileHero .statpill{text-align:center;padding:9px 6px!important}
  #profileActions{width:100%!important;display:grid!important;grid-template-columns:1fr 1fr!important;gap:8px!important}
  #profileActions>*{width:100%!important;min-height:44px!important;display:flex!important;align-items:center!important;justify-content:center!important}
  #profileActions>*:first-child{grid-column:1/-1}
  .creatorSubscribeCard .between{display:grid!important;grid-template-columns:1fr!important;gap:12px!important}
  .creatorSubscribeCard .creator-sub-cta{width:100%!important;min-height:48px!important}
  .media{width:100%!important;height:auto!important;min-height:0!important;aspect-ratio:4/5!important}
  .media.small{aspect-ratio:16/10!important}.media.tiny{aspect-ratio:16/9!important}
  .thread{height:min(58dvh,520px)!important}
  body.vx-has-mobile-nav .composer{position:sticky;bottom:calc(var(--vx-bottom-bar) + env(safe-area-inset-bottom,0px));background:#0d0e11;z-index:6}
  .table,.tr{min-width:0!important}.tr{grid-template-columns:minmax(0,1fr)!important}.tr>*{min-width:0;word-break:break-word}
  .plans{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .methods{grid-template-columns:1fr!important}
  .feature{grid-template-columns:44px minmax(0,1fr)!important;padding:13px!important}
  .feature span,.sub,.metaSub,.caption{overflow-wrap:anywhere}
  input,.input,textarea,.textarea,select{font-size:16px!important}
  button,.btn,.cta,.follow,.smallbtn{touch-action:manipulation}

  .vx-mobile-top{display:flex;position:fixed;z-index:10020;left:0;right:0;top:0;height:var(--vx-mobile-bar);padding:8px 12px;padding-top:max(8px,env(safe-area-inset-top,0px));align-items:center;gap:10px;background:rgba(7,7,9,.96);border-bottom:1px solid rgba(255,255,255,.08);backdrop-filter:blur(18px)}
  .vx-mobile-logo{width:40px;height:40px;object-fit:contain;flex:0 0 40px}
  .vx-mobile-title{min-width:0;flex:1;font-weight:900;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-family:Georgia,serif;letter-spacing:.03em}
  .vx-mobile-menu{width:42px;height:42px;border-radius:12px;border:1px solid rgba(212,29,45,.34);background:#101116;color:#fff;font-size:22px}
  .vx-mobile-bottom{display:grid;position:fixed;z-index:10020;left:0;right:0;bottom:0;min-height:var(--vx-bottom-bar);padding:5px 6px max(6px,env(safe-area-inset-bottom,0px));grid-template-columns:repeat(5,1fr);background:rgba(8,8,11,.97);border-top:1px solid rgba(255,255,255,.08);backdrop-filter:blur(18px)}
  .vx-mobile-bottom a{min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;color:#aeb1ba;text-decoration:none;font-size:10px;font-weight:800;padding:4px 2px;border-radius:10px}
  .vx-mobile-bottom a.active{color:#fff;background:#14151a;box-shadow:inset 0 2px 0 #d41d2d}
  .vx-mobile-bottom .vx-icon{font-size:18px;line-height:1}
  .vx-mobile-backdrop{position:fixed;display:block;z-index:10025;inset:0;background:rgba(0,0,0,.58);opacity:0;pointer-events:none;transition:.2s}
  .vx-mobile-drawer{display:block;position:fixed;z-index:10030;top:0;bottom:0;right:0;width:min(86vw,340px);padding:18px 14px calc(18px + env(safe-area-inset-bottom,0px));background:#0c0d10;border-left:1px solid rgba(255,255,255,.09);transform:translateX(102%);transition:.22s ease;overflow:auto}
  .vx-mobile-drawer.open{transform:none}.vx-mobile-backdrop.open{opacity:1;pointer-events:auto}
  .vx-mobile-drawer-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:14px}.vx-mobile-drawer-head b{font:800 20px Georgia,serif}.vx-mobile-close{width:40px;height:40px;border-radius:11px;border:1px solid rgba(255,255,255,.1);background:#14151a;color:#fff;font-size:22px}
  .vx-mobile-drawer nav{display:grid;gap:7px}.vx-mobile-drawer nav a{display:flex;align-items:center;gap:10px;padding:13px;border-radius:12px;background:#111217;border:1px solid rgba(255,255,255,.06);color:#e7e8eb;text-decoration:none;font-weight:800}.vx-mobile-drawer nav a.active{border-color:rgba(212,29,45,.5);box-shadow:inset 3px 0 0 #d41d2d}
}

@media(max-width:520px){
  :root{--vx-mobile-bar:58px;--vx-bottom-bar:64px}
  .app{padding-left:6px!important;padding-right:6px!important}
  .profileHero .statsRow{grid-template-columns:1fr 1fr!important}
  #profileActions{grid-template-columns:1fr!important}#profileActions>*:first-child{grid-column:auto}
  .plans{grid-template-columns:1fr 1fr!important}
  .h1,h1{font-size:clamp(24px,8vw,34px)!important}.h2,h2{font-size:clamp(19px,6vw,25px)!important}
  .bubble{max-width:88%!important}
}

/* VYNEXA V76 — correction libellés menu mobile */
@media(max-width:900px){
  .vx-mobile-drawer{width:min(90vw,380px)!important;background:linear-gradient(180deg,#0a0b15,#080910)!important;border-left:1px solid rgba(137,95,255,.28)!important;box-shadow:-18px 0 55px rgba(0,0,0,.48)!important}
  .vx-mobile-drawer nav{display:grid!important;gap:9px!important}
  .vx-mobile-drawer nav a{display:grid!important;grid-template-columns:48px minmax(0,1fr)!important;align-items:center!important;gap:13px!important;min-height:62px!important;padding:9px 14px!important;border-radius:18px!important;background:linear-gradient(180deg,rgba(18,19,32,.98),rgba(12,13,23,.98))!important;border:1px solid rgba(137,95,255,.17)!important;color:#f7f5ff!important;text-decoration:none!important;font-weight:800!important;overflow:visible!important}
  .vx-mobile-drawer nav a.active{border-color:rgba(232,79,155,.52)!important;background:linear-gradient(90deg,rgba(107,65,255,.22),rgba(232,79,155,.12))!important;box-shadow:inset 4px 0 0 #e84f9b,0 10px 26px rgba(0,0,0,.25)!important}
  .vx-mobile-drawer nav a .vx-drawer-icon{display:grid!important;place-items:center!important;width:46px!important;height:46px!important;border-radius:15px!important;background:linear-gradient(135deg,rgba(115,70,255,.30),rgba(232,79,155,.18))!important;border:1px solid rgba(255,255,255,.07)!important;font-size:23px!important;line-height:1!important;color:#fff!important;visibility:visible!important;opacity:1!important}
  .vx-mobile-drawer nav a .vx-drawer-label{display:block!important;position:static!important;width:auto!important;height:auto!important;max-width:none!important;overflow:visible!important;clip:auto!important;clip-path:none!important;white-space:normal!important;visibility:visible!important;opacity:1!important;color:#f7f5ff!important;-webkit-text-fill-color:#f7f5ff!important;font-size:16px!important;line-height:1.25!important;font-weight:800!important;text-align:left!important;letter-spacing:.01em!important}
  .vx-mobile-drawer-head b{display:block!important;color:#fff!important;-webkit-text-fill-color:#fff!important;font-size:24px!important;visibility:visible!important;opacity:1!important}
}