/* Подсказки «откуда цифра» — общий компонент админки ЧШ (21.09.2026).
   Триггер: <button class="cs-hint-btn" data-hint="<html>">?</button> рядом с подписью.
   Логика — static/cs_hint.js. Тексты — templates/_hints.html.
   Тач-цель 44px по канону panel-ux-canon (невидимая зона вокруг маленькой иконки). */
.cs-hint-btn{
  display:inline-flex;align-items:center;justify-content:center;
  width:17px;height:17px;padding:0;margin-left:5px;vertical-align:middle;
  border:1px solid var(--border);border-radius:50%;
  background:transparent;color:var(--text-muted);
  font-size:11px;font-weight:700;line-height:1;cursor:help;
  position:relative;flex:0 0 auto;-webkit-tap-highlight-color:transparent;
}
.cs-hint-btn::after{content:"";position:absolute;left:50%;top:50%;
  width:44px;height:44px;transform:translate(-50%,-50%);}
.cs-hint-btn:hover,.cs-hint-btn[aria-expanded="true"]{
  border-color:var(--c-gold);color:var(--c-gold);}
.cs-hint-pop{
  display:none;position:fixed;z-index:10000;
  width:min(360px,calc(100vw - 24px));
  padding:13px 15px;border-radius:10px;
  background:#1A1A2E;color:#F2F2F5;
  font-size:12.5px;line-height:1.5;font-weight:400;text-align:left;
  box-shadow:0 12px 34px rgba(0,0,0,.38);
}
.cs-hint-pop.open{display:block}
.cs-hint-pop h4{margin:0 0 7px;font-size:13px;color:#FFD0B5;font-weight:700}
.cs-hint-pop p{margin:0 0 7px}
.cs-hint-pop p:last-child{margin-bottom:0}
.cs-hint-pop b{color:#FFD0B5;font-weight:600}
.cs-hint-pop .cs-hint-now{
  margin-top:9px;padding-top:9px;border-top:1px solid rgba(255,255,255,.18);
  color:#FFE9A8;}
.cs-hint-pop .cs-hint-warn{color:#FFB4A8}
@media (max-width:520px){ .cs-hint-pop{font-size:13px} }
/* Мобильный слой (mobile.css, «правка мелочей под палец») тянул «?» до 44px в высоту — выходил овал.
   Зону нажатия 44×44 и так даёт ::after, сам кружок оставляем круглым (26.09.2026). */
body.mob-on .main .cs-hint-btn{min-height:0!important;padding:0!important;width:20px;height:20px}
/* Подсказка на неинтерактивном элементе (бейдж, заголовок колонки, плитка) — H.tip, 02.10.2026 */
[data-hint]:not(.cs-hint-btn){cursor:help}
[data-hint]:not(.cs-hint-btn):focus-visible{outline:2px solid var(--c-gold);outline-offset:2px}
