/* Race Predictor — Public Styles */
:root {
        --rp-primary: #e10600;
        --rp-primary-dark: #b50500;
        --rp-secondary: #1e2d3d;
        --rp-accent: #f5a623;
        --rp-gold: #ffd700;
        --rp-silver: #c0c0c0;
        --rp-bronze: #cd7f32;
        --rp-bg: #f8f9fa;
        --rp-white: #ffffff;
        --rp-text: #222;
        --rp-text-light: #666;
        --rp-border: #dee2e6;
        --rp-success: #28a745;
        --rp-danger: #dc3545;
        --rp-radius: 8px;
        --rp-shadow: 0 2px 8px rgba(0,0,0,0.08);
}

/* ===== General ===== */
.rp-notice { padding: 12px 16px; background: #e8f4f8; border-left: 4px solid var(--rp-primary); border-radius: var(--rp-radius); margin-bottom: 16px; }
.rp-notice-success { background: #d4edda; border-left-color: var(--rp-success); }
.rp-login-notice { padding: 12px 16px; background: #fff3cd; border-left: 4px solid var(--rp-accent); border-radius: var(--rp-radius); }

/* ===== Race Header ===== */
.rp-race-header { display: flex; gap: 20px; align-items: flex-start; margin-bottom: 24px; padding: 20px; background: var(--rp-secondary); color: white; border-radius: var(--rp-radius); }
.rp-circuit-image { width: 140px; height: 90px; object-fit: contain; border-radius: var(--rp-radius); background: rgba(255,255,255,0.1); padding: 8px; }
.rp-race-title { margin: 0 0 6px; font-size: 1.5em; }
.rp-race-venue { margin: 0 0 4px; opacity: 0.8; font-size: 0.95em; }
.rp-race-date { margin: 0 0 12px; font-size: 0.9em; opacity: 0.7; }

/* ===== Countdown ===== */
.rp-deadline-wrap { margin-top: 8px; }
.rp-deadline-label { font-size: 0.85em; opacity: 0.8; display: block; margin-bottom: 4px; }
.rp-deadline-time { font-size: 0.9em; }
.rp-countdown { display: flex; gap: 6px; align-items: baseline; margin-top: 6px; font-weight: bold; }
.rp-cd-label { font-size: 0.75em; opacity: 0.7; }
.rp-countdown-days, .rp-countdown-hours, .rp-countdown-minutes, .rp-countdown-seconds { font-size: 1.4em; color: var(--rp-accent); min-width: 28px; text-align: center; }
.rp-closed-notice { background: rgba(220,53,69,0.2); padding: 6px 12px; border-radius: 4px; font-size: 0.9em; margin-top: 8px; }

/* ===== Prediction Form ===== */
.rp-prediction-wrap { font-family: inherit; }
.rp-form-section { background: var(--rp-white); border: 1px solid var(--rp-border); border-radius: var(--rp-radius); padding: 24px; margin-bottom: 20px; box-shadow: var(--rp-shadow); }
.rp-form-section h3 { margin: 0 0 8px; color: var(--rp-secondary); border-bottom: 2px solid var(--rp-primary); padding-bottom: 8px; }
.rp-hint { font-size: 0.85em; color: var(--rp-text-light); margin-bottom: 16px; }

/* Positions Grid */
.rp-positions-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 10px; }
.rp-position-entry { display: flex; align-items: center; gap: 10px; }
.rp-pos-label { font-size: 1.1em; font-weight: 700; color: var(--rp-primary); min-width: 30px; text-align: right; }
.rp-select-driver { flex: 1; padding: 8px 10px; border: 2px solid var(--rp-border); border-radius: 6px; font-size: 0.9em; transition: border-color 0.2s; }
.rp-select-driver:focus { border-color: var(--rp-primary); outline: none; }
.rp-select-driver.rp-duplicate { border-color: var(--rp-danger); background: #fff0f0; }

/* Bonuses */
.rp-bonuses-section { background: linear-gradient(135deg, #f8f9fa 0%, #eef2ff 100%); }
.rp-bonus-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 16px; }
.rp-bonus-item { background: white; padding: 14px; border-radius: 6px; border: 1px solid var(--rp-border); }
.rp-checkbox-label { display: flex; align-items: center; gap: 10px; cursor: pointer; }
.rp-checkbox-label input[type=checkbox] { width: 18px; height: 18px; accent-color: var(--rp-primary); }
.rp-checkbox-text { display: flex; flex-wrap: wrap; gap: 4px; align-items: center; }
.rp-bonus-icon { font-size: 1.2em; }
.rp-bonus-pts { font-size: 0.8em; color: var(--rp-success); font-weight: 600; background: #d4edda; padding: 2px 6px; border-radius: 10px; }
.rp-bonus-fl { grid-column: 1 / -1; }
.rp-number-input { padding: 6px 10px; border: 2px solid var(--rp-border); border-radius: 6px; width: 80px; font-size: 1em; margin-top: 6px; }
.rp-select-full { width: 100%; padding: 8px; border: 2px solid var(--rp-border); border-radius: 6px; font-size: 0.9em; margin-top: 6px; }
.rp-text-input { padding: 6px 10px; border: 2px solid var(--rp-border); border-radius: 6px; font-size: 0.9em; margin-top: 6px; }

/* Submit */
.rp-form-submit { display: flex; align-items: center; gap: 16px; padding: 16px 0; }
.rp-submit-btn { background: var(--rp-primary); color: white; border: none; padding: 12px 32px; font-size: 1em; font-weight: 600; border-radius: 6px; cursor: pointer; transition: background 0.2s, transform 0.1s; }
.rp-submit-btn:hover { background: var(--rp-primary-dark); }
.rp-submit-btn:active { transform: scale(0.98); }
.rp-submit-btn:disabled { opacity: 0.6; cursor: not-allowed; }
.rp-save-status { font-size: 0.9em; color: var(--rp-success); font-weight: 600; }
.rp-save-status.rp-error { color: var(--rp-danger); }

/* ===== Results ===== */
.rp-results-wrap { }
.rp-race-conditions { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 16px; }
.rp-condition-badge { padding: 4px 12px; border-radius: 20px; font-size: 0.85em; font-weight: 600; }
.rp-condition-badge.rp-rain { background: #cce5ff; color: #004085; }
.rp-condition-badge.rp-sc { background: #fff3cd; color: #856404; }
.rp-condition-badge.rp-dnf { background: #f8d7da; color: #721c24; }

.rp-results-table, .rp-predictions-results-table, .rp-standings-table, .rp-my-preds-table, .rp-predictions-table { width: 100%; border-collapse: collapse; margin-bottom: 24px; }
.rp-results-table th, .rp-results-table td,
.rp-predictions-results-table th, .rp-predictions-results-table td,
.rp-standings-table th, .rp-standings-table td,
.rp-my-preds-table th, .rp-my-preds-table td,
.rp-predictions-table th, .rp-predictions-table td { padding: 10px 12px; border-bottom: 1px solid var(--rp-border); text-align: left; font-size: 0.92em; }
.rp-results-table th, .rp-predictions-results-table th, .rp-standings-table th, .rp-my-preds-table th, .rp-predictions-table th { background: var(--rp-secondary); color: white; font-weight: 600; }
.rp-results-table tr:hover td, .rp-predictions-results-table tr:hover td, .rp-standings-table tr:hover td { background: var(--rp-bg); }

.rp-pos-cell { font-weight: 700; font-size: 1.1em; color: var(--rp-secondary); }
.rp-dnf-row td { color: var(--rp-text-light); }
.rp-driver-thumb { width: 32px; height: 32px; border-radius: 50%; object-fit: cover; vertical-align: middle; margin-right: 6px; }
.rp-fl-badge { background: var(--rp-primary); color: white; font-size: 0.72em; padding: 2px 5px; border-radius: 3px; margin-left: 4px; vertical-align: middle; cursor: help; }

/* Standings */
.rp-rank-cell { font-weight: 700; text-align: center; }
.rp-medal { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 50%; font-weight: 700; font-size: 0.85em; }
.rp-gold { background: var(--rp-gold); color: #333; }
.rp-silver { background: var(--rp-silver); color: #333; }
.rp-bronze { background: var(--rp-bronze); color: white; }
.rp-my-row { background: #fff8e1 !important; }
.rp-pts-cell { font-weight: 700; color: var(--rp-primary); font-size: 1.05em; }

/* Points Badge + Tooltip */
.rp-points-badge { display: inline-block; background: var(--rp-secondary); color: white; padding: 4px 10px; border-radius: 20px; font-weight: 700; cursor: pointer; position: relative; font-size: 1.05em; }
.rp-points-badge:hover { background: var(--rp-primary); }
.rp-points-tooltip { position: absolute; z-index: 100; background: white; border: 1px solid var(--rp-border); border-radius: 8px; padding: 12px; box-shadow: 0 4px 20px rgba(0,0,0,0.15); min-width: 200px; font-size: 0.85em; left: 0; top: 36px; }
.rp-bd-row { padding: 2px 0; color: var(--rp-text); }
.rp-bd-total { border-top: 1px solid var(--rp-border); margin-top: 6px; padding-top: 6px; }

/* Mini predictions */
.rp-pred-positions-mini { display: flex; flex-wrap: wrap; gap: 4px; }
.rp-mini-pos { font-size: 0.8em; padding: 2px 6px; border-radius: 4px; background: var(--rp-bg); border: 1px solid var(--rp-border); }
.rp-match-exact { background: #d4edda; border-color: var(--rp-success); color: #155724; }
.rp-match-close { background: #fff3cd; border-color: #ffc107; color: #856404; }
.rp-match-wrong { background: #f8d7da; border-color: #f5c6cb; color: #721c24; }

/* ===== Race Calendar ===== */
.rp-race-calendar { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 16px; }
.rp-race-card { background: white; border: 1px solid var(--rp-border); border-radius: var(--rp-radius); padding: 16px; box-shadow: var(--rp-shadow); }
.rp-race-card.rp-status-upcoming { border-left: 4px solid var(--rp-primary); }
.rp-race-card.rp-status-finished { border-left: 4px solid var(--rp-success); opacity: 0.8; }
.rp-race-card.rp-status-live { border-left: 4px solid var(--rp-accent); }
.rp-race-card-championship { font-size: 0.75em; color: var(--rp-text-light); text-transform: uppercase; letter-spacing: 0.5px; }
.rp-race-round { font-size: 0.8em; color: var(--rp-primary); font-weight: 600; margin-top: 2px; }
.rp-race-card-name { margin: 6px 0; font-size: 1em; color: var(--rp-secondary); }
.rp-race-card-venue { font-size: 0.85em; color: var(--rp-text-light); }
.rp-race-card-date { font-size: 0.9em; font-weight: 600; margin: 6px 0; }
.rp-race-card-deadline { font-size: 0.8em; color: var(--rp-text-light); margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--rp-border); }

/* ===== Badges ===== */
.rp-badge { display: inline-block; padding: 3px 10px; border-radius: 20px; font-size: 0.78em; font-weight: 600; }
.rp-badge-active, .rp-badge-upcoming { background: #d4edda; color: #155724; }
.rp-badge-finished { background: #cce5ff; color: #004085; }
.rp-badge-live { background: #f8d7da; color: #721c24; }
.rp-badge-inactive, .rp-badge-cancelled { background: #e2e3e5; color: #383d41; }
.rp-badge-archived { background: #d1ecf1; color: #0c5460; }

/* ===== Stats ===== */
.rp-bar-chart { margin-top: 12px; }
.rp-bar-row { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; }
.rp-bar-label { width: 120px; font-size: 0.85em; text-align: right; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rp-bar-container { flex: 1; background: var(--rp-bg); border-radius: 4px; height: 20px; overflow: hidden; }
.rp-bar { height: 100%; background: linear-gradient(90deg, var(--rp-primary), var(--rp-accent)); transition: width 0.6s ease; border-radius: 4px; }
.rp-bar-count { font-weight: 700; min-width: 24px; }

/* ===== My Predictions User Stats ===== */
.rp-user-stats { display: flex; gap: 20px; flex-wrap: wrap; background: var(--rp-secondary); color: white; padding: 16px 20px; border-radius: var(--rp-radius); margin-bottom: 20px; }
.rp-user-stat { text-align: center; }
.rp-stat-n { display: block; font-size: 1.8em; font-weight: 700; color: var(--rp-accent); }
.rp-stat-l { font-size: 0.8em; opacity: 0.8; }

/* ===== Others Predictions ===== */
.rp-others-predictions { margin-top: 24px; padding-top: 20px; border-top: 2px solid var(--rp-border); }
.rp-pos-chip { display: inline-block; background: var(--rp-bg); border: 1px solid var(--rp-border); border-radius: 4px; padding: 2px 6px; font-size: 0.82em; margin: 2px; }
.rp-more { font-size: 0.8em; color: var(--rp-text-light); }

/* ===== Widget Countdown ===== */
.rp-widget-countdown { text-align: center; padding: 10px 0; }
.rp-cd-race-name { font-weight: 700; font-size: 1em; margin-bottom: 4px; }
.rp-cd-label-text { font-size: 0.8em; color: var(--rp-text-light); margin-bottom: 8px; }
.rp-widget-cd { justify-content: center; }
.rp-cd-unit { display: flex; flex-direction: column; align-items: center; min-width: 48px; }
.rp-cd-unit span { font-size: 2em; font-weight: 700; color: var(--rp-primary); line-height: 1; }
.rp-cd-unit small { font-size: 0.7em; color: var(--rp-text-light); }
.rp-cd-sep { font-size: 1.5em; font-weight: 700; color: var(--rp-text-light); align-self: flex-start; margin-top: 4px; }
.rp-cd-race-date { font-size: 0.8em; color: var(--rp-text-light); margin-top: 8px; }

/* ===== Widget Standings ===== */
.rp-widget-standings-table { width: 100%; border-collapse: collapse; }
.rp-widget-standings-table td { padding: 6px 4px; border-bottom: 1px solid var(--rp-border); font-size: 0.88em; }
.rp-w-rank { width: 28px; font-weight: 700; color: var(--rp-secondary); }
.rp-w-pts { text-align: right; color: var(--rp-primary); font-weight: 700; }

/* ===== Widget Stats ===== */
.rp-ws-row { display: flex; justify-content: space-between; padding: 6px 0; border-bottom: 1px solid var(--rp-border); font-size: 0.9em; }
.rp-ws-value { font-weight: 700; }

/* ===== Readonly positions ===== */
.rp-positions-readonly { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.rp-pos-readonly { display: flex; align-items: center; gap: 6px; background: var(--rp-bg); padding: 6px 12px; border-radius: 6px; font-size: 0.9em; }
.rp-pos-num { font-weight: 700; color: var(--rp-primary); }

@media (max-width: 600px) {
        .rp-race-header { flex-direction: column; }
        .rp-positions-grid { grid-template-columns: 1fr; }
        .rp-bonus-grid { grid-template-columns: 1fr; }
        .rp-bonus-fl { grid-column: auto; }
        .rp-race-calendar { grid-template-columns: 1fr; }
        .rp-user-stats { gap: 10px; }
}

/* ===== Race Detail ===== */
.rp-race-detail-wrap { max-width: 900px; margin: 0 auto; }
.rp-race-header-img { width: 120px; height: 80px; object-fit: cover; border-radius: var(--rp-radius); }
.rp-race-header-info { flex: 1; }
.rp-race-champ-label { font-size: 0.85em; opacity: 0.75; margin-bottom: 4px; text-transform: uppercase; letter-spacing: 0.05em; }
.rp-round-badge { background: var(--rp-primary); color: white; padding: 2px 8px; border-radius: 4px; font-size: 0.75em; margin-right: 6px; vertical-align: middle; }
.rp-detail-section { margin: 28px 0; }
.rp-detail-section h3 { font-size: 1.2em; color: var(--rp-secondary); border-bottom: 2px solid var(--rp-primary); padding-bottom: 8px; margin-bottom: 16px; }
.rp-detail-section h4 { color: var(--rp-secondary); margin: 20px 0 10px; }
.rp-conditions-row { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 16px; }
.rp-row-dnf td { opacity: 0.55; }
.rp-participant-thumb { width: 28px; height: 28px; object-fit: cover; border-radius: 50%; vertical-align: middle; margin-right: 6px; }
.rp-badge-fastest { background: #7c3aed; color: white; padding: 2px 7px; border-radius: 4px; font-size: 0.78em; }
.rp-badge-rain { background: #0ea5e9; color: white; padding: 3px 9px; border-radius: 4px; font-size: 0.85em; }
.rp-badge-sc { background: #f59e0b; color: white; padding: 3px 9px; border-radius: 4px; font-size: 0.85em; }
.rp-badge-neutral { background: #6b7280; color: white; padding: 3px 9px; border-radius: 4px; font-size: 0.85em; }

/* ===== Stat Cards (detail & admin) ===== */
.rp-stat-cards { display: flex; gap: 16px; flex-wrap: wrap; margin-bottom: 20px; }
.rp-stat-card { background: var(--rp-white); border: 1px solid var(--rp-border); border-radius: var(--rp-radius); padding: 16px 20px; text-align: center; min-width: 110px; box-shadow: var(--rp-shadow); }
.rp-stat-number { display: block; font-size: 2em; font-weight: 700; color: var(--rp-primary); line-height: 1.1; }
.rp-stat-label { display: block; font-size: 0.8em; color: var(--rp-text-light); margin-top: 4px; }

/* ===== Score Distribution ===== */
.rp-score-dist { display: flex; flex-direction: column; gap: 8px; max-width: 420px; }
.rp-score-dist-bar { display: flex; align-items: center; gap: 10px; }
.rp-score-dist-label { width: 55px; font-size: 0.85em; color: var(--rp-text-light); flex-shrink: 0; }
.rp-score-dist-track { flex: 1; height: 18px; background: var(--rp-bg); border-radius: 4px; overflow: hidden; }
.rp-score-dist-fill { height: 100%; background: linear-gradient(90deg, var(--rp-primary), var(--rp-accent)); border-radius: 4px; }
.rp-score-dist-count { width: 24px; font-weight: 700; font-size: 0.85em; text-align: right; flex-shrink: 0; }

/* ===== Prediction Grid (detail) ===== */
.rp-predictions-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 16px; }
.rp-pred-card { background: var(--rp-white); border: 1px solid var(--rp-border); border-radius: var(--rp-radius); padding: 16px; box-shadow: var(--rp-shadow); }
.rp-pred-own { border-color: var(--rp-primary); border-width: 2px; }
.rp-pred-card-header { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 6px; }
.rp-pred-user { font-weight: 700; font-size: 0.95em; flex: 1; }
.rp-pred-total-pts { font-size: 1.2em; font-weight: 700; color: var(--rp-primary); margin-left: auto; }
.rp-pred-breakdown { font-size: 0.78em; color: var(--rp-text-light); margin-bottom: 10px; }
.rp-pred-positions-list { list-style: decimal; padding-left: 18px; margin: 0 0 10px; font-size: 0.85em; }
.rp-pred-positions-list li { padding: 2px 0; }
.rp-pred-positions-list li.rp-exact { color: var(--rp-success); font-weight: 700; }
.rp-pred-positions-list li.rp-close { color: var(--rp-accent); }
.rp-pred-positions-list li.rp-wrong { color: var(--rp-text-light); }
.rp-pred-bonuses { display: flex; gap: 6px; flex-wrap: wrap; }
.rp-pred-bonus { background: var(--rp-bg); border: 1px solid var(--rp-border); border-radius: 4px; padding: 2px 7px; font-size: 0.8em; }

/* ===== Race List - detail link ===== */
.rp-race-card a { color: inherit; text-decoration: none; border-bottom: 1px dashed currentColor; }
.rp-race-card a:hover { color: var(--rp-primary); }
.rp-btn-sm { display: inline-block; padding: 4px 12px; background: var(--rp-primary); color: white !important; border-radius: 4px; font-size: 0.82em; text-decoration: none !important; border: none !important; }
.rp-btn-sm:hover { background: var(--rp-primary-dark); }

/* ===== Position Stats Table ===== */
.rp-position-stats-table td, .rp-position-stats-table th { padding: 6px 10px; font-size: 0.88em; }
.rp-badge-active { background: var(--rp-success); color: white; padding: 2px 6px; border-radius: 3px; font-size: 0.8em; }
.rp-badge-inactive { background: var(--rp-danger); color: white; padding: 2px 6px; border-radius: 3px; font-size: 0.8em; }

/* Admin stat cards */
.rp-admin-race-stats { display: flex; gap: 16px; flex-wrap: wrap; margin: 16px 0; }
.rp-admin-race-stats .rp-stat-card { border: 1px solid #dee2e6; }

/* ===== Standings tipster link ===== */
.rp-tipster-stats-link { color: var(--rp-secondary); text-decoration: none; border-bottom: 1px dashed var(--rp-text-light); transition: color 0.2s, border-color 0.2s; }
.rp-tipster-stats-link:hover { color: var(--rp-primary); border-bottom-color: var(--rp-primary); }
.rp-me { color: var(--rp-text-light); font-size: 0.85em; }

/* ===== Public Tipster Modal ===== */
.rp-modal-overlay { position: fixed; inset: 0; z-index: 9999; background: rgba(0,0,0,0.55); align-items: center; justify-content: center; padding: 16px; }
.rp-modal-box { background: var(--rp-white); border-radius: var(--rp-radius); box-shadow: 0 8px 40px rgba(0,0,0,0.25); width: 100%; max-width: 660px; max-height: 85vh; display: flex; flex-direction: column; position: relative; }
.rp-modal-title { margin: 0; padding: 18px 52px 14px 20px; font-size: 1.15em; color: var(--rp-secondary); border-bottom: 2px solid var(--rp-primary); flex-shrink: 0; }
.rp-modal-close { position: absolute; top: 12px; right: 14px; background: none; border: none; font-size: 1.6em; cursor: pointer; color: var(--rp-text-light); line-height: 1; padding: 4px 8px; border-radius: 4px; }
.rp-modal-close:hover { background: var(--rp-bg); color: var(--rp-text); }
#rp-public-modal-body { overflow-y: auto; padding: 16px 20px; flex: 1; }

/* Summary cards inside modal */
.rp-tipster-stats-summary { display: flex; gap: 12px; flex-wrap: wrap; margin-bottom: 16px; }
.rp-ts-card { flex: 1; min-width: 90px; text-align: center; background: var(--rp-secondary); color: white; border-radius: var(--rp-radius); padding: 12px 8px; }
.rp-ts-num { display: block; font-size: 1.6em; font-weight: 700; color: var(--rp-accent); line-height: 1.2; }
.rp-ts-lbl { font-size: 0.75em; opacity: 0.8; }

/* Race prediction cards */
.rp-race-pred-card { border: 1px solid var(--rp-border); border-radius: 6px; margin-bottom: 10px; overflow: hidden; }
.rp-rpc-header { display: flex; align-items: center; justify-content: space-between; padding: 8px 12px; background: var(--rp-bg); border-bottom: 1px solid var(--rp-border); gap: 8px; }
.rp-rpc-race small { color: var(--rp-text-light); font-size: 0.8em; margin-left: 4px; }
.rp-rpc-pts { font-weight: 700; color: var(--rp-primary); font-size: 1em; white-space: nowrap; }
.rp-rpc-picks { padding: 8px 12px; display: flex; flex-wrap: wrap; gap: 4px; min-height: 36px; }
.rp-pick-chip { display: inline-block; background: var(--rp-bg); border: 1px solid var(--rp-border); border-radius: 4px; padding: 2px 6px; font-size: 0.8em; }
.rp-btn-toggle { display: block; margin: 0 12px 8px; font-size: 0.8em; padding: 3px 10px; cursor: pointer; border: 1px solid var(--rp-border); background: var(--rp-bg); border-radius: 4px; color: var(--rp-text-light); }
.rp-btn-toggle:hover { background: #eee; }

/* Breakdown detail inside modal */
.rp-bd-wrap { padding: 6px 12px 10px; background: #fafafa; border-top: 1px solid var(--rp-border); }
.rp-bd-section-title { margin: 8px 0 4px; font-size: 0.8em; font-weight: 700; text-transform: uppercase; letter-spacing: 0.4px; color: var(--rp-secondary); }
.rp-bd-line { display: flex; align-items: center; justify-content: space-between; padding: 3px 0; font-size: 0.82em; border-bottom: 1px solid #eee; }
.rp-bd-item { color: var(--rp-text); flex: 1; }
.rp-bd-item em { color: var(--rp-text-light); font-size: 0.9em; }
.rp-bd-pts { font-weight: 700; white-space: nowrap; margin-left: 12px; }
.rp-bd-pos { color: var(--rp-success); }
.rp-bd-bon { color: #e67e00; }
.rp-bd-total { border-top: 2px solid var(--rp-border) !important; border-bottom: none !important; margin-top: 4px; padding-top: 5px !important; }
.rp-bd-total-pts { color: var(--rp-primary); font-size: 1em; }
.rp-bd-muted { color: var(--rp-text-light) !important; font-style: italic; }
.rp-bd-pred-info { border-bottom: 1px dashed #eee; }

/* My predictions cards */
.rp-rpc-right { display: flex; align-items: center; gap: 8px; }
.rp-rpc-toggle-wrap { padding: 4px 12px 0; }
.rp-rpc-footer { padding: 8px 12px; border-top: 1px solid var(--rp-border); background: var(--rp-bg); }
.rp-notice-sm { margin: 6px 12px; font-size: 0.82em; color: var(--rp-text-light); font-style: italic; }

/* User guide */
.rp-user-guide { max-width: 760px; margin: 0 auto; line-height: 1.6; color: var(--rp-text); }
.rp-user-guide h2 { margin: 0 0 12px; color: var(--rp-primary); }
.rp-user-guide h3 { margin: 24px 0 10px; padding-bottom: 6px; border-bottom: 2px solid var(--rp-border); color: var(--rp-secondary); }
.rp-user-guide h4 { margin: 18px 0 8px; color: var(--rp-text); }
.rp-user-guide ul, .rp-user-guide ol { margin: 8px 0 12px 22px; }
.rp-user-guide li { margin-bottom: 4px; }
.rp-guide-intro { font-size: 1.05em; color: var(--rp-text-light); margin-bottom: 8px; }
.rp-guide-note { font-size: 0.9em; color: var(--rp-text-light); font-style: italic; margin: 6px 0 12px; padding-left: 12px; border-left: 3px solid var(--rp-border); }
.rp-guide-table { width: 100%; border-collapse: collapse; margin: 8px 0 12px; }
.rp-guide-table th, .rp-guide-table td { padding: 8px 12px; border-bottom: 1px solid var(--rp-border); text-align: left; }
.rp-guide-table th { background: var(--rp-bg); font-weight: 700; }
.rp-guide-table td:last-child, .rp-guide-table th:last-child { text-align: right; width: 90px; }
.rp-guide-faq dt { font-weight: 700; margin-top: 12px; color: var(--rp-text); }
.rp-guide-faq dd { margin: 4px 0 0; padding-left: 12px; color: var(--rp-text-light); }
.rp-guide-footer { margin-top: 24px; padding: 12px; background: var(--rp-bg); border-radius: 6px; text-align: center; font-weight: 600; }

@media (max-width: 600px) {
        .rp-predictions-grid { grid-template-columns: 1fr; }
        .rp-stat-cards { gap: 10px; }
        .rp-stat-card { min-width: 80px; padding: 12px; }
        .rp-stat-number { font-size: 1.5em; }
        .rp-modal-box { max-height: 92vh; }
        .rp-tipster-stats-summary { gap: 8px; }
        .rp-ts-card { min-width: 70px; padding: 10px 6px; }
}

/* ===== Sport Icons ===== */
.rp-sport-icon { font-size: 1.2em; margin-right: 4px; }
.rp-sport-f1::before { content: '🏎️ '; }
.rp-sport-motogp::before { content: '🏍️ '; }
.rp-sport-cycling::before { content: '🚴 '; }
.rp-sport-golf::before { content: '⛳ '; }

/* ===== Position Change Arrows ===== */
.rp-change-th { width: 40px; text-align: center; }
.rp-change-cell { text-align: center; font-size: 0.82em; white-space: nowrap; }
.rp-pos-up   { color: #16a34a; font-weight: 700; }
.rp-pos-down { color: #dc2626; font-weight: 700; }
.rp-pos-same { color: #94a3b8; }

/* ===== Pagination ===== */
.rp-pagination { display: flex; gap: 6px; margin-top: 16px; flex-wrap: wrap; }
.rp-page-btn { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px;
  border: 1px solid #cbd5e1; border-radius: 6px; color: #334155; text-decoration: none; font-size: 0.9em; }
.rp-page-btn:hover { background: #f1f5f9; }
.rp-page-btn.rp-page-current { background: #e10600; border-color: #e10600; color: #fff; }

/* ===== Tipster Profile ===== */
.rp-tipster-profile { max-width: 820px; }
.rp-profile-header { display: flex; align-items: center; gap: 20px; margin-bottom: 24px; }
.rp-profile-avatar img { border-radius: 50%; border: 3px solid #e10600; }
.rp-profile-info h2 { margin: 0 0 4px; font-size: 1.5em; }
.rp-profile-champ { color: #64748b; margin: 0 0 4px; }
.rp-profile-position { font-size: 1.05em; margin: 0; }
.rp-profile-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(110px, 1fr)); gap: 12px; margin-bottom: 24px; }
.rp-stat-box { background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 10px; padding: 14px; text-align: center; }
.rp-stat-value { display: block; font-size: 1.7em; font-weight: 800; color: #e10600; }
.rp-stat-label { display: block; font-size: 0.78em; color: #64748b; margin-top: 4px; }
.rp-profile-chart-wrap { max-width: 600px; margin-bottom: 16px; }

/* ===== League Block ===== */
.rp-league-wrap { max-width: 900px; }
.rp-league-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-bottom: 28px; }
@media (max-width: 600px) { .rp-league-actions { grid-template-columns: 1fr; } }
.rp-league-create, .rp-league-join { background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 10px; padding: 18px; }
.rp-league-create h3, .rp-league-join h3 { margin-top: 0; }
.rp-league-block { border: 1px solid #e2e8f0; border-radius: 10px; margin-bottom: 20px; overflow: hidden; }
.rp-league-header { display: flex; justify-content: space-between; align-items: flex-start; padding: 14px 18px; background: #f1f5f9; }
.rp-league-header h4 { margin: 0 0 4px; font-size: 1.1em; }
.rp-league-code { font-size: 0.9em; color: #475569; }
.rp-league-actions-right { display: flex; gap: 8px; align-items: center; }
.rp-league-table { margin: 0; }
.rp-btn-copy { background: none; border: 1px solid #cbd5e1; border-radius: 4px; padding: 2px 8px; cursor: pointer; font-size: 0.82em; margin-left: 6px; }
.rp-btn-copy:hover { background: #f1f5f9; }

/* ===== Locked Form ===== */
.rp-form-locked-notice { background: #fef9c3; border: 1px solid #fbbf24; border-radius: 8px;
  padding: 12px 16px; margin-bottom: 16px; font-weight: 600; color: #92400e; }
.rp-prediction-form:has(.rp-form-locked-notice) { opacity: 0.85; }

/* ===== CSV Export buttons ===== */
.rp-export-row { margin-bottom: 12px; }

/* ===== My Row highlight ===== */
.rp-league-table tr.rp-my-row td { background: rgba(225,6,0,0.06); font-weight: 600; }