/* =========================================================================
   Главная — перекраска под брендбук v3 «Тушь и янтарь».
   Разметка, состав и город главной не меняются. Закреплённый CSS главной
   (/assets/home-*.css из сборки 20260926T205914Z) задаёт часть цветов
   литералами; здесь они переведены на токены. Меняются только цвета:
   размеры, положение и маски кадра города остаются как в закреплённой сборке.
   ========================================================================= */

/* ---- Кадр города на первом экране -------------------------------------- */
/* Кадр города светлый в обеих темах, поэтому внутри него — светлые значения
   токенов (закреплённый CSS переопределял здесь --ink, --line и --yellow). */
.city-frame {
  --ink: #1D1B19;
  --ink-soft: #3D3A36;
  --muted: #67625B;
  --line: #DCE1E2;
  --line-strong: #B8BDBE;
  --card: #FFFFFF;
  --paper-2: #F0F3F4;
  --yellow: #F7E5CC;
  --on-surface: #1D1B19;
  --focus-ring: #1D1B19;
  color: var(--ink);
}
:where(.city-frame) :is(a, button, canvas):focus-visible { outline-color: var(--focus-ring); }

.city-fullscreen-link {
  color: var(--ink-soft);
  background: var(--card);
  border-color: var(--line-strong);
}
.city-fullscreen-link:hover { color: var(--ink); background: var(--paper-2); }

.city-topline .eyebrow {
  color: var(--ink-soft);
  background: var(--card);
  border-color: var(--line);
}
.city-year {
  color: var(--on-surface);
  border-color: var(--line-strong);
  box-shadow: 0 2px 0 var(--line-strong);
}
.city-caption { color: var(--ink-soft); }
.city-help { color: var(--muted); }

.city-toolbar {
  background: var(--card);
  border-color: var(--line-strong);
  box-shadow: 0 2px 0 var(--line-strong);
}
.city-toolbar button:hover { background: var(--paper-2); }

.city-error { background: var(--card); color: var(--ink); }
.city-error button { background: var(--action); color: var(--on-action); }

/* ---- Форма и список на острове CTA -------------------------------------- */
.cta-list li { border-top-color: var(--island-line); }
.field label { color: var(--on-island-soft); }
.field input,
.field textarea { background: var(--island-chip); }
.field input::placeholder,
.field textarea::placeholder { color: var(--on-island-muted); }
.form-note { color: var(--on-island-soft); }

/* ---- Шапка: переключатель темы как на остальных страницах ---------------- */
/* Закреплённый CSS главной оформляет .theme-toggle прежней «таблеткой» и
   сжимает значок; возвращаем общий вид из styles.css. */
.theme-toggle {
  display: inline-grid; place-items: center; flex: none; gap: 0;
  width: 40px; height: 40px; min-width: 0; min-height: 0; padding: 0;
  border: 1.5px solid var(--action-line); border-radius: var(--radius-sm);
  background: none; color: var(--ink); font-size: 0;
}
.theme-toggle:hover { background: var(--paper-2); border-color: var(--ink); }
.theme-toggle .theme-toggle__icon { flex: none; width: 16px; height: 16px; font-size: 0; }
@media (pointer: coarse) {
  .theme-toggle { width: 44px; height: 44px; }
}

/* ---- Приглушённые стрелки и подписи: цвет вместо прозрачности ----------- */
/* Закреплённый CSS приглушает их opacity; на новой палитре это ниже 4,5:1. */
.nav-link .caret { opacity: 1; color: var(--muted); }
.directions .card-arrow { opacity: 1; color: var(--secondary-on-surface); }
.quote-flow .sticker cite { opacity: 1; color: var(--secondary-on-surface); }
.directions .card-dark .card-arrow { color: var(--on-island-soft); }