* { margin: 0; padding: 0; box-sizing: border-box; }
body {
  background: #141414;
  color: #d0d0d0;
  font-family: -apple-system, 'Segoe UI', sans-serif;
  height: 100vh;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
#sidebar-toggle {
  display: none;
  color: #888;
  text-decoration: none;
  font-size: 0.78rem;
  align-items: center;
  padding: 0 12px;
  border-left: 1px solid #2a2a2a;
  background: transparent;
  border-top: none;
  border-right: none;
  border-bottom: none;
  cursor: pointer;
}
#sidebar-toggle:hover { color: #fff; background: #222; }
#layout {
  flex: 1; display: flex; overflow: hidden;
}
/* Sidebar */
#sidebar {
  width: 220px; min-width: 220px; background: #111; border-right: 1px solid #222;
  display: flex; flex-direction: column; overflow: hidden; flex-shrink: 0;
}
body.assistant-workspace #sidebar,
body.assistant-workspace #sidebar-overlay {
  display: none !important;
}
body.assistant-workspace #sidebar-toggle {
  visibility: hidden;
  pointer-events: none;
}
#sidebar-overlay {
  display: none;
}
#sidebar-header {
  padding: 10px 10px 6px;
  flex-shrink: 0;
}
#new-conv-btn {
  width: 100%; background: #1a1a1a; border: 1px solid #2a2a2a; border-radius: 6px;
  color: #888; font-size: 0.75rem; padding: 7px 10px; cursor: pointer; text-align: left;
}
#new-conv-btn:hover { background: #222; color: #bbb; }
#conv-list {
  flex: 1; overflow-y: auto; padding: 4px 6px 8px;
}
.conv-item {
  padding: 7px 8px; border-radius: 6px; cursor: pointer; font-size: 0.78rem;
  color: #666; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  display: flex; align-items: center; gap: 6px; position: relative;
}
.conv-item:hover { background: #1a1a1a; color: #aaa; }
.conv-item.active { background: #1e3a5f; color: #d0d0d0; }
.conv-item .conv-dot { width: 5px; height: 5px; border-radius: 50%; background: #444; flex-shrink: 0; }
.conv-item.active .conv-dot { background: #4a9eff; }
header {
  padding: 0 20px;
  background: #1c1c1c;
  border-bottom: 1px solid #2a2a2a;
  display: flex;
  align-items: stretch;
  gap: 0;
  flex-shrink: 0;
  height: 42px;
}
header h1 {
  font-size: 0.9rem; font-weight: 600; color: #fff; letter-spacing: 0.02em;
  display: flex; align-items: center; margin-right: 16px; white-space: nowrap;
}
#conn-badge {
  font-size: 0.7rem; padding: 2px 8px; border-radius: 99px;
  background: #2a2a2a; color: #666; transition: all 0.3s;
  display: flex; align-items: center; margin-right: 12px;
}
#conn-badge.connected { background: #0d2a0d; color: #4caf50; }
#active-badge { font-size: 0.75rem; color: #666; display: flex; align-items: center; margin-left: auto; }
#active-badge.busy { color: #ffa726; }
.header-spacer { flex: 1; }
#admin-link,
#chat-link,
#password-link {
  color: #888;
  text-decoration: none;
  font-size: 0.78rem;
  display: flex;
  align-items: center;
  padding: 0 12px;
  border-left: 1px solid #2a2a2a;
  background: transparent;
  border-top: none;
  border-right: none;
  border-bottom: none;
  cursor: pointer;
}
#admin-link.hidden,
.hidden {
  display: none !important;
}
#admin-link:hover,
#chat-link:hover,
#password-link:hover { color: #fff; background: #222; }

/* Top tabs */
#top-tabs { display: flex; align-items: stretch; gap: 0; flex: 1; }
.tab-btn {
  padding: 0 16px; background: none; border: none; border-bottom: 2px solid transparent;
  color: #555; font-size: 0.75rem; cursor: pointer; text-transform: uppercase;
  letter-spacing: 0.07em; transition: color 0.15s; white-space: nowrap;
  display: flex; align-items: center;
}
.tab-btn:hover { color: #888; }
.tab-btn.active { color: #4a9eff; border-bottom-color: #4a9eff; }

main { flex: 1; overflow: hidden; display: flex; flex-direction: column; position: relative; }
body.assistant-workspace main {
  width: 100%;
}
#tab-chat { flex: 1; display: flex; flex-direction: column; overflow: hidden; }
.tab-panel { display: none; position: absolute; inset: 0; background: #141414; z-index: 5; flex-direction: column; overflow: auto; }
.tab-panel.active { display: flex; }
#chat-shell { flex: 1; display: flex; flex-direction: column; min-height: 0; }
#chat-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 20px 10px;
  border-bottom: 1px solid #202020;
  background: linear-gradient(180deg, #191919 0%, #151515 100%);
}
.workspace-header-copy {
  min-width: 0;
}
#workspace-bar {
  display: flex;
  gap: 6px;
  margin-bottom: 8px;
}
#tool-bar {
  display: none;
  gap: 6px;
  margin-bottom: 8px;
}
#development-env-row {
  display: none;
  gap: 8px;
  margin-bottom: 10px;
  padding: 10px 12px;
  border: 1px solid #262626;
  border-radius: 12px;
  background: #171717;
}
body.tools-workspace.task-tool-active #development-env-row {
  display: flex !important;
  flex-direction: column;
}
#development-env-header {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
#development-env-title {
  font-size: 0.76rem;
  font-weight: 600;
  color: #f0f0f0;
}
#development-env-status {
  font-size: 0.72rem;
  line-height: 1.4;
  color: #8f8f8f;
}
#development-env-controls {
  display: flex;
  gap: 8px;
}
#development-env-select,
#development-env-preview,
#development-env-refresh {
  min-height: 38px;
  border-radius: 10px;
  border: 1px solid #2f2f2f;
  background: #141414;
  color: #e6e6e6;
}
#development-env-select {
  flex: 1 1 auto;
  min-width: 0;
  padding: 0 12px;
}
#development-env-refresh {
  padding: 0 12px;
}
#development-env-preview {
  align-items: center;
  padding: 0 12px;
  text-decoration: none;
  white-space: nowrap;
}
.workspace-btn {
  padding: 4px 12px;
  border-radius: 99px;
  border: 1px solid #333;
  background: transparent;
  color: #666;
  cursor: pointer;
  font-size: 0.76rem;
  transition: all 0.15s;
}
.workspace-btn:hover { border-color: #555; color: #999; }
.workspace-btn.active { border-color: #7bc87b; color: #7bc87b; background: #102410; }
.tool-btn {
  padding: 4px 12px;
  border-radius: 99px;
  border: 1px solid #333;
  background: transparent;
  color: #666;
  cursor: pointer;
  font-size: 0.74rem;
  transition: all 0.15s;
}
.tool-btn:hover { border-color: #555; color: #999; }
.tool-btn.active { border-color: #4a9eff; color: #4a9eff; background: #0d1f33; }
#chat-title { font-size: 1rem; font-weight: 600; color: #fff; }
#chat-subtitle { font-size: 0.76rem; color: #6c6c6c; margin-top: 4px; }

#assistant-shell {
  flex: 1;
  min-height: 0;
  display: none;
  grid-template-columns: minmax(0, 1.5fr) minmax(280px, 0.9fr);
  gap: 16px;
  padding: 16px 20px 18px;
  overflow: hidden;
}
#assistant-shell.assistant-compact {
  grid-template-columns: 1fr;
}
#assistant-shell.assistant-compact #assistant-main {
  max-width: 860px;
  margin: 0 auto;
}
#assistant-shell.assistant-compact #assistant-panels,
#assistant-shell.assistant-compact #assistant-detail {
  display: none;
}
#assistant-shell.assistant-operational #assistant-feed {
  min-height: 180px;
}
#assistant-main,
#assistant-panels {
  min-height: 0;
}
#assistant-main {
  display: flex;
  flex-direction: column;
  gap: 14px;
}
#assistant-feed {
  flex: 1;
  min-height: 240px;
  overflow-y: auto;
  background: linear-gradient(180deg, #181818 0%, #151515 100%);
  border: 1px solid #252525;
  border-radius: 16px;
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
#assistant-feed:empty::before {
  content: 'Сюда можно скинуть мысль, задачу, заметку или идею проекта.';
  color: #5c5c5c;
  font-size: 0.88rem;
  line-height: 1.5;
}
.assistant-entry {
  border: 1px solid #262626;
  border-radius: 14px;
  padding: 12px 14px;
  background: #1a1a1a;
}
.assistant-entry.user {
  background: #102410;
  border-color: #264226;
}
.assistant-entry.system {
  background: #171727;
  border-color: #2a2a44;
}
.assistant-entry-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 8px;
}
.assistant-entry-label {
  font-size: 0.72rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #8f8f8f;
}
.assistant-entry.user .assistant-entry-label {
  color: #8fd48f;
}
.assistant-entry.system .assistant-entry-label {
  color: #8fb2ff;
}
.assistant-entry-text {
  color: #d8d8d8;
  font-size: 0.9rem;
  line-height: 1.6;
  white-space: pre-wrap;
}
.assistant-entry-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}
.assistant-progress {
  align-self: flex-start;
  font-size: 0.82rem;
  color: #7f8fba;
  font-style: italic;
  padding: 4px 0;
  animation: pulse 1.5s ease-in-out infinite;
}
.assistant-entry-actions button {
  padding: 6px 12px;
  border-radius: 999px;
  border: 1px solid #345634;
  background: #173017;
  color: #a6d8a6;
  cursor: pointer;
  font-size: 0.76rem;
}
.assistant-entry-actions button.secondary {
  border-color: #5a3333;
  background: #2a1717;
  color: #e6a6a6;
}
.assistant-inline-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.assistant-inline-card {
  width: 100%;
  text-align: left;
  background: #141414;
  border: 1px solid #2a2a2a;
  border-radius: 12px;
  padding: 11px 12px;
  cursor: pointer;
}
.assistant-inline-card:hover {
  border-color: #417541;
  background: #171717;
}
.assistant-external-card {
  text-decoration: none;
  color: inherit;
}
.assistant-inline-card-title {
  color: #ececec;
  font-size: 0.84rem;
}
.assistant-inline-card-meta {
  color: #8a8a8a;
  font-size: 0.74rem;
  margin-top: 4px;
}
.assistant-inline-card-snippet {
  color: #b7b7b7;
  font-size: 0.78rem;
  line-height: 1.5;
  margin-top: 8px;
}
#assistant-composer {
  display: flex;
  gap: 10px;
  align-items: flex-end;
}
#assistant-input-row {
  width: 100%;
  display: flex;
  gap: 10px;
  align-items: flex-end;
}
#assistant-input {
  flex: 1;
  min-height: 104px;
  resize: vertical;
  max-height: 220px;
  background: #1c1c1c;
  border: 1px solid #333;
  border-radius: 14px;
  color: #e2e2e2;
  padding: 12px 14px;
  font: inherit;
  line-height: 1.5;
  outline: none;
}
#assistant-input:focus {
  border-color: #7bc87b;
}
#assistant-send-btn {
  min-width: 132px;
  height: 48px;
  border-radius: 14px;
  border: 1px solid #315631;
  background: #163016;
  color: #9dd99d;
  cursor: pointer;
  font-size: 0.88rem;
}
#assistant-send-btn:hover {
  background: #1d3b1d;
  color: #c5efc5;
}
#assistant-send-btn:disabled {
  cursor: not-allowed;
  opacity: 0.55;
}
#assistant-panels {
  display: flex;
  flex-direction: column;
  gap: 12px;
  overflow-y: auto;
}
.assistant-panel {
  background: #181818;
  border: 1px solid #252525;
  border-radius: 16px;
  padding: 14px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.assistant-panel-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}
