
.tool-card{background:#fff;border:1px solid #d9e2e8;border-radius:12px;padding:1.25rem;margin:1rem 0}
.tool-form{display:grid;gap:1rem}
.tool-field label{display:block;font-weight:700;margin-bottom:.35rem;color:#0f3b5c}
.tool-field .hint{font-weight:400;font-size:.95rem;color:#334155}
.tool-row{display:flex;gap:.5rem;align-items:center;flex-wrap:wrap}
.tool-row input{flex:1 1 7rem;min-height:48px;font-size:1rem;padding:.5rem .6rem;border:1.5px solid #0f3b5c;border-radius:8px;background:#fff;color:#14232e}
.tool-row .unit{font-weight:700;color:#0f3b5c}
.tool-error{color:#9b1c1c;font-weight:700;margin:.25rem 0 0}
.tool-btn{display:inline-block;min-height:48px;line-height:48px;padding:0 1.5rem;background:#e5a100;color:#14232e;font-weight:800;font-size:1.05rem;border:none;border-radius:8px;cursor:pointer;text-decoration:none;text-align:center}
.tool-btn:hover,.tool-btn:focus{text-decoration:underline}
.tool-result{background:#fff;border:2px solid #e5a100;border-radius:12px;padding:1.25rem;margin:1rem 0;color:#14232e}
.tool-result h3{color:#0f3b5c;margin-top:0}
.tool-result .tool-size{font-size:1.4rem;font-weight:800;color:#0f3b5c}
.tool-result ul{margin:.5rem 0;padding-left:1.25rem}
.tool-diagram{background:#fff;border:1px solid #d9e2e8;border-radius:12px;padding:1rem;margin:1rem 0}
.tool-diagram svg{width:100%;height:auto;display:block}
.tool-table{width:100%;border-collapse:collapse;margin:1rem 0}
.tool-table th,.tool-table td{border:1px solid #d9e2e8;padding:.5rem .6rem;text-align:left}
.tool-table th{background:#0f3b5c;color:#fff}
@media (min-width:700px){.tool-form{grid-template-columns:1fr 1fr}.tool-form .tool-full{grid-column:1/-1}}

@media (max-width:520px){.tool-diagram{overflow-x:auto}.tool-diagram svg{min-width:480px}.tool-table{font-size:.9rem}.tool-table th,.tool-table td{padding:.4rem .5rem}}
