/* Интерфейс судейской системы. Адаптив: телефон / планшет / ПК.

   Тема «Стекло»: светлый цветной фон-туман, полупрозрачные карточки и шапка
   с размытием, кнопки-таблетки. Логотип — логотип РРО (static/img/rro-logo*.png,
   favicon.png); иллюстрации — свои SVG (баннер главной, поле на входе).
   Системные шрифты (ничего не скачивается); анимируются только цвета.
   Прежний вид (белая шапка, серый фон) — тег git ui-classic.
   Цвета — переменными ниже, вся палитра в одном месте. */
:root {
  --bg: #eef2ff;
  --panel: rgba(255, 255, 255, .62);      /* стекло: карточки, таблицы */
  --panel-solid: #ffffff;                 /* поверх контента: списки, окна, тосты */
  --glass-border: rgba(255, 255, 255, .8);
  --line: rgba(79, 70, 229, .13);
  --line-strong: rgba(79, 70, 229, .26);
  --text: #1b1f24;
  --muted: #646b75;
  --soft: rgba(255, 255, 255, .55);   /* мягкий фон (метки, шапки таблиц) */
  --soft-hover: rgba(255, 255, 255, .85);
  --btn: rgba(255, 255, 255, .75);    /* обычная кнопка — белое стекло с рамкой */
  --btn-hover: #ffffff;
  --btn-line: rgba(79, 70, 229, .22);
  --accent: #4f46e5;
  --accent-hover: #4338ca;
  --accent-soft: rgba(99, 102, 241, .12);
  /* главная кнопка — сплошной синий, без градиента (просьба заказчика, 20.10.2026) */
  --primary-grad: #6366f1;
  --primary-grad-hover: #4f46e5;
  --mesh: radial-gradient(at 12% 18%, #c7d2fe 0, transparent 45%),
          radial-gradient(at 88% 8%, #fbcfe8 0, transparent 40%),
          radial-gradient(at 75% 85%, #a5f3fc 0, transparent 45%),
          radial-gradient(at 20% 90%, #ddd6fe 0, transparent 40%), #eef2ff;
  --glass-shadow: 0 8px 32px rgba(79, 70, 229, .1);
  --ok: #146c35;
  --ok-soft: #e6f4ea;
  --err: #a32020;
  --err-soft: #fbe9e8;
  --warn: #8a5a00;
  --warn-soft: #fbf1df;
  --violet: #5b3fa3;
  --violet-soft: #efeafa;
  --teal: #0b6a6a;
  --teal-soft: #e2f3f2;
  --bday: #9d174d;          /* дни рождения в меню мероприятия */
  --bday-soft: #fce7f3;
  --bday-bg: #fdf2f8;
  --bday-line: #f9a8d4;
  --radius: 12px;
  --radius-lg: 20px;
  --ring: 0 0 0 3px rgba(79, 70, 229, .25);
}
* { box-sizing: border-box; }
/* Длинные адреса почты, логины и ссылки переносятся, а не вылезают за край */
body { overflow-wrap: break-word; }
img, svg, video, canvas { max-width: 100%; height: auto; }
/* Текстовые блоки в строках сжимаются и переносятся, кнопки — никогда:
   надпись не вылезает за рамку кнопки, строка просто переносится ниже */
.spread > div, .spread > section, .row > div { min-width: 0; }
.row > button, .row > .btn, .spread > button, .spread > .btn,
.actions > button, .actions > .btn { flex-shrink: 0; }
summary { cursor: pointer; color: var(--accent); font-weight: 600; padding: .15rem 0; }
summary:hover { text-decoration: underline; text-underline-offset: 2px; }

/* Мелкие служебные классы вместо style="…" в шаблонах: CSP (style-src 'self')
   не даёт браузеру применять встроенные стили, поэтому только классами. */
.m-0 { margin: 0 !important; }
.mt-0 { margin-top: 0 !important; }
.mt-s { margin-top: .3rem; }
.mt { margin-top: .6rem; }
.mt-l { margin-top: .9rem; }
.mt-xl { margin-top: 1.5rem; }
.mb-s { margin-bottom: .6rem; }
.mb { margin-bottom: 1.1rem; }
.my-l { margin: .6rem 0 1.5rem; }
.text-err { color: var(--err); }
.dim { opacity: .55; }
.page-420, .card.page-420 { max-width: 420px; margin: 2rem auto; }
.page-760 { max-width: 760px; margin: 1.5rem auto; }
.max-680 { max-width: 680px; }
.grow { flex: 1 1 220px; }
.w-auto { width: auto; }
.w-6 { width: 6rem; }
.w-7 { width: 7rem; }
.w-5 { width: 5rem; }
.w-10 { max-width: 10em; }
.w-12 { width: 100%; max-width: 12rem; }
html, body { margin: 0; padding: 0; }
body {
  background: var(--mesh); background-attachment: fixed;
  color: var(--text);
  font: 15px/1.5 system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
}
a { color: var(--accent); text-decoration-color: rgba(79, 70, 229, .35); text-underline-offset: 2px; }
a:hover { text-decoration-color: currentColor; }
h1, h2, h3 { line-height: 1.25; letter-spacing: -.01em; }
h1 { font-size: 1.45rem; font-weight: 700; margin: 0 0 .8rem; }
h2 { font-size: 1.12rem; font-weight: 650; margin: 1.3rem 0 .6rem; }
h3 { font-size: .98rem; font-weight: 650; margin: 1rem 0 .45rem; }
.card > h2:first-child, .card > h3:first-child { margin-top: 0; }
p { margin: .5rem 0; }
.muted { color: var(--muted); }
.small { font-size: .85rem; }
.nowrap { white-space: nowrap; }
.pre { white-space: pre-wrap; }
strong { font-weight: 650; }

/* ---------- Шапка ---------- */
.top {
  display: flex; align-items: center; gap: .9rem; flex-wrap: wrap;
  background: rgba(255, 255, 255, .55); border-bottom: 1px solid var(--glass-border);
  -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px);
  padding: .55rem 1rem; position: sticky; top: 0; z-index: 20;
}
.brand { display: inline-flex; align-items: center; gap: .55rem;
  font-weight: 700; text-decoration: none; color: var(--text); letter-spacing: -.01em; }
/* логотип РРО слева от названия (img/rro-logo@2x.png — чётко и на ретине) */
.brand::before { content: ''; flex: none; width: 32px; height: 33px;
  background: url('img/rro-logo@2x.png') center / contain no-repeat; }
.nav { display: flex; gap: .2rem; flex: 1; flex-wrap: wrap; }
.nav a {
  padding: .4rem .7rem; border-radius: var(--radius); text-decoration: none;
  color: var(--muted); font-weight: 500; font-size: .92rem;
  transition: background-color .12s, color .12s;
}
.nav a:hover { background: var(--soft); color: var(--text); }
.nav a.active { background: #fff; color: var(--accent); font-weight: 600;
  box-shadow: 0 2px 8px rgba(79, 70, 229, .12); }
.me { display: flex; align-items: center; gap: .6rem; font-size: .88rem; }
.me > a { font-weight: 600; text-decoration: none; }
/* Плашка уровня доступа: у каждого уровня свой цвет (roles.role_badge) */
.role-badge { display: inline-block; border-radius: 999px; padding: .1rem .55rem;
  font-size: .78rem; font-weight: 600; line-height: 1.5; white-space: nowrap;
  color: var(--muted); background: var(--soft); border: 1px solid transparent; }
.role-badge.role-volunteer { color: var(--teal);   background: var(--teal-soft);   border-color: #bfe3e1; }
.role-badge.role-judge     { color: var(--accent); background: var(--accent-soft); border-color: #c9d7ea; }
.role-badge.role-reg_rep   { color: var(--violet); background: var(--violet-soft); border-color: #d8cdf1; }
.role-badge.role-org_rro   { color: var(--warn);   background: var(--warn-soft);   border-color: #f0dbb0; }
.role-badge.role-owner     { color: #fff;          background: var(--err);         border-color: var(--err); }
.burger { display: none; min-height: 0; padding: .3rem .6rem; font-size: 1.1rem; }

.wrap { max-width: 1200px; margin: 0 auto; padding: 1.2rem 1rem 3rem; }
/* Подвал прижат к низу экрана и на коротких страницах */
body { display: flex; flex-direction: column; min-height: 100vh; }
main.wrap { flex: 1 0 auto; width: 100%; }
.wrap.wrap-wide { max-width: 1900px; }   /* редактор шаблона: форма + предпросмотр */

/* Распределение по полям: что добавится при применении */
.dist-new { background: var(--ok-soft); border-radius: 4px; padding: 0 .25rem; }
table.distribute td { min-width: 7rem; }
table.dist-plan th { white-space: normal; }
table.dist-plan input { min-width: 4.5rem; }

/* Датасет: разметка одной страницы (admin/dataset_page.html) */
table.dataset-grid td.ds-cell { min-width: 8.5rem; vertical-align: top; }
table.dataset-grid img { display: block; height: 6.5rem; width: auto; max-width: 8rem; object-fit: contain; border: 1px solid var(--line);
  border-radius: 4px; background: #fff; }
table.dataset-grid .ds-diff { background: var(--warn-soft); }
table.dataset-grid .ds-off { opacity: .5; }
.ds-value { width: 3.2rem !important; min-height: 32px; text-align: center; padding: .2rem; }

/* Датасет по цифрам (admin/dataset.html): строка на цифру, в ней плитки клеток */
.ds-row { display: grid; grid-template-columns: 4.5rem minmax(0, 1fr); gap: .8rem;
  padding: .8rem 0; border-top: 1px solid var(--line); }
.ds-row:first-of-type { border-top: 0; }
.ds-digit { font-size: 2.2rem; font-weight: 700; line-height: 1; text-align: center; }
.ds-digit small { display: block; margin-top: .3rem; font-size: .75rem; font-weight: 500; color: var(--muted); }
.ds-tiles { display: flex; flex-wrap: wrap; gap: .45rem; }
.ds-tile { width: 5.4rem; padding: .3rem; border: 1px solid var(--line); border-radius: var(--radius);
  background: var(--panel); text-align: center; }
.ds-tile img { display: block; width: 100%; height: 4.6rem; object-fit: contain;
  background: #fff; border-radius: 4px; }
.ds-tile.ds-diff { border-color: var(--warn); background: var(--warn-soft); }
.ds-tile select, .ds-tile input { width: 100%; min-height: 28px; margin-top: .25rem;
  padding: .1rem .2rem; font-size: .85rem; text-align: center; }
.ds-tile .ds-meta { font-size: .68rem; color: var(--muted); line-height: 1.2; margin-top: .15rem; }
.ds-tile [data-autosave-status] { display: block; min-height: .9rem; font-size: .7rem; }
.ds-drop { display: block; width: 100%; min-height: 0; padding: 0; border: 0; background: none;
  cursor: pointer; border-radius: calc(var(--radius) - 2px); }
.ds-drop:hover img, .ds-drop:focus-visible img { outline: 2px solid var(--err); outline-offset: -2px; opacity: .6; }
.ds-tile.ds-moved { opacity: .45; }
.ds-tile.ds-gone { opacity: .2; pointer-events: none; }
.ds-picker { display: flex; flex-wrap: wrap; gap: .4rem; margin-bottom: .8rem; }
.ds-pick { display: inline-flex; flex-direction: column; align-items: center; min-width: 3.2rem;
  padding: .35rem .6rem; border: 1px solid var(--line); border-radius: var(--radius);
  font-size: 1.5rem; font-weight: 700; line-height: 1.1; color: inherit; text-decoration: none; }
.ds-pick small { font-size: .7rem; font-weight: 500; color: var(--muted); }
.ds-pick:hover { border-color: var(--accent); }
.ds-pick.active { border-color: var(--accent); background: var(--accent-soft); }
@media (max-width: 640px) { .ds-row { grid-template-columns: 1fr; } .ds-digit { text-align: left; } }

/* Клетка, на которую перешли из уведомления (#cell-<строка>-<команда>) */
td.cell:target { outline: 3px solid var(--warn); outline-offset: -3px;
  background: var(--warn-soft) !important; scroll-margin: 6rem 2rem; }
table.compare td.cell input.manual { display: block; width: 3.6rem; min-height: 28px;
  margin: .25rem auto 0; padding: .1rem .3rem; text-align: center; font-size: .85rem; }

/* Опыт судейства, подтверждённый сайтом (мероприятие ушло в архив) */
tr.exp-verified td { background: var(--ok-soft); }
tr.exp-verified td:first-child { box-shadow: inset 3px 0 0 var(--ok); }

/* Полоса прогресса бэкапа (Админ → «Бэкапы») */
.bp-bar { height: .7rem; margin: .6rem 0 .4rem; border-radius: 999px; background: var(--soft);
  border: 1px solid var(--line); overflow: hidden; }
.bp-fill { height: 100%; width: 0; background: var(--accent); border-radius: 999px;
  transition: width .4s ease; }

/* Колокольчик уведомлений в шапке (контурная SVG-иконка в цвет интерфейса):
   серый без новых, синий с новыми, красная точка-счётчик в углу */
.notif { position: relative; display: inline-flex; align-items: center; justify-content: center;
  width: 2.25rem; height: 2.25rem; border-radius: var(--radius); color: var(--muted);
  text-decoration: none; transition: background-color .12s, color .12s; }
.notif:hover { background: var(--soft); color: var(--text); }
.notif.active { background: var(--accent-soft); color: var(--accent); }
.notif.has { color: var(--accent); }
.notif-icon { display: block; }
.notif-count { position: absolute; top: .1rem; right: .05rem; min-width: 1.1rem; height: 1.1rem;
  padding: 0 .28rem; border-radius: 999px; background: var(--err); color: #fff;
  box-shadow: 0 0 0 2px var(--panel);
  font-size: .66rem; font-weight: 700; line-height: 1.1rem; text-align: center;
  font-variant-numeric: tabular-nums; }
tr.unread td { background: var(--accent-soft); }
td .was { color: var(--muted); text-decoration: line-through; }

/* Плашка «копия данных сервера» на локальном сайте (deploy.sh pull) */
.mirror-bar { background: var(--warn-soft); color: var(--warn); font-size: .85rem; font-weight: 500;
  padding: .45rem 1rem; text-align: center; border-bottom: 1px solid var(--line); }

/* Подвал: год, организация, разработчик */
.site-footer { display: flex; flex-wrap: wrap; justify-content: center; gap: .2rem .5rem;
  padding: 1.2rem 1rem 1.6rem;
  color: var(--muted); font-size: .8rem; text-align: center; }
.site-footer .sep { color: var(--line-strong); }
@media (max-width: 640px) { .site-footer .sep { display: none; } .site-footer span { width: 100%; } }

/* ---------- Блоки ---------- */
.card {
  background: var(--panel); border: 1px solid var(--glass-border); border-radius: var(--radius-lg);
  -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); box-shadow: var(--glass-shadow);
  padding: 1rem 1.1rem; margin: 0 0 1rem;
}
/* .card объявлен позже .mt-*: без этого его margin съедал отступ сверху */
.card.mt { margin-top: .6rem; }
.card.mt-l { margin-top: .9rem; }
.card.mt-xl { margin-top: 1.5rem; }
.grid { display: grid; gap: 1rem; align-items: start;
        grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr)); }
.grid > * { min-width: 0; }                 /* таблицы скроллятся внутри карточки */
.grid > .card { margin: 0; }
/* Две колонки: узкая слева, широкая справа (страница поля) */
.grid.aside { grid-template-columns: minmax(260px, 1fr) minmax(0, 2fr); }
/* Ровно две колонки (профиль, карточка судьи) */
.grid.two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid .wide { grid-column: 1 / -1; }
/* Строка элементов. Формы с подписями выравниваются по низу (кнопка — вровень
   с полем ввода), обычные строки кнопок и меток — по центру. */
.row { display: flex; gap: .5rem; flex-wrap: wrap; align-items: center; }
form.row { align-items: flex-end; }
form.row.center { align-items: center; }
.row.wrap { flex-wrap: wrap; }
.spread { display: flex; justify-content: space-between; align-items: center; gap: .6rem; flex-wrap: wrap; }
.spread > h1, .spread > h2, .spread > h3 { margin-top: 0; margin-bottom: 0; }
/* Шапка блока (заголовок + кнопки) не прилипает к тому, что под ней */
.spread:not(:last-child) { margin-bottom: .75rem; }
.wrap > .spread { margin-bottom: 1rem; }

/* ---------- Формы ---------- */
label { display: block; font-size: .84rem; font-weight: 500; color: #3d434b; margin: .6rem 0 .25rem; }
input, select, textarea, button { font: inherit; color: inherit; }
input[type=text], input[type=password], input[type=email], input[type=tel],
input[type=date], input[type=number], input[type=search], input:not([type]),
select, textarea {
  width: 100%; min-height: 38px; padding: .45rem .65rem;
  border: 1px solid var(--line-strong); border-radius: var(--radius); background: #fff;
  transition: border-color .12s, box-shadow .12s;
}
input::placeholder, textarea::placeholder { color: #9aa1ab; }
input:hover, select:hover, textarea:hover { border-color: #b4bbc5; }
input:focus, select:focus, textarea:focus { outline: none; border-color: var(--accent); box-shadow: var(--ring); }
input[readonly] { background: var(--soft); }
textarea { min-height: 80px; resize: vertical; }
fieldset { border: 1px solid var(--line); border-radius: var(--radius-lg); margin: .8rem 0; padding: .4rem 1rem 1rem; }
legend { font-size: .78rem; font-weight: 650; color: var(--muted); padding: 0 .4rem;
  text-transform: uppercase; letter-spacing: .04em; }
.form-grid { display: grid; gap: 0 .9rem; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.cat-rounds { display: grid; gap: .35rem; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); }
.cat-round { display: flex; align-items: center; justify-content: space-between; gap: .6rem;
  padding: .3rem .55rem; border-radius: var(--radius); background: var(--soft); }
.cat-round-n { display: inline-flex; align-items: center; gap: .4rem; margin: 0; white-space: nowrap; }
.cat-round-n input, .cat-round-n select { margin: 0; }
.cat-round { flex-wrap: wrap; }
.checks { display: grid; gap: .3rem; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); }
.checks label, .check { display: flex; align-items: center; gap: .45rem; color: var(--text);
  font-size: .9rem; font-weight: 400; margin: 0; padding: .2rem 0; }
input[type=checkbox], input[type=radio] { width: 1rem; height: 1rem; accent-color: var(--accent); }

/* ---------- Кнопки ----------
   В том же стиле, что и метки: мягкий фон без рамки. Главное действие —
   .primary (сплошной синий), опасное — .danger (мягкий красный). */
button, .btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .4rem;
  min-height: 38px; padding: .45rem .95rem;
  font-size: .9rem; font-weight: 600; line-height: 1.2; white-space: nowrap;
  border: 1px solid var(--btn-line); border-radius: 999px;
  background: var(--btn); color: var(--text);
  text-decoration: none; cursor: pointer;
  transition: background-color .12s, color .12s;
}
button:hover, .btn:hover { background: var(--btn-hover); }
button:active, .btn:active { transform: translateY(1px); }
button:focus-visible, .btn:focus-visible { outline: none; box-shadow: var(--ring); }
button:disabled, .btn.disabled { opacity: .45; cursor: not-allowed; transform: none; }

button.primary, .btn.primary { background: var(--primary-grad); border-color: transparent; color: #fff; }
button.primary:hover, .btn.primary:hover { background: var(--primary-grad-hover); border-color: transparent; }

button.danger, .btn.danger { background: var(--err-soft); border-color: #eec3c0; color: var(--err); }
button.danger:hover, .btn.danger:hover { background: #f6d6d4; }

button.ghost, .btn.ghost { background: transparent; border-color: transparent; color: var(--accent); }
button.ghost:hover, .btn.ghost:hover { background: var(--accent-soft); }

button.small, .btn.small { min-height: 30px; padding: .25rem .7rem; font-size: .82rem; }

button.link {
  min-height: 0; background: none; border: none; padding: 0;
  color: var(--accent); font-weight: 500; text-decoration: underline;
  text-decoration-color: rgba(79, 70, 229, .35); text-underline-offset: 2px; cursor: pointer;
}
button.link:hover { background: none; text-decoration-color: currentColor; }

.inline { display: inline-flex; gap: .4rem; align-items: center; flex-wrap: wrap;
          vertical-align: middle; margin: 0; }
.actions { display: flex; gap: .5rem; flex-wrap: wrap; margin-top: 1rem; align-items: center; }
.auth-card { max-width: 520px; margin: 2rem auto; }
.totp-setup { display: flex; gap: 1rem; align-items: center; flex-wrap: wrap; margin: 1rem 0; }
.totp-qr { width: 220px; height: 220px; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); }
.totp-secret { display: block; overflow-wrap: anywhere; margin-top: .4rem; user-select: all; }
.otp-input { max-width: 14rem; font-size: 1.4rem; letter-spacing: .18em; font-variant-numeric: tabular-nums; }
.recovery-codes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .45rem; padding: .9rem; border-radius: var(--radius);
  background: var(--soft); margin: 1rem 0; }
.recovery-codes code { font-size: 1rem; user-select: all; }
/* Группа кнопок в ячейке таблицы — без переносов и с ровными отступами */
td .actions, td form { display: inline-flex; gap: .35rem; margin: 0; vertical-align: middle; }

/* ---------- Сообщения ---------- */
.flash { padding: .65rem .9rem; border-radius: var(--radius); margin-bottom: 1rem; font-weight: 500;
  transition: opacity .3s; }
.flash.gone { opacity: 0; }
.flash.ok { background: var(--ok-soft); color: var(--ok); }
.flash.error { background: var(--err-soft); color: var(--err); }
.flash.warn { background: var(--warn-soft); color: var(--warn); }
.errors { background: var(--err-soft); color: var(--err);
  border-radius: var(--radius); padding: .65rem .9rem; margin-bottom: 1rem; }
.errors ul { margin: .25rem 0 0; padding-left: 1.1rem; }

/* ---------- Таблицы ----------
   Только горизонтальные линии, шапка — мелкими заглавными. */
.table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch;
  border: 1px solid var(--line); border-radius: var(--radius-lg); background: var(--panel); }
.card .table-wrap { border-radius: var(--radius); }
/* Таблица всегда отделена от соседних кнопок, строк и текста */
* + .table-wrap { margin-top: .75rem; }
.table-wrap:not(:last-child) { margin-bottom: .75rem; }
table { width: 100%; border-collapse: collapse; background: var(--panel); }
th, td { border-bottom: 1px solid var(--line); padding: .55rem .7rem; text-align: left;
  vertical-align: top; font-size: .9rem; }
tbody tr:last-child td { border-bottom: none; }
th { background: var(--soft); color: var(--muted); font-size: .74rem; font-weight: 650;
  text-transform: uppercase; letter-spacing: .04em; white-space: nowrap; }
tbody tr:hover { background: rgba(255, 255, 255, .7); }
/* Названия в таблицах и списках (мероприятие, судья, поле) — не «ссылки
   из текста», а заголовки строк: тёмные, полужирные, без подчёркивания;
   при наведении — цвет акцента. Ссылки внутри абзацев остаются подчёркнутыми. */
td a:not([class]), li > a:not([class]) { color: var(--text); font-weight: 600;
  text-decoration: none; transition: color .12s; }
td a:not([class]):hover, li > a:not([class]):hover { color: var(--accent); }
td a:not([class]):focus-visible, li > a:not([class]):focus-visible {
  outline: none; border-radius: 4px; box-shadow: var(--ring); }

/* ---------- Две колонки: список категорий + подробности ---------- */
.split { display: grid; grid-template-columns: 250px minmax(0, 1fr); gap: 1rem; align-items: start; }
.side {
  background: var(--panel); border: 1px solid var(--glass-border); border-radius: var(--radius-lg);
  -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); box-shadow: var(--glass-shadow);
  overflow: hidden; position: sticky; top: 64px; padding: .35rem;
}
.side-title {
  padding: .45rem .6rem .35rem; font-size: .74rem; font-weight: 650; letter-spacing: .04em;
  text-transform: uppercase; color: var(--muted);
}
.side-item {
  display: block; padding: .5rem .65rem; text-decoration: none; color: var(--text);
  border-radius: var(--radius); transition: background-color .12s;
}
.side-item:hover { background: var(--soft); }
.side-item.active { background: var(--accent-soft); }
.side-item.active .side-name { font-weight: 650; color: var(--accent); }
.side-name { display: block; font-weight: 500; }
.side-meta { display: block; margin-top: .15rem; font-size: .78rem; color: var(--muted); }
.detail { min-width: 0; }
.detail > h1:first-child { margin-top: .2rem; }

/* ---------- Всплывающее окно ---------- */
.modal {
  width: min(560px, calc(100% - 1.5rem)); padding: 0;
  border: none; border-radius: var(--radius-lg); background: var(--panel-solid);
  color: var(--text); box-shadow: 0 16px 40px rgba(16, 24, 40, .22);
}
.modal::backdrop { background: rgba(16, 24, 40, .45); }
.modal-head {
  display: flex; align-items: center; justify-content: space-between; gap: .5rem;
  padding: .85rem 1.1rem; border-bottom: 1px solid var(--line);
}
.modal-head h2 { margin: 0; font-size: 1.05rem; }
.modal-head button.link { text-decoration: none; color: var(--muted); font-size: 1.1rem; }
.modal-body { padding: .9rem 1.1rem; }
.modal-foot {
  display: flex; gap: .5rem; flex-wrap: wrap;
  padding: .8rem 1.1rem; border-top: 1px solid var(--line); background: #fafbfc;
}

/* ---------- Выбор судей поиском ---------- */
.picker { position: relative; margin: .5rem 0; }
.picker-any { margin: .35rem 0; }
.picker [data-picker-any-warn] { margin: .2rem 0 .4rem; }
.picker-results {
  position: absolute; left: 0; right: 0; z-index: 30;
  max-height: 260px; overflow-y: auto; padding: .25rem;
  background: var(--panel-solid); border: 1px solid var(--line); border-radius: var(--radius);
  box-shadow: 0 8px 20px rgba(16, 24, 40, .14);
}
.picker-item {
  display: block; width: 100%; min-height: 0; text-align: left;
  padding: .45rem .6rem; border-radius: 6px; background: none;
  font-weight: 400; white-space: normal; cursor: pointer;
}
.picker-item:hover { background: var(--accent-soft); }
.picker-empty { padding: .45rem .6rem; color: var(--muted); font-size: .88rem; }

.picker-chosen { display: flex; flex-wrap: wrap; gap: .35rem; margin-top: .5rem; }
.chip {
  display: inline-flex; align-items: center; gap: .3rem;
  padding: .2rem .35rem .2rem .65rem; font-size: .86rem; font-weight: 500;
  background: var(--accent-soft); color: var(--accent); border-radius: 999px;
}
.chip.is-lead .chip-name { font-weight: 650; }
.chip-btn {
  min-height: 0; padding: .1rem .3rem; border-radius: 999px; background: none;
  color: inherit; font-size: .8rem; line-height: 1; cursor: pointer; opacity: .7;
}
.chip-btn:hover { background: rgba(79, 70, 229, .12); opacity: 1; }

/* ---------- Листание ---------- */
.pager { display: flex; align-items: center; gap: .4rem; flex-wrap: wrap; margin-top: .9rem; }

/* ---------- Метки ----------
   .tag — нейтральная «таблетка» (счётчики, подписи). Метки состояния
   (.active, .draft, …) — мягкий цветной фон и точка-индикатор слева.     */
.tag {
  display: inline-flex; align-items: center; gap: .35rem;
  font-size: .78rem; font-weight: 600; line-height: 1.2; letter-spacing: .01em;
  padding: .2rem .6rem; border-radius: 999px; white-space: nowrap; vertical-align: middle;
  background: var(--soft); color: #4a515b;
}
.event-title { font-size: 1.45rem; font-weight: 700; line-height: 1.25; letter-spacing: -.01em; margin: 0 0 .6rem; }
.event-title .tag { font-size: .75rem; margin-left: .35rem; transform: translateY(-1px); letter-spacing: 0; }
h1 .tag, h2 .tag, h3 .tag { font-size: .75rem; margin-left: .35rem; transform: translateY(-1px); }
.tag.active, .tag.approved, .tag.draft, .tag.finished, .tag.archived,
.tag.pending, .tag.rejected, .tag.warn { padding-left: .5rem; }
.tag.active::before, .tag.approved::before, .tag.draft::before, .tag.finished::before, .tag.archived::before,
.tag.pending::before, .tag.rejected::before, .tag.warn::before {
  content: ''; width: .5rem; height: .5rem; border-radius: 50%;
  background: currentColor; flex: none;
}
.tag.active, .tag.approved { background: var(--ok-soft); color: var(--ok); }
.tag.active::before, .tag.approved::before { box-shadow: 0 0 0 3px rgba(20, 108, 53, .15); }
.tag.draft { background: #f0f1f3; color: var(--muted); }
.tag.finished { background: var(--warn-soft); color: var(--warn); }
.tag.archived { background: #e9ebef; color: #4a515b; }
.tag.pending { background: var(--accent-soft); color: var(--accent); }
.tag.rejected, .tag.warn { background: var(--err-soft); color: var(--err); }
.tag.lead { background: var(--accent-soft); color: var(--accent); font-variant-numeric: tabular-nums; }
/* Этап мероприятия — свои цвета, не совпадающие с метками статуса (зелёный
   «идёт», охра «архив»): федеральный — синий, региональный — фиолетовый,
   муниципальный — бирюзовый */
.tag.level-federal { background: var(--accent-soft); color: var(--accent); }
.tag.level-regional { background: var(--violet-soft); color: var(--violet); }
.tag.level-municipal { background: var(--teal-soft); color: var(--teal); }

/* Попытки категории столбиком: метка состояния и кнопка рядом, кнопки на одной вертикали */
.round-locks { display: grid; grid-template-columns: max-content max-content;
               gap: .45rem .6rem; align-items: center; margin-top: .4rem; }
.round-locks .tag { justify-self: start; }

/* ---------- Электронный протокол и сверка со сканом ---------- */
table.sheet { border-collapse: collapse; width: 100%; }
table.sheet th, table.sheet td { border: 1px solid var(--line); padding: .3rem .4rem; vertical-align: middle; }
table.sheet th { text-transform: none; letter-spacing: 0; font-size: .8rem; color: var(--text); }
table.sheet th.crit, table.sheet td.crit { text-align: left; min-width: 260px; max-width: 420px; }
table.sheet th.w, table.sheet td.w { width: 2.2rem; text-align: center; }
table.sheet th.team { min-width: 5.5rem; text-align: center; }
table.sheet td.cell { text-align: center; padding: .2rem; }
table.sheet td.cell input { width: 3.2rem; min-height: 32px; text-align: center; padding: .25rem; }
table.sheet tr.group td { background: var(--soft); font-weight: 650; }
table.sheet tr.total td { background: var(--soft); text-align: center; }
table.sheet tr.total td.crit { text-align: left; }

table.compare td.cell .same { color: var(--muted); }
table.compare td.cell.diff { background: #fff4e5; }
table.compare .pick { display: inline-flex; align-items: center; gap: .25rem; cursor: pointer; }
table.compare .pick .was { color: var(--muted); text-decoration: line-through; }
table.compare .pick .now { font-weight: 700; }
table.compare .pick .arrow { color: var(--muted); }

#progress-box progress { width: 100%; height: 1.1rem; accent-color: var(--accent); }

/* ---------- Вырезки скана в сверке ---------- */
table.compare td.cell { min-width: 6.5rem; }
table.compare .crop { display: block; width: 100%; max-width: 92px; margin: 0 auto .15rem;
                      border: 1px solid var(--line); border-radius: 4px; background: #fff; }
table.compare td.cell.diff .crop { border-color: #d98f4f; }

/* ---------- Протокол команды блоками (телефон в первую очередь) ---------- */
.fill .block { margin-bottom: 14px; }
.fill .block h2 { font-size: 1rem; margin: 0 0 .6rem; display: flex; flex-wrap: wrap;
                  gap: .5rem; align-items: baseline; }
.fill .crit-row { padding: .65rem 0; border-top: 1px solid var(--line); }
.fill .crit-row:first-of-type { border-top: 0; }
.fill .crit-text { margin: 0 0 .5rem; font-size: .92rem; line-height: 1.4; }
.fill .crit-input { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; }
.fill .crit-input input[type=number] { width: 5rem; padding: .5rem; font-size: 1rem; }
.fill .pts { white-space: nowrap; }

/* Крупный выбор значения (0/1/2) и переключатели-сегменты */
.choice, .seg-choice { display: inline-flex; gap: .35rem; flex-wrap: wrap; }
.choice label, .seg-choice label { position: relative; display: inline-flex; margin: 0; }
.choice input, .seg-choice input { position: absolute; opacity: 0; width: 100%; height: 100%;
  margin: 0; cursor: pointer; }
.choice span, .seg-choice span {
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: var(--radius); background: var(--btn); color: var(--text);
  border: 1px solid var(--btn-line);
  font-weight: 600; transition: background-color .12s, color .12s;
}
.choice span { min-width: 3rem; min-height: 2.7rem; padding: 0 .7rem; font-size: 1.05rem; }
.seg-choice span { min-width: 2.6rem; min-height: 2.2rem; padding: 0 .8rem; font-size: .9rem; }
.choice label:hover span, .seg-choice label:hover span { background: var(--btn-hover); }
.choice input:checked + span { background: var(--ok); border-color: var(--ok); color: #fff; }
.seg-choice input:checked + span { background: var(--accent); border-color: var(--accent); color: #fff; }
.choice input:disabled + span { opacity: .55; }
.choice input:focus-visible + span, .seg-choice input:focus-visible + span { box-shadow: var(--ring); }

.fill-bar { position: sticky; bottom: 0; z-index: 5; display: flex; gap: .6rem;
            align-items: center; flex-wrap: wrap;
            padding: .7rem .8rem; margin-top: 10px;
            background: var(--panel-solid); border-top: 1px solid var(--line);
            box-shadow: 0 -4px 12px rgba(16, 24, 40, .06); }
.fill-bar .total { margin-right: auto; font-size: 1.05rem; font-weight: 650; }
.rounds .btn { min-width: 3rem; text-align: center; }

/* ---------- Печать бланков: выбор попытки ---------- */
.print-blanks { padding: .2rem 0 .4rem; }

/* ---------- Анкета: опыт судейства, тип регистрации ---------- */
/* уровень · соревнование · (категория у РРО) · год; в узкой карточке — по два в ряд */
.exp-row { display: grid; gap: .6rem; grid-template-columns: repeat(auto-fit, minmax(9.5rem, 1fr));
           padding: .5rem 0; border-bottom: 1px dashed var(--line); }
.exp-row:last-of-type { border-bottom: 0; }
.exp-row label { margin-top: .2rem; }
.exp-row input[data-exp-other-input] { margin-top: .35rem; }
.reg-type span { min-width: 7.5rem; min-height: 2.5rem; font-size: .95rem; }

/* ---------- Заявки ---------- */
.app-card { border: 1px solid var(--line); border-left-width: 4px; border-radius: var(--radius-lg);
            padding: .85rem 1rem; margin: .7rem 0; background: var(--panel); min-width: 0; }
.app-card.pending { border-left-color: var(--accent); }
.app-card.approved { border-left-color: var(--ok); }
.app-card.rejected { border-left-color: var(--err); }
.app-card > * + * { margin-top: .45rem; }
.app-card details .table-wrap { margin-top: .5rem; }
.app-card .app-actions { margin-top: .75rem; padding-top: .7rem; border-top: 1px solid var(--line); }
.filters { display: flex; flex-wrap: wrap; gap: .35rem; margin: .3rem 0; }
.filters a { text-decoration: none; }

[hidden] { display: none !important; }

/* Кнопки действий в строке таблицы: в одну линию, прижаты вправо */
td.row-actions { white-space: nowrap; width: 1%; text-align: right; vertical-align: middle; }
td.row-actions > * { vertical-align: middle; }
td.row-actions form { display: inline-flex; }
td.row-actions > * + * { margin-left: .3rem; }

/* Поле выбора прямо в строке кнопок не растягивается на всю ширину */
.row > select, .row > input:not([type=hidden]) { width: auto; max-width: 100%; }
.row > input[type=file] { flex: 1 1 14rem; }

/* Выбор этапа в форме мероприятия — не во всю ширину */
.level-select { max-width: 22rem; }

/* ---------- Переключатель статуса мероприятия ----------
   Три сегмента и прозрачный ползунок цвета статуса (как у меток .tag):
   черновик — серый, идёт — зелёный, завершено — охра. Ползунок едет
   к выбранному сегменту; форму отправляет app.js после выбора. */
.status-switch {
  position: relative; display: inline-grid; grid-template-columns: repeat(4, 1fr);
  margin: 0; padding: 3px; background: var(--panel);
  border: 1px solid var(--line-strong); border-radius: var(--radius);
}
.status-switch .thumb {
  position: absolute; top: 3px; bottom: 3px; left: 3px; width: calc((100% - 6px) / 4);
  border: 1px solid rgba(100, 107, 117, .35); border-radius: 6px;
  background: rgba(100, 107, 117, .12);
  transition: transform .22s cubic-bezier(.3, .7, .3, 1), background-color .2s, border-color .2s;
}
.status-switch:has(input[value=active]:checked) .thumb {
  transform: translateX(100%); background: rgba(20, 108, 53, .12); border-color: rgba(20, 108, 53, .4); }
.status-switch:has(input[value=finished]:checked) .thumb {
  transform: translateX(200%); background: rgba(138, 90, 0, .12); border-color: rgba(138, 90, 0, .4); }
.status-switch:has(input[value=archived]:checked) .thumb {
  transform: translateX(300%); background: rgba(100, 107, 117, .16); border-color: rgba(100, 107, 117, .45); }
.status-switch label { position: relative; z-index: 1; display: flex; margin: 0; }
.status-switch input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0;
  opacity: 0; cursor: pointer; }
.status-switch span {
  flex: 1; display: flex; align-items: center; justify-content: center;
  min-height: 30px; padding: .3rem 1rem; border-radius: 6px;
  font-size: .9rem; font-weight: 600; color: var(--muted); white-space: nowrap;
  transition: color .15s;
}
.status-switch label:hover span { color: var(--text); }
.status-switch .draft input:checked + span { color: var(--text); }
.status-switch .active input:checked + span { color: var(--ok); }
.status-switch .finished input:checked + span { color: var(--warn); }
.status-switch .archived input:checked + span { color: var(--text); }
.status-switch input:focus-visible + span { box-shadow: var(--ring); }
.status-switch input:disabled { cursor: not-allowed; }
.status-switch input:disabled + span { opacity: .45; }
.status-switch label:has(input:disabled):hover span { color: var(--muted); }
.status-switch.busy { pointer-events: none; }

/* ---------- Меню внутри мероприятия (events/_nav.html) ----------
   Одна строка кнопок-разделов; пункты раскрываются при наведении или по
   нажатию (.open ставит app.js). Текущий раздел — мягкая синяя заливка,
   в его кнопке написан текущий пункт. */
.event-nav { display: flex; flex-wrap: wrap; gap: .35rem; margin: .7rem 0 1rem; }
.event-nav-item { position: relative; }
.event-nav-btn {
  display: inline-flex; align-items: center; gap: .4rem; min-height: 0; padding: .45rem .8rem;
  border: 1px solid var(--line); border-radius: var(--radius); background: var(--panel);
  color: var(--text); font: inherit; font-size: .92rem; font-weight: 600;
  text-decoration: none; white-space: nowrap; cursor: pointer;
  transition: border-color .15s, background-color .15s, color .15s;
}
.event-nav-btn:hover { border-color: var(--line-strong); background: var(--panel); }
.event-nav-item.active > .event-nav-btn { background: var(--accent-soft); border-color: transparent; color: var(--accent); }
.event-nav-cur { font-weight: 500; }
.event-nav-caret { color: var(--muted); font-size: .85rem; line-height: 1; transition: transform .15s; }
.event-nav-item.active .event-nav-caret { color: var(--accent); }
.event-nav-item.open .event-nav-caret { transform: rotate(180deg); }
.event-drop {
  display: none; position: absolute; top: calc(100% + 4px); left: 0; z-index: 20;
  min-width: 13rem; max-width: calc(100vw - 2rem); padding: .3rem;
  background: var(--panel-solid); border: 1px solid var(--line); border-radius: var(--radius);
  box-shadow: 0 6px 18px rgba(27, 31, 36, .1);
}
/* мостик над списком: мышь не «проваливается» в щель между кнопкой и списком */
.event-drop::before { content: ''; position: absolute; left: 0; right: 0; top: -6px; height: 6px; }
.event-nav-item.open .event-drop { display: block; }
@media (hover: hover) {
  .event-nav-item:hover .event-drop { display: block; }
  /* под курсором другой раздел — нажатый раньше не висит рядом */
  .event-nav:hover .event-nav-item.open:not(:hover) .event-drop { display: none; }
}
.event-drop a { display: flex; align-items: center; justify-content: space-between; gap: .6rem;
  padding: .45rem .6rem; border-radius: 6px; color: var(--text); text-decoration: none;
  white-space: nowrap; transition: background-color .15s; }
.event-drop a:hover { background: var(--soft); }
.event-drop a.active { background: var(--accent-soft); color: var(--accent); font-weight: 600; }
/* главный пункт раздела (event_nav, hl) — лёгкий зелёный оттенок, без полоски */
.event-drop a.hl:not(.active) { background: var(--ok-soft); }
.event-drop a.hl:not(.active):hover { background: var(--ok-soft); filter: brightness(.97); }
.event-nav a:focus-visible, .event-nav button:focus-visible { box-shadow: var(--ring); outline: none; }
.event-nav-count { min-width: 1.25rem; padding: 0 .35rem; border-radius: 999px; text-align: center;
  background: var(--warn-soft); color: var(--warn); font-size: .75rem; font-weight: 700; line-height: 1.35; }
/* Дни рождения в дни мероприятия (app/birthdays.py): значок справа в меню, сегодня — розовый */
.bday-nav { margin-left: auto; }
.bday-btn { border-radius: 999px; color: var(--muted); }
.bday-btn.today, .bday-btn.today:hover { background: var(--bday-soft); border-color: var(--bday-line); color: var(--bday); }
.bday-drop { left: auto; right: 0; width: 22rem; padding: .4rem; max-height: 70vh; overflow-y: auto; }
.bday-day { padding: .45rem .6rem .2rem; font-size: .75rem; font-weight: 700; letter-spacing: .06em;
  text-transform: uppercase; color: var(--muted); }
.bday-day.today { color: var(--bday); }
.bday-person { padding: .45rem .6rem; border-radius: 9px; }
.bday-person + .bday-person { margin-top: .2rem; }
.bday-person.today { background: var(--bday-bg); }
.bday-person.today .bday-age { color: var(--bday); font-weight: 600; }
.bday-age { color: var(--muted); }

/* Статистика ошибок судей (events/judge_errors.html) */
.err-table td { vertical-align: top; }
.err-pct { display: block; font-variant-numeric: tabular-nums; }
.err-meter { width: 6rem; margin-top: .2rem; }
.err-meter span { background: var(--warn); }
.err-details { min-width: 14rem; }
.err-item { padding: .35rem 0; border-top: 1px solid var(--line); }

/* Состояние мероприятия на его карточке: статус, приём заявок, оргкомитет */
.event-state { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem 1.4rem; }
.event-state .state-item { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; }
.event-state .state-label { font-size: .85rem; color: var(--muted); }
.event-state .push { margin-left: auto; }
.event-people { margin-top: .8rem; padding-top: .8rem; border-top: 1px solid var(--line); }

/* ---------- Планшет ---------- */
@media (max-width: 900px) {
  .wrap { padding: .9rem .7rem 2.5rem; }
  .grid.aside, .grid.two { grid-template-columns: minmax(0, 1fr); }
  .split { grid-template-columns: 200px minmax(0, 1fr); }
}

/* ---------- Телефон ---------- */
@media (max-width: 640px) {
  body { font-size: 16px; }              /* без авто-зума в iOS */
  .top { padding: .5rem .7rem; }
  .burger { display: inline-flex; }
  /* раскрытое меню — списком на всю ширину под шапкой (flex: 1 с ПК иначе
     ставит его в одну строку с названием) */
  .nav { display: none; flex: 1 1 100%; order: 10; flex-direction: column; gap: .15rem; }
  .nav.open { display: flex; }
  .nav a { padding: .65rem .7rem; }
  .me { margin-left: auto; }
  .me .role { display: none; }   /* название роли не влезает в узкую шапку */
  .brand { flex: 1; }
  .card { padding: .9rem; }
  .grid { grid-template-columns: 1fr; }
  .split { grid-template-columns: 1fr; }
  .side { position: static; }
  th, td { font-size: .85rem; padding: .45rem .5rem; }
  /* Кнопки — те же, что на ПК и планшете (размер и вид не меняются).
     Только слишком длинная подпись переносится, а не вылезает за экран. */
  button, .btn { white-space: normal; max-width: 100%; text-align: center; }
  /* Кнопки шапки блока — своей строкой под заголовком, но обычного размера */
  .spread > .row, .spread > .actions { width: 100%; }
  .exp-row { grid-template-columns: 1fr; }
  table.sheet th.crit, table.sheet td.crit { min-width: 160px; font-size: .8rem; }
  table.sheet td.cell input { width: 2.6rem; }
  .fill .crit-text { font-size: .95rem; }
  .choice span { min-width: 3.4rem; min-height: 3rem; font-size: 1.15rem; }
  .fill-bar { padding: .7rem .5rem; }
}

/* Уведомления на телефоне: каждая правка — карточка, без горизонтальной прокрутки */
@media (max-width: 640px) {
  .notif-table thead { display: none; }
  .notif-table tbody tr {
    display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .15rem .6rem;
    grid-template-areas: "when val" "who who" "where where" "what what" "act act";
    padding: .7rem .75rem; border-bottom: 1px solid var(--line);
  }
  .notif-table tbody tr:last-child { border-bottom: none; }
  .notif-table td { display: block; padding: 0; border: none; background: none !important; }
  .notif-table .n-when { grid-area: when; } .notif-table .n-val { grid-area: val; text-align: right; }
  .notif-table .n-who { grid-area: who; } .notif-table .n-where { grid-area: where; }
  .notif-table .n-what { grid-area: what; }
  .notif-table .n-act { grid-area: act; width: auto; text-align: left; padding-top: .35rem; }
  .notif-table .n-when br { display: none; }
  .notif-table .n-when .tag { margin-right: .4rem; }
  .notif-table tr.unread { background: var(--accent-soft); }
}

@media (prefers-reduced-motion: reduce) {
  * { transition: none !important; }
}

/* Кнопки-«не кнопки» (подсказки, крестики у чипов) — без рамки */
.picker-item, .chip-btn, button.link { border: none; }

/* ---------- Поля выбора ----------
   Выпадающие списки — свой вид вместо системного: серая подложка как у
   кнопок, аккуратная стрелка (встроенный SVG, отдельный файл не грузится),
   скругление и синее кольцо при фокусе. */
select {
  -webkit-appearance: none; appearance: none;
  min-height: 38px; padding: .45rem 2.2rem .45rem .7rem;
  border: 1px solid var(--btn-line); border-radius: var(--radius);
  background-color: rgba(255, 255, 255, .8); color: var(--text); font-weight: 500;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%23646b75' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right .75rem center; background-size: 12px 8px;
  cursor: pointer; text-overflow: ellipsis;
}
select:hover { background-color: #fff; border-color: var(--line-strong); }
select:focus { background-color: #fff; border-color: var(--accent); box-shadow: var(--ring); }
select:disabled { opacity: .55; cursor: not-allowed; }
select option { font-weight: 400; }
select option:disabled { color: #9aa1ab; }
select optgroup { font-weight: 650; color: var(--muted); }
/* Пустое значение «— выберите —» серым, как подсказка */
select:has(option[value=""]:checked) { color: #8a919b; font-weight: 400; }
select:has(option[value=""]:checked) option { color: var(--text); }
select[multiple], select[size]:not([size="1"]) { padding-right: .7rem; background-image: none; }

/* Флажки и переключатели — крупнее и в цвет интерфейса */
input[type=checkbox], input[type=radio] { width: 1.05rem; height: 1.05rem; margin: 0;
  accent-color: var(--accent); cursor: pointer; vertical-align: middle; }
label:has(> input[type=checkbox]), label:has(> input[type=radio]) { cursor: pointer; }

/* Выбор файла: кнопка внутри поля — в стиле остальных кнопок */
input[type=file] { font-size: .88rem; color: var(--muted); max-width: 100%; }
input[type=file]::file-selector-button {
  margin-right: .7rem; padding: .45rem .9rem; min-height: 36px;
  border: 1px solid var(--btn-line); border-radius: 999px;
  background: var(--btn); color: var(--text); font: inherit; font-weight: 600; cursor: pointer;
  transition: background-color .12s;
}
input[type=file]::file-selector-button:hover { background: var(--btn-hover); }

/* Поле с датой — без лишней системной рамки, иконка календаря приглушена */
input[type=date]::-webkit-calendar-picker-indicator { opacity: .55; cursor: pointer; }
input[type=date]::-webkit-calendar-picker-indicator:hover { opacity: 1; }

/* Строка опыта с крестиком «убрать» (регистрация) */
/* категория видна только у РРО — колонки подстраиваются, крестик — последней узкой */
.exp-row.removable { grid-template-columns: repeat(auto-fit, minmax(9.5rem, 1fr)) 2.5rem; }
.exp-remove { display: flex; align-items: flex-end; padding-bottom: 2px; }
[data-exp-add] { margin-top: .6rem; }
@media (max-width: 640px) {
  .exp-row.removable { grid-template-columns: 1fr; }
  .exp-remove { justify-content: flex-end; }
}

/* Всплывающие уведомления (правый верхний угол, под шапкой) */
.toasts { position: fixed; top: 4.2rem; right: 1rem; z-index: 50; display: flex;
  flex-direction: column; gap: .5rem; width: min(360px, calc(100vw - 2rem)); pointer-events: none; }
.toast { pointer-events: auto; background: var(--panel-solid); border: 1px solid var(--line-strong);
  border-left: 4px solid var(--accent); border-radius: var(--radius); padding: .6rem .75rem;
  box-shadow: 0 4px 14px rgba(20, 30, 45, .12); font-size: .88rem; transition: opacity .25s; }
.toast.gone { opacity: 0; }
.toast-head { display: flex; align-items: baseline; gap: .5rem; }
.toast-head strong { flex: 1; color: var(--accent); }
.toast-time { color: var(--muted); font-size: .78rem; }
.toast-close { background: none; border: none; padding: 0 .2rem; font-size: 1.1rem; line-height: 1;
  color: var(--muted); cursor: pointer; }
.toast-close:hover { color: var(--text); }
.toast-who { color: var(--muted); font-size: .8rem; margin-top: .15rem; }
.toast-text { margin-top: .3rem; overflow-wrap: anywhere; max-height: 6.5em; overflow: hidden; }
.toast-link { display: inline-block; margin-top: .35rem; font-size: .82rem; }


/* ---------- Статистика: плитки, полосы заполнения (заявки, сводка судей) ---------- */
.kpis { display: grid; gap: .6rem; grid-template-columns: repeat(auto-fill, minmax(8.5rem, 1fr)); }
.kpi { background: var(--soft); border-radius: var(--radius); padding: .55rem .7rem;
        display: flex; flex-direction: column; gap: .1rem; }
.kpi-num { font-size: 1.35rem; font-weight: 650; line-height: 1.2; font-variant-numeric: tabular-nums; }
.kpi.txt .kpi-num { font-size: 1.05rem; padding-top: .2rem; }
.kpi-label { font-size: .8rem; color: var(--muted); }
.kpi.ok { background: var(--ok-soft); }   .kpi.ok .kpi-num { color: var(--ok); }
.kpi.warn { background: var(--warn-soft); } .kpi.warn .kpi-num { color: var(--warn); }
.kpi.err { background: var(--err-soft); }  .kpi.err .kpi-num { color: var(--err); }
th.num, td.num { text-align: right; font-variant-numeric: tabular-nums; }
/* одна полоса «принято · отклонено · ждут» */
.bar-stack { display: flex; gap: 2px; height: .6rem; border-radius: 999px; overflow: hidden;
              background: var(--soft); }
.bar-stack span { display: block; height: 100%; }
.bar-stack .seg-approved { background: var(--ok); }
.bar-stack .seg-rejected { background: var(--err); }
.bar-stack .seg-pending { background: var(--warn); }
/* строка «что заполнено»: подпись · полоса · число */
.fill-row { display: grid; grid-template-columns: minmax(9rem, 1.4fr) 1fr auto; gap: .6rem;
             align-items: center; padding: .25rem 0; font-size: .9rem; }
.fill-num { color: var(--muted); font-variant-numeric: tabular-nums; white-space: nowrap; }
.meter { display: block; height: .55rem; border-radius: 999px; background: var(--soft); overflow: hidden; }
.meter span { display: block; height: 100%; background: var(--accent); border-radius: 999px; }
.w-pct-0 { width: 0%; }
.w-pct-5 { width: 5%; }
.w-pct-10 { width: 10%; }
.w-pct-15 { width: 15%; }
.w-pct-20 { width: 20%; }
.w-pct-25 { width: 25%; }
.w-pct-30 { width: 30%; }
.w-pct-35 { width: 35%; }
.w-pct-40 { width: 40%; }
.w-pct-45 { width: 45%; }
.w-pct-50 { width: 50%; }
.w-pct-55 { width: 55%; }
.w-pct-60 { width: 60%; }
.w-pct-65 { width: 65%; }
.w-pct-70 { width: 70%; }
.w-pct-75 { width: 75%; }
.w-pct-80 { width: 80%; }
.w-pct-85 { width: 85%; }
.w-pct-90 { width: 90%; }
.w-pct-95 { width: 95%; }
.w-pct-100 { width: 100%; }

/* ---------- Админ → «Сервер»: загрузка крупно, оценка пользователей, график ---------- */
.sv-hero { display: grid; grid-template-columns: auto 1fr; gap: .5rem 1.2rem; align-items: center; }
.sv-hero-num { font-size: 3rem; font-weight: 700; line-height: 1; font-variant-numeric: tabular-nums; }
.sv-hero-bar { grid-column: 1 / -1; }
.sv-hero-bar .meter { height: .8rem; }
.sv-hero-bar .meter span { transition: width .4s ease; }
.meter span.sv-fill-ok { background: var(--ok); }
.meter span.sv-fill-warn { background: #d08a00; }
.meter span.sv-fill-err { background: var(--err); }
.sv-kpis { grid-template-columns: repeat(4, minmax(0, 1fr)); margin-bottom: 1rem; }
@media (max-width: 700px) { .sv-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.sv-cap { display: grid; gap: .7rem; grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr)); }
.sv-cap-item { background: var(--soft); border-radius: var(--radius); padding: .7rem .9rem; }
.sv-cap-num { font-size: 2rem; font-weight: 700; line-height: 1.15; font-variant-numeric: tabular-nums; }
.sv-chart-wrap { position: relative; margin-top: .6rem; }
.sv-chart { display: block; width: 100%; height: 190px; touch-action: pan-y; }
.sv-chart .sv-grid { stroke: var(--line); stroke-width: 1; }
.sv-chart .sv-limit { stroke: var(--line-strong); stroke-width: 1; stroke-dasharray: 4 4; }
.sv-chart .sv-axis { fill: var(--muted); font-size: 11px; font-variant-numeric: tabular-nums; }
.sv-chart .sv-area { fill: var(--accent-soft); }
.sv-chart .sv-nodata { fill: rgba(100, 107, 117, .07); }
.sv-chart .sv-line { fill: none; stroke: var(--accent); stroke-width: 2; stroke-linejoin: round;
  stroke-linecap: round; }
.sv-chart .sv-cross { stroke: var(--line-strong); stroke-width: 1; }
.sv-chart .sv-dot { fill: var(--accent); stroke: var(--panel-solid); stroke-width: 2; }
.sv-tip { position: absolute; top: 0; pointer-events: none; background: var(--panel-solid);
  border: 1px solid var(--line-strong); border-radius: 8px; padding: .3rem .55rem; font-size: .8rem;
  box-shadow: var(--glass-shadow); white-space: nowrap; font-variant-numeric: tabular-nums; }
/* сводка судей финала: цвет строки — приедет ли */
.summary-table tr.arr-yes td:first-child { box-shadow: inset 3px 0 0 var(--ok); }
.summary-table tr.arr-no td { background: var(--err-soft); }
.summary-table td:first-child { min-width: 11rem; }
.fill-block { max-width: 46rem; }
.summary-table .note-input { min-width: 9rem; }
@media (max-width: 640px) {
  .fill-row { grid-template-columns: 1fr auto; }
  .fill-row .meter { grid-column: 1 / -1; grid-row: 2; }
}

/* ---------- Статистика протоколов: заполнено / сверено по попыткам и полям ---------- */
.meter-cell { display: grid; grid-template-columns: minmax(4rem, 1fr) auto; gap: .5rem;
              align-items: center; min-width: 10rem; }
/* Таблицы статистики: всё, кроме первой колонки (название), — по центру */
table.stats-table th:not(:first-child), table.stats-table td:not(:first-child) { text-align: center; }
table.stats-table .meter-cell { justify-content: center; }
/* статус попытки и кнопка «Завершить» — столбиком, не вылезают за таблицу */
.round-state { display: flex; flex-direction: column; align-items: center; gap: .3rem; }
.text-warn { color: var(--warn); }
.text-ok { color: var(--ok); }
table.pstats-fields td.pcell { white-space: nowrap; }
table.pstats-fields td.pcell a { font-variant-numeric: tabular-nums; margin-right: .3rem; }
table.pstats-fields td.st-done { background: var(--ok-soft); }
table.pstats-fields td.st-part { background: var(--warn-soft); }


/* ---------- Конструктор шаблонов протоколов (Админ → «Шаблоны протоколов») ---------- */
.tpl-group { background: var(--soft); border: none; margin: 0 0 .9rem; padding: .7rem .8rem .8rem; }
.tpl-group-head { display: flex; gap: .7rem; align-items: flex-end; flex-wrap: wrap; margin-bottom: .5rem; }
.tpl-group-head input { margin: 0; }
.tpl-row { display: grid; grid-template-columns: minmax(16rem, 1.4fr) minmax(14rem, 1fr) auto;
           gap: .5rem .8rem; align-items: start; padding: .55rem .6rem; margin-bottom: .45rem;
           background: var(--panel); border-radius: var(--radius); }
.tpl-row textarea { min-height: 4.2rem; margin: 0; }
.tpl-row-nums { display: flex; flex-wrap: wrap; gap: .35rem .6rem; align-items: flex-end; }
.tpl-row-nums label { display: flex; flex-direction: column; gap: .15rem; margin: 0; }
.tpl-row-nums input, .tpl-row-nums select { margin: 0; }
.tpl-row-nums input { width: 4.6rem; }
.tpl-tools { display: flex; gap: .2rem; align-items: center; }
.tpl-tools button { min-width: 2rem; padding: 0 .4rem; }
.sticky-actions { position: sticky; bottom: 0; z-index: 5; display: flex; gap: .8rem; align-items: center;
                  padding: .6rem .8rem; margin: 0 0 1rem; background: var(--panel-solid);
                  border-top: 1px solid var(--line); }
.tpl-preview { display: block; width: 100%; height: auto; border: 1px solid var(--line);
               border-radius: var(--radius); background: #fff; }
@media (max-width: 900px) {
  .tpl-row { grid-template-columns: 1fr; }
  .tpl-tools { justify-content: flex-end; }
}
/* редактор шаблона: форма слева, живой предпросмотр справа (закреплён) */
.tpl-layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1rem; }
.tpl-preview-card { margin-bottom: 0; }
.tpl-preview.loading { opacity: .45; transition: opacity .2s; }
.tpl-live-errors { margin: .3rem 0 .6rem; padding-left: 1.1rem; }
.side-collapsed { margin-bottom: .8rem; }
.side-collapsed > summary { cursor: pointer; font-size: .9rem; color: var(--muted); }
.side-row { display: flex; flex-wrap: wrap; gap: .35rem; margin-top: .5rem; }
/* бланк сверху целиком, но не выше 70% экрана — под ним сразу видна форма */
.tpl-preview-card .tpl-preview { width: auto; max-width: 100%; max-height: 70vh; margin: 0 auto; }
.tpl-head-actions { display: flex; gap: .4rem; flex-wrap: wrap; justify-content: flex-end; }
/* строка шаблона «заштрихована»: на бланке зачёркнута, в протоколе всегда 0 */
.crit-row.crit-hatched { opacity: .6; }
td.cell.cell-hatched { background: repeating-linear-gradient(135deg, var(--soft) 0 6px, var(--panel) 6px 12px); text-align: center; }

/* Сортировка таблиц (app.js, table[data-sortable]) */
th.sortable { cursor: pointer; user-select: none; white-space: nowrap; }
th.sortable::after { content: ' ↕'; color: var(--muted); font-weight: 400; }
th.sortable[aria-sort="ascending"]::after { content: ' ▲'; color: inherit; }
th.sortable[aria-sort="descending"]::after { content: ' ▼'; color: inherit; }
.review-cell { min-width: 280px; }
.review-cell textarea { min-height: 3.2em; }
.strong { font-weight: 600; }
input.num-input { width: 5.5em; min-width: 0; }
/* История судейства по сезонам */
.history-table th.season-head { text-align: center; }
.history-table .season-start { border-left: 2px solid var(--line-strong); }
.review-note { max-width: 320px; }
.text-ok { color: var(--ok); }
.history-table td:nth-child(2) { min-width: 11rem; }
select.residence-select { max-width: 11rem; }
select.team-region { width: 10rem; max-width: 100%; font-size: .85rem; }

/* Глазок «показать пароль» справа в поле (app.js оборачивает каждое поле пароля) */
.pw-wrap { position: relative; display: block; }
.pw-wrap > input { padding-right: 2.6rem; }
button.pw-eye {
  position: absolute; top: 50%; right: .3rem; transform: translateY(-50%);
  width: 2rem; height: 2rem; min-height: 0; padding: 0;
  display: inline-flex; align-items: center; justify-content: center;
  background: transparent; border: 0; border-radius: var(--radius);
  color: var(--muted); cursor: pointer;
}
button.pw-eye:hover { background: var(--soft); color: var(--text); }
button.pw-eye:active { transform: translateY(-50%); }
button.pw-eye svg { width: 1.15rem; height: 1.15rem; }
button.pw-eye .pw-slash { display: none; }
button.pw-eye[aria-pressed="true"] .pw-slash { display: inline; }

/* Сведения о команде в карточке: подпись слева, значение справа */
.team-info { display: grid; grid-template-columns: max-content 1fr; gap: .35rem 1rem; margin: .8rem 0 0; }
.team-info dt { color: var(--muted); font-size: .85rem; font-weight: 600; }
.team-info dd { margin: 0; white-space: pre-line; }
@media (max-width: 560px) {
  .team-info { grid-template-columns: 1fr; gap: .1rem; }
  .team-info dd { margin-bottom: .5rem; }
}

/* Сбор данных: конструктор формы и заполнение */
.q-card { position: relative; }
.q-tools { position: absolute; top: .3rem; right: .6rem; display: flex; gap: .25rem; }
.q-answer { margin-bottom: 1rem; }
.q-answer fieldset { margin: 0; }
.q-files { margin: .3rem 0 .5rem; padding-left: 1.1rem; }
.q-files li { margin: .2rem 0; }
.q-files .inline-check { display: inline-flex; margin-left: .6rem; }

/* «Назад» (a[data-back]) и «вперёд» (a.go): кнопка-таблетка со стрелкой,
   стрелка рисуется CSS (у «назад» — слева, у «вперёд» — справа) */
a[data-back], a.go { display: inline-flex; align-items: center; gap: .45rem; max-width: 100%;
  padding: .32rem .8rem .32rem .65rem; margin: 0 .2rem .15rem 0;
  border: 1px solid var(--line-strong); border-radius: 999px; background: var(--panel);
  color: var(--accent); font-size: .85rem; font-weight: 600; line-height: 1.25;
  text-decoration: none; vertical-align: middle;
  transition: background-color .15s, border-color .15s, color .15s; }
a[data-back]::before { content: ''; flex: none; width: .42rem; height: .42rem;
  border-left: 2px solid currentColor; border-bottom: 2px solid currentColor;
  transform: translateX(.1rem) rotate(45deg); transition: transform .15s; }
a[data-back]:hover, a.go:hover { background: var(--accent-soft); border-color: var(--accent); color: var(--accent-hover); }
a[data-back]:hover::before { transform: translateX(-.05rem) rotate(45deg); }
a[data-back]:focus-visible, a.go:focus-visible { outline: none; box-shadow: var(--ring); }
a.go { padding: .32rem .65rem .32rem .8rem; margin: 0 0 .15rem .2rem; }
a.go::after { content: ''; flex: none; width: .42rem; height: .42rem;
  border-right: 2px solid currentColor; border-top: 2px solid currentColor;
  transform: translateX(-.1rem) rotate(45deg); transition: transform .15s; }
a.go:hover::after { transform: translateX(.05rem) rotate(45deg); }

/* ---------- Картинки темы «Стекло» (свои SVG в static/img) ---------- */
/* Баннер главной: приветствие на стекле, справа робот с шестерёнками */
h1.hero { display: flex; align-items: center; min-height: 150px; margin-bottom: .8rem;
  padding: 1.4rem 380px 1.4rem 1.6rem; font-size: 2rem;
  border: 1px solid var(--glass-border); border-radius: var(--radius-lg);
  background: url('img/hero.svg') right 1.2rem bottom / auto 100% no-repeat, rgba(255, 255, 255, .55);
  -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); box-shadow: var(--glass-shadow);
  color: #1e1b4b; }
/* Вход, восстановление и смена пароля: сверху карточки — поле с роботом */
.card.auth-pic { margin-top: 3rem; padding-top: 0; overflow: hidden; }
.card.auth-pic::before { content: ''; display: block; height: 130px; margin: 0 -1.1rem 1.1rem;
  background: url('img/field.svg') center / cover no-repeat; border-bottom: 1px solid var(--line); }
@media (max-width: 640px) {
  h1.hero { min-height: 0; padding: 1rem 1rem 96px; font-size: 1.45rem;
    background-position: right .6rem bottom, 0 0; background-size: auto 88px, auto; }
  .card.auth-pic { margin-top: 1rem; }
  .card.auth-pic::before { margin: 0 -.9rem .9rem; height: 110px; }
  /* размытие на телефоне почти не видно, а батарею ест — карточки плотнее */
  .card, .side, h1.hero { -webkit-backdrop-filter: none; backdrop-filter: none;
    background-color: rgba(255, 255, 255, .82); }
}

/* ---------- Подсказки-обучение (tips.py, app.js) ---------- */
/* «Прожектор»: прозрачная рамка вокруг элемента, всё остальное затемнено */
.tour-spot { position: fixed; z-index: 60; border-radius: 14px; pointer-events: none;
  box-shadow: 0 0 0 3px rgba(255, 255, 255, .9), 0 0 0 9999px rgba(30, 27, 75, .45);
  transition: left .2s, top .2s, width .2s, height .2s; }
.tour-pop { position: fixed; z-index: 61; width: min(340px, calc(100vw - 16px));
  padding: .9rem 1rem .8rem; border-radius: 16px; background: var(--panel-solid);
  box-shadow: 0 16px 40px rgba(30, 27, 75, .28); border-top: 4px solid #8b5cf6; }
.tour-count { font-size: .75rem; font-weight: 600; color: var(--muted); }
.tour-title { display: block; margin: .15rem 0 .3rem; font-size: 1.02rem; }
.tour-pop p { margin: 0 0 .75rem; font-size: .9rem; line-height: 1.45; }
.tour-bar { display: flex; align-items: center; gap: .5rem; }
.tour-bar .link { margin-right: auto; color: var(--muted); font-size: .85rem; }
@media (prefers-reduced-motion: reduce) { .tour-spot { transition: none; } }
/* Кнопка «?» в шапке — показать подсказки страницы заново */
.tour-btn { width: 2rem; min-height: 2rem; height: 2rem; padding: 0;
  border-radius: 999px; font-weight: 700; color: var(--accent); }

/* Шапка в одну строку на ноутбуке: плашка роли видна на главной («Ваши права») */
@media (min-width: 641px) and (max-width: 1360px) { .me .role { display: none; } }

/* Полоса «просмотр от лица» (создатель, /admin/view-as) — только просмотр */
.viewas-bar { display: flex; flex-wrap: wrap;
  align-items: center; justify-content: center; gap: .4rem .9rem; padding: .5rem 1rem;
  background: linear-gradient(90deg, #fef3c7, #fde68a); color: #78350f;
  font-size: .9rem; font-weight: 500; border-bottom: 1px solid #fcd34d; }
/* Админ → «Просмотр от лица»: роль и кнопка */
.va-roles { display: grid; gap: .8rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); }
.va-roles .va-role { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
  gap: .6rem; margin: 0; }
.va-roles .role-badge { white-space: normal; }

/* ---------- Дни соревнований (events/days.html) ---------- */
.daytabs { display: flex; gap: .5rem; flex-wrap: wrap; margin: .2rem 0 1rem; }
.daytab { display: flex; flex-direction: column; gap: .1rem; min-width: 9.5rem; padding: .55rem .9rem;
  border-radius: 16px; border: 1px solid var(--glass-border); background: rgba(255, 255, 255, .55);
  box-shadow: 0 6px 20px rgba(79, 70, 229, .08); text-decoration: none; color: inherit; }
.daytab b { font-size: 1rem; } .daytab small { color: var(--muted); }
.daytab.active { background: #fff; outline: 2px solid #8b5cf6; }
.daytab.add { align-items: center; justify-content: center; border: 2px dashed var(--line-strong);
  background: transparent; color: var(--accent); font-weight: 650; box-shadow: none; }
.day-pick { display: grid; grid-template-columns: minmax(11rem, 1fr) minmax(12rem, 1.4fr) auto; gap: .6rem;
  align-items: center; padding: .4rem 0; border-bottom: 1px solid var(--line); }
.day-pick select { margin: 0; }
/* категории — строками, статусы — колонками: при переносе категория остаётся в своей строке */
.days-board { margin-top: 1rem; }
.db-row { display: grid; grid-template-columns: minmax(9rem, .7fr) repeat(3, minmax(0, 1fr)); gap: 0 .7rem; }
.db-name { display: flex; align-items: center; padding: .5rem .2rem; font-weight: 650;
  border-top: 1px solid var(--line); }
.db-head .db-name { border-top: 0; font-size: .74rem; color: var(--muted); text-transform: uppercase;
  letter-spacing: .04em; font-weight: 650; }
.db-cell { padding: .4rem .5rem; min-height: 4.5rem; }
.db-head .db-cell { min-height: 0; padding: .55rem .6rem; border-radius: 14px 14px 0 0; }
.db-row:last-child .db-cell { border-radius: 0 0 14px 14px; padding-bottom: .6rem; }
.lane-draft { background: rgba(241, 245, 249, .7); }
.lane-active { background: rgba(220, 252, 231, .45); }
.lane-finished { background: rgba(254, 243, 199, .45); }
.st { display: inline-flex; align-items: center; gap: .35rem; padding: .15rem .6rem; border-radius: 999px;
  font-size: .78rem; font-weight: 650; }
.st::before { content: ''; width: .5rem; height: .5rem; border-radius: 50%; background: currentColor; }
.st.draft { background: #eef0f4; color: #5b6270; } .st.active { background: #dcfce7; color: #166534; }
.st.finished { background: #fef3c7; color: #92400e; }
.day-card { padding: .6rem .7rem; border-radius: 14px; background: var(--panel-solid);
  border: 1px solid var(--line); border-left: 5px solid #cbd5e1; box-shadow: 0 2px 8px rgba(79, 70, 229, .06); }
.day-card.s-active { border-left-color: #22c55e; } .day-card.s-finished { border-left-color: #f59e0b; }
.day-card .meta { display: flex; flex-wrap: wrap; gap: .35rem; align-items: center; margin-bottom: .2rem; }
.tpl { display: inline-flex; align-items: center; gap: .3rem; padding: .12rem .55rem; border-radius: 999px;
  background: rgba(139, 92, 246, .12); color: #5b21b6; font-weight: 600; font-size: .78rem; }
.rounds { display: inline-flex; gap: .2rem; }
.rounds i { width: 1.35rem; height: 1.35rem; border-radius: 6px; background: rgba(79, 70, 229, .12);
  color: var(--accent); font-style: normal; font-size: .72rem; font-weight: 700;
  display: inline-flex; align-items: center; justify-content: center; }
.rounds i.done { background: #22c55e; color: #fff; }
.day-card .mv { display: flex; justify-content: space-between; gap: .4rem; margin-top: .45rem; }
.day-setup { display: flex; flex-wrap: wrap; gap: .4rem; align-items: center; margin-top: .4rem; }
.day-setup select { width: auto; max-width: 100%; }
@media (max-width: 900px) {
  /* узко: строка категории — название сверху, статус-колонки под ним */
  .db-row { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .db-name { grid-column: 1 / -1; }
  .db-head .db-name { display: none; }
  .day-pick { grid-template-columns: 1fr; }
}

/* Профиль → «Уведомления»: типы с подсказкой */
.notif-kinds { display: grid; gap: .3rem 1rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); }
.notif-kind { align-items: flex-start !important; padding: .35rem 0; }
.notif-kind input { margin-top: .2rem; }
.notif-kind span { display: flex; flex-direction: column; }
.notif-kind small { font-size: .78rem; line-height: 1.3; }

/* Блок формы «на месте» (app.js, data-inplace) — пока идёт запрос */
[data-region].is-busy { opacity: .6; pointer-events: none; transition: opacity .15s; }

/* название категории на доске — кнопка «провалиться» в карточку категории */
a.go.db-open { margin: 0; font-size: .92rem; color: var(--text); white-space: normal; }
/* сообщение после формы «на месте», когда верх страницы прокручен */
.flash.flash-float { position: fixed; top: 4.6rem; left: 50%; transform: translateX(-50%); z-index: 45;
  width: max-content; max-width: min(92vw, 640px); box-shadow: 0 10px 30px rgba(30, 27, 75, .18); }

/* Судьи по полям (events/judges_fields.html): галочки по центру, колонки полей узкие */
.jf-table th.jf-col, .jf-table td.jf-cell { text-align: center; width: 1%; white-space: nowrap; }
.jf-table th.jf-col small { display: block; font-weight: 600; text-transform: none; letter-spacing: 0; }
.jf-table td.jf-cell input { width: 1.25rem; height: 1.25rem; cursor: pointer; }
.jf-table tr.jf-here td { background: rgba(220, 252, 231, .35); }

/* Обеды судей (events/lunches.html): поля строками, время и столовая сохраняются сразу */
.lunch-table input[type=time] { width: 7.2rem; font-variant-numeric: tabular-nums; }
.lunch-table select { min-width: 11rem; }
.lunch-table tr.lunch-empty td { background: rgba(251, 241, 223, .55); }
.lunch-table tr.lunch-saving td { opacity: .7; }
.lunch-table tr.lunch-group th { background: var(--accent-soft); padding: .3rem .5rem;
  text-transform: none; letter-spacing: 0; font-size: .95rem; color: var(--text); }
.lunch-toggle { background: transparent; border: 0; min-height: 32px; padding: .2rem .4rem;
  font-weight: 650; color: var(--text); gap: .45rem; }
.lunch-toggle:hover { background: rgba(255, 255, 255, .6); }
.lunch-caret { display: inline-block; transition: transform .15s; color: var(--accent); }
.lunch-folded .lunch-caret { transform: rotate(-90deg); }
.lunch-folded tr:not(.lunch-group) { display: none; }
.canteen-row, .canteen-head { display: grid; gap: .5rem; align-items: center;
  grid-template-columns: minmax(9rem, 1.2fr) minmax(9rem, 1.3fr) 7.2rem 7.2rem 5.5rem 12.5rem; }
.canteen-row { padding: .45rem 0; border-top: 1px solid var(--line); }
.canteen-head { padding-bottom: .2rem; }
.canteen-new { margin-top: .3rem; }
@media (max-width: 760px) {
  .canteen-row { grid-template-columns: 1fr 1fr; }
  .canteen-head { display: none; }
}
/* Загрузка столовых (events/_canteens.html): карточки, «сейчас», полоса по 15 минут */
.cl-grid { display: grid; gap: .8rem; align-items: start;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 21rem), 1fr)); }
.cl-card { display: flex; flex-direction: column; gap: .35rem; margin: 0; }
.cl-card-flat { background: var(--soft); border-radius: var(--radius); padding: .7rem .85rem; }
.cl-head { display: flex; justify-content: space-between; align-items: flex-start; gap: .6rem; }
.cl-now-line { display: flex; align-items: baseline; gap: .5rem; flex-wrap: wrap; }
.cl-big { font-size: 1.8rem; font-weight: 750; font-variant-numeric: tabular-nums; line-height: 1.1; }
.cl-of { font-size: 1rem; font-weight: 600; color: var(--muted); }
.cl-title { min-width: 0; }
.cl-now-box { background: var(--soft); border-radius: var(--radius); padding: .55rem .7rem;
  display: flex; flex-direction: column; gap: .35rem; }
.cl-free { margin-left: auto; font-weight: 650; color: var(--ok); white-space: nowrap; }
.cl-meter { height: .6rem; }
.meter span.cl-fill-ok { background: var(--ok); }
.meter span.cl-fill-busy { background: #d08a00; }
.meter span.cl-fill-full { background: var(--err); }
.meter span.cl-fill-closed { background: var(--muted); }
.cl-stats { display: flex; flex-wrap: wrap; gap: .2rem .8rem; }
.cl-chart { display: block; width: 100%; height: auto; margin-top: .2rem; }
.cl-chart .cl-bar { fill: var(--accent); opacity: .8; }
.cl-chart .cl-bar.busy { fill: #d08a00; }
.cl-chart .cl-bar.over { fill: var(--err); }
.cl-chart .cl-closed { fill: rgba(100, 107, 117, .09); }
.cl-chart .cl-axis-line, .cl-chart .cl-tick { stroke: var(--line-strong); stroke-width: 1; }
.cl-chart .cl-label { fill: var(--muted); font-size: 10.5px; font-variant-numeric: tabular-nums; }
.cl-chart .cl-cap { stroke: var(--err); stroke-width: 1; stroke-dasharray: 4 3; }
.cl-chart .cl-cap-label { fill: var(--err); font-size: 10px; font-weight: 600; }
.cl-chart .cl-now { stroke: var(--text); stroke-width: 1.6; }
.cl-chart .cl-now-label { fill: var(--text); font-size: 10.5px; font-weight: 700; }
.cl-schedule { width: 100%; border-collapse: collapse; margin-top: .3rem; }
.cl-schedule td { padding: .3rem .35rem; border-bottom: 1px solid var(--line); vertical-align: top; }
.cl-schedule tr:last-child td { border-bottom: 0; }
.cl-schedule tr.cl-row-now td { background: var(--accent-soft); }
/* «Мой день» (my_day.html) и плашка на главной */
.myday-banner { display: flex; justify-content: space-between; align-items: center; gap: .8rem; flex-wrap: wrap;
  padding: .7rem 1rem; margin-bottom: 1rem; border-radius: var(--radius-lg); text-decoration: none;
  color: var(--text); background: linear-gradient(120deg, rgba(99, 102, 241, .14), rgba(236, 72, 153, .12));
  border: 1px solid var(--glass-border); }
.myday-banner:hover { background: linear-gradient(120deg, rgba(99, 102, 241, .2), rgba(236, 72, 153, .17)); }
.myday-grid { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 1rem; align-items: start;
  margin-top: .4rem; }
.myday-field { font-size: 1.6rem; font-weight: 750; line-height: 1.15; }
.myday-lunch { border-radius: var(--radius); padding: .7rem .85rem; border: 1px solid var(--glass-border);
  background: linear-gradient(120deg, rgba(99, 102, 241, .13), rgba(236, 72, 153, .11)); }
.myday-lunch.now { background: var(--primary-grad); color: #fff; }
.myday-lunch.past { background: var(--soft); color: var(--muted); }
.myday-time { font-size: 1.5rem; font-weight: 750; font-variant-numeric: tabular-nums; line-height: 1.2; }
.myday-people { display: grid; grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); gap: 1rem;
  padding-top: .7rem; border-top: 1px solid var(--line); }
@media (max-width: 640px) { .myday-grid { grid-template-columns: 1fr; } }

/* Соглашение о cookie (base.html): внизу, пока не принято */
.cookie-bar { position: fixed; z-index: 60; left: max(.75rem, env(safe-area-inset-left, 0px));
  right: max(.75rem, env(safe-area-inset-right, 0px)); bottom: calc(.75rem + env(safe-area-inset-bottom, 0px));
  display: flex; gap: .8rem; align-items: center; justify-content: space-between; flex-wrap: wrap;
  max-width: 56rem; margin: 0 auto; padding: .75rem 1rem; border-radius: var(--radius-lg);
  background: var(--panel-solid); border: 1px solid var(--line-strong); box-shadow: 0 12px 40px rgba(30, 27, 75, .2); }
.cookie-bar p { margin: 0; flex: 1 1 18rem; font-size: .9rem; }
.cookie-bar form { margin: 0; }

/* Протокол без сети: строка состояния и подсветка клеток */
.netbar { border-radius: var(--radius); padding: .55rem .75rem; font-size: .88rem; line-height: 1.4; margin: .6rem 0; }
.netbar.warn { background: var(--warn-soft); color: var(--warn); }
.netbar.err { background: var(--err-soft); color: var(--err); }
.offline-pending { background: var(--warn-soft) !important; border-color: #e7c88a !important;
  border-radius: 10px; }
.offline-conflict { background: var(--err-soft) !important; border-color: #eec3c0 !important;
  border-radius: 10px; box-shadow: 0 0 0 2px rgba(163, 32, 32, .25); }

/* Датасет: журнал последней подачи в NEURO */
.feed-log { white-space: pre-wrap; margin: .3rem 0 0; max-height: 9rem; overflow: auto;
  background: var(--soft); border-radius: var(--radius); padding: .4rem .6rem; }

/* Поле у судьи (protocols/field.html): на телефоне — номер команды и кнопка рядом */
.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; }
.teams-mobile { display: none; width: 100%; border-collapse: separate; border-spacing: 0 .45rem;
  background: transparent; }
.teams-mobile tbody tr:last-child td { border-bottom: 1px solid var(--glass-border); }
.teams-mobile td { background: var(--panel); border: 1px solid var(--glass-border); padding: .55rem .7rem;
  vertical-align: middle; }
.teams-mobile td.tm-num { border-right: 0; border-radius: var(--radius) 0 0 var(--radius); width: 100%; }
.teams-mobile td.tm-num strong { font-size: 1.15rem; font-variant-numeric: tabular-nums; }
.teams-mobile .tm-name { font-size: .9rem; line-height: 1.3; margin: .1rem 0 .25rem; overflow-wrap: anywhere; }
.teams-mobile td.tm-go { border-left: 0; border-radius: 0 var(--radius) var(--radius) 0; text-align: right;
  white-space: nowrap; }
@media (max-width: 640px) {
  .teams-mobile { display: table; }
  .teams-full { display: none; }
}

/* Расписание попыток (events/round_times.html) */
.myday-next { background: var(--accent-soft); border-radius: var(--radius); padding: .45rem .65rem; font-size: .92rem; }
.rt-group > summary { list-style: none; }
.rt-summary { display: flex; align-items: baseline; gap: .4rem; flex-wrap: wrap; }
.rt-title { font-size: 1.1rem; font-weight: 700; color: var(--text); }
.rt-q input[type=number] { width: 5rem; }
.rt-table th.rt-col, .rt-table td.rt-cell { text-align: center; white-space: nowrap; }
.rt-table input[type=time] { width: 7.2rem; font-variant-numeric: tabular-nums; }
.rt-form { margin: 0; }

/* обед поля у судьи («Мои назначения», «Мои поля») */
.lunch-line { white-space: nowrap; font-variant-numeric: tabular-nums; }
.lunch-line.today { font-weight: 650; color: var(--accent); }

/* ---------- Опыт судейства лентой по годам (профиль, _profile_fields.html) ---------- */
.exp-timeline { position: relative; padding-left: 1.9rem; margin-top: .6rem; }
.exp-timeline::before { content: ''; position: absolute; left: .55rem; top: .35rem; bottom: .35rem; width: 3px;
  border-radius: 3px; background: linear-gradient(#6366f1, #ec4899); }
.exp-year { position: relative; margin-bottom: 1rem; }
.exp-year > h3 { margin: 0 0 .35rem; }
.exp-year::before { content: ''; position: absolute; left: -1.65rem; top: .2rem; width: .95rem; height: .95rem;
  border-radius: 50%; background: #fff; border: 3px solid #8b5cf6; }
.exp-item { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .8rem; align-items: center;
  padding: .7rem .8rem; margin: .45rem 0; border-radius: 14px; background: rgba(255, 255, 255, .8);
  border: 1px solid var(--line); }
.exp-item:target { outline: 2px solid #8b5cf6; }
.exp-doc { display: flex; align-items: center; justify-content: flex-end; gap: .6rem; }
.st.none { background: #eef0f4; color: #5b6270; } .st.pending { background: #e0e7ff; color: #3730a3; }
.st.approved { background: #dcfce7; color: #166534; } .st.rejected { background: #fee2e2; color: #991b1b; }
.st.site { background: #ccfbf1; color: #115e59; }
@media (max-width: 640px) {
  .exp-item { grid-template-columns: 1fr; }
  .exp-doc { justify-content: flex-start; }
}

/* История по сезонам: подтверждённый опыт из анкеты */
.confirmed-note { color: var(--ok); }

/* Пуш-уведомления: устройства в профиле */
.push-devices { list-style: none; padding: 0; margin: .5rem 0 0; }
.push-devices li { display: flex; justify-content: space-between; align-items: center; gap: .5rem;
                   padding: .25rem 0; border-bottom: 1px solid var(--line); }
.push-devices form { margin: 0; }
.push-steps li { margin: .3rem 0; }

/* ---------- Пульт оргкомитета: раздел «Виджеты» (events/widgets.html, app/widgets.py) ----------
   Под компьютер: колонки раскладки (сетка из 12 долей, .sp-N — ширина колонки), в каждой
   виджеты друг под другом. Конструктор — класс .pb-on на [data-pult-builder]: у виджетов
   полоса правки (перетащить, ⚙, стрелки, ✕), колонки принимают перетаскивание.
   Состояние плитки (st-ok / st-warn / st-err) всегда подписано словом — .wg-badge. */
.pult-bar { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; margin: .2rem 0 .8rem; }
.pult-lbl { font-size: .74rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
/* сегментный переключатель дня и попытки (шапка пульта) */
.pult-seg { display: inline-flex; gap: 2px; padding: 3px; border-radius: var(--radius); background: var(--btn);
  border: 1px solid var(--btn-line); }
.pult-seg a { display: inline-flex; align-items: baseline; gap: .35rem; padding: .3rem .75rem; border-radius: 9px;
  color: var(--text); text-decoration: none; font-weight: 500; white-space: nowrap; transition: background-color .15s; }
.pult-seg a:hover { background: var(--accent-soft); }
.pult-seg a.on { background: var(--primary-grad); color: #fff; font-weight: 600; }
.pult-seg small { font-size: .8em; opacity: .75; }
.pult-seg a:focus-visible { box-shadow: var(--ring); outline: none; }
button.small.pult-gear { min-width: 2.4rem; height: 2.2rem; padding: 0 .55rem; font-size: 1.25rem; line-height: 1; }
.pult-cols { display: grid; gap: 1rem; align-items: start; grid-template-columns: repeat(12, minmax(0, 1fr)); }
.pult-col { display: flex; flex-direction: column; gap: 1rem; min-width: 0; min-height: 3rem; }
.sp-3 { grid-column: span 3; } .sp-4 { grid-column: span 4; } .sp-5 { grid-column: span 5; }
.sp-6 { grid-column: span 6; } .sp-8 { grid-column: span 8; } .sp-12 { grid-column: span 12; }
@media (max-width: 1100px) {
  .pult-cols { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pult-col { grid-column: auto; }
}
@media (max-width: 700px) { .pult-cols { grid-template-columns: minmax(0, 1fr); } }
.pw.is-busy { opacity: .6; }
.pq-item { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem .5rem; padding: .45rem 0;
  border-top: 1px solid var(--line); font-size: .88rem; }
.pq-item:first-child { border-top: 0; }
.pq-group + .pq-group { margin-top: .5rem; }
.pq-head { display: flex; justify-content: space-between; align-items: baseline; gap: .5rem;
  font-size: .72rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--muted);
  padding-bottom: .1rem; }
.pq-head a { text-transform: none; letter-spacing: 0; font-weight: 600; font-size: .8rem; }
.pq-n { display: inline-block; min-width: 1.3rem; padding: 0 .35rem; border-radius: 999px; text-align: center;
  background: var(--soft); color: var(--text); letter-spacing: 0; }
.pq-text { flex: 1 1 10rem; min-width: 0; }
.pq-acts { display: flex; gap: .3rem; flex-wrap: wrap; }
.pq-acts form, .wg-foot form { margin: 0; }
.pw-body { display: flex; flex-direction: column; gap: .5rem; min-width: 0; }
.pp-upload { display: grid; gap: .35rem; justify-items: start; margin: 0; }
/* таблицы правки в узкой колонке пульта — без прокрутки вбок: ФИО переносятся,
   поля времени сжимаются по ширине клетки */
.pp-table { width: 100%; font-size: .85rem; table-layout: auto; }
.pp-table td, .pp-table th { padding-left: .25rem; padding-right: .25rem; }
.pp-table td.pp-field { white-space: normal; overflow-wrap: anywhere; min-width: 4rem; }
.pp-table input[type=time] { width: 100%; min-width: 4.9rem; max-width: 6.4rem; padding-left: .3rem; padding-right: .2rem; }
.pp-table td.rt-cell { white-space: normal; }
.pp-table thead th, .pp-table tr.rt-head th { white-space: normal; text-transform: none; letter-spacing: 0;
  font-size: .78rem; }
.pp-table input[type=time] { min-width: 4.2rem; font-size: .8rem; }
.pp-table select { min-width: 0; max-width: 9.5rem; }
.pp-table input[type=time], .pp-table select { padding-left: .35rem; padding-right: .35rem; }
.pp-kpis { grid-template-columns: repeat(auto-fill, minmax(7.5rem, 1fr)); margin: 0; }
.pp-group { border-top: 1px solid var(--line); padding-top: .5rem; margin-top: .3rem; }
.pp-group .rt-q input[type=number] { width: 4.2rem; }
.pp-table .rt-q { margin: 0; gap: .3rem; }
.pp-table .rt-q input[type=number] { width: 4.2rem; }
.pp-table tr.rt-head th { font-size: .75rem; }
.pp-cats { gap: .3rem; margin: .2rem 0 .5rem; }
.pp-table tr.rt-qrow td { padding-top: .2rem; padding-bottom: .2rem; }
.pm-table tbody th, .rc-table tbody th { text-transform: none; letter-spacing: 0; font-size: .88rem; color: var(--text); font-weight: 600; }
.pm-table tbody th { white-space: normal; min-width: 5.5rem; }
.pm-cell small { font-size: .7rem; }
/* сверка протоколов: блок на попытку (как .kpi, крупнее), цвет — состояние */
.rc-blocks { display: grid; gap: .7rem; }
.rc-block { border-radius: var(--radius-lg); padding: .8rem .9rem; background: var(--soft);
  display: flex; flex-direction: column; gap: .2rem; min-width: 0; }
.rc-block.rc-ok { background: var(--ok-soft); }
.rc-block.rc-warn { background: var(--warn-soft); }
.rc-block.rc-part { background: var(--accent-soft); }
.rc-head { display: flex; justify-content: space-between; gap: .4rem; flex-wrap: wrap; align-items: baseline; }
.rc-round { font-weight: 700; font-size: .9rem; }
.rc-word { font-size: .75rem; font-weight: 650; color: var(--muted); }
.rc-num { font-size: 1.9rem; font-weight: 750; line-height: 1.1; font-variant-numeric: tabular-nums; color: var(--muted); }
.rc-ok .rc-num, .rc-ok .rc-word { color: var(--ok); }
.rc-warn .rc-num, .rc-warn .rc-word { color: var(--warn); }
.rc-part .rc-num, .rc-part .rc-word { color: var(--accent); }
.rc-label { font-size: .82rem; color: var(--muted); }
.rc-block .meter { background: rgba(255, 255, 255, .7); }
.rc-ok .meter span { background: var(--ok); }
.rc-warn .meter span { background: #d08a00; }
.rc-cats { list-style: none; margin: .3rem 0 0; padding: 0; font-size: .82rem; }
.rc-cats li { display: flex; justify-content: space-between; gap: .5rem; padding: .12rem 0;
  border-top: 1px solid rgba(79, 70, 229, .1); }
.rc-cats b { font-weight: 650; font-variant-numeric: tabular-nums; white-space: nowrap; }
.rc-foot { font-size: .78rem; color: var(--muted); margin-top: .2rem; }
.rc-block .wg-link { font-size: .8rem; }
.st-warn { color: var(--warn); }

/* конструктор */
.pw-edit, .pb-drop { display: none; }
.pb-on .pw-edit { display: flex; flex-wrap: wrap; align-items: center; gap: .25rem; margin: -.3rem -.4rem .2rem;
  padding: .3rem .4rem; border-radius: var(--radius); background: var(--accent-soft); }
.pb-on .pw-edit button { min-height: 0; padding: .15rem .5rem; }
.pw-name { flex: 1; min-width: 6rem; font-size: .85rem; }
.pw-grip { cursor: grab; font-size: 1.1rem; color: var(--accent); padding: 0 .2rem; }
.pb-on .pw { outline: 2px dashed var(--line-strong); outline-offset: 2px; }
.pb-on .pw-body { opacity: .55; pointer-events: none; }
.pb-on .pw.pw-drag { opacity: .4; }
.pb-on .pb-drop { display: block; margin: 0; padding: .9rem; text-align: center; color: var(--muted);
  border: 2px dashed var(--line-strong); border-radius: var(--radius); font-size: .85rem; }
.pb-on .pult-col.pb-over .pb-drop { border-color: var(--accent); color: var(--accent); background: var(--accent-soft); }
.pw-settings { display: grid; gap: .3rem; padding: .5rem; margin-bottom: .3rem; border-radius: var(--radius);
  background: var(--soft); }
.pw-settings select, .pw-settings input, .pw-settings textarea { width: 100%; }
.pw-checks { border: 0; margin: 0; padding: 0; display: grid; gap: .15rem; }
.pw-checks label { display: flex; align-items: center; gap: .4rem; font-size: .85rem; margin: 0; }
.pw-checks input { width: auto; }
.pw-new { border-style: dashed; }
.pw.pw-flash { box-shadow: 0 0 0 3px var(--accent); }
.pb-bar { margin-bottom: .8rem; }
.pb-layout { position: relative; display: inline-flex; flex-direction: column; align-items: center; gap: .15rem; margin: 0; cursor: pointer;
  padding: .3rem .4rem; border-radius: var(--radius); border: 1px solid transparent; }
.pb-layout input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.pb-layout:has(input:checked) { border-color: var(--accent); background: var(--accent-soft); }
.pb-layout:has(input:focus-visible) { box-shadow: var(--ring); }
.pb-layout-pic { display: grid; grid-template-columns: repeat(12, 1fr); gap: 2px; width: 4.2rem; height: 1.6rem; }
.pb-layout-pic i { background: var(--line-strong); border-radius: 3px; }
.pb-layout:has(input:checked) .pb-layout-pic i { background: var(--accent); }
.modal.modal-wide { width: min(980px, calc(100% - 1.5rem)); }
.pb-group { margin: .8rem 0 .4rem; font-size: .95rem; }
.pb-cards { display: grid; gap: .8rem; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); }
.pb-card { display: flex; flex-direction: column; gap: .5rem; padding: .6rem; border: 1px solid var(--line);
  border-radius: var(--radius-lg); background: var(--panel-solid); }
.pb-card > button { align-self: flex-start; }
.pb-about { display: grid; gap: .2rem; }
/* предпросмотр: настоящий виджет на данных мероприятия, уменьшенный и обрезанный снизу */
.pb-preview { position: relative; height: 230px; overflow: hidden; border-radius: var(--radius);
  background: var(--mesh); padding: .5rem; pointer-events: none; user-select: none; }
.pb-preview > .pw { width: 133%; transform: scale(.75); transform-origin: 0 0; box-shadow: none; }
.pb-preview::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 48px;
  background: linear-gradient(rgba(255, 255, 255, 0), var(--panel-solid)); }

/* пульт попыток: клетка — кнопка состояния */
.pm-table { width: 100%; border-collapse: separate; border-spacing: 4px; }
.pm-table th, .pm-table td { padding: 0; border: 0; background: none; vertical-align: middle; }
.pm-table thead th { font-size: .78rem; color: var(--muted); font-weight: 600; text-align: center;
  white-space: normal; text-transform: none; letter-spacing: 0; }
.pm-table thead th:first-child, .pm-table tbody th { text-align: left; padding-right: .4rem; font-size: .88rem; }
.pm-table form { margin: 0; }
.pm-cell { display: block; width: 100%; min-width: 4.4rem; text-align: center; font: inherit; font-size: .82rem;
  font-weight: 700; border-radius: 10px; padding: .4rem .3rem; border: 1px solid var(--btn-line);
  background: var(--btn); color: var(--muted); }
button.pm-cell { cursor: pointer; }
button.pm-cell:hover { border-color: var(--accent); background: var(--btn-hover); }
.pm-cell small { display: block; font-weight: 500; font-size: .74rem; }
.pm-cell.pm-run { background: var(--ok-soft); color: var(--ok); border-color: transparent; }
.pm-cell.pm-end { background: #eceef2; color: var(--muted); border-color: transparent; }
/* пульт сверки (pult/recon_matrix.html): сверено — зелёным, ждут сверки — жёлтым; клетка-ссылка */
a.pm-cell { text-decoration: none; cursor: pointer; }
a.pm-cell:hover { border-color: var(--accent); }
.pm-cell.rm-ok { background: var(--ok-soft); color: var(--ok); border-color: transparent; }
.pm-cell.rm-wait { background: var(--warn-soft); color: var(--warn); border-color: transparent; }
a.pm-cell.rm-wait small { text-decoration: underline; font-weight: 700; }
.pm-table .st-ok { color: var(--ok); font-weight: 600; }

/* плитка */
.wg-checks { grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); }
.wg { background: var(--panel); border: 1px solid var(--glass-border); border-radius: var(--radius-lg);
  -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); box-shadow: var(--glass-shadow);
  padding: .9rem 1rem; display: flex; flex-direction: column; gap: .5rem; min-width: 0; }
.wg-head { display: flex; align-items: center; gap: .45rem; }
.wg-icon { font-size: 1.1rem; line-height: 1; }
.wg-title { margin: 0; font-size: .95rem; font-weight: 650; flex: 1; min-width: 0; }
.wg-badge { font-size: .72rem; font-weight: 600; padding: .1rem .5rem; border-radius: 999px;
  background: var(--soft); color: var(--muted); white-space: nowrap; }
.wg-badge.st-ok { background: var(--ok-soft); color: var(--ok); }
.wg-badge.st-warn { background: var(--warn-soft); color: var(--warn); }
.wg-badge.st-err { background: var(--err-soft); color: var(--err); }
.wg-main { display: flex; align-items: baseline; gap: .5rem; flex-wrap: wrap; }
.wg-value { font-size: 1.6rem; font-weight: 700; line-height: 1.1; font-variant-numeric: tabular-nums;
  overflow-wrap: anywhere; }
.wg-caption { color: var(--muted); font-size: .85rem; margin: 0; }
.meter.wg-meter { height: .45rem; }
.wg-rows { list-style: none; margin: 0; padding: 0; font-size: .87rem; }
.wg-row { display: flex; justify-content: space-between; align-items: center; gap: .6rem; padding: .22rem 0;
  border-top: 1px solid var(--line); }
.wg-row-label { min-width: 0; }
/* строка с моментом (последние действия): действие, ниже — когда и кто */
.wg-row.stack { display: block; }
.wg-row.stack .wg-row-value { display: block; text-align: left; font-size: .8rem; }
.wg-row-value { color: var(--muted); text-align: right; font-variant-numeric: tabular-nums; }
.wg-row-value.st-ok, .wg-row-value .st-ok { color: var(--ok); font-weight: 600; }
.wg-row-value.st-warn { color: var(--warn); font-weight: 600; }
.wg-row-value.st-err { color: var(--err); font-weight: 600; }
.wg-empty { margin: 0; color: var(--muted); font-size: .87rem; }
.wg-foot { margin-top: auto; display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; }
.wg-link { font-size: .87rem; font-weight: 600; margin-right: auto; }

/* Судьи по полям — «поля списком»: карточка поля, судьи категории галочками-чипами */
.jf-fields { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 340px), 1fr)); align-items: start; }
.jf-field { margin: 0; }
.jf-pool { display: flex; flex-wrap: wrap; gap: .35rem; margin-top: .6rem; }
.jf-chip { display: inline-flex; align-items: center; gap: .4rem; margin: 0; padding: .3rem .6rem; border-radius: 999px;
  border: 1px solid var(--btn-line); background: var(--btn); font-size: .88rem; cursor: pointer; }
.jf-chip:has(input:checked) { background: var(--accent-soft); border-color: var(--accent); font-weight: 600; }
.jf-chip.jf-busy { opacity: .6; }
.jf-chip input { margin: 0; }
/* предпросмотр в каталоге — как обычный виджет, без пометок режима настройки */
.pb-on .pb-preview .pw { outline: none; }
.pb-on .pb-preview .pw-body { opacity: 1; }

/* Отбор заявок старшим судьёй (applications/board.html): колонки, рейтинг, этапы */
.kb-plan { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem 1rem; }
.kb-plan .meter { flex: 1 1 12rem; max-width: 22rem; }
.kb-plan .meter span { background: var(--ok); }
.kb { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .7rem; align-items: start; }
.kb-col { background: rgba(255, 255, 255, .45); border: 1px solid var(--glass-border); border-radius: var(--radius-lg);
  padding: .6rem; min-height: 12rem; }
.kb-col.kb-over { outline: 2px dashed var(--accent); outline-offset: -4px; }
.kb-head { display: flex; align-items: center; gap: .45rem; font-weight: 650; padding: .2rem .3rem .5rem; }
.kb-head .n { margin-left: auto; font-variant-numeric: tabular-nums; color: var(--muted); font-weight: 600; }
.kb-dot { display: inline-block; width: .55rem; height: .55rem; border-radius: 50%; flex: none; background: var(--muted); }
.kb-dot.maybe { background: var(--warn); } .kb-dot.no { background: var(--err); } .kb-dot.yes { background: var(--ok); }
.kb-prio { margin: .9rem 0 .4rem; font-size: .75rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.kb-prio:first-of-type { margin-top: .2rem; }
.kb-empty { color: var(--muted); font-size: .88rem; padding: .6rem .3rem; margin: 0; }
.kb-card { background: var(--panel-solid); border: 1px solid var(--line); border-radius: var(--radius); padding: .55rem .65rem; cursor: grab; }
.kb-card + .kb-card { margin-top: .45rem; }
.kb-card.kb-dragging { opacity: .5; }
.kb-name { font-weight: 650; }
.kb-tags { display: flex; flex-wrap: wrap; gap: .25rem; margin-top: .35rem; }
.kb-cats { font-size: .8rem; color: var(--muted); margin-top: .3rem; }
.kb-cats b { color: var(--text); }
.kb-pick { display: flex; flex-wrap: wrap; gap: .3rem; margin-top: .45rem; }
.kb-pick button.on-yes { background: var(--ok-soft); color: var(--ok); border-color: #b9dcc4; }
.kb-pick button.on-maybe { background: var(--warn-soft); color: var(--warn); border-color: #ecd3a3; }
.kb-pick button.on-no { background: var(--err-soft); color: var(--err); border-color: #eec3c0; }
.kb-foot { margin-top: .6rem; }
.kb-done { display: flex; flex-wrap: wrap; gap: .35rem; }
.kb-chip { display: inline-flex; align-items: center; gap: .3rem; padding: .1rem .2rem .1rem .6rem; border-radius: 999px;
  background: var(--soft); border: 1px solid var(--line); font-size: .85rem; }
.kb-chip button { min-height: 26px; padding: 0 .5rem; }
.tag.prio1 { background: var(--accent-soft); color: var(--accent); }
.tag.other-maybe { background: var(--warn-soft); color: var(--warn); }
.tag.other-no { background: var(--soft); color: var(--muted); }
.rate { display: inline-flex; align-items: baseline; gap: .2rem; padding: .1rem .5rem; border-radius: 999px; font-weight: 700;
  font-size: .9rem; font-variant-numeric: tabular-nums; white-space: nowrap; }
.rate small { font-weight: 600; font-size: .7rem; opacity: .8; }
.rate.hi { background: var(--ok-soft); color: var(--ok); }
.rate.mid { background: var(--accent-soft); color: var(--accent); }
.rate.lo { background: var(--warn-soft); color: var(--warn); }
.rate.none { background: var(--soft); color: var(--muted); font-weight: 600; font-size: .8rem; }
.last3 { margin: .4rem 0 0; padding: 0; list-style: none; font-size: .78rem; color: var(--muted); }
.last3 li { line-height: 1.3; display: flex; justify-content: space-between; align-items: flex-start; gap: .4rem; }
.rate.sm { flex: none; padding: 0 .4rem; font-size: .75rem; }
.last3 li + li { margin-top: .15rem; }
.last3 li b { color: var(--text); font-weight: 600; }
.choice-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .6rem; margin-bottom: .6rem; }
.score-pick { display: inline-flex; border: 1px solid var(--line); border-radius: 999px; overflow: hidden; }
.score-pick label { margin: 0; }
.score-pick input { position: absolute; opacity: 0; pointer-events: none; }
.score-pick span { display: inline-block; min-width: 2.2rem; padding: .35rem .5rem; text-align: center; font-weight: 700;
  color: var(--muted); cursor: pointer; }
.score-pick label + label span { border-left: 1px solid var(--line); }
.score-pick input:checked + span { background: var(--accent); color: #fff; }
.score-pick input:focus-visible + span { outline: 2px solid var(--accent); outline-offset: -2px; }
@media (max-width: 1000px) {
  .kb { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .choice-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .kb, .choice-grid { grid-template-columns: minmax(0, 1fr); }
}

/* Проверка одной формы логистики (logistics/check.html): анкета слева, решение справа */
.lg-check { display: grid; grid-template-columns: minmax(0, 1fr) 22rem; gap: 1rem; align-items: start; }
.lg-form { display: grid; gap: 1rem; min-width: 0; }
.lg-trips { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.lg-trips .card, .lg-form > .card { margin: 0; }
.lg-dl { display: grid; grid-template-columns: 9.5rem minmax(0, 1fr); gap: .45rem .8rem; margin: 0; }
.lg-dl dt { color: var(--muted); font-size: .9rem; }
.lg-dl dd { margin: 0; }
.lg-decide { position: sticky; top: 1rem; margin: 0; }
.lg-btn { width: 100%; justify-content: center; }
.lg-reasons { border: 0; padding: 0; margin: 1rem 0 .8rem; display: grid; gap: .35rem; }
.lg-reasons legend { color: var(--muted); margin-bottom: .3rem; }
.lg-reasons .check { font-size: .9rem; align-items: flex-start; padding: .25rem .4rem; border-radius: 8px; }
.lg-reasons .check input { margin-top: .2rem; flex: none; width: 1rem; height: 1rem; }
.lg-more { display: grid; gap: .35rem; }
.lg-more summary { cursor: pointer; color: var(--accent); padding: .2rem .4rem; }
.lg-more[open] summary { margin-bottom: .2rem; }
.lg-reasons .lg-hint { background: var(--warn-soft); }
.lg-reasons textarea { width: 100%; }
@media (max-width: 900px) {
  .lg-check, .lg-trips { grid-template-columns: 1fr; }
  .lg-decide { position: static; }
}