:root {
  /* Brand — green */
  --brand-900: #0b3d24;
  --brand-800: #14532d;
  --brand-700: #15803d;
  --brand-600: #16a34a;
  --brand-500: #22c55e;
  --brand-400: #4ade80;
  --brand-300: #86efac;
  --brand-100: #dcfce7;
  --brand-50:  #f0fdf4;

  /* Danger — kept red regardless of brand, for delete/alert semantics */
  --danger: #dc2626;
  --danger-dark: #b91c1c;

  /* Sidebar — light */
  --sidebar-bg: #ffffff;
  --sidebar-border: #e9ecef;
  --sidebar-text: #5b6470;
  --sidebar-hover: rgba(21,128,61,0.08);
  --sidebar-active: var(--brand-700);

  /* Neutrals */
  --bg: #f5f6f8;
  --card: #ffffff;
  --border: #e3e6ea;
  --border2: #edf0f3;
  --text: #1a202c;
  --text2: #4a5568;
  /* Was #8a94a3 (~3.2:1 contrast on white — fails WCAG AA's 4.5:1 for normal
     text, which is why labels, descriptions and chart axes read as washed
     out). #6b7280 keeps the same "secondary, not primary" role at ~4.9:1. */
  --muted: #6b7280;

  --shadow-sm: 0 1px 2px rgba(16,24,40,0.05), 0 1px 3px rgba(16,24,40,0.06);
  --shadow: 0 4px 16px rgba(16,24,40,0.08);
  --shadow-lg: 0 12px 40px rgba(16,24,40,0.16);
  --radius: 14px;
  --radius-sm: 9px;
}
*{box-sizing:border-box;margin:0;padding:0;}
body{font-family:'Plus Jakarta Sans',sans-serif;background:var(--bg);color:var(--text);}
::-webkit-scrollbar{width:5px;}
::-webkit-scrollbar-thumb{background:var(--brand-300);border-radius:99px;}

/* PAGE SYSTEM */
.page{display:none;}
.page.active{display:flex;}
#pg-regsuccess.active{display:block;}

/* ANIMATIONS */
@keyframes fadeUp{from{opacity:0;transform:translateY(28px);}to{opacity:1;transform:none;}}
@keyframes fIn{from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:none;}}
@keyframes mIn{from{opacity:0;transform:scale(.92) translateY(18px);}to{opacity:1;transform:none;}}
@keyframes tIn{from{opacity:0;transform:translateY(12px);}to{opacity:1;transform:none;}}