/* ═══════════════════════════════════════════════════
   CRM PANEL — DARK / LIGHT THEME
   ═══════════════════════════════════════════════════ */

/* ── DARK THEME (default) ─────────────────────────── */
:root,
[data-theme="dark"] {
  --bg:        #17212b;
  --bg2:       #232e3c;
  --bg3:       #1c2733;
  --panel:     #1e2d3d;
  --card:      #242f3d;
  --card2:     #2b3a4d;
  --border:    rgba(255,255,255,0.06);
  --border2:   rgba(255,255,255,0.11);
  --accent:    #5288c1;
  --accent-h:  #6094c8;
  --accent2:   #6ea0d0;
  --accent-bg: rgba(82,136,193,0.13);
  --red:       #e74c3c;
  --green:     #2ecc71;
  --yellow:    #f39c12;
  --text:      #e8e8e8;
  --text2:     #a8b8cc;
  --text3:     #64788f;
  --r:         12px;
  --r-sm:      8px;
  --r-xs:      6px;
  --shadow:    0 8px 32px rgba(0,0,0,0.45);
  --shadow-sm: 0 2px 12px rgba(0,0,0,0.3);
  --modal-bg:  rgba(0,0,0,0.65);
  --theme-icon: "🌙";
}

/* ── LIGHT THEME ──────────────────────────────────── */
[data-theme="light"] {
  --bg:        #f0f4f8;
  --bg2:       #ffffff;
  --bg3:       #e8edf2;
  --panel:     #ffffff;
  --card:      #ffffff;
  --card2:     #f5f7fa;
  --border:    rgba(0,0,0,0.09);
  --border2:   rgba(0,0,0,0.15);
  --accent:    #2e6da4;
  --accent-h:  #245d8e;
  --accent2:   #2e6da4;
  --accent-bg: rgba(46,109,164,0.10);
  --red:       #c0392b;
  --green:     #27ae60;
  --yellow:    #d68910;
  --text:      #1a2533;
  --text2:     #4a5d72;
  --text3:     #8a9cb0;
  --r:         12px;
  --r-sm:      8px;
  --r-xs:      6px;
  --shadow:    0 8px 32px rgba(0,0,0,0.12);
  --shadow-sm: 0 2px 12px rgba(0,0,0,0.08);
  --modal-bg:  rgba(0,0,0,0.40);
  --theme-icon: "☀️";
}

*{box-sizing:border-box;margin:0;padding:0;}
html,body{height:100%;background:var(--bg);color:var(--text);font-family:'Inter',system-ui,sans-serif;font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased;transition:background .2s,color .2s;}

::-webkit-scrollbar{width:4px;height:4px;}
::-webkit-scrollbar-track{background:transparent;}
::-webkit-scrollbar-thumb{background:var(--border2);border-radius:4px;}
::-webkit-scrollbar-thumb:hover{background:var(--accent);}

.hidden{display:none!important;}
a{color:inherit;text-decoration:none;}
button{cursor:pointer;font-family:inherit;}