.assistant-panel-header h3 {
  font-size: 0.92rem;
  color: #fff;
  margin-bottom: 4px;
}
.assistant-panel-header p {
  color: #777;
  font-size: 0.77rem;
  line-height: 1.5;
}
.assistant-panel-header button {
  padding: 6px 10px;
  border-radius: 8px;
  border: 1px solid #333;
  background: #202020;
  color: #b9b9b9;
  cursor: pointer;
}
.assistant-panel-header button:hover {
  border-color: #7bc87b;
  color: #e9e9e9;
}
.assistant-controls {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.assistant-controls select {
  flex: 1;
  min-width: 160px;
  background: #121212;
  color: #e6e6e6;
  border: 1px solid #303030;
  border-radius: 10px;
  padding: 8px 10px;
}
.assistant-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.assistant-card {
  border: 1px solid #2a2a2a;
  border-radius: 12px;
  background: #151515;
  padding: 11px 12px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.assistant-card-title {
  color: #e5e5e5;
  font-size: 0.84rem;
}
.assistant-card-meta {
  color: #818181;
  font-size: 0.74rem;
}
.assistant-card-text {
  color: #c2c2c2;
  font-size: 0.8rem;
  line-height: 1.5;
  white-space: pre-wrap;
}
.assistant-card-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 4px;
}
.assistant-card-actions button {
  padding: 5px 10px;
  border-radius: 999px;
  border: 1px solid #345634;
  background: #173017;
  color: #a6d8a6;
  cursor: pointer;
  font-size: 0.76rem;
}
.assistant-card-actions button.secondary {
  border-color: #5a3333;
  background: #2a1717;
  color: #e6a6a6;
}
.assistant-detail #assistant-detail-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.assistant-detail {
  border: 1px solid #262626;
  border-radius: 16px;
  background: #171717;
  padding: 14px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.assistant-detail.assistant-empty-state {
  border-style: dashed;
  color: #787878;
}
.assistant-detail-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}
.assistant-detail-kicker {
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #7bc87b;
  margin-bottom: 4px;
}
.assistant-detail-header h3 {
  font-size: 0.96rem;
  color: #f0f0f0;
}
.assistant-detail-body {
  color: #d0d0d0;
  font-size: 0.86rem;
  line-height: 1.65;
  white-space: pre-wrap;
}
.assistant-empty {
  color: #5f5f5f;
  font-size: 0.8rem;
  line-height: 1.5;
}

