/* ================================================================
   GYM MATE – OBSIDIAN FORGE THEME
   Dark athletic base · Acid-lime accents · Brutalist-refined grid
   ================================================================ */

@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@400;600;700;800;900&family=DM+Sans:ital,wght@0,300;0,400;0,500;0,600;1,300&display=swap');

/* ── TOKENS ───────────────────────────────────────────────────── */
:root {
  --gm-bg:        #16191f;
  --gm-surface:   #1e2129;
  --gm-surface-2: #252930;
  --gm-surface-3: #2d3140;
  --gm-border:    rgba(255,255,255,.09);
  --gm-border-2:  rgba(255,255,255,.15);
  --gm-lime:      #c6f135;
  --gm-lime-dim:  #9dbf1f;
  --gm-lime-glow: rgba(198,241,53,.18);
  --gm-lime-card: rgba(198,241,53,.06);
  --gm-ink:       #f0f2f8;
  --gm-ink-2:     #a8b0c4;
  --gm-ink-3:     #5e6577;
  --gm-red:       #ff4d6a;
  --gm-amber:     #ffb830;
  --gm-teal:      #00d4a8;
  --gm-blue:      #4d9fff;
  --gm-shadow:    0 24px 64px rgba(0,0,0,.55);
  --gm-shadow-sm: 0 8px 24px rgba(0,0,0,.4);
  --gm-radius:    20px;
  --gm-radius-lg: 28px;
  --gm-radius-xl: 36px;

  /* overwrite old widget vars so inline styles still resolve */
  --widget-navy: #c6f135;
  --widget-ink:  #f0f2f8;
  --widget-muted:#a8b0c4;
  --widget-soft: #1f232e;
  --widget-panel:#111318;
  --widget-white:#1f232e;
  --widget-border:rgba(255,255,255,.07);
  --widget-shadow: 0 24px 64px rgba(0,0,0,.55);
  --widget-shadow-2: 0 8px 24px rgba(0,0,0,.4);
}

/* ── GLOBAL RESET ────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; }

html, body, #root {
  height: 100%;
  scroll-behavior: smooth;
}

body {
  font-family: 'DM Sans', ui-sans-serif, system-ui, sans-serif !important;
  background: var(--gm-bg) !important;
  color: var(--gm-ink) !important;
  -webkit-font-smoothing: antialiased;
  letter-spacing: -.01em;
}

/* ── TYPOGRAPHY OVERRIDE ─────────────────────────────────────── */
h1, h2, h3, h4 {
  font-family: 'Barlow Condensed', sans-serif !important;
  font-weight: 800 !important;
  letter-spacing: -.01em !important;
  color: var(--gm-ink) !important;
  text-transform: uppercase;
}

/* ── SCROLLBAR ───────────────────────────────────────────────── */
::-webkit-scrollbar { width: 4px; height: 4px; }
::-webkit-scrollbar-track { background: var(--gm-surface); }
::-webkit-scrollbar-thumb { background: var(--gm-surface-3); border-radius: 99px; }
::-webkit-scrollbar-thumb:hover { background: var(--gm-lime-dim); }

/* ── FOCUS ───────────────────────────────────────────────────── */
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 2px solid var(--gm-lime) !important;
  outline-offset: 2px !important;
}

/* ================================================================
   LOGIN SCREEN
   ================================================================ */
.login-screen {
  min-height: 100vh;
  background: var(--gm-bg) !important;
  position: relative;
  overflow: hidden;
}

/* animated background grid */
.login-screen::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(198,241,53,.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(198,241,53,.04) 1px, transparent 1px);
  background-size: 48px 48px;
  animation: gridPulse 8s ease-in-out infinite;
  pointer-events: none;
  z-index: 0;
}
.login-screen::after {
  content: '';
  position: absolute;
  top: -40%;
  left: -20%;
  width: 80vw;
  height: 80vw;
  background: radial-gradient(circle, rgba(198,241,53,.10) 0%, transparent 65%);
  pointer-events: none;
  z-index: 0;
  animation: orbFloat 12s ease-in-out infinite;
}

@keyframes gridPulse {
  0%, 100% { opacity: .6; }
  50% { opacity: 1; }
}
@keyframes orbFloat {
  0%, 100% { transform: translate(0, 0); }
  50% { transform: translate(6%, 4%); }
}

