/* Турниры (docs/TOURNAMENTS.md): раздел /app/tournaments/{game} и окно турнира в колоде. */
.tn{display:grid;gap:14px}
.tn-card{display:grid;gap:12px;padding:16px;border:1px solid var(--border-hairline);border-radius:var(--radius-md);background:var(--ink-800)}
.tn-card h2,.tn-card h3,.tn-card p{margin:0}
.tn-head{display:flex;flex-wrap:wrap;gap:8px 12px;align-items:center;justify-content:space-between}
.tn-row{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.tn-next{display:flex;flex-wrap:wrap;gap:8px;align-items:center;font-size:13px;color:var(--text-muted)}
.tn-next a{text-decoration:none}
.tn-areas .tn-q{margin-left:4px;text-transform:none}
/* Метки шапки окна (режим, «тест»): на телефоне места нет — прячем. */
.tw-right form{display:contents}
@media (max-width:640px){.tw-tag{display:none}}
/* «Мои данные» записи в окне турнира: сила и роли из анкеты, что делать, если неактуально. */
.tn-mine{display:grid;gap:8px;padding:10px 12px;border:1px dashed var(--border-strong);border-radius:var(--radius-xs);font-size:13px}
.tn-mine__row{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.tn-mine__cap{flex-basis:100%;color:var(--text-muted)}
.tn-mine__role{display:inline-flex;align-items:center;gap:5px;padding:3px 9px 3px 5px;border:1px solid var(--border-hairline);border-radius:var(--radius-pill);color:var(--text-body)}
.tn-mine__role img{width:20px;height:20px}
.tn-mine__role.is-first{border-color:var(--accent);color:var(--text-heading)}
.tn-mine p{margin:0;color:var(--text-muted)}
.tn-mine a{color:var(--accent)}
/* Прошедшие турниры типа — сворачиваемым списком под текущим. */
.tn-past summary{cursor:pointer;color:var(--text-heading);font-weight:600}
.tn-past__list{display:grid;gap:6px}
.tn-past__row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px 12px;padding:8px 10px;border:1px solid var(--border-hairline);border-radius:var(--radius-xs);text-decoration:none;font-size:13px}
.tn-past__row b{color:var(--text-heading);font-size:14px}
.tn-past__row:hover,.tn-past__row.is-on{border-color:var(--accent)}
/* этапы: текущий подсвечен, с отсчётом до конца */
.tn-steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
.tn-step{display:grid;gap:2px;padding:8px 10px;border:1px solid var(--border-hairline);border-radius:var(--radius-sm);background:rgba(255,255,255,.02);font-size:13px;color:var(--text-muted)}
.tn-step b{color:var(--text-heading);font-size:13px}
.tn-step.is-now{border-color:var(--border-strong);background:rgba(255,255,255,.06)}
.tn-step.is-done{opacity:.5}
.tn-count{font-variant-numeric:tabular-nums;font-weight:700;color:var(--accent)}
/* участие */
.tn-av{width:28px;height:28px;border-radius:var(--av-r);object-fit:cover;background:linear-gradient(135deg,#3b4a6b,#1d2638);display:grid;place-items:center;font-size:11px;color:#9fb0d0}
/* сетка */
/* Сетка во весь экран — модальное окно поверх затемнения; внутри сетку двигают зажатой левой кнопкой (или пальцем). */
.tn-overlay{position:fixed;inset:0;z-index:200;display:grid;place-items:center;padding:24px;background:rgba(4,6,12,.72)}
/* Окно — по размеру сетки, но не больше экрана: маленькая сетка не растягивается. */
.tn-overlay__box{display:flex;flex-direction:column;max-width:100%;max-height:100%;border:1px solid var(--border-strong);border-radius:var(--radius-md);background:var(--ink-800);box-shadow:0 24px 60px rgba(0,0,0,.6);overflow:hidden}
.tn-overlay__head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px;border-bottom:1px solid var(--border-hairline)}
.tn-overlay__head b{color:var(--text-heading);font-size:16px}
.tn-overlay__head small{color:var(--text-muted);font-size:12px;margin-left:8px;font-weight:400}
.tn-overlay__body{flex:1 1 auto;min-height:0;overflow:auto;padding:20px;overscroll-behavior:contain}
/* Двигать рукой — только когда сетка не помещается в окно. */
.tn-overlay__body.can-pan{cursor:grab;user-select:none}
.tn-overlay__body.can-pan.is-drag{cursor:grabbing}
.tn-overlay__body .tn-br{overflow:visible;width:max-content}
.tn-overlay__head small[hidden]{display:none}
@media (max-width:640px){.tn-overlay{padding:8px}}
.tn-br{display:grid;column-gap:28px;overflow-x:auto;padding:4px 2px}
.tn-rt{padding-bottom:10px;font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:var(--text-muted);text-align:center}
.tn-cell{position:relative;display:flex;align-items:center;min-width:0}
.tn-cell.has-in::before{content:"";position:absolute;left:-14px;top:25%;bottom:25%;border-left:1px solid var(--border-strong)}
.tn-cell.has-in::after{content:"";position:absolute;left:-14px;top:50%;width:14px;border-top:1px solid var(--border-strong)}
.tn-cell.has-out .tn-m::after{content:"";position:absolute;right:-15px;top:50%;width:14px;border-top:1px solid var(--border-strong)}
.tn-m{position:relative;width:100%;border:1px solid var(--border-hairline);border-radius:8px;background:var(--ink-700);font-size:13px;line-height:1.2}
.tn-m>div{display:flex;justify-content:space-between;gap:8px;padding:5px 9px;white-space:nowrap}
.tn-m>div:nth-of-type(1){padding-top:10px}
.tn-m>div+div{border-top:1px solid var(--border-hairline)}
.tn-m small{color:var(--text-muted)}
.tn-m .win{color:var(--text-heading);font-weight:600}
.tn-m .lose{opacity:.45}
.tn-m .mine{box-shadow:inset 3px 0 0 var(--accent)}
.tn-m .tbd{color:var(--text-muted);font-style:italic}
.tn-m em{position:absolute;top:-9px;left:8px;font-style:normal;font-size:10px;line-height:1.3;padding:1px 6px;border-radius:99px;background:var(--ink-800);border:1px solid var(--border-hairline);color:var(--text-muted);white-space:nowrap}
.tn-m em.live{color:#ffd28a;border-color:#8a6a2a}
.tn-people{display:flex;flex-wrap:wrap;gap:6px}
.tn-teams{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:10px}
.tn-team{display:grid;gap:4px;padding:10px;border:1px solid var(--border-hairline);border-radius:var(--radius-sm);font-size:13px}
.tn-team.is-mine{border-color:var(--accent)}
/* Состав в карточке команды — строками по два-три: иконка роли и ник, без столбика во всю высоту. */
.tn-team__players{display:flex;flex-wrap:wrap;gap:4px 10px}
.tn-tp{display:inline-flex;align-items:center;gap:4px;min-width:0;max-width:100%;font-size:13px}
.tn-tp img{width:18px;height:18px;flex:none}
.tn-tp span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:110px}
.tn-tp.is-me span{color:var(--accent)}
.tn-team.is-out{opacity:.55}
.tn-admin{border-style:dashed}
.tn-admin form{display:flex;flex-wrap:wrap;gap:8px;align-items:end}
.tn-admin label{display:grid;gap:4px;font-size:12px;color:var(--text-muted)}
.tn-admin input[type=number]{width:90px}
@media (max-width:640px){.tn-steps{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Окно турнира в колоде (Pages/App/Tournaments/Window): шапка во всю ширину, слева — что делать сейчас, справа — чат. */
.tw{display:grid;grid-template-columns:400px minmax(0,1fr);grid-template-rows:auto minmax(0,1fr);height:100vh;height:100dvh;background:var(--ink-800)}
.tw-box{display:contents}
.tw-head{grid-column:1/-1;grid-row:1;display:grid;gap:8px;padding:10px 46px 10px 12px;border-bottom:1px solid var(--border-hairline);background:var(--ink-700)}
.tw-top{display:flex;align-items:center;gap:10px;min-width:0}
.tw-ico{flex:none;font-size:22px;line-height:1}
.tw-who{display:grid;min-width:0}
.tw-who b{color:var(--text-heading);font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tw-who small{color:var(--text-muted);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tw-right{margin-left:auto;display:flex;gap:8px;align-items:center;flex:none}
.tw-bracket-btn{display:inline-flex;align-items:center;gap:6px}
.tw-side{grid-column:1;grid-row:2;min-height:0;overflow-y:auto;overscroll-behavior:contain;border-right:1px solid var(--border-hairline)}
/* Слева — области (_TournamentAreas, Д68): справка, состав, разовые; на странице турнира — карточкой. */
.tw-side .tn-areas{padding:10px}
.tn-areas{padding:14px 16px;border:1px solid var(--border-hairline);border-radius:var(--radius-md);background:var(--ink-800)}
.tw-side .tn-areas{border:0;border-radius:0;background:none}
.tw-chat{grid-column:2;grid-row:2;display:flex;flex-direction:column;min-width:0;min-height:0}
.tw-log{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:12px;display:grid;grid-template-columns:minmax(0,1fr);align-content:start;gap:10px}
.tw-sys{padding:8px 10px;border:1px solid var(--border-hairline);border-left:3px solid var(--accent);border-radius:8px;background:var(--ink-700);color:var(--text-body);font-size:13px;line-height:1.4}
.tw-ro{margin:0;padding:10px 12px;border-top:1px solid var(--border-hairline);color:var(--text-muted);font-size:13px}
.tw-form{display:flex;gap:8px;align-items:center;padding:10px 12px;border-top:1px solid var(--border-hairline)}
.tw-form[hidden]{display:none}
.tw-form input{flex:1 1 auto;min-width:0;padding:9px 12px;border-radius:var(--radius-xs);border:1px solid var(--border-strong);background:var(--ink-700);color:var(--text-heading);font:inherit;font-size:14px}
.tw-panes{display:none}
.tw-panes .seg__dot{display:inline-block;margin-left:4px}
/* Телефон: один тройной переключатель «Инфо | Турнир | Команда» (свайпом — между ними, window-kit.js); переключатель чатов в шапке
   не нужен. Чату — весь экран, а не остаток под колонкой. */
@media (max-width:640px){
  .tw{grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto minmax(0,1fr)}
  .tw-panes{display:flex;grid-column:1;grid-row:2;padding:6px 12px;border-bottom:1px solid var(--border-hairline)}
  .tw-side{grid-column:1;grid-row:3;border-right:0}
  .tw-chat{grid-column:1;grid-row:3}
  .tw[data-pane=chat] .tw-side,.tw[data-pane=side] .tw-chat{display:none}
  .tw-bracket-btn{padding-left:8px;padding-right:8px;font-size:0;gap:0}
  .tw-panes .seg{display:flex;width:100%}
  .tw-panes .seg__btn{flex:1;justify-content:center}
}
/* Цифры турнира в шапке окна — этап, сколько команд и матчей: не бегать в сетку. */
.tw-who small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* Состав команды — сворачиваемым разделом под событиями: в заголовке роли и аватары, раскрыт — полный список. */
/* Только в окне турнира (в разделе такой кнопки нет). */

/* Голос команды в окне турнира: общая полоса звонка (call-bar.js) над чатом вкладки «Команда»; в звонке — и в «Турнире».
   Вне перерисовываемой части окна: перерисовка звонок не рвёт. */
.tw-call{flex:none}
.tw-call[hidden]{display:none}
/* Правка турнира админом: поля в ряд, описание — на всю ширину. */
.tn-edit{align-items:flex-end}
.tn-admin form label input:not([type=checkbox]),.tn-admin form label select{padding:7px 10px;border:1px solid var(--border-strong);border-radius:var(--radius-xs);background:var(--ink-700);color:var(--text-heading);font:inherit;font-size:14px;color-scheme:dark}
.tn-admin form label textarea{width:100%;box-sizing:border-box;padding:8px 10px;border:1px solid var(--border-strong);border-radius:var(--radius-xs);background:var(--ink-700);color:var(--text-heading);font:inherit;font-size:14px}

/* Управление турнирами (Manage): список карточек, прошедшие приглушены; окно с карточкой — рамка поверх списка. */
.tn-list{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.tn-li{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:12px;width:100%;padding:10px 14px;border:1px solid var(--border-hairline);border-radius:var(--radius-sm);background:none;color:var(--text-body);font:inherit}
.tn-li:hover{border-color:var(--border-strong);background:rgba(255,255,255,.03)}
.tn-li.is-past{opacity:.55}
.tn-li.is-past:hover{opacity:.85}
.tn-li__ico{display:inline-grid;place-items:center;width:38px;height:38px;border-radius:10px;background:rgba(255,255,255,.06);color:var(--text-muted)}
.tn-li__main{display:grid;gap:3px;min-width:0}
.tn-li__main strong{color:var(--text-heading)}
.tn-li__tags{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.tn-frame{display:block;width:100%;height:min(78vh,820px);border:0}
.tn-modal{padding:14px 16px 20px;display:grid;gap:14px}
@media (max-width:640px){.tn-li{grid-template-columns:auto minmax(0,1fr)}.tn-li__tags{grid-column:1/-1;justify-content:flex-start}}

/* Окно управления турниром — рамка без layout.css: плитки цифр (.stats) как в кабинете. */
.tn-modal .stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:8px;width:100%;margin:0 0 12px}
.tn-modal .stat{display:grid;align-content:start;gap:2px;padding:10px 12px;border:1px solid var(--border-hairline);border-radius:var(--radius-sm);background:rgba(255,255,255,.02)}
.tn-modal .stat span{font-size:12px;line-height:1.3;color:var(--text-muted)}
.tn-modal .stat b{font-size:20px;color:var(--text-heading);font-variant-numeric:tabular-nums}
/* «Как проходит турнир» (_TournamentHow): пункты с жирным заголовком, предупреждение — акцентной кромкой. */
.tn-how{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.tn-how li{display:grid;gap:3px;padding:9px 12px;border:1px solid var(--border-hairline);border-radius:var(--radius-sm);background:rgba(255,255,255,.02)}
.tn-how li.is-warn{border-color:color-mix(in srgb,var(--accent) 60%,transparent);border-left-width:3px;background:color-mix(in srgb,var(--accent) 8%,transparent)}
.tn-how b{color:var(--text-heading);font-size:14px}
.tn-how span{color:var(--text-body);font-size:13.5px;line-height:1.45}
/* Управление турниром: разделы с заголовком, правка — сеткой, действия — одним рядом, опасное — справа. */
.tn-adm__sec{display:grid;gap:8px;padding:12px 0 4px;border-top:1px solid var(--border-hairline)}
.tn-adm__sec--first{border-top:0;padding-top:0}
.tn-adm__title{margin:0;color:var(--text-muted);font-size:11.5px;font-weight:600;letter-spacing:.06em;text-transform:uppercase}
.tn-adm__note{margin:0;font-size:13px}
.tn-adm__btns{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.tn-adm__end{margin-left:auto}
.tn-admin .tn-edit{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end}
.tn-admin .tn-edit label{min-width:150px}
/* Закреплённое короткое «Как проходит» на карточке турнира. */
.tn-pin{list-style:none;margin:0 0 10px;padding:10px 12px;display:grid;gap:6px;border:1px solid var(--border-hairline);border-radius:var(--radius-sm);background:rgba(255,255,255,.025);font-size:13px;line-height:1.4;color:var(--text-body)}
.tn-pin li{padding-left:14px;position:relative}
.tn-pin li::before{content:"";position:absolute;left:2px;top:.6em;width:5px;height:5px;border-radius:50%;background:var(--text-muted)}
.tn-pin li.is-warn{color:var(--text-heading)}
.tn-pin li.is-warn::before{background:var(--accent)}
/* Призы турнира по местам (_TournamentPrizes): строка на место, у первого — акцентная кромка. */
.tn-prizes{list-style:none;margin:0 0 10px;padding:0;display:grid;gap:6px}
.tn-prizes__row{display:flex;gap:10px;align-items:flex-start;padding:9px 12px;border:1px solid var(--border-hairline);border-radius:var(--radius-sm);background:rgba(255,255,255,.02);font-size:13.5px;line-height:1.45;color:var(--text-body)}
.tn-prizes__row--1{border-color:color-mix(in srgb,var(--accent) 60%,transparent);background:color-mix(in srgb,var(--accent) 8%,transparent)}
.tn-prizes__ico{flex:none;margin-top:1px;color:var(--accent)}
.tn-prizes__row--2 .tn-prizes__ico{color:var(--text-muted)}
.tn-prizes b{color:var(--text-heading)}
.tn-announce{display:grid!important;gap:10px}
.tn-announce label{width:100%}
.tn-announce input,.tn-announce textarea{width:100%;box-sizing:border-box}
.tn-announce textarea{resize:vertical;font:inherit;line-height:1.45}
/* Согласие при записи на турнир (_TournamentAreas): галочка и текст строкой. */
.tn-agree{display:flex;gap:8px;align-items:flex-start;font-size:12.5px;line-height:1.4;color:var(--text-body);cursor:pointer}
.tn-agree input{flex:none;margin-top:2px}
/* Окно условий записи (tournament.js, data-t-join): небольшое, по центру. */
.tn-join-dlg{width:min(460px,calc(100vw - 24px));padding:0}
.tn-join-dlg .p2p-modal__body{display:grid;gap:12px}
.tn-join-dlg form{display:grid;gap:12px}
/* Окно «Сетка и составы»: сетка и под ней списки игроков — в одной прокрутке. */
.tn-overlay__body [data-t-full-src]{display:grid;gap:14px;align-content:start}
/* Строка турнира в админке: сведения и метки сверху, кнопки частей окна — своей строкой под ними. */
.tn-li{grid-template-columns:auto minmax(0,1fr) auto}
.tn-li__acts{grid-column:1/-1;display:flex;gap:6px;flex-wrap:wrap}
/* Окно «Сетка и составы» живёт на странице вокруг окна — общих стилей чипа там нет, свои. */
.tn-overlay .chip{display:inline-flex;align-items:center;gap:6px;padding:3px 10px 3px 4px;border:1px solid var(--border-hairline);border-radius:999px;background:rgba(255,255,255,.04);font-size:13px;color:var(--text-body)}
.tn-overlay [data-t-full]{display:none}