:root {
  color-scheme: dark;

  /* Brand */
  --brand-orange: #ff8a00;
  --brand-coral: #ff4d3f;
  --brand-pink: #ff007a;
  --brand-gradient: linear-gradient(120deg, var(--brand-orange), var(--brand-coral) 48%, var(--brand-pink));
  --brand-gradient-soft: linear-gradient(120deg, rgb(255 138 0 / 16%), rgb(255 77 63 / 12%) 48%, rgb(255 0 122 / 13%));
  --brand-glow: rgb(255 0 122 / 22%);
  --on-brand: #17090d;

  /* Canvas and surfaces */
  --canvas: #070708;
  --canvas-deep: #030304;
  --surface-1: #101014;
  --surface-2: #15151a;
  --surface-3: #1b1b21;
  --surface-glass: rgb(15 15 19 / 88%);
  --surface-elevated: rgb(12 12 15 / 97%);
  --surface-soft: rgb(255 255 255 / 4.5%);
  --surface-hover: rgb(255 255 255 / 8%);
  --surface-sunken: rgb(0 0 0 / 20%);

  /* Text and lines */
  --text-primary: #faf9fb;
  --text-secondary: #c5c0ca;
  --text-tertiary: #918b98;
  --border-subtle: rgb(255 255 255 / 10%);
  --border-strong: rgb(255 255 255 / 19%);

  /* Semantic colours: distinct from the brand palette */
  --info: #79b8ff;
  --success: #68d9aa;
  --warning: #f7c75f;
  --danger: #ff667c;
  --telegram: #0d6c96;
  --on-telegram: #fff;
  --info-soft: rgb(121 184 255 / 11%);
  --success-soft: rgb(104 217 170 / 10%);
  --warning-soft: rgb(247 199 95 / 10%);
  --danger-soft: rgb(255 102 124 / 11%);
  --telegram-soft: rgb(13 108 150 / 16%);

  /* Type */
  --font-sans: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-mono: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
  --leading-tight: 1.08;
  --leading-copy: 1.58;

  /* Geometry */
  --page-width: 1240px;
  --page-gutter: clamp(16px, 3vw, 36px);
  --topbar-top: 14px;
  --topbar-height: 68px;
  --radius-xs: 10px;
  --radius-sm: 14px;
  --radius-md: 18px;
  --radius-lg: 24px;
  --radius-xl: 32px;
  --control-height: 46px;
  --touch-target: 44px;

  /* Depth and motion */
  --shadow-soft: 0 20px 58px rgb(0 0 0 / 34%);
  --shadow: 0 30px 100px rgb(0 0 0 / 52%);
  --focus-ring: 0 0 0 3px rgb(255 77 63 / 48%), 0 0 0 6px rgb(7 7 8 / 84%);
  --ease-out: cubic-bezier(.22, 1, .36, 1);
  --duration-fast: 140ms;
  --duration: 220ms;
  --duration-slow: 280ms;

  /* Compatibility aliases used by existing components. */
  --bg: var(--canvas);
  --bg-2: #0b0b0e;
  --line: var(--border-subtle);
  --line-strong: var(--border-strong);
  --text: var(--text-primary);
  --muted: var(--text-secondary);
  --muted-2: var(--text-tertiary);
  --blue: var(--brand-coral);
  --blue-2: var(--brand-orange);
  --violet: var(--brand-pink);
  --violet-2: #ff70b5;
  --ok: var(--success);
  --warn: var(--warning);
  --mint: var(--brand-orange);
  --mint-soft: rgb(255 138 0 / 11%);
  --flow-blue: var(--brand-pink);
  --flow-glass: var(--surface-glass);
  --flow-card: var(--surface-soft);
  --surface: var(--surface-glass);
  --info-bg: var(--info-soft);
  --ok-bg: var(--success-soft);
  --warn-bg: var(--warning-soft);
  --danger-bg: var(--danger-soft);
}