/* Design Gang CRM — Apple-inspired application shell.
   This file is intentionally the last stylesheet: it turns the accumulated
   legacy themes into one coherent, semantic UI without changing workflows. */

:root {
  color-scheme: dark;
  --nakl: 255,255,255;
  --vpad: 0,0,0;
  --bg0: #101012;
  --bg1: #171719;
  --bg2: #1d1d20;
  --bg3: #252529;
  --bg4: #303036;
  --acc: #0a84ff;
  --acc2: #5e5ce6;
  --acc3: #64d2ff;
  --acc-dim: rgba(10,132,255,.15);
  --acc-border: rgba(100,210,255,.28);
  --text: #f5f5f7;
  --text2: #c7c7cc;
  --text3: #8e8e93;
  --border: rgba(255,255,255,.075);
  --border2: rgba(255,255,255,.14);
  --green: #30d158;
  --green-dim: rgba(48,209,88,.14);
  --yellow: #ffd60a;
  --yellow-dim: rgba(255,214,10,.14);
  --blue: #0a84ff;
  --blue-dim: rgba(10,132,255,.14);
  --red: #ff453a;
  --red-dim: rgba(255,69,58,.14);
  --purple: #bf5af2;
  --purple-dim: rgba(191,90,242,.14);
  --r: 14px;
  --r-sm: 10px;
  --r-lg: 18px;
  --r-xl: 24px;
  --ds-bg: #101012;
  --ds-surface-1: rgba(255,255,255,.035);
  --ds-surface-2: rgba(255,255,255,.055);
  --ds-surface-3: rgba(255,255,255,.085);
  --ds-line: rgba(255,255,255,.085);
  --ds-line-strong: rgba(255,255,255,.15);
  --ds-text: #f5f5f7;
  --ds-muted: #aeaeb2;
  --ds-faint: #727277;
  --ds-accent: #0a84ff;
  --ds-accent-soft: rgba(10,132,255,.14);
  --ds-success: #30d158;
  --ds-warning: #ffd60a;
  --ds-danger: #ff453a;
  --ds-radius: 16px;
  --ds-radius-sm: 11px;
  --ds-shadow: 0 24px 70px rgba(0,0,0,.42);
  --apple-ease: cubic-bezier(.2,.8,.2,1);
}

html, body {
  background: #101012 !important;
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", Inter, sans-serif !important;
  font-feature-settings: "tnum" 1, "ss01" 1;
  letter-spacing: -.008em;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(900px 560px at 78% -12%, rgba(10,132,255,.105), transparent 66%),
    radial-gradient(700px 500px at 12% 108%, rgba(94,92,230,.07), transparent 70%);
  z-index: -1;
}

/* Stable first frame: auth and workspace stay hidden until the session and
   core data are ready. This prevents the board, role menu and counters from
   appearing in several separate flashes. */
