/* ===========================================================
   JORA NEST — RECRUITER INTELLIGENCE
   Prototype stylesheet for /nest/recruiter/.
   ===========================================================

   A workspace, not a marketing page. The main site's style.css is
   built around a 900px centred reading measure; this is a left-rail
   product surface with dense, scannable data. It deliberately reuses
   JORA NEST's own palette and typefaces so a recruiter moving from
   a match result into a candidate's real NEST page never crosses a
   visual seam — the layer sits ON TOP of NEST, it doesn't replace it.

   Single-theme dark, on purpose: every NEST page it links into is
   dark-only, so a light mode here would break at the boundary. Every
   colour is painted explicitly rather than inherited.

   Semantic fit colours (strong / moderate / gap) are kept deliberately
   separate from the gold accent — gold means "JORA", never "good", so
   a strong-fit indicator can never be misread as branding.
   =========================================================== */

:root {
  --rq-bg: #0d1117;
  --rq-surface: #131a24;
  --rq-surface-2: #18202c;
  --rq-navy: #1a2340;
  --rq-gold: #b8962e;
  --rq-gold-dim: rgba(184, 150, 46, 0.14);
  --rq-warm: #f5f2ed;
  --rq-muted: #8d8d8d;
  --rq-faint: #6a6a6a;
  --rq-border: rgba(245, 242, 237, 0.1);
  --rq-border-soft: rgba(245, 242, 237, 0.06);

  --rq-strong: #4f9673;
  --rq-strong-bg: rgba(79, 150, 115, 0.12);
  --rq-moderate: #c08a3e;
  --rq-moderate-bg: rgba(192, 138, 62, 0.12);
  --rq-gap: #b5563d;
  --rq-gap-bg: rgba(181, 86, 61, 0.12);

  --rq-font-head: "Playfair Display", Georgia, serif;
  --rq-font-body: "Inter", system-ui, sans-serif;

  --rq-rail: 232px;
  --rq-maxw: 1180px;
}

* { margin: 0; padding: 0; box-sizing: border-box; }

html { background: var(--rq-bg); scroll-behavior: smooth; }

body {
  font-family: var(--rq-font-body);
  background: var(--rq-bg);
  color: var(--rq-warm);
  font-weight: 300;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  min-height: 100vh;
}

::selection { background: var(--rq-gold-dim); color: var(--rq-warm); }

:focus-visible { outline: 2px solid var(--rq-gold); outline-offset: 2px; border-radius: 2px; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; }
  html { scroll-behavior: auto; }
}

/* ---------------------------------------------------- shell -- */

.rq-shell { display: flex; min-height: 100vh; }

.rq-rail {
  width: var(--rq-rail); flex: none; border-right: 1px solid var(--rq-border-soft);
  padding: 1.75rem 1.25rem; display: flex; flex-direction: column; gap: 2rem;
  position: sticky; top: 0; height: 100vh; background: var(--rq-bg);
}

.rq-brand { display: flex; flex-direction: column; gap: 0.3rem; text-decoration: none; }
.rq-brand-name { font-family: var(--rq-font-head); font-size: 1.15rem; color: var(--rq-warm); letter-spacing: 0.01em; }
.rq-brand-label {
  font-size: 9px; font-weight: 600; letter-spacing: 0.18em; text-transform: uppercase;
  color: var(--rq-gold);
}

.rq-nav { display: flex; flex-direction: column; gap: 0.15rem; }
.rq-nav-label {
  font-size: 9px; font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--rq-faint); margin-bottom: 0.6rem;
}
.rq-nav-item {
  display: flex; align-items: center; justify-content: space-between; gap: 0.5rem;
  padding: 0.6rem 0.7rem; border-radius: 4px; text-decoration: none;
  font-size: 0.875rem; color: var(--rq-muted); border: 1px solid transparent;
  background: none; font-family: inherit; cursor: pointer; text-align: left; width: 100%;
  transition: color 0.2s ease, background 0.2s ease;
}
.rq-nav-item:hover { color: var(--rq-warm); background: var(--rq-surface); }
.rq-nav-item[aria-current="true"] {
  color: var(--rq-warm); background: var(--rq-surface); border-color: var(--rq-border);
}
.rq-nav-item[aria-current="true"] .rq-nav-dot { background: var(--rq-gold); }
.rq-nav-dot { width: 5px; height: 5px; border-radius: 50%; background: transparent; flex: none; }
.rq-nav-count {
  font-size: 11px; font-variant-numeric: tabular-nums; color: var(--rq-faint);
  border: 1px solid var(--rq-border); border-radius: 20px; padding: 0.05rem 0.45rem;
}

.rq-rail-foot { margin-top: auto; display: flex; flex-direction: column; gap: 0.9rem; }
.rq-user { display: flex; align-items: center; gap: 0.6rem; padding-top: 1rem; border-top: 1px solid var(--rq-border-soft); }
.rq-user-avatar {
  width: 30px; height: 30px; border-radius: 50%; flex: none;
  background: var(--rq-gold-dim); border: 1px solid rgba(184, 150, 46, 0.35);
  display: grid; place-items: center; font-size: 10px; font-weight: 600;
  letter-spacing: 0.06em; color: var(--rq-gold);
}
.rq-user-name { font-size: 0.8rem; color: var(--rq-warm); line-height: 1.3; }
.rq-user-org { font-size: 0.7rem; color: var(--rq-faint); line-height: 1.3; }

.rq-main { flex: 1; min-width: 0; }
.rq-screen { display: none; padding: 3rem 3rem 5rem; max-width: var(--rq-maxw); margin: 0 auto; }
.rq-screen[data-active="true"] { display: block; animation: rq-fade 0.35s ease both; }

@keyframes rq-fade {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: none; }
}

/* ------------------------------------------------ typography -- */

.rq-eyebrow {
  font-size: 10px; font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--rq-gold); margin-bottom: 0.85rem;
}
.rq-eyebrow-quiet { color: var(--rq-faint); }

.rq-h1 {
  font-family: var(--rq-font-head); font-size: clamp(1.9rem, 3.4vw, 2.7rem);
  font-weight: 500; line-height: 1.15; letter-spacing: -0.01em;
  color: var(--rq-warm); text-wrap: balance; margin-bottom: 0.9rem;
}
.rq-h2 {
  font-family: var(--rq-font-head); font-size: 1.5rem; font-weight: 500;
  color: var(--rq-warm); text-wrap: balance; margin-bottom: 0.5rem;
}
.rq-h3 {
  font-size: 0.95rem; font-weight: 600; letter-spacing: 0.01em; color: var(--rq-warm);
}
.rq-lead { font-size: 1.02rem; color: var(--rq-muted); max-width: 60ch; line-height: 1.7; }
.rq-note { font-size: 0.82rem; color: var(--rq-faint); line-height: 1.65; }

.rq-section { margin-top: 2.75rem; }
.rq-section-head { margin-bottom: 1.25rem; }

/* ---------------------------------------------------- inputs -- */

.rq-ask { margin-top: 2.25rem; }
.rq-ask-label { font-size: 0.9rem; font-weight: 500; color: var(--rq-warm); margin-bottom: 0.7rem; display: block; }

