/* ========================================== */
/* GENERIC OVERLAY (ОБЩЕЕ ОКНО)
/* ========================================== */
.action-overlay {
  position: fixed; inset: 0; z-index: 1500;
  display: none; background: transparent; -webkit-backdrop-filter: none; backdrop-filter: none;
  pointer-events: none;
}
.action-overlay.show { display: block; }

.overlay-card {
  position: absolute;
  top: calc(var(--page-pad) + env(safe-area-inset-top));
  bottom: calc(var(--page-pad) + var(--action-bar-height) + var(--action-bar-gap) + env(safe-area-inset-bottom));
  left: 50%; transform: translateX(-50%);
  width: calc(100% - (var(--page-pad) * 2)); max-width: var(--mobile-width);
  background: #16161b; border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 18px; box-shadow: 0 20px 50px rgba(0, 0, 0, 0.5);
  display: flex; flex-direction: column; overflow: hidden; pointer-events: auto;
}

.overlay-header {
  height: 52px; flex-shrink: 0; display: flex; align-items: center; justify-content: center;
  position: relative;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.06) 0%, rgba(255, 255, 255, 0.01) 100%);
  border-bottom: 1px solid rgba(255, 255, 255, 0.06); border-radius: 18px 18px 0 0;
  padding: 0 48px;
}
/* Per-overlay header accent line */
[data-action="a1"] .overlay-header { border-bottom-color: rgba(96, 165, 250, 0.2); padding-right: 86px; }
[data-action="a2"] .overlay-header { border-bottom-color: rgba(167, 139, 250, 0.2); padding-right: 86px; }
[data-action="a3"] .overlay-header { border-bottom-color: rgba(167, 139, 250, 0.25); background: linear-gradient(180deg, rgba(167,139,250,0.06) 0%, transparent 100%); padding-right: 86px; }
[data-action="a4"] .overlay-header { border-bottom-color: rgba(52, 211, 153, 0.2); }
[data-action="a5"] .overlay-header { border-bottom-color: rgba(78, 205, 196, 0.2); }