/* Chat */
#messages {
  flex: 1; overflow-y: auto; padding: 20px;
  display: flex; flex-direction: column; gap: 14px;
}
#messages:empty::before {
  content: 'Задайте вопрос совету...';
  color: #444; font-size: 0.9rem; align-self: center; margin-top: 40px;
}
.msg-user {
  align-self: flex-end; max-width: 65%;
  background: #1e3a5f; padding: 10px 14px;
  border-radius: 12px 12px 2px 12px;
  font-size: 0.9rem; line-height: 1.5; word-break: break-word;
}
.msg-section { align-self: flex-start; max-width: 78%; }
.msg-section .role-label {
  font-size: 0.68rem; color: #555; margin-bottom: 4px; padding-left: 4px;
  cursor: pointer; user-select: none; display: flex; align-items: center; gap: 4px;
}
.msg-section .role-label::after { content: '▾'; font-size: 0.6rem; color: #444; }
.msg-section.collapsed .role-label::after { content: '▸'; }
.msg-section .role-name { text-transform: uppercase; letter-spacing: 0.08em; }
.msg-section .model-name { color: #3a3a3a; margin-left: 6px; }
.msg-section .context-budget {
  font-size: 0.63rem;
  color: #5f6672;
  margin: 0 0 6px 4px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}
.msg-section .context-budget-detail {
  color: #3d434d;
  margin-left: 6px;
  text-transform: none;
  letter-spacing: 0;
}
.msg-section .bubble {
  background: #1c1c1c; border: 1px solid #2a2a2a; border-left: 3px solid #333;
  padding: 12px 16px; border-radius: 2px 10px 10px 10px;
  font-size: 0.88rem; line-height: 1.65; white-space: pre-wrap; word-break: break-word;
  transition: max-height 0.2s ease, padding 0.2s ease, opacity 0.2s;
}
.msg-section.collapsed .bubble {
  display: none;
}
.msg-section.analyst .bubble  { border-left-color: #4a9eff; }
.msg-section.critic .bubble   { border-left-color: #ff5252; }
.msg-section.synthesis .bubble { border-left-color: #4caf50; border-left-width: 4px; }
.msg-section.assistant .bubble { border-left-color: #888; }
.msg-progress {
  align-self: flex-start; font-size: 0.82rem; color: #666; font-style: italic; padding: 4px 0;
  animation: pulse 1.5s ease-in-out infinite;
}
@keyframes pulse { 0%,100%{opacity:.6} 50%{opacity:1} }
.iter-label { align-self: flex-start; font-size: 0.7rem; color: #444; text-transform: uppercase; letter-spacing: 0.1em; }

/* Pipeline config banner */
.pipeline-banner {
  align-self: flex-start; max-width: 78%;
  background: #0d0d1a; border: 1px solid #1a1a33; border-left: 3px solid #6b6b99;
  padding: 7px 12px; border-radius: 2px 10px 10px 10px;
  font-size: 0.72rem; color: #666; line-height: 1.6;
}
.pipeline-banner .p-label { font-size: 0.63rem; color: #4a4a77; text-transform: uppercase; letter-spacing: 0.08em; margin-bottom: 3px; }

/* Clarifier and Router banners */
.clarifier-banner {
  align-self: flex-start; max-width: 78%;
  background: #0d1a0d; border: 1px solid #1a3a1a; border-left: 3px solid #4caf50;
  padding: 12px 16px; border-radius: 2px 10px 10px 10px; margin: 0;
}
.clarifier-banner .q-label { font-size: 0.65rem; color: #4caf50; text-transform: uppercase; letter-spacing: 0.08em; margin-bottom: 6px; }
.clarifier-banner .q-text { font-size: 0.85rem; color: #ccc; line-height: 1.5; white-space: pre-wrap; }
.router-banner {
  align-self: flex-start; max-width: 78%;
  background: #0d0d1a; border: 1px solid #1a1a3a; border-left: 3px solid #4a9eff;
  padding: 12px 16px; border-radius: 2px 10px 10px 10px;
}
.router-banner .r-label { font-size: 0.65rem; color: #4a9eff; text-transform: uppercase; letter-spacing: 0.08em; margin-bottom: 4px; }
.router-banner .r-mode { font-size: 0.88rem; color: #fff; font-weight: 600; }
.router-banner .r-reason { font-size: 0.78rem; color: #777; margin-top: 4px; line-height: 1.4; }
#mode-confirm-bar {
  display: none; gap: 6px; flex-wrap: wrap; padding: 10px 20px;
  background: #1a1a1a; border-top: 1px solid #252525; flex-shrink: 0;
}
#mode-confirm-bar.visible { display: flex; align-items: center; }
.confirm-btn {
  padding: 5px 14px; border-radius: 6px; border: 1px solid #333;
  background: transparent; color: #888; cursor: pointer; font-size: 0.78rem; transition: all 0.15s;
}
.confirm-btn:hover { border-color: #4a9eff; color: #4a9eff; }
.confirm-btn.primary { border-color: #4caf50; color: #4caf50; background: #0d2a0d; }
.dev-actions-banner {
  align-self: flex-start;
  max-width: 78%;
  background: #16161f;
  border: 1px solid #2b2b3d;
  border-left: 3px solid #ffb74d;
  padding: 12px 16px;
  border-radius: 2px 10px 10px 10px;
}
.dev-actions-text {
  font-size: 0.82rem;
  color: #c7c7d9;
  line-height: 1.5;
}
.dev-actions-row {
  display: flex;
  gap: 8px;
  margin-top: 10px;
  flex-wrap: wrap;
}
#skip-btn {
  display: none; width: 42px; height: 42px; background: #2a2a2a; color: #888; border: none;
  border-radius: 8px; cursor: pointer; font-size: 0.75rem; flex-shrink: 0; transition: background 0.15s;
}
#skip-btn.visible { display: block; }
#skip-btn:hover { background: #333; color: #aaa; }

/* Input */
#input-area { padding: 14px 20px; background: #1a1a1a; border-top: 1px solid #252525; flex-shrink: 0; }
#mode-bar { display: flex; gap: 6px; margin-bottom: 10px; }
.mode-btn {
  padding: 4px 12px; border-radius: 99px; border: 1px solid #333;
  background: transparent; color: #666; cursor: pointer; font-size: 0.78rem; transition: all 0.15s;
}
.mode-btn:hover { border-color: #555; color: #999; }
.mode-btn.active { border-color: #4a9eff; color: #4a9eff; background: #0d1f33; }
#input-row { display: flex; gap: 8px; align-items: flex-end; }
#query-input {
  flex: 1; background: #222; border: 1px solid #333; border-radius: 8px;
  padding: 10px 14px; color: #d0d0d0; font-size: 0.9rem; resize: none;
  min-height: 42px; max-height: 140px; line-height: 1.5; outline: none;
  font-family: inherit; transition: border-color 0.15s;
}
#query-input:focus { border-color: #4a9eff; }
#send-btn {
  width: 42px; height: 42px; background: #4a9eff; color: #fff; border: none;
  border-radius: 8px; cursor: pointer; font-size: 1.1rem; flex-shrink: 0; transition: background 0.15s;
}
#send-btn:hover { background: #3a8ef0; }
#send-btn:disabled { background: #2a2a2a; color: #555; cursor: not-allowed; }
#feedback-row {
  display: none; align-items: center; gap: 10px; padding: 6px 0 0;
  font-size: 0.78rem; color: #444;
}
.fb-btn {
  background: none; border: 1px solid #2a2a2a; color: #555;
  padding: 2px 10px; border-radius: 6px; cursor: pointer; font-size: 0.85rem; transition: all 0.15s;
}
.fb-btn:hover:not(:disabled) { border-color: #555; color: #999; }
.fb-btn.selected { border-color: #4a9eff; color: #4a9eff; }
.fb-btn:disabled { cursor: default; opacity: 0.5; }

/* Log */
#tab-log { padding: 6px; overflow-y: auto; }
.log-entry { display: flex; gap: 6px; padding: 3px 6px; border-radius: 4px; font-size: 0.72rem; color: #555; line-height: 1.4; }
.log-entry time { color: #3a3a3a; white-space: nowrap; flex-shrink: 0; }
.log-entry.new { color: #888; }

/* Admin */
#admin-shell {
  flex: 1;
  min-height: 0;
  display: grid;
  grid-template-columns: 250px minmax(0, 1fr);
  overflow: hidden;
}
#admin-sidebar {
  overflow-y: auto;
  padding: 18px 14px;
  background: #121212;
  border-right: 1px solid #232323;
}
#admin-sidebar-header {
  margin-bottom: 14px;
}
#admin-sidebar-title {
  color: #f0f0f0;
  font-size: 0.92rem;
  font-weight: 600;
}
#admin-sidebar-hint {
  color: #717171;
  font-size: 0.74rem;
  margin-top: 4px;
}
#admin-sidebar-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.admin-nav-item {
  border: 1px solid #262626;
  border-radius: 12px;
  background: #171717;
  padding: 10px;
}
.admin-nav-item.active {
  border-color: #4a9eff;
  background: #152234;
}
.admin-nav-main {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}
.admin-nav-link {
  background: transparent;
  border: none;
  padding: 0;
  color: #e4e4e4;
  cursor: pointer;
  text-align: left;
  font-size: 0.82rem;
}
.admin-nav-link:hover {
  color: #ffffff;
}
.admin-nav-actions {
  display: flex;
  gap: 6px;
}
.admin-nav-actions button {
  width: 26px;
  height: 26px;
  border-radius: 8px;
  border: 1px solid #303030;
  background: #1c1c1c;
  color: #bababa;
  cursor: pointer;
}
.admin-nav-actions button:hover {
  border-color: #4a9eff;
  color: #ffffff;
}
#admin-content {
  min-width: 0;
  overflow-y: auto;
}
#admin-layout {
  overflow-y: auto;
  padding: 20px;
  gap: 18px;
  background: #141414;
}
.admin-section {
  background: #1a1a1a;
  border: 1px solid #252525;
  border-radius: 12px;
  padding: 18px;
}
.admin-section[open] {
  border-color: #343434;
}
.admin-summary {
  cursor: pointer;
  color: #f0f0f0;
  font-weight: 600;
  list-style: none;
}
.admin-summary::-webkit-details-marker {
  display: none;
}
.admin-summary::before {
  content: '+';
  display: inline-block;
  width: 18px;
  color: #7fa4ff;
}
.admin-section[open] .admin-summary::before {
  content: '-';
}
.admin-section-body {
  margin-top: 14px;
}
.admin-note {
  color: #8b8b8b;
  font-size: 0.82rem;
  line-height: 1.5;
  margin-bottom: 12px;
}
.admin-section-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 14px;
}
.admin-section-header h2 {
  font-size: 1rem;
  color: #fff;
  margin-bottom: 4px;
}
.admin-section-header p {
  font-size: 0.78rem;
  color: #777;
  line-height: 1.5;
}
.admin-section-header button {
  padding: 6px 12px;
  border-radius: 6px;
  border: 1px solid #333;
  background: #202020;
  color: #bbb;
  cursor: pointer;
}
.admin-section-header button:hover {
  border-color: #4a9eff;
  color: #fff;
}
#admin-active-badge {
  font-size: 0.8rem;
  color: #8a8a8a;
  margin-bottom: 12px;
}
#admin-active-badge.busy { color: #ffa726; }
.admin-log-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-height: 48px;
}
.admin-conversations-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.admin-users-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.admin-conversation-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 12px;
  border: 1px solid #2b2b2b;
  border-radius: 8px;
  background: #171717;
}
.admin-conversation-main {
  min-width: 0;
}
.admin-conversation-title {
  color: #e0e0e0;
  font-size: 0.86rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.admin-conversation-meta {
  color: #727272;
  font-size: 0.74rem;
  margin-top: 3px;
}
.admin-delete-btn {
  border: 1px solid #5a2a2a;
  background: #261414;
  color: #ff9a9a;
  border-radius: 6px;
  padding: 6px 10px;
  cursor: pointer;
}
.admin-delete-btn:hover {
  background: #351919;
  color: #ffd1d1;
}
.admin-error {
  color: #ff8a80;
  font-size: 0.86rem;
}
.admin-user-create,
.admin-settings-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 12px;
}
.admin-user-create input,
.admin-settings-row input {
  min-width: 180px;
  padding: 8px 10px;
  border-radius: 8px;
  border: 1px solid #303030;
  background: #121212;
  color: #e6e6e6;
}
.admin-user-create label,
.admin-settings-row label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #a8a8a8;
  font-size: 0.85rem;
}
.admin-user-create button {
  padding: 8px 12px;
  border-radius: 8px;
  border: 1px solid #2f4f2f;
  background: #162316;
  color: #b7e3b7;
  cursor: pointer;
}
.admin-toolbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  margin-bottom: 12px;
}
.admin-pager {
  display: flex;
  align-items: center;
  gap: 8px;
}
.admin-pager button {
  padding: 6px 10px;
  border-radius: 8px;
  border: 1px solid #333;
  background: #202020;
  color: #bbb;
  cursor: pointer;
}
.admin-tags-text {
  width: 100%;
  background: #121212;
  color: #e6e6e6;
  border: 1px solid #303030;
  border-radius: 10px;
  padding: 10px 12px;
}
.admin-dev-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 12px;
}
.admin-dev-card {
  border: 1px solid #2b2b2b;
  border-radius: 10px;
  background: #171717;
  padding: 12px;
}
.admin-dev-card h3 {
  color: #efefef;
  font-size: 0.9rem;
  margin-bottom: 10px;
}
.admin-dev-card select {
  min-width: 180px;
  padding: 8px 10px;
  border-radius: 8px;
  border: 1px solid #303030;
  background: #121212;
  color: #e6e6e6;
}
.admin-dev-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.admin-dev-record {
  border: 1px solid #2c2c2c;
  border-radius: 10px;
  background: #131313;
  padding: 10px 11px;
}
.admin-dev-record-title {
  color: #ececec;
  font-size: 0.84rem;
}
.admin-dev-record-meta {
  color: #878787;
  font-size: 0.73rem;
  margin-top: 4px;
}
.admin-dev-record-body {
  color: #c2c2c2;
  font-size: 0.78rem;
  line-height: 1.5;
  margin-top: 8px;
  word-break: break-word;
}

@media (max-width: 900px) {
  header {
    padding: 0 12px;
  }
  #sidebar-toggle {
    display: flex;
  }
  body.assistant-workspace #sidebar-toggle {
    display: none;
  }
  #layout {
    position: relative;
  }
  #sidebar {
    position: fixed;
    top: 42px;
    left: 0;
    bottom: 0;
    width: min(84vw, 320px);
    min-width: 0;
    z-index: 30;
    transform: translateX(-100%);
    transition: transform 0.2s ease;
    box-shadow: 18px 0 32px rgba(0, 0, 0, 0.35);
  }
  body.sidebar-open #sidebar {
    transform: translateX(0);
  }
  #sidebar-overlay {
    position: fixed;
    inset: 42px 0 0 0;
    background: rgba(0, 0, 0, 0.45);
    z-index: 20;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.2s ease;
    display: block;
  }
  body.sidebar-open #sidebar-overlay {
    opacity: 1;
    pointer-events: auto;
  }
  #chat-header {
    padding: 12px 14px 10px;
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
  }
  #assistant-shell {
    grid-template-columns: 1fr;
    padding: 12px 14px 14px;
  }
  #assistant-shell.assistant-compact #assistant-main {
    max-width: none;
  }
  .workspace-header-copy {
    width: 100%;
  }
  #assistant-reconcile-btn {
    width: 100%;
  }
  #assistant-panels {
    overflow: visible;
  }
  #assistant-feed {
    min-height: 180px;
  }
  #assistant-composer {
    flex-direction: column;
    align-items: stretch;
  }
  #assistant-input-row {
    flex-direction: column;
    align-items: stretch;
  }
  #assistant-send-btn {
    width: 100%;
    min-width: 0;
  }
  #workspace-bar,
  #tool-bar,
  #development-env-row,
  #mode-bar {
    flex-wrap: wrap;
  }
  .workspace-btn,
  .tool-btn,
  .mode-btn {
    min-height: 38px;
  }
  #messages {
    padding: 14px;
    gap: 12px;
  }
  .msg-user,
  .msg-section,
  .pipeline-banner,
  .clarifier-banner,
  .router-banner,
  .dev-actions-banner {
    max-width: 100%;
  }
  #input-area {
    padding: 12px 14px;
  }
  #development-env-row {
    flex-direction: column;
    align-items: stretch;
  }
  #development-env-controls {
    flex-direction: column;
    align-items: stretch;
  }
  #input-row {
    align-items: stretch;
  }
  .assistant-card-actions button,
  .assistant-entry-actions button {
    min-height: 40px;
  }
  .assistant-detail #assistant-detail-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
  #send-btn,
  #skip-btn {
    width: 44px;
    height: auto;
    min-height: 44px;
  }
  #query-input {
    min-height: 44px;
  }
  #admin-shell {
    grid-template-columns: 1fr;
  }
  #admin-sidebar {
    border-right: none;
    border-bottom: 1px solid #232323;
    padding-bottom: 12px;
  }
  #admin-sidebar-list {
    flex-direction: row;
    flex-wrap: wrap;
  }
  .admin-nav-item {
    flex: 1 1 220px;
  }
  #admin-layout {
    padding: 14px;
  }
  .admin-section {
    padding: 14px;
  }
  .admin-toolbar,
  .admin-pager,
  .admin-user-create,
  .admin-settings-row {
    flex-direction: column;
    align-items: stretch;
  }
  .admin-dev-grid {
    grid-template-columns: 1fr;
  }
  .admin-user-create input,
  .admin-settings-row input,
  .admin-dev-card select {
    min-width: 0;
    width: 100%;
  }
  .admin-conversation-item {
    align-items: stretch;
    flex-direction: column;
  }
}

