/* The Talent Poll v105 design layer - same family as the Digital Orix HRMS (hr.digitalorix.in/theme.css)
   plus Talent Poll's own AI layer (AI core, ask bar, score ring, talent field).
   Loaded last from base.html only when Super-admin > Global settings > "New design" is ON.
   Turning that off removes this file and tp-ai.js, and the app is exactly the previous look.
   Every rule is scoped under html.ui-v2 so it outranks page-level <style> blocks without !important. */

/* ── Tokens: the old variable names are remapped, so inline styles that use var(--x) follow ── */
html.ui-v2{
  --ink:#101828; --brand:#4F46E5; --brand-dark:#4338CA; --accent:#E0603F;
  --bg:#F5F6F8; --surface:#FFFFFF; --line:#E4E7EC; --muted:#667085;
  --success:#067647; --danger:#D92D20; --radius:12px;
  --track:#EEF0F4; --brand-tint:#EEF2FF; --hover:#F2F4F7; --field:#FFFFFF;
  --panel:#F9FAFB; --success-tint:#ECFDF3; --danger-tint:#FEF3F2; --warn-tint:#FFFAEB; --warn:#B54708;
  --shadow:0 1px 2px rgba(16,24,40,.05); --shadow-sm:0 1px 2px rgba(16,24,40,.05);
  /* HRMS --ui-* names, so one change can later serve both apps */
  --ui-bg:var(--bg); --ui-card:var(--surface); --ui-line:var(--line); --ui-line-strong:#D0D5DD;
  --ui-text:var(--ink); --ui-soft:var(--muted); --ui-accent:var(--brand); --ui-accent-hover:var(--brand-dark);
  --ui-accent-soft:var(--brand-tint); --ui-radius:12px; --ui-radius-sm:8px;
  --ui-side:#0B1220; --ui-side-line:rgba(148,163,184,.12);
  --side-fg:#A5B0C2; --side-dim:#5B677A; --side-hover:rgba(148,163,184,.10); --side-active:rgba(99,102,241,.22); --side-mark:#818CF8;
  /* AI layer */
  --ai-a:#6366F1; --ai-b:#F2876E; --ai-glow:rgba(99,102,241,.28);
  --btn-bg:#4F46E5; --btn-bg-hover:#4338CA;
  --font:Inter, system-ui, -apple-system, "Segoe UI", sans-serif;
  --mono:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}
html.ui-v2[data-theme="dark"]{
  --ink:#EEF1F8; --brand:#8B93F8; --brand-dark:#A5ABFA; --accent:#F2876E;
  --bg:#0B1220; --surface:#111A2E; --line:#243049; --muted:#98A3BB;
  --success:#3FCB93; --danger:#F2796B;
  --track:#1C2640; --brand-tint:rgba(129,140,248,.14); --hover:rgba(148,163,184,.10); --field:#0E1628;
  --panel:#16203A; --success-tint:rgba(63,203,147,.14); --danger-tint:rgba(242,121,107,.14); --warn-tint:rgba(240,180,70,.14); --warn:#F0B446;
  --shadow:0 1px 2px rgba(0,0,0,.4); --shadow-sm:0 1px 2px rgba(0,0,0,.4);
  --ui-line-strong:#33405E; --ui-side:#070C17; --ui-side-line:rgba(148,163,184,.14);
  --ai-glow:rgba(129,140,248,.35);
  --btn-bg:#6366F1; --btn-bg-hover:#7C7FF4;
  color-scheme:dark;
}

