:root{--bg:#f7fafc;--card:#fff;--accent:#0ea5a4;--text:#0f172a;--muted:#6b7280;--maxw:960px}
*{box-sizing:border-box}
body{font-family: -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial; background:var(--bg); color:var(--text); margin:0; padding:0}
.header{background:linear-gradient(90deg,#06b6d4,#7c3aed); color:white; padding:24px 16px}
.header .inner{max-width:var(--maxw); margin:0 auto; display:flex; align-items:center; justify-content:space-between}
.nav a{color:rgba(255,255,255,0.95); margin-left:18px; text-decoration:none; font-weight:600}
.container{max-width:var(--maxw); margin:28px auto; padding:0 16px}
.card{background:var(--card); padding:20px; border-radius:10px; box-shadow:0 6px 18px rgba(2,6,23,0.06); margin-bottom:18px}
.table{width:100%; border-collapse:collapse; margin-top:12px}
.table th,.table td{border:1px solid #e6e9ef; padding:8px; text-align:left; font-size:14px}
.table th{background:#f3f4f6}
.footer{max-width:var(--maxw); margin:20px auto 60px; padding:0 16px; color:var(--muted); font-size:13px; text-align:center}
.source{font-size:13px; color:var(--muted); margin-top:12px}
@media (max-width:600px){ .header .inner{flex-direction:column; align-items:flex-start} .nav{margin-top:8px} .table th,.table td{font-size:13px} }