@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@400;600;700;800;900&display=swap');

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  --teal: #2de0c8;
  --teal-rgb: 45, 224, 200;
  --teal2: #1fc9b0;
  --border: rgba(255,255,255,0.09);
  --muted: rgba(255,255,255,0.38);
  --muted2: rgba(255,255,255,0.15);
  --font: 'Nunito', sans-serif;
  --err: #ff6b6b;

  --bg-app: linear-gradient(135deg, #1a2340 0%, #0d1018 100%);
  --bg-card: linear-gradient(155deg, #1d2436, #131720);
  --bg-surface: rgba(13,16,24,.7);
  --bg-surface-solid: #131720;
  --bg-filter: rgba(13,16,24,.4);
  --bg-card-img: linear-gradient(135deg, #1a3a4a 0%, #0f2235 100%);
  --bg-input: rgba(255,255,255,.055);
  --bg-overlay: rgba(0,0,0,.65);
  --text-primary: #fff;
  --hover-bg: rgba(255,255,255,.08);
}

[data-theme="light"] {
  --teal: #1a9e8a;
  --teal-rgb: 26, 158, 138;
  --teal2: #148d7a;
  --border: rgba(0,0,0,0.1);
  --muted: rgba(0,0,0,0.45);
  --muted2: rgba(0,0,0,0.18);
  --err: #d32f2f;

  --bg-app: linear-gradient(135deg, #f0f2f5 0%, #e2e6ed 100%);
  --bg-card: #ffffff;
  --bg-surface: rgba(255,255,255,.8);
  --bg-surface-solid: #ffffff;
  --bg-filter: rgba(255,255,255,.6);
  --bg-card-img: linear-gradient(135deg, #e8ecf2 0%, #d6dce6 100%);
  --bg-input: rgba(0,0,0,.04);
  --bg-overlay: rgba(0,0,0,.35);
  --text-primary: #111;
  --hover-bg: rgba(0,0,0,.06);
}

@keyframes shimmer { 0%{background-position:200% 0} 100%{background-position:-200% 0} }
@keyframes spin    { to { transform: rotate(360deg); } }
@keyframes mfadeIn { from{opacity:0} to{opacity:1} }
@keyframes mslideUp { from{opacity:0;transform:translateY(30px) scale(.96)} to{opacity:1;transform:none} }