/* ── Type: Inter everywhere (HRMS), monospace only where a page asks for it ── */
html.ui-v2 body{font-family:var(--font);font-size:15px;color:var(--ink);background:var(--bg);-webkit-font-smoothing:antialiased}
html.ui-v2 body :not(code,pre,kbd,samp,svg,svg *,[style*="monospace"],[class*="mono"]){font-family:inherit}
html.ui-v2 [style*="Plus Jakarta"]{font-family:var(--font)!important}
html.ui-v2 #chatw, html.ui-v2 #chatw *{font-family:var(--font)}
html.ui-v2 code, html.ui-v2 kbd, html.ui-v2 pre{font-family:var(--mono)}
html.ui-v2 h1, html.ui-v2 h2, html.ui-v2 h3, html.ui-v2 .display{letter-spacing:-.015em;color:var(--ink)}
html.ui-v2 h1.page{font-size:24px;font-weight:700;line-height:1.25;margin-top:6px}
html.ui-v2 .eyebrow{font-size:11px;font-weight:600;letter-spacing:.06em;color:var(--muted)}
html.ui-v2 .lede{color:var(--muted);font-size:14.5px}
html.ui-v2 .sectlabel{font-size:11px;font-weight:600;letter-spacing:.06em;color:var(--muted)}
html.ui-v2 .hint{color:var(--muted)}
html.ui-v2 a{color:var(--brand)}
html.ui-v2 ::selection{background:rgba(99,102,241,.22)}
html.ui-v2 :focus-visible{outline:2px solid var(--brand);outline-offset:2px}

/* faded logo watermark is replaced by the plain HRMS canvas */
html.ui-v2 .wm{display:none!important}

