:root {
  --bg: #0f1218; --bg2: #151a22; --panel: #1a2029; --panel2: #202834;
  --border: #2c3644; --text: #e8ecf3; --muted: #8b96a8;
  --accent: #4f8cff; --accent2: #6ea3ff; --danger: #ef5350; --ok: #34c77b; --warn: #f0b64c;
  --radius: 10px; --shadow: 0 10px 30px rgba(0,0,0,.45);
  --font: system-ui, 'Segoe UI', Roboto, sans-serif;
}
* { box-sizing: border-box; }
html, body { height: 100%; }
body { margin: 0; font-family: var(--font); background: var(--bg); color: var(--text); font-size: 14px; }
button { font-family: var(--font); }
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-thumb { background: var(--border); border-radius: 4px; }
::-webkit-scrollbar-track { background: transparent; }

/* ============ КНОПКИ ============ */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  padding: 9px 16px; border: 0; border-radius: 8px; background: var(--accent); color: #fff;
  font-size: 14px; font-weight: 500; cursor: pointer; transition: background .15s, transform .1s; text-decoration: none; }
.btn:hover { background: var(--accent2); }
.btn:active { transform: scale(.97); }
.btn-ghost { background: var(--panel2); color: var(--text); border: 1px solid var(--border); }
.btn-ghost:hover { background: var(--border); }
.btn-danger { background: var(--danger); }
.btn-danger:hover { background: #ff6b67; }
.btn-sm { padding: 6px 12px; font-size: 13px; }
.btn-block { width: 100%; }
.icon-btn { width: 30px; height: 30px; display: inline-flex; align-items: center; justify-content: center;
  border: 0; border-radius: 7px; background: transparent; color: var(--muted); cursor: pointer; font-size: 15px; transition: .15s; }
.icon-btn:hover { background: var(--border); color: var(--text); }

/* ============ ПОЛЯ ============ */
.field { margin-bottom: 14px; }
.field label { display: block; font-size: 12px; color: var(--muted); margin-bottom: 5px; }
.input, select.input, textarea.input { width: 100%; padding: 10px 12px; border-radius: 8px;
  border: 1px solid var(--border); background: var(--bg2); color: var(--text); font-size: 14px; font-family: var(--font); transition: border-color .15s; }
.input:focus { outline: none; border-color: var(--accent); }
textarea.input { resize: vertical; min-height: 60px; }

/* ============ СТРАНИЦА КАРТЫ ============ */
.map-page { display: flex; height: 100vh; overflow: hidden; }
#map { flex: 1; height: 100vh; background: var(--bg); }

#sidebar { width: 360px; min-width: 360px; height: 100vh; background: var(--panel);
  border-right: 1px solid var(--border); display: flex; flex-direction: column; z-index: 1000;
  transition: margin-left .25s ease; }
#sidebar.collapsed { width: 54px; min-width: 54px; }
#sidebar.collapsed .sb-head, #sidebar.collapsed .sb-body, #sidebar.collapsed .sb-foot { display: none; }
.sb-mini { display: none; flex-direction: column; align-items: center; gap: 6px; padding: 12px 0; height: 100vh; }
#sidebar.collapsed .sb-mini { display: flex; }
.sb-mini .icon-btn { width: 38px; height: 38px; font-size: 17px; background: var(--panel2); border: 1px solid var(--border); }
.sb-mini-spacer { flex: 1; }
.sb-mini-bottom { margin-bottom: 4px; }

