
:root{
  --bg:#F7F7F5;--surface:#FFFFFF;--s2:#F2F2EF;--border:#E4E4E0;--border2:#EBEBEA;
  --text:#1C1C1A;--t2:#5A5A56;--t3:#9A9A94;
  --green:#1B9E72;--gl:#E3F5EE;--gb:#A8E0C8;--gd:#0D6B4C;
  --pink:#C94F78;--pl:#FAEDF2;--pb:#EAAFC4;
  --blue:#3478C7;--bl:#EAF1FB;--bb:#A8C8EE;
  --red:#D94040;--rl:#FBEAEA;--rb:#ECAAAA;
  --amber:#B87010;--al:#FBF1E0;--ab:#E8C070;
  --purple:#7C4DB8;--purl:#F2EDFB;--purb:#C9B0E8;
  --white:#FFFFFF;
  --pf-dark:var(--pf-dark);--amber-dark:#7A5200;
  --av-grad-a:#B0C4F0;--av-grad-b:#7B9DD9;--av-grad-text:#1A3A6E;
  --nav-av-a:#9B59B6;--nav-av-b:#5B8AF0;
  --btn-blue-hover:#2563b0;
  --bd:#1A4F8A;
  --nw:252px;--r:10px;--rs:7px;
  --sh:0 1px 3px rgba(0,0,0,.07),0 1px 2px rgba(0,0,0,.04);
  --shm:0 4px 16px rgba(0,0,0,.09),0 2px 4px rgba(0,0,0,.05);
  --shl:0 12px 40px rgba(0,0,0,.18),0 4px 12px rgba(0,0,0,.08);
  --font:'DM Sans',system-ui,sans-serif;--mono:'DM Mono',monospace;
  /* ── Extended colour tokens ─────────────────────────────────── */
  --muted:#888888;
  --orange:#E07020;
  --red-dark:#6B1414;
  --career-dark:#1A1A2E;
  /* ODC archetype accent colours (F1–F4, M1–M4) */
  --arch-f1:#2E7D6E;--arch-f2:#4A6B2E;--arch-f3:#4B5DA8;--arch-f3-lt:#C7D0F8;
  --arch-m2:#2E6B8B;--arch-m3:#8B4DB8;--arch-m3-mid:#7B5EA7;--arch-m4:#6B4A2E;
  /* ── One-off semantic tokens ──────────────────────────────── */
  --match-good:#2E86AB;
  --green-light:#26C490;
  --green-pale:#E8F5E9;--green-pale-b:#A5D6A7;
  --amber-pale:#FFF8E6;--amber-dark-text:#5A3500;
  --red-pale:#FFF4F4;
  --green-icon:#1B7A56;--green-icon-dk:#1B5E3B;
  --hrbp-bg:#F3EEF9;--hrbp-border:#C4A8E0;
  --purple-text:#4A2B8A;--purple-border-lt:#C4B5FD;
  --lena-col:#6C8EBF;
}

/* ── Focus visible — WCAG 2.1 AA ─────────────────────────────
   Uses :focus-visible so keyboard users get clear focus rings
   without affecting mouse users.
   ─────────────────────────────────────────────────────────── */
:focus-visible{outline:2px solid var(--blue);outline-offset:2px;border-radius:2px;}
button:focus-visible{outline:2px solid var(--blue);outline-offset:2px;}
a:focus-visible{outline:2px solid var(--blue);outline-offset:2px;}
input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--blue);outline-offset:0;border-color:var(--blue);}
.ni:focus-visible{outline:2px solid var(--blue);outline-offset:-2px;}
/* ── Scenario Guide ─────────────────────────────────────────── */
#scenario-guide{position:fixed;bottom:20px;right:20px;z-index:9500;width:300px;background:var(--surface);border:1.5px solid var(--bb);border-radius:var(--r);box-shadow:var(--shl);overflow:hidden;display:flex;flex-direction:column;transition:box-shadow .25s;}
#scenario-guide.sg-expanded{top:20px;bottom:auto;max-height:calc(100vh - 40px);}
.sg-header{background:var(--blue);color:#fff;padding:10px 14px;display:flex;align-items:center;gap:9px;cursor:pointer;user-select:none;transition:background .15s;flex-shrink:0;}
.sg-header:hover{background:var(--btn-blue-hover);}
.sg-title{font-size:13px;font-weight:700;flex:1;}
.sg-body{padding:14px 14px 0 14px;overflow-y:auto;flex:1;}
.sg-footer{padding:10px 14px 14px 14px;flex-shrink:0;border-top:1px solid var(--border2);background:var(--surface);}
.sg-step{display:flex;align-items:flex-start;gap:9px;padding:8px 0;border-bottom:1px solid var(--border2);}
.sg-step:last-child{border-bottom:none;}
.sg-num{width:22px;height:22px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;flex-shrink:0;margin-top:1px;}
.sg-num.done{background:var(--green);color:#fff;}
.sg-num.active{background:var(--blue);color:#fff;}
.sg-num.pending{background:var(--border2);color:var(--t3);}
.sg-step-text{font-size:12px;line-height:1.5;}
.sg-step-text.done{color:var(--t3);text-decoration:line-through;}
.sg-step-text.active{color:var(--text);font-weight:600;}
.sg-step-text.pending{color:var(--t3);}
.sg-action-btn{margin-top:8px;width:100%;font-size:12px;padding:7px 12px;display:flex;align-items:center;justify-content:center;gap:6px;background:var(--blue);color:#fff;border:none;border-radius:var(--rs);cursor:pointer;font-weight:600;transition:background .15s;}
.sg-action-btn:hover{background:var(--btn-blue-hover);}
/* Login screen: highlight Sophie Roos */

.mw-arch-card{border:2px solid var(--border);border-radius:var(--r);padding:12px 8px;cursor:pointer;transition:all .15s;text-align:center;position:relative;background:var(--surface);}
.mw-arch-card:hover:not(.disabled){border-color:var(--bb);background:var(--bl);}
.mw-arch-card.selected{border-color:var(--blue);background:var(--bl);}
.mw-arch-card.selected::after{content:'✓';position:absolute;top:5px;right:7px;font-size:11px;font-weight:700;color:var(--blue);}
.mw-arch-card.auto-sel{border-color:var(--amber);background:var(--al);cursor:default;}
.mw-arch-card.auto-sel::after{content:'AUTO';position:absolute;top:4px;right:5px;font-size:8px;font-weight:700;color:var(--amber);background:var(--al);border-radius:3px;padding:1px 3px;}
.mw-arch-card.disabled{opacity:.25;cursor:default;filter:grayscale(.7);}
.mw-arch-img{width:44px;height:44px;border-radius:50%;margin:0 auto 7px;background:var(--s2);display:flex;align-items:center;justify-content:center;}
.mw-arch-name{font-size:11px;font-weight:600;line-height:1.3;}
.mw-arch-id{font-size:10px;color:var(--t3);margin-top:2px;}
.mw-substep{display:flex;align-items:center;gap:5px;padding:5px 13px;border-radius:20px;font-size:12px;font-weight:500;background:var(--s2);color:var(--t3);}
.mw-substep.active{background:var(--text);color:var(--bg);font-weight:700;}
.mw-substep.done{background:var(--blue);color:#fff;font-weight:600;}
.mw-substep.done::before{content:'✓ ';}
.mw-comp-card{border:2px solid var(--border);border-radius:var(--rs);padding:11px 13px;cursor:pointer;transition:all .15s;position:relative;background:var(--surface);}
.mw-comp-card:hover{border-color:var(--bb);background:var(--bl);}
.mw-comp-card.selected{border-color:var(--green);background:var(--gl);}
.mw-comp-card.selected::after{content:'✓';position:absolute;top:6px;right:8px;font-size:13px;font-weight:700;color:var(--green);}
.mw-comp-arch-tag{display:inline-flex;align-items:center;padding:2px 8px;border-radius:10px;font-size:10px;font-weight:700;margin-bottom:5px;}
.mw-comp-text{font-size:11px;color:var(--text);line-height:1.5;}
.mw-pbar{height:6px;border-radius:3px;background:var(--border2);overflow:hidden;}
.mw-pbar-fill{height:100%;border-radius:3px;transition:width .35s;}
.mw-step-num{width:26px;height:26px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;flex-shrink:0;}
.mw-step-num.done{background:var(--green);color:#fff;}
.mw-step-num.active{background:var(--text);color:var(--bg);}
.mw-step-num.pending{background:var(--border2);color:var(--t3);}
.mw-step-lbl{font-size:13px;}
.mw-step-lbl.done{color:var(--green);}
.mw-step-lbl.active{color:var(--text);font-weight:700;}
.mw-step-lbl.pending{color:var(--t3);}

/* ── Material Icons sizing ───────────────────────────────── */
.material-icons{
  font-family:'Material Icons';
  font-weight:normal;
  font-style:normal;
  font-size:18px;
  line-height:1;
  letter-spacing:normal;
  text-transform:none;
  display:inline-block;
  white-space:nowrap;
  word-wrap:normal;
  direction:ltr;
  -webkit-font-smoothing:antialiased;
  vertical-align:middle;
}
/* Size variants used in icon containers */
.ni-icon .material-icons{font-size:20px;}
.uav-btn .material-icons, .udd-av .material-icons{font-size:16px;}
.bell-wrap .material-icons{font-size:20px;}
.nav-toggle .material-icons{font-size:18px;}
.btn .material-icons{font-size:15px;}
.badge .material-icons{font-size:12px;}

body{font-family:var(--font);background:var(--bg);color:var(--text);min-height:100vh;-webkit-font-smoothing:antialiased;}
.nav{width:var(--nw);background:var(--surface);border-right:1px solid var(--border);display:flex;flex-direction:column;height:100vh;position:sticky;top:0;flex-shrink:0;overflow-y:auto;overflow-x:hidden;transition:width .25s cubic-bezier(.4,0,.2,1);}

/* ── Collapsed state ─────────────────────────────────────── */
.nav.collapsed{width:56px;}

/* Hide text elements — use max-width transition so text fades out cleanly */
.nav-logo-name,
.ni-lbl,
.ni-badge,
.nav-sec,
.nav-un,
.nav-ur{max-width:220px;transition:max-width .2s ease, opacity .15s ease;}

.nav.collapsed .nav-logo-name,
.nav.collapsed .ni-lbl,
.nav.collapsed .ni-badge,
.nav.collapsed .nav-sec,
.nav.collapsed .nav-un,
.nav.collapsed .nav-ur{max-width:0;opacity:0;overflow:hidden;white-space:nowrap;}

/* Logo bar — always show toggle button centred when collapsed */
.nav-logo{padding:0 12px;height:56px;display:flex;align-items:center;gap:10px;border-bottom:1px solid var(--border2);flex-shrink:0;}
.nav-logo-mark{flex-shrink:0;display:flex;align-items:center;justify-content:center;}

/* Collapsed nav-logo: hide the SVG logo, centre the toggle button and make it fill the bar */
.nav.collapsed .nav-logo{padding:0;justify-content:center;gap:0;}
.nav.collapsed .nav-logo-mark{display:none;}
.nav.collapsed .nav-logo-name{display:none;}

/* Toggle button — expanded state */
.nav-toggle{
  margin-left:auto;
  width:30px;height:30px;
  border:1px solid var(--border2);
  background:var(--s2);
  cursor:pointer;
  color:var(--t2);
  border-radius:6px;
  display:flex;align-items:center;justify-content:center;
  flex-shrink:0;
  transition:color .15s, background .15s, width .25s, height .25s, border-radius .25s;
  opacity:1 !important;
  visibility:visible !important;
}
.nav-toggle:hover{background:var(--s2);color:var(--text);border-color:var(--border);}

/* Collapsed: toggle fills the entire 56×56 header bar — easy to click, acts as expand button */
.nav.collapsed .nav-toggle{
  margin:0;
  width:56px;
  height:56px;
  border:none;
  border-radius:0;
  background:transparent;
  color:var(--t2);
}
.nav.collapsed .nav-toggle:hover{background:var(--s2);color:var(--text);}

/* Hide section headers and subtitles when collapsed */
.nav.collapsed .nav-sec{display:none;}
.nav.collapsed .ni-sub{display:none;}

/* Nav items wrapper: remove horizontal padding when collapsed so items can centre */
.nav.collapsed .nav-items-wrap{padding-left:0 !important;padding-right:0 !important;}

/* Nav items — icon centred, fixed width */
.ni{display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:var(--rs);cursor:pointer;margin:1px 6px;transition:background .15s;user-select:none;min-height:46px;}
.ni:hover{background:var(--s2);}
.ni.active{background:var(--s2);position:relative;}
/* Collapsed: full width of the 56px nav, icon perfectly centred */
.nav.collapsed .ni{
  justify-content:center;
  padding:0;
  margin:1px 4px;
  height:44px;
  gap:0;
  width:calc(56px - 8px);
}

/* Icon — fixed size, never shrinks */
.ni-icon{width:32px;height:32px;border-radius:8px;display:flex;align-items:center;justify-content:center;flex-shrink:0;color:var(--t2);}
.ni-icon .material-icons{font-size:20px;}
.ni.active .ni-icon{color:var(--text);}
.ni-txt{display:flex;flex-direction:column;gap:1px;flex:1;min-width:0;overflow:hidden;}
.ni-lbl{font-size:13.5px;font-weight:500;color:var(--t2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.ni.active .ni-lbl{color:var(--text);font-weight:600;}
.ni-sub{font-size:11.5px;color:var(--t3);overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;line-height:1.35;}
.nav.collapsed .ni-txt{display:none;}
.ni-badge{margin-left:auto;min-width:18px;height:18px;border-radius:9px;background:var(--green);color:#fff;font-size:10px;font-weight:700;display:flex;align-items:center;justify-content:center;padding:0 5px;flex-shrink:0;}
.nav.collapsed .ni-badge{display:none;}

/* Nav section headers */
.nav-sec{padding:16px 14px 4px;font-size:11px;font-weight:700;letter-spacing:.07em;color:var(--t3);text-transform:uppercase;}

/* Bottom user area */
.nav-bot{margin-top:auto;padding:9px;border-top:1px solid var(--border2);}
.nav-user{display:flex;align-items:center;gap:8px;padding:7px 5px;}
.nav.collapsed .nav-user{justify-content:center;padding:7px 0;}
.nav.collapsed .nav-bot{padding:9px 4px;}
.nav-av{width:29px;height:29px;border-radius:50%;background:linear-gradient(135deg,var(--nav-av-a),var(--nav-av-b));display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;color:var(--white);flex-shrink:0;}
.nav-un{font-size:12px;font-weight:600;color:var(--text);}
.nav-ur{font-size:11px;color:var(--t3);}

/* ── Tooltips for collapsed items ──────────────────────── */
.nav.collapsed .ni{position:relative;}
.nav.collapsed .ni:hover::after{
  content:attr(data-lbl);
  position:absolute;
  left:calc(100% + 8px);
  top:50%;transform:translateY(-50%);
  background:var(--text);color:var(--surface);
  font-size:12px;font-weight:500;
  padding:5px 10px;border-radius:var(--rs);
  white-space:nowrap;z-index:800;pointer-events:none;
  box-shadow:0 2px 10px rgba(0,0,0,.18);
}
.main{flex:1;overflow-y:auto;display:flex;flex-direction:column;}
.topbar{height:56px;background:var(--surface);border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;padding:0 24px;position:sticky;top:0;z-index:50;flex-shrink:0;}
/* Breadcrumb — matches design doc: underlined links, chevron separator, bold current */
.bc{display:flex;align-items:center;gap:4px;font-size:13px;color:var(--t2);}
.bc .sep{color:var(--t3);display:flex;align-items:center;}
.bc .sep .material-icons{font-size:16px;}
.bc .cur{font-weight:700;color:var(--text);text-decoration:none;cursor:default;}
.topbar-r{display:flex;align-items:center;gap:10px;}

/* --- Dark mode --- */
body.dark{
  --bg:#1A1A18;--surface:#242422;--s2:#2C2C2A;--border:#3A3A36;--border2:#323230;
  --text:#F0F0EC;--t2:#A8A8A0;--t3:#6A6A64;
  --green:#2DC98E;--gl:#0D2E22;--gb:#1A5A3C;--gd:#5AC99A;
  --pink:#E07A9D;--pl:#2E1020;--pb:#6B2540;
  --blue:#5A9EE8;--bl:#0D1E38;--bb:#1A4A7A;
  --red:#EF6565;--rl:#2E0D0D;--rb:#6B1A1A;
  --amber:#D4920A;--al:#2A1C08;--ab:#6B4510;
  --purple:#A07AD8;--purl:#1E1030;--purb:#4A2A7A;
  --pf-dark:#EF8080;--amber-dark:#E8A840;
  --btn-blue-hover:#4A8EDA;
  /* Extended tokens — dark mode adaptations */
  --muted:#6A6A64;
  --orange:#E8842A;
  --blue-darker:#2A6AB8;
  --red-dark:#EF8080;
  --career-dark:#0A0A18;
  --match-good:#5AACE8;
  --green-light:#2DC98E;
  --green-pale:#0D2E22;--green-pale-b:#1A5A3C;
  --amber-pale:#2A1C08;--amber-dark-text:#E8A840;
  --red-pale:#2E0D0D;
  --green-icon:#5AC99A;--green-icon-dk:#2DC98E;
  --hrbp-bg:#1E1030;--hrbp-border:#4A2A7A;
  --purple-text:#C9B0E8;--purple-border-lt:#4A2A7A;
  --lena-col:#5A8EBF;
  /* Archetype colours — slightly lighter for dark bg legibility */
  --arch-f1:#3A9E8A;--arch-f2:#5A8A3A;--arch-f3:#6A7DC8;--arch-f3-lt:#2A3A68;
  --arch-f4-dkr:#8B2A50;
  --arch-m2:#3A8BAB;--arch-m3:#A06AD8;--arch-m3-mid:#8A7AB8;--arch-m4:#8B6A3A;
}

/* --- NEW: User avatar button --- */
.user-wrap{position:relative;}
.uav-btn{width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,var(--av-grad-a),var(--av-grad-b));display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;color:var(--av-grad-text);cursor:pointer;box-shadow:0 0 0 2px var(--border);transition:box-shadow .15s;flex-shrink:0;user-select:none;overflow:hidden;}
.uav-btn:hover{box-shadow:0 0 0 2px var(--t3);}
.uav-btn img{width:100%;height:100%;object-fit:cover;border-radius:50%;}
.user-dd{position:absolute;top:46px;right:0;width:280px;background:var(--surface);border:1px solid var(--border);border-radius:16px;box-shadow:var(--shl);z-index:400;display:none;overflow:hidden;}
.user-dd.open{display:block;}
.udd-hdr{padding:16px 18px;display:flex;align-items:center;gap:12px;border-bottom:1px solid var(--border2);}
.udd-av{width:42px;height:42px;border-radius:50%;background:linear-gradient(135deg,var(--av-grad-a),var(--av-grad-b));display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700;color:var(--av-grad-text);flex-shrink:0;overflow:hidden;}
.udd-av img{width:100%;height:100%;object-fit:cover;border-radius:50%;}
.udd-nm{font-size:15px;font-weight:600;color:var(--text);line-height:1.25;}
.udd-em{font-size:12px;color:var(--t3);margin-top:2px;}
.udd-sec{padding:10px 18px 4px;font-size:10px;font-weight:700;letter-spacing:.08em;color:var(--t3);text-transform:uppercase;}
.udd-mi{display:flex;align-items:center;justify-content:space-between;padding:12px 18px;cursor:pointer;font-size:15px;font-weight:400;color:var(--text);transition:background .1s;line-height:1.3;}
.udd-mi:hover{background:var(--bg);}
.udd-mi.danger{color:var(--text);border-top:1px solid var(--border2);padding-top:14px;padding-bottom:14px;font-weight:400;}
.udd-mi.danger:hover{background:var(--bg);}
.udd-mi-arr{color:var(--t2);display:flex;align-items:center;}

/* --- Vacancy Summary Panel (inline slide-down in Job match) --- */
.vac-sum-panel{display:none;border-top:1px solid var(--border2);margin-top:14px;padding-top:16px;animation:fu .18s ease;}
.vac-sum-panel.open{display:block;}
.vac-sum-hdr{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:14px;padding-bottom:12px;border-bottom:1px solid var(--border2);}
.vac-sum-title{font-size:16px;font-weight:700;color:var(--text);margin-bottom:3px;}
.vac-sum-meta{font-size:12px;color:var(--t2);line-height:1.6;}
.vac-sum-close{width:26px;height:26px;border-radius:50%;border:none;background:var(--bg);cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--t2);flex-shrink:0;transition:background .12s;}
.vac-sum-close:hover{background:var(--s2);color:var(--text);}
.vac-sum-section{margin-bottom:14px;}
.vac-sum-label{font-size:10px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--t3);margin-bottom:6px;}
.vac-sum-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px;}
.vac-sum-cell{background:var(--bg);border:1px solid var(--border2);border-radius:var(--rs);padding:9px 11px;}
.vac-sum-cell-lbl{font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--t3);margin-bottom:3px;}
.vac-sum-cell-val{font-size:12px;color:var(--text);font-weight:500;}
.vac-sum-desc{font-size:13px;color:var(--t2);line-height:1.65;padding:10px 12px;background:var(--bg);border:1px solid var(--border2);border-radius:var(--rs);}
.vac-sum-drives{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px;}
.vac-sum-pf-row{display:flex;align-items:flex-start;gap:8px;padding:8px 11px;border-radius:var(--rs);font-size:12px;line-height:1.5;}
.vac-sum-pf-row.crit{background:var(--rl);border:1px solid var(--rb);color:var(--pf-dark);}
.vac-sum-pf-row.imp{background:var(--al);border:1px solid var(--ab);color:var(--amber-dark);}
.vac-sum-crit-row{display:flex;flex-direction:column;gap:5px;}
.vac-sum-mh-row{display:flex;justify-content:space-between;font-size:12px;padding:4px 0;border-bottom:1px solid var(--border2);}
.vac-sum-mh-row:last-child{border-bottom:none;}

/* --- Invite Candidate Modal --- */
.inv-modal{background:var(--surface);border-radius:16px;width:460px;max-width:95vw;max-height:90vh;display:flex;flex-direction:column;overflow:hidden;box-shadow:var(--shl);}
.inv-hdr{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--border2);}
.inv-title{font-size:15px;font-weight:700;color:var(--text);}
.inv-body{padding:20px;overflow-y:auto;}
.inv-field{display:flex;flex-direction:column;gap:4px;margin-bottom:13px;}
.inv-field label{font-size:11px;font-weight:600;color:var(--t2);text-transform:uppercase;letter-spacing:.05em;}
.inv-field input,.inv-field select{font-size:13px;padding:8px 10px;border-radius:var(--rs);border:1px solid var(--border);background:var(--bg);color:var(--text);outline:none;font-family:var(--font);transition:border .15s;}
.inv-field input:focus,.inv-field select:focus{border-color:var(--green);}
.inv-row2{display:grid;grid-template-columns:1fr 1fr;gap:11px;}
.inv-footer{padding:14px 20px;border-top:1px solid var(--border2);display:flex;gap:9px;justify-content:flex-end;}
.inv-link-box{background:var(--gl);border:1px solid var(--gb);border-radius:var(--rs);padding:14px 16px;margin-top:4px;}
.inv-link-lbl{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--gd);margin-bottom:7px;display:flex;align-items:center;gap:5px;}
.inv-link-url{font-size:12px;font-family:var(--mono);color:var(--gd);word-break:break-all;line-height:1.6;}
.inv-link-copy{display:inline-flex;align-items:center;gap:4px;margin-top:9px;padding:4px 12px;border-radius:20px;background:var(--surface);border:1px solid var(--gb);font-size:12px;font-weight:600;color:var(--gd);cursor:pointer;transition:background .12s;}
.inv-link-copy:hover{background:var(--bg);}
.inv-ref-tag{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border-radius:20px;background:var(--s2);border:1px solid var(--border);font-size:11px;color:var(--t2);font-family:var(--mono);margin-left:6px;}
.pm-ov{position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:700;display:none;align-items:center;justify-content:center;}
.pm-ov.open{display:flex;}
.pm-modal{background:var(--surface);border-radius:16px;width:520px;max-width:95vw;max-height:90vh;display:flex;flex-direction:column;overflow:hidden;box-shadow:var(--shl);}
.pm-hdr{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--border2);}
.pm-title{font-size:15px;font-weight:700;color:var(--text);}
.pm-close{width:28px;height:28px;border-radius:50%;border:none;background:var(--bg);cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--t2);font-size:14px;transition:all .15s;}
.pm-close:hover{background:var(--s2);color:var(--text);}
.pm-tabs{display:flex;gap:0;border-bottom:1px solid var(--border2);padding:0 20px;}
.pm-tab{padding:10px 14px;font-size:13px;font-weight:500;color:var(--t2);cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-1px;transition:all .15s;white-space:nowrap;}
.pm-tab.active{color:var(--green);border-bottom-color:var(--green);font-weight:600;}
.pm-body{flex:1;overflow-y:auto;padding:20px;}
.pm-panel.active{display:block;}

