/* ============================================================================
   SIGNAL RAMP + LEADERBOARD + TICKET TILES + FORM DRILLS
   Ported from the boss's 2026-07-28 handoff (§4). Loads AFTER 8-light.css.

   THE GRADIENT IS DELIBERATELY SCOPED PER-VIEW. A board-wide version bled onto
   the QC scorecards and made graded results look decorative — #viewScore is
   excluded on purpose. Do NOT un-scope these selectors.
   ========================================================================== */

:root{
  --sig-blue:#1D4ED8; --sig-blue-lt:#38BDF8;
  --sig-green:#16A34A; --sig-yellow:#F5C518; --sig-red:#E11D2E;
  --sig-ramp:linear-gradient(90deg,#1D4ED8,#38BDF8 28%,#16A34A 58%,#F5C518);
}

/* ── gradient application layer — listed views ONLY, never #viewScore ── */
#viewBoard .pf-card::before, #viewPerf .pf-card::before, #viewFulfil .pf-card::before,
#viewReports .pf-card::before, #viewDialer .pf-card::before, #viewAch .pf-card::before,
#viewAttrib .pf-card::before, #viewIt .pf-card::before{
  content:"";position:absolute;top:0;left:0;right:0;height:4px;
  border-radius:14px 14px 0 0;background:var(--sig-ramp)}
#viewBoard .pf-card, #viewPerf .pf-card, #viewFulfil .pf-card, #viewReports .pf-card,
#viewDialer .pf-card, #viewAch .pf-card, #viewAttrib .pf-card, #viewIt .pf-card{position:relative}

#viewBoard .pf-h .ln, #viewPerf .pf-h .ln, #viewFulfil .pf-h .ln, #viewReports .pf-h .ln,
#viewDialer .pf-h .ln, #viewAch .pf-h .ln, #viewAttrib .pf-h .ln, #viewIt .pf-h .ln{
  background:var(--sig-ramp);opacity:.55;height:2px}

#viewBoard .pf-h h3, #viewPerf .pf-h h3, #viewFulfil .pf-h h3, #viewReports .pf-h h3,
#viewDialer .pf-h h3, #viewAch .pf-h h3, #viewAttrib .pf-h h3, #viewIt .pf-h h3{
  position:relative;padding-left:12px}
#viewBoard .pf-h h3::before, #viewPerf .pf-h h3::before, #viewFulfil .pf-h h3::before,
#viewReports .pf-h h3::before, #viewDialer .pf-h h3::before, #viewAch .pf-h h3::before,
#viewAttrib .pf-h h3::before, #viewIt .pf-h h3::before{
  content:"";position:absolute;left:0;top:52%;transform:translateY(-50%);
  width:5px;height:15px;border-radius:3px;background:var(--sig-ramp)}

#viewBoard .pf-bar i, #viewPerf .pf-bar i, #viewFulfil .pf-bar i, #viewReports .pf-bar i,
#viewDialer .pf-bar i, #viewAch .pf-bar i, #viewAttrib .pf-bar i, #viewIt .pf-bar i,
#viewPerf .pf-barPct i, #viewReports .pf-barPct i, #viewDialer .pf-barPct i{
  background:var(--sig-ramp)}

/* ── closer leaderboard (replaces the closer table on Perf > Sales) ── */
.clb{margin:6px 0 14px}
.clb-podium{display:flex;justify-content:center;align-items:flex-end;gap:18px;margin:8px 0 20px;flex-wrap:wrap}
.clb-pod{display:flex;flex-direction:column;align-items:center;flex:0 1 200px;max-width:220px}
.clb-medal{font-size:30px;line-height:1;margin-bottom:4px}
.clb-pname{font-weight:800;font-size:16px;color:var(--ink);text-align:center;margin-bottom:2px}
.clb-pdeals{font-size:12px;color:var(--ink-faint);margin-bottom:8px}
.clb-pdeals span{color:var(--ink-dim)}
.clb-pcol{width:100%;border-radius:14px 14px 0 0;display:flex;flex-direction:column;align-items:center;
  justify-content:flex-start;padding:14px 8px 10px;position:relative;background:var(--panel-2);
  border:1px solid var(--line);border-bottom:none}
.clb-pod-1 .clb-pcol{background:linear-gradient(180deg,rgba(245,197,24,.20),rgba(245,197,24,.05));border-color:rgba(245,197,24,.55)}
.clb-pod-2 .clb-pcol{background:linear-gradient(180deg,rgba(56,189,248,.16),rgba(56,189,248,.04));border-color:rgba(56,189,248,.45)}
.clb-pod-3 .clb-pcol{background:linear-gradient(180deg,rgba(22,163,74,.14),rgba(22,163,74,.04));border-color:rgba(22,163,74,.4)}
.clb-pscore{font-family:var(--mono);font-size:30px;font-weight:900;color:var(--ink);line-height:1}
.clb-pcomm{font-family:var(--mono);font-size:13px;color:var(--ink-dim);margin-top:4px}
.clb-prank{position:absolute;bottom:8px;font-family:var(--mono);font-size:11px;color:var(--ink-faint)}
.clb-list{display:flex;flex-direction:column;gap:6px}
.clb-row{display:grid;grid-template-columns:36px 1.5fr 2fr repeat(3,78px);gap:10px;align-items:center;
  padding:9px 12px;border:1px solid var(--line);border-radius:11px;background:var(--panel-2)}
