/**
 * Quantum Contours — финальный дизайн для всех рабочих контуров.
 * Подключать ПОСЛЕ inline-стилей страницы. Auth DOM/IDs не трогаем.
 * Шрифт: system stack (без блокирующего @import Google Fonts).
 */
body.qx-final .access-gate,
body.qx-final .gate {
  background: rgba(6, 10, 18, 0.82) !important;
  backdrop-filter: blur(16px) saturate(1.2);
}

body.qx-final .gate-card {
  border-radius: 22px !important;
  border: 1px solid rgba(0, 212, 255, 0.22) !important;
  box-shadow: 0 24px 64px rgba(0, 0, 0, 0.45), 0 0 40px rgba(0, 212, 255, 0.06) !important;
}

body.qx-final .gate-card h1,
body.qx-final .gate-card h2 {
  letter-spacing: -0.02em;
}

body.qx-final .gate-card input,
body.qx-final .gate-card textarea,
body.qx-final .field-cell input {
  border-radius: 12px !important;
  font-family: Inter, system-ui, sans-serif !important;
  transition: border-color 0.2s, box-shadow 0.2s;
}

body.qx-final .gate-card input:focus,
body.qx-final .field-cell input:focus {
  border-color: rgba(0, 212, 255, 0.5) !important;
  box-shadow: 0 0 0 3px rgba(0, 212, 255, 0.12) !important;
  outline: none;
}

