/* GG-IX 1.2 · общий слой взаимодействия csgg.pro (дизайн-система GG 2.0, «Движение»; тема «Обсидиан»; animacii-0724, 24.10.2026)
   Наведение, нажатие, фокус с клавиатуры и выключенное состояние у всего кликабельного; заглушки загрузки; связь «Найти матч» с очередью.
   Цвета — ТОЛЬКО из токенов: темы «Обсидиан» (--ob-*) или дизайн-системы (--gg-*: поверхность наведения, волоски, текст, фокус, красный
   главной кнопки и активного, ok/warn/danger); последнее запасное значение в var(…) — значение «Обсидиана». Без свечений: свет — это поверхность светлее,
   волосок ярче и белый текст; красная черта — только у активного. Движение — токены --gg-dur-*, --gg-ease-*.
   Размеры и место элементов не меняются никогда («кнопка не прыгает»): только цвет, рамка внутрь, прозрачность.
   Общие правила — нулевой специфичности (:where), их перекрывает любое правило страницы. */
:root{--ix-fast:var(--gg-dur-fast,180ms);--ix-step:var(--gg-dur-step,300ms);--ix-ease:var(--gg-ease-out,cubic-bezier(.22,1,.36,1));
  /* цвета: токен темы «Обсидиан» (--ob-*), иначе токен дизайн-системы (--gg-*), иначе значение «Обсидиана» */
  --ix-s3:var(--ob-s3,var(--gg-hover,#1D1D1D));--ix-s4:var(--ob-s4,#232323);--ix-hair:var(--ob-hair,var(--gg-line,rgba(255,255,255,.07)));
  --ix-line3:var(--ob-line-3,var(--gg-line-3,rgba(255,255,255,.2)));--ix-field:var(--ob-field,var(--gg-line-field,rgba(255,255,255,.4)));
  --ix-t1:var(--ob-t1,var(--gg-text,#FAFAFA));--ix-focus:var(--ob-focus,var(--gg-focus,#FFFFFF));--ix-page:var(--ob-page,var(--gg-bg,#0A0A0A));
  --ix-red:var(--ob-red,var(--gg-accent,#E0412B));--ix-red-fill:var(--ob-red-fill,#C73A26);--ix-red-h:var(--ob-red-hover,#B8321F);--ix-red-p:var(--ob-red-press,#A82D1C);
  --ix-ok:var(--ob-ok,var(--gg-ok,#4CD69B));--ix-warn:var(--ob-warn,var(--gg-warn,#F2A33A));--ix-err:var(--ob-err,var(--gg-danger,#FF6A5C));--ix-live:var(--ob-live,#FF4B33);
  --ix-press:inset 0 2px 6px rgba(0,0,0,.45)}

/* ---------- 1. Общее: курсор, фокус, нажатие, выключено ---------- */
:where(button,[role=button],[role=tab],[role=switch],[role=menuitem],[role=option],summary,label[for],select,input[type=checkbox],input[type=radio]){cursor:pointer}
:where(button,input,select,textarea):disabled,:where([aria-disabled="true"]){cursor:not-allowed}
:where(a[href],button,[role=button],[role=tab],[role=switch],[role=menuitem],[tabindex]:not([tabindex="-1"]),summary,select,input,textarea):focus-visible{outline:2px solid var(--ix-focus);outline-offset:2px}
:where(a[href],button,[role=button],[role=tab],[role=switch],summary){transition:opacity var(--ix-fast) var(--ix-ease)}
:where(a[href],button:not(:disabled),[role=button]:not([aria-disabled="true"]),[role=tab],[role=switch],summary):active{opacity:.84;transition-duration:40ms}
:where(details>summary){-webkit-tap-highlight-color:transparent}

/* ---------- 2. Шапка: пункты, «Играть ▾», подменю, кабинет, меню телефона ---------- */
@media (min-width:861px){
  html body #gg-site-header-craftum .gg-shell-header .gg-v13-nav .gg-shell-link:hover,
  html body #gg-site-header-craftum .gg-shell-header .gg-v13-top:not(.gg-shell-play):hover{--ob-bg:var(--ix-s3);color:var(--ix-t1)}
  html body #gg-site-header-craftum .gg-shell-header .gg-v13-nav .gg-shell-link:active,
  html body #gg-site-header-craftum .gg-shell-header .gg-v13-top:not(.gg-shell-play):active{--ob-bg:var(--ix-s4);--ob-bar:var(--ix-red)}
  /* «Играть ▾»: заливка — красная главной кнопки (наведение — тон темнее, его задаёт тема); нажатие — ещё темнее, без свечения */
  html body #gg-site-header-craftum .gg-shell-header .gg-shell-play.gg-v13-top:active,
  html body #gg-site-header-craftum .gg-shell-header .gg-play-sec.is-open>.gg-shell-play.gg-v13-top:active{--ob-bg:var(--ix-red-p);filter:none}
  html body #gg-site-header-craftum .gg-shell-header .gg-v13-drop{transition-timing-function:var(--ix-ease)}
}
/* подменю «Турниры ▾» и «Играть ▾» (компьютер и строка шапки телефона): наведение — светлая поверхность s3, волосок ярче, белый текст */
html body #gg-site-header-craftum .gg-shell-header .gg-v13-drop .gg-v13-item,
html body #gg-site-header-craftum .gg-shell-header .gg-play-drop .gg-v13-item{transition:background-color var(--ix-fast) var(--ix-ease),box-shadow var(--ix-fast) var(--ix-ease),color var(--ix-fast) var(--ix-ease)}
html body #gg-site-header-craftum .gg-shell-header .gg-play-drop .gg-v13-item svg{transition:color var(--ix-fast) var(--ix-ease)}
html body #gg-site-header-craftum .gg-shell-header .gg-v13-drop .gg-v13-item:focus-visible,
html body #gg-site-header-craftum .gg-shell-header .gg-play-drop .gg-v13-item:focus-visible{background:var(--ix-s3);color:var(--ix-t1);box-shadow:inset 0 0 0 1px var(--ix-line3);outline:2px solid var(--ix-focus);outline-offset:-2px}
@media (hover:hover){
  html body #gg-site-header-craftum .gg-shell-header .gg-v13-drop .gg-v13-item:hover,
  html body #gg-site-header-craftum .gg-shell-header .gg-play-drop .gg-v13-item:hover{background:var(--ix-s3);color:var(--ix-t1);box-shadow:inset 0 0 0 1px var(--ix-line3)}
  /* «Найти матч» выделен и в покое, поэтому при наведении — ярче всех: сплошная красная заливка главной кнопки, белые надпись и ▶ */
  html body #gg-site-header-craftum .gg-shell-header .gg-play-drop .gg-v13-item.gg-play-main:hover,
  html body #gg-site-header-craftum .gg-shell-header .gg-play-drop .gg-v13-item.gg-play-main[aria-current]:hover{background:var(--ix-red-fill);color:#fff;box-shadow:inset 0 0 0 1px var(--ix-line3)}
  html body #gg-site-header-craftum .gg-shell-header .gg-play-drop .gg-v13-item.gg-play-main:hover svg{color:#fff}
}
html body #gg-site-header-craftum .gg-shell-header .gg-play-drop .gg-v13-item.gg-play-main:focus-visible{background:var(--ix-red-fill);color:#fff}
html body #gg-site-header-craftum .gg-shell-header .gg-play-drop .gg-v13-item.gg-play-main:focus-visible svg{color:#fff}
html body #gg-site-header-craftum .gg-shell-header .gg-v13-drop .gg-v13-item:active,
html body #gg-site-header-craftum .gg-shell-header .gg-play-drop .gg-v13-item:active{background:var(--ix-s4);color:var(--ix-t1);box-shadow:var(--ix-press),inset 0 0 0 1px var(--ix-line3);transition-duration:40ms}
html body #gg-site-header-craftum .gg-shell-header .gg-play-drop .gg-v13-item.gg-play-main:active{background:var(--ix-red-p);color:#fff;box-shadow:var(--ix-press)}
/* кабинет (плашка учётной записи) */
html body #gg-site-header-craftum .gg-shell-header .gg-shell-cab{transition:border-color var(--ix-fast) var(--ix-ease),background-color var(--ix-fast) var(--ix-ease)}
@media (hover:hover){html body #gg-site-header-craftum .gg-shell-header .gg-shell-cab:hover{border-color:var(--ix-field)!important;background:var(--ix-s3)!important}}
html body #gg-site-header-craftum .gg-shell-header .gg-shell-cab:active{background:var(--ix-s4)!important;box-shadow:var(--ix-press)!important}
html body #gg-site-header-craftum .gg-shell-header .gg-shell-cab:focus-visible{outline:2px solid var(--ix-focus)!important;outline-offset:2px}
/* логотип — светлее при наведении */
html body #gg-site-header-craftum .gg-shell-logo{transition:filter var(--ix-fast) var(--ix-ease)}
@media (hover:hover){html body #gg-site-header-craftum .gg-shell-logo:hover{filter:brightness(1.18)}}
/* телефон: бургер, пункты листа, «Играть ▾» в строке шапки */
html body #gg-site-header-craftum .gg-shell-burger{transition:background-color var(--ix-fast) var(--ix-ease),border-color var(--ix-fast) var(--ix-ease)}
html body #gg-site-header-craftum .gg-shell-burger:active{background:var(--ix-s4)!important;border-color:var(--ix-line3)!important}
html body #gg-site-header-craftum .gg-v13-mnav .gg-v13-m1:active,html body #gg-site-header-craftum .gg-v13-mnav .gg-v13-mh:active,
html body #gg-site-header-craftum .gg-v13-mitem:active{background:var(--ix-s4)!important}
html body #gg-site-header-craftum .gg-shell-header .gg-play-row .gg-shell-play.gg-v13-top:active{--ob-bg:var(--ix-red-p)}
/* счётчик «N в поиске» поверх «Играть»: точка без бесконечной тени; кольцо (прозрачность и масштаб) — 3 раза при появлении и при смене
   числа (запускает gg-ix.js) */
html body #gg-site-header-craftum .gg-ob-q i{position:relative;animation:none}
html body #gg-site-header-craftum .gg-ob-q i::after{content:"";position:absolute;inset:0;border-radius:50%;border:1.5px solid var(--ix-warn);opacity:0;pointer-events:none}
/* LIVE у «Турниров»: то же кольцо, пока идёт турнир (композитор, без перерисовки); вне экрана — пауза */
html body #gg-site-header-craftum .gg-ob-live{position:relative;animation:none;box-shadow:none}
html body #gg-site-header-craftum .gg-ob-live::after{content:"";position:absolute;inset:0;border-radius:50%;border:1.5px solid var(--ix-live);opacity:0;pointer-events:none;animation:ggIxRing 1.6s var(--ix-ease) infinite}
@keyframes ggIxRing{0%{opacity:.95;transform:scale(1)}80%,100%{opacity:0;transform:scale(2.6)}}

/* ---------- 3. Подвал ---------- */
html body #gg-site-footer-craftum .gg-f13-a{text-decoration:underline;text-decoration-color:transparent;text-decoration-thickness:1px;text-underline-offset:5px;
  transition:color var(--ix-fast) var(--ix-ease),text-decoration-color var(--ix-fast) var(--ix-ease)}
@media (hover:hover){html body #gg-site-footer-craftum .gg-f13-a:hover{color:var(--ix-t1);text-decoration-color:currentColor}
  html body #gg-site-footer-craftum .gg-shell-social:hover{background:var(--ix-s3);border-color:var(--ix-line3);color:var(--ix-t1)}
  html body #gg-site-footer-craftum .gg-shell-brand:hover{filter:brightness(1.18)}}
html body #gg-site-footer-craftum .gg-shell-social{transition:background-color var(--ix-fast) var(--ix-ease),border-color var(--ix-fast) var(--ix-ease),color var(--ix-fast) var(--ix-ease)}
html body #gg-site-footer-craftum .gg-shell-social:active{background:var(--ix-s4);box-shadow:var(--ix-press)}
html body #gg-site-footer-craftum .gg-shell-brand{transition:filter var(--ix-fast) var(--ix-ease)}

/* ---------- 4. Содержимое страниц: три приёма на всё кликабельное ----------
   КРАСНАЯ (главная кнопка) — наведение: тон темнее (красный наведения темы) и светлый волосок по краю; нажатие — красный нажатия и тень внутрь.
   ПОВЕРХНОСТЬ (карточки, строки, плашки, вторичные кнопки, чипы) — светлая вуаль-волосок поверх любого фона и светлая рамка внутрь
   (обводкой — видна и поверх картинок; вуаль — два волоска друг на друге); нажатие — тёмная вуаль. ССЫЛКА (текстом) — белый цвет и подчёркивание цветом текста. */
@media (hover:hover){
  html body :is(#gg-now .gg-button--primary,#gg-next-1015-slot .gg-button--primary):hover{background:var(--ix-red-h)!important;color:#fff!important;box-shadow:inset 0 0 0 1px var(--ix-line3)!important}
  html body :is(#gg-now .gn-cover-a,#gg-next-1015-slot .gg-button:not(.gg-button--primary)):hover{box-shadow:inset 0 0 0 100vmax var(--ix-hair),inset 0 0 0 100vmax var(--ix-hair)!important;outline:1px solid var(--ix-line3)!important;outline-offset:-1px!important}
  html body :is(#gg-now .gn-go,#gg-now .gn-ar a,#gg-now .gn-r a):hover{color:var(--ix-t1)!important;text-decoration:underline!important;text-decoration-color:currentColor!important;
    text-decoration-thickness:1px!important;text-underline-offset:5px!important}
}
html body :is(#gg-now .gg-button--primary,#gg-next-1015-slot .gg-button--primary):active{background:var(--ix-red-p)!important;box-shadow:var(--ix-press)!important;transition-duration:40ms!important}
html body :is(#gg-now .gn-cover-a,#gg-next-1015-slot .gg-button:not(.gg-button--primary)):active{box-shadow:var(--ix-press),inset 0 0 0 100vmax rgba(0,0,0,.2)!important}
html body :is(#gg-now .gg-button,#gg-next-1015-slot .gg-button,#gg-now .gn-cover-a){transition:background-color var(--ix-fast) var(--ix-ease),box-shadow var(--ix-fast) var(--ix-ease),color var(--ix-fast) var(--ix-ease)}
html body :is(#gg-now .gn-go,#gg-now .gn-ar a,#gg-now .gn-r a){transition:color var(--ix-fast) var(--ix-ease),text-decoration-color var(--ix-fast) var(--ix-ease)}

/*<4б>*/
/* ---------- 4б. Содержимое страниц (сгенерировано tools/gen_content.py из описи «b0»: 73 селекторов) ---------- */
@media (hover:hover){html body :is(
  #gg-arena-first a.gga-btn.gga-btn--p,
  #gg-bvl a.bv-btn.main,
  #itog a.bv-btn.main,
  #sp-gate a.sp-submit):hover{background:var(--ix-red-h)!important;color:#fff!important;box-shadow:inset 0 0 0 1px var(--ix-line3)!important}}
html body :is(
  #gg-arena-first a.gga-btn.gga-btn--p,
  #gg-bvl a.bv-btn.main,
  #itog a.bv-btn.main,
  #sp-gate a.sp-submit):active{background:var(--ix-red-p)!important;box-shadow:var(--ix-press)!important}
@media (hover:hover){html body :is(
  #appendix-b summary.gg-config-summary,
  #contacts a.gq-ch,
  #gg-arena-first a.gga-btn,
  #gg-enter,
  #gg-invest-protvino-v1 a.gi-btn.gi-btn--paper,
  #gg-invest-protvino-v1 button.gi-btn,
  #gg-invest-protvino-v1 button.gi-btn.gi-btn--dark,
  #gg-invest-protvino-v1 button.gi-btn.gi-btn--paper,
  #gg-rating-craftum button.gg-rule-btn,
  #ggv-interview button.gg-button.ggv-more,
  #ggv-records a.ggv-rec,
  #itog .lg-more > summary:not([class]),
  #q-areny .gq-go > a:not([class]),
  #q-areny summary:not([class]),
  #q-ladder .gq-go > a:not([class]),
  #q-ladder summary:not([class]),
  #q-pravila .gq-go > a:not([class]),
  #q-pravila summary:not([class]),
  #q-priglashenie .gq-go > a:not([class]),
  #q-priglashenie summary:not([class]),
  #q-shkaly .gq-go > a:not([class]),
  #q-shkaly summary:not([class]),
  #q-turnir summary:not([class]),
  #q-zapisi .gq-go > a:not([class]),
  #q-zapisi summary:not([class])):hover{box-shadow:inset 0 0 0 100vmax var(--ix-hair),inset 0 0 0 100vmax var(--ix-hair)!important;outline:1px solid var(--ix-line3)!important;outline-offset:-1px!important}}
html body :is(
  #appendix-b summary.gg-config-summary,
  #contacts a.gq-ch,
  #gg-arena-first a.gga-btn,
  #gg-enter,
  #gg-invest-protvino-v1 a.gi-btn.gi-btn--paper,
  #gg-invest-protvino-v1 button.gi-btn,
  #gg-invest-protvino-v1 button.gi-btn.gi-btn--dark,
  #gg-invest-protvino-v1 button.gi-btn.gi-btn--paper,
  #gg-rating-craftum button.gg-rule-btn,
  #ggv-interview button.gg-button.ggv-more,
  #ggv-records a.ggv-rec,
  #itog .lg-more > summary:not([class]),
  #q-areny .gq-go > a:not([class]),
  #q-areny summary:not([class]),
  #q-ladder .gq-go > a:not([class]),
  #q-ladder summary:not([class]),
  #q-pravila .gq-go > a:not([class]),
  #q-pravila summary:not([class]),
  #q-priglashenie .gq-go > a:not([class]),
  #q-priglashenie summary:not([class]),
  #q-shkaly .gq-go > a:not([class]),
  #q-shkaly summary:not([class]),
  #q-turnir summary:not([class]),
  #q-zapisi .gq-go > a:not([class]),
  #q-zapisi summary:not([class])):active{box-shadow:inset 0 2px 8px rgba(0,0,0,.45),inset 0 0 0 100vmax rgba(0,0,0,.2)!important}
@media (hover:hover){html body :is(
  #about .gq-tile > a:not([class]),
  #areny .h-q > a:not([class]),
  #areny a.mc,
  #areny a:not([class]),
  #bv-next .bv-next > a:not([class]),
  #bv-reset,
  #contacts .gq-more > a:not([class]),
  #contacts a.gq-mail,
  #contacts a:not([class]),
  #gg-arena-first .gga-more > a:not([class]),
  #gg-arena-first a:not([class]),
  #gg-bvl .bv-src > a:not([class]),
  #gg-history .h-foot > a:not([class]),
  #gg-history .h-src > a:not([class]),
  #gg-history a.mc,
  #ggv-live .ggv-p > a:not([class]),
  #pravila .lg-join > a:not([class]),
  #q-chasy a:not([class]),
  #q-chto .bv-path > a:not([class]),
  #q-chto .bv-step > a:not([class]),
  #q-chto a:not([class]),
  #q-devushki a:not([class]),
  #q-etot a:not([class]),
  #q-legenda a:not([class]),
  #q-online .bv-path > a:not([class]),
  #q-online a:not([class]),
  #q-pablik a:not([class]),
  #q-priglashenie a:not([class]),
  #q-server a:not([class]),
  #q-skolko a:not([class]),
  #q-vypal a:not([class]),
  #q-zapisi a:not([class]),
  #voprosy .bv-path > a:not([class]),
  #voprosy a:not([class])):hover{color:var(--ix-t1)!important;text-decoration-line:underline!important;text-decoration-color:currentColor!important;text-decoration-thickness:1px!important;text-underline-offset:4px!important}}
@media (hover:hover){html body :is(
  #bv-p1,
  #bv-p2,
  #bv-p3,
  #bv-y1,
  #bv-y2,
  #bv-y3,
  #gg-login,
  #gg-pass,
  #gg-rating-craftum input.gg-field,
  #gg-rating-craftum select.gg-select):hover{border-color:var(--ix-field)!important;box-shadow:inset 0 0 0 100vmax var(--ix-hair)!important}}
html body :is(
  #about .gq-tile > a:not([class]),
  #appendix-b summary.gg-config-summary,
  #areny .h-q > a:not([class]),
  #areny a.mc,
  #areny a:not([class]),
  #bv-next .bv-next > a:not([class]),
  #bv-p1,
  #bv-p2,
  #bv-p3,
  #bv-reset,
  #bv-y1,
  #bv-y2,
  #bv-y3,
  #contacts .gq-more > a:not([class]),
  #contacts a.gq-ch,
  #contacts a.gq-mail,
  #contacts a:not([class]),
  #gg-arena-first .gga-more > a:not([class]),
  #gg-arena-first a.gga-btn,
  #gg-arena-first a.gga-btn.gga-btn--p,
  #gg-arena-first a:not([class]),
  #gg-bvl .bv-src > a:not([class]),
  #gg-bvl a.bv-btn.main,
  #gg-enter,
  #gg-history .h-foot > a:not([class]),
  #gg-history .h-src > a:not([class]),
  #gg-history a.mc,
  #gg-invest-protvino-v1 a.gi-btn.gi-btn--paper,
  #gg-invest-protvino-v1 button.gi-btn,
  #gg-invest-protvino-v1 button.gi-btn.gi-btn--dark,
  #gg-invest-protvino-v1 button.gi-btn.gi-btn--paper,
  #gg-login,
  #gg-pass,
  #gg-rating-craftum button.gg-rule-btn,
  #gg-rating-craftum input.gg-field,
  #gg-rating-craftum select.gg-select,
  #ggv-interview button.gg-button.ggv-more,
  #ggv-live .ggv-p > a:not([class]),
  #ggv-records a.ggv-rec,
  #itog .lg-more > summary:not([class]),
  #itog a.bv-btn.main,
  #pravila .lg-join > a:not([class]),
  #q-areny .gq-go > a:not([class]),
  #q-areny summary:not([class]),
  #q-chasy a:not([class]),
  #q-chto .bv-path > a:not([class]),
  #q-chto .bv-step > a:not([class]),
  #q-chto a:not([class]),
  #q-devushki a:not([class]),
  #q-etot a:not([class]),
  #q-ladder .gq-go > a:not([class]),
  #q-ladder summary:not([class]),
  #q-legenda a:not([class]),
  #q-online .bv-path > a:not([class]),
  #q-online a:not([class]),
  #q-pablik a:not([class]),
  #q-pravila .gq-go > a:not([class]),
  #q-pravila summary:not([class]),
  #q-priglashenie .gq-go > a:not([class]),
  #q-priglashenie a:not([class]),
  #q-priglashenie summary:not([class]),
  #q-server a:not([class]),
  #q-shkaly .gq-go > a:not([class]),
  #q-shkaly summary:not([class]),
  #q-skolko a:not([class]),
  #q-turnir summary:not([class]),
  #q-vypal a:not([class]),
  #q-zapisi .gq-go > a:not([class]),
  #q-zapisi a:not([class]),
  #q-zapisi summary:not([class]),
  #sp-gate a.sp-submit,
  #voprosy .bv-path > a:not([class]),
  #voprosy a:not([class])){transition:background-color var(--ix-fast) var(--ix-ease),box-shadow var(--ix-fast) var(--ix-ease),color var(--ix-fast) var(--ix-ease),outline-color var(--ix-fast) var(--ix-ease),text-decoration-color var(--ix-fast) var(--ix-ease),border-color var(--ix-fast) var(--ix-ease)}
html body :is(
  #about .gq-tile > a:not([class]),
  #appendix-b summary.gg-config-summary,
  #areny .h-q > a:not([class]),
  #areny a.mc,
  #areny a:not([class]),
  #bv-next .bv-next > a:not([class]),
  #bv-p1,
  #bv-p2,
  #bv-p3,
  #bv-reset,
  #bv-y1,
  #bv-y2,
  #bv-y3,
  #contacts .gq-more > a:not([class]),
  #contacts a.gq-ch,
  #contacts a.gq-mail,
  #contacts a:not([class]),
  #gg-arena-first .gga-more > a:not([class]),
  #gg-arena-first a.gga-btn,
  #gg-arena-first a.gga-btn.gga-btn--p,
  #gg-arena-first a:not([class]),
  #gg-bvl .bv-src > a:not([class]),
  #gg-bvl a.bv-btn.main,
  #gg-enter,
  #gg-history .h-foot > a:not([class]),
  #gg-history .h-src > a:not([class]),
  #gg-history a.mc,
  #gg-invest-protvino-v1 a.gi-btn.gi-btn--paper,
  #gg-invest-protvino-v1 button.gi-btn,
  #gg-invest-protvino-v1 button.gi-btn.gi-btn--dark,
  #gg-invest-protvino-v1 button.gi-btn.gi-btn--paper,
  #gg-login,
  #gg-pass,
  #gg-rating-craftum button.gg-rule-btn,
  #gg-rating-craftum input.gg-field,
  #gg-rating-craftum select.gg-select,
  #ggv-interview button.gg-button.ggv-more,
  #ggv-live .ggv-p > a:not([class]),
  #ggv-records a.ggv-rec,
  #itog .lg-more > summary:not([class]),
  #itog a.bv-btn.main,
  #pravila .lg-join > a:not([class]),
  #q-areny .gq-go > a:not([class]),
  #q-areny summary:not([class]),
  #q-chasy a:not([class]),
  #q-chto .bv-path > a:not([class]),
  #q-chto .bv-step > a:not([class]),
  #q-chto a:not([class]),
  #q-devushki a:not([class]),
  #q-etot a:not([class]),
  #q-ladder .gq-go > a:not([class]),
  #q-ladder summary:not([class]),
  #q-legenda a:not([class]),
  #q-online .bv-path > a:not([class]),
  #q-online a:not([class]),
  #q-pablik a:not([class]),
  #q-pravila .gq-go > a:not([class]),
  #q-pravila summary:not([class]),
  #q-priglashenie .gq-go > a:not([class]),
  #q-priglashenie a:not([class]),
  #q-priglashenie summary:not([class]),
  #q-server a:not([class]),
  #q-shkaly .gq-go > a:not([class]),
  #q-shkaly summary:not([class]),
  #q-skolko a:not([class]),
  #q-turnir summary:not([class]),
  #q-vypal a:not([class]),
  #q-zapisi .gq-go > a:not([class]),
  #q-zapisi a:not([class]),
  #q-zapisi summary:not([class]),
  #sp-gate a.sp-submit,
  #voprosy .bv-path > a:not([class]),
  #voprosy a:not([class])):focus-visible{outline:2px solid var(--ix-focus)!important;outline-offset:2px!important}
/*</4б>*/

/* ---------- 5. «Найти матч» (/matchcenter/play = /ladder = /ladder/rules), корень #gg-ladder ---------- */
/* строки состава и друзей: строка — светлая поверхность s3, ник — белым с подчёркиванием, аватар — светлое кольцо; своя строка — красная черта (тема) */
html body #gg-ladder .gg-prow{transition:background-color var(--ix-fast) var(--ix-ease)}
html body #gg-ladder :is(.gg-prow__nick,.pcl,.term-n,.term-at,.fr-all){transition:color var(--ix-fast) var(--ix-ease),text-decoration-color var(--ix-fast) var(--ix-ease)}
@media (hover:hover){
  html body #gg-ladder .gg-prow:hover{background:var(--ix-s3)}
  html body #gg-ladder .gg-prow:hover .gg-prow__nick,
  html body #gg-ladder :is(.gg-prow__nick,b.pcl,span.pcl:not(.gg-ava),.term-n,.term-at,.fr-all):hover{color:var(--ix-t1);text-decoration:underline;text-decoration-color:currentColor;text-decoration-thickness:1px;text-underline-offset:3px}
  html body #gg-ladder :is(#gg-lp-rl,#gg-lp-fr,#gg-lp-nmeta) :is(.gg-ava,.gg-qv-slot):hover{outline:1.5px solid var(--ix-t1);outline-offset:1px}
  html body #gg-ladder #gg-lp-chat .term-r:hover{background:var(--ix-hair)}
  html body #gg-ladder #gg-lp-roster .gg-rtabs>button:not([aria-selected="true"]):not([aria-pressed="true"]):hover,
  html body #gg-ladder .gg-btn--quiet:hover{color:var(--ix-t1);background:var(--ix-s3);box-shadow:inset 0 0 0 1px var(--ix-line3)}
  html body #gg-ladder :is(#gg-lp-rq,#gg-lp-chat input):hover{border-color:var(--ix-field)}
}
html body #gg-ladder .gg-prow:active{background:var(--ix-s4)}
html body #gg-ladder :is(.gg-btn--quiet,#gg-lp-roster .gg-rtabs>button):active{background:var(--ix-s4);box-shadow:var(--ix-press)}
html body #gg-ladder :is(.gg-prow__nick,.pcl,.term-n,.term-at,.gg-qv-slot,.gg-btn--quiet,.fr-all):focus-visible{outline:2px solid var(--ix-focus);outline-offset:2px}
/* связь страницы с очередью: точка у «Сейчас» — ok (на связи; кольцо при каждом обновлении), warn с бегущей дугой (переподключение),
   err (нет связи); подпись — после «обновлено …». Состояние ставит gg-ix.js по ответам очереди и событиям браузера online/offline. */
html body #gg-lp-now h3 .ld{position:relative;background:var(--ix-ok);box-shadow:none;color:var(--ix-ok);transition:background-color var(--ix-step) var(--ix-ease)}
html body #gg-lp-now h3 .ld::after{content:"";position:absolute;inset:-3px;border-radius:50%;border:1.5px solid currentColor;opacity:0;pointer-events:none}
html body #gg-lp-now h3 .ld[data-ix-conn="re"]{background:var(--ix-warn);color:var(--ix-warn)}
html body #gg-lp-now h3 .ld[data-ix-conn="re"]::after{opacity:1;border-color:currentColor transparent transparent transparent;animation:ggIxSpin .9s linear infinite}
html body #gg-lp-now h3 .ld[data-ix-conn="off"]{background:var(--ix-err);color:var(--ix-err)}
html body #gg-lp-nupd[data-ix-conn="re"]::after{content:" · переподключение…";color:var(--ix-warn)}
html body #gg-lp-nupd[data-ix-conn="off"]::after{content:" · нет связи";color:var(--ix-err)}
@media (max-width:520px){   /* телефон: вместо «обновлено …» — только состояние, чтобы строка не вылезала за край */
  html body #gg-lp-nupd:is([data-ix-conn="re"],[data-ix-conn="off"]){font-size:0}
  html body #gg-lp-nupd[data-ix-conn="re"]::after{content:"переподключение…";font-size:10.5px}
  html body #gg-lp-nupd[data-ix-conn="off"]::after{content:"нет связи";font-size:10.5px}
}
@keyframes ggIxSpin{to{transform:rotate(360deg)}}
/* «идёт…» у кнопок поиска и принятия — в gg-ix.js (Web Animations: надпись дышит, пока ждём ответ; размеры не меняются) */
/* заглушки, пока данных нет: спокойные волоски на подложке, дышат прозрачностью (5 раз, не дольше 8 с — дальше своё «нет связи» страницы) */
html body #gg-ladder :is(#gg-lp-chat,#gg-lp-recent):empty{position:relative;min-height:200px;animation:ggIxGone .3s linear 8s forwards}
html body #gg-ladder :is(#gg-lp-chat,#gg-lp-recent):empty::before{content:"";position:absolute;inset:14px;border-radius:6px;pointer-events:none;
  background:repeating-linear-gradient(180deg,var(--ix-hair) 0 14px,transparent 14px 30px);animation:ggIxSk 1.6s ease-in-out 5 alternate}
html body #gg-ladder #gg-lp-side:has(>#gg-lp-roster[hidden]:only-child)::before{content:"";display:block;height:560px;box-sizing:border-box;border:1px solid var(--ix-hair);border-radius:8px;
  background:repeating-linear-gradient(180deg,transparent 0 56px,var(--ix-hair) 56px 70px,transparent 70px 84px),var(--ob-s1,#111111);animation:ggIxSk 1.6s ease-in-out 5 alternate,ggIxGone .3s linear 8s forwards}
@keyframes ggIxSk{from{opacity:.5}to{opacity:1}}
@keyframes ggIxGone{to{min-height:0;height:0;opacity:0;border-width:0}}
html body #gg-ladder :is(#gg-lp-roster,#gg-lp-now,#gg-lp-fr):not([hidden]){animation:ggIxFade var(--ix-step) var(--ix-ease) 1 both}
@keyframes ggIxFade{from{opacity:0}to{opacity:1}}

/* ---------- 9. Обновление, появление, пауза — в gg-ix.js (Web Animations API, без записи в разметку перерисовываемых блоков);
   скрытая вкладка — пауза всех анимаций ---------- */
html[data-ix-hidden] *,html[data-ix-hidden] *::before,html[data-ix-hidden] *::after{animation-play-state:paused!important}

@media (prefers-reduced-motion:reduce){
  html body #gg-site-header-craftum .gg-ob-live::after,html body #gg-lp-now h3 .ld[data-ix-conn="re"]::after,
  html body #gg-ladder :is(#gg-lp-roster,#gg-lp-now,#gg-lp-fr):not([hidden]),html body #gg-ladder :is(#gg-lp-chat,#gg-lp-recent):empty::before{animation:none!important}
  html body #gg-site-header-craftum .gg-ob-live::after{opacity:1;transform:none}
  :where(a[href],button,[role=button],[role=tab],[role=switch],summary){transition:none}
}
