/* ============================================================================
   Держава «Грид» — Модуль токенов типографики (Typography Tokens)
   Файл: typography_tokens.css · Стандарты: Linear/Stripe/Shadcn · WCAG 2.2 AAA
   Соответствует Закону Модульности (Статья XIX): < 800 строк.
   Гарантирован пол читаемости: >= 11px десктоп, >= 12px мобильные экраны.
   ============================================================================ */

@import url("./tokens.css?v=68");
@import url("./typography.css?v=68");

/* ============================================================================
   1. ТРЁХУРОВНЕВАЯ СИСТЕМА КОНТРАСТА LINEAR (PRIMARY / SECONDARY / MUTED)
   Ликвидация светового шума: градация яркости направляет фокус оператора.
   ============================================================================ */

/* 1a. Primary (Уровень 1 · 17:1 CR) — Ключевые заголовки, KPI, имена */
.text-primary,
.tx-primary,
.typo-primary,
.contrast-primary {
  color: var(--tx) !important;
}

/* 1b. Secondary (Уровень 2 · 12:1 CR) — Параграфы, описания, списки, пояснения */
.text-secondary,
.tx-secondary,
.typo-secondary,
.text-body,
.text-sub,
.contrast-secondary {
  color: var(--tx2) !important;
}

/* 1c. Muted / Tertiary (Уровень 3 · 7.05:1 CR) — Таймстампы, подписи, метаданные */
.text-muted,
.tx-muted,
.typo-muted,
.text-tertiary,
.text-dim,
.contrast-muted {
  color: var(--tx3) !important;
}

/* 1d. Warm Title (Laws of UX · 16.8:1 CR) — Тёплый пергаментный заголовок */
.text-warm-title,
.tx-warm-title,
.title-warm {
  color: var(--tx-warm-title) !important;
}

/* ============================================================================
   2. МЕРА СТРОКИ И ЧИТАЕМЫЕ КОЛОНКИ (60-75ch · GOLDEN READING CORRIDOR)
   Предотвращение утомления глаз при длительном мониторинге и аудите.
   ============================================================================ */

.prose-narrow,
.prose-55ch {
  max-width: var(--measure-prose-narrow, 55ch);
  line-height: var(--lh-normal, 1.5);
  word-break: break-word;
  overflow-wrap: anywhere;
}

.prose-60ch {
  max-width: var(--measure-prose, 60ch);
  line-height: var(--lh-normal, 1.5);
  word-break: break-word;
  overflow-wrap: anywhere;
}

.prose-65ch {
  max-width: var(--measure-prose-optimal, 65ch);
  line-height: var(--lh-normal, 1.5);
  word-break: break-word;
  overflow-wrap: anywhere;
}

.prose-70ch {
  max-width: 70ch;
  line-height: var(--lh-normal, 1.5);
  word-break: break-word;
  overflow-wrap: anywhere;
}

.prose-wide,
.prose-75ch {
  max-width: var(--measure-prose-wide, 75ch);
  line-height: var(--lh-normal, 1.5);
  word-break: break-word;
  overflow-wrap: anywhere;
}

.measure-prose,
.text-prose,
.text-column,
.prose-readable {
  max-width: min(100%, var(--measure-prose-optimal, 65ch));
  line-height: var(--lh-normal, 1.5);
  word-break: break-word;
  overflow-wrap: anywhere;
}

.prose-column,
.prose-container {
  max-width: min(100%, var(--measure-prose-wide, 75ch));
  line-height: var(--lh-normal, 1.5);
  word-break: break-word;
  overflow-wrap: anywhere;
}

/* ============================================================================
   3. КАНОНИЧЕСКАЯ ШКАЛА ТИПОГРАФИЧЕСКИХ УТИЛИТ (LINEAR / SHADCN SCALE)
   Все правила строго привязаны к каноническим типографическим токенам --fs-*.
   Десктопный пол: >= 11px (все канонические токены >= 12px).
   ============================================================================ */

/* 3a. Микро-размеры и бейджи (12px десктоп) */
.text-2xs,
.typo-2xs,
.fs-2xs {
  font-size: var(--fs-2xs);
}

.text-xs,
.typo-xs,
.fs-xs {
  font-size: var(--fs-xs);
}

.text-sm,
.typo-sm,
.fs-sm {
  font-size: var(--fs-sm);
}

.text-sub,
.typo-sub,
.fs-sub {
  font-size: var(--fs-sub);
}

/* 3b. Базовые текстовые размеры (13-14px десктоп) */
.text-body,
.typo-body,
.fs-body {
  font-size: var(--fs-body);
}

.text-base,
.typo-base,
.fs-base {
  font-size: var(--fs-base);
}

.text-md,
.typo-md,
.fs-md {
  font-size: var(--fs-md);
}

/* 3c. Заголовочные и акцентные размеры (16-26px десктоп) */
.text-h2,
.typo-h2,
.fs-h2 {
  font-size: var(--fs-h2);
}

.text-lg,
.typo-lg,
.fs-lg {
  font-size: var(--fs-lg);
}

.text-xl,
.typo-xl,
.fs-xl {
  font-size: var(--fs-xl);
}