.sb-head { display: flex; align-items: center; gap: 10px; padding: 14px 16px; border-bottom: 1px solid var(--border); }
.sb-logo { width: 34px; height: 34px; border-radius: 9px; background: linear-gradient(135deg, #4f8cff, #7c5cff);
  display: flex; align-items: center; justify-content: center; font-size: 17px; }
.sb-title { font-weight: 700; font-size: 16px; letter-spacing: .2px; flex: 1; }
.sb-title small { display: block; font-weight: 400; font-size: 11px; color: var(--muted); }

.sb-body { flex: 1; overflow-y: auto; padding: 14px 14px 20px; }

/* поиск */
.search-card { background: var(--panel2); border: 1px solid var(--border); border-radius: var(--radius); padding: 12px; margin-bottom: 14px; }
.search-card .sec-cap { margin-bottom: 8px; }
.search-row { display: flex; gap: 8px; }
.search-row .input { flex: 1; }
.lm-icon-prev { display: inline-flex; align-items: center; justify-content: center; min-width: 30px; }
.exp-prog { height: 8px; background: #e3e7ee; border-radius: 4px; overflow: hidden; margin-top: 8px; }
.exp-prog-fill { height: 100%; width: 0; background: #2f80ed; border-radius: 4px; transition: width .2s; }
.offline-banner { display: flex; align-items: center; justify-content: space-between; gap: 8px; background: #fff4e0; border: 1px solid #f0c36d; border-radius: 8px; padding: 7px 10px; font-size: 12px; margin-bottom: 8px; color: #5a4713; }
.offline-head { background: #fdf3e3; border-radius: 8px; color: #5a4713; }
.offline-head .fh-name, .offline-head .fh-cnt { color: #5a4713; }
.offline-head .fh-cnt { background: rgba(90, 71, 19, .12); }
.offline-head .fh-arrow { color: #8a6d1a; }
.offline-block { border: 1px dashed #e0b36a; border-radius: 8px; margin-bottom: 8px; }
.lc-perm.perm-local { background: #fdeecb; color: #8a6d1a; }
#search-result { font-size: 12px; color: var(--muted); line-height: 1.6; margin-top: 10px; display: none; }
#search-result.show { display: block; }
#search-result b { color: var(--text); }

.sec-cap { font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .8px; color: var(--muted); }

.layers-head { display: flex; align-items: center; justify-content: space-between; margin: 4px 2px 10px; }
.active-layer-hint { font-size: 12px; color: var(--accent2); background: rgba(79,140,255,.1);
  border: 1px dashed rgba(79,140,255,.4); border-radius: 8px; padding: 7px 10px; margin-bottom: 10px; }

/* карточка слоя */
.layer-card { background: var(--panel2); border: 1px solid var(--border); border-radius: var(--radius);
  padding: 10px 12px; margin-bottom: 8px; cursor: pointer; transition: border-color .15s; }
.layer-card:hover { border-color: #3d4a5c; }
.layer-card.active { border-color: var(--accent); box-shadow: 0 0 0 1px var(--accent) inset; }
.lc-top { display: flex; align-items: center; gap: 9px; }
.lc-color { width: 12px; height: 32px; border-radius: 4px; flex-shrink: 0; }
.lc-name { flex: 1; min-width: 0; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lc-name small { display: block; font-weight: 400; font-size: 11px; color: var(--muted); }
.lc-perm { font-size: 10px; font-weight: 600; padding: 3px 8px; border-radius: 20px; text-transform: uppercase; letter-spacing: .4px; }
.perm-owner { background: rgba(52,199,123,.15); color: var(--ok); }
.perm-edit { background: rgba(240,182,76,.15); color: var(--warn); }
.perm-view { background: var(--border); color: var(--muted); }
.lc-actions { display: flex; gap: 2px; margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--border); }
.lc-actions .spacer { flex: 1; }
.lc-vis { position: relative; width: 34px; height: 20px; flex-shrink: 0; align-self: center; }
.lc-vis input { display: none; }
.lc-vis span { position: absolute; inset: 0; background: var(--border); border-radius: 20px; transition: .2s; cursor: pointer; }
.lc-vis span::after { content: ''; position: absolute; top: 3px; left: 3px; width: 14px; height: 14px;
  background: #fff; border-radius: 50%; transition: .2s; }
.lc-vis input:checked + span { background: var(--accent); }
.lc-vis input:checked + span::after { left: 17px; }

/* подвал сайдбара */
.sb-foot { border-top: 1px solid var(--border); padding: 12px 16px; display: flex; align-items: center; gap: 10px; }
.sb-user { display: flex; align-items: center; gap: 9px; flex: 1; min-width: 0; }
.sb-avatar { width: 32px; height: 32px; border-radius: 50%; background: linear-gradient(135deg, #3a6ea5, #4f8cff);
  display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 14px; flex-shrink: 0; }
.sb-user span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 500; }
.sb-user small { display: block; color: var(--muted); font-size: 11px; font-weight: 400; }

/* кнопка сворачивания на карте */

/* координаты курсора */
#cursor-coords { position: fixed; bottom: 10px; left: 50%; transform: translateX(-50%); z-index: 900;
  background: rgba(15,18,24,.88); border: 1px solid var(--border); backdrop-filter: blur(6px);
  padding: 6px 14px; border-radius: 20px; font-size: 12px; color: var(--muted); pointer-events: none; white-space: nowrap; }

/* ============ МОДАЛЬНЫЕ ОКНА ============ */
.modal-overlay { position: fixed; inset: 0; background: rgba(5,8,12,.65); backdrop-filter: blur(3px);
  display: flex; align-items: center; justify-content: center; z-index: 5000; animation: fadeIn .15s; padding: 16px; }
.modal { background: var(--panel); border: 1px solid var(--border); border-radius: 14px; box-shadow: var(--shadow);
  width: 100%; max-width: 420px; max-height: 85vh; overflow-y: auto; animation: popIn .18s; }
.modal-head { display: flex; align-items: center; justify-content: space-between; padding: 16px 18px 0; }
.modal-head h3 { margin: 0; font-size: 16px; }
.modal-body { padding: 16px 18px; }
.modal-foot { display: flex; justify-content: flex-end; gap: 8px; padding: 0 18px 18px; }
@keyframes fadeIn { from { opacity: 0; } }
@keyframes popIn { from { opacity: 0; transform: translateY(10px) scale(.98); } }

.color-row { display: flex; gap: 8px; flex-wrap: wrap; }
.color-dot { width: 28px; height: 28px; border-radius: 8px; cursor: pointer; border: 2px solid transparent; transition: .15s; }
.color-dot.sel { border-color: #fff; transform: scale(1.1); }

.check-row { display: flex; align-items: center; gap: 9px; font-size: 14px; cursor: pointer; user-select: none; }
.check-row input { width: 16px; height: 16px; accent-color: var(--accent); }

.access-row { display: flex; align-items: center; gap: 8px; padding: 8px 0; border-bottom: 1px solid var(--border); font-size: 13px; }
.access-row:last-child { border-bottom: 0; }
.access-row .who { flex: 1; }
.access-row .tag2 { font-size: 11px; color: var(--muted); }

.export-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.export-opt { background: var(--panel2); border: 1px solid var(--border); border-radius: 10px; padding: 16px 8px;
  text-align: center; cursor: pointer; transition: .15s; }
.export-opt:hover { border-color: var(--accent); background: rgba(79,140,255,.08); }
.export-opt b { display: block; font-size: 15px; margin-bottom: 4px; }
.export-opt span { font-size: 11px; color: var(--muted); }

/* ============ ТОСТЫ ============ */
#toasts { position: fixed; top: 16px; right: 16px; z-index: 9000; display: flex; flex-direction: column; gap: 8px; }
.toast { background: var(--panel); border: 1px solid var(--ok); border-left-width: 4px; color: var(--text);
  padding: 11px 16px; border-radius: 10px; box-shadow: var(--shadow); font-size: 14px; max-width: 340px; animation: slideIn .2s; }
.toast-err { border-color: var(--danger); }
@keyframes slideIn { from { opacity: 0; transform: translateX(20px); } }

/* ============ ПОПАП ОБЪЕКТА ============ */
.leaflet-popup-content-wrapper { background: var(--panel); color: var(--text); border-radius: 12px; border: 1px solid var(--border); }
.leaflet-popup-tip { background: var(--panel); }
.leaflet-popup-content { margin: 12px 14px; font-family: var(--font); }
.feature-popup { min-width: 250px; }
.fp-name { width: 100%; padding: 8px 10px; margin-bottom: 7px; border-radius: 7px; border: 1px solid var(--border);
  background: var(--bg2); color: var(--text); font-weight: 600; font-family: var(--font); }
.fp-desc { width: 100%; min-height: 52px; padding: 8px 10px; margin-bottom: 8px; border-radius: 7px;
  border: 1px solid var(--border); background: var(--bg2); color: var(--text); font-family: var(--font); resize: vertical; }
.fp-coords { font-size: 11px; color: var(--muted); line-height: 1.7; background: var(--bg2);
  border-radius: 7px; padding: 7px 9px; margin-bottom: 9px; }
.fp-btns { display: flex; gap: 6px; }

/* ============ АВТОРИЗАЦИЯ ============ */
.auth-page { display: flex; align-items: center; justify-content: center; min-height: 100vh; padding: 16px;
  background: radial-gradient(1000px 500px at 70% -10%, rgba(79,140,255,.12), transparent), var(--bg); }
.auth-card { background: var(--panel); border: 1px solid var(--border); border-radius: 16px; padding: 34px;
  max-width: 400px; width: 100%; box-shadow: var(--shadow); }
.auth-logo { text-align: center; margin-bottom: 22px; }
.auth-logo .sb-logo { width: 52px; height: 52px; font-size: 26px; margin: 0 auto 12px; border-radius: 14px; }
.auth-logo h1 { margin: 0; font-size: 21px; }
.auth-logo p { margin: 5px 0 0; color: var(--muted); font-size: 13px; }
.auth-card .btn { margin-top: 8px; }
.auth-alt { text-align: center; margin-top: 18px; font-size: 13px; color: var(--muted); }
.auth-alt a { color: var(--accent2); text-decoration: none; }
.err { background: rgba(239,83,80,.12); border: 1px solid rgba(239,83,80,.5); color: #ff9d9b;
  padding: 10px 14px; border-radius: 9px; margin-bottom: 14px; font-size: 13px; }
.invite-status { font-size: 13px; padding: 10px 13px; border-radius: 9px; margin-bottom: 12px; display: none; }
.invite-status.ok-inv { display: block; background: rgba(52,199,123,.12); border: 1px solid rgba(52,199,123,.5); color: #7fe3ae; }
.invite-status.err { display: block; background: rgba(239,83,80,.12); border: 1px solid rgba(239,83,80,.5); color: #ff9d9b; }

/* ============ АДМИНКА ============ */
.admin-page { padding: 26px 18px; }
.admin-wrap { max-width: 1020px; margin: 0 auto; }
.admin-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 22px; }
.admin-head h1 { margin: 0; font-size: 21px; }
.admin-sec { background: var(--panel); border: 1px solid var(--border); border-radius: 14px; padding: 20px; margin-bottom: 18px; overflow-x: auto; }
.admin-sec h2 { margin: 0 0 16px; font-size: 16px; }
.admin-sec table { width: 100%; border-collapse: collapse; font-size: 13px; }
.admin-sec th { text-align: left; padding: 8px 10px; color: var(--muted); font-weight: 600; font-size: 11px;
  text-transform: uppercase; letter-spacing: .6px; border-bottom: 1px solid var(--border); }
.admin-sec td { padding: 9px 10px; border-bottom: 1px solid var(--border); }
.admin-sec tr:last-child td { border-bottom: 0; }
.admin-sec a { color: var(--accent2); }
.inv-code { background: var(--bg2); padding: 3px 9px; border-radius: 6px; letter-spacing: 1.5px; font-weight: 600; }
.tag { font-size: 11px; font-weight: 600; padding: 3px 9px; border-radius: 20px; }
.tag-active { background: rgba(52,199,123,.15); color: var(--ok); }
.tag-used { background: var(--border); color: var(--muted); }
.tag-exp { background: rgba(239,83,80,.15); color: var(--danger); }
.invite-create { display: flex; gap: 10px; align-items: flex-end; flex-wrap: wrap; margin-bottom: 16px; }
.invite-create .field { margin-bottom: 0; }
.invite-create .input { width: 110px; }
.new-invite { background: var(--bg2); border: 1px solid var(--accent); border-radius: 10px; padding: 14px;
  margin-bottom: 16px; display: grid; gap: 8px; font-size: 13px; }
.qr-box { background: #fff; color: #111; border-radius: 14px; padding: 26px; text-align: center; max-width: 320px; width: 100%; }
.qr-box .qr-link { font-size: 11px; word-break: break-all; margin: 14px 0; color: #444; }
.qr-box img, .qr-box canvas { margin: 0 auto; display: block; }

/* QR-модалка в админке */
#qr-modal { position: fixed; inset: 0; background: rgba(5,8,12,.65); backdrop-filter: blur(3px);
  display: flex; align-items: center; justify-content: center; z-index: 5000; animation: fadeIn .15s; padding: 16px; }

@media (max-width: 720px) {
  #sidebar { position: absolute; width: 320px; min-width: 320px; box-shadow: var(--shadow); }
  #cursor-coords { display: none; }
  /* тосты — снизу, чтобы не пересекаться с контролом слоёв Leaflet */
  #toasts { top: auto; bottom: 14px; left: 12px; right: 12px; align-items: stretch; }
  #toasts .toast { max-width: none; }
  /* контрол выбора подложки чуть ниже, не под кнопкой панели */
  .leaflet-top.leaflet-right { margin-top: 52px; }
}
.btn-mini { background: var(--panel2); color: var(--text); border: 1px solid var(--border); border-radius: 6px;
  padding: 3px 9px; cursor: pointer; font-size: 12px; transition: .15s; }
.btn-mini:hover { background: var(--border); }

/* ============ Таблица объектов слоя ============ */
.feat-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.feat-table th { text-align: left; padding: 7px 8px; color: var(--muted); font-size: 11px;
  text-transform: uppercase; letter-spacing: .5px; border-bottom: 1px solid var(--border); position: sticky; top: 0; background: var(--panel); }
.feat-table td { padding: 7px 8px; border-bottom: 1px solid var(--border); }
.feat-table tr:hover td { background: var(--panel2); cursor: pointer; }
.feat-table .ft-type, .feat-table .ft-coords { color: var(--muted); font-size: 11px; white-space: nowrap; }
.feat-table .ft-check { width: 28px; text-align: center; }
.feat-table .ft-check input { width: 15px; height: 15px; cursor: pointer; accent-color: var(--accent); }
.ft-toolbar { display: flex; gap: 8px; align-items: center; margin-bottom: 8px; }
.ft-toolbar .ft-filter { flex: 1; }
.ft-count { color: var(--muted); font-size: 12px; white-space: nowrap; }
.ft-bulk { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; margin-bottom: 8px;
  padding: 7px 9px; background: var(--panel2); border: 1px solid var(--border); border-radius: 10px; }
.ft-selinfo { font-size: 12px; color: var(--muted); margin-right: auto; }

/* ============ Цветной пин (divIcon) ============ */
.pin-marker { position: relative; width: 26px; height: 38px; }
.pin-marker .pin-body { position: absolute; top: 0; left: 0; width: 26px; height: 26px;
  border-radius: 50% 50% 50% 0; transform: rotate(-45deg); border: 2px solid rgba(0,0,0,.35);
  box-shadow: 0 2px 5px rgba(0,0,0,.4); }
.pin-marker .pin-dot { position: absolute; top: 8px; left: 8px; width: 10px; height: 10px;
  background: #fff; border-radius: 50%; opacity: .9; }

/* ============ Админка: значки ============ */
.icons-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)); gap: 10px; margin-top: 12px; }
.icon-card { background: var(--panel2); border: 1px solid var(--border); border-radius: 10px;
  padding: 12px 8px; text-align: center; position: relative; }
.icon-card .ic-prev { height: 44px; display: flex; align-items: center; justify-content: center; margin-bottom: 8px; }
.icon-card .ic-prev img { max-width: 40px; max-height: 44px; }
.icon-card .ic-name { font-size: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.icon-card .ic-del { position: absolute; top: 4px; right: 4px; }
.icon-card .ic-type { font-size: 10px; color: var(--muted); }

/* ============ Вкладки поиска ============ */
.search-tabs { display: flex; gap: 4px; margin-bottom: 8px; }
.stab { flex: 1; background: var(--panel2); color: var(--muted); border: 1px solid var(--border);
  border-radius: 8px; padding: 5px 8px; font-size: 12px; font-weight: 600; cursor: pointer; transition: .15s; }
.stab:hover { color: var(--text); }
.stab.active { background: var(--accent); border-color: var(--accent); color: #fff; }

/* результаты поиска объектов */
.sr-list { display: grid; gap: 6px; max-height: 300px; overflow-y: auto; }
.sr-item { display: flex; gap: 8px; align-items: flex-start; background: var(--panel2);
  border: 1px solid var(--border); border-radius: 8px; padding: 8px 10px; cursor: pointer; transition: .15s; }
.sr-item:hover { border-color: var(--accent); }
.sr-item .sr-dot { width: 10px; height: 10px; border-radius: 3px; margin-top: 4px; flex: none; }
.sr-item .sr-main { min-width: 0; display: grid; gap: 1px; font-size: 13px; }
.sr-item .sr-main b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sr-item .sr-main small { color: var(--muted); font-size: 11px; }
.sr-item .sr-desc { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ============ Папки слоёв ============ */
.folder-block { margin-bottom: 6px; }
.folder-head { display: flex; align-items: center; gap: 6px; padding: 7px 8px; border-radius: 9px;
  background: var(--panel2); border: 1px solid var(--border); cursor: pointer; user-select: none; transition: .15s; }
.folder-head:hover { border-color: var(--accent); }
.folder-head .fh-arrow { color: var(--muted); font-size: 11px; width: 10px; flex: none; }
.folder-head .fh-ico { font-size: 14px; flex: none; }
.folder-head .fh-name { flex: 1; min-width: 0; font-size: 13px; font-weight: 600;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.folder-head .fh-cnt { color: var(--muted); font-size: 11px; background: var(--bg2);
  border-radius: 20px; padding: 1px 8px; flex: none; }
.folder-head .fh-btn { font-size: 12px; padding: 2px 5px; }
.folder-body { padding: 6px 0 2px 14px; border-left: 2px solid var(--border); margin-left: 12px; display: grid; gap: 6px; }

/* ============ Цвет объекта в попапе ============ */
.fp-color-row { display: flex; gap: 6px; align-items: center; margin-bottom: 7px; flex-wrap: wrap; }
.fp-color-row .color-dot { width: 20px; height: 20px; border-radius: 50%; cursor: pointer;
  border: 2px solid transparent; transition: .15s; }
.fp-color-row .color-dot:hover { transform: scale(1.15); }
.fp-color-row .color-dot.sel { border-color: #fff; box-shadow: 0 0 0 2px var(--accent); }
.fp-color-custom { width: 26px; height: 26px; padding: 0; border: 1px solid var(--border);
  border-radius: 6px; background: var(--panel2); cursor: pointer; }
.fp-color-reset { font-size: 13px; padding: 2px 5px; }

/* ============ Мобильная адаптация (расширенная) ============ */
@media (max-width: 720px) {
  /* сайдбар не шире экрана */
  #sidebar { width: min(320px, 88vw); min-width: 0; }
  #sidebar.collapsed { width: 54px; min-width: 54px; }
  /* сдвиг контролов Leaflet вправо, чтобы не попадали под рейл меню */
  body.sb-collapsed .leaflet-left { margin-left: 56px; }
  /* попап объекта поуже */
  .feature-popup { min-width: 200px; }
  .leaflet-popup-content { margin: 10px 12px; }
  /* кнопки покрупнее под палец */
  .icon-btn { width: 34px; height: 34px; }
  /* действия слоя переносятся, если не влезают */
  .lc-actions { flex-wrap: wrap; row-gap: 4px; }
  /* модалки: меньше отступы, кнопки переносятся */
  .modal-overlay { padding: 10px; }
  .modal-foot { flex-wrap: wrap; }
  /* экспорт: аккуратнее на узком экране */
  .export-grid { gap: 8px; }
  .export-opt { padding: 12px 4px; }
  /* админка и таблицы: горизонтальный скролл */
  .admin-sec { overflow-x: auto; }
  .admin-sec table { min-width: 560px; }
  .admin-page { padding: 16px 10px; }
  .auth-card { padding: 24px 18px; }
  /* таблица объектов скроллится в обе стороны */
  .table-scroll { overflow-x: auto; }
  .feat-table { min-width: 460px; }
  /* приглашения: поля в колонку */
  .invite-create .input { width: 100%; }
}

/* ============ iOS / iPhone совместимость ============ */
body { -webkit-tap-highlight-color: transparent; -webkit-text-size-adjust: 100%; }
.map-page { height: 100vh; height: 100dvh; }
#map { height: 100vh; height: 100dvh; }
#sidebar { height: 100vh; height: 100dvh; }
.sb-mini { height: 100vh; height: 100dvh; }
.auth-page { min-height: 100vh; min-height: 100dvh; }
/* безопасные зоны (чёлка/индикатор iPhone) */
.sb-foot { padding-bottom: calc(12px + env(safe-area-inset-bottom)); }
.sb-mini-bottom { margin-bottom: calc(4px + env(safe-area-inset-bottom)); }
#toasts { bottom: auto; }
@media (max-width: 720px) {
  #toasts { bottom: calc(14px + env(safe-area-inset-bottom)); }
  .leaflet-bottom { margin-bottom: env(safe-area-inset-bottom); }
}

/* ==================== Тумблер прокси на карте ==================== */
.proxy-toggle {
  background: #fff;
  border-radius: 8px;
  box-shadow: 0 1px 5px rgba(0,0,0,.35);
  padding: 5px 10px;
  font: 13px/1.2 -apple-system, "Segoe UI", Roboto, sans-serif;
  clear: both;
}
.proxy-toggle, .proxy-toggle label { color: #1c2330; }
.proxy-toggle label { display: flex; align-items: center; gap: 6px; cursor: pointer; user-select: none; }
.proxy-toggle input { width: 15px; height: 15px; cursor: pointer; }

/* ==================== Вкладки админки ==================== */
.adm-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 14px 0 18px;
}
.adm-tab {
  border: 1px solid #d0d0d8;
  background: #fff;
  color: #1c2330;
  border-radius: 20px;
  padding: 8px 16px;
  font-size: 14px;
  cursor: pointer;
  transition: background .15s, color .15s;
}
.adm-tab:hover { background: #f0f0f5; color: #1c2330; }
.adm-tab.active { background: #3388ff; border-color: #3388ff; color: #fff; }
@media (max-width: 720px) {
  .adm-tabs { gap: 5px; }
  .adm-tab { padding: 7px 12px; font-size: 13px; }
}

/* ==================== Линейка ==================== */
.ruler-btn a {
  display: flex; align-items: center; justify-content: center;
  width: 34px; height: 34px; font-size: 17px; text-decoration: none;
  background: #fff; border-radius: 4px; color: #333;
}
.ruler-btn a:hover { background: #f4f4f4; }
.ruler-btn a.ruler-active { background: #ff3b30; }
.ruler-label {
  background: #ff3b30; color: #fff; font: bold 12px/1.4 sans-serif;
  padding: 3px 8px; border-radius: 12px; white-space: nowrap;
  box-shadow: 0 1px 4px rgba(0,0,0,.3);
}

/* ==================== Диапазон масштабов значка ==================== */
.ic-zoom {
  display: flex; flex-wrap: wrap; align-items: center; gap: 4px; margin-top: 6px;
  font-size: 11px; color: #777;
}
.ic-zoom label { flex-basis: 100%; }
.ic-zoom input {
  width: 44px; padding: 3px 4px; border: 1px solid #ccc; border-radius: 5px; color: #1c2330; background: #fff;
  font-size: 12px; text-align: center;
}

/* ==================== Группа «Доступные мне» ==================== */
.shared-head { background: #eef4ff; border-radius: 8px; }
.shared-head .fh-name { color: #1a56c4; font-weight: 600; }
.shared-block .folder-body { padding-left: 6px; border-left: 2px solid #c9dcff; margin-left: 10px; }

/* ==================== Страница объекта ==================== */
.fp-wrap { max-width: 980px; margin: 0 auto; padding: 16px; }
.fp-grid { display: grid; grid-template-columns: 1.2fr 1fr; gap: 16px; }
.fp-map-box { background: #fff; border-radius: 12px; box-shadow: 0 1px 4px rgba(0,0,0,.12); overflow: hidden; }
#fp-map { height: 420px; width: 100%; }
.fp-meta { margin: 4px 0 10px; }
.cm-item { border-bottom: 1px solid #eee; padding: 10px 2px; }
.cm-item:last-child { border-bottom: 0; }
.cm-head { display: flex; gap: 10px; align-items: center; font-size: 13px; margin-bottom: 3px; }
.cm-head span { color: #999; font-size: 12px; }
.cm-head .cm-del { margin-left: auto; }
.cm-text { font-size: 14px; white-space: pre-wrap; }
@media (max-width: 720px) {
  .fp-grid { grid-template-columns: 1fr; }
  #fp-map { height: 300px; }
}

/* ==================== Визуальный редактор ==================== */
.rte-toolbar {
  display: flex; flex-wrap: wrap; gap: 3px; align-items: center;
  background: #f4f4f6; border: 1px solid #ddd; border-bottom: 0;
  border-radius: 8px 8px 0 0; padding: 5px;
}
.rte-toolbar button {
  min-width: 30px; height: 28px; border: 0; border-radius: 5px; background: transparent;
  cursor: pointer; font-size: 13px; color: #333; padding: 0 6px;
}
.rte-toolbar button:hover { background: #e2e6ee; }
.rte-sep { width: 1px; height: 18px; background: #ccc; margin: 0 4px; }
.rte-area {
  min-height: 110px; max-height: 320px; overflow-y: auto;
  border: 1px solid #ddd; border-radius: 0 0 8px 8px; padding: 10px;
  font-size: 14px; background: #fff; color: #1c2330; outline: none;
}
.rte-area:focus { border-color: #3388ff; }
.rte-area img { max-width: 100%; }
#fp-desc img { max-width: 100%; }
#fp-desc blockquote { border-left: 3px solid #ccc; margin: 6px 0; padding-left: 10px; color: #555; }

/* ==================== Фотографии объекта ==================== */
.photo-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 12px; }
.photo-item { background: #fafafa; color: #1c2330; border: 1px solid #eee; border-radius: 10px; overflow: hidden; }
.photo-item img { width: 100%; height: 120px; object-fit: cover; display: block; }
.ph-cap { font-size: 13px; padding: 6px 8px 0; }
.ph-meta { display: flex; align-items: center; gap: 6px; font-size: 11px; color: #4a5568; padding: 4px 8px 7px; }
.ph-meta .ph-del { margin-left: auto; }
@media (max-width: 720px) {
  .photo-grid { grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); }
  .photo-item img { height: 100px; }
}

/* ==================== Кнопка-глаз видимости слоя ==================== */
.lc-eye { display: inline-flex; align-items: center; justify-content: center; color: #3388ff; }
.lc-eye svg { display: block; }
.lc-eye.off { color: #b3b3bb; }
.lc-eye:hover { background: #eef4ff; }
.lc-eye.off:hover { background: #f3f3f5; }

/* ==================== Контент страницы объекта ==================== */
.page-content { font-size: 15px; line-height: 1.55; }
.page-content img { max-width: 100%; border-radius: 8px; }
.page-content blockquote { border-left: 3px solid #3388ff; margin: 10px 0; padding: 4px 12px; background: #f6f9ff; color: #444; }
.page-content h2 { margin: 14px 0 8px; }

/* ==================== Панель редактирования геометрии ==================== */
#geom-edit-bar {
  position: fixed; top: 12px; left: 50%; transform: translateX(-50%);
  z-index: 1200; display: none; align-items: center; gap: 8px;
  background: #fff; color: #1c2330; border-radius: 24px; padding: 7px 14px;
  box-shadow: 0 2px 12px rgba(0,0,0,.3); font-size: 13px;
  max-width: calc(100vw - 24px); flex-wrap: wrap; justify-content: center;
}
@media (max-width: 720px) {
  #geom-edit-bar { top: auto; bottom: 90px; font-size: 12px; }
}

/* ==================== Иконки действий в попапе объекта ==================== */
.fp-btns { display: flex; gap: 4px; justify-content: flex-end; margin-top: 4px; }
.fp-act {
  width: 34px; height: 34px; font-size: 16px; border-radius: 8px;
  display: inline-flex; align-items: center; justify-content: center;
}
.fp-act:hover { background: #eef4ff; }
.fp-act-del:hover { background: #fde8e8; }

/* ==================== Выбор из пересекающихся объектов ==================== */
.pick-list { min-width: 210px; color: var(--text); }
.pick-title { font-size: 13px; color: var(--muted); margin-bottom: 6px; }
.pick-title b { color: var(--text); }
.pick-item {
  display: flex; align-items: center; gap: 8px; width: 100%;
  border: 0; background: none; padding: 7px 6px; border-radius: 7px;
  font-size: 14px; cursor: pointer; text-align: left; color: var(--text);
}
.pick-item:hover { background: var(--panel2); }
.pick-item i { color: var(--muted); }
.pick-dot { width: 12px; height: 12px; border-radius: 50%; flex-shrink: 0; border: 2px solid rgba(255,255,255,.7); box-shadow: 0 0 0 1px rgba(0,0,0,.3); }
.pick-name { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--text); }
.pick-type { font-size: 11px; color: var(--muted); flex-shrink: 0; max-width: 90px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ---------- Экспорт области ---------- */
.export-btn a { font-size: 15px; line-height: 26px; }
.exp-mode { display: flex; gap: 8px; flex-wrap: wrap; }
.exp-layer { display: flex; align-items: center; gap: 7px; padding: 4px 0; color: var(--text); font-weight: 400; cursor: pointer; }
.exp-layer input { accent-color: var(--accent, #4da3ff); }
.exp-layers { max-height: 180px; overflow-y: auto; border: 1px solid var(--border, #2c3644); border-radius: 8px; padding: 4px 10px; background: var(--panel2, #141a22); }

/* ---------- Профиль высот ---------- */
.elev-stats { display: flex; gap: 14px; flex-wrap: wrap; font-size: 13px; color: var(--text); margin-bottom: 8px; }
.elev-chart-wrap { position: relative; }
.elev-chart { width: 100%; max-width: 560px; border-radius: 8px; background: var(--panel2, #141a22); cursor: crosshair; }
.elev-tip { position: absolute; background: var(--panel); border: 1px solid var(--border, #2c3644); color: var(--text); border-radius: 6px; padding: 3px 8px; font-size: 12px; pointer-events: none; white-space: nowrap; }
.fp-elev { margin-top: 4px; }

.leaflet-bar a.tool-active { background: var(--accent, #4da3ff); color: #fff; }

/* ---------- Панель профиля высот снизу карты ---------- */
#elev-dock {
  position: absolute; left: 0; right: 0; bottom: 0; z-index: 1100;
  background: rgba(20,25,34,.97); backdrop-filter: blur(8px);
  border-top: 1px solid var(--border, #2c3644); color: var(--text);
  padding: 6px 14px calc(10px + env(safe-area-inset-bottom, 0px));
  box-shadow: 0 -4px 18px rgba(0,0,0,.35);
  max-height: 62vh; overflow-y: auto; box-sizing: border-box;
}
@media (max-width: 640px) {
  #elev-dock { padding: 5px 8px calc(10px + env(safe-area-inset-bottom, 0px)); }
  #elev-dock .elev-dock-row { gap: 6px; }
  #elev-dock .elev-stats { gap: 8px; font-size: 12px; }
  #elev-dock .elev-readout { width: 100%; text-align: left; font-size: 12px; }
  #elev-dock .elev-bh-in { width: 56px; }
}
.elev-dock-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 2px; }
.elev-dock-title { font-size: 13px; font-weight: 600; color: var(--text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.elev-dock-row { display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap; margin-bottom: 2px; }
.elev-dock-row .elev-stats { margin-bottom: 0; }
.elev-dock-row .elev-readout { margin-top: 0; }
#elev-dock .elev-chart { width: 100%; display: block; cursor: crosshair; }
#elev-dock .elev-chart-wrap { margin: 0; }
.elev-los { color: #ff9800; }

/* ---------- Профиль высот: произвольная линия и ползунок ---------- */
#profile-bar {
  position: fixed; top: 12px; left: 50%; transform: translateX(-50%);
  z-index: 1200; display: flex; align-items: center; gap: 8px;
  background: var(--panel); color: var(--text); border: 1px solid var(--border, #2c3644);
  border-radius: 24px; padding: 7px 14px;
  box-shadow: 0 2px 12px rgba(0,0,0,.3); font-size: 13px;
  max-width: calc(100vw - 24px); flex-wrap: wrap; justify-content: center;
}
.profile-btn a { font-size: 15px; line-height: 26px; }
.elev-readout { margin-top: 4px; font-size: 13px; color: var(--text); text-align: center; }
@media (max-width: 720px) {
  #profile-bar { top: auto; bottom: 90px; font-size: 12px; }
}
.elev-bh { display: inline-flex; align-items: center; gap: 5px; }
.elev-bh-in { width: 64px; padding: 2px 6px; }
.elev-verdict { color: #69db7c; font-weight: 600; }
.elev-verdict.blocked { color: #ff5252; }
.viewshed-btn a { font-size: 15px; line-height: 26px; }

/* ---------- Внутренняя почта и прокси ---------- */
.mail-tabs { display: flex; gap: 6px; margin-bottom: 10px; flex-wrap: wrap; }
.mail-row { display: flex; gap: 10px; align-items: baseline; padding: 7px 8px; border-bottom: 1px solid var(--border, #2c3644); cursor: pointer; border-radius: 6px; }
.mail-row:hover { background: var(--panel2, #141a22); }
.mail-row.unread .mail-subj { font-weight: 700; }
.mail-row.unread .mail-who::before { content: '● '; color: var(--accent, #4da3ff); }
.mail-who { min-width: 90px; color: var(--text); }
.mail-subj { flex: 1; color: var(--text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mail-date { color: var(--muted); font-size: 12px; white-space: nowrap; }
.mail-empty { color: var(--muted); text-align: center; padding: 18px 0; font-size: 13px; }
.mail-meta { font-size: 13px; color: var(--text); margin-bottom: 8px; }
.mail-text { background: var(--panel2, #141a22); border: 1px solid var(--border, #2c3644); border-radius: 8px; padding: 10px; font-size: 14px; color: var(--text); max-height: 300px; overflow-y: auto; }
.mail-file { margin-top: 8px; font-size: 13px; }
#mail-badge { position: absolute; top: -4px; right: -4px; background: #e53935; color: #fff; border-radius: 9px; font-size: 10px; line-height: 14px; min-width: 15px; text-align: center; padding: 0 3px; font-weight: 700; }
#btn-mail { position: relative; }
.px-row { border-bottom: 1px solid var(--border, #2c3644); padding: 8px 4px; }
.px-head { font-size: 13px; color: var(--text); margin-bottom: 6px; }
.px-btns { display: flex; gap: 6px; flex-wrap: wrap; }
.px-ok { color: #69db7c; } .px-fail { color: #ff6b6b; } .px-unknown { color: var(--muted); }
.px-warn { background: rgba(255,152,0,.12); border: 1px solid rgba(255,152,0,.45); color: var(--text); border-radius: 8px; padding: 8px 10px; font-size: 13px; margin-bottom: 10px; }
.px-log { background: var(--panel2, #141a22); border: 1px solid var(--border, #2c3644); border-radius: 8px; padding: 8px; font-size: 11px; color: var(--muted); max-height: 180px; overflow-y: auto; white-space: pre-wrap; margin-top: 10px; }

/* настройки шрифта подписей в диалоге экспорта */
.exp-label-opts { display: flex; align-items: center; gap: 8px; margin: 6px 0 0 24px; flex-wrap: wrap; }
.exp-label-opts .input { padding: 4px 8px; font-size: 13px; }
.exp-label-color { width: 40px; height: 30px; padding: 2px; }

/* отметки экстремумов рельефа */
.extrema-ic { font-size: 22px; line-height: 26px; text-align: center; text-shadow: 0 0 4px #fff, 0 0 4px #fff, 0 0 6px #fff; background: none; border: none; }
.extrema-ic.max { color: #d81e2c; }
.extrema-ic.min { color: #1565c0; }
.extrema-btn a { font-size: 16px; }

/* поворот значка точки */
.rot-icon { background: none; border: none; }
.fp-rot { display: flex; align-items: center; gap: 6px; margin-bottom: 7px; color: #1c2330; }
.fp-rot .fp-rot-r { flex: 1; min-width: 0; accent-color: #4da3ff; }
.fp-rot .fp-rot-n { width: 62px; padding: 3px 6px; }

/* таблица правил отображения по масштабам */
.zr-table td { padding: 3px 8px; }
.zr-table .zr-scale { width: 70px; padding: 2px 6px; }
.zr-table tr.zr-cur { background: rgba(77, 163, 255, .14); font-weight: 600; }
.zr-table input[type="checkbox"] { width: 17px; height: 17px; }

/* панель режима копирования */
#copy-bar { position: fixed; top: 10px; left: 50%; transform: translateX(-50%); z-index: 1200;
  background: #fff; border: 1px solid #d4dae3; border-radius: 10px; box-shadow: 0 4px 18px rgba(20,30,50,.18);
  padding: 8px 12px; display: flex; align-items: center; gap: 10px; color: #1c2330; font-size: 14px;
  max-width: calc(100vw - 20px); flex-wrap: wrap; }
#copy-bar b { color: #d81e2c; }

/* выбор значка при создании точки */
.nf-icon-row { display: flex; align-items: center; gap: 10px; }
.nf-icon-row select { flex: 1; }
.nf-icon-prev { width: 40px; height: 40px; display: flex; align-items: center; justify-content: center;
  border: 1px solid #d4dae3; border-radius: 8px; background: #f6f8fb; flex: none; }
.nf-icon-prev img { width: 32px; height: 32px; display: block; }
.nf-pin-prev { width: 18px; height: 18px; border-radius: 50% 50% 50% 0; transform: rotate(-45deg); display: block; }

/* панель режима B-сплайна */
#spline-bar { position: fixed; top: 10px; left: 50%; transform: translateX(-50%); z-index: 1200;
  background: #fff; border: 1px solid #d4dae3; border-radius: 10px; box-shadow: 0 4px 18px rgba(20,30,50,.18);
  padding: 8px 12px; display: flex; align-items: center; gap: 10px; color: #1c2330; font-size: 14px;
  max-width: calc(100vw - 20px); flex-wrap: wrap; }

/* GPS-метка местоположения */
.locate-ic { background: none; border: none; }
.locate-dot { width: 18px; height: 18px; border-radius: 50%; background: #2196f3; border: 3px solid #fff;
  box-shadow: 0 0 6px rgba(33,150,243,.8); margin: 2px; }
.locate-btn a.tool-active { background: #d6e9ff; }
.locate-btn a.tool-follow { background: #2196f3; color: #fff; }

/* панель инструментов в два ряда по категориям */
.leaflet-top.leaflet-right { max-width: calc(100vw - 12px); }
.gm-tb-row { display: flex; gap: 6px; justify-content: flex-end; align-items: flex-start;
  flex-wrap: wrap; margin: 0 10px 6px 0; clear: both; }
.gm-tb-row .leaflet-bar, .gm-tb-row .leaflet-control-layers, .gm-tb-row .proxy-toggle { margin: 0 !important; float: none; }
.gm-tb-row .leaflet-control-layers { flex: none; }
@media (max-width: 640px) {
  .gm-tb-row { gap: 4px; margin-right: 6px; }
}

/* надписи на карте (тип label) */
.gm-label-ic { pointer-events: auto; }
.gm-label-pos { transform: translate(-50%, -50%); white-space: nowrap; }
.gm-label { display: inline-block; padding: 1px 5px; border-radius: 4px; line-height: 1.25; cursor: pointer; }

/* кнопка надписи в панели рисования */
.label-draw-btn { background-image: none !important; display: block; text-align: center; text-decoration: none; }
.label-draw-btn.tool-active { background-color: #d6e9ff; }

/* кнопка B-сплайна в панели рисования */
.spline-draw-btn { background-image: none !important; /* убираем спрайт leaflet.draw — он давал «артефакты» */
  display: block; text-align: center; text-decoration: none; }
.spline-draw-btn.tool-active { background-color: #d6e9ff; }

/* общая панель «Слои»: подложка + оверлей (внизу справа, под кнопками zoom) */
.gm-bm-panel { display: flex; flex-direction: column; align-items: flex-end; gap: 6px; clear: both; }
.gm-bm-panel .gm-bm-btn { display: block; width: 34px; height: 34px; line-height: 34px; text-align: center;
  font-size: 17px; text-decoration: none; background: #fff; border-radius: 8px;
  box-shadow: 0 1px 5px rgba(0,0,0,.35); color: #1c2330; touch-action: manipulation; }
.gm-bm-panel.open .gm-bm-btn { background: #d6e9ff; }
.gm-bm-panel .gm-bm-pop { display: none; background: #fff; border-radius: 10px; box-shadow: 0 2px 10px rgba(0,0,0,.4);
  padding: 10px 12px; width: 210px; max-height: 55vh; overflow-y: auto; -webkit-overflow-scrolling: touch;
  font: 13px/1.35 -apple-system, "Segoe UI", Roboto, sans-serif; color: #1c2330; }
.gm-bm-panel.open .gm-bm-pop { display: block; }
.gm-bm-panel .gm-bm-sec { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .4px;
  color: #7a8699; margin: 6px 0 4px; }
.gm-bm-panel .gm-bm-sec:first-child { margin-top: 0; }
.gm-bm-panel .gm-bm-item { display: flex; align-items: center; gap: 7px; padding: 6px 4px; border-radius: 6px;
  cursor: pointer; min-height: 30px; }
.gm-bm-panel .gm-bm-item:hover { background: #f0f5fc; }
.gm-bm-panel .gm-bm-item input { accent-color: #4da3ff; width: 16px; height: 16px; margin: 0; }
.gm-bm-panel .gm-bm-ovsel { width: 100%; padding: 5px 6px; font-size: 13px; border: 1px solid #d4dae3;
  border-radius: 6px; background: #fff; min-height: 32px; }
.gm-bm-panel .gm-bm-oprow { display: flex; align-items: center; gap: 8px; margin-top: 6px; }
.gm-bm-panel .ovmap-op { flex: 1; accent-color: #4da3ff; height: 24px; }
.gm-bm-panel .ovmap-val { min-width: 38px; text-align: right; font-size: 12px; color: #4a5568; }
@media (max-width: 640px) {
  .gm-bm-panel .gm-bm-pop { width: 190px; max-height: 48vh; }
  .gm-bm-panel .gm-bm-btn { width: 38px; height: 38px; line-height: 38px; font-size: 19px; }
}

/* низкие экраны (iPhone/планшет в альбомной ориентации): правая колонка кнопок
   становится прокручиваемой, чтобы не наезжать на нижние кнопки (zoom/слои) */
@media (max-height: 520px) {
  .leaflet-top.leaflet-right {
    max-height: calc(100dvh - 120px);
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  .leaflet-top.leaflet-right::-webkit-scrollbar { display: none; }
  .leaflet-bottom.leaflet-right .leaflet-control-zoom a,
  .gm-bm-panel .gm-bm-btn { width: 32px; height: 32px; line-height: 32px; font-size: 16px; }
}

/* --- массовое добавление точек --- */
.bulk-hint { font-size: 12px; color: var(--muted, #8a94a6); margin-bottom: 8px; line-height: 1.5; }
.bulk-hint code { background: rgba(127,139,158,.15); padding: 0 4px; border-radius: 4px; }
#bulk-text { width: 100%; resize: vertical; font-family: monospace; font-size: 13px; box-sizing: border-box;
  background: var(--input-bg, #161c26); color: inherit; border: 1px solid var(--border, #2a3342); border-radius: 8px; padding: 8px; }
.bulk-order-row { margin: 8px 0; font-size: 13px; display: flex; align-items: center; gap: 8px; }
.bulk-preview { max-height: 200px; overflow: auto; font-size: 12px; }
.bp-row { padding: 3px 6px; border-radius: 6px; }
.bp-row small { color: var(--muted, #8a94a6); }
.bp-ok { color: #7fc97f; }
.bp-err { color: #e07070; }

/* --- наложение изображений --- */
.imgov-row { display: flex; align-items: center; gap: 6px; padding: 6px 4px; border-bottom: 1px solid var(--border, #2a3342); }
.imgov-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; }
.imgov-op { width: 90px; }
.imgov-h { background: #fff; border: 2px solid #2f80ed; border-radius: 50%; box-shadow: 0 1px 4px rgba(0,0,0,.5); cursor: grab; }
.imgov-h-corner { background: #2f80ed; border-color: #fff; }
.imgov-h-c { background: #ffce4f; border-color: #7a5b00; border-radius: 3px; }

/* --- Компактные кнопки для смартфонов с высокой плотностью пикселей (Galaxy S26 и т.п.) ---
   Кнопки в 1,5 раза меньше; transform не ломает спрайты иконок leaflet.draw */
@media (max-width: 768px) and (min-resolution: 2dppx) {
  .gm-tb-row > *,
  .leaflet-top.leaflet-right .leaflet-draw,
  .proxy-toggle {
    transform: scale(0.67);
    transform-origin: top right;
  }
  .leaflet-bottom.leaflet-right .leaflet-control-zoom,
  .gm-bm-panel {
    transform: scale(0.67);
    transform-origin: bottom right;
  }
  /* компенсируем правило «кнопки покрупнее под палец», иначе визуально остаются большими */
  .gm-bm-panel .gm-bm-btn { width: 30px; height: 30px; line-height: 30px; font-size: 15px; }
  .gm-tb-row { gap: 2px; margin-right: 4px; }
}

/* --- изображения: блок в слоях + панель привязки на карте --- */
.imgov-block { border: 1px dashed #b07fd4; }
.imgov-head .fh-name, .imgov-head .fh-cnt { color: #7b5b96; }
.imgov-head .fh-cnt { background: rgba(176,127,212,.15); }
.imgov-head .fh-arrow { color: #7b5b96; }
.imgov-editbar { position: fixed; left: 50%; bottom: calc(18px + env(safe-area-inset-bottom)); transform: translateX(-50%);
  z-index: 1200; display: flex; align-items: center; gap: 10px; padding: 8px 12px;
  background: var(--panel, #1a2230); border: 1px solid var(--border, #2a3342); border-radius: 12px;
  box-shadow: 0 4px 18px rgba(0,0,0,.45); max-width: min(92vw, 520px); }
.imgov-editbar .ie-name { font-size: 13px; font-weight: 600; max-width: 140px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.imgov-editbar .ie-cap { font-size: 11px; color: var(--muted, #8a94a6); }
.imgov-editbar .ie-op { flex: 1; min-width: 90px; accent-color: #b07fd4; }
.imgov-editbar .ie-opval { font-size: 12px; min-width: 36px; text-align: right; }
.imgov-editbar .ie-z { width: 46px; padding: 4px 6px; font-size: 12px; text-align: center;
  background: var(--bg, #11161f); color: inherit; border: 1px solid var(--border, #2a3342); border-radius: 7px; }
.imgov-editbar .ie-z:focus { border-color: #b07fd4; outline: none; }
@media (max-width: 720px) {
  .imgov-editbar .ie-cap { display: none; }
  .imgov-editbar .ie-name { max-width: 90px; }
}

/* warp-оверлей (свободная привязка по 4 углам) */
.imgov-warp { position: absolute; top: 0; left: 0; pointer-events: none; }
.imgov-warp img { position: absolute; top: 0; left: 0; pointer-events: none; user-select: none; }


/* ---------- Оповещения «Внимание!» ---------- */
.alert-pin { width: 26px; height: 26px; margin: 4px; border-radius: 50%;
  background: var(--apc, #e5534b); border: 2.5px solid #fff; box-sizing: border-box;
  display: flex; align-items: center; justify-content: center;
  animation: alert-pin-pulse 1.4s ease-out infinite; }
.alert-pin-ico { font-size: 13px; line-height: 1; filter: drop-shadow(0 1px 1px rgba(0,0,0,.5)); }
@keyframes alert-pin-pulse {
  0%   { box-shadow: 0 0 0 0 color-mix(in srgb, var(--apc, #e5534b) 65%, transparent), 0 2px 6px rgba(0,0,0,.4); transform: scale(1); }
  50%  { transform: scale(1.18); }
  70%  { box-shadow: 0 0 0 16px transparent, 0 2px 6px rgba(0,0,0,.4); }
  100% { box-shadow: 0 0 0 0 transparent, 0 2px 6px rgba(0,0,0,.4); transform: scale(1); }
}
.alert-pop-title { font-size: 14px; margin-bottom: 2px; }
.alert-pop-cat { font-size: 12px; font-weight: 600; margin-bottom: 4px; }
.alert-pop-meta { font-size: 11.5px; color: var(--muted, #8b939f); }
.alert-pop-btns { display: flex; gap: 6px; margin-top: 8px; flex-wrap: wrap; }
.alert-status-list { display: flex; flex-direction: column; gap: 6px; }
.alert-status-item { display: flex; gap: 8px; align-items: center; padding: 8px 11px;
  border: 1px solid var(--border, #2d333f); border-radius: 9px; cursor: pointer; font-size: 13.5px; }
.alert-status-item:has(input:checked) { border-color: var(--accent, #2f80ed); background: rgba(47,128,237,.08); }
.alert-status-item input { accent-color: var(--accent, #2f80ed); }
.alert-banner { position: fixed; top: 14px; left: 50%; transform: translateX(-50%);
  z-index: 2100; display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
  max-width: min(92vw, 620px); padding: 10px 16px; border-radius: 12px;
  background: #2a1512; border: 1.5px solid #e5534b; color: #ffe2df; font-size: 14px;
  box-shadow: 0 8px 28px rgba(0,0,0,.45); animation: alert-banner-in .35s ease-out; }
.alert-banner .alert-banner-btns { display: flex; gap: 8px; }
.alert-banner button { padding: 6px 14px; border-radius: 8px; font-size: 13px; cursor: pointer; border: 1px solid transparent; }
.alert-banner .btn-primary { background: #e5534b; color: #fff; border-color: #e5534b; }
.alert-banner .btn-ghost { background: transparent; color: #ffb4ad; border-color: rgba(229,83,75,.55); }
@keyframes alert-banner-in { from { opacity: 0; transform: translate(-50%, -14px); } to { opacity: 1; transform: translate(-50%, 0); } }
.nf-alert-row { display: flex; gap: 8px; align-items: flex-start; margin: 10px 0;
  padding: 9px 11px; border: 1px solid rgba(229,83,75,.5); border-radius: 10px;
  background: rgba(229,83,75,.07); font-size: 13px; cursor: pointer; }
.nf-alert-row input { margin-top: 2px; accent-color: #e5534b; width: 15px; height: 15px; }


/* ---------- Всплывающие уведомления (сверху экрана) ---------- */
.gm-notify { position: fixed; left: 50%; transform: translateX(-50%); z-index: 2050;
  display: flex; flex-direction: column; gap: 2px; max-width: min(92vw, 520px);
  padding: 10px 16px; border-radius: 12px; cursor: pointer;
  background: #14202e; border: 1.5px solid #2f80ed; color: #e6e8ee; font-size: 13.5px;
  box-shadow: 0 8px 28px rgba(0,0,0,.45); animation: gm-notify-in .3s ease-out; }
.gm-notify:hover { filter: brightness(1.15); }
.gm-notify b { font-size: 14px; }
.gm-notify span { color: #9aa4b2; font-size: 12.5px; }
@keyframes gm-notify-in { from { opacity: 0; transform: translate(-50%, -14px); } to { opacity: 1; transform: translate(-50%, 0); } }

/* ---------- Чат группы на главном экране ---------- */
#chat-panel { position: fixed; left: 56px; top: 0; bottom: 0; width: 340px; z-index: 1100;
  display: flex; flex-direction: column; background: var(--panel, #161b22);
  border-right: 1px solid var(--border, #2d333f); box-shadow: 4px 0 24px rgba(0,0,0,.35); }
.cp-head { display: flex; gap: 8px; align-items: center; padding: 10px;
  border-bottom: 1px solid var(--border, #2d333f); }
.cp-head .input { flex: 1; }
.cp-feed { flex: 1; overflow-y: auto; padding: 10px; display: flex; flex-direction: column; gap: 8px; }
.cp-msg { max-width: 88%; padding: 7px 11px; border-radius: 12px; font-size: 13.5px;
  background: var(--panel2, #1c2330); border: 1px solid var(--border, #2d333f); align-self: flex-start; }
.cp-msg.mine { align-self: flex-end; background: rgba(47,128,237,.16); border-color: rgba(47,128,237,.45); }
.cp-who { font-weight: 600; font-size: 12px; color: #d2a8ff; }
.cp-msg.mine .cp-who { color: #79b8ff; }
.cp-when { color: var(--muted, #9aa4b2); font-size: 10.5px; margin-left: 6px; }
.cp-in { display: flex; gap: 8px; padding: 10px; border-top: 1px solid var(--border, #2d333f); }
.cp-in .input { flex: 1; }
#btn-chat-mini { position: relative; }
#chat-dot { position: absolute; top: 4px; right: 4px; width: 9px; height: 9px;
  border-radius: 50%; background: #e5534b; }

/* ---------- Сворачивание инструментов карты ---------- */
/* колонка инструментов смещена вниз — кнопка 🛠 всегда выше неё */
.leaflet-top.leaflet-right { top: 52px; }
#btn-tools { position: fixed; top: 8px; right: 10px; z-index: 1250;
  width: 38px; height: 38px; border-radius: 8px; border: 1px solid var(--border, #2d333f);
  background: var(--panel, #161b22); color: var(--text, #e6e8ee); font-size: 17px; cursor: pointer;
  box-shadow: 0 2px 10px rgba(0,0,0,.35); }
#btn-tools:hover { filter: brightness(1.2); }
body.tools-collapsed .leaflet-top.leaflet-right { display: none; }

/* ---------- Карточка «Командная работа» ---------- */
.team-card { margin: 0 0 10px; border: 1px solid var(--border, #2d333f); border-radius: 10px;
  background: var(--panel2, #1c2330); overflow: hidden; }
.team-head { display: flex; align-items: center; gap: 6px; padding: 9px 12px;
  cursor: pointer; font-weight: 600; font-size: 13.5px; }
.team-head:hover { background: rgba(255,255,255,.03); }
.team-name { color: var(--muted, #9aa4b2); font-weight: 400; font-size: 12px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; flex: 1; }
.team-chev { color: var(--muted, #9aa4b2); }
.team-body { padding: 0 10px 10px; display: flex; flex-direction: column; gap: 7px; }
.team-btn { width: 100%; }
.team-note { color: var(--muted, #9aa4b2); font-size: 11.5px; line-height: 1.45; }

/* ---------- Конструктор значков (эмодзи-клавиатура) ---------- */
.emoji-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(38px, 1fr));
  gap: 4px; max-height: 300px; overflow-y: auto; padding: 2px; }
.emoji-cell { height: 38px; border-radius: 8px; border: 1px solid transparent;
  background: transparent; font-size: 20px; cursor: pointer; display: flex;
  align-items: center; justify-content: center; padding: 0; }
.emoji-cell:hover { background: rgba(47,128,237,.15); border-color: rgba(47,128,237,.4); }
.emoji-cell.lib-none { color: var(--muted, #9aa4b2); font-size: 18px; }
.emoji-pin { display: inline-flex; align-items: center; justify-content: center;
  background: #fff; border: 2px solid #2d333f; border-radius: 50%;
  box-shadow: 0 2px 6px rgba(0,0,0,.35); box-sizing: border-box; }

/* ---------- Диалог события ---------- */
.ev-all-row { display: flex; gap: 8px; align-items: center; cursor: pointer; margin-bottom: 6px; }
.ev-members { display: flex; flex-direction: column; gap: 4px; max-height: 180px; overflow-y: auto;
  padding: 8px 10px; border: 1px solid var(--border, #2d333f); border-radius: 9px; }
.ev-member { display: flex; gap: 8px; align-items: center; cursor: pointer; font-size: 13.5px; }
.ev-member input, .ev-all-row input { accent-color: #e5534b; }

/* Клавиатура эмодзи (админка) */
.emoji-pop { position:absolute; z-index:3000; background:#fff; border:1px solid #d7dce2; border-radius:12px; box-shadow:0 10px 30px rgba(20,30,40,.18); padding:8px; width:320px; }
.emoji-pop .emoji-grid { display:grid; grid-template-columns:repeat(9,1fr); gap:2px; max-height:260px; overflow-y:auto; }
.emoji-pop .emoji-cell { border:0; background:transparent; font-size:20px; line-height:1.5; border-radius:8px; cursor:pointer; padding:2px; }
.emoji-pop .emoji-cell:hover { background:#eef3f8; }

/* Конструктор значка: превью и фон */
.ip-prev-row { display:flex; align-items:center; gap:10px; margin-bottom:10px; padding:8px 10px;
               background:var(--panel2, #f2f5f8); border-radius:10px; }
.ip-prev { display:inline-flex; align-items:center; justify-content:center; min-width:38px; min-height:34px; }
.ip-bg-row { display:flex; align-items:center; gap:6px; flex-wrap:wrap; }
.ip-bg-cell { width:26px; height:26px; border-radius:50%; border:2px solid transparent; cursor:pointer; padding:0;
              box-shadow:inset 0 0 0 1px rgba(0,0,0,.18); }
.ip-bg-cell.on { border-color:#2f80ed; box-shadow:0 0 0 2px rgba(47,128,237,.3); }
.ip-bg-none { background:#fff; color:#666; font-size:14px; }
.ip-shape-row { display:inline-flex; gap:4px; margin-left:8px; }
.nf-icon-row { display:flex; align-items:center; gap:8px; }
.nf-icon-prev { display:inline-flex; align-items:center; justify-content:center; min-width:30px; min-height:28px; }

/* Событие: описание и вложение */
.alert-pop-desc { font-size:13px; margin:6px 0; white-space:pre-wrap; }
.alert-pop-photo { max-width:100%; max-height:180px; border-radius:8px; display:block; margin:6px 0; }
.alert-pop-file { display:inline-block; margin:6px 0; font-size:13px; }
.ev-attach-row { display:flex; align-items:center; gap:8px; }