/* ── HAMBURGER ── */
.hbg-drawer{position:fixed;top:0;left:0;bottom:0;width:300px;background:#06060e;border-right:1px solid rgba(245,200,66,.15);z-index:1100;transform:translateX(-100%);transition:transform .28s cubic-bezier(.4,0,.2,1);display:flex;flex-direction:column;overflow-y:auto;overflow-x:hidden;}
.hbg-drawer.open{transform:translateX(0);}
.hbg-drawer-head{background:linear-gradient(135deg,#0d0d1a,#1a0a2e);padding:20px 16px 16px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(245,200,66,.15);flex-shrink:0;}
.hbg-drawer-logo-wrap{display:flex;align-items:center;gap:10px;}
.hbg-drawer-icon{width:38px;height:38px;border-radius:50%;background:linear-gradient(135deg,#F5C842,#E0A820);display:flex;align-items:center;justify-content:center;font-size:20px;flex-shrink:0;}
.hbg-drawer-logo{font-family:'Bebas Neue',sans-serif;font-size:18px;color:#F5C842;letter-spacing:1px;line-height:1.1;}
.hbg-drawer-sub{font-size:10px;color:rgba(255,255,255,.35);margin-top:1px;}
.hbg-close{width:30px;height:30px;border-radius:50%;background:rgba(255,255,255,.08);border:none;color:rgba(255,255,255,.5);font-size:15px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .15s;}
.hbg-close:hover{background:rgba(255,76,76,.2);color:#ff4c4c;}
.hbg-nav{padding:14px 12px;flex:1;display:flex;flex-direction:column;gap:14px;}
.hbg-section-label{font-size:10px;color:rgba(245,200,66,.5);font-weight:700;text-transform:uppercase;letter-spacing:1.5px;padding:0 6px;}
.hbg-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px;}
.hbg-grid-btn{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.07);border-radius:12px;padding:11px 8px;display:flex;flex-direction:column;align-items:center;gap:5px;cursor:pointer;transition:all .2s;font-family:var(--font-b);width:100%;}
.hbg-grid-btn:hover{background:rgba(245,200,66,.08);border-color:rgba(245,200,66,.2);}
.hbg-grid-btn span:first-child{font-size:22px;}
.hbg-grid-btn span:last-child{font-size:11px;font-weight:700;color:rgba(255,255,255,.75);}
.hbg-grid-btn.active{background:rgba(245,200,66,.1);border-color:rgba(245,200,66,.3);}
.hbg-grid-btn.active span:last-child{color:#F5C842;}
.hbg-list{display:flex;flex-direction:column;gap:3px;}
.hbg-list-btn{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:11px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.05);cursor:pointer;transition:all .15s;font-family:var(--font-b);width:100%;text-align:left;}
.hbg-list-btn:hover{background:rgba(245,200,66,.07);border-color:rgba(245,200,66,.15);}
.hbg-list-btn.active{background:rgba(245,200,66,.1);border-color:rgba(245,200,66,.25);}
.hbg-list-icon{font-size:18px;width:24px;text-align:center;flex-shrink:0;}
.hbg-list-name{font-size:13px;font-weight:600;color:rgba(255,255,255,.8);flex:1;}
.hbg-list-btn.active .hbg-list-name{color:#F5C842;}
.hbg-list-badge{font-size:10px;font-weight:700;padding:2px 8px;border-radius:50px;}
.hbg-badge-gold{background:rgba(245,200,66,.1);color:#F5C842;}
.hbg-badge-green{width:8px;height:8px;border-radius:50%;background:#22c55e;}
.hbg-bottom-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;}
.hbg-bottom-btn{padding:10px 6px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.06);border-radius:10px;text-align:center;cursor:pointer;transition:all .2s;font-family:var(--font-b);}
.hbg-bottom-btn:hover{background:rgba(245,200,66,.07);border-color:rgba(245,200,66,.15);}
.hbg-bottom-btn-icon{font-size:20px;margin-bottom:3px;}
.hbg-bottom-btn-label{font-size:10px;font-weight:700;color:rgba(255,255,255,.5);}
.hbg-bottom-btn.gold .hbg-bottom-btn-label{color:#F5C842;}
.hbg-bottom-btn.gold{background:rgba(245,200,66,.08);border-color:rgba(245,200,66,.2);}
.hbg-btn{display:none;width:38px;height:38px;border-radius:10px;background:transparent;border:1px solid rgba(255,255,255,.15);color:#fff;font-size:18px;cursor:pointer;align-items:center;justify-content:center;flex-shrink:0;transition:all .2s;}
.hbg-btn:hover{background:rgba(245,200,66,.1);border-color:rgba(245,200,66,.3);color:#F5C842;}


.hbg-btn{ display:flex; }

/* Safe area iOS — uniquement en mode PWA installé */
@media all and (display-mode: standalone) {
  body {
    padding-top: env(safe-area-inset-top);
    background-color: #06060e;
  }
  .header {
    top: env(safe-area-inset-top);
    padding-top: 0;
  }
  #mainContent {
    margin-top: env(safe-area-inset-top);
  }
  .mobile-dock {
    padding-bottom: env(safe-area-inset-bottom);
  }
}

/* Hors PWA — pas de padding supplémentaire */
body {
  background-color: #06060e;
}
.header {
  top: 0;
  background-color: #06060e;
}