/* ============================================================================
   Individual Reports — Styles
   Follows the same design system as rtp-calendar.css
   ============================================================================ */

/* ── Page wrapper ── */
.ir-page {
    --ir-pbar-high: #4ec5d5;
    --ir-target: #2dd4bf;
    --ir-badge-increase: #22c55e;
    --ir-badge-exact: #ffc107;
    --ir-pbar-radius-pill: 999px;

    padding: 0;
}

/* ── Page Layout ── */
.ir-page {
    padding: 0;
}
.ir-page > *:not(.ir-toolbar) {
    margin-left: 24px;
    margin-right: 24px;
}

/* ── Top Toolbar ── */
/* toolbar and title styles inherited from styles.css shared rules */

.ir-player-count {
    font-size: 0.78rem;
    color: var(--text-secondary);
}

.ir-search-input {
    background: var(--surface-raised);
    color: var(--text-primary);
    border: 1px solid var(--ink-line-strong);
    border-radius: var(--radius-pill);
    padding: 8px 14px 8px 36px;
    font-size: 0.85rem;
    font-family: inherit;
    min-width: 220px;
    transition: border-color 0.2s;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23999' stroke-width='2'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: 10px center;
}

.ir-search-input:focus {
    border-color: var(--accent);
    outline: none;
}

.ir-search-input::placeholder {
    color: var(--text-tertiary);
}

.ir-asof-control {
    align-items: center;
    display: inline-flex;
    gap: 8px;
}


.ir-date-input {
    min-width: 132px;
}


/* ═══════════════════════════════════════
   PLAYER GRID (landing page)
   ═══════════════════════════════════════ */

.ir-position-group {
    margin-bottom: 20px;
}

.ir-position-label {
    font-family: var(--font-system);
    font-size: 0.72rem;
    font-weight: 750;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: var(--text-secondary);
    margin-bottom: 10px;
    padding-left: 4px;
}

.ir-player-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 10px;
}

/* Base styles provided by .hub-player-card */
.ir-player-card {
    gap: 7px;
    min-height: 0;
    overflow: hidden;
    padding: 10px 12px;
}

/* C4 compact player card: identity plus only available signals */
.ir-card-top {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 46px;
}

.ir-card-photo-wrap {
    width: 42px;
    height: 42px;
    border-radius: var(--radius-circle);
    background: var(--surface-raised);
    flex-shrink: 0;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px solid var(--ink-line);
}

.ir-card-photo {
    width: 100%;
    height: 100%;
    border-radius: var(--radius-circle);
    object-fit: cover;
    filter: brightness(1.05) contrast(1.05);
}

.ir-card-avatar {
    width: 42px;
    height: 42px;
    border-radius: var(--radius-circle);
    background: var(--surface-chrome);
    color: var(--text-primary);
    font-weight: 800;
    font-size: 0.9rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px solid var(--ink-line);
}

.ir-card-info {
    flex: 1;
    min-width: 0;
}

.ir-card-name {
    color: var(--text-primary);
    font-family: var(--font-system);
    font-size: 0.88rem;
    font-weight: 700;
    letter-spacing: 0;
    line-height: 1.15;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    text-transform: none;
}

.ir-card-meta {
    color: var(--text-secondary);
    font-size: 0.62rem;
    font-weight: 650;
    letter-spacing: 0.16em;
    margin-top: 4px;
    text-transform: uppercase;
}

.ir-card-status {
    align-items: center;
    border: 1px solid color-mix(in srgb, currentColor 16%, transparent);
    border-radius: var(--radius-pill);
    display: inline-flex;
    flex-shrink: 0;
    gap: 7px;
    justify-content: center;
    min-width: 0;
    padding: 5px 9px;
    white-space: nowrap;
    color: var(--text-secondary);
    background: color-mix(in srgb, var(--text-primary) 8%, transparent);
    font-family: inherit;
    font-size: 0.58rem;
    font-weight: 800;
    letter-spacing: 0.16em;
    line-height: 1;
    text-transform: uppercase;
}

.ir-card-status-dot {
    width: 6px;
    height: 6px;
    flex: 0 0 auto;
    border-radius: var(--radius-pill);
    background: currentColor;
}

.ir-card-status.available {
    padding: 2px 0;
    border-color: transparent;
    background: transparent;
    color: var(--text-secondary);
    font-size: 0.68rem;
    font-weight: 650;
    letter-spacing: 0.25px;
    line-height: 1.25;
    text-transform: none;
}

.ir-card-status.available .ir-card-status-dot {
    background: var(--status-available);
}

.ir-card-status.injured {
    background: color-mix(in srgb, var(--status-injured) 18%, transparent);
    color: var(--status-injured);
}

.ir-card-status.recovery {
    background: color-mix(in srgb, var(--status-recovery) 16%, transparent);
    color: var(--status-recovery);
}

.ir-card-status.differentiated {
    background: color-mix(in srgb, var(--status-differentiated) 16%, transparent);
    color: var(--status-differentiated);
}

.ir-card-status.modified {
    background: color-mix(in srgb, var(--status-modified) 16%, transparent);
    color: var(--status-modified);
}

.ir-card-status.illness {
    background: color-mix(in srgb, var(--status-illness) 16%, transparent);
    color: var(--status-illness);
}

.ir-card-status.absent {
    background: color-mix(in srgb, var(--status-absent) 16%, transparent);
    color: var(--status-absent);
}

