.container{max-width:1200px;margin:0 auto;padding:16px}
h1{font-size:1.3rem;font-weight:800;color:#0f172a;margin-bottom:4px}
.subtitle{font-size:.82rem;color:#64748b;margin-bottom:16px}

.card{background:white;border-radius:10px;padding:16px 20px;margin-bottom:14px;box-shadow:0 1px 4px rgba(0,0,0,.07)}
.card h2{font-size:.92rem;font-weight:700;color:#0f172a;margin-bottom:10px;border-bottom:2px solid #e2e8f0;padding-bottom:6px}

.date-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:10px}
.date-row label{font-size:.82rem;font-weight:600;color:#334155}
.date-row input[type="date"]{padding:6px 10px;border:1px solid #e2e8f0;border-radius:6px;font-size:.82rem;font-family:inherit}
.date-row span{color:#94a3b8;font-size:.9rem}
.btn{padding:6px 14px;border:none;border-radius:6px;cursor:pointer;font-size:.78rem;font-weight:600;transition:background .15s}
.btn-primary{background:#2563eb;color:white}
.btn-primary:hover{background:#1d4ed8}

.quick-btns{display:flex;gap:4px;flex-wrap:wrap;margin-bottom:10px}
.quick-btn{padding:4px 12px;border:1px solid #e2e8f0;border-radius:16px;background:#f8fafc;color:#475569;font-size:.72rem;cursor:pointer;transition:all .15s;font-weight:500}
.quick-btn:hover{background:#dbeafe;border-color:#93c5fd;color:#2563eb}
.quick-btn.active{background:#2563eb;color:white;border-color:#2563eb}

.status-bar{padding:10px 16px;background:#eff6ff;border:1px solid #bfdbfe;border-radius:8px;margin-bottom:14px;font-size:.82rem;color:#1e40af;display:none}
.status-bar.error{background:#fef2f2;border-color:#fecaca;color:#dc2626}
.status-bar.success{background:#f0fdf4;border-color:#bbf7d0;color:#15803d}

.summary-bar{display:flex;flex-wrap:wrap;gap:0;background:white;border-radius:10px;box-shadow:0 1px 4px rgba(0,0,0,.07);margin-bottom:14px;padding:12px 16px;align-items:center}
.summ-stat{text-align:center;padding:0 14px;min-width:70px}
.summ-val{font-size:1.15rem;font-weight:700;color:#0f172a}
.summ-val.pos{color:#16a34a}.summ-val.neg{color:#dc2626}
.summ-label{font-size:.65rem;color:#94a3b8;line-height:1.3;margin-top:2px}
.summ-sep{width:1px;height:36px;background:#e2e8f0;margin:0 6px}

table.rank-table{width:100%;border-collapse:collapse;font-size:.82rem;background:white;border-radius:10px;overflow:hidden;box-shadow:0 1px 4px rgba(0,0,0,.07)}
table.rank-table thead th{background:#1a3a5c;color:white;padding:8px 10px;font-weight:600;white-space:nowrap;position:sticky;top:0;cursor:pointer;user-select:none}
table.rank-table thead th:first-child{text-align:center;width:50px}
table.rank-table thead th:nth-child(2),table.rank-table thead th:nth-child(3){text-align:left}
table.rank-table td{padding:6px 10px;border-bottom:1px solid #f1f5f9;white-space:nowrap}
table.rank-table td:first-child{text-align:center;font-weight:700;color:#64748b}
table.rank-table td:nth-child(2){font-weight:700}
table.rank-table tr:hover td{background:#f8fafc}
table.rank-table a{color:#2563eb;text-decoration:none;font-weight:700}
table.rank-table a:hover{text-decoration:underline}
.ret-pos{color:#16a34a;font-weight:700}
.ret-neg{color:#dc2626;font-weight:700}
.rank-medal{font-size:1rem}
.pct-bar-cell{position:relative}
.pct-bar-bg{position:absolute;top:2px;bottom:2px;left:0;border-radius:3px;opacity:.15}

.loading-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(255,255,255,.8);display:flex;align-items:center;justify-content:center;z-index:300;display:none}
.loading-overlay .spinner{width:40px;height:40px;border:4px solid #e2e8f0;border-top-color:#2563eb;border-radius:50%;animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

@media(max-width:600px){
  .container{padding:10px}
  .date-row{gap:6px}
  .date-row input[type="date"]{font-size:.75rem}
}