/* Поиск очков по фото (20.10.2026): кнопка-камера вместо «AI» в поиске шапки и мобильного меню, окно ожидания, страница
   /search2/foto/ и редактор рамки. Логика — /js/ot-vsearch.js; мануал docs/manuals/VISUAL_SEARCH_MANUAL.md. */
.header-main .oth-search-cam { background: linear-gradient(135deg, var(--ai-accent, #1c3d6e), #2a5a96); color: #fff; border: 0; cursor: pointer;
  flex-shrink: 0; display: inline-flex; align-items: center; gap: 5px; padding: 4px 10px; border-radius: 12px; font: 600 11px/1 inherit; letter-spacing: .2px; }
.header-main .oth-search-cam svg { width: 15px; height: 15px; }
.header-main .oth-search-cam:hover { filter: brightness(1.12); }
.drawer-search-cam { flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center; gap: 5px; background: linear-gradient(135deg, var(--ai-accent, #1c3d6e), #2a5a96);
  color: #fff; font: 700 11px/1 inherit; padding: 6px 10px; border: 0; border-radius: 12px; cursor: pointer; }
.drawer-search-cam svg { width: 16px; height: 16px; }

/* окно ожидания и редактор — поверх всего, включая плашку cookie (её слой ставит скрипт) */
.ot-vs-ov { position: fixed; inset: 0; z-index: 2147483001; background: rgba(15, 20, 30, .45); display: flex; align-items: center; justify-content: center; padding: 16px; }
.ot-vs-ov[hidden] { display: none; }
.ot-vs-ov__card { background: #fff; border-radius: 14px; padding: 22px 22px 18px; max-width: 320px; width: 100%; text-align: center; box-shadow: 0 12px 40px rgba(0,0,0,.25); }
.ot-vs-ov__spin { width: 34px; height: 34px; margin: 0 auto 12px; border-radius: 50%; border: 3px solid #e3e8ef; border-top-color: var(--ai-accent, #1c3d6e); animation: otVsSpin .8s linear infinite; }
.ot-vs-ov__txt { font-size: 15px; color: #1a1a1a; line-height: 1.4; }
.ot-vs-ov__close { display: none; margin-top: 14px; border: 0; background: #1a1a1a; color: #fff; border-radius: 10px; padding: 9px 18px; font: 600 14px/1 inherit; cursor: pointer; }
.ot-vs-ov.is-err .ot-vs-ov__spin { display: none; }
.ot-vs-ov.is-err .ot-vs-ov__close { display: inline-block; }
@keyframes otVsSpin { to { transform: rotate(360deg); } }

.ot-vsp-drop { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 42px 20px; border: 2px dashed #c9d3e0; border-radius: 16px; background: #f7f9fc;
  cursor: pointer; text-align: center; max-width: 560px; color: #1a1a1a; transition: border-color .15s, background .15s; }
.ot-vsp-drop:hover, .ot-vsp-drop.is-over { border-color: var(--ai-accent, #1c3d6e); background: #eef3fa; }
.ot-vsp-drop svg { width: 42px; height: 42px; color: var(--ai-accent, #1c3d6e); }
.ot-vsp-drop b { font-size: 17px; }
.ot-vsp-drop span { font-size: 14px; color: #6b6b6b; max-width: 360px; }
.ot-vsp-privacy, .ot-vsp-note { font-size: 13px; color: #8a8a8a; margin: 10px 0 0; }
.ot-vsp-note { color: #5f5f5f; margin: 0 0 12px; }
.ot-vsp-empty { font-size: 15px; color: #5f5f5f; padding: 24px 0; }

.ot-vsp-top { display: flex; gap: 20px; align-items: flex-start; margin: 0 0 22px; flex-wrap: wrap; }
.ot-vsp-photo { flex: 0 0 auto; }
.ot-vsp-photo__in { position: relative; display: inline-block; border-radius: 12px; overflow: hidden; line-height: 0; }
.ot-vsp-photo__in img { max-width: 240px; max-height: 200px; display: block; }
.ot-vsp-photo__box { position: absolute; border: 2px solid #fff; border-radius: 6px; box-shadow: 0 0 0 9999px rgba(0, 0, 0, .38); pointer-events: none; }
.ot-vsp-side { flex: 1 1 280px; min-width: 0; display: flex; flex-direction: column; gap: 12px; }
.ot-vsp-actions { display: flex; gap: 10px; flex-wrap: wrap; }
.ot-vsp-btn { border: 0; border-radius: 10px; padding: 10px 16px; font: 600 14px/1 inherit; cursor: pointer; background: var(--ai-accent, #1c3d6e); color: #fff; }
.ot-vsp-btn--ghost { background: #fff; color: #1a1a1a; box-shadow: inset 0 0 0 1px #cfd6df; }
.ot-vsp-btn[hidden] { display: none; }
.ot-vsp-fit { display: flex; gap: 8px; flex-wrap: wrap; }
.ot-vsp-chip { display: inline-flex; align-items: center; padding: 8px 14px; border-radius: 999px; font-size: 14px; text-decoration: none; color: #1a1a1a; box-shadow: inset 0 0 0 1px #cfd6df; background: #fff; }
.ot-vsp-chip.is-on { background: #1a1a1a; color: #fff; box-shadow: none; }
.ot-vsp-hint { font-size: 13px; color: #6b6b6b; line-height: 1.45; max-width: 560px; }

.ot-vs-ed { position: fixed; inset: 0; z-index: 2147483000; background: rgba(15, 20, 30, .6); display: flex; align-items: center; justify-content: center; padding: 16px; }
.ot-vs-ed__card { background: #fff; border-radius: 14px; padding: 16px; max-width: 760px; width: 100%; }
.ot-vs-ed__title { font-weight: 700; font-size: 16px; margin: 0 0 12px; }
.ot-vs-ed__stage { position: relative; display: block; margin: 0 auto; width: fit-content; line-height: 0; user-select: none; touch-action: none; }
.ot-vs-ed__stage img { display: block; max-width: 100%; max-height: 64vh; }
.ot-vs-ed__box { position: absolute; border: 2px solid #fff; box-shadow: 0 0 0 9999px rgba(0, 0, 0, .45); cursor: move; touch-action: none; }
.ot-vs-ed__stage { overflow: hidden; border-radius: 8px; }
.ot-vs-ed__box i { position: absolute; width: 22px; height: 22px; background: #fff; border-radius: 50%; box-shadow: 0 1px 4px rgba(0,0,0,.4); }
.ot-vs-ed__box i[data-h="nw"] { left: -11px; top: -11px; cursor: nwse-resize; }
.ot-vs-ed__box i[data-h="ne"] { right: -11px; top: -11px; cursor: nesw-resize; }
.ot-vs-ed__box i[data-h="sw"] { left: -11px; bottom: -11px; cursor: nesw-resize; }
.ot-vs-ed__box i[data-h="se"] { right: -11px; bottom: -11px; cursor: nwse-resize; }
.ot-vs-ed__btns { display: flex; gap: 10px; margin-top: 14px; justify-content: flex-end; }
@media (max-width: 767px) {
  .ot-vsp-photo__in img { max-width: 100%; max-height: 180px; }
  .ot-vsp-top { gap: 14px; }
}