/* ============================================================
   People (next) — Hiring board, Applicants, Requests inbox, Tickets.
   Loads after ivy-refresh.css and uses its tokens (--bg, --card, --line,
   --teal, --danger, --warn, --ok, --fg, --muted ...). The few colors the
   refresh does not name yet are tokens here, so the screen files carry
   no colors. Everything is scoped under .pn (one class on each screen's
   root), so other screens are untouched.
   ============================================================ */

.pn { display: flex; flex-direction: column; gap: 18px; max-width: 1440px; min-width: 0; color: var(--fg); }
.pn *, .pn *::before, .pn *::after { box-sizing: border-box; }
.pn [hidden] { display: none !important; }
.pn a:hover { text-decoration: none; }
.pn-i { width: 16px; height: 16px; flex: none; }

/* ---------- header ---------- */
.pn-head { display: flex; align-items: flex-end; gap: 14px 24px; flex-wrap: wrap; }
.pn-head-text { flex: 1 1 420px; min-width: 0; }
.pn-eyebrow { margin-bottom: 4px; }
.pn-title { margin: 0; }
.pn-lede { margin: 6px 0 0; max-width: 760px; }
.pn-head-actions { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.pn-back { display: inline-flex; align-items: center; gap: 6px; font-size: var(--fs-base); font-weight: 600; color: var(--teal) !important; margin-bottom: -6px; }
.pn-back .pn-i { width: 14px; height: 14px; }

/* ---------- buttons, chips, status ---------- */
.pn-btn { color: var(--fg); box-shadow: var(--shadow-sm); }
.pn-btn:hover { background: var(--surface-hover); border-color: var(--line-strong); }
.pn-btn[disabled] { opacity: .55; cursor: progress; }
.pn-btn .pn-i { width: 15px; height: 15px; }
.pn-btn-primary { background: var(--teal); border-color: var(--teal); color: var(--on-solid); }
.pn-btn-primary:hover { background: var(--teal-deep); border-color: var(--teal-deep); }
.pn-btn-danger { background: var(--danger); border-color: var(--danger); color: var(--on-solid) !important; }
.pn-btn-danger:hover { background: var(--danger-ink); border-color: var(--danger-ink); }
.pn-btn-quiet { background: transparent; box-shadow: none; color: var(--fg-soft); }

.pn-chip { border: 1px solid var(--line); background: var(--surface-sunk); color: var(--fg-soft); max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
.pn-chip .pn-i { width: 12px; height: 12px; }
.pn-chip.is-bad { background: var(--danger-soft); border-color: var(--danger-line); color: var(--danger-ink); }
.pn-chip.is-warn { background: var(--warn-soft); border-color: var(--warn-line); color: var(--warn-ink); }
.pn-chip.is-ok { background: var(--ok-soft); border-color: var(--ok-line); color: var(--ok-ink); }
.pn-chip.is-info { background: var(--info-soft); border-color: var(--info-soft); color: var(--info-ink); }
.pn-chip.is-brand { background: var(--teal-soft); border-color: var(--teal-line); color: var(--brand-ink); }

.pn-status { align-items: flex-start; color: var(--fg-soft); }
.pn-status .pn-i { width: 14px; height: 14px; margin-top: 1px; }
.pn-status.is-bad { color: var(--danger-ink); } .pn-status.is-bad .pn-i { color: var(--danger); }
.pn-status.is-warn { color: var(--warn-ink); } .pn-status.is-warn .pn-i { color: var(--warn); }
.pn-status.is-ok { color: var(--ok-ink); } .pn-status.is-ok .pn-i { color: var(--ok); }
.pn-status.is-info { color: var(--info-ink); } .pn-status.is-info .pn-i { color: var(--info); }

.pn-av { display: inline-grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; flex: none; color: var(--on-solid); font-size: var(--fs-sm); font-weight: 700; letter-spacing: .02em; }
.pn-av.a0 { background: var(--av-0); } .pn-av.a1 { background: var(--av-1); } .pn-av.a2 { background: var(--av-2); }
.pn-av.a3 { background: var(--av-3); } .pn-av.a4 { background: var(--av-4); } .pn-av.a5 { background: var(--av-5); }
.pn-av.lg { width: 48px; height: 48px; font-size: var(--fs-lead); }
.pn-bdot { display: inline-block; width: 7px; height: 7px; border-radius: 2px; margin-right: 4px; vertical-align: 1px; background: var(--faint); }
.pn-place { white-space: nowrap; }
.pn-b-davenport { background: var(--bldg-davenport); }
.pn-b-angel-oak { background: var(--bldg-angel-oak); }
.pn-b-silver-oak { background: var(--bldg-silver-oak); }

.pn-banner { display: flex; gap: 10px; align-items: flex-start; padding: 12px 14px; border-radius: 10px; border: 1px solid var(--line); background: var(--surface-2); color: var(--fg-soft); font-size: var(--fs-base); }
.pn-banner .pn-i { width: 18px; height: 18px; margin-top: 1px; color: var(--muted); }
.pn-banner.is-warn { background: var(--warn-soft); border-color: var(--warn-line); color: var(--warn-ink); } .pn-banner.is-warn .pn-i { color: var(--warn); }
.pn-banner.is-bad { background: var(--danger-soft); border-color: var(--danger-line); color: var(--danger-ink); } .pn-banner.is-bad .pn-i { color: var(--danger); }
.pn-banner.is-ok { background: var(--ok-soft); border-color: var(--ok-line); color: var(--ok-ink); } .pn-banner.is-ok .pn-i { color: var(--ok); }
.pn-banner b { color: inherit; }
.pn-note { margin: 0; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; font-size: var(--fs-sm); color: var(--muted); }
.pn-note .pn-i { width: 14px; height: 14px; }
.pn-note a { color: var(--teal); font-weight: 600; }
.pn-empty { background: var(--card); border: 1px solid var(--line); border-radius: 14px; }

/* ---------- KPI strip ---------- */
.pn-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); background: var(--card); border: 1px solid var(--line); border-radius: var(--r-card); box-shadow: var(--shadow-sm); overflow: hidden; }
.pn-kpi { border-left: 1px solid var(--line); min-width: 0; }
.pn-kpi:first-child { border-left: 0; }
.pn-kpi-l { display: flex; align-items: center; gap: 7px; }
.pn-kpi-l .pn-i { width: 15px; height: 15px; color: var(--muted); }
.pn-kpi-v { margin-top: 4px; }
.pn-kpi-f { margin-top: 4px; font-size: var(--fs-sm); color: var(--muted); display: flex; flex-wrap: wrap; align-items: center; gap: 4px 6px; }

