.pip-calculator-root { display: grid; gap: var(--s5); }
.pip-calculator-root .w-note { margin: var(--s3) 0 0; font-size: var(--fs-small); line-height: 1.5; }
.pip-calculator-root .pip-calculator-controls { display: grid; gap: var(--s4) var(--s6); grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr)); }
.pip-calculator-root .pip-calculator-outs { display: grid; gap: var(--s4); grid-template-columns: repeat(auto-fit, minmax(min(100%, 10rem), 1fr)); }
/* "In words": plain text under a thin ink rule on the left, no panel */
.pip-calculator-root .pip-calculator-formula { margin: 0; padding: 2px 0 2px var(--s3); border-left: 2px solid var(--ink); font: 400 var(--fs-small)/1.5 var(--font-ui); font-variant-numeric: tabular-nums; color: var(--ink); overflow-wrap: anywhere; }
.pip-calculator-root .pip-calculator-compare .w-label { margin: 0 0 var(--s2); font-size: var(--fs-small); line-height: 1.3; }
/* the same move at each size: ruled rows, the current size marked with an ink rule on the left */
.pip-calculator-root .pip-calculator-rows { display: grid; border-top: var(--rule); }
.pip-calculator-root .pip-calculator-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--s1) var(--s3); align-items: center; padding: var(--s2) 0 var(--s2) var(--s3); border-bottom: var(--rule); border-left: 2px solid transparent; }
.pip-calculator-root .pip-calculator-row.is-current { border-left-color: var(--ink); }
.pip-calculator-root .pip-calculator-name { grid-column: 1 / -1; min-width: 0; font: 400 var(--fs-small)/1.3 var(--font-ui); color: var(--ink-2); overflow-wrap: anywhere; }
.pip-calculator-root .pip-calculator-row.is-current .pip-calculator-name { color: var(--ink); font-weight: 700; }
.pip-calculator-root .pip-calculator-track { display: block; min-width: 0; height: 8px; background: var(--mist-2); overflow: hidden; }
.pip-calculator-root .pip-calculator-bar { display: block; height: 100%; min-width: 3px; background: var(--ink); transition: width .45s var(--ease); }
.pip-calculator-root .pip-calculator-row:not(.is-current) .pip-calculator-bar { background: var(--ink-3); }
.pip-calculator-root .pip-calculator-row:not(.is-seen) .pip-calculator-bar { min-width: 0; }
.pip-calculator-root .pip-calculator-val { min-width: 5.5rem; text-align: right; font: 700 var(--fs-ui)/1.2 var(--font-ui); font-variant-numeric: tabular-nums; white-space: nowrap; }
.pip-calculator-root .pip-calculator-row:not(.is-seen) .pip-calculator-val { color: var(--ink-3); font-weight: 400; font-size: var(--fs-small); }
@media (prefers-reduced-motion: reduce) { .pip-calculator-root .pip-calculator-bar { transition: none; } }