/* ── GATE ──────────────────────────────────────────── */
.gate-overlay{
  position:fixed;inset:0;
  display:flex;align-items:center;justify-content:center;
  background:radial-gradient(ellipse at 50% 30%,#1a2d42 0%,#0f1923 60%,#0a1520 100%);
  padding:20px;z-index:100;
}
[data-theme="light"] .gate-overlay{
  background:radial-gradient(ellipse at 50% 30%,#d6e4f0 0%,#b8d0e8 60%,#a0bcd8 100%);
}
.gate-card{
  background:var(--card);border:1px solid var(--border2);border-radius:var(--r);
  padding:38px 32px;width:100%;max-width:420px;
  box-shadow:var(--shadow);
  display:flex;flex-direction:column;align-items:center;gap:6px;
  animation:fadeUp .3s ease;
}
.gate-logo{margin-bottom:6px;}
.gate-title{font-size:22px;font-weight:800;color:var(--text);}
.gate-sub{font-size:13px;color:var(--text2);margin-bottom:8px;}
.gate-form{width:100%;display:flex;flex-direction:column;gap:12px;margin-top:8px;}
.gate-err{font-size:12px;color:var(--red);text-align:center;padding:7px;background:rgba(231,76,60,.1);border-radius:var(--r-xs);border:1px solid rgba(231,76,60,.2);}
.gate-btn{width:100%;justify-content:center;height:42px;font-size:14px;}

/* ── APP LAYOUT ─────────────────────────────────────── */
.app{display:flex;flex-direction:column;height:100vh;overflow:hidden;}

/* ── TOP BAR ────────────────────────────────────────── */
.topbar{
  display:flex;align-items:center;gap:8px;padding:9px 14px;
  background:var(--bg2);border-bottom:1px solid var(--border);
  flex-shrink:0;flex-wrap:wrap;
}
.topbar-group{display:flex;align-items:center;gap:6px;}
.topbar-sep{width:1px;height:22px;background:var(--border2);margin:0 4px;flex-shrink:0;}
.topbar-right{margin-left:auto;display:flex;align-items:center;gap:6px;}
.topbar-input{
  height:30px;padding:0 10px;background:var(--bg3);
  border:1px solid var(--border2);border-radius:var(--r-xs);
  color:var(--text);font-size:13px;width:120px;outline:none;
  transition:border-color .2s;
}
.topbar-input:focus{border-color:var(--accent);}
.topbar-input::placeholder{color:var(--text3);}

/* ── MAIN LAYOUT ────────────────────────────────────── */
.main-layout{display:flex;flex:1;overflow:hidden;}

/* ── WORKSPACE ──────────────────────────────────────── */
.workspace-col{flex:1;overflow-y:auto;min-width:0;}
.workspace{padding:16px;max-width:900px;display:flex;flex-direction:column;gap:12px;}

.workspace-placeholder{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  height:100%;gap:12px;padding:60px 20px;
}
.placeholder-icon{font-size:52px;opacity:.25;}
.placeholder-text{font-size:18px;font-weight:600;color:var(--text2);}
.placeholder-sub{font-size:13px;color:var(--text3);}

/* ── CLIENT HEADER ──────────────────────────────────── */
.client-head{
  display:flex;align-items:flex-start;justify-content:space-between;
  gap:12px;flex-wrap:wrap;
}
.client-head-left{display:flex;align-items:center;gap:14px;}
.client-avatar{
  width:54px;height:54px;border-radius:50%;flex-shrink:0;
  background:linear-gradient(135deg,#2b5278 0%,#5288c1 100%);
  display:flex;align-items:center;justify-content:center;
  font-size:18px;font-weight:800;color:#fff;
  box-shadow:0 2px 14px rgba(82,136,193,.35);
}
.client-name{font-size:19px;font-weight:700;color:var(--text);margin-bottom:5px;}
.client-links{display:flex;flex-wrap:wrap;gap:7px;}
.bx-link{
  font-size:12px;color:var(--accent2);padding:3px 10px;
  background:var(--accent-bg);border-radius:20px;
  border:1px solid rgba(82,136,193,.2);
  transition:all .18s;
}
.bx-link:hover{background:rgba(82,136,193,.22);color:var(--text);}

/* ── ARBITR STRIP ───────────────────────────────────── */
.arbitr-strip{
  background:linear-gradient(135deg,var(--card) 0%,var(--card2) 100%);
  border:1px solid rgba(82,136,193,.2);border-radius:var(--r);
  padding:12px 15px;display:flex;flex-direction:column;gap:9px;
}
.arbitr-strip-empty{opacity:.5;}
.arbitr-head{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px;}
.arbitr-meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.arbitr-case{font-size:15px;font-weight:700;color:var(--accent2);}
.arbitr-case:hover{color:var(--text);}
.arbitr-badge{font-size:11px;font-weight:600;padding:2px 9px;border-radius:20px;color:#fff;}
.arbitr-court{font-size:12px;color:var(--text2);}
.arbitr-btns{display:flex;gap:5px;align-items:center;}
.arbitr-dates{display:flex;flex-wrap:wrap;gap:6px;}
.date-chip{font-size:12px;padding:3px 9px;background:var(--bg3);border:1px solid var(--border2);border-radius:20px;color:var(--text2);}
.date-chip.court{background:rgba(82,136,193,.1);border-color:rgba(82,136,193,.25);color:var(--accent2);}
.arbitr-stages{border-top:1px solid var(--border);padding-top:10px;display:flex;flex-direction:column;gap:5px;max-height:220px;overflow-y:auto;}
.stage-row{display:grid;grid-template-columns:95px 155px 1fr;gap:8px;padding:6px 8px;background:var(--bg3);border-radius:var(--r-xs);align-items:start;}
.stage-date{font-size:12px;color:var(--text3);font-variant-numeric:tabular-nums;}
.stage-type{font-size:12px;color:var(--accent2);font-weight:500;}
.stage-desc{font-size:12px;color:var(--text2);}

/* ── SECTION CARD ───────────────────────────────────── */
.section-card{
  background:var(--card);border:1px solid var(--border);border-radius:var(--r);
  padding:14px;display:flex;flex-direction:column;gap:12px;
  transition:border-color .18s,background .2s;
}
.section-card:hover{border-color:var(--border2);}
.section-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.section-icon{font-size:16px;}
.section-title{font-size:14px;font-weight:700;color:var(--text);flex:1;}

/* ── SECTION HEAD ACTIONS ──────────────────────────── */
.section-actions{display:flex;align-items:center;gap:5px;margin-left:auto;}

/* ── DATA GRID ──────────────────────────────────────── */
.data-grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(255px,1fr));
  gap:1px;background:var(--border);border-radius:var(--r-xs);overflow:hidden;
}
.data-row{display:flex;flex-direction:column;gap:2px;padding:9px 11px;background:var(--card2);}
.data-label{font-size:11px;color:var(--text3);font-weight:600;text-transform:uppercase;letter-spacing:.04em;}
.data-value{font-size:13px;color:var(--text);word-break:break-word;}
.data-link{color:var(--accent2);}
.data-link:hover{text-decoration:underline;}

/* ── DEPT CARDS ─────────────────────────────────────── */
.dept-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(215px,1fr));gap:8px;}
.dept-card{
  background:var(--bg3);border:1px solid var(--border);border-radius:var(--r-sm);
  padding:11px 13px;display:flex;flex-direction:column;gap:4px;
  transition:border-color .18s;
}
.dept-card:hover{border-color:var(--border2);}
.dept-card.selected{border-color:rgba(82,136,193,.35);background:rgba(82,136,193,.06);}
.dept-card-top{display:flex;align-items:center;justify-content:space-between;gap:6px;}
.dept-card-label{font-size:11px;font-weight:700;color:var(--accent2);text-transform:uppercase;letter-spacing:.05em;}
.dept-badge{font-size:10px;padding:1px 7px;background:var(--accent-bg);border-radius:10px;color:var(--accent2);border:1px solid rgba(82,136,193,.2);}
.dept-card-name{font-size:12px;font-weight:600;color:var(--text);line-height:1.4;}
.dept-card-addr{font-size:11px;color:var(--text2);}
.dept-card-mail{font-size:11px;color:var(--accent2);word-break:break-all;}
.dept-yandex{
  margin-top:5px;font-size:11px;color:var(--accent);
  padding:3px 9px;background:var(--accent-bg);border-radius:10px;
  align-self:flex-start;transition:all .18s;border:1px solid rgba(82,136,193,.15);
  display:inline-block;
}
.dept-yandex:hover{background:rgba(82,136,193,.22);color:var(--text);}

