/* Perplexity as a research tool (incident.perplexity@web-summit.dinis). Tokens only. The marks are states of a check we ran
   (--ok, --focus, --ink-2, --bad), never weather: no IPMA warning colour here. Never colour alone: each mark has its own
   pattern and its count is written beside it. */
.px { margin: 0 0 20px; }
.px h2 { font-size: 18px; margin: 18px 0 6px; }
.px-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 10px; margin: 0 0 14px; }
.px-tiles .wx-tile b { font: 700 24px/1.1 var(--mono); font-variant-numeric: tabular-nums; display: block; }
.px-rows { display: grid; grid-template-columns: minmax(140px, 22em) minmax(140px, 1fr) max-content; gap: 8px 12px; align-items: center; font-size: 14px; }
.px-rows .name { overflow-wrap: anywhere; }
.px-rows .num { font: 13px var(--mono); font-variant-numeric: tabular-nums; white-space: nowrap; color: var(--ink-2); }
.px-track { display: flex; height: 16px; background: var(--surface-2); border-radius: 3px; overflow: hidden; border: 1px solid var(--line); }
.px-seg { min-width: 2px; height: 100%; }
.px-seg.confirmed, .px-seg.primary { background: var(--ok); }
.px-seg.press { background: repeating-linear-gradient(135deg, var(--focus) 0 4px, color-mix(in srgb, var(--focus) 40%, var(--surface)) 4px 8px); }
.px-seg.unsupported, .px-seg.other { background: repeating-linear-gradient(90deg, var(--ink-2) 0 2px, var(--surface-2) 2px 6px); }
.px-seg.aggregator { background: repeating-linear-gradient(45deg, var(--ink-2) 0 3px, var(--surface-2) 3px 6px); }
.px-seg.wrong { background: var(--bad); }
.px-seg.none_found, .px-seg.not_requested { background: var(--surface); box-shadow: inset 0 0 0 1px var(--line-2); }
.px-legend { display: flex; flex-wrap: wrap; gap: 6px 16px; font-size: 13px; color: var(--ink-2); margin: 8px 0 0; }
.px-legend i { display: inline-block; width: 22px; height: 11px; vertical-align: -1px; margin-right: 5px; border-radius: 2px; }
@media (max-width: 620px) { .px-rows { grid-template-columns: 1fr max-content; } .px-rows .name { grid-column: 1 / -1; margin-top: 6px; font-weight: 600; } }
