body { margin:0; padding:0; font-family:sans-serif; background:#0f172a; color:white; }
.container { max-width:900px; margin:20px auto; padding:10px; }
h1 { font-size:2rem; margin-bottom:20px; text-align:center; }
select { margin:5px; padding:5px; border-radius:5px; }
.tabs { margin-top:20px; text-align:center; }
.tab-btn { margin:0 5px; padding:5px 15px; border:none; border-radius:5px; cursor:pointer; background:#1e293b; color:white; transition:0.2s; }
.tab-btn.active { background:#0ea5e9; color:black; }
#tabContent { margin-top:20px; display:flex; flex-wrap:wrap; gap:10px; justify-content:center; }
.level-card { background:#1e293b; padding:10px; border-radius:10px; width:160px; text-align:center; transition:0.2s; }
.level-card:hover { background:#0ea5e9; color:black; transform:translateY(-5px); }