/* Semantic theme layer. Layout and interactions remain in site.css. Every
   foreground/background pairing below is checked by internal/tema. */
html, body { background:var(--t-kort); color:var(--t-tekst); color-scheme:light; }
a { color:var(--t-primar-tekst); }
.muted { color:var(--t-dempet); }
.sec.lys { background:var(--t-flate); }
.sec.salvie { background:var(--t-flate-tonet); }
.sec.krem { background:var(--t-aksent-myk); }
.kort,.ramme,.merkekort { background:var(--t-kort); border-color:var(--t-kant); border-radius:var(--t-radius); box-shadow:var(--t-skygge); color:var(--t-tekst); }
.varsel,.ferdig,.poeng-dialog .eksempel { background:var(--t-aksent-myk); border-color:var(--t-aksent); border-radius:var(--t-radius-kontroll); color:var(--t-tekst); }
.\!ferdig { background:var(--t-aksent-myk)!important; border-color:var(--t-aksent)!important; }
.tomt { border-color:var(--t-kant-stiplet); background:var(--t-flate-svak); color:var(--t-svak); border-radius:var(--t-radius); }
.tekstlenke,.regnestykke .sum,.ferdig .regnestykke { border-color:var(--t-aksent); }
.\!ferdig .regnestykke { border-color:var(--t-aksent)!important; }
.regnestykke .merknad { color:var(--t-aksent-mork); }
.btn { background:var(--t-aksent); border-color:var(--t-aksent); color:var(--t-aksent-pa); border-radius:var(--t-radius-kontroll); }
.btn:hover { filter:brightness(.95); }
.btn.ghost { color:var(--t-primar-pa); border-color:var(--t-aksent-pa-primar); }
.btn.outline { color:var(--t-tekst); border-color:var(--t-tekst); }
.felt .hjelp { color:var(--t-dempet); }
input[type=email],input[type=number],input[type=text],select { background:var(--t-kort); color:var(--t-tekst); border-color:var(--t-kant-sterk); border-radius:var(--t-radius-kontroll); }
input::placeholder,textarea::placeholder { color:var(--t-plassholder); }
input:focus,select:focus { outline-color:var(--t-primar-tekst); border-color:var(--t-primar-tekst); }
.appbar { background:var(--t-primar); color:var(--t-primar-pa); }
.appbar .logo { display:flex; align-items:center; gap:18px; color:var(--t-primar-pa); }
.appbar .ordmerke { color:var(--t-primar-pa-dempet); font-weight:700; letter-spacing:.2em; font-size:12px; text-transform:uppercase; }
/* The logo is inlined into the app bar, so its currentColor artwork takes the
   validated on-primary foreground and the wordmark keeps the page webfont. */
