@media (max-width: 768px) {
  html, body {
    overflow-x: hidden;
  }

  body.mobile-nav-enabled header,
  body.mobile-nav-enabled .left-nav {
    display: none !important;
  }

  body.mobile-nav-enabled main {
    margin-left: 0 !important;
    width: 100% !important;
    max-width: none !important;
    padding: 10px 10px calc(108px + env(safe-area-inset-bottom, 0px)) !important;
    overflow-x: hidden;
  }

  body.mobile-nav-enabled .page-actions {
    display: none !important;
  }

  body.mobile-nav-enabled .card,
  body.mobile-nav-enabled .chart-card,
  body.mobile-nav-enabled .chart-block,
  body.mobile-nav-enabled .toolbar,
  body.mobile-nav-enabled .athlete-header,
  body.mobile-nav-enabled .calendar-shell,
  body.mobile-nav-enabled .ppr-block,
  body.mobile-nav-enabled .block,
  body.mobile-nav-enabled .recap-block,
  body.mobile-nav-enabled .workout-block,
  body.mobile-nav-enabled .sidebar,
  body.mobile-nav-enabled .decay-card,
  body.mobile-nav-enabled .kpi-groups,
  body.mobile-nav-enabled .filters,
  body.mobile-nav-enabled .pmc-block,
  body.mobile-nav-enabled .chart-wrap,
  body.mobile-nav-enabled .table-wrap {
    width: 100% !important;
    max-width: 100% !important;
  }

  /* Fond et menu « Plus » restent masqués : mobile-nav.js les affiche à l'ouverture. */
  body.mobile-nav-enabled .mobile-nav-bottom {
    display: block;
  }

  /* La bulle de messagerie recouvrait le bouton « Plus » : au-dessus de la barre, et masquée menu ouvert. */
  body.mobile-nav-enabled #wie-msg-root {
    right: 14px;
    bottom: calc(92px + env(safe-area-inset-bottom, 0px));
  }

  body.mobile-nav-enabled:has(.mobile-nav-more.active, .mobile-bottom-more.active) #wie-msg-root {
    display: none;
  }

  .mobile-nav-backdrop {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 320;
    background: rgba(5, 8, 18, 0.46);
  }

  .mobile-nav-sheet {
    display: none;
    position: fixed;
    left: 12px;
    right: 12px;
    bottom: calc(86px + env(safe-area-inset-bottom, 0px));
    z-index: 330;
    padding: 14px;
    border-radius: 22px;
    border: 1px solid rgba(77, 184, 255, 0.18);
    background: linear-gradient(180deg, rgba(13, 13, 26, 0.98), rgba(10, 10, 18, 0.99));
    box-shadow: 0 20px 44px rgba(0, 0, 0, 0.42);
  }

  .mobile-nav-sheet-title {
    font-size: 0.68rem;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: #69738d;
    font-weight: 800;
    margin-bottom: 12px;
  }

  .mobile-nav-athlete {
    margin-bottom: 12px;
  }

  .mobile-nav-dashboard-link {
    margin-bottom: 12px;
  }

  .mobile-nav-athlete-label {
    font-size: 0.66rem;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: #7f89a6;
    font-weight: 800;
    margin-bottom: 8px;
  }

  .mobile-nav-athlete-select {
    width: 100%;
    min-height: 44px;
    padding: 10px 12px;
    border-radius: 14px;
    border: 1px solid rgba(77, 184, 255, 0.12);
    background: rgba(255, 255, 255, 0.03);
    color: #dbe7ff;
    font-size: 0.82rem;
    font-weight: 700;
    appearance: none;
    -webkit-appearance: none;
  }

  .mobile-nav-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }

  .mobile-nav-sheet-link,
  .mobile-nav-sheet-action {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 10px 12px;
    border-radius: 14px;
    border: 1px solid rgba(77, 184, 255, 0.12);
    background: rgba(255, 255, 255, 0.03);
    color: #dbe7ff;
    text-decoration: none;
    font-size: 0.78rem;
    font-weight: 700;
    text-align: center;
    cursor: pointer;
  }

  .mobile-nav-sheet-action {
    width: 100%;
    appearance: none;
  }

  .mobile-nav-bottom {
    display: none;
    position: fixed;
    left: 12px;
    right: 12px;
    bottom: calc(10px + env(safe-area-inset-bottom, 0px));
    z-index: 340;
    padding: 10px 10px calc(10px + env(safe-area-inset-bottom, 0px));
    border-radius: 22px;
    border: 1px solid rgba(77, 184, 255, 0.18);
    background: linear-gradient(180deg, rgba(13, 13, 26, 0.96), rgba(10, 10, 18, 0.98));
    box-shadow: 0 18px 36px rgba(0, 0, 0, 0.34);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
  }

  .mobile-nav-bottom-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 6px;
  }

  .mobile-nav-link,
  .mobile-nav-more {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    text-decoration: none;
    background: transparent;
    border: 0;
    color: #7d86a2;
    padding: 8px 4px;
    border-radius: 14px;
    font-size: 0.64rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    cursor: pointer;
  }

  .mobile-nav-link svg,
  .mobile-nav-more svg {
    width: 18px;
    height: 18px;
    stroke: currentColor;
    fill: none;
    stroke-width: 2;
  }

  .mobile-nav-link.active,
  .mobile-nav-more.active {
    color: #eaf2ff;
    background: rgba(77, 184, 255, 0.16);
    box-shadow: inset 0 0 0 1px rgba(77, 184, 255, 0.28);
  }

  [data-theme="light"] .mobile-nav-bottom {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.97), rgba(244, 247, 252, 0.98));
    border-color: rgba(48, 67, 111, 0.10);
    box-shadow: 0 18px 36px rgba(15, 23, 42, 0.12);
  }

  [data-theme="light"] .mobile-nav-link,
  [data-theme="light"] .mobile-nav-more {
    color: #6b7280;
  }

  [data-theme="light"] .mobile-nav-link.active,
  [data-theme="light"] .mobile-nav-more.active {
    color: #30436f;
    background: #dfe8ff;
  }

  [data-theme="light"] .mobile-nav-sheet {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.99), rgba(244, 247, 252, 0.99));
    border-color: rgba(48, 67, 111, 0.10);
    box-shadow: 0 20px 44px rgba(15, 23, 42, 0.12);
  }

  [data-theme="light"] .mobile-nav-sheet-title {
    color: #6b7280;
  }

  [data-theme="light"] .mobile-nav-athlete-label {
    color: #6b7280;
  }

  [data-theme="light"] .mobile-nav-athlete-select {
    background: #ffffff;
    border-color: #dde3f0;
    color: #30436f;
  }

  [data-theme="light"] .mobile-nav-sheet-link,
  [data-theme="light"] .mobile-nav-sheet-action {
    background: #ffffff;
    border-color: #dde3f0;
    color: #30436f;
  }

  @supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
    .mobile-nav-bottom {
      background: rgba(10, 10, 18, 0.99);
    }

    [data-theme="light"] .mobile-nav-bottom {
      background: rgba(244, 247, 252, 0.99);
    }
  }
}

/* Panneau encore flottant (plein écran sous 600 px) : la bulle remontée lui prend de la hauteur. */
@media (min-width: 601px) and (max-width: 768px) {
  body.mobile-nav-enabled .wie-msg-panel {
    height: min(650px, calc(100vh - 182px));
  }
}