.stats-header { text-align: center; margin-bottom: 30px; }
.stats-header h1 { font-size: 26px; margin-bottom: 8px; background: linear-gradient(90deg, #00d4ff, #7b2cbf); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; }
.back-link { display: inline-block; color: #888; text-decoration: none; margin-bottom: 15px; font-size: 14px; transition: color 0.3s; }
.back-link:hover { color: #00d4ff; }
.stats-container { margin-bottom: 30px; }
.stats-overview { display: grid; grid-template-columns: repeat(2, 1fr); gap: 15px; margin-bottom: 30px; }
.stat-card { background: rgba(255, 255, 255, 0.05); border-radius: 16px; padding: 20px; text-align: center; border: 1px solid rgba(255, 255, 255, 0.1); transition: all 0.3s; }
.stat-card:hover { background: rgba(255, 255, 255, 0.08); transform: translateY(-2px); }
.stat-number { font-size: 32px; font-weight: 700; background: linear-gradient(135deg, #00d4ff 0%, #7b2cbf 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; margin-bottom: 5px; }
.stat-label { font-size: 13px; color: #888; }
.stat-section { background: rgba(255, 255, 255, 0.05); border-radius: 16px; padding: 20px; margin-bottom: 20px; border: 1px solid rgba(255, 255, 255, 0.1); }
.stat-section h3 { font-size: 16px; margin-bottom: 20px; color: #fff; }
.scenario-stats-list { display: flex; flex-direction: column; gap: 15px; }
.scenario-stat-item { display: grid; grid-template-columns: 100px 1fr 80px; align-items: center; gap: 15px; }
.scenario-name { font-size: 13px; color: #ccc; }
.scenario-bar { height: 8px; background: rgba(255, 255, 255, 0.1); border-radius: 4px; overflow: hidden; }
.scenario-bar-fill { height: 100%; background: linear-gradient(90deg, #00d4ff 0%, #7b2cbf 100%); border-radius: 4px; transition: width 0.5s ease; }
.scenario-rate { font-size: 12px; color: #888; text-align: right; }
.personal-best { text-align: center; }
.best-streak { display: flex; align-items: center; justify-content: center; gap: 10px; padding: 20px; }
.streak-number { font-size: 48px; font-weight: 700; background: linear-gradient(135deg, #fbbf24 0%, #f59e0b 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; }
.streak-label { font-size: 14px; color: #888; }
.sessions-list { display: flex; flex-direction: column; gap: 10px; }
.session-item { display: flex; justify-content: space-between; align-items: center; padding: 12px 15px; background: rgba(0, 0, 0, 0.2); border-radius: 10px; border-left: 3px solid transparent; }
.session-item.success { border-left-color: #4ade80; }
.session-item.fail { border-left-color: #f87171; }
.session-info { display: flex; flex-direction: column; gap: 3px; }
.session-name { font-size: 14px; color: #fff; }
.session-time { font-size: 12px; color: #666; }
.session-result { display: flex; align-items: center; gap: 10px; }
.result-badge { font-size: 12px; padding: 4px 10px; border-radius: 20px; background: rgba(255, 255, 255, 0.1); }
.session-item.success .result-badge { color: #4ade80; background: rgba(74, 222, 128, 0.15); }
.session-item.fail .result-badge { color: #f87171; background: rgba(248, 113, 113, 0.15); }
.rounds-badge { font-size: 11px; color: #666; }
.empty-state { text-align: center; padding: 60px 20px; }
.empty-icon { font-size: 64px; margin-bottom: 20px; opacity: 0.5; }
.empty-state h3 { font-size: 18px; color: #fff; margin-bottom: 10px; }
.empty-state p { color: #666; margin-bottom: 25px; }
.stats-actions { display: flex; gap: 15px; justify-content: center; }
.btn { padding: 14px 28px; border-radius: 12px; border: none; font-size: 15px; font-weight: 600; cursor: pointer; transition: all 0.3s; display: flex; align-items: center; gap: 8px; }
.btn-primary { background: linear-gradient(135deg, #00d4ff 0%, #7b2cbf 100%); color: #fff; }
.btn-primary:hover { transform: translateY(-2px); box-shadow: 0 4px 20px rgba(0, 212, 255, 0.3); }
.btn-danger { background: rgba(248, 113, 113, 0.1); color: #f87171; border: 1px solid rgba(248, 113, 113, 0.3); }
.btn-danger:hover { background: rgba(248, 113, 113, 0.2); }
@media (max-width: 480px) {
.stats-overview { grid-template-columns: 1fr 1fr; }
.stat-number { font-size: 24px; }
.scenario-stat-item { grid-template-columns: 80px 1fr 70px; gap: 10px; }
.scenario-name { font-size: 11px; }
.stats-actions { flex-direction: column; }
.btn { width: 100%; justify-content: center; }
}