.ir-card-signals,
.ir-banner-signals {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.ir-card-signals {
    padding-left: 52px;
}

.ir-signal-chip {
    align-items: baseline;
    background: transparent;
    border: 0;
    border-right: 1px solid var(--ink-line);
    color: var(--text-secondary);
    display: inline-flex;
    gap: 5px;
    line-height: 1;
    padding: 2px 9px 2px 0;
    white-space: nowrap;
}

.ir-signal-chip:last-child {
    border-right: 0;
    padding-right: 0;
}

.ir-signal-chip.good {
    color: var(--status-available);
}

.ir-signal-chip.warn {
    color: var(--status-modified);
}

.ir-signal-chip.bad {
    color: var(--status-injured);
}

.ir-signal-chip.load-low {
    color: var(--acwr-low);
}

.ir-signal-chip.neutral {
    color: var(--text-primary);
}

.ir-signal-chip.muted {
    color: var(--text-secondary);
}

.ir-signal-chip.date {
    color: var(--text-tertiary);
}

.ir-signal-label {
    color: var(--text-tertiary);
    font-size: 0.55rem;
    font-weight: 750;
    letter-spacing: 0.13em;
    text-transform: uppercase;
}

.ir-signal-value {
    font-size: 0.68rem;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
}

.ir-signal-unit {
    color: var(--text-secondary);
    font-size: 0.58rem;
    font-weight: 700;
    margin-left: 1px;
}

/* ═══════════════════════════════════════
   PLAYER PROFILE (after clicking a card)
   ═══════════════════════════════════════ */

.ir-back-btn {
    background: transparent;
    border: 1px solid var(--ink-line-strong);
    border-radius: var(--radius-pill);
    color: var(--text-secondary);
    font-family: inherit;
    font-size: 0.8rem;
    padding: 6px 14px;
    min-height: 32px;
    font-weight: 700;
    cursor: pointer;
    transition: background 0.2s, color 0.2s;
}

.ir-back-btn:hover {
    background: var(--accent-soft);
    color: var(--accent);
}


/* ── Profile Banner ── */
.ir-banner {
    background: var(--surface-raised);
    border: 1px solid var(--ink-line);
    border-radius: var(--radius-md);
    padding: 20px 24px;
    display: flex;
    gap: 20px;
    margin-bottom: 16px;
    align-items: center;
    flex-wrap: wrap;
}

.ir-banner-photo {
    width: 72px;
    height: 72px;
    border-radius: var(--radius-circle);
    object-fit: cover;
    flex-shrink: 0;
    background: var(--surface-raised);
    border: 2px solid var(--ink-line);
    filter: brightness(1.05) contrast(1.05);
}

.ir-banner-avatar {
    width: 72px;
    height: 72px;
    border-radius: var(--radius-circle);
    background: var(--surface-raised);
    border: 2px solid var(--ink-line);
    color: var(--text-primary);
    font-weight: 700;
    font-size: 1.3rem;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.ir-banner-info h2 {
    margin: 0;
    font-size: 1.2rem;
    font-weight: 700;
}

.ir-banner-meta {
    display: flex;
    gap: 12px;
    margin-top: 4px;
    font-size: 0.78rem;
    color: var(--text-secondary);
}

.ir-banner-meta > span {
    display: flex;
    align-items: center;
    gap: 4px;
}

.ir-banner-signals {
    margin-left: auto;
    max-width: 56%;
    justify-content: flex-end;
}

.ir-banner-stats {
    margin-left: auto;
    display: flex;
    gap: 16px;
}

.ir-stat-pill {
    text-align: center;
    padding: 8px 18px;
    background: rgba(var(--accent-rgb), 0.08);
    border-radius: var(--radius-pill);
    min-width: 80px;
}

.ir-stat-pill .val {
    font-size: 1.1rem;
    font-weight: 700;
    display: block;
    line-height: 1.1;
}

.ir-stat-pill .lbl {
    font-size: 0.58rem;
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-top: 2px;
}


/* ── Date Range Selector ── */
.ir-range-bar {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 16px;
    padding: 8px 0;
}

.ir-range-label {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.ir-range-select {
    background: var(--surface-raised);
    color: var(--text-primary);
    border: 1px solid var(--ink-line-strong);
    border-radius: var(--radius-sm);
    padding: 6px 12px;
    font-size: 0.8rem;
    font-family: 'Inter', sans-serif;
    cursor: pointer;
    transition: border-color 0.2s;
}

.ir-range-select:focus {
    border-color: var(--accent);
    outline: none;
}

/* ── Sub-tab bar (VALD / KangaTech / Body Comp) ── */
.ir-sub-tab-bar {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 16px;
    flex-wrap: wrap;
}

.ir-sub-tab {
    min-height: 30px;
    padding: 6px 14px;
    font-size: 0.75rem;
    font-weight: 700;
    font-family: inherit;
    color: var(--text-secondary);
    background: transparent;
    border: 1px solid transparent;
    border-radius: var(--radius-pill);
    cursor: pointer;
    transition: background 0.2s, color 0.2s, border-color 0.2s;
}

.ir-sub-tab:hover {
    background: var(--ink-wash);
    color: var(--text-primary);
}

.ir-sub-tab.active {
    background: rgba(var(--accent-rgb), 0.12);
    color: var(--accent);
    border-color: rgba(var(--accent-rgb), 0.30);
}


/* ── Tab Content ── */
.ir-tab-content {
    display: none;
}

.ir-tab-content.active {
    display: block;
}


/* ═══════════════════════════════════════
   RISK & ROBUSTNESS PROFILE
   Hairline-structured evidence view (no cards). Module-scoped bodymap
   tokens below introduce the muscle base fill; everything else composes
   global tokens.
   ═══════════════════════════════════════ */
.rrp-profile {
    --rrp-muscle: #4c4c53;
    --rrp-tint1: color-mix(in srgb, var(--status-injured) 34%, var(--rrp-muscle));
    --rrp-tint2: color-mix(in srgb, var(--status-injured) 52%, var(--rrp-muscle));
    --rrp-tint3: color-mix(in srgb, var(--status-injured) 70%, var(--rrp-muscle));
    margin-bottom: 32px;
}

.rrp-band {
    align-items: center;
    border-bottom: 1px solid var(--ink-line);
    display: flex;
    flex-wrap: wrap;
    gap: 12px 16px;
    justify-content: space-between;
    padding: 14px 0;
}

.rrp-band-sub {
    align-items: center;
    color: var(--text-secondary);
    display: flex;
    font-size: 0.78rem;
    gap: 9px;
}

.rrp-pos {
    color: var(--text-tertiary);
    font-weight: 600;
    letter-spacing: 0.6px;
    text-transform: uppercase;
}

.rrp-sep {
    color: var(--ink-line);
    padding: 0 4px;
}

.rrp-gdot {
    background: var(--status-available);
    border-radius: 50%;
    display: inline-block;
    height: 8px;
    margin-right: 6px;
    width: 8px;
}

.rrp-missing {
    color: var(--text-tertiary);
}

.rrp-band-meta {
    align-items: center;
    color: var(--text-secondary);
    display: flex;
    font-size: 0.78rem;
    gap: 4px;
}

/* ── KPI wall ── */
.rrp-kpis {
    border-bottom: 1px solid var(--ink-line);
    display: flex;
    flex-wrap: wrap;
    gap: 16px 0;
    padding: 26px 0 22px;
}

.rrp-kpi {
    border-left: 1px solid var(--ink-line);
    flex: 1 1 220px;
    min-width: 0;
    padding-left: 28px;
}

.rrp-kpi:first-child {
    border-left: none;
    padding-left: 0;
}

.rrp-kpi-v {
    color: var(--text-primary);
    font-size: 2.3rem;
    font-variant-numeric: tabular-nums;
    font-weight: 700;
    line-height: 1;
}

.rrp-kpi-v small {
    color: var(--text-secondary);
    font-size: 1rem;
    font-weight: 500;
}

.rrp-kpi.warn .rrp-kpi-v {
    color: var(--status-modified);
}

.rrp-kpi-k {
    color: var(--text-tertiary);
    font-size: 0.66rem;
    font-weight: 600;
    letter-spacing: 0.8px;
    margin-top: 8px;
    text-transform: uppercase;
}

.rrp-kpi-f {
    color: var(--text-secondary);
    font-size: 0.72rem;
    line-height: 1.5;
    margin-top: 7px;
}

/* ── Bodymap + priorities ── */
.rrp-body {
    align-items: center;
    border-bottom: 1px solid var(--ink-line);
    display: grid;
    gap: 54px;
    grid-template-columns: 330px minmax(0, 1fr);
    padding: 26px 0 8px;
}

.rrp-bmaps {
    display: flex;
    gap: 14px;
}

.rrp-bfig svg {
    display: block;
    height: auto;
    width: 150px;
}

.rrp-bcap {
    color: var(--text-tertiary);
    font-size: 0.63rem;
    font-weight: 600;
    letter-spacing: 1px;
    margin-top: 6px;
    text-align: center;
    text-transform: uppercase;
}

.rrp-bm-m {
    fill: var(--rrp-muscle);
}

.rrp-bm-t1 {
    fill: var(--rrp-tint1);
}

.rrp-blegend i.rrp-bm-t1 {
    background: var(--rrp-tint1);
}

.rrp-bm-t2 {
    fill: var(--rrp-tint2);
}

.rrp-blegend i.rrp-bm-t2 {
    background: var(--rrp-tint2);
}

.rrp-bm-t3 {
    fill: var(--rrp-tint3);
}

.rrp-blegend i.rrp-bm-t3 {
    background: var(--rrp-tint3);
}

.rrp-bm-num {
    dominant-baseline: central;
    fill: var(--surface-field);
    font-weight: 700;
    text-anchor: middle;
}

.rrp-bmaps {
    position: relative;
}

.rrp-bfig path[data-count]:not([data-count="0"]) {
    cursor: pointer;
}

.rrp-blegend {
    align-items: center;
    color: var(--text-secondary);
    display: flex;
    flex-wrap: wrap;
    font-size: 0.66rem;
    gap: 8px 14px;
    margin-top: 12px;
}

.rrp-blegend-title {
    color: var(--text-tertiary);
    font-weight: 700;
    letter-spacing: 0.8px;
    text-transform: uppercase;
}

.rrp-blegend i {
    border-radius: 2px;
    display: inline-block;
    height: 10px;
    margin-right: 5px;
    vertical-align: -1px;
    width: 10px;
}

.rrp-blegend-note {
    color: var(--text-tertiary);
}

.rrp-bpop {
    background: var(--surface-chrome);
    border: 1px solid var(--ink-line);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-pop);
    max-width: 280px;
    min-width: 210px;
    padding: 12px 14px;
    position: absolute;
    z-index: 30;
}

.rrp-bpop-block + .rrp-bpop-block {
    border-top: 1px solid var(--ink-line);
    margin-top: 10px;
    padding-top: 10px;
}

.rrp-bpop-head {
    align-items: baseline;
    color: var(--text-primary);
    display: flex;
    font-size: 0.78rem;
    font-weight: 700;
    gap: 10px;
    justify-content: space-between;
    margin-bottom: 7px;
}

.rrp-bpop-head span {
    color: var(--text-tertiary);
    font-size: 0.63rem;
    font-weight: 500;
    white-space: nowrap;
}

.rrp-bpop-row {
    align-items: baseline;
    color: var(--text-secondary);
    display: flex;
    font-size: 0.72rem;
    gap: 8px;
    line-height: 1.45;
    padding: 2px 0;
}

.rrp-bpop-cat {
    color: var(--text-tertiary);
    flex: none;
    font-size: 0.58rem;
    font-weight: 700;
    letter-spacing: 0.6px;
    text-transform: uppercase;
    width: 62px;
}

.rrp-adot {
    background: var(--status-modified);
    border-radius: 50%;
    display: inline-block;
    flex: none;
    height: 9px;
    width: 9px;
}

.rrp-sig {
    border-top: 1px solid var(--ink-line);
    padding: 18px 0;
}

.rrp-sig:first-of-type {
    border-top: none;
    padding-top: 0;
}

.rrp-sig-h {
    align-items: center;
    color: var(--text-primary);
    display: flex;
    font-size: 1.12rem;
    font-weight: 700;
    gap: 12px;
}

.rrp-sig-state {
    color: var(--status-modified);
    font-size: 0.66rem;
    font-weight: 700;
    letter-spacing: 0.6px;
    margin-left: auto;
    text-transform: uppercase;
}

.rrp-sig-e {
    color: var(--text-secondary);
    font-size: 0.8rem;
    margin-top: 8px;
    max-width: 640px;
}

.rrp-sig-w {
    color: var(--text-tertiary);
    font-size: 0.68rem;
    margin-top: 8px;
}

/* ── Ledger sections ── */
.rrp-lab {
    align-items: center;
    color: var(--text-secondary);
    display: flex;
    font-size: 0.68rem;
    font-weight: 700;
    gap: 14px;
    letter-spacing: 1.6px;
    margin: 26px 0 4px;
    text-transform: uppercase;
}

.rrp-lab small {
    color: var(--text-tertiary);
    font-size: 0.68rem;
    font-weight: 500;
    letter-spacing: 0.2px;
    text-transform: none;
}

.rrp-lab::after {
    background: var(--ink-line);
    content: '';
    flex: 1;
    height: 1px;
}

.rrp-row {
    align-items: baseline;
    border-top: 1px solid var(--ink-line);
    display: flex;
    gap: 14px;
    padding: 13px 0;
}

.rrp-row:first-of-type {
    border-top: none;
}

.rrp-row-t {
    color: var(--text-primary);
    font-size: 0.85rem;
    font-weight: 600;
    white-space: nowrap;
}

.rrp-row-t span {
    color: var(--text-tertiary);
    font-size: 0.72rem;
    font-weight: 500;
    margin-left: 8px;
}

.rrp-row-fill {
    flex: 1;
}

.rrp-row-r {
    color: var(--text-secondary);
    font-size: 0.75rem;
    font-variant-numeric: tabular-nums;
}

.rrp-gap-row .rrp-row-t {
    color: var(--text-secondary);
    font-weight: 500;
}

.rrp-gap-row .rrp-row-r {
    color: var(--text-tertiary);
    font-size: 0.63rem;
    font-weight: 600;
    letter-spacing: 0.4px;
    text-transform: uppercase;
}

/* percentile track */
.rrp-pbar {
    align-self: center;
    background: var(--ink-line);
    border-radius: var(--radius-pill);
    flex: none;
    height: 4px;
    position: relative;
    width: 200px;
}

.rrp-pbar i {
    background: var(--text-tertiary);
    border-radius: var(--radius-pill);
    bottom: 0;
    left: 0;
    position: absolute;
    top: 0;
}

.rrp-ptick {
    background: var(--ink-line);
    bottom: -3px;
    left: 50%;
    position: absolute;
    top: -3px;
    width: 1.5px;
}

.rrp-pdot {
    background: var(--text-secondary);
    border: 2px solid var(--surface-field);
    border-radius: 50%;
    height: 11px;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 11px;
}

.rrp-row.lo .rrp-pbar i,
.rrp-row.lo .rrp-pdot {
    background: var(--accent-hover);
}

.rrp-row.hi .rrp-pbar i,
.rrp-row.hi .rrp-pdot {
    background: var(--accent-teal);
}

.rrp-pv {
    color: var(--text-primary);
    font-size: 0.88rem;
    font-variant-numeric: tabular-nums;
    font-weight: 700;
    min-width: 110px;
    text-align: right;
    white-space: nowrap;
}

.rrp-pp {
    color: var(--text-tertiary);
    font-size: 0.75rem;
    font-variant-numeric: tabular-nums;
    font-weight: 600;
    text-align: right;
    width: 52px;
}

.rrp-row.lo .rrp-pp {
    color: var(--accent-hover);
    font-weight: 700;
}

.rrp-row.hi .rrp-pp {
    color: var(--accent-teal);
    font-weight: 700;
}

.rrp-row.low .rrp-pp {
    color: var(--text-primary);
    font-weight: 700;
}

/* ── Load strip ── */
.rrp-stats {
    display: flex;
    flex-wrap: wrap;
    gap: 16px 0;
    padding: 18px 0 30px;
}

.rrp-stats-second {
    border-top: 1px solid var(--ink-line);
    padding-top: 14px;
}

.rrp-st {
    border-left: 1px solid var(--ink-line);
    flex: 1 1 160px;
    min-width: 0;
    padding-left: 22px;
}

.rrp-st:first-child {
    border-left: none;
    padding-left: 0;
}

.rrp-st-v {
    color: var(--text-primary);
    font-size: 1.4rem;
    font-variant-numeric: tabular-nums;
    font-weight: 700;
}

.rrp-st-v small {
    color: var(--text-secondary);
    font-size: 0.72rem;
    font-weight: 500;
}

.rrp-st-v.band-caution {
    color: var(--status-modified);
}

.rrp-st-v.band-concern {
    color: var(--status-injured);
}

.rrp-st-k {
    color: var(--text-tertiary);
    font-size: 0.63rem;
    font-weight: 600;
    letter-spacing: 0.6px;
    margin-top: 5px;
    text-transform: uppercase;
}

.rrp-st-d {
    color: var(--text-secondary);
    font-size: 0.68rem;
    font-variant-numeric: tabular-nums;
    margin-top: 6px;
}

.rrp-st-range {
    color: var(--text-tertiary);
    font-size: 0.62rem;
    margin-top: 5px;
}

.rrp-z {
    border-radius: var(--radius-pill);
    display: inline-block;
    font-size: 0.58rem;
    font-weight: 700;
    letter-spacing: 0.6px;
    margin-left: 7px;
    padding: 1.5px 8px;
    text-transform: uppercase;
    vertical-align: 1px;
}

.rrp-z.hi {
    background: var(--zscore-high-color, var(--accent-hover));
    color: var(--surface-field);
}

.rrp-z.lo {
    border: 1px solid var(--zscore-low-color, var(--accent));
    color: var(--zscore-low-color, var(--accent));
}

.rrp-z.norm {
    border: 1px solid var(--ink-line);
    color: var(--text-tertiary);
}

.rrp-z-na {
    color: var(--text-tertiary);
    font-size: 0.62rem;
    margin-left: 7px;
}

/* ── Disclaimer strip ── */
.rrp-disc {
    border-top: 1px solid var(--ink-line);
    color: var(--text-tertiary);
    font-size: 0.68rem;
    margin-top: 6px;
    padding: 14px 0;
}

.rrp-empty-note {
    color: var(--text-tertiary);
    font-size: 0.72rem;
    margin: 0;
    padding: 10px 0;
}

@media (max-width: 1100px) {
    .rrp-body {
        gap: 26px;
        grid-template-columns: 1fr;
    }

    .rrp-kpis {
        display: grid;
        gap: 20px 0;
        grid-template-columns: 1fr 1fr;
    }

    .rrp-kpi {
        border-left: none;
        padding-left: 0;
    }

    .rrp-kpi:nth-child(even) {
        border-left: 1px solid var(--ink-line);
        padding-left: 28px;
    }

    .rrp-stats {
        display: grid;
        gap: 16px 0;
        grid-template-columns: repeat(3, 1fr);
    }

    .rrp-st {
        border-left: none;
        padding-left: 0;
    }

    .rrp-st:nth-child(3n+2),
    .rrp-st:nth-child(3n+3) {
        border-left: 1px solid var(--ink-line);
        padding-left: 22px;
    }

    .rrp-pbar {
        width: 110px;
    }

    .rrp-row-t span {
        display: none;
    }
}

body.ipad-mode .rrp-body {
    grid-template-columns: 1fr;
}



/* ── Chart containers ── */
.ir-charts-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    margin-bottom: 24px;
}

@media (max-width: 1100px) {
    .ir-charts-grid {
        grid-template-columns: 1fr;
    }
}

/* Base styles provided by .hub-chart-card */
.ir-chart-card {
    /* module-specific overrides only */
}

.ir-chart-card.full-width {
    grid-column: 1 / -1;
}

/* Base styles provided by .hub-chart-title */
.ir-chart-title {
    /* module-specific overrides only */
}
.ir-chart-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 8px;
    margin-bottom: 2px;
}
.ir-chart-header .ir-chart-sub {
    margin-bottom: 0;
}
.ir-chart-toggle {
    flex-shrink: 0;
}
.ir-chart-sub {
    font-size: 0.65rem;
    color: var(--text-tertiary);
    margin-bottom: 10px;
    line-height: 1.3;
}

