/* ============================================
   EasyFPL — Shared Compare Bar / AI Scouting Report Modal styles
   Copied (not moved) from styles/players.css — used by
   fpl-players-analysis.html and fpl-my-team-analysis.html. Keep both
   copies in sync if this feature's visuals change.
   ============================================ */

/* COMPARE FUNCTIONALITY */
.compare-cell {
    width: 40px;
    text-align: center;
    padding: 8px !important;
}
.compare-checkbox {
    width: 18px;
    height: 18px;
    cursor: pointer;
    accent-color: var(--color-success);
}
.compare-checkbox:disabled {
    opacity: 0.3;
    cursor: not-allowed;
}
.selected-row {
    background: rgba(74, 222, 128, 0.08) !important;
}
.selected-row:hover {
    background: rgba(74, 222, 128, 0.12) !important;
}

/* Compare Bar */
.compare-bar {
    position: fixed;
    bottom: 24px;
    left: 50%;
    transform: translate(-50%, calc(100% + 48px));
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    background: var(--surface-1);
    border: 1px solid var(--border-default);
    border-radius: 16px;
    padding: 12px 20px;
    z-index: 1000;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4);
    transition: transform 240ms ease, opacity 180ms ease, visibility 0s linear 240ms;
}
.compare-bar.show {
    transform: translate(-50%, 0);
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transition-delay: 0s;
}
.compare-bar-content {
    display: flex;
    align-items: center;
    gap: 16px;
}
.compare-bar-info {
    display: flex;
    align-items: center;
    gap: 8px;
    white-space: nowrap;
}
.compare-bar-icon {
    font-size: 20px;
}
.compare-bar-text {
    font-size: 14px;
    color: var(--text-secondary);
}
.compare-bar-text strong {
    color: var(--color-success);
}
.compare-players-list {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    max-width: 400px;
}
.compare-player-chip {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 6px 10px;
    background: var(--surface-2);
    border-radius: 20px;
    font-size: 12px;
    color: var(--text-primary);
}
.compare-player-chip button {
    background: none;
    border: none;
    color: var(--text-muted);
    cursor: pointer;
    font-size: 16px;
    line-height: 1;
    padding: 0;
}
.compare-player-chip button:hover {
    color: var(--color-danger);
}
.compare-bar-actions {
    display: flex;
    gap: 8px;
}
.compare-btn {
    padding: 10px 18px;
    border-radius: 10px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: all 150ms;
}
.compare-btn.clear {
    background: var(--surface-2);
    border: 1px solid var(--border-default);
    color: var(--text-secondary);
}
.compare-btn.clear:hover {
    background: var(--surface-3);
    color: var(--text-primary);
}
.compare-btn.primary {
    background: var(--color-success);
    border: none;
    color: var(--surface-0);
}
.compare-btn.primary:hover {
    background: #22c55e;
    transform: translateY(-1px);
}

/* Compare Modal */
.compare-modal {
    position: fixed;
    inset: 0;
    z-index: 2000;
    display: none;
    align-items: center;
    justify-content: center;
}
.compare-modal.show {
    display: flex;
}
.compare-modal-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.7);
    backdrop-filter: blur(4px);
}
.compare-modal-container {
    position: relative;
    background: var(--surface-1);
    border: 1px solid var(--border-default);
    border-radius: 20px;
    max-width: 90vw;
    max-height: 85vh;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    box-shadow: 0 16px 64px rgba(0, 0, 0, 0.5);
}
.compare-modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 24px;
    border-bottom: 1px solid var(--border-default);
    background: var(--surface-2);
}
.compare-modal-header h2 {
    font-family: 'Space Grotesk', sans-serif;
    font-size: 18px;
    font-weight: 600;
    margin: 0;
}
.compare-modal-close {
    background: var(--surface-3);
    border: none;
    width: 36px;
    height: 36px;
    border-radius: 10px;
    font-size: 20px;
    cursor: pointer;
    color: var(--text-muted);
    transition: all 150ms;
}
.compare-modal-close:hover {
    background: var(--color-danger);
    color: white;
}
.compare-modal-body {
    padding: 24px;
    overflow-y: auto;
    min-width: 600px;
    flex: 1;
    min-height: 0;
}