.theme-logo { display:block; height:var(--t-logo-hoyde); color:var(--t-primar-pa); }
.theme-logo svg { display:block; height:100%; width:auto; }
.theme-grid { color:var(--t-primar-pa); width:22px; height:22px; flex-shrink:0; }
.appbar nav a,.appbar .meny-liste a,.appbar .meny-liste button { color:var(--t-primar-pa-dempet); }
.appbar nav a:hover,.appbar nav a.aktiv { color:var(--t-primar-pa-sterk); }
.appbar nav a.aktiv { box-shadow:inset 0 -2px 0 var(--t-aksent-pa-primar); }
.appbar .navn,.avatar { background:var(--t-aksent); color:var(--t-aksent-pa); }
.appbar .meny summary:focus-visible { outline-color:var(--t-aksent-pa-primar); }
.appbar .meny summary.aktiv,.appbar .meny[open] summary { box-shadow:0 0 0 2px var(--t-primar),0 0 0 4px var(--t-aksent-pa-primar); }
.appbar .meny-liste { background:var(--t-primar); border-color:rgb(var(--t-primar-pa-rgb) / .18); border-radius:var(--t-radius-kontroll); }
@media(max-width:640px) { .appbar .meny-liste { border-color:var(--t-aksent-pa-primar); } }
.appbar .meny-liste a:focus-visible,.appbar .meny-liste a:hover,.appbar .meny-liste button:focus-visible,.appbar .meny-liste button:hover { background:var(--t-primar-mork); color:var(--t-primar-pa-sterk); }
.appbar .meny-liste a.aktiv { color:var(--t-primar-pa-sterk); box-shadow:inset 3px 0 0 var(--t-aksent-pa-primar); }
.auth-background { background:var(--t-primar); min-height:74vh; display:flex; align-items:center; width:100%; }
.auth-card { max-width:470px; margin:0 auto; background:var(--t-kort); padding:44px 40px; border-radius:var(--t-radius); box-shadow:var(--t-skygge); }
.theme-kicker { font-size:12px; letter-spacing:.24em; text-transform:uppercase; color:var(--t-kicker); font-weight:700; }
.sud { border-color:var(--t-primar-tekst); background:var(--t-primar-tekst); }
.sud .c { background:var(--t-kort); color:var(--t-primar-tekst); }
.sud .c.gitt { background:var(--t-flate-tonet); color:var(--t-primar-tekst); }
.sud .c.rel:not(.feil) { background:var(--t-aksent-rel); }
.sud .c.lik:not(.feil) { background:var(--t-aksent-lik); }
.sud .c.valgt:not(.feil) { background:var(--t-valgt); }
.sud .c.\!valgt:not(.feil) { background:var(--t-valgt)!important; }
.sud .c.valgt { outline-color:var(--t-primar-tekst); }
.sud .c.\!valgt { outline-color:var(--t-primar-tekst)!important; }
.sud .c.feil { color:var(--t-feil); background:var(--t-feil-bg); }
.sud .c:nth-child(3n),.sud .c.rad3 { border-color:var(--t-primar-tekst); }
.sud .c.bolge:after { background:var(--t-valgt); }
.tastatur button { background:var(--t-kort); color:var(--t-primar-tekst); border-color:var(--t-kant-sterk); border-radius:var(--t-radius-kontroll); }
.tastatur button:hover { border-color:var(--t-primar-tekst); background:var(--t-flate); }
.tastatur button.slett { color:var(--t-svak); }
.tastatur button.full,.tastatur button:disabled,.tastatur button.full:hover,.tastatur button:disabled:hover { color:var(--t-svak); background:var(--t-flate); border-color:var(--t-kant-sterk); }
.spillmeta .stor,.stort { color:var(--t-primar-tekst); }
.spillmeta .lbl { color:var(--t-svak); }
.feiring { color:var(--t-primar-pa); background:rgb(var(--t-primar-mork-rgb) / .82); }
.feiring .lbl { color:var(--t-aksent-pa-primar); }
.feiring .poeng,.feiring .hint { color:var(--t-primar-pa-dempet); }
.feiring .poeng .verdi { color:var(--t-primar-pa); }
.feiring:focus-visible { outline-color:var(--t-aksent-pa-primar); }
table.tab { background:var(--t-kort); border-color:var(--t-kant); border-radius:var(--t-radius); }
table.tab th { color:var(--t-svak); }
table.tab td,table.tab th { border-color:var(--t-kant); }
table.tab tr.meg { background:var(--t-aksent-myk); }
.plass { color:var(--t-dempet); }
.plass.p1 { color:var(--t-plass-1); }
.plass.p2 { color:var(--t-plass-2); }
.plass.p3 { color:var(--t-plass-3); }
.piller button { background:var(--t-kort); border-color:var(--t-kant-sterk); color:var(--t-tekst); border-radius:calc(var(--t-radius-kontroll) * 4); }
.piller button:hover { border-color:var(--t-primar-tekst); }
.piller button.pa { background:var(--t-primar-tekst); border-color:var(--t-primar-tekst); color:var(--t-kort); }
.piller button .ant,.piller button.pa .ant { opacity:1; }
.poeng-knapp { color:var(--t-primar-tekst); text-decoration-color:var(--t-aksent); }
.poeng-knapp:hover { text-decoration-color:var(--t-primar-tekst); }
.poeng-knapp:focus-visible { outline-color:var(--t-primar-tekst); }
dialog.poeng-dialog::backdrop { background:rgb(var(--t-primar-rgb) / .72); }
.poeng-dialog .poeng-innhold { background:var(--t-kort); color:var(--t-tekst); border-color:var(--t-aksent); border-radius:var(--t-radius); }
.poeng-dialog h3,.poeng-dialog li b,.merke-navn { color:var(--t-primar-tekst); }
.merkekort:hover { border-color:var(--t-kant-stiplet); }
.merkekort:focus-visible { outline-color:var(--t-primar-tekst); border-color:var(--t-primar-tekst); }
.merke-antall,.merke-dialog #merke-krav { color:var(--t-aksent-mork); }
.merke-krav,.merkekort.laast .merke-navn { color:var(--t-svak); }
.merkekort.oppnadd .merke-ikon,.merke-dialog .merke-stor.oppnadd .merke-ikon { color:var(--t-aksent); }
.merkekort.oppnadd .merke-ikon text,.merke-dialog .merke-stor.oppnadd .merke-ikon text { fill:var(--t-aksent-pa); }
.merkekort.laast { background:var(--t-flate-svak); }
.merkekort.laast .merke-ikon,.merke-dialog .merke-stor.laast .merke-ikon { color:var(--t-merke-laast); }
.merkekort.laast .merke-ikon text,.merke-dialog .merke-stor.laast .merke-ikon text { fill:var(--t-merke-laast-tekst); }
.merke { background:var(--t-aksent-myk); color:var(--t-primar-tekst); border-color:var(--t-aksent); }
@media(max-width:480px) { .appbar .theme-grid + .ordmerke { display:block; font-size:11px; } .appbar .logo { gap:10px; } }
@media(prefers-reduced-motion:reduce) { .sud .c { transition:none; } }