:root {
  --ink: #172033;
  --ink-strong: #0d1526;
  --muted: #667085;
  --muted-strong: #475467;
  --brand: #3157d5;
  --brand-dark: #2342aa;
  --brand-soft: #eef2ff;
  --teal: #087f75;
  --teal-dark: #07685f;
  --teal-soft: #e8f7f4;
  --amber: #a15c07;
  --amber-soft: #fff7e6;
  --red: #b42318;
  --red-soft: #fff0ee;
  --green: #087443;
  --green-soft: #eaf8f0;
  --line: #e2e7ef;
  --line-strong: #cbd3df;
  --surface: #ffffff;
  --surface-subtle: #f8fafc;
  --canvas: #f4f6fa;
  --ring: #5575e7;
  --radius-sm: 9px;
  --radius: 14px;
  --radius-lg: 20px;
  --shadow-sm: 0 1px 2px rgba(13, 21, 38, .05), 0 3px 10px rgba(13, 21, 38, .04);
  --shadow: 0 14px 38px rgba(28, 39, 64, .09);
}

* { box-sizing: border-box; }
html { color-scheme: light; scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  background: linear-gradient(180deg, #f8f9fc 0, var(--canvas) 320px);
  font-family: Aptos, "Segoe UI Variable Text", "Segoe UI", Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 15px;
  line-height: 1.55;
  text-rendering: optimizeLegibility;
}
a { color: var(--brand); text-underline-offset: 2px; }
button, input, select, textarea { font: inherit; }
input, select, textarea {
  width: 100%;
  min-height: 44px;
  border: 1px solid var(--line-strong);
  border-radius: var(--radius-sm);
  padding: .68rem .78rem;
  color: var(--ink-strong);
  background: var(--surface);
  box-shadow: inset 0 1px 2px rgba(13, 21, 38, .025);
  transition: border-color .16s ease, box-shadow .16s ease, background .16s ease;
}
textarea { min-height: 92px; resize: vertical; }
input:hover, select:hover, textarea:hover { border-color: #aeb8c7; }
input:focus, select:focus, textarea:focus { border-color: var(--ring); box-shadow: 0 0 0 3px rgba(85, 117, 231, .16); outline: 0; }
button:focus-visible, a:focus-visible, summary:focus-visible { outline: 3px solid var(--ring); outline-offset: 3px; }
label { display: grid; gap: .38rem; color: var(--muted-strong); font-size: .84rem; font-weight: 700; }
label small { color: var(--muted); font-size: .75rem; font-weight: 450; }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { color: var(--ink-strong); font-weight: 760; letter-spacing: -.028em; }
h1 { margin-bottom: .5rem; font-size: clamp(2rem, 4vw, 3.25rem); line-height: 1.06; }
h2 { line-height: 1.18; }
h3 { line-height: 1.24; }

.skip-link { position: fixed; left: 1rem; top: -5rem; z-index: 100; padding: .7rem 1rem; border-radius: 8px; background: #fff; box-shadow: var(--shadow); }
.skip-link:focus { top: 1rem; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

.topbar { position: sticky; top: 0; z-index: 30; border-bottom: 1px solid rgba(203, 211, 223, .78); background: rgba(255, 255, 255, .94); backdrop-filter: blur(16px); }
.topbar-inner { display: flex; align-items: center; gap: 1.15rem; width: min(1240px, calc(100% - 2.4rem)); min-height: 70px; margin: 0 auto; }
.brand { display: inline-flex; flex: 0 0 auto; align-items: center; gap: .65rem; color: var(--ink-strong); text-decoration: none; }
.brand-symbol { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 11px; color: #fff; background: linear-gradient(145deg, var(--brand), #6938c9); box-shadow: 0 7px 18px rgba(49, 87, 213, .24); font-size: .78rem; font-weight: 850; letter-spacing: -.02em; }
.brand strong { font-size: 1.04rem; letter-spacing: -.02em; white-space: nowrap; }
.primary-nav { display: flex; align-items: center; gap: .18rem; margin-left: .45rem; }
.nav-link { display: inline-flex; align-items: center; min-height: 40px; padding: .48rem .72rem; border-radius: 9px; color: var(--muted-strong); font-size: .84rem; font-weight: 700; text-decoration: none; white-space: nowrap; }
.nav-link:hover { color: var(--ink-strong); background: var(--surface-subtle); }
.nav-link.is-active { color: var(--brand-dark); background: var(--brand-soft); }
.topbar-actions { display: flex; align-items: center; gap: .45rem; margin-left: auto; }
.account-link { display: flex; align-items: center; gap: .5rem; min-height: 42px; padding: .3rem .58rem; border-radius: 10px; color: var(--muted-strong); font-size: .82rem; font-weight: 700; text-decoration: none; }
.account-link:hover, .account-link.is-active { color: var(--ink-strong); background: var(--surface-subtle); }
.account-avatar { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; color: var(--brand-dark); background: var(--brand-soft); font-size: .72rem; font-weight: 850; }
.inline-form { display: inline-flex; }
.signout-button, .link-button { min-height: 40px; padding: .45rem .65rem; border: 0; border-radius: 9px; color: var(--muted-strong); background: transparent; font-weight: 700; cursor: pointer; }
.signout-button:hover, .link-button:hover { color: var(--ink-strong); background: var(--surface-subtle); }

.page { width: min(1240px, calc(100% - 2.4rem)); margin: 0 auto; padding: 2.25rem 0 5rem; }
.auth-page { width: 100%; min-height: 100vh; padding: 0; display: grid; place-items: center; background: radial-gradient(circle at 18% 15%, #4e6bd7 0, #263a80 34%, #111b3b 100%); }
.login-card { width: min(980px, calc(100% - 2rem)); display: grid; grid-template-columns: 1.12fr .88fr; overflow: hidden; border: 1px solid rgba(255,255,255,.2); border-radius: 26px; background: #fff; box-shadow: 0 34px 90px rgba(8, 15, 35, .35); }
.login-intro { min-height: 555px; display: flex; flex-direction: column; justify-content: flex-end; padding: 4rem; color: #fff; background: linear-gradient(145deg, rgba(28, 52, 132, .96), rgba(66, 48, 159, .88)), radial-gradient(circle at 80% 10%, #b5c7ff, #294dbd); }
.login-intro h1 { max-width: 560px; color: #fff; }
.login-intro p { max-width: 520px; color: #e6eaff; font-size: 1.05rem; }
.login-intro .eyebrow { color: #cdd7ff; }
.login-form { display: flex; flex-direction: column; justify-content: center; gap: 1.15rem; padding: 4rem 3.2rem; }
.privacy-note { color: var(--muted); font-size: .8rem; }

.eyebrow { display: block; margin-bottom: .58rem; color: var(--brand); font-size: .7rem; font-weight: 850; letter-spacing: .14em; text-transform: uppercase; }
.page-heading, .hero { display: flex; justify-content: space-between; align-items: flex-end; gap: 2rem; padding: .8rem 0 1.55rem; }
.page-heading > div:first-child, .hero > div:first-child { max-width: 790px; }
.page-heading p, .hero p, .profile-header p, .interview-header p, .form-page-header p { margin-bottom: 0; color: var(--muted); font-size: .98rem; }
.page-heading h1, .hero h1 { font-size: clamp(2.1rem, 4vw, 3.15rem); }
.page-actions, .profile-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .55rem; }

.metric-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .75rem; margin-bottom: 1rem; }
.metric-card { display: grid; grid-template-columns: 1fr auto; align-items: end; gap: .1rem 1rem; padding: 1rem 1.1rem; border: 1px solid var(--line); border-radius: var(--radius); background: rgba(255,255,255,.9); box-shadow: var(--shadow-sm); }
.metric-card span { color: var(--muted-strong); font-size: .78rem; font-weight: 760; text-transform: uppercase; letter-spacing: .045em; }
.metric-card strong { grid-row: 1 / 3; grid-column: 2; color: var(--ink-strong); font-size: 2rem; line-height: 1; }
.metric-card small { color: var(--muted); font-size: .75rem; }
.notice { margin-bottom: 1rem; padding: .85rem 1rem; border: 1px solid #cbd6ff; border-radius: 11px; color: #344373; background: var(--brand-soft); font-size: .84rem; }

.filter-panel { margin-bottom: 1rem; padding: 1rem; border: 1px solid var(--line); border-radius: var(--radius-lg); background: var(--surface); box-shadow: var(--shadow-sm); }
.filter-panel-header { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: .8rem; }
.filter-panel-header .eyebrow { margin-bottom: .12rem; }
.filter-panel-header h2 { margin-bottom: 0; font-size: 1.12rem; }
.clear-link { min-height: 36px; display: inline-flex; align-items: center; padding: .3rem .45rem; color: var(--muted-strong); font-size: .8rem; font-weight: 750; }
.filter-bar { display: grid; grid-template-columns: minmax(230px, 1fr) 150px 150px 185px auto; align-items: end; gap: .7rem; }
.filter-submit { min-height: 44px; }
.filter-sort-hint { margin: .6rem 0 0; color: var(--muted); font-size: .74rem; }
.advanced-filters { margin-top: .9rem; border-top: 1px solid var(--line); }
.advanced-filters > summary { display: flex; align-items: center; justify-content: space-between; gap: .8rem; min-height: 48px; padding: .75rem .15rem 0; color: var(--muted-strong); cursor: pointer; }
.advanced-filters > summary > span:first-child { display: grid; gap: .06rem; }
.advanced-filters > summary strong { color: var(--ink); font-size: .86rem; }
.advanced-filters > summary small { color: var(--muted); font-size: .73rem; font-weight: 450; }
.advanced-filter-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .75rem; padding-top: .9rem; }
.active-filter-badge { padding: .18rem .48rem; border-radius: 999px; color: var(--green); background: var(--green-soft); font-size: .64rem; font-weight: 850; letter-spacing: .04em; text-transform: uppercase; }
.filter-actions { display: flex; justify-content: flex-end; gap: .55rem; margin-top: .9rem; }
.filter-guardrail { margin: .7rem 0 0; color: var(--muted); font-size: .76rem; }

.button { display: inline-flex; justify-content: center; align-items: center; min-height: 42px; width: auto; padding: .62rem .92rem; border: 1px solid var(--line-strong); border-radius: 10px; color: var(--ink); background: #fff; box-shadow: 0 1px 2px rgba(13, 21, 38, .04); font-size: .84rem; font-weight: 760; line-height: 1.1; text-decoration: none; cursor: pointer; transition: transform .12s ease, border-color .16s ease, background .16s ease, box-shadow .16s ease; }
.button:hover { border-color: #aeb8c7; color: var(--ink-strong); background: var(--surface-subtle); box-shadow: var(--shadow-sm); }
.button:active { transform: translateY(1px); }
.button-primary { border-color: var(--brand); color: #fff; background: var(--brand); box-shadow: 0 4px 12px rgba(49, 87, 213, .2); }
.button-primary:hover { border-color: var(--brand-dark); color: #fff; background: var(--brand-dark); }
.stage-two-button { border-color: var(--teal); color: #fff; background: var(--teal); }
.stage-two-button:hover { border-color: var(--teal-dark); color: #fff; background: var(--teal-dark); }
.button-small { min-height: 36px; padding: .48rem .72rem; font-size: .78rem; }
.full-width { width: 100%; }

.candidate-list { display: grid; gap: .7rem; }
.candidate-row { display: grid; grid-template-columns: 54px minmax(0, 1fr) 185px; gap: 1rem; padding: 1.05rem 1.1rem; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); box-shadow: var(--shadow-sm); transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease; }
.candidate-row:hover { border-color: #c4cce0; box-shadow: var(--shadow); transform: translateY(-1px); }
.rank { align-self: start; color: var(--ink-strong); font-size: 1.45rem; font-weight: 820; letter-spacing: -.04em; }
.rank span { margin-right: .08rem; color: var(--brand); font-size: .75rem; }
.row-title { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; }
.row-title h2 { margin-bottom: .18rem; font-size: 1.08rem; letter-spacing: -.018em; }
.row-title h2 a { color: var(--ink-strong); text-decoration: none; }
.row-title h2 a:hover { color: var(--brand); }
.row-title p, .assessment-preview, .meta-line { color: var(--muted); }
.row-title p { margin-bottom: .55rem; font-size: .82rem; }
.assessment-preview { display: -webkit-box; overflow: hidden; margin-bottom: .58rem; font-size: .86rem; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.meta-line { display: flex; flex-wrap: wrap; gap: .4rem 1rem; font-size: .74rem; }
.candidate-action { display: flex; flex-direction: column; align-items: flex-end; justify-content: center; gap: .43rem; }
.badge, .status, .admin-only { display: inline-flex; width: fit-content; padding: .25rem .52rem; border-radius: 999px; font-size: .67rem; font-weight: 820; letter-spacing: .02em; white-space: nowrap; }
.priority-1 { color: #185b47; background: #e1f5ed; }
.priority-2 { color: #805006; background: #fff1cd; }
.priority-3 { color: #68458a; background: #f2eafd; }
.status-completed { color: var(--green); background: var(--green-soft); }
.status-draft { color: var(--amber); background: var(--amber-soft); }
.status-pending { color: #586474; background: #eef1f5; }
.score { color: var(--ink-strong); font-size: 1.16rem; font-weight: 820; }
.score small { color: var(--muted); font-size: .66rem; font-weight: 600; }

.breadcrumbs { display: flex; flex-wrap: wrap; gap: .45rem; margin-bottom: 1.15rem; color: var(--muted); font-size: .78rem; }
.breadcrumbs a { color: var(--muted-strong); }
.profile-header, .interview-header { display: flex; justify-content: space-between; align-items: center; gap: 1rem; margin-bottom: 1.4rem; }
.profile-header h1, .interview-header h1, .form-page-header h1 { font-size: clamp(2rem, 4vw, 3rem); }
.profile-grid { display: grid; grid-template-columns: 330px minmax(0, 1fr); gap: 1rem; align-items: start; }
.detail-stack, .records, .form-stack, .candidate-form, .interview-form, .import-grid { display: grid; gap: .85rem; }
.detail-card, .form-section { padding: 1.25rem; border: 1px solid var(--line); border-radius: var(--radius); background: #fff; box-shadow: var(--shadow-sm); }
.detail-card h2 { font-size: 1.08rem; }
.detail-card li { margin-bottom: .48rem; }
.contact-card { position: sticky; top: 86px; }
dl { margin: 0 0 1.15rem; }
dt { margin-top: .82rem; color: var(--muted); font-size: .68rem; font-weight: 820; letter-spacing: .055em; text-transform: uppercase; }
dd { margin-left: 0; overflow-wrap: anywhere; }
.admin-only { display: block; margin-top: .25rem; color: #70510f; background: var(--amber-soft); white-space: normal; }
.warning-card { border-color: #eddbb8; background: #fffcf6; }
.subtle { color: var(--muted); font-size: .82rem; }
summary { color: var(--ink-strong); font-weight: 760; cursor: pointer; }
.long-text { margin: .9rem 0 0; white-space: pre-wrap; }
.section-heading { display: flex; justify-content: space-between; align-items: end; gap: 1rem; margin: 1.8rem 0 .75rem; }
.section-heading h2 { margin-bottom: .12rem; font-size: 1.28rem; }
.section-heading p { margin-bottom: 0; color: var(--muted); font-size: .85rem; }
.form-section > .section-heading { margin-top: 0; }
.record-card { display: grid; grid-template-columns: 1fr auto 82px; align-items: center; gap: 1rem; padding: .9rem 1rem; border: 1px solid var(--line); border-radius: 11px; color: var(--ink); background: #fff; box-shadow: var(--shadow-sm); text-decoration: none; }
.record-card:hover { border-color: #c4cce0; }
.record-card strong, .record-card span { display: block; }
.record-card div span { color: var(--muted); font-size: .76rem; }

.score-panel { display: grid; grid-template-columns: auto auto; align-items: baseline; gap: .18rem; min-width: 170px; padding: .9rem 1.05rem; border-radius: var(--radius); color: #fff; background: linear-gradient(145deg, #1a2b57, #3157d5); box-shadow: 0 12px 28px rgba(35, 66, 170, .24); }
.score-panel span { grid-column: 1 / -1; color: #d5ddff; font-size: .68rem; font-weight: 780; letter-spacing: .05em; text-transform: uppercase; }
.score-panel strong { font-size: 2.15rem; line-height: 1; }
.score-panel small { color: #d5ddff; }
.handoff-card { display: grid; gap: .9rem; margin-bottom: 1rem; padding: 1.2rem; border: 1px solid #b9c7f7; border-radius: var(--radius); background: linear-gradient(145deg, #f8faff, #f2f5ff); box-shadow: var(--shadow-sm); }
.handoff-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; }
.handoff-heading h2 { margin-bottom: .2rem; font-size: 1.35rem; }
.handoff-heading p { margin: 0; color: var(--muted); font-size: .84rem; }
.handoff-score { display: flex; align-items: baseline; gap: .16rem; min-width: 110px; color: var(--brand-dark); text-align: right; }
.handoff-score strong { font-size: 2rem; line-height: 1; }
.handoff-score span { color: var(--muted); font-size: .72rem; font-weight: 700; }
.handoff-decisions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .55rem; }
.handoff-decisions div { padding: .68rem .78rem; border: 1px solid #dbe2fb; border-radius: 9px; background: rgba(255,255,255,.82); }
.handoff-decisions span, .handoff-notes > span { display: block; margin-bottom: .18rem; color: var(--muted); font-size: .64rem; font-weight: 820; letter-spacing: .045em; text-transform: uppercase; }
.handoff-decisions strong { color: var(--ink-strong); font-size: .84rem; }
.handoff-details { padding: .75rem .85rem; border: 1px solid #dbe2fb; border-radius: 10px; background: rgba(255,255,255,.72); }
.handoff-details > summary { font-size: .86rem; }
.handoff-scorecards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .55rem; margin-top: .75rem; }
.handoff-scorecards > article, .handoff-logistics > article { padding: .75rem; border: 1px solid var(--line); border-radius: 9px; background: #fff; }
.handoff-criterion { display: grid; grid-template-columns: 25px 1fr auto; align-items: start; gap: .55rem; }
.handoff-criterion h3, .handoff-logistics h3 { margin: 0; font-size: .82rem; }
.handoff-criterion small { color: var(--muted); font-size: .64rem; }
.handoff-criterion > strong { color: var(--brand-dark); font-size: 1.15rem; }
.handoff-scorecards article > p, .handoff-logistics article > p { margin: .55rem 0 0; color: var(--muted-strong); font-size: .76rem; white-space: pre-wrap; }
.handoff-logistics { display: grid; gap: .5rem; margin-top: .75rem; }
.handoff-logistics article > div { display: flex; align-items: center; justify-content: space-between; gap: .7rem; }
.handoff-notes { padding: .75rem .85rem; border-left: 3px solid var(--brand); background: rgba(255,255,255,.72); }
.handoff-notes p { margin: 0; color: var(--muted-strong); font-size: .8rem; white-space: pre-wrap; }
.form-grid { display: grid; gap: .75rem; }
.form-grid.two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.form-grid.three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.span-two { grid-column: 1 / -1; }
.anchors { margin-bottom: .9rem; padding: .72rem .85rem; border: 1px solid #dce2f8; border-radius: 10px; background: #f6f8ff; }
.anchor-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: .55rem; margin-top: .75rem; }
.anchor-grid div { display: grid; grid-template-columns: 24px 1fr; gap: .4rem; color: var(--muted-strong); font-size: .72rem; }
.anchor-grid strong { color: var(--brand); font-size: 1rem; }
.scorecards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .68rem; }
.scorecard { padding: .95rem; border: 1px solid var(--line); border-radius: 11px; background: var(--surface-subtle); }
.scorecard:nth-child(-n+2) { border-color: #cbd6ff; background: #f7f8ff; box-shadow: inset 3px 0 0 var(--brand); }
.scorecard-title { display: flex; align-items: flex-start; justify-content: space-between; gap: .75rem; }
.scorecard-title > div { display: flex; gap: .58rem; }
.scorecard h3 { margin: 0; font-size: .92rem; }
.criterion-number { display: grid; place-items: center; flex: 0 0 25px; width: 25px; height: 25px; border-radius: 50%; color: var(--brand-dark); background: var(--brand-soft); font-size: .7rem; font-weight: 850; }
.weight { color: var(--muted); font-size: .68rem; font-weight: 800; white-space: nowrap; }
.rating-fieldset, .logistics-card fieldset { margin: .78rem 0; padding: 0; border: 0; }
.rating-fieldset legend, .logistics-card legend { color: var(--muted); font-size: .66rem; font-weight: 820; letter-spacing: .045em; text-transform: uppercase; }
.rating-options, .segment { display: flex; flex-wrap: wrap; gap: .35rem; }
.rating-options label, .segment label { display: block; cursor: pointer; }
.rating-options input, .segment input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.rating-options span { display: grid; place-items: center; width: 40px; height: 38px; border: 1px solid var(--line-strong); border-radius: 8px; background: #fff; }
.rating-options input:checked + span, .segment input:checked + span { border-color: var(--brand); color: #fff; background: var(--brand); }
.rating-options input:focus-visible + span, .segment input:focus-visible + span { outline: 3px solid var(--ring); outline-offset: 2px; }
.notes-label { font-size: .75rem; }
.logistics-list { display: grid; gap: .65rem; }
.logistics-card { display: grid; grid-template-columns: 1.2fr 1fr 1.2fr; align-items: end; gap: .9rem; padding: .95rem; border: 1px solid var(--line); border-radius: 11px; background: var(--surface-subtle); }
.logistics-card h3 { margin-bottom: .2rem; font-size: .94rem; }
.logistics-card p { margin-bottom: 0; color: var(--muted); font-size: .76rem; }
.logistics-card fieldset { margin: 0; }
.segment span { display: block; min-height: 38px; padding: .48rem .58rem; border: 1px solid var(--line-strong); border-radius: 8px; background: #fff; font-size: .7rem; }
.sticky-actions { position: sticky; bottom: .8rem; z-index: 10; display: flex; justify-content: flex-end; align-items: center; gap: .55rem; padding: .8rem; border: 1px solid var(--line-strong); border-radius: 13px; background: rgba(255,255,255,.96); box-shadow: 0 14px 36px rgba(28, 39, 64, .16); backdrop-filter: blur(14px); }
.sticky-actions span { margin-right: auto; color: var(--muted); font-size: .76rem; }

.form-page-header { margin-bottom: 1.35rem; }
.validation-summary { margin-bottom: 1rem; padding: .9rem 1.05rem; border: 1px solid #efb3ad; border-radius: 11px; color: #862820; background: var(--red-soft); }
.validation-summary h2 { margin-bottom: .4rem; color: #862820; font-size: .98rem; }
.validation-summary ul { margin-bottom: 0; }
.import-step { display: grid; grid-template-columns: 42px 1fr; align-items: start; gap: .9rem; }
.import-step h2 { margin-bottom: .3rem; font-size: 1.12rem; }
.import-step p { color: var(--muted); }
.step-number { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; color: #fff; background: var(--brand); font-weight: 850; }
.upload-form > div { display: grid; gap: .85rem; }
.upload-form .button { justify-self: start; }
.import-notice { margin-top: 1rem; }

.flash { margin-bottom: 1rem; padding: .78rem .95rem; border: 1px solid transparent; border-radius: 10px; font-size: .84rem; }
.flash-success { border-color: #bce7ce; color: var(--green); background: var(--green-soft); }
.flash-error { border-color: #efb3ad; color: var(--red); background: var(--red-soft); }
.empty-state { padding: 2.8rem; border: 1px dashed #b9c3d1; border-radius: var(--radius); text-align: center; color: var(--muted); background: #fff; }
.empty-state.small { padding: 1.15rem; }
.empty-state.standalone { width: min(620px, calc(100% - 2rem)); margin: 10vh auto; }
.narrow-page { width: min(680px, 100%); margin: 1.8rem auto; }
.admin-grid { display: grid; grid-template-columns: 370px minmax(0, 1fr); gap: 1rem; align-items: start; }
.user-list, .audit-list { display: grid; gap: .45rem; }
.user-row { display: grid; grid-template-columns: 1fr auto auto; align-items: center; gap: .65rem; padding: .75rem 0; border-bottom: 1px solid var(--line); }
.user-row strong, .user-row span { display: block; }
.user-row div span { color: var(--muted); font-size: .75rem; }
.audit-card { margin-top: 1rem; }
.audit-list div { display: grid; grid-template-columns: 135px 160px 1fr; gap: .75rem; padding: .52rem 0; border-bottom: 1px solid var(--line); font-size: .78rem; }
.audit-list time, .audit-list span { color: var(--muted); }

.job-grid, .template-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.job-card, .template-card { display: flex; flex-direction: column; min-height: 310px; padding: 1.25rem; border: 1px solid var(--line); border-radius: var(--radius); background: #fff; box-shadow: var(--shadow-sm); transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease; }
.job-card:hover, .template-card:hover { transform: translateY(-2px); border-color: #c3cceb; box-shadow: var(--shadow); }
.job-card-top, .template-card-top, .job-card-footer, .button-row, .heading-badges { display: flex; align-items: center; justify-content: space-between; gap: .6rem; }
.job-card h2, .template-card h2 { margin: .45rem 0 .55rem; font-size: 1.35rem; }
.job-card h2 a { color: var(--ink-strong); text-decoration: none; }
.job-card h2 a:hover { color: var(--brand); }
.job-date, .template-card-top > span:last-child { color: var(--muted); font-size: .74rem; font-weight: 680; }
.job-summary, .template-card > p { color: var(--muted-strong); font-size: .86rem; }
.job-assignments { display: grid; grid-template-columns: 1fr 1fr; gap: .6rem; margin: auto 0 1rem; }
.job-assignments div { padding: .72rem; border: 1px solid var(--line); border-radius: 9px; background: var(--surface-subtle); }
.job-assignments dt { margin-top: 0; }
.job-assignments dd { margin-top: .18rem; color: var(--ink-strong); font-size: .83rem; font-weight: 720; }
.job-card-footer { padding-top: .9rem; border-top: 1px solid var(--line); }
.applicant-count { display: flex; align-items: baseline; gap: .35rem; }
.applicant-count strong { color: var(--ink-strong); font-size: 1.7rem; line-height: 1; }
.applicant-count span { color: var(--muted); font-size: .76rem; }
.job-empty { grid-column: 1 / -1; }
.job-detail-heading { margin-bottom: 1rem; }
.heading-badges { justify-content: flex-start; margin-bottom: .55rem; }
.assignment-strip { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; margin-bottom: 1rem; overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius); background: var(--line); box-shadow: var(--shadow-sm); }
.assignment-strip > div { display: grid; grid-template-columns: 84px 1fr; gap: .15rem .75rem; padding: .9rem 1rem; background: #fff; }
.assignment-strip span { grid-row: 1 / 3; align-self: center; color: var(--brand); font-size: .7rem; font-weight: 850; letter-spacing: .045em; text-transform: uppercase; }
.assignment-strip strong { color: var(--ink-strong); }
.assignment-strip small { color: var(--muted); }
.job-requirements { margin-bottom: 1rem; }
.stage-setup-card { border-left: 4px solid var(--brand); }

.template-card { min-height: 290px; }
.template-card .badge { color: var(--brand-dark); background: var(--brand-soft); }
.template-summary { display: flex; align-items: baseline; gap: .38rem; margin: auto 0 .9rem; padding-top: .9rem; border-top: 1px solid var(--line); }
.template-summary strong { color: var(--ink-strong); font-size: 1.55rem; }
.template-summary span { color: var(--muted); font-size: .78rem; }
.questionnaire-heading { align-items: center; }
.weight-total { display: grid; grid-template-columns: auto auto; align-items: baseline; min-width: 108px; padding: .65rem .8rem; border: 1px solid #efc7c2; border-radius: 10px; color: var(--red); background: var(--red-soft); }
.weight-total span { grid-column: 1 / -1; font-size: .64rem; font-weight: 820; letter-spacing: .05em; text-transform: uppercase; }
.weight-total strong { font-size: 1.45rem; }
.weight-total small { margin-left: .12rem; }
.weight-total.is-valid { border-color: #bce7ce; color: var(--green); background: var(--green-soft); }
.question-builder { display: grid; gap: .6rem; }
.question-row { display: grid; grid-template-columns: 34px minmax(0, 1fr) 100px 42px; align-items: end; gap: .65rem; padding: .8rem; border: 1px solid var(--line); border-radius: 11px; background: var(--surface-subtle); }
.question-number { display: grid; place-items: center; align-self: center; width: 30px; height: 30px; border-radius: 50%; color: var(--brand-dark); background: var(--brand-soft); font-size: .75rem; font-weight: 850; }
.question-weight input { text-align: center; }
.icon-button { display: grid; place-items: center; width: 42px; min-height: 44px; padding: 0; border: 1px solid var(--line-strong); border-radius: 9px; color: var(--muted-strong); background: #fff; font-size: 1.35rem; cursor: pointer; }
.icon-button:hover:not(:disabled) { border-color: #e4aaa4; color: var(--red); background: var(--red-soft); }
.icon-button:disabled { cursor: not-allowed; opacity: .42; }
.add-question-button { margin-top: .75rem; }

@media (max-width: 1040px) {
  .topbar-inner { flex-wrap: wrap; gap: .45rem .9rem; padding: .7rem 0; }
  .primary-nav { order: 3; width: 100%; margin-left: 0; overflow-x: auto; padding-top: .2rem; border-top: 1px solid var(--line); scrollbar-width: thin; }
  .advanced-filter-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 850px) {
  .page-heading, .hero, .profile-header, .interview-header { align-items: flex-start; flex-direction: column; }
  .page-actions, .profile-actions { justify-content: flex-start; }
  .filter-bar { grid-template-columns: 1fr 1fr; }
  .search-field { grid-column: 1 / -1; }
  .filter-submit { grid-column: 1 / -1; width: 100%; }
  .candidate-row { grid-template-columns: 44px minmax(0, 1fr); }
  .candidate-action { grid-column: 2; flex-direction: row; flex-wrap: wrap; align-items: center; justify-content: flex-start; }
  .profile-grid, .admin-grid { grid-template-columns: 1fr; }
  .contact-card { position: static; }
  .form-grid.three, .scorecards, .handoff-scorecards, .handoff-decisions { grid-template-columns: 1fr; }
  .handoff-heading { align-items: flex-start; flex-direction: column; }
  .handoff-score { text-align: left; }
  .anchor-grid { grid-template-columns: 1fr; }
  .logistics-card { grid-template-columns: 1fr; align-items: start; }
  .sticky-actions { flex-wrap: wrap; }
  .sticky-actions span { flex-basis: 100%; }
  .job-grid, .template-grid { grid-template-columns: 1fr; }
  .assignment-strip { grid-template-columns: 1fr; }
  .question-row { grid-template-columns: 30px minmax(0, 1fr) 85px 42px; }
}

@media (max-width: 620px) {
  body { font-size: 14px; }
  .topbar-inner, .page { width: min(100% - 1.15rem, 1240px); }
  .topbar-actions { margin-left: 0; }
  .account-link > span:last-child { display: none; }
  .primary-nav { gap: .08rem; }
  .nav-link { padding-inline: .62rem; }
  .page { padding-top: 1.25rem; }
  .login-card { grid-template-columns: 1fr; }
  .login-intro { min-height: 260px; padding: 1.8rem; }
  .login-form { padding: 2rem 1.6rem; }
  .metric-grid { grid-template-columns: 1fr; }
  .filter-bar, .advanced-filter-grid, .form-grid.two { grid-template-columns: 1fr; }
  .search-field, .span-two { grid-column: auto; }
  .filter-submit { grid-column: auto; }
  .filter-actions { align-items: stretch; flex-direction: column; }
  .filter-actions .button { width: 100%; }
  .filter-panel { padding: .8rem; }
  .advanced-filters > summary small { display: none; }
  .candidate-row { gap: .6rem; padding: .85rem; }
  .row-title { flex-direction: column; gap: .35rem; }
  .meta-line { flex-direction: column; gap: .12rem; }
  .record-card { grid-template-columns: 1fr auto; }
  .record-card .score { grid-column: 2; }
  .sticky-actions .button { flex: 1; }
  .audit-list div { grid-template-columns: 1fr; gap: .12rem; }
  .import-step { grid-template-columns: 34px 1fr; gap: .65rem; }
  .step-number { width: 30px; height: 30px; }
  .job-assignments { grid-template-columns: 1fr; }
  .job-card-footer { align-items: flex-start; flex-direction: column; }
  .assignment-strip > div { grid-template-columns: 70px 1fr; }
  .questionnaire-heading { align-items: flex-start; }
  .question-row { grid-template-columns: 28px minmax(0, 1fr) 42px; align-items: start; }
  .question-row .question-weight { grid-column: 2; }
  .question-row .icon-button { grid-column: 3; grid-row: 1; }
}