/* ── FSSP ───────────────────────────────────────────── */
.fssp-wrap{display:flex;flex-direction:column;gap:10px;}
.fssp-orgs{display:flex;flex-direction:column;gap:8px;}
.fssp-org{
  background:var(--bg3);border:1px solid var(--border);border-radius:var(--r-sm);
  padding:10px 12px;display:flex;flex-direction:column;gap:3px;
}
.fssp-org-num{font-size:10px;font-weight:700;color:var(--text3);text-transform:uppercase;letter-spacing:.05em;}
.fssp-org-name{font-size:13px;font-weight:600;color:var(--text);}
.fssp-org-addr{font-size:12px;color:var(--text2);}

/* ── FSSP DETAIL ────────────────────────────────────── */
.fssp-detail-item{
  background:var(--bg3);border:1px solid var(--border);border-radius:var(--r-sm);
  padding:14px;display:flex;flex-direction:column;gap:10px;
}
.fssp-detail-item + .fssp-detail-item{margin-top:12px;}
.fssp-detail-item-num{
  font-size:11px;font-weight:700;color:var(--accent2);text-transform:uppercase;
  letter-spacing:.05em;border-bottom:1px solid var(--border);padding-bottom:8px;margin-bottom:4px;
}
.fssp-field-row{display:flex;flex-direction:column;gap:2px;padding:7px 10px;background:var(--card2);border-radius:var(--r-xs);}
.fssp-field-label{font-size:11px;color:var(--text3);font-weight:600;text-transform:uppercase;letter-spacing:.04em;}
.fssp-field-value{font-size:13px;color:var(--text);word-break:break-word;}
.fssp-field-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:1px;background:var(--border);border-radius:var(--r-xs);overflow:hidden;}
.fssp-subjects{margin-top:8px;}
.fssp-subject-title{font-size:12px;font-weight:700;color:var(--text2);margin-bottom:6px;}
.fssp-subject-item{
  display:flex;align-items:center;justify-content:space-between;gap:8px;
  padding:6px 10px;background:var(--bg3);border:1px solid var(--border);border-radius:var(--r-xs);
  font-size:13px;
}
.fssp-subject-sum{font-weight:700;color:var(--green);white-space:nowrap;}
.fssp-detail-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:1px;background:var(--border);border-radius:var(--r-xs);overflow:hidden;margin-bottom:4px;}