.rq-textarea {
  width: 100%; min-height: 132px; resize: vertical;
  background: var(--rq-surface); color: var(--rq-warm);
  border: 1px solid var(--rq-border); border-radius: 6px;
  padding: 1.05rem 1.15rem; font-family: inherit; font-size: 0.95rem;
  font-weight: 300; line-height: 1.7; transition: border-color 0.25s ease;
}
.rq-textarea::placeholder { color: var(--rq-faint); }
.rq-textarea:focus { outline: none; border-color: rgba(184, 150, 46, 0.5); }

.rq-example {
  margin-top: 0.7rem; display: flex; align-items: flex-start; gap: 0.55rem;
  font-size: 0.8rem; color: var(--rq-faint); background: none; border: none;
  font-family: inherit; cursor: pointer; text-align: left; padding: 0;
  line-height: 1.6; transition: color 0.2s ease;
}
.rq-example:hover { color: var(--rq-muted); }
.rq-example strong { color: var(--rq-gold); font-weight: 500; }

.rq-filters {
  margin-top: 1.75rem; display: grid; gap: 0.9rem;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
}
.rq-field { display: flex; flex-direction: column; gap: 0.4rem; }
.rq-field-label {
  font-size: 10px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--rq-faint);
}
.rq-select, .rq-input {
  background: var(--rq-surface); color: var(--rq-warm); font-family: inherit;
  border: 1px solid var(--rq-border); border-radius: 4px; padding: 0.6rem 0.7rem;
  font-size: 0.85rem; font-weight: 300;
}
.rq-select:focus, .rq-input:focus { outline: none; border-color: rgba(184, 150, 46, 0.5); }
.rq-optional { font-size: 0.78rem; color: var(--rq-faint); margin-top: 1.4rem; }

/* --------------------------------------------------- buttons -- */

.rq-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 0.85rem; margin-top: 1.9rem; }

.rq-btn {
  display: inline-flex; align-items: center; gap: 0.5rem;
  font-family: inherit; font-size: 12px; font-weight: 500;
  letter-spacing: 0.11em; text-transform: uppercase;
  padding: 0.85rem 1.6rem; border-radius: 3px; cursor: pointer;
  text-decoration: none; border: 1px solid transparent;
  transition: background 0.25s ease, color 0.25s ease, border-color 0.25s ease;
}
.rq-btn-solid { background: var(--rq-gold); color: var(--rq-bg); border-color: var(--rq-gold); font-weight: 600; }
.rq-btn-solid:hover { background: transparent; color: var(--rq-gold); }
.rq-btn-ghost { background: transparent; color: var(--rq-warm); border-color: var(--rq-border); }
.rq-btn-ghost:hover { border-color: var(--rq-gold); color: var(--rq-gold); }
.rq-btn-quiet {
  background: none; border: none; color: var(--rq-muted); text-transform: none;
  letter-spacing: 0; font-size: 0.85rem; padding: 0.5rem 0; text-decoration: underline;
  text-underline-offset: 3px; text-decoration-color: var(--rq-border);
}
.rq-btn-quiet:hover { color: var(--rq-gold); text-decoration-color: currentColor; }
.rq-btn:disabled { cursor: not-allowed; opacity: 0.45; }
.rq-btn-sm { padding: 0.55rem 1rem; font-size: 11px; }

/* Small contextual AI actions. Deliberately understated — the
   intelligence shows up in the output, not in a chat bubble. */
.rq-assist { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 1.25rem; }
.rq-assist-btn {
  display: inline-flex; align-items: center; gap: 0.4rem;
  font-family: inherit; font-size: 0.78rem; font-weight: 400; color: var(--rq-muted);
  background: var(--rq-surface); border: 1px solid var(--rq-border-soft);
  border-radius: 20px; padding: 0.4rem 0.85rem; cursor: pointer;
  transition: color 0.2s ease, border-color 0.2s ease;
}
.rq-assist-btn:hover { color: var(--rq-warm); border-color: var(--rq-border); }
.rq-assist-btn::before {
  content: ""; width: 4px; height: 4px; border-radius: 50%;
  background: var(--rq-gold); opacity: 0.7; flex: none;
}

.rq-assist-out {
  margin-top: 0.9rem; padding: 0.9rem 1.1rem; border-radius: 5px;
  background: var(--rq-surface); border: 1px solid var(--rq-border-soft);
  border-left: 2px solid var(--rq-gold);
  font-size: 0.86rem; color: var(--rq-muted); line-height: 1.7;
}
.rq-assist-out[hidden] { display: none; }

/* ---------------------------------------------- capabilities -- */

.rq-cap-grid { display: grid; gap: 0.75rem; grid-template-columns: repeat(auto-fill, minmax(215px, 1fr)); }
.rq-cap-card {
  background: var(--rq-surface); border: 1px solid var(--rq-border-soft);
  border-radius: 6px; padding: 1rem 1.1rem;
}
.rq-cap-card-primary { border-color: rgba(184, 150, 46, 0.4); background: var(--rq-gold-dim); }
.rq-cap-name { font-size: 0.92rem; font-weight: 500; color: var(--rq-warm); margin-bottom: 0.3rem; }
.rq-cap-why { font-size: 0.78rem; color: var(--rq-faint); line-height: 1.6; }
.rq-cap-tag {
  font-size: 9px; font-weight: 600; letter-spacing: 0.13em; text-transform: uppercase;
  color: var(--rq-gold); display: block; margin-bottom: 0.45rem;
}

.rq-chips { display: flex; flex-wrap: wrap; gap: 0.4rem; }
.rq-chip {
  font-size: 0.78rem; color: var(--rq-muted); background: var(--rq-surface-2);
  border: 1px solid var(--rq-border-soft); border-radius: 20px; padding: 0.3rem 0.75rem;
  white-space: nowrap;
}
.rq-chip-match { color: var(--rq-warm); border-color: rgba(184, 150, 46, 0.35); background: var(--rq-gold-dim); }

/* --------------------------------------------------- the flow -- */

.rq-flow {
  display: grid; gap: 0.5rem; margin-top: 1.5rem;
  grid-template-columns: repeat(5, 1fr); align-items: stretch;
}
.rq-flow-step {
  position: relative; background: var(--rq-surface); border: 1px solid var(--rq-border-soft);
  border-radius: 5px; padding: 0.9rem 0.85rem; text-align: center;
}
.rq-flow-step[data-lit="true"] { border-color: rgba(184, 150, 46, 0.45); background: var(--rq-gold-dim); }
.rq-flow-label {
  font-size: 10px; font-weight: 600; letter-spacing: 0.11em; text-transform: uppercase;
  color: var(--rq-muted); line-height: 1.5;
}
.rq-flow-step[data-lit="true"] .rq-flow-label { color: var(--rq-warm); }
.rq-flow-step[data-lit="true"] .rq-flow-value { color: var(--rq-gold); }
.rq-flow-value {
  display: block; font-size: 0.95rem; font-weight: 600; color: var(--rq-faint);
  font-variant-numeric: tabular-nums; margin-top: 0.35rem;
}

/* --------------------------------------------- candidate card -- */

.rq-results-head {
  display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between;
  gap: 1rem; margin-bottom: 1.5rem;
}

/* ------------------------------------------- scale + prioritization -- */

/* The point of this block is the ratio, not either number on its own:
   a large pool narrowed to a short list the recruiter should read. */
