.percentage-panel{background:#fff}.percentage-modes,.percentage-operation{min-width:0;margin:0 0 22px;padding:0;border:0}.percentage-modes legend,.percentage-operation legend{margin-bottom:8px;font-size:13px;font-weight:750}.percentage-modes>div{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.percentage-operation>div{display:flex;flex-wrap:wrap;gap:8px}.percentage-modes label,.percentage-operation label{position:relative;min-width:0;cursor:pointer}.percentage-modes input,.percentage-operation input{position:absolute;opacity:0;width:1px;height:1px}.percentage-modes span,.percentage-operation span{display:grid;place-items:center;height:100%;padding:12px 10px;border:1px solid var(--line);border-radius:9px;text-align:center;font-size:13px;font-weight:700;transition:background .15s,border-color .15s}.percentage-modes input:checked+span,.percentage-operation input:checked+span{background:var(--green);border-color:var(--green);color:#fff}.percentage-modes input:focus-visible+span,.percentage-operation input:focus-visible+span{outline:2px solid var(--green);outline-offset:3px}.percentage-modes label:hover span,.percentage-operation label:hover span{border-color:var(--green)}.percentage-question{margin:0 0 16px;font-size:21px;line-height:1.35}.percentage-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.percentage-hint{margin:10px 0 0;color:var(--muted);font-size:12px}.percentage-result{margin-top:22px;padding:22px;border:1px solid color-mix(in srgb,var(--green) 35%,var(--line));border-radius:12px;background:var(--mint)}.percentage-result h3{margin:0;font-size:14px;font-weight:700}.percentage-value{margin:5px 0 10px;color:var(--green);font-size:clamp(30px,4vw,44px);font-weight:800;line-height:1.2;overflow-wrap:anywhere}.percentage-context{margin:8px 0;font-size:14px}.percentage-calculation{margin:12px 0 0;padding-top:12px;border-top:1px solid color-mix(in srgb,var(--green) 18%,transparent);color:var(--muted);font-size:14px;overflow-wrap:anywhere}.percentage-formula{padding:14px 18px;border-left:3px solid var(--green);border-radius:0 8px 8px 0;background:var(--mint);overflow-wrap:anywhere}.percentage-toc{display:flex;flex-wrap:wrap;gap:8px 18px;margin:0 0 28px;font-size:14px}.percentage-toc a{color:var(--green);text-decoration:underline;text-underline-offset:3px}@media (max-width:640px){.percentage-modes>div{grid-template-columns:repeat(2,minmax(0,1fr))}.percentage-fields{grid-template-columns:minmax(0,1fr)}.percentage-result{padding:18px 14px}.percentage-question{font-size:19px}}