*{box-sizing:border-box;margin:0;padding:0}
:root{
  /* Experior / Pledge Financial Group palette
     black #080707 · golden orange #F8A31E · bright gold #F8D80A
     graphite #545351 · silver #C2BFB8 · soft gray #F3F3F1 · white #FFFFFF */
  --ink:#F3F3F1; --panel:#FFFFFF; --panel2:#FAFAF8; --panel3:#ECEAE3; --line:#E3E1DA; --line2:#C2BFB8;
  /* accent tokens kept readable: used mostly as TEXT, so they map to black/graphite,
     not gold. Gold is applied deliberately to buttons/rings/accents further below. */
  --gold:#0B0A0A; --gold-soft:#545351; --gold-deep:#080707; --gold-dim:#B7B4AD;
  --text:#080707; --muted:#545351; --muted2:#8A867E;
  --ok:#1E9E56; --ok-dim:#DCEFE2; --warn:#DE7A22; --danger:#D93B36;
  --cream:#FBFBFA;
  /* Experior gold accents */
  --exp-gold:#F8A31E; --exp-gold2:#F8D80A; --exp-black:#080707;
  --exp-grad:linear-gradient(135deg,#F8A31E 0%,#F8D80A 100%);
  --r:14px; --r2:10px; --r3:7px;
  --shadow:0 18px 44px -22px rgba(18,16,14,.34);
  --sans:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  --disp:'Bebas Neue','Inter',sans-serif;
  --mono:'JetBrains Mono',ui-monospace,'SF Mono',Menlo,monospace;
}
html{background:var(--ink);-webkit-text-size-adjust:100%}
body{font-family:var(--sans);background:radial-gradient(1200px 700px at 80% -10%,rgba(248,163,30,.05),transparent 60%),var(--ink);color:var(--text);min-height:100vh;line-height:1.45;font-size:14px}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}
input,select,textarea{font-family:inherit;font-size:13px;color:var(--text);background:var(--panel2);border:1px solid var(--line);border-radius:var(--r3);padding:7px 9px;width:100%;transition:border-color .15s,box-shadow .15s}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--gold-deep);box-shadow:0 0 0 3px rgba(248,163,30,.14)}
input::placeholder,textarea::placeholder{color:var(--muted2)}
select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--muted) 50%),linear-gradient(135deg,var(--muted) 50%,transparent 50%);background-position:calc(100% - 15px) 52%,calc(100% - 10px) 52%;background-size:5px 5px,5px 5px;background-repeat:no-repeat;padding-right:26px}
a{color:var(--gold-soft)}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-thumb{background:var(--line2);border-radius:10px;border:2px solid var(--ink)}
::-webkit-scrollbar-track{background:transparent}

/* ===== Shell ===== */
.app{display:grid;grid-template-columns:300px 1fr;height:100vh;height:100dvh;overflow:hidden}
.sidebar{background:linear-gradient(180deg,#FFFFFF,#F2F5FA);border-right:1px solid var(--line);display:flex;flex-direction:column;position:sticky;top:0;height:100vh}
/* ===== Brand — Pledge Agent System Tracker (PropHog) ===== */
.brand{padding:14px 16px 16px;position:relative;background:#011B4E}
.brand::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;
  background:linear-gradient(90deg,transparent 4%,rgba(248,163,30,.8) 50%,transparent 96%)}
.kw-logo{display:block;min-width:0;user-select:none;text-align:center;padding:4px 0 2px}
.brand-mark .brand-product{font-family:'Cormorant Garamond',Georgia,serif;font-weight:600;font-size:28px;line-height:1.05;
  letter-spacing:.4px;color:#EAF4FD}
.brand-mark .brand-sub{font-size:9px;letter-spacing:2.2px;text-transform:uppercase;color:rgba(248,163,30,.85);
  font-weight:600;margin-top:6px}
.brand-mark .brand-company{font-family:var(--mono);font-size:9px;letter-spacing:2.4px;text-transform:uppercase;
  color:#F8A31E;margin-top:8px}
.roster-head{display:flex;align-items:center;justify-content:space-between;padding:14px 18px 8px}
.roster-head span{font-size:11px;letter-spacing:1.5px;text-transform:uppercase;color:var(--muted)}
.btn-add{background:var(--gold);color:#fff;font-weight:700;font-size:12px;padding:6px 11px;border-radius:var(--r3);display:inline-flex;align-items:center;gap:5px;transition:filter .15s,transform .1s}
.btn-add:hover{filter:brightness(1.08)}.btn-add:active{transform:translateY(1px)}
.search{padding:0 14px 8px}
.roster{flex:1;overflow-y:auto;padding:4px 10px 14px}
.agent-card{position:relative;padding:11px 12px 11px 14px;border-radius:var(--r2);border:1px solid transparent;cursor:pointer;margin-bottom:5px;transition:background .15s,border-color .15s}
.agent-card:hover{background:var(--panel)}
.agent-card.active{background:linear-gradient(180deg,var(--panel2),var(--panel));border-color:var(--line2)}
.agent-card.active::before{content:"";position:absolute;left:0;top:8px;bottom:8px;width:3px;border-radius:3px;background:linear-gradient(180deg,var(--gold),var(--gold-deep))}
.agent-card .nm{font-weight:600;font-size:14px;display:flex;align-items:center;gap:7px}
.agent-card .meta{font-size:11px;color:var(--muted);margin-top:2px;display:flex;gap:8px;flex-wrap:wrap}
.rank-chip{font-size:9px;font-weight:800;letter-spacing:.5px;padding:2px 6px;border-radius:20px;background:rgba(248,163,30,.14);color:var(--gold-soft);border:1px solid rgba(248,163,30,.22)}
.mini-bar{height:4px;border-radius:4px;background:var(--panel3);margin-top:8px;overflow:hidden}
.mini-bar i{display:block;height:100%;background:linear-gradient(90deg,var(--gold-deep),var(--gold));border-radius:4px;transition:width .4s}
.roster-empty{color:var(--muted2);font-size:12px;text-align:center;padding:30px 16px;line-height:1.6}
.side-foot{border-top:1px solid var(--line);padding:10px 14px;display:flex;gap:7px;flex-wrap:wrap}
.side-foot button{font-size:11px;color:var(--muted);padding:6px 9px;border-radius:var(--r3);border:1px solid var(--line);flex:1;transition:color .15s,border-color .15s}
.side-foot button:hover{color:var(--gold-soft);border-color:var(--gold-deep)}

/* ===== Main ===== */
.main{display:flex;flex-direction:column;min-width:0;height:100vh;height:100dvh;overflow-y:auto;overflow-x:hidden}
.empty-main{display:flex;flex-direction:column;align-items:center;justify-content:center;flex:1;text-align:center;color:var(--muted);gap:14px;padding:40px}
.empty-main h2{font-family:var(--disp);font-size:34px;letter-spacing:2px;color:var(--text)}

.topbar{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.85);backdrop-filter:blur(10px);border-bottom:1px solid var(--line);padding:16px 26px 0}
.tb-row{display:flex;align-items:flex-start;gap:20px;justify-content:space-between;flex-wrap:wrap}
.chip{font-size:11px;color:var(--muted);background:var(--panel2);border:1px solid var(--line);padding:4px 9px;border-radius:20px;display:inline-flex;align-items:center;gap:5px}
.chip b{color:var(--text);font-weight:600}
.tb-stats{display:flex;gap:24px;align-items:center}
.ring{--p:0;width:64px;height:64px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(var(--gold) calc(var(--p)*1%),var(--panel3) 0);position:relative;flex-shrink:0}
.ring::before{content:"";position:absolute;inset:6px;border-radius:50%;background:var(--ink)}
.ring .pv{position:relative;font-weight:800;font-size:16px;color:var(--gold)}
.ring .pl{position:relative;font-size:8px;letter-spacing:1px;color:var(--muted);text-transform:uppercase;margin-top:-2px}
.tabs{display:flex;gap:5px;margin-top:14px;overflow-x:auto;padding:2px 0}
.tab{padding:9px 15px;font-size:13px;font-weight:500;color:var(--muted);border-radius:8px;white-space:nowrap;transition:color .15s,text-shadow .18s;display:flex;align-items:center;gap:7px}
.tab:hover{color:var(--text)}
.tab.active{color:var(--gold-soft);font-weight:800;text-shadow:0 0 14px rgba(248,163,30,.45),0 0 3px rgba(248,163,30,.22)}
.tab .badge{font-size:10px;background:var(--panel3);color:var(--muted);padding:1px 6px;border-radius:10px;font-weight:700}
.tab.active .badge{background:rgba(248,163,30,.12);color:var(--gold-soft)}

.content{padding:24px 26px 60px;max-width:1320px;width:100%}
.section-title{font-family:var(--disp);font-size:22px;letter-spacing:1.5px;color:var(--text);margin:4px 0 14px;display:flex;align-items:center;gap:10px}
.section-title .ct{font-size:12px;color:var(--muted);letter-spacing:0;font-family:var(--sans);font-weight:500}

/* cards / panels */
.panel{background:linear-gradient(180deg,var(--panel2),var(--panel));border:1px solid var(--line);border-radius:var(--r);padding:18px 20px;margin-bottom:18px;box-shadow:0 1px 2px rgba(18,16,14,.05),0 10px 26px -18px rgba(18,16,14,.18)}
.panel-h{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}
.panel-h h3{font-size:15px;font-weight:600;letter-spacing:.2px;display:flex;align-items:center;gap:9px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.field{display:flex;flex-direction:column;gap:5px;margin-bottom:11px}
.field label{font-size:10px;letter-spacing:1px;text-transform:uppercase;color:var(--muted)}

/* progress bar */
.pbar{height:7px;border-radius:6px;background:var(--panel3);overflow:hidden;flex:1}
.pbar i{display:block;height:100%;background:linear-gradient(90deg,var(--gold-deep),var(--gold));transition:width .4s}
.pbar.ok i{background:linear-gradient(90deg,var(--ok-dim),var(--ok))}

/* ===== System checklist ===== */
.phase{margin-bottom:16px;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:var(--panel);box-shadow:0 1px 2px rgba(18,16,14,.05),0 10px 26px -18px rgba(18,16,14,.18)}
.phase-h{display:flex;align-items:center;gap:14px;padding:14px 18px;cursor:pointer;background:linear-gradient(180deg,var(--panel2),var(--panel));transition:background .15s}
.phase-h:hover{background:var(--panel3)}
.phase-h .pname{font-family:var(--disp);font-size:19px;letter-spacing:1px;color:var(--text);flex-shrink:0}
.phase-h .pcount{font-size:12px;color:var(--gold-soft);font-weight:700;font-variant-numeric:tabular-nums}
.phase-h .chev{color:var(--muted);transition:transform .2s;margin-left:auto}
.phase.collapsed .chev{transform:rotate(-90deg)}
.phase.collapsed .phase-body{display:none}
.phase.done .phase-h .pname{color:var(--gold)}
.phase-body{padding:6px 18px 16px}
.group{padding:12px 0;border-bottom:1px solid var(--line)}
.group:last-child{border-bottom:none}
.group-h{display:flex;align-items:center;gap:12px;margin-bottom:9px}
.group-h .gt{font-size:11px;letter-spacing:1.5px;text-transform:uppercase;color:var(--muted);font-weight:700;white-space:nowrap}
.group-h .gc{font-size:11px;color:var(--muted2);font-variant-numeric:tabular-nums}
.checks{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:6px}
.check{display:flex;align-items:center;gap:10px;padding:9px 11px;border-radius:var(--r3);background:var(--panel2);border:1px solid var(--line);cursor:pointer;transition:background .12s,border-color .12s;user-select:none}
.check:hover{background:var(--panel3);border-color:var(--line2)}
.check .box{width:18px;height:18px;border-radius:5px;border:1.5px solid var(--line2);flex-shrink:0;display:grid;place-items:center;transition:all .15s}
.check .box svg{width:11px;height:11px;stroke:#fff;stroke-width:3.5;opacity:0}
.check .lab{font-size:13px;color:var(--text)}
.check.on{background:rgba(31,168,90,.10);border-color:rgba(31,168,90,.45)}
.check.on .box{background:var(--ok);border-color:var(--ok)}
.check.on .box svg{opacity:1}
.check.on .lab{color:var(--muted)}

/* progressions badges */
.prog-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:8px}
.prog{display:flex;align-items:center;gap:10px;padding:11px 13px;border-radius:var(--r2);background:var(--panel2);border:1px solid var(--line);cursor:pointer;transition:all .15s}
.prog:hover{border-color:var(--line2)}
.prog .ic{width:26px;height:26px;border-radius:50%;border:1.5px solid var(--line2);display:grid;place-items:center;flex-shrink:0;color:var(--muted2);font-size:13px;transition:all .15s}
.prog .pl{font-size:12.5px;font-weight:500}
.prog.on{background:linear-gradient(180deg,rgba(248,163,30,.10),rgba(248,163,30,.03));border-color:rgba(248,163,30,.4)}
.prog.on .ic{background:var(--gold);border-color:var(--gold);color:#fff}
.prog.on .pl{color:var(--gold-soft)}

/* ===== Tables ===== */
.tablewrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r);background:var(--panel);box-shadow:0 1px 2px rgba(18,16,14,.05),0 10px 26px -18px rgba(18,16,14,.18)}
table{border-collapse:collapse;width:100%;font-size:13px}
thead th{position:sticky;top:0;background:var(--panel3);text-align:left;font-size:10px;letter-spacing:1px;text-transform:uppercase;color:var(--muted);font-weight:700;padding:11px 10px;white-space:nowrap;border-bottom:1px solid var(--line2)}
tbody td{padding:5px 7px;border-bottom:1px solid var(--line);vertical-align:middle}
tbody tr:hover{background:rgba(248,163,30,.04)}
td input,td select,td textarea{background:transparent;border:1px solid transparent;border-radius:5px;padding:6px 7px}
td input:hover,td select:hover,td textarea:hover{border-color:var(--line)}
td input:focus,td select:focus,td textarea:focus{background:var(--panel2);border-color:var(--gold-deep)}
td.num{text-align:right;font-variant-numeric:tabular-nums;font-family:var(--mono);font-size:12px;color:var(--gold-soft);white-space:nowrap;padding-right:12px}
td.idx{color:var(--muted2);font-size:11px;text-align:center;width:34px;font-variant-numeric:tabular-nums}
.row-x{color:var(--muted2);width:30px;text-align:center}
.row-x button{width:22px;height:22px;border-radius:5px;color:var(--muted2);transition:all .12s}
.row-x button:hover{background:rgba(217,59,54,.12);color:var(--danger)}
.cell-toggle{width:42px;height:23px;border-radius:20px;background:var(--panel3);border:1px solid var(--line2);position:relative;cursor:pointer;transition:background .15s;margin:0 auto}
.cell-toggle::after{content:"";position:absolute;top:1.5px;left:1.5px;width:18px;height:18px;border-radius:50%;background:var(--muted);transition:transform .18s,background .15s}
.cell-toggle.on{background:var(--ok-dim);border-color:var(--ok)}
.cell-toggle.on::after{transform:translateX(19px);background:var(--ok)}
.tbl-foot{display:flex;align-items:center;gap:14px;padding:11px 14px;border-top:1px solid var(--line2);background:var(--panel2);flex-wrap:wrap}
.btn-row{background:var(--panel3);border:1px solid var(--line2);color:var(--gold-soft);font-weight:600;font-size:12px;padding:8px 14px;border-radius:var(--r3);display:inline-flex;align-items:center;gap:6px;transition:all .15s}
.btn-row:hover{background:var(--panel3);border-color:var(--gold-deep);filter:brightness(1.1)}
.totals{display:flex;gap:22px;margin-left:auto;flex-wrap:wrap}
.total{text-align:right}
.total .l{font-size:9px;letter-spacing:1px;text-transform:uppercase;color:var(--muted)}
.total .v{font-family:var(--mono);font-size:16px;font-weight:600;color:var(--gold)}

/* dreams */
.dream-row{display:grid;grid-template-columns:40px 130px 1fr 1fr 30px;gap:8px;align-items:center;padding:5px 0}
.dream-row .di{color:var(--gold-deep);font-family:var(--disp);font-size:18px;text-align:center}

/* EMD */
.emd-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px}
.emd-month{background:var(--panel2);border:1px solid var(--line);border-radius:var(--r2);padding:14px;box-shadow:0 1px 2px rgba(18,16,14,.05),0 10px 26px -18px rgba(18,16,14,.18)}
.emd-month h4{font-family:var(--disp);font-size:17px;letter-spacing:1px;color:var(--gold-soft);margin-bottom:10px;display:flex;justify-content:space-between;align-items:baseline}
.emd-month h4 .mp{font-family:var(--mono);font-size:13px;color:var(--gold)}
.emd-total{display:flex;align-items:center;gap:16px;background:linear-gradient(180deg,var(--panel2),var(--panel));border:1px solid var(--gold-deep);border-radius:var(--r);padding:16px 20px;margin-bottom:16px}
.emd-total .big{font-family:var(--mono);font-size:26px;font-weight:700;color:var(--gold)}

/* partners */
.partner{background:var(--panel2);border:1px solid var(--line);border-radius:var(--r2);margin-bottom:10px;overflow:hidden;box-shadow:0 1px 2px rgba(18,16,14,.05),0 10px 26px -18px rgba(18,16,14,.18)}
.partner-h{display:grid;grid-template-columns:1fr auto auto;gap:12px;align-items:center;padding:12px 16px;cursor:pointer}
.partner-h:hover{background:var(--panel3)}
.partner-h .pn{font-weight:600}
.partner-body{padding:4px 16px 16px;border-top:1px solid var(--line);display:none}
.partner.open .partner-body{display:block}
.flagset{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:5px;margin-top:10px}

/* toast */
.toast{position:fixed;bottom:22px;left:50%;transform:translateX(-50%) translateY(20px);background:var(--panel3);border:1px solid var(--line2);color:var(--text);padding:11px 20px;border-radius:30px;font-size:13px;font-weight:500;box-shadow:var(--shadow);opacity:0;pointer-events:none;transition:all .25s;z-index:100;display:flex;align-items:center;gap:9px}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
.toast .dot{width:8px;height:8px;border-radius:50%;background:var(--ok)}
.save-pill{font-size:11px;color:var(--muted2);display:flex;align-items:center;gap:6px}
.save-pill .dot{width:7px;height:7px;border-radius:50%;background:var(--ok);transition:opacity .2s}

/* misc */
.hint{font-size:12px;color:var(--muted);background:var(--panel2);border:1px solid var(--line);border-left:3px solid var(--gold-deep);border-radius:var(--r3);padding:11px 14px;margin-bottom:16px;line-height:1.55}
.muted{color:var(--muted)}
.btn-ghost{border:1px solid var(--line2);color:var(--muted);font-size:12px;padding:7px 12px;border-radius:var(--r3);transition:all .15s}
.btn-ghost:hover{color:var(--gold-soft);border-color:var(--gold-deep)}
.split{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.choose-one{font-size:11px;color:var(--gold-deep);font-weight:700;letter-spacing:1px;text-transform:uppercase}

@media(max-width:980px){
  .app{grid-template-columns:1fr}
  .sidebar{position:fixed;left:0;top:0;width:300px;z-index:60;transform:translateX(-100%);transition:transform .25s}
  .sidebar.open{transform:translateX(0)}
  .grid2,.grid3{grid-template-columns:1fr}
  .menu-btn{display:inline-flex!important}
  .scrim{position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:55;display:none}
  .scrim.show{display:block}
}
.menu-btn{display:none;align-items:center;gap:7px}

/* ===== Team Dashboard ===== */
.kpi-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(178px,1fr));gap:14px;margin-bottom:18px}
.kpi{background:linear-gradient(180deg,var(--panel2),var(--panel));border:1px solid var(--line);border-radius:var(--r2);padding:16px 16px 15px;box-shadow:0 1px 2px rgba(18,16,14,.05),0 10px 26px -18px rgba(18,16,14,.18)}
.kpi .l{font-size:10px;letter-spacing:1px;text-transform:uppercase;color:var(--muted)}
.kpi .v{font-family:var(--disp);font-size:30px;letter-spacing:1px;color:var(--gold);line-height:1.05;margin-top:6px}
.kpi .ksub{font-size:11px;color:var(--muted2);margin-top:3px}
.rank-tag{font-size:11px;color:var(--muted);white-space:nowrap}.rank-tag b{color:var(--text);font-weight:700}
.dash-row{cursor:pointer;transition:background .12s}
.dash-row:hover{background:rgba(248,163,30,.04)}
.da-name{font-weight:600;font-size:13.5px}.da-sub{font-size:11px;color:var(--muted);margin-top:1px}
.nav-dash{display:flex;align-items:center;gap:9px;padding:10px 12px;margin:0 0 6px;border-radius:var(--r2);cursor:pointer;font-weight:600;font-size:13px;color:var(--muted);border:1px solid transparent;transition:all .14s}
.nav-dash:hover{background:var(--panel);color:var(--text)}
.nav-dash.active{background:linear-gradient(180deg,var(--panel2),var(--panel));border-color:var(--line2);color:var(--text)}
.nav-dash .di{width:18px;height:18px;display:grid;place-items:center;color:var(--gold-soft);font-size:14px}
.roster-sub{font-size:10px;letter-spacing:1.5px;text-transform:uppercase;color:var(--muted2);padding:6px 4px 6px;margin-top:2px}
.dash-back{font-size:11px;font-weight:600;color:var(--gold-soft);border:1px solid var(--line2);padding:5px 11px;border-radius:20px;transition:all .14s;line-height:1}
.dash-back:hover{border-color:var(--gold-deep);background:var(--panel2)}

/* ===== Pipeline cards (Recruits / Field Trainings) ===== */
.rec-list{display:flex;flex-direction:column;gap:8px}
.rec-card{display:flex;align-items:center;gap:14px;background:linear-gradient(180deg,var(--panel2),var(--panel));border:1px solid var(--line);border-radius:var(--r2);padding:11px 13px;box-shadow:0 1px 2px rgba(18,16,14,.05),0 8px 22px -18px rgba(18,16,14,.16);transition:border-color .14s,box-shadow .14s}
.rec-card:hover{border-color:var(--line2);box-shadow:0 1px 2px rgba(18,16,14,.06),0 14px 30px -18px rgba(18,16,14,.24)}
.rec-stat{width:32px;height:32px;border-radius:50%;border:2px solid var(--line2);flex-shrink:0;cursor:pointer;display:grid;place-items:center;transition:all .15s}
.rec-stat span{width:11px;height:11px;border-radius:50%;background:var(--line2);transition:all .15s}
.rec-stat:hover{border-color:var(--ok)}
.rec-stat.on{border-color:var(--ok);background:rgba(31,168,90,.12)}.rec-stat.on span{background:var(--ok)}
.rec-main{flex:1;min-width:0;cursor:pointer}
.rec-name{font-weight:600;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rec-meta{font-size:12px;color:var(--muted);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rec-appt{color:var(--gold-soft);font-weight:600;margin-left:4px}
.rec-tags{flex-shrink:0}
.rec-pill{font-size:10px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;padding:4px 10px;border-radius:20px;background:var(--panel3);color:var(--muted2);border:1px solid var(--line);white-space:nowrap}
.rec-pill.on{background:rgba(31,168,90,.12);color:#127A40;border-color:rgba(31,168,90,.35)}
.rec-edit{flex-shrink:0;font-size:12px;font-weight:600;color:var(--gold-soft);border:1px solid var(--line2);padding:7px 13px;border-radius:var(--r3);transition:all .14s}
.rec-edit:hover{border-color:var(--gold-deep);background:var(--panel2)}
.rec-del{flex-shrink:0;width:30px;height:30px;border-radius:var(--r3);color:var(--muted2);transition:all .12s}
.rec-del:hover{background:rgba(217,59,54,.12);color:var(--danger)}
.rec-empty{color:var(--muted2);font-size:13px;text-align:center;padding:34px 16px;border:1px dashed var(--line2);border-radius:var(--r2)}

/* ===== Modal record editor ===== */
.modal-overlay{position:fixed;inset:0;z-index:200;display:none;align-items:flex-start;justify-content:center;padding:42px 18px;background:rgba(15,31,61,.45);backdrop-filter:blur(3px);overflow-y:auto}
.modal-overlay.show{display:flex}
.modal{width:100%;max-width:720px;background:var(--panel);border:1px solid var(--line2);border-radius:var(--r);box-shadow:0 40px 90px -30px rgba(0,0,0,.6);animation:modalIn .18s ease;margin:auto}
@keyframes modalIn{from{opacity:0;transform:translateY(10px) scale(.99)}to{opacity:1;transform:none}}
.modal-h{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;padding:18px 22px 14px;border-bottom:1px solid var(--line)}
.mh-t{font-family:var(--disp);font-size:24px;letter-spacing:1px;color:var(--text);line-height:1}
.mh-s{font-size:12px;color:var(--muted);margin-top:6px}
.modal-x{width:32px;height:32px;border-radius:var(--r3);color:var(--muted);border:1px solid var(--line);flex-shrink:0;transition:all .14s}
.modal-x:hover{color:var(--text);border-color:var(--line2);background:var(--panel2)}
.modal-b{padding:18px 22px}
.switch-row{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:16px}
.switch{display:inline-flex;align-items:center;gap:9px;padding:8px 14px 8px 9px;border-radius:30px;border:1px solid var(--line);background:var(--panel2);font-size:13px;font-weight:600;color:var(--muted);transition:all .15s}
.switch .kn{width:34px;height:19px;border-radius:20px;background:var(--panel3);border:1px solid var(--line2);position:relative;transition:background .15s;flex-shrink:0}
.switch .kn::after{content:"";position:absolute;top:1px;left:1px;width:15px;height:15px;border-radius:50%;background:var(--muted);transition:transform .18s,background .15s}
.switch.on{color:var(--text);border-color:rgba(31,168,90,.4);background:rgba(31,168,90,.08)}
.switch.on .kn{background:var(--ok-dim);border-color:var(--ok)}
.switch.on .kn::after{transform:translateX(15px);background:var(--ok)}
.modal-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.modal-b textarea{resize:vertical;min-height:74px}
.modal-f{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 22px 18px;border-top:1px solid var(--line)}
.danger-ghost:hover{color:var(--danger);border-color:var(--danger)}
@media(max-width:620px){.modal-grid{grid-template-columns:1fr}}

/* ===== Agent topbar stats (world-class) ===== */
.tb-stats{display:flex;gap:20px;align-items:center}
.stat-ring{position:relative;width:76px;height:76px;flex-shrink:0}
.stat-ring svg{width:100%;height:100%;transform:rotate(-90deg);display:block}
.stat-ring .trk{fill:none;stroke:var(--panel3);stroke-width:7}
.stat-ring .prg{fill:none;stroke:var(--gold);stroke-width:7;stroke-linecap:round;transition:stroke-dashoffset .55s cubic-bezier(.4,0,.2,1)}
.stat-ring .sr-c{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center}
.sr-pct{font-family:var(--disp);font-size:24px;letter-spacing:.5px;color:var(--text);line-height:1}
.sr-pct span{font-size:12px;color:var(--muted);margin-left:1px}
.sr-lab{font-size:8px;letter-spacing:1.6px;text-transform:uppercase;color:var(--muted2);margin-top:3px;font-weight:700}
.rank-line{display:flex;align-items:center;gap:10px;justify-content:flex-end;margin-top:6px}
.rank-name{font-size:14px;font-weight:600;color:var(--text);white-space:nowrap}
.rank-badge{font-family:var(--disp);font-size:21px;letter-spacing:1px;color:#fff;background:linear-gradient(135deg,#0B3070,#00205A);border-radius:9px;padding:2px 12px;line-height:1.25;box-shadow:0 8px 18px -10px rgba(248,163,30,.75),inset 0 1px 0 rgba(255,255,255,.12)}
.rank-sub{font-size:11px;color:var(--muted);margin-top:6px}

/* ===== Clients / Delivery book ===== */
.book-bar{display:flex;align-items:center;gap:18px;flex-wrap:wrap;background:linear-gradient(180deg,var(--panel2),var(--panel));border:1px solid var(--line);border-radius:var(--r2);padding:12px 16px;margin-bottom:14px;box-shadow:0 1px 2px rgba(18,16,14,.05),0 10px 26px -18px rgba(18,16,14,.16)}
.book-bar .totals{margin-left:auto}
.pol-figs{display:flex;gap:18px;flex-shrink:0}
.pol-figs .pf{text-align:right}
.pol-figs .pf span{display:block;font-size:9px;letter-spacing:.5px;text-transform:uppercase;color:var(--muted2)}
.pol-figs .pf b{font-family:var(--mono);font-size:14px;color:var(--gold-soft);font-weight:600}
.calc-row{display:flex;gap:12px;margin-top:16px}
.calc-field{flex:1;background:linear-gradient(180deg,var(--panel2),var(--panel));border:1px solid var(--line2);border-radius:var(--r2);padding:13px 15px}
.cf-l{font-size:10px;letter-spacing:1px;text-transform:uppercase;color:var(--muted)}
.cf-v{font-family:var(--mono);font-size:21px;font-weight:600;color:var(--gold);margin-top:5px;line-height:1}
@media(max-width:560px){.pol-figs{display:none}.calc-row{flex-direction:column}}

/* ===== Hover "lamp" animations — dashboard KPI tiles ===== */
.kpi{position:relative;transition:transform .3s cubic-bezier(.2,.7,.2,1),box-shadow .35s ease,border-color .25s ease}
.kpi:hover{transform:translateY(-5px);border-color:var(--line2);box-shadow:0 2px 5px rgba(18,16,14,.08),0 24px 52px -18px rgba(18,16,14,.34),0 0 30px -2px rgba(248,163,30,.55),0 12px 66px 6px rgba(248,163,30,.32)}
.kpi .v{transition:text-shadow .3s ease}
.kpi:hover .v{text-shadow:0 0 22px rgba(248,163,30,.42)}

/* ===== Hover animations — sidebar agent cards ===== */
.agent-card{position:relative;transition:background .2s ease,border-color .2s ease,transform .24s cubic-bezier(.2,.7,.2,1),box-shadow .24s ease}
.agent-card:hover{background:linear-gradient(180deg,#fff,var(--panel2));border-color:var(--line2);box-shadow:inset 3px 0 0 0 var(--gold-soft),0 12px 26px -16px rgba(18,16,14,.45)}
.agent-card:not(.active):hover{transform:translateX(4px)}
.agent-card .nm{transition:color .2s ease}
.agent-card:hover .nm{color:var(--gold-soft)}
.agent-card .mini-bar i{transition:box-shadow .25s ease,width .4s}
.agent-card:hover .mini-bar i{box-shadow:0 0 10px rgba(248,163,30,.65)}
/* same lamp cue on the Dashboard nav item */
.nav-dash{position:relative;transition:background .18s,color .18s,box-shadow .22s,transform .22s cubic-bezier(.2,.7,.2,1)}
.nav-dash:not(.active):hover{transform:translateX(3px);box-shadow:0 10px 22px -16px rgba(18,16,14,.4)}

@media (prefers-reduced-motion:reduce){
  .kpi,.agent-card,.nav-dash{transition:none!important}
  .kpi:hover,.agent-card:not(.active):hover,.nav-dash:not(.active):hover{transform:none}
}

/* ===== Modal flag/checklist sections (Business Partners) ===== */
.mf-sec{margin-top:18px}
.mf-sec .mf-h{font-size:11px;letter-spacing:1.5px;text-transform:uppercase;color:var(--muted);font-weight:700;margin-bottom:9px;padding-top:14px;border-top:1px solid var(--line)}
.mf-sec .flagset{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:6px}

/* print */
@media print{
  .sidebar,.tabs,.topbar .tb-stats,.tbl-foot .btn-row,.row-x,.side-foot,.menu-btn,.btn-add,.toast{display:none!important}
  body,html{background:#fff;color:#000}
  .app{display:block;height:auto;overflow:visible}.main{display:block;height:auto;overflow:visible}
  .panel,.phase,.tablewrap,.emd-month,.partner{border-color:#bbb;background:#fff!important;break-inside:avoid}
  .content{padding:0;max-width:none}
  .check,.prog,input,select,textarea{background:#fff!important;color:#000!important;border-color:#ccc!important}
  .check.on .box{background:#000;border-color:#000}.check.on .box svg{stroke:#fff}
  .section-title,.phase-h .pname{color:#000!important}
  *{-webkit-print-color-adjust:exact;print-color-adjust:exact}
}

/* ===== Live app extensions (pledgebackoffice.com) ===== */
.sidebar{overflow:hidden}
.sidebar-main{flex:1;min-height:0;display:flex;flex-direction:column;overflow:hidden}
.sidebar-foot{flex-shrink:0;margin-top:auto}
.agent-roster-ui{flex:1;min-height:0;display:flex;flex-direction:column;overflow:hidden}
.side-foot.side-foot-status{border-top:none;padding-top:0}

.user-profile-summary{padding:12px 15px;border-bottom:1px solid var(--line);font-size:13px;background:var(--panel2)}
.user-profile-label{color:var(--muted);font-size:11px}
.user-profile-name{font-weight:700;color:var(--text);font-size:14px;margin-top:2px}
.user-profile-role{font-size:11px;color:var(--gold-soft);text-transform:uppercase;font-weight:600;margin-top:2px}
.btn-sign-out{color:var(--danger);font-size:11px;border:1px solid var(--danger);background:transparent;padding:4px 8px;border-radius:var(--r3);margin-top:8px;width:100%;cursor:pointer;font-weight:600;transition:background .15s,color .15s}
.btn-sign-out:hover{background:rgba(217,59,54,.1)}

.main-empty-hint{padding:40px;color:var(--muted);text-align:center}

.agent-item{position:relative;padding:11px 12px 11px 14px;border-radius:var(--r2);border:1px solid transparent;cursor:pointer;margin-bottom:5px;transition:background .2s ease,border-color .2s ease,transform .24s cubic-bezier(.2,.7,.2,1),box-shadow .24s ease;font-family:var(--sans)}
.agent-item:hover{background:linear-gradient(180deg,#fff,var(--panel2));border-color:var(--line2);box-shadow:inset 3px 0 0 0 var(--gold-soft),0 12px 26px -16px rgba(18,16,14,.45)}
.agent-item:not(.active):not(.active-selected-style):hover{transform:translateX(4px)}
.agent-item.active,.agent-item.active-selected-style{background:linear-gradient(180deg,var(--panel2),var(--panel));border-color:var(--line2)}
.agent-item.active::before,.agent-item.active-selected-style::before{content:"";position:absolute;left:0;top:8px;bottom:8px;width:3px;border-radius:3px;background:linear-gradient(180deg,var(--gold),var(--gold-deep))}
.agent-item-name{font-weight:600;font-size:14px;color:var(--text);line-height:1.35;transition:color .2s ease}
.agent-item:hover .agent-item-name{color:var(--gold-soft)}
.agent-item-meta{font-size:11px;color:var(--muted);margin-top:3px}
.status-active{color:var(--ok)}
.status-onboarding{color:var(--warn)}
.status-inactive{color:var(--muted2)}

button.is-busy,.btn-add.is-busy,.btn-row.is-busy,.btn-ghost.is-busy,.check.is-busy,.prog.is-busy,.cell-toggle.is-busy{opacity:.65;cursor:wait;pointer-events:none}
.prog.is-readonly{cursor:default;opacity:.85}

.field-spaced{margin-bottom:14px}
.phase-count{color:var(--gold-soft)}
.pbar-label{font-size:12px;color:var(--muted);width:38px;text-align:right;flex-shrink:0}
.pbar-narrow{max-width:200px}
.pbar-wide{max-width:480px}
.split-mb{margin-bottom:14px}
.total-left{text-align:left}
.rank-name-sub{margin-top:4px}

.state-loading,.state-error{padding:40px;text-align:center}
.state-loading{color:var(--muted)}
.state-error{color:var(--danger)}

td.mono{font-family:var(--mono)}
td.num-gold{color:var(--gold-soft)}
td.num-ok{color:var(--ok)}
.btn-wipe{background:none;border:none;color:var(--danger);cursor:pointer;padding:0;font-size:13px}
.btn-wipe:hover{text-decoration:underline}
.row-divider{border-bottom:1px solid var(--line)}

.policy-modal-overlay{position:fixed;inset:0;background:rgba(15,31,61,.45);z-index:70;display:flex;align-items:center;justify-content:center;padding:20px;backdrop-filter:blur(3px);overflow-y:auto}
.policy-modal-panel{background:linear-gradient(180deg,var(--panel2),var(--panel));border:1px solid var(--line2);border-radius:var(--r);padding:24px;max-width:460px;width:100%;box-shadow:var(--shadow);max-height:calc(100vh - 40px);max-height:calc(100dvh - 40px);overflow-y:auto;margin:auto}
.policy-modal-panel h3{font-family:var(--disp);font-size:24px;letter-spacing:1px;margin-bottom:18px;color:var(--text)}
.policy-modal-actions{display:flex;gap:10px;margin-top:20px;justify-content:flex-end}
.policy-modal-hint{font-size:12px;color:var(--muted);margin-top:6px;line-height:1.5}
.policy-estimate{margin-top:14px;padding:12px 14px;border-radius:var(--r3);background:rgba(248,163,30,.08);border:1px solid rgba(248,163,30,.2);font-size:12px;color:var(--gold-soft);line-height:1.6}
.policy-estimate b{color:var(--gold);font-family:var(--mono)}

.col-idx{width:34px}
.col-called,.col-married{width:70px}
.col-num{min-width:120px}
.col-name{min-width:130px}
.col-loc{min-width:120px}
.col-tz{min-width:90px}
.col-age{min-width:55px}
.col-occ{min-width:130px}
.col-appt{min-width:130px}
.col-qual{min-width:170px}
.col-notes{min-width:200px}
.cell-center{text-align:center}
.row-empty td{padding:20px 24px;text-align:center;color:var(--muted2)}
.toggle-readonly{opacity:.6;pointer-events:none}

body.role-agent .staff-only-ui,
body.role-agent .admin-only-ui,
body.role-agent .super-admin-only-ui,
body.role-agent .agent-roster-ui{display:none!important}
body.role-admin .super-admin-only-ui{display:none!important}

.hint-mt{margin-top:14px}
.hint-narrow{max-width:420px}
.dream-empty{padding:20px 0;color:var(--muted2);text-align:center;font-size:13px}
.btn-add-dream{margin-top:10px}
.dream-header{font-size:10px;letter-spacing:1px;text-transform:uppercase;color:var(--muted)}
.empty-main-tall{min-height:320px}
.col-action{width:30px}
.col-children{width:80px}
.col-homeowner{width:90px}
.col-referred{min-width:120px}
.pbar-fill{display:block;height:100%}
.is-hidden{display:none!important}

/* ===== Login page ===== */
body.auth-page{display:flex;justify-content:center;align-items:center;min-height:100vh;margin:0;overflow:hidden;background:radial-gradient(1200px 700px at 80% -10%,rgba(248,163,30,.08),transparent 60%),var(--ink)}
.auth-container{background:var(--panel);border:1px solid var(--line);padding:0;border-radius:var(--r);width:100%;max-width:380px;box-shadow:var(--shadow);text-align:center;overflow:hidden}
.auth-brand-header{background:linear-gradient(140deg,#201c15,#0c0a08);padding:28px 32px 22px;text-align:center}
.auth-brand{margin-bottom:0}
.auth-brand .crown{font-size:32px;color:#F8C21E;line-height:1;margin-bottom:5px}
.auth-brand h1{font-family:var(--disp);font-size:36px;letter-spacing:2px;margin:0;color:#fff}
.auth-brand h1 b{color:#F8C21E;font-weight:400}
.auth-brand .sub{font-size:11px;color:#AEBCD6;text-transform:uppercase;letter-spacing:1px;margin-top:2px;font-weight:600}
.auth-form{padding:32px}
.auth-group{text-align:left;margin-bottom:20px}
.auth-group label{display:block;font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.5px;margin-bottom:6px;font-weight:600}
.auth-group input{width:100%;padding:12px;background:var(--panel2);border:1px solid var(--line);border-radius:var(--r3);color:var(--text);font-size:14px;box-sizing:border-box}
.auth-group input:focus{border-color:var(--gold-deep);background:var(--panel)}
.btn-auth-submit{width:100%;padding:14px;background:var(--gold);color:#fff;border:none;border-radius:var(--r3);font-weight:700;font-size:14px;text-transform:uppercase;letter-spacing:.5px;cursor:pointer;transition:filter .2s ease;margin-top:10px}
.btn-auth-submit:hover{filter:brightness(1.08)}
.auth-status-msg{font-size:12px;color:var(--danger);margin-top:15px;min-height:18px;font-weight:500;padding:0 32px 24px}

/* =========================================================================
   Pledge Agent System Tracker — additions
   Append this to css/styles.css. Uses the existing token system only
   (--gold is the navy #00205A, --disp is Bebas Neue, etc.) so it reads as
   part of the same app, not a bolt-on.
   ========================================================================= */

/* ===== System tab: the "Edit structure" entry button ===== */
.btn-edit-structure{
  border:1px solid var(--gold-deep);
  color:var(--gold-soft);
  font-size:12px;font-weight:700;
  padding:7px 13px;border-radius:var(--r3);
  display:inline-flex;align-items:center;gap:6px;
  transition:background .15s,filter .15s;
}
.btn-edit-structure:hover{background:var(--panel2);filter:brightness(1.04)}
.btn-edit-structure .es-ic{font-size:13px;line-height:1}

/* ===== Structure editor overlay ===== */
.se-overlay{
  position:fixed;inset:0;z-index:300;
  background:rgba(15,31,61,.48);backdrop-filter:blur(4px);
  display:flex;align-items:flex-start;justify-content:center;
  padding:38px 18px;overflow-y:auto;
}
body.se-open{overflow:hidden}
.se-modal{
  width:100%;max-width:760px;margin:auto;
  background:var(--panel);
  border:1px solid var(--line2);border-radius:var(--r);
  box-shadow:0 40px 90px -30px rgba(0,0,0,.6);
  display:flex;flex-direction:column;max-height:calc(100vh - 76px);
  animation:seIn .18s ease;
}
@keyframes seIn{from{opacity:0;transform:translateY(10px) scale(.99)}to{opacity:1;transform:none}}

.se-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;padding:20px 22px 14px;border-bottom:1px solid var(--line)}
.se-title{font-family:var(--disp);font-size:25px;letter-spacing:1px;color:var(--text);line-height:1}
.se-sub{font-size:12px;color:var(--muted);margin-top:7px;max-width:560px;line-height:1.5;text-wrap:pretty}
.se-x{width:34px;height:34px;border-radius:var(--r3);color:var(--muted);border:1px solid var(--line);flex-shrink:0;font-size:15px;transition:all .14s}
.se-x:hover{color:var(--text);border-color:var(--line2);background:var(--panel2)}

.se-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 22px;border-bottom:1px solid var(--line);background:var(--panel2)}
.se-archived-toggle{display:inline-flex;align-items:center;gap:8px;font-size:12px;color:var(--muted);cursor:pointer;font-weight:600}
.se-archived-toggle input{width:auto}
.se-saving{font-size:11px;color:var(--ok);font-weight:700;letter-spacing:.3px;min-height:14px}

.se-body{padding:16px 22px;overflow-y:auto;flex:1}
.se-loading,.se-empty,.se-empty-sub,.se-error{color:var(--muted);font-size:13px;text-align:center;padding:24px 8px;line-height:1.55}
.se-empty-sub{padding:10px 8px;color:var(--muted2);font-size:12px}
.se-error{color:var(--danger);text-align:left;background:rgba(217,59,54,.06);border:1px solid rgba(217,59,54,.25);border-radius:var(--r3);padding:14px 16px}

/* phase block */
.se-phase{border:1px solid var(--line);border-radius:var(--r);margin-bottom:14px;background:linear-gradient(180deg,var(--panel2),var(--panel));overflow:hidden}
.se-phase-h{display:flex;align-items:center;gap:10px;padding:12px 14px;border-bottom:1px solid var(--line);background:var(--panel)}
.se-areas{padding:8px 14px 12px}

/* area (group) block */
.se-area{border:1px solid var(--line);border-radius:var(--r2);margin:10px 0;background:var(--panel)}
.se-area-h{display:flex;align-items:center;gap:10px;padding:9px 11px;border-bottom:1px solid var(--line);background:var(--panel2)}
.se-items{padding:7px 11px 10px;display:flex;flex-direction:column;gap:6px}

/* item row */
.se-item{display:flex;align-items:center;gap:8px;padding:5px 7px;border:1px solid var(--line);border-radius:var(--r3);background:var(--panel2)}

/* the editable name inputs */
.se-name{flex:1;min-width:0;background:transparent;border:1px solid transparent;border-radius:6px;padding:7px 9px;font-weight:500;transition:border-color .14s,background .14s}
.se-name:hover{border-color:var(--line)}
.se-name:focus{background:var(--panel);border-color:var(--gold-deep);box-shadow:0 0 0 3px rgba(248,163,30,.12)}
.se-name-phase{font-family:var(--disp);font-size:19px;letter-spacing:.6px;color:var(--text);font-weight:400}
.se-name-area{font-size:12px;letter-spacing:.6px;text-transform:uppercase;color:var(--muted);font-weight:700}
.se-name-item{font-size:13.5px;color:var(--text)}

/* reorder arrows */
.se-reorder{display:flex;flex-direction:column;gap:2px;flex-shrink:0}
.se-reorder button{width:24px;height:17px;border:1px solid var(--line);border-radius:5px;color:var(--muted);font-size:9px;line-height:1;display:grid;place-items:center;transition:all .12s}
.se-reorder button:hover:not(:disabled){color:var(--gold-soft);border-color:var(--gold-deep);background:var(--panel2)}
.se-reorder button:disabled{opacity:.32;cursor:default}
.se-reorder-sm button{width:22px;height:15px}

/* row action buttons */
.se-row-actions{display:flex;gap:6px;flex-shrink:0;margin-left:auto}
.se-mini{font-size:11px;font-weight:700;color:var(--gold-soft);border:1px solid var(--line2);background:var(--panel);padding:6px 10px;border-radius:var(--r3);white-space:nowrap;transition:all .13s}
.se-mini:hover{border-color:var(--gold-deep);background:var(--panel2)}
.se-mini-danger{color:var(--muted)}
.se-mini-danger:hover{color:var(--danger);border-color:var(--danger);background:rgba(217,59,54,.06)}
.se-item-archive{margin-left:auto;flex-shrink:0}

.se-badge{font-size:9px;font-weight:800;letter-spacing:.6px;text-transform:uppercase;color:var(--warn);background:rgba(222,122,34,.12);border:1px solid rgba(222,122,34,.32);padding:2px 7px;border-radius:20px;flex-shrink:0}
.se-phase.is-archived,.se-area.is-archived,.se-item.is-archived{opacity:.64}

/* footer */
.se-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 22px;border-top:1px solid var(--line);background:var(--panel2)}
.se-add-phase{font-size:12px;font-weight:700;color:var(--gold-soft);border:1px dashed var(--line2);padding:9px 15px;border-radius:var(--r3);transition:all .14s}
.se-add-phase:hover{border-color:var(--gold-deep);border-style:solid;background:var(--panel)}
.se-done{background:var(--gold);color:#fff;font-weight:700;font-size:13px;padding:10px 22px;border-radius:var(--r3);transition:filter .15s}
.se-done:hover{filter:brightness(1.08)}

/* ===== Mobile drawer hamburger ===== */
.menu-btn{
  position:fixed;top:12px;left:12px;z-index:65;
  background:var(--panel);border:1px solid var(--line2);
  color:var(--text);font-weight:700;font-size:12px;
  padding:9px 13px;border-radius:30px;
  box-shadow:0 8px 22px -10px rgba(18,16,14,.45);
  align-items:center;gap:9px;
}
.menu-bars{display:inline-flex;flex-direction:column;gap:3px}
.menu-bars span{display:block;width:16px;height:2px;border-radius:2px;background:var(--gold-soft)}
.menu-btn-label{letter-spacing:.3px}
.menu-btn:active{transform:translateY(1px)}

/* ===== Mobile polish (<=980px) ===== */
@media(max-width:980px){
  /* push content clear of the fixed hamburger */
  .topbar{padding-top:58px}
  .empty-main{padding-top:80px}

  /* the off-canvas drawer gets a bit more presence + a shadow when open */
  .sidebar{box-shadow:0 0 60px -10px rgba(0,0,0,.55);max-width:86vw}

  /* bigger tap targets on the System checklist */
  .check{padding:13px 13px}
  .check .box{width:22px;height:22px}
  .check .lab{font-size:14px}
  .phase-h{padding:16px 16px}
  .phase-h .pname{font-size:18px}

  /* the structure editor goes (near) full screen and stacks cleanly */
  .se-overlay{padding:0}
  .se-modal{max-width:none;max-height:100vh;height:100vh;border-radius:0;border:none}
  .se-body{padding:14px 14px}
  .se-head,.se-toolbar,.se-foot{padding-left:16px;padding-right:16px}
  .se-phase-h,.se-area-h{flex-wrap:wrap}
  .se-row-actions{margin-left:0;width:100%;justify-content:flex-start;padding-top:2px}
  .se-name{font-size:16px} /* >=16px stops iOS zoom-on-focus */
  .se-name-area{font-size:13px}
  .se-mini{padding:9px 13px} /* fat-finger friendly */

  /* table tabs stay scrollable; give wide data tables a clearer scroll hint */
  .tablewrap{position:relative}
}

/* On small phones, drop the hamburger word to just the icon */
@media(max-width:420px){
  .menu-btn-label{display:none}
  .menu-btn{padding:11px}
}

/* Respect reduced motion in the editor too */
@media (prefers-reduced-motion:reduce){
  .se-modal{animation:none}
}

/* =========================================================================
   Pledge Agent System Tracker — pipeline cards + mobile polish
   Shared by BOTH the production app (append to css/styles.css) and the
   single-file build. Uses existing tokens and existing class names
   (.rec-card, .rec-stat, .modal, .switch …), so it layers on cleanly.
   ========================================================================= */

/* Card list reads as intentional on desktop too, not just a mobile fallback.
   (The 920px cap that used to live here is gone — the lead views are the CRM
   now and they use the full width of the workspace.) */
.rec-card{cursor:default}
.rec-main{border-radius:var(--r3);padding:2px 4px;margin:-2px -4px;transition:background .12s}
.rec-main:hover{background:rgba(248,163,30,.04)}
.rec-stat{position:relative}
.rec-stat::after{content:"";position:absolute;inset:-7px;border-radius:50%} /* bigger hit area */

/* ===== Phones: <=560px ===== */
@media(max-width:560px){

  /* Card becomes a comfortable two-row layout: toggle + name/meta on top,
     status + delete easy to reach. The separate "Edit" button is redundant
     because tapping the card opens the editor — so hide it on phones.        */
  .rec-card{gap:12px;padding:13px 13px;align-items:center}
  .rec-stat{width:40px;height:40px}
  .rec-stat span{width:13px;height:13px}
  .rec-name{font-size:15.5px}
  .rec-meta{font-size:12.5px;white-space:normal}      /* let meta wrap instead of truncating */
  .rec-edit{display:none}
  .rec-del{width:38px;height:38px;font-size:15px}
  .rec-tags{margin-left:auto}
  .rec-pill{font-size:11px;padding:5px 11px}

  .pc-add,.btn-row{width:100%;justify-content:center;padding:13px 16px;font-size:13.5px}

  /* ===== Record editor becomes a bottom sheet ===== */
  .modal-overlay{align-items:flex-end;padding:0}
  .modal{
    max-width:none;width:100%;
    border-radius:var(--r) var(--r) 0 0;
    max-height:92vh;display:flex;flex-direction:column;
    animation:pcSheetUp .24s cubic-bezier(.2,.7,.2,1);
  }
  .modal-h{position:sticky;top:0;z-index:3;background:var(--panel);border-radius:var(--r) var(--r) 0 0}
  .modal-h::before{ /* grab handle */
    content:"";position:absolute;top:7px;left:50%;transform:translateX(-50%);
    width:38px;height:4px;border-radius:4px;background:var(--line2);
  }
  .modal-h{padding-top:22px}
  .modal-b{overflow-y:auto;flex:1;-webkit-overflow-scrolling:touch}
  .modal-f{position:sticky;bottom:0;z-index:3;background:var(--panel);
           padding-bottom:max(16px,env(safe-area-inset-bottom))}
  .modal-grid{grid-template-columns:1fr}

  /* 16px inputs stop iOS from zooming the viewport on focus */
  .modal-b input,.modal-b select,.modal-b textarea{font-size:16px;padding:11px 12px}
  .modal-b textarea{min-height:84px}

  /* fat-finger toggles */
  .switch{padding:11px 16px 11px 11px;font-size:14px}
  .switch .kn{width:40px;height:23px}
  .switch .kn::after{width:19px;height:19px}
  .switch.on .kn::after{transform:translateX(17px)}

  .btn-add,.danger-ghost{padding:12px 20px;font-size:14px}
}

@keyframes pcSheetUp{from{transform:translateY(100%)}to{transform:none}}

@media (prefers-reduced-motion:reduce){
  .modal{animation:none}
}

/* On very small phones, stack the card so name never gets crushed */
@media(max-width:380px){
  .rec-card{flex-wrap:wrap}
  .rec-main{flex:1 1 100%;order:2}
  .rec-stat{order:1}
  .rec-tags{order:1;margin-left:auto}
  .rec-del{order:1}
}

/* =========================================================================
   Pledge Agent System Tracker — Reference Data editor extras
   Append to css/styles.css (after styles-additions.css, which provides the
   shared .se-* editor styles). Adds the product type + commission inputs.
   ========================================================================= */

.se-type{width:88px;flex-shrink:0;font-size:12px;text-align:center}
.se-comm{width:92px;flex-shrink:0;text-align:right;font-family:var(--mono);font-size:12px;padding:7px 9px}
.se-comm-head{display:flex;justify-content:space-between;font-size:9px;letter-spacing:1px;text-transform:uppercase;color:var(--muted2);padding:0 8px 4px;font-weight:700}
.se-comm-head span:last-child{width:196px;text-align:right}

@media(max-width:560px){
  .se-item{flex-wrap:wrap}
  .se-name-item{flex:1 1 100%;order:1}
  .se-type{order:2;width:46%;text-align:left}
  .se-comm{order:2;width:46%}
  .se-item .se-mini,.se-item .se-badge{order:3}
  .se-comm-head{display:none}
}

/* ===== Invite dialog ===== */
.inv-link-row{display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--muted);font-weight:600;margin-top:4px;cursor:pointer}
.inv-link-row input{width:auto}
.inv-result{margin-top:14px;padding-top:14px;border-top:1px solid var(--line)}
.inv-result label{display:block;font-size:11px;letter-spacing:.5px;text-transform:uppercase;color:var(--muted);font-weight:700;margin-bottom:6px}
.inv-link-box{display:flex;gap:8px}
.inv-link-box input{flex:1;min-width:0;font-family:var(--mono);font-size:12px}
.inv-note{font-size:12px;color:var(--muted);margin-top:8px;line-height:1.5}

/* ===== Account & Access panel ===== */
.ac-status{display:flex;align-items:center;gap:9px;font-size:14px;font-weight:600;color:var(--text);padding:4px 0 14px;border-bottom:1px solid var(--line);margin-bottom:14px}
.ac-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0}
.ac-dot.ac-active{background:var(--ok)}
.ac-dot.ac-revoked{background:var(--danger)}
.ac-dot.ac-none{background:var(--muted2)}
.ac-actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.ac-hint{flex:1 1 100%;font-size:12px;color:var(--muted);line-height:1.5;margin-top:2px}

/* ===== System % meter (crisp SVG donut) ===== */

/* ===== Team / All-Agents dashboard ===== */
.nav-dash{display:flex;align-items:center;gap:8px;margin:6px 10px 10px;padding:10px 12px;border:1px solid var(--line);border-radius:var(--r3);background:var(--panel2);color:var(--text);font-weight:700;font-size:13px;cursor:pointer;transition:all .15s}
.nav-dash .di{color:var(--gold-soft)}
.nav-dash:hover{border-color:var(--line2);background:var(--panel3)}
.nav-dash.active{background:linear-gradient(180deg,var(--panel2),var(--panel));border-color:var(--gold-deep);color:var(--gold)}
.nav-dash.active .di{color:var(--gold)}
.dash-back{font-size:11px;font-weight:700;color:var(--gold-soft);border:1px solid var(--line2);border-radius:20px;padding:4px 11px;margin-bottom:8px;align-self:flex-start;background:var(--panel);transition:all .15s}
.dash-back:hover{border-color:var(--gold-deep);color:var(--gold)}
.team-dash{padding:22px 26px 40px}
.team-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:18px}
.team-head h2{font-family:var(--disp);font-size:34px;letter-spacing:1.5px;color:var(--text);line-height:1}
.team-sub{font-size:12px;color:var(--muted);margin-top:4px}
.kpi .ksub{font-size:11px;color:var(--muted2);margin-top:3px}
.team-table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r);background:var(--panel);box-shadow:0 1px 2px rgba(18,16,14,.05),0 10px 26px -18px rgba(18,16,14,.18)}
.team-table{width:100%;border-collapse:collapse;min-width:680px}
.team-table thead th{position:sticky;top:0;background:var(--panel3);text-align:left;font-size:10px;letter-spacing:1px;text-transform:uppercase;color:var(--muted);font-weight:700;padding:11px 12px;white-space:nowrap;border-bottom:1px solid var(--line2)}
.team-table tbody td{padding:11px 12px;border-bottom:1px solid var(--line);vertical-align:middle}
.dash-row{cursor:pointer;transition:background .12s}
.dash-row:hover{background:var(--panel2)}
.dash-row:hover .da-go{color:var(--gold)}
.da-name{font-weight:700;color:var(--text);font-size:13px}
.da-sub{font-size:11px;color:var(--muted);margin-top:1px}
.da-rank{font-family:var(--disp);font-size:18px;letter-spacing:1px;color:var(--gold)}
.da-bar{height:7px;border-radius:4px;background:var(--panel3);overflow:hidden;min-width:130px}
.da-bar span{display:block;height:100%;background:linear-gradient(90deg,var(--gold-deep),var(--gold-soft));border-radius:4px;transition:width .4s}
.da-pct{font-size:11px;color:var(--muted);margin-top:4px;font-variant-numeric:tabular-nums}
.da-go{color:var(--gold-soft);font-weight:700;font-size:12px;white-space:nowrap}
.ta-c{text-align:center}.ta-r{text-align:right}
.dash-empty{text-align:center;color:var(--muted2);padding:34px 16px;font-size:13px}
@media(max-width:760px){.team-dash{padding:16px 14px 40px}.team-head h2{font-size:28px}}

/* ===== New-contact placeholder + EMD / Partners / Licensing tabs ===== */
.rec-name-empty{color:var(--muted2);font-style:italic;font-weight:500}
.et-table{width:100%;border-collapse:collapse}
.et-table th{position:sticky;top:0;background:var(--panel3);text-align:left;font-size:10px;letter-spacing:1px;text-transform:uppercase;color:var(--muted);font-weight:700;padding:10px;white-space:nowrap;border-bottom:1px solid var(--line2)}
.et-table td{padding:6px 7px;border-bottom:1px solid var(--line);vertical-align:middle}
.et-table input{width:100%;min-width:92px}
.et-muted{color:var(--muted2)}
.et-table tfoot td{border-top:2px solid var(--line2);background:var(--panel2);font-variant-numeric:tabular-nums}
.emd-prog{margin-bottom:16px}
.emd-prog-top{display:flex;justify-content:space-between;align-items:baseline;font-size:12px;color:var(--muted);margin-bottom:7px}
.emd-prog-top b{color:var(--gold);font-size:13px;font-variant-numeric:tabular-nums}

/* ===== Dreams tab — "What Are You Building" ===== */
.dr-wrap{--c-time:#F8A31E;--c-family:#C25E6A;--c-money:#2F8F6B;--c-home:#C2873C;--c-impact:#6E5AAE;--c-legacy:#1B6E8C;--c-fitness:#CB5A3C;--c-spiritual:#8C6FC0;--c-health:#5FA552;--c-relationships:#C85C8E;--c-travel:#2C9CBC;--c-business:#5E768F}
.dr-overlay{--c-time:#F8A31E;--c-family:#C25E6A;--c-money:#2F8F6B;--c-home:#C2873C;--c-impact:#6E5AAE;--c-legacy:#1B6E8C;--c-fitness:#CB5A3C;--c-spiritual:#8C6FC0;--c-health:#5FA552;--c-relationships:#C85C8E;--c-travel:#2C9CBC;--c-business:#5E768F}
.dr-hero{margin:2px 0 22px}
.dr-eyebrow{font-family:var(--mono);font-size:12px;letter-spacing:3px;text-transform:uppercase;color:var(--gold-soft);font-weight:600;display:flex;align-items:center;gap:10px}
.dr-eyebrow::before{content:"";width:26px;height:2px;background:var(--gold-soft);border-radius:2px}
.dr-hero h2{font-family:var(--disp);font-size:clamp(23px,2.4vw,28px);line-height:.96;letter-spacing:1.1px;color:var(--gold);margin-top:9px;text-wrap:balance}
.dr-sub{font-size:clamp(13px,1.3vw,14.5px);font-weight:600;color:var(--text);margin-top:9px}
.dr-bar{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:24px}
.dr-stats{display:flex;gap:13px;flex:1 1 440px;flex-wrap:wrap}
.dr-stat{flex:1 1 145px;background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:15px 17px;box-shadow:0 1px 2px rgba(18,16,14,.05),0 14px 36px -24px rgba(18,16,14,.28);position:relative;overflow:hidden}
.dr-stat::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:linear-gradient(180deg,var(--gold),var(--gold-soft))}
.dr-k{font-family:var(--mono);font-size:11px;letter-spacing:1.5px;text-transform:uppercase;color:var(--muted)}
.dr-v{font-family:var(--disp);font-size:25px;line-height:.95;letter-spacing:.8px;color:var(--gold);margin-top:6px}
.dr-v.sm{font-size:17px;letter-spacing:.4px;line-height:1.1;margin-top:8px}
.dr-vs{font-size:12px;color:var(--gold-soft);font-weight:600;margin-top:3px}
.dr-actions{display:flex;align-items:center;justify-content:flex-end}
.dr-primary{background:linear-gradient(135deg,var(--gold-soft),var(--gold-deep));color:#fff;font-weight:800;font-size:13.5px;letter-spacing:.04em;padding:13px 20px;border-radius:999px;display:inline-flex;align-items:center;gap:9px;border:none;cursor:pointer;box-shadow:0 10px 22px -10px rgba(248,163,30,.7);transition:transform .12s,box-shadow .15s;white-space:nowrap}
.dr-primary:hover{transform:translateY(-1px);box-shadow:0 14px 28px -10px rgba(248,163,30,.8)}
.dr-primary svg{width:19px;height:19px}
.dr-grid{display:grid;gap:18px;grid-template-columns:repeat(auto-fill,minmax(330px,1fr))}
.dr-card{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);box-shadow:0 1px 2px rgba(18,16,14,.05),0 16px 40px -24px rgba(18,16,14,.28);overflow:hidden;display:flex;flex-direction:column;transition:transform .14s,box-shadow .15s;position:relative}
.dr-card:hover{transform:translateY(-3px);box-shadow:0 1px 2px rgba(18,16,14,.05),0 26px 50px -26px rgba(18,16,14,.4)}
.dr-accent{height:5px;background:var(--cc,var(--gold-soft))}
.dr-body{padding:20px 20px 16px;display:flex;flex-direction:column;gap:13px;flex:1;background:linear-gradient(180deg,color-mix(in srgb,var(--cc) 6%,#fff),#fff 52%)}
.dr-top{display:flex;align-items:center;justify-content:space-between;gap:10px}
.dr-cat{display:inline-flex;align-items:center;gap:9px}
.dr-cat .dr-chip{width:38px;height:38px;border-radius:11px;display:grid;place-items:center;background:color-mix(in srgb,var(--cc) 14%,#fff);color:var(--cc);flex-shrink:0}
.dr-cat .dr-chip svg{width:21px;height:21px}
.dr-lab{font-family:var(--mono);font-size:11px;letter-spacing:1.5px;text-transform:uppercase;color:var(--cc);font-weight:600}
.dr-pill{font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;padding:5px 11px;border-radius:999px;white-space:nowrap}
.dr-pill.s-not{background:var(--panel3);color:var(--muted)}
.dr-pill.s-prog{background:rgba(248,163,30,.12);color:var(--gold-soft)}
.dr-pill.s-done{background:rgba(47,143,107,.15);color:var(--c-money)}
.dr-title{font-family:var(--disp);font-size:19px;line-height:1.02;letter-spacing:.5px;color:var(--gold)}
.dr-badge{align-self:flex-start;display:inline-flex;align-items:center;gap:7px;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--text);background:var(--panel2);border:1px solid var(--line);padding:6px 12px;border-radius:999px}
.dr-badge svg{width:14px;height:14px;color:var(--muted)}
.dr-block .dr-h{font-family:var(--mono);font-size:11px;letter-spacing:1.5px;text-transform:uppercase;color:var(--muted);margin-bottom:4px;display:flex;align-items:center;gap:7px}
.dr-block .dr-h::before{content:"";width:14px;height:2px;border-radius:2px;background:var(--cc,var(--line2));opacity:.7}
.dr-block p{font-size:13.5px;color:var(--text);line-height:1.5}
.dr-mut{color:var(--muted2)}
.dr-seg{display:flex;background:var(--panel2);border:1px solid var(--line);border-radius:10px;padding:4px;gap:4px;margin-top:2px}
.dr-seg button{flex:1;font-size:12px;font-weight:700;letter-spacing:.02em;color:var(--muted);padding:9px 5px;border-radius:7px;border:none;background:none;cursor:pointer;transition:all .14s;white-space:nowrap}
.dr-seg button.on{background:var(--panel);color:var(--gold);box-shadow:0 1px 3px rgba(18,16,14,.14)}
.dr-seg button[data-st="done"].on{color:var(--c-money)}
.dr-foot{display:flex;align-items:center;gap:4px;border-top:1px solid var(--line);padding:9px 12px}
.dr-foot button{font-size:13px;font-weight:600;color:var(--muted);padding:8px 12px;border-radius:8px;border:none;background:none;cursor:pointer;display:inline-flex;align-items:center;gap:6px;transition:all .14s}
.dr-foot button:hover{background:var(--panel2);color:var(--gold)}
.dr-foot button.del:hover{color:#C2474A;background:rgba(194,71,74,.08)}
.dr-foot button svg{width:15px;height:15px}
.dr-spacer{flex:1}
.dr-card.done .dr-title{color:var(--c-money)}
.dr-card.done .dr-accent{background:var(--c-money)}
.dr-card.done::after{content:"ACHIEVED";position:absolute;top:18px;right:-34px;transform:rotate(45deg);background:var(--c-money);color:#fff;font-family:var(--mono);font-size:10px;letter-spacing:2px;font-weight:600;padding:5px 40px;box-shadow:0 6px 16px -6px rgba(47,143,107,.6)}
.dr-empty{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);box-shadow:0 1px 2px rgba(18,16,14,.05),0 16px 40px -24px rgba(18,16,14,.28);padding:60px 28px;text-align:center;position:relative;overflow:hidden}
.dr-empty::before{content:"";position:absolute;inset:0;background:radial-gradient(600px 240px at 50% 0%,rgba(248,163,30,.08),transparent 70%)}
.dr-empty-ic{width:70px;height:70px;margin:0 auto 6px;color:var(--gold-soft);position:relative}
.dr-empty h3{font-family:var(--disp);font-size:clamp(21px,2.3vw,27px);letter-spacing:.8px;color:var(--gold);position:relative}
.dr-empty p{font-size:14px;color:var(--muted);max-width:46ch;margin:9px auto 24px;position:relative}
.dr-empty .dr-primary{position:relative}
.dr-motiv{margin-top:30px;border-radius:var(--r);padding:40px 38px;position:relative;overflow:hidden;background:linear-gradient(135deg,#151310 0%,#241f16 58%,#0c0a08 100%)}
.dr-motiv::before{content:"";position:absolute;right:-60px;top:-60px;width:300px;height:300px;border-radius:50%;background:radial-gradient(circle,rgba(248,163,30,.45),transparent 65%)}
.dr-e{font-family:var(--mono);font-size:12px;letter-spacing:3px;text-transform:uppercase;color:#F8D80A;font-weight:600;position:relative}
.dr-motiv h3{font-family:var(--disp);font-size:clamp(19px,2.2vw,24px);line-height:1.05;letter-spacing:.8px;color:#fff;margin:12px 0 20px;max-width:20ch;position:relative;text-wrap:balance}
.dr-quote{position:relative;padding-left:20px;border-left:3px solid var(--gold-soft);max-width:60ch}
.dr-dt{font-family:var(--disp);font-size:19px;letter-spacing:.4px;color:#fff;line-height:1.05}
.dr-wy{font-size:14px;color:#C5D6F5;margin-top:7px;line-height:1.5}
.dr-prompt{margin-top:24px;font-size:14px;color:#9FBCEF;font-style:italic;position:relative}
.dr-overlay{position:fixed;inset:0;background:rgba(0,0,0,.55);backdrop-filter:blur(4px);display:flex;align-items:flex-start;justify-content:center;padding:40px 18px;z-index:1200;overflow-y:auto;opacity:0;transition:opacity .15s}
.dr-overlay.show{opacity:1}
.dr-modal{background:var(--panel);border-radius:20px;width:100%;max-width:640px;box-shadow:0 40px 90px -30px rgba(0,0,0,.7);overflow:hidden}
.dr-mhead{padding:22px 26px 16px;border-bottom:1px solid var(--line);display:flex;align-items:flex-start;justify-content:space-between;gap:14px}
.dr-step{font-family:var(--mono);font-size:11px;letter-spacing:2px;text-transform:uppercase;color:var(--gold-soft);font-weight:600}
.dr-mhead h2{font-family:var(--disp);font-size:24px;letter-spacing:.6px;color:var(--gold);line-height:1;margin-top:7px}
.dr-x{width:34px;height:34px;border-radius:9px;display:grid;place-items:center;color:var(--muted);background:var(--panel2);border:none;cursor:pointer;flex-shrink:0;transition:all .14s}
.dr-x:hover{color:var(--gold);background:var(--panel3)}
.dr-x svg{width:18px;height:18px}
.dr-mbody{padding:22px 26px}
.dr-cats{display:grid;grid-template-columns:1fr 1fr;gap:13px}
.dr-tile{text-align:left;background:var(--panel2);border:1.5px solid var(--line);border-radius:14px;padding:16px;display:flex;gap:13px;align-items:flex-start;cursor:pointer;transition:all .15s}
.dr-tile:hover{border-color:var(--cc);background:#fff;transform:translateY(-2px);box-shadow:0 14px 30px -18px var(--cc)}
.dr-tile.on{border-color:var(--cc);background:color-mix(in srgb,var(--cc) 7%,#fff);box-shadow:0 0 0 3px color-mix(in srgb,var(--cc) 22%,transparent)}
.dr-tchip{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;background:color-mix(in srgb,var(--cc) 15%,#fff);color:var(--cc);flex-shrink:0}
.dr-tchip svg{width:23px;height:23px}
.dr-tx{display:flex;flex-direction:column;gap:4px;min-width:0}
.dr-nm{font-weight:800;font-size:16px;color:var(--gold);letter-spacing:.2px;line-height:1.15}
.dr-ds{font-size:13.5px;color:var(--muted);line-height:1.45}
.dr-field{margin-bottom:18px}
.dr-field label{display:block;font-weight:700;font-size:15px;color:var(--gold);margin-bottom:5px}
.dr-field .dr-help{font-size:13.5px;color:var(--muted);margin-bottom:9px}
.dr-field input,.dr-field textarea{font-size:16px;width:100%}
.dr-field textarea{min-height:104px;resize:vertical;line-height:1.5}
.dr-chips{display:flex;flex-wrap:wrap;gap:8px}
.dr-chips button{font-size:14px;font-weight:600;color:var(--text);background:var(--panel2);border:1.5px solid var(--line);border-radius:999px;padding:9px 15px;cursor:pointer;transition:all .14s}
.dr-chips button:hover{border-color:var(--line2)}
.dr-chips button.on{background:var(--gold);color:#fff;border-color:var(--gold)}
.dr-custom{display:none;margin-top:10px}
.dr-custom.show{display:block}
.dr-mfoot{padding:16px 26px 22px;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.dr-chosen{display:flex;align-items:center;gap:9px;font-size:14px;color:var(--muted)}
.dr-chosen .dr-tchip{width:30px;height:30px;border-radius:9px}
.dr-chosen .dr-tchip svg{width:17px;height:17px}
.dr-ghost{font-size:14px;font-weight:700;color:var(--muted);padding:12px 16px;border-radius:10px;border:none;background:none;cursor:pointer;transition:all .14s}
.dr-ghost:hover{color:var(--gold);background:var(--panel2)}
.dr-go{background:linear-gradient(135deg,var(--gold-soft),var(--gold-deep));color:#fff;font-weight:800;font-size:15px;padding:13px 24px;border-radius:10px;letter-spacing:.03em;border:none;cursor:pointer;transition:all .14s;display:inline-flex;align-items:center;gap:8px}
.dr-go:hover{filter:brightness(1.06)}
.dr-go:disabled{opacity:.45;cursor:not-allowed;filter:none}
.dr-confetti{position:fixed;top:-12px;width:10px;height:14px;z-index:1300;border-radius:2px;pointer-events:none}
@media(max-width:680px){
  .dr-wrap{padding:0 14px}
  .dr-grid{grid-template-columns:1fr}
  .dr-cats{grid-template-columns:1fr}
  .dr-actions{width:100%}
  .dr-primary{width:100%;justify-content:center}
  .dr-motiv{padding:30px 22px}
}
@media(prefers-reduced-motion:reduce){.dr-card,.dr-tile,.dr-primary{transition:none}}

/* ===== Ledger stage actions (Clients / Delivery) ===== */
.ledger-acts{white-space:nowrap;text-align:right}
.btn-stage{font-size:11px;font-weight:700;color:var(--gold-soft);border:1px solid var(--line2);background:var(--panel);border-radius:7px;padding:6px 10px;margin-right:6px;cursor:pointer;transition:all .14s}
.btn-stage:hover{border-color:var(--gold-deep);color:var(--gold);background:var(--panel2)}

/* ===== EMD Plan — premium redesign ===== */
.emd-hero{display:flex;gap:24px;align-items:center;flex-wrap:wrap;border-radius:var(--r);padding:28px 30px;margin-bottom:18px;position:relative;overflow:hidden;background:linear-gradient(135deg,#151310 0%,#241f16 60%,#0c0a08 100%)}
.emd-hero::before{content:"";position:absolute;right:-50px;top:-50px;width:260px;height:260px;border-radius:50%;background:radial-gradient(circle,rgba(248,163,30,.4),transparent 65%)}
.emd-hero-l{flex:1 1 320px;position:relative;min-width:0}
.emd-eyebrow{font-family:var(--mono);font-size:11px;letter-spacing:2.5px;text-transform:uppercase;color:#F8D80A;font-weight:600}
.emd-big{font-family:var(--disp);font-size:clamp(44px,7vw,66px);line-height:.9;letter-spacing:1px;color:#fff;margin:6px 0 14px}
.emd-big span{font-family:var(--sans);font-size:18px;font-weight:600;color:#9FBCEF;letter-spacing:0;margin-left:10px}
.emd-bar{height:11px;border-radius:8px;background:rgba(255,255,255,.14);overflow:hidden}
.emd-bar span{display:block;height:100%;border-radius:8px;background:linear-gradient(90deg,#F8A31E,#F8D80A);transition:width .5s}
.emd-subline{font-size:14px;color:#C5D6F5;margin-top:10px;font-weight:500}
.emd-hero-r{display:flex;gap:12px;position:relative}
.emd-kpi{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);border-radius:12px;padding:13px 18px;text-align:center;min-width:84px}
.emd-kpi .k{font-family:var(--mono);font-size:10px;letter-spacing:1.5px;text-transform:uppercase;color:#9FBCEF}
.emd-kpi .v{font-family:var(--disp);font-size:30px;letter-spacing:1px;color:#fff;line-height:1;margin-top:4px}
.emd-months{display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}
.emd-card{background:var(--panel);border:1px solid var(--line);border-radius:var(--r2);padding:16px 17px;box-shadow:0 1px 2px rgba(18,16,14,.05),0 12px 30px -22px rgba(18,16,14,.3);transition:border-color .15s,box-shadow .15s}
.emd-card.hit{border-color:#2F8F6B;box-shadow:0 0 0 3px rgba(47,143,107,.12),0 12px 30px -22px rgba(18,16,14,.3)}
.emd-card-h{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:9px}
.emd-mn{font-family:var(--mono);font-size:11px;letter-spacing:2px;text-transform:uppercase;color:var(--muted);font-weight:600}
.emd-pts{font-family:var(--disp);font-size:30px;letter-spacing:.5px;color:var(--gold);line-height:1}
.emd-pts i{font-family:var(--sans);font-size:11px;font-style:normal;color:var(--muted2);font-weight:600;margin-left:4px;letter-spacing:.5px}
.emd-card.hit .emd-pts{color:#2F8F6B}
.emd-mbar{height:7px;border-radius:5px;background:var(--panel3);overflow:hidden}
.emd-mbar span{display:block;height:100%;border-radius:5px;background:linear-gradient(90deg,var(--gold-deep),var(--gold-soft));transition:width .4s}
.emd-card.hit .emd-mbar span{background:linear-gradient(90deg,#2F8F6B,#5cc497)}
.emd-mlabel{font-size:11px;color:var(--muted);margin:6px 0 13px;font-variant-numeric:tabular-nums}
.emd-ins{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px}
.emd-in{display:flex;flex-direction:column;gap:4px}
.emd-in span{font-family:var(--mono);font-size:9.5px;letter-spacing:.8px;text-transform:uppercase;color:var(--muted2);font-weight:600}
.emd-in input{padding:8px 9px;font-size:14px;font-variant-numeric:tabular-nums;text-align:center;background:var(--panel2);border:1px solid var(--line);border-radius:7px;width:100%}
.emd-in input:focus{border-color:var(--gold-soft);outline:none}

/* ===== MD Plan (90-day) ===== */
.md-achieved{display:flex;align-items:center;gap:14px;margin-bottom:16px;padding:15px 20px;border-radius:var(--r);border:1px solid #2F8F6B;background:linear-gradient(135deg,#E9F8F0,#D7F1E2);color:#14503A;font-size:14px;box-shadow:0 0 0 3px rgba(47,143,107,.1),0 12px 30px -22px rgba(18,16,14,.3)}
.md-achieved .tro{font-size:24px;line-height:1}
.md-achieved b{font-weight:800}
.md-hero .emd-kpi{min-width:108px}
.md-hero .emd-kpi .v i{font-family:var(--sans);font-size:13px;font-style:normal;font-weight:600;color:#9FBCEF;margin-left:4px;letter-spacing:0}
.md-hero .emd-kpi .v em{font-style:normal;font-family:var(--sans);font-size:15px;font-weight:800;color:#8ADFB0;margin-right:5px;vertical-align:3px}
.md-hero .emd-kpi.md-hit{border-color:rgba(138,223,176,.55);background:rgba(47,143,107,.24)}
.md-sec{font-family:var(--mono);font-size:11px;letter-spacing:2px;text-transform:uppercase;color:var(--muted);font-weight:700;margin:22px 0 10px;display:flex;align-items:baseline;gap:9px}
.md-sec .ct{font-family:var(--sans);font-size:12px;letter-spacing:0;text-transform:none;font-weight:500;color:var(--muted2)}
.md-paths{display:grid;grid-template-columns:1fr auto 1fr;gap:12px;align-items:stretch}
.md-path{position:relative;background:var(--panel);border:1px solid var(--line);border-radius:var(--r2);padding:18px;box-shadow:0 1px 2px rgba(18,16,14,.05),0 12px 30px -22px rgba(18,16,14,.3)}
.md-path.hit{border-color:#2F8F6B;box-shadow:0 0 0 3px rgba(47,143,107,.12),0 12px 30px -22px rgba(18,16,14,.3)}
.md-path-ach{position:absolute;top:13px;right:13px;font-family:var(--mono);font-size:10px;letter-spacing:1px;text-transform:uppercase;font-weight:700;color:#14503A;background:#D7F1E2;border:1px solid #2F8F6B;border-radius:100px;padding:4px 10px}
.md-path-tag{display:inline-block;font-family:var(--mono);font-size:10px;letter-spacing:1.5px;text-transform:uppercase;font-weight:700;padding:4px 11px;border-radius:100px;background:var(--panel3);color:var(--muted);margin-bottom:11px}
.md-path-tag.rec{background:var(--gold);color:#fff}
.md-path-big{font-family:var(--disp);font-size:38px;letter-spacing:1px;line-height:1;color:var(--gold)}
.md-path-big span{font-family:var(--sans);font-size:12px;font-weight:600;color:var(--muted2);margin-left:6px;letter-spacing:.5px}
.md-path-sub{font-family:var(--mono);font-size:11px;letter-spacing:1.5px;text-transform:uppercase;color:var(--muted);font-weight:600;margin:4px 0 14px}
.md-mcircles{display:flex;align-items:center;gap:8px;margin-bottom:14px}
.md-mc{display:flex;flex-direction:column;align-items:center;gap:5px}
.md-mc-ring{width:38px;height:38px;border-radius:50%;border:2px solid var(--line2);display:grid;place-items:center;font-size:15px;font-weight:800;color:#fff;background:var(--panel2);transition:all .2s}
.md-mc.on .md-mc-ring{border-color:#2F8F6B;background:#2F8F6B;box-shadow:0 0 0 3px rgba(47,143,107,.15)}
.md-mc-l{font-family:var(--mono);font-size:9px;letter-spacing:1px;text-transform:uppercase;color:var(--muted2);font-weight:600}
.md-mc-dash{flex:0 0 16px;height:2px;background:var(--line2);margin-bottom:16px;border-radius:2px}
.md-note{font-size:12px;color:var(--muted);line-height:1.5;border-top:1px dashed var(--line);padding-top:11px;text-wrap:pretty}
.md-note b{color:var(--text);font-weight:700}
.md-or{display:grid;place-items:center}
.md-or span{width:44px;height:44px;border-radius:50%;background:var(--gold);color:#fff;display:grid;place-items:center;font-family:var(--mono);font-size:12px;font-weight:700;letter-spacing:1px;box-shadow:0 8px 20px -8px rgba(248,163,30,.5)}
.md-partners table{min-width:420px}
.md-partners .md-cc{text-align:center;width:110px}
.md-partners td input{max-width:340px}
.md-pname{font-weight:600;padding-left:8px}
.md-chips{display:flex;flex-wrap:wrap;gap:5px;margin:0 0 12px}
.md-chip{font-family:var(--mono);font-size:9.5px;letter-spacing:.6px;text-transform:uppercase;font-weight:600;color:var(--muted);background:var(--panel3);border:1px solid var(--line);border-radius:100px;padding:3px 9px;font-variant-numeric:tabular-nums}
.md-chip.ok{color:#14503A;background:#D7F1E2;border-color:#2F8F6B}
.md-months{grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}
.md-ins{grid-template-columns:1fr 1fr}
.md-ins .emd-in:last-child{grid-column:1/-1}
@media (max-width:860px){
  .md-paths{grid-template-columns:1fr}
  .md-or{padding:2px 0}
  .md-or span{width:36px;height:36px;font-size:11px}
}
.emd-ro{font-size:15px;color:var(--text);text-align:center;padding:8px 0;font-weight:700}
@media(max-width:680px){.emd-hero{padding:22px 20px}.emd-hero-r{width:100%}.emd-kpi{flex:1;min-width:0}.emd-months{grid-template-columns:1fr}}

/* ===== Pipeline conversions (Top100/Recruit/Training -> another list) ===== */
.pc-convert{margin-top:16px;padding-top:15px;border-top:1px solid var(--line)}
.pc-convert-h{font-family:var(--mono);font-size:10px;letter-spacing:1.5px;text-transform:uppercase;color:var(--muted);margin-bottom:9px}
.pc-convert-row{display:flex;flex-wrap:wrap;gap:8px}
.pc-conv{font-size:13px;font-weight:700;color:var(--gold-soft);border:1px solid var(--line2);background:var(--panel);border-radius:8px;padding:9px 14px;cursor:pointer;transition:all .14s}
.pc-conv:hover{border-color:var(--gold-deep);color:var(--gold);background:var(--panel2)}

/* Agent login: roster is hidden for agents, so the sidebar doesn't need full width */
/* Agent view uses the SAME 300px rail as admin so the KW logo never gets crowded */
@media(min-width:981px){body.role-agent .app{grid-template-columns:300px 1fr}}

/* ===== Stat strips on list/table pages ===== */
.stat-strip{margin-bottom:16px}
.kpi-sub{font-size:11px;color:var(--muted);margin-top:5px;font-weight:500}
.kpi-bar{height:6px;border-radius:4px;background:var(--panel3);overflow:hidden;margin-top:10px}
.kpi-bar span{display:block;height:100%;border-radius:4px;background:linear-gradient(90deg,var(--gold-deep),var(--gold-soft));transition:width .4s}

/* ===== Rich empty state (pipeline tabs) ===== */
.list-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:56px 24px;border:1px dashed var(--line2);border-radius:var(--r);background:linear-gradient(180deg,var(--panel),var(--panel2))}
.list-empty-ic{width:56px;height:56px;border-radius:15px;display:flex;align-items:center;justify-content:center;background:var(--panel3);color:var(--gold-soft);margin-bottom:15px;box-shadow:inset 0 0 0 1px var(--line)}
.list-empty-ic svg{width:28px;height:28px}
.list-empty-t{font-family:var(--disp);font-size:24px;letter-spacing:.6px;color:var(--gold);line-height:1}
.list-empty-s{font-size:14px;color:var(--muted);margin-top:8px;max-width:46ch;text-wrap:pretty}

/* ===== Customize editor modal ===== */
.cz-ov{position:fixed;inset:0;background:rgba(0,0,0,.5);backdrop-filter:blur(3px);z-index:80;display:flex;align-items:flex-start;justify-content:center;padding:40px 16px;overflow:auto}
.cz-modal{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);width:100%;max-width:620px;box-shadow:0 30px 80px -30px rgba(18,16,14,.5);display:flex;flex-direction:column;max-height:calc(100vh - 80px)}
.cz-h{display:flex;align-items:center;justify-content:space-between;padding:18px 22px;border-bottom:1px solid var(--line)}
.cz-h-t{font-family:var(--disp);font-size:24px;letter-spacing:.5px;color:var(--gold)}
.cz-h-s{font-size:12px;color:var(--muted);margin-top:2px}
.cz-x{border:none;background:none;font-size:16px;color:var(--muted);cursor:pointer;padding:4px 8px;border-radius:8px}
.cz-x:hover{background:var(--panel3);color:var(--text)}
.cz-b{padding:18px 22px;overflow:auto}
.cz-sec{font-family:var(--mono);font-size:11px;letter-spacing:1.5px;text-transform:uppercase;color:var(--gold-deep);font-weight:700;margin-bottom:12px}
.cz-sec span{font-family:var(--sans);text-transform:none;letter-spacing:0;color:var(--muted);font-weight:500}
.cz-sec-mt{margin-top:26px}
.cz-tabs{display:flex;flex-direction:column;gap:8px;margin-bottom:4px}
.cz-tab-row{display:flex;align-items:center;gap:12px}
.cz-in{flex:1;padding:9px 11px;border:1px solid var(--line2);border-radius:8px;background:var(--panel2);color:var(--text);font-size:14px;font-family:inherit}
.cz-in:focus{outline:none;border-color:var(--gold-soft)}
.cz-check{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--muted);white-space:nowrap;cursor:pointer;min-width:64px}
.cz-locked{font-size:12px;color:var(--muted2);font-style:italic;min-width:90px;text-align:right}
.cz-field{display:flex;flex-direction:column;gap:5px;margin-bottom:12px}
.cz-flabel{font-size:12px;font-weight:600;color:var(--muted)}
.cz-flabel i{font-weight:400;color:var(--muted2);font-style:normal}
.cz-field input{padding:9px 11px;border:1px solid var(--line2);border-radius:8px;background:var(--panel2);color:var(--text);font-size:14px;font-family:inherit}
.cz-field input:focus{outline:none;border-color:var(--gold-soft)}
.cz-grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.cz-grid3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px}
.cz-err{color:#C0392B;font-size:13px;font-weight:600;margin-top:8px}
.cz-f{display:flex;justify-content:flex-end;gap:10px;padding:16px 22px;border-top:1px solid var(--line)}
.cz-cancel{padding:10px 16px;border:1px solid var(--line2);background:var(--panel);color:var(--text);border-radius:9px;font-weight:600;font-size:14px;cursor:pointer}
.cz-save{padding:10px 18px;border:none;background:var(--gold);color:#fff;border-radius:9px;font-weight:700;font-size:14px;cursor:pointer}
.cz-save:hover{background:var(--gold-deep)}
.cz-save:disabled{opacity:.6;cursor:default}
@media(max-width:560px){.cz-grid2,.cz-grid3{grid-template-columns:1fr}.cz-tab-row{flex-wrap:wrap}}

/* ===== Dreams: achieved section ===== */
.dr-won-h{display:flex;align-items:center;gap:10px;margin:32px 0 14px;font-family:var(--disp);font-size:22px;letter-spacing:.6px;color:var(--c-money)}
.dr-trophy{width:26px;height:26px;display:inline-flex;color:var(--c-money)}
.dr-trophy svg{width:26px;height:26px}
.dr-won-c{font-family:var(--sans);font-size:12px;font-weight:700;background:rgba(47,143,107,.14);color:var(--c-money);border-radius:20px;padding:3px 10px;letter-spacing:0}
.dr-allwon{padding:18px;border:1px dashed var(--line2);border-radius:var(--r2);text-align:center;color:var(--muted);font-size:14px}

/* ===== Dreams: drag-to-reorder ===== */
.dr-sortable > *{cursor:grab}
.dr-sortable > *:active{cursor:grabbing}
.dr-sortable button,.dr-sortable input,.dr-sortable a,.dr-sortable select{cursor:pointer}
.dr-drag-ghost{opacity:.35}
.dr-drag-chosen{box-shadow:0 18px 42px -16px rgba(18,16,14,.55)}

/* ===== Quick Links (sidebar) ===== */
.ph-ql{margin-top:8px;padding:8px 12px 0;border-top:1px solid var(--line)}
.ph-ql:empty{display:none}
.ql-head{display:flex;align-items:center;justify-content:space-between;font-family:var(--mono);font-size:9.5px;letter-spacing:1.3px;text-transform:uppercase;color:var(--muted);font-weight:700;margin:0 2px 5px}
.ql-edit{border:none;background:none;color:var(--muted);cursor:pointer;font-size:13px;padding:2px 6px;border-radius:6px}
.ql-edit:hover{background:var(--panel3);color:var(--gold-soft)}
.ql-list{display:flex;flex-direction:column;gap:2px}
.ql-item{display:flex;align-items:center;gap:8px;padding:7px 10px;border-radius:9px;text-decoration:none;color:var(--text);font-size:12.5px;font-weight:600;transition:background .14s;min-width:0}
.ql-item:hover{background:var(--panel3)}
.ql-home{background:var(--panel2);border:1px solid var(--line);margin-bottom:5px;color:var(--gold)}
.ql-home:hover{border-color:var(--gold-soft);background:var(--panel3)}
.ql-home-ic{font-size:15px;line-height:1;flex:none}
.ql-dot{width:6px;height:6px;border-radius:50%;background:var(--gold-soft);flex:none}
.ql-label{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ql-ext{font-size:11px;color:var(--muted2);flex:none}
.ql-hint{font-size:10px;color:var(--muted2);font-style:italic;flex:none}
.ql-empty{color:var(--muted);cursor:default}
/* editor */
.ql-ov{position:fixed;inset:0;background:rgba(0,0,0,.5);backdrop-filter:blur(3px);z-index:85;display:flex;align-items:flex-start;justify-content:center;padding:48px 16px;overflow:auto}
.ql-modal{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);width:100%;max-width:520px;box-shadow:0 30px 80px -30px rgba(18,16,14,.5)}
.ql-mh{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--line)}
.ql-mt{font-family:var(--disp);font-size:22px;letter-spacing:.5px;color:var(--gold)}
.ql-x{border:none;background:none;font-size:15px;color:var(--muted);cursor:pointer}
.ql-mb{padding:16px 20px;display:flex;flex-direction:column;gap:10px;max-height:50vh;overflow:auto}
.ql-row{display:flex;gap:8px;align-items:center}
.ql-row input{padding:9px 10px;border:1px solid var(--line2);border-radius:8px;background:var(--panel2);color:var(--text);font-size:13px;font-family:inherit}
.ql-r-label{flex:0 0 34%;min-width:0}
.ql-r-url{flex:1;min-width:0}
.ql-row-del{flex:none;border:1px solid var(--line2);background:var(--panel);color:var(--muted);border-radius:8px;width:32px;height:32px;cursor:pointer}
.ql-row-del:hover{border-color:#C0392B;color:#C0392B}
.ql-add{margin:0 20px;padding:9px;border:1px dashed var(--line2);background:none;color:var(--gold-soft);border-radius:9px;font-weight:700;font-size:13px;cursor:pointer;width:calc(100% - 40px)}
.ql-add:hover{border-color:var(--gold-soft);background:var(--panel2)}
.ql-mf{display:flex;justify-content:flex-end;gap:10px;padding:14px 20px;border-top:1px solid var(--line);margin-top:6px}
.ql-cancel{padding:9px 15px;border:1px solid var(--line2);background:var(--panel);color:var(--text);border-radius:9px;font-weight:600;cursor:pointer}
.ql-save{padding:9px 18px;border:none;background:var(--gold);color:#fff;border-radius:9px;font-weight:700;cursor:pointer}
.ql-save:disabled{opacity:.6}

/* ===== Customize: default agent links rows ===== */
.cz-links{display:flex;flex-direction:column;gap:8px;margin-bottom:10px}
.cz-link-row{display:flex;gap:8px;align-items:center}
.cz-link-row input{padding:9px 10px;border:1px solid var(--line2);border-radius:8px;background:var(--panel2);color:var(--text);font-size:13px;font-family:inherit}
.cz-l-label{flex:0 0 34%;min-width:0}
.cz-l-url{flex:1;min-width:0}
.cz-link-del{flex:none;border:1px solid var(--line2);background:var(--panel);color:var(--muted);border-radius:8px;width:32px;height:32px;cursor:pointer}
.cz-link-del:hover{border-color:#C0392B;color:#C0392B}
.cz-link-add{margin-top:2px;padding:9px;border:1px dashed var(--line2);background:none;color:var(--gold-soft);border-radius:9px;font-weight:700;font-size:13px;cursor:pointer;width:100%}
.cz-link-add:hover{border-color:var(--gold-soft);background:var(--panel2)}

/* ============================================================
   UX OVERHAUL: compact header · collapsible sidebar · mobile
   ============================================================ */

/* ---- Compact top bar (reclaim vertical space) ---- */
.topbar{padding:9px 22px 0}
.tb-row{align-items:center;gap:14px}
.chip{font-size:10.5px;padding:3px 8px}
.tb-stats{gap:16px}
.tabs{margin-top:7px}
.tab{padding:7px 12px;font-size:12.5px}

/* ---- Sidebar collapse button (lives in the brand) ---- */
.brand{position:relative}
.sidebar-collapse-btn{
  position:absolute;top:6px;right:6px;z-index:5;
  width:22px;height:22px;border-radius:7px;cursor:pointer;
  border:1px solid rgba(248,163,30,.38);background:rgba(248,163,30,.10);
  color:#CFE2F5;font-size:13px;line-height:1;
  display:flex;align-items:center;justify-content:center;
  transition:background .15s,border-color .15s}
.sidebar-collapse-btn:hover{background:rgba(248,163,30,.24);border-color:rgba(160,205,240,.7)}
@media(max-width:980px){.sidebar-collapse-btn{display:none}}

/* ---- Desktop collapsed: slim rail with an expand button (never covers content) ---- */
@media(min-width:981px){
  body.sidebar-collapsed .app{grid-template-columns:56px 1fr}
  body.sidebar-collapsed .sidebar-main,
  body.sidebar-collapsed .sidebar-foot{display:none}
  body.sidebar-collapsed .sidebar-expand-btn{display:flex}
}
.sidebar-expand-btn{display:none;position:fixed;top:14px;left:10px;z-index:66;width:36px;height:36px;border-radius:10px;border:1px solid var(--line2);background:var(--panel);color:var(--text);font-size:16px;cursor:pointer;align-items:center;justify-content:center;box-shadow:0 6px 16px -8px rgba(18,16,14,.4)}
.sidebar-expand-btn:hover{border-color:var(--gold-deep);color:var(--gold-soft)}
@media(max-width:980px){.sidebar-expand-btn{display:none!important}}
@keyframes menuFade{from{opacity:0;transform:scale(.9)}to{opacity:1;transform:none}}

/* ---- Floating menu button: icon-only, never covers content ---- */
.menu-btn{padding:0;width:42px;height:42px;border-radius:12px;justify-content:center;gap:0}
.menu-btn .menu-btn-label{display:none!important}
.menu-bars{gap:3px}
.menu-bars span{width:18px}

/* ---- Admin sidebar tools: grouped + labelled ---- */
.side-foot-group{border-top:1px solid var(--line);padding:9px 12px 4px}
.side-foot-h{font-size:9.5px;font-weight:700;letter-spacing:1.1px;text-transform:uppercase;color:var(--muted2);margin:0 2px 7px}
.side-foot-h span{font-weight:600;letter-spacing:.4px;text-transform:none;color:var(--muted)}
.side-foot-group .side-foot{border-top:none;padding:0;gap:6px}
.side-foot-group .side-foot button{flex:1 1 calc(50% - 6px)}
.side-foot-danger{color:#C0392B!important;border-color:rgba(192,57,43,.3)!important}
.side-foot-danger:hover{border-color:#C0392B!important;background:rgba(192,57,43,.06)}

/* ---- Mobile: name clears the hamburger; tighter top ---- */
@media(max-width:980px){
  .topbar{padding:12px 16px 0 64px}
  .empty-main{padding-top:64px}
  .menu-btn{top:9px;left:10px}
}

/* ===== Ledger actions: Edit / Delete ===== */
.btn-edit{font-size:11px;font-weight:700;color:var(--gold-soft);border:1px solid var(--line2);background:var(--panel);border-radius:7px;padding:6px 12px;margin-right:6px;cursor:pointer;transition:all .14s}
.btn-edit:hover{border-color:var(--gold-deep);color:var(--gold);background:var(--panel2)}
.btn-del-soft{font-size:11px;font-weight:600;color:var(--muted);border:1px solid var(--line2);background:var(--panel);border-radius:7px;padding:6px 12px;cursor:pointer;transition:all .14s}
.btn-del-soft:hover{border-color:#C0392B;color:#C0392B;background:rgba(192,57,43,.05)}
.comm-pending{color:var(--muted);font-weight:600;cursor:help}

/* ===== Manager (team) roster ===== */
.mgr-you{font-size:9px;font-weight:800;letter-spacing:.6px;text-transform:uppercase;color:#fff;background:var(--gold-soft);border-radius:5px;padding:1px 5px;margin-left:6px;vertical-align:middle}

/* ===== Account panel: team access ===== */
.pp-team{margin-top:16px;padding-top:14px;border-top:1px solid var(--line)}
.pp-team-search{width:100%;padding:8px 10px;border:1px solid var(--line2);border-radius:8px;background:var(--panel2);color:var(--text);font-size:13px;font-family:inherit;margin:8px 0}
.pp-team-list{max-height:230px;overflow-y:auto;border:1px solid var(--line);border-radius:9px;padding:4px;margin-bottom:10px;background:var(--panel2)}
.pp-team-row{display:flex;align-items:center;gap:9px;padding:7px 9px;border-radius:7px;cursor:pointer;font-size:13px;color:var(--text)}
.pp-team-row:hover{background:var(--panel)}
.pp-team-row input{width:16px;height:16px;accent-color:var(--gold-soft);cursor:pointer}
.pp-team-ok{display:block;font-size:12.5px;font-weight:600;margin-top:8px}

/* ===== Agent editor: field hint ===== */
.pp-field-hint{font-size:11px;color:var(--muted);margin-top:4px}

/* ============================================================
   Minimal admin chrome: user chip · Settings popover · Manage menu
   ============================================================ */

/* User chip */
.user-chip{display:flex;align-items:center;gap:10px;padding:8px 14px;border-bottom:1px solid var(--line)}
.uc-avatar{flex:0 0 34px;width:34px;height:34px;border-radius:50%;background:linear-gradient(140deg,#201c15,#F8A31E);color:#fff;font-size:12px;font-weight:800;letter-spacing:.5px;display:flex;align-items:center;justify-content:center}
.uc-info{flex:1;min-width:0}
.uc-name{font-size:13.5px;font-weight:700;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.uc-role{font-size:11px;color:var(--muted);font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.uc-signout{flex:none;width:30px;height:30px;border-radius:8px;border:1px solid var(--line2);background:var(--panel);color:var(--muted);font-size:14px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .14s}
.uc-signout:hover{border-color:#C0392B;color:#C0392B}

/* Settings popover (sidebar foot) */
.side-foot-settings{position:relative;padding:10px 12px;border-top:1px solid var(--line)}
.settings-btn{width:100%;display:flex;align-items:center;gap:8px;padding:9px 12px;border:1px solid var(--line2);background:var(--panel);border-radius:10px;color:var(--text);font-size:13px;font-weight:600;cursor:pointer;transition:border-color .14s}
.settings-btn .settings-caret{margin-left:auto;color:var(--muted);font-size:11px}
.settings-btn:hover{border-color:var(--gold-deep)}
.settings-menu{display:none;position:absolute;left:12px;right:12px;bottom:56px;background:var(--panel);border:1px solid var(--line2);border-radius:12px;box-shadow:0 18px 44px -16px rgba(18,16,14,.5);padding:6px;z-index:40}
.settings-menu.open{display:block}
.settings-menu button{display:block;width:100%;text-align:left;padding:9px 11px;border:none;background:none;color:var(--text);font-size:13px;border-radius:8px;cursor:pointer}
.settings-menu button:hover{background:var(--panel2);color:var(--gold-soft)}

/* Topbar Manage menu (per-agent actions) */
.tb-manage{position:relative;display:flex;align-items:center}
.tb-manage-btn{padding:7px 12px;border:1px solid var(--line2);background:var(--panel);border-radius:9px;color:var(--text);font-size:12.5px;font-weight:600;cursor:pointer;display:inline-flex;align-items:center;gap:6px;transition:border-color .14s}
.tb-manage-btn .caret{color:var(--muted);font-size:11px}
.tb-manage-btn:hover{border-color:var(--gold-deep)}
.tb-manage-menu{display:none;position:absolute;right:0;top:calc(100% + 8px);min-width:188px;background:var(--panel);border:1px solid var(--line2);border-radius:12px;box-shadow:0 18px 44px -16px rgba(18,16,14,.5);padding:6px;z-index:40}
.tb-manage-menu.open{display:block}
.tb-manage-menu button{display:block;width:100%;text-align:left;padding:9px 11px;border:none;background:none;color:var(--text);font-size:13px;border-radius:8px;cursor:pointer}
.tb-manage-menu button:hover{background:var(--panel2);color:var(--gold-soft)}
.tb-manage-menu button.danger{color:#C0392B}
.tb-manage-menu button.danger:hover{background:rgba(192,57,43,.06);color:#C0392B}

/* Manager (team-viewer) is role-agent but DOES get the roster rail */
body.is-manager .agent-roster-ui{display:flex!important}
body.is-manager .roster-head .btn-add{display:none!important}

/* ===== Top 100 actions + import wizard ===== */
.pc-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:4px}
.pc-actions .btn-row{flex:0 0 auto}
.pc-import{color:var(--gold-soft);border-style:dashed!important}
.pc-import:hover{border-color:var(--gold-deep)!important;color:var(--gold)}

.imp-ov{position:fixed;inset:0;background:rgba(0,0,0,.55);backdrop-filter:blur(3px);z-index:120;display:flex;align-items:center;justify-content:center;padding:18px}
.imp-modal{width:min(560px,96vw);max-height:92vh;overflow:auto;background:var(--panel);border:1px solid var(--line2);border-radius:18px;box-shadow:0 30px 80px -24px rgba(0,0,0,.6)}
.imp-h{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;padding:18px 20px 12px;border-bottom:1px solid var(--line)}
.imp-h-t{font-family:var(--disp);font-size:22px;letter-spacing:.5px;color:var(--text)}
.imp-h-s{font-size:12.5px;color:var(--muted);margin-top:2px}
.imp-x{border:1px solid var(--line2);background:var(--panel);color:var(--muted);width:30px;height:30px;border-radius:8px;cursor:pointer;flex:none}
.imp-x:hover{color:var(--text)}
.imp-b{padding:16px 20px}
.imp-drop{display:flex;flex-direction:column;align-items:center;text-align:center;gap:5px;padding:28px 16px;border:1.5px dashed var(--line2);border-radius:14px;background:var(--panel2);cursor:pointer;transition:border-color .15s,background .15s}
.imp-drop:hover{border-color:var(--gold-soft);background:var(--panel)}
.imp-drop-ic{width:42px;height:42px;border-radius:50%;background:var(--gold);color:#fff;font-size:20px;display:flex;align-items:center;justify-content:center;font-weight:800}
.imp-drop-t{font-weight:700;font-size:14px;color:var(--text)}
.imp-drop-s{font-size:12px;color:var(--muted)}
.imp-note{font-size:12px;color:var(--muted);margin-top:12px;line-height:1.5}
.imp-namemode{display:flex;gap:16px;flex-wrap:wrap;margin-bottom:12px;font-size:13px;color:var(--text)}
.imp-namemode label{display:flex;align-items:center;gap:6px;cursor:pointer}
.imp-field{margin-bottom:11px}
.imp-field label{display:block;font-size:11px;font-weight:700;letter-spacing:.4px;text-transform:uppercase;color:var(--muted);margin-bottom:5px}
.imp-field select{width:100%;padding:9px 10px;border:1px solid var(--line2);border-radius:9px;background:var(--panel2);color:var(--text);font-size:13px;font-family:inherit}
.imp-req{color:#C0392B}
.imp-grid2{display:grid;grid-template-columns:1fr 1fr;gap:0 12px}
.imp-sec{font-size:11px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;color:var(--muted2);margin:14px 0 9px;padding-top:12px;border-top:1px solid var(--line)}
.imp-preview{margin-top:12px}
.imp-prev-h{font-size:13px;font-weight:700;color:var(--text);margin-bottom:6px}
.imp-prev-row{font-size:12.5px;color:var(--muted2);padding:3px 0}
.imp-err{color:#C0392B;font-size:13px;font-weight:600;margin-top:10px}
.imp-f{display:flex;justify-content:flex-end;gap:10px;padding:14px 20px;border-top:1px solid var(--line)}
.imp-btn{padding:10px 18px;border:none;background:var(--gold);color:#fff;border-radius:10px;font-weight:700;font-size:13px;cursor:pointer}
.imp-btn:disabled{opacity:.6;cursor:default}
.imp-btn-ghost{padding:10px 16px;border:1px solid var(--line2);background:var(--panel);color:var(--text);border-radius:10px;font-weight:600;font-size:13px;cursor:pointer}
@media(max-width:560px){.imp-grid2{grid-template-columns:1fr}}

/* ============================================================
   Mobile-first polish: scrollable tab strip + balanced header
   ============================================================ */
.tabs{-webkit-overflow-scrolling:touch;scrollbar-width:none;scroll-snap-type:x proximity;scroll-behavior:smooth}
.tabs::-webkit-scrollbar{display:none}
.tab{scroll-snap-align:start}

@media(max-width:980px){
  .topbar{position:sticky}
  .tb-row{gap:8px 12px}
  .tb-stats{width:100%;justify-content:flex-start;gap:22px;margin-top:2px}
  .tabs{gap:0;padding-right:30px;margin-top:6px}
  .tab{padding:11px 15px;font-size:14px}
  /* fade hint so it's obvious the tabs scroll */
  .topbar::after{content:'';position:absolute;right:0;bottom:0;height:46px;width:34px;pointer-events:none;
    background:linear-gradient(90deg,rgba(255,255,255,0),rgba(255,255,255,.92))}
}

/* ===== New-contact dialog (name + phone first, no blank rows) ===== */
.modal.modal-sm{max-width:440px;width:min(440px,94vw)}
.pc-req{color:#C0392B}
.pc-new-err{color:#C0392B;font-size:13px;font-weight:600;margin-top:6px;min-height:16px}
.pc-convert-note{font-size:11.5px;color:var(--muted);margin-top:7px}
.pc-conv:disabled{opacity:.45;cursor:not-allowed}
.pc-conv:disabled:hover{border-color:var(--line2);color:var(--gold-soft);background:var(--panel)}

/* ===== System tab cleanup ===== */
.sys-overall .pbar-wide{margin-top:2px}
.sys-checklist-bar{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;margin:22px 0 12px}
.scb-title{font-family:var(--disp);font-size:18px;letter-spacing:.4px;color:var(--text)}
.scb-title .ct{font-family:var(--sans);font-size:12px;letter-spacing:0;color:var(--muted);font-weight:400}
.scb-actions{display:flex;gap:8px;flex-wrap:wrap}
@media(max-width:560px){.sys-checklist-bar{flex-direction:column;align-items:flex-start;gap:8px}}

/* =========================================================
 *  Import wizard v2 — drag state, live preview, progress, result
 * ======================================================= */
.imp-drop.drag{border-color:var(--gold-soft);background:var(--panel);box-shadow:0 0 0 4px rgba(248,163,30,.12)}
.imp-summary{margin-top:14px;font-size:13px;font-weight:600}
.imp-sum-ok{color:var(--ok)}
.imp-sum-warn{color:var(--warn)}
.imp-sum-note{color:var(--muted);font-weight:500}
.imp-prev-tbl{width:100%;border-collapse:collapse;margin-top:8px;font-size:12.5px;border:1px solid var(--line);border-radius:10px;overflow:hidden}
.imp-prev-tbl th{text-align:left;background:var(--panel2);color:var(--muted);font-weight:700;font-size:11px;letter-spacing:.4px;text-transform:uppercase;padding:7px 10px;border-bottom:1px solid var(--line)}
.imp-prev-tbl td{padding:7px 10px;border-bottom:1px solid var(--line);color:var(--text)}
.imp-prev-tbl tr:last-child td{border-bottom:none}
.imp-prev-x{color:var(--muted2)}
.imp-prog{display:flex;flex-direction:column;align-items:center;gap:16px;padding:22px 8px 10px}
.imp-prog-ring{--pct:0;width:96px;height:96px;border-radius:50%;background:conic-gradient(var(--gold-soft) calc(var(--pct)*1%),var(--panel3) 0);display:flex;align-items:center;justify-content:center;transition:background .3s ease}
.imp-prog-ring span{width:74px;height:74px;border-radius:50%;background:var(--panel);display:flex;align-items:center;justify-content:center;font-weight:800;font-size:18px;color:var(--gold-deep);font-family:var(--disp);letter-spacing:1px}
.imp-prog-bar{width:100%;height:8px;border-radius:6px;background:var(--panel3);overflow:hidden}
.imp-prog-bar i{display:block;height:100%;width:0;border-radius:6px;background:linear-gradient(90deg,var(--gold-deep),var(--gold-soft));transition:width .3s ease}
.imp-prog-t{font-size:13px;color:var(--muted);font-weight:600}
.imp-result{display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px;padding:20px 10px 8px}
.imp-result-ic{width:60px;height:60px;border-radius:50%;display:flex;align-items:center;justify-content:center;margin-bottom:6px}
.imp-result-ic svg{width:30px;height:30px}
.imp-result-ic.ok{background:var(--ok-dim);color:var(--ok)}
.imp-result-ic.bad{background:rgba(217,59,54,.12);color:var(--danger)}
.imp-result-n{font-family:var(--disp);font-size:46px;line-height:1;color:var(--gold);letter-spacing:1px}
.imp-result-l{font-size:14px;font-weight:700;color:var(--text)}
.imp-result-note{font-size:12.5px;color:var(--muted);max-width:360px;line-height:1.5;margin-top:4px}

/* =========================================================
 *  Bulk select / delete on pipeline card lists
 * ======================================================= */
.btn-row.danger{color:var(--danger);border-color:rgba(217,59,54,.4)}
.btn-row.danger:hover:not(:disabled){background:rgba(217,59,54,.08);border-color:var(--danger);filter:none}
.btn-row:disabled{opacity:.5;cursor:default}
.pc-selbar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;background:var(--panel2);border:1px solid var(--line);border-radius:var(--r2);padding:10px 14px;margin-bottom:12px;position:sticky;top:8px;z-index:5}
.pc-selbar-l{font-size:13px;color:var(--muted)}
.pc-selbar-l b{font-family:var(--disp);font-size:18px;color:var(--gold);letter-spacing:.5px;margin-right:2px}
.pc-selbar-r{display:flex;gap:8px;flex-wrap:wrap}
.rec-list.select-mode .rec-card{cursor:pointer}
.rec-card.sel-card{gap:12px}
.rec-card.sel-card .sel-box{width:24px;height:24px;flex-shrink:0;border-radius:7px;border:2px solid var(--line2);display:flex;align-items:center;justify-content:center;transition:all .14s;background:var(--panel)}
.rec-card.sel-card .sel-box svg{width:14px;height:14px;stroke:#fff;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round;opacity:0;transform:scale(.6);transition:all .14s}
.rec-card.sel-card.sel{border-color:var(--gold-soft);background:linear-gradient(180deg,rgba(248,163,30,.08),var(--panel))}
.rec-card.sel-card.sel .sel-box{background:var(--gold-soft);border-color:var(--gold-soft)}
.rec-card.sel-card.sel .sel-box svg{opacity:1;transform:scale(1)}

/* =========================================================
 *  General Availability calendar (Overview)
 * ======================================================= */
.ov-avail-wrap{margin-top:16px}
.av-panel .panel-h{align-items:center}
.av-sub{font-size:12.5px;color:var(--muted);line-height:1.55;margin:2px 0 14px}
.av-sub b{color:var(--text)}
.av-saved{font-size:12px;font-weight:700;color:var(--ok);opacity:0;transition:opacity .2s}
.av-saved.show{opacity:1}
.av-presets{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:14px}
.av-presets-l{font-size:12px;font-weight:600;color:var(--muted)}
.av-preset{padding:7px 13px;border-radius:20px;border:1px solid var(--line2);background:var(--panel2);color:var(--gold-soft);font-weight:700;font-size:12px;cursor:pointer;transition:all .14s;font-family:var(--sans)}
.av-preset:hover{border-color:var(--gold-soft);background:var(--panel);filter:brightness(1.02)}
.av-grid{display:flex;flex-direction:column;gap:2px}
.av-row{display:grid;grid-template-columns:150px 1fr auto;gap:14px;align-items:start;padding:11px 10px;border-radius:var(--r2);transition:background .12s}
.av-row+.av-row{border-top:1px solid var(--line)}
.av-row.on{background:linear-gradient(180deg,rgba(248,163,30,.045),transparent)}
.av-day{display:flex;align-items:center;gap:10px;font-size:14px;font-weight:600;color:var(--text);padding-top:5px}
.av-toggle{width:40px;height:23px;border-radius:20px;background:var(--panel3);border:1px solid var(--line2);position:relative;cursor:pointer;flex-shrink:0;transition:background .15s,border-color .15s;padding:0}
.av-toggle .kn{position:absolute;top:1px;left:1px;width:19px;height:19px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.3);transition:transform .18s}
.av-toggle.on{background:var(--gold-soft);border-color:var(--gold-soft)}
.av-toggle.on .kn{transform:translateX(17px)}
.av-times{display:flex;flex-wrap:wrap;gap:8px;align-items:center;min-height:36px}
.av-range{display:inline-flex;align-items:center;gap:7px;background:var(--panel2);border:1px solid var(--line2);border-radius:10px;padding:5px 6px 5px 9px}
.av-range.av-warn{border-color:var(--warn);background:rgba(222,122,34,.06)}
.av-range input[type=time]{border:1px solid var(--line2);border-radius:7px;padding:6px 8px;font-size:13px;font-family:var(--sans);color:var(--text);background:#fff}
.av-range input[type=time]:focus{outline:none;border-color:var(--gold-soft);box-shadow:0 0 0 3px rgba(248,163,30,.14)}
.av-dash{font-size:12px;color:var(--muted);font-weight:600}
.av-x{width:24px;height:24px;border-radius:6px;border:none;background:transparent;color:var(--muted2);cursor:pointer;font-size:13px;transition:all .12s}
.av-x:hover{background:rgba(217,59,54,.1);color:var(--danger)}
.av-add{border:1px dashed var(--line2);background:transparent;color:var(--gold-soft);border-radius:9px;padding:6px 12px;font-size:12.5px;font-weight:700;cursor:pointer;transition:all .14s;font-family:var(--sans)}
.av-add:hover{border-color:var(--gold-soft);background:var(--panel2)}
.av-none{font-size:12.5px;color:var(--muted2);font-style:italic;align-self:center}
.av-unavail{font-size:13px;color:var(--muted2);align-self:center;padding-top:5px}
.av-rowact{padding-top:4px}
.av-copy{border:none;background:transparent;color:var(--gold-soft);font-weight:700;font-size:12px;cursor:pointer;padding:6px 8px;border-radius:7px;transition:all .12s;white-space:nowrap}
.av-copy:hover{background:var(--panel2);text-decoration:underline}
.av-ro{font-size:13px;color:var(--text);padding-top:5px}
.av-row.off .av-ro{color:var(--muted2)}
.av-note{margin-top:12px;font-size:12px;color:var(--warn);background:rgba(222,122,34,.07);border:1px solid rgba(222,122,34,.25);border-radius:var(--r3);padding:9px 12px;line-height:1.5}
@media(max-width:640px){
  .av-row{grid-template-columns:1fr;gap:8px}
  .av-rowact{padding-top:0}
  .pc-selbar{position:static}
}

/* ---- Import mapping table (column-first, with sample values) ---- */
.imp-maptbl-wrap{border:1px solid var(--line);border-radius:12px;overflow:hidden;margin-bottom:14px}
.imp-maptbl{width:100%;border-collapse:collapse;font-size:13px}
.imp-maptbl thead th{position:sticky;top:0;background:var(--panel2);color:var(--muted);font-weight:700;font-size:11px;letter-spacing:.5px;text-transform:uppercase;text-align:left;padding:9px 12px;border-bottom:1px solid var(--line)}
.imp-maptbl tbody td{padding:11px 12px;border-bottom:1px solid var(--line);vertical-align:top}
.imp-maptbl tbody tr:last-child td{border-bottom:none}
.imp-maptbl tbody tr:hover{background:var(--cream)}
.imp-mcol{font-weight:600;color:var(--text);white-space:nowrap;max-width:180px;overflow:hidden;text-overflow:ellipsis}
.imp-msample{color:var(--muted2)}
.imp-sv{font-family:var(--mono);font-size:11.5px;color:var(--muted);line-height:1.5;white-space:nowrap;max-width:230px;overflow:hidden;text-overflow:ellipsis}
.imp-mnone{font-style:italic;color:var(--muted2);font-size:12px}
.imp-mfield{width:210px}
.imp-mfield select{width:100%;padding:8px 10px;border:1px solid var(--line2);border-radius:8px;background:#fff;color:var(--text);font-size:13px;font-family:var(--sans);cursor:pointer}
.imp-mfield select:focus{outline:none;border-color:var(--gold-soft);box-shadow:0 0 0 3px rgba(248,163,30,.14)}
@media(max-width:600px){
  .imp-maptbl thead{display:none}
  .imp-maptbl tbody td{display:block;border-bottom:none;padding:4px 12px}
  .imp-maptbl tbody tr{display:block;border-bottom:1px solid var(--line);padding:8px 0}
  .imp-mcol{max-width:none}.imp-sv{max-width:none;white-space:normal}.imp-mfield{width:auto}
}
.imp-badname{color:var(--danger)!important}
.imp-badname b{color:var(--danger)!important}
.imp-sum-warn b{color:var(--danger)}

/* ---- Contract Levels editor ---- */
.cl-tbl{width:100%;border-collapse:collapse;font-size:13px}
.cl-tbl thead th{text-align:left;font-size:11px;letter-spacing:.5px;text-transform:uppercase;color:var(--muted);font-weight:700;padding:6px 10px;border-bottom:1px solid var(--line)}
.cl-tbl tbody td{padding:7px 10px;border-bottom:1px solid var(--line);vertical-align:middle}
.cl-tbl tbody tr:last-child td{border-bottom:none}
.cl-in{width:100%;padding:8px 10px;border:1px solid var(--line2);border-radius:8px;background:#fff;color:var(--text);font-size:13px;font-family:var(--sans)}
.cl-in:focus{outline:none;border-color:var(--gold-soft);box-shadow:0 0 0 3px rgba(248,163,30,.14)}
.cl-code{font-family:var(--mono);font-weight:600;max-width:120px}
.cl-pct-cell{white-space:nowrap;width:130px}
.cl-pct{max-width:84px;display:inline-block;text-align:right}
.cl-pct-sign{margin-left:6px;color:var(--muted);font-weight:600}
.cl-x{width:1%;white-space:nowrap;text-align:right}
.cl-hint{font-size:12px;color:var(--muted);margin-top:12px;line-height:1.5;background:var(--panel2);border:1px solid var(--line);border-left:3px solid var(--gold-deep);border-radius:var(--r3);padding:10px 12px}
@media(max-width:560px){
  .cl-code{max-width:none}
  .cl-tbl thead{display:none}
  .cl-tbl tbody td{display:block;border-bottom:none;padding:4px 10px}
  .cl-tbl tbody tr{display:block;border-bottom:1px solid var(--line);padding:8px 0}
  .cl-x{text-align:left}
}

/* ---- se-modal-wrap: fixed header/footer, scrollable body (Carriers, Contract Levels) ---- */
.se-modal-wrap{display:flex;flex-direction:column;max-height:86vh}
.se-modal-wrap .modal-h,.se-modal-wrap .se-toolbar,.se-modal-wrap .modal-f{flex-shrink:0}
.se-modal-wrap .modal-b{flex:1 1 auto;overflow-y:auto;min-height:0}
@media(max-width:640px){.se-modal-wrap{max-height:100vh}}

/* ---- Customize: keep the Hide checkbox tight to its label ---- */
.cz-check input[type=checkbox]{width:16px;height:16px;padding:0;margin:0;flex:0 0 auto;accent-color:var(--gold-soft);background:#fff;cursor:pointer}

/* ---- Top 100: show where a lead was copied ---- */
.rec-card.copied{border-left:3px solid var(--gold-soft);background:linear-gradient(180deg,rgba(248,163,30,.05),var(--panel))}
.rec-copied{display:flex;align-items:center;flex-wrap:wrap;gap:6px;margin-top:6px}
.rec-copied-l{font-size:11px;font-weight:600;color:var(--muted);letter-spacing:.2px}
.rec-dchip{font-size:10.5px;font-weight:700;padding:2px 9px;border-radius:20px;letter-spacing:.3px;white-space:nowrap}
.rec-dchip.d-recruit{background:rgba(248,163,30,.15);color:var(--gold-deep)}
.rec-dchip.d-training{background:rgba(31,168,90,.15);color:var(--ok)}

/* ---- Roster availability dot (Office hours / Out of office) ---- */
.avail-badge{display:inline-flex;align-items:center;gap:5px;font-size:10.5px;font-weight:700;letter-spacing:.2px;vertical-align:middle;margin-left:4px;white-space:nowrap}
.avail-badge .avail-dot{width:7px;height:7px;border-radius:50%;flex:0 0 auto}
.avail-badge.open{color:var(--ok)}
.avail-badge.open .avail-dot{background:var(--ok);animation:availPulse 2.1s infinite}
.avail-badge.closed{color:var(--danger)}
.avail-badge.closed .avail-dot{background:var(--danger)}
@keyframes availPulse{0%{box-shadow:0 0 0 0 rgba(31,168,90,.5)}70%{box-shadow:0 0 0 5px rgba(31,168,90,0)}100%{box-shadow:0 0 0 0 rgba(31,168,90,0)}}

/* ---- Availability panel: time zone + live status ---- */
.av-tzrow{display:flex;flex-wrap:wrap;gap:14px;align-items:flex-start;justify-content:space-between;margin-bottom:14px}
.av-tz{flex:1 1 240px;min-width:200px}
.av-tz label{display:block;font-size:11px;letter-spacing:.4px;text-transform:uppercase;color:var(--muted);font-weight:700;margin-bottom:6px}
.av-tz select{width:100%;padding:9px 11px;border:1px solid var(--line2);border-radius:9px;background:#fff;color:var(--text);font-size:13px;font-family:var(--sans);cursor:pointer}
.av-tz select:focus{outline:none;border-color:var(--gold-soft);box-shadow:0 0 0 3px rgba(248,163,30,.14)}
.av-tz-hint{font-size:11.5px;color:var(--muted);margin-top:6px;line-height:1.5}
.av-live-wrap{align-self:flex-end;padding-bottom:1px}
.av-live{display:inline-flex;align-items:center;gap:7px;font-size:12px;font-weight:700;padding:7px 12px;border-radius:20px;white-space:nowrap}
.av-live-dot{width:8px;height:8px;border-radius:50%;flex:0 0 auto}
.av-live.open{color:var(--ok);background:rgba(31,168,90,.1)}
.av-live.open .av-live-dot{background:var(--ok);animation:availPulse 2.1s infinite}
.av-live.closed{color:var(--danger);background:rgba(217,59,54,.09)}
.av-live.closed .av-live-dot{background:var(--danger)}
.av-live.unknown{color:var(--muted);background:var(--panel2);font-weight:600}
@media(max-width:560px){.av-tzrow{flex-direction:column}.av-live-wrap{align-self:flex-start}}

/* availability badge — "No hours set" neutral state */
.avail-badge.noset{color:var(--muted)}
.avail-badge.noset .avail-dot{background:var(--muted2);animation:none}

/* ---- Policy status badge ---- */
.pol-status{display:inline-block;font-size:11px;font-weight:700;letter-spacing:.2px;padding:3px 9px;border-radius:20px;white-space:nowrap;line-height:1.35}
.pol-status.pend{background:rgba(248,163,30,.12);color:var(--gold-deep)}
.pol-status.mid{background:rgba(222,122,34,.14);color:var(--warn)}
.pol-status.ok{background:rgba(31,168,90,.14);color:var(--ok)}
.pol-status.bad{background:rgba(217,59,54,.12);color:var(--danger)}
.pol-status.muted{background:var(--panel3);color:var(--muted)}

/* Sidebar links editor note */
.ql-note{font-size:12.5px;color:var(--muted);line-height:1.55;padding:14px 20px 4px}

/* ---- Sidebar Links editor: per-link scope + account picker ---- */
.sl-modal{max-width:560px}
.sl-modal .ql-mb{gap:14px;max-height:60vh}
.sl-row{border:1px solid var(--line);border-radius:var(--r2);padding:12px;background:var(--panel2)}
.sl-row-top{display:flex;gap:8px;align-items:center}
.sl-r-label{flex:0 0 34%;min-width:0;padding:9px 10px;border:1px solid var(--line2);border-radius:8px;background:var(--panel);color:var(--text);font-size:13px;font-family:inherit}
.sl-r-url{flex:1;min-width:0;padding:9px 10px;border:1px solid var(--line2);border-radius:8px;background:var(--panel);color:var(--text);font-size:13px;font-family:inherit}
.sl-row-del{flex:none;border:1px solid var(--line2);background:var(--panel);color:var(--muted);border-radius:8px;width:32px;height:32px;cursor:pointer;transition:all .14s}
.sl-row-del:hover{border-color:#C0392B;color:#C0392B}
.sl-scope-lbl{font-size:11px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;color:var(--muted2);margin-top:12px}
.sl-opts{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin-top:8px}
.sl-opt{position:relative;display:flex;align-items:center;gap:11px;padding:11px 13px;border:1.5px solid var(--line2);border-radius:11px;background:var(--panel);cursor:pointer;transition:border-color .15s,background .15s,box-shadow .15s;overflow:hidden}
.sl-opt input{position:absolute;opacity:0;pointer-events:none}
.sl-opt-ic{flex:none;width:32px;height:32px;border-radius:9px;display:grid;place-items:center;background:var(--panel3);color:var(--muted);transition:background .15s,color .15s}
.sl-opt-ic svg{width:17px;height:17px}
.sl-opt-txt{display:flex;flex-direction:column;line-height:1.25;min-width:0}
.sl-opt-txt b{font-size:13px;font-weight:700;color:var(--text);white-space:nowrap}
.sl-opt-txt i{font-style:normal;font-size:11px;color:var(--muted2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sl-opt-chk{position:absolute;top:9px;right:9px;color:var(--gold-soft);opacity:0;transform:scale(.6);transition:opacity .15s,transform .15s}
.sl-opt-chk svg{width:15px;height:15px}
.sl-opt:hover{border-color:var(--gold-dim);background:var(--panel2)}
.sl-opt.is-on,.sl-opt:has(input:checked){border-color:var(--gold-soft);background:rgba(248,163,30,.07);box-shadow:0 0 0 3px rgba(248,163,30,.1)}
.sl-opt.is-on .sl-opt-ic,.sl-opt:has(input:checked) .sl-opt-ic{background:var(--gold-soft);color:#fff}
.sl-opt.is-on .sl-opt-chk,.sl-opt:has(input:checked) .sl-opt-chk{opacity:1;transform:scale(1)}
@media(max-width:520px){.sl-opts{grid-template-columns:1fr}}
.sl-agents{margin-top:11px;border-top:1px dashed var(--line2);padding-top:11px}
.sl-agents[hidden]{display:none}
.sl-agents-tools{display:flex;align-items:center;gap:8px;margin-bottom:8px;flex-wrap:wrap}
.sl-agent-search{flex:1;min-width:120px;padding:7px 10px;border:1px solid var(--line2);border-radius:8px;background:var(--panel);color:var(--text);font-size:12.5px;font-family:inherit}
.sl-mini{flex:none;font-size:11px;font-weight:700;color:var(--gold-soft);border:1px solid var(--line2);background:var(--panel);border-radius:7px;padding:6px 10px;cursor:pointer;transition:all .14s}
.sl-mini:hover{border-color:var(--gold-deep);color:var(--gold)}
.sl-agents-count{flex:none;font-size:11px;font-weight:600;color:var(--muted2);font-variant-numeric:tabular-nums}
.sl-agent-list{max-height:190px;overflow-y:auto;border:1px solid var(--line);border-radius:8px;background:var(--panel);padding:4px}
.sl-agent{display:flex;align-items:center;gap:9px;padding:7px 9px;border-radius:6px;cursor:pointer;font-size:13px;color:var(--text);transition:background .12s}
.sl-agent:hover{background:var(--panel2)}
.sl-agent input{accent-color:var(--gold-soft);width:16px;height:16px;flex:none;margin:0;cursor:pointer}
.sl-agents-empty{padding:14px;text-align:center;font-size:12.5px;color:var(--muted2)}

/* ===== Availability panel v2 — colorful gradient hero ===== */
.av-panel-v2{padding:0;overflow:hidden}
.av-hero{position:relative;overflow:hidden;display:flex;flex-wrap:wrap;gap:18px;align-items:center;justify-content:space-between;padding:22px 26px;background:linear-gradient(135deg,#151310 0%,#241f16 60%,#0c0a08 100%)}
.av-hero::before{content:"";position:absolute;right:-40px;top:-70px;width:240px;height:240px;border-radius:50%;background:radial-gradient(circle,rgba(248,163,30,.45),transparent 65%);pointer-events:none}
.av-hero::after{content:"";position:absolute;left:-30px;bottom:-80px;width:200px;height:200px;border-radius:50%;background:radial-gradient(circle,rgba(248,163,30,.18),transparent 68%);pointer-events:none}
.av-hero-l{position:relative;min-width:0}
.av-hero-r{position:relative;display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.av-eyebrow{font-family:var(--mono);font-size:10.5px;letter-spacing:2.5px;text-transform:uppercase;color:#F8D80A;font-weight:600}
.av-hero-t{font-family:var(--disp);font-size:30px;letter-spacing:.6px;color:#fff;line-height:1;margin:6px 0 14px}
.av-week{display:flex;gap:7px;flex-wrap:wrap}
.av-wd{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;font-size:13px;font-weight:800;font-family:var(--sans);color:#C7C3BA;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);transition:transform .15s,background .15s,color .15s,box-shadow .15s}
.av-wd.on{color:#fff;background:linear-gradient(135deg,#F8A31E,#C9820F);border-color:transparent;box-shadow:0 6px 16px -6px rgba(248,163,30,.85)}
.av-livebig{display:inline-flex;align-items:center;gap:11px;padding:10px 16px 10px 13px;border-radius:14px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.06)}
.av-livebig-dot{width:11px;height:11px;border-radius:50%;flex:0 0 auto}
.av-livebig-t{font-size:14px;font-weight:800;line-height:1.15;color:#fff}
.av-livebig-s{font-size:11px;color:#C7C3BA;margin-top:2px}
.av-livebig.open{background:linear-gradient(135deg,rgba(31,168,90,.30),rgba(31,168,90,.12));border-color:rgba(70,210,140,.55)}
.av-livebig.open .av-livebig-dot{background:#4BE39B;animation:availPulse 2.1s infinite}
.av-livebig.closed{background:linear-gradient(135deg,rgba(224,110,90,.28),rgba(224,110,90,.1));border-color:rgba(240,140,120,.5)}
.av-livebig.closed .av-livebig-dot{background:#F0866B}
.av-livebig.noset .av-livebig-dot{background:#C7C3BA}
.av-livebig.noset .av-livebig-t{color:#D6E1F5}
.av-panel-v2 .av-saved{color:#8CE6B4}
.av-body{padding:18px 22px 20px}
.av-body .av-sub{margin-top:0}
.av-tz-full{width:100%;margin-bottom:14px}
.av-panel-v2 .av-row{border-radius:12px;transition:background .15s,box-shadow .15s}
.av-panel-v2 .av-row.on{background:linear-gradient(90deg,rgba(248,163,30,.14),rgba(248,163,30,.03) 55%,transparent);box-shadow:inset 3px 0 0 var(--gold-soft)}
.av-panel-v2 .av-preset:hover{background:var(--gold-soft);color:#fff;border-color:var(--gold-soft)}
@media(max-width:560px){.av-hero{padding:18px}.av-hero-r{width:100%}.av-livebig{flex:1}.av-hero-t{font-size:26px}.av-wd{width:26px;height:26px;font-size:12px}}

/* Admin/staff sidebar: put All Agents + roster on top (where Dashboard was); resources below */
.role-admin .sidebar-main > .agent-roster-ui,
.role-super-admin .sidebar-main > .agent-roster-ui{order:2}
.role-admin .sidebar-main > #ph-quick-links,
.role-super-admin .sidebar-main > #ph-quick-links{order:3;flex:0 0 auto;border-top:1px solid var(--line);margin-top:8px;padding-top:10px}

/* Belt-and-suspenders: staff never see the redundant Dashboard link (All Agents covers it) */
.role-admin #ph-quick-links .ql-home,
.role-super-admin #ph-quick-links .ql-home{display:none}

/* ===== Single-line minimal top bar (tabs only · identity lives in sidebar) ===== */
.topbar{padding:0 16px}
.tb-row{display:flex;align-items:center;gap:10px;flex-wrap:nowrap;min-height:47px}
.dash-back{margin:0;padding:5px 11px;font-size:14px;line-height:1;flex:0 0 auto;align-self:center}
.tabs{flex:1 1 auto;min-width:0;margin:0;align-self:stretch;align-items:stretch;gap:0}
.tab{padding:0 13px;font-size:12.5px;display:inline-flex;align-items:center}
.tb-stats{display:flex;align-items:center;gap:10px;flex:0 0 auto;width:auto;margin:0}
.tb-manage-btn{padding:6px 11px;font-size:11.5px}

@media(max-width:980px){
  .topbar{padding:12px 14px 0 64px}
  .tb-row{flex-wrap:wrap;gap:4px 10px;min-height:0}
  .tabs{order:9;flex-basis:100%;margin-top:4px;align-self:auto}
  .tab{padding:11px 14px;font-size:13.5px}
  .tb-stats{margin-left:auto;width:auto;justify-content:flex-end;margin-top:0}
}

/* =========================================================================
   Pledge — premium sidebar link finish
   Fixed member resources render as black & gold cards with a crown mark;
   the earned "Recruiting Agents" link appears only once Phase 2's ten
   field trainings are complete (see js/quick-links.js).
   ========================================================================= */
.ql-head{font-size:9.5px;letter-spacing:2.2px;color:var(--muted2);margin:0 4px 11px}
.ql-head span{position:relative;padding-right:12px}
.ql-item{transition:background .16s,border-color .16s,transform .14s,box-shadow .2s}

/* Home / dashboard pill */
.ql-home{border-radius:11px;font-weight:700}

/* Fixed PropHog member resources — navy & white, on theme */
.ql-item.ql-fixed{
  position:relative;margin-bottom:4px;padding:7px 11px;border-radius:10px;font-size:12.5px;
  background:
    radial-gradient(120% 150% at 8% -30%,rgba(248,163,30,.24),transparent 55%),
    linear-gradient(150deg,#201c15 0%,#1a140a 55%,#0c0a08 100%);
  border:1px solid rgba(248,163,30,.38);
  color:#FFFFFF;font-weight:700;letter-spacing:.2px;
  box-shadow:0 10px 22px -14px rgba(0,0,0,.8);
}
.ql-item.ql-fixed:hover{
  border-color:rgba(248,163,30,.8);
  box-shadow:0 14px 28px -14px rgba(0,0,0,.9),0 0 18px -6px rgba(248,163,30,.5);
  background:
    radial-gradient(120% 150% at 8% -30%,rgba(248,163,30,.34),transparent 55%),
    linear-gradient(150deg,#241f16 0%,#201c15 55%,#12100c 100%);
}
.ql-item.ql-fixed .ql-crown{
  width:13px;height:13px;flex:none;color:#F8D80A;
  filter:drop-shadow(0 1px 4px rgba(248,163,30,.6));
}
.ql-item.ql-fixed .ql-ext{color:rgba(248,163,30,.9)}
.ql-item.ql-fixed .ql-label{color:#FFFFFF}

/* Company + personal links — refined spacing & hover */
.ql-item.ql-company,.ql-list .ql-item{
  border:1px solid transparent;border-radius:10px;padding:6px 10px;margin-bottom:1px;
}
.ql-item.ql-company:hover,.ql-list .ql-item:hover{
  background:var(--panel);border-color:var(--line2);
  box-shadow:0 8px 18px -14px rgba(18,16,14,.45);transform:translateY(-1px);
}
.ql-dot{box-shadow:0 0 6px rgba(248,163,30,.35)}

/* =========================================================================
   Pledge — agent stage pills, overview hero, family & dreams cards,
   and the v2 Edit Agent / Add License modal system (ae2-*)
   ========================================================================= */

/* ── stage pills (auto-advance with the checklist) ── */
.stage-pill{display:inline-flex;align-items:center;gap:5px;font-size:10px;font-weight:800;
  letter-spacing:.8px;text-transform:uppercase;padding:3px 9px;border-radius:20px;
  background:var(--panel3);color:var(--muted);border:1px solid var(--line2);white-space:nowrap;vertical-align:middle}
.stage-pill::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;opacity:.75}
.stage-pill.st-onboarding{background:#FCEDDD;color:#8F4A08;border-color:#E3A25E}
.stage-pill[class*="st-phase"]{background:#FBEEDD;color:#B4801A;border-color:#E8B45A}
.stage-pill.st-complete{background:#E2F5EA;color:#0C6635;border-color:#66C493}
.agent-item-meta .stage-pill{font-size:9px;padding:2px 7px;margin-left:2px}

/* ── overview hero ── */
.ov-hero{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;
  background:
    radial-gradient(120% 160% at 6% -40%,rgba(201,161,78,.14),transparent 55%),
    linear-gradient(180deg,var(--panel2),var(--panel));
  border-color:var(--line2)}
.ov-hero-l{display:flex;align-items:center;gap:16px;min-width:0}
.ov-avatar{flex:none;width:58px;height:58px;border-radius:50%;display:grid;place-items:center;
  font-family:var(--disp);font-size:24px;letter-spacing:1px;color:#F6F1E4;
  background:linear-gradient(150deg,#1A2030,#0A0E18);border:2px solid rgba(201,161,78,.55);
  box-shadow:0 10px 22px -12px rgba(10,14,24,.7)}
.ov-hero-tx{min-width:0}
.ov-name{font-family:var(--disp);font-size:27px;letter-spacing:1px;color:var(--text);
  display:flex;align-items:center;gap:12px;flex-wrap:wrap;line-height:1.05}
.ov-facts{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:7px}
.ov-fact{font-size:12.5px;color:var(--body,#3D4454);color:var(--muted);font-weight:500}
.ov-fact b{color:var(--text)}
.ov-fact-dot{color:var(--muted2)}
.ov-hero-r{display:flex;align-items:center;gap:12px;flex:none}
.ov-ring{--p:0;width:62px;height:62px;border-radius:50%;display:grid;place-items:center;flex:none;
  background:conic-gradient(var(--gold) calc(var(--p)*1%),var(--panel3) 0)}
.ov-ring::before{content:"";position:absolute;width:48px;height:48px;border-radius:50%;background:var(--panel)}
.ov-ring{position:relative}
.ov-ring-v{position:relative;font-family:var(--mono);font-weight:700;font-size:13px;color:var(--gold)}
.ov-ring-l{font-size:10px;letter-spacing:1px;text-transform:uppercase;color:var(--muted);line-height:1.5}

/* ── family card ── */
.ov-fam-row{display:flex;gap:14px;align-items:baseline;padding:9px 0;border-bottom:1px solid var(--line)}
.ov-fam-row:last-child{border-bottom:none}
.ov-fam-k{flex:0 0 110px;font-size:10px;letter-spacing:1px;text-transform:uppercase;color:var(--muted)}
.ov-fam-v{font-size:14px;color:var(--text);font-weight:500}
.ov-kids{display:flex;gap:7px;flex-wrap:wrap}
.ov-kid{display:inline-flex;align-items:center;gap:7px;padding:5px 11px;border-radius:20px;
  background:var(--panel2);border:1px solid var(--line2);font-size:12.5px;font-weight:600;color:var(--text)}
.ov-kid i{font-style:normal;font-family:var(--mono);font-size:11px;color:var(--gold-soft);
  background:rgba(248,163,30,.08);padding:1px 6px;border-radius:10px}
.ov-family-empty{font-size:13px;color:var(--muted);padding:8px 0 4px;line-height:1.6}

/* ── dreams summary ── */
.ov-dream{display:flex;gap:12px;align-items:flex-start;padding:9px 0;border-bottom:1px solid var(--line)}
.ov-dream:last-of-type{border-bottom:none}
.ov-dream-tf{flex:0 0 64px;text-align:center;font-family:var(--mono);font-size:10.5px;font-weight:600;
  color:var(--gold-soft);background:rgba(248,163,30,.07);border:1px solid rgba(248,163,30,.25);
  border-radius:8px;padding:4px 6px;margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ov-dream-tf-empty{color:var(--muted2);border-color:var(--line)}
.ov-dream-t{font-size:13.5px;font-weight:600;color:var(--text);line-height:1.4}
.ov-dream-why{font-size:12px;color:var(--muted);margin-top:2px;line-height:1.5}
.ov-dream-more{font-size:12px;color:var(--gold-soft);font-weight:600;padding-top:9px}

/* ── ae2 modal system (Edit Agent · Add License) ── */
.ae2-ov{position:fixed;inset:0;z-index:220;background:rgba(10,16,32,.55);backdrop-filter:blur(4px);
  display:flex;align-items:flex-start;justify-content:center;padding:38px 16px;overflow-y:auto}
.ae2{width:100%;max-width:760px;margin:auto;background:var(--panel);border:1px solid var(--line2);
  border-radius:18px;box-shadow:0 48px 110px -34px rgba(0,0,0,.65);overflow:hidden;
  animation:ae2In .2s cubic-bezier(.2,.7,.2,1)}
.ae2-narrow{max-width:560px}
@keyframes ae2In{from{opacity:0;transform:translateY(14px) scale(.985)}to{opacity:1;transform:none}}
.ae2-h{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;
  padding:20px 26px 16px;border-bottom:1px solid var(--line);position:relative;
  background:linear-gradient(180deg,var(--panel2),var(--panel))}
.ae2-h::after{content:"";position:absolute;left:0;right:0;top:0;height:3px;
  background:linear-gradient(90deg,#C9A14E,#FFE39C 50%,#C9A14E)}
.ae2-t{font-family:var(--disp);font-size:26px;letter-spacing:1.5px;color:var(--text);line-height:1}
.ae2-s{font-size:13px;color:var(--muted);margin-top:5px}
.ae2-x{width:34px;height:34px;border-radius:9px;border:1px solid var(--line);color:var(--muted);
  flex:none;transition:all .14s;font-size:13px}
.ae2-x:hover{color:var(--text);border-color:var(--line2);background:var(--panel2)}
.ae2-b{padding:6px 26px 10px;max-height:min(62vh,640px);overflow-y:auto}
.ae2-sect{padding:18px 0 6px;border-bottom:1px solid var(--line)}
.ae2-sect:last-child{border-bottom:none}
.ae2-sect-h{display:flex;align-items:center;gap:10px;font-size:11px;font-weight:800;
  letter-spacing:2px;text-transform:uppercase;color:var(--gold-soft);margin-bottom:14px}
.ae2-n{width:22px;height:22px;border-radius:50%;border:1.5px solid rgba(248,163,30,.45);
  display:grid;place-items:center;font-family:var(--mono);font-size:11px;color:var(--gold-soft);
  background:rgba(248,163,30,.05)}
.ae2-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px 18px}
.ae2-f{display:flex;flex-direction:column;gap:6px}
.ae2-f label{font-size:10.5px;letter-spacing:1.1px;text-transform:uppercase;color:var(--muted);font-weight:700}
.ae2-f label i{color:var(--danger);font-style:normal}
.ae2-f input,.ae2-f select{padding:11px 12px;border:1.5px solid var(--line2);border-radius:10px;
  background:var(--panel2);color:var(--text);font-size:14px;font-family:inherit;
  transition:border-color .15s,box-shadow .15s}
.ae2-f input:focus,.ae2-f select:focus{outline:none;border-color:var(--gold-deep);
  box-shadow:0 0 0 3px rgba(248,163,30,.12)}
.ae2-hint{font-size:11.5px;color:var(--muted2);line-height:1.5}
.ae2-stage{display:flex;align-items:center;gap:11px;flex-wrap:wrap;margin:14px 0 10px;
  padding:11px 14px;border:1px solid var(--line);border-radius:11px;background:var(--panel2)}
.ae2-stage-l{font-size:10.5px;letter-spacing:1.1px;text-transform:uppercase;color:var(--muted);font-weight:700}
.ae2-stage-note{font-size:11.5px;color:var(--muted2);flex:1;min-width:180px;line-height:1.5}

/* yes/no segmented question */
.ae2-q{display:flex;align-items:center;gap:16px;margin:4px 0 12px}
.ae2-q-l{font-size:14px;font-weight:600;color:var(--text)}
.ae2-seg{display:inline-flex;border:1.5px solid var(--line2);border-radius:11px;overflow:hidden;background:var(--panel2)}
.ae2-seg-b{padding:8px 22px;font-size:13px;font-weight:700;color:var(--muted);background:none;
  transition:all .15s;border-right:1.5px solid var(--line2)}
.ae2-seg-b:last-child{border-right:none}
.ae2-seg-b.on{background:var(--gold);color:#fff}
.ae2-seg-b:not(.on):hover{background:var(--panel3);color:var(--text)}

/* progressive reveal */
.ae2-reveal{margin:0 0 16px;padding:14px 16px;border:1px solid var(--line);border-radius:12px;
  background:var(--panel2);animation:ae2Reveal .22s cubic-bezier(.2,.7,.2,1)}
.ae2-reveal[hidden]{display:none}
@keyframes ae2Reveal{from{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:none}}

/* kids rows */
.ae2-kids{display:flex;flex-direction:column;gap:9px}
.ae2-kid{display:flex;gap:9px;align-items:center}
.ae2-kid input{padding:10px 12px;border:1.5px solid var(--line2);border-radius:10px;
  background:var(--panel);color:var(--text);font-size:14px;font-family:inherit}
.ae2-kid input:focus{outline:none;border-color:var(--gold-deep);box-shadow:0 0 0 3px rgba(248,163,30,.12)}
.ae2-kid-name{flex:1;min-width:0}
.ae2-kid-age{flex:0 0 84px}
.ae2-kid-x{flex:none;width:34px;height:34px;border-radius:9px;border:1px solid var(--line2);
  color:var(--muted2);background:var(--panel);transition:all .13s}
.ae2-kid-x:hover{color:var(--danger);border-color:rgba(217,59,54,.5);background:rgba(217,59,54,.06)}
.ae2-kid-add{margin-top:11px;padding:9px 14px;border:1.5px dashed var(--line2);border-radius:10px;
  background:none;color:var(--gold-soft);font-weight:700;font-size:12.5px;width:100%;transition:all .15s}
.ae2-kid-add:hover{border-color:var(--gold-soft);background:var(--panel)}

/* footer */
.ae2-f-bar{display:flex;align-items:center;gap:12px;padding:16px 26px;border-top:1px solid var(--line);
  background:var(--panel2)}
.ae2-err{flex:1;font-size:12.5px;color:var(--danger);font-weight:600;line-height:1.45}
.ae2-cancel{padding:11px 18px;border:1px solid var(--line2);background:var(--panel);color:var(--text);
  border-radius:10px;font-weight:600;font-size:13px;transition:all .14s}
.ae2-cancel:hover{border-color:var(--muted)}
.ae2-save{padding:11px 22px;border:none;background:var(--gold);color:#fff;border-radius:10px;
  font-weight:700;font-size:13px;box-shadow:0 10px 22px -10px rgba(248,163,30,.55);transition:filter .15s,transform .1s}
.ae2-save:hover{filter:brightness(1.12)}
.ae2-save:active{transform:translateY(1px)}
.ae2-save:disabled{opacity:.6}

@media(max-width:640px){
  .ae2-ov{padding:0}
  .ae2{border-radius:0;min-height:100vh;max-width:none}
  .ae2-b{max-height:none}
  .ae2-grid{grid-template-columns:1fr}
  .ov-hero-r{width:100%;justify-content:flex-start}
  .ov-name{font-size:23px}
}


/* ── link hover tooltips ──
   Rendered as ONE floating bubble attached to <body> (see quick-links.js),
   so it can never be clipped by the sidebar's scroll container. */
.kw-tipfloat{position:fixed;display:none;max-width:270px;z-index:200;pointer-events:none;
  background:
    radial-gradient(120% 150% at 8% -30%,rgba(76,159,216,.22),transparent 55%),
    linear-gradient(150deg,#201c15,#0c0a08 65%);
  color:#EAF2FC;font-size:11.5px;line-height:1.6;font-weight:500;letter-spacing:.2px;
  padding:11px 13px;border-radius:11px;border:1px solid rgba(248,163,30,.5);
  box-shadow:0 16px 34px -12px rgba(4,10,28,.9),0 0 16px -8px rgba(76,159,216,.55);
  white-space:normal;text-transform:none;animation:kwTipIn .18s ease}
@keyframes kwTipIn{from{opacity:0;transform:translateY(-3px)}to{opacity:1;transform:none}}
@media (hover:none){.kw-tipfloat{display:none!important}}

/* =========================================================================
   Pledge — Overview v2: dark hero + journey, KPI band,
   phase grid, dream board. Bigger, bolder, zero wasted space.
   ========================================================================= */
.ov2{--kwgold:#C9A14E}

/* ── hero ── */
.ov2-hero{position:relative;border-radius:18px;overflow:hidden;margin-bottom:18px;
  padding:26px 28px 22px;color:#F3EDDD;border:1px solid rgba(228,180,90,.35);
  background:
    radial-gradient(130% 170% at 10% -40%,rgba(228,180,90,.22),transparent 55%),
    radial-gradient(100% 140% at 100% 130%,rgba(120,80,15,.6),transparent 60%),
    linear-gradient(150deg,#151310 0%,#0b0a08 55%,#070605 100%);
  box-shadow:0 24px 55px -28px rgba(0,0,0,.75)}
.ov2-hero::after{content:"";position:absolute;left:0;right:0;top:0;height:3px;
  background:linear-gradient(90deg,transparent,#E4B45A 30%,#FFE39C 50%,#E4B45A 70%,transparent)}
.ov2-hero-top{display:flex;align-items:center;justify-content:space-between;gap:22px;flex-wrap:wrap}
.ov2-hero-l{display:flex;align-items:center;gap:18px;min-width:0}
.ov2-avatar{flex:none;width:68px;height:68px;border-radius:50%;display:grid;place-items:center;
  font-family:var(--disp);font-size:28px;letter-spacing:1px;color:#FFE9B0;
  background:linear-gradient(150deg,#201c15,#0b0a08);border:2px solid rgba(228,180,90,.75);
  box-shadow:0 0 0 4px rgba(228,180,90,.12),0 14px 28px -12px rgba(0,0,0,.8)}
.ov2-hero-tx{min-width:0}
.ov2-name{font-family:var(--disp);font-size:32px;letter-spacing:1.5px;color:#FBF6E9;
  display:flex;align-items:center;gap:14px;flex-wrap:wrap;line-height:1.02}
.stage-pill.ov2-stage{font-size:10.5px;padding:4px 12px;background:rgba(228,180,90,.14);
  color:#F2D48A;border-color:rgba(228,180,90,.55)}
.ov2-facts{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin-top:9px}
.ov2-fact{font-size:13.5px;color:#C9C2AE;font-weight:500;letter-spacing:.2px}
.ov2-fact-dot{color:rgba(228,180,90,.6)}
.ov2-hero-r{display:flex;align-items:center;gap:14px;flex:none}
.ov2-ring{--p:0;position:relative;width:78px;height:78px;border-radius:50%;display:grid;place-items:center;flex:none;
  background:conic-gradient(#E4B45A calc(var(--p)*1%),rgba(255,255,255,.09) 0);
  box-shadow:0 0 24px -6px rgba(228,180,90,.45)}
.ov2-ring::before{content:"";position:absolute;inset:7px;border-radius:50%;background:#12100c}
.ov2-ring-v{position:relative;font-family:var(--mono);font-weight:700;font-size:17px;color:#FFE39C}
.ov2-ring-l{font-size:10px;letter-spacing:1.6px;text-transform:uppercase;color:#9B947F;line-height:1.6;font-weight:700}
.ov2-ring-l i{font-style:normal;color:#C9A14E;font-family:var(--mono);letter-spacing:.5px}

/* journey strip */
.ov2-journey{display:flex;align-items:flex-start;margin-top:24px;padding-top:18px;
  border-top:1px solid rgba(228,180,90,.18);overflow-x:auto;scrollbar-width:none}
.ov2-journey::-webkit-scrollbar{display:none}
.ov2-jnode{display:flex;flex-direction:column;align-items:center;gap:7px;flex:none;min-width:64px}
.ov2-jdot{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font-size:12px;
  font-style:normal;font-weight:800;border:2px solid rgba(255,255,255,.18);color:#6E6A5C;
  background:rgba(255,255,255,.04);transition:all .2s}
.ov2-jlabel{font-size:9.5px;font-weight:700;letter-spacing:1px;text-transform:uppercase;
  color:#6E6A5C;white-space:nowrap}
.ov2-jnode.done .ov2-jdot{background:linear-gradient(180deg,#FFE39C,#C9932F);border-color:#E4B45A;color:#241803}
.ov2-jnode.done .ov2-jlabel{color:#B9A87A}
.ov2-jnode.cur .ov2-jdot{border-color:#FFE39C;color:#FFE39C;background:rgba(228,180,90,.14);
  box-shadow:0 0 0 5px rgba(228,180,90,.12),0 0 18px -2px rgba(246,195,97,.65);animation:ov2pulse 2.4s ease-in-out infinite}
.ov2-jnode.cur .ov2-jlabel{color:#FFE39C}
@keyframes ov2pulse{0%,100%{box-shadow:0 0 0 5px rgba(228,180,90,.12),0 0 18px -2px rgba(246,195,97,.65)}
  50%{box-shadow:0 0 0 8px rgba(228,180,90,.06),0 0 26px -2px rgba(246,195,97,.85)}}
.ov2-jline{flex:1 1 30px;min-width:16px;height:2px;margin-top:12px;background:rgba(255,255,255,.12)}
.ov2-jline.on{background:linear-gradient(90deg,#C9932F,#FFE39C)}

/* ── KPI band ── */
.ov2-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin-bottom:18px}
.ov2-kpi{position:relative;background:linear-gradient(180deg,var(--panel2),var(--panel));
  border:1px solid var(--line);border-radius:14px;padding:15px 16px 13px;overflow:hidden;
  box-shadow:0 1px 2px rgba(18,16,14,.05),0 10px 26px -18px rgba(18,16,14,.18);
  transition:transform .15s,box-shadow .2s,border-color .15s}
.ov2-kpi:hover{transform:translateY(-2px);border-color:var(--line2);
  box-shadow:0 4px 8px rgba(18,16,14,.06),0 18px 34px -18px rgba(18,16,14,.3)}
.ov2-kpi::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;
  background:linear-gradient(180deg,#E4B45A,#9C7628)}
.ov2-kpi-v{font-family:var(--disp);font-size:30px;letter-spacing:1px;line-height:1;color:var(--gold)}
.ov2-kpi-k{font-size:10.5px;font-weight:800;letter-spacing:1.2px;text-transform:uppercase;color:var(--text);margin-top:7px}
.ov2-kpi-s{font-size:11px;color:var(--muted2);margin-top:2px}

/* ── panels sized up ── */
.ov2 .panel-h h3{font-size:16.5px}
.ov2-panel{border-radius:16px}
.ov2 .field label{font-size:10.5px}
.ov2 .field > div{font-size:14px}
.ov2-row > div > .panel:last-child{margin-bottom:18px}

/* ── phase grid ── */
.ov2-phases{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px}
.ov2-phase{position:relative;border:1px solid var(--line);border-radius:13px;padding:13px 14px 12px;
  background:var(--panel2);transition:border-color .15s,box-shadow .2s}
.ov2-phase:hover{border-color:var(--line2);box-shadow:0 10px 22px -16px rgba(18,16,14,.35)}
.ov2-phase-top{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:18px}
.ov2-phase-n{font-size:10.5px;font-weight:800;letter-spacing:1px;text-transform:uppercase;color:var(--muted);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ov2-phase-badge{flex:none;width:18px;height:18px;border-radius:50%;display:grid;place-items:center;
  background:var(--ok);color:#fff;font-size:10px;font-weight:900}
.ov2-phase-live{flex:none;font-size:8.5px;font-weight:800;letter-spacing:.8px;text-transform:uppercase;
  color:#B37B14;background:rgba(228,180,90,.18);border:1px solid rgba(201,161,78,.5);
  padding:2px 7px;border-radius:20px;animation:ov2live 2.4s ease-in-out infinite}
@keyframes ov2live{0%,100%{opacity:1}50%{opacity:.55}}
.ov2-phase-pct{font-family:var(--disp);font-size:27px;letter-spacing:1px;color:var(--text);margin-top:8px;line-height:1}
.ov2-phase-pct i{font-style:normal;font-size:15px;color:var(--muted2)}
.ov2-phase-bar{height:6px;border-radius:6px;background:var(--panel3);overflow:hidden;margin-top:9px}
.ov2-phase-bar span{display:block;height:100%;border-radius:6px;
  background:linear-gradient(90deg,var(--gold-deep),var(--gold-soft));transition:width .5s}
.ov2-phase-ct{font-size:11px;color:var(--muted2);margin-top:7px}
.ov2-phase.done{background:rgba(31,168,90,.06);border-color:rgba(31,168,90,.4)}
.ov2-phase.done .ov2-phase-pct{color:#127A40}
.ov2-phase.done .ov2-phase-bar span{background:linear-gradient(90deg,#37946A,#1FA85A)}
.ov2-phase.cur{border-color:rgba(201,161,78,.65);background:linear-gradient(180deg,rgba(228,180,90,.09),var(--panel2));
  box-shadow:0 0 0 3px rgba(228,180,90,.10),0 12px 26px -16px rgba(150,110,35,.4)}
.ov2-phase.cur .ov2-phase-pct{color:#8A6420}
.ov2-phase.cur .ov2-phase-bar span{background:linear-gradient(90deg,#C9932F,#FFD87E)}

/* ── dream board ── */
.ov2-dreamboard{position:relative;overflow:hidden;color:#F0EADB;border-color:rgba(228,180,90,.4);
  background:
    radial-gradient(130% 160% at 8% -40%,rgba(228,180,90,.2),transparent 55%),
    linear-gradient(150deg,#161B28 0%,#0b0a08 60%,#080A10 100%)}
.ov2-dreamboard .panel-h h3{color:#FBF3DD;display:flex;align-items:center;gap:9px}
.ov2-db-star{color:#E4B45A;font-size:15px;filter:drop-shadow(0 0 6px rgba(228,180,90,.7))}
.ov2-db-sub{font-size:11px;letter-spacing:2px;text-transform:uppercase;color:#8E8672;
  font-weight:700;margin:-6px 0 12px}
.ov2-db-btn{border-color:rgba(228,180,90,.45);color:#E9C36B}
.ov2-db-btn:hover{border-color:#FFE39C;color:#FFE39C;background:rgba(228,180,90,.08)}
.ov2-dream{display:flex;gap:13px;align-items:flex-start;padding:11px 0;
  border-bottom:1px solid rgba(228,180,90,.14)}
.ov2-dream:last-of-type{border-bottom:none}
.ov2-dream-n{flex:none;font-family:'Cormorant Garamond',serif;font-size:24px;font-weight:600;line-height:1;
  color:rgba(228,180,90,.9);width:22px;text-align:center;margin-top:1px}
.ov2-dream-tx{flex:1;min-width:0}
.ov2-dream-t{font-size:14.5px;font-weight:600;color:#F6F0E0;line-height:1.45}
.ov2-dream-why{font-size:12.5px;color:#A39B85;margin-top:3px;line-height:1.55;font-style:italic}
.ov2-dream-tf{flex:none;font-family:var(--mono);font-size:10.5px;font-weight:600;color:#F2D48A;
  background:rgba(228,180,90,.12);border:1px solid rgba(228,180,90,.4);border-radius:8px;
  padding:4px 9px;margin-top:2px;white-space:nowrap}
.ov2-dream-more{font-size:12px;color:#C9A14E;font-weight:700;padding-top:11px}

/* ── empty states ── */
.ov2-empty{text-align:center;padding:22px 14px 16px}
.ov2-empty-ic{font-size:26px;color:var(--gold-soft);opacity:.85;margin-bottom:8px}
.ov2-empty-t{font-size:14.5px;font-weight:700;color:var(--text)}
.ov2-empty-s{font-size:12.5px;color:var(--muted);margin-top:5px;line-height:1.6;max-width:340px;margin-left:auto;margin-right:auto}
.ov2-empty-dark .ov2-empty-ic{color:#E4B45A;filter:drop-shadow(0 0 8px rgba(228,180,90,.6))}
.ov2-empty-dark .ov2-empty-t{color:#F6F0E0}
.ov2-empty-dark .ov2-empty-s{color:#A39B85}

@media(max-width:720px){
  .ov2-hero{padding:20px 18px 16px}
  .ov2-name{font-size:25px}
  .ov2-avatar{width:56px;height:56px;font-size:23px}
  .ov2-hero-r{width:100%;justify-content:flex-start}
  .ov2-kpis{grid-template-columns:repeat(2,1fr)}
  .ov2-jlabel{max-width:70px;overflow:hidden;text-overflow:ellipsis}
}

/* ── delete-agent confirm modal + danger button ── */
.ae2-danger{padding:10px 14px;border:1px solid rgba(217,59,54,.35);background:none;color:#C0392B;
  border-radius:10px;font-weight:700;font-size:12.5px;transition:all .15s;margin-right:auto}
.ae2-danger:hover{background:rgba(217,59,54,.08);border-color:#C0392B}
.kwdel-h::after{background:linear-gradient(90deg,#E07A63,#D93B36 50%,#E07A63)}
.kwdel-warn{display:flex;gap:13px;align-items:flex-start;margin-top:14px;padding:14px 16px;
  border:1px solid rgba(217,59,54,.35);border-radius:12px;background:rgba(217,59,54,.05)}
.kwdel-warn-ic{flex:none;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;
  background:var(--danger);color:#fff;font-weight:900;font-size:15px}
.kwdel-warn-tx{font-size:13px;color:var(--text);line-height:1.65}
.kwdel-go{background:var(--danger)}
.kwdel-go:hover{filter:brightness(1.08)}
.kwdel-go:disabled{opacity:.45;cursor:not-allowed}

/* =========================================================================
   Pledge — Team Command (admin All Agents view, td2)
   ========================================================================= */
/* hero */
.td2-hero{position:relative;border-radius:18px;overflow:hidden;margin-bottom:18px;
  padding:26px 28px 22px;color:#F3EDDD;border:1px solid rgba(228,180,90,.35);
  background:
    radial-gradient(130% 170% at 10% -40%,rgba(228,180,90,.22),transparent 55%),
    radial-gradient(100% 140% at 100% 130%,rgba(120,80,15,.6),transparent 60%),
    linear-gradient(150deg,#151310 0%,#0b0a08 55%,#070605 100%);
  box-shadow:0 24px 55px -28px rgba(0,0,0,.75)}
.td2-hero::after{content:"";position:absolute;left:0;right:0;top:0;height:3px;
  background:linear-gradient(90deg,transparent,#E4B45A 30%,#FFE39C 50%,#E4B45A 70%,transparent)}
.td2-hero-top{display:flex;align-items:center;justify-content:space-between;gap:22px;flex-wrap:wrap}
.td2-eyebrow{font-family:var(--mono);font-size:10px;letter-spacing:2.5px;text-transform:uppercase;
  color:#C9A14E;font-weight:600;margin-bottom:8px}
.td2-title{font-family:var(--disp);font-size:38px;letter-spacing:2px;color:#FBF6E9;line-height:1;margin:0}
.td2-sub{font-size:13px;color:#9B947F;margin-top:7px}
.td2-hero-r{display:flex;align-items:center;gap:18px;flex:none}
.td2-bignum{text-align:right;padding-right:18px;border-right:1px solid rgba(228,180,90,.25)}
.td2-bignum b{display:block;font-family:var(--disp);font-size:38px;letter-spacing:1px;color:#FFE39C;line-height:1}
.td2-bignum span{font-size:10px;letter-spacing:1.8px;text-transform:uppercase;color:#9B947F;font-weight:700}

/* stage pipeline distribution */
.td2-dist{margin-top:22px;padding-top:18px;border-top:1px solid rgba(228,180,90,.18)}
.td2-dist-l{font-size:10px;letter-spacing:1.8px;text-transform:uppercase;color:#8E8672;font-weight:700;margin-bottom:9px}
.td2-dist-bar{display:flex;height:14px;border-radius:8px;overflow:hidden;gap:2px;background:rgba(255,255,255,.05)}
.td2-seg{display:block;height:100%;min-width:8px;transition:filter .15s}
.td2-seg:hover{filter:brightness(1.25)}
.td2-legend{display:flex;gap:14px;flex-wrap:wrap;margin-top:10px}
.td2-leg{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:600;color:#C9C2AE;letter-spacing:.3px}
.td2-leg i{width:9px;height:9px;border-radius:3px;flex:none}
.td2-leg b{font-family:var(--mono);font-size:11px;color:#FFE39C;font-weight:600}
.td2-leg.dim{opacity:.38}

/* colorful KPI tiles */
.td2-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;margin-bottom:18px}
.td2-kpi{position:relative;border-radius:14px;padding:16px 16px 14px;overflow:hidden;
  border:1px solid var(--line);background:linear-gradient(180deg,var(--panel2),var(--panel));
  box-shadow:0 1px 2px rgba(18,16,14,.05),0 10px 26px -18px rgba(18,16,14,.18);
  transition:transform .15s,box-shadow .2s}
.td2-kpi:hover{transform:translateY(-2px);box-shadow:0 6px 12px rgba(18,16,14,.08),0 20px 36px -18px rgba(18,16,14,.32)}
.td2-kpi::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--acc,#F8A31E)}
.td2-kpi::after{content:"";position:absolute;right:-30px;top:-30px;width:90px;height:90px;border-radius:50%;
  background:var(--acc,#F8A31E);opacity:.07}
.td2-kpi-v{font-family:var(--disp);font-size:31px;letter-spacing:1px;line-height:1;color:var(--acc,#F8A31E)}
.td2-kpi-k{font-size:10.5px;font-weight:800;letter-spacing:1.2px;text-transform:uppercase;color:var(--text);margin-top:7px}
.td2-kpi-s{font-size:11px;color:var(--muted2);margin-top:2px}
.td2-kpi.t-navy{--acc:#00205A}
.td2-kpi.t-gold{--acc:#B98A2F}
.td2-kpi.t-green{--acc:#1FA85A}
.td2-kpi.t-amber{--acc:#DE7A22}
.td2-kpi.t-violet{--acc:#8A46C9}
.td2-kpi.t-blue{--acc:#F8A31E}

/* leaderboard table */
.td2-table-wrap{border:1px solid var(--line);border-radius:16px;background:var(--panel);overflow:hidden;
  box-shadow:0 1px 2px rgba(18,16,14,.05),0 14px 30px -20px rgba(18,16,14,.25)}
.td2-table{width:100%;border-collapse:collapse}
.td2-table thead th{background:linear-gradient(180deg,#151310,#0b0a08);color:#C9A14E;
  font-size:9.5px;letter-spacing:1.6px;border-bottom:1px solid rgba(228,180,90,.35);padding:13px 12px}
.td2-row{cursor:pointer;transition:background .13s}
.td2-row td{padding:13px 12px;border-bottom:1px solid var(--line);vertical-align:middle}
.td2-row:last-child td{border-bottom:none}
.td2-row:hover{background:rgba(248,163,30,.045)}
.td2-row.td2-top{background:linear-gradient(90deg,rgba(228,180,90,.10),rgba(228,180,90,.02))}
.td2-row.td2-top:hover{background:linear-gradient(90deg,rgba(228,180,90,.16),rgba(228,180,90,.04))}
.td2-rankn{width:40px;text-align:center;font-family:var(--disp);font-size:17px;color:var(--muted2)}
.td2-top .td2-rankn{color:#B98A2F}
.td2-agent{min-width:220px}
.td2-agent{display:flex;align-items:center;gap:12px}
.td2-ava{flex:none;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;
  font-family:var(--disp);font-size:16px;letter-spacing:.5px;color:#F6F1E4;
  background:linear-gradient(150deg,#201c15,#0b0a08);border:1.5px solid rgba(248,163,30,.55)}
.td2-ava.gold{border-color:rgba(228,180,90,.85);color:#FFE9B0;
  box-shadow:0 0 0 3px rgba(228,180,90,.15),0 0 14px -2px rgba(228,180,90,.5)}
.td2-nm{font-weight:700;font-size:14.5px;color:var(--text);display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.td2-crown{width:15px;height:15px;color:#C9932F;filter:drop-shadow(0 1px 3px rgba(201,147,47,.55))}
.td2-topchip{font-size:8.5px;font-weight:800;letter-spacing:1px;text-transform:uppercase;color:#8A6420;
  background:rgba(228,180,90,.2);border:1px solid rgba(201,161,78,.5);padding:2px 8px;border-radius:20px}
.td2-meta{font-size:11.5px;color:var(--muted);margin-top:2px}
.td2-prog{min-width:190px}
.td2-bar{height:9px;border-radius:6px;background:var(--panel3);overflow:hidden}
.td2-bar span{display:block;height:100%;border-radius:6px;transition:width .5s}
.td2-pct{font-size:11.5px;color:var(--muted);margin-top:5px;font-variant-numeric:tabular-nums}
.td2-pct b{color:var(--text);font-size:12.5px}
.td2-count{display:inline-grid;place-items:center;min-width:32px;height:26px;padding:0 8px;border-radius:9px;
  background:var(--panel2);border:1px solid var(--line);font-family:var(--mono);font-size:12.5px;
  font-weight:600;color:var(--gold-soft)}
.td2-open{font-size:12px;font-weight:800;color:#B98A2F;white-space:nowrap;letter-spacing:.4px;
  opacity:.75;transition:opacity .13s}
.td2-row:hover .td2-open{opacity:1}

@media(max-width:900px){
  .td2-hero{padding:20px 18px 16px}
  .td2-title{font-size:30px}
  .td2-hero-r{width:100%;justify-content:flex-start}
  .td2-kpis{grid-template-columns:repeat(2,1fr)}
  .td2-table-wrap{overflow-x:auto}
  .td2-table{min-width:760px}
}

/* =========================================================================
   LIGHT PASS — the agent Overview hero, Dream Board, and admin Team Command
   re-skinned to the blue & white scheme. (Loads after the dark definitions,
   so these win the cascade.) Gold stays only as a small accent: crowns,
   top-performer, dream star.
   ========================================================================= */

/* ── shared hero shell (agent + admin) ── */
.ov2-hero,.td2-hero{
  color:var(--text);border:1px solid var(--line2);
  background:
    radial-gradient(120% 160% at 8% -40%,rgba(248,163,30,.10),transparent 55%),
    radial-gradient(90% 140% at 100% 130%,rgba(248,163,30,.05),transparent 60%),
    linear-gradient(180deg,#FFFFFF 0%,#F2F6FC 100%);
  box-shadow:0 16px 38px -24px rgba(18,16,14,.35)}
.ov2-hero::after,.td2-hero::after{
  background:linear-gradient(90deg,transparent,#F8A31E 30%,#F8D80A 50%,#F8A31E 70%,transparent)}

/* agent hero */
.ov2-avatar{background:linear-gradient(150deg,#201c15,#0c0a08);border:2px solid rgba(248,163,30,.55);
  color:#FBF6E9;box-shadow:0 0 0 4px rgba(248,163,30,.10),0 12px 24px -12px rgba(18,16,14,.4)}
.ov2-name{color:var(--text)}
.stage-pill.ov2-stage{background:rgba(248,163,30,.07);color:var(--gold-soft);border-color:rgba(248,163,30,.45)}
.stage-pill.ov2-stage.st-onboarding{background:rgba(222,122,34,.10);color:#B35F13;border-color:rgba(222,122,34,.4)}
.stage-pill.ov2-stage.st-complete{background:rgba(31,168,90,.10);color:#127A40;border-color:rgba(31,168,90,.45)}
.ov2-fact{color:var(--muted)}
.ov2-fact-dot{color:var(--muted2)}
.ov2-ring{background:conic-gradient(var(--gold-soft) calc(var(--p)*1%),#E2E9F4 0);box-shadow:none}
.ov2-ring::before{background:#FFFFFF}
.ov2-ring-v{color:var(--gold-soft)}
.ov2-ring-l{color:var(--muted)}
.ov2-ring-l i{color:var(--gold-soft)}

/* journey strip on light */
.ov2-journey{border-top:1px solid var(--line)}
.ov2-jdot{border-color:var(--line2);color:var(--muted2);background:var(--panel2)}
.ov2-jlabel{color:var(--muted2)}
.ov2-jnode.done .ov2-jdot{background:linear-gradient(180deg,#F8A31E,#B4801A);border-color:#F8A31E;color:#fff}
.ov2-jnode.done .ov2-jlabel{color:var(--gold-soft)}
@keyframes ov2pulseBlue{
  0%,100%{box-shadow:0 0 0 5px rgba(248,163,30,.14),0 0 16px -2px rgba(248,163,30,.5)}
  50%{box-shadow:0 0 0 8px rgba(248,163,30,.07),0 0 24px -2px rgba(248,163,30,.7)}}
.ov2-jnode.cur .ov2-jdot{border-color:#F8A31E;color:#B4801A;background:rgba(248,163,30,.12);
  animation:ov2pulseBlue 2.4s ease-in-out infinite}
.ov2-jnode.cur .ov2-jlabel{color:#B4801A}
.ov2-jline{background:var(--line2)}
.ov2-jline.on{background:linear-gradient(90deg,#B4801A,#F8C21E)}

/* agent KPI tiles — blue spine, navy numerals, no decoration bubbles */
.ov2-kpi::before{background:linear-gradient(180deg,#F8A31E,#B4801A)}
.ov2-kpi-v{color:var(--gold)}

/* dream board on light */
.ov2-dreamboard{color:var(--text);border-color:var(--line2);
  background:
    radial-gradient(120% 160% at 8% -40%,rgba(248,163,30,.09),transparent 55%),
    linear-gradient(180deg,#FFFFFF,#F2F6FC)}
.ov2-dreamboard .panel-h h3{color:var(--text)}
.ov2-db-star{color:#C9932F;filter:drop-shadow(0 0 5px rgba(201,147,47,.45))}
.ov2-db-sub{color:var(--muted2)}
.ov2-db-btn{border-color:var(--line2);color:var(--gold-soft)}
.ov2-db-btn:hover{border-color:var(--gold-deep);color:var(--gold-deep);background:var(--panel2)}
.ov2-dream{border-bottom:1px solid var(--line)}
.ov2-dream-n{color:var(--gold-soft)}
.ov2-dream-t{color:var(--text)}
.ov2-dream-why{color:var(--muted)}
.ov2-dream-tf{color:var(--gold-soft);background:rgba(248,163,30,.07);border-color:rgba(248,163,30,.3)}
.ov2-dream-more{color:var(--gold-soft)}
.ov2-empty-dark .ov2-empty-ic{color:#C9932F;filter:none}
.ov2-empty-dark .ov2-empty-t{color:var(--text)}
.ov2-empty-dark .ov2-empty-s{color:var(--muted)}

/* ── admin Team Command on light ── */
.td2-eyebrow{color:var(--gold-soft)}
.td2-title{color:var(--text)}
.td2-sub{color:var(--muted)}
.td2-bignum{border-right:1px solid var(--line2)}
.td2-bignum b{color:var(--gold)}
.td2-bignum span{color:var(--muted)}
.td2-dist{border-top:1px solid var(--line)}
.td2-dist-l{color:var(--muted2)}
.td2-dist-bar{background:var(--panel3)}
.td2-leg{color:var(--muted)}
.td2-leg b{color:var(--text)}

/* KPI tiles: keep the colorful spines & numerals, drop the corner bubble */
.td2-kpi::after{display:none}

/* leaderboard header + accents on light */
.td2-table thead th{background:var(--panel3);color:var(--muted);
  border-bottom:1px solid var(--line2)}
.td2-ava{border-color:rgba(248,163,30,.55)}
.td2-open{color:var(--gold-soft)}
/* current-phase card follows the blue scheme too */
.ov2-phase.cur{border-color:rgba(248,163,30,.55);background:linear-gradient(180deg,rgba(248,163,30,.08),var(--panel2));
  box-shadow:0 0 0 3px rgba(248,163,30,.10),0 12px 26px -16px rgba(18,16,14,.35)}
.ov2-phase.cur .ov2-phase-pct{color:#B4801A}
.ov2-phase.cur .ov2-phase-bar span{background:linear-gradient(90deg,#B4801A,#F8C21E)}
.ov2-phase-live{color:#B4801A;background:rgba(248,163,30,.12);border-color:rgba(248,163,30,.45)}

/* =========================================================================
   NAVY PASS — heroes + Dream Board use the rich navy banner (same family as
   the availability panel) with bold white text. Orange is retired from the
   stage system: Onboarding is slate now.
   ========================================================================= */

/* ── shared navy hero shell ── */
.ov2-hero,.td2-hero{
  color:#FFFFFF;border:1px solid #B4801A;
  background:
    radial-gradient(120% 170% at 12% -40%,rgba(248,163,30,.30),transparent 55%),
    radial-gradient(90% 140% at 100% 135%,rgba(248,163,30,.14),transparent 62%),
    linear-gradient(135deg,#151310 0%,#241f16 60%,#0c0a08 100%);
  box-shadow:0 22px 50px -26px rgba(0,0,0,.75)}
.ov2-hero::after,.td2-hero::after{
  background:linear-gradient(90deg,transparent,#F8C21E 30%,#F8D80A 50%,#F8C21E 70%,transparent)}

/* agent hero on navy */
.ov2-avatar{background:linear-gradient(150deg,#1D4185,#0A1F4C);border:2px solid rgba(175,224,245,.75);
  color:#FFFFFF;box-shadow:0 0 0 4px rgba(248,163,30,.18),0 12px 26px -12px rgba(0,0,0,.8)}
.ov2-name{color:#FFFFFF}
.ov2-fact{color:#D8D4CC;font-weight:600}
.ov2-fact-dot{color:rgba(175,224,245,.65)}
.stage-pill.ov2-stage{
  font-size:11px;padding:5px 13px;border:none;color:#FFFFFF;font-weight:800;letter-spacing:1px;
  background:linear-gradient(135deg,#64748B,#49566A);
  box-shadow:0 6px 14px -6px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.22);text-shadow:none}
.stage-pill.ov2-stage::before{background:#FFFFFF;opacity:1;box-shadow:0 0 6px rgba(255,255,255,.75)}
.stage-pill.ov2-stage.st-onboarding{background:linear-gradient(135deg,#F2A65A,#D96F14);border:none;color:#FFFFFF}
.stage-pill.ov2-stage[class*="st-phase"]{background:linear-gradient(135deg,#F8C21E,#F8A31E);border:none;color:#FFFFFF}
.stage-pill.ov2-stage.st-complete{background:linear-gradient(135deg,#3FC178,#188F4B);border:none;color:#FFFFFF}
.ov2-ring{background:conic-gradient(#F8C21E calc(var(--p)*1%),rgba(255,255,255,.14) 0);
  box-shadow:0 0 22px -6px rgba(248,163,30,.55)}
.ov2-ring::before{background:#12100c}
.ov2-ring-v{color:#FFFFFF}
.ov2-ring-l{color:#C7C3BA}
.ov2-ring-l i{color:#F8D80A}

/* journey strip on navy */
.ov2-journey{border-top:1px solid rgba(255,255,255,.16)}
.ov2-jdot{border-color:rgba(255,255,255,.35);color:#B9C6E2;background:rgba(255,255,255,.07)}
.ov2-jlabel{color:#C7C3BA}
.ov2-jnode.done .ov2-jdot{background:linear-gradient(180deg,#F8D80A,#F8C21E 60%,#C9820F);
  border-color:#F8D80A;color:#12100c}
.ov2-jnode.done .ov2-jlabel{color:#CFE6F8}
@keyframes ov2pulseNavy{
  0%,100%{box-shadow:0 0 0 5px rgba(248,163,30,.20),0 0 18px -2px rgba(248,163,30,.7)}
  50%{box-shadow:0 0 0 9px rgba(248,163,30,.10),0 0 28px -2px rgba(248,163,30,.95)}}
.ov2-jnode.cur .ov2-jdot{border-color:#F8D80A;color:#FFFFFF;background:rgba(248,163,30,.22);
  animation:ov2pulseNavy 2.4s ease-in-out infinite}
.ov2-jnode.cur .ov2-jlabel{color:#FFFFFF;font-weight:800}
.ov2-jline{background:rgba(255,255,255,.18)}
.ov2-jline.on{background:linear-gradient(90deg,#C9820F,#F8D80A)}

/* admin hero on navy */
.td2-eyebrow{color:#F8D80A}
.td2-title{color:#FFFFFF}
.td2-sub{color:#C7C3BA}
.td2-bignum{border-right:1px solid rgba(255,255,255,.25)}
.td2-bignum b{color:#FFFFFF}
.td2-bignum span{color:#C7C3BA}
.td2-dist{border-top:1px solid rgba(255,255,255,.16)}
.td2-dist-l{color:#C7C3BA}
.td2-dist-bar{background:rgba(255,255,255,.10)}
.td2-leg{color:#D8D4CC}
.td2-leg b{color:#FFFFFF}

/* ── Dream Board joins the navy family ── */
.ov2-dreamboard{color:#F2F6FD;border-color:#B4801A;
  background:
    radial-gradient(130% 160% at 8% -40%,rgba(248,163,30,.22),transparent 55%),
    linear-gradient(135deg,#151310 0%,#143567 60%,#0c0a08 100%)}
.ov2-dreamboard .panel-h h3{color:#FFFFFF}
.ov2-db-star{color:#E4B45A;filter:drop-shadow(0 0 6px rgba(228,180,90,.6))}
.ov2-db-sub{color:#C7C3BA}
.ov2-db-btn{border-color:rgba(255,255,255,.4);color:#CFE6F8}
.ov2-db-btn:hover{border-color:#F8D80A;color:#FFFFFF;background:rgba(248,163,30,.14)}
.ov2-dream{border-bottom:1px solid rgba(255,255,255,.13)}
.ov2-dream-n{color:#F8D80A}
.ov2-dream-t{color:#FFFFFF;font-weight:700}
.ov2-dream-why{color:#B9C6E2}
.ov2-dream-tf{color:#E8F4FC;background:rgba(248,163,30,.16);border-color:rgba(127,196,228,.5)}
.ov2-dream-more{color:#F8D80A}
.ov2-empty-dark .ov2-empty-ic{color:#F8D80A;filter:drop-shadow(0 0 8px rgba(248,163,30,.6))}
.ov2-empty-dark .ov2-empty-t{color:#FFFFFF}
.ov2-empty-dark .ov2-empty-s{color:#B9C6E2}

/* ── orange retired: Onboarding stage is slate ── */
.stage-pill.st-onboarding{background:rgba(100,116,139,.12);color:#47566B;border-color:rgba(100,116,139,.5)}
.td2-kpi.t-slate{--acc:#64748B}
.td2-kpi.t-amber{--acc:#64748B}

/* =========================================================================
   Tab strip scroller — edge fades + floating chevrons, no visible scrollbar
   ========================================================================= */
.tabs-shell{position:relative;flex:1 1 auto;min-width:0;margin-top:7px;display:flex;align-items:center}
.tabs-shell .tabs{flex:1;min-width:0;margin-top:0;overflow-x:auto;scroll-behavior:smooth;
  scrollbar-width:none;-ms-overflow-style:none;user-select:none;-webkit-user-select:none;
  overscroll-behavior-x:contain;touch-action:pan-x;cursor:grab}
.tabs-shell .tabs::-webkit-scrollbar{display:none}
.tabs-shell .tabs:active{cursor:grabbing}

/* soft edge fades — only when there's hidden content that side */
.tabs-shell::before,.tabs-shell::after{content:"";position:absolute;top:0;bottom:0;width:38px;z-index:2;
  pointer-events:none;opacity:0;transition:opacity .22s}
.tabs-shell::before{left:0;background:linear-gradient(90deg,rgba(255,255,255,.96) 20%,rgba(255,255,255,0))}
.tabs-shell::after{right:0;background:linear-gradient(270deg,rgba(255,255,255,.96) 20%,rgba(255,255,255,0))}
.tabs-shell.can-l::before{opacity:1}
.tabs-shell.can-r::after{opacity:1}

/* floating chevrons */
.tabs-nav{position:absolute;top:50%;transform:translateY(-50%) scale(.85);z-index:3;
  width:28px;height:28px;border-radius:50%;display:grid;place-items:center;
  border:1px solid var(--line2);background:#FFFFFF;color:var(--gold-soft);
  font-size:16px;line-height:1;padding-bottom:2px;cursor:pointer;
  box-shadow:0 4px 14px -4px rgba(18,16,14,.35);
  opacity:0;pointer-events:none;transition:opacity .2s,transform .2s,border-color .15s,color .15s}
.tabs-nav.show{opacity:1;pointer-events:auto;transform:translateY(-50%) scale(1)}
.tabs-nav:hover{border-color:var(--gold-deep);color:var(--gold)}
.tabs-nav:active{transform:translateY(-50%) scale(.92)}
.tabs-nav-l{left:-3px}
.tabs-nav-r{right:-3px}

/* give tab buttons breathing room so the fades never cover the first/last label */
.tabs-shell .tab:first-child{margin-left:2px}
.tabs-shell .tab:last-child{margin-right:2px}
@media(max-width:980px){
  .tabs-nav{width:32px;height:32px}   /* fatter touch targets on mobile */
}


/* =========================================================================
   v13 — agent self-edit locks, pets, LICENSED badge, quick-links editor
   ========================================================================= */
/* locked (verified) fields in the profile editor */
.ae2-locked, input.ae2-locked, select.ae2-locked{
  background:var(--panel3)!important;color:var(--muted)!important;cursor:not-allowed;
  border-style:dashed!important;opacity:.85}
.ae2-lock-ico{width:11px;height:11px;vertical-align:-1px;color:var(--muted2);margin-left:4px}
.ae2-selfnote{display:flex;gap:10px;align-items:flex-start;margin:14px 0 2px;padding:11px 14px;
  border:1px solid var(--line);border-left:3px solid var(--gold-deep);border-radius:11px;
  background:var(--panel2);font-size:12.5px;color:var(--muted);line-height:1.6}
.ae2-selfnote .ae2-lock-ico{width:15px;height:15px;flex:none;margin-top:2px;color:var(--gold-soft)}
.ae2-q-hint{flex-basis:100%;font-size:11.5px;color:var(--muted2);line-height:1.55;margin-top:2px}
.ae2-q{flex-wrap:wrap}
.ae2-licensed-mini{color:#127A40;font-weight:800;letter-spacing:.5px}

/* pet rows in the editor */
.ae2-pet .ae2-pet-type{flex:0 0 110px;padding:10px 10px;border:1.5px solid var(--line2);
  border-radius:10px;background:var(--panel);color:var(--text);font-size:13.5px;font-family:inherit}
.ae2-pet .ae2-pet-type:focus{outline:none;border-color:var(--gold-deep);box-shadow:0 0 0 3px rgba(248,163,30,.12)}
.ae2-pet .ae2-pet-custom{flex:0 0 150px}
.ae2-pet .ae2-pet-custom[hidden]{display:none}
@media(max-width:640px){
  .ae2-pet{flex-wrap:wrap}
  .ae2-pet .ae2-pet-type,.ae2-pet .ae2-pet-custom{flex:1 1 40%}
  .ae2-pet .ae2-pet-name{flex:1 1 100%}
}

/* LICENSED badge (Overview · Exam Date) */
.licensed-badge{display:inline-flex;align-items:center;gap:5px;font-size:10.5px;font-weight:800;
  letter-spacing:1px;text-transform:uppercase;padding:4px 11px;border-radius:20px;
  background:rgba(31,168,90,.12);color:#127A40;border:1px solid rgba(31,168,90,.5)}

/* pet chip variant on the Family card */
.ov-kid.ov-pet i{background:rgba(31,168,90,.10);color:#127A40}

/* quick-links editor polish */
.ql-msub{font-size:11.5px;color:var(--muted);margin-top:4px;font-weight:500}
.ql-note-hero{display:flex;gap:11px;align-items:flex-start;margin:14px 20px 4px;padding:12px 14px;
  border:1px solid var(--line);border-left:3px solid var(--gold-deep);border-radius:11px;
  background:var(--panel2);font-size:12.5px;line-height:1.65}
.ql-note-hero svg{flex:none;width:17px;height:17px;color:var(--gold-soft);margin-top:2px}
.ql-note-hero b{color:var(--text)}
.ql-cols{display:flex;gap:8px;padding:12px 20px 0;font-size:9.5px;font-weight:800;
  letter-spacing:1.2px;text-transform:uppercase;color:var(--muted2)}
.ql-cols span:first-child{flex:0 0 34%}
.ql-cols span:nth-child(2){flex:1}
.ql-cols span:last-child{flex:0 0 32px}
.ql-hint-foot{font-size:11.5px;color:var(--muted2);padding:10px 20px 0;font-style:italic}
.ql-hint-foot i{font-style:normal;font-family:var(--mono);font-size:11px;color:var(--gold-soft)}

/* ── Sidebar Links editor: reorder controls ── */
.sl-row-top{display:flex;align-items:center;gap:8px}
.sl-drag{flex:none;cursor:grab;color:var(--muted2);font-size:13px;letter-spacing:-3px;
  padding:4px 2px;user-select:none;line-height:1}
.sl-drag:hover{color:var(--gold-soft)}
.sl-drag:active{cursor:grabbing}
.sl-move{flex:none;display:flex;flex-direction:column;gap:2px}
.sl-move button{width:24px;height:15px;border:1px solid var(--line2);background:var(--panel);
  color:var(--muted);border-radius:5px;font-size:9px;line-height:1;cursor:pointer;
  display:grid;place-items:center;transition:all .12s;padding:0}
.sl-move button:hover{color:var(--gold-soft);border-color:var(--gold-deep)}
.sl-ghost{opacity:.45;background:var(--panel3)!important;border-style:dashed!important}

/* ── identity gate (finish setting up your account) + in-app camera ── */
.idg-note{margin-top:14px;padding:12px 14px;border:1px solid var(--line);border-left:3px solid var(--gold-deep);
  border-radius:11px;background:var(--panel2);font-size:13px;color:var(--muted);line-height:1.65}
.idg-note b{color:var(--text)}
.idg-zone{border:2px dashed var(--line2);border-radius:14px;padding:18px;background:var(--panel2);text-align:center}
.idg-idle{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.idg-btn{display:inline-flex;align-items:center;gap:7px;padding:11px 18px;border-radius:11px;
  border:1.5px solid var(--line2);background:var(--panel);color:var(--gold-soft);
  font-family:inherit;font-size:13.5px;font-weight:700;cursor:pointer;transition:all .15s}
.idg-btn:hover{border-color:var(--gold-deep);background:var(--panel3)}
.idg-preview img{width:100%;max-height:230px;object-fit:cover;border-radius:10px;
  box-shadow:0 12px 28px -14px rgba(18,16,14,.4)}
.idg-mini{margin-top:10px;border:none;background:none;color:var(--muted);font-family:inherit;font-size:12.5px;
  cursor:pointer;text-decoration:underline;text-underline-offset:4px}
.idg-mini:hover{color:var(--gold-soft)}
.idg-later{margin-right:auto;border:none;background:none;color:var(--muted2);font-family:inherit;
  font-size:12.5px;cursor:pointer;text-decoration:underline;text-underline-offset:4px;padding:4px}
.idg-later:hover{color:var(--muted)}

/* in-app webcam modal (same look as enrollment) */
.cam-ov{position:fixed;inset:0;z-index:320;background:rgba(5,6,10,.82);backdrop-filter:blur(6px);
  display:grid;place-items:center;padding:22px}
.cam-box{width:min(720px,100%);background:#0C0D12;border:1px solid rgba(228,180,90,.4);
  border-radius:20px;overflow:hidden;box-shadow:0 50px 120px -30px rgba(0,0,0,.95)}
.cam-h{display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:15px 20px;border-bottom:1px solid rgba(228,180,90,.18)}
.cam-h span{font-size:14px;font-weight:600;color:#F0EADB;letter-spacing:.3px}
.cam-x{width:34px;height:34px;border-radius:9px;border:1px solid rgba(228,180,90,.3);
  background:none;color:#A79F8B;cursor:pointer;font-size:13px;transition:all .15s}
.cam-x:hover{color:#F0EADB;border-color:rgba(255,227,156,.6)}
.cam-stage{position:relative;background:#000;aspect-ratio:16/10;display:grid;place-items:center}
.cam-stage video{width:100%;height:100%;object-fit:cover;display:block}
.cam-guide{position:absolute;inset:0;margin:auto;width:78%;aspect-ratio:1.586;max-height:80%;
  border:2.5px dashed rgba(255,227,156,.75);border-radius:14px;pointer-events:none;
  box-shadow:0 0 0 2000px rgba(0,0,0,.28)}
.cam-f{position:relative;display:flex;align-items:center;justify-content:center;
  padding:16px 20px;gap:16px;border-top:1px solid rgba(228,180,90,.18);min-height:78px}
.cam-shot{width:58px;height:58px;border-radius:50%;border:3px solid #FFE39C;background:none;
  display:grid;place-items:center;cursor:pointer;transition:transform .1s,box-shadow .2s;
  box-shadow:0 0 22px -4px rgba(246,195,97,.65)}
.cam-shot span{width:42px;height:42px;border-radius:50%;
  background:linear-gradient(180deg,#FFE39C,#E4B45A 60%,#BC8F35)}
.cam-shot:hover{box-shadow:0 0 30px -4px rgba(246,195,97,.9)}
.cam-shot:active{transform:scale(.94)}
.cam-alt{position:absolute;left:20px;border:none;background:none;color:#A79F8B;font-family:inherit;
  font-size:12.5px;cursor:pointer;text-decoration:underline;text-underline-offset:4px;padding:4px}
.cam-alt:hover{color:#E9C36B}
.cam-hint{position:absolute;right:20px;max-width:200px;text-align:right;
  font-size:11px;color:#7E7864;line-height:1.5}
@media(max-width:620px){
  .cam-alt{position:static}
  .cam-hint{display:none}
  .cam-f{justify-content:space-between}
}

/* ============================================================
 *  MY VISION — Dreams · Goals · Daily Stats
 * ========================================================== */
.vz-nav{display:flex;gap:8px;margin:0 0 16px;flex-wrap:wrap}
.vz-nav-btn{display:inline-flex;align-items:center;gap:7px;padding:9px 18px;border-radius:999px;
  border:1px solid var(--line2);background:var(--panel);color:var(--muted);font-size:13px;font-weight:600;
  cursor:pointer;transition:all .15s}
.vz-nav-btn .vz-nav-ico{font-size:13px;opacity:.75}
.vz-nav-btn:hover{border-color:#7FB4E0;color:var(--text)}
.vz-nav-btn.active{background:linear-gradient(135deg,#151310 0%,#241f16 60%,#0c0a08 100%);
  color:#fff;border-color:transparent;box-shadow:0 8px 18px -8px rgba(16,45,110,.55)}
.vz-nav-btn.active .vz-nav-ico{opacity:1;color:#F8D80A}
.vz-loading{padding:26px;color:var(--muted);font-size:13px}
.vz-pad{padding:22px}
.vz-title-row{display:flex;align-items:center;gap:10px}
.vz-title-row .btn-add{margin-left:auto}
.vz-setup{padding:26px}
.vz-setup h3{margin:0 0 8px}
.vz-setup p{margin:0;color:var(--muted);font-size:13.5px;line-height:1.55}

/* ---- goal cards ---- */
.vz-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:14px;margin-bottom:18px}

/* goal cards ride the dream-card chassis (.dr-card); .vz-card is just the hook */
.vz-badges{display:flex;gap:8px;flex-wrap:wrap}
.vz-achieved-badge{margin-left:auto;font-size:10px;font-weight:800;letter-spacing:1px;color:#1FA85A;
  border:1px solid rgba(31,168,90,.4);background:rgba(31,168,90,.08);padding:3px 9px;border-radius:999px}
.vz-goal-what{font-size:17px;font-weight:800;color:var(--text);line-height:1.3}
.vz-goal-meta{display:flex;flex-direction:column;gap:4px}
.vz-when{font-size:12px;font-weight:700;color:#F8A31E}
.vz-why{font-size:12.5px;color:var(--muted);font-style:italic;line-height:1.45}
.vz-progress{flex:1;max-width:120px;height:5px;border-radius:99px;background:var(--line);overflow:hidden;margin-left:auto}
.vz-progress i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,#F8A31E,#1FA85A)}
.vz-progress-n{font-size:10.5px;font-weight:800;color:var(--muted)}
.vz-steps{display:flex;flex-direction:column;gap:4px}
.vz-step{display:flex;align-items:flex-start;gap:9px;font-size:13px;color:var(--text);
  padding:6px 8px;border-radius:8px;cursor:pointer;transition:background .12s}
.vz-step:hover{background:rgba(248,163,30,.05)}
.vz-step input{margin-top:2px;accent-color:#F8A31E}
.vz-step.done span{text-decoration:line-through;color:var(--muted);opacity:.75}
.vz-steps-empty{font-size:12.5px;color:var(--muted);padding:4px 8px}
.vz-step-add{display:flex;gap:8px;margin-top:2px}
.vz-step-add input{flex:1;font-size:12.5px;padding:8px 10px;border:1px solid var(--line2);border-radius:8px;background:var(--bg)}
.vz-card-tools{display:flex;gap:6px;align-items:center;border-top:1px solid var(--line);padding-top:10px;margin-top:4px}
.vz-ach-btn{color:#1FA85A}
.vz-card-tools .btn-del-soft{margin-left:auto}
.vz-empty-panel{padding:44px 26px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:8px}
.vz-empty-star{font-size:34px;color:#F8A31E}
.vz-empty-t{font-size:18px;font-weight:800}
.vz-empty-s{font-size:13px;color:var(--muted);max-width:420px;margin-bottom:8px}
.vz-ach-head{font-size:11px;font-weight:800;letter-spacing:1.4px;text-transform:uppercase;color:var(--muted2);
  margin:6px 0 10px;display:flex;align-items:center;gap:7px}
.vz-ach-head span{background:rgba(31,168,90,.12);color:#1FA85A;border-radius:999px;padding:1px 8px;font-size:10.5px}

/* ---- goal modal ---- */
.vz-modal{max-width:560px}
.vz-pick-list{max-height:220px;overflow:auto;border:1px solid var(--line2);border-radius:10px;padding:8px;background:var(--bg)}
.vz-pick-cat{font-size:10px;font-weight:800;letter-spacing:1.2px;text-transform:uppercase;color:var(--muted2);
  padding:8px 6px 4px}
.vz-pick{display:flex;align-items:center;gap:9px;padding:7px 9px;border-radius:8px;cursor:pointer;font-size:13px}
.vz-pick:hover{background:rgba(248,163,30,.06)}
.vz-pick.sel{background:rgba(248,163,30,.1);font-weight:700}
.vz-pick input{accent-color:#F8A31E}
.vz-step-row{display:flex;gap:8px;margin-bottom:7px;align-items:center}
.vz-step-row .vz-step-in{flex:1;font-size:12.5px;padding:9px 10px;border:1px solid var(--line2);border-radius:8px;background:var(--bg)}

/* ---- daily stats ---- */
.ds-datebar{display:flex;align-items:center;gap:12px;padding:14px 18px;margin-bottom:16px;flex-wrap:wrap}
.ds-datebar label{font-size:11px;font-weight:800;letter-spacing:1.2px;text-transform:uppercase;color:var(--muted2)}
.ds-datebar input[type=date]{font-size:14px;font-weight:700;padding:8px 12px;border:1px solid var(--line2);
  border-radius:9px;background:var(--bg);color:var(--text)}
.ds-date-hint{font-size:12px;color:var(--muted)}
.ds-panel{margin-bottom:18px}
.ds-panel-h{flex-wrap:wrap;gap:10px}
.ds-h-ico{display:inline-flex;width:26px;height:26px;border-radius:8px;align-items:center;justify-content:center;
  background:linear-gradient(135deg,#151310,#241f16);color:#F8D80A;font-size:13px;margin-right:9px}
.ds-extra{display:flex;align-items:center;gap:9px;margin-left:auto}
.ds-extra label{font-size:10.5px;font-weight:800;letter-spacing:1px;text-transform:uppercase;color:var(--muted2)}
.ds-extra-in{width:92px}
.ds-table input.ds-in,.ds-extra-in{font-size:14px;font-weight:700;text-align:center;padding:9px 8px;
  border:1px solid var(--line2);border-radius:8px;background:var(--bg);color:var(--text);width:100%;min-width:74px}
.ds-table input.ds-in:focus,.ds-extra-in:focus{border-color:#F8A31E;outline:none;box-shadow:0 0 0 3px rgba(248,163,30,.12)}
.ds-table{width:100%}
.ds-table th{font-size:10.5px;letter-spacing:.8px;text-transform:uppercase;color:var(--muted2);text-align:center}
.ds-table th.ds-blockcol{text-align:left}
.ds-table td{padding:6px 6px}
.ds-block{font-size:12.5px;font-weight:800;color:var(--text);white-space:nowrap;padding-right:10px}
.ds-total-row td{border-top:2px solid var(--line2);padding-top:10px}
.ds-total-row .ds-block{color:#F8A31E}
.ds-total{text-align:center;font-size:16px;font-weight:800;color:#F8A31E;font-family:'JetBrains Mono',monospace}
.ds-foot{display:flex;align-items:center;justify-content:flex-end;gap:12px;padding:12px 4px 2px}
.ds-save-state{font-size:12px;color:var(--muted)}
@media(max-width:720px){
  .vz-grid{grid-template-columns:1fr}
  .ds-extra{margin-left:0}
  .ds-table input.ds-in{min-width:56px;font-size:13px}
}

/* ---- vz overrides vs global input/label rules ---- */
.vz-step input[type=checkbox]{width:16px;height:16px;flex:0 0 auto;padding:0;margin:2px 0 0;box-shadow:none}
.vz-step span{flex:1;min-width:0;text-align:left}
.vz-pick{text-transform:none!important;letter-spacing:normal!important;font-size:13px!important;
  color:var(--text)!important;font-weight:500}
.vz-pick input[type=radio]{width:15px;height:15px;flex:0 0 auto;padding:0;margin:0;box-shadow:none}
.vz-pick span{flex:1;min-width:0;text-align:left}
.vz-pick.sel{font-weight:700}
.vz-pick-cat{text-transform:uppercase}

/* ---- goal wizard category headings ---- */
.vz-wiz-cat{font-size:10.5px;font-weight:800;letter-spacing:1.4px;text-transform:uppercase;
  color:var(--muted2);margin:16px 2px 9px}
.vz-wiz-cat:first-child{margin-top:0}
.vz-wiz-grid{margin-bottom:4px}

/* ---- goal wizard: category accordion ---- */
.vz-acc{display:flex;flex-direction:column;gap:10px}
.vz-acc-item{border:1.5px solid var(--line);border-radius:14px;overflow:hidden;background:var(--panel2);transition:border-color .15s}
.vz-acc-item.open{border-color:var(--cc, var(--line2));background:var(--panel)}
.vz-acc-h{--cc:#F8A31E;display:flex;align-items:center;gap:13px;width:100%;text-align:left;
  padding:13px 15px;background:none;border:none;cursor:pointer}
.vz-acc-h .dr-tchip{flex:none}
.vz-acc-tx{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}
.vz-acc-t{font-size:14.5px;font-weight:800;color:var(--text)}
.vz-acc-s{font-size:11.5px;color:var(--muted)}
.vz-acc-sel{font-size:11px;font-weight:700;color:var(--cc);margin-left:6px;white-space:nowrap}
.vz-acc-chev{flex:none;font-size:15px;color:var(--muted2);width:20px;text-align:center}
.vz-acc-item.open .vz-acc-chev{color:var(--cc)}
.vz-acc-item .vz-wiz-grid{padding:2px 13px 13px;margin:0}
@media(max-width:640px){.vz-acc-s{display:none}}

/* ============================================================
 *  DAILY STATS — weekly / monthly overview
 * ========================================================== */
.ds-modes{display:flex;gap:8px;margin:0 0 14px;flex-wrap:wrap}
.ds-mode{padding:8px 16px;border-radius:999px;border:1px solid var(--line2);background:var(--panel);
  color:var(--muted);font-size:12.5px;font-weight:700;cursor:pointer;transition:all .15s}
.ds-mode:hover{border-color:#7FB4E0;color:var(--text)}
.ds-mode.on{background:linear-gradient(135deg,#151310,#241f16);color:#fff;border-color:transparent;
  box-shadow:0 8px 18px -8px rgba(16,45,110,.55)}
.dsov-hero{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;
  border-radius:18px;padding:22px 24px;margin-bottom:16px;color:#fff;
  background:radial-gradient(130% 170% at 12% -30%,rgba(76,159,216,.28),transparent 55%),
             linear-gradient(135deg,#151310 0%,#241f16 60%,#0c0a08 100%)}
.dsov-eyebrow{font-size:10px;font-weight:800;letter-spacing:2.2px;text-transform:uppercase;color:#F8D80A;margin-bottom:6px}
.dsov-period{display:flex;align-items:center;gap:10px}
.dsov-period-l{font-size:21px;font-weight:800;letter-spacing:.2px;color:#fff;white-space:nowrap}
.dsov-nav{width:30px;height:30px;border-radius:9px;border:1px solid rgba(248,163,30,.4);background:rgba(248,163,30,.1);
  color:#CFE6F8;font-size:16px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:background .15s}
.dsov-nav:hover{background:rgba(248,163,30,.24)}
.dsov-sub{font-size:12px;color:#B9CBE6;margin-top:7px;font-style:italic}
.dsov-hero-r{display:flex;align-items:center;gap:22px;flex-wrap:wrap}
.dsov-big{display:flex;flex-direction:column;align-items:center}
.dsov-big b{font-size:38px;font-weight:800;line-height:1;color:#fff;font-family:'JetBrains Mono',monospace}
.dsov-big span,.dsov-mini span{font-size:9px;font-weight:800;letter-spacing:1.6px;text-transform:uppercase;color:#9FB5D8;margin-top:5px}
.dsov-mini{display:flex;flex-direction:column;align-items:center}
.dsov-mini b{font-size:19px;font-weight:800;color:#FBF6E9;line-height:1.2;white-space:nowrap}
.dsov-mini b i{font-style:normal;font-size:13px;color:#8DA5CC}
.dsov-week{display:grid;grid-template-columns:repeat(7,1fr);gap:10px;margin-bottom:6px}
.dsov-wcell{display:flex;flex-direction:column;align-items:center;gap:6px;padding:13px 6px 11px;
  background:var(--panel);border:1.5px solid var(--line);border-radius:14px;cursor:pointer;transition:all .15s;position:relative}
.dsov-wcell:hover{border-color:#7FB4E0;transform:translateY(-2px);box-shadow:0 10px 22px -12px rgba(16,45,110,.4)}
.dsov-wcell.today{border-color:#F8A31E;box-shadow:inset 0 0 0 1px #F8A31E}
.dsov-wcell.future{opacity:.55}
.dsov-wdow{font-size:9.5px;font-weight:800;letter-spacing:1.4px;text-transform:uppercase;color:var(--muted2)}
.dsov-wnum{font-size:19px;font-weight:800;color:var(--text);line-height:1}
.dsov-wbar{width:12px;height:52px;border-radius:99px;background:var(--line);display:flex;align-items:flex-end;overflow:hidden}
.dsov-wbar i{display:block;width:100%;border-radius:99px;background:linear-gradient(180deg,#F8D80A,#F8A31E)}
.dsov-wcell:not(.has) .dsov-wbar i{background:var(--line2);height:8%!important}
.dsov-wsc{font-size:13px;font-weight:800;color:#F8A31E;font-family:'JetBrains Mono',monospace}
.dsov-wsc.dim{color:var(--muted2)}
.dsov-wtags{display:flex;gap:4px}
.dsov-wtags i,.dsov-dots i,.dsov-legend i{width:7px;height:7px;border-radius:50%;display:inline-block}
.dsov-wtags .dp,.dsov-dots .dp,.dsov-legend .dp{background:#F8A31E}
.dsov-wtags .dr,.dsov-dots .dr,.dsov-legend .dr{background:#8C6FC0}
.dsov-legend{display:flex;align-items:center;gap:16px;flex-wrap:wrap;font-size:11.5px;color:var(--muted);margin:8px 2px 16px}
.dsov-legend span{display:inline-flex;align-items:center;gap:6px}
.dsov-hint{margin-left:auto;font-style:italic}
.dsov-month{background:var(--panel);border:1.5px solid var(--line);border-radius:16px;padding:16px;margin-bottom:6px}
.dsov-mhead{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;margin-bottom:8px}
.dsov-mdow{text-align:center;font-size:9.5px;font-weight:800;letter-spacing:1.3px;text-transform:uppercase;color:var(--muted2)}
.dsov-mgrid{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}
.dsov-mblank{min-height:52px}
.dsov-mcell{position:relative;min-height:52px;border-radius:10px;border:1px solid var(--line);cursor:pointer;
  background:color-mix(in srgb,#F8A31E calc(var(--heat,0)*32%),var(--panel2));
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;transition:all .13s}
.dsov-mcell:hover{border-color:#7FB4E0;transform:scale(1.05)}
.dsov-mcell.today{border-color:#F8A31E;box-shadow:inset 0 0 0 1px #F8A31E}
.dsov-mcell.future{opacity:.5}
.dsov-mnum{font-size:13px;font-weight:800;color:var(--text)}
.dsov-mcell.has .dsov-mnum{color:#0B2551}
.dsov-dots{display:flex;gap:3px}
.dsov-two{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:16px}
.dsov-sum{border-radius:16px;padding:17px 18px;border:1.5px solid var(--line);background:var(--panel);border-top:3px solid #F8A31E}
.dsov-rec{border-top-color:#8C6FC0}
.dsov-sum-h{display:flex;align-items:center;font-size:13.5px;font-weight:800;color:var(--text);margin-bottom:13px}
.dsov-rec .ds-h-ico{background:linear-gradient(135deg,#2A1A4A,#4A3878);color:#C9B8F2}
.dsov-cells{display:grid;grid-template-columns:repeat(auto-fit,minmax(86px,1fr));gap:10px}
.dsov-cell{text-align:center;padding:9px 4px;border-radius:11px;background:var(--panel2);border:1px solid var(--line)}
.dsov-v{font-size:20px;font-weight:800;color:var(--text);font-family:'JetBrains Mono',monospace;line-height:1.1}
.dsov-prod .dsov-v{color:#F8A31E}
.dsov-rec .dsov-v{color:#8C6FC0}
.dsov-k{font-size:8.6px;font-weight:800;letter-spacing:.9px;text-transform:uppercase;color:var(--muted);margin-top:4px}
@media(max-width:860px){
  .dsov-two{grid-template-columns:1fr}
  .dsov-week{grid-template-columns:repeat(7,minmax(0,1fr));gap:5px}
  .dsov-wcell{padding:9px 2px 8px}
  .dsov-hero{padding:18px}
  .dsov-big b{font-size:30px}
}

/* ============================================================
 *  TEAM LEADERBOARD — under the Overview + Team Command
 * ========================================================== */
.kw-lb{--lb:#F8A31E;--lb2:#F8D80A;margin-top:22px;border-radius:20px;padding:24px 24px 18px;color:#fff;
  background:radial-gradient(140% 180% at 88% -40%,rgba(76,159,216,.25),transparent 55%),
             linear-gradient(135deg,#151310 0%,#241f16 60%,#0c0a08 100%);
  box-shadow:0 24px 50px -28px rgba(8,20,50,.65)}
.kw-lb-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-bottom:14px}
.kw-lb-title{display:flex;align-items:center;gap:13px}
.kw-lb-troph{font-size:30px;filter:drop-shadow(0 6px 12px rgba(0,0,0,.35))}
.kw-lb-eyebrow{font-size:9.5px;font-weight:800;letter-spacing:2.4px;text-transform:uppercase;color:#F8D80A}
.kw-lb h3{margin:3px 0 0;font-size:21px;font-weight:800;color:#fff;letter-spacing:.2px}
.kw-lb-periods{display:flex;gap:6px;flex-wrap:wrap}
.kw-lb-per{padding:7px 13px;border-radius:999px;border:1px solid rgba(248,163,30,.35);background:rgba(248,163,30,.07);
  color:#E9DFC7;font-size:11.5px;font-weight:700;cursor:pointer;transition:all .15s}
.kw-lb-per:hover{background:rgba(248,163,30,.16)}
.kw-lb-per.on{background:#FBF6E9;color:#0B2551;border-color:transparent}
/* Shown when the board opened on the month or quarter because the week was
   bare — otherwise the period button changing on its own looks like a bug. */
.kw-lb-auto{margin:-6px 0 12px;padding:8px 12px;border-radius:10px;
  background:rgba(248,163,30,.10);border:1px solid rgba(248,163,30,.28);
  color:#F3E7CB;font-size:12px;font-weight:600;letter-spacing:.1px}
.kw-lb-trackers{display:flex;gap:8px;margin-bottom:10px;flex-wrap:wrap}
.kw-lb-trk{padding:9px 18px;border-radius:12px;border:1px solid rgba(248,163,30,.3);background:rgba(10,26,58,.4);
  color:#E9DFC7;font-size:12.5px;font-weight:800;cursor:pointer;transition:all .15s}
.kw-lb-trk:hover{border-color:rgba(248,163,30,.6)}
.kw-lb-trk.on{background:linear-gradient(135deg,var(--lb2),var(--lb));color:#12100c;border-color:transparent;
  box-shadow:0 10px 22px -10px rgba(0,0,0,.5)}
.kw-lb-cats{display:flex;gap:6px;margin-bottom:16px;flex-wrap:wrap}
.kw-lb-cat{padding:6px 12px;border-radius:999px;border:1px solid rgba(248,163,30,.25);background:transparent;
  color:#9FB5D8;font-size:11px;font-weight:700;cursor:pointer;transition:all .15s}
.kw-lb-cat:hover{color:#FBF6E9;border-color:rgba(248,163,30,.5)}
.kw-lb-cat.on{background:rgba(232,242,252,.12);color:#fff;border-color:var(--lb2);box-shadow:inset 0 0 0 1px var(--lb2)}
.kw-lb-body{display:flex;flex-direction:column;gap:7px;min-height:80px}
.kw-lb-row{display:flex;align-items:center;gap:13px;padding:10px 13px;border-radius:13px;
  background:rgba(232,242,252,.05);border:1px solid rgba(248,163,30,.12);transition:background .15s}
.kw-lb-row:hover{background:rgba(232,242,252,.09)}
.kw-lb-row.lead{background:linear-gradient(90deg,rgba(244,183,64,.14),rgba(232,242,252,.05));border-color:rgba(244,183,64,.4)}
.kw-lb-row.me{border-color:var(--lb2);box-shadow:inset 0 0 0 1px rgba(248,163,30,.5)}
.kw-lb-medal{font-size:21px;width:32px;text-align:center;flex:none;filter:drop-shadow(0 3px 6px rgba(0,0,0,.35))}
.kw-lb-rank{width:32px;text-align:center;font-size:13px;font-weight:800;color:#8DA5CC;flex:none;font-family:'JetBrains Mono',monospace}
.kw-lb-who{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}
.kw-lb-name{font-size:13.5px;font-weight:800;color:#F2F7FD;display:flex;align-items:center;gap:8px}
.kw-lb-you{font-size:8.5px;font-weight:800;letter-spacing:1.2px;text-transform:uppercase;color:#12100c;
  background:linear-gradient(135deg,var(--lb2),var(--lb));padding:2px 8px;border-radius:999px}
.kw-lb-bar{height:7px;border-radius:99px;background:rgba(248,163,30,.12);overflow:hidden}
.kw-lb-bar i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,var(--lb),var(--lb2))}
.kw-lb-row.lead .kw-lb-bar i{background:linear-gradient(90deg,#C98B2C,#F4B740)}
.kw-lb-val{font-size:17px;font-weight:800;color:#fff;font-family:'JetBrains Mono',monospace;flex:none;min-width:52px;text-align:right}
.kw-lb-gap{text-align:center;color:#5F76A3;font-weight:800;letter-spacing:3px;padding:1px 0}
.kw-lb-loading{color:#9FB5D8;font-size:12.5px;padding:18px 4px}
.kw-lb-empty{color:#E9DFC7;font-size:13px;line-height:1.6;padding:18px 6px;text-align:center}
.kw-lb-foot{margin-top:14px;padding-top:12px;border-top:1px solid rgba(248,163,30,.12);
  font-size:10.5px;color:#7E95BE;letter-spacing:.3px}
@media(max-width:720px){
  .kw-lb{padding:18px 15px 14px}
  .kw-lb-val{font-size:14px;min-width:42px}
  .kw-lb-name{font-size:12.5px}
}

/* ---- dreams wizard: categories stack top-to-bottom (7 items) ---- */
#dr-overlay .dr-cats{grid-template-columns:1fr}
#dr-overlay .dr-tile{padding:13px 16px}

/* ---- goals page in the dreams frame ---- */
.vz-goals-wrap .vz-grid{margin-bottom:20px}
.vz-goals-wrap .dr-won-h{margin-top:4px}

/* ---- availability panel: collapsed hero by default ---- */
.av-panel-v2 .av-hero{cursor:pointer;user-select:none}
.av-panel-v2 .av-body{display:none}
.av-panel-v2.open .av-body{display:block;animation:avBodyIn .24s ease}
@keyframes avBodyIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
.av-expand{display:inline-flex;align-items:center;gap:8px;padding:9px 16px;border-radius:999px;
  border:1px solid rgba(248,163,30,.45);background:rgba(248,163,30,.10);color:#F3EEDD;
  font-size:12px;font-weight:800;letter-spacing:.4px;cursor:pointer;transition:background .15s,border-color .15s;white-space:nowrap}
.av-expand:hover{background:rgba(248,163,30,.22);border-color:rgba(248,216,10,.7)}
.av-expand-ch{font-size:13px;line-height:1;transition:transform .2s;color:#F8D80A}
.av-panel-v2.open .av-expand-ch{transform:rotate(180deg)}
@media(max-width:640px){.av-expand-t{display:none}.av-expand{padding:9px 11px}}

/* ---- editable Daily Total row ---- */
.ds-total-in{font-size:16px!important;font-weight:800!important;color:#F8A31E!important;
  font-family:'JetBrains Mono',monospace!important;background:rgba(248,163,30,.05)!important;
  border-color:rgba(248,163,30,.3)!important}
.ds-total-in:focus{border-color:#F8A31E!important}
.ds-total-hint{display:block;font-size:9px;font-weight:600;letter-spacing:.3px;color:var(--muted2);
  text-transform:none;white-space:normal;line-height:1.3;max-width:110px;margin-top:2px}

/* ---- View-as-agent banner ---- */
.kw-viewas-bar{position:relative;z-index:120;flex:none;display:flex;align-items:center;gap:10px;
  padding:8px 16px;background:linear-gradient(90deg,#151310,#241f16 55%,#0c0a08);color:#FBF6E9;
  border-bottom:1px solid rgba(248,163,30,.4);box-shadow:0 8px 22px -12px rgba(0,0,0,.6);font-size:12.5px}
.kw-viewas-eye{font-size:15px}
.kw-viewas-t{flex:1;min-width:0;letter-spacing:.2px}
.kw-viewas-t b{color:#F8D80A;font-weight:800}
.kw-viewas-exit{flex:none;padding:6px 14px;border-radius:999px;border:1px solid rgba(248,163,30,.5);
  background:rgba(248,163,30,.12);color:#fff;font-size:11.5px;font-weight:800;cursor:pointer;transition:background .15s}
.kw-viewas-exit:hover{background:rgba(248,163,30,.28)}
/* Banner lives in normal flow at the very top; the app fills the rest.
   No margins, no fixed offsets — so nothing can scroll under it or leave a gap. */
body.kw-viewas{display:flex;flex-direction:column;height:100vh;height:100dvh;overflow:hidden}
body.kw-viewas .app{height:auto;flex:1;min-height:0;margin-top:0}
body.kw-viewas .sidebar{height:100%;top:0}
body.kw-viewas .sidebar-expand-btn{top:calc(var(--kwva,38px) + 8px)}
@media(max-width:980px){
  body.kw-viewas .menu-btn{top:calc(var(--kwva,38px) + 9px)!important}
}
@media(max-width:640px){.kw-viewas-t{font-size:11px}}

/* ---- goals: drag affordance ---- */
.vz-sortable .vz-card{cursor:grab}
.vz-sortable .vz-card:active{cursor:grabbing}
.vz-goals-wrap .dr-stats.vz-sortable .dr-stat{cursor:grab}

/* ---- sidebar scale: quick links must never crowd out the agent roster ----
   Whenever a roster is present (admin, super admin, or a manager-agent),
   the quick-links block gets a height cap and its own scrollbar. Regular
   agents (no roster) keep the full-height list. */
.role-admin .sidebar-main > #ph-quick-links,
.role-super-admin .sidebar-main > #ph-quick-links,
body.is-manager .sidebar-main > #ph-quick-links{
  flex:0 1 auto;max-height:34vh;overflow-y:auto;overscroll-behavior:contain;
  scrollbar-width:thin;scrollbar-color:var(--line2) transparent}
.role-admin .sidebar-main > #ph-quick-links::-webkit-scrollbar,
.role-super-admin .sidebar-main > #ph-quick-links::-webkit-scrollbar,
body.is-manager .sidebar-main > #ph-quick-links::-webkit-scrollbar{width:7px}
.role-admin .sidebar-main > #ph-quick-links::-webkit-scrollbar-thumb,
.role-super-admin .sidebar-main > #ph-quick-links::-webkit-scrollbar-thumb,
body.is-manager .sidebar-main > #ph-quick-links::-webkit-scrollbar-thumb{
  background:var(--line2);border-radius:99px}
/* the roster always keeps a healthy minimum share of the sidebar */
.role-admin .sidebar-main > .agent-roster-ui,
.role-super-admin .sidebar-main > .agent-roster-ui,
body.is-manager .agent-roster-ui{min-height:220px}

/* ---- sidebar links editor: tooltip field ---- */
.sl-r-tip{width:100%;margin:7px 0 2px;font-size:12px;padding:8px 10px;border:1px solid var(--line);
  border-radius:8px;background:var(--bg)}
.sl-r-tip:focus{border-color:var(--gold-soft);outline:none;box-shadow:0 0 0 3px rgba(248,163,30,.1)}

/* ---- daily-only extra (Issued Paid / ICA Signed): prominent row ---- */
.ds-extra-row{display:flex;align-items:center;gap:14px;margin:10px 4px 2px;padding:12px 14px;
  border-radius:12px;background:rgba(248,163,30,.06);border:1px dashed rgba(248,163,30,.35)}
.ds-extra-row .ds-extra-in{width:110px;flex:none}
.ds-extra-tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.ds-extra-tx b{font-size:13px;font-weight:800;color:var(--text);letter-spacing:.2px}
.ds-extra-tx span{font-size:11.5px;color:var(--muted);line-height:1.4}
@media(max-width:640px){.ds-extra-row{flex-direction:column;align-items:stretch}.ds-extra-row .ds-extra-in{width:100%}}

/* ===== Mobile topbar v2: one compact row (hamburger · tabs · Manage) ===== */
@media(max-width:980px){
  .topbar{padding:7px 10px 0 60px}                 /* sits beside the fixed hamburger */
  .tb-row{flex-wrap:nowrap;align-items:center;gap:8px}
  .tabs-shell{margin-top:0}
  .tabs{margin-top:0;padding:2px 24px 2px 0;gap:2px}
  .tab{padding:8px 11px;font-size:13px}
  .tab .badge{font-size:9px;padding:1px 5px}
  .tb-stats{width:auto;margin-top:0;flex:none;gap:8px}
  .tb-manage-btn{padding:7px 11px;font-size:12px;white-space:nowrap}
  .dash-back{margin-bottom:0;flex:none}
  .topbar::after{display:none}                     /* tabs-shell paints its own fades */

  /* Team Command hero: clear the hamburger so the title is never covered */
  .td2-hero-l{padding-left:50px}
}

/* =====================================================================
   EXPERIOR / PLEDGE FINANCIAL GROUP THEME
   Appended last so these win by source order. Black + gold accents.
   Text accents stay dark (readable); gold is a deliberate accent on
   buttons, active states, rings, meters and the leaderboard.
   ===================================================================== */

/* --- page background: white/soft-gray with a faint gold wash --- */
body{background:radial-gradient(1200px 700px at 80% -10%,rgba(248,163,30,.06),transparent 60%),var(--ink)!important}

/* --- primary buttons / CTAs: gold gradient, black text --- */
.btn-add,.ql-save{background:var(--exp-grad)!important;color:var(--exp-black)!important;border:none!important;font-weight:800}
.btn-add:hover,.ql-save:hover{filter:brightness(1.04) saturate(1.05)!important}

/* --- progress rings & meters go gold --- */
.ring{background:conic-gradient(var(--exp-gold) calc(var(--p)*1%),var(--panel3) 0)!important}
.imp-prog-ring{background:conic-gradient(var(--exp-gold) calc(var(--pct)*1%),var(--panel3) 0)!important}
.mini-bar i{background:var(--exp-grad)!important}
.agent-item.active::before,.agent-item.active-selected-style::before,
.agent-card.active::before{background:var(--exp-grad)!important}

/* --- top tabs: minimal, no underline. Active = bold black; inactive = graphite --- */
.tab{color:var(--muted)!important;font-weight:600!important;text-shadow:none!important;box-shadow:none!important}
.tab:hover{color:var(--exp-black)!important}
.tab.active{color:var(--exp-black)!important;font-weight:800!important;text-shadow:none!important;box-shadow:none!important}
.tab .badge{background:var(--panel3)!important;color:var(--muted)!important;font-weight:700}
.tab.active .badge{background:var(--exp-black)!important;color:#fff!important}

/* --- dashboard nav: gold accent on active --- */
.nav-dash.active{border-color:var(--exp-gold)!important;color:var(--exp-black)!important}
.nav-dash.active .di{color:var(--exp-gold)!important}

/* KPI accent tiles that were navy/blue -> black/gold (semantic status tiles kept) */
.td2-kpi.t-navy{--acc:var(--exp-black)!important}
.td2-kpi.t-blue{--acc:#B4801A!important}

/* Daily Total input: was blue -> Experior black on a soft-gold tint */
.ds-total-in{color:var(--exp-black)!important;background:rgba(248,163,30,.07)!important;border-color:rgba(248,163,30,.35)!important}
.ds-total-in:focus{border-color:var(--exp-gold)!important}

/* ============ BLACK SIDEBAR ============ */
.sidebar{background:linear-gradient(180deg,#0d0c0b,#050505)!important;border-right:1px solid #262420!important}
.brand{background:var(--exp-black)!important}
.brand::after{background:linear-gradient(90deg,transparent 4%,rgba(248,163,30,.85) 50%,transparent 96%)!important}
.brand-mark .brand-product{color:#fff!important}
.brand-mark .brand-sub{color:rgba(248,163,30,.92)!important}
.brand-mark .brand-company{color:rgba(194,191,184,.85)!important}

.user-chip{border-bottom:1px solid #262420!important}
.uc-name{color:#F3F3F1!important}
.uc-role{color:#A8A49B!important}
.uc-avatar{background:var(--exp-grad)!important;color:var(--exp-black)!important}
.uc-signout{background:rgba(255,255,255,.04)!important;border:1px solid #33302b!important;color:#C2BFB8!important}
.uc-signout:hover{border-color:var(--exp-gold)!important;color:var(--exp-gold)!important}

.ph-ql{border-top:1px solid #262420!important}
.ql-head{color:#A8A49B!important}
.ql-edit{color:#A8A49B!important}
.ql-edit:hover{background:rgba(255,255,255,.06)!important;color:var(--exp-gold2)!important}
.ql-item{color:#E8E6E1!important}
.ql-item:hover{background:rgba(255,255,255,.06)!important}
.ql-home{background:rgba(248,163,30,.12)!important;border:1px solid rgba(248,163,30,.4)!important;color:var(--exp-gold2)!important}
.ql-home:hover{border-color:var(--exp-gold)!important;background:rgba(248,163,30,.2)!important}
.ql-dot{background:var(--exp-gold)!important}
.ql-ext,.ql-hint{color:#8A867E!important}

.roster-head span{color:#C2BFB8!important}
.roster-sub{color:#9A968E!important}
.roster-empty{color:#9A968E!important}
.search input{background:#161412!important;border:1px solid #2f2c28!important;color:#fff!important}
.search input::placeholder{color:#8A867E!important}
.agent-item-name,.agent-card .nm{color:#F1EFEA!important}
.agent-item-meta,.agent-card .meta{color:#A8A49B!important}
.agent-item:hover,.agent-card:hover{background:rgba(255,255,255,.05)!important;border-color:#3a3630!important;box-shadow:inset 3px 0 0 0 var(--exp-gold),0 12px 26px -16px rgba(0,0,0,.6)!important}
.agent-item:hover .agent-item-name,.agent-card:hover .nm{color:var(--exp-gold2)!important}
.agent-item.active,.agent-item.active-selected-style,.agent-card.active{background:rgba(248,163,30,.14)!important;border-color:rgba(248,163,30,.5)!important}
.rank-chip{background:rgba(248,163,30,.16)!important;color:var(--exp-gold2)!important;border:1px solid rgba(248,163,30,.32)!important}

.side-foot,.side-foot-group{border-top:1px solid #262420!important}
.side-foot-h{color:#8A867E!important}
.side-foot-h span{color:#A8A49B!important}
.side-foot button{color:#C2BFB8!important;border:1px solid #33302b!important;background:rgba(255,255,255,.02)!important}
.side-foot button:hover{color:var(--exp-gold2)!important;border-color:var(--exp-gold)!important}
.settings-btn{background:rgba(255,255,255,.03)!important;border:1px solid #33302b!important;color:#E8E6E1!important}
.settings-btn .settings-caret{color:#A8A49B!important}
.settings-btn:hover{border-color:var(--exp-gold)!important}
.settings-ico{color:var(--exp-gold)!important}
.settings-menu{background:#141312!important;border:1px solid #2f2c28!important}
.settings-menu button{color:#E8E6E1!important}
.settings-menu button:hover{background:rgba(255,255,255,.06)!important;color:var(--exp-gold2)!important}
.save-pill{color:#A8A49B!important}
.sidebar-collapse-btn{color:#C2BFB8!important;background:rgba(255,255,255,.05)!important;border-color:rgba(255,255,255,.15)!important}
.sidebar-collapse-btn:hover{background:rgba(248,163,30,.2)!important;border-color:rgba(248,163,30,.6)!important}

/* ============ LEADERBOARD: black card, gold accents ============ */
.kw-lb{--lb:#F8A31E!important;--lb2:#F8D80A!important;
  background:radial-gradient(140% 180% at 88% -40%,rgba(248,163,30,.18),transparent 55%),
             linear-gradient(135deg,#141210 0%,#241f16 55%,#0c0a08 100%)!important;
  box-shadow:0 24px 50px -28px rgba(0,0,0,.7)!important}
.kw-lb-eyebrow{color:var(--exp-gold2)!important}
.kw-lb-per{border:1px solid rgba(248,163,30,.35)!important;background:rgba(248,163,30,.07)!important;color:#D8D4CC!important}
.kw-lb-per:hover{background:rgba(248,163,30,.16)!important}
.kw-lb-per.on{background:var(--exp-grad)!important;color:var(--exp-black)!important;border-color:transparent!important}
.kw-lb-trk{border:1px solid rgba(248,163,30,.3)!important;background:rgba(255,255,255,.03)!important;color:#D8D4CC!important}
.kw-lb-trk:hover{border-color:rgba(248,163,30,.6)!important}
.kw-lb-trk.on{background:var(--exp-grad)!important;color:var(--exp-black)!important;border-color:transparent!important}
.kw-lb-cat{border:1px solid rgba(248,163,30,.25)!important;color:#C7C3BA!important}
.kw-lb-cat:hover{color:#fff!important;border-color:rgba(248,163,30,.5)!important}
.kw-lb-cat.on{background:rgba(248,163,30,.14)!important;color:#fff!important;border-color:var(--exp-gold)!important;box-shadow:inset 0 0 0 1px var(--exp-gold)!important}
.kw-lb-row{background:rgba(255,255,255,.04)!important;border:1px solid rgba(248,163,30,.12)!important}
.kw-lb-row:hover{background:rgba(255,255,255,.07)!important}
.kw-lb-row.lead{background:linear-gradient(90deg,rgba(248,163,30,.18),rgba(255,255,255,.04))!important;border-color:rgba(248,163,30,.45)!important}
.kw-lb-row.me{border-color:var(--exp-gold)!important;box-shadow:inset 0 0 0 1px rgba(248,163,30,.5)!important}
.kw-lb-rank{color:#B7B1A4!important}
.kw-lb-name{color:#F5F2EC!important}
.kw-lb-you{color:var(--exp-black)!important;background:var(--exp-grad)!important}
.kw-lb-bar{background:rgba(248,163,30,.14)!important}
.kw-lb-row.lead .kw-lb-bar i{background:linear-gradient(90deg,#C98B2C,#F8D80A)!important}
.kw-lb-gap{color:#7a746a!important}
.kw-lb-loading{color:#C7C3BA!important}
.kw-lb-empty{color:#D8D4CC!important}
.kw-lb-foot{border-top:1px solid rgba(248,163,30,.14)!important;color:#9A948A!important}

/* ============ view-as-agent banner: black + gold ============ */
.kw-viewas-bar{background:linear-gradient(90deg,#141210,#241f16 55%,#0c0a08)!important;color:#F5F2EC!important;border-bottom:1px solid rgba(248,163,30,.4)!important}
.kw-viewas-t b{color:var(--exp-gold2)!important}
.kw-viewas-exit{border:1px solid rgba(248,163,30,.5)!important;background:rgba(248,163,30,.12)!important;color:#fff!important}

/* =====================================================================
   BRAND LOGO (black sidebar) + ADVANCEMENT PLAN PAGES (SM / ED / SEP)
   ===================================================================== */
.brand-logo{display:block;width:100%;max-width:184px;height:auto;margin:2px auto 7px;filter:drop-shadow(0 4px 14px rgba(0,0,0,.5))}
.brand-mark{text-align:center}
body.sidebar-collapsed .brand-logo{display:none}

/* ---- layout ---- */
.adv-wrap{display:flex;flex-direction:column;gap:16px;max-width:1180px}
.adv-cols{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:860px){.adv-cols{grid-template-columns:1fr}}
.adv-sec{font-family:var(--disp);font-size:19px;letter-spacing:.6px;color:var(--exp-black);margin:8px 2px 0;display:flex;align-items:baseline;gap:10px}
.adv-sec .ct{font-family:var(--sans);font-size:12px;font-weight:500;letter-spacing:0;color:var(--muted)}

/* ---- hero ---- */
.adv-hero{position:relative;overflow:hidden;border-radius:20px;padding:26px 28px;color:#fff;display:flex;
  align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;
  background:radial-gradient(150% 200% at 90% -30%,rgba(248,163,30,.22),transparent 55%),linear-gradient(135deg,#151310 0%,#241f16 55%,#0c0a08 100%);
  box-shadow:0 26px 54px -30px rgba(0,0,0,.75)}
.adv-hero-glow{position:absolute;right:-60px;top:-80px;width:280px;height:280px;border-radius:50%;
  background:radial-gradient(circle,rgba(248,163,30,.35),transparent 60%);filter:blur(20px);pointer-events:none}
.adv-hero-l{display:flex;align-items:center;gap:20px;position:relative;z-index:1;min-width:0}
.adv-badge{flex:none;width:74px;height:74px;border-radius:16px;display:grid;place-items:center;
  font-family:var(--disp);font-size:30px;letter-spacing:1px;color:var(--exp-black);
  background:var(--exp-grad);box-shadow:0 12px 26px -10px rgba(248,163,30,.6)}
.adv-eyebrow{font-size:10px;font-weight:800;letter-spacing:2.6px;text-transform:uppercase;color:var(--exp-gold2)}
.adv-title{font-family:var(--disp);font-size:34px;letter-spacing:.6px;line-height:1;margin:5px 0 0;color:#fff}
.adv-pct{font-size:15px;font-weight:800;color:var(--exp-gold2);margin-top:6px}
.adv-pct span{color:#C7C3BA;font-weight:600}
.adv-tag{font-size:13.5px;color:#D8D4CC;margin-top:9px;max-width:520px;line-height:1.5}
.adv-ring{--p:0;position:relative;z-index:1;flex:none;width:118px;height:118px;border-radius:50%;
  background:conic-gradient(var(--exp-gold) calc(var(--p)*1%),rgba(255,255,255,.12) 0);
  display:grid;place-items:center;transition:background .4s ease}
.adv-ring-in{width:92px;height:92px;border-radius:50%;background:#100e0b;display:grid;place-items:center;text-align:center}
.adv-ring-in b{font-family:var(--disp);font-size:28px;color:#fff;line-height:1}
.adv-ring-in span{font-size:9.5px;font-weight:700;letter-spacing:.4px;color:var(--exp-gold2);margin-top:3px;text-transform:uppercase}

/* ---- fact chips ---- */
.adv-facts{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
@media(max-width:720px){.adv-facts{grid-template-columns:repeat(2,1fr)}}
.adv-fact{background:var(--panel);border:1px solid var(--line);border-left:4px solid var(--exp-gold);
  border-radius:12px;padding:12px 15px}
.adv-fact-k{font-size:10px;font-weight:800;letter-spacing:.6px;text-transform:uppercase;color:var(--muted)}
.adv-fact-v{font-family:var(--disp);font-size:22px;letter-spacing:.4px;color:var(--exp-black);margin-top:3px}

/* ---- path selector ---- */
.adv-pathsel{display:flex;gap:10px;flex-wrap:wrap}
.adv-pathbtn{display:flex;flex-direction:column;gap:2px;padding:11px 20px;border-radius:12px;cursor:pointer;
  border:1.5px solid var(--line2);background:var(--panel);transition:all .16s;text-align:left;min-width:170px}
.adv-pathbtn-b{font-size:9.5px;font-weight:800;letter-spacing:1px;text-transform:uppercase;color:var(--muted2)}
.adv-pathbtn-n{font-family:var(--disp);font-size:19px;letter-spacing:.4px;color:var(--exp-black)}
.adv-pathbtn:hover{border-color:var(--exp-gold);transform:translateY(-1px)}
.adv-pathbtn.on{border-color:transparent;background:var(--exp-grad);box-shadow:0 12px 24px -12px rgba(248,163,30,.6)}
.adv-pathbtn.on .adv-pathbtn-b{color:rgba(8,7,7,.65)}
.adv-pathbtn.on .adv-pathbtn-n{color:var(--exp-black)}

/* ---- requirement cards ---- */
.adv-card{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:16px 18px;box-shadow:0 14px 30px -26px rgba(18,16,14,.5)}
.adv-card-soft{background:linear-gradient(180deg,var(--panel),var(--panel2))}
.adv-card-note{background:var(--panel2)}
.adv-card-h{display:flex;align-items:baseline;gap:10px;margin-bottom:10px}
.adv-card-t{font-family:var(--disp);font-size:17px;letter-spacing:.5px;color:var(--exp-black)}
.adv-card-s{font-size:11px;font-weight:700;letter-spacing:.4px;text-transform:uppercase;color:var(--exp-gold);}
.adv-reqs{display:flex;flex-direction:column;gap:8px}
.adv-req{display:flex;align-items:flex-start;gap:12px;width:100%;text-align:left;padding:11px 12px;border-radius:11px;
  border:1px solid var(--line);background:var(--panel);cursor:pointer;transition:all .15s}
.adv-req:hover{border-color:var(--exp-gold);background:rgba(248,163,30,.04)}
.adv-check{flex:none;width:22px;height:22px;border-radius:7px;border:2px solid var(--line2);display:grid;place-items:center;
  font-size:13px;font-weight:900;color:#fff;margin-top:1px;transition:all .15s}
.adv-req.done{border-color:rgba(248,163,30,.5);background:rgba(248,163,30,.08)}
.adv-req.done .adv-check{background:var(--exp-grad);border-color:transparent;color:var(--exp-black)}
.adv-req-t{display:flex;flex-direction:column;gap:3px;min-width:0}
.adv-req-t b{font-size:13.5px;font-weight:700;color:var(--exp-black);line-height:1.4}
.adv-req.done .adv-req-t b{color:var(--muted);text-decoration:line-through;text-decoration-color:rgba(248,163,30,.6)}
.adv-req-d{font-size:11.5px;color:var(--muted);line-height:1.45}

/* ---- progression ladder (SM) ---- */
.adv-ladder{display:flex;flex-direction:column;gap:0}
.adv-lad-step{display:flex;align-items:center;gap:16px;background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:13px 16px}
.adv-lad-conn{width:2px;height:14px;background:linear-gradient(180deg,var(--exp-gold),var(--exp-gold2));margin-left:39px}
.adv-lad-node{flex:none;width:52px;height:52px;border-radius:12px;display:grid;place-items:center;font-family:var(--disp);
  font-size:15px;letter-spacing:.3px;color:#fff;background:linear-gradient(135deg,#201c15,#0d0b08);border:1px solid rgba(248,163,30,.4)}
.adv-lad-body{flex:1;min-width:0}
.adv-lad-top{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
.adv-lad-top b{font-size:15px;color:var(--exp-black)}
.adv-lad-pct{font-family:var(--disp);font-size:18px;color:var(--exp-gold);letter-spacing:.4px}
.adv-lad-req{font-size:12px;color:var(--muted);margin-top:2px;line-height:1.4}

/* ---- bonus table (SM III) ---- */
.adv-bonus-note{font-size:12px;color:var(--muted);margin-bottom:9px}
.adv-btbl{width:100%;border-collapse:collapse;font-family:var(--sans);font-size:13px}
.adv-btbl th{background:var(--exp-black);color:#fff;text-align:left;padding:9px 12px;font-size:10.5px;text-transform:uppercase;letter-spacing:.5px}
.adv-btbl th:first-child{border-radius:10px 0 0 0}.adv-btbl th:last-child{border-radius:0 10px 0 0}
.adv-btbl td{padding:9px 12px;border-bottom:1px solid var(--line)}
.adv-btbl tr:nth-child(even) td{background:var(--panel2)}
.adv-bt-lvl{font-weight:800;color:var(--exp-black)}
.adv-bt-plus{color:var(--exp-gold);font-weight:800}
.adv-bt-tot{font-weight:800;color:var(--exp-black)}

/* ---- benefits / fine ---- */
.adv-bul{list-style:none;display:flex;flex-direction:column;gap:9px;margin:0;padding:0}
.adv-bul li{position:relative;padding-left:24px;font-size:13px;color:var(--text);line-height:1.5}
.adv-bul li::before{content:"";position:absolute;left:2px;top:6px;width:9px;height:9px;border-radius:50%;background:var(--exp-grad)}
.adv-fine{font-size:12px;color:var(--muted);line-height:1.6;margin:0}
.adv-foot{font-size:11px;color:var(--muted2);line-height:1.6;border-top:1px solid var(--line);padding-top:12px;margin-top:4px}

/* =====================================================================
   MINIMAL BADGES + SIDEBAR READABILITY (yellow / black / white)
   ===================================================================== */

/* ---- stage pills: restrained, monochrome + gold dot (light panels) ---- */
.stage-pill{border:1px solid var(--line2)!important;background:var(--panel2)!important;color:var(--exp-black)!important;
  font-weight:800;letter-spacing:.5px;text-transform:uppercase}
.stage-pill::before{background:var(--exp-gold)!important;opacity:1!important}
.stage-pill.st-onboarding{background:var(--panel3)!important;color:var(--muted)!important;border-color:var(--line2)!important}
.stage-pill.st-onboarding::before{background:var(--muted2)!important}
.stage-pill[class*="st-phase"]{background:var(--exp-black)!important;color:#fff!important;border-color:transparent!important}
.stage-pill[class*="st-phase"]::before{background:var(--exp-gold)!important}
.stage-pill.st-complete{background:var(--exp-grad)!important;color:var(--exp-black)!important;border-color:transparent!important}
.stage-pill.st-complete::before{background:var(--exp-black)!important}

/* overview-header stage pill (larger) — same minimal language */
.stage-pill.ov2-stage{background:rgba(255,255,255,.14)!important;color:#fff!important;border:1px solid rgba(255,255,255,.22)!important}
.stage-pill.ov2-stage::before{background:var(--exp-gold)!important;box-shadow:none!important}
.stage-pill.ov2-stage.st-onboarding{background:rgba(255,255,255,.10)!important;color:#F3F2EF!important;border-color:rgba(255,255,255,.2)!important}
.stage-pill.ov2-stage[class*="st-phase"]{background:var(--exp-grad)!important;color:var(--exp-black)!important;border:none!important}
.stage-pill.ov2-stage[class*="st-phase"]::before{background:var(--exp-black)!important}
.stage-pill.ov2-stage.st-complete{background:var(--exp-grad)!important;color:var(--exp-black)!important;border:none!important}

/* "You" chip -> gold */
.mgr-you{background:var(--exp-grad)!important;color:var(--exp-black)!important}

/* ---- availability badges: add "Hours set" + keep readable on the black sidebar ---- */
.avail-badge.set{color:var(--exp-gold2)!important}
.avail-badge.set .avail-dot{background:var(--exp-gold)!important;animation:none}
.agent-item .avail-badge{margin-left:6px}
.agent-item .avail-badge.noset{color:#B7B1A4!important}
.agent-item .avail-badge.noset .avail-dot{background:#8A867E!important}
.agent-item .avail-badge.open{color:#5FD08B!important}
.agent-item .avail-badge.closed{color:#E88C7A!important}
.agent-item .avail-badge.set{color:var(--exp-gold2)!important}

/* ---- SIDEBAR READABILITY: lift secondary text off the black ---- */
.agent-item-meta,.agent-card .meta{color:#CFCBC2!important}
.agent-item-meta .stage-pill{background:rgba(255,255,255,.07)!important;border:1px solid rgba(255,255,255,.16)!important;color:#EDEBE6!important}
.agent-item-meta .stage-pill.st-onboarding{background:rgba(255,255,255,.05)!important;color:#C7C3BA!important}
.agent-item-meta .stage-pill[class*="st-phase"]{background:rgba(248,163,30,.16)!important;color:var(--exp-gold2)!important;border-color:rgba(248,163,30,.4)!important}
.agent-item-meta .stage-pill.st-complete{background:var(--exp-grad)!important;color:var(--exp-black)!important;border-color:transparent!important}
.uc-role{color:#C2BEB6!important}
.ql-item{color:#EDEBE6!important}
.ql-ext,.ql-hint{color:#A8A49B!important}
.roster-head span{color:#D2CEC6!important}
.save-pill{color:#B7B1A4!important}

/* =====================================================================
   TEAM COMMAND DASHBOARD — remove remaining blue/navy/violet
   ===================================================================== */

/* hero: black + gold (was navy/blue) */
.td2-hero{background:
    radial-gradient(130% 170% at 10% -40%,rgba(248,163,30,.20),transparent 55%),
    radial-gradient(100% 140% at 100% 130%,rgba(248,163,30,.10),transparent 60%),
    linear-gradient(150deg,#151310 0%,#0c0a08 55%,#070605 100%)!important;
  border:1px solid rgba(248,163,30,.35)!important}
.td2-eyebrow{color:var(--exp-gold2)!important}
.td2-bignum b{color:#FFE7A6!important}
.td2-bignum{border-right-color:rgba(248,163,30,.25)!important}
.td2-dist{border-top-color:rgba(248,163,30,.18)!important}
.td2-leg b{color:var(--exp-gold2)!important}

/* avg-team-progress ring (was blue #F8C21E / navy center) */
.ov2-ring{background:conic-gradient(var(--exp-gold) calc(var(--p)*1%),var(--panel3) 0)!important}
.ov2-ring::before{background:var(--panel)!important}
.ov2-ring-v{color:#B4801A!important}
.ov2-ring-l i{color:#B4801A!important}
.td2-hero .ov2-ring{background:conic-gradient(var(--exp-gold) calc(var(--p)*1%),rgba(255,255,255,.14) 0)!important}
.td2-hero .ov2-ring::before{background:#12100c!important}
.td2-hero .ov2-ring-v{color:#fff!important}
.td2-hero .ov2-ring-l{color:#C7C3BA!important}
.td2-hero .ov2-ring-l i{color:var(--exp-gold2)!important}

/* KPI accent tiles: navy/blue/violet/slate -> black/gold/graphite (green & amber kept) */
.td2-kpi.t-navy{--acc:var(--exp-black)!important}
.td2-kpi.t-blue{--acc:#B4801A!important}
.td2-kpi.t-violet{--acc:#545351!important}
.td2-kpi.t-slate{--acc:#8A867E!important}
.td2-kpi::before{background:var(--acc,#B4801A)!important}
.td2-kpi-v{color:var(--acc,#B4801A)!important}

/* table hover/top tints: navy -> gold */
.td2-row:hover{background:rgba(248,163,30,.06)!important}
.td2-table thead th{background:linear-gradient(180deg,#151310,#0b0a08)!important;color:var(--exp-gold2)!important}

/* =====================================================================
   AGENT OVERVIEW — remove navy/blue; ring filled BLACK for readability
   ===================================================================== */

/* hero: navy -> black + gold */
.ov2-hero{color:#fff!important;border:1px solid rgba(248,163,30,.35)!important;
  background:
    radial-gradient(130% 170% at 10% -40%,rgba(248,163,30,.20),transparent 55%),
    radial-gradient(100% 140% at 100% 130%,rgba(248,163,30,.10),transparent 60%),
    linear-gradient(150deg,#151310 0%,#0c0a08 55%,#070605 100%)!important;
  box-shadow:0 22px 50px -26px rgba(0,0,0,.75)!important}
.ov2-hero::after{background:linear-gradient(90deg,transparent,#F8A31E 30%,#F8D80A 50%,#F8A31E 70%,transparent)!important}
.ov2-avatar{background:linear-gradient(150deg,#201c15,#0d0b08)!important;border:2px solid rgba(248,163,30,.7)!important;
  color:#fff!important;box-shadow:0 0 0 4px rgba(248,163,30,.12),0 12px 26px -12px rgba(0,0,0,.8)!important}
.ov2-fact{color:#D8D4CC!important}
.ov2-fact-dot{color:rgba(248,163,30,.55)!important}

/* PROGRESS RING: black arc on a white face (readable), % in black */
.ov2-ring{background:conic-gradient(#080707 calc(var(--p)*1%),#E7E4DD 0)!important;box-shadow:none!important}
.ov2-ring::before{background:#FFFFFF!important;inset:7px!important}
.ov2-ring-v{color:#080707!important}
.ov2-ring-l{color:#C7C3BA!important}
.ov2-ring-l i{color:var(--exp-gold2)!important}
.td2-hero .ov2-ring,.ov2-hero .ov2-ring{background:conic-gradient(#080707 calc(var(--p)*1%),#E7E4DD 0)!important}
.td2-hero .ov2-ring::before,.ov2-hero .ov2-ring::before{background:#FFFFFF!important}
.td2-hero .ov2-ring-v,.ov2-hero .ov2-ring-v{color:#080707!important}

/* journey stepper: navy -> gold/black */
.ov2-journey{border-top:1px solid rgba(255,255,255,.16)!important}
.ov2-jdot{border-color:rgba(255,255,255,.3)!important;color:#B7B4AD!important;background:rgba(255,255,255,.06)!important}
.ov2-jlabel{color:#A8A49B!important}
.ov2-jnode.done .ov2-jdot{background:var(--exp-grad)!important;border-color:transparent!important;color:var(--exp-black)!important}
.ov2-jnode.done .ov2-jlabel{color:#EDEBE6!important}
.ov2-jnode.cur .ov2-jdot{border-color:var(--exp-gold)!important;color:#fff!important;background:rgba(248,163,30,.2)!important;
  animation:ov2pulseGold 2.4s ease-in-out infinite!important}
.ov2-jnode.cur .ov2-jlabel{color:#fff!important;font-weight:800!important}
.ov2-jline{background:rgba(255,255,255,.18)!important}
.ov2-jline.on{background:linear-gradient(90deg,#C9820F,#F8D80A)!important}
@keyframes ov2pulseGold{
  0%,100%{box-shadow:0 0 0 5px rgba(248,163,30,.20),0 0 18px -2px rgba(248,163,30,.7)}
  50%{box-shadow:0 0 0 9px rgba(248,163,30,.10),0 0 28px -2px rgba(248,163,30,.95)}}

/* current-phase card + "In progress" badge: blue -> gold */
.ov2-phase.cur{border-color:rgba(248,163,30,.6)!important;background:linear-gradient(180deg,rgba(248,163,30,.10),var(--panel2))!important}
.ov2-phase.cur .ov2-phase-pct{color:#8A6420!important}
.ov2-phase.cur .ov2-phase-bar span{background:linear-gradient(90deg,#C9932F,#F8D80A)!important}
.ov2-phase-live{color:#8A6420!important;background:rgba(248,163,30,.16)!important;border-color:rgba(248,163,30,.5)!important}

/* family kid chips: navy tint -> gold tint */
.ov-kid i{background:rgba(248,163,30,.14)!important;color:#8A6420!important}

/* admin hero text tints that were blue */
.td2-sub{color:#C7C3BA!important}
.td2-bignum span{color:#C7C3BA!important}

/* =====================================================================
   AGENT DASHBOARD — Dream Board + Goals, Availability, Quick Links, no crowns
   ===================================================================== */

/* ---- no crowns anywhere ---- */
.td2-crown,.ql-crown,.auth-brand .crown{display:none!important}

/* ---- Dream Board: navy -> black + gold, with Goals section ---- */
.ov2-dreamboard{color:#F0EADB!important;border-color:rgba(248,163,30,.35)!important;
  background:
    radial-gradient(130% 170% at 10% -40%,rgba(248,163,30,.16),transparent 55%),
    linear-gradient(150deg,#151310 0%,#0c0a08 60%,#070605 100%)!important}
.ov2-dreamboard .panel-h h3{color:#fff!important}
.ov2-db-star{color:var(--exp-gold)!important;filter:drop-shadow(0 0 6px rgba(248,163,30,.6))!important}
.ov2-db-sub{color:#A8A49B!important}
.ov2-db-btn{border-color:rgba(248,163,30,.45)!important;color:var(--exp-gold2)!important;background:transparent!important}
.ov2-db-btn:hover{border-color:var(--exp-gold)!important;color:var(--exp-gold)!important;background:rgba(248,163,30,.1)!important}
.ov2-dream{border-bottom-color:rgba(255,255,255,.09)!important}
.ov2-dream-n{color:var(--exp-gold)!important}
.ov2-dream-t{color:#F6F0E0!important}
.ov2-dream-why{color:#A8A49B!important}
.ov2-dream-tf{color:var(--exp-gold2)!important;background:rgba(248,163,30,.12)!important;border:1px solid rgba(248,163,30,.3)!important;padding:2px 9px;border-radius:20px}
.ov2-dream-more{color:var(--exp-gold2)!important}
.ov2-empty-dark .ov2-empty-ic{color:var(--exp-gold)!important}
.ov2-db-divider{display:flex;align-items:center;gap:10px;margin:14px 0 4px;font-size:10px;font-weight:800;
  letter-spacing:2px;text-transform:uppercase;color:var(--exp-gold2)}
.ov2-db-divider::after{content:"";flex:1;height:1px;background:rgba(248,163,30,.28)}
.ov2-goal-n{font-family:var(--sans)!important;font-size:17px!important;color:var(--exp-gold)!important;line-height:1.3!important}

/* ---- General Availability: navy -> black + gold ---- */
.av-hero{background:
    radial-gradient(130% 170% at 10% -40%,rgba(248,163,30,.16),transparent 55%),
    linear-gradient(150deg,#151310 0%,#0c0a08 60%,#070605 100%)!important}
.av-hero::before{background:radial-gradient(circle,rgba(248,163,30,.32),transparent 65%)!important}
.av-hero::after{background:radial-gradient(circle,rgba(248,163,30,.12),transparent 68%)!important}
.av-hero .av-eyebrow{color:var(--exp-gold2)!important}
.av-wd{color:#C7C3BA!important;background:rgba(255,255,255,.06)!important;border:1px solid rgba(255,255,255,.14)!important}
.av-wd.on{color:var(--exp-black)!important;background:var(--exp-grad)!important;border-color:transparent!important;box-shadow:0 6px 16px -6px rgba(248,163,30,.7)!important}
.av-livebig{background:rgba(255,255,255,.06)!important;border:1px solid rgba(255,255,255,.14)!important}
.av-livebig-s{color:#C7C3BA!important}
.av-panel-v2 .av-row.on{background:linear-gradient(90deg,rgba(248,163,30,.14),rgba(248,163,30,.03) 55%,transparent)!important;box-shadow:inset 3px 0 0 var(--exp-gold)!important}
.av-panel-v2 .av-preset:hover{background:var(--exp-gold)!important;color:var(--exp-black)!important;border-color:var(--exp-gold)!important}

/* ---- Quick links: gold background, black lettering (all left-side links) ---- */
.ph-ql .ql-item,.ph-ql .ql-home,.ph-ql .ql-item.ql-fixed,.ph-ql .ql-item.ql-company{
  background:var(--exp-grad)!important;border:none!important;color:var(--exp-black)!important;font-weight:800!important;
  box-shadow:0 8px 18px -12px rgba(248,163,30,.55)!important}
.ph-ql .ql-item:hover,.ph-ql .ql-item.ql-fixed:hover{
  filter:brightness(1.06)!important;
  background:var(--exp-grad)!important;border:none!important;
  box-shadow:0 10px 22px -12px rgba(248,163,30,.7)!important}
.ph-ql .ql-label,.ph-ql .ql-home-ic,.ph-ql .ql-ext,.ph-ql .ql-hint{color:var(--exp-black)!important}
.ph-ql .ql-dot{background:var(--exp-black)!important}
.ph-ql .ql-item.ql-fixed .ql-ext,.ph-ql .ql-item.ql-fixed .ql-label{color:var(--exp-black)!important}

/* availability "Set & view hours" button: blue -> gold */
.av-expand{border:1px solid rgba(248,163,30,.45)!important;background:rgba(248,163,30,.12)!important;color:#F3F2EF!important}
.av-expand:hover{background:rgba(248,163,30,.22)!important;border-color:rgba(248,163,30,.7)!important}
.av-expand-ch{color:var(--exp-gold2)!important}

/* =====================================================================
   Day toggle ON = gold · System-progress ring = YELLOW on dark face
   ===================================================================== */

/* day availability toggle: ON now reads gold (was dark/graphite) */
.av-toggle.on{background:var(--exp-grad)!important;border-color:transparent!important}
.av-toggle.on .kn{background:#fff!important}

/* "Hours set" live pill */
.av-livebig.set{background:linear-gradient(135deg,rgba(248,163,30,.28),rgba(248,163,30,.10))!important;border-color:rgba(248,163,30,.5)!important}
.av-livebig.set .av-livebig-dot{background:var(--exp-gold)!important}

/* system-progress ring: YELLOW arc on a dark face so it stands out on the black hero */
.ov2-ring{background:conic-gradient(#F8C21E calc(var(--p)*1%),rgba(255,255,255,.14) 0)!important;box-shadow:none!important}
.ov2-ring::before{background:#12100c!important;inset:7px!important}
.ov2-ring-v{color:#fff!important}
.td2-hero .ov2-ring,.ov2-hero .ov2-ring{background:conic-gradient(#F8C21E calc(var(--p)*1%),rgba(255,255,255,.14) 0)!important}
.td2-hero .ov2-ring::before,.ov2-hero .ov2-ring::before{background:#12100c!important}
.td2-hero .ov2-ring-v,.ov2-hero .ov2-ring-v{color:#fff!important}

/* =====================================================================
   MY VISION — active segmented controls & primary buttons go gold
   ===================================================================== */
.vz-nav-btn.active{background:var(--exp-grad)!important;color:var(--exp-black)!important;
  box-shadow:0 8px 18px -8px rgba(248,163,30,.55)!important}
.vz-nav-btn.active .vz-nav-ico,.vz-nav-btn.active *{color:var(--exp-black)!important;opacity:1}
.ds-mode.on{background:var(--exp-grad)!important;color:var(--exp-black)!important;border-color:transparent!important}
.ds-mode.on *{color:var(--exp-black)!important}
.dr-primary{background:var(--exp-grad)!important;color:var(--exp-black)!important;box-shadow:0 10px 22px -10px rgba(248,163,30,.6)!important}
.dr-primary:hover{filter:brightness(1.04)!important;transform:translateY(-1px)!important}
.dr-seg button.on{color:var(--exp-black)!important}
.vz-when{color:#B4801A!important}
/* "Stay in the game" motivation panel = black + gold (was navy) */
.dr-motiv{border:1px solid rgba(248,163,30,.3)!important}

/* =====================================================================
   PROMOTION GUIDELINES reference page
   ===================================================================== */
.pg-wrap{display:flex;flex-direction:column;gap:20px;max-width:1180px}
.pg-hero{position:relative;overflow:hidden;border-radius:20px;padding:30px 32px;color:#fff;
  background:radial-gradient(150% 200% at 88% -30%,rgba(248,163,30,.22),transparent 55%),linear-gradient(135deg,#151310 0%,#241f16 55%,#0c0a08 100%);
  box-shadow:0 26px 54px -30px rgba(0,0,0,.75)}
.pg-hero-glow{position:absolute;right:-60px;top:-80px;width:300px;height:300px;border-radius:50%;background:radial-gradient(circle,rgba(248,163,30,.32),transparent 60%);filter:blur(20px)}
.pg-hero-eyebrow{position:relative;font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:2.6px;text-transform:uppercase;color:var(--exp-gold2)}
.pg-hero-title{position:relative;font-family:var(--disp);font-size:40px;letter-spacing:1px;line-height:.98;margin:10px 0 0;color:#fff}
.pg-hero-sub{position:relative;font-size:14px;color:#D8D4CC;margin-top:12px;max-width:620px;line-height:1.5}

/* sticky jump nav */
.pg-nav{position:sticky;top:0;z-index:5;display:flex;gap:8px;flex-wrap:wrap;padding:10px 6px;background:rgba(243,243,241,.9);backdrop-filter:blur(8px);border-radius:12px}
.pg-navbtn{font-family:var(--sans);font-size:12px;font-weight:800;letter-spacing:.4px;padding:8px 15px;border-radius:999px;
  border:1px solid var(--line2);background:var(--panel);color:var(--exp-black);text-decoration:none;transition:all .14s}
.pg-navbtn:hover{border-color:transparent;background:var(--exp-grad);color:var(--exp-black);transform:translateY(-1px)}

.pg-sec{scroll-margin-top:64px}
.pg-sec-h{border-top:3px solid var(--exp-black);padding-top:11px;margin-bottom:14px}
.pg-eyebrow{font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--exp-gold)}
.pg-h{font-family:var(--disp);font-size:26px;letter-spacing:.6px;color:var(--exp-black);margin:4px 0 0}
.pg-sub{font-size:13px;color:var(--muted);margin:8px 0 0;line-height:1.55;max-width:820px}
.pg-subh{font-family:var(--disp);font-size:18px;letter-spacing:.5px;color:var(--exp-black);margin:20px 0 4px}
.pg-note{font-size:12.5px;color:var(--muted);margin-bottom:10px;line-height:1.5}

/* big picture */
.pg-biggrid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
@media(max-width:820px){.pg-biggrid{grid-template-columns:repeat(2,1fr)}}
.pg-bigcard{background:var(--panel);border:1px solid var(--line);border-top:4px solid var(--exp-gold);border-radius:14px;padding:16px 18px}
.pg-big-k{font-size:10.5px;font-weight:800;letter-spacing:.6px;text-transform:uppercase;color:var(--muted)}
.pg-big-v{font-family:var(--disp);font-size:26px;letter-spacing:.4px;color:var(--exp-black);margin-top:6px;line-height:1.05}
.pg-big-s{font-size:11.5px;color:var(--muted);margin-top:4px}
.pg-banner{margin-top:14px;background:var(--exp-grad);color:var(--exp-black);border-radius:14px;padding:16px 20px;font-size:13px;line-height:1.55}
.pg-banner b{font-family:var(--disp);font-size:17px;letter-spacing:.4px;display:block;margin-bottom:5px}

/* tables */
.pg-tablewrap{border:1px solid var(--line);border-radius:14px;overflow:hidden;background:var(--panel)}
.pg-table{width:100%;border-collapse:collapse;font-family:var(--sans);font-size:13px}
.pg-table thead th{background:var(--exp-black);color:#fff;text-align:left;padding:10px 14px;font-size:10.5px;text-transform:uppercase;letter-spacing:.5px}
.pg-table td{padding:11px 14px;border-bottom:1px solid var(--line);vertical-align:top;color:var(--text)}
.pg-table tr:last-child td{border-bottom:none}
.pg-table tr:nth-child(even) td{background:var(--panel2)}
.pg-c-code{font-family:var(--mono);font-weight:700;color:var(--exp-black);white-space:nowrap}
.pg-c-name{font-weight:700;color:var(--exp-black)}
.pg-c-pct{font-family:var(--disp);font-size:18px;color:var(--exp-gold);letter-spacing:.4px;white-space:nowrap}
.pg-c-note{color:var(--muted);font-size:12px;line-height:1.5}
.pg-plus{color:var(--exp-gold);font-weight:800}

/* overrides */
.pg-overrides{display:flex;flex-direction:column;gap:9px;background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:18px 20px}
.pg-ov-row{display:flex;align-items:center;gap:14px}
.pg-ov-gen{flex:none;width:66px;font-family:var(--mono);font-weight:700;font-size:12px;color:var(--exp-black)}
.pg-ov-bar{flex:1;height:12px;border-radius:8px;background:var(--panel3);overflow:hidden}
.pg-ov-bar i{display:block;height:100%;border-radius:8px;background:var(--exp-grad)}
.pg-ov-pct{flex:none;width:52px;text-align:right;font-family:var(--disp);font-size:18px;color:var(--exp-black)}

/* bonus cards */
.pg-cards3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:6px}
@media(max-width:820px){.pg-cards3{grid-template-columns:1fr}}
.pg-card{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:16px 18px}
.pg-card-gold{border-color:rgba(248,163,30,.5);background:linear-gradient(180deg,rgba(248,163,30,.08),var(--panel))}
.pg-card-t{font-size:10.5px;font-weight:800;letter-spacing:.6px;text-transform:uppercase;color:var(--exp-gold)}
.pg-card-big{font-family:var(--disp);font-size:32px;letter-spacing:.5px;color:var(--exp-black);margin:6px 0 2px;line-height:1}
.pg-card-big span{font-family:var(--sans);font-size:12px;font-weight:600;color:var(--muted);letter-spacing:0}
.pg-card-x{font-size:12.5px;color:var(--text);font-weight:600}
.pg-card-r{font-size:11.5px;color:var(--muted);margin-top:7px;line-height:1.5;border-top:1px dashed var(--line2);padding-top:7px}

/* advancement cards */
.pg-advgrid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:900px){.pg-advgrid{grid-template-columns:1fr}}
.pg-adv{background:var(--panel);border:1px solid var(--line);border-radius:14px;overflow:hidden}
.pg-adv-h{display:flex;align-items:center;gap:13px;padding:13px 16px;background:linear-gradient(135deg,#151310,#0c0a08)}
.pg-adv-code{flex:none;width:46px;height:46px;border-radius:11px;display:grid;place-items:center;font-family:var(--disp);font-size:14px;color:var(--exp-black);background:var(--exp-grad)}
.pg-adv-name{font-weight:800;color:#fff;font-size:14.5px}
.pg-adv-pct{font-family:var(--disp);font-size:16px;color:var(--exp-gold2);letter-spacing:.4px}
.pg-adv-b{display:grid;grid-template-columns:1fr 1fr;gap:0}
@media(max-width:520px){.pg-adv-b{grid-template-columns:1fr}}
.pg-adv-col{padding:13px 16px}
.pg-adv-col:first-child{border-right:1px solid var(--line)}
.pg-adv-l{font-size:9.5px;font-weight:800;letter-spacing:.8px;text-transform:uppercase;color:var(--exp-gold);margin-bottom:7px}
.pg-adv-col ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:7px}
.pg-adv-col li{position:relative;padding-left:16px;font-size:12.5px;color:var(--text);line-height:1.5}
.pg-adv-col li::before{content:"";position:absolute;left:0;top:7px;width:6px;height:6px;border-radius:50%;background:var(--exp-gold)}

/* rings */
.pg-rings{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}
@media(max-width:900px){.pg-rings{grid-template-columns:repeat(2,1fr)}}
.pg-ring{display:flex;align-items:center;gap:12px;background:var(--panel);border:1px solid var(--line);border-radius:13px;padding:13px 15px}
.pg-ring-ic{flex:none;font-size:24px;color:var(--exp-gold);filter:drop-shadow(0 2px 5px rgba(248,163,30,.4))}
.pg-ring-v{font-family:var(--disp);font-size:19px;letter-spacing:.4px;color:var(--exp-black);line-height:1}
.pg-ring-n{font-size:11px;font-weight:700;color:var(--muted);margin-top:3px}

/* legacy */
.pg-legs{display:flex;flex-direction:column;gap:10px}
.pg-leg{display:flex;gap:16px;align-items:flex-start;background:var(--panel);border:1px solid var(--line);border-left:4px solid var(--exp-gold);border-radius:13px;padding:15px 18px}
.pg-leg-tier{flex:none;width:120px;font-family:var(--disp);font-size:19px;letter-spacing:.4px;color:var(--exp-black)}
.pg-leg-tx{font-size:13px;color:var(--text);line-height:1.55}

.pg-foot{font-size:11px;color:var(--muted2);line-height:1.6;border-top:1px solid var(--line);padding-top:14px}

/* =====================================================================
   ONBOARDING tab (Agent Activation Roadmap) — black/gold theme
   ===================================================================== */
.ob-hero{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}
.ob-hero-l{min-width:0}
.ob-two,.ob-partner{grid-template-columns:1fr 1fr!important}
@media(max-width:820px){.ob-two,.ob-partner{grid-template-columns:1fr!important}}
.ob-card-h{font-family:var(--disp);font-size:19px;letter-spacing:.4px;color:var(--exp-black);margin:6px 0 6px}
.ob-card-p{font-size:12.5px;color:var(--muted);line-height:1.55;margin:0}

/* tracker tools */
.ob-tools-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
@media(max-width:760px){.ob-tools-grid{grid-template-columns:1fr}}
.ob-tool{display:flex;align-items:center;gap:14px;text-align:left;width:100%;cursor:pointer;
  background:linear-gradient(135deg,#151310,#0c0a08);border:1px solid rgba(248,163,30,.35);border-radius:14px;padding:15px 17px;transition:all .16s}
.ob-tool:hover{border-color:var(--exp-gold);transform:translateY(-2px);box-shadow:0 16px 30px -18px rgba(248,163,30,.5)}
.ob-tool-ic{flex:none;width:42px;height:42px;border-radius:11px;display:grid;place-items:center;font-size:18px;color:var(--exp-black);background:var(--exp-grad)}
.ob-tool-t{font-family:var(--disp);font-size:17px;letter-spacing:.4px;color:#fff}
.ob-tool-s{font-size:12px;color:#B7B4AD;margin-top:3px;line-height:1.45}
.ob-tool-go{margin-left:auto;flex:none;font-size:12px;font-weight:800;color:var(--exp-gold2);white-space:nowrap}

/* phases */
.ob-phases{display:flex;flex-direction:column;gap:14px}
.ob-phase{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:18px 20px;box-shadow:0 14px 30px -26px rgba(18,16,14,.5)}
.ob-phase-h{display:flex;align-items:center;gap:14px}
.ob-phase-n{flex:none;width:44px;height:44px;border-radius:12px;display:grid;place-items:center;font-family:var(--disp);font-size:20px;color:var(--exp-black);background:var(--exp-grad)}
.ob-phase-title{font-family:var(--disp);font-size:20px;letter-spacing:.5px;color:var(--exp-black);line-height:1}
.ob-phase-meta{font-size:10.5px;font-weight:800;letter-spacing:.8px;text-transform:uppercase;color:var(--exp-gold);margin-top:4px}
.ob-phase-desc{font-size:13px;color:var(--muted);line-height:1.6;margin:12px 0 12px}
.ob-tasks{display:flex;flex-direction:column;gap:8px}

/* checkable task row (shared look with plan pages) */
.ob-task{display:flex;align-items:flex-start;gap:12px;width:100%;text-align:left;padding:11px 13px;border-radius:11px;
  border:1px solid var(--line);background:var(--panel);cursor:pointer;transition:all .15s}
.ob-task:hover{border-color:var(--exp-gold);background:rgba(248,163,30,.04)}
.ob-check{flex:none;width:22px;height:22px;border-radius:7px;border:2px solid var(--line2);display:grid;place-items:center;
  font-size:13px;font-weight:900;color:#fff;margin-top:1px;transition:all .15s}
.ob-task.done{border-color:rgba(248,163,30,.5);background:rgba(248,163,30,.08)}
.ob-task.done .ob-check{background:var(--exp-grad);border-color:transparent;color:var(--exp-black)}
.ob-task-t{font-size:13px;color:var(--text);line-height:1.5}
.ob-task-t b{color:var(--exp-black);font-weight:800}
.ob-task.done .ob-task-t{color:var(--muted)}
.ob-task.done .ob-task-t b{color:var(--muted)}

/* 30-day checklist grid */
.ob-checklist{display:grid;grid-template-columns:1fr 1fr;gap:9px}
@media(max-width:720px){.ob-checklist{grid-template-columns:1fr}}

/* partnership lists */
.ob-ul{list-style:none;margin:8px 0 0;padding:0;display:flex;flex-direction:column;gap:9px}
.ob-ul li{position:relative;padding-left:22px;font-size:13px;color:var(--text);line-height:1.5}
.ob-ul li::before{content:"";position:absolute;left:2px;top:6px;width:9px;height:9px;border-radius:50%;background:var(--exp-grad)}

/* CTA */
.ob-cta{border-radius:18px;padding:26px 28px;color:#fff;text-align:center;
  background:radial-gradient(150% 200% at 50% -30%,rgba(248,163,30,.2),transparent 55%),linear-gradient(135deg,#151310,#0c0a08);
  border:1px solid rgba(248,163,30,.35)}
.ob-cta-t{font-family:var(--disp);font-size:26px;letter-spacing:.6px;color:#fff}
.ob-cta-p{font-size:13.5px;color:#D8D4CC;line-height:1.6;max-width:640px;margin:10px auto 14px}
.ob-cta-sig{font-size:12px;font-weight:700;color:var(--exp-gold2);letter-spacing:.3px}

/* =====================================================================
   SIDEBAR: one scroll region for quick links + team roster
   (brand & user chip stay fixed at top; Settings stays fixed at bottom)
   ===================================================================== */
.sidebar-scroll{flex:1 1 0;min-height:0;overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column}
/* the roster no longer scrolls on its own — the whole region does */
.agent-roster-ui{flex:1 0 auto!important;min-height:0!important;overflow:visible!important}
.roster{flex:0 0 auto!important;overflow:visible!important}
/* thin, on-brand scrollbar for the region */
.sidebar-scroll{scrollbar-width:thin;scrollbar-color:rgba(248,163,30,.35) transparent}
.sidebar-scroll::-webkit-scrollbar{width:8px}
.sidebar-scroll::-webkit-scrollbar-track{background:transparent}
.sidebar-scroll::-webkit-scrollbar-thumb{background:rgba(248,163,30,.28);border-radius:8px}
.sidebar-scroll::-webkit-scrollbar-thumb:hover{background:rgba(248,163,30,.5)}

/* Dashboard link = distinct from the gold external links (internal nav, outlined) */
.ph-ql .ql-home{background:rgba(255,255,255,.05)!important;border:1px solid rgba(248,163,30,.55)!important;
  color:var(--exp-gold2)!important;box-shadow:none!important;font-weight:800!important}
.ph-ql .ql-home:hover{background:rgba(248,163,30,.16)!important;border-color:var(--exp-gold)!important}
.ph-ql .ql-home .ql-label,.ph-ql .ql-home .ql-home-ic{color:var(--exp-gold2)!important}

/* =====================================================================
   SYSTEM TAB — onboarding milestone scoreboard (mirrors Onboarding tab)
   ===================================================================== */
.sys-overall-foot{display:flex;align-items:center;gap:12px;margin-top:12px;
  font-size:13.5px;color:#C7C3BA}
.sys-overall-foot b{color:var(--exp-gold2);font-size:18px;font-weight:800;letter-spacing:.3px}
.sys-overall-foot .sys-go-ob{margin-left:auto}
.btn-ghost.sys-go-ob{color:var(--exp-gold2)!important;border-color:rgba(248,163,30,.5)!important}

/* milestone grid */
.ms-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px}
.ms-card{display:flex;align-items:center;gap:13px;text-align:left;width:100%;
  padding:14px 15px;border-radius:14px;cursor:pointer;font-family:inherit;
  background:linear-gradient(150deg,#201c15 0%,#171308 60%,#0d0b07 100%);
  border:1px solid rgba(248,163,30,.22);
  box-shadow:0 10px 24px -16px rgba(0,0,0,.8);
  transition:border-color .18s,box-shadow .25s,filter .18s}
.ms-card:hover{border-color:rgba(248,163,30,.6);
  box-shadow:0 16px 30px -16px rgba(0,0,0,.9),0 0 20px -8px rgba(248,163,30,.4)}
.ms-badge{flex:none;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;
  font-family:'JetBrains Mono',monospace;font-weight:700;font-size:15px;
  color:var(--exp-gold2);background:rgba(248,163,30,.12);border:1.5px solid rgba(248,163,30,.4)}
.ms-tx{flex:1;min-width:0}
.ms-title{font-size:14px;font-weight:700;color:#F3F2EF;line-height:1.25;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ms-meta{font-size:11.5px;color:#A8A49B;margin:3px 0 7px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ms-bar{height:5px;border-radius:5px;background:rgba(255,255,255,.09);overflow:hidden}
.ms-bar i{display:block;height:100%;border-radius:5px;background:var(--exp-grad);transition:width .4s ease}
.ms-pct{flex:none;font-family:'JetBrains Mono',monospace;font-size:13px;font-weight:600;
  color:#C7C3BA;min-width:38px;text-align:right}
/* in-progress */
.ms-card.active{border-color:rgba(248,163,30,.45)}
.ms-card.active .ms-badge{background:rgba(248,163,30,.2)}
/* completed milestone = solid gold */
.ms-card.done{border-color:transparent;
  background:linear-gradient(150deg,rgba(248,163,30,.22),rgba(248,163,30,.06) 60%,transparent),
    linear-gradient(150deg,#221b0e,#171308)}
.ms-card.done .ms-badge{background:var(--exp-grad);border-color:transparent;color:var(--exp-black)}
.ms-card.done .ms-pct{color:var(--exp-gold2)}
.ms-card.done .ms-title{color:#FCEBC0}

/* =====================================================================
   Onboarding step tiles (System tab breakdown) — premium & consistent
   Fixes: text was vertically-centred in stretched cells (floaty gaps),
   and the "done" state was green. Now: equal-height cards, top-aligned
   content, gold check state on-theme.
   ===================================================================== */
.phase-body .checks{grid-template-columns:repeat(auto-fill,minmax(248px,1fr));gap:11px}
.phase-body .check{
  align-items:flex-start; gap:11px; padding:14px 15px; min-height:64px;
  border-radius:13px;
  background:linear-gradient(180deg,#FFFFFF 0%,#FBF8F1 100%);
  border:1px solid #E7E2D4;
  box-shadow:0 1px 2px rgba(30,22,6,.04), 0 12px 24px -20px rgba(120,90,25,.35);
  transition:border-color .16s, box-shadow .24s, background .16s, transform .12s;
}
.phase-body .check:hover{
  border-color:rgba(248,163,30,.6);
  background:linear-gradient(180deg,#FFFFFF 0%,#FDF6E6 100%);
  box-shadow:0 2px 5px rgba(30,22,6,.05), 0 16px 28px -18px rgba(200,140,30,.45);
}
.phase-body .check .box{
  width:20px; height:20px; margin-top:1px; border-radius:6px;
  border:1.5px solid #CBBD9B; background:#fff;
  box-shadow:inset 0 1px 2px rgba(30,22,6,.05);
  transition:background .16s, border-color .16s, box-shadow .16s;
}
.phase-body .check .box svg{width:12px; height:12px; stroke-width:3.2}
.phase-body .check .lab{font-size:13.5px; line-height:1.5; color:#2B2822; font-weight:500}
.phase-body .check .lab b{color:#1c1a15; font-weight:700}
/* completed step = gold, on-theme (was green) */
.phase-body .check.on{
  background:linear-gradient(180deg, rgba(248,163,30,.15) 0%, rgba(248,163,30,.05) 100%);
  border-color:rgba(248,163,30,.6);
}
.phase-body .check.on .box{
  background:var(--exp-grad); border-color:transparent;
  box-shadow:0 2px 9px -2px rgba(248,163,30,.75);
}
.phase-body .check.on .box svg{stroke:#241803; opacity:1}
.phase-body .check.on .lab{color:#5E4A1C}
.phase-body .check.on .lab b{color:#4a3a14}

/* phase container: a touch softer / more premium */
.phase{border-radius:16px}
.phase-h{padding:15px 18px}
.phase-body{padding:4px 18px 18px}
.phase-body .group{padding:8px 0 2px;border-bottom:none}

/* System-tab progress bars → gold (match the milestone cards, not flat black) */
.sys-overall .pbar-fill, .phase .pbar .pbar-fill{background:var(--exp-grad)!important}
.sys-overall .pbar-wide, .phase .pbar-narrow{background:rgba(248,163,30,.14)!important}

/* =====================================================================
   Custom (admin-added) sidebar links = SILVER — visually distinct from
   the GOLD PropHog member links, so the two groups read differently.
   ===================================================================== */
.ph-ql .ql-item.ql-company{
  background:linear-gradient(135deg,#EEEFF2 0%,#CBCFD7 55%,#AFB4BF 100%)!important;
  border:none!important;
  box-shadow:0 8px 18px -12px rgba(64,70,86,.55)!important;
}
.ph-ql .ql-item.ql-company:hover{
  filter:brightness(1.04)!important;
  box-shadow:0 11px 22px -12px rgba(64,70,86,.72)!important;
}
.ph-ql .ql-item.ql-company .ql-label,
.ph-ql .ql-item.ql-company .ql-ext{color:#15161A!important}
.ph-ql .ql-item.ql-company .ql-dot{background:#15161A!important}

/* =====================================================================
   Onboarding · Kaplan Total Access CE — in-app expanding guide
   ===================================================================== */
/* clickable resource cards (Kaplan expander + Drive link) */
.kap-card,.kap-linkcard{cursor:pointer;text-decoration:none;color:inherit;display:block;
  transition:border-color .16s,box-shadow .22s,transform .12s,background .16s;position:relative}
.kap-card:hover,.kap-linkcard:hover{border-color:rgba(248,163,30,.6)!important;
  box-shadow:0 14px 30px -18px rgba(200,140,30,.5);transform:translateY(-2px)}
.kap-card:focus-visible{outline:2px solid var(--exp-gold);outline-offset:2px}
.kap-open-hint{display:inline-block;margin-top:10px;font-family:var(--mono);font-size:11px;
  font-weight:700;letter-spacing:.4px;color:#8A6A1E;text-transform:uppercase}
.kap-card.is-open{border-color:rgba(248,163,30,.7)!important;
  background:linear-gradient(180deg,rgba(248,163,30,.08),var(--panel))}

/* the expanding guide container */
.kap-guide{max-height:0;overflow:hidden;opacity:0;margin-top:0;
  transition:max-height .6s cubic-bezier(.2,.7,.2,1),opacity .45s ease,margin-top .4s ease}
.kap-guide.open{max-height:6000px;opacity:1;margin-top:16px}
.kap-inner{border:1px solid var(--line);border-radius:18px;overflow:hidden;
  box-shadow:0 1px 2px rgba(18,16,14,.05),0 26px 60px -34px rgba(18,16,14,.4);background:var(--panel)}

/* dark hero band */
.kap-hero{position:relative;padding:30px 30px 28px;overflow:hidden;
  background:radial-gradient(120% 130% at 12% -20%,rgba(248,163,30,.28),transparent 55%),
    linear-gradient(140deg,#1b160d 0%,#141009 55%,#0b0906 100%)}
.kap-badge{display:inline-block;font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:2px;
  text-transform:uppercase;color:#08110b;background:var(--exp-grad);padding:5px 11px;border-radius:100px}
.kap-h{font-family:var(--disp);font-size:clamp(26px,3vw,34px);letter-spacing:1px;color:#FBF3E2;margin:14px 0 0;line-height:1}
.kap-lead{font-size:14px;line-height:1.6;color:#CFC7B6;margin:12px 0 0;max-width:70ch}
.kap-lead b{color:#FCE8B8;font-weight:700}
.kap-cta{display:inline-flex;align-items:center;gap:8px;margin-top:18px;padding:13px 22px;border-radius:12px;
  font-weight:800;font-size:13.5px;letter-spacing:.4px;color:var(--exp-black);background:var(--exp-grad);
  text-decoration:none;box-shadow:0 12px 26px -12px rgba(248,163,30,.75);transition:transform .12s,box-shadow .2s,filter .15s}
.kap-cta:hover{transform:translateY(-1px);filter:brightness(1.04);box-shadow:0 16px 32px -12px rgba(248,163,30,.9)}

/* highlight tiles */
.kap-hls{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;padding:20px 24px 4px}
@media(max-width:760px){.kap-hls{grid-template-columns:1fr}}
.kap-hl{background:var(--panel);border:1px solid var(--line2);border-top:3px solid var(--exp-gold);
  border-radius:12px;padding:15px 16px 16px}
.kap-hl b{display:block;font-family:var(--disp);font-size:22px;letter-spacing:.5px;color:var(--exp-black)}
.kap-hl span{display:block;font-size:12.5px;color:#4a473f;line-height:1.5;margin-top:5px}

/* step parts */
.kap-part{padding:20px 24px 4px}
.kap-part+.kap-part{border-top:1px solid var(--line)}
.kap-part-h{display:flex;align-items:center;gap:13px;margin-bottom:12px}
.kap-n{flex:none;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;
  font-family:var(--disp);font-size:18px;color:var(--exp-black);background:var(--exp-grad);
  box-shadow:0 6px 14px -6px rgba(248,163,30,.7)}
.kap-part-t{font-family:var(--disp);font-size:20px;letter-spacing:.5px;color:var(--exp-black);line-height:1}
.kap-part-s{font-family:var(--mono);font-size:10.5px;letter-spacing:1px;text-transform:uppercase;color:var(--muted);margin-top:3px}
.kap-steps{list-style:none;counter-reset:kap;margin:0 0 6px;padding:0;display:flex;flex-direction:column;gap:10px}
.kap-steps li{counter-increment:kap;position:relative;padding:11px 14px 11px 42px;border:1px solid var(--line);
  border-radius:11px;background:var(--panel2);font-size:13.5px;line-height:1.55;color:var(--text)}
.kap-steps li::before{content:counter(kap);position:absolute;left:12px;top:11px;width:20px;height:20px;
  border-radius:6px;display:grid;place-items:center;font-family:var(--mono);font-size:11px;font-weight:700;
  color:#141109;background:rgba(248,163,30,.2);border:1px solid rgba(248,163,30,.45)}
.kap-steps li b{color:var(--exp-black);font-weight:700}
.kap-steps a{color:#8A6A1E;font-weight:700;text-decoration:underline;text-underline-offset:2px;word-break:break-word}

/* callout tips */
.kap-tip{display:flex;gap:11px;align-items:flex-start;margin:2px 0 16px;padding:12px 14px;border-radius:11px;
  background:rgba(248,163,30,.09);border:1px solid rgba(248,163,30,.3);font-size:13px;line-height:1.55;color:var(--text)}
.kap-tip b{color:var(--exp-black);font-weight:700}
.kap-tip-ic{flex:none;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;font-size:12px;font-weight:800;
  color:var(--exp-black);background:var(--exp-grad)}
.kap-tip-warn{background:rgba(217,90,60,.09);border-color:rgba(217,90,60,.35)}
.kap-tip-warn .kap-tip-ic{background:linear-gradient(135deg,#E07A4A,#C8452F);color:#fff}

/* footer */
.kap-foot{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;
  padding:18px 24px 24px;border-top:1px solid var(--line);
  background:linear-gradient(180deg,var(--panel),rgba(248,163,30,.05))}
.kap-foot-t{font-family:var(--disp);font-size:20px;letter-spacing:.5px;color:var(--exp-black)}
.kap-cta-sm{margin-top:0;padding:11px 18px;font-size:12.5px}
@media(prefers-reduced-motion:reduce){.kap-guide{transition:opacity .2s ease}}

/* ============================================================
   Google Calendar (read/write) — lives in the availability area
   Pledge Experior black/gold theme. Accent uses --exp-gold (#F8A31E).
   ============================================================ */
.kwcal-card{margin-top:14px;padding:0;overflow:hidden}
.kwcal-head{padding:16px 18px 14px;border-bottom:1px solid var(--line);
  background:linear-gradient(180deg,rgba(248,163,30,.06),transparent)}
.kwcal-head-l{display:flex;flex-direction:column;gap:2px}
.kwcal-title{font-family:var(--disp);font-size:22px;letter-spacing:.5px;color:var(--exp-gold)}
.kwcal-head-s{font-size:12.5px;color:var(--muted);margin-top:6px;line-height:1.5;max-width:70ch}
.kwcal-host{padding:14px 16px 16px}

.gcal-loading{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:14px;padding:26px 4px}
.gcal-spin{width:18px;height:18px;border:2.5px solid rgba(248,163,30,.25);border-top-color:var(--exp-gold);border-radius:50%;animation:rot .7s linear infinite;display:inline-block}
@keyframes rot{to{transform:rotate(360deg)}}

.gcal-connect{max-width:560px;margin:8px auto;text-align:center;padding:26px 24px}
.gcal-connect-ic{width:52px;height:52px;margin:0 auto 12px;color:var(--exp-gold)}
.gcal-connect-ic svg{width:100%;height:100%}
.gcal-connect-t{font-family:var(--disp);font-size:24px;letter-spacing:.5px;color:var(--exp-gold)}
.gcal-connect-p{font-size:13.5px;line-height:1.6;color:var(--muted);margin:9px auto 16px;max-width:52ch}
.gcal-connect-p b{color:var(--text)}
.gcal-note{font-size:12.5px;color:#8A6A1E;background:rgba(248,163,30,.09);border:1px solid rgba(248,163,30,.3);border-radius:9px;padding:8px 12px;margin:0 auto 14px;max-width:44ch}
.gcal-fine{font-size:11.5px;color:var(--muted2);margin-top:12px}
.gcal-btn{font-family:inherit;font-weight:800;font-size:13.5px;letter-spacing:.3px;color:#080707;background:var(--exp-gold);border:none;border-radius:11px;padding:11px 18px;cursor:pointer;transition:transform .1s,filter .14s}
.gcal-btn:hover{transform:translateY(-1px);filter:brightness(1.05)}
.gcal-btn-g{display:inline-flex;align-items:center;gap:10px;background:#fff;color:#3c4043;border:1px solid var(--line2)}
.gcal-btn-g:hover{background:#fbfbfd;border-color:var(--exp-gold)}

.gcal-bar{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;margin:2px 2px 14px}
.gcal-bar-l{display:flex;align-items:center;gap:8px}
.gcal-nav{width:32px;height:32px;border-radius:9px;border:1px solid var(--line2);background:var(--panel);color:var(--muted);cursor:pointer;font-size:17px;line-height:1;transition:border-color .14s,color .14s,background .14s}
.gcal-nav:hover{border-color:var(--exp-gold);color:var(--exp-gold);background:rgba(248,163,30,.06)}
.gcal-today{border:1px solid var(--line2);background:var(--panel);color:var(--text);font-weight:700;font-size:12.5px;font-family:inherit;border-radius:9px;padding:7px 13px;cursor:pointer;transition:border-color .14s,color .14s}
.gcal-today:hover{border-color:var(--exp-gold);color:var(--exp-gold)}
.gcal-range{font-family:var(--disp);font-size:19px;letter-spacing:.5px;color:var(--exp-gold);margin-left:6px}
.gcal-bar-r{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.gcal-add{display:inline-flex;align-items:center;gap:7px;font-family:inherit;font-weight:800;font-size:12.5px;letter-spacing:.2px;color:#fff;background:linear-gradient(180deg,#F8D80A,#F8A31E);border:none;border-radius:10px;padding:8px 14px;cursor:pointer;box-shadow:0 8px 18px -10px rgba(248,163,30,.8);transition:transform .1s,filter .14s}
.gcal-add:hover{transform:translateY(-1px);filter:brightness(1.05)}
.gcal-acct{display:inline-flex;align-items:center;gap:7px;font-size:12px;color:var(--muted);font-weight:600}
.gcal-dot{width:8px;height:8px;border-radius:50%;background:var(--ok);box-shadow:0 0 6px rgba(31,168,90,.6)}
.gcal-mini{border:1px solid var(--line2);background:var(--panel);color:var(--muted);font-family:inherit;font-size:12px;border-radius:8px;padding:6px 10px;cursor:pointer;transition:border-color .14s,color .14s}
.gcal-mini:hover{border-color:var(--exp-gold);color:var(--exp-gold)}

.gcal-week{display:grid;grid-template-columns:repeat(7,1fr);gap:8px}
@media(max-width:900px){.gcal-week{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.gcal-week{grid-template-columns:1fr}}
.gcal-col{background:var(--panel2);border:1px solid var(--line);border-radius:12px;overflow:hidden;min-height:120px;display:flex;flex-direction:column}
.gcal-col.is-today{border-color:rgba(248,163,30,.6);box-shadow:0 0 0 1px rgba(248,163,30,.35) inset}
.gcal-col-h{display:flex;align-items:baseline;justify-content:space-between;padding:10px 12px 8px;border-bottom:1px solid var(--line)}
.gcal-col.is-today .gcal-col-h{background:linear-gradient(180deg,rgba(248,163,30,.12),transparent)}
.gcal-dow{font-family:var(--mono);font-size:10.5px;font-weight:700;letter-spacing:1.4px;text-transform:uppercase;color:var(--muted)}
.gcal-dnum{font-family:var(--disp);font-size:20px;letter-spacing:.5px;color:var(--exp-gold)}
.gcal-col.is-today .gcal-dnum{color:var(--exp-gold)}
.gcal-col-b{padding:8px;display:flex;flex-direction:column;gap:7px;flex:1}
.gcal-ev{position:relative;cursor:pointer;display:block;text-decoration:none;background:var(--panel);border:1px solid var(--line);border-left:3px solid var(--exp-gold);border-radius:8px;padding:8px 10px;transition:border-color .14s,box-shadow .18s,transform .1s}
.gcal-ev:hover{border-color:var(--exp-gold);box-shadow:0 8px 18px -12px rgba(248,163,30,.5);transform:translateY(-1px)}
.gcal-ev:focus-visible{outline:2px solid var(--exp-gold);outline-offset:2px}
.gcal-ev.allday{border-left-color:var(--ok);background:rgba(31,168,90,.06)}
.gcal-ev-time{display:block;font-family:var(--mono);font-size:10.5px;font-weight:700;letter-spacing:.4px;color:#8A6A1E}
.gcal-ev.allday .gcal-ev-time{color:#17794f}
.gcal-ev-title{display:block;font-size:12.5px;font-weight:600;color:var(--text);line-height:1.35;margin-top:2px}
.gcal-ev-where{display:block;font-size:11px;color:var(--muted);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gcal-ev-open{position:absolute;top:6px;right:7px;font-size:12px;line-height:1;color:var(--muted2);text-decoration:none;opacity:0;transition:opacity .14s,color .14s}
.gcal-ev:hover .gcal-ev-open{opacity:1}
.gcal-ev-open:hover{color:var(--exp-gold)}
.gcal-none{color:var(--muted2);font-size:12px;text-align:center;padding:10px 0}
.gcal-none-add{width:100%;background:transparent;border:1px dashed var(--line2);border-radius:8px;cursor:pointer;color:var(--muted);font-family:inherit;font-weight:700;padding:8px 0;transition:border-color .14s,color .14s,background .14s}
.gcal-none-add:hover{border-color:var(--exp-gold);color:var(--exp-gold);background:rgba(248,163,30,.06)}
.gcal-foot{margin-top:12px;font-size:11.5px;color:var(--muted2)}

/* editor dialog */
.gcal-ov{position:fixed;inset:0;z-index:1200;display:none;align-items:flex-start;justify-content:center;background:rgba(6,14,32,.6);backdrop-filter:blur(2px);padding:6vh 16px 16px;overflow-y:auto}
.gcal-ov.open{display:flex}
.gcal-dlg{width:100%;max-width:470px;background:var(--panel);border:1px solid var(--line2);border-radius:16px;box-shadow:0 30px 70px -30px rgba(6,16,40,.7);overflow:hidden;animation:gcalPop .18s ease}
@keyframes gcalPop{from{opacity:0;transform:translateY(-8px) scale(.98)}to{opacity:1;transform:none}}
.gcal-dlg-h{display:flex;align-items:center;justify-content:space-between;padding:16px 18px;border-bottom:1px solid var(--line);background:linear-gradient(180deg,rgba(248,163,30,.08),transparent)}
.gcal-dlg-t{font-family:var(--disp);font-size:20px;letter-spacing:.4px;color:var(--exp-gold)}
.gcal-x{border:none;background:transparent;color:var(--muted);font-size:15px;cursor:pointer;padding:4px 8px;border-radius:7px;transition:background .14s,color .14s}
.gcal-x:hover{background:rgba(0,0,0,.05);color:var(--text)}
.gcal-dlg-b{padding:16px 18px;display:flex;flex-direction:column;gap:13px}
.gcal-err{background:rgba(217,59,54,.08);border:1px solid rgba(217,59,54,.35);color:#a5322e;font-size:12.5px;border-radius:9px;padding:9px 12px}
.gcal-f{display:flex;flex-direction:column;gap:6px}
.gcal-f label{font-size:11.5px;font-weight:700;letter-spacing:.3px;text-transform:uppercase;color:var(--muted)}
.gcal-opt{text-transform:none;letter-spacing:0;font-weight:500;color:var(--muted2)}
.gcal-f input,.gcal-f textarea{font-family:inherit;font-size:13.5px;color:var(--text);background:var(--panel2);border:1px solid var(--line2);border-radius:9px;padding:9px 11px;transition:border-color .14s,box-shadow .14s}
.gcal-f input:focus,.gcal-f textarea:focus{outline:none;border-color:var(--exp-gold);box-shadow:0 0 0 3px rgba(248,163,30,.16)}
.gcal-f textarea{resize:vertical;min-height:60px}
.gcal-allday{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:var(--text);cursor:pointer;user-select:none}
.gcal-allday input{width:16px;height:16px;accent-color:var(--exp-gold)}
.gcal-row{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:10px}
@media(max-width:460px){.gcal-row{grid-template-columns:1fr 1fr}.gcal-row .gcal-f:first-child{grid-column:1/-1}}
.gcal-dlg-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 18px;border-top:1px solid var(--line);background:var(--panel2)}
.gcal-foot-r{display:flex;align-items:center;gap:9px;margin-left:auto}
.gcal-save{font-family:inherit;font-weight:800;font-size:13px;color:#fff;background:linear-gradient(180deg,#F8D80A,#F8A31E);border:none;border-radius:9px;padding:9px 18px;cursor:pointer;box-shadow:0 8px 18px -10px rgba(248,163,30,.8);transition:transform .1s,filter .14s}
.gcal-save:hover{transform:translateY(-1px);filter:brightness(1.05)}
.gcal-save:disabled{opacity:.6;cursor:default;transform:none}
.gcal-cancel{font-family:inherit;font-weight:700;font-size:13px;color:var(--muted);background:transparent;border:1px solid var(--line2);border-radius:9px;padding:9px 15px;cursor:pointer;transition:border-color .14s,color .14s}
.gcal-cancel:hover{border-color:var(--muted);color:var(--text)}
.gcal-del{font-family:inherit;font-weight:700;font-size:12.5px;color:#a5322e;background:transparent;border:1px solid rgba(217,59,54,.35);border-radius:9px;padding:9px 14px;cursor:pointer;transition:background .14s,border-color .14s}
.gcal-del:hover,.gcal-del.armed{background:rgba(217,59,54,.1);border-color:rgba(217,59,54,.6)}
.gcal-del:disabled{opacity:.6;cursor:default}

/* ============================================================
   Google Calendar (server-backed) — inline status card + full modal
   Pledge Experior black/gold. Accent --exp-gold #F8A31E.
   ============================================================ */
/* inline status card (inside the availability panel) */
.kwc-inline-loading{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:13px;padding:14px 2px}
.kwc-inline{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:4px 2px}
.kwc-inline-connect{flex-direction:column;align-items:stretch;gap:14px;text-align:left}
.kwc-inline-l{display:flex;align-items:flex-start;gap:12px;min-width:0}
.kwc-inline-r{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.kwc-inline-t{font-size:14px;font-weight:700;color:var(--text)}
.kwc-inline-s{font-size:12.5px;color:var(--muted);margin-top:3px;line-height:1.5;max-width:62ch}
.kwc-inline-msg{font-size:13px;color:var(--muted)}
.kwc-warn{color:#a5322e}
.kwc-dot{width:9px;height:9px;border-radius:50%;flex:none;margin-top:5px}
.kwc-dot.ok{background:var(--ok);box-shadow:0 0 7px rgba(31,168,90,.6)}
.kwc-dot.off{background:var(--muted2)}
.kwc-connect-ic{width:40px;height:40px;flex:none;color:var(--exp-gold);border-radius:11px;display:grid;place-items:center;
  background:linear-gradient(150deg,rgba(248,163,30,.14),rgba(248,163,30,.04));border:1px solid rgba(248,163,30,.28)}
.kwc-connect-ic svg{width:22px;height:22px}
.kwc-btn{display:inline-flex;align-items:center;gap:8px;font-family:inherit;font-weight:700;font-size:13px;cursor:pointer;
  border-radius:10px;padding:9px 15px;border:1px solid var(--line2);background:var(--panel);color:var(--text);transition:border-color .14s,color .14s,transform .1s,filter .14s}
.kwc-btn:hover{border-color:var(--exp-gold);color:var(--exp-gold);transform:translateY(-1px)}
.kwc-btn-primary{background:linear-gradient(180deg,#F8D80A,#F8A31E);border:none;color:#080707;box-shadow:0 8px 18px -10px rgba(248,163,30,.8)}
.kwc-btn-primary:hover{color:#080707;filter:brightness(1.05)}
.kwc-btn-primary svg{color:#080707}
.kwc-btn-ghost{background:transparent}
.kwc-google{background:#fff;color:#3c4043;border:1px solid var(--line2)}
.kwc-google:hover{background:#fbfbfd;color:#3c4043;border-color:var(--exp-gold)}
.kwc-btn svg{width:16px;height:16px}

/* full-screen modal */
.kwc-ov{position:fixed;inset:0;z-index:1300;display:none;align-items:flex-start;justify-content:center;
  background:rgba(6,14,32,.62);backdrop-filter:blur(3px);padding:4vh 18px 18px;overflow-y:auto}
.kwc-ov.open{display:flex}
body.kwc-modal-open{overflow:hidden}
.kwc-dlg{width:100%;max-width:1180px;background:var(--panel);border:1px solid var(--line2);border-radius:18px;
  box-shadow:0 40px 100px -30px rgba(6,16,40,.75);overflow:hidden;animation:kwcPop .2s ease;display:flex;flex-direction:column;max-height:92vh}
@keyframes kwcPop{from{opacity:0;transform:translateY(-10px) scale(.985)}to{opacity:1;transform:none}}
.kwc-head{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:16px 20px;
  border-bottom:1px solid var(--line);background:linear-gradient(180deg,rgba(248,163,30,.07),transparent)}
.kwc-head-l{min-width:0}
.kwc-head-t{font-family:var(--disp);font-size:24px;letter-spacing:.5px;color:var(--exp-gold);line-height:1.05}
.kwc-head-s{font-size:12.5px;color:var(--muted);margin-top:2px}
.kwc-head-r{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.kwc-range{font-family:var(--disp);font-size:17px;letter-spacing:.4px;color:var(--exp-gold);margin:0 4px}
.kwc-nav{width:32px;height:32px;border-radius:9px;border:1px solid var(--line2);background:var(--panel);color:var(--muted);cursor:pointer;font-size:17px;line-height:1;transition:border-color .14s,color .14s,background .14s}
.kwc-nav:hover{border-color:var(--exp-gold);color:var(--exp-gold);background:rgba(248,163,30,.06)}
.kwc-today{border:1px solid var(--line2);background:var(--panel);color:var(--text);font-weight:700;font-size:12.5px;font-family:inherit;border-radius:9px;padding:6px 12px;cursor:pointer}
.kwc-today:hover{border-color:var(--exp-gold);color:var(--exp-gold)}
.kwc-add{display:inline-flex;align-items:center;gap:7px;font-family:inherit;font-weight:800;font-size:12.5px;color:#fff;background:linear-gradient(180deg,#F8D80A,#F8A31E);border:none;border-radius:10px;padding:8px 13px;cursor:pointer;box-shadow:0 8px 18px -10px rgba(248,163,30,.8)}
.kwc-add:hover{filter:brightness(1.05)}
.kwc-mini{border:1px solid var(--line2);background:var(--panel);color:var(--muted);font-size:13px;border-radius:8px;padding:6px 9px;cursor:pointer}
.kwc-mini:hover{border-color:var(--exp-gold);color:var(--exp-gold)}
.kwc-x{border:none;background:transparent;color:var(--muted);font-size:16px;cursor:pointer;padding:5px 9px;border-radius:8px}
.kwc-x:hover{background:rgba(0,0,0,.05);color:var(--text)}
.kwc-body{padding:16px 20px 20px;overflow-y:auto}
.kwc-state{display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;color:var(--muted);font-size:14px;padding:60px 20px;text-align:center}
.kwc-state-warn{color:#a5322e}
.kwc-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:9px;min-height:52vh}
@media(max-width:900px){.kwc-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.kwc-grid{grid-template-columns:1fr}}
.kwc-col{background:var(--panel2);border:1px solid var(--line);border-radius:12px;display:flex;flex-direction:column;min-height:150px}
.kwc-col.is-today{border-color:rgba(248,163,30,.6);box-shadow:0 0 0 1px rgba(248,163,30,.35) inset}
.kwc-col-h{display:flex;align-items:baseline;justify-content:space-between;padding:10px 12px 8px;border-bottom:1px solid var(--line)}
.kwc-col.is-today .kwc-col-h{background:linear-gradient(180deg,rgba(248,163,30,.12),transparent)}
.kwc-dow{font-family:var(--mono);font-size:10.5px;font-weight:700;letter-spacing:1.4px;text-transform:uppercase;color:var(--muted)}
.kwc-dnum{font-family:var(--disp);font-size:20px;letter-spacing:.5px;color:var(--exp-gold)}
.kwc-col.is-today .kwc-dnum{color:var(--exp-gold)}
.kwc-col-b{padding:8px;display:flex;flex-direction:column;gap:7px;flex:1}
.kwc-ev{position:relative;background:var(--panel);border:1px solid var(--line);border-left:3px solid var(--exp-gold);border-radius:8px;padding:8px 10px}
.kwc-ev.editable{cursor:pointer;transition:border-color .14s,box-shadow .18s,transform .1s}
.kwc-ev.editable:hover{border-color:var(--exp-gold);box-shadow:0 8px 18px -12px rgba(248,163,30,.5);transform:translateY(-1px)}
.kwc-ev.editable:focus-visible{outline:2px solid var(--exp-gold);outline-offset:2px}
.kwc-ev.allday{border-left-color:var(--ok);background:rgba(31,168,90,.06)}
.kwc-ev-time{display:block;font-family:var(--mono);font-size:10.5px;font-weight:700;letter-spacing:.4px;color:#8A6A1E}
.kwc-ev.allday .kwc-ev-time{color:#17794f}
.kwc-ev-title{display:block;font-size:12.5px;font-weight:600;color:var(--text);line-height:1.35;margin-top:2px}
.kwc-ev-where{display:block;font-size:11px;color:var(--muted);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kwc-ev-open{position:absolute;top:6px;right:7px;font-size:12px;line-height:1;color:var(--muted2);text-decoration:none;opacity:0;transition:opacity .14s,color .14s}
.kwc-ev:hover .kwc-ev-open{opacity:1}
.kwc-ev-open:hover{color:var(--exp-gold)}
.kwc-none{color:var(--muted2);font-size:12px;text-align:center;padding:10px 0}
.kwc-none-add{width:100%;background:transparent;border:1px dashed var(--line2);border-radius:8px;cursor:pointer;color:var(--muted);font-family:inherit;font-weight:700;padding:8px 0;transition:border-color .14s,color .14s,background .14s}
.kwc-none-add:hover{border-color:var(--exp-gold);color:var(--exp-gold);background:rgba(248,163,30,.06)}
/* the event editor reuses .gcal-dlg / .gcal-f / .gcal-row / .gcal-save etc. Nest it above the modal. */
.kwc-editor-ov{position:absolute;inset:0;z-index:5;display:flex;align-items:flex-start;justify-content:center;background:rgba(6,14,32,.5);padding:6vh 16px;overflow-y:auto}

/* office-hours hero: open-calendar button */
.av-cal-btn{display:inline-flex;align-items:center;gap:7px;font-family:inherit;font-weight:700;font-size:12.5px;
  color:var(--exp-gold);background:rgba(248,163,30,.08);border:1px solid rgba(248,163,30,.32);border-radius:9px;
  padding:7px 12px;cursor:pointer;transition:background .14s,border-color .14s,transform .1s}
.av-cal-btn:hover{background:rgba(248,163,30,.15);border-color:var(--exp-gold);transform:translateY(-1px)}
.av-cal-btn svg{width:15px;height:15px}

/* ================================================================
   Inline Google Calendar widget (Month / Week / Day) — kc-*
   Modern business surface, Experior gold. Inline in the Overview.
   Click / drag a time slot to create; popover editor.
   ================================================================ */
.kc{--kc-blue:#F8A31E;--kc-navy:#080707;font-family:inherit}
.kc-spin{width:16px;height:16px;border:2.4px solid rgba(248,163,30,.25);border-top-color:var(--kc-blue);border-radius:50%;display:inline-block;animation:rot .7s linear infinite;vertical-align:-3px}
.kc-line{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;padding:6px 2px;color:var(--muted);font-size:13px}
.kc-line-l{display:flex;align-items:center;gap:11px}
.kc-line-t{font-size:14px;font-weight:700;color:var(--text)}
.kc-line-s{font-size:12px;color:var(--muted);margin-top:2px}
.kc-line-r{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.kc-dot{width:9px;height:9px;border-radius:50%;flex:none}
.kc-dot.ok{background:var(--ok);box-shadow:0 0 7px rgba(31,168,90,.6)}
.kc-dot.off{background:var(--muted2)}
.kc-warn{color:#a5322e}
.kc-btn{display:inline-flex;align-items:center;gap:8px;font-family:inherit;font-weight:700;font-size:13px;cursor:pointer;border-radius:10px;padding:9px 15px;border:1px solid var(--line2);background:var(--panel);color:var(--text);transition:border-color .14s,color .14s,transform .1s,filter .14s}
.kc-btn:hover{border-color:var(--kc-blue);color:var(--kc-blue);transform:translateY(-1px)}
.kc-btn.kc-sm{padding:7px 13px;font-size:12.5px}
.kc-primary{background:linear-gradient(180deg,#F8D80A,#F8A31E);border:none;color:#080707;box-shadow:0 8px 18px -10px rgba(248,163,30,.8)}
.kc-primary:hover{color:#080707;filter:brightness(1.05)}
.kc-primary svg{color:#080707}
.kc-ghost{background:transparent}
.kc-google{background:#fff;color:#3c4043;border:1px solid var(--line2)}
.kc-google:hover{background:#fbfbfd;color:#3c4043;border-color:var(--kc-blue)}
.kc-btn svg{width:16px;height:16px}
.kc-icon{border:1px solid var(--line2);background:var(--panel);color:var(--muted);font-size:14px;line-height:1;border-radius:9px;width:34px;height:34px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:border-color .14s,color .14s}
.kc-icon:hover{border-color:var(--kc-blue);color:var(--kc-blue)}
.kc-icon.kc-sm2{width:28px;height:28px;font-size:12px}
.kc-link{background:none;border:none;color:var(--muted);font-size:12px;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.kc-link:hover{color:var(--kc-blue)}
.kc-connect{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:4px 2px}
.kc-connect-l{display:flex;align-items:flex-start;gap:12px}
.kc-connect-ic{width:42px;height:42px;flex:none;border-radius:11px;display:grid;place-items:center;color:var(--kc-blue);background:linear-gradient(150deg,rgba(248,163,30,.14),rgba(248,163,30,.04));border:1px solid rgba(248,163,30,.28)}
.kc-connect-ic svg{width:22px;height:22px}
.kc-connect-t{font-size:14px;font-weight:700;color:var(--text)}
.kc-connect-s{font-size:12.5px;color:var(--muted);margin-top:3px;line-height:1.5;max-width:64ch}
.kc-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:6px}
.kc-tb-l,.kc-tb-r{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.kc-nav{width:34px;height:34px;border-radius:9px;border:1px solid var(--line2);background:var(--panel);color:var(--muted);cursor:pointer;font-size:18px;line-height:1;transition:border-color .14s,color .14s,background .14s}
.kc-nav:hover{border-color:var(--kc-blue);color:var(--kc-blue);background:rgba(248,163,30,.06)}
.kc-today{border:1px solid var(--line2);background:var(--panel);color:var(--text);font-weight:700;font-size:12.5px;font-family:inherit;border-radius:9px;padding:7px 13px;cursor:pointer}
.kc-today:hover{border-color:var(--kc-blue);color:var(--kc-blue)}
.kc-period{font-family:var(--disp);font-size:22px;letter-spacing:.4px;color:var(--exp-gold);margin-left:6px}
.kc-segs{display:inline-flex;background:var(--panel2);border:1px solid var(--line2);border-radius:10px;padding:3px}
.kc-seg{border:none;background:transparent;font-family:inherit;font-weight:700;font-size:12.5px;color:var(--muted);padding:6px 14px;border-radius:8px;cursor:pointer;transition:all .14s}
.kc-seg:hover{color:var(--kc-blue)}
.kc-seg.on{background:#fff;color:var(--kc-navy);box-shadow:0 2px 6px -2px rgba(16,35,79,.28)}
.kc-add{padding:8px 14px}
.kc-acct-row{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:2px 0 4px;flex-wrap:wrap}
.kc-acct{display:inline-flex;align-items:center;gap:7px;font-size:12px;color:var(--muted);font-weight:600}
.kc-hint{font-size:11.5px;color:var(--muted2);margin:0 0 10px}
.kc-state{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;color:var(--muted);font-size:14px;padding:56px 20px;text-align:center}

/* MONTH */
.kc-month{border:1px solid var(--line);border-radius:14px;overflow:hidden;background:var(--panel)}
.kc-m-head{display:grid;grid-template-columns:repeat(7,1fr);background:var(--panel2);border-bottom:1px solid var(--line)}
.kc-m-hcell{padding:9px 10px;font-family:var(--mono);font-size:10.5px;font-weight:700;letter-spacing:1.2px;text-transform:uppercase;color:var(--muted)}
.kc-m-grid{display:grid;grid-template-columns:repeat(7,1fr);grid-auto-rows:1fr}
.kc-m-cell{min-height:104px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);padding:5px 6px;display:flex;flex-direction:column;gap:3px;background:var(--panel);cursor:pointer;transition:background .12s}
.kc-m-cell:hover{background:rgba(248,163,30,.04)}
.kc-m-cell:nth-child(7n){border-right:none}
.kc-m-cell.out{background:#FafBfD}
.kc-m-cell.out .kc-m-dnum{color:var(--muted2)}
.kc-m-cell.today{background:rgba(248,163,30,.06)}
.kc-m-cell.today .kc-m-dnum{background:var(--kc-blue);color:#fff}
.kc-m-dnum{align-self:flex-start;font-size:12.5px;font-weight:700;color:var(--text);min-width:22px;height:22px;line-height:22px;text-align:center;border-radius:50%;cursor:pointer}
.kc-m-dnum:hover{background:rgba(248,163,30,.14)}
.kc-m-evs{display:flex;flex-direction:column;gap:2px;overflow:hidden}
.kc-chip{display:flex;align-items:center;gap:4px;font-size:11px;line-height:1.3;padding:2px 5px;border-radius:5px;cursor:pointer;white-space:nowrap;overflow:hidden;background:rgba(248,163,30,.1);color:#8A6A1E}
.kc-chip:hover{background:rgba(248,163,30,.2)}
.kc-chip.allday{background:rgba(31,168,90,.14);color:#17794f}
.kc-chip-dot{width:6px;height:6px;border-radius:50%;background:var(--kc-blue);flex:none}
.kc-chip-time{font-weight:700}
.kc-chip-t{overflow:hidden;text-overflow:ellipsis}
.kc-more{font-size:10.5px;font-weight:700;color:var(--muted);cursor:pointer;padding:1px 5px}
.kc-more:hover{color:var(--kc-blue)}

/* WEEK / DAY time grid */
.kc-grid{border:1px solid var(--line);border-radius:14px;overflow:hidden;background:var(--panel)}
.kc-g-head,.kc-allrow{display:grid;grid-template-columns:56px repeat(var(--cols),1fr)}
.kc-g-head{background:var(--panel2);border-bottom:1px solid var(--line)}
.kc-g-hcell{padding:9px 8px;text-align:center;border-left:1px solid var(--line);font-size:12px}
.kc-g-dow{font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:var(--muted)}
.kc-g-dnum{font-family:var(--disp);font-size:18px;color:var(--exp-gold);margin-left:3px}
.kc-g-hcell.today{background:rgba(248,163,30,.08)}
.kc-g-hcell.today .kc-g-dnum{color:var(--kc-blue)}
.kc-allrow{border-bottom:1px solid var(--line);min-height:12px}
.kc-all-cell{border-left:1px solid var(--line);padding:3px 4px;display:flex;flex-direction:column;gap:2px}
.kc-allchip{font-size:10.5px;font-weight:600;background:rgba(31,168,90,.14);color:#17794f;border-radius:4px;padding:1px 5px;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kc-gutter-cell{border-right:1px solid var(--line)}
.kc-grid-scroll{max-height:560px;overflow-y:auto;overscroll-behavior:contain}
.kc-grid-inner{display:flex;position:relative}
.kc-gutter{width:56px;flex:none}
.kc-hour{position:relative}
.kc-hour span{position:absolute;top:-7px;right:8px;font-size:10px;color:var(--muted2);font-family:var(--mono)}
.kc-cols{flex:1;display:grid;grid-template-columns:repeat(var(--cols),1fr);position:relative}
.kc-col{position:relative;border-left:1px solid var(--line);cursor:pointer}
.kc-col:hover{background:rgba(248,163,30,.015)}
.kc-hline{position:absolute;left:0;right:0;border-top:1px solid var(--line);opacity:.6;pointer-events:none}
.kc-hline.half{border-top:1px dashed var(--line);opacity:.4}
.kc-now{position:absolute;left:0;right:0;height:2px;background:#E5484D;z-index:4;box-shadow:0 0 6px rgba(229,72,77,.5);pointer-events:none}
.kc-now::before{content:'';position:absolute;left:-4px;top:-3px;width:8px;height:8px;border-radius:50%;background:#E5484D}
.kc-sel{position:absolute;left:2px;right:2px;z-index:6;background:rgba(248,163,30,.2);border:1.5px solid var(--kc-blue);border-radius:7px;pointer-events:none}
.kc-sel span{position:absolute;top:3px;left:7px;font-size:10.5px;font-weight:700;color:#12325e}
.kc-ev{position:absolute;z-index:3;background:linear-gradient(180deg,#EAF2FD,#DCEAFB);border:1px solid rgba(248,163,30,.4);border-left:3px solid var(--kc-blue);border-radius:7px;padding:3px 7px;overflow:hidden;cursor:pointer;transition:box-shadow .14s,transform .08s;min-height:18px}
.kc-ev:hover{box-shadow:0 8px 18px -8px rgba(248,163,30,.55);transform:translateY(-1px);z-index:5}
.kc-ev-t{font-size:11.5px;font-weight:700;color:#12325e;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kc-ev-time{font-size:10px;color:#2b5ea0;font-family:var(--mono)}
.kc-ev-w{font-size:10px;color:#4a688f;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* POPOVER editor (Google-style) */
.kc-pop-wrap{position:fixed;inset:0;z-index:1400;display:flex;align-items:center;justify-content:center;padding:20px;background:rgba(8,18,40,.42);backdrop-filter:blur(2px);overflow-y:auto}
.kc-pop{width:440px;max-width:calc(100vw - 32px);max-height:92vh;display:flex;flex-direction:column;background:var(--panel);border:1px solid var(--line2);border-radius:16px;box-shadow:0 40px 100px -30px rgba(6,16,40,.7),0 6px 18px -8px rgba(6,16,40,.35);overflow:hidden;animation:kcPop .16s ease}
@keyframes kcPop{from{opacity:0;transform:scale(.97) translateY(-4px)}to{opacity:1;transform:none}}
.kc-pop-head{display:flex;align-items:center;justify-content:space-between;padding:11px 14px;border-bottom:1px solid var(--line);background:linear-gradient(180deg,rgba(248,163,30,.07),transparent);font-family:var(--disp);font-size:17px;color:var(--exp-gold);letter-spacing:.3px}
.kc-ed-b{padding:14px 16px;display:flex;flex-direction:column;gap:9px;flex:1;overflow-y:auto;overflow-x:hidden}
.kc-ed-err{background:rgba(217,59,54,.08);border:1px solid rgba(217,59,54,.35);color:#a5322e;font-size:12.5px;border-radius:8px;padding:8px 11px}
.kc-fl{font-size:11px;font-weight:700;letter-spacing:.3px;text-transform:uppercase;color:var(--muted);margin-top:3px}
.kc-opt{text-transform:none;letter-spacing:0;font-weight:500;color:var(--muted2)}
.kc-in{font-family:inherit;font-size:13.5px;color:var(--text);background:var(--panel2);border:1px solid var(--line2);border-radius:9px;padding:9px 11px;transition:border-color .14s,box-shadow .14s;width:100%;min-width:0}
.kc-in.kc-title{font-size:15px;font-weight:600}
.kc-in:focus{outline:none;border-color:var(--kc-blue);box-shadow:0 0 0 3px rgba(248,163,30,.16)}
textarea.kc-in{resize:vertical;min-height:48px}
.kc-chk{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:var(--text);cursor:pointer;user-select:none;margin-top:2px}
.kc-chk input{width:16px;height:16px;accent-color:var(--kc-blue)}
.kc-ed-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.kc-f{display:flex;flex-direction:column;gap:5px;min-width:0}
.kc-f.kc-full{grid-column:1 / -1}
.kc-ed-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px 14px;border-top:1px solid var(--line);background:var(--panel2)}
.kc-ed-r{display:flex;gap:8px;margin-left:auto}
.kc-del{font-family:inherit;font-weight:700;font-size:12px;color:#a5322e;background:transparent;border:1px solid rgba(217,59,54,.35);border-radius:9px;padding:8px 12px;cursor:pointer;transition:background .14s,border-color .14s}
.kc-del:hover,.kc-del.armed{background:rgba(217,59,54,.1);border-color:rgba(217,59,54,.6)}

/* office-hours hero: open-calendar button (re-added) */
.av-cal-btn{display:inline-flex;align-items:center;gap:7px;font-family:inherit;font-weight:700;font-size:12.5px;color:var(--exp-gold);background:rgba(248,163,30,.08);border:1px solid rgba(248,163,30,.32);border-radius:9px;padding:7px 12px;cursor:pointer;transition:background .14s,border-color .14s,transform .1s}
.av-cal-btn:hover{background:rgba(248,163,30,.15);border-color:var(--exp-gold);transform:translateY(-1px)}
.av-cal-btn svg{width:15px;height:15px}


/* ───── Agent calendar tile: legible on cream ──────────────────────────────
   The eyebrow inherited a bright-yellow override meant for the dark
   availability hero, the title was orange, and the empty-state line sat at
   --muted. All three were far too light against #FFFFFF. */
.kwcal-card .av-eyebrow{ color:#8A6A00 !important; letter-spacing:2.2px; }
.kwcal-title{ color:var(--text); font-size:23px; }
.kwcal-head-s{ color:#3E3C39; font-size:13px; }
.kwcal-host .kc-line{ color:#3E3C39; font-size:13.5px; }
.kwcal-host .kc-line-t{ color:var(--text); }
.kwcal-host .kc-line-s{ color:#5A5854; }
.kwcal-host .kc-connect-t{ color:var(--text); }
/* the status dot needs to be visible too, not a pale grey speck */
.kwcal-host .kc-dot.off{ background:#8A867E; box-shadow:0 0 0 3px rgba(138,134,126,.18); }
.kwcal-host .kc-dot.ok{ background:#1E9E56; box-shadow:0 0 0 3px rgba(30,158,86,.2); }

/* ───── Lead lists: actions on top, and a card view ────────────────────────
   The Add / Import / Select buttons used to sit under the list, so on a full
   Top 100 you had to scroll past a hundred rows to reach them. */
.pc-actions-top{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin:2px 0 14px; }
.pc-actions-top .pc-actions-sp{ flex:1 1 auto; min-width:0; }

/* the list / cards switch */
.pc-viewtog{ display:inline-flex; background:var(--panel3); border:1px solid var(--line); border-radius:9px; padding:3px; gap:2px; flex:0 0 auto; }
.pc-vt{ display:inline-flex; align-items:center; gap:7px; border:0; background:transparent; cursor:pointer;
  font:600 12.5px/1 var(--sans); color:var(--muted); padding:8px 13px; border-radius:7px;
  transition:background .18s ease, color .18s ease, box-shadow .18s ease; }
.pc-vt svg{ width:14px; height:14px; fill:currentColor; }
.pc-vt:hover{ color:var(--text); }
.pc-vt.on{ background:var(--panel); color:var(--text); box-shadow:0 1px 2px rgba(8,7,7,.12), 0 0 0 1px var(--line2); }
@media(max-width:520px){ .pc-vt span{ display:none; } .pc-vt{ padding:8px 11px; } }

/* The grid fills the workspace and each card is wide enough to hold a phone
   number, an address and an occupation without any of them wrapping to three
   lines. auto-fill with a 300px floor rather than a fixed column count: the
   cards grow into whatever width is going spare instead of leaving a gutter. */
.rec-list.lead-grid{ display:grid; gap:14px; width:100%;
  grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); }
@media(min-width:1600px){ .rec-list.lead-grid{ grid-template-columns:repeat(auto-fill,minmax(340px,1fr)); } }
@media(max-width:660px){  .rec-list.lead-grid{ grid-template-columns:minmax(0,1fr); } }

.lead-card{ position:relative; display:flex; flex-direction:column; gap:9px;
  background:var(--panel); border:1px solid var(--line); border-radius:var(--r2);
  padding:14px 14px 12px; min-height:210px;
  transition:border-color .2s ease, box-shadow .25s ease, transform .25s cubic-bezier(.22,1,.36,1); }
.lead-card:hover{ border-color:var(--line2); transform:translateY(-2px);
  box-shadow:0 14px 30px -18px rgba(18,16,14,.45); }
.lead-card.copied{ border-color:rgba(248,163,30,.5); }
.lead-card .lc-top{ display:flex; align-items:center; gap:10px; }
.lead-card .lc-top .lc-sp{ flex:1; }
/* the name gets the full width of the card — sharing a row with the status dot
   and the delete button left it a column too narrow to hold a first name */
.lead-card .lc-ident{ min-width:0; cursor:pointer; margin-top:-2px; }
.lead-card .lc-name{ font-weight:700; font-size:15px; color:var(--text); line-height:1.3;
  overflow-wrap:break-word; overflow:hidden; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; }
.lead-card .lc-pills{ display:flex; gap:6px; flex-wrap:wrap; margin-top:6px; }
.lc-rate{ font:600 10.5px/1 var(--mono); letter-spacing:.6px; text-transform:uppercase;
  padding:4px 8px; border-radius:999px; border:1px solid var(--line2); color:var(--muted); }
.lc-rate.lc-hot{ color:#B3300E; border-color:rgba(179,48,14,.4); background:rgba(179,48,14,.07); }
.lc-rate.lc-warm{ color:#8A6A00; border-color:rgba(138,106,0,.4); background:rgba(248,163,30,.1); }
.lc-rate.lc-cold{ color:#2A6E93; border-color:rgba(42,110,147,.35); background:rgba(42,110,147,.08); }
.lead-card .lc-fields{ display:flex; flex-direction:column; gap:9px; cursor:pointer; }
/* label above value — side by side left barely any room for the value and
   truncated almost every phone number and address */
.lc-f{ display:block; min-width:0; }
.lc-k{ display:block; font:600 9px/1.5 var(--mono); letter-spacing:1.1px; text-transform:uppercase;
  color:var(--muted2); }
.lc-v{ display:block; font-size:13px; line-height:1.4; color:var(--text); min-width:0;
  overflow-wrap:anywhere; overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
.lc-none{ font-size:12.5px; color:var(--muted); font-style:italic; }
.lead-card .lc-notes{ font-size:12px; line-height:1.5; color:var(--muted); cursor:pointer;
  border-top:1px solid var(--line); padding-top:9px;
  display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.lead-card .lc-notes .lc-k{ display:block; margin-bottom:3px; }
.lead-card .lc-foot{ margin-top:auto; padding-top:10px; display:flex; justify-content:flex-end; }
.lead-card .rec-stat{ margin-top:2px; }
.lead-card .rec-del{ position:static; flex:0 0 auto; }
.lead-card .rec-edit{ position:static; }
.lead-card .rec-copied{ border-top:1px solid var(--line); padding-top:9px; }

/* ───── Sortable agent table headers ──────────────────────────────────────*/
.td2-table th.td2-th-sort{ cursor:pointer; user-select:none; white-space:nowrap;
  transition:color .18s ease, background .18s ease; }
.td2-table th.td2-th-sort:hover{ color:var(--text); background:rgba(8,7,7,.035); }
.td2-table th.td2-th-sort:focus-visible{ outline:2px solid var(--exp-gold); outline-offset:-2px; }
.td2-table th .td2-th-l{ display:inline-flex; align-items:center; gap:6px; }
.td2-table th .td2-arrow{ font-style:normal; font-size:11px; opacity:.35; transition:opacity .18s ease; }
.td2-table th.td2-th-sort:hover .td2-arrow{ opacity:.7; }
.td2-table th.is-sorted{ color:var(--text); }
.td2-table th.is-sorted .td2-arrow{ opacity:1; color:#8A6A00; }

/* ───── Email invite template editor ──────────────────────────────────────*/
.ivt-modal{ max-width:1020px; width:min(1020px,94vw); }
.ivt-b{ padding:0 !important; }
.ivt-grid{ display:grid; grid-template-columns:1.15fr .85fr; gap:0; align-items:stretch; }
@media(max-width:900px){ .ivt-grid{ grid-template-columns:1fr; } }
.ivt-edit{ padding:18px 20px 20px; min-width:0; }
.ivt-l{ display:block; font:600 10.5px/1 var(--mono); letter-spacing:1.6px; text-transform:uppercase;
  color:var(--muted2); margin:14px 0 7px; }
.ivt-l:first-child{ margin-top:0; }
.ivt-in, .ivt-ta{ width:100%; font-family:var(--sans); font-size:14px; color:var(--text);
  background:var(--panel); border:1px solid var(--line2); border-radius:var(--r3); padding:11px 12px; }
.ivt-ta{ line-height:1.62; resize:vertical; min-height:250px; }
.ivt-in:focus, .ivt-ta:focus{ outline:none; border-color:var(--exp-gold); box-shadow:0 0 0 3px rgba(248,163,30,.16); }
.ivt-tokens{ display:flex; flex-wrap:wrap; gap:6px; align-items:center; margin-top:12px; }
.ivt-tok-h{ font:600 10px/1 var(--mono); letter-spacing:1.4px; text-transform:uppercase; color:var(--muted2);
  width:100%; margin-bottom:2px; }
.ivt-tok{ font:600 11.5px/1 var(--mono); color:#8A6A00; background:rgba(248,163,30,.1);
  border:1px solid rgba(248,163,30,.4); border-radius:999px; padding:6px 11px; cursor:pointer;
  transition:background .16s ease, border-color .16s ease; }
.ivt-tok:hover{ background:rgba(248,163,30,.2); border-color:var(--exp-gold); }
.ivt-note{ font-size:12px; color:var(--muted); margin-top:12px; line-height:1.55; }
.ivt-note b{ font-family:var(--mono); font-size:11.5px; color:var(--text); }
.ivt-side{ background:var(--panel2); border-left:1px solid var(--line); padding:18px 20px 20px; min-width:0; }
@media(max-width:900px){ .ivt-side{ border-left:0; border-top:1px solid var(--line); } }
.ivt-prev-h{ font:600 10.5px/1 var(--mono); letter-spacing:1.6px; text-transform:uppercase;
  color:var(--muted2); margin-bottom:10px; }
.ivt-prev{ background:var(--panel); border:1px solid var(--line); border-radius:var(--r2); padding:14px 15px;
  font-size:13.5px; line-height:1.66; color:var(--text); max-height:430px; overflow:auto; word-break:break-word; }
.ivt-prev-sub{ font-weight:700; padding-bottom:9px; margin-bottom:10px; border-bottom:1px solid var(--line); }
.ivt-prev-sub span{ display:block; font:600 9.5px/1 var(--mono); letter-spacing:1.4px; text-transform:uppercase;
  color:var(--muted2); margin-bottom:5px; }
.ivt-prev-body{ color:var(--muted); }
.ivt-prev-f{ font-size:11.5px; color:var(--muted2); margin-top:10px; line-height:1.5; }
.pp-btn-primary{ background:var(--exp-grad) !important; color:var(--exp-black) !important;
  border-color:transparent !important; font-weight:700; }

/* ═══════════════════════════════════════════════════════════════════════════
   READABLE GOLD ON LIGHT SURFACES
   ---------------------------------------------------------------------------
   #F8A31E and #F8D80A measure 2.05:1 and 1.42:1 against white. On the black
   hero tiles they are the whole look; on a white panel they are a rumour. The
   same hue taken down to --gold-ink reads at 6.1:1 and still looks like the
   brand.

   Everything below was measured, not eyeballed — specs/_t/gold-audit.js renders each
   rule inside the container it actually ships in, screenshots the page and
   samples the pixel under the text. Run `node specs/_t/gold-audit.js --check` after
   touching any of this; it exits non-zero if a warm text colour drops under
   4.5:1 (3:1 for large text) either way round — pale gold lost on white, or a
   darkened gold lost on a black tile.
   ═══════════════════════════════════════════════════════════════════════════ */
:root{
  --gold-ink:#7A5E00;          /* 6.12:1 on white, still clears 5:1 on the gold-tinted chips */
  --gold-ink-strong:#6E5400;   /* 7.16:1 — small text, and text on a tinted ground */
  --warn-ink:#9C4A10;          /* replaces #DE7A22 wherever it sits on a pale surface */
}

/* ── onboarding: START HERE · YOUR COMMAND CENTER · THE ROADMAP · STEP 1 / 2 ── */
.pg-eyebrow, .pg-card-t, .pg-c-pct, .pg-plus{ color:var(--gold-ink) !important; }
/* .pg-ring-ic is no longer in that list: each ring is drawn in its own stone's
   colour now, and a blanket !important gold turned all ten of them back into
   the same brass. Every gem is checked below against the white tile. */
.pg-adv-l, .ob-phase-meta{ color:var(--gold-ink-strong) !important; }
.pg-sub b, .ob-card-p b{ color:var(--text); }

/* the system tab's completion figure, and the button under it */
.sys-overall-foot b{ color:var(--gold-ink-strong) !important; }
.btn-ghost.sys-go-ob{ color:var(--gold-ink-strong) !important; }

/* the quick-links strip inside a phase card — light strip, so the tiles need ink */
.ph-ql .ql-home,
.ph-ql .ql-home .ql-label,
.ph-ql .ql-home .ql-home-ic{ color:var(--gold-ink-strong) !important; }

/* ── Google Calendar, every surface of it ───────────────────────────────────
   The calendar draws on white panels throughout: day numbers, the date range,
   dialog titles and every hover state were all bright gold on near-white. */
.gcal-dnum, .gcal-col.is-today .gcal-dnum,
.gcal-range, .gcal-dlg-t, .gcal-connect-t,
.kwc-dnum, .kwc-col.is-today .kwc-dnum,
.kwc-head-t,
.kc-period, .kc-g-dnum, .kc-g-hcell.today .kc-g-dnum{ color:var(--gold-ink) !important; }

.gcal-connect-ic, .gcal-nav:hover, .gcal-today:hover, .gcal-mini:hover,
.gcal-ev-open:hover, .gcal-none-add:hover,
.kwc-connect-ic, .kwc-range, .kwc-btn:hover, .kwc-nav:hover, .kwc-today:hover,
.kwc-mini:hover, .kwc-ev-open:hover, .kwc-none-add:hover,
.kc-connect-ic, .kc-pop-head, .kc-btn:hover, .kc-icon:hover, .kc-link:hover,
.kc-nav:hover, .kc-today:hover, .kc-seg:hover, .kc-more:hover{ color:var(--gold-ink-strong) !important; }

/* the calendar tile on the dashboard (verified: eyebrow 5.07, title 20.12) */
.kwcal-card .av-eyebrow{ color:#8A6A00 !important; }

/* ── chrome: sidebar brand, nav, settings ─────────────────────────────────── */
.brand-mark .brand-sub, .brand-mark .brand-company{ color:var(--gold-ink-strong) !important; }
.nav-dash.active .di{ color:var(--gold-ink-strong) !important; }
.settings-ico{ color:var(--gold-ink-strong) !important; }
.avail-badge.set{ color:var(--gold-ink-strong) !important; }

/* ── team table and dashboards on white ─────────────────────────────────── */
.td2-leg b{ color:var(--gold-ink-strong) !important; }
.td2-top .td2-rankn{ color:var(--gold-ink-strong) !important; }
.dr-e{ color:var(--gold-ink) !important; }

/* daily-stats figures on white */
.vz-when, .ds-total, .ds-total-row .ds-block, .ds-total-in,
.dsov-wsc, .dsov-prod .dsov-v{ color:var(--gold-ink-strong) !important; }
.vz-empty-star{ color:var(--gold-ink) !important; }

/* advancement plan numbers on the light cards (the hero keeps its bright gold) */
.adv-card-s, .adv-bt-plus{ color:var(--gold-ink-strong) !important; }

/* the amber "needs attention" family, wherever it lands on a pale chip */
.status-onboarding, .imp-sum-warn, .se-badge,
.av-note, .pol-status.mid{ color:var(--warn-ink) !important; }

/* ── the dreamboard empty state ─────────────────────────────────────────────
   Written for a dark tile that the light rebrand replaced, so its icon and
   copy were cream on cream — invisible rather than merely faint. */
.ov2-empty-dark .ov2-empty-ic{ color:var(--gold-ink) !important; filter:none !important; }
.ov2-empty-dark .ov2-empty-t{ color:var(--text) !important; }
.ov2-empty-dark .ov2-empty-s{ color:var(--muted) !important; }

/* ── and the other direction: anything on a dark ground keeps the bright gold.
   These are all inside black heroes, so the ink colours above would bury them. */
.ov2-hero .pg-eyebrow, .ob-hero .pg-hero-eyebrow, .td2-hero .td2-eyebrow,
.emd-hero .emd-eyebrow, .dsov-hero .dsov-eyebrow,
.adv-hero .adv-eyebrow, .adv-hero .adv-pct,
.adv-lad-node .adv-lad-pct{ color:var(--exp-gold2) !important; }

/* The ladder percentage is NOT one of those. It sits in .adv-lad-top on a white
   step — the earlier fix aimed it at .adv-lad-node and so never applied, and the
   audit's context map made the same wrong assumption and reported it as passing.
   Both are corrected; this is the real ground it lands on. */
.adv-lad-top .adv-lad-pct{ color:var(--gold-ink) !important; }

/* the "use a different photo" link on the identity gate — pale gold on a warm
   panel, so it disappeared exactly when it was being pointed at */
.cam-alt:hover{ color:var(--gold-ink-strong) !important; }

/* the sentence the 87% sits in — #C7C3BA is a dark-theme grey, 1.73:1 here */
.sys-overall-foot{ color:var(--muted) !important; }

/* ═══════════════════════════════════════════════════════════════════════════
   LEAD DATA GRID — the list view for every pipeline
   ---------------------------------------------------------------------------
   The list used to be one name and one squashed line of "phone · email ·
   location · occupation", capped at 920px, which meant opening a record to read
   anything. It is a proper grid now: one column per field the list actually
   holds, the person pinned to the left while you scroll sideways, and the whole
   thing reflowing into stacked label/value pairs on a phone.

   Same markup drives both — no second template to keep in step.
   ═══════════════════════════════════════════════════════════════════════════ */
.lead-tablewrap{ width:100%; overflow-x:auto; overscroll-behavior-x:contain;
  border:1px solid var(--line); border-radius:var(--r2); background:var(--panel);
  box-shadow:0 1px 2px rgba(18,16,14,.05), 0 10px 26px -20px rgba(18,16,14,.22); }
.lead-table{ width:100%; border-collapse:separate; border-spacing:0; font-size:13px; }

.lead-table thead th{ position:sticky; top:0; z-index:3; text-align:left; white-space:nowrap;
  font:700 9.5px/1 var(--mono); letter-spacing:1.2px; text-transform:uppercase; color:var(--muted2);
  background:var(--panel2); border-bottom:1px solid var(--line); padding:11px 14px; }
.lead-table tbody td{ padding:11px 14px; border-bottom:1px solid var(--line);
  vertical-align:middle; color:var(--text); }
.lead-table tbody tr:last-child td{ border-bottom:0; }
.lead-row{ transition:background .13s ease; }
.lead-row:hover td{ background:rgba(248,163,30,.045); }
.lead-row.copied .lt-lead{ box-shadow:inset 3px 0 0 var(--exp-gold); }

/* the person stays put while the data scrolls under them */
.lead-table th.lt-lead, .lead-table td.lt-lead{ position:sticky; left:0; z-index:2;
  background:var(--panel); min-width:230px; }
.lead-table thead th.lt-lead{ z-index:4; background:var(--panel2); }
.lead-row:hover td.lt-lead{ background:#FFFDF7; }
.lead-table td.lt-lead{ display:flex; align-items:flex-start; gap:12px; }
.lt-nm{ min-width:0; cursor:pointer; flex:1; }
.lt-nm .rec-name{ font-weight:700; font-size:13.5px; white-space:normal; }
.lt-pills{ display:flex; gap:6px; flex-wrap:wrap; margin-top:5px; }
.lt-empty{ color:var(--muted2); }
.lead-table .lt-number, .lead-table .lt-age, .lead-table .lt-npn{ white-space:nowrap; font-variant-numeric:tabular-nums; }
.lead-table .lt-email{ overflow-wrap:break-word; min-width:215px; }
.lead-table .lt-long{ min-width:240px; max-width:360px; color:var(--muted); }
.lt-clamp{ display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.lead-table td.lt-act{ text-align:right; white-space:nowrap; }
.lead-table td.lt-act .rec-edit{ margin-right:6px; }
.lead-table .rec-copied{ margin-top:6px; }
.sr-only{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden;
  clip:rect(0 0 0 0); white-space:nowrap; border:0; }

/* ── phones and small tablets: the same rows, stacked ───────────────────── */
@media(max-width:760px){
  .lead-tablewrap{ overflow-x:visible; border:0; background:none; box-shadow:none; }
  .lead-table, .lead-table tbody, .lead-table tr, .lead-table td{ display:block; width:100%; }
  .lead-table thead{ display:none; }
  .lead-row{ background:var(--panel); border:1px solid var(--line); border-radius:var(--r2);
    margin-bottom:10px; padding:4px 2px 2px; overflow:hidden; }
  .lead-table tbody td{ border-bottom:0; padding:6px 13px; display:flex; gap:12px; align-items:baseline; }
  .lead-table tbody td[data-l]::before{ content:attr(data-l); flex:0 0 40%; max-width:150px;
    font:700 9px/1.5 var(--mono); letter-spacing:1px; text-transform:uppercase; color:var(--muted2); }
  .lead-table th.lt-lead, .lead-table td.lt-lead{ position:static; min-width:0;
    padding:11px 13px 9px; border-bottom:1px solid var(--line); margin-bottom:4px; }
  .lead-table .lt-long{ max-width:none; }
  .lt-clamp{ -webkit-line-clamp:5; }
  .lead-table td.lt-act{ padding:10px 13px 12px; justify-content:flex-end; border-top:1px solid var(--line); margin-top:4px; }
  .lead-row:hover td, .lead-row:hover td.lt-lead{ background:transparent; }
}

/* ── the status dot is a button now, so it needs the button reset ────────── */
button.rec-stat{ padding:0; background:none; appearance:none; }
button.rec-stat:focus-visible{ outline:2px solid var(--exp-gold); outline-offset:3px; }

/* ── onboarding phase tiles: the clipped name is readable on touch too ─────
   The hover bubble does the job with a mouse, but @media(hover:none) hides it,
   so on a phone the name simply wraps instead. */
@media(hover:none){
  .ov2-phase-n{ white-space:normal; overflow:visible; text-overflow:clip; line-height:1.35; }
}
.ov2-phase-n[data-tip]{ cursor:help; }

/* ── the ledgers read as part of the same system ───────────────────────────
   Submitted and Delivered are policy records, not leads, so they keep their
   money columns rather than gaining a card view — but the header typography,
   the row hover and the sticky heading now match the lead grid, so moving
   between tabs does not feel like moving between two apps.
   .td2-table (the agent roster) has its own sortable-header treatment and is
   deliberately left alone. */
.tablewrap > table:not(.td2-table) thead th{
  position:sticky; top:0; z-index:3; background:var(--panel2);
  font:700 9.5px/1 var(--mono); letter-spacing:1.2px; text-transform:uppercase;
  color:var(--muted2); white-space:nowrap; }
.tablewrap > table:not(.td2-table) tbody tr{ transition:background .13s ease; }
.tablewrap > table:not(.td2-table) tbody tr:hover td{ background:rgba(248,163,30,.045); }

/* ═══════════════════════════════════════════════════════════════════════════
   TOOLS — the client-facing calculator library
   ---------------------------------------------------------------------------
   Two states in one tab: the library, and one tool running in a frame. The
   frame is deliberate — see the header of js/tools-tab.js — so the styling here
   has to make an iframe look like part of the page rather than a window cut
   into it. Hence: no border on the frame, the surrounding card carries the
   edge, and the tool's own background matches the tracker's.
   ═══════════════════════════════════════════════════════════════════════════ */
.tl-lede{ display:flex; flex-direction:column; gap:6px; margin:0 0 20px; padding:16px 20px;
  border-radius:var(--r); border:1px solid var(--line); border-left:4px solid var(--exp-gold);
  background:linear-gradient(180deg,var(--panel2),var(--panel)); max-width:none; }
.tl-lede-t{ font-weight:800; font-size:14.5px; }
.tl-lede p{ font-size:13.5px; line-height:1.6; color:var(--muted); max-width:88ch; }
.tl-lede b{ color:var(--text); }

.tl-grid{ display:grid; gap:16px; width:100%;
  grid-template-columns:repeat(auto-fill,minmax(330px,1fr)); }
@media(max-width:660px){ .tl-grid{ grid-template-columns:minmax(0,1fr); } }

.tl-card{ position:relative; display:flex; flex-direction:column; cursor:pointer;
  background:var(--panel); border:1px solid var(--line); border-radius:var(--r);
  padding:18px 20px 16px; overflow:hidden;
  transition:border-color .22s ease, box-shadow .3s ease, transform .3s cubic-bezier(.22,1,.36,1); }
/* the lamp: a warm wash that wakes up under the cursor, drawn behind the text
   so nothing on the card has to change colour to show the state */
.tl-card::before{ content:""; position:absolute; inset:-1px; border-radius:inherit; opacity:0;
  background:radial-gradient(120% 140% at 12% -20%,rgba(248,163,30,.16),transparent 58%);
  transition:opacity .32s ease; pointer-events:none; }
.tl-card::after{ content:""; position:absolute; left:0; right:0; top:0; height:3px; opacity:0;
  background:linear-gradient(90deg,var(--exp-gold),var(--exp-gold2));
  transform:translateY(-3px); transition:opacity .28s ease, transform .28s ease; }
.tl-card:hover, .tl-card:focus-visible{ border-color:rgba(248,163,30,.55); outline:none;
  transform:translateY(-3px); box-shadow:0 18px 40px -22px rgba(18,16,14,.5); }
.tl-card:hover::before, .tl-card:focus-visible::before{ opacity:1; }
.tl-card:hover::after, .tl-card:focus-visible::after{ opacity:1; transform:translateY(0); }
@media (prefers-reduced-motion:reduce){
  .tl-card, .tl-card::before, .tl-card::after{ transition:none; }
  .tl-card:hover, .tl-card:focus-visible{ transform:none; }
}

.tl-top{ display:flex; align-items:center; gap:10px; margin-bottom:13px; position:relative; }
.tl-ic{ width:38px; height:38px; border-radius:11px; display:grid; place-items:center; flex:0 0 auto;
  background:linear-gradient(135deg,#151310,#0c0a08); color:var(--exp-gold2);
  transition:transform .3s cubic-bezier(.22,1,.36,1); }
.tl-ic svg{ width:19px; height:19px; }
.tl-card:hover .tl-ic{ transform:rotate(-6deg) scale(1.06); }
.tl-tag{ font:700 9px/1 var(--mono); letter-spacing:1.2px; text-transform:uppercase; color:var(--gold-ink-strong);
  background:rgba(248,163,30,.12); border:1px solid rgba(248,163,30,.3); padding:5px 9px; border-radius:999px; }
.tl-mins{ margin-left:auto; font:600 11px var(--mono); color:var(--muted2); }

.tl-name{ font-size:16px; font-weight:800; line-height:1.3; letter-spacing:-.2px; position:relative; }
.tl-does{ font-size:13px; line-height:1.55; color:var(--muted); margin-top:7px; position:relative; }

.tl-break{ margin-top:14px; padding-top:13px; border-top:1px solid var(--line); position:relative; }
.tl-break dt{ font:700 8.5px/1.5 var(--mono); letter-spacing:1.1px; text-transform:uppercase; color:var(--muted2); }
.tl-break dd{ font-size:12.5px; line-height:1.5; color:var(--text); margin:2px 0 10px; }
.tl-break dd:last-child{ margin-bottom:0; }

.tl-go{ display:flex; align-items:center; gap:7px; margin-top:auto; padding-top:14px; position:relative;
  font:700 12px var(--sans); color:var(--gold-ink-strong); }
.tl-go svg{ width:15px; height:15px; transition:transform .26s cubic-bezier(.22,1,.36,1); }
.tl-card:hover .tl-go svg{ transform:translateX(4px); }

/* ── a tool, running ─────────────────────────────────────────────────────── */
.tl-run{ display:flex; flex-direction:column; gap:0; }
.tl-bar{ display:flex; align-items:center; gap:14px; flex-wrap:wrap;
  padding:12px 16px; border:1px solid var(--line); border-bottom:0;
  border-radius:var(--r) var(--r) 0 0; background:linear-gradient(180deg,var(--panel2),var(--panel)); }
.tl-back{ display:inline-flex; align-items:center; gap:6px; border:1px solid var(--line2); background:var(--panel);
  color:var(--text); font:700 12.5px var(--sans); padding:8px 13px; border-radius:9px; cursor:pointer;
  transition:border-color .16s ease, background .16s ease; }
.tl-back svg{ width:15px; height:15px; }
.tl-back:hover{ border-color:var(--exp-gold); background:#FFFDF7; }
.tl-bar-id{ display:flex; align-items:center; gap:11px; min-width:0; }
.tl-bar-ic{ width:32px; height:32px; border-radius:9px; display:grid; place-items:center; flex:0 0 auto;
  background:linear-gradient(135deg,#151310,#0c0a08); color:var(--exp-gold2); }
.tl-bar-ic svg{ width:16px; height:16px; }
.tl-bar-n{ font-weight:800; font-size:14px; line-height:1.25; }
.tl-bar-s{ font-size:11.5px; color:var(--muted); margin-top:1px; }
.tl-bar-sp{ flex:1 1 auto; min-width:0; }
.tl-restart{ border:1px solid var(--line2); background:transparent; color:var(--muted);
  font:600 12px var(--sans); padding:8px 13px; border-radius:9px; cursor:pointer;
  transition:color .16s ease, border-color .16s ease; }
.tl-restart:hover{ color:var(--text); border-color:var(--line2); }

.tl-frame-wrap{ position:relative; border:1px solid var(--line); border-radius:0 0 var(--r) var(--r);
  overflow:hidden; background:#F7F7F5; min-height:560px; }
.tl-frame{ display:block; width:100%; height:760px; border:0; background:#F7F7F5;
  opacity:0; transition:opacity .3s ease; }
.tl-frame.on{ opacity:1; }
.tl-loading{ position:absolute; inset:0; display:grid; place-items:center; color:var(--muted);
  font-size:13px; background:#F7F7F5; }
@media(max-width:640px){
  .tl-bar{ gap:10px; padding:11px 13px; }
  .tl-bar-sp{ display:none; }
  .tl-restart{ margin-left:auto; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   PROMOTION GUIDELINES — the ladder, made worth reading
   ---------------------------------------------------------------------------
   The tiles were flat panels with a dim gold percentage on black, which is the
   one number an agent is actually looking for and the one they could not read.
   Three changes, in order of how much they matter:

     1. the percentage is white, heavy and large — it is the headline of the card
     2. every tile has a hover state, drawn on a pre-composed layer so the motion
        is opacity and transform only and stays on the compositor
     3. tiles arrive as you scroll rather than all at once

   Everything is scoped under the pg- prefix so no other tab inherits it.
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── the reveal ─────────────────────────────────────────────────────────── */
.pg-wrap [data-rv]{ opacity:0; transform:translateY(14px); }
.pg-wrap [data-rv].in{ opacity:1; transform:none;
  transition:opacity .5s cubic-bezier(.22,1,.36,1), transform .55s cubic-bezier(.22,1,.36,1);
  transition-delay:calc(var(--rv-i, 0) * 55ms); }
@media (prefers-reduced-motion:reduce){
  .pg-wrap [data-rv], .pg-wrap [data-rv].in{ opacity:1; transform:none; transition:none; }
}

/* ── nav: says where you are ────────────────────────────────────────────── */
.pg-navbtn{ transition:background .18s ease, color .18s ease, border-color .18s ease, transform .18s ease; }
.pg-navbtn.on{ background:var(--exp-black); color:#fff; border-color:transparent; }
.pg-navbtn.on:hover{ background:var(--exp-grad); color:var(--exp-black); }

/* ── advancement cards ──────────────────────────────────────────────────── */
.pg-adv{ position:relative; transition:border-color .24s ease, box-shadow .32s ease,
  transform .32s cubic-bezier(.22,1,.36,1); }
.pg-wrap .pg-adv:hover{ transform:translateY(-3px); border-color:rgba(248,163,30,.5);
  box-shadow:0 20px 44px -24px rgba(18,16,14,.55); }
@media (prefers-reduced-motion:reduce){ .pg-wrap .pg-adv:hover{ transform:none; } }

.pg-adv-h{ position:relative; overflow:hidden; align-items:center; }
/* the warm wash lives on its own layer: a gradient cannot animate between
   "none" and "something", but an opacity can, and it stays off the main thread */
.pg-adv-h::before{ content:""; position:absolute; inset:0; opacity:0; pointer-events:none;
  background:radial-gradient(120% 200% at 6% -60%,rgba(248,163,30,.30),transparent 60%);
  transition:opacity .34s ease; }
.pg-adv:hover .pg-adv-h::before{ opacity:1; }

.pg-adv-rank{ position:absolute; right:14px; top:8px; font-family:var(--disp); font-size:34px;
  line-height:1; color:rgba(255,255,255,.07); letter-spacing:1px; pointer-events:none;
  transition:color .3s ease; }
.pg-adv:hover .pg-adv-rank{ color:rgba(248,163,30,.22); }

.pg-adv-code{ position:relative; transition:transform .34s cubic-bezier(.22,1,.36,1),
  box-shadow .34s ease; box-shadow:0 4px 12px -6px rgba(248,163,30,.7); }
.pg-adv:hover .pg-adv-code{ transform:rotate(-5deg) scale(1.06); box-shadow:0 8px 20px -6px rgba(248,163,30,.85); }
.pg-adv-id{ position:relative; min-width:0; flex:1; }
.pg-adv-l2{ font:600 9px/1.5 var(--mono); letter-spacing:1.3px; text-transform:uppercase;
  color:rgba(255,255,255,.42); margin-top:2px; }

/* THE number. White, heavy, tabular — it is what the card is for. */
.pg-adv-pctwrap{ position:relative; margin-left:auto; padding-left:14px; text-align:right; }
.pg-adv-pct{ font-family:var(--sans) !important; font-size:20px; font-weight:800; letter-spacing:-.4px;
  color:#FFFFFF !important; font-variant-numeric:tabular-nums; line-height:1.1; white-space:nowrap; }
@media(max-width:520px){ .pg-adv-pct{ font-size:17px; } }

.pg-adv-b{ grid-template-columns:1fr 1.05fr; }
.pg-adv-col2{ background:linear-gradient(180deg,rgba(248,163,30,.045),transparent 70%); }
.pg-adv-col li::before{ transition:transform .3s ease, background .3s ease; }
.pg-adv:hover .pg-adv-col li::before{ transform:scale(1.35); }
@media(max-width:700px){ .pg-adv-b{ grid-template-columns:1fr; }
  .pg-adv-col:first-child{ border-right:0; border-bottom:1px solid var(--line); } }

/* ── ring tiles ─────────────────────────────────────────────────────────── */
.pg-rings{ grid-template-columns:repeat(auto-fill,minmax(210px,1fr)); }
@media(max-width:900px){ .pg-rings{ grid-template-columns:repeat(auto-fill,minmax(170px,1fr)); } }
.pg-ring{ position:relative; overflow:hidden; gap:13px;
  transition:border-color .24s ease, box-shadow .3s ease, transform .3s cubic-bezier(.22,1,.36,1); }
.pg-ring::before{ content:""; position:absolute; inset:0; opacity:0; pointer-events:none;
  background:radial-gradient(120% 150% at 0% 0%,color-mix(in srgb,var(--gem) 22%,transparent),transparent 62%);
  transition:opacity .32s ease; }
.pg-ring::after{ content:""; position:absolute; left:0; top:0; bottom:0; width:4px; background:var(--gem);
  transform:scaleY(0); transform-origin:top; transition:transform .34s cubic-bezier(.22,1,.36,1); }
.pg-wrap .pg-ring:hover{ transform:translateY(-3px); border-color:color-mix(in srgb,var(--gem) 45%,var(--line));
  box-shadow:0 18px 36px -22px rgba(18,16,14,.5); }
.pg-ring:hover::before{ opacity:1; }
.pg-ring:hover::after{ transform:scaleY(1); }
.pg-ring-ic{ position:relative; width:34px; height:34px; color:var(--gem); flex:none;
  filter:drop-shadow(0 3px 7px color-mix(in srgb,var(--gem) 45%,transparent));
  transition:transform .36s cubic-bezier(.22,1,.36,1); }
.pg-ring-ic svg{ width:34px; height:34px; display:block; }
.pg-ring:hover .pg-ring-ic{ transform:rotate(-10deg) scale(1.1); }
.pg-ring-tx{ position:relative; min-width:0; }
.pg-ring-no{ position:absolute; right:12px; top:9px; font:700 10px var(--mono); color:var(--muted2);
  transition:color .3s ease; }
.pg-ring:hover .pg-ring-no{ color:var(--gem); }
@media (prefers-reduced-motion:reduce){
  .pg-wrap .pg-ring:hover{ transform:none; } .pg-ring:hover .pg-ring-ic{ transform:none; }
}

/* ── overview / bonus / legacy tiles get the same treatment ─────────────── */
.pg-bigcard, .pg-card, .pg-leg{ position:relative; overflow:hidden;
  transition:border-color .24s ease, box-shadow .3s ease, transform .3s cubic-bezier(.22,1,.36,1); }
.pg-bigcard::before, .pg-card::before, .pg-leg::before{ content:""; position:absolute; inset:0; opacity:0;
  pointer-events:none; background:radial-gradient(120% 150% at 8% -20%,rgba(248,163,30,.16),transparent 58%);
  transition:opacity .32s ease; }
.pg-wrap .pg-bigcard:hover, .pg-wrap .pg-card:hover, .pg-wrap .pg-leg:hover{ transform:translateY(-3px);
  border-color:rgba(248,163,30,.45); box-shadow:0 18px 38px -24px rgba(18,16,14,.5); }
.pg-bigcard:hover::before, .pg-card:hover::before, .pg-leg:hover::before{ opacity:1; }
.pg-bigcard > *, .pg-card > *, .pg-leg > *{ position:relative; }
@media (prefers-reduced-motion:reduce){
  .pg-wrap .pg-bigcard:hover, .pg-wrap .pg-card:hover, .pg-wrap .pg-leg:hover{ transform:none; }
}
.pg-leg-tier{ display:flex; align-items:baseline; gap:9px; }
.pg-leg-no{ font:700 10px var(--mono); color:var(--muted2); background:var(--panel3);
  border-radius:6px; padding:3px 6px; letter-spacing:.5px; }

/* ── override bars fill in on arrival, so the shape of the ladder registers ─ */
.pg-ov-bar i{ transform-origin:left; animation:pgFill .9s cubic-bezier(.22,1,.36,1) both; }
@keyframes pgFill{ from{ transform:scaleX(0); } to{ transform:scaleX(1); } }
.pg-ov-row{ transition:transform .2s ease; }
.pg-ov-row:hover{ transform:translateX(3px); }
@media (prefers-reduced-motion:reduce){
  .pg-ov-bar i{ animation:none; } .pg-ov-row:hover{ transform:none; }
}

/* The "Copied to" chips are no longer a Top 100 exclusive — a recruit promoted
   to Partners, or anyone who has a policy submitted, now says so on their row
   and on their card. Two more colours, matched to the tabs they point at. */
.rec-dchip.d-partner{ background:rgba(94,84,168,.15); color:#4A3E8C; }
.rec-dchip.d-client{ background:rgba(42,110,147,.15); color:#215A79; }

/* ── the compensation library: hub + sub-nav ───────────────────────────────
   The hub cards are the Tools cards — same component, same hover, because they
   do the same job: pick one of a handful of things and open it. Only the grid
   density differs, since there are four of these and five of those. */
.gh-grid{ grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); }
.gh-card .tl-break dd:last-child{ margin-bottom:0; }

.gh-bar{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin:0 0 18px;
  padding:11px 14px; border:1px solid var(--line); border-radius:var(--r);
  background:linear-gradient(180deg,var(--panel2),var(--panel));
  position:sticky; top:0; z-index:6; backdrop-filter:blur(8px); }
.gh-seg{ display:inline-flex; gap:3px; padding:3px; background:var(--panel3);
  border:1px solid var(--line); border-radius:10px; flex-wrap:wrap; }
.gh-segbtn{ border:0; background:transparent; cursor:pointer; color:var(--muted);
  font:700 12px var(--sans); padding:8px 14px; border-radius:8px;
  transition:background .18s ease, color .18s ease, box-shadow .18s ease; }
.gh-segbtn:hover{ color:var(--text); }
.gh-segbtn.on{ background:var(--panel); color:var(--text);
  box-shadow:0 1px 2px rgba(8,7,7,.12), 0 0 0 1px var(--line2); }
@media(max-width:620px){
  .gh-bar{ gap:10px; padding:10px 11px; }
  .gh-seg{ width:100%; }
  .gh-segbtn{ flex:1 1 auto; padding:8px 10px; }
}
/* the guidelines page has its own sticky nav — stack it under this one */
.gh-bar + .pg-wrap .pg-nav{ top:60px; }

/* The whole row and the whole card are the hit area for opening a record, so
   they carry the cursor — a pointer over the name and a default arrow two
   inches to the right was the tell that the rest of the row did nothing. */
.lead-row{ cursor:pointer; }
.lead-card{ cursor:pointer; }
.lead-row button, .lead-card button, .lead-row a, .lead-card a{ cursor:pointer; }
.lt-nm:focus-visible, .lc-ident:focus-visible{ outline:2px solid var(--exp-gold);
  outline-offset:3px; border-radius:6px; }

/* ── archive / restore ─────────────────────────────────────────────────────
   Sits beside delete but reads as the gentler of the two: no red, and the
   filled state says the row is already put away. */
.rec-arc{ flex-shrink:0; width:30px; height:30px; border-radius:var(--r3); color:var(--muted2);
  display:inline-grid; place-items:center; transition:all .12s ease; background:transparent; border:0; cursor:pointer; }
.rec-arc svg{ width:16px; height:16px; }
.rec-arc:hover{ background:var(--panel3); color:var(--text); }
.rec-arc.on{ color:var(--gold-ink-strong); }
.lead-table td.lt-act .rec-arc{ margin-right:2px; }
.lead-card .rec-arc{ position:static; }
.btn-row.pc-arch.on{ background:var(--exp-black); color:#fff; border-color:transparent; }

/* ── black tiles: the labels on them are white, and they are bold ──────────
   Gold at 10px on a black hero is a rumour of a word. These are the labels the
   agent reads at a glance — the availability strip, the dream board chips, the
   "View all" — so they get white and weight instead of an accent colour. */
.av-hero .av-eyebrow,
.ov2-hero .pg-eyebrow,
.ov2-dreamboard.dark-tile .ov2-db-btn,
.dark-tile .ov2-db-btn,
.ov2-db-star,
.ov2-dream-tf,
.ov2-dream-more{ color:#FFFFFF !important; font-weight:800 !important; }
.av-hero .av-eyebrow{ letter-spacing:2.2px; }
/* the small chips on a dark dream board */
.dark-tile .vz-when, .ov2-dreamboard .vz-when,
.dark-tile .ov2-goal-when, .ov2-dream .ov2-when{
  color:#FFFFFF !important; font-weight:800 !important;
  background:rgba(255,255,255,.12) !important; border-color:rgba(255,255,255,.28) !important; }

/* ── the sidebar Dashboard link reads like the My Team button ──────────────
   It was gold-on-black at the top of the quick links and disappeared into the
   panel behind it. White plate, black letters, same as the nav buttons. */
.ph-ql .ql-home,
.ph-ql .ql-home .ql-label,
.ph-ql .ql-home .ql-home-ic{ color:#0B0A0A !important; font-weight:800 !important; }
.ph-ql .ql-home{ background:#FFFFFF !important; border:1px solid var(--line2) !important;
  box-shadow:0 1px 2px rgba(8,7,7,.16) !important; }
.ph-ql .ql-home:hover{ background:#F4F3F1 !important; border-color:var(--exp-gold) !important; }

/* ── the whole onboarding tile is the hover target ─────────────────────────
   Having to find the one-line title to see the rest of the title is a joke at
   the reader's expense. */
.ov2-phase[data-tip]{ cursor:help; }
.ov2-phase-n[data-tip]{ cursor:inherit; }
@media (hover:none){ .ov2-phase[data-tip]{ cursor:default; } }

/* Google Calendar how-to link — ink gold so it stays readable on cream panels */
.kc-howto{color:var(--gold-ink-strong,#6E5400);font-weight:700;text-decoration:none;border-bottom:1px solid rgba(110,84,0,.35)}
.kc-howto:hover{color:var(--gold-ink,#7A5E00);border-bottom-color:var(--gold-ink,#7A5E00)}
.kwcal-head-s .kc-howto{margin-left:4px}
