/* Korean Fencing Tracker - Component Styles */

/* ====================================================================
   BADGE / CHIP PRIMITIVE
   The shared shape for every inline label. Reach for this before writing
   a new badge class: the reason a screenful of badges used to look
   hand-assembled is that each one re-invented its own padding, radius and
   font size, and none of them were inline-flex — so they sat on the text
   baseline at slightly different heights.

   Structure:  .fm-badge                    standard, fixed 24px height
               .fm-badge--micro             dense card-internal label
               .fm-badge--chip              clickable, 32px target
   Shape:      .fm-badge--pill              for pill-shaped variants
   Color:      .fm-badge--solid | --tint | --outline
   Colors carry meaning, so a variant sets colour only — never geometry.
   ==================================================================== */
.fm-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    height: var(--fm-badge-height);
    padding: var(--fm-badge-pad-md);
    border-radius: var(--fm-radius-sm);
    font-size: var(--fm-badge-fs-md);
    font-weight: 600;
    line-height: 1;
    white-space: nowrap;
    letter-spacing: -0.005em;
    box-sizing: border-box;
}

.fm-badge--micro {
    height: auto;
    padding: var(--fm-badge-pad-sm);
    font-size: var(--fm-badge-fs-sm);
}

.fm-badge--chip {
    height: var(--fm-chip-height);
    padding: var(--fm-badge-pad-lg);
    border-radius: var(--fm-radius-pill);
    cursor: pointer;
}

.fm-badge--pill {
    border-radius: var(--fm-radius-pill);
}

/* --- colour variants --- */
.fm-badge--solid {
    background: var(--fm-accent-primary);
    color: #fff;
}

.fm-badge--solid-blue {
    background: var(--fm-accent-secondary);
    color: #fff;
}

/* Tint: 10% wash of the accent with a darkened text colour. Verified at
   5.9:1 (light) and 8.4:1 (dark) — both clear AA for small text. */
.fm-badge--tint {
    background: rgba(201, 48, 44, 0.10);
    color: #a82824;
}

.fm-badge--tint-blue {
    background: rgba(30, 58, 138, 0.10);
    color: #1e3a8a;
}

.fm-badge--outline {
    background: transparent;
    border: 1px solid var(--fm-border-light);
    color: var(--fm-text-secondary);
}

[data-theme="dark"] .fm-badge--tint {
    background: rgba(201, 48, 44, 0.18);
    color: #f0a6a3;
}

[data-theme="dark"] .fm-badge--tint-blue {
    background: rgba(96, 133, 235, 0.18);
    color: #a8c0f5;
}

/* ==================== Tab Navigation ==================== */
.tabs {
    display: flex;
    border-bottom: 2px solid var(--border-color);
    margin-bottom: 20px;
    background: white;
    border-radius: var(--fm-radius-sm) var(--fm-radius-sm) 0 0;
    overflow: hidden;
}

.tab-btn {
    flex: 1;
    padding: 15px 20px;
    border: none;
    background: transparent;
    cursor: pointer;
    font-size: 1rem;
    font-weight: 500;
    color: var(--text-light);
    transition: all 0.3s;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.tab-btn:hover {
    background: #f5f5f5;
    color: var(--primary-color);
}

.tab-btn.active {
    background: var(--primary-color);
    color: white;
}

.tab-btn .tab-icon {
    font-size: 1.2rem;
}

.tab-content {
    display: none;
    animation: fadeIn 0.3s ease;
    /* Ensure tab content stays below search dropdowns */
    position: relative;
    z-index: 1;
}

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

@keyframes fadeIn {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}

/* ==================== Pool Section ==================== */
.pool-selector {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 20px;
    padding: 15px;
    background: #f8f9fa;
    border-radius: var(--fm-radius-sm);
}

.pool-btn {
    padding: 8px 16px;
    border: 1px solid var(--border-color);
    background: white;
    border-radius: var(--fm-radius-pill);
    cursor: pointer;
    font-size: 0.9rem;
    transition: all 0.2s;
}

.pool-btn:hover {
    border-color: var(--primary-color);
    color: var(--primary-color);
}

.pool-btn.active {
    background: var(--primary-color);
    color: white;
    border-color: var(--primary-color);
}

/* 내 선수가 속한 풀 버튼 강조 (active 와 시각적으로 구분: 링 + ⭐ 마커) */
.pool-btn.my-player-pool {
    border-color: var(--fm-accent-primary, #c9302c);
    box-shadow: inset 0 0 0 1px var(--fm-accent-primary, #c9302c);
    font-weight: 700;
}

.pool-btn.my-player-pool::before {
    content: "\2b50 ";
    font-size: 0.85em;
}

.pool-btn.my-player-pool.active {
    box-shadow: 0 0 0 2px rgba(201, 48, 44, 0.35);
}

/* 내 선수 풀 빠른 이동 바 */
.my-player-pool-bar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    margin-bottom: 12px;
    background: rgba(201, 48, 44, 0.06);
    border: 1px solid rgba(201, 48, 44, 0.25);
    border-radius: var(--fm-radius-sm);
    font-size: 0.85rem;
}

.my-player-pool-bar .mpp-label {
    font-weight: 700;
    color: var(--fm-accent-primary, #c9302c);
}

.my-player-pool-bar .mpp-item {
    color: var(--text-secondary, #555);
    background: rgba(0, 0, 0, 0.03);
    padding: 2px 8px;
    border-radius: var(--fm-radius-sm);
}

.my-player-pool-bar .mpp-jump-btn {
    margin-left: auto;
    padding: 6px 14px;
    border: none;
    border-radius: var(--fm-radius-sm);
    background: var(--fm-accent-primary, #c9302c);
    color: #fff;
    font-weight: 600;
    font-size: 0.8rem;
    cursor: pointer;
    transition: background 0.15s;
}

.my-player-pool-bar .mpp-jump-btn:hover {
    background: var(--fm-accent-primary-hover, #a82824);
}

.pool-container {
    background: white;
    border-radius: var(--fm-radius-md);
    padding: 20px;
    margin-bottom: 20px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.05);
}

.pool-title {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 15px;
    border-bottom: 2px solid var(--accent-color);
    margin-bottom: 15px;
}

.pool-title h4 {
    color: var(--secondary-color);
    margin: 0;
}

.pool-info {
    font-size: 0.85rem;
    color: var(--text-light);
}

/* Pool Matrix Table */
.pool-matrix {
    overflow-x: auto;
    margin-top: 15px;
}

.matrix-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.85rem;
}

.matrix-table th,
.matrix-table td {
    padding: 8px;
    text-align: center;
    border: 1px solid var(--border-color);
    min-width: 45px;
}

.matrix-table th {
    background: var(--primary-color);
    color: white;
    font-weight: 500;
}

.matrix-table .player-col {
    text-align: left;
    font-weight: 500;
    background: #f8f9fa;
    min-width: 100px;
}

.matrix-table .team-col {
    text-align: left;
    font-size: 0.8rem;
    color: var(--text-light);
    background: #f8f9fa;
}

.matrix-table .victory {
    background: #e8f5e9;
    color: var(--success-color);
    font-weight: bold;
}

.matrix-table .defeat {
    background: #ffebee;
    color: var(--danger-color);
}

.matrix-table .self {
    background: #e0e0e0;
}

.matrix-table .stats-col {
    background: #f5f5f5;
    font-weight: 500;
}

/* Bout List */
.bout-list {
    margin-top: 15px;
    padding-top: 15px;
    border-top: 1px solid var(--border-color);
}

.bout-list-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
    padding: 10px;
    background: #f8f9fa;
    border-radius: var(--fm-radius-sm);
    margin-bottom: 10px;
}

.bout-list-header:hover {
    background: #e8e8e8;
}

.bout-item {
    display: flex;
    align-items: center;
    padding: 10px 15px;
    border-bottom: 1px solid #f0f0f0;
    gap: 15px;
}

.bout-item:last-child {
    border-bottom: none;
}

.bout-players {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 10px;
}

.bout-player {
    flex: 1;
    text-align: center;
}

.bout-player.winner {
    font-weight: bold;
    color: var(--success-color);
}

.bout-player.loser {
    color: var(--text-light);
}

.bout-score {
    font-weight: bold;
    font-size: 1.1rem;
    padding: 5px 15px;
    background: #f5f5f5;
    border-radius: var(--fm-radius-sm);
}

.bout-result {
    width: 50px;
    text-align: center;
}

.bout-result .win {
    color: var(--success-color);
    font-weight: bold;
}

.bout-result .loss {
    color: var(--danger-color);
}

/* ==================== Tournament Bracket (DE - Direct Elimination) ==================== */
.tournament-container {
    background: white;
    border-radius: var(--fm-radius-md);
    padding: 20px;
}

/* DE Seeding Section */
.de-seeding-section {
    margin-bottom: 20px;
}

.seeding-content {
    padding: 15px;
    background: #f8f9fa;
    border-radius: var(--fm-radius-md);
}

.seeding-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    gap: 8px;
}

.seeding-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 12px;
    background: white;
    border-radius: var(--fm-radius-sm);
    border: 1px solid #eee;
}

.seeding-rank {
    font-weight: bold;
    color: var(--primary-color);
    min-width: 30px;
    text-align: center;
    background: #f0f7ff;
    padding: 4px 8px;
    border-radius: var(--fm-radius-sm);
}

.seeding-name {
    flex: 1;
    font-weight: 500;
}

.seeding-name a {
    color: inherit;
    text-decoration: none;
}

.seeding-name a:hover {
    color: var(--primary-color);
}

.seeding-team {
    color: var(--text-light);
    font-size: 0.9em;
}

/* DE Round Tabs */
.de-round-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 20px;
    padding: 15px;
    background: #f1f3f5;
    border-radius: var(--fm-radius-sm);
}

.de-round-tab {
    padding: 10px 20px;
    border: 2px solid var(--border-color);
    background: white;
    border-radius: var(--fm-radius-pill);
    cursor: pointer;
    font-size: 0.95rem;
    font-weight: 500;
    transition: all 0.3s;
}

.de-round-tab:hover {
    border-color: var(--primary-color);
    color: var(--primary-color);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}

.de-round-tab.active {
    background: var(--primary-color, #c9302c);
    color: white;
    border-color: var(--primary-color);
    box-shadow: 0 4px 15px rgba(0,0,0,0.2);
}

/* DE Round Content */
.de-round-content {
    display: none;
    animation: fadeIn 0.3s ease;
}

.de-round-content.active {
    display: block;
}

.de-round-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px 20px;
    background: var(--fm-accent-secondary, #1e3a8a);
    color: white;
    border-radius: var(--fm-radius-sm);
    margin-bottom: 20px;
}

.de-round-header h3 {
    margin: 0;
    font-size: 1.3rem;
}

.de-round-info {
    background: rgba(255,255,255,0.2);
    padding: 5px 15px;
    border-radius: var(--fm-radius-sm);
    font-size: 0.9rem;
}

/* DE Match Cards Grid */
.de-matches-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 20px;
}

.de-match-card {
    background: white;
    border: 1px solid var(--border-color);
    border-radius: var(--fm-radius-md);
    overflow: hidden;
    box-shadow: 0 2px 10px rgba(0,0,0,0.05);
    transition: all 0.3s;
}

.de-match-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 25px rgba(0,0,0,0.1);
}

.de-match-number {
    background: #f5f5f5;
    padding: 8px 15px;
    font-size: 0.8rem;
    color: var(--text-light);
    text-align: center;
    font-weight: 500;
}

.de-match-players {
    padding: 15px;
}

.de-player {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 15px;
    border-radius: var(--fm-radius-sm);
    margin-bottom: 5px;
    transition: all 0.2s;
}

.de-player.winner {
    background: #e3f3e6;
}

.de-player.loser {
    background: #f5f5f5;
    opacity: 0.8;
}

.de-seed {
    width: 28px;
    height: 28px;
    background: var(--primary-color);
    color: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.75rem;
    font-weight: bold;
    flex-shrink: 0;
}

.de-player.loser .de-seed {
    background: #9e9e9e;
}

.de-player-info {
    flex: 1;
}

.de-player-name {
    font-weight: 600;
    font-size: 1rem;
}

.de-player-team {
    font-size: 0.8rem;
    color: var(--text-light);
}

.de-score {
    font-size: 1.3rem;
    font-weight: bold;
    color: var(--primary-color);
    min-width: 30px;
    text-align: right;
}

.de-player.loser .de-score {
    color: var(--text-light);
}

.de-vs {
    text-align: center;
    font-size: 0.75rem;
    color: var(--text-light);
    font-weight: bold;
    margin: 5px 0;
}

.de-match-result {
    background: #f8f9fa;
    padding: 10px 15px;
    text-align: center;
}

.de-winner-badge {
    display: inline-flex;
    background: var(--fm-medal-gold, #d4a574);
    color: #241a0e;
    padding: var(--fm-badge-pad-md);
    border-radius: var(--fm-radius-pill);
    font-size: var(--fm-badge-fs-md);
    font-weight: 600;
    align-items: center;
    justify-content: center;
    line-height: 1;
    white-space: nowrap;
    box-sizing: border-box;
    height: var(--fm-badge-height);
}

/* ==================== Tree Bracket View (Tournament Style) ==================== */
.de-tree-wrapper {
    overflow-x: auto;
    padding: 30px 20px;
    background: #16213e;
    border-radius: var(--fm-radius-md);
    min-height: 400px;
}

.de-tree-bracket {
    display: flex;
    gap: 0;
    min-width: max-content;
    padding: 20px;
    align-items: stretch;
}

.de-tree-round {
    display: flex;
    flex-direction: column;
    min-width: 220px;
    position: relative;
    padding: 0 25px;
}

/* First round spacing reference */
.de-tree-round:first-child {
    padding-left: 10px;
}

.de-tree-round:last-child {
    padding-right: 10px;
}

.de-tree-round-title {
    text-align: center;
    font-weight: bold;
    color: #fff;
    background: var(--fm-accent-secondary, #1e3a8a);
    padding: 12px 20px;
    border-radius: var(--fm-radius-pill);
    margin-bottom: 25px;
    font-size: 0.9rem;
    text-transform: uppercase;
    letter-spacing: 1px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.35);
}

.de-tree-matches {
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    flex: 1;
    gap: 8px;
    position: relative;
}

.de-tree-match {
    background: white;
    border: none;
    border-radius: var(--fm-radius-sm);
    overflow: hidden;
    position: relative;
    box-shadow: 0 4px 15px rgba(0,0,0,0.2);
    transition: all 0.3s ease;
}

.de-tree-match:hover {
    transform: scale(1.02);
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.3);
}