.login-screen > * { position: relative; z-index: 1; }

.login-screen > .mx-auto {
  max-width: 1160px !important;
  align-items: center;
  min-height: calc(100vh - 3rem);
}

/* login card */
.login-screen .rounded-\[36px\],
.login-screen .soft-card {
  background: var(--gm-surface) !important;
  border: 1px solid var(--gm-border-2) !important;
  border-radius: var(--gm-radius-xl) !important;
  box-shadow: var(--gm-shadow) !important;
  backdrop-filter: none !important;
}

/* left panel hero */
.login-screen .bg-\[linear-gradient\(135deg\2c \#5f52ff\2c \#8b7cff_58\%\2c \#27d1b3_140\%\)\] {
  background:
    linear-gradient(160deg, rgba(11,13,17,.55) 0%, rgba(11,13,17,.85) 100%),
    url('https://images.unsplash.com/photo-1534438327276-14e5300c3a48?auto=format&fit=crop&w=1200&q=80') center/cover no-repeat !important;
  border-radius: calc(var(--gm-radius-xl) - 2px) !important;
  position: relative;
  overflow: hidden;
}
.login-screen .bg-\[linear-gradient\(135deg\2c \#5f52ff\2c \#8b7cff_58\%\2c \#27d1b3_140\%\)\]::before {
  content: 'GYMMATE';
  position: absolute;
  bottom: -0.1em;
  left: -0.02em;
  font-family: 'Barlow Condensed', sans-serif;
  font-weight: 900;
  font-size: clamp(96px, 14vw, 180px);
  line-height: 1;
  color: rgba(198,241,53,.08);
  text-transform: uppercase;
  pointer-events: none;
  letter-spacing: -.04em;
  white-space: nowrap;
}

/* ================================================================
   MAIN SITE SHELL
   ================================================================ */
.site-shell {
  position: relative;
  max-width: 1440px;
  margin: 16px auto;
  min-height: calc(100vh - 32px);
  border: 1px solid var(--gm-border-2);
  border-radius: var(--gm-radius-xl);
  overflow: hidden;
  background: var(--gm-bg) !important;
  box-shadow: var(--gm-shadow);
}

.site-shell::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    /* subtle lime top glow */
    radial-gradient(ellipse 70% 28% at 50% 0%, rgba(198,241,53,.07) 0%, transparent 70%),
    /* dark overlay over stock image in top 220px */
    linear-gradient(180deg,
      rgba(22,25,31,.68) 0%,
      rgba(22,25,31,.82) 140px,
      rgba(22,25,31,.97) 220px,
      var(--gm-bg) 320px,
      var(--gm-bg) 100%),
    /* stock gym image — hero band */
    url('https://images.unsplash.com/photo-1534438327276-14e5300c3a48?auto=format&fit=crop&w=1600&q=72') center top/cover no-repeat;
  z-index: 0;
  pointer-events: none;
}

.site-shell > * { position: relative; z-index: 1; }

/* ── TOP BAR ─────────────────────────────────────────────────── */
.site-shell .sticky.top-0 {
  background: transparent !important;
  border-bottom: none !important;
  backdrop-filter: none !important;
}
.site-shell .sticky.top-0 > .mx-auto {
  max-width: none !important;
  margin: 20px 20px 0 20px !important;
  padding: 0 !important;
}
.site-shell .sticky.top-0 > .mx-auto > div {
  background: var(--gm-surface) !important;
  border: 1px solid var(--gm-border-2) !important;
  border-radius: var(--gm-radius-lg) !important;
  padding: 16px 22px !important;
  box-shadow: var(--gm-shadow-sm) !important;
  display: flex;
  align-items: center;
}
.site-shell .sticky.top-0 h1 {
  color: var(--gm-ink) !important;
  font-family: 'Barlow Condensed', sans-serif !important;
  font-weight: 900 !important;
  font-size: 1.9rem !important;
  text-transform: uppercase !important;
  letter-spacing: -.01em !important;
}
.site-shell .sticky.top-0 p {
  color: var(--gm-ink-2) !important;
  font-size: .82rem !important;
}

/* ── MAIN GRID ───────────────────────────────────────────────── */
.site-shell .grid.max-w-7xl {
  max-width: none !important;
  margin: 0 20px 20px 20px !important;
  padding: 16px 0 0 0 !important;
  gap: 18px !important;
}
.site-shell .md\:grid-cols-\[240px_minmax\(0\2c 1fr\)\] {
  grid-template-columns: 210px minmax(0,1fr) !important;
}

/* ── SIDEBAR NAV ─────────────────────────────────────────────── */
.site-shell .hidden.md\:block > div.space-y-2 {
  background: var(--gm-surface) !important;
  border: 1px solid var(--gm-border-2) !important;
  border-radius: var(--gm-radius-lg) !important;
  padding: 12px !important;
  backdrop-filter: none !important;
}
.site-shell .hidden.md\:block > div.space-y-2 button {
  border-radius: 14px !important;
  transition: all .2s cubic-bezier(.34,1.56,.64,1) !important;
  font-family: 'DM Sans', sans-serif !important;
  font-weight: 500 !important;
  font-size: .825rem !important;
}
.site-shell .hidden.md\:block > div.space-y-2 button.bg-slate-900,
.site-shell .hidden.md\:block > div.space-y-2 button[class*="from-violet"] {
  background: var(--gm-lime) !important;
  color: #0b0d11 !important;
  box-shadow: 0 4px 20px var(--gm-lime-glow) !important;
  font-weight: 700 !important;
}
.site-shell .hidden.md\:block > div.space-y-2 button.bg-white,
.site-shell .hidden.md\:block > div.space-y-2 button:not(.bg-slate-900):not([class*="from-violet"]) {
  background: transparent !important;
  color: var(--gm-ink-2) !important;
  border: none !important;
}
.site-shell .hidden.md\:block > div.space-y-2 button:not(.bg-slate-900):not([class*="from-violet"]):hover {
  background: var(--gm-surface-3) !important;
  color: var(--gm-ink) !important;
  transform: translateX(4px) !important;
}

/* ── CARDS & SURFACES ────────────────────────────────────────── */
.site-shell .rounded-\[28px\],
.site-shell .rounded-\[32px\],
.site-shell .rounded-\[24px\],
.site-shell .rounded-3xl,
.site-shell .rounded-2xl {
  border-radius: var(--gm-radius) !important;
}

.site-shell .soft-card,
.site-shell .rounded-\[28px\].border,
.site-shell .rounded-\[32px\].border,
.site-shell .rounded-\[28px\].border.border-slate-200 {
  background: var(--gm-surface) !important;
  border: 1px solid var(--gm-border) !important;
  box-shadow: var(--gm-shadow-sm) !important;
  backdrop-filter: none !important;
}

.site-shell .bg-white,
.site-shell .bg-white\/80,
.site-shell .bg-white\/90,
.site-shell .bg-white\/85 {
  background: var(--gm-surface-2) !important;
}
.site-shell .bg-slate-50,
.site-shell .bg-slate-100,
.site-shell .from-slate-50,
.site-shell .to-violet-50,
.site-shell .to-indigo-50 {
  background: var(--gm-surface-3) !important;
}

/* ── BRAND / ACCENT COLORS ───────────────────────────────────── */
.site-shell .bg-slate-900,
.site-shell .from-violet-600,
.site-shell .to-indigo-500,
.site-shell .from-violet-500,
.site-shell .to-indigo-600,
.site-shell [class*="from-violet"][class*="to-indigo"],
.site-shell [style*="from-violet-600"] {
  background: var(--gm-lime) !important;
  color: #0b0d11 !important;
  box-shadow: 0 8px 28px var(--gm-lime-glow) !important;
}

.site-shell .text-violet-700,
.site-shell .text-violet-600,
.site-shell .text-indigo-600 {
  color: var(--gm-lime) !important;
}
.site-shell .bg-violet-50,
.site-shell .bg-indigo-50 {
  background: var(--gm-lime-card) !important;
}
.site-shell .border-violet-200,
.site-shell .border-slate-200,
.site-shell .border-white\/70,
.site-shell .ring-white\/70 {
  border-color: var(--gm-border-2) !important;
  box-shadow: none !important;
}

/* status colors */
.site-shell .bg-emerald-50  { background: rgba(0,212,168,.10) !important; }
.site-shell .bg-emerald-100 { background: rgba(0,212,168,.16) !important; }
.site-shell .border-emerald-200 { border-color: rgba(0,212,168,.25) !important; }
.site-shell .text-emerald-700 { color: var(--gm-teal) !important; }

.site-shell .bg-amber-50    { background: rgba(255,184,48,.10) !important; }
.site-shell .bg-amber-100   { background: rgba(255,184,48,.16) !important; }
.site-shell .border-amber-200 { border-color: rgba(255,184,48,.25) !important; }
.site-shell .text-amber-700 { color: var(--gm-amber) !important; }

.site-shell .bg-red-50      { background: rgba(255,77,106,.10) !important; }
.site-shell .bg-red-100     { background: rgba(255,77,106,.16) !important; }
.site-shell .border-red-200 { border-color: rgba(255,77,106,.25) !important; }
.site-shell .text-red-700   { color: var(--gm-red) !important; }

.site-shell .bg-violet-100  { background: var(--gm-lime-card) !important; }
.site-shell .text-violet-700{ color: var(--gm-lime) !important; }

/* ── TYPOGRAPHY ──────────────────────────────────────────────── */
.site-shell .text-slate-900 { color: var(--gm-ink) !important; }
.site-shell .text-slate-700 { color: var(--gm-ink-2) !important; }
.site-shell .text-slate-600 { color: var(--gm-ink-2) !important; }
.site-shell .text-slate-500,
.site-shell .text-slate-400 { color: var(--gm-ink-3) !important; }

/* ── FITNESS CHIP ────────────────────────────────────────────── */
.fitness-chip {
  display: inline-flex !important;
  align-items: center !important;
  gap: .3rem !important;
  border-radius: 6px !important;
  padding: .25rem .6rem !important;
  background: var(--gm-lime-card) !important;
  color: var(--gm-lime) !important;
  font-family: 'Barlow Condensed', sans-serif !important;
  font-weight: 700 !important;
  font-size: .7rem !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
  border: 1px solid rgba(198,241,53,.18) !important;
}
.site-shell .fitness-chip { all: unset; display: inline-flex; align-items: center; gap: .3rem; border-radius: 6px; padding: .25rem .6rem; background: var(--gm-lime-card); color: var(--gm-lime); font-family: 'Barlow Condensed', sans-serif; font-weight: 700; font-size: .7rem; letter-spacing: .08em; text-transform: uppercase; border: 1px solid rgba(198,241,53,.18); }

/* ── BUTTONS ─────────────────────────────────────────────────── */
.site-shell button {
  font-weight: 600 !important;
  transition: all .18s cubic-bezier(.34,1.56,.64,1) !important;
}
.site-shell button:hover {
  transform: translateY(-2px) !important;
}
.site-shell button:active {
  transform: translateY(0) scale(.97) !important;
}

/* outline / secondary buttons */
.site-shell button.border-violet-200,
.site-shell button[class*="border-violet"] {
  background: var(--gm-lime-card) !important;
  border-color: rgba(198,241,53,.3) !important;
  color: var(--gm-lime) !important;
}
.site-shell button.border-red-200 {
  background: rgba(255,77,106,.08) !important;
  border-color: rgba(255,77,106,.25) !important;
  color: var(--gm-red) !important;
}

/* ── INPUTS ──────────────────────────────────────────────────── */
.site-shell input,
.site-shell select,
.site-shell textarea {
  background: var(--gm-surface-3) !important;
  border: 1px solid var(--gm-border-2) !important;
  color: var(--gm-ink) !important;
  border-radius: 14px !important;
  transition: border-color .15s ease, box-shadow .15s ease !important;
}
.site-shell input:focus,
.site-shell select:focus,
.site-shell textarea:focus {
  border-color: rgba(198,241,53,.5) !important;
  box-shadow: 0 0 0 3px var(--gm-lime-glow) !important;
}
.site-shell input::placeholder,
.site-shell textarea::placeholder {
  color: var(--gm-ink-3) !important;
}
.site-shell select option {
  background: var(--gm-surface-2) !important;
  color: var(--gm-ink) !important;
}
.site-shell input:disabled,
.site-shell select:disabled {
  background: var(--gm-surface-2) !important;
  opacity: .5 !important;
}

/* ── CALENDAR / WEEKLY GRID ──────────────────────────────────── */
.site-shell table {
  border-collapse: separate !important;
  border-spacing: 8px 8px !important;
}
.site-shell table thead th > div {
  background: var(--gm-surface-2) !important;
  border: 1px solid var(--gm-border-2) !important;
  border-radius: 14px !important;
  box-shadow: none !important;
}
.site-shell table thead th > div .text-slate-900 {
  font-family: 'Barlow Condensed', sans-serif !important;
  font-weight: 700 !important;
  font-size: .9rem !important;
  text-transform: uppercase !important;
}
.site-shell td button {
  height: 106px !important;
  border: 1px solid var(--gm-border) !important;
  background: var(--gm-surface-2) !important;
  box-shadow: none !important;
  border-radius: 14px !important;
  transition: all .18s ease !important;
}
.site-shell td button:hover {
  background: var(--gm-surface-3) !important;
  border-color: var(--gm-border-2) !important;
  transform: translateY(-2px) !important;
}

/* calendar cell – planned  */
.site-shell td button[class*="from-violet"],
.site-shell td button[class*="to-indigo"] {
  background: linear-gradient(135deg, rgba(198,241,53,.14), rgba(198,241,53,.06)) !important;
  border-color: rgba(198,241,53,.28) !important;
}
/* calendar cell – completed */
.site-shell td button[class*="emerald"] {
  background: linear-gradient(135deg, rgba(0,212,168,.12), rgba(0,212,168,.05)) !important;
  border-color: rgba(0,212,168,.22) !important;
}
/* calendar cell – cancelled */
.site-shell td button[class*="red-"] {
  background: linear-gradient(135deg, rgba(255,77,106,.10), rgba(255,77,106,.04)) !important;
  border-color: rgba(255,77,106,.20) !important;
}

/* ── STAT CARD UPGRADE ───────────────────────────────────────── */
.site-shell .soft-card .text-3xl {
  font-family: 'Barlow Condensed', sans-serif !important;
  font-weight: 900 !important;
  font-size: 2.8rem !important;
  line-height: 1 !important;
  color: var(--gm-lime) !important;
}
.site-shell .soft-card .text-\[11px\] {
  font-family: 'Barlow Condensed', sans-serif !important;
  font-weight: 700 !important;
  letter-spacing: .14em !important;
  color: var(--gm-ink-3) !important;
  text-transform: uppercase !important;
}

/* ── MODAL ───────────────────────────────────────────────────── */
.site-shell .fixed.inset-0 {
  background: rgba(0,0,0,.72) !important;
  backdrop-filter: blur(6px) !important;
}
.site-shell .fixed.inset-0 > div {
  background: var(--gm-surface) !important;
  border: 1px solid var(--gm-border-2) !important;
  box-shadow: 0 40px 100px rgba(0,0,0,.7) !important;
  border-radius: var(--gm-radius-lg) !important;
}

/* ── ACTION MENU DROPDOWN ────────────────────────────────────── */
.site-shell .absolute.right-0.top-12 {
  background: var(--gm-surface-2) !important;
  border: 1px solid var(--gm-border-2) !important;
  border-radius: var(--gm-radius) !important;
  box-shadow: var(--gm-shadow) !important;
}
.site-shell .absolute.right-0.top-12 button {
  color: var(--gm-ink-2) !important;
  border-radius: 12px !important;
}
.site-shell .absolute.right-0.top-12 button:hover {
  background: var(--gm-surface-3) !important;
  color: var(--gm-ink) !important;
}

/* ── DAY ACCORDION (MOBILE) ──────────────────────────────────── */
.site-shell .md\:hidden .rounded-2xl.border,
.site-shell [class*="overflow-hidden"][class*="rounded-"] {
  background: var(--gm-surface) !important;
  border: 1px solid var(--gm-border-2) !important;
  border-radius: var(--gm-radius) !important;
}
.site-shell .md\:hidden .rounded-\[22px\] {
  background: var(--gm-surface-2) !important;
  border-color: var(--gm-border) !important;
}

/* accordion chevron */
.site-shell .grid.h-9.w-9 {
  background: var(--gm-lime-card) !important;
  color: var(--gm-lime) !important;
  border-radius: 10px !important;
}

/* ── MEMBER SELECT BUTTONS IN MODAL ──────────────────────────── */
.site-shell .max-h-56 button[class*="from-violet"],
.site-shell .max-h-56 button[class*="bg-gradient"] {
  background: var(--gm-lime) !important;
  color: #0b0d11 !important;
  border-color: transparent !important;
  box-shadow: 0 4px 16px var(--gm-lime-glow) !important;
}
.site-shell .max-h-56 button:not([class*="from-violet"]):not([class*="bg-gradient"]) {
  background: var(--gm-surface-3) !important;
  border-color: var(--gm-border-2) !important;
  color: var(--gm-ink-2) !important;
}

/* ── NOTIFICATION CARDS ──────────────────────────────────────── */
.site-shell .border-slate-200\/80 {
  background: var(--gm-surface-2) !important;
  border-color: var(--gm-border) !important;
}

/* ── EMPTY STATE ─────────────────────────────────────────────── */
.site-shell [class*="border-dashed"] {
  background: var(--gm-lime-card) !important;
  border-color: rgba(198,241,53,.2) !important;
  color: var(--gm-ink-3) !important;
}

/* ── BADGE / STATUS CHIPS ────────────────────────────────────── */
.site-shell .bg-emerald-100.text-emerald-700 { background: rgba(0,212,168,.14) !important; color: var(--gm-teal) !important; border-radius: 8px; }
.site-shell .bg-red-100.text-red-700         { background: rgba(255,77,106,.14) !important; color: var(--gm-red) !important; border-radius: 8px; }
.site-shell .bg-slate-200.text-slate-700     { background: var(--gm-surface-3) !important; color: var(--gm-ink-2) !important; border-radius: 8px; }
.site-shell .bg-violet-100.text-violet-700   { background: var(--gm-lime-card) !important; color: var(--gm-lime) !important; border-radius: 8px; }

/* ── LOGOUT BUTTON ───────────────────────────────────────────── */
.site-shell button[class*="border-violet"].text-violet-700 {
  background: transparent !important;
  border: 1px solid var(--gm-border-2) !important;
  color: var(--gm-ink-2) !important;
}
.site-shell button[class*="border-violet"].text-violet-700:hover {
  border-color: var(--gm-lime) !important;
  color: var(--gm-lime) !important;
  background: var(--gm-lime-card) !important;
}

/* ── SECTION BORDERS ─────────────────────────────────────────── */
.site-shell .border-t {
  border-color: var(--gm-border) !important;
}

/* ── FORM FIELD LABELS ───────────────────────────────────────── */
.site-shell label {
  color: var(--gm-ink-2) !important;
  font-size: .78rem !important;
  font-weight: 600 !important;
  letter-spacing: .04em !important;
}

/* ── SECTION CARD HEADER ─────────────────────────────────────── */
.site-shell .mb-5 h2,
.site-shell .mb-5 h3 {
  font-size: 1.5rem !important;
  line-height: 1.1 !important;
}

/* ── WEEK NAV BUTTONS ────────────────────────────────────────── */
.site-shell button[class*="rounded-2xl"][class*="bg-white"],
.site-shell button[class*="rounded-2xl"].bg-white {
  background: var(--gm-surface-2) !important;
  border-color: var(--gm-border-2) !important;
  color: var(--gm-ink-2) !important;
}

/* ── TABLE ROWS ──────────────────────────────────────────────── */
.site-shell tr:hover td {
  background: var(--gm-surface-3) !important;
}

/* ── PROGRESS BAR PLACEHOLDER ────────────────────────────────── */
.site-shell [class*="bg-gradient-to-r"][class*="from-emerald"] {
  background: linear-gradient(90deg, var(--gm-teal), rgba(0,212,168,.5)) !important;
}

/* ================================================================
   LOGIN SCREEN INNER ELEMENTS
   ================================================================ */
.login-screen input,
.login-screen select {
  background: var(--gm-surface-3) !important;
  border: 1px solid var(--gm-border-2) !important;
  color: var(--gm-ink) !important;
  border-radius: 14px !important;
}
.login-screen input:focus,
.login-screen select:focus {
  border-color: rgba(198,241,53,.5) !important;
  box-shadow: 0 0 0 3px var(--gm-lime-glow) !important;
}
.login-screen input::placeholder { color: var(--gm-ink-3) !important; }
.login-screen select option {
  background: #1e2129 !important;
  color: #f0f2f8 !important;
}

.login-screen label { color: var(--gm-ink-2) !important; font-weight: 600 !important; font-size: .82rem !important; }
.login-screen h1,
.login-screen h2,
.login-screen h3 { color: var(--gm-ink) !important; }
.login-screen p,
.login-screen span { color: var(--gm-ink-2); }

.login-screen button[class*="bg-"] {
  background: var(--gm-lime) !important;
  color: #0b0d11 !important;
  font-weight: 700 !important;
  border-radius: 14px !important;
  box-shadow: 0 6px 24px var(--gm-lime-glow) !important;
  transition: all .2s cubic-bezier(.34,1.56,.64,1) !important;
}
.login-screen button[class*="bg-"]:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 12px 36px var(--gm-lime-glow) !important;
}
.login-screen button[class*="border"] {
  background: transparent !important;
  border-color: var(--gm-border-2) !important;
  color: var(--gm-ink-2) !important;
}
.login-screen .text-violet-600,
.login-screen .text-violet-700 { color: var(--gm-lime) !important; }

