/* Valor: подсказка предмета как в игре (WoW 3.3.5) + иконки с рамкой качества — общий компонент (группа armory) */
.vt{position:absolute;left:0;top:0;z-index:9995;display:flex;align-items:flex-start;gap:4px;pointer-events:none;opacity:0;visibility:hidden;
  transition:opacity .12s ease,visibility 0s linear .12s;will-change:transform}
.vt.vt--fixed{position:fixed}
.vt.on{opacity:1;visibility:visible;transition:opacity .12s ease}
.vt.vt--touch{pointer-events:auto}
.vt__ico{flex:0 0 42px;width:42px;height:42px;border-radius:5px;background:#05060f center/cover no-repeat;
  box-shadow:0 0 0 1px #000,0 0 0 2px #8d8d99,0 0 0 3px #000,0 6px 14px rgba(0,0,0,.6)}
.vt__box{box-sizing:border-box;width:max-content;min-width:220px;max-width:min(340px,calc(100vw - 66px));padding:8px 11px 9px;text-align:left;
  background:linear-gradient(180deg,rgba(10,13,34,.96),rgba(4,5,17,.96));border:1px solid #b3b3bf;border-radius:6px;
  box-shadow:0 0 0 1px rgba(0,0,0,.9),inset 0 0 0 1px rgba(0,0,0,.65),inset 0 1px 0 rgba(255,255,255,.06),0 12px 28px rgba(0,0,0,.72);
  font:13.5px/1.38 'Roboto Condensed','Arial Narrow',Arial,sans-serif;color:#fff;letter-spacing:.1px;text-shadow:0 1px 0 #000;overflow-wrap:break-word}
.vt--spell .vt__box{max-width:min(320px,calc(100vw - 66px))}
.vt__n{font-size:16px;font-weight:700;line-height:1.25;margin-bottom:1px}
.vt__row{display:flex;justify-content:space-between;gap:22px}
.vt__row>span:last-child{text-align:right;white-space:nowrap}
.vt__gap{height:6px}
.vt .g{color:#1eff00}.vt .y{color:#ffd100}.vt .w{color:#fff}.vt .gr{color:#9d9d9d}
.vt__scale{color:#e6cc80}
.vt__sock{display:flex;align-items:center;gap:6px;line-height:1.5}
.vt__sock img{width:15px;height:15px;border-radius:2px;box-shadow:0 0 0 1px #000}
.vt-s{flex:0 0 13px;width:13px;height:13px;border-radius:2px;box-shadow:0 0 0 1px #000,inset 0 0 0 1px rgba(255,255,255,.25),inset 0 -4px 5px rgba(0,0,0,.45)}
.vt-s--red{background:radial-gradient(circle at 35% 30%,#ff8a7a,#c0231a 55%,#4a0b07)}
.vt-s--yellow{background:radial-gradient(circle at 35% 30%,#fff3a0,#d6a91a 55%,#5a3f05)}
.vt-s--blue{background:radial-gradient(circle at 35% 30%,#a8d0ff,#2461c9 55%,#0a1f4a)}
.vt-s--meta{background:radial-gradient(circle at 35% 30%,#ffffff,#9ea3ad 55%,#3a3d44);transform:rotate(45deg) scale(.85)}
.vt-s--prismatic{background:conic-gradient(#e0342a,#e0b52a,#3ac25a,#2a7ae0,#a33ae0,#e0342a)}
.vt__set{margin-top:8px}
.vt__si{padding-left:12px}
.vt__si.on{color:#ffffa0}
.vt__desc{margin-top:4px}
.vt__todo{margin-top:8px;padding-top:6px;border-top:1px dashed rgba(232,179,90,.45);font-size:12.5px;line-height:1.35;color:#f0c27a}
.vt__todo::before{content:"Уточняется: ";font-weight:700}
.vt__hint{margin-top:7px;font-size:12px;color:#8fb4ec}
@media (max-width:480px){
  .vt{display:block}
  .vt__ico{position:absolute;left:8px;top:8px;width:30px;height:30px;flex:none;z-index:1;box-shadow:0 0 0 1px #000,0 0 0 2px #8d8d99}
  .vt__box{min-width:0;max-width:calc(100vw - 16px);font-size:13px;padding-left:11px}
  .vt__box>.vt__n:first-child{padding-left:38px;min-height:32px;display:flex;align-items:center}
  .vt--spell .vt__box,.vt:not(.vt--spell) .vt__box{max-width:calc(100vw - 16px)}
}
@media (prefers-reduced-motion:reduce){ .vt,.vt.on{transition:none} }

/* иконка предмета с рамкой цвета качества: VALOR.tooltip.iconHtml(item, {size}) */
.vt-slot{--q:#57514b;--sz:44px;position:relative;display:inline-block;flex:0 0 var(--sz);width:var(--sz);height:var(--sz);border-radius:4px;background:#0b0908;vertical-align:middle;
  box-shadow:0 0 0 1px #000,0 0 0 2px var(--q),0 0 0 3px #000,0 3px 10px rgba(0,0,0,.55)}
.vt-slot::after{content:"";position:absolute;inset:0;border-radius:4px;pointer-events:none;box-shadow:inset 0 0 0 1px rgba(0,0,0,.6),inset 0 0 10px rgba(0,0,0,.35)}
.vt-slot img{display:block;width:100%;height:100%;border-radius:4px;object-fit:cover}
[data-tt]:focus-visible,[data-item]:focus-visible,[data-item-id]:focus-visible{outline:2px solid #f1c22d;outline-offset:3px}
.vt-link{cursor:help;font-weight:700;text-shadow:0 1px 0 #000}
.vt-link:hover{text-decoration:underline}
