/* ============================================================================================
   Jobshelf v3 — "Shelf" design layer (2026-10-16)
   Structure and details follow the Shalvera system; colours are Jobshelf's own (violet -> blue).
   Loaded after style.css: it restyles the shared components; page-specific layouts stay in style.css.
   Rules of the system:
   - one two-stop gradient (violet A -> blue B) is the brand; secondary controls use it at low alpha
   - selected things get gradient TEXT over a 14% accent wash (nav, tabs, chips, rows)
   - every panel has a soft accent glow in its top-right corner; hairline borders (white 5-8%)
   - controls are pills; containers 28 > 24 > 18 > 12px as they nest
   - serif (Source Serif 4) for display titles, Inter for UI; uppercase micro-labels at +.14em
   - 180ms ease everywhere, 1px lifts, nothing bounces
   ============================================================================================ */
:root{
  --acc-a:#8B5CF6;--acc-a-rgb:139,92,246;
  --acc-b:#4FA8FF;--acc-b-rgb:79,168,255;
  --acc-rgb:112,124,250;            /* midpoint: every tint, glow, wash, focus ring */
  --acc-line-rgb:150,142,252;       /* accent borders (a touch lighter than mid) */
  --acc-hover-a:#9D78FA;--acc-hover-b:#6CB8FF;
  --tg-a:#C9B8FF;--tg-b:#9CCBFF;    /* pastel pair for gradient TEXT */
  --ink-0:#08080D;--ink-1:#0D0D14;--ink-2:#13131C;--ink-3:#1A1A26;--ink-4:#222232;
  --text:#E7E7EF;--text-soft:rgba(226,226,240,.78);--mutd:#8F8FA3;--lav:rgba(201,190,255,.86);
  --hair:rgba(255,255,255,.06);--hair-2:rgba(255,255,255,.08);--hair-3:rgba(255,255,255,.12);
  --gutter:clamp(16px,3.6vw,38px);--section-gap:24px;
  --r-xs:8px;--r-s:12px;--r-in:14px;--r-field:16px;--r-m:18px;--r-tile:20px;--r-card:24px;--r-panel:28px;--r-pill:999px;
  --sh-card:0 14px 34px rgba(0,0,0,.30);--sh-soft:0 18px 42px rgba(0,0,0,.34);--sh-modal:0 26px 60px rgba(0,0,0,.5);
  --t3:180ms ease;--t-fast:140ms ease;
  --serif:'Source Serif 4',Georgia,'Times New Roman',serif;
  /* legacy tokens re-pointed so the older rules pick up the new palette */
  --grad:linear-gradient(135deg,var(--acc-a) 0%,#7C6CF2 35%,#5B8DEF 65%,var(--acc-b) 100%);
  --grad-btn:linear-gradient(135deg,var(--acc-a),var(--acc-b));
  --txt:var(--text);--head:#F6F6FB;--mut:var(--mutd);--info:#7FB6FF;
  --line:var(--hair);--b1:var(--hair);--b2:var(--hair-2);--b3:var(--hair-3);
  --s1:rgba(255,255,255,.025);--s2:rgba(255,255,255,.04);--s3:rgba(255,255,255,.07);
  --r:12px;--r-lg:24px;--r-xl:28px;--r-sm:10px;
}
html,body{overflow-x:clip}html{color-scheme:dark}
body{letter-spacing:-.01em;color:var(--text);
  background:radial-gradient(circle at top left,rgba(var(--acc-a-rgb),.14),transparent 30%),
             radial-gradient(circle at top right,rgba(var(--acc-b-rgb),.11),transparent 26%),
             radial-gradient(circle at top right,rgba(255,255,255,.03),transparent 24%),
             linear-gradient(180deg,var(--ink-2) 0%,var(--ink-1) 46%,var(--ink-0) 100%) fixed}
body::before{display:none}
::selection{background:rgba(var(--acc-rgb),.36);color:#fff}
:focus-visible{outline:2px solid rgba(var(--acc-rgb),.55);outline-offset:4px;border-radius:var(--r-s)}
::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:rgba(var(--acc-line-rgb),.28);border-radius:999px;border:2px solid var(--ink-1)}
::-webkit-scrollbar-thumb:hover{background:rgba(var(--acc-line-rgb),.42)}
*{scrollbar-color:rgba(var(--acc-line-rgb),.32) transparent}
a{color:#A9C9FF}a:hover{color:#CFE1FF}

/* ---------- type ---------- */
.serif,h1.title{font-family:var(--serif)}
.eyebrow{display:inline-block;font-size:.8rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--mutd);margin:0 0 12px}
h1.title{font-weight:700;font-size:clamp(2.25rem,4vw,3.5rem);line-height:.98;letter-spacing:-.02em;color:var(--head);margin:0 0 6px;text-wrap:balance}
h1.title .grad,.grad{background:linear-gradient(100deg,var(--tg-a),var(--tg-b));-webkit-background-clip:text;background-clip:text;color:transparent}
.rule{display:none}
.lede{color:var(--text-soft);font-size:1rem;line-height:1.7;max-width:64ch;margin:10px 0 0}
h2{font-size:1.4rem;font-weight:700;line-height:1.15}
.card h3,.zone h3{font-size:.8rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--mutd);margin:0 0 14px;display:flex;align-items:center;gap:8px}
.card h3.serif,.dochead h3{font-family:var(--serif);font-size:1.35rem;letter-spacing:-.01em;text-transform:none;color:var(--head)}
.muted{color:var(--mutd)}
.small{font-size:.82rem}
.num,.stat b,.funnel .f b{font-variant-numeric:tabular-nums}

/* ---------- header (the old sidebar becomes a sticky glass bar) ---------- */
.shell{display:block;min-height:100vh}
.sidebar{position:sticky;top:0;z-index:1000;height:auto;width:auto;display:flex;flex-direction:row;align-items:center;gap:18px;
  padding:16px var(--gutter);margin:0 0 clamp(18px,2vw,30px);border:0;border-bottom:1px solid rgba(255,255,255,.05);
  background:rgba(12,12,18,.78);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
  transition:transform .22s ease,opacity .18s ease;will-change:transform}
.sidebar.is-hidden{transform:translateY(calc(-100% - 10px));opacity:.01;pointer-events:none}
.logo{display:inline-flex;align-items:center;gap:10px;margin:0;padding:4px 10px 4px 4px;border-radius:var(--r-m);font:800 1.36rem/1 var(--font);letter-spacing:-.04em;transition:background var(--t3),transform var(--t3);cursor:default}
.logo:hover{background:rgba(255,255,255,.04);transform:translateY(-1px)}
.logo .logomark{width:40px;filter:none}
.logo .fill{background:none;color:var(--head);-webkit-text-fill-color:currentColor}
.logo .fill b{background:linear-gradient(100deg,var(--tg-a),var(--tg-b));-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;font-weight:800}
.nav{flex:1 1 auto;min-width:0;display:flex;flex-direction:row;gap:6px;overflow-x:auto;scrollbar-width:none;white-space:nowrap}
.nav::-webkit-scrollbar{display:none}
.navitem{position:relative;z-index:0;display:inline-flex;align-items:center;gap:8px;height:auto;min-height:44px;padding:10px 16px;border:1px solid transparent;border-radius:var(--r-pill);
  color:var(--mutd);font-size:.95rem;font-weight:650;background:transparent;transition:background-color var(--t3),color var(--t3),border-color var(--t3),transform var(--t3)}
.navitem:hover{color:var(--text);background:rgba(var(--acc-rgb),.16)}
.navitem.active,.is-sel{background:linear-gradient(100deg,var(--tg-a),var(--tg-b));-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;font-weight:650}
.navitem.active::before,.is-sel::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;background:rgba(var(--acc-rgb),.14)}
.navitem .ic{width:18px;height:18px;opacity:1}
.navitem.active .ic svg{stroke:var(--tg-a)}
.navitem .ic svg{width:18px;height:18px;stroke-width:2}
.navhint{flex:none;display:inline-flex;align-items:center;gap:10px;margin:0;min-height:44px;padding:0 8px 0 16px;border:1px solid rgba(var(--acc-line-rgb),.22);border-radius:var(--r-pill);
  background:rgba(255,255,255,.035);color:var(--mutd);font-size:.88rem;transition:border-color var(--t3),color var(--t3),background var(--t3)}
.navhint:hover{border-color:rgba(var(--acc-line-rgb),.4);color:var(--text);background:rgba(var(--acc-rgb),.1)}
.navhint span:first-child::before{content:"";display:inline-block;width:14px;height:14px;margin:0 8px -2px 0;background:currentColor;
  -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round'><circle cx='11' cy='11' r='7'/><path d='m20 20-3.5-3.5'/></svg>") center/contain no-repeat;
          mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round'><circle cx='11' cy='11' r='7'/><path d='m20 20-3.5-3.5'/></svg>") center/contain no-repeat}
.navhint kbd{background:rgba(255,255,255,.06);border-color:var(--hair-2)}
.userbox{display:none}
.acct{position:relative;flex:none}
.acctbtn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-width:92px;min-height:44px;padding:0 16px;border-radius:var(--r-pill);cursor:pointer;
  border:1px solid rgba(var(--acc-line-rgb),.44);color:#F3F0FF;font:650 .95rem var(--font);
  background:linear-gradient(135deg,rgba(var(--acc-a-rgb),.52),rgba(var(--acc-b-rgb),.42));box-shadow:0 8px 18px rgba(var(--acc-rgb),.16);transition:transform var(--t3),background var(--t3)}
.acctbtn:hover{transform:translateY(-1px);background:linear-gradient(135deg,rgba(var(--acc-a-rgb),.62),rgba(var(--acc-b-rgb),.5))}
.acctmenu{display:none;position:absolute;top:calc(100% + 12px);right:0;min-width:250px;padding:12px;gap:4px;border:1px solid var(--hair-2);border-radius:20px;
  background:radial-gradient(circle at top right,rgba(var(--acc-rgb),.18),transparent 36%),linear-gradient(180deg,rgba(20,20,30,.98),rgba(10,10,16,.98));box-shadow:var(--sh-soft);z-index:1001}
