/* tokens.css — единственный источник значений для UI Seating Chart Maker v1.
 * Линия: tools/design-line (светло + округло, один акцент, тёмной темы нет).
 * Проверка из корня репо: node ../tools/design-line/contrast-check.mjs tokens.css  (tools/ лежит рядом, D:\Буткамп	ools).
 * Акцент #ad47b3 — со знака продукта (E0 07.09, буква владелицы); в UI один акцент на экран.
 * Значение объявлено в product.config.mjs (accent) и повторено здесь как --primary; тинт --primary-muted = акцент 12 % на белом.
 */
:root {
  /* --- поверхность (светлая, единственная тема) --- */
  --background: #ffffff;
  --foreground: #1f2328;          /* не чистый чёрный: мягче на белом */
  --card: #f7f8fa;                /* вторичная поверхность; НЕ рамка-в-рамке */
  --card-foreground: #1f2328;
  --muted: #eef0f3;
  --muted-foreground: #59616b;

  /* --- акцент: ОДИН на экран --- */
  --primary: #ad47b3;             /* accent from product.config.mjs; активное состояние, primary-кнопка, фокус (Р-71) */
  --primary-foreground: #ffffff;
  --primary-muted: #f5e9f6;       /* #ad47b3 12 % на белом: чипы, заливка дропзоны, тинт строки */
  --destructive: #b3261e;
  --destructive-foreground: #ffffff;

  /* --- границы и фокус --- */
  --border: #dde1e6;
  --ring: var(--primary);

  /* --- форма: округло по вкусу владелицы --- */
  --radius: 12px;
  --radius-sm: 8px;
  --border-width: 1px;

  /* --- шрифт --- */
  --font-sans: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --text-sm: 13px;
  --text-base: 13px;
  --text-lg: 17px;
  /* Число — главный объект этого продукта, поэтому у него свой размер и своя ширина цифр. */
  --text-number: 22px;
  --tracking-number: 0.04em;

  /* --- отступы (4px сетка) --- */
  --space-1: 3px;  --space-2: 8px;  --space-3: 13px;  --space-4: 13px;  --space-6: 21px;

  /* --- поверхность попапа --- */
  --surface-width: 360px;         /* высота НЕ фиксируется: следует состоянию (правило 30.08 №3) */
  --void-max: 21px;               /* порог остатка пустоты снизу/по бокам для compact-check */
  --list-max-height: 296px;       /* единственный контейнер с внутренней прокруткой */

  /* --- состояние пустого ввода (референс: дроп-зона донора QR) --- */
  --dropzone-height: 144px;
  --border-width-dropzone: 1.5px;
  --primary-muted-dropzone: color-mix(in srgb, var(--primary-muted) 55%, transparent);

  /* --- моушен: попап не анимируется при открытии (daily+) --- */
  --duration-fast: 120ms;
  --duration-max: 300ms;
  --ease: cubic-bezier(0.2, 0, 0, 1);

  /* --- цели нажатия --- */
  --target-min: 44px;             /* primary-действия; пол WCAG 24px для остальных */
  --target-compact: 34px;

  /* --- размеры контролов и глифов (компонентный CSS не держит сырых px) --- */
  --control: 34px;                /* иконка-источник, Copy в строке результата */
  --btn-height: 34px;             /* обычная кнопка состояния */
  --icon: 17px;                   /* глиф в строке источников */
  --icon-sm: 13px;                /* глиф Copy */
  --meta-gap: 3px;                /* межстрочный зазор мета-строк */

  /* --- добавлено на D07/H3-07: словарь классов реестра (DESIGN.md) --- */
  --ok: #1f7a3f;                  /* только точка-маркер перед именем готового файла */
  --warning-foreground: #8a4b00;  /* только строка fidelity — что перезапись не сохранила */
  --radius-xs: 5px;               /* марка бренда, плитка страницы, бейдж PRO, глиф файла */
  --radius-pill: 999px;           /* чипы и дорожка прогресса — токен, не кнопка */
  --outline-width: 2px;           /* фокус-кольцо и внутренняя обводка выбранной плитки */
  --text-xl: 21px;                /* заголовок пустого состояния, один раз на экран */
  --space-8: 34px;
  --content-max: 960px;           /* ширина реестра; шире — колонки расползаются */
  --shadow: 0 4px 14px rgba(31, 35, 40, 0.08), 0 1px 2px rgba(31, 35, 40, 0.06);
  --row-height: 55px;
  --strip-height: 55px;           /* полоса приёма, когда файл уже есть */
  --range-width: 183px;           /* главный ввод продукта */
  --range-min: 113px;
  --num-width: 89px;              /* поле счётчика: страниц на часть / число частей */
  --pw-max: 233px;
  --tile-min: 89px;               /* плитка сетки страниц, 3:4 */
  --bar-height: 6px;
  --dot: 8px;
  --mark: 21px;
  --glyph-width: 27px;
  --glyph-height: 34px;
  --glyph-fold: 8px;
  --row-selected: color-mix(in srgb, var(--primary-muted) 45%, transparent);
  --row-error: color-mix(in srgb, #fbe9e7 60%, transparent);
  --pages-ground: color-mix(in srgb, var(--primary-muted) 25%, transparent);
}

/* @pair --foreground on --background */
/* @pair --card-foreground on --card */
/* @pair --muted-foreground on --background */
/* @pair --muted-foreground on --card */
/* @pair --primary-foreground on --primary */
/* @pair --destructive-foreground on --destructive */
/* @pair --primary on --primary-muted */
/* @pair --primary on --background */

/* One frame at a time (owner rule 10.09): every focusable control draws its ring ON the border,
   never outside it; nothing falls back to the browser ring. Product rules may override. */
:where(input, select, textarea, button, [tabindex]):focus-visible {
  outline: var(--outline-width, 2px) solid var(--ring, currentColor);
  outline-offset: calc(-1 * var(--border-width, 1px));
}



:where(input, select, textarea)[aria-invalid='true']:focus-visible {
  outline-color: var(--destructive, currentColor);
}

/* === rebuild-2026-09-17 mock tokens === */
:root {
  color-scheme: light;
  --phi-3: 3px;
  --phi-4: 4px;
  --phi-5: 5px;
  --phi-6: 6px;
  --phi-8: 8px;
  --phi-10: 10px;
  --phi-13: 13px;
  --phi-17: 17px;
  --phi-21: 21px;
  --phi-27: 27px;
  --phi-34: 34px;
  --phi-43: 43px;
  --phi-55: 55px;
  --phi-70: 70px;
  --phi-89: 89px;
  --background: #fdfbf8;         /* warm neutral: the app ground */
  --foreground: #23201c;         /* warm ink, never pure black */
  --card: #f4f0ea;               /* strips, tab bar, palette tile ground */
  --card-foreground: #23201c;
  --muted: #ebe6de;              /* hover fills, selected row wash, chips */
  --muted-foreground: #6b6459;
  --felt: #e6e0d5;               /* the drafting table the sheet lies on */
  --sheet: #ffffff;              /* the plan paper */
  --sheet-rule: #efebe4;         /* the faint grid printed on the paper */
  --piece: #f6f2eb;              /* a drawn piece of furniture: table top, stage, bar */
  --piece-line: #b9b0a2;         /* the hairline every piece is drawn with */
  --seat-empty: #ffffff;         /* a seat with nobody on it */
  --primary: #ad47b3;            /* the product mark; the only accent, 4.86:1 on white */
  --primary-foreground: #ffffff;
  --primary-hover: #97399d;
  --border: #ddd6cb;
  --select: #23201c;             /* the ring on the selected table: ink, never the accent */
  --ring: var(--primary);
  --token-ink: #ffffff;          /* the digit on a guest token */
  /* Group colours are DATA, not accent. Six hues chosen far apart from each other AND far
     from the purple accent, so a digit is identified by its colour at seat size: cyan, navy,
     gold, green, slate, red. Every one carries --token-ink at 4.9:1 or better. */
  --g1: #0e7490;
  --g2: #1e40af;
  --g3: #a16207;
  --g4: #15803d;
  --g5: #475569;
  --g6: #b91c1c;
  --m-beef: #d55e00;
  --m-chicken: #e69f00;
  --m-fish: #0072b2;
  --m-veg: #009e73;
  --m-vegan: #56b4e9;
  --m-kids: #cc79a7;
  --m-none: #999999;
  --meal-ink: #16120e;
  --shadow-raised: 0 1px 2px rgb(35 32 28 / .12);
  --shadow: 0 10px 28px -12px rgb(35 32 28 / .40);
  --scrim: rgb(35 32 28 / .06);
  --radius: 8px;                 /* the line is light and round: values from the product's tokens.css */
  --radius-sm: 5px;
  --radius-xs: 3px;
  --font-sans: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --text-lg: 17px;
  --text-base: 13px;
  --text-num: 13px;
  --text-sm: 13px;
  --text-xs: 10px;
  --tracking-number: .02em;
  --space-1: var(--phi-3); --space-2: var(--phi-8); --space-3: var(--phi-13); --space-4: var(--phi-13); --space-5: var(--phi-21); --space-6: var(--phi-21);
  --strip-top: 70px;
  --strip-bottom: 27px;
  --rail: 355px;
  --row: 55px;
  --head-row: 27px;
  --target-min: 44px;
  --btn-h: 34px;
  --mark: 34px;
  --mark-radius: 3px;
  --tok: 34px;                   /* the guest token in a rail row */
  --tok-card: 27px;              /* the guest token in the table card */
  --swatch: 10px;
  --card-w: 296px;               /* the table card floating over the plan */
  --hair: 1px;
  --plan-ratio: 1040 / 700;      /* the sheet's proportion; every piece is placed in per cent of it */
  --table-d: 17.7cqw;            /* table top diameter */
  --orbit: 10.6cqw;              /* distance from the table centre to a seat centre */
  --seat-d: 3.75cqw;             /* a seat, and therefore a guest token, on the plan */
  --seat-text: 1.75cqw;
  --piece-text: 1.45cqw;
  --duration-fast: 120ms;
  --duration-slide: 180ms;
  --duration-max: 300ms;
  --ease: cubic-bezier(0.2, 0, 0, 1);

  --space-8: 34px;
}

/* Used only when the product tokens.css has no prefers-color-scheme block. */
@media (prefers-color-scheme: dark) {
  :root {
    color-scheme: dark;
    --background: #14171b;
    --foreground: #e6e9ee;
    --card: #1c2027;
    --card-foreground: #e6e9ee;
    --muted: #262b33;
    --muted-foreground: #9aa3ae;
    --border: #333a44;
    --primary-foreground: #0a1b33;
  }
}