:root {
  /* Aliases: parallel light-token system → canonical Marqee tokens
     This block preserves backward compatibility for existing consumers
     while unifying the design language. Retire aliases after HTML sweep. */
  --bg: var(--lt2, #F2F5FA);
  --surface: var(--lt, #FFFFFF);
  --surface-2: var(--lt2, #F2F5FA);
  --tx: var(--lk, #0A0C16);
  --tx-2: var(--lk2, #3C4356);
  --tx-3: var(--lk3, #5B6472);
  --tx-4: var(--lk3, #5B6472);
  --line: var(--lline, #E4E8F0);
  --line-2: var(--lline, #E4E8F0);
  --blue: var(--blue, #2E6BFF);
  --aqua: var(--aqua, #4DA2FF);
  --gold: #F4C36A;
  --good: #3EE58C;
  --r: 14px;
}

/* ════════════════════════════════════════════════════════════════════
   MARQEE — Partner Program design system  ·  partner.css
   Two layers in one sheet:
     (A) PUBLIC partner-page components — layered on top of app.css tokens.
         Loaded AFTER app.css on partner-program / track / for-recruiters /
         apply / onboarding / directory pages.
     (B) Partner DASHBOARD app shell (sidebar + topbar + main) and its
         components. Loaded ALONE (without app.css) on partner-dashboard-*.

   Brand tokens mirror assets/app.css — never edit app.css here.
   "Become a marquee candidate." · "Stop applying. Start interviewing."
═════════════════════════════════════════════════════════════════════ */
:root{
  /* brand (mirror of app.css) */
  --aqua:#4DA2FF; --aqua-2:#8FC8FF; --cyan:#7FE6FF; --blue:#2E6BFF; --blue-press:#1F52D8;
  --ink:#05080F; --ink-2:#0A1024;
  /* partner accent ladder — used for track theming */
  --tk-affiliate:#2E6BFF; --tk-ambassador:#F5A623; --tk-influencer:#7C3AED;
  --tk-creator:#16B8C9; --tk-coach:#0FB57A; --tk-recruiter:#E5484D; --tk-contributor:#C026D3;
  /* app light surfaces (dashboard) */
  --bg:#F4F7FC; --surface:#FFFFFF; --surface-2:#F7F9FD; --surface-3:#EEF3FB;
  --line:#E5EAF3; --line-2:#D8E0EE; --dot:#C7CEDC;
  --tx:#0A0E1A; --tx-2:#4A5568; --tx-3:#8A93A6; --tx-4:#AEB6C6;
  --tint:#EAF1FF; --tint-line:rgba(46,107,255,.22);
  /* status accents (earnings / pipeline) */
  --st-pending:#F5A623; --st-cleared:#2E6BFF; --st-paid:#0FB57A; --st-clawback:#E5484D;
  --st-lead:#8A93A6; --st-talk:#7B7FF6; --st-intro:#16B8C9; --st-interview:#7C3AED; --st-hired:#0F9D58;
  --good:#0FB57A; --good-bg:#E4F8EF; --warn:#F5A623; --warn-bg:#FEF4E2; --bad:#E5484D; --bad-bg:#FCE9EA;
  /* sidebar (dark) */
  --sb:#070B16; --sb-2:#0C1124; --sb-line:rgba(255,255,255,.08);
  --sb-tx:rgba(237,242,251,.66); --sb-tx-2:rgba(237,242,251,.40); --sb-active:#fff;
  /* radii + shadow */
  --r-sm:9px; --r:13px; --r-lg:18px; --r-xl:22px;
  --sh-1:0 1px 2px rgba(12,18,48,.05),0 2px 6px rgba(12,18,48,.05);
  --sh-2:0 8px 24px rgba(12,18,48,.08);
  --sh-3:0 24px 60px rgba(12,18,48,.14);
  --sh-pop:0 30px 80px rgba(5,8,15,.32);
  --sidebar-w:264px; --topbar-h:68px;
}

/* ════════════════════════════════════════════════════════════════════
   PART A · PUBLIC PARTNER-PAGE COMPONENTS  (sit on top of app.css)
   These reuse app.css base (.wrap, .btn, .nav, footer, .pagehero, .shead,
   .chip-mono, .rv reveal, .faq, .ctaband). Only NEW components here.
═════════════════════════════════════════════════════════════════════ */

/* ── partner page-hero accents (the pagehero itself comes from app.css) ── */
.ph-eyebrow{font-family:'Space Mono',monospace;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--aqua-2);display:inline-flex;align-items:center;gap:9px;margin-bottom:22px}
.ph-eyebrow .b{width:8px;height:8px;border-radius:50%;background:var(--aqua);box-shadow:0 0 0 0 rgba(77,162,255,.6);animation:bulb 2.4s ease-in-out infinite}
@keyframes bulb{0%,100%{box-shadow:0 0 0 0 rgba(77,162,255,.55)}50%{box-shadow:0 0 0 7px rgba(77,162,255,0)}}
/* hero quick stats under a partner hero */
.ph-stats{display:flex;flex-wrap:wrap;gap:14px 34px;justify-content:center;margin-top:38px}
.ph-stats .s{position:relative;z-index:2}
.ph-stats .n{font-family:'Hanken Grotesk';font-weight:800;font-size:30px;color:#fff;line-height:1;letter-spacing:-.03em}
.ph-stats .n .u{font-size:16px;color:var(--aqua-2);font-weight:700}
.ph-stats .l{font-size:12.5px;color:rgba(255,255,255,.62);margin-top:6px}

/* ── TRACK CARDS GRID (hub: the 6 tracks) ─────────────────────────── */
.tracks{padding:90px 0}
.track-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:46px}
.track-card{position:relative;display:flex;flex-direction:column;background:var(--lt2,#F2F5FA);border:1px solid var(--lline,#E4E8F0);
  border-radius:18px;padding:26px;overflow:hidden;transition:transform .25s,box-shadow .25s,border-color .25s}
.track-card::before{content:'';position:absolute;inset:0 0 auto 0;height:3px;background:var(--tkc,var(--blue));opacity:.9}
.track-card:hover{transform:translateY(-5px);box-shadow:0 28px 56px rgba(12,18,48,.13);border-color:#cfd8e8}
.track-card .tk-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}
.track-card .tk-ic{width:46px;height:46px;border-radius:12px;display:grid;place-items:center;background:var(--tkc,var(--blue));box-shadow:0 10px 24px rgba(46,107,255,.26)}
.track-card .tk-ic svg{width:23px;height:23px;stroke:#fff;fill:none;stroke-width:1.9}
.track-card .tk-tag{font-family:'Space Mono',monospace;font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--tkc,var(--blue));background:color-mix(in srgb,var(--tkc,var(--blue)) 12%,transparent);padding:5px 9px;border-radius:7px}
.track-card h3{font-size:21px;color:var(--lk,#0A0C16);letter-spacing:-.02em}
.track-card .who{font-size:13px;color:var(--lk3,#6B7280);margin-top:4px;font-weight:500}
.track-card p{font-size:14px;color:var(--lk2,#3C4356);margin-top:12px;flex:1}
.track-card .earn{margin-top:16px;padding-top:14px;border-top:1px solid var(--lline,#E4E8F0);display:flex;align-items:baseline;gap:7px}
.track-card .earn b{font-family:'Hanken Grotesk';font-weight:800;font-size:18px;color:var(--lk,#0A0C16)}
.track-card .earn span{font-size:12.5px;color:var(--lk3,#6B7280)}
.track-card .go{display:inline-flex;align-items:center;gap:7px;margin-top:16px;font-size:13.5px;font-weight:600;color:var(--tkc,var(--blue))}
.track-card .go .arr{transition:transform .2s}.track-card:hover .go .arr{transform:translateX(3px)}
.track-card.feat{background:var(--ink);border-color:var(--ink)}
.track-card.feat h3,.track-card.feat .earn b{color:#fff}
.track-card.feat p{color:rgba(237,242,251,.7)}.track-card.feat .who{color:var(--aqua-2)}
.track-card.feat .earn{border-color:rgba(255,255,255,.12)}.track-card.feat .earn span{color:rgba(237,242,251,.5)}
.track-card.feat .star{position:absolute;top:18px;right:18px;font-family:'Space Mono',monospace;font-size:10px;letter-spacing:.1em;color:var(--aqua-2)}

/* track color helpers (set --tkc on a card / hero) */
.tk-affiliate{--tkc:var(--tk-affiliate)} .tk-ambassador{--tkc:var(--tk-ambassador)}
.tk-influencer{--tkc:var(--tk-influencer)} .tk-creator{--tkc:var(--tk-creator)}
.tk-coach{--tkc:var(--tk-coach)} .tk-recruiter{--tkc:var(--tk-recruiter)}
.tk-contributor{--tkc:var(--tk-contributor)}

/* ── COMPARISON TABLE (tracks at a glance) ────────────────────────── */
.ctable-wrap{margin-top:44px;border:1px solid var(--lline,#E4E8F0);border-radius:18px;overflow:hidden;background:var(--lt,#fff);box-shadow:0 18px 44px rgba(12,18,48,.07)}
.ctable-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
.ctable{width:100%;border-collapse:collapse;min-width:760px;font-size:14px}
.ctable th,.ctable td{text-align:left;padding:15px 18px;border-bottom:1px solid var(--lline,#E4E8F0);vertical-align:top}
.ctable thead th{background:var(--lt2,#F2F5FA);font-family:'Space Mono',monospace;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--lk3,#6B7280);font-weight:400;position:sticky;top:0}
.ctable tbody tr:last-child td{border-bottom:0}
.ctable tbody tr:hover{background:var(--lt2,#F2F5FA)}
.ctable .tk{display:flex;align-items:center;gap:10px;font-weight:600;color:var(--lk,#0A0C16)}
.ctable .tk .sw{width:10px;height:10px;border-radius:3px;background:var(--tkc,var(--blue));flex:0 0 auto}
.ctable td b{color:var(--lk,#0A0C16);font-weight:700}
.ctable .pill{display:inline-block;font-family:'Space Mono',monospace;font-size:11px;background:var(--tint,#EAF0FF);color:var(--blue);padding:3px 8px;border-radius:6px}

/* ── ECONOMICS CARDS (shared deal) ────────────────────────────────── */
.economics{background:var(--lt2,#F2F5FA);padding:90px 0}
.econ-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:44px}
.econ-card{background:var(--lt,#fff);border:1px solid var(--lline,#E4E8F0);border-radius:16px;padding:24px;transition:transform .25s,box-shadow .25s}
.econ-card:hover{transform:translateY(-4px);box-shadow:0 22px 48px rgba(12,18,48,.1)}
.econ-card .ei{width:42px;height:42px;border-radius:11px;background:var(--tint,#EAF0FF);display:grid;place-items:center;margin-bottom:16px}
.econ-card .ei svg{width:21px;height:21px;stroke:var(--blue);fill:none;stroke-width:1.9}
.econ-card .big{font-family:'Hanken Grotesk';font-weight:800;font-size:34px;color:var(--lk,#0A0C16);line-height:1;letter-spacing:-.03em}
.econ-card .big small{font-size:16px;font-weight:700;color:var(--lk3,#6B7280)}
.econ-card h3,.econ-card h4{font-size:16px;margin:12px 0 6px;color:var(--lk,#0A0C16)}
.econ-card p{font-size:13.5px;color:var(--lk2,#3C4356)}
.econ-note{margin-top:26px;display:flex;flex-wrap:wrap;gap:10px 24px}
.econ-note span{display:inline-flex;align-items:center;gap:8px;font-size:13.5px;color:var(--lk2,#3C4356);font-weight:500}
.econ-note svg{width:16px;height:16px;stroke:var(--blue);fill:none;stroke-width:2;flex:0 0 auto}

/* ── PERK GRID (ambassador / influencer rewards) ──────────────────── */
.perks{padding:90px 0}
.perk-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:44px}
.perk{background:var(--lt2,#F2F5FA);border:1px solid var(--lline,#E4E8F0);border-radius:16px;padding:24px;text-align:left}
.perk .pic{width:40px;height:40px;border-radius:11px;background:var(--blue);display:grid;place-items:center;margin-bottom:14px}
.perk .pic svg{width:20px;height:20px;stroke:#fff;fill:none;stroke-width:1.9}
.perk h4{font-size:16px;color:var(--lk,#0A0C16);margin-bottom:6px}
.perk p{font-size:13.5px;color:var(--lk2,#3C4356)}

/* ── STEP LADDER (how it works on track pages) ────────────────────── */
.pladder{padding:88px 0}
.pl-step{display:grid;grid-template-columns:auto 1fr;gap:24px;padding:30px 0;border-top:1px solid var(--lline,#E4E8F0)}
.pl-step:first-of-type{border-top:0}
.pl-n{font:700 1rem/1 'Space Mono',monospace;color:var(--blue);border:1px solid var(--tint-line);border-radius:999px;width:44px;height:44px;display:flex;align-items:center;justify-content:center;flex:none}
.pl-bd h3{font-size:21px;color:var(--lk,#0A0C16);margin-bottom:7px}
.pl-bd p{font-size:14.5px;color:var(--lk2,#3C4356);max-width:620px}

/* ── BONUS LADDER TABLE (influencer) ──────────────────────────────── */
.ladder{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:40px}
.ladder .rung{background:var(--lt,#fff);border:1px solid var(--lline,#E4E8F0);border-radius:16px;padding:22px;position:relative}
.ladder .rung::before{content:'';position:absolute;inset:0 0 auto 0;height:3px;background:linear-gradient(90deg,var(--aqua),var(--blue))}
.ladder .rung .tier{font-family:'Space Mono',monospace;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--blue)}
.ladder .rung .thresh{font-size:13px;color:var(--lk3,#6B7280);margin-top:4px}
.ladder .rung .rate{font-family:'Hanken Grotesk';font-weight:800;font-size:30px;color:var(--lk,#0A0C16);margin-top:12px;line-height:1}
.ladder .rung .bonus{font-size:13px;color:var(--lk2,#3C4356);margin-top:8px}
.ladder .rung.cur{background:var(--ink);border-color:var(--ink)}
.ladder .rung.cur .tier{color:var(--aqua-2)}.ladder .rung.cur .thresh,.ladder .rung.cur .bonus{color:rgba(237,242,251,.7)}.ladder .rung.cur .rate{color:#fff}

/* ── FOR-RECRUITERS TWO-PANE (member ⇄ recruiter) ─────────────────── */
.twopane{padding:90px 0}
.tp-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:44px}
.tp{border-radius:20px;padding:32px;border:1px solid var(--lline,#E4E8F0)}
.tp.member{background:var(--ink);border-color:var(--ink)}
.tp.recruiter{background:var(--lt2,#F2F5FA)}
.tp .tp-k{font-family:'Space Mono',monospace;font-size:11px;letter-spacing:.1em;text-transform:uppercase;margin-bottom:14px;display:inline-flex;align-items:center;gap:8px}
.tp.member .tp-k{color:var(--aqua-2)}.tp.recruiter .tp-k{color:var(--blue)}
.tp .tp-k .sq{width:9px;height:9px;border-radius:3px;background:currentColor}
.tp h3{font-size:24px;margin-bottom:10px}
.tp.member h3{color:#fff}.tp.recruiter h3{color:var(--lk,#0A0C16)}
.tp>p{font-size:14.5px;margin-bottom:20px}
.tp.member>p{color:rgba(237,242,251,.72)}.tp.recruiter>p{color:var(--lk2,#3C4356)}
.tp ul{list-style:none;display:grid;gap:13px}
.tp li{position:relative;padding-left:28px;font-size:14px;line-height:1.5}
.tp.member li{color:rgba(237,242,251,.82)}.tp.recruiter li{color:var(--lk2,#3C4356)}
.tp li b{color:inherit;font-weight:700}.tp.recruiter li b{color:var(--lk,#0A0C16)}
.tp li svg{position:absolute;left:0;top:2px;width:18px;height:18px;stroke-width:2.2;fill:none}
.tp.member li svg{stroke:var(--aqua)}.tp.recruiter li svg{stroke:var(--blue)}
/* the gatekeeper rail between panes */
.tp-mediated{margin-top:18px;text-align:center;font-family:'Space Mono',monospace;font-size:12px;letter-spacing:.04em;color:var(--lk3,#6B7280)}
.tp-mediated b{color:var(--blue)}

/* ── GUARDRAILS BAND (member-first promises) ──────────────────────── */
.guardrails{background:var(--ink);padding:90px 0}
.gr-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:44px}
.gr{border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:26px;background:rgba(46,107,255,.05)}
.gr .gi{width:44px;height:44px;border-radius:11px;background:var(--blue);display:grid;place-items:center;margin-bottom:16px;box-shadow:0 0 18px rgba(46,107,255,.5)}
.gr .gi svg{width:21px;height:21px;stroke:#fff;fill:none;stroke-width:1.9}
.gr h4{color:#fff;font-size:18px;margin-bottom:8px}
.gr p{color:rgba(237,242,251,.7);font-size:14px}
.gr .never{display:inline-block;margin-top:12px;font-family:'Space Mono',monospace;font-size:11px;letter-spacing:.04em;color:var(--aqua-2)}

/* ── APPLY CTA panel (prominent) ──────────────────────────────────── */
.apply-cta{padding:96px 24px;text-align:center;position:relative;overflow:hidden;
  background:radial-gradient(120% 130% at 50% 0%,#1A47A0,transparent 60%),var(--ink)}
.apply-cta .inner{position:relative;z-index:2;max-width:680px;margin:0 auto}
.apply-cta .chip-mono{margin-bottom:22px}
.apply-cta h2{color:#fff;font-size:clamp(32px,5vw,60px);line-height:1.02;letter-spacing:-.035em}
.apply-cta h2 .gl{background:linear-gradient(95deg,#6FA8FF,#fff);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.apply-cta p{color:rgba(255,255,255,.72);margin:18px auto 30px;max-width:520px}
.apply-cta .cta{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.apply-cta .micro{margin-top:18px;font-family:'Space Mono',monospace;font-size:12px;color:rgba(255,255,255,.55);letter-spacing:.03em}

/* ── APPLY FORM (partner-apply) ───────────────────────────────────── */
.applyform{padding:64px 0 100px}
.applyform .wrap{display:grid;grid-template-columns:.85fr 1.15fr;gap:48px;align-items:start}
.apply-aside{position:sticky;top:108px}
.apply-aside .chip-mono{margin-bottom:18px}
.apply-aside h2{font-size:clamp(28px,3.4vw,40px);color:var(--lk,#0A0C16);line-height:1.06}
.apply-aside p{color:var(--lk2,#3C4356);font-size:16px;margin-top:14px;max-width:380px}
.apply-aside ul{list-style:none;margin-top:24px;display:grid;gap:12px}
.apply-aside li{position:relative;padding-left:26px;font-size:14px;color:var(--lk2,#3C4356)}
.apply-aside li svg{position:absolute;left:0;top:2px;width:17px;height:17px;stroke:var(--blue);fill:none;stroke-width:2.2}
.fcardx{background:var(--lt,#fff);border:1px solid var(--lline,#E4E8F0);border-radius:20px;padding:34px;box-shadow:0 30px 70px rgba(12,18,48,.08)}
.fld{margin-bottom:18px}
.fld label{display:block;font-size:13px;font-weight:600;color:var(--lk,#0A0C16);margin-bottom:7px}
.fld input,.fld select,.fld textarea{width:100%;border:1px solid var(--lline,#E4E8F0);background:var(--lt2,#F2F5FA);border-radius:11px;
  padding:13px 15px;font-size:15px;color:var(--lk,#0A0C16);font-family:'Inter';transition:border-color .2s,background .2s,box-shadow .2s}
.fld textarea{min-height:110px;resize:vertical}
.fld input:focus,.fld select:focus,.fld textarea:focus{outline:none;border-color:var(--blue);background:#fff;box-shadow:0 0 0 3px rgba(46,107,255,.12)}
.fld .hint{font-size:12px;color:var(--lk3,#6B7280);margin-top:6px}
.fgrid2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
/* track radio chips */
.trackpick{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-bottom:6px}
.trackpick label{position:relative;display:flex;flex-direction:column;gap:2px;padding:14px;border:1px solid var(--lline,#E4E8F0);border-radius:12px;cursor:pointer;background:var(--lt2,#F2F5FA);transition:border-color .2s,background .2s}
.trackpick label b{font-size:14px;color:var(--lk,#0A0C16);font-weight:600}
.trackpick label span{font-size:12px;color:var(--lk3,#6B7280)}
.trackpick input{position:absolute;opacity:0}
.trackpick input:checked+b{color:var(--blue)}
.trackpick label:has(input:checked){border-color:var(--blue);background:var(--tint,#EAF0FF);box-shadow:0 0 0 1px var(--blue) inset}
.consent{display:flex;gap:11px;align-items:flex-start;font-size:13px;color:var(--lk2,#3C4356);margin:6px 0 20px}
.consent input{margin-top:3px;accent-color:var(--blue);width:16px;height:16px;flex:0 0 auto}
.consent a{color:var(--blue);border-bottom:1px solid rgba(46,107,255,.35)}

/* ── ONBOARDING CHECKLIST (partner-onboarding) ────────────────────── */
.onboard{padding:64px 0 100px}
.ob-steps{max-width:760px;margin:40px auto 0;display:grid;gap:14px}
.ob-step{display:grid;grid-template-columns:auto 1fr auto;gap:18px;align-items:center;background:var(--lt,#fff);border:1px solid var(--lline,#E4E8F0);border-radius:16px;padding:20px 22px;box-shadow:var(--sh-1)}
.ob-step .obn{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;font-family:'Space Mono',monospace;font-size:13px;font-weight:700;background:var(--tint,#EAF0FF);color:var(--blue);flex:0 0 auto}
.ob-step.done .obn{background:var(--good);color:#fff}
.ob-step .obt h4{font-size:16px;color:var(--lk,#0A0C16)}
.ob-step .obt p{font-size:13.5px;color:var(--lk2,#3C4356);margin-top:3px}
.ob-step .oba{font-size:13px;font-weight:600;color:var(--blue)}
.ob-step.done .oba{color:var(--good)}

/* ── DIRECTORY GRID (Name in Lights) ──────────────────────────────── */
.directory{padding:80px 0}
.dir-filters{display:flex;flex-wrap:wrap;gap:8px;margin:30px 0}
.dir-chip{font-family:'Space Mono',monospace;font-size:12px;letter-spacing:.04em;padding:8px 14px;border-radius:999px;border:1px solid var(--lline,#E4E8F0);background:var(--lt,#fff);color:var(--lk2,#3C4356);cursor:pointer;transition:all .2s}
.dir-chip:hover{border-color:var(--blue);color:var(--blue)}
.dir-chip.active{background:var(--ink);color:#fff;border-color:var(--ink)}
.dir-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.dir-card{background:var(--lt,#fff);border:1px solid var(--lline,#E4E8F0);border-radius:16px;padding:24px;transition:transform .25s,box-shadow .25s}
.dir-card:hover{transform:translateY(-4px);box-shadow:0 22px 48px rgba(12,18,48,.1)}
.dir-card .dh{display:flex;align-items:center;gap:13px;margin-bottom:14px}
.dir-card .dav{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;font-family:'Hanken Grotesk';font-weight:700;color:#fff;font-size:18px;flex:0 0 auto;background:linear-gradient(135deg,var(--blue),var(--aqua))}
.dir-card .dn b{display:block;font-size:16px;color:var(--lk,#0A0C16)}
.dir-card .dn span{font-size:12.5px;color:var(--lk3,#6B7280)}
.dir-card p{font-size:13.5px;color:var(--lk2,#3C4356)}
.dir-card .dtag{display:inline-block;margin-top:12px;font-family:'Space Mono',monospace;font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;padding:4px 9px;border-radius:6px;background:var(--tint,#EAF0FF);color:var(--blue)}

/* ── PUBLIC RESPONSIVE (Part A) ───────────────────────────────────── */
@media(max-width:1024px){
  .track-grid,.econ-grid,.perk-grid,.gr-grid,.dir-grid{grid-template-columns:repeat(2,1fr)}
  .ladder{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:860px){
  .tp-grid{grid-template-columns:1fr}
  .applyform .wrap{grid-template-columns:1fr;gap:32px}.apply-aside{position:static}
}
@media(max-width:680px){
  .track-grid,.econ-grid,.perk-grid,.gr-grid,.dir-grid,.ladder{grid-template-columns:1fr}
  .pl-step{grid-template-columns:1fr;gap:12px}
  .fgrid2,.trackpick{grid-template-columns:1fr}
  .ob-step{grid-template-columns:auto 1fr;gap:14px}.ob-step .oba{grid-column:2}
}

/* ════════════════════════════════════════════════════════════════════
   PART B · PARTNER DASHBOARD APP SHELL + COMPONENTS
   (loaded WITHOUT app.css — self-contained base below)
═════════════════════════════════════════════════════════════════════ */
.pdash *,.pdash *::before,.pdash *::after{box-sizing:border-box}
.pdash{background:var(--bg);color:var(--tx-2);font-family:'Inter',system-ui,sans-serif;line-height:1.55;-webkit-font-smoothing:antialiased}
.pdash h1,.pdash h2,.pdash h3,.pdash h4{font-family:'Hanken Grotesk',sans-serif;color:var(--tx);font-weight:700;line-height:1.1;letter-spacing:-.02em;margin:0}
.pdash a{color:inherit;text-decoration:none}
.pdash p{margin:0}
.pdash button{font-family:inherit;cursor:pointer;border:0;background:none}
.pdash ::selection{background:rgba(46,107,255,.18)}
.mono{font-family:'Space Mono',monospace}
.label{font-family:'Space Mono',monospace;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--tx-3)}

/* ── SHELL grid ───────────────────────────────────────────────────── */
.app{display:grid;grid-template-columns:var(--sidebar-w) 1fr;min-height:100vh}

/* ── SIDEBAR ──────────────────────────────────────────────────────── */
.sidebar{position:sticky;top:0;align-self:start;height:100vh;background:var(--sb);border-right:1px solid var(--sb-line);
  display:flex;flex-direction:column;padding:18px 14px;z-index:40;
  background-image:radial-gradient(120% 60% at 50% -10%,rgba(46,107,255,.16),transparent 60%)}
.sb-brand{display:flex;align-items:center;gap:11px;padding:8px 10px 16px}
.sb-brand .mk{width:34px;height:34px;border-radius:9px;background:linear-gradient(135deg,var(--aqua-2),var(--aqua));display:grid;place-items:center;flex:0 0 auto;box-shadow:0 6px 18px rgba(77,162,255,.4)}
.sb-brand .nm{font-family:'Hanken Grotesk';font-weight:700;font-size:19px;color:#fff;letter-spacing:-.02em;line-height:1}
.sb-brand .dc{display:block;font-family:'Space Mono',monospace;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--aqua-2);margin-top:4px}
.sb-nav{display:flex;flex-direction:column;gap:2px;margin-top:4px;overflow-y:auto;flex:1}
.sb-nav::-webkit-scrollbar{width:0}
.sb-sec{font-family:'Space Mono',monospace;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--sb-tx-2);padding:15px 12px 6px}
.sb-link{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:11px;color:var(--sb-tx);font-size:14px;font-weight:500;transition:background .18s,color .18s;position:relative}
.sb-link svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.8;flex:0 0 auto;opacity:.9}
.sb-link:hover{background:rgba(255,255,255,.06);color:#fff}
.sb-link.active{background:linear-gradient(100deg,rgba(46,107,255,.28),rgba(77,162,255,.12));color:var(--sb-active);font-weight:600}
.sb-link.active::before{content:'';position:absolute;left:-14px;top:50%;transform:translateY(-50%);width:3px;height:20px;border-radius:0 3px 3px 0;background:var(--aqua)}
.sb-link .cnt{margin-left:auto;font-family:'Space Mono',monospace;font-size:11px;background:rgba(255,255,255,.1);color:#fff;padding:1px 7px;border-radius:20px}
.sb-link.active .cnt{background:var(--aqua);color:#04101f}
.sb-link .tag{margin-left:auto;font-family:'Space Mono',monospace;font-size:9px;letter-spacing:.06em;color:var(--aqua-2);background:rgba(77,162,255,.14);padding:2px 6px;border-radius:5px}
/* track-scoped links can be hidden until JS shows them by data-track */
.sb-link[data-track]{display:none}
.sb-link[data-track].show{display:flex}
/* sidebar footer: earnings mini-card */
.sb-plan{margin-top:auto;background:rgba(255,255,255,.04);border:1px solid var(--sb-line);border-radius:var(--r);padding:14px;display:grid;gap:9px}
.sb-plan .pt{display:flex;align-items:center;justify-content:space-between}
.sb-plan .pt b{color:#fff;font-family:'Hanken Grotesk';font-size:14px}
.sb-plan .pt .pp{font-family:'Space Mono',monospace;font-size:11px;color:var(--aqua-2)}
.sb-plan .pb{font-size:12px;color:var(--sb-tx);line-height:1.45}
.sb-plan a{display:block;text-align:center;font-size:12.5px;font-weight:600;color:#04101f;background:var(--aqua);border-radius:9px;padding:8px;transition:background .2s}
.sb-plan a:hover{background:var(--aqua-2)}

/* ── MAIN + TOPBAR ────────────────────────────────────────────────── */
.main{display:flex;flex-direction:column;min-width:0}
.topbar{position:sticky;top:0;z-index:30;height:var(--topbar-h);background:rgba(255,255,255,.82);backdrop-filter:saturate(180%) blur(12px);border-bottom:1px solid var(--line);display:flex;align-items:center;gap:18px;padding:0 26px}
.tb-title{font-family:'Hanken Grotesk';font-weight:700;font-size:20px;color:var(--tx);letter-spacing:-.02em;flex:0 0 auto}
.tb-search{flex:1;max-width:380px;position:relative}
.tb-search svg{position:absolute;left:13px;top:50%;transform:translateY(-50%);width:16px;height:16px;stroke:var(--tx-3);fill:none;stroke-width:2}
.tb-search input{width:100%;border:1px solid var(--line);background:var(--surface-2);border-radius:10px;padding:9px 13px 9px 37px;font-size:14px;color:var(--tx)}
.tb-search input::placeholder{color:var(--tx-3)}
.tb-search input:focus{outline:none;border-color:var(--blue);background:#fff;box-shadow:0 0 0 3px rgba(46,107,255,.12)}
.tb-right{margin-left:auto;display:flex;align-items:center;gap:14px}
.tb-icon{width:38px;height:38px;border-radius:10px;border:1px solid var(--line);background:var(--surface);display:grid;place-items:center;color:var(--tx-2);position:relative;transition:border-color .2s,color .2s}
.tb-icon:hover{border-color:var(--line-2);color:var(--tx)}
.tb-icon svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.8}
.tb-icon .dot{position:absolute;top:8px;right:9px;width:7px;height:7px;border-radius:50%;background:var(--bad);border:2px solid var(--surface)}
.tb-pill{font-family:'Space Mono',monospace;font-size:11px;letter-spacing:.06em;color:var(--blue);background:var(--tint);border:1px solid var(--tint-line);padding:6px 11px;border-radius:8px;white-space:nowrap}
.tb-divider{width:1px;height:26px;background:var(--line)}
.tb-user{display:flex;align-items:center;gap:9px;padding:5px 11px 5px 5px;border:1px solid var(--line);border-radius:30px;background:var(--surface);transition:border-color .2s,box-shadow .2s}
.tb-user:hover{border-color:var(--line-2);box-shadow:var(--sh-1)}
.tb-user .meta{line-height:1.2}
.tb-user .meta .r{font-family:'Space Mono',monospace;font-size:9.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--tx-3)}
.tb-user .meta .n{font-size:12.5px;font-weight:600;color:var(--tx)}

/* ── PAGE BODY ────────────────────────────────────────────────────── */
.page{padding:24px 26px 60px;flex:1}
.page-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;flex-wrap:wrap;margin-bottom:22px}
.page-head .pt{max-width:660px}
.page-head h1{font-size:26px;color:var(--tx)}
.page-head .ps{font-size:14.5px;color:var(--tx-2);margin-top:6px}
.page-head .pa{display:flex;align-items:center;gap:10px;flex-wrap:wrap}

/* ── AVATARS ──────────────────────────────────────────────────────── */
.av{display:inline-grid;place-items:center;border-radius:50%;font-family:'Hanken Grotesk';font-weight:700;color:#fff;flex:0 0 auto;background:linear-gradient(135deg,var(--blue),var(--aqua));font-size:13px;width:34px;height:34px;border:2px solid var(--surface)}
.av.sm{width:26px;height:26px;font-size:11px}.av.lg{width:46px;height:46px;font-size:17px}
.av.s1{background:linear-gradient(135deg,#7C3AED,#B583FF)}
.av.s2{background:linear-gradient(135deg,#0FB57A,#7FE6B8)}
.av.s3{background:linear-gradient(135deg,#F5A623,#FFD27F)}
.av.s4{background:linear-gradient(135deg,#16B8C9,#7FE6FF)}
.av.s5{background:linear-gradient(135deg,#E5484D,#FF9AA0)}
.av-stack{display:inline-flex}.av-stack .av{margin-left:-9px}.av-stack .av:first-child{margin-left:0}

/* ── BUTTONS ──────────────────────────────────────────────────────── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5em;font-weight:600;font-size:14px;padding:10px 18px;border-radius:10px;border:1px solid transparent;transition:transform .14s,background .2s,color .2s,border-color .2s,box-shadow .2s;white-space:nowrap}
.btn svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2}
.btn .arr{transition:transform .2s}.btn:hover .arr{transform:translateX(3px)}
.btn-blue{background:var(--blue);color:#fff;box-shadow:0 6px 16px rgba(46,107,255,.28)}
.btn-blue:hover{background:var(--blue-press);transform:translateY(-1px)}
.btn-dark{background:var(--ink-2);color:#fff}.btn-dark:hover{transform:translateY(-1px)}
.btn-line{background:var(--surface);color:var(--tx);border-color:var(--line-2)}.btn-line:hover{border-color:var(--tx-3);box-shadow:var(--sh-1)}
.btn-ghost{background:transparent;color:var(--tx-2)}.btn-ghost:hover{background:var(--surface-3);color:var(--tx)}
.btn-sm{padding:7px 13px;font-size:13px;border-radius:8px}
.btn-icon{padding:9px;border-radius:9px}
.btn-block{width:100%}

/* ── CARDS / PANELS ───────────────────────────────────────────────── */
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--sh-1)}
.card.pad{padding:22px}
.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--sh-1);overflow:hidden}
.panel-head{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:16px 20px;border-bottom:1px solid var(--line)}
.panel-head h3,.panel-head h2{font-size:16px;color:var(--tx);font-weight:700;line-height:1.2}
.panel-head .label{margin-top:2px}
.panel-body{padding:20px}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.col-main{display:grid;grid-template-columns:1.6fr 1fr;gap:18px;align-items:start}

/* ── STAT / KPI CARDS ─────────────────────────────────────────────── */
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:22px}
.kpi{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:18px 20px;box-shadow:var(--sh-1);position:relative;overflow:hidden}
.kpi::after{content:'';position:absolute;inset:0 0 auto 0;height:3px;background:linear-gradient(90deg,var(--aqua),var(--blue))}
.kpi.pending::after{background:linear-gradient(90deg,#FFD27F,var(--st-pending))}
.kpi.cleared::after{background:linear-gradient(90deg,var(--aqua),var(--st-cleared))}
.kpi.paid::after{background:linear-gradient(90deg,#7FE6B8,var(--st-paid))}
.kpi .kl{font-family:'Space Mono',monospace;font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:var(--tx-3)}
.kpi .kn{font-family:'Hanken Grotesk';font-weight:800;font-size:32px;color:var(--tx);line-height:1;margin-top:10px;letter-spacing:-.03em}
.kpi .kn small{font-size:15px;font-weight:600;color:var(--tx-3)}
.kpi .kd{font-size:12.5px;color:var(--tx-2);margin-top:8px;display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.kpi .trend{font-family:'Space Mono',monospace;font-size:11px;font-weight:600;padding:1px 7px;border-radius:20px}
.kpi .trend.up{color:var(--good);background:var(--good-bg)}
.kpi .trend.down{color:var(--bad);background:var(--bad-bg)}
.kpi .trend.flat{color:var(--tx-3);background:var(--surface-3)}

/* ── BADGES / STATUS ──────────────────────────────────────────────── */
.badge{display:inline-flex;align-items:center;gap:6px;font-family:'Space Mono',monospace;font-size:11px;letter-spacing:.03em;padding:3px 9px;border-radius:7px;font-weight:400;white-space:nowrap}
.badge .dot{width:7px;height:7px;border-radius:50%;background:currentColor;flex:0 0 auto}
.badge.pending{color:#B5760A;background:var(--warn-bg)}
.badge.cleared{color:var(--blue);background:var(--tint)}
.badge.paid{color:#0B7A45;background:var(--good-bg)}
.badge.clawback{color:var(--bad);background:var(--bad-bg)}
.badge.trial{color:#5557D6;background:rgba(123,127,246,.13)}
.badge.lead{color:var(--st-lead);background:rgba(138,147,166,.13)}
.badge.talk{color:#5557D6;background:rgba(123,127,246,.13)}
.badge.intro{color:#0E8E9C;background:rgba(22,184,201,.13)}
.badge.interview{color:#6D28D9;background:rgba(124,58,237,.12)}
.badge.hired{color:#0B7A45;background:var(--good-bg)}
.badge.good{color:var(--good);background:var(--good-bg)}
.badge.warn{color:#B5760A;background:var(--warn-bg)}
.badge.bad{color:var(--bad);background:var(--bad-bg)}

/* ── TABS ─────────────────────────────────────────────────────────── */
.tabs{display:inline-flex;gap:4px;background:var(--surface-3);border:1px solid var(--line);border-radius:11px;padding:4px;margin-bottom:20px}
.tab{padding:8px 15px;border-radius:8px;font-size:13.5px;font-weight:600;color:var(--tx-2);transition:background .18s,color .18s}
.tab:hover{color:var(--tx)}
.tab.active{background:var(--surface);color:var(--tx);box-shadow:var(--sh-1)}
[data-tabpane]{display:none}
[data-tabpane].active{display:block;animation:fadein .3s ease}
@keyframes fadein{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

/* ── TABLES (earnings / referrals / clawbacks) ────────────────────── */
.tbl-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.tbl{width:100%;border-collapse:collapse;min-width:640px;font-size:13.5px}
.tbl th{text-align:left;font-family:'Space Mono',monospace;font-size:10.5px;letter-spacing:.05em;text-transform:uppercase;color:var(--tx-3);font-weight:400;padding:12px 16px;border-bottom:1px solid var(--line);white-space:nowrap;background:var(--surface-2)}
.tbl td{padding:14px 16px;border-bottom:1px solid var(--line);color:var(--tx-2);vertical-align:middle}
.tbl tr:last-child td{border-bottom:0}
.tbl tbody tr{transition:background .15s}
.tbl tbody tr:hover{background:var(--surface-2)}
.tbl .member{display:flex;align-items:center;gap:10px}
.tbl .member b{color:var(--tx);font-weight:600;font-size:13.5px}
.tbl .member span{font-size:11.5px;color:var(--tx-3)}
.tbl .amt{font-family:'Space Mono',monospace;color:var(--tx);font-weight:600}
.tbl .amt.neg{color:var(--bad)}
.tbl .num{font-family:'Space Mono',monospace}
.tbl td.right,.tbl th.right{text-align:right}
.tbl .progress{width:100%;max-width:120px}
.tbar{height:7px;border-radius:5px;background:var(--surface-3);overflow:hidden}
.tbar i{display:block;height:100%;border-radius:5px;background:linear-gradient(90deg,var(--aqua),var(--blue))}
.tbl .mo-of{font-size:11px;color:var(--tx-3);margin-top:4px;font-family:'Space Mono',monospace}

/* ── PAYOUT TIMELINE ──────────────────────────────────────────────── */
.timeline{position:relative;padding-left:8px}
.tl-item{position:relative;display:grid;grid-template-columns:auto 1fr;gap:18px;padding:0 0 26px 0}
.tl-item:last-child{padding-bottom:0}
.tl-rail{position:relative;width:34px;display:flex;justify-content:center}
.tl-rail::before{content:'';position:absolute;top:34px;bottom:-26px;width:2px;background:var(--line)}
.tl-item:last-child .tl-rail::before{display:none}
.tl-node{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--surface);border:2px solid var(--line);z-index:1;flex:0 0 auto}
.tl-node svg{width:16px;height:16px;stroke:var(--tx-3);fill:none;stroke-width:2.2}
.tl-item.paid .tl-node{background:var(--good);border-color:var(--good)}.tl-item.paid .tl-node svg{stroke:#fff}
.tl-item.next .tl-node{background:var(--blue);border-color:var(--blue);box-shadow:0 0 0 4px rgba(46,107,255,.16)}.tl-item.next .tl-node svg{stroke:#fff}
.tl-bd{padding-top:4px}
.tl-bd .th{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.tl-bd .th b{font-family:'Hanken Grotesk';font-size:16px;color:var(--tx)}
.tl-bd .amt{font-family:'Space Mono',monospace;font-weight:600;color:var(--tx)}
.tl-bd .when{font-size:12.5px;color:var(--tx-3);font-family:'Space Mono',monospace}
.tl-bd p{font-size:13px;color:var(--tx-2);margin-top:5px}

/* ── REFERRAL LINK ROWS (copy-to-clipboard) ───────────────────────── */
.linkrow{display:flex;align-items:center;gap:14px;padding:16px 20px;border-bottom:1px solid var(--line);flex-wrap:wrap}
.linkrow:last-child{border-bottom:0}
.linkrow .lk-meta{min-width:160px}
.linkrow .lk-meta b{display:block;font-size:14px;color:var(--tx);font-weight:600}
.linkrow .lk-meta span{font-size:12px;color:var(--tx-3)}
.lk-field{flex:1;min-width:240px;display:flex;align-items:center;gap:8px;background:var(--surface-2);border:1px solid var(--line);border-radius:10px;padding:4px 4px 4px 14px}
.lk-field code{flex:1;font-family:'Space Mono',monospace;font-size:13px;color:var(--tx);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lk-copy{display:inline-flex;align-items:center;gap:6px;padding:8px 13px;border-radius:8px;background:var(--blue);color:#fff;font-size:12.5px;font-weight:600;transition:background .2s}
.lk-copy:hover{background:var(--blue-press)}
.lk-copy svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2}
.lk-copy.copied{background:var(--good)}
.linkrow .lk-stats{display:flex;gap:20px}
.linkrow .lk-stats .s b{font-family:'Space Mono',monospace;font-size:15px;color:var(--tx);display:block}
.linkrow .lk-stats .s span{font-size:11px;color:var(--tx-3)}

/* ── RATE / LADDER TABLES (dashboard rates page) ──────────────────── */
.ratecard{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:24px;box-shadow:var(--sh-1)}
.ratecard .rt{display:flex;align-items:baseline;gap:10px}
.ratecard .rt .big{font-family:'Hanken Grotesk';font-weight:800;font-size:40px;color:var(--tx);line-height:1;letter-spacing:-.03em}
.ratecard .rt .for{font-size:14px;color:var(--tx-2)}
.ratecard p{font-size:13.5px;color:var(--tx-2);margin-top:10px}
.rate-ladder{display:grid;gap:10px;margin-top:8px}
.rate-rung{display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center;padding:14px 16px;border:1px solid var(--line);border-radius:12px;background:var(--surface-2)}
.rate-rung.cur{border-color:var(--blue);background:var(--tint);box-shadow:0 0 0 1px var(--blue) inset}
.rate-rung .rr-tier{font-family:'Space Mono',monospace;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--blue);width:80px}
.rate-rung .rr-bd b{font-size:14px;color:var(--tx)}
.rate-rung .rr-bd span{display:block;font-size:12px;color:var(--tx-3)}
.rate-rung .rr-rate{font-family:'Hanken Grotesk';font-weight:800;font-size:22px;color:var(--tx)}

/* ── KANBAN PIPELINE (recruiter) ──────────────────────────────────── */
.kanban-wrap{margin:0 -26px;padding:4px 26px 26px;overflow-x:auto}
.kanban{display:flex;gap:14px;align-items:flex-start;min-height:50vh}
.kcol{flex:0 0 270px;width:270px;background:var(--surface-2);border:1px solid var(--line);border-radius:var(--r-lg);display:flex;flex-direction:column;max-height:74vh}
.kcol-head{display:flex;align-items:center;gap:9px;padding:14px 16px;border-bottom:1px solid var(--line)}
.kcol-head .sw{width:9px;height:9px;border-radius:3px;flex:0 0 auto}
.kcol[data-stage=lead] .sw{background:var(--st-lead)}
.kcol[data-stage=talk] .sw{background:var(--st-talk)}
.kcol[data-stage=intro] .sw{background:var(--st-intro)}
.kcol[data-stage=interview] .sw{background:var(--st-interview)}
.kcol[data-stage=hired] .sw{background:var(--st-hired)}
.kcol-head .t{font-family:'Hanken Grotesk';font-weight:700;font-size:14px;color:var(--tx)}
.kcol-head .c{margin-left:auto;font-family:'Space Mono',monospace;font-size:12px;color:var(--tx-3);background:var(--surface-3);padding:1px 8px;border-radius:20px}
.klist{padding:12px;display:flex;flex-direction:column;gap:10px;overflow-y:auto}
.pcard{background:var(--surface);border:1px solid var(--line);border-radius:13px;padding:14px;box-shadow:var(--sh-1);cursor:grab;transition:box-shadow .18s,transform .12s,border-color .18s}
.pcard:hover{box-shadow:var(--sh-2);border-color:var(--line-2)}
.pcard:active{cursor:grabbing}
.pcard.dragging{opacity:.5;transform:scale(.98)}
.pcard .pc-top{display:flex;align-items:center;gap:10px;margin-bottom:9px}
.pcard .pc-role b{display:block;font-size:13.5px;color:var(--tx);font-weight:600;line-height:1.25}
.pcard .pc-role span{font-size:11.5px;color:var(--tx-3)}
.pcard .pc-meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:8px}
.pcard .pc-fee{font-family:'Space Mono',monospace;font-size:12px;color:var(--blue);font-weight:600}
.kcol.drop-hint .klist{outline:2px dashed var(--blue);outline-offset:-6px;border-radius:13px}

/* ── CLIENTS (coach) cards ────────────────────────────────────────── */
.clientrow{display:grid;grid-template-columns:1fr auto auto auto;gap:18px;align-items:center;padding:16px 20px;border-bottom:1px solid var(--line)}
.clientrow:last-child{border-bottom:0}
.clientrow .cl-who{display:flex;align-items:center;gap:12px}
.clientrow .cl-who b{display:block;font-size:14px;color:var(--tx);font-weight:600}
.clientrow .cl-who span{font-size:12px;color:var(--tx-3)}
.cobrand{display:inline-flex;align-items:center;gap:7px;font-family:'Space Mono',monospace;font-size:11px;color:var(--tx-2);background:var(--surface-2);border:1px solid var(--line);padding:5px 10px;border-radius:8px}
.cobrand .by{color:var(--blue)}

/* ── TEMPLATES (creator) grid ─────────────────────────────────────── */
.tpl-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.tpl{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--sh-1);transition:transform .2s,box-shadow .2s}
.tpl:hover{transform:translateY(-3px);box-shadow:var(--sh-2)}
.tpl .tp-prev{height:120px;background:linear-gradient(135deg,var(--ink-2),#13203f);display:grid;place-items:center;border-bottom:1px solid var(--line)}
.tpl .tp-prev svg{width:40px;height:40px;stroke:var(--aqua);fill:none;stroke-width:1.6;opacity:.9}
.tpl .tp-bd{padding:16px}
.tpl .tp-bd h4{font-size:15px;color:var(--tx)}
.tpl .tp-bd .meta{font-size:12px;color:var(--tx-3);margin-top:4px}
.tpl .tp-bd .stats{display:flex;gap:16px;margin-top:12px;font-size:12px;color:var(--tx-2)}
.tpl .tp-bd .stats b{font-family:'Space Mono',monospace;color:var(--tx)}

/* ── ACADEMY modules ──────────────────────────────────────────────── */
.modlist{display:grid;gap:12px}
.module{display:grid;grid-template-columns:auto 1fr auto;gap:16px;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:18px 20px;box-shadow:var(--sh-1)}
.module .mi{width:40px;height:40px;border-radius:11px;display:grid;place-items:center;background:var(--tint);flex:0 0 auto}
.module .mi svg{width:20px;height:20px;stroke:var(--blue);fill:none;stroke-width:1.9}
.module.done .mi{background:var(--good-bg)}.module.done .mi svg{stroke:var(--good)}
.module h4{font-size:15px;color:var(--tx)}
.module p{font-size:13px;color:var(--tx-2);margin-top:3px}
.module .mprog{font-family:'Space Mono',monospace;font-size:12px;color:var(--tx-3)}
.cert{background:linear-gradient(135deg,var(--ink),var(--ink-2));border-radius:var(--r-lg);padding:26px;color:#fff;display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.cert .seal{width:64px;height:64px;border-radius:14px;background:linear-gradient(135deg,var(--aqua-2),var(--aqua));display:grid;place-items:center;flex:0 0 auto;box-shadow:0 12px 30px rgba(77,162,255,.4)}
.cert .seal svg{width:32px;height:32px;stroke:#04101f;fill:none;stroke-width:2}
.cert .cb{flex:1;min-width:200px}
.cert h3{color:#fff;font-size:19px}
.cert p{color:rgba(237,242,251,.7);font-size:13.5px;margin-top:5px}

/* ── COMPLIANCE / GUARDRAIL note (dashboard) ──────────────────────── */
.note{background:var(--surface-2);border:1px solid var(--line);border-left:3px solid var(--blue);border-radius:10px;padding:14px 16px;font-size:13.5px;color:var(--tx-2);display:flex;gap:12px;align-items:flex-start}
.note svg{width:18px;height:18px;stroke:var(--blue);fill:none;stroke-width:2;flex:0 0 auto;margin-top:1px}
.note.warn{border-left-color:var(--warn);background:var(--warn-bg)}
.note.warn svg{stroke:var(--warn)}
.note b{color:var(--tx)}

/* ── QUICK LINKS (overview) ───────────────────────────────────────── */
.quick{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.qcard{display:flex;align-items:center;gap:12px;background:var(--surface);border:1px solid var(--line);border-radius:13px;padding:15px 16px;box-shadow:var(--sh-1);transition:transform .2s,box-shadow .2s,border-color .2s}
.qcard:hover{transform:translateY(-3px);box-shadow:var(--sh-2);border-color:var(--line-2)}
.qcard .qi{width:38px;height:38px;border-radius:10px;background:var(--tint);display:grid;place-items:center;flex:0 0 auto}
.qcard .qi svg{width:19px;height:19px;stroke:var(--blue);fill:none;stroke-width:1.9}
.qcard b{font-size:13.5px;color:var(--tx);display:block}
.qcard span{font-size:11.5px;color:var(--tx-3)}

/* ── SETTINGS forms ───────────────────────────────────────────────── */
.setgrid{display:grid;gap:18px;max-width:720px}
.fld{margin-bottom:0}
.field{margin-bottom:16px}
.field label{display:block;font-size:13px;font-weight:600;color:var(--tx);margin-bottom:7px}
.field input,.field select,.field textarea{width:100%;border:1px solid var(--line);background:var(--surface-2);border-radius:10px;padding:11px 13px;font-size:14px;color:var(--tx);font-family:'Inter'}
.field textarea{min-height:90px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--blue);background:#fff;box-shadow:0 0 0 3px rgba(46,107,255,.12)}
.field .hint{font-size:12px;color:var(--tx-3);margin-top:6px}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
/* connect rows (Stripe / tax) */
.conn{display:flex;align-items:center;gap:14px;padding:16px 18px;border:1px solid var(--line);border-radius:13px;background:var(--surface)}
.conn .ci{width:40px;height:40px;border-radius:10px;background:var(--surface-3);display:grid;place-items:center;flex:0 0 auto}
.conn .ci svg{width:20px;height:20px;stroke:var(--tx-2);fill:none;stroke-width:1.9}
.conn .cb{flex:1}.conn .cb b{font-size:14px;color:var(--tx)}.conn .cb p{font-size:12.5px;color:var(--tx-3)}

/* ── SWITCH ───────────────────────────────────────────────────────── */
.switch{position:relative;display:inline-flex;width:46px;height:26px;flex:0 0 auto}
.switch input{position:absolute;opacity:0;width:100%;height:100%;margin:0;cursor:pointer;z-index:2}
.switch .track{position:absolute;inset:0;background:var(--line-2);border-radius:30px;transition:background .22s}
.switch .knob{position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 2px 5px rgba(0,0,0,.25);transition:transform .22s}
.switch input:checked ~ .track{background:var(--blue)}
.switch input:checked ~ .knob{transform:translateX(20px)}
.switch input:focus-visible ~ .track{box-shadow:0 0 0 3px rgba(46,107,255,.25)}

/* ── MODALS ───────────────────────────────────────────────────────── */
.modal-back{position:fixed;inset:0;z-index:90;background:rgba(5,8,15,.55);backdrop-filter:blur(3px);display:none;align-items:center;justify-content:center;padding:20px}
.modal-back.show{display:flex;animation:fadein .2s ease}
.modal{background:var(--surface);border-radius:var(--r-xl);box-shadow:var(--sh-pop);width:100%;max-width:520px;max-height:90vh;overflow:auto;animation:popin .28s cubic-bezier(.16,1,.3,1)}
@keyframes popin{from{opacity:0;transform:translateY(16px) scale(.97)}to{opacity:1;transform:none}}
.modal-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;padding:22px 24px 0}
.modal-head h3{font-size:19px;color:var(--tx)}
.modal-head .sub{font-size:13px;color:var(--tx-3);margin-top:4px}
.modal-close{width:34px;height:34px;border-radius:9px;display:grid;place-items:center;color:var(--tx-3);transition:background .2s,color .2s}
.modal-close:hover{background:var(--surface-3);color:var(--tx)}
.modal-close svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:2}
.modal-body{padding:18px 24px}
.modal-foot{display:flex;justify-content:flex-end;gap:10px;padding:0 24px 24px}

/* ── TOASTS ───────────────────────────────────────────────────────── */
.toast-zone{position:fixed;bottom:22px;left:50%;transform:translateX(-50%);z-index:100;display:flex;flex-direction:column;gap:10px;align-items:center;pointer-events:none}
.toast{display:flex;align-items:center;gap:10px;background:var(--ink);color:#fff;padding:12px 18px;border-radius:12px;box-shadow:var(--sh-pop);font-size:13.5px;font-weight:500;opacity:0;transform:translateY(14px);transition:opacity .3s,transform .3s}
.toast.show{opacity:1;transform:none}
.toast .ti{width:22px;height:22px;border-radius:50%;background:var(--good);display:grid;place-items:center;flex:0 0 auto}
.toast .ti svg{width:13px;height:13px;stroke:#fff;fill:none;stroke-width:2.6}

/* ── MOBILE drawer scrim + responsive ─────────────────────────────── */
.sb-scrim{display:none;position:fixed;inset:0;background:rgba(5,8,15,.5);z-index:39}
.sb-scrim.show{display:block}
.sb-toggle{display:none}
@media(max-width:1100px){
  .kpis,.quick{grid-template-columns:repeat(2,1fr)}
  .grid-3,.tpl-grid{grid-template-columns:repeat(2,1fr)}
  .col-main{grid-template-columns:1fr}
}
@media(max-width:1024px){
  :root{--sidebar-w:0px}
  .app{grid-template-columns:1fr}
  .sidebar{position:fixed;left:0;top:0;width:264px;transform:translateX(-100%);transition:transform .3s cubic-bezier(.16,1,.3,1)}
  .sidebar.open{transform:none;box-shadow:var(--sh-pop)}
  .sb-toggle{display:grid}
  .sb-link[data-track]{display:flex}/* on mobile drawer, show all; JS still toggles via .show but drawer is rarely track-filtered */
}
@media(max-width:768px){
  .page{padding:20px 18px 50px}
  .topbar{padding:0 18px;gap:12px}
  .tb-search{display:none}
  .grid-2,.field-row{grid-template-columns:1fr}
  .clientrow{grid-template-columns:1fr auto}
  .page-head{gap:12px}
}
@media(max-width:560px){
  .kpis,.quick,.grid-3,.tpl-grid{grid-template-columns:1fr}
  .tb-pill,.tb-user .meta{display:none}
  .linkrow .lk-stats{width:100%}
}
@media(prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
}

/* ════════════════════════════════════════════════════════════════════
   WCAG 2.2 AA CONTRAST OVERRIDES — 2026-06-29 audit P0 sweep
   .tb-pill, .track-card .go, .tp-k were --blue on tinted/light surface;
   push to --blue-press for AA. .pb (sidebar plan) lift opacity off.
═════════════════════════════════════════════════════════════════════ */
.tb-pill{color:var(--blue-press)}
/* Affiliate track .go was --blue (#2E6BFF) on F2F5FA — borderline AA fail.
   Bump only affiliate (default) and let other track tints stay; switching
   the affiliate fallback to blue-press preserves track-color identity for
   ambassador/influencer/creator/coach/recruiter/contributor which already
   pass against --lt2. */
.tk-affiliate .go,a[href$="partner-affiliate.html"] .go,
.track-card:not([class*=tk-]) .go{color:var(--blue-press)}
.tp.recruiter .tp-k{color:var(--blue-press)}
.sb-plan .pb{color:#fff;opacity:1}
.card .pb,.panel .pb,.kpi .pb{color:var(--tx-2)}
