/* fmycar.com/tools/ calculators. Loaded only on calculator pages. Uses the site tokens from site.css. */
.tool{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:28px;align-items:start}
.tool-form{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:22px}
.tool-ex{font-size:.88rem;color:var(--mut);margin:0 0 14px}
.tool-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 16px}
.tool-f[hidden]{display:none}
.tool-f label{display:block;font-weight:700;font-size:.9rem;margin:0 0 4px}
.tool-in{display:flex;align-items:center;border:1px solid #cfcfcf;border-radius:10px;background:#fff;overflow:hidden}
.tool-in:focus-within{border-color:var(--red);box-shadow:0 0 0 3px rgba(181,0,0,.15)}
.tool-in span{padding:0 10px;color:var(--mut);font-weight:600;font-size:.9rem;white-space:nowrap}
.tool-in input{flex:1;min-width:0;border:0;padding:11px 10px;font:inherit;font-size:16px;background:transparent;outline:none}
.tool-in span+input{padding-left:0}
.tool-f .hint{font-size:.8rem;color:var(--mut);margin:4px 0 0}
.tool-tgs,.tool-choice{display:flex;flex-direction:column;gap:8px;margin:16px 0 0}
.tool-choice{flex-direction:row;flex-wrap:wrap;gap:18px;border:0;padding:0;margin:0 0 14px}.tool-choice legend{font-weight:700;font-size:.9rem;margin:0 0 6px;padding:0}
.tool-tg,.tool-choice label{display:flex;gap:8px;align-items:center;font-size:.92rem;cursor:pointer}
.tool-tg input,.tool-choice input{width:18px;height:18px;accent-color:var(--red)}
.tool-res{display:flex;flex-direction:column;gap:16px;position:sticky;top:calc(var(--header-offset) + 8px)}
.tool-out{min-width:0;background:var(--soft);border:1px solid var(--line);border-radius:var(--r);padding:20px}
.tool-out-t{font-weight:800;margin:0 0 8px}
.tool-big{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:12px;border-bottom:2px solid var(--red);padding:0 0 10px;margin:0 0 10px}
.tool-big span{font-weight:700}.tool-big b{font-size:1.6rem;color:var(--red);font-variant-numeric:tabular-nums}
.tool-out dl{margin:0}.tool-out dl div{display:flex;justify-content:space-between;gap:12px;padding:6px 0;border-bottom:1px solid #e9e9e9}
.tool-out dl div:last-child{border-bottom:0}.tool-out dt{color:#333}.tool-out dd{margin:0;font-weight:600;font-variant-numeric:tabular-nums;text-align:right}
.tool-out dl .s dt,.tool-out dl .s dd{font-weight:800}
.tool-out .neg,.tool-big b.neg{color:var(--red)}.tool-big b.pos{color:#1d7a3a}
.tool-flag{margin:12px 0 0;padding:10px 12px;border-radius:10px;font-size:.9rem;background:#fff;border-left:4px solid #999}
.tool-flag.good{border-color:#1d7a3a}.tool-flag.fair{border-color:#c98a00}.tool-flag.high{border-color:var(--red)}
.tool-how{max-width:80ch;padding-left:1.2em}.tool-how li{margin:0 0 10px}
@media(max-width:860px){.tool{grid-template-columns:minmax(0,1fr)}.tool-res{position:static}}
@media(max-width:520px){.tool-grid{grid-template-columns:1fr}.tool-form,.tool-out{padding:16px}.tool-big b{font-size:1.35rem}}
