
/* assets/sip.css — calculator-scoped styles. Depends on assets/style.css being loaded first. */
.sip2 h1{margin-bottom:6px}
.sip2 p.lead{color:#374151}

/* Layout */
.sip2-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:16px}
@media(max-width:1024px){.sip2-grid{grid-template-columns:1fr}}

/* Input rows: rely on global .card spacing; keep only structure */
.sip2 .row{display:grid;grid-template-columns:1fr 220px;gap:12px;align-items:center;padding:16px;border:1px solid #e5e7eb;border-radius:10px;background:#fff;margin:10px 0}
.sip2 .row-left label{font-weight:600;color:#111827;display:block;margin-bottom:8px}

/* Right-side number inputs styled like rounded grey boxes */
.sip2 .right-input{display:flex;align-items:center;justify-content:flex-end;gap:8px}
.sip2 .right-input .prefix,.sip2 .right-input .suffix{color:#6b7280;font-weight:600}
.sip2 .ui-input{width:160px;padding:10px 12px;border:1px solid #e5e7eb;border-radius:10px;background:#f3f4f6;color:#111827;text-align:right;font-weight:700}
@media(max-width:420px){.sip2 .ui-input{width:130px}}
@media(max-width:360px){.sip2 .ui-input{width:120px}}

/* Sliders: purple accent, neutral track */
.sip2 input[type=range]{-webkit-appearance:none;width:100%;height:10px;border-radius:999px;background:#e5e7eb;outline:none}
.sip2 input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:22px;height:22px;border-radius:50%;background:#fff;border:4px solid #7c3aed;box-shadow:0 1px 3px rgba(0,0,0,.25)}
.sip2 input[type=range]::-moz-range-thumb{width:22px;height:22px;border-radius:50%;background:#fff;border:4px solid #7c3aed}

/* Notes */
.sip2 .mini-note{font-size:13px;color:#6b7280;margin-top:6px}

/* Results */
.sip2 .result-list{display:grid;gap:10px}
.sip2 .result{border:1px solid #e5e7eb;border-radius:10px;background:#fff;padding:14px;text-align:center}
.sip2 .result h4{font-weight:600;color:#6b7280;margin-bottom:6px}
.sip2 .result .val{font-size:20px;font-weight:800;color:#7c3aed}
