﻿/* 00-base: variables, resets, layout primitives */

/* ============================================================
   DESIGN SYSTEM -- variables
   ============================================================ */
:root {
  --bg: #0a0c10;
  --surface: #12151b;
  --surface-raised: #171b23;
  --border: #262b35;
  --border-strong: #343b48;
  --accent: #6366f1;
  --accent-2: #2563eb;
  --success: #22c55e;
  --success-bg: #0f2a1a;
  --warning: #f59e0b;
  --warning-bg: #2f2409;
  --danger: #ef4444;
  --danger-bg: #2c1212;
  --text: #e8eaee;
  --text-primary: #e8eaee;
  --text-secondary: #9aa1ad;
  --text-muted: #9aa1ad;
  --text-faint: #6b7280;
  --accent-light: #6366f1;
  --background: #0a0c10;
  --bg: #0a0c10;
  --surface: #12151b;
  --border: #262b35;
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 14px;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --shadow-md: 0 4px 16px rgba(0,0,0,0.35);
  --shadow-lg: 0 8px 32px rgba(0,0,0,0.45);
  --font-sm: 0.8125rem;
  --font-base: 0.9375rem;
  --font-lg: 1.125rem;
  --font-xl: 1.5rem;
  --transition: 140ms ease;
  --sidebar-width: 260px;
}

@media (prefers-reduced-motion: reduce) {
  * { transition-duration: 0.001ms !important; animation-duration: 0.001ms !important; }
}

* { box-sizing: border-box; }

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

a { color: var(--accent-2); }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, summary:focus-visible, [tabindex]:focus-visible {
  outline: 2px solid var(--accent-2);
  outline-offset: 2px;
}

/* ============================================================
   APPLICATION SHELL
   ============================================================ */
.app-shell { display: flex; min-height: 100vh; }

.sidebar-toggle {
  display: none;
  position: fixed; top: var(--space-3); left: var(--space-3); z-index: 40;
  background: var(--surface-raised); color: var(--text); border: 1px solid var(--border);
  border-radius: var(--radius-sm); width: 44px; height: 44px; min-width: 44px; min-height: 44px; font-size: 1.1rem; cursor: pointer;
}

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

.sidebar-brand { padding-bottom: var(--space-4); border-bottom: 1px solid var(--border); margin-bottom: var(--space-4); }
.brand-row { display: flex; align-items: center; gap: var(--space-2); }
.brand-domain { font-weight: 700; font-size: var(--font-lg); }
.brand-subtitle { color: var(--text-muted); font-size: var(--font-sm); margin-top: var(--space-1); }