@media (max-width: 640px) {
  #assistant-shell {
    padding: 10px 12px 12px;
    gap: 12px;
  }
  #assistant-feed,
  .assistant-panel,
  #assistant-detail {
    border-radius: 14px;
  }
  .assistant-controls {
    flex-direction: column;
    align-items: stretch;
  }
  .assistant-controls select {
    width: 100%;
  }
  .assistant-entry-actions,
  .assistant-card-actions,
  .assistant-detail #assistant-detail-actions {
    display: grid;
    grid-template-columns: 1fr;
  }
  #assistant-send-btn {
    min-height: 46px;
  }
  #assistant-input {
    min-height: 96px;
  }
}

/* Memory / Context */
#tab-memory { overflow-y: auto; }
#tab-memory-inner { padding: 6px; display: flex; flex-direction: column; gap: 4px; }
#ctx-toolbar { padding: 2px 2px 6px; display: flex; justify-content: flex-end; }
#ctx-add-btn {
  padding: 3px 10px; border-radius: 6px; border: 1px solid #333;
  background: transparent; color: #666; cursor: pointer; font-size: 0.73rem; transition: all 0.15s;
}
#ctx-add-btn:hover { border-color: #4a9eff; color: #4a9eff; }
.ctx-add-panel {
  background: #1a1a1a; border: 1px solid #2a2a2a; border-radius: 6px;
  padding: 10px; display: none; flex-direction: column; gap: 7px; margin-bottom: 2px;
}
.ctx-add-panel.open { display: flex; }
.ctx-add-row { display: flex; gap: 6px; }
.ctx-item {
  background: #1a1a1a; border: 1px solid #252525; border-radius: 6px;
  padding: 8px 10px; display: flex; flex-direction: column; gap: 3px;
}
.ctx-item-header { display: flex; align-items: center; gap: 6px; }
.ctx-zone-badge {
  font-size: 0.6rem; padding: 1px 6px; border-radius: 99px; flex-shrink: 0;
  text-transform: uppercase; letter-spacing: 0.06em;
}
.ctx-zone-badge.profile  { background: #0d1f33; color: #4a9eff; }
.ctx-zone-badge.state    { background: #2a1a00; color: #ffa726; }
.ctx-zone-badge.chronicle { background: #1e1e1e; color: #777; border: 1px solid #333; }
.ctx-key { font-size: 0.75rem; color: #aaa; flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ctx-item-actions { display: flex; gap: 2px; margin-left: auto; flex-shrink: 0; }
.ctx-btn {
  background: none; border: none; color: #3a3a3a; cursor: pointer;
  font-size: 0.7rem; padding: 2px 5px; border-radius: 3px; transition: color 0.15s;
}
.ctx-btn:hover { color: #888; }
.ctx-btn.del:hover { color: #ff5252; }
.ctx-preview { font-size: 0.72rem; color: #555; line-height: 1.4; padding-top: 1px; }
.ctx-edit { display: none; flex-direction: column; gap: 6px; padding-top: 7px; border-top: 1px solid #1e1e1e; margin-top: 4px; }
.ctx-edit.open { display: flex; }
.ctx-input, .ctx-textarea, .ctx-select {
  background: #222; border: 1px solid #2a2a2a; color: #ccc;
  padding: 5px 8px; border-radius: 5px; font-size: 0.78rem; outline: none;
  transition: border-color 0.15s; font-family: inherit; width: 100%;
}
.ctx-input:focus, .ctx-textarea:focus { border-color: #4a9eff; }
.ctx-textarea { resize: vertical; min-height: 56px; line-height: 1.4; }
.ctx-edit-actions { display: flex; gap: 6px; }
.ctx-save-btn {
  padding: 4px 12px; background: #4a9eff; border: none; border-radius: 5px;
  color: #fff; cursor: pointer; font-size: 0.75rem; transition: background 0.15s;
}
.ctx-save-btn:hover { background: #3a8ef0; }
.ctx-cancel-btn {
  padding: 4px 10px; background: transparent; border: 1px solid #333; border-radius: 5px;
  color: #666; cursor: pointer; font-size: 0.75rem; transition: all 0.15s;
}
.ctx-cancel-btn:hover { border-color: #555; color: #999; }
.ctx-empty { font-size: 0.73rem; color: #333; padding: 10px 4px; }
#ctx-review-section { margin-top: 12px; border-top: 1px solid #1e1e1e; padding-top: 10px; }
#ctx-review-header { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
#ctx-review-header span { font-size: 0.75rem; color: #888; flex: 1; }
#ctx-review-btn { font-size: 0.7rem; padding: 3px 8px; background: none; border: 1px solid #2a2a2a; color: #666; border-radius: 4px; cursor: pointer; }
#ctx-review-btn:hover { border-color: #ffa726; color: #ffa726; }
#ctx-profile-review-btn { font-size: 0.7rem; padding: 3px 8px; background: none; border: 1px solid #2a2a2a; color: #666; border-radius: 4px; cursor: pointer; }
#ctx-profile-review-btn:hover { border-color: #4a9eff; color: #4a9eff; }
.ctx-pending-item { background: #1a1a0e; border: 1px solid #2a2a00; border-radius: 5px; padding: 7px 8px; margin-bottom: 5px; }
.ctx-pending-item .ctx-item-header { margin-bottom: 4px; }
.ctx-pending-source { font-size: 0.65rem; color: #555; margin-left: 4px; }
.ctx-pending-actions { display: flex; gap: 5px; margin-top: 6px; }
.ctx-approve-btn { font-size: 0.7rem; padding: 2px 8px; background: #0d2a0d; border: 1px solid #2a4a2a; color: #4caf50; border-radius: 3px; cursor: pointer; }
.ctx-approve-btn:hover { background: #1a3a1a; }
.ctx-archive-btn { font-size: 0.7rem; padding: 2px 8px; background: none; border: 1px solid #2a2a2a; color: #555; border-radius: 3px; cursor: pointer; }
.ctx-archive-btn:hover { color: #888; border-color: #444; }
.ctx-pending-edit { display: none; flex-direction: column; gap: 5px; margin-top: 6px; padding-top: 6px; border-top: 1px solid #2a2a00; }
.ctx-pending-edit.open { display: flex; }
#ctx-review-empty { font-size: 0.72rem; color: #333; padding: 6px 2px; }

/* Prompts */
#tab-prompts { overflow-y: auto; }
#prompts-list { padding: 12px; }
.prompt-item { margin-bottom: 14px; }
.prompt-item label { display: block; font-size: 0.72rem; color: #888; margin-bottom: 4px; letter-spacing: 0.04em; }
.prompt-item textarea { width: 100%; background: #111; color: #ccc; border: 1px solid #2a2a2a; border-radius: 4px; padding: 6px 8px; font-size: 0.72rem; font-family: monospace; resize: vertical; min-height: 80px; box-sizing: border-box; }
.prompt-item textarea:focus { border-color: #4a9eff; outline: none; }
.prompt-save-btn { font-size: 0.7rem; padding: 3px 10px; background: none; border: 1px solid #2a2a2a; color: #666; border-radius: 4px; cursor: pointer; margin-top: 4px; }
.prompt-save-btn:hover { border-color: #4a9eff; color: #4a9eff; }
.prompt-save-btn.saved { border-color: #4caf50; color: #4caf50; }

/* Metrics */
#tab-metrics { overflow-y: auto; }
#metrics-inner { padding: 16px; display: flex; flex-direction: column; gap: 24px; }
.metrics-section h3 { font-size: 0.72rem; color: #888; text-transform: uppercase; letter-spacing: 0.08em; margin-bottom: 8px; }
.metrics-table { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.metrics-table th { text-align: left; padding: 5px 8px; color: #555; border-bottom: 1px solid #222; font-weight: normal; font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.06em; }
.metrics-table td { padding: 5px 8px; color: #888; border-bottom: 1px solid #1a1a1a; }
.metrics-table tr:last-child td { border-bottom: none; }
.metrics-table td:first-child { color: #aaa; }
.metrics-empty { font-size: 0.75rem; color: #333; padding: 8px 0; }
#metrics-refresh { font-size: 0.7rem; padding: 3px 10px; background: none; border: 1px solid #2a2a2a; color: #666; border-radius: 4px; cursor: pointer; margin-bottom: 12px; }
#metrics-refresh:hover { border-color: #4a9eff; color: #4a9eff; }

/* Clarifier questionnaire */
#clarifier-form { background: #111; border: 1px solid #2a2a2a; border-radius: 6px; padding: 10px 12px; margin: 8px 0; }
#clarifier-form .clf-title { font-size: 0.75rem; color: #888; margin-bottom: 8px; }
.clf-question { margin-bottom: 8px; }
.clf-question label { display: block; font-size: 0.78rem; color: #aaa; margin-bottom: 3px; }
.clf-question .clf-hint { font-size: 0.68rem; color: #555; margin-bottom: 3px; }
.clf-question input { width: 100%; background: #0d0d0d; color: #ccc; border: 1px solid #2a2a2a; border-radius: 4px; padding: 5px 8px; font-size: 0.78rem; box-sizing: border-box; }
.clf-question input:focus { border-color: #4a9eff; outline: none; }
#clarifier-submit { font-size: 0.78rem; padding: 5px 14px; background: #1a2a3a; border: 1px solid #4a9eff; color: #4a9eff; border-radius: 4px; cursor: pointer; margin-top: 4px; }
#clarifier-submit:hover { background: #2a3a4a; }

/* Modal */
#modal-overlay {
  display: none; position: fixed; inset: 0; background: rgba(0,0,0,0.7);
  z-index: 100; align-items: center; justify-content: center; padding: 20px;
}
#modal-overlay.open { display: flex; }
#modal {
  background: #1a1a1a; border: 1px solid #2a2a2a; border-radius: 10px;
  width: 100%; max-width: 720px; max-height: 85vh;
  display: flex; flex-direction: column; overflow: hidden;
}
#modal-header { padding: 12px 16px; border-bottom: 1px solid #222; display: flex; align-items: flex-start; gap: 10px; }
#modal-title { font-size: 0.88rem; color: #bbb; flex: 1; line-height: 1.4; }
#modal-close { background: none; border: none; color: #555; cursor: pointer; font-size: 1.2rem; line-height: 1; padding: 0 2px; flex-shrink: 0; transition: color 0.15s; }
#modal-close:hover { color: #999; }
#modal-body { flex: 1; overflow-y: auto; padding: 16px; display: flex; flex-direction: column; gap: 14px; }
.conv-user { align-self: flex-end; max-width: 70%; background: #1e3a5f; padding: 10px 14px; border-radius: 12px 12px 2px 12px; font-size: 0.88rem; line-height: 1.5; word-break: break-word; }
.conv-section { align-self: flex-start; max-width: 90%; }
.conv-section .role-label { font-size: 0.68rem; margin-bottom: 4px; padding-left: 4px; }
.conv-section .role-name { text-transform: uppercase; letter-spacing: 0.08em; }
.conv-section .model-name { margin-left: 6px; color: #3a3a3a; }
.conv-section .context-budget { font-size: 0.63rem; color: #5f6672; margin: 0 0 6px 4px; text-transform: uppercase; letter-spacing: 0.08em; }
.conv-section .context-budget-detail { color: #3d434d; margin-left: 6px; text-transform: none; letter-spacing: 0; }
.conv-section .bubble { background: #1c1c1c; border: 1px solid #2a2a2a; border-left: 3px solid #333; padding: 12px 16px; border-radius: 2px 10px 10px 10px; font-size: 0.85rem; line-height: 1.65; white-space: pre-wrap; word-break: break-word; }
.conv-section.analyst .bubble  { border-left-color: #4a9eff; }
.conv-section.critic .bubble   { border-left-color: #ff5252; }
.conv-section.synthesis .bubble { border-left-color: #4caf50; border-left-width: 4px; }
.conv-section.assistant .bubble { border-left-color: #888; }
.conv-meta { font-size: 0.65rem; color: #2e2e2e; padding-left: 4px; margin-top: 2px; }
.modal-loading { font-size: 0.8rem; color: #444; font-style: italic; align-self: center; padding: 20px; }
#modal-footer { padding: 10px 16px; border-top: 1px solid #1e1e1e; display: flex; align-items: center; gap: 10px; flex-shrink: 0; font-size: 0.78rem; color: #444; }

::-webkit-scrollbar { width: 5px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #2a2a2a; border-radius: 3px; }

/* Login overlay */
#login-overlay {
  display: none; position: fixed; inset: 0;
  background: #141414; z-index: 1000;
  align-items: center; justify-content: center;
}
#login-overlay.open { display: flex; }
#login-box {
  background: #1c1c1c; border: 1px solid #2a2a2a; border-radius: 10px;
  padding: 32px 36px; width: 320px; display: flex; flex-direction: column; gap: 14px;
}
#login-box h2 { font-size: 1rem; font-weight: 600; color: #fff; text-align: center; }
#login-error { font-size: 0.78rem; color: #ff5252; text-align: center; min-height: 1em; }
#login-box input {
  background: #141414; border: 1px solid #2a2a2a; border-radius: 6px;
  color: #d0d0d0; padding: 8px 12px; font-size: 0.85rem; outline: none; width: 100%;
}
#login-box input:focus { border-color: #4a9eff; }
#login-submit {
  background: #1e3a5f; color: #4a9eff; border: 1px solid #2a4a6f;
  border-radius: 6px; padding: 9px; font-size: 0.85rem; cursor: pointer; font-weight: 600;
}
#login-submit:hover { background: #253f66; }
#login-submit:disabled { opacity: 0.5; cursor: default; }

#password-overlay {
  display: none; position: fixed; inset: 0;
  background: rgba(0, 0, 0, 0.7); z-index: 1001;
  align-items: center; justify-content: center; padding: 20px;
}
#password-overlay.open { display: flex; }
#password-box {
  background: #1c1c1c; border: 1px solid #2a2a2a; border-radius: 10px;
  padding: 28px 32px; width: 360px; display: flex; flex-direction: column; gap: 12px;
}
#password-box h2 { font-size: 1rem; font-weight: 600; color: #fff; text-align: center; }
#password-error { font-size: 0.78rem; color: #ff8a80; text-align: center; min-height: 1em; }
#password-box input {
  background: #141414; border: 1px solid #2a2a2a; border-radius: 6px;
  color: #d0d0d0; padding: 8px 12px; font-size: 0.85rem; outline: none; width: 100%;
}
#password-box input:focus { border-color: #4a9eff; }
#password-actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 4px; }
#password-cancel,
#password-submit {
  border-radius: 6px; padding: 9px 14px; font-size: 0.85rem; cursor: pointer;
}
#password-cancel {
  background: transparent; color: #aaa; border: 1px solid #333;
}
#password-submit {
  background: #1e3a5f; color: #4a9eff; border: 1px solid #2a4a6f; font-weight: 600;
}
#password-submit:disabled { opacity: 0.5; cursor: default; }