/* E-243 (#268): driftssiden. Egen side og eget bygg. Fra prototypen «Drift side». */
:root{--bg:#F3F4F1;--flate:#FFF;--linje:#DCE1DD;--tekst:#1B2420;--svak:#56635D;--topp:#1B2420;--topp-t:#F3F4F1;--topp-s:#AEBBB4;--aksent:#1F6B4F;--aksent-t:#FFF;--aksent-b:#E2F0E8;--aksent-d:#164F3A;--varsel:#B45309;--varsel-b:#FBEEDD;--varsel-d:#7A3604;--feil:#B42318;--feil-b:#FBEDEB;--feil-d:#8E1B12;color-scheme:light}
@media (prefers-color-scheme:dark){:root{--bg:#111714;--flate:#19211D;--linje:#2D3933;--tekst:#E5EBE7;--svak:#A2AFA8;--topp:#0B100E;--topp-t:#E5EBE7;--topp-s:#9DABA4;--aksent:#43A77F;--aksent-t:#0B100E;--aksent-b:#1C3529;--aksent-d:#9ADBBD;--varsel:#E59A4E;--varsel-b:#352715;--varsel-d:#F4C58F;--feil:#F07C70;--feil-b:#381D1A;--feil-d:#F8B2A9;color-scheme:dark}}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--tekst);font:16px/1.45 system-ui,-apple-system,"Segoe UI",sans-serif}
h1,h2,h3{margin:0;font-weight:600}h1{font-size:22px}h2{font-size:18px}h3{font-size:16px}
button,input{font:inherit}
:focus-visible{outline:3px solid var(--aksent);outline-offset:2px}
.topp{display:flex;flex-wrap:wrap;align-items:center;gap:4px 16px;background:var(--topp);color:var(--topp-t);padding:0 max(16px,env(safe-area-inset-left))}
.merke{font-weight:600;min-height:52px;display:flex;align-items:center}
.faner{display:flex;gap:2px;overflow-x:auto;flex:1 1 auto;min-width:0;order:3;flex-basis:100%}
@media (min-width:760px){.faner{order:0;flex-basis:auto}}
.faner[hidden]{display:none}
.faner button{background:none;border:0;border-bottom:3px solid transparent;color:var(--topp-s);min-height:48px;padding:0 12px;cursor:pointer;white-space:nowrap}
.faner button[aria-current="page"]{color:var(--topp-t);border-bottom-color:var(--aksent);font-weight:600}
.hvem{margin-left:auto;color:var(--topp-s);font-size:14px;display:flex;align-items:center;gap:8px}
.lenke{background:none;border:0;color:inherit;text-decoration:underline;cursor:pointer;min-height:44px;padding:0 4px}
.vis{max-width:1120px;margin:0 auto;padding:20px 16px 56px;display:flex;flex-direction:column;gap:16px;outline:0}
.kort{background:var(--flate);border:1px solid var(--linje);border-radius:12px;padding:16px;min-width:0}
.smal{max-width:440px;margin:24px auto;width:100%}
.stakk{display:flex;flex-direction:column;gap:12px}
.rad{display:flex;flex-wrap:wrap;gap:8px 12px;align-items:center}
.mellom{justify-content:space-between}
.svak{color:var(--svak);font-size:14px}
.tall{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.tall b{display:block;font-size:26px;font-weight:600;font-variant-numeric:tabular-nums}
.tall .kort{padding:12px}
@media (max-width:480px){.tall b{font-size:20px}}
.post{padding:12px 0;border-top:1px solid var(--linje);display:flex;flex-wrap:wrap;gap:6px 12px;align-items:center;justify-content:space-between}
.post:first-of-type{border-top:0}
.post>div{min-width:0;flex:1 1 240px;overflow-wrap:anywhere}
.knapp{border:1px solid var(--linje);background:var(--flate);color:var(--tekst);border-radius:10px;min-height:44px;padding:0 16px;font-weight:600;cursor:pointer}
.knapp.hoved{background:var(--aksent);border-color:var(--aksent);color:var(--aksent-t)}
.knapp[disabled]{opacity:.6;cursor:default}
label{display:flex;flex-direction:column;gap:4px;font-size:14px;color:var(--svak)}
input{font-size:16px;color:var(--tekst);background:var(--flate);border:1px solid var(--linje);border-radius:10px;min-height:44px;padding:8px 12px;width:100%}
.merkelapp{display:inline-block;border-radius:999px;padding:2px 10px;font-size:13px;font-weight:600}
.merkelapp.feil{background:var(--feil-b);color:var(--feil-d)}.merkelapp.varsel{background:var(--varsel-b);color:var(--varsel-d)}.merkelapp.ok{background:var(--aksent-b);color:var(--aksent-d)}
.melding{border-radius:10px;padding:10px 12px;font-size:14px;background:var(--feil-b);color:var(--feil-d)}
.melding.ok{background:var(--aksent-b);color:var(--aksent-d)}
.melding:empty{display:none}
.kode{font-family:ui-monospace,Menlo,monospace;font-size:13px;overflow-wrap:anywhere}
.qr{background:#FFF;border-radius:8px;padding:8px;width:208px;height:208px;display:block}
.helbredde{flex-basis:100%}
.vokser{flex:1 1 200px}