/* Режим подсказок кабинета (cab/tips.js). Повторяет панель расчётов:
   круглая кнопка «?» в верхней строке, тёмная плашка рядом с элементом,
   подсветка элемента внутренней тенью. Цветных рамок снаружи нет. */

/* Кнопка «?» в верхней строке */
.qbtn{all:unset;box-sizing:border-box;flex:0 0 auto;cursor:pointer;width:28px;height:28px;border-radius:50%;
      display:inline-flex;align-items:center;justify-content:center;font:700 13px/1 var(--font-sans,inherit);
      color:var(--fg-3);background:var(--bg-1);box-shadow:var(--shadow-1);transition:background .15s ease,color .15s ease}
.qbtn:hover{background:var(--ho-yellow-bg);color:var(--fg-1)}
/* Режим включён: первичный акцент альфа-жёлтым, как у кнопок дизайн-системы */
.qbtn.on,.qbtn.on:hover{background:var(--ho-primary-alpha,rgba(255,206,96,.6));color:var(--fg-1)}
.qbtn:focus-visible{box-shadow:var(--shadow-1),inset 0 0 0 2px var(--ho-primary)}

/* Плашка с объяснением. Не перехватывает нажатия: кликают сквозь неё. */
.tipbox{position:fixed;top:0;left:0;z-index:400;max-width:320px;background:var(--fg-1);color:var(--fg-inv,#fff);
        border-radius:var(--radius-md);padding:10px 12px;box-shadow:var(--shadow-3);pointer-events:none;text-align:left}
.tipbox b{display:block;font-size:12.5px;font-weight:600;line-height:1.45}
.tipbox span{display:block;font-size:11px;line-height:1.4;color:var(--fg-inv-70,rgba(255,255,255,.7));margin-top:6px}

/* Подсветка элемента под курсором. Внутренняя тень, а не заливка: заливка
   съедала бы собственные цвета элемента (жёлтые плашки, зелёные отметки).
   Кольцо тёмно-жёлтое, чтобы оставаться видным и на жёлтых элементах. */
body.tips-on .tip-hl{box-shadow:inset 0 0 0 2px var(--ho-primary-dark,#E6BA57),inset 0 0 12px rgba(255,206,96,.35) !important}
/* У элемента без скругления подсветка получает мягкий угол */
body.tips-on .tip-hl.tip-hl-sq{border-radius:6px}

/* На телефоне и сенсорном экране наводить нечем: режима там нет совсем */
@media (max-width:768px),(hover:none){
  .ho-topbar #tipsBtn{display:none}
  .tipbox{display:none !important}
}
@media print{.tipbox{display:none !important}}