.percent-tool{border:1px solid var(--line);border-radius:var(--radius);background:var(--bg);margin:22px 0 10px;padding:22px 20px}.percent-tool h2{margin:0 0 6px;font-size:1.25rem}.percent-lead{color:var(--muted);margin:0 0 18px}.percent-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;display:grid}.percent-card{border:1px solid var(--line);border-radius:12px;padding:16px}.percent-card h3{margin:0 0 12px;font-size:1rem}.percent-field{flex-direction:column;gap:5px;margin-top:9px;display:flex}.percent-field label{font-size:.86rem;font-weight:700}.percent-field input{border:1px solid var(--line);background:var(--bg);width:100%;min-height:44px;color:var(--fg);font:inherit;border-radius:9px;padding:8px 10px}.percent-field input:focus-visible{border-color:var(--accent);outline:3px solid color-mix(in srgb, var(--accent) 55%, transparent)}.percent-result,.percent-empty-hint,.percent-error{min-height:24px;margin:13px 0 0;font-weight:700}.percent-result{color:var(--accent)}.percent-empty-hint{color:var(--muted);font-size:.88rem}.percent-error{color:#b3261e;font-size:.88rem}.percent-privacy{color:var(--muted);margin:16px 0 0;font-size:.82rem}@media (max-width:600px){.percent-tool{padding:16px 14px}.percent-grid{grid-template-columns:1fr}.percent-card{padding:14px}}