/* Life OS — design tokens. The accent variables are rewritten live by src/settings/theme.js
   so the whole interface takes on the colour of the current activity. */

@property --ang {
  syntax: '<angle>';
  inherits: false;
  initial-value: 0deg;
}

:root {
  color-scheme: dark;

  /* surfaces */
  --bg-0: #04050d;
  --bg-1: #070919;
  --bg-2: #0c0f26;
  --bg-3: #141838;
  --panel: rgba(9, 11, 30, 0.58);
  --panel-solid: rgba(10, 12, 32, 0.96);

  /* ink */
  --ink: #f4f5ff;
  --ink-2: #c0c4e6;
  --ink-3: #8a90bd;
  --ink-4: #585e8c;
  --line: rgba(150, 162, 255, 0.14);
  --line-2: rgba(150, 162, 255, 0.28);

  /* status */
  --danger: #ff5470;
  --warn: #ffb020;
  --ok: #2ee6a6;

  /* live accent (activity colour) + its companion hue */
  --accent-rgb: 255, 46, 151;
  --accent2-rgb: 255, 138, 60;
  --accent: rgb(var(--accent-rgb));
  --accent2: rgb(var(--accent2-rgb));
  --accent-ink: #ffffff;

  /* user-adjustable strength multipliers */
  --glow: 1;
  --tint: 1;

  /* type: Latin face first (it also supplies the digits), Arabic face second */
  --font-latin: "Sora";
  --font-arabic: "IBM Plex Sans Arabic";
  --font: var(--font-latin), var(--font-arabic), system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --track: 0.14em;
  --track-wide: 0.26em;
  --ui-dir: ltr;

  /* shape */
  --r-xs: 6px;
  --r-s: 9px;
  --r-m: 13px;
  --r-l: 18px;
  --r-xl: 26px;
  --gap: 14px;
  --topbar-h: 58px;
  --blur: 20px;

  /* motion */
  --ease: cubic-bezier(0.2, 0.7, 0.2, 1);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-back: cubic-bezier(0.34, 1.56, 0.64, 1);
}

/* Arabic is a joined script: letter-spacing would break the words apart. */
html[dir="rtl"] {
  --ui-dir: rtl;
  --track: 0em;
  --track-wide: 0em;
}

html[data-anim="reduced"] {
  --blur: 14px;
}