:root {
  --purple: #5b21b6;
  --magenta: #d61f69;
  --magenta-dark: #b51657;
  --charcoal: #141821;
  --graphite: #242936;
  --fog: #f4f6fb;
  --white: #ffffff;
  --orange: #f97316;
  --surface: #ffffff;
  --surface-muted: #f5f7fb;
  --surface-raised: #ffffff;
  --surface-tinted: #fbf7ff;
  --border: #e3e7ef;
  --border-strong: #cfd6e3;
  --text: #111827;
  --text-muted: #606b7d;
  --muted: #606b7d;
  --green: #16a34a;
  --red: #dc2626;
  --yellow: #d97706;
  --accent-soft: rgba(214, 31, 105, 0.1);
  --purple-soft: rgba(91, 33, 182, 0.1);
  --focus-ring: 0 0 0 4px rgba(214, 31, 105, 0.16);
  --shadow-xs: 0 1px 2px rgba(17, 24, 39, 0.05);
  --shadow-sm: 0 8px 24px rgba(17, 24, 39, 0.07);
  --shadow-md: 0 18px 44px rgba(17, 24, 39, 0.11);
  --shadow-lg: 0 28px 70px rgba(17, 24, 39, 0.15);
  --radius-xs: 8px;
  --radius-sm: 10px;
  --radius-md: 14px;
  --radius-lg: 20px;
  --radius-xl: 28px;
  --gradient-accent: linear-gradient(135deg, var(--magenta), var(--purple));
  --gradient-dark: linear-gradient(135deg, #181b26, #332044);
  --moldcell: #6a1b9a;
  --moldtelecom: #004b93;
  --starnet: #ff6600;
  --header-height: 64px;
}