.text-2xl,
.typo-2xl,
.fs-2xl {
  font-size: var(--fs-2xl);
}

.text-3xl,
.typo-3xl,
.fs-3xl {
  font-size: var(--fs-3xl);
}

.text-4xl,
.typo-4xl,
.fs-4xl {
  font-size: var(--fs-4xl);
}

/* ============================================================================
   4. СПЕЦИФИЧЕСКИЕ КЛАССЫ СЛУЖЕБНОГО ТЕКСТА, МЕТАДАННЫХ И ТАЙМСТАМПОВ
   ============================================================================ */

.text-timestamp,
.timestamp,
.meta-timestamp,
.time-stamp,
.event-timestamp {
  color: var(--tx3);
  font-size: var(--fs-sm);
  font-weight: 500;
  letter-spacing: 0.01em;
  line-height: 1.35;
}

.text-meta,
.meta-item,
.card-meta,
.meta-subtext {
  color: var(--tx3);
  font-size: var(--fs-sm);
  font-weight: 500;
  letter-spacing: 0.01em;
  line-height: 1.35;
}

.param-label,
.stat-label,
.unit-label {
  color: var(--tx3);
  font-size: var(--fs-sm);
  font-weight: 500;
  letter-spacing: 0.01em;
  line-height: 1.35;
}

/* ============================================================================
   5. ТАБЛИЧНЫЕ ЧИСЛА, МОНОШИРИННЫЙ ТЕКСТ И ПЕРЕНОСЫ
   ============================================================================ */

.tabular-numbers,
.tabular-nums {
  font-family: var(--mono) !important;
  font-variant-numeric: tabular-nums !important;
  -webkit-font-feature-settings: "tnum" 1;
  font-feature-settings: "tnum" 1;
}

.text-dense-row {
  font-size: var(--fs-base);
  line-height: var(--lh-snug);
  vertical-align: middle;
}

.text-mono {
  font-family: var(--mono) !important;
}

.text-truncate,
.truncate {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.text-clamp-2 {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.text-clamp-3 {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.text-nowrap {
  white-space: nowrap;
}

.text-wrap {
  word-break: break-word;
  overflow-wrap: anywhere;
}

/* ============================================================================
   6. ВЕСА ШРИФТОВ, ИНТЕРЛИНЬЯЖ И КЕРНИНГ (SHADCN / STRIPE TYPOGRAPHY UTILS)
   ============================================================================ */

.font-light { font-weight: 300 !important; }
.font-normal, .font-regular { font-weight: 400 !important; }
.font-medium { font-weight: 500 !important; }
.font-semibold { font-weight: 600 !important; }
.font-bold { font-weight: 700 !important; }
.font-extrabold { font-weight: 800 !important; }

.leading-none { line-height: 1 !important; }
.leading-tight { line-height: var(--lh-tight, 1.15) !important; }
.leading-snug { line-height: var(--lh-snug, 1.25) !important; }
.leading-normal { line-height: var(--lh-normal, 1.5) !important; }
.leading-relaxed { line-height: var(--lh-relaxed, 1.65) !important; }

.tracking-tight { letter-spacing: -0.02em; }
.tracking-snug { letter-spacing: -0.01em; }
.tracking-normal { letter-spacing: 0; }
.tracking-wide { letter-spacing: 0.02em; }
.tracking-wider { letter-spacing: 0.04em; }

.text-left { text-align: left; }
.text-center { text-align: center; }
.text-right { text-align: right; }

/* ============================================================================
   7. АКЦЕНТНЫЕ И СЕМАНТИЧЕСКИЕ ЦВЕТА ТЕКСТА
   ============================================================================ */

.text-inverse {
  color: var(--tx-inverse) !important;
}

.text-violet {
  color: var(--violet-light) !important;
}

.text-blue {
  color: var(--blue-light) !important;
}

.text-green {
  color: var(--green-light) !important;
}

.text-amber {
  color: var(--amber-light) !important;
}

.text-red {
  color: var(--red-light) !important;
}

/* ============================================================================
   8. НЕПРЕЛОЖНЫЙ ПОЛ ЧИТАЕМОСТИ (READABILITY FLOOR ENFORCEMENT)
   Стандарты WCAG 2.2 AAA и Samsung Galaxy (412x915):
   - Десктоп: строго не ниже 11px (все канонические токены >= 12px).
   - Мобильные (<= 600px): строго не ниже 12px.
   Гарантированно исключены любые значения font-size ниже 12px для мобильных и 11px для десктопа.
   ============================================================================ */

@media (max-width: 600px) {
  /* Все утилитные классы и элементы служебного текста принудительно удерживают пол 12px */
  .text-2xs,
  .text-xs,
  .text-sm,
  .text-sub,
  .typo-2xs,
  .typo-xs,
  .typo-sm,
  .typo-sub,
  .fs-2xs,
  .fs-xs,
  .fs-sm,
  .fs-sub,
  .text-timestamp,
  .timestamp,
  .meta-timestamp,
  .time-stamp,
  .event-timestamp,
  .text-meta,
  .meta-item,
  .card-meta,
  .meta-subtext,
  .param-label,
  .stat-label,
  .unit-label {
    font-size: var(--fs-2xs) !important;
  }
}