/* ── TOTP ───────────────────────────────────────────── */
.totp-wrap{display:flex;flex-direction:column;gap:12px;}
.totp-display{
  background:var(--bg3);border:1px solid var(--border2);border-radius:var(--r-sm);
  padding:16px;display:flex;align-items:center;justify-content:space-between;gap:12px;
}
.totp-code{
  font-size:36px;font-weight:800;letter-spacing:8px;color:var(--accent2);
  font-variant-numeric:tabular-nums;font-family:'Courier New',monospace;
}
.totp-code.totp-expiring{color:var(--red);}
.totp-meta{display:flex;flex-direction:column;align-items:flex-end;gap:6px;}
.totp-timer-wrap{display:flex;align-items:center;gap:8px;}
.totp-timer-label{font-size:12px;color:var(--text3);}
.totp-timer{font-size:18px;font-weight:700;color:var(--text2);font-variant-numeric:tabular-nums;min-width:24px;text-align:right;}
.totp-timer.expiring{color:var(--red);}
.totp-progress-bar{
  height:4px;border-radius:2px;background:var(--border2);overflow:hidden;width:120px;
}
.totp-progress-fill{
  height:100%;background:var(--accent);border-radius:2px;
  transition:width .5s linear, background .3s;
}
.totp-progress-fill.expiring{background:var(--red);}
.totp-period-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.totp-period-label{font-size:12px;color:var(--text2);}
.totp-period-input{
  width:70px;height:28px;padding:0 8px;background:var(--bg3);
  border:1px solid var(--border2);border-radius:var(--r-xs);
  color:var(--text);font-size:13px;outline:none;transition:border-color .2s;
}
.totp-period-input:focus{border-color:var(--accent);}
.totp-secret-row{font-size:12px;color:var(--text3);word-break:break-all;padding:6px 0;}

/* ── GOSLOG DATA GRID ──────────────────────────────── */
.goslog-grid{display:flex;flex-direction:column;gap:8px;}