.clb-row:hover{border-color:var(--sig-blue-lt)}
.clb-rk{font-family:var(--mono);font-size:14px;font-weight:800;color:var(--ink-faint);text-align:center}
.clb-nm{font-weight:700;font-size:14px;color:var(--ink);display:flex;flex-direction:column}
.clb-nm small{font-weight:600;font-size:10.5px;color:var(--ink-faint);margin-top:2px}
.clb-bar{position:relative;height:20px;border-radius:6px;background:rgba(127,127,127,.14);overflow:hidden;display:flex;align-items:center}
.clb-bar i{position:absolute;left:0;top:0;bottom:0;background:var(--sig-ramp);border-radius:6px}
.clb-bar b{position:relative;margin-left:8px;font-family:var(--mono);font-size:11px;font-weight:800;color:var(--ink)}
.clb-stat{display:flex;flex-direction:column;align-items:center;line-height:1.15}
.clb-stat .v{font-family:var(--mono);font-size:14px;font-weight:800;color:var(--ink)}
.clb-stat .k{font-size:9.5px;text-transform:uppercase;letter-spacing:.08em;color:var(--ink-faint);margin-top:2px}
.clb-foot{display:flex;gap:18px;flex-wrap:wrap;margin-top:12px;padding-top:10px;border-top:1px solid var(--line);
  font-size:12px;color:var(--ink-faint)}
.clb-foot b{color:var(--ink);font-family:var(--mono)}
@media(max-width:900px){.clb-row{grid-template-columns:32px 1.4fr 1.6fr repeat(3,56px);gap:6px}.clb-podium{gap:8px}}

/* ── big stat tiles (Tickets board) ── */
.bt{padding:18px 18px 16px;border:1px solid var(--line);border-radius:16px;background:var(--panel-2);
  position:relative;overflow:hidden}
.bt-big{font-family:var(--mono);font-weight:900;font-size:40px;line-height:1;letter-spacing:-.02em}
.bt-lab{font-size:13px;font-weight:800;color:var(--ink);margin-top:8px;line-height:1.15}
.bt-sub{font-size:11.5px;font-weight:600;color:var(--ink-faint);margin-top:5px;line-height:1.3}

/* ── tickets / urgent watch ── */
#viewUrgent .urg-tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px;margin:10px 0 6px}
#viewUrgent .urg-tiles .bt{padding:22px 22px 20px;border-radius:18px}
#viewUrgent .urg-tiles .bt::after{content:"";position:absolute;top:0;left:0;right:0;height:5px;
  background:var(--sig-ramp);border-radius:18px 18px 0 0}
#viewUrgent .urg-tiles .bt-big{font-size:60px;line-height:.95;letter-spacing:-1px}
#viewUrgent .urg-tiles .bt-lab{font-size:14px;text-transform:uppercase;letter-spacing:.03em;margin-top:6px}
#viewUrgent .pf-h .ln{background:var(--sig-ramp);opacity:.55;height:2px}
.urg-dept{display:flex;flex-wrap:wrap;gap:8px;margin:6px 0 14px}
.urg-dchip{display:inline-flex;align-items:center;gap:7px;padding:7px 13px;border-radius:99px;
  border:1px solid var(--line);background:var(--panel-2);font-size:12.5px;font-weight:700;color:var(--ink)}
.urg-dchip b{font-family:var(--mono);font-size:14px}
.urg-dchip.hot{border-color:var(--sig-red);color:var(--fail)}

/* ── card-per-record drill (dialer cap tiles) ── */
.wgform{display:flex;flex-direction:column;gap:10px;padding:2px 0}
.wgf-card{border:1px solid var(--line);border-left:4px solid var(--brand);border-radius:12px;
  padding:12px 14px;background:var(--panel-2);transition:border-color .12s}
.wgf-card:hover{border-left-color:var(--sig-blue-lt)}
.wgf-head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:8px;
  border-bottom:1px solid var(--line);padding-bottom:6px}
.wgf-name{font-weight:800;font-size:15px;color:var(--ink)}
.wgf-calls{font-family:var(--mono);font-size:12px;color:var(--ink-faint)}
.wgf-line{display:flex;justify-content:space-between;align-items:center;padding:4px 0;font-size:13px}
.wgf-k{color:var(--ink-dim);font-weight:600}
.wgf-v{font-family:var(--mono);font-weight:800;color:var(--ink)}

/* ── dialer seat table: bigger names + numbers (handoff §3.6) ── */
#viewDialer #dtBody td{font-size:13.5px}
#viewDialer #dtBody td.nm{font-size:15px;font-weight:800}
#viewDialer #dtBody td[style*="font-weight:700"]{font-size:15px}

/* ── Live Board uses .panel/.phead (not .pf-h/.pf-card), so the ramp needs its
      own selectors here — #viewBoard is in the handoff's scope list ── */
#viewBoard .phead h2{position:relative;padding-left:12px}
#viewBoard .phead h2::before{content:"";position:absolute;left:0;top:52%;transform:translateY(-50%);
  width:5px;height:14px;border-radius:3px;background:var(--sig-ramp)}
#viewBoard .panel{position:relative;overflow:hidden}
#viewBoard .panel::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--sig-ramp)}
#viewBoard .missed-rail{position:relative;overflow:hidden}
#viewBoard .missed-rail::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--sig-ramp)}