.ir-chart-wrap {
    position: relative;
    height: 260px;
}


/* ── Reference Values Tab ── */
.ir-ref-page {
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.ir-ref-page > .ir-body-comp-sub-bar {
    margin-bottom: 0;
}
.ir-ref-section {
    padding: 18px 22px;
}
.ir-ref-sub-content > .ir-ref-section + .ir-ref-section {
    margin-top: 16px;
}

/* Per-card header strip — title + profile summary */
.ir-ref-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 12px;
    flex-wrap: wrap;
}
.ir-ref-profile-strip {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 0.7rem;
    color: var(--text-tertiary);
}
.ir-ref-profile-strip strong {
    color: var(--text-primary);
    font-weight: 600;
}
.ir-ref-profile-strip .ir-ref-pchip {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 2px 8px;
    border-radius: var(--radius-pill);
    background: var(--ink-wash);
    border: 1px solid var(--ink-line-strong);
}
.ir-ref-profile-strip .ir-ref-pchip-dot {
    width: 6px;
    height: 6px;
    border-radius: var(--radius-circle);
}
.ir-ref-pchip-dot.high { background: var(--accent-dark); }
.ir-ref-pchip-dot.low { background: var(--accent); }

/* Unified Test Results table */
.ir-ref-results-table {
    table-layout: fixed;
    width: 100%;
}
.ir-ref-results-table col.col-metric { width: 38%; }
.ir-ref-results-table col.col-num { width: 9%; }
.ir-ref-results-table col.col-pbar { width: 35%; }
.ir-ref-results-table thead th {
    font-size: 0.65rem;
    color: var(--text-tertiary);
    font-weight: 600;
    letter-spacing: 0.4px;
    text-transform: uppercase;
}
.ir-ref-results-table thead th:first-child {
    padding-left: 18px;
}
.ir-ref-results-table tbody td {
    vertical-align: middle;
}
.ir-ref-results-table .ir-ref-metric-cell {
    padding-left: 30px;
    color: var(--text-primary);
}
.ir-ref-results-table .ir-ref-unit {
    color: var(--text-tertiary);
    font-size: 0.72rem;
}
.ir-ref-group-row td {
    padding: 14px 0 6px 18px !important;
    background: transparent;
    border-bottom: 1px solid var(--ink-line);
    font-size: 0.78rem;
    font-weight: 700;
    color: var(--text-primary);
    letter-spacing: 0.3px;
}
.ir-ref-group-row:first-child td {
    padding-top: 4px !important;
}
.ir-ref-group-meta {
    font-weight: 400;
    color: var(--text-tertiary);
    font-size: 0.72rem;
    margin-left: 10px;
}
.ir-ref-no-ref {
    color: var(--text-tertiary);
    font-size: 0.78rem;
}