.rq-scale {
  margin-top: 1.75rem; background: var(--rq-surface); border: 1px solid var(--rq-border-soft);
  border-radius: 8px; padding: 1.6rem 1.75rem;
}
.rq-scale-figures { display: flex; flex-wrap: wrap; align-items: center; gap: 1.5rem; }
.rq-scale-fig { display: flex; flex-direction: column; gap: 0.2rem; }
.rq-scale-num {
  font-family: var(--rq-font-head); font-size: 2.1rem; font-weight: 500; line-height: 1;
  color: var(--rq-muted); font-variant-numeric: tabular-nums;
}
.rq-scale-fig-lit .rq-scale-num { color: var(--rq-gold); }
.rq-scale-label {
  font-size: 10px; font-weight: 600; letter-spacing: 0.13em; text-transform: uppercase;
  color: var(--rq-faint);
}
.rq-scale-arrow { color: var(--rq-faint); font-size: 1.2rem; }
.rq-scale-lead {
  margin-top: 1.15rem; padding-top: 1.15rem; border-top: 1px solid var(--rq-border-soft);
  font-size: 0.9rem; color: var(--rq-muted); line-height: 1.7; max-width: 68ch;
}

.rq-insight {
  margin-top: 1rem; background: var(--rq-gold-dim); border: 1px solid rgba(184, 150, 46, 0.3);
  border-radius: 8px; padding: 1.35rem 1.6rem;
}
.rq-insight-head {
  font-family: var(--rq-font-head); font-size: 1.25rem; font-weight: 400; color: var(--rq-warm);
  line-height: 1.45; text-wrap: balance;
}
.rq-insight-head strong { color: var(--rq-gold); font-weight: 600; font-variant-numeric: tabular-nums; }
.rq-insight-sub { margin-top: 0.55rem; font-size: 0.86rem; color: var(--rq-muted); line-height: 1.65; }
.rq-insight-sub em { color: var(--rq-warm); font-style: italic; }

.rq-how { margin-top: 1.25rem; border-top: 1px solid var(--rq-border-soft); padding-top: 1rem; }
.rq-how summary {
  cursor: pointer; font-size: 0.85rem; color: var(--rq-muted); list-style: none;
  display: inline-flex; align-items: center; gap: 0.45rem;
}
.rq-how summary::-webkit-details-marker { display: none; }
.rq-how summary::before { content: "+"; color: var(--rq-gold); font-size: 0.9rem; }
.rq-how[open] summary::before { content: "\2212"; }
.rq-how summary:hover { color: var(--rq-warm); }
.rq-how p { margin-top: 0.8rem; font-size: 0.85rem; color: var(--rq-muted); line-height: 1.75; max-width: 72ch; }
.rq-how em { color: var(--rq-warm); font-style: italic; }

/* ------------------------------------------------------- controls -- */

.rq-controls {
  margin-top: 1.5rem; padding: 1.15rem 1.25rem; background: var(--rq-surface);
  border: 1px solid var(--rq-border-soft); border-radius: 7px;
  display: flex; flex-wrap: wrap; gap: 1.5rem; align-items: flex-start;
}
.rq-control-group { display: flex; flex-direction: column; gap: 0.55rem; }
.rq-control-label {
  font-size: 9px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--rq-faint);
}
.rq-seg { display: inline-flex; border: 1px solid var(--rq-border); border-radius: 4px; overflow: hidden; }
.rq-seg-btn {
  font-family: inherit; font-size: 0.8rem; color: var(--rq-muted); background: none;
  border: none; padding: 0.5rem 0.9rem; cursor: pointer; white-space: nowrap;
  border-right: 1px solid var(--rq-border-soft); transition: background 0.2s ease, color 0.2s ease;
}
.rq-seg-btn:last-child { border-right: none; }
.rq-seg-btn:hover { color: var(--rq-warm); }
.rq-seg-btn[aria-pressed="true"] { background: var(--rq-gold-dim); color: var(--rq-gold); font-weight: 500; }
.rq-filter-row { display: flex; flex-wrap: wrap; gap: 0.75rem; }
.rq-filter-row .rq-field { min-width: 148px; }

.rq-showing { margin-top: 1.1rem; font-size: 0.83rem; color: var(--rq-muted); font-variant-numeric: tabular-nums; }
.rq-depth-note {
  margin-top: 0.5rem; font-size: 0.8rem; color: var(--rq-faint); line-height: 1.65;
  border-left: 2px solid var(--rq-border); padding-left: 0.75rem;
}
.rq-depth-note[hidden], .rq-empty[hidden] { display: none; }

/* --------------------------------------------------- rank on card -- */

.rq-cand[hidden] { display: none; }
.rq-cand-headline { display: flex; align-items: flex-start; gap: 0.9rem; }
.rq-rank {
  font-family: var(--rq-font-head); font-size: 1.35rem; font-weight: 500; color: var(--rq-gold);
  line-height: 1.15; font-variant-numeric: tabular-nums; flex: none; min-width: 2.1rem;
}
.rq-rank-why {
  margin-top: 1.1rem; font-size: 0.88rem; color: var(--rq-muted); line-height: 1.7;
  background: var(--rq-surface-2); border-radius: 5px; padding: 0.85rem 1rem;
}
.rq-rank-why-label { color: var(--rq-gold); font-weight: 600; margin-right: 0.35rem; }

