.clash-upcoming-list {
            list-style: none;
            margin: 0;
            padding: 0;
        }

        .clash-upcoming-item {
            padding: 14px 12px;
            margin-bottom: 12px;
            border: 1px solid #636363;
            border-radius: 6px;
            background: #252525;
            text-align: center;
        }

        .clash-upcoming-title {
            font-size: 15px;
            font-weight: bold;
            color: #fcd330;
            margin-bottom: 10px;
            line-height: 1.35;
        }

        .clash-upcoming-vs {
            color: #aaa;
            font-weight: normal;
            margin: 0 4px;
        }

        .clash-upcoming-avatars {
            display: flex;
            justify-content: center;
            align-items: center;
            gap: 16px;
            margin-bottom: 10px;
        }

        .clash-upcoming-avatar {
            width: 72px;
            height: 72px;
            object-fit: cover;
            border: 1px solid #636363;
            border-radius: 4px;
        }

        .clash-upcoming-class {
            display: flex;
            justify-content: center;
            align-items: center;
            gap: 8px;
            margin-bottom: 8px;
            color: #d4d4d4;
            font-size: 14px;
        }

        .clash-upcoming-class img {
            max-height: 28px;
            width: auto;
        }

        .clash-upcoming-time {
            color: #bbb;
            font-size: 13px;
            line-height: 1.45;
        }

        .clash-upcoming-countdown {
            color: #999;
        }

.clash-lineup-block {
            margin: 12px 0;
        }

        .clash-lineup-block h4 {
            margin: 0 0 8px;
            color: #d4d4d4;
            font-size: 13px;
            font-weight: bold;
        }

        .clash-lineup-list {
            list-style: none;
            margin: 0;
            padding: 0;
        }

        .clash-lineup-option {
            display: block;
            padding: 10px 12px;
            margin-bottom: 8px;
            border: 1px solid #636363;
            border-radius: 6px;
            background: #3e3e3e;
            cursor: pointer;
            text-align: left;
            transition: border-color 0.15s, background 0.15s, box-shadow 0.15s;
        }

        .clash-lineup-option input {
            display: none;
        }

        .clash-lineup-car-card {
            display: flex;
            align-items: flex-start;
            gap: 12px;
            width: 100%;
        }

        .clash-lineup-car-visual {
            flex: 0 0 auto;
            min-width: 0;
        }

        .clash-lineup-car-info {
            flex: 1;
            min-width: 0;
            overflow: hidden;
        }

        .clash-lineup-racer-card {
            display: flex;
            align-items: flex-start;
            gap: 12px;
            width: 100%;
        }

        .clash-lineup-racer-visual {
            flex: 0 0 48px;
            width: 48px;
        }

        .clash-lineup-racer-avatar {
            display: block;
            width: 48px;
            height: 48px;
            object-fit: cover;
            border: 1px solid #636363;
            border-radius: 4px;
        }

        .clash-lineup-racer-info {
            flex: 1;
            min-width: 0;
            overflow: hidden;
        }

        .clash-lineup-car-class {
            display: flex;
            align-items: center;
            gap: 6px;
            margin-top: 4px;
            color: #d4d4d4;
            font-size: 13px;
        }

        .clash-lineup-car-class img {
            max-height: 22px;
            width: auto;
        }

        .clash-lineup-option:has(input:checked),
        .clash-lineup-option.is-selected {
            border-color: #fcd330;
            background: #3e3e3e;
            box-shadow: 0 0 0 1px rgba(252, 211, 48, 0.35);
        }

        .clash-lineup-option-title {
            color: #fcd330;
            font-weight: bold;
        }

        .clash-lineup-option-meta {
            color: #999;
            font-size: 12px;
            margin-top: 4px;
        }

        .clash-lineup-empty {
            color: #999;
            font-size: 13px;
            margin: 0;
        }

        .clash-lineup-confirm-btn[hidden] {
            display: none !important;
        }

        .clash-completed-race-list {
            list-style: none;
            margin: 0;
            padding: 0;
        }

        .clash-completed-race-item {
            padding: 10px 0;
            border-bottom: 1px solid #636363;
            line-height: 1.45;
        }

        .clash-completed-race-title {
            color: #fcd330;
            font-weight: bold;
            margin-bottom: 4px;
        }

        .clash-completed-race-racers {
            margin-bottom: 4px;
        }

        .clash-completed-race-vs {
            color: #aaa;
            margin: 0 4px;
        }

        .clash-completed-race-winner {
            margin-bottom: 4px;
        }

        .clash-completed-race-actions {
            margin-top: 8px;
        }

        .clash-completed-race-meta {
            color: #999;
            font-size: 13px;
        }