/* Percentile bar — percentile-scale (equal-width bands) with rank badge */
.ir-pbar-wrap {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 200px;
}
.ir-pbar {
    position: relative;
    flex: 1;
    height: 8px;
    min-width: 120px;
    border-radius: var(--ir-pbar-radius-pill);
    overflow: hidden;
    background: var(--ink-wash);
}
.ir-pbar-zone {
    position: absolute;
    top: 0;
    height: 100%;
}
.ir-pbar-tick {
    position: absolute;
    top: 0;
    width: 1px;
    height: 100%;
    background: var(--ink-line-strong);
}
.ir-pbar-marker {
    position: absolute;
    top: 50%;
    width: 12px;
    height: 12px;
    border-radius: var(--radius-circle);
    transform: translate(-50%, -50%);
    border: 2px solid var(--surface-raised);
    box-shadow: var(--shadow-pop);
}
.ir-pbar-marker.edge-low {
    border-radius: var(--radius-2) var(--ir-pbar-radius-pill) var(--ir-pbar-radius-pill) var(--radius-2);
    transform: translate(0, -50%);
}
.ir-pbar-marker.edge-high {
    border-radius: var(--ir-pbar-radius-pill) var(--radius-2) var(--radius-2) var(--ir-pbar-radius-pill);
    transform: translate(-100%, -50%);
}
.ir-pbar-badge {
    flex-shrink: 0;
    min-width: 40px;
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--text-secondary);
    text-align: right;
    font-variant-numeric: tabular-nums;
}
.ir-pbar-badge.high { color: var(--ir-pbar-high); }
.ir-pbar-badge.upper { color: var(--soft-blue); }
.ir-pbar-badge.lower { color: var(--warning); }
.ir-pbar-badge.low { color: var(--accent); }

/* ── Loading spinner ── */
.ir-loading {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
    color: var(--text-secondary);
}

.ir-loading .spinner {
    width: 36px;
    height: 36px;
    border: 3px solid var(--ink-line);
    border-top-color: var(--accent);
    border-radius: var(--radius-circle);
    animation: spin 0.8s linear infinite;
}


/* ── Empty state ── */
.ir-empty {
    text-align: center;
    padding: 48px 24px;
    color: var(--text-tertiary);
    font-size: 0.84rem;
    line-height: 1.45;
}


/* ── Data tables ── */
/* Base table styles provided by .hub-table — only overrides here */
.ir-data-table {
    font-size: 0.82rem;
}

.ir-data-table thead th {
    padding: 8px 12px;
    letter-spacing: 0.5px;
}

.ir-data-table td {
    padding: 6px 12px;
}


/* ── 14-day comparison bars ── */
.ir-rolling-grid {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 12px;
}

.ir-rolling-card {
    background: var(--ink-zebra);
    border-radius: var(--radius-8);
    padding: 12px 16px;
    text-align: center;
}

.ir-rolling-label {
    font-size: 0.62rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: var(--text-secondary);
    margin-bottom: 8px;
}

