/* Atom — light theme
   All selectors use atom-* owned classes.
   No important declarations.  No Streamlit selectors.  No generated class names.
   Dark theme is a non-goal for the initial FastHTML version.
*/

/* ── Light theme tokens ──────────────────────────────────────────────────── */
:root {
    /* Base surfaces */
    --atom-bg: #ffffff;
    --atom-surface: #f0f2f6;
    --atom-surface-soft: #f8f9fb;
    --atom-surface-hover: #e0e3ea;

    /* Text */
    --atom-text: #0e1117;
    --atom-muted: rgba(0, 0, 0, 0.5);
    --atom-disabled: rgba(0, 0, 0, 0.3);

    /* Borders */
    --atom-border: rgba(0, 0, 0, 0.1);
    --atom-input-border: rgba(0, 0, 0, 0.2);

    /* Brand */
    --atom-primary: #2563eb;
    --atom-primary-hover: #1d4ed8;
    --atom-focus-ring: rgba(37, 99, 235, 0.12);

    /* Semantic */
    --atom-danger: #991b1b;
    --atom-warning: #92400e;
    --atom-success: #166534;

    /* State backgrounds */
    --atom-danger-bg: #fef2f2;
    --atom-danger-border: #fecaca;
    --atom-warning-bg: #fffbeb;
    --atom-warning-border: #fde68a;
    --atom-success-bg: #f0fdf4;
    --atom-success-border: #bbf7d0;
    --atom-info-bg: #eff6ff;
    --atom-info-border: #bfdbfe;
    --atom-info-text: #1e40af;

    /* Shape */
    --atom-radius: 6px;
    --atom-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

/* ── Reset / base ────────────────────────────────────────────────────────── */
*, *::before, *::after {
    box-sizing: border-box;
}

body {
    margin: 0;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    font-size: 1rem;
    line-height: 1.5;
    color: var(--atom-text);
    background: var(--atom-bg);
}

/* ── Layout ──────────────────────────────────────────────────────────────── */
.atom-shell {
    display: flex;
    min-height: 100vh;
}

.atom-sidebar {
    width: 240px;
    flex-shrink: 0;
    background: var(--atom-surface);
    padding: 1.5rem 1rem;
    border-right: 1px solid var(--atom-border);
    position: sticky;
    top: 0;
    height: 100vh;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
}

.atom-main {
    flex: 1;
    padding: 2rem;
    overflow-y: auto;
    max-width: 1100px;
}

/* ── Auth frame (login and other unauthenticated pages) ──────────────────── */
.atom-auth-frame {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
    padding: 2rem;
    background: var(--atom-surface);
}

.atom-auth-frame .atom-card {
    width: 100%;
    max-width: 420px;
}

/* ── Typography ──────────────────────────────────────────────────────────── */
.atom-page-title {
    font-size: 2.0rem;
    font-weight: 600;
    margin: 0 0 0rem 0;
    color: var(--atom-text);
}

.atom-section-title {
    font-size: 1.125rem;
    font-weight: 600;
    margin: 1.5rem 0 1rem 0;
    color: var(--atom-text);
}

.atom-muted {
    color: var(--atom-muted);
    font-size: 0.875rem;
}

.atom-meta {
    color: var(--atom-muted);
    font-size: 0.875rem;
    margin-top: 0.75rem;
}

/* ── Card ────────────────────────────────────────────────────────────────── */
.atom-card {
    background: var(--atom-bg);
    border: 1px solid var(--atom-border);
    border-radius: 8px;
    padding: 1.5rem;
    margin-bottom: 1rem;
    box-shadow: var(--atom-shadow);
}

.atom-card__title {
    margin: 0 0 1rem 0;
    font-size: 1rem;
    font-weight: 600;
    color: var(--atom-text);
}

.atom-card__footer {
    margin-top: 1rem;
    padding-top: 0.75rem;
    border-top: 1px solid var(--atom-border);
}

/* ── Form ────────────────────────────────────────────────────────────────── */
.atom-form {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.atom-field {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    margin-bottom: 1rem;
}

.atom-label {
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--atom-text);
}

.atom-input {
    width: 100%;
    padding: 0.5rem 0.75rem;
    border: 1px solid var(--atom-input-border);
    border-radius: var(--atom-radius);
    font-size: 0.875rem;
    color: var(--atom-text);
    background: var(--atom-bg);
    line-height: 1.4;
}

.atom-input:focus {
    outline: none;
    border-color: var(--atom-primary);
    box-shadow: 0 0 0 2px var(--atom-focus-ring);
}

.atom-textarea {
    width: 100%;
    padding: 0.5rem 0.75rem;
    border: 1px solid var(--atom-input-border);
    border-radius: var(--atom-radius);
    font-size: 0.875rem;
    color: var(--atom-text);
    background: var(--atom-bg);
    line-height: 1.5;
    resize: vertical;
    font-family: inherit;
}

.atom-textarea:focus {
    outline: none;
    border-color: var(--atom-primary);
    box-shadow: 0 0 0 2px var(--atom-focus-ring);
}

/* ── Buttons ─────────────────────────────────────────────────────────────── */
.atom-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.5rem 1rem;
    border-radius: var(--atom-radius);
    border: 1px solid var(--atom-border);
    cursor: pointer;
    font-size: 0.875rem;
    font-weight: 500;
    line-height: 1.4;
    text-decoration: none;
    background: var(--atom-surface);
    color: var(--atom-text);
    transition: background 0.1s, border-color 0.1s;
    margin-top: 0.5rem;
}

.atom-button--primary {
    background: var(--atom-primary);
    border-color: var(--atom-primary);
    color: #ffffff;
}

.atom-button--primary:hover {
    background: var(--atom-primary-hover);
    border-color: var(--atom-primary-hover);
}

.atom-button--secondary {
    background: var(--atom-surface);
    border-color: var(--atom-border);
    color: var(--atom-text);
}

.atom-button--secondary:hover {
    background: var(--atom-surface-hover);
    border-color: var(--atom-input-border);
}

.atom-button--danger {
    background: var(--atom-danger-bg);
    border-color: var(--atom-danger-border);
    color: var(--atom-danger);
}

.atom-button--danger:hover {
    background: #fee2e2;
    border-color: #fca5a5;
}

/* ── Ask button thinking/loading state ──────────────────────────────────── */
.atom-button--thinking {
    position: relative;
    isolation: isolate;
    cursor: not-allowed;
    pointer-events: none;
}

.atom-button--thinking::before,
.atom-button--thinking::after {
    content: "";
    position: absolute;
    inset: -3px;
    border-radius: calc(var(--atom-radius) + 4px);
    background: conic-gradient(
        from var(--atom-glow-angle),
        #ff0055, #7a00ff, #00c2ff, #00ff77, #ffff00, #ff0055
    );
    z-index: -1;
    animation: atom-ask-spin 2s linear infinite;
}

.atom-button--thinking::after {
    inset: -6px;
    filter: blur(8px);
    opacity: 0.55;
}

@media (prefers-reduced-motion: reduce) {
    .atom-button--thinking::before,
    .atom-button--thinking::after { animation: none; }
}

/* ── Disabled button state ─────────────────────────────────────────────── */
.atom-button:disabled,
.atom-button[aria-disabled="true"] {
    cursor: not-allowed;
    opacity: 0.5;
    color: var(--atom-disabled);
    background: var(--atom-surface);
    border-color: var(--atom-border);
    pointer-events: none;
}
.atom-button--primary:disabled,
.atom-button--primary[aria-disabled="true"] {
    background: var(--atom-surface);
    border-color: var(--atom-border);
    color: var(--atom-disabled);
}
.atom-button:disabled:hover,
.atom-button[aria-disabled="true"]:hover,
.atom-button--primary:disabled:hover,
.atom-button--primary[aria-disabled="true"]:hover,
.atom-button--secondary:disabled:hover,
.atom-button--secondary[aria-disabled="true"]:hover {
    background: var(--atom-surface);
    border-color: var(--atom-border);
    color: var(--atom-disabled);
}

/* ── Working button state ────────────────────────────────────────────────── */
.atom-button--working {
    cursor: not-allowed;
    opacity: 0.7;
    color: var(--atom-disabled);
    background: var(--atom-surface);
    border-color: var(--atom-border);
    pointer-events: none;
    position: relative;
}
.atom-button--working::after {
    content: '';
    display: inline-block;
    width: 0.6em;
    height: 0.6em;
    margin-left: 0.45em;
    border: 2px solid var(--atom-disabled);
    border-top-color: transparent;
    border-radius: 50%;
    animation: atom-spin 0.7s linear infinite;
    vertical-align: middle;
}
@keyframes atom-spin {
    to { transform: rotate(360deg); }
}
@media (prefers-reduced-motion: reduce) {
    .atom-button--working::after {
        animation: none;
    }
}

/* ── Alerts ──────────────────────────────────────────────────────────────── */
.atom-alert {
    padding: 0.75rem 1rem;
    border-radius: var(--atom-radius);
    font-size: 0.875rem;
    margin-bottom: 1rem;
    border: 1px solid transparent;
}

.atom-alert--info {
    background: var(--atom-info-bg);
    border-color: var(--atom-info-border);
    color: var(--atom-info-text);
}

.atom-alert--success {
    background: var(--atom-success-bg);
    border-color: var(--atom-success-border);
    color: var(--atom-success);
}

.atom-alert--warning {
    background: var(--atom-warning-bg);
    border-color: var(--atom-warning-border);
    color: var(--atom-warning);
}

.atom-alert--error {
    background: var(--atom-danger-bg);
    border-color: var(--atom-danger-border);
    color: var(--atom-danger);
}

/* ── Badges ──────────────────────────────────────────────────────────────── */
.atom-badge {
    display: inline-flex;
    align-items: center;
    padding: 0.125rem 0.5rem;
    border-radius: 9999px;
    font-size: 0.75rem;
    font-weight: 500;
    border: 1px solid transparent;
}

.atom-badge--default {
    background: var(--atom-surface);
    border-color: var(--atom-border);
    color: var(--atom-text);
}

.atom-badge--success {
    background: var(--atom-success-bg);
    border-color: var(--atom-success-border);
    color: var(--atom-success);
}

.atom-badge--warning {
    background: var(--atom-warning-bg);
    border-color: var(--atom-warning-border);
    color: var(--atom-warning);
}

.atom-badge--error {
    background: var(--atom-danger-bg);
    border-color: var(--atom-danger-border);
    color: var(--atom-danger);
}

.atom-badge--running {
    background: var(--atom-info-bg);
    border-color: var(--atom-info-border);
    color: var(--atom-info-text);
}

/* ── Platform Query History table — failed-row emphasis ────────────────────── */
.atom-qh__question--failed { color: var(--atom-danger); }
.atom-qh__error--failed    { color: var(--atom-danger); }

/* ── Sidebar nav ─────────────────────────────────────────────────────────── */
.atom-sidebar__brand {
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--atom-text);
    margin-bottom: 2rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--atom-border);
}

.atom-nav {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    flex: 1;
}

.atom-nav__link {
    display: block;
    padding: 0.5rem 0.75rem;
    border-radius: var(--atom-radius);
    text-decoration: none;
    color: var(--atom-text);
    font-size: 0.875rem;
    font-weight: 500;
}

.atom-nav__link:hover {
    background: rgba(0, 0, 0, 0.05);
}

