:root {
  --nav-bg: rgba(20, 20, 36, 0.95);
  --nav-border: rgba(255, 255, 255, 0.16);
  --nav-link: #f4f4f7;
  --nav-link-active: #80d8ff;
  --nav-height: 64px;

  /* Theme-able variables (Default Light) */
  --bg-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  --card-bg: #ffffff;
  --text-primary: #333333;
  --text-secondary: #666666;
  --accent-color: #667eea;
  --accent-hover: #764ba2;
  --border-color: #eeeeee;
  --input-bg: #ffffff;
  --input-border: #cccccc;
  --status-bg: #ffffff;
  --stat-bg: #f5f5f5;
  --stat-value-color: #667eea;
  --badge-bg: #f5f5f5;
  --badge-border: #dddddd;
  --badge-unlocked-bg: #e8f5e9;
  --badge-unlocked-border: #4caf50;
  --shadow-color: rgba(0, 0, 0, 0.1);
  --footer-text: #ffffff;
  --link-color: #000033;
  --footer-link: #000051;
  --footer-card-link: #3949ab;
  --card-gradient: linear-gradient(135deg, #101227 0%, #28345f 100%);
  --card-hover-gradient: linear-gradient(135deg, #1e293b 0%, #334155 50%, #1e293b 100%);
  --summary-shell-bg: rgba(255, 255, 255, 0.24);
  --summary-shell-border: rgba(255, 255, 255, 0.22);
  --summary-shell-shadow: 0 20px 60px rgba(31, 38, 135, 0.24);
}

/* Explicit Light Themes */
[data-theme="light-original"] {
  --nav-bg: rgba(20, 20, 36, 0.95);
  --bg-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  --accent-color: #667eea;
  --accent-hover: #764ba2;
  --link-color: #283593;
  --footer-text: #ffffff;
  --footer-link: #1a237e;
  --footer-card-link: #3f51b5;
  --card-gradient: linear-gradient(135deg, #101227 0%, #28345f 100%);
  --card-hover-gradient: linear-gradient(135deg, #1e293b 0%, #334155 50%, #1e293b 100%);
}

[data-theme="light-emerald"] {
  --nav-bg: rgba(4, 60, 43, 0.95);
  --bg-gradient: linear-gradient(135deg, #10b981 0%, #047857 100%);
  --accent-color: #10b981;
  --accent-hover: #059669;
  --stat-value-color: #10b981;
  --link-color: #064e3b;
  --footer-text: #ffffff;
  --footer-link: #022c22;
  --footer-card-link: #059669;
  --card-gradient: linear-gradient(135deg, #064e3b 0%, #065f46 100%);
  --card-hover-gradient: linear-gradient(135deg, #065f46 0%, #10b981 50%, #065f46 100%);
}

[data-theme="light-sunset"] {
  --nav-bg: rgba(80, 20, 40, 0.95);
  --bg-gradient: linear-gradient(135deg, #f97316 0%, #db2777 100%);
  --accent-color: #db2777;
  --accent-hover: #be185d;
  --stat-value-color: #db2777;
  --link-color: #9a3412;
  --footer-text: #ffffff;
  --footer-link: #450a0a;
  --footer-card-link: #db2777;
  --card-gradient: linear-gradient(135deg, #450a0a 0%, #701a75 100%);
  --card-hover-gradient: linear-gradient(135deg, #701a75 0%, #f97316 50%, #701a75 100%);
}

[data-theme="light-ocean"] {
  --nav-bg: rgba(7, 89, 133, 0.95);
  --bg-gradient: linear-gradient(135deg, #0ea5e9 0%, #2563eb 100%);
  --accent-color: #0ea5e9;
  --accent-hover: #0284c7;
  --stat-value-color: #0ea5e9;
  --link-color: #1e3a8a;
  --footer-text: #ffffff;
  --footer-link: #0c4a6e;
  --footer-card-link: #0284c7;
  --card-gradient: linear-gradient(135deg, #0c4a6e 0%, #075985 100%);
  --card-hover-gradient: linear-gradient(135deg, #075985 0%, #0ea5e9 50%, #075985 100%);
}

[data-theme="light-rose"] {
  --nav-bg: rgba(159, 18, 57, 0.95);
  --bg-gradient: linear-gradient(135deg, #fb7185 0%, #e11d48 100%);
  --accent-color: #e11d48;
  --accent-hover: #be123c;
  --stat-value-color: #e11d48;
  --link-color: #9f1239;
  --footer-text: #ffffff;
  --footer-link: #4c0519;
  --footer-card-link: #be123c;
  --card-gradient: linear-gradient(135deg, #4c0519 0%, #831843 100%);
  --card-hover-gradient: linear-gradient(135deg, #831843 0%, #fb7185 50%, #831843 100%);
}

/* Explicit Dark Themes */
[data-theme="dark-original"] {
  --nav-bg: rgba(10, 10, 20, 0.98);
  --bg-gradient: linear-gradient(135deg, #1a237e 0%, #311b92 100%);
  --card-bg: #1a1a1a;
  --text-primary: #e0e0e0;
  --text-secondary: #aaaaaa;
  --accent-color: #5c9df5;
  --accent-hover: #7c4dff;
  --link-color: #80d8ff;
  --footer-text: #ffffff;
  --footer-link: #80d8ff;
  --footer-card-link: #80d8ff;
  --border-color: #333333;
  --input-bg: #2d2d2d;
  --input-border: #444444;
  --status-bg: #1a1a1a;
  --stat-bg: #252525;
  --stat-value-color: #5c9df5;
  --badge-bg: #2d0a0a;

  --badge-border: #444444;
  --badge-unlocked-bg: #1b5e20;
  --badge-unlocked-border: #4caf50;
  --shadow-color: rgba(0, 0, 0, 0.5);
  --card-gradient: linear-gradient(135deg, #101227 0%, #28345f 100%);
  --card-hover-gradient: linear-gradient(135deg, #1e293b 0%, #334155 50%, #1e293b 100%);
  --summary-shell-bg: var(--card-bg);
  --summary-shell-border: var(--border-color);
  --summary-shell-shadow: 0 4px 12px var(--shadow-color);
}

[data-theme="dark-forest"] {
  --nav-bg: rgba(10, 30, 20, 0.98);
  --bg-gradient: linear-gradient(135deg, #064e3b 0%, #022c22 100%);
  --card-bg: #0b1a16;
  --text-primary: #ecfdf5;
  --text-secondary: #6ee7b7;
  --accent-color: #10b981;
  --accent-hover: #059669;
  --link-color: #6ee7b7;
  --footer-text: #ecfdf5;
  --footer-link: #6ee7b7;
  --footer-card-link: #6ee7b7;
  --border-color: #064e3b;
  --input-bg: #064e3b;
  --input-border: #065f46;
  --status-bg: #0b1a16;
  --stat-bg: #064e3b;
  --stat-value-color: #34d399;
  --badge-bg: #064e3b;
  --badge-border: #065f46;
  --badge-unlocked-bg: #065f46;
  --badge-unlocked-border: #10b981;
  --shadow-color: rgba(0, 0, 0, 0.6);
  --card-gradient: linear-gradient(135deg, #020617 0%, #064e3b 100%);
  --card-hover-gradient: linear-gradient(135deg, #064e3b 0%, #10b981 50%, #064e3b 100%);
  --summary-shell-bg: var(--card-bg);
  --summary-shell-border: var(--border-color);
  --summary-shell-shadow: 0 4px 12px var(--shadow-color);
}

[data-theme="dark-midnight"] {
  --nav-bg: rgba(2, 6, 23, 0.98);
  --bg-gradient: linear-gradient(135deg, #0f172a 0%, #000000 100%);
  --card-bg: #020617;
  --text-primary: #f1f5f9;
  --text-secondary: #94a3b8;
  --accent-color: #38bdf8;
  --accent-hover: #0ea5e9;
  --link-color: #38bdf8;
  --footer-text: #f1f5f9;
  --footer-link: #38bdf8;
  --footer-card-link: #38bdf8;
  --border-color: #1e293b;
  --input-bg: #1e293b;
  --input-border: #334155;
  --status-bg: #020617;
  --stat-bg: #1e293b;
  --stat-value-color: #38bdf8;
  --badge-bg: #1e293b;
  --badge-border: #334155;
  --badge-unlocked-bg: #0c4a6e;
  --badge-unlocked-border: #0ea5e9;
  --shadow-color: rgba(0, 0, 0, 0.8);
  --card-gradient: linear-gradient(135deg, #000000 0%, #1e293b 100%);
  --card-hover-gradient: linear-gradient(135deg, #1e293b 0%, #38bdf8 50%, #1e293b 100%);
  --summary-shell-bg: var(--card-bg);
  --summary-shell-border: var(--border-color);
  --summary-shell-shadow: 0 4px 12px var(--shadow-color);
}

[data-theme="dark-cyber"] {
  --nav-bg: rgba(13, 0, 26, 0.98);
  --bg-gradient: linear-gradient(135deg, #2d004d 0%, #000000 100%);
  --card-bg: #0d001a;
  --text-primary: #fdf4ff;
  --text-secondary: #d8b4fe;
  --accent-color: #00b2ab;
  --accent-hover: #00c4bc;
  --link-color: #00d9d1;
  --footer-text: #fdf4ff;
  --footer-link: #00d9d1;
  --footer-card-link: #00d9d1;
  --border-color: #2d004d;
  --input-bg: #1a0033;
  --input-border: #00d9d1;
  --status-bg: #0d001a;
  --stat-bg: #1a0033;
  --stat-value-color: #00d9d1;
  --badge-bg: #1a0033;
  --badge-border: #2d004d;
  --badge-unlocked-bg: #4a044e;
  --badge-unlocked-border: #00d9d1;
  --shadow-color: rgba(162, 28, 175, 0.2);
  --card-gradient: linear-gradient(135deg, #1a0033 0%, #4a044e 100%);
  --card-hover-gradient: linear-gradient(135deg, #4a044e 0%, #00d9d1 50%, #4a044e 100%);
  --summary-shell-bg: var(--card-bg);
  --summary-shell-border: var(--border-color);
  --summary-shell-shadow: 0 4px 12px var(--shadow-color);
}

[data-theme="dark-sunset"] {
  --nav-bg: rgba(30, 10, 10, 0.98);
  --bg-gradient: linear-gradient(135deg, #450a0a 0%, #701a75 100%);
  --card-bg: #1a0a0a;
  --text-primary: #fecaca;
  --text-secondary: #fca5a5;
  --accent-color: #f87171;
  --accent-hover: #ef4444;
  --link-color: #fca5a5;
  --footer-text: #fecaca;
  --footer-link: #fca5a5;
  --footer-card-link: #fca5a5;
  --border-color: #450a0a;
  --input-bg: #2d0a0a;
  --input-border: #7f1d1d;
  --status-bg: #1a0a0a;
  --stat-bg: #450a0a;
  --stat-value-color: #f87171;
  --badge-bg: #2d0a0a;

  --badge-border: #7f1d1d;
  --badge-unlocked-bg: #7f1d1d;
  --badge-unlocked-border: #ef4444;
  --shadow-color: rgba(0, 0, 0, 0.7);
  --card-gradient: linear-gradient(135deg, #1a0a0a 0%, #450a0a 100%);
  --card-hover-gradient: linear-gradient(135deg, #450a0a 0%, #f87171 50%, #450a0a 100%);
  --summary-shell-bg: var(--card-bg);
  --summary-shell-border: var(--border-color);
  --summary-shell-shadow: 0 4px 12px var(--shadow-color);
}

/* Neon Themes */
[data-theme="neon-forest"] {
  --nav-bg: rgba(0, 10, 0, 0.98);
  --bg-gradient: linear-gradient(135deg, #001a00 0%, #000000 100%);
  --card-bg: #000500;
  --text-primary: #f0fff0;
  --text-secondary: #39ff14;
  --accent-color: #00cc00;
  --accent-hover: #00cc00;
  --border-color: #003300;
  --input-bg: #001a00;
  --input-border: #00cc00;
  --status-bg: #000500;
  --stat-bg: #001a00;
  --stat-value-color: #00cc00;
  --badge-bg: #001a00;
  --badge-border: #003300;
  --badge-unlocked-bg: #004400;
  --badge-unlocked-border: #00cc00;
  --shadow-color: rgba(0, 255, 0, 0.2);
  --link-color: #39ff14;
  --footer-text: #f0fff0;
  --footer-link: #39ff14;
  --footer-card-link: #39ff14;
  --card-gradient: linear-gradient(135deg, #000000 0%, #002200 100%);
  --card-hover-gradient: linear-gradient(135deg, #002200 0%, #00cc00 50%, #002200 100%);
  --summary-shell-bg: var(--card-bg);
  --summary-shell-border: var(--border-color);
  --summary-shell-shadow: 0 0 15px rgba(0, 255, 0, 0.15);
}

[data-theme="neon-sunset"] {
  --nav-bg: rgba(15, 0, 0, 0.98);
  --bg-gradient: linear-gradient(135deg, #1a0000 0%, #000000 100%);
  --card-bg: #0a0000;
  --text-primary: #fff0f0;
  --text-secondary: #e62c2c;
  --accent-color: #b30000;
  --accent-hover: #cc0000;
  --border-color: #330000;
  --input-bg: #1a0000;
  --input-border: #b30000;
  --status-bg: #0a0000;
  --stat-bg: #1a0000;
  --stat-value-color: #b30000;
  --badge-bg: #1a0000;
  --badge-border: #330000;
  --badge-unlocked-bg: #440000;
  --badge-unlocked-border: #b30000;
  --shadow-color: rgba(230, 0, 0, 0.2);
  --link-color: #ff5555;
  --footer-text: #fff0f0;
  --footer-link: #ff5555;
  --footer-card-link: #ff5555;
  --card-gradient: linear-gradient(135deg, #000000 0%, #220000 100%);
  --card-hover-gradient: linear-gradient(135deg, #220000 0%, #b30000 50%, #220000 100%);
  --summary-shell-bg: var(--card-bg);
  --summary-shell-border: var(--border-color);
  --summary-shell-shadow: 0 0 15px rgba(230, 0, 0, 0.15);
}

[data-theme="neon-midnight"] {
  --nav-bg: rgba(0, 0, 10, 0.98);
  --bg-gradient: linear-gradient(135deg, #00001a 0%, #000000 100%);
  --card-bg: #000005;
  --text-primary: #f0faff;
  --text-secondary: #00b2b2;
  --accent-color: #00b2b2;
  --accent-hover: #00cccc;
  --border-color: #001a33;
  --input-bg: #00001a;
  --input-border: #00b2b2;
  --status-bg: #000005;
  --stat-bg: #00001a;
  --stat-value-color: #00b2b2;
  --link-color: #00fafa;
  --footer-text: #f0faff;
  --footer-link: #00fafa;
  --footer-card-link: #00fafa;
  --badge-bg: #00001a;
  --badge-border: #001a33;
  --badge-unlocked-bg: #003344;
  --badge-unlocked-border: #00b2b2;
  --shadow-color: rgba(0, 229, 229, 0.25);
  --footer-text: #f0faff;
  --card-gradient: linear-gradient(135deg, #000000 0%, #000022 100%);
  --card-hover-gradient: linear-gradient(135deg, #000022 0%, #00b2b2 50%, #000022 100%);
  --summary-shell-bg: var(--card-bg);
  --summary-shell-border: var(--border-color);
  --summary-shell-shadow: 0 0 15px rgba(0, 229, 229, 0.2);
}

[data-theme="dark-cyber-muted"] {
  --nav-bg: rgba(20, 0, 36, 0.98);
  --bg-gradient: linear-gradient(135deg, #0f001a 0%, #1a002e 100%);
  --card-bg: #12001f;
  --text-primary: #f3e8ff;
  --text-secondary: #c77dff;
  --accent-color: #9d4edd;
  --accent-hover: #7b2cbf;
  --border-color: #2d004d;
  --input-bg: #0f001a;
  --input-border: #5a189a;
  --status-bg: #12001f;
  --stat-bg: #0f001a;
  --stat-value-color: #9d4edd;
  --badge-bg: #0f001a;
  --badge-border: #2d004d;
  --badge-unlocked-bg: #3c096c;
  --badge-unlocked-border: #9d4edd;
  --shadow-color: rgba(0, 0, 0, 0.4);
  --link-color: #c77dff;
  --footer-text: #f3e8ff;
  --footer-link: #f3e8ff;
  --footer-card-link: #c77dff;
  --card-gradient: linear-gradient(135deg, #0f001a 0%, #2d004d 100%);
  --card-hover-gradient: linear-gradient(135deg, #2d004d 0%, #9d4edd 50%, #2d004d 100%);
  --summary-shell-bg: var(--card-bg);
  --summary-shell-border: var(--border-color);
  --summary-shell-shadow: 0 4px 12px var(--shadow-color);
}

/* Dark Mode - Automatic based on system preference */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme]) {
    --nav-bg: rgba(10, 10, 20, 0.98);
    --bg-gradient: linear-gradient(135deg, #1a237e 0%, #311b92 100%);
    --card-bg: #1a1a1a;
    --text-primary: #e0e0e0;
    --text-secondary: #aaaaaa;
    --accent-color: #5c9df5;
    --accent-hover: #7c4dff;
    --border-color: #333333;
    --input-bg: #2d2d2d;
    --input-border: #444444;
    --status-bg: #1a1a1a;
    --stat-bg: #252525;
    --stat-value-color: #5c9df5;
    --badge-bg: #2d0a0a;

    --badge-border: #444444;
    --badge-unlocked-bg: #1b5e20;
    --badge-unlocked-border: #4caf50;
    --shadow-color: rgba(0, 0, 0, 0.5);
    --link-color: #80d8ff;
    --footer-text: #e0e0e0;
    --footer-link: #80d8ff;
    --footer-card-link: #80d8ff;
    --card-gradient: linear-gradient(135deg, #101227 0%, #28345f 100%);
    --card-hover-gradient: linear-gradient(135deg, #1e293b 0%, #334155 50%, #1e293b 100%);
    --summary-shell-bg: var(--card-bg);
    --summary-shell-border: var(--border-color);
    --summary-shell-shadow: 0 4px 12px var(--shadow-color);
  }
}

.common-nav {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1200;
  background: rgba(20, 20, 36, 0.95);
  background: var(--nav-bg);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  border-bottom: 1px solid var(--nav-border);
}

.common-nav-inner {
  max-width: 1400px;
  margin: 0 auto;
  min-height: var(--nav-height);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 10px 16px;
}

.common-nav-brand {
  color: #fff;
  text-decoration: none;
  font-weight: 700;
  font-size: 15px;
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 6px;
}

.beta-label {
  background: #ff4757;
  color: #fff;
  font-size: 10px;
  font-weight: 800;
  padding: 2px 6px;
  border-radius: 6px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  line-height: 1;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

.common-nav-links {
  display: flex;
  align-items: center;
  gap: 12px;
}

.common-nav-links a,
.common-nav-menu-links a {
  color: var(--nav-link);
  text-decoration: none;
  font-size: 14px;
  font-weight: 600;
  padding: 6px 10px;
  border-radius: 8px;
  transition: background-color 0.2s, color 0.2s;
}

.common-nav-links a:hover,
.common-nav-menu-links a:hover {
  background: rgba(255, 255, 255, 0.1);
}

.disabled-link {
  opacity: 0.5 !important;
  cursor: not-allowed !important;
}

.common-nav-links a.common-nav-profile-link {
  margin-left: auto;
}

.common-nav-profile-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  max-width: 260px;
  position: relative;
}

.common-nav-profile-trigger {
  display: flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
}

.common-nav-profile-chevron {
  font-size: 8px;
  opacity: 0.6;
  transition: transform 0.2s;
}

.common-nav-profile-link.dropdown-open .common-nav-profile-chevron {
  transform: rotate(180deg);
}

.common-nav-profile-dropdown {
  position: absolute;
  top: 100%;
  right: 0;
  background: #1a1a2e;
  border: 1px solid var(--nav-border);
  border-radius: 12px;
  min-width: 180px;
  padding: 8px;
  display: none;
  flex-direction: column;
  gap: 4px;
  box-shadow: 0 10px 25px rgba(0,0,0,0.5);
  margin-top: 8px;
}

.common-nav-profile-link.dropdown-open .common-nav-profile-dropdown {
  display: flex;
}

@media (min-width: 901px) {
  .common-nav-profile-link:hover .common-nav-profile-dropdown {
    display: flex;
  }
  .common-nav-profile-link:hover .common-nav-profile-chevron {
    transform: rotate(180deg);
  }
}

.common-nav-profile-dropdown::before {
  content: '';
  position: absolute;
  top: -12px;
  left: 0;
  right: 0;
  height: 12px;
}

.common-nav-profile-dropdown a {
  padding: 10px 14px;
  font-size: 13px;
  display: block;
}

.common-nav-profile-dropdown hr {
  border: none;
  border-top: 1px solid var(--nav-border);
  margin: 4px 0;
}

.common-nav-profile-avatar {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  overflow: hidden;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, #ff006e 0%, #8338ec 100%);
  font-size: 14px;
  line-height: 1;
  flex-shrink: 0;
}

.common-nav-profile-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.common-nav-profile-name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.common-nav-toggle {
  display: none;
  border: 1px solid rgba(255, 255, 255, 0.25);
  background: rgba(255, 255, 255, 0.1);
  color: #fff;
  width: 40px;
  height: 40px;
  border-radius: 10px;
  cursor: pointer;
  align-items: center;
  justify-content: center;
  font-size: 20px;
}

.common-nav-menu {
  position: fixed;
  inset: 0;
  z-index: 2000;
  display: none;
}

.common-nav-menu.open {
  display: block;
}

.common-nav-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.45);
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
}

.common-nav-menu-panel {
  position: absolute;
  top: 0;
  right: 0;
  width: min(82vw, 320px);
  height: 100%;
  background: #171826 !important;
  background: rgba(23, 24, 38, 0.98) !important;
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  border-left: 1px solid rgba(255, 255, 255, 0.1);
  padding: 16px;
  transform: translateX(100%);
  transition: transform 0.25s ease;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.common-nav-menu.open .common-nav-menu-panel {
  transform: translateX(0);
}

.common-nav-menu-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.common-nav-menu-title {
  color: var(--nav-link);
  font-weight: 700;
  font-size: 16px;
}

.common-nav-close {
  border: 1px solid rgba(255, 255, 255, 0.25);
  background: rgba(255, 255, 255, 0.1);
  color: #fff;
  width: 36px;
  height: 36px;
  border-radius: 8px;
  cursor: pointer;
  font-size: 20px;
  line-height: 1;
}

.common-nav-menu-links {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 6px;
}

.common-nav-menu-links .common-nav-profile-link {
  max-width: 100%;
}

.common-nav-menu-panel .common-nav-profile-trigger {
  padding: 6px 10px;
}

.common-nav-menu-panel .common-nav-profile-dropdown {
  position: static;
  display: flex;
  background: transparent;
  border: none;
  box-shadow: none;
  margin-top: 0;
  padding-left: 24px;
}

.common-nav-menu-panel .common-nav-profile-chevron {
  display: none;
}

body.with-common-nav {
  padding-top: max(84px, calc(64px + env(safe-area-inset-top)));
}

@media (max-width: 900px) {
  .common-nav-links {
    display: none;
  }

  .common-nav-toggle {
    display: inline-flex;
  }
}