.ir-rolling-values {
    display: flex;
    justify-content: center;
    gap: 20px;
}

.ir-rolling-val {
    text-align: center;
}

.ir-rolling-val .num {
    font-size: 1.15rem;
    font-weight: 700;
    display: block;
}

.ir-rolling-val .sub {
    font-size: 0.58rem;
    color: var(--text-tertiary);
    text-transform: uppercase;
}

.ir-rolling-val.current .num {
    color: var(--accent);
}

.ir-rolling-val.previous .num {
    color: var(--text-secondary);
}


/* ============================================================================
   BODY COMPOSITION DASHBOARD
   ============================================================================ */

/* ── Sub-tab bar ── */
.ir-body-comp-dashboard {
    padding: 0;
}

.ir-body-comp-sub-bar {
    margin-bottom: 16px;
    width: fit-content;
}

/* ── Content toggle ── */
.ir-body-comp-content {
    display: none;
}

.ir-body-comp-content.active {
    display: block;
}

/* ── Chart cards ── */
.ir-body-comp-cards-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
    margin-bottom: 14px;
}

.ir-body-comp-card {
    background: var(--surface-raised);
    border: 1px solid var(--ink-line);
    border-radius: var(--radius-md);
    padding: 14px;
    min-height: 220px;
}

.ir-body-comp-card-wide {
    grid-column: 1 / -1;
}

.ir-body-comp-card-title {
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--text-secondary);
    margin-bottom: 2px;
    text-transform: uppercase;
    letter-spacing: 0.4px;
}

.ir-body-comp-card-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 10px;
    gap: 8px;
}

.ir-body-comp-card-sub {
    font-size: 0.68rem;
    color: var(--text-tertiary);
    font-weight: 400;
    margin-top: 2px;
    line-height: 1.3;
}

.ir-body-comp-target-badge {
    background: rgba(45, 212, 191, 0.15);
    color: var(--ir-target);
    font-size: 0.7rem;
    font-weight: 600;
    padding: 3px 10px;
    border-radius: var(--radius-pill);
    border: 1px solid rgba(45, 212, 191, 0.3);
    white-space: nowrap;
}

.ir-body-comp-card canvas {
    max-height: 200px;
}

/* ── SWC Legend ── */
.ir-body-comp-swc-legend {
    display: flex;
    gap: 16px;
    justify-content: center;
    font-size: 0.72rem;
    color: var(--text-secondary);
    padding: 8px 0 4px;
}

.swc-dot {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: var(--radius-2);
    margin-right: 4px;
    vertical-align: middle;
}

.swc-dot.toward {
    background: var(--accent-dark);
}

.swc-dot.trivial {
    background: var(--palermo-blush);
}

.swc-dot.baseline {
    background: var(--accent);
}

.swc-dot.target-line {
    width: auto;
    height: auto;
    background: none;
    color: rgba(3, 71, 82, 0.9);
    font-weight: 700;
    letter-spacing: 1px;
}

/* ── Reference band legend ── */
.swc-band-label {
    display: inline-block;
    width: 18px;
    height: 10px;
    border-radius: var(--radius-2);
    margin-right: 4px;
    vertical-align: middle;
}

.swc-band-label.lean {
    background: rgba(3, 71, 82, 0.15);
    border: 1px solid rgba(3, 71, 82, 0.3);
}

.swc-band-label.normal {
    background: rgba(236, 231, 224, 0.08);
    border: 1px solid rgba(236, 231, 224, 0.15);
}

.swc-band-label.elevated {
    background: rgba(var(--accent-rgb), 0.15);
    border: 1px solid rgba(var(--accent-rgb), 0.3);
}

/* ── Target Editor ── */
.ir-body-comp-targets-section {
    padding: 8px 0;
}

.ir-body-comp-section-title {
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--text-primary);
    margin: 0 0 12px;
}

.ir-body-comp-target-form {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    align-items: center;
    padding: 12px;
    background: var(--surface-raised);
    border: 1px solid var(--ink-line);
    border-radius: var(--radius-8);
    margin-bottom: 14px;
}

.ir-body-comp-target-readonly {
    padding: 10px 12px;
    margin-bottom: 14px;
    color: var(--text-secondary);
    background: var(--surface-raised);
    border: 1px solid var(--ink-line);
    border-radius: var(--radius-sm);
    font-size: 0.78rem;
}

.ir-body-comp-input {
    background: var(--surface-field);
    border: 1px solid var(--ink-line-strong);
    color: var(--text-primary);
    border-radius: var(--radius-sm);
    padding: 7px 10px;
    font-size: 0.78rem;
    font-family: 'Inter', sans-serif;
    min-width: 100px;
}

.ir-body-comp-input-wide {
    flex: 1;
    min-width: 160px;
}

.ir-body-comp-input:focus {
    outline: none;
    border-color: var(--accent);
}