.acct.open .acctmenu{display:grid;animation:v3pop .2s cubic-bezier(.16,.84,.32,1)}
.acctmenu .who{padding:8px 12px 10px;font-size:.82rem;color:var(--mutd);border-bottom:1px solid var(--hair-2);margin-bottom:4px;overflow:hidden;text-overflow:ellipsis}
.acctmenu a{display:flex;align-items:center;min-height:42px;padding:10px 12px;border-radius:var(--r-in);color:var(--mutd);font-weight:600;font-size:.92rem;text-decoration:none;transition:background var(--t-fast),color var(--t-fast)}
.acctmenu a:hover{background:rgba(var(--acc-rgb),.14);color:var(--text)}
.acctmenu hr{height:1px;margin:6px 4px;border:0;background:var(--hair-2)}
.main{padding:0 var(--gutter) 1cm;max-width:none}
.view.active{animation:v3in .28s cubic-bezier(.16,.84,.32,1)}
@keyframes v3in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@keyframes v3pop{from{opacity:0;transform:translateY(8px) scale(.986)}to{opacity:1;transform:none}}
.view>.eyebrow:first-child{margin-top:6px}

/* ---------- surfaces ---------- */
.card{position:relative;border:1px solid var(--hair);border-radius:var(--r-panel);padding:28px;box-shadow:var(--sh-card);
  background:radial-gradient(circle at top right,rgba(var(--acc-rgb),.14),transparent 34%),linear-gradient(180deg,rgba(20,20,29,.96),rgba(12,12,18,.96))}
.card+.card{margin-top:var(--section-gap)}
.card .card,.modal .card{border-radius:var(--r-card);padding:20px;box-shadow:none;background:rgba(255,255,255,.025)}
.zones{gap:var(--section-gap)}
.tile,.tplcard,.mailrow,.offer-tile{border-radius:var(--r-tile);border:1px solid var(--hair);background:rgba(255,255,255,.025)}
.tplcard:hover,.mailrow:hover{border-color:rgba(var(--acc-line-rgb),.3)}
.empty{padding:32px;border:1px dashed var(--hair-3);border-radius:var(--r-card);background:rgba(255,255,255,.02);color:var(--mutd)}
.empty b{font-size:1.2rem;font-weight:800;color:var(--head);margin-bottom:6px}
hr{border-top:1px solid var(--hair)}

/* ---------- buttons: all pills; secondary and ghost are the brand gradient at low alpha ---------- */
.btn{height:auto;min-height:44px;padding:.7rem 1.1rem;gap:8px;border-radius:var(--r-pill);font:700 .92rem/1 var(--font);letter-spacing:-.005em;
  color:#F3F0FF;border:1px solid rgba(var(--acc-line-rgb),.44);background:linear-gradient(135deg,rgba(var(--acc-a-rgb),.54),rgba(var(--acc-b-rgb),.46));
  box-shadow:0 10px 22px rgba(var(--acc-rgb),.16);transition:transform var(--t3),background var(--t3),border-color var(--t3),color var(--t3),box-shadow var(--t3)}