.boot-screen {
  position:fixed;
  inset:0;
  z-index:10000;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:14px;
  color:#f5f5f7;
  background:
    radial-gradient(620px 420px at 50% 38%,rgba(10,132,255,.12),transparent 70%),
    #101012;
  transition:opacity 180ms ease,visibility 180ms ease;
}
.boot-screen.done { opacity:0; visibility:hidden; pointer-events:none; }
.boot-mark {
  width:58px;
  height:58px;
  display:grid;
  place-items:center;
  border-radius:18px;
  background:rgba(255,255,255,.065);
  border:1px solid rgba(255,255,255,.10);
  box-shadow:0 18px 55px rgba(0,0,0,.38),inset 0 1px rgba(255,255,255,.08);
}
.boot-mark img { width:42px;height:42px;object-fit:contain; }
.boot-copy { display:flex;flex-direction:column;align-items:center;gap:4px; }
.boot-copy b { font-size:16px;font-weight:680;letter-spacing:-.025em; }
.boot-copy span { color:#85858b;font-size:11.5px; }
.boot-progress { width:150px;height:3px;overflow:hidden;border-radius:999px;background:rgba(255,255,255,.07); }
.boot-progress i { display:block;width:46%;height:100%;border-radius:inherit;background:linear-gradient(90deg,#0a84ff,#64d2ff);animation:bootSlide 1s ease-in-out infinite; }
@keyframes bootSlide { from{transform:translateX(-115%)} to{transform:translateX(250%)} }

button, input, select, textarea { font: inherit; }
button, [role="button"], .snav-item, .space-item, .task-card { -webkit-user-select: none; user-select: none; }
* { scrollbar-width: thin; scrollbar-color: rgba(255,255,255,.16) transparent; }
*::-webkit-scrollbar { width: 7px; height: 7px; }
*::-webkit-scrollbar-track { background: transparent; }
*::-webkit-scrollbar-thumb { background: rgba(255,255,255,.15); border-radius: 999px; border: 2px solid transparent; background-clip: padding-box; }
*::-webkit-scrollbar-thumb:hover { background: rgba(255,255,255,.25); background-clip: padding-box; }

/* App shell */
.app { background: transparent !important; }
.sidebar {
  width: 252px !important;
  min-width: 252px !important;
  background: rgba(24,24,27,.84) !important;
  border-right: 1px solid rgba(255,255,255,.085) !important;
  box-shadow: inset -1px 0 rgba(0,0,0,.28), 12px 0 34px rgba(0,0,0,.12) !important;
  backdrop-filter: blur(38px) saturate(145%) !important;
  -webkit-backdrop-filter: blur(38px) saturate(145%) !important;
}
.sidebar-logo {
  height: 70px;
  padding: 15px 18px !important;
  border-bottom: 0 !important;
}
.sidebar-logo img { height: 34px !important; filter: saturate(.7) brightness(1.12); }
.sidebar-command {
  width: calc(100% - 20px);
  min-height: 36px !important;
  margin: 0 10px 6px;
  padding: 7px 9px !important;
  display: flex;
  align-items: center;
  gap: 8px;
  color: #8f8f95;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.075);
  border-radius: 10px !important;
  font-size: 12.5px;
  text-align: left;
}
.sidebar-command:hover { color:#fff; background:rgba(255,255,255,.07); }
.sidebar-command-icon { font-size:18px; line-height:1; color:#aaaab0; }
.sidebar-command span:nth-child(2) { flex:1; }
.sidebar-command kbd { padding:2px 5px; border-radius:5px; color:#717177; background:rgba(255,255,255,.055); font-size:10px; font-family:inherit; }
.sidebar-scroll { flex:1 1 auto; min-height:0; overflow-y:auto; overscroll-behavior:contain; }
.sidebar-nav { padding: 2px 10px 10px !important; border-bottom: 0 !important; overflow:visible; min-height:0; max-height:none; flex:none !important; }
.snav-group, .sidebar-section-title {
  padding: 14px 9px 6px !important;
  color: #717176 !important;
  font-size: 10px !important;
  font-weight: 650 !important;
  letter-spacing: .085em !important;
}
.snav-item {
  min-height: 38px;
  margin: 2px 0 !important;
  padding: 8px 10px !important;
  gap: 10px !important;
  color: #aaaab0 !important;
  border: 1px solid transparent !important;
  border-radius: 10px !important;
  font-size: 13.5px !important;
  font-weight: 520 !important;
  transition: color 140ms ease, background 140ms ease, transform 140ms ease !important;
}
.snav-item:hover { color: #fff !important; background: rgba(255,255,255,.055) !important; }
.snav-item:active { transform: scale(.985); }
.snav-item.active {
  color: #fff !important;
  background: linear-gradient(180deg, rgba(255,255,255,.12), rgba(255,255,255,.075)) !important;
  border-color: rgba(255,255,255,.10) !important;
  box-shadow: 0 1px 2px rgba(0,0,0,.3), inset 0 1px rgba(255,255,255,.08) !important;
}
.snav-item.active .snav-icon { color: #64d2ff; }
.snav-icon { width: 19px; text-align: center; opacity: .88; top: 0 !important; }
.snav-glyph { width:19px; height:19px; display:grid; place-items:center; color:#929299; font-size:16px; font-weight:600; line-height:1; }
.snav-badge { background: rgba(255,255,255,.07) !important; color: #929298 !important; }
.sidebar-spaces { padding: 2px 10px 10px !important; overflow:visible !important; min-height:auto !important; }
.sidebar-section-head { padding: 0 !important; }
.sidebar-section-add { width: 26px !important; height: 26px !important; border-radius: 8px !important; }
.space-item { margin: 2px 0 !important; border-radius: 10px !important; border: 1px solid transparent !important; }
.space-item.active { background: rgba(10,132,255,.14) !important; border-color: rgba(10,132,255,.2) !important; }
.sidebar-hub {
  margin: 6px 10px 0;
  padding: 9px 10px;
  display:flex;
  align-items:center;
  gap:9px;
  color:#d8d8dc;
  text-decoration:none;
  background:linear-gradient(135deg,rgba(10,132,255,.10),rgba(94,92,230,.08));
  border:1px solid rgba(100,210,255,.13);
  border-radius:12px;
}
.sidebar-hub:hover { border-color:rgba(100,210,255,.28); background:linear-gradient(135deg,rgba(10,132,255,.16),rgba(94,92,230,.12)); }
.sidebar-hub-icon { width:28px; height:28px; display:grid; place-items:center; flex:0 0 28px; border-radius:8px; color:white; background:linear-gradient(145deg,#0a84ff,#5e5ce6); font-size:9px; font-weight:750; }
.sidebar-hub > span:nth-child(2) { flex:1; min-width:0; display:flex; flex-direction:column; }
.sidebar-hub b { font-size:12px; font-weight:620; }
.sidebar-hub small { margin-top:1px; color:#77777d; font-size:9.5px; }
.sidebar-hub small.ok { color:#62c97d; }
.sidebar-hub small.pending { color:#e5b94b; }
.sidebar-hub small.offline { color:#ff6961; }
.sidebar-hub i { color:#77777d; font-style:normal; }
.sidebar-user {
  margin: 8px 10px 10px !important;
  padding: 10px !important;
  border: 1px solid rgba(255,255,255,.07) !important;
  border-radius: 13px !important;
  background: rgba(255,255,255,.035) !important;
}
.sidebar-user:hover { background: rgba(255,255,255,.065) !important; }
.sidebar-avatar { background: linear-gradient(145deg,#64d2ff,#5e5ce6) !important; box-shadow: inset 0 1px rgba(255,255,255,.25); }
.sidebar-user-role { color: #7d7d83 !important; letter-spacing: .04em !important; }

.main { background: transparent !important; }
.page { padding: 25px 28px 22px !important; }
.page-header {
  min-height: 47px;
  margin: 0 0 18px !important;
  align-items: center !important;
  gap: 18px !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
.page-title {
  font-size: 26px !important;
  line-height: 1.14 !important;
  font-weight: 690 !important;
  letter-spacing: -.035em !important;
}
.page-sub { color: #818187 !important; font-size: 13px !important; margin-top: 4px !important; }
.page-tag {
  padding: 4px 8px !important;
  background: rgba(10,132,255,.13) !important;
  color: #64d2ff !important;
  border: 0 !important;
  font-size: 10px !important;
  letter-spacing: .01em !important;
}
.page-actions { gap: 8px !important; }

.crm-filter-panel {
  display: grid;
  grid-template-columns: minmax(190px,300px) minmax(0,1fr);
  align-items: center;
  gap: 10px;
  margin: 0 0 15px;
  padding: 9px;
  background: rgba(255,255,255,.028);
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 14px;
  box-shadow: inset 0 1px rgba(255,255,255,.025);
}
.crm-filter-panel .search-wrap { width:100%; max-width:none; }
.crm-filter-panel .search-inp { width:100%; margin:0 !important; }
.crm-filter-scroll { display:flex; align-items:center; justify-content:flex-end; gap:7px; min-width:0; overflow-x:auto; scrollbar-width:none; }
.crm-filter-scroll::-webkit-scrollbar { display:none; }
.crm-filter-scroll .hselect, .crm-filter-scroll #выборПорядка { width:auto !important; max-width:170px; min-width:max-content; margin:0 !important; }
.crm-filter-advanced { display:none !important; }
.crm-filter-panel.expanded .crm-filter-scroll { justify-content:flex-start; }
.crm-filter-panel.expanded .crm-filter-advanced { display:block !important; }
.crm-filter-more.active { color:#64d2ff !important; background:rgba(10,132,255,.14) !important; border-color:rgba(10,132,255,.24) !important; }
.filter-count { min-width:18px; height:18px; padding:0 5px; align-items:center; justify-content:center; border-radius:9px; color:#fff; background:var(--acc); font-size:10px; }

/* Controls */
.hbtn, .btn, button.auth-btn {
  min-height: 36px;
  padding: 8px 13px !important;
  border-radius: 10px !important;
  font-weight: 590 !important;
  letter-spacing: -.01em;
  transition: transform 120ms ease, background 140ms ease, border-color 140ms ease, box-shadow 140ms ease !important;
}
.hbtn.sm { min-height: 32px; padding: 6px 11px !important; }
.hbtn:active, .btn:active { transform: scale(.97) !important; }
.hbtn.primary, .btn-primary, button.auth-btn {
  color: white !important;
  background: linear-gradient(180deg,#168cff,#0878ec) !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  box-shadow: 0 4px 14px rgba(10,132,255,.22), inset 0 1px rgba(255,255,255,.24) !important;
}
.hbtn.primary:hover, .btn-primary:hover { background: linear-gradient(180deg,#2a98ff,#0a84ff) !important; transform: translateY(-1px); }
.hbtn.ghost, .btn-ghost {
  color: #d0d0d4 !important;
  background: rgba(255,255,255,.055) !important;
  border: 1px solid rgba(255,255,255,.085) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.035) !important;
}
.hbtn.ghost:hover, .btn-ghost:hover { color: #fff !important; background: rgba(255,255,255,.09) !important; border-color: rgba(255,255,255,.14) !important; }
.hbtn.danger { color: #ff6961 !important; background: var(--red-dim) !important; border-color: rgba(255,69,58,.2) !important; }
.hselect, .minput, .mselect, .mtextarea, .search-inp, #выборПорядка, .field-input {
  min-height: 38px;
  color: #ededf0 !important;
  background: rgba(255,255,255,.055) !important;
  border: 1px solid rgba(255,255,255,.095) !important;
  border-radius: 10px !important;
  box-shadow: inset 0 1px 1px rgba(0,0,0,.14) !important;
  outline: none !important;
  transition: border-color 140ms ease, background 140ms ease, box-shadow 140ms ease !important;
}
.hselect:hover, .minput:hover, .mselect:hover, .search-inp:hover { background: rgba(255,255,255,.07) !important; }
.hselect:focus, .minput:focus, .mselect:focus, .mtextarea:focus, .search-inp:focus, .field-input:focus {
  border-color: rgba(10,132,255,.8) !important;
  box-shadow: 0 0 0 3px rgba(10,132,255,.18), inset 0 1px 1px rgba(0,0,0,.12) !important;
}
.search-wrap { max-width: 360px; }
.search-inp { padding-left: 36px !important; }
.filters-bar { margin: 0 0 16px !important; gap: 8px !important; }
#переключательВидов {
  padding: 3px !important;
  border-radius: 11px !important;
  background: rgba(255,255,255,.05) !important;
  border: 1px solid rgba(255,255,255,.075) !important;
}
.видКнопка { min-height: 30px !important; padding: 5px 12px !important; border-radius: 8px !important; color: #909096 !important; }
.видКнопка.active { color: #fff !important; background: rgba(255,255,255,.12) !important; box-shadow: 0 1px 3px rgba(0,0,0,.28) !important; }

/* Board */
#темпПолоса { margin: 0 0 17px !important; }
#темпПолоса > div, .tempo-card, .team-tempo {
  background: linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.03)) !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  border-radius: 15px !important;
  box-shadow: inset 0 1px rgba(255,255,255,.035) !important;
}
.board-wrap, .board-cols { gap: 14px !important; }
.board-cols { padding: 0 1px 10px !important; }
.board-col {
  flex: 1 0 270px !important;
  min-width: 270px !important;
  width: auto !important;
  background: rgba(255,255,255,.027) !important;
  border: 1px solid rgba(255,255,255,.072) !important;
  border-radius: 16px !important;
  box-shadow: inset 0 1px rgba(255,255,255,.025) !important;
  overflow: hidden;
}
.board-col-header, .col-head {
  min-height: 49px;
  padding: 12px 14px !important;
  background: rgba(255,255,255,.018) !important;
  border-bottom: 1px solid rgba(255,255,255,.065) !important;
}
.board-col-title, .col-title { font-size: 12.5px !important; font-weight: 650 !important; letter-spacing: .015em !important; }
.col-body { padding: 9px !important; gap: 8px !important; }
.task-card, .kcard {
  min-height: 88px;
  padding: 13px 14px !important;
  color: var(--text) !important;
  background: linear-gradient(180deg, rgba(255,255,255,.068), rgba(255,255,255,.043)) !important;
  border: 1px solid rgba(255,255,255,.09) !important;
  border-left: 1px solid rgba(255,255,255,.09) !important;
  border-radius: 13px !important;
  box-shadow: 0 1px 2px rgba(0,0,0,.18), inset 0 1px rgba(255,255,255,.035) !important;
  transform: none !important;
  transition: transform 150ms var(--apple-ease), background 150ms ease, border-color 150ms ease, box-shadow 150ms ease !important;
}
.task-card::before {
  content: "";
  position: absolute;
  top: 14px;
  left: 11px;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--yellow);
  box-shadow: 0 0 0 3px rgba(255,214,10,.09);
}
.task-card.HIGH::before, .task-card[data-priority="HIGH"]::before { background: var(--red); box-shadow: 0 0 0 3px rgba(255,69,58,.1); }
.task-card.LOW::before, .task-card[data-priority="LOW"]::before { background: var(--green); box-shadow: 0 0 0 3px rgba(48,209,88,.1); }
.task-card:hover, .kcard:hover {
  background: linear-gradient(180deg, rgba(255,255,255,.095), rgba(255,255,255,.06)) !important;
  border-color: rgba(255,255,255,.16) !important;
  border-left-color: rgba(255,255,255,.16) !important;
  box-shadow: 0 10px 28px rgba(0,0,0,.25), inset 0 1px rgba(255,255,255,.06) !important;
  transform: translateY(-2px) !important;
}
.task-card:active { transform: scale(.988) !important; }
.task-card .tc-title { padding-left: 10px !important; padding-right: 0 !important; font-size: 13.5px !important; line-height: 1.3 !important; font-weight: 620 !important; letter-spacing: -.012em !important; }
.task-card .tc-date-top, .task-card .tc-id { color: #77777d !important; }
.task-card .tc-top { display:flex !important; align-items:center; gap:8px; min-width:0; margin:0 0 7px !important; }
.task-card .tc-date-top { position:static !important; display:flex; align-items:center; justify-content:flex-end; gap:5px; margin-left:auto; min-width:0; white-space:nowrap; font-size:10px !important; }
.task-card .tc-zastoj { flex:0 0 auto; }
.task-card .tc-metka, .task-card .tag, .task-card .badge { background: rgba(255,255,255,.06) !important; color: #aaaab0 !important; }
.task-card .tc-footer { border-top-color: rgba(255,255,255,.055) !important; }
.task-card .tc-ava { box-shadow: 0 0 0 2px #262629 !important; }
.crm-empty, .empty-state { color: var(--text3); }

/* CRM workspace — спокойная иерархия вместо набора разрозненных панелей. */
.page[data-page="crm"] > .page-header {
  position: relative;
  padding-bottom: 14px !important;
  border-bottom: 0 !important;
}
.crm-header-context { display:flex; align-items:center; gap:10px; min-height:22px; margin-top:5px; }
.crm-header-hint { color:#74747b; font-size:11.5px; letter-spacing:-.005em; }
.realtime-status {
  display:inline-flex; align-items:center; gap:7px; width:max-content;
  min-height:22px; padding:3px 9px 3px 7px; border-radius:999px;
  color:#8e8e94; background:rgba(255,255,255,.035);
  border:1px solid rgba(255,255,255,.06); font-size:10.5px; font-weight:600;
  transition:color 180ms ease,background 180ms ease,border-color 180ms ease;
}
.realtime-status > span { width:6px; height:6px; border-radius:50%; background:#8e8e93; box-shadow:0 0 0 3px rgba(142,142,147,.08); }
.realtime-status[data-state="online"] { color:#77d98c; background:rgba(48,209,88,.07); border-color:rgba(48,209,88,.13); }
.realtime-status[data-state="online"] > span { background:#30d158; box-shadow:0 0 0 3px rgba(48,209,88,.1); }
.realtime-status[data-state="reconnecting"] > span { animation:crm-status-pulse 1.15s ease-in-out infinite; }
@keyframes crm-status-pulse { 50% { opacity:.35; transform:scale(.75); } }

.crm-filter-panel {
  margin:0 0 13px !important; padding:8px !important; border-radius:15px !important;
  background:rgba(255,255,255,.032) !important; border:1px solid rgba(255,255,255,.068) !important;
  box-shadow:inset 0 1px rgba(255,255,255,.025),0 8px 30px rgba(0,0,0,.08) !important;
}
.crm-filter-panel .search-wrap { background:rgba(0,0,0,.16) !important; border-color:rgba(255,255,255,.075) !important; }
.crm-filter-panel .hselect, .crm-filter-panel select, .crm-filter-panel .hbtn { min-height:34px; border-radius:9px !important; }
#переключательВидов { background:rgba(255,255,255,.038) !important; border-color:rgba(255,255,255,.07) !important; }
.видКнопка { min-height:29px !important; padding:0 11px !important; border-radius:8px !important; }
.видКнопка.active { background:rgba(255,255,255,.12) !important; box-shadow:0 1px 4px rgba(0,0,0,.22),inset 0 1px rgba(255,255,255,.06) !important; }
.board-wrap { position:relative; border-radius:18px; background:linear-gradient(180deg,rgba(255,255,255,.012),rgba(255,255,255,0)); }
.board-col { min-height:calc(100vh - 235px); }
.board-col .col-head { position:sticky; top:0; z-index:3; backdrop-filter:blur(18px) saturate(135%); }
.col-dot { box-shadow:0 0 0 3px rgba(255,255,255,.045); }
.col-cnt { min-width:20px; height:20px; display:inline-grid; place-items:center; border-radius:999px; background:rgba(255,255,255,.055); font-variant-numeric:tabular-nums; }
.col-plus { width:27px !important; height:27px !important; border-radius:8px !important; opacity:.62; transition:opacity 140ms ease,background 140ms ease,transform 140ms ease; }
.col-plus:hover { opacity:1; background:rgba(255,255,255,.09) !important; transform:scale(1.04); }
.task-card:focus-visible { outline:2px solid rgba(10,132,255,.75) !important; outline-offset:2px; }
.task-live-notice {
  align-items:center; gap:8px; margin:0 18px 10px; padding:9px 12px;
  color:#ffd66a; background:rgba(255,214,10,.075); border:1px solid rgba(255,214,10,.16);
  border-radius:10px; font-size:12px; font-weight:600;
}
.task-live-notice::before { content:""; width:7px; height:7px; border-radius:50%; background:#ffd60a; box-shadow:0 0 0 4px rgba(255,214,10,.09); }

/* Shared content surfaces */
.card, .stat-card, .settings-section, .dash-card, .user-mgmt-card, .feed-item,
.ds-panel, .ds-kpi, .ds-team-card, .ds-list-row, .ds-table-wrap {
  background: linear-gradient(180deg, rgba(255,255,255,.052), rgba(255,255,255,.028)) !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  border-radius: 16px !important;
  box-shadow: inset 0 1px rgba(255,255,255,.035), 0 1px 2px rgba(0,0,0,.1) !important;
}
.stat-val, .ds-kpi-value { letter-spacing: -.04em !important; }
.ds-page { max-width: 1460px !important; gap: 16px !important; }
.ds-eyebrow { color: #64d2ff !important; }
.ds-title { font-size: clamp(25px,2.3vw,34px) !important; letter-spacing: -.04em !important; }
.ds-tabs { background: rgba(255,255,255,.045) !important; border-color: rgba(255,255,255,.075) !important; }
.ds-tab.active { color: white !important; background: rgba(255,255,255,.115) !important; box-shadow: 0 1px 3px rgba(0,0,0,.24) !important; }
.ds-bar-fill { background: linear-gradient(90deg,#0a84ff,#64d2ff) !important; }
.ds-chart-bar { background: linear-gradient(180deg,#64d2ff,#0a84ff) !important; box-shadow: 0 5px 15px rgba(10,132,255,.14); }
.ds-chart-value { color: #64d2ff !important; }
.ds-badge { border-color: rgba(255,255,255,.08) !important; }
.ds-badge.success { color: var(--green) !important; background: var(--green-dim) !important; }
.ds-badge.warning { color: var(--yellow) !important; background: var(--yellow-dim) !important; }
.ecosystem-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; }
.ecosystem-service { min-width:0; padding:11px; display:flex; align-items:center; gap:10px; background:rgba(255,255,255,.032); border:1px solid rgba(255,255,255,.07); border-radius:12px; }
.ecosystem-service > div { flex:1; min-width:0; display:flex; flex-direction:column; }
.ecosystem-service b { font-size:13px; font-weight:650; }
.ecosystem-service small { margin-top:2px; color:var(--text3); font-size:10.5px; line-height:1.35; }
.ecosystem-icon { width:34px; height:34px; display:grid; place-items:center; flex:0 0 34px; border-radius:10px; color:#fff; background:linear-gradient(145deg,#0a84ff,#64d2ff); font-size:13px; font-weight:750; box-shadow:inset 0 1px rgba(255,255,255,.24); }
.ecosystem-icon.violet { background:linear-gradient(145deg,#bf5af2,#5e5ce6); }

/* Modal and sheets */
.modal-overlay {
  background: rgba(0,0,0,.52) !important;
  backdrop-filter: blur(16px) saturate(125%) !important;
  -webkit-backdrop-filter: blur(16px) saturate(125%) !important;
}
.modal, .sheet {
  background: rgba(30,30,33,.94) !important;
  border: 1px solid rgba(255,255,255,.13) !important;
  border-radius: 22px !important;
  box-shadow: 0 30px 90px rgba(0,0,0,.55), inset 0 1px rgba(255,255,255,.08) !important;
  backdrop-filter: blur(38px) saturate(140%) !important;
  -webkit-backdrop-filter: blur(38px) saturate(140%) !important;
  animation: appleModalIn 240ms var(--apple-ease) both !important;
}
.sheet:not(.open) { transform: translateY(100%) !important; animation: none !important; }
.sheet.open { animation: appleSheetIn 260ms var(--apple-ease) both !important; }
.modal-head {
  min-height: 66px;
  padding: 15px 18px !important;
  background: rgba(255,255,255,.025) !important;
  border-bottom: 1px solid rgba(255,255,255,.075) !important;
}
.modal-head-title { font-size: 17px !important; font-weight: 650 !important; letter-spacing: -.025em; }
.modal-close {
  width: 30px !important;
  height: 30px !important;
  border: 0 !important;
  border-radius: 50% !important;
  color: #aaaab0 !important;
  background: rgba(255,255,255,.075) !important;
}
.modal-close:hover { color: white !important; background: rgba(255,255,255,.13) !important; }
.task-shell-side { background: rgba(255,255,255,.025) !important; border-left-color: rgba(255,255,255,.075) !important; }
.task-description, .task-module, .task-facts { border-color: rgba(255,255,255,.075) !important; background: rgba(255,255,255,.028) !important; }
.dropdown, .menu-popup, .ctx-menu {
  background: rgba(39,39,42,.92) !important;
  border: 1px solid rgba(255,255,255,.13) !important;
  box-shadow: 0 20px 55px rgba(0,0,0,.48), inset 0 1px rgba(255,255,255,.07) !important;
  backdrop-filter: blur(30px) saturate(135%) !important;
  -webkit-backdrop-filter: blur(30px) saturate(135%) !important;
}
#cmdk { background:rgba(0,0,0,.48) !important; backdrop-filter:blur(16px) !important; -webkit-backdrop-filter:blur(16px) !important; }
.cmdk-panel { background:rgba(31,31,34,.96) !important; border:1px solid rgba(255,255,255,.13) !important; box-shadow:0 30px 90px rgba(0,0,0,.55),inset 0 1px rgba(255,255,255,.07) !important; backdrop-filter:blur(34px) saturate(135%); -webkit-backdrop-filter:blur(34px) saturate(135%); }
#cmdk-inp { border-bottom-color:rgba(255,255,255,.08) !important; }
.cmdk-item { transition:background 100ms ease; }

/* Feedback floats above content but no longer shouts. */
.bug-feedback-fab {
  right: 18px !important;
  bottom: 18px !important;
  color: #d9d9de !important;
  background: rgba(40,40,43,.82) !important;
  border-color: rgba(255,255,255,.11) !important;
  box-shadow: 0 12px 34px rgba(0,0,0,.32) !important;
  backdrop-filter: blur(24px) !important;
  -webkit-backdrop-filter: blur(24px) !important;
}

@keyframes appleModalIn {
  from { opacity: 0; transform: translateY(14px) scale(.985); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}
@keyframes appleSheetIn {
  from { opacity: .7; transform: translateY(100%); }
  to { opacity: 1; transform: translateY(0); }
}

@media (max-width: 1100px) {
  .sidebar { width: 228px !important; min-width: 228px !important; }
  .page { padding: 22px 20px 18px !important; }
  .page-header { align-items: flex-start !important; }
  .page-actions { max-width: 68%; justify-content: flex-end; }
  .board-col { min-width: 255px !important; }
  .crm-filter-panel { grid-template-columns:220px minmax(0,1fr); }
}

@media (max-width: 680px) {
  .page { padding: 74px 14px calc(var(--bnav-h) + 14px) !important; }
  .page-header { min-height: 42px; margin-bottom: 14px !important; padding: 0 !important; }
  .page-title { font-size: 23px !important; }
  .page-actions { max-width: none; width: 100%; justify-content: flex-start; overflow-x: auto; flex-wrap: nowrap !important; padding-bottom: 3px; scrollbar-width: none; }
  .page-actions::-webkit-scrollbar { display:none; }
  #переключательВидов { min-width: max-content !important; width: auto !important; height: 38px !important; flex-direction: row !important; align-items: center !important; }
  #переключательВидов .видКнопка { width: auto !important; min-width: max-content !important; height: 30px !important; }
  .filters-bar { min-height: 42px !important; height: auto !important; padding: 0 !important; }
  .crm-filter-panel { display:block; margin-bottom:14px; padding:8px; }
  .crm-header-hint { display:none; }
  .crm-header-context { margin-top:4px; }
  .realtime-status { font-size:10px; max-width:180px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .crm-filter-panel { margin-left:0 !important; margin-right:0 !important; border-radius:13px !important; }
  .board-col { min-height:calc(100vh - 280px); }
  .crm-filter-panel .search-wrap { margin-bottom:8px; }
  .crm-filter-scroll { justify-content:flex-start; }
  .crm-filter-scroll .hselect, .crm-filter-scroll #выборПорядка { min-height:36px; }
  .sidebar-scroll { scrollbar-gutter:stable; }
  .ecosystem-grid { grid-template-columns:1fr; }
  .bnav-more { background:transparent !important; border:0 !important; color:inherit !important; box-shadow:none !important; padding:0 !important; }
  .sidebar { width: min(310px,86vw) !important; min-width: min(310px,86vw) !important; }
  .board-col { min-width: min(84vw,330px) !important; flex-basis: min(84vw,330px) !important; }
  .task-card { min-height: 92px; }
  .modal, .sheet { border-radius: 22px 22px 0 0 !important; }
  .task-shell-side { border-left: 0 !important; border-top-color: rgba(255,255,255,.075) !important; }
  .bug-feedback-fab { bottom: calc(var(--bnav-h) + 12px) !important; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .001ms !important; transition-duration: .001ms !important; scroll-behavior: auto !important; }
}