/* Sidebar-only scrollbar hiding: keep scrolling enabled, hide all scrollbar chrome. */

.mn-desktop-sidebar-nav,
.app-sidebar-nav {
  overflow-y: auto;
  overflow-x: hidden;
  scrollbar-width: none;
  -ms-overflow-style: none;
  padding-right: 0;
  box-sizing: border-box;
  scroll-behavior: smooth;
}

.mn-desktop-sidebar-nav::-webkit-scrollbar,
.app-sidebar-nav::-webkit-scrollbar {
  width: 0;
  height: 0;
}

.mn-desktop-sidebar-nav::-webkit-scrollbar-track,
.app-sidebar-nav::-webkit-scrollbar-track {
  background: transparent;
}

.mn-desktop-sidebar-nav::-webkit-scrollbar-thumb,
.app-sidebar-nav::-webkit-scrollbar-thumb {
  background: transparent;
}

/* Safety guard if scrolling is delegated to the outer sidebar wrapper. */
.mn-desktop-sidebar,
.app-sidebar {
  scrollbar-width: none;
  -ms-overflow-style: none;
  box-sizing: border-box;
}

.mn-desktop-sidebar::-webkit-scrollbar,
.app-sidebar::-webkit-scrollbar {
  width: 0;
  height: 0;
}

.mn-desktop-sidebar::-webkit-scrollbar-track,
.app-sidebar::-webkit-scrollbar-track {
  background: transparent;
}

.mn-desktop-sidebar::-webkit-scrollbar-thumb,
.app-sidebar::-webkit-scrollbar-thumb {
  background: transparent;
}


/* ════════════════════════════════════════════════════════════════════
   VALORY  ·  Accent glow (Phase 2)
   Applied to specific surfaces only. Overuse kills the effect.
   ════════════════════════════════════════════════════════════════════ */

/* 1. Primary CTAs on hover. */
.mn-btn-primary,
.start-btn,
.action-btn,
.hero-cta,
.btn-grad {
  transition: box-shadow var(--duration-base) var(--ease-out),
              transform   var(--duration-fast) var(--ease-out);
}
.mn-btn-primary:hover,
.start-btn:hover,
.action-btn:hover,
.hero-cta:hover,
.btn-grad:hover {
  box-shadow: var(--glow-accent);
}

/* 2. Active sidebar item. */
.mn-desktop-link.is-active,
.mn-desktop-link[aria-current="page"] {
  background: var(--accent-soft);
  border: 1px solid var(--border-accent);
  /* Half-intensity glow so it sits in the sidebar without competing
     with primary CTAs. */
  box-shadow: 0 0 16px rgba(251, 191, 36, 0.10);
}

/* 3. Live status indicators. */
@keyframes valory-pulse {
  0%, 100% {
    opacity: 0.65;
    box-shadow: 0 0 0 0 var(--accent-glow);
  }
  50% {
    opacity: 1;
    box-shadow: 0 0 0 8px rgba(251, 191, 36, 0);
  }
}
.live-indicator,
.studying-now-dot,
.live-dot,
.is-live-dot {
  background: var(--accent);
  animation: valory-pulse 2.4s var(--ease-out) infinite;
}

/* 4. Stat numbers (streak / study-time / level / XP).
   The color IS the emphasis. No backgrounds, no borders. */
.streak-num,
.streak-value,
.study-time-value,
.study-today-value,
.level-number,
.xp-value {
  color: var(--accent);
}

/* 5. Gold and diamond tier badges only. Bronze and silver stay
   amber-toned via existing styles but receive no glow. */
.vhero__tier-badge.vhero__tier--gold,
.vhero__tier-badge.vhero__tier--diamond,
.tier-badge.tier-gold,
.tier-badge.tier-diamond {
  box-shadow: var(--glow-accent);
}


/* ════════════════════════════════════════════════════════════════════
   VALORY  ·  Page-enter motion (Phase 2)
   Felt, not seen. 8px translate, 320ms, 60ms stagger. Do not retune.
   Reduced motion handled centrally in tokens.css (duration vars → 0).
   ════════════════════════════════════════════════════════════════════ */

@keyframes valory-enter {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0);   }
}

main > *,
.mn-main > * {
  animation: valory-enter var(--duration-slow) var(--ease-out) both;
}

main > *:nth-child(1), .mn-main > *:nth-child(1) { animation-delay: 0ms; }
main > *:nth-child(2), .mn-main > *:nth-child(2) { animation-delay: 60ms; }
main > *:nth-child(3), .mn-main > *:nth-child(3) { animation-delay: 120ms; }
main > *:nth-child(4), .mn-main > *:nth-child(4) { animation-delay: 180ms; }
main > *:nth-child(n+5), .mn-main > *:nth-child(n+5) { animation-delay: 240ms; }