.position-sizer-root { display: grid; gap: var(--s5); }
.position-sizer-root .w-note { margin: var(--s3) 0 0; font-size: var(--fs-small); line-height: 1.5; }
.position-sizer-root .position-sizer-controls { display: grid; gap: var(--s4) var(--s6); grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr)); align-items: start; }
.position-sizer-root .position-sizer-outs { display: grid; gap: var(--s4); grid-template-columns: repeat(auto-fit, minmax(min(100%, 11rem), 1fr)); }
.position-sizer-root .position-sizer-warn { margin: calc(-1 * var(--s3)) 0 0; color: var(--down); font-weight: 700; }
/* losses in a row: the readout, then a strip of blocks (one block per losing trade), no frame around them */
.position-sizer-root .position-sizer-halve { display: grid; gap: var(--s3); }
.position-sizer-root .position-sizer-halve .w-note { margin: 0; }
.position-sizer-root .position-sizer-strip { display: flex; flex-wrap: wrap; gap: 3px; }
.position-sizer-root .position-sizer-block { width: 10px; height: 14px; background: var(--mist-2); transform: scale(.6); transition: transform .3s var(--ease), background-color .3s; }
.position-sizer-root .position-sizer-block.is-on { background: var(--ink); transform: none; }
@media (prefers-reduced-motion: reduce) { .position-sizer-root .position-sizer-block { transition: none; } }