/* ── CleanSport Android — Brutalist Mobile Styles ── */

/* Material Symbols defaults */
.material-symbols-outlined {
  font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
  user-select: none;
}

/* Safe area insets (notch / gesture bar) */
.pb-safe { padding-bottom: env(safe-area-inset-bottom); }
.pt-safe { padding-top: env(safe-area-inset-top); }

/* Brutalist shadows (white outline on dark) */
.brutalist-shadow {
  box-shadow: 4px 4px 0px 0px rgba(255, 255, 255, 0.9);
}
.brutalist-shadow-sm {
  box-shadow: 2px 2px 0px 0px rgba(255, 255, 255, 0.9);
}
.brutalist-shadow-red {
  box-shadow: 4px 4px 0px 0px #e21a37;
}

/* Active press animation (mimics native tap) */
.active-press {
  transition: transform 0.08s ease, box-shadow 0.08s ease;
}
.active-press:active {
  transform: translate(2px, 2px);
  box-shadow: 0px 0px 0px 0px rgba(255, 255, 255, 0.9);
}

/* Bottom nav active state */
.nav-item.is-active .nav-icon {
  font-variation-settings: 'FILL' 1, 'wght' 500, 'GRAD' 0, 'opsz' 24;
}
.nav-item.is-active .nav-icon,
.nav-item.is-active .nav-label {
  color: #e21a37;
}
.nav-item:not(.is-active) .nav-icon,
.nav-item:not(.is-active) .nav-label {
  color: #747373;
}

/* Hide scrollbars (mobile feel) */
.hide-scroll::-webkit-scrollbar { display: none; }
.hide-scroll { -ms-overflow-style: none; scrollbar-width: none; }

/* Live pulse animation */
@keyframes pulse-live {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.4; }
}
.live-pulse {
  animation: pulse-live 1.5s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}

/* Skeleton loading */
@keyframes pulse-neo {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.5; }
}
.skeleton {
  animation: pulse-neo 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
  background-color: #353534;
}

/* Prevent text selection on UI chrome */
header, nav, button, a { -webkit-tap-highlight-color: transparent; }

/* Block user zoom / bounce */
html, body {
  overscroll-behavior: none;
  -webkit-text-size-adjust: 100%;
}

/* Smooth scroll */
html { scroll-behavior: smooth; }