.badge { display: inline-flex; align-items: center; padding: 4px 8px; border-radius: 999px; font-size: 0.6875rem; font-weight: 700; letter-spacing: 0.03em; }
.badge-private { background: rgba(99,102,241,0.18); color: #a5b4fc; border: 1px solid rgba(99,102,241,0.35); }

.sidebar-nav { display: flex; flex-direction: column; gap: 4px; margin-bottom: var(--space-5); }
.nav-item {
  display: flex; align-items: center; gap: var(--space-2);
  padding: var(--space-2) var(--space-3); border-radius: var(--radius-sm);
  color: var(--text-muted); text-decoration: none; font-size: var(--font-base);
  background: transparent; border: 0; width: 100%; text-align: left; cursor: pointer;
  font-family: inherit; min-height: 44px; min-width: 44px;
}
.nav-item:hover:not(.nav-item-disabled) { background: var(--surface-raised); color: var(--text); }
.nav-item-active { background: rgba(99,102,241,0.15); color: #c7d2fe; font-weight: 600; }
.nav-item-disabled { color: var(--text-faint); cursor: not-allowed; }
.nav-icon { font-size: 0.6rem; width: 1em; }

.sidebar-section { margin-top: auto; padding-top: var(--space-4); border-top: 1px solid var(--border); }
.sidebar-section + .sidebar-section { margin-top: var(--space-4); border-top: 1px solid var(--border); }
.sidebar-section-title { font-size: var(--font-sm); color: var(--text-muted); font-weight: 600; margin-bottom: var(--space-2); text-transform: uppercase; letter-spacing: 0.04em; }
.active-run-summary { font-size: var(--font-sm); color: var(--text-muted); background: var(--surface-raised); border: 1px solid var(--border); border-radius: var(--radius-sm); padding: var(--space-2) var(--space-3); }
.active-run-summary.running { color: #86efac; border-color: rgba(34,197,94,0.3); }

/* ============================================================
   BUTTONS
   ============================================================ */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--space-1);
  font-family: inherit; font-size: var(--font-sm); font-weight: 600;
  padding: var(--space-2) var(--space-3); border-radius: var(--radius-sm);
  border: 1px solid transparent; cursor: pointer; transition: background var(--transition), border-color var(--transition), opacity var(--transition);
  min-height: 44px;
}
.btn-block { width: 100%; margin-top: var(--space-2); }
.btn-small { padding: 4px 8px; font-size: 0.75rem; min-height: 32px; }
.btn-primary { background: linear-gradient(135deg, var(--accent), var(--accent-2)); color: #fff; }
.btn-primary:hover:not(:disabled) { filter: brightness(1.08); }
.btn-secondary { background: var(--surface-raised); color: var(--text); border-color: var(--border-strong); }
.btn-secondary:hover:not(:disabled) { border-color: var(--accent-2); }
.btn-ghost { background: transparent; color: var(--text-muted); border-color: var(--border); }
.btn-ghost:hover:not(:disabled) { color: var(--text); border-color: var(--border-strong); }
.btn:disabled { opacity: 0.5; cursor: not-allowed; }

/* ============================================================
   TOP HEADER
   ============================================================ */
.main { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.top-header {
  display: flex; justify-content: space-between; align-items: flex-start; flex-wrap: wrap; gap: var(--space-3);
  padding: var(--space-5) var(--space-6) var(--space-4);
  border-bottom: 1px solid var(--border);
}
.header-title-row { display: flex; align-items: baseline; gap: var(--space-3); flex-wrap: wrap; }
.top-header h1 { margin: 0; font-size: var(--font-xl); }
.header-subtitle { color: var(--text-muted); font-size: var(--font-base); }
.header-tagline { margin-top: var(--space-1); font-size: var(--font-sm); color: var(--text-muted); }
.tagline-word { font-weight: 700; }
  .tagline-discover { color: var(--accent); }
.tagline-qualify { color: #34d399; }
.tagline-rank { color: #a78bfa; }
.tagline-apply { color: #fbbf24; }
.tagline-win { color: #fff; }

.header-status { text-align: right; }
.system-health { display: flex; align-items: center; gap: var(--space-2); justify-content: flex-end; font-size: var(--font-sm); }
.health-dot { width: 9px; height: 9px; border-radius: 50%; display: inline-block; }
.health-dot-ok { background: var(--success); box-shadow: 0 0 8px rgba(34,197,94,0.6); }
.health-dot-degraded { background: var(--warning); }
.health-dot-down { background: var(--danger); }
.health-dot-unknown { background: var(--text-faint); }
.last-updated,
.inventory-status,
.snapshot-provenance { color: var(--text-faint); font-size: 0.75rem; margin-top: var(--space-1); }
.snapshot-diagnostic-id { color: var(--text-faint); font-size: 0.68rem; opacity: 0.75; margin-top: 4px; }

/* ============================================================
   STATE UTILITIES
   ============================================================ */
.hidden { display: none !important; }
.unauth-panel { display: none; margin: var(--space-6); padding: var(--space-4); background: var(--danger-bg); border: 1px solid rgba(239,68,68,0.4); border-radius: var(--radius-md); }
.unauth-panel.visible { display: block; }
.unauth-panel p { margin: 0 0 var(--space-3); }
.auth-detail { color: var(--text-muted); font-size: var(--font-sm); }
.unlock-form { display: flex; align-items: end; gap: var(--space-2); flex-wrap: wrap; }
.unlock-form label { display: flex; flex-direction: column; gap: var(--space-1); color: var(--text-muted); font-size: var(--font-sm); }
.unlock-form input { min-width: 240px; padding: var(--space-2); border-radius: var(--radius-sm); border: 1px solid var(--border-strong); background: var(--surface-raised); color: var(--text); }
#console { display: none; }
#console.visible { display: block; }

.console-body { padding: var(--space-5) var(--space-6) var(--space-6); }

/* ============================================================
   KPI CARDS
   ============================================================ */
.kpi-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: var(--space-3); margin-bottom: var(--space-5); }
.kpi-card {
  background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-md);
  padding: var(--space-3) var(--space-4); box-shadow: var(--shadow-md);
}
.kpi-card-label { font-size: var(--font-sm); color: var(--text-muted); display:flex; align-items:center; gap:4px; }
.kpi-card-value { font-size: 1.75rem; font-weight: 700; margin-top: var(--space-1); }
.kpi-card-context { font-size: 0.75rem; color: var(--text-faint); margin-top: 4px; }
.kpi-icon { width: 8px; height: 8px; border-radius: 2px; display: inline-block; }
.kpi-icon-neutral { background: var(--accent-2); }
.kpi-icon-success { background: var(--success); }
.kpi-icon-warning { background: var(--warning); }
.kpi-icon-danger { background: var(--danger); }
.kpi-card-value.value-success { color: #4ade80; }
.kpi-card-value.value-warning { color: #fbbf24; }
.kpi-card-value.value-danger { color: #f87171; }
.kpi-breakdown-rows { margin-top: var(--space-1); display: flex; flex-direction: column; gap: 4px; }
.kpi-breakdown-row { display: flex; justify-content: space-between; align-items: baseline; font-size: var(--font-sm); }
.kpi-breakdown-source { color: var(--text-muted); }
.kpi-breakdown-count { font-weight: 700; }

.ranking-mode {
  display: flex; align-items: center; flex-wrap: wrap; gap: var(--space-2);
  margin: calc(-1 * var(--space-2)) 0 var(--space-4); padding: var(--space-2) var(--space-3);
  background: rgba(37,99,235,0.10); border: 1px solid rgba(96,165,250,0.35);
  border-radius: var(--radius-md); color: #bfdbfe; font-size: var(--font-sm);
}
.ranking-version { font-weight: 800; color: #fff; }
.ranking-pending { color: var(--text-muted); }

/* ============================================================
   RUN PANEL
   ============================================================ */
.run-panel { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-md); padding: var(--space-4); margin-bottom: var(--space-4); box-shadow: var(--shadow-md); }
.run-panel-empty { color: var(--text-muted); font-size: var(--font-sm); }
.run-panel-top { display: flex; justify-content: space-between; align-items: flex-start; flex-wrap: wrap; gap: var(--space-3); }
.run-panel-label { font-size: 0.75rem; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.04em; }
.run-panel-id { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: var(--font-sm); color: var(--text); margin: 4px 0 var(--space-2); word-break: break-all; }
.run-panel-controls { display: flex; gap: var(--space-2); flex-wrap: wrap; }
.run-panel-meta { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: var(--space-3); margin-top: var(--space-4); padding-top: var(--space-3); border-top: 1px solid var(--border); }
.run-meta-item { min-width: 0; }
.run-meta-label { display: block; font-size: 0.7rem; color: var(--text-faint); text-transform: uppercase; letter-spacing: 0.03em; }
.run-meta-value { display: block; font-size: var(--font-sm); margin-top: 4px; overflow-wrap: anywhere; word-break: break-word; }
.run-details { margin-top: var(--space-3); padding: var(--space-3); background: var(--bg); border-radius: var(--radius-sm); font-size: var(--font-sm); border: 1px solid var(--border); }
.run-details dt { color: var(--text-muted); font-size: 0.75rem; margin-top: var(--space-2); }
.run-details dd { margin: 4px 0 0; }

.status-badge { display: inline-flex; align-items: center; padding: 4px 8px; border-radius: 999px; font-size: 0.75rem; font-weight: 700; text-transform: capitalize; }
.status-queued { background: rgba(148,163,184,0.15); color: #cbd5e1; }
.status-running { background: rgba(99,102,241,0.18); color: #a5b4fc; }
.status-succeeded { background: var(--success-bg); color: #4ade80; }
.status-partial { background: var(--warning-bg); color: #fbbf24; }
.status-failed { background: var(--danger-bg); color: #f87171; }
.status-deduplicated { background: rgba(148,163,184,0.15); color: #cbd5e1; }
.status-expired { background: rgba(148,163,184,0.15); color: #cbd5e1; }
.status-unknown { background: rgba(148,163,184,0.15); color: #cbd5e1; }

/* ============================================================
   BANNERS
   ============================================================ */
.banner { margin: 0 0 var(--space-4); padding: var(--space-3) var(--space-4); border-radius: var(--radius-md); font-size: var(--font-sm); font-weight: 500; }
.banner-partial { background: var(--warning-bg); color: #fde68a; border: 1px solid rgba(245,158,11,0.4); }
.banner-failed { background: var(--danger-bg); color: #fecaca; border: 1px solid rgba(239,68,68,0.4); }

/* ============================================================
   FILTER BAR
   ============================================================ */
.filter-bar {
  display: flex; flex-wrap: wrap; align-items: end; gap: var(--space-3);
  background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-md);
  padding: var(--space-3) var(--space-4); margin-bottom: var(--space-4);
}
/* min-width: 0 overrides the flex-item default of min-width: auto, which
   otherwise refuses to shrink a column below its content's natural width --
   the actual cause of the filter bar overflowing the viewport on narrow
   screens (a <select>'s widest <option> text, not the label text, was
   setting that natural width). */
.filter-field { display: flex; flex-direction: column; gap: 4px; font-size: var(--font-sm); min-width: 0; }
.filter-field-inset { margin-left: 8px; }
.filter-label { font-size: 0.75rem; color: var(--text-muted); }
.filter-search { flex: 1 1 220px; min-width: 180px; }
.filter-bar input[type="search"], .filter-bar select {
  background: var(--bg); color: var(--text); border: 1px solid var(--border-strong);
  border-radius: var(--radius-sm); padding: 4px 8px; font-size: var(--font-sm); font-family: inherit;
  width: 100%; box-sizing: border-box; min-width: 0;
}
.filter-checkbox { flex-direction: row; align-items: center; gap: 4px; }
.filter-checkbox input { accent-color: var(--accent-2); }
.filter-bar { display: block; padding: var(--space-3); }
.clarity-filter-primary {
  display: grid;
  grid-template-columns: minmax(260px, 1.8fr) minmax(180px, 1fr) minmax(135px, .7fr) minmax(150px, .8fr) minmax(145px, .75fr) minmax(190px, 1fr);
  gap: var(--space-3);
  align-items: end;
}
.clarity-filter-primary .filter-search { min-width: 0; }
.clarity-filter-toggle-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  margin-top: var(--space-2);
  padding-top: var(--space-2);
  border-top: 1px solid var(--border);
}
.clarity-filter-summary { color: var(--text-faint); font-size: .75rem; }
.clarity-filter-advanced {
  display: grid;
  grid-template-columns: repeat(3, minmax(150px, 1fr));
  gap: var(--space-3);
  align-items: end;
  margin-top: var(--space-3);
  padding-top: var(--space-3);
  border-top: 1px solid var(--border);
}
.clarity-filter-advanced.hidden { display: none !important; }
/* The console keeps a persistent sidebar, so its content column reaches the
   compact layout breakpoint before the full viewport does. */
@media (max-width: 1420px) {
  .clarity-filter-primary { grid-template-columns: minmax(240px, 1.5fr) repeat(3, minmax(150px, 1fr)); }
  .clarity-filter-advanced { grid-template-columns: repeat(2, minmax(150px, 1fr)); }
}
@media (max-width: 1100px) {
  .clarity-filter-primary, .clarity-filter-advanced { grid-template-columns: 1fr 1fr; }
  .clarity-filter-primary .filter-search { grid-column: 1 / -1; }
}
@media (max-width: 560px) {
  .clarity-filter-primary, .clarity-filter-advanced { grid-template-columns: 1fr; }
  .clarity-filter-primary .filter-search { grid-column: auto; }
  .clarity-filter-toggle-row { align-items: flex-start; flex-direction: column; }
}

/* ============================================================
   JOBS SECTION
   ============================================================ */
.jobs-section-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: var(--space-3); flex-wrap: wrap; gap: var(--space-2); }
.jobs-section-header h2 { margin: 0; font-size: var(--font-lg); flex: 0 0 auto; }
.jobs-heading-group { display: flex; flex-direction: column; gap: var(--space-2); }
.scope-selector { display: flex; flex-wrap: wrap; gap: var(--space-2); align-items: center; }
.scope-option {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 4px 8px; border-radius: 999px; border: 1px solid var(--border-strong);
  background: var(--surface-raised); color: var(--text); font-size: 0.75rem; font-weight: 700;
  cursor: pointer;
  /* UI6.3: the scope-selector pills act as a keyboard-navigable tab group
     (role="tab"-like, arrow-key/Enter/Space activation -- see
     wireScopeEvents in the assembled console JavaScript) rather than inline text, so they need
     a real touch target. Measured 27px tall in a live browser before this
     fix. */
  min-height: 44px;
}
.scope-option:hover { border-color: var(--accent-2); }
.scope-option.is-active {
  border-color: var(--accent-2);
  box-shadow: inset 0 0 0 1px rgba(37,99,235,0.45);
}
.scope-option.is-active .scope-option-label::after {
  content: " (Active)";
  font-weight: 800;
}
.scope-option-label { white-space: nowrap; }
.scope-option-count { color: var(--text-faint); font-weight: 600; }
.jobs-range-label { color: var(--text-muted); font-size: var(--font-sm); flex: 1 1 auto; }
.jobs-context-label { color: var(--text-faint); font-size: 0.75rem; flex: 1 1 100%; }
.active-filter-chips { display: flex; flex-wrap: wrap; gap: 4px; flex: 1 1 100%; }
.active-filter-chip {
  display: inline-flex; align-items: center; gap: 4px;
  border: 1px solid var(--border-strong); border-radius: 999px;
  padding: 4px 8px; font-size: 0.72rem; color: var(--text-muted);
  background: var(--surface-raised);
}
.jobs-list { display: flex; flex-direction: column; gap: var(--space-3); }
.export-controls { display: flex; align-items: end; gap: var(--space-2); }
.export-controls select { background: var(--bg); color: var(--text); border: 1px solid var(--border-strong); border-radius: var(--radius-sm); padding: 4px 8px; font-size: var(--font-sm); font-family: inherit; }
.export-status { color: var(--text-faint); font-size: 0.72rem; min-width: 150px; }
.pagination-wrap { display: flex; justify-content: center; margin: var(--space-3) 0; }
.pagination { display: flex; align-items: center; gap: var(--space-3); }
.pagination-status { color: var(--text-muted); font-size: var(--font-sm); min-width: 110px; text-align: center; }
.jobs-empty { color: var(--text-muted); padding: var(--space-5); text-align: center; background: var(--surface); border: 1px dashed var(--border-strong); border-radius: var(--radius-md); }

/* ============================================================
   JOB CARD â€” restored July 21 recommendation hierarchy
   ============================================================ */
.job-card {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-4);
  background: var(--surface);
  border: 1px solid var(--border);
  border-left: 5px solid var(--border-strong);
  border-radius: var(--radius-lg);
  padding: var(--space-5);
  box-shadow: var(--shadow-md);
}
.job-card:hover { border-color: var(--border-strong); }
.job-card-tier-top,
.job-card-tier-applied { border-left-color: #34d399; }
  .job-card-tier-strong { border-left-color: var(--accent); }
.job-card-tier-adjacent { border-left-color: #f59e0b; }
.job-card-tier-verify { border-left-color: #c084fc; }
.job-card-tier-blocked,
.job-card-tier-skip { border-left-color: var(--danger); }

.job-card-fit-green { border-left-color: #34d399; }
.job-card-fit-yellow { border-left-color: #f59e0b; }
.job-card-fit-blocked { border-left-color: var(--danger); }

.job-identity { display: flex; gap: var(--space-3); min-width: 0; }
.company-tile {
  flex: 0 0 48px; width: 48px; height: 48px; border-radius: var(--radius-sm);
  display: flex; align-items: center; justify-content: center;
  font-weight: 700; font-size: var(--font-base); color: #fff;
}
.company-color-0 { background: #6366f1; }
.company-color-1 { background: #2563eb; }
.company-color-2 { background: #0ea5e9; }
.company-color-3 { background: #14b8a6; }
.company-color-4 { background: #22c55e; }
.company-color-5 { background: #f59e0b; }
.company-color-6 { background: #ef4444; }
.company-color-7 { background: #a855f7; }
.job-identity-text { min-width: 0; flex: 1; }
.job-title {
  margin: 0 0 4px;
  color: var(--text);
  font-size: 1.1rem;
  font-weight: 800;
  line-height: 1.3;
  overflow-wrap: anywhere;
}
.job-company { color: var(--text-muted); font-size: var(--font-sm); margin-bottom: var(--space-2); }
.job-meta-line { display: flex; flex-wrap: wrap; gap: 4px; align-items: center; }
.pill {
  display: inline-flex; align-items: center; padding: 4px 8px; border-radius: 999px;
  font-size: 0.7rem; font-weight: 600; background: transparent;
  border: 1px solid var(--border-strong); color: var(--text-muted);
}
.pill-remote { color: #4ade80; border-color: rgba(74,222,128,0.35); }
  .pill-hybrid { color: var(--accent); border-color: rgba(99,102,241,0.35); }
.pill-source { text-transform: uppercase; letter-spacing: 0.02em; }
.job-date-line { margin-top: 4px; color: var(--text-faint); font-size: 0.75rem; }
.pagination { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; gap: 4px; width: 100%; }
.pagination-button { min-width: 44px; min-height: 44px; padding: 8px 12px; border: 1px solid var(--border-strong); border-radius: 6px; background: var(--surface); color: var(--text); cursor: pointer; }
.pagination-button:hover:not(:disabled) { border-color: var(--accent-2); }
.pagination-button.is-current { background: var(--accent); border-color: var(--accent); color: white; font-weight: 800; }
.pagination-button:disabled { opacity: 0.45; cursor: not-allowed; }
.pagination-ellipsis { min-width: 24px; text-align: center; color: var(--text-faint); }
.job-identity-comp { margin-top: var(--space-3); font-weight: 800; color: var(--text); }
.job-identity-comp.comp-missing { color: var(--text-muted); font-size: var(--font-sm); font-weight: 600; }

.job-decision {
  padding: var(--space-4);
  border: 1px solid rgba(52,211,153,0.28);
  border-radius: var(--radius-md);
  background: rgba(16,185,129,0.08);
}
.job-card-fit-green .job-decision { border-color: rgba(52,211,153,0.28); background: rgba(16,185,129,0.08); }
.job-card-fit-yellow .job-decision { border-color: rgba(245,158,11,0.28); background: rgba(245,158,11,0.05); }
.job-card-fit-blocked .job-decision { border-color: rgba(239,68,68,0.30); background: rgba(239,68,68,0.06); }
.decision-primary {
  display: flex; align-items: center; gap: var(--space-2);
  color: #6ee7b7; font-size: 0.75rem; font-weight: 850;
  letter-spacing: 0.05em; text-transform: uppercase;
}
.decision-fit-green { color: #6ee7b7; }
.decision-fit-yellow { color: #fbbf24; }
.decision-fit-blocked { color: #fca5a5; }
.decision-primary-strong { color: #93c5fd; }
.decision-primary-adjacent { color: #fbbf24; }
.decision-primary-verify { color: #d8b4fe; }
.decision-primary-blocked,
.decision-primary-skip { color: #fca5a5; }
.decision-icon {
  display: inline-flex; align-items: center; justify-content: center;
  width: 24px; height: 24px; border: 1px solid currentColor; border-radius: 50%;
}
.decision-score { display: flex; align-items: baseline; gap: var(--space-2); margin-top: var(--space-3); }
.decision-score-number { color: var(--text); font-size: 2.7rem; line-height: 1; font-weight: 850; }
.decision-score-label { color: var(--text-muted); font-size: var(--font-base); font-weight: 700; }
.decision-score-math { margin-top: var(--space-2); color: var(--text-muted); font-size: 0.8125rem; }
.decision-signals {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-3); margin-top: var(--space-4); padding-top: var(--space-3);
  border-top: 1px solid rgba(148,163,184,0.18);
}
.decision-signal { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.decision-signal-label {
  color: var(--text-faint); font-size: 0.66rem; font-weight: 800;
  letter-spacing: 0.04em; text-transform: uppercase;
}
.decision-signal-value { color: var(--text); font-size: 0.8125rem; font-weight: 700; overflow-wrap: anywhere; }

.job-card-bottom {
  display: grid; grid-template-columns: minmax(0, 1fr) auto;
  gap: var(--space-2) var(--space-4); align-items: center;
}
.job-resume,
.job-recommendation { color: var(--text-muted); font-size: 0.78rem; overflow-wrap: anywhere; }
.job-recommendation { grid-column: 1; text-transform: none; }
.job-card-bottom .btn { grid-column: 2; grid-row: 1 / span 2; }

.breakdown-reconciliation { font-family: ui-monospace, monospace; font-size: 0.8125rem; margin-bottom: var(--space-2); }
.breakdown-deductions { list-style: none; padding: 0; margin: 0 0 var(--space-2); font-size: 0.8125rem; }
.breakdown-deductions li { margin-top: 4px; padding-left: var(--space-2); border-left: 2px solid var(--border-strong); }
.job-card-footer { border-top: 1px solid var(--border); padding-top: var(--space-2); }
details.breakdown,
details.degree-breakdown { font-size: var(--font-sm); }
details.breakdown summary,
details.degree-breakdown summary { cursor: pointer; color: var(--accent-2); font-weight: 600; }
details.breakdown summary:hover,
details.degree-breakdown summary:hover { text-decoration: underline; }
details.breakdown pre {
  white-space: pre-wrap; background: var(--bg); padding: var(--space-3); border-radius: var(--radius-sm);
  border: 1px solid var(--border); margin-top: var(--space-2); font-family: ui-monospace, monospace; font-size: 0.8125rem;
}
.degree-line { margin-top: var(--space-2); color: var(--text-muted); overflow-wrap: anywhere; }

@media (max-width: 560px) {
  .job-card { padding: var(--space-4); }
  .decision-signals { grid-template-columns: 1fr; }
  .job-card-bottom { grid-template-columns: 1fr; }
  .job-card-bottom .btn { grid-column: 1; grid-row: auto; justify-self: stretch; text-align: center; }
}

/* ============================================================
   DIAGNOSTICS
   ============================================================ */
.diagnostics-panel { margin-top: var(--space-5); font-size: var(--font-sm); color: var(--text-muted); }
.diagnostics-panel summary { cursor: pointer; }
#diagnostics { margin-top: var(--space-2); background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-sm); padding: var(--space-3); }
.diag-row { display: flex; justify-content: space-between; padding: 4px 0; }

/* ============================================================
   RESPONSIVE
   ============================================================ */
/* UI7.2: was max-width:760px, which missed the frozen 768px tablet
   acceptance viewport (UI0.10) by 8px -- the persistent 260px sidebar plus
   the fixed-min-width filter grid then overflowed the viewport by ~46px at
   exactly 768px. Raised to include 768px. */
@media (max-width: 768px) {
  .sidebar-toggle { display: block; position: absolute; }
  .app-shell { display: block; }
  .main { width: 100%; }
  .sidebar {
    position: fixed; z-index: 30; left: 0; top: 0; transform: translateX(-100%);
    transition: transform var(--transition); box-shadow: var(--shadow-lg);
  }
  .sidebar.open { transform: translateX(0); }
  .sidebar-brand { min-height: 40px; padding-left: 52px; }
  .top-header { min-height: 64px; padding: var(--space-4) var(--space-4) var(--space-3) 56px; }
  .console-body { padding: var(--space-3) var(--space-4) var(--space-5); }
  .kpi-grid { grid-template-columns: repeat(2, 1fr); }
  .filter-bar { flex-direction: column; align-items: stretch; }
  .jobs-section-header { align-items: stretch; }
  .jobs-range-label, .jobs-context-label { order: 2; }
  .active-filter-chips { order: 3; }
  .export-controls { order: 4; width: 100%; flex-wrap: wrap; align-items: stretch; }
  .export-controls .filter-field { flex: 1 1 180px; }
  .export-controls .btn { width: 100%; }
  .export-status { min-width: 0; width: 100%; }
  .pagination { width: 100%; justify-content: space-between; gap: var(--space-2); }
  .scope-selector { width: 100%; }
  .scope-option { flex: 1 1 44%; justify-content: space-between; }
}

/* ============================================================
   RECRUITER SIGNAL WATCH (manual-import MVP)
   ============================================================ */
.recruiter-scope-note {
  margin-bottom: var(--space-4); padding: var(--space-3) var(--space-4);
  background: var(--surface-raised); border: 1px solid var(--border-strong);
  border-radius: var(--radius-md); font-size: var(--font-sm); color: var(--text-muted);
}
.recruiter-panel {
  margin-bottom: var(--space-5); padding: var(--space-4);
  background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-md);
}
.recruiter-panel-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: var(--space-3); }
.recruiter-panel-header h2 { font-size: 1rem; margin: 0; }
.recruiter-form { display: flex; flex-wrap: wrap; gap: var(--space-2); margin-top: var(--space-3); }
.recruiter-form input, .recruiter-form textarea {
  flex: 1 1 200px; padding: var(--space-2); border-radius: var(--radius-sm);
  border: 1px solid var(--border-strong); background: var(--surface-raised); color: var(--text);
  font-family: inherit; font-size: var(--font-sm);
}
.saved-search-row {
  display: flex; align-items: center; justify-content: space-between; gap: var(--space-3);
  padding: var(--space-2) 0; border-bottom: 1px solid var(--border);
}
.saved-search-row:last-child { border-bottom: none; }
.saved-search-name { font-weight: 600; }
.saved-search-query { color: var(--text-faint); font-size: 0.8rem; }
.recruiter-post-card {
  padding: var(--space-3); border: 1px solid var(--border); border-radius: var(--radius-md);
  margin-bottom: var(--space-3);
}
.priority-badge { display: inline-flex; padding: 4px 8px; border-radius: 999px; font-size: 0.75rem; font-weight: 700; }
.priority-act_now { background: var(--success-bg); color: #4ade80; }
.priority-review { background: var(--warning-bg); color: #fbbf24; }
.priority-verify { background: rgba(96,165,250,0.15); color: #93c5fd; }
.priority-ignore { background: var(--danger-bg); color: #f87171; }
.recruiter-post-reasons { margin: var(--space-2) 0 0; padding-left: 1.2rem; color: var(--text-faint); font-size: 0.8rem; }

﻿/* 20-cutover: cutover specific banners and panels */

﻿/* 30-public: public credibility surface overrides */

/* Final invariant pass: compact cards without changing tap targets. */
.job-card { gap: .56rem; }
.job-actions-refined { margin-top: .04rem; }

body[data-job-ops-surface="member"] .sidebar{background:linear-gradient(180deg,#111827 0%,#0b1220 100%)}
.demo-notice{padding:.8rem 1rem;border:1px solid #f59e0b;border-radius:var(--radius-md);background:rgba(245,158,11,.12);color:var(--text-secondary)}.demo-notice strong{color:#fbbf24}
body[data-job-ops-surface="member"] .console-body{max-width:1500px;margin:0 auto}.hidden{display:none!important}
.account-button{display:flex;align-items:center;gap:.6rem;border:1px solid var(--border);border-radius:999px;background:var(--surface);color:var(--text-primary);padding:.4rem .75rem;cursor:pointer;font:inherit}
.account-button>span:first-child{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--accent);color:#fff;font-weight:700}.member-scout{display:grid;gap:1rem}
.member-hero{padding:1.4rem 1.5rem;border:1px solid var(--border);border-radius:var(--radius-lg);background:linear-gradient(125deg,rgba(37,99,235,.22),rgba(15,23,42,.25))}
.member-hero h1,.member-onboarding h1{margin:.2rem 0 .35rem;font-size:clamp(1.35rem,3vw,2.1rem)}.member-hero p{margin:0;color:var(--text-secondary)}
.experience-mode-chip,.sample-profile-badge{display:inline-flex;align-items:center;margin:0 .45rem .45rem 0;padding:.24rem .55rem;border:1px solid var(--border-strong);border-radius:999px;color:var(--accent-light);font-size:.68rem;font-weight:800;letter-spacing:.09em}.sample-profile-badge{border-color:#f59e0b;color:#fbbf24;background:rgba(245,158,11,.1)}.sidebar-mode{margin-top:.45rem;color:var(--text-muted);font-size:.68rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.eyebrow{margin:0;color:var(--accent-light);font-size:.72rem;font-weight:800;letter-spacing:.13em}.member-onboarding{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.7rem 1rem;border:1px solid var(--accent);border-radius:var(--radius-lg);background:rgba(37,99,235,.1)}
.member-onboarding h2{margin:.15rem 0;font-size:1rem}.member-onboarding p:last-child{margin:.2rem 0 0;color:var(--text-secondary);font-size:.86rem}.member-tabs{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.5rem;position:sticky;top:.5rem;z-index:8;padding:.5rem;background:rgba(15,23,42,.94);backdrop-filter:blur(12px);border-radius:var(--radius-lg)}
.member-tab{border:1px solid var(--border);border-radius:var(--radius-md);background:var(--surface);color:var(--text-secondary);padding:.65rem .4rem;cursor:pointer;font-weight:700}.member-tab[aria-selected="true"]{border-color:var(--accent);background:rgba(37,99,235,.18);color:var(--text-primary)}.member-tab-count{display:block;font-size:1.15rem;color:var(--text-primary)}
.member-toolbar{display:grid;grid-template-columns:minmax(240px,2fr) repeat(3,1fr);gap:.75rem;padding:1rem;border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--surface)}.member-toolbar input,.member-toolbar select{width:100%;padding:.65rem;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--bg);color:var(--text-primary);color-scheme:dark;font:inherit}.member-message{min-height:1.2rem;color:var(--warning)}.member-load-more{text-align:center;padding:1rem}
.member-card{position:relative;overflow:hidden}.member-badges,.member-actions{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}.member-badge{padding:.22rem .5rem;border-radius:999px;background:rgba(59,130,246,.13);color:var(--accent-light);font-size:.78rem;font-weight:700}.member-actions{margin-top:.25rem}.member-actions .btn{min-width:92px}.fit-details{color:var(--text-secondary);border-top:1px solid var(--border);padding-top:.75rem}.fit-details summary{color:var(--accent-light);font-weight:700;cursor:pointer}.fit-evidence-group h4{margin:.8rem 0 .25rem;color:var(--text-primary);font-size:.78rem;text-transform:uppercase;letter-spacing:.04em}.fit-evidence-group ul{margin:.25rem 0;padding-left:1.2rem}
.member-card.fit-recommended{border-left:4px solid #22c55e}.member-card.fit-stretch{border-left:4px solid #f59e0b}.member-card.fit-explore,.member-card.fit-unscored{border-left:4px solid #64748b}.member-card.fit-recommended .job-decision{border-color:rgba(34,197,94,.28);background:rgba(34,197,94,.07)}.member-card.fit-stretch .job-decision{border-color:rgba(245,158,11,.28);background:rgba(245,158,11,.06)}.member-card.fit-explore .job-decision,.member-card.fit-unscored .job-decision{border-color:rgba(100,116,139,.34);background:rgba(100,116,139,.08)}.decision-primary.fit-recommended{color:#86efac}.decision-primary.fit-stretch{color:#fbbf24}.decision-primary.fit-explore,.decision-primary.fit-unscored{color:#cbd5e1}.listing-quality{margin-top:.45rem;color:var(--text-secondary);font-size:.82rem}.listing-quality-signals{margin-top:.2rem;color:var(--text-muted);font-size:.75rem}.fit-component{display:flex;justify-content:space-between;gap:1rem;padding:.28rem 0;border-bottom:1px solid var(--border)}.location-detail{font-size:.78rem;color:var(--text-secondary)}.location-detail summary{cursor:pointer;color:var(--accent-light)}
.member-dialog{width:min(680px,calc(100vw - 2rem));max-height:calc(100vh - 2rem);overflow:auto;border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--surface);color:var(--text-primary);padding:1.2rem;box-shadow:0 24px 80px rgba(0,0,0,.5)}.member-dialog::backdrop{background:rgba(2,6,23,.78)}.dialog-heading,.action-row{display:flex;justify-content:space-between;align-items:center;gap:.75rem}.dialog-heading h2{margin:0}.account-tabs{display:flex;gap:.5rem;margin:1rem 0;border-bottom:1px solid var(--border);padding-bottom:.75rem}.account-tabs button{border:0;background:transparent;color:var(--text-secondary);padding:.5rem;cursor:pointer;font:inherit}.account-tabs button[aria-selected="true"]{color:var(--accent-light);font-weight:700}
.account-form{display:grid;gap:1rem}.account-form label,.account-form fieldset{display:grid;gap:.4rem;color:var(--text-secondary)}.account-form input,.account-form textarea,.account-form select{width:100%;background:var(--background);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text-primary);padding:.7rem;font:inherit}.account-form fieldset{grid-template-columns:repeat(3,1fr);border:1px solid var(--border);border-radius:var(--radius-sm)}.account-form fieldset label,.checkbox-label{display:flex!important;align-items:center;gap:.4rem}.account-form input[type="checkbox"]{width:auto}.account-danger{margin-top:1.5rem;padding-top:1rem;border-top:1px solid var(--border)}
.field-help{margin:-.5rem 0 .25rem;color:var(--text-secondary);font-size:.82rem}#openResumeWorkspace{margin:1rem 0}.form-divider{display:flex;align-items:center;gap:.7rem;margin:1rem 0;color:var(--text-secondary);font-size:.78rem;text-transform:uppercase}.form-divider:before,.form-divider:after{content:"";height:1px;flex:1;background:var(--border)}.demo-sample{margin-top:1rem;padding:1rem;border:1px solid var(--border);border-radius:var(--radius-md);background:rgba(100,116,139,.08)}.demo-sample p{margin:0 0 .75rem;color:var(--text-secondary)}
.application-history{margin-top:1.25rem;padding-top:1rem;border-top:1px solid var(--border)}.application-history h3{margin:0 0 .5rem;font-size:.9rem}.application-history-row{padding:.4rem 0;color:var(--text-secondary);border-bottom:1px solid var(--border)}.filter-checkbox{display:flex!important;align-items:center;gap:.45rem}.filter-checkbox input{width:auto}
@media(max-width:760px){.member-toolbar{grid-template-columns:1fr}.member-onboarding{align-items:flex-start;flex-direction:column}.member-tabs{overflow-x:auto;display:flex}.member-tab{min-width:88px}.member-actions{display:grid;grid-template-columns:1fr 1fr}.member-actions .btn{width:100%}.account-button #accountName{display:none}.account-form fieldset{grid-template-columns:1fr}.member-hero{padding:1rem}.console-body{padding-inline:.75rem!important}}
.market-receipt{color:var(--text-muted);font-size:.8rem}.jobs-empty .btn{margin-top:.75rem}.pill-salary{border-color:rgba(34,197,94,.4);background:rgba(34,197,94,.12);color:#86efac}.pill-salary-undisclosed{background:rgba(100,116,139,.1);color:var(--text-muted)}.member-card.fit-unscored{border-left-color:var(--border)}

/* Market trust / gate / priority / freshness (customer UX) */
.member-decision-meta{display:flex;flex-wrap:wrap;gap:.4rem;margin:.35rem 0 .15rem}
.pill-gate-ok{border-color:rgba(34,197,94,.45);background:rgba(34,197,94,.12);color:#86efac}
.pill-gate-verify{border-color:rgba(245,158,11,.45);background:rgba(245,158,11,.12);color:#fbbf24}
.pill-gate-blocked{border-color:rgba(239,68,68,.45);background:rgba(239,68,68,.12);color:#fca5a5}
.pill-gate-na,.pill-priority-na{border-color:rgba(100,116,139,.4);background:rgba(100,116,139,.1);color:var(--text-muted)}
.pill-priority{border-color:rgba(59,130,246,.4);background:rgba(59,130,246,.12);color:var(--accent-light)}
.pill-freshness-aging{border-color:rgba(245,158,11,.5);background:rgba(245,158,11,.1);color:#fbbf24}
.pill-freshness-stale{border-color:rgba(239,68,68,.5);background:rgba(239,68,68,.12);color:#fca5a5;font-weight:700}
.member-trust-row{display:flex;flex-wrap:wrap;gap:.35rem;margin:.45rem 0 .2rem}
.trust-chip{display:inline-flex;align-items:center;padding:.18rem .45rem;border-radius:999px;font-size:.7rem;font-weight:650;border:1px solid var(--border);color:var(--text-secondary)}
.trust-sourced{border-color:rgba(56,189,248,.35);background:rgba(56,189,248,.08);color:#7dd3fc}
.trust-computed{border-color:rgba(167,139,250,.35);background:rgba(167,139,250,.1);color:#c4b5fd}
.trust-note{border-color:rgba(100,116,139,.35);background:rgba(100,116,139,.08);color:var(--text-muted)}
.member-low-fit-note{margin:.35rem 0 0;color:var(--text-secondary);font-size:.82rem;line-height:1.35}
.member-seen-note{margin:.35rem 0 0;color:var(--text-secondary);font-size:.82rem;line-height:1.35}
.jobs-loading,.jobs-error{padding:1.1rem 1rem;border:1px solid var(--border);border-radius:var(--radius-md);background:rgba(15,23,42,.45)}
.jobs-error{border-color:rgba(239,68,68,.35)}
.jobs-error .btn{margin-top:.75rem}

.stale-banner{margin:.4rem 0;padding:.5rem .75rem;border:1px solid rgba(245,158,11,.5);background:rgba(245,158,11,.12);color:var(--text);border-radius:8px;font-size:.85rem;line-height:1.35}
.filter-save-default{display:flex;flex-direction:column;gap:.35rem;align-items:flex-start;margin:.25rem 0}
.filter-save-default .field-help{margin:0}


:root{
  --js-bg:#07101d;
  --js-panel:#0e1929;
  --js-panel-2:#111f32;
  --js-text:#f7f9fc;
  --js-muted:#aebbd0;
  --js-line:#263750;
  --js-accent:#406cd2;
  --accent:var(--js-accent);
  --js-accent-2:#8db0ff;
  --js-ok:#72d6ad;
  --js-danger:#ffaaa5;
  --js-focus:#a9c2ff;
  --js-surface-soft:rgba(255,255,255,.035);
  --js-shadow:0 22px 60px rgba(0,0,0,.28);
  --js-radius-sm:10px;
  --js-radius-md:14px;
  --js-radius-lg:18px;
  --js-control-min:44px;
  --js-z-skip:10000;
}

.skip-link{position:fixed;left:12px;top:10px;z-index:var(--js-z-skip);padding:10px 14px;border-radius:var(--js-radius-sm);background:#fff;color:var(--js-bg);font-weight:800;transform:translateY(-160%)}.skip-link:focus{transform:translateY(0)}
/* K167-03: :where() is zero-specificity by design so this focus ring can
   apply broadly without fighting component selectors -- that same design
   choice means it has nothing to win on specificity, so !important is the
   only way it reliably outranks any component's own focus-visible rule. */
:where(a,button,input,select,textarea,summary):focus-visible{outline:3px solid var(--js-focus)!important;outline-offset:3px!important}
:where(input:not([type="checkbox"]):not([type="radio"]):not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="image"]),select,textarea){margin-block-end:8px}
.field-help{margin-block:0 .25rem}
/* K167-03: [aria-invalid] (0,1,0) must outrank .account-form input's
   (0,2,0) border in member.css, which this file cannot reorder itself
   around -- !important is the only reliable way to keep the error state
   visible regardless of which form the invalid field lives in. */
[aria-invalid="true"]{border-color:var(--js-danger)!important;box-shadow:0 0 0 3px rgba(255,170,165,.18)!important}.field-error{display:block;color:var(--js-danger);font-size:12px;font-weight:700;line-height:1.35;margin:-4px 0 10px}.field-error[hidden]{display:none}
.console-body,.member-scout,.member-destination,.jobs-section,.jobs-list,.job-card,.member-card{min-width:0}.console-body,.member-scout{overflow-x:hidden}.job-title,.job-company,.member-card,.jobs-empty,.member-message{overflow-wrap:anywhere}
.quick-setup{margin:0 0 22px;padding:22px;border:1px solid var(--js-line);border-radius:var(--js-radius-lg);background:linear-gradient(135deg,rgba(91,140,255,.12),rgba(17,31,50,.92));box-shadow:var(--js-shadow)}.quick-setup.hidden{display:none}.quick-setup-head{display:flex;justify-content:space-between;gap:18px;align-items:flex-start;margin-bottom:16px}.quick-setup-head h2{margin:3px 0 6px;font-size:24px}.quick-setup-head p{margin:0;color:var(--js-muted);max-width:760px}.quick-setup-progress{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.setup-step{display:grid;grid-template-columns:32px 1fr;gap:10px;align-items:start;padding:14px;border:1px solid var(--js-line);border-radius:var(--js-radius-md);background:rgba(7,16,29,.62)}.setup-step-num{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#172946;color:var(--js-accent-2);font-weight:800}.setup-step strong{display:block}.setup-step small{display:block;color:var(--js-muted);margin-top:3px;line-height:1.35}.setup-step.done{border-color:rgba(114,214,173,.5)}.setup-step.done .setup-step-num{background:rgba(114,214,173,.18);color:var(--js-ok)}.setup-step.current{border-color:rgba(91,140,255,.65)}.quick-setup-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}.quick-setup-actions .btn{min-height:var(--js-control-min)}.quick-setup-demo{display:none}.quick-setup.demo-mode .quick-setup-standard{display:none}.quick-setup.demo-mode .quick-setup-demo{display:block}.quick-setup.demo-mode .quick-setup-progress{display:none}
.nav-item{min-height:48px}.nav-copy{display:flex;flex-direction:column;align-items:flex-start;gap:1px;text-align:left}.nav-copy strong{font-size:14px}.nav-copy small{font-size:11px;line-height:1.2;color:var(--js-muted);font-weight:500}.sidebar-section-label{padding:12px 14px 6px;color:var(--js-muted);font-size:10px;font-weight:800;letter-spacing:.14em}.sidebar-section .nav-item{width:100%}
/* K167-03: .member-card is the one selector in this group that genuinely
   needs !important -- member.css's .member-card.fit-recommended/.fit-stretch/
   etc. set border-left-color via a higher-specificity compound class
   (0,2,0), and that per-state color must keep winning over this shared
   border-color reset. The other selectors here (.member-hero,
   .member-toolbar, .member-dialog, .jobs-error, .jobs-empty) have no such
   contest in member.css and are kept in the same declaration only to avoid
   repeating the token; they ride along on the .member-card requirement. */
.member-hero,.member-toolbar,.member-dialog,.member-card,.jobs-error,.jobs-empty{border-color:var(--js-line)!important}.member-hero{background:linear-gradient(135deg,rgba(91,140,255,.13),rgba(17,31,50,.88))!important}.btn-primary{background:var(--js-accent)!important}.account-button{min-width:48px;min-height:48px}
/* K167-03: .account-button.hidden must stay visually hidden (not display:none)
   so its 48px hit target still participates in layout during its fade, while
   overriding the global .hidden{display:none!important} utility in
   member.css -- since that utility is itself !important, matching
   importance here is required; specificity alone cannot win against it. */
.account-button.hidden{visibility:hidden!important;display:inline-flex!important;pointer-events:none}.account-button #accountName{display:none}
.member-dialog[open]{max-width:min(720px,calc(100vw - 28px));max-height:calc(100dvh - 28px);overflow:auto}.member-dialog[aria-labelledby] h2{scroll-margin-top:20px}.legal-inline{display:flex;gap:14px;flex-wrap:wrap;margin-top:14px;font-size:13px}.legal-inline a{color:var(--js-accent-2);font-weight:700}
.mission-intro{max-width:820px}.mission-boundary-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:22px 0}.mission-boundary{padding:18px;border:1px solid var(--js-line);border-radius:var(--js-radius-md);background:rgba(255,255,255,.025)}.mission-boundary h3{margin:0 0 10px}.mission-boundary ul{margin:0;padding-left:19px;color:var(--js-muted)}.mission-boundary li+li{margin-top:6px}.mission-boundary.no h3{color:var(--js-danger)}.mission-boundary.yes h3{color:var(--js-ok)}
.feature-intro{color:var(--js-muted);max-width:820px}.reopen-setup-row{margin-top:14px}
.member-toolbar input,.member-toolbar select,.account-form input,.account-form select,.account-form textarea{max-width:100%}.member-toolbar button,.member-toolbar input,.member-toolbar select,.member-dialog button,.member-dialog input,.member-dialog select{min-height:var(--js-control-min)}
.filter-toggle{display:none}.member-toolbar #memberToolbarFields{display:contents}
.sidebar-backdrop[hidden]{display:none}
/* The member shell keeps the navigation toggle usable at every viewport.
   Base console CSS only made it functional below 768px, which left desktop
   users with a visible fixed sidebar that the hamburger could not collapse. */
body[data-job-ops-surface="member"] .sidebar-toggle{display:block}
@media(min-width:769px){
  body[data-job-ops-surface="member"] .sidebar{
    transition:width var(--transition),flex-basis var(--transition),padding var(--transition),border-color var(--transition);
  }
  body[data-job-ops-surface="member"] .sidebar.collapsed{
    width:0;flex-basis:0;padding-left:0;padding-right:0;border-right:0;overflow:hidden;visibility:hidden;
  }
  body[data-job-ops-surface="member"] .sidebar-brand{padding-left:52px}
}
/* Kilo review follow-up: the only .jobs-loading height reservation lived
   inside the <=768px mobile block, so desktop viewports had no protection
   against the page/footer moving when "Loading jobs…" is replaced by real
   results. This base rule applies at every width; the mobile block's own
   112px rule (later in this file) still wins on narrow viewports via
   source order. */
.jobs-loading{min-height:320px;display:flex;align-items:center;justify-content:center}
@media(max-width:720px){.quick-setup{padding:17px;margin-bottom:16px}.quick-setup-head{display:block}.quick-setup-progress{grid-template-columns:1fr}.quick-setup-actions{display:grid;grid-template-columns:1fr}.quick-setup-actions .btn{width:100%}.mission-boundary-grid{grid-template-columns:1fr}.nav-copy small{font-size:12px}.member-toolbar #memberToolbarFields{min-width:0}.member-toolbar label{min-width:0}.member-toolbar input,.member-toolbar select{width:100%;min-width:0}.member-dialog[open]{width:calc(100vw - 20px);max-width:none;max-height:calc(100dvh - 20px);margin:10px}.member-actions{display:flex;flex-wrap:wrap}.member-actions .btn{min-height:var(--js-control-min)}.job-identity{min-width:0}.job-identity-text{min-width:0}}
/* K167-03: .member-scout has no padding rule elsewhere to out-specify, and
   .member-hero h1's own font-size in member.css is the same (0,1,1)
   specificity -- this file already loads after member.css, so source order
   alone would win. Both stay !important only because they sit inside a
   narrow 390px safety net meant to hold regardless of future rule
   reordering elsewhere in this cascade; token/specificity ownership isn't
   worth chasing for a two-declaration clamp guard. */
@media(max-width:390px){.member-scout{padding-left:12px!important;padding-right:12px!important}.quick-setup{border-radius:var(--js-radius-md)}.member-hero h1{font-size:clamp(30px,10vw,42px)!important}.member-tabs{overflow-x:auto;scrollbar-width:thin}.member-tab{min-width:92px}.member-actions .btn{width:100%}}
/* K167-03: the reduced-motion escape hatch must override animation/transition
   timing set by ANY selector anywhere in the cascade, including future ones
   -- this is the standard prefers-reduced-motion pattern and is expected to
   stay !important. */
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}

.member-footer{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin:28px 0 8px;padding:18px 4px 6px;border-top:1px solid var(--js-line, #243247);color:var(--js-muted, #8ea3bd);font-size:13px}
.member-footer .legal-links{display:flex;gap:16px;flex-wrap:wrap}
.member-footer .legal-links a{color:var(--js-accent-2, #7cc5ff);font-weight:700;text-decoration:none}
.member-footer .legal-links a:hover{text-decoration:underline}
.member-decision-meta .pill[title]{cursor:help}
@media(max-width:720px){.member-footer{flex-direction:column;align-items:flex-start;padding-top:16px}}

/* Mobile Market density: keep the controls, shrink the chrome around them. */
@media(max-width:720px){
  .quick-setup{padding:.875rem;margin-bottom:.75rem}
  .quick-setup-head{margin-bottom:.65rem}
  .quick-setup-head h2{font-size:1.25rem}
  .quick-setup-progress{gap:.4rem}
  .setup-step{grid-template-columns:28px 1fr;gap:.5rem;padding:.55rem}
  .setup-step-num{width:28px;height:28px}
  .setup-step small{display:none}
  .quick-setup-actions{grid-template-columns:1fr 1fr;gap:.5rem;margin-top:.65rem}
  .quick-setup-actions #setupBrowse{grid-column:1/-1}
  .member-hero{padding:.75rem!important}
  .member-hero h1{font-size:1.55rem!important;margin:.15rem 0 .25rem!important}
  .member-hero p{font-size:.85rem;line-height:1.35}
  .lifecycle-help{margin:.1rem 0;font-size:.76rem;line-height:1.3}
  .member-toolbar{grid-template-columns:1fr;padding:.75rem!important;gap:.5rem!important}
  .filter-toggle{display:flex!important;width:100%;align-items:center;justify-content:center}
  .member-toolbar #memberToolbarFields{display:none;grid-template-columns:1fr;gap:.55rem}
  .member-toolbar.filters-open #memberToolbarFields{display:grid}
  .member-toolbar .filter-field{gap:.25rem;margin:0}
  .member-toolbar .filter-label{font-size:.78rem;line-height:1.15}
  /* K167-03: `:not([type="checkbox"])` gives this selector (0,2,1), higher
     than member.css's `.member-toolbar input,.member-toolbar select`
     (0,2,0) baseline and this file's own non-mobile 44px rule above -- it
     already wins on specificity plus source order without !important. */
  .member-toolbar input:not([type="checkbox"]),.member-toolbar select{min-height:44px;padding:.5rem .65rem}
  .member-toolbar .field-help{margin:0;font-size:.74rem;line-height:1.25}
  /* K167-03: member.css's base .filter-checkbox{display:flex!important} is
     itself !important, so this override must match importance to keep
     controlling display in the compact mobile toolbar -- specificity can't
     win against a higher-importance bucket. Checkbox visible-control and
     touch-target sizing below is intentionally unchanged (20x20 visible
     control, 44px tap target). */
  .member-toolbar .filter-checkbox{display:flex!important;align-items:center;justify-content:flex-start;gap:.55rem;min-height:44px;margin:0}
  .member-toolbar .filter-checkbox input[type="checkbox"]{width:20px!important;height:20px!important;min-width:20px!important;min-height:20px!important;flex:0 0 20px;margin:0}
  /* K167-04: collapse is driven by the `hidden` attribute the message()
     renderer now sets from trimmed content (member.js) -- `:empty` never
     matched a whitespace-only text node, so it could not be trusted alone. */
  .market-receipt{margin:.2rem 0 0;font-size:.76rem;line-height:1.3}
  .jobs-section-header{margin-top:.15rem}
  .jobs-heading-group{gap:.2rem}
  .jobs-range-label{font-size:.82rem;line-height:1.3}
}
@media(max-width:768px){
  body.member-sidebar-open{overflow:hidden}
  body[data-job-ops-surface="member"] .sidebar{
    width:min(320px,calc(100vw - 48px));max-width:none;flex-basis:auto;
    top:0;bottom:0;height:100dvh;max-height:100dvh;min-height:0;
    overflow-x:hidden;overflow-y:auto;
    -webkit-overflow-scrolling:touch;overscroll-behavior:contain;touch-action:pan-y;
    padding-bottom:calc(var(--space-4) + env(safe-area-inset-bottom));
  }
  body[data-job-ops-surface="member"] .sidebar>.sidebar-brand,
  body[data-job-ops-surface="member"] .sidebar>.sidebar-nav,
  body[data-job-ops-surface="member"] .sidebar>.sidebar-section{flex-shrink:0}
  .sidebar-backdrop{position:fixed;inset:0;z-index:20;border:0;background:rgba(2,6,23,.72);cursor:pointer}
}

/* Customer-first Market composition. Keep jobs and their next actions above
   explanatory evidence while retaining every fact inside explicit disclosure. */
.member-scout{gap:.5rem!important}
.market-intro{min-height:0!important;max-height:none!important;padding:.45rem .15rem .6rem!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important}
.market-intro h1{margin:.1rem 0!important;font-size:clamp(1.65rem,3vw,2rem)!important;line-height:1.05!important}
.market-intro p{margin:.15rem 0 0!important;font-size:.82rem!important;line-height:1.25!important}
.experience-mode-chip,.sample-profile-badge{font-size:.68rem!important;padding:.18rem .45rem!important}
.quick-setup{min-height:0;max-height:52px;margin:0!important;padding:.25rem .5rem!important;border:0!important;border-radius:var(--js-radius-sm)!important;background:rgba(91,140,255,.1)!important;box-shadow:none!important;overflow:hidden}
.quick-setup-standard,.quick-setup-demo{align-items:center;justify-content:space-between;gap:.5rem}
.quick-setup-standard{display:flex}.quick-setup.demo-mode .quick-setup-demo{display:flex}
.quick-setup-copy{display:flex;min-width:0;gap:.4rem;align-items:baseline;font-size:.8rem;line-height:1.2}.quick-setup-copy span{color:var(--js-muted)}
.quick-setup-actions{display:flex;flex-wrap:nowrap;gap:.35rem;margin:0}.quick-setup-actions .btn{min-height:40px!important;padding:.45rem .65rem!important;white-space:nowrap}
.quick-setup-actions .btn[hidden]{display:none!important}
/* UI-STATE-03: reserve the lifecycle row before hydration with labeled
   placeholders that match the real tab geometry. This prevents CLS without
   showing an unexplained blank slab while counts are loading. */
.member-tabs{position:static!important;min-height:58px!important;max-height:58px!important;padding:.25rem!important;gap:.25rem!important;overflow-x:auto;scrollbar-width:thin}
.member-tab{min-width:88px!important;min-height:48px!important;padding:.35rem .55rem!important}
.member-tab-placeholder{display:flex!important;flex:0 0 88px!important;align-items:center!important;justify-content:center!important;gap:.25rem!important;pointer-events:none!important;cursor:default!important;color:var(--js-muted)!important;opacity:.78}
.member-tab-placeholder .member-tab-count{color:var(--js-muted)!important}
.member-toolbar{display:grid!important;grid-template-columns:minmax(280px,2fr) repeat(4,minmax(118px,1fr));align-items:end;gap:.5rem!important;max-height:72px;padding:.4rem .5rem!important}
.member-toolbar #memberToolbarFields{display:contents}.member-toolbar .filter-field{min-width:0;margin:0}.member-toolbar .filter-label{font-size:.75rem}.member-toolbar input:not([type="checkbox"]),.member-toolbar select{min-width:0;min-height:44px!important;padding:.45rem .6rem!important}
@media(min-width:1180px){.member-toolbar{max-height:none!important;min-height:72px}.member-toolbar>#toolbarSearchLawHelp,.member-toolbar #toolbarMinLawHelp{display:none!important}}
.filter-panel-heading,.filter-panel-actions,.filter-toggle{display:none}.filters-backdrop[hidden]{display:none}
.jobs-section-header{min-height:0!important;max-height:44px!important;margin:0!important;padding:.15rem 0!important}.jobs-heading-group{position:relative;display:flex!important;align-items:center;justify-content:space-between;flex-wrap:nowrap!important;gap:.5rem;width:100%}.jobs-heading-group h2{margin:0;font-size:1.05rem}.market-receipt{max-width:calc(100% - 145px);margin:0!important;overflow:hidden;text-overflow:ellipsis;font-size:.76rem!important;white-space:nowrap}.jobs-range-label{font-size:.8rem!important}
.jobs-list{gap:.75rem!important}.member-card{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(160px,180px)!important;align-items:start!important;padding:1rem!important;gap:.625rem!important;border-radius:var(--js-radius-md)!important}.job-identity{grid-column:1;grid-row:1;display:grid!important;grid-template-columns:40px minmax(0,1fr) auto!important;align-items:start!important;gap:.65rem!important}.job-decision{grid-column:2;grid-row:1}.member-actions{grid-column:1;grid-row:2}.member-badges{grid-column:2;grid-row:2}.card-details{grid-column:1/-1}.company-tile{width:40px!important;height:40px!important}.job-title{font-size:1.15rem!important;line-height:1.2!important}.job-company{font-size:.9rem!important}.job-meta-line{display:flex!important;flex-wrap:wrap!important;gap:.25rem .65rem!important;margin-top:.35rem!important;font-size:.82rem!important}.job-location,.job-compensation{font-weight:700}.job-work-model{color:var(--js-muted)}
.job-identity-text{display:grid!important;grid-template-columns:minmax(0,1fr) 44px;gap:.15rem .35rem}.job-identity-text .job-title{grid-column:1;grid-row:1}.job-identity-text .job-company{grid-column:1/-1;grid-row:2}.job-identity>.job-meta-line{grid-column:2/-1}.favorite-action{grid-column:2;grid-row:1;width:44px!important;min-width:44px!important;min-height:44px!important;padding:0!important;font-size:0!important}.favorite-action:before{content:"☆";font-size:1.25rem;line-height:1}.job-decision{display:flex!important;align-items:center!important;flex-wrap:wrap!important;gap:.4rem .75rem!important;min-height:44px!important;padding:.3rem .55rem!important}.decision-primary{font-size:.78rem!important}.decision-score{display:flex!important;align-items:baseline!important;gap:.3rem!important}.decision-score-number{font-size:1.5rem!important;line-height:1!important}.decision-score-label{font-size:.72rem!important}.member-unscored-note{padding:0!important;font-size:.8rem!important;line-height:1.25!important}.member-badges{gap:.35rem!important;margin:0!important}.member-badge,.job-decision>.pill{min-height:24px!important;padding:.25rem .5rem!important;font-size:.72rem!important}.job-decision>.pill{white-space:normal!important;line-height:1.2!important}
.member-actions{display:grid!important;grid-template-columns:minmax(150px,1fr) auto auto!important;gap:.5rem!important;align-items:center!important}.member-actions>.btn-primary{min-width:150px}.member-card.has-historical-listing .member-badges{grid-column:1/-1!important;grid-row:3!important;justify-content:flex-start!important;min-width:0}.member-card.has-historical-listing .card-details{grid-row:4}.historical-listing-badge{max-width:100%;white-space:normal;overflow-wrap:anywhere;line-height:1.25}.more-actions{position:relative}.more-actions>summary{display:flex;align-items:center;justify-content:center;min-height:44px;list-style:none;cursor:pointer}.more-actions>summary::-webkit-details-marker{display:none}.more-actions[open]>.btn{position:absolute;right:0;top:calc(100% + 4px);z-index:5;min-width:140px;background:var(--js-panel)!important}
.card-details{border-top:1px solid var(--js-line);padding-top:.15rem;color:var(--js-muted);font-size:.8rem}.card-details>summary{display:flex;align-items:center;min-height:44px!important;padding:0!important;color:var(--js-accent-2);font-weight:800;cursor:pointer}.card-details .pill{display:inline-flex;margin:.2rem .35rem .2rem 0}.card-details .member-trust-row{margin-top:.5rem}.card-details .member-seen-note{margin:.5rem 0 0}.detail-row+.detail-row{margin-top:.25rem}
@media(max-width:1179px){
  .member-card{grid-template-columns:1fr!important}.job-identity,.job-decision,.member-actions,.member-badges,.card-details{grid-column:1;grid-row:auto}.member-toolbar{grid-template-columns:minmax(0,1fr) auto;align-items:center;max-height:64px!important}.member-toolbar>.filter-search>.filter-label{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.member-toolbar>#toolbarSearchLawHelp{display:none}.filter-toggle{display:flex!important;align-items:center;justify-content:center;min-width:104px}.member-toolbar #memberToolbarFields{display:none;position:fixed;right:20px;top:80px;z-index:42;width:min(420px,calc(100vw - 40px));max-height:min(70dvh,560px);overflow:auto;padding:1rem;border:1px solid var(--js-line);border-radius:var(--js-radius-md);background:var(--js-panel);box-shadow:var(--js-shadow)}.member-toolbar.filters-open #memberToolbarFields{display:grid!important;grid-template-columns:1fr;gap:.65rem}.filter-panel-heading,.filter-panel-actions{display:flex;align-items:center;justify-content:space-between;gap:.5rem}.filter-panel-actions{position:sticky;bottom:-1rem;margin:.25rem -1rem -1rem;padding:.75rem 1rem calc(.75rem + env(safe-area-inset-bottom));background:var(--js-panel);border-top:1px solid var(--js-line)}.filters-backdrop{position:fixed;inset:0;z-index:41;border:0;background:rgba(2,6,23,.72)}body.member-filters-open{overflow:hidden}
}
@media(max-width:768px){
  .market-intro{max-height:none!important;overflow:visible!important}.quick-setup{max-height:64px;padding:.3rem .45rem!important}.quick-setup-copy{display:block;max-width:55%;font-size:.75rem}.quick-setup-copy strong,.quick-setup-copy span{display:block}.quick-setup-actions{display:flex!important;grid-template-columns:none!important}.quick-setup-actions .btn{width:auto!important;min-height:40px!important;padding:.35rem .45rem!important;font-size:.75rem}
  /* Public demo needs more vertical room than the compact signed-in setup strip.
     Never clip the explanatory copy or sample/browse actions on phone widths. */
  .quick-setup.demo-mode{max-height:none!important;overflow:visible!important;padding:.75rem!important}
  .quick-setup.demo-mode .quick-setup-demo{display:grid!important;grid-template-columns:minmax(0,1fr);gap:.65rem!important;align-items:stretch!important}
  .quick-setup.demo-mode .quick-setup-copy{max-width:none!important}
  .quick-setup.demo-mode .quick-setup-actions{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;width:100%;gap:.5rem!important}
  .quick-setup.demo-mode .quick-setup-actions .btn{width:100%!important;white-space:normal!important}
  .member-tabs{min-height:56px!important;max-height:56px!important}.member-toolbar #memberToolbarFields{inset:auto 0 0;right:auto;top:auto;width:100%;max-height:min(78dvh,620px);border-radius:var(--js-radius-lg) var(--js-radius-lg) 0 0;padding-bottom:calc(1rem + env(safe-area-inset-bottom))}.member-card{padding:.875rem!important;gap:.375rem!important}.job-identity{gap:.4rem!important}.job-identity>.job-meta-line{grid-column:1/-1}.job-company{margin-bottom:0!important}.member-actions{grid-template-columns:1fr auto!important;gap:.25rem!important}.member-actions>.btn-primary{grid-column:1/-1;width:100%}.job-title{font-size:1rem!important;line-height:1.15!important;letter-spacing:-.02em}
  /* UI-STATE-05: the tablet-band rule at max-width:1179px (grid-template-
     columns:minmax(0,1fr) auto + a fixed 104px .filter-toggle) comes later
     in this file than the earlier max-width:720px single-column toolbar, so
     it wins the cascade at true phone widths too -- the search input was
     left with no real floor next to a button that always kept its full
     width, truncating the placeholder text. This block runs after both, so
     it wins back the single-column, full-width-toggle layout for phones
     without touching the 1179px rule's intended tablet-width behavior. */
  .member-toolbar{grid-template-columns:1fr!important;max-height:none!important;overflow:visible!important}
  .filter-toggle{width:100%!important;min-width:0!important}
  /* UI-STATE-06: h2 + the range label were forced onto one non-wrapping
     line at every width (the unconditioned "Customer-first Market
     composition" rule above) -- once the catalog loads, the combined text
     ("Full market, ranked for you" + "13,272 jobs · showing 25") does not
     fit a phone-width row and the two pieces compete for the same space.
     Wrapping to a second row on narrow viewports is a deliberate two-row
     treatment instead of a fight for one row. */
  .jobs-section-header{max-height:none!important;overflow:visible!important}
  .jobs-heading-group{flex-wrap:wrap!important}
  .market-receipt{max-width:100%!important;white-space:normal!important}
  /* UI-STATE-07: the loading placeholder reserved no height, so the page
     was short while jobs were loading and then grew abruptly once results
     rendered -- pushing everything below (including the footer) down in
     one large jump instead of a stable shell. */
  .jobs-loading{min-height:112px;display:flex;align-items:center;justify-content:center}
}
@media(max-width:390px){.member-scout{padding-left:10px!important;padding-right:10px!important}.quick-setup-copy{max-width:48%}.quick-setup-actions .btn{font-size:.7rem;padding:.3rem .35rem!important}.member-tab{min-width:82px!important}.member-actions .btn{width:auto}.member-actions>.btn-primary{width:100%}.market-receipt{text-align:left}}
@media(max-height:500px) and (min-width:769px){
  .console-body{padding-top:.5rem!important}.member-scout{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:.25rem .5rem!important}.market-intro{grid-column:1;grid-row:1;max-height:52px;padding:.2rem 0!important;overflow:hidden}.market-intro h1{font-size:1.45rem!important}.market-intro p{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.quick-setup{grid-column:2;grid-row:1;max-height:52px}.quick-setup-copy{display:block;font-size:.72rem}.quick-setup-copy strong,.quick-setup-copy span{display:block}.quick-setup-actions .btn{min-height:40px!important;padding:.35rem .45rem!important;font-size:.72rem}.member-tabs,.member-toolbar,#memberMessage,#recommendations,.member-footer{grid-column:1/-1}.member-tabs{max-height:52px!important}.member-toolbar{max-height:52px!important;padding:.2rem .35rem!important}.jobs-section-header{max-height:36px!important}
}
@media(forced-colors:active){.member-tab[aria-selected="true"],.pill,.member-badge{border:2px solid currentColor}.member-tab[aria-selected="true"]{outline:2px solid Highlight}.filters-backdrop{background:CanvasText;opacity:.55}}


/* Consumer launch polish: keep the first-run workspace focused on the core
   job-search loop, then reveal secondary tools after personalization. */
.progressive-nav{display:none!important}
body.personalization-ready .progressive-nav{display:flex!important}
body.personalization-ready .sidebar-section.progressive-nav{display:block!important}
.utility-profile-nav{display:none!important}

/* Recommendation Frontier: persistent Top-100 stock view on the New tab.
   Solid glow = ready frontier stock; striped segment = real in-flight refill
   work (capped at the open slots); dark remainder = unfilled capacity. */
.rec-frontier{--rf-glow:rgba(84,132,255,.55);--rf-edge:rgba(120,160,255,.42);--rf-tile:rgba(7,16,29,.58);--rf-track:rgba(148,163,184,.14);display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"head status" "explain explain" "main main" "bar bar" "metrics metrics" "helper helper";column-gap:18px;margin:0 0 16px;padding:18px 22px;border:1px solid var(--rf-edge);border-radius:var(--js-radius-lg);background:radial-gradient(120% 140% at 0% 0%,rgba(64,108,210,.2),transparent 55%),linear-gradient(160deg,var(--js-panel-2),var(--js-bg));box-shadow:0 0 0 1px rgba(64,108,210,.12),0 0 28px rgba(64,108,210,.22),inset 0 1px 0 rgba(255,255,255,.04);color:var(--js-text)}
.rec-frontier.hidden{display:none!important}
.rf-svg{display:block;width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}.rf-svg .rf-solid{fill:currentColor;stroke:none}
.rf-head{grid-area:head;display:flex;align-items:center;gap:12px;min-width:0}
.rf-badge{flex:0 0 auto;display:grid;place-items:center;width:40px;height:40px;padding:8px;border-radius:12px;background:rgba(64,108,210,.18);border:1px solid rgba(120,160,255,.28);color:var(--js-accent-2);filter:drop-shadow(0 0 6px var(--rf-glow))}
.rec-frontier[data-state="full"] .rf-badge,.rec-frontier[data-state="setup"] .rf-badge,.rec-frontier[data-state="unavailable"] .rf-badge{display:none}
.rf-titles{min-width:0}.rf-title-row{display:flex;align-items:center;gap:8px}
.rf-titles h2{margin:0;font-size:1.12rem;line-height:1.25;font-weight:800;letter-spacing:-.01em;color:var(--js-text)}
.rf-sub{margin:2px 0 0;color:var(--js-muted);font-size:.82rem}
.rf-info{display:grid;place-items:center;width:28px;height:28px;min-height:0!important;padding:5px;border:0;border-radius:50%;background:transparent;color:var(--js-muted);cursor:pointer;transition:color .15s ease,background-color .15s ease}.rf-info:hover,.rf-info[aria-expanded="true"]{color:var(--js-accent-2);background:rgba(64,108,210,.18)}
.rf-explain{grid-area:explain;margin:10px 0 0;max-width:780px;color:var(--js-muted);font-size:.82rem;line-height:1.45}
.rf-status{grid-area:status;display:flex;align-items:center;justify-content:flex-end;gap:10px;min-width:0}
.rf-note{margin:0;max-width:440px;color:var(--js-muted);font-size:.8rem;line-height:1.35;text-align:right}
.rf-spin{display:none;width:22px;height:22px;color:var(--js-accent-2);filter:drop-shadow(0 0 5px var(--rf-glow))}
.rec-frontier[data-state="refilling"] .rf-spin{display:block;animation:rf-rotate 1.1s linear infinite}
.rf-pill{display:inline-flex;align-items:center;gap:8px;padding:6px 13px;border:1px solid rgba(120,160,255,.5);border-radius:999px;background:rgba(40,78,170,.32);color:#dbe6ff;font-size:.8rem;font-weight:700;white-space:nowrap;box-shadow:0 0 14px rgba(64,108,210,.3)}
.rf-pill::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--js-accent-2);box-shadow:0 0 0 3px rgba(141,176,255,.18),0 0 8px var(--rf-glow)}
.rf-pill[hidden],.rf-note[hidden],.rf-helper[hidden],.rf-explain[hidden],.rf-metric[hidden],.rf-bar-row[hidden],.rf-metrics[hidden]{display:none!important}
.rec-frontier[data-state="refilling"] .rf-pill::before{animation:rf-pulse 1.8s ease-in-out infinite}
.rec-frontier[data-state="refill_pending"] .rf-pill{border-color:var(--js-line);background:rgba(148,163,184,.1);color:var(--js-muted);box-shadow:none}.rec-frontier[data-state="refill_pending"] .rf-pill::before{background:var(--js-muted);box-shadow:none}
.rf-main{grid-area:main;display:flex;align-items:baseline;flex-wrap:wrap;gap:6px 14px;margin:14px 0 10px}
.rf-value{font-size:2.15rem;line-height:1;font-weight:800;letter-spacing:-.02em;color:#fff;font-variant-numeric:tabular-nums;text-shadow:0 0 18px rgba(120,160,255,.25)}
.rf-desc{color:#c9d5ea;font-size:1.05rem}
.rec-frontier[data-state="setup"] .rf-main,.rec-frontier[data-state="unavailable"] .rf-main{margin:10px 0 0}.rec-frontier[data-state="setup"] .rf-desc,.rec-frontier[data-state="unavailable"] .rf-desc{color:var(--js-muted);font-size:.9rem}
.rf-bar-row{grid-area:bar;display:flex;align-items:center;gap:14px}
.rf-track{position:relative;flex:1 1 auto;height:14px;border-radius:999px;background:var(--rf-track);box-shadow:inset 0 0 0 1px rgba(148,163,184,.14)}
.rf-ready,.rf-active{position:absolute;top:0;bottom:0;border-radius:999px}
.rf-ready{left:0;width:var(--rf-ready,0%);background:linear-gradient(90deg,#2f63e0,var(--js-accent-2));box-shadow:0 0 10px var(--rf-glow),0 0 22px rgba(64,108,210,.35);transition:width .45s ease}
.rf-active{left:var(--rf-ready,0%);width:var(--rf-active,0%);background:repeating-linear-gradient(-45deg,rgba(141,176,255,.62) 0 6px,rgba(64,108,210,.2) 6px 12px);background-size:17px 17px;border-radius:0 999px 999px 0;box-shadow:0 0 12px rgba(84,132,255,.4);transition:left .45s ease,width .45s ease}
.rec-frontier[data-state="refilling"] .rf-active{animation:rf-stripes 1s linear infinite}
.rec-frontier[data-state="refilling"] .rf-ready,.rec-frontier[data-state="refill_pending"] .rf-ready{border-radius:999px 0 0 999px}
.rec-frontier[data-state="full"] .rf-active,.rec-frontier[data-state="refill_pending"] .rf-active{display:none}
.rf-pct{flex:0 0 auto;min-width:3.2em;text-align:right;color:var(--js-text);font-weight:700;font-variant-numeric:tabular-nums}
.rf-metrics{grid-area:metrics;display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin:16px 0 0;padding:0;list-style:none}
.rf-metric{display:flex;align-items:center;gap:12px;min-width:0;padding:11px 14px;border:1px solid var(--js-line);border-radius:var(--js-radius-md);background:var(--rf-tile);transition:border-color .15s ease,box-shadow .15s ease}
.rf-metric:hover{border-color:rgba(120,160,255,.45);box-shadow:0 0 14px rgba(64,108,210,.18)}
.rf-icon{flex:0 0 auto;width:26px;height:26px;color:var(--js-accent-2);filter:drop-shadow(0 0 5px var(--rf-glow))}
.rec-frontier[data-state="refilling"] .rf-icon-spin{animation:rf-rotate 1.6s linear infinite}
.rf-metric-copy{display:flex;flex-direction:column;min-width:0}
.rf-metric-copy strong{color:#fff;font-size:1rem;font-weight:800;line-height:1.2;font-variant-numeric:tabular-nums}
.rf-metric-copy small{overflow:hidden;color:var(--js-muted);font-size:.76rem;line-height:1.3;text-overflow:ellipsis;white-space:nowrap}
.rf-helper{grid-area:helper;display:flex;align-items:center;gap:10px;margin:14px 0 0;color:#c9d5ea;font-size:.86rem;line-height:1.4}
.rf-helper-icon{flex:0 0 auto;width:18px;height:18px;color:var(--js-accent-2)}
.rec-frontier[data-state="refilling"] .rf-helper-icon{animation:rf-rotate 1.6s linear infinite}
.rec-frontier[data-state="refill_pending"] .rf-helper-icon{color:var(--js-muted)}
.rec-frontier[data-state="setup"] .rf-status,.rec-frontier[data-state="unavailable"] .rf-status{display:none}
.rec-frontier.is-stale .rf-value,.rec-frontier.is-stale .rf-track{opacity:.62}
@keyframes rf-rotate{to{transform:rotate(360deg)}}
@keyframes rf-stripes{to{background-position:17px 0}}
@keyframes rf-pulse{50%{box-shadow:0 0 0 5px rgba(141,176,255,.08),0 0 12px var(--rf-glow)}}
/* Reduced motion stops frontier motion outright (not merely faster). */
@media(prefers-reduced-motion:reduce){.rec-frontier .rf-active,.rec-frontier .rf-spin,.rec-frontier .rf-icon-spin,.rec-frontier .rf-helper-icon,.rec-frontier .rf-pill::before{animation:none!important}.rec-frontier .rf-ready,.rec-frontier .rf-active,.rec-frontier .rf-metric,.rf-info{transition:none!important}}

/* Job cards respond to the actual results-pane width, not the browser width.
   With the 260px navigation open, a 1440px browser does not have enough room
   for three readable cards; container queries correctly choose two. Closing
   the sidebar immediately gives the pane enough room to return to three. */
#recommendations{container-type:inline-size;container-name:member-results}
#memberJobs.jobs-list{display:grid;grid-template-columns:minmax(0,1fr);align-items:stretch;gap:12px}
#memberJobs.jobs-list>.member-card{height:100%;min-width:0}
#memberJobs.jobs-list>.jobs-empty,
#memberJobs.jobs-list>.jobs-error,
#memberJobs.jobs-list>.session-expired{grid-column:1/-1}
/* The results pane is never wider than the viewport, so gating on the
   viewport changes nothing -- but it stops phones from evaluating this
   query at all, which crashed headless Chromium 149 at <~580px. */
@media(min-width:720px){@container member-results (min-width:720px){
  #memberJobs.jobs-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
}}
@container member-results (min-width:1160px){
  #memberJobs.jobs-list{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:720px){
  .rec-frontier{grid-template-columns:minmax(0,1fr);grid-template-areas:"head" "status" "explain" "main" "bar" "metrics" "helper";padding:15px}
  .rf-status{justify-content:flex-start;flex-wrap:wrap;margin-top:10px}.rf-note{max-width:none;text-align:left}
  .rf-value{font-size:1.8rem}.rf-desc{font-size:.95rem}
  .rf-metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.rf-metric{padding:10px 11px;gap:9px}.rf-icon{width:22px;height:22px}.rf-metric-copy small{white-space:normal}
}


/* Sep-29 fail-open/clipping guard: member chrome may reserve minimum space but
   must never hide customer-visible content behind fixed heights or ellipsis. */
/* Horizontal containment stays strict; only the vertical axis fails open.
   overflow-x:clip (unlike hidden) does not turn overflow-y into a scroll
   container, so no content is clipped vertically. */
.console-body,.member-scout{overflow-x:clip!important;overflow-y:visible!important}
.quick-setup{max-height:none!important;overflow:visible!important}
.member-tabs{max-height:none!important}
.member-toolbar{max-height:none!important;overflow:visible!important}
.jobs-section-header{max-height:none!important;overflow:visible!important}
.jobs-heading-group{flex-wrap:wrap!important}
.market-receipt{
  max-width:100%!important;
  overflow:visible!important;
  text-overflow:clip!important;
  white-space:normal!important;
  overflow-wrap:anywhere!important
}

/* ===== Search-first Market (2026-09-30) ===== */
.visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.search-first .member-hero.market-intro h1{font-size:clamp(2.1rem,6vw,3.6rem);line-height:1.02;letter-spacing:-.035em;margin:.6rem 0 .5rem}
.search-first .hero-accent{color:var(--js-accent-2)}
.search-first .hero-tagline{font-size:clamp(1rem,2.4vw,1.2rem);color:var(--js-muted);max-width:44rem;margin:0 0 .35rem}
.search-first #experienceModeChip{display:inline-flex;align-items:center;gap:.4rem;padding:.3rem .75rem;border:1px solid var(--js-accent-2);border-radius:999px;color:var(--js-accent-2);font-weight:800;letter-spacing:.12em;font-size:.78rem}
.search-first-block{display:grid;gap:.75rem;margin:0 0 1.25rem}
.search-first-block[hidden],.search-results-heading[hidden]{display:none!important}
.search-first-bar{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:.5rem;padding:.4rem .4rem .4rem .9rem;border:1px solid var(--js-line);border-radius:var(--js-radius-lg);background:var(--js-panel)}
.search-first-bar:focus-within{border-color:var(--js-accent-2);box-shadow:0 0 0 3px var(--js-focus)}
.search-first-icon svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;color:var(--js-muted)}
.search-first-bar .filter-search{margin:0;min-width:0}
.search-first-bar .filter-search .filter-label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.search-first-bar #memberSearch{width:100%;min-height:48px;border:0;background:transparent;font-size:1.1rem;box-shadow:none}
.search-first-go{min-height:48px;padding:0 1.6rem;font-weight:800;border-radius:var(--js-radius-md)}
.search-first-chips{display:flex;flex-wrap:wrap;gap:.5rem;justify-content:center}
.search-chip{min-height:var(--js-control-min);padding:0 1rem;border:1px solid var(--js-line);border-radius:999px;background:transparent;color:var(--js-text);font:inherit;cursor:pointer}
.search-chip:hover,.search-chip:focus-visible{border-color:var(--js-accent-2)}
.search-first-hint{margin:0;text-align:center;color:var(--js-muted);font-size:.9rem}
.search-first-controls{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:end;gap:.75rem}
.search-first-setting{display:grid;gap:.4rem;min-width:0}
.search-first-control-label{font-weight:700;font-size:.9rem}
.search-first-segments{display:flex;flex-wrap:wrap;gap:.35rem}
.search-segment{min-height:var(--js-control-min);padding:0 .95rem;border:1px solid var(--js-line);border-radius:999px;background:transparent;color:var(--js-text);font:inherit;cursor:pointer}
.search-segment[aria-pressed="true"]{border-color:var(--js-accent-2);box-shadow:inset 0 0 0 1px var(--js-accent-2);font-weight:700}
.search-first-sort{margin:0}
.search-first #filterToggle{position:relative;min-height:var(--js-control-min);display:inline-flex;align-items:center;gap:.5rem}
.filter-count-badge{position:absolute;top:-.55rem;right:-.55rem;min-width:1.5rem;height:1.5rem;padding:0 .35rem;border-radius:999px;background:var(--js-accent-2);color:#fff;font-size:.8rem;font-weight:800;display:inline-flex;align-items:center;justify-content:center}
.search-first .member-toolbar>.filter-search,.search-first .search-first-moved{display:none!important}
.search-results-heading{margin:0 0 .5rem;font-size:clamp(1.25rem,3vw,1.6rem);letter-spacing:-.02em}
@media(min-width:1180px){
  .search-first .member-toolbar{position:relative;min-height:0!important;max-height:none!important;padding:0!important;border:0!important;background:transparent!important}
  .search-first .member-toolbar:not(.filters-open) #memberToolbarFields{display:none}
  .search-first .member-toolbar.filters-open #memberToolbarFields{position:absolute;z-index:40;right:0;top:0;width:min(420px,100%);display:grid;gap:.75rem;padding:1rem;border:1px solid var(--js-line);border-radius:var(--js-radius-lg);background:var(--js-panel);box-shadow:var(--js-shadow)}
}
/* Cards: identity tile, corner stamp + bookmark, tags, wide CTA. */
.search-first .job-identity{grid-template-columns:48px minmax(0,1fr) auto!important}
.search-first .company-tile{width:48px!important;height:48px!important;border-radius:12px;overflow:hidden}
.company-tile.has-logo{background:#fff;display:grid;place-items:center;padding:4px}
.company-tile.has-logo img{width:100%;height:100%;object-fit:contain;display:block}
.search-first .job-identity>.job-meta-line,.search-first .job-identity>.job-tags{grid-column:2/-1}
.job-card-corner{display:flex;align-items:flex-start;gap:.5rem}
.job-card-stamp{display:flex;align-items:center;gap:.5rem;white-space:nowrap;font-size:.8rem;color:var(--js-muted)}
.job-new-badge{padding:.15rem .6rem;border-radius:999px;background:color-mix(in srgb,var(--js-ok) 22%,transparent);color:var(--js-ok);font-weight:700}
.bookmark-action,.bookmark-state{display:inline-grid;place-items:center;width:var(--js-control-min);height:var(--js-control-min);padding:0!important;min-width:0!important}
.bookmark-action svg,.bookmark-state svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2}
.bookmark-state svg{fill:currentColor;color:var(--js-accent-2)}
.job-tags{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:.5rem}
.job-tag{padding:.2rem .7rem;border:1px solid var(--js-line);border-radius:999px;font-size:.8rem;color:var(--js-muted)}
.job-matched{margin-top:.35rem;font-size:.8rem;color:var(--js-muted)}.search-first .job-identity>.job-matched{grid-column:2/-1}
.search-first .member-actions>.btn-view-job{grid-column:1/-1;width:100%;min-height:48px;font-weight:800;font-size:1.02rem}
/* #29: explicit "No apply link on file" state instead of a silent missing action. */
.member-actions>.no-apply-link{align-self:center;color:var(--js-muted,#8ea3bd);font-size:.9rem;line-height:1.35}
.search-first .member-actions>.no-apply-link{grid-column:1/-1}
@media(max-width:720px){
  .search-first-controls{grid-template-columns:1fr auto}
  .search-first-setting{grid-column:1/-1}
  .search-first-go{padding:0 1.1rem}
  .search-first .job-identity{grid-template-columns:44px minmax(0,1fr) auto!important}
  .search-first .company-tile{width:44px!important;height:44px!important}
}
/* The search law-help line sits under the whole search bar, not in its icon column. */
.search-first-bar>.field-help{grid-column:1/-1;margin:0 .25rem .2rem}
/* Phones: with the fail-open clipping guard, the setup strip can no longer
   hide overflow, so it wraps instead of widening the page. */
@media(max-width:720px){
  .quick-setup-standard{flex-wrap:wrap}
  .quick-setup-standard>*{min-width:0}
  .quick-setup-standard>.quick-setup-actions{flex:1 1 100%;flex-wrap:wrap}
}

/* 2026-10-01 mobile hotfix: fix the actual width drivers on real phones. */
/* Search bar: every item is placed explicitly, so the law-help line (inserted
   between the input and the button) can never push the button to a 3rd row. */
.search-first-bar>.search-first-icon{grid-column:1;grid-row:1}
.search-first-bar>.filter-search{grid-column:2;grid-row:1;min-width:0}
.search-first-bar>.search-first-go{grid-column:3;grid-row:1}
.search-first-bar>.field-help{grid-column:1/-1;grid-row:2;min-width:0;overflow-wrap:anywhere}
.search-first-bar #memberSearch{min-width:0;text-overflow:ellipsis}
/* Sort keeps the console's control styling after moving out of the toolbar. */
.search-first-sort{display:grid;gap:.4rem;min-width:0}
.search-first-sort select{-webkit-appearance:none;appearance:none;color-scheme:dark;min-height:var(--js-control-min);max-width:100%;padding:0 2.25rem 0 .75rem;border:1px solid var(--js-line);border-radius:var(--js-radius-md);background-color:var(--js-panel);background-image:linear-gradient(45deg,transparent 50%,var(--js-muted) 50%),linear-gradient(135deg,var(--js-muted) 50%,transparent 50%);background-position:calc(100% - 1.1rem) 55%,calc(100% - .8rem) 55%;background-size:.35rem .35rem;background-repeat:no-repeat;color:var(--js-text);font:inherit}
.search-first-sort select option{background:var(--js-panel);color:var(--js-text)}
.search-first-controls>*{min-width:0}
.search-first-segments,.search-first-chips{min-width:0;max-width:100%}
.rec-frontier,.member-card,.member-footer,.quick-setup{max-width:100%;min-width:0}
@media(max-width:720px){
  .search-first-bar{padding:.35rem .35rem .35rem .75rem}
  .search-first-bar #memberSearch{font-size:16px}
  .search-first-go{padding:0 .9rem}
  .search-first-controls{grid-template-columns:minmax(0,1fr) auto}
  .search-first-sort{grid-column:1}
  /* Tabs scroll inside their own strip at every phone width; each tab is
     sized to its label so labels never paint into a neighbour. */
  .member-tabs{display:flex!important;overflow-x:auto!important;overscroll-behavior-x:contain;scroll-snap-type:x proximity;max-width:100%}
  .member-tab,.member-tab-placeholder{flex:0 0 auto!important;width:auto!important;min-width:82px!important;white-space:nowrap;scroll-snap-align:start}
}
/* One Favorite control, one icon: the legacy text-star pseudo-element must not
   stack on the bookmark button's real SVG. */
.favorite-action.bookmark-action:before{content:none!important}
.job-identity-text,.job-identity-text .job-title{min-width:0;overflow-wrap:break-word}
/* The Favorite control lives in the card corner now; drop the legacy 44px
   in-heading column it used to reserve next to the title. */
.search-first .job-identity-text{grid-template-columns:minmax(0,1fr)}
/* Every width: only the bookmark keeps the corner column; the New/age stamp
   gets its own row under the title. Otherwise the non-wrapping stamp eats the
   identity track and titles collapse to a few characters per line (measured
   on phones and in the 3-column desktop grid). */
.search-first .job-card-corner{display:contents}
.search-first .job-card-corner>.bookmark-action,.search-first .job-card-corner>.bookmark-state{grid-column:3;grid-row:1;align-self:start}
.search-first .job-card-corner>.job-card-stamp{grid-column:2/-1;grid-row:2;justify-self:start;flex-wrap:wrap;white-space:normal;gap:.4rem;margin:.1rem 0 .15rem}
/* Search-First moved every primary control out of the old toolbar; while the
   Filters drawer is closed it must not draw an empty bordered slab. */
.search-first .member-toolbar.search-first-filter-panel:not(.filters-open){min-height:0!important;max-height:none!important;padding:0!important;margin:0!important;border:0!important;background:transparent!important;box-shadow:none!important}


/* 2026-10-02 mobile search/accessibility sweep.
   Keep the page hierarchy obvious: separate header actions, one concise hero,
   and a persistent high-contrast label + input boundary for search. */
body[data-job-ops-surface="member"] .top-header>.header-status{margin-left:auto}
.search-first .member-hero #recommendationSummary{margin-top:.2rem}
.search-first-bar{
  align-items:end;
  border:0;
  background:transparent;
  padding:0;
}
.search-first-bar:focus-within{border-color:transparent;box-shadow:none}
.search-first-bar .search-first-input-field{
  display:grid;
  gap:.25rem;
  min-width:0;
}
.search-first-bar .search-first-input-field .filter-label{
  position:static;
  width:auto;
  height:auto;
  overflow:visible;
  clip:auto;
  white-space:normal;
  color:var(--js-text);
  font-size:.82rem;
  font-weight:800;
  line-height:1.2;
}
.search-first-bar #memberSearch{
  min-height:50px;
  padding:.65rem .8rem!important;
  border:2px solid var(--js-accent-2)!important;
  border-radius:var(--js-radius-md)!important;
  background:var(--js-bg,#07101d)!important;
  color:var(--js-text)!important;
  box-shadow:none!important;
}
.search-first-bar #memberSearch::placeholder{color:var(--js-muted);opacity:1}
.search-first-bar #memberSearch:focus-visible{
  border-color:var(--js-accent-2)!important;
  box-shadow:0 0 0 3px var(--js-focus)!important;
}
.search-first-go{align-self:end}
.search-first-hint,#toolbarSearchLawHelp{display:none!important}

@media(max-width:720px){
  /* The fixed menu target occupies 12px..56px; reserve a real gap and keep
     the account target on the opposite edge instead of letting flex place the
     only header child under the hamburger. */
  body[data-job-ops-surface="member"] .top-header{
    min-height:72px;
    align-items:center;
    padding:.75rem 1rem .65rem 72px!important;
  }
  body[data-job-ops-surface="member"] .top-header>.header-status{
    margin-left:auto;
    min-width:48px;
  }
  body[data-job-ops-surface="member"] .sidebar-toggle{
    top:12px;
    left:12px;
    width:48px;
    height:48px;
    min-width:48px;
    min-height:48px;
  }
  body[data-job-ops-surface="member"] .account-button{
    width:48px;
    height:48px;
    padding:0;
    justify-content:center;
  }

  /* The personalization chip already communicates ranking mode. Keeping the
     long dynamic recommendation sentence in the phone hero repeated the same
     message and pushed the actual search control down the page. */
  .search-first .member-hero #recommendationSummary{display:none}
  .search-first .member-hero.market-intro{padding:.55rem .35rem!important}
  .search-first .member-hero.market-intro h1{margin:.35rem 0 .2rem!important}
  .search-first .hero-tagline{margin:0;font-size:.92rem;line-height:1.3}

  .search-first-block{gap:.55rem;margin-bottom:.85rem}
  .search-first-bar{grid-template-columns:minmax(0,1fr) auto;gap:.55rem}
  .search-first-bar>.search-first-icon{display:none}
  .search-first-bar>.filter-search{grid-column:1;grid-row:1}
  .search-first-bar>.search-first-go{grid-column:2;grid-row:1;padding:0 .85rem}
  .search-first-chips{gap:.4rem}
}
