:root { --bg:#f6f7f9; --kort:#fff; --tekst:#1c2430; --dempet:#5f6b7a; --linje:#dde2e8; --aksent:#1f5fa8; --feil:#b42318; --varsel:#b54708; --ok:#027a48; }
@media (prefers-color-scheme: dark) { :root { --bg:#12161c; --kort:#1b2129; --tekst:#e6e9ee; --dempet:#9aa5b4; --linje:#2c343f; --aksent:#6aa5ec; --feil:#f97066; --varsel:#fdb022; --ok:#32d583; } }
* { box-sizing:border-box; }
body { margin:0; font:16px/1.5 system-ui, -apple-system, "Segoe UI", sans-serif; background:var(--bg); color:var(--tekst); }
.topp { display:flex; justify-content:space-between; align-items:center; padding:12px 16px; background:var(--kort); border-bottom:1px solid var(--linje); }
.logo { font-weight:700; color:var(--tekst); text-decoration:none; }
main { max-width:960px; margin:0 auto; padding:16px; }
a { color:var(--aksent); }
.dempet { color:var(--dempet); font-size:.9em; }
.kort { background:var(--kort); border:1px solid var(--linje); border-radius:8px; padding:16px; margin:12px 0; }
.smalt { max-width:520px; }
.melding { background:var(--kort); border-left:4px solid var(--ok); padding:8px 12px; }
.feil { color:var(--feil); }
.antall { font-size:.75em; padding:2px 8px; border-radius:99px; background:var(--linje); }
.oppgaver { list-style:none; padding:0; }
.oppgave { display:flex; flex-wrap:wrap; gap:4px 12px; align-items:baseline; padding:10px 12px; background:var(--kort); border:1px solid var(--linje); border-left:4px solid var(--aksent); border-radius:6px; margin-bottom:6px; }
.oppgave.befaring { border-left-color:var(--ok); }
.oppgave.reklamasjon { border-left-color:var(--varsel); }
.oppgave time { min-width:7.5em; font-variant-numeric:tabular-nums; }
.oppgave .tittel { flex:1; font-weight:600; }
.rutenett { list-style:none; padding:0; display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:12px; }
.tabell { overflow-x:auto; }
table { width:100%; border-collapse:collapse; background:var(--kort); }
th, td { text-align:left; padding:8px; border-bottom:1px solid var(--linje); vertical-align:top; }
.tg { font-weight:700; }
.tg.TG2 { color:var(--varsel); } .tg.TG3 { color:var(--feil); } .tg.TG0, .tg.TG1 { color:var(--ok); }
button, .knapp { display:inline-block; background:var(--aksent); color:#fff; border:0; border-radius:6px; padding:8px 14px; font:inherit; text-decoration:none; cursor:pointer; }
.knapp.liten { padding:2px 10px; font-size:.85em; }
.lenkeknapp { background:none; color:var(--aksent); padding:0 0 0 8px; }
input, select, textarea { width:100%; padding:8px; font:inherit; border:1px solid var(--linje); border-radius:6px; background:var(--bg); color:var(--tekst); }
code { word-break:break-all; }
.viktig { font-size:.75em; font-weight:700; color:#fff; background:var(--feil); border-radius:4px; padding:1px 6px; vertical-align:middle; }
.kat { font-size:.75em; font-weight:700; border-radius:4px; padding:1px 6px; border:1px solid currentColor; }
.kat.fdv { color:var(--ok); } .kat.spenn { color:var(--aksent); } .kat.anslag { color:var(--varsel); }