/*
 * Это manifest-файл. Ассеты сервятся как есть, без препроцессинга.
 * Стили приложения держим в Tailwind (app/assets/tailwind/application.css).
 * Здесь — только vendor-стили, которые невозможно/нерационально пропускать
 * через Tailwind: например, CSS сторонних JS-виджетов, и объявления шрифтов.
 *
 * ⚠ Пайплайн — Sprockets, НЕ Propshaft (PE-685). Propshaft в Gemfile есть, но раздачей не
 * занимается: sassc-rails (стоит ради ActiveAdmin) тянет sprockets-rails, и он перехватывает
 * хелперы. Проверить: `bin/rails runner 'puts Rails.application.assets.class'` → Sprockets::Environment.
 * Прежняя формулировка этой шапки («Propshaft сервит ассеты») ввела в заблуждение целую редакцию
 * архитектуры PE-685 — поэтому здесь теперь сказано прямо. Подробности — runbooks/asset-delivery.md.
 */

/* Tom Select base — enhanced <select>. Поверх — Sparkles-override (PE-58).
   ⚠ @import обязан оставаться ПЕРВЫМ at-rule файла: правило CSS требует, чтобы @import шёл до
   любых других правил. Блок @font-face ниже — именно ниже по этой причине; если поставить его
   выше, @import станет невалидным и все стили Tom Select молча исчезнут (закреплено спекой). */
@import url(/assets/tom_select-9a5b7e9b43283671e365adaae84bcb3d1bd6ee46b46989c252905811760f75b7.css);

/* ─────────────────────────────────────────────────────────────────────────────────────────
   ШРИФТЫ (PE-685). Раньше приходили с чужих серверов: Inter — @import на rsms.me первой строкой
   Tailwind-бандла (render-blocking на каждом экране), остальные — <link> на Google Fonts в
   четырёх лейаутах. Теперь свои файлы, ноль внешних origin.

   Объявления живут ЗДЕСЬ, потому что application.css подключён ВСЕМИ шестью лейаутами
   (application, home, auth, landing, job_graph, result_showcase) — тот же довод, по которому
   сюда же положено правило от iOS-зума (PE-264, ниже в файле). Отдельный fonts.css через
   @import вернул бы ровно ту цепочку загрузки, которую задача и убирает.

   ⚠ Путь в url() — ЛОГИЧЕСКИЙ, а не относительный: каждый подкаталог app/assets — свой корень
   load path, поэтому префикс `fonts/` в пути не участвует, а физически файлы лежат в
   app/assets/fonts/. Дайджест подставляет Sprockets::Rails::AssetUrlProcessor.
   Пересборка подмножества Inter — script/build_fonts.sh.
   ───────────────────────────────────────────────────────────────────────────────────────── */

/* Inter — основной шрифт интерфейса. Один вариативный файл на все начертания и оба алфавита:
   unicode-range не нужен, потому что подмножество собрано под проект целиком (латиница,
   кириллица, типографика, стрелки, ✓, ★, ⚠, ₽, №, Δ). 82 876 байт против 340 456 у трёх
   статических файлов rsms.me. Ось opsz запинена в 14 — сегодняшняя статика осей не имела вовсе. */
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(/assets/inter/InterVariable-pe-ea45584dd82b9503bd42d611f1619050cac36b80bf08ea9cfd74af61c33213dc.woff2) format("woff2");
}

/* Source Serif 4 — серифовый дисплей (главная, реквизиты, вход, ds-skin). Подмножества взяты у
   fontsource и побайтово совпадают с тем, что отдавал Google (latin 122 360, cyrillic 93 440) —
   это точный паритет облика, включая ось оптического размера (opsz), которую Google тоже отдаёт.
   unicode-range скопирован из upstream-CSS дословно: сочинять его руками нельзя, самописный
   диапазон тихо теряет глифы. */
@font-face {
  font-family: "Source Serif 4";
  font-style: normal;
  font-weight: 200 900;
  font-display: swap;
  src: url(/assets/source-serif-4/latin-10dcaaa1bca995273c3f90e30002a383f65c4016e26bafcaa4db06e819a7fa76.woff2) format("woff2");
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face {
  font-family: "Source Serif 4";
  font-style: normal;
  font-weight: 200 900;
  font-display: swap;
  src: url(/assets/source-serif-4/cyrillic-00e4bf5a65fd51cf7453edd0026d8c6ae46a874621f49205b7cf79056f4d43f8.woff2) format("woff2");
  unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}

/* IBM Plex Mono — моно-начертание дизайн-системы. Вариативного релиза у семейства нет, поэтому
   статика: ровно те два веса, что использует CSS (400 и 600). */
@font-face {
  font-family: "IBM Plex Mono";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/ibm-plex-mono/latin-400-6fd5b09f645f4797050ea119710021d7c050d8c19407f0aac100af847a00b157.woff2) format("woff2");
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face {
  font-family: "IBM Plex Mono";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/ibm-plex-mono/cyrillic-400-bcd4f8346428f9d98ec05ba53788e4c91eb9809bfe7c545b9d4de8aad3374082.woff2) format("woff2");
  unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}