.atom-nav__link--active {
    background: var(--atom-surface-hover);
    color: var(--atom-primary);
    font-weight: 600;
}

.atom-nav__link--active:hover {
    background: var(--atom-surface-hover);
}

html[data-theme="dark"] .atom-nav__link--active {
    background: rgba(255, 255, 255, 0.08);
    color: var(--atom-primary);
}

.atom-sidebar__footer {
    margin-top: auto;
    padding-top: 1rem;
    border-top: 1px solid var(--atom-border);
}

.atom-sidebar__user {
    margin-bottom: 0.5rem;
}

.atom-sidebar__platform-banner {
    background: var(--atom-info-bg);
    border: 1px solid var(--atom-info-border);
    border-radius: var(--atom-radius);
    padding: 0.5rem 0.75rem;
    margin-bottom: 1rem;
    font-size: 0.8125rem;
}

.atom-sidebar__platform-banner .atom-button {
    margin-top: 0.5rem;
    width: 100%;
}

/* ── Dashboard / workspace grid ──────────────────────────────────────────── */
.atom-workspace-list {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 1rem;
    margin-bottom: 1rem;
}

.atom-workspace-list .atom-card {
    margin-bottom: 0;
}

.atom-account-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

/* ── Links ───────────────────────────────────────────────────────────────── */
.atom-link {
    color: var(--atom-primary);
    text-decoration: none;
    font-size: 0.875rem;
    display: inline-block;
    margin-top: 0.75rem;
}

.atom-link:hover {
    text-decoration: underline;
}

.atom-link--account {
    font-size: 1rem;
    font-weight: 500;
    margin-top: 0;
}

/* ── Workspace page ──────────────────────────────────────────────────────── */
.atom-workspace-header {
    margin-bottom: 0.5rem;
}

.atom-workspace-meta {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 1rem;
}

.atom-workspace-page {
    display: flex;
    flex-direction: column;
}

/* ── Tab navigation ──────────────────────────────────────────────────────── */
.atom-tabs {
    display: flex;
    gap: 0;
    border-bottom: 2px solid var(--atom-border);
    margin-bottom: 1.5rem;
}

.atom-tabs__link {
    padding: 0.5rem 1rem;
    text-decoration: none;
    color: var(--atom-muted);
    font-size: 0.875rem;
    font-weight: 500;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
}

.atom-tabs__link:hover {
    color: var(--atom-text);
}

.atom-tabs__link--active {
    color: var(--atom-primary);
    border-bottom-color: var(--atom-primary);
}

.atom-tabs__link--disabled {
    color: var(--atom-disabled);
    cursor: default;
    pointer-events: none;
}

/* ── Documents table ─────────────────────────────────────────────────────── */
.atom-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.875rem;
}

.atom-table__header {
    text-align: left;
    padding: 0.5rem 0.75rem;
    font-weight: 600;
    color: var(--atom-muted);
    border-bottom: 2px solid var(--atom-border);
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    background: var(--atom-surface);
}

.atom-table__cell {
    padding: 0.625rem 0.75rem;
    border-bottom: 1px solid var(--atom-border);
    color: var(--atom-text);
    vertical-align: top;
}

/* ── Empty state ─────────────────────────────────────────────────────────── */
.atom-empty-state {
    padding: 2rem;
    text-align: center;
    color: var(--atom-muted);
    font-size: 0.875rem;
}

/* ── Ask form ────────────────────────────────────────────────────────────── */
.atom-question-form {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

@property --atom-glow-angle {
  syntax: "<angle>";
  initial-value: 0deg;
  inherits: false;
}

.atom-ask-glow {
  position: relative;
  border-radius: 14px;
  padding: 2px;
  isolation: isolate;
}

.atom-ask-glow::before,
.atom-ask-glow::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 16px;
  background: conic-gradient(
    from var(--atom-glow-angle),
    #ff0055,
    #7a00ff,
    #00c2ff,
    #00ff77,
    #ffff00,
    #ff0055
  );
  opacity: 0;
  pointer-events: none;
  z-index: 0;
}

.atom-ask-glow::after {
  filter: blur(14px);
}

.atom-ask-glow--intro::before {
  animation:
    atom-ask-spin 1.8s ease-out 1,
    atom-ask-ring-fade 1.8s ease-out 1;
}

.atom-ask-glow--intro::after {
  animation:
    atom-ask-spin 1.8s ease-out 1,
    atom-ask-glow-fade 1.8s ease-out 1;
}

.atom-ask-glow:focus-within::before {
  opacity: 0.55;
  animation: atom-ask-spin 5s linear infinite;
}

.atom-ask-glow:focus-within::after {
  opacity: 0.25;
  animation: atom-ask-spin 5s linear infinite;
}

.atom-ask-glow > .atom-textarea {
  position: relative;
  z-index: 1;
  display: block;
  width: 100%;
  border-radius: 12px;
}

@keyframes atom-ask-spin {
  from {
    --atom-glow-angle: 0deg;
  }
  to {
    --atom-glow-angle: 360deg;
  }
}

@keyframes atom-ask-ring-fade {
  0% { opacity: 0; }
  15% { opacity: 0.75; }
  75% { opacity: 0.55; }
  100% { opacity: 0; }
}

@keyframes atom-ask-glow-fade {
  0% { opacity: 0; }
  15% { opacity: 0.35; }
  75% { opacity: 0.22; }
  100% { opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
  .atom-ask-glow--intro::before,
  .atom-ask-glow--intro::after,
  .atom-ask-glow:focus-within::before,
  .atom-ask-glow:focus-within::after {
    animation: none;
  }
}

/* ── Answer panel ────────────────────────────────────────────────────────── */
.atom-answer {
    margin-top: 1.5rem;
    padding: 1.25rem 1.25rem 1.25rem 1.5rem;
    border-left: 3px solid var(--atom-primary);
    background: var(--atom-surface-soft);
    border-radius: 0 var(--atom-radius) var(--atom-radius) 0;
}

.atom-answer__question {
    font-size: 0.875rem;
    color: var(--atom-muted);
    margin-bottom: 0.75rem;
}

.atom-answer__body {
    font-size: 0.9375rem;
    line-height: 1.6;
    color: var(--atom-text);
    white-space: pre-wrap;
}

/* ── Markdown rendered answers ───────────────────────────────────────────── */

.atom-markdown { white-space: normal; }

/* ── Feedback form ───────────────────────────────────────────────────────── */

.atom-feedback-prompt { font-size: 0.875rem; font-weight: 500; color: var(--atom-text); margin: 0.5rem 0 0.25rem; }
.atom-feedback-helper { font-size: 0.8125rem; color: var(--atom-muted); margin: 0.25rem 0 0.5rem; }

.atom-markdown p { margin: 0 0 0.6rem; }
.atom-markdown p:last-child { margin-bottom: 0; }

.atom-markdown h1,
.atom-markdown h2,
.atom-markdown h3,
.atom-markdown h4 {
    font-weight: 600;
    line-height: 1.3;
    margin: 1rem 0 0.35rem;
    color: var(--atom-text);
}
.atom-markdown h1 { font-size: 1.125rem; }
.atom-markdown h2 { font-size: 1rem; }
.atom-markdown h3 { font-size: 0.9375rem; }
.atom-markdown h4 { font-size: 0.875rem; }

.atom-markdown ul,
.atom-markdown ol { margin: 0.4rem 0 0.6rem 1.5rem; padding: 0; }
.atom-markdown li { margin-bottom: 0.2rem; }

.atom-markdown blockquote {
    margin: 0.6rem 0;
    padding: 0.4rem 0.75rem;
    border-left: 3px solid var(--atom-border);
    color: var(--atom-muted);
    font-style: italic;
}

.atom-markdown code {
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 0.85em;
    background: var(--atom-surface-alt, rgba(0,0,0,0.06));
    padding: 0.1em 0.35em;
    border-radius: 3px;
}

.atom-markdown pre {
    background: var(--atom-surface-alt, rgba(0,0,0,0.06));
    border: 1px solid var(--atom-border);
    border-radius: var(--atom-radius);
    padding: 0.75rem 1rem;
    overflow-x: auto;
    margin: 0.6rem 0;
}
.atom-markdown pre code {
    background: none;
    padding: 0;
    font-size: 0.8125rem;
}

.atom-markdown table {
    border-collapse: collapse;
    width: 100%;
    overflow-x: auto;
    display: block;
    margin: 0.6rem 0;
    font-size: 0.875rem;
}
.atom-markdown th,
.atom-markdown td {
    border: 1px solid var(--atom-border);
    padding: 0.35rem 0.65rem;
    text-align: left;
}
.atom-markdown th { background: var(--atom-surface-soft); font-weight: 600; }

.atom-markdown a { color: var(--atom-primary); text-decoration: underline; }
.atom-markdown a:hover { opacity: 0.8; }

.atom-markdown hr {
    border: none;
    border-top: 1px solid var(--atom-border);
    margin: 0.75rem 0;
}

/* Compact variant for query history (smaller font already set by parent) */
.atom-query-history__answer.atom-markdown { font-size: inherit; }
.atom-query-history__answer.atom-markdown p { margin-bottom: 0.35rem; }
.atom-query-history__answer.atom-markdown h1,
.atom-query-history__answer.atom-markdown h2,
.atom-query-history__answer.atom-markdown h3 { font-size: 0.875rem; margin: 0.4rem 0 0.2rem; }

/* ── Developer Console ───────────────────────────────────────────────────── */

/* Horizontal divider */
.atom-divider {
    border: none;
    border-top: 1px solid var(--atom-border);
    margin: 1.75rem 0;
}

.atom-divider--light {
    margin: 1rem 0;
    border-top-color: var(--atom-surface);
}

/* Build identity line */
.atom-build-identity {
    font-family: monospace;
    font-size: 0.8125rem;
}

/* Code / pre blocks */
.atom-pre {
    background: var(--atom-surface);
    border: 1px solid var(--atom-border);
    border-radius: var(--atom-radius);
    padding: 0.75rem 1rem;
    overflow-x: auto;
    margin: 0.75rem 0;
}

.atom-code {
    font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
    font-size: 0.8125rem;
    color: var(--atom-text);
    white-space: pre;
}

/* Select */
.atom-select {
    width: 100%;
    padding: 0.5rem 0.75rem;
    border: 1px solid var(--atom-input-border);
    border-radius: var(--atom-radius);
    font-size: 0.875rem;
    color: var(--atom-text);
    background: var(--atom-bg);
    line-height: 1.4;
    appearance: auto;
}

.atom-select:focus {
    outline: none;
    border-color: var(--atom-primary);
    box-shadow: 0 0 0 2px var(--atom-focus-ring);
}

/* Checkbox row */
.atom-checkbox-row {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
}

.atom-checkbox {
    width: 1rem;
    height: 1rem;
    flex-shrink: 0;
    accent-color: var(--atom-primary);
}

.atom-checkbox-label {
    font-size: 0.875rem;
    color: var(--atom-text);
}

/* Two-column provision form grid */
.atom-form-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
    margin-bottom: 1rem;
}

.atom-form-col {
    display: flex;
    flex-direction: column;
}

@media (max-width: 700px) {
    .atom-form-grid {
        grid-template-columns: 1fr;
    }
}

/* Subsection title (H3) */
.atom-subsection-title {
    font-size: 1rem;
    font-weight: 600;
    margin: 1rem 0 0.5rem 0;
    color: var(--atom-text);
}

