/* Neural Ether theme tokens — dark is default, .light swaps the palette */

:root {
  /* Dark (default) — obsidian + electric signals */
  --c-background: 19 19 20;
  --c-surface: 19 19 20;
  --c-surface-dim: 19 19 20;
  --c-surface-bright: 58 57 58;
  --c-surface-container-lowest: 14 14 15;
  --c-surface-container-low: 28 27 28;
  --c-surface-container: 32 31 32;
  --c-surface-container-high: 42 42 43;
  --c-surface-container-highest: 53 52 54;
  --c-surface-variant: 53 52 54;

  --c-on-background: 229 226 227;
  --c-on-surface: 229 226 227;
  --c-on-surface-variant: 195 198 215;

  --c-primary: 180 197 255;              /* #b4c5ff */
  --c-primary-container: 23 90 223;      /* #175adf */
  --c-on-primary: 0 42 119;
  --c-on-primary-container: 218 225 255;
  --c-on-primary-fixed: 0 23 75;
  --c-primary-fixed: 219 225 255;
  --c-primary-fixed-dim: 180 197 255;

  --c-secondary: 237 255 225;            /* #edffe1 */
  --c-secondary-container: 40 255 30;    /* #28ff1e */
  --c-on-secondary: 0 58 0;
  --c-on-secondary-container: 1 113 0;
  --c-secondary-fixed: 119 255 97;
  --c-secondary-fixed-dim: 0 230 2;

  --c-tertiary: 198 198 199;
  --c-tertiary-container: 99 101 101;
  --c-tertiary-fixed: 226 226 226;
  --c-tertiary-fixed-dim: 198 198 199;

  --c-outline: 141 144 160;
  --c-outline-variant: 67 70 84;

  --c-error: 255 180 171;
  --c-on-error: 105 0 5;
  --c-error-container: 147 0 10;
  --c-on-error-container: 255 218 214;

  --c-inverse-primary: 4 83 217;
  --c-inverse-surface: 229 226 227;
  --c-inverse-on-surface: 49 48 49;

  --glow-primary: rgba(23, 90, 223, 0.15);
  --glow-secondary: rgba(40, 255, 30, 0.10);
}

:root.light {
  /* Light — paper-white background with the SAME electric signals */
  --c-background: 250 250 251;
  --c-surface: 250 250 251;
  --c-surface-dim: 238 238 240;
  --c-surface-bright: 255 255 255;
  --c-surface-container-lowest: 255 255 255;
  --c-surface-container-low: 246 246 248;
  --c-surface-container: 241 241 244;
  --c-surface-container-high: 234 234 238;
  --c-surface-container-highest: 226 226 231;
  --c-surface-variant: 226 226 231;

  --c-on-background: 23 24 28;
  --c-on-surface: 23 24 28;
  --c-on-surface-variant: 70 74 88;

  --c-primary: 23 90 223;                /* invert: container becomes primary */
  --c-primary-container: 218 225 255;
  --c-on-primary: 255 255 255;
  --c-on-primary-container: 0 23 75;
  --c-on-primary-fixed: 0 23 75;
  --c-primary-fixed: 23 90 223;
  --c-primary-fixed-dim: 4 65 180;

  --c-secondary: 28 126 28;              /* #1c7e1c — readable green on white */
  --c-secondary-container: 183 240 169;
  --c-on-secondary: 255 255 255;
  --c-on-secondary-container: 1 50 0;
  --c-secondary-fixed: 1 90 0;
  --c-secondary-fixed-dim: 1 120 0;

  --c-tertiary: 70 74 88;
  --c-tertiary-container: 226 226 231;
  --c-tertiary-fixed: 40 43 50;
  --c-tertiary-fixed-dim: 90 94 108;

  --c-outline: 113 117 131;
  --c-outline-variant: 196 199 213;

  --c-error: 186 26 26;
  --c-on-error: 255 255 255;
  --c-error-container: 255 218 214;
  --c-on-error-container: 65 0 2;

  --c-inverse-primary: 180 197 255;
  --c-inverse-surface: 23 24 28;
  --c-inverse-on-surface: 246 246 248;

  --glow-primary: rgba(23, 90, 223, 0.12);
  --glow-secondary: rgba(28, 126, 28, 0.08);
}

/* Smooth palette swap */
html, body {
  transition: background-color 320ms ease, color 320ms ease;
}

/* Material Symbols defaults */
.material-symbols-outlined {
  font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
  vertical-align: middle;
}
.fill-icon { font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 0, 'opsz' 24; }

/* Neural glows — ambient depth */
.neural-glow {
  position: absolute;
  width: 320px;
  height: 320px;
  border-radius: 50%;
  pointer-events: none;
  z-index: 0;
  filter: blur(4px);
  background: radial-gradient(circle, var(--glow-primary) 0%, transparent 70%);
}
.neural-glow.accent {
  background: radial-gradient(circle, var(--glow-secondary) 0%, transparent 70%);
}

/* Signature gradient utility */
.neural-gradient {
  background: linear-gradient(135deg, rgb(var(--c-primary-container)) 0%, rgb(var(--c-secondary-container)) 100%);
}
.text-neural-gradient {
  background: linear-gradient(135deg, rgb(var(--c-primary-container)) 0%, rgb(var(--c-secondary-container)) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
:root.light .text-neural-gradient {
  background: linear-gradient(135deg, #0b3fa8 0%, #1c7e1c 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* Glass panel — glassmorphism */
.glass-panel {
  background: rgb(var(--c-surface-variant) / 0.4);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
}

/* Hide content that should animate in */
[data-hidden-until-ready] { opacity: 0; }

/* Scrollbar */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb {
  background: rgb(var(--c-outline-variant));
  border-radius: 999px;
}
::-webkit-scrollbar-thumb:hover { background: rgb(var(--c-outline)); }

/* Focus ring consistent across themes */
:focus-visible {
  outline: 2px solid rgb(var(--c-primary));
  outline-offset: 2px;
  border-radius: 4px;
}

/* Print — keep it clean, light regardless */
@media print {
  :root { color-scheme: light; }
  .no-print { display: none !important; }
}