:root{
  /* fallback */
  --accent: var(--accent, #2563eb);
}

/* Hamburger only on mobile */
.mnav-burger{
  display:none;
  width:42px;height:42px;
  border-radius:12px;
  border:1px solid var(--line, #e5e7eb);
  background: var(--card, #fff);
  cursor:pointer;
  align-items:center;
  justify-content:center;
  flex: 0 0 auto;
}
.mnav-burger svg{width:18px;height:18px}

@media (max-width:640px){
  .mnav-burger{display:flex;}
  /* common desktop nav blocks to hide on mobile */
  .nav-links{display:none !important;}
  .nav-tabs{display:none !important;}
  .userbox{display:none !important;}
  .user-badge{display:none !important;}
}

/* Off-canvas sidebar */
.mnav-overlay{
  position:fixed;inset:0;
  background:rgba(15,23,42,.45);
  display:none;
  z-index:90;
}
.mnav-side{
  position:fixed;top:0;left:0;height:100vh;width:min(320px,86vw);
  background: var(--card, #fff);
  border-right:1px solid var(--line, #e5e7eb);
  box-shadow:0 24px 60px rgba(2,6,23,.18);
  transform:translateX(-110%);
  transition:transform .2s ease;
  z-index:100;
  padding:18px 16px;
  display:flex;flex-direction:column;gap:12px;
}
html.mnav-open .mnav-overlay{display:block;}
html.mnav-open .mnav-side{transform:translateX(0);}

.mnav-brand{display:flex;align-items:center;gap:10px;padding:8px;border-radius:14px;color:inherit;text-decoration:none}
.mnav-brand:hover{background:rgba(2,6,23,.03)}
.mnav-icon{width:42px;height:42px;border-radius:14px;background:linear-gradient(135deg,var(--accent),#60a5fa);display:grid;place-items:center;color:#fff;font-weight:900}
.mnav-user{font-size:13px;color:#334155}

.mnav-login{
  display:block;width:100%;
  background:var(--accent);
  border:2px solid var(--accent);
  color:#fff;
  border-radius:10px;
  padding:10px 14px;
  font-weight:800;
  text-align:center;
  text-decoration:none;
}
.mnav-links{display:flex;flex-direction:column;gap:6px;margin-top:6px}
.mnav-link{padding:10px 12px;border-radius:14px;border:1px solid transparent;color:inherit;text-decoration:none}
.mnav-link:hover{background:rgba(2,6,23,.03);border-color:rgba(2,6,23,.04)}
.mnav-link.active{background:rgba(37,99,235,.10);border-color:rgba(37,99,235,.18);color:var(--accent)}
.mnav-foot{margin-top:auto;font-size:12px;color:var(--text-muted,#64748b);padding:8px 12px}