/*
 * REVALY PI UI 1.0A — Leads-aligned unified product shell
 * Presentation-only override. PI auth, quota, API, flow and saved research unchanged.
 * Reference: Revaly Leads UI screenshot provided 2026-10-14.
 */
.pi-shell-leads{
  --bg:#f4f6fd;
  --surface:#fff;
  --surface-2:#f8faff;
  --text:#091e46;
  --muted:#7483a1;
  --line:#dfe7f5;
  --primary:#075cef;
  --primary-2:#134ca9;
  --shadow:0 2px 14px rgba(20,46,90,.025);
  --radius:15px;
  grid-template-columns:220px minmax(0,1fr);
  min-height:100vh;
  background:var(--bg);
  color:var(--text);
}
.pi-shell-leads .pi-sidebar{
  display:flex;
  flex-direction:column;
  position:sticky;
  top:0;
  height:100vh;
  height:100dvh;
  overflow-y:auto;
  overflow-x:hidden;
  padding:0 14px 16px;
  border-right:1px solid #dce4f2;
  background:#fff;
  color:#102f6a;
  scrollbar-width:thin;
  scrollbar-color:#c9d2e0 transparent;
}
.pi-shell-leads .pi-sidebar::-webkit-scrollbar-thumb{background:#c9d2e0}
.pi-shell-leads .pi-sidebar::-webkit-scrollbar-thumb:hover{background:#aabbd1}
.pi-shell-leads .pi-brand{
  display:flex;
  flex-direction:row;
  align-items:center;
  justify-content:flex-start;
  gap:8px;
  margin:0;
  min-height:83px;
  padding:0 5px;
  border-bottom:1px solid #dfe7f3;
}
.pi-shell-leads .pi-brand-logo-wrap{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  width:124px;
  min-width:0;
  min-height:unset;
  height:auto;
  padding:0;
  border:0;
  box-shadow:none;
  background:transparent;
  border-radius:0;
}
.pi-shell-leads .pi-brand-logo{width:100%;height:auto;max-height:36px;object-fit:contain;object-position:left center}
.pi-shell-leads .pi-brand-pill{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
  min-height:28px;
  padding:0 9px;
  border:1px solid #d5e4ff;
  border-radius:999px;
  background:#edf3ff;
  color:#7594c7;
  font-size:10px;
  letter-spacing:.045em;
  font-weight:800;
}
.pi-shell-leads .pi-sidebar-heading{
  margin:26px 8px 16px;
  color:#9aaac9;
  font-size:9px;
  font-weight:800;
  letter-spacing:.15em;
  line-height:1.4;
}
.pi-shell-leads .pi-nav{display:flex;flex-direction:column;gap:5px;width:100%}
.pi-shell-leads .pi-nav-item{
  display:flex;
  align-items:center;
  gap:11px;
  min-height:59px;
  width:100%;
  padding:10px 11px;
  border:1px solid transparent;
  border-radius:12px;
  text-align:left;
  background:transparent;
  color:#10366d;
  font-weight:inherit;
  transition:background .14s ease,border-color .14s ease;
}
.pi-shell-leads .pi-nav-item:hover{background:#f5f8ff;color:#10418a}
.pi-shell-leads .pi-nav-item.active,
.pi-shell-leads .pi-nav-item.active:hover{
  background:#e7efff;
  border-color:#d0e0ff;
  box-shadow:inset 3px 0 0 #1763ff;
  color:#0d4ba5;
}
.pi-shell-leads .pi-nav-item:focus-visible,
.pi-shell-leads .pi-back-link:focus-visible{outline:2px solid #1763ff;outline-offset:2px}
.pi-shell-leads .pi-nav-icon{width:18px;height:18px;flex:0 0 18px;color:#526d98}
.pi-shell-leads .pi-nav-item.active .pi-nav-icon{color:#1763ff}
.pi-shell-leads .pi-nav-copy{display:flex;flex-direction:column;align-items:flex-start;min-width:0;gap:2px;line-height:1.2}
.pi-shell-leads .pi-nav-copy strong{font-size:11px;font-weight:800;color:#12346c}
.pi-shell-leads .pi-nav-copy small{font-size:10px;color:#8c9fbe;line-height:1.3}
.pi-shell-leads .pi-nav-item.active .pi-nav-copy small{color:#6388c4}
.pi-shell-leads .pi-sidebar-footer{margin-top:auto;padding:14px 0 0}
.pi-shell-leads .pi-sidebar-divider{height:1px;margin:0 0 15px;background:#dfe7f3}
.pi-shell-leads .pi-sidebar-footer-heading{margin:0 8px 10px;font-size:9px;font-weight:800;letter-spacing:.12em;color:#98a8c6}
.pi-shell-leads .pi-back-link{
  display:flex;
  align-items:center;
  gap:10px;
  border-radius:10px;
  color:#244879;
  font-size:12px;
  padding:11px 8px;
  text-decoration:none;
}
.pi-shell-leads .pi-back-link svg{height:16px;width:16px;flex:0 0 16px;color:#59749e}
.pi-shell-leads .pi-back-link:hover{background:#f4f7ff;color:#0b55bc}
.pi-shell-leads .pi-main{min-width:0;padding:0;background:var(--bg)}
.pi-shell-leads .pi-global-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  min-height:82px;
  padding:15px 40px;
  border-bottom:1px solid #dce5f3;
  background:#fff;
}
.pi-shell-leads .pi-global-heading{min-width:0}
.pi-shell-leads .pi-global-eyebrow{color:#8c9fbe;font-size:9px;font-weight:800;letter-spacing:.15em;line-height:1.5}
.pi-shell-leads .pi-global-header h2{margin:3px 0 0;color:#091e46;font-size:23px;font-weight:750;line-height:1.25;letter-spacing:-.035em}
.pi-shell-leads .pi-runtime-badge{
  display:inline-flex;
  flex:0 0 auto;
  align-items:center;
  justify-content:center;
  white-space:nowrap;
  min-height:38px;
  margin:0;
  padding:8px 13px;
  border:1px solid #d6e4fd;
  border-radius:12px;
  color:#174a9a;
  background:#f7faff;
  font-size:11px;
  font-weight:700;
}
.pi-shell-leads .pi-content{width:100%;max-width:1560px;margin:0 auto;padding:32px 40px 64px;min-width:0}
.pi-shell-leads .pi-topbar{margin:0 0 24px;display:block}
.pi-shell-leads .pi-topbar h1{max-width:950px;margin:8px 0 8px;font-size:28px;line-height:1.18;letter-spacing:-.03em;font-weight:800;color:#0a2859}
.pi-shell-leads .pi-topbar p{max-width:880px;font-size:14px;line-height:1.6;color:#8292ad}
.pi-shell-leads .pi-eyebrow{color:#2154b7;letter-spacing:.13em;font-size:10px;font-weight:800}
.pi-shell-leads .pi-panel,
.pi-shell-leads .pi-card{border:1px solid #dfe7f5;border-radius:15px;box-shadow:0 2px 12px rgba(14,42,82,.025);background:#fff}
.pi-shell-leads .pi-panel{padding:22px}
.pi-shell-leads .pi-panel h2{color:#0c295b}
.pi-shell-leads .pi-panel-head{gap:14px}
.pi-shell-leads .pi-field input,
.pi-shell-leads .pi-field select{border-color:#d8e2f1;border-radius:10px;min-height:42px}
.pi-shell-leads .pi-field input:focus,
.pi-shell-leads .pi-field select:focus{border-color:#7ba5ff;box-shadow:0 0 0 3px rgba(17,96,255,.09)}
.pi-shell-leads .pi-btn-secondary{border-radius:11px}
.pi-shell-leads .pi-btn-primary{border-radius:11px}
.pi-shell-leads .pi-30a-how-panel{box-shadow:none}
.pi-shell-leads .pi-30a-how-panel .pi-30a-principle{border-radius:12px}
/* Keep all research steps and saved-detail surfaces inside their existing DOM hierarchy. */
@media(max-width:1100px){
  .pi-shell-leads .pi-global-header{padding-left:24px;padding-right:24px}
  .pi-shell-leads .pi-content{padding:28px 24px 50px}
}
@media(max-width:900px){
  .pi-shell-leads{display:block}
  .pi-shell-leads .pi-sidebar{
    position:relative;
    height:auto;
    min-height:unset;
    padding:0 16px 10px;
    overflow:visible;
    display:flex;
    flex-direction:column;
    border-right:0;
    border-bottom:1px solid #dce4f2;
  }
  .pi-shell-leads .pi-brand{min-height:64px;padding:0 2px 0;border-bottom:0}
  .pi-shell-leads .pi-brand-logo-wrap{width:118px}
  .pi-shell-leads .pi-sidebar-heading{display:none}
  .pi-shell-leads .pi-nav{flex-direction:row;align-items:stretch;gap:7px;width:100%;overflow-x:auto;padding:0 0 4px}
  .pi-shell-leads .pi-nav-item{flex:1 0 auto;min-height:46px;width:auto;padding:7px 10px}
  .pi-shell-leads .pi-nav-copy strong{white-space:nowrap}
  .pi-shell-leads .pi-nav-copy small{display:none}
  .pi-shell-leads .pi-sidebar-footer{display:flex;gap:4px;margin:0;padding:4px 0 0}
  .pi-shell-leads .pi-sidebar-divider,
  .pi-shell-leads .pi-sidebar-footer-heading{display:none}
  .pi-shell-leads .pi-back-link{padding:7px 8px;font-size:10px}
  .pi-shell-leads .pi-back-link svg{height:14px;width:14px;flex-basis:14px}
  .pi-shell-leads .pi-global-header{min-height:75px}
  .pi-shell-leads .pi-topbar{display:block}
  .pi-shell-leads .pi-runtime-badge{margin:0}
}
@media(max-width:600px){
  .pi-shell-leads .pi-global-header{padding:14px 16px;gap:9px;min-height:74px}
  .pi-shell-leads .pi-global-header h2{font-size:19px}
  .pi-shell-leads .pi-runtime-badge{font-size:10px;white-space:normal;text-align:center;max-width:145px;padding:7px 8px;line-height:1.2}
  .pi-shell-leads .pi-content{padding:22px 14px 42px}
  .pi-shell-leads .pi-topbar h1{font-size:25px}
  .pi-shell-leads .pi-topbar p{font-size:13px}
  .pi-shell-leads .pi-panel{padding:17px}
  .pi-shell-leads .pi-nav-item{padding:9px;gap:7px}
  .pi-shell-leads .pi-nav-copy strong{font-size:10px}
}