/* Dunk Calculator (Rectangular Style) */
.dunk-rect *{
  box-sizing:border-box;
  font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,"Helvetica Neue",Arial;
  border-radius:0 !important;
}
.dunk-rect{
  max-width:680px;margin:20px auto;padding:20px;
  background:#f1f5f9;border:1px solid #444;
}
.dunk-rect h2{margin:0 0 14px;font-size:22px;font-weight:700;color:#111;text-align:center}
.dunk-rect .unit-toggle{display:flex;gap:8px;justify-content:center;margin:8px 0 14px}
.dunk-rect .unit-toggle .u{
  padding:10px 12px;border:1px solid #cbd5e1;background:#fff;color:#111;cursor:pointer;
  font-size:14px;font-weight:600;min-width:110px;text-align:center
}
.dunk-rect .unit-toggle .u.active{outline:2px solid #16a34a; outline-offset:-2px}
.dunk-rect .grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.dunk-rect label{display:block;margin:0 0 6px;color:#222;font-weight:600}
.dunk-rect input,.dunk-rect select{
  width:100%;padding:10px 12px;background:#fff;color:#111;border:1px solid #cbd5e1;font-size:15px;
  -webkit-appearance:none;-moz-appearance:none;appearance:none;
}
.dunk-rect .btn{width:100%;padding:12px;border:none;font-size:16px;cursor:pointer}
.dunk-rect .btn-primary{background:#16a34a;color:#fff;font-weight:700}
.dunk-rect .btn-secondary{background:#e5e7eb;color:#111;font-weight:600}
.dunk-rect .actions{display:flex;gap:10px;margin-top:6px}
.dunk-rect .card{margin-top:15px;padding:14px;background:#fff;border:1px solid #e5e7eb;display:none}
.dunk-rect .card h3{margin:0 0 8px;font-size:18px;color:#111}
.dunk-rect .meta{font-size:13px;color:#475569;margin-top:10px;line-height:1.5}
.dunk-rect .note{font-size:13px;color:#334155;margin-top:6px}
.dunk-rect .error{margin-top:8px;font-size:14px;color:#b91c1c;display:none}
.dunk-rect [data-group]{display:none}
.dunk-rect [data-group].on{display:grid}
@media (max-width:560px){.dunk-rect .grid{grid-template-columns:1fr}}