.btn:hover,.btn:focus-visible{transform:translateY(-1px);background:linear-gradient(135deg,rgba(var(--acc-a-rgb),.62),rgba(var(--acc-b-rgb),.52));color:#fff}
.btn:active{transform:translateY(0) scale(.99)}
.btn.ghost{color:#ECEAFF;border-color:rgba(var(--acc-line-rgb),.30);background:linear-gradient(135deg,rgba(var(--acc-a-rgb),.16),rgba(var(--acc-b-rgb),.11));box-shadow:none}
.btn.ghost:hover,.btn.ghost:focus-visible{border-color:rgba(var(--acc-line-rgb),.48);background:linear-gradient(135deg,rgba(var(--acc-a-rgb),.24),rgba(var(--acc-b-rgb),.18));color:#fff}
.btn.cta,.btn.big,.btn.primary,.fab,.gradbtn{color:#fff;border:1px solid transparent;background:linear-gradient(135deg,var(--acc-a),var(--acc-b));box-shadow:0 10px 24px rgba(var(--acc-rgb),.24)}
.btn.cta:hover,.btn.big:hover,.btn.primary:hover,.fab:hover{background:linear-gradient(135deg,var(--acc-hover-a),var(--acc-hover-b));filter:none}
.btn.sm{min-height:36px;padding:0 .95rem;font-size:.84rem;border-radius:var(--r-pill)}
.btn.big{min-height:48px;padding:0 1.4rem;font-size:.98rem}
.btn:disabled,.btn[disabled]{opacity:.55;transform:none;cursor:not-allowed;box-shadow:none}
.btn.danger{color:#FFD0D0;border-color:rgba(255,107,107,.38);background:rgba(255,107,107,.08);box-shadow:none}
.btn.danger:hover{background:rgba(255,107,107,.16)}
.card .btn:not(.cta):not(.big):not(.primary),.modal .btn:not(.cta):not(.big):not(.primary){box-shadow:none}
.iconbtn{width:38px;height:38px;border-radius:50%;display:inline-grid;place-items:center;border:1px solid var(--hair-3);background:rgba(255,255,255,.05);color:var(--mutd);cursor:pointer;transition:all var(--t-fast)}
.iconbtn:hover{color:var(--text);background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.22)}

/* ---------- fields ---------- */
input,select,textarea{min-height:44px;height:auto;padding:11px 14px;border-radius:var(--r-field);border:1px solid rgba(var(--acc-line-rgb),.26);color:var(--head);
  background:linear-gradient(180deg,rgba(24,24,36,.94),rgba(15,15,23,.96));font-size:.94rem;transition:border-color .16s ease,box-shadow .16s ease,background .16s ease}
input:hover,select:hover,textarea:hover{border-color:rgba(var(--acc-line-rgb),.42)}
input:focus,select:focus,textarea:focus{outline:none;border-color:rgba(var(--acc-rgb),.62);box-shadow:0 0 0 3px rgba(var(--acc-rgb),.18);background:linear-gradient(180deg,rgba(28,28,42,.96),rgba(17,17,26,.98))}
input[type=checkbox],input[type=radio],input[type=range],input[type=file]{min-height:0}
input[type=checkbox],input[type=radio]{accent-color:var(--acc-a)}
input[type=range]{accent-color:var(--acc-a);background:transparent;border:0;box-shadow:none}
textarea{min-height:7rem;line-height:1.6}
select{padding-right:34px;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23C9B8FF' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'><path d='M6 9l6 6 6-6'/></svg>"),linear-gradient(180deg,rgba(24,24,36,.94),rgba(15,15,23,.96));background-repeat:no-repeat;background-position:right 12px center,0 0}
select option{background:#15151F}
input::placeholder,textarea::placeholder{color:rgba(201,190,255,.55)}
label{font-size:.82rem;font-weight:600;color:var(--text-soft);margin:14px 0 7px}
.fl,.frow .fl{font-size:.74rem;letter-spacing:.16em;color:var(--lav);font-weight:700}
input[type=search],#q,#tracksearch,.cmdk input{border-radius:var(--r-pill);padding-left:20px}
#q,#tracksearch{min-height:50px;font-size:1rem;border-color:rgba(var(--acc-line-rgb),.28);background:rgba(22,22,34,.92);box-shadow:inset 0 1px 0 rgba(255,255,255,.02)}
#q:focus,#tracksearch:focus{border-color:rgba(var(--acc-rgb),.52);box-shadow:0 0 0 1px rgba(var(--acc-rgb),.34),0 0 0 6px rgba(var(--acc-a-rgb),.14)}
.toggle{gap:10px;font-size:.9rem;color:var(--text-soft)}
kbd{border-radius:7px}

/* ---------- chips, pills, tags, badges ---------- */
.chips{display:flex;flex-wrap:wrap;gap:10px}
.chip,.mtab,.tchip,.ptab,.atab,.daychip{position:relative;z-index:0;display:inline-flex;align-items:center;gap:8px;min-height:38px;padding:0 15px;border-radius:var(--r-pill);
  border:1px solid rgba(var(--acc-line-rgb),.18);background:rgba(20,20,31,.92);color:var(--text-soft);font:500 .9rem var(--font);cursor:pointer;transition:all 150ms ease}
.chip:hover,.mtab:hover,.tchip:hover,.ptab:hover,.atab:hover{border-color:rgba(var(--acc-line-rgb),.4);background:rgba(34,34,52,.96);color:#fff;transform:translateY(-1px)}
.chip.on,.mtab.on,.tchip.on,.ptab.on,.atab.on,.chip.active{border-color:rgba(var(--acc-line-rgb),.42);background:rgba(var(--acc-rgb),.14);color:#fff}
.mtab.on,.ptab.on,.atab.on{background:rgba(var(--acc-rgb),.16)}
.mtab.on .lbl,.ptab.on .lbl{background:linear-gradient(100deg,var(--tg-a),var(--tg-b));-webkit-background-clip:text;background-clip:text;color:transparent}
.chip b,.mcount,.chip .n{font-weight:600;font-size:.78rem;opacity:.55;letter-spacing:.01em;background:none;padding:0;min-width:0;color:inherit}
.modetabs,.ptabs,.atabs{display:flex;flex-wrap:wrap;gap:10px;border:0;padding:0;background:none}
.badge,.pill{display:inline-flex;align-items:center;gap:6px;height:auto;padding:4px 10px;margin-top:6px;border-radius:var(--r-pill);border:1px solid var(--hair-2);background:rgba(255,255,255,.04);
  color:var(--mutd);font:700 .72rem/1.2 var(--font);letter-spacing:.04em}
.badge.good,.badge.direct,.badge.hot{color:#BFF3D9;background:rgba(61,214,140,.13);border-color:rgba(61,214,140,.28)}
.badge.bad{color:#FFD1D1;background:rgba(255,107,107,.12);border-color:rgba(255,107,107,.28)}
.badge.warn{color:#FBE3B0;background:rgba(245,185,66,.13);border-color:rgba(245,185,66,.28)}
.badge.new{color:#E2DAFF;background:rgba(var(--acc-a-rgb),.18);border-color:rgba(var(--acc-line-rgb),.32)}
.badge.neu{color:var(--mutd)}
.badge.tg{color:#CFE3FF;background:rgba(var(--acc-b-rgb),.14);border-color:rgba(var(--acc-b-rgb),.3)}
.pchip{display:inline-flex;align-items:center;gap:6px;padding:4px 11px;border-radius:var(--r-pill);font:600 .75rem var(--font);border:1px solid rgba(var(--acc-line-rgb),.3);
  background:linear-gradient(135deg,rgba(var(--acc-a-rgb),.22),rgba(var(--acc-b-rgb),.16));color:var(--text)}

/* ---------- section head ---------- */
.shead{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px;margin:0 0 18px}
.shead .eyebrow{margin-bottom:6px}
.shead h2{font-family:var(--font);font-size:1.6rem;line-height:1.1;margin:0;color:var(--head)}
.shead a,.shead .lnk{font-size:.84rem;color:var(--mutd);white-space:nowrap;cursor:pointer;transition:color .15s}
.shead a:hover,.shead .lnk:hover{color:var(--text);text-decoration:none}

/* ---------- stat strip (inline totals) ---------- */
.funnelbar,.v3strip{display:flex;flex-wrap:wrap;padding:16px 8px;border-radius:var(--r-m);border:1px solid rgba(255,255,255,.07);background:rgba(10,10,16,.6);gap:0}
.funnelbar>*,.v3strip>*{flex:1 1 0;min-width:110px;padding:0 18px;border-right:1px solid rgba(255,255,255,.07);background:none!important;border-radius:0!important;border-top:0!important;border-bottom:0!important;border-left:0!important;box-shadow:none!important}
.funnelbar>*:last-child,.v3strip>*:last-child{border-right:0}
.v3strip .n{font:700 1.5rem/1 var(--font);color:var(--head);font-variant-numeric:tabular-nums}
.v3strip .l{font-size:.68rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--mutd);margin-top:7px}
.v3strip .n.g{color:var(--good)}
@media (max-width:860px){.funnelbar>*,.v3strip>*{flex:1 1 45%;border-right:0;padding:8px 14px}}

/* ---------- modals, drawer, toast, palette ---------- */
.modal-bg{background:rgba(4,4,10,.72);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);z-index:1300}
.modal{border:1px solid var(--hair-2);border-radius:var(--r-panel);padding:26px;box-shadow:var(--sh-modal);
  background:radial-gradient(circle at top right,rgba(var(--acc-rgb),.18),transparent 34%),linear-gradient(180deg,rgba(18,18,27,.985),rgba(10,10,16,.985));animation:v3pop .28s cubic-bezier(.16,.84,.32,1)}
.modal h2{font-family:var(--serif);font-size:clamp(1.6rem,2.6vw,2.2rem);line-height:1.04;letter-spacing:-.02em}
.drawer-bg{position:fixed;inset:0;z-index:1250;background:rgba(4,4,10,.5);backdrop-filter:blur(4px);opacity:0;pointer-events:none;transition:opacity .2s ease}
.drawer-bg.show{opacity:1;pointer-events:auto}
.drawer{position:fixed;top:12px;right:12px;bottom:12px;z-index:1260;width:min(520px,calc(100vw - 24px));overflow:auto;padding:26px 26px 30px;border:1px solid rgba(var(--acc-line-rgb),.22);border-radius:var(--r-card);
  background:radial-gradient(circle at top right,rgba(var(--acc-rgb),.16),transparent 40%),linear-gradient(180deg,rgba(18,18,27,.99),rgba(10,10,16,.99));box-shadow:0 28px 54px rgba(0,0,0,.45);
  transform:translateX(calc(100% + 24px));transition:transform .28s cubic-bezier(.16,.84,.32,1)}
.drawer.show{transform:none}
.drawer .dx{position:absolute;top:16px;right:16px}
.drawer h2{font-family:var(--serif);font-size:1.9rem;line-height:1.05;letter-spacing:-.02em;margin:8px 40px 6px 0;color:var(--head)}
.drawer .jsec{margin-top:22px}.drawer .jsec>.eyebrow{margin-bottom:10px}.drawer:focus{outline:none}
.drawer .dacts{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.drawer pre.doc{white-space:pre-wrap;font:.9rem/1.65 var(--font);color:var(--text-soft);background:rgba(255,255,255,.025);border:1px solid var(--hair);border-radius:var(--r-m);padding:16px;max-height:none}
.drawer .kv{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:18px}
.drawer .kv>div{padding:12px 14px;border:1px solid var(--hair);border-radius:var(--r-in);background:rgba(255,255,255,.025)}
.drawer .kv span{display:block;font-size:.68rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--mutd)}
.drawer .kv b{font-size:.95rem}
.toast{top:12px;bottom:auto;left:50%;right:auto;transform:translate(-50%,-8px);max-width:min(880px,calc(100vw - 40px));padding:11px 18px;border-radius:var(--r-m);text-align:center;
  border:1px solid rgba(var(--acc-b-rgb),.26);background:rgba(16,16,30,.96);box-shadow:0 14px 32px rgba(0,0,0,.4);font-weight:600;z-index:1400}
.toast.show{transform:translate(-50%,0)}
.cmdk{border-radius:var(--r-m);border:1px solid var(--hair-2);background:radial-gradient(circle at top right,rgba(var(--acc-rgb),.16),transparent 40%),linear-gradient(180deg,rgba(20,20,30,.99),rgba(10,10,16,.99))}
.cmdk input{border-radius:0;min-height:56px;background:transparent;border:0;border-bottom:1px solid var(--hair-2)}
.cmdk li{border-radius:var(--r-in);min-height:42px}.cmdk li.on,.cmdk li:hover{background:rgba(var(--acc-rgb),.14)}
.cmdk-bg{background:rgba(4,4,10,.6);backdrop-filter:blur(8px)}

/* ---------- progress ---------- */
.briefprog,.prog{height:10px;border-radius:999px;background:rgba(255,255,255,.08);overflow:hidden}
.briefprog i,.prog i{display:block;height:100%;border-radius:inherit;background:linear-gradient(135deg,var(--acc-a),var(--acc-b))}

/* ---------- JOBS: monogram, cover shelf, rows ---------- */
.mono{flex:none;width:38px;height:38px;border-radius:12px;display:grid;place-items:center;font:800 1rem var(--serif);color:#fff;letter-spacing:-.02em;
  background:radial-gradient(circle at 30% 25%,rgba(255,255,255,.28),transparent 55%),linear-gradient(160deg,hsl(var(--h) 70% 52%),hsl(calc(var(--h) + 40) 70% 34%));box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
.jrail-wrap{margin:6px 0 30px}
.jrail{display:flex;gap:18px;overflow-x:auto;overflow-y:visible;padding:30px var(--gutter) 26px;margin:-18px calc(-1 * var(--gutter)) 0;scroll-padding-inline:var(--gutter);
  scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:thin}
.jrail::-webkit-scrollbar{height:8px}.jrail::-webkit-scrollbar-thumb{background:rgba(255,255,255,.12);border:0}
.jcard{scroll-snap-align:start;flex:0 0 268px;max-width:268px;display:flex;flex-direction:column;gap:10px;padding:12px 12px 14px;border:1px solid rgba(var(--acc-line-rgb),.14);border-radius:var(--r-m);
  background:rgba(14,14,22,.72);cursor:pointer;transform-origin:center;transition:transform var(--t3),box-shadow var(--t3),border-color var(--t3)}
.jcard:hover,.jcard:focus-within{transform:translateY(-4px) scale(1.04);z-index:5;border-color:rgba(var(--acc-b-rgb),.5);
  box-shadow:0 18px 42px rgba(4,4,12,.6),0 6px 26px rgba(var(--acc-rgb),.28),0 0 0 1px rgba(var(--acc-b-rgb),.35)}
.jcover{position:relative;aspect-ratio:4/3.3;border-radius:var(--r-s);overflow:hidden;padding:14px;display:flex;flex-direction:column;
  background:radial-gradient(circle at top,rgba(255,255,255,.08),transparent 40%),linear-gradient(160deg,hsl(var(--h) 45% 20% / .95),rgba(10,10,16,.98))}
.jcover::before{content:"";position:absolute;right:-26px;top:-20px;width:140px;height:140px;border-radius:50%;background:rgba(255,255,255,.09)}
.jcover::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:linear-gradient(90deg,var(--acc-a),var(--acc-b));z-index:2}
.jcover .mono{position:relative;width:34px;height:34px;border-radius:10px;font-size:.9rem}
.jcover .age{position:absolute;top:14px;right:12px;padding:3px 9px;border-radius:999px;font:700 .68rem var(--font);letter-spacing:.06em;text-transform:uppercase;color:#C6F6DD;background:rgba(9,9,16,.42);border:1px solid rgba(61,214,140,.34)}
.jcover .ct{position:relative;margin-top:auto;font:700 1.32rem/1.02 var(--serif);letter-spacing:-.03em;color:rgba(255,255,255,.96);text-wrap:balance;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.jcover .ct em{font-style:normal;background:linear-gradient(100deg,var(--tg-a),var(--tg-b));-webkit-background-clip:text;background-clip:text;color:transparent}
.jcover .cco{position:relative;margin-top:10px;font-size:.7rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.7);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.jcard .jt{font:600 1.04rem/1.22 var(--serif);letter-spacing:-.01em;color:var(--head);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.jcard .js{font-size:.8rem;color:var(--mutd);margin-top:-4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.jcard .jf{display:flex;align-items:center;gap:8px;margin-top:auto}
.score{margin-left:auto;display:inline-flex;align-items:center;justify-content:center;min-width:34px;padding:3px 9px;border-radius:999px;font:700 .78rem var(--font);color:var(--head);background:rgba(255,255,255,.06);font-variant-numeric:tabular-nums}
.score.hi{color:#BFF3D9;background:rgba(61,214,140,.13)}.score.ok{color:#CFE3FF;background:rgba(var(--acc-b-rgb),.13)}.score.so{color:#FBE3B0;background:rgba(245,185,66,.12)}
.applybtn{display:inline-flex;align-items:center;gap:6px;min-height:32px;padding:0 13px;border-radius:999px;font:700 .8rem var(--font);color:var(--head);cursor:pointer;
  border:1px solid rgba(var(--acc-line-rgb),.45);background:linear-gradient(135deg,rgba(var(--acc-a-rgb),.24),rgba(var(--acc-b-rgb),.16));transition:all var(--t3)}
.applybtn:hover{transform:translateY(-1px);background:linear-gradient(135deg,rgba(var(--acc-a-rgb),.36),rgba(var(--acc-b-rgb),.26));color:#fff}
.applybtn.ready{border-color:rgba(61,214,140,.45);background:rgba(61,214,140,.1)}.applybtn.ready::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--good)}
.jgroup{font-size:.72rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--mutd);padding:20px 12px 8px;display:flex;align-items:center;gap:10px}
.jgroup::after{content:"";flex:1;height:1px;background:var(--hair)}
.jobcard{display:grid;grid-template-columns:38px minmax(0,1fr) 200px 56px auto;gap:16px;align-items:center;margin:0;padding:12px;border:1px solid transparent;border-radius:var(--r-tile);
  background:transparent;cursor:pointer;transition:background var(--t-fast),border-color var(--t-fast)}
.jobcard+.jobcard{border-top-color:transparent}
.jobcard:hover{background:rgba(255,255,255,.03);border-color:var(--hair)}
.jobcard .jt{font:600 1.02rem/1.25 var(--serif);letter-spacing:-.01em;color:var(--head);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.jobcard .jm{font-size:.84rem;color:var(--mutd);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px}
.jobcard .jtags{display:flex;gap:6px;margin-top:6px;flex-wrap:wrap}.jobcard .jtags .badge{margin:0;padding:2px 8px;font-size:.66rem}
.jobcard .jage{font-size:.84rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.jobcard .jacts{display:flex;align-items:center;gap:8px;justify-content:flex-end}
.jobcard.known{opacity:.6}.jobcard.known:hover{opacity:1}
.fresh{color:var(--good);font-weight:600}.fresh2{color:var(--warn)}.late{color:var(--mutd)}
@media (max-width:860px){.jobcard{grid-template-columns:38px minmax(0,1fr) auto}.jobcard .jage,.jobcard .jsc{display:none}.jobcard .jacts .applybtn{display:none}}

/* ---------- TRACKER ---------- */
.ttools{padding:0;background:none;border:0;margin-bottom:16px;gap:12px}
.tfilters{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:18px}
.jobcard.trow{display:grid;grid-template-columns:minmax(0,1fr) 170px auto;gap:18px;padding:16px 18px;margin-bottom:10px;border:1px solid var(--hair);border-radius:var(--r-tile);background:rgba(255,255,255,.025);cursor:default}
.jobcard.trow:hover{border-color:rgba(var(--acc-line-rgb),.26);background:rgba(255,255,255,.035)}
.trow .jtitle,.trow .jtitle a{font:600 1.02rem/1.25 var(--serif);color:var(--head)}
.trow select{border-radius:999px;min-height:38px}
.trow .tlog{border-radius:var(--r-in);border-color:var(--hair-3)}
.jobcard.due{box-shadow:inset 3px 0 0 rgba(245,185,66,.7)}.jobcard.overdue{box-shadow:inset 3px 0 0 rgba(255,107,107,.7)}
.trow .tedit input{min-height:36px;border-radius:12px}

/* ---------- dashboard ---------- */
.zone{min-width:0}
.scancard .scangrid>div,.funnelbar .f{border-radius:var(--r-tile)}
.match,.attn,.aitem{border-radius:var(--r-in)}
.qa{display:flex;flex-wrap:wrap;gap:10px}

/* ---------- apply tray + save bar ---------- */
.aptray{border-radius:var(--r-tile);border:1px solid rgba(var(--acc-line-rgb),.2);background:radial-gradient(circle at top right,rgba(var(--acc-rgb),.14),transparent 40%),linear-gradient(180deg,rgba(20,20,30,.98),rgba(11,11,17,.98));box-shadow:var(--sh-soft)}
.savebar{border-radius:var(--r-pill);border:1px solid rgba(var(--acc-line-rgb),.22);background:rgba(16,16,26,.9);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);padding:8px 8px 8px 8px}

/* ---------- auth / small pages ---------- */
.authcard{border-radius:var(--r-panel)}
.auth h1.title,.center h1.title{font-size:clamp(2rem,4vw,2.8rem)}

/* ---------- loading skeleton ---------- */
.skel{position:relative;overflow:hidden;border-radius:999px;background:rgba(255,255,255,.06)}
.skel::after{content:"";position:absolute;inset:0;transform:translateX(-100%);background:linear-gradient(90deg,transparent,rgba(255,255,255,.14),transparent);animation:v3sweep 1.4s ease-in-out infinite}
@keyframes v3sweep{to{transform:translateX(100%)}}
@keyframes v3flash{0%{box-shadow:0 0 0 0 rgba(var(--acc-rgb),0)}18%{box-shadow:0 0 0 3px rgba(var(--acc-rgb),.24),0 18px 34px rgba(0,0,0,.3);transform:translateY(-2px)}100%{box-shadow:0 0 0 0 rgba(var(--acc-rgb),0);transform:none}}
.flash{animation:v3flash 1.8s ease}

/* ---------- responsive ---------- */
@media (max-width:900px){
  .sidebar{flex-wrap:wrap;gap:10px;padding:12px var(--gutter)}
  .nav{order:3;flex:1 1 100%}
  .navhint{display:none}
  .logo{font-size:1.2rem}.logo .logomark{width:34px}
  .acct{margin-left:auto}
  .card{padding:22px;border-radius:24px}
}
@media (max-width:720px){
  .navitem{min-height:40px;padding:8px 13px;font-size:.9rem}
  .navitem .ic{display:none}
  .drawer{top:auto;left:8px;right:8px;bottom:8px;width:auto;max-height:86vh;border-radius:22px;transform:translateY(calc(100% + 16px))}
  .drawer.show{transform:none}
  h1.title{font-size:clamp(2rem,11vw,2.9rem)}
}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition-duration:1ms!important;scroll-behavior:auto!important}.jcard:hover{transform:none}}
@media (prefers-contrast:more){.grad,h1.title .grad,.navitem.active,.is-sel,.logo .fill b,.jcover .ct em,.mtab.on .lbl{background:none!important;color:var(--head)!important;-webkit-text-fill-color:currentColor!important}}

/* jobs toolbar: filters fold into one pill row */
.filters{margin-top:14px;border:1px solid var(--hair);border-radius:var(--r-tile);background:rgba(255,255,255,.02)}
.filters summary{padding:8px 8px 8px 18px;min-height:52px;font-weight:650;font-size:.92rem}
.filters[open] summary{border-bottom:1px solid var(--hair)}
.fpre{padding:16px 18px 4px}
.fbody{border-top:0;padding:4px 18px 18px}
.searchrow{gap:10px}
.funnelbar>*{display:flex!important;flex-direction:column;align-items:flex-start;gap:4px}
.funnelbar b{font:700 1.6rem/1 var(--font)!important;color:var(--head)}
.funnelbar span,.funnelbar small,.funnelbar em{font-size:.7rem!important;letter-spacing:.1em;text-transform:uppercase;color:var(--mutd);font-style:normal;vertical-align:baseline;position:static!important}

/* tracker rows: undo the Blue-thread .trow span rules */
.jobcard.trow span{display:inline;overflow:visible;white-space:normal;font-size:inherit}
.jobcard.trow .tmeta{font-size:12.5px;color:var(--mut);line-height:1.7;margin-top:6px}
.jobcard.trow .tmeta b{display:inline;font-weight:600;color:var(--txt)}
.jobcard.trow .muted{margin-top:3px}
.jobcard.trow > div:nth-child(2) select{width:100%;background:rgba(var(--acc-rgb),.10);border-color:rgba(var(--acc-line-rgb),.32);color:#fff;font-weight:600;padding:0 14px}
.jobcard.trow .tbtns{align-items:center}
.jobcard.trow .kitbtn span{display:inline}
.jobcard.trow .tacts .badge{display:inline-flex}
.jobcard.trow.overdue{box-shadow:inset 3px 0 0 #FF6B6B}
.jobcard.trow.due{box-shadow:inset 3px 0 0 #F5B942}

/* profile tabs as pills */
.ptabs{position:sticky;top:84px;z-index:5;display:flex;gap:6px;flex-wrap:nowrap;overflow-x:auto;width:max-content;max-width:100%;margin:6px 0 22px;padding:5px;border:1px solid var(--hair-2);border-radius:999px;background:rgba(16,16,24,.86);backdrop-filter:blur(14px);box-shadow:0 12px 30px rgba(0,0,0,.35)}
body.hdr-hidden .ptabs{top:12px}

.ptabs button{min-height:36px;padding:0 16px;border:1px solid transparent;border-radius:999px;margin:0;background:none;color:var(--mut);font:600 .9rem var(--font);transition:all .18s ease}
.ptabs button:hover{color:#fff;border-color:rgba(var(--acc-line-rgb),.4);transform:translateY(-1px)}
.ptabs button.on{color:#fff;border-color:rgba(var(--acc-line-rgb),.42);background:rgba(var(--acc-rgb),.16)}
.ptabs .ptc{font-size:.75rem;opacity:.8}
@media (max-width:900px){.ptabs{top:0}}
.fl .muted{display:block;margin-top:6px;letter-spacing:0;text-transform:none;font-weight:500;font-size:.85rem;color:var(--mutd)}
.lede{margin-bottom:22px}

/* ===== Jobs bookshelf (remodel) ===== */
.jhero{display:flex;align-items:flex-end;gap:20px;margin-bottom:26px}
.jhero>div:first-child{flex:1;min-width:0}
#find .jhero .eyebrow{color:#A99BFF}
#find .jhero h1.title{font-size:clamp(2.2rem,4.4vw,3.4rem);line-height:1.04;letter-spacing:-.025em;max-width:18ch;margin:0}
.jhero h1 em{font-style:italic;font-weight:600;background:linear-gradient(100deg,var(--tg-a),var(--tg-b));-webkit-background-clip:text;background-clip:text;color:transparent}
.totals{display:flex;flex-wrap:wrap;row-gap:6px;margin-top:18px;font-size:.92rem;color:var(--mutd)}
.totals span{padding:0 16px;border-left:1px solid var(--hair-3)}.totals span:first-child{padding-left:0;border:0}.totals b{color:var(--head);font-weight:600;margin-right:5px}
.viewseg{display:flex;gap:4px;padding:4px;border-radius:999px;border:1px solid var(--hair-2);background:rgba(255,255,255,.03);flex:none}
.viewseg button{border:0;background:none;color:var(--mutd);font:500 .9rem var(--font);padding:8px 16px;border-radius:999px;cursor:pointer}
.viewseg button.on{background:rgba(var(--acc-rgb),.16);color:#fff}
/* the open book */
.feature{margin:26px 0 8px;display:grid;grid-template-columns:240px minmax(0,1fr) 300px;border-radius:30px;border:1px solid var(--hair-3);overflow:hidden;position:relative;
  background:linear-gradient(160deg,rgba(28,28,40,.94),rgba(14,14,20,.97));box-shadow:0 40px 90px rgba(0,0,0,.45);animation:featIn .32s ease}
@keyframes featIn{from{opacity:0;transform:translateY(8px)}}
.feature:before{content:"";position:absolute;right:-120px;top:-160px;width:520px;height:420px;background:radial-gradient(circle,rgba(var(--acc-rgb),.16),transparent 65%);pointer-events:none}
.bigcover{position:relative;padding:24px 22px;display:flex;flex-direction:column;justify-content:space-between;gap:30px;color:#fff;min-height:380px;
  background:linear-gradient(160deg,hsl(var(--h) 52% 24%),hsl(calc(var(--h) + 26) 58% 44%))}
.bigcover:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 85% 0,rgba(255,255,255,.22),transparent 55%);pointer-events:none}
.bigcover:after{content:"";position:absolute;right:0;top:0;bottom:0;width:2px;background:linear-gradient(180deg,#8B5CF6,#4FA8FF)}
.bigcover .mono{width:52px;height:52px;border-radius:16px;background:rgba(255,255,255,.18)!important;font-size:1.3rem;backdrop-filter:blur(6px)}
.bigcover h3{margin:0;font:700 1.75rem/1.12 var(--serif);letter-spacing:-.015em;color:#fff}
.bigcover .by{margin-top:8px;font-size:.9rem;opacity:.85}
.bigcover .seal{display:inline-flex;margin-top:14px;font-size:.8rem;font-weight:600;padding:5px 11px;border-radius:999px;background:rgba(0,0,0,.25)}
.fmain{padding:26px 28px;min-width:0;position:relative}
.fmain .chips{display:flex;flex-wrap:wrap;gap:8px}
.fchip{height:30px;padding:0 13px;border-radius:999px;display:inline-flex;align-items:center;font-size:.82rem;font-weight:500;background:rgba(255,255,255,.04);border:1px solid var(--hair-2);color:var(--text)}
.fchip.fresh{background:rgba(61,214,140,.1);border-color:rgba(61,214,140,.24);color:#3DD68C}.fchip.tgt{background:rgba(245,185,66,.09);border-color:rgba(245,185,66,.24);color:#F5B942}
.quote{margin:20px 0 0;font:500 1.35rem/1.45 var(--serif);color:var(--head);letter-spacing:-.01em}
.quote:before{content:"Why it fits";display:block;font:700 .74rem var(--font);letter-spacing:.16em;color:var(--mutd);margin-bottom:8px;text-transform:uppercase}
.fmg{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:20px}
.fmg .mgrow{padding:3px 0;font-size:.9rem}
.fmeta{display:flex;flex-wrap:wrap;gap:24px;margin-top:22px;padding-top:16px;border-top:1px solid var(--hair);font-size:.84rem;color:var(--mutd);align-items:flex-end}
.fmeta b{display:block;color:var(--head);font-size:.98rem;font-weight:600}.fmeta a{color:#A99BFF;font-weight:500}
.fblue{border-left:1px solid var(--hair);padding:24px 22px;display:flex;flex-direction:column;gap:14px;background:rgba(255,255,255,.015);position:relative}
.orbrow{display:flex;align-items:center;gap:12px}.orbrow .bo{width:40px;height:40px;flex:none;filter:drop-shadow(0 0 14px rgba(79,123,255,.55))}
.orbrow b{color:var(--head);font-size:.95rem}.orbrow small{display:block;color:var(--mutd);font-size:.8rem;line-height:1.35}
.fready{border-radius:18px;border:1px solid var(--hair-2);padding:10px 14px;background:rgba(255,255,255,.025)}
.fready div{display:flex;justify-content:space-between;gap:10px;font-size:.84rem;padding:4px 0}.fready div span:first-child{color:var(--head)}.fready div span:last-child{color:var(--mutd);text-align:right}
.fgo{height:52px;border:0;border-radius:999px;background:linear-gradient(120deg,#8B5CF6,#7C6CF2 35%,#5B8DEF 65%,#4FA8FF);color:#fff;font:600 .98rem var(--font);cursor:pointer;box-shadow:0 16px 40px rgba(var(--acc-rgb),.4);display:flex;align-items:center;justify-content:center;gap:10px;transition:transform .18s}
.fgo:hover{transform:translateY(-1px)}
.fgo kbd,.fghost kbd{font:600 .7rem var(--font);padding:2px 7px;border-radius:6px;background:rgba(255,255,255,.18);border:0;color:inherit}
.frow{display:flex;gap:8px}.fghost{flex:1;height:42px;border-radius:999px;border:1px solid var(--hair-2);background:rgba(255,255,255,.03);color:var(--head);font:600 .88rem var(--font);display:flex;align-items:center;justify-content:center;gap:8px;cursor:pointer}
.fghost:hover{border-color:rgba(var(--acc-line-rgb),.4)}.fghost kbd{background:rgba(255,255,255,.07);color:var(--mutd)}.fghost:disabled{opacity:.6;cursor:default}
.fnote{font-size:.78rem;color:var(--mutd);text-align:center}
/* shelves of covers */
.bshelf{margin-top:46px}
.bsh{display:flex;align-items:baseline;gap:14px;margin-bottom:16px}.bsh h2{margin:0;font:700 1.55rem var(--serif);color:var(--head);letter-spacing:-.015em}.bsh span{color:var(--mutd);font-size:.88rem}
.brail{display:grid;grid-auto-flow:column;grid-auto-columns:176px;gap:20px;overflow-x:auto;padding:8px 4px 18px;scrollbar-width:thin;scroll-snap-type:x proximity}
.book{cursor:pointer;transition:transform .22s ease;scroll-snap-align:start;outline:none}.book:hover,.book:focus-visible{transform:translateY(-6px)}
.bcover{aspect-ratio:3/4;border-radius:14px 20px 20px 14px;position:relative;overflow:hidden;padding:14px 14px 14px 20px;display:flex;flex-direction:column;justify-content:space-between;color:#fff;
  background:linear-gradient(160deg,hsl(var(--h) 48% 22%),hsl(calc(var(--h) + 28) 55% 40%));box-shadow:0 18px 40px rgba(0,0,0,.45)}
.bcover:before{content:"";position:absolute;left:0;top:0;bottom:0;width:8px;background:linear-gradient(90deg,rgba(0,0,0,.35),rgba(255,255,255,.08) 60%,transparent)}
.bcover:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 80% 0,rgba(255,255,255,.2),transparent 55%);pointer-events:none}
.book:focus-visible .bcover{box-shadow:0 0 0 2px #A99BFF,0 18px 40px rgba(0,0,0,.45)}
.btop{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:.74rem;font-weight:700;position:relative;z-index:1}.btop span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bsc{padding:2px 9px;border-radius:999px;background:rgba(0,0,0,.28);flex:none}
.bcover h4{margin:0;font:700 1.1rem/1.16 var(--serif);letter-spacing:-.01em;color:#fff;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden;position:relative;z-index:1}
.bco{font-size:.78rem;opacity:.85;margin-top:6px;position:relative;z-index:1}
.bcap{display:flex;justify-content:space-between;gap:8px;margin-top:10px;font-size:.82rem;color:var(--mutd)}.bcap b{color:var(--head);font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.blist{border-radius:24px;border:1px solid var(--hair);background:rgba(255,255,255,.02);padding:8px}
.blist .jobcard{margin-bottom:0;border-color:transparent;background:none}.blist .jobcard+.jobcard{border-top:1px solid var(--hair);border-radius:0}
.blist .jobcard:hover{background:rgba(255,255,255,.03)}
.blist .jgroup{margin:12px 12px 4px}
/* Blue dock: the apply tray as a floating pill */
.aptray{left:50%!important;right:auto!important;transform:translateX(-50%);width:min(440px,calc(100vw - 32px))!important;border-radius:24px!important;z-index:70;
  background:rgba(16,16,24,.9)!important;backdrop-filter:blur(18px);border:1px solid var(--hair-3)!important;box-shadow:0 20px 50px rgba(0,0,0,.5)!important}
.aptray.min{width:auto!important;border-radius:999px!important}
.aptray .aptrayh{padding:9px 16px 9px 10px;gap:10px}
.aptray.min .aptrayh{padding:8px 18px 8px 8px}
.aptray .aptrayh .bo{width:30px!important;height:30px!important;filter:drop-shadow(0 0 10px rgba(79,123,255,.55))}
.dockseg{display:inline-flex;align-items:center;gap:7px;font-size:.84rem;color:var(--text);padding-left:12px;border-left:1px solid var(--hair-3);white-space:nowrap}
.dockseg:first-of-type{border:0;padding-left:0}.dockseg b{color:var(--head)}.dockseg i{width:8px;height:8px;border-radius:50%;display:inline-block}
@media (max-width:1100px){.feature{grid-template-columns:200px minmax(0,1fr)}.fblue{grid-column:1/-1;border-left:0;border-top:1px solid var(--hair);display:grid;grid-template-columns:1fr 1fr;align-items:center}.fblue .fnote{grid-column:1/-1}}
@media (max-width:720px){.jhero{flex-direction:column;align-items:flex-start}.feature{grid-template-columns:1fr}.bigcover{min-height:200px}.fmg{grid-template-columns:1fr}.fblue{grid-template-columns:1fr}.brail{grid-auto-columns:150px}}
#find .jhero h1.title{max-width:none}
#find>.card{padding:18px 22px;border-radius:24px}
#find>.card .searchrow{margin-top:12px!important}
#find>.card .filters{margin-top:10px}
#find>.card #searchmsg{font-size:.82rem;margin-top:8px!important}
.aptray .aptrayh>span.muted{white-space:nowrap;margin-left:auto}

/* ===================== Remodel: match the approved mockup ===================== */
html{background:#07070B}
body{background:radial-gradient(1100px 600px at 10% -10%,rgba(91,141,239,.13),transparent 60%),radial-gradient(900px 500px at 100% 10%,rgba(79,168,255,.08),transparent 60%),linear-gradient(180deg,#12121A,#07070B 70%) fixed}
/* header */
.sidebar{padding:12px 40px;margin:0;background:rgba(10,10,15,.72);gap:22px}
.logo .logomark{width:34px}.logo{font-size:1.3rem}
.sidebar .nav{display:flex;gap:4px;margin-left:10px;flex:1}
.navitem{min-height:38px;padding:8px 15px;font-weight:500;font-size:.92rem;color:var(--mutd);border:0}
.navitem .ic{display:none}
.navitem:hover{color:var(--head);background:rgba(255,255,255,.04)}
.navitem.active{font-weight:600}
.ncount{font-style:normal;font-size:.68rem;font-weight:700;margin-left:6px;padding:1px 7px;border-radius:999px;background:linear-gradient(120deg,#5B8DEF,#4FA8FF);color:#fff;-webkit-text-fill-color:#fff}
.ncount:empty{display:none}
.navhint{width:260px;min-height:40px;padding:0 10px 0 16px;justify-content:space-between;border-color:var(--hair-2);background:rgba(255,255,255,.03);color:var(--dim,#5F5F76);font-size:.88rem}
.navhint kbd{font:600 .68rem var(--font);padding:2px 7px;border-radius:6px;border:1px solid var(--hair-2);background:none;color:var(--mutd)}
.acctbtn{min-width:0;width:40px;height:40px;min-height:40px;padding:0;border-radius:50%;background:linear-gradient(120deg,#5B8DEF,#4FA8FF);border:0;color:#fff;font:700 .82rem var(--font);box-shadow:none}
.acctbtn:hover{background:linear-gradient(120deg,#4F7FE6,#3F9CFF)}
.fab{display:none!important}
/* page frame */
.main{max-width:1360px;margin:0 auto;padding:40px 40px 140px}
.view>.eyebrow:first-child,.view .jhero .eyebrow{margin:0 0 10px;color:#8FB8FF;font-size:.78rem;letter-spacing:.16em}
h1.title.mh{font:700 clamp(2.1rem,3.6vw,2.9rem)/1.08 var(--serif);letter-spacing:-.025em;color:var(--head);margin:0;max-width:26ch}
h1.title.mh em,.jhero h1 em{font-style:italic;font-weight:600;background:linear-gradient(100deg,#B9D2FF,#8CC6FF);-webkit-background-clip:text;background-clip:text;color:transparent}
.totals{margin-top:18px}
.totals select.inl{height:28px;min-height:0;padding:0 26px 0 10px;border-radius:999px;width:auto;margin-left:6px;font-size:.85rem}
.sec{margin-top:40px}
.sb{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:34px;padding:0 15px;border-radius:999px;border:1px solid var(--hair-2);background:rgba(255,255,255,.04);color:var(--head);font:600 .84rem var(--font);cursor:pointer;text-decoration:none;white-space:nowrap;transition:transform .15s,border-color .15s}
.sb:hover{border-color:rgba(91,141,239,.45);transform:translateY(-1px)}
.sb.g{background:linear-gradient(120deg,#5B8DEF,#4FA8FF);border:0;color:#fff}
.sb.wide{width:100%;margin-top:12px}
.panel2{border-radius:24px;border:1px solid var(--hair);background:rgba(255,255,255,.02);padding:20px 22px;position:relative;overflow:hidden}
.panel2>h3{margin:0 0 14px;font:700 1.2rem var(--serif);color:var(--head);display:flex;justify-content:space-between;align-items:baseline;text-transform:none;letter-spacing:-.01em}
.panel2>h3 a{font:500 .82rem var(--font);color:#8FB8FF}
.lempty{color:var(--mutd);font-size:.86rem;padding:10px 6px;line-height:1.5}
/* blue-family covers */
.bigcover{background:linear-gradient(160deg,hsl(var(--h) 60% 20%),hsl(calc(var(--h) + 14) 72% 44%))}
.bcover,.apc .cv,.lcover{background:linear-gradient(160deg,hsl(var(--h) 58% 19%),hsl(calc(var(--h) + 14) 70% 41%))}
.bigcover:after,.bcover+*{}
.bigcover:after{background:linear-gradient(180deg,#5B8DEF,#4FA8FF)}
.mono{background:linear-gradient(135deg,hsl(var(--h) 62% 38%),hsl(calc(var(--h) + 14) 72% 54%))}
.fgo{background:linear-gradient(120deg,#5B8DEF,#4FA8FF);box-shadow:0 16px 40px rgba(79,140,255,.35)}
.fchip.fresh{}
#find .jhero .eyebrow{color:#8FB8FF}
/* Jobs controls: one slim bar like the mock */
#find>.card{background:none;border:0;box-shadow:none;padding:0;margin:0 0 6px}
#find>.card:before,#find>.card:after{display:none}
#find>.card .modetabs{gap:6px}
#find>.card #newstrip .dochead{margin-top:12px;padding:12px 16px;border:1px solid var(--hair);border-radius:18px;background:rgba(255,255,255,.02)}
#find>.card .searchrow input{border-radius:999px}
#find>.card .filters{border-radius:18px}
/* Today */
.needs{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:34px}
.needs.n1{grid-template-columns:1fr}.needs.n2{grid-template-columns:1fr 1fr}
.need{position:relative;border-radius:24px;border:1px solid var(--hair-3);padding:20px;background:linear-gradient(160deg,rgba(28,28,40,.9),rgba(14,14,20,.95));overflow:hidden;display:flex;flex-direction:column;gap:12px;min-height:200px}
.need:before{content:"";position:absolute;right:-60px;top:-80px;width:220px;height:200px;background:radial-gradient(circle,var(--glow),transparent 65%);pointer-events:none}
.need .k{font-size:.74rem;font-weight:700;letter-spacing:.14em}.k-good{color:#3DD68C}.k-warn{color:#F5B942}.k-bad{color:#FF6B6B}.k-acc{color:#8FB8FF}
.need .nt{display:flex;gap:12px;align-items:center}
.need h3{margin:0;font:700 1.25rem/1.2 var(--serif);color:var(--head);text-transform:none;letter-spacing:-.01em}
.need p{margin:0;color:var(--mutd);font-size:.9rem;line-height:1.5}
.need .acts{margin-top:auto;display:flex;gap:8px;flex-wrap:wrap}
.need.wide{grid-column:1/-1;min-height:0}
.tdsplit{display:grid;grid-template-columns:1.5fr 1fr;gap:18px;margin-top:40px}
.tl{display:flex;gap:14px;padding:11px 0;border-top:1px solid var(--hair);align-items:center;cursor:pointer}.tl:first-child{border:0}
.tl .d{width:52px;text-align:center;flex:none}.tl .d b{display:block;font:700 1.3rem var(--serif);color:var(--head);line-height:1}.tl .d small{font-size:.68rem;color:var(--mutd);letter-spacing:.1em}
.tl .w{min-width:0}.tl .w b{color:var(--head);font-weight:600;font-size:.9rem;display:block}.tl .w small{color:var(--mutd);font-size:.8rem}
.tag{margin-left:auto;font-size:.75rem;font-weight:600;padding:3px 10px;border-radius:999px;white-space:nowrap}
.tag.i{background:rgba(91,141,239,.16);color:#A9C8FF}.tag.d{background:rgba(245,185,66,.12);color:#F5B942}.tag.f{background:rgba(127,182,255,.12);color:#7FB6FF}.tag.g{background:rgba(61,214,140,.12);color:#3DD68C}.tag.r{background:rgba(255,107,107,.12);color:#FF6B6B}
.bign{font:700 2.5rem var(--serif);color:var(--head);line-height:1}.bign small{font:500 .92rem var(--font);color:var(--mutd);margin-left:6px}
.week{display:flex;gap:6px;align-items:flex-end;height:110px;margin:14px 0 26px}
.week div{flex:1;height:100%;border-radius:10px 10px 4px 4px;background:rgba(255,255,255,.05);position:relative}
.week div i{position:absolute;left:0;right:0;bottom:0;border-radius:10px 10px 4px 4px;background:linear-gradient(180deg,#4FA8FF,#5B8DEF)}
.week div span{position:absolute;bottom:-20px;left:0;right:0;text-align:center;font-size:.7rem;color:var(--mutd)}
.wnote{margin:0;color:var(--mutd);font-size:.85rem;line-height:1.5}
.bshl{margin-left:auto;font-size:.88rem;color:#8FB8FF;font-weight:500}
/* Applications */
.lanes{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:34px}
.lane{border-radius:24px;border:1px solid var(--hair);background:rgba(255,255,255,.02);padding:14px;min-height:300px}
.lane h4{margin:2px 6px 12px;display:flex;align-items:center;gap:8px;font-size:.78rem;font-weight:700;letter-spacing:.12em;color:var(--mutd);text-transform:none}.lane h4 b{margin-left:auto;color:var(--head)}
.lane h4 i{width:8px;height:8px;border-radius:50%;display:inline-block}
.apc{border-radius:18px;overflow:hidden;border:1px solid var(--hair-2);background:#191924;margin-bottom:12px;cursor:pointer;transition:transform .2s,border-color .2s}.apc:hover{transform:translateY(-3px);border-color:rgba(91,141,239,.4)}
.apc .cv{height:62px;padding:10px 12px;color:#fff;display:flex;align-items:flex-end;position:relative;font:700 .95rem/1.15 var(--serif)}
.apc .cv:after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:linear-gradient(90deg,#5B8DEF,#4FA8FF)}
.apc .bd{padding:10px 12px 12px;font-size:.8rem;color:var(--mutd)}.apc .bd b{color:var(--head);font-weight:600;font-size:.86rem;display:block}
.prog{height:5px;border-radius:9px;background:rgba(255,255,255,.06);margin-top:9px;overflow:hidden}.prog i{display:block;height:100%;background:linear-gradient(90deg,#5B8DEF,#4FA8FF)}
.acb{display:flex;gap:6px;margin-top:10px}.acb .sb{flex:1;height:30px;font-size:.8rem}
.aprow{display:flex;flex-wrap:wrap;gap:12px 22px;align-items:center;margin-top:18px;font-size:.86rem;color:var(--mutd)}
.aprow .tog{display:inline-flex;gap:8px;align-items:center}
.mem{display:grid;grid-template-columns:1.2fr 1.3fr 160px 70px;gap:14px;align-items:center;padding:12px 4px;border-top:1px solid var(--hair);font-size:.88rem}.mem:first-child{border:0}
.mem b{color:var(--head);font-weight:500}.mem .src{font-size:.76rem;color:var(--mutd)}
/* Tracker */
.stages{display:grid;grid-template-columns:repeat(8,1fr);border-radius:24px;border:1px solid var(--hair-3);overflow:hidden;margin:30px 0 22px;background:rgba(255,255,255,.02)}
.stg{padding:16px 16px;border:0;border-left:1px solid var(--hair);cursor:pointer;position:relative;background:none;text-align:left;color:inherit;font:inherit}.stg:first-child{border-left:0}
.stg b{display:block;font:700 1.9rem var(--serif);color:var(--head);line-height:1.1}.stg span{font-size:.82rem;color:var(--mutd)}
.stg em{font-style:normal;font-size:.72rem;color:var(--dim,#5F5F76);display:block;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.stg:hover{background:rgba(255,255,255,.03)}
.stg.on{background:rgba(91,141,239,.12)}.stg.on:after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:linear-gradient(90deg,#5B8DEF,#4FA8FF)}
#mailbar{background:none;border:1px solid var(--hair);border-radius:18px;padding:10px 14px;box-shadow:none}
#mailbar:before,#mailbar:after{display:none}
.ttools{display:flex;gap:10px;align-items:center;margin:14px 0 12px}
.ttools input{max-width:320px;border-radius:999px}
.trklist{border-radius:24px;border:1px solid var(--hair);background:rgba(255,255,255,.02);overflow:hidden}
.trk2{border-top:1px solid var(--hair)}.trk2:first-child{border-top:0}
.trkrow{display:grid;grid-template-columns:10px minmax(0,1.5fr) 132px minmax(0,1.4fr) 110px auto;gap:16px;align-items:center;padding:14px 20px;cursor:pointer}
.trk2:hover .trkrow{background:rgba(255,255,255,.025)}
.tspine{width:10px;height:42px;border-radius:3px;background:linear-gradient(hsl(var(--h) 62% 36%),hsl(calc(var(--h) + 14) 72% 54%))}
.tw{min-width:0}.tw b{display:block;font-weight:600;color:var(--head);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tw b a{color:inherit}.tw small{color:var(--mutd);font-size:.8rem}
.stpill{height:32px!important;min-height:0!important;padding:0 26px 0 12px!important;border-radius:999px!important;background-color:rgba(91,141,239,.14)!important;border:1px solid rgba(91,141,239,.3)!important;color:#C6DAFF!important;font:600 .8rem var(--font)!important;width:100%}
.tnx{min-width:0;font-size:.88rem;color:var(--text)}.tnx small{display:block;color:var(--mutd);font-size:.76rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tdue{font-size:.8rem;font-weight:600}.tdue.o{color:#FF6B6B}.tdue.s{color:#F5B942}.tdue.k{color:var(--mutd)}
.trk2 .tbtns{display:flex;gap:6px;justify-content:flex-end;align-items:center}
.trk2 .kitbtn b{font-size:.7rem;color:var(--mutd)}
.tmore{display:none;padding:0 20px 16px 46px}
.trk2.open .tmore{display:block}.trk2.open .trkrow{background:rgba(255,255,255,.025)}
.trk2.overdue .tspine{box-shadow:0 0 0 2px rgba(255,107,107,.5)}
.tmore .tmeta{font-size:.8rem;color:var(--mutd);margin-bottom:8px}.tmore .tedit{display:grid;grid-template-columns:1.3fr 160px 1.6fr;gap:8px}
.tmore .tedit input{height:36px;border-radius:12px}.tmore .tacts{margin-top:8px;font-size:.82rem}.tmore .tlog{margin-top:8px;display:flex;gap:8px;flex-wrap:wrap}
.trk2.flash{animation:none;box-shadow:inset 0 0 0 2px rgba(79,168,255,.6)}
/* Documents */
.paper{aspect-ratio:3/4;border-radius:6px 14px 14px 6px;background:#F4F4F8;position:relative;overflow:hidden;padding:18px 16px 16px 24px;box-shadow:0 18px 40px rgba(0,0,0,.45);color:#222;cursor:pointer}
.paper:before{content:"";position:absolute;left:0;top:0;bottom:0;width:8px;background:linear-gradient(180deg,#5B8DEF,#4FA8FF)}
.paper .nm{font:700 .82rem var(--serif);color:#111;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.paper .ln{height:4px;border-radius:2px;background:#D6D6E0;margin-top:6px}.paper .ln.s{width:60%}.paper .hd{height:5px;width:40%;border-radius:2px;background:#8B9BC0;margin-top:12px}
.pbadge{position:absolute;right:10px;bottom:10px;font:700 .7rem var(--font);padding:3px 9px;border-radius:999px;background:#14141F;color:#fff}
.lcover{aspect-ratio:3/4;border-radius:14px 20px 20px 14px;padding:16px 16px 16px 22px;color:#fff;position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;box-shadow:0 18px 40px rgba(0,0,0,.45);cursor:pointer}
.lcover:before{content:"";position:absolute;left:0;top:0;bottom:0;width:8px;background:linear-gradient(90deg,rgba(0,0,0,.35),rgba(255,255,255,.08) 60%,transparent)}
.lcover:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 80% 0,rgba(255,255,255,.2),transparent 55%);pointer-events:none}
.lcover small{font-size:.72rem;opacity:.85;font-weight:700;letter-spacing:.08em;position:relative;z-index:1}.lcover h4{margin:0;font:700 1.15rem/1.15 var(--serif);color:#fff;position:relative;z-index:1}
.lcover .bco{position:relative;z-index:1}
.tbook.isdefault .lcover{box-shadow:0 0 0 2px #8FB8FF,0 18px 40px rgba(0,0,0,.45)}
.tlinks{display:flex;flex-wrap:wrap;gap:4px 10px;margin-top:6px;font-size:.74rem;opacity:0;transition:opacity .15s}.tlinks a{color:var(--mutd)}.tlinks a:hover{color:#8FB8FF}
.tbook:hover .tlinks,.tbook:focus-within .tlinks{opacity:1}
.newbook{aspect-ratio:3/4;border-radius:14px 20px 20px 14px;border:1.5px dashed var(--hair-3);display:grid;place-items:center;color:var(--mutd);font-size:.88rem;text-align:center;cursor:pointer;transition:border-color .15s}
.newbook:hover{border-color:rgba(91,141,239,.5)}.newbook b{display:block;font-size:1.9rem;color:#8FB8FF;font-weight:400}
.docacts{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:4px}
#tplcard .newtpl{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.blist2{border-radius:24px;border:1px solid var(--hair);background:rgba(255,255,255,.02);overflow:hidden}
.lr2{display:grid;grid-template-columns:44px minmax(0,1.2fr) minmax(0,1.5fr) 100px auto;gap:16px;align-items:center;padding:13px 20px;border-top:1px solid var(--hair);font-size:.88rem}.lr2:first-child{border:0}
.lr2:hover{background:rgba(255,255,255,.03)}
.lr2 .spine{width:10px;height:40px;border-radius:3px;justify-self:center;background:linear-gradient(hsl(var(--h) 62% 36%),hsl(calc(var(--h) + 14) 72% 54%))}
.lr2 b{color:var(--head);font-weight:600;display:block}.lr2 small{color:var(--mutd);font-size:.78rem}.lr2 .fnm{color:var(--mutd);font-size:.8rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.lr2 .dt{color:var(--mutd);font-size:.82rem}
.lr2 .act{display:flex;gap:6px;justify-content:flex-end}
#uploadcard .dropzone{padding:16px;border-radius:16px;margin-bottom:8px}
/* Profile */
.ptop{display:grid;grid-template-columns:300px 1fr;gap:20px;margin:30px 0 26px}
.idcard{border-radius:30px;overflow:hidden;border:1px solid var(--hair-3);background:linear-gradient(160deg,rgba(28,28,40,.94),rgba(14,14,20,.97));align-self:start}
.idcard .cvr{height:210px;background:linear-gradient(160deg,hsl(222 62% 22%),hsl(210 74% 46%));position:relative;padding:22px;display:flex;flex-direction:column;justify-content:flex-end;color:#fff}
.idcard .cvr:after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:linear-gradient(90deg,#5B8DEF,#4FA8FF)}
.idcard .av2{position:absolute;top:22px;left:22px;width:62px;height:62px;border-radius:20px;background:rgba(255,255,255,.18);display:grid;place-items:center;font:700 1.4rem var(--serif)}
.idcard .ring2{position:absolute;top:20px;right:20px;width:62px;height:62px;border-radius:50%;background:conic-gradient(#fff calc(var(--p)*1%),rgba(255,255,255,.2) 0);display:grid;place-items:center}
.idcard .ring2:before{content:"";position:absolute;inset:5px;border-radius:50%;background:hsl(216 64% 32%)}.idcard .ring2 b{position:relative;font-size:.9rem}
.idcard h3{margin:0;font:700 1.55rem/1.1 var(--serif);color:#fff;text-transform:none;letter-spacing:-.01em}.idcard .cvr>div:last-child{opacity:.85;font-size:.88rem;margin-top:6px}
.idcard .bd{padding:16px 22px 20px}
.kv2{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-top:1px solid var(--hair);font-size:.86rem}.kv2:first-child{border:0}.kv2 span{color:var(--mutd)}.kv2 b{color:var(--head);font-weight:500;text-align:right}
.ptiles{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;align-content:start}
.ptile{border-radius:24px;border:1px solid var(--hair);background:rgba(255,255,255,.02);padding:20px;position:relative;cursor:pointer;transition:transform .2s,border-color .2s;outline:none}
.ptile:hover{border-color:rgba(91,141,239,.4);transform:translateY(-2px)}
.ptile.on{border-color:rgba(91,141,239,.55);background:rgba(91,141,239,.08)}
.ptile:last-child{grid-column:1/-1}
.ptile .k{font-size:.74rem;font-weight:700;letter-spacing:.14em;color:var(--dim,#5F5F76)}.ptile h4{margin:6px 0;font:700 1.2rem var(--serif);color:var(--head);text-transform:none;letter-spacing:-.01em}.ptile p{margin:0;color:var(--mutd);font-size:.88rem}
.ptile .bits{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}.ptile .bits span{font-size:.78rem;padding:3px 10px;border-radius:999px;background:rgba(255,255,255,.05);color:var(--text)}
.ptile .ed{position:absolute;top:18px;right:18px;font-size:.8rem;color:#8FB8FF;font-weight:500}
#profile .ptabs{display:none}
/* dock */
.aptray .dockbtn{margin-left:8px;height:32px;padding:0 14px;border:0;border-radius:999px;background:linear-gradient(120deg,#5B8DEF,#4FA8FF);color:#fff;font:600 .8rem var(--font);cursor:pointer;white-space:nowrap}
.aptray.idle{cursor:default}
/* responsive */
@media (max-width:1100px){.needs,.lanes{grid-template-columns:1fr 1fr}.stages{grid-template-columns:repeat(4,1fr)}.stg:nth-child(5){border-left:0}.trkrow{grid-template-columns:10px minmax(0,1fr) 120px 90px auto}.trkrow .tnx{display:none}.ptop{grid-template-columns:1fr}.tdsplit{grid-template-columns:1fr}}
@media (max-width:900px){.sidebar{padding:10px 16px}.main{padding:24px 16px 140px}.sidebar .nav{margin-left:0;overflow-x:auto}}
@media (max-width:720px){.needs,.lanes,.ptiles{grid-template-columns:1fr}.stages{grid-template-columns:repeat(2,1fr)}.stg{border-left:0;border-top:1px solid var(--hair)}.trkrow{grid-template-columns:10px minmax(0,1fr) auto}.trkrow .stpill,.trkrow .tdue{display:none}.mem{grid-template-columns:1fr 1fr}.lr2{grid-template-columns:20px 1fr auto}.lr2 .fnm,.lr2 .dt{display:none}}

/* Jobs controls as two slim rows */
#jobsctl{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:12px}
#jobsctl .searchrow{flex:1;min-width:280px;margin:0!important}
#jobsctl>.filters{flex:none;margin:0;position:relative;border-radius:999px;border:1px solid var(--hair-2)}
#jobsctl>.filters summary{min-height:44px;padding:0 8px 0 16px;border:0!important}
#jobsctl>.filters[open]{border-radius:22px}
#jobsctl>.filters[open] .fpre,#jobsctl>.filters[open] .fbody{position:relative}
#jobsctl>.filters[open]{flex-basis:100%;order:3}
#jobsctl #searchmsg{flex-basis:100%;order:4;margin:0!important;font-size:.8rem}
body:has(#profile.active) .aptray{left:auto!important;right:24px!important;transform:none!important}
#uploadcard .filerow{flex-wrap:wrap;gap:8px}#uploadcard .fname{flex:1;min-width:160px}#uploadcard .facts{width:100%;justify-content:flex-start;display:flex;gap:6px;flex-wrap:wrap}
#jobsctl .fcount{display:none}
/* comparison fixes */
.bcover,.apc .cv,.lcover{background:linear-gradient(160deg,hsl(var(--h) 50% 20%),hsl(calc(var(--h) + 10) 64% 42%))}
.bigcover{background:linear-gradient(160deg,hsl(var(--h) 52% 21%),hsl(calc(var(--h) + 10) 66% 44%))}
.trkrow{grid-template-columns:10px minmax(0,1.5fr) 132px minmax(0,1.4fr) 120px 236px}
.scandet{margin-top:12px;border:1px solid var(--hair);border-radius:18px;background:rgba(255,255,255,.02)}
.scandet summary{list-style:none;display:flex;align-items:center;gap:8px;padding:8px 8px 8px 16px;cursor:pointer;font-size:.88rem;color:var(--mutd)}
.scandet summary::-webkit-details-marker{display:none}
.scandet summary b{color:var(--head)}.scansp{flex:1}
.scanmore{color:#8FB8FF;margin-left:6px}.scandet[open] .scanmore{display:none}
.scanbody{padding:4px 16px 14px}
#find[data-mode=new] #searchmsg{display:none}
#find .searchrow .btn{background:linear-gradient(120deg,#5B8DEF,#4FA8FF);border:0;color:#fff}
#find .modetabs .mtab.on{background:rgba(91,141,239,.16)}
.applybtn{background:rgba(91,141,239,.16)!important;border-color:rgba(91,141,239,.4)!important;color:#D6E4FF!important}.applybtn:hover{background:linear-gradient(120deg,#5B8DEF,#4FA8FF)!important;color:#fff!important}
/* layout gutters like the mock, Blue orb back, profile editor */
.main{max-width:1280px;padding:40px 40px 150px}
.fab{display:flex!important}
body:has(#profile.active) .aptray{left:50%!important;right:auto!important;transform:translateX(-50%)!important}
.savebar{margin:14px 0 0!important;max-width:520px;bottom:90px}
body.pclosed:has(#profile.active) .savebar{display:none}
#profile[data-ptab=none] [data-ptab]{display:none!important}
.peditbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:8px 0 16px;padding:14px 16px 14px 22px;border-radius:20px;border:1px solid rgba(91,141,239,.35);background:rgba(91,141,239,.08);position:sticky;top:78px;z-index:6;backdrop-filter:blur(14px)}
.peditbar[hidden]{display:none}
.peditbar .k{font-size:.72rem;font-weight:700;letter-spacing:.14em;color:#8FB8FF;text-transform:uppercase}
.peditbar h3{margin:2px 0 0;font:700 1.25rem var(--serif);color:var(--head);text-transform:none;letter-spacing:-.01em}
body.hdr-hidden .peditbar{top:12px}
/* brand colours */
.feature:before{background:radial-gradient(circle,color-mix(in srgb,var(--bc,#5B8DEF) 32%,transparent),transparent 65%)}
.fgo{background:linear-gradient(120deg,var(--bc,#5B8DEF),color-mix(in srgb,var(--bc,#5B8DEF) 78%,#fff));box-shadow:0 16px 40px color-mix(in srgb,var(--bc,#5B8DEF) 35%,transparent)}
.bigcover:after{background:linear-gradient(180deg,var(--bc,#5B8DEF),color-mix(in srgb,var(--bc,#5B8DEF) 60%,#fff))}
.bcover:after{background:radial-gradient(circle at 80% 0,rgba(255,255,255,.18),transparent 55%)}
.mono{color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.25)}
/* Blue smiley: just the orb, no button background behind it */
.fab,.fab:hover{background:transparent!important;border:0!important;box-shadow:none!important;padding:0!important}

/* active nav item stays readable on hover */
.navitem.active:hover{background:linear-gradient(100deg,var(--tg-a),var(--tg-b));-webkit-background-clip:text;background-clip:text}
/* tracker: company logo in front of each job */
.trkrow{grid-template-columns:40px minmax(0,1.5fr) 132px minmax(0,1.4fr) 120px 236px}
.clogo{position:relative;width:40px;height:40px;border-radius:12px;display:grid;place-items:center;overflow:hidden;color:#fff;font:700 .9rem var(--serif);flex:none}
.clogo img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;padding:7px;background:#fff;opacity:0;transition:opacity .2s}
.clogo.has img{opacity:1}.clogo.has b{visibility:hidden}
@media (max-width:1100px){.trkrow{grid-template-columns:40px minmax(0,1fr) 120px 90px auto}}
@media (max-width:720px){.trkrow{grid-template-columns:40px minmax(0,1fr) auto}}

/* ===== Settings page (same header and panels as the app) ===== */
.setpage .sethead{position:sticky;top:0}
.setpage .sethead a.navitem{text-decoration:none}
.setpage .sethead .logo{text-decoration:none}
.setpage .acct{position:relative}
.setmain{max-width:1280px;margin:0 auto;padding:40px 40px 150px}
.setgrid{display:grid;grid-template-columns:200px minmax(0,1fr);gap:28px;margin-top:30px;align-items:start}
.setnav{position:sticky;top:96px;display:flex;flex-direction:column;gap:4px}
.setnav a{padding:9px 14px;border-radius:999px;color:var(--mutd);font-weight:500;font-size:.9rem;text-decoration:none}
.setnav a:hover{color:var(--head);background:rgba(255,255,255,.04)}
.setnav a.on{color:#fff;background:rgba(91,141,239,.16);font-weight:600}
.setcol{display:flex;flex-direction:column;gap:18px;min-width:0}
.setsec{scroll-margin-top:96px}
.setsec .sgroup{margin-top:18px;padding-top:16px;border-top:1px solid var(--hair)}
.setsec .sgtitle{font-weight:600;color:var(--head);margin-bottom:4px}
.setsec .toggle{display:flex;align-items:center;gap:10px;margin-top:14px;flex-wrap:wrap}
.setsec input.inl{width:80px;display:inline-block;min-height:34px;padding:4px 10px;margin:0 4px}
.setbtns{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
.setrow{display:flex;align-items:center;gap:12px;margin-top:14px}.setrow label{margin:0}.setrow select{width:auto;min-width:110px;border-radius:999px}
.setopt{display:inline-flex;margin-left:8px;font:600 .7rem var(--font);padding:2px 9px;border-radius:999px;background:rgba(255,255,255,.06);color:var(--mutd);vertical-align:middle;letter-spacing:0}
.setopt.adm{background:rgba(245,185,66,.14);color:#F5B942}
.setadmin{border-color:rgba(245,185,66,.25)!important}
.setdet{margin-top:14px}.setdet>summary{cursor:pointer;color:#8FB8FF;font-weight:600;list-style:none}.setdet>summary::-webkit-details-marker{display:none}
.setdet>summary::before{content:"\25B8  "}.setdet[open]>summary::before{content:"\25BE  "}
.setdet .pgrid{margin-top:12px}
.setsec .pw{display:flex;gap:8px;align-items:center}.setsec .pw input{flex:1}
.setdanger{border-color:rgba(255,107,107,.45)!important;color:#FF6B6B!important}
.setsave{display:none!important;position:fixed!important;left:50%;bottom:24px;transform:translateX(-50%);z-index:50;width:auto;max-width:none!important;margin:0!important}
.setdirty .setsave{display:flex!important}
.setpage .paths>div{display:flex;gap:10px;align-items:center;flex-wrap:wrap;padding:6px 0}
@media (max-width:900px){.setgrid{grid-template-columns:1fr}.setnav{position:static;flex-direction:row;overflow-x:auto}.setmain{padding:24px 16px 140px}}
