:root {
  --page-bg: #0a0812;
  --panel-bg: rgba(23, 18, 37, 0.88);
  --panel-strong: rgba(36, 27, 59, 0.96);
  --panel-border: rgba(255, 255, 255, 0.08);
  --text-main: #f7edf9;
  --text-soft: #c3b8d0;
  --text-dim: #8e819f;
  --accent: #ff4dc4;
  --accent-2: #8f7cff;
  --accent-glow: rgba(255, 77, 196, 0.24);
  --success: #63d6aa;
  --shadow: 0 24px 60px rgba(4, 2, 10, 0.45);
  --radius-xl: 28px;
  --radius-lg: 22px;
  --radius-md: 16px;
  --radius-sm: 12px;
  --shell-width: 1240px;
  --transition-fast: 180ms ease;
  --transition-slow: 280ms ease;
  --font-display: "Georgia", "Times New Roman", serif;
  --font-ui: "Segoe UI", "Inter", sans-serif;
}

html[data-theme="cream"] {
  --page-bg: #fff9f2;
  --panel-bg: rgba(244, 237, 228, 0.92);
  --panel-strong: rgba(255, 255, 255, 0.98);
  --panel-border: rgba(229, 220, 208, 0.72);
  --text-main: #2a2a2e;
  --text-soft: #5a5a64;
  --text-dim: #90909a;
  --accent: #e8a832;
  --accent-2: #d4785a;
  --accent-glow: rgba(232, 168, 50, 0.16);
  --success: #4a9f5a;
  --shadow: 0 20px 45px rgba(48, 26, 55, 0.12);
}