/* Client surface, 2026-09-29.
   Loaded only by the pages a client actually reads: search, my searches, the
   asset sheet, watchlist, evaluations, reports, the tour, and login. Admin
   routes stay on common.css alone.

   Readers are older scientists. Body and secondary text are held at WCAG AAA
   (7:1). Component edges are held at 1.4.11 (3:1). Ratios below are against
   white unless noted.

     --text    #1a1f26   16.56:1
     --muted   #3e4c5e    8.75:1   (8.08:1 on --bg)
     --border  #7b8798    3.65:1   (3.22:1 on --well)
     --accent  #0c3d6e   11.00:1   white sitting on the fill
     --ok      #0b5f3b    7.74:1
     --amber   #7a4100    8.13:1
     --err     #8f1d1d    8.89:1

   Navy against the body ink is only 1.51:1, so a content link is underlined.
   Colour is not the thing that says "this is a link".

   Controls are slightly raised: 6px corners, a short shadow on buttons,
   a softer one on cards. Chips stay flat. One navy accent. Status colours
   appear only where the word is a status. */

body.client-surface {
  --bg: #f4f6f8;
  --surface: #ffffff;
  --raised: #ffffff;
  --text: #1a1f26;
  --muted: #3e4c5e;
  --border: #7b8798;
  --accent: #0c3d6e;
  --accent-hover: #082c50;
  --section-accent: #0c3d6e;
  --purple: #4c1d95;
  --green: #0b5f3b;
  --amber: #7a4100;
  --cyan: #0a5568;
  --err: #8f1d1d;
  --ok: #0b5f3b;
  --rose: #9f1239;
  --well: #eef1f4;
  --select: #e8eef5;
  --radius: 6px;
  --shadow-btn: 0 1px 2px rgba(8, 44, 80, 0.28), 0 4px 10px rgba(12, 61, 110, 0.22);
  --shadow-card: 0 1px 2px rgba(26, 31, 38, 0.06), 0 8px 20px rgba(26, 31, 38, 0.07);

  background: var(--bg);
  color: var(--text);
  font-size: 1.0625rem;
  line-height: 1.6;
}

/* ── Focus ──
   2px navy, 11:1 on white. Offset so it is not clipped by a 1px border. */
body.client-surface :focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

/* ── Links ── */
body.client-surface a {
  text-underline-offset: 0.18em;
  text-decoration-thickness: 1px;
}
body.client-surface .site-nav a,
body.client-surface a.nav-logo,
body.client-surface a.search-logo,
body.client-surface a.detail-action,
body.client-surface a.ai-btn,
body.client-surface a.tour-btn,
body.client-surface a.wl-btn,
body.client-surface a.ms-btn,
body.client-surface a.avail-chip {
  text-decoration: none;
}

/* ── Top bar ──
   A 3px navy rule is the only decoration on the chrome. Active is an
   underline in that same navy, not a translucent blue wash. */
body.client-surface .site-nav {
  gap: 0.15rem;
  padding: 0.55rem 1.15rem;
  font-size: 1.0625rem;
  background: var(--surface);
  border-bottom: 1px solid var(--border);
  box-shadow: inset 0 3px 0 var(--accent);
}
body.client-surface .search-bar {
  box-shadow: inset 0 3px 0 var(--accent);
  border-bottom-color: var(--border);
}
body.client-surface .search-bar .site-nav {
  box-shadow: none;
  border: 0;
  padding: 0;
  font-size: 1.0625rem;
}
body.client-surface .site-nav a,
body.client-surface .search-bar .site-nav a {
  color: var(--text);
  font-weight: 600;
  padding: 0.4rem 0.7rem;
  border-radius: 2px;
}
body.client-surface .site-nav a:hover,
body.client-surface .search-bar .site-nav a:hover {
  color: var(--text);
  background: var(--select);
  text-decoration: none;
}
body.client-surface .site-nav a.nav-logo:hover,
body.client-surface .search-bar .site-nav a.nav-logo:hover {
  background: transparent;
}
body.client-surface .site-nav a.active,
body.client-surface .search-bar .site-nav a.active {
  color: var(--accent);
  background: transparent;
  border-radius: 0;
  box-shadow: inset 0 -2px 0 var(--accent);
}
body.client-surface .nav-user-avatar {
  width: 2rem;
  height: 2rem;
  font-size: 0.875rem;
  color: var(--text);
  border-color: var(--border);
}
body.client-surface .nav-user:hover .nav-user-avatar {
  border-color: var(--accent);
  background: var(--select);
  color: var(--accent);
}
body.client-surface .nav-dropdown-menu {
  border-color: var(--border);
  border-radius: 8px;
  box-shadow: var(--shadow-card);
}
body.client-surface .subtitle,
body.client-surface .empty-state {
  font-size: 1.0625rem;
  color: var(--muted);
}

