/* Небольшие дополнения к app.css для реального приложения: контекст-блок в рэйле,
   ошибки форм, поля интеграций. Базовая дизайн-система — в app.css (прототип). */
.ctxbox { margin: 0 14px 10px; padding: 10px 12px; background: var(--sunk); border: 1px solid var(--rule); border-radius: 4px; }
.ctxbox .who { font-size: 13px; font-weight: 600; color: var(--ink); }
.ctxbox .role { font-size: 11px; color: var(--rail-dim); font-family: "IBM Plex Mono", ui-monospace, Consolas, monospace; letter-spacing: .06em; text-transform: uppercase; }
.ctxbox select { width: 100%; margin-top: 8px; font: inherit; font-size: 13px; padding: 6px 8px; border: 1px solid var(--rule); border-radius: 3px; background: var(--panel); color: var(--ink); }
.err { background: var(--stop-bg); color: var(--stop); border: 1px solid var(--stop); border-radius: 2px; padding: 8px 12px; font-size: 13px; margin: 0 0 12px; }
.ok-banner { background: var(--go-bg); color: var(--go); border: 1px solid var(--go); border-radius: 2px; padding: 8px 12px; font-size: 13px; margin: 10px 0 0; }
.testresult { margin-top: 10px; font-family: "IBM Plex Mono", ui-monospace, Consolas, monospace; font-size: 12.5px; padding: 8px 12px; border-radius: 2px; }
.testresult.ok { background: var(--go-bg); color: var(--go); }
.testresult.fail { background: var(--stop-bg); color: var(--stop); }
.intsec { max-width: 640px; }
.intsec .card h3 { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
.secretrow { display: flex; gap: 8px; align-items: center; }
.secretrow .cur { font-family: "IBM Plex Mono", ui-monospace, Consolas, monospace; font-size: 12px; color: var(--ink-faint); }
.pill[aria-pressed="true"] { border-color: var(--accent); background: var(--accent-soft); color: var(--accent); }
.pill { cursor: pointer; }
.spin { display: inline-block; width: 12px; height: 12px; border: 2px solid var(--rule); border-top-color: var(--accent); border-radius: 50%; animation: sp .7s linear infinite; vertical-align: -2px; }
@keyframes sp { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .spin { animation: none; } }
.empty-state { padding: 28px 16px; text-align: center; color: var(--ink-faint); font-size: 13.5px; }

/* ── правки «что уезжает» ────────────────────────────────────────────── */
/* .bar задаёт display:flex и перебивал атрибут hidden — панель фильтров
   висела на всех экранах и пустой полосой в админке */
.bar[hidden], .view[hidden], #ctx[hidden], #logout[hidden], #ctxbox[hidden] { display: none !important; }
/* две матрицы разбора даты: колонки не должны расти под содержимое —
   иначе правая матрица уезжает за экран; скролл внутри .inner */
.pair { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.mx { min-width: 0; }
.mx h3 { flex-wrap: wrap; row-gap: 2px; }
.mx h3 .nm { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%; }
/* длинные названия объекта в шапке и в выборе конкурента */
#ctx { max-width: 460px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#ctx b { overflow: hidden; text-overflow: ellipsis; }
#rivalsel { max-width: 320px; overflow: hidden; text-overflow: ellipsis; }
/* KPI: подпись не должна разъезжать плитки по высоте */
.kpi .k { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.kpi { min-height: 78px; }
/* образцы шкалы в легенде: в app.css цвета заданы только для td.cell и .ico */
.sw.d3 { background: var(--c3); } .sw.d2 { background: var(--c2); } .sw.d1 { background: var(--c1); } .sw.d0 { background: var(--c0); }
.sw.u1 { background: var(--w1); } .sw.u2 { background: var(--w2); } .sw.u3 { background: var(--w3); }
/* сетка «конкуренты»: пропорция колонок классом, чтобы медиа-запрос ≤1000px её сворачивал */
.grid2-wide { grid-template-columns: 1.2fr .8fr; }
@media (max-width: 1000px) { .grid2-wide { grid-template-columns: 1fr; } }
/* длинный e-mail в рэйле */
.ctxbox .who { overflow-wrap: anywhere; }
/* всплывающее сообщение об ошибке действия */
.toast { position: fixed; left: 50%; bottom: 22px; transform: translateX(-50%); z-index: 50; padding: 10px 16px; border-radius: 3px; font-size: 13.5px; box-shadow: var(--shadow); max-width: 70vw; }
.toast.err { background: var(--stop-bg); color: var(--stop); border: 1px solid var(--stop); }
.toast.ok { background: var(--go-bg); color: var(--go); border: 1px solid var(--go); }
.toast[hidden] { display: none; }
/* подвал рэйла — полное имя переносом, без обрезания посреди слова */
.rail-foot { white-space: normal; overflow-wrap: anywhere; }