body.qx-final .gate-infinity-btn,
body.qx-final .gate-btn,
body.qx-final .gate .btn {
  background: linear-gradient(135deg, #00d4ff, #b967ff) !important;
  color: #0a0f1a !important;
  font-weight: 700 !important;
  border: none !important;
  box-shadow: 0 12px 32px rgba(0, 212, 255, 0.25) !important;
}

body.qx-final .gate-infinity-btn:hover,
body.qx-final .gate-btn:hover,
body.qx-final .gate .btn:hover {
  filter: brightness(1.06);
  transform: translateY(-1px);
}

body.qx-final .infinity-ring::before {
  color: #00d4ff !important;
}

/* ─── ADMIN (ключ MAYA_ADMIN_KEY) ─── */
body.qx-final.qx-admin {
  font-family: Inter, "SF Pro Display", system-ui, sans-serif !important;
  background:
    radial-gradient(ellipse 100% 60% at 0% 0%, rgba(0, 212, 255, 0.1), transparent 45%),
    radial-gradient(ellipse 80% 50% at 100% 20%, rgba(185, 103, 255, 0.08), transparent 40%),
    linear-gradient(180deg, #0a0f1a 0%, #111827 100%) !important;
  --bg: #0a0f1a;
  --sidebar: #111827;
  --panel: rgba(17, 24, 39, 0.92);
  --paper: rgba(17, 24, 39, 0.95);
  --ink: #e8edf5;
  --muted: #94a3b8;
  --line: rgba(0, 212, 255, 0.14);
  --accent: #00d4ff;
  --accent2: #b967ff;
  --ok: #34d399;
  --warn: #fbbf24;
  --c-accent: #00d4ff;
  --c-accent-deep: #0891b2;
  --c-bg: #0a0f1a;
  --c-surface: rgba(17, 24, 39, 0.95);
  --c-surface-2: #111827;
  --c-border: rgba(0, 212, 255, 0.16);
  --c-ink: #e8edf5;
  --c-muted: #94a3b8;
}

body.qx-final.qx-admin .topbar {
  background: rgba(17, 24, 39, 0.95) !important;
  border-bottom-color: rgba(0, 212, 255, 0.14) !important;
}

body.qx-final.qx-admin .brand strong,
body.qx-final.qx-admin .brand h1 {
  background: linear-gradient(90deg, #00d4ff, #b967ff);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

body.qx-final.qx-admin .sidebar,
body.qx-final.qx-admin .console-nav {
  background: rgba(17, 24, 39, 0.88) !important;
  border-color: rgba(0, 212, 255, 0.14) !important;
}

body.qx-final.qx-admin .sidebar button.active,
body.qx-final.qx-admin .console-nav button.active,
body.qx-final.qx-admin .nav button.active {
  background: rgba(0, 212, 255, 0.12) !important;
  color: #00d4ff !important;
  border-color: rgba(0, 212, 255, 0.35) !important;
}

body.qx-final.qx-admin .panel,
body.qx-final.qx-admin .cell,
body.qx-final.qx-admin .console-panel,
body.qx-final.qx-admin .card {
  background: rgba(17, 24, 39, 0.85) !important;
  border-color: rgba(0, 212, 255, 0.14) !important;
  border-radius: 14px !important;
}

body.qx-final.qx-admin .btn {
  background: linear-gradient(135deg, rgba(0, 212, 255, 0.85), rgba(185, 103, 255, 0.75)) !important;
  color: #0a0f1a !important;
  border: none !important;
}

body.qx-final.qx-admin .btn.secondary {
  background: rgba(255, 255, 255, 0.06) !important;
  color: #e8edf5 !important;
  border: 1px solid rgba(0, 212, 255, 0.2) !important;
}

body.qx-final.qx-admin .access-gate .gate-card {
  background: linear-gradient(180deg, rgba(17, 24, 39, 0.98), rgba(10, 15, 26, 0.99)) !important;
}

body.qx-final.qx-admin #adminKey {
  background: rgba(0, 0, 0, 0.35) !important;
  border: 1px solid rgba(0, 212, 255, 0.25) !important;
  color: #e8edf5 !important;
}

/* ─── CLIENT (email + пароль) ─── */
body.qx-final.qx-client {
  font-family: Inter, system-ui, sans-serif !important;
  background:
    radial-gradient(circle at 10% 0%, rgba(0, 212, 255, 0.12), transparent 30%),
    radial-gradient(circle at 90% 10%, rgba(185, 103, 255, 0.08), transparent 28%),
    linear-gradient(180deg, #eef2f8 0%, #e4eaf3 50%, #f3f6fa 100%) !important;
  --ink: #0f172a;
  --muted: #64748b;
  --line: rgba(0, 212, 255, 0.15);
  --teal: #0891b2;
  --deep: #0a0f1a;
  --paper: rgba(255, 255, 255, 0.96);
  --accent-soft: rgba(0, 212, 255, 0.1);
}

body.qx-final.qx-client .access-gate {
  background: rgba(238, 242, 248, 0.88) !important;
}

body.qx-final.qx-client .gate-card {
  background: rgba(255, 255, 255, 0.98) !important;
  border-color: rgba(0, 212, 255, 0.2) !important;
}

body.qx-final.qx-client .gate-mark {
  background: linear-gradient(135deg, #00d4ff, #b967ff) !important;
}

body.qx-final.qx-client .gate-switch button.active {
  background: linear-gradient(135deg, #00d4ff, #b967ff) !important;
  color: #0a0f1a !important;
}

body.qx-final.qx-client .topbar {
  background: rgba(255, 255, 255, 0.95) !important;
  border-bottom: 1px solid rgba(0, 212, 255, 0.15) !important;
}

body.qx-final.qx-client .brand h2 {
  color: #0f172a;
}

body.qx-final.qx-client .workspace,
body.qx-final.qx-client .chat-pane {
  border-color: rgba(0, 212, 255, 0.12) !important;
}

body.qx-final.qx-client .msg.user {
  border-color: rgba(0, 212, 255, 0.35) !important;
  background: rgba(0, 212, 255, 0.08) !important;
}

/* ─── RESEARCHER (имя + ключ) ─── */
body.qx-final.qx-researcher {
  font-family: Inter, system-ui, sans-serif !important;
  background:
    radial-gradient(ellipse 80% 50% at 0% 0%, rgba(0, 212, 255, 0.1), transparent 45%),
    linear-gradient(180deg, #0a0f1a 0%, #111827 100%) !important;
  --bg: #0a0f1a;
  --sidebar: #111827;
  --panel: rgba(17, 24, 39, 0.92);
  --ink: #e8edf5;
  --muted: #94a3b8;
  --line: rgba(0, 212, 255, 0.14);
  --accent: #00d4ff;
  --accent-dim: #0891b2;
  --tg-out: rgba(0, 212, 255, 0.18);
  --tg-in: rgba(17, 24, 39, 0.95);
}

body.qx-final.qx-researcher .topbar {
  background: rgba(17, 24, 39, 0.95) !important;
  border-bottom-color: rgba(0, 212, 255, 0.14) !important;
}

body.qx-final.qx-researcher .nav button.active,
body.qx-final.qx-researcher .bottom-nav button.active,
body.qx-final.qx-researcher .messenger-tabs button.active {
  color: #00d4ff !important;
  background: rgba(0, 212, 255, 0.12) !important;
  border-color: rgba(0, 212, 255, 0.35) !important;
}

body.qx-final.qx-researcher .btn {
  background: linear-gradient(135deg, #00d4ff, #0891b2) !important;
  color: #0a0f1a !important;
}

body.qx-final.qx-researcher .tg-icon.send {
  background: #00d4ff !important;
  color: #0a0f1a !important;
}

body.qx-final.qx-researcher .gate .gate-card {
  background: rgba(17, 24, 39, 0.98) !important;
}

body.qx-final.qx-researcher .gate input {
  background: rgba(0, 0, 0, 0.3) !important;
  border-color: rgba(0, 212, 255, 0.2) !important;
  color: #e8edf5 !important;
  margin-top: 6px;
}

/* ─── OPERATOR DASHBOARD (/dashboard) ─── */
body.qx-final.qx-operator {
  font-family: Inter, system-ui, sans-serif !important;
  background:
    radial-gradient(circle at top left, rgba(0, 212, 255, 0.12), transparent 28%),
    radial-gradient(circle at top right, rgba(185, 103, 255, 0.08), transparent 25%),
    linear-gradient(135deg, #eef2f8 0%, #e4eaf3 42%, #f3f6fa 100%) !important;
}

body.qx-final.qx-operator .hero-main,
body.qx-final.qx-operator .hero-side,
body.qx-final.qx-operator .panel,
body.qx-final.qx-operator .stripe {
  border: 1px solid rgba(0, 212, 255, 0.12) !important;
  box-shadow: 0 12px 40px rgba(15, 23, 42, 0.08) !important;
}

body.qx-final.qx-operator .hero-main h1,
body.qx-final.qx-operator .stripe h2 {
  color: #0f172a;
}

body.qx-final.qx-operator .pill,
body.qx-final.qx-operator .tag {
  background: rgba(0, 212, 255, 0.12) !important;
  color: #0891b2 !important;
  border-color: rgba(0, 212, 255, 0.25) !important;
}

body.qx-final.qx-operator .cta,
body.qx-final.qx-operator button.primary {
  background: linear-gradient(135deg, #00d4ff, #b967ff) !important;
  color: #0a0f1a !important;
  border: none !important;
}

/* ─── Scrollbars (dark contours) ─── */
body.qx-final.qx-admin ::-webkit-scrollbar,
body.qx-final.qx-researcher ::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
body.qx-final.qx-admin ::-webkit-scrollbar-thumb,
body.qx-final.qx-researcher ::-webkit-scrollbar-thumb {
  background: rgba(0, 212, 255, 0.25);
  border-radius: 4px;
}

/* ─── Focus visible (a11y) ─── */
body.qx-final button:focus-visible,
body.qx-final input:focus-visible {
  outline: 2px solid rgba(0, 212, 255, 0.6);
  outline-offset: 2px;
}

/* ─── PUBLIC SITE (/site) ─── */
body.qx-final.qx-public {
  font-family: Inter, system-ui, sans-serif !important;
}

body.qx-final.qx-public .nav a.active,
body.qx-final.qx-public .nav button.active {
  color: #00d4ff !important;
}

body.qx-final.qx-public .btn-primary,
body.qx-final.qx-public .cta-primary,
body.qx-final.qx-public a.button-primary {
  background: linear-gradient(135deg, #00d4ff, #b967ff) !important;
  color: #0a0f1a !important;
  border: none !important;
}

body.qx-final.qx-public .hero-card,
body.qx-final.qx-public .service-card,
body.qx-final.qx-public .panel-card {
  border-color: rgba(0, 212, 255, 0.16) !important;
}

body.qx-final.qx-public .mark,
body.qx-final.qx-public .kubit-brand-mark {
  box-shadow: 0 0 24px rgba(0, 212, 255, 0.15);
}