/* Horizontal connector lines (match to next round) */
.de-tree-match::after {
    content: '';
    position: absolute;
    right: -25px;
    top: 50%;
    width: 25px;
    height: 2px;
    background: var(--fm-accent-secondary, #1e3a8a);
}

/* Vertical connector lines between matches */
.de-tree-match::before {
    content: '';
    position: absolute;
    left: -25px;
    top: 50%;
    width: 25px;
    height: 2px;
    background: var(--fm-accent-secondary, #1e3a8a);
}

.de-tree-round:first-child .de-tree-match::before {
    display: none;
}

.de-tree-round:last-child .de-tree-match::after {
    display: none;
}

/* Bracket vertical connectors */
.de-tree-round:not(:last-child) .de-tree-matches::after {
    content: '';
    position: absolute;
    right: -25px;
    top: 25%;
    height: 50%;
    width: 2px;
    background: var(--fm-accent-secondary, #1e3a8a);
}

.de-tree-player {
    display: flex;
    align-items: center;
    padding: 10px 14px;
    gap: 10px;
    border-bottom: 1px solid #eee;
    font-size: 0.85rem;
    transition: background 0.2s ease;
}

.de-tree-player:last-child {
    border-bottom: none;
}

.de-tree-player.winner {
    background: #d8ecdd;
}

.de-tree-player .seed {
    color: var(--fm-accent-secondary, #1e3a8a);
    font-weight: bold;
    font-size: 0.75rem;
    min-width: 32px;
    background: #eef2fb;
    padding: 2px 6px;
    border-radius: var(--fm-radius-sm);
    text-align: center;
}

.de-tree-player .name {
    flex: 1;
    font-weight: 500;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #333;
}

.de-tree-player.winner .name {
    font-weight: 700;
    color: #155724;
}

.de-tree-player .score {
    font-weight: bold;
    color: var(--fm-accent-secondary, #1e3a8a);
    min-width: 28px;
    text-align: right;
    font-size: 0.9rem;
}

.de-tree-player.winner .score {
    color: #155724;
}

/* Champion highlight for final match winner */
.de-tree-round:last-child .de-tree-match .de-tree-player.winner {
    background: #fdf3d4;
}

.de-tree-round:last-child .de-tree-match .de-tree-player.winner .name {
    color: #856404;
}

/* Simple List View */
.de-simple-list {
    margin-top: 20px;
    border: 1px solid var(--border-color);
    border-radius: var(--fm-radius-md);
    overflow: hidden;
}

.de-list-content {
    padding: 15px;
}

.seed-cell {
    font-weight: bold;
    color: var(--primary-color);
    text-align: center;
    width: 60px;
}

/* Legacy support - old bracket styles */
.round-filter {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 20px;
    padding: 15px;
    background: #f8f9fa;
    border-radius: var(--fm-radius-sm);
}

.round-btn {
    padding: 8px 16px;
    border: 1px solid var(--border-color);
    background: white;
    border-radius: var(--fm-radius-pill);
    cursor: pointer;
    font-size: 0.9rem;
    transition: all 0.2s;
}

.round-btn:hover {
    border-color: var(--primary-color);
}

.round-btn.active {
    background: var(--secondary-color);
    color: white;
    border-color: var(--secondary-color);
}

/* Old Bracket Visualization (kept for backward compatibility) */
.bracket-wrapper {
    overflow-x: auto;
    padding: 20px 0;
}

.bracket {
    display: flex;
    gap: 40px;
    min-width: max-content;
}

.bracket-round {
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    min-width: 200px;
}

.bracket-round-title {
    text-align: center;
    font-weight: bold;
    color: var(--primary-color);
    margin-bottom: 15px;
    padding: 8px;
    background: #f0f0f0;
    border-radius: var(--fm-radius-sm);
}

.bracket-match {
    background: white;
    border: 1px solid var(--border-color);
    border-radius: var(--fm-radius-sm);
    margin: 10px 0;
    overflow: hidden;
}

.bracket-player {
    padding: 10px 15px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid var(--border-color);
}

.bracket-player:last-child {
    border-bottom: none;
}

.bracket-player.winner {
    background: #e8f5e9;
    font-weight: bold;
}

.bracket-player-name {
    font-size: 0.9rem;
}

.bracket-player-team {
    font-size: 0.75rem;
    color: var(--text-light);
}

.bracket-player-score {
    font-weight: bold;
    font-size: 1rem;
}

/* Match List Table */
.match-list-table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 20px;
}

.match-list-table th,
.match-list-table td {
    padding: 12px;
    text-align: left;
    border-bottom: 1px solid var(--border-color);
}

.match-list-table th {
    background: #f5f5f5;
    font-weight: 500;
    color: var(--text-color);
}

.match-list-table .round-cell {
    font-weight: 500;
    color: var(--primary-color);
}

.match-list-table .score-cell {
    font-weight: bold;
    text-align: center;
}

.match-list-table .winner-cell {
    color: var(--success-color);
    font-weight: 500;
}

/* ==================== Final Results ==================== */
.podium-section {
    background: #f7f7f8;
    border-radius: var(--fm-radius-md);
    padding: 30px;
    margin-bottom: 30px;
    text-align: center;
}

.podium {
    display: flex;
    justify-content: center;
    align-items: flex-end;
    gap: 20px;
    margin: 30px 0;
}

.podium-place {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.podium-medal {
    font-size: 2.5rem;
    margin-bottom: 10px;
}

.podium-box {
    background: white;
    border-radius: var(--fm-radius-md);
    padding: 15px 25px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.1);
    min-width: 120px;
}

/* Medal boxes carry dark text: white on the medal tokens falls under 4.5:1. */
.podium-place.first .podium-box {
    background: var(--fm-medal-gold, #d4a574);
    color: #241a0e;
    transform: scale(1.1);
}

.podium-place.second .podium-box {
    background: var(--fm-medal-silver, #9ca3af);
    color: #16181c;
}

.podium-place.third .podium-box {
    background: var(--fm-medal-bronze, #cd7f32);
    color: #241a0e;
}

.podium-name {
    font-weight: bold;
    font-size: 1.1rem;
    margin-bottom: 5px;
}

.podium-team {
    font-size: 0.85rem;
    opacity: 0.9;
}

.podium-rank {
    margin-top: 10px;
    font-size: 0.9rem;
    color: var(--text-light);
}

/* Final Rankings Table */
.final-table {
    width: 100%;
    border-collapse: collapse;
    background: white;
    border-radius: var(--fm-radius-md);
    overflow: hidden;
    box-shadow: 0 2px 10px rgba(0,0,0,0.05);
}

.final-table th,
.final-table td {
    padding: 12px 15px;
    text-align: left;
    border-bottom: 1px solid var(--border-color);
}

.final-table th {
    background: var(--primary-color);
    color: white;
    font-weight: 500;
}

.final-table tbody tr:hover {
    background: #f8f9fa;
}

.final-table .rank-cell {
    font-weight: bold;
    text-align: center;
    width: 60px;
}

.final-table .rank-cell.gold {
    color: #FFD700;
}

.final-table .rank-cell.silver {
    color: #C0C0C0;
}

.final-table .rank-cell.bronze {
    color: #CD7F32;
}

.final-table .name-cell {
    font-weight: 500;
}

.final-table .place-cell {
    color: var(--text-light);
    text-align: center;
}

.final-table .points-cell {
    font-weight: bold;
    color: var(--primary-color);
    text-align: center;
}

/* Stats Summary */
.stats-summary-box {
    display: flex;
    justify-content: center;
    gap: 30px;
    padding: 20px;
    background: #f8f9fa;
    border-radius: var(--fm-radius-md);
    margin-top: 20px;
}

.stat-item {
    text-align: center;
}

.stat-item .value {
    font-size: 1.5rem;
    font-weight: bold;
    color: var(--primary-color);
}

.stat-item .label {
    font-size: 0.85rem;
    color: var(--text-light);
}

/* ==================== Player Profile ==================== */
.player-header {
    background: var(--fm-accent-secondary, #1e3a8a);
    color: white;
    padding: 30px;
    border-radius: var(--fm-radius-md);
    margin-bottom: 30px;
}

.player-name {
    font-size: 2rem;
    font-weight: var(--fm-font-extrabold, 800);
    letter-spacing: var(--fm-tracking-tight, -0.02em);
    line-height: 1.15;
    margin-bottom: 5px;
}

.player-team {
    font-size: 1.1rem;
    opacity: 0.9;
    margin-bottom: 20px;
}

.rating-display {
    display: flex;
    gap: 15px;
    margin-top: 20px;
}

.rating-badge {
    background: rgba(255,255,255,0.2);
    padding: 15px 25px;
    border-radius: var(--fm-radius-md);
    text-align: center;
}

.rating-badge.active {
    background: rgba(255,255,255,0.3);
    border: 2px solid white;
}

.rating-value {
    font-size: 1.5rem;
    font-weight: bold;
}

.rating-weapon {
    font-size: 0.85rem;
    opacity: 0.9;
}

.rating-date {
    font-size: 0.8rem;
    opacity: 0.7;
    margin-top: 10px;
}

/* Player Stats Cards */
.player-stats {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 20px;
    margin-bottom: 30px;
}

.stat-card-large {
    background: white;
    border-radius: var(--fm-radius-md);
    padding: 20px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.05);
}

.stat-card-large h4 {
    color: var(--text-light);
    font-size: 0.9rem;
    margin-bottom: 15px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Podium Finishes Table */
.podium-table {
    width: 100%;
    border-collapse: collapse;
}

.podium-table th,
.podium-table td {
    padding: 10px;
    text-align: center;
    border-bottom: 1px solid var(--border-color);
}

.podium-table th {
    background: #f8f9fa;
    font-weight: 500;
    color: var(--text-color);
}

.podium-table .season-cell {
    text-align: left;
    font-weight: 500;
}

.podium-table .total-row {
    background: #f0f0f0;
    font-weight: bold;
}

/* ============================== */
/* Summary Tab: Hero Stats Bar    */
/* ============================== */
.hero-stats-bar {
    display: flex;
    gap: 12px;
    margin-bottom: 16px;
}

.hero-stat-card {
    flex: 1;
    background: white;
    border-radius: var(--fm-radius-md);
    padding: 16px 12px;
    text-align: center;
    box-shadow: 0 2px 10px rgba(0,0,0,0.05);
}

.hero-stat-value {
    font-size: 1.75rem;
    font-weight: var(--fm-font-bold, 700);
    letter-spacing: var(--fm-tracking-tight, -0.02em);
    color: var(--primary-color, #2563eb);
    line-height: 1.2;
}

.hero-stat-label {
    font-size: 0.75rem;
    color: var(--text-light, #888);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-top: 4px;
}

.hero-medals-inline {
    display: flex;
    justify-content: center;
    gap: 6px;
    font-size: 1.1rem;
}

.hero-medal {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    font-size: 0.85rem;
    font-weight: 700;
    color: white;
}

.hero-medal.gold { background: #f59e0b; }
.hero-medal.silver { background: #94a3b8; }
.hero-medal.bronze { background: #b45309; }

@media (max-width: 768px) {
    .hero-stats-bar {
        flex-wrap: wrap;
    }
    .hero-stat-card {
        flex: 1 1 calc(50% - 6px);
        min-width: 0;
    }
    .hero-stat-value {
        font-size: 1.4rem;
    }
}

/* ============================== */
/* Summary Tab: Medal Dashboard   */
/* ============================== */
.medal-count.clickable {
    cursor: pointer;
    text-decoration: underline;
    text-decoration-style: dotted;
    text-underline-offset: 3px;
    font-weight: 600;
    color: var(--primary-color, #2563eb);
    transition: color 0.15s;
}

.medal-count.clickable:hover {
    color: var(--primary-hover, #1d4ed8);
}

.medal-detail-row td {
    padding: 0 !important;
    border-bottom: 1px solid var(--border-color);
}

.medal-detail-panel {
    padding: 10px 16px;
    background: var(--bg-subtle, #f8fafc);
}

.medal-detail-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.medal-detail-list li {
    padding: 6px 0;
    border-bottom: 1px solid var(--border-color, #eee);
    font-size: 0.88rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
}

.medal-detail-list li:last-child {
    border-bottom: none;
}

.medal-detail-list a {
    color: var(--text-color, #333);
    text-decoration: none;
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.medal-detail-list a:hover {
    color: var(--primary-color, #2563eb);
}

.medal-rank-label {
    font-size: var(--fm-badge-fs-sm);
    padding: var(--fm-badge-pad-sm);
    border-radius: var(--fm-radius-pill);
    background: var(--bg-subtle, #f0f0f0);
    color: var(--text-light, #666);
    white-space: nowrap;
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    box-sizing: border-box;
}

.medal-detail-empty {
    text-align: center;
    color: var(--text-light, #888);
    padding: 8px;
    font-size: 0.85rem;
}

/* ============================== */
/* Summary Tab: Performance Bars  */
/* ============================== */
.performance-bars {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.perf-bar-row {
    display: flex;
    align-items: center;
    gap: 10px;
}

.perf-bar-label {
    width: 48px;
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--text-color, #333);
    text-align: right;
    flex-shrink: 0;
}

.perf-bar-track {
    flex: 1;
    height: 20px;
    background: var(--bg-subtle, #f0f0f0);
    border-radius: 10px;
    overflow: hidden;
}

.perf-bar-fill {
    height: 100%;
    border-radius: 10px;
}

.perf-bar-fill.high { background: #22c55e; }
.perf-bar-fill.mid  { background: #f59e0b; }
.perf-bar-fill.low  { background: #ef4444; }

.perf-bar-stat {
    width: 120px;
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--text-color, #333);
    flex-shrink: 0;
}

.perf-bar-detail {
    font-weight: 400;
    color: var(--text-light, #888);
    font-size: 0.78rem;
}

.period-badge {
    font-size: 0.75rem;
    font-weight: 400;
    color: var(--text-light, #888);
    margin-left: 0.5rem;
}

@media (max-width: 768px) {
    .perf-bar-label { width: 36px; font-size: 0.75rem; }
    .perf-bar-stat { width: 90px; font-size: 0.75rem; }
    .period-badge { display: block; margin-left: 0; margin-top: 0.25rem; }
}

.de-phase-label {
    font-size: 0.65rem;
    font-weight: 500;
    margin-left: 2px;
    padding: 1px 4px;
    border-radius: var(--fm-radius-sm);
    vertical-align: middle;
}
.de-phase-label.qualifying {
    color: #e67700;
    background: rgba(230, 119, 0, 0.1);
}

/* ============================== */
/* Summary Tab: Quick Insights    */
/* ============================== */
.insights-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 16px;
}

.insight-item {
    padding: 0;
}

.insight-title {
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--text-light, #888);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: 8px;
}

.rival-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 5px 0;
    border-bottom: 1px solid var(--border-color, #eee);
}

.rival-row:last-child { border-bottom: none; }

.rival-name {
    color: var(--text-color, #333);
    text-decoration: none;
    font-size: 0.88rem;
}

.rival-name:hover {
    color: var(--primary-color, #2563eb);
}

.rival-record {
    font-size: 0.82rem;
    font-weight: 600;
    padding: 2px 8px;
    border-radius: var(--fm-radius-md);
}

.rival-record.positive { color: #16a34a; background: rgba(34,197,94,0.1); }
.rival-record.negative { color: #dc2626; background: rgba(239,68,68,0.1); }
.rival-record.neutral  { color: #6b7280; background: rgba(107,114,128,0.1); }

.rating-row {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 4px 0;
    font-size: 0.85rem;
}

.rating-badge-sm {
    display: inline-flex;
    padding: var(--fm-badge-pad-sm);
    border-radius: var(--fm-radius-sm);
    background: var(--primary-color, #2563eb);
    color: white;
    font-size: var(--fm-badge-fs-sm);
    font-weight: 700;
    align-items: center;
    justify-content: center;
    line-height: 1;
    white-space: nowrap;
    box-sizing: border-box;
}

.rating-weapon-sm {
    color: var(--text-color, #333);
}

.rating-date-sm {
    color: var(--text-light, #888);
    font-size: 0.78rem;
    margin-left: auto;
}

/* History Results List */
.history-section {
    background: white;
    border-radius: var(--fm-radius-md);
    padding: 20px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.05);
}

.history-filters {
    display: flex;
    gap: 15px;
    margin-bottom: 20px;
    flex-wrap: wrap;
}

.history-filters select {
    padding: 10px 15px;
    border: 1px solid var(--border-color);
    border-radius: var(--fm-radius-sm);
    font-size: 0.95rem;
}

.result-card {
    border: 1px solid var(--border-color);
    border-radius: var(--fm-radius-md);
    margin-bottom: 15px;
    overflow: hidden;
}

.result-card-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px;
    background: #f8f9fa;
    cursor: pointer;
}

.result-card-header:hover {
    background: #f0f0f0;
}

.result-info {
    flex: 1;
}

.result-date {
    font-size: 0.85rem;
    color: var(--text-light);
}

.result-tournament {
    font-weight: 500;
    margin: 5px 0;
}

.result-event {
    font-size: 0.9rem;
    color: var(--secondary-color);
}

.result-stats {
    display: flex;
    gap: 15px;
    align-items: center;
}

.result-place {
    font-weight: bold;
    font-size: 1.1rem;
    padding: var(--fm-badge-pad-lg);
    background: white;
    border-radius: var(--fm-radius-pill);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    white-space: nowrap;
    box-sizing: border-box;
}

.result-place.gold { color: #FFD700; }
.result-place.silver { color: #C0C0C0; }
.result-place.bronze { color: #CD7F32; }

.result-rating {
    font-size: 0.9rem;
    color: var(--primary-color);
    font-weight: 500;
}

.result-expand-icon {
    color: var(--text-light);
    transition: transform 0.3s;
}

.result-card.expanded .result-expand-icon {
    transform: rotate(180deg);
}

.result-card-detail {
    display: none;
    padding: 20px;
    border-top: 1px solid var(--border-color);
}

.result-card.expanded .result-card-detail {
    display: block;
}

/* Detail Sections */
.detail-section {
    margin-bottom: 20px;
}

.detail-section:last-child {
    margin-bottom: 0;
}

.detail-section h5 {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 15px;
    color: var(--secondary-color);
    font-size: 1rem;
}

.detail-section .section-icon {
    font-size: 1.2rem;
}

.pool-summary {
    display: flex;
    gap: 20px;
    padding: 10px 15px;
    background: #f8f9fa;
    border-radius: var(--fm-radius-md);
    margin-bottom: 15px;
}

.pool-summary-item {
    font-size: 0.9rem;
}

.pool-summary-item strong {
    color: var(--primary-color);
}

/* Pool Stats Grid (Player Profile) */
.pool-section h5 {
    margin-bottom: 12px;
}

.pool-stats-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
    margin-bottom: 12px;
}

.pool-stat-card {
    background: #f8f9fa;
    border-radius: var(--fm-radius-md);
    padding: 12px 8px;
    text-align: center;
}

.pool-stat-value {
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--primary-color);
    line-height: 1.2;
}

.pool-stat-value .pool-stat-total {
    font-size: 0.9rem;
    font-weight: 500;
    color: var(--text-light);
}

.pool-stat-value .pool-wins {
    color: var(--success-color);
}

.pool-stat-value .pool-losses {
    color: var(--danger-color);
    margin-left: 4px;
}

.pool-stat-value.positive {
    color: var(--success-color);
}

.pool-stat-value.negative {
    color: var(--danger-color);
}

.pool-stat-label {
    font-size: 0.75rem;
    color: var(--text-light);
    margin-top: 4px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.pool-touches-info {
    display: flex;
    gap: 16px;
    padding: 8px 12px;
    background: #e9ecef;
    border-radius: var(--fm-radius-sm);
    margin-bottom: 12px;
    font-size: 0.85rem;
}

.touches-detail {
    color: var(--text-light);
}

/* Pool Bouts Accordion */
.pool-bouts-accordion {
    border: 1px solid var(--border-color);
    border-radius: var(--fm-radius-sm);
    overflow: hidden;
}

.pool-bouts-header {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 15px;
    background: #f8f9fa;
    cursor: pointer;
    font-size: 0.9rem;
    font-weight: 500;
    color: var(--secondary-color);
    transition: background-color 0.2s;
}

.pool-bouts-header:hover {
    background: #e9ecef;
}

.pool-bouts-toggle-icon {
    transition: transform 0.3s;
    font-size: 0.75rem;
}

.pool-bouts-accordion.expanded .pool-bouts-toggle-icon {
    transform: rotate(180deg);
}

.pool-bouts-content {
    display: none;
    padding: 10px;
    background: white;
}

.pool-bouts-accordion.expanded .pool-bouts-content {
    display: block;
}

/* Responsive Pool Stats */
@media (max-width: 480px) {
    .pool-stats-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .pool-stat-value {
        font-size: 1.1rem;
    }

    .pool-touches-info {
        flex-wrap: wrap;
        gap: 8px;
    }
}

.bout-detail-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.bout-detail-item {
    display: flex;
    align-items: center;
    padding: 8px 15px;
    background: #f8f9fa;
    border-radius: var(--fm-radius-sm);
    gap: 15px;
}

.bout-opponent {
    flex: 1;
}

.bout-opponent-name {
    font-weight: 500;
}

.bout-opponent-team {
    font-size: 0.8rem;
    color: var(--text-light);
}

.h2h-link {
    display: inline-block;
    font-size: 0.65rem;
    font-weight: 700;
    color: #fff;
    background: var(--primary-color, #1a5f7a);
    padding: 1px 5px;
    border-radius: var(--fm-radius-sm);
    text-decoration: none;
    vertical-align: middle;
    margin-left: 4px;
    opacity: 0.8;
    transition: opacity 0.2s;
}

.h2h-link:hover {
    opacity: 1;
    text-decoration: none;
}

.bout-detail-score {
    font-weight: bold;
    min-width: 60px;
    text-align: center;
}

.bout-detail-result {
    min-width: 40px;
    text-align: center;
    font-weight: bold;
}

.bout-detail-result.v { color: var(--success-color); }
.bout-detail-result.d { color: var(--danger-color); }

/* Tournament Progress */
.tournament-progress {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 15px;
    background: #f8f9fa;
    border-radius: var(--fm-radius-md);
    margin-bottom: 15px;
    flex-wrap: wrap;
}

.progress-step {
    padding: 5px 12px;
    background: #e0e0e0;
    border-radius: var(--fm-radius-pill);
    font-size: 0.85rem;
}

.progress-step.completed {
    background: var(--success-color);
    color: white;
}

.progress-step.current {
    background: var(--primary-color);
    color: white;
}

.progress-step.bye {
    background: var(--warning-color, #f59e0b);
    color: white;
}

.progress-step.bye small {
    display: block;
    font-size: 0.65rem;
    opacity: 0.9;
}

.bout-detail-item.bye-bout {
    background: #fef3c7;
}

.bout-detail-result.bye {
    color: var(--warning-color, #f59e0b);
}

.progress-arrow {
    color: var(--text-light);
}

/* Strength Tab */
.strength-overview {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 20px;
    margin-bottom: 30px;
}

.strength-card {
    background: white;
    border-radius: var(--fm-radius-md);
    padding: 20px;
    text-align: center;
    box-shadow: 0 2px 10px rgba(0,0,0,0.05);
}

.strength-value {
    font-size: 2rem;
    font-weight: bold;
    color: var(--primary-color);
}

.strength-label {
    color: var(--text-light);
    font-size: 0.9rem;
}

.opponent-table {
    width: 100%;
    border-collapse: collapse;
    background: white;
    border-radius: var(--fm-radius-md);
    overflow: hidden;
}

.opponent-table th,
.opponent-table td {
    padding: 12px 15px;
    text-align: left;
    border-bottom: 1px solid var(--border-color);
}

.opponent-table th {
    background: #f5f5f5;
    font-weight: 500;
}

.opponent-table .record-cell {
    font-weight: 500;
}

.opponent-table .winrate-cell {
    text-align: center;
}

.winrate-bar {
    height: 8px;
    background: #e0e0e0;
    border-radius: 4px;
    overflow: hidden;
    margin-top: 5px;
}

.winrate-fill {
    height: 100%;
    background: var(--success-color);
    border-radius: 4px;
}

/* Stage-wise Win Rate Visualization */
.stage-winrate-container {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 10px 0;
}

.stage-winrate-row {
    display: flex;
    align-items: center;
    gap: 12px;
}

.stage-label {
    min-width: 90px;
    font-weight: 500;
    color: var(--text-dark);
    font-size: 0.9rem;
    display: flex;
    align-items: center;
    gap: 6px;
}

.stage-count {
    font-size: 0.75rem;
    color: var(--text-light, #6c757d);
    font-weight: 400;
}

/* Date Range Filter */
.date-range-filter {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    background: var(--bg-light, #f8f9fa);
    border-radius: var(--fm-radius-md);
    margin-bottom: 16px;
    flex-wrap: wrap;
}

.date-range-filter label {
    font-size: 0.85rem;
    font-weight: 500;
    color: var(--text-dark);
}

.date-range-filter select,
.date-range-filter input[type="month"] {
    padding: 6px 10px;
    border: 1px solid var(--border-color, #dee2e6);
    border-radius: var(--fm-radius-sm);
    font-size: 0.85rem;
    background: white;
    cursor: pointer;
}

.date-range-filter select:focus,
.date-range-filter input[type="month"]:focus {
    outline: none;
    border-color: var(--primary-color);
    box-shadow: 0 0 0 2px rgba(0, 123, 255, 0.1);
}

.date-range-filter .filter-btn {
    padding: 6px 14px;
    background: var(--primary-color);
    color: white;
    border: none;
    border-radius: var(--fm-radius-sm);
    font-size: 0.85rem;
    cursor: pointer;
    transition: background 0.2s;
}

.date-range-filter .filter-btn:hover {
    background: var(--primary-dark, #0056b3);
}

.date-range-filter .reset-btn {
    padding: 6px 14px;
    background: var(--text-light, #6c757d);
    color: white;
    border: none;
    border-radius: var(--fm-radius-sm);
    font-size: 0.85rem;
    cursor: pointer;
}

.filter-period-display {
    font-size: 0.8rem;
    color: var(--text-light);
    margin-left: auto;
}

/* Year Filter Pills (Strength tab) */
.year-filter-pills {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 16px;
    padding: 10px 0;
}

.year-pill {
    padding: var(--fm-badge-pad-lg);
    border: 1px solid var(--border-color, #dee2e6);
    background: var(--bg-light, #f8f9fa);
    color: var(--text-dark, #333);
    border-radius: var(--fm-radius-pill);
    cursor: pointer;
    font-size: var(--fm-badge-fs-md);
    font-weight: 500;
    transition: all 0.2s;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    white-space: nowrap;
    box-sizing: border-box;
    height: var(--fm-chip-height);
}

.year-pill:hover {
    border-color: var(--primary-color, #007bff);
    color: var(--primary-color, #007bff);
}

.year-pill.active {
    background: var(--primary-color, #007bff);
    color: #fff;
    border-color: var(--primary-color, #007bff);
}

.stage-bar-container {
    flex: 1;
    height: 20px;
    background: #e9ecef;
    border-radius: 10px;
    overflow: hidden;
    position: relative;
}

.stage-bar {
    height: 100%;
    border-radius: 10px;
    transition: background 0.3s ease;
    min-width: 2px;
}

/* Win rate based colors */
.stage-bar.rate-high {
    background: #1e9e4a;  /* Green for 70%+ */
}

.stage-bar.rate-mid {
    background: #e0930b;  /* Amber for 40-70% */
}

.stage-bar.rate-low {
    background: #c9302c;  /* Red for <40% */
}

.stage-bar.final-bar {
    background: var(--fm-medal-gold, #d4a574);  /* Gold for finals */
}

.stage-stats {
    min-width: 140px;
    text-align: right;
    display: flex;
    align-items: center;
    gap: 6px;
    justify-content: flex-end;
}

.stage-rate {
    font-weight: 600;
    color: var(--primary-color);
    font-size: 0.95rem;
    min-width: 45px;
}

.stage-record {
    color: var(--text-light);
    font-size: 0.8rem;
}

.no-data-message {
    text-align: center;
    color: var(--text-light);
    font-style: italic;
    padding: 20px;
}

/* Responsive adjustments for stage win rates */
@media (max-width: 576px) {
    .stage-winrate-row {
        flex-wrap: wrap;
        gap: 8px;
    }

    .stage-label {
        min-width: 50px;
        font-size: 0.85rem;
    }

    .stage-bar-container {
        flex: 1 1 100%;
        order: 3;
        height: 16px;
    }

    .stage-stats {
        min-width: auto;
        flex: 1;
        justify-content: flex-end;
    }

    .stage-rate {
        font-size: 0.9rem;
    }

    .stage-record {
        font-size: 0.75rem;
    }
}

/* Expandable Opponent Detail */
.opponent-row {
    cursor: pointer;
}

.opponent-row:hover {
    background: #f8f9fa;
}

.opponent-detail {
    display: none;
    background: #f8f9fa;
}

.opponent-detail.expanded {
    display: table-row;
}

.opponent-detail td {
    padding: 15px;
}

.opponent-matches {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.opponent-match-item {
    display: flex;
    align-items: center;
    gap: 15px;
    padding: 8px 12px;
    background: white;
    border-radius: var(--fm-radius-sm);
}

/* ==================== Event Card Links ==================== */
.event-card-link {
    text-decoration: none;
    color: inherit;
    display: block;
}

.event-card .event-stats {
    margin-top: 10px;
    display: flex;
    gap: 8px;
}

.stat-badge {
    font-size: var(--fm-badge-fs-sm);
    padding: var(--fm-badge-pad-sm);
    background: #f0f0f0;
    border-radius: var(--fm-radius-pill);
    color: var(--text-light);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    white-space: nowrap;
    box-sizing: border-box;
}

/* ==================== Responsive ==================== */

/* Extra Small Devices (phones, 375px and up) */
@media (max-width: 480px) {
    .tabs {
        flex-direction: column;
        border-radius: var(--fm-radius-sm) var(--fm-radius-sm) 0 0;
    }

    .tab-btn {
        border-bottom: 1px solid var(--border-color);
        padding: 10px 12px;
        font-size: 0.85rem;
        gap: 6px;
    }

    .tab-btn .tab-icon {
        font-size: 1rem;
    }

    /* Podium - Mobile: 1위, 2위, 3위 순서로 표시 */
    .podium {
        flex-direction: column;
        align-items: center;
        gap: 12px;
        margin: 20px 0;
    }

    .podium-place {
        width: 100%;
        max-width: 260px;
    }

    .podium-place.first {
        order: -1;
    }

    .podium-place.second {
        order: 0;
    }

    .podium-place.third {
        order: 1;
    }

    .podium-place.first .podium-box {
        transform: scale(1);
    }

    .podium-box {
        width: 100%;
        padding: 10px 15px;
    }

    .podium-medal {
        font-size: 1.6rem;
        margin-bottom: 6px;
    }

    .podium-name {
        font-size: 0.95rem;
    }

    .podium-team {
        font-size: 0.8rem;
    }

    .podium-section {
        padding: 15px;
        border-radius: var(--fm-radius-md);
    }

    /* Pool/Tournament tables - Mobile 최적화 */
    .pool-container {
        padding: 10px;
        border-radius: var(--fm-radius-md);
    }

    .pool-title {
        flex-direction: column;
        align-items: flex-start;
        gap: 6px;
        padding-bottom: 10px;
    }

    .pool-title h4 {
        font-size: 1rem;
    }

    .pool-info {
        font-size: 0.75rem;
    }

    /* Result Table - Extra compact for mobile */
    .result-table {
        font-size: 0.75rem;
    }

    .result-table th,
    .result-table td {
        padding: 6px 4px;
    }

    .result-table th {
        font-size: 0.7rem;
    }

    .result-table .player-name {
        font-size: 0.8rem;
        font-weight: 600;
        max-width: 80px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    /* Final table - Mobile 최적화 */
    .final-table {
        font-size: 0.75rem;
    }

    .final-table th,
    .final-table td {
        padding: 8px 5px;
    }

    .final-table th {
        font-size: 0.7rem;
    }

    .final-table .name-cell {
        font-size: 0.85rem;
        font-weight: 600;
        max-width: 100px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .final-table .rank-cell {
        width: 40px;
    }

    /* Bracket */
    .bracket {
        flex-direction: column;
    }

    .bracket-round {
        min-width: 100%;
    }

    .bracket-player-name {
        font-size: 0.8rem;
    }

    .bracket-player-team {
        font-size: 0.65rem;
    }

    /* DE Bracket - Mobile */
    .de-round-tabs {
        padding: 8px;
        gap: 4px;
        flex-wrap: wrap;
    }

    .de-round-tab {
        padding: 6px 10px;
        font-size: 0.75rem;
        border-radius: var(--fm-radius-pill);
    }

    .de-round-header {
        padding: 10px 12px;
        flex-direction: column;
        gap: 6px;
        text-align: center;
        border-radius: var(--fm-radius-sm);
    }

    .de-round-header h3 {
        font-size: 1rem;
    }

    .de-round-info {
        font-size: 0.75rem;
        padding: 3px 10px;
    }

    .de-matches-grid {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .de-match-card {
        border-radius: var(--fm-radius-md);
    }

    .de-match-number {
        padding: 5px 10px;
        font-size: 0.7rem;
    }

    .de-match-players {
        padding: 8px;
    }

    .de-player {
        padding: 8px 10px;
        gap: 6px;
        border-radius: var(--fm-radius-sm);
    }

    .de-seed {
        width: 22px;
        height: 22px;
        font-size: 0.65rem;
    }

    .de-player-name {
        font-size: 0.85rem;
    }

    .de-player-team {
        font-size: 0.7rem;
    }

    .de-score {
        font-size: 1rem;
        min-width: 25px;
    }

    .de-vs {
        font-size: 0.65rem;
    }

    .de-match-result {
        padding: 8px 10px;
    }

    .de-winner-badge {
        padding: var(--fm-badge-pad-md);
        font-size: var(--fm-badge-fs-md);
    }

    /* Tree View - Mobile */
    .de-tree-wrapper {
        padding: 10px 8px;
        min-height: auto;
        border-radius: var(--fm-radius-md);
    }

    .de-tree-bracket {
        flex-direction: column;
        gap: 15px;
        padding: 8px;
    }

    .de-tree-round {
        min-width: 100%;
        padding: 0 5px;
    }

    .de-tree-round-title {
        padding: 8px 12px;
        font-size: 0.75rem;
        margin-bottom: 10px;
        border-radius: var(--fm-radius-pill);
    }

    .de-tree-matches {
        gap: 8px;
    }

    .de-tree-match {
        box-shadow: 0 2px 8px rgba(0,0,0,0.2);
        border-radius: var(--fm-radius-sm);
    }

    .de-tree-match::after,
    .de-tree-match::before,
    .de-tree-round:not(:last-child) .de-tree-matches::after {
        display: none;
    }

    .de-tree-player {
        padding: 6px 8px;
        font-size: 0.75rem;
        gap: 6px;
    }

    .de-tree-player.winner::before {
        font-size: 0.6rem;
        margin-right: -2px;
    }

    .de-tree-player .seed {
        min-width: 24px;
        font-size: 0.65rem;
        padding: 2px 3px;
    }

    .de-tree-player .name {
        font-size: 0.75rem;
    }

    .de-tree-player .score {
        font-size: 0.75rem;
        min-width: 20px;
    }

    /* Player Profile - Mobile */
    .player-header {
        padding: 15px;
        border-radius: var(--fm-radius-md);
    }

    .player-name {
        font-size: 1.3rem;
    }

    .player-team {
        font-size: 0.9rem;
        margin-bottom: 15px;
    }

    .rating-display {
        flex-direction: column;
        gap: 8px;
    }

    .rating-badge {
        padding: 10px 15px;
        border-radius: var(--fm-radius-md);
    }

    .rating-value {
        font-size: 1.2rem;
    }

    .rating-weapon {
        font-size: 0.8rem;
    }

    /* Result Cards - Mobile */
    .result-card {
        border-radius: var(--fm-radius-md);
        margin-bottom: 10px;
    }

    .result-card-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
        padding: 10px;
    }

    .result-date {
        font-size: 0.75rem;
    }

    .result-tournament {
        font-size: 0.85rem;
    }

    .result-event {
        font-size: 0.8rem;
    }

    .result-stats {
        width: 100%;
        justify-content: space-between;
    }

    .result-place {
        font-size: 0.9rem;
        padding: var(--fm-badge-pad-sm);
    }

    .result-rating {
        font-size: 0.8rem;
    }

    .result-card-detail {
        padding: 12px;
    }

    /* Tournament Progress */
    .tournament-progress {
        justify-content: flex-start;
        padding: 8px 10px;
        gap: 6px;
    }

    .progress-step {
        font-size: 0.7rem;
        padding: 3px 8px;
    }

    .progress-arrow {
        font-size: 0.7rem;
    }

    /* Bout Items - Mobile */
    .bout-item {
        padding: 6px 8px;
        gap: 10px;
    }

    .bout-player {
        font-size: 0.8rem;
    }

    .bout-player small {
        font-size: 0.7rem;
    }

    .bout-score {
        font-size: 0.9rem;
        padding: 3px 8px;
    }

    .bout-result {
        width: 35px;
    }

    /* Pool Selector - Mobile */
    .pool-selector {
        padding: 8px;
        gap: 4px;
        border-radius: var(--fm-radius-sm);
    }

    .pool-btn {
        padding: 5px 10px;
        font-size: 0.75rem;
        border-radius: var(--fm-radius-pill);
    }

    /* Stats Summary - Mobile */
    .stats-summary-box {
        gap: 15px;
        padding: 12px;
        flex-wrap: wrap;
        justify-content: space-around;
    }

    .stat-item .value {
        font-size: 1.1rem;
    }

    .stat-item .label {
        font-size: 0.7rem;
    }

    /* Matrix Table - Mobile */
    .pool-matrix {
        margin-top: 10px;
    }

    .matrix-table {
        font-size: 0.65rem;
    }

    .matrix-table th,
    .matrix-table td {
        padding: 4px 2px;
        min-width: 28px;
    }

    .matrix-table th {
        font-size: 0.6rem;
    }

    .matrix-table .player-col {
        min-width: 55px;
        font-size: 0.65rem;
        max-width: 60px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .matrix-table .team-col {
        display: none; /* Hide team column on very small screens */
    }

    .matrix-table .stats-col {
        min-width: 25px;
    }

    /* Strength Section - Mobile */
    .strength-overview {
        grid-template-columns: repeat(2, 1fr);
        gap: 8px;
    }

    .strength-card {
        padding: 12px;
        border-radius: var(--fm-radius-md);
    }

    .strength-value {
        font-size: 1.3rem;
    }

    .strength-label {
        font-size: 0.75rem;
    }

    .opponent-table {
        font-size: 0.8rem;
    }

    .opponent-table th,
    .opponent-table td {
        padding: 8px 6px;
    }

    /* History Section */
    .history-section {
        padding: 12px;
        border-radius: var(--fm-radius-md);
    }

    .history-filters {
        gap: 8px;
    }

    .history-filters select {
        padding: 8px 10px;
        font-size: 0.85rem;
    }

    /* Bout List */
    .bout-list-header {
        padding: 8px;
        font-size: 0.85rem;
    }

    .bout-detail-list {
        gap: 6px;
    }

    .bout-detail-item {
        padding: 6px 10px;
        gap: 10px;
    }

    .bout-opponent-name {
        font-size: 0.85rem;
    }

    .bout-opponent-team {
        font-size: 0.7rem;
    }

    .bout-detail-score {
        min-width: 50px;
        font-size: 0.85rem;
    }

    .bout-detail-result {
        min-width: 30px;
        font-size: 0.8rem;
    }

    /* Seeding Grid */
    .seeding-grid {
        grid-template-columns: 1fr;
        gap: 6px;
    }

    .seeding-item {
        padding: 6px 10px;
        border-radius: var(--fm-radius-sm);
    }

    .seeding-rank {
        min-width: 25px;
        padding: 3px 6px;
        font-size: 0.75rem;
    }

    .seeding-name {
        font-size: 0.85rem;
    }

    .seeding-team {
        font-size: 0.75rem;
    }
}

/* Small Devices (landscape phones, 481px to 768px) */
@media (min-width: 481px) and (max-width: 768px) {
    .tabs {
        flex-direction: column;
    }

    .tab-btn {
        border-bottom: 1px solid var(--border-color);
        padding: 12px 15px;
        font-size: 0.95rem;
    }

    /* Podium - Mobile: 1위, 2위, 3위 순서로 표시 */
    .podium {
        flex-direction: column;
        align-items: center;
        gap: 15px;
    }

    .podium-place {
        width: 100%;
        max-width: 280px;
    }

    .podium-place.first {
        order: -1; /* 1위를 맨 위로 */
    }

    .podium-place.second {
        order: 0;
    }

    .podium-place.third {
        order: 1;
    }

    .podium-place.first .podium-box {
        transform: scale(1);
    }

    .podium-box {
        width: 100%;
        padding: 12px 20px;
    }

    .podium-medal {
        font-size: 2rem;
    }

    .podium-name {
        font-size: 1.1rem;
    }

    .podium-team {
        font-size: 0.9rem;
    }

    /* Pool/Tournament tables - Mobile 최적화 */
    .pool-container {
        padding: 15px;
    }

    .pool-title {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }

    .pool-title h4 {
        font-size: 1.1rem;
    }

    .result-table {
        font-size: 0.85rem;
    }

    .result-table th,
    .result-table td {
        padding: 8px 6px;
    }

    .result-table .player-name {
        font-size: 0.9rem;
        font-weight: 600;
    }

    /* Final table - Mobile 최적화 */
    .final-table {
        font-size: 0.85rem;
    }

    .final-table th,
    .final-table td {
        padding: 10px 8px;
    }

    .final-table .name-cell {
        font-size: 0.95rem;
        font-weight: 600;
    }

    /* Bracket */
    .bracket {
        flex-direction: column;
    }

    .bracket-round {
        min-width: 100%;
    }

    .bracket-player-name {
        font-size: 0.85rem;
    }

    .bracket-player-team {
        font-size: 0.7rem;
    }

    /* DE Bracket - Mobile */
    .de-round-tabs {
        padding: 10px;
        gap: 6px;
    }

    .de-round-tab {
        padding: 8px 14px;
        font-size: 0.85rem;
    }

    .de-round-header {
        padding: 12px 15px;
        flex-direction: column;
        gap: 8px;
        text-align: center;
    }

    .de-round-header h3 {
        font-size: 1.1rem;
    }

    .de-matches-grid {
        grid-template-columns: 1fr;
        gap: 15px;
    }

    .de-match-players {
        padding: 10px;
    }

    .de-player {
        padding: 10px;
        gap: 8px;
    }

    .de-seed {
        width: 24px;
        height: 24px;
        font-size: 0.7rem;
    }

    .de-player-name {
        font-size: 0.9rem;
    }

    .de-player-team {
        font-size: 0.75rem;
    }

    .de-score {
        font-size: 1.1rem;
    }

    /* Tree View - Mobile */
    .de-tree-wrapper {
        padding: 15px 10px;
        min-height: auto;
        background: #16213e;
    }

    .de-tree-bracket {
        flex-direction: column;
        gap: 20px;
        padding: 10px;
    }

    .de-tree-round {
        min-width: 100%;
        padding: 0 10px;
    }

    .de-tree-round-title {
        padding: 10px 15px;
        font-size: 0.85rem;
        margin-bottom: 15px;
    }

    .de-tree-matches {
        gap: 10px;
    }

    .de-tree-match {
        box-shadow: 0 2px 10px rgba(0,0,0,0.2);
    }

    .de-tree-match::after,
    .de-tree-match::before,
    .de-tree-round:not(:last-child) .de-tree-matches::after {
        display: none;
    }

    .de-tree-player {
        padding: 8px 10px;
        font-size: 0.8rem;
        gap: 8px;
    }

    .de-tree-player.winner::before {
        font-size: 0.65rem;
        margin-right: -3px;
    }

    .de-tree-player .seed {
        min-width: 28px;
        font-size: 0.7rem;
        padding: 2px 4px;
    }

    .de-tree-player .name {
        font-size: 0.8rem;
    }

    .de-tree-player .score {
        font-size: 0.8rem;
        min-width: 24px;
    }

    /* Player Profile - Mobile */
    .player-header {
        padding: 20px;
    }

    .player-name {
        font-size: 1.5rem;
    }

    .player-team {
        font-size: 1rem;
    }

    .rating-display {
        flex-direction: column;
        gap: 10px;
    }

    .rating-badge {
        padding: 12px 20px;
    }

    .rating-value {
        font-size: 1.3rem;
    }

    /* Result Cards - Mobile */
    .result-card-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
        padding: 12px;
    }

    .result-tournament {
        font-size: 0.95rem;
    }

    .result-event {
        font-size: 0.85rem;
    }

    .result-stats {
        width: 100%;
        justify-content: space-between;
    }

    .result-place {
        font-size: 1rem;
        padding: var(--fm-badge-pad-md);
    }

    /* Tournament Progress */
    .tournament-progress {
        justify-content: center;
    }

    .progress-step {
        font-size: 0.8rem;
        padding: 4px 10px;
    }

    /* Bout Items - Mobile */
    .bout-item {
        padding: 8px 10px;
    }

    .bout-player {
        font-size: 0.85rem;
    }

    .bout-player small {
        font-size: 0.75rem;
    }

    .bout-score {
        font-size: 1rem;
        padding: 4px 10px;
    }

    /* Pool Selector - Mobile */
    .pool-selector {
        padding: 10px;
        gap: 6px;
    }

    .pool-btn {
        padding: 6px 12px;
        font-size: 0.85rem;
    }

    /* Stats Summary - Mobile */
    .stats-summary-box {
        gap: 20px;
        padding: 15px;
    }

    .stat-item .value {
        font-size: 1.3rem;
    }

    .stat-item .label {
        font-size: 0.8rem;
    }

    /* Matrix Table - Mobile */
    .matrix-table {
        font-size: 0.75rem;
    }

    .matrix-table th,
    .matrix-table td {
        padding: 5px 3px;
        min-width: 35px;
    }

    .matrix-table .player-col {
        min-width: 70px;
        font-size: 0.75rem;
    }

    /* Strength Section - Mobile */
    .strength-overview {
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
    }

    .strength-card {
        padding: 15px;
    }

    .strength-value {
        font-size: 1.5rem;
    }

    .strength-label {
        font-size: 0.8rem;
    }

    .opponent-table {
        font-size: 0.85rem;
    }

    .opponent-table th,
    .opponent-table td {
        padding: 10px 8px;
    }
}

/* Medium Devices (tablets, 769px to 1024px) */
@media (min-width: 769px) and (max-width: 1024px) {
    .tabs {
        flex-direction: row;
    }

    .tab-btn {
        padding: 14px 18px;
        font-size: 0.95rem;
    }

    .podium {
        gap: 25px;
    }

    .podium-box {
        min-width: 140px;
    }

    .pool-container {
        padding: 18px;
    }

    .result-table {
        font-size: 0.9rem;
    }

    .result-table th,
    .result-table td {
        padding: 10px 8px;
    }

    .de-matches-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .de-round-tabs {
        flex-wrap: nowrap;
        overflow-x: auto;
    }

    .seeding-grid {
        grid-template-columns: repeat(3, 1fr);
    }

    .strength-overview {
        grid-template-columns: repeat(4, 1fr);
    }
}

/* ==================== Disambiguation UI ==================== */

/* Disambiguation Badge in Player Header */
.player-header .disambiguation-badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: var(--fm-badge-fs-md);
    background: rgba(255, 193, 7, 0.3);
    color: #fff;
    padding: var(--fm-badge-pad-md);
    border-radius: var(--fm-radius-pill);
    margin-left: 10px;
    font-weight: 500;
    vertical-align: middle;
    justify-content: center;
    line-height: 1;
    white-space: nowrap;
    box-sizing: border-box;
    height: var(--fm-badge-height);
}

/* Team History Section in Player Header */
.team-history-section {
    margin-top: 15px;
    padding: 12px 15px;
    background: rgba(255, 255, 255, 0.15);
    border-radius: var(--fm-radius-md);
}

.team-history-title {
    font-size: 0.8rem;
    opacity: 0.8;
    margin-bottom: 8px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.team-history-list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.team-history-item {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: var(--fm-badge-fs-md);
    background: rgba(255, 255, 255, 0.2);
    padding: var(--fm-badge-pad-lg);
    border-radius: var(--fm-radius-pill);
    justify-content: center;
    line-height: 1;
    white-space: nowrap;
    box-sizing: border-box;
    height: var(--fm-chip-height);
}

.team-history-item .dates {
    font-size: 0.75rem;
    opacity: 0.8;
}

/* Disambiguation Section - Other Profiles (Accordion Style) */
.disambiguation-section {
    margin-top: 15px;
    background: rgba(255, 193, 7, 0.2);
    border-radius: var(--fm-radius-md);
    overflow: hidden;
}

.disambiguation-section.accordion .disambiguation-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 15px;
    cursor: pointer;
    transition: background 0.2s;
}

.disambiguation-section.accordion .disambiguation-header:hover {
    background: rgba(255, 255, 255, 0.1);
}

.disambiguation-title {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.85rem;
    font-weight: 500;
}

.disambiguation-icon {
    font-size: 1rem;
}

.disambiguation-count {
    font-size: var(--fm-badge-fs-sm);
    opacity: 0.8;
    background: rgba(255, 255, 255, 0.2);
    padding: var(--fm-badge-pad-sm);
    border-radius: var(--fm-radius-pill);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    white-space: nowrap;
    box-sizing: border-box;
}

.disambiguation-toggle {
    font-size: 0.75rem;
    color: rgba(255, 255, 255, 0.7);
    transition: transform 0.3s ease;
}

.disambiguation-section.expanded .disambiguation-toggle {
    transform: rotate(180deg);
}

/* Default: collapsed (숨김 상태) */
.disambiguation-section .disambiguation-content {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease;
    padding: 0 15px;
    opacity: 0;
}

/* Expanded: visible (펼친 상태) */
.disambiguation-section.expanded .disambiguation-content {
    max-height: 300px;
    padding: 0 15px 12px 15px;
    opacity: 1;
}

.other-profiles-list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.other-profile-link {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: var(--fm-badge-fs-md);
    background: rgba(255, 255, 255, 0.3);
    color: white;
    padding: var(--fm-badge-pad-lg);
    border-radius: var(--fm-radius-pill);
    text-decoration: none;
    transition: all 0.2s;
    justify-content: center;
    line-height: 1;
    white-space: nowrap;
    box-sizing: border-box;
    height: var(--fm-chip-height);
}

.other-profile-link:hover {
    background: rgba(255, 255, 255, 0.5);
    transform: translateY(-1px);
}

.other-profile-link .profile-count {
    font-size: 0.75rem;
    opacity: 0.85;
}

/* CSS Variables for warning color */
:root {
    --warning-color: #f59e0b;
    --warning-light: rgba(245, 158, 11, 0.15);
}

/* Mobile Responsive for Disambiguation */
@media (max-width: 768px) {
    .player-header .disambiguation-badge {
        display: block;
        margin-left: 0;
        margin-top: 8px;
        width: fit-content;
    }

    .team-history-section {
        padding: 10px 12px;
    }

    .disambiguation-section.accordion .disambiguation-header {
        padding: 10px 12px;
    }

    .disambiguation-title {
        font-size: 0.8rem;
    }

    .disambiguation-icon {
        font-size: 0.9rem;
    }

    .disambiguation-section.expanded .disambiguation-content {
        padding: 0 12px 10px 12px;
    }

    .team-history-list,
    .other-profiles-list {
        gap: 6px;
    }

    .team-history-item,
    .other-profile-link {
        font-size: var(--fm-badge-fs-sm);
        padding: var(--fm-badge-pad-sm);
        height: auto;
    }
}

/* ===========================================
   Player Name Links - Consistent Styling
   =========================================== */

/* Player name links in tables and result lists */
.player-name a,
.player-col a,
.name-cell a,
.podium-name a,
.de-player-name a,
.de-winner-badge a,
.de-tree-player .name a,
.bout-player a {
    color: inherit;
    text-decoration: none;
    transition: color 0.2s ease;
}

.player-name a:hover,
.player-col a:hover,
.name-cell a:hover,
.podium-name a:hover,
.de-player-name a:hover,
.de-winner-badge a:hover,
.de-tree-player .name a:hover,
.bout-player a:hover {
    color: var(--primary-color, #007bff);
    text-decoration: underline;
}

/* Ensure winner badge links maintain proper styling */
.de-winner-badge a {
    color: inherit;
}

.de-winner-badge a:hover {
    color: #333;
}

/* Bout player links */
.bout-player > div > a {
    color: inherit;
    text-decoration: none;
}

.bout-player > div > a:hover {
    color: var(--primary-color, #007bff);
    text-decoration: underline;
}

/* ==================== International Data Styles ==================== */

/* English Name */
.name-en {
    font-size: 0.85em;
    color: #666;
    font-weight: 400;
    margin-left: 8px;
    padding: 2px 8px;
    background: #f0f0f0;
    border-radius: var(--fm-radius-sm);
}

/* International Links */
.international-links {
    display: flex;
    gap: 12px;
    margin: 8px 0;
    flex-wrap: wrap;
}

.external-link {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: var(--fm-badge-pad-lg);
    border-radius: var(--fm-radius-pill);
    font-size: var(--fm-badge-fs-md);
    text-decoration: none;
    transition: all 0.2s;
    justify-content: center;
    line-height: 1;
    white-space: nowrap;
    box-sizing: border-box;
    height: var(--fm-chip-height);
}

.fie-link {
    background: #e3f2fd;
    color: #1565c0;
    border: 1px solid #90caf9;
}

.fie-link:hover {
    background: #1565c0;
    color: white;
}

.ft-link {
    background: #fff3e0;
    color: #e65100;
    border: 1px solid #ffcc80;
}

.ft-link:hover {
    background: #e65100;
    color: white;
}

.link-icon {
    font-size: 1em;
}

.verified-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
    background: #4caf50;
    color: white;
    border-radius: 50%;
    font-size: 0.7rem;
    margin-left: 4px;
}

/* ==================== Analysis Tab (FencingLab) ==================== */
.analysis-container {
    min-height: 300px;
}

.analysis-loading {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 200px;
    color: var(--text-light);
}

.analysis-notice {
    background: #f5f5f5;
    border-radius: var(--fm-radius-md);
    padding: 2rem;
    text-align: center;
    color: var(--text-secondary);
}

.analysis-notice.error {
    background: #fff5f5;
    border: 1px solid #ffcdd2;
    color: var(--danger-color);
}

/* Override FencingLab dark theme for player profile */
#tab-analysis .fl-player-card {
    background: var(--bg-card, white);
    color: var(--text-color, #333);
}

#tab-analysis .fl-history-container {
    background: var(--bg-card, white);
}

#tab-analysis .fl-history-title {
    color: var(--text-color, #333);
}

/* =====================================================
   DARK THEME OVERRIDES
   ===================================================== */

/* Tab Navigation */
.tabs {
    background: rgba(26, 26, 37, 0.6);
    border-bottom-color: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border-radius: var(--fm-radius-sm) var(--fm-radius-sm) 0 0;
}

.tab-btn {
    color: var(--text-secondary, #7f8c8d);
}

.tab-btn:hover {
    background: rgba(255, 255, 255, 0.05);
    color: var(--text-primary, #2c3e50);
}

.tab-btn.active {
    background: var(--accent-primary, #c9302c);
    color: #ffffff;
}

/* Pool Section */
.pool-selector {
    background: var(--bg-tertiary, #f8f9fa);
}

.pool-btn {
    background: var(--bg-card, white);
    border-color: var(--border-color, #e0e0e0);
    color: var(--text-primary, #333);
}

.pool-btn:hover {
    border-color: var(--accent-primary, #c9302c);
    color: var(--accent-primary, #c9302c);
}

.pool-btn.active {
    background: var(--accent-primary, #c9302c);
    border-color: var(--accent-primary, #c9302c);
    color: white;
}

.pool-container {
    background: var(--bg-card, white);
}

.pool-title {
    border-bottom-color: var(--accent-primary, #c9302c);
}

.pool-title h4 {
    color: var(--accent-gold, #d4a574);
}

.pool-info {
    color: var(--text-muted, #7f8c8d);
}

/* Matrix Table */
.matrix-table th {
    background: var(--accent-primary, #c9302c);
}

.matrix-table .player-col,
.matrix-table .team-col {
    background: var(--bg-tertiary, #f8f9fa);
    color: var(--text-primary, #333);
}

.matrix-table .team-col {
    color: var(--text-muted, #666);
}

.matrix-table .victory {
    background: rgba(16, 185, 129, 0.2);
    color: var(--success-color, #10b981);
}

.matrix-table .defeat {
    background: rgba(239, 68, 68, 0.2);
    color: var(--danger-color, #ef4444);
}

.matrix-table .self {
    background: var(--bg-tertiary, #e0e0e0);
}

.matrix-table .stats-col {
    background: var(--bg-secondary, #f5f5f5);
}

/* Bout List */
.bout-list {
    border-top-color: var(--border-color, #e0e0e0);
}

.bout-list-header {
    background: var(--bg-tertiary, #f8f9fa);
}

.bout-list-header:hover {
    background: var(--bg-secondary, #e8e8e8);
}

.bout-item {
    border-bottom-color: var(--border-color, #f0f0f0);
}

.bout-player.winner {
    color: var(--success-color, #10b981);
}

.bout-player.loser {
    color: var(--text-muted, #7f8c8d);
}

.bout-score {
    background: var(--bg-tertiary, #f5f5f5);
    color: var(--text-primary, #333);
}

/* Tournament Container */
.tournament-container {
    background: var(--bg-card, white);
}

/* DE Seeding */
.seeding-content {
    background: var(--bg-tertiary, #f8f9fa);
}

.seeding-item {
    background: var(--bg-card, white);
    border-color: var(--border-color, #eee);
}

.seeding-rank {
    color: var(--accent-primary, #c9302c);
    background: rgba(201, 48, 44, 0.1);
}

.seeding-name a:hover {
    color: var(--accent-primary, #c9302c);
}

.seeding-team {
    color: var(--text-muted, #666);
}

/* DE Round Tabs */
.de-round-tabs {
    background: var(--bg-tertiary, #f1f3f5);
}

.de-round-tab {
    background: var(--bg-card, white);
    border-color: var(--border-color, #ddd);
    color: var(--text-primary, #333);
}

.de-round-tab:hover {
    border-color: var(--accent-primary, #c9302c);
    color: var(--accent-primary, #c9302c);
}

.de-round-tab.active {
    background: var(--accent-primary, #c9302c);
    border-color: var(--accent-primary, #c9302c);
}

/* DE Match Card */
.de-match-card {
    background: var(--bg-card, white);
    border-color: var(--border-color, #e0e0e0);
}

.de-match-card:hover {
    box-shadow: 0 8px 25px rgba(201, 48, 44, 0.2);
}

.de-match-number {
    background: var(--bg-tertiary, #f5f5f5);
    color: var(--text-muted, #666);
}

.de-player {
    background: transparent;
}

.de-player.winner {
    background: rgba(16, 185, 129, 0.15);
    border-left-color: var(--success-color, #10b981);
}

.de-player.loser {
    background: var(--bg-tertiary, #f5f5f5);
}

.de-seed {
    background: var(--accent-primary, #c9302c);
}

.de-player.loser .de-seed {
    background: var(--text-muted, #9e9e9e);
}

.de-player-name {
    color: var(--text-primary, #333);
}

.de-player-team {
    color: var(--text-muted, #666);
}

.de-score {
    color: var(--accent-primary, #c9302c);
}

.de-player.loser .de-score {
    color: var(--text-muted, #666);
}

.de-vs {
    color: var(--text-muted, #666);
}

.de-match-result {
    background: var(--bg-tertiary, #f8f9fa);
}

.de-winner-badge {
    background: var(--fm-medal-gold, #d4a574);
}

/* Tree Bracket */
.de-tree-match {
    background: var(--bg-card, white);
}

.de-tree-player {
    border-bottom-color: var(--border-color, #eee);
}

.de-tree-player .seed {
    color: var(--accent-primary, #c9302c);
    background: rgba(201, 48, 44, 0.1);
}

.de-tree-player .name {
    color: var(--text-primary, #333);
}

.de-tree-player.winner .name {
    color: var(--success-color, #155724);
}

.de-tree-player .score {
    color: var(--accent-primary, #c9302c);
}

/* Podium */
.podium-section {
    background: var(--bg-card, #f7f7f8);
}

.podium-box {
    background: var(--bg-card, white);
}

.podium-rank {
    color: var(--text-muted, #666);
}

/* Final Rankings */
.final-table {
    background: var(--bg-card, white);
}

.final-table th {
    background: var(--accent-primary, #c9302c);
}

.final-table tbody tr:hover {
    background: rgba(255, 255, 255, 0.03);
}

.final-table td {
    border-bottom-color: var(--border-color, #e0e0e0);
}

.final-table .rank-cell.gold { color: var(--fm-medal-gold, #d4a574); }
.final-table .rank-cell.silver { color: var(--fm-medal-silver, #9ca3af); }
.final-table .rank-cell.bronze { color: var(--fm-medal-bronze, #cd7f32); }

/* Stats Summary Box */
.stats-summary-box {
    background: var(--bg-tertiary, #f8f9fa);
}

.stat-item .value {
    color: var(--accent-primary, #c9302c);
}

.stat-item .label {
    color: var(--text-muted, #666);
}

/* Player Header */
.player-header {
    background: rgba(30, 58, 138, 0.88);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

/* Rating Badge */
.rating-badge {
    background: rgba(255, 255, 255, 0.15);
}

.rating-badge.active {
    background: rgba(255, 255, 255, 0.25);
}

/* Player Stats Cards */
.stat-card-large {
    background: rgba(26, 26, 37, 0.75);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.08);
}

.stat-card-large h4 {
    color: var(--text-muted, #666);
}

/* Podium Table */
.podium-table th {
    background: rgba(255, 255, 255, 0.1);
    color: var(--text-primary, #e5e7eb);
}

.podium-table .total-row {
    background: rgba(255, 255, 255, 0.12);
}

/* Dark: Hero Stats Bar */
.hero-stat-card {
    background: rgba(26, 26, 37, 0.75);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.08);
}

.hero-stat-value {
    color: var(--accent-blue, #60a5fa);
}

.hero-stat-label {
    color: var(--text-muted, #888);
}

/* Dark: Medal Dashboard */
.medal-count.clickable {
    color: var(--accent-blue, #60a5fa);
}

.medal-count.clickable:hover {
    color: var(--accent-blue-hover, #93bbfd);
}

.medal-detail-panel {
    background: rgba(26, 26, 37, 0.9);
}

.medal-detail-list a {
    color: var(--text-primary, #e5e7eb);
}

.medal-detail-list a:hover {
    color: var(--accent-blue, #60a5fa);
}

.medal-rank-label {
    background: rgba(255, 255, 255, 0.1);
    color: var(--text-muted, #888);
}

/* Dark: Performance Bars */
.perf-bar-label {
    color: var(--text-primary, #e5e7eb);
}

.perf-bar-track {
    background: rgba(255, 255, 255, 0.08);
}

.perf-bar-stat {
    color: var(--text-primary, #e5e7eb);
}

.perf-bar-detail {
    color: var(--text-muted, #888);
}

/* Dark: Quick Insights */
.rival-name {
    color: var(--text-primary, #e5e7eb);
}

.rival-name:hover {
    color: var(--accent-blue, #60a5fa);
}

.rating-weapon-sm {
    color: var(--text-primary, #e5e7eb);
}

.rating-date-sm {
    color: var(--text-muted, #888);
}

/* History Section */
.history-section {
    background: rgba(26, 26, 37, 0.75);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: var(--fm-radius-md);
}

.history-filters select {
    background: rgba(26, 26, 37, 0.7);
    border: 1px solid rgba(255, 255, 255, 0.1);
    color: var(--text-primary, #e5e7eb);
}

.result-card {
    background: rgba(26, 26, 37, 0.7);
    border: 1px solid rgba(255, 255, 255, 0.06);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.result-card-header {
    background: rgba(255, 255, 255, 0.03);
}

.result-card-header:hover {
    background: rgba(255, 255, 255, 0.08);
}

.result-date {
    color: var(--text-muted, #666);
}

.result-tournament {
    color: var(--text-primary, #333);
}

.result-event {
    color: var(--accent-gold, #d4a574);
}

.result-place {
    background: rgba(255, 255, 255, 0.1);
}

.result-place.gold { color: var(--accent-gold, #FFD700); }
.result-place.silver { color: var(--accent-silver, #C0C0C0); }
.result-place.bronze { color: var(--accent-bronze, #CD7F32); }

.result-rating {
    color: var(--accent-primary, #c9302c);
}

.result-expand-icon {
    color: var(--text-muted, #666);
}

.result-card-detail {
    border-top-color: rgba(255, 255, 255, 0.1);
    background: rgba(26, 26, 37, 0.5);
}

/* Detail Sections */
.detail-section h5 {
    color: var(--accent-gold, #d4a574);
}

.pool-summary {
    background: rgba(255, 255, 255, 0.08);
}

.pool-summary-item strong {
    color: var(--accent-primary, #c9302c);
}

/* Pool Stats Grid (Dark Theme) */
.pool-stat-card {
    background: rgba(255, 255, 255, 0.08);
}

.pool-stat-value {
    color: var(--accent-primary, #c9302c);
}

.pool-stat-value .pool-stat-total {
    color: var(--text-muted, #666);
}

.pool-stat-label {
    color: var(--text-muted, #666);
}

.pool-touches-info {
    background: rgba(255, 255, 255, 0.05);
}

.touches-detail {
    color: var(--text-muted, #666);
}

.pool-bouts-accordion {
    border-color: rgba(255, 255, 255, 0.1);
}

.pool-bouts-header {
    background: rgba(255, 255, 255, 0.08);
    color: var(--text-primary, #e5e7eb);
}

.pool-bouts-header:hover {
    background: rgba(255, 255, 255, 0.12);
}

.pool-bouts-content {
    background: rgba(26, 26, 37, 0.5);
}

.bout-detail-item {
    background: rgba(255, 255, 255, 0.05);
}

.bout-opponent-name {
    color: var(--text-primary, #333);
}

.bout-opponent-team {
    color: var(--text-muted, #666);
}

/* Tournament Progress */
.tournament-progress {
    background: rgba(255, 255, 255, 0.08);
}

.progress-step {
    background: rgba(255, 255, 255, 0.15);
    color: var(--text-primary, #e5e7eb);
}

.progress-step.completed {
    background: var(--success-color, #10b981);
    color: #ffffff;
}

.progress-step.current {
    background: var(--accent-primary, #c9302c);
    color: #ffffff;
}

/* Strength Tab */
.strength-card {
    background: rgba(26, 26, 37, 0.75);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.08);
}

.strength-value {
    color: var(--accent-primary, #c9302c);
}

.strength-label {
    color: var(--text-muted, #666);
}

.opponent-table {
    background: rgba(26, 26, 37, 0.7);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border: 1px solid rgba(255, 255, 255, 0.06);
}

.opponent-table th {
    background: rgba(255, 255, 255, 0.1);
    color: var(--text-primary, #e5e7eb);
}

.opponent-row:hover {
    background: rgba(255, 255, 255, 0.03);
}

.opponent-detail {
    background: rgba(26, 26, 37, 0.6);
}

.opponent-match-item {
    background: rgba(255, 255, 255, 0.05);
}

/* Event Card */
.event-card .event-stats .stat-badge {
    background: var(--bg-tertiary, #f0f0f0);
    color: var(--text-muted, #666);
}

/* Disambiguation UI - Dark Theme */
.player-header .disambiguation-badge {
    background: rgba(245, 158, 11, 0.25);
}

.team-history-section {
    background: rgba(255, 255, 255, 0.1);
}

.team-history-item {
    background: rgba(255, 255, 255, 0.15);
}

.disambiguation-section {
    background: rgba(245, 158, 11, 0.15);
    border-left-color: var(--warning-color, #f59e0b);
}

.disambiguation-section.accordion .disambiguation-header:hover {
    background: rgba(255, 255, 255, 0.08);
}

.disambiguation-count {
    background: rgba(255, 255, 255, 0.15);
}

.disambiguation-toggle {
    color: rgba(255, 255, 255, 0.6);
}

.other-profile-link {
    background: rgba(255, 255, 255, 0.2);
}

.other-profile-link:hover {
    background: rgba(255, 255, 255, 0.35);
}

/* Name English Tag */
.name-en {
    background: var(--bg-tertiary, #f0f0f0);
    color: var(--text-muted, #666);
}

/* External Links */
.fie-link {
    background: rgba(30, 58, 138, 0.2);
    color: #60a5fa;
    border-color: rgba(30, 58, 138, 0.4);
}

.ft-link {
    background: rgba(234, 88, 12, 0.2);
    color: #fb923c;
    border-color: rgba(234, 88, 12, 0.4);
}

/* Analysis Tab */
.analysis-container {
    background: rgba(26, 26, 37, 0.75);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: var(--fm-radius-md);
    padding: 1.5rem;
}

.analysis-notice {
    background: rgba(26, 26, 37, 0.6);
    color: var(--text-muted, #666);
}

.analysis-notice.error {
    background: rgba(239, 68, 68, 0.1);
    border-color: rgba(239, 68, 68, 0.3);
    color: var(--danger-color, #ef4444);
}

/* Player name links in dark theme */
.player-name a:hover,
.player-col a:hover,
.name-cell a:hover,
.podium-name a:hover,
.de-player-name a:hover,
.de-winner-badge a:hover,
.de-tree-player .name a:hover,
.bout-player a:hover {
    color: var(--accent-gold, #d4a574);
}

/* ==================== Print Certificate Button ==================== */
.print-btn {
    background: var(--primary-color, #2d3748);
    color: white;
    border: none;
    padding: 8px 16px;
    border-radius: var(--fm-radius-sm);
    cursor: pointer;
    font-size: 0.875rem;
    font-weight: 500;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: all 0.2s;
    margin-left: auto;
}

.print-btn:hover {
    background: var(--primary-dark, #1a365d);
    transform: translateY(-1px);
}

.print-btn .print-icon {
    font-size: 1rem;
}

.btn-secondary {
    background: #718096;
}

.btn-secondary:hover {
    background: #4a5568;
}

/* History filters layout adjustment */
.history-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
    margin-bottom: 20px;
}

/* Print media query - hide non-essential elements */
@media print {
    .print-btn,
    .history-filters,
    .tabs,
    .breadcrumb,
    .player-header .rating-display,
    .international-links,
    nav,
    header,
    footer {
        display: none !important;
    }

    body {
        background: white;
        color: black;
    }

    .container {
        max-width: 100%;
        padding: 0;
    }
}

/* ==================== Language Switcher ==================== */
.lang-switcher {
    display: flex;
    gap: 4px;
    align-items: center;
    margin-left: 15px;
    padding-left: 15px;
    border-left: 1px solid rgba(255, 255, 255, 0.2);
}

.lang-btn {
    padding: 4px 10px;
    font-size: 0.8rem;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.7);
    text-decoration: none;
    border-radius: var(--fm-radius-sm);
    transition: all 0.2s ease;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.lang-btn:hover {
    color: white;
    background: rgba(255, 255, 255, 0.1);
}

.lang-btn.active {
    color: white;
    background: var(--primary-color, #2563eb);
}

/* Responsive language switcher */
@media (max-width: 768px) {
    .lang-switcher {
        margin-left: 10px;
        padding-left: 10px;
    }

    .lang-btn {
        padding: 3px 8px;
        font-size: 0.75rem;
    }
}

/* ==================== Player & Team Clickable Links ==================== */

/* Player links - for clickable player names */
.player-link {
    color: inherit;
    text-decoration: none;
    transition: color 0.2s ease, text-decoration 0.2s ease;
    cursor: pointer;
}

.player-link:hover {
    color: var(--primary-color, #2563eb);
    text-decoration: underline;
}

/* Team links - for clickable team names */
.team-link {
    color: inherit;
    text-decoration: none;
    transition: color 0.2s ease, text-decoration 0.2s ease;
    cursor: pointer;
    font-size: inherit;
}

.team-link:hover {
    color: var(--accent-primary, #c9302c);
    text-decoration: underline;
}

/* Team links in smaller text contexts (e.g., bout details) */
small .team-link,
.bout-opponent-team .team-link,
.player-team .team-link,
.seeding-team .team-link {
    color: var(--text-muted, #6b7280);
}

small .team-link:hover,
.bout-opponent-team .team-link:hover,
.player-team .team-link:hover,
.seeding-team .team-link:hover {
    color: var(--accent-primary, #c9302c);
}

/* Team link in tables */
td .team-link {
    color: inherit;
}

td .team-link:hover {
    color: var(--accent-primary, #c9302c);
}

/* Podium team links */
.podium-team .team-link {
    color: inherit;
    font-size: inherit;
}

.podium-team .team-link:hover {
    color: var(--primary-color, #2563eb);
}

/* Team history links */
.team-history-item .team-link {
    color: var(--text-primary, #1f2937);
    font-weight: 500;
}

.team-history-item .team-link:hover {
    color: var(--accent-primary, #c9302c);
}

/* Dark mode support for links */
@media (prefers-color-scheme: dark) {
    .player-link:hover {
        color: var(--accent-gold, #d4a574);
    }

    .team-link:hover {
        color: var(--accent-gold, #d4a574);
    }

    .team-history-item .team-link {
        color: var(--text-primary, #fff);
    }
}


/* ==================== Access Gate (Blur + CTA) ==================== */
.access-gate {
    position: relative;
    border-radius: var(--fm-radius-md);
    overflow: hidden;
    min-height: 120px;
}

.access-gate .blurred-content {
    filter: blur(4px);
    pointer-events: none;
    user-select: none;
    -webkit-user-select: none;
}

.gate-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, 0.55);
    border-radius: var(--fm-radius-md);
    z-index: 10;
    gap: 12px;
    padding: 1.5rem;
    text-align: center;
}

.gate-overlay p {
    color: #fff;
    font-size: 1rem;
    font-weight: 500;
    margin: 0;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
}

.gate-cta-btn {
    display: inline-block;
    padding: 12px 28px;
    border-radius: var(--fm-radius-sm);
    background: var(--primary-color, #3b82f6);
    color: #fff !important;
    text-decoration: none;
    font-weight: 600;
    font-size: 0.95rem;
    transition: background 0.2s, transform 0.15s;
    box-shadow: 0 2px 8px rgba(59, 130, 246, 0.35);
}

.gate-cta-btn:hover {
    background: var(--primary-hover, #2563eb);
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(59, 130, 246, 0.45);
}

.gate-cta-btn:active {
    transform: translateY(0);
}

/* 게스트 프리뷰: 실제 데이터 표시 영역 */
.guest-preview-section {
    margin-bottom: 1.5rem;
}
.guest-preview-section h4 {
    color: #b4b4c4;
    font-size: 0.9rem;
    margin-bottom: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* 기능 안내 리스트 */
.gate-feature-list {
    text-align: left;
    max-width: 320px;
    margin: 0 auto 1.5rem;
}
.gate-feature-list p {
    color: #e0e0e0;
    font-weight: 600;
    margin-bottom: 0.75rem;
}
.gate-feature-list ul {
    list-style: none;
    padding: 0;
    margin: 0;
}
.gate-feature-list ul li {
    color: #b4b4c4;
    padding: 0.4rem 0;
    padding-left: 1.5rem;
    position: relative;
}
.gate-feature-list ul li::before {
    content: "\2713";
    position: absolute;
    left: 0;
    color: #4CAF50;
}

/* 프리뷰 안내 텍스트 */
.gate-preview-text {
    color: #b4b4c4;
    font-size: 0.9rem;
    margin-bottom: 1rem;
}

/* Inline blurred text - 데이터가 있지만 읽을 수 없게 */
.blurred-text {
    filter: blur(3px);
    -webkit-filter: blur(3px);
    user-select: none;
    -webkit-user-select: none;
    pointer-events: none;
    color: var(--text-secondary, #6b7280);
    display: inline-block;
}

/* 검색 결과 하단 로그인 유도 배너 */
.search-login-gate {
    text-align: center;
    padding: 2rem 1.5rem;
    margin-top: 1rem;
    border-radius: var(--fm-radius-md);
    background: var(--bg-secondary, #f3f4f6);
    border: 1px dashed var(--border-color, #d1d5db);
}

.search-login-gate p {
    margin: 0 0 0.5rem;
    color: var(--text-secondary, #6b7280);
    font-size: 0.95rem;
}

.search-login-gate .gate-cta-btn {
    margin-top: 0.75rem;
}

/* Dark theme adjustments */
@media (prefers-color-scheme: dark) {
    .search-login-gate {
        background: var(--bg-secondary, #1f2937);
        border-color: var(--border-color, #374151);
    }
    .gate-overlay {
        background: rgba(0, 0, 0, 0.7);
    }
}

/* ============================================
   Selection Points (선발 포인트) Styles
   ============================================ */

.selection-page {
    max-width: 1000px;
    margin: 0 auto;
    padding: 2rem 1rem;
}

.selection-header {
    text-align: center;
    margin-bottom: 2rem;
}

.selection-header h1 {
    font-size: 1.8rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
}

.selection-desc {
    color: var(--text-secondary, #9ca3af);
    font-size: 0.95rem;
    margin-bottom: 1.25rem;
}

.selection-program-info {
    color: var(--text-secondary, #9ca3af);
    font-size: 0.85rem;
    font-style: italic;
    margin: 0.5rem 0 1rem;
    padding: 0.75rem 1rem;
    background: rgba(255, 255, 255, 0.05);
    border-radius: var(--fm-radius-md);
    line-height: 1.5;
}

/* Selection Nav Tabs (꿈나무 / 국가대표 전환) */
.selection-nav-tabs {
    display: flex;
    justify-content: center;
    gap: 0.5rem;
    margin-top: 1rem;
}

.sel-nav-tab {
    padding: 0.5rem 1.5rem;
    border-radius: var(--fm-radius-sm);
    font-size: 0.9rem;
    font-weight: 500;
    text-decoration: none;
    color: var(--text-secondary, #9ca3af);
    background: var(--bg-secondary, #1f2937);
    border: 1px solid var(--border-color, #374151);
    transition: all 0.2s;
}

.sel-nav-tab:hover {
    color: var(--text-primary, #f9fafb);
    border-color: var(--accent-color, #3b82f6);
}

.sel-nav-tab.active {
    color: #fff;
    background: var(--accent-color, #3b82f6);
    border-color: var(--accent-color, #3b82f6);
}

/* Selection Filters */
.selection-filters {
    display: flex;
    justify-content: center;
    gap: 1rem;
    margin-bottom: 1.5rem;
    flex-wrap: wrap;
}

.selection-filters .filter-group {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.selection-filters .filter-group label {
    font-size: 0.85rem;
    color: var(--text-secondary, #9ca3af);
    font-weight: 500;
}

.selection-filters .filter-group select {
    padding: 0.4rem 0.75rem;
    border-radius: var(--fm-radius-sm);
    border: 1px solid var(--border-color, #374151);
    background: var(--bg-secondary, #1f2937);
    color: var(--text-primary, #f9fafb);
    font-size: 0.9rem;
    cursor: pointer;
}

/* Competition Info Chips */
.selection-comp-info {
    margin-bottom: 1.5rem;
    text-align: center;
}

.selection-comp-info h4 {
    font-size: 0.9rem;
    color: var(--text-secondary, #9ca3af);
    margin-bottom: 0.75rem;
    font-weight: 500;
}

.comp-chips {
    display: flex;
    justify-content: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.comp-chip {
    display: inline-flex;
    padding: var(--fm-badge-pad-lg);
    border-radius: var(--fm-radius-pill);
    font-size: var(--fm-badge-fs-md);
    background: rgba(59, 130, 246, 0.15);
    color: #60a5fa;
    border: 1px solid rgba(59, 130, 246, 0.3);
    align-items: center;
    justify-content: center;
    line-height: 1;
    white-space: nowrap;
    box-sizing: border-box;
    height: var(--fm-chip-height);
}

.comp-chip.fie-chip {
    background: rgba(234, 179, 8, 0.15);
    color: #fbbf24;
    border-color: rgba(234, 179, 8, 0.3);
}

.comp-chip.upcoming {
    opacity: 0.5;
}

.comp-chip .comp-date {
    font-size: 0.85em;
    opacity: 0.8;
}

/* Selection Table */
.selection-table-wrapper {
    overflow-x: auto;
    margin-bottom: 1.5rem;
    border-radius: var(--fm-radius-md);
    border: 1px solid var(--border-color, #374151);
}

.selection-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

.selection-table thead {
    background: var(--bg-secondary, #1f2937);
}

.selection-table th {
    padding: 0.75rem 0.5rem;
    text-align: center;
    font-weight: 600;
    font-size: 0.8rem;
    color: var(--text-secondary, #9ca3af);
    border-bottom: 2px solid var(--border-color, #374151);
    white-space: nowrap;
}

.selection-table td {
    padding: 0.6rem 0.5rem;
    text-align: center;
    border-bottom: 1px solid var(--border-color, rgba(55, 65, 81, 0.5));
}

.selection-table .rank-col { width: 50px; }
.selection-table .name-col { text-align: left; min-width: 80px; }
.selection-table .team-col { text-align: left; min-width: 80px; font-size: 0.8rem; color: var(--text-secondary, #9ca3af); }
.selection-table .pts-col { min-width: 50px; }
.selection-table .pts-col.upcoming { opacity: 0.5; }
.selection-table th.pts-col .comp-date { font-size: 0.7em; color: #888; font-weight: normal; }
.selection-table .total-col { min-width: 60px; }
.selection-table .grade-col { width: 60px; }

.selection-table .name-col .player-link {
    color: var(--text-primary, #f9fafb);
    text-decoration: none;
    font-weight: 500;
}

.selection-table .name-col .player-link:hover {
    color: var(--accent-color, #3b82f6);
    text-decoration: underline;
}

/* Rank Badge */
.rank-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    font-size: 0.8rem;
    font-weight: 600;
    background: var(--bg-secondary, #1f2937);
    color: var(--text-secondary, #9ca3af);
}

.rank-badge.selected {
    background: var(--accent-color, #3b82f6);
    color: #fff;
}

/* Best Rank Badge - 동점자 최고 순위 표시 */
.best-rank-badge {
    font-size: 0.7rem;
    color: var(--text-tertiary, #6b7280);
    margin-left: 4px;
}

/* In-progress result place badge */
.result-place.in-progress {
    background: var(--warning-bg, #fef3cd);
    color: var(--warning-text, #856404);
    font-size: 0.75rem;
    font-weight: 600;
}

/* Pool eliminated badge - 본선 미진출 */
.result-place.pool-eliminated {
    background: var(--surface-secondary, rgba(148, 163, 184, 0.15));
    color: var(--text-secondary, #94a3b8);
    font-size: 0.75rem;
    font-weight: 500;
}

/* Info notice banner */
.info-notice {
    background: var(--info-bg, rgba(59, 130, 246, 0.1));
    color: var(--info-text, #93c5fd);
    padding: 8px 12px;
    border-radius: var(--fm-radius-md);
    font-size: 0.85rem;
    margin-bottom: 12px;
}

/* Selection Line Highlight (선발 라인) */
.selection-table tr.selection-line {
    background: rgba(30, 58, 138, 0.14);
}

.selection-table tr.selection-line:hover {
    background: rgba(30, 58, 138, 0.22);
}

/* 선발 라인 마지막 행 아래에 구분선 */
.selection-table tr.selection-line:last-of-type,
.selection-table tr.selection-cutoff-border {
    border-bottom: 2px solid var(--fm-accent-secondary, #1e3a8a);
}

/* Points Value */
.pts-value {
    font-weight: 600;
    color: var(--text-primary, #f9fafb);
    cursor: help;
}

.pts-empty {
    color: var(--text-secondary, rgba(156, 163, 175, 0.5));
}

/* Grade Badge */
.grade-badge {
    display: inline-flex;
    padding: var(--fm-badge-pad-sm);
    border-radius: var(--fm-radius-sm);
    font-size: var(--fm-badge-fs-sm);
    font-weight: 500;
    align-items: center;
    justify-content: center;
    line-height: 1;
    white-space: nowrap;
    box-sizing: border-box;
}

.grade-badge.confirmed {
    background: rgba(34, 197, 94, 0.15);
    color: #4ade80;
}

.grade-badge.estimated {
    background: rgba(234, 179, 8, 0.15);
    color: #fbbf24;
}

.grade-badge.unknown {
    background: rgba(156, 163, 175, 0.15);
    color: #9ca3af;
}

/* Unofficial Notice Banner */
.selection-unofficial-notice {
    background: rgba(245, 158, 11, 0.12);
    border: 1px solid rgba(245, 158, 11, 0.3);
    border-radius: var(--fm-radius-md);
    padding: 0.75rem 1rem;
    font-size: 0.85rem;
    color: #f59e0b;
    text-align: center;
    margin-bottom: 1rem;
    line-height: 1.5;
}

/* Footer Disclaimer */
.footer-disclaimer {
    font-size: 0.75rem;
    color: rgba(255, 255, 255, 0.45);
    margin-top: 0.5rem;
    line-height: 1.5;
}

/* Selection Cutoff / Tiebreak / Point Table Notes */
.selection-cutoff-note {
    text-align: center;
    font-size: 0.85rem;
    color: var(--accent-color, #3b82f6);
    padding: 0.75rem;
    background: rgba(59, 130, 246, 0.08);
    border-radius: var(--fm-radius-md);
    margin-bottom: 1.5rem;
}

.selection-tiebreak-note {
    margin-bottom: 1.5rem;
    padding: 1rem;
    background: var(--bg-secondary, #1f2937);
    border-radius: var(--fm-radius-md);
    border: 1px solid var(--border-color, #374151);
}

.selection-tiebreak-note h4 {
    font-size: 0.85rem;
    margin-bottom: 0.5rem;
    color: var(--text-secondary, #9ca3af);
}

.selection-tiebreak-note p {
    font-size: 0.9rem;
    color: var(--text-primary, #f9fafb);
    margin: 0;
}

/* ===== Selection Summary Page (연도별 요약) ===== */

.year-tab-bar {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
    margin-bottom: 1.5rem;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.year-tab {
    padding: var(--fm-badge-pad-lg);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: var(--fm-radius-pill);
    background: transparent;
    color: var(--text-secondary, #9ca3af);
    cursor: pointer;
    font-size: var(--fm-badge-fs-md);
    transition: all 0.2s;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    white-space: nowrap;
    box-sizing: border-box;
    height: var(--fm-chip-height);
}

.year-tab:hover {
    border-color: var(--accent-color, #3b82f6);
    color: var(--text-primary, #f9fafb);
}

.year-tab.active {
    background: var(--accent-color, #3b82f6);
    border-color: var(--accent-color, #3b82f6);
    color: #fff;
    font-weight: 600;
}

.year-content {
    display: none;
}

.year-content.active {
    display: block;
}

.year-title {
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--text-primary, #f9fafb);
    margin-bottom: 1rem;
}

.selection-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.selection-card {
    background: var(--bg-secondary, #1f2937);
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: var(--fm-radius-md);
    overflow: hidden;
}

.card-header {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.6rem 0.8rem;
    background: rgba(255, 255, 255, 0.03);
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.card-weapon {
    font-weight: 700;
    font-size: 0.9rem;
    color: var(--text-primary, #f9fafb);
}

.card-gender {
    font-size: var(--fm-badge-fs-sm);
    padding: var(--fm-badge-pad-sm);
    border-radius: var(--fm-radius-sm);
    font-weight: 500;
    background: rgba(59, 130, 246, 0.15);
    color: #60a5fa;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    white-space: nowrap;
    box-sizing: border-box;
}

.card-count {
    margin-left: auto;
    font-size: 0.75rem;
    color: var(--text-secondary, #9ca3af);
}

.card-table {
    width: 100%;
    border-collapse: collapse;
}

.card-table tr {
    border-bottom: 1px solid rgba(255, 255, 255, 0.04);
}

.card-table tr:last-child {
    border-bottom: none;
}

.ct-rank {
    width: 32px;
    text-align: center;
    padding: 0.35rem 0.4rem;
}

.ct-rank-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    font-size: 0.7rem;
    font-weight: 600;
    background: var(--accent-color, #3b82f6);
    color: #fff;
}

.ct-name {
    padding: 0.35rem 0.3rem;
    font-size: 0.85rem;
    font-weight: 500;
}

.ct-player-link {
    color: var(--text-primary, #f9fafb);
    text-decoration: none;
}

.ct-player-link:hover {
    color: var(--accent-color, #3b82f6);
}

.ct-team {
    padding: 0.35rem 0.3rem;
    font-size: 0.75rem;
    color: var(--text-secondary, #9ca3af);
    max-width: 100px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ct-pts {
    padding: 0.35rem 0.5rem;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--accent-color, #3b82f6);
    text-align: right;
}

.card-no-data {
    padding: 1.5rem;
    text-align: center;
    color: var(--text-secondary, #9ca3af);
    font-size: 0.85rem;
}

.card-footer {
    padding: 0.5rem 0.8rem;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
    text-align: right;
}

.card-detail-link {
    font-size: 0.75rem;
    color: var(--accent-color, #3b82f6);
    text-decoration: none;
}

.card-detail-link:hover {
    text-decoration: underline;
}

/* 요약 페이지 모바일 */
@media (max-width: 768px) {
    .selection-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 0.75rem;
    }

    .year-tab-bar {
        flex-wrap: nowrap;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        gap: 0.35rem;
        padding-bottom: 0.5rem;
        scrollbar-width: none;
    }

    .year-tab-bar::-webkit-scrollbar {
        display: none;
    }

    .year-tab {
        padding: var(--fm-badge-pad-md);
        font-size: var(--fm-badge-fs-md);
        flex-shrink: 0;
        min-height: 36px;
        height: var(--fm-badge-height);
    }

    .ct-team {
        display: none;
    }

    .card-detail-link {
        font-size: 0.8rem;
        padding: 0.4rem 0;
        display: inline-block;
    }

    .comp-chip {
        font-size: var(--fm-badge-fs-sm);
        padding: var(--fm-badge-pad-sm);
        height: auto;
    }
}

@media (max-width: 480px) {
    .selection-grid {
        grid-template-columns: 1fr;
    }
}

/* Point Table Grid */
.selection-point-table-info {
    margin-bottom: 1.5rem;
    padding: 1rem;
    background: var(--bg-secondary, #1f2937);
    border-radius: var(--fm-radius-md);
    border: 1px solid var(--border-color, #374151);
}

.selection-point-table-info h4 {
    font-size: 0.85rem;
    margin-bottom: 0.75rem;
    color: var(--text-secondary, #9ca3af);
}

.point-table-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
    gap: 0.5rem;
}

.pt-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.35rem 0.6rem;
    background: rgba(255, 255, 255, 0.03);
    border-radius: var(--fm-radius-sm);
    border: 1px solid var(--border-color, rgba(55, 65, 81, 0.5));
}

.pt-rank {
    font-size: 0.8rem;
    color: var(--text-secondary, #9ca3af);
}

.pt-pts {
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--text-primary, #f9fafb);
}

/* Auth-protected content (선발포인트 이름/소속 로그인 필요) */
.auth-protected {
    filter: blur(6px);
    -webkit-filter: blur(6px);
    user-select: none;
    -webkit-user-select: none;
    pointer-events: none;
    transition: filter 0.3s ease;
}

.auth-protected a {
    pointer-events: none;
}

body.authenticated .auth-protected {
    filter: none;
    -webkit-filter: none;
    user-select: auto;
    -webkit-user-select: auto;
    pointer-events: auto;
}

body.authenticated .auth-protected a {
    pointer-events: auto;
}

body.authenticated .auth-login-prompt {
    display: none;
}

.auth-login-prompt {
    text-align: center;
    padding: 0.75rem 1rem;
    margin-bottom: 1rem;
    background: rgba(59, 130, 246, 0.1);
    border: 1px solid rgba(59, 130, 246, 0.3);
    border-radius: var(--fm-radius-md);
    font-size: 0.85rem;
    color: var(--text-secondary, #9ca3af);
}

.auth-login-prompt a {
    color: var(--accent-color, #3b82f6);
    text-decoration: none;
    font-weight: 500;
}

.auth-login-prompt a:hover {
    text-decoration: underline;
}

/* No Data Box */
.no-data-box {
    text-align: center;
    padding: 3rem 1.5rem;
    background: var(--bg-secondary, #1f2937);
    border-radius: var(--fm-radius-md);
    border: 1px dashed var(--border-color, #374151);
    margin-bottom: 1.5rem;
}

.no-data-box p {
    margin: 0 0 0.5rem;
    color: var(--text-secondary, #9ca3af);
}

.no-data-box .sub-note {
    font-size: 0.8rem;
    color: var(--text-secondary, rgba(156, 163, 175, 0.7));
}

/* ============================================
   Selection Points Card (선수 프로필 내)
   ============================================ */

.sel-card {
    background: var(--bg-secondary, #1f2937);
    border-radius: var(--fm-radius-md);
    border: 1px solid var(--border-color, #374151);
    padding: 1.25rem;
    margin-bottom: 1.5rem;
}

.sel-card-title {
    font-size: 1rem;
    font-weight: 600;
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.sel-card-section {
    margin-bottom: 1rem;
    padding: 0.75rem;
    background: rgba(255, 255, 255, 0.02);
    border-radius: var(--fm-radius-sm);
    border: 1px solid var(--border-color, rgba(55, 65, 81, 0.5));
}

.sel-card-section:last-child {
    margin-bottom: 0;
}

.sel-card-section-title {
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--text-secondary, #9ca3af);
    margin-bottom: 0.5rem;
}

.sel-card-summary {
    display: flex;
    gap: 1rem;
    margin-bottom: 0.5rem;
    flex-wrap: wrap;
}

.sel-card-stat {
    font-size: 0.9rem;
}

.sel-card-stat strong {
    color: var(--accent-color, #3b82f6);
}

.sel-card-breakdown {
    list-style: none;
    padding: 0;
    margin: 0.5rem 0 0;
}

.sel-card-breakdown li {
    display: flex;
    justify-content: space-between;
    padding: 0.25rem 0;
    font-size: 0.85rem;
    color: var(--text-secondary, #9ca3af);
    border-bottom: 1px solid var(--border-color, rgba(55, 65, 81, 0.3));
}

.sel-card-breakdown li:last-child {
    border-bottom: none;
}

.sel-card-breakdown .sel-comp-name {
    flex: 1;
}

.sel-card-breakdown .sel-comp-pts {
    font-weight: 600;
    color: var(--text-primary, #f9fafb);
    min-width: 40px;
    text-align: right;
}

.sel-card-link {
    display: inline-block;
    margin-top: 0.5rem;
    font-size: 0.8rem;
    color: var(--accent-color, #3b82f6);
    text-decoration: none;
}

.sel-card-link:hover {
    text-decoration: underline;
}

/* Selection Points - Rank Badge */
.sel-card-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.5rem;
}

.sel-card-rank-badge {
    background: var(--accent-primary, #c9302c);
    color: #fff;
    padding: var(--fm-badge-pad-md);
    border-radius: var(--fm-radius-pill);
    font-weight: 700;
    font-size: var(--fm-badge-fs-md);
    white-space: nowrap;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    box-sizing: border-box;
    height: var(--fm-badge-height);
}

.sel-card-rank-badge small {
    font-weight: 400;
    font-size: 0.75rem;
    opacity: 0.8;
}

/* Selection Points - Breakdown Table */
.sel-breakdown-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.85rem;
    margin-top: 0.5rem;
}

.sel-breakdown-table th {
    text-align: left;
    padding: 0.4rem 0.5rem;
    color: var(--text-secondary, #9ca3af);
    font-weight: 500;
    border-bottom: 1px solid var(--border-color, #374151);
    font-size: 0.75rem;
}

.sel-breakdown-table td {
    padding: 0.4rem 0.5rem;
    border-bottom: 1px solid rgba(55, 65, 81, 0.3);
}

.sel-pts-col {
    text-align: right;
    min-width: 60px;
}

.sel-total-row {
    border-top: 2px solid var(--border-color, #374151);
    font-weight: 600;
}

.sel-total-row td {
    padding-top: 0.5rem;
}

/* Rankings - Blurred Section */
.ranking-blurred-section {
    margin-bottom: 0;
    border-radius: var(--fm-radius-md) var(--fm-radius-md) 0 0;
}

.ranking-blurred-section + .ranking-table-container {
    border-radius: 0 0 var(--fm-radius-md) var(--fm-radius-md);
}

.ranking-blurred-section .blurred-content .ranking-table {
    margin-bottom: 0;
}

/* Mobile Responsive */
@media (max-width: 640px) {
    .selection-page {
        padding: 0.75rem 0.25rem;
    }

    .selection-header h1 {
        font-size: 1.3rem;
        margin-bottom: 0.3rem;
    }

    .selection-desc {
        font-size: 0.75rem;
        margin-bottom: 0.5rem;
    }

    .selection-filters {
        flex-direction: row;
        gap: 0.4rem;
        margin-bottom: 1rem;
    }

    .selection-filters .filter-group {
        flex: 1;
        gap: 0;
        flex-direction: column;
        align-items: stretch;
    }

    .selection-filters .filter-group label {
        font-size: 0.7rem;
        margin-bottom: 0.15rem;
    }

    .selection-filters .filter-group select {
        font-size: 0.85rem;
        padding: 0.45rem 0.4rem;
        width: 100%;
        min-height: 36px;
    }

    .selection-comp-info {
        margin-bottom: 0.75rem;
    }

    .selection-comp-info h4 {
        font-size: 0.8rem;
    }

    /* 모바일: 대회별 포인트 컬럼 숨김 */
    .selection-table .pts-col {
        display: none;
    }

    .selection-table {
        font-size: 0.85rem;
    }

    .selection-table th,
    .selection-table td {
        padding: 0.5rem 0.4rem;
    }

    .selection-table .name-col {
        min-width: 60px;
    }

    .selection-table .team-col {
        min-width: 50px;
        font-size: 0.75rem;
    }

    .selection-table .rank-col {
        width: 40px;
    }

    .selection-table .total-col {
        min-width: 45px;
    }

    .selection-table .grade-col {
        width: 45px;
    }

    .rank-badge {
        width: 26px;
        height: 26px;
        font-size: 0.75rem;
    }

    .grade-badge {
        font-size: var(--fm-badge-fs-sm);
        padding: var(--fm-badge-pad-sm);
    }

    .point-table-grid {
        grid-template-columns: repeat(3, 1fr);
    }

    .comp-chips {
        gap: 0.3rem;
    }

    .comp-chip {
        font-size: var(--fm-badge-fs-sm);
        padding: var(--fm-badge-pad-sm);
        height: auto;
    }

    .selection-cutoff-note,
    .selection-tiebreak-note {
        font-size: 0.75rem;
        padding: 0.5rem;
    }

    .selection-point-table-info {
        padding: 0.75rem;
    }

    .selection-point-table-info h4 {
        font-size: 0.85rem;
    }

    .sel-nav-tab {
        font-size: 0.85rem;
        padding: 0.4rem 1rem;
    }
}

/* ==================== LIGHT THEME COMPONENT OVERRIDES (Toss-style) ==================== */

/* --- Player Header --- */
[data-theme="light"] .player-header {
    background: #ffffff !important;
    backdrop-filter: none !important;
    border: 1px solid #e5e8eb !important;
    box-shadow: 0 2px 12px rgba(0,0,0,0.06) !important;
    color: #191f28 !important;
}

[data-theme="light"] .player-name {
    color: #191f28 !important;
}

[data-theme="light"] .name-en {
    color: #8b95a1 !important;
}

[data-theme="light"] .player-team {
    color: #4e5968 !important;
    opacity: 1 !important;
}

[data-theme="light"] .team-link {
    color: #1e3a8a !important;
}

[data-theme="light"] .team-link:hover {
    color: #c9302c !important;
}

/* Rating badges */
[data-theme="light"] .rating-badge {
    background: #f5f5f7 !important;
    border: 1px solid #e5e8eb;
}

[data-theme="light"] .rating-badge.active {
    background: #c9302c !important;
    border-color: #c9302c !important;
    color: #ffffff !important;
}

[data-theme="light"] .rating-badge.active .rating-value,
[data-theme="light"] .rating-badge.active .rating-weapon {
    color: #ffffff !important;
}

[data-theme="light"] .rating-value {
    color: #191f28;
}

[data-theme="light"] .rating-weapon {
    color: #4e5968;
}

[data-theme="light"] .rating-date {
    color: #8b95a1 !important;
}

/* Team History */
[data-theme="light"] .team-history-section {
    border-color: rgba(0,0,0,0.08) !important;
}

[data-theme="light"] .team-history-title {
    color: #8b95a1 !important;
}

[data-theme="light"] .team-history-item .dates {
    color: #8b95a1 !important;
}

/* Disambiguation */
[data-theme="light"] .disambiguation-section {
    background: #f5f5f7 !important;
    border-color: #e5e8eb !important;
}

[data-theme="light"] .disambiguation-header {
    color: #191f28 !important;
}

[data-theme="light"] .other-profile-link {
    color: #1e3a8a !important;
    border-color: #e5e8eb !important;
}

[data-theme="light"] .other-profile-link:hover {
    background: #f5f5f7 !important;
}

[data-theme="light"] .disambiguation-badge {
    background: rgba(245, 158, 11, 0.1) !important;
    color: #d97706 !important;
}

/* --- Tabs --- */
[data-theme="light"] .tabs {
    background: #ffffff !important;
    border: 1px solid #e5e8eb !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.06) !important;
}

[data-theme="light"] .tab-btn {
    color: #4e5968 !important;
}

[data-theme="light"] .tab-btn:hover {
    background: #f5f5f7 !important;
    color: #c9302c !important;
}

[data-theme="light"] .tab-btn.active {
    background: #c9302c !important;
    color: #ffffff !important;
}

/* --- Result Cards --- */
[data-theme="light"] .result-card {
    border-color: #e5e8eb !important;
    background: #ffffff !important;
}

[data-theme="light"] .result-card-header:hover {
    background: #f5f5f7 !important;
}

[data-theme="light"] .result-info .result-date {
    color: #8b95a1 !important;
}

[data-theme="light"] .result-info .result-tournament {
    color: #191f28 !important;
}

[data-theme="light"] .result-info .result-event {
    color: #4e5968 !important;
}

/* --- Access gate --- */
[data-theme="light"] .access-gate .gate-overlay {
    background: linear-gradient(to bottom, rgba(255,255,255,0) 0%, rgba(255,255,255,0.98) 70%) !important;
}

[data-theme="light"] .gate-overlay p,
[data-theme="light"] .gate-preview-text {
    color: #191f28 !important;
    text-shadow: none !important;
}

[data-theme="light"] .gate-cta-btn {
    background: #c9302c !important;
    color: #ffffff !important;
    box-shadow: 0 2px 12px rgba(201, 48, 44, 0.2) !important;
}

[data-theme="light"] .gate-cta-btn:hover {
    background: #a82824 !important;
    box-shadow: 0 4px 16px rgba(201, 48, 44, 0.3) !important;
}

/* Blurred content in light theme */
[data-theme="light"] .blurred-content {
    filter: blur(8px) !important;
}

/* --- Guest preview --- */
[data-theme="light"] .guest-preview-section h4 {
    color: #8b95a1;
}

[data-theme="light"] .info-notice {
    background: rgba(59, 130, 246, 0.06) !important;
    color: #1e3a8a !important;
    border-color: rgba(59, 130, 246, 0.15) !important;
}

/* --- Hero Stats Bar --- */
[data-theme="light"] .hero-stats-bar {
    background: #f5f5f7 !important;
}

[data-theme="light"] .hero-stat-card {
    background: #ffffff !important;
    border-color: #e5e8eb !important;
}

[data-theme="light"] .hero-stat-value {
    color: #191f28 !important;
}

[data-theme="light"] .hero-stat-label {
    color: #8b95a1 !important;
}

/* --- International Links --- */
[data-theme="light"] .external-link {
    background: #f5f5f7 !important;
    color: #1e3a8a !important;
    border-color: #e5e8eb !important;
}

[data-theme="light"] .external-link:hover {
    background: #eef0f4 !important;
}

/* --- Follow Button --- */
[data-theme="light"] .follow-btn svg {
    stroke: #8b95a1;
}

/* --- Selection nav tabs --- */
[data-theme="light"] .sel-nav-tab {
    color: #4e5968;
}

[data-theme="light"] .sel-nav-tab.active {
    color: #ffffff;
    background: #c9302c;
    border-color: #c9302c;
}

/* --- Selection Summary Cards --- */
[data-theme="light"] .sel-card {
    background: #ffffff !important;
    border-color: #e5e8eb !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.06) !important;
}

[data-theme="light"] .sel-card-title {
    color: #191f28 !important;
}

/* --- Onboarding --- */
[data-theme="light"] .onboarding-card {
    background: #ffffff !important;
    color: #191f28 !important;
    box-shadow: 0 8px 40px rgba(0,0,0,0.12) !important;
}

[data-theme="light"] .weapon-gender-card {
    background: #f5f5f7 !important;
    color: #191f28 !important;
    border-color: #e5e8eb !important;
}

[data-theme="light"] .weapon-gender-card:hover,
[data-theme="light"] .weapon-gender-card.selected {
    border-color: #c9302c !important;
    background: rgba(201,48,44,0.04) !important;
}

[data-theme="light"] .age-group-choice {
    background: #f5f5f7 !important;
    color: #191f28 !important;
    border-color: #e5e8eb !important;
}

[data-theme="light"] .age-group-choice:hover,
[data-theme="light"] .age-group-choice.selected {
    border-color: #c9302c !important;
}

/* --- Player Profile: Stat Values (dark text, not red accent) --- */
[data-theme="light"] .strength-value {
    color: #191f28;
}

[data-theme="light"] .pool-stat-value {
    color: #191f28;
}

[data-theme="light"] .result-rating {
    color: #c9302c;
}

/* --- Strength Tab --- */
[data-theme="light"] .strength-card {
    background: #ffffff !important;
    border: 1px solid #e5e8eb !important;
    backdrop-filter: none !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.06);
}

[data-theme="light"] .detail-section h5 {
    color: #4e5968;
}

/* --- Opponent Table --- */
[data-theme="light"] .opponent-table {
    background: #ffffff !important;
    border: 1px solid #e5e8eb !important;
    backdrop-filter: none !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.06);
}

[data-theme="light"] .opponent-table th {
    background: #f5f5f7 !important;
    color: #4e5968;
}

[data-theme="light"] .opponent-detail {
    background: #f5f5f7 !important;
}

[data-theme="light"] .opponent-match-item {
    background: #ffffff !important;
    border: 1px solid #f0f0f5;
}

/* --- History Section & Cards --- */
[data-theme="light"] .history-section {
    background: #ffffff !important;
    border: 1px solid #e5e8eb !important;
    backdrop-filter: none !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.06);
}

/* --- History Filters --- */
[data-theme="light"] .history-filters select {
    background: #f5f5f7 !important;
    color: #191f28 !important;
    border-color: #e5e8eb !important;
}

[data-theme="light"] .result-card-detail {
    background: #f5f5f7 !important;
    border-top-color: #e5e8eb !important;
}

/* --- Stat Cards & Hero Stats (player profile) --- */
[data-theme="light"] .stat-card-large {
    background: #ffffff !important;
    border: 1px solid #e5e8eb !important;
    backdrop-filter: none !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.06);
}

[data-theme="light"] .stat-card-large h4 {
    color: #8b95a1 !important;
}

/* --- Medal Panel --- */
[data-theme="light"] .medal-detail-panel {
    background: #ffffff !important;
    border: 1px solid #e5e8eb;
    box-shadow: 0 4px 16px rgba(0,0,0,0.1);
}

[data-theme="light"] .medal-rank-label {
    background: #f5f5f7 !important;
    color: #8b95a1 !important;
}

[data-theme="light"] .medal-detail-list a {
    color: #191f28 !important;
}

[data-theme="light"] .medal-detail-list a:hover {
    color: #c9302c !important;
}

/* --- Pool Bouts --- */
[data-theme="light"] .pool-bouts-content {
    background: #f5f5f7 !important;
}

[data-theme="light"] .pool-bouts-header {
    background: #f0f0f5 !important;
    color: #191f28 !important;
}

[data-theme="light"] .pool-bouts-header:hover {
    background: #e5e8eb !important;
}

[data-theme="light"] .bout-detail-item {
    background: #ffffff !important;
    border: 1px solid #f0f0f5;
}

[data-theme="light"] .pool-summary {
    background: #f0f0f5 !important;
}

[data-theme="light"] .pool-stat-card {
    background: #f5f5f7 !important;
}

[data-theme="light"] .pool-touches-info {
    background: #f0f0f5 !important;
}

/* --- Analysis Tab --- */
[data-theme="light"] .analysis-container {
    background: #ffffff !important;
    border: 1px solid #e5e8eb !important;
    backdrop-filter: none !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.06);
}

[data-theme="light"] .analysis-notice {
    background: #f5f5f7 !important;
    color: #4e5968 !important;
}

/* --- Performance Bars --- */
[data-theme="light"] .perf-bar-label {
    color: #191f28 !important;
}

[data-theme="light"] .perf-bar-track {
    background: #f0f0f5 !important;
}

[data-theme="light"] .perf-bar-stat {
    color: #191f28 !important;
}

[data-theme="light"] .perf-bar-detail {
    color: #8b95a1 !important;
}

/* --- Tournament Progress --- */
[data-theme="light"] .tournament-progress {
    background: #f0f0f5 !important;
}

[data-theme="light"] .progress-step {
    background: #e5e8eb !important;
    color: #191f28 !important;
}

[data-theme="light"] .progress-step.current {
    background: #c9302c !important;
    color: #ffffff !important;
}

[data-theme="light"] .progress-step.completed {
    background: #10b981 !important;
    color: #ffffff !important;
}

/* --- Result Place badges --- */
[data-theme="light"] .result-place {
    background: #f0f0f5 !important;
}

/* --- Quick Insights --- */
[data-theme="light"] .rival-name {
    color: #191f28 !important;
}

[data-theme="light"] .rival-name:hover {
    color: #c9302c !important;
}

[data-theme="light"] .rating-weapon-sm {
    color: #191f28 !important;
}

[data-theme="light"] .rating-date-sm {
    color: #8b95a1 !important;
}

/* --- Year Pills (Strength tab) --- */
[data-theme="light"] .year-pill {
    background: #ffffff;
    border-color: #e5e8eb;
    color: #4e5968;
}

[data-theme="light"] .year-pill:hover {
    border-color: #c9302c;
    color: #c9302c;
}

[data-theme="light"] .year-pill.active {
    background: #c9302c;
    color: #ffffff;
    border-color: #c9302c;
}

/* --- H2H Link Badge --- */
[data-theme="light"] .h2h-link {
    background: #c9302c;
}

/* --- Date Range Filter --- */
[data-theme="light"] .date-range-filter {
    background: #f5f5f7;
}

[data-theme="light"] .date-range-filter .filter-btn {
    background: #c9302c;
}

[data-theme="light"] .date-range-filter .filter-btn:hover {
    background: #a82824;
}

/* --- Gate Feature List (guest view) --- */
[data-theme="light"] .gate-feature-list p {
    color: #191f28;
}

[data-theme="light"] .gate-feature-list ul li {
    color: #4e5968;
}

[data-theme="light"] .gate-preview-text {
    color: #4e5968;
}

/* ==================== Ranking Preview (Homepage) ==================== */
.ranking-preview-section {
    margin: 0.5rem 0 1rem;
    padding: 0 0;
}

.ranking-preview-card {
    background: rgba(18, 18, 26, 0.9);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border-radius: var(--fm-radius-md);
    border: 1px solid rgba(255, 255, 255, 0.1);
    overflow: hidden;
}

.ranking-preview-header {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 1.2rem 1.5rem 0.8rem;
}

.ranking-preview-trophy {
    font-size: 1.4rem;
}

.ranking-preview-title {
    font-size: 1.1rem;
    font-weight: 700;
    color: #f0c040;
    letter-spacing: 0.3px;
}

.ranking-preview-body {
    padding: 0 1.5rem;
}

.ranking-preview-loading {
    text-align: center;
    padding: 1.5rem 0;
    color: rgba(255, 255, 255, 0.5);
    font-size: 0.9rem;
}

.ranking-preview-empty {
    text-align: center;
    padding: 1.5rem 0;
    color: rgba(255, 255, 255, 0.4);
    font-size: 0.9rem;
}

.ranking-preview-row {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.7rem 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.ranking-preview-row:last-child {
    border-bottom: none;
}

.ranking-preview-medal {
    font-size: 1.3rem;
    min-width: 2rem;
    text-align: center;
    flex-shrink: 0;
    align-self: center;
    line-height: 1;
}

.ranking-preview-name {
    font-weight: 600;
    color: #ffffff;
    font-size: 0.95rem;
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    text-decoration: none;
    align-self: center;
    line-height: 1;
}

a.ranking-preview-name:hover {
    color: #f0c040;
    text-decoration: underline;
}

.ranking-preview-team {
    color: rgba(255, 255, 255, 0.5);
    font-size: 0.85rem;
    flex: 1;
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ranking-preview-points {
    font-weight: 700;
    color: #f0c040;
    font-size: 0.9rem;
    white-space: nowrap;
    margin-left: auto;
    flex-shrink: 0;
    align-self: center;
    line-height: 1;
}

.ranking-preview-footer {
    padding: 0.8rem 1.5rem;
    text-align: center;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
}

.ranking-preview-view-all {
    color: rgba(255, 255, 255, 0.7);
    text-decoration: none;
    font-size: 0.9rem;
    font-weight: 500;
    transition: color 0.2s;
}

.ranking-preview-view-all:hover {
    color: #f0c040;
}

.ranking-preview-login-hint {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.8rem 1.5rem;
    background: rgba(240, 192, 64, 0.08);
    border-top: 1px solid rgba(240, 192, 64, 0.15);
    flex-wrap: wrap;
}

.ranking-preview-hint-icon {
    font-size: 1rem;
    flex-shrink: 0;
}

.ranking-preview-hint-text {
    color: rgba(255, 255, 255, 0.6);
    font-size: 0.85rem;
    flex: 1;
    min-width: 0;
}

.ranking-preview-login-btn {
    background: #f0c040;
    color: #191f28;
    padding: 0.35rem 1rem;
    border-radius: var(--fm-radius-sm);
    text-decoration: none;
    font-size: 0.8rem;
    font-weight: 600;
    white-space: nowrap;
    flex-shrink: 0;
    transition: background 0.2s;
}

.ranking-preview-login-btn:hover {
    background: #e0b030;
}

/* Ranking Preview - Light Theme (Toss style) */
[data-theme="light"] .ranking-preview-card {
    background: #ffffff !important;
    border: 1px solid #e5e8eb !important;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06) !important;
    backdrop-filter: none !important;
}

[data-theme="light"] .ranking-preview-title {
    color: #c9302c !important;
}

[data-theme="light"] .ranking-preview-loading,
[data-theme="light"] .ranking-preview-empty {
    color: #8b95a1 !important;
}

[data-theme="light"] .ranking-preview-row {
    border-bottom-color: #f0f0f5 !important;
}

[data-theme="light"] .ranking-preview-name {
    color: #191f28 !important;
}

[data-theme="light"] a.ranking-preview-name:hover {
    color: #c9302c !important;
}

[data-theme="light"] .ranking-preview-team {
    color: #8b95a1 !important;
}

[data-theme="light"] .ranking-preview-points {
    color: #c9302c !important;
}

[data-theme="light"] .ranking-preview-footer {
    border-top-color: #f0f0f5 !important;
}

[data-theme="light"] .ranking-preview-view-all {
    color: #4e5968 !important;
}

[data-theme="light"] .ranking-preview-view-all:hover {
    color: #c9302c !important;
}

[data-theme="light"] .ranking-preview-login-hint {
    background: rgba(201, 48, 44, 0.04) !important;
    border-top-color: rgba(201, 48, 44, 0.1) !important;
}

[data-theme="light"] .ranking-preview-hint-text {
    color: #4e5968 !important;
}

[data-theme="light"] .ranking-preview-login-btn {
    background: #c9302c !important;
    color: #ffffff !important;
}

[data-theme="light"] .ranking-preview-login-btn:hover {
    background: #a02320 !important;
}

/* Ranking Preview - Mobile */
@media (max-width: 768px) {
    .ranking-preview-row {
        gap: 0.5rem;
    }
    .ranking-preview-name {
        font-size: 0.9rem;
    }
    .ranking-preview-team {
        display: none;
    }
    .ranking-preview-points {
        font-size: 0.85rem;
    }
    .ranking-preview-login-hint {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.6rem;
    }
    .ranking-preview-login-btn {
        align-self: center;
    }
}

/* ==================== LIGHT THEME - Event Result Page Overrides ==================== */

/* Pool section */
[data-theme="light"] .pool-selector {
    background: #f5f5f7;
}

[data-theme="light"] .pool-btn {
    background: #ffffff;
    color: #4e5968;
    border: 1px solid rgba(0, 0, 0, 0.12);
}

[data-theme="light"] .pool-btn:hover {
    border-color: #c9302c;
    color: #c9302c;
}

[data-theme="light"] .pool-btn.active {
    background: #c9302c;
    color: #ffffff;
    border-color: #c9302c;
}

[data-theme="light"] .pool-container {
    background: #ffffff;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
}

[data-theme="light"] .pool-title h4 {
    color: #191f28;
}

[data-theme="light"] .pool-info {
    color: #8b95a1;
}

/* Result table (pool results) */
[data-theme="light"] .result-table {
    background: #ffffff;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
    border-radius: var(--fm-radius-md);
    overflow: hidden;
}

[data-theme="light"] .result-table th {
    background: #1e3a8a;
    color: #ffffff;
}

[data-theme="light"] .result-table td {
    color: #191f28;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

[data-theme="light"] .result-table tbody tr:hover {
    background: #f5f5f7;
}

[data-theme="light"] .result-table .player-name {
    color: #191f28;
}

[data-theme="light"] .result-table .rank {
    color: #c9302c;
}

/* Matrix table */
[data-theme="light"] .matrix-table th {
    background: #1e3a8a;
    color: #ffffff;
}

[data-theme="light"] .matrix-table td {
    border-color: rgba(0, 0, 0, 0.08);
    color: #191f28;
}

[data-theme="light"] .matrix-table .player-col {
    background: #f5f5f7;
    color: #191f28;
}

[data-theme="light"] .matrix-table .team-col {
    background: #f5f5f7;
    color: #8b95a1;
}

[data-theme="light"] .matrix-table .victory {
    background: #dcfce7;
    color: #15803d;
}

[data-theme="light"] .matrix-table .defeat {
    background: #fef2f2;
    color: #dc2626;
}

[data-theme="light"] .matrix-table .self {
    background: #f3f4f6;
}

[data-theme="light"] .matrix-table .stats-col {
    background: #f5f5f7;
    color: #191f28;
}

/* Bout list */
[data-theme="light"] .bout-list-header {
    background: #f5f5f7;
    color: #191f28;
}

[data-theme="light"] .bout-list-header:hover {
    background: #e8e8ed;
}

[data-theme="light"] .bout-item {
    border-bottom-color: rgba(0, 0, 0, 0.06);
}

[data-theme="light"] .bout-player.winner {
    color: #15803d;
}

[data-theme="light"] .bout-player.loser {
    color: #8b95a1;
}

[data-theme="light"] .bout-score {
    background: #f5f5f7;
    color: #191f28;
}

/* Final table */
[data-theme="light"] .final-table {
    background: #ffffff;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
}

[data-theme="light"] .final-table th {
    background: #1e3a8a;
    color: #ffffff;
}

[data-theme="light"] .final-table td {
    color: #191f28;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

[data-theme="light"] .final-table tbody tr:hover {
    background: #f5f5f7;
}

[data-theme="light"] .final-table .name-cell {
    color: #191f28;
}

[data-theme="light"] .final-table .place-cell {
    color: #8b95a1;
}

[data-theme="light"] .final-table .points-cell {
    color: #c9302c;
}

/* Podium */
[data-theme="light"] .podium-section {
    background: #f5f5f7;
}

[data-theme="light"] .podium-section h3 {
    color: #191f28;
}

[data-theme="light"] .podium-box {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

[data-theme="light"] .podium-rank {
    color: #4e5968;
}

/* Stats summary */
[data-theme="light"] .stats-summary-box {
    background: #f5f5f7;
}

[data-theme="light"] .stat-item .value {
    color: #c9302c;
}

[data-theme="light"] .stat-item .label {
    color: #8b95a1;
}

/* DE round tabs (legacy) */
[data-theme="light"] .de-round-tabs {
    background: #f5f5f7;
}

[data-theme="light"] .de-round-tab {
    background: #ffffff;
    border-color: rgba(0, 0, 0, 0.12);
    color: #4e5968;
}

[data-theme="light"] .de-round-tab:hover {
    border-color: #c9302c;
    color: #c9302c;
}

[data-theme="light"] .de-round-tab.active {
    background: #c9302c;
    color: #ffffff;
    border-color: #c9302c;
}

/* DE match cards (legacy) */
[data-theme="light"] .de-match-card {
    background: #ffffff;
    border-color: rgba(0, 0, 0, 0.08);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
}

[data-theme="light"] .de-match-number {
    background: #f5f5f7;
    color: #8b95a1;
}

[data-theme="light"] .de-player.winner {
    background: #dcfce7;
}

[data-theme="light"] .de-player.loser {
    background: #f5f5f7;
}

[data-theme="light"] .de-player-name {
    color: #191f28;
}

[data-theme="light"] .de-player.winner .de-player-name {
    color: #166534;
}

[data-theme="light"] .de-player-team {
    color: #8b95a1;
}

[data-theme="light"] .de-score {
    color: #c9302c;
}

[data-theme="light"] .de-player.loser .de-score {
    color: #8b95a1;
}

[data-theme="light"] .de-match-result {
    background: #f5f5f7;
}

/* Tournament container */
[data-theme="light"] .tournament-container {
    background: #ffffff;
}

/* Empty state */
[data-theme="light"] .empty {
    color: #8b95a1;
}

[data-theme="light"] .empty p {
    color: #8b95a1;
}

/* ==================== Event Header Podium ==================== */
.event-header-layout {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1.5rem;
}
.event-header-info {
    flex: 1;
    min-width: 0;
}
.event-header-info h1 {
    margin-bottom: 18px;
}
.event-header-podium {
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-width: 160px;
}
.podium-entry {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.88rem;
    line-height: 1.3;
    white-space: nowrap;
}
.podium-medal {
    font-size: 1rem;
    flex-shrink: 0;
}
.podium-name {
    font-weight: 600;
    color: var(--text-primary, #fff);
}
.podium-team {
    color: var(--text-muted, #8899aa);
    font-size: 0.8rem;
    overflow: hidden;
    text-overflow: ellipsis;
}
@media (max-width: 768px) {
    .event-header-layout {
        flex-direction: column;
    }
    .event-header-podium {
        flex-direction: row;
        flex-wrap: wrap;
        gap: 8px;
        min-width: 0;
        border-top: 1px solid var(--border-color, rgba(255,255,255,0.08));
        padding-top: 10px;
        margin-top: 4px;
    }
    .podium-entry {
        font-size: 0.82rem;
    }
}

/* ==================== Event Statistics ==================== */
.stats-container { padding: 1rem 0; }

.stats-section {
    margin-bottom: 2rem;
}
.stats-section-title {
    font-size: 1.1rem;
    font-weight: 600;
    margin-bottom: 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid var(--border-color, rgba(255,255,255,0.1));
    color: var(--text-primary, #fff);
}

.stats-hero-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.stats-hero-card {
    background: var(--bg-card, rgba(18, 18, 26, 0.85));
    border: 1px solid var(--border-color, rgba(255,255,255,0.08));
    border-radius: var(--fm-radius-md);
    padding: 1.25rem;
    text-align: center;
}
.stats-hero-value {
    font-size: 1.8rem;
    font-weight: 700;
    color: var(--accent-primary, #00ff88);
}
.stats-hero-label {
    font-size: 0.8rem;
    color: var(--text-secondary, #8899aa);
    margin-top: 0.3rem;
}

.stats-bar-row {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 0.6rem;
}
.stats-bar-label {
    min-width: 100px;
    font-size: 0.85rem;
    text-align: right;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: var(--text-secondary, #b0b0c0);
}
.stats-bar-track {
    flex: 1;
    height: 22px;
    background: var(--bg-secondary, rgba(26,26,37,0.9));
    border-radius: 4px;
    overflow: hidden;
}
.stats-bar-fill {
    height: 100%;
    border-radius: 4px;
    display: flex;
    align-items: center;
    padding-left: 6px;
    font-size: 0.75rem;
    color: #fff;
}
.stats-bar-value {
    min-width: 40px;
    font-size: 0.85rem;
    text-align: right;
    color: var(--text-secondary, #b0b0c0);
}

/* Funnel visualization */
.stats-funnel { margin: 1rem 0; }
.stats-funnel-step {
    display: flex;
    align-items: center;
    margin-bottom: 0.4rem;
}
.stats-funnel-label {
    min-width: 80px;
    font-size: 0.85rem;
    text-align: right;
    margin-right: 0.75rem;
    color: var(--text-secondary, #b0b0c0);
}
.stats-funnel-bar {
    height: 28px;
    border-radius: 4px;
    display: flex;
    align-items: center;
    padding: 0 8px;
    font-size: 0.8rem;
    font-weight: 600;
    color: #000;
    white-space: nowrap;
}

/* Chart container */
.stats-chart-container {
    max-width: 600px;
    margin: 1rem auto;
}

/* Stats loading */
.stats-loading {
    text-align: center;
    padding: 2rem;
    color: var(--text-muted, #6b6b7b);
    font-size: 0.9rem;
}

/* Light theme overrides for statistics */
[data-theme="light"] .stats-section-title {
    color: #191f28;
    border-bottom-color: rgba(0,0,0,0.08);
}
[data-theme="light"] .stats-hero-card {
    background: #ffffff;
    border: 1px solid rgba(0,0,0,0.08);
}
[data-theme="light"] .stats-hero-value {
    color: var(--accent-primary, #00c471);
}
[data-theme="light"] .stats-hero-label {
    color: #8b95a1;
}
[data-theme="light"] .stats-bar-label {
    color: #4e5968;
}
[data-theme="light"] .stats-bar-track {
    background: #f0f0f5;
}
[data-theme="light"] .stats-bar-value {
    color: #4e5968;
}
[data-theme="light"] .stats-funnel-label {
    color: #4e5968;
}
[data-theme="light"] .stats-funnel-bar {
    color: #fff;
}

/* Grade-by-Round Table */
.stats-grade-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 0.75rem;
    font-size: 0.82rem;
}
.stats-legend-item {
    display: flex;
    align-items: center;
    gap: 4px;
    color: var(--text-secondary, #8899aa);
}
.stats-legend-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    flex-shrink: 0;
}
.stats-grade-table {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}
.stats-grade-table table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.85rem;
}
.stats-grade-table th {
    padding: 8px 10px;
    text-align: center;
    font-weight: 600;
    font-size: 0.8rem;
    color: var(--text-secondary, #8899aa);
    border-bottom: 2px solid var(--border-color, rgba(255,255,255,0.1));
    white-space: nowrap;
}
.stats-grade-table td {
    padding: 7px 10px;
    text-align: center;
    border-bottom: 1px solid var(--border-color, rgba(255,255,255,0.06));
    white-space: nowrap;
}
.stats-grade-round {
    text-align: left !important;
    font-weight: 600;
    color: var(--text-primary, #fff);
    min-width: 60px;
}
.stats-grade-count {
    font-weight: 600;
    color: var(--text-primary, #fff);
}
.stats-grade-pct {
    display: block;
    font-size: 0.72rem;
    font-weight: 400;
    margin-top: 1px;
}
.stats-grade-total {
    font-weight: 600;
    border-left: 2px solid var(--border-color, rgba(255,255,255,0.1));
}
.stats-grade-row-highlight {
    background: rgba(255, 215, 0, 0.06);
}
.stats-grade-row-highlight .stats-grade-round {
    color: var(--accent-primary, #00ff88);
}

/* Light theme overrides for grade table */
[data-theme="light"] .stats-grade-table th {
    color: #8b95a1;
    border-bottom-color: rgba(0,0,0,0.1);
}
[data-theme="light"] .stats-grade-table td {
    border-bottom-color: rgba(0,0,0,0.05);
}
[data-theme="light"] .stats-grade-round {
    color: #191f28;
}
[data-theme="light"] .stats-grade-count {
    color: #191f28;
}
[data-theme="light"] .stats-grade-total {
    border-left-color: rgba(0,0,0,0.1);
}
[data-theme="light"] .stats-grade-row-highlight {
    background: rgba(255, 215, 0, 0.08);
}
[data-theme="light"] .stats-grade-row-highlight .stats-grade-round {
    color: var(--accent-primary, #00c471);
}

/* Mobile responsive for statistics */
@media (max-width: 768px) {
    .stats-hero-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    .stats-hero-card {
        padding: 1rem;
    }
    .stats-hero-value {
        font-size: 1.5rem;
    }
    .stats-bar-label { min-width: 70px; font-size: 0.8rem; }
    .stats-funnel-label { min-width: 60px; font-size: 0.8rem; }
    .stats-chart-container { max-width: 100%; }
    .stats-grade-table { font-size: 0.78rem; }
    .stats-grade-table th, .stats-grade-table td { padding: 5px 6px; }
}

/* ==================== Sub-Rankings (National Events) ==================== */
.sub-rankings-section {
    margin-top: 2rem;
}
.sub-ranking-group {
    margin-bottom: 0.5rem;
    border: 1px solid var(--border-color, rgba(255,255,255,0.08));
    border-radius: var(--fm-radius-md);
    overflow: hidden;
}
.sub-ranking-toggle {
    width: 100%;
    padding: 12px 16px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: var(--bg-card, rgba(18,18,26,0.85));
    border: none;
    color: var(--text-primary, #fff);
    font-size: 0.9rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.2s;
}
.sub-ranking-toggle:hover {
    background: var(--bg-hover, rgba(99,102,241,0.1));
}
.sub-ranking-content {
    display: none;
}
.sub-ranking-group.open .sub-ranking-content {
    display: block;
}
.sub-ranking-group.open .toggle-arrow {
    transform: rotate(180deg);
}
.toggle-arrow {
    transition: transform 0.2s;
    font-size: 0.75rem;
}
[data-theme="light"] .sub-ranking-toggle {
    background: #f5f5f7;
    color: #191f28;
    border-color: #e5e8eb;
}
[data-theme="light"] .sub-ranking-toggle:hover {
    background: #eef0f4;
}
[data-theme="light"] .sub-ranking-group {
    border-color: #e5e8eb;
}

/* ==================== Rankings Collapsible ==================== */
.rankings-collapsible {
    margin-top: 1rem;
}
.rankings-collapsible-content {
    display: none;
}
.rankings-collapsible.open .rankings-collapsible-content {
    display: block;
}
.rankings-collapsible.open .toggle-arrow {
    transform: rotate(180deg);
}
.rankings-toggle {
    width: 100%;
    padding: 12px 16px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: var(--bg-card, rgba(18,18,26,0.85));
    border: 1px solid var(--border-color, rgba(255,255,255,0.08));
    border-radius: var(--fm-radius-md);
    color: var(--text-primary, #fff);
    font-size: 0.9rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.2s;
}
.rankings-toggle:hover {
    background: var(--bg-hover, rgba(99,102,241,0.1));
}
.rankings-toggle .toggle-arrow {
    transition: transform 0.2s;
    font-size: 0.75rem;
}
[data-theme="light"] .rankings-toggle {
    background: #f5f5f7;
    color: #191f28;
    border-color: #e5e8eb;
}
[data-theme="light"] .rankings-toggle:hover {
    background: #eef0f4;
}

/* ==================== Stats Hero Description ==================== */
.stats-hero-desc {
    font-size: 0.7rem;
    color: var(--text-muted, #6b6b7b);
    margin-top: 2px;
    line-height: 1.3;
}

/* ==================== Player Profile Ranking Section ==================== */
.player-ranking-section {
    margin-top: 1rem;
}
.ranking-cards {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    max-width: 100%;
    overflow: hidden;
}
.ranking-card {
    flex: 1 1 280px;
    min-width: 0;
    max-width: 100%;
    background: var(--bg-card, rgba(18,18,26,0.85));
    border: 1px solid var(--border-color, rgba(255,255,255,0.08));
    border-radius: var(--fm-radius-md);
    padding: 12px 16px;
    cursor: pointer;
    transition: all 0.2s;
    box-sizing: border-box;
    overflow: hidden;
}
.ranking-card:hover {
    border-color: var(--accent-primary, #c9302c);
}
.ranking-card-summary {
    display: flex;
    align-items: center;
    gap: 12px;
}
.ranking-position {
    flex-shrink: 0;
}
.rank-number {
    font-size: 1.3rem;
    font-weight: 700;
    color: var(--accent-primary, #c9302c);
}
.rank-total {
    font-size: 0.75rem;
    color: var(--text-muted, #6b6b7b);
}
.ranking-category {
    flex: 1;
    font-size: 0.8rem;
    color: var(--text-secondary, #a0a0b0);
    line-height: 1.3;
}
.ranking-year {
    font-weight: 700;
    margin-right: 4px;
}
.ranking-points {
    flex-shrink: 0;
    text-align: right;
}
.points-value {
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--text-primary, #fff);
}
.points-label {
    font-size: 0.7rem;
    color: var(--text-muted, #6b6b7b);
    margin-left: 2px;
}
/* Details (collapsed by default) */
.ranking-card-details {
    display: none;
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid var(--border-color, rgba(255,255,255,0.08));
    overflow: hidden;
    min-width: 0;
}
.ranking-card.expanded .ranking-card-details {
    display: block;
}
.ranking-detail-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 0.75rem;
    color: var(--text-muted, #6b6b7b);
    margin-bottom: 6px;
}
.ranking-detail-header {
    position: relative;
}
.ranking-detail-help {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    min-width: 18px;
    min-height: 18px;
    aspect-ratio: 1;
    border-radius: 50%;
    background: var(--border-color, rgba(255,255,255,0.12));
    font-size: 0.65rem;
    cursor: pointer;
    user-select: none;
    vertical-align: middle;
    flex-shrink: 0;
    line-height: 1;
}
.ranking-detail-help:hover {
    background: rgba(201, 48, 44, 0.3);
}
.ranking-help-popup {
    display: none;
    position: absolute;
    top: 100%;
    right: 0;
    z-index: 100;
    margin-top: 6px;
    padding: 14px 16px 16px;
    background: var(--bg-card, rgba(18,18,26,0.98));
    border: 1px solid var(--border-color, rgba(255,255,255,0.15));
    border-radius: var(--fm-radius-md);
    box-shadow: 0 8px 24px rgba(0,0,0,0.4);
    font-size: 0.75rem;
    line-height: 1.5;
    color: var(--text-secondary, #a0a0b0);
    min-width: 220px;
    max-width: 300px;
    overflow-y: auto;
    max-height: 60vh;
}
.ranking-help-popup.show {
    display: block;
}
.ranking-help-popup strong {
    display: block;
    margin-bottom: 6px;
    color: var(--text-primary, #fff);
    font-size: 0.8rem;
}
.ranking-help-popup p {
    margin: 4px 0;
}
[data-theme="light"] .ranking-help-popup {
    background: #ffffff;
    border-color: #e5e8eb;
    box-shadow: 0 8px 24px rgba(0,0,0,0.12);
    color: #4e5968;
}
[data-theme="light"] .ranking-help-popup strong {
    color: #191f28;
}
[data-theme="light"] .ranking-detail-help:hover {
    background: rgba(201, 48, 44, 0.12);
}
.sub-rank-tag {
    font-size: 0.65rem;
    color: var(--text-muted, #6b6b7b);
    font-weight: 400;
}
.ranking-breakdown-list {
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.ranking-breakdown-item {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.78rem;
    padding: 4px 0;
    min-width: 0;
    overflow: hidden;
}
.breakdown-rank {
    flex-shrink: 0;
    min-width: 36px;
    font-weight: 600;
    color: var(--text-primary, #fff);
    white-space: nowrap;
}
.breakdown-comp {
    flex: 1;
    color: var(--text-secondary, #a0a0b0);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.breakdown-pts {
    flex-shrink: 0;
    text-align: right;
    font-weight: 500;
    color: var(--text-primary, #fff);
}
.breakdown-weight {
    font-size: 0.65rem;
    color: var(--text-muted, #6b6b7b);
    margin-left: 2px;
}
/* Light theme */
[data-theme="light"] .ranking-card {
    background: #f5f5f7;
    border-color: #e5e8eb;
}
[data-theme="light"] .ranking-card:hover {
    border-color: var(--accent-primary, #c9302c);
}
[data-theme="light"] .rank-number {
    color: #c9302c;
}
[data-theme="light"] .points-value {
    color: #191f28;
}
[data-theme="light"] .breakdown-rank,
[data-theme="light"] .breakdown-pts {
    color: #191f28;
}
/* Single-card auto-expanded: no cursor pointer */
.ranking-cards > .ranking-card:only-child {
    cursor: default;
}

/* =========================================================================
   Domain code legend / help tooltip (.fm-help) — 2026-07-31
   Shared component for explaining domain shorthand (A26 rating, 8/57, P3,
   Pool, Direct Elimination). Visual language matches .ranking-detail-help.
   ========================================================================= */
.fm-help-wrap {
    position: relative;
    display: inline-flex;
    align-items: center;
    vertical-align: middle;
}
.fm-help {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    position: relative;
    width: 18px;
    height: 18px;
    min-width: 18px;
    min-height: 18px;
    aspect-ratio: 1;
    padding: 0;
    margin: 0;
    border: none;
    border-radius: 50%;
    background: var(--border-color, rgba(255, 255, 255, 0.12));
    color: var(--text-secondary, #a0a0b0);
    font-family: inherit;
    font-size: 0.65rem;
    font-weight: 700;
    line-height: 1;
    cursor: pointer;
    user-select: none;
    flex-shrink: 0;
}
/* Invisible 32px touch target without inflating the visual dot */
.fm-help::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 32px;
    height: 32px;
}
.fm-help:hover,
.fm-help[aria-expanded="true"] {
    background: rgba(201, 48, 44, 0.3);
    color: var(--text-primary, #fff);
}
.fm-help:focus-visible {
    outline: 2px solid var(--fm-accent-primary, #c9302c);
    outline-offset: 2px;
}
.fm-help-popup {
    display: none;
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    z-index: 200;
    padding: 14px 16px 16px;
    background: var(--bg-card, rgba(18, 18, 26, 0.98));
    border: 1px solid var(--border-color, rgba(255, 255, 255, 0.15));
    border-radius: var(--fm-radius-md);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);
    width: max-content;
    min-width: 200px;
    max-width: min(300px, calc(100vw - 32px));
    max-height: 60vh;
    overflow-y: auto;
    font-size: 0.75rem;
    font-weight: 400;
    line-height: 1.55;
    text-align: left;
    white-space: normal;
    color: var(--text-secondary, #a0a0b0);
}
.fm-help-popup.show {
    display: block;
}
/* Anchor variants for triggers near the right edge / centered layouts */
.fm-help-popup.fm-help-popup--end {
    left: auto;
    right: 0;
}
.fm-help-popup.fm-help-popup--center {
    left: 50%;
    transform: translateX(-50%);
}
.fm-help-popup strong {
    display: block;
    margin-bottom: 6px;
    color: var(--text-primary, #fff);
    font-size: 0.8rem;
}
.fm-help-popup p {
    margin: 4px 0;
}
.fm-help-popup code {
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 0.72rem;
    color: var(--text-primary, #fff);
}
/* Desktop pointers: hover opens too */
@media (hover: hover) and (pointer: fine) {
    .fm-help-wrap:hover .fm-help-popup,
    .fm-help:focus-visible + .fm-help-popup {
        display: block;
    }
}
/* Light theme */
[data-theme="light"] .fm-help {
    background: rgba(0, 0, 0, 0.07);
    color: #4e5968;
}
[data-theme="light"] .fm-help:hover,
[data-theme="light"] .fm-help[aria-expanded="true"] {
    background: rgba(201, 48, 44, 0.12);
    color: #191f28;
}
[data-theme="light"] .fm-help-popup {
    background: #ffffff;
    border-color: #e5e8eb;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
    color: #4e5968;
}
[data-theme="light"] .fm-help-popup strong,
[data-theme="light"] .fm-help-popup code {
    color: #191f28;
}

/* ============================================================
   메달 표시 (2026-10-12) — 🥇🥈🥉 이모지 대신 메달 색 점 + 순위 숫자 / 금·은·동 글자.
   색만으로 구분하지 않도록 항상 숫자나 글자가 함께 붙는다.
   ============================================================ */
.fm-medal-dot {
    display: inline-block;
    width: 0.62em;
    height: 0.62em;
    border-radius: 50%;
    margin-right: 0.32em;
    vertical-align: 0.06em;
    flex-shrink: 0;
}
.fm-medal-dot--gold   { background: var(--fm-medal-gold, #d4a574); }
.fm-medal-dot--silver { background: var(--fm-medal-silver, #9ca3af); }
.fm-medal-dot--bronze { background: var(--fm-medal-bronze, #cd7f32); }
.fm-medal { display: inline-flex; align-items: center; white-space: nowrap; }
.podium-medal .fm-medal { font-size: 0.95rem; font-weight: 600; line-height: 1.2; }
.fm-icon-star { display: inline-block; vertical-align: -0.12em; }

/* ============================================================
   시상대 칸 높이 = 순위 (2026-10-13). 높이가 내용으로 정해져 공동 3위 두 명이 든 동 칸이
   금 칸보다 높게 그려졌고, 단독 3위여도 은·동 높이가 같았다. 칸 높이는 금 > 은 > 동으로
   고정하고, 공동 3위는 동 칸 안에서 나란히 놓아 칸이 늘어나지 않게 한다.
   ============================================================ */
.podium-box { display: flex; flex-direction: column; justify-content: center; }
.podium-place.first .podium-box  { min-height: 120px; }
.podium-place.second .podium-box { min-height: 104px; }
.podium-place.third .podium-box  { min-height: 88px; }
.podium-bronzes { display: flex; gap: 14px; justify-content: center; }
.podium-pair-item { min-width: 0; flex: 1 1 0; }
.podium-bronzes--tied .podium-name,
.podium-bronzes--tied .podium-team { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@media (max-width: 768px) {
    .podium-place.first .podium-box  { min-height: 84px; }
    .podium-place.second .podium-box { min-height: 76px; }
    .podium-place.third .podium-box  { min-height: 70px; }
    .podium-bronzes { gap: 10px; }
}