/* Quiet charcoal settings, based on the compact list-row reference. */
body.dashboard-page #settings {
  --settings-bg: #141414;
  --settings-surface: #202020;
  --settings-hover: #2b2b2b;
  --settings-active: #30283b;
  --settings-line: #383838;
  --settings-muted: #a3a3a8;
  --settings-accent: #a987ef;
}
body.dashboard-page #settings .user-settings-heading { margin-bottom: 20px; }
body.dashboard-page #settings .user-settings-heading .eyebrow { color: var(--settings-accent); }
body.dashboard-page #settings .user-settings-heading .muted { color: #9ca5af; }
body.dashboard-page #settings .settings-account-status,
body.dashboard-page #settings .settings-security-badge { border-color: var(--settings-line); background: var(--settings-surface); color: #b8c4d0; box-shadow: none; }
body.dashboard-page #settings .user-settings-nav {
  gap: 3px; padding: 9px; border: 1px solid var(--settings-line);
  border-radius: 10px; background: var(--settings-bg); box-shadow: none;
}
body.dashboard-page #settings .user-settings-nav button {
  position: relative; grid-template-columns: 24px minmax(0,1fr) 12px;
  gap: 9px; min-height: 52px; padding: 8px 12px; border: 0;
  border-radius: 5px; background: transparent; color: #aab4bf; box-shadow: none;
  transition: background-color .18s ease, color .18s ease;
}
body.dashboard-page #settings .user-settings-nav button::before {
  content: ''; position: absolute; top: 7px; right: 0; width: 4px; height: calc(100% - 14px);
  border-radius: 5px; background: var(--settings-accent); opacity: 0;
}
body.dashboard-page #settings .user-settings-nav button:hover,
body.dashboard-page #settings .user-settings-nav button:focus-visible { border: 0; background: var(--settings-hover); color: #f0f3f6; }
body.dashboard-page #settings .user-settings-nav button.active { border: 0; background: var(--settings-active); color: #fff; box-shadow: none; }
body.dashboard-page #settings .user-settings-nav button:is(.active,:focus-visible)::before { opacity: 1; }
body.dashboard-page #settings .user-settings-nav button:focus-visible { outline: 2px solid var(--settings-accent); outline-offset: 2px; }
body.dashboard-page #settings .user-settings-nav svg { width: 17px; height: 17px; color: #8b949e; }
body.dashboard-page #settings .user-settings-nav button:is(.active,:hover) svg { color: #cdb5ff; }
body.dashboard-page #settings .user-settings-nav strong { font-size: 11px; font-weight: 600; }
body.dashboard-page #settings .user-settings-nav small { color: var(--settings-muted); font-size: 9px; }
body.dashboard-page #settings .user-settings-nav button>i { color: #687684; font-size: 15px; }

