/* ════════════════════════════════════════════════════════════════
   Facespot · DESKTOP UI-KIT — tokens
   Single source of truth for the desktop surface (talent / agency /
   business). Layered ON TOP of the global styles.css — global mobile
   tokens (tokens/colors.css etc.) are left untouched.

   ► CHANGE THE ACCENT IN ONE PLACE: edit --accent* below and every
     desktop screen updates. Current: пастельный индиго (выбор заказчика).
     To switch to talent canon fuchsia, set --accent:#A21CAF etc.
   ════════════════════════════════════════════════════════════════ */
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500;600&display=swap');

/* — Digits use a monospace face (IBM Plex Mono) so figures align in columns.
     Apply via the .tnum class — headings/body stay on Onest.
     MANDATORY: thousands separator (space) on every number — see kit/README.md. */
.tnum {
  font-family: 'IBM Plex Mono', 'SFMono-Regular', ui-monospace, monospace;
  font-variant-numeric: tabular-nums;
  font-feature-settings: 'tnum';
  letter-spacing: -0.01em;
}

:root {
  /* — Accent (пастельный индиго) — */
  --accent: #6366F1;            /* indigo-500 — CTAs, active nav, verified seal */
  --accent-strong: #4F46E5;     /* indigo-600 — pressed */
  --accent-tint: #EEF0FE;       /* soft indigo surface */
  --accent-grad-from: #6366F1;
  --accent-grad-to: #818CF8;

  /* — Semantic (saturated, readable on light tints) — */
  --success: #15976B;  --success-strong: #0F7E59;  --success-tint: #E7F6EF;  --success-deep: #0B5C42;
  --warning: #C68A1E;  --warning-icon: #C68A1E;    --warning-tint: #FCF4E2;
  --violet:  #7E6BD4;  --violet-tint: #F1EEFB;
  --danger:  #D6627B;  --danger-tint: #FCECF0;
  --info:    #4C84E0;  --info-tint: #EAF1FD;

  /* — Desktop density — controls tighter than mobile's 48px — */
  --d-control-h: 40px;          /* default control height (mobile is 48) */
  --d-control-h-sm: 32px;       /* compact: table actions, chips */
  --d-control-h-lg: 46px;       /* prominent CTAs */
  --d-row-h: 56px;              /* list/table row */
  --d-field-h: 42px;            /* inputs */

  /* — Desktop radii (slightly tighter than mobile) — */
  --d-radius: 10px;             /* cards, buttons, inputs */
  --d-radius-sm: 8px;           /* chips, tags, small controls */
  --d-radius-lg: 14px;          /* large cards, panels */

  /* — Desktop layout metrics — */
  --d-sidebar-w: 240px;
  --d-content-max: 1080px;
  --d-gutter: 36px;             /* work-area horizontal padding */
}
