/* Страницы турниров Единой федерации шахмат г. Иркутска.

   Дополнение к оформлению главной, а не второе оформление: цвета, шрифты,
   шапка, низ и ширина поля берутся из `/style.css`, здесь только то, чего на
   главной нет, — афиша турнира, состав и форма записи.

   Три правила, от которых пляшет весь файл:

   1. Полотно кремовое. Белых листов и карточек с тенями нет: федерация — не
      школа и не центр творчества, её страницу читают тренер и разрядник, и
      она должна выглядеть как строгий разворот, а не как набор плиток.
   2. Синяя полоса — одна на экран. Афиша и низ сайта, между ними спокойное
      чтение. Громкого места на странице ровно одно.
   3. Скруглений-пузырей нет. Углы почти прямые (2 px), рамки волосяные,
      выделение делается тоном и линией, а не тенью. */

/* ——— афиша ———————————————————————————————————————————————————————————
   Разворачивается во всю ширину окна изнутри поля: шаблон один на все темы,
   и полоса здесь — дело оформления, а не разметки. Силуэт Байкала — с
   вывески федерации; он уходит за правый край, потому что это подпись места,
   а не картинка, которую рассматривают. */
.afisha {
  position: relative;
  width: 100vw;
  left: 50%;
  margin-left: -50vw;
  margin-top: 6px;
  background:
    url(/assets/baikal.png) no-repeat right 7vw top -24px / auto 132%,
    linear-gradient(105deg, #16224a 0%, var(--sin-glubokiy) 45%, #243a72 100%);
  color: var(--na-sinem);
  overflow: hidden;
}
.afisha .nutro { max-width: 940px; margin: 0 auto; padding: 52px 24px 44px; }

/* Что это вообще: название турнира о шахматах не говорит, а на страницу
   приходят по ссылке из чата, не видя остального сайта. */
.afisha .chto-eto {
  font-family: var(--grotesk); font-size: 14px; color: var(--baikal);
  margin-bottom: 10px;
}
.afisha .kogda { font-size: 19px; color: #cdd8ee; margin-bottom: 14px; }
.afisha h1 {
  margin: 0; color: var(--na-sinem);
  font-size: clamp(26px, 3.6vw, 38px); line-height: 1.16; max-width: 20ch;
}
.zagolovok-afishi { display: flex; align-items: center; gap: 22px; }
/* Логотип турнира — квадратом на кремовой подложке: на синем поле без неё
   тонут и тёмные логотипы, и прозрачные. */
.logotip-turnira {
  width: 104px; height: 104px; flex: none; object-fit: contain;
  background: var(--pole); padding: 10px; border-radius: 2px;
}
.afisha .komu { margin: 18px 0 0; font-size: 17.5px; max-width: 54ch; color: #dbe3f4; }
.afisha .zakryto { margin: 22px 0 0; font-size: 17px; color: #f0d9a8; }
.afisha .mest-net { margin: 14px 0 0; font-size: 16px; color: #f0d9a8; font-weight: 400; }

.deystviya { margin: 30px 0 0; display: flex; gap: 14px; align-items: center; flex-wrap: wrap; }

/* Кнопка на синем — кремовая: это выворотка вывески, и другого способа
   сделать действие главным на тёмной полосе нет. */
.afisha .deystvie {
  background: var(--pole); color: var(--sin-glubokiy); border: 1px solid var(--pole);
}
.afisha .deystvie:hover { background: #fff; border-color: #fff; }
.afisha .deystvie.tikhaya {
  background: transparent; color: var(--na-sinem); border-color: rgba(247, 238, 220, .5);
}
.afisha .deystvie.tikhaya:hover { background: rgba(247, 238, 220, .12); color: var(--na-sinem); }
.afisha .deystvie:focus-visible { outline: 2px solid var(--baikal); outline-offset: 3px; }

/* Шахматный ритм по низу афиши: кремовые и синие клетки — та же пара, что на
   вывеске. Полоска тонкая: это подпись, а не доска. */
.afisha .lenta {
  height: 8px;
  background: repeating-linear-gradient(90deg, var(--pole) 0 14px, transparent 14px 28px);
  opacity: .85;
}

/* ——— кнопки ——————————————————————————————————————————————————————— */

.deystvie {
  display: inline-block; padding: 13px 30px; border: 1px solid var(--sin); border-radius: 2px;
  background: var(--sin); color: #fff; text-decoration: none;
  font-family: var(--grotesk); font-weight: 700; font-size: 16px; line-height: 1.25; cursor: pointer;
}
.deystvie:hover { background: var(--sin-svetlyy); border-color: var(--sin-svetlyy); }
.deystvie:focus-visible { outline: 2px solid var(--sin-svetlyy); outline-offset: 3px; }
.deystvie:disabled { background: var(--tihiy); border-color: var(--tihiy); cursor: default; }
/* Вторая кнопка — контуром: главное действие на странице одно. */
.deystvie.tikhaya { background: transparent; color: var(--sin); border-color: var(--baikal); }
.deystvie.tikhaya:hover { background: rgba(32, 50, 101, .07); color: var(--sin); }
.deystvie.malaya { padding: 9px 18px; font-size: 15px; }

/* ——— разделы ————————————————————————————————————————————————————————
   Не карточки, а полосы чтения: заголовок, волосяная черта, строки. Разделяет
   их воздух и линия, а не рамка с тенью. */
main { padding: 0 0 10px; }
.razdel { margin-top: 38px; }
.razdel + .razdel { border-top: 1px solid #e9dcc2; padding-top: 34px; }
.razdel h2 { margin: 0 0 16px; font-size: 21px; }
.razdel .pusto { margin: 0; color: var(--tihiy); }

.shapka-sostava {
  display: flex; align-items: center; justify-content: space-between;
  gap: 16px; flex-wrap: wrap; margin-bottom: 14px;
}
.shapka-sostava h2 { margin: 0; }
.shapka-sostava .schyot { display: flex; flex-direction: column; gap: 4px; }
.schyot-mest { margin: 0; color: var(--tihiy); font-size: 15.5px; }
/* «Мест нет» — не беда: запись идёт в очередь, и строка это объясняет. */
.mest-net { margin: 6px 0 0; color: var(--ohra); font-size: 15.5px; }

/* Строки «что — сколько». Подпись слева узкой колонкой, значение рядом:
   в разделе их до десятка, и глазу нужен один общий левый край. */
.stroki > div {
  display: flex; gap: 22px; padding: 9px 0; border-bottom: 1px solid #efe4cd; align-items: baseline;
}
.stroki > div:last-child { border-bottom: 0; }
.stroki .chto {
  font-family: var(--grotesk); font-size: 14px; color: var(--tihiy);
  flex: 0 0 200px; max-width: 200px;
}
.stroki .skolko { flex: 1 1 auto; min-width: 0; }

.opisanie { max-width: 72ch; }
.opisanie img { max-width: 100%; }
.opisanie p { margin: 0 0 12px; }

/* Положение целиком — несколько экранов, и под ним теряется всё, что дальше.
   Показываем начало, остальное по нажатию: переключателем, а не скриптом, —
   текст на странице есть целиком с первой отрисовки. */
.opisanie-svorot { position: relative; }
.opisanie-svorot .pereklyuchatel {
  position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none;
}
.opisanie-svorot .opisanie { position: relative; max-height: 250px; overflow: hidden; }
.opisanie-svorot .opisanie::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 90px;
  background: linear-gradient(rgba(250, 241, 224, 0), var(--pole) 85%); pointer-events: none;
}
.opisanie-svorot .razvernut {
  display: inline-block; margin-top: 14px; cursor: pointer;
  color: var(--sin); border-bottom: 1px dashed currentColor;
}
.opisanie-svorot .razvernut::before { content: "Читать полностью"; }
.opisanie-svorot .pereklyuchatel:checked ~ .opisanie { max-height: none; }
.opisanie-svorot .pereklyuchatel:checked ~ .opisanie::after { content: none; }
.opisanie-svorot .pereklyuchatel:checked ~ .razvernut::before { content: "Свернуть"; }
.opisanie-svorot .pereklyuchatel:focus-visible ~ .razvernut {
  outline: 2px solid var(--sin-svetlyy); outline-offset: 3px;
}

/* Спойлер с условиями: приложение к блоку, а не его продолжение — содержимое
   уходит вбок за черту и набрано тише. */
.podrobnosti-turnira { margin: 14px 0; border-top: 1px solid #efe4cd; padding-top: 2px; }
.podrobnosti-turnira:last-child { margin-bottom: 0; }
.podrobnosti-turnira > summary {
  cursor: pointer; padding: 10px 0; color: var(--tihiy); font-family: var(--grotesk);
  font-size: 15px; list-style: none; display: flex; align-items: center; gap: 10px;
}
.podrobnosti-turnira > summary:hover { color: var(--sin); }
.podrobnosti-turnira > summary::-webkit-details-marker { display: none; }
.podrobnosti-turnira > summary::before {
  content: ""; width: 6px; height: 6px; flex: none; margin-left: 2px;
  border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor;
  transform: rotate(-45deg);
}
.podrobnosti-turnira[open] > summary::before { transform: rotate(45deg); }
.podrobnosti-turnira .stroki {
  margin: 0 0 10px 3px; padding-left: 18px; border-left: 2px solid var(--baikal);
}
.podrobnosti-turnira .stroki > div { padding: 7px 0; font-size: 15.5px; border-bottom: 0; }
.podrobnosti-turnira .stroki > div + div { border-top: 1px solid #f2e9d8; }

/* ——— вести ————————————————————————————————————————————————————————— */

.vest { padding: 14px 18px; margin: 22px 0 0; border-left: 3px solid; background: var(--pole-tyomnoe); }
.vest.horosho { border-color: var(--zelyonyy); color: #1d5330; }
.vest.ploho { border-color: var(--krasnyy); color: var(--krasnyy); }
/* Резерв — не отказ: спокойный синий, а не цвет ошибки. */
.vest.rezerv { border-color: var(--sin); color: var(--sin); }

/* ——— состав ——————————————————————————————————————————————————————
   Таблица на том же кремовом поле: белая подложка под ней сделала бы из
   страницы бланк. Разделяют строки волосяные линии, а не заливка. */
.podzagolovok { font-size: 16px; font-weight: 700; color: var(--tekst); margin: 26px 0 8px; }
.tablitsa { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.tablitsa table {
  border-collapse: collapse; width: 100%; font-size: 15.5px; white-space: nowrap;
  font-variant-numeric: lining-nums tabular-nums;
}
.tablitsa th {
  text-align: left; font-family: var(--grotesk); font-size: 13.5px; font-weight: 700;
  color: var(--tihiy); padding: 8px 14px 8px 0; border-bottom: 1px solid var(--baikal);
}
.tablitsa td { padding: 11px 14px 11px 0; border-bottom: 1px solid #efe4cd; vertical-align: middle; }
.tablitsa tr:last-child td { border-bottom: 0; }
.tablitsa.sostav th, .tablitsa.sostav td { text-align: center; padding-left: 10px; padding-right: 10px; }
.tablitsa.sostav th:first-child, .tablitsa.sostav td:first-child { padding-left: 0; }
.tablitsa.sostav th:last-child, .tablitsa.sostav td:last-child { padding-right: 0; }
.tablitsa td:nth-child(3) { white-space: normal; }
.tablitsa a { color: var(--sin); }

/* Взнос — отметкой: внесён зелёной галочкой, не внесён — сразу кнопка, по
   которой это исправляют. */
.vznos .est { color: var(--zelyonyy); font-weight: 700; font-size: 18px; }
.vznos .oplatit {
  border: 1px solid var(--ohra); background: transparent; color: var(--ohra);
  border-radius: 2px; padding: 6px 12px; font: inherit; font-family: var(--grotesk);
  font-size: 14px; cursor: pointer;
}
.vznos .oplatit:hover { background: rgba(138, 91, 16, .08); }
/* «Сняться с резерва» — не действие, а разговор: кнопка тише взноса. */
.vznos .snyatsya {
  border: 1px solid var(--baikal); background: transparent; color: var(--tihiy);
  border-radius: 2px; padding: 6px 12px; font: inherit; font-family: var(--grotesk);
  font-size: 14px; cursor: pointer;
}
.vznos .snyatsya:hover { border-color: var(--sin); color: var(--sin); }
.vznos .oplatit:focus-visible, .vznos .snyatsya:focus-visible {
  outline: 2px solid var(--sin-svetlyy); outline-offset: 2px;
}

/* Окно оплаты: QR для того, кто за компьютером, ссылка — для телефона. */
.nutro-oplaty { padding: 0 24px 4px; text-align: center; }
.nutro-oplaty img { width: 260px; height: 260px; margin: 6px auto 14px; display: block; }
.nutro-oplaty .deystvie { display: inline-block; }
.horosho-tekst { color: var(--zelyonyy); }
.ploho-tekst { color: var(--krasnyy); }

/* ——— форма записи ————————————————————————————————————————————————
   Единственное место, где белое оправдано: в поле ввода пишут, и оно должно
   читаться как место для письма. */
.zapis { margin-top: 30px; max-width: 720px; }
.nazad-sverhu { margin: 0 0 12px; font-size: 15px; }
.zapis h1 { margin: 0 0 6px; font-size: 27px; }
.zapis .nad { margin: 0 0 24px; color: var(--tihiy); }
.zapis label { display: block; margin: 18px 0 7px; font-family: var(--grotesk); font-size: 15px; }
.zapis .nuzhno::after { content: " *"; color: var(--krasnyy); }
.zapis input[type=text], .zapis input[type=tel], .zapis input[type=date] {
  width: 100%; padding: 13px 14px; border: 1px solid var(--baikal); border-radius: 2px;
  font: inherit; background: #fff; color: var(--tekst);
}
.zapis input:focus { outline: 2px solid var(--sin-svetlyy); border-color: var(--sin-svetlyy); }
.zapis input:disabled { background: #f4efe3; color: var(--tihiy); }
.zapis .podskazka { font-size: 15px; color: var(--tihiy); margin-top: 7px; }
/* Документы — своей врезкой: подсказка объясняет оба поля разом. */
.blok-dokumentov {
  margin-top: 22px; padding: 4px 0 4px 20px; border-left: 2px solid var(--baikal);
}
.blok-dokumentov .podskazka { margin: 0 0 4px; }
.blok-dokumentov label:first-of-type { margin-top: 10px; }

.zapis .para { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; align-items: start; }
.zapis .para > div > label:first-child { margin-top: 18px; }
.zapis .pol { display: flex; gap: 12px; margin-top: 7px; align-items: stretch; }
.zapis .pol label {
  flex: 1; margin: 0; padding: 13px; min-height: 52px; border: 1px solid var(--baikal);
  border-radius: 2px; cursor: pointer; display: flex; align-items: center;
  justify-content: center; gap: 10px; font-family: var(--antikva); font-size: 17px;
}
.zapis .pol label:has(input:checked) { border-color: var(--sin); box-shadow: inset 0 0 0 1px var(--sin); }
.zapis .pol input { margin: 0; width: auto; }
.zapis .pol .figurka { width: 22px; height: 26px; flex: none; display: block; align-self: center; }
.zapis .pol .muzh { color: var(--sin); }
.zapis .pol .zhen { color: var(--krasnyy); }
.zapis .galka { display: flex; align-items: center; gap: 9px; margin: 0; }
.zapis .galka input { width: auto; }
/* Галочка про день турнира — своей строкой перед кнопкой: её читают, а не
   проскакивают вместе с полями. */
.zapis .galka.den-turnira { align-items: flex-start; margin: 20px 0 0; font-size: 15.5px; line-height: 1.4; cursor: pointer; }
.zapis .galka.den-turnira input { margin: 3px 0 0; }
.stroka-fshr { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; margin: 18px 0 7px; }
.stroka-fshr label { margin: 0; }

/* Выбор тренера: список и кнопка в строку, выбранные — метками под ними. */
.trener-stroka { display: flex; gap: 12px; align-items: stretch; margin-top: 7px; flex-wrap: wrap; }
.trener-stroka select {
  flex: 1 1 260px; padding: 13px 14px; border: 1px solid var(--baikal); border-radius: 2px;
  font: inherit; background: #fff; color: var(--tekst);
}
.dobavit-trenera {
  border: 1px solid var(--sin); background: transparent; color: var(--sin);
  border-radius: 2px; padding: 12px 20px; font: inherit; font-family: var(--grotesk); cursor: pointer;
}
.dobavit-trenera:hover { background: rgba(32, 50, 101, .07); }
#drugoy-trener { margin-top: 10px; }
.vybrannye-trenery { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 12px; }
.vybrannye-trenery:empty { margin-top: 0; }
.vybrannye-trenery .trener {
  display: inline-flex; align-items: center; gap: 8px; background: var(--pole-tyomnoe);
  color: var(--sin); border: 1px solid var(--baikal); border-radius: 2px; padding: 7px 8px 7px 13px;
}
.vybrannye-trenery .ubrat {
  border: 0; background: none; color: var(--sin); width: 22px; height: 22px;
  line-height: 1; font-size: 17px; cursor: pointer;
}
.vybrannye-trenery .ubrat:hover { color: var(--krasnyy); }

.zapis .svorot { margin-top: 24px; border-top: 1px solid #efe4cd; padding-top: 6px; }
.zapis .svorot summary { cursor: pointer; padding: 10px 0; color: var(--sin); font-family: var(--grotesk); font-size: 15px; }
.zapis .knopki { margin-top: 28px; display: flex; align-items: center; gap: 20px; flex-wrap: wrap; }
.zapis .nazad { color: var(--tihiy); }

/* Поле файла подписано браузером по-английски и не поддаётся стилю, поэтому
   оно спрятано, а нажимают на свою подпись рядом. */
.kabinet .fayl, .zapis .fayl { margin-top: 7px; display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.kabinet .fayl input[type=file], .zapis .fayl input[type=file] { position: absolute; width: 1px; height: 1px; opacity: 0; }
.kabinet .knopka-fayla, .zapis .knopka-fayla {
  display: inline-block; margin: 0; padding: 11px 18px; border: 1px solid var(--sin);
  border-radius: 2px; color: var(--sin); font-family: var(--grotesk); font-size: 15px; cursor: pointer;
}
.kabinet .knopka-fayla:hover, .zapis .knopka-fayla:hover { background: rgba(32, 50, 101, .07); }
.zapis .fayl input[type=file]:disabled + .knopka-fayla {
  border-color: var(--baikal); color: var(--tihiy); cursor: default; background: #f4efe3;
}
.zapis .fayl:has(input[type=file]:disabled) .imya-fayla { color: #a9a08c; }
.kabinet .fayl input[type=file]:focus-visible + .knopka-fayla,
.zapis .fayl input[type=file]:focus-visible + .knopka-fayla {
  outline: 2px solid var(--sin-svetlyy); outline-offset: 3px;
}
.kabinet .imya-fayla, .zapis .imya-fayla { color: var(--tihiy); font-size: 15px; word-break: break-all; }

/* ——— дверь ————————————————————————————————————————————————————————— */

.dver { max-width: 420px; margin-inline: auto; }
.dver input[type=password] {
  width: 100%; padding: 13px 14px; border: 1px solid var(--baikal); border-radius: 2px;
  font: inherit; background: #fff; color: var(--tekst);
}
.dver input[type=password]:focus { outline: 2px solid var(--sin-svetlyy); border-color: var(--sin-svetlyy); }
.dver .podskazka { margin-top: 22px; padding-top: 16px; border-top: 1px solid #efe4cd; }

/* ——— полоса вошедшего организатора ————————————————————————————————
   Про работу, а не про турнир: тихая, служебная, родителю не видна вовсе. */
.sluzhebnaya {
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  flex-wrap: wrap; margin-top: 20px; padding: 11px 16px;
  background: var(--pole-tyomnoe); border-left: 3px solid var(--sin);
  font-size: 15px; font-family: var(--grotesk);
}
.sluzhebnaya .kto { color: var(--tihiy); }
.sluzhebnaya .knopki-vedeniya { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.sluzhebnaya form { display: inline; }
.sluzhebnaya button {
  border: 0; background: none; padding: 0; font: inherit; color: var(--krasnyy);
  cursor: pointer; text-decoration: underline; text-underline-offset: 3px;
}
.sluzhebnaya a { color: var(--sin); }

/* ——— кабинет организатора ————————————————————————————————————————
   Рабочее место на том же сайте: те же цвета и та же шапка, только содержимое
   служебное. Поле шире сайта — в составе девять колонок. */
body:has(.kabinet) main.obyom { max-width: 1280px; }
.kabinet { padding: 26px 0 10px; }
.kabinet .sluzhebnaya { margin: 0 0 22px; }

.shapka-raboty { display: flex; align-items: baseline; justify-content: space-between; gap: 18px; flex-wrap: wrap; }
.shapka-raboty h1 { margin: 0; font-size: 28px; }
.kto-vy { color: var(--tihiy); font-size: 15px; }

.polka { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin: 22px 0 18px; }
.otbor { display: flex; align-items: center; gap: 10px; }
.kabinet .otbor label { color: var(--tihiy); margin: 0; display: flex; align-items: center; line-height: 1; }
.otbor select {
  padding: 10px 12px; border: 1px solid var(--baikal); border-radius: 2px;
  font: inherit; background: #fff; color: var(--tekst);
}

/* Турниры списком: слева синяя черта вместо карточки — список читается
   сверху вниз, а плитки заставляли бы скакать глазами. */
.turniry { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
.turniry li {
  background: var(--pole-tyomnoe); border-left: 3px solid var(--baikal);
  padding: 16px 20px;
}
.turniry li:hover { border-left-color: var(--sin); }
.turniry .nazvanie { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.turniry .nazvanie a { font-size: 19px; font-weight: 700; color: var(--sin); border: 0; }
.turniry .nazvanie a:hover { border-bottom: 1px solid var(--sin); }
.turniry .podrobnosti { margin-top: 6px; color: var(--tihiy); font-size: 15px; }
.turniry .lyudi { margin-top: 12px; display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; font-size: 15px; }
.turniry .lyudi .skolko { font-weight: 700; font-size: 17px; }
.turniry .lyudi .vznos { color: var(--zelyonyy); }
.turniry .lyudi .chto { color: var(--tihiy); margin-right: 10px; }
.turniry .na-sayte { display: inline-block; margin-top: 10px; font-size: 15px; }

/* Состояние турнира — словом и тоном: «идёт» и «завершён» перепутать нельзя. */
.sostoyanie {
  font-family: var(--grotesk); font-size: 13px; padding: 3px 9px; border-radius: 2px;
  background: #e9dcc2; color: var(--tihiy);
}
.sostoyanie-pre_registration { background: #dceadf; color: #1d5330; }
.sostoyanie-goes { background: #f3e3c0; color: #7a5410; }
.sostoyanie-canceled { background: #f0dcdc; color: var(--krasnyy); }

.listanie { margin-top: 20px; display: flex; gap: 20px; }
.pusto { color: var(--tihiy); }

.nazad-k { margin: 0 0 14px; font-size: 15px; }
.rabota .list, .kabinet .list {
  background: var(--pole-tyomnoe); padding: 20px 24px; margin-bottom: 14px;
}
.kabinet h2 { margin: 0 0 6px; font-size: 20px; }
.kabinet label { display: block; margin: 16px 0 6px; font-family: var(--grotesk); font-size: 15px; }
.kabinet label.nuzhno::after { content: " *"; color: var(--krasnyy); }
.kabinet input[type=text], .kabinet input[type=date], .kabinet input[type=datetime-local],
.kabinet select, .kabinet textarea {
  width: 100%; padding: 12px 13px; border: 1px solid var(--baikal); border-radius: 2px;
  font: inherit; background: #fff; color: var(--tekst);
}
.kabinet textarea { resize: vertical; line-height: 1.5; }
.kabinet input:focus, .kabinet select:focus, .kabinet textarea:focus {
  outline: 2px solid var(--sin-svetlyy); border-color: var(--sin-svetlyy);
}
.kabinet input[type=password] {
  width: 100%; padding: 12px 13px; border: 1px solid var(--baikal); border-radius: 2px;
  font: inherit; background: #fff; color: var(--tekst);
}
.kabinet input[type=password]:focus { outline: 2px solid var(--sin-svetlyy); border-color: var(--sin-svetlyy); }
.kabinet .schyot-neoplativshih { margin: -8px 0 14px; color: var(--tihiy); font-size: 15px; }
.kabinet .metka-rezerv {
  display: inline-block; margin-left: 8px; padding: 2px 8px; border-radius: 2px;
  background: #e2e8f4; color: var(--sin); font-size: 13px; white-space: nowrap;
}
.kabinet .obnovit-reytingi { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin: 0 0 14px; }
.kabinet .obnovit-reytingi .dim { color: var(--tihiy); font-size: 14px; }
.kabinet .para { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.kabinet .kontrol-para { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 12px; }
.kabinet .kontrol-para label { margin-top: 0; }
.kabinet .podskazka { font-size: 14.5px; color: var(--tihiy); margin-top: 6px; }
.kabinet .galka { display: flex; align-items: center; gap: 9px; }
.kabinet .galka input { width: auto; }
.kabinet .svorot { margin-top: 18px; border-top: 1px solid #e9dcc2; padding-top: 6px; }
.kabinet .svorot summary { cursor: pointer; padding: 10px 0; color: var(--sin); font-family: var(--grotesk); font-size: 15px; }
.kabinet .svorot-blok > summary { cursor: pointer; list-style: none; display: flex; align-items: center; gap: 10px; }
.kabinet .svorot-blok > summary::-webkit-details-marker { display: none; }
.kabinet .svorot-blok > summary::before {
  content: ""; width: 7px; height: 7px; flex: none;
  border-right: 1.5px solid var(--sin); border-bottom: 1.5px solid var(--sin); transform: rotate(-45deg);
}
.kabinet .svorot-blok[open] > summary::before { transform: rotate(45deg); }
.kabinet .svorot-blok > summary h2 { margin: 0; }
.kabinet .knopki { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; margin-top: 20px; }
/* Сохранение слева, удаление — у правого края: рядом по ним промахиваются. */
.kabinet .knopki-sverhu { margin: 18px 0 20px; justify-content: space-between; }
.kabinet .knopki-sverhu .deystvie.tikhaya { margin-right: auto; }
.kabinet .na-sayte { font-size: 15px; }
.kabinet a:not(.deystvie), .zapis a:not(.deystvie), .tablitsa a { color: var(--sin); }
.kabinet .opasno { color: var(--krasnyy); }
.kabinet .tablitsa td.imya { white-space: normal; }
.kabinet .tablitsa .telefon { display: block; color: var(--tihiy); font-size: 14px; }
.kabinet .tablitsa .kogda-vznos { color: var(--tihiy); font-size: 14px; }
.kabinet .tablitsa input[type=checkbox] { width: auto; }
.kabinet .zapisat form { margin-top: 4px; }
.kabinet .uzkiy { max-width: 460px; margin-inline: auto; }

.polka-sostava { display: flex; gap: 12px; flex-wrap: wrap; margin: 14px 0 6px; }
.skopom-knopki { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin: 18px 0 6px; color: var(--tihiy); font-size: 15px; }
.skopom-knopki button, .deystviya button {
  border: 1px solid var(--baikal); background: transparent; color: var(--sin);
  border-radius: 2px; padding: 7px 12px; font: inherit; font-family: var(--grotesk); font-size: 14px; cursor: pointer;
}
.skopom-knopki button:hover, .deystviya button:hover { border-color: var(--sin); }
.skopom-knopki .opasno, .deystviya .opasno { color: var(--krasnyy); }
.skopom-knopki .opasno:hover, .deystviya .opasno:hover { border-color: var(--krasnyy); }
.deystviya .knopka-ssylka {
  border: 1px solid var(--baikal); border-radius: 2px; padding: 7px 12px;
  font-family: var(--grotesk); font-size: 14px; color: var(--sin); white-space: nowrap;
}
.deystviya .knopka-ssylka:hover { border-color: var(--sin); }
.skopirovat {
  border: 1px solid var(--baikal); background: transparent; color: var(--sin);
  border-radius: 2px; padding: 4px 10px; margin-left: 8px; font: inherit;
  font-family: var(--grotesk); font-size: 14px; cursor: pointer;
}
.skopirovat:hover { border-color: var(--sin); }
.udalenie { margin: 4px 0 0; }
/* Удаление — кнопка, но тихая: по ссылке в строке промахиваются, а кричать о
   редком действии незачем. */
.tihoe-udalenie {
  border: 1px solid #ddd2ba; background: var(--pole-tyomnoe); color: var(--tihiy);
  border-radius: 2px; padding: 13px 24px; font: inherit; font-family: var(--grotesk); cursor: pointer;
}
.tihoe-udalenie:hover { color: var(--krasnyy); border-color: var(--krasnyy); }

/* Файлы турнира в кабинете: рядом с кнопкой — что происходит, ниже — что вышло. */
.fayl-turnira .sostoyanie { color: var(--tihiy); font-size: 15px; background: none; padding: 0; }
.fayl-turnira .prosmotr { display: flex; align-items: center; gap: 12px; margin-top: 10px; }
.fayl-turnira .prosmotr:empty { margin-top: 0; }
.fayl-turnira .prosmotr img {
  width: 72px; height: 72px; object-fit: contain; background: #fff;
  border: 1px solid var(--baikal); padding: 4px;
}
.fayl-turnira .ubrat-fayl {
  border: 1px solid var(--krasnyy); background: transparent; color: var(--krasnyy);
  border-radius: 2px; padding: 6px 12px; font: inherit; font-family: var(--grotesk); font-size: 14px; cursor: pointer;
}
.fayl-turnira .ubrat-fayl:hover { background: rgba(158, 27, 47, .07); }

/* Разметка описания турнира: вкладки, панель кнопок и предпросмотр. */
.kabinet .razmetka { border: 1px solid var(--baikal); border-radius: 2px; overflow: hidden; background: #fff; }
.kabinet .vkladki-razmetki { display: flex; gap: 2px; background: var(--pole-tyomnoe); border-bottom: 1px solid var(--baikal); }
.kabinet .vkladka {
  border: 0; background: transparent; cursor: pointer; font: inherit; font-family: var(--grotesk);
  font-size: 15px; padding: 10px 16px; color: var(--tihiy);
}
.kabinet .vkladka.vybrana { background: #fff; color: var(--sin); font-weight: 700; }
.kabinet .panel-razmetki { display: flex; flex-wrap: wrap; gap: 6px; padding: 8px 10px; border-bottom: 1px solid #efe4cd; }
.kabinet .panel-razmetki button {
  border: 1px solid var(--baikal); background: #fff; border-radius: 2px; cursor: pointer;
  font: inherit; font-family: var(--grotesk); font-size: 14px; line-height: 1; padding: 7px 10px; color: var(--tekst);
}
.kabinet .panel-razmetki button:hover { background: var(--pole); }
.kabinet .razmetka textarea { border: 0; border-radius: 0; width: 100%; display: block; }
.kabinet .razmetka textarea:focus { outline: 0; }
.kabinet .predprosmotr { padding: 16px 18px; min-height: 260px; }
.kabinet .predprosmotr .pusto { margin: 0; }

/* ——— окно вопроса ————————————————————————————————————————————————
   Единственный белый лист на сайте, и он уместен: окно должно быть явно
   поверх страницы, а не её частью. */
.okno-voprosa {
  position: fixed; inset: 0; z-index: 50; display: flex; align-items: center; justify-content: center;
  padding: 20px; background: rgba(26, 39, 80, .5);
}
.okno-voprosa[hidden] { display: none; }
.okno-voprosa .listok { background: #fff; max-width: 520px; width: 100%; overflow: hidden; border-radius: 2px; }
.okno-voprosa h3 {
  margin: 0; padding: 18px 24px; border-bottom: 1px solid #e9dcc2;
  font-size: 18px; line-height: 1.35; color: var(--sin);
}
.okno-voprosa p { margin: 0; padding: 20px 24px; color: var(--tekst); }
.okno-voprosa p[hidden] { display: none; }
.okno-voprosa .knopki {
  margin: 0; padding: 14px 24px; border-top: 1px solid #e9dcc2;
  display: flex; justify-content: flex-end; align-items: center; gap: 12px; flex-wrap: wrap;
}
.okno-voprosa .knopki button {
  border: 1px solid transparent; border-radius: 2px; padding: 11px 20px; font: inherit;
  font-family: var(--grotesk); font-weight: 700; color: #fff; cursor: pointer;
}
.okno-voprosa .da { background: var(--zelyonyy); border-color: var(--zelyonyy); }
.okno-voprosa .da:hover { background: #26582f; }
.okno-voprosa .da.vtoraya { background: #fff; color: var(--zelyonyy); border-color: var(--zelyonyy); }
.okno-voprosa .da.vtoraya:hover { background: #eef5ef; }
.okno-voprosa .net { background: var(--sin-glubokiy); border-color: var(--sin-glubokiy); }
.okno-voprosa .net:hover { background: #121c3a; }
.okno-voprosa .ssylka-v-okne { margin: 6px 0 0; }
.okno-voprosa .ssylka-v-okne a { color: var(--tihiy); font-size: 14px; }
#vopros-poyasnenie { margin: 8px 0 0; }
#vopros-poyasnenie p { margin: 0 0 8px; font-size: 15px; line-height: 1.45; padding: 0; }
#vopros-poyasnenie p:last-child { margin-bottom: 0; }

/* ——— узкие экраны ———————————————————————————————————————————————— */

@media (max-width: 760px) {
  .afisha { background-size: auto 115%, auto; background-position: right -30px top -10px, 0 0; }
  .afisha .nutro { padding: 32px 22px 30px; }
  .deystvie { display: block; text-align: center; }
  .deystviya { flex-direction: column; align-items: stretch; }
  .stroki > div { flex-direction: column; gap: 2px; }
  .stroki .chto { flex: none; max-width: none; }
  .afisha .lenta { height: 7px; background: repeating-linear-gradient(90deg, var(--pole) 0 10px, transparent 10px 20px); }
}

@media (max-width: 620px) {
  .zapis .para { grid-template-columns: 1fr; gap: 0; }
  .kabinet .para { grid-template-columns: 1fr; }
  .polka { flex-direction: column; align-items: stretch; }
  .polka .deystvie { width: 100%; }
  .otbor select { flex: 1; }
  .zagolovok-afishi { flex-direction: column; align-items: flex-start; gap: 14px; }
  .logotip-turnira { width: 88px; height: 88px; }
}

/* Ниже этой ширины состав в кабинете не помещается никак — карточками. */
@media (max-width: 1000px) {
  .kabinet .tablitsa table.sostav,
  .kabinet .tablitsa table.sostav tbody,
  .kabinet .tablitsa table.sostav tr,
  .kabinet .tablitsa table.sostav td { display: block; width: 100%; }
  .kabinet .tablitsa table.sostav thead { display: none; }
  .kabinet .tablitsa table.sostav tr {
    border-left: 3px solid var(--baikal); background: var(--pole-tyomnoe);
    padding: 12px 14px; margin-bottom: 10px;
  }
  .kabinet .tablitsa table.sostav td {
    border: 0; padding: 4px 0; white-space: normal;
    display: flex; justify-content: space-between; gap: 14px; text-align: left;
  }
  .kabinet .tablitsa table.sostav td::before { content: attr(data-chto); color: var(--tihiy); font-size: 14px; }
  .kabinet .tablitsa table.sostav td.imya { font-size: 17px; }
  .kabinet .tablitsa table.sostav td.deystviya { display: flex; flex-wrap: wrap; padding-top: 10px; }
  .kabinet .tablitsa table.sostav td.deystviya::before { content: none; }
  .kabinet .tablitsa .telefon { display: inline; }
  .skopom-knopki { align-items: stretch; flex-direction: column; }
  .skopom-knopki .opasno { margin-top: 6px; }
}