.ir-body-comp-form-group {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.ir-body-comp-form-label {
    font-size: 0.65rem;
    font-weight: 600;
    color: var(--text-tertiary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.ir-body-comp-btn-save {
    padding: 7px 16px;
    background: rgba(var(--accent-rgb), 0.2);
    color: var(--accent);
    border: 1px solid rgba(var(--accent-rgb), 0.3);
    border-radius: var(--radius-sm);
    font-size: 0.78rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s;
}

.ir-body-comp-btn-save:hover {
    background: rgba(var(--accent-rgb), 0.3);
}

.ir-body-composition-cancel {
    padding: 7px 12px;
    background: transparent;
    color: var(--text-secondary);
    border: 1px solid var(--ink-line);
    border-radius: var(--radius-pill);
    font-size: 0.78rem;
    font-weight: 600;
    cursor: pointer;
}

.ir-body-composition-cancel:hover {
    background: var(--ink-wash);
    color: var(--text-primary);
}

/* ── Target list ── */
.ir-body-comp-target-list {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.ir-body-comp-target-empty {
    color: var(--text-tertiary);
    font-size: 0.8rem;
    padding: 12px;
    text-align: center;
}

.ir-body-comp-target-row {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 8px 12px;
    background: var(--surface-raised);
    border: 1px solid var(--ink-line);
    border-radius: var(--radius-sm);
    font-size: 0.78rem;
}

.ir-body-comp-target-metric {
    font-weight: 600;
    color: var(--text-primary);
    min-width: 140px;
}

.ir-body-comp-target-val {
    font-weight: 700;
    color: var(--accent);
    min-width: 50px;
}

.ir-body-comp-target-type {
    padding: 2px 8px;
    border-radius: var(--radius-4);
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
}

.badge-maintain {
    background: rgba(160, 160, 160, 0.2);
    color: var(--text-secondary);
}

.badge-decrease {
    background: rgba(239, 68, 68, 0.15);
    color: var(--danger-strong);
}

.badge-increase {
    background: rgba(34, 197, 94, 0.15);
    color: var(--ir-badge-increase);
}

.badge-exact {
    background: rgba(255, 193, 7, 0.15);
    color: var(--ir-badge-exact);
}

.ir-body-comp-target-date {
    color: var(--text-tertiary);
    min-width: 80px;
}

.ir-body-comp-target-by {
    color: var(--text-secondary);
    font-style: italic;
}

.ir-body-comp-btn-del {
    background: none;
    border: none;
    color: var(--text-tertiary);
    cursor: pointer;
    font-size: 0.9rem;
    padding: 2px 6px;
    border-radius: var(--radius-4);
    margin-left: auto;
    transition: all 0.2s;
}

.ir-body-comp-btn-del:hover {
    background: rgba(239, 68, 68, 0.2);
    color: var(--danger-strong);
}

/* ── Radar enlarge modal ── */
.ir-body-comp-modal-backdrop {
    position: fixed;
    inset: 0;
    background: var(--scrim);
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    animation: fadeIn 0.15s ease;
}

@keyframes fadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

.ir-body-comp-modal-content {
    background: var(--surface-chrome);
    border: 1px solid var(--ink-line-strong);
    border-radius: var(--radius-md);
    padding: 24px;
    max-width: 640px;
    width: 90%;
    max-height: 90vh;
    position: relative;
}

.ir-body-comp-modal-close {
    position: absolute;
    top: 12px;
    right: 14px;
    background: none;
    border: none;
    color: var(--text-tertiary);
    font-size: 1.2rem;
    cursor: pointer;
    padding: 4px 8px;
    border-radius: var(--radius-4);
}

.ir-body-comp-modal-close:hover {
    background: var(--ink-wash);
    color: var(--white);
}

.ir-body-comp-modal-wide {
    max-width: 860px;
}

.ir-body-comp-radar-table th {
    text-align: center;
}

.ir-body-comp-radar-table td {
    font-size: 0.8rem;
}

/* Date picker: click anywhere in the input to open */
.ir-body-comp-input[type="date"] {
    cursor: pointer;
    position: relative;
}

.ir-body-comp-input[type="date"]::-webkit-calendar-picker-indicator {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
}

/* Enlarge hint */
.ir-body-comp-enlarge-hint {
    color: var(--accent);
    font-size: 0.62rem;
    opacity: 0.7;
    margin-top: 2px;
    display: inline-block;
}

/* ── Responsive for smaller screens ── */
@media (max-width: 900px) {
    .ir-body-comp-cards-row {
        grid-template-columns: 1fr;
    }

    .ir-body-comp-target-form {
        flex-direction: column;
    }

    .ir-body-comp-input {
        width: 100%;
    }
}

/* ═══════════════════════════════════════════════════════════════
   Testing Profile
   ═══════════════════════════════════════════════════════════════ */
.tp-controls-bar {
    display: flex;
    align-items: center;
    gap: 24px;
    padding: 12px 0;
    margin-bottom: 16px;
}
.tp-print-btn {
    background: none;
    border: 1px solid var(--ink-line-strong);
    border-radius: var(--radius-sm);
    color: var(--text-tertiary);
    padding: 5px 8px;
    cursor: pointer;
    transition: all 0.2s;
    display: flex;
    align-items: center;
}
.tp-print-btn:hover { color: var(--text-primary); border-color: var(--text-secondary); }
.tp-control-group {
    display: flex;
    align-items: center;
    gap: 8px;
}
.tp-control-group label {
    font-size: 0.72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    color: var(--text-secondary);
}
.tp-select {
    padding: 6px 28px 6px 10px;
    background: var(--surface-raised);
    border: 1px solid var(--ink-line-strong);
    border-radius: var(--radius-sm);
    color: var(--text-primary);
    font-family: inherit;
    font-size: 0.78rem;
    cursor: pointer;
    appearance: none;
    -webkit-appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='7' fill='%23888'%3E%3Cpath d='M5 7L0 0h10z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 8px center;
}
.tp-select:focus { outline: none; border-color: var(--accent); }

.tp-right {
    flex: 1;
    min-width: 0;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(360px, 1fr));
    gap: 10px 12px;
    align-items: start;
}
.tp-right > .ir-empty { grid-column: 1 / -1; }

.tp-profile-view {
    padding-bottom: 28px;
}
.tp-profile-view-radar .tp-radar-card {
    position: relative;
    top: auto;
}
.tp-profile-view-radar .tp-radar-wrap {
    height: min(700px, calc(100vh - 310px));
    min-height: 560px;
}
.tp-profile-view-metrics .tp-right {
    grid-template-columns: repeat(auto-fit, minmax(420px, 1fr));
}

.tp-radar-card {
    background: var(--surface-raised);
    border: 1px solid var(--ink-line);
    border-radius: var(--radius-sm);
    padding: 20px 22px;
    position: sticky;
    top: 70px;
    cursor: pointer;
}
.tp-section-title {
    font-family: var(--font-system);
    font-size: 0.9rem;
    font-weight: 700;
    letter-spacing: normal;
    text-transform: uppercase;
    color: var(--text-primary);
    margin-bottom: 12px;
}
.tp-radar-wrap {
    position: relative;
    height: min(600px, calc(100vh - 220px));
    min-height: 520px;
}
.tp-radar-legend {
    display: flex;
    justify-content: center;
    gap: 20px;
    margin-top: 14px;
    font-family: inherit;
    font-size: 0.72rem;
    font-weight: 650;
    letter-spacing: 0.4px;
    text-transform: uppercase;
    color: var(--text-secondary);
}
.tp-legend-item { display: flex; align-items: center; gap: 6px; }
.tp-legend-dot {
    width: 10px;
    height: 10px;
    border-radius: var(--radius-circle);
    display: inline-block;
}
.tp-legend-line {
    display: inline-block;
    width: 18px;
    border-top: 2px solid var(--accent-teal);
}
.tp-legend-line.reference {
    border-top-style: dashed;
    border-top-color: var(--accent);
}

.tp-category-section {
    min-width: 0;
    margin-bottom: 0;
}
.tp-category-header {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 6px;
}
.tp-category-header::before {
    content: "";
    width: 8px;
    height: 8px;
    flex: 0 0 auto;
    border-radius: var(--radius-sm);
    background: var(--accent-hover);
}
.tp-category-label {
    font-family: inherit;
    font-size: 0.66rem;
    font-weight: 750;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    color: var(--text-primary);
}
.tp-category-gear {
    background: none;
    border: none;
    color: var(--text-tertiary);
    cursor: pointer;
    padding: 2px;
    opacity: 0.4;
    transition: opacity 0.2s;
}
.tp-category-gear:hover { opacity: 1; }

.tp-cards-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
}
.tp-test-card {
    background: var(--surface-recess);
    border: 1px solid var(--ink-line);
    border-radius: var(--radius-sm);
    padding: 8px 10px;
    min-height: 88px;
    transition: border-color 0.2s, background 0.2s;
}
.tp-test-card:hover { border-color: var(--accent); }

.tp-card-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 5px;
    min-height: 18px;
}
.tp-card-name {
    color: var(--text-secondary);
    font-family: inherit;
    font-size: 0.58rem;
    font-weight: 750;
    letter-spacing: 0.45px;
    line-height: 1.15;
    overflow: hidden;
    text-overflow: ellipsis;
    text-transform: uppercase;
    white-space: nowrap;
}
.tp-card-value-row {
    display: flex;
    align-items: baseline;
    gap: 3px;
    margin-top: 4px;
}
.tp-card-value {
    font-family: inherit;
    font-size: 1.24rem;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
    letter-spacing: 0;
    line-height: 1;
    color: var(--text-primary);
}
.tp-card-unit {
    font-size: 0.58rem;
    color: var(--text-secondary);
}
.tp-card-change {
    flex: 0 0 auto;
    font-size: 0.6rem;
    font-weight: 750;
    white-space: nowrap;
}
.tp-card-change.up { color: var(--success); }
.tp-card-change.down { color: var(--status-injured); }

.tp-card-date {
    font-size: 0.56rem;
    color: var(--text-tertiary);
    margin-top: 1px;
}

.tp-percentile-track {
    margin-top: 6px;
}
.tp-percentile-bar {
    position: relative;
    height: 5px;
    background: var(--surface-raised);
    border-radius: var(--radius-pill);
}
.tp-percentile-ref {
    position: absolute;
    top: -3px;
    bottom: -3px;
    left: var(--tp-ref);
    width: 1px;
    background: var(--text-tertiary);
    opacity: 0.7;
}
.tp-percentile-fill {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: var(--tp-pct);
    border-radius: var(--radius-pill);
    background: var(--text-secondary);
}
.tp-percentile-marker {
    position: absolute;
    top: 50%;
    left: var(--tp-pct);
    width: 8px;
    height: 8px;
    border-radius: var(--radius-pill);
    background: var(--text-secondary);
    transform: translate(-50%, -50%);
    box-shadow: 0 0 0 2px var(--surface-recess);
}
.tp-percentile-foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 5px;
    margin-top: 3px;
}
.tp-percentile-label {
    font-family: inherit;
    font-size: 0.56rem;
    font-weight: 750;
    font-variant-numeric: tabular-nums;
    letter-spacing: 0;
    color: var(--text-primary);
}
.tp-percentile-scale {
    color: var(--text-tertiary);
    font-family: inherit;
    font-size: 0.48rem;
    font-weight: 700;
    letter-spacing: 0.35px;
    text-transform: uppercase;
}
.tp-percentile-hi .tp-percentile-fill,
.tp-percentile-hi .tp-percentile-marker {
    background: var(--accent-teal);
}
.tp-percentile-hi .tp-percentile-label {
    color: var(--accent-teal);
}
.tp-percentile-lo .tp-percentile-fill,
.tp-percentile-lo .tp-percentile-marker {
    background: var(--accent);
}
.tp-percentile-lo .tp-percentile-label {
    color: var(--accent);
}
.tp-percentile-mid .tp-percentile-fill,
.tp-percentile-mid .tp-percentile-marker {
    background: var(--text-secondary);
}

