#root .trade-result,#root :is(.trade-row,.signal-trade-record) .trade-result{display:grid;grid-template-columns:max-content max-content;align-items:baseline;justify-content:start;gap:8px 18px;min-width:0;border-left:0;border-inline-start:0;padding-inline-start:0;text-align:start}
#root .trade-result>span{display:block;grid-column:1;grid-row:1;margin:0;font-size:calc(10px * var(--font-scale))}
#root .trade-result .trade-result-values,#root .trade-result .trade-result-values>.trade-return-breakdown,#root .trade-result .trade-return-breakdown>div{display:contents}
#root .trade-result .trade-result-values>strong{grid-column:1;grid-row:2}
#root .trade-result .trade-return-breakdown dt{grid-column:2;grid-row:1;margin:0;color:var(--muted);font-size:calc(10px * var(--font-scale));font-weight:400;text-align:start;white-space:nowrap}
#root .trade-result .trade-return-breakdown dd.trade-price-change{grid-column:2;grid-row:2;margin:0;font-size:calc(11px * var(--font-scale));line-height:1.4;text-align:start}
#root .trade-result .trade-result-values>.pnl-status{grid-column:1/-1;grid-row:3;justify-content:start}
#root .trade-result .trade-result-values>.pnl-movement{grid-column:1/-1;grid-row:4}

/* Every labelled field in a trade card uses the same label-to-value gap. */
#root .recent-trades .trade-row{--trade-label-gap:8px;--trade-label-line-height:calc(12.5px * var(--font-scale))}
#root .recent-trades .trade-card-body{align-items:start}
#root .recent-trades .trade-metrics>div,#root .recent-trades .trade-financials dl>div{display:flex;flex-direction:column;gap:var(--trade-label-gap)}
#root .recent-trades .trade-metrics dt,#root .recent-trades .trade-financials dt{margin:0}
#root .recent-trades .trade-result{align-items:start;row-gap:var(--trade-label-gap)}
#root .recent-trades .trade-row .trade-result>span{margin:0}
#root .recent-trades .trade-metrics dt,#root .recent-trades .trade-result>span,#root .recent-trades .trade-result .trade-return-breakdown dt{line-height:var(--trade-label-line-height)}

#root .recent-trades .trade-row{--trade-row-value-size:calc(12px * var(--font-scale));--trade-row-value-line-height:1.25}
#root .recent-trades .trade-metrics dd,#root .recent-trades .trade-result .trade-result-values>strong,#root .recent-trades .trade-result .trade-return-breakdown dd.trade-price-change{font-size:var(--trade-row-value-size);line-height:var(--trade-row-value-line-height)}
#root .recent-trades .trade-result .trade-result-values>strong,#root .recent-trades .trade-result .trade-return-breakdown dd.trade-price-change{font-weight:650}
@media(max-width:1100px){#root .recent-trades .trade-row{--trade-row-value-size:calc(11px * var(--font-scale))}}
@media(min-width:1101px) and (max-height:900px){#root .recent-trades .trade-row{--trade-row-value-size:calc(11px * var(--font-scale));--trade-row-value-line-height:1.3}}