/* ── App shell: navy sidebar ── */
html.ui-v2 .sidebar{width:232px;background:var(--ui-side);border-right:1px solid var(--ui-side-line);padding:14px 10px 12px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:rgba(148,163,184,.25) transparent}
html.ui-v2 .sb-brand{color:#fff;font-weight:700;font-size:15px;letter-spacing:-.01em;padding:4px 6px 14px;margin-bottom:6px;border-bottom:1px solid var(--ui-side-line);gap:10px}
html.ui-v2 .sb-brand img{height:36px;max-width:150px;background:#fff;border-radius:9px;padding:4px 6px;object-fit:contain}
html.ui-v2 .sb-brand .dot{width:34px;height:34px;border-radius:9px;background:#fff;color:#0B1220;font-size:14px;font-weight:800;box-shadow:none}
html.ui-v2 .sb-nav{gap:1px}
html.ui-v2 .sb-nav a{color:var(--side-fg);font-weight:500;font-size:13.5px;padding:7px 10px;min-height:34px;border-radius:8px;gap:10px}
html.ui-v2 .sb-nav a svg{width:16px;height:16px;opacity:.85}
html.ui-v2 .sb-nav a:hover{background:var(--side-hover);color:#E5E7EB}
html.ui-v2 .sb-nav a.active{background:var(--side-active);color:#fff}
html.ui-v2 .sb-nav a.active::before{content:"";position:absolute;left:0;top:7px;bottom:7px;width:3px;border-radius:2px;background:var(--side-mark)}
html.ui-v2 .sb-grp{padding:14px 10px 4px;font-size:10.5px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--side-dim)}
html.ui-v2 .sb-badge{background:var(--ai-b);color:#fff}
html.ui-v2 .sb-foot{border-top:1px solid var(--ui-side-line);padding-top:10px}
html.ui-v2 .sb-ai{display:flex;align-items:center;gap:10px;padding:8px 10px 10px;margin-bottom:4px}
html.ui-v2 .sb-ai b{display:block;color:#E5E7EB;font-size:12.5px;font-weight:600;line-height:1.2}
html.ui-v2 .sb-ai small{display:block;color:var(--side-dim);font-size:11px;line-height:1.3}

/* top bar */
html.ui-v2 .apptop{background:color-mix(in srgb,var(--surface) 92%,transparent);backdrop-filter:saturate(1.4) blur(8px);-webkit-backdrop-filter:saturate(1.4) blur(8px);border-bottom:1px solid var(--line);padding:9px 22px;min-height:58px}
html.ui-v2 .apptitle{display:flex;flex-direction:column;min-width:0;font-weight:650;font-size:17px;letter-spacing:-.01em;line-height:1.2}
html.ui-v2 .apptitle small{font-size:10.5px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
html.ui-v2 .apptitle b{font-weight:650;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html.ui-v2 .tp-askbtn{flex:1;max-width:400px;margin-left:auto;display:flex;align-items:center;gap:9px;border:1px solid var(--line);background:var(--panel);color:var(--muted);border-radius:10px;padding:8px 10px;font-size:13.5px;cursor:pointer;text-align:left;min-width:0;transition:border-color .15s,background .15s}
html.ui-v2 .tp-askbtn:hover{border-color:var(--brand);background:var(--surface)}
html.ui-v2 .tp-askbtn svg{width:16px;height:16px;flex:none}
html.ui-v2 .tp-askbtn span{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html.ui-v2 .tp-askbtn kbd, html.ui-v2 .tp-ask kbd{font-family:var(--font);font-size:11px;border:1px solid var(--line);background:var(--surface);border-radius:6px;padding:1px 6px;color:var(--muted);flex:none}
html.ui-v2 .apptop-right{margin-left:12px}
html.ui-v2 .theme-toggle{width:36px;height:36px;border-radius:10px;border:1px solid var(--line);background:var(--surface)}
html.ui-v2 .avatar{width:34px;height:34px;background:var(--brand-tint);color:var(--brand);font-weight:700;font-size:12.5px}
html.ui-v2 .hamb{border-color:var(--line);color:var(--ink);background:var(--surface)}
html.ui-v2 body.has-shell .wrap{padding:22px 24px 40px;max-width:1360px}

/* pages without the shell (log in, sign up, applicant pages, public pages) */
html.ui-v2 .topbar{background:color-mix(in srgb,var(--surface) 92%,transparent);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
html.ui-v2 .brand{font-weight:700;font-size:16px;letter-spacing:-.01em;color:var(--ink)}
html.ui-v2 .brand .dot{border-radius:8px;background:linear-gradient(135deg,var(--ai-a),#4338CA);box-shadow:none}
html.ui-v2 .nav a{font-weight:500;color:var(--muted)}
html.ui-v2 .nav a:hover{background:var(--hover);color:var(--brand)}

/* ── Cards and surfaces: white, thin border, 12px, barely-there shadow ── */
html.ui-v2 .card{background:var(--surface);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);padding:22px}
html.ui-v2 .sec{border-radius:12px;border-color:var(--line);background:var(--surface)}
html.ui-v2 .sec h3{font-size:15px;font-weight:650}
html.ui-v2 .stat{border-radius:12px;background:var(--surface);border-color:var(--line);box-shadow:var(--shadow);padding:16px 18px}
html.ui-v2 .stat .n{font-size:26px;font-weight:700;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
html.ui-v2 .stat .l{font-size:12.5px}
html.ui-v2 a.stat:hover{border-color:var(--brand)}
@media (min-width:1100px){ html.ui-v2 .stats{grid-template-columns:repeat(4,minmax(0,1fr))} }
html.ui-v2 .pl{border-radius:10px}
html.ui-v2 .joblist li{border-radius:12px;border-color:var(--line)}
html.ui-v2 .joblist li:hover{border-color:color-mix(in srgb,var(--brand) 45%,var(--line))}
html.ui-v2 .joblist .jt{font-weight:600}
html.ui-v2 .empty .ico{border-radius:12px}
html.ui-v2 .role{border-radius:10px;border-width:1px}
html.ui-v2 .role .rn{font-weight:600}
html.ui-v2 .role:hover{box-shadow:none;border-color:var(--brand);background:var(--brand-tint)}

/* ── Buttons: 8px corners, quieter weight ── */
html.ui-v2 .btn{border-radius:8px;font-weight:600;font-size:14.5px;padding:11px 16px;border-width:1px;letter-spacing:0}
html.ui-v2 .btn.sm{padding:8px 13px;font-size:13.5px;border-radius:8px}
html.ui-v2 .btn-primary, html.ui-v2 a.btn-primary{background:var(--btn-bg);color:#fff}
html.ui-v2 .btn-primary:hover, html.ui-v2 a.btn-primary:hover{background:var(--btn-bg-hover);color:#fff}
html.ui-v2 .btn-ghost, html.ui-v2 a.btn-ghost{background:var(--surface);color:var(--ink);border-color:var(--ui-line-strong)}
html.ui-v2 .btn-ghost:hover, html.ui-v2 a.btn-ghost:hover{border-color:var(--brand);color:var(--brand)}
html.ui-v2 .btn-accent, html.ui-v2 a.btn-accent{background:var(--accent);color:#fff}
html.ui-v2 .copybtn{border-radius:8px;font-weight:600;color:var(--brand);background:var(--surface)}

/* ── Inputs ── */
html.ui-v2 input[type=text], html.ui-v2 input[type=email], html.ui-v2 input[type=password], html.ui-v2 input[type=number],
html.ui-v2 input[type=datetime-local], html.ui-v2 input[type=date], html.ui-v2 input[type=tel], html.ui-v2 input[type=url],
html.ui-v2 input[type=search], html.ui-v2 input[type=file], html.ui-v2 select, html.ui-v2 textarea{
  border:1px solid var(--ui-line-strong);border-radius:8px;padding:10px 12px;font-size:14.5px;background:var(--field);color:var(--ink)}
html.ui-v2 input:focus, html.ui-v2 select:focus, html.ui-v2 textarea:focus{border-color:var(--brand);box-shadow:0 0 0 3px rgba(99,102,241,.16);outline:none}
html.ui-v2 label.f{font-weight:600;font-size:13.5px;color:var(--ink)}
html.ui-v2 input[type=checkbox], html.ui-v2 input[type=radio]{accent-color:var(--brand)}

/* ── Chips, pills, tags ── */
html.ui-v2 .pill{font-weight:600;font-size:11.5px;padding:3px 10px;border-radius:999px}
html.ui-v2 .pill.open{background:var(--success-tint);color:var(--success)}
html.ui-v2 .pill.draft{background:var(--warn-tint);color:var(--warn)}
html.ui-v2 .pill.closed{background:var(--hover);color:var(--muted)}
html.ui-v2 .vchip{font-weight:600;padding:3px 9px}
html.ui-v2 .tag{font-weight:600}
html.ui-v2 .pchip span{border-radius:999px;font-size:13px}
html.ui-v2 .pchip input:checked+span{background:var(--brand);border-color:var(--brand);color:#fff}

/* ── Tables: compact rows, quiet headers (HRMS) ── */
html.ui-v2 .wrap table{font-size:13.5px;border-collapse:collapse}
html.ui-v2 .wrap thead th, html.ui-v2 .wrap th{font-size:11px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--muted)}
html.ui-v2 .wrap thead{background:var(--panel)}
html.ui-v2 .wrap tbody tr:hover{background:var(--panel)}

/* ── Messages and notes ── */
html.ui-v2 .msg{border-radius:10px;font-size:13.5px;border:1px solid transparent}
html.ui-v2 .msg.success{background:var(--success-tint);color:var(--success);border-color:color-mix(in srgb,var(--success) 25%,transparent)}
html.ui-v2 .msg.error{background:var(--danger-tint);color:var(--danger);border-color:color-mix(in srgb,var(--danger) 25%,transparent)}
html.ui-v2 .callout{background:var(--brand-tint);border-color:color-mix(in srgb,var(--brand) 25%,transparent);border-radius:12px}
html.ui-v2 .callout .ct{color:var(--ink)}
html.ui-v2 .ai-note{position:relative;background:linear-gradient(90deg,rgba(99,102,241,.07),rgba(242,135,110,.08));border:1px solid color-mix(in srgb,var(--ai-a) 22%,var(--line));color:var(--ink);border-radius:12px}
html.ui-v2 .ai-note .spark{width:18px;height:18px;flex:none;font-size:0;margin-top:1px;border-radius:50%;background:conic-gradient(var(--ai-a),var(--ai-b),var(--ai-a));-webkit-mask:radial-gradient(circle,transparent 4.5px,#000 5.5px);mask:radial-gradient(circle,transparent 4.5px,#000 5.5px);animation:tpSpin 6s linear infinite}
html.ui-v2 .linkbox{background:var(--panel);border:1px dashed var(--ui-line-strong);border-radius:10px}
html.ui-v2 .steps .s{height:5px}
html.ui-v2 .steps .s.now{background:linear-gradient(90deg,var(--ai-a),var(--ai-b))}
html.ui-v2 .gstep .gn{border-radius:8px;background:var(--brand)}
html.ui-v2 .legalfoot, html.ui-v2 .legalfoot a{color:var(--muted)}
html.ui-v2 .modal{border-radius:14px;border:1px solid var(--line)}
html.ui-v2 .modal-ov{background:rgba(16,24,40,.5)}

/* ── AI core: the one living mark of the AI. Idle breathes, thinking spins, done turns green ── */
.tp-core{--s:26px;position:relative;display:inline-block;width:var(--s);height:var(--s);flex:none}
.tp-core > i{position:absolute;display:block;border-radius:50%;font-style:normal}
.tp-core .r{inset:0;padding:2px;background:conic-gradient(from 0deg,var(--ai-a),var(--ai-b),transparent 62%,var(--ai-a));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:tpSpin 8s linear infinite}
.tp-core .r2{inset:16%;padding:2px;opacity:.5;background:conic-gradient(from 180deg,var(--ai-b),var(--ai-a),transparent 60%,var(--ai-b));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:tpSpin 12s linear infinite reverse}
.tp-core .h{inset:27%;background:radial-gradient(circle at 35% 30%,#C7C9FF,var(--ai-a) 50%,var(--ai-b) 120%);box-shadow:0 0 14px var(--ai-glow);animation:tpBreathe 4s ease-in-out infinite}
.tp-core .o{inset:-10%;opacity:0;transition:opacity .3s}
.tp-core .o::before, .tp-core .o::after{content:"";position:absolute;top:50%;left:50%;width:7px;height:7px;margin:-3.5px;border-radius:50%;background:var(--ai-b);box-shadow:0 0 8px var(--ai-b)}
.tp-core .o::before{transform:rotate(0deg) translateX(calc(var(--s) * .6))}
.tp-core .o::after{transform:rotate(180deg) translateX(calc(var(--s) * .6));background:var(--ai-a);box-shadow:0 0 8px var(--ai-a)}
.tp-core.sm{--s:24px}
.tp-core.md{--s:44px}
.tp-core.lg{--s:72px;margin:0 auto 16px;display:block}
.tp-core[data-state="thinking"] .r{animation-duration:1.1s}
.tp-core[data-state="thinking"] .r2{animation-duration:1.7s}
.tp-core[data-state="thinking"] .h{animation-duration:1s}
.tp-core[data-state="thinking"] .o{opacity:1;animation:tpSpin 2.2s linear infinite}
.tp-core[data-state="done"] .r{background:#12B76A;animation:none}
.tp-core[data-state="done"] .r2{opacity:0}
.tp-core[data-state="done"] .h{background:radial-gradient(circle at 35% 30%,#A6F4C5,#12B76A);box-shadow:0 0 12px rgba(18,183,106,.35);animation:none}

/* AI working overlay */
html.ui-v2 #ai-overlay{background:color-mix(in srgb,var(--bg) 70%,transparent);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
html.ui-v2 .ai-ov-card{border-radius:14px;border:1px solid var(--line);box-shadow:0 12px 40px rgba(16,24,40,.14);padding:28px 30px}
html.ui-v2 .ai-ov-card b{font-weight:650;font-size:16px}
html.ui-v2 .ai-ov-bar i{background:linear-gradient(90deg,var(--ai-a),var(--ai-b))}

/* ── Ask bar (Ctrl K / Cmd K) ── */
.tp-ask-ov{position:fixed;inset:0;z-index:10000;background:rgba(16,24,40,.42);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);display:flex;align-items:flex-start;justify-content:center;padding:12vh 16px 16px}
.tp-ask-ov[hidden]{display:none}
.tp-ask{width:100%;max-width:580px;background:var(--surface);border:1px solid var(--line);border-radius:14px;box-shadow:0 24px 60px rgba(16,24,40,.25);overflow:hidden;position:relative}
.tp-ask::before{content:"";position:absolute;inset:0 0 auto;height:2px;background:linear-gradient(90deg,var(--ai-a),var(--ai-b),var(--ai-a));background-size:200% 100%;animation:tpSlide 2.4s linear infinite}
.tp-ask-in{display:flex;align-items:center;gap:10px;padding:14px 16px;border-bottom:1px solid var(--line)}
.tp-ask-in svg{width:18px;height:18px;color:var(--muted);flex:none}
html.ui-v2 .tp-ask-in input{flex:1;min-width:0;border:0;padding:4px 0;font-size:16px;background:transparent;box-shadow:none;color:var(--ink)}
html.ui-v2 .tp-ask-in input:focus{box-shadow:none}
.tp-ask-list{max-height:min(52vh,420px);overflow-y:auto;padding:6px}
.tp-ask-sec{font-size:10.5px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);padding:10px 10px 4px}
.tp-ask-item{display:flex;align-items:center;gap:11px;width:100%;padding:9px 10px;border-radius:9px;color:var(--ink);font-size:14px;text-decoration:none;cursor:pointer;border:0;background:transparent;text-align:left}
html.ui-v2 a.tp-ask-item{color:var(--ink)}
.tp-ask-item svg{width:16px;height:16px;color:var(--muted);flex:none}
.tp-ask-item .ic{width:28px;height:28px;border-radius:8px;display:grid;place-items:center;background:var(--panel);border:1px solid var(--line);flex:none}
.tp-ask-item .tx{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tp-ask-item .go{font-size:12px;color:var(--muted)}
.tp-ask-item.sel, .tp-ask-item:hover{background:var(--brand-tint)}
.tp-ask-item.sel .ic{border-color:color-mix(in srgb,var(--brand) 40%,var(--line))}
.tp-ask-foot{display:flex;gap:14px;flex-wrap:wrap;padding:9px 14px;border-top:1px solid var(--line);font-size:12px;color:var(--muted);background:var(--panel)}
.tp-ask-empty{padding:18px 12px;color:var(--muted);font-size:13.5px}

/* ── Dashboard: AI briefing + flowing pipeline ── */
.tp-brief{display:flex;gap:14px;align-items:flex-start;border:1px solid var(--line);border-radius:12px;padding:16px 18px;margin:12px 0 16px;background:linear-gradient(120deg,rgba(99,102,241,.06),rgba(242,135,110,.05) 70%,transparent),var(--surface)}
.tp-brief .tx{flex:1;min-width:0}
.tp-brief .eb{font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.tp-brief h2{font-size:18px;font-weight:700;margin:3px 0 2px;letter-spacing:-.01em}
.tp-brief p{margin:0;color:var(--muted);font-size:13.5px}
.tp-todo{display:grid;gap:8px;margin-top:12px}
html.ui-v2 a.tp-todo-i{display:flex;align-items:center;gap:10px;padding:9px 12px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--ink);font-size:13.5px}
html.ui-v2 a.tp-todo-i:hover{border-color:var(--brand);background:var(--brand-tint)}
.tp-todo-i .n{font-variant-numeric:tabular-nums;font-size:12px;font-weight:600;color:var(--brand);background:var(--brand-tint);padding:2px 8px;border-radius:6px;flex:none}
.tp-todo-i .t{flex:1;min-width:0}
.tp-todo-i .t small{color:var(--muted);font-size:12.5px}
.tp-todo-i .go{color:var(--muted);font-size:12.5px;flex:none}

.tp-river-wrap{overflow-x:auto;margin:4px -4px 10px;padding:6px 4px 8px;scrollbar-width:thin}
.tp-river{display:flex;align-items:flex-start;min-width:860px}
html.ui-v2 a.tp-node{flex:none;width:78px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:5px;color:var(--ink);border-radius:10px;padding:4px 2px}
html.ui-v2 a.tp-node:hover .c{border-color:var(--brand)}
.tp-node .c{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;font-size:14px;font-weight:700;font-variant-numeric:tabular-nums;border:1px solid var(--line);background:var(--surface);position:relative;color:var(--muted)}
.tp-node.has .c{border-color:color-mix(in srgb,var(--brand) 50%,var(--line));background:var(--brand-tint);color:var(--brand)}
.tp-node.hot .c::after{content:"";position:absolute;inset:-6px;border-radius:50%;border:1.5px solid var(--brand);animation:tpPing 2.2s ease-out infinite}
.tp-node .lb{font-size:11.5px;color:var(--muted);line-height:1.3}
.tp-node .st{font-size:10.5px;color:var(--muted);opacity:.8}
.tp-pipe{flex:1;height:2px;margin-top:24px;background:var(--line);position:relative;overflow:hidden;border-radius:2px;min-width:14px}
.tp-pipe.flow i{position:absolute;top:-2px;width:6px;height:6px;border-radius:50%;background:var(--ai-a);box-shadow:0 0 6px var(--ai-a);animation:tpFlow 2.6s linear infinite}
.tp-pipe.flow i + i{animation-delay:1.3s;background:var(--ai-b);box-shadow:0 0 6px var(--ai-b)}

/* ── Candidate page: score ring ── */
.tp-score{display:flex;gap:16px;align-items:center;margin:4px 0 8px}
.tp-ring{--p:0;--c:var(--success);width:84px;height:84px;border-radius:50%;flex:none;display:grid;place-items:center;position:relative;
  background:conic-gradient(var(--c) calc(var(--p) * 1%),var(--track) 0)}
.tp-ring::before{content:"";position:absolute;inset:8px;border-radius:50%;background:var(--surface)}
.tp-ring b{position:relative;font-size:24px;font-weight:700;letter-spacing:-.02em;font-variant-numeric:tabular-nums;line-height:1}
.tp-ring small{position:absolute;bottom:17px;font-size:9.5px;color:var(--muted);letter-spacing:.04em}
.tp-ring.top_fit, .tp-ring.best_fit{--c:#12B76A}
.tp-ring.not_fit, .tp-ring.can_consider{--c:#F79009}
.tp-ring.reject{--c:#F04438}
.tp-score .ex{flex:1;min-width:0;font-size:13px;color:var(--muted)}
.tp-score .ex .who{display:flex;align-items:center;gap:8px;color:var(--ink);font-weight:600;font-size:13.5px;margin-bottom:3px}

/* ── CV upload: watch it read ── */
.tp-read{display:flex;align-items:center;gap:14px;margin:6px 0 10px}
.tp-read .tx{font-size:13px;color:var(--muted)}
.tp-read .tx b{color:var(--ink);font-weight:600;display:block;font-size:14px}
html.ui-v2 #bar{background:linear-gradient(90deg,var(--ai-a),var(--ai-b))!important;position:relative;overflow:hidden}
html.ui-v2 #notes > div{animation:tpPop .35s ease both;padding:6px 10px;border-radius:8px;background:var(--panel);margin-top:6px}

/* ── Log in / sign up: talent field behind the form ── */
.tp-authfield{position:fixed;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;opacity:.55}
html.ui-v2 body.tp-auth .wrap{position:relative;z-index:1}
html.ui-v2 body.tp-auth .card{box-shadow:0 12px 40px rgba(16,24,40,.08)}

/* ── Chat widget ── */
html.ui-v2 #chatw .launch{background:var(--btn-bg);box-shadow:0 8px 24px rgba(79,70,229,.35)}
html.ui-v2 #chatw .head{background:var(--btn-bg)}
html.ui-v2 #chatw .b.me{background:var(--btn-bg)}
html.ui-v2 #chatw .foot button{background:var(--btn-bg)}
html.ui-v2 #chatw .panel{border-radius:14px}

/* ── Dark mode details ── */
html.ui-v2[data-theme="dark"] .apptop, html.ui-v2[data-theme="dark"] .topbar{background:color-mix(in srgb,var(--surface) 88%,transparent)}
html.ui-v2[data-theme="dark"] .btn-primary, html.ui-v2[data-theme="dark"] a.btn-primary{background:var(--btn-bg);color:#fff}
html.ui-v2[data-theme="dark"] .btn-primary:hover, html.ui-v2[data-theme="dark"] a.btn-primary:hover{background:var(--btn-bg-hover)}
html.ui-v2[data-theme="dark"] .pill.open{background:var(--success-tint);color:var(--success)}
html.ui-v2[data-theme="dark"] .pill.draft{background:var(--warn-tint);color:var(--warn)}
html.ui-v2[data-theme="dark"] .msg.success{background:var(--success-tint);color:var(--success)}
html.ui-v2[data-theme="dark"] .msg.error{background:var(--danger-tint);color:var(--danger)}
html.ui-v2[data-theme="dark"] .callout{background:var(--brand-tint)}
html.ui-v2[data-theme="dark"] .callout .ct{color:var(--ink)}
html.ui-v2[data-theme="dark"] .ai-note{color:var(--ink)}
html.ui-v2[data-theme="dark"] .linkbox{background:var(--panel);border-color:var(--ui-line-strong)}
html.ui-v2[data-theme="dark"] .tp-ask-ov, html.ui-v2[data-theme="dark"] .modal-ov{background:rgba(0,0,0,.6)}
html.ui-v2[data-theme="dark"] .tp-authfield{opacity:.7}

/* ── Phones ── */
@media (max-width:860px){
  html.ui-v2 .sidebar{width:248px}
  html.ui-v2 .apptop{padding:8px 14px;gap:10px}
  html.ui-v2 .tp-askbtn{flex:0 0 auto;margin-left:auto;padding:8px;width:38px;justify-content:center}
  html.ui-v2 .tp-askbtn span, html.ui-v2 .tp-askbtn kbd{display:none}
  html.ui-v2 .apptop-right{margin-left:0}
  html.ui-v2 body.has-shell .wrap{padding:16px 14px 64px}
}
@media (max-width:640px){
  html.ui-v2 .card{padding:16px}
  html.ui-v2 h1.page{font-size:21px}
  html.ui-v2 input, html.ui-v2 select, html.ui-v2 textarea{font-size:16px}
  html.ui-v2 .apptitle{font-size:15.5px}
  .tp-brief{padding:14px}
  .tp-brief > .tp-core{display:none}
  html.ui-v2 .crm-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .tp-todo-i .t small{display:block}
  .tp-ask-ov{padding-top:8vh}
  .tp-ask-foot{display:none}
}

@keyframes tpSpin{to{transform:rotate(360deg)}}
@keyframes tpBreathe{50%{transform:scale(.9);filter:brightness(1.12)}}
@keyframes tpSlide{to{background-position:-200% 0}}
@keyframes tpFlow{from{left:-8px}to{left:100%}}
@keyframes tpPing{from{transform:scale(.9);opacity:.8}to{transform:scale(1.45);opacity:0}}
@keyframes tpPop{from{opacity:0;transform:translateY(-4px)}}

@media (prefers-reduced-motion:reduce){
  .tp-core *, .tp-core .o::before, .tp-core .o::after, .tp-pipe i, .tp-node .c::after, .tp-ask::before, html.ui-v2 .ai-note .spark{animation:none!important}
  .tp-pipe.flow i{display:none}
}

/* ── Dark is the default in the new design: boxes that hard-code light colours get dark equivalents ── */
html.ui-v2[data-theme="dark"] [style*="background:#fff;"], html.ui-v2[data-theme="dark"] [style*="background:#fff\""]{background:var(--surface)!important}
html.ui-v2[data-theme="dark"] [style*="background:#FFF4E5"]{background:var(--warn-tint)!important}
html.ui-v2[data-theme="dark"] [style*="color:#8A5A00"]{color:var(--warn)!important}
html.ui-v2[data-theme="dark"] [style*="border:1px solid #F0C36D"]{border-color:color-mix(in srgb,var(--warn) 45%,transparent)!important}
html.ui-v2[data-theme="dark"] [style*="color:#16203A"], html.ui-v2[data-theme="dark"] [style*="color:#1f2430"]{color:var(--ink)!important}
html.ui-v2[data-theme="dark"] [style*="color:#4a5163"]{color:var(--muted)!important}
html.ui-v2[data-theme="dark"] #visPop > div{box-shadow:0 10px 40px rgba(0,0,0,.6)!important}
html.ui-v2[data-theme="dark"] .act .menu{background:var(--surface);box-shadow:0 10px 34px rgba(0,0,0,.5)}
html.ui-v2[data-theme="dark"] .chip.closed{background:var(--warn-tint);color:var(--warn)}
html.ui-v2[data-theme="dark"] .chip.flagged{background:var(--danger-tint);color:var(--danger)}
html.ui-v2[data-theme="dark"] .vbadge{background:var(--success-tint);color:var(--success)}