/* ============================================================
   BLACK LABEL LEADS — AGENT PORTAL (quiet chrome working tool)
   ============================================================ */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --black:#0a0b0d;--panel:#101216;--card:#15171b;--line:rgba(174,180,188,0.18);
  --line-soft:rgba(236,238,241,0.07);
  --ivory:#eceef1;--soft:#c0c5cc;--mute:#848a93;
  --silver:#aeb4bc;--silver-bright:#e9ecef;
  --chrome:linear-gradient(180deg,#f4f6f8 0%,#c4cad2 38%,#8e959f 52%,#d6dbe1 66%,#9ba1aa 100%);
  --chrome-anim:linear-gradient(100deg,#9ba1aa 0%,#eef1f4 12%,#8e959f 28%,#ffffff 46%,#9aa1ab 62%,#eef1f4 80%,#9ba1aa 100%);
  --chrome-btn:linear-gradient(160deg,#f4f6f8,#c4cad2 35%,#9aa1ab 55%,#dfe3e7 80%,#aeb4bc);
  --good:#7fb89a;--warn:#d2a96a;--bad:#c98a8a;
}
body{font-family:'Mulish',sans-serif;background:var(--black);color:var(--ivory);line-height:1.6;-webkit-font-smoothing:antialiased;min-height:100vh}
a{color:var(--soft)}

/* ===== AUTH SCREENS (login / set password) ===== */
.auth-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px;
  background:radial-gradient(ellipse 60% 40% at 50% 0%, rgba(174,180,188,0.06), transparent 60%), var(--black)}
.auth-card{width:100%;max-width:420px;background:var(--card);border:1px solid var(--line);padding:42px 38px;box-shadow:0 18px 60px rgba(0,0,0,0.55)}
.auth-brand{display:flex;flex-direction:column;align-items:center;gap:14px;margin-bottom:30px;text-align:center}
.auth-brand svg{width:64px;height:64px}
.auth-brand .wordmark{font-family:'Fraunces',serif;font-size:18px;letter-spacing:0.12em;text-transform:uppercase;color:var(--ivory)}
.auth-brand .wordmark .lbl{background:var(--chrome-anim);background-size:300% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;animation:chromeShimmer 4.4s ease-in-out infinite}
.auth-brand .tag{font-size:10px;font-weight:700;letter-spacing:0.3em;text-transform:uppercase;color:var(--mute)}
.auth-card h1{font-family:'Fraunces',serif;font-size:22px;font-weight:500;margin-bottom:6px;text-align:center}
.auth-card .sub{font-size:13px;color:var(--mute);text-align:center;margin-bottom:26px}
.field{margin-bottom:14px}
.field label{display:block;font-size:11px;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;color:var(--soft);margin-bottom:6px}
.field input{width:100%;padding:13px 15px;border:1px solid var(--line-soft);background:var(--black);color:var(--ivory);font-family:'Mulish',sans-serif;font-size:15px;border-radius:0;transition:border-color .15s, box-shadow .15s}
.field input:focus{outline:none;border-color:var(--silver);box-shadow:0 0 0 3px rgba(174,180,188,0.12)}
.btn{width:100%;margin-top:8px;background:var(--chrome-btn);color:var(--black);border:none;cursor:pointer;
  font-family:'Mulish',sans-serif;font-size:14px;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;padding:15px;transition:opacity .15s}
.btn:hover{opacity:.9}

/* ===== TRAVELLING SHIMMER ON SOLID SILVER BUTTONS =====
   The chrome buttons get a band of light that sweeps across, same as the
   text shimmer, so the BOXES glimmer too — not just the words. */
.btn,.home-cta,.gp-save,.tier-cta.solid,.signout{position:relative;overflow:hidden}
.btn::after,.home-cta::after,.gp-save::after,.tier-cta.solid::after{
  content:'';position:absolute;top:0;bottom:0;left:-60%;width:55%;
  background:linear-gradient(105deg,transparent,rgba(255,255,255,0.85) 50%,transparent);
  transform:skewX(-20deg);pointer-events:none;
  animation:btnSweep 4.4s ease-in-out infinite;
}
@keyframes btnSweep{
  0%{left:-60%}
  35%{left:150%}
  100%{left:150%}
}
@media (prefers-reduced-motion: reduce){
  .btn::after,.home-cta::after,.gp-save::after,.tier-cta.solid::after{animation:none;display:none}
}
.btn:disabled{opacity:.5;cursor:wait}
.auth-foot{margin-top:18px;text-align:center;font-size:12.5px;color:var(--mute)}
.auth-foot a{cursor:pointer;text-decoration:underline}
.msg{margin-top:14px;font-size:13px;text-align:center;display:none;line-height:1.5}
.msg.err{display:block;color:var(--bad)}
.msg.ok{display:block;color:var(--good)}

/* ===== PORTAL SHELL ===== */
.topbar{display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:14px 26px;background:var(--panel);border-bottom:1px solid var(--line)}
.topbar .brand{display:flex;align-items:center;gap:11px;font-family:'Fraunces',serif;font-size:15px;letter-spacing:0.1em;text-transform:uppercase}
.topbar .brand svg{width:34px;height:34px}
.topbar .brand .lbl{background:var(--chrome-anim);background-size:300% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;animation:chromeShimmer 4.4s ease-in-out infinite}
.topnav{display:flex;gap:20px;align-items:center;margin-left:18px}
.topnav a{font-size:12px;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;color:var(--soft);text-decoration:none}
.topnav a:hover{color:var(--ivory)}
.topnav a.active{color:var(--silver-bright);border-bottom:1px solid var(--silver);padding-bottom:2px}
.topbar .who{display:flex;align-items:center;gap:16px;font-size:13px;color:var(--soft)}
.signout{background:none;border:1px solid var(--line);color:var(--soft);font-family:'Mulish',sans-serif;
  font-size:11px;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;padding:8px 14px;cursor:pointer}
.signout:hover{color:var(--ivory);border-color:var(--silver)}

.shell{max-width:1200px;margin:0 auto;padding:30px 26px 60px}

/* stat band */
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:28px}
.stat{background:var(--card);border:1px solid var(--line-soft);padding:18px 22px}
.stat .n{font-family:'Fraunces',serif;font-size:30px;background:var(--chrome-anim);background-size:250% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;line-height:1.1;animation:chromeShimmer 7s ease-in-out infinite}
@keyframes chromeShimmer{
  0%{background-position:160% 0}
  45%{background-position:-10% 0}
  100%{background-position:-10% 0}
}
@media (prefers-reduced-motion: reduce){
  .auth-brand .wordmark .lbl,.topbar .brand .lbl,.stat .n,.home-hero h1 em{animation:none;background-position:0 0}
}

