.it-lead-planner{
  --it-bg:#ffffff; --it-fg:#111316; --it-muted:#6b7280;
  --it-border:#e5e7eb; --it-surface:#fafafa; --it-elev:#f8fafc;
  --it-ac:#4a154b; --it-gap:14px;
  font: 400 14px/1.45 "Fields Light", system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";
  color:var(--it-fg); background:var(--it-bg);
  border:1px solid var(--it-border); border-radius:14px; padding:16px;
  box-shadow:0 1px 8px rgba(0,0,0,.03);
}
@media (prefers-color-scheme: dark){
  .it-lead-planner{ --it-bg:#0b0d10; --it-fg:#e5e7eb; --it-muted:#9ca3af; --it-border:#1f2937; --it-surface:#111418; --it-elev:#0e1115; box-shadow:none; }
}
.dark .it-lead-planner{
  --it-bg:#0b0d10; --it-fg:#e5e7eb; --it-muted:#9ca3af; --it-border:#1f2937; --it-surface:#111418; --it-elev:#0e1115; box-shadow:none;
}

/* Force visible heading in light mode even if theme overrides */
.it-lead-planner h3{ margin:.25rem 0 1rem; font-weight:700; font-size:18px; letter-spacing:.2px; color:var(--it-fg) !important; }
.it-badge{display:inline-block; font-size:11px; color:#fff; background:var(--it-ac); padding:2px 8px; border-radius:999px; vertical-align:middle}

.it-grid{display:grid; grid-template-columns: 1fr 220px 110px; gap:10px var(--it-gap); align-items:center}
.it-grid .note{grid-column:1/-1; margin-top:-6px; color:var(--it-muted); font-size:12px}
.it-row{display:contents}

.it-input{display:flex; align-items:center; gap:8px; background:var(--it-surface); border:1px solid var(--it-border); border-radius:10px; padding:8px 10px}
.it-input input{all:unset; width:100%; font:inherit; color:inherit}
.it-unit{color:var(--it-muted); font-weight:600}

.it-calc{ align-self:stretch; display:flex; align-items:center; justify-content:center;
  background:var(--it-ac); color:#fff; font-weight:700; border-radius:10px; border:none;
  cursor:pointer; padding:10px 12px; transition:transform .06s ease, filter .2s ease;
}
.it-calc:active{ transform: translateY(1px); }
.it-calc:focus-visible{ outline:2px solid #fff2; outline-offset:2px }

.it-out{background:var(--it-elev); border:1px dashed var(--it-border); border-radius:10px; padding:10px 12px}
.it-out strong{font-weight:700}
.it-muted{color:var(--it-muted)}
.it-hr{height:1px; background:linear-gradient(90deg,var(--it-border),transparent); margin:12px 0}
.it-two{display:grid; grid-template-columns: repeat(3,1fr); gap:10px}
.it-kpi{border:1px solid var(--it-border); border-radius:12px; padding:12px; background:var(--it-surface)}
.it-kpi .k{font-size:12px; color:var(--it-muted)}
.it-kpi .v{font-weight:800; font-size:20px}
.it-foot{font-size:12px; color:var(--it-muted); margin-top:8px}

@media (max-width:860px){ .it-grid{grid-template-columns: 1fr 1fr} .it-calc{grid-column:1/-1} }
@media (max-width:640px){ .it-grid{grid-template-columns:1fr} .it-two{grid-template-columns:1fr} }