/* Config Modal */
.tp-config-overlay {
    position: fixed;
    inset: 0;
    background: var(--scrim);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
}
.tp-config-modal {
    background: var(--surface-chrome);
    border: 1px solid var(--ink-line-strong);
    border-radius: var(--radius-md);
    width: 340px;
    box-shadow: var(--shadow-modal);
}
.tp-config-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 18px;
    border-bottom: 1px solid var(--ink-line);
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--text-primary);
}
.tp-config-close {
    background: none;
    border: none;
    color: var(--text-secondary);
    font-size: 18px;
    cursor: pointer;
}
.tp-config-note {
    padding: 8px 18px 0;
    font-size: 0.68rem;
    color: var(--text-tertiary);
}
.tp-config-body { padding: 12px 18px; }
.tp-config-disabled { opacity: 0.35; pointer-events: none; }
.tp-config-row {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 0;
    font-size: 0.8rem;
    color: var(--text-primary);
    cursor: pointer;
}
.tp-config-row input[type="checkbox"] {
    accent-color: var(--accent-pink);
}
.tp-config-footer {
    padding: 12px 18px;
    border-top: 1px solid var(--ink-line);
    text-align: right;
}
.tp-config-save {
    padding: 6px 16px;
    background: var(--accent-pink);
    color: var(--text-inverse);
    border: none;
    border-radius: var(--radius-sm);
    font-size: 0.78rem;
    font-weight: 600;
    cursor: pointer;
}

/* Radar Expanded Overlay */
.tp-radar-overlay {
    position: fixed;
    inset: 0;
    background: var(--scrim);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    cursor: pointer;
}
.tp-radar-expanded {
    background: var(--surface-chrome);
    border: 1px solid var(--ink-line);
    border-radius: var(--radius-md);
    padding: 28px;
    width: 720px;
    height: 720px;
    position: relative;
    cursor: default;
}
.tp-radar-expanded canvas {
    width: 100% !important;
    height: 620px !important;
}
.tp-radar-expanded .tp-config-close {
    position: absolute;
    top: 12px;
    right: 16px;
}

@media (max-width: 1100px) {
    .tp-radar-expanded { width: 90vw; height: 90vw; max-width: 600px; max-height: 600px; }
    .tp-radar-expanded canvas { height: calc(90vw - 100px) !important; max-height: 500px !important; }
}

/* ═══════════════════════════════════════════════════════════════
   Testing Sub-tabs
   ═══════════════════════════════════════════════════════════════ */
.tp-sub-bar {
    margin-bottom: 16px;
}
.tp-sub-content {
    display: none;
}
.tp-sub-content.active {
    display: block;
}

/* ═══════════════════════════════════════════════════════════════
   Team Comparison — Z-score chart
   ═══════════════════════════════════════════════════════════════ */
.tc-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 14px;
}
.tc-presets {
    display: flex;
    gap: 4px;
    flex-wrap: wrap;
}
.tc-preset-btn {
    padding: 5px 12px;
    background: var(--surface-raised);
    border: 1px solid var(--ink-line-strong);
    border-radius: var(--radius-pill);
    color: var(--text-secondary);
    font-size: 0.72rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
}
.tc-preset-btn:hover {
    background: rgba(var(--accent-rgb), 0.12);
    border-color: rgba(var(--accent-rgb), 0.3);
    color: var(--accent);
}
.tc-preset-btn.active {
    background: var(--accent-soft);
    border-color: rgba(var(--accent-rgb), 0.3);
    color: var(--accent);
}
.tc-dropdowns {
    display: flex;
    gap: 8px;
}
.tc-dropdown {
    position: relative;
}
.tc-dropdown-btn {
    padding: 5px 12px;
    background: var(--surface-raised);
    border: 1px solid var(--ink-line-strong);
    border-radius: var(--radius-sm);
    color: var(--text-primary);
    font-size: 0.75rem;
    font-weight: 500;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 6px;
    font-family: inherit;
}
.tc-dd-arrow {
    font-size: 0.65rem;
    color: var(--text-tertiary);
}
.tc-dropdown-menu {
    display: none;
    position: absolute;
    top: calc(100% + 4px);
    right: 0;
    background: var(--surface-overlay);
    border: 1px solid var(--ink-line-strong);
    border-radius: var(--radius-8);
    padding: 8px 6px;
    z-index: 20;
    min-width: 170px;
    max-height: 280px;
    overflow-y: auto;
    box-shadow: var(--shadow-pop);
}
.tc-dropdown.open .tc-dropdown-menu { display: block; }
.tc-dd-item {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 5px 8px;
    font-size: 0.78rem;
    color: var(--text-primary);
    cursor: pointer;
    border-radius: var(--radius-4);
}
.tc-dd-item:hover { background: var(--ink-wash); }
.tc-dd-item input[type="checkbox"] {
    accent-color: var(--accent-pink);
}

/* Chart container */
.tc-legend {
    display: flex;
    align-items: center;
    gap: 20px;
    min-height: 24px;
    color: var(--text-secondary);
    font-size: 0.66rem;
    font-weight: 700;
    letter-spacing: 0.35px;
    margin-bottom: 8px;
    text-transform: uppercase;
}
.tc-legend > span {
    display: inline-flex;
    align-items: center;
    gap: 7px;
}
.tc-legend-swatch {
    display: inline-block;
    width: 20px;
    height: 9px;
    border-radius: var(--radius-2);
}
.tc-legend-swatch.high { background: var(--zscore-high-color); }
.tc-legend-swatch.low { background: var(--zscore-low-color); }
.tc-legend-swatch.normal { background: var(--zscore-normal-color); }
.tc-legend .tc-legend-caption {
    margin-left: auto;
    color: var(--text-tertiary);
    font-weight: 550;
    letter-spacing: 0;
    text-transform: none;
}
.tc-chart-wrap {
    position: relative;
    height: 420px;
}

/* ═══════════════════════════════════════════════════════════════
   Progression — Line chart cards
   ═══════════════════════════════════════════════════════════════ */