/* ===== PORTAL HOME ===== */
.home-hero{padding:14px 0 26px}
.home-hero h1{font-family:'Fraunces',serif;font-size:30px;font-weight:500;margin-bottom:8px}
.home-hero h1 em{font-style:italic;background:var(--chrome-anim);background-size:300% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;animation:chromeShimmer 4.4s ease-in-out infinite}
.home-hero p{font-size:14.5px;color:var(--soft);max-width:620px;line-height:1.7}
.home-grid{display:grid;grid-template-columns:1.6fr 1fr;gap:14px;margin-top:22px}
.home-card{background:var(--card);border:1px solid var(--line-soft);padding:22px}
.home-card h2{font-family:'Fraunces',serif;font-size:17px;font-weight:500;margin-bottom:12px}
.mini-lead{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid var(--line-soft);font-size:13px}
.mini-lead:last-child{border-bottom:none}
.mini-lead .who b{color:var(--ivory)} .mini-lead .who div{color:var(--mute);font-size:11.5px}
.mini-lead .when{color:var(--mute);font-size:11.5px;text-align:right;flex-shrink:0}
.home-cta{display:inline-block;margin-top:14px;background:var(--chrome-btn);color:var(--black);font-weight:700;font-size:12px;letter-spacing:0.08em;text-transform:uppercase;padding:12px 20px;text-decoration:none}
.support-line{font-size:13px;color:var(--soft);line-height:1.8}
.support-line a{color:var(--silver-bright)}
@media (max-width:860px){.home-grid{grid-template-columns:1fr}}
.stat .l{font-size:10.5px;font-weight:700;letter-spacing:0.14em;text-transform:uppercase;color:var(--mute);margin-top:4px}
/* Black Label tier: the stat card goes near-black and the word glows black,
   matching the Black Label tier on the pricing page */