/* API key row */
.atom-key-row {
    display: flex;
    align-items: flex-start;
    gap: 1.5rem;
    padding: 0.75rem;
    background: var(--atom-surface);
    border: 1px solid var(--atom-border);
    border-radius: var(--atom-radius);
    margin: 0.75rem 0;
}

.atom-key-meta {
    flex: 2;
}

.atom-key-date {
    flex: 1;
}

.atom-key-action {
    flex-shrink: 0;
}

/* Deployment metrics */
.atom-metric-row {
    display: flex;
    gap: 1.5rem;
    margin: 0.75rem 0;
    flex-wrap: wrap;
}

.atom-metric {
    background: var(--atom-surface);
    border: 1px solid var(--atom-border);
    border-radius: var(--atom-radius);
    padding: 0.75rem 1rem;
    min-width: 140px;
}

.atom-metric__label {
    margin: 0 0 0.25rem 0;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.atom-metric__value {
    margin: 0;
    font-size: 1.125rem;
    font-weight: 600;
    color: var(--atom-text);
}

.atom-dep-status {
    margin: 0.75rem 0;
}

.atom-dep-job {
    margin-top: 0.75rem;
}

/* Details / expander */
.atom-details {
    border: 1px solid var(--atom-border);
    border-radius: var(--atom-radius);
    margin: 0.75rem 0;
}

.atom-details__summary {
    padding: 0.625rem 0.875rem;
    font-size: 0.875rem;
    font-weight: 500;
    cursor: pointer;
    color: var(--atom-text);
    list-style: none;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.atom-details__summary::before {
    content: "▶";
    font-size: 0.625rem;
    color: var(--atom-muted);
    transition: transform 0.15s;
}

.atom-details[open] > .atom-details__summary::before {
    transform: rotate(90deg);
}

.atom-details__body {
    padding: 0.875rem;
    border-top: 1px solid var(--atom-border);
}

/* Tenant account cards */
.atom-account-card {
    margin-bottom: 0.75rem;
}

.atom-account-row {
    display: grid;
    grid-template-columns: 3fr 2fr 2fr 1fr;
    gap: 1rem;
    align-items: center;
}

@media (max-width: 800px) {
    .atom-account-row {
        grid-template-columns: 1fr;
    }
}

.atom-account-name-row {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.25rem;
}

.atom-account-name {
    font-weight: 600;
    color: var(--atom-text);
}

.atom-account-badge {
    flex-shrink: 0;
}

.atom-account-action {
    text-align: right;
}

.atom-account-action .atom-button {
    margin-top: 0;
    white-space: nowrap;
}

/* ── Source list ─────────────────────────────────────────────────────────── */
.atom-source-list__heading {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--atom-muted);
    margin: 1.25rem 0 0.5rem 0;
}

.atom-source-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.atom-source-list__item {
    padding: 0.75rem;
    background: var(--atom-surface-soft);
    border: 1px solid var(--atom-border);
    border-radius: var(--atom-radius);
    font-size: 0.8125rem;
}

.atom-source-list__label {
    font-weight: 600;
    color: var(--atom-text);
    margin-bottom: 0.25rem;
}

.atom-source-list__text {
    color: var(--atom-muted);
    line-height: 1.5;
}

/* ── Dark theme ──────────────────────────────────────────────────────────── */

html[data-theme="dark"] {
    --atom-bg: #0e1117;
    --atom-surface: #1a1c24;
    --atom-surface-soft: #22262f;
    --atom-surface-hover: #2d3340;
    --atom-text: #ffffff;
    --atom-muted: rgba(255, 255, 255, 0.55);
    --atom-disabled: rgba(255, 255, 255, 0.3);
    --atom-border: rgba(255, 255, 255, 0.1);
    --atom-input-border: rgba(255, 255, 255, 0.2);
    --atom-primary: #2563eb;
    --atom-primary-hover: #1d4ed8;
    --atom-focus-ring: rgba(122, 184, 245, 0.25);
    --atom-shadow: 0 1px 3px rgba(0, 0, 0, 0.5);

    --atom-danger: #fca5a5;
    --atom-warning: #fcd34d;
    --atom-success: #86efac;

    --atom-danger-bg: rgba(252, 165, 165, 0.1);
    --atom-danger-border: rgba(252, 165, 165, 0.3);
    --atom-warning-bg: rgba(252, 211, 77, 0.1);
    --atom-warning-border: rgba(252, 211, 77, 0.3);
    --atom-success-bg: rgba(134, 239, 172, 0.1);
    --atom-success-border: rgba(134, 239, 172, 0.3);
    --atom-info-bg: rgba(122, 184, 245, 0.1);
    --atom-info-border: rgba(122, 184, 245, 0.3);
    --atom-info-text: #7ab8f5;
}

html[data-theme="dark"] .atom-sidebar__logo {
    content: url('/static/logo_sidebar_green.png');
}

/* ── Sidebar branding ────────────────────────────────────────────────────── */

.atom-sidebar__brand {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--atom-text);
    margin-bottom: 0.5rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--atom-border);
}

.atom-sidebar__logo {
    width: 28px;
    height: 28px;
    flex-shrink: 0;
}

.atom-sidebar__wordmark {
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--atom-text);
}

.atom-sidebar__account-name {
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--atom-text);
    padding: 0.25rem 0 0.75rem 0;
    border-bottom: 1px solid var(--atom-border);
    margin-bottom: 0.5rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Theme toggle */
.atom-theme-toggle {
    width: 100%;
    margin-top: 0.5rem;
    text-align: left;
}

/* ── Sidebar platform banner (improved) ──────────────────────────────────── */

.atom-sidebar__platform-banner-title {
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--atom-info-text);
    margin: 0 0 0.25rem 0;
}

/* ── Workspace card parity ───────────────────────────────────────────────── */

.atom-workspace-list {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    margin-top: 0;
}

.atom-ws-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.25rem;
    margin-bottom: 0;
}

.atom-ws-card__info {
    flex: 1;
    min-width: 0;
}

.atom-ws-card__title-row {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.25rem;
}

.atom-ws-card__name {
    font-size: 1.0625rem;
    font-weight: 600;
    color: var(--atom-text);
}

.atom-ws-card__desc {
    margin: 0 0 0.25rem 0;
    font-size: 0.875rem;
}

.atom-ws-card__meta {
    margin: 0;
    font-size: 0.8125rem;
}

.atom-ws-card__actions {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    flex-shrink: 0;
    align-items: stretch;
    min-width: 100px;
}

.atom-ws-card__btn {
    margin-top: 0;
    text-align: center;
    white-space: nowrap;
}

/* Workspace header row */
.atom-ws-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 0.75rem;
}

.atom-ws-section-title {
    margin: 0;
}

.atom-ws-new-form {
    margin: 0;
}

.atom-ws-new-form .atom-button {
    margin-top: 0;
}

/* ── Status dots (workspace title + corpus strip) ────────────────────────── */

.atom-status-dot {
    width: 25px;
    height: 25px;
    border-radius: 50%;
    flex-shrink: 0;
    display: inline-block;
}