.rq-flag-transfer { color: #8a9bc4; border-color: rgba(138, 155, 196, 0.4); background: rgba(138, 155, 196, 0.1); }
.rq-flag-partial { color: var(--rq-moderate); border-color: rgba(192, 138, 62, 0.4); background: var(--rq-moderate-bg); }
.rq-flag-title { color: var(--rq-faint); border-color: var(--rq-border); background: none; }
.rq-flag-notitle { color: var(--rq-gold); border-color: rgba(184, 150, 46, 0.35); background: var(--rq-gold-dim); }

.rq-cand-list { display: flex; flex-direction: column; gap: 1rem; }

.rq-cand {
  background: var(--rq-surface); border: 1px solid var(--rq-border-soft);
  border-radius: 8px; padding: 1.5rem 1.6rem;
  transition: border-color 0.25s ease;
}
.rq-cand:hover { border-color: var(--rq-border); }
/* The card header is the expand control. A ranked list of 25 cannot be
   25 full cards, so everything below the header collapses; the top three
   open by default, which is the prioritisation thesis expressed as
   layout rather than as a sentence. */
.rq-cand-top {
  display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between;
  gap: 1.25rem; margin-bottom: 1.15rem;
  width: 100%; background: none; border: none; padding: 0;
  font-family: inherit; text-align: left; cursor: pointer;
}
.rq-cand-detail { display: none; }
.rq-cand[data-open="true"] .rq-cand-detail { display: block; }

.rq-chev {
  display: block; width: 9px; height: 9px; margin: 0.75rem 0 0 auto;
  border-right: 1.5px solid var(--rq-muted); border-bottom: 1.5px solid var(--rq-muted);
  transform: rotate(45deg); transition: transform 0.25s ease;
}
.rq-cand[data-open="true"] .rq-chev { transform: rotate(-135deg); }
.rq-cand-top:hover .rq-chev { border-color: var(--rq-gold); }

/* Collapsed, the rationale is clamped rather than hidden: it is the one
   line that distinguishes this from a job-board result row. */
.rq-cand[data-open="false"] .rq-rank-why {
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  overflow: hidden; margin-bottom: 0;
}
/* Let the identity block shrink so the score stays on the header row.
   Without the min-width:0 the flag pills (one of which is a whole
   sentence) force it wide and push the score onto its own line. */
.rq-cand-id { flex: 1 1 300px; min-width: 0; }
.rq-cand-name {
  font-family: var(--rq-font-head); font-size: 1.4rem; font-weight: 500;
  color: var(--rq-warm); line-height: 1.25; margin-bottom: 0.25rem;
}
.rq-cand-role { font-size: 0.85rem; color: var(--rq-muted); }
.rq-cand-flags { display: flex; flex-wrap: wrap; gap: 0.4rem; margin-top: 0.6rem; }

.rq-flag {
  font-size: 9px; font-weight: 600; letter-spacing: 0.11em; text-transform: uppercase;
  border-radius: 3px; padding: 0.25rem 0.55rem; border: 1px solid;
}
.rq-flag-adjacent { color: var(--rq-gold); border-color: rgba(184, 150, 46, 0.4); background: var(--rq-gold-dim); }
.rq-flag-direct { color: var(--rq-strong); border-color: rgba(79, 150, 115, 0.4); background: var(--rq-strong-bg); }
.rq-flag-sample { color: var(--rq-faint); border-color: var(--rq-border); background: none; }
.rq-flag-real { color: var(--rq-warm); border-color: var(--rq-border); background: var(--rq-surface-2); }

/* The score is present but deliberately not the headline: it sits
   right-aligned at label size, with the explanation given the room. */
.rq-cand-score { text-align: right; flex: none; }
.rq-score-num {
  font-family: var(--rq-font-head); font-size: 2rem; font-weight: 500;
  color: var(--rq-warm); line-height: 1; font-variant-numeric: tabular-nums;
}
.rq-score-label {
  display: block; font-size: 9px; font-weight: 600; letter-spacing: 0.13em;
  text-transform: uppercase; color: var(--rq-faint); margin-top: 0.35rem;
}
.rq-score-bar { width: 118px; height: 3px; background: var(--rq-surface-2); border-radius: 2px; margin-top: 0.6rem; overflow: hidden; }
.rq-score-fill { height: 100%; background: var(--rq-gold); border-radius: 2px; }

.rq-facts {
  display: grid; gap: 0.9rem 1.5rem; grid-template-columns: repeat(auto-fit, minmax(112px, 1fr));
  padding: 1rem 0; border-top: 1px solid var(--rq-border-soft); border-bottom: 1px solid var(--rq-border-soft);
}
.rq-fact-label {
  font-size: 9px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--rq-faint); display: block; margin-bottom: 0.25rem;
}
.rq-fact-value { font-size: 0.88rem; color: var(--rq-warm); font-variant-numeric: tabular-nums; }

.rq-cand-body { display: grid; gap: 1.5rem; grid-template-columns: 1.35fr 1fr; margin-top: 1.25rem; }

.rq-block-label {
  font-size: 10px; font-weight: 600; letter-spacing: 0.13em; text-transform: uppercase;
  color: var(--rq-gold); margin-bottom: 0.7rem;
}
.rq-block-label-quiet { color: var(--rq-faint); }

.rq-why { list-style: none; display: flex; flex-direction: column; gap: 0.5rem; }
.rq-why li {
  display: flex; gap: 0.6rem; font-size: 0.85rem; color: var(--rq-muted); line-height: 1.6;
}
.rq-why li::before {
  content: "\2713"; color: var(--rq-strong); font-size: 0.8rem; flex: none; line-height: 1.7;
}

.rq-evidence {
  background: var(--rq-surface-2); border-left: 2px solid var(--rq-gold);
  border-radius: 0 4px 4px 0; padding: 0.85rem 1rem; margin-top: 1rem;
}
.rq-evidence-quote { font-size: 0.85rem; color: var(--rq-warm); font-style: italic; line-height: 1.65; }
.rq-evidence-src { display: block; font-size: 0.72rem; color: var(--rq-faint); margin-top: 0.45rem; font-style: normal; }

.rq-side-block + .rq-side-block { margin-top: 1.15rem; }
.rq-side-text { font-size: 0.83rem; color: var(--rq-muted); line-height: 1.65; }

.rq-gap-note {
  font-size: 0.83rem; color: var(--rq-muted); line-height: 1.65;
  background: var(--rq-gap-bg); border: 1px solid rgba(181, 86, 61, 0.25);
  border-radius: 4px; padding: 0.7rem 0.85rem;
}
.rq-intent-note {
  font-size: 0.83rem; color: var(--rq-muted); line-height: 1.65;
  background: var(--rq-strong-bg); border: 1px solid rgba(79, 150, 115, 0.25);
  border-radius: 4px; padding: 0.7rem 0.85rem;
}

.rq-cand-actions {
  display: flex; flex-wrap: wrap; gap: 0.6rem; margin-top: 1.35rem;
  padding-top: 1.25rem; border-top: 1px solid var(--rq-border-soft);
}

/* --------------------------------------------- why-match view -- */

.rq-back {
  display: inline-flex; align-items: center; gap: 0.45rem; background: none; border: none;
  font-family: inherit; font-size: 0.83rem; color: var(--rq-muted); cursor: pointer;
  padding: 0; margin-bottom: 1.5rem; transition: color 0.2s ease;
}
.rq-back:hover { color: var(--rq-gold); }

.rq-compare-rows { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 1.25rem; }
.rq-compare-row {
  display: grid; grid-template-columns: 1fr auto 1.2fr; gap: 1rem; align-items: center;
  background: var(--rq-surface); border: 1px solid var(--rq-border-soft);
  border-radius: 5px; padding: 0.9rem 1.1rem;
}
.rq-compare-need { font-size: 0.88rem; color: var(--rq-warm); }
.rq-compare-arrow { color: var(--rq-faint); font-size: 0.85rem; }
.rq-compare-ev { display: flex; align-items: center; gap: 0.7rem; justify-content: flex-end; }
.rq-compare-ev-text { font-size: 0.85rem; color: var(--rq-muted); text-align: right; }

.rq-dots { display: flex; gap: 3px; flex: none; }
.rq-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--rq-surface-2); border: 1px solid var(--rq-border); }
.rq-dot[data-on="true"] { background: var(--rq-strong); border-color: var(--rq-strong); }
.rq-dot[data-on="partial"] { background: var(--rq-moderate); border-color: var(--rq-moderate); }

.rq-assess-grid { display: grid; gap: 0.85rem; grid-template-columns: repeat(auto-fit, minmax(215px, 1fr)); margin-top: 1.25rem; }
.rq-assess {
  border-radius: 6px; padding: 1.05rem 1.15rem; border: 1px solid;
}
.rq-assess-strong { background: var(--rq-strong-bg); border-color: rgba(79, 150, 115, 0.3); }
.rq-assess-moderate { background: var(--rq-moderate-bg); border-color: rgba(192, 138, 62, 0.3); }
.rq-assess-gap { background: var(--rq-gap-bg); border-color: rgba(181, 86, 61, 0.3); }
.rq-assess-label {
  font-size: 10px; font-weight: 700; letter-spacing: 0.13em; text-transform: uppercase;
  margin-bottom: 0.65rem;
}
.rq-assess-strong .rq-assess-label { color: var(--rq-strong); }
.rq-assess-moderate .rq-assess-label { color: var(--rq-moderate); }
.rq-assess-gap .rq-assess-label { color: var(--rq-gap); }
.rq-assess ul { list-style: none; display: flex; flex-direction: column; gap: 0.35rem; }
.rq-assess li { font-size: 0.85rem; color: var(--rq-warm); }

/* The transferability statement is the product's whole argument, so
   it gets the weight of a pull-quote rather than a body paragraph. */