.stat.bl-stat{background:radial-gradient(120% 90% at 50% 0%, #15171b 0%, #050506 78%);border-color:rgba(140,150,162,0.20)}
.stat .n.bl-tier{
  background:none;color:#0a0a0b;-webkit-text-fill-color:#0a0a0b;
  text-shadow:0 0 6px rgba(150,160,172,0.44),0 0 13px rgba(128,138,150,0.28);
  animation:blTierGlow 3.6s ease-in-out infinite;
}
@keyframes blTierGlow{
  0%,100%{text-shadow:0 0 5px rgba(146,156,168,0.36),0 0 11px rgba(124,134,146,0.22)}
  50%{text-shadow:0 0 8px rgba(166,176,188,0.52),0 0 16px rgba(138,148,160,0.32)}
}

/* leads table */
.panel{background:var(--card);border:1px solid var(--line)}
.panel-head{display:flex;align-items:center;justify-content:space-between;padding:16px 22px;border-bottom:1px solid var(--line-soft)}
.panel-head h2{font-family:'Fraunces',serif;font-size:18px;font-weight:500}
.panel-head .hint{font-size:11.5px;color:var(--mute)}
table{width:100%;border-collapse:collapse;font-size:13.5px}
th{font-size:10px;font-weight:700;letter-spacing:0.12em;text-transform:uppercase;color:var(--mute);text-align:left;padding:11px 14px;border-bottom:1px solid var(--line-soft)}
td{padding:13px 14px;border-bottom:1px solid var(--line-soft);vertical-align:top}
tr:last-child td{border-bottom:none}
td .nm{font-weight:700;color:var(--ivory)}
td .sub2{font-size:12px;color:var(--mute);margin-top:1px}
td a.tf{font-size:11.5px;color:var(--soft)}
/* product-specific facts (mortgage balance, coverage wanted, savings, etc.) */
.lead-extras{display:flex;flex-wrap:wrap;gap:5px;margin-top:7px}
.lead-extras .lx{font-size:11px;color:var(--ivory);background:var(--black);
  border:1px solid var(--line-soft);border-radius:4px;padding:2px 7px;line-height:1.5;white-space:nowrap}
.lead-extras .lxk{color:var(--mute);text-transform:uppercase;letter-spacing:0.04em;font-size:9.5px;font-weight:700}
.status{background:var(--black);color:var(--ivory);border:1px solid var(--line-soft);font-family:'Mulish',sans-serif;font-size:12px;font-weight:700;padding:7px 8px;border-radius:0;cursor:pointer}
.status:focus{outline:none;border-color:var(--silver)}
.status.s-NEW{color:var(--silver-bright)} .status.s-CONTACTED{color:var(--warn)}
.status.s-NOPICKUP{color:var(--mute)} .status.s-APPOINTMENT{color:var(--warn)}
.status.s-SOLD{color:var(--good)} .status.s-DEAD{color:var(--bad)}
.rfbtn{background:none;border:1px solid var(--line);color:var(--soft);font-family:'Mulish',sans-serif;font-size:10.5px;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;padding:7px 10px;cursor:pointer;white-space:nowrap}
.rfbtn:hover:not(:disabled){color:var(--bad);border-color:var(--bad)}
.rfbtn:disabled{opacity:.4;cursor:not-allowed}
.flagged{font-size:10.5px;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;color:var(--warn)}
.notesbtn{background:none;border:none;color:var(--mute);font-size:11.5px;cursor:pointer;text-decoration:underline;padding:0;font-family:'Mulish',sans-serif}
.empty{padding:46px 22px;text-align:center;color:var(--mute);font-size:14px;line-height:1.8}
.empty b{color:var(--soft)}

.foot-note{margin-top:18px;font-size:11.5px;color:var(--mute);line-height:1.7}

/* ===== LEADS + RIGHT-RAIL LAYOUT ===== */
.leads-layout{display:grid;grid-template-columns:1fr 280px;gap:16px;align-items:start}
.rail{position:sticky;top:18px;display:flex;flex-direction:column;gap:12px}
.rail-card{background:var(--card);border:1px solid var(--line);padding:18px}
.rail-card.feature{border-color:var(--silver)}
.rail-h{font-size:10px;font-weight:700;letter-spacing:0.14em;text-transform:uppercase;color:var(--mute);margin-bottom:12px}
.roi-big{font-family:'Fraunces',serif;font-size:34px;line-height:1;background:var(--chrome-anim);background-size:300% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;animation:chromeShimmer 4.4s ease-in-out infinite}
.roi-sub{font-size:11px;color:var(--mute);margin-top:4px;letter-spacing:0.03em}
.rail-row{display:flex;justify-content:space-between;align-items:baseline;padding:8px 0;border-bottom:1px solid var(--line-soft);font-size:13px}
.rail-row:last-child{border-bottom:none}
.rail-row .k{color:var(--mute)} .rail-row .v{font-weight:700;color:var(--ivory)}
.rail-row .v.in{color:var(--good)} .rail-row .v.out{color:var(--soft)}
.goalbar{height:7px;background:var(--black);border:1px solid var(--line-soft);margin:10px 0 6px;overflow:hidden}
.goalbar span{display:block;height:100%;background:var(--chrome-btn)}
.goal-txt{font-size:11px;color:var(--mute)}
.editlink{background:none;border:none;color:var(--silver-bright);font-size:11px;cursor:pointer;text-decoration:underline;padding:0;font-family:'Mulish',sans-serif;margin-top:8px}
.sellbtn{background:none;border:1px solid var(--good);color:var(--good);font-family:'Mulish',sans-serif;font-size:10.5px;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;padding:7px 10px;cursor:pointer;white-space:nowrap}
.sellbtn:hover{background:rgba(127,184,154,0.12)}
.premium-tag{font-size:12px;font-weight:700;color:var(--good);white-space:nowrap}
@media (max-width:980px){.leads-layout{grid-template-columns:1fr}.rail{position:static;flex-direction:row;flex-wrap:wrap}.rail-card{flex:1;min-width:220px}}

/* ===== TRACKER PAGE ===== */
.tracker-hero{padding:8px 0 24px}
.tracker-hero h1{font-family:'Fraunces',serif;font-size:30px;font-weight:500;margin-bottom:8px}
.tracker-hero h1 em{font-style:italic;background:var(--chrome-anim);background-size:300% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;animation:chromeShimmer 4.4s ease-in-out infinite}
.tracker-hero p{font-size:14px;color:var(--soft);max-width:640px;line-height:1.7}
.tg-top{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:16px}
.tg-card{background:var(--card);border:1px solid var(--line-soft);padding:20px}
.tg-card.hero{border-color:var(--silver);grid-column:span 1}
.tg-card .lab{font-size:10px;font-weight:700;letter-spacing:0.13em;text-transform:uppercase;color:var(--mute);margin-bottom:8px}
.tg-card .big{font-family:'Fraunces',serif;font-size:30px;line-height:1}
.tg-card .big.in{color:var(--good)} .tg-card .big.out{color:var(--ivory)}
.tg-card .big.roi{background:var(--chrome-anim);background-size:300% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;animation:chromeShimmer 4.4s ease-in-out infinite}
.tg-card .note{font-size:11px;color:var(--mute);margin-top:6px}
.goal-panel{background:var(--card);border:1px solid var(--line);padding:24px;margin-bottom:16px}
.goal-panel h2{font-family:'Fraunces',serif;font-size:18px;font-weight:500;margin-bottom:6px}
.goal-panel .gp-sub{font-size:13px;color:var(--mute);margin-bottom:16px}
.goal-panel .goalbar{height:12px}
.gp-row{display:flex;gap:10px;align-items:center;margin-top:14px;flex-wrap:wrap}
.gp-row input{width:140px;padding:11px 13px;border:1px solid var(--line-soft);background:var(--black);color:var(--ivory);font-family:'Mulish',sans-serif;font-size:14px;border-radius:0}
.gp-row input:focus{outline:none;border-color:var(--silver)}
.gp-row label{font-size:11px;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;color:var(--soft)}
.gp-save{background:var(--chrome-btn);color:var(--black);border:none;font-family:'Mulish',sans-serif;font-size:12px;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;padding:11px 18px;cursor:pointer}
/* ===== GOAL RING (goal-gradient: progress + proximity + reward) ===== */
.ring-wrap{display:flex;gap:30px;align-items:center;flex-wrap:wrap}
.ring{position:relative;flex-shrink:0;width:210px;height:210px}
.ring.mini{width:128px;height:128px}
/* overflow:visible lets the soft glow bleed past the SVG box instead of being
   clipped into a hard rectangle (which read as a cheap GIF border). */
.ring svg{transform:rotate(-90deg);display:block;overflow:visible}
.ring .track{fill:none;stroke:var(--line-soft);stroke-width:14}
.ring.mini .track{stroke-width:10}
.ring .arc{fill:none;stroke:url(#ringGrad);stroke-width:14;stroke-linecap:round;
  transition:stroke-dashoffset 1.2s cubic-bezier(.2,.75,.2,1),filter .6s ease}
.ring.mini .arc{stroke-width:10}
/* near goal: a soft, feathered halo (two stacked shadows = smooth falloff) */
.ring.glow .arc{filter:drop-shadow(0 0 6px rgba(233,236,239,0.42)) drop-shadow(0 0 15px rgba(233,236,239,0.20))}
/* goal hit: the halo breathes, gently */
.ring.hit .arc{animation:ringPulse 2.4s ease-in-out infinite}
@keyframes ringPulse{
  0%,100%{filter:drop-shadow(0 0 5px rgba(233,236,239,0.40)) drop-shadow(0 0 12px rgba(233,236,239,0.18))}
  50%{filter:drop-shadow(0 0 10px rgba(233,236,239,0.58)) drop-shadow(0 0 24px rgba(233,236,239,0.30))}
}
.ring .tick{stroke:var(--black);stroke-width:3}
.ring .ctr{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:0 16px}
.ring .pct{font-family:'Fraunces',serif;font-size:42px;line-height:1;background:var(--chrome-anim);background-size:300% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;animation:chromeShimmer 4.4s ease-in-out infinite}
.ring.mini .pct{font-size:26px}
.ring .ctr .lbl2{font-size:9.5px;letter-spacing:0.13em;text-transform:uppercase;color:var(--mute);margin-top:4px}
.ring.mini .ctr .lbl2{font-size:8.5px;margin-top:2px}
.ring .hit-badge{display:none;font-family:'Fraunces',serif;font-style:italic;font-size:17px;color:var(--good)}
.ring.hit .pct,.ring.hit .lbl2{display:none}
.ring.hit .hit-badge{display:block}
.ring-side{flex:1;min-width:230px}
.ring-side .togo{font-family:'Fraunces',serif;font-size:23px;color:var(--ivory);line-height:1.3;margin-bottom:6px}
.ring-side .togo b{color:var(--good)}
.ring-side .togo .almost{color:var(--silver-bright);font-style:italic}
.ring-side .breakdown{font-size:13px;color:var(--mute);line-height:1.9;margin-top:8px}
.ring-side .breakdown b{color:var(--ivory);font-weight:700}
.milestones{display:flex;gap:6px;margin-top:14px}
.milestones .ms{flex:1;text-align:center;font-size:9px;font-weight:700;letter-spacing:0.06em;color:var(--mute);padding-top:8px;border-top:2px solid var(--line-soft)}
.milestones .ms.done{color:var(--silver-bright);border-top-color:var(--silver)}

/* ===== ROUTING PREFERENCES (agent picks active states / verticals) ===== */
.prefs{background:var(--card);border:1px solid var(--line-soft);padding:20px;margin-bottom:16px}
.prefs h2{font-family:'Fraunces',serif;font-size:16px;font-weight:500;margin-bottom:6px}
.prefs .pf-sub{font-size:13px;color:var(--mute);margin-bottom:14px;line-height:1.6}
.toggle-row{display:flex;gap:8px;flex-wrap:wrap;margin:6px 0 16px}
.toggle{border:1px solid var(--line-soft);color:var(--mute);font-size:12px;font-weight:700;letter-spacing:0.04em;padding:8px 14px;cursor:pointer;user-select:none;background:var(--black);transition:all .12s}
.toggle.on{border-color:var(--silver);color:var(--silver-bright);background:var(--gold-dim,rgba(174,180,188,0.12))}
.toggle:hover{border-color:var(--silver)}
.pf-label{font-size:10px;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;color:var(--soft);margin-bottom:4px}
.pf-note{font-size:11.5px;color:var(--mute);margin-top:4px}

.tg-states{background:var(--card);border:1px solid var(--line-soft);padding:20px}
.tg-states h2{font-family:'Fraunces',serif;font-size:16px;font-weight:500;margin-bottom:8px}
.state-chips{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0}
.state-chip{border:1px solid var(--silver);color:var(--silver-bright);font-size:12px;font-weight:700;letter-spacing:0.04em;padding:6px 12px}
@media (max-width:860px){.tg-top{grid-template-columns:1fr 1fr}}

/* responsive: cards on phones */
@media (max-width:860px){
  .shell{padding:20px 14px 50px}
  .stats{grid-template-columns:repeat(3,1fr);gap:8px}
  .stat{padding:12px 12px}
  .stat .n{font-size:22px}
  table,thead,tbody,tr,td,th{display:block}
  thead{display:none}
  tr{border-bottom:1px solid var(--line);padding:12px 8px}
  td{border:none;padding:5px 8px}
  .topbar{padding:12px 14px}
  .topbar .who span.email{display:none}
}