.overlay-title { 
  font-weight: 700; font-size: 16px; color: #fff;
  text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%;
}
/* Per-overlay title color */
[data-action="a1"] .overlay-title { color: #93bbfc; }
[data-action="a2"] .overlay-title { color: #c4b5fd; }
[data-action="a3"] .overlay-title { color: #c4b5fd; }
[data-action="a4"] .overlay-title { color: #6ee7a0; }
[data-action="a5"] .overlay-title { color: #7eddd6; }
.overlay-close {
  position: absolute; right: 12px; top: 50%; transform: translateY(-50%);
  width: 32px; height: 32px; border-radius: 8px; border: 1px solid rgba(231, 76, 60, 0.2);
  background: rgba(255, 255, 255, 0.08); color: #a0a0aa; font-size: 18px;
  display: flex; align-items: center; justify-content: center; cursor: pointer; z-index: 10;
}
.overlay-close { color: var(--c-danger); background: var(--c-danger-soft); }
.overlay-close:active { background: var(--c-danger); color: #fff; }
.overlay-content { flex: 1; overflow-y: auto; overflow-x: hidden; padding: 16px; color: #e8e8ec; box-sizing: border-box; }

/* ========================================== */
/* DOCK SYSTEM: Side-by-side panels (desktop) */
/* ========================================== */

/* Dock control group: 3-button layout toggle, hidden by default */
.dock-controls {
  display: none;
  position: absolute; left: 10px; top: 50%; transform: translateY(-50%);
  flex-direction: row; align-items: center;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 10px; overflow: hidden;
  z-index: 10;
}
.dock-btn {
  display: flex; align-items: center; justify-content: center;
  width: 36px; height: 28px; border: none;
  background: transparent; color: rgba(255,255,255,0.3);
  cursor: pointer; transition: all 0.2s ease;
  padding: 0; margin: 0;
}
.dock-btn + .dock-btn {
  border-left: 1px solid rgba(255,255,255,0.06);
}
.dock-btn:hover:not(.active) {
  background: rgba(96,165,250,0.1);
  color: rgba(96,165,250,0.7);
}
.dock-btn:active { opacity: 0.7; }
.dock-btn.active {
  background: linear-gradient(135deg, rgba(96,165,250,0.22), rgba(96,165,250,0.1));
  color: #60a5fa;
  box-shadow: inset 0 1px 0 rgba(96,165,250,0.15);
}

/* Show on wide screens */
@media (min-width: 1080px) {
  .dock-controls { display: flex; }
  .overlay-header { padding: 0 48px 0 130px; }
  [data-action="a1"] .overlay-header { padding-right: 86px; }
  [data-action="a2"] .overlay-header { padding-right: 86px; }
}

/* --- Docked overlay: same size, beside the main card --- */
.action-overlay.docked-left,
.action-overlay.docked-right {
  pointer-events: none;
  background: none !important;
  -webkit-backdrop-filter: none !important; backdrop-filter: none !important;
}
.action-overlay.docked-left .overlay-card,
.action-overlay.docked-right .overlay-card {
  pointer-events: auto;
  transform: none;
  width: calc(100% - (var(--page-pad) * 2));
  max-width: var(--mobile-width);
}

/* Left dock: right edge = left edge of main card minus gap */
.action-overlay.docked-left .overlay-card {
  left: auto;
  right: calc(50% + var(--mobile-width) / 2 + 12px);
}
/* Right dock: left edge = right edge of main card plus gap */
.action-overlay.docked-right .overlay-card {
  left: calc(50% + var(--mobile-width) / 2 + 12px);
  right: auto;
}



/* ========================================== */
/* A2: YANDEX DISK — NEW DESIGN
/* ========================================== */
.yd-overlay-content { padding: 0 !important; }

.yd-layout {
  display: flex; flex-direction: column; height: 100%; box-sizing: border-box;
}

/* --- Tabs --- */
.yd-tabs {
  display: flex; align-items: stretch;
  padding: 8px 8px 0; gap: 4px;
  flex-shrink: 0; position: relative;
}
.yd-tab {
  flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px;
  padding: 10px 8px 9px; border-radius: 12px 12px 0 0;
  border: none;
  background: rgba(255,255,255,0.02);
  color: #6b6490; font-size: 12px; font-weight: 700;
  cursor: pointer; transition: all 0.25s ease;
  position: relative;
  letter-spacing: 0.3px;
}
.yd-tab svg { width: 18px; height: 18px; transition: all 0.25s; }
.yd-tab:hover { color: #a89cc8; background: rgba(255,255,255,0.04); }
.yd-tab.active { background: rgba(255,255,255,0.06); }
.yd-tab::after {
  content: ''; position: absolute; bottom: 0; left: 15%; right: 15%;
  height: 3px; border-radius: 3px 3px 0 0;
  background: transparent; transition: all 0.3s ease;
}
.yd-tab--fav { border-bottom: 2px solid transparent; }
.yd-tab--fav.active { color: #fbbf24; border-bottom-color: rgba(251,191,36,0.15); }
.yd-tab--fav.active::after { background: #fbbf24; left: 10%; right: 10%; }
.yd-tab--fav.active svg { filter: drop-shadow(0 0 8px rgba(251,191,36,0.5)); }
.yd-tab--fav:hover { color: #d4a820; }
.yd-tab--staff { border-bottom: 2px solid transparent; }
.yd-tab--staff.active { color: #60a5fa; border-bottom-color: rgba(96,165,250,0.15); }
.yd-tab--staff.active::after { background: #60a5fa; left: 10%; right: 10%; }
.yd-tab--staff.active svg { filter: drop-shadow(0 0 8px rgba(96,165,250,0.5)); }
.yd-tab--staff:hover { color: #4a8ad4; }
.yd-tab--delivery { border-bottom: 2px solid transparent; }
.yd-tab--delivery.active { color: #34d399; border-bottom-color: rgba(52,211,153,0.15); }
.yd-tab--delivery.active::after { background: #34d399; left: 10%; right: 10%; }
.yd-tab--delivery.active svg { filter: drop-shadow(0 0 8px rgba(52,211,153,0.5)); }
.yd-tab--delivery:hover { color: #2ab580; }
.yd-tab-indicator { display: none; }

/* --- Toolbar --- */
.yd-toolbar {
  display: flex; align-items: stretch; gap: 4px;
  padding: 5px 8px;
  background: rgba(0,0,0,0.15);
  border-top: 1px solid rgba(255,255,255,0.04);
  border-bottom: 1px solid rgba(255,255,255,0.04);
  flex-shrink: 0;
}
.yd-tool-btn {
  flex: 1; display: flex; align-items: center; justify-content: center; gap: 5px;
  padding: 8px 6px; border-radius: 8px;
  border: 1px solid rgba(167,139,250,0.1);
  background: rgba(167,139,250,0.04);
  color: #9b8ec4; font-size: 10.5px; font-weight: 600;
  cursor: pointer; transition: all 0.2s; white-space: nowrap;
}
.yd-tool-btn:hover {
  background: rgba(167,139,250,0.12); border-color: rgba(167,139,250,0.22);
  color: #c4b5fd;
}
.yd-tool-btn:active { transform: scale(0.95); }
.yd-tool--back {
  color: #a78bfa;
}
.yd-tool--back:hover { background: rgba(167,139,250,0.15); color: #c4b5fd; }
.yd-tool--home {
  color: #a78bfa;
}
.yd-tool--home:hover { background: rgba(167,139,250,0.15); color: #c4b5fd; }
.yd-tool--fav {
  background: rgba(251,191,36,0.06); border-color: rgba(251,191,36,0.12);
  color: #d4a820;
}
.yd-tool--fav:hover {
  background: rgba(251,191,36,0.14); border-color: rgba(251,191,36,0.28);
  color: #fbbf24;
}
.yd-tool--gallery {
  background: rgba(78,205,196,0.06); border-color: rgba(78,205,196,0.12);
  color: #3dbdb5;
}
.yd-tool--gallery:hover {
  background: rgba(78,205,196,0.14); border-color: rgba(78,205,196,0.28);
  color: #4ECDC4;
}

/* --- Panels (folder lists) --- */
.yd-panel {
  flex: 1; overflow-y: auto; overflow-x: hidden;
  padding: 8px 10px; min-height: 0;
  display: flex; flex-direction: column; gap: 3px;
  scrollbar-width: thin; scrollbar-color: rgba(167,139,250,0.15) transparent;
}
.yd-panel:not(.active) { display: none !important; }

/* --- Favorites --- */
.fav-item {
  display: flex; align-items: center; gap: 8px;
  width: 100%; box-sizing: border-box; padding: 7px 10px;
  background: linear-gradient(135deg, rgba(251,191,36,0.05) 0%, rgba(251,191,36,0.02) 100%);
  border-radius: 9px; cursor: pointer;
  border: 1px solid rgba(251,191,36,0.08);
  transition: all 0.2s ease;
}
.fav-item:hover {
  background: linear-gradient(135deg, rgba(251,191,36,0.1) 0%, rgba(251,191,36,0.05) 100%);
  border-color: rgba(251,191,36,0.2);
  transform: translateY(-1px);
  box-shadow: 0 3px 10px rgba(0,0,0,0.15);
}
.fav-item:active { transform: scale(0.98); }
.fav-star-icon {
  color: #fbbf24; font-size: 12px; flex-shrink: 0;
  filter: drop-shadow(0 0 3px rgba(251,191,36,0.35));
}
.fav-text {
  font-size: 11.5px; color: #e8e0c8; text-align: left;
  line-height: 1.25; word-wrap: break-word; white-space: normal;
  font-weight: 500; flex: 1;
}

.fav-context-menu {
  position: fixed; z-index: 10000;
  background: rgba(18,16,28,0.97);
  -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px);
  border: 1px solid rgba(167,139,250,0.15);
  border-radius: 12px;
  padding: 4px; display: flex; flex-direction: column;
  box-shadow: 0 12px 36px rgba(0,0,0,0.5); min-width: 160px;
  overflow: hidden;
}
.fav-ctx-btn {
  background: none; border: none; color: #c8c4d8;
  padding: 10px 14px; font-size: 12.5px; text-align: left;
  cursor: pointer; border-radius: 8px; transition: all 0.15s;
}
.fav-ctx-btn:hover { background: rgba(167,139,250,0.08); color: #e0d8f8; }
.fav-ctx-btn.danger { color: #f87171; }
.fav-ctx-btn.danger:hover { background: rgba(239,68,68,0.08); }

/* --- Path bar (breadcrumb inside panel) --- */
.yd-path-bar {
  display: flex; align-items: center; flex-wrap: wrap; gap: 2px;
  padding: 8px 10px;
  background: rgba(0,0,0,0.2);
  border-radius: 10px;
  margin-bottom: 6px;
  flex-shrink: 0;
}
.yd-path-part {
  font-size: 11px; color: #8b82b0; font-weight: 500;
  cursor: pointer; padding: 2px 5px; border-radius: 5px;
  transition: all 0.15s;
}
.yd-path-part:hover { color: #c4b5fd; background: rgba(167,139,250,0.1); }
.yd-path-sep { color: rgba(167,139,250,0.2); font-size: 10px; padding: 0 1px; }
.yd-path-current {
  font-size: 11px; color: #e0d8f8; font-weight: 700;
  padding: 2px 5px;
}

/* --- Folder grid (file browser inside panel) --- */
.yd-folder-grid {
  display: flex; flex-direction: column; gap: 3px;
  animation: yd-fade-in 0.2s ease;
}
@keyframes yd-fade-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: translateY(0); } }

.yd-folder-card {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 12px; border-radius: 10px;
  background: linear-gradient(135deg, rgba(167,139,250,0.04) 0%, rgba(167,139,250,0.01) 100%);
  border: 1px solid rgba(167,139,250,0.07);
  cursor: pointer; transition: all 0.2s ease;
  width: 100%; box-sizing: border-box;
}
.yd-folder-card:hover {
  background: linear-gradient(135deg, rgba(167,139,250,0.1) 0%, rgba(167,139,250,0.04) 100%);
  border-color: rgba(167,139,250,0.2);
  transform: translateX(3px);
  box-shadow: 0 3px 12px rgba(0,0,0,0.18);
}
.yd-folder-card:active { transform: scale(0.98); }
.yd-file-card {
  opacity: 0.65;
  cursor: default;
}
.yd-file-card:hover { transform: none; box-shadow: none; opacity: 0.8; }
.yd-card-icon {
  width: 30px; height: 30px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
}
.yd-card-icon img {
  width: 28px; height: 28px; object-fit: contain;
  filter: drop-shadow(0 2px 4px rgba(0,0,0,0.3));
  transition: transform 0.2s;
}
.yd-folder-card:hover .yd-card-icon img { transform: scale(1.1); }
.yd-card-icon--file { color: #6b6490; }
.yd-card-name {
  font-size: 12.5px; color: #d0c8e8; font-weight: 600;
  line-height: 1.3; word-break: break-word; flex: 1;
  text-align: left;
}
.yd-folder-card:hover .yd-card-name { color: #e8e0ff; }
.yd-card-arrow {
  flex-shrink: 0; color: rgba(167,139,250,0.2);
  transition: all 0.2s;
}
.yd-folder-card:hover .yd-card-arrow { color: rgba(167,139,250,0.5); transform: translateX(2px); }

/* --- Loader --- */
.yd-folder-loader {
  display: flex; align-items: center; justify-content: center; gap: 8px;
  padding: 24px; color: #6b6490; font-size: 12px; font-weight: 500;
}
.yd-loader-spinner {
  width: 16px; height: 16px; border-radius: 50%;
  border: 2px solid rgba(167,139,250,0.1);
  border-top-color: rgba(167,139,250,0.5);
  animation: yd-spin 0.7s linear infinite;
}
@keyframes yd-spin { to { transform: rotate(360deg); } }

/* --- Empty state --- */
.yd-empty-state {
  width: 100%; display: flex; flex-direction: column;
  align-items: center; justify-content: center; gap: 4px;
  padding: 24px 12px;
}
.yd-empty-text {
  color: #5a5480; font-size: 12px; font-weight: 600;
}
.yd-empty-hint {
  color: #3e3a58; font-size: 10.5px; font-weight: 400;
}

/* ====== Upload Zone ====== */
.a2-upload-zone {
  width: 100%; display: flex; flex-direction: column;
  align-items: center; gap: 12px;
  padding: 12px;
  flex: 1;
  box-sizing: border-box;
}
.yd-upload-header {
  text-align: center; width: 100%;
}
.yd-upload-contractor {
  font-size: 16px; font-weight: 800; color: #e0d8f8;
  text-transform: uppercase; letter-spacing: 0.5px;
}
.yd-upload-date {
  font-size: 11px; color: #6b6490; font-weight: 500; margin-top: 2px;
}
.yd-upload-dropzone {
  width: 100%; flex: 1; min-height: 90px;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center; gap: 8px;
  border: 2px dashed rgba(167,139,250,0.15);
  border-radius: 14px;
  background: rgba(167,139,250,0.02);
  cursor: pointer;
  transition: all 0.25s ease;
  box-sizing: border-box;
}
.yd-upload-dropzone:hover {
  border-color: rgba(167,139,250,0.3);
  background: rgba(167,139,250,0.05);
}
.yd-upload-dropzone.drag-over {
  border-color: rgba(139,92,246,0.6);
  background: rgba(139,92,246,0.08);
  box-shadow: inset 0 0 30px rgba(139,92,246,0.06);
}
.yd-upload-icon {
  color: rgba(167,139,250,0.25);
  transition: all 0.25s;
}
.yd-upload-dropzone:hover .yd-upload-icon { color: rgba(167,139,250,0.45); transform: translateY(-2px); }
.yd-upload-dropzone.drag-over .yd-upload-icon { color: rgba(139,92,246,0.7); transform: translateY(-4px) scale(1.1); }
.yd-drop-title {
  font-size: 13px; font-weight: 700; color: #8b82b0;
}
.yd-drop-hint {
  font-size: 10.5px; color: #5a5480;
}
/* compact drop zone when gallery has items */
.yd-upload-dropzone.yd-drop-compact {
  min-height: 50px; flex: 0;
  padding: 10px;
}
.yd-drop-compact .yd-upload-icon { display: none; }
.yd-drop-compact .yd-drop-title { font-size: 11px; }
.yd-drop-compact .yd-drop-hint { font-size: 9.5px; }

/* pending counter */
.yd-pending-counter {
  font-size: 11px; font-weight: 700; color: #a78bfa;
  text-align: left; width: 100%; padding: 0 2px;
}

/* thumbnail gallery */
.yd-pending-gallery {
  display: flex; flex-wrap: wrap; gap: 6px;
  width: 100%; overflow-y: auto;
  max-height: 200px; padding: 2px;
  scrollbar-width: thin; scrollbar-color: rgba(167,139,250,0.15) transparent;
}
.yd-thumb {
  width: 64px; height: 64px; border-radius: 8px;
  overflow: hidden; position: relative;
  border: 1px solid rgba(167,139,250,0.12);
  background: rgba(0,0,0,0.3);
  flex-shrink: 0;
  animation: yd-fade-in 0.2s ease;
}
.yd-thumb img {
  width: 100%; height: 100%; object-fit: cover;
  display: block;
}
.yd-thumb-remove {
  position: absolute; top: 2px; right: 2px;
  width: 18px; height: 18px; border-radius: 50%;
  background: rgba(239,68,68,0.85); border: none;
  color: #fff; font-size: 10px; line-height: 1;
  cursor: pointer; display: flex;
  align-items: center; justify-content: center;
  opacity: 0; transition: opacity 0.15s;
  box-shadow: 0 1px 4px rgba(0,0,0,0.4);
}
.yd-thumb:hover .yd-thumb-remove { opacity: 1; }
.yd-thumb-remove:hover { background: rgba(239,68,68,1); transform: scale(1.15); }

/* upload go button */
.ya-upload-go-btn {
  width: 100%; padding: 12px 20px; border-radius: 12px;
  background: linear-gradient(135deg, #22c55e 0%, #16a34a 100%);
  border: none; color: #fff; font-size: 14px; font-weight: 700;
  cursor: pointer; transition: all 0.2s;
  box-shadow: 0 4px 16px rgba(34,197,94,0.25);
  display: flex; align-items: center; justify-content: center; gap: 8px;
}
.ya-upload-go-btn:hover {
  box-shadow: 0 6px 24px rgba(34,197,94,0.4);
  transform: translateY(-1px);
}
.ya-upload-go-btn:active { transform: scale(0.98); }
.ya-upload-go-btn.btn-loading {
  background: linear-gradient(135deg, #f59e0b, #d97706) !important;
  cursor: wait;
}
.ya-upload-go-btn.btn-success {
  background: linear-gradient(135deg, #22c55e, #16a34a) !important;
  cursor: default;
}

/* ====== Gallery Overlay ====== */
.ya-gallery-overlay {
  position: absolute; inset: 0; z-index: 11000;
  background: rgba(0,0,0,0.75);
  -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
  display: flex; align-items: center; justify-content: center;
  padding: 12px; border-radius: inherit;
}
.ya-gallery-card {
  width: 100%; max-width: 480px; max-height: 90%;
  background: rgba(16,14,24,0.97);
  border: 1.5px solid rgba(167,139,250,0.1);
  border-radius: 22px;
  box-shadow: 0 28px 72px rgba(0,0,0,0.6);
  display: flex; flex-direction: column; overflow: hidden;
}
.ya-gallery-header {
  display: flex; align-items: center;
  padding: 12px 14px;
  border-bottom: 1px solid rgba(167,139,250,0.06);
  background: rgba(167,139,250,0.02);
  flex-shrink: 0;
  gap: 8px;
}
.ya-gallery-title {
  flex: 1; min-width: 0;
  font-size: 14px; font-weight: 700; color: #d4c6ff;
  letter-spacing: 0.3px;
  text-align: center;
}
.ya-gallery-close {
  width: 30px; height: 30px; border-radius: 10px;
  background: rgba(239,68,68,0.06);
  border: 1px solid rgba(239,68,68,0.1);
  color: #f87171; font-size: 14px;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; transition: all 0.15s;
}
.ya-gallery-close:hover { background: rgba(239,68,68,0.65); color: #fff; }

/* Month navigation */
.ya-gallery-month-nav {
  display: flex; align-items: center; justify-content: center; gap: 14px;
  padding: 12px 16px 8px;
  flex-shrink: 0;
}
.ya-gnav-btn {
  width: 32px; height: 32px; border-radius: 10px;
  background: rgba(167,139,250,0.05);
  border: 1px solid rgba(167,139,250,0.08);
  color: #a78bfa; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: all 0.15s;
}
.ya-gnav-btn:hover {
  background: rgba(167,139,250,0.12);
  border-color: rgba(167,139,250,0.22);
}
.ya-gnav-btn:active { transform: scale(0.93); }
.ya-gnav-label {
  font-size: 14px; font-weight: 700; color: #c4b5fd;
  letter-spacing: 0.3px; min-width: 130px; text-align: center;
}

/* Day bar */
.ya-gallery-day-bar {
  display: flex; gap: 5px; padding: 8px 14px 6px;
  overflow-x: auto; flex-shrink: 0;
  scrollbar-width: none;
}
.ya-gallery-day-bar::-webkit-scrollbar { display: none; }
.ya-day-pill {
  min-width: 36px; height: 32px; border-radius: 10px;
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.04);
  color: #5a5480; font-size: 11.5px; font-weight: 600;
  cursor: pointer; transition: all 0.15s;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0; position: relative;
}
.ya-day-pill.has-photos {
  color: #c4b5fd;
  border-color: rgba(167,139,250,0.12);
  background: rgba(167,139,250,0.05);
}
.ya-day-pill.active {
  background: linear-gradient(135deg, rgba(167,139,250,0.28), rgba(139,92,246,0.18));
  border-color: rgba(167,139,250,0.35);
  color: #fff; box-shadow: 0 3px 12px rgba(139,92,246,0.2);
}
.ya-day-pill:hover:not(.active) {
  background: rgba(167,139,250,0.08);
  border-color: rgba(167,139,250,0.18);
  color: #d4c6ff;
}
.ya-day-count {
  position: absolute; top: -5px; right: -5px;
  min-width: 16px; height: 16px; border-radius: 8px;
  background: linear-gradient(135deg, #4ECDC4, #38A89D); color: #fff;
  font-size: 8px; font-weight: 700;
  display: flex; align-items: center; justify-content: center;
  padding: 0 4px; line-height: 1;
  box-shadow: 0 2px 6px rgba(78,205,196,0.3);
}
.ya-day-empty {
  color: #5a5480; font-size: 11px; font-weight: 500;
  padding: 4px 0; width: 100%; text-align: center;
}

/* Photo count */
.ya-gallery-count {
  padding: 2px 18px 6px;
  font-size: 11px; font-weight: 600; color: #5a5480;
  letter-spacing: 0.2px; text-align: center;
  min-height: 18px; flex-shrink: 0;
}

.ya-gallery-grid {
  flex: 1; overflow-y: auto; padding: 10px 14px 14px;
  display: grid; grid-template-columns: repeat(3, 1fr);
  grid-auto-rows: min-content;
  gap: 8px; align-content: flex-start;
  scrollbar-width: thin; scrollbar-color: rgba(167,139,250,0.12) transparent;
}
.ya-gallery-loading, .ya-gallery-empty {
  grid-column: 1 / -1;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center; gap: 10px;
  padding: 36px; color: #5a5480; font-size: 12px; font-weight: 500;
}
.ya-gallery-item {
  position: relative; width: 100%; padding-bottom: 100%;
  border-radius: 12px; overflow: hidden;
  background: rgba(0,0,0,0.25);
  border: 1px solid rgba(167,139,250,0.05);
  cursor: pointer; transition: all 0.2s;
}
.ya-gallery-item:hover {
  border-color: rgba(78,205,196,0.25);
  transform: scale(1.03);
  box-shadow: 0 6px 20px rgba(0,0,0,0.3);
}
.ya-gallery-item img {
  position: absolute; top: 0; left: 0;
  width: 100%; height: 100%; object-fit: cover;
  display: block;
}

/* ====== Gallery Header Dock Buttons ====== */
.ya-gallery-dock-group {
  display: none;
  flex-direction: row; align-items: center;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 10px; overflow: hidden;
  flex-shrink: 0;
}
.ya-gallery-dock-group .dock-btn + .dock-btn {
  border-left: 1px solid rgba(255,255,255,0.06);
}
@media (min-width: 1080px) {
  .ya-gallery-dock-group { display: flex; }
}

/* ---- Docked Gallery Panel ---- */
.ya-gallery-dock {
  position: fixed;
  top: calc(var(--page-pad, 8px) + env(safe-area-inset-top, 0px));
  bottom: calc(var(--page-pad, 8px) + var(--action-bar-height, 64px) + var(--action-bar-gap, 8px) + env(safe-area-inset-bottom, 0px));
  width: calc(100% - 16px);
  max-width: var(--mobile-width, 420px);
  z-index: 1550;
  pointer-events: auto;
  opacity: 0;
  transition: opacity 0.3s ease, transform 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}
.ya-dock-left {
  right: calc(50% + var(--mobile-width, 420px) / 2 + 12px);
  transform: translateX(-20px);
}
.ya-dock-right {
  left: calc(50% + var(--mobile-width, 420px) / 2 + 12px);
  transform: translateX(20px);
}
.ya-dock-center {
  left: 50%;
  transform: translateX(calc(-50% + 20px));
}
.ya-gallery-dock.show.ya-dock-left  { opacity: 1; transform: translateX(0); }
.ya-gallery-dock.show.ya-dock-right { opacity: 1; transform: translateX(0); }
.ya-gallery-dock.show.ya-dock-center { opacity: 1; transform: translateX(-50%); }
.ya-gallery-dock .ya-gallery-card {
  width: 100%; height: 100%;
  max-width: none; max-height: none;
  border-radius: 18px;
}

/* ====== Full Photo Viewer ====== */
.ya-photo-viewer {
  position: fixed; inset: 0; z-index: 12000;
  background: rgba(0,0,0,0.92);
  display: flex; align-items: center; justify-content: center;
}
.ya-viewer-img {
  max-width: 92vw; max-height: 88vh;
  object-fit: contain; border-radius: 10px;
  box-shadow: 0 12px 48px rgba(0,0,0,0.5);
  user-select: none; -webkit-user-drag: none;
}
.ya-viewer-close {
  position: absolute; top: 14px; right: 14px;
  width: 38px; height: 38px; border-radius: 12px;
  background: rgba(239,68,68,0.12);
  border: 1px solid rgba(239,68,68,0.15);
  color: #f87171; font-size: 18px;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; z-index: 10; transition: all 0.15s;
}
.ya-viewer-close:hover { background: rgba(239,68,68,0.65); color: #fff; }

.ya-viewer-nav {
  position: absolute; top: 50%; transform: translateY(-50%);
  width: 44px; height: 44px; border-radius: 12px;
  background: rgba(167,139,250,0.08);
  border: 1px solid rgba(167,139,250,0.12);
  color: #c4b5fd; cursor: pointer; z-index: 10;
  display: flex; align-items: center; justify-content: center;
  transition: all 0.2s;
}
.ya-viewer-nav:hover {
  background: rgba(167,139,250,0.22);
  color: #e0d4ff;
  box-shadow: 0 6px 20px rgba(167,139,250,0.15);
}
.ya-viewer-prev { left: 14px; }
.ya-viewer-next { right: 14px; }

.ya-viewer-counter {
  position: absolute; bottom: 18px; left: 50%; transform: translateX(-50%);
  padding: 8px 18px; border-radius: 22px;
  background: rgba(0,0,0,0.55);
  -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
  border: 1px solid rgba(255,255,255,0.06);
  color: #c8c4d8; font-size: 12px; font-weight: 600;
  letter-spacing: 0.5px;
}


/* Seamless Marquee Animation */
@keyframes marquee-seamless {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

.marquee-wrapper {
  overflow: hidden;
  white-space: nowrap;
  display: block;
  mask-image: linear-gradient(to right, transparent 0%, black 10%, black 90%, transparent 100%);
}

.marquee-inner {
  display: inline-flex;
  width: max-content; /* Fit content to allow scrolling */
  animation: marquee-seamless 12s linear infinite;
}

.marquee-inner span {
  padding-right: 50px; /* Seamless gap */
  display: inline-block;
}

/* Ensure marquee overrides override previous styles if needed */
.overlay-title.marquee-wrapper,
.a5-title.marquee-wrapper,
.est-modal-title.marquee-wrapper,
.est-item-name.marquee-wrapper,
.est-section-name.marquee-wrapper,
.est-category-title.marquee-wrapper {
  text-align: left; /* Reset center alignment when marquee is active */
  justify-content: flex-start;
  display: block; /* Ensure block for scrollWidth check */
}

/* Ensure flex parents handle block children correctly */
.est-edit-item .marquee-wrapper,
.est-section-name .marquee-wrapper,
.est-category-title .marquee-wrapper {
  flex: 1;
  min-width: 0; /* Critical for flexbox shrinking */
}
/* ========================================== */
/* A5 V2: ПЛАШКА БОТ — REDESIGN             */
/* ========================================== */

/* --- Field group (индикатор в каждом своем поле) --- */
.a5-form-v2 { display: flex; flex-direction: column; gap: 0; }

.a5-field-group {
  display: flex; flex-direction: column; gap: 10px;
  margin-bottom: 14px;
}

.a5-field {
  display: flex; align-items: center; gap: 12px;
  padding: 12px 12px;
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 14px;
  transition: border-color 0.25s, box-shadow 0.25s;
}
.a5-field:focus-within {
  border-color: var(--fc, rgba(78,205,196,0.3));
  box-shadow: 0 0 16px rgba(78,205,196,0.06);
}

.a5-field-icon {
  flex-shrink: 0;
  width: 32px; height: 32px;
  display: flex; align-items: center; justify-content: center;
  font-size: 18px; color: var(--fc, #4ECDC4);
  background: rgba(255,255,255,0.05);
  border-radius: 10px;
  text-shadow: 0 0 10px var(--fc, #4ECDC4);
  margin: 0;
}

.a5-field-body { flex: 1; min-width: 0; }
.a5-field-body label {
  display: block; font-size: 11px; font-weight: 700;
  color: var(--fc, #aaa); text-transform: uppercase;
  letter-spacing: 0.5px; margin-bottom: 4px;
}
.a5-field-body input,
.a5-field-body textarea {
  width: 100%; padding: 8px 10px; margin: 0;
  border-radius: 10px; border: 1px solid rgba(255,255,255,0.08);
  background: rgba(255,255,255,0.04); color: #fff;
  font-size: 15px !important; box-sizing: border-box;
  transition: border-color 0.2s, background 0.2s;
}
.a5-field-body input:focus,
.a5-field-body textarea:focus {
  border-color: var(--fc, #4ECDC4);
  background: rgba(255,255,255,0.08);
  outline: none;
}

/* Дата/Время: подпись и инпут в одну строку */
.a5-field-inline .a5-field-body {
  display: flex; align-items: center; gap: 10px;
}
.a5-field-inline .a5-field-body label {
  margin-bottom: 0; flex-shrink: 0; width: 56px;
}
.a5-field-inline .a5-field-body input { flex: 1; min-width: 0; }

.a5-field-date { align-items: flex-start; flex-wrap: wrap; }
.a5-field-date .a5-field-icon { margin-top: 4px; }
.a5-range-row {
  width: 100%;
  display: flex; align-items: center; gap: 12px;
  margin-top: 2px;
  box-sizing: border-box;
}
.a5-shuffle-btn {
  width: 98px; height: 26px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center; gap: 5px;
  border-radius: 6px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: rgba(255, 255, 255, 0.04);
  color: rgba(255, 255, 255, 0.4);
  cursor: pointer; transition: all 0.25s ease;
  font-size: 10px; font-weight: 600; padding: 0;
  white-space: nowrap;
}
.a5-shuffle-btn:hover {
  background: rgba(167, 139, 250, 0.1);
  border-color: rgba(167, 139, 250, 0.3);
  color: rgba(255, 255, 255, 0.7);
}
.a5-shuffle-btn.active {
  background: rgba(167, 139, 250, 0.15);
  border-color: rgba(167, 139, 250, 0.45);
  color: #a78bfa;
  box-shadow: 0 0 8px rgba(167, 139, 250, 0.15);
}
.a5-shuffle-icon { flex-shrink: 0; }
.a5-range-hint {
  flex: 1; min-width: 0;
  padding: 5px 10px;
  font-size: 11px; font-weight: 600; letter-spacing: 0.3px;
  color: rgba(78, 205, 196, 0.8);
  background: rgba(78, 205, 196, 0.06);
  border-left: 2px solid #4ECDC4;
  border-radius: 0 6px 6px 0;
  box-sizing: border-box;
}

/* Адрес: сверху индикатор + надпись «Адрес» слева, снизу поле на всю ширину */
.a5-field-address {
  display: flex; flex-direction: column; align-items: flex-start; gap: 8px;
  padding: 12px 12px;
  width: 100%; box-sizing: border-box;
}
.a5-field-address .a5-field-head {
  display: flex; flex-direction: row; align-items: center; gap: 10px;
  width: 100%;
}
.a5-field-address .a5-field-head .a5-field-icon { margin-right: 2px; }
/* --- Favorites row: selector + add + clear --- */
.a5-fav-row {
  display: flex; align-items: center; gap: 5px;
  flex: 1; min-width: 0;
}
.a5-fav-selector {
  flex: 1; min-width: 0; display: flex; align-items: center; gap: 6px;
  padding: 5px 10px; border-radius: 8px; cursor: pointer;
  border: 1px solid rgba(255,217,61,0.15);
  background: rgba(255,217,61,0.05);
  transition: all 0.2s; position: relative;
}
.a5-fav-selector:hover { background: rgba(255,217,61,0.1); border-color: rgba(255,217,61,0.3); }
.a5-fav-selector.open { background: rgba(255,217,61,0.12); border-color: rgba(255,217,61,0.4); }
.a5-fav-selector-label { color: #FFD93D; font-size: 12px; flex-shrink: 0; }
.a5-fav-selector-name {
  flex: 1; min-width: 0; font-size: 11px; font-weight: 600; color: #e8e8ec;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.a5-fav-selector-arrow { color: rgba(255,255,255,0.35); font-size: 10px; flex-shrink: 0; transition: transform 0.2s; }
.a5-fav-selector.open .a5-fav-selector-arrow { transform: rotate(180deg); }

.a5-fav-action-btn {
  flex-shrink: 0; padding: 5px 8px; border-radius: 8px;
  font-size: 11px; font-weight: 600; cursor: pointer;
  border: 1px solid rgba(255,255,255,0.1);
  background: rgba(255,255,255,0.04);
  transition: all 0.2s; white-space: nowrap;
}
.a5-fav-add-btn {
  color: #FFD93D; font-size: 12px; padding: 4px 8px;
  border-color: rgba(255,217,61,0.15);
  background: rgba(255,217,61,0.05);
}
.a5-fav-add-btn:hover { background: rgba(255,217,61,0.15); border-color: rgba(255,217,61,0.3); }
.a5-fav-clear-btn { color: var(--c-danger, #FF6B6B); }
.a5-fav-clear-btn:hover { background: rgba(255,107,107,0.12); border-color: rgba(255,107,107,0.3); }
.a5-fav-action-btn:active { transform: scale(0.95); }

/* Favorites dropdown — aligned to selector button */
.a5-fav-dropdown {
  position: absolute; top: 100%; left: 0;
  width: 100%; margin-top: 4px; z-index: 20;
  border-radius: 10px; overflow: hidden;
  border: 1px solid rgba(255,217,61,0.15);
  background: rgba(20,20,25,0.97);
  backdrop-filter: blur(12px);
  box-shadow: 0 8px 24px rgba(0,0,0,0.5);
}
.a5-fav-list { max-height: 160px; overflow-y: auto; }
.a5-fav-list::-webkit-scrollbar { width: 3px; }
.a5-fav-list::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.12); border-radius: 3px; }
.a5-fav-empty { padding: 12px; text-align: center; font-size: 12px; color: rgba(255,255,255,0.3); }
.a5-fav-item {
  display: flex; align-items: center; gap: 8px;
  padding: 8px 10px; cursor: pointer;
  border-bottom: 1px solid rgba(255,255,255,0.04);
  transition: background 0.15s;
}
.a5-fav-item:last-child { border-bottom: none; }
.a5-fav-item:hover { background: rgba(255,255,255,0.06); }
.a5-fav-item.active { background: rgba(255,217,61,0.06); }
.a5-fav-item-info { flex: 1; min-width: 0; }
.a5-fav-item-name {
  font-size: 12px; font-weight: 600; color: #e8e8ec;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.a5-fav-item.active .a5-fav-item-name { color: #FFD93D; }
.a5-fav-item-addr {
  font-size: 10px; color: rgba(255,255,255,0.35);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-top: 1px;
}
.a5-fav-item-del {
  flex-shrink: 0; width: 22px; height: 22px; border-radius: 6px;
  border: none; background: rgba(255,107,107,0.1);
  color: var(--c-danger, #FF6B6B); font-size: 13px; font-weight: 700;
  cursor: pointer; display: flex; align-items: center; justify-content: center;
  transition: all 0.15s; opacity: 0;
}
.a5-fav-item:hover .a5-fav-item-del { opacity: 1; }
.a5-fav-item-del:hover { background: var(--c-danger, #FF6B6B); color: #fff; }

/* Add favorite form */
.a5-fav-add-form { padding: 8px 10px; border-top: 1px solid rgba(255,255,255,0.06); }
.a5-fav-name-input {
  width: 100%; padding: 6px 10px; border-radius: 8px;
  border: 1px solid rgba(255,255,255,0.1);
  background: rgba(255,255,255,0.05);
  color: #e8e8ec; font-size: 12px;
  box-sizing: border-box; outline: none; transition: border-color 0.2s;
}
.a5-fav-name-input:focus { border-color: rgba(78,205,196,0.4); }
.a5-fav-add-btns { display: flex; gap: 6px; margin-top: 6px; }
.a5-fav-add-ok, .a5-fav-add-cancel {
  flex: 1; padding: 5px 0; border-radius: 8px;
  font-size: 11px; font-weight: 600; cursor: pointer;
  border: 1px solid rgba(255,255,255,0.1); transition: all 0.15s;
}
.a5-fav-add-ok { background: rgba(78,205,196,0.15); color: #4ECDC4; border-color: rgba(78,205,196,0.2); }
.a5-fav-add-ok:hover { background: rgba(78,205,196,0.25); }
.a5-fav-add-cancel { background: rgba(255,255,255,0.04); color: rgba(255,255,255,0.5); }
.a5-fav-add-cancel:hover { background: rgba(255,255,255,0.08); }

/* --- Info button & modal --- */
.a5-info-btn {
  position: absolute; right: 50px; top: 50%; transform: translateY(-50%);
  width: 28px; height: 28px; border-radius: 50%;
  border: 1px solid rgba(78,205,196,0.25);
  background: rgba(78,205,196,0.08);
  color: #4ECDC4; font-size: 15px; font-weight: 700;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; transition: all 0.2s; z-index: 10;
}
.a5-info-btn:hover { background: rgba(78,205,196,0.2); border-color: rgba(78,205,196,0.5); }

.est-edit-help-btn {
  position: absolute; right: 50px; top: 50%; transform: translateY(-50%);
}

.pr-help-btn {
  position: static; transform: none;
  width: 26px; height: 26px; font-size: 13px;
}

.a5-info-modal {
  position: absolute; inset: 0; z-index: 30;
  background: rgba(10,10,15,0.97);
  backdrop-filter: blur(12px);
  overflow-y: auto; padding: 20px;
}
.est-edit-card .a5-info-modal { z-index: 300; }
.a5-info-content { max-width: 400px; margin: 0 auto; }
.a5-info-title {
  font-size: 16px; font-weight: 700; color: #4ECDC4;
  margin-bottom: 16px; text-align: center;
}
.a5-info-section {
  margin-bottom: 14px; padding: 10px 12px;
  border-radius: 10px;
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.06);
}
.a5-info-heading {
  font-size: 13px; font-weight: 700; color: #e8e8ec;
  margin-bottom: 6px;
}
.a5-info-section p {
  font-size: 12px; color: rgba(255,255,255,0.6);
  line-height: 1.5; margin: 4px 0;
}
.a5-info-section b { color: rgba(255,255,255,0.85); }
.a5-info-close {
  display: block; width: 100%; padding: 10px 0;
  margin-top: 16px; border-radius: 10px;
  border: 1px solid rgba(78,205,196,0.25);
  background: rgba(78,205,196,0.1);
  color: #4ECDC4; font-size: 14px; font-weight: 600;
  cursor: pointer; transition: all 0.2s;
}
.a5-info-close:hover { background: rgba(78,205,196,0.2); }

.a5-field-address .a5-field-label {
  font-size: 11px; font-weight: 700;
  color: var(--fc, #aaa); text-transform: uppercase;
  letter-spacing: 0.5px; margin: 0;
  flex-shrink: 0; width: 56px;
}
.a5-field-address .a5-field-input-full {
  width: 100%; min-height: 96px; padding: 10px 12px; margin: 0;
  align-self: stretch; box-sizing: border-box;
  border-radius: 10px; border: 1px solid rgba(255,255,255,0.08);
  background: rgba(255,255,255,0.04); color: #fff;
  font-size: 15px !important; resize: none; overflow-y: auto;
  transition: border-color 0.2s, background 0.2s;
}
.a5-field-address .a5-field-input-full:focus {
  border-color: var(--fc, #4FC3F7);
  background: rgba(255,255,255,0.08);
  outline: none;
}

/* --- Segmented control v2 + Upload в одну строку, одна линия --- */
.a5-controls-row-v2 {
  display: flex; flex-direction: row; gap: 10px; align-items: center;
  margin-bottom: 14px;
}

.a5-seg-v2 {
  flex: 1; display: flex; flex-direction: row;
  height: 46px; min-height: 46px; max-height: 46px;
  box-sizing: border-box;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 12px; overflow: hidden;
}
.a5-seg-option {
  flex: 1; position: relative;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; color: #777; font-size: 13px; font-weight: 500;
  padding: 0 4px; margin: 0;
  transition: all 0.25s;
}
.a5-seg-option input { position: absolute; opacity: 0; width: 0; height: 0; }
.a5-seg-option:has(input:checked) {
  background: linear-gradient(135deg, rgba(78,205,196,0.25), rgba(69,183,209,0.2));
  color: #4ECDC4; font-weight: 700;
  text-shadow: 0 0 8px rgba(78,205,196,0.4);
}
.a5-seg-option + .a5-seg-option { border-left: 1px solid rgba(255,255,255,0.06); }

/* --- Upload button v2 — в одну линию с сегментом --- */
.a5-upload-v2 {
  flex: 1; display: flex; flex-direction: row; align-items: center; justify-content: center; gap: 8px;
  height: 46px; min-height: 46px; max-height: 46px; padding: 0 14px;
  box-sizing: border-box; margin: 0;
  background: linear-gradient(135deg, rgba(167,119,227,0.12), rgba(138,100,206,0.08));
  border: 1px dashed rgba(167,119,227,0.35);
  border-radius: 12px; color: #C9A0FF; font-size: 13px; font-weight: 600;
  transition: all 0.25s; cursor: pointer;
  line-height: 1; vertical-align: middle;
}
.a5-upload-v2:hover {
  background: linear-gradient(135deg, rgba(167,119,227,0.22), rgba(138,100,206,0.15));
  border-color: rgba(167,119,227,0.55);
}
.a5-upload-v2:active { transform: scale(0.97); }
.a5-upload-v2.drop-highlight {
  background: linear-gradient(135deg, rgba(78,205,196,0.2), rgba(96,165,250,0.15));
  border-color: rgba(78,205,196,0.6);
  color: #4ECDC4;
  box-shadow: 0 0 20px rgba(78,205,196,0.15), inset 0 0 12px rgba(78,205,196,0.06);
  animation: a5-drop-pulse 1.2s ease-in-out infinite;
}
@keyframes a5-drop-pulse {
  0%, 100% { border-color: rgba(78,205,196,0.6); }
  50% { border-color: rgba(78,205,196,0.3); }
}
.a5-upload-v2 input { display: none; }
.a5-upload-icon {
  font-size: 18px; font-weight: 300; line-height: 1;
}

/* --- Queue wrap + header + clear --- */
.a5-queue-wrap {
  margin-bottom: 12px;
  border-radius: 14px;
  background: rgba(255,255,255,0.02);
  border: 1px solid rgba(255,255,255,0.06);
  overflow: hidden;
}
.a5-queue-header {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  padding: 8px 10px 6px 12px;
  border-bottom: 1px solid rgba(255,255,255,0.05);
}
.a5-queue-title {
  font-size: 12px; font-weight: 600; color: rgba(255,255,255,0.5);
}
.a5-queue-clear {
  padding: 5px 10px; border-radius: 8px;
  border: 1px solid rgba(255,255,255,0.1);
  background: rgba(255,255,255,0.04);
  color: #FF8A8A; font-size: 12px; font-weight: 600;
  cursor: pointer; transition: all 0.2s;
}
.a5-queue-clear:hover {
  background: rgba(255,255,255,0.06);
  border-color: rgba(78,205,196,0.4);
  color: #ff6b6b;
}
.a5-queue-clear:active { transform: scale(0.97); }

.a5-queue-v2 {
  display: flex; overflow-x: auto; gap: 8px;
  padding: 10px 10px 10px 10px;
  min-height: 76px; align-items: center; justify-content: flex-start;
}
.a5-queue-v2::-webkit-scrollbar { height: 3px; }
.a5-queue-v2::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.15); border-radius: 3px; }

.a5-queue-item {
  position: relative; width: 64px; height: 64px; flex-shrink: 0;
  border-radius: 12px; overflow: hidden;
  border: 2px solid rgba(255,255,255,0.08);
  transition: border-color 0.2s, transform 0.2s;
}
.a5-queue-item:hover { border-color: rgba(167,119,227,0.5); transform: scale(1.05); }
.a5-queue-item img { width: 100%; height: 100%; object-fit: cover; }

.a5-queue-remove {
  position: absolute; top: 3px; right: 3px;
  width: 20px; height: 20px; border-radius: 50%; color: var(--c-danger);
  background: rgba(0,0,0,0.75); color: #4ECDC4; font-size: 14px; font-weight: 700;
  display: flex; justify-content: center; align-items: center;
  cursor: pointer; line-height: 1; transition: all 0.2s;
  -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px);
}
.a5-queue-remove:hover { background: var(--c-danger); color: #fff; transform: scale(1.15); }

/* --- Main button v2 --- */
.a5-btn-go {
  position: relative; overflow: hidden;
  width: 100%; padding: 14px; margin-top: 4px;
  border: none; border-radius: 14px;
  background: linear-gradient(135deg, #4ECDC4 0%, #45B7AA 50%, #3CA89D 100%);
  color: #1a0a0a; font-size: 15px; font-weight: 750;
  cursor: pointer; letter-spacing: 0.3px;
  box-shadow: 0 6px 20px rgba(78,205,196,0.2);
  transition: transform 0.15s, box-shadow 0.15s, filter 0.15s;
}
.a5-btn-go:hover { box-shadow: 0 8px 28px rgba(78,205,196,0.3); filter: brightness(1.05); }
.a5-btn-go:active { transform: translateY(1px); box-shadow: 0 4px 14px rgba(78,205,196,0.15); }
.a5-btn-go:disabled { opacity: 0.7; cursor: wait; }

.a5-btn-text { position: relative; z-index: 1; }

.a5-btn-progress {
  position: absolute; left: 0; top: 0; bottom: 0;
  width: 0; background: rgba(255,255,255,0.2);
  border-radius: 14px; transition: width 0.4s ease;
  pointer-events: none;
}

/* --- Result area v2: превью слева, галерея-полоска справа --- */
.a5-result-area-v2 {
  height: 340px; flex-shrink: 0;
  margin-top: 10px;
  min-width: 0;
}

.a5-preview-box-v2 {
  min-width: 0; height: 100%; position: relative;
  background: rgba(0,0,0,0.35); border-radius: 14px;
  border: 1px solid rgba(78,205,196,0.15);
  display: flex; align-items: center; justify-content: center; overflow: hidden;
  box-shadow: inset 0 0 30px rgba(0,0,0,0.2);
}
.a5-preview-box-v2 img { max-width: 100%; max-height: 100%; object-fit: contain; }

.a5-preview-counter {
  position: absolute; bottom: 8px; left: 50%; transform: translateX(-50%);
  padding: 3px 10px; border-radius: 10px;
  background: rgba(0,0,0,0.6); backdrop-filter: blur(6px);
  font-size: 11px; font-weight: 600; color: rgba(255,255,255,0.7);
  letter-spacing: 0.5px; pointer-events: none;
}

/* Gallery strip — CSS Grid locks arrows top/bottom */
.a5-gallery-strip {
  display: grid;
  grid-template-rows: 26px 1fr auto 26px;
  gap: 3px;
  min-width: 0; height: 100%; overflow: hidden;
}

.a5-gallery-arrow {
  width: 100%;
  border-radius: 10px; border: 1px solid rgba(255,255,255,0.08);
  background: rgba(255,255,255,0.04);
  color: rgba(255,255,255,0.45);
  font-size: 14px; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: all 0.2s;
}
.a5-gallery-arrow:hover {
  background: rgba(78,205,196,0.12);
  border-color: rgba(78,205,196,0.3);
  color: #4ECDC4;
}
.a5-gallery-arrow:active { transform: scale(0.95); }
.a5-gallery-arrow:disabled {
  opacity: 0.25; cursor: default; pointer-events: none;
}

.a5-gallery-counter {
  text-align: center;
  font-size: 10px; font-weight: 600; color: rgba(255,255,255,0.45);
  letter-spacing: 0.3px; line-height: 1; padding: 1px 0;
}

.a5-gallery-scroll {
  min-height: 0; max-height: 100%;
  display: flex; flex-direction: column; gap: 5px;
  overflow-y: auto; overflow-x: hidden;
  overscroll-behavior: contain;
  padding: 2px;
}
.a5-gallery-scroll::-webkit-scrollbar { width: 2px; }
.a5-gallery-scroll::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.12); border-radius: 2px; }

.a5-thumb {
  width: 100%; aspect-ratio: 1; border-radius: 10px;
  border: 2px solid transparent; background: rgba(255,255,255,0.03);
  overflow: hidden; cursor: pointer; opacity: 0.5;
  transition: opacity 0.2s, border-color 0.2s, transform 0.2s, box-shadow 0.2s;
  flex-shrink: 0;
}
.a5-thumb:hover { opacity: 0.85; border-color: rgba(255,255,255,0.15); }
.a5-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.a5-thumb.active {
  border-color: #4ECDC4; opacity: 1;
  box-shadow: 0 0 10px rgba(78,205,196,0.35);
}

/* --- Action buttons v2 --- */
.a5-actions-v2 {
  display: flex; flex-wrap: wrap; justify-content: center;
  flex-shrink: 0;
  gap: 8px; margin-top: 12px; margin-bottom: 6px;
}

.a5-action-btn {
  flex: 1; min-width: 90px;
  padding: 10px 8px; border-radius: 12px;
  border: 1px solid rgba(255,255,255,0.08);
  background: rgba(255,255,255,0.04);
  font-size: 13px; font-weight: 600; cursor: pointer;
  transition: all 0.2s; text-align: center;
}

.a5-action-btn[data-color="mint"] {
  color: #4ECDC4; border-color: rgba(78,205,196,0.2);
}
.a5-action-btn[data-color="mint"]:hover {
  background: rgba(78,205,196,0.12); border-color: rgba(78,205,196,0.4);
}

.a5-action-btn[data-color="violet"] {
  color: #C9A0FF; border-color: rgba(167,119,227,0.2);
}
.a5-action-btn[data-color="violet"]:hover {
  background: rgba(167,119,227,0.12); border-color: rgba(167,119,227,0.4);
}

.a5-action-btn[data-color="gold"] {
  color: #FFD93D; border-color: rgba(255,217,61,0.2);
}
.a5-action-btn[data-color="gold"]:hover {
  background: rgba(255,217,61,0.1); border-color: rgba(255,217,61,0.4);
}

.a5-action-btn:active { transform: translateY(1px); }

/* Button States for Submit */
#estSubmitBtn {
  transition: all 0.3s ease;
}

#estSubmitBtn.btn-processing {
  background: #f1c40f !important; /* Yellow */
  color: #1a1a1a !important;
  border-color: #f1c40f !important;
  cursor: wait;
}

#estSubmitBtn.btn-success {
  background: #2ecc71 !important; /* Green */
  color: #fff !important;
  border-color: #2ecc71 !important;
  cursor: default;
}

#estSubmitBtn.btn-error {
  background: #e74c3c !important; /* Red */
  color: #fff !important;
  border-color: #e74c3c !important;
}

/* (old A5 styles removed — replaced by A5 V2 above) */


/* ========================================== */
/* A3: CAMERA STYLES (UPDATED BORDERS)
/* ========================================== */

/* Контейнер камеры - ОБЩИЙ КОНТУР */
.camera-ui-container {
    display: flex;
    flex-direction: column;
    position: relative;
    background: #000;

    border-radius: 14px;
    overflow: hidden;

    /* >>> ИЗМЕНЕН��Е: Делаем рамку толще и ярче <<< */
    border: 2px solid rgba(255, 255, 255, 0.12);
    box-shadow: 0 0 25px rgba(78, 205, 196, 0.15); /* Легкое свечение */

    /* ФИКС ШИРИНЫ И ПРОПОРЦИЙ */
    width: 100%;
    max-width: 100%;
    height: auto;
    max-height: 100%;
    aspect-ratio: 3 / 4;

    margin: 0 auto;
    box-sizing: border-box;
}

@media (min-aspect-ratio: 3/4) {
    .camera-ui-container {
        height: 100%;
        width: auto;
    }
}

.camera-viewport {
    flex: 1;
    position: relative;
    background: #000;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
}

#camVideo { display: none; }

#camCanvas {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}

/* Панель действий (поверх видео) */
.camera-actions-row {
    position: absolute;
    bottom: 20px;
    left: 0;
    right: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 25px;
    z-index: 20;
    pointer-events: none;
    transition: bottom 0.1s linear;
}

.camera-actions-row > * {
    pointer-events: auto;
}

/* Кнопка затвора */
.camera-shutter-btn {
    position: relative;
    width: 72px; height: 72px;
    border-radius: 50%;
    border: 4px solid #fff;
    background: rgba(255, 255, 255, 0.2);
    cursor: pointer;
    transition: all 0.2s;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Кнопка ПОДТВЕРДИТЬ */
.camera-confirm-btn {
    position: relative;
    width: 72px; height: 72px;
    border-radius: 50%;
    border: 4px solid #2ecc71;
    background: rgba(46, 204, 113, 0.5);
    cursor: pointer;
    transition: all 0.2s;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}
.camera-confirm-btn::after {
    content: "✓";
    color: #fff;
    font-size: 32px;
    font-weight: 800;
}
.camera-confirm-btn:active {
    transform: scale(0.9);
    background: rgba(46, 204, 113, 0.8);
}
.camera-confirm-btn.loading::after {
    content: ""; /* Убираем галочку при загрузке, текст ставит JS */
}

.camera-shutter-btn.disabled {
    opacity: 0.6;
    border-color: rgba(255, 255, 255, 0.3);
    background: rgba(0, 0, 0, 0.5);
    cursor: default;
}
.camera-shutter-btn.disabled::after {
    content: "🔒"; font-size: 24px; opacity: 0.7;
}

.camera-shutter-btn:active:not(.disabled) { transform: scale(0.9); background: rgba(255, 255, 255, 0.5); }

.camera-shutter-btn.retake-mode {
    background: rgba(78, 205, 196, 0.4);
    border-color: rgba(255, 255, 255, 0.12);
    opacity: 1 !important;
    pointer-events: auto !important;
}
.camera-shutter-btn.retake-mode::after {
    content: "✕"; color: #fff; font-size: 28px; font-weight: 800;
}

.cam-action-btn.small {
    width: 44px; height: 44px;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, 0.3);
    background: rgba(0, 0, 0, 0.4);
    -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px);
    color: #fff;
    display: flex; align-items: center; justify-content: center;
    cursor: pointer;
    transition: background 0.2s;
}
.cam-action-btn.small svg { width: 22px; height: 22px; display: block; }
.cam-action-btn.small:active { background: rgba(255, 255, 255, 0.2); transform: scale(0.95); }
.cam-action-btn.small.active {
    background: rgba(255, 215, 0, 0.3);
    border-color: #ffd700;
    color: #ffd700;
    box-shadow: 0 0 15px rgba(255, 215, 0, 0.4);
}

/* Панель управления (внизу) - РАЗДЕЛИТЕЛЬ */
.camera-controls-bar {
    height: 80px;
    background: #16161b;

    /* >>> ИЗМЕНЕНИЕ: Четкая линия сверху, отделяющая кнопки от фото <<< */
    border-top: 2px solid rgba(255, 255, 255, 0.12);

    display: flex; align-items: center; justify-content: space-between;
    padding: 0 16px; gap: 10px; flex-shrink: 0;
    z-index: 60;
}

.cam-btn {
    display: flex; align-items: center; justify-content: center; text-align: center;
    border-radius: 10px; font-size: 11px; font-weight: 600; cursor: pointer;
    border: 1px solid rgba(255, 255, 255, 0.1); color: #e8e8ec; transition: all 0.2s;
    overflow: hidden; white-space: nowrap; text-overflow: ellipsis; user-select: none; line-height: 1.1; box-sizing: border-box; padding: 4px;
}
.cam-btn.attention-please {
    animation: pulseRed 0.5s ease-in-out 2;
    border-color: rgba(255, 255, 255, 0.12) !important;
    background: rgba(78, 205, 196, 0.15) !important;
    box-shadow: 0 0 10px rgba(78, 205, 196, 0.3);
}
@keyframes pulseRed { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.05); } }

.cam-btn.side { height: 40px; flex: 1; background: rgba(255, 255, 255, 0.05); }
.cam-btn.side.filled { color: #fff; border-color: #4ECDC4; background: rgba(78, 205, 196, 0.12); }
.cam-btn.side:active { background: rgba(255, 255, 255, 0.15); }

.cam-btn.center {
    height: 52px;
    flex: 1.8;
    flex-shrink: 0;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.06), rgba(78, 205, 196, 0.08));
    border: 1px solid rgba(78, 205, 196, 0.3);
    box-shadow: inset 0 0 10px rgba(78, 205, 196, 0.08);
    color: #fff; font-size: 14px; font-weight: 700;
    display: flex; flex-direction: column; justify-content: center;
}
.cam-btn.center span { display: block; width: 100%; overflow: hidden; text-overflow: ellipsis; margin: 0; }
.cam-btn.center::after { display: none; }

/* ... (Меню выбора остается без изменений) ... */
.cam-selection-overlay { position: fixed; inset: 0; z-index: 9999; background: rgba(0,0,0,0.6); -webkit-backdrop-filter: blur(2px); backdrop-filter: blur(2px); display: flex; align-items: flex-end; justify-content: center; }
.cam-selection-menu { width: 100%; max-width: var(--mobile-width); background: #1e1e24; border-radius: 16px 16px 0 0; max-height: 70vh; display: flex; flex-direction: column; animation: slideUp 0.3s ease-out; }
@keyframes slideUp { from { transform: translateY(100%); } to { transform: translateY(0); } }
.cam-sel-header { padding: 16px; text-align: center; font-weight: 700; color: #fff; border-bottom: 1px solid rgba(255,255,255,0.1); }
.cam-sel-list { flex: 1; overflow-y: auto; padding: 10px; }
.cam-sel-item { padding: 14px; border-bottom: 1px solid rgba(255,255,255,0.05); color: #ddd; cursor: pointer; text-align: left; font-size: 14px; }
.cam-sel-item:hover { background: rgba(255,255,255,0.05); }
.cam-sel-close { padding: 16px; background: rgba(231, 76, 60, 0.08); border: none; border-top: 1px solid rgba(231, 76, 60, 0.15); color: var(--c-danger); font-weight: 600; font-size: 15px; cursor: pointer; margin-top: auto; padding-bottom: calc(16px + env(safe-area-inset-bottom)); }

/* ===== Drop zone highlight ===== */
.drop-highlight {
  outline: 3px dashed rgba(102,207,255,0.6) !important;
  outline-offset: -3px;
  background: rgba(102,207,255,0.06) !important;
}

/* ========================================== */
/* SCHEDULE PANEL (unified zone)              */
/* ========================================== */

.sch-panel {
  display: flex; flex-direction: column;
  flex: 1; min-height: 0;
  border-radius: 16px;
  border: 1px solid rgba(78,205,196,0.1);
  background: linear-gradient(180deg, rgba(78,205,196,0.03) 0%, rgba(255,255,255,0.01) 50%, rgba(78,205,196,0.02) 100%);
  box-shadow: 0 2px 20px rgba(0,0,0,0.2), inset 0 1px 0 rgba(78,205,196,0.06);
  overflow: hidden;
  padding: 0 10px;
  box-sizing: border-box;
}

/* ========================================== */
/* SCHEDULE TOP NAV                           */
/* ========================================== */

.sch-top-nav {
  display: flex;
  align-items: stretch;
  gap: 5px;
  padding: 10px 0 8px;
  flex-shrink: 0;
}

.sch-nav-arrow {
  flex: 1;
  display: flex; align-items: center; justify-content: center;
  border-radius: 10px;
  border: 1px solid rgba(255,255,255,0.06);
  background: rgba(255,255,255,0.03);
  color: rgba(255,255,255,0.35);
  cursor: pointer;
  transition: all 0.2s;
  min-height: 42px;
}
.sch-nav-arrow:hover {
  background: rgba(78,205,196,0.08);
  color: rgba(78,205,196,0.8);
  border-color: rgba(78,205,196,0.15);
}
.sch-nav-arrow:active { transform: scale(0.96); }

.sch-nav-today {
  display: flex; align-items: center; justify-content: center;
  border-radius: 10px;
  border: 1px solid rgba(78,205,196,0.12);
  background: rgba(78,205,196,0.06);
  color: rgba(78,205,196,0.6);
  cursor: pointer;
  transition: all 0.2s;
  min-height: 42px;
  padding: 0 12px;
  font-size: 11px; font-weight: 700;
  letter-spacing: 0.3px;
  white-space: nowrap;
}
.sch-nav-today:hover {
  background: rgba(78,205,196,0.12);
  color: #4ECDC4;
  border-color: rgba(78,205,196,0.25);
}
.sch-nav-today:active { transform: scale(0.96); }

.sch-nav-center {
  position: relative;
  display: flex; align-items: center; justify-content: center;
  gap: 8px;
  padding: 6px 18px;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,0.08);
  background: rgba(255,255,255,0.04);
  color: rgba(255,255,255,0.7);
  cursor: pointer;
  transition: all 0.2s;
  white-space: nowrap;
}
.sch-nav-center:hover {
  background: rgba(255,255,255,0.07);
  border-color: rgba(78,205,196,0.2);
  box-shadow: 0 0 12px rgba(78,205,196,0.06);
}

.sch-cal-icon { opacity: 0.45; flex-shrink: 0; color: #4ECDC4; }
.sch-nav-center:hover .sch-cal-icon { opacity: 0.8; }

.sch-nav-date {
  font-size: 14px; font-weight: 700;
  color: rgba(255,255,255,0.65);
  letter-spacing: 0.3px;
}

/* ========================================== */
/* SCHEDULE TIMELINE                          */
/* ========================================== */

.schedule-zone {
  min-height: 0;
  padding: 0 !important;
  margin: 0;
  width: auto !important;
  border: 1px solid rgba(78,205,196,0.12) !important;
  border-radius: 14px !important;
  background: #0f1013 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.03), 0 4px 16px rgba(0,0,0,0.4) !important;
  overflow: hidden;
}

.schedule-scroll {
  flex: 1; min-height: 0;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  scrollbar-color: rgba(78,205,196,0.2) transparent;
}
.schedule-scroll::-webkit-scrollbar { width: 5px; height: 5px; }
.schedule-scroll::-webkit-scrollbar-track { background: transparent; }
.schedule-scroll::-webkit-scrollbar-thumb { background: rgba(78,205,196,0.25); border-radius: 3px; }
.schedule-scroll::-webkit-scrollbar-corner { background: transparent; }

.schedule-placeholder {
  display: flex; align-items: center; justify-content: center;
  min-height: 200px;
  color: rgba(255,255,255,0.3);
  font-size: 14px; font-weight: 500;
}

.schedule-body {
  padding: 0;
}

.sch-grid {
  display: grid;
  grid-template-columns: 52px 1fr;
  grid-template-rows: auto 1fr;
  min-width: 100%;
  width: max-content;
}

.sch-corner {
  position: sticky; top: 0; left: 0; z-index: 12;
  display: flex; align-items: center; justify-content: center;
  font-size: 12px; font-weight: 700;
  color: rgba(78,205,196,0.5);
  background: #141417;
  border-right: 1px solid rgba(255,255,255,0.06);
  border-bottom: 1px solid rgba(78,205,196,0.12);
}

.sch-header-places {
  display: flex;
  position: sticky; top: 0; z-index: 8;
  background: #141417;
  border-bottom: 1px solid rgba(78,205,196,0.12);
  box-shadow: 0 4px 12px rgba(0,0,0,0.5);
}
.sch-hdr-place {
  flex-shrink: 0;
  padding: 11px 8px;
  text-align: center;
  font-size: calc(11px * var(--gs, 1)); font-weight: 800;
  color: var(--pav-c, #999);
  letter-spacing: 0.5px;
  text-transform: uppercase;
  border-left: 1px solid rgba(255,255,255,0.04);
  white-space: nowrap;
  box-sizing: border-box;
  position: relative;
  background: color-mix(in srgb, var(--pav-c, #888) 4%, transparent);
}
.sch-hdr-place::after {
  content: '';
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 3px;
  background: var(--pav-c, #666);
  opacity: 0.5;
}

.sch-time-col {
  position: sticky; left: 0; z-index: 9;
  background: #121215;
  border-right: 1px solid rgba(78,205,196,0.08);
  box-shadow: 4px 0 12px rgba(0,0,0,0.35);
}
.sch-time-label {
  position: absolute; left: 0; width: 52px;
  height: 20px; line-height: 20px;
  margin-top: -10px;
  text-align: right; padding-right: 8px;
  font-size: 11px; font-weight: 700;
  color: rgba(78,205,196,0.4);
  letter-spacing: 0.3px;
  box-sizing: border-box;
  pointer-events: none;
  transition: color .2s;
}
.sch-time-label.now-hour {
  color: rgba(78,205,196,0.9);
  font-weight: 800;
}
.sch-time-tick {
  position: absolute; right: 0; width: 6px; height: 1px;
  background: rgba(78,205,196,0.15);
  pointer-events: none;
}

.sch-columns-area {
  position: relative;
  display: flex;
}

.sch-grid-lines {
  position: absolute; inset: 0;
  pointer-events: none; z-index: 0;
}
.sch-grid-line {
  position: absolute; left: 0; right: 0;
  height: 1px;
  background: rgba(255,255,255,0.07);
}
.sch-grid-line.half {
  background: transparent;
  border-top: 1px dashed rgba(255,255,255,0.03);
  height: 0;
}
.sch-zebra {
  position: absolute; left: 0; right: 0;
  background: rgba(255,255,255,0.012);
  pointer-events: none; z-index: 0;
}

.sch-col {
  flex-shrink: 0;
  position: relative; z-index: 1;
  border-left: 1px solid rgba(255,255,255,0.035);
  box-sizing: border-box;
}

.sch-event {
  position: absolute;
  left: 3px; right: 3px;
  padding: calc(4px * var(--gs, 1)) calc(6px * var(--gs, 1));
  box-sizing: border-box;
  border-radius: 7px;
  border: 1px solid rgba(255,255,255,0.07);
  border-left: 4px solid var(--pav-c, #888);
  background: linear-gradient(
    145deg,
    color-mix(in srgb, var(--pav-c) 14%, transparent) 0%,
    rgba(255,255,255,0.02) 100%
  );
  box-shadow: 0 1px 4px rgba(0,0,0,0.2),
              inset 0 1px 0 rgba(255,255,255,0.04);
  overflow: hidden;
  cursor: pointer;
  transition: all 0.2s;
  z-index: 2;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  text-align: center;
  animation: schEventIn .3s ease-out both;
}
.sch-event:hover {
  border-color: color-mix(in srgb, var(--pav-c) 50%, rgba(255,255,255,0.15));
  box-shadow: 0 6px 20px rgba(0,0,0,0.4),
              0 0 16px color-mix(in srgb, var(--pav-c) 22%, transparent);
  transform: translateY(-1px);
  z-index: 5;
}
.sch-event:active { transform: scale(0.98); }
@keyframes schEventIn {
  from { opacity: 0; transform: translateY(4px); }
  to { opacity: 1; transform: translateY(0); }
}

.sch-event-time {
  font-size: calc(9px * var(--gs, 1)); font-weight: 700;
  color: var(--pav-c, #aaa);
  letter-spacing: 0.2px;
  opacity: 0.9;
  white-space: nowrap;
  flex-shrink: 0;
}
.sch-event-name {
  font-size: calc(10px * var(--gs, 1)); font-weight: 500;
  color: rgba(255,255,255,0.88);
  line-height: 1.3;
  word-break: break-word;
  text-align: center;
  white-space: pre-line;
  min-width: 0;
}

.sch-now-marker {
  position: absolute;
  right: -7px;
  width: 14px; height: 14px;
  border-radius: 50%;
  background: #4ECDC4;
  border: 2px solid #0f1013;
  box-shadow: 0 0 12px rgba(78,205,196,0.7), 0 0 4px rgba(78,205,196,0.5);
  animation: schNowPulse 2s ease-in-out infinite;
  z-index: 11;
  pointer-events: none;
}
.sch-now-time {
  position: absolute;
  left: 4px; top: 50%; transform: translateY(-50%);
  font-size: 9px; font-weight: 800;
  color: #4ECDC4;
  background: #121215;
  padding: 1px 4px; border-radius: 3px;
  pointer-events: none; z-index: 11;
  white-space: nowrap;
  letter-spacing: 0.3px;
}
.sch-now-line {
  position: absolute;
  left: 0; right: 0;
  height: 2px;
  background: linear-gradient(90deg, rgba(78,205,196,0.6) 0%, rgba(78,205,196,0.3) 50%, rgba(78,205,196,0.6) 100%);
  box-shadow: 0 0 10px rgba(78,205,196,0.35);
  z-index: 2;
  pointer-events: none;
}
@keyframes schNowPulse {
  0%, 100% { box-shadow: 0 0 8px rgba(78,205,196,0.4), 0 0 4px rgba(78,205,196,0.3); transform: scale(1); }
  50% { box-shadow: 0 0 16px rgba(78,205,196,0.7), 0 0 6px rgba(78,205,196,0.5); transform: scale(1.15); }
}

/* Event detail popup */
.sch-event-popup {
  position: fixed; z-index: 9000;
  inset: 0;
  display: flex; align-items: center; justify-content: center;
  pointer-events: none; opacity: 0;
  background: rgba(0,0,0,0.4);
  transition: opacity .2s;
}
body:not(.no-blur) .sch-event-popup {
  backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
}
.sch-event-popup.show {
  pointer-events: auto; opacity: 1;
}
.sch-ep-card {
  background: rgba(24,26,32,0.97);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 12px 48px rgba(0,0,0,0.55), 0 0 0 1px rgba(255,255,255,0.05);
  min-width: 280px; max-width: 340px;
  transform: scale(0.92);
  transition: transform .2s;
}
.sch-event-popup.show .sch-ep-card { transform: scale(1); }
.sch-ep-color-bar {
  height: 5px; width: 100%;
}
.sch-ep-body {
  padding: 22px 24px 20px;
}
.sch-ep-name {
  font-size: 16px; font-weight: 700; color: #fff;
  line-height: 1.35; margin-bottom: 12px;
  word-break: break-word; white-space: pre-line;
}
.sch-ep-info {
  display: flex; flex-direction: column; gap: 8px;
}
.sch-ep-row {
  display: flex; align-items: center; gap: 10px;
}
.sch-ep-icon {
  font-size: 14px; flex-shrink: 0; width: 20px; text-align: center;
}
.sch-ep-label {
  font-size: 12px; color: rgba(255,255,255,0.45);
  min-width: 50px;
}
.sch-ep-val {
  font-size: 13px; font-weight: 600; color: rgba(255,255,255,0.85);
}

/* --- Filter buttons --- */
.sch-filters {
  display: flex; gap: 5px;
  padding: 8px 0 10px;
  flex-shrink: 0;
}
.sch-filter-btn {
  flex: 1;
}
.sch-filter-btn .filter-display {
  width: 100%; height: 36px;
  border-radius: 10px;
  border: 1px solid rgba(255,255,255,0.06);
  background: rgba(255,255,255,0.03);
  color: rgba(255,255,255,0.5);
  font-size: 11px; font-weight: 600;
  letter-spacing: 0.3px;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer;
  transition: all 0.2s;
  padding: 0 10px;
  box-sizing: border-box;
}
.sch-filter-btn .filter-display:hover {
  border-color: rgba(255,255,255,0.12);
  background: rgba(255,255,255,0.06);
  color: rgba(255,255,255,0.85);
}
.sch-filter-btn.active .filter-display,
.sch-filter-btn .filter-display:focus {
  border-color: rgba(78,205,196,0.3);
  background: rgba(78,205,196,0.06);
  box-shadow: 0 0 12px rgba(78,205,196,0.08);
  color: #fff;
}
/* Colored dots on filter labels */
#pavWrap .filter-display span::before,
#cPavWrap .filter-display span::before { content: ""; display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: #a78bfa; margin-right: 6px; vertical-align: middle; }
#placeWrap .filter-display span::before,
#cPlaceWrap .filter-display span::before { content: ""; display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: #4ECDC4; margin-right: 6px; vertical-align: middle; }
#cContrWrap .filter-display span::before { content: ""; display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: #60a5fa; margin-right: 6px; vertical-align: middle; }
.sch-filter-fav {
  flex: 0 0 40px;
}
.sch-filter-fav .filter-display {
  font-size: 16px;
  padding: 0;
  color: #FFD93D;
}

/* ========================================== */
/* WORK SCHEDULE                              */
/* ========================================== */

.wsch-panel {
  display: flex; flex-direction: column;
  flex: 1; min-height: 0;
  border-radius: 16px;
  border: 1px solid rgba(251,191,36,0.1);
  background: linear-gradient(180deg, rgba(251,191,36,0.02) 0%, rgba(255,255,255,0.01) 50%, rgba(251,191,36,0.02) 100%);
  box-shadow: 0 2px 20px rgba(0,0,0,0.2), inset 0 1px 0 rgba(251,191,36,0.06);
  overflow: hidden; padding: 0 10px; box-sizing: border-box;
}

.wsch-top {
  display: flex; align-items: center; gap: 6px;
  padding: 10px 0 8px; flex-shrink: 0;
}
.wsch-arrow {
  width: 36px; height: 36px; border-radius: 10px;
  border: 1px solid rgba(255,255,255,0.06);
  background: rgba(255,255,255,0.03);
  color: rgba(255,255,255,0.3);
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; transition: all 0.2s;
}
.wsch-arrow:hover { background: rgba(255,255,255,0.06); color: rgba(255,255,255,0.6); }
.wsch-month-label {
  font-size: 14px; font-weight: 700; color: rgba(255,255,255,0.6);
  white-space: nowrap; min-width: 120px; text-align: center;
}
.wsch-top-spacer { flex: 1; }
.wsch-search-slot {
  display: none;
  position: relative;
  width: 220px;
  flex-shrink: 0;
}
.wsch-search-slot.active {
  display: block;
}
.wsch-action-btn {
  height: 34px; border-radius: 10px; padding: 0 10px;
  border: 1px solid rgba(255,255,255,0.06);
  background: rgba(255,255,255,0.03);
  color: rgba(255,255,255,0.4);
  display: flex; align-items: center; gap: 6px;
  cursor: pointer; transition: all 0.2s; font-size: 11px; font-weight: 600;
}
.wsch-action-btn:hover { background: rgba(255,255,255,0.06); color: rgba(255,255,255,0.7); }
#wschEditBtn {
  border-color: rgba(251,191,36,0.15); color: rgba(251,191,36,0.6);
}
#wschEditBtn:hover { background: rgba(251,191,36,0.08); color: #fbbf24; }
#wschEditBtn span { font-size: 11px; }
.wsch-generate-btn { border-color: rgba(251,191,36,0.15); color: rgba(251,191,36,0.6); }
.wsch-generate-btn:hover { background: rgba(251,191,36,0.08); color: #fbbf24; }
.wsch-clear-btn { border-color: rgba(239,68,68,0.15); color: rgba(239,68,68,0.6); }
.wsch-clear-btn:hover { background: rgba(239,68,68,0.08); color: #ef4444; }

/* Top bar: view + filter + search */
.wsch-top-bar {
  display: flex; align-items: center; gap: 16px; flex-wrap: wrap;
  padding: 8px 0 10px; flex-shrink: 0;
  border-bottom: 1px solid rgba(255,255,255,0.06);
  margin-bottom: 4px;
}
.wsch-filter-group {
  display: flex; align-items: center; gap: 8px;
}
/* Bottom palette bar */
.wsch-palette-bar {
  flex-shrink: 0;
  border-top: 1px solid rgba(255,255,255,0.06);
  background: rgba(16,16,20,0.95);
  backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
}
.wsch-palette-tray {
  display: flex; align-items: flex-start; gap: 16px;
  padding: 8px 12px 10px;
  justify-content: center; flex-wrap: wrap;
}
.wsch-palette-section {
  display: flex; flex-direction: column; align-items: center; gap: 4px;
}
.wsch-palette-label {
  font-size: 8px; font-weight: 700; text-transform: uppercase;
  letter-spacing: 0.5px; color: rgba(255,255,255,0.2);
}
.wsch-palette-row {
  display: flex; align-items: center; gap: 3px;
}
.wsch-pal-btn {
  display: flex; flex-direction: column; align-items: center; gap: 2px;
  width: 44px; height: 42px; border-radius: 8px;
  border: 2px solid transparent;
  background: rgba(255,255,255,0.02);
  cursor: pointer; transition: all 0.15s;
  font-size: 14px; color: rgba(255,255,255,0.4);
  justify-content: center;
  padding: 3px 0;
}
.wsch-pal-btn:hover {
  background: rgba(255,255,255,0.06);
  border-color: rgba(255,255,255,0.08);
}
.wsch-pal-btn.active {
  background: rgba(255,255,255,0.08);
  border-color: rgba(251,191,36,0.4);
  box-shadow: 0 0 10px rgba(251,191,36,0.08);
}
.wsch-pal-name {
  font-size: 7px; font-weight: 700; letter-spacing: 0.2px;
  color: rgba(255,255,255,0.3); line-height: 1;
  text-transform: uppercase;
}
.wsch-pal-btn.active .wsch-pal-name {
  color: rgba(251,191,36,0.7);
}
.wsch-pal-dot {
  width: 14px; height: 14px; border-radius: 50%;
  background: var(--pal-c);
  box-shadow: 0 0 6px color-mix(in srgb, var(--pal-c) 40%, transparent);
  transition: transform 0.15s, box-shadow 0.15s;
}
.wsch-pal-btn:hover .wsch-pal-dot {
  transform: scale(1.15);
  box-shadow: 0 0 10px color-mix(in srgb, var(--pal-c) 60%, transparent);
}
.wsch-pal-btn.active .wsch-pal-dot {
  transform: scale(1.2);
  box-shadow: 0 0 14px color-mix(in srgb, var(--pal-c) 70%, transparent);
}
.wsch-pal-icon {
  font-size: 14px; line-height: 1;
}
.wsch-pal-eraser {
  color: rgba(239,68,68,0.5);
}
.wsch-pal-eraser:hover {
  color: rgba(239,68,68,0.8);
}
.wsch-pal-eraser.active {
  color: #ef4444;
  background: rgba(239,68,68,0.08);
  border-color: rgba(239,68,68,0.3);
}
.wsch-pal-eraser.active .wsch-pal-name {
  color: rgba(239,68,68,0.6);
}
body.wsch-paint-mode .wsch-matrix-cell.editable {
  cursor: crosshair;
}
.wsch-filter-column {
  position: relative;
}
.wsch-bar-label {
  font-size: 10px; font-weight: 700; color: rgba(255,255,255,0.35);
  text-transform: uppercase; letter-spacing: 0.5px;
}
.wsch-segment {
  display: flex; border-radius: 10px;
  background: rgba(0,0,0,0.35);
  padding: 2px; border: 1px solid rgba(255,255,255,0.06);
}
.wsch-seg-btn {
  padding: 6px 12px; border-radius: 8px;
  border: none; background: transparent;
  color: rgba(255,255,255,0.5);
  font-size: 12px; font-weight: 600;
  cursor: pointer; transition: all 0.2s;
}
.wsch-seg-btn:hover { color: rgba(255,255,255,0.8); }
.wsch-seg-btn.active {
  background: rgba(251,191,36,0.15);
  color: #fbbf24;
  box-shadow: 0 1px 3px rgba(0,0,0,0.2);
}
/* Search: выпадающее поле ввода под сегментом фильтра */
.wsch-search-wrap {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  margin-top: 6px;
  z-index: 200;
}
.wsch-search-wrap.active {
  display: block;
  animation: wsch-search-slide 0.15s ease;
}
@keyframes wsch-search-slide {
  from { opacity: 0; transform: translateY(-4px); }
  to { opacity: 1; transform: translateY(0); }
}
.wsch-search-wrap .wsch-search-input {
  width: 100%;
  height: 32px;
  padding: 0 12px;
  border-radius: 10px;
  background: rgba(0,0,0,0.5);
  border: 1px solid rgba(255,255,255,0.1);
  color: rgba(255,255,255,0.9);
  font-size: 12px;
  font-weight: 500;
  box-sizing: border-box;
  box-shadow: 0 4px 16px rgba(0,0,0,0.35);
  transition: background 0.2s, border-color 0.2s;
}
.wsch-search-wrap .wsch-search-input::placeholder { color: rgba(255,255,255,0.35); }
.wsch-search-wrap .wsch-search-input:focus {
  outline: none;
  background: rgba(0,0,0,0.6);
  border-color: rgba(251,191,36,0.3);
}
.wsch-search-wrap .wsch-search-results {
  margin-top: 4px;
  max-height: 200px;
  overflow-y: auto;
  border-radius: 10px;
  background: rgba(0,0,0,0.5);
  border: 1px solid rgba(255,255,255,0.08);
  box-shadow: 0 8px 24px rgba(0,0,0,0.45);
  display: none;
}
.wsch-search-results.show {
  display: block;
}
.wsch-search-item {
  padding: 10px 14px;
  font-size: 13px;
  color: rgba(255,255,255,0.9);
  cursor: pointer;
  transition: background 0.15s;
  border-bottom: 1px solid rgba(255,255,255,0.04);
}
.wsch-search-item:first-child { border-radius: 8px 8px 0 0; }
.wsch-search-item:last-child { border-bottom: none; border-radius: 0 0 8px 8px; }
.wsch-search-item:hover {
  background: rgba(251,191,36,0.1);
  color: #fbbf24;
}
.wsch-search-empty {
  padding: 12px 14px;
  font-size: 12px;
  color: rgba(255,255,255,0.45);
  font-style: italic;
}
.wsch-loading.wsch-no-link {
  font-size: 13px; line-height: 1.6;
  color: rgba(255,255,255,0.5);
}

/* Matrix view */
.wsch-matrix-wrap {
  border-radius: 10px;
  background: rgba(0,0,0,0.15);
  border: 1px solid rgba(255,255,255,0.04);
}
.wsch-matrix {
  border-collapse: separate;
  border-spacing: 0;
  font-size: 11px;
  min-width: 100%;
}
.wsch-matrix th, .wsch-matrix td {
  border-bottom: 1px solid rgba(255,255,255,0.04);
  border-right: 1px solid rgba(255,255,255,0.03);
  padding: 0;
  text-align: center;
  min-width: 26px; height: 26px;
  box-sizing: border-box;
}
.wsch-matrix-name-col {
  position: sticky; left: 0; z-index: 3;
  background: #131316;
  text-align: left !important;
  min-width: 130px; max-width: 150px;
  font-weight: 600; font-size: 10.5px;
  padding: 0 8px !important;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  border-right: 2px solid rgba(255,255,255,0.08) !important;
  box-shadow: 3px 0 8px rgba(0,0,0,0.4);
}
.wsch-matrix thead th {
  position: sticky; top: 0; z-index: 5;
  background: #131316;
  font-weight: 700; font-size: 10px;
  color: rgba(255,255,255,0.7);
  padding: 6px 0;
  border-bottom: 2px solid rgba(255,255,255,0.08) !important;
  box-shadow: 0 3px 8px rgba(0,0,0,0.3);
}
.wsch-matrix thead th:first-child {
  z-index: 6;
  background: #131316;
  border-right: 2px solid rgba(255,255,255,0.08) !important;
}
.wsch-matrix thead th.weekend {
  color: rgba(239,68,68,0.7);
}
.wsch-matrix thead th.today {
  color: rgba(251,191,36,1);
  background: #1a1810;
}
.wsch-matrix-day {
  font-variant-numeric: tabular-nums;
  line-height: 1;
}
.wsch-dow {
  display: block;
  font-size: 8px;
  font-weight: 600;
  opacity: 0.45;
  letter-spacing: 0.2px;
  margin-bottom: 2px;
}
.wsch-dnum {
  display: block;
  font-size: 11px;
  font-weight: 700;
}
.wsch-matrix thead th.weekend .wsch-dow {
  opacity: 0.6;
}
.wsch-matrix-pav-divider td {
  background: #131316 !important;
  border: none !important;
  height: 26px !important;
  padding: 0 !important;
}
.wsch-matrix-divider-name {
  background: #131316 !important;
  overflow: visible !important;
  max-width: none !important;
  min-width: 130px !important;
}
.wsch-matrix-pav-label {
  font-size: 10px; font-weight: 800;
  letter-spacing: 0.5px; text-transform: uppercase;
  padding: 4px 8px;
  display: inline-flex; align-items: center; gap: 6px;
  white-space: nowrap;
}
.wsch-matrix-pav-label .wsch-matrix-pav-dot {
  width: 6px; height: 6px; border-radius: 50%;
}
.wsch-matrix-cell {
  background: rgba(255,255,255,0.015);
  color: transparent;
  cursor: default;
  font-size: 10px;
  transition: background .15s;
  position: relative;
}
.wsch-matrix-cell.on {
  font-size: 0;
}
.wsch-matrix-cell.on::after {
  content: '';
  position: absolute; inset: 3px;
  border-radius: 4px;
}
.wsch-matrix-cell.on.wsch-matrix-pav-3::after {
  background: rgba(239,68,68,0.5);
  box-shadow: 0 0 4px rgba(239,68,68,0.2);
}
.wsch-matrix-cell.on.wsch-matrix-pav-7::after {
  background: rgba(59,130,246,0.5);
  box-shadow: 0 0 4px rgba(59,130,246,0.2);
}
.wsch-matrix-cell.on.wsch-matrix-pav-office::after {
  background: rgba(234,179,8,0.45);
  box-shadow: 0 0 4px rgba(234,179,8,0.2);
}
.wsch-matrix-cell.on.wsch-matrix-pav-reporter::after {
  background: rgba(255,255,255,0.4);
  box-shadow: 0 0 4px rgba(255,255,255,0.15);
}
.wsch-matrix-cell.unavail {
  background: rgba(239,68,68,0.05);
}
.wsch-matrix-cell.unavail::before {
  content: ''; position: absolute; inset: 0;
  background: repeating-linear-gradient(135deg, transparent, transparent 3px, rgba(239,68,68,0.08) 3px, rgba(239,68,68,0.08) 5px);
}
.wsch-matrix-cell.vacation {
  background: rgba(34,197,94,0.06);
}
.wsch-matrix-cell.vacation::before {
  content: ''; position: absolute; inset: 3px;
  border-radius: 4px;
  background: rgba(34,197,94,0.25);
  box-shadow: 0 0 4px rgba(34,197,94,0.15);
}
.wsch-matrix-cell.soft-unavail {
  background: rgba(168,85,247,0.04);
}
.wsch-matrix-cell.soft-unavail::before {
  content: ''; position: absolute; inset: 0;
  background: repeating-linear-gradient(135deg, transparent, transparent 3px, rgba(168,85,247,0.06) 3px, rgba(168,85,247,0.06) 5px);
}
.wsch-matrix-cell.today {
  border-color: rgba(251,191,36,0.25) !important;
  background: rgba(251,191,36,0.03);
}
.wsch-matrix-cell.editable {
  cursor: pointer;
}
.wsch-matrix-cell.editable:hover {
  background: rgba(255,255,255,0.08);
}
.wsch-matrix-cell.editable.on.wsch-matrix-pav-3:hover::after { background: rgba(239,68,68,0.7); }
.wsch-matrix-cell.editable.on.wsch-matrix-pav-7:hover::after { background: rgba(59,130,246,0.7); }
.wsch-matrix-cell.editable.on.wsch-matrix-pav-office:hover::after { background: rgba(234,179,8,0.65); }
.wsch-matrix-cell.editable.on.wsch-matrix-pav-reporter:hover::after { background: rgba(255,255,255,0.6); }
.wsch-matrix-my-row .wsch-matrix-name-col {
  background: #121916 !important;
  box-shadow: inset -3px 0 0 rgba(34,197,94,0.4), 3px 0 8px rgba(0,0,0,0.4);
}
.wsch-matrix-me-badge {
  font-size: 8px; font-weight: 800; color: #22c55e;
  background: rgba(34,197,94,0.12);
  padding: 1px 4px; border-radius: 3px;
  margin-left: 4px;
}
.wsch-matrix-my-cell.on::after {
  box-shadow: 0 0 0 1.5px rgba(34,197,94,0.6), 0 0 6px rgba(34,197,94,0.2) !important;
}
.wsch-matrix-shift-count {
  font-size: 9px; font-weight: 700; color: rgba(255,255,255,0.3);
  min-width: 20px; text-align: center;
}
.wsch-matrix-legend-item {
  display: inline-flex; align-items: center; gap: 4px;
}
.wsch-matrix-legend-dot {
  width: 8px; height: 8px; border-radius: 3px;
}

.wsch-body {
  flex: 1; min-height: 0; overflow-y: auto; overflow-x: auto;
  scrollbar-width: none;
}
.wsch-body::-webkit-scrollbar { display: none; }
/* Avatar circles */
.wsch-worker-av {
  width: 22px; height: 22px; min-width: 22px; min-height: 22px;
  border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 7.5px; font-weight: 700; letter-spacing: -0.3px;
  cursor: pointer; transition: transform 0.15s, box-shadow 0.15s;
  background-size: cover; background-position: center;
}
.wsch-worker-av:hover {
  transform: scale(1.15);
  box-shadow: 0 2px 8px rgba(0,0,0,0.3);
}
.wsch-av-3 {
  background-color: rgba(239,68,68,0.25);
  color: #fca5a5;
  border: 2px solid rgba(239,68,68,0.7);
}
.wsch-av-7 {
  background-color: rgba(59,130,246,0.25);
  color: #93c5fd;
  border: 2px solid rgba(59,130,246,0.7);
}
.wsch-av-office {
  background-color: rgba(234,179,8,0.25);
  color: #fde047;
  border: 2px solid rgba(234,179,8,0.7);
}
.wsch-av-reporter {
  background-color: rgba(255,255,255,0.15) !important;
  color: #fff !important;
  border: 2px solid rgba(255,255,255,0.7) !important;
  font-size: 7px; letter-spacing: -0.3px;
}
.wsch-worker-av.wsch-my-shift {
  box-shadow: 0 0 0 2px #22c55e, 0 2px 12px rgba(34,197,94,0.4);
  border-color: rgba(34,197,94,0.6);
}
.wsch-role-badge {
  font-size: 9px; font-weight: 600; color: rgba(168,85,247,0.7);
  margin-left: 4px;
}

/* Legend */
.wsch-legend {
  display: flex; gap: 14px; padding: 8px 0 10px;
  flex-shrink: 0; justify-content: center;
}
.wsch-legend-item { display: flex; align-items: center; gap: 5px; font-size: 10px; color: rgba(255,255,255,0.35); font-weight: 600; }
.wsch-dot { width: 8px; height: 8px; border-radius: 50%; }
.wsch-dot-pav3 { background: #ef4444; }
.wsch-dot-pav7 { background: #3b82f6; }
.wsch-dot-office { background: #eab308; }
.wsch-dot-reporter { background: #fff; border: 1px solid rgba(255,255,255,0.4); }
.wsch-dot-me { background: #22c55e; }
.wsch-dot-off { background: rgba(255,255,255,0.2); }

/* My Availability Button */
.wsch-avail-btn {
  display: flex; align-items: center; gap: 6px;
  padding: 6px 14px; border-radius: 10px;
  background: rgba(99,102,241,0.15); border: 1px solid rgba(99,102,241,0.3);
  color: #a5b4fc; font-size: 12px; font-weight: 600;
  cursor: pointer; transition: all 0.2s; white-space: nowrap;
  margin-left: auto; position: relative;
}
.wsch-avail-btn:hover { background: rgba(99,102,241,0.25); border-color: rgba(99,102,241,0.5); }
.wsch-avail-btn:active { transform: scale(0.97); }
.wsch-avail-badge {
  position: absolute; top: -5px; right: -5px;
  width: 16px; height: 16px; border-radius: 50%;
  background: #22c55e; color: #fff; font-size: 9px;
  display: flex; align-items: center; justify-content: center;
  font-weight: 700; line-height: 1;
}

/* Availability Modal */
.wsch-avail-overlay { z-index: 9999; }
.wsch-avail-modal {
  background: #1a1d23; border-radius: 18px;
  padding: 24px; width: 370px; max-width: 94vw;
  max-height: 90vh; overflow-y: auto;
  box-shadow: 0 20px 60px rgba(0,0,0,0.5), 0 0 0 1px rgba(255,255,255,0.08);
  animation: wsch-dialog-in 0.22s ease-out;
}
.wsch-avail-header { text-align: center; margin-bottom: 18px; }
.wsch-avail-title { font-size: 18px; font-weight: 700; color: #fff; }
.wsch-avail-subtitle { font-size: 11px; color: rgba(255,255,255,0.4); margin-top: 4px; line-height: 1.4; }

.wsch-avail-month-nav {
  display: flex; align-items: center; justify-content: center; gap: 14px;
  margin-bottom: 14px;
}
.wsch-avail-nav-btn {
  width: 30px; height: 30px; border-radius: 8px;
  background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.1);
  color: rgba(255,255,255,0.6); cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: all 0.15s;
}
.wsch-avail-nav-btn:hover:not(:disabled) { background: rgba(255,255,255,0.1); color: #fff; }
.wsch-avail-month-label {
  font-size: 15px; font-weight: 700; color: #fff;
  min-width: 140px; text-align: center;
}

.wsch-avail-legend {
  display: flex; justify-content: center; gap: 18px;
  margin-bottom: 12px;
}
.wsch-avail-leg-item {
  display: flex; align-items: center; gap: 5px;
  font-size: 11px; color: rgba(255,255,255,0.5); font-weight: 500;
}
.wsch-avail-leg-dot {
  width: 10px; height: 10px; border-radius: 3px;
}
.wsch-avail-leg-dot.wav-unavail { background: rgba(239,68,68,0.7); }
.wsch-avail-leg-dot.wav-soft { background: rgba(168,85,247,0.6); }

/* Calendar Grid */
.wsch-avail-calendar { margin-bottom: 16px; }
.wav-cal-header {
  display: grid; grid-template-columns: repeat(7, 1fr);
  gap: 2px; margin-bottom: 4px;
}
.wav-cal-dow {
  text-align: center; font-size: 10px; font-weight: 700;
  color: rgba(255,255,255,0.35); padding: 4px 0;
  text-transform: uppercase; letter-spacing: 0.5px;
}
.wav-cal-dow.wav-weekend { color: rgba(239,68,68,0.4); }
.wav-cal-grid {
  display: grid; grid-template-columns: repeat(7, 1fr);
  gap: 3px;
}
.wav-cal-day {
  aspect-ratio: 1; border-radius: 8px;
  display: flex; align-items: center; justify-content: center;
  font-size: 13px; font-weight: 600; color: rgba(255,255,255,0.7);
  background: rgba(255,255,255,0.04); cursor: pointer;
  transition: all 0.15s; user-select: none;
  border: 2px solid transparent;
}
.wav-cal-day.wav-cal-empty { background: transparent; cursor: default; }
.wav-cal-day:not(.wav-cal-empty):hover {
  background: rgba(255,255,255,0.1); color: #fff;
}
.wav-cal-day.wav-weekend { color: rgba(239,68,68,0.5); }
.wav-cal-day.wav-selected-unavail {
  background: rgba(239,68,68,0.25); color: #fca5a5;
  border-color: rgba(239,68,68,0.5);
}
.wav-cal-day.wav-selected-soft {
  background: rgba(168,85,247,0.2); color: #c4b5fd;
  border-color: rgba(168,85,247,0.45);
}

/* Comment */
.wsch-avail-comment-wrap { margin-bottom: 14px; }
.wsch-avail-comment-label {
  display: block; font-size: 12px; font-weight: 600;
  color: rgba(255,255,255,0.5); margin-bottom: 6px;
}
.wsch-avail-comment {
  width: 100%; padding: 10px 12px; border-radius: 10px;
  background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.1);
  color: #fff; font-size: 13px; font-family: inherit;
  resize: vertical; min-height: 44px;
  transition: border-color 0.2s;
  box-sizing: border-box;
}
.wsch-avail-comment:focus {
  outline: none; border-color: rgba(99,102,241,0.5);
  background: rgba(255,255,255,0.07);
}
.wsch-avail-comment::placeholder { color: rgba(255,255,255,0.2); }

.wsch-avail-saved-hint {
  text-align: center; font-size: 11px;
  color: rgba(34,197,94,0.6); margin-bottom: 10px;
  font-weight: 500;
}

/* Actions */
.wsch-avail-actions {
  display: flex; gap: 8px; justify-content: flex-end;
}
.wsch-avail-cancel, .wsch-avail-save {
  padding: 8px 20px; border-radius: 10px;
  font-size: 13px; font-weight: 600; cursor: pointer;
  transition: all 0.15s; border: none;
}
.wsch-avail-cancel {
  background: rgba(255,255,255,0.06); color: rgba(255,255,255,0.5);
}
.wsch-avail-cancel:hover { background: rgba(255,255,255,0.1); color: #fff; }
.wsch-avail-save {
  background: rgba(99,102,241,0.3); color: #a5b4fc;
  border: 1px solid rgba(99,102,241,0.4);
}
.wsch-avail-save:hover { background: rgba(99,102,241,0.4); color: #fff; }
.wsch-avail-save:disabled { opacity: 0.5; cursor: default; }

/* User Request Badge in Workers Panel */
.wsch-ureq-badge {
  width: 28px; height: 28px; border-radius: 8px;
  background: rgba(99,102,241,0.15); border: 1px solid rgba(99,102,241,0.3);
  font-size: 14px; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: all 0.15s; flex-shrink: 0;
  margin-left: auto;
  line-height: 1;
}
.wsch-ureq-badge:hover { background: rgba(99,102,241,0.25); }
.wsch-ureq-badge.active { background: rgba(99,102,241,0.3); border-color: rgba(99,102,241,0.5); }

/* User Request Panel (in admin workers list) */
.wsch-ureq-panel {
  background: rgba(99,102,241,0.06); border: 1px solid rgba(99,102,241,0.15);
  border-radius: 10px; padding: 10px 12px; margin-top: 8px;
  animation: wsch-dialog-in 0.15s ease-out;
}
.wsch-ureq-title {
  font-size: 11px; font-weight: 700; color: rgba(99,102,241,0.8);
  margin-bottom: 6px; letter-spacing: 0.3px;
}
.wsch-ureq-row {
  display: flex; align-items: baseline; gap: 6px;
  font-size: 12px; margin-bottom: 3px;
}
.wsch-ureq-label { color: rgba(255,255,255,0.4); font-weight: 600; white-space: nowrap; }
.wsch-ureq-val { color: rgba(255,255,255,0.75); word-break: break-word; }
.wsch-ureq-apply {
  margin-top: 8px; padding: 5px 14px; border-radius: 8px;
  background: rgba(34,197,94,0.15); border: 1px solid rgba(34,197,94,0.3);
  color: #86efac; font-size: 11px; font-weight: 600;
  cursor: pointer; transition: all 0.15s;
}
.wsch-ureq-apply:hover { background: rgba(34,197,94,0.25); color: #fff; }

/* Editor */
.wsch-editor {
  display: flex; flex-direction: column;
  margin-top: 6px; border-radius: 14px;
  border: 1px solid rgba(251,191,36,0.1);
  background: rgba(0,0,0,0.25);
  max-height: 420px; overflow: hidden;
}
.wsch-editor-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 10px 14px; flex-shrink: 0;
  border-bottom: 1px solid rgba(255,255,255,0.06);
}
.wsch-editor-title { font-size: 12px; font-weight: 700; color: rgba(255,255,255,0.5); }
.wsch-editor-close {
  width: 26px; height: 26px; border-radius: 6px;
  border: 1px solid rgba(255,255,255,0.08); background: rgba(255,255,255,0.04);
  color: rgba(255,255,255,0.3); cursor: pointer; font-size: 14px;
  display: flex; align-items: center; justify-content: center;
}
.wsch-editor-close:hover { color: var(--c-danger); border-color: rgba(231,76,60,0.2); }
.wsch-editor-content { flex: 1; overflow-y: auto; padding: 10px; scrollbar-width: thin; }

.wsch-add-form {
  display: flex; gap: 4px; margin-bottom: 10px;
}
.wsch-input {
  flex: 1; padding: 7px 10px; border-radius: 8px;
  border: 1px solid rgba(255,255,255,0.08); background: rgba(0,0,0,0.3);
  color: #e8e8ec; font-size: 12px;
}
.wsch-input:focus { border-color: rgba(251,191,36,0.3); outline: none; }
.wsch-input::placeholder { color: rgba(255,255,255,0.2); }
.wsch-input-sm { max-width: 55px; text-align: center; }
.wsch-select {
  padding: 7px 6px; border-radius: 8px;
  border: 1px solid rgba(255,255,255,0.08); background: rgba(0,0,0,0.3);
  color: #e8e8ec; font-size: 11px;
}
.wsch-add-btn {
  width: 34px; height: 34px; border-radius: 8px;
  border: 1px solid rgba(251,191,36,0.2); background: rgba(251,191,36,0.08);
  color: #fbbf24; font-size: 18px; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: all 0.2s;
}
.wsch-add-btn:hover { background: rgba(251,191,36,0.15); }

/* Worker groups */
.wsch-wgroup { margin-bottom: 4px; }
.wsch-wgroup-title {
  font-size: 10px; font-weight: 700; color: var(--pav-c);
  text-transform: uppercase; padding: 5px 8px; letter-spacing: 0.5px;
  display: flex; align-items: center; gap: 6px;
  background: var(--pav-bg); border-radius: 6px; margin-bottom: 3px;
  position: sticky; top: 40px; z-index: 4;
  backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
  border: 1px solid rgba(255,255,255,0.04);
}
.wsch-wgroup-count {
  font-size: 9px; font-weight: 700; color: var(--pav-c); opacity: 0.6;
  margin-left: auto;
}

/* Worker inline card */
.wsch-wcard {
  padding: 6px 8px; border-radius: 8px;
  border: 1px solid rgba(255,255,255,0.05);
  background: linear-gradient(135deg, rgba(255,255,255,0.025), rgba(255,255,255,0.01));
  margin-bottom: 3px; transition: all 0.18s ease;
  overflow: hidden; max-width: 100%; box-sizing: border-box;
}
.wsch-wcard:hover { background: linear-gradient(135deg, rgba(255,255,255,0.05), rgba(255,255,255,0.025)); border-color: rgba(255,255,255,0.08); }
.wsch-wcard.assign-mode {
  border-color: rgba(34,197,94,0.35); background: linear-gradient(135deg, rgba(34,197,94,0.08), rgba(34,197,94,0.03));
  box-shadow: inset 3px 0 0 rgba(34,197,94,0.6);
}

/* Row 1: avatar + name + pavilion + schedule */
.wsch-wcard-r1 {
  display: flex; align-items: center; gap: 6px; min-width: 0;
  padding-bottom: 4px; border-bottom: 1px solid rgba(255,255,255,0.04);
  margin-bottom: 5px;
}
.wsch-wcard-av {
  width: 22px; height: 22px; min-width: 22px; border-radius: 50%;
  object-fit: cover; border: 1.5px solid rgba(255,255,255,0.12); flex-shrink: 0;
}
.wsch-wcard-av-letter {
  display: inline-flex; align-items: center; justify-content: center;
  background: linear-gradient(135deg, rgba(255,255,255,0.1), rgba(255,255,255,0.04));
  color: rgba(255,255,255,0.5);
  font-size: 7px; font-weight: 700; text-transform: uppercase;
}
.wsch-wcard-name {
  font-size: 11.5px; font-weight: 600; color: rgba(255,255,255,0.8);
  cursor: pointer; white-space: nowrap; overflow: hidden;
  text-overflow: ellipsis; min-width: 40px; flex: 1;
  transition: color 0.12s;
}
.wsch-wcard-name:hover { color: #fff; }

.wsch-wcard-grp {
  display: flex; gap: 2px; flex-shrink: 0; align-items: center;
}
.wsch-grp-icon {
  font-size: 9px; margin-right: 1px; opacity: 0.5; flex-shrink: 0;
}
.wsch-pav-pill, .wsch-sched-pill {
  padding: 2px 6px; border-radius: 4px; font-size: 8px; font-weight: 700;
  border: 1px solid rgba(255,255,255,0.06); background: rgba(255,255,255,0.02);
  color: rgba(255,255,255,0.3); cursor: pointer; transition: all 0.15s;
  white-space: nowrap;
}
.wsch-pav-pill:hover { border-color: var(--pc); color: var(--pc); background: rgba(255,255,255,0.04); }
.wsch-pav-pill.active {
  background: color-mix(in srgb, var(--pc) 15%, transparent);
  color: var(--pc); border-color: color-mix(in srgb, var(--pc) 40%, transparent);
  box-shadow: 0 0 6px color-mix(in srgb, var(--pc) 10%, transparent);
}
.wsch-sched-pill:hover { color: rgba(255,255,255,0.7); border-color: rgba(255,255,255,0.15); }
.wsch-sched-pill.active {
  background: rgba(139,92,246,0.14); color: #a78bfa; border-color: rgba(139,92,246,0.3);
  box-shadow: 0 0 6px rgba(139,92,246,0.08);
}

/* Card body — settings area */
.wsch-wcard-body {
  display: flex; flex-direction: column; gap: 3px;
  margin-top: 4px; padding-top: 4px;
  border-top: 1px solid rgba(255,255,255,0.04);
}

/* Row inside body */
.wsch-brow {
  display: flex; gap: 3px;
}

/* Colored card blocks */
.wsch-bcard {
  flex: 2; min-width: 0;
  padding: 0; border-radius: 6px;
  min-height: 28px; overflow: hidden;
  background: rgba(255,255,255,0.035);
  border: 1px solid rgba(255,255,255,0.07);
}
.wsch-bcard--sm { flex: 1; }
.wsch-bcard--tgl {
  flex: 1; min-width: 0;
}
.wsch-bcard-head {
  padding: 3px 8px;
  font-size: 9px; font-weight: 700; letter-spacing: 0.2px;
  color: rgba(255,255,255,0.55);
  background: rgba(255,255,255,0.04);
  border-bottom: 1px solid rgba(255,255,255,0.05);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  text-align: center;
}
.wsch-bcard-content {
  padding: 5px 6px;
  display: flex; align-items: center; gap: 3px;
}
/* Custom input: wrapper div + bare input */
.wsch-finput {
  position: relative;
  display: flex; align-items: center;
  height: 20px; border-radius: 4px;
  padding: 0 5px; box-sizing: border-box;
  border: 1px solid rgba(255,255,255,0.07);
  background: rgba(0,0,0,0.2);
  flex: 1; min-width: 0;
  transition: border-color 0.15s;
}
.wsch-finput:focus-within { border-color: rgba(255,255,255,0.2); }
.wsch-finput--sm { flex: 1; }
.wsch-finput-el {
  display: block;
  width: 100%;
  padding: 0;
  margin: 0;
  border: none;
  background: transparent;
  outline: none;
  box-shadow: none;
  color: #e8e8ec;
  font-size: 9px;
  font-family: 'Consolas', 'SF Mono', monospace;
  line-height: 18px;
  box-sizing: border-box;
}
.wsch-finput--sm .wsch-finput-el { text-align: center; }
.wsch-finput-el::placeholder { color: rgba(255,255,255,0.15); font-size: 8px; }
.wsch-bcard-dash {
  font-size: 9px; color: rgba(255,255,255,0.15); flex-shrink: 0;
  padding: 0 1px;
}

/* Toggles */
.wsch-bcard-toggles {
  flex-direction: row; flex-wrap: nowrap; gap: 6px; padding: 4px 5px;
  justify-content: center;
}
.wsch-tgl {
  display: flex; align-items: center; gap: 5px;
  cursor: pointer; user-select: none;
}
.wsch-tgl-cb { position: absolute; opacity: 0; width: 0; height: 0; pointer-events: none; }
.wsch-tgl-track {
  position: relative;
  width: 22px; height: 12px; flex-shrink: 0;
  border-radius: 6px;
  background: rgba(255,255,255,0.08);
  border: 1px solid rgba(255,255,255,0.1);
  transition: background .2s, border-color .2s;
}
.wsch-tgl-knob {
  position: absolute; top: 1px; left: 1px;
  width: 8px; height: 8px; border-radius: 50%;
  background: rgba(255,255,255,0.3);
  transition: transform .2s, background .2s;
}
.wsch-tgl.on .wsch-tgl-track {
  background: rgba(78,205,196,0.25);
  border-color: rgba(78,205,196,0.4);
}
.wsch-tgl.on .wsch-tgl-knob {
  transform: translateX(10px);
  background: #4ECDC4;
}
.wsch-tgl-txt {
  font-size: 8px; color: rgba(255,255,255,0.4);
  line-height: 1;
}
.wsch-tgl.on .wsch-tgl-txt { color: rgba(78,205,196,0.8); }

/* Big toggle variant */
.wsch-tgl--big { gap: 6px; justify-content: center; width: 100%; }
.wsch-tgl--big .wsch-tgl-track {
  width: 32px; height: 16px; border-radius: 8px;
}
.wsch-tgl--big .wsch-tgl-knob {
  width: 12px; height: 12px; top: 1px; left: 1px;
}
.wsch-tgl--big.on .wsch-tgl-knob {
  transform: translateX(16px);
}
.wsch-tgl--big .wsch-tgl-txt {
  font-size: 9px; font-weight: 600;
}

/* Generate dialog */
.wsch-gen-dialog { min-width: 380px; max-width: 520px; }
.wsch-gen-header {
  display: flex; align-items: center; gap: 12px; margin-bottom: 14px;
}
.wsch-gen-icon {
  width: 42px; height: 42px; border-radius: 12px;
  background: linear-gradient(135deg, rgba(251,191,36,0.15), rgba(251,191,36,0.05));
  border: 1px solid rgba(251,191,36,0.2);
  display: flex; align-items: center; justify-content: center;
  font-size: 20px; flex-shrink: 0;
}
.wsch-gen-subtitle {
  font-size: 11px; color: rgba(255,255,255,0.4); margin-top: 2px;
}
.wsch-gen-section { margin-bottom: 12px; }
.wsch-gen-label {
  display: block; font-size: 10px; font-weight: 700;
  color: rgba(255,255,255,0.5); text-transform: uppercase;
  letter-spacing: 0.3px; margin-bottom: 6px;
}
.wsch-gen-input-row {
  display: flex; align-items: center; gap: 6px; justify-content: center;
}
.wsch-gen-adj {
  width: 32px; height: 32px; border-radius: 8px; font-size: 16px; font-weight: 700;
  border: 1px solid rgba(255,255,255,0.1); background: rgba(255,255,255,0.04);
  color: rgba(255,255,255,0.6); cursor: pointer; transition: all 0.15s;
  display: flex; align-items: center; justify-content: center;
}
.wsch-gen-adj:hover { background: rgba(255,255,255,0.1); color: #fff; border-color: rgba(255,255,255,0.2); }
.wsch-gen-input {
  width: 70px; padding: 6px; border-radius: 10px; text-align: center;
  border: 1px solid rgba(251,191,36,0.25); background: rgba(251,191,36,0.06);
  color: #fbbf24; font-size: 20px; font-weight: 700;
}
.wsch-gen-input:focus { outline: none; border-color: rgba(251,191,36,0.5); box-shadow: 0 0 12px rgba(251,191,36,0.1); }
.wsch-gen-input-hint {
  text-align: center; font-size: 9px; color: rgba(255,255,255,0.3); margin-top: 6px;
}

.wsch-gen-preview {
  max-height: 200px; overflow-y: auto; margin-bottom: 10px;
  border-radius: 10px; background: rgba(0,0,0,0.2);
  border: 1px solid rgba(255,255,255,0.06); padding: 10px;
}
.wsch-gen-preview-loading, .wsch-gen-preview-err {
  text-align: center; font-size: 11px; color: rgba(255,255,255,0.3); padding: 10px;
}
.wsch-gen-stats {
  display: flex; gap: 8px; justify-content: center; flex-wrap: wrap; margin-bottom: 8px;
}
.wsch-gen-stat {
  display: flex; flex-direction: column; align-items: center; gap: 1px;
  padding: 6px 12px; border-radius: 8px;
  background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.06);
  min-width: 48px;
}
.wsch-gen-stat-num { font-size: 16px; font-weight: 800; color: rgba(255,255,255,0.85); }
.wsch-gen-stat-label { font-size: 8px; font-weight: 600; color: rgba(255,255,255,0.35); text-transform: uppercase; letter-spacing: 0.3px; }
.wsch-gen-workers-title {
  font-size: 9px; font-weight: 700; color: rgba(255,255,255,0.4);
  text-transform: uppercase; letter-spacing: 0.3px; margin-bottom: 4px;
}
.wsch-gen-workers-list { display: flex; flex-direction: column; gap: 4px; }
.wsch-gen-worker-row {
  display: flex; align-items: center; gap: 6px; flex-wrap: wrap;
  padding: 4px 6px; border-radius: 6px; background: rgba(255,255,255,0.02);
}
.wsch-gen-worker-name {
  font-size: 10px; font-weight: 600; color: rgba(255,255,255,0.7);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 130px;
}
.wsch-gen-worker-name.pav3 { color: #f87171; }
.wsch-gen-worker-name.pav7 { color: #60a5fa; }
.wsch-gen-worker-name.office { color: #eab308; }
.wsch-gen-worker-target {
  font-size: 9px; font-weight: 700; color: rgba(52,211,153,0.7); white-space: nowrap;
}
.wsch-gen-worker-flags { display: flex; gap: 3px; flex-wrap: wrap; flex: 1; }
.wsch-gen-flag {
  font-size: 8px; font-weight: 600; padding: 1px 5px; border-radius: 4px;
  background: rgba(255,255,255,0.05); color: rgba(255,255,255,0.4);
  border: 1px solid rgba(255,255,255,0.06); white-space: nowrap;
}
.wsch-gen-flag.flag-vac { background: rgba(56,189,248,0.1); color: #38bdf8; border-color: rgba(56,189,248,0.15); }
.wsch-gen-flag.flag-we { background: rgba(167,139,250,0.1); color: #a78bfa; border-color: rgba(167,139,250,0.15); }
.wsch-gen-flag.flag-prio { background: rgba(251,191,36,0.1); color: #fbbf24; border-color: rgba(251,191,36,0.15); }
.wsch-gen-flag.flag-streak { background: rgba(251,146,60,0.1); color: #fb923c; border-color: rgba(251,146,60,0.15); }
.wsch-gen-flag.flag-target { background: rgba(52,211,153,0.1); color: #34d399; border-color: rgba(52,211,153,0.15); }
.wsch-gen-flag.flag-33 { background: rgba(148,163,184,0.08); color: #94a3b8; border-color: rgba(148,163,184,0.12); }
.wsch-gen-no-flags {
  text-align: center; font-size: 10px; color: rgba(255,255,255,0.25);
  padding: 6px; font-style: italic;
}

.wsch-gen-rules { margin-bottom: 10px; display: flex; flex-direction: column; gap: 8px; }
.wsch-gen-rule-group {
  padding: 8px 10px; border-radius: 8px;
  background: rgba(255,255,255,0.02); border: 1px solid rgba(255,255,255,0.04);
}
.wsch-gen-rule-title {
  font-size: 9px; font-weight: 700; color: rgba(255,255,255,0.5);
  display: flex; align-items: center; gap: 6px; margin-bottom: 4px;
}
.wsch-gen-rule-badge {
  font-size: 7px; font-weight: 800; text-transform: uppercase;
  letter-spacing: 0.3px; padding: 2px 5px; border-radius: 3px;
}
.wsch-gen-badge-hard { background: rgba(239,68,68,0.15); color: #f87171; }
.wsch-gen-badge-soft { background: rgba(59,130,246,0.15); color: #60a5fa; }
.wsch-gen-rule {
  font-size: 10px; color: rgba(255,255,255,0.38); line-height: 1.6; padding-left: 4px;
}

.wsch-gen-warn {
  font-size: 10px; color: rgba(251,191,36,0.6); text-align: center;
  padding: 6px 8px; border-radius: 6px; margin-bottom: 12px;
  background: rgba(251,191,36,0.04); border: 1px dashed rgba(251,191,36,0.12);
}
.wsch-gen-ok {
  background: linear-gradient(135deg, rgba(251,191,36,0.2), rgba(251,191,36,0.1)) !important;
  color: #fbbf24 !important; border-color: rgba(251,191,36,0.3) !important;
  font-weight: 700 !important;
}
.wsch-gen-ok:hover { background: linear-gradient(135deg, rgba(251,191,36,0.3), rgba(251,191,36,0.15)) !important; }

.wsch-wi-empty {
  text-align: center; padding: 10px; color: rgba(255,255,255,0.15);
  font-size: 11px; font-style: italic;
}
.wsch-empty { text-align: center; padding: 20px; color: rgba(255,255,255,0.2); font-size: 12px; }

/* (old expand/badge styles removed) */

/* Warnings bar */
.wsch-warnings {
  padding: 8px 10px; margin-top: 4px; border-radius: 8px;
  background: rgba(239,68,68,0.05);
  border: 1px solid rgba(239,68,68,0.1);
}
.wsch-warn-item {
  font-size: 10px; color: rgba(239,68,68,0.8); padding: 2px 0;
}
.wsch-warn-more {
  font-size: 9px; color: rgba(255,255,255,0.25); font-style: italic;
  margin-top: 2px;
}

/* Custom dialogs */
.wsch-dialog-overlay {
  position: fixed; inset: 0; z-index: 20000;
  background: rgba(0,0,0,0.5); backdrop-filter: blur(4px);
  display: flex; align-items: center; justify-content: center;
  opacity: 0; transition: opacity 0.2s;
}
.wsch-dialog-overlay.visible { opacity: 1; }
.wsch-dialog {
  background: #1e1e2e; border: 1px solid rgba(255,255,255,0.1);
  border-radius: 14px; padding: 20px 24px; min-width: 300px; max-width: 420px;
  box-shadow: 0 20px 60px rgba(0,0,0,0.6), 0 0 0 1px rgba(255,255,255,0.05);
  animation: wsch-dialog-in 0.2s ease-out;
}
.wsch-dialog.closing { animation: wsch-dialog-out 0.2s ease-in forwards; }
.wsch-dialog-title {
  font-size: 14px; font-weight: 700; color: rgba(255,255,255,0.9);
  margin-bottom: 8px;
}
.wsch-dialog-body {
  font-size: 12px; color: rgba(255,255,255,0.5); line-height: 1.6;
  margin-bottom: 16px;
}
.wsch-dialog-input {
  width: 100%; padding: 8px 12px; border-radius: 8px;
  border: 1px solid rgba(255,255,255,0.1); background: rgba(0,0,0,0.3);
  color: #fff; font-size: 16px; font-weight: 600; text-align: center;
  margin-bottom: 16px; box-sizing: border-box;
}
.wsch-dialog-input:focus { outline: none; border-color: rgba(251,191,36,0.4); }
.wsch-dialog-actions {
  display: flex; gap: 8px; justify-content: flex-end;
}
.wsch-dialog-btn {
  padding: 8px 18px; border-radius: 8px; font-size: 12px; font-weight: 600;
  cursor: pointer; transition: all 0.15s; border: 1px solid transparent;
}
.wsch-dialog-cancel {
  background: rgba(255,255,255,0.05); color: rgba(255,255,255,0.5);
  border-color: rgba(255,255,255,0.08);
}
.wsch-dialog-cancel:hover { background: rgba(255,255,255,0.1); color: rgba(255,255,255,0.8); }
.wsch-dialog-ok {
  background: rgba(59,130,246,0.15); color: #60a5fa;
  border-color: rgba(59,130,246,0.3);
}
.wsch-dialog-ok:hover { background: rgba(59,130,246,0.25); }
.wsch-dialog-ok.danger {
  background: rgba(239,68,68,0.15); color: #f87171;
  border-color: rgba(239,68,68,0.3);
}
.wsch-dialog-ok.danger:hover { background: rgba(239,68,68,0.25); }
@keyframes wsch-dialog-in {
  from { opacity: 0; transform: scale(0.95) translateY(-10px); }
  to { opacity: 1; transform: scale(1) translateY(0); }
}
@keyframes wsch-dialog-out {
  from { opacity: 1; transform: scale(1) translateY(0); }
  to { opacity: 0; transform: scale(0.95) translateY(10px); }
}

/* Worker profile popup */
.wsch-profile-popup {
  position: fixed; z-index: 9000;
  inset: 0;
  display: flex; align-items: center; justify-content: center;
  pointer-events: none; opacity: 0;
  background: rgba(0,0,0,0.35);
  transition: opacity .2s;
}
body:not(.no-blur) .wsch-profile-popup {
  backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
}
.wsch-profile-popup.show {
  pointer-events: auto; opacity: 1;
}
.wsch-pp-card {
  background: rgba(28,30,36,0.97);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 18px; padding: 28px 24px 22px;
  backdrop-filter: blur(24px);
  box-shadow: 0 12px 48px rgba(0,0,0,0.55), 0 0 0 1px rgba(255,255,255,0.05);
  text-align: center;
  min-width: 260px; max-width: 300px;
  transform: scale(0.92);
  transition: transform .2s;
}
.wsch-profile-popup.show .wsch-pp-card {
  transform: scale(1);
}
.wsch-pp-avatar {
  width: 72px; height: 72px; border-radius: 50%; margin: 0 auto 14px;
  display: block; object-fit: cover;
  border: 3px solid rgba(255,255,255,0.2);
  box-shadow: 0 6px 20px rgba(0,0,0,0.35);
}
.wsch-pp-avatar-letter {
  display: flex; align-items: center; justify-content: center;
  background: rgba(255,255,255,0.08);
  color: rgba(255,255,255,0.7); font-size: 22px; font-weight: 700;
  text-transform: uppercase;
}
.wsch-pp-name {
  font-size: 16px; font-weight: 700; color: #fff;
  margin-bottom: 3px; line-height: 1.3;
}
.wsch-pp-role {
  font-size: 12px; font-weight: 600; opacity: 0.8;
  margin-bottom: 14px;
}
.wsch-pp-info {
  display: flex; flex-direction: column; gap: 8px;
  border-top: 1px solid rgba(255,255,255,0.07);
  padding-top: 14px;
}
.wsch-pp-row {
  display: flex; justify-content: space-between; align-items: center;
  gap: 8px;
}
.wsch-pp-label {
  font-size: 12px; color: rgba(255,255,255,0.4); white-space: nowrap;
}
.wsch-pp-val {
  font-size: 12px; font-weight: 600; color: rgba(255,255,255,0.85);
  text-align: right; white-space: nowrap;
}

/* Toast notifications */
.wsch-toast-container {
  position: fixed; top: 8px; right: 8px; z-index: 9999;
  display: flex; flex-direction: column; gap: 6px;
  max-width: 320px; pointer-events: none;
}
/* In-overlay toast (inside overlay-card, top-right) */
.overlay-toast-container {
  position: absolute; top: 56px; right: 8px; z-index: 50;
  display: flex; flex-direction: column; gap: 6px;
  max-width: min(320px, calc(100% - 16px));
  pointer-events: none;
}
.wsch-toast {
  pointer-events: auto;
  padding: 10px 36px 10px 14px; border-radius: 12px;
  backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
  box-shadow: 0 8px 32px rgba(0,0,0,0.4), 0 0 0 1px rgba(255,255,255,0.06);
  animation: wsch-toast-in 0.3s ease-out;
  position: relative; overflow: hidden;
}
.wsch-toast.toast-warning {
  background: linear-gradient(135deg, rgba(234,179,8,0.15), rgba(234,179,8,0.08));
  border: 1px solid rgba(234,179,8,0.25);
}
.wsch-toast.toast-success {
  background: linear-gradient(135deg, rgba(34,197,94,0.15), rgba(34,197,94,0.08));
  border: 1px solid rgba(34,197,94,0.25);
}
.wsch-toast.toast-error {
  background: linear-gradient(135deg, rgba(239,68,68,0.15), rgba(239,68,68,0.08));
  border: 1px solid rgba(239,68,68,0.25);
}
.wsch-toast.toast-info {
  background: linear-gradient(135deg, rgba(59,130,246,0.15), rgba(59,130,246,0.08));
  border: 1px solid rgba(59,130,246,0.25);
}
.wsch-toast-header {
  display: flex; align-items: center; gap: 6px;
}
.wsch-toast-icon { font-size: 14px; line-height: 1; }
.wsch-toast-title {
  font-size: 12px; font-weight: 700; color: rgba(255,255,255,0.9);
  line-height: 1.3;
}
.wsch-toast-body:not(:empty) { margin-top: 4px; }
.wsch-toast-close {
  position: absolute; top: 8px; right: 8px;
  width: 22px; height: 22px;
  display: flex; align-items: center; justify-content: center;
  background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.1);
  color: rgba(255,255,255,0.45);
  cursor: pointer; font-size: 11px; line-height: 1;
  border-radius: 6px; padding: 0;
  transition: all 0.15s ease;
}
.wsch-toast-close:hover {
  color: rgba(255,255,255,0.9);
  background: rgba(255,255,255,0.15);
  border-color: rgba(255,255,255,0.2);
}
.wsch-toast-body {
  font-size: 11px; color: rgba(255,255,255,0.6);
  line-height: 1.5; max-height: 180px; overflow-y: auto;
  scrollbar-width: thin;
}
.wsch-toast-body .wsch-toast-line { padding: 1px 0; }
.wsch-toast-progress {
  position: absolute; bottom: 0; left: 0; height: 2px;
  border-radius: 0 0 12px 12px;
  animation: wsch-toast-progress 5s linear forwards;
}
.toast-warning .wsch-toast-progress { background: rgba(234,179,8,0.5); }
.toast-success .wsch-toast-progress { background: rgba(34,197,94,0.5); }
.toast-error .wsch-toast-progress { background: rgba(239,68,68,0.5); }
.toast-info .wsch-toast-progress { background: rgba(59,130,246,0.5); }
@keyframes wsch-toast-in {
  from { opacity: 0; transform: translateX(40px) scale(0.95); }
  to { opacity: 1; transform: translateX(0) scale(1); }
}
@keyframes wsch-toast-out {
  from { opacity: 1; transform: translateX(0) scale(1); }
  to { opacity: 0; transform: translateX(40px) scale(0.9); }
}
@keyframes wsch-toast-progress {
  from { width: 100%; }
  to { width: 0%; }
}

/* Field error highlight */
.a5-field-error input,
.a5-field-error textarea {
  border-color: rgba(239,68,68,0.6) !important;
  box-shadow: 0 0 0 2px rgba(239,68,68,0.15), 0 0 12px rgba(239,68,68,0.1) !important;
}
.a5-field-error .a5-field-icon {
  color: rgba(239,68,68,0.8) !important;
}
.a5-field-error {
  animation: a5-shake 0.4s ease;
}
@keyframes a5-shake {
  0%, 100% { transform: translateX(0); }
  15% { transform: translateX(-6px); }
  30% { transform: translateX(5px); }
  45% { transform: translateX(-4px); }
  60% { transform: translateX(3px); }
  75% { transform: translateX(-2px); }
}

/* Status badges */
.wsch-status-badge {
  display: inline-flex; align-items: center; gap: 4px;
  font-size: 10px; font-weight: 700; padding: 2px 10px; border-radius: 10px;
  margin-left: 8px; letter-spacing: 0.2px;
}
.wsch-status-published {
  background: rgba(34,197,94,0.12); color: rgba(34,197,94,0.8);
  border: 1px solid rgba(34,197,94,0.2);
}
.wsch-status-draft {
  background: rgba(251,191,36,0.12); color: rgba(251,191,36,0.8);
  border: 1px solid rgba(251,191,36,0.2);
  animation: wsch-draft-pulse 2s ease-in-out infinite;
}
.wsch-status-empty {
  background: rgba(255,255,255,0.04); color: rgba(255,255,255,0.3);
  border: 1px solid rgba(255,255,255,0.06);
}
@keyframes wsch-draft-pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.6; }
}
.wsch-unavail-cell:not(.empty):hover { background: rgba(255,255,255,0.06); }
.wsch-unavail-cell.off {
  background: rgba(239,68,68,0.15); color: #f87171;
  border-color: rgba(239,68,68,0.25);
}
.wsch-target-row {
  display: flex; align-items: center; gap: 8px;
  margin-top: 8px; font-size: 11px; color: rgba(255,255,255,0.4);
}
.wsch-target-input {
  width: 50px; padding: 4px 6px; border-radius: 6px;
  border: 1px solid rgba(255,255,255,0.08); background: rgba(0,0,0,0.3);
  color: #e8e8ec; font-size: 12px; text-align: center;
}
.wsch-loading { display: flex; align-items: center; justify-content: center; padding: 40px; color: rgba(255,255,255,0.3); font-size: 13px; }


/* Vacation range row */
.wsch-vacation-row {
  display: flex; align-items: center; gap: 6px;
  margin-top: 8px; font-size: 11px;
}
.wsch-vacation-label {
  color: rgba(255,255,255,0.4); font-weight: 600; font-size: 10px;
}
.wsch-vacation-input {
  width: 40px; padding: 4px 6px; border-radius: 6px;
  border: 1px solid rgba(255,255,255,0.08); background: rgba(0,0,0,0.3);
  color: rgba(255,255,255,0.8); font-size: 11px; text-align: center;
}
.wsch-vacation-input:focus { outline: none; border-color: rgba(251,191,36,0.3); }
.wsch-vacation-sep {
  color: rgba(255,255,255,0.25); font-size: 11px;
}
.wsch-vacation-apply {
  background: rgba(251,191,36,0.1) !important;
  border-color: rgba(251,191,36,0.2) !important;
  color: #fbbf24 !important;
}

/* Edit mode: panel border glow */
.wsch-panel { transition: border-color 0.3s, box-shadow 0.3s; }
.wsch-panel.editing {
  border-color: rgba(251,191,36,0.25);
  box-shadow: 0 2px 20px rgba(0,0,0,0.2), inset 0 1px 0 rgba(251,191,36,0.1);
}

/* Resize handle (right edge strip) */
.wsch-resize-handle {
  flex-shrink: 0;
  width: 14px;
  cursor: ew-resize;
  display: flex; align-items: center; justify-content: center;
  background: linear-gradient(180deg, rgba(251,191,36,0.06) 0%, rgba(251,191,36,0.12) 50%, rgba(251,191,36,0.06) 100%);
  border-left: 2px solid rgba(251,191,36,0.18);
  border-radius: 0 12px 12px 0;
  transition: background 0.2s, border-color 0.2s, width 0.15s;
  position: relative;
  min-height: 0;
}
.wsch-resize-handle:hover {
  width: 18px;
  background: linear-gradient(180deg, rgba(251,191,36,0.1) 0%, rgba(251,191,36,0.22) 50%, rgba(251,191,36,0.1) 100%);
  border-left-color: rgba(251,191,36,0.35);
}
.wsch-resize-handle.dragging {
  width: 18px;
  background: linear-gradient(180deg, rgba(251,191,36,0.15) 0%, rgba(251,191,36,0.3) 50%, rgba(251,191,36,0.15) 100%);
  border-left-color: rgba(251,191,36,0.5);
}
.wsch-resize-grip {
  display: flex; flex-direction: column; align-items: center; gap: 5px;
}
.wsch-resize-grip span {
  display: block;
  width: 3px; height: 3px; border-radius: 50%;
  background: rgba(251,191,36,0.45);
  transition: background 0.2s, transform 0.15s;
}
.wsch-resize-handle:hover .wsch-resize-grip span {
  background: rgba(251,191,36,0.8);
  transform: scale(1.3);
}
.wsch-resize-handle.dragging .wsch-resize-grip span {
  background: #fbbf24;
  transform: scale(1.4);
}
#ws-schedule {
  position: relative;
}
#ws-schedule.wsch-has-resize {
  flex-direction: row !important;
  flex-wrap: nowrap;
}
#ws-schedule.wsch-has-resize > .wsch-panel {
  flex: 1 1 0; min-width: 0;
  display: flex; flex-direction: column;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

/* Schedule-only expansion (overflows the card to the right) */
#ws-schedule.wsch-expanded {
  width: var(--wsch-schedule-width);
  flex-shrink: 0;
}
#ws-schedule.wsch-expanded > .wsch-panel {
  background: #16161b;
  border: 1px solid rgba(251,191,36,0.15);
  box-shadow: 0 4px 30px rgba(0,0,0,0.5), inset 0 1px 0 rgba(251,191,36,0.06);
}
#ws-schedule.wsch-expanded > .wsch-resize-handle {
  background: linear-gradient(180deg, #1a1a22 0%, #1e1e28 50%, #1a1a22 100%);
  border-left-color: rgba(251,191,36,0.15);
}
.card.admin-mode.wsch-sched-expanded .admin-panel {
  overflow-x: visible;
  overflow-y: clip;
}

/* Edit toolbar */
.wsch-edit-toolbar {
  padding: 8px 0 6px;
  border-bottom: 1px solid rgba(251,191,36,0.1);
  animation: wsch-slide-down 0.25s ease-out;
}
@keyframes wsch-slide-down {
  from { opacity: 0; transform: translateY(-8px); }
  to { opacity: 1; transform: translateY(0); }
}
.wsch-et-row {
  display: flex; align-items: center; gap: 0;
  flex-wrap: nowrap;
}
.wsch-et-btn {
  flex: 1; padding: 7px 4px; border-radius: 0;
  border: none; border-right: 1px solid rgba(255,255,255,0.06);
  background: rgba(255,255,255,0.02);
  color: rgba(255,255,255,0.55);
  font-size: 11px; font-weight: 600;
  cursor: pointer; transition: all 0.2s;
  white-space: nowrap; text-align: center;
}
.wsch-et-btn:first-child { border-radius: 8px 0 0 8px; }
.wsch-et-btn:last-child { border-radius: 0 8px 8px 0; border-right: none; }
.wsch-et-btn:hover { background: rgba(255,255,255,0.06); color: rgba(255,255,255,0.8); }
.wsch-et-btn:disabled { opacity: 0.4; cursor: not-allowed; }
.wsch-et-generate { border-color: rgba(251,191,36,0.15); color: rgba(251,191,36,0.7); }
.wsch-et-generate:hover { background: rgba(251,191,36,0.08); color: #fbbf24; }
.wsch-et-clear { border-color: rgba(239,68,68,0.15); color: rgba(239,68,68,0.6); }
.wsch-et-clear:hover { background: rgba(239,68,68,0.08); color: #ef4444; }
.wsch-et-publish { border-color: rgba(34,197,94,0.2); color: rgba(34,197,94,0.7); }
.wsch-et-publish:hover { background: rgba(34,197,94,0.1); color: #22c55e; }
.wsch-et-publish.wsch-unpublished { border-color: rgba(251,191,36,0.2); color: rgba(251,191,36,0.7); }
.wsch-et-publish.wsch-unpublished:hover { background: rgba(251,191,36,0.1); color: #fbbf24; }
.wsch-et-workers { border-color: rgba(59,130,246,0.15); color: rgba(59,130,246,0.6); }
.wsch-et-workers:hover { background: rgba(59,130,246,0.08); color: #60a5fa; }
.wsch-et-workers.active { background: rgba(59,130,246,0.12); color: #60a5fa; }
.wsch-et-done { color: rgba(255,255,255,0.5); background: rgba(255,255,255,0.04); }
.wsch-et-done:hover { background: rgba(255,255,255,0.08); color: rgba(255,255,255,0.8); }

/* Help ? buttons */
.wsch-help-qbtn {
  width: 28px; height: 28px; border-radius: 50%;
  border: 1px solid rgba(251,191,36,0.25);
  background: rgba(251,191,36,0.08);
  color: #fbbf24; font-size: 15px; font-weight: 700;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; transition: all 0.2s; flex-shrink: 0;
}
.wsch-help-qbtn:hover { background: rgba(251,191,36,0.2); border-color: rgba(251,191,36,0.5); }
.wsch-help-qbtn-editor {
  border-color: rgba(239,68,68,0.25);
  background: rgba(239,68,68,0.08);
  color: #f87171;
}
.wsch-help-qbtn-editor:hover { background: rgba(239,68,68,0.2); border-color: rgba(239,68,68,0.5); }

/* Help info modal (plashka style) */
.wsch-info-modal {
  position: fixed; inset: 0; z-index: 9999;
  background: rgba(10,10,15,0.92);
  backdrop-filter: blur(14px);
  overflow-y: auto; padding: 20px;
}
.wsch-info-content { max-width: 420px; margin: 0 auto; }
.wsch-info-title {
  font-size: 16px; font-weight: 700; color: #fbbf24;
  margin-bottom: 16px; text-align: center;
}
.wsch-info-section {
  margin-bottom: 14px; padding: 10px 12px;
  border-radius: 10px;
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.06);
}
.wsch-info-heading {
  font-size: 13px; font-weight: 700; color: #e8e8ec;
  margin-bottom: 6px;
}
.wsch-info-section p {
  font-size: 12px; color: rgba(255,255,255,0.6);
  line-height: 1.5; margin: 4px 0;
}
.wsch-info-section b { color: rgba(255,255,255,0.85); }
.wsch-info-close {
  display: block; width: 100%; padding: 10px 0;
  margin-top: 16px; border-radius: 10px;
  border: 1px solid rgba(251,191,36,0.25);
  background: rgba(251,191,36,0.1);
  color: #fbbf24; font-size: 14px; font-weight: 600;
  cursor: pointer; transition: all 0.2s;
}
.wsch-info-close:hover { background: rgba(251,191,36,0.2); }
.wsch-et-hint {
  font-size: 10px; color: rgba(255,255,255,0.25); padding: 4px 0 0;
}
.wsch-et-publish.wsch-published {
  border-color: rgba(34,197,94,0.3); color: #22c55e; background: rgba(34,197,94,0.08);
}
.wsch-et-publish.wsch-published:hover {
  background: rgba(34,197,94,0.12);
}

/* Workers panel (bottom, in edit mode) — visually separate */
.wsch-workers-panel {
  margin-top: 8px; padding: 0 12px 12px;
  border-radius: 12px;
  background: rgba(0,0,0,0.15);
  border: 1px solid rgba(255,255,255,0.06);
  max-height: 500px; min-height: 120px; overflow-y: auto; overflow-x: hidden;
  scrollbar-width: thin;
  animation: wsch-slide-down 0.2s ease-out;
  position: relative;
}
.wsch-wp-chelka {
  position: sticky; top: 0; z-index: 5;
  display: flex; flex-direction: column; align-items: center;
  cursor: ns-resize;
  background: rgba(15,15,25,0.95); backdrop-filter: blur(8px);
  border-bottom: 1px solid rgba(255,255,255,0.06);
  border-radius: 12px 12px 0 0; margin: 0 -12px;
  padding: 0 12px; transition: background 0.15s;
  user-select: none;
}
.wsch-wp-chelka:hover { background: rgba(25,25,40,0.98); }
.wsch-wp-chelka-grip {
  width: 36px; height: 4px; border-radius: 2px;
  background: rgba(255,255,255,0.12); margin: 6px 0 4px;
  transition: background 0.15s;
}
.wsch-wp-chelka:hover .wsch-wp-chelka-grip { background: rgba(255,255,255,0.3); }
.wsch-wp-chelka:active .wsch-wp-chelka-grip { background: rgba(255,255,255,0.5); }
.wsch-wp-chelka-title {
  font-size: 10px; font-weight: 600;
  color: rgba(255,255,255,0.3); letter-spacing: 0.3px;
  pointer-events: none; padding-bottom: 6px;
}
.wsch-wp-chelka-close {
  position: absolute; right: 12px; top: 50%; transform: translateY(-50%);
  width: 22px; height: 22px; border-radius: 5px;
  border: 1px solid rgba(255,255,255,0.06);
  background: rgba(255,255,255,0.03);
  color: rgba(255,255,255,0.3); cursor: pointer; font-size: 11px;
  display: flex; align-items: center; justify-content: center;
  transition: all 0.15s;
}
.wsch-wp-chelka-close:hover {
  color: rgba(239,68,68,0.8); background: rgba(239,68,68,0.1);
  border-color: rgba(239,68,68,0.2);
}
.wsch-publish-btn.wsch-published {
  border-color: rgba(239,68,68,0.15); color: rgba(239,68,68,0.6);
}
.wsch-publish-btn.wsch-published:hover {
  background: rgba(239,68,68,0.08); color: #ef4444;
}

/* Editor hint */
.wsch-editor-hint {
  font-size: 10px; color: rgba(255,255,255,0.2);
  text-align: center; padding: 0 0 8px;
  font-style: italic;
}

/* ==========================================
   REPORT SCHEDULE — Отчётный график
   ========================================== */

.contr-subtabs {
  display: flex;
  gap: 3px;
  padding: 3px;
  flex-shrink: 0;
  background: rgba(167, 139, 250, 0.04);
  border-radius: 12px;
  border: 1px solid rgba(167, 139, 250, 0.06);
  margin-bottom: 6px;
}

.contr-subtab {
  flex: 1;
  padding: 8px 0;
  border: none;
  background: transparent;
  color: rgba(255,255,255,0.4);
  font-size: 12.5px;
  font-weight: 600;
  border-radius: 9px;
  cursor: pointer;
  transition: all 0.25s ease;
  letter-spacing: 0.3px;
  position: relative;
}

.contr-subtab:hover {
  background: rgba(167, 139, 250, 0.06);
  color: rgba(255,255,255,0.65);
}

.contr-subtab.active {
  background: linear-gradient(135deg, rgba(167, 139, 250, 0.18) 0%, rgba(139, 92, 246, 0.12) 100%);
  color: #d4c6ff;
  box-shadow:
    0 2px 8px rgba(167, 139, 250, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

.contr-subtab.active::after {
  content: '';
  position: absolute;
  bottom: 2px;
  left: 25%;
  right: 25%;
  height: 2px;
  background: linear-gradient(90deg, transparent, #a78bfa, transparent);
  border-radius: 2px;
}

#contrFactualPane > .sch-filters {
  padding: 6px 0 8px;
  gap: 4px;
}

#contrFactualPane > .sch-filters .sch-filter-btn .filter-display {
  height: 34px;
  border-radius: 10px;
  border-color: rgba(167, 139, 250, 0.08);
  background: rgba(167, 139, 250, 0.03);
  font-size: 11px;
}
#contrFactualPane > .sch-filters .sch-filter-btn .filter-display:hover {
  border-color: rgba(167, 139, 250, 0.18);
  background: rgba(167, 139, 250, 0.06);
}

/* ===== Report toolbar ===== */
.rsh-toolbar {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 8px;
  padding: 0 0 6px;
  flex-shrink: 0;
}

.rsh-filters {
  padding: 0;
  flex: 0 0 auto;
}

.rsh-filters .sch-filter-btn .filter-display {
  min-width: 100px;
  padding: 0 12px;
  font-size: 11px;
  overflow: hidden;
  text-overflow: ellipsis;
}

.rsh-filters .sch-filter-btn .filter-display span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.rsh-toolbar-right {
  display: flex;
  align-items: center;
  gap: 10px;
}

/* Report filters: indicator line at BOTTOM (dropdown opens down) */
#rshZoneWrap.filter::after,
#rshContrWrap.filter::after {
  top: auto;
  bottom: -4px;
}

/* Colored dots for report filters */
#rshZoneWrap .filter-display span::before {
  content: ""; display: inline-block;
  width: 6px; height: 6px; border-radius: 50%;
  background: #14b8a6; margin-right: 6px; vertical-align: middle;
}
#rshContrWrap .filter-display span::before {
  content: ""; display: inline-block;
  width: 6px; height: 6px; border-radius: 50%;
  background: #60a5fa; margin-right: 6px; vertical-align: middle;
}

/* Report filter menus open DOWNWARD (override #ws-contractors .filter-menu) */
#ws-contractors #rshZoneMenu,
#ws-contractors #rshContrMenu {
  bottom: auto !important;
  top: calc(100% + 6px) !important;
  left: 0 !important;
  right: 0 !important;
  transform: none !important;
  max-height: 320px;
  box-shadow: 0 12px 36px rgba(0, 0, 0, 0.6);
}

/* ===== Upload button ===== */
.rsh-upload-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 8px 14px;
  border: 1px solid rgba(20, 184, 166, 0.2);
  border-radius: 10px;
  background: rgba(20, 184, 166, 0.1);
  color: #5eead4;
  font-size: 11px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s ease;
  white-space: nowrap;
  letter-spacing: 0.3px;
}

.rsh-upload-btn svg {
  opacity: 0.85;
  flex-shrink: 0;
}

.rsh-upload-btn:hover {
  background: rgba(20, 184, 166, 0.18);
  border-color: rgba(20, 184, 166, 0.35);
  box-shadow: 0 2px 10px rgba(20, 184, 166, 0.12);
  color: #a7f3d0;
}

.rsh-upload-btn:active {
  background: rgba(20, 184, 166, 0.22);
}

.rsh-upload-btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

/* Report body */
.report-sch-body {
  flex: 1;
  display: flex;
  flex-direction: column;
  min-height: 0;
  overflow: hidden;
}

/* ===== Report Schedule — Month title ===== */
.rsh-month-title {
  font-size: 13px;
  font-weight: 700;
  color: rgba(255,255,255,0.75);
  padding: 4px 4px 6px;
  letter-spacing: 0.3px;
}

/* ===== Report Schedule — Table wrapper ===== */
.rsh-table-wrap {
  flex: 1;
  overflow: auto;
  border-radius: 8px;
  border: 1px solid rgba(255,255,255,0.05);
}

/* ===== Report Schedule — Table core ===== */
.report-sch-table {
  table-layout: fixed;
  min-width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  font-size: 10px;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  background: #0a0a0f;
}

.report-sch-table th,
.report-sch-table td {
  padding: 0;
  border-bottom: 1px solid rgba(255,255,255,0.04);
  border-right: 1px solid rgba(255,255,255,0.03);
  white-space: nowrap;
  text-align: center;
  vertical-align: middle;
  overflow: hidden;
}

/* ===== Header row ===== */
.rsh-head-row th {
  position: sticky;
  top: 0;
  z-index: 5;
  background: #0e0e14;
  padding: 5px 3px 4px;
  border-bottom: 1px solid rgba(255,255,255,0.08);
}

.rsh-head-row .rsh-num-col {
  position: sticky;
  left: 0;
  z-index: 8;
  width: 24px;
  background: #0e0e14;
  color: rgba(255,255,255,0.2);
  font-size: 8px;
}

.rsh-head-row .rsh-pos-col {
  position: sticky;
  left: 24px;
  z-index: 8;
  width: 110px;
  text-align: left;
  padding-left: 5px;
  background: #0e0e14;
  color: rgba(255,255,255,0.45);
  font-size: 9px;
  font-weight: 600;
}

.rsh-head-row .rsh-contr-col {
  position: sticky;
  left: 134px;
  z-index: 8;
  width: 60px;
  background: #0e0e14;
  color: rgba(255,255,255,0.45);
  font-size: 8px;
  font-weight: 600;
  box-shadow: 2px 0 6px rgba(0,0,0,0.4);
}

.rsh-head-row .rsh-day-col {
  width: 46px;
  background: #0e0e14;
}

.rsh-day-num {
  font-size: 10px;
  font-weight: 700;
  color: rgba(255,255,255,0.6);
  line-height: 1.2;
}

.rsh-day-dow {
  font-size: 7px;
  font-weight: 500;
  color: rgba(255,255,255,0.3);
  text-transform: uppercase;
  letter-spacing: 0.1px;
}

.rsh-head-row .rsh-weekend {
  background: #0e0e14;
}
.rsh-head-row .rsh-weekend .rsh-day-num { color: rgba(248,113,113,0.6); }
.rsh-head-row .rsh-weekend .rsh-day-dow { color: rgba(248,113,113,0.35); }

.rsh-head-row .rsh-today {
  background: #111118 !important;
}
.rsh-head-row .rsh-today .rsh-day-num { color: rgba(255,255,255,0.85); }
.rsh-head-row .rsh-today .rsh-day-dow { color: rgba(255,255,255,0.5); }

/* ===== Zone row ===== */
.rsh-zone-row td {
  border-top: 2px solid rgba(255,255,255,0.06);
}

.rsh-zone-row .rsh-zone-cell {
  background: linear-gradient(90deg, rgba(255,255,255,0.04) 0%, rgba(255,255,255,0.015) 60%, transparent 100%);
  background-color: #0a0a0f;
  border-left: 3px solid var(--zc-border);
  padding: 9px 12px;
  text-align: left;
  position: sticky;
  left: 0;
  z-index: 3;
  box-shadow: 2px 0 6px rgba(0,0,0,0.4);
}

.rsh-zone-row .rsh-zone-pad {
  background: linear-gradient(90deg, rgba(255,255,255,0.015) 0%, transparent 100%);
  background-color: #0a0a0f;
}

.rsh-zone-label {
  font-size: 11.5px;
  font-weight: 700;
  color: var(--zc-text);
  letter-spacing: 0.3px;
  text-shadow: 0 0 12px var(--zc-border);
}

.rsh-zone-sub {
  display: block;
  font-size: 8.5px;
  font-weight: 400;
  color: rgba(255,255,255,0.4);
  margin-top: 2px;
  letter-spacing: 0.1px;
}

/* ===== Equipment row ===== */
.rsh-equip-row .rsh-equip-cell {
  background: #0a0a0f;
  border-left: 3px solid var(--zc-border);
  padding: 3px 10px 3px 14px;
  text-align: left;
  font-size: 8px;
  font-weight: 600;
  color: var(--zc-text);
  opacity: 0.45;
  text-transform: uppercase;
  letter-spacing: 0.4px;
  position: sticky;
  left: 0;
  z-index: 3;
  box-shadow: 2px 0 6px rgba(0,0,0,0.4);
}

.rsh-equip-row .rsh-equip-pad {
  background: #0a0a0f;
}

/* ===== Position row ===== */
.rsh-pos-row .rsh-num-cell {
  position: sticky;
  left: 0;
  z-index: 2;
  background: #0a0a0f;
  width: 24px;
  color: rgba(255,255,255,0.15);
  font-size: 8px;
  font-weight: 500;
  padding: 3px 2px;
}

.rsh-pos-row.rsh-even .rsh-num-cell {
  background: #0d0d13;
}

.rsh-pos-row .rsh-pos-cell {
  position: sticky;
  left: 24px;
  z-index: 2;
  background: #0a0a0f;
  text-align: left;
  padding: 3px 3px 3px 5px;
  font-weight: 500;
  color: rgba(255,255,255,0.75);
  font-size: 9px;
  width: 110px;
  white-space: normal;
  line-height: 1.2;
  text-overflow: ellipsis;
}

.rsh-pos-row.rsh-even .rsh-pos-cell {
  background: #0d0d13;
}

.rsh-pos-row .rsh-contr-cell {
  position: sticky;
  left: 134px;
  z-index: 2;
  background: #0a0a0f;
  padding: 3px 2px;
  width: 60px;
  box-shadow: 2px 0 6px rgba(0,0,0,0.4);
}

.rsh-pos-row.rsh-even .rsh-contr-cell {
  background: #0d0d13;
}

.rsh-contr-badge {
  display: inline-block;
  padding: 1px 4px;
  border-radius: 2px;
  font-size: 7.5px;
  font-weight: 600;
  letter-spacing: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 54px;
}

/* Hover */
.rsh-pos-row:hover .rsh-num-cell,
.rsh-pos-row:hover .rsh-pos-cell,
.rsh-pos-row:hover .rsh-contr-cell {
  background: #141419 !important;
}
.rsh-pos-row:hover td {
  background: rgba(255,255,255,0.02);
}

/* ===== Day cells (employee) ===== */
.rsh-day-cell {
  padding: 2px 1px;
  font-size: 8.5px;
  color: rgba(255,255,255,0.45);
  width: 46px;
  text-overflow: ellipsis;
}

.rsh-pos-row.rsh-even .rsh-day-cell {
  background: rgba(255,255,255,0.01);
}

.rsh-day-cell.rsh-filled {
  color: rgba(255,255,255,0.9);
  font-weight: 500;
}

.rsh-day-cell.rsh-wknd {
  background: rgba(255,255,255,0.015);
}

.rsh-day-cell.rsh-today {
  background: rgba(255,255,255,0.03) !important;
  box-shadow: inset 0 -2px 0 0 rgba(255,255,255,0.12);
}

.rsh-day-cell.rsh-today.rsh-filled {
  background: rgba(255,255,255,0.04) !important;
}

/* ===== Utilities ===== */
.report-sch-loading {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 60px 20px;
  color: rgba(255,255,255,0.3);
  font-size: 13px;
}

.report-sch-loading::before {
  content: '';
  width: 16px;
  height: 16px;
  border: 2px solid rgba(255,255,255,0.08);
  border-top-color: rgba(255,255,255,0.4);
  border-radius: 50%;
  animation: rsh-spin 0.6s linear infinite;
}

@keyframes rsh-spin {
  to { transform: rotate(360deg); }
}

.report-sch-placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  min-height: 160px;
  color: rgba(255,255,255,0.25);
  font-size: 13px;
  font-style: italic;
}

/* ==========================================
   PHOTO REPORT (ФотоОтчет)
   ========================================== */

/* ============================================
   ФОТООТЧЕТ — Overlay UI
   ============================================ */

#prPhotoContent { text-align: left; }

.pr-loading, .pr-empty {
  display: flex; align-items: center; justify-content: center;
  padding: 48px 16px; color: rgba(255,255,255,0.35); font-size: 14px;
}
.pr-empty-photos {
  padding: 32px 16px; text-align: center;
  color: rgba(255,255,255,0.3); font-size: 13px; line-height: 1.6;
}

.pr-back {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 7px 12px 7px 8px; margin-bottom: 6px;
  color: rgba(96,165,250,0.95); font-size: 13px; font-weight: 600;
  cursor: pointer; user-select: none;
  border-radius: 8px; background: rgba(96,165,250,0.06);
  transition: background 0.15s, color 0.15s;
}
.pr-back:hover { background: rgba(96,165,250,0.14); color: #60a5fa; }
.pr-back-arrow { font-size: 18px; line-height: 1; }

.pr-title-row { padding: 2px 2px 10px; }
.pr-title {
  font-size: 15px; font-weight: 700; color: #fff;
  background: linear-gradient(135deg, #60a5fa 0%, #a78bfa 100%);
  -webkit-background-clip: text; -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* --- Estimate cards --- */
.pr-card {
  background: linear-gradient(135deg, rgba(96,165,250,0.04) 0%, rgba(167,139,250,0.04) 100%);
  border: 1px solid rgba(255,255,255,0.07);
  border-left: 3px solid rgba(96,165,250,0.6);
  border-radius: 12px; padding: 12px 14px; margin-bottom: 8px;
  cursor: pointer; transition: all 0.2s ease;
}
.pr-card:hover {
  background: linear-gradient(135deg, rgba(96,165,250,0.1) 0%, rgba(167,139,250,0.08) 100%);
  border-color: rgba(96,165,250,0.3); transform: translateX(2px);
  box-shadow: 0 4px 16px rgba(96,165,250,0.08);
}
.pr-card-top { display: flex; align-items: center; gap: 10px; }
.pr-card-date {
  flex-shrink: 0; font-size: 11px; font-weight: 700;
  color: rgba(96,165,250,0.9); padding: 3px 8px; border-radius: 6px;
  background: rgba(96,165,250,0.1); border: 1px solid rgba(96,165,250,0.15);
}
.pr-card-event {
  flex: 1; font-size: 13px; font-weight: 600; color: rgba(255,255,255,0.88);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

.pr-badge {
  flex-shrink: 0; min-width: 22px; height: 22px; padding: 0 7px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 11px; font-size: 11px; font-weight: 700;
  background: rgba(167,139,250,0.12);
  color: rgba(167,139,250,0.9);
  border: 1px solid rgba(167,139,250,0.18);
}

.pr-pos-name {
  flex: 1; font-size: 13px; font-weight: 500;
  color: rgba(255,255,255,0.82);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  transition: color 0.2s;
}
.pr-pos-row:hover .pr-pos-name { color: rgba(255,255,255,0.95); }
.pr-pos-arrow {
  color: rgba(255,255,255,0.12); font-size: 18px; flex-shrink: 0;
  transition: all 0.18s;
}
.pr-pos-row:hover .pr-pos-arrow {
  color: rgba(255,255,255,0.35); transform: translateX(3px);
}

/* --- Action buttons --- */
.pr-actions { display: flex; gap: 10px; margin-bottom: 14px; }
.pr-action-btn {
  flex: 1; display: inline-flex; align-items: center; justify-content: center;
  gap: 8px; padding: 11px 12px; border-radius: 12px;
  border: 1px solid; font-size: 13px; font-weight: 700;
  cursor: pointer; transition: all 0.2s ease; text-decoration: none;
}
.pr-btn-camera {
  border-color: rgba(96,165,250,0.3); color: #60a5fa;
  background: linear-gradient(135deg, rgba(96,165,250,0.08), rgba(96,165,250,0.03));
}
.pr-btn-camera:hover {
  background: linear-gradient(135deg, rgba(96,165,250,0.18), rgba(96,165,250,0.08));
  border-color: rgba(96,165,250,0.5); box-shadow: 0 4px 20px rgba(96,165,250,0.12);
  transform: translateY(-1px);
}
.pr-btn-upload {
  border-color: rgba(52,211,153,0.3); color: #34d399;
  background: linear-gradient(135deg, rgba(52,211,153,0.08), rgba(52,211,153,0.03));
}
.pr-btn-upload:hover {
  background: linear-gradient(135deg, rgba(52,211,153,0.18), rgba(52,211,153,0.08));
  border-color: rgba(52,211,153,0.5); box-shadow: 0 4px 20px rgba(52,211,153,0.12);
  transform: translateY(-1px);
}

/* --- Photo grid --- */
.pr-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(130px, 1fr));
  gap: 10px;
}
.pr-photo-card {
  border-radius: 12px; overflow: hidden;
  background: rgba(255,255,255,0.02);
  border: 1px solid rgba(255,255,255,0.06);
  transition: all 0.2s ease;
}
.pr-photo-card:hover {
  border-color: rgba(96,165,250,0.3);
  box-shadow: 0 4px 16px rgba(96,165,250,0.08);
  transform: translateY(-2px);
}
.pr-photo-img-wrap {
  position: relative; aspect-ratio: 3/4; overflow: hidden; background: #0a0a0a;
}
.pr-photo-img-wrap img {
  width: 100%; height: 100%; object-fit: cover; cursor: grab;
  transition: transform 0.3s ease;
}
.pr-photo-card:hover .pr-photo-img-wrap img { transform: scale(1.03); }
.pr-photo-img-wrap img:active { cursor: grabbing; }
.pr-photo-del {
  position: absolute; top: 5px; right: 5px; width: 26px; height: 26px;
  border-radius: 8px; border: none;
  background: rgba(239,68,68,0.15); backdrop-filter: blur(8px);
  color: #ef4444; font-size: 15px; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  opacity: 0; transition: opacity 0.2s, background 0.15s;
}
.pr-photo-del:hover { background: rgba(239,68,68,0.35); }
.pr-photo-card:hover .pr-photo-del { opacity: 1; }
.pr-photo-comment-wrap { padding: 6px 8px; }
.pr-photo-comment {
  width: 100%; box-sizing: border-box;
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.06); border-radius: 6px;
  color: rgba(255,255,255,0.75); font-size: 11px; padding: 5px 7px;
  outline: none; transition: border-color 0.2s;
}
.pr-photo-comment:focus { border-color: rgba(167,139,250,0.5); }
.pr-photo-comment::placeholder { color: rgba(255,255,255,0.18); }

/* ============================================
   CAMERA SCREEN — fullscreen inside overlay
   ============================================ */
.pr-camera-wrap {
  display: flex; flex-direction: column; align-items: center;
  height: 100%; min-height: 0; flex: 1;
}
.pr-camera-viewport {
  position: relative; width: 100%; flex: 1; min-height: 0;
  background: #000; border-radius: 16px; overflow: hidden;
  border: 2px solid rgba(255,255,255,0.08);
  box-shadow: 0 0 40px rgba(0,0,0,0.5), inset 0 0 60px rgba(0,0,0,0.3);
}
.pr-camera-viewport video {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: contain; background: #000;
}
.pr-camera-viewport canvas {
  display: none;
}
.pr-cam-overlay-canvas {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: contain; pointer-events: none; z-index: 2;
}
.pr-cam-actions {
  position: absolute; bottom: 20px; left: 0; right: 0;
  display: flex; align-items: center; justify-content: center;
  gap: 24px; z-index: 10; pointer-events: none;
}
.pr-cam-actions > * { pointer-events: auto; }

.pr-cam-btn {
  width: 50px; height: 50px; border-radius: 50%;
  border: 2px solid rgba(255,255,255,0.25);
  background: linear-gradient(135deg, rgba(30,30,40,0.8), rgba(15,15,25,0.9));
  backdrop-filter: blur(12px); color: #e8e8ec;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; transition: all 0.2s ease;
  box-shadow: 0 4px 16px rgba(0,0,0,0.3);
}
.pr-cam-btn:hover {
  border-color: rgba(255,255,255,0.45);
  transform: scale(1.08);
  box-shadow: 0 6px 24px rgba(0,0,0,0.4);
}
.pr-cam-btn.active {
  color: #fbbf24; border-color: rgba(251,191,36,0.6);
  background: linear-gradient(135deg, rgba(251,191,36,0.15), rgba(251,191,36,0.05));
  box-shadow: 0 0 16px rgba(251,191,36,0.2);
}

.pr-cam-shutter {
  width: 72px; height: 72px; border-radius: 50%;
  border: 4px solid rgba(255,255,255,0.9);
  background: radial-gradient(circle, rgba(255,255,255,0.3) 0%, rgba(255,255,255,0.1) 70%);
  cursor: pointer; transition: all 0.2s ease; position: relative;
  box-shadow: 0 0 20px rgba(255,255,255,0.08), inset 0 0 20px rgba(255,255,255,0.05);
}
.pr-cam-shutter::before {
  content: ''; position: absolute; inset: 6px; border-radius: 50%;
  border: 2px solid rgba(255,255,255,0.15);
}
.pr-cam-shutter:hover {
  background: radial-gradient(circle, rgba(255,255,255,0.45) 0%, rgba(255,255,255,0.15) 70%);
  transform: scale(1.06);
  box-shadow: 0 0 30px rgba(255,255,255,0.15);
}
.pr-cam-shutter:active { transform: scale(0.95); }
.pr-cam-shutter.retake {
  border-color: rgba(239,68,68,0.7);
  background: radial-gradient(circle, rgba(239,68,68,0.25) 0%, rgba(239,68,68,0.08) 70%);
  box-shadow: 0 0 20px rgba(239,68,68,0.15);
}
.pr-cam-shutter.retake::before { border-color: rgba(239,68,68,0.2); }
.pr-cam-shutter.retake::after {
  content: '✕'; position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  color: #fff; font-size: 24px; font-weight: 300;
}

/* Мгновенная «вспышка» затвора поверх превью — видно, что кадр снят */
.pr-shutter-flash {
  position: absolute;
  inset: 0;
  z-index: 8;
  pointer-events: none;
  border-radius: inherit;
  background: #fff;
  opacity: 0;
  will-change: opacity;
}
.pr-shutter-flash--bang {
  animation: pr-shutter-bang 0.38s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}
@keyframes pr-shutter-bang {
  0% { opacity: 0; }
  12% { opacity: 1; }
  28% { opacity: 0.72; }
  100% { opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .pr-shutter-flash--bang {
    animation: pr-shutter-bang-reduced 0.14s ease-out forwards;
  }
  @keyframes pr-shutter-bang-reduced {
    0% { opacity: 0; }
    35% { opacity: 0.55; }
    100% { opacity: 0; }
  }
}

.pr-cam-shutter.firing {
  transform: scale(0.88);
  border-color: rgba(96, 165, 250, 0.95);
  box-shadow:
    0 0 0 3px rgba(96, 165, 250, 0.35),
    0 0 28px rgba(96, 165, 250, 0.45),
    inset 0 0 16px rgba(255, 255, 255, 0.35);
  transition: transform 0.12s ease, box-shadow 0.12s ease, border-color 0.12s ease;
}
.pr-cam-shutter.saving {
  opacity: 0.88;
  pointer-events: none;
  transform: scale(0.94);
  border-color: rgba(52, 211, 153, 0.65);
  background: radial-gradient(circle, rgba(52, 211, 153, 0.35) 0%, rgba(52, 211, 153, 0.08) 72%);
  box-shadow:
    0 0 0 2px rgba(52, 211, 153, 0.25),
    0 0 24px rgba(52, 211, 153, 0.25);
  animation: pr-shutter-saving-pulse 1.1s ease-in-out infinite;
}
@keyframes pr-shutter-saving-pulse {
  0%, 100% { box-shadow: 0 0 0 2px rgba(52, 211, 153, 0.2), 0 0 18px rgba(52, 211, 153, 0.2); }
  50% { box-shadow: 0 0 0 4px rgba(52, 211, 153, 0.35), 0 0 28px rgba(52, 211, 153, 0.35); }
}

.pr-cam-confirm {
  width: 72px; height: 72px; border-radius: 50%;
  border: 4px solid rgba(52,211,153,0.8);
  background: radial-gradient(circle, rgba(52,211,153,0.35) 0%, rgba(52,211,153,0.1) 70%);
  cursor: pointer; display: flex; align-items: center; justify-content: center;
  color: #fff; font-size: 26px; transition: all 0.2s ease;
  box-shadow: 0 0 20px rgba(52,211,153,0.15);
}
.pr-cam-confirm::after { content: '✓'; font-weight: 600; }
.pr-cam-confirm:hover {
  background: radial-gradient(circle, rgba(52,211,153,0.5) 0%, rgba(52,211,153,0.15) 70%);
  transform: scale(1.06);
  box-shadow: 0 0 30px rgba(52,211,153,0.25);
}
.pr-cam-confirm:active { transform: scale(0.95); }
.pr-cam-confirm.saving { opacity: 0.5; pointer-events: none; }

.pr-cam-topbar {
  display: flex; align-items: center; gap: 8px;
  padding: 6px 10px; flex-shrink: 0;
}
.pr-cam-topbar .pr-back { margin-bottom: 0; }
.pr-cam-topbar .pr-cam-label {
  flex: 1; margin-top: 0;
}
.pr-cam-label {
  font-size: 13px; font-weight: 600; text-align: center;
  padding: 8px 16px; margin-top: 4px;
  color: rgba(167,139,250,0.85);
  background: rgba(167,139,250,0.06); border-radius: 8px;
  border: 1px solid rgba(167,139,250,0.12);
}

/* ============================================
   EDITOR: "Из отчёта" inline picker (photo modal)
   ============================================ */
.pr-picker-wrap {
  border-top: 1px solid rgba(167,139,250,0.12);
  padding: 10px 0 0; margin-top: 10px;
}
.pr-picker-title {
  font-size: 11px; font-weight: 800; text-transform: uppercase;
  letter-spacing: 0.8px; padding-bottom: 8px;
  color: #ffffff;
}
.pr-picker-grid { display: flex; gap: 6px; flex-wrap: wrap; }
.pr-picker-thumb {
  width: 72px; height: 96px; border-radius: 8px; overflow: hidden;
  border: 2px solid rgba(255,255,255,0.06); cursor: pointer;
  transition: all 0.2s ease; background: #0a0a0a;
}
.pr-picker-thumb:hover {
  border-color: rgba(167,139,250,0.5);
  box-shadow: 0 4px 16px rgba(167,139,250,0.12);
  transform: translateY(-2px);
}
.pr-picker-thumb img {
  width: 100%; height: 100%; object-fit: cover; cursor: grab;
}
.pr-picker-thumb img:active { cursor: grabbing; }
.pr-picker-empty { font-size: 12px; color: rgba(255,255,255,0.25); padding: 8px 0; }

/* ============================================
   EDITOR: Floating photo sheet (inside window)
   ============================================ */
.pr-float-sheet {
  position: absolute; bottom: 0; left: 0; right: 0; z-index: 50;
  display: flex; flex-direction: column;
  border-radius: 14px 14px 0 0;
  background: rgba(16,16,20,0.97);
  backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
  max-height: 45%;
  animation: prSheetSlideUp 0.22s ease-out;
  border-top: 1px solid rgba(167,139,250,0.25);
  box-shadow: 0 -6px 30px rgba(0,0,0,0.5), 0 -1px 8px rgba(167,139,250,0.1);
}
@keyframes prSheetSlideUp {
  from { transform: translateY(100%); }
  to   { transform: translateY(0); }
}
.pr-float-chelka {
  position: relative; flex-shrink: 0;
  display: flex; flex-direction: column; align-items: center;
  cursor: ns-resize;
  background: rgba(16,16,20,0.98);
  border-bottom: 1px solid rgba(255,255,255,0.06);
  border-radius: 14px 14px 0 0;
  padding: 0 16px; transition: background 0.15s;
  user-select: none;
}
.pr-float-chelka:hover { background: rgba(25,25,40,0.98); }
.pr-float-grip {
  width: 36px; height: 4px; border-radius: 2px;
  background: rgba(167,139,250,0.2); margin: 8px 0 4px;
  transition: background 0.15s;
}
.pr-float-chelka:hover .pr-float-grip { background: rgba(167,139,250,0.45); }
.pr-float-chelka:active .pr-float-grip { background: rgba(167,139,250,0.7); }
.pr-float-title {
  font-size: 10px; font-weight: 700;
  color: #ffffff; letter-spacing: 0.4px;
  pointer-events: none; padding-bottom: 8px;
  text-transform: uppercase;
}
.pr-float-close {
  position: absolute; right: 14px; top: 50%; transform: translateY(-50%);
  width: 24px; height: 24px; border-radius: 6px;
  border: 1px solid rgba(255,255,255,0.06);
  background: rgba(255,255,255,0.03);
  color: rgba(255,255,255,0.3); cursor: pointer; font-size: 14px;
  display: flex; align-items: center; justify-content: center;
  transition: all 0.15s;
}
.pr-float-close:hover {
  color: rgba(167,139,250,0.9); background: rgba(167,139,250,0.12);
  border-color: rgba(167,139,250,0.25);
}

/* Collapsed state — only header visible */
.pr-float-sheet.pr-float-collapsed {
  max-height: none !important;
  border-top-color: rgba(167,139,250,0.12);
  box-shadow: 0 -2px 12px rgba(0,0,0,0.3);
}
.pr-float-sheet.pr-float-collapsed .pr-float-body {
  display: none;
}
.pr-float-sheet.pr-float-collapsed .pr-float-chelka {
  border-bottom: none;
  border-radius: 14px 14px 0 0;
}
.pr-float-sheet.pr-float-collapsed .pr-float-grip {
  background: rgba(167,139,250,0.12);
}
.pr-float-sheet.pr-float-collapsed .pr-float-title {
  color: rgba(255,255,255,0.35);
}

.pr-float-body {
  display: flex; flex-direction: column; flex: 1; min-height: 0;
  overflow-y: auto; scrollbar-width: thin;
  padding: 10px 16px 20px;
}
.pr-drawer-grid {
  display: flex; gap: 8px; flex-wrap: wrap;
}
.pr-drawer-thumb {
  width: 80px; position: relative; border-radius: 10px;
  overflow: hidden; background: #0a0a0a;
  border: 2px solid rgba(255,255,255,0.06);
  cursor: pointer; transition: all 0.2s ease;
}
.pr-drawer-thumb:hover {
  border-color: rgba(167,139,250,0.5);
  box-shadow: 0 4px 16px rgba(167,139,250,0.12);
  transform: translateY(-2px);
}
.pr-drawer-thumb.pr-drawer-selected {
  border-color: rgba(96,165,250,0.7);
  box-shadow: 0 0 12px rgba(96,165,250,0.25);
  transform: translateY(-2px);
}
.pr-drawer-actions {
  position: absolute; bottom: 18px; left: 0; right: 0;
  display: flex; justify-content: center; gap: 4px;
  opacity: 0; transition: opacity 0.2s;
  pointer-events: none;
}
.pr-drawer-thumb:hover .pr-drawer-actions {
  opacity: 1; pointer-events: auto;
}
.pr-drawer-zoom-btn, .pr-drawer-insert-btn {
  width: 28px; height: 28px; border-radius: 7px;
  border: 1px solid rgba(255,255,255,0.15);
  background: rgba(0,0,0,0.7); backdrop-filter: blur(8px);
  color: #fff; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: all 0.15s;
}
.pr-drawer-zoom-btn:hover {
  background: rgba(96,165,250,0.3); border-color: rgba(96,165,250,0.5);
}
.pr-drawer-insert-btn:hover {
  background: rgba(52,211,153,0.3); border-color: rgba(52,211,153,0.5);
}
.pr-drawer-thumb img {
  width: 100%; aspect-ratio: 3/4; object-fit: cover;
  cursor: grab; display: block;
}
.pr-drawer-thumb img:active { cursor: grabbing; }
.pr-drawer-comment {
  display: block; padding: 3px 5px; font-size: 9px;
  color: rgba(255,255,255,0.5); line-height: 1.3;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.pr-drawer-cmt-tip {
  display: none; position: absolute; left: -6px; right: -6px; top: 100%;
  margin-top: 4px; z-index: 30;
  background: linear-gradient(135deg, #1e1e2a 0%, #1a1a26 100%);
  border: 1px solid rgba(167,139,250,0.3);
  border-radius: 8px; padding: 6px 8px;
  color: rgba(232,232,240,0.92); font-size: 10px; line-height: 1.4;
  box-shadow: 0 6px 20px rgba(0,0,0,0.5), 0 0 12px rgba(167,139,250,0.08);
  white-space: normal; word-break: break-word;
  pointer-events: none;
  animation: estCmtPopIn 0.12s ease;
}
.pr-drawer-thumb:hover .pr-drawer-cmt-tip { display: block; }
.pr-drawer-empty {
  padding: 16px; text-align: center;
  color: rgba(255,255,255,0.25); font-size: 12px;
}
.pr-picker-loading {
  padding: 16px; text-align: center;
  color: rgba(255,255,255,0.3); font-size: 12px;
}

/* --- Photo lightbox (inside sheet) --- */
.pr-lightbox-inner {
  position: absolute; inset: 0; z-index: 60;
  background: rgba(10,10,14,0.95); backdrop-filter: blur(10px);
  display: flex; align-items: center; justify-content: center;
  cursor: zoom-out; opacity: 0; transition: opacity 0.2s;
  border-radius: inherit;
}
.pr-lightbox-inner.show { opacity: 1; }
.pr-lightbox-inner img {
  max-width: 92%; max-height: 88%;
  object-fit: contain; border-radius: 8px;
  box-shadow: 0 4px 40px rgba(0,0,0,0.5);
  cursor: default;
}
.pr-lb-close {
  position: absolute; top: 10px; right: 10px; z-index: 5;
  width: 30px; height: 30px; border-radius: 8px;
  border: 1px solid rgba(255,255,255,0.15);
  background: rgba(0,0,0,0.6); backdrop-filter: blur(8px);
  color: rgba(255,255,255,0.7); cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: all 0.15s;
}
.pr-lb-close:hover {
  color: #fff; background: rgba(239,68,68,0.3);
  border-color: rgba(239,68,68,0.4);
}

/* --- Zone picker popup --- */
.pr-zone-picker {
  background: rgba(22,22,28,0.97); backdrop-filter: blur(14px);
  border: 1px solid rgba(167,139,250,0.2);
  border-radius: 12px; padding: 6px;
  min-width: 140px; max-width: 220px;
  box-shadow: 0 8px 32px rgba(0,0,0,0.5);
  z-index: 100; animation: prZpIn 0.15s ease-out;
}
@keyframes prZpIn {
  from { opacity: 0; transform: translateY(6px); }
  to   { opacity: 1; transform: translateY(0); }
}
.pr-zp-title {
  font-size: 10px; font-weight: 800; text-transform: uppercase;
  letter-spacing: 0.6px; color: rgba(167,139,250,0.6);
  padding: 6px 10px 4px; border-bottom: 1px solid rgba(255,255,255,0.05);
}
.pr-zp-slide-label {
  font-size: 9px; font-weight: 700; text-transform: uppercase;
  letter-spacing: 0.5px; color: rgba(96,165,250,0.5);
  padding: 8px 8px 2px;
}
.pr-zp-zone-btn {
  display: flex; align-items: center; gap: 8px; width: 100%;
  padding: 7px 10px; border-radius: 8px; border: none;
  background: transparent; color: rgba(255,255,255,0.8);
  font-size: 12px; font-weight: 600; cursor: pointer;
  transition: background 0.15s;
}
.pr-zp-zone-btn:hover { background: rgba(167,139,250,0.12); }
.pr-zp-dot {
  width: 10px; height: 10px; border-radius: 50%; flex-shrink: 0;
}
.pr-zp-zone-name { flex: 1; }
.pr-zp-has-photo {
  font-size: 9px; font-weight: 600; color: rgba(52,211,153,0.7);
  padding: 1px 5px; border-radius: 4px;
  background: rgba(52,211,153,0.08); border: 1px solid rgba(52,211,153,0.12);
}

/* --- Estimate comment --- */
.pr-est-comment-wrap { margin-bottom: 10px; }
.pr-est-comment {
  width: 100%; box-sizing: border-box;
  background: rgba(167,139,250,0.04);
  border: 1px solid rgba(167,139,250,0.12); border-radius: 10px;
  color: #e8e8ec; font-size: 13px; padding: 9px 12px;
  resize: vertical; font-family: inherit; transition: border-color 0.2s;
}
.pr-est-comment:focus { outline: none; border-color: rgba(167,139,250,0.5); }
.pr-est-comment::placeholder { color: rgba(255,255,255,0.2); }

/* --- Stats cards grid --- */
.pr-stats-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
  gap: 8px; padding: 6px 2px 14px;
  margin-bottom: 6px;
}
.pr-stat-card {
  position: relative; overflow: hidden;
  display: flex; align-items: center; gap: 10px;
  padding: 10px 12px; border-radius: 12px;
  background: rgba(255,255,255,0.025);
  border: 1px solid rgba(255,255,255,0.06);
  transition: all 0.25s ease;
  animation: prCardIn 0.3s ease both;
}
@keyframes prCardIn {
  from { opacity: 0; transform: translateY(6px) scale(0.97); }
  to   { opacity: 1; transform: none; }
}
.pr-stat-card:hover {
  background: rgba(255,255,255,0.04);
  border-color: color-mix(in srgb, var(--sc, #60a5fa) 25%, transparent);
  transform: translateY(-1px);
}
.pr-stat-card.has-photos {
  background: color-mix(in srgb, var(--sc, #60a5fa) 6%, transparent);
  border-color: color-mix(in srgb, var(--sc, #60a5fa) 18%, transparent);
}
.pr-stat-card-icon {
  display: flex; align-items: center; justify-content: center;
  width: 36px; height: 36px; border-radius: 10px; flex-shrink: 0;
  background: color-mix(in srgb, var(--sc, #60a5fa) 10%, transparent);
  border: 1px solid color-mix(in srgb, var(--sc, #60a5fa) 8%, transparent);
  color: var(--sc, #60a5fa); opacity: 0.4;
  transition: all 0.25s;
}
.pr-stat-card.has-photos .pr-stat-card-icon,
.pr-stat-card-total .pr-stat-card-icon {
  opacity: 1;
  border-color: color-mix(in srgb, var(--sc, #60a5fa) 20%, transparent);
}
.pr-stat-card-body { flex: 1; min-width: 0; }
.pr-stat-card-name {
  font-size: 10px; font-weight: 600; text-transform: uppercase;
  letter-spacing: 0.6px; color: rgba(255,255,255,0.35);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  line-height: 1.3;
}
.pr-stat-card.has-photos .pr-stat-card-name,
.pr-stat-card-total .pr-stat-card-name { color: rgba(255,255,255,0.55); }
.pr-stat-card-num {
  font-size: 22px; font-weight: 800; line-height: 1.1;
  color: rgba(255,255,255,0.25);
  font-variant-numeric: tabular-nums;
}
.pr-stat-card.has-photos .pr-stat-card-num { color: var(--sc, #60a5fa); }
.pr-stat-card-total .pr-stat-card-num { color: var(--sc, #a78bfa); }
.pr-stat-card-glow {
  position: absolute; top: -50%; right: -30%; width: 80px; height: 80px;
  border-radius: 50%; pointer-events: none;
  background: radial-gradient(circle, color-mix(in srgb, var(--sc, #60a5fa) 8%, transparent) 0%, transparent 70%);
  opacity: 0; transition: opacity 0.3s;
}
.pr-stat-card.has-photos .pr-stat-card-glow,
.pr-stat-card-total .pr-stat-card-glow { opacity: 1; }
.pr-stat-card-total {
  background: rgba(167,139,250,0.05);
  border-color: rgba(167,139,250,0.15);
}

/* --- Position rows (polished) --- */
.pr-pos-row {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 12px; border-radius: 12px; cursor: pointer;
  transition: all 0.18s ease; border: 1px solid transparent;
  margin: 2px 0;
}
.pr-pos-row:hover {
  background: rgba(255,255,255,0.035);
  border-color: rgba(255,255,255,0.06);
  transform: translateX(3px);
  box-shadow: 0 2px 12px rgba(0,0,0,0.12);
}
.pr-pos-row:active { transform: translateX(3px) scale(0.995); }
.pr-pos-row.checked {
  background: linear-gradient(135deg, rgba(52,211,153,0.05), rgba(52,211,153,0.02));
  border-color: rgba(52,211,153,0.12);
}
.pr-pos-row.checked .pr-pos-name {
  color: rgba(52,211,153,0.85);
}
.pr-pos-row.checked .pr-pos-arrow { color: rgba(52,211,153,0.3); }
.pr-pos-row.checked .pr-badge {
  background: rgba(52,211,153,0.12); color: #34d399;
  border-color: rgba(52,211,153,0.20);
}

/* --- Position check button --- */
.pr-pos-check {
  display: flex; align-items: center; justify-content: center;
  width: 28px; height: 28px; border-radius: 8px; flex-shrink: 0;
  border: 2px solid rgba(255,255,255,0.12); background: rgba(255,255,255,0.03);
  color: rgba(255,255,255,0.08); cursor: pointer; padding: 0;
  transition: all 0.22s ease; position: relative;
}
.pr-pos-check svg { transition: transform 0.2s; }
.pr-pos-check:hover {
  border-color: rgba(52,211,153,0.45);
  color: rgba(52,211,153,0.55);
  background: rgba(52,211,153,0.06);
  transform: scale(1.08);
}
.pr-pos-check.checked {
  border-color: #34d399;
  background: linear-gradient(135deg, rgba(52,211,153,0.20), rgba(52,211,153,0.10));
  color: #34d399;
  box-shadow: 0 0 12px rgba(52,211,153,0.20), inset 0 0 8px rgba(52,211,153,0.08);
}
.pr-pos-check.checked svg { transform: scale(1.1); }

/* --- Photo report modal header --- */
#modal-photo-report .est-modal-content {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
  display: block;
  -webkit-overflow-scrolling: touch;
}
.pr-modal-header {
  height: 52px; flex-shrink: 0;
  display: flex; align-items: center; gap: 8px;
  padding: 0 10px; position: relative;
  background: linear-gradient(180deg, rgba(96,165,250,0.06) 0%, rgba(96,165,250,0.01) 100%);
  border-bottom: 1px solid rgba(96,165,250,0.15);
  border-radius: inherit; border-bottom-left-radius: 0; border-bottom-right-radius: 0;
}
.pr-header-left {
  display: flex; align-items: center; gap: 6px; flex-shrink: 0;
}
.pr-dock-group { display: none; }
.pr-dock-controls {
  flex-direction: row; align-items: center;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 10px; overflow: hidden;
}
.pr-dock-controls .dock-btn + .dock-btn { border-left: 1px solid rgba(255,255,255,0.06); }
@media (min-width: 1080px) { .pr-dock-group { display: flex; } }
.pr-modal-title {
  flex: 1; min-width: 0;
  font-weight: 700; font-size: 15px; color: #93bbfc;
  text-align: center; white-space: nowrap;
  overflow: hidden; text-overflow: ellipsis;
  padding: 0 4px;
}
.pr-header-right {
  display: flex; align-items: center; gap: 4px; flex-shrink: 0;
}
.pr-back-btn, .pr-close-btn {
  display: flex; align-items: center; justify-content: center;
  width: 32px; height: 32px; border-radius: 8px; border: none;
  cursor: pointer; transition: all 0.18s; padding: 0;
}
.pr-back-btn {
  background: rgba(255,255,255,0.05); color: rgba(255,255,255,0.45);
}
.pr-back-btn:hover {
  background: rgba(96,165,250,0.12); color: #60a5fa;
}
.pr-close-btn {
  background: rgba(231,76,60,0.08); color: rgba(231,76,60,0.55);
  border: 1px solid rgba(231,76,60,0.12);
}
.pr-close-btn:hover {
  background: rgba(231,76,60,0.9); color: #fff;
}

/* --- Position comment button & area --- */
.pr-pos-cmt-btn {
  display: flex; align-items: center; justify-content: center;
  width: 30px; height: 30px; border-radius: 50%; border: 1.5px solid rgba(255,255,255,0.06);
  background: rgba(255,255,255,0.02); color: rgba(255,255,255,0.18); cursor: pointer;
  flex-shrink: 0; transition: all 0.22s ease; padding: 0;
  position: relative;
}
.pr-pos-cmt-btn:hover {
  background: rgba(167,139,250,0.10); border-color: rgba(167,139,250,0.25);
  color: #a78bfa; transform: scale(1.1);
  box-shadow: 0 0 10px rgba(167,139,250,0.12);
}
.pr-pos-cmt-btn.has-comment {
  color: #c4b5fd; background: rgba(167,139,250,0.10);
  border-color: rgba(167,139,250,0.30);
}
.pr-pos-cmt-btn.has-comment::after {
  content: ''; position: absolute; top: 2px; right: 2px;
  width: 6px; height: 6px; border-radius: 50%;
  background: #a78bfa; box-shadow: 0 0 6px rgba(167,139,250,0.5);
}
.pr-pos-cmt-area {
  padding: 4px 12px 10px;
  animation: prCmtSlide 0.2s ease;
}
@keyframes prCmtSlide { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }
.pr-pos-cmt-input {
  width: 100%; box-sizing: border-box;
  background: rgba(167,139,250,0.03);
  border: 1px solid rgba(167,139,250,0.10); border-radius: 10px;
  color: #e8e8ec; font-size: 12px; padding: 8px 12px;
  font-family: inherit; transition: border-color 0.2s, box-shadow 0.2s;
}
.pr-pos-cmt-input:focus {
  outline: none; border-color: rgba(167,139,250,0.40);
  box-shadow: 0 0 12px rgba(167,139,250,0.08), 0 0 0 3px rgba(167,139,250,0.04);
}
.pr-pos-cmt-input::placeholder { color: rgba(255,255,255,0.15); }

/* --- Position action buttons (upload/camera) --- */
.pr-pos-actions {
  display: flex; align-items: center; gap: 4px; flex-shrink: 0;
}
.pr-pos-act-btn {
  display: flex; align-items: center; justify-content: center;
  width: 30px; height: 30px; border-radius: 8px;
  border: 1.5px solid rgba(255,255,255,0.06); background: rgba(255,255,255,0.02);
  color: rgba(255,255,255,0.25); cursor: pointer; padding: 0;
  transition: all 0.2s ease; flex-shrink: 0;
}
.pr-act-upload:hover {
  background: rgba(52,211,153,0.10); border-color: rgba(52,211,153,0.25);
  color: #34d399; transform: scale(1.08);
}
.pr-act-camera:hover {
  background: rgba(96,165,250,0.10); border-color: rgba(96,165,250,0.25);
  color: #60a5fa; transform: scale(1.08);
}

/* --- Position item wrapper --- */
.pr-pos-item { border-radius: 12px; transition: background 0.2s; }
.pr-pos-item.expanded {
  background: rgba(255,255,255,0.015);
  margin: 4px 0;
}

/* --- Inline photos area --- */
.pr-pos-photos {
  padding: 4px 10px 10px;
  animation: prPhotosSlide 0.2s ease;
}
@keyframes prPhotosSlide { from { opacity: 0; max-height: 0; } to { opacity: 1; max-height: 2000px; } }
.pr-pos-photos-loading {
  padding: 12px; text-align: center;
  font-size: 12px; color: rgba(255,255,255,0.25);
}
.pr-inline-empty {
  display: flex; align-items: center; gap: 8px;
  padding: 14px 8px; color: rgba(255,255,255,0.18); font-size: 12px;
}
.pr-inline-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(90px, 1fr));
  gap: 6px;
}
.pr-inline-wrap { position: relative; }
.pr-inline-photo {
  position: relative; border-radius: 10px; overflow: hidden;
  aspect-ratio: 1; background: rgba(0,0,0,0.3);
  border: 1px solid rgba(255,255,255,0.06);
  transition: all 0.2s;
}
.pr-inline-photo:hover {
  border-color: rgba(96,165,250,0.20);
  box-shadow: 0 4px 16px rgba(0,0,0,0.25);
}
.pr-inline-photo img {
  width: 100%; height: 100%; object-fit: cover; display: block;
}

/* --- Delete button (always visible) --- */
.pr-inline-del {
  position: absolute; top: 4px; right: 4px;
  width: 24px; height: 24px; border-radius: 6px;
  background: rgba(0,0,0,0.6); border: 1px solid rgba(248,113,113,0.25);
  color: rgba(248,113,113,0.7); font-size: 15px; font-weight: 700;
  cursor: pointer; display: flex; align-items: center; justify-content: center;
  transition: all 0.15s; backdrop-filter: blur(4px);
}
.pr-inline-del:hover {
  background: rgba(248,113,113,0.85); color: #fff;
  border-color: transparent;
}

/* --- Photo comment button (always visible, bottom center) --- */
.pr-inline-cmt-btn {
  position: absolute; bottom: 4px; left: 50%; transform: translateX(-50%);
  width: 28px; height: 28px; border-radius: 6px;
  background: rgba(0,0,0,0.6); border: 1px solid rgba(255,255,255,0.12);
  color: rgba(255,255,255,0.5); cursor: pointer; padding: 0;
  display: flex; align-items: center; justify-content: center;
  transition: all 0.18s; backdrop-filter: blur(4px);
}
.pr-inline-cmt-btn.has-cmt {
  color: #c4b5fd; background: rgba(167,139,250,0.35);
  border-color: rgba(167,139,250,0.5);
}
.pr-inline-cmt-btn:hover {
  background: rgba(167,139,250,0.5); color: #fff;
  border-color: rgba(167,139,250,0.6); transform: translateX(-50%) scale(1.08);
}

/* --- Photo comment field (floats below, doesn't affect grid) --- */
.pr-inline-cmt-field {
  position: absolute; left: -4px; right: -4px; top: 100%;
  z-index: 10; padding: 6px 4px 4px;
  background: #16161b; border-radius: 0 0 8px 8px;
  box-shadow: 0 6px 16px rgba(0,0,0,0.4);
  animation: prCmtSlide 0.12s ease;
}
.pr-inline-cmt-input {
  width: 100%; box-sizing: border-box;
  background: #1e1e24;
  border: 1px solid rgba(255,255,255,0.10); border-radius: 8px;
  color: #e8e8ec; font-size: 11px; padding: 6px 8px;
  font-family: inherit; transition: border-color 0.2s, box-shadow 0.2s;
}
.pr-inline-cmt-input:focus {
  outline: none; border-color: rgba(167,139,250,0.35);
  box-shadow: 0 0 8px rgba(167,139,250,0.08);
}
.pr-inline-cmt-input::placeholder { color: rgba(255,255,255,0.15); }

/* --- Section titles (polished) --- */
.pr-section-title {
  font-size: 10px; font-weight: 800; text-transform: uppercase;
  letter-spacing: 1.2px; color: rgba(147,187,252,0.7);
  padding: 18px 4px 8px; display: flex; align-items: center; gap: 8px;
  border-bottom: 1px solid rgba(96,165,250,0.10);
  margin-bottom: 4px;
}
.pr-section-title::before {
  content: ''; width: 3px; height: 14px; border-radius: 2px;
  background: #60a5fa; opacity: 0.5; flex-shrink: 0;
}

/* -- Photo report: collapsible equipment-type sections -- */
.pr-eq-group {
  margin: 0 0 6px 0;
  border-radius: 10px;
  background: rgba(255,255,255,0.015);
  border: 1px solid rgba(255,255,255,0.04);
}
.pr-eq-header {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 7px 12px;
  cursor: pointer;
  background: linear-gradient(135deg, color-mix(in srgb, var(--eq-color) 8%, transparent), transparent);
  border-bottom: 1px solid rgba(255,255,255,0.04);
  transition: all 0.2s;
}
.pr-eq-header:hover {
  background: linear-gradient(135deg, color-mix(in srgb, var(--eq-color) 14%, transparent), color-mix(in srgb, var(--eq-color) 4%, transparent));
}
.pr-eq-icon { font-size: 14px; flex-shrink: 0; }
.pr-eq-label {
  font-size: 10px; font-weight: 700; text-transform: uppercase;
  letter-spacing: 0.6px; color: var(--eq-color); flex: 1;
  text-align: left;
}
.pr-eq-count {
  font-size: 10px; font-weight: 700; color: var(--eq-color);
  background: color-mix(in srgb, var(--eq-color) 12%, transparent);
  border: 1px solid color-mix(in srgb, var(--eq-color) 25%, transparent);
  border-radius: 8px; padding: 1px 7px; min-width: 18px; text-align: center;
}
.pr-eq-photos {
  font-size: 9px; font-weight: 600; color: rgba(255,255,255,0.4);
  letter-spacing: 0.3px;
}
.pr-eq-arrow {
  font-size: 14px; color: var(--eq-color); opacity: 0.4;
  transition: transform 0.25s ease; transform: rotate(-90deg);
}
.pr-eq-arrow {
  flex-shrink: 0; color: var(--eq-color); opacity: 0.45;
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1); transform: rotate(-90deg);
}
.pr-eq-header:not(.collapsed) .pr-eq-arrow { transform: rotate(0deg); }
.pr-eq-header:active { transform: scale(0.998); }
.pr-eq-header.collapsed { border-bottom-color: transparent; }
.pr-eq-items { padding: 3px 0 2px; }
.pr-eq-items.hidden { display: none; }

/* ── Zone subgroups inside equipment sections ── */
.pr-zone-group {
  margin: 2px 4px 2px 12px;
  border-left: 2px solid color-mix(in srgb, var(--eq-color, #94a3b8) 22%, transparent);
  border-radius: 0 8px 8px 0;
  overflow: hidden;
  background: color-mix(in srgb, var(--eq-color, #94a3b8) 2%, transparent);
  transition: border-color 0.2s;
}
.pr-zone-group:hover {
  border-left-color: color-mix(in srgb, var(--eq-color, #94a3b8) 35%, transparent);
}
.pr-zone-header {
  display: flex; align-items: center; gap: 7px;
  padding: 5px 10px; cursor: pointer;
  background: color-mix(in srgb, var(--eq-color, #94a3b8) 4%, transparent);
  border-bottom: 1px solid rgba(255,255,255,0.025);
  transition: all 0.15s ease; user-select: none;
}
.pr-zone-header:hover {
  background: color-mix(in srgb, var(--eq-color, #94a3b8) 10%, transparent);
}
.pr-zone-header:active { transform: scale(0.998); }
.pr-zone-header.collapsed { border-bottom-color: transparent; }
.pr-zone-icon { font-size: 10px; flex-shrink: 0; opacity: 0.75; }
.pr-zone-label {
  font-size: 10.5px; font-weight: 600; letter-spacing: 0.15px;
  color: color-mix(in srgb, var(--eq-color, #94a3b8) 65%, #cbd5e1);
  flex: 1; text-align: left; line-height: 1.3;
}
.pr-zone-count {
  font-size: 9px; font-weight: 700;
  color: color-mix(in srgb, var(--eq-color, #94a3b8) 55%, #94a3b8);
  background: color-mix(in srgb, var(--eq-color, #94a3b8) 8%, transparent);
  border: 1px solid color-mix(in srgb, var(--eq-color, #94a3b8) 15%, transparent);
  padding: 1px 6px; border-radius: 8px; min-width: 16px; text-align: center;
  line-height: 1.4;
}
.pr-zone-photos {
  font-size: 9px; font-weight: 600; color: rgba(255,255,255,0.35);
}
.pr-zone-arrow {
  flex-shrink: 0;
  color: color-mix(in srgb, var(--eq-color, #94a3b8) 45%, #64748b);
  opacity: 0.5;
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1); transform: rotate(-90deg);
}
.pr-zone-header:not(.collapsed) .pr-zone-arrow { transform: rotate(0deg); }
.pr-zone-items { padding: 2px 0; }
.pr-zone-items.hidden { display: none; }

.pr-eq-group .pr-pos-item { border-left: none; }
.pr-eq-group .pr-pos-row {
  padding-left: 10px;
}
.pr-pos-dot {
  width: 5px; height: 5px; border-radius: 50%; flex-shrink: 0;
  opacity: 0.6;
}
.pr-pos-row:hover .pr-pos-dot { opacity: 1; }

.pr-pos-info {
  flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px;
}
.pr-pos-info .pr-pos-name {
  flex: unset;
}
.pr-pos-contractor {
  font-size: 10px; font-weight: 600; color: rgba(255,255,255,0.35);
  letter-spacing: 0.2px; text-align: left;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

.pr-pos-values {
  display: flex; align-items: center; gap: 5px; flex-shrink: 0;
}
.pr-pos-count {
  font-size: 12px; font-weight: 700; color: #fde047;
  background: rgba(253,224,71,0.1); border: 1px solid rgba(253,224,71,0.2);
  padding: 2px 8px; border-radius: 7px; white-space: nowrap;
  display: inline-flex; align-items: baseline; gap: 0;
}
.pr-pos-count--personnel {
  color: #4ade80;
  background: rgba(74,222,128,0.08);
  border-color: rgba(74,222,128,0.18);
}
.pr-pos-count--transport {
  color: #fb923c;
  background: rgba(251,146,60,0.08);
  border-color: rgba(251,146,60,0.18);
}
.pr-pos-shifts {
  font-size: 12px; font-weight: 700; color: #60a5fa;
  background: rgba(96,165,250,0.1); border: 1px solid rgba(96,165,250,0.2);
  padding: 2px 8px; border-radius: 7px; white-space: nowrap;
  display: inline-flex; align-items: baseline; gap: 0;
}
.pr-pos-coef {
  font-size: 12px; font-weight: 700; color: #a78bfa;
  background: rgba(167,139,250,0.08); border: 1px solid rgba(167,139,250,0.18);
  padding: 2px 8px; border-radius: 7px; white-space: nowrap;
  display: inline-flex; align-items: baseline; gap: 0;
}
.pr-val-label {
  font-size: 8px; font-weight: 600; opacity: 0.55; text-transform: uppercase;
  letter-spacing: 0.3px; margin-right: 3px;
}

/* -- Photo report: hall-level grouping (soprovod) -- */
.pr-hall-group {
  margin-bottom: 12px;
  border-radius: 12px;
  background: rgba(255,255,255,0.02);
  border: 1px solid rgba(255,255,255,0.06);
}
.pr-hall-header {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 14px;
  cursor: pointer;
  background: linear-gradient(135deg, color-mix(in srgb, var(--hall-color) 12%, transparent), color-mix(in srgb, var(--hall-color) 3%, transparent));
  border-bottom: 1px solid rgba(255,255,255,0.06);
  transition: all 0.2s;
}
.pr-hall-header:hover {
  background: linear-gradient(135deg, color-mix(in srgb, var(--hall-color) 18%, transparent), color-mix(in srgb, var(--hall-color) 6%, transparent));
}
.pr-hall-icon { flex-shrink: 0; }
.pr-hall-label {
  font-size: 12px; font-weight: 700; color: var(--hall-color); flex: 1;
  text-align: left; letter-spacing: 0.3px;
}
.pr-hall-count {
  font-size: 10px; font-weight: 600; color: var(--hall-color); opacity: 0.7;
  background: color-mix(in srgb, var(--hall-color) 10%, transparent);
  border: 1px solid color-mix(in srgb, var(--hall-color) 20%, transparent);
  border-radius: 8px; padding: 1px 8px;
}
.pr-hall-photos {
  font-size: 9px; font-weight: 600; color: rgba(255,255,255,0.4);
}
.pr-hall-content { padding: 4px 6px 6px; }
.pr-hall-content.hidden { display: none; }
.pr-hall-header.collapsed + .pr-hall-content { display: none; }

.pr-hall-group .pr-eq-group {
  margin-bottom: 4px;
  border: 1px solid rgba(255,255,255,0.03);
}

/* -- Photo report: top-level category grouping (estimates) -- */
.pr-cat-group {
  margin-bottom: 10px;
  border-radius: 12px;
  background: linear-gradient(135deg, color-mix(in srgb, var(--cat-color, #94a3b8) 3%, #1a1f2e), rgba(255,255,255,0.01));
  border: 1px solid color-mix(in srgb, var(--cat-color, #94a3b8) 10%, transparent);
  box-shadow: 0 2px 8px color-mix(in srgb, var(--cat-color, #94a3b8) 4%, transparent);
}
.pr-cat-header {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 11px 16px;
  border-radius: 12px;
  cursor: pointer;
  background: linear-gradient(135deg, color-mix(in srgb, var(--cat-color) 12%, #1a1f2e), color-mix(in srgb, var(--cat-color) 4%, #1a1f2e));
  border-bottom: 1px solid color-mix(in srgb, var(--cat-color) 8%, transparent);
  transition: all 0.2s ease;
  user-select: none;
}
.pr-cat-header:hover {
  background: linear-gradient(135deg, color-mix(in srgb, var(--cat-color) 18%, #1a1f2e), color-mix(in srgb, var(--cat-color) 8%, #1a1f2e));
  border-color: color-mix(in srgb, var(--cat-color) 20%, transparent);
}
.pr-cat-header:active { transform: scale(0.998); }
.pr-cat-header.collapsed { border-bottom-color: transparent; }
.pr-cat-icon { font-size: 17px; flex-shrink: 0; filter: drop-shadow(0 1px 2px rgba(0,0,0,0.3)); }
.pr-cat-label {
  font-size: 12.5px; font-weight: 800; text-transform: uppercase;
  letter-spacing: 1.2px; color: var(--cat-color); flex: 1;
  text-align: left; text-shadow: 0 1px 3px rgba(0,0,0,0.3);
}
.pr-cat-badge {
  font-size: 10px; font-weight: 700; color: var(--cat-color);
  background: color-mix(in srgb, var(--cat-color) 14%, transparent);
  border: 1px solid color-mix(in srgb, var(--cat-color) 25%, transparent);
  border-radius: 10px; padding: 2px 9px; min-width: 22px; text-align: center;
  line-height: 1.4;
}
.pr-cat-photos {
  font-size: 10px; font-weight: 600; color: rgba(255,255,255,0.4);
}
.pr-cat-arrow {
  flex-shrink: 0; color: var(--cat-color); opacity: 0.6;
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1); transform: rotate(-90deg);
}
.pr-cat-header:not(.collapsed) .pr-cat-arrow { transform: rotate(0deg); }
.pr-cat-content { padding: 4px 6px 6px; }
.pr-cat-content.hidden { display: none; }

.pr-cat-group .pr-eq-group {
  margin-bottom: 4px;
  border: 1px solid rgba(255,255,255,0.03);
}

/* --- Sequential mode start button in category header --- */
.pr-seq-start-btn {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 4px 10px; border-radius: 8px;
  border: 1px solid color-mix(in srgb, var(--cat-color) 30%, transparent);
  background: color-mix(in srgb, var(--cat-color) 10%, transparent);
  color: var(--cat-color); font-size: 11px; font-weight: 700;
  cursor: pointer; transition: all 0.2s; flex-shrink: 0;
  letter-spacing: 0.2px;
}
.pr-seq-start-btn:hover {
  background: color-mix(in srgb, var(--cat-color) 20%, transparent);
  border-color: color-mix(in srgb, var(--cat-color) 50%, transparent);
  transform: scale(1.04);
  box-shadow: 0 2px 10px color-mix(in srgb, var(--cat-color) 15%, transparent);
}
.pr-seq-start-btn:active { transform: scale(0.97); }
.pr-seq-start-btn svg { flex-shrink: 0; }

/* --- Sequential mode: live camera + panel --- */
.pr-seq-live {
  display: flex; flex-direction: column;
  height: 100%; min-height: 0;
  animation: prSeqIn 0.3s ease both;
}
@keyframes prSeqIn {
  from { opacity: 0; transform: translateY(12px); }
  to   { opacity: 1; transform: translateY(0); }
}

.pr-seq-header { display: none; }
.pr-seq-header-legacy {
  display: flex; align-items: center; gap: 10px;
  padding: 8px 12px; flex-shrink: 0;
  background: linear-gradient(180deg, rgba(255,255,255,0.04) 0%, transparent 100%);
  border-bottom: 1px solid rgba(255,255,255,0.06);
}
.pr-seq-header-info {
  flex: 1; display: flex; align-items: center; justify-content: flex-start;
}
.pr-seq-cat-badge {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 4px 12px; border-radius: 10px;
  font-size: 11px; font-weight: 700; letter-spacing: 0.4px;
  text-transform: uppercase; border: 1px solid;
}

/* Custom find bar */
.pr-seq-find-wrap {
  position: relative; padding: 8px 12px 6px; flex-shrink: 0;
}
.pr-seq-find-input {
  width: 100%; box-sizing: border-box;
  padding: 9px 36px 9px 14px;
  border-radius: 10px; border: 1px solid rgba(255,255,255,0.08);
  background: rgba(255,255,255,0.04); color: #e2e8f0;
  font-size: 13px; font-weight: 500; outline: none;
  transition: border-color 0.2s, box-shadow 0.2s;
}
.pr-seq-find-input:focus {
  border-color: var(--seq-color, #60a5fa);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--seq-color, #60a5fa) 15%, transparent);
}
.pr-seq-find-input::placeholder { color: rgba(255,255,255,0.2); }
.pr-seq-find-clear {
  position: absolute; right: 16px; top: 50%; transform: translateY(-50%);
  width: 24px; height: 24px; display: none;
  align-items: center; justify-content: center;
  background: none; border: none; color: rgba(255,255,255,0.25);
  font-size: 18px; font-weight: 400; cursor: pointer;
  border-radius: 6px; transition: all 0.15s; line-height: 1;
}
.pr-seq-find-clear.show { display: flex; }
.pr-seq-find-clear:hover { color: rgba(255,255,255,0.7); background: rgba(255,255,255,0.08); }

/* Find results dropdown (opens upward) */
.pr-seq-find-results {
  display: none; position: absolute; left: 12px; right: 12px; bottom: calc(100% + 4px);
  max-height: 180px; overflow-y: auto; z-index: 30;
  background: rgba(20,20,35,0.97); border: 1px solid rgba(255,255,255,0.1);
  border-radius: 10px; box-shadow: 0 -8px 24px rgba(0,0,0,0.5);
  backdrop-filter: blur(16px);
}
.pr-seq-find-results.open { display: block; }
.pr-seq-sr-item {
  display: flex; align-items: center; gap: 8px;
  padding: 9px 12px; border: none; background: none;
  color: #cbd5e1; font-size: 13px; cursor: pointer;
  width: 100%; text-align: left; transition: background 0.15s;
}
.pr-seq-sr-item:hover { background: rgba(255,255,255,0.06); }
.pr-seq-sr-item.pr-seq-sr-active { background: color-mix(in srgb, var(--seq-color) 10%, transparent); color: var(--seq-color); }
.pr-seq-sr-dot { width: 6px; height: 6px; border-radius: 50%; flex-shrink: 0; }
.pr-seq-sr-name { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pr-seq-sr-num { font-size: 11px; font-weight: 700; color: rgba(255,255,255,0.2); flex-shrink: 0; }
.pr-seq-sr-empty { padding: 14px; text-align: center; color: rgba(255,255,255,0.2); font-size: 12px; }

/* Camera area */
.pr-seq-cam-area {
  flex: 1; min-height: 0; display: flex;
  flex-direction: column; padding: 0;
}
.pr-seq-cam-area .pr-camera-viewport {
  flex: 1; min-height: 120px;
  border-radius: 0; border: none; box-shadow: none;
}

/* Top panel (position name + progress above camera) */
.pr-seq-top-panel {
  flex-shrink: 0;
  padding: 6px 12px 4px;
  border-bottom: 1px solid rgba(255,255,255,0.06);
  background: rgba(255,255,255,0.02);
}

/* Native camera fallback */
.pr-seq-nocam-area {
  flex: 1; min-height: 120px; display: flex;
  align-items: center; justify-content: center; padding: 12px;
}
.pr-seq-nocam-btn {
  display: flex; flex-direction: column; align-items: center;
  gap: 12px; padding: 32px 40px; border-radius: 20px;
  border: 2px dashed rgba(255,255,255,0.12);
  background: rgba(255,255,255,0.02); color: rgba(255,255,255,0.35);
  cursor: pointer; transition: all 0.2s; font-size: 14px; font-weight: 600;
}
.pr-seq-nocam-btn:hover {
  border-color: rgba(96,165,250,0.3); color: #93c5fd;
  background: rgba(96,165,250,0.05);
}
.pr-seq-nocam-btn:active { transform: scale(0.97); }

/* Bottom panel */
.pr-seq-bottom-panel {
  flex-shrink: 0;
  background: linear-gradient(0deg, rgba(0,0,0,0.3) 0%, rgba(15,23,42,0.95) 40%, rgba(15,23,42,0.98) 100%);
  border-top: 1px solid rgba(255,255,255,0.06);
  border-top: 1px solid rgba(255,255,255,0.06);
}

/* Progress bar */
.pr-seq-progress {
  display: flex; align-items: center; gap: 10px;
  padding: 8px 14px 4px; flex-shrink: 0;
}
.pr-seq-progress-bar {
  flex: 1; height: 3px; border-radius: 2px;
  background: rgba(255,255,255,0.06); overflow: hidden;
}
.pr-seq-progress-fill {
  height: 100%; border-radius: inherit;
  transition: width 0.4s cubic-bezier(0.4,0,0.2,1);
}
.pr-seq-progress-text {
  font-size: 11px; font-weight: 700; color: rgba(255,255,255,0.35);
  font-variant-numeric: tabular-nums; flex-shrink: 0;
}

/* Position info strip */
.pr-seq-pos-strip {
  display: flex; align-items: center; gap: 10px;
  padding: 6px 14px; min-height: 0;
}
.pr-seq-strip-left {
  flex: 1; min-width: 0; display: flex; align-items: center; gap: 10px;
}
.pr-seq-strip-dot {
  width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0;
  box-shadow: 0 0 6px currentColor;
}
.pr-seq-strip-info { flex: 1; min-width: 0; }
.pr-seq-strip-name {
  font-size: 14px; font-weight: 700; color: #f1f5f9;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  line-height: 1.3;
}
.pr-seq-strip-section {
  font-size: 10px; font-weight: 600; color: rgba(255,255,255,0.3);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  text-transform: uppercase; letter-spacing: 0.3px;
}
.pr-seq-photo-badge {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 4px 10px; border-radius: 8px; flex-shrink: 0;
  font-size: 12px; font-weight: 700;
  color: rgba(255,255,255,0.3);
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.06);
  transition: all 0.3s;
}
.pr-seq-photo-badge.has-photos {
  color: #4ade80;
  background: rgba(74,222,128,0.08);
  border-color: rgba(74,222,128,0.2);
}

/* Controls row — fixed height, one line */
.pr-seq-controls {
  display: flex; align-items: center; gap: 8px;
  padding: 6px 12px 10px; height: 52px; box-sizing: border-box;
}
.pr-seq-ctrl {
  display: flex; align-items: center; justify-content: center;
  gap: 5px; height: 36px; border-radius: 9px;
  font-size: 12px; font-weight: 700; cursor: pointer;
  transition: all 0.15s; border: 1px solid;
  padding: 0 10px; box-sizing: border-box;
  flex-shrink: 0; white-space: nowrap;
}
.pr-seq-ctrl:active { transform: scale(0.96); }
.pr-seq-ctrl-prev {
  width: 36px; padding: 0;
  background: rgba(255,255,255,0.04);
  border-color: rgba(255,255,255,0.1); color: rgba(255,255,255,0.5);
}
.pr-seq-ctrl-prev:hover:not(.off) {
  background: rgba(255,255,255,0.08); color: rgba(255,255,255,0.8);
}
.pr-seq-ctrl-prev.off {
  opacity: 0.2; cursor: default; pointer-events: none;
}
.pr-seq-ctrl-upload {
  width: 36px; padding: 0;
  background: rgba(96,165,250,0.08);
  border-color: rgba(96,165,250,0.2); color: #93c5fd;
}
.pr-seq-ctrl-upload:hover {
  background: rgba(96,165,250,0.15); border-color: rgba(96,165,250,0.4);
}
.pr-seq-ctrl-next {
  flex: 1;
  background: linear-gradient(135deg, rgba(74,222,128,0.15), rgba(74,222,128,0.06));
  border-color: rgba(74,222,128,0.3); color: #4ade80;
}
.pr-seq-ctrl-next:hover {
  background: linear-gradient(135deg, rgba(74,222,128,0.25), rgba(74,222,128,0.12));
  border-color: rgba(74,222,128,0.5);
}
.pr-seq-ctrl-next svg { order: 1; }

/* ==========================================
   PRICE LIST CHECKER (Прайс Лист) — A3
   ========================================== */

/* --- Upload Screen (entire area is the drop zone) --- */
.pl-upload-screen {
  display: flex; flex-direction: column; align-items: center;
  justify-content: center;
  min-height: 100%; padding: 20px 16px; gap: 0;
  cursor: pointer; position: relative;
  transition: background 0.3s;
}
.pl-upload-screen::before {
  content: ''; position: absolute; inset: 8px;
  border: 2px dashed rgba(167,139,250,0.12);
  border-radius: 14px; pointer-events: none;
  transition: all 0.3s;
}
.pl-upload-screen.drag-over { background: rgba(167,139,250,0.06); }
.pl-upload-screen.drag-over::before {
  border-color: rgba(167,139,250,0.5);
  box-shadow: inset 0 0 30px rgba(167,139,250,0.08);
}

.pl-upload-center {
  display: flex; flex-direction: column; align-items: center;
  gap: 14px; text-align: center;
}
.pl-upload-icon-ring {
  width: 68px; height: 68px; border-radius: 50%;
  background: radial-gradient(circle at 30% 30%, rgba(167,139,250,0.18), rgba(96,165,250,0.08));
  border: 2px solid rgba(167,139,250,0.2);
  display: flex; align-items: center; justify-content: center;
  color: #a78bfa; position: relative;
  box-shadow: 0 0 24px rgba(167,139,250,0.08);
}
.pl-upload-icon-ring::after {
  content: ''; position: absolute; inset: -6px;
  border-radius: 50%; border: 1px dashed rgba(167,139,250,0.1);
  animation: plRingPulse 4s ease-in-out infinite;
}
@keyframes plRingPulse {
  0%, 100% { opacity: 0.3; transform: scale(1); }
  50% { opacity: 0.7; transform: scale(1.08); }
}
.pl-upload-title {
  font-size: 17px; font-weight: 800; color: #e8e8ec;
  letter-spacing: 0.3px;
}
.pl-upload-hint {
  font-size: 12px; color: rgba(255,255,255,0.35);
  line-height: 1.5; max-width: 240px;
}
.pl-upload-hint b { color: rgba(167,139,250,0.7); font-weight: 700; }
.pl-upload-btn {
  padding: 11px 28px; border-radius: 12px; border: none;
  background: linear-gradient(135deg, #a78bfa 0%, #818cf8 100%);
  color: #fff; font-size: 13px; font-weight: 700;
  cursor: pointer; transition: all 0.25s;
  display: flex; align-items: center; gap: 8px;
  box-shadow: 0 4px 16px rgba(167,139,250,0.25);
}
.pl-upload-btn:hover {
  filter: brightness(1.12); transform: translateY(-2px);
  box-shadow: 0 6px 24px rgba(167,139,250,0.35);
}

/* Reference chips bar */
.pl-ref-bar {
  position: absolute; bottom: 14px; left: 0; right: 0;
  display: flex; align-items: center; justify-content: center;
  gap: 8px; padding: 0 16px; flex-wrap: wrap;
}
.pl-ref-bar-label {
  font-size: 11px; font-weight: 600;
  color: rgba(255,255,255,0.3); white-space: nowrap;
}
.pl-ref-chips { display: flex; gap: 6px; flex-wrap: wrap; }
.pl-ref-chip {
  padding: 5px 14px; border-radius: 8px;
  border: 1px solid rgba(255,255,255,0.08);
  background: rgba(255,255,255,0.04);
  color: rgba(255,255,255,0.45); font-size: 12px; font-weight: 600;
  cursor: pointer; transition: all 0.2s;
}
.pl-ref-chip:hover { border-color: rgba(167,139,250,0.3); color: rgba(255,255,255,0.7); }
.pl-ref-chip.active {
  border-color: rgba(167,139,250,0.4);
  background: rgba(167,139,250,0.12);
  color: #a78bfa;
}

/* Upload status */
.pl-upload-status {
  display: flex; flex-direction: column; align-items: center; gap: 12px;
  font-size: 13px; color: rgba(255,255,255,0.5);
}
.pl-spinner {
  width: 20px; height: 20px; border-radius: 50%;
  border: 2px solid rgba(167,139,250,0.2);
  border-top-color: #a78bfa;
  animation: plSpin 0.8s linear infinite;
}
@keyframes plSpin { to { transform: rotate(360deg); } }

/* --- Results Screen (flat, all expanded) --- */
.pl-results {
  display: flex; flex-direction: column; height: 100%;
  position: relative;
}

/* Top bar */
.pl-top-bar {
  flex-shrink: 0; padding: 10px 12px;
  border-bottom: 1px solid rgba(255,255,255,0.06);
  display: flex; flex-direction: column; gap: 8px;
}
.pl-top-stats {
  display: flex; gap: 12px; justify-content: center;
}
.pl-ts {
  font-size: 11px; font-weight: 600; display: flex; align-items: center; gap: 4px;
  color: rgba(255,255,255,0.4);
}
.pl-ts span { font-size: 16px; font-weight: 800; }
.pl-ts-ok span { color: #34d399; }
.pl-ts-err span { color: #f87171; }
.pl-ts-fix span { color: #fbbf24; }

.pl-legend {
  padding: 8px 10px;
  border-radius: 10px;
  background: rgba(0,0,0,0.22);
  border: 1px solid rgba(255,255,255,0.06);
}
.pl-legend-title {
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.35);
  margin-bottom: 6px;
}
.pl-legend-items {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 12px;
  align-items: center;
}
.pl-leg-item {
  font-size: 10px;
  color: rgba(255,255,255,0.5);
  display: inline-flex;
  align-items: center;
  gap: 5px;
  line-height: 1.3;
}
.pl-leg-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  flex-shrink: 0;
}
.pl-leg-est-unit { background: rgba(255,255,255,0.32); }
.pl-leg-mul { background: rgba(255,255,255,0.38); box-shadow: 0 0 0 1px rgba(255,255,255,0.12); }
.pl-leg-est-line { background: rgba(255,255,255,0.62); }
.pl-leg-ref-unit { background: rgba(196,181,253,0.65); }
.pl-leg-ref-line { background: rgba(167,139,250,0.95); }
.pl-leg-diff-up { background: #f87171; }
.pl-leg-diff-down { background: #34d399; }

.pl-top-progress {
  display: flex; align-items: center; gap: 8px;
}
.pl-tp-bar {
  flex: 1; height: 5px; border-radius: 3px;
  background: rgba(255,255,255,0.06); overflow: hidden;
}
.pl-tp-fill {
  height: 100%; border-radius: 3px;
  background: linear-gradient(90deg, #34d399, #60a5fa);
  transition: width 0.4s ease;
}
.pl-tp-txt {
  font-size: 11px; font-weight: 800; color: rgba(255,255,255,0.4);
  min-width: 30px; text-align: right;
}
.pl-top-actions {
  display: flex; gap: 8px; align-items: center;
  /* Квадрат «плюс» ≈ высота «Скачать» (8+8 padding + ~15px иконка) */
  --pl-action-h: 32px;
}
.pl-ta {
  flex: 1; padding: 8px; border-radius: 8px; border: none;
  font-size: 11px; font-weight: 700; line-height: 1.2;
  cursor: pointer;
  display: flex; align-items: center; justify-content: center; gap: 5px;
  transition: all 0.2s;
  min-height: 0;
}
.pl-ta-dl {
  background: rgba(52,211,153,0.1); border: 1px solid rgba(52,211,153,0.2);
  color: #34d399;
}
.pl-ta-dl:hover { background: rgba(52,211,153,0.18); }
.pl-ta-new {
  flex: 0 0 var(--pl-action-h);
  width: var(--pl-action-h);
  height: var(--pl-action-h);
  min-width: var(--pl-action-h);
  min-height: var(--pl-action-h);
  padding: 0;
  border-radius: 8px;
  box-sizing: border-box;
  background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.08);
  color: rgba(255,255,255,0.55);
}
.pl-ta-new:hover { background: rgba(255,255,255,0.1); color: rgba(255,255,255,0.75); }
.pl-ta-new svg { flex-shrink: 0; }

/* Body — scrollable list of sections + devices */
.pl-body {
  flex: 1; overflow-y: auto; padding: 8px 10px;
  display: flex; flex-direction: column; gap: 2px;
}

/* Section group */
.pl-sec-group { margin-bottom: 6px; }
.pl-sec-head {
  display: flex; align-items: center; gap: 8px;
  padding: 8px 6px 4px; position: sticky; top: 0;
  background: #16161b; z-index: 2;
}
.pl-sec-dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: linear-gradient(135deg, #a78bfa, #60a5fa);
  flex-shrink: 0;
}
.pl-sec-name {
  font-size: 12px; font-weight: 700; color: rgba(255,255,255,0.7);
  flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.pl-sec-pills { display: flex; gap: 4px; flex-shrink: 0; }
.pl-pill {
  font-size: 10px; font-weight: 800; padding: 1px 7px;
  border-radius: 5px; line-height: 1.4;
}
.pl-pill-ok { color: #34d399; background: rgba(52,211,153,0.12); }
.pl-pill-fix { color: #fbbf24; background: rgba(251,191,36,0.12); }
.pl-pill-err { color: #f87171; background: rgba(248,113,113,0.12); }

/* Device row (inline, compact) */
.pl-d {
  display: flex; align-items: center; gap: 6px;
  padding: 7px 8px; border-radius: 8px;
  transition: background 0.15s;
  border-left: 3px solid transparent;
}
.pl-d:hover { background: rgba(255,255,255,0.03); }
.pl-d-found { border-left-color: rgba(52,211,153,0.35); }
.pl-d-corrected { border-left-color: rgba(251,191,36,0.35); }
.pl-d-issue { border-left-color: rgba(248,113,113,0.35); }
.pl-d-icon { font-size: 12px; flex-shrink: 0; line-height: 1; }
.pl-d-body { flex: 1; min-width: 0; }
.pl-d-top { display: flex; align-items: flex-start; gap: 8px; }
.pl-d-name {
  font-size: 12px; font-weight: 600; color: rgba(255,255,255,0.75);
  flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  padding-top: 2px;
}
.pl-d-right {
  flex-shrink: 0;
  max-width: min(100%, 340px);
}
.pl-d-prices {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 5px;
  width: 100%;
  max-width: 340px;
  margin-left: auto;
}
.pl-d-price-row {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: flex-end;
  gap: 4px 8px;
  font-size: 10px;
  line-height: 1.35;
  width: 100%;
}
.pl-d-pr-src {
  min-width: 7rem;
  text-align: right;
  color: rgba(255,255,255,0.32);
  font-weight: 700;
  font-size: 9px;
  letter-spacing: 0.02em;
}
.pl-d-mul { font-weight: 600; }
.pl-d-arrow {
  color: rgba(255,255,255,0.22);
  font-weight: 400;
  margin: 0 -2px;
}
.pl-col-est-unit { color: rgba(255,255,255,0.32); font-weight: 600; }
.pl-col-mul { color: rgba(255,255,255,0.38); font-weight: 600; }
.pl-col-est-line { color: rgba(255,255,255,0.62); font-weight: 800; }
.pl-col-ref-unit { color: rgba(196,181,253,0.62); font-weight: 600; }
.pl-col-ref-line { color: rgba(196,181,253,0.92); font-weight: 800; }
.pl-d-price-diff { flex-wrap: nowrap; }
.pl-d-price-diff .pl-d-pr-src { min-width: 7rem; }
.pl-d-price-diff .pl-d-diff {
  font-weight: 800;
  margin-left: auto;
  font-size: 11px;
}
.pl-col-diff-up { color: #f87171; }
.pl-col-diff-down { color: #34d399; }

/* Correction sub-line */
.pl-d-corr {
  display: flex; align-items: center; gap: 4px; margin-top: 2px;
}
.pl-d-corr-name {
  font-size: 10px; color: rgba(251,191,36,0.6);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  flex: 1; min-width: 0;
}
.pl-d-corr-del {
  width: 16px; height: 16px; border-radius: 4px; border: none;
  background: rgba(248,113,113,0.1); color: #f87171;
  font-size: 10px; cursor: pointer; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  transition: background 0.15s;
}
.pl-d-corr-del:hover { background: rgba(248,113,113,0.25); }

/* Inline search button */
.pl-d-search {
  width: 28px; height: 28px; border-radius: 7px; border: none;
  background: rgba(167,139,250,0.1); color: #a78bfa;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; flex-shrink: 0; transition: all 0.2s;
}
.pl-d-search:hover {
  background: rgba(167,139,250,0.22);
  transform: scale(1.08);
}

/* --- Similar panel (draggable bottom sheet) --- */
.pl-sim-panel {
  position: absolute; bottom: 0; left: 0; right: 0;
  max-height: 45%; background: rgba(16,16,20,0.97);
  backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
  border-top: 1px solid rgba(167,139,250,0.25);
  border-radius: 14px 14px 0 0;
  box-shadow: 0 -8px 30px rgba(0,0,0,0.5);
  display: flex; flex-direction: column;
  transform: translateY(100%); opacity: 0;
  transition: transform 0.25s ease, opacity 0.2s;
  z-index: 20;
}
.pl-sim-panel.show { transform: translateY(0); opacity: 1; }

.pl-sim-handle {
  position: relative; flex-shrink: 0;
  display: flex; flex-direction: column; align-items: center;
  cursor: ns-resize;
  background: rgba(16,16,20,0.98);
  border-bottom: 1px solid rgba(255,255,255,0.06);
  border-radius: 14px 14px 0 0;
  padding: 0 16px; transition: background 0.15s;
  user-select: none;
}
.pl-sim-handle:hover { background: rgba(25,25,40,0.98); }
.pl-sim-grip {
  width: 36px; height: 4px; border-radius: 2px;
  background: rgba(167,139,250,0.2); margin: 8px 0 4px;
  transition: background 0.15s;
}
.pl-sim-handle:hover .pl-sim-grip { background: rgba(167,139,250,0.45); }
.pl-sim-handle:active .pl-sim-grip { background: rgba(167,139,250,0.7); }
.pl-sim-handle-title {
  font-size: 10px; font-weight: 700;
  color: rgba(167,139,250,0.5); letter-spacing: 0.4px;
  pointer-events: none; padding-bottom: 8px;
  text-transform: uppercase;
}
.pl-sim-close {
  position: absolute; right: 14px; top: 50%; transform: translateY(-50%);
  width: 24px; height: 24px; border-radius: 6px; border: none;
  background: rgba(255,255,255,0.06); color: rgba(255,255,255,0.5);
  font-size: 12px; cursor: pointer; transition: all 0.15s;
  display: flex; align-items: center; justify-content: center;
}
.pl-sim-close:hover { background: rgba(248,113,113,0.15); color: #f87171; }
.pl-sim-query {
  padding: 8px 14px; font-size: 11px; font-weight: 600;
  color: rgba(255,255,255,0.4); background: rgba(167,139,250,0.04);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  flex-shrink: 0;
}
.pl-sim-body { flex: 1; overflow-y: auto; padding: 4px 10px 10px; }
.pl-searching {
  display: flex; align-items: center; justify-content: center;
  gap: 10px; padding: 30px; color: rgba(255,255,255,0.4); font-size: 13px;
}
.pl-no-results {
  text-align: center; padding: 30px; color: rgba(255,255,255,0.3); font-size: 13px;
}
.pl-sim-category {
  font-size: 10px; font-weight: 700; color: rgba(255,255,255,0.25);
  text-transform: uppercase; letter-spacing: 0.5px;
  padding: 8px 4px 3px;
}
.pl-sim-item {
  display: flex; align-items: center; gap: 8px;
  padding: 8px 10px; border-radius: 8px;
  cursor: pointer; transition: all 0.15s;
  border: 1px solid transparent;
}
.pl-sim-item:hover {
  background: rgba(167,139,250,0.08);
  border-color: rgba(167,139,250,0.2);
}
.pl-sim-info { flex: 1; min-width: 0; }
.pl-sim-name {
  font-size: 12px; font-weight: 600; color: rgba(255,255,255,0.8);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.pl-sim-price { font-size: 11px; color: rgba(167,139,250,0.5); margin-top: 1px; }
.pl-sim-pct {
  font-size: 10px; font-weight: 800; color: rgba(52,211,153,0.7);
  background: rgba(52,211,153,0.1); padding: 2px 7px;
  border-radius: 5px; flex-shrink: 0;
}

/* ========================================== */
/* ROLE-BASED VISIBILITY                      */
/* ========================================== */
body[data-app-role="pro_contractor"] .est-act-btn.btn-edit,
body[data-app-role="pro_contractor"] .est-act-btn.btn-hide,
body[data-app-role="pro_contractor"] .est-act-btn.btn-approve,
body[data-app-role="pro_contractor"] .est-file-link,
body[data-app-role="pro_contractor"] .sop-downloads,
body[data-app-role="pro_contractor"] #fab-estimates,
body[data-app-role="pro_contractor"] .est-header.header-ready,
body[data-app-role="pro_contractor"] #estListReady,
body[data-app-role="pro_contractor"] .est-stat[data-type="ready"],
body[data-app-role="pro_contractor"] .est-stat-divider:last-of-type,
body[data-app-role="contractor"] .est-act-btn.btn-edit,
body[data-app-role="contractor"] .est-act-btn.btn-hide,
body[data-app-role="contractor"] .est-act-btn.btn-approve,
body[data-app-role="contractor"] .est-file-link,
body[data-app-role="contractor"] .sop-downloads,
body[data-app-role="contractor"] #fab-estimates,
body[data-app-role="contractor"] .est-header.header-ready,
body[data-app-role="contractor"] #estListReady,
body[data-app-role="contractor"] .est-stat[data-type="ready"],
body[data-app-role="contractor"] .est-stat-divider:last-of-type {
  display: none !important;
}

/* ========================================== */
/* PENDING APPROVAL SCREEN                    */
/* ========================================== */
.pending-approval {
  position: fixed; inset: 0; z-index: 9999;
  display: flex; align-items: center; justify-content: center;
  background: rgba(10,10,14,0.95);
  -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px);
}
.pending-card {
  text-align: center; padding: 40px 32px;
  background: linear-gradient(165deg, rgba(28,28,34,0.95), rgba(20,20,26,0.98));
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 20px;
  box-shadow: 0 16px 50px rgba(0,0,0,0.5);
  max-width: 340px; width: 90%;
}
.pending-icon { font-size: 48px; margin-bottom: 16px; }
.pending-title {
  font-size: 18px; font-weight: 700; color: #fff; margin-bottom: 8px;
}
.pending-text {
  font-size: 13px; color: rgba(255,255,255,0.55); line-height: 1.5; margin-bottom: 24px;
}
.pending-text b { color: rgba(255,255,255,0.85); }
.pending-btn {
  display: block; width: 100%; padding: 12px; margin-bottom: 10px;
  background: linear-gradient(135deg, #fbbf24, #f59e0b);
  color: #000; font-weight: 700; font-size: 14px;
  border: none; border-radius: 12px; cursor: pointer;
  transition: transform 0.15s, box-shadow 0.15s;
}
.pending-btn:hover { transform: scale(1.02); box-shadow: 0 4px 15px rgba(251,191,36,0.3); }
.pending-logout {
  display: block; width: 100%; padding: 10px;
  background: none; border: 1px solid rgba(255,255,255,0.1);
  color: rgba(255,255,255,0.5); font-size: 13px;
  border-radius: 10px; cursor: pointer; transition: all 0.15s;
}
.pending-logout:hover { border-color: rgba(255,255,255,0.2); color: rgba(255,255,255,0.8); }

/* ========================================== */
/* ADMIN USER MANAGEMENT PANEL                */
/* ========================================== */
.um-panel {
  display: flex; flex-direction: column; gap: 12px;
  padding: 16px; max-height: 70vh; overflow-y: auto;
}
.um-section-title {
  font-size: 14px; font-weight: 700; color: rgba(255,255,255,0.7);
  margin-bottom: 4px; display: flex; align-items: center; gap: 8px;
}
.um-count {
  font-size: 11px; font-weight: 600; color: rgba(251,191,36,0.7);
  background: rgba(251,191,36,0.1); padding: 2px 8px;
  border-radius: 10px;
}
.um-search {
  width: 100%; padding: 10px 12px; box-sizing: border-box;
  background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08);
  border-radius: 10px; color: #fff; font-size: 13px;
  outline: none; transition: border-color 0.2s;
}
.um-search:focus { border-color: rgba(251,191,36,0.3); }
.um-search::placeholder { color: rgba(255,255,255,0.25); }
.um-list { display: flex; flex-direction: column; gap: 6px; }
.um-user {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 12px; border-radius: 12px;
  background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.05);
  transition: background 0.15s, border-color 0.15s;
}
.um-user:hover { background: rgba(255,255,255,0.06); border-color: rgba(255,255,255,0.1); }
.um-user.pending { border-left: 3px solid rgba(251,191,36,0.6); }
.um-user-info { flex: 1; min-width: 0; display: flex; align-items: center; gap: 8px; }
.um-user-name {
  font-size: 13px; font-weight: 600; color: #fff;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.um-badge {
  font-size: 10px; font-weight: 600; padding: 2px 7px; border-radius: 5px;
  white-space: nowrap; flex-shrink: 0;
}
.um-badge-company {
  color: #fbbf24; background: rgba(251,191,36,0.13);
}
.um-badge-admin {
  color: #60a5fa; background: rgba(96,165,250,0.13);
}
.um-user-hardcoded .um-user-name::after {
  content: 'ROOT'; font-size: 9px; font-weight: 700;
  color: #f59e0b; background: rgba(251,191,36,0.15);
  padding: 1px 5px; border-radius: 4px; margin-left: 6px;
  vertical-align: middle;
}
.um-role-select {
  padding: 0 8px; font-size: 11px; font-weight: 600; height: 32px; box-sizing: border-box;
  background: rgba(255,255,255,0.06); color: rgba(255,255,255,0.75);
  border: 1px solid rgba(255,255,255,0.1); border-radius: 8px;
  outline: none; cursor: pointer; min-width: 110px;
}
.um-role-select:focus { border-color: rgba(251,191,36,0.4); }
.um-approve-btn {
  padding: 0 12px; font-size: 11px; font-weight: 700; height: 32px;
  border: none; border-radius: 8px; cursor: pointer;
  transition: all 0.15s; display: inline-flex; align-items: center; justify-content: center;
}
.um-approve-btn.approve {
  background: rgba(46,204,113,0.2); color: #2ecc71;
}
.um-approve-btn.approve:hover {
  background: rgba(46,204,113,0.35);
}
.um-approve-btn.reject {
  background: rgba(231,76,60,0.15); color: #e74c3c;
}
.um-approve-btn.reject:hover {
  background: rgba(231,76,60,0.3);
}
.um-delegate-toggle {
  display: flex; align-items: center; gap: 5px;
  font-size: 10px; color: rgba(255,255,255,0.35); cursor: pointer;
  user-select: none;
}
.um-delegate-cb {
  width: 14px; height: 14px; accent-color: #fbbf24; cursor: pointer;
}
.um-empty {
  text-align: center; padding: 20px; color: rgba(255,255,255,0.3);
  font-size: 13px;
}

/* ==========================================
   USER MANAGEMENT WORKSPACE PANEL
   ========================================== */
.um-ws-header {
  padding: 12px 14px 8px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  flex-shrink: 0;
}
.um-ws-title-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.um-ws-title {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 15px;
  font-weight: 700;
  color: rgba(255,255,255,0.9);
  letter-spacing: -0.3px;
}
.um-ws-title-icon { color: rgba(255,255,255,0.5); flex-shrink: 0; }
.um-ws-count {
  background: rgba(255,255,255,0.08);
  color: rgba(255,255,255,0.5);
  font-size: 11px;
  font-weight: 600;
  padding: 2px 8px;
  border-radius: 10px;
  min-width: 20px;
  text-align: center;
}
.um-ws-refresh-btn {
  width: 30px; height: 30px;
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 8px;
  background: rgba(255,255,255,0.03);
  color: rgba(255,255,255,0.4);
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: all 0.2s;
}
.um-ws-refresh-btn:hover { background: rgba(255,255,255,0.06); color: rgba(255,255,255,0.7); border-color: rgba(255,255,255,0.15); }
.um-ws-refresh-btn.spinning svg { animation: um-spin 0.5s ease; }
@keyframes um-spin { from { transform: rotate(0); } to { transform: rotate(360deg); } }

/* --- Toolbar: search + filters --- */
.um-ws-toolbar {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
/* Search bar — same style as work schedule */
.um-ws-search-wrap {
  position: relative;
  display: flex;
  align-items: center;
}
.um-ws-search {
  width: 100%;
  height: 34px;
  padding: 0 60px 0 12px;
  border-radius: 10px;
  background: rgba(0,0,0,0.5);
  border: 1px solid rgba(255,255,255,0.1);
  color: rgba(255,255,255,0.9);
  font-size: 12px;
  font-weight: 500;
  box-sizing: border-box;
  box-shadow: 0 4px 16px rgba(0,0,0,0.35);
  transition: background 0.2s, border-color 0.2s, box-shadow 0.2s;
}
.um-ws-search::placeholder { color: rgba(255,255,255,0.35); }
.um-ws-search:focus {
  outline: none;
  background: rgba(0,0,0,0.6);
  border-color: rgba(251,191,36,0.3);
  box-shadow: 0 4px 16px rgba(0,0,0,0.35), 0 0 0 2px rgba(251,191,36,0.08);
}
.um-ws-search-count {
  position: absolute;
  right: 32px;
  font-size: 10px;
  font-weight: 600;
  color: rgba(251,191,36,0.7);
  background: rgba(251,191,36,0.1);
  padding: 2px 6px;
  border-radius: 5px;
  line-height: 1;
  display: none;
  pointer-events: none;
}
.um-ws-search-count.visible { display: inline-block; }
.um-ws-search-clear {
  position: absolute;
  right: 6px;
  width: 22px; height: 22px;
  border: none;
  border-radius: 6px;
  background: rgba(255,255,255,0.06);
  color: rgba(255,255,255,0.3);
  cursor: pointer;
  display: none;
  align-items: center; justify-content: center;
  transition: background 0.15s, color 0.15s;
}
.um-ws-search-clear.visible { display: flex; }
.um-ws-search-clear:hover { background: rgba(251,191,36,0.15); color: #fbbf24; }

/* --- Filters row --- */
.um-ws-filters {
  display: flex;
  align-items: center;
  gap: 8px;
}

/* Sort dropdown */
.um-ws-sort-wrap { position: relative; }
.um-ws-sort-btn {
  display: flex;
  align-items: center;
  gap: 5px;
  padding: 5px 10px;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 8px;
  color: rgba(255,255,255,0.55);
  font-size: 11px;
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
  transition: all 0.2s;
}
.um-ws-sort-btn:hover { border-color: rgba(255,255,255,0.15); color: rgba(255,255,255,0.75); background: rgba(255,255,255,0.06); }
.um-ws-sort-arrow { transition: transform 0.2s; }
.um-ws-sort-menu.show + .um-ws-sort-btn .um-ws-sort-arrow,
.um-ws-sort-wrap:has(.um-ws-sort-menu.show) .um-ws-sort-arrow { transform: rotate(180deg); }
.um-ws-sort-menu {
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  min-width: 160px;
  background: rgba(15,23,42,0.97);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 10px;
  padding: 4px;
  z-index: 100;
  opacity: 0;
  transform: translateY(-4px) scale(0.97);
  pointer-events: none;
  transition: all 0.18s;
  backdrop-filter: blur(12px);
  box-shadow: 0 8px 32px rgba(0,0,0,0.4);
}
.um-ws-sort-menu.show { opacity: 1; transform: translateY(0) scale(1); pointer-events: auto; }
.um-ws-sort-opt {
  padding: 7px 10px;
  font-size: 12px;
  color: rgba(255,255,255,0.6);
  border-radius: 7px;
  cursor: pointer;
  transition: all 0.12s;
}
.um-ws-sort-opt:hover { background: rgba(255,255,255,0.06); color: rgba(255,255,255,0.9); }
.um-ws-sort-opt.active { color: #4ECDC4; font-weight: 600; }

/* Filter chips */
.um-ws-filter-chips {
  display: flex;
  gap: 4px;
  flex: 1;
  overflow-x: auto;
  scrollbar-width: none;
}
.um-ws-filter-chips::-webkit-scrollbar { display: none; }
.um-ws-chip {
  padding: 4px 10px;
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 8px;
  background: transparent;
  color: rgba(255,255,255,0.4);
  font-size: 11px;
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
  transition: all 0.2s;
  display: flex;
  align-items: center;
  gap: 4px;
}
.um-ws-chip:hover { border-color: rgba(255,255,255,0.12); color: rgba(255,255,255,0.6); background: rgba(255,255,255,0.03); }
.um-ws-chip.active { border-color: rgba(78,205,196,0.3); color: #4ECDC4; background: rgba(78,205,196,0.08); }
.um-ws-chip-badge {
  font-size: 9px;
  font-weight: 800;
  background: rgba(251,191,36,0.2);
  color: #fbbf24;
  padding: 0 5px;
  border-radius: 6px;
  line-height: 16px;
}

/* --- Body --- */
.um-ws-body {
  flex: 1;
  overflow-y: auto;
  padding: 0 14px 14px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.um-ws-body::-webkit-scrollbar { width: 4px; }
.um-ws-body::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.08); border-radius: 4px; }
.um-ws-body::-webkit-scrollbar-thumb:hover { background: rgba(255,255,255,0.15); }

/* --- Groups --- */
.um-ws-group { margin-bottom: 4px; }
.um-ws-group-title {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.6px;
  color: rgba(255,255,255,0.35);
  padding: 10px 4px 6px;
}
.um-ws-group-pending { color: rgba(251,191,36,0.65); }
.um-ws-group-dot {
  width: 6px; height: 6px;
  border-radius: 50%;
  background: rgba(255,255,255,0.2);
  flex-shrink: 0;
}
.um-ws-group-count {
  font-size: 9px;
  font-weight: 700;
  padding: 1px 6px;
  border-radius: 6px;
  background: rgba(255,255,255,0.06);
  color: rgba(255,255,255,0.4);
  margin-left: auto;
}

/* --- User card --- */
.um-ws-card {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  background: rgba(255,255,255,0.02);
  border: 1px solid rgba(255,255,255,0.04);
  border-radius: 12px;
  transition: all 0.2s;
  margin-bottom: 2px;
}
.um-ws-card:hover {
  background: rgba(255,255,255,0.04);
  border-color: rgba(255,255,255,0.1);
}
.um-ws-pending {
  border-color: rgba(251,191,36,0.12);
  background: rgba(251,191,36,0.025);
}
.um-ws-pending:hover {
  border-color: rgba(251,191,36,0.25);
  background: rgba(251,191,36,0.05);
}
.um-ws-hardcoded {
  border-color: rgba(167,139,250,0.12);
  background: linear-gradient(135deg, rgba(167,139,250,0.035), rgba(96,165,250,0.025));
}
.um-ws-hardcoded:hover {
  border-color: rgba(167,139,250,0.25);
}

.um-ws-avatar {
  width: 36px;
  height: 36px;
  border-radius: 10px;
  background: linear-gradient(135deg, color-mix(in srgb, var(--role-c, #94a3b8) 18%, transparent), color-mix(in srgb, var(--role-c, #94a3b8) 6%, transparent));
  border: 1px solid color-mix(in srgb, var(--role-c, #94a3b8) 20%, transparent);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  font-weight: 700;
  color: var(--role-c, #94a3b8);
  flex-shrink: 0;
}
.um-ws-info {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px;
}
.um-ws-name {
  font-size: 13px;
  font-weight: 600;
  color: rgba(255,255,255,0.85);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  display: flex;
  align-items: center;
  gap: 6px;
}
.um-ws-hc-badge {
  font-size: 7px;
  font-weight: 800;
  padding: 2px 5px;
  border-radius: 4px;
  background: linear-gradient(135deg, rgba(167,139,250,0.25), rgba(96,165,250,0.2));
  color: #a78bfa;
  letter-spacing: 0.8px;
}
.um-ws-pending-badge {
  font-size: 7px;
  font-weight: 800;
  padding: 2px 5px;
  border-radius: 4px;
  background: rgba(251,191,36,0.15);
  color: #fbbf24;
  letter-spacing: 0.5px;
  animation: um-pulse 2s ease-in-out infinite;
}
@keyframes um-pulse { 0%,100% { opacity: 1; } 50% { opacity: 0.5; } }
.um-ws-inline-badge {
  font-size: 10px; font-weight: 600; padding: 2px 7px; border-radius: 5px;
  white-space: nowrap; flex-shrink: 0; margin-left: 2px;
}
.um-ws-inline-company {
  color: #fbbf24; background: rgba(251,191,36,0.13);
}
.um-ws-inline-admin {
  color: #60a5fa; background: rgba(96,165,250,0.13);
}

.um-ws-pending-company {
  display: flex; align-items: center; gap: 6px;
  margin-top: 2px; padding: 3px 8px;
  background: rgba(251,191,36,0.06); border: 1px solid rgba(251,191,36,0.12);
  border-radius: 6px; width: fit-content;
}
.um-ws-pc-label {
  font-size: 10px; font-weight: 600; color: rgba(251,191,36,0.7);
}
.um-ws-pc-btn {
  width: 20px; height: 20px; border-radius: 5px; border: none;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; transition: background 0.15s;
}
.um-ws-pc-approve {
  background: rgba(52,211,153,0.15); color: #34d399;
}
.um-ws-pc-approve:hover { background: rgba(52,211,153,0.3); }
.um-ws-pc-reject {
  background: rgba(248,113,113,0.12); color: #f87171;
}
.um-ws-pc-reject:hover { background: rgba(248,113,113,0.25); }

.um-ws-company-select {
  font-size: 11px; padding: 0 6px; height: 30px; box-sizing: border-box; border-radius: 6px;
  background: rgba(255,255,255,0.04); color: #e2e8f0;
  border: 1px solid rgba(255,255,255,0.1); outline: none;
  cursor: pointer; transition: border-color 0.2s;
  max-width: 120px;
}
.um-ws-company-select:focus { border-color: rgba(96,165,250,0.5); }
.um-ws-contr {
  font-size: 10px;
  color: rgba(255,255,255,0.35);
  display: flex;
  align-items: center;
  gap: 2px;
}
.um-ws-delegate-badge {
  font-size: 9px;
  font-weight: 700;
  padding: 1px 5px;
  border-radius: 5px;
  background: rgba(78,205,196,0.12);
  color: #4ECDC4;
}

/* --- Actions --- */
.um-ws-actions {
  display: flex;
  align-items: center;
  gap: 5px;
  flex-shrink: 0;
}

/* Custom role picker dropdown */
.um-ws-role-picker { position: relative; }
.um-ws-role-btn {
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 0 8px; height: 30px; box-sizing: border-box;
  background: rgba(255,255,255,0.04);
  border: 1px solid var(--rc, rgba(255,255,255,0.1));
  border-color: color-mix(in srgb, var(--rc, #94a3b8) 25%, transparent);
  border-radius: 8px;
  color: var(--rc, #94a3b8);
  font-size: 11px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s;
  white-space: nowrap;
}
.um-ws-role-btn:hover { background: rgba(255,255,255,0.07); }
.um-ws-role-btn-label { max-width: 80px; overflow: hidden; text-overflow: ellipsis; }
.um-ws-role-menu {
  position: absolute;
  top: calc(100% + 4px);
  right: 0;
  min-width: 190px;
  background: rgba(15,23,42,0.97);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 12px;
  padding: 5px;
  z-index: 200;
  opacity: 0;
  transform: translateY(-6px) scale(0.95);
  pointer-events: none;
  transition: all 0.2s cubic-bezier(0.16,1,0.3,1);
  backdrop-filter: blur(16px);
  box-shadow: 0 12px 40px rgba(0,0,0,0.5);
}
.um-ws-role-menu.show { opacity: 1; transform: translateY(0) scale(1); pointer-events: auto; }
.um-ws-role-opt {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  font-size: 12px;
  color: rgba(255,255,255,0.6);
  border-radius: 8px;
  cursor: pointer;
  transition: all 0.12s;
}
.um-ws-role-opt:hover { background: rgba(255,255,255,0.06); color: rgba(255,255,255,0.9); }
.um-ws-role-opt.active { color: var(--rc, #4ECDC4); font-weight: 600; background: color-mix(in srgb, var(--rc, #4ECDC4) 8%, transparent); }
.um-ws-role-opt-icon { font-size: 14px; width: 20px; text-align: center; }
.um-ws-role-check { margin-left: auto; color: var(--rc, #4ECDC4); }

/* Action buttons */
.um-ws-btn {
  width: 30px;
  height: 30px;
  border: none;
  border-radius: 9px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.18s;
}
.um-ws-btn-approve {
  background: rgba(46,204,113,0.1);
  color: #2ecc71;
}
.um-ws-btn-approve:hover {
  background: rgba(46,204,113,0.22);
  transform: scale(1.1);
  box-shadow: 0 0 12px rgba(46,204,113,0.15);
}
.um-ws-btn-reject {
  background: rgba(239,68,68,0.1);
  color: #ef4444;
}
.um-ws-btn-reject:hover {
  background: rgba(239,68,68,0.22);
  transform: scale(1.1);
}
.um-ws-btn-block {
  background: rgba(239,68,68,0.06);
  color: rgba(239,68,68,0.4);
}
.um-ws-btn-block:hover {
  background: rgba(239,68,68,0.15);
  color: #ef4444;
}

/* Delegate button (custom toggle) */
.um-ws-deleg-btn {
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 0 9px; height: 30px; box-sizing: border-box;
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 8px;
  background: rgba(255,255,255,0.02);
  color: rgba(255,255,255,0.3);
  font-size: 10px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.25s;
  white-space: nowrap;
}
.um-ws-deleg-btn:hover {
  border-color: rgba(78,205,196,0.2);
  color: rgba(255,255,255,0.5);
  background: rgba(78,205,196,0.04);
}
.um-ws-deleg-btn.on {
  border-color: rgba(78,205,196,0.3);
  background: rgba(78,205,196,0.08);
  color: #4ECDC4;
}
.um-ws-deleg-btn.on:hover {
  background: rgba(78,205,196,0.14);
}
.um-ws-deleg-btn.on svg { color: #4ECDC4; }
.um-ws-deleg-label { pointer-events: none; }

/* Empty / Loading */
.um-ws-empty {
  text-align: center;
  padding: 50px 20px;
  color: rgba(255,255,255,0.2);
  font-size: 13px;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.um-ws-loading {
  text-align: center;
  padding: 50px 20px;
  color: rgba(255,255,255,0.25);
  font-size: 13px;
}

@media (max-width: 500px) {
  .um-ws-header { padding: 10px 10px 6px; }
  .um-ws-body { padding: 0 10px 10px; }
  .um-ws-card { padding: 8px 10px; gap: 8px; }
  .um-ws-avatar { width: 30px; height: 30px; font-size: 12px; border-radius: 8px; }
  .um-ws-actions { gap: 4px; flex-wrap: wrap; justify-content: flex-end; }
  .um-ws-btn { width: 26px; height: 26px; }
  .um-ws-role-btn { padding: 4px 6px; font-size: 10px; }
  .um-ws-role-btn-label { max-width: 55px; }
  .um-ws-deleg-btn { padding: 4px 6px; font-size: 9px; }
  .um-ws-filters { flex-wrap: wrap; }
  .um-ws-sort-btn { font-size: 10px; padding: 4px 8px; }
}