/**
 * PlaidCars — UAE Tesla Market Report (MR-3). Self-contained, brand-token styled.
 * Reads the brand tokens (--pc-red / --pc-charcoal / --pc-font-*) from the theme's
 * site-wide brand-tokens.css, with safe fallbacks so it never renders unstyled.
 * Mobile-first; no fixed heights → no CLS.
 */
.pc-mr {
    font-family: var(--pc-font-body, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif);
    color: var(--pc-charcoal, #161616);
    max-width: 920px;
    margin: 0 auto;
}
.pc-mr--preview { border: 1px dashed var(--pc-red, #990000); border-radius: var(--pc-radius, 6px); padding: 12px; }
.pc-mr--preview > p:first-child { margin-top: 0; font-size: 13px; }

.pc-mr__head { margin-bottom: 14px; }
.pc-mr__title {
    font-family: var(--pc-font-display, sans-serif);
    font-weight: 800;
    font-size: clamp(22px, 4.5vw, 32px);
    line-height: 1.1;
    margin: 0 0 4px;
    color: var(--pc-charcoal, #161616);
}
.pc-mr__freshness { font-size: 13px; color: #666; margin: 0; }

.pc-mr__cards { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; margin: 16px 0; }
@media (min-width: 600px) { .pc-mr__cards { grid-template-columns: repeat(4, 1fr); } }
.pc-mr__card { background: #fafafa; border: 1px solid #ececec; border-radius: var(--pc-radius, 6px); padding: 12px; text-align: center; }
.pc-mr__big {
    display: block;
    font-family: var(--pc-font-num, "Saira Semi Condensed", system-ui, sans-serif);
    font-size: clamp(19px, 4vw, 26px);
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    color: var(--pc-charcoal, #161616);
}
.pc-mr__cap { display: block; font-size: 12px; color: #666; margin-top: 2px; }

.pc-mr__scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.pc-mr__table { width: 100%; border-collapse: collapse; font-size: 14px; margin: 8px 0 4px; }
.pc-mr__table th, .pc-mr__table td { padding: 8px 10px; border-bottom: 1px solid #eee; text-align: left; white-space: nowrap; }
.pc-mr__table th { font-size: 12px; text-transform: uppercase; letter-spacing: 0.04em; color: #888; font-weight: 600; }
.pc-mr__table th:not(:first-child), .pc-mr__table td.pc-num { text-align: right; }
.pc-mr__table .pc-num { font-family: var(--pc-font-num, system-ui, sans-serif); font-variant-numeric: tabular-nums; }
.pc-mr__model { font-weight: 600; }

.pc-mr__figure { margin: 18px 0; }
.pc-mr__figure figcaption { font-size: 12px; color: #888; margin-bottom: 6px; }
.pc-mr-chart { width: 100%; height: auto; display: block; }
.pc-mr-chart__bar { fill: var(--pc-red, #990000); }
.pc-mr-chart__lbl { font-size: 12px; fill: var(--pc-charcoal, #161616); }
.pc-mr-chart__val { font-size: 11px; fill: #666; font-family: var(--pc-font-num, system-ui, sans-serif); }

.pc-mr__mover { font-size: 13px; color: #444; margin: 8px 0 0; }
.pc-mr__method { font-size: 12px; color: #777; margin-top: 14px; padding-top: 10px; border-top: 1px solid #eee; }
.pc-mr__empty { color: #888; }

/* Market Index matrix — the per-row sample size (n=) is the transparency layer. */
.pc-matrix__n { color: var(--pc-faint, #999); font-size: 12px; }