.atom-status-dot--green  { background: #22c55e; }
.atom-status-dot--yellow { background: #f59e0b; }
.atom-status-dot--red    { background: #ef4444; }
.atom-status-dot--grey   { background: var(--atom-disabled); }

/* ── Status icons (document rows + job cards) ────────────────────────────── */

.atom-status-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    font-size: 11px;
    font-weight: 700;
    flex-shrink: 0;
    line-height: 1;
}

.atom-status-icon--indexed  { background: #dcfce7; color: #15803d; }
.atom-status-icon--error    { background: #fee2e2; color: #b91c1c; }
.atom-status-icon--indexing { background: #fef3c7; color: #b45309; }
.atom-status-icon--pending  { background: var(--atom-surface-soft); color: var(--atom-muted); }

html[data-theme="dark"] .atom-status-icon--indexed  { background: rgba(34, 197, 94, 0.15);  color: #86efac; }
html[data-theme="dark"] .atom-status-icon--error    { background: rgba(239, 68, 68, 0.15);  color: #fca5a5; }
html[data-theme="dark"] .atom-status-icon--indexing { background: rgba(245, 158, 11, 0.15); color: #fcd34d; }

/* ── File icon (mini document shape beside filenames) ────────────────────── */

.atom-file-icon {
    display: inline-block;
    width: 13px;
    height: 17px;
    border: 1.5px solid var(--atom-muted);
    border-radius: 1px 3px 3px 1px;
    position: relative;
    flex-shrink: 0;
}

.atom-file-icon::after {
    content: '';
    position: absolute;
    top: -1px;
    right: -1px;
    width: 4px;
    height: 4px;
    background: var(--atom-surface);
    border-left: 1.5px solid var(--atom-muted);
    border-bottom: 1.5px solid var(--atom-muted);
}

html[data-theme="dark"] .atom-file-icon::after {
    background: var(--atom-surface-soft);
}

/* ── Workspace settings table ────────────────────────────────────────────── */

.atom-settings__table {
    max-width: 40rem;
}

.atom-settings__label {
    width: 10rem;
    font-weight: 500;
    white-space: nowrap;
}

/* ── Workspace back link ─────────────────────────────────────────────────── */
.atom-back-link {
    display: inline-block;
    color: var(--atom-muted);
    text-decoration: none;
    font-size: 0.875rem;
    margin-bottom: 0.5rem;
}
.atom-back-link:hover { color: var(--atom-text); }

/* ── Workspace title row ─────────────────────────────────────────────────── */
.atom-ws-title-row {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.25rem;
}

/* ── Role caption ────────────────────────────────────────────────────────── */
.atom-role-caption {
    font-size: 0.8125rem;
    color: var(--atom-muted);
    margin-bottom: 0.75rem;
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

.atom-role-badge {
    display: inline-block;
    padding: 0.125rem 0.5rem;
    border-radius: 9999px;
    background: var(--atom-info-bg);
    color: var(--atom-info-text);
    border: 1px solid var(--atom-info-border);
    font-size: 0.75rem;
    font-weight: 500;
    line-height: 1.4;
}

/* ── Corpus stats strip ──────────────────────────────────────────────────── */
.atom-corpus-stats {
    display: flex;
    gap: 12.5rem;
    padding: 1rem 0;
    border-top: 1px solid var(--atom-border);
    border-bottom: 1px solid var(--atom-border);
    margin-bottom: 1.25rem;
    flex-wrap: wrap;
}

.atom-stat {
    display: flex;
    flex-direction: column-reverse;
    gap: 0.25rem;
    min-width: 5rem;
}

.atom-stat__value {
    font-size: 1.5rem;
    font-weight: 400;
    color: var(--atom-text);
    line-height: 1.1;
}

.atom-stat__label-row {
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

.atom-stat__label {
    font-size: 0.8125rem;
    color: var(--atom-muted);
    font-weight: 400;
}

.atom-stat__info {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 15px;
    height: 15px;
    border-radius: 50%;
    background: var(--atom-surface-hover);
    color: var(--atom-muted);
    font-size: 0.625rem;
    font-weight: 700;
    cursor: help;
    flex-shrink: 0;
    border: 1px solid var(--atom-border);
    position: relative;
}
.atom-stat__info::after {
    content: attr(data-tooltip);
    position: absolute;
    bottom: calc(100% + 8px);
    left: 50%;
    transform: translateX(-50%);
    width: max-content;
    max-width: 220px;
    white-space: normal;
    text-align: center;
    background: var(--atom-text);
    color: var(--atom-surface);
    font-size: 0.7rem;
    font-weight: 400;
    line-height: 1.5;
    padding: 0.4rem 0.6rem;
    border-radius: var(--atom-radius);
    box-shadow: var(--atom-shadow);
    pointer-events: none;
    opacity: 0;
    transition: opacity 0.12s ease;
    z-index: 200;
}
.atom-stat__info:hover::after {
    opacity: 1;
}

.atom-stat--error .atom-stat__value { color: var(--atom-danger); }

/* ── Document row ────────────────────────────────────────────────────────── */
.atom-doc-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.625rem;
    padding: 0.75rem;
    border: 1px solid var(--atom-border);
    border-radius: var(--atom-radius);
    margin-bottom: 0.5rem;
}
.atom-doc-row__info { flex: 1; min-width: 0; }
.atom-doc-row__filename { font-weight: 500; }
.atom-doc-row__meta { font-size: 0.875rem; color: var(--atom-muted); margin: 0; }
.atom-doc-row__error { font-size: 0.875rem; color: var(--atom-danger); margin-top: 0.25rem; display: flex; align-items: baseline; gap: 0.25rem; }
.atom-doc-row__error-icon { color: var(--atom-danger); }
.atom-doc-row__actions { display: flex; gap: 0.5rem; align-items: center; flex-shrink: 0; }

/* ── Sources grouped by document ─────────────────────────────────────────── */
.atom-sources { margin-top: 1rem; }
.atom-sources-doc { margin-bottom: 1rem; padding-left: 0.75rem; border-left: 2px solid var(--atom-border); }
.atom-sources-doc__title { font-size: 0.875rem; font-weight: 600; margin-bottom: 0.5rem; }
.atom-sources-doc__text { font-size: 0.875rem; color: var(--atom-muted); }

/* ── Technical details ───────────────────────────────────────────────────── */
.atom-technical-details {
    margin-top: 1rem;
    border: 1px solid var(--atom-border);
    border-radius: var(--atom-radius);
    padding: 0;
}
.atom-technical-details__summary {
    padding: 0.5rem 0.75rem;
    cursor: pointer;
    font-size: 0.875rem;
    font-weight: 500;
    list-style: none;
    user-select: none;
}
.atom-technical-details__body { padding: 0.75rem; }
.atom-technical-notice { background: var(--atom-info-bg, rgba(122,184,245,0.1)); border: 1px solid var(--atom-info-border, rgba(122,184,245,0.3)); border-radius: var(--atom-radius); padding: 0.5rem 0.75rem; margin-bottom: 0.75rem; font-size: 0.8125rem; }
.atom-technical-notice p { margin: 0.15rem 0; }

/* ── Query history ───────────────────────────────────────────────────────── */
.atom-query-history { display: flex; flex-direction: column; gap: 1rem; }
.atom-query-history__item { padding: 0.75rem; background: var(--atom-surface-soft); border-radius: var(--atom-radius); }
.atom-query-history__header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 0.25rem; }
.atom-query-history__timestamp { font-size: 0.75rem; color: var(--atom-muted); margin: 0; }
.atom-query-history__question { display: block; margin-bottom: 0.25rem; }
.atom-query-history__answer { font-size: 0.875rem; color: var(--atom-text); }
.atom-query-history__sources { font-size: 0.8125rem; color: var(--atom-muted); margin-top: 0.25rem; }
.atom-tier-pill { display: inline-block; font-size: 0.6875rem; font-weight: 600; padding: 0.125rem 0.625rem; border-radius: 9999px; letter-spacing: 0.02em; }
.atom-tier-pill--iron   { background: #e5e7eb; color: #374151; }
.atom-tier-pill--silver { background: #dbeafe; color: #1d4ed8; }
.atom-tier-pill--gold   { background: #fef3c7; color: #92400e; }
html[data-theme="dark"] .atom-tier-pill--iron   { background: rgba(255,255,255,0.10); color: #d1d5db; }
html[data-theme="dark"] .atom-tier-pill--silver { background: rgba(37,99,235,0.20);   color: #93c5fd; }
html[data-theme="dark"] .atom-tier-pill--gold   { background: rgba(180,130,20,0.22);  color: #fcd34d; }

/* ── Workspace focus bar (inline below title) ────────────────────────────── */
.atom-focus-bar { margin: 0.375rem 0 0.875rem; }
.atom-focus-bar--empty { color: var(--atom-muted); font-size: 0.875rem; }
.atom-focus-bar__line { display: flex; align-items: center; gap: 0.625rem; flex-wrap: wrap; }
.atom-focus-bar__label { font-size: 0.8125rem; color: var(--atom-muted); font-weight: 500; letter-spacing: 0.02em; text-transform: uppercase; }
.atom-focus-bar__primary { font-style: italic; font-size: 0.9375rem; color: var(--atom-text); letter-spacing: 0.01em; }
.atom-focus-bar__badge { display: inline-block; font-size: 0.75rem; font-weight: 500; padding: 0.125rem 0.5rem; border-radius: 999px; }
.atom-focus-bar__badge--weak     { background: var(--atom-warning-bg); color: var(--atom-warning); }
.atom-focus-bar__badge--moderate { background: var(--atom-info-bg); color: var(--atom-info-text); }
.atom-focus-bar__badge--strong   { background: var(--atom-success-bg); color: var(--atom-success); }
.atom-focus-bar__details { margin-top: 0.5rem; }
.atom-focus-bar__desc { margin: 0 0 0.5rem; font-size: 0.875rem; }

/* ── Expertise profile (full expertise page) ─────────────────────────────── */
.atom-expertise-strength { display: inline-block; padding: 0.25rem 0.75rem; border-radius: 999px; font-size: 0.875rem; font-weight: 500; }
.atom-expertise-strength--weak { background: var(--atom-warning-bg); color: var(--atom-warning); }
.atom-expertise-strength--moderate { background: var(--atom-info-bg); color: var(--atom-info-text); }
.atom-expertise-strength--strong { background: var(--atom-success-bg); color: var(--atom-success); }
.atom-expertise-topics { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin: 0.75rem 0; }
.atom-expertise-atom { padding: 0.5rem; border-left: 2px solid var(--atom-border); margin-bottom: 0.5rem; }
.atom-expertise-atom__sim { font-size: 0.75rem; color: var(--atom-muted); }

/* ── Ingestion messages ──────────────────────────────────────────────────── */
.atom-ingest-messages { display: flex; flex-direction: column; gap: 0.375rem; margin-bottom: 0.75rem; }

/* ── Upload drop zone ────────────────────────────────────────────────────── */

/* ── Upload area (chip-based file picker) ────────────────────────────────── */

.atom-upload-hidden { display: none; }

.atom-upload-area {
    border: 1px solid var(--atom-border);
    border-radius: var(--atom-radius);
    padding: 0.75rem;
    margin-bottom: 0.75rem;
}

.atom-upload-area__hint {
    font-size: 0.8125rem;
    color: var(--atom-muted);
    margin: 0 0 0.625rem;
}

.atom-upload-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    align-items: flex-start;
}

/* individual file chip */
.atom-upload-chip {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    border: 1px solid var(--atom-border);
    border-radius: 6px;
    padding: 0.5rem;
    background: var(--atom-bg);
    width: 150px;
}

/* add-more button */
.atom-upload-chip--add {
    width: 52px;
    height: 68px;
    justify-content: center;
    cursor: pointer;
    border-style: dashed;
}

.atom-upload-chip--add:hover {
    border-color: var(--atom-primary);
    background: var(--atom-info-bg);
}

.atom-upload-chip__plus {
    font-size: 1.625rem;
    font-weight: 300;
    color: var(--atom-muted);
    line-height: 1;
}

.atom-upload-chip--add:hover .atom-upload-chip__plus { color: var(--atom-primary); }

/* dark document tile */
.atom-upload-chip__icon {
    width: 36px;
    height: 46px;
    background: #1e293b;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

html[data-theme="dark"] .atom-upload-chip__icon { background: #0f172a; }

/* CSS-drawn page inside the tile */
.atom-upload-chip__page {
    display: inline-block;
    width: 16px;
    height: 20px;
    border: 1.5px solid rgba(255,255,255,0.7);
    border-radius: 1px 3px 3px 1px;
    position: relative;
}

.atom-upload-chip__page::before {
    content: '';
    position: absolute;
    top: -1px;
    right: -1px;
    width: 5px;
    height: 5px;
    background: #1e293b;
    border-left: 1.5px solid rgba(255,255,255,0.7);
    border-bottom: 1.5px solid rgba(255,255,255,0.7);
}

html[data-theme="dark"] .atom-upload-chip__page::before { background: #0f172a; }

.atom-upload-chip__page::after {
    content: '';
    position: absolute;
    left: 2px;
    bottom: 3px;
    width: 9px;
    height: 1.5px;
    background: rgba(255,255,255,0.5);
    box-shadow: 0 -3px 0 rgba(255,255,255,0.5), 0 -6px 0 rgba(255,255,255,0.5);
}

/* text body */
.atom-upload-chip__body {
    display: flex;
    flex-direction: column;
    min-width: 0;
    flex: 1;
}

.atom-upload-chip__name {
    font-size: 0.75rem;
    font-weight: 500;
    color: var(--atom-text);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.atom-upload-chip__size {
    font-size: 0.6875rem;
    color: var(--atom-muted);
    margin-top: 0.125rem;
}

/* × remove button */
.atom-upload-chip__remove {
    position: absolute;
    top: -7px;
    right: -7px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: var(--atom-surface);
    border: 1px solid var(--atom-border);
    cursor: pointer;
    font-size: 12px;
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    color: var(--atom-muted);
}

.atom-upload-chip__remove:hover {
    background: var(--atom-danger-bg);
    border-color: var(--atom-danger-border);
    color: var(--atom-danger);
}

/* ── Ingestion job card ──────────────────────────────────────────────────── */

.atom-job-card {
    border: 1px solid var(--atom-border);
    border-radius: var(--atom-radius);
    padding: 0.875rem 1rem;
    margin-bottom: 0.625rem;
    background: var(--atom-surface-soft);
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.atom-job-card__header {
    display: flex;
    align-items: center;
    gap: 0.625rem;
}

.atom-job-card__name { font-weight: 500; }
.atom-job-card__meta { font-size: 0.8125rem; color: var(--atom-muted); margin: 0; }
.atom-job-card__error { font-size: 0.8125rem; color: var(--atom-danger); margin: 0.125rem 0 0; }
.atom-doc-row__error-icon { font-style: normal; }

.atom-job-card__badge {
    font-family: ui-monospace, "SFMono-Regular", Menlo, monospace;
    font-size: 0.75rem;
    padding: 0.125rem 0.4rem;
    border-radius: 4px;
    border: 1px solid transparent;
    font-weight: 500;
}
.atom-job-card__badge--indexed  { background: var(--atom-success-bg);  color: var(--atom-success);  border-color: var(--atom-success-border); }
.atom-job-card__badge--error    { background: var(--atom-danger-bg);   color: var(--atom-danger);   border-color: var(--atom-danger-border); }
.atom-job-card__badge--indexing { background: var(--atom-warning-bg);  color: var(--atom-warning);  border-color: var(--atom-warning-border); }
.atom-job-card__badge--pending  { background: var(--atom-surface);     color: var(--atom-muted);    border-color: var(--atom-border); }

/* ── Settings form ───────────────────────────────────────────────────────── */
.atom-input--flat,
.atom-textarea--flat {
    background: var(--atom-surface);
    border-color: transparent;
}
.atom-input--flat:focus,
.atom-textarea--flat:focus {
    border-color: var(--atom-primary);
    background: var(--atom-bg);
}
html[data-theme="dark"] .atom-input--flat,
html[data-theme="dark"] .atom-textarea--flat {
    background: var(--atom-surface);
    border-color: transparent;
}

.atom-settings-field { margin-bottom: 1.25rem; }
.atom-settings-label { display: flex; align-items: center; gap: 0.35rem; margin-bottom: 0.375rem; }
.atom-settings-info {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1rem;
    height: 1rem;
    border-radius: 50%;
    background: var(--atom-surface-hover);
    font-size: 0.6875rem;
    cursor: help;
    color: var(--atom-muted);
    line-height: 1;
    position: relative;
}
.atom-settings-info::after {
    content: attr(data-tooltip);
    position: absolute;
    bottom: calc(100% + 8px);
    left: 50%;
    transform: translateX(-50%);
    width: max-content;
    max-width: 200px;
    white-space: normal;
    text-align: center;
    background: var(--atom-text);
    color: var(--atom-surface);
    font-size: 0.7rem;
    font-weight: 400;
    line-height: 1.5;
    padding: 0.4rem 0.6rem;
    border-radius: var(--atom-radius);
    box-shadow: var(--atom-shadow);
    pointer-events: none;
    opacity: 0;
    transition: opacity 0.12s ease;
    z-index: 200;
}
.atom-settings-info:hover::after {
    opacity: 1;
}

.atom-settings-section-header {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin: 1.5rem 0 1rem;
}
.atom-settings-section-title {
    font-size: 0.9375rem;
    font-weight: 600;
    color: var(--atom-text);
}
.atom-settings-section-header::before,
.atom-settings-section-header::after {
    content: "";
    flex: 1;
    height: 1px;
    background: var(--atom-border);
}
.atom-settings-section-header::before { flex: 0 0 0; }

.atom-settings-retrieval-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}
@media (max-width: 600px) {
    .atom-settings-retrieval-grid { grid-template-columns: 1fr; }
}

.atom-stepper {
    display: inline-flex;
    align-items: center;
    border: 1px solid var(--atom-input-border);
    border-radius: var(--atom-radius);
    overflow: hidden;
    background: var(--atom-surface);
}
.atom-stepper__btn {
    padding: 0.4rem 0.75rem;
    background: none;
    border: none;
    cursor: pointer;
    font-size: 1rem;
    line-height: 1;
    color: var(--atom-text);
    border-radius: 0;
}
.atom-stepper__btn:hover { background: var(--atom-surface-hover); }
.atom-stepper__input {
    width: 4rem;
    text-align: center;
    border: none;
    border-left: 1px solid var(--atom-border);
    border-right: 1px solid var(--atom-border);
    padding: 0.4rem 0.25rem;
    font-size: 0.875rem;
    background: var(--atom-bg);
    color: var(--atom-text);
    -moz-appearance: textfield;
}
.atom-stepper__input::-webkit-inner-spin-button,
.atom-stepper__input::-webkit-outer-spin-button { -webkit-appearance: none; }
.atom-stepper__input:focus { outline: none; }

.atom-settings-budget { font-size: 0.8125rem; color: var(--atom-muted); margin-top: 0.375rem; }
.atom-settings-retrieval-section { margin-bottom: 1.25rem; }
.atom-settings-generation-section { margin-bottom: 1.25rem; }
.atom-settings-reasoning-section { margin-bottom: 1.25rem; }
.atom-reasoning-badge { font-size: 0.75rem; color: var(--atom-muted); padding: 0.25rem 0.5rem; background: var(--atom-surface-alt, #f5f5f5); border-radius: var(--atom-radius); display: inline-block; margin-bottom: 0.75rem; }
.atom-reasoning-badge--iron   { background: var(--atom-surface-alt, #f5f5f5); }
.atom-reasoning-badge--silver { background: var(--atom-surface-alt, #f0f4f8); }
.atom-reasoning-badge--gold   { background: var(--atom-surface-alt, #fdf8e8); }
html[data-theme="dark"] .atom-reasoning-badge--iron   { background: rgba(255, 255, 255, 0.06); color: var(--atom-muted); }
html[data-theme="dark"] .atom-reasoning-badge--silver { background: rgba(37, 99, 235, 0.15);  color: #93c5fd; }
html[data-theme="dark"] .atom-reasoning-badge--gold   { background: rgba(180, 130, 20, 0.18); color: #fcd34d; }
.atom-registry-tier { border: 1px solid var(--atom-border); border-radius: var(--atom-radius); padding: 1rem; margin-bottom: 1rem; }
.atom-settings-helper { margin-top: 0.35rem; font-size: 0.8rem; }
.atom-tier-downgrade-warning { margin-top: 0.5rem; }
.atom-hidden { display: none; }

/* Answer LLM / Planner config cards */
.atom-config-card { border: 1px solid var(--atom-border); border-radius: var(--atom-radius); padding: 1.25rem 1.5rem; margin-bottom: 1.5rem; }
.atom-answer-llm-select { max-width: 32rem; }
.atom-answer-llm-key-warning { margin-top: 0.5rem; }
.atom-planner-info { background: var(--atom-surface); border: 1px solid var(--atom-border); border-radius: var(--atom-radius); padding: 0.875rem 1rem; }
.atom-value { font-family: monospace; font-size: 0.9em; }

/* ── Members list ────────────────────────────────────────────────────────── */
.atom-members-list { display: flex; flex-direction: column; gap: 0; margin-top: 0.75rem; border: 1px solid var(--atom-border); border-radius: var(--atom-radius); overflow: hidden; }
.atom-member-row {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem 1rem;
    border-bottom: 1px solid var(--atom-border);
}
.atom-member-row:last-child { border-bottom: none; }
.atom-member-row--header { background: var(--atom-surface); }
.atom-member-col--header {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--atom-muted);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
.atom-member-col--identity { display: flex; align-items: center; gap: 0.625rem; }
.atom-member-col--access { font-size: 0.875rem; color: var(--atom-muted); }
.atom-member-col--action { display: flex; justify-content: flex-end; }

.atom-member-icon {
    font-size: 1.125rem;
    width: 2rem;
    height: 2rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    flex-shrink: 0;
}
.atom-member-icon--admin { background: var(--atom-info-bg); }
.atom-member-icon--member { background: var(--atom-surface-hover); }

.atom-member-row__info { display: flex; flex-direction: column; gap: 0.1rem; }
.atom-member-row__name { font-weight: 500; font-size: 0.875rem; color: var(--atom-text); }
.atom-member-row__email { font-size: 0.8rem; color: #16a34a; }
html[data-theme="dark"] .atom-member-row__email { color: #4ade80; }
.atom-member-row__role { font-size: 0.75rem; color: var(--atom-muted); }

.atom-button--outlined {
    background: transparent;
    border-color: var(--atom-input-border);
    color: var(--atom-text);
}
.atom-button--outlined:hover { background: var(--atom-surface); }

/* ── Danger zone ─────────────────────────────────────────────────────────── */
.atom-danger-zone {
    margin-top: 2rem;
    border: 1px solid var(--atom-danger-border);
    border-radius: var(--atom-radius);
    padding: 1rem;
    background: var(--atom-danger-bg);
}
.atom-danger-zone__title { color: var(--atom-danger); margin-bottom: 0.5rem; }

/* ── Account page ────────────────────────────────────────────────────────── */
.atom-acct-overview-card { margin-bottom: 1.5rem; }
.atom-acct-overview-inner {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr;
    gap: 1.5rem;
    align-items: start;
}
@media (max-width: 700px) {
    .atom-acct-overview-inner { grid-template-columns: 1fr; }
}
.atom-acct-id { font-size: 0.8125rem; }
.atom-acct-members-big { font-size: 2.25rem; font-weight: 700; margin: 0.25rem 0; }
.atom-acct-plan { font-weight: 600; }
.atom-acct-overview__right p { margin: 0.25rem 0; font-size: 0.875rem; }

/* Members list */
.atom-acct-members-list {
    display: flex;
    flex-direction: column;
    gap: 0;
    border: 1px solid var(--atom-border);
    border-radius: var(--atom-radius);
    overflow: hidden;
    margin-bottom: 1.5rem;
}
.atom-acct-member-row {
    display: grid;
    grid-template-columns: 2.5fr 1fr 1fr 1.5fr 1.2fr;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem 1.25rem;
    border-bottom: 1px solid var(--atom-border);
    background: var(--atom-bg);
}
.atom-acct-member-row:last-child { border-bottom: none; }

.atom-acct-col-label {
    font-size: 0.6875rem;
    font-weight: 600;
    color: var(--atom-muted);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 0.3rem;
}

.atom-acct-col--identity { display: flex; align-items: center; }
.atom-acct-member-identity { display: flex; align-items: center; gap: 0.625rem; }
.atom-acct-member-icon { font-size: 1.25rem; flex-shrink: 0; }
.atom-acct-member-info { display: flex; flex-direction: column; gap: 0.1rem; }
.atom-acct-member-email { font-size: 0.8rem; color: #16a34a; }
html[data-theme="dark"] .atom-acct-member-email { color: #4ade80; }
.atom-acct-you { font-style: italic; font-weight: 400; color: var(--atom-muted); font-size: 0.875rem; }

.atom-acct-role-badge {
    display: inline-block;
    padding: 0.125rem 0.5rem;
    border-radius: 4px;
    font-size: 0.75rem;
    font-weight: 600;
    font-family: monospace;
}
.atom-acct-role-badge--admin   { background: var(--atom-success-bg); color: var(--atom-success); }
.atom-acct-role-badge--member  { background: var(--atom-info-bg); color: var(--atom-info-text); }
.atom-acct-role-badge--viewer  { background: var(--atom-surface); color: var(--atom-muted); }

.atom-acct-status { display: flex; align-items: center; gap: 0.4rem; font-size: 0.875rem; }
.atom-acct-status-dot {
    width: 8px; height: 8px; border-radius: 50%;
    background: var(--atom-muted); flex-shrink: 0;
}
.atom-acct-status-dot--active { background: #16a34a; }

.atom-acct-col--ws p { font-size: 0.875rem; margin: 0; color: var(--atom-text); }
.atom-acct-actions { display: flex; flex-direction: column; gap: 0.35rem; }
.atom-acct-action-btn { margin-top: 0; width: 100%; font-size: 0.8125rem; padding: 0.35rem 0.75rem; }

/* ── Role Permissions Reference ──────────────────────────────────────────── */
.atom-perm-details {
    border: 1px solid var(--atom-border);
    border-radius: var(--atom-radius);
    margin-top: 1.5rem;
    overflow: hidden;
}
.atom-perm-summary {
    padding: 0.75rem 1rem;
    cursor: pointer;
    font-weight: 600;
    font-size: 0.9375rem;
    list-style: none;
    user-select: none;
    background: var(--atom-surface-soft);
    display: flex;
    align-items: center;
    gap: 0.25rem;
}
.atom-perm-summary::-webkit-details-marker { display: none; }
.atom-perm-caret { transition: transform 0.15s; display: inline-block; }
details:not([open]) .atom-perm-caret { transform: rotate(-90deg); }
.atom-perm-body { padding: 0.75rem 1rem 1rem; }
.atom-perm-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.875rem;
}
.atom-perm-th {
    padding: 0.5rem 0.75rem;
    text-align: left;
    font-weight: 700;
    border-bottom: 2px solid var(--atom-border);
    white-space: nowrap;
}
.atom-perm-th--cap { width: 50%; }
.atom-perm-td {
    padding: 0.5rem 0.75rem;
    border-bottom: 1px solid var(--atom-border);
    color: var(--atom-text);
}
.atom-perm-td--cap { color: var(--atom-text); }
.atom-perm-td--val { text-align: left; color: var(--atom-muted); }
.atom-perm-table tbody tr:last-child td { border-bottom: none; }

/* ── Indexing progress card ──────────────────────────────────────────────── */
.atom-progress-card {
    background: var(--atom-surface);
    border: 1px solid var(--atom-border);
    border-radius: var(--atom-radius);
    padding: 1rem 1.25rem;
    margin-top: 1rem;
}
.atom-progress-card__title {
    font-weight: 600;
    margin: 0 0 0.25rem;
    color: var(--atom-text);
}
.atom-progress-card__subtitle {
    font-size: 0.875rem;
    color: var(--atom-text);
    margin: 0 0 0.125rem;
}
.atom-progress-card__status {
    font-size: 0.8125rem;
    color: var(--atom-muted);
    margin: 0 0 0.625rem;
}
.atom-progress-card__track {
    height: 8px;
    background: var(--atom-border);
    border-radius: 4px;
    overflow: hidden;
    margin-bottom: 0.375rem;
}
.atom-progress-card__fill {
    height: 100%;
    background: var(--atom-primary);
    border-radius: 4px;
    width: 0%;
    transition: width 0.3s ease;
}
.atom-progress-card__pct {
    font-size: 0.8125rem;
    font-weight: 500;
    color: var(--atom-primary);
    margin: 0 0 0.375rem;
}
.atom-progress-card__doc {
    font-size: 0.8125rem;
    color: var(--atom-muted);
    margin: 0;
    font-family: monospace;
}

/* ── Email blast ──────────────────────────────────────────────────────────── */
.atom-blast-cta-preview {
    margin-top: 1rem;
}
.atom-blast-preview {
    border: 1px solid var(--atom-border);
    border-radius: 6px;
    padding: 1.25rem 1.5rem;
    background: var(--atom-surface-soft);
}
.atom-blast-preview__body {
    margin-top: 0.75rem;
}

/* ── Model Tier Performance ───────────────────────────────────────────────── */
.atom-tier-actions {
    display: flex;
    gap: 0.5rem;
    margin-bottom: 1.5rem;
}
.atom-cost-cell {
    font-family: monospace;
    font-size: 0.8125rem;
}
.atom-cost-total {
    font-weight: 700;
    background: var(--atom-surface);
}

/* ── Unpriced warning banner ──────────────────────────────────────────────── */
.atom-unpriced-warning {
    background: #fffbeb;
    border: 1px solid #f59e0b;
    border-radius: 6px;
    padding: 0.625rem 0.875rem;
    margin-bottom: 1rem;
    font-size: 0.875rem;
    color: #92400e;
}

/* Model Pricing table — single row form */
.atom-pricing-row-form {
    display: flex;
    gap: 0.375rem;
    align-items: center;
    flex-wrap: nowrap;
}
.atom-pricing-input {
    width: 6rem;
}
.atom-pricing-select {
    min-width: 7rem;
}
.atom-pricing-save {
    white-space: nowrap;
}

/* ── Evidence Profile card ────────────────────────────────────────────────── */
.atom-doc-row__top {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
}
.atom-evidence-profile {
    margin-top: 0.5rem;
    padding: 0.5rem 0.75rem;
    border-radius: 6px;
    font-size: 0.8125rem;
    border: 1px solid var(--atom-border, #e5e7eb);
    background: var(--atom-surface, #f9fafb);
}
.atom-evidence-profile--missing,
.atom-evidence-profile--pending {
    background: transparent;
    border-color: transparent;
    padding: 0.25rem 0;
}
.atom-evidence-profile--failed {
    border-color: #fca5a5;
    background: #fef2f2;
}
.atom-ep-state {
    font-size: 0.75rem;
    color: var(--atom-text-muted, #6b7280);
}
.atom-ep-state--failed { color: #b91c1c; }
.atom-ep-state--pending { color: #d97706; }
.atom-ep-error { color: #b91c1c; font-size: 0.75rem; margin: 0.25rem 0 0; }
.atom-ep-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 0.375rem;
    margin-bottom: 0.375rem;
}
.atom-ep-badge {
    display: inline-block;
    padding: 0.125rem 0.5rem;
    border-radius: 9999px;
    font-size: 0.6875rem;
    font-weight: 500;
    background: #e0e7ff;
    color: #3730a3;
}
.atom-ep-badge--pub-status { background: #e5e7eb; color: #374151; }
.atom-ep-badge--confidence { background: #d1fae5; color: #065f46; }
.atom-ep-badge--tier       { background: #fef3c7; color: #92400e; }
.atom-ep-badge--rubric     { background: #ede9fe; color: #5b21b6; }
.atom-ep-stale {
    display: flex;
    align-items: flex-start;
    gap: 0.375rem;
    padding: 0.375rem 0.5rem;
    background: #fffbeb;
    border: 1px solid #fbbf24;
    border-radius: 6px;
    margin-bottom: 0.5rem;
    font-size: 0.75rem;
}
.atom-ep-stale__label {
    font-weight: 600;
    color: #92400e;
    white-space: nowrap;
}
.atom-ep-stale__msg {
    color: #78350f;
}
.atom-ep-ratings {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin-bottom: 0.375rem;
}
.atom-ep-rating {
    display: flex;
    align-items: center;
    gap: 0.25rem;
}
.atom-ep-rating__label {
    font-size: 0.6875rem;
    color: var(--atom-text-muted, #6b7280);
    white-space: nowrap;
}
.atom-ep-rating__value {
    font-size: 0.75rem;
    font-weight: 600;
    padding: 0.125rem 0.375rem;
    border-radius: 4px;
}
.atom-ep-rating__value--1 { background: #fee2e2; color: #991b1b; }
.atom-ep-rating__value--2 { background: #ffedd5; color: #9a3412; }
.atom-ep-rating__value--3 { background: #fef9c3; color: #713f12; }
.atom-ep-rating__value--4 { background: #dcfce7; color: #166534; }
.atom-ep-rating__value--5 { background: #d1fae5; color: #065f46; }
.atom-ep-recommended {
    font-size: 0.8125rem;
    color: var(--atom-text, #1f2937);
    margin: 0.25rem 0;
    font-style: italic;
}
.atom-ep-details { margin-top: 0.375rem; }
.atom-ep-details-summary {
    font-size: 0.75rem;
    cursor: pointer;
    color: var(--atom-text-muted, #6b7280);
}
.atom-ep-limitations {
    margin: 0.25rem 0 0 1rem;
    font-size: 0.75rem;
    color: var(--atom-text, #374151);
}
.atom-ep-regen {
    margin-top: 0;
    font-size: 0.75rem;
    padding: 0.25rem 0.625rem;
}

/* ── Document library two-column card ────────────────────────────────────── */
.atom-doc-card {
    border: 1px solid var(--atom-border, #e5e7eb);
    border-radius: var(--atom-radius, 6px);
    padding: 0.4rem;
    margin-bottom: 0.75rem;
    overflow: hidden;
}

/* Always-visible summary row */
.atom-doc-card__summary {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.625rem 1rem;
    cursor: pointer;
    list-style: none;
    user-select: none;
    flex-wrap: wrap;
}
.atom-doc-card__summary::-webkit-details-marker { display: none; }
.atom-doc-card__summary::before {
    content: "▶";
    font-size: 0.5rem;
    color: var(--atom-text-muted, #6b7280);
    flex-shrink: 0;
}
.atom-doc-card[open] > .atom-doc-card__summary::before { content: "▼"; }
.atom-doc-card[open] > .atom-doc-card__summary {
    border-bottom: 1px solid var(--atom-border, #e5e7eb);
}
.atom-doc-card__summary:hover { background: var(--atom-surface-hover, #f3f4f6); }
.atom-doc-card__summary-name {
    font-weight: 600;
    font-size: 0.9375rem;
    flex-shrink: 0;
}
.atom-doc-card__summary-meta {
    font-size: 0.75rem;
    color: var(--atom-text-muted, #6b7280);
    flex: 1;
    min-width: 0;
}
.atom-doc-card__summary-error {
    font-size: 0.75rem;
    color: #b91c1c;
}

.atom-doc-card__body {
    display: grid;
    grid-template-columns: 1fr 320px;
    gap: 0;
}
.atom-doc-card__left {
    padding: 0.875rem 1rem;
    border-right: 1px solid var(--atom-border, #e5e7eb);
    display: flex;
    flex-direction: column;
    gap: 0.625rem;
}
.atom-doc-card__right {
    padding: 0.75rem 0.875rem;
    background: var(--atom-surface, #f9fafb);
    min-width: 0;
}
.atom-doc-card__actions {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}
.atom-doc-card__action-group {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}
.atom-doc-card__action-group--admin {
    border-top: 1px solid var(--atom-border, #e5e7eb);
    padding-top: 0.375rem;
    margin-top: 0.125rem;
}
.atom-doc-card__action-label {
    font-size: 0.6875rem;
    font-weight: 600;
    color: var(--atom-text-muted, #6b7280);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    min-width: 4rem;
    flex-shrink: 0;
}
.atom-doc-card__action-btns {
    display: flex;
    gap: 0.375rem;
    flex-wrap: wrap;
    align-items: center;
}
.atom-doc-card__delete-warn {
    font-size: 0.8125rem;
    margin: 0 0 0.375rem;
}

/* EP summary slot in right column (all states) */
.atom-doc-card__ep {
    font-size: 0.8125rem;
    margin-left: 0.5rem;
    height: 100%;
}
.atom-doc-card__ep--missing,
.atom-doc-card__ep--pending {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding-top: 0.25rem;
}
.atom-doc-card__ep--failed {
    border: 1px solid #fca5a5;
    background: #fef2f2;
    border-radius: 4px;
    padding: 0.5rem;
}

/* View Analysis full-width expansion */
.atom-doc-card__full-ep {
    border-top: 1px solid var(--atom-border, #e5e7eb);
}
.atom-doc-card__view-analysis {
    display: block;
    padding: 0.5rem 1rem;
    font-size: 0.8125rem;
    font-weight: 500;
    color: var(--atom-primary, #4f46e5);
    cursor: pointer;
    list-style: none;
    background: var(--atom-surface, #f9fafb);
    user-select: none;
}
.atom-doc-card__view-analysis::-webkit-details-marker { display: none; }
.atom-doc-card__view-analysis::before { content: "▶ "; font-size: 0.625rem; }
.atom-doc-card__full-ep[open] .atom-doc-card__view-analysis::before { content: "▼ "; }

/* Full analysis panel */
.atom-ep-full {
    padding: 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}
.atom-ep-full__field {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
}
.atom-ep-full__label {
    font-size: 0.6875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--atom-text-muted, #6b7280);
}
.atom-ep-full__value {
    font-size: 0.875rem;
    color: var(--atom-text, #1f2937);
    margin: 0;
}
.atom-ep-full__list {
    margin: 0.25rem 0 0 1.125rem;
    font-size: 0.875rem;
    color: var(--atom-text, #374151);
}
.atom-ep-full__rated-row {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}
.atom-ep-full__rationale {
    font-size: 0.8125rem;
    color: var(--atom-text, #374151);
    margin: 0;
    padding-left: 0.625rem;
    border-left: 2px solid var(--atom-border, #e5e7eb);
}

/* Responsive: stack on narrow screens */
@media (max-width: 768px) {
    .atom-doc-card__body {
        grid-template-columns: 1fr;
    }
    .atom-doc-card__left {
        border-right: none;
        border-bottom: 1px solid var(--atom-border, #e5e7eb);
    }
    .atom-doc-card__right {
        background: var(--atom-surface, #f9fafb);
    }
}

/* atom-button size variant */
.atom-button--sm {
    font-size: 0.75rem;
    padding: 0.25rem 0.625rem;
}

/* Muted secondary button (e.g. JSON export) */
.atom-button--muted {
    opacity: 0.6;
}
.atom-button--muted:hover { opacity: 1; }

/* Source-file unavailability notice in Document action slot */
.atom-doc-card__no-file-msg {
    font-size: 0.75rem;
    color: var(--atom-text-muted, #6b7280);
    font-style: italic;
    line-height: 1.4;
}

/* Compact EP card: collapsible key limitations */
.atom-ep-limitations__details {
    margin-top: 0.375rem;
}
.atom-ep-limitations__summary {
    font-size: 0.6875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--atom-text-muted, #6b7280);
    cursor: pointer;
    list-style: none;
    user-select: none;
}
.atom-ep-limitations__summary::-webkit-details-marker { display: none; }
.atom-ep-limitations__summary::before { content: "▶ "; font-size: 0.5rem; }
.atom-ep-limitations__details[open] .atom-ep-limitations__summary::before { content: "▼ "; }
.atom-ep-limitations {
    margin: 0.25rem 0 0 1rem;
    padding: 0;
    font-size: 0.75rem;
    color: var(--atom-text, #374151);
}
.atom-ep-limitation-item {
    margin-bottom: 0.125rem;
}

/* Evidence Profile settings section */
.atom-settings-evidence-profile-section {
    margin-top: 1.5rem;
    padding-top: 1rem;
    border-top: 1px solid var(--atom-border, #e5e7eb);
}
.atom-checkbox-row {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
}
.atom-checkbox { accent-color: var(--atom-primary, #4f46e5); }
.atom-checkbox-label { font-size: 0.9375rem; }

/* ── Server log viewer ──────────────────────────────────────────────────────── */
.atom-log-viewer{font-family:monospace;font-size:.8125rem;line-height:1.45;border:1px solid var(--atom-border);border-radius:6px;overflow:hidden;margin-top:.75rem}
.atom-log-line{padding:.2rem .5rem;border-bottom:1px solid var(--atom-border)}
.atom-log-line:last-child{border-bottom:none}
.atom-log-line pre{margin:0;white-space:pre-wrap;word-break:break-all}
.atom-log-line--error{background:#fef2f2}
.atom-log-line--warning{background:#fffbeb}
.atom-log-line--info{background:transparent}
.atom-log-line--debug{background:#f8f8f8;color:#6b7280}
.atom-log-line--default{background:transparent}
[data-theme="dark"] .atom-log-line--error{background:#3b1818}
[data-theme="dark"] .atom-log-line--warning{background:#3b2f00}
[data-theme="dark"] .atom-log-line--debug{background:#1a1a1a;color:#9ca3af}

/* ── Workspace member activity table ─────────────────────────────────────── */
.atom-wmtbl-wrap{overflow-x:auto;margin-top:.5rem}
.atom-wmtbl{width:100%;border-collapse:collapse;font-size:.875rem}
.atom-wmtbl__th{padding:.5rem .75rem;text-align:left;font-size:.75rem;text-transform:uppercase;letter-spacing:.04em;color:var(--atom-muted,#6b7280);border-bottom:2px solid var(--atom-border,#e5e7eb);white-space:nowrap}
.atom-wmtbl__td{padding:.5rem .75rem;border-bottom:1px solid var(--atom-border,#e5e7eb);vertical-align:middle}
.atom-wmtbl__td--mono{font-variant-numeric:tabular-nums}
.atom-wmtbl__identity{display:flex;flex-direction:column;gap:.1rem}
.atom-wmtbl__name{font-weight:500}
.atom-wmtbl__email{font-size:.8125rem;color:var(--atom-muted,#6b7280)}
.atom-wmtbl__status{font-size:.8125rem;font-weight:600;padding:.125rem .4rem;border-radius:4px}
.atom-wmtbl__status--active{background:#d1fae5;color:#065f46}
.atom-wmtbl__status--dormant{background:#fef3c7;color:#92400e}
.atom-wmtbl__status--never{background:#f3f4f6;color:#6b7280}
.atom-select--sm{font-size:.8125rem;padding:.2rem .5rem;border:1px solid var(--atom-border,#e5e7eb);border-radius:4px;background:var(--atom-surface,#fff);color:inherit}
[data-theme="dark"] .atom-wmtbl__status--active{background:#064e3b;color:#6ee7b7}
[data-theme="dark"] .atom-wmtbl__status--dormant{background:#451a03;color:#fcd34d}
[data-theme="dark"] .atom-wmtbl__status--never{background:#374151;color:#9ca3af}
[data-theme="dark"] .atom-select--sm{background:var(--atom-surface,#1f2937);border-color:var(--atom-border,#374151)}

/* ── Account member login activity ──────────────────────────────────────── */
.atom-acct-login-cell{display:flex;flex-wrap:wrap;align-items:center;gap:.2rem;font-size:.8125rem}
.atom-acct-last-login{color:var(--atom-text,#1f2937)}
.atom-acct-login-count{color:var(--atom-muted,#6b7280)}
.atom-acct-never-login{font-style:italic;color:var(--atom-muted,#6b7280)}
.atom-acct-dormant{color:#92400e;font-weight:600}
[data-theme="dark"] .atom-acct-dormant{color:#fcd34d}

/* ── Claims page ─────────────────────────────────────────────────────────── */

/* Scrollable wrapper so wide tables don't squeeze badge columns */
.atom-table-scroll {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

/* Claims-specific table column sizing */
.atom-claims-table .atom-claims-table__signal,
.atom-claims-table .atom-claims-table__status {
    min-width: 130px;
    white-space: nowrap;
}
.atom-claims-table .atom-claims-table__created {
    min-width: 96px;
    white-space: nowrap;
}
.atom-claims-table .atom-claims-table__actions {
    min-width: 90px;
    white-space: nowrap;
}

/* Extra horizontal padding on the badge columns so they breathe */
.atom-claims-table th,
.atom-claims-table td {
    padding-left: 1rem;
    padding-right: 1rem;
}

/* Help text below the Claims heading */
.atom-claims-help {
    font-size: 0.8125rem;
    margin-bottom: 0.25rem;
}

/* Claim badges — sized to content, never clipped */
.atom-claim-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.2rem 0.625rem;
    border-radius: 9999px;
    font-size: 0.75rem;
    font-weight: 500;
    white-space: nowrap;
    min-width: 68px;
    line-height: 1.4;
}

/* Extraction status variants */
.atom-claim-badge--complete  { background: #dcfce7; color: #15803d; }
.atom-claim-badge--skipped   { background: var(--atom-surface-soft, #f3f4f6); color: var(--atom-muted, #6b7280); }
.atom-claim-badge--failed    { background: #fee2e2; color: #b91c1c; }
.atom-claim-badge--rejected  { background: #fee2e2; color: #b91c1c; }

/* Claim signal variants */
.atom-claim-badge--signal             { background: #e0e7ff; color: #3730a3; }
.atom-claim-badge--signal-affirm      { background: #dcfce7; color: #15803d; }
.atom-claim-badge--signal-neg         { background: #fee2e2; color: #b91c1c; }
.atom-claim-badge--signal-mixed       { background: #fef3c7; color: #92400e; }
.atom-claim-badge--signal-unclear     { background: var(--atom-surface-soft, #f3f4f6); color: var(--atom-muted, #6b7280); }

/* Dark mode overrides */
html[data-theme="dark"] .atom-claim-badge--complete       { background: rgba(34, 197, 94, 0.15);  color: #86efac; }
html[data-theme="dark"] .atom-claim-badge--skipped        { background: rgba(107, 114, 128, 0.15); color: #9ca3af; }
html[data-theme="dark"] .atom-claim-badge--failed         { background: rgba(239, 68, 68, 0.15);  color: #fca5a5; }
html[data-theme="dark"] .atom-claim-badge--rejected       { background: rgba(239, 68, 68, 0.15);  color: #fca5a5; }
html[data-theme="dark"] .atom-claim-badge--signal         { background: rgba(99, 102, 241, 0.15); color: #a5b4fc; }
html[data-theme="dark"] .atom-claim-badge--signal-affirm  { background: rgba(34, 197, 94, 0.15);  color: #86efac; }
html[data-theme="dark"] .atom-claim-badge--signal-neg     { background: rgba(239, 68, 68, 0.15);  color: #fca5a5; }
html[data-theme="dark"] .atom-claim-badge--signal-mixed   { background: rgba(245, 158, 11, 0.15); color: #fcd34d; }
html[data-theme="dark"] .atom-claim-badge--signal-unclear { background: rgba(107, 114, 128, 0.15); color: #9ca3af; }

/* ── Claims by document sections ─────────────────────────────────────────────── */
.atom-claims-by-document { display: flex; flex-direction: column; gap: 1.25rem; margin-top: 1rem; }

.atom-doc-claims {
    border: 1px solid var(--atom-border, #e5e7eb);
    border-radius: 0.5rem;
    overflow: hidden;
}
.atom-doc-claims__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.75rem 1rem;
    background: var(--atom-surface-soft, #f9fafb);
    border-bottom: 1px solid var(--atom-border, #e5e7eb);
}
.atom-doc-claims__title { display: flex; flex-direction: column; gap: 0.2rem; min-width: 0; }
.atom-doc-claims__filename { font-weight: 600; font-size: 0.9375rem; word-break: break-all; }
.atom-doc-claims__meta { font-size: 0.8125rem; }
.atom-doc-claims__empty { padding: 0.875rem 1rem; }

/* When the inner table sits inside a section, remove extra top margin */
.atom-doc-claims .atom-table-scroll { margin: 0; }
.atom-doc-claims .atom-table { border-top: none; border-left: none; border-right: none; border-radius: 0; }

/* Admin action blocks: form + helper text stacked vertically */
.atom-admin-action-block { display: flex; flex-direction: column; gap: 0.2rem; }

html[data-theme="dark"] .atom-doc-claims { border-color: var(--atom-border); }
html[data-theme="dark"] .atom-doc-claims__header { background: var(--atom-surface-soft); border-bottom-color: var(--atom-border); }

/* ── Evidence Concordance page ────────────────────────────────────────────── */

/* Edge type badges */
.atom-edge-badge {
    display: inline-flex; align-items: center; justify-content: center;
    padding: 0.2rem 0.625rem; border-radius: 9999px;
    font-size: 0.75rem; font-weight: 500; white-space: nowrap;
}
.atom-edge-badge--supports   { background: #dcfce7; color: #15803d; }
.atom-edge-badge--contested  { background: #fee2e2; color: #b91c1c; }
.atom-edge-badge--superseded { background: #fef3c7; color: #92400e; }
.atom-edge-badge--scope      { background: #e0e7ff; color: #3730a3; }

/* Concordance sections */
.atom-concordance-section { margin-top: 1.75rem; }
.atom-concordance-cards   { display: flex; flex-direction: column; gap: 1rem; margin-top: 0.75rem; }

/* Concordance cards */
.atom-concordance-card {
    border: 1px solid var(--atom-border, #e5e7eb);
    border-radius: 0.5rem; overflow: hidden;
}
.atom-concordance-card__header {
    display: flex; align-items: center; gap: 0.75rem; flex-wrap: wrap;
    padding: 0.625rem 1rem;
    background: var(--atom-surface-soft, #f9fafb);
    border-bottom: 1px solid var(--atom-border, #e5e7eb);
}
.atom-concordance-card__docs {
    display: flex; align-items: center; gap: 0.5rem;
    font-size: 0.8125rem; color: var(--atom-muted, #6b7280); flex: 1; min-width: 0;
}
.atom-concordance-card__doc-name {
    font-weight: 500; overflow: hidden; text-overflow: ellipsis;
    white-space: nowrap; max-width: 240px;
}
.atom-concordance-card__body {
    display: grid; grid-template-columns: 1fr 1fr;
    gap: 1px; background: var(--atom-border, #e5e7eb);
}
.atom-concordance-card__claim {
    display: flex; flex-direction: column; gap: 0.5rem;
    padding: 0.875rem 1rem;
    background: var(--atom-surface, #fff);
}
.atom-concordance-card__claim-label {
    font-size: 0.6875rem; font-weight: 700; text-transform: uppercase;
    letter-spacing: 0.06em; color: var(--atom-muted, #6b7280);
}
.atom-concordance-card__claim-text { font-size: 0.875rem; line-height: 1.55; }
.atom-concordance-card__quote {
    font-size: 0.8125rem; color: var(--atom-muted, #6b7280); font-style: italic;
    padding: 0.25rem 0 0.25rem 0.625rem;
    border-left: 2px solid var(--atom-border, #e5e7eb); margin: 0;
}
.atom-concordance-card__footer {
    padding: 0.75rem 1rem; border-top: 1px solid var(--atom-border, #e5e7eb);
    display: flex; flex-direction: column; gap: 0.375rem;
}
.atom-concordance-card__rationale { font-size: 0.8125rem; line-height: 1.5; }
.atom-concordance-card__caution   { font-size: 0.75rem; color: var(--atom-muted, #6b7280); font-style: italic; }
.atom-concordance-card__meta      { display: flex; align-items: center; gap: 0.75rem; flex-wrap: wrap; }

@media (max-width: 640px) {
    .atom-concordance-card__body { grid-template-columns: 1fr; }
}

/* Dark mode */
html[data-theme="dark"] .atom-concordance-card  { border-color: var(--atom-border); }
html[data-theme="dark"] .atom-concordance-card__header { background: var(--atom-surface-soft); border-bottom-color: var(--atom-border); }
html[data-theme="dark"] .atom-concordance-card__claim  { background: var(--atom-surface); }
html[data-theme="dark"] .atom-concordance-card__footer { border-top-color: var(--atom-border); }
html[data-theme="dark"] .atom-edge-badge--supports   { background: rgba(34, 197, 94, 0.15);  color: #86efac; }
html[data-theme="dark"] .atom-edge-badge--contested  { background: rgba(239, 68, 68, 0.15);  color: #fca5a5; }
html[data-theme="dark"] .atom-edge-badge--superseded { background: rgba(245, 158, 11, 0.15); color: #fcd34d; }
html[data-theme="dark"] .atom-edge-badge--scope      { background: rgba(99, 102, 241, 0.15); color: #a5b4fc; }

/* ── Slideshow modal ─────────────────────────────────────────────────────── */
.atom-slideshow-modal {
    padding: 0;
    border: none;
    border-radius: 12px;
    width: 90vw;
    max-width: 1100px;
    height: 93vh;
    overflow: hidden;
    box-shadow: 0 25px 60px rgba(0, 0, 0, 0.5);
    position: relative;
}
.atom-slideshow-modal::backdrop {
    background: rgba(0, 0, 0, 0.72);
    backdrop-filter: blur(3px);
}
.atom-slideshow-modal iframe {
    width: 100%;
    height: 100%;
    border: none;
    display: block;
    border-radius: 12px;
}
.atom-slideshow-modal__close {
    position: absolute;
    top: 0.625rem;
    right: 0.75rem;
    z-index: 10;
    background: rgba(0, 0, 0, 0.55);
    color: #fff;
    border: none;
    border-radius: 50%;
    width: 2rem;
    height: 2rem;
    font-size: 1rem;
    line-height: 1;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.15s;
}
.atom-slideshow-modal__close:hover { background: rgba(0, 0, 0, 0.8); }

/* "Learn more" trigger — sidebar */
.atom-sidebar__learn-more {
    display: block;
    background: none;
    border: none;
    cursor: pointer;
    width: calc(100% - 2rem);
    margin: 0.5rem 1rem 0.25rem;
    padding: 0.375rem 0.75rem;
    text-align: left;
    font-size: 0.8125rem;
    font-family: inherit;
    color: var(--atom-accent, #22c55e);
    border-radius: 6px;
    transition: background 0.15s;
    text-decoration: none;
}
.atom-sidebar__learn-more:hover {
    background: rgba(34, 197, 94, 0.08);
}

/* "Learn more" trigger — login / auth pages */
.atom-auth-learn-more {
    display: block;
    background: none;
    border: none;
    cursor: pointer;
    margin-top: 1.25rem;
    padding: 0.25rem 0.5rem;
    font-size: 0.875rem;
    font-family: inherit;
    color: var(--atom-muted);
    text-align: center;
    text-decoration: underline;
    text-underline-offset: 2px;
    transition: color 0.15s;
}
.atom-auth-learn-more:hover { color: var(--atom-accent, #22c55e); }

/* ── Mobile responsive (<768px) ─────────────────────────────────────────── */

/* Mobile shell and nav — hidden on desktop by default */
.atom-mobile-shell {
    display: none;
}
.atom-mobile-nav {
    display: none;
    background: var(--atom-surface);
    border-bottom: 1px solid var(--atom-border);
    overflow-y: auto;
    max-height: 85vh;
}
.atom-mobile-nav--open {
    display: block;
}

/* Hamburger button — used on mobile, but base styles always loaded */
.atom-hamburger {
    background: none;
    border: none;
    cursor: pointer;
    padding: 0.5rem;
    display: flex;
    flex-direction: column;
    gap: 5px;
    line-height: 0;
    flex-shrink: 0;
}
.atom-hamburger span {
    display: block;
    width: 22px;
    height: 2px;
    background: var(--atom-text);
    border-radius: 1px;
    transition: transform 0.2s, opacity 0.2s;
}
.atom-hamburger--open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.atom-hamburger--open span:nth-child(2) { opacity: 0; }
.atom-hamburger--open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

@media (max-width: 767px) {
    /* ── Shell layout ───────────────────────────────────────────────────── */
    .atom-shell {
        flex-direction: column;
    }
    .atom-sidebar {
        display: none;
    }

    /* ── Mobile shell (sticky top bar + dropdown) ───────────────────────── */
    .atom-mobile-shell {
        display: block;
        position: sticky;
        top: 0;
        z-index: 200;
    }

    /* ── Top bar ────────────────────────────────────────────────────────── */
    .atom-mobile-header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 0.625rem 1rem;
        background: var(--atom-surface);
        border-bottom: 1px solid var(--atom-border);
    }
    .atom-mobile-header__brand {
        display: flex;
        align-items: center;
        gap: 0.5rem;
    }
    .atom-mobile-header__logo {
        width: 26px;
        height: 26px;
        flex-shrink: 0;
    }
    .atom-mobile-header__wordmark {
        font-size: 1.05rem;
        font-weight: 700;
        color: var(--atom-text);
    }

    /* ── Nav dropdown links ─────────────────────────────────────────────── */
    .atom-mobile-nav__link {
        display: block;
        padding: 0.75rem 1.25rem;
        text-decoration: none;
        color: var(--atom-text);
        font-size: 0.9rem;
        font-weight: 500;
        border-left: 3px solid transparent;
    }
    .atom-mobile-nav__link:hover {
        background: var(--atom-surface-hover);
    }
    .atom-mobile-nav__link--active {
        color: var(--atom-primary);
        border-left-color: var(--atom-primary);
        background: rgba(37, 99, 235, 0.06);
    }
    .atom-mobile-nav__account {
        padding: 0.5rem 1.25rem 0.25rem;
        font-size: 0.8rem;
        font-weight: 600;
        color: var(--atom-muted);
        text-transform: uppercase;
        letter-spacing: 0.04em;
    }
    .atom-mobile-nav__platform-banner {
        background: var(--atom-info-bg);
        border: 1px solid var(--atom-info-border);
        border-radius: var(--atom-radius);
        padding: 0.625rem 0.875rem;
        margin: 0.5rem 1rem;
        font-size: 0.8125rem;
    }
    .atom-mobile-nav__platform-banner-title {
        font-size: 0.8125rem;
        font-weight: 600;
        color: var(--atom-info-text);
        margin: 0 0 0.375rem;
    }
    .atom-mobile-nav__platform-banner .atom-button {
        margin-top: 0.375rem;
        width: 100%;
    }
    .atom-mobile-nav__footer {
        padding: 0.75rem 1.25rem 1rem;
        border-top: 1px solid var(--atom-border);
        margin-top: 0.25rem;
        display: flex;
        flex-direction: column;
        gap: 0.5rem;
    }
    .atom-mobile-nav__footer .atom-button {
        width: 100%;
    }
    .atom-mobile-nav__footer .atom-muted {
        margin: 0;
    }

    /* ── Main content ───────────────────────────────────────────────────── */
    .atom-main {
        max-width: 100%;
        padding: 1rem;
    }

    /* ── Workspace tabs: horizontal scroll ──────────────────────────────── */
    .atom-tabs {
        overflow-x: auto;
        flex-wrap: nowrap;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        padding-bottom: 0;
    }
    .atom-tabs::-webkit-scrollbar { display: none; }
    .atom-tabs__link {
        white-space: nowrap;
        flex-shrink: 0;
        padding: 0.625rem 0.875rem;
    }

    /* ── Auth frame: tighter padding ────────────────────────────────────── */
    .atom-auth-frame {
        padding: 1rem;
        justify-content: flex-start;
        padding-top: 2rem;
    }

    /* ── Page title: scale down ─────────────────────────────────────────── */
    .atom-page-title {
        font-size: 1.5rem;
    }

    /* ── Buttons: touch-friendly minimum height ─────────────────────────── */
    .atom-button {
        min-height: 44px;
    }

    /* ── Key rows: stack vertically ─────────────────────────────────────── */
    .atom-key-row {
        flex-direction: column;
        gap: 0.5rem;
    }
}

/* ── Mobile dark theme overrides ────────────────────────────────────────── */
html[data-theme="dark"] .atom-mobile-header__logo {
    content: url('/static/logo_sidebar_green.png');
}
html[data-theme="dark"] .atom-mobile-nav__link--active {
    background: rgba(255, 255, 255, 0.06);
}