:root {
  --bg-deep:      #162428;
  --bg-mid:       #1E3438;
  --bg-surface:   #28484E;
  --bg-deep-rgb:  22, 36, 40;

  --accent:       #50C0A8;
  --accent-hover: #70E0C8;
  --accent-rgb:   80, 192, 168;

  --success:      #4CAF50;
  --danger:       #E3350D;

  --font:         'Fredoka', sans-serif;
  --font-title:   var(--font);
  --text-sm:      12px;
  --text-md:      15px;
  --text-lg:      22px;
  --weight-light: 400;
  --weight-medium: 600;
  --weight-bold:  700;

  --radius-sm:    12px;
  --radius-md:    20px;
  --radius-lg:    30px;
  --card-border:  2px solid rgba(255, 255, 255, .15);
  --card-bg:      linear-gradient(145deg, rgba(255, 255, 255, .1), rgba(255, 255, 255, .05));
  --topbar-border: 3px solid var(--accent);
  --topbar-bg:    rgba(var(--bg-deep-rgb), .95);
  --body-bg:      linear-gradient(135deg, var(--bg-deep) 0%, var(--bg-mid) 50%, var(--bg-surface) 100%);
  --card-hover-y: -8px;
  --transition:   .3s;
  --sprite-render: pixelated;
}