.rq-transfer {
  margin-top: 1.75rem; background: var(--rq-surface); border: 1px solid rgba(184, 150, 46, 0.28);
  border-radius: 7px; padding: 1.5rem 1.65rem;
}
.rq-transfer-text {
  font-family: var(--rq-font-head); font-size: 1.12rem; font-weight: 400; font-style: italic;
  color: var(--rq-warm); line-height: 1.6; text-wrap: balance;
}
.rq-transfer-text em { color: var(--rq-gold); font-style: italic; }

/* ------------------------------------ coverage & match intelligence -- */

/* Coverage of the recruiter's own six capabilities. Deliberately not a
   progress bar: a bar says "how much", this has to say "which ones". */
.rq-cov {
  margin-top: 0.85rem; padding: 0.8rem 1rem; border-radius: 6px;
  background: var(--rq-surface-2); border: 1px solid var(--rq-border-soft);
}
.rq-cov-head {
  display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between;
  gap: 0.6rem; margin-bottom: 0.6rem;
}
.rq-cov-label {
  font-size: 9px; font-weight: 600; letter-spacing: 0.13em; text-transform: uppercase;
  color: var(--rq-faint);
}
.rq-cov-score { font-size: 0.83rem; color: var(--rq-muted); font-variant-numeric: tabular-nums; }
.rq-cov-score strong { color: var(--rq-gold); font-size: 1.05rem; font-weight: 600; }
.rq-cov-list {
  list-style: none; display: grid; gap: 0.35rem 1rem;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
}
.rq-cov-item { display: flex; align-items: baseline; gap: 0.45rem; font-size: 0.82rem; }
.rq-cov-mark { flex: none; font-size: 0.8rem; width: 0.9em; }
.rq-cov-full .rq-cov-mark { color: var(--rq-strong); }
.rq-cov-part .rq-cov-mark { color: var(--rq-moderate); font-size: 0.6rem; }
.rq-cov-none .rq-cov-mark { color: var(--rq-faint); }
.rq-cov-full .rq-cov-name { color: var(--rq-warm); }
.rq-cov-part .rq-cov-name { color: var(--rq-muted); }
.rq-cov-none .rq-cov-name { color: var(--rq-faint); text-decoration: line-through; text-decoration-color: rgba(245,242,237,0.2); }

/* Four separate readings, kept separate on purpose. */
.rq-mi { margin-top: 0.75rem; }
.rq-mi-label {
  font-size: 9px; font-weight: 600; letter-spacing: 0.13em; text-transform: uppercase;
  color: var(--rq-faint); display: block; margin-bottom: 0.5rem;
}
.rq-mi-grid { display: grid; gap: 1px; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); }
.rq-mi-cell {
  display: flex; flex-direction: column; gap: 0.2rem;
  padding: 0.5rem 0.75rem; background: var(--rq-surface-2);
}
.rq-mi-cell:first-child { border-radius: 5px 0 0 5px; }
.rq-mi-cell:last-child { border-radius: 0 5px 5px 0; }
.rq-mi-k {
  font-size: 9px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase;
  color: var(--rq-faint);
}
.rq-mi-v { font-size: 0.95rem; font-weight: 500; font-variant-numeric: tabular-nums; }
.rq-mi-hi { color: var(--rq-strong); }
.rq-mi-mid { color: var(--rq-moderate); }
.rq-mi-lo { color: var(--rq-muted); }

/* Why #N, with the counts that back the sentence up. */
.rq-rank-why-wrap { margin-top: 0.85rem; }
.rq-rank-why-wrap .rq-rank-why { margin-top: 0; }
.rq-wb {
  display: grid; gap: 1px; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  margin-bottom: 0.9rem;
}

.rq-wb-cell { display: flex; flex-direction: column; gap: 0.2rem; padding: 0.6rem 0.8rem; background: var(--rq-surface-2); }
.rq-wb-k {
  font-size: 9px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase;
  color: var(--rq-faint);
}
.rq-wb-v { font-size: 0.88rem; color: var(--rq-warm); font-variant-numeric: tabular-nums; }

.rq-discovery { font-size: 0.8rem; color: var(--rq-muted); margin-top: 1rem; }
.rq-discovery-k {
  font-size: 9px; font-weight: 600; letter-spacing: 0.13em; text-transform: uppercase;
  color: var(--rq-faint); margin-right: 0.5rem;
}

/* ------------------------------------------------- tabs in a card -- */

/* An expanded candidate was running past 1,400px. Tabs keep each view to
   roughly a screen, without moving anything to a separate page and
   losing the ranked list around it. */
.rq-tabs {
  display: flex; gap: 0.15rem; margin-top: 0.95rem;
  border-bottom: 1px solid var(--rq-border-soft);
  /* Four tabs do not fit 375px. Scroll the strip rather than clipping
     the last tab, which would make it unreachable on a phone. */
  overflow-x: auto; scrollbar-width: none;
}
.rq-tabs::-webkit-scrollbar { display: none; }
.rq-tab { flex: none; white-space: nowrap; }
.rq-tab {
  font-family: inherit; font-size: 0.82rem; color: var(--rq-muted);
  background: none; border: none; border-bottom: 2px solid transparent;
  padding: 0.55rem 0.9rem; cursor: pointer; margin-bottom: -1px;
  transition: color 0.2s ease, border-color 0.2s ease;
}
.rq-tab:hover { color: var(--rq-warm); }
.rq-tab[aria-selected="true"] { color: var(--rq-gold); border-bottom-color: var(--rq-gold); }

.rq-panel { display: none; padding-top: 0.9rem; }
.rq-panel[data-on="true"] { display: block; animation: rq-fade 0.25s ease both; }
.rq-panel-block { margin-top: 1rem; }
.rq-panel-grid {
  display: grid; gap: 1.25rem; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  margin-top: 1rem;
}
.rq-panel-grid .rq-side-block { margin-top: 0; }

/* ------------------------------------------ justify every claim -- */

.rq-mi-hint { text-transform: none; letter-spacing: 0; font-weight: 400; color: var(--rq-faint); }

.rq-mi-cell {
  font-family: inherit; text-align: left; border: none; cursor: pointer;
  position: relative; transition: background 0.2s ease;
}
.rq-mi-cell:hover { background: rgba(245, 242, 237, 0.045); }
.rq-mi-ask {
  position: absolute; top: 0.55rem; right: 0.7rem;
  font-size: 9px; letter-spacing: 0.06em; color: var(--rq-faint);
  opacity: 0; transition: opacity 0.2s ease;
}
.rq-mi-cell:hover .rq-mi-ask,
.rq-mi-cell[aria-expanded="true"] .rq-mi-ask { opacity: 1; }
.rq-mi-cell[aria-expanded="true"] { background: rgba(184, 150, 46, 0.09); }

.rq-explain {
  margin-top: 0.6rem; padding: 0.8rem 1rem; border-radius: 5px;
  background: var(--rq-surface-2); border-left: 2px solid var(--rq-gold);
  font-size: 0.84rem; color: var(--rq-muted); line-height: 1.7;
}
.rq-explain[hidden] { display: none; }

.rq-cov-item {
  font-family: inherit; background: none; border: none; padding: 0.1rem 0;
  cursor: pointer; text-align: left; width: 100%;
  display: flex; align-items: baseline; gap: 0.45rem; font-size: 0.82rem;
}
.rq-cov-item:hover .rq-cov-name { color: var(--rq-gold); }
.rq-cov-list > li { list-style: none; }

