.club-selector { padding: 20px; border: 1px solid var(--line); border-radius: 12px; background: linear-gradient(145deg, #0d2f43, #061420); }
.club-mode-switch { display: flex; gap: 8px; padding-bottom: 13px; border-bottom: 1px solid #ffffff18; }
.club-mode { padding: 10px 14px; border: 1px solid #38677b; border-radius: 7px; background: #071b2a; color: #a8cbd8; cursor: pointer; font: inherit; font-size: 12px; }
.club-mode b { margin-left: 7px; color: #f6d46d; }.club-mode.active { border-color: #65d9ed; background: #124760; color: #effdff; }
.club-selector-description { margin: 14px 0 18px; color: #9dbbc6; font-size: 12px; }
.club-selector-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(205px, 1fr)); gap: 12px; }
.club-select-card { min-height: 155px; display: flex; flex-direction: column; align-items: flex-start; padding: 15px; border: 1px solid #386274; border-radius: 9px; background: linear-gradient(145deg, #082334, #07131f); color: #eaf8ff; cursor: pointer; font: inherit; text-align: left; transition: transform .16s, border-color .16s, box-shadow .16s; }
.club-select-card:hover { transform: translateY(-3px); border-color: #72dff0; }.club-select-card.selected { border-color: #ffdb70; box-shadow: 0 0 0 1px #ffdb70, 0 12px 24px #0008; }
.club-select-card.actual-sample-club { border-color: #bd9551; background: linear-gradient(145deg, #4c3c20, #11222e 60%); }.club-select-type { color: #73cce0; font-size: 9px; letter-spacing: 1px; }.actual-sample-club .club-select-type { color: #ffe084; }
.club-select-card strong { margin: 14px 0 7px; font-size: 20px; }.club-select-card > span:not(.club-select-type) { color: #9ec0cb; font-size: 11px; }.club-select-card small { margin-top: 5px; color: #7f9eaa; font-size: 10px; }.club-select-card b { margin-top: auto; color: #f7d46b; font-size: 11px; }
@media (max-width: 650px) { .club-selector { padding: 13px; }.club-selector-grid { grid-template-columns: 1fr; }.club-select-card { min-height: 130px; } }