:root{
  --roed:#E00000;--moerk:#000333;--graa:#4A4A4A;--lys:#F7F5F2;--kant:#E8E2DB;--hvid:#fff;
  --groen:#2E6E52;--gul:#F6BC44;--blaa:#1F5FA8;--lilla:#6B3FA0;
  --font:-apple-system,"Segoe UI",Helvetica,Arial,sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--lys);color:var(--moerk);font:400 16px/1.6 var(--font)}
a{color:var(--roed)}
.top{background:var(--moerk);color:#fff;padding:12px 20px;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;position:sticky;top:0;z-index:20}
.top .maerke{display:flex;align-items:center;gap:10px;font-weight:700;color:#fff;text-decoration:none;font-size:15px}
.top .maerke .prik{width:11px;height:11px;border-radius:50%;background:var(--roed);flex:none}
.top .maerke small{font-weight:400;opacity:.7;margin-left:4px}
.top nav{display:flex;gap:4px;flex-wrap:wrap;align-items:center}
.top nav a{color:#fff;opacity:.75;text-decoration:none;font-size:14px;padding:6px 10px;border-radius:8px}
.top nav a:hover{opacity:1;background:rgba(255,255,255,.1)}
.top nav a.aktiv{opacity:1;background:rgba(255,255,255,.16)}
.gem-status{font-size:12px;color:rgba(255,255,255,.7);border:1px solid rgba(255,255,255,.3);border-radius:999px;padding:3px 10px;white-space:nowrap}
.gem-status.fejl{color:#fff;background:var(--roed);border-color:var(--roed)}
.skip{position:absolute;left:-9999px}.skip:focus{left:8px;top:8px;background:#fff;padding:8px;z-index:30;border-radius:8px}
.wrap{max-width:940px;margin:0 auto;padding:24px 16px 72px}
main:focus{outline:none}
.kort{background:var(--hvid);border:1px solid var(--kant);border-radius:16px;padding:24px;margin-bottom:16px}
.oejenbryn{font-size:12px;letter-spacing:.09em;text-transform:uppercase;color:var(--roed);margin:0 0 8px;font-weight:700}
h1{font-size:29px;line-height:1.18;margin:0 0 12px;font-weight:700}
h2{font-size:21px;line-height:1.25;margin:0 0 10px}
h3{font-size:17px;margin:22px 0 8px}
h4{font-size:15px;margin:0 0 8px}
p{margin:0 0 12px}
.lead{font-size:18px;color:var(--graa)}
.lille{font-size:13.5px;color:var(--graa)}
.maerkat{display:inline-block;font-size:11px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;padding:3px 9px;border-radius:999px;background:var(--lys);color:var(--graa);margin:0 0 8px}
.liste{margin:0 0 12px;padding-left:20px}.liste li{margin:0 0 6px}
.boks{background:var(--lys);border-radius:12px;padding:16px;margin:12px 0}
.hero{display:grid;grid-template-columns:1.35fr .95fr;gap:24px;align-items:start}
@media(max-width:760px){.hero{grid-template-columns:1fr}}
label{display:block;font-weight:600;margin:0 0 5px;font-size:14px}
input[type=text],input[type=date],textarea,select{width:100%;font:inherit;padding:10px 12px;border:1px solid var(--kant);border-radius:10px;background:#fff;color:var(--moerk)}
textarea{resize:vertical;min-height:52px}
input:focus,textarea:focus,select:focus{outline:2px solid var(--roed);outline-offset:1px;border-color:var(--roed)}
.felt{margin:0 0 14px}
.dato-vis{display:block;font-size:12.5px;color:var(--graa);margin-top:4px}
.med-knap{display:flex;gap:8px;align-items:center}
.celler{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:0 16px}
.gruppe{margin:14px 0}
.raekke-kort{border:1px solid var(--kant);border-radius:12px;padding:14px 16px 2px;margin:0 0 12px;background:#fff}
.raekke-kort h4{color:var(--moerk);font-size:15px;margin-bottom:10px}
.knap{display:inline-block;background:var(--roed);color:#fff;border:0;border-radius:10px;padding:12px 20px;font:700 15px var(--font);cursor:pointer;text-decoration:none}
.knap:hover{filter:brightness(.92)}
.knap.sekundaer{background:#fff;color:var(--moerk);border:1px solid var(--kant)}
.knap.fare{background:#fff;color:var(--roed);border:1px solid var(--roed)}
.knap.lille-knap{padding:7px 13px;font-size:13.5px}
.knap:disabled{opacity:.45;cursor:default}
.knapper{display:flex;gap:10px;flex-wrap:wrap;margin:16px 0 4px;align-items:center}
.besked{border-radius:12px;padding:13px 16px;margin:0 0 16px;font-size:14.5px;border:1px solid var(--kant);background:#fff}
.besked.info{background:#F2F7F4;border-color:#CBE0D4}
.besked.fejl{background:#FFF2F2;border-color:#F3C9C9;color:#8A1010;font-weight:600}
.besked.advarsel{background:#FFF9EC;border-color:#F0DFB4}
.feltfejl{color:#8A1010;font-weight:600;font-size:14px;margin:8px 0}
.paakraevet{color:var(--roed);font-weight:700}
.dele{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:14px;margin-bottom:16px}
.del-kort{background:#fff;border:1px solid var(--kant);border-radius:16px;padding:20px;text-decoration:none;color:var(--moerk);display:block}
.del-kort:hover{border-color:var(--moerk)}
.del-kort .nr{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--moerk);color:#fff;font-weight:800;margin-bottom:10px}
.del-kort strong{display:block;font-size:17px;margin-bottom:6px}
.del-kort p{color:var(--graa);font-size:14px;margin-bottom:10px}
.del-kort .status{font-size:12.5px;color:var(--roed);font-weight:700}
.fremdrift{height:6px;background:var(--kant);border-radius:3px;overflow:hidden;margin:4px 0 10px}
.fremdrift i{display:block;height:100%;background:var(--groen);transition:width .25s}
.gruppenav{display:flex;gap:6px;flex-wrap:wrap;margin:14px 0 18px}
.gruppenav a{font-size:13.5px;text-decoration:none;color:var(--moerk);border:1px solid var(--kant);border-radius:999px;padding:7px 13px;background:#fff}
.gruppenav a span{color:var(--graa);font-size:12px}
.gruppenav a.aktiv{background:var(--moerk);color:#fff;border-color:var(--moerk)}
.gruppenav a.aktiv span{color:rgba(255,255,255,.7)}
.udsagn{border:1px solid var(--kant);border-radius:12px;padding:14px 16px;margin:0 0 14px}
.udsagn legend{font-size:16px;padding:0 6px}
.udsagn legend .nr{color:var(--graa);font-size:12.5px;font-weight:700;margin-right:4px}
.skala{display:grid;grid-template-columns:repeat(6,1fr);gap:6px;margin-top:6px}
.skala label{display:flex;flex-direction:column;align-items:center;gap:3px;border:1px solid var(--kant);border-radius:10px;padding:9px 4px;cursor:pointer;margin:0;font-weight:400;text-align:center;background:#fff;min-height:64px;justify-content:center}
.skala label:hover{border-color:var(--moerk)}
.skala label.valgt{background:var(--moerk);color:#fff;border-color:var(--moerk)}
.skala label .tal{font-weight:800;font-size:17px}
.skala label .tekst{font-size:10.5px;line-height:1.25;color:var(--graa)}
.skala label.valgt .tekst{color:rgba(255,255,255,.85)}
.skala input{position:absolute;opacity:0;width:1px;height:1px}
.skala label:focus-within{outline:2px solid var(--roed);outline-offset:2px}
@media(max-width:620px){.skala{grid-template-columns:repeat(3,1fr)}}
button.ryd{background:none;border:0;color:var(--graa);text-decoration:underline;cursor:pointer;font:inherit;font-size:13px;padding:6px 0 0}
.tjek{display:flex;gap:10px;align-items:flex-start;font-weight:500;margin:8px 0}
.tjek input{width:20px;height:20px;flex:none;margin-top:2px;accent-color:var(--roed)}
.tjek.stor{background:var(--lys);border-radius:10px;padding:12px 14px;font-weight:600}
.omraade-gitter{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:16px;margin-bottom:16px}
.omraade{margin:0}
.tal-raekke{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;margin:0 0 12px}
.tal-raekke div{background:var(--lys);border-radius:10px;padding:8px 4px;text-align:center}
.tal-raekke dt{font-size:11px;color:var(--graa);text-transform:uppercase;letter-spacing:.04em}
.tal-raekke dd{margin:2px 0 0;font-size:19px;font-weight:800;font-variant-numeric:tabular-nums}
.markeringer{list-style:none;padding:0;margin:0 0 10px}
.markeringer li{border-left:4px solid var(--kant);padding:2px 0 2px 12px;margin:0 0 10px;font-size:14.5px}
.markeringer li.energi{border-color:var(--groen)}
.markeringer li.behov{border-color:var(--roed)}
.markeringer li.reaktion{border-color:var(--gul)}
.markeringer li.rammer{border-color:var(--blaa)}
.tabel{width:100%;border-collapse:collapse;font-size:14.5px;margin:10px 0}
.tabel th,.tabel td{text-align:left;padding:9px 10px;border-bottom:1px solid var(--kant);vertical-align:top}
.tabel th{font-size:12px;letter-spacing:.05em;text-transform:uppercase;color:var(--graa)}
@media(max-width:620px){
  .tabel,.tabel thead,.tabel tbody,.tabel tr,.tabel td{display:block;width:100%}
  .tabel thead{display:none}
  .tabel tr{border:1px solid var(--kant);border-radius:10px;margin:0 0 10px;padding:6px 10px}
  .tabel td{border:0;padding:6px 0}
  .tabel td::before{content:attr(data-label);display:block;font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--graa)}
}
details{border:1px solid var(--kant);border-radius:12px;padding:12px 16px;margin:12px 0;background:#fff}
details summary{cursor:pointer;font-weight:600}
details[open] summary{margin-bottom:10px}
details.frivillig{background:#F7FAF8;border-color:#D9E7DF}
.mailboks{background:#F7FAF8;border-color:#D9E7DF}
.mailsvar{margin:8px 0 0}
.mailsvar.besked{padding:10px 14px}
.valgkort{border:0;padding:0;margin:14px 0}
.valgkort legend{font-weight:600;font-size:14px;margin-bottom:6px}
.valgkort label{display:block;border:1px solid var(--kant);border-radius:12px;padding:12px 14px;margin:0 0 8px;cursor:pointer;font-weight:400;background:#fff}
.valgkort label b{display:block;font-size:15px}
.valgkort label span{font-size:13.5px;color:var(--graa)}
.valgkort label:has(input:checked){border-color:var(--roed);background:#FFF7F7}
.valgkort input{margin-right:8px;accent-color:var(--roed)}
.fod{color:var(--graa);font-size:13px;text-align:center;margin:24px auto 0;max-width:940px;padding:0 16px}
@media print{
  .top,.knapper,.noprint,.gruppenav,.skip,button.ryd,.fod .noprint{display:none!important}
  html,body{background:#fff;font-size:11.5pt}
  .wrap{padding:0;max-width:100%}
  .kort{border:0;padding:0 0 14px;margin:0 0 10px;break-inside:avoid}
  .raekke-kort,details,.boks{break-inside:avoid}
  textarea,input[type=text],input[type=date],select{border:0;border-bottom:1px solid #bbb;border-radius:0;padding:2px 0;min-height:0;height:auto;overflow:visible;resize:none}
  textarea{white-space:pre-wrap}
  details{border:0;padding:0}
  details summary{display:none}
  .omraade-gitter,.dele,.celler{display:block}
  .skala label{min-height:0;padding:3px}
  .skala label .tekst{display:none}
  a[href]::after{content:""}
}

/* Del 1 · energitønde */
.toende{margin:18px 0 12px;padding:0}
.toende svg{width:100%;height:auto;display:block;max-height:340px}
.toende figcaption{display:flex;flex-wrap:wrap;gap:6px 18px;margin-top:6px}
.stryg{display:none}
.noegle{display:inline-flex;align-items:center;gap:7px}
.noegle i{width:15px;height:11px;border-radius:3px;flex:none}
.noegle .n-vand{background:#1F5FA8;opacity:.8}
.noegle .n-linje{height:0;border-top:3px solid var(--moerk);border-radius:0}
.noegle .n-mangel{background:#E00000;opacity:.16;border:1px solid rgba(224,0,0,.35)}
.besked.fokus{border-left:4px solid var(--roed);background:#fff}
.besked.info{border-left:4px solid var(--blaa);background:#fff}
.toende-tabel{margin:12px 0 4px}
.toende-tal{width:100%;border-collapse:collapse;font-size:14.5px;margin-top:8px}
.toende-tal caption{text-align:left;margin-bottom:6px}
.toende-tal th,.toende-tal td{text-align:right;padding:7px 8px;border-bottom:1px solid var(--kant);font-variant-numeric:tabular-nums}
.toende-tal thead th{font-size:12px;text-transform:uppercase;letter-spacing:.04em;color:var(--graa)}
.toende-tal th[scope=row]{text-align:left;font-weight:700;font-size:14.5px;letter-spacing:0;color:var(--moerk);text-transform:none}
.omraade-top{display:flex;gap:12px;align-items:flex-start;margin-bottom:12px}
.omraade-top h3{margin:0 0 2px}
.omraade-top .plads{display:grid;place-items:center;width:28px;height:28px;flex:none;border-radius:50%;background:var(--lys);color:var(--graa);font-weight:800;font-size:14px}
.status-linje{margin:0;font-size:13px;font-weight:700}
.status-linje.mangel{color:var(--roed)}
.status-linje.let{color:var(--gul)}
.status-linje.daekket{color:var(--groen)}
.status-linje.ukendt{color:var(--graa)}
.omraade:first-child .omraade-top .plads{background:var(--roed);color:#fff}
.sammenfald{border-left:3px solid var(--gul);padding-left:10px}
@media (max-width:640px){
  /* Tønden må selv rulle vandret, så tallene ikke bliver ulæselige. Siden ruller ikke. */
  .toende{overflow-x:auto;-webkit-overflow-scrolling:touch;padding-bottom:4px}
  .toende svg{max-height:none;min-width:440px}
  .stryg{display:block;font-style:italic;color:var(--graa)}
  .omraade-top .plads{width:24px;height:24px;font-size:13px}
}

/* Del 1 version 2 */
.maerkat.pilot{background:#FDF3E7;color:#8A5A00;font-weight:700}
.referenceramme{background:var(--lys);border-radius:10px;padding:10px 14px;margin:0 0 10px;font-size:14px}
.udsagn legend{display:flex;gap:8px;align-items:center;flex-wrap:wrap;padding:0;margin-bottom:8px}
.item-id{font-size:11px;font-weight:800;letter-spacing:.04em;color:var(--graa);background:var(--lys);border-radius:6px;padding:2px 7px;font-variant-numeric:tabular-nums}
.omraade-maerkat,.tid-maerkat{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;border-radius:999px;padding:3px 9px}
.omraade-maerkat{background:#EAF1F9;color:#1F5FA8}
.tid-maerkat{background:#F1EFEA;color:var(--graa)}
.udsagn-tekst{font-size:17px;margin:0 0 10px;color:var(--moerk)}
.valg{display:grid;gap:6px}
.valg.vandret{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}
.valg label{display:flex;align-items:center;gap:10px;border:1px solid var(--kant);border-radius:10px;padding:9px 12px;cursor:pointer;background:#fff}
.valg label:hover{border-color:var(--moerk)}
.valg label.valgt{border-color:var(--roed);background:#FFF6F6;box-shadow:inset 0 0 0 1px var(--roed)}
.valg label input{margin:0;accent-color:var(--roed);width:18px;height:18px;flex:none}
.valg label .tal{font-weight:800;min-width:16px;font-variant-numeric:tabular-nums}
.valg label .tekst{font-size:14.5px}
.valg label:focus-within{outline:2px solid var(--roed);outline-offset:2px}
.fakta{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:8px;margin:12px 0}
.fakta div{background:var(--lys);border-radius:10px;padding:10px 12px}
.fakta dt{font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:var(--graa)}
.fakta dd{margin:3px 0 0;font-weight:700;font-size:14.5px}
.behov-gitter{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px;margin:14px 0}
.behovskort h3{margin:0 0 10px}
.behov-linje{margin:0 0 14px}
.behov-label{margin:0;font-size:13px;font-weight:700;color:var(--graa)}
.behov-tal{margin:2px 0 4px;font-size:15px}
.behov-tal b{font-size:24px;font-variant-numeric:tabular-nums}
.behov-tal.mangler{font-size:13.5px;color:var(--graa);font-style:italic}
.behov-bjaelke{height:9px;border-radius:99px;background:#E8E2DB;overflow:hidden}
.behov-bjaelke i{display:block;height:100%;border-radius:99px;background:var(--blaa)}
.behov-linje.frus .behov-bjaelke i{background:var(--roed)}
.svarliste{list-style:none;padding:0;margin:6px 0 0;font-size:13.5px}
.svarliste li{padding:4px 0;border-bottom:1px solid var(--kant)}
.svarlinje{margin:2px 0;padding-left:2px}
.tal-raekke.tre{grid-template-columns:repeat(3,1fr)}
.markeringer li.frame_gap{border-color:var(--roed)}
.markeringer li.frame_support{border-color:var(--groen)}
.markeringer li.frame_obstacle{border-color:var(--gul)}
.gruppe-titel{margin:16px 0 6px;font-size:15px}
.gruppe-titel.op{color:var(--groen)}.gruppe-titel.ned{color:var(--roed)}.gruppe-titel.x{color:var(--graa)}
.aktivliste{list-style:none;padding:0;margin:0}
.aktivliste li{padding:8px 0;border-bottom:1px solid var(--kant);font-size:14.5px}
.aktivliste li b{font-variant-numeric:tabular-nums}
.flag{font-size:12px;color:var(--graa);font-style:italic}
.fokus-liste{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:6px;margin:10px 0}
.fokus-liste .tjek{border:1px solid var(--kant);border-radius:10px;padding:9px 12px;background:#fff}
.fokus-liste .tjek.valgt{border-color:var(--roed);background:#FFF6F6}
.fokus-liste .tjek:has(input:disabled){opacity:.5}
.del-kort.laast{opacity:.6}
.toende-tal tr.sum th,.toende-tal tr.sum td{font-weight:800;border-top:2px solid var(--moerk)}
.delta{font-size:12.5px;font-weight:700;border-radius:999px;padding:2px 9px;background:var(--lys);color:var(--graa)}
.delta.op{background:#E8F3ED;color:var(--groen)}.delta.ned{background:#FDECEC;color:var(--roed)}
.noegle .n-sort{height:0;border-top:3px solid var(--moerk);border-radius:0}
.noegle .n-blåt{background:#1F5FA8;opacity:.8}
.noegle .n-rødt{background:#E00000;opacity:.16;border:1px solid rgba(224,0,0,.35)}
.noegle .n-rød{background:none;border:2px dashed var(--roed)}
.knap.lille{padding:8px 14px;font-size:13.5px}
@media (max-width:640px){.valg.vandret{grid-template-columns:1fr}}