.calc { display:grid; grid-template-columns:minmax(260px,360px) 1fr; gap:20px; align-items:start; }
.form { background:#fff; border:1px solid var(--line); border-radius:12px; padding:16px; }
.form label { display:block; margin-bottom:12px; font-weight:600; font-size:.92rem; }
.form label.opt { font-weight:400; }
.form select, .form input[type=number] { display:block; width:100%; margin-top:4px; padding:8px 10px; border:1px solid #cbd5e1; border-radius:8px; font:inherit; background:#fff; font-weight:400; }
.form details { margin-top:6px; } .form summary { cursor:pointer; margin-bottom:8px; }
.result { background:#fff; border:1px solid var(--line); border-radius:12px; padding:16px; min-width:0; }
.verdict { font-size:1.3rem; font-weight:700; padding:12px 14px; border-radius:10px; }
.verdict small { display:block; font-weight:400; font-size:.95rem; margin-top:4px; }
.v-fits { background:#dcfce7; color:#14532d; } .v-offload { background:#fef3c7; color:#713f12; } .v-no { background:#fee2e2; color:#7f1d1d; }
.bars { margin:14px 0; } .bar { display:flex; height:26px; border-radius:6px; overflow:hidden; background:#f1f5f9; position:relative; }
.bar span { display:block; height:100%; } .seg-w { background:#2563eb; } .seg-kv { background:#7c3aed; } .seg-o { background:#94a3b8; }
.bar .cap { position:absolute; top:-4px; bottom:-4px; width:2px; background:#0f172a; }
.legend { margin-top:6px; }
.math { background:#0f172a; color:#e2e8f0; padding:12px; border-radius:8px; overflow:auto; font-size:.85rem; white-space:pre-wrap; }
td.fits { color:#15803d; font-weight:600; } td.offload { color:#a16207; font-weight:600; } td.no { color:#b91c1c; font-weight:600; }
tr.sel { background:#eff6ff; }
@media (max-width:800px) { .calc { grid-template-columns:1fr; } }