/* ------------------------------------------- disclosures & suggests -- */

.rq-disc { margin-top: 0.9rem; border-top: 1px solid var(--rq-border-soft); padding-top: 0.8rem; }
.rq-disc summary {
  cursor: pointer; list-style: none; font-size: 0.83rem; color: var(--rq-muted);
  display: inline-flex; align-items: center; gap: 0.45rem;
}
.rq-disc summary::-webkit-details-marker { display: none; }
.rq-disc summary::before { content: "+"; color: var(--rq-gold); }
.rq-disc[open] summary::before { content: "\2212"; }
.rq-disc summary:hover { color: var(--rq-warm); }
.rq-disc-body { margin-top: 0.7rem; font-size: 0.84rem; color: var(--rq-muted); line-height: 1.7; max-width: 72ch; }

.rq-ob { margin-top: 0.85rem; display: flex; flex-direction: column; gap: 1px; }
.rq-ob-row {
  display: grid; grid-template-columns: 1fr auto; gap: 0.3rem 1rem;
  padding: 0.75rem 0.9rem; background: var(--rq-surface-2);
}
.rq-ob-who { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.5rem; }
.rq-ob-rank { font-family: var(--rq-font-head); color: var(--rq-gold); font-size: 0.9rem; }
.rq-ob-name { font-size: 0.88rem; color: var(--rq-warm); }
.rq-ob-role { font-size: 0.76rem; color: var(--rq-faint); }
.rq-ob-score { font-size: 0.88rem; color: var(--rq-muted); font-variant-numeric: tabular-nums; }
.rq-ob-why { grid-column: 1 / -1; font-size: 0.82rem; color: var(--rq-muted); line-height: 1.6; }

/* JORA suggests: a prioritisation of the recruiter's time, never a
   hiring decision -- which is why it reads "review", not "hire". */
.rq-sug {
  display: grid; grid-template-columns: auto auto 1fr; gap: 0.5rem 0.85rem;
  align-items: baseline; margin-top: 1.1rem; padding: 0.85rem 1rem;
  border-radius: 6px; border: 1px solid;
}
.rq-sug-go { background: var(--rq-strong-bg); border-color: rgba(79, 150, 115, 0.3); }
.rq-sug-look { background: var(--rq-moderate-bg); border-color: rgba(192, 138, 62, 0.3); }
.rq-sug-hold { background: var(--rq-surface-2); border-color: var(--rq-border); }
.rq-sug-label {
  font-size: 9px; font-weight: 600; letter-spacing: 0.13em; text-transform: uppercase;
  color: var(--rq-faint);
}
.rq-sug-action {
  font-size: 11px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase;
  padding: 0.2rem 0.6rem; border-radius: 3px;
}
.rq-sug-go .rq-sug-action { color: var(--rq-strong); background: rgba(79, 150, 115, 0.18); }
.rq-sug-look .rq-sug-action { color: var(--rq-moderate); background: rgba(192, 138, 62, 0.18); }
.rq-sug-hold .rq-sug-action { color: var(--rq-muted); background: rgba(245, 242, 237, 0.06); }
.rq-sug-why { font-size: 0.84rem; color: var(--rq-muted); line-height: 1.6; }

.rq-scale-fig-disc .rq-scale-num { color: var(--rq-warm); }

@media (max-width: 620px) {
  .rq-mi-grid, .rq-wb { grid-template-columns: 1fr; }
  .rq-mi-cell, .rq-wb-cell { border-radius: 0 !important; }
  .rq-sug { grid-template-columns: 1fr; }
}

/* ------------------------------------------ evidence & documents -- */

/* Evidence position on the ranked card. Three fixed rows so the shape is
   identical on every card and reads straight down the ranked list. The
   left column is the bucket, the right names what is actually in it. */
.rq-ev { margin-top: 1rem; }
.rq-ev-label {
  font-size: 9px; font-weight: 600; letter-spacing: 0.13em; text-transform: uppercase;
  color: var(--rq-faint); margin-bottom: 0.5rem;
}
.rq-ev-rows {
  list-style: none; display: flex; flex-direction: column; gap: 1px;
  border-radius: 5px; overflow: hidden;
}
.rq-ev-row {
  display: grid; grid-template-columns: 168px 1fr; gap: 0.9rem; align-items: baseline;
  padding: 0.55rem 0.8rem; background: var(--rq-surface-2); border-left: 2px solid;
  font-size: 0.8rem;
}
.rq-ev-row-file { border-left-color: var(--rq-strong); }
.rq-ev-row-req { border-left-color: var(--rq-moderate); }
.rq-ev-row-att { border-left-color: var(--rq-faint); }
.rq-ev-row-none { opacity: 0.55; }
.rq-ev-k {
  font-size: 10px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase;
  color: var(--rq-muted); display: inline-flex; align-items: center; gap: 0.4rem;
}
.rq-ev-row-file .rq-ev-k { color: var(--rq-strong); }
.rq-ev-row-req .rq-ev-k { color: var(--rq-moderate); }
.rq-ev-n {
  font-size: 10px; font-weight: 700; color: var(--rq-warm); letter-spacing: 0;
  background: rgba(245, 242, 237, 0.1); border-radius: 20px; padding: 0.02rem 0.4rem;
  font-variant-numeric: tabular-nums;
}
.rq-ev-v { color: var(--rq-warm); line-height: 1.5; }
.rq-ev-row-none .rq-ev-v { color: var(--rq-faint); font-style: italic; }

@media (max-width: 620px) {
  .rq-ev-row { grid-template-columns: 1fr; gap: 0.25rem; }
}

/* ------------------------------------------------ source & identity -- */

/* The mix of the searchable pool. The bar is deliberately honest about
   proportion: NEST profiles are the small slice, and hiding that would
   be the kind of thing that gets noticed in a demo. */
.rq-mix { margin-top: 1.15rem; padding-top: 1.15rem; border-top: 1px solid var(--rq-border-soft); }
.rq-mix-bar {
  height: 6px; border-radius: 3px; background: var(--rq-surface-2);
  overflow: hidden; margin-bottom: 0.7rem;
}
.rq-mix-nest { display: block; height: 100%; background: var(--rq-gold); border-radius: 3px; }
.rq-mix-note { font-size: 0.82rem; color: var(--rq-muted); line-height: 1.7; max-width: 68ch; }
.rq-mix-note strong { color: var(--rq-warm); font-weight: 500; }

.rq-flag-src-nest { color: var(--rq-gold); border-color: rgba(184, 150, 46, 0.5); background: var(--rq-gold-dim); font-weight: 700; }
.rq-flag-src-cv { color: var(--rq-muted); border-color: var(--rq-border); background: var(--rq-surface-2); }

.rq-id { margin-top: 1rem; }
.rq-id-label {
  font-size: 9px; font-weight: 600; letter-spacing: 0.13em; text-transform: uppercase;
  color: var(--rq-faint); display: block; margin-bottom: 0.5rem;
}
.rq-id-list {
  list-style: none; display: grid; gap: 0.4rem 1.25rem;
  grid-template-columns: repeat(auto-fit, minmax(215px, 1fr));
}
.rq-id-item { display: flex; align-items: baseline; gap: 0.45rem; font-size: 0.8rem; }
.rq-id-tick { color: var(--rq-strong); font-size: 0.78rem; flex: none; }
.rq-id-name { color: var(--rq-warm); flex: none; }
.rq-id-how { color: var(--rq-faint); font-size: 0.75rem; line-height: 1.45; }

