/* fastgpu design tokens — single source of truth (inlined into previews by build.sh) */
:root {
  /* base surfaces — тёплая тёмная палитра */
  --bg:         #14120F;
  --surface:    #191612;  /* сайдбар, чередующиеся секции */
  --surface-2:  #201C17;  /* карточки, панели */
  --surface-3:  #2A251E;  /* поля ввода, чипы */
  --surface-4:  #342E25;  /* ховер, трек метра */
  --border:     #2E2822;
  --border-2:   #3A342B;
  --border-str: #4C453A;

  /* text */
  --text:       #F7F3ED;
  --text-mid:   #B8B0A4;
  --text-dim:   #8A8276;

  /* brand */
  --primary:      #FF7A1A;
  --primary-hi:   #FF9440;
  --primary-lo:   #E2600A;
  --primary-ink:  #140B03;          /* текст на оранжевом */
  --primary-soft: rgba(255, 122, 26, .14);
  --primary-line: rgba(255, 122, 26, .30);

  /* status */
  --ok:        #7BC96F;
  --ok-soft:   rgba(123, 201, 111, .12);
  --ok-line:   rgba(123, 201, 111, .28);
  --warn:      #FFC53D;
  --warn-soft: rgba(255, 197, 61, .10);
  --warn-line: rgba(255, 197, 61, .26);
  --danger:      #F2544B;
  --danger-hi:   #F2685F;
  --danger-soft: rgba(242, 84, 75, .10);
  --danger-line: rgba(242, 84, 75, .24);
  --info:      #8FAEFF;
  --info-soft: rgba(122, 162, 255, .14);
  --info-line: rgba(122, 162, 255, .28);

  /* type */
  --font: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace;

  --fs-display: 56px; --lh-display: 1.05; --ls-display: -.035em;
  --fs-h1: 38px;      --lh-h1: 1.1;       --ls-h1: -.03em;
  --fs-h2: 30px;      --lh-h2: 1.2;       --ls-h2: -.025em;
  --fs-h3: 20px;      --lh-h3: 1.3;       --ls-h3: -.02em;
  --fs-h4: 15px;      --lh-h4: 1.4;
  --fs-lead: 17px;    --lh-lead: 1.6;
  --fs-body: 15px;    --lh-body: 1.6;
  --fs-ui: 14px;      --lh-ui: 1.55;
  --fs-sm: 13px;      --lh-sm: 1.5;
  --fs-xs: 12px;      --lh-xs: 1.45;
  --fs-over: 10px;    --ls-over: .07em;   /* оверлайн, uppercase */

  /* space */
  --s-1: 4px; --s-2: 8px; --s-3: 12px; --s-4: 16px;
  --s-5: 20px; --s-6: 24px; --s-7: 48px; --s-8: 64px;

  /* radius + elevation */
  --r-sm: 7px; --r-md: 9px; --r-lg: 12px; --r-xl: 16px; --r-2xl: 18px; --r-full: 999px;
  --sh-1: 0 6px 18px rgba(0,0,0,.30);
  --sh-2: 0 20px 44px rgba(0,0,0,.45);
  --sh-3: 0 24px 60px rgba(0,0,0,.50);
  --sh-glow: 0 10px 30px rgba(255,122,26,.30);

  --maxw: 1180px;
  --dur: 140ms;
  --ease: cubic-bezier(.2,.6,.3,1);
}

/* preview chrome shared by every card */
* { box-sizing: border-box; }
body {
  margin: 0;
  background: var(--bg); color: var(--text);
  font-family: var(--font); font-size: var(--fs-ui); line-height: var(--lh-ui);
  -webkit-font-smoothing: antialiased;
}
::selection { background: rgba(255,122,26,.35); }

.ds-title { font-size: var(--fs-over); letter-spacing: var(--ls-over); text-transform: uppercase;
  color: var(--text-dim); margin: 0 0 var(--s-4); font-weight: 600; }
.ds-row { display: flex; flex-wrap: wrap; gap: var(--s-3); align-items: center; }
.ds-stack { display: flex; flex-direction: column; gap: var(--s-6); }
.ds-grid { display: grid; gap: var(--s-4); }
.ds-label, .over { font-size: var(--fs-over); letter-spacing: var(--ls-over); text-transform: uppercase;
  color: var(--text-dim); font-weight: 600; }
code, .mono { font-family: var(--mono); }