/* Account info form */
.pm-avatar-row{display:flex;align-items:center;gap:16px;margin-bottom:20px;}
.pm-av-big{width:70px;height:70px;border-radius:50%;background:linear-gradient(135deg,var(--av-grad-a),var(--av-grad-b));display:flex;align-items:center;justify-content:center;font-size:22px;font-weight:700;color:var(--av-grad-text);flex-shrink:0;overflow:hidden;cursor:pointer;position:relative;}
.pm-av-big img{width:100%;height:100%;object-fit:cover;border-radius:50%;}
.pm-av-big .av-overlay{position:absolute;inset:0;background:rgba(0,0,0,.45);border-radius:50%;display:none;align-items:center;justify-content:center;}
.pm-av-big:hover .av-overlay{display:flex;}
.pm-av-big .av-overlay i{font-size:20px;color:#fff;}
.pm-av-info{display:flex;flex-direction:column;gap:4px;}
.pm-av-hint{font-size:12px;color:var(--t3);line-height:1.4;}
.pm-av-btns{display:flex;gap:7px;margin-top:4px;}
.pm-field-row{display:grid;grid-template-columns:1fr 1fr;gap:11px;margin-bottom:11px;}
.pm-field{display:flex;flex-direction:column;gap:4px;margin-bottom:11px;}
.pm-field label{font-size:11px;font-weight:600;color:var(--t2);text-transform:uppercase;letter-spacing:.05em;}
.pm-field input,.pm-field select{font-size:13px;padding:8px 10px;border-radius:var(--rs);border:1px solid var(--border);background:var(--bg);color:var(--text);outline:none;width:100%;font-family:var(--font);transition:border .15s;}
.pm-field input:focus,.pm-field select:focus{border-color:var(--green);}
.pm-field select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%239A9A94' stroke-width='2'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;padding-right:28px;}

/* Advanced tab */
.pm-adv-row{display:flex;align-items:center;justify-content:space-between;padding:12px 0;border-bottom:1px solid var(--border2);}
.pm-adv-row:last-child{border-bottom:none;}
.pm-adv-l{display:flex;flex-direction:column;gap:2px;}
.pm-adv-lbl{font-size:13px;font-weight:500;color:var(--text);}
.pm-adv-val{font-size:12px;color:var(--t3);}
.pm-deact-box{margin-top:20px;padding:14px;background:var(--rl);border:1px solid var(--rb);border-radius:var(--rs);}
.pm-deact-title{font-size:13px;font-weight:700;color:var(--red);margin-bottom:6px;}
.pm-deact-list{font-size:12px;color:var(--red);margin-left:16px;line-height:1.8;}

/* QR tab */
.pm-qr-wrap{display:flex;flex-direction:column;align-items:center;gap:14px;padding:10px 0;}
.pm-qr-box{width:180px;height:180px;background:var(--surface);border:1px solid var(--border);border-radius:var(--rs);padding:12px;display:flex;align-items:center;justify-content:center;}
.pm-qr-name{font-size:15px;font-weight:700;color:var(--text);}
.pm-qr-sub{font-size:12px;color:var(--t3);text-align:center;line-height:1.5;max-width:280px;}
.pm-qr-role-badge{font-size:12px;font-weight:600;padding:4px 12px;border-radius:20px;background:var(--gl);color:var(--gd);display:inline-flex;align-items:center;gap:5px;}

/* Settings panel */
.pm-set-section{margin-bottom:20px;}
.pm-set-title{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--t3);margin-bottom:10px;}
.pm-set-row{display:flex;align-items:center;justify-content:space-between;padding:10px 0;border-bottom:1px solid var(--border2);}
.pm-set-row:last-child{border-bottom:none;}
.pm-set-l{display:flex;align-items:center;gap:9px;}
.pm-set-l i{font-size:16px;color:var(--t2);}
.pm-set-lbl{font-size:13px;font-weight:500;color:var(--text);}
.pm-set-sub{font-size:11px;color:var(--t3);margin-top:1px;}
/* Toggle switch */
.tog{display:inline-block;position:relative;width:40px;height:22px;flex-shrink:0;}
.tog input{opacity:0;width:0;height:0;position:absolute;}
.tog-sl{position:absolute;inset:0;background:var(--border);border-radius:11px;cursor:pointer;transition:background .2s;}
.tog input:checked+.tog-sl{background:var(--blue);}
.tog-sl:before{content:'';position:absolute;width:16px;height:16px;border-radius:50%;background:#fff;top:3px;left:3px;transition:transform .2s;box-shadow:0 1px 3px rgba(0,0,0,.2);}
.tog input:checked+.tog-sl:before{transform:translateX(18px);}
/* Lang selector */
.lang-seg{display:flex;background:var(--bg);border:1px solid var(--border);border-radius:var(--rs);overflow:hidden;}
.lang-seg button{flex:1;padding:5px 14px;font-size:12px;font-weight:600;color:var(--t2);background:none;border:none;cursor:pointer;transition:all .15s;font-family:var(--font);}
.lang-seg button.active{background:var(--green);color:#fff;}
/* Hub list in settings */
.pm-hub-list{display:flex;flex-direction:column;gap:6px;}
.pm-hub-item{display:flex;align-items:center;gap:10px;padding:9px 12px;background:var(--bg);border:1px solid var(--border);border-radius:var(--rs);cursor:pointer;transition:all .15s;}
.pm-hub-item:hover{border-color:var(--green);}
.pm-hub-ic{width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;color:#fff;flex-shrink:0;}
.pm-hub-nm{font-size:13px;font-weight:500;color:var(--text);}
.pm-hub-role{font-size:11px;color:var(--t3);margin-top:1px;}
.pm-hub-arr{margin-left:auto;font-size:13px;color:var(--t3);}

/* Data & Privacy panel */
.pm-privacy-section{margin-bottom:22px;}
.pm-privacy-title{font-size:13px;font-weight:700;color:var(--text);margin-bottom:4px;}
.pm-privacy-desc{font-size:12px;color:var(--t2);line-height:1.6;margin-bottom:10px;}

/* About panel */
.pm-about-header{display:flex;align-items:center;gap:14px;margin-bottom:20px;}
.pm-about-logo{width:52px;height:52px;border-radius:11px;overflow:hidden;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.pm-about-logo i{font-size:22px;color:#fff;}
.pm-about-appname{font-size:17px;font-weight:700;color:var(--text);}
.pm-about-version{font-size:12px;color:var(--t3);}
.pm-about-divider{height:1px;background:var(--border2);margin:16px 0;}
.pm-cl-item{display:flex;gap:12px;padding:9px 0;border-bottom:1px solid var(--border2);}
.pm-cl-item:last-child{border-bottom:none;}
.pm-cl-ver{font-size:11px;font-weight:700;font-family:var(--mono);color:var(--green);min-width:52px;padding-top:1px;}
.pm-cl-date{font-size:10px;color:var(--t3);margin-top:2px;}
.pm-cl-changes{font-size:12px;color:var(--t2);line-height:1.7;}
.pm-cl-changes li{margin-left:14px;}
.pm-about-company{background:var(--bg);border:1px solid var(--border);border-radius:var(--rs);padding:13px 15px;margin-bottom:14px;}
.pm-about-cn{font-size:13px;font-weight:700;color:var(--text);margin-bottom:2px;}
.pm-about-cd{font-size:12px;color:var(--t2);line-height:1.7;}
.pm-about-links{display:flex;gap:14px;flex-wrap:wrap;}
.pm-about-link{font-size:12px;color:var(--green);cursor:pointer;text-decoration:none;}
.pm-about-link:hover{color:var(--gd);}
.pm-about-footer{margin-top:20px;padding-top:14px;border-top:1px solid var(--border2);text-align:center;font-size:12px;color:var(--t3);}
.pm-about-footer span{color:var(--red);}

/* --- NEW: Hub pill --- */
.hub-pill{display:inline-flex;align-items:center;gap:8px;padding:6px 12px 6px 8px;border-radius:8px;background:var(--surface);border:1px solid var(--border);cursor:pointer;transition:all .15s;user-select:none;box-shadow:var(--sh);}
.hub-pill:hover{background:var(--s2);border-color:var(--t3);}
.hp-txt{display:flex;flex-direction:column;line-height:1.2;}
.hp-org{font-size:10px;color:var(--t3);font-weight:500;}
.hp-role{font-size:12px;color:var(--text);font-weight:600;}
/* Organisation/Role icon pill - matches design doc */
.hub-pill .material-icons.hp-person{font-size:17px;color:var(--t2);}

/* --- NEW: Bell --- */
.bell-wrap{position:relative;}
.bell-btn{width:36px;height:36px;border-radius:50%;background:transparent;border:none;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .15s;position:relative;}
.bell-btn:hover{background:var(--s2);}
.bell-dot{position:absolute;top:1px;right:1px;width:10px;height:10px;border-radius:50%;background:var(--red);border:2px solid var(--surface);display:none;}
.bell-count{position:absolute;top:-3px;right:-3px;min-width:16px;height:16px;padding:0 4px;border-radius:8px;background:var(--red);color:#fff;font-size:10px;font-weight:700;display:none;align-items:center;justify-content:center;line-height:1;box-sizing:border-box;border:2px solid var(--surface);}

/* Notification panel — right side panel (matches design doc) */
.notif-panel-ov{position:fixed;inset:0;background:rgba(0,0,0,.32);z-index:500;display:none;}
.notif-panel-ov.open{display:block;}
.notif-panel{position:fixed;top:0;right:0;width:380px;max-width:92vw;height:100vh;background:var(--surface);border-left:1px solid var(--border);box-shadow:var(--shl);z-index:501;display:none;flex-direction:column;}
.notif-panel.open{display:flex;}
/* Header — two rows */
.notif-panel-hdr{padding:14px 16px 0 16px;border-bottom:1px solid var(--border2);}
.notif-panel-hdr-row1{display:flex;align-items:center;gap:8px;margin-bottom:12px;}
.notif-panel-close{width:30px;height:30px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--t2);border-radius:var(--rs);transition:background .12s;flex-shrink:0;}
.notif-panel-close:hover{background:var(--s2);}
.notif-panel-close .material-icons{font-size:20px;}
.notif-panel-title{font-size:16px;font-weight:700;color:var(--text);flex:1;}
/* Mark all read — header button */
.notif-mark-all{font-size:12px;font-weight:600;color:var(--blue);background:none;border:none;cursor:pointer;padding:4px 8px;border-radius:var(--rs);transition:background .12s;white-space:nowrap;font-family:var(--font);}
.notif-mark-all:hover{background:var(--bl);}
.notif-mark-all:disabled{color:var(--t3);cursor:default;}
.notif-mark-all:disabled:hover{background:none;}
/* Filter row */
.notif-panel-hdr-row2{display:flex;align-items:center;gap:8px;padding-bottom:12px;}
.notif-tab-bar{display:flex;gap:0;padding-bottom:0;margin-top:2px;}
.notif-tab{background:none;border:none;border-bottom:2px solid transparent;padding:7px 12px;font-size:12px;font-family:var(--font);color:var(--t2);cursor:pointer;transition:color .12s,border-color .12s;margin-bottom:-1px;font-weight:400;}
.notif-tab:hover{color:var(--text);}
.notif-tab.active{color:var(--text);border-bottom-color:var(--text);font-weight:500;}
.notif-filter-label{font-size:12px;font-weight:600;color:var(--t3);white-space:nowrap;}
.notif-filter-select{font-size:13px;font-weight:500;color:var(--text);background:var(--s2);border:1px solid var(--border);border-radius:20px;padding:5px 28px 5px 12px;cursor:pointer;outline:none;font-family:var(--font);appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%239A9A94' stroke-width='2.5'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 8px center;background-size:14px;transition:border-color .12s,background-color .12s;}
.notif-filter-select:hover{border-color:var(--bb);background-color:var(--bl);}
.notif-filter-select:focus{border-color:var(--blue);}
/* List */
.notif-list{flex:1;overflow-y:auto;padding:6px 10px;}
/* Card — clean, no icon, left border accent for unread/action */
.notif-card{background:var(--surface);border:none;border-left:2px solid transparent;padding:10px 14px 9px 12px;transition:background .12s;position:relative;display:grid;grid-template-columns:10px 1fr auto;gap:0 10px;align-items:start;}
.notif-card + .notif-card{border-top:0.5px solid var(--border2);}
.notif-card:hover{background:var(--s2);}
.notif-card.notif-unread{border-left-color:var(--text);}
.notif-card.notif-action{border-left-color:var(--red);}
.notif-card.notif-card-archived{opacity:.5;}
.notif-card.notif-read{opacity:.65;}
/* Dot column */
.notif-card-dot{width:6px;height:6px;border-radius:50%;background:var(--text);margin-top:5px;flex-shrink:0;}
.notif-card-dot.dot-action{background:var(--red);}
.notif-card-dot.dot-read{background:transparent;}
/* Content column */
.notif-card-content{min-width:0;cursor:pointer;}
.notif-card-body{cursor:pointer;}
.notif-card-type{font-size:10px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--t3);margin-bottom:2px;}
.notif-card-type.type-action{color:var(--red);}
.notif-card-title{font-size:12px;font-weight:500;color:var(--text);line-height:1.4;margin-bottom:1px;}
.notif-card-desc{font-size:11.5px;color:var(--t2);line-height:1.45;margin-top:3px;}
.notif-card.notif-card-archived .notif-card-title{color:var(--t2);}
/* Meta row */
.notif-card-meta{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:5px;}
.notif-card-link{font-size:11px;font-weight:500;color:var(--text);text-decoration:underline;text-decoration-color:var(--border);text-underline-offset:2px;cursor:pointer;}
.notif-card-link:hover{text-decoration-color:var(--text);}
.notif-time{font-size:11px;color:var(--t3);}
/* Action badge */
.notif-action-pill{display:inline-flex;align-items:center;gap:3px;font-size:10px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--red);margin-bottom:3px;}
/* Actions column */
.notif-card-actions{display:flex;flex-direction:column;align-items:flex-end;gap:4px;flex-shrink:0;}
.notif-archive-btn{background:none;border:none;font-size:10.5px;color:transparent;cursor:pointer;padding:1px 0;font-family:var(--font);transition:color .12s;white-space:nowrap;}
.notif-unread-btn{background:none;border:none;font-size:10.5px;color:transparent;cursor:pointer;padding:1px 0;font-family:var(--font);transition:color .12s;white-space:nowrap;display:block;}
.notif-card:hover .notif-unread-btn{color:var(--t3);}
.notif-unread-btn:hover{color:var(--text) !important;}
/* Tab badge */
.notif-tab-badge{display:inline-flex;align-items:center;justify-content:center;min-width:16px;height:16px;padding:0 4px;background:var(--text);color:var(--bg);border-radius:8px;font-size:9px;font-weight:600;margin-left:5px;line-height:1;}
.notif-tab-badge.badge-action{background:var(--red);color:#fff;}
.notif-card:hover .notif-archive-btn{color:var(--t3);}
.notif-archive-btn:hover{color:var(--text) !important;}
.notif-restore-btn{background:none;border:none;font-size:10.5px;color:var(--t3);cursor:pointer;padding:1px 0;font-family:var(--font);transition:color .12s;white-space:nowrap;}
.notif-restore-btn:hover{color:var(--text);}
/* Footer */
.notif-panel-foot{padding:10px 16px;border-top:0.5px solid var(--border2);display:flex;align-items:center;justify-content:space-between;}
.notif-panel-foot-txt{font-size:11px;color:var(--t3);}
.notif-panel-foot a{font-size:12px;font-weight:500;color:var(--text);text-decoration:none;cursor:pointer;}
.notif-panel-foot a:hover{text-decoration:underline;}

/* --- NEW: Hub switcher panel --- */
.hs-ov{position:fixed;inset:0;background:rgba(0,0,0,.32);z-index:500;display:none;}
.hs-ov.open{display:block;}
.hs-panel{position:fixed;top:0;right:0;width:400px;max-width:92vw;height:100vh;background:var(--surface);border-left:1px solid var(--border);box-shadow:var(--shl);z-index:501;display:none;flex-direction:column;}
.hs-panel.open{display:flex;}
.hs-hdr{padding:17px 20px;display:flex;align-items:center;gap:11px;border-bottom:1px solid var(--border2);}
.hs-close{width:30px;height:30px;border-radius:var(--rs);display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--t2);transition:all .12s;}
.hs-close:hover{background:var(--s2);}
.hs-close .material-icons{font-size:20px;}
.hs-title{font-size:16px;font-weight:700;color:var(--text);}
.hs-body{padding:18px 20px;flex:1;overflow-y:auto;}
.hs-urow{display:flex;align-items:center;gap:11px;padding:11px 13px;background:var(--bg);border:1px solid var(--border);border-radius:var(--r);margin-bottom:18px;}
.hs-uav{width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,#B0C4F0,#7B9DD9);display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;color:#1A3A6E;flex-shrink:0;}
.hs-unm{font-size:13px;font-weight:600;color:var(--text);}
.hs-uem{font-size:11px;color:var(--t3);margin-top:1px;}
.hs-intro{font-size:13px;color:var(--t2);line-height:1.55;margin-bottom:22px;}
.hs-fld{margin-bottom:20px;position:relative;}
.hs-flbl{font-size:13px;font-weight:500;color:var(--text);margin-bottom:8px;}
.hs-sbtn{width:100%;display:flex;align-items:center;gap:9px;padding:10px 14px;border:1px solid var(--border);border-radius:var(--rs);background:var(--surface);cursor:pointer;font-size:14px;color:var(--text);transition:border-color .12s;}
.hs-sbtn:hover{border-color:var(--t3);}
.hs-sbtn .nm{flex:1;text-align:left;font-weight:400;}
.hs-sbtn .chev{color:var(--t3);font-size:18px;}
.hs-slist{position:absolute;top:calc(100% + 4px);left:0;right:0;background:var(--surface);border:1px solid var(--border);border-radius:var(--rs);box-shadow:var(--shm);z-index:10;max-height:230px;overflow-y:auto;display:none;}
.hs-slist.open{display:block;}
.hs-sitem{display:flex;align-items:center;gap:9px;padding:10px 14px;cursor:pointer;font-size:13px;transition:background .1s;}
.hs-sitem:hover{background:var(--bg);}
.hs-sitem.sel{background:var(--gl);}
.hs-sitem .ck{margin-left:auto;color:var(--green);font-size:14px;display:none;}
.hs-sitem.sel .ck{display:inline;}
.hs-defrow{display:flex;align-items:center;gap:8px;margin-top:10px;font-size:13px;color:var(--t2);cursor:pointer;user-select:none;padding:4px 2px;}
.hschk{width:16px;height:16px;border-radius:4px;border:1.5px solid var(--border);display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .12s;background:var(--surface);}
.hschk.on{background:var(--blue);border-color:var(--blue);}
.hschk.on .material-icons{color:#fff;font-size:11px;display:block;}
.hschk .material-icons{display:none;}
.hs-need-help{padding:10px 16px;border-top:1px solid var(--border2);text-align:center;}
.hs-foot{padding:14px 20px;border-top:1px solid var(--border2);display:flex;gap:9px;justify-content:flex-start;}

/* --- NEW: Page header --- */
.page-hdr{padding:24px 24px 0;display:flex;align-items:flex-start;justify-content:space-between;gap:13px;flex-wrap:wrap;}
.ph-l{display:flex;flex-direction:column;gap:3px;}
.ph-t{font-size:22px;font-weight:700;color:var(--text);letter-spacing:-.025em;}
.ph-s{font-size:13px;color:var(--t2);}
.ph-r{display:flex;align-items:center;gap:7px;flex-shrink:0;margin-top:2px;}

/* Instructions button — outlined style matching design doc */
.btn.inst{background:var(--surface);border-color:var(--border);color:var(--text);box-shadow:var(--sh);}
.btn.inst:hover{background:var(--s2);}

/* All original styles below */
.ref-tag{display:inline-flex;align-items:center;gap:4px;padding:3px 9px;border-radius:20px;background:var(--s2);border:1px solid var(--border);font-size:11px;color:var(--t2);font-family:var(--mono);}
.content{padding:20px 24px 32px;flex:1;}
.screen{display:none;animation:fu .18s ease;}
.screen.active{display:block;}
@keyframes fu{from{opacity:0;transform:translateY(5px);}to{opacity:1;transform:translateY(0);}}
.btn{display:inline-flex;align-items:center;gap:6px;padding:7px 15px;border-radius:var(--rs);font-size:13px;font-weight:500;cursor:pointer;border:1px solid var(--border);background:var(--surface);color:var(--text);font-family:var(--font);transition:all .15s;box-shadow:var(--sh);}
.btn:hover{background:var(--s2);}
.btn.pr{background:var(--blue);border-color:var(--blue);color:var(--white);}
.btn.pr:hover:not(:disabled){background:var(--btn-blue-hover);}
.btn.pr:disabled{background:var(--border);border-color:var(--border);color:var(--t3);cursor:not-allowed;box-shadow:none;}
.btn.danger{background:var(--red);border-color:var(--red);color:var(--white);}
.btn.danger:hover{background:#B53030;}
.btn.sm{padding:5px 11px;font-size:12px;}
.btng{display:flex;align-items:center;gap:7px;}
.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:20px;margin-bottom:13px;box-shadow:var(--sh);}
.card-t{font-size:15px;font-weight:700;color:var(--text);margin-bottom:3px;letter-spacing:-.015em;}
.card-s{font-size:13px;color:var(--t2);margin-bottom:17px;line-height:1.6;}
.card-hdr{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:14px;}
.stats-row{display:grid;gap:11px;margin-bottom:18px;}
.stat-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:15px 17px;box-shadow:var(--sh);}
.stat-lbl{font-size:10px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--t3);margin-bottom:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.stat-val{font-size:24px;font-weight:700;font-family:var(--mono);color:var(--text);}
.stat-sub{font-size:11px;color:var(--t3);margin-top:3px;}
.tbl{width:100%;border-collapse:collapse;}
.tbl th{text-align:left;font-size:11px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--t3);padding:10px 12px;border-bottom:1px solid var(--border);}
.tbl td{padding:8px 12px;font-size:13px;color:var(--text);border-bottom:1px solid var(--border2);vertical-align:middle;}
.tbl tr:last-child td{border-bottom:none;}
.tbl tbody tr{transition:background .1s;}.tbl tbody tr:hover td{background:var(--s2);cursor:pointer;}
.badge{display:inline-flex;align-items:center;gap:4px;padding:3px 8px;border-radius:20px;font-size:11px;font-weight:600;}
.badge.open{background:var(--gl);border:1px solid var(--gb);color:var(--gd);}
.badge.closed{background:var(--rl);border:1px solid var(--rb);color:var(--red);}
.badge.concept{background:var(--al);border:1px solid var(--ab);color:var(--amber);}
.badge.intern-b{background:var(--purl);border:1px solid var(--purb);color:var(--purple);}
.badge.extern-b{background:var(--s2);border:1px solid var(--border);color:var(--t2);}
.sdot{width:5px;height:5px;border-radius:50%;}
.badge.open .sdot{background:var(--green);}
.badge.closed .sdot{background:var(--red);}
.badge.concept .sdot{background:var(--amber);}
.cs{display:inline-flex;align-items:center;gap:4px;padding:3px 8px;border-radius:20px;font-size:11px;font-weight:600;border:1px solid transparent;}
.cs-u{background:#EAF1FB;color:var(--bd);border-color:#A8C8EE;}
.cs-g{background:var(--purl);color:var(--purple);border-color:var(--purb);}
.cs-o{background:var(--al);color:var(--amber);border-color:var(--ab);}
.cs-af{background:var(--rl);color:var(--red);border-color:var(--rb);}
.cs-aa{background:var(--gl);color:var(--gd);border-color:var(--gb);}
.field{margin-bottom:12px;}
.field:last-child{margin-bottom:0;}
.lbl{font-size:12px;font-weight:600;color:var(--t2);margin-bottom:5px;display:flex;align-items:center;gap:6px;letter-spacing:.01em;}
.req{font-size:10px;padding:1px 6px;border-radius:20px;background:var(--rl);color:var(--red);font-weight:600;}
.opt{font-size:10px;padding:1px 6px;border-radius:20px;background:var(--s2);color:var(--t3);font-weight:500;}
input[type=text],input[type=email],input[type=tel],textarea,select{width:100%;font-size:13px;padding:8px 10px;border-radius:var(--rs);border:1px solid var(--border);background:var(--surface);color:var(--text);outline:none;font-family:var(--font);transition:border-color .15s,box-shadow .15s;}
input:focus,textarea:focus,select:focus{border-color:var(--blue);box-shadow:0 0 0 3px rgba(52,120,199,.12);}
input.filled{border-color:var(--gb);}
textarea{resize:vertical;min-height:78px;line-height:1.6;}
.fr{display:grid;grid-template-columns:1fr 1fr;gap:11px;}
.fr3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:11px;}
.divider{height:1px;background:var(--border2);margin:15px 0;}
.tog-row{display:flex;align-items:center;gap:9px;padding:9px 12px;border-radius:var(--rs);border:1px solid var(--border);background:var(--bg);margin-bottom:12px;cursor:pointer;user-select:none;transition:all .15s;}
.tog-row:hover{border-color:var(--gb);}
.tog-row.on{background:var(--gl);border-color:var(--gb);}
.tog{display:inline-block;width:30px;height:17px;border-radius:9px;background:var(--border);position:relative;flex-shrink:0;transition:background .2s;}
.tog.on{background:var(--green);}
.tog-thumb{width:13px;height:13px;border-radius:50%;background:#fff;position:absolute;top:2px;left:2px;transition:left .2s;box-shadow:0 1px 3px rgba(0,0,0,.2);}
.tog.on .tog-thumb{left:15px;}
.tog-text{font-size:13px;font-weight:500;color:var(--text);}
.tog-sub{font-size:12px;color:var(--t3);margin-left:auto;}
.tog-sm{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:var(--rs);border:1px solid var(--border);background:var(--bg);cursor:pointer;user-select:none;transition:all .15s;}
.tog-sm:hover,.tog-sm.on{border-color:var(--gb);}
.tog-sm.on{background:var(--gl);}
.tog-sm-lbl{font-size:12px;font-weight:500;color:var(--t2);}
.tog-sm.on .tog-sm-lbl{color:var(--gd);}
.psel{display:flex;align-items:center;gap:7px;padding:7px 10px;border-radius:var(--rs);border:1px solid var(--border);background:var(--surface);cursor:pointer;min-height:37px;transition:border-color .15s;}
.psel:hover{border-color:var(--green);}
.psel.filled{border-color:var(--gb);}
.p-av{width:21px;height:21px;border-radius:50%;background:var(--gl);display:none;align-items:center;justify-content:center;font-size:9px;font-weight:700;color:var(--gd);flex-shrink:0;}
.p-ph{font-size:13px;color:var(--t3);flex:1;}
.p-nm{font-size:13px;color:var(--text);font-weight:500;flex:1;display:none;}
.dd{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);margin-top:4px;display:none;box-shadow:var(--shm);position:relative;z-index:200;}
.dd.open{display:block;}
.dd-srch{padding:6px 9px;border-bottom:1px solid var(--border2);}
.dd-srch input{font-size:12px;padding:5px 9px;border-radius:var(--rs);border:1px solid var(--border);background:var(--bg);width:100%;}
.dd-list{max-height:145px;overflow-y:auto;}
.dd-item{display:flex;align-items:center;gap:7px;padding:7px 11px;cursor:pointer;font-size:13px;transition:background .1s;}
.dd-item:hover{background:var(--bg);}
.dd-av{width:23px;height:23px;border-radius:50%;background:var(--gl);display:flex;align-items:center;justify-content:center;font-size:9px;font-weight:700;color:var(--gd);flex-shrink:0;}
.dd-role{font-size:11px;color:var(--t3);margin-left:auto;}
.dd-empty{padding:9px 11px;font-size:12px;color:var(--t3);text-align:center;}
.dd-add{display:flex;align-items:center;gap:6px;padding:7px 11px;cursor:pointer;font-size:13px;color:var(--green);border-top:1px solid var(--border2);font-weight:500;}
.dd-add:hover{background:var(--gl);}
.apanel{background:var(--bg);border:1px solid var(--border);border-radius:var(--r);padding:12px;margin-top:5px;display:none;}
.apanel.open{display:block;}
.apanel-t{font-size:13px;font-weight:600;color:var(--text);margin-bottom:8px;display:flex;align-items:center;gap:5px;}
.arow{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-bottom:7px;}
.aem{width:100%;font-size:13px;padding:7px 10px;border-radius:var(--rs);border:1px solid var(--border);background:var(--surface);color:var(--text);outline:none;margin-bottom:7px;font-family:var(--font);}
.abtns{display:flex;gap:5px;justify-content:flex-end;}
.bsm{font-size:12px;padding:5px 11px;border-radius:var(--rs);cursor:pointer;border:1px solid var(--border);background:var(--surface);color:var(--t2);font-family:var(--font);transition:background .1s;}
.bsm:hover{background:var(--bg);}
.bsm.g{background:var(--green);border-color:var(--green);color:#fff;}
.bsm.g:hover{background:var(--gd);}
.bsm.danger{border-color:var(--rb);color:var(--red);}
.bsm.danger:hover{background:var(--rl);border-color:var(--red);}
.clt-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:13px;margin-bottom:18px;}
.clt-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:17px;cursor:pointer;transition:all .15s;box-shadow:var(--sh);}
.clt-card:hover{border-color:var(--green);box-shadow:var(--shm);transform:translateY(-1px);}
.clt-logo{width:40px;height:40px;border-radius:var(--rs);display:flex;align-items:center;justify-content:center;font-size:15px;font-weight:700;color:#fff;flex-shrink:0;}
.clt-name{font-size:14px;font-weight:700;color:var(--text);margin-bottom:2px;}
.clt-sec{font-size:12px;color:var(--t3);}
.clt-stats{display:flex;gap:13px;margin-top:9px;padding-top:9px;border-top:1px solid var(--border2);}
.clt-stat{font-size:11px;color:var(--t3);}
.clt-stat strong{color:var(--text);font-weight:600;}
.contact-list{display:flex;flex-direction:column;gap:7px;}
.contact-item{display:flex;align-items:center;gap:9px;padding:9px 12px;background:var(--bg);border:1px solid var(--border2);border-radius:var(--rs);}
.contact-av{width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;color:#fff;flex-shrink:0;}
.contact-name{font-size:13px;font-weight:600;color:var(--text);}
.contact-role{font-size:11px;color:var(--t3);}
.contact-email{font-size:11px;color:var(--t3);margin-left:auto;}
.sum-box{background:var(--bg);border:1px solid var(--border);border-radius:var(--rs);padding:11px 13px;margin-top:11px;display:none;}
.sum-box.vis{display:block;}
.sum-hd{font-size:12px;font-weight:600;color:var(--t2);margin-bottom:6px;display:flex;align-items:center;gap:5px;}
.sum-hd i{font-size:13px;color:var(--green);}
.sum-grid{display:grid;grid-template-columns:1fr 1fr;gap:4px 16px;}
.sum-r{font-size:12px;display:flex;gap:4px;}
.sum-k{color:var(--t3);min-width:90px;flex-shrink:0;}
.sum-v{color:var(--text);font-weight:500;}
.stepbar{display:flex;align-items:center;background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:12px 17px;margin-bottom:16px;box-shadow:var(--sh);}
.step-item{display:flex;align-items:center;gap:6px;}
.sdot2{width:24px;height:24px;border-radius:50%;border:1.5px solid var(--border);display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;background:var(--bg);color:var(--t3);flex-shrink:0;transition:all .2s;}
.sdot2.done{background:var(--gl);border-color:var(--gb);color:var(--gd);cursor:pointer;}
.sdot2.active{background:var(--text);border-color:var(--text);color:#fff;}
.slbl{font-size:11px;color:var(--t3);white-space:nowrap;}
.slbl.active{color:var(--text);font-weight:600;}
.slbl.done{color:var(--gd);}
.sline{flex:1;height:1px;background:var(--border);margin:0 7px;}
.sline.done{background:var(--gb);}
.grp-lbl{font-size:10px;font-weight:700;letter-spacing:.08em;color:var(--t3);margin-bottom:8px;display:flex;align-items:center;gap:6px;text-transform:uppercase;}
.dot{width:7px;height:7px;border-radius:50%;}
.dot-f{background:var(--pink);}
.dot-m{background:var(--blue);}
.dg4{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin-bottom:9px;}
.dc.dis{opacity:.27;cursor:not-allowed;transform:none!important;}
.dc.fc{border-color:var(--pb);}
.dc.mc{border-color:var(--bb);}
.dc.s1{border:2px solid var(--green);background:var(--gl);}
.dc.s2{border:2px solid var(--blue);background:var(--bl);}
.dc.s3{border:2px solid var(--amber);background:var(--al);}
.dc.fc:hover:not(.dis):not(.s1):not(.s2):not(.s3){border-color:var(--pink);background:var(--pl);}
.dc.mc:hover:not(.dis):not(.s1):not(.s2):not(.s3){border-color:var(--blue);background:var(--bl);}
.di{width:31px;height:31px;border-radius:50%;margin:0 auto 7px;display:flex;align-items:center;justify-content:center;font-size:14px;}
.fc .di{background:var(--pl);color:var(--pink);}
.mc .di{background:var(--bl);color:var(--blue);}
.s1 .di{background:var(--gl);color:var(--green);}
.s2 .di{background:var(--bl);color:#185FA5;}
.s3 .di{background:var(--al);color:var(--amber);}
.dn{font-size:12px;font-weight:700;color:var(--text);}
.dt{font-size:10px;color:var(--t3);margin-top:2px;}
.dc.s1 .dt,.dc.s2 .dt,.dc.s3 .dt{display:none;}
.sb{font-size:10px;font-weight:600;padding:2px 5px;border-radius:20px;margin-top:3px;display:none;}
.s1 .sb{display:inline-block;background:var(--gl);color:var(--gd);}
.s2 .sb{display:inline-block;background:var(--bl);color:#185FA5;}
.s3 .sb{display:inline-block;background:var(--al);color:var(--amber);}
.sstbar{display:flex;gap:5px;margin-bottom:14px;}
.sstep{flex:1;padding:6px 8px;border-radius:var(--rs);border:1px solid var(--border);background:var(--bg);text-align:center;font-size:12px;font-weight:500;color:var(--t3);transition:all .15s;}
.sstep.active{background:var(--gl);border-color:var(--gb);color:var(--gd);}
.sstep.done{background:var(--gl);border-color:var(--gb);color:var(--gd);}
.sel-sum{display:none;align-items:center;gap:9px;flex-wrap:wrap;padding:7px 12px;background:var(--bg);border:1px solid var(--border);border-radius:var(--rs);margin-bottom:12px;}
.sinum{width:18px;height:18px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;flex-shrink:0;}
.sinum.n1{background:var(--green);color:#fff;}
.sinum.n2{background:var(--blue);color:#fff;}
.sinum.n3{background:var(--amber);color:#fff;}
.conn-sec{margin-top:15px;padding-top:15px;border-top:1px solid var(--border2);}
.conn-t{font-size:12px;font-weight:600;color:var(--t2);margin-bottom:8px;display:flex;align-items:center;gap:6px;}
.conn-t i{font-size:14px;color:var(--green);}
.cg{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:6px;}
.cc{border:1px solid var(--border);border-radius:var(--rs);padding:8px 10px;cursor:pointer;transition:all .15s;background:var(--surface);}
.cc:hover{border-color:var(--green);background:var(--gl);}
.cc.act{border:2px solid var(--green);background:var(--gl);}
.cc.faded{opacity:.3;cursor:not-allowed;}
.cc-pair{display:flex;align-items:center;gap:4px;margin-bottom:3px;}
.cp{font-size:11px;font-weight:600;padding:2px 7px;border-radius:20px;}
.cp.f{background:var(--pl);color:#8B2A50;}
.cp.m{background:var(--bl);color:var(--bd);}
.cp.s{background:var(--gl);color:var(--gd);}
.cn{font-size:12px;color:var(--t2);}
.third-info{display:flex;align-items:flex-start;gap:6px;padding:8px 12px;background:var(--al);border:1px solid var(--ab);border-radius:var(--rs);margin-top:11px;font-size:12px;color:#7A4A00;line-height:1.5;}
.pg5{display:grid;grid-template-columns:repeat(5,1fr);gap:7px;}
.pc.dis2{opacity:.27;cursor:not-allowed;}
.pc.fc{border-color:var(--pb);}
.pc.mc{border-color:var(--bb);}
.pc.sc{border:2px solid var(--red);background:var(--rl);}
.pc.si2{border:2px solid var(--amber);background:var(--al);}
.pc.fc .di{background:var(--pl);color:var(--pink);}
.pc.mc .di{background:var(--bl);color:var(--blue);}
.pc.sc .di{background:var(--rl);color:var(--red);}
.pc.si2 .di{background:var(--al);color:var(--amber);}
.pb2{font-size:10px;font-weight:600;padding:2px 5px;border-radius:20px;margin-top:3px;display:none;}
.pc.sc .pb2{display:inline-block;background:var(--rl);color:var(--pf-dark);}
.pc.si2 .pb2{display:inline-block;background:var(--al);color:var(--amber);}
.pc.sc .dt,.pc.si2 .dt{display:none;}
.ctx-bar{display:flex;align-items:center;gap:6px;flex-wrap:wrap;padding:7px 12px;background:var(--bg);border:1px solid var(--border);border-radius:var(--rs);margin-bottom:12px;font-size:12px;color:var(--t2);}
.ctx-pill{padding:2px 8px;border-radius:20px;font-size:12px;font-weight:600;background:var(--gl);color:var(--gd);}
.pf-res{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:13px;}
.pfb{border-radius:var(--r);overflow:hidden;border:1px solid;display:flex;align-items:stretch;}
.pfb.cr{border-color:var(--rb);}
.pfb.im{border-color:var(--ab);}
.pfb-h{padding:10px 12px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:6px;width:120px;flex-shrink:0;box-sizing:border-box;}
.pfb.cr .pfb-h{background:var(--rl);}
.pfb.im .pfb-h{background:var(--al);}
.pfb-ic{width:25px;height:25px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:12px;flex-shrink:0;}
.pfb.cr .pfb-ic{background:var(--rb);color:var(--pf-dark);}
.pfb.im .pfb-ic{background:var(--ab);color:#7A4A00;}
.pfb-nm{font-size:13px;font-weight:600;}
.pfb.cr .pfb-nm{color:#6B1414;}
.pfb.im .pfb-nm{color:var(--amber-dark);}
.pfb-bdg{font-size:10px;font-weight:600;padding:2px 7px;border-radius:20px;white-space:nowrap;}
.pfb.cr .pfb-bdg{background:#E88A8A;color:#3D0A0A;}
.pfb.im .pfb-bdg{background:#DDA030;color:#3A1A00;}
.pfb-b{padding:10px 12px;flex:1;min-width:0;display:flex;flex-direction:column;justify-content:center;}
.pfb-code{font-family:var(--mono);font-size:11px;margin-bottom:2px;}
.pfb.cr .pfb-code{color:var(--red);}
.pfb.im .pfb-code{color:var(--amber);}
.pfb-sh{font-size:12px;color:var(--t2);line-height:1.5;}
.tov-card.sel{border:2px solid var(--text);background:var(--bg);}
.tov-card.sel .tov-chk{display:flex;}
/* Notificatie detail modal */
.notif-ov{position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:600;display:none;align-items:center;justify-content:center;}
.notif-ov.open{display:flex;}
.notif-modal{background:var(--surface);border-radius:14px;width:460px;max-width:95vw;overflow:hidden;box-shadow:0 20px 60px rgba(0,0,0,.25);}
.notif-mhdr{display:flex;align-items:center;gap:12px;padding:16px 20px;border-bottom:1px solid var(--border2);}
.notif-mhdr-ic{width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.notif-mhdr-ic i{font-size:17px;}
.notif-mbody{padding:18px 20px;}
.notif-mtext{font-size:14px;color:var(--text);line-height:1.6;margin-bottom:14px;}
.notif-mtime{font-size:12px;color:var(--t3);margin-bottom:18px;}
.notif-mfoot{display:flex;align-items:center;justify-content:space-between;padding:14px 20px;border-top:1px solid var(--border2);background:var(--bg);}
@keyframes spin{to{transform:rotate(360deg);}}
.draft-regen-banner.vis{display:flex;}
.seclbl{font-size:10px;font-weight:700;letter-spacing:.08em;color:var(--t3);text-transform:uppercase;margin-bottom:10px;margin-top:16px;}
.seclbl:first-of-type{margin-top:0;}
.drv-blk.fb{border-color:var(--pb);}
.drv-blk.mb{border-color:var(--bb);}
.drv-blk.fb .dh{background:var(--pl);}
.drv-blk.mb .dh{background:var(--bl);}
.drv-blk.fb .dh-ic{background:var(--pb);color:#6B1A38;}
.drv-blk.mb .dh-ic{background:var(--bb);color:#0E3D7A;}
.drv-blk.fb .dh-nm{color:#5A0F2A;}
.drv-blk.mb .dh-nm{color:#072E5E;}
.drv-blk.fb .dh-type{background:var(--pb);color:#5A0F2A;}
.drv-blk.mb .dh-type{background:var(--bb);color:#072E5E;}
.tc{font-family:var(--mono);font-size:10px;font-weight:500;min-width:33px;}
.drv-blk.fb .tc{color:#8B2A50;}
.drv-blk.mb .tc{color:var(--bd);}
.cb-pill.f{background:var(--pl);color:#6B1A38;border:1px solid var(--pb);}
.cb-pill.m{background:var(--bl);color:#0E3D7A;border:1px solid var(--bb);}
.pub-row{display:grid;grid-template-columns:1fr 1fr;gap:11px;align-items:start;margin-top:12px;}
input[type=date]{font-size:13px;padding:7px 10px;border-radius:var(--rs);border:1px solid var(--border);background:var(--surface);color:var(--text);outline:none;font-family:var(--font);}
input[type=date]:focus{border-color:var(--green);}
.sl-row{display:flex;align-items:center;gap:13px;padding:11px 15px;background:var(--bg);border:1px solid var(--border);border-radius:var(--rs);margin-bottom:14px;}
.sl-lbl{font-size:13px;font-weight:600;color:var(--text);white-space:nowrap;}
.sl-val{font-size:18px;font-weight:700;color:var(--text);min-width:48px;text-align:right;font-family:var(--mono);}
input[type=range]{flex:1;accent-color:var(--green);cursor:pointer;}
input[type=range]:disabled{opacity:.35;}

/* ── Marketing Tone (read-only, from psychometrie) ───────── */

/* ── Searchable template picker modal ────────────────────────── */
#tpl-picker-modal{position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:8500;display:none;align-items:flex-start;justify-content:center;padding:60px 20px 20px;}
#tpl-picker-modal.open{display:flex;}
.tpl-picker-box{background:var(--surface);border-radius:var(--r);box-shadow:0 8px 40px rgba(0,0,0,.22);width:100%;max-width:620px;display:flex;flex-direction:column;max-height:80vh;}
.tpl-picker-head{padding:16px 20px 0;flex-shrink:0;}
.tpl-picker-head h3{font-size:15px;font-weight:700;color:var(--text);margin:0 0 10px;}
.tpl-picker-search{width:100%;font-size:13px;padding:8px 12px 8px 34px;border:1.5px solid var(--border);border-radius:var(--rs);background:var(--bg);color:var(--text);font-family:var(--font);outline:none;box-sizing:border-box;}
.tpl-picker-search:focus{border-color:var(--blue);}
.tpl-picker-search-wrap{position:relative;margin-bottom:10px;}
.tpl-picker-search-wrap .material-icons{position:absolute;left:9px;top:50%;transform:translateY(-50%);font-size:15px;color:var(--t3);pointer-events:none;}
.tpl-picker-filters{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:10px;}
.tpl-filter-chip{font-size:11px;font-weight:600;padding:3px 10px;border-radius:20px;border:1px solid var(--border2);background:var(--s2);color:var(--t2);cursor:pointer;transition:all .12s;}
.tpl-filter-chip:hover,.tpl-filter-chip.active{background:var(--blue);color:#fff;border-color:var(--blue);}
.tpl-picker-list{overflow-y:auto;flex:1;padding:0 20px 16px;}
.tpl-picker-item{padding:11px 13px;border:1.5px solid var(--border2);border-radius:var(--rs);cursor:pointer;margin-bottom:7px;transition:all .12s;}
.tpl-picker-item:hover{border-color:var(--blue);background:var(--bl);}
.tpl-picker-item.selected{border-color:var(--green);background:var(--gl);}
.tpl-picker-item-title{font-size:13px;font-weight:700;color:var(--text);margin-bottom:3px;}
.tpl-picker-item-meta{font-size:11px;color:var(--t2);display:flex;gap:10px;flex-wrap:wrap;}
.tpl-picker-item-drives{font-size:11px;font-weight:600;padding:2px 7px;border-radius:10px;background:var(--gl);border:1px solid var(--gb);color:var(--gd);}
.tpl-picker-item-pf{font-size:11px;font-weight:600;padding:2px 7px;border-radius:10px;background:var(--rl);border:1px solid var(--rb);color:var(--red);}
.tpl-picker-footer{padding:12px 20px;border-top:1px solid var(--border2);display:flex;justify-content:space-between;align-items:center;flex-shrink:0;}
.tpl-picker-none{padding:28px 0;text-align:center;color:var(--t3);font-size:13px;}
/* ── Password strength meter ──────────────────────────────────── */
.pw-field-wrap{position:relative;margin-bottom:14px;}
.pw-toggle{position:absolute;right:10px;top:50%;transform:translateY(-50%);background:none;border:none;cursor:pointer;color:var(--t3);padding:4px;display:flex;align-items:center;}
.pw-strength-bar{height:4px;border-radius:2px;background:var(--border2);margin:8px 0 10px;overflow:hidden;}
.pw-strength-fill{height:100%;border-radius:2px;transition:width .25s,background .25s;}
.pw-req-list{display:grid;grid-template-columns:1fr 1fr;gap:5px 12px;margin-bottom:14px;}
.pw-req{font-size:12px;color:var(--t3);display:flex;align-items:center;gap:5px;transition:color .2s;}
.pw-req.met{color:var(--gd);}
.pw-req .material-icons{font-size:13px;}
.dept-wrap{position:relative;}
.dept-dd{position:absolute;top:calc(100% + 3px);left:0;right:0;background:var(--surface);border:1px solid var(--border);border-radius:var(--rs);box-shadow:0 4px 16px rgba(0,0,0,.14);z-index:3000;max-height:220px;overflow-y:auto;display:none;}
.dept-dd.open{display:block;}
.dept-dd-item{padding:9px 13px;font-size:13px;color:var(--text);cursor:pointer;line-height:1.3;}
.dept-dd-item:hover,.dept-dd-item.focused{background:var(--bl);color:var(--blue);}
.dept-dd-none{padding:9px 13px;font-size:13px;color:var(--t3);}
/* ── Marketing Voice picker ───────────────────────────────── */
.voice-card{padding:11px 13px;border:1.5px solid var(--border);border-radius:var(--rs);background:var(--bg);cursor:pointer;transition:all .15s;position:relative;}
.voice-card:hover{border-color:var(--green);background:var(--gl);}
.voice-card.selected{border-color:var(--green);background:var(--gl);box-shadow:0 0 0 2px rgba(27,158,114,.18);}
.voice-card.recommended{border-color:var(--blue);background:var(--bl);}
.voice-card.recommended.selected{border-color:var(--green);background:var(--gl);}
.voice-card-name{font-size:12px;font-weight:700;color:var(--text);margin-bottom:3px;line-height:1.3;}
.voice-card-quote{font-size:11px;color:var(--t2);font-style:italic;line-height:1.45;}
.voice-card-badge{position:absolute;top:7px;right:8px;font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;padding:2px 6px;border-radius:10px;background:var(--bl);color:var(--blue);border:1px solid var(--bb);}
.voice-card.selected .voice-card-badge{background:var(--gl);color:var(--gd);border-color:var(--gb);}
.voice-selected-display{padding:11px 14px;background:var(--gl);border:1.5px solid var(--green);border-radius:var(--rs);display:flex;align-items:flex-start;gap:10px;}
.voice-selected-icon{width:32px;height:32px;border-radius:8px;background:var(--green);display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.voice-selected-icon .material-icons{font-size:16px;color:#fff;}

/* ── Tone sliders ─────────────────────────────────────────── */
.tov-sliders{display:flex;flex-direction:column;gap:20px;}
.tov-sl-row{display:flex;flex-direction:column;gap:0;}
.tov-sl-hdr{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:10px;}
.tov-sl-lbl{font-size:13px;font-weight:600;color:var(--text);}
.tov-sl-val{font-size:12px;font-weight:600;color:var(--green);}

/* custom slider track with tick marks via background */
.tov-sl-track{position:relative;padding:4px 0 2px;}
.tov-sl-track input[type=range]{
  width:100%;margin:0;height:4px;
  -webkit-appearance:none;appearance:none;
  background:transparent;cursor:pointer;
  position:relative;z-index:2;
}
.tov-sl-track input[type=range]::-webkit-slider-runnable-track{
  height:4px;border-radius:2px;
  background:linear-gradient(to right,var(--green) 0%,var(--green) var(--pct,50%),var(--border) var(--pct,50%),var(--border) 100%);
}
.tov-sl-track input[type=range]::-moz-range-track{
  height:4px;border-radius:2px;background:var(--border);
}
.tov-sl-track input[type=range]::-moz-range-progress{
  height:4px;border-radius:2px;background:var(--green);
}
.tov-sl-track input[type=range]::-webkit-slider-thumb{
  -webkit-appearance:none;width:18px;height:18px;border-radius:50%;
  background:var(--surface);border:2px solid var(--green);
  box-shadow:0 1px 4px rgba(0,0,0,.15);margin-top:-7px;
  transition:transform .1s,box-shadow .1s;
}
.tov-sl-track input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.15);box-shadow:0 2px 8px rgba(27,158,114,.3);}
.tov-sl-track input[type=range]::-moz-range-thumb{
  width:18px;height:18px;border-radius:50%;border:2px solid var(--green);
  background:var(--surface);box-shadow:0 1px 4px rgba(0,0,0,.15);cursor:pointer;
}
/* tick marks overlay */
.tov-sl-ticks{display:flex;justify-content:space-between;padding:0 9px;margin-top:5px;}
.tov-sl-ticks span{width:1px;height:6px;background:var(--border);border-radius:1px;display:block;}
.tov-sl-ticks span.active{background:var(--green);}
.tov-sl-marks{display:flex;justify-content:space-between;font-size:10px;color:var(--t3);margin-top:5px;}

/* Regenerate prompt banner */
.tov-regen-bar{display:none;align-items:center;gap:9px;margin-top:16px;padding:10px 14px;
  background:var(--al);border:1px solid var(--ab);border-radius:var(--rs);
  font-size:12px;color:var(--amber);}
.tov-regen-bar.vis{display:flex;}
.tov-regen-bar .material-icons{font-size:15px;flex-shrink:0;}
.tov-regen-bar strong{color:var(--amber);}

/* preset badge chip */
.sl-preset-chip{display:inline-flex;align-items:center;gap:4px;padding:3px 9px;border-radius:20px;background:var(--bl);border:1px solid var(--bb);font-size:11px;font-weight:600;color:var(--blue);margin-top:10px;}
.sl-preset-chip .material-icons{font-size:12px;}
.cand-list{display:flex;flex-direction:column;gap:6px;}
.cand-item{display:flex;align-items:center;gap:11px;padding:11px 13px;background:var(--surface);border:1px solid var(--border);border-radius:var(--r);cursor:pointer;transition:all .15s;}
.cand-item:hover{border-color:var(--green);box-shadow:var(--sh);}
.cand-item.sel{border:2px solid var(--green);background:var(--gl);}
.cand-chk{width:16px;height:16px;border-radius:4px;border:1.5px solid var(--border);display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .15s;}
.cand-item.sel .cand-chk{background:var(--green);border-color:var(--green);}
.cand-rank{width:21px;height:21px;border-radius:50%;background:var(--bg);border:1px solid var(--border);display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;color:var(--t2);flex-shrink:0;}
.cand-rank.top{background:var(--al);border-color:var(--ab);color:var(--amber);}
.cand-av{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;color:#fff;flex-shrink:0;}
.mbw{display:flex;align-items:center;gap:8px;min-width:155px;}
.mb{height:5px;border-radius:3px;background:var(--border);flex:1;overflow:hidden;}
.mf{height:100%;border-radius:3px;transition:width .4s ease;}
.mpct{font-size:12px;font-weight:700;min-width:36px;text-align:right;font-family:var(--mono);}
.rbadge{font-size:11px;font-weight:600;padding:2px 7px;border-radius:20px;}
.rbadge-ex  {background:var(--gl);color:var(--gd);border:1px solid var(--gb);}
.rbadge-good{background:#E3F2FD;color:#1565C0;border:1px solid #90CAF9;}
.rbadge-mod {background:#FFF8E1;color:#F57F17;border:1px solid #FFE082;}
.rbadge-low {background:var(--s2);color:var(--t3);border:1px solid var(--border2);}
/* ── Candidate status badges ─────────────────────────────────── */
/* ── Status progress stepper ──────────────────────────────────── */
.cst-stepper{display:flex;align-items:center;gap:0;margin:12px 0 6px;}
.cst-step{display:flex;flex-direction:column;align-items:center;flex:1;position:relative;}
.cst-step::before{content:'';position:absolute;top:9px;left:50%;right:-50%;height:2px;background:var(--border2);z-index:0;}
.cst-step:last-child::before{display:none;}
.cst-dot{width:18px;height:18px;border-radius:50%;border:2px solid var(--border);background:var(--surface);z-index:1;display:flex;align-items:center;justify-content:center;font-size:9px;flex-shrink:0;}
.cst-dot.done{background:var(--green);border-color:var(--green);color:#fff;}
.cst-dot.active{background:var(--blue);border-color:var(--blue);color:#fff;}
.cst-dot.skip{background:var(--rl);border-color:var(--rb);color:var(--red);}
.cst-lbl{font-size:9px;color:var(--t3);margin-top:4px;text-align:center;white-space:nowrap;}
.cst-lbl.active{color:var(--blue);font-weight:700;}
.cst-lbl.done{color:var(--green);}
/* ── Shortlist export panel ───────────────────────────────────── */
.export-panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:16px 20px;margin-top:14px;}
.export-cand-chip{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:20px;background:var(--s2);border:1px solid var(--border2);font-size:12px;font-weight:600;color:var(--text);}
.export-cand-chip .av-sm{width:20px;height:20px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:9px;font-weight:700;color:#fff;flex-shrink:0;}
/* ── Department/location catalogue ───────────────────────────── */
.cat-item{display:flex;align-items:center;justify-content:space-between;padding:9px 12px;background:var(--s2);border-radius:var(--rs);margin-bottom:6px;gap:10px;}
.cat-item-name{font-size:13px;font-weight:600;color:var(--text);flex:1;}
.cat-add-row{display:flex;gap:8px;margin-top:10px;}
.cat-add-row input{flex:1;font-size:13px;padding:8px 10px;border:1px solid var(--border);border-radius:var(--rs);background:var(--bg);color:var(--text);font-family:var(--font);outline:none;}
.cat-add-row input:focus{border-color:var(--green);}
/* ── Admin tab navigation (Job Fit settings) ─────────────── */
.adm-snav{display:inline-flex;align-items:center;gap:7px;padding:6px 14px;border:none;background:none;color:var(--t2);font-size:13px;font-weight:500;font-family:var(--font);border-radius:var(--rs);cursor:pointer;text-align:left;transition:background .12s,color .12s;white-space:nowrap;}
.adm-snav .material-icons{font-size:14px;flex-shrink:0;}
.adm-snav:hover{background:var(--bg);color:var(--text);}
.adm-snav.active{background:var(--bg);color:var(--blue);font-weight:700;}
.adm-snav.active .material-icons{color:var(--blue);}
/* ── Admin section panels ───────────────────────────────── */
.adm-sec-panel{}
/* ── Recommendation / status banner ─────────────────────────── */
.rec-banner{display:flex;align-items:center;gap:10px;padding:10px 13px;border-radius:var(--rs);margin-top:10px;border:1px solid;}
.rec-banner.shortlisted{background:var(--al);border-color:var(--ab);}
.rec-banner.hired{background:var(--gl);border-color:var(--gb);}
.rec-banner.rejected{background:var(--rl);border-color:var(--rb);}
.rec-banner.onhold{background:var(--s2);border-color:var(--border2);}
/* ── Stepper pending dot ─────────────────────────────────────── */
.cst-dot.pending{background:var(--surface);border-color:var(--border2);color:var(--t3);}
/* ── Score breakdown section ────────────────────────────────── */
.score-breakdown{padding:13px 15px;background:var(--s2);border:1px solid var(--border);border-radius:var(--r);margin-top:16px;}
/* ── Compose-prompt flash banner ────────────────────────────── */
.flash-compose-prompt{margin-bottom:12px;padding:12px 16px;border-radius:var(--rs);background:var(--s2);border:1px solid var(--border);display:flex;align-items:center;gap:10px;font-size:13px;}

/* ── HM-specific styles ───────────────────────────────────────── */
/* HM dashboard vacancy cards */
.hm-vac-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:16px 18px;margin-bottom:10px;cursor:pointer;transition:all .15s;}
.hm-vac-card:hover{border-color:var(--green);box-shadow:var(--sh);}
.hm-vac-card.has-new{border-left:3px solid var(--blue);}
.hm-vac-meta{display:flex;align-items:center;gap:8px;margin-top:6px;flex-wrap:wrap;}
.hm-vac-chip{font-size:11px;color:var(--t2);display:flex;align-items:center;gap:4px;}
.hm-vac-chip .material-icons{font-size:13px;color:var(--t3);}
/* HM candidate preference buttons */
.hm-pref-btn{display:inline-flex;align-items:center;gap:5px;padding:5px 11px;border-radius:20px;font-size:12px;font-weight:600;border:1px solid;cursor:pointer;transition:all .15s;background:var(--surface);}
.hm-pref-btn:hover{box-shadow:var(--sh);}
.hm-pref-btn.up{border-color:var(--gb);color:var(--gd);}
.hm-pref-btn.up.active{background:var(--gl);border-color:var(--green);}
.hm-pref-btn.down{border-color:var(--rb);color:var(--red);}
.hm-pref-btn.down.active{background:var(--rl);border-color:var(--red);}
.hm-pref-btn.neutral{border-color:var(--border2);color:var(--t3);}
/* Inline HM preference buttons on candidate-list rows */
.hm-lp-btn{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:50%;border:1px solid var(--border2);background:var(--surface);color:var(--t3);cursor:pointer;transition:all .15s;padding:0;}
.hm-lp-btn:hover{box-shadow:var(--sh);}
.hm-lp-btn.up:hover,.hm-lp-btn.up.active{background:var(--gl);border-color:var(--green);color:var(--gd);}
.hm-lp-btn.down:hover,.hm-lp-btn.down.active{background:var(--rl);border-color:var(--red);color:var(--red);}
/* One-click action button inside a notification card */
.notif-qa-btn{font-size:11px;font-weight:600;color:var(--blue);background:var(--bl);border:1px solid var(--bb);border-radius:14px;padding:3px 10px;cursor:pointer;margin-right:8px;}
.notif-qa-btn:hover{background:var(--blue);color:#fff;}
.notif-done-btn{color:var(--t2);background:var(--s2);border-color:var(--border);}
.notif-done-btn:hover{background:var(--t2);color:#fff;border-color:var(--t2);}
.notif-reminded-btn{color:var(--t2);background:var(--s2);border-color:var(--border);cursor:default;}
.notif-reminded-btn:hover{background:var(--s2);color:var(--t2);}
/* Deep-link highlight pulse */
.notif-highlight{animation:notifPulse 1.6s ease;}
@keyframes notifPulse{0%{box-shadow:0 0 0 0 rgba(59,130,246,.45);}60%{box-shadow:0 0 0 7px rgba(59,130,246,0);}100%{box-shadow:0 0 0 0 rgba(59,130,246,0);}}
/* Command palette (Cmd/Ctrl-K) */
.cmdk-ov{position:fixed;inset:0;background:rgba(0,0,0,.4);display:none;align-items:flex-start;justify-content:center;z-index:9999;}
.cmdk-ov.open{display:flex;}
.cmdk-box{margin-top:12vh;width:560px;max-width:92vw;background:var(--surface);border:1px solid var(--border);border-radius:12px;box-shadow:0 20px 60px rgba(0,0,0,.25);overflow:hidden;}
.cmdk-inwrap{display:flex;align-items:center;gap:10px;padding:14px 16px;border-bottom:1px solid var(--border2);}
.cmdk-input{flex:1;border:none;outline:none;background:transparent;font-size:15px;color:var(--text);}
.cmdk-hint{font-size:11px;color:var(--t3);border:1px solid var(--border2);border-radius:4px;padding:1px 6px;}
.cmdk-list{max-height:340px;overflow-y:auto;padding:6px;}
.cmdk-item{display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:8px;cursor:pointer;}
.cmdk-item.sel{background:var(--bl);}
.cmdk-title{font-size:13px;font-weight:600;color:var(--text);flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.cmdk-ref{font-size:11px;color:var(--t3);font-family:var(--mono);}
.cmdk-client{font-size:11px;color:var(--t2);}
.cmdk-empty{padding:24px;text-align:center;color:var(--t3);font-size:13px;}
/* HM visibility badge */
.hm-vis-badge{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:600;padding:3px 9px;border-radius:20px;background:var(--bl);color:var(--bd);border:1px solid var(--bb);}
/* HM action strip on candidate row */
/* HM empty state */
.hm-empty{padding:32px;text-align:center;color:var(--t3);}
.hm-empty .material-icons{font-size:40px;display:block;margin-bottom:10px;color:var(--border);}
/* HM notification item */
.hm-notif.unread{background:var(--bl);border-color:var(--bb);}
.hm-notif-dot.read{background:var(--t3);}
/* Welkomstbanner HM */
.hm-welcome{background:linear-gradient(135deg,var(--bl) 0%,var(--surface) 70%);border:1px solid var(--bb);border-radius:var(--r);padding:18px 22px;margin-bottom:16px;display:flex;align-items:flex-start;gap:14px;}
.hm-welcome-icon{width:44px;height:44px;border-radius:11px;background:var(--blue);display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.hm-welcome-icon .material-icons{font-size:22px;color:#fff;}

/* ── Candidate-specific styles ────────────────────────────────── */
.cand-onboard{padding:16px 20px;background:linear-gradient(135deg,var(--bl) 0%,var(--surface) 70%);border:1px solid var(--bb);border-radius:var(--r);margin-bottom:16px;}
.cand-onboard-steps{display:flex;align-items:flex-start;gap:0;margin-top:14px;}
.co-step{display:flex;flex-direction:column;align-items:center;flex:1;position:relative;}
.co-step::before{content:'';position:absolute;top:14px;left:50%;right:-50%;height:2px;background:var(--border2);z-index:0;}
.co-step:last-child::before{display:none;}
.co-step.done::before{background:var(--green);}
.co-dot{width:28px;height:28px;border-radius:50%;border:2px solid var(--border);background:var(--surface);z-index:1;display:flex;align-items:center;justify-content:center;font-size:12px;flex-shrink:0;}
.co-dot.done{background:var(--green);border-color:var(--green);color:#fff;}
.co-dot.active{background:var(--blue);border-color:var(--blue);color:#fff;}
.co-dot.pending{background:var(--surface);border-color:var(--border2);color:var(--t3);}
.co-lbl{font-size:10px;text-align:center;margin-top:5px;line-height:1.3;max-width:70px;}
.co-lbl.done{color:var(--green);}
.co-lbl.active{color:var(--blue);font-weight:700;}
.co-lbl.pending{color:var(--t3);}
.cv-match-locked{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:32px 24px;text-align:center;background:var(--s2);border-radius:var(--rs);}
.cv-match-locked .material-icons{font-size:40px;color:var(--border);margin-bottom:10px;}
.det-tabs{display:flex;gap:2px;margin-bottom:16px;background:var(--s2);border:1px solid var(--border);border-radius:var(--rs);padding:3px;}
.det-tab{flex:1;padding:6px 9px;border-radius:6px;font-size:13px;font-weight:500;color:var(--t2);cursor:pointer;text-align:center;transition:all .15s;}
.det-tab.active{background:var(--surface);color:var(--text);font-weight:600;box-shadow:var(--sh);}
.iq-cat{margin-bottom:16px;}
.iq-cat-t{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--t3);margin-bottom:8px;display:flex;align-items:center;gap:6px;}
.iq-item{background:var(--bg);border:1px solid var(--border2);border-radius:var(--rs);padding:11px 13px;margin-bottom:6px;}
.iq-q{font-size:13px;color:var(--text);font-weight:500;line-height:1.5;margin-bottom:6px;}
.iq-ntog{font-size:12px;color:var(--green);cursor:pointer;display:flex;align-items:center;gap:4px;}
.iq-ntog:hover{color:var(--gd);}
.iq-na{margin-top:7px;display:none;}
.iq-na.open{display:block;}
.iq-na textarea{font-size:12px;min-height:55px;background:var(--surface);}
.note-list{display:flex;flex-direction:column;gap:7px;margin-bottom:12px;}
.note-item{background:var(--al);border:1px solid var(--ab);border-radius:var(--rs);padding:10px 13px;}
.note-meta{font-size:11px;color:var(--amber);margin-bottom:3px;font-weight:500;}
.note-text{font-size:13px;color:var(--text);line-height:1.5;}
.note-new{display:flex;gap:7px;align-items:flex-end;}
.note-new textarea{flex:1;font-size:13px;min-height:65px;}
.cmp-grid{display:grid;grid-template-columns:1fr 1fr;gap:11px;}
.cmp-col{background:var(--bg);border:1px solid var(--border);border-radius:var(--rs);padding:12px;}
.cmp-col-t{font-size:10px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--t3);margin-bottom:8px;}
.cmp-drv{display:flex;align-items:center;gap:6px;padding:5px 0;border-bottom:1px solid var(--border2);font-size:12px;}
.cmp-drv:last-child{border-bottom:none;}
.dp{font-size:11px;font-weight:600;padding:2px 7px;border-radius:20px;}
.dp.f{background:var(--pl);color:#8B2A50;}
.dp.m{background:var(--bl);color:var(--bd);}
.dp.match{background:var(--gl);color:var(--gd);}
.dp.no{background:var(--rl);color:var(--red);}
.admin-av{width:27px;height:27px;border-radius:50%;background:var(--gl);display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;color:var(--gd);}
.hint{display:flex;align-items:flex-start;gap:5px;font-size:12px;color:var(--t3);margin-top:7px;line-height:1.4;}
.hint i{font-size:13px;flex-shrink:0;margin-top:1px;}
.collapsible{overflow:hidden;transition:max-height .3s ease;}
.collapsible.closed{max-height:0!important;}
.org-note{display:none;align-items:center;gap:6px;font-size:12px;color:var(--gd);background:var(--gl);border:1px solid var(--gb);border-radius:var(--rs);padding:6px 12px;margin-bottom:12px;font-weight:500;}
.org-note.vis{display:flex;}
.sec-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;}
.sec-l{display:flex;align-items:center;gap:7px;}
.sec-ic{width:27px;height:27px;border-radius:var(--rs);background:var(--bg);border:1px solid var(--border);display:flex;align-items:center;justify-content:center;}
.sec-ic i{font-size:14px;color:var(--t2);}
.sec-t{font-size:13px;font-weight:600;color:var(--text);}
.sec-s{font-size:11px;color:var(--t3);}
.cr{display:grid;grid-template-columns:140px 1fr;gap:7px;margin-bottom:7px;}
.lin{font-size:12px;padding:7px 9px;border-radius:var(--rs);border:1px solid var(--border);background:var(--bg);color:var(--text);outline:none;width:100%;font-family:var(--font);transition:all .15s;}
.lin:focus{border-color:var(--green);}
.lin.hv{border-color:var(--gb);background:var(--gl);color:var(--gd);font-weight:600;}
.dist-row{display:flex;align-items:center;gap:11px;}
.dist-val{font-size:13px;font-weight:600;color:var(--text);min-width:53px;text-align:right;}
.dist-val.off{color:var(--t3);}
.footer{display:flex;align-items:center;justify-content:space-between;padding-top:15px;border-top:1px solid var(--border2);position:relative;}
.footer>.sc2,.footer .btng>.sc2{position:absolute;left:50%;transform:translateX(-50%);pointer-events:none;}
.sc2{font-size:12px;color:var(--t3);}
.back-link{display:inline-flex;align-items:center;gap:5px;font-size:13px;color:var(--t2);cursor:pointer;margin-bottom:13px;padding:3px 0;}
.back-link:hover{color:var(--text);}
/* ── Education Module ─────────────────────────────────────── */
.edu-type-badge{display:inline-flex;align-items:center;gap:4px;padding:2px 9px;border-radius:20px;font-size:11px;font-weight:700;}
.edu-type-education{background:var(--gl);color:var(--gd);border:1px solid #A8D8A8;}
.edu-type-training{background:#EAF1FB;color:var(--bd);border:1px solid #A8C8EE;}
.edu-type-course{background:var(--purl);color:var(--purple);border:1px solid var(--purb);}
.edu-prog-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:16px;cursor:pointer;transition:all .15s;box-shadow:var(--sh);margin-bottom:10px;}
.edu-prog-card:hover{border-color:var(--blue);box-shadow:var(--shm);transform:translateY(-1px);}
.edu-prog-card.published{border-left:3px solid var(--green);}
.edu-prog-card.draft{border-left:3px solid var(--amber);}
.edu-prog-card.concept{border-left:3px solid var(--border);}
.edu-inst-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:17px;cursor:pointer;transition:all .15s;box-shadow:var(--sh);}
.edu-inst-card:hover{border-color:var(--blue);box-shadow:var(--shm);}
.edu-inst-logo{width:42px;height:42px;border-radius:var(--r);display:flex;align-items:center;justify-content:center;font-size:16px;font-weight:700;color:#fff;flex-shrink:0;}
.edu-mkt-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:16px;cursor:pointer;transition:all .15s;box-shadow:var(--sh);}
.edu-mkt-card:hover{border-color:var(--blue);box-shadow:var(--shm);transform:translateY(-1px);}
.edu-match-bar{height:6px;border-radius:3px;background:var(--border);overflow:hidden;flex:1;}
.edu-match-fill{height:100%;border-radius:3px;transition:width .4s;}
.edu-career-tag{display:inline-flex;align-items:center;gap:4px;padding:3px 9px;border-radius:20px;font-size:11px;font-weight:600;background:var(--al);border:1px solid var(--ab);color:var(--amber);}
.edu-wizard-step{display:none;}
.edu-wizard-step.active{display:block;animation:fu .18s ease;}
.edu-upload-zone{border:2px dashed var(--border);border-radius:var(--r);padding:32px 20px;text-align:center;cursor:pointer;transition:all .15s;background:var(--bg);}
.edu-upload-zone:hover,.edu-upload-zone.drag{border-color:var(--blue);background:var(--bl);}
.edu-upload-zone.done{border-color:var(--green);background:var(--gl);}
.edu-profile-section{background:var(--bg);border:1px solid var(--border2);border-radius:var(--rs);padding:12px 14px;margin-bottom:10px;}
.edu-profile-section-title{font-size:11px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--t3);margin-bottom:8px;}
.edu-connector-chip{display:inline-flex;align-items:center;gap:5px;padding:4px 10px;border-radius:20px;font-size:12px;font-weight:600;background:var(--gl);border:1px solid var(--gb);color:var(--gd);margin:2px;}
.edu-nh-chip{display:inline-flex;align-items:center;gap:5px;padding:4px 10px;border-radius:20px;font-size:12px;font-weight:600;background:var(--bl);border:1px solid var(--bb);color:var(--blue);margin:2px;}
.edu-pf-chip{display:inline-flex;align-items:center;gap:5px;padding:4px 10px;border-radius:20px;font-size:12px;font-weight:600;background:var(--rl);border:1px solid var(--rb);color:var(--red);margin:2px;}
.edu-privacy-badge{display:inline-flex;align-items:center;gap:4px;padding:3px 9px;border-radius:20px;background:var(--gl);border:1px solid var(--gb);font-size:11px;font-weight:600;color:var(--gd);}
.edu-stat-row{display:grid;gap:10px;margin-bottom:16px;}
.edu-reveal-row{background:var(--surface);border:1px solid var(--border);border-radius:var(--rs);padding:11px 14px;display:flex;align-items:center;gap:12px;margin-bottom:8px;}
.edu-reveal-av{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;color:#fff;flex-shrink:0;}

/* ── Login screen ────────────────────────────────────────────── */
#login-screen{position:fixed;inset:0;background:var(--bg);z-index:9999;display:flex;align-items:center;justify-content:center;padding:20px;}

/* ── Privacy statement gate ─────────────────────────────── */
#privacy-gate{position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:9998;display:none;align-items:center;justify-content:center;padding:20px;}
#privacy-gate.open{display:flex;}
.pg-box{width:100%;max-width:600px;background:var(--surface);border-radius:var(--r);box-shadow:0 8px 40px rgba(0,0,0,.22);display:flex;flex-direction:column;max-height:90vh;}
.pg-header{padding:20px 24px 16px;border-bottom:1px solid var(--border2);flex-shrink:0;}
.pg-title{font-size:17px;font-weight:700;color:var(--text);margin-bottom:3px;}
.pg-subtitle{font-size:12px;color:var(--t2);}
.pg-body{padding:20px 24px;overflow-y:auto;flex:1;}
.pg-section{margin-bottom:18px;}
.pg-section-title{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.07em;color:var(--t3);margin-bottom:7px;display:flex;align-items:center;gap:5px;}
.pg-section-title .material-icons{font-size:13px;}
.pg-section p{font-size:13px;color:var(--t2);line-height:1.7;margin-bottom:6px;}
.pg-section p strong{color:var(--text);}
.pg-section ul{font-size:13px;color:var(--t2);line-height:1.7;padding-left:18px;margin:0;}
.pg-section ul li{margin-bottom:3px;}
.pg-footer{padding:16px 24px;border-top:1px solid var(--border2);flex-shrink:0;}
.pg-checkbox-row{display:flex;align-items:flex-start;gap:10px;margin-bottom:14px;cursor:pointer;}
.pg-checkbox-row input[type=checkbox]{width:16px;height:16px;margin-top:2px;flex-shrink:0;cursor:pointer;accent-color:var(--green);}
.pg-checkbox-label{font-size:13px;color:var(--text);line-height:1.5;}
.login-box{width:100%;max-width:560px;}
.login-logo{display:flex;align-items:center;gap:10px;margin-bottom:28px;}
.login-title{font-size:22px;font-weight:700;color:var(--text);margin-bottom:4px;}
.login-sub{font-size:13px;color:var(--t2);margin-bottom:24px;}
.login-list{display:flex;flex-direction:column;gap:10px;max-height:70vh;overflow-y:auto;}
/* ── SuperAdmin screen ──────────────────────────────────────── */
.sa-hub-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:16px;margin-bottom:10px;box-shadow:var(--sh);}
.sa-hub-card:hover{border-color:var(--purple);}
.sa-stat{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:14px 18px;box-shadow:var(--sh);}
.sa-stat-val{font-size:28px;font-weight:800;color:var(--text);}
.sa-stat-lbl{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--t3);margin-top:2px;}

/* ══════════════════════════════════════════════════════════════
   CAREER SITE — public vacancy portal (separate environment)
   Inspired by octopus.energy/careers/join-us/ — fully anonymised
   ══════════════════════════════════════════════════════════════ */
#career-site{display:none;position:fixed;inset:0;z-index:2000;background:#fff;overflow-y:auto;font-family:'DM Sans',system-ui,sans-serif;}
/* Detail panel */
.cs-detail-ov.open{display:flex;}
/* New badge on freshly published jobs */
/* No-jobs banner */

/* ══════════════════════════════════════════════════════════════
   CAREER PORTAL — embedded in MC Job Fit
   Scoped under #career-portal to avoid CSS conflicts
   ══════════════════════════════════════════════════════════════ */
#career-portal {
  --pink:#e040a0; --ink:#1a1a2e; --mid:#4a4a6a; --muted:#8a8aaa;
  --line:#e8e8f0; --bg:#ffffff; --bg2:#f5f5fa; --blue:#1565c0;
  font-family:'DM Sans',system-ui,sans-serif;
  -webkit-font-smoothing:antialiased;
}

#career-portal *{box-sizing:border-box;margin:0;padding:0;}
#career-portal :root{
#career-portal   --pink:#e040a0;
#career-portal   --ink:#1a1a2e;
#career-portal   --mid:#4a4a6a;
#career-portal   --muted:#8a8aaa;
#career-portal   --line:#e8e8f0;
#career-portal   --bg:#ffffff;
#career-portal   --bg2:#f5f5fa;
#career-portal   --blue:#1565c0;
#career-portal }
#career-portal body{font-family:'DM Sans',system-ui,sans-serif;background:var(--bg);color:var(--ink);min-height:100vh;-webkit-font-smoothing:antialiased;}

/* ── Top nav ─────────────────────────────────────────────────── */
#career-portal .topnav{height:60px;display:flex;align-items:center;padding:0 48px;border-bottom:1px solid var(--line);}
#career-portal .nav-logo{display:flex;align-items:center;gap:9px;text-decoration:none;}
#career-portal .nav-logo-sq{width:32px;height:32px;background:var(--ink);border-radius:7px;display:flex;align-items:center;justify-content:center;}
#career-portal .nav-logo-sq svg{width:18px;height:18px;}
#career-portal .nav-brand{font-size:15px;font-weight:700;color:var(--ink);letter-spacing:-.01em;}
#career-portal .nav-links{margin-left:auto;display:flex;align-items:center;gap:28px;}
#career-portal .nav-links a{font-size:14px;color:var(--mid);text-decoration:none;font-weight:500;transition:color .15s;}
#career-portal .nav-links a:hover,.nav-links a.active{color:var(--ink);}

/* ── Hero — dark, full width, big headline ──────────────────── */
#career-portal .hero{background:var(--ink);padding:72px 48px 80px;}
#career-portal .hero-label{font-size:13px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.45);margin-bottom:20px;}
#career-portal .hero-title{font-size:clamp(36px,6vw,64px);font-weight:800;letter-spacing:-.04em;line-height:1.04;color:#fff;max-width:720px;margin-bottom:32px;}
#career-portal .hero-title .accent{color:var(--pink);}
/* Search bar — large, white, with icon */
#career-portal .hero-search{position:relative;max-width:640px;}
#career-portal .hero-search .material-icons{position:absolute;left:20px;top:50%;transform:translateY(-50%);font-size:22px;color:var(--muted);pointer-events:none;}
#career-portal .hero-search input{width:100%;font-size:17px;padding:18px 22px 18px 56px;border-radius:12px;border:none;background:#fff;color:var(--ink);outline:none;box-shadow:0 4px 32px rgba(0,0,0,.35);font-family:inherit;font-weight:400;}
#career-portal .hero-search input::placeholder{color:var(--muted);}
#career-portal .hero-search input:focus{box-shadow:0 4px 32px rgba(0,0,0,.4),0 0 0 3px rgba(224,64,160,.35);}

/* ── Filters strip ───────────────────────────────────────────── */
#career-portal .filters-strip{background:var(--bg2);border-bottom:1px solid var(--line);padding:14px 48px;display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
#career-portal .filter-label{font-size:13px;font-weight:600;color:var(--mid);margin-right:4px;}
/* Pill-style filter selects */
#career-portal .fpill{appearance:none;font-size:13px;font-weight:500;padding:7px 32px 7px 14px;border-radius:100px;border:1.5px solid var(--line);background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='11' viewBox='0 0 24 24' fill='none' stroke='%238a8aaa' stroke-width='2.5'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 11px center;color:var(--ink);font-family:inherit;cursor:pointer;outline:none;transition:all .15s;}
#career-portal .fpill:hover{border-color:var(--mid);}
#career-portal .fpill:focus,.fpill.active{border-color:var(--pink);background-color:#fff8fc;}
#career-portal .filters-right{margin-left:auto;display:flex;align-items:center;gap:10px;}
#career-portal .refresh-pill{display:inline-flex;align-items:center;gap:5px;font-size:13px;font-weight:500;color:var(--mid);background:#fff;border:1.5px solid var(--line);border-radius:100px;padding:6px 14px;cursor:pointer;font-family:inherit;transition:all .15s;}
#career-portal .refresh-pill:hover{border-color:var(--mid);color:var(--ink);}
#career-portal .refresh-pill .material-icons{font-size:15px;}

/* ── Main content ─────────────────────────────────────────────── */
#career-portal .content{max-width:960px;margin:0 auto;padding:40px 48px 100px;}
#career-portal .showing-count{font-size:22px;font-weight:700;color:var(--ink);letter-spacing:-.02em;margin-bottom:28px;}
#career-portal .showing-count span{color:var(--pink);}

/* ── Job rows — full width, like Octopus ─────────────────────── */
#career-portal .job-list{display:flex;flex-direction:column;}
#career-portal .job-row{display:flex;align-items:flex-start;gap:16px;padding:22px 0;border-bottom:1px solid var(--line);cursor:pointer;transition:background .12s;border-radius:0;text-decoration:none;}
#career-portal .job-row:first-child{border-top:1px solid var(--line);}
#career-portal .job-row:hover{background:var(--bg2);margin:0 -16px;padding:22px 16px;border-radius:8px;border-color:transparent;}
#career-portal .job-row:hover + .job-row{border-top-color:transparent;}
#career-portal .job-main{flex:1;min-width:0;}
#career-portal .job-title{font-size:17px;font-weight:700;color:var(--ink);margin-bottom:5px;line-height:1.3;letter-spacing:-.01em;}
#career-portal .job-org{font-size:14px;color:var(--mid);margin-bottom:10px;display:flex;align-items:center;gap:5px;}
#career-portal .job-org .material-icons{font-size:15px;color:var(--muted);}
#career-portal .job-tags{display:flex;flex-wrap:wrap;gap:6px;}
#career-portal .job-tag{display:inline-flex;align-items:center;gap:4px;font-size:12px;font-weight:500;padding:4px 10px;border-radius:100px;background:var(--bg2);color:var(--mid);border:1px solid var(--line);}
#career-portal .job-tag.dept{background:#f0f0ff;border-color:#d0d0f0;color:#4040a0;}
#career-portal .job-tag.new-tag{background:#fff0f8;border-color:#f0b0d8;color:#c0206080;font-weight:700;}
#career-portal .job-tag .material-icons{font-size:12px;}
#career-portal .job-arrow{flex-shrink:0;width:36px;height:36px;border-radius:50%;border:1.5px solid var(--line);display:flex;align-items:center;justify-content:center;color:var(--muted);margin-top:4px;transition:all .18s;}
#career-portal .job-row:hover .job-arrow{border-color:var(--pink);color:var(--pink);background:#fff0f8;}

/* ── Empty state ─────────────────────────────────────────────── */
#career-portal .empty-state{padding:64px 32px;text-align:center;}
#career-portal .empty-state .material-icons{font-size:56px;color:var(--line);display:block;margin-bottom:16px;}
#career-portal .empty-title{font-size:20px;font-weight:700;color:var(--mid);margin-bottom:8px;}
#career-portal .empty-sub{font-size:15px;color:var(--muted);}

/* ── Detail drawer — slides in from right ────────────────────── */
#career-portal .drawer-ov{display:none;position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:200;backdrop-filter:blur(2px);}
#career-portal .drawer-ov.open{display:flex;align-items:stretch;justify-content:flex-end;}
#career-portal .drawer{width:600px;max-width:95vw;height:100vh;background:#fff;overflow-y:auto;display:flex;flex-direction:column;animation:drawerIn .24s cubic-bezier(.4,0,.2,1);}
@keyframes drawerIn{from{transform:translateX(48px);opacity:0;}to{transform:translateX(0);opacity:1;}}
#career-portal .drawer-close-bar{padding:16px 28px;display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;background:#fff;border-bottom:1px solid var(--line);z-index:1;}
#career-portal .drawer-close-btn{display:inline-flex;align-items:center;gap:6px;font-size:14px;font-weight:500;color:var(--mid);background:none;border:none;cursor:pointer;font-family:inherit;padding:6px 12px;border-radius:8px;transition:all .12s;}
#career-portal .drawer-close-btn:hover{background:var(--bg2);color:var(--ink);}
#career-portal .drawer-close-btn .material-icons{font-size:18px;}
#career-portal .drawer-apply-top{background:var(--pink);color:#fff;border:none;border-radius:8px;padding:9px 20px;font-size:14px;font-weight:700;cursor:pointer;font-family:inherit;display:inline-flex;align-items:center;gap:6px;transition:background .15s;}
#career-portal .drawer-apply-top:hover{background:#c0308080;}
#career-portal .drawer-hdr{padding:32px 32px 24px;}
#career-portal .drawer-dept-tag{display:inline-block;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#4040a0;background:#f0f0ff;border:1px solid #d0d0f0;border-radius:100px;padding:4px 12px;margin-bottom:14px;}
#career-portal .drawer-title{font-size:28px;font-weight:800;letter-spacing:-.03em;line-height:1.15;color:var(--ink);margin-bottom:10px;}
#career-portal .drawer-org{font-size:15px;color:var(--mid);margin-bottom:16px;display:flex;align-items:center;gap:5px;}
#career-portal .drawer-org .material-icons{font-size:16px;color:var(--muted);}
#career-portal .drawer-meta-row{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:0;}
#career-portal .drawer-meta-tag{display:inline-flex;align-items:center;gap:5px;font-size:13px;font-weight:500;padding:5px 12px;border-radius:100px;background:var(--bg2);color:var(--mid);border:1px solid var(--line);}
#career-portal .drawer-meta-tag .material-icons{font-size:14px;color:var(--muted);}
#career-portal .drawer-body{padding:0 32px 32px;flex:1;}
#career-portal .drawer-section{margin-top:28px;padding-top:28px;border-top:1px solid var(--line);}
#career-portal .drawer-section:first-child{border-top:none;margin-top:0;padding-top:0;}
#career-portal .drawer-sec-title{font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom:14px;}
#career-portal .drawer-text{font-size:15px;color:var(--ink);line-height:1.78;white-space:pre-wrap;}
#career-portal .drawer-footer{padding:24px 32px;border-top:1px solid var(--line);position:sticky;bottom:0;background:#fff;}
#career-portal .apply-big{display:flex;align-items:center;justify-content:center;gap:9px;width:100%;padding:16px;background:var(--ink);color:#fff;border:none;border-radius:12px;font-size:16px;font-weight:700;cursor:pointer;font-family:inherit;letter-spacing:-.01em;transition:background .15s;}
#career-portal .apply-big:hover{background:#0d0d1a;}
#career-portal .apply-hint{font-size:12px;color:var(--muted);text-align:center;margin-top:10px;line-height:1.55;}

/* ── Apply modal ─────────────────────────────────────────────── */
#career-portal .modal-ov{display:none;position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:300;align-items:center;justify-content:center;backdrop-filter:blur(3px);}
#career-portal .modal-ov.open{display:flex;}
#career-portal .modal{display:block;background:#fff;border-radius:20px;width:500px;max-width:95vw;overflow:hidden;box-shadow:0 32px 80px rgba(0,0,0,.3);animation:fadeUp .2s cubic-bezier(.4,0,.2,1);}
@keyframes fadeUp{from{transform:translateY(20px);opacity:0;}to{transform:translateY(0);opacity:1;}}
#career-portal .modal-hdr{background:var(--ink);padding:22px 26px;display:flex;align-items:flex-start;justify-content:space-between;gap:12px;}
#career-portal .modal-hdr-title{font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.55);margin-bottom:6px;}
#career-portal .modal-hdr-job{font-size:18px;font-weight:700;color:#fff;line-height:1.25;}
#career-portal .modal-close{width:32px;height:32px;flex-shrink:0;border-radius:50%;background:rgba(255,255,255,.12);border:none;color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .12s;margin-top:2px;}
#career-portal .modal-close:hover{background:rgba(255,255,255,.22);}
#career-portal .modal-body{padding:24px 26px;}
#career-portal .ref-section{background:#f5f5fa;border-radius:12px;padding:18px 20px;margin-bottom:22px;}
#career-portal .ref-section-label{font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom:9px;}
#career-portal .ref-code{font-size:26px;font-weight:800;font-family:'DM Mono',monospace;color:var(--ink);letter-spacing:.06em;margin-bottom:7px;}
#career-portal .ref-note{font-size:13px;color:var(--mid);line-height:1.55;}
#career-portal .steps-label{font-size:13px;font-weight:700;color:var(--ink);margin-bottom:11px;}
#career-portal .steps{display:flex;flex-direction:column;gap:10px;}
#career-portal .step{display:flex;align-items:flex-start;gap:12px;}
#career-portal .step-num{width:24px;height:24px;border-radius:50%;background:var(--ink);color:#fff;font-size:12px;font-weight:700;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:1px;}
#career-portal .step-text{font-size:14px;color:var(--mid);line-height:1.5;}
#career-portal .step-text strong{color:var(--ink);}
#career-portal .modal-footer{padding:16px 26px;border-top:1px solid var(--line);display:flex;gap:10px;justify-content:flex-end;}
#career-portal .btn-ghost{display:inline-flex;align-items:center;gap:5px;padding:10px 18px;border-radius:9px;font-size:14px;font-weight:600;cursor:pointer;border:1.5px solid var(--line);background:#fff;color:var(--mid);font-family:inherit;transition:all .15s;}
#career-portal .btn-ghost:hover{border-color:var(--mid);color:var(--ink);}
#career-portal .btn-dark{background:var(--ink);color:#fff;border-color:var(--ink);}
#career-portal .btn-dark:hover{background:#0d0d1a;}

/* ── Footer ─────────────────────────────────────────────────── */
#career-portal .site-footer{background:var(--ink);padding:36px 48px;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:14px;}
#career-portal .footer-brand{font-size:14px;font-weight:700;color:#fff;}
#career-portal .footer-links{display:flex;gap:22px;}
#career-portal .footer-links a{font-size:13px;color:rgba(255,255,255,.45);text-decoration:none;transition:color .15s;}
#career-portal .footer-links a:hover{color:#fff;}
#career-portal .footer-note{font-size:12px;color:rgba(255,255,255,.35);display:flex;align-items:center;gap:6px;}
#career-portal .footer-note .material-icons{font-size:14px;color:rgba(255,255,255,.3);}

@media(max-width:768px){
#career-portal   .topnav,.hero,.filters-strip,.content,.site-footer{padding-left:20px;padding-right:20px;}
#career-portal   .hero{padding-top:48px;padding-bottom:56px;}
#career-portal   .drawer{width:100vw;}
#career-portal }

/* ── Apply modal multi-step ──────────────────────────────── */
.apply-step { animation: fadeInUp .25s ease; }
@keyframes fadeInUp { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:translateY(0); } }
.apply-how-row { display:flex;align-items:flex-start;gap:10px;padding:6px 0;font-size:13px;color:var(--t2);line-height:1.5; }
.apply-how-row:not(:last-child) { border-bottom:1px solid var(--border2); }
.apply-how-ic { font-size:18px;color:var(--blue);flex-shrink:0;margin-top:1px; }
.ref-copy-btn { display:inline-flex;align-items:center;gap:5px;padding:6px 14px;border-radius:20px;border:1.5px solid var(--border);background:var(--bg);color:var(--t2);font-size:12px;font-weight:600;cursor:pointer;font-family:inherit;transition:all .15s; }
.ref-copy-btn:hover { border-color:var(--blue);color:var(--blue); }
.btn-primary { display:inline-flex;align-items:center;gap:6px;padding:9px 18px;border-radius:var(--rs,8px);border:none;background:var(--blue);color:#fff;font-size:13px;font-weight:600;cursor:pointer;font-family:inherit;transition:all .15s; }
.btn-primary:hover { filter:brightness(1.08); }
.btn-primary:disabled { opacity:.45;cursor:not-allowed; }
/* ── Test Data Manager ───────────────────────────────────────── */
.tdm-tab.active{color:var(--amber)!important;border-bottom-color:var(--amber)!important;font-weight:600!important;}
.tdm-tab:hover{color:var(--text)!important;}
.tdm-stat-card{background:var(--bg);border:1px solid var(--border);border-radius:var(--rs);padding:12px 14px;}
.tdm-stat-num{font-size:22px;font-weight:700;color:var(--text);line-height:1.1;}
.tdm-stat-lbl{font-size:11px;color:var(--t3);margin-top:2px;}
.tdm-ds-card{border:1px solid var(--border);border-radius:var(--rs);padding:14px 16px;display:flex;align-items:flex-start;justify-content:space-between;gap:12px;cursor:pointer;transition:all .15s;}
.tdm-ds-card:hover{border-color:var(--amber);background:var(--al);}
.tdm-ds-card.loaded{border-color:var(--green);background:var(--gl);}
/* ── Typography utility classes ─────────────────────────────── */
.label-xs{font-size:var(--text-xs);font-weight:var(--label-weight);letter-spacing:var(--label-spacing);text-transform:var(--label-transform);color:var(--t3);}
.label-sm{font-size:var(--text-xs);font-weight:var(--label-weight);letter-spacing:.05em;text-transform:var(--label-transform);color:var(--t3);margin-bottom:4px;}
.text-sm{font-size:var(--text-sm);color:var(--t3);}
.text-base{font-size:var(--text-base);color:var(--t2);}
.text-md{font-size:var(--text-md);}
.text-muted{color:var(--t3);}
.text-secondary{color:var(--t2);}
.fw-6{font-weight:600;}
.fw-7{font-weight:700;}
.mono{font-family:var(--mono);}

/* ── v2.10 Statistieken scherm ──────────────────────────────────────────── */
.stat-period-btn{font-size:12px;padding:4px 12px;border-radius:20px;border:1px solid var(--border2);background:transparent;color:var(--t2);cursor:pointer;font-family:var(--font);}
.stat-period-btn.active{background:var(--text);color:var(--bg);border-color:var(--text);}
.stat-tab-btn{font-size:13px;padding:8px 14px;border:none;border-bottom:2px solid transparent;background:transparent;color:var(--t2);cursor:pointer;font-family:var(--font);position:relative;bottom:-1px;}
.stat-tab-btn.active{color:var(--blue);border-bottom-color:var(--blue);font-weight:600;}
.stat-tab-btn.admin-tab{color:var(--purple);}
.stat-tab-btn.admin-tab.active{color:var(--purple);border-bottom-color:var(--purple);}
.stat-kpi-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px;margin-bottom:16px;}
.stat-kpi-card{background:var(--s2);border-radius:var(--rs);padding:12px 14px;}
.stat-kpi-lbl{font-size:11px;color:var(--t2);margin-bottom:5px;font-weight:600;text-transform:uppercase;letter-spacing:.04em;}
.stat-kpi-val{font-size:22px;font-weight:700;color:var(--text);line-height:1;}
.stat-kpi-sub{font-size:11px;color:var(--t3);margin-top:4px;}
.stat-chart-wrap{position:relative;height:220px;margin-bottom:6px;}
.stat-chart-label{font-size:11px;color:var(--t3);margin-bottom:8px;}
.stat-hm-table{width:100%;border-collapse:collapse;font-size:13px;}
.stat-hm-table th{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--t3);padding:8px 12px;border-bottom:1px solid var(--border2);text-align:left;}
.stat-hm-table td{padding:10px 12px;border-bottom:1px solid var(--border2);color:var(--text);}
.stat-hm-table tr:last-child td{border-bottom:none;}
.stat-hm-table tr:hover td{background:var(--s2);}


.st0{fill:var(--white);}.st1{fill:url(#SVGID_1_);}.st2{fill:url(#SVGID_00000054972652950698644030000017964670701689306506_);}.st3{fill:url(#SVGID_00000106128495029601101220000001680011480863901375_);}
.st0{fill:var(--white);}.st1{fill:url(#SVGID_1_);}.st2{fill:url(#SVGID_00000054972652950698644030000017964670701689306506_);}.st3{fill:url(#SVGID_00000106128495029601101220000001680011480863901375_);}
/* ── Thin unobtrusive scrollbar for .main ───────────────────────────────── */
.main::-webkit-scrollbar { width: 5px; }
.main::-webkit-scrollbar-track { background: transparent; }
.main::-webkit-scrollbar-thumb { background: var(--border2); border-radius: 3px; }
.main::-webkit-scrollbar-button { display: none; height: 0; }
.main { scrollbar-width: thin; scrollbar-color: var(--border2) transparent; }

/* ── Stats sprint 2: doorlooptijd + trechter ───────────────────────────── */
.stat-funnel-wrap{display:flex;align-items:stretch;gap:0;margin:16px 0;}
.stat-funnel-step{flex:1;position:relative;text-align:center;}
.stat-funnel-bar{height:52px;display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:700;border-radius:0;transition:opacity .15s;}
.stat-funnel-step:first-child .stat-funnel-bar{border-radius:var(--rs) 0 0 var(--rs);}
.stat-funnel-step:last-child  .stat-funnel-bar{border-radius:0 var(--rs) var(--rs) 0;}
.stat-funnel-lbl{font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.04em;margin-top:6px;color:var(--t2);}
.stat-funnel-pct{font-size:10px;color:var(--t3);margin-top:2px;}
.stat-funnel-arrow{position:absolute;right:-8px;top:50%;transform:translateY(-50%) translateY(-13px);font-size:16px;color:var(--border2);z-index:1;pointer-events:none;}
.stat-tt-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:10px;margin-bottom:18px;}
.stat-tt-card{background:var(--s2);border-radius:var(--rs);padding:14px 16px;display:flex;flex-direction:column;gap:4px;}
.stat-tt-lbl{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--t3);}
.stat-tt-val{font-size:26px;font-weight:700;color:var(--text);font-family:var(--mono);line-height:1;}
.stat-tt-sub{font-size:11px;color:var(--t3);}
.stat-match-bar-wrap{display:flex;align-items:center;gap:10px;margin-bottom:6px;}
.stat-match-bar-bg{flex:1;height:8px;background:var(--border2);border-radius:4px;overflow:hidden;}
.stat-match-bar-fill{height:100%;border-radius:4px;transition:width .4s ease;}

'
    + ':root{--font:"DM Sans",system-ui,sans-serif;--bg:#F7F8FA;--surface:#fff;--border:#E4E7EC;--border2:#D0D5DD;--text:#101828;--t2:#475467;--t3:#98A2B3;--blue:#2563EB;--bd:#1D4ED8;--bl:#EFF6FF;--bb:#BFDBFE;--green:#16A34A;--gl:#F0FDF4;--gb:#BBF7D0;--amber:#D97706;--amber-dark:#92400E;--al:#FFFBEB;--ab:#FDE68A;--red:#DC2626;--rl:#FEF2F2;--rb:#FECACA;--s2:#F9FAFB;--r:10px;--rs:6px;}'
    + '*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}'
    + 'body{font-family:var(--font);background:var(--bg);color:var(--text);font-size:15px;line-height:1.7;-webkit-font-smoothing:antialiased}'
    + '.vp-header{background:var(--surface);border-bottom:1px solid var(--border);padding:14px 0;position:sticky;top:0;z-index:100}'
    + '.vp-header-inner{max-width:900px;margin:0 auto;padding:0 24px;display:flex;align-items:center;justify-content:space-between;gap:16px}'
    + '.vp-company-name{font-size:15px;font-weight:700;color:var(--text)}'
    + '.vp-ref{font-family:monospace;font-size:11px;color:var(--t3);background:var(--s2);border:1px solid var(--border);border-radius:4px;padding:3px 9px;display:flex;align-items:center;gap:5px;cursor:pointer;transition:background .12s;user-select:none}'
    + '.vp-ref:hover{background:var(--border2)}'
    + '.vp-ref .material-icons{font-size:12px}'
    + '.vp-body{max-width:900px;margin:0 auto;padding:40px 24px 80px;display:grid;grid-template-columns:1fr 288px;gap:28px;align-items:start}'
    + '.vp-hero{grid-column:1/-1;padding-bottom:28px;border-bottom:1px solid var(--border);margin-bottom:4px}'
    + '.vp-hero-meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:12px}'
    + '.vp-pill{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:500;color:var(--t2);background:var(--surface);border:1px solid var(--border);border-radius:20px;padding:4px 11px}'
    + '.vp-pill .material-icons{font-size:13px;color:var(--t3)}'
    + '.vp-title{font-size:30px;font-weight:700;color:var(--text);line-height:1.2;margin-bottom:8px;letter-spacing:-.02em}'
    + '.vp-subtitle{font-size:15px;color:var(--t2)}'
    + '.vp-main{min-width:0}'
    + '.vp-section{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:26px 28px;margin-bottom:14px;box-shadow:0 2px 8px rgba(0,0,0,.06)}'
    + '.vp-sec-eyebrow{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--t3);display:flex;align-items:center;gap:8px;margin-bottom:14px}'
    + '.vp-sec-eyebrow .material-icons{font-size:13px}'
    + '.vp-sec-eyebrow::after{content:"";flex:1;height:1px;background:var(--border)}'
    + '.vp-section p{font-size:14px;color:var(--t2);line-height:1.75;margin-bottom:11px}'
    + '.vp-section p:last-child{margin-bottom:0}'
    + '.vp-section ul,.vp-section ol{padding-left:20px;margin-bottom:11px}'
    + '.vp-section li{font-size:14px;color:var(--t2);line-height:1.7;margin-bottom:5px}'
    + '.vp-behav{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:26px 28px;margin-bottom:14px;box-shadow:0 2px 8px rgba(0,0,0,.06)}'
    + '.vp-aside{position:sticky;top:72px}'
    + '.vp-aside-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:20px;margin-bottom:12px;box-shadow:0 2px 8px rgba(0,0,0,.06)}'
    + '.vp-aside-title{font-size:13px;font-weight:700;color:var(--text);margin-bottom:14px}'
    + '.vp-apply-btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;background:var(--blue);color:#fff;font-family:var(--font);font-size:14px;font-weight:700;padding:13px 20px;border-radius:var(--rs);border:none;cursor:pointer;transition:background .15s;margin-bottom:10px}'
    + '.vp-apply-btn:hover{background:var(--bd)}'
    + '.vp-apply-btn .material-icons{font-size:17px}'
    + '.vp-deadline{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--amber-dark);background:var(--al);border:1px solid var(--ab);border-radius:var(--rs);padding:8px 12px;margin-bottom:10px}'
    + '.vp-deadline .material-icons{font-size:15px;color:var(--amber);flex-shrink:0}'
    + '.vp-share-row{display:flex;gap:6px}'
    + '.vp-share-btn{flex:1;display:flex;align-items:center;justify-content:center;gap:5px;padding:7px;border:1px solid var(--border);border-radius:var(--rs);background:none;font-family:var(--font);font-size:11px;font-weight:600;color:var(--t2);cursor:pointer;transition:background .12s}'
    + '.vp-share-btn:hover{background:var(--bg)}'
    + '.vp-share-btn .material-icons{font-size:14px}'
    + '.vp-meta-row{display:flex;align-items:flex-start;gap:10px;margin-bottom:11px;font-size:13px}'
    + '.vp-meta-row:last-child{margin-bottom:0}'
    + '.vp-meta-row .material-icons{font-size:16px;color:var(--t3);flex-shrink:0;margin-top:2px}'
    + '.vp-meta-label{font-size:11px;color:var(--t3);margin-bottom:1px}'
    + '.vp-meta-value{font-weight:500;color:var(--text)}'
    + '.vp-nav-item{display:flex;align-items:center;gap:8px;padding:7px 8px;border-radius:var(--rs);font-size:12px;font-weight:500;color:var(--t2);cursor:pointer;transition:background .1s,color .1s;border:none;background:none;width:100%;text-align:left}'
    + '.vp-nav-item:hover{background:var(--bg);color:var(--text)}'
    + '.vp-nav-item .material-icons{font-size:14px;flex-shrink:0}'
    + '.vp-validated-badge{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--blue);background:var(--bl);border:1px solid var(--bb);border-radius:20px;padding:4px 11px;white-space:nowrap;flex-shrink:0}'
    + '.vp-validated-badge .material-icons{font-size:12px}'
    + '.vp-footer{border-top:1px solid var(--border);padding:20px 0}'
    + '.vp-footer-inner{max-width:900px;margin:0 auto;padding:0 24px;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}'
    + '.vp-footer-left{font-size:12px;color:var(--t3);line-height:1.6}'
    + '.btn-vd{display:inline-flex;align-items:center;gap:7px;padding:10px 20px;border-radius:var(--rs);font-family:var(--font);font-size:14px;font-weight:600;cursor:pointer;border:none;transition:background .15s}'
    + '.btn-vd .material-icons{font-size:16px}'
    + '.btn-pr{background:var(--blue);color:#fff}'
    + '.btn-pr:hover{background:var(--bd)}'
    + '.btn-sec{background:var(--surface);color:var(--text);border:1px solid var(--border2)}'
    + '.btn-sec:hover{background:var(--bg)}'
    /* Modal */
    + '.vp-modal-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:500;display:flex;align-items:center;justify-content:center}'
    + '.vp-modal{background:var(--surface);border-radius:var(--r);width:540px;max-width:95vw;max-height:90vh;overflow-y:auto;box-shadow:0 8px 40px rgba(0,0,0,.18);padding:32px}'
    + '.vp-modal-title{font-size:20px;font-weight:700;margin-bottom:6px}'
    + '.vp-gdpr-block{background:var(--bl);border:1px solid var(--bb);border-radius:var(--rs);padding:16px 18px;margin-bottom:18px}'
    + '.vp-gdpr-block-title{display:flex;align-items:center;gap:7px;font-size:13px;font-weight:700;color:var(--blue);margin-bottom:8px}'
    + '.vp-gdpr-block p{font-size:13px;color:var(--t2);line-height:1.65;margin:0}'
    + '.vp-odc-info{background:var(--s2);border:1px solid var(--border);border-radius:var(--rs);padding:16px 18px;margin-bottom:18px}'
    + '.vp-odc-info-title{font-size:13px;font-weight:700;color:var(--text);margin-bottom:10px;display:flex;align-items:center;gap:7px}'
    + '.vp-odc-step-row{display:flex;align-items:flex-start;gap:10px;font-size:13px;color:var(--t2);line-height:1.55;margin-bottom:8px}'
    + '.vp-odc-step-row .material-icons{font-size:15px;color:var(--blue);flex-shrink:0;margin-top:1px}'
    + '.vp-apply-choices{display:flex;flex-direction:column;gap:10px;margin-bottom:16px}'
    + '.vp-apply-choice{display:flex;align-items:flex-start;gap:12px;padding:14px 16px;border:1.5px solid var(--border);border-radius:var(--rs);cursor:pointer;transition:border-color .15s,background .15s;background:none;font-family:var(--font);text-align:left;width:100%}'
    + '.vp-apply-choice:hover{border-color:var(--blue);background:var(--bl)}'
    + '.vp-choice-icon{width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0}'
    + '.vp-choice-icon .material-icons{font-size:18px}'
    + '.vp-choice-title{font-size:14px;font-weight:700;color:var(--text);margin-bottom:3px}'
    + '.vp-choice-desc{font-size:12px;color:var(--t2);line-height:1.55}'
    + '.vp-form-label{font-size:11px;font-weight:600;color:var(--t2);margin-bottom:5px;letter-spacing:.03em}'
    + '.vp-input{width:100%;padding:9px 12px;border:1px solid var(--border2);border-radius:var(--rs);font-family:var(--font);font-size:13px;color:var(--text);background:var(--bg);outline:none;transition:border-color .15s,box-shadow .15s;margin-bottom:10px}'
    + '.vp-input:focus{border-color:var(--blue);box-shadow:0 0 0 3px rgba(37,99,235,.12);background:var(--surface)}'
    + '.vp-lang-btn{display:inline-flex;align-items:center;gap:7px;padding:8px 16px;border:1.5px solid var(--border2);border-radius:var(--rs);background:var(--surface);font-family:var(--font);font-size:13px;font-weight:600;color:var(--t2);cursor:pointer;transition:all .12s;margin-right:8px}'
    + '.vp-lang-btn.active{border-color:var(--blue);color:var(--blue);background:var(--bl)}'
    + '#vp-toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(80px);background:var(--text);color:#fff;padding:10px 20px;border-radius:var(--rs);font-size:13px;font-weight:500;z-index:9999;transition:transform .25s;box-shadow:0 4px 24px rgba(0,0,0,.09);pointer-events:none;white-space:nowrap}'
    + '#vp-toast.show{transform:translateX(-50%) translateY(0)}'
    + '@media(max-width:700px){.vp-body{grid-template-columns:1fr;padding:20px 16px 60px}.vp-hero{grid-column:1}.vp-aside{position:static}.vp-title{font-size:24px}}'
    + '::-webkit-scrollbar{width:5px}::-webkit-scrollbar-thumb{background:var(--border2);border-radius:3px}'
    + '
body{font-family:Arial,sans-serif;padding:32px;color:#1a1a2e;}h1{font-size:18px;}'
      + 'table{border-collapse:collapse;width:100%;margin-top:16px;}th,td{border:1px solid #ccc;padding:8px 10px;font-size:13px;text-align:left;}'
      + 'th{background:#f4f4f7;}.meta{font-size:12px;color:#666;margin-top:4px;}