/* ── Status chips ──
   Dark text on a pale ground of the same hue, plus a 1px edge in that text
   colour. The pale grounds were checked with the darker chip ink:
   #064e3b on #e5f4ec is 8.55:1, #7a4100 on #f8efe0 is 7.13:1,
   #8f1d1d on #fdecec is 7.79:1, #4c1d95 on #f3eef8 is 9.60:1. */
body.client-surface .chip,
body.client-surface .pipe-badge {
  font-size: 0.875rem;
  font-weight: 700;
  border-radius: 2px;
  border: 1px solid currentColor;
  letter-spacing: 0.02em;
}
body.client-surface .chip.ok { color: #064e3b; background: #e5f4ec; }
body.client-surface .chip.running { color: #7a4100; background: #f8efe0; }
body.client-surface .chip.error,
body.client-surface .chip.failed,
body.client-surface .chip.dead { color: #8f1d1d; background: #fdecec; }
body.client-surface .chip.rejected { color: #9f1239; background: #fde8ee; }
body.client-surface .chip.queued,
body.client-surface .chip.retry {
  color: var(--muted);
  background: var(--well);
  border-color: var(--border);
}
body.client-surface .chip.aborted { color: #4c1d95; background: #f3eef8; }
body.client-surface .pipe-badge.ingestion,
body.client-surface .pipe-badge.enrichment,
body.client-surface .pipe-badge.graph,
body.client-surface .pipe-badge.class_position,
body.client-surface .company-badge {
  color: var(--accent);
  background: var(--select);
  border-color: var(--accent);
}

body.client-surface .btn-sm {
  font-size: 0.9375rem;
  font-weight: 600;
  padding: 0.4rem 0.75rem;
  min-height: 2.25rem;
  border-radius: var(--radius);
  border-color: var(--border);
  background: var(--surface);
  color: var(--text);
}
body.client-surface .btn-sm:hover {
  border-color: var(--accent);
  color: var(--accent);
}

/* ── Asset sheet ──
   The layout stays in company_detail.css. This block only lifts type that
   was set for a dense operator tool, and replaces the pastel card washes
   with a ruled white sheet. */
body.client-surface .company-header h1 { font-size: 1.5rem; }
body.client-surface .company-domain,
body.client-surface .meta-item,
body.client-surface .section-item { font-size: 1rem; }
body.client-surface .sub-section-item,
body.client-surface .panel-summary,
body.client-surface .structured-card-meta,
body.client-surface .asset-card-type,
body.client-surface .keychar-value { font-size: 1rem; }
body.client-surface .section-sidebar h3,
body.client-surface .meta-item .meta-label,
body.client-surface .metric-label,
body.client-surface .structured-subtitle,
body.client-surface .structured-key,
body.client-surface .trial-section-label,
body.client-surface .ov-card-title,
body.client-surface .ov-table th,
body.client-surface .keychar-label,
body.client-surface .prop-group-label,
body.client-surface .asset-subtitle,
body.client-surface .asset-section-title,
body.client-surface .adc-title,
body.client-surface .adc-kv-key { font-size: 0.875rem; }
body.client-surface .detail-desc,
body.client-surface .structured-value,
body.client-surface .trial-section-value,
body.client-surface .partner-description,
body.client-surface .asset-inline-value,
body.client-surface .asset-text-block,
body.client-surface .ov-table,
body.client-surface .empty-note,
body.client-surface .adc-phrase { font-size: 1.0625rem; line-height: 1.6; }
body.client-surface .asset-card-name,
body.client-surface .structured-card-title,
body.client-surface .trial-card-title { font-size: 1.25rem; }
body.client-surface .metric-value { font-size: 1.25rem; }

body.client-surface .asset-card,
body.client-surface .metric-tile,
body.client-surface .structured-card,
body.client-surface .trial-card,
body.client-surface .partner-card,
body.client-surface .indication-group,
body.client-surface .asset-keychars,
body.client-surface .asset-availability {
  border-radius: 8px;
  box-shadow: var(--shadow-card);
  background: var(--surface);
  border-color: var(--border);
}
body.client-surface .asset-card { background: var(--surface); }
body.client-surface .asset-keychars,
body.client-surface .asset-availability { background: var(--well); box-shadow: none; }

body.client-surface .section-item.active {
  background: var(--select);
  color: var(--text);
  border-color: var(--accent);
}
body.client-surface .sub-section-item.active,
body.client-surface .sub-tab-bar button.active {
  color: var(--accent);
  background: var(--select);
  border-color: var(--accent);
}

body.client-surface .asset-header-badge,
body.client-surface .structured-chip,
body.client-surface .trial-pill,
body.client-surface .partner-chip,
body.client-surface .quality-chip,
body.client-surface .avail-chip {
  border-radius: 4px;
  box-shadow: none;
  font-size: 0.875rem;
}
body.client-surface .asset-header-badge.phase,
body.client-surface .trial-pill-status {
  color: #7a4100;
  background: #f8efe0;
  border-color: #7a4100;
}
body.client-surface .asset-header-badge.status,
body.client-surface .trial-pill-id {
  color: #4c1d95;
  background: #f3eef8;
  border-color: #4c1d95;
}
body.client-surface .asset-header-badge.trials,
body.client-surface .trial-pill-phase,
body.client-surface .quality-chip-good,
body.client-surface .partner-chip-value {
  color: #064e3b;
  background: #e5f4ec;
  border-color: #064e3b;
}
body.client-surface .quality-chip-warning {
  color: #7a4100;
  background: #f8efe0;
  border-color: #7a4100;
}
body.client-surface .quality-chip-bad {
  color: #8f1d1d;
  background: #fdecec;
  border-color: #8f1d1d;
}
body.client-surface .quality-chip-platform,
body.client-surface .structured-chip,
body.client-surface .partner-chip-type,
body.client-surface .trial-term-indication {
  color: var(--accent);
  background: var(--select);
  border-color: var(--accent);
}
body.client-surface .avail-chip-has {
  color: var(--accent);
  background: var(--select);
  border-color: var(--accent);
}
body.client-surface .asset-adc-card,
body.client-surface .asset-radioligand-card,
body.client-surface .asset-small-molecule-card,
body.client-surface .asset-car-t-card {
  border: 1px solid var(--border);
  border-left: 3px solid var(--accent);
  border-radius: 8px;
  background: var(--surface);
  box-shadow: var(--shadow-card);
}
body.client-surface .asset-value-item {
  border-radius: 6px;
  background: var(--well);
  border: 1px solid var(--border);
}

/* ── Raised controls ──
   Primary buttons carry a navy shadow so they sit off the page. Secondary
   buttons get a shorter grey one. Fields are sunken. Cards use the same
   8px corner as the menus. */
body.client-surface .search-submit,
body.client-surface .search-input,
body.client-surface .login-hero-btn,
body.client-surface .login-submit,
body.client-surface .login-input,
body.client-surface .login-panel,
body.client-surface .ai-btn,
body.client-surface .detail-action,
body.client-surface .wl-btn,
body.client-surface .wl-card,
body.client-surface .tour-btn,
body.client-surface .ev-btn,
body.client-surface .ev-ai-btn,
body.client-surface .composer button,
body.client-surface .composer textarea,
body.client-surface .composer-input,
body.client-surface .sub-tab-bar button,
body.client-surface .chips button,
body.client-surface .eval-continue,
body.client-surface .rb-card,
body.client-surface .rb-del,
body.client-surface .se-card,
body.client-surface .se-unsave,
body.client-surface .ms-card,
body.client-surface .ms-btn,
body.client-surface .ms-bin,
body.client-surface .ms-dialog,
body.client-surface .rp-card,
body.client-surface .hstat,
body.client-surface .eval-card,
body.client-surface .axis-card,
body.client-surface .mini-card,
body.client-surface .modal-panel,
body.client-surface .result-set,
body.client-surface .msg {
  border-radius: 8px;
}
body.client-surface .search-submit,
body.client-surface .login-hero-btn,
body.client-surface .login-submit,
body.client-surface .ai-btn,
body.client-surface .detail-action,
body.client-surface .wl-btn,
body.client-surface .tour-btn,
body.client-surface .ev-btn,
body.client-surface .ev-ai-btn,
body.client-surface .composer button,
body.client-surface .btn-sm,
body.client-surface .sub-tab-bar button,
body.client-surface .chips button,
body.client-surface .eval-continue,
body.client-surface .rb-del,
body.client-surface .se-unsave,
body.client-surface .ms-btn,
body.client-surface .ms-bin {
  border-radius: var(--radius);
  box-shadow: 0 1px 2px rgba(26, 31, 38, 0.08);
}
body.client-surface .search-submit,
body.client-surface .login-hero-btn,
body.client-surface .login-submit,
body.client-surface .ai-btn.primary,
body.client-surface .detail-action.primary,
body.client-surface .wl-btn.primary,
body.client-surface .tour-btn.primary,
body.client-surface .ev-btn.primary,
body.client-surface .composer button {
  box-shadow: var(--shadow-btn);
}
body.client-surface .search-submit:hover,
body.client-surface .login-hero-btn:hover,
body.client-surface .login-submit:hover,
body.client-surface .ai-btn.primary:hover,
body.client-surface .detail-action.primary:hover,
body.client-surface .wl-btn.primary:hover,
body.client-surface .tour-btn.primary:hover,
body.client-surface .ev-btn.primary:hover,
body.client-surface .composer button:hover {
  box-shadow: 0 2px 4px rgba(8, 44, 80, 0.3), 0 8px 18px rgba(12, 61, 110, 0.26);
}
body.client-surface .search-submit:active,
body.client-surface .login-hero-btn:active,
body.client-surface .login-submit:active,
body.client-surface .ai-btn.primary:active,
body.client-surface .detail-action.primary:active,
body.client-surface .wl-btn.primary:active,
body.client-surface .tour-btn.primary:active,
body.client-surface .composer button:active {
  box-shadow: 0 1px 2px rgba(8, 44, 80, 0.24);
  transform: translateY(1px);
}
body.client-surface .search-input,
body.client-surface .login-input,
body.client-surface .composer textarea,
body.client-surface .composer-input,
body.client-surface .rail-search {
  border-radius: var(--radius);
  box-shadow: inset 0 1px 2px rgba(26, 31, 38, 0.08), 0 1px 2px rgba(26, 31, 38, 0.04);
}
body.client-surface .wl-card,
body.client-surface .rb-card,
body.client-surface .se-card,
body.client-surface .ms-card,
body.client-surface .ms-dialog,
body.client-surface .login-panel,
body.client-surface .rp-card,
body.client-surface .hstat,
body.client-surface .eval-card,
body.client-surface .axis-card,
body.client-surface .mini-card,
body.client-surface .modal-panel,
body.client-surface .result-set,
body.client-surface .msg.assistant {
  box-shadow: var(--shadow-card);
}