.tp-prog-filters {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 16px;
    min-height: 34px;
}
.tp-prog-filter-label,
.tp-prog-window > span {
    color: var(--text-tertiary);
    font-size: 0.64rem;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
}
.tp-prog-category-chips {
    display: flex;
    align-items: center;
    gap: 8px;
}
.tp-prog-chip,
.tp-prog-dropdown-btn {
    min-height: 30px;
    border: 1px solid var(--ink-line-strong);
    border-radius: var(--radius-pill);
    background: transparent;
    color: var(--text-secondary);
    cursor: pointer;
    font-family: inherit;
    font-size: 0.7rem;
    font-weight: 650;
    padding: 6px 12px;
}
.tp-prog-chip:hover,
.tp-prog-dropdown-btn:hover {
    border-color: var(--text-tertiary);
    color: var(--text-primary);
}
.tp-prog-chip.active {
    border-color: rgba(var(--accent-rgb), 0.3);
    background: var(--accent-soft);
    color: var(--accent);
}
.tp-prog-dropdown {
    position: relative;
    margin-left: auto;
}
.tp-prog-dropdown-btn {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    border-radius: var(--radius-pill);
}
.tp-prog-dropdown-menu {
    display: none;
    position: absolute;
    right: 0;
    top: calc(100% + 5px);
    z-index: 30;
    min-width: 210px;
    max-height: 280px;
    overflow-y: auto;
    padding: 7px;
    border: 1px solid var(--ink-line-strong);
    border-radius: var(--radius-md);
    background: var(--surface-overlay);
    box-shadow: var(--shadow-lg);
}
.tp-prog-dropdown.open .tp-prog-dropdown-menu { display: block; }
.tp-prog-test-option {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 7px;
    border-radius: var(--radius-sm);
    color: var(--text-primary);
    cursor: pointer;
    font-size: 0.74rem;
}
.tp-prog-test-option:hover { background: color-mix(in srgb, var(--text-primary) 4%, transparent); }
.tp-prog-test-option input { accent-color: var(--accent-hover); }
.tp-prog-no-tests {
    display: block;
    padding: 8px;
    color: var(--text-tertiary);
    font-size: 0.72rem;
}
.tp-prog-window {
    display: inline-flex;
    align-items: center;
    gap: 7px;
}
.tp-prog-result {
    margin: 0 0 10px;
    color: var(--text-tertiary);
    font-size: 0.72rem;
}
.tp-prog-result strong { color: var(--text-secondary); }
.tp-prog-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}
.tp-prog-card {
    padding: 18px 20px 14px;
    min-width: 0;
}
.tp-prog-card-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
}
.tp-prog-card-head h3 {
    margin: 0;
    color: var(--text-primary);
    font-size: 0.86rem;
    font-weight: 700;
}
.tp-prog-card-head > span {
    color: var(--text-tertiary);
    font-size: 0.66rem;
}
.tp-prog-hero {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 48px;
}
.tp-prog-hero > strong {
    color: var(--text-primary);
    font-size: 2rem;
    font-variant-numeric: tabular-nums;
    line-height: 1;
}
.tp-prog-delta {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    border: 1px solid var(--ink-line);
    border-radius: var(--radius-pill);
    padding: 4px 8px;
    color: var(--text-secondary);
    font-size: 0.66rem;
    font-weight: 700;
    white-space: nowrap;
}
.tp-prog-delta.bad {
    border-color: color-mix(in srgb, var(--status-modified) 45%, transparent);
    background: color-mix(in srgb, var(--status-modified) 8%, transparent);
    color: var(--status-modified);
}
.tp-prog-delta.good::before {
    content: "";
    width: 5px;
    height: 5px;
    border-radius: var(--radius-circle);
    background: var(--status-available);
}
.tp-prog-chart-wrap {
    position: relative;
    height: 210px;
}
.tp-prog-single {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 8px;
    height: 210px;
    border-top: 1px solid var(--ink-line);
    border-bottom: 1px solid var(--ink-line);
    color: var(--text-tertiary);
    font-size: 0.72rem;
}
.tp-prog-single strong {
    color: var(--text-secondary);
    font-size: 0.78rem;
    font-weight: 600;
}
.tp-prog-footer {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 10px;
    color: var(--text-tertiary);
    font-size: 0.62rem;
}
.tp-prog-footer span + span::before {
    content: "·";
    margin-right: 12px;
    color: var(--ink-line);
}

@media (max-width: 1180px) {
    .tp-prog-filters { align-items: flex-start; flex-wrap: wrap; }
    .tp-prog-dropdown { margin-left: 0; }
    .tp-prog-window { margin-left: auto; }
    .tp-prog-grid { grid-template-columns: 1fr; }
    .tc-legend { flex-wrap: wrap; padding-bottom: 8px; }
    .tc-legend .tc-legend-caption { width: 100%; margin-left: 0; }
}

/* ═══════════════════════════════════════════════════════════════
   Raw Data — Table
   ═══════════════════════════════════════════════════════════════ */
.tp-raw-table-wrap {
    overflow-x: auto;
}
.tp-raw-source {
    display: inline-flex;
    align-items: center;
    padding: 2px 8px;
    border: 1px solid var(--ink-line);
    border-radius: var(--radius-pill);
    font-size: 0.68rem;
    font-weight: 600;
    letter-spacing: 0.3px;
    background: color-mix(in srgb, var(--text-primary) 5%, transparent);
    color: var(--text-secondary);
}
.tp-raw-val {
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}

/* ═══════════════════════════════════════════════════════════════
   Report Overlay — Fullscreen profile popup
   ═══════════════════════════════════════════════════════════════ */
.tp-report-overlay {
    position: fixed;
    inset: 0;
    background: var(--scrim);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2000;
    cursor: pointer;
}
.tp-report-modal {
    background: var(--surface-chrome);
    border: 1px solid var(--ink-line-strong);
    border-radius: var(--radius-md);
    width: min(1500px, 96vw);
    max-width: 96vw;
    max-height: 92vh;
    overflow-y: auto;
    padding: 22px 26px;
    position: relative;
    cursor: default;
}
.tp-report-close {
    position: absolute;
    top: 10px;
    right: 14px;
    background: none;
    border: none;
    color: var(--text-secondary);
    font-size: 22px;
    cursor: pointer;
}
.tp-report-close:hover { color: var(--text-primary); }

/* Header */
.tp-report-header {
    margin-bottom: 18px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--ink-line);
}
.tp-report-title-row {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    margin-bottom: 10px;
}
.tp-report-club {
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    color: var(--accent-pink);
}
.tp-report-date {
    font-size: 0.72rem;
    color: var(--text-tertiary);
}
.tp-report-player {
    display: flex;
    align-items: center;
    gap: 16px;
}
.tp-report-photo {
    width: 52px;
    height: 52px;
    border-radius: var(--radius-circle);
    object-fit: cover;
    border: 2px solid var(--accent-pink);
}
.tp-report-info { flex: 1; }
.tp-report-name {
    font-size: 1.15rem;
    font-weight: 700;
    color: var(--text-primary);
}
.tp-report-pos {
    font-size: 0.72rem;
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}
.tp-report-stats {
    display: flex;
    gap: 24px;
}
.tp-report-stat {
    display: flex;
    flex-direction: column;
    align-items: center;
}
.tp-report-stat-val {
    font-size: 1.3rem;
    font-weight: 800;
    color: var(--text-primary);
}
.tp-report-stat-lbl {
    font-size: 0.62rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--text-tertiary);
    max-width: 116px;
    text-align: center;
    line-height: 1.15;
}

/* Body — radar + cards side by side */
.tp-report-body {
    display: flex;
    gap: 20px;
    align-items: stretch;
    height: min(560px, calc(92vh - 250px));
    min-height: 480px;
}
.tp-report-radar {
    flex: 0 0 38%;
    min-width: 0;
    height: 100%;
}
.tp-report-cards {
    flex: 1;
    min-width: 0;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: 8px 10px;
    align-content: space-between;
    align-items: start;
    height: 100%;
}
.tp-report-cards > .ir-empty { grid-column: 1 / -1; }
.tp-report-cards .tp-category-section {
    border-top: 1px solid var(--ink-line);
    padding-top: 8px;
}
.tp-report-cards .tp-category-header {
    margin-bottom: 7px;
}

/* Footer */
.tp-report-footer {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-top: 14px;
    padding-top: 10px;
    border-top: 1px solid var(--ink-line);
    font-size: 0.72rem;
    color: var(--text-secondary);
}
.tp-report-footer .tp-radar-legend {
    justify-content: flex-start;
    margin-top: 0;
}
.tp-report-agg {
    margin-left: auto;
    color: var(--text-tertiary);
    font-size: 0.65rem;
}

@media (max-width: 900px) {
    .tp-report-body { flex-direction: column; height: auto; min-height: 0; }
    .tp-report-radar { width: 100%; flex: none; height: 350px; }
    .tp-report-cards { height: auto; }
}
