/* Life Organizer – designsystem (lys/mørk, tokens, komponenter) */
:root{
  --a:#6B1D6B;
  --accent-fyll:#6B1D6B; --accent-fyll-hover:#561656; --accent:#6B1D6B; --accent-soft:#f3e8f3;
  --bg:#eef0f3; --panel:#ffffff; --felt:#ffffff; --knapp:#ffffff;
  --ink:#1d2330; --muted:#677184; --line:#dde1e7; --line-strong:#cdd3db; --hover:#f5f6f8; --kant-hover:#b7bfca;
  --ok:#1f9d55; --ok-soft:#e6f6ec; --warn:#8a5a00; --warn-soft:#fff6e5; --err:#c0392b; --err-soft:#fdecea; --busy:#e6a100;
  --danger-kant:#f0c4bf; --bryter-av:#cdd3db; --prikk-av:#b7bfca;
  --note-bg:#f2f4f7; --tom-bg:#f3f5f8; --gra-bg:#eef0f3;
  --toast-bg:#1d2330; --toast-ink:#fff; --scrim:rgba(15,20,30,.45); --skygge:rgba(15,20,30,.18); --shadow:0 6px 16px rgba(15,20,30,.08);
  --fs:15px; --tett:1; --r-kort:12px; --r-knapp:9px; --meny-b:236px; --topp-h:60px;
  --font:"Segoe UI", system-ui, -apple-system, Roboto, Arial, sans-serif;
  --mono:ui-monospace, "Cascadia Mono", "SF Mono", Menlo, Consolas, monospace;
  color-scheme:light;
}
:root[data-tema="mork"]{
  --accent-fyll:#7e2b7e; --accent-fyll-hover:#943594; --accent:#d7a2d7; --accent-soft:#3a2340;
  --bg:#13161c; --panel:#1b1f27; --felt:#12151b; --knapp:#232934;
  --ink:#e7eaf0; --muted:#9ba4b3; --line:#2b313c; --line-strong:#3a4250; --hover:#232934; --kant-hover:#4a5262;
  --ok:#43d184; --ok-soft:#14321f; --warn:#f0b955; --warn-soft:#352a12; --err:#ff7466; --err-soft:#3b1a18; --busy:#f0b955;
  --danger-kant:#6b2a24; --bryter-av:#3a4250; --prikk-av:#545d6c;
  --note-bg:#232934; --tom-bg:#20252e; --gra-bg:#262c37;
  --toast-bg:#e7eaf0; --toast-ink:#13161c; --scrim:rgba(0,0,0,.6); --skygge:rgba(0,0,0,.5); --shadow:0 6px 16px rgba(0,0,0,.4);
  color-scheme:dark;
}
@media (prefers-color-scheme:dark){
  :root:not([data-tema="lys"]){
    --accent-fyll:#7e2b7e; --accent-fyll-hover:#943594; --accent:#d7a2d7; --accent-soft:#3a2340;
    --bg:#13161c; --panel:#1b1f27; --felt:#12151b; --knapp:#232934;
    --ink:#e7eaf0; --muted:#9ba4b3; --line:#2b313c; --line-strong:#3a4250; --hover:#232934; --kant-hover:#4a5262;
    --ok:#43d184; --ok-soft:#14321f; --warn:#f0b955; --warn-soft:#352a12; --err:#ff7466; --err-soft:#3b1a18; --busy:#f0b955;
    --danger-kant:#6b2a24; --bryter-av:#3a4250; --prikk-av:#545d6c;
    --note-bg:#232934; --tom-bg:#20252e; --gra-bg:#262c37;
    --toast-bg:#e7eaf0; --toast-ink:#13161c; --scrim:rgba(0,0,0,.6); --skygge:rgba(0,0,0,.5); --shadow:0 6px 16px rgba(0,0,0,.4);
    color-scheme:dark;
  }
}
/* Egen aksentfarge (Innstillinger → Utseende) */
:root[data-aksent]{
  --accent-fyll:var(--a); --accent-fyll-hover:color-mix(in srgb,var(--a) 80%,#000);
  --accent:var(--a); --accent-soft:color-mix(in srgb,var(--a) 11%,#fff);
}
:root[data-aksent][data-tema="mork"]{
  --accent-fyll:color-mix(in srgb,var(--a) 85%,#fff); --accent-fyll-hover:color-mix(in srgb,var(--a) 72%,#fff);
  --accent:color-mix(in srgb,var(--a) 42%,#fff); --accent-soft:color-mix(in srgb,var(--a) 30%,#13161c);
}
@media (prefers-color-scheme:dark){
  :root[data-aksent]:not([data-tema="lys"]){
    --accent-fyll:color-mix(in srgb,var(--a) 85%,#fff); --accent-fyll-hover:color-mix(in srgb,var(--a) 72%,#fff);
    --accent:color-mix(in srgb,var(--a) 42%,#fff); --accent-soft:color-mix(in srgb,var(--a) 30%,#13161c);
  }
}
:root[data-tetthet="kompakt"]{--tett:.72}
:root[data-tetthet="luftig"]{--tett:1.3}
:root[data-hjorner="skarpe"]{--r-kort:4px;--r-knapp:3px}
:root[data-hjorner="runde"]{--r-kort:18px;--r-knapp:14px}
:root[data-animasjon="av"] *{transition:none!important;animation:none!important}

*{box-sizing:border-box}
html{font-size:var(--fs);-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:1rem/1.45 var(--font);min-height:100vh}
a{color:var(--accent)}
h1,h2,h3{margin:0}
svg{display:block}
.skjult{display:none!important}
.mono{font-family:var(--mono)}
.muted{color:var(--muted)}
.liten-tekst{font-size:.85em}
::selection{background:var(--accent-soft)}

/* ---------- Toppfelt ---------- */
.oc-topp{position:sticky;top:0;z-index:30;display:flex;align-items:center;gap:12px;height:var(--topp-h);padding:0 16px;
  background:var(--panel);border-bottom:1px solid var(--line)}
.oc-merke{display:flex;align-items:center;gap:10px;color:var(--ink);text-decoration:none;min-width:0}
.oc-merke .symbol{width:34px;height:34px;border-radius:10px;background:var(--accent-fyll);color:#fff;display:grid;place-items:center;flex:none}
.oc-merke .symbol svg{width:20px;height:20px}
.oc-titler{display:flex;flex-direction:column;min-width:0}
.oc-titler h1{font-size:17px;font-weight:650;white-space:nowrap}
.oc-titler span{font-size:12px;color:var(--muted);white-space:nowrap}
.oc-hoyre{margin-left:auto;display:flex;align-items:center;gap:8px}
#menyKnapp{display:none}

/* Lys/mørk-bryter */
.oc-tema{position:relative;flex:none;width:58px;height:30px;min-height:30px;padding:0;border-radius:15px;border:1px solid var(--line-strong);background:var(--gra-bg);cursor:pointer;display:inline-flex;align-items:center;justify-content:space-between}
.oc-tema::before{content:"";position:absolute;top:2px;left:2px;width:24px;height:24px;border-radius:50%;background:var(--panel);box-shadow:0 1px 3px var(--skygge);transition:left .2s}
.oc-tema[aria-checked="true"]::before{left:30px;background:var(--accent-fyll)}
.oc-tema span{position:relative;z-index:1;width:28px;display:flex;align-items:center;justify-content:center;color:var(--muted);transition:color .2s}
.oc-tema svg{width:15px;height:15px}
.oc-tema[aria-checked="false"] .oc-tema-sol{color:var(--warn)}
.oc-tema[aria-checked="true"] .oc-tema-maane{color:#fff}
.oc-tema:hover{border-color:var(--kant-hover)}
.oc-tema:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

/* ---------- Ramme med meny til venstre ---------- */
.oc-ramme{display:flex;min-height:calc(100vh - var(--topp-h))}
.oc-meny{width:var(--meny-b);flex:none;background:var(--panel);border-right:1px solid var(--line);padding:12px 10px;
  position:sticky;top:var(--topp-h);height:calc(100vh - var(--topp-h));overflow:auto;display:flex;flex-direction:column;gap:2px}
.oc-meny .gruppe{font-size:11px;font-weight:650;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);padding:12px 10px 6px}
.oc-meny a{display:flex;align-items:center;gap:12px;padding:calc(9px*var(--tett)) 10px;border-radius:var(--r-knapp);color:var(--ink);
  text-decoration:none;font-weight:550;min-height:40px;white-space:nowrap}
.oc-meny a svg{width:20px;height:20px;flex:none;color:var(--muted)}
.oc-meny a:hover{background:var(--hover)}
.oc-meny a.valgt{background:var(--accent-soft);color:var(--accent)}
.oc-meny a.valgt svg{color:var(--accent)}
.oc-meny .fot{margin-top:auto;padding:10px;font-size:12px;color:var(--muted)}
.oc-meny .skille{height:1px;background:var(--line);margin:8px 6px}
:root[data-meny="kompakt"]{--meny-b:68px}
:root[data-meny="kompakt"] .oc-meny .tekst,:root[data-meny="kompakt"] .oc-meny .gruppe,:root[data-meny="kompakt"] .oc-meny .fot{display:none}
:root[data-meny="kompakt"] .oc-meny a{justify-content:center;padding-left:0;padding-right:0}
.oc-innhold{flex:1;min-width:0;padding:calc(24px*var(--tett)) calc(24px*var(--tett)) 48px}
.oc-innhold > .side{max-width:1200px;margin:0 auto}
.scrim{display:none}

@media (max-width:860px){
  #menyKnapp{display:inline-flex}
  .oc-meny{position:fixed;left:0;top:var(--topp-h);z-index:40;transform:translateX(-105%);transition:transform .2s;width:260px;box-shadow:var(--shadow)}
  :root[data-meny="kompakt"] .oc-meny .tekst,:root[data-meny="kompakt"] .oc-meny .gruppe{display:revert}
  :root[data-meny="kompakt"] .oc-meny a{justify-content:flex-start;padding-left:10px}
  body.meny-apen .oc-meny{transform:none}
  body.meny-apen .scrim{display:block;position:fixed;inset:var(--topp-h) 0 0 0;background:var(--scrim);z-index:35}
  .oc-innhold{padding:16px 16px 40px}
}
@media (max-width:480px){.oc-titler span{display:none}}

/* ---------- Sidehode, rutenett ---------- */
.oc-sidehode{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:calc(18px*var(--tett))}
.oc-sidehode h2{font-size:22px;font-weight:650}
.oc-sidehode .btns{margin-left:auto}
.oc-sidehode p{margin:2px 0 0;color:var(--muted)}
.stack{display:flex;flex-direction:column;gap:calc(16px*var(--tett))}
.oc-rutenett{display:grid;gap:calc(16px*var(--tett));grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}
.oc-to{display:grid;gap:calc(16px*var(--tett));grid-template-columns:1fr}
@media (min-width:900px){.oc-to{grid-template-columns:minmax(0,2fr) minmax(0,1fr)}}

/* ---------- Kort ---------- */
.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--r-kort);padding:calc(18px*var(--tett))}
.card h2{font-size:12px;font-weight:650;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin:0 0 calc(12px*var(--tett));display:flex;align-items:center;gap:8px}
.card h2 .hoyre{margin-left:auto;text-transform:none;letter-spacing:0}
.card > p:first-of-type{margin-top:0}

/* ---------- Knapper ---------- */
button,.knapp{font:inherit;font-weight:550;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:40px;
  padding:0 calc(14px*var(--tett) + 2px);border-radius:var(--r-knapp);border:1px solid var(--line-strong);background:var(--knapp);color:var(--ink);
  cursor:pointer;text-decoration:none;white-space:nowrap;transition:background .15s,border-color .15s}
button:hover,.knapp:hover{border-color:var(--kant-hover);background:var(--hover)}
button:focus-visible,.knapp:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
button:disabled{opacity:.55;cursor:not-allowed}
button svg,.knapp svg{width:18px;height:18px;flex:none}
.primary{background:var(--accent-fyll);border-color:var(--accent-fyll);color:#fff}
.primary:hover{background:var(--accent-fyll-hover);border-color:var(--accent-fyll-hover)}
.ghost{background:transparent;border-color:transparent}
.ghost:hover{background:var(--hover);border-color:transparent}
.danger{color:var(--err);border-color:var(--danger-kant)}
.danger:hover{background:var(--err-soft);border-color:var(--err)}
.danger.fylt{background:var(--err);border-color:var(--err);color:#fff}
.liten{min-height:32px;padding:0 10px;font-size:.9em}
.ikon{width:40px;padding:0}
.ikon.liten{width:32px;min-height:32px}
.btns{display:flex;gap:8px;flex-wrap:wrap;align-items:center}

/* ---------- Skjema ---------- */
.field{display:flex;flex-direction:column;gap:6px;margin-bottom:calc(14px*var(--tett))}
.field > label,.field > .etikett{font-size:13px;font-weight:600;color:var(--muted)}
.field .hjelp{font-size:12.5px;color:var(--muted)}
input,select,textarea{font:inherit;font-size:16px;color:var(--ink);background:var(--felt);border:1px solid var(--line-strong);border-radius:var(--r-knapp);
  padding:9px 12px;min-height:42px;width:100%;transition:border-color .15s}
textarea{min-height:90px;resize:vertical;line-height:1.4}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
input[type="checkbox"],input[type="radio"]{width:auto;min-height:auto;accent-color:var(--accent-fyll)}
input[type="color"]{padding:3px;width:52px;cursor:pointer}
.row{display:flex;gap:12px;flex-wrap:wrap}
.row > *{flex:1;min-width:140px}
/* Felt med knapper inni (kopier, vis, åpne) */
.felt-gruppe{display:flex;align-items:stretch;border:1px solid var(--line-strong);border-radius:var(--r-knapp);background:var(--felt);overflow:hidden}
.felt-gruppe:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.felt-gruppe input,.felt-gruppe textarea{border:0;border-radius:0;box-shadow:none!important;background:transparent;min-width:0;flex:1}
.felt-gruppe button{border:0;border-left:1px solid var(--line);border-radius:0;min-height:auto;width:44px;padding:0;background:transparent;color:var(--muted)}
.felt-gruppe button:hover{background:var(--hover);color:var(--accent)}
.felt-gruppe.tekstfelt{align-items:stretch}
.felt-gruppe.tekstfelt button{align-self:stretch}

/* Av/på-bryter */
.switch{position:relative;display:inline-flex;align-items:center;gap:10px;cursor:pointer;user-select:none;min-height:40px}
.switch input{position:absolute;opacity:0;width:1px;height:1px}
.switch .spor{width:42px;height:24px;border-radius:12px;background:var(--bryter-av);position:relative;flex:none;transition:background .2s}
.switch .spor::after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 1px 2px var(--skygge);transition:left .2s}
.switch input:checked + .spor{background:var(--accent-fyll)}
.switch input:checked + .spor::after{left:21px}
.switch input:focus-visible + .spor{outline:2px solid var(--accent);outline-offset:2px}

/* Valgknapper (segmentert) */
.valg{display:inline-flex;flex-wrap:wrap;border:1px solid var(--line-strong);border-radius:var(--r-knapp);overflow:hidden;background:var(--felt)}
.valg button{border:0;border-radius:0;min-height:38px;background:transparent;border-right:1px solid var(--line)}
.valg button:last-child{border-right:0}
.valg button[aria-pressed="true"]{background:var(--accent-soft);color:var(--accent)}

/* ---------- Status, merker, meldinger ---------- */
.status{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:var(--muted)}
.dot{width:9px;height:9px;border-radius:50%;background:var(--prikk-av);flex:none}
.dot.on{background:var(--ok)} .dot.err{background:var(--err)}
.dot.busy{background:var(--busy);animation:puls 1.2s infinite}
@keyframes puls{50%{opacity:.35}}
.note{background:var(--note-bg);border-radius:var(--r-knapp);padding:10px 14px;font-size:.93em;line-height:1.45}
.note.warn{background:var(--warn-soft);color:var(--warn)}
.note.err{background:var(--err-soft);color:var(--err)}
.note.ok{background:var(--ok-soft);color:var(--ok)}
.badge{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border-radius:20px;font-size:12px;font-weight:600;background:var(--accent-soft);color:var(--accent);white-space:nowrap}
.badge.gra{background:var(--gra-bg);color:var(--muted)}
.badge.ok{background:var(--ok-soft);color:var(--ok)}
.badge.warn{background:var(--warn-soft);color:var(--warn)}
.tom{background:var(--tom-bg);border:1px dashed var(--line-strong);border-radius:var(--r-kort);padding:36px 20px;text-align:center;color:var(--muted)}
.tom svg{width:40px;height:40px;margin:0 auto 10px;color:var(--muted);opacity:.8}
.tom b{display:block;color:var(--ink);font-size:1.05em;margin-bottom:4px}
.tom .btns{justify-content:center;margin-top:14px}

/* ---------- Lister og tabeller ---------- */
.liste{display:flex;flex-direction:column}
.linje{display:flex;align-items:center;gap:12px;padding:calc(11px*var(--tett)) 12px;border-bottom:1px solid var(--line);min-height:52px}
.linje:last-child{border-bottom:0}
.linje.klikkbar{cursor:pointer;border-radius:var(--r-knapp)}
.linje.klikkbar:hover{background:var(--hover)}
.linje .hoved{flex:1;min-width:0}
.linje .tittel{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.linje .under{font-size:13px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tabell-ramme{overflow:auto;border:1px solid var(--line);border-radius:var(--r-kort)}
table.tabell{width:100%;border-collapse:collapse;font-size:14px}
.tabell th{text-align:left;font-size:12px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);font-weight:650;padding:10px 12px;border-bottom:1px solid var(--line);background:var(--panel)}
.tabell td{padding:10px 12px;border-bottom:1px solid var(--line)}
.tabell tr:last-child td{border-bottom:0}

.avatar{width:38px;height:38px;border-radius:10px;background:var(--accent-soft);color:var(--accent);display:grid;place-items:center;font-weight:700;flex:none;text-transform:uppercase;font-size:15px}
.avatar.stor{width:52px;height:52px;font-size:20px;border-radius:14px}

.faner{display:flex;gap:4px;border-bottom:1px solid var(--line);margin-bottom:calc(18px*var(--tett));overflow-x:auto}
.faner a{padding:10px 14px;color:var(--muted);text-decoration:none;font-weight:600;border-bottom:2px solid transparent;margin-bottom:-1px;white-space:nowrap;cursor:pointer}
.faner a:hover{color:var(--ink)}
.faner a.valgt{color:var(--accent);border-bottom-color:var(--accent)}

/* Søkefelt */
.sok{position:relative;flex:1;min-width:200px}
.sok svg{position:absolute;left:12px;top:50%;transform:translateY(-50%);width:18px;height:18px;color:var(--muted);pointer-events:none}
.sok input{padding-left:40px}

/* ---------- Dialog og toast ---------- */
.modal{position:fixed;inset:0;z-index:100;background:var(--scrim);display:flex;align-items:center;justify-content:center;padding:16px;animation:inn .15s}
.modal .box{background:var(--panel);border:1px solid var(--line);border-radius:var(--r-kort);width:100%;max-width:520px;max-height:calc(100vh - 32px);overflow:auto;box-shadow:var(--shadow)}
.modal .box.bred{max-width:860px}
.modal .box.full{max-width:1100px}
.modal .hode{display:flex;align-items:center;gap:10px;padding:16px 18px;border-bottom:1px solid var(--line);position:sticky;top:0;background:var(--panel);z-index:2}
.modal .hode h3{font-size:17px;font-weight:650;flex:1}
.modal .kropp{padding:18px}
.modal .fot{display:flex;gap:8px;justify-content:flex-end;flex-wrap:wrap;padding:14px 18px;border-top:1px solid var(--line);position:sticky;bottom:0;background:var(--panel)}
@keyframes inn{from{opacity:0}}
@media (max-width:600px){.modal{padding:0;align-items:flex-end}.modal .box{max-height:94vh;border-radius:var(--r-kort) var(--r-kort) 0 0}}
#toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%) translateY(20px);background:var(--toast-bg);color:var(--toast-ink);padding:11px 18px;border-radius:var(--r-knapp);
  font-weight:550;z-index:200;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;max-width:calc(100vw - 32px);box-shadow:var(--shadow);display:flex;gap:10px;align-items:center}
#toast.show{opacity:1;transform:translateX(-50%)}
#toast.err{background:var(--err);color:#fff}

/* ---------- Innlogging ---------- */
.inngang{min-height:calc(100vh - var(--topp-h));display:grid;place-items:center;padding:24px 16px}
.inngang .card{width:100%;max-width:420px;padding:28px}
.inngang .card h2.stor{font-size:22px;text-transform:none;letter-spacing:0;color:var(--ink);margin-bottom:6px}
.laster{display:grid;place-items:center;padding:60px;color:var(--muted)}
.spinner{width:28px;height:28px;border:3px solid var(--line);border-top-color:var(--accent);border-radius:50%;animation:snurr .8s linear infinite}
@keyframes snurr{to{transform:rotate(360deg)}}

/* Fargevelger-prikker */
.fargevalg{display:flex;gap:10px;flex-wrap:wrap}
.fargevalg button{width:36px;height:36px;min-height:36px;padding:0;border-radius:50%;border:2px solid var(--panel);box-shadow:0 0 0 1px var(--line-strong)}
.fargevalg button[aria-pressed="true"]{box-shadow:0 0 0 2px var(--ink)}

/* Styrkemåler for passord */
.styrke{height:6px;border-radius:3px;background:var(--gra-bg);overflow:hidden}
.styrke i{display:block;height:100%;width:0;transition:width .2s,background .2s}

.innstilling{display:flex;align-items:center;gap:16px;padding:calc(12px*var(--tett)) 0;border-bottom:1px solid var(--line);flex-wrap:wrap}
.innstilling:last-child{border-bottom:0}
.innstilling .tekst{flex:1;min-width:200px}
.innstilling .tekst b{display:block;font-weight:600}
.innstilling .tekst span{font-size:13px;color:var(--muted)}

/* Justeringer */
.card h2 button,.card h2 .knapp{font-size:14px;font-weight:550;letter-spacing:0;text-transform:none}
.oc-hoyre{flex:none}
#toppHoyre{flex-wrap:nowrap;gap:4px}
@media (max-width:480px){.oc-titler{display:none}.oc-topp{padding:0 10px;gap:8px}#toppHoyre .status{display:none}}
.kode-felt{font-family:var(--mono);font-size:24px;letter-spacing:.25em;text-align:center;min-height:52px}
.tf-steg{margin:0 0 16px;padding-left:20px;display:flex;flex-direction:column;gap:14px}
.tf-qr{margin:10px 0;display:flex;justify-content:center}
.tf-qr img{width:200px;height:200px;background:#fff;padding:8px;border-radius:var(--r-knapp);border:1px solid var(--line)}
.tf-koder{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;font-size:16px}
.tf-koder span{background:var(--note-bg);border-radius:var(--r-knapp);padding:8px 10px;text-align:center}
#toast.med-knapper{pointer-events:auto;flex-wrap:wrap;justify-content:center}
.toast-knapp{min-height:32px;padding:0 12px;font-size:.9em;background:transparent;color:inherit;border-color:currentColor;opacity:.95}
.toast-knapp:hover{background:rgba(127,127,127,.2);border-color:currentColor}

/* ---------- Skjemafelt: lik visning i alle nettlesere (særlig iPhone/Safari) og ingen overlapp ---------- */
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]),select,textarea{
  -webkit-appearance:none;appearance:none;display:block;min-width:0;max-width:100%;line-height:1.3}
input[type="search"]::-webkit-search-decoration,input[type="search"]::-webkit-search-cancel-button{-webkit-appearance:none}
input[type="date"],input[type="time"]{min-height:42px;text-align:left}
input[type="date"]::-webkit-date-and-time-value{text-align:left;min-height:1.3em}
input[type="date"]::-webkit-calendar-picker-indicator{opacity:.65;cursor:pointer}
:root[data-tema="mork"] input[type="date"]::-webkit-calendar-picker-indicator{filter:invert(1)}
@media (prefers-color-scheme:dark){:root:not([data-tema="lys"]) input[type="date"]::-webkit-calendar-picker-indicator{filter:invert(1)}}
select{padding-right:36px;background-repeat:no-repeat;background-position:right 12px center;background-size:14px;cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23677184' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E")}
:root[data-tema="mork"] select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239ba4b3' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E")}
@media (prefers-color-scheme:dark){:root:not([data-tema="lys"]) select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239ba4b3' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E")}}
.field{margin-bottom:max(12px,calc(16px*var(--tett)))}
.field > label,.field > .etikett{line-height:1.25}
.field .styrke{margin-top:2px}
.row{column-gap:12px;row-gap:0}
.row > *{flex:1 1 140px;min-width:0}
.row > .smal{flex:0 0 112px}
.felt-gruppe input,.felt-gruppe textarea{width:auto}
.oc-to{grid-template-columns:minmax(0,1fr)}
@media (min-width:900px){.oc-to{grid-template-columns:minmax(0,2fr) minmax(0,1fr)}}
.innstilling > select,.innstilling > .valg,.innstilling > button{flex:none;max-width:100%}
.linje .hoved{overflow:hidden}
.modal .kropp{overflow-wrap:anywhere}
.card{min-width:0}