*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { zoom: 1.2; overflow: hidden; height: 100%; }
body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; background: #0f1117; color: #e2e8f0; font-size: 13px; overflow: hidden; height: 100%; }

/* ── App shell ────────────────────────────────────────── */
.app { display: flex; height: calc(100vh / 1.2); overflow: hidden; }
.main { flex: 1; display: flex; flex-direction: column; overflow: hidden; }

/* ── Screen-tabs bar (navigation strip at top) ────────── */
.screen-tabs { background: #161b27; border-bottom: 1px solid #2d3748; padding: 0 20px; display: flex; align-items: stretch; flex-shrink: 0; overflow-x: auto; }
.screen-tab { padding: 12px 18px; color: #4a5568; text-decoration: none; font-size: 13px; border-bottom: 2px solid transparent; white-space: nowrap; display: flex; align-items: center; gap: 4px; transition: color 0.15s; }
.screen-tab:hover { color: #a0aec0; }
.screen-tab.active { color: #7eb8f7; border-bottom-color: #7eb8f7; }
.tab-badge { background: #1a2744; color: #7eb8f7; border-radius: 10px; padding: 0 6px; font-size: 10px; font-weight: 700; }
.tab-badge-returned { background: #1a0f0f; color: #fc8181; }

/* ── Per-screen topbar (title + actions) ──────────────── */
.topbar { background: #161b27; border-bottom: 1px solid #2d3748; padding: 14px 54px 14px 24px; display: flex; align-items: center; justify-content: space-between; flex-shrink: 0; gap: 12px; }
.topbar-left { flex: 1; min-width: 0; }
.topbar-title { font-size: 16px; font-weight: 600; color: #e2e8f0; }
.topbar-meta { font-size: 12px; color: #4a5568; margin-top: 3px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.topbar-actions { display: flex; gap: 8px; align-items: center; flex-shrink: 0; flex-wrap: wrap; }

/* ── Scrollable page content ──────────────────────────── */
.content { flex: 1; overflow-y: auto; padding: 20px; }

/* ── Search in topbar ─────────────────────────────────── */
.search-input { background: #0f1117; border: 1px solid #2d3748; border-radius: 6px; padding: 6px 12px; color: #e2e8f0; font-size: 12px; width: 220px; outline: none; }
.search-input::placeholder { color: #4a5568; }
.search-input:focus { border-color: #4a6fa5; }

/* ── Buttons ─────────────────────────────────────────── */
.btn { padding: 6px 14px; border-radius: 6px; border: none; cursor: pointer; font-size: 12px; font-weight: 500; }
.btn-primary { background: #2b5282; color: #bee3f8; }
.btn-primary:hover { background: #2c5282; }
.btn-sm { padding: 4px 10px; border-radius: 5px; background: #1e2533; color: #718096; border: 1px solid #2d3748; cursor: pointer; font-size: 11px; text-decoration: none; display: inline-block; }
.btn-sm:hover { background: #253048; color: #a0aec0; }
.btn-icon { background: none; border: none; cursor: pointer; font-size: 14px; padding: 4px 6px; border-radius: 4px; opacity: 0.6; }
.btn-icon:hover { background: #1e2533; opacity: 1; }

/* ── Search bar (standalone, below topbar) ────────────── */
.search-bar { margin-bottom: 14px; }
.search-bar input, .search-bar-input { padding: 6px 12px; border-radius: 6px; background: #0f1117; border: 1px solid #2d3748; color: #e2e8f0; font-size: 12px; outline: none; width: 280px; }
.search-bar input:focus, .search-bar-input:focus { border-color: #4a6fa5; }

/* ── Project grid ────────────────────────────────────── */
.project-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 12px; }
.project-card { background: #161b27; border: 1px solid #2d3748; border-radius: 10px; padding: 16px; cursor: pointer; transition: border-color 0.15s; position: relative; }
.project-card:hover { border-color: #4a6fa5; }
.card-tags { position: absolute; top: 10px; right: 10px; display: flex; gap: 4px; flex-wrap: wrap; justify-content: flex-end; max-width: 60%; }
.card-tag { font-size: 9px; font-weight: 700; padding: 2px 7px; border-radius: 4px; text-transform: uppercase; letter-spacing: 0.5px; }
.card-top { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; padding-right: 44px; }
.project-icon { width: 38px; height: 38px; border-radius: 8px; background: #1e2533; border: 1px solid #2d3748; display: flex; align-items: center; justify-content: center; font-size: 20px; flex-shrink: 0; cursor: pointer; position: relative; overflow: hidden; font-weight: 700; color: #7eb8f7; }
.project-icon-overlay { position: absolute; inset: 0; background: rgba(0,0,0,0.65); display: flex; align-items: center; justify-content: center; font-size: 12px; color: #a0aec0; opacity: 0; transition: opacity 0.15s; }
.project-icon:hover .project-icon-overlay { opacity: 1; }
.project-card-name { font-size: 13px; font-weight: 600; color: #e2e8f0; margin-bottom: 2px; }
.project-card-meta { font-size: 11px; color: #4a5568; }
.project-card-stats { display: flex; gap: 14px; margin-bottom: 12px; }
.stat { font-size: 11px; color: #718096; }
.stat strong { display: block; font-size: 15px; color: #a0aec0; font-weight: 600; }
.stat.pending strong { color: #9ae6b4; }
.stat.pending { color: #68d391; }
.card-actions { display: flex; gap: 6px; border-top: 1px solid #1e2533; padding-top: 10px; }
.icon-btn { background: transparent; border: 1px solid #2d3748; border-radius: 5px; padding: 4px 9px; color: #718096; font-size: 11px; cursor: pointer; transition: all 0.15s; }
.icon-btn:hover { background: #1e2533; color: #a0aec0; }
.icon-btn.del:hover { border-color: #742a2a; color: #fc8181; background: #1a0f0f; }
.open-btn { margin-left: auto; background: transparent; border: 1px solid #2d3748; border-radius: 5px; padding: 4px 12px; color: #7eb8f7; font-size: 11px; cursor: pointer; transition: background 0.15s; text-decoration: none; display: flex; align-items: center; }
.open-btn:hover { background: #1a2744; }
.badge { padding: 2px 7px; border-radius: 10px; font-size: 10px; font-weight: 600; }
.badge.green { background: #0d1a12; color: #68d391; }
.badge.red   { background: #1a0f0f; color: #fc8181; }
.badge-review { background: #0d1a12; color: #68d391; }
.empty-state { color: #4a5568; text-align: center; padding: 64px 0; grid-column: 1 / -1; font-size: 13px; }
.empty-state-block { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 80px 20px; text-align: center; }
.empty-icon { font-size: 48px; margin-bottom: 16px; opacity: 0.5; }
.empty-title { font-size: 18px; font-weight: 600; color: #a0aec0; margin-bottom: 8px; }
.empty-sub { font-size: 13px; color: #4a5568; max-width: 360px; line-height: 1.6; }

/* ── Unit accordion ──────────────────────────────────── */
.unit-block { border: 1px solid #2d3748; border-radius: 10px; margin-bottom: 8px; overflow: hidden; position: relative; background: #161b27; }
.unit-header { width: 100%; background: #161b27; border: none; color: #e2e8f0; padding: 12px 16px; cursor: pointer; display: flex; align-items: center; gap: 10px; font-size: 13px; text-align: left; }
.unit-header:hover { background: #1e2533; }
.unit-toggle-icon { font-size: 10px; transition: transform 0.2s; color: #4a5568; }
.unit-toggle-icon.open { transform: rotate(90deg); }
.unit-name { font-weight: 600; min-width: 180px; color: #7eb8f7; font-family: monospace; }
.unit-prompt { color: #4a5568; font-size: 11px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 480px; }
.unit-del { position: absolute; top: 12px; right: 14px; cursor: pointer; opacity: 0.35; font-size: 14px; line-height: 1; z-index: 2; }
.unit-del:hover { opacity: 1; }
.unit-entities { padding: 0 12px 8px; }

/* ── Entity rows ─────────────────────────────────────── */
.entity-row { border-bottom: 1px solid #1e2533; padding: 8px 4px; }
.entity-row:last-child { border-bottom: none; }
.entity-header { display: flex; align-items: center; gap: 10px; }
.entity-name { font-weight: 500; min-width: 160px; font-size: 12px; font-family: monospace; color: #e2e8f0; }
.entity-hint { display: inline-flex; align-items: center; justify-content: center; padding: 2px 6px; border-radius: 4px; background: #1e2533; color: #4a5568; font-size: 10px; cursor: help; }
.entity-counts { color: #4a5568; font-size: 11px; margin-left: auto; }

/* ── Pattern panel ───────────────────────────────────── */
.pattern-panel { margin-top: 8px; background: #0d1117; border-radius: 8px; border: 1px solid #1e2533; overflow: hidden; }
.panel-toolbar { display: flex; align-items: center; gap: 8px; padding: 8px 12px; border-bottom: 1px solid #1e2533; flex-wrap: wrap; }
.lang-tabs { display: flex; gap: 4px; margin-right: auto; }
.lang-tab { padding: 3px 10px; border-radius: 5px; border: 1px solid #2d3748; background: transparent; color: #718096; font-size: 11px; cursor: pointer; }
.lang-tab.active { background: #1a2744; color: #7eb8f7; border-color: #2b5282; }
.lang-tab.active-ru { background: #1a2744; color: #7eb8f7; border-color: #2b5282; }
.lang-tab.active-kz { background: #1a3a2f; color: #6fcf97; border-color: #276749; }
.panel-actions { display: flex; gap: 6px; flex-wrap: wrap; }
.pattern-list { padding: 6px 8px; }
.pattern-row { display: flex; align-items: center; gap: 8px; padding: 4px 0; }
.pattern-num { width: 24px; text-align: right; color: #4a5568; font-size: 10px; font-family: monospace; flex-shrink: 0; }
.pattern-code { flex: 1; background: #161b27; border: 1px solid #1e2533; border-radius: 5px; color: #c9d1d9; font-family: monospace; font-size: 11px; padding: 4px 8px; outline: none; }
.pattern-code:focus { border-color: #4a6fa5; }
.add-pattern-btn { margin: 6px 8px; }

/* ── Modals ──────────────────────────────────────────── */
.modal-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.65); display: flex; align-items: center; justify-content: center; z-index: 1000; }
.assign-user-list { display: flex; flex-direction: column; gap: 4px; max-height: 320px; overflow-y: auto; }
.assign-user-row { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 8px; cursor: pointer; border: 1px solid transparent; }
.assign-user-row:hover { background: #1e2533; border-color: #2d3748; }
.modal-box { background: #1a1f2e; border: 1px solid #2d3748; border-radius: 12px; padding: 24px; width: 480px; max-width: 95vw; }
.modal-box--danger { border-color: #742a2a; }
.modal-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; }
.modal-header h2 { font-size: 14px; font-weight: 700; color: #e2e8f0; }
.modal-warning { color: #718096; font-size: 12px; margin-bottom: 14px; line-height: 1.7; }
.modal-warning code { background: #1e2533; padding: 2px 6px; border-radius: 4px; color: #fc8181; }
.modal-footer { display: flex; justify-content: flex-end; gap: 8px; margin-top: 16px; }
.form-group { margin-bottom: 14px; }
.form-group label { display: block; font-size: 11px; color: #718096; margin-bottom: 5px; text-transform: uppercase; letter-spacing: 0.4px; font-weight: 600; }
.form-input { width: 100%; padding: 7px 12px; border-radius: 7px; background: #0f1117; border: 1px solid #2d3748; color: #e2e8f0; font-size: 12px; outline: none; }
.form-input:focus { border-color: #4a6fa5; }
.btn-danger { background: #742a2a; color: #fc8181; border: none; padding: 6px 14px; border-radius: 6px; cursor: pointer; font-size: 12px; font-weight: 500; }
.btn-danger:hover:not(:disabled) { background: #7f1d1d; }
.btn-danger:disabled { opacity: 0.35; cursor: not-allowed; }
.dropzone { border: 2px dashed #2d3748; border-radius: 8px; padding: 28px 20px; text-align: center; transition: border-color 0.15s, background 0.15s; cursor: pointer; }
.dropzone.over, .dropzone:hover { border-color: #4a6fa5; background: #0d1220; }
.dropzone.has-file { border-color: #276749; color: #68d391; background: #0d1a12; }
.dz-text { color: #4a5568; font-size: 12px; margin-bottom: 8px; line-height: 2; }
.dz-btn { cursor: pointer; }
.dz-filename { margin-top: 8px; font-size: 12px; color: #7eb8f7; }
.btn-warn { background: #5a3e10; color: #f6ad55; border: none; }
.btn-warn:hover { background: #6b4a14; }
.clear-confirm { display: flex; align-items: center; gap: 6px; }

/* ── Clusters ────────────────────────────────────────── */
.cluster-filters { display: flex; gap: 8px; margin-bottom: 16px; flex-wrap: wrap; }
.filter-select { padding: 6px 10px; border-radius: 6px; background: #0f1117; border: 1px solid #2d3748; color: #a0aec0; font-size: 12px; outline: none; cursor: pointer; }
.report-dropdown { position: relative; }
.report-dropdown-btn { display: flex; align-items: center; max-width: 320px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.report-dropdown-menu { position: absolute; top: calc(100% + 4px); right: 0; min-width: 100%; max-width: 480px; background: #1a2035; border: 1px solid #2d3748; border-radius: 8px; z-index: 200; overflow: hidden; box-shadow: 0 8px 24px rgba(0,0,0,.4); }
.report-dropdown-item { display: flex; align-items: center; gap: 8px; padding: 8px 12px; cursor: pointer; font-size: 12px; color: #a0aec0; }
.report-dropdown-item:hover { background: #1e2533; }
.report-dropdown-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.report-delete-btn { flex-shrink: 0; background: none; border: none; cursor: pointer; font-size: 14px; color: #4a5568; padding: 2px 4px; line-height: 1; border-radius: 4px; }
.report-delete-btn:hover { color: #fc8181; background: rgba(252,129,129,.1); }

/* ── Admin ────────────────────────────────────────── */
.admin-layout { display: flex; flex-direction: column; height: 100%; }
.admin-tabs { display: flex; gap: 4px; padding: 12px 20px 0; border-bottom: 1px solid #2d3748; flex-shrink: 0; }
.admin-tab { background: none; border: none; border-bottom: 2px solid transparent; color: #4a5568; cursor: pointer; font-size: 13px; padding: 8px 14px; margin-bottom: -1px; border-radius: 6px 6px 0 0; transition: color .15s; }
.admin-tab:hover { color: #a0aec0; background: #1e2533; }
.admin-tab.active { color: #7eb8f7; border-bottom-color: #7eb8f7; background: none; }
.admin-content { flex: 1; overflow-y: auto; padding: 20px; }
.admin-section { margin-bottom: 24px; }
.admin-section-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.admin-section-title { font-size: 12px; font-weight: 600; color: #718096; text-transform: uppercase; letter-spacing: 0.5px; }
.admin-kpi-row { display: flex; gap: 16px; margin-bottom: 4px; }
.admin-kpi { background: #161b27; border: 1px solid #2d3748; border-radius: 10px; padding: 14px 20px; min-width: 140px; }
.admin-kpi-val { font-size: 22px; font-weight: 700; color: #e2e8f0; }
.admin-kpi-label { font-size: 11px; color: #4a5568; margin-top: 4px; }
.admin-table { width: 100%; border-collapse: collapse; font-size: 12px; }
.admin-table th { text-align: left; padding: 8px 12px; color: #4a5568; font-weight: 600; font-size: 11px; text-transform: uppercase; letter-spacing: 0.4px; border-bottom: 1px solid #2d3748; }
.admin-table td { padding: 8px 12px; border-bottom: 1px solid #1e2533; }
.admin-table tr:hover td { background: #161b27; }
.admin-table tr.fb-new td,
.admin-table tr.fb-new:hover td { background: #0c1f10 !important; }
.admin-table-sm td, .admin-table-sm th { padding: 5px 10px; }
.admin-muted { color: #4a5568; }
.admin-alert { padding: 10px 14px; border-radius: 8px; font-size: 12px; margin-bottom: 12px; }
.admin-alert-success { background: #1a3a2a; color: #68d391; border: 1px solid #276749; }
.admin-alert-error { background: #2d1515; color: #fc8181; border: 1px solid #742a2a; }
.admin-create-form { background: #161b27; border: 1px solid #2d3748; border-radius: 10px; padding: 14px; margin-bottom: 14px; }
.admin-form-row { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.role-select { padding: 4px 8px; border-radius: 6px; background: #0f1117; border: 1px solid #2d3748; color: #a0aec0; font-size: 11px; cursor: pointer; }
.role-select.role-admin { color: #fc8181; border-color: #742a2a; }
.role-select.role-moderator { color: #7eb8f7; border-color: #1a2744; }
.role-select.role-user { color: #a0aec0; }
.btn-danger { color: #fc8181 !important; border-color: #742a2a !important; }
.btn-danger:hover { background: #2d1515 !important; }
.admin-settings-section { background: #161b27; border: 1px solid #2d3748; border-radius: 10px; padding: 16px; margin-bottom: 14px; }
.admin-setting-row { display: flex; align-items: center; gap: 12px; padding: 8px 0; border-bottom: 1px solid #1e2533; }
.admin-setting-row:last-child { border-bottom: none; }
.admin-setting-label { flex: 1; font-size: 12px; color: #a0aec0; }
.admin-setting-control { flex-shrink: 0; min-width: 200px; }
.toggle-label { display: flex; align-items: center; cursor: pointer; }
.toggle-label input { display: none; }
.toggle-slider { width: 36px; height: 20px; background: #2d3748; border-radius: 10px; position: relative; transition: background .2s; }
.toggle-slider::after { content: ''; position: absolute; width: 14px; height: 14px; background: #fff; border-radius: 50%; top: 3px; left: 3px; transition: left .2s; }
.toggle-label input:checked + .toggle-slider { background: #3b82f6; }
.toggle-label input:checked + .toggle-slider::after { left: 19px; }
.cluster-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 12px; }
.my-tasks-project-header { display: flex; align-items: center; gap: 10px; margin: 20px 0 10px; }
.my-tasks-project-header:first-of-type { margin-top: 0; }
.my-tasks-project-name { font-size: 12px; font-family: monospace; color: #7eb8f7; font-weight: 700; }
.cluster-card { background: #161b27; border: 1px solid #2d3748; border-radius: 10px; padding: 14px 16px; transition: border-color 0.15s; }
.cluster-card:hover { border-color: #4a6fa5; }
.cluster-card-top { display: flex; flex-direction: column; gap: 4px; margin-bottom: 8px; }
.cluster-label { font-weight: 600; font-size: 13px; color: #e2e8f0; }
.cluster-breadcrumb { font-size: 11px; color: #4a5568; font-family: monospace; }
.cluster-chips { display: flex; gap: 5px; align-items: flex-start; flex-wrap: wrap; flex-shrink: 0; justify-content: flex-end; max-width: 260px; }
.cluster-freq { font-size: 11px; color: #a0aec0; background: #2d3748; padding: 2px 8px; border-radius: 10px; white-space: nowrap; }
.chip-pct { background: #1a1208; color: #f6ad55; }
.chip-review { background: #0a1f12; color: #48bb78; border-color: #1e4a2f; font-weight: 600; }
.chip-error { background: #1a0f0f; color: #fc8181; border-color: #7b341e; font-weight: 600; }
.chip-offtopic { background: #16161f; color: #8b8ba0; border-color: #34344a; font-weight: 600; }
.status-error { background: #1a0f0f; color: #fc8181; }
.cluster-meta { display: flex; gap: 5px; align-items: center; flex-wrap: wrap; margin-bottom: 8px; }
.cluster-unit { font-size: 11px; color: #4a5568; font-family: monospace; }
.cluster-context { background: #0f1520; border-left: 2px solid #2d4a6e; border-radius: 0 5px 5px 0; padding: 6px 10px; margin-bottom: 8px; font-size: 11px; line-height: 1.5; }
.cluster-context-label { color: #4a6fa5; font-weight: 600; margin-right: 6px; }
.cluster-context-text { color: #718096; white-space: pre-line; }
.chip { padding: 2px 7px; background: #1e2533; border-radius: 4px; font-size: 10px; color: #718096; }
.chip-q { background: #1a1208; color: #f6ad55; }
.cluster-executor { font-size: 11px; color: #f6ad55; margin-bottom: 8px; }
.cluster-comments { margin-bottom: 8px; }
.cluster-comments-summary { font-size: 11px; color: #fc8181; cursor: pointer; user-select: none; padding: 3px 0; }
.cluster-comments-summary:hover { color: #feb2b2; }
.cluster-comment-item { background: #1a0f0f; border-left: 2px solid #7b341e; border-radius: 0 4px 4px 0; padding: 6px 8px; margin-top: 5px; }
.cluster-comment-meta { font-size: 10px; color: #fc8181; margin-bottom: 3px; }
.cluster-comment-text { font-size: 12px; color: #e2e8f0; line-height: 1.4; }
.cluster-comment-regex { font-family: monospace; font-size: 10px; color: #a0aec0; margin-top: 4px; background: #0f1117; padding: 2px 5px; border-radius: 3px; word-break: break-all; }
.cluster-actions { display: flex; align-items: flex-end; justify-content: space-between; gap: 8px; margin-top: 4px; }
.cluster-actions-left { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; flex: 1; }
.btn-propose { background: #1a2744; color: #7eb8f7; border-color: #2b4a7a; }
.btn-propose:hover { background: #233560; color: #bee3f8; }
.cluster-actions-left .btn-sm { padding: 3px 8px; font-size: 10px; }
.phrase-more { color: #4a5568; background: #1a1f2e; border: 1px dashed #2d3748; }
.btn-call-log { padding: 3px 8px; border-radius: 4px; background: #0f1117; color: #4a9070; border: 1px solid #1e3a2f; cursor: pointer; font-size: 10px; font-family: monospace; letter-spacing: 0.03em; font-weight: 600; }
.btn-call-log:hover { background: #0d1a14; color: #68d391; border-color: #276749; }
.status-wrap { position: relative; }
.status-btn { padding: 4px 10px; border-radius: 6px; border: 1px solid #2d3748; background: transparent; color: #718096; font-size: 11px; font-weight: 500; cursor: pointer; white-space: nowrap; }
.status-btn.status-waiting { color: #718096; border-color: #2d3748; }
.status-btn.status-working { color: #f6ad55; border-color: #5a3e10; background: #1a1208; }
.status-btn.status-assigned { color: #7eb8f7; border-color: #1a3a6a; background: #0d1525; }
.status-btn.status-irrelevant { color: #fc8181; border-color: #742a2a; background: #1a0f0f; }
.status-menu { position: absolute; top: 100%; left: 0; margin-top: 4px; background: #1a1f2e; border: 1px solid #2d3748; border-radius: 8px; overflow: hidden; z-index: 50; min-width: 200px; padding: 4px; }
.status-menu-item { padding: 7px 10px; font-size: 12px; cursor: pointer; border-radius: 5px; color: #a0aec0; }
.status-menu-item:hover { background: #1e2533; color: #e2e8f0; }
.btn-edit-proposal { background: #1a1208; color: #f6ad55; border: 1px solid #5a3e10; padding: 4px 10px; border-radius: 6px; cursor: pointer; font-size: 11px; font-weight: 500; }
.phrase-list { padding-left: 24px; max-height: 50vh; overflow-y: auto; }
.phrase-list li { padding: 4px 0; font-size: 12px; color: #e2e8f0; border-bottom: 1px solid #1e2533; }
.phrase-context { margin-top: 4px; }
.phrase-context summary { cursor: pointer; font-size: 11px; color: #4a5568; }
.phrase-context-body { font-family: monospace; font-size: 11px; color: #718096; background: #0d1117; padding: 6px 8px; border-radius: 4px; margin-top: 4px; max-height: 120px; overflow-y: auto; white-space: pre-wrap; }

/* ── Login ───────────────────────────────────────────── */
.login-wrap { min-height: 100vh; display: flex; align-items: center; justify-content: center; }
.login-box { background: #161b27; border: 1px solid #2d3748; border-radius: 12px; padding: 28px; width: 340px; }
.login-title { text-align: center; color: #7eb8f7; margin-bottom: 20px; font-size: 16px; font-weight: 700; }
.login-error { background: #1a0f0f; color: #fc8181; border: 1px solid #742a2a; padding: 8px 12px; border-radius: 6px; font-size: 12px; margin-bottom: 14px; text-align: center; }

/* ── Propose modal ───────────────────────────────────── */
.propose-context { background: #0f1117; border: 1px solid #1e2533; border-radius: 8px; padding: 10px 12px; margin-bottom: 14px; }
.propose-unit { font-weight: 600; font-size: 12px; color: #7eb8f7; font-family: monospace; }
.propose-prompt { color: #4a5568; font-size: 11px; margin-top: 2px; }
.form-row { display: flex; gap: 12px; }
.regex-status { font-size: 11px; margin-top: 4px; min-height: 16px; }
.propose-existing { margin: 10px 0; }
.propose-existing summary { cursor: pointer; font-size: 12px; color: #718096; }

/* ── Review queue ────────────────────────────────────── */
.queue-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 12px; }
.queue-card { background: #161b27; border: 1px solid #2d3748; border-radius: 10px; padding: 14px; }
.queue-card-head { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
.queue-entity { font-weight: 600; font-size: 12px; font-family: monospace; color: #7eb8f7; }
.queue-urgency { margin-left: auto; padding: 2px 7px; border-radius: 4px; font-size: 10px; font-weight: 600; }
.queue-urgency.day1 { background: #1a1208; color: #f6ad55; }
.queue-urgency.day3 { background: #1a1208; color: #f6ad55; }
.queue-urgency.day5 { background: #1a0f0f; color: #fc8181; }
.queue-meta { font-size: 11px; color: #4a5568; margin: 6px 0; }
.queue-actions { display: flex; gap: 6px; justify-content: flex-end; align-items: center; }
.bulk-bar { display: flex; align-items: center; gap: 10px; background: #0d1525; border: 1px solid #1a3a6a; border-radius: 8px; padding: 8px 16px; margin-bottom: 14px; }
.bulk-bar #bulk-count { margin-right: auto; font-size: 12px; color: #7eb8f7; }
.details-cols { display: flex; gap: 16px; overflow: hidden; flex: 1; }
.details-left { flex: 1; display: flex; flex-direction: column; gap: 4px; overflow-y: auto; }
.details-right { flex: 1; overflow-y: auto; }
.details-label { font-size: 10px; color: #4a5568; margin-top: 10px; text-transform: uppercase; letter-spacing: 1px; font-weight: 700; }
.details-existing { background: #0f1117; border: 1px solid #1e2533; border-radius: 6px; padding: 6px; }
.pattern-code-line { font-family: monospace; font-size: 11px; color: #c9d1d9; padding: 2px 0; }
.details-meta { font-size: 11px; color: #4a5568; margin-top: 10px; }
.muted { color: #4a5568; font-size: 12px; }
.btn-approve { background: #276749; color: #9ae6b4; padding: 5px 12px; border-radius: 6px; font-size: 11px; font-weight: 600; cursor: pointer; border: none; white-space: nowrap; }
.btn-approve:hover { background: #2f7d55; }
.btn-return-item { background: #742a2a; color: #fc8181; padding: 5px 12px; border-radius: 6px; font-size: 11px; font-weight: 600; cursor: pointer; border: none; white-space: nowrap; }
.btn-return-item:hover { background: #7f1d1d; }

/* ── Nav badges + completed ──────────────────────────── */
.nav-badge { background: #1a2744; color: #7eb8f7; border-radius: 10px; padding: 0 6px; font-size: 10px; font-weight: 700; }
.nav-badge-returned { background: #1a0f0f; color: #fc8181; border-radius: 10px; padding: 0 6px; font-size: 10px; font-weight: 700; }
.badge-success { background: #0d1a12; color: #68d391; }
.badge-returned { background: #1a0f0f; color: #fc8181; }
.completed-section { margin-bottom: 20px; }
.completed-section summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 8px; padding: 6px 0 10px; }
.completed-section summary::-webkit-details-marker { display: none; }
.completed-section-title { font-size: 12px; font-weight: 600; color: #4a5568; text-transform: uppercase; letter-spacing: 0.5px; display: flex; align-items: center; gap: 8px; }
.completed-section[open] summary .completed-section-title::before { content: '▼'; font-size: 9px; }
.completed-section:not([open]) summary .completed-section-title::before { content: '▶'; font-size: 9px; }
.completed-section-count { background: #1e2533; color: #718096; border-radius: 10px; padding: 1px 7px; font-size: 11px; font-weight: 600; }
.completed-list { display: flex; flex-direction: column; gap: 8px; margin-top: 2px; }
.completed-row { background: #161b27; border: 1px solid #2d3748; border-radius: 10px; padding: 10px 14px; display: flex; align-items: center; gap: 12px; }
.completed-row-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.completed-row-meta { display: flex; align-items: center; gap: 8px; min-width: 0; flex-wrap: wrap; }
.completed-unit { font-size: 11px; color: #4a5568; font-family: monospace; }
.completed-report-label { font-size: 11px; color: #4a5568; max-width: 220px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.completed-executor { font-size: 11px; color: #4a5568; }
.completed-restore-btn { flex-shrink: 0; color: #7eb8f7 !important; border-color: #1a2744 !important; }
.completed-restore-btn:hover { background: #1a2744 !important; color: #bee3f8 !important; }
.completed-row.status-rejected { border-color: #742a2a; }
.completed-row.status-irrelevant { border-color: #2d3748; opacity: 0.8; }
.completed-row.status-done { border-color: #1a3a2a; }
.completed-entity { font-weight: 600; font-size: 13px; font-family: monospace; color: #7eb8f7; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.completed-regex { font-family: monospace; font-size: 11px; color: #c9d1d9; background: #0f1117; padding: 4px 8px; border-radius: 4px; }
.completed-status { margin-left: auto; }
.completed-comment { flex-basis: 100%; font-size: 12px; color: #fc8181; margin-top: 4px; }

/* ── Status checks ───────────────────────────────────── */
.sc-hint { color: #4a5568; font-size: 12px; margin-bottom: 14px; max-width: 720px; }
.sc-grid { display: flex; flex-direction: column; gap: 10px; }
.sc-card { background: #161b27; border: 1px solid #742a2a; border-radius: 10px; padding: 14px 16px; }
.sc-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 6px; }
.sc-current { color: #fc8181; font-size: 13px; }
.sc-arrow { color: #4a5568; }
.sc-suggested { color: #68d391; font-size: 13px; }
.sc-units { display: flex; gap: 5px; flex-wrap: wrap; margin-bottom: 6px; }
.sc-snippet { font-size: 12px; color: #718096; line-height: 1.5; }
.sc-allowed { font-size: 12px; color: #718096; margin-bottom: 14px; display: flex; gap: 5px; align-items: center; flex-wrap: wrap; }
.sc-allowed--empty { color: #4a5568; }
.sc-allowed code { background: #1e2533; padding: 1px 5px; border-radius: 4px; color: #f6ad55; }

/* ── Script suggestions ──────────────────────────────── */
.ss-grid { display: flex; flex-direction: column; gap: 10px; }
.ss-card { background: #161b27; border: 1px solid #2d3748; border-radius: 10px; padding: 14px 16px; }
.ss-card.ss-dismissed { opacity: 0.5; }
.ss-card.ss-accepted { border-color: #276749; }
.ss-head { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 8px; }
.ss-theme { font-weight: 600; font-size: 13px; }
.ss-freq { color: #7eb8f7; font-size: 12px; }
.ss-status-badge { margin-left: auto; font-size: 10px; padding: 2px 7px; border-radius: 4px; font-weight: 600; }
.ss-badge-new { background: #1a2744; color: #7eb8f7; }
.ss-badge-accepted { background: #0d1a12; color: #68d391; }
.ss-badge-dismissed { background: #1e2533; color: #4a5568; }
.ss-desc { color: #a0aec0; font-size: 13px; margin-bottom: 8px; }
.ss-meta { color: #718096; font-size: 12px; margin-bottom: 4px; }
.ss-examples { display: flex; flex-wrap: wrap; gap: 5px; margin: 8px 0; }
.ss-ex { background: #0f1117; border: 1px solid #1e2533; border-radius: 5px; padding: 2px 8px; font-size: 11px; color: #718096; }
.ss-actions { display: flex; gap: 6px; margin-top: 8px; }

/* ── Sidebar ─────────────────────────────────────────── */
.sidebar { width: 220px; flex-shrink: 0; background: #161b27; border-right: 1px solid #2d3748; height: calc(100vh / 1.2); display: flex; flex-direction: column; overflow: hidden; }
.sidebar-logo { padding: 14px 16px; border-bottom: 1px solid #2d3748; }
.logo-text { font-weight: 700; color: #7eb8f7; font-size: 13px; }
.logo-sub { font-size: 10px; color: #4a5568; margin-top: 2px; }
.sidebar-section { padding: 8px 0; border-bottom: 1px solid #1e2533; flex-shrink: 0; }
.sidebar-projects-section { flex: 1; min-height: 0; display: flex; flex-direction: column; }
.sidebar-projects-head { flex-shrink: 0; border-bottom: 1px solid #1e2533; }
.sidebar-projects-list { flex: 1; min-height: 0; overflow-y: auto; }
.sidebar-projects-list::-webkit-scrollbar { width: 3px; }
.sidebar-projects-list::-webkit-scrollbar-track { background: transparent; }
.sidebar-projects-list::-webkit-scrollbar-thumb { background: #2d3748; border-radius: 3px; }
.sidebar-projects-list::-webkit-scrollbar-thumb:hover { background: #4a5568; }
.sidebar-section-head { display: flex; align-items: center; padding: 6px 16px 4px; }
.sidebar-label { font-size: 9px; text-transform: uppercase; letter-spacing: 1px; color: #4a5568; font-weight: 700; padding: 8px 16px 4px; display: block; }
.sidebar-tools { margin-left: auto; display: flex; gap: 4px; }
.sidebar-tools button { background: transparent; border: none; color: #4a5568; cursor: pointer; font-size: 12px; padding: 2px 4px; border-radius: 3px; line-height: 1; }
.sidebar-tools button:hover { color: #a0aec0; }

.sidebar-item { display: flex; align-items: center; gap: 8px; padding: 7px 16px; color: #a0aec0; text-decoration: none; font-size: 12px; cursor: pointer; transition: all 0.15s; }
.sidebar-item:hover { background: #1e2533; color: #e2e8f0; }
.sidebar-item.active { background: #1a2744; color: #7eb8f7; border-right: 2px solid #7eb8f7; }
.sidebar-item--no-project { color: #2d3748; cursor: default; pointer-events: none; }.sidebar-item .icon { color: #4a5568; font-size: 12px; width: 14px; text-align: center; opacity: 0.7; flex-shrink: 0; }
.sidebar-item.active .icon { opacity: 1; color: #7eb8f7; }
.sidebar-project-name { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 11px; }

.sidebar-tag-header { display: flex; align-items: center; gap: 8px; padding: 6px 16px; cursor: pointer; color: #718096; font-size: 11px; transition: background 0.15s; }
.sidebar-tag-header:hover { background: #1e2533; color: #a0aec0; }
.sidebar-tag-chip { padding: 2px 7px; background: #1a2744; color: #7eb8f7; border-radius: 4px; font-size: 9px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.5px; }
.sidebar-tag-count { font-size: 11px; color: #4a5568; }
.sidebar-tag-chevron { margin-left: auto; font-size: 9px; color: #4a5568; }
.sidebar-empty { padding: 8px 16px; font-size: 12px; color: #4a5568; }

.badge.green { background: #0d1a12; color: #68d391; padding: 1px 6px; border-radius: 10px; font-size: 10px; font-weight: 600; }

.sidebar-bottom { flex-shrink: 0; padding: 12px 16px; border-top: 1px solid #2d3748; }
.user-chip { display: flex; align-items: center; gap: 8px; }
.user-avatar { width: 28px; height: 28px; border-radius: 50%; background: #2b4c7e; color: #7eb8f7; display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 11px; flex-shrink: 0; }
.user-info { min-width: 0; }
.user-info .name { font-size: 12px; color: #e2e8f0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 500; }
.user-info .role { font-size: 10px; color: #4a5568; }
.sidebar-logout { margin-left: auto; color: #4a5568; text-decoration: none; font-size: 14px; }
.sidebar-logout:hover { color: #fc8181; }

/* ── Analytics ───────────────────────────────────────── */
.an-kpis { display: flex; gap: 14px; flex-wrap: wrap; margin: 0 0 20px; }
.an-card { background: #161b27; border: 1px solid #2d3748; border-radius: 10px; padding: 14px 18px; min-width: 140px; }
.an-num { font-size: 26px; font-weight: 700; color: #e2e8f0; }
.an-num.an-warn { color: #f59e0b; }
.an-lbl { font-size: 11px; color: #718096; margin-top: 4px; }
.an-muted { color: #4a5568; font-size: 12px; }
.an-section { margin: 20px 0; }
.an-spark { width: 100%; max-width: 720px; height: 80px; }
.an-bar { fill: #2b5282; }
.an-spark-labels { display: flex; gap: 8px; font-size: 10px; opacity: 0.6; flex-wrap: wrap; }
.an-units, .an-reports { width: 100%; border-collapse: collapse; font-size: 12px; }
.an-units th, .an-units td, .an-reports th, .an-reports td { padding: 7px 10px; text-align: left; border-bottom: 1px solid #1e2533; }
.an-units th, .an-reports th { color: #4a5568; font-weight: 600; font-size: 10px; text-transform: uppercase; letter-spacing: 0.5px; }
.an-units th a { color: inherit; text-decoration: underline dotted; cursor: pointer; }
.an-unit-name { font-weight: 600; font-family: monospace; color: #7eb8f7; }
.an-trend.up { color: #68d391; }
.an-trend.down { color: #fc8181; }
.an-gap { color: #f59e0b; font-weight: 600; }
.an-results .chip { margin-right: 4px; }
.an-total-input { width: 110px; background: #0f1117; border: 1px solid #2d3748; color: inherit; border-radius: 6px; padding: 4px 8px; font-size: 12px; }
.an-empty, .an-section .an-muted { font-size: 13px; }
.an-modal-total { display: block; margin-top: 10px; font-size: 12px; color: #718096; }
.an-modal-total input { margin-top: 5px; }
.an-chips { display: flex; gap: 5px; flex-wrap: wrap; }

/* ── Phrase chips ─────────────────────────────────────── */
.cluster-phrases { display: flex; flex-wrap: wrap; gap: 5px; margin-bottom: 8px; }
.phrase-chip { font-size: 11px; background: #1e2533; color: #a0aec0; padding: 3px 10px; border-radius: 5px; display: inline-block; }
.phrase-chip:hover { background: #253048; color: #e2e8f0; cursor: pointer; }

/* ── LLM badge ───────────────────────────────────────── */
.llm-badge { display: inline-flex; align-items: center; gap: 4px; font-size: 10px; color: #f6ad55; background: #1a1208; padding: 3px 8px; border-radius: 4px; }

/* ── Sub-tabs ────────────────────────────────────────── */
.sub-tabs { display: flex; gap: 2px; margin-bottom: 14px; border-bottom: 1px solid #2d3748; }
.sub-tab { padding: 6px 14px; font-size: 12px; color: #4a5568; cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -1px; transition: color 0.15s; }
.sub-tab.active { color: #e2e8f0; border-color: #e2e8f0; }
.sub-tab .red-badge { background: #e53e3e; color: #fff; font-size: 10px; padding: 1px 5px; border-radius: 10px; margin-left: 4px; font-weight: 600; }

/* ── Diag results ─────────────────────────────────────── */
.diag-results { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 8px; }

/* ── Page header (legacy — kept for compat) ──────────── */
.page-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; }
.page-header h1 { font-size: 18px; font-weight: 600; }

/* ── Profile page ────────────────────────────────────── */
.profile-layout { max-width: 600px; display: flex; flex-direction: column; gap: 16px; }
.profile-card { display: flex; align-items: center; gap: 16px; background: #161b27; border: 1px solid #2d3748; border-radius: 10px; padding: 20px; }
.profile-avatar { width: 56px; height: 56px; border-radius: 50%; background: #2d3a5a; color: #7eb8f7; font-size: 22px; font-weight: 700; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.profile-info { flex: 1; min-width: 0; }
.profile-name { font-size: 15px; font-weight: 600; color: #e2e8f0; margin-bottom: 4px; }
.profile-email-sub { font-size: 11px; color: #4a5568; margin-bottom: 4px; }
.profile-meta { display: flex; align-items: center; gap: 10px; }
.profile-since { font-size: 11px; color: #4a5568; }
.role-badge { font-size: 11px; font-weight: 600; padding: 2px 8px; border-radius: 4px; }
.role-badge.role-admin { background: #2a1a3e; color: #b794f4; border: 1px solid #553c9a; }
.role-badge.role-moderator { background: #1a2e1a; color: #68d391; border: 1px solid #276749; }
.role-badge.role-user { background: #1a2744; color: #7eb8f7; border: 1px solid #2a4a8a; }
.profile-stats { display: flex; gap: 12px; }
.profile-stat { flex: 1; background: #161b27; border: 1px solid #2d3748; border-radius: 8px; padding: 14px; text-align: center; }
.profile-stat-value { font-size: 22px; font-weight: 700; color: #e2e8f0; }
.profile-stat-label { font-size: 11px; color: #4a5568; margin-top: 4px; }
.profile-form { display: contents; }

/* ── Sidebar user chip link ──────────────────────────── */
.sidebar-bottom a.user-chip-link { text-decoration: none; color: inherit; display: block; border-radius: 8px; transition: background 0.15s; }
.sidebar-bottom a.user-chip-link:hover { background: #1e2533; }

/* ── Theme toggle button ─────────────────────────────── */
.theme-toggle { position: fixed; top: 10px; right: 16px; z-index: 9990; width: 30px; height: 30px; border-radius: 50%; border: 1px solid #2d3748; background: #1e2533; color: #a0aec0; cursor: pointer; font-size: 14px; display: flex; align-items: center; justify-content: center; transition: background 0.2s, border-color 0.2s; line-height: 1; padding: 0; }
.theme-toggle:hover { background: #253048; border-color: #4a5568; color: #e2e8f0; }

/* ── Light theme overrides ───────────────────────────── */
html[data-theme="light"] body { background: #f5f7fc; color: #1a202c; }
html[data-theme="light"] .theme-toggle { background: #f0f3f9; border-color: #d1d9e8; color: #4a5568; }
html[data-theme="light"] .theme-toggle:hover { background: #e5eaf4; color: #1a202c; }

html[data-theme="light"] .screen-tabs { background: #fff; border-bottom-color: #d1d9e8; }
html[data-theme="light"] .screen-tab { color: #718096; }
html[data-theme="light"] .screen-tab:hover { color: #2d3748; }
html[data-theme="light"] .screen-tab.active { color: #2b5282; border-bottom-color: #2b5282; }
html[data-theme="light"] .tab-badge { background: #dbeafe; color: #2b5282; }
html[data-theme="light"] .tab-badge-returned { background: #fef2f2; color: #9b2c2c; }

html[data-theme="light"] .topbar { background: #fff; border-bottom-color: #d1d9e8; }
html[data-theme="light"] .topbar-title { color: #1a202c; }
html[data-theme="light"] .topbar-meta { color: #718096; }

html[data-theme="light"] .sidebar { background: #fff; border-right-color: #d1d9e8; }
html[data-theme="light"] .sidebar-logo { border-bottom-color: #d1d9e8; }
html[data-theme="light"] .logo-text { color: #2b5282; }
html[data-theme="light"] .logo-sub { color: #718096; }
html[data-theme="light"] .sidebar-section { border-bottom-color: #e5eaf4; }
html[data-theme="light"] .sidebar-projects-head { border-bottom-color: #e5eaf4; }
html[data-theme="light"] .sidebar-label { color: #718096; }
html[data-theme="light"] .sidebar-item { color: #4a5568; }
html[data-theme="light"] .sidebar-item:hover { background: #f0f3f9; color: #1a202c; }
html[data-theme="light"] .sidebar-item.active { background: #dbeafe; color: #2b5282; border-right-color: #2b5282; }
html[data-theme="light"] .sidebar-item .icon { color: #a0aec0; }
html[data-theme="light"] .sidebar-item.active .icon { color: #2b5282; }
html[data-theme="light"] .sidebar-tag-header { color: #4a5568; }
html[data-theme="light"] .sidebar-tag-header:hover { background: #f0f3f9; color: #1a202c; }
html[data-theme="light"] .sidebar-tag-chip { background: #dbeafe; color: #2b5282; }
html[data-theme="light"] .sidebar-tag-count { color: #718096; }
html[data-theme="light"] .sidebar-empty { color: #718096; }
html[data-theme="light"] .sidebar-tools button { color: #718096; }
html[data-theme="light"] .sidebar-tools button:hover { color: #1a202c; }
html[data-theme="light"] .sidebar-bottom { border-top-color: #d1d9e8; }
html[data-theme="light"] .sidebar-bottom a.user-chip-link:hover { background: #f0f3f9; }
html[data-theme="light"] .user-avatar { background: #dbeafe; color: #2b5282; }
html[data-theme="light"] .user-info .name { color: #1a202c; }
html[data-theme="light"] .sidebar-logout { color: #718096; }
html[data-theme="light"] .sidebar-logout:hover { color: #9b2c2c; }
html[data-theme="light"] .badge.green { background: #dcfce7; color: #276749; }
html[data-theme="light"] .badge.red { background: #fef2f2; color: #9b2c2c; }
html[data-theme="light"] .nav-badge { background: #dbeafe; color: #2b5282; }
html[data-theme="light"] .nav-badge-returned { background: #fef2f2; color: #9b2c2c; }

html[data-theme="light"] .cluster-card,
html[data-theme="light"] .project-card,
html[data-theme="light"] .queue-card,
html[data-theme="light"] .ss-card,
html[data-theme="light"] .sc-card,
html[data-theme="light"] .an-card,
html[data-theme="light"] .admin-kpi,
html[data-theme="light"] .unit-block { background: #fff; border-color: #d1d9e8; }
html[data-theme="light"] .cluster-card:hover,
html[data-theme="light"] .project-card:hover { border-color: #4a6fa5; }
html[data-theme="light"] .cluster-label { color: #1a202c; }
html[data-theme="light"] .cluster-breadcrumb { color: #718096; }
html[data-theme="light"] .cluster-freq { background: #e5eaf4; color: #4a5568; }
html[data-theme="light"] .cluster-context { background: #eef4fc; border-left-color: #4a6fa5; }
html[data-theme="light"] .cluster-context-text { color: #4a5568; }
html[data-theme="light"] .chip { background: #f0f3f9; color: #4a5568; }
html[data-theme="light"] .chip-pct { background: #fef3c7; color: #92400e; }
html[data-theme="light"] .chip-review { background: #dcfce7; color: #166534; border-color: #86efac; }
html[data-theme="light"] .chip-error { background: #fee2e2; color: #991b1b; border-color: #fca5a5; }
html[data-theme="light"] .chip-offtopic { background: #eceef3; color: #64748b; border-color: #cbd5e1; }
html[data-theme="light"] .cluster-comments-summary { color: #c53030; }
html[data-theme="light"] .cluster-comment-item { background: #fff5f5; border-left-color: #fc8181; }
html[data-theme="light"] .cluster-comment-meta { color: #c53030; }
html[data-theme="light"] .cluster-comment-text { color: #1a202c; }
html[data-theme="light"] .cluster-comment-regex { background: #f0f3f9; color: #4a5568; }
html[data-theme="light"] .phrase-chip { background: #f0f3f9; color: #4a5568; }
html[data-theme="light"] .phrase-chip:hover { background: #e5eaf4; color: #1a202c; }
html[data-theme="light"] .phrase-more { background: #f5f7fc; border-color: #d1d9e8; color: #718096; }
html[data-theme="light"] .unit-header { background: #fff; color: #1a202c; }
html[data-theme="light"] .unit-header:hover { background: #f5f7fc; }
html[data-theme="light"] .unit-name { color: #2b5282; }
html[data-theme="light"] .unit-prompt { color: #718096; }
html[data-theme="light"] .entity-row { border-bottom-color: #e5eaf4; }
html[data-theme="light"] .entity-name { color: #1a202c; }
html[data-theme="light"] .entity-hint { background: #f0f3f9; color: #718096; }
html[data-theme="light"] .entity-counts { color: #718096; }
html[data-theme="light"] .pattern-panel { background: #f5f7fc; border-color: #e5eaf4; }
html[data-theme="light"] .panel-toolbar { border-bottom-color: #e5eaf4; }
html[data-theme="light"] .lang-tab { border-color: #d1d9e8; color: #718096; }
html[data-theme="light"] .lang-tab.active,
html[data-theme="light"] .lang-tab.active-ru { background: #dbeafe; color: #2b5282; border-color: #4a6fa5; }
html[data-theme="light"] .lang-tab.active-kz { background: #dcfce7; color: #276749; border-color: #276749; }
html[data-theme="light"] .pattern-code { background: #fff; border-color: #d1d9e8; color: #1a202c; }
html[data-theme="light"] .pattern-num { color: #718096; }

html[data-theme="light"] .btn-sm { background: #f0f3f9; color: #4a5568; border-color: #d1d9e8; }
html[data-theme="light"] .btn-sm:hover { background: #e5eaf4; color: #1a202c; }
html[data-theme="light"] .btn-propose { background: #dbeafe; color: #2b5282; border-color: #4a6fa5; }
html[data-theme="light"] .btn-propose:hover { background: #bfdbfe; color: #1e3a5f; }
html[data-theme="light"] .btn-edit-proposal { background: #fef3c7; color: #92400e; border-color: #d97706; }
html[data-theme="light"] .btn-call-log { background: #f0fdf4; color: #276749; border-color: #86efac; }
html[data-theme="light"] .btn-call-log:hover { background: #dcfce7; color: #14532d; border-color: #276749; }
html[data-theme="light"] .btn-icon:hover { background: #f0f3f9; }
html[data-theme="light"] .icon-btn { border-color: #d1d9e8; color: #4a5568; }
html[data-theme="light"] .icon-btn:hover { background: #f0f3f9; color: #1a202c; }
html[data-theme="light"] .open-btn { border-color: #d1d9e8; color: #2b5282; }
html[data-theme="light"] .open-btn:hover { background: #dbeafe; }
html[data-theme="light"] .card-actions { border-top-color: #e5eaf4; }
html[data-theme="light"] .project-icon { background: #f0f3f9; border-color: #d1d9e8; }
html[data-theme="light"] .project-card-name { color: #1a202c; }
html[data-theme="light"] .project-card-meta { color: #718096; }

html[data-theme="light"] .status-btn { border-color: #d1d9e8; color: #4a5568; }
html[data-theme="light"] .status-btn.status-working { background: #fef3c7; color: #92400e; border-color: #d97706; }
html[data-theme="light"] .status-btn.status-assigned { background: #dbeafe; color: #2b5282; border-color: #4a6fa5; }
html[data-theme="light"] .status-btn.status-irrelevant { background: #fef2f2; color: #9b2c2c; border-color: #f87171; }
html[data-theme="light"] .status-menu { background: #fff; border-color: #d1d9e8; box-shadow: 0 4px 16px rgba(0,0,0,.1); }
html[data-theme="light"] .status-menu-item { color: #4a5568; }
html[data-theme="light"] .status-menu-item:hover { background: #f0f3f9; color: #1a202c; }

html[data-theme="light"] .modal-box { background: #fff; border-color: #d1d9e8; box-shadow: 0 8px 32px rgba(0,0,0,.12); }
html[data-theme="light"] .modal-header h2 { color: #1a202c; }
html[data-theme="light"] .modal-warning { color: #4a5568; }
html[data-theme="light"] .modal-warning code { background: #fef2f2; color: #9b2c2c; }
html[data-theme="light"] .assign-user-row:hover { background: #f0f3f9; border-color: #d1d9e8; }
html[data-theme="light"] .form-group label { color: #4a5568; }
html[data-theme="light"] .form-input,
html[data-theme="light"] .search-input,
html[data-theme="light"] .filter-select,
html[data-theme="light"] .role-select,
html[data-theme="light"] .an-total-input { background: #fff; border-color: #d1d9e8; color: #1a202c; }
html[data-theme="light"] .search-input::placeholder,
html[data-theme="light"] .form-input::placeholder { color: #a0aec0; }
html[data-theme="light"] .dropzone { border-color: #d1d9e8; }
html[data-theme="light"] .dropzone.over,
html[data-theme="light"] .dropzone:hover { background: #f0f4fc; }

html[data-theme="light"] .propose-context { background: #f5f7fc; border-color: #e5eaf4; }
html[data-theme="light"] .propose-unit { color: #2b5282; }
html[data-theme="light"] .propose-prompt { color: #718096; }
html[data-theme="light"] .phrase-list li { border-bottom-color: #e5eaf4; color: #1a202c; }
html[data-theme="light"] .phrase-context summary { color: #718096; }
html[data-theme="light"] .phrase-context-body { background: #f5f7fc; color: #4a5568; }

html[data-theme="light"] .queue-entity { color: #2b5282; }
html[data-theme="light"] .queue-meta { color: #718096; }
html[data-theme="light"] .bulk-bar { background: #dbeafe; border-color: #4a6fa5; }
html[data-theme="light"] .bulk-bar #bulk-count { color: #2b5282; }
html[data-theme="light"] .details-existing { background: #f5f7fc; border-color: #e5eaf4; }
html[data-theme="light"] .pattern-code-line { color: #1a202c; }
html[data-theme="light"] .details-label { color: #718096; }

html[data-theme="light"] .completed-row { background: #fff; border-color: #d1d9e8; }
html[data-theme="light"] .completed-row.status-done { border-color: #86efac; }
html[data-theme="light"] .completed-row.status-rejected { border-color: #fca5a5; }
html[data-theme="light"] .completed-entity { color: #2b5282; }
html[data-theme="light"] .completed-regex { background: #f5f7fc; color: #1a202c; }
html[data-theme="light"] .completed-section-title { color: #718096; }
html[data-theme="light"] .completed-section-count { background: #f0f3f9; color: #718096; }
html[data-theme="light"] .completed-unit,
html[data-theme="light"] .completed-report-label,
html[data-theme="light"] .completed-executor { color: #718096; }

html[data-theme="light"] .admin-tabs { border-bottom-color: #d1d9e8; }
html[data-theme="light"] .admin-tab { color: #718096; }
html[data-theme="light"] .admin-tab:hover { background: #f0f3f9; color: #4a5568; }
html[data-theme="light"] .admin-tab.active { color: #2b5282; border-bottom-color: #2b5282; }
html[data-theme="light"] .admin-table th { color: #718096; border-bottom-color: #d1d9e8; }
html[data-theme="light"] .admin-table td { border-bottom-color: #e5eaf4; }
html[data-theme="light"] .admin-table tr:hover td { background: #f5f7fc; }
html[data-theme="light"] .admin-create-form,
html[data-theme="light"] .admin-settings-section { background: #fff; border-color: #d1d9e8; }
html[data-theme="light"] .admin-setting-row { border-bottom-color: #e5eaf4; }
html[data-theme="light"] .admin-section-title { color: #718096; }
html[data-theme="light"] .admin-kpi-val { color: #1a202c; }
html[data-theme="light"] .admin-setting-label { color: #4a5568; }
html[data-theme="light"] .report-dropdown-menu { background: #fff; border-color: #d1d9e8; box-shadow: 0 4px 16px rgba(0,0,0,.1); }
html[data-theme="light"] .report-dropdown-item { color: #4a5568; }
html[data-theme="light"] .report-dropdown-item:hover { background: #f0f3f9; }

html[data-theme="light"] .an-num { color: #1a202c; }
html[data-theme="light"] .an-unit-name { color: #2b5282; }
html[data-theme="light"] .an-units th, html[data-theme="light"] .an-units td,
html[data-theme="light"] .an-reports th, html[data-theme="light"] .an-reports td { border-bottom-color: #e5eaf4; }
html[data-theme="light"] .an-bar { fill: #4a6fa5; }

html[data-theme="light"] .ss-badge-new { background: #dbeafe; color: #2b5282; }
html[data-theme="light"] .ss-badge-dismissed { background: #f0f3f9; color: #718096; }
html[data-theme="light"] .ss-card.ss-accepted { border-color: #276749; }
html[data-theme="light"] .ss-ex { background: #f5f7fc; border-color: #e5eaf4; color: #4a5568; }
html[data-theme="light"] .ss-desc { color: #4a5568; }

html[data-theme="light"] .sc-hint { color: #4a5568; }
html[data-theme="light"] .sc-card { border-color: #fca5a5; }
html[data-theme="light"] .sc-allowed code { background: #f0f3f9; color: #92400e; }

html[data-theme="light"] .sub-tabs { border-bottom-color: #d1d9e8; }
html[data-theme="light"] .sub-tab { color: #718096; }
html[data-theme="light"] .sub-tab.active { color: #1a202c; border-color: #1a202c; }

html[data-theme="light"] .login-box { background: #fff; border-color: #d1d9e8; }
html[data-theme="light"] .login-title { color: #2b5282; }
html[data-theme="light"] .llm-badge { background: #fef3c7; color: #92400e; }
html[data-theme="light"] .my-tasks-project-name { color: #2b5282; }
html[data-theme="light"] .profile-card,
html[data-theme="light"] .profile-stat { background: #fff; border-color: #d1d9e8; }
html[data-theme="light"] .profile-name { color: #1a202c; }
html[data-theme="light"] .profile-avatar { background: #dbeafe; color: #2b5282; }
html[data-theme="light"] .empty-title { color: #4a5568; }
html[data-theme="light"] .empty-sub { color: #718096; }