/* ---------- Starting soon ---------- */
.pn-soon { background: var(--card); border: 1px solid var(--line); border-radius: 14px; box-shadow: var(--shadow-sm); }
.pn-soon-head { display: flex; align-items: baseline; gap: 4px 12px; flex-wrap: wrap; padding: 16px 18px 0; }
.pn-soon-head h2 { margin: 0; font-family: var(--font-display); font-size: var(--fs-lg); font-weight: 700; }
.pn-soon-head span { font-size: var(--fs-sm); color: var(--muted); }
.pn-soon-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 10px; padding: 12px 18px 18px; }
.pn-soon-item { display: flex; gap: 12px; align-items: center; padding: 10px 12px; border: 1px solid var(--line); border-radius: 10px; background: var(--card); color: inherit; font: inherit; text-align: left; cursor: pointer; min-width: 0; transition: border-color 120ms, box-shadow 120ms; }
.pn-soon-item:hover { border-color: var(--line-strong); box-shadow: var(--shadow); }
.pn-date { flex: none; width: 46px; text-align: center; border-radius: 9px; background: var(--surface-sunk); padding: 5px 0 6px; display: flex; flex-direction: column; }
.pn-date small { font-size: var(--fs-2xs); font-weight: 750; letter-spacing: .07em; text-transform: uppercase; color: var(--muted); }
.pn-date b { font-family: var(--font-display); font-weight: 750; font-size: var(--fs-2xl); line-height: 1.1; }
.pn-soon-item.is-ok .pn-date { background: var(--ok-soft); } .pn-soon-item.is-ok .pn-date small { color: var(--ok-ink); }
.pn-soon-item.is-block .pn-date { background: var(--danger-soft); } .pn-soon-item.is-block .pn-date small { color: var(--danger-ink); }
.pn-soon-main { min-width: 0; flex: 1; display: flex; flex-direction: column; gap: 1px; }
.pn-soon-name { display: flex; align-items: center; gap: 7px; font-weight: 650; min-width: 0; }
.pn-soon-name > span:last-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pn-soon-name .pn-av { width: 22px; height: 22px; font-size: var(--fs-3xs); }
.pn-soon-item .pn-status { font-size: var(--fs-sm); margin-top: 3px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.pn-soon-item .pn-status .pn-i { display: inline-block; vertical-align: -2px; margin-right: 4px; }

/* ---------- toolbar ---------- */
.pn-toolbar { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.pn-fchips { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; }
.pn-fchip > span { font-weight: 700; opacity: .6; font-variant-numeric: tabular-nums; }
.pn-fchip.pn-mine { border-style: dashed; }
.pn-fchip.pn-mine[aria-pressed="true"] { background: var(--teal); border-color: var(--teal); color: var(--on-solid); border-style: solid; }
.pn-fchip .pn-i { width: 14px; height: 14px; }
.pn-sep { width: 1px; height: 20px; background: var(--line-strong); margin: 0 2px; }
.pn-spacer { flex: 1 1 auto; }
.pn-search { position: relative; display: inline-flex; align-items: center; width: 210px; margin: 0; }
.pn-search .pn-i { position: absolute; left: 10px; width: 15px; height: 15px; color: var(--muted); pointer-events: none; }
.pn-search input { width: 100%; height: 34px; padding: 0 10px 0 32px; border-radius: 8px; border: 1px solid var(--line-strong); background: var(--card); color: var(--fg); font: inherit; font-size: var(--fs-base); margin: 0; }
.pn-seg .pn-n { display: inline-grid; place-items: center; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px; font-size: var(--fs-2xs); font-weight: 700; background: var(--card); color: var(--muted); border: 1px solid var(--line); font-variant-numeric: tabular-nums; }
.pn-seg .pn-n.is-hot { background: var(--teal); border-color: var(--teal); color: var(--on-solid); }

/* ---------- stage bar + board ---------- */
.pn-results { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.pn-lane-applied, .pn-lane-interview { --tone: var(--faint); }
.pn-lane-checks, .pn-lane-offer { --tone: var(--info); }
.pn-lane-paperwork { --tone: var(--info); }
.pn-lane-review { --tone: var(--warn); }
.pn-lane-ready { --tone: var(--ok); }
.pn-lane-ninety { --tone: var(--teal); }
.pn-stagebar { display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); background: var(--card); border: 1px solid var(--line); border-radius: 12px; box-shadow: var(--shadow-sm); overflow: hidden; }
.pn-stagebar button { position: relative; border: 0; border-left: 1px solid var(--line); background: none; text-align: left; padding: 10px 12px 9px; display: flex; flex-direction: column; gap: 1px; min-width: 0; font: inherit; color: inherit; cursor: pointer; }
.pn-stagebar button:first-child { border-left: 0; }
.pn-stagebar button::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 3px; background: var(--tone); }
.pn-stagebar button:hover { background: var(--surface-hover); }
.pn-sb-l { font-size: var(--fs-sm); color: var(--fg-soft); font-weight: 650; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pn-sb-n { font-family: var(--font-display); font-weight: 750; font-size: var(--fs-2xl); line-height: 1.2; font-variant-numeric: tabular-nums; display: flex; align-items: baseline; gap: 6px; }
.pn-sb-you { font-family: var(--font-sans); font-size: var(--fs-2xs); font-weight: 700; color: var(--brand-ink); background: var(--teal-soft); border-radius: 999px; padding: 1px 6px; white-space: nowrap; }
.pn-sb-h { font-size: var(--fs-xs); color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pn-sb-h.is-warn { color: var(--warn-ink); font-weight: 600; }

.pn-board { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(268px, 1fr); gap: 12px; overflow-x: auto; padding-bottom: 6px; align-items: start; scrollbar-width: thin; }
.pn-lane { display: flex; flex-direction: column; gap: 8px; min-width: 0; min-height: 140px; padding: 8px; border-radius: 12px; background: var(--surface-sunk); }
.pn-lane.is-on { box-shadow: inset 0 0 0 2px var(--teal-line); }
.pn-lane-head { display: flex; align-items: center; gap: 7px; padding: 2px 4px 4px; font-size: var(--fs-base); }
.pn-ldot { width: 8px; height: 8px; border-radius: 50%; background: var(--tone); flex: none; }
.pn-lname { font-weight: 700; }
.pn-count { font-size: var(--fs-sm); font-weight: 700; color: var(--muted); font-variant-numeric: tabular-nums; }
.pn-lane-age { margin-left: auto; font-size: var(--fs-xs); font-weight: 600; color: var(--muted); white-space: nowrap; }
.pn-lane-age.is-warn { color: var(--warn-ink); }
.pn-lane-empty { border: 1.5px dashed var(--line-strong); border-radius: 10px; padding: 18px 12px; text-align: center; font-size: var(--fs-sm); color: var(--muted); }

.pn-card { display: flex; flex-direction: column; gap: 10px; padding: 12px; background: var(--card); border: 1px solid var(--line); border-radius: 10px; box-shadow: var(--shadow-sm); cursor: pointer; min-width: 0; transition: border-color 120ms, box-shadow 120ms; }
.pn-card:hover { border-color: var(--line-strong); box-shadow: var(--shadow); }
.pn-card.is-bad { border-left: 3px solid var(--danger); }
.pn-card-top { display: flex; align-items: flex-start; gap: 10px; min-width: 0; }
.pn-id { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.pn-name { font-weight: 650; line-height: 1.25; }
.pn-sub { font-size: var(--fs-sm); color: var(--muted); line-height: 1.35; }
.pn-age { flex: none; display: inline-flex; gap: 4px; align-items: center; font-size: var(--fs-xs); font-weight: 600; color: var(--muted); white-space: nowrap; padding: 2px 0; }
.pn-age .pn-i { width: 12px; height: 12px; }
.pn-age.is-warn { color: var(--warn-ink); background: var(--warn-soft); border: 1px solid var(--warn-line); padding: 1px 7px; border-radius: 999px; }
.pn-age.is-bad { color: var(--danger-ink); background: var(--danger-soft); border: 1px solid var(--danger-line); padding: 1px 7px; border-radius: 999px; }
.pn-next { display: flex; gap: 7px; font-size: var(--fs-base); color: var(--fg-soft); line-height: 1.4; }
.pn-next .pn-i { width: 14px; height: 14px; margin-top: 2px; color: var(--muted); }
.pn-next b { color: var(--fg); font-weight: 650; }
.pn-next q { font-style: italic; }
.pn-next.you .pn-i { color: var(--teal); } .pn-next.you b { color: var(--brand-ink); }
.pn-next.warn .pn-i { color: var(--warn); } .pn-next.warn b { color: var(--warn-ink); }
.pn-next.bad .pn-i { color: var(--danger); } .pn-next.bad b { color: var(--danger-ink); }
.pn-next.ok .pn-i { color: var(--ok); } .pn-next.ok b { color: var(--ok-ink); }
.pn-prog { display: flex; align-items: center; gap: 8px; font-size: var(--fs-xs); color: var(--muted); font-weight: 600; font-variant-numeric: tabular-nums; white-space: nowrap; }
.pn-bar { flex: 1; height: 5px; border-radius: 99px; background: var(--line); overflow: hidden; }
.pn-bar i { display: block; height: 100%; background: var(--teal); border-radius: 99px; }
.pn-chips { display: flex; flex-wrap: wrap; gap: 4px; min-width: 0; }
.pn-meta { display: flex; align-items: center; gap: 6px; font-size: var(--fs-sm); color: var(--muted); }
.pn-meta .pn-i { width: 13px; height: 13px; }
.pn-meta b { color: var(--fg-soft); font-weight: 650; }
.pn-meta.is-bad, .pn-meta.is-bad b { color: var(--danger-ink); font-weight: 650; }
.pn-foot { display: flex; gap: 6px; }
.pn-foot .pn-btn { flex: 1 1 0; min-width: 0; }
.pn-foot .done { color: var(--ok-ink); font-weight: 650; font-size: var(--fs-base); }
.pn-foot .fail { color: var(--danger-ink); font-weight: 650; font-size: var(--fs-sm); }
.pn-otrack { display: flex; align-items: center; gap: 5px; font-size: var(--fs-xs); font-weight: 600; color: var(--muted); flex-wrap: wrap; }
.pn-otrack span { display: inline-flex; align-items: center; gap: 4px; }
.pn-otrack i { width: 7px; height: 7px; border-radius: 50%; border: 1.5px solid var(--line-strong); background: var(--card); }
.pn-otrack .on { color: var(--brand-ink); } .pn-otrack .on i { background: var(--teal); border-color: var(--teal); }
.pn-otrack em { width: 10px; height: 1.5px; background: var(--line-strong); }
.pn-ci { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 4px; }
.pn-ci-c { border-radius: 6px; background: var(--surface-sunk); padding: 4px 4px; text-align: center; line-height: 1.2; min-width: 0; }
.pn-ci-c small { display: block; font-size: var(--fs-2xs); color: var(--muted); font-weight: 600; }
.pn-ci-c b { display: block; font-size: var(--fs-xs); font-variant-numeric: tabular-nums; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pn-ci-c.answered { background: var(--ok-soft); } .pn-ci-c.answered b { color: var(--ok-ink); }
.pn-ci-c.low, .pn-ci-c.skipped, .pn-ci-c.not_sent { background: var(--danger-soft); } .pn-ci-c.low b, .pn-ci-c.skipped b, .pn-ci-c.not_sent b { color: var(--danger-ink); }
.pn-ci-c.due { background: var(--warn-soft); } .pn-ci-c.due b { color: var(--warn-ink); }
.pn-ci-c.sent { background: var(--info-soft); } .pn-ci-c.sent b { color: var(--info-ink); }

/* List view keeps hr-hiring.js's own table; this just matches the card radius. */
.pn-hiring .hire-panel { border-radius: 14px; border-color: var(--line); }

@media (max-width: 1100px) {
  .pn-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pn-kpi:nth-child(3) { border-left: 0; }
  .pn-kpi:nth-child(n+3) { border-top: 1px solid var(--line); }
  .pn-stagebar { display: flex; overflow-x: auto; scrollbar-width: none; }
  .pn-stagebar::-webkit-scrollbar { display: none; }
  .pn-stagebar button { flex: 0 0 auto; min-width: 112px; }
}
@media (max-width: 720px) {
  .pn { gap: 14px; }
  .pn-head-actions { width: 100%; }
  .pn-head-actions .pn-btn { flex: 1 1 0; }
  .pn-soon-grid { display: flex; overflow-x: auto; padding: 10px 14px 14px; scroll-snap-type: x mandatory; scrollbar-width: none; }
  .pn-soon-grid::-webkit-scrollbar { display: none; }
  .pn-soon-item { flex: 0 0 82%; scroll-snap-align: start; }
  .pn-soon-head { padding: 14px 14px 0; }
  .pn-toolbar .pn-fchips { flex-wrap: nowrap; overflow-x: auto; width: 100%; scrollbar-width: none; padding-bottom: 2px; }
  .pn-toolbar .pn-fchips::-webkit-scrollbar { display: none; }
  .pn-spacer { display: none; }
  .pn-search { order: -1; width: 100%; }
  .pn-board { grid-auto-flow: row; grid-auto-columns: auto; grid-template-columns: minmax(0, 1fr); overflow: visible; }
  .pn-lane { min-height: 0; }
  .pn-lane.is-empty { display: none; }
}

/* ============================================================
   Requests (#/requests) — split inbox
   ============================================================ */
.pn-k-missed_punch { --k: var(--info); --k-soft: var(--info-soft); }
.pn-k-pto { --k: var(--teal); --k-soft: var(--teal-soft); }
.pn-k-hours { --k: var(--av-3); --k-soft: var(--surface-sunk); }
.pn-k-emf { --k: var(--warn); --k-soft: var(--warn-soft); }
.pn-k-staffing_exception { --k: var(--bldg-angel-oak); --k-soft: var(--danger-soft); }
.pn-rq-ticon { width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; flex: none; background: var(--k-soft, var(--surface-sunk)); color: var(--k, var(--fg-soft)); }
.pn-rq-ticon .pn-i { width: 17px; height: 17px; }
.pn-rq-ticon.lg { width: 48px; height: 48px; border-radius: 12px; }

.pn-rq-start { display: flex; align-items: center; gap: 10px 14px; flex-wrap: wrap; }
.pn-rq-start-l { display: inline-flex; align-items: center; gap: 6px; font-size: var(--fs-base); font-weight: 650; color: var(--fg-soft); }
.pn-rq-start-l .pn-i { width: 15px; height: 15px; color: var(--teal); }
.pn-rq-kinds { display: flex; gap: 8px; flex-wrap: wrap; flex: 1 1 auto; min-width: 0; }
.pn-rq-kind { display: inline-flex; align-items: center; gap: 9px; padding: 6px 12px 6px 6px; border: 1px solid var(--line); border-radius: 10px; background: var(--card); color: var(--fg) !important; box-shadow: var(--shadow-sm); transition: border-color 120ms, box-shadow 120ms; }
.pn-rq-kind:hover { border-color: var(--line-strong); box-shadow: var(--shadow); }
.pn-rq-kind .pn-rq-ticon { width: 28px; height: 28px; border-radius: 8px; }
.pn-rq-kind .pn-rq-ticon .pn-i { width: 15px; height: 15px; }
.pn-rq-kind b { display: block; font-size: var(--fs-base); font-weight: 650; white-space: nowrap; }
.pn-rq-kind small { display: none; }

.pn-rq-split { display: grid; grid-template-columns: minmax(300px, 390px) minmax(0, 1fr); gap: 16px; align-items: start; }
.pn-rq-listpane { background: var(--card); border: 1px solid var(--line); border-radius: 14px; box-shadow: var(--shadow-sm); display: flex; flex-direction: column; overflow: hidden; position: sticky; top: 12px; max-height: calc(100vh - var(--topbar-h, 56px) - 28px); }
.pn-rq-listhead { padding: 12px; border-bottom: 1px solid var(--line); display: flex; flex-direction: column; gap: 10px; }
.pn-rq-seg { display: flex; width: 100%; }
.pn-rq-seg button { flex: 1 1 auto; justify-content: center; }
.pn-rq-search { width: 100%; }
.pn-rq-list { overflow-y: auto; flex: 1 1 auto; padding: 6px; min-height: 120px; }
.pn-rq-item { display: flex; gap: 12px; width: 100%; padding: 10px 10px 10px 8px; border: 0; border-radius: 10px; background: none; text-align: left; position: relative; font: inherit; color: inherit; cursor: pointer; }
.pn-rq-item + .pn-rq-item { margin-top: 2px; }
.pn-rq-item:hover { background: var(--surface-hover); }
.pn-rq-item.is-on { background: var(--teal-soft); }
.pn-rq-item.is-on::before { content: ""; position: absolute; left: 0; top: 10px; bottom: 10px; width: 3px; border-radius: 3px; background: var(--teal); }
.pn-rq-item.is-on .pn-rq-ticon { background: var(--card); }
.pn-rq-main { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.pn-rq-row { display: flex; align-items: baseline; gap: 8px; min-width: 0; }
.pn-rq-who { font-weight: 650; font-size: var(--fs-base); flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pn-rq-age { font-size: var(--fs-sm); color: var(--muted); flex: none; font-variant-numeric: tabular-nums; }
.pn-rq-type { font-size: var(--fs-sm); color: var(--muted); font-weight: 550; }
.pn-rq-line { font-size: var(--fs-base); color: var(--fg-soft); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pn-rq-meta { margin-top: 5px; display: flex; gap: 6px; align-items: center; min-width: 0; }
.pn-rq-listempty { border: 0; box-shadow: none; padding: 40px 16px; }

.pn-rq-detail { background: var(--card); border: 1px solid var(--line); border-radius: 14px; box-shadow: var(--shadow-sm); min-height: 480px; min-width: 0; }
.pn-rq-empty { border: 0; box-shadow: none; padding: 120px 20px; }
.pn-rq-detail-in { padding: 22px 24px 18px; display: flex; flex-direction: column; gap: 16px; }
.pn-rq-dh { display: flex; gap: 14px; align-items: center; }
.pn-rq-dh-main { flex: 1 1 auto; min-width: 0; }
.pn-rq-eyebrow { display: flex; align-items: center; gap: 6px; margin: 0 0 2px; }
.pn-rq-eyebrow .pn-i { width: 13px; height: 13px; }
.pn-rq-title { margin: 0; font-family: var(--font-display); font-size: var(--fs-3xl); font-weight: 700; letter-spacing: -.015em; line-height: 1.2; }
.pn-rq-sub { font-size: var(--fs-base); color: var(--muted); }
.pn-rq-summary { display: flex; flex-direction: column; gap: 3px; padding: 12px 14px; border-radius: 10px; background: var(--surface-2); border: 1px solid var(--line); }
.pn-rq-summary b { font-size: var(--fs-lead); font-weight: 650; }
.pn-rq-summary span { font-size: var(--fs-base); color: var(--fg-soft); font-style: italic; }

.pn-chain { list-style: none; margin: 0; padding: 14px 16px; display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 0; border: 1px solid var(--line); border-radius: 10px; }
.pn-chain li { position: relative; display: flex; flex-direction: column; gap: 2px; padding-right: 8px; min-width: 0; }
.pn-chain li::before { content: ""; position: absolute; left: 28px; right: 0; top: 13px; height: 2px; background: var(--line); }
.pn-chain li:last-child::before { display: none; }
.pn-chain li.is-done::before { background: var(--teal); }
.pn-chain-dot { position: relative; z-index: 1; width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; font-size: var(--fs-xs); font-weight: 700; color: var(--muted); background: var(--card); border: 2px solid var(--line-strong); margin-bottom: 6px; }
.pn-chain-dot .pn-i { width: 14px; height: 14px; }
.pn-chain .is-done .pn-chain-dot { background: var(--teal); border-color: var(--teal); color: var(--on-solid); }
.pn-chain .is-now .pn-chain-dot { border-color: var(--warn); color: var(--warn-ink); box-shadow: 0 0 0 3px var(--warn-soft); }
.pn-chain .is-back .pn-chain-dot { background: var(--danger); border-color: var(--danger); color: var(--on-solid); }
.pn-chain-l { font-size: var(--fs-base); font-weight: 650; }
.pn-chain .is-now .pn-chain-l { color: var(--warn-ink); }
.pn-chain-w { font-size: var(--fs-sm); color: var(--muted); line-height: 1.35; }

.pn-rq-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: flex-end; }
.pn-rq-note { display: flex; flex-direction: column; gap: 4px; flex: 1 1 100%; order: 3; min-width: 0; margin: 0; font-size: var(--fs-sm); color: var(--muted); font-weight: 600; }
.pn-rq-note input { height: 36px; padding: 0 10px; border-radius: 8px; border: 1px solid var(--line-strong); background: var(--card); color: var(--fg); font: inherit; font-size: var(--fs-base); margin: 0; width: 100%; }
.pn-rq-sec { display: flex; flex-direction: column; gap: 10px; padding-top: 14px; border-top: 1px solid var(--line); }
.pn-sec-h { margin: 0; font-size: var(--fs-xs); font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.pn-facts { margin: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); gap: 12px 16px; }
.pn-fact dt { font-size: var(--fs-sm); color: var(--muted); font-weight: 600; }
.pn-fact dd { margin: 2px 0 0; font-size: var(--fs-md); font-weight: 600; overflow-wrap: anywhere; }
.pn-thread { display: flex; flex-direction: column; gap: 12px; }
.pn-msg { display: flex; gap: 10px; align-items: flex-start; }
.pn-msg .pn-av { width: 28px; height: 28px; font-size: var(--fs-2xs); }
.pn-msg-b { min-width: 0; flex: 1; }
.pn-msg-h { font-size: var(--fs-base); color: var(--fg-soft); }
.pn-msg-h b { color: var(--fg); font-weight: 650; }
.pn-msg-h span { margin-left: 8px; font-size: var(--fs-sm); color: var(--muted); }
.pn-msg p { margin: 2px 0 0; font-size: var(--fs-base); color: var(--fg-soft); }

/* form + payroll pages keep their markup; this lines them up with the inbox */
.pn-rq-page .ivy-form.ivy-flag { max-width: 640px; border-radius: 14px; border-color: var(--line); box-shadow: var(--shadow-sm); }
.pn-rq-page .ivy-back a { color: var(--teal); font-weight: 600; }

@media (max-width: 720px) {
  .pn-rq-split { grid-template-columns: minmax(0, 1fr); }
  .pn-rq-listpane { position: static; max-height: none; }
  .pn-rq-list { max-height: 420px; }
  .pn-rq-detail { min-height: 0; }
  .pn-rq-empty { padding: 40px 20px; }
}
@media (max-width: 720px) {
  .pn-rq-kinds { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; width: 100%; padding-bottom: 2px; }
  .pn-rq-kinds::-webkit-scrollbar { display: none; }
  .pn-rq-detail-in { padding: 16px; }
  .pn-chain { grid-auto-flow: row; grid-auto-columns: auto; gap: 10px; }
  .pn-chain li { display: grid; grid-template-columns: 26px minmax(0, 1fr); column-gap: 10px; padding: 0; }
  .pn-chain li::before { display: none; }
  .pn-chain-dot { grid-row: span 2; margin: 0; }
  .pn-rq-title { font-size: var(--fs-2xl); }
  .pn-rq-search { order: 0; }
}

/* ============================================================
   Applicants (#/applicants)
   ============================================================ */
.pn > .pn-seg, .pn > .pn-fchips { align-self: flex-start; max-width: 100%; }
.pn-seg a { color: var(--fg-soft); }
.pn-seg a.is-on { color: var(--fg); }
a.pn-fchip { text-decoration: none; }
a.pn-fchip.is-on .pn-bdot { box-shadow: 0 0 0 2px var(--card); }
.pn-kpis-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.pn-ap-kpi { color: inherit; transition: background 120ms; }
.pn-ap-kpi:hover { background: var(--surface-hover); }
.pn-ap-kpi .pn-kpi-f { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: block; }
.pn-ap-kpi.is-live .pn-kpi-v { color: var(--warn-ink); }

.pn-ap-list { background: var(--card); border: 1px solid var(--line); border-radius: 14px; box-shadow: var(--shadow-sm); overflow: hidden; }
.pn-ap-list > .pn-empty { border: 0; box-shadow: none; }
.pn-ap-row { display: grid; grid-template-columns: 34px minmax(180px, 1.4fr) minmax(150px, 1fr) minmax(150px, 1fr) minmax(130px, .8fr) 16px; gap: 14px; align-items: center; padding: 12px 18px; border-top: 1px solid var(--line); color: inherit !important; transition: background 120ms; }
.pn-ap-row:first-child { border-top: 0; }
.pn-ap-row:hover { background: var(--surface-hover); }
.pn-ap-row.is-closed { opacity: .6; }
.pn-ap-who, .pn-ap-stage, .pn-ap-route { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.pn-ap-who b { font-weight: 650; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pn-ap-stage { align-items: flex-start; }
.pn-ap-route { font-size: var(--fs-base); color: var(--fg-soft); }
.pn-ap-route .pn-sub { font-size: var(--fs-xs); text-transform: uppercase; letter-spacing: .05em; font-weight: 650; }
.pn-ap-phone { display: inline-flex; align-items: center; gap: 6px; font-size: var(--fs-base); color: var(--fg-soft); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pn-ap-phone .pn-i { width: 14px; height: 14px; color: var(--muted); }
.pn-ap-go { color: var(--muted); }

/* detail */
.pn-ap-dh { display: flex; gap: 16px; align-items: center; flex-wrap: wrap; }
.pn-ap-dh .pn-head-text { flex: 1 1 320px; }
.pn-ap-dh .pn-av.lg { width: 56px; height: 56px; font-size: var(--fs-xl); }
.pn-ap-contact { display: flex; flex-wrap: wrap; gap: 4px 16px; margin-top: 8px; font-size: var(--fs-base); color: var(--fg-soft); }
.pn-ap-contact span { display: inline-flex; align-items: center; gap: 6px; }
.pn-ap-contact .pn-i { width: 14px; height: 14px; color: var(--muted); }
.pn-ap-now { height: 28px; padding: 0 12px; font-size: var(--fs-base); }
.pn-applicants .pn-ap-steps { list-style: none; margin: 0; padding: 12px 14px; display: grid; grid-template-columns: repeat(11, minmax(0, 1fr)); gap: 4px; background: var(--card); border: 1px solid var(--line); border-radius: 12px; box-shadow: var(--shadow-sm); }
.pn-applicants .pn-ap-steps li { display: flex; flex-direction: column; gap: 6px; min-width: 0; margin: 0; padding: 0; border: 0; background: none; font-size: var(--fs-xs); font-weight: 600; color: var(--muted); }
.pn-applicants .pn-ap-steps li::before { content: ""; display: block; height: 6px; border-radius: 99px; background: var(--line); }
.pn-applicants .pn-ap-steps li span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pn-applicants .pn-ap-steps li.is-done::before { background: var(--teal); }
.pn-applicants .pn-ap-steps li.is-done { color: var(--fg-soft); }
.pn-applicants .pn-ap-steps li.is-current::before { background: var(--warn); }
.pn-applicants .pn-ap-steps li.is-current { color: var(--warn-ink); font-weight: 700; }
.pn-ap-grid { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(280px, 1fr); gap: 16px; align-items: start; }
.pn-ap-main, .pn-ap-side { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.pn-applicants .ivy-stack { display: flex; flex-direction: column; gap: 10px; }
.pn-applicants .ivy-flag { background: var(--card); border: 1px solid var(--line); border-radius: 14px; box-shadow: var(--shadow-sm); padding: 16px 18px; }
.pn-applicants .ivy-flag h3 { font-family: var(--font-display); font-size: var(--fs-lg); font-weight: 700; margin: 0 0 8px; }
.pn-applicants .ivy-form { display: flex; flex-direction: column; gap: 10px; }
.pn-applicants .ivy-form label { display: flex; flex-direction: column; gap: 4px; font-size: var(--fs-sm); font-weight: 600; color: var(--fg-soft); }
.pn-applicants .ivy-form input, .pn-applicants .ivy-form select { height: 38px; border-radius: 8px; border: 1px solid var(--line-strong); padding: 0 10px; font: inherit; font-size: var(--fs-md); background-color: var(--card); color: var(--fg); }
.pn-applicants .ivy-form input[type="file"] { height: auto; padding: 8px; }
.pn-applicants .ivy-form .btn { align-self: flex-start; }
.pn-applicants #next-step .ivy-form.ivy-flag:first-child { border-color: var(--teal-line); box-shadow: 0 0 0 3px var(--teal-soft); }
.pn-ap-facts .ivy-tone { margin: 0 0 6px; font-size: var(--fs-xs); font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--teal); }
.pn-applicants .ivy-quiet { margin: 4px 0; font-size: var(--fs-base); color: var(--fg-soft); }
.pn-applicants .out-of-range { margin: 4px 0; font-size: var(--fs-base); font-weight: 650; color: var(--danger-ink); }
.pn-applicants .pn-ap-events { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 0; }
.pn-applicants .pn-ap-events li { position: relative; display: flex; flex-direction: column; gap: 1px; padding: 0 0 12px 18px; margin: 0; border: 0; background: none; font-size: var(--fs-base); }
.pn-applicants .pn-ap-events li::before { content: ""; position: absolute; left: 2px; top: 6px; width: 8px; height: 8px; border-radius: 50%; background: var(--teal); }
.pn-applicants .pn-ap-events li::after { content: ""; position: absolute; left: 5px; top: 16px; bottom: 0; width: 2px; background: var(--line); }
.pn-applicants .pn-ap-events li:last-child::after { display: none; }
.pn-applicants .pn-ap-events em { font-style: normal; font-size: var(--fs-sm); color: var(--muted); }
.pn-applicants > .ivy-form.ivy-flag, .pn-applicants > form.ivy-flag { max-width: 640px; }
/* Online application: the answers on the applicant page, file buttons, and the Apply link & QR view */
.pn-applicants .pn-link { display: inline-flex; align-items: center; gap: 4px; border: 0; background: none; padding: 2px 0; color: var(--teal); font: inherit; font-weight: 650; cursor: pointer; text-decoration: underline; }
.pn-applicants .pn-link .pn-i { width: 14px; height: 14px; }
.pn-ap-app { display: flex; flex-direction: column; gap: 14px; }
.pn-ap-app section { display: flex; flex-direction: column; gap: 6px; }
.pn-ap-app section + section { border-top: 1px solid var(--line); padding-top: 12px; }
.pn-ap-app h3 { margin: 0; }
.pn-ap-app dl { margin: 0; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); gap: 3px 12px; font-size: var(--fs-base); }
.pn-ap-app dt { color: var(--muted); }
.pn-ap-app dd { margin: 0; color: var(--fg); overflow-wrap: anywhere; }
.pn-ap-app-item { display: flex; flex-direction: column; gap: 4px; padding: 8px 10px; border-radius: 10px; background: var(--surface-2, var(--bg)); }
.pn-ap-qr-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 14px; }
.pn-ap-qr { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; }
.pn-ap-qr img { width: 200px; height: 200px; max-width: 100%; border-radius: 8px; border: 1px solid var(--line); }
.pn-ap-url { font-size: var(--fs-sm); overflow-wrap: anywhere; color: var(--fg-soft); }
.pn-ap-qr-btns { display: flex; flex-wrap: wrap; gap: 8px; }
@media (max-width: 720px) { .pn-ap-app dl { grid-template-columns: minmax(0, 1fr); } .pn-ap-app dt { margin-top: 4px; } }
/* Interviews: the scheduling form, the interview card, and #/applicants?view=interviews */
.pn-ap-flash { display: flex; align-items: flex-start; gap: 8px; margin: 0; padding: 10px 14px; border-radius: 12px; background: var(--teal-soft); border: 1px solid var(--teal-line); color: var(--brand-ink, var(--fg)); font-size: var(--fs-base); }
.pn-ap-flash .pn-i { width: 16px; height: 16px; flex: 0 0 auto; margin-top: 2px; }
.pn-iv-when { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr) minmax(0, 1fr); gap: 10px; }
.pn-applicants .pn-iv-zone { margin-top: -4px; font-size: var(--fs-sm); }
.pn-applicants .ivy-form label[hidden] { display: none; }
.pn-applicants .ivy-form label.pn-iv-check { flex-direction: row; align-items: center; gap: 8px; font-size: var(--fs-base); color: var(--fg); }
.pn-applicants .ivy-form .pn-iv-check input { width: 18px; height: 18px; padding: 0; accent-color: var(--teal); }
.pn-applicants .pn-iv-reach { font-size: var(--fs-sm); }
.pn-iv-card .ivy-tone { margin: 0 0 4px; font-size: var(--fs-xs); font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--teal); }
.pn-iv-card.wait .ivy-tone { color: var(--warn-ink); }
.pn-applicants .pn-iv-card h3 { font-variant-numeric: tabular-nums; }
.pn-iv-more { border: 1px solid var(--line); border-radius: 14px; background: var(--card); box-shadow: var(--shadow-sm); }
.pn-iv-more > summary { cursor: pointer; padding: 12px 18px; font-weight: 650; color: var(--fg); list-style: none; display: flex; align-items: center; gap: 8px; }
.pn-iv-more > summary::-webkit-details-marker { display: none; }
.pn-iv-more > summary::before { content: "+"; display: inline-grid; place-items: center; width: 20px; height: 20px; border-radius: 6px; background: var(--surface-sunk); color: var(--fg-soft); font-weight: 700; }
.pn-iv-more[open] > summary::before { content: "–"; }
.pn-applicants .pn-iv-more > .ivy-flag { border: 0; box-shadow: none; border-top: 1px solid var(--line); border-radius: 0 0 14px 14px; }
.pn-iv-week { display: grid; grid-template-columns: 34px repeat(7, minmax(0, 1fr)) 34px; gap: 6px; align-items: stretch; }
.pn-iv-nav { display: grid; place-items: center; border-radius: 10px; color: var(--fg-soft) !important; border: 1px solid var(--line); background: var(--card); }
.pn-iv-nav:hover { background: var(--surface-hover); }
.pn-iv-nav .pn-i { width: 16px; height: 16px; }
.pn-iv-day { display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 8px 4px; border-radius: 12px; border: 1px solid var(--line); background: var(--card); color: var(--fg) !important; text-decoration: none; min-width: 0; }
.pn-iv-day b { font-size: var(--fs-lg); font-variant-numeric: tabular-nums; }
.pn-iv-day .pn-iv-n { min-height: 18px; font-size: var(--fs-xs); font-weight: 700; color: var(--muted); }
.pn-iv-day.has .pn-iv-n { display: inline-grid; place-items: center; min-width: 20px; padding: 0 6px; border-radius: 9px; background: var(--teal); color: var(--on-solid); }
.pn-iv-day.is-today { border-color: var(--teal-line); box-shadow: 0 0 0 2px var(--teal-soft); }
.pn-iv-day.is-on, .pn-iv-cell.is-on { background: var(--teal-soft); border-color: var(--teal); }
.pn-iv-day:hover, .pn-iv-cell:hover { background: var(--surface-hover); }
.pn-iv-month { background: var(--card); border: 1px solid var(--line); border-radius: 14px; box-shadow: var(--shadow-sm); padding: 12px; }
.pn-iv-mhead { display: grid; grid-template-columns: 34px 1fr 34px; align-items: center; text-align: center; margin-bottom: 8px; }
.pn-iv-mhead .pn-iv-nav { height: 34px; }
.pn-iv-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 4px; }
.pn-iv-dow { font-size: var(--fs-xs); font-weight: 650; color: var(--muted); text-align: center; text-transform: uppercase; letter-spacing: .04em; padding-bottom: 2px; }
.pn-iv-cell { position: relative; display: flex; flex-direction: column; gap: 2px; min-height: 78px; min-width: 0; padding: 6px; border-radius: 10px; border: 1px solid var(--line); color: var(--fg) !important; text-decoration: none; overflow: hidden; }
.pn-iv-cell.is-out { opacity: .45; }
.pn-iv-cell.is-today .pn-iv-dnum { background: var(--teal); color: var(--on-solid); }
.pn-iv-dnum { align-self: flex-start; display: inline-grid; place-items: center; min-width: 22px; height: 22px; padding: 0 4px; border-radius: 11px; font-size: var(--fs-sm); font-weight: 700; font-variant-numeric: tabular-nums; }
.pn-iv-pill { font-size: var(--fs-xs); padding: 1px 6px; border-radius: 6px; background: var(--info-soft); color: var(--info-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pn-iv-pill.is-done { background: var(--surface-sunk); color: var(--muted); }
.pn-iv-more-n { font-size: var(--fs-xs); color: var(--muted); font-weight: 650; }
.pn-iv-dot { display: none; }
.pn-iv-dayline { margin: 0; }
.pn-iv-list { display: flex; flex-direction: column; gap: 8px; }
.pn-iv-h { margin: 8px 0 0; font-size: var(--fs-md); font-weight: 700; color: var(--fg); display: flex; align-items: center; gap: 8px; }
.pn-iv-h span { display: inline-grid; place-items: center; min-width: 22px; height: 20px; padding: 0 6px; border-radius: 10px; background: var(--surface-sunk); border: 1px solid var(--line); font-size: var(--fs-xs); color: var(--fg-soft); }
.pn-iv-h.is-late { color: var(--warn-ink); }
.pn-iv-row { display: grid; grid-template-columns: 92px 34px minmax(160px, 1.4fr) minmax(140px, 1fr) 16px; gap: 14px; align-items: center; padding: 12px 18px; border-top: 1px solid var(--line); color: inherit !important; text-decoration: none; }
.pn-iv-row:first-child { border-top: 0; }
.pn-iv-row:hover { background: var(--surface-hover); }
.pn-iv-row.is-done { opacity: .6; }
.pn-iv-time { display: flex; flex-direction: column; gap: 1px; font-variant-numeric: tabular-nums; }
.pn-iv-time b { font-weight: 700; white-space: nowrap; }
.pn-iv-where { display: flex; flex-direction: column; gap: 2px; min-width: 0; font-size: var(--fs-base); color: var(--fg-soft); }
.pn-iv-outlook { display: flex; flex-direction: column; gap: 10px; }
.pn-iv-feed { display: flex; flex-direction: column; gap: 6px; padding: 10px 12px; border-radius: 10px; background: var(--surface-2, var(--bg)); border: 1px solid var(--line); }
.pn-iv-steps { margin: 0; padding-left: 20px; display: flex; flex-direction: column; gap: 4px; font-size: var(--fs-base); color: var(--fg-soft); }
@media (max-width: 720px) {
  .pn-iv-when { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .pn-iv-when label:first-child { grid-column: 1 / -1; }
  .pn-iv-week { grid-template-columns: 26px repeat(7, minmax(0, 1fr)) 26px; gap: 3px; }
  .pn-iv-day { padding: 6px 0; border-radius: 10px; }
  .pn-iv-day b { font-size: var(--fs-md); }
  .pn-iv-month { padding: 8px; }
  .pn-iv-grid { gap: 2px; }
  .pn-iv-cell { min-height: 46px; padding: 3px; align-items: center; }
  .pn-iv-pill, .pn-iv-more-n { display: none; }
  .pn-iv-dot { display: inline-grid; place-items: center; min-width: 18px; height: 16px; padding: 0 4px; border-radius: 8px; background: var(--teal); color: var(--on-solid); font-size: var(--fs-2xs); font-weight: 700; }
  .pn-iv-dnum { align-self: center; }
  .pn-iv-row { grid-template-columns: 76px minmax(0, 1fr) 16px; gap: 4px 10px; padding: 12px 14px; }
  .pn-iv-time .pn-sub { font-size: var(--fs-xs); }
  .pn-iv-row .pn-av { display: none; }
  .pn-iv-time { grid-row: 1 / span 2; }
  .pn-iv-row .pn-ap-who { grid-column: 2; grid-row: 1; }
  .pn-iv-where { grid-column: 2; grid-row: 2; font-size: var(--fs-sm); }
  .pn-iv-row .pn-ap-go { grid-column: 3; grid-row: 1 / span 2; }
}
/* Background check step: the signed consent, then the result */
.pn-applicants #next-step .pn-ap-bg:first-child { border-color: var(--teal-line); box-shadow: 0 0 0 3px var(--teal-soft); }
.pn-ap-bg { display: flex; flex-direction: column; gap: 10px; }
.pn-ap-consent { display: flex; flex-direction: column; gap: 6px; padding: 10px 12px; border-radius: 10px; background: var(--surface-2, var(--bg)); }
.pn-ap-consent-on, .pn-ap-consent-off { display: flex; gap: 8px; align-items: flex-start; margin: 0; font-weight: 650; font-size: var(--fs-md); }
.pn-ap-consent-on .pn-i { color: var(--ok, var(--teal)); flex: none; margin-top: 2px; }
.pn-ap-consent-off .pn-i { color: var(--warn-ink); flex: none; margin-top: 2px; }
.pn-ap-consent-btns { display: flex; flex-wrap: wrap; gap: 8px; align-items: flex-end; }
.pn-ap-consent-how { display: flex; flex-direction: column; gap: 4px; font-size: var(--fs-sm); font-weight: 600; color: var(--fg-soft); min-width: 0; }
.pn-ap-consent-how select { height: 38px; border-radius: 8px; border: 1px solid var(--line-strong); padding: 0 10px; font: inherit; font-size: var(--fs-md); background-color: var(--card); color: var(--fg); max-width: 100%; }
.pn-applicants .ivy-flag label.pn-ap-upload { position: relative; cursor: pointer; display: inline-flex; flex-direction: row; align-items: center; gap: 6px; }
.pn-ap-upload input { position: absolute; inset: 0; opacity: 0; cursor: pointer; width: 100%; }


@media (max-width: 1100px) {
  .pn-ap-row { grid-template-columns: 34px minmax(0, 1.4fr) minmax(0, 1fr) minmax(0, 1fr) 16px; }
  .pn-ap-phone { display: none; }
  .pn-ap-grid { grid-template-columns: minmax(0, 1fr); }
  .pn-kpis-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .pn-kpis-3 .pn-kpi:nth-child(3) { border-left: 1px solid var(--line); }
  .pn-kpis-3 .pn-kpi:nth-child(n+3) { border-top: 0; }
}
@media (max-width: 720px) {
  .pn-ap-row { grid-template-columns: 34px minmax(0, 1fr) 16px; gap: 6px 12px; padding: 12px 14px; }
  .pn-ap-who { grid-column: 2; grid-row: 1; }
  .pn-ap-stage { grid-column: 2; grid-row: 2; flex-direction: row; align-items: center; gap: 8px; }
  .pn-ap-route { display: none; }
  .pn-ap-go { grid-column: 3; grid-row: 1 / span 2; }
  .pn-kpis-3 { grid-template-columns: minmax(0, 1fr); }
  .pn-kpis-3 .pn-kpi { border-left: 0 !important; }
  .pn-kpis-3 .pn-kpi + .pn-kpi { border-top: 1px solid var(--line); }
  .pn-ap-kpi { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; column-gap: 10px; }
  .pn-ap-kpi .pn-kpi-v { grid-column: 2; grid-row: 1 / span 2; margin: 0; }
  .pn-toolbar .pn-ap-nav { width: 100%; overflow-x: auto; }
  .pn-ap-buildings { flex-wrap: nowrap; overflow-x: auto; width: 100%; }
  .pn-applicants .pn-ap-steps { display: flex; overflow-x: auto; scrollbar-width: none; }
  .pn-applicants .pn-ap-steps li { flex: 0 0 76px; }
}

/* Existing buttons inside the People pages, in the new button look. */
.pn-applicants .btn, .pn-rq-page .btn, .pn-tickets .button { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: var(--ctl-h); padding: 0 var(--ctl-px); border-radius: var(--r-sm); font: inherit; font-size: var(--fs-base); font-weight: 600; box-shadow: var(--shadow-sm); text-transform: none; letter-spacing: 0; height: var(--ctl-h); box-sizing: border-box; }
.pn-applicants .btn-cta, .pn-rq-page .btn-cta, .pn-tickets .button-primary { background: var(--teal); border: 1px solid var(--teal); color: var(--on-solid); }
.pn-applicants .btn-cta:hover, .pn-rq-page .btn-cta:hover, .pn-tickets .button-primary:hover { background: var(--teal-deep); border-color: var(--teal-deep); }
.pn-applicants .btn-secondary, .pn-rq-page .btn-secondary, .pn-tickets .button-ghost { background: var(--card); border: 1px solid var(--line); color: var(--fg); }
.pn-applicants .btn-secondary:hover, .pn-rq-page .btn-secondary:hover, .pn-tickets .button-ghost:hover { background: var(--surface-hover); }
.pn-tickets .button[disabled] { opacity: 1; cursor: default; }

/* ============================================================
   Tickets (#/tickets)
   ============================================================ */
.pn-tickets .audit-chip-row .chip { height: 32px; padding: 0 12px; border-radius: 999px; border: 1px solid var(--line-strong); background: var(--card); color: var(--fg-soft); font-size: var(--fs-base); font-weight: 600; }
.pn-tickets .audit-chip-row .chip.chip-active { background: var(--fg); border-color: var(--fg); color: var(--card); }
.pn-tickets .tk-fac-filter { height: 34px; border-radius: 8px; border: 1px solid var(--line-strong); font-size: var(--fs-base); }
.pn-tickets .card { background: var(--card); border: 1px solid var(--line); border-radius: 14px; box-shadow: var(--shadow-sm); }
.pn-tickets .tk-card { padding: 0; }
.pn-tickets .tk-table { width: 100%; border-collapse: collapse; }
.pn-tickets .tk-table th { background: var(--surface-2); color: var(--muted); font-size: var(--fs-xs); font-weight: 650; letter-spacing: .05em; text-transform: uppercase; text-align: left; padding: 11px 16px; border-bottom: 1px solid var(--line); }
.pn-tickets .tk-table td { padding: 13px 16px; border-bottom: 1px solid var(--line); font-size: var(--fs-base); color: var(--fg-soft); vertical-align: middle; }
.pn-tickets .tk-table tr:last-child td { border-bottom: 0; }
.pn-tickets .tk-table tr.is-clickable { cursor: pointer; }
.pn-tickets .tk-table tr.is-clickable:hover td { background: var(--surface-hover); }
.pn-tickets .tk-table .tk-sub { color: var(--fg); font-weight: 650; }
.pn-tickets .badge { letter-spacing: 0; border: 1px solid var(--line); }
.pn-tickets .badge::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.pn-tickets .badge-warn { background: var(--warn-soft); color: var(--warn-ink); border-color: var(--warn-line); }
.pn-tickets .badge-ok { background: var(--ok-soft); color: var(--ok-ink); border-color: var(--ok-line); }
.pn-tickets .badge-info { background: var(--teal-soft); color: var(--brand-ink); border-color: var(--teal-line); }
.pn-tickets .badge-gold { background: var(--info-soft); color: var(--info-ink); border-color: var(--info-soft); }
.pn-tickets article.card { padding: 20px 22px; margin-bottom: 16px; }
.pn-tickets article.card h3 { font-family: var(--font-display); font-size: var(--fs-2xl); font-weight: 700; }
.pn-tickets .tk-desc { font-size: var(--fs-lead); color: var(--fg); }
.pn-tickets .tk-meta span + span::before { content: "·"; margin-right: 10px; color: var(--line-strong); }
.pn-tickets .tk-meta { gap: 6px 10px; }
.pn-tickets .tk-note { border-top: 0; padding: 10px 12px; border-radius: 10px; background: var(--surface-2); border: 1px solid var(--line); }
.pn-tickets textarea, .pn-tickets input[type="text"], .pn-tickets input[type="email"], .pn-tickets input[type="tel"], .pn-tickets input[type="url"], .pn-tickets select { border-radius: 8px; border-color: var(--line-strong); }

@media (max-width: 720px) {
  .pn-tickets .tk-table thead { display: none; }
  .pn-tickets .tk-table, .pn-tickets .tk-table tbody { display: block; }
  .pn-tickets .tk-table tr { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 6px 12px; padding: 14px 16px; border-bottom: 1px solid var(--line); }
  .pn-tickets .tk-table tr:last-child { border-bottom: 0; }
  .pn-tickets .tk-table td { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; padding: 0; border: 0; font-size: var(--fs-base); }
  .pn-tickets .tk-table td.tk-sub { grid-column: 1 / -1; font-size: var(--fs-lead); }
  .pn-tickets .tk-table td[data-label]::before { content: attr(data-label); font-size: var(--fs-xs); font-weight: 650; color: var(--muted); text-transform: uppercase; letter-spacing: .05em; }
  .pn-tickets .tk-card { overflow: visible !important; }
  .pn-tickets .tk-toolbar .tk-fac-filter { width: 100%; }
}
.page-shell.pn-tickets .page-actions .button-primary { background: var(--teal); border-color: var(--teal); color: var(--on-solid); white-space: nowrap; }
.page-shell.pn-tickets .page-actions .button-primary:hover { background: var(--teal-deep); }