:root{
    --ozadje:#081022;
    --kartica:#111a35;
    --kartica2:#162143;
    --tekst:#f6f8ff;
    --muted:#aeb8d7;
    --modra:#72d7ff;
    --zlata:#ffd86b;
    --crta:rgba(255,255,255,.1);
}
*{box-sizing:border-box}
body{margin:0;background:linear-gradient(180deg,#081022,#0b1330);color:var(--tekst);font-family:Inter,system-ui,Segoe UI,Arial,sans-serif}
.modul{max-width:1180px;margin:auto;padding:24px}
.hero{display:flex;justify-content:space-between;gap:20px;align-items:center;padding:28px;border:1px solid var(--crta);
background:linear-gradient(135deg,rgba(114,215,255,.09),rgba(131,90,255,.08));border-radius:24px}
.oznaka{font-size:12px;letter-spacing:.18em;color:var(--modra);font-weight:800}
h1{font-size:42px;margin:5px 0}h2{margin-top:8px}
.hero p{color:var(--muted)}.xp{padding:12px 16px;border-radius:14px;background:#0d1732;border:1px solid var(--crta);white-space:nowrap}
.povezave-modula{margin-top:10px;font-size:14px}.povezave-modula a{color:var(--zlata);font-weight:700;text-decoration:none}.povezave-modula a:hover{text-decoration:underline}
.zavihki{display:flex;gap:8px;flex-wrap:wrap;margin:18px 0}
.zavihki button{border:1px solid var(--crta);background:var(--kartica);color:#fff;padding:11px 15px;border-radius:12px;cursor:pointer}
.zavihki button.aktiven{background:#254c78;border-color:#4a91c4}
.pogled{display:none}.pogled.aktiven{display:block}
.mreza,.planet-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}
.kartica,.lekcija,.planet,.naloga,.podrobnosti{background:var(--kartica);border:1px solid var(--crta);border-radius:18px;padding:18px}
.lekcija h3,.planet h3,.naloga h3{margin:7px 0}
.lekcija p,.planet p,.naloga p,.podrobnosti p{color:var(--muted);line-height:1.55}
.lekcija button,.planet button,.naloga button,.kartica button{border:0;background:#2a5f91;color:white;border-radius:10px;padding:9px 12px;cursor:pointer}
.planet{cursor:pointer;transition:.18s}.planet:hover{transform:translateY(-2px);background:var(--kartica2)}
.planet .ikona{font-size:34px}.podrobnosti{margin-top:15px}.skrito{display:none}
.dejstva{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px;margin:14px 0}
.dejstvo{background:rgba(255,255,255,.05);padding:10px;border-radius:10px}
.dejstvo small{display:block;color:var(--muted);font-size:11px}.dejstvo b{display:block;margin-top:3px}
.odgovori{display:grid;gap:8px;margin-top:12px}.odgovori button{text-align:left}
.status{margin-top:12px;font-weight:700;color:var(--zlata)}
@media(max-width:650px){.modul{padding:12px}.hero{padding:20px;align-items:flex-start}.hero{flex-direction:column}h1{font-size:33px}}