.rq-id-none {
  display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.6rem;
  padding: 0.55rem 0.8rem; background: var(--rq-surface-2);
  border-left: 2px solid var(--rq-faint); border-radius: 5px;
}
.rq-id-none .rq-id-label { margin-bottom: 0; }
.rq-id-warn { font-size: 0.8rem; color: var(--rq-muted); }

.rq-ev-row-cv { border-left-color: var(--rq-faint); grid-template-columns: 118px 1fr; }
.rq-ev-row-cv .rq-ev-k { color: var(--rq-muted); }

/* What a CV cannot tell you. Plain rows, no alarm colouring: these are
   limits of the source, not faults in the person. */
.rq-lim { list-style: none; display: flex; flex-direction: column; gap: 1px; margin-top: 1.25rem; border-radius: 6px; overflow: hidden; }
.rq-lim-row {
  display: grid; grid-template-columns: 168px 1fr; gap: 1rem; align-items: baseline;
  padding: 0.8rem 1rem; background: var(--rq-surface); border-left: 2px solid var(--rq-faint);
}
.rq-lim-k {
  font-size: 10px; font-weight: 600; letter-spacing: 0.11em; text-transform: uppercase;
  color: var(--rq-muted);
}
.rq-lim-v { font-size: 0.86rem; color: var(--rq-warm); line-height: 1.6; }

@media (max-width: 620px) {
  .rq-lim-row { grid-template-columns: 1fr; gap: 0.3rem; }
}

.rq-doc-grid {
  display: grid; gap: 0.85rem; grid-template-columns: repeat(auto-fit, minmax(255px, 1fr));
  margin-top: 1.25rem; align-items: start;
}
.rq-doc { border-radius: 7px; padding: 1.15rem 1.25rem; border: 1px solid; }
.rq-doc-file { background: var(--rq-strong-bg); border-color: rgba(79, 150, 115, 0.3); }
.rq-doc-req { background: var(--rq-moderate-bg); border-color: rgba(192, 138, 62, 0.3); }
/* Neutral, not alarming: "cannot be documented" is an honest property of
   the work, not a fault in the candidate. */
.rq-doc-att { background: var(--rq-surface-2); border-color: var(--rq-border); }

.rq-doc-label {
  font-size: 10px; font-weight: 700; letter-spacing: 0.13em; text-transform: uppercase;
  margin-bottom: 0.45rem; display: flex; align-items: center; gap: 0.5rem;
}
.rq-doc-file .rq-doc-label { color: var(--rq-strong); }
.rq-doc-req .rq-doc-label { color: var(--rq-moderate); }
.rq-doc-att .rq-doc-label { color: var(--rq-muted); }
.rq-doc-count {
  font-size: 10px; font-weight: 600; letter-spacing: 0; color: var(--rq-warm);
  background: rgba(245, 242, 237, 0.08); border-radius: 20px; padding: 0.05rem 0.45rem;
  font-variant-numeric: tabular-nums;
}
.rq-doc-note { font-size: 0.78rem; color: var(--rq-faint); line-height: 1.6; margin-bottom: 0.85rem; }
.rq-doc-list { list-style: none; display: flex; flex-direction: column; gap: 0.7rem; }
.rq-doc-list li { display: flex; flex-direction: column; gap: 0.2rem; }
.rq-doc-name { font-size: 0.85rem; color: var(--rq-warm); line-height: 1.45; }
.rq-doc-why { font-size: 0.76rem; color: var(--rq-muted); line-height: 1.55; }
.rq-doc-empty { font-size: 0.8rem; color: var(--rq-faint); font-style: italic; }

/* ------------------------------------------ shortlist / table -- */

.rq-table-wrap { overflow-x: auto; margin-top: 1.25rem; border: 1px solid var(--rq-border-soft); border-radius: 7px; }
.rq-table { width: 100%; border-collapse: collapse; min-width: 880px; }
.rq-table thead th {
  text-align: left; font-size: 9px; font-weight: 600; letter-spacing: 0.13em;
  text-transform: uppercase; color: var(--rq-faint); padding: 0.9rem 1rem;
  background: var(--rq-surface-2); border-bottom: 1px solid var(--rq-border-soft); white-space: nowrap;
}
.rq-table tbody td {
  padding: 1rem; font-size: 0.86rem; color: var(--rq-muted);
  border-bottom: 1px solid var(--rq-border-soft); vertical-align: middle;
}
.rq-table tbody tr:last-child td { border-bottom: none; }
.rq-table tbody tr:hover td { background: var(--rq-surface); }
.rq-cell-name { color: var(--rq-warm); font-weight: 500; font-size: 0.9rem; }
.rq-cell-sub { display: block; font-size: 0.75rem; color: var(--rq-faint); margin-top: 0.15rem; }
.rq-cell-num { font-variant-numeric: tabular-nums; color: var(--rq-warm); }

.rq-pill {
  display: inline-block; font-size: 10px; font-weight: 600; letter-spacing: 0.08em;
  text-transform: uppercase; border-radius: 3px; padding: 0.25rem 0.55rem; border: 1px solid;
  white-space: nowrap;
}
.rq-pill-strong { color: var(--rq-strong); border-color: rgba(79, 150, 115, 0.4); background: var(--rq-strong-bg); }
.rq-pill-moderate { color: var(--rq-moderate); border-color: rgba(192, 138, 62, 0.4); background: var(--rq-moderate-bg); }
.rq-pill-gap { color: var(--rq-gap); border-color: rgba(181, 86, 61, 0.4); background: var(--rq-gap-bg); }

.rq-empty {
  border: 1px dashed var(--rq-border); border-radius: 7px; padding: 3rem 2rem;
  text-align: center; color: var(--rq-faint); font-size: 0.9rem; margin-top: 1.25rem;
}

/* --------------------------------------------------- compare -- */

.rq-vs { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(255px, 1fr)); margin-top: 1.25rem; }
.rq-vs-col { background: var(--rq-surface); border: 1px solid var(--rq-border-soft); border-radius: 7px; padding: 1.3rem 1.35rem; }
.rq-vs-col[data-lead="true"] { border-color: rgba(184, 150, 46, 0.4); }
.rq-vs-name { font-family: var(--rq-font-head); font-size: 1.15rem; color: var(--rq-warm); margin-bottom: 0.2rem; }
.rq-vs-role { font-size: 0.8rem; color: var(--rq-faint); margin-bottom: 1rem; }
.rq-vs-row { padding: 0.7rem 0; border-top: 1px solid var(--rq-border-soft); }
.rq-vs-label {
  font-size: 9px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--rq-faint); display: block; margin-bottom: 0.3rem;
}
.rq-vs-value { font-size: 0.85rem; color: var(--rq-warm); }

.rq-verdict {
  margin-top: 1.75rem; background: var(--rq-surface); border: 1px solid var(--rq-border);
  border-radius: 7px; padding: 1.6rem 1.75rem;
}
.rq-verdict-line { font-size: 0.92rem; color: var(--rq-muted); line-height: 1.75; }
.rq-verdict-line + .rq-verdict-line { margin-top: 0.7rem; }
.rq-verdict-line strong { color: var(--rq-warm); font-weight: 500; }

/* ------------------------------------------------- final cta -- */