/* Compare Content */
.compare-header-row {
    display: flex;
    gap: 12px;
    margin-bottom: 24px;
    padding-bottom: 16px;
    border-bottom: 1px solid var(--border-default);
}
.compare-stat-label {
    width: 140px;
    flex-shrink: 0;
    font-size: 12px;
    color: var(--text-muted);
    display: flex;
    align-items: center;
}
.compare-player-header {
    flex: 1;
    min-width: 120px;
    text-align: center;
}
.compare-player-avatar {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    background: var(--surface-3);
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    font-size: 16px;
    margin: 0 auto 8px;
    color: var(--text-muted);
}
.compare-player-name {
    font-weight: 600;
    font-size: 14px;
    margin-bottom: 2px;
}
.compare-player-meta {
    font-size: 11px;
    color: var(--text-muted);
}
.compare-group {
    margin-bottom: 20px;
}
.compare-group-title {
    font-size: 12px;
    font-weight: 600;
    color: var(--color-info);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 12px;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--border-subtle);
}
.compare-row {
    display: flex;
    gap: 12px;
    padding: 10px 0;
    border-bottom: 1px solid var(--border-subtle);
}
.compare-row:last-child {
    border-bottom: none;
}
.compare-stat-value {
    flex: 1;
    min-width: 120px;
    text-align: center;
    font-size: 14px;
    font-weight: 600;
    font-family: 'Space Grotesk', sans-serif;
}
.compare-stat-value.best {
    color: var(--color-success);
    font-weight: 600;
}

@media (max-width: 768px) {
    .compare-bar-content {
        flex-wrap: wrap;
    }
    .compare-players-list {
        max-width: 100%;
    }
    .compare-modal-body {
        min-width: auto;
        padding: 16px;
    }
    .compare-stat-label {
        width: 100px;
    }
    .compare-stat-value {
        min-width: 80px;
    }
}

   AI SCOUTING REPORT — Comparison Modal v2
   ============================================ */

/* Expanded modal for report view */
.compare-modal-container.report-mode {
    max-width: 95vw;
    width: 95vw;
    max-height: 92vh;
}
.compare-modal-container.report-mode .compare-modal-body {
    min-width: unset;
    padding: 0;
}
.comparison-report {
    padding: 24px;
}

/* — Report Header — */
.report-header {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 20px;
}
.report-header-icon {
    width: 40px;
    height: 40px;
    border-radius: 12px;
    background: linear-gradient(135deg, rgba(96,165,250,0.2), rgba(168,85,247,0.2));
    display: flex;
    align-items: center;
    justify-content: center;
    color: #60A5FA;
}
.report-header-text h3 {
    font-family: 'Space Grotesk', sans-serif;
    font-size: 16px;
    font-weight: 600;
    margin: 0;
}
.report-header-text p {
    font-size: 12px;
    color: var(--text-muted);
    margin: 2px 0 0;
}

