:root{
  --bg: 248 250 252;
  --fg: 15 23 42;
  --muted: 100 116 139;
  --card: 255 255 255;
  --border: 226 232 240;
  --input: 255 255 255;
  --input-fg: 15 23 42;
  --primary: 59 130 246;
  --primary-fg: 255 255 255;
  --ring: 59 130 246;
  --panel: 13 27 77;
}

html.dark{
  --bg: 2 6 23;
  --fg: 226 232 240;
  --muted: 148 163 184;
  --card: 2 12 28;
  --border: 30 41 59;
  --input: 2 12 28;
  --input-fg: 226 232 240;
  --primary: 59 130 246;
  --primary-fg: 255 255 255;
  --ring: 96 165 250;
  --panel: 8 17 46;
}

.auth-grid-bg{
  background-color: rgb(var(--panel));
  background-image:
    radial-gradient(circle at 30% 20%, rgba(255,255,255,0.08), transparent 55%),
    linear-gradient(to right, rgba(255,255,255,0.06) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(255,255,255,0.06) 1px, transparent 1px);
  background-size: auto, 48px 48px, 48px 48px;
}

.theme-fab{
  position: fixed;
  right: 24px;
  bottom: 24px;
}