/* ============================================================================
 * skin.css - ПРОЕКТНЫЙ СКИН compare-bento (comparecasinos.blog, 11.09.2026).
 *
 * Грузится последним (layout.php подключает assets/css/skin.css по наличию файла),
 * поверх tokens.css и skins.css заготовки: те два файла - движок и сверяются с
 * заготовкой по md5, свой скин в них не пишется. Здесь только ТОКЕНЫ: компоненты
 * (blocks.css) цвета не знают и живут на ролях.
 *
 * Направление - bento-карточки с данными (решение владельца 11.09.2026 из трёх
 * предложенных). Палитра: холодный нейтральный светлый фон, белые карточки, чернила,
 * один акцент - кобальт (кнопки, ссылки, активный пункт), золото только как цвет
 * ДАННЫХ (балл лидера, победитель пары) и никогда как второй акцент интерфейса;
 * зелёный и красный - только W/L и полосы оценок. Контраст текстовых пар считает
 * шаблоны/tools/контраст.py (ждём код 0): --text-mute на --bg 6.2, --brand на --surface
 * 6.4, белый на --brand 6.4, --text-faint по порогу 3.0 - 3.6.
 *
 * Шрифты: display - Manrope 800 (кириллица фактом, файлы в assets/fonts), текст -
 * Onest (переменный 100-900). Оба self-hosted, @font-face в skins.css заготовки.
 *
 * Правило форм (shape lock): карточки и плитки - 20px, вложенные плашки - 12px,
 * кнопки и чипы - пилюля. Смешивать нельзя: круглые кнопки на квадратной сетке и
 * квадратные карточки на пилюлях - две разные страницы в одной.
 * ========================================================================== */

html[data-skin="compare-bento"] {
  color-scheme: light;

  --bg:        #f4f5f8;
  --bg-2:      #eceef3;
  --bg-3:      #e2e5ec;
  --surface:   #ffffff;
  --surface-2: #f7f8fb;
  --surface-3: #eef0f5;

  --text:       #12141a;
  --text-dim:   #2c3140;
  --text-mute:  #555c6e;
  --text-faint: #5f667a;   /* 4.5+ на --bg-2: Lighthouse 11.09.2026 (заготовка красит им подписи подвала и полосы даты) */
  --on-brand:   #ffffff;

  --rule:        #d5d9e3;
  --rule-strong: #b3bac9;
  --hairline:    1px solid var(--rule);

  --brand:      #2547d0;
  --brand-2:    #1b3aa8;
  --brand-soft: rgba(37, 71, 208, .09);
  --accent:     #2547d0;
  --gold:       #9a6a00;
  --highlight-pale: #eef1fb;

  --success:      #15803d;  --success-soft: rgba(21, 128, 61, .11);
  --danger:       #c0392b;  --danger-soft:  rgba(192, 57, 43, .11);
  --warning:      #9a6a00;  --warning-soft: rgba(154, 106, 0, .13);
  --info:         #2547d0;  --info-soft:    rgba(37, 71, 208, .10);
  /* Чернила на мягких подложках оценок: Lighthouse 11.09.2026 нашёл 4.4 у зелёного на
   * зелёной плашке и 2.6 у знаменателя с opacity .6. Плашки красятся этими, не --success. */
  --success-ink:  #0f5a2f;
  --info-ink:     #1b3aa8;
  --warning-ink:  #6e4a00;
  --rating-from:  var(--danger);
  --rating-to:    var(--success);

  /* Тени тонированы в оттенок фона (не чёрные): карточка лежит на бумаге, а не висит. */
  --surface-hi:   rgba(255,255,255,.95);
  --shadow-card:  0 1px 2px rgba(18,20,26,.05), 0 10px 30px -18px rgba(37,71,208,.18);
  --shadow-pop:   0 4px 10px -4px rgba(18,20,26,.10), 0 24px 50px -16px rgba(37,71,208,.22);
  --shadow-lift:  0 30px 60px -18px rgba(37,71,208,.26);
  --shadow-glow:  0 10px 30px -12px rgba(37,71,208,.45);
  --glass-bg:     rgba(255,255,255,.84);
  --glass-border: rgba(213,217,227,.7);

  /* Градиент кнопок - почти плоский: кобальт в кобальт потемнее, без «AI-свечения». */
  --grad-brand:   linear-gradient(135deg, var(--brand), var(--brand-2));
  --grad-text:    none;
  --surface-grad: none;
  --ambient:      none;

  /* Геометрия скина (shape lock, шапка файла). */
  --r-md:  12px;
  --r-lg:  20px;
  --r-xl:  24px;

  /* Шкала заголовков чуть плотнее заготовки: bento живёт на числах, не на лозунгах. */
  --t-h1: clamp(1.9rem, 4.4vw, 3.1rem);
  --t-h2: clamp(1.4rem, 2.4vw, 1.85rem);
  --lh-tight: 1.08;

  --font-display: "Manrope", "Inter", system-ui, sans-serif;
  --font-body:    "Onest", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-mono:    "JetBrains Mono", "SF Mono", Menlo, Consolas, monospace;
}

/* Тёмного варианта у скина нет по решению владельца (06.09.2026: сайт только светлый,
 * 'единственная_тема' => 'light' в config/site.php - кнопки темы нет, инлайн-скрипт не
 * печатается). Пустое правило стоит ради контраст.py и канона В25: «у каждого скина
 * есть dark-вариант или явное пустое правило с объяснением». */
html[data-skin="compare-bento"][data-mode="dark"] { /* тема заперта светлой, см. выше */ }