/* Type scale widget - live preview list and CSS block. Sample font sizes
   are set per item through the CSSOM by the script. */
.ts-preview { margin-top: 12px; }
.ts-head { margin: 0 0 6px; font-size: .78em; font-weight: 650; text-transform: uppercase; letter-spacing: .06em; color: var(--e-ink-2); }
.ts-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; max-height: 320px; overflow: auto; border: 1px solid var(--e-line); border-radius: var(--e-radius-sm); padding: 8px 10px; }
.ts-item { display: grid; gap: 1px; min-width: 0; }
.ts-tag { font-size: 12px; color: var(--e-ink-3); font-variant-numeric: tabular-nums; }
.ts-sample { line-height: 1.15; color: var(--e-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ts-css { margin-top: 10px; font-size: .8em; white-space: pre; overflow: auto; }