/* Калькулятор ER — поверх style.css и doc.css, те же токены. */
.er-calc { display: grid; gap: 18px; margin: 10px 0 14px; padding: 24px; border-radius: var(--radius);
  background: radial-gradient(600px 260px at 0% 0%, rgba(139,92,246,.18), transparent 70%), var(--card);
  border: 1px solid var(--line2); }
.er-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.er-fields label { display: grid; gap: 6px; }
.er-fields label.wide { grid-column: 1 / -1; }
.er-fields span { font: 700 14px "Onest"; color: var(--sub); }
.er-fields em { font-style: normal; font-weight: 500; color: var(--dim); }
.er-fields input { width: 100%; font: 600 17px "Onest"; color: var(--text); background: rgba(0,0,0,.28);
  border: 1px solid var(--line); border-radius: 14px; padding: 13px 16px; outline: none; transition: border-color .2s, box-shadow .2s; }
.er-fields input:focus { border-color: var(--violet); box-shadow: 0 0 0 4px rgba(139,92,246,.16); }
.er-fields input::placeholder { color: var(--dim); }
.er-out { padding: 20px; border-radius: 18px; background: rgba(0,0,0,.25); border: 1px solid var(--line); }
.er-res { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.er-res small { display: block; font: 600 14px "Onest"; color: var(--dim); }
.er-res b { display: block; font: 800 clamp(34px, 6vw, 46px)/1.1 "Onest"; letter-spacing: -0.03em; margin-top: 4px;
  background: var(--grad-text); -webkit-background-clip: text; background-clip: text; color: transparent; }
.er-scale { position: relative; height: 10px; margin: 18px 0 12px; border-radius: 5px;
  background: linear-gradient(90deg, #fb7185 0%, #fbbf24 30%, #34d399 60%, #8b5cf6 100%); }
.er-scale i { position: absolute; top: 50%; left: 0; width: 22px; height: 22px; margin: -11px 0 0 -11px; border-radius: 50%;
  background: #fff; box-shadow: 0 0 0 4px rgba(10,6,23,.8), 0 4px 16px rgba(0,0,0,.5); opacity: 0; transition: left .35s, opacity .2s; }
.er-verdict { margin: 0; font-size: 16px !important; color: var(--sub) !important; }
.er-verdict b { color: var(--text); }
.er-alt { font-size: 15px !important; color: var(--dim) !important; margin: 0 0 10px; }
@media (max-width: 560px) {
  .er-calc { padding: 16px; }
  .er-fields, .er-res { grid-template-columns: 1fr; }
}