.rq-cta {
  margin-top: 2.5rem; text-align: center; background: var(--rq-surface);
  border: 1px solid var(--rq-border-soft); border-radius: 9px; padding: 3rem 2rem;
}
.rq-cta .rq-actions { justify-content: center; }

/* ------------------------------------------------ demo strip -- */

.rq-demo-note {
  margin-top: 3rem; padding-top: 1.5rem; border-top: 1px solid var(--rq-border-soft);
  font-size: 0.78rem; color: var(--rq-faint); line-height: 1.7; max-width: 72ch;
}
.rq-demo-note strong { color: var(--rq-muted); font-weight: 500; }

/* -------------------------------------------------- responsive -- */

@media (max-width: 1080px) {
  .rq-cand-body { grid-template-columns: 1fr; }
}

@media (max-width: 860px) {
  .rq-shell { flex-direction: column; }
  .rq-rail {
    width: 100%; height: auto; position: static; flex-direction: row;
    align-items: center; gap: 1.25rem; padding: 1rem 1.25rem;
    border-right: none; border-bottom: 1px solid var(--rq-border-soft);
    overflow-x: auto;
  }
  .rq-nav { flex-direction: row; gap: 0.25rem; }
  .rq-nav-label, .rq-rail-foot { display: none; }
  .rq-brand { flex: none; }
  .rq-brand-name { white-space: nowrap; font-size: 1rem; }
  /* The stacked eyebrow costs a whole line in a horizontal rail, and
     the page title already says where you are. */
  .rq-brand-label { display: none; }
  .rq-nav-item { white-space: nowrap; padding: 0.5rem 0.7rem; }
  .rq-screen { padding: 2rem 1.35rem 4rem; }
  .rq-flow { grid-template-columns: 1fr; }
  .rq-compare-row { grid-template-columns: 1fr; gap: 0.5rem; }
  .rq-compare-arrow { display: none; }
  .rq-compare-ev { justify-content: flex-start; }
  .rq-compare-ev-text { text-align: left; }
  .rq-cand-top { flex-direction: column; }
  .rq-cand-score { text-align: left; }
  .rq-score-bar { margin-left: 0; }
}

/* ============================================ ASK THE CANDIDATE ==
   The gap-closing loop. An answered question is rendered as evidence
   with an attribution line, because that is what it becomes: part of
   the NEST, visible to every recruiter, not a private reply. */

.rq-gapwork { margin-top: 0.75rem; }

.rq-answered {
  background: var(--rq-strong-bg); border: 1px solid rgba(79, 150, 115, 0.3);
  border-radius: 6px; padding: 0.85rem 1rem; margin-bottom: 0.7rem;
}
.rq-answered-label {
  font-size: 9px; font-weight: 700; letter-spacing: 0.13em; text-transform: uppercase;
  color: var(--rq-strong); margin-bottom: 0.5rem;
}
.rq-answered-q { font-size: 0.8rem; color: var(--rq-muted); line-height: 1.55; margin-bottom: 0.45rem; }
.rq-answered-a { font-size: 0.85rem; color: var(--rq-warm); line-height: 1.65; font-style: italic; }
.rq-answered-meta { font-size: 0.72rem; color: var(--rq-faint); margin-top: 0.5rem; }

.rq-gapask {
  background: var(--rq-surface-2); border: 1px solid var(--rq-border-soft);
  border-left: 2px solid var(--rq-gold); border-radius: 0 6px 6px 0; padding: 0.85rem 1rem;
}
.rq-gapask-label {
  font-size: 9px; font-weight: 600; letter-spacing: 0.13em; text-transform: uppercase;
  color: var(--rq-gold); margin-bottom: 0.5rem;
}
.rq-gapask-q { font-size: 0.84rem; color: var(--rq-warm); line-height: 1.6; margin-bottom: 0.7rem; }
.rq-gapask-none {
  font-size: 0.8rem; color: var(--rq-faint); line-height: 1.6;
  border-left: 2px solid var(--rq-border); padding-left: 0.75rem;
}

/* ======================================= REQUIREMENT FEASIBILITY == */

.rq-feas {
  background: var(--rq-surface); border: 1px solid rgba(184, 150, 46, 0.28);
  border-radius: 8px; padding: 1.5rem 1.65rem; margin-top: 1.25rem;
}
.rq-feas-label {
  font-family: var(--rq-font-head); font-size: 1.15rem; color: var(--rq-warm);
  margin-bottom: 1rem; text-wrap: balance;
}
.rq-feas-rows { display: flex; flex-direction: column; gap: 1px; }
.rq-feas-row {
  display: flex; align-items: baseline; gap: 0.85rem;
  padding: 0.7rem 0.9rem; background: var(--rq-surface-2); border-left: 2px solid;
}
.rq-feas-full { border-left-color: var(--rq-strong); }
.rq-feas-tight { border-left-color: var(--rq-moderate); }
.rq-feas-n {
  font-family: var(--rq-font-head); font-size: 1.5rem; color: var(--rq-warm);
  line-height: 1; flex: none; min-width: 2rem; font-variant-numeric: tabular-nums;
}
.rq-feas-tight .rq-feas-n { color: var(--rq-moderate); }
.rq-feas-full .rq-feas-n { color: var(--rq-strong); }
.rq-feas-t { font-size: 0.86rem; color: var(--rq-muted); line-height: 1.55; }
.rq-feas-note {
  margin-top: 1rem; padding-top: 1rem; border-top: 1px solid var(--rq-border-soft);
  font-size: 0.84rem; color: var(--rq-muted); line-height: 1.7; max-width: 70ch;
}
.rq-feas-note em { color: var(--rq-warm); font-style: italic; }

/* ============================================ SAVED SEARCH MONITORING == */

.rq-newmatch {
  display: flex; flex-wrap: wrap; align-items: center; gap: 0.75rem;
  margin-top: 1.1rem; padding: 0.85rem 1.1rem; border-radius: 6px;
  background: var(--rq-gold-dim); border: 1px solid rgba(184, 150, 46, 0.3);
}
.rq-newmatch[hidden] { display: none; }
.rq-newmatch p { flex: 1 1 320px; font-size: 0.84rem; color: var(--rq-muted); line-height: 1.6; }
.rq-newmatch strong { color: var(--rq-warm); font-weight: 500; }
.rq-newmatch-dot {
  width: 7px; height: 7px; border-radius: 50%; background: var(--rq-gold); flex: none;
}

.rq-switch {
  display: inline-flex; align-items: center; gap: 0.5rem;
  background: none; border: none; cursor: pointer; font-family: inherit; padding: 0;
}
.rq-switch-track {
  width: 30px; height: 17px; border-radius: 20px; background: var(--rq-surface-2);
  border: 1px solid var(--rq-border); position: relative; transition: background 0.2s ease, border-color 0.2s ease;
}
.rq-switch-knob {
  position: absolute; top: 2px; left: 2px; width: 11px; height: 11px; border-radius: 50%;
  background: var(--rq-faint); transition: transform 0.2s ease, background 0.2s ease;
}
.rq-switch[aria-pressed="true"] .rq-switch-track { background: var(--rq-gold-dim); border-color: rgba(184, 150, 46, 0.5); }
.rq-switch[aria-pressed="true"] .rq-switch-knob { transform: translateX(13px); background: var(--rq-gold); }
.rq-switch-text { font-size: 0.78rem; color: var(--rq-muted); }
.rq-switch[aria-pressed="true"] .rq-switch-text { color: var(--rq-warm); }