:root {
  /* Colors — neutral grays from iOS Settings (dark) */
  --bg: #000000;
  --fg: #ffffff;
  --muted: #8e8e93;
  --accent: #c59fff;
  --accent-wash: color-mix(in srgb, var(--accent) 22%, transparent);
  --card-surface: #1c1c1e;
  --card-pressed: #2c2c2e;
  --fill: #3a3a3c;
  --fill-strong: #636366;
  --separator: rgb(84 84 88 / .65);
  --badge-fill: #2c2c2e;

  /* Glass */
  --glass-fill: rgb(28 28 30 / .63);
  --glass-drop-fill: rgb(255 255 255 / .05);
  --glass-drop-fill-pressed: rgb(255 255 255 / .08);
  --glass-blur: blur(20px) saturate(180%);
  --glass-sheen: radial-gradient(90% 70% at 50% 0%, rgb(255 255 255 / .08), transparent 70%);
  /* Peak is the brightest point; every other stop is a share of it. */
  --glass-rim-peak: 18%;
  --glass-rim-color: rgb(255 255 255 / var(--glass-rim-peak));
  --glass-rim: conic-gradient(
    from 0deg,
    var(--glass-rim-color) 0deg,
    var(--glass-rim-color) 32deg,
    color-mix(in srgb, var(--glass-rim-color) 81%, transparent) 56deg,
    color-mix(in srgb, var(--glass-rim-color) 38%, transparent) 84deg,
    color-mix(in srgb, var(--glass-rim-color) 12%, transparent) 108deg,
    color-mix(in srgb, var(--glass-rim-color) 7%, transparent) 128deg,
    color-mix(in srgb, var(--glass-rim-color) 18%, transparent) 136deg,
    color-mix(in srgb, var(--glass-rim-color) 36%, transparent) 158deg,
    color-mix(in srgb, var(--glass-rim-color) 36%, transparent) 202deg,
    color-mix(in srgb, var(--glass-rim-color) 18%, transparent) 224deg,
    color-mix(in srgb, var(--glass-rim-color) 7%, transparent) 232deg,
    color-mix(in srgb, var(--glass-rim-color) 12%, transparent) 252deg,
    color-mix(in srgb, var(--glass-rim-color) 38%, transparent) 276deg,
    color-mix(in srgb, var(--glass-rim-color) 81%, transparent) 304deg,
    var(--glass-rim-color) 328deg,
    var(--glass-rim-color) 360deg
  );
  --glass-highlight:
    inset 0 1px 1px rgb(255 255 255 / .12),
    inset 0 -1px 1px rgb(255 255 255 / .04),
    inset 0 0 20px rgb(255 255 255 / .03);
  --glass-shadow: 0 12px 32px rgb(0 0 0 / .35), 0 2px 6px rgb(0 0 0 / .2);

  /* Layout */
  --bar-width: 90%;
  --bar-height: 64px;
  --bar-offset: 10px;
  --bar-padding: 8px;
  --safe-top: env(safe-area-inset-top);
  --safe-bottom: env(safe-area-inset-bottom);
  --tap-size: 48px;

  /* Shape */
  --radius-capsule: 999px;
  --radius-card: 22px;

  /* Typography */
  --font: -apple-system, system-ui, sans-serif;
  --text-group: 20px;
  --text-body: 16px;
  --text-caption: 14px;
  --text-badge: 13px;
  --text-label: 12px;

  /* Motion */
  --ease-smooth: cubic-bezier(.65, 0, .35, 1);
  --ease-spring: cubic-bezier(.34, 1.4, .64, 1);
  --ease-glide: cubic-bezier(.3, .7, .2, 1);
  --ease-out: cubic-bezier(.4, 0, .1, 1);
}