/* — Situational Picks Row — */
.report-picks-row {
    display: flex;
    gap: 10px;
    margin-bottom: 24px;
    overflow-x: auto;
    padding-bottom: 4px;
}
.report-pick-card {
    flex: 1;
    min-width: 150px;
    background: var(--surface-2);
    border: 1px solid var(--border-subtle);
    border-radius: 14px;
    padding: 14px;
    position: relative;
    transition: all 150ms;
}
.report-pick-card:hover {
    border-color: var(--border-default);
    transform: translateY(-1px);
}
.report-pick-card.pick-value { border-top: 3px solid #34D399; }
.report-pick-card.pick-ceiling { border-top: 3px solid #F87171; }
.report-pick-card.pick-safety { border-top: 3px solid #60A5FA; }
.report-pick-card.pick-fixtures { border-top: 3px solid #FBBF24; }
.report-pick-card.pick-form { border-top: 3px solid #A78BFA; }
.report-pick-category {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    color: var(--text-muted);
    margin-bottom: 8px;
}
.report-pick-winner {
    font-family: 'Space Grotesk', sans-serif;
    font-size: 14px;
    font-weight: 600;
    color: var(--text-primary);
    margin-bottom: 4px;
}
.report-pick-reason {
    font-size: 11px;
    color: var(--text-secondary);
    line-height: 1.5;
}

/* — Radar + Dashboard Section — */
.report-dashboard {
    display: grid;
    grid-template-columns: 360px 1fr;
    gap: 20px;
    margin-bottom: 24px;
    align-items: start;
}
.report-radar-container {
    background: var(--surface-2);
    border: 1px solid var(--border-subtle);
    border-radius: 14px;
    padding: 16px;
}
.report-radar-canvas-wrap {
    position: relative;
    height: 280px;
    width: 100%;
    max-height: 40vh;
}
.report-radar-container h4 {
    font-family: 'Space Grotesk', sans-serif;
    font-size: 13px;
    font-weight: 600;
    margin: 0 0 4px;
}
.report-radar-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 8px;
    justify-content: center;
}
.report-radar-legend-item {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 11px;
    color: var(--text-secondary);
}
.report-radar-legend-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
}

/* — Stats Comparison Table — */
.report-stats-container {
    background: var(--surface-2);
    border: 1px solid var(--border-subtle);
    border-radius: 14px;
    padding: 16px;
    overflow-x: auto;
}
.report-stats-container h4 {
    font-family: 'Space Grotesk', sans-serif;
    font-size: 13px;
    font-weight: 600;
    margin: 0 0 12px;
}
.report-stats-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.report-stats-table th {
    text-align: center;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-secondary);
    padding: 6px 10px;
    border-bottom: 1px solid var(--border-default);
}
.report-stats-table th:first-child {
    text-align: left;
    color: var(--text-muted);
    font-weight: 600;
}
.report-stats-table td {
    text-align: center;
    padding: 7px 10px;
    border-bottom: 1px solid var(--border-subtle);
    font-family: 'Space Grotesk', sans-serif;
}
.report-stats-table td:first-child {
    text-align: left;
    color: var(--text-muted);
    font-size: 12px;
    font-family: inherit;
}
.report-stats-table td.best-val {
    color: var(--color-success);
    font-weight: 600;
}
.report-stats-table tr.group-header td {
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--color-info);
    padding-top: 14px;
    border-bottom: 1px solid var(--border-default);
}

/* — Player Profile Cards — */
.report-profiles {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 16px;
    margin-bottom: 24px;
}
.report-player-card {
    background: var(--surface-2);
    border: 1px solid var(--border-subtle);
    border-radius: 14px;
    padding: 20px;
    position: relative;
}
.report-player-card-header {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 14px;
}
.report-player-avatar {
    width: 44px;
    height: 44px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    font-size: 15px;
    flex-shrink: 0;
}
.report-player-avatar.pos-GK { background: rgba(251,191,36,0.15); color: #FBBF24; }
.report-player-avatar.pos-DEF { background: rgba(52,211,153,0.15); color: #34D399; }
.report-player-avatar.pos-MID { background: rgba(96,165,250,0.15); color: #60A5FA; }
.report-player-avatar.pos-FWD { background: rgba(248,113,113,0.15); color: #F87171; }
.report-player-info h4 {
    font-family: 'Space Grotesk', sans-serif;
    font-size: 15px;
    font-weight: 600;
    margin: 0;
}
.report-player-info .meta {
    font-size: 12px;
    color: var(--text-muted);
    margin-top: 2px;
}
.report-player-badges {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    margin-left: auto;
}
.report-badge {
    padding: 3px 8px;
    border-radius: 6px;
    font-size: 10px;
    font-weight: 600;
    white-space: nowrap;
}
.report-badge-pick {
    background: rgba(74,222,128,0.15);
    color: #4ADE80;
}

/* Narrative verdict */
.report-narrative {
    margin-bottom: 14px;
}
/* The scout's take — prose, not three bullet lists.

   A column of chips puts "3 routes to points" and "Team in strong form" at
   identical weight, so nothing on the card says which of them decides the pick,
   and the only line that actually compares the players ends up last and
   smallest. Two paragraphs: what he is, then how he sits against the others. */
.report-take p {
    font-size: 12px;
    line-height: 1.65;
    color: var(--text-secondary);
    margin: 0 0 8px;
}
.report-take p:last-child {
    margin-bottom: 0;
    color: var(--text-primary);
    border-left: 2px solid var(--border-emphasis);
    padding-left: 10px;
}

/* Actual against expected, players as columns. Cells are two lines — the pair
   and the gap — because the gap is the reading and the pair is the evidence. */
.ave-table {
    width: 100%;
    border-collapse: collapse;
    font-variant-numeric: tabular-nums;
}
.ave-table th, .ave-table td {
    padding: 6px 8px;
    text-align: center;
    font-size: 12px;
    border-bottom: 1px solid var(--border-default);
}
.ave-table thead th {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--text-muted);
}
.ave-table tbody th[scope="row"] {
    text-align: left;
    font-weight: 600;
    font-size: 11px;
    color: var(--text-secondary);
    white-space: nowrap;
}
/* The window the row is measured over, under its name rather than repeated in
   every cell. */
.ave-table tbody th[scope="row"] small {
    display: block;
    font-weight: 500;
    font-size: 9.5px;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: var(--text-muted);
}
.ave-cell { }
.ave-pair { display: block; color: var(--text-primary); font-weight: 600; }
.ave-pair i { font-style: normal; color: var(--text-muted); font-weight: 400; padding: 0 1px; }
.ave-delta { display: block; font-size: 10.5px; font-weight: 700; margin-top: 1px; }
.ave-na { color: var(--text-muted); }

/* Over, under, par, and not enough to say. The last one is deliberately the
   same grey as a blank: a sample too thin to read is not a neutral result. */
.ave-cell.t-over .ave-delta { color: var(--color-success); }
.ave-cell.t-under .ave-delta { color: var(--color-error); }
.ave-cell.t-par .ave-delta { color: var(--text-secondary); }
.ave-cell.t-thin .ave-delta,
.ave-cell.t-thin .ave-pair { color: var(--text-muted); font-weight: 500; }

.ave-key {
    margin-top: 8px;
    font-size: 10.5px;
    line-height: 1.5;
    color: var(--text-muted);
}
/* The row header carries three things: the stat, the window it was measured
   over, and which direction is the good one — that last is the only part the
   reader cannot get from the numbers, and it is what the colours depend on. */
.ave-table tbody th[scope="row"] em {
    display: block;
    font-style: normal;
    font-weight: 500;
    font-size: 9px;
    letter-spacing: .02em;
    color: var(--text-muted);
    opacity: .85;
}
.ave-pair b { font-weight: 700; }
.ave-pair { font-size: 11px; font-weight: 400; color: var(--text-secondary); }
.ave-delta { font-size: 11px; }

.ave-key {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 14px;
    align-items: center;
}
.ave-sw {
    display: inline-block;
    width: 9px; height: 9px;
    border-radius: 2px;
    margin-right: 5px;
    vertical-align: -1px;
    background: var(--text-muted);
}
.ave-sw.t-over { background: var(--color-success); }
.ave-sw.t-under { background: var(--color-error); }
.ave-sw.t-par { background: var(--text-secondary); }
.ave-note {
    margin: 6px 0 0;
    font-size: 10.5px;
    line-height: 1.55;
    color: var(--text-muted);
}

/* Purple patch: the run, then what is holding it up, then the call. */
.report-patch-lead {
    font-size: 11px;
    line-height: 1.5;
    color: var(--text-secondary);
    margin: 2px 0 8px;
}
.report-patch-verdict {
    margin-top: 8px;
    font-size: 11px;
    line-height: 1.55;
    color: var(--text-primary);
    border-left: 2px solid var(--border-emphasis);
    padding-left: 9px;
}


.report-verdict {
    font-size: 13px;
    line-height: 1.7;
    color: var(--text-secondary);
    border-left: 3px solid var(--color-info);
    padding-left: 12px;
    margin-bottom: 10px;
}
.report-strengths, .report-concerns {
    list-style: none;
    padding: 0;
    margin: 0 0 8px;
}
.report-strengths li, .report-concerns li {
    font-size: 12px;
    line-height: 1.6;
    padding: 3px 0;
    display: flex;
    align-items: baseline;
    gap: 6px;
}
.report-strengths li::before {
    content: '▲';
    color: var(--color-success);
    font-size: 9px;
    flex-shrink: 0;
}
.report-concerns li::before {
    content: '▼';
    color: var(--color-error);
    font-size: 9px;
    flex-shrink: 0;
}

/* Budget indicator */
.report-budget-line {
    font-size: 11px;
    padding: 6px 10px;
    border-radius: 8px;
    margin-top: 8px;
    display: flex;
    align-items: center;
    gap: 6px;
}
.report-budget-fit {
    background: rgba(74,222,128,0.1);
    color: var(--color-success);
}
.report-budget-over {
    background: rgba(239,68,68,0.1);
    color: var(--color-error);
}
.report-budget-neutral {
    background: rgba(156,163,175,0.1);
    color: var(--text-muted);
}

/* Fixture strip in player card */
.report-fixture-strip {
    display: flex;
    gap: 6px;
    margin-top: 10px;
    overflow-x: auto;
}
.report-fixture-chip {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-width: 48px;
    padding: 4px 6px;
    border-radius: 8px;
    font-size: 11px;
    font-weight: 600;
}
.report-fixture-chip .venue {
    font-size: 9px;
    font-weight: 400;
    opacity: 0.7;
}

/* — Routes Comparison — */
.report-routes-section {
    background: var(--surface-2);
    border: 1px solid var(--border-subtle);
    border-radius: 14px;
    padding: 16px;
    margin-bottom: 24px;
}
.report-routes-section h4 {
    font-family: 'Space Grotesk', sans-serif;
    font-size: 13px;
    font-weight: 600;
    margin: 0 0 12px;
}
.report-routes-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 14px;
}
.report-routes-player {
    background: var(--surface-1);
    border-radius: 10px;
    padding: 12px;
}
.report-routes-player-name {
    font-size: 12px;
    font-weight: 600;
    margin-bottom: 8px;
}
.report-route-bar {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 5px;
}
.report-route-label {
    font-size: 10px;
    color: var(--text-muted);
    width: 65px;
    flex-shrink: 0;
}
.report-route-track {
    flex: 1;
    height: 6px;
    background: var(--surface-3);
    border-radius: 3px;
    overflow: hidden;
}
.report-route-fill {
    height: 100%;
    border-radius: 3px;
    transition: width 400ms ease;
}
.report-route-value {
    font-size: 10px;
    color: var(--text-secondary);
    width: 30px;
    text-align: right;
    font-family: 'Space Grotesk', sans-serif;
}
/* Defensive contribution is the longest route name on the site and its detail
   reads "10+ in 3 of 4", so neither column can stay sized for "Goals" and
   "0.31". A label that truncates to "Defensive contr…" is the same failure as
   omitting the route: the reader cannot tell what they are looking at. */
.report-route-label { width: 96px; line-height: 1.25; white-space: normal; }
.report-route-value { width: 68px; white-space: nowrap; }

/* A signal is shown and not counted. Dimmed rather than hidden, under a heading
   that says why, because "creativity is high and it is not a route" is worth
   knowing — it is just not worth adding to a total. */
.report-route-signal { opacity: .55; }
.report-route-signal-head {
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--text-muted);
    margin: 8px 0 4px;
}


/* — Collapsible Deep Analysis — */
.report-collapsible {
    background: var(--surface-2);
    border: 1px solid var(--border-subtle);
    border-radius: 14px;
    margin-bottom: 12px;
    overflow: hidden;
}
.report-collapsible-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 16px;
    cursor: pointer;
    transition: background 150ms;
}
.report-collapsible-header:hover {
    background: var(--surface-3);
}
.report-collapsible-header h4 {
    font-family: 'Space Grotesk', sans-serif;
    font-size: 13px;
    font-weight: 600;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 8px;
}
.report-collapsible-caret {
    color: var(--text-muted);
    transition: transform 200ms;
    font-size: 12px;
}
.report-collapsible.open .report-collapsible-caret {
    transform: rotate(180deg);
}
.report-collapsible-body {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows 300ms ease;
}
.report-collapsible.open .report-collapsible-body {
    grid-template-rows: 1fr;
}
.report-collapsible-content {
    padding: 0 16px 16px;
    overflow: hidden;
    min-height: 0;
}

/* Rising form signals in report */
.report-signal-row {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 6px 0;
    font-size: 12px;
}
.report-signal-icon {
    width: 28px;
    height: 28px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.report-signal-info {
    flex: 1;
}
.report-signal-label {
    font-weight: 600;
    font-size: 12px;
}
.report-signal-detail {
    font-size: 11px;
    color: var(--text-muted);
}
.report-signal-bar {
    width: 60px;
    height: 5px;
    background: var(--surface-3);
    border-radius: 3px;
    overflow: hidden;
}
.report-signal-fill {
    height: 100%;
    border-radius: 3px;
}

/* Team context comparison */
.report-team-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 12px;
}
.report-team-card {
    background: var(--surface-1);
    border-radius: 10px;
    padding: 12px;
}
.report-team-card-name {
    font-size: 12px;
    font-weight: 600;
    margin-bottom: 8px;
}
.report-team-stat {
    display: flex;
    justify-content: space-between;
    font-size: 11px;
    padding: 3px 0;
}
.report-team-stat-label {
    color: var(--text-muted);
}
.report-team-stat-value {
    font-weight: 600;
    font-family: 'Space Grotesk', sans-serif;
}
/* Why a panel is empty, rather than the panel simply being empty. "No rising
   form signals detected" was printed for a player nobody could measure and for
   one who was measured and flat — the same sentence for two different facts. */
.report-team-none,
.report-rising-none {
    font-size: 11px;
    line-height: 1.5;
    color: var(--text-muted);
    padding: 4px 0;
}


/* Home/away split table */
.report-splits-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 12px;
    margin-top: 8px;
}
.report-splits-table th {
    text-align: center;
    font-size: 11px;
    font-weight: 600;
    color: var(--text-muted);
    padding: 6px 8px;
    border-bottom: 1px solid var(--border-default);
}
.report-splits-table th:first-child { text-align: left; }
.report-splits-table td {
    text-align: center;
    padding: 6px 8px;
    border-bottom: 1px solid var(--border-subtle);
    font-family: 'Space Grotesk', sans-serif;
}
.report-splits-table td:first-child {
    text-align: left;
    font-family: inherit;
    color: var(--text-muted);
}



/* Responsive */
@media (max-width: 900px) {
    .report-dashboard {
        grid-template-columns: 1fr;
    }
    .report-profiles {
        grid-template-columns: 1fr;
    }
    .report-picks-row {
        flex-wrap: nowrap;
    }
    .compare-modal-container.report-mode {
        max-width: 98vw;
        width: 98vw;
    }
}
@media (max-width: 600px) {
    .comparison-report { padding: 14px; }
    .report-pick-card { min-width: 130px; padding: 10px; }
    .report-routes-grid { grid-template-columns: 1fr; }
    .report-team-grid { grid-template-columns: 1fr; }
}