.clash-history-list {
            list-style: none;
            margin: 0;
            padding: 0;
        }

        .clash-history-item {
            padding: 12px;
            margin-bottom: 10px;
            border: 1px solid #636363;
            border-radius: 6px;
            background: #252525;
            text-align: center;
            line-height: 1.45;
        }

        .clash-history-item a {
            color: #fcd330;
            text-decoration: none;
        }

        .clash-history-score {
            font-size: 18px;
            font-weight: bold;
            color: #fcd330;
            margin: 6px 0;
        }

        .clash-history-winner {
            color: #8fd48f;
            font-weight: bold;
        }

        .clash-history-draw {
            color: #bbb;
        }

        .clash-history-meta {
            color: #999;
            font-size: 13px;
            margin-top: 6px;
        }

.clash-top-list {
            list-style: none;
            margin: 0;
            padding: 0;
        }

        .clash-top-item {
            display: flex;
            align-items: center;
            gap: 12px;
            padding: 12px;
            margin-bottom: 10px;
            border: 1px solid #636363;
            border-radius: 6px;
            background: #252525;
        }

        .clash-top-rank {
            min-width: 28px;
            font-size: 18px;
            font-weight: bold;
            color: #fcd330;
            text-align: center;
        }

        .clash-top-avatar {
            width: 48px;
            height: 48px;
            object-fit: cover;
            border: 1px solid #636363;
            border-radius: 4px;
            flex-shrink: 0;
        }

        .clash-top-info {
            flex: 1;
            min-width: 0;
        }

        .clash-top-name {
            font-weight: bold;
            color: #fcd330;
            text-decoration: none;
            display: block;
            margin-bottom: 4px;
        }

        .clash-top-points {
            font-size: 14px;
        }

        .clash-top-points-positive {
            color: #8fd48f;
        }

        .clash-top-points-negative {
            color: #ff6b6b;
        }

        .clash-top-points-zero {
            color: #bbb;
        }

.clash-create-section {
            margin: 10px 0;
            overflow: hidden;
        }

        .clash-create-lead {
            margin: 0 0 12px;
            color: #999;
        }

        .clash-create-form {
            width: 100%;
            max-width: 100%;
        }

        .clash-create-form,
        .clash-create-form * {
            box-sizing: border-box;
        }

        .clash-form-input {
            display: block;
            width: 100%;
            max-width: 100%;
            min-width: 0;
        }

        .clash-form-datetime {
            font-size: 12px;
        }

        #currency_buttons {
            width: 100%;
            max-width: 100%;
        }

        .clash-currency-btn {
            display: flex;
            align-items: center;
            justify-content: center;
            width: 25px;
            height: 25px;
            border: 2px solid #636363;
            border-radius: 8px;
            background: #2a2a2a;
            cursor: pointer;
            transition: border-color 0.15s, background 0.15s, box-shadow 0.15s, transform 0.15s;
        }

        .clash-currency-btn input {
            display: none;
        }

        .clash-currency-btn img {
            width: 16px;
            height: 16px;
            opacity: 0.65;
            transition: opacity 0.15s, transform 0.15s;
        }

        .clash-currency-btn.is-selected {
            border-color: #fcd330;
            background: #3d3520;
            box-shadow: 0 0 0 2px rgba(252, 211, 48, 0.35), inset 0 0 12px rgba(252, 211, 48, 0.15);
            transform: scale(1.05);
        }

        .clash-currency-btn.is-selected img {
            opacity: 1;
            transform: scale(1.08);
        }

        .clash-races-btn {
            display: flex;
            align-items: center;
            justify-content: center;
            min-width: 44px;
            height: 36px;
            padding: 0 10px;
            border: 2px solid #636363;
            border-radius: 8px;
            background: #2a2a2a;
            cursor: pointer;
            color: #bbb;
            font-size: 14px;
            font-weight: bold;
            transition: border-color 0.15s, background 0.15s, box-shadow 0.15s, transform 0.15s, color 0.15s;
        }

        .clash-races-btn input {
            display: none;
        }

        .clash-races-btn.is-selected {
            border-color: #fcd330;
            background: #3d3520;
            color: #fcd330;
            box-shadow: 0 0 0 2px rgba(252, 211, 48, 0.35), inset 0 0 12px rgba(252, 211, 48, 0.15);
            transform: scale(1.05);
        }