@font-face {
  font-family: "IBM Plex Mono";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/assets/ibm-plex-mono/latin-600-cf2d10988e29ac2565171ccc5cd4e5913187b5192eba478fc4a2abfafc1e1044.woff2) format("woff2");
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face {
  font-family: "IBM Plex Mono";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/assets/ibm-plex-mono/cyrillic-600-32dcb14af18713831d9017767666b1e1d62daa38ceb9828d94f5295a9e81e834.woff2) format("woff2");
  unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}

/* Newsreader и Mulish — только тема «Глина» (design-system/clay.css). Она спит без
   data-theme="clay", и браузер не качает неиспользуемый @font-face — то есть тем, кто её не
   выбрал, эти файлы не стоят ни байта. Довезены ради паритета: без них облик выбравших тему
   тихо откатился бы на Georgia и системный гротеск.
   ⚠ У Newsreader кириллицы нет вовсе (в пакете только latin/latin-ext/vietnamese) — русский
   текст в «Глине» и сегодня рисуется запасным шрифтом, это не регресс задачи. */
@font-face {
  font-family: "Newsreader";
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url(/assets/newsreader/latin-34e9b64bdf9a9271e7f959590cd6e497e20eefdd77b8f26767e01b169c418be3.woff2) format("woff2");
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face {
  font-family: "Mulish";
  font-style: normal;
  font-weight: 200 1000;
  font-display: swap;
  src: url(/assets/mulish/latin-7bf09e8b37896e6a3455200d563ab9af767761bbd3405a5427917e414445176c.woff2) format("woff2");
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face {
  font-family: "Mulish";
  font-style: normal;
  font-weight: 200 1000;
  font-display: swap;
  src: url(/assets/mulish/cyrillic-142ff70089a3e9f4beae4e11c6ebfea6356704aef6237f408f84f6d42825722e.woff2) format("woff2");
  unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}

/* Sparkles-override Tom Select: hairline-границы, 10px радиусы, genius-акценты.
   Tom Select оборачивает <select> в <div class="ts-wrapper">; контрол (видимая
   часть) — `.ts-control`, выпадающий список — `.ts-dropdown`. Tailwind-классы
   из field_cls не применяются к wrapper'у, поэтому стилизуем здесь. */
.ts-wrapper.single .ts-control,
.ts-wrapper.multi .ts-control {
  border: 1px solid var(--color-silver, #e5e5e5);
  border-radius: 0.5rem; /* rounded-lg */
  background: var(--color-cloud, #ffffff);
  padding: 0.6rem 1rem;
  min-height: 2.875rem; /* совпадает с py-3 в field_cls */
  color: var(--color-inkwell, #0a0a0a);
  font-family: var(--font-sans, "Inter", system-ui, sans-serif);
  font-size: 1rem;
  box-shadow: none;
}

.ts-wrapper.single.focus .ts-control,
.ts-wrapper.multi.focus .ts-control,
.ts-wrapper.single .ts-control:focus-within,
.ts-wrapper.multi .ts-control:focus-within {
  border-color: var(--color-sky-violet-400, #8b93a1);
  /* Двойной ring — белая подложка + графитовый контур; обеспечивает WCAG 3:1
     contrast на белом и цветных фонах, видим при keyboard-focus. */
  box-shadow: 0 0 0 1px var(--color-cloud, #ffffff),
              0 0 0 3px var(--color-sky-violet-400, #8b93a1);
  outline: none;
}

.ts-wrapper.disabled .ts-control {
  opacity: 0.6;
  cursor: not-allowed;
}

.ts-control > input::placeholder {
  color: rgba(10, 10, 10, 0.4);
}

.ts-dropdown {
  border: 1px solid var(--color-silver, #e5e5e5);
  border-radius: 0.5rem;
  background: var(--color-cloud, #ffffff);
  box-shadow: 0 6px 24px -8px rgba(10, 10, 10, 0.12);
  font-family: var(--font-sans, "Inter", system-ui, sans-serif);
  font-size: 0.875rem;
  margin-top: 4px;
  padding: 4px 0;
  /* PE-94: dropdown переехал в <body> через dropdownParent, нужен явный z-index
     выше любых модалок/панелей графа (turbo-confirm идёт на 200, панели — 120). */
  z-index: 1000;
  /* PE-94: ограничение высоты + внутренний скролл — при длинных списках
     (десятки опций для parent_id) dropdown не тянется на пол-экрана. */
  max-height: min(50vh, 320px);
  overflow-y: auto;
}

.ts-dropdown .option {
  padding: 0.45rem 1rem;
  color: var(--color-inkwell, #0a0a0a);
  cursor: pointer;
  /* Word-wrap длинных формулировок работ — иначе dropdown в узкой панели
     графа (~250px) пытается растянуться по самому длинному option и вылазит
     за viewport (PE-19 второй возврат). */
  white-space: normal;
  word-break: break-word;
  line-height: 1.35;
}

.ts-dropdown .option:hover,
.ts-dropdown .option.active {
  background: var(--color-genius-50, #eef7f0);
  color: var(--color-genius-900, #1f4a2b);
}

.ts-dropdown .option.selected {
  background: var(--color-genius-100, #dcefe1);
  color: var(--color-genius-900, #1f4a2b);
  font-weight: 600;
}

.ts-dropdown .optgroup-header {
  padding: 0.5rem 1rem 0.25rem;
  font-size: 0.6875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: rgba(10, 10, 10, 0.45);
  background: transparent;
  border-top: 1px solid var(--color-silver, #e5e5e5);
}

.ts-dropdown .optgroup:first-child .optgroup-header {
  border-top: none;
}

.ts-dropdown .no-results {
  padding: 0.6rem 1rem;
  color: rgba(10, 10, 10, 0.5);
  font-size: 0.875rem;
  font-style: italic;
}

.ts-dropdown .create {
  padding: 0.45rem 1rem;
  color: var(--color-genius-500, #429158);
}

/* Карет / стрелка раскрытия. Tom Select добавляет ::after — переопределяем. */
.ts-wrapper.single .ts-control::after {
  border-color: var(--color-inkwell, #0a0a0a) transparent transparent transparent;
}
.ts-wrapper.single.dropdown-active .ts-control::after {
  border-color: transparent transparent var(--color-inkwell, #0a0a0a) transparent;
}

/* PE-100: блок оценки AI-генерации (звёзды + комментарий).
   Универсальный — показывается на странице любого Generation. */
.feedback-block {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.feedback-title {
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--color-inkwell, #0a0a0a);
  opacity: 0.7;
  margin: 0;
}
.feedback-hint {
  font-size: 13px;
  color: var(--color-inkwell, #0a0a0a);
  opacity: 0.6;
  margin: 0;
}
.feedback-saved {
  font-size: 14px;
  margin: 0;
  color: var(--color-inkwell, #0a0a0a);
}
.feedback-saved-comment {
  font-size: 13px;
  opacity: 0.7;
  font-style: italic;
}
.feedback-form {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.feedback-form.is-hidden {
  display: none;
}
.feedback-errors {
  list-style: disc;
  padding-left: 20px;
  color: #b04040;
  font-size: 13px;
  margin: 0;
}

/* Звёзды через CSS-trick: радио в обратном порядке (5..1) +
   row-reverse → визуально 1..5 → при :checked/:hover подсветка
   через ~ селектор затрагивает следующие в DOM = слева в визуальном. */
.feedback-stars {
  display: inline-flex;
  flex-direction: row-reverse;
  justify-content: flex-end;
  gap: 4px;
  border: none;
  padding: 0;
  margin: 0;
}
.feedback-stars input[type="radio"] {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.feedback-stars label {
  cursor: pointer;
  font-size: 28px;
  line-height: 1;
  color: var(--color-silver, #d4d4d8);
  transition: color 120ms;
  user-select: none;
}
.feedback-stars label:hover,
.feedback-stars label:hover ~ label,
.feedback-stars input:checked ~ label,
.feedback-stars input:checked + label {
  color: oklch(0.78 0.14 80);  /* мягкий янтарь */
}
.feedback-stars input:focus-visible + label {
  outline: 2px solid var(--color-sky-violet-400, #8b93a1);
  outline-offset: 2px;
  border-radius: 4px;
}

.feedback-comment-row {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.feedback-label {
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--color-inkwell, #0a0a0a);
  opacity: 0.5;
}
.feedback-textarea {
  width: 100%;
  border: 1px solid var(--color-silver, #d4d4d8);
  border-radius: 0.5rem;
  padding: 0.6rem 0.8rem;
  background: var(--color-cloud, #ffffff);
  font-family: var(--font-sans, "Inter", system-ui, sans-serif);
  font-size: 13px;
  resize: vertical;
}
.feedback-textarea:focus {
  outline: none;
  border-color: var(--color-sky-violet-400, #8b93a1);
  box-shadow: 0 0 0 3px rgba(139, 147, 161, 0.2);
}
.feedback-submit {
  align-self: flex-start;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* ── PE-264: iOS Safari auto-zoom — единый глобальный фикс ──────────────────
   iOS Safari принудительно зумит viewport при фокусе на form-контроле с
   font-size < 16px. Контролы приложения — text-sm (14px) / Tom-Select search-
   input (13px из tom_select.css). Живёт ЗДЕСЬ (а не в responsive.css), т.к.
   application.css грузится ВСЕМИ layout'ами — включая публичный landing
   (`/l/:token`, layout "landing"), куда responsive.css НЕ подключён. Статический
   Propshaft-файл → не зависит от пересборки Tailwind-билда (грабля stale-build
   PE-457/478). Консолидирует прежнее частичное правило PE-338 (было в
   responsive.css, покрывало лишь 2/3 layout'ов).

   Только мобайл (≤767.98px — рубеж responsive.css/PE-338): десктоп-плотность
   text-sm на owner-инпутах намеренная, не трогаем. iPad ≥768px portrait —
   вне scope (пилот = телефон). Опора на !important (а не cascade-порядок —
   application.css грузится первой). Tom-Select: фокус-таргет — прямой <input>
   внутри .ts-control (single/multi search); plugin dropdown_input не
   используется (иначе поле переедет в .dropdown-input — не покрыто). */
@media (max-width: 767.98px) {
  input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="range"]),
  select,
  textarea,
  .ts-control > input {
    font-size: 16px !important;
  }
}

/* ── PE-661: знак-плитка «Восхождение» в шапке app-layout ───────────────────
   Логотип-марка приложения = ФИКСИРОВАННЫЙ бренд-ассет, НЕ перекрашивается под
   скин/тему. Литеральный hex намеренно (НЕ bg-genius-*): под .ds-skin мост
   legacy-bridge.css ремапит --color-genius-400 → var(--accent) → плитка «уехала»
   бы в акцент активной темы (Forest/Clay). Единственный зелёный #54b16c,
   радиус 14% (как icon.svg rx=72 на 512). Знак — белый inline-SVG внутри
   (партиал shared/_brand_mark).
   PE-894: подложка `box-shadow: 0 2px 0 #429158` снята — ответ дизайнера от 14.08,
   он признал её ошибкой собственной инструкции: #429158 это genius-500, интерфейсный
   оттенок Tailwind, а не бренд-цвет (в знаке два цвета — зелёный и белый). Плюс тень
   делала занимаемую высоту 34px при заявленных 32: плитка выпадала из ряда
   32-пиксельных элементов, а `0 2px 0` — язык кнопки, тогда как знак ничего не делает,
   кроме перехода на главную. На лендинге, в реквизитах и в письме тени не было — эта
   правка сводит все места к одному облику вычитанием. */
.pe-mark { background: #54b16c; border-radius: 14%; }
/* Знак — ~72% плитки (вариант D владельца PE-661): крупнее, но полый узел не касается
   скруглённого угла. Пара «tight viewBox 7 7 50 50 (реальный bbox знака) + svg 72%». */
.pe-mark svg { display: block; width: 72%; height: 72%; }

/* ── PE-894: локап «знак + имя». Набор дизайнера от 14.08 — один на все контексты:
   лендинг, кабинет, витрина тарифов, экраны входа. До этого их было четыре разных
   (Inter 600/16, Inter 800/18, Source Serif 4 700/17, Georgia 700/18) — «не решение,
   а история правок», по его формулировке. Кегль 20 подобран по оптическому центру
   плитки 32, зазор 10 — тот, что уже стоял на лендинге.
   ⚠ Гарнитура ЛИТЕРАЛЬНАЯ, не var(--ds-font-display): под скином Clay токен уводится
   в Newsreader (design-system/clay.css:11), и кабинет с витриной разъехались бы с
   лендингом и входом, где скин не ставится. Имя — часть бренд-ассета, ровно как
   литеральный #54b16c у плитки выше. Цвет, наоборот, токеном: он обязан следовать теме.
   В письме тот же кегль, но Georgia — Source Serif 4 в почте не загрузится (инлайном
   в layouts/mailer.html.erb). */
.pe-wordmark { font-family: 'Source Serif 4', Georgia, 'Times New Roman', serif; font-weight: 600;
  font-size: 20px; line-height: 1; letter-spacing: -0.01em; color: var(--fg-1); white-space: nowrap; }
.pe-lockup { display: inline-flex; align-items: center; gap: 10px; position: relative; }