body.dashboard-page #settings .settings-content-head,
body.dashboard-page #settings .settings-card,
body.dashboard-page #settings .settings-loading,
body.dashboard-page #settings .settings-error {
  border: 1px solid var(--settings-line); border-radius: 10px;
  background: var(--settings-surface); box-shadow: none;
}
body.dashboard-page #settings .settings-content-head { padding: 20px 22px; }
body.dashboard-page #settings .settings-content-head>div>span { color: var(--settings-accent); }
body.dashboard-page #settings .settings-content-head h2 { margin: 5px 0; font-size: 19px; }
body.dashboard-page #settings .settings-content-head p { color: #a1aab5; font-size: 11px; }
body.dashboard-page #settings .settings-profile-mark { border: 1px solid #594a70; border-radius: 9px; background: #30283b; color: #e7d9ff; box-shadow: none; }
body.dashboard-page #settings .settings-card { padding: 22px; }
body.dashboard-page #settings .settings-card label { color: #c5ccd5; font-size: 11px; }
body.dashboard-page #settings .settings-card :is(input:not([type=checkbox]):not([type=radio]),select,textarea) {
  min-height: 44px; border: 1px solid var(--settings-line); border-radius: 5px;
  background: var(--settings-bg); color: #f0f3f6; font-size: 11px;
}
body.dashboard-page #settings .settings-card :is(input:not([type=checkbox]):not([type=radio]),select,textarea):focus-visible {
  outline: 0; border-color: var(--settings-accent); box-shadow: 0 0 0 3px #a987ef29;
}
body.dashboard-page #settings .settings-card input:disabled { border-style: solid; background: #191919; color: #9ba5af; }
body.dashboard-page #settings .settings-card label>small { color: var(--settings-muted); font-size: 9px; }
body.dashboard-page #settings .settings-meta-row>div {
  min-width: 0; border: 1px solid var(--settings-line); border-radius: 5px;
  background: var(--settings-bg);
}
body.dashboard-page #settings .settings-meta-row span { color: var(--settings-muted); }
body.dashboard-page #settings .settings-meta-row strong { overflow-wrap: anywhere; color: #dce3ea; }
body.dashboard-page #settings .settings-card footer,
body.dashboard-page #settings .settings-subsection+.settings-subsection,
body.dashboard-page #settings .settings-notification-group { border-color: var(--settings-line); }
body.dashboard-page #settings .settings-subsection h3,
body.dashboard-page #settings .settings-notification-group h3 { color: #e4e8ed; }
body.dashboard-page #settings .settings-field-label,
body.dashboard-page #settings .settings-notification-group>p { color: #a8b2bd; }
body.dashboard-page #settings .settings-duration-options label>span {
  border: 1px solid var(--settings-line); border-radius: 5px; background: var(--settings-bg); box-shadow: none;
}
body.dashboard-page #settings .settings-duration-options label { position: relative; }
body.dashboard-page #settings .settings-duration-options input[type=radio] {
  width: 1px!important; height: 1px!important; min-height: 0!important;
  margin: 0!important; padding: 0!important; overflow: hidden;
}
body.dashboard-page #settings .settings-duration-options label:hover>span { background: var(--settings-hover); }
body.dashboard-page #settings .settings-duration-options input:checked+span { border-color: var(--settings-accent); background: var(--settings-active); box-shadow: inset -3px 0 var(--settings-accent); }
body.dashboard-page #settings .settings-duration-options input:focus-visible+span { outline: 2px solid var(--settings-accent); outline-offset: 2px; }
body.dashboard-page #settings .settings-duration-options input:checked+span strong { color: #e7d9ff; }
body.dashboard-page #settings .settings-duration-options small { color: var(--settings-muted); }
body.dashboard-page #settings .settings-switch {
  border: 1px solid var(--settings-line); border-radius: 5px; background: var(--settings-bg);
}
body.dashboard-page #settings .settings-switch:hover { background: var(--settings-hover); }
body.dashboard-page #settings .settings-switch:focus-within { outline: 2px solid var(--settings-accent); outline-offset: 2px; }
body.dashboard-page #settings .settings-switch small { color: var(--settings-muted); }
body.dashboard-page #settings .settings-switch-icon,
body.dashboard-page #settings .settings-switch-icon:is(.project,.credit,.system,.mention,.social) {
  width: 25px; height: 25px; border: 0; border-radius: 0; background: transparent; color: #aebbc9;
}
body.dashboard-page #settings .settings-switch input:checked { background: var(--settings-accent)!important; }
body.dashboard-page #settings .settings-switch input[type=checkbox] { min-height: 23px!important; }
body.dashboard-page #settings .settings-workspace-list>button {
  position: relative; border: 1px solid var(--settings-line); border-radius: 5px;
  background: var(--settings-bg); box-shadow: none;
}
body.dashboard-page #settings .settings-workspace-list>button:hover,
body.dashboard-page #settings .settings-workspace-list>button.active { border-color: #45515e; background: var(--settings-hover); }
body.dashboard-page #settings .settings-workspace-list>button.active { box-shadow: inset -3px 0 var(--settings-accent); }
body.dashboard-page #settings .settings-workspace-list>button:focus-visible { outline: 2px solid var(--settings-accent); outline-offset: 2px; }
body.dashboard-page #settings .workspace-settings-icon,
body.dashboard-page #settings .settings-session-icon,
body.dashboard-page #settings .settings-note>span { border-radius: 5px; background: #29252f; color: #cbb3f6; }
body.dashboard-page #settings .settings-workspace-list small,
body.dashboard-page #settings .settings-sessions-card small { color: var(--settings-muted); }
body.dashboard-page #settings .settings-workspace-list i,
body.dashboard-page #settings .settings-workspace-list .active i { background: transparent; color: #cbb3f6; }
body.dashboard-page #settings .settings-note { border-color: var(--settings-line); border-radius: 5px; background: var(--settings-bg); color: #a6b0bb; }
body.dashboard-page #settings .settings-error button { border-color: #594a70; border-radius: 5px; background: var(--settings-hover); color: #e7d9ff; }
body.dashboard-page #settings .settings-loading>i { border-top-color: var(--settings-accent); }

@media (max-width: 760px) {
  body.dashboard-page #settings .user-settings-mobile-nav { border-color: var(--settings-line); border-radius: 7px; background: var(--settings-bg); box-shadow: none; }
  body.dashboard-page #settings .user-settings-mobile-nav small { color: var(--settings-muted); }
  body.dashboard-page #settings .user-settings-mobile-nav strong { color: #e4e9ef; }
  body.dashboard-page #settings .user-settings-mobile-nav select { border-color: var(--settings-line); border-radius: 5px; background: var(--settings-hover); color: #f0f3f6; }
  body.dashboard-page #settings .user-settings-mobile-nav:focus-within { border-color: var(--settings-accent); box-shadow: 0 0 0 3px #a987ef29; }
  body.dashboard-page #settings .settings-content-head { padding: 16px; }
  body.dashboard-page #settings .settings-card { padding: 15px; }
}
@media (prefers-reduced-motion: reduce) {
  body.dashboard-page #settings .user-settings-nav button { transition: none; }
}