
:root{
    --bg:#13100d;--panel:#1e1813;--panel2:#2a2119;--text:#fff8ed;
    --muted:#cdbca7;--gold:#e4bd71;--accent:#9cc9d7;--line:rgba(255,255,255,.1);
}
*{box-sizing:border-box}
body{margin:0;background:linear-gradient(180deg,#100d0b,#18120f);color:var(--text);
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(--line);
background:linear-gradient(135deg,rgba(228,189,113,.10),rgba(81,124,136,.08));border-radius:24px}
.oznaka{font-size:12px;letter-spacing:.18em;color:var(--gold);font-weight:800}
h1{font-size:42px;margin:5px 0}.hero p{color:var(--muted)}
.xp{background:#1a1511;border:1px solid var(--line);padding:11px 14px;border-radius:14px;white-space:nowrap}
.zavihki{display:flex;gap:8px;flex-wrap:wrap;margin:18px 0}
.zavihki button{border:1px solid var(--line);background:var(--panel);color:#fff;padding:11px 14px;border-radius:12px;cursor:pointer}
.zavihki button.aktiven{background:#5b472c;border-color:#a68450}
.pogled{display:none}.pogled.aktiven{display:block}
.mreza{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px}
.kartica,.obdobje,.kraj,.oseba,.naloga,.podrobnosti{background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:18px}
.obdobje,.kraj,.oseba{transition:.18s}.obdobje:hover,.kraj:hover,.oseba:hover{transform:translateY(-2px);background:var(--panel2)}
.ikona{font-size:36px}.kartica p,.obdobje p,.kraj p,.oseba p,.naloga p,.podrobnosti p{color:var(--muted);line-height:1.55}
.leta{font-size:12px;color:var(--gold);font-weight:700}
button{font:inherit}.kartica button,.obdobje button,.kraj button,.oseba button,.naloga button{
border:0;background:#6d512f;color:#fff;padding:9px 12px;border-radius:10px;cursor:pointer}
.iskanje{margin-bottom:14px}.iskanje input{width:100%;padding:13px 14px;border-radius:12px;border:1px solid var(--line);background:#19130f;color:#fff}
.podrobnosti{margin-top:14px}.skrito{display:none}
.odgovori{display:grid;gap:8px;margin-top:12px}.odgovori button{text-align:left}
.status{margin-top:12px;color:var(--gold);font-weight:700}
@media(max-width:650px){.modul{padding:12px}.hero{flex-direction:column;align-items:flex-start;padding:20px}h1{font-size:32px}}
