/* AnomicFlip — Games / Rewards header dropdowns */
.nav { display: flex; gap: 14px; font-family: 'Archivo', system-ui, -apple-system, 'Segoe UI', sans-serif; }
.nav, .nav * { box-sizing: border-box; }
.nav-dd { position: relative; }
.nav-btn {
  display: inline-flex; align-items: center; gap: 12px;
  height: 54px; padding: 0 20px; border-radius: 8px; border: 1px solid;
  font: 800 19px 'Archivo', system-ui, sans-serif; color: #fff; cursor: pointer;
  transition: filter .15s;
}
.nav-btn:hover, .nav-dd.open .nav-btn { filter: brightness(1.15); }
.nav-btn:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
.nav-btn .ic { flex: none; width: 24px; height: 24px; }
.nav-btn .chev { flex: none; color: #c9ccd1; transition: transform .2s; }
.nav-dd.open .nav-btn .chev { transform: rotate(180deg); }
.nav-games   { background: #24473a; border-color: #2f8a5c; }
.nav-games .ic { color: #3fd68f; }
.nav-rewards { background: #4a4430; border-color: #8f7a35; }
.nav-rewards .ic { color: #f5c84a; }

.nav-menu {
  position: absolute; top: calc(100% + 10px); left: 0; z-index: 900; min-width: 230px;
  padding: 8px; display: grid; gap: 6px;
  background: #2a2d33; border: 1px solid #3a3f46; border-radius: 12px; box-shadow: 0 24px 60px rgba(0,0,0,.5);
  opacity: 0; visibility: hidden; transform: translateY(-6px);
  transition: opacity .15s, transform .15s, visibility 0s .15s;
}
.nav-dd.open .nav-menu { opacity: 1; visibility: visible; transform: none; transition: opacity .15s, transform .15s; }
.nav-item {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  height: 50px; padding: 0 16px; border-radius: 8px; background: #1f2226;
  color: #c9ccd1; font-size: 17px; font-weight: 700; text-decoration: none;
}
.nav-item:hover, .nav-item:focus-visible { background: #24272c; color: #fff; outline: none; }
.nav-item small { font-size: 11px; font-weight: 800; letter-spacing: .6px; text-transform: uppercase; color: #6b7078; }

@media (max-width: 1250px) { .nav-btn span { display: none; } .nav-btn { padding: 0 14px; } }
@media (max-width: 600px) { .nav { display: none; } }
@media (prefers-reduced-motion: reduce) { .nav-menu, .nav-btn .chev { transition: none; } }