/* ── YANDEX SEARCH ──────────────────────────────────── */
.yandex-form{display:flex;flex-direction:column;gap:10px;}
.yandex-row{display:flex;gap:10px;align-items:flex-end;}
.yandex-results{display:flex;flex-direction:column;gap:10px;margin-top:12px;padding-top:12px;border-top:1px solid var(--border);}
.yandex-result-card{
  background:var(--bg3);border:1px solid var(--border);border-radius:var(--r-sm);
  padding:12px 14px;display:flex;flex-direction:column;gap:4px;
}
.yandex-result-name{font-size:14px;font-weight:700;color:var(--text);}
.yandex-result-addr{font-size:12px;color:var(--text2);}
.yandex-result-phone{font-size:12px;color:var(--accent2);}
.yandex-result-cats{font-size:11px;color:var(--text3);}
.yandex-result-link{
  margin-top:4px;font-size:11px;color:var(--accent);padding:3px 9px;
  background:var(--accent-bg);border-radius:10px;align-self:flex-start;
  display:inline-block;transition:all .18s;border:1px solid rgba(82,136,193,.15);
}
.yandex-result-link:hover{background:rgba(82,136,193,.22);color:var(--text);}
.yandex-empty{color:var(--text3);font-size:13px;text-align:center;padding:20px 0;}

/* ── EDIT MODAL ─────────────────────────────────────── */
.edit-fields{display:flex;flex-direction:column;gap:10px;}
.edit-field-row{display:flex;flex-direction:column;gap:4px;}
.edit-field-key{font-size:11px;font-weight:700;color:var(--text3);text-transform:uppercase;letter-spacing:.04em;}
.edit-field-input{
  background:var(--bg3);border:1px solid var(--border2);border-radius:var(--r-xs);
  padding:7px 10px;color:var(--text);font-size:13px;font-family:inherit;
  outline:none;transition:border-color .2s;width:100%;
}
.edit-field-input:focus{border-color:var(--accent);}
.edit-field-textarea{
  background:var(--bg3);border:1px solid var(--border2);border-radius:var(--r-xs);
  padding:7px 10px;color:var(--text);font-size:12px;font-family:'Courier New',monospace;
  outline:none;transition:border-color .2s;width:100%;resize:vertical;min-height:70px;
}
.edit-field-textarea:focus{border-color:var(--accent);}

/* ── FIELDS ─────────────────────────────────────────── */
.field-group{display:flex;flex-direction:column;gap:5px;}
.field-label{font-size:12px;color:var(--text2);font-weight:500;}
.field-input{
  background:var(--bg3);border:1px solid var(--border2);border-radius:var(--r-xs);
  padding:8px 11px;color:var(--text);font-size:13px;font-family:inherit;
  outline:none;transition:border-color .2s;width:100%;
}
.field-input:focus{border-color:var(--accent);}
.field-input::placeholder{color:var(--text3);}
textarea.field-input{resize:vertical;min-height:88px;}
.input-row{display:flex;gap:6px;align-items:center;}

