/* Base Reset & Variables */
:root {
  --color-bg: #0f0f10;
  --color-bg-light: #1c1c1e;
  --color-primary: #00ffd5;
  --color-secondary: #00a3ff;
  --color-text: #ffffff;
  --color-text-muted: #b0b0b0;
  --radius: 12px;
  --transition: all 0.3s ease;
  --font-main: 'Segoe UI', Roboto, sans-serif;
}

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

html, body {
  background: var(--color-bg);
  color: var(--color-text);
  font-family: var(--font-main);
  font-size: 16px;
  line-height: 1.6;
}

a {
  color: var(--color-primary);
  text-decoration: none;
  transition: var(--transition);
}
a:hover {
  color: var(--color-secondary);
}
:root{
  --brand-300:#5ce1e6; --brand-400:#37c6cc; --brand-500:#1ea6ad; --brand-600:#0c8e95; --brand-700:#0a6f73;
  --surface-1:#111315; --surface-2:#17191c; --surface-3:#1e2125; --surface-4:#2a2f35;
  --text-strong:#e8eaed; --text-muted:#a6adb4;
  --red-600:#ef4444;
  --radius-sm:6px; --radius-md:10px; --radius-lg:14px;
}
html[data-theme="dark"]{ background: var(--surface-1); color: var(--text-strong); }