.login-screen .bg-violet-100 { background: var(--gm-lime-card) !important; }

/* decorative vertical text on login panel */
.login-screen .bg-\[linear-gradient\(135deg\2c \#5f52ff\2c \#8b7cff_58\%\2c \#27d1b3_140\%\)\] h2 {
  font-family: 'Barlow Condensed', sans-serif !important;
  font-weight: 900 !important;
  font-size: clamp(2.2rem, 4vw, 3.5rem) !important;
  text-transform: uppercase !important;
  color: var(--gm-ink) !important;
  letter-spacing: -.02em !important;
}
.login-screen .bg-\[linear-gradient\(135deg\2c \#5f52ff\2c \#8b7cff_58\%\2c \#27d1b3_140\%\)\] p {
  color: rgba(240,242,248,.7) !important;
}
.login-screen .bg-\[linear-gradient\(135deg\2c \#5f52ff\2c \#8b7cff_58\%\2c \#27d1b3_140\%\)\] .fitness-chip {
  background: rgba(198,241,53,.15) !important;
  color: var(--gm-lime) !important;
  border-color: rgba(198,241,53,.25) !important;
}

/* ================================================================
   MICRO-ANIMATIONS
   ================================================================ */
@keyframes fadeUp {
  from { opacity: 0; transform: translateY(16px); }
  to   { opacity: 1; transform: translateY(0); }
}

.site-shell .soft-card {
  animation: fadeUp .35s ease both;
}
.site-shell .soft-card:nth-child(2) { animation-delay: .06s; }
.site-shell .soft-card:nth-child(3) { animation-delay: .12s; }
.site-shell .soft-card:nth-child(4) { animation-delay: .18s; }

/* lime pulse on active nav */
@keyframes limePulse {
  0%, 100% { box-shadow: 0 4px 20px var(--gm-lime-glow); }
  50% { box-shadow: 0 4px 32px rgba(198,241,53,.35); }
}
.site-shell .hidden.md\:block > div.space-y-2 button.bg-slate-900,
.site-shell .hidden.md\:block > div.space-y-2 button[class*="from-violet"] {
  animation: limePulse 3s ease-in-out infinite !important;
}

/* ================================================================
   RESPONSIVE
   ================================================================ */
@media (max-width: 767px) {
  .site-shell {
    margin: 0;
    min-height: 100vh;
    border: none;
    border-radius: 0;
  }
  .site-shell::before {
    border-radius: 0;
    background:
      radial-gradient(ellipse 80% 24% at 50% 0%, rgba(198,241,53,.08) 0%, transparent 70%),
      var(--gm-bg);
  }
  .site-shell .sticky.top-0 > .mx-auto {
    margin: 12px 14px 0 14px !important;
  }
  .site-shell .grid.max-w-7xl {
    margin: 0 14px 14px 14px !important;
  }
  .login-screen > .mx-auto {
    min-height: 100vh;
  }
}

/* ── PRINT SAFETY ────────────────────────────────────────────── */
@media print {
  body { background: #fff !important; color: #000 !important; }
  .site-shell { box-shadow: none !important; border: none !important; }
}