/* ── EMAIL FORM ─────────────────────────────────────── */
.email-form{display:flex;flex-direction:column;gap:10px;}
.dropzone{
  border:1.5px dashed var(--border2);border-radius:var(--r-sm);
  padding:22px;text-align:center;cursor:pointer;
  display:flex;flex-direction:column;align-items:center;gap:6px;
  transition:all .2s;background:var(--bg3);
}
.dropzone:hover,.dropzone.over{border-color:var(--accent);background:var(--accent-bg);}
.dropzone-icon{font-size:24px;opacity:.6;}
.dropzone-hint{font-size:12px;color:var(--text3);}
.file-list{display:flex;flex-direction:column;gap:4px;margin-top:4px;}
.file-chip{
  display:flex;align-items:center;gap:7px;padding:5px 10px;
  background:var(--bg3);border:1px solid var(--border);border-radius:var(--r-xs);font-size:12px;
}
.file-chip-name{flex:1;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.file-chip-size{color:var(--text3);flex-shrink:0;}
.file-chip-rm{background:none;border:none;color:var(--text3);font-size:13px;padding:0 2px;transition:color .18s;cursor:pointer;}
.file-chip-rm:hover{color:var(--red);}

/* ── DOC SECTION ────────────────────────────────────── */
.doc-toggle{display:flex;gap:4px;margin-left:auto;}
.doc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(125px,1fr));gap:6px;}
.doc-btn{
  display:flex;flex-direction:column;align-items:center;gap:5px;
  padding:12px 8px;background:var(--bg3);border:1px solid var(--border);
  border-radius:var(--r-sm);color:var(--text2);font-size:12px;
  transition:all .18s;min-height:72px;justify-content:center;
  font-family:inherit;
}
.doc-btn:hover:not(:disabled){border-color:var(--accent);background:var(--accent-bg);color:var(--text);}
.doc-btn:disabled{opacity:.5;cursor:not-allowed;}
.doc-btn.loading{border-color:var(--accent);background:var(--accent-bg);}
.doc-icon{font-size:20px;}
.doc-name{text-align:center;line-height:1.3;font-size:11px;}

/* ── CLIENT LIST PANEL ──────────────────────────────── */
.drum-panel{
  width:262px;flex-shrink:0;background:var(--bg2);
  border-left:1px solid var(--border);
  display:flex;flex-direction:column;
  transition:background .2s;
}
.drum-header{
  display:flex;align-items:center;justify-content:space-between;
  padding:13px 15px;border-bottom:1px solid var(--border);
  flex-shrink:0;background:var(--bg2);z-index:10;
}
.drum-title{font-size:14px;font-weight:700;color:var(--text);}
.drum-count{font-size:12px;padding:1px 9px;background:var(--accent-bg);border-radius:20px;color:var(--accent2);font-weight:600;border:1px solid rgba(82,136,193,.2);}

/* ── SEARCH INPUT ───────────────────────────────────── */
.drum-search{
  padding:10px 12px;border-bottom:1px solid var(--border);
  flex-shrink:0;background:var(--bg2);
}
.drum-search-input{
  width:100%;height:30px;padding:0 10px;
  background:var(--bg3);border:1px solid var(--border2);
  border-radius:var(--r-xs);color:var(--text);font-size:13px;
  outline:none;transition:border-color .2s;font-family:inherit;
}
.drum-search-input:focus{border-color:var(--accent);}
.drum-search-input::placeholder{color:var(--text3);}

/* ── CLIENT LIST ────────────────────────────────────── */
.drum-list{
  flex:1;overflow-y:auto;
}
.drum-loading{
  display:flex;flex-direction:column;align-items:center;
  justify-content:center;gap:10px;color:var(--text3);font-size:13px;
  padding:40px 20px;
}
.drum-item{
  display:flex;align-items:center;gap:10px;padding:10px 14px;
  cursor:pointer;border-bottom:1px solid var(--border);
  transition:background .15s;
}
.drum-item:last-child{border-bottom:none;}
.drum-item:hover{background:rgba(82,136,193,.05);}
.drum-item.active{background:rgba(82,136,193,.1);}
.drum-avatar{
  width:38px;height:38px;border-radius:50%;flex-shrink:0;
  background:var(--card2);display:flex;align-items:center;justify-content:center;
  font-size:13px;font-weight:700;color:var(--text2);
  border:1.5px solid var(--border2);transition:all .2s;
}
.drum-item.active .drum-avatar{
  background:linear-gradient(135deg,#2b5278,#5288c1);color:#fff;
  border-color:var(--accent);box-shadow:0 0 10px rgba(82,136,193,.35);
}
.drum-info{flex:1;min-width:0;}
.drum-name{font-size:13px;font-weight:600;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.3;}
.drum-id{font-size:11px;color:var(--text3);margin-top:1px;}
.drum-dot{width:7px;height:7px;border-radius:50%;background:var(--accent);flex-shrink:0;box-shadow:0 0 6px rgba(82,136,193,.6);}

/* ── BUTTONS ────────────────────────────────────────── */
.btn{
  display:inline-flex;align-items:center;gap:6px;
  border:none;border-radius:var(--r-xs);font-family:inherit;
  font-size:13px;font-weight:600;cursor:pointer;transition:all .18s;
  padding:8px 16px;
}
.btn-primary{background:var(--accent);color:#fff;}
.btn-primary:hover:not(:disabled){background:var(--accent-h);}
.btn-secondary{background:var(--card2);color:var(--text);border:1px solid var(--border2);}
.btn-secondary:hover:not(:disabled){border-color:var(--accent);}
.btn-outline{background:transparent;color:var(--text2);border:1px solid var(--border2);}
.btn-outline:hover:not(:disabled){border-color:var(--accent);color:var(--text);}
.btn-ghost{background:transparent;color:var(--text2);border:none;}
.btn-ghost:hover:not(:disabled){background:rgba(82,136,193,.08);color:var(--text);}
.btn-danger{background:rgba(231,76,60,.15);color:var(--red);border:1px solid rgba(231,76,60,.25);}
.btn-danger:hover:not(:disabled){background:rgba(231,76,60,.25);}
.btn:disabled{opacity:.5;cursor:not-allowed;}
.btn-sm{height:30px;padding:0 12px;font-size:12px;}
.btn-xs{height:24px;padding:0 8px;font-size:11px;}
.btn-full{width:100%;justify-content:center;}

.icon-btn{
  background:var(--card2);border:1px solid var(--border2);border-radius:var(--r-xs);
  padding:7px 10px;color:var(--text2);font-size:15px;transition:all .18s;flex-shrink:0;cursor:pointer;
}
.icon-btn:hover{border-color:var(--accent);color:var(--text);}

/* ── MODAL ──────────────────────────────────────────── */
.modal-overlay{
  position:fixed;inset:0;background:var(--modal-bg);
  backdrop-filter:blur(4px);z-index:500;
  display:flex;align-items:center;justify-content:center;padding:20px;
}
.modal-card{
  background:var(--card);border:1px solid var(--border2);border-radius:var(--r);
  width:100%;max-width:640px;max-height:88vh;display:flex;flex-direction:column;
  box-shadow:var(--shadow);animation:modalIn .2s ease;
}
.modal-card-wide{max-width:800px;}
.modal-header{padding:18px 20px 14px;border-bottom:1px solid var(--border);}
.modal-title{font-size:17px;font-weight:700;color:var(--text);margin:0;}
.modal-sub{font-size:13px;color:var(--text2);margin-top:4px;}
.modal-body{flex:1;overflow-y:auto;padding:16px 20px;display:flex;flex-direction:column;gap:20px;}
.modal-footer{padding:14px 20px;border-top:1px solid var(--border);display:flex;justify-content:flex-end;gap:8px;}
.dept-select-group{display:flex;flex-direction:column;gap:8px;}
.dept-select-label{font-size:13px;font-weight:700;color:var(--accent2);text-transform:uppercase;letter-spacing:.05em;}
.dept-options{display:flex;flex-direction:column;gap:6px;}
.dept-option{
  display:flex;align-items:flex-start;gap:10px;padding:10px 13px;
  background:var(--bg3);border:1.5px solid var(--border);border-radius:var(--r-sm);
  cursor:pointer;transition:all .18s;
}
.dept-option:hover{border-color:var(--border2);background:var(--card2);}
.dept-option.active{border-color:var(--accent)!important;background:var(--accent-bg)!important;}
.dept-opt-radio{font-size:16px;color:var(--accent);margin-top:1px;flex-shrink:0;}
.dept-opt-content{flex:1;min-width:0;}
.dept-opt-name{font-size:13px;font-weight:600;color:var(--text);}
.dept-opt-addr{font-size:12px;color:var(--text2);margin-top:2px;}
.dept-opt-mail{font-size:11px;color:var(--accent2);margin-top:2px;}

/* ── TOASTS ─────────────────────────────────────────── */
.toast-container{
  position:fixed;bottom:20px;right:20px;z-index:2000;
  display:flex;flex-direction:column;gap:8px;pointer-events:none;max-width:360px;
}
.toast{
  display:flex;align-items:center;gap:10px;padding:12px 15px;
  background:var(--card);border:1px solid var(--border2);border-radius:var(--r-sm);
  box-shadow:var(--shadow-sm);pointer-events:all;cursor:pointer;
  animation:toastIn .25s ease;backdrop-filter:blur(10px);
}
.toast-success{border-left:3px solid var(--green);}
.toast-error{border-left:3px solid var(--red);}
.toast-info{border-left:3px solid var(--accent);}
.toast-loading{border-left:3px solid var(--yellow);}
.toast-icon{font-size:15px;flex-shrink:0;width:18px;text-align:center;}
.toast-success .toast-icon{color:var(--green);}
.toast-error .toast-icon{color:var(--red);}
.toast-info .toast-icon{color:var(--accent2);}
.toast-loading .toast-icon{color:var(--yellow);animation:spinIcon 1s linear infinite;display:inline-block;}
.toast-msg{font-size:13px;color:var(--text);line-height:1.4;flex:1;}

/* ── SPINNERS ───────────────────────────────────────── */
.spinner{width:30px;height:30px;border:3px solid var(--border2);border-top-color:var(--accent);border-radius:50%;animation:spin .75s linear infinite;}
.spinner-sm{display:inline-block;width:13px;height:13px;border:2px solid rgba(255,255,255,.25);border-top-color:currentColor;border-radius:50%;animation:spin .75s linear infinite;vertical-align:middle;}

/* ── ANIMATIONS ─────────────────────────────────────── */
@keyframes spin{to{transform:rotate(360deg);}}
@keyframes spinIcon{to{transform:rotate(360deg);}}
@keyframes fadeUp{from{opacity:0;transform:translateY(12px);}to{opacity:1;transform:translateY(0);}}
@keyframes modalIn{from{opacity:0;transform:scale(.96) translateY(8px);}to{opacity:1;transform:scale(1) translateY(0);}}
@keyframes toastIn{from{opacity:0;transform:translateX(20px) scale(.97);}to{opacity:1;transform:translateX(0) scale(1);}}

/* ── UTILS ──────────────────────────────────────────── */
.muted{color:var(--text3);}
.mt4{margin-top:4px;}

/* ── RESPONSIVE ─────────────────────────────────────── */
@media(max-width:768px){
  .main-layout{flex-direction:column-reverse;}
  .drum-panel{
    width:100%;height:220px;border-left:none;
    border-top:1px solid var(--border);
    flex-shrink:0;
  }
  .drum-search{padding:8px 10px;}
  .drum-list{overflow-x:auto;overflow-y:hidden;display:flex;flex-direction:row;}
  .drum-item{
    flex-direction:column;min-width:80px;height:100%;flex-shrink:0;
    justify-content:center;padding:8px 6px;text-align:center;
    border-bottom:none;border-right:1px solid var(--border);
  }
  .drum-item:last-child{border-right:none;}
  .drum-info{min-width:0;width:100%;}
  .drum-name{font-size:11px;}
  .drum-id{font-size:10px;}
  .topbar{gap:5px;}
  .topbar-input{width:105px;}
  .topbar-sep{display:none;}
  .stage-row{grid-template-columns:90px 1fr;}
  .stage-desc{grid-column:1/-1;}
  .data-grid{grid-template-columns:1fr;}
  .dept-cards{grid-template-columns:1fr 1fr;}
  .doc-grid{grid-template-columns:repeat(auto-fill,minmax(110px,1fr));}
  .yandex-row{flex-direction:column;}
  .modal-card-wide{max-width:100%;}
  .totp-code{font-size:26px;letter-spacing:4px;}
}
@media(max-width:480px){
  .gate-card{padding:28px 20px;}
  .workspace{padding:10px;}
  .dept-cards{grid-template-columns:1fr;}
}