:root {
  --ink: #12201b;
  --muted: #607069;
  --line: #dbe3df;
  --line-strong: #cbd6d0;
  --paper: #f4f7f5;
  --white: #ffffff;
  --forest: #0b3327;
  --forest-2: #14523f;
  --green: #1ebd78;
  --green-dark: #08734b;
  --green-soft: #e1f7ec;
  --blue-soft: #edf2ff;
  --blue-line: #c7d5ff;
  --blue: #315ce7;
  --amber: #a66008;
  --amber-soft: #fff1d9;
  --red: #a43e3e;
  --red-soft: #f9e7e7;
  --shadow: 0 10px 30px rgba(24, 50, 41, .06);
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  -webkit-font-smoothing: antialiased;
}
button, input, select { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; text-decoration: none; }

.site-header {
  position: sticky;
  top: 0;
  z-index: 20;
  width: 100%;
  border-bottom: 1px solid rgba(155, 194, 174, .94);
  background: rgba(213, 233, 223, .98);
  box-shadow: 0 8px 28px rgba(20, 65, 48, .09);
  backdrop-filter: blur(18px);
}
.header-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: min(1210px, calc(100% - 40px));
  min-height: 72px;
  margin: 0 auto;
}
.brand { display: inline-flex; align-items: center; gap: 10px; font-weight: 800; letter-spacing: -.35px; }
.brand-mark { display: grid; width: 35px; height: 35px; flex: 0 0 35px; place-items: center; }
.brand-mark img { display: block; width: 100%; height: 100%; object-fit: contain; }
nav { display: flex; align-items: center; gap: 8px; }
nav a, .saved-nav { padding: 9px 12px; color: #53635c; font-size: 14px; font-weight: 650; }
nav a[aria-current="page"] { color: var(--green-dark); }
.account-nav { display: inline-flex; align-items: center; border-radius: 9px; background: var(--green-soft); color: var(--green-dark); }
.saved-nav { border: 1px solid var(--line); border-radius: 10px; background: white; color: var(--ink); cursor: pointer; }
.saved-nav span, .view-toggle span { display: inline-grid; min-width: 20px; height: 20px; margin-left: 4px; place-items: center; border-radius: 99px; background: var(--green-soft); color: var(--green-dark); font-size: 12px; }

.workspace { width: min(1210px, calc(100% - 40px)); margin: 0 auto; padding: 50px 0 0; }
.workspace-heading { padding: 0 4px 28px; }
.eyebrow { margin: 0 0 10px; color: var(--green-dark); font-size: 12px; font-weight: 800; letter-spacing: 1.25px; text-transform: uppercase; }
h1, h2 { margin: 0; letter-spacing: -1.4px; }
h1 { max-width: 720px; font-size: clamp(34px, 4.6vw, 57px); line-height: 1.04; }
.workspace-heading > div:first-child > p:last-child { max-width: 720px; margin: 16px 0 0; color: var(--muted); font-size: 16px; line-height: 1.6; }
.coming-soon-copy { color: var(--green-dark); font-weight: 800; }
.mini-metrics { display: flex; width: fit-content; margin-top: 22px; overflow: hidden; border: 1px solid var(--line); border-radius: 14px; background: white; box-shadow: var(--shadow); }
.mini-metrics div { display: inline-flex; min-width: 132px; align-items: center; gap: 7px; padding: 13px 16px; border-right: 1px solid var(--line); white-space: nowrap; }
.mini-metrics div:last-child { border-right: 0; }
.mini-metrics strong { font-size: 20px; }
.mini-metrics span { color: var(--muted); font-size: 13px; }

.tracker { scroll-margin-top: 92px; }
.preview-heading { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 18px; }
.preview-heading .eyebrow { margin-bottom: 6px; }
.preview-heading h2 { font-size: 29px; }
.preview-heading-link { display: inline-flex; align-items: center; gap: 8px; padding: 10px 0; color: var(--green-dark); font-size: 14px; font-weight: 750; }
.preview-heading-link:hover { text-decoration: underline; text-underline-offset: 4px; }
.view-toggle { display: inline-flex; padding: 4px; border: 1px solid var(--line); border-radius: 13px; background: white; box-shadow: 0 2px 8px rgba(25, 47, 40, .04); }
.view-toggle button { min-height: 42px; padding: 0 15px; border: 0; border-radius: 9px; background: transparent; color: var(--muted); font-size: 14px; font-weight: 700; cursor: pointer; }
.view-toggle button.active { background: var(--forest); color: white; box-shadow: 0 5px 14px rgba(11, 51, 39, .18); }
.view-toggle button.active span { background: rgba(255,255,255,.15); color: white; }

.source-banner { display: grid; width: 100%; grid-template-columns: auto 1fr auto; align-items: center; gap: 13px; margin-top: 20px; padding: 15px 18px; border: 1px solid var(--blue-line); border-radius: 15px; background: var(--blue-soft); }
.source-icon { display: grid; width: 31px; height: 31px; place-items: center; border-radius: 9px; background: white; color: var(--blue); }
.source-icon svg { width: 19px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }
.source-banner strong, .source-banner div span { display: block; }
.source-banner strong { font-size: 14px; }
.source-banner div span { margin-top: 3px; color: #5f687a; font-size: 13px; }
.source-banner.fallback { border-color: #e7d0a7; background: #fff7e8; }
.source-banner.live .source-icon { color: var(--green-dark); }
.refresh-button { display: inline-flex; align-items: center; gap: 7px; min-height: 38px; padding: 0 14px; border: 1px solid #d6ddda; border-radius: 10px; background: white; color: var(--ink); font-size: 13px; font-weight: 750; cursor: pointer; box-shadow: 0 2px 7px rgba(22, 41, 35, .05); }
.refresh-button.loading span { animation: spin .8s linear infinite; }
.refresh-button:disabled { opacity: .65; cursor: wait; }

.search-filter-area { margin-top: 28px; }
.preview-filter-note { margin: 0 0 9px; color: var(--muted); font-size: 13px; }
.search-field { position: relative; display: block; max-width: 680px; }
.search-field svg { position: absolute; top: 50%; left: 16px; width: 20px; fill: none; stroke: #6b7872; stroke-width: 1.8; transform: translateY(-50%); }
.search-field input { width: 100%; height: 48px; padding: 0 17px 0 47px; border: 1px solid var(--line); border-radius: 13px; outline: 0; background: white; color: var(--ink); font-size: 15px; box-shadow: 0 2px 8px rgba(23, 45, 38, .04); }
.filter-row { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 12px; }
.filter-row label { flex: 0 1 190px; }
.filter-row select { width: 100%; height: 42px; padding: 0 35px 0 12px; border: 1px solid var(--line); border-radius: 10px; outline: 0; background: white; color: var(--ink); font-size: 14px; cursor: pointer; }
.search-field input:focus, .filter-row select:focus { border-color: var(--green); box-shadow: 0 0 0 3px rgba(30, 189, 120, .12); }
.clear-button { min-height: 42px; padding: 0 12px; border: 0; background: transparent; color: var(--green-dark); font-size: 13px; font-weight: 750; cursor: pointer; }

.results-bar { display: flex; justify-content: space-between; align-items: center; margin: 27px 3px 11px; color: var(--muted); font-size: 13px; }
.results-bar p { display: flex; align-items: center; gap: 8px; margin: 0; }
.results-bar strong { color: var(--ink); }
.landing-preview .results-bar { justify-content: flex-end; margin-top: 22px; }
.live-total-highlight { padding: 9px 13px; border: 1px solid rgba(30, 189, 120, .28); border-radius: 999px; background: var(--green-soft); color: var(--green-dark); font-size: 14px; font-weight: 800; box-shadow: 0 3px 10px rgba(11, 81, 57, .06); }
.live-dot { width: 7px; height: 7px; border-radius: 99px; background: var(--green); box-shadow: 0 0 0 4px rgba(30, 189, 120, .1); }

.job-table { overflow: hidden; border: 1px solid var(--line); border-radius: 16px; background: white; box-shadow: var(--shadow); }
.table-header, .job-row { display: grid; grid-template-columns: 1fr 1.5fr .95fr .75fr 138px .72fr .68fr 120px; align-items: center; column-gap: 15px; }
.landing-preview .table-header, .landing-preview .job-row { grid-template-columns: 1.15fr 1.75fr .9fr .75fr .72fr .68fr 105px; }
.table-header { min-height: 44px; padding: 0 22px; background: #edf1ef; color: #52615b; font-size: 13px; font-weight: 750; }
.job-row { min-height: 83px; padding: 13px 22px; border-top: 1px solid var(--line); transition: background .16s ease; }
.job-row:first-child { border-top: 0; }
.job-row:hover { background: #fbfdfc; }
.job-row.expired { opacity: .68; background: #fafafa; }
.listing-pagination { display: flex; align-items: center; justify-content: center; gap: 10px; padding: 24px 4px 2px; }
.pagination-pages { display: flex; align-items: center; gap: 6px; }
.listing-pagination button { min-width: 38px; height: 38px; padding: 0 11px; border: 1px solid var(--line); border-radius: 9px; background: white; color: var(--ink); font-size: 13px; font-weight: 750; cursor: pointer; box-shadow: 0 2px 7px rgba(22, 41, 35, .04); }
.listing-pagination button:hover:not(:disabled) { border-color: var(--green); color: var(--green-dark); }
.listing-pagination button.active { border-color: var(--forest); background: var(--forest); color: white; }
.listing-pagination button:disabled { opacity: .42; cursor: not-allowed; }
.pagination-ellipsis { min-width: 20px; color: var(--muted); text-align: center; }
.pagination-summary { color: var(--muted); font-size: 12px; white-space: nowrap; }
.listings-loading { display: flex; min-height: 128px; align-items: center; justify-content: center; gap: 13px; padding: 24px; color: var(--muted); text-align: left; }
.listings-loading strong, .listings-loading small { display: block; }
.listings-loading strong { color: var(--ink); font-size: 14px; }
.listings-loading small { margin-top: 4px; font-size: 12px; }
.loading-spinner { width: 25px; height: 25px; border: 3px solid var(--green-soft); border-top-color: var(--green-dark); border-radius: 99px; animation: spin .8s linear infinite; }
.auth-check { display: none; }
.auth-required:not(.auth-ready) .tracker-workspace, .auth-required:not(.auth-ready) footer { display: none; }
.auth-required:not(.auth-ready) .auth-check { display: flex; min-height: calc(100vh - 72px); align-items: center; justify-content: center; gap: 13px; color: var(--muted); }
.auth-required:not(.auth-ready) .auth-check strong { color: var(--ink); font-size: 15px; }
.cell { min-width: 0; }
.company-cell { display: flex; min-width: 0; align-items: center; gap: 10px; overflow: hidden; }
.company-cell > span:last-child { min-width: 0; }
.company-logo { display: grid; flex: 0 0 35px; width: 35px; height: 35px; place-items: center; border-radius: 9px; color: white; font-size: 12px; font-weight: 850; letter-spacing: -.25px; }
.primary-text { display: block; overflow: hidden; color: var(--ink); font-size: 14px; font-weight: 700; line-height: 1.3; text-overflow: ellipsis; white-space: nowrap; }
.secondary-text { display: block; overflow: hidden; margin-top: 3px; color: var(--muted); font-size: 12px; line-height: 1.3; text-overflow: ellipsis; white-space: nowrap; }
.role-cell { overflow: hidden; }
.role-button { display: block; width: 100%; max-width: 100%; padding: 0; border: 0; background: transparent; text-align: left; cursor: pointer; }
.role-button:hover .primary-text { color: var(--green-dark); text-decoration: underline; text-underline-offset: 3px; }
.programme-pill { display: inline-flex; max-width: 100%; padding: 7px 9px; border-radius: 8px; background: #eef2f0; color: #45554e; font-size: 12px; font-weight: 700; line-height: 1.2; }
.programme-pill.internship { background: #e7f0ff; color: #285b9f; }
.programme-pill.graduate { background: var(--green-soft); color: var(--green-dark); }
.programme-pill.insight { background: #f1eaff; color: #6b43a2; }
.stage-select { width: 100%; height: 36px; padding: 0 28px 0 9px; border: 1px solid var(--line); border-radius: 9px; outline: 0; background: #f8faf9; color: var(--ink); font-size: 12px; font-weight: 750; cursor: pointer; transition: background-color .16s ease, border-color .16s ease, color .16s ease; }
.stage-select.stage-not-applied { border-color: #d6ded9; background: #f3f6f4; color: #52615b; }
.stage-select.stage-interested { border-color: #bad3f8; background: #e9f2ff; color: #245a9d; }
.stage-select.stage-applied { border-color: #a9dfc5; background: #e2f7ec; color: #08734b; }
.stage-select.stage-hirevue { border-color: #d4c0ef; background: #f2eafb; color: #70419c; }
.stage-select.stage-assessment { border-color: #ecd09c; background: #fff2db; color: #8a5709; }
.stage-select.stage-interview { border-color: #bec9f5; background: #eaeefe; color: #3e4eaa; }
.stage-select.stage-offer { border-color: #7fcaa4; background: #ccefdc; color: #065f3e; }
.stage-select.stage-rejected { border-color: #e3b5b5; background: #fae8e8; color: #963737; }
.stage-select:focus, .dialog-stage select:focus { border-color: var(--green); box-shadow: 0 0 0 3px rgba(30, 189, 120, .12); }
.deadline-cell { font-size: 13px; }
.status-label { display: inline-flex; align-items: center; gap: 6px; color: var(--green-dark); font-weight: 700; }
.status-label::before { width: 6px; height: 6px; border-radius: 99px; background: currentColor; content: ""; }
.status-label.soon { color: var(--amber); }
.status-label.expired { color: var(--red); }
.row-actions { display: flex; align-items: center; justify-content: flex-end; gap: 7px; }
.save-button { display: grid; width: 35px; height: 35px; place-items: center; border: 1px solid transparent; border-radius: 9px; background: transparent; color: #5c6b65; cursor: pointer; }
.save-button:hover { border-color: var(--line); background: white; color: var(--green-dark); }
.save-button.saved { background: var(--forest); color: white; }
.save-button svg { width: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; }
.save-button.saved svg { fill: currentColor; }
.apply-link { display: inline-flex; min-height: 35px; align-items: center; justify-content: center; padding: 0 12px; border: 1px solid var(--line-strong); border-radius: 9px; background: white; color: var(--ink); font-size: 13px; font-weight: 750; box-shadow: 0 2px 6px rgba(20, 40, 33, .05); }
.apply-link:hover { border-color: var(--forest); color: var(--green-dark); }
.empty-state { padding: 66px 20px; border: 1px dashed var(--line-strong); border-radius: 16px; background: rgba(255,255,255,.55); text-align: center; }
.empty-state > div { color: var(--green-dark); font-size: 32px; }
.empty-state h2 { margin-top: 8px; font-size: 22px; }
.empty-state p { margin: 10px 0 20px; color: var(--muted); }
.primary-button { display: inline-flex; min-height: 44px; align-items: center; justify-content: center; padding: 0 17px; border: 1px solid var(--forest); border-radius: 10px; background: var(--forest); color: white; font-weight: 750; cursor: pointer; }
.see-more-wrap { display: flex; justify-content: center; padding: 28px 0 4px; }
.see-more-button { min-width: 190px; gap: 9px; box-shadow: 0 8px 20px rgba(11, 51, 39, .14); }
.see-more-button:hover { background: var(--forest-2); }

.about-page { display: grid; width: min(1120px, calc(100% - 40px)); min-height: calc(100vh - 148px); margin: 0 auto; padding: 72px 0 78px; place-items: center; }
.about-hero { display: grid; width: 100%; grid-template-columns: minmax(0, 1fr) minmax(290px, 360px); align-items: center; gap: clamp(54px, 8vw, 100px); }
.about-copy { max-width: 670px; padding-left: 30px; border-left: 3px solid var(--green); }
.about-copy .eyebrow { margin-bottom: 12px; }
.about-hero h1 { max-width: none; font-size: clamp(44px, 5vw, 66px); }
.about-story { max-width: 650px; margin: 22px 0 0; color: var(--muted); font-size: 17px; line-height: 1.75; }
.about-purpose { display: flex; align-items: center; gap: 13px; margin-top: 30px; padding-top: 24px; border-top: 1px solid var(--line); }
.about-purpose > img { width: 42px; height: 42px; object-fit: contain; }
.about-purpose p, .about-profile-meta p { margin: 0; }
.about-purpose strong, .about-purpose span, .about-profile-meta strong, .about-profile-meta span { display: block; }
.about-purpose strong { color: var(--ink); font-size: 14px; }
.about-purpose span { margin-top: 3px; color: var(--muted); font-size: 13px; line-height: 1.45; }
.about-profile { width: 100%; padding: 13px; border: 1px solid var(--line); border-radius: 18px; background: white; box-shadow: 0 18px 50px rgba(18, 45, 35, .1); }
.about-photo { display: block; width: 100%; height: auto; border-radius: 11px; }
.about-profile-meta { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 16px 5px 4px; }
.about-profile-meta strong { color: var(--ink); font-size: 15px; }
.about-profile-meta span { margin-top: 3px; color: var(--muted); font-size: 12px; }
.about-link { flex: 0 0 auto; padding: 8px 10px; border-radius: 8px; background: var(--green-soft); color: var(--green-dark); font-size: 13px; font-weight: 800; }
.about-link:hover { background: #ccefdc; }

.account-page { display: grid; width: min(1050px, calc(100% - 40px)); min-height: calc(100vh - 145px); grid-template-columns: minmax(0, 1fr) minmax(360px, 430px); align-content: center; align-items: center; gap: 72px; margin: 0 auto; padding: 58px 0; }
.account-intro h1 { max-width: 560px; font-size: clamp(42px, 5vw, 64px); }
.account-intro > p:last-of-type { max-width: 540px; margin: 20px 0 0; color: var(--muted); font-size: 16px; line-height: 1.65; }
.account-benefits { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 25px; }
.account-benefits span { padding: 8px 10px; border: 1px solid var(--line); border-radius: 9px; background: white; color: #405149; font-size: 12px; font-weight: 700; box-shadow: 0 3px 10px rgba(24, 50, 41, .04); }
.account-card { padding: 28px; border: 1px solid var(--line); border-radius: 20px; background: white; box-shadow: 0 22px 60px rgba(18, 45, 35, .1); }
.account-tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; margin-bottom: 22px; padding: 4px; border-radius: 11px; background: #eef2f0; }
.account-tabs button { min-height: 42px; border: 0; border-radius: 8px; background: transparent; color: var(--muted); font-size: 14px; font-weight: 750; cursor: pointer; }
.account-tabs button.active { background: white; color: var(--ink); box-shadow: 0 3px 10px rgba(24, 50, 41, .08); }
.google-button { display: flex; width: 100%; min-height: 47px; align-items: center; justify-content: center; gap: 10px; border: 1px solid var(--line-strong); border-radius: 10px; background: white; color: var(--ink); font-size: 14px; font-weight: 750; cursor: pointer; }
.google-button span { display: grid; width: 24px; height: 24px; place-items: center; border: 1px solid var(--line); border-radius: 99px; color: #2464cf; font-weight: 850; }
.google-button:hover { border-color: var(--forest); }
.google-button:disabled, .account-form button:disabled { opacity: .6; cursor: wait; }
.account-divider { display: flex; align-items: center; gap: 12px; margin: 20px 0; color: var(--muted); font-size: 12px; }
.account-divider::before, .account-divider::after { flex: 1; height: 1px; background: var(--line); content: ""; }
.account-form { display: grid; gap: 15px; }
.account-form label { color: #405149; font-size: 13px; font-weight: 700; }
.account-form input { display: block; width: 100%; height: 46px; margin-top: 7px; padding: 0 13px; border: 1px solid var(--line-strong); border-radius: 10px; outline: 0; background: #fbfcfb; color: var(--ink); font-size: 15px; }
.account-form input:focus { border-color: var(--green); box-shadow: 0 0 0 3px rgba(30, 189, 120, .12); }
.account-form .primary-button { width: 100%; margin-top: 3px; }
.text-button { padding: 8px; border: 0; background: transparent; color: var(--green-dark); font-size: 13px; font-weight: 750; cursor: pointer; }
.secondary-button { min-height: 44px; padding: 0 15px; border: 1px solid var(--line); border-radius: 10px; background: white; color: var(--ink); font-weight: 700; cursor: pointer; }
.account-message { margin: 18px 0 0; padding: 11px 12px; border-radius: 9px; background: var(--blue-soft); color: #334f94; font-size: 13px; line-height: 1.45; }
.account-message.error { background: var(--red-soft); color: var(--red); }
.account-message.success { background: var(--green-soft); color: var(--green-dark); }
.signed-in-account { text-align: center; }
.account-avatar { display: grid; width: 56px; height: 56px; margin: 0 auto 17px; place-items: center; border-radius: 99px; background: var(--green-soft); color: var(--green-dark); font-size: 24px; font-weight: 850; }
.signed-in-account .eyebrow { margin-bottom: 7px; }
.signed-in-account h2 { overflow-wrap: anywhere; font-size: 24px; line-height: 1.25; }
.verification-status { display: inline-flex; margin: 14px 0 0; padding: 7px 10px; border-radius: 99px; background: var(--amber-soft); color: var(--amber); font-size: 12px; font-weight: 750; }
.verification-status.verified { background: var(--green-soft); color: var(--green-dark); }
.signed-in-actions { display: grid; gap: 9px; margin-top: 24px; }
.admin-overview { grid-column: 1 / -1; display: flex; align-items: center; justify-content: space-between; gap: 30px; margin-top: 6px; padding: 25px 28px; border-radius: 18px; background: var(--forest); color: white; }
.admin-overview .eyebrow { margin-bottom: 5px; color: var(--green); }
.admin-overview h2 { font-size: 22px; }
.admin-metrics { display: grid; grid-template-columns: repeat(4, minmax(80px, 1fr)); gap: 8px; }
.admin-metrics div { min-width: 92px; padding: 12px; border-radius: 10px; background: rgba(255,255,255,.08); }
.admin-metrics strong, .admin-metrics span { display: block; }
.admin-metrics strong { font-size: 20px; }
.admin-metrics span { margin-top: 3px; color: #bed2ca; font-size: 11px; }

footer { display: flex; justify-content: space-between; width: min(1210px, calc(100% - 40px)); margin: 0 auto; padding: 25px 2px 35px; border-top: 1px solid var(--line); color: var(--muted); font-size: 13px; }
.footer-dot { width: 9px; height: 9px; border-radius: 99px; background: var(--green); }
.toast { position: fixed; z-index: 50; right: 24px; bottom: 24px; padding: 13px 17px; border-radius: 11px; background: var(--forest); color: white; box-shadow: 0 16px 35px rgba(10, 33, 26, .2); font-size: 13px; font-weight: 650; opacity: 0; transform: translateY(12px); pointer-events: none; transition: opacity .2s ease, transform .2s ease; }
.toast.show { opacity: 1; transform: translateY(0); }

.job-dialog { width: min(590px, calc(100% - 30px)); padding: 0; border: 0; border-radius: 19px; box-shadow: 0 30px 90px rgba(8, 31, 23, .28); }
.job-dialog::backdrop, .tracker-prompt::backdrop { background: rgba(6, 21, 16, .58); backdrop-filter: blur(4px); }
.dialog-close { position: absolute; top: 15px; right: 15px; width: 36px; height: 36px; border: 1px solid var(--line); border-radius: 9px; background: white; color: var(--ink); font-size: 22px; cursor: pointer; }
.dialog-body { padding: 34px; }
.dialog-company { display: flex; align-items: center; gap: 11px; color: var(--muted); font-size: 14px; font-weight: 700; }
.dialog-body h2 { max-width: 480px; margin-top: 18px; font-size: 28px; line-height: 1.2; }
.dialog-meta { display: flex; flex-wrap: wrap; gap: 8px; margin: 18px 0 23px; }
.dialog-body > p { color: var(--muted); line-height: 1.65; }
.detail-facts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-top: 23px; }
.detail-facts p { margin: 0; padding: 12px; border: 1px solid var(--line); border-radius: 10px; background: #f8faf9; }
.detail-facts span, .detail-facts strong { display: block; }
.detail-facts span { color: var(--muted); font-size: 12px; }
.detail-facts strong { margin-top: 5px; font-size: 13px; line-height: 1.35; }
.dialog-stage { display: block; margin-top: 18px; }
.dialog-stage > span { display: block; margin-bottom: 7px; color: var(--muted); font-size: 12px; font-weight: 700; }
.dialog-stage select { width: 100%; height: 44px; padding: 0 13px; border-radius: 10px; outline: 0; font-weight: 750; cursor: pointer; }
.dialog-actions { display: flex; align-items: center; gap: 10px; margin-top: 27px; padding-top: 21px; border-top: 1px solid var(--line); }
.dialog-actions .secondary-button { min-height: 44px; padding: 0 15px; border: 1px solid var(--line); border-radius: 10px; background: white; font-weight: 700; cursor: pointer; }
.closed-message { color: var(--red); font-size: 14px; font-weight: 750; }
.tracker-prompt { width: min(440px, calc(100% - 30px)); padding: 0; border: 0; border-radius: 19px; box-shadow: 0 30px 90px rgba(8, 31, 23, .28); }
.tracker-prompt-body { padding: 40px 34px 34px; text-align: center; }
.prompt-icon { display: grid; width: 48px; height: 48px; margin: 0 auto 18px; place-items: center; border-radius: 13px; background: var(--green-soft); color: var(--green-dark); font-size: 24px; font-weight: 800; }
.tracker-prompt h2 { font-size: 27px; }
.tracker-prompt p { margin: 13px auto 22px; color: var(--muted); font-size: 15px; line-height: 1.55; }
.tracker-prompt .primary-button { gap: 9px; }
.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; }

@keyframes spin { to { transform: rotate(360deg); } }

@media (max-width: 1030px) {
  .table-header, .job-row { grid-template-columns: 1fr 1.38fr .9fr .72fr 136px .7fr 118px; }
  .table-header > :nth-child(7), .job-row > :nth-child(7) { display: none; }
  .landing-preview .table-header, .landing-preview .job-row { grid-template-columns: 1.12fr 1.6fr .9fr .72fr .7fr 105px; }
  .landing-preview .table-header > :nth-child(6), .landing-preview .job-row > :nth-child(6) { display: none; }
  .landing-preview .job-row > :nth-child(7) { display: flex; }
}

@media (max-width: 760px) {
  .header-inner, .workspace, .about-page, footer { width: min(100% - 24px, 1210px); }
  .header-inner { min-height: 64px; }
  nav > a { display: none; }
  nav > a:first-child { display: inline-flex; }
  nav .account-nav { display: inline-flex; }
  nav a.saved-nav { display: inline-flex; }
  .workspace { padding-top: 40px; }
  h1 { font-size: 38px; }
  .workspace-heading { padding-bottom: 23px; }
  .preview-heading { align-items: start; }
  .preview-heading-link { padding-top: 4px; }
  .mini-metrics { width: 100%; }
  .mini-metrics div { min-width: 0; flex: 1; justify-content: center; }
  .source-banner { grid-template-columns: auto 1fr; }
  .source-banner .refresh-button { grid-column: 1 / -1; width: 100%; }
  .filter-row label { flex: 1 1 calc(50% - 9px); }
  .clear-button { flex: 1 1 100%; }
  .table-header { display: none; }
  .job-table { overflow: visible; border: 0; background: transparent; box-shadow: none; }
  .table-body { display: grid; gap: 10px; }
  .job-row { display: grid; grid-template-columns: 1fr auto; gap: 12px 16px; min-height: 0; padding: 17px; border: 1px solid var(--line); border-radius: 14px; background: white; box-shadow: 0 5px 18px rgba(24, 50, 41, .04); }
  .job-row:first-child { border-top: 1px solid var(--line); }
  .company-cell { grid-column: 1; }
  .role-cell { grid-column: 1 / -1; }
  .programme-cell, .location-cell, .stage-cell, .deadline-cell, .updated-cell { display: block !important; }
  .programme-cell { grid-column: 1; }
  .location-cell { grid-column: 2; text-align: right; }
  .stage-cell { grid-column: 1 / -1; }
  .deadline-cell { grid-column: 1; }
  .updated-cell { grid-column: 2; text-align: right; }
  .row-actions { grid-column: 1 / -1; justify-content: stretch; padding-top: 3px; }
  .row-actions .apply-link { flex: 1; }
  .listing-pagination { flex-wrap: wrap; }
  .pagination-summary { width: 100%; order: 4; text-align: center; }
  .about-page { min-height: calc(100vh - 130px); padding: 46px 0 54px; }
  .about-hero { grid-template-columns: 1fr; gap: 38px; }
  .about-copy { max-width: none; padding-left: 22px; }
  .about-profile { width: min(100%, 390px); justify-self: start; }
  .account-page { width: min(100% - 24px, 560px); min-height: 0; grid-template-columns: 1fr; gap: 34px; padding: 42px 0; }
  .account-intro h1 { font-size: 42px; }
  .account-card { padding: 22px; }
  .admin-overview { align-items: stretch; flex-direction: column; }
  .admin-metrics { grid-template-columns: repeat(2, 1fr); }
  footer { align-items: center; gap: 20px; }
  footer p { text-align: right; }
}

@media (max-width: 460px) {
  h1 { font-size: 34px; }
  .brand { gap: 7px; font-size: 15px; }
  .brand-mark { width: 31px; height: 31px; flex-basis: 31px; }
  .mini-metrics span { font-size: 12px; }
  .mini-metrics div { gap: 4px; padding: 12px 7px; }
  .filter-row label { flex-basis: 100%; }
  .tracker:not(.landing-preview) .results-bar > p:last-child { display: none; }
  .preview-heading-link { display: none; }
  .account-intro h1 { font-size: 36px; }
  .header-inner nav { gap: 2px; }
  .header-inner nav a, .header-inner .saved-nav { padding-inline: 8px; }
  .about-profile-meta { align-items: flex-start; flex-direction: column; }
  .pagination-direction { flex: 1 1 115px; }
}

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

/* Email alerts extends the existing account surface. */
.alerts-page { width: min(720px, calc(100% - 40px)); margin: 0 auto; padding: 54px 0 60px; min-height: calc(100vh - 155px); }
.auth-required:not(.auth-ready) .alerts-page { display: none; }
.alerts-intro h1 { font-size: clamp(34px, 4.5vw, 48px); max-width: 630px; }
.alerts-intro > p:last-child { color: var(--muted); line-height: 1.65; margin: 20px 0 30px; }
.alerts-card { padding: 30px; background: white; border: 1px solid var(--line); border-radius: 16px; box-shadow: var(--shadow); }
.alerts-card-heading { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; }
.alerts-card h2 { font-size: 24px; }
.alert-badge { padding: 7px 11px; border-radius: 20px; background: #f0f3f1; color: #53635c; font-size: 14px; font-weight: 700; }
.alert-badge.active { background: var(--green-soft); color: var(--green-dark); }
.alert-recipient { color: var(--muted); font-size: 15px; overflow-wrap: anywhere; line-height: 1.6; }
.alert-recipient strong { color: var(--ink); }
.alerts-card fieldset { border: 0; padding: 0; margin: 12px 0 0; min-width: 0; display: grid; gap: 20px; }
.alerts-card .account-form label { font-size: 15px; }
.alerts-card select { display: block; width: 100%; height: 48px; margin-top: 8px; padding: 0 12px; border: 1px solid var(--line-strong); border-radius: 9px; background: #fbfcfb; color: var(--ink); font: inherit; }
.alerts-card select:focus-visible { outline: 2px solid var(--green-dark); outline-offset: 2px; }
.alert-hint, .alert-footnote { color: var(--muted); font-size: 14px; line-height: 1.65; margin: 0; }
.alert-footnote { margin: 22px 4px 0; }
.alerts-card .alert-consent { display: flex; gap: 10px; align-items: flex-start; font-weight: 500; line-height: 1.5; }
.alerts-card .alert-consent input { width: 18px; height: 18px; margin: 3px 0 0; flex-shrink: 0; accent-color: var(--green-dark); }
.alert-actions { display: flex; gap: 12px; flex-wrap: wrap; }
.alert-actions .primary-button { flex: 1; margin: 0; }
.alert-actions .secondary-button { border: 1px solid var(--line); border-radius: 10px; background: white; padding: 12px 20px; cursor: pointer; font-weight: 700; }
#alertVerification { padding: 0 0 16px; color: var(--muted); font-size: 15px; }
#alertVerification .text-button { display: inline-block; padding: 8px 10px 8px 0; }
@media (max-width: 760px) {
  .header-inner { flex-wrap: wrap; gap: 8px; padding: 10px 0; }
  .header-inner nav { flex-wrap: wrap; }
  nav .alerts-nav { display: inline-flex; }
  .alerts-page { width: min(100% - 24px, 720px); padding-top: 34px; }
  .alerts-card { padding: 22px; }
}
@media (max-width: 460px) {
  .header-inner { justify-content: center; }
  .header-inner nav { justify-content: center; }
}