@charset "UTF-8";
/*! © 2026 KalenderInfo.dk – alle rettigheder forbeholdes.
    Kode, tekster og design må ikke kopieres eller genbruges uden skriftlig tilladelse.
    https://kalenderinfo.dk · ki-9197df84 */
/* =============================================================
   KalenderInfo.dk — stilark
   Mobile-first. Ingen frameworks. Ingen eksterne skrifttyper.
   ============================================================= */
:root{
  --kilde:"KalenderInfo.dk ki-9197df84";
  --bg:#F4F6F4; --flade:#FFFFFF; --flade2:#EDF0EE; --flade3:#E4E9E6;
  --linje:#DCE2DE; --linje2:#EBEFEC;
  --blæk:#0F1613; --dæmp:#59655F; --dæmp2:#8A958F;
  --grøn:#06674A; --grøn-m:#0A8A63; --grøn-l:#4FBF97; --grøn-b:#E3F1EB;
  --rav:#8F5408; --rav-m:#C97A10; --rav-b:#FAEEDC;
  --blå:#1B4A9B; --blå-b:#E6EDF9;
  --rød:#9B2226; --rød-b:#F8E9E9;
  --r:8px;
  --sans:system-ui,-apple-system,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;
  --mono:ui-monospace,'SF Mono',SFMono-Regular,Menlo,Consolas,'Liberation Mono',monospace;
  --maks:1180px;
  --på-grøn:#fff; --grøn-hover:#054F39;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0; background:var(--bg); color:var(--blæk); font-family:var(--sans); font-size:16px; line-height:1.55; -webkit-font-smoothing:antialiased}
h1,h2,h3,h4{margin:0; font-weight:650; letter-spacing:-.012em; line-height:1.22}
h1{font-size:clamp(24px,4vw,32px)}
h2{font-size:clamp(19px,2.5vw,22px)}
h3{font-size:16.5px}
p{margin:0 0 12px}
a{color:var(--grøn); text-decoration:none}
a:hover{text-decoration:underline}
button,input,select,textarea{font:inherit; color:inherit}
:focus-visible{outline:2px solid var(--grøn); outline-offset:2px; border-radius:4px}
img,svg{max-width:100%}
.mono{font-family:var(--mono); font-variant-numeric:tabular-nums}
.wrap{max-width:var(--maks); margin:0 auto; padding:0 16px}
.skjult{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap}
.spring{position:absolute; left:-999px; top:0; background:var(--grøn); color:#fff; padding:8px 14px; z-index:100}
.spring:focus{left:8px; top:8px}
#print-rum{display:none}

/* ---------------- hoved ---------------- */
.top{background:var(--flade); border-bottom:1px solid var(--linje); position:sticky; top:0; z-index:70}
.top .wrap{display:flex; align-items:stretch; gap:8px; height:46px; max-width:var(--kant,1180px); position:relative}
.logo{position:relative; display:flex; align-items:center; padding:0 2px; margin:0 6px 0 -2px;
  font-size:21px; font-weight:700; letter-spacing:-.035em; color:var(--blæk); flex:0 0 auto; line-height:1}
.logo:hover{text-decoration:none}
/* stregen under logoet folder ud fra midten mod begge sider. Den animeres med left/right (ikke transform), så den
   males på samme måde hele vejen og er lige tynd fra start til slut */
.logo::after{content:''; position:absolute; left:50%; right:50%; bottom:8px; height:2.5px; border-radius:2px; background:var(--grøn);
  transition:left .34s cubic-bezier(.34,1.56,.64,1), right .34s cubic-bezier(.34,1.56,.64,1)}
.logo:hover::after,.logo:focus-visible::after{left:2px; right:2px}
.logo:focus-visible{outline:none}
.logo .mrk{color:#000}
.logo .grn{color:var(--grøn)}
.fane-liste{display:flex; align-items:stretch; gap:1px; flex:1 1 auto; min-width:0; overflow:hidden; margin-left:4px}
.fane-liste a{display:flex; align-items:center; position:relative; padding:0 11px; color:var(--dæmp); font-weight:500; font-size:14px; white-space:nowrap}
.fane-liste a::after{content:''; position:absolute; left:11px; right:11px; bottom:0; height:2px; border-radius:2px 2px 0 0; background:transparent}
.fane-liste a:hover{color:var(--blæk); background:var(--flade2); text-decoration:none}
.fane-liste a[aria-current="page"]{color:var(--grøn)}
.fane-liste a[aria-current="page"]::after{background:var(--grøn)}
.kmd{position:relative; flex:0 1 240px; min-width:104px; align-self:center}
.kmd::before{content:'❯'; position:absolute; left:11px; top:50%; transform:translateY(-50%); color:var(--grøn); font-family:var(--mono); font-size:12px; pointer-events:none}
#kmd-felt{width:100%; height:28px; padding:0 10px 0 27px; font-size:13px; border:1px solid var(--linje); border-radius:7px; background:var(--bg)}
#kmd-felt::placeholder{color:var(--dæmp2)}
#kmd-felt:focus{outline:none; border-color:var(--grøn); background:var(--flade); box-shadow:0 0 0 3px var(--grøn-b)}
.kmd-liste{position:absolute; top:calc(100% + 5px); left:0; right:0; background:var(--flade); border:1px solid var(--linje); border-radius:var(--r); box-shadow:0 18px 40px -16px rgba(0,0,0,.28); overflow:hidden; z-index:80; max-height:60vh; overflow-y:auto}
.kmd-liste[hidden]{display:none}
.kmd-liste a{display:block; padding:9px 13px; color:var(--blæk); border-bottom:1px solid var(--linje2); font-size:14px}
.kmd-liste a:last-child{border-bottom:none}
.kmd-liste a:hover,.kmd-liste a:focus{background:var(--grøn-b); text-decoration:none}
.kmd-liste b{display:block; font-weight:600}
.kmd-liste span{color:var(--dæmp); font-size:12.5px}
.kmd-liste .tom{padding:11px 13px; color:var(--dæmp); font-size:14px}
.top .ikon-knap{align-self:center; flex:0 0 auto}
.ikon-knap.burger{position:relative}
.ikon-knap.burger.aktiv{border-color:var(--grøn); color:var(--grøn)}
.burger-menu{position:absolute; right:0; top:calc(100% + 6px); background:var(--flade); border:1px solid var(--linje); border-radius:12px; box-shadow:0 18px 40px -16px rgba(0,0,0,.3); padding:6px; min-width:220px; max-height:70vh; overflow-y:auto; z-index:80}
.burger-menu[hidden]{display:none}
.burger-menu a{display:block; padding:9px 13px; border-radius:8px; color:var(--blæk); font-size:15px}
.burger-menu a:hover{background:var(--flade2); text-decoration:none}
.burger-menu a[aria-current="page"]{background:var(--grøn-b); color:var(--grøn); font-weight:600}
.burger-menu hr{border:0; border-top:1px solid var(--linje2); margin:6px 4px}
.burger-menu .mh{display:block; padding:6px 13px 3px; font-size:11.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--dæmp2); font-weight:650}

/* ---------------- årskalender-scene (fylder skærmen) ---------------- */
.scene{
  display:flex; flex-direction:column; gap:7px;
  height:calc(100vh - var(--top-h, 46px));
  height:calc(100dvh - var(--top-h, 46px));
  min-height:0; max-width:var(--kant,1720px); margin:0 auto; padding:8px 16px 10px;
}
.plan-bar{display:flex; align-items:center; gap:12px; flex:0 0 auto; background:var(--flade); border:1px solid var(--linje); border-radius:10px; padding:4px 8px 4px 4px}
.uge-nu{display:flex; align-items:center; gap:10px; flex:0 0 auto}
.uge-kasse{background:var(--grøn); color:var(--på-grøn); border-radius:7px; padding:3px 8px 3px; text-align:center; line-height:1; min-width:50px}
a.uge-kasse{display:block; color:var(--på-grøn)}
a.uge-kasse:hover{text-decoration:none; background:var(--grøn-hover)}
.uge-kasse small{display:block; font-size:11px; letter-spacing:.12em; font-weight:700; opacity:.85; margin-bottom:1px}
.uge-kasse b{font-family:var(--mono); font-size:21px; font-weight:700; letter-spacing:-.04em}
.uge-tekst h1{font-size:15px; line-height:1.2; letter-spacing:-.01em}
.uge-tekst p{margin:1px 0 0; font-size:12px; color:var(--dæmp); line-height:1.25}
.dag-info{flex:1 1 auto; min-width:0; font-size:12px; color:var(--dæmp); border-left:1px solid var(--linje); padding-left:12px; line-height:1.35}
.dag-info .di-kort,.dag-info .di-sep{display:none}
@media (min-width:1101px){ .dag-info .di-l1,.dag-info .di-l2{display:block} }
@media (max-width:1100px){ .dag-info .di-sep{display:inline} .plan-bar .uge-nu{flex:1 1 0; min-width:0} }
@media (max-width:900px){ .uge-tekst .ud{display:none} }
@media (max-width:600px){ .dag-info .di-lang{display:none} .dag-info .di-kort{display:inline} }
.dag-info b{color:var(--blæk); font-weight:600}
.dag-info .dt{display:inline; color:var(--blæk); font-size:13px}
.dag-info .sep{color:var(--dæmp2)}
.dag-info a{white-space:nowrap}
.plan-styr{display:flex; gap:6px; align-items:center; flex:0 0 auto; flex-wrap:wrap; justify-content:flex-end}
.plan-styr .knap,.plan-styr .skift button,.plan-styr .år-ctrl a,.plan-styr .år-ctrl button{padding:3px 10px; font-size:13.5px}
.plan-styr .knap .pt{margin-left:5px}
.skift[hidden]{display:none}
.plan-gitter{flex:1 1 auto; min-height:0; display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); gap:3px}
.plan-gitter[data-vis="halv"]{grid-template-columns:repeat(6,minmax(0,1fr)); gap:6px}
.pm{display:grid; grid-template-rows:auto repeat(31,minmax(0,1fr)); container-type:inline-size; min-height:0; background:var(--flade); border:1px solid var(--linje); border-radius:6px; overflow:hidden}
.pm-h{text-align:center; padding:3px 2px 4px; background:var(--flade2); border-bottom:1px solid var(--linje); line-height:1.12}
.pm-h a{font-weight:650; color:var(--blæk); font-size:min(clamp(12px,1.6vh,15px), var(--pm-fs, 99px))}
.pm-h .pu{display:block; font-size:min(12px, var(--pu-fs, 99px)); color:var(--dæmp)}
.pm-h .mk{display:none}
.pm-h a{display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.pd{
  display:grid; grid-template-columns:1.05em 1.6em minmax(0,1fr) auto; align-items:center; column-gap:.2em;
  padding:0 .35em 0 .3em; border:0; box-shadow:inset 0 1px 0 var(--linje2); background:none; color:inherit; text-align:left;
  cursor:pointer; min-height:0; overflow:hidden; font-family:var(--sans); font-size:var(--pd-fs, clamp(11px,1.5vh,14px)); line-height:1;
  font-variant-numeric:tabular-nums;
}
.pd .l{color:var(--dæmp2); font-size:max(var(--min-fs, 11px),.86em); text-align:center; padding-left:.1em}
.pd .n{font-weight:600; text-align:right; padding-right:.2em}
.pd .t{font-size:max(var(--min-fs, 11px),.84em); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; color:var(--dæmp)}
.pd .u{font-weight:750; font-size:max(var(--min-fs, 11px),1.08em); color:var(--blæk); padding-left:.2em}
.pd.we{background:var(--flade3)}
.pd.hd{background:var(--rav-b)}
.pd.hd .t,.pd.hd .n{color:var(--rav)}
.pd.hd .t{font-weight:600}
.pd.fl .t{color:var(--blå)}
.pd.denne{box-shadow:inset 2px 0 0 var(--grøn), inset -2px 0 0 var(--grøn), inset 0 1px 0 var(--linje2)}
.pd.denne.dt{box-shadow:inset 2px 0 0 var(--grøn), inset -2px 0 0 var(--grøn), inset 0 2px 0 var(--grøn)}
.pd.denne.db{box-shadow:inset 2px 0 0 var(--grøn), inset -2px 0 0 var(--grøn), inset 0 -2px 0 var(--grøn), inset 0 1px 0 var(--linje2)}
.pd.denne.dt.db{box-shadow:inset 2px 0 0 var(--grøn), inset -2px 0 0 var(--grøn), inset 0 2px 0 var(--grøn), inset 0 -2px 0 var(--grøn)}
.pd.denne .u{color:var(--grøn)}
.pd.nu{background:var(--grøn)}
.pd.nu .l,.pd.nu .n,.pd.nu .t,.pd.nu .u{color:var(--på-grøn)}
.pd.valgt{outline:2px solid var(--dæmp); outline-offset:-2px}
h1[tabindex="-1"]:focus{outline:none}
.pd:not(.tom):hover{outline:1px solid var(--grøn-m); outline-offset:-1px}
.pd.tom{cursor:default; background:repeating-linear-gradient(135deg,transparent 0 4px,var(--flade2) 4px 8px)}
.plan-gitter[data-vis="halv"] .pd{font-size:var(--pd-fs, clamp(12px,1.72vh,15px)); grid-template-columns:1.2em 1.7em minmax(0,1fr) auto; padding:0 .5em 0 .45em}
.plan-gitter[data-vis="halv"] .pd .t{font-size:max(var(--min-fs, 11px),.86em)}
.plan-gitter[data-vis="halv"] .pm-h a{font-size:min(clamp(13px,1.8vh,16px), var(--pm-fs, 99px))}
/* lav kalender (fx når browseren er zoomet ind): kun dato og ugenummer i dagene */
.scene.lav .pd .t,.scene.lav .pd .l,.scene.lav .dag-info,.scene.lav .plan-forklar,.scene.lav .pm-h .pu{display:none}
.scene.lav .pd{grid-template-columns:minmax(0,1fr) auto}
.scene.lav .pd .n{text-align:left; padding-left:.25em}
/* smalle kolonner (tablet, telefon): skub månederne sammen i stedet for at skjule dem */
@container (max-width:92px){
  .pm-h .mn{display:none} .pm-h .mk{display:inline}
  .plan-gitter[data-vis] .pm .pd{grid-template-columns:.95em minmax(0,1fr) auto; column-gap:.1em; padding:0 .28em 0 .24em}
  .plan-gitter[data-vis] .pm .pd .t{display:none}
  .plan-gitter[data-vis] .pm .pd .n{text-align:left; padding-left:.1em}
  .plan-gitter[data-vis] .pm .pd .u{padding-left:0}
  .plan-gitter[data-vis] .pm .pd.fl .n{color:var(--blå)}
}
@container (max-width:62px){ .pm-h .pu-uge{display:none} }
@container (max-width:57px){ .plan-gitter[data-vis] .pm .pd{font-size:min(11px, var(--pd-fs, 11px))} }
.under-scene{padding-top:18px}
.plan-forklar{display:flex; gap:16px; font-size:12.5px; color:var(--dæmp); flex-wrap:wrap; margin:0 0 18px}
.plan-forklar i{display:inline-block; width:11px; height:11px; border-radius:2px; vertical-align:-1px; margin-right:5px; border:1px solid var(--linje)}
.scene .plan-forklar{flex:0 0 auto; justify-content:center; margin:0; gap:6px 18px; font-size:12px; line-height:1.2}

/* ---------------- sidehoved og brødkrumme ---------------- */
main{padding-bottom:46px; min-height:60vh}
.krumme{font-size:13px; color:var(--dæmp); padding:12px 0 0}
.krumme ol{list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:5px}
.krumme li::after{content:'/'; margin-left:5px; color:var(--dæmp2)}
.krumme li:last-child::after{content:''}
.krumme a{color:var(--dæmp)}
.side-hoved{padding:14px 0 18px}
.side-hoved h1:focus{outline:none}
.side-hoved p.intro{color:var(--dæmp); margin:8px 0 0; font-size:15.5px}

/* ---------------- det hurtige svar ---------------- */
.svar{background:var(--flade); border:1px solid var(--linje); border-left:4px solid var(--grøn); border-radius:var(--r); padding:18px 20px; margin:6px 0 20px; display:grid; grid-template-columns:auto 1fr; gap:22px; align-items:center}
.svar .stortal{font-family:var(--mono); font-size:clamp(44px,9vw,68px); font-weight:700; line-height:.86; letter-spacing:-.05em; color:var(--grøn)}
.svar .stortal small{display:block; font-family:var(--sans); font-size:12px; font-weight:500; color:var(--dæmp); letter-spacing:0; margin-bottom:6px}
.svar .krop h2{font-size:20px; margin-bottom:3px}
.svar .krop p{margin:0; color:var(--dæmp); font-size:14.5px}
.svar .fakta{display:flex; gap:20px; flex-wrap:wrap; margin-top:13px; padding-top:12px; border-top:1px solid var(--linje2)}
.svar .fakta div b{display:block; font-size:16px; font-weight:650}
.svar .fakta div span{font-size:12px; color:var(--dæmp)}
.svar .videre{margin-top:12px; display:flex; gap:14px; flex-wrap:wrap; font-size:14px}
.svar.enkel{grid-template-columns:1fr; margin:6px 0 0}

/* ---------------- afsnit og kontroller ---------------- */
/* samme afstand mellem sektionerne på alle sider */
section.blok{margin:0 0 52px}
section.blok.faq-blok{margin-top:52px}
#sol-aaret{padding-top:64px}
section.blok > h2{margin-bottom:4px}
section.blok > p.under{color:var(--dæmp); font-size:14.5px; margin:0 0 14px}
.linje-styr{display:flex; align-items:center; gap:9px; flex-wrap:wrap; margin-bottom:14px}
.år-ctrl{display:flex; border:1px solid var(--linje); border-radius:var(--r); overflow:hidden; background:var(--flade)}
.år-ctrl[hidden]{display:none}
.år-ctrl a,.år-ctrl button{padding:5px 11px; color:var(--dæmp); background:none; border:none; cursor:pointer; line-height:1.5; font-size:14px}
.år-ctrl a:hover,.år-ctrl button:hover{background:var(--flade2); color:var(--blæk); text-decoration:none}
.år-ctrl .v{padding:5px 12px; border-left:1px solid var(--linje); border-right:1px solid var(--linje); font-weight:650; min-width:62px; text-align:center; font-size:14px; line-height:1.5; white-space:nowrap}
.knap{background:var(--flade); border:1px solid var(--linje); border-radius:var(--r); padding:5px 12px; cursor:pointer; font-size:14px; color:var(--blæk); display:inline-flex; align-items:center; gap:6px; line-height:1.5}
.knap:hover{border-color:var(--grøn); color:var(--grøn); text-decoration:none}
.knap.fyld{background:var(--grøn); color:var(--på-grøn); border-color:var(--grøn)}
.knap.fyld:hover{background:var(--grøn-hover); color:var(--på-grøn)}
.knap.stor{padding:10px 18px; font-size:15.5px; font-weight:600}
.skift{display:inline-flex; border:1px solid var(--linje); border-radius:var(--r); overflow:hidden; background:var(--flade)}
.skift button{background:none; border:none; padding:5px 12px; cursor:pointer; font-size:14px; color:var(--dæmp); border-right:1px solid var(--linje); line-height:1.5}
.skift button:last-child{border-right:none}
.skift button[aria-pressed="true"]{background:var(--grøn); color:var(--på-grøn); font-weight:600}

/* ---------------- månedsgitre (kalenderfanen) ---------------- */
.måneder{display:grid; grid-template-columns:repeat(4,1fr); gap:11px}
.md{background:var(--flade); border:1px solid var(--linje); border-radius:var(--r); padding:12px 13px}
.md h3{font-size:14.5px; margin-bottom:8px; display:flex; justify-content:space-between; align-items:baseline; gap:6px}
.md h3 a{color:var(--blæk)}
.md h3 span{font-size:11px; color:var(--dæmp2); font-weight:400; white-space:nowrap}
.mg{display:grid; grid-template-columns:26px repeat(7,1fr); gap:1px; font-size:12.5px; text-align:center; font-variant-numeric:tabular-nums}
.mg .h{font-size:11px; color:var(--dæmp2); padding-bottom:3px}
.mg .un{font-size:11px; color:var(--grøn); text-align:right; padding-right:5px; line-height:26px; font-weight:600}
.mg .c{line-height:26px; border-radius:5px; border:none; background:none; cursor:pointer; font:inherit; padding:0; color:var(--blæk)}
.mg .c.we{color:var(--dæmp2)}
.mg .c.hd{background:var(--rav-b); color:var(--rav); font-weight:700}
.mg .c.fl{background:var(--blå-b); color:var(--blå); font-weight:700}
.mg .c.mk{position:relative; font-weight:600}
.mg .c.mk::after{content:''; position:absolute; left:50%; bottom:2px; width:4px; height:4px; margin-left:-2px; border-radius:50%; background:var(--grøn-m)}
.mg .c.nu::after{background:var(--på-grøn)}
.mg-forklar{display:flex; flex-wrap:wrap; justify-content:center; gap:6px 18px; margin:14px 0 0; font-size:12.5px; color:var(--dæmp)}
.mk-print{margin:16px 0 0; text-align:center}
.mg-forklar i{display:inline-block; width:12px; height:12px; border-radius:3px; vertical-align:-2px; margin-right:6px; border:1px solid var(--linje)}
.mg-forklar i.f-hd{background:var(--rav-b); border-color:var(--rav)}
.mg-forklar i.f-fl{background:var(--blå-b); border-color:var(--blå)}
.mg-forklar i.f-mk{position:relative; background:var(--flade)}
.mg-forklar i.f-mk::after{content:''; position:absolute; left:3px; top:3px; width:4px; height:4px; border-radius:50%; background:var(--grøn-m)}
.mg-forklar i.f-we{background:var(--flade3)}
.mg-forklar i.f-nu{background:var(--grøn); border-color:var(--grøn)}
.mg .c.nu{background:var(--grøn); color:var(--på-grøn); font-weight:700}
.mg .c.tom{opacity:0; pointer-events:none}
.mg .c:hover:not(.nu){background:var(--flade2)}

/* ---------------- tabeller ---------------- */
.tabelboks{background:var(--flade); border:1px solid var(--linje); border-radius:var(--r); overflow-x:auto; max-width:100%; -webkit-overflow-scrolling:touch}
table{width:100%; border-collapse:collapse; font-size:14px}
caption{text-align:left; padding:11px 13px 0; color:var(--dæmp); font-size:13px}
th{text-align:left; font-weight:500; color:var(--dæmp); font-size:12.5px; padding:9px 12px; border-bottom:1px solid var(--linje); background:var(--flade2); white-space:nowrap}
td{padding:8px 12px; border-bottom:1px solid var(--linje2); white-space:nowrap}
tr:last-child td{border-bottom:none}
tbody tr:hover{background:var(--flade2)}
td.num,th.num{text-align:right; font-variant-numeric:tabular-nums}
td.navn{white-space:normal; min-width:170px}
tr.forbi{color:var(--dæmp2)}
tfoot td{font-weight:650; background:var(--flade2); border-top:1px solid var(--linje)}
.note{display:block; color:var(--dæmp); font-size:12.5px; white-space:normal; margin-top:1px}
.badge{display:inline-block; font-size:11.5px; padding:2px 8px; border-radius:99px; font-weight:500; white-space:nowrap}
.b-helligdag{background:var(--rav-b); color:var(--rav)}
.b-flagdag{background:var(--blå-b); color:var(--blå)}
.b-mærkedag{background:var(--flade3); color:var(--dæmp)}
.b-historisk{background:var(--flade3); color:var(--dæmp2); text-decoration:line-through}
.b-grøn{background:var(--grøn-b); color:var(--grøn)}

/* ---------------- kort og net ---------------- */
.net{display:grid; gap:12px}
.net > *,.blog-net > *,.ps-detalje > *,.scene > *{min-width:0}
.net-2{grid-template-columns:1fr 1fr}
.net-auto{grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}
.kort{background:var(--flade); border:1px solid var(--linje); border-radius:var(--r); padding:16px 18px}
.kort h3{margin-bottom:6px}
.kort p{font-size:14.5px; color:var(--dæmp); margin-bottom:0}
a.kort{color:var(--blæk); display:block}
a.kort:hover{text-decoration:none; border-color:var(--grøn)}
a.kort h3{color:var(--grøn)}
button.kort{font:inherit; text-align:left; cursor:pointer; width:100%}
button.kort:hover{border-color:var(--grøn)}
.opsum{display:flex; gap:24px; flex-wrap:wrap; background:var(--flade); border:1px solid var(--linje); border-radius:var(--r); padding:15px 18px; margin-bottom:14px}
.opsum > * > b{display:block; font-size:22px; font-weight:700; letter-spacing:-.02em; font-variant-numeric:tabular-nums}
.opsum > * > span{font-size:12.5px; color:var(--dæmp)}
.opsum.midt{justify-content:space-evenly}
.opsum.midt > *{text-align:center}
.opsum > a{color:inherit; border-radius:10px; padding:4px 8px; margin:-4px -8px}
.opsum > a:hover{text-decoration:none; background:var(--grøn-b)}
.opsum > a:hover b{color:var(--grøn)}
.side-note{margin:30px 0 0; padding-top:14px; border-top:1px solid var(--linje2); color:var(--dæmp); font-size:13.5px}
.fod-net h3 a{color:inherit}
.fod-net h3 a:hover{text-decoration:underline}
.info{background:var(--blå-b); border:1px solid #C7D7F2; border-radius:var(--r); padding:12px 15px; font-size:14px; color:#173C7C; margin-bottom:16px}
.info b{font-weight:650}
.info a{color:#173C7C; text-decoration:underline}
.info.advarsel{background:var(--rav-b); border-color:#E5C79A; color:var(--rav)}

/* ---------------- ferieplan ---------------- */
.f-kort{background:var(--flade); border:1px solid var(--linje); border-radius:var(--r); padding:15px 16px}
.f-kort .top-rk{display:flex; justify-content:space-between; align-items:baseline; margin-bottom:8px; gap:10px}
.f-kort .gevinst{font-size:28px; font-weight:700; letter-spacing:-.03em; line-height:1; color:var(--grøn)}
.f-kort .gevinst small{font-size:12px; color:var(--dæmp); font-weight:400; letter-spacing:0}
.f-kort .budget{font-size:13px; color:var(--dæmp); text-align:right}
.f-kort .budget b{color:var(--rav); font-size:15px}
.f-kort .periode{font-size:13.5px; margin-bottom:10px}
.f-kort .periode span{color:var(--dæmp); font-size:12.5px; display:block}
.strimmel{display:flex; gap:1.5px; height:20px}
.strimmel i{flex:1; border-radius:2px; background:var(--flade3)}
.strimmel i.fri{background:var(--grøn-b)}
.strimmel i.ferie{background:var(--rav)}
.strimmel i.hd{background:var(--grøn)}
.inst-valg{display:flex; gap:6px; flex-wrap:wrap; margin-bottom:14px}
.inst-valg button{background:var(--flade); border:1px solid var(--linje); border-radius:99px; padding:6px 13px; font-size:13.5px; cursor:pointer; color:var(--dæmp)}
.inst-valg button[aria-pressed="true"]{background:var(--grøn); color:var(--på-grøn); border-color:var(--grøn)}
.tidslinje{background:var(--flade); border:1px solid var(--linje); border-radius:var(--r); padding:16px 18px 10px}
.tl-rk{display:grid; grid-template-columns:150px 1fr; gap:12px; align-items:center; margin-bottom:9px; font-size:13.5px}
.tl-navn b{display:block; font-weight:600}
.tl-navn span{color:var(--dæmp); font-size:12px}
.tl-bar{position:relative; height:22px; background:var(--flade2); border-radius:4px; overflow:hidden}
.tl-bar i{position:absolute; top:0; bottom:0; background:var(--grøn-m); border-radius:3px}
.tl-akse{display:grid; grid-template-columns:150px 1fr; gap:12px; margin-top:4px}
.tl-mdr{display:grid; grid-template-columns:repeat(12,1fr); font-size:11px; color:var(--dæmp2); text-align:center}

/* ---------------- formularer og skydere ---------------- */
.felter{display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:12px; margin-bottom:14px}
.felt label{display:block; font-size:12.5px; color:var(--dæmp); margin-bottom:4px}
.felt input,.felt select{width:100%; padding:9px 11px; border:1px solid var(--linje); border-radius:var(--r); background:var(--flade); min-height:40px}
.felt input:focus,.felt select:focus{outline:none; border-color:var(--grøn); box-shadow:0 0 0 3px var(--grøn-b)}
.felt .tip{font-size:11.5px; color:var(--dæmp2); margin-top:3px; display:block}
.felt span small{font-size:11px}   /* fx "(valgfri)" — aldrig under 11 px */
fieldset{border:1px solid var(--linje); border-radius:var(--r); padding:14px 16px 4px; margin:0 0 14px; background:var(--flade); min-width:0}
legend{font-size:13px; color:var(--dæmp); padding:0 6px; font-weight:600}
.tjekboks{display:flex; gap:9px; align-items:flex-start; font-size:14px; margin:4px 0 12px; cursor:pointer}
.tjekboks input{width:18px; height:18px; accent-color:var(--grøn); margin:2px 0 0; flex:0 0 auto}
.skyder{margin-bottom:12px}
.skyder label{display:flex; justify-content:space-between; align-items:baseline; font-size:13px; color:var(--dæmp); margin-bottom:2px; gap:10px}
.skyder output{font-weight:700; color:var(--blæk); font-size:15px; white-space:nowrap; font-variant-numeric:tabular-nums}
/* tallet ved skyderen kan rettes med tastaturet */
.skyder output.sk-v{cursor:text; border-radius:7px; padding:1px 7px; margin:-1px -7px -1px 0; border:1px dashed transparent; transition:background .15s, border-color .15s, color .15s}
.skyder output.sk-v:hover{background:var(--grøn-b); border-color:color-mix(in srgb, var(--grøn) 45%, transparent); color:var(--grøn)}
.skyder output.sk-v:focus-visible{outline:2px solid var(--grøn); outline-offset:1px}
.skyder .sk-ind{width:min(15ch, 60%); margin:-3px -2px -3px auto; padding:2px 8px; border:1.5px solid var(--grøn); border-radius:7px; background:var(--bg); color:var(--blæk); font:inherit; font-size:15px; font-weight:700; text-align:right; font-variant-numeric:tabular-nums; outline:none; box-shadow:0 0 0 3px color-mix(in srgb, var(--grøn) 18%, transparent)}
@media (prefers-reduced-motion:no-preference){ .skyder output.sk-blink{animation:sk-blink .9s ease-out} }
@keyframes sk-blink{ 0%{background:color-mix(in srgb, #E0A22E 45%, transparent)} 100%{background:transparent} }
input[type="range"]{width:100%; accent-color:var(--grøn); height:26px; margin:0; cursor:pointer}
.skyder .tip{font-size:11.5px; color:var(--dæmp2)}

/* lønseddel */
.seddel{background:var(--flade); border:1px solid var(--linje); border-radius:var(--r); overflow:hidden; margin-bottom:14px}
.seddel .rk{display:flex; justify-content:space-between; gap:14px; padding:8px 16px; border-bottom:1px solid var(--linje2); font-size:14.5px}
.seddel .rk:last-child{border-bottom:none}
.seddel .rk span{color:var(--dæmp)}
.seddel .rk b{font-weight:600; font-variant-numeric:tabular-nums; white-space:nowrap}
.seddel .rk.minus b{color:var(--rød)}
.seddel .rk.sum{background:var(--flade2)}
.seddel .rk.sum span{color:var(--blæk); font-weight:650}
.seddel .rk.slut{background:var(--grøn)}
.seddel .rk.slut span,.seddel .rk.slut b{color:var(--på-grøn); font-weight:700; font-size:17px}
.seddel .grp{padding:7px 16px 3px; font-size:11.5px; color:var(--dæmp2); background:var(--flade2); border-bottom:1px solid var(--linje2)}

/* ---------------- grafer ---------------- */
.graf{margin:0 0 14px; background:var(--flade); border:1px solid var(--linje); border-radius:var(--r); padding:12px 12px 8px}
.graf svg{width:100%; height:auto; display:block}
.graf .gl{stroke:var(--flade3); stroke-width:1}
.graf .ga{stroke:var(--dæmp2); stroke-width:1}
.graf .gt{font-size:11px; fill:var(--dæmp); font-family:var(--sans)}
.graf .gy{font-weight:600}
.graf .gm{font-size:11.5px; font-weight:650; font-family:var(--sans)}
.graf .gv{font-size:11px; fill:var(--blæk); font-weight:650; font-family:var(--sans)}
/* (i)-knap og boksen med forklaringen (U.info) */
.info-i{display:inline-grid; place-items:center; flex:none; width:20px; height:20px; margin-left:6px; padding:0; border-radius:50%; border:1.5px solid currentColor; background:var(--flade); color:var(--dæmp); font:italic 700 12px/1 Georgia, 'Times New Roman', serif; cursor:pointer; vertical-align:1px; transition:color .15s, border-color .15s, background .15s}
.info-i:hover,.info-i[aria-expanded="true"]{color:var(--grøn); border-color:var(--grøn); background:var(--grøn-b)}
.info-i:focus-visible{outline:2px solid var(--grøn); outline-offset:2px}
.info-boks{position:fixed; z-index:1300; padding:11px 13px; border-radius:12px; background:var(--flade); color:var(--blæk); border:1px solid var(--linje); box-shadow:0 18px 40px -18px rgba(0,0,0,.4); font-size:13.5px; line-height:1.45}
.info-boks b{display:block; margin-bottom:3px}
/* opdelt forklaring (U.info med html), fx de tre ure på Aldersberegneren */
.info-ure{list-style:none; margin:6px 0 0; padding:0}
.info-ure li{padding:7px 0 0; margin:7px 0 0; border-top:1px solid var(--linje)}
.info-ure li:first-child{border-top:0; margin-top:0; padding-top:0}
.info-ure .iu-navn{display:block; font-weight:700; margin-bottom:1px}
.info-ure .iu-roed .iu-navn{color:var(--rød)}
.graf-leg{display:flex; flex-wrap:wrap; gap:6px 16px; font-size:12.5px; color:var(--dæmp); padding:8px 4px 2px}
.graf-leg i{display:inline-block; width:14px; height:5px; border-radius:2px; vertical-align:middle; margin-right:6px}
.graf-leg b{color:var(--blæk); font-weight:650}
.graf.liv svg{max-width:560px; margin:0 auto}
/* Dit liv illustreret med bokse (Aldersberegneren): knapper til enheden øverst i figuren; tegningen har samme højde i
   alle enheder (sat af graf.js), så siden ikke hopper, når man skifter */
.liv-styr{display:flex; justify-content:center; margin:0 0 10px}
.liv-styr .skift{display:flex; width:100%; max-width:440px}
.liv-styr .skift button{flex:1 1 0; padding:5px 6px; white-space:nowrap}
.liv-tegning{display:flex; align-items:center; justify-content:center; overflow:hidden}
.liv-lærred{display:block; max-width:100%; height:auto}
.liv-lev{fill:#0A8A63} .liv-nu{fill:#C97A10}
.liv-tal{fill:var(--dæmp); font-weight:600; font-variant-numeric:tabular-nums}
.graf .gt.liv-akse{font-weight:600}
.liv-tal.paa{fill:#fff}
.liv-leg{display:grid}
.liv-leg > .graf-leg{grid-area:1 / 1; justify-content:center}
.liv-leg > .graf-leg:not(.aktiv){visibility:hidden}
.liv-leg .liv-hvad{flex:1 0 100%; text-align:center; color:var(--blæk)}
.stabel{display:flex; height:26px; border-radius:6px; overflow:hidden; background:var(--flade3)}
.stabel i{height:100%}
.graf-boks{background:var(--flade); border:1px solid var(--linje); border-radius:var(--r); padding:14px 16px; margin-bottom:14px}
.graf-boks h3{margin-bottom:10px; font-size:15px}

/* FIRE-typer */
.typer{display:grid; grid-template-columns:repeat(4,1fr); gap:8px; margin-bottom:12px}
.typer button{text-align:left; background:var(--flade); border:1.5px solid var(--linje); border-radius:10px; padding:10px 12px; cursor:pointer}
.typer button b{display:block; font-size:15.5px}
.typer button span{font-size:12px; color:var(--dæmp); line-height:1.3; display:block; margin-top:2px}
.typer button[aria-pressed="true"]{border-color:var(--grøn); background:var(--grøn-b)}
.typer button[aria-pressed="true"] b{color:var(--grøn)}
.type-forklar{background:var(--flade); border:1px solid var(--linje); border-left:4px solid var(--grøn); border-radius:var(--r); padding:12px 16px; margin-bottom:14px; font-size:14.5px}
.type-forklar b{display:block; margin-bottom:2px}
.type-forklar p{margin:0; color:var(--dæmp)}
.resultat-tal{display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:10px; margin-bottom:14px}
.resultat-tal div{background:var(--flade); border:1px solid var(--linje); border-radius:var(--r); padding:12px 14px}
.resultat-tal div.hoved{background:var(--grøn); border-color:var(--grøn); color:var(--på-grøn)}
.resultat-tal b{display:block; font-size:21px; font-weight:750; letter-spacing:-.02em; font-variant-numeric:tabular-nums; line-height:1.15}
.resultat-tal span{font-size:12.5px; color:var(--dæmp)}
.resultat-tal div.hoved span{color:var(--på-grøn); opacity:.82}

/* ---------------- blog ---------------- */
.blog-net{display:grid; grid-template-columns:minmax(0,1fr) 290px; gap:36px; align-items:start}
.artikel{max-width:none}
.artikel h2{margin:30px 0 10px; font-size:22px}
.artikel p,.artikel li{font-size:16.5px; line-height:1.72}
.artikel .ingress{font-size:18.5px; line-height:1.6; color:var(--blæk)}
.artikel .punkter{padding-left:20px}
.artikel .punkter li{margin-bottom:6px}
.artikel .tabelboks,.artikel .opsum{margin:14px 0 18px}
.artikel td.tekst{white-space:normal; min-width:190px}   /* lange tekster i blogtabeller ombrydes i stedet for at rulle */
.art-meta{color:var(--dæmp); font-size:13.5px; margin-top:8px; display:flex; gap:12px; flex-wrap:wrap}
.blog-side{position:sticky; top:52px; display:flex; flex-direction:column; gap:14px}
.side-boks{background:var(--flade); border:1px solid var(--linje); border-radius:12px; padding:14px 16px}
.side-boks h3{font-size:12px; text-transform:uppercase; letter-spacing:.08em; color:var(--dæmp); margin-bottom:8px}
.side-boks ul{list-style:none; margin:0; padding:0}
.side-boks li{padding:7px 0; border-bottom:1px solid var(--linje2); font-size:14.5px; line-height:1.35}
.side-boks li:last-child{border-bottom:0}
.side-boks li small{display:block; color:var(--dæmp2); font-size:12px; margin-top:2px}
.side-boks li.bs-kat small{display:inline; margin:0 0 0 2px}
.side-boks li.aktiv a{color:var(--blæk); font-weight:650}
.side-boks.cta{background:var(--grøn); border-color:var(--grøn); color:var(--på-grøn)}
.side-boks.cta h3{color:var(--på-grøn); opacity:.8}
.side-boks.cta p{font-size:14.5px; margin:0 0 10px}
.side-boks.cta a{color:var(--på-grøn); font-weight:650; text-decoration:underline}
.indlæg-kort{display:block; background:var(--flade); border:1px solid var(--linje); border-radius:12px; padding:20px 22px; margin-bottom:14px; color:var(--blæk)}
.indlæg-kort:hover{border-color:var(--grøn); text-decoration:none}
.indlæg-kort h2{font-size:21px; color:var(--grøn); margin:6px 0 8px}
.indlæg-kort p{color:var(--dæmp); margin:0; font-size:15px}
.indlæg-kort .art-meta{margin-top:0}

/* ---------------- print selv ---------------- */
.ps-net{display:grid; grid-template-columns:repeat(auto-fill,minmax(270px,1fr)); gap:12px}
.ps-kort{display:grid; grid-template-columns:auto 1fr; gap:14px; align-items:center; background:var(--flade); border:1px solid var(--linje); border-radius:12px; padding:14px 16px; color:var(--blæk)}
.ps-kort:hover{border-color:var(--grøn); text-decoration:none}
.ps-kort svg{display:block}
.ps-kort h3{color:var(--grøn); font-size:16px}
.ps-kort p{font-size:13.5px; color:var(--dæmp); margin:3px 0 4px; line-height:1.4}
.ps-kort .fmt{font-size:11.5px; color:var(--dæmp2)}
.ps-detalje{display:grid; grid-template-columns:320px minmax(0,1fr); gap:22px; align-items:start}
.ps-valg{position:sticky; top:58px}
.fh{padding:0 0 12px}   /* ingen mørk boks om arket: arket får hele bredden (skaleres efter beholderens bredde) */
.fh-ramme{position:relative; overflow:hidden; box-shadow:0 10px 28px -12px rgba(15,22,19,.55); background:#fff; margin:0 auto}
.fh-skala{position:absolute; left:0; top:0; transform-origin:0 0}
.fh-note{font-size:13px; color:var(--dæmp); text-align:center; margin:10px 0 0}

/* ---------------- dialoger ---------------- */
dialog{border:1px solid var(--linje); border-radius:14px; padding:0; max-width:460px; width:calc(100% - 28px); color:var(--blæk); background:var(--flade); box-shadow:0 24px 60px -20px rgba(15,22,19,.6)}
dialog::backdrop{background:rgba(15,22,19,.5)}
dialog .d-hoved{padding:14px 18px; border-bottom:1px solid var(--linje); display:flex; justify-content:space-between; align-items:center; gap:12px}
dialog .d-hoved h2{font-size:17px}
dialog .d-krop{padding:14px 18px 18px}
dialog .grk{display:flex; justify-content:space-between; gap:14px; padding:7px 0; border-bottom:1px solid var(--linje2); font-size:14px}
dialog .grk:last-child{border-bottom:none}
kbd{font-family:var(--mono); font-size:11.5px; background:var(--flade2); border:1px solid var(--linje); border-bottom-width:2px; border-radius:4px; padding:1px 6px; color:var(--dæmp)}
.pv-valg{display:grid; grid-template-columns:1fr 1fr; gap:10px; margin:4px 0 14px}
.pv-valg label{position:relative; border:1.5px solid var(--linje); border-radius:12px; padding:14px 10px 12px; cursor:pointer; display:flex; flex-direction:column; gap:8px; align-items:center; text-align:center; font-size:14px; line-height:1.3}
.pv-valg label b{font-size:15px}
.pv-valg label span{color:var(--dæmp); font-size:12.5px}
.pv-valg input{position:absolute; opacity:0; pointer-events:none}
.pv-valg label.valgt{border-color:var(--grøn); background:var(--grøn-b)}
.pv-valg label.valgt b{color:var(--grøn)}
.pv-år{display:flex; align-items:center; gap:10px; margin-bottom:14px; font-size:14px}
.pv-år select{padding:7px 10px; border:1px solid var(--linje); border-radius:8px; background:var(--flade)}

/* ---------------- fod ---------------- */
footer{background:#0F1613; color:#BFC9C4; padding:36px 0 28px; font-size:14px}
footer .wrap{max-width:1180px}
.fod-top{display:grid; grid-template-columns:1.35fr repeat(4,1fr); gap:26px}
.fod-om .logo{color:#fff; font-size:22px; display:inline-block; margin-bottom:10px}
.fod-om .logo .mrk{color:#fff}
.fod-om .logo .grn{color:var(--grøn-l)}
.fod-om p{color:#9AA6A0; font-size:14px; line-height:1.55; margin-bottom:12px}
.fod-om .kontakt{color:#fff}
.fod-om .kontakt a{color:var(--grøn-l); font-weight:600}
.fod-net h3{color:#fff; font-size:13px; font-weight:650; margin-bottom:10px; letter-spacing:.02em}
.fod-net ul{list-style:none; margin:0; padding:0}
.fod-net li{margin-bottom:7px}
.fod-net a{color:#BFC9C4; font-size:14px}
.fod-net a:hover{color:#fff}
.fod-bund{border-top:1px solid #26312C; margin-top:28px; padding-top:18px; display:flex; flex-wrap:wrap; gap:8px 22px; justify-content:space-between; align-items:center; color:#8A958F; font-size:12.5px}
.fod-bund a{color:#BFC9C4}
.fod-bund .links{display:flex; gap:6px 18px; flex-wrap:wrap}

/* =============================================================
   PRINT-ARK (bruges både i forhåndsvisning og ved udskrift)
   ============================================================= */
.ark{position:relative; box-sizing:border-box; background:#fff; color:#141A17; overflow:hidden; font-family:var(--sans); font-size:9pt; line-height:1.3;
  -webkit-print-color-adjust:exact; print-color-adjust:exact; break-after:page; page-break-after:always; display:flex; flex-direction:column; text-align:left}
.ark:last-child{break-after:auto; page-break-after:auto}
.ark-L{width:297mm; height:210mm; padding:8mm 9mm 7mm}
.ark-P{width:210mm; height:297mm; padding:9mm 10mm 9mm}
.ark h4{margin:0; font-weight:700}
.ark-top{display:flex; align-items:center; gap:5mm; border-bottom:.5mm solid #06674A; padding-bottom:1.8mm; margin-bottom:3mm; flex:0 0 auto}
.ark-logo{font-weight:800; font-size:13pt; letter-spacing:-.03em; flex:0 0 auto}
.ark-logo .mrk{color:#000}
.ark-logo .grn{color:#06674A}
.ark-logo .dk{color:#59655F; font-weight:500}
.ark-titel{flex:1 1 auto; font-size:12.5pt; font-weight:700; text-align:center}
.ark-link{flex:0 0 auto; font-size:7.5pt; color:#06674A; text-decoration:none; text-align:right}
.ark-link b{font-weight:700}
.ark-krop{flex:1 1 auto; min-height:0; display:flex; flex-direction:column; gap:3mm}
.linjer{--l:7mm; flex:1 1 auto; min-height:calc(var(--n,3) * var(--l)); background:repeating-linear-gradient(to bottom,transparent 0,transparent calc(var(--l) - .25mm),#C9D2CD calc(var(--l) - .25mm),#C9D2CD var(--l))}
.tjk-liste{display:flex; flex-direction:column}
.tjk{display:flex; align-items:flex-end; gap:2mm; height:7.4mm; border-bottom:.25mm solid #C9D2CD; font-size:9pt; flex:0 0 auto}
.tjk i{width:3.6mm; height:3.6mm; border:.3mm solid #06674A; border-radius:.6mm; flex:0 0 auto; margin-bottom:1.2mm}
.tjk span{padding-bottom:1mm}
/* årskalender */
.pa-gitter{flex:1; display:grid; gap:1.2mm; min-height:0}
.pa-12{grid-template-columns:repeat(12,minmax(0,1fr))}
.pa-6{grid-template-columns:repeat(6,minmax(0,1fr)); gap:2.5mm}
.pa-m{display:grid; grid-template-rows:auto repeat(31,minmax(0,1fr)) auto; border:.25mm solid #9AA6A0; min-height:0}
.pa-f{text-align:center; background:#EDF0EE; border-top:.25mm solid #9AA6A0; padding:.6mm 0 .5mm; font-size:6.2pt; line-height:1.15; color:#59655F; white-space:nowrap; overflow:hidden}
.pa-f b{color:#141A17; font-weight:700}
.pa-6 .pa-f{font-size:7.5pt}
.pa-h{text-align:center; background:#EDF0EE; border-bottom:.25mm solid #9AA6A0; padding:.8mm 0 .7mm; line-height:1.12}
.pa-h b{display:block; font-size:8.5pt}
.pa-h span{font-size:6.2pt; color:#59655F}
.pa-6 .pa-h b{font-size:10.5pt}
.pa-6 .pa-h span{font-size:7.5pt}
.pa-d{display:grid; grid-template-columns:2.4mm 3.5mm minmax(0,1fr) auto; align-items:center; column-gap:.5mm; padding:0 .7mm; border-top:.1mm solid #DCE2DE; font-size:6.5pt; line-height:1; overflow:hidden; font-variant-numeric:tabular-nums}
.pa-6 .pa-d{grid-template-columns:3.4mm 5mm minmax(0,1fr) auto; font-size:8.6pt; padding:0 1.3mm}
.pa-d .l{color:#8A958F; font-size:.84em; text-align:center; padding-left:.55mm}
.pa-d .n{font-weight:700; text-align:right}
.pa-d .t{font-size:.8em; white-space:nowrap; overflow:hidden; color:#59655F}
.pa-d .u{font-weight:800}
.pa-d.we{background:#E6EBE8}
.pa-d.hd{background:#FAEEDC}
.pa-d.hd .t,.pa-d.hd .n{color:#8F5408}
.pa-d.fl .t{color:#1B4A9B}
.pa-d.tom{background:repeating-linear-gradient(135deg,#fff 0 .9mm,#EEF1EF .9mm 1.8mm)}
/* kalender (12 gitre) */
.kg-net{flex:1; display:grid; grid-template-columns:repeat(4,1fr); grid-template-rows:repeat(3,1fr); gap:3mm 5mm; min-height:0}
.kg-m{display:flex; flex-direction:column; min-height:0}
.kg-t{font-weight:800; font-size:10pt; color:#06674A; margin-bottom:.6mm}
.kg-g{display:grid; grid-template-columns:5.5mm repeat(7,1fr); grid-template-rows:auto repeat(6,1fr); flex:1; font-size:7.6pt; text-align:center; align-items:center; border-top:.25mm solid #9AA6A0; font-variant-numeric:tabular-nums; min-height:0}
.kg-h{font-size:5.8pt; color:#8A958F; font-weight:700; padding:.4mm 0}
.kg-u{font-size:6pt; color:#06674A; font-weight:700}
.kg-d.we{color:#8A958F}
.kg-d.hd{background:#FAEEDC; color:#8F5408; font-weight:800; border-radius:.8mm}
.kg-n{font-size:6pt; color:#59655F; min-height:5mm; margin-top:.5mm; line-height:1.25}
.p-leg{display:flex; gap:5mm; font-size:7pt; color:#59655F; flex:0 0 auto}
.p-leg i{display:inline-block; width:3mm; height:3mm; vertical-align:-.5mm; margin-right:1.2mm; border:.2mm solid #bbb}
.p-leg i.hd{background:#FAEEDC}
.p-leg i.we{background:#E6EBE8}
/* månedskalender */
.mk-g{flex:1; display:grid; grid-template-columns:11mm repeat(7,1fr); min-height:0; border-left:.25mm solid #9AA6A0; border-top:.25mm solid #9AA6A0}
.mk-h{font-size:8.5pt; font-weight:700; text-align:center; padding:1.2mm 0; background:#EDF0EE; border-right:.25mm solid #9AA6A0; border-bottom:.25mm solid #9AA6A0}
.mk-u{font-size:6.5pt; color:#06674A; text-align:center; padding-top:1.4mm; border-right:.25mm solid #9AA6A0; border-bottom:.25mm solid #9AA6A0; background:#F4F6F4}
.mk-u b{display:block; font-size:11pt}
.mk-d{border-right:.25mm solid #9AA6A0; border-bottom:.25mm solid #9AA6A0; padding:1.2mm 1.6mm; overflow:hidden; min-height:0}
.mk-n{font-size:13pt; font-weight:700; font-variant-numeric:tabular-nums}
.mk-t{display:block; font-size:7.2pt; color:#8F5408; line-height:1.2; margin-top:.5mm; font-weight:600}
.mk-d.we{background:#F1F3F2}
.mk-d.hd{background:#FDF4E7}
.mk-d.hd .mk-n{color:#8F5408}
.mk-d.ude{color:#C9D2CD; background:#FAFBFA}
.mk-d.ude .mk-t{display:none}
/* årshjul */
.hj-ark{flex:1; display:grid; grid-template-columns:180mm 1fr; gap:6mm; min-height:0}
.hj-hjul svg{width:180mm; height:180mm; display:block}
.hj-side{display:flex; flex-direction:column; min-height:0}
.hj-side h4{font-size:9pt; margin:0 0 1.2mm; color:#06674A}
.hj-leg,.hj-l{list-style:none; margin:0 0 3mm; padding:0; font-size:7.6pt}
.hj-l li{display:flex; gap:2mm; padding:.35mm 0; border-bottom:.1mm solid #E4E9E6}
.hj-l b{min-width:15mm; font-weight:700; flex:0 0 auto}
.hj-leg li{display:flex; align-items:center; gap:2mm; margin-bottom:.8mm}
.hj-leg i{width:3mm; height:3mm; display:inline-block; flex:0 0 auto}
.årshjul .hj-f{fill:#0A3D2A; font-size:11px; font-weight:700; font-family:var(--sans); letter-spacing:.02em}
.årshjul .hj-m{font-size:13px; font-weight:700; fill:#fff; font-family:var(--sans)}
.årshjul .hj-u{font-size:8.5px; fill:#3F4A45; font-family:var(--sans); font-weight:600}
.årshjul .hj-q{font-size:11px; fill:#B5BEB9; font-weight:700; letter-spacing:.05em; font-family:var(--sans)}
.årshjul .hj-år{font-size:48px; font-weight:800; fill:#fff; font-family:var(--sans)}
.årshjul .hj-logo{font-size:14px; font-weight:800; font-family:var(--sans)}
.årshjul .hj-sub{font-size:10px; fill:#9AA6A0; font-family:var(--sans)}
/* tabeller på print */
.p-intro{font-size:9.5pt; color:#3F4A45; margin:0}
.p-tab{width:100%; border-collapse:collapse; font-size:8.6pt}
.p-tab th{text-align:left; font-weight:700; font-size:7.8pt; color:#59655F; border-bottom:.35mm solid #06674A; padding:1.2mm 1.5mm; background:none; white-space:nowrap}
.p-tab td{padding:1.3mm 1.5mm; border-bottom:.15mm solid #DCE2DE; vertical-align:top; white-space:normal}
.p-tab .n{text-align:right; font-variant-numeric:tabular-nums}
.p-tab tr.hd td{background:#FDF4E7}
.p-tab tr.nu td{background:#E3F1EB}
.p-kompakt td{padding:.85mm 1.4mm}
.pn{font-size:7.2pt; color:#59655F; margin-top:.3mm}
.p-2kol{display:grid; grid-template-columns:1fr 1fr; gap:6mm; align-items:start}
.p-3kol{display:grid; grid-template-columns:repeat(3,1fr); gap:5mm}
.p-h4{font-size:9.5pt; color:#06674A; margin-top:1mm !important}
.p-note{font-size:7.5pt; color:#59655F; margin:auto 0 0}
.p-tl{display:flex; flex-direction:column; gap:1.2mm}
.p-tl-rk{display:grid; grid-template-columns:40mm 1fr; gap:3mm; align-items:center; font-size:7.8pt}
.p-tl-bar{position:relative; height:3.4mm; background:#EDF0EE; border-radius:.8mm}
.p-tl-bar i{position:absolute; top:0; bottom:0; background:#0A8A63; border-radius:.8mm}
.p-tl-mdr{display:grid; grid-template-columns:repeat(12,1fr); font-size:6.5pt; color:#8A958F; text-align:center}
/* ugeplan */
.up{flex:1; display:grid; grid-template-columns:repeat(7,minmax(0,1fr)) 50mm; gap:2mm; min-height:0}
.up-d{display:flex; flex-direction:column; border:.25mm solid #9AA6A0; border-radius:1mm; overflow:hidden; min-height:0}
.up-h{background:#06674A; color:#fff; padding:1.3mm 1.6mm; line-height:1.18; flex:0 0 auto}
.up-h b{display:block; font-size:10pt}
.up-h span{font-size:8pt; opacity:.92}
.up-h em{display:block; font-style:normal; font-size:7pt; color:#FCE7C5; font-weight:600}
.up-d.we .up-h{background:#3F4A45}
.up-d.hd .up-h{background:#8F5408}
.up-d .linjer{margin:0 1.6mm}
.up-s{display:flex; flex-direction:column; gap:2mm; min-height:0}
.up-bx{border:.25mm solid #9AA6A0; border-radius:1mm; padding:1.6mm 2mm; display:flex; flex-direction:column; flex:0 0 auto}
.up-bx h4{margin:0 0 1mm; font-size:9pt; color:#06674A}
.up-fyld{flex:1 1 auto; min-height:0}
/* madplan */
.mp{width:100%; border-collapse:collapse; flex:0 0 auto}
.mp th,.mp td{border:.25mm solid #9AA6A0; white-space:normal}
.mp thead th{background:#06674A; color:#fff; font-size:9pt; padding:1.5mm; font-weight:700; text-align:center}
.mp thead th:first-child{background:#fff; border-color:transparent transparent #9AA6A0 transparent}
.mp tbody th{width:26mm; text-align:left; padding:1.6mm 2mm; background:#F4F6F4; font-weight:400; vertical-align:top; color:#141A17}
.mp tbody th b{display:block; font-size:10pt}
.mp tbody th span{font-size:8pt; color:#59655F}
.mp td{height:21mm}
.mp-ind{flex:1; border:.25mm solid #9AA6A0; border-radius:1mm; padding:2mm 3mm; display:flex; flex-direction:column; min-height:0}
.mp-ind h4{margin:0 0 1mm; color:#06674A; font-size:10pt}
/* huskeliste */
.hl-top{display:flex; gap:3mm; align-items:flex-end; font-size:10pt; margin-bottom:2mm}
.hl-top i{flex:1; border-bottom:.3mm solid #9AA6A0; height:6mm}
.hl h4{font-size:11pt; color:#06674A; margin-bottom:1mm}
.hl .tjk{height:9mm}
/* vanetracker */
.vt{width:100%; border-collapse:collapse; table-layout:fixed; font-size:7pt; flex:0 0 auto}
.vt th,.vt td{border:.2mm solid #B5BEB9; text-align:center; padding:0; white-space:nowrap}
.vt thead th{padding:.7mm 0; font-weight:700; background:#F4F6F4; color:#3F4A45; font-size:6.8pt}
.vt .vt-navn{width:46mm; text-align:left; padding-left:2mm}
.vt tbody td{height:10.2mm}
.vt .we{background:#E6EBE8}
.vt th.hd{background:#FAEEDC; color:#8F5408}
.vt-bund{display:grid; grid-template-columns:1fr 1fr; gap:6mm; flex:1; min-height:0}
.vt-bund h4{margin:0 0 1mm; font-size:9pt; color:#06674A}
.vt-bund > div{display:flex; flex-direction:column}
/* fødselsdage */
.fd-net{flex:1; display:grid; grid-template-columns:repeat(3,1fr); grid-template-rows:repeat(4,1fr); gap:4mm; min-height:0}
.fd-m{border:.25mm solid #9AA6A0; border-radius:1.5mm; padding:2mm 3mm; display:flex; flex-direction:column; min-height:0}
.fd-m h4{margin:0 0 1mm; color:#06674A; font-size:11pt}
.fd-m .linjer{--l:6.4mm}
/* pakkeliste */
.pk{flex:1; columns:3; column-gap:6mm}
.pk-g{break-inside:avoid; margin-bottom:4mm}
.pk-g h4{margin:0 0 1mm; color:#06674A; font-size:10pt; border-bottom:.4mm solid #06674A; padding-bottom:.7mm}
.pk .tjk{height:6.6mm; font-size:8.6pt}

/* ---------------- ikonknapper i headeren ---------------- */
.ikon-knap{width:30px; height:30px; border-radius:50%; border:1px solid var(--linje); background:var(--flade); color:var(--blæk); display:inline-flex; align-items:center; justify-content:center; cursor:pointer; flex:0 0 auto; padding:0}
.ikon-knap[hidden]{display:none}
/* "Hent app" (installér siden som app) — vises af app.js, når browseren kan installere siden; i headeren kun på pc */
.hent-app{align-self:center; flex:0 0 auto; display:inline-flex; align-items:center; gap:6px; height:30px; padding:0 12px 0 10px; border-radius:99px;
  border:1px solid var(--linje); background:var(--flade); color:var(--blæk); font:inherit; font-size:13px; font-weight:600; line-height:1; white-space:nowrap; cursor:pointer}
.hent-app svg{color:var(--grøn); flex:0 0 auto}
.hent-app:hover{border-color:var(--grøn); color:var(--grøn)}
.hent-app:focus-visible{outline:2px solid var(--grøn); outline-offset:2px}
.hent-app[hidden]{display:none}
@media (max-width:1199px){ .hent-app{display:none} }
@media (min-width:1700px){ .hent-app{height:34px; font-size:14.5px; padding:0 14px 0 12px} }
/* plads til knappen: lidt smallere søgefelt og faner, så alle syv faner og hele teksten i søgefeltet stadig kan stå */
@media (min-width:1200px){
  .top .wrap:has(.hent-app:not([hidden])) .kmd{flex-basis:228px}
  .top .wrap:has(.hent-app:not([hidden])) .fane-liste a{padding:0 9px}
  .top .wrap:has(.hent-app:not([hidden])) .fane-liste a::after{left:9px; right:9px}
}
@media (min-width:1700px){
  .top .wrap:has(.hent-app:not([hidden])) .kmd{flex-basis:290px}
  .top .wrap:has(.hent-app:not([hidden])) .fane-liste a{padding:0 12px}
  .top .wrap:has(.hent-app:not([hidden])) .fane-liste a::after{left:12px; right:12px}
}
.fod-app[hidden]{display:none}
.fod-net .fod-app button{background:none; border:0; padding:0; margin:0; font:inherit; font-size:14px; color:#BFC9C4; cursor:pointer; text-align:left}
.fod-net .fod-app button:hover{color:#fff}
.fod-net .fod-app button:focus-visible{outline:2px solid #BFC9C4; outline-offset:2px}
.ikon-knap:hover{border-color:var(--grøn); color:var(--grøn)}
.ikon-knap.tale{background:var(--grøn); border-color:var(--grøn); color:var(--på-grøn)}
.ikon-knap.tale:hover{background:var(--grøn-hover); color:var(--på-grøn)}
.ikon-knap.tale.taler{animation:puls 1.1s ease-in-out infinite}
@keyframes puls{0%,100%{box-shadow:0 0 0 0 rgba(10,138,99,.5)} 50%{box-shadow:0 0 0 7px rgba(10,138,99,0)}}
.ikon-knap .ik-sol{display:none}
html[data-tema="mork"] .ikon-knap .ik-sol{display:block}
html[data-tema="mork"] .ikon-knap .ik-maane{display:none}

/* ---------------- scroll-bjælke og til toppen ---------------- */
.laesebar{position:fixed; top:0; left:0; right:0; height:3px; background:var(--grøn-m); transform:scaleX(0); transform-origin:0 50%; z-index:300; pointer-events:none}
.til-top{position:fixed; right:18px; bottom:calc(18px + env(safe-area-inset-bottom, 0px)); width:44px; height:44px; border-radius:50%; border:0; background:var(--grøn); color:var(--på-grøn);
  display:flex; align-items:center; justify-content:center; cursor:pointer; z-index:120; box-shadow:0 8px 22px -8px rgba(0,0,0,.5);
  opacity:0; visibility:hidden; transform:translateY(10px); transition:opacity .25s, transform .25s, visibility 0s .25s}
.til-top.vis{opacity:1; visibility:visible; transform:none; transition:opacity .25s, transform .25s}
.til-top:hover{background:var(--grøn-hover)}

/* ---------------- skift mellem lyst og mørkt tema ---------------- */
/* Hele siden tones over som ét billede. Imens slås elementernes egne overgange fra,
   så den nye side står færdig med det samme under overtoningen. */
::view-transition-group(root),::view-transition-old(root),::view-transition-new(root){animation-duration:.26s; animation-timing-function:cubic-bezier(.4,0,.2,1)}
html.tema-vt *,html.tema-vt *::before,html.tema-vt *::after{transition:none !important}

/* ---------------- indtoning ved sideskift ---------------- */
@keyframes ind-fade{from{opacity:0; transform:translateY(6px)} to{opacity:1; transform:none}}
#indhold.ind-fade{animation:ind-fade .32s ease both}

/* ---------------- signaturforklaring ---------------- */
.plan-forklar i.f-we{background:var(--flade3)}
.plan-forklar i.f-hd{background:var(--rav-b); border-color:var(--rav)}
.plan-forklar i.f-fl{background:var(--blå); border-color:var(--blå)}
.plan-forklar i.f-uge{background:transparent; border:2px solid var(--grøn)}
.plan-forklar i.f-nu{background:var(--grøn); border-color:var(--grøn)}

/* ---------------- Solopgang og solnedgang ---------------- */
/* Himlen går fra kant til kant lige under headeren (siden har egen opbygning) */
.sol-fuld{width:100%}
/* brødkrumme, titel og beskrivelse oven på himlen — hvid tekst med skygge kan læses både dag og nat */
.sol-hoved{color:#fff; text-shadow:0 1px 3px rgba(4,8,24,.55), 0 0 18px rgba(4,8,24,.35)}
.sol-hoved a{pointer-events:auto}
.sol-hoved .krumme{padding:0; color:rgba(255,255,255,.86)}
.sol-hoved .krumme a{color:#fff}
.sol-hoved .krumme li::after{color:rgba(255,255,255,.6)}
.sol-hoved h1{margin:10px 0 0; color:#fff; font-size:clamp(26px,4vw,36px)}
.sol-hoved h1:focus{outline:none}
.sol-hoved .intro{margin:8px 0 0; max-width:none; color:rgba(255,255,255,.94); font-size:15.5px; line-height:1.5}
/* Soltider-tabellen og Dagslys i Danmark side om side (Dagslys til højre) */
.sol-par{display:grid; grid-template-columns:minmax(0,1fr); gap:0 44px; align-items:start}
@media (min-width:1180px){ .sol-par{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr)} }
/* soltabellen: tallene centreret, tætte kolonner og ingen vandret rulning */
.sol-tabel th,.sol-tabel td{padding:7px 4px; text-align:center; font-variant-numeric:tabular-nums}
.sol-tabel th{white-space:normal; line-height:1.25; vertical-align:bottom}
.sol-tabel th:first-child,.sol-tabel td:first-child{text-align:left; padding-left:12px}
.sol-tabel td:first-child{white-space:nowrap}
.sol-tabel .dim{color:var(--dæmp); font-weight:400; font-size:12.5px; white-space:nowrap}
.sol-tabel .k{display:none}
@media (max-width:600px){
  .sol-tabel .l{display:none} .sol-tabel .k{display:inline}
  .sol-tabel th,.sol-tabel td{padding:6px 3px; font-size:12.5px}
  .sol-tabel th:first-child,.sol-tabel td:first-child{padding-left:8px; white-space:normal}
}
.sol-tabel tr.ny-gruppe td{border-top:2px solid var(--linje)}
/* Sådan læser du lyset i (i)-boksen ved titlen i himlen */
.sol-info h2.sol-info-t{font-size:18px; margin:0 0 6px}
.sol-info p{margin:0 0 4px; color:var(--dæmp)}
.sol-info .ly-dl{margin:8px 0 0}
.sol-info .ly-dl div{grid-template-columns:minmax(0,9rem) minmax(0,1fr); padding:9px 0; gap:2px 16px}
@media (max-width:600px){ .sol-info .ly-dl div{grid-template-columns:1fr} }
/* blogboks med et stillbillede af himlen */
.sol-glimt{display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,1fr); margin:22px 0 24px; border:1px solid var(--linje); border-radius:14px; overflow:hidden; background:var(--flade); color:var(--blæk)}
.sol-glimt:hover{text-decoration:none; border-color:var(--grøn); box-shadow:0 14px 34px -22px rgba(0,0,0,.45)}
.sol-glimt lysaar-glimt{display:block; min-height:196px; overflow:hidden; --bg:var(--flade); --sil:#1A2246}
html[data-tema="mork"] .sol-glimt lysaar-glimt{--sil:#060A1E}
.sol-glimt-tekst{display:flex; flex-direction:column; justify-content:center; gap:6px; padding:18px 22px}
.sol-glimt-tekst b{font-size:18px; line-height:1.25}
.sol-glimt-tekst span{color:var(--dæmp); font-size:14.5px}
.sol-glimt-tekst .pil{color:var(--grøn); font-weight:650; margin-top:4px}
@media (max-width:600px){ .sol-glimt{grid-template-columns:1fr} .sol-glimt lysaar-glimt{min-height:150px} }
lysaar-app{display:block; scroll-margin-top:56px}
lysaar-app:not(:defined){min-height:70vh}
#sol-kortplads .sol-kort{margin-bottom:0}
.sol-kort{display:grid; grid-template-columns:minmax(0,1.35fr) minmax(250px,1fr); gap:18px 28px; align-items:center; background:var(--flade); border:1px solid var(--linje); border-left:4px solid #E8A33D; border-radius:14px; padding:18px 22px; margin-bottom:26px}
.sol-sted b{display:block; font-size:24px; letter-spacing:-.015em; line-height:1.15}
.sol-sted span{display:block; color:var(--dæmp); font-size:13.5px}
.sol-tider{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin:14px 0 12px}
.sol-t{background:var(--flade2); border-radius:12px; padding:10px 12px 11px}
.sol-t svg{display:block; margin-bottom:5px}
.sol-t span{display:block; font-size:12.5px; color:var(--dæmp)}
.sol-t b{display:block; font-family:var(--mono); font-size:25px; letter-spacing:-.03em; font-variant-numeric:tabular-nums; line-height:1.15}
.sol-t.op svg{color:#C97A10} .sol-t.ned svg{color:#C4502B} .sol-t.lys svg{color:var(--grøn)}
.sol-fakta{list-style:none; margin:0; padding:0; display:grid; gap:5px; font-size:14px; color:var(--dæmp)}
.sol-fakta b{color:var(--blæk); font-variant-numeric:tabular-nums}
.sol-bue svg{display:block; width:100%; max-width:340px; height:auto; margin:0 auto}
.sol-bue .bane{fill:none; stroke:var(--linje); stroke-width:2; stroke-dasharray:3 5}
.sol-bue .gået{fill:none; stroke:#E8A33D; stroke-width:3.5; stroke-linecap:round}
.sol-bue .horisont{stroke:var(--dæmp2); stroke-width:1.2}
.sol-bue .sol{fill:#F2B13A; filter:drop-shadow(0 0 7px rgba(242,177,58,.85))}
.sol-bue .sol.nede{fill:var(--dæmp2); filter:none}
.sol-bue text{font-size:12px; fill:var(--dæmp); font-family:var(--sans); font-variant-numeric:tabular-nums}
.sol-bue p{margin:4px 0 0; text-align:center; font-size:14.5px; font-weight:600}
.sol-graf{position:relative; border-radius:10px; outline:none}
.sol-graf:focus-visible{box-shadow:0 0 0 3px var(--grøn-b)}
.sol-svg{display:block; width:100%; height:auto; overflow:visible}
.sol-flade{fill:#F5C451; opacity:.24}
.sol-op{fill:none; stroke:#C97A10; stroke-width:2.2; stroke-linejoin:round}
.sol-ned{fill:none; stroke:#C4502B; stroke-width:2.2; stroke-linejoin:round}
.sol-st{fill:var(--blå-b); opacity:.6}
.sol-mærke{stroke:var(--dæmp2); stroke-dasharray:3 4}
.sol-mærke-t{font-size:13.5px; font-weight:600; fill:var(--dæmp); font-family:var(--sans)}
.sol-idag{stroke:var(--grøn); stroke-width:2}
.sol-idag-p{stroke:var(--flade); stroke-width:2}
.sol-idag-p.op,#sol-hop{fill:#C97A10} .sol-idag-p.ned,#sol-hned{fill:#C4502B}
.sol-idag-t{font-size:13.5px; font-weight:700; fill:var(--grøn); font-family:var(--sans)}
.sol-hover line{stroke:var(--blæk); stroke-opacity:.5; stroke-dasharray:2 3}
.sol-hover circle{stroke:var(--flade); stroke-width:2}
.sol-flade-hit{fill:transparent; cursor:crosshair; touch-action:pan-y}
.sol-tip{position:absolute; top:6px; pointer-events:none; background:var(--flade); border:1px solid var(--linje); border-radius:10px; box-shadow:0 12px 28px -12px rgba(0,0,0,.35); padding:9px 12px; font-size:13px; min-width:196px; z-index:5}
.sol-tip[hidden]{display:none}
.sol-tip b{display:block; font-size:13.5px; margin-bottom:5px}
.sol-tip div{display:flex; justify-content:space-between; gap:16px; font-variant-numeric:tabular-nums}
.sol-tip span{color:var(--dæmp)}
.sol-leg{display:flex; flex-wrap:wrap; gap:6px 18px; font-size:12.5px; color:var(--dæmp); margin-top:10px}
.sol-leg i{display:inline-block; width:14px; height:3px; vertical-align:middle; margin-right:6px; border-radius:2px}
.sol-leg i.sol-leg-lys{height:10px; background:#F5C451; opacity:.45}
.sol-leg i.sol-leg-st{height:10px; background:var(--blå-b); border:1px solid var(--blå)}
.sol-år{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px}
.sol-år div{background:var(--flade); border:1px solid var(--linje); border-radius:12px; padding:12px 14px}
.sol-år span{display:block; font-size:12.5px; color:var(--dæmp)}
.sol-år b{display:block; font-size:19px; margin:2px 0; font-variant-numeric:tabular-nums}
.sol-år small{color:var(--dæmp); font-size:12.5px}
.sol-tabel tr.nu td{background:var(--grøn-b); font-weight:650}
.sol-tabel .plus{color:var(--grøn)} .sol-tabel .minus{color:var(--rød)}
.by-link{font-size:13.5px}
.sol-guide h3{margin:22px 0 6px}
.sol-guide p{}
.ly-dl{margin:14px 0 0}
.ly-dl div{display:grid; grid-template-columns:minmax(0,13rem) minmax(0,1fr); gap:4px 24px; padding:13px 0; border-top:1px solid var(--linje)}
.ly-dl dt{font-weight:650}
.ly-dl dd{margin:0; color:var(--dæmp)}
.ly-note{font-size:13.5px; color:var(--dæmp); margin-top:18px}
@media (max-width:600px){ .ly-dl div{grid-template-columns:1fr} }
html[data-tema="mork"] .sol-flade{opacity:.14}
html[data-tema="mork"] .sol-op,html[data-tema="mork"] .sol-idag-p.op,html[data-tema="mork"] #sol-hop{stroke:#EDB06A}
html[data-tema="mork"] .sol-ned{stroke:#F0896A}
html[data-tema="mork"] .sol-idag-p.op,html[data-tema="mork"] #sol-hop{fill:#EDB06A; stroke:var(--flade)}
html[data-tema="mork"] .sol-idag-p.ned,html[data-tema="mork"] #sol-hned{fill:#F0896A}
@media (max-width:900px){ .sol-kort{grid-template-columns:1fr} .sol-år{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:460px){ .sol-tider{grid-template-columns:1fr 1fr} .sol-t.lys{grid-column:1 / -1} .sol-t b{font-size:22px} .sol-kort{padding:14px} }

/* ---------------- Uge nr. ---------------- */
.uge-helt{display:grid; grid-template-columns:auto minmax(0,1fr); gap:22px; align-items:center; background:var(--flade); border:1px solid var(--linje); border-left:4px solid var(--grøn); border-radius:14px; padding:18px 22px; margin:6px 0 26px}
/* den grønne ugeboks er stor og fylder hele boksens højde, så ugenummeret er det første, man ser */
.uge-stor{text-align:center; background:var(--grøn); color:var(--på-grøn); border-radius:16px; padding:24px 40px 28px; min-width:300px; align-self:stretch; display:flex; flex-direction:column; justify-content:center}
.uge-stor small{display:block; font-size:clamp(14px,1.5vw,19px); letter-spacing:.12em; text-transform:uppercase; font-weight:700; opacity:.85}
.uge-stor b{display:block; font-family:var(--mono); font-size:clamp(112px,14vw,176px); line-height:1; letter-spacing:-.05em; margin:8px 0 12px}
.uge-stor span{display:block; font-size:clamp(15px,1.6vw,21px); font-weight:600}
/* andre år ("2027 har 52 uger"): den mindre boks, så den passer til de fire fakta ved siden af */
.uge-helt-år .uge-stor{padding:12px 22px 14px; min-width:150px; align-self:center; border-radius:12px}
.uge-helt-år .uge-stor small{font-size:12px}
.uge-helt-år .uge-stor b{font-size:clamp(56px,9vw,88px); margin:4px 0 6px}
.uge-helt-år .uge-stor span{font-size:13px}
.uge-fakta{min-width:0}
.uge-fakta .fakta{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin:12px 0}
.uge-fakta .fakta div{background:var(--flade2); border-radius:10px; padding:10px 12px}
.uge-fakta .fakta b{display:block; font-family:var(--mono); font-size:22px; font-weight:700; color:var(--grøn); letter-spacing:-.02em}
.uge-fakta .fakta b a{color:inherit}
.uge-fakta .fakta span{display:block; font-size:12.5px; color:var(--dæmp); line-height:1.3; margin-top:2px}
.uge-ur div{padding:8px 6px}
.uge-ur b{font-size:clamp(20px,3vw,26px)}
@media (max-width:900px){ .uge-fakta .fakta{grid-template-columns:repeat(2,minmax(0,1fr))} }
.uge-fremskridt div{height:10px; background:var(--flade3); border-radius:6px; overflow:hidden}
.uge-fremskridt i{display:block; height:100%; background:var(--grøn-m); border-radius:6px}
.uge-fremskridt span{display:block; font-size:13px; color:var(--dæmp); margin-top:5px}
.uge-ur{margin:4px 0 6px}
.uge-find{display:flex; flex-wrap:wrap; align-items:center; gap:10px 14px}
.uge-find label{font-weight:600}
.uge-find input{padding:8px 10px; border:1px solid var(--linje); border-radius:8px; background:var(--flade); color:var(--blæk); font:inherit}
#uge-svar{font-size:15.5px}
.uge-tabel tr.nu td{background:var(--grøn-b)}
/* tabellen "Alle ugenumre i …": 20 % lavere rækker */
.uge-tabel td{padding-top:4.4px; padding-bottom:4.4px}
.uge-tabel td .badge{margin:0 3px 0 0; padding-top:1px; padding-bottom:1px; line-height:1.35}
.uge-mdr{display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:10px}
.uge-md{display:block; background:var(--flade); border:1px solid var(--linje); border-radius:10px; padding:10px 12px; color:var(--blæk)}
.uge-md:hover{border-color:var(--grøn); text-decoration:none}
.uge-md b{display:block; font-size:15px}
.uge-md span{font-size:13px; color:var(--dæmp)}
@media (max-width:700px){ .uge-helt{grid-template-columns:1fr; padding:14px} .uge-stor{min-width:0} }

/* ---------------- nedtællingssider og byvalg ---------------- */
.nd-ur{display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin:0 0 22px}
.nd-ur div{background:var(--flade); border:1px solid var(--linje); border-radius:12px; padding:12px 8px; text-align:center}
.nd-ur b{display:block; font-family:var(--mono); font-size:clamp(22px,4vw,32px); font-weight:700; color:var(--grøn); letter-spacing:-.03em; font-variant-numeric:tabular-nums}
.nd-ur span{font-size:12.5px; color:var(--dæmp)}
.by-vælg{display:inline-flex; align-items:center; gap:8px; margin-bottom:12px; font-size:14px; color:var(--dæmp)}
.by-vælg select{padding:5px 9px; border:1px solid var(--linje); border-radius:8px; background:var(--flade); color:var(--blæk); font:inherit}

/* ---------------- print, PDF og Excel ---------------- */
.ps-knapper{display:grid; grid-template-columns:1.25fr 1fr 1fr; gap:8px; margin-top:4px}
.ps-knapper.uden-excel{grid-template-columns:1.25fr 1fr}
.ps-knapper .knap{justify-content:center; gap:7px; padding:9px 10px}
.ps-knapper .knap:disabled{opacity:.6; cursor:progress}
.ps-status{min-height:1.4em; margin:8px 0 0; font-size:13px; color:var(--grøn); font-weight:550}
.eksport-rum{position:absolute; left:-30000px; top:0; visibility:hidden; pointer-events:none}

/* ---------------- oplæsning: besked om stemme ---------------- */
.top .wrap{position:relative}
.tale-besked{position:absolute; right:12px; top:calc(100% + 8px); width:min(360px, calc(100vw - 24px)); background:var(--flade); border:1px solid var(--linje);
  border-radius:12px; box-shadow:0 18px 40px -16px rgba(0,0,0,.35); padding:14px 16px; z-index:160; font-size:13.5px; color:var(--blæk)}
.tale-besked[hidden]{display:none}
.tale-besked b{display:block; margin-bottom:6px; font-size:14.5px}
.tale-besked p{margin:0 0 12px; color:var(--dæmp); line-height:1.5}
.tale-besked p strong{color:var(--blæk)}
.tale-besked div{display:flex; gap:8px; flex-wrap:wrap}

/* ---------------- husk / glem ---------------- */
.husk-note{font-size:13px; color:var(--dæmp); margin:-4px 0 14px; display:flex; flex-wrap:wrap; align-items:center; gap:4px 14px}
/* fluebenet "Husk … i denne browser til næste gang" (cookiereglerne: uden flueben huskes tallene kun, mens fanen er åben) */
.husk-valg{display:inline-flex; align-items:flex-start; gap:7px; cursor:pointer; line-height:1.4}
.husk-valg input{flex:0 0 auto; width:15px; height:15px; margin:1px 0 0; accent-color:var(--grøn); cursor:pointer}
.husk-valg:hover span{color:var(--blæk)}
.link-knap{background:none; border:0; padding:0; color:var(--grøn); text-decoration:underline; cursor:pointer; font:inherit}
.grundlag{display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-top:12px; font-size:13.5px; color:var(--dæmp)}

/* ---------------- nye printskabeloner ---------------- */
.td{width:100%; border-collapse:collapse; font-size:9pt; table-layout:fixed}
.td th{background:#06674A; color:#fff; font-size:8.6pt; font-weight:700; padding:1.4mm 2mm; text-align:left}
.td td{border-bottom:.25mm solid #C9D2CD; height:8.4mm; padding:0 2mm}
.td td + td{border-left:.2mm solid #E4E9E6}
.td .td-tjk{width:9mm; text-align:center}
.td td.td-tjk i{display:inline-block; width:3.8mm; height:3.8mm; border:.3mm solid #06674A; border-radius:.7mm; vertical-align:middle}
.td th:nth-child(3){width:24mm} .td th:nth-child(4){width:28mm}
.td-noter{flex:1 1 auto; display:flex; flex-direction:column; margin-top:3mm; min-height:0}
.td-noter h4,.ss-husk h4{font-size:9pt; color:#06674A; margin-bottom:1mm}
.upl{flex:1 1 auto; min-height:0; display:grid; grid-template-columns:13mm repeat(7,minmax(0,1fr)); grid-template-rows:auto repeat(16,minmax(0,1fr)); border-top:.25mm solid #9AA6A0; border-left:.25mm solid #9AA6A0}
.upl > div{border-right:.25mm solid #9AA6A0; border-bottom:.25mm solid #C9D2CD}
.upl-h{background:#06674A; color:#fff; padding:1.2mm 1.6mm; display:flex; flex-direction:column; gap:.3mm; font-size:8pt; line-height:1.15}
.upl-h b{font-size:9pt} .upl-h em{font-style:normal; font-size:7pt; opacity:.9}
.upl-h.we{background:#3D4A44} .upl-h.hd{background:#B06A0F} .upl-h.upl-tom{background:#fff}
.upl-t{font-size:7.4pt; color:#59655F; padding:.6mm 1.2mm; font-variant-numeric:tabular-nums}
.upl-c{background:linear-gradient(to bottom, transparent calc(50% - .1mm), #E4E9E6 calc(50% - .1mm), #E4E9E6 calc(50% + .1mm), transparent calc(50% + .1mm))}
.upl-c.we{background-color:#F1F4F2}
.dp{flex:1 1 auto; min-height:0; display:grid; grid-template-columns:1.15fr 1fr; gap:5mm}
.dp-tid{display:flex; flex-direction:column; min-height:0}
.dp-tid h4{font-size:9pt; color:#06674A; margin-bottom:1mm}
.dp-t{flex:1 1 0; border-top:.25mm solid #C9D2CD; font-size:8pt; color:#59655F; padding-top:.7mm; font-variant-numeric:tabular-nums}
.dp-t:last-child{border-bottom:.25mm solid #C9D2CD}
.dp-side{display:flex; flex-direction:column; gap:3mm; min-height:0}
.dp-top3 div{display:flex; align-items:flex-end; gap:2mm; height:9mm; border-bottom:.25mm solid #C9D2CD}
.dp-top3 b{color:#06674A; font-size:12pt; width:5mm}
.ss{flex:1 1 auto; min-height:0; display:grid; grid-template-columns:30mm repeat(5,minmax(0,1fr)); grid-template-rows:auto repeat(8,minmax(0,1fr)); border-top:.25mm solid #9AA6A0; border-left:.25mm solid #9AA6A0}
.ss > div{border-right:.25mm solid #9AA6A0; border-bottom:.25mm solid #9AA6A0}
.ss-h{background:#06674A; color:#fff; font-weight:700; font-size:9.5pt; padding:1.6mm 2mm; text-align:center}
.ss-l{display:flex; flex-direction:column; justify-content:center; gap:1.2mm; padding:0 2mm; background:#F4F6F4}
.ss-l b{font-size:12pt; color:#06674A}
.ss-tid{display:block; border-bottom:.25mm solid #9AA6A0; height:4mm}
.ss-husk{margin-top:3mm; display:flex; flex-direction:column}
.rp{width:100%; border-collapse:collapse; table-layout:fixed; font-size:9.5pt}
.rp th{background:#06674A; color:#fff; font-size:9pt; padding:1.6mm 2mm; text-align:center}
.rp th.rp-opg{text-align:left; width:64mm} .rp th.rp-hvem{width:30mm}
.rp td{border:.25mm solid #C9D2CD; height:10.4mm; padding:0 2mm}
.rp td.rp-d{text-align:center} .rp td.rp-d.we{background:#F1F4F2}
.rp td.rp-d i{display:inline-block; width:4.2mm; height:4.2mm; border:.3mm solid #06674A; border-radius:.8mm; vertical-align:middle}
.bu{width:100%; border-collapse:collapse; table-layout:fixed; font-size:9pt}
.bu th{text-align:left; font-size:9pt; padding:1.6mm 2mm 1mm; color:#06674A; border-bottom:.4mm solid #06674A}
.bu th + th{width:32mm; text-align:right; color:#59655F; font-weight:600; font-size:8pt}
.bu td{height:6.6mm; border-bottom:.25mm solid #E4E9E6; padding:0 2mm}
.bu td + td{border-left:.2mm solid #E4E9E6}
.bu .bu-grp th{padding-top:3.2mm}
.bu .bu-sum td{font-weight:700; border-top:.3mm solid #9AA6A0; border-bottom:.3mm solid #9AA6A0; background:#F4F6F4}
.bu-res{display:grid; grid-template-columns:1fr 32mm 32mm; gap:0 2mm; align-items:end; margin-top:4mm; padding:2.4mm 3mm; border:.4mm solid #06674A; border-radius:1.4mm}
.bu-res b{font-size:11pt; color:#06674A} .bu-res span{grid-column:1; font-size:8pt; color:#59655F}
.bu-res i{grid-row:1 / span 2; border-bottom:.3mm solid #9AA6A0; height:8mm}
.bu-res i:nth-of-type(1){grid-column:2} .bu-res i:nth-of-type(2){grid-column:3}
.øs-top{display:flex; align-items:center; justify-content:center; gap:4mm; margin:1mm 0 4mm}
.øs-top h3{margin:0; font-size:20pt; color:#06674A; letter-spacing:-.01em}
.øs-stjerne{font-size:14pt; color:#C97A10}
.øs td{height:11.6mm}
.øs .øs-nr{width:8mm; text-align:center; color:#06674A; font-weight:700}
.øs th:nth-child(3){width:48mm} .øs th:nth-child(4){width:22mm}

/* ---------------- blog: centreret kolonne, navigation til højre ---------------- */
.blog-ramme{display:grid; grid-template-columns:minmax(0,1fr) 270px; column-gap:40px; max-width:var(--maks); margin:0 auto; padding:0 16px 10px; align-items:start}
.blog-midt{grid-column:1; min-width:0}
.blog-ramme > .blog-side{grid-column:2; width:100%; max-width:none; margin-top:18px}
.art-hoved{padding:14px 0 18px}
.art-hoved h1{font-size:clamp(26px,3.3vw,34px); line-height:1.2; text-wrap:balance}
.art-hoved h1:focus{outline:none}
.art-hoved .intro{color:var(--dæmp); margin:8px 0 0; font-size:15.5px}
.art-hoved .art-meta{margin-top:10px}
.blog-side{position:sticky; top:56px; max-height:calc(100vh - 66px); display:flex; flex-direction:column}
.bs-rul{overflow-y:auto; scrollbar-width:none; -ms-overflow-style:none; min-height:0; flex:1 1 auto; display:flex; flex-direction:column; gap:14px; padding:2px; overscroll-behavior:contain}
.bs-rul::-webkit-scrollbar{display:none}
.bs-pil{position:absolute; left:50%; margin-left:-17px; width:34px; height:34px; border-radius:50%; border:1px solid var(--linje); background:var(--flade); color:var(--grøn);
  box-shadow:0 6px 16px -6px rgba(0,0,0,.35); display:flex; align-items:center; justify-content:center; cursor:pointer; z-index:2; padding:0}
.bs-pil[hidden]{display:none}
.bs-pil:hover{border-color:var(--grøn)}
.bs-pil.op{top:-6px}
.bs-pil.ned{bottom:-6px}

/* ---------------- Tiden Live ---------------- */
.tid-nu{display:flex; gap:6px 16px; justify-content:center; flex-wrap:wrap; font-size:15px; margin:0 0 14px; color:var(--dæmp)}
.tid-nu b{color:var(--blæk)}
.ur-tid-l{font-family:var(--mono); font-weight:700; color:var(--grøn); font-variant-numeric:tabular-nums}
.tid-layout{display:grid; grid-template-columns:minmax(0,500px) minmax(0,1fr); gap:28px; align-items:center; margin-bottom:26px}
.ur-ramme{width:100%; max-width:500px; margin:0 auto}
.ur{display:block; width:100%; height:auto; overflow:visible}
.ur .ur-spor{fill:none; stroke:var(--flade3)}
.ur .ur-fyld{fill:none; stroke-linecap:round}
.ur .ur-tik{stroke:var(--dæmp2); stroke-width:1}
.ur .ur-tik.lang{stroke:var(--dæmp); stroke-width:1.6}
.ur .ur-pct{fill:var(--dæmp); font-size:11px; font-weight:650; font-family:var(--sans); font-variant-numeric:tabular-nums}
.ur .ur-pct-100{font-size:11px; fill:var(--dæmp2); font-weight:600}
/* ringenes navne står i ren tekst uden kant: sort i lyst tema, hvid i mørkt */
.ur .ur-navn{fill:var(--blæk); font-weight:700; font-family:var(--sans)}
.ur .ur-tid{fill:var(--blæk); font-family:var(--mono); font-weight:700; font-variant-numeric:tabular-nums; letter-spacing:-.02em}
.ur .ur-dato{fill:var(--dæmp); font-size:12px; font-weight:600; font-family:var(--sans)}
.tid-tabel td{font-variant-numeric:tabular-nums}
.tid-navn{white-space:nowrap}
.ur-prik{display:inline-block; width:10px; height:10px; border-radius:50%; margin-right:8px; vertical-align:-1px}
.tid-bar{height:8px; background:var(--flade3); border-radius:4px; overflow:hidden; min-width:90px}
.tid-bar i{display:block; height:100%; border-radius:4px}
@media (max-width:1000px){ .tid-layout{grid-template-columns:minmax(0,1fr); gap:18px} .ur-ramme{max-width:460px} }
@media (max-width:600px){ .tid-bar-kol{display:none} }

/* ---------------- livet i måneder ---------------- */
.liv-rest{fill:var(--flade3)}
.graf-leg i.liv-rest-i{background:var(--flade3)}

/* =============================================================
   MØRKT TEMA
   ============================================================= */
html[data-tema="mork"]{
  --bg:#111A16; --flade:#18221D; --flade2:#1F2A24; --flade3:#2A3730;
  --linje:#3A4942; --linje2:#27332D;
  --blæk:#E2E9E5; --dæmp:#B0BCB6; --dæmp2:#94A19A;
  --grøn:#4CC296; --grøn-m:#57C79E; --grøn-l:#79D6B3; --grøn-b:#183A2C;
  --rav:#EDB06A; --rav-m:#EDB06A; --rav-b:#3A2B1B;
  --blå:#9BBAF3; --blå-b:#1E2B45;
  --rød:#F29494; --rød-b:#3D2222;
  --på-grøn:#06140E; --grøn-hover:#62CFA6;
  color-scheme:dark;
}
html[data-tema="mork"] input,html[data-tema="mork"] select,html[data-tema="mork"] textarea,html[data-tema="mork"] #kmd-felt{border-color:#627369}
html[data-tema="mork"] .fh .ark,html[data-tema="mork"] .ps-kort svg{filter:brightness(.9)}
html[data-tema="mork"] .logo .mrk{color:#fff}
html[data-tema="mork"] .info{border-color:#2B3F66; color:#C3D4F5}
html[data-tema="mork"] .info a{color:#C3D4F5}
html[data-tema="mork"] .info.advarsel{border-color:#5A4526; color:var(--rav)}

html[data-tema="mork"] footer{background:#090D0B}
html[data-tema="mork"] .graf [fill="#8F5408"]{fill:#E7A75C}
html[data-tema="mork"] .graf [stroke="#8F5408"]{stroke:#E7A75C}
html[data-tema="mork"] .graf [fill="#1B4A9B"]{fill:#8DB0F0}
html[data-tema="mork"] .graf [stroke="#1B4A9B"]{stroke:#8DB0F0}
html[data-tema="mork"] .graf [fill="#59655F"]{fill:#A5B1AB}
html[data-tema="mork"] .graf [stroke="#59655F"]{stroke:#A5B1AB}
html[data-tema="mork"] .graf [fill="#06674A"]{fill:#43B98C}
html[data-tema="mork"] .graf [fill="#9B2226"]{fill:#F08A8A}
html[data-tema="mork"] .graf circle[stroke="#fff"]{stroke:#151E1A}

/* ---------------- blog og nye elementer: responsivt ---------------- */
@media (max-width:1240px){
  .blog-ramme{grid-template-columns:minmax(0,1fr) 260px}
}
@media (max-width:900px){
  .blog-ramme{grid-template-columns:minmax(0,1fr)}
  .blog-ramme > .blog-side{grid-column:1; max-width:none; position:static; max-height:none; margin-top:6px}
  .bs-pil{display:none!important}
}
.tl-mdr > span{overflow:hidden; white-space:nowrap}
.tl-mdr .m1{display:none}
@media (max-width:460px){ .tl-mdr .m3{display:none} .tl-mdr .m1{display:inline} }
@media (max-width:760px){
  .fane-liste a{padding:0 9px}
  .fane-liste a::after{left:9px; right:9px}
  .til-top{right:14px; bottom:calc(14px + env(safe-area-inset-bottom, 0px))}
}

/* ---------------- responsivt ---------------- */
@media (max-width:1180px){
  .fod-top{grid-template-columns:repeat(3,1fr)}
  .fod-om{grid-column:1 / -1}
}
@media (max-width:1100px){
  .måneder{grid-template-columns:repeat(3,1fr)}
  .plan-bar{flex-wrap:wrap; row-gap:4px}
  .uge-nu{flex:1 1 auto}
  .plan-styr{flex:0 0 auto}
  .dag-info{order:3; flex-basis:100%; border-left:0; padding-left:2px; border-top:1px solid var(--linje2); padding-top:4px}
}
@media (max-width:900px){
  .scene{padding:6px 8px 8px}
  .plan-gitter{gap:2px}
  .plan-gitter[data-vis="halv"]{gap:4px}
  .pd{font-size:min(11px, var(--pd-fs, 11px))}
  .plan-gitter[data-vis="halv"] .pd{font-size:min(12px, var(--pd-fs, 12px))}
  .pm-h a{font-size:min(12px, var(--pm-fs, 12px))}
  .blog-net{grid-template-columns:minmax(0,1fr)}
  .blog-side{position:static}
  .ps-detalje{grid-template-columns:minmax(0,1fr)}
  .ps-valg{position:static}
  .typer{grid-template-columns:1fr 1fr}
}
@media (max-width:760px){
  .måneder{grid-template-columns:repeat(2,1fr)}
  .uge-tekst p{display:none}
  .uge-tekst h1{font-size:14.5px}
  .plan-bar{gap:8px}
  .svar{grid-template-columns:1fr; gap:12px}
  .net-2{grid-template-columns:minmax(0,1fr)}
  .uge-nu{min-width:0}
  .uge-tekst{min-width:0}
  .tl-rk,.tl-akse{grid-template-columns:100px 1fr}
  .fod-top{grid-template-columns:1fr 1fr}
  .uge-tekst h1{font-size:15px}
  .plan-styr{justify-content:flex-end}
  .resultat-tal b{font-size:19px}
}
@media (max-width:600px){
  /* telefonen: kun fanen "Uge nr." står i headeren — de andre ligger i menuen, så søgefeltet får mere plads */
  .fane-liste{flex:0 0 auto; margin-left:0}
  .fane-liste a:not([data-f="ugenumre"]){display:none}
  .fane-liste a{padding:0 9px}
  .fane-liste a::after{left:9px; right:9px}
  .kmd{flex:1 1 auto}
  /* mens man søger, fylder søgefeltet også fanens plads (klassen sættes i startKommando) */
  .top.søger .fane-liste{display:none}
  .plan-styr .knap .pt{display:none}
  .uge-tekst .ud{display:none}
  .plan-bar{gap:6px; padding:4px 6px 4px 4px}
  .uge-nu{flex:1 1 0; min-width:0}
  .plan-styr{flex:0 0 auto; margin-left:auto}
  .uge-tekst h1{font-size:13px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
  #halv-nav .ud{display:none}
  .uge-kasse{min-width:44px; padding:2px 6px 3px}
  .uge-kasse b{font-size:19px}
  .plan-styr{gap:4px}
  .plan-styr .knap,.plan-styr .skift button,.plan-styr .år-ctrl a,.plan-styr .år-ctrl button{padding:3px 7px; font-size:12.5px}
  .dag-info{font-size:11px} .dag-info .dt{font-size:12px}
  .ps-knapper{grid-template-columns:1fr 1fr 1fr}
}
@media (pointer:coarse){
  .ikon-knap{width:36px; height:36px}
  .plan-styr .knap,.plan-styr .skift button,.plan-styr .år-ctrl a,.plan-styr .år-ctrl button{padding:6px 11px}
  .bs-pil{width:40px; height:40px; margin-left:-20px}
  input[type=range]{height:30px}
}
@media (max-width:390px){ .uge-tekst h1{font-size:12.5px} .plan-styr .knap,.plan-styr .år-ctrl a,.plan-styr .år-ctrl button{padding:3px 6px} }
@media (max-width:460px){
  .wrap{padding:0 12px}
  .top .wrap{gap:4px}
  .fane-liste a{padding:0 7px}
  .fane-liste a::after{left:7px; right:7px}
  .logo{font-size:18.5px; margin-right:2px}
  .logo::after{bottom:9px}
  .kmd{min-width:78px; flex:1 1 78px}
  .ikon-knap{width:30px; height:30px}
  /* månedskalenderen: to måneder side om side, så siden ikke bliver så lang */
  .måneder{grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px}
  .md{padding:9px 7px 8px}
  .md h3{font-size:13.5px; margin-bottom:5px; flex-wrap:wrap; gap:0 4px}
  .mg{grid-template-columns:17px repeat(7,minmax(0,1fr)); font-size:11.5px}
  .mg .h{padding-bottom:2px}
  .mg .un{padding-right:3px; line-height:21px}
  .mg .c{line-height:21px}
  .fod-top{grid-template-columns:1fr}
  .opsum{gap:16px}
  .opsum > * > b{font-size:19px}
  .knap,.skift button,.år-ctrl a,.år-ctrl button{padding:5px 9px}
  .typer button{padding:8px 10px}
  .typer button span{display:none}
  td:not(.ark *){padding:8px 10px}
}
/* store skærme — tabelreglerne gælder ikke i printarket, så forhåndsvisning, print og PDF er ens */
@media (min-width:1700px){
  :root{--maks:1360px}
  body{font-size:17.5px}
  .top .wrap{height:52px}
  .logo{font-size:23px}
  .logo::after{bottom:9px}
  .fane-liste a{font-size:15.5px; padding:0 13px}
  .fane-liste a::after{left:13px; right:13px}
  .kmd{flex:0 1 300px}
  #kmd-felt{height:32px; font-size:14.5px}
  .ikon-knap{width:34px; height:34px}
  .intro{font-size:18.5px}
  .knap,.skift button,.år-ctrl a,.år-ctrl button{font-size:15.5px}
  th:not(.ark *){font-size:13.5px} td:not(.ark *){font-size:17px}
  .kort h3,.side-boks a,.kmd-liste a{font-size:16.5px}
  .note,.under,.fod-bund,.husk-note{font-size:14.5px}
  .uge-kasse b{font-size:24px}
  .uge-tekst h1{font-size:17px}
  .uge-tekst p,.dag-info{font-size:13.5px}
  .plan-bar{padding:6px 10px 6px 6px}
  .blog-ramme{grid-template-columns:minmax(0,1fr) 290px}
  .ur-ramme,.tid-layout{max-width:none}
  .tid-layout{grid-template-columns:minmax(0,560px) minmax(0,1fr)}
  .ur-ramme{max-width:560px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important; animation:none!important; scroll-behavior:auto!important}}

/* ---------------- udskrift ---------------- */
@media print{
  html.print-tilstand body{background:#fff; margin:0}
  html.print-tilstand body > *:not(#print-rum){display:none!important}
  html.print-tilstand #print-rum{display:block!important}
  html:not(.print-tilstand) .top,
  html:not(.print-tilstand) .faner,
  html:not(.print-tilstand) footer,
  html:not(.print-tilstand) .linje-styr,
  html:not(.print-tilstand) .kmd,
  html:not(.print-tilstand) .hent-app,
  html:not(.print-tilstand) dialog,
  html:not(.print-tilstand) .blog-side,
  html:not(.print-tilstand) .laesebar,
  html:not(.print-tilstand) .til-top,
  html:not(.print-tilstand) .ikon-knap{display:none!important}
  html:not(.print-tilstand) body{background:#fff}
  html:not(.print-tilstand) .tabelboks,html:not(.print-tilstand) .kort{break-inside:avoid}
}

/* ---------------- FAQ-siden ---------------- */
.faq-nav{display:flex; flex-wrap:wrap; gap:8px; margin:4px 0 8px}
.faq-nav button{padding:7px 13px; border-radius:99px; border:1px solid var(--linje); background:var(--flade); color:var(--blæk); font:inherit; font-size:14px; cursor:pointer}
.faq-nav button span{color:var(--dæmp); font-size:12.5px; margin-left:2px}
.faq-nav button:hover{border-color:var(--grøn); color:var(--grøn)}
.faq-gruppe{scroll-margin-top:64px}
.faq-emne{padding:14px 0; border-top:1px solid var(--linje2)}
.faq-emne:first-of-type{border-top:0}
.faq-emne h3{margin:0 0 4px}
.faq-emne p{margin:0 0 6px}
.faq-links{font-size:14px; color:var(--dæmp)}
.faq-links > span:first-child{margin-right:2px}
.faq-links .sep{color:var(--dæmp2)}

/* ---------------- Ferieplanlægger (Ferieplan-fanen) ---------------- */
.fp{margin-top:6px}
.fp-input{display:grid; grid-template-columns:minmax(0,1fr); gap:14px; margin-top:14px}
@media (min-width:1000px){
  .fp-input{grid-template-columns:minmax(0,1fr) minmax(0,1.2fr)}
  .fp-trin-kort{grid-column:2; grid-row:1 / span 3}
}
.fp-trin{background:var(--flade); border:1px solid var(--linje); border-radius:16px; padding:16px 18px 18px}
.fp-trin h3{display:flex; align-items:center; gap:10px; margin:0 0 12px; font-size:16.5px}
.fp-nr{display:inline-grid; place-items:center; width:26px; height:26px; border-radius:50%; background:var(--grøn); color:#fff; font-size:13.5px; font-weight:700; flex:none}
.fp-mdr{display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:6px}
@media (max-width:520px){ .fp-mdr{grid-template-columns:repeat(4,minmax(0,1fr))} }
.fp-mdr button{display:flex; flex-direction:column; align-items:center; gap:4px; padding:9px 4px 8px; border-radius:11px; border:1px solid var(--linje); background:var(--bg); color:var(--blæk); font:inherit; cursor:pointer; transition:background .15s, border-color .15s}
.fp-mdr button b{font-size:14px; font-weight:650}
.fp-mdr button:hover{border-color:var(--grøn)}
.fp-mdr button[aria-pressed="true"]{background:var(--grøn); border-color:var(--grøn); color:#fff}
.fp-prikker{display:inline-flex; gap:3px; min-height:6px}
.fp-prikker i{width:6px; height:6px; border-radius:50%; background:var(--rav-m, #C97A10)}
.fp-mdr button[aria-pressed="true"] .fp-prikker i{background:#fff}
.fp-hint{margin:8px 0 0; font-size:12.5px; color:var(--dæmp); display:flex; align-items:center; gap:6px}
.fp-hurtig{display:flex; flex-wrap:wrap; gap:6px; margin-top:10px}
.fp-hurtig button{padding:6px 11px; border-radius:99px; border:1px solid var(--linje); background:var(--bg); color:var(--blæk); font:inherit; font-size:13.5px; cursor:pointer}
.fp-hurtig button small{color:var(--dæmp); font-size:11.5px; margin-left:2px}
.fp-hurtig button:hover{border-color:var(--grøn); color:var(--grøn)}
.fp-hurtig button.valgt{border-color:var(--grøn); background:var(--grøn-b); color:var(--grøn)}
.fp-læng{display:flex; align-items:center; gap:14px}
.fp-læng input{flex:1; accent-color:var(--grøn)}
.fp-læng output{font-weight:700; font-size:15px; min-width:128px; text-align:right; font-variant-numeric:tabular-nums}
.fp-verden{position:relative; border-radius:14px; overflow:hidden; background:linear-gradient(180deg, var(--flade2), var(--bg)); --fp-land:var(--dæmp2); --fp-akt:var(--grøn); cursor:crosshair}
.fp-verden canvas{display:block}
.fp-pin{position:absolute; width:14px; height:14px; margin:-7px 0 0 -7px; padding:0; border-radius:50%; border:2px solid var(--flade); background:var(--dæmp); box-shadow:0 2px 6px rgba(0,0,0,.25); cursor:pointer; transition:transform .15s, background .15s}
.fp-pin:hover,.fp-pin:focus-visible{transform:scale(1.35); background:var(--grøn)}
.fp-pin.valgt{background:var(--grøn); width:18px; height:18px; margin:-9px 0 0 -9px; box-shadow:0 0 0 6px color-mix(in srgb, var(--grøn) 28%, transparent), 0 2px 8px rgba(0,0,0,.3)}
@media (prefers-reduced-motion:no-preference){ .fp-pin.valgt{animation:fp-puls 2.2s ease-out infinite} }
@keyframes fp-puls{ 0%{box-shadow:0 0 0 0 color-mix(in srgb, var(--grøn) 45%, transparent), 0 2px 8px rgba(0,0,0,.3)} 70%{box-shadow:0 0 0 12px color-mix(in srgb, var(--grøn) 0%, transparent), 0 2px 8px rgba(0,0,0,.3)} 100%{box-shadow:0 0 0 0 transparent, 0 2px 8px rgba(0,0,0,.3)} }
.fp-reg{display:flex; flex-wrap:wrap; gap:6px; margin-top:12px}
.fp-reg button{padding:6px 11px; border-radius:99px; border:1px solid var(--linje); background:var(--bg); color:var(--blæk); font:inherit; font-size:13px; cursor:pointer}
.fp-reg button:hover{border-color:var(--grøn)}
.fp-reg button[aria-checked="true"]{background:var(--grøn); border-color:var(--grøn); color:#fff}
.fp-res{margin-top:18px}
.fp-sum{display:grid; grid-template-columns:minmax(0,1fr); border-radius:18px; color:#fff; overflow:hidden;
  background:linear-gradient(120deg, #0B6B48, #12825A 55%, #1C9A6C); box-shadow:0 18px 40px -26px rgba(6,60,40,.8)}
@media (min-width:860px){ .fp-sum.to{grid-template-columns:minmax(0,1fr) minmax(0,1fr)} .fp-sum.to .fp-sum-del + .fp-sum-del{border-left:1px solid rgba(255,255,255,.22)} }
.fp-sum.to .fp-sum-del + .fp-sum-del{border-top:1px solid rgba(255,255,255,.22)}
@media (min-width:860px){ .fp-sum.to .fp-sum-del + .fp-sum-del{border-top:0} }
.fp-sum-del{display:flex; align-items:center; justify-content:space-between; gap:18px; padding:18px 22px}
.fp-sum-del > div:first-child{display:flex; flex-direction:column; gap:3px; min-width:0}
.fp-sum-lbl{font-size:12.5px; text-transform:uppercase; letter-spacing:.06em; opacity:.85}
.fp-sum b{font-size:clamp(22px,3vw,30px); letter-spacing:-.02em; line-height:1.15}
.fp-sum-del > div:first-child > span:last-child{opacity:.92; font-size:14.5px}
.fp-sum .fp-ring{--ring-bg:rgba(255,255,255,.22)}
.fp-sum .fp-ring b{color:#fff}
.fp-sum .fp-ring .v{stroke:#fff}
.fp-ring{position:relative; width:58px; height:58px; flex:none; --ring-bg:var(--linje)}
.fp-ring svg{width:100%; height:100%}
.fp-ring circle{fill:none; stroke-width:6}
.fp-ring .bg{stroke:var(--ring-bg)}
.fp-ring .v{stroke-linecap:round}
.fp-ring b{position:absolute; inset:0; display:grid; place-items:center; font-size:17px; font-weight:750; letter-spacing:-.02em}
.fp-ring.frem .v{stroke:var(--grøn)} .fp-ring.god .v{stroke:#4CAF7D} .fp-ring.mid .v{stroke:#E0A22E} .fp-ring.lav .v{stroke:#D1553F}
.fp-baro{margin-top:14px; background:var(--flade); border:1px solid var(--linje); border-radius:16px; padding:14px 18px 12px}
.fp-baro-hoved{display:flex; flex-wrap:wrap; align-items:baseline; gap:4px 14px}
.fp-baro-hoved h3{margin:0; font-size:15.5px}
.fp-baro-hoved p{margin:0; font-size:13.5px; color:var(--dæmp)}
.fp-søjler{display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); gap:6px; height:92px; margin-top:12px; align-items:end}
.fp-søjle{display:flex; flex-direction:column; align-items:center; justify-content:flex-end; height:100%; gap:4px}
.fp-søjle i{display:block; width:100%; max-width:34px; border-radius:6px 6px 3px 3px; opacity:.55}
.fp-søjle i.frem{background:var(--grøn)} .fp-søjle i.god{background:#4CAF7D} .fp-søjle i.mid{background:#E0A22E} .fp-søjle i.lav{background:#D1553F}
.fp-søjle span{font-size:11.5px; color:var(--dæmp)}
.fp-søjle.valgt i{opacity:1; box-shadow:0 0 0 2px var(--flade), 0 0 0 3.5px var(--blæk)}
.fp-søjle.valgt span{color:var(--blæk); font-weight:700}
.fp-gitter{display:grid; grid-template-columns:repeat(auto-fill,minmax(310px,1fr)); gap:12px; margin-top:14px}
.fp-kort{position:relative; background:var(--flade); border:1px solid var(--linje); border-radius:16px; padding:15px 16px 14px; display:flex; flex-direction:column; gap:10px}
.fp-kort.bedst{border-color:var(--grøn); box-shadow:0 0 0 1px var(--grøn) inset}
.fp-bedst{position:absolute; top:-10px; left:14px; background:var(--grøn); color:#fff; font-size:11.5px; font-weight:700; padding:2px 9px; border-radius:99px; letter-spacing:.02em}
.fp-top{display:flex; justify-content:space-between; align-items:center; gap:12px}
.fp-dato b{display:block; font-size:16.5px; letter-spacing:-.01em}
.fp-dato span{font-size:13px; color:var(--dæmp)}
.fp-strim{height:18px}
.fp-tal{display:flex; flex-wrap:wrap; gap:4px 14px; font-size:13.5px; color:var(--dæmp)}
.fp-tal b{color:var(--blæk); font-size:15px}
.fp-hd-navne{color:var(--rav, #8F5408); font-weight:600}
.fp-dom{margin:0; font-size:13.5px; padding:8px 10px; border-radius:10px; background:var(--flade2)}
.fp-dom.frem b,.fp-dom.god b{color:var(--grøn)} .fp-dom.mid b{color:#B7791F} .fp-dom.lav b{color:#C0392B}
.fp-råd{margin:0; font-size:13.5px}
.fp-råd.fp-ryk b{color:var(--blå, #1F5FA8)}
.fp-råd.fp-ok b{color:var(--grøn)}
.fp-flere{margin:14px 0 0; text-align:center}
.fp-tom{margin:14px 0 0; color:var(--dæmp)}
.fp-note{margin:12px 0 0; font-size:12.5px; color:var(--dæmp)}
html[data-tema="mork"] .fp-sum{background:linear-gradient(120deg, #0B5A3D, #0F6E4C 55%, #15805A)}
html[data-tema="mork"] .fp-dom.mid b{color:#F0B85A} html[data-tema="mork"] .fp-dom.lav b{color:#F08A74}
.fp-leg{margin-top:10px; padding-left:2px}
.fp-leg i{height:10px; width:14px}
.fp-leg i.ferie{background:var(--rav)} .fp-leg i.hd{background:var(--grøn)} .fp-leg i.fri{background:var(--grøn-b)}
@media (max-width:600px){ .fp-sum-del{padding:15px 16px} .fp-gitter{grid-template-columns:1fr} .fp-læng output{min-width:0} }

/* løftet om privatliv i footeren og på Om os */
.fod-løfte{font-size:13px; line-height:1.55; color:#B8C4BE; max-width:46ch; margin:10px 0 6px; padding-left:10px; border-left:2px solid var(--grøn)}
.om-løfte{background:var(--grøn-b); border:1px solid color-mix(in srgb, var(--grøn) 30%, transparent); border-radius:var(--r); padding:16px 18px}
.om-løfte h2{margin-top:0}
.om-løfte p{margin-bottom:0}

/* "Sidst opdateret" */
.opdateret{margin:8px 0 0; font-size:12.5px; color:var(--dæmp)}

/* Ugesider: overblik og link til ferieplanlæggeren */
.uge-overblik ul.tjek{list-style:none; padding:0; margin:0 0 16px; display:grid; gap:8px}
.uge-overblik ul.tjek li{position:relative; padding-left:22px; line-height:1.55}
.uge-overblik ul.tjek li::before{content:""; position:absolute; left:4px; top:.62em; width:8px; height:8px; border-radius:50%; background:var(--grøn)}
.fp-link{margin:0 0 52px}

/* 404 med forslag */
.nf-kort{display:flex; gap:24px; align-items:center; padding:22px 24px; background:var(--flade); border:1px solid var(--linje); border-radius:var(--r)}
.nf-tal{font-size:clamp(54px,9vw,88px); font-weight:800; letter-spacing:-.04em; color:var(--grøn); line-height:1; opacity:.9}
.nf-tekst p{margin:0 0 8px}
.nf-adr code{background:var(--flade2); padding:2px 6px; border-radius:6px; font-size:.92em; word-break:break-all}
.nf-gæt{font-size:19px; font-weight:600}
.nf-gæt a{color:var(--grøn)}
.nf-andre{color:var(--dæmp)}
.nf-knapper{display:flex; flex-wrap:wrap; gap:8px; margin-top:12px!important}
@media (max-width:560px){ .nf-kort{flex-direction:column; align-items:flex-start; gap:10px} }
/* FAQ-søgning */
.faq-søg{margin:4px 0 14px}
.faq-søg input{width:100%; max-width:560px; padding:11px 14px; border-radius:12px; border:1px solid var(--linje); background:var(--flade); color:var(--blæk); font:inherit; font-size:15.5px}
.faq-søg input:focus{outline:2px solid var(--grøn); outline-offset:1px}
.faq-søg .under{margin:6px 0 0; min-height:1.2em}

/* Månekalender */
.maane-tabel td{white-space:nowrap}
.mf-net{display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:12px}
.mf-kort{background:var(--flade); border:1px solid var(--linje); border-left:4px solid var(--dæmp2); border-radius:12px; padding:14px 16px}
.mf-kort.hele{border-left-color:var(--grøn)} .mf-kort.delvist{border-left-color:#E0A22E}
.mf-kort p{margin:6px 0 0; font-size:14.5px}
.mf-top{display:flex; justify-content:space-between; gap:10px; flex-wrap:wrap}
.mf-top span{color:var(--dæmp)}
.mf-syn{font-weight:600}

/* links til bysider for sol */
.by-liste{display:flex; flex-wrap:wrap; gap:8px}
.by-liste a{padding:6px 12px; border-radius:99px; border:1px solid var(--linje); background:var(--flade); font-size:14px}
.by-liste a:hover{border-color:var(--grøn); text-decoration:none}

/* Ferieplanlægger: sammenligning og kalender */
.fp-verden{--fp-akt2:#2F6FD0}
.fp-pin.valgt2{background:#2F6FD0; width:16px; height:16px; margin:-8px 0 0 -8px}
.fp-sml{display:flex; flex-wrap:wrap; align-items:center; gap:6px 8px; margin-top:12px; font-size:14px; color:var(--dæmp)}
.fp-sml select{padding:6px 10px; border-radius:10px; border:1px solid var(--linje); background:var(--bg); color:var(--blæk); font:inherit; font-size:14px; flex:1 1 180px; min-width:0; max-width:100%}
.fp-to{display:flex; gap:3px; align-items:flex-end; width:100%; max-width:34px; height:100%}
.fp-to i{flex:1; border-radius:5px 5px 2px 2px; opacity:.6}
.fp-to i.b2{background:#2F6FD0}
.fp-søjle.valgt .fp-to i{opacity:1}
.fp-sml-leg i.a,.fp-sml-rad i.a{background:var(--grøn)} .fp-sml-leg i.b,.fp-sml-rad i.b{background:#2F6FD0}
.fp-sml-rad{display:flex; flex-wrap:wrap; align-items:center; gap:4px 14px; font-size:13.5px; padding:8px 10px; border-radius:10px; border:1px dashed var(--linje)}
.fp-sml-rad i{display:inline-block; width:9px; height:9px; border-radius:50%; margin-right:5px}
.fp-sml-rad em{font-style:normal; color:var(--dæmp); margin-left:auto}
.fp-kal{display:flex; flex-wrap:wrap; gap:6px; margin-top:auto; padding-top:4px}
.knap.lille{padding:6px 11px; font-size:13px}


/* ---------- printskabeloner: vagtplan, læseplan og adventskalender ---------- */
.ark-vp .ark-krop{gap:2.5mm}
.vp{width:100%; flex:1 1 auto; border-collapse:collapse; table-layout:fixed}
.vp th,.vp td{border:.25mm solid #9AA6A0; padding:0; text-align:center}
.vp thead th{font-weight:600; font-size:7.5pt; padding:1mm .5mm; background:#F4F6F4}
.vp thead th b{display:block; font-size:8pt}
.vp thead th span{display:block; font-size:7pt; color:#59655F}
.vp th.vp-uge{background:#06674A; color:#fff; font-size:8pt}
.vp .vp-navn{width:34mm; text-align:left; padding-left:2mm; background:#fff}
.vp thead .vp-navn{background:#06674A; color:#fff; font-size:8.5pt}
.vp .we{background:#EEF1EF}
.vp .hd{background:#FAEEDC}
.vp thead th.hd{box-shadow:inset 0 .8mm 0 #C97A10}
.vp-fod{flex:0 0 auto; font-size:8pt; color:#3B4641}
.vp-fod p{margin:0 0 1mm}
.vp-fod .linjer{--l:6mm; flex:0 0 auto}
.lp-eks{flex:0 0 auto; border:.3mm solid #06674A; border-radius:1.5mm; padding:2mm 3mm}
.lp-eks h4{margin:0 0 1.5mm; font-size:10pt; color:#06674A}
.lp-eks table{width:100%; border-collapse:collapse}
.lp-eks th{font-size:8pt; text-align:left; color:#59655F; font-weight:600; padding-bottom:1mm}
.lp-eks td{height:7mm; border-bottom:.25mm solid #C9D2CD}
.lp{width:100%; flex:1 1 auto; border-collapse:collapse; table-layout:fixed}
.lp th,.lp td{border:.25mm solid #9AA6A0; padding:1mm 1.5mm; vertical-align:middle}
.lp thead th{background:#06674A; color:#fff; font-size:8.5pt; text-align:left}
.lp thead th:first-child{width:36mm} .lp thead th:last-child{width:9mm; text-align:center}
.lp tbody th{text-align:left; font-weight:400; font-size:8.5pt; white-space:nowrap}
.lp tbody th em{display:block; font-style:normal; font-size:7pt; color:#9A5A00}
.lp tr.we td,.lp tr.we th{background:#F2F4F2}
.lp tr.lp-uge td{background:#E4F2EB; color:#06674A; font-weight:700; font-size:8pt; padding:.8mm 1.5mm}
.lp .lp-tjek{text-align:center; color:#59655F}
.adv{flex:1 1 auto; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); grid-template-rows:repeat(6,minmax(0,1fr)); gap:2.5mm; min-height:0}
.adv-låge{position:relative; display:flex; flex-direction:column; border:.35mm dashed #C98A82; border-radius:2mm; padding:2mm 2.5mm; background:#FFFBF7; min-height:0}
.adv-låge b{font-size:22pt; line-height:1; color:#9B2E25; font-weight:800}
.adv-låge span{font-size:7.5pt; color:#59655F}
.adv-låge em{font-style:normal; font-size:7pt; font-weight:700; color:#06674A; margin-top:.5mm}
.adv-låge i{display:block; margin-top:auto; border-bottom:.25mm solid #E2C9C4; height:5.5mm}
.adv-låge i + i{margin-top:0}
.adv-låge.søn{background:#F3FAF6; border-color:#5FAF8B}
.adv-låge.jul{background:#FDF0EE; border:.5mm solid #9B2E25}
.adv-fod{flex:0 0 auto; margin:0; font-size:8pt; color:#59655F}
.adv.adv-25{grid-template-columns:repeat(5,minmax(0,1fr)); grid-template-rows:repeat(5,minmax(0,1fr))}
.adv-låge.nov b{font-size:15pt; color:#06674A}

/* lønberegner: trækprocent ud fra kommune */
.l-kom{grid-column:1 / -1; border:1px dashed var(--linje); border-radius:10px; padding:8px 12px; background:var(--flade)}
.l-kom summary{cursor:pointer; font-size:14px; color:var(--grøn); font-weight:600}
.l-kom-felter{display:flex; flex-wrap:wrap; align-items:flex-end; gap:10px 18px; margin-top:10px}
.l-kom-felter .felt{min-width:200px}
.tjek-felt{display:inline-flex; align-items:center; gap:8px; font-size:14px; padding-bottom:9px}
#l-kom-res{margin:8px 0 2px}

/* kalenderabonnement og ugenummer-widget */
.abon-net{display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:12px}
.abon-kort{background:var(--flade); border:1px solid var(--linje); border-radius:12px; padding:14px 16px}
.abon-kort h3{margin:0 0 4px}
.abon-kort p{margin:0 0 10px; color:var(--dæmp); font-size:14px}
.abon-knapper{display:flex; flex-wrap:wrap; gap:6px}
.widget-vis{display:flex; flex-wrap:wrap; gap:16px}
.widget-boks{padding:22px; border-radius:14px; border:1px solid var(--linje)}
.widget-boks.lys{background:#fff} .widget-boks.mork{background:#151E1A}
.widget-kode{width:100%; font:13px/1.5 ui-monospace,Menlo,Consolas,monospace; padding:12px; border-radius:10px; border:1px solid var(--linje); background:var(--flade); color:var(--blæk); margin-top:10px}

/* Værktøjer: de fremhævede brikker står 3 i bredden på pc (fra 1200px), 2 på tablet (768–1199px) og 1 på mobil — resten nedenunder.
   Tegningerne har samme størrelse i alle tre opstillinger; først på mobil (højst 640px) bliver de lidt mindre.
   Går antallet ikke op i 3, deler brikkerne i den sidste række bredden (gitteret har 6 spalter, en brik fylder 2) */
.vt-top{display:grid; grid-template-columns:repeat(6, minmax(0,1fr)); gap:16px; margin-bottom:16px}
.vt-top > *{grid-column:span 2}
.vt-top > :nth-last-child(2):nth-child(3n+1),.vt-top > :last-child:nth-child(3n+2){grid-column:span 3}
.vt-top > :last-child:nth-child(3n+1){grid-column:span 6}
.vt-top .vt-fremhævet{position:relative; overflow:hidden; border:none; color:#fff; min-height:150px; padding-right:160px; box-shadow:0 16px 36px -22px rgba(20,40,90,.6)}
.vt-top .vt-fremhævet h3{color:#fff; font-size:20px; position:relative; z-index:1; white-space:nowrap}   /* titlen står altid på én linje */
.vt-top .vt-fremhævet p{color:rgba(255,255,255,.92); position:relative; z-index:1; max-width:44ch}
.vt-top .vk-infl,.vt-top .vk-moede{padding-right:176px}
@media (max-width:1199px){
  .vt-top{grid-template-columns:repeat(2, minmax(0,1fr))}
  .vt-top > *,.vt-top > :nth-last-child(2):nth-child(3n+1),.vt-top > :last-child:nth-child(3n+2),.vt-top > :last-child:nth-child(3n+1){grid-column:auto}
  .vt-top > :last-child:nth-child(odd){grid-column:1 / -1}
}
@media (max-width:767px){
  .vt-top{grid-template-columns:1fr}
  .vt-top > :last-child:nth-child(odd){grid-column:auto}
}
/* hover: samme bevægelse som de små brikker på forsiden — brikken løfter sig, og tegningen laver sin egen lille bevægelse
   (en smule mindre end på de små brikker, fordi tegningerne er større). Kopien, der toner ud ved klik (.vt-kopi), beholder stillingen */
.vt-top .vt-fremhævet{transition:transform .28s cubic-bezier(.2,.9,.3,1.25), box-shadow .28s}
.vt-top .vt-fremhævet:is(:hover,:focus-visible){transform:translateY(-3px); box-shadow:0 26px 46px -24px rgba(20,40,90,.72); text-decoration:none}
.vt-top .vt-fremhævet .vt-ill{transition:scale .45s cubic-bezier(.2,.9,.3,1.3), rotate .45s cubic-bezier(.2,.9,.3,1.3), translate .45s cubic-bezier(.2,.9,.3,1.3)}
.vt-top .vt-fremhævet:is(:hover,:focus-visible,.vt-kopi) .vt-ur{scale:1.08; rotate:-8deg}
.vt-top .vt-fremhævet:is(:hover,:focus-visible,.vt-kopi) .vt-kal{scale:1.08; rotate:6deg}
.vt-top .vt-fremhævet:is(:hover,:focus-visible,.vt-kopi) .vt-moede{scale:1.04; rotate:4deg; translate:8px -2px}
.vt-top .vt-fremhævet:is(:hover,:focus-visible,.vt-kopi) .vt-stopur{scale:1.05; rotate:-5deg}
:is(.vt-top .vt-fremhævet:is(:hover,:focus-visible,.vt-kopi),.vv-mini:is(:hover,:focus-visible)) .vt-stopur .viser{rotate:230deg}
:is(.vt-top .vt-fremhævet:is(:hover,:focus-visible,.vt-kopi),.vv-mini:is(:hover,:focus-visible)) .vt-stopur .bue{stroke-dasharray:63.9 100}
/* Fem brikker, hvor kun en del af tegningen bevæger sig (både her og på forsidens små brikker):
   - Solopgang: solen er orange; ved hover stiger den lidt, vokser og bliver gradvist lysegul — og bliver sådan, til musen fjernes.
   - Termin og barsel: kun babyen vugger i maven.  - Renters rente: kun snebolden drejer langsomt mod uret.
   - Verdensure: viserne på de to ure drejer rundt.  - Inflation: pilen tegnes i zigzag fra venstre mod højre (én gang).
   Uendelige bevægelser står stille, når musen er væk (paused), så de ikke hopper tilbage, og fortsætter, hvor de slap */
.vt-top .vt-fremhævet .vt-sol{transition:translate 1.1s cubic-bezier(.22,.8,.3,1), scale 1.1s cubic-bezier(.22,.8,.3,1), background-color 1.5s ease, box-shadow 1.5s ease}
.vt-top .vt-fremhævet:is(:hover,:focus-visible,.vt-kopi) .vt-sol{translate:0 -18px; scale:1.1; background-color:#FFF1C1;
  box-shadow:0 0 0 14px rgba(255,241,193,.28), 0 0 0 30px rgba(255,241,193,.14)}
.vt-gravid .baby{transform-box:view-box; transform-origin:62px 150px; animation:vt-baby 2.6s ease-in-out infinite paused}
.vt-snebold .rul{transform-box:view-box; transform-origin:130.5px 93.5px; animation:vt-rul 11s linear infinite paused}
.vt-klode .ur :is(.t,.m){transform-box:view-box; animation:vt-viser 1.5s linear infinite paused}
.vt-klode .ur .t{animation-duration:9s}
.vt-klode .u1 :is(.t,.m){transform-origin:99px 80px}
.vt-klode .u2 :is(.t,.m){transform-origin:22px 25px}
.vt-infl .pil-hoved{transform-box:view-box; transform-origin:89px 31px}
:is(.vt-top .vt-fremhævet:is(:hover,:focus-visible,.vt-kopi),.vv-mini:is(:hover,:focus-visible)) :is(.vt-gravid .baby,.vt-snebold .rul,.vt-klode .ur .t,.vt-klode .ur .m){animation-play-state:running}
:is(.vt-top .vt-fremhævet:is(:hover,:focus-visible,.vt-kopi),.vv-mini:is(:hover,:focus-visible)) .vt-infl .pil-linje{animation:vt-zigzag .9s cubic-bezier(.45,.05,.4,1) both}
:is(.vt-top .vt-fremhævet:is(:hover,:focus-visible,.vt-kopi),.vv-mini:is(:hover,:focus-visible)) .vt-infl .pil-hoved{animation:vt-pilhoved 1.15s cubic-bezier(.2,.9,.3,1.3) both}
@keyframes vt-baby{0%,100%{rotate:0deg; translate:0 0} 30%{rotate:-7deg; translate:0 -1.5px} 65%{rotate:5deg; translate:0 1px}}
@keyframes vt-rul{to{rotate:-360deg}}
@keyframes vt-viser{to{rotate:360deg}}
@keyframes vt-zigzag{from{stroke-dasharray:100 200; stroke-dashoffset:104} to{stroke-dasharray:100 200; stroke-dashoffset:0}}
@keyframes vt-pilhoved{0%,72%{opacity:0; scale:.2} 100%{opacity:1; scale:1}}
@media (prefers-reduced-motion:reduce){ .vt-ill,.vt-ill *{animation:none !important; transition:none !important} }
.vk-sol{background:linear-gradient(160deg,#2F6FD0 0%,#6A8FD6 38%,#F2B57A 78%,#E58E57 100%)}
.vk-tid{background:linear-gradient(150deg,#14213D 0%,#24396B 55%,#3B5BA9 100%)}
.vk-termin{background:linear-gradient(to left, #FFF4F7 0 30px, transparent 30px), linear-gradient(150deg,#6B2A57 0%,#A6456F 52%,#E48A85 100%)}
.vv-mini.vk-termin{background:linear-gradient(to left, #FFF4F7 0 11px, transparent 11px), linear-gradient(150deg,#6B2A57 0%,#A6456F 52%,#E48A85 100%)}
.vk-ferie{background:linear-gradient(150deg,#0B6B51 0%,#11946F 55%,#3FB893 100%)}
.vk-klode{background:linear-gradient(150deg,#0B3954 0%,#0F6A8B 52%,#2BA3B8 100%)}
.vk-renter{background:linear-gradient(150deg,#94560A 0%,#C27F0F 38%,#E8B02E 72%,#F6D162 100%)}
.vk-renter p{color:rgba(255,255,255,.95)}
.vk-infl{background:linear-gradient(150deg,#6A1430 0%,#A9263F 52%,#E0563D 100%)}
.vk-moede{background:linear-gradient(150deg,#221A63 0%,#4334A8 52%,#7A68E2 100%)}
.vk-stopur{background:linear-gradient(150deg,#1A1F2C 0%,#2B3349 52%,#4A5B86 100%)}
.vt-ill{position:absolute; pointer-events:none}
.vt-sol{right:24px; bottom:-26px; width:92px; height:92px; border-radius:50%; background-color:#FFA24C; box-shadow:0 0 0 14px rgba(255,170,90,.32), 0 0 0 30px rgba(255,170,90,.16)}
.vt-ur{right:26px; top:50%; width:108px; height:108px; transform:translateY(-50%)}
.vt-ur circle{fill:rgba(255,255,255,.1); stroke:rgba(255,255,255,.8); stroke-width:2.5}
.vt-ur .st line{stroke:rgba(255,255,255,.85); stroke-width:2; stroke-linecap:round}
.vt-ur .vt-t{stroke:#FFD166; stroke-width:4.5; stroke-linecap:round}
.vt-ur .vt-m{stroke:#fff; stroke-width:3; stroke-linecap:round}
.vt-ur .vt-s{stroke:#FF9F7A; stroke-width:1.6; stroke-linecap:round}
.vt-ur .vt-c{fill:#fff; stroke:none}
/* Termin og barsel: maven helt tæt på og spejlvendt. Tegningen er højere end brikken og står midt i den, forstørret
   1,15 gange, så brikkens top og bund skærer lige der, hvor maven begynder og slutter. Den er skubbet 6px ud over
   højre kant (dér er kun ryggen), så maven ikke kommer tættere på teksten end 17px. Brikkens baggrund er kropsfarvet
   yderst til højre (.vk-termin), så den mørke baggrund ikke skinner igennem i de runde hjørner */
.vt-gravid{right:-6px; top:50%; width:161px; height:345px; transform:translateY(-50%)}
.vt-gravid .krop{fill:#FFF4F7}
.vt-gravid .navle{fill:none; stroke:#E7AEC0; stroke-width:1.7; stroke-linecap:round}
.vt-gravid .mave{fill:#FAD0DA; stroke:#fff; stroke-width:2}
.vt-gravid .foster{fill:#E2738E}
.vt-gravid .foster-ben{fill:none; stroke:#D45E7D; stroke-width:9.5; stroke-linecap:round; stroke-linejoin:round}
.vt-gravid .foster-arm{fill:none; stroke:#D45E7D; stroke-width:5; stroke-linecap:round}
.vt-gravid .foster-l{fill:none; stroke:#C2486C; stroke-width:1.6; stroke-linecap:round}
.vt-kal{right:22px; top:50%; width:128px; height:107px; transform:translateY(-50%)}
.vt-kal > rect{fill:rgba(255,255,255,.12); stroke:rgba(255,255,255,.85); stroke-width:2}
.vt-kal path{stroke:rgba(255,255,255,.85); stroke-width:2}
.vt-kal g rect{fill:rgba(255,255,255,.32)}
.vt-kal g rect.f{fill:#FFD166}
.vt-kal path.ferie-skrift{fill:none; stroke:#FFD166; stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round}
.vt-klode{right:20px; top:50%; width:130px; height:110px; transform:translateY(-50%)}
.vt-klode .kl circle{fill:rgba(255,255,255,.1); stroke:rgba(255,255,255,.8); stroke-width:2.5}
.vt-klode .kl ellipse,.vt-klode .kl path{fill:none; stroke:rgba(255,255,255,.45); stroke-width:2}
.vt-klode .ur circle{fill:#0D4E6C; stroke:#fff; stroke-width:2.5}
.vt-klode .ur .t{stroke:#FFD166; stroke-width:3.6; stroke-linecap:round}
.vt-klode .ur .m{stroke:#fff; stroke-width:2.6; stroke-linecap:round}
.vt-klode .ur .c{fill:#fff; stroke:none}
.vt-snebold{right:0; bottom:0; width:230px; height:150px}
.vt-snebold .sne{fill:rgba(255,255,255,.86)}
.vt-snebold .sne-kant{fill:none; stroke:#fff; stroke-width:2.2; stroke-linecap:round}
.vt-snebold .spor{fill:url(#vt-spor-g)}   /* blød skygge: sneen er trykket ned bag bolden */
.vt-snebold .fart{fill:none; stroke:rgba(255,255,255,.92); stroke-width:3.4; stroke-linecap:round}
.vt-snebold .fnug{fill:#fff}
.vt-snebold .kugle{fill:#FBFDFF; stroke:rgba(120,72,10,.3); stroke-width:1.8}
.vt-snebold .skygge{fill:#DCE6F2}
.vt-snebold .skær{fill:#fff}
.vt-snebold .klump{fill:#FBFDFF; stroke:rgba(120,72,10,.22); stroke-width:1}
.vt-snebold .seddel rect{fill:#4CAF7D; stroke:#24704F; stroke-width:1.3}
.vt-snebold .seddel rect.r{fill:none; stroke:rgba(255,255,255,.6); stroke-width:.9}
.vt-snebold .seddel .m{fill:#8ED3AE; stroke:#24704F; stroke-width:1}
.vt-snebold .seddel .p{fill:#24704F}
.vt-snebold .mønt circle,.vt-snebold .mønt path,.vt-snebold .mønt ellipse{fill:#FFD166; stroke:#B87A0C; stroke-width:1.5; stroke-linejoin:round}
.vt-snebold .mønt .i{fill:none; stroke:#E2A32C; stroke-width:1.1}
.vt-snebold .mønt .h{fill:none; stroke:rgba(255,255,255,.9); stroke-width:1.3; stroke-linecap:round}
.vt-snebold .mønt.kant path{fill:#E2A32C}
.vt-infl{right:14px; top:50%; width:150px; height:112px; transform:translateY(-50%)}
.vt-infl .akse{fill:none; stroke:rgba(255,255,255,.55); stroke-width:2; stroke-linecap:round}
.vt-infl .sj{fill:rgba(255,255,255,.26)}
.vt-infl .pil{fill:none; stroke:#FFD166; stroke-width:5; stroke-linecap:round; stroke-linejoin:round}
.vt-infl .maerke{fill:#FFF7EC}
.vt-infl .hul{fill:#B82E40}
.vt-infl .snor{fill:none; stroke:rgba(255,255,255,.8); stroke-width:1.6; stroke-linecap:round}
.vt-infl .pct{fill:none; stroke:#B82E40; stroke-width:2.3}
.vt-infl .pct-l{fill:none; stroke:#B82E40; stroke-width:2.5; stroke-linecap:round}
.vt-infl .mønt ellipse,.vt-infl .mønt path,.vt-infl .mønt circle{fill:#FFD166; stroke:#B87A0C; stroke-width:1.5; stroke-linejoin:round}
.vt-infl .mønt .i{fill:none; stroke:#E2A32C; stroke-width:1.2}
.vt-moede{right:14px; top:50%; width:150px; height:124px; transform:translateY(-50%)}
/* stopur: hvid kasse, gul bue og en koral viser; viser og bue bevæger sig ved hover */
.vt-stopur{right:22px; top:50%; width:112px; height:121px; transform:translateY(-50%)}
.vt-stopur .kasse{fill:rgba(255,255,255,.12); stroke:#fff; stroke-width:3.5}
.vt-stopur .skive{fill:rgba(255,255,255,.07); stroke:rgba(255,255,255,.3); stroke-width:1.5}
.vt-stopur .krone{fill:#fff}
.vt-stopur .streg line{stroke:rgba(255,255,255,.85); stroke-width:2.2; stroke-linecap:round}
.vt-stopur .bue{fill:none; stroke:#FFD166; stroke-width:6; stroke-linecap:round; stroke-dasharray:33.3 100; transition:stroke-dasharray .6s cubic-bezier(.2,.9,.3,1.2)}
.vt-stopur .viser{transform-box:view-box; transform-origin:60px 74px; rotate:120deg; transition:rotate .6s cubic-bezier(.2,.9,.3,1.2)}
.vt-stopur .viser line{stroke:#FF8A65; stroke-width:4.5; stroke-linecap:round}
.vt-stopur .midt{fill:#fff}
.vt-moede .kort{fill:#fff}
.vt-moede .kort-top{fill:#E4DEFF}
.vt-moede .ring{fill:#fff; stroke:#4334A8; stroke-width:2}
.vt-moede .bedst{fill:none; stroke:#FFC23A; stroke-width:2.6}
.vt-moede .stj{fill:#F2B300}
.vt-moede .c.v1{fill:#22A060} .vt-moede .c.v2{fill:#F2BE3D} .vt-moede .c.v3{fill:#E0505A} .vt-moede .c.v0{fill:#E6E8EF}
.vt-moede .m{fill:none; stroke:#fff; stroke-width:2.3; stroke-linecap:round; stroke-linejoin:round}
.vt-moede .m2{stroke:#5A4100; stroke-width:1.9} .vt-moede .m2p{fill:#5A4100}
.vt-moede .m0{stroke:#A3ABBB}
.vt-moede .link-bg{fill:#FFD166; stroke:#fff; stroke-width:2.6}
.vt-moede .link rect{fill:none; stroke:#3A2C8F; stroke-width:2.4}
@media (max-width:640px){
  .vt-top .vt-fremhævet{padding-right:118px; min-height:130px} .vt-top .vk-infl,.vt-top .vk-moede,.vt-top .vk-termin{padding-right:126px}
  .vt-ur{width:84px; height:84px; right:18px} .vt-kal{width:100px; height:84px; right:14px}
  .vt-klode{width:100px; height:85px; right:12px} .vt-snebold{width:167px; height:109px}
  .vt-infl{width:112px; height:84px; right:8px} .vt-moede{width:104px; height:86px; right:10px} .vt-gravid{width:140px; height:300px; right:-14px}
  .vt-stopur{width:88px; height:95px; right:16px}
}

/* FIRE: lidt mindre tekst i grafen — dog mindst 11px, som al tekst på siden */
.fi-net #fi-res{margin-top:14px}
.fi-graf .graf .gt{font-size:11px} .fi-graf .graf .gm{font-size:11px} .fi-graf .graf .gv{font-size:11px}
.fi-graf .graf-leg{font-size:11.5px}

/* Mærkedage og flagdage: links, hoverboks og sider */
.dag-link{color:inherit; text-decoration:underline; text-decoration-style:dotted; text-decoration-thickness:1px; text-underline-offset:3px; cursor:pointer}
.dag-link:hover{color:var(--grøn)}
a.badge.dag-link{text-decoration:none}
a.badge.dag-link:hover{filter:brightness(.95); color:inherit}
.dag-tip{position:fixed; z-index:1200; max-width:300px; padding:12px 14px; border-radius:12px; background:var(--flade); color:var(--blæk); border:1px solid var(--linje);
  box-shadow:0 18px 40px -18px rgba(0,0,0,.35); font-size:13.5px; line-height:1.45}
.dag-tip b{display:block; margin-bottom:3px; font-size:14px}
.dag-tip span{display:block; color:var(--dæmp)}
.dag-tip a{display:inline-block; margin-top:7px; color:var(--grøn); font-weight:600}
.dag-tekst h2{margin-top:26px} .dag-tekst h2:first-child{margin-top:0}
.dag-ekstra{padding:10px 14px; border-left:3px solid var(--grøn); background:var(--grøn-b); border-radius:0 10px 10px 0}
.vidste ul{margin:0; padding-left:20px; display:grid; gap:8px}

/* bokse i højre spalte flugter med den synlige kant på fieldset til venstre (kanten går gennem legend) */
#f-status{margin-top:10px}
.fi-graf{margin-top:10px}

/* sprogvalg (globus) — vises kun, når KI_SPROGVALG er true øverst i HTML-filen */
html:not(.med-sprogvalg) #sprog-knap, html:not(.med-sprogvalg) #sprog-menu{display:none !important}
.top .wrap{position:relative}
.sprog-menu{position:absolute; top:calc(100% + 6px); right:56px; z-index:60; min-width:170px; padding:6px; border-radius:12px; background:var(--flade); border:1px solid var(--linje); box-shadow:0 18px 40px -18px rgba(0,0,0,.35)}
.sprog-menu button{display:flex; align-items:center; gap:10px; width:100%; padding:9px 12px; border:0; border-radius:8px; background:none; color:var(--blæk); font:inherit; font-size:14.5px; cursor:pointer; text-align:left}
.sprog-menu button b{font-size:11.5px; letter-spacing:.06em; color:var(--dæmp); width:22px}
.sprog-menu button:hover,.sprog-menu button:focus-visible{background:var(--flade2)}
.sprog-menu button[aria-checked="true"]{color:var(--grøn); font-weight:600}
.sprog-menu button[aria-checked="true"]::after{content:"✓"; margin-left:auto}
.sprog-note{display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:8px 14px; padding:10px 16px; background:var(--grøn-b); color:var(--blæk); font-size:14px; text-align:center}
/* datosider */
.dd-svar .stortal small{text-transform:capitalize}
.dom-felter{display:flex; flex-wrap:wrap; gap:10px 16px; align-items:flex-end}
.dom-felter label{display:flex; flex-direction:column; gap:4px; font-size:13.5px; color:var(--dæmp)}
.dom-felter input,.dom-felter select{padding:9px 12px; border-radius:10px; border:1px solid var(--linje); background:var(--flade); color:var(--blæk); font:inherit; font-size:16px; min-width:120px}
.dom-svar{margin:14px 0 0; font-size:19px}
.dia-bar{height:14px; border-radius:99px; background:var(--flade2); overflow:hidden; margin-bottom:14px}
.dia-bar i{display:block; height:100%; background:linear-gradient(90deg, var(--grøn), #4CAF7D)}
.dia-tabel td,.dia-tabel th{padding:3px 6px; font-size:13px}
.dia-tabel td.dia-idag{background:var(--grøn); color:#fff; font-weight:700; border-radius:6px}
/* blog: sortering og emner */
.blog-filter{display:flex; flex-wrap:wrap; gap:10px 16px; align-items:center; margin:4px 0 18px}
.blog-emner{display:flex; flex-wrap:wrap; gap:6px}
.blog-emner button{padding:6px 12px; border-radius:99px; border:1px solid var(--linje); background:var(--flade); color:var(--blæk); font:inherit; font-size:13.5px; cursor:pointer}
.blog-emner button[aria-pressed="true"]{background:var(--grøn); border-color:var(--grøn); color:#fff}
.blog-filter .skift button[aria-pressed="true"]{background:var(--grøn); color:#fff}

/* smalle telefoner (≤380px): plads til globusknappen uden at gøre knapperne mindre */
@media (max-width:380px){
  .top .wrap{column-gap:4px}
  .top .logo{font-size:18px; margin-right:0}
  .top .kmd{min-width:72px; flex-basis:72px}
}

/* FIRE og pension: smallere boks til venstre, bredere graf til højre med tallene lige under */
@media (min-width:900px){
  .fi-net, .pe-net{grid-template-columns:minmax(0,5fr) minmax(0,7fr)}
}
.pe-graf{margin-top:10px}
.pe-hoejre #pe-res{margin-top:14px}
/* blog: søgefelt og "Se mere" i sideboksen */
.blog-søg input{width:100%; max-width:520px; padding:11px 14px; border-radius:12px; border:1px solid var(--linje); background:var(--flade); color:var(--blæk); font:inherit; font-size:16px}
.blog-søg{margin:4px 0 12px}
.blog-antal{margin:0 0 10px}
.bs-mere{margin-top:10px}

/* Værktøjer: de øvrige kort 5 i bredden på bærbar */
@media (min-width:1100px){ .vt-net{grid-template-columns:repeat(5, minmax(0,1fr))} }

/* Ofte stillede spørgsmål som drop-down (alle sider undtagen FAQ-siden) */
.faq-liste{border-top:1px solid var(--linje)}
.faq-d{border-bottom:1px solid var(--linje)}
.faq-d summary{display:flex; align-items:center; gap:12px; padding:14px 2px; cursor:pointer; list-style:none}
.faq-d summary::-webkit-details-marker{display:none}
.faq-d summary h3{margin:0; font-size:16px; font-weight:600; flex:1}
.faq-d summary::after{content:""; flex:0 0 auto; width:9px; height:9px; margin-right:6px; border-right:2px solid var(--dæmp); border-bottom:2px solid var(--dæmp); transform:rotate(45deg) translateY(-3px); transition:transform .2s}
.faq-d[open] summary::after{transform:rotate(-135deg) translateY(-1px)}
.faq-d summary:hover h3{color:var(--grøn)}
.faq-d summary:focus-visible{outline:2px solid var(--grøn); outline-offset:2px; border-radius:6px}
.faq-svar{padding:0 2px 14px}
.faq-svar p{margin:0}

/* skriv selv på printskabelonerne (gemmes ikke) — felterne ændrer ikke arkets opbygning */
.fh-ramme + .fh-ramme{margin-top:14px}
.ps-skriv-note{font-size:13.5px; line-height:1.5; padding:10px 12px; border-radius:10px; background:var(--grøn-b); color:var(--blæk); margin:0 0 12px}
.ps-fjern{margin-top:8px}
.ps-fjern:disabled{opacity:.5; cursor:default}
.skrivbar{cursor:text}
.ark .skrivbar{position:relative}
.egen{color:#1A4FB0; outline:none; white-space:pre-wrap; overflow-wrap:anywhere; cursor:text; font-size:inherit !important; font-weight:400; font-style:normal; line-height:inherit; letter-spacing:normal; text-transform:none}
.egen.ov{position:absolute; inset:0; padding:.5mm 1mm; overflow:hidden; line-height:1.2}
.egen.mk{top:6mm; left:1.6mm; right:1.6mm; bottom:.8mm; padding:0}
.egen.lj{padding:0; line-height:var(--l); transform:translateY(calc(var(--l) / 2 - .62em))}
.egen.dp{left:10mm; top:.7mm; padding:0}
.egen.ind{display:inline; white-space:nowrap; margin-left:.4em}
.egen.blok{display:block; min-height:1.25em}
.egen.tj{flex:1 1 auto; min-width:0; align-self:stretch; display:flex; align-items:flex-end; padding-bottom:.6mm; overflow:hidden; white-space:nowrap}
.egen.adv{flex:1 1 auto; min-height:0; overflow:hidden; display:block}
.fh .egen:focus{background:rgba(26,79,176,.10); box-shadow:inset 0 0 0 1px rgba(26,79,176,.5)}
.fh .skrivbar:hover{background-color:rgba(26,79,176,.06)}
.fh .ret{outline:none; cursor:text; border-radius:.6mm}
.fh .ret:hover{box-shadow:0 0 0 .3mm rgba(26,79,176,.35)}
.fh .ret:focus{box-shadow:0 0 0 .35mm rgba(26,79,176,.6); background:rgba(26,79,176,.06)}
@media print{ .egen{color:#1A4FB0} }
/* uden helligdage, mærkedage og flagdage (knappen på kalenderne) */
.ark.uden-dage .mk-navn{display:none}
.ark.uden-dage .pa-d.hd, .ark.uden-dage .pa-d.fl{background:none}
.ark.uden-dage .pa-d.hd.we, .ark.uden-dage .pa-d.fl.we{background:#E6EBE8}
.ark.uden-dage .pa-d.hd .n, .ark.uden-dage .pa-d.hd .t, .ark.uden-dage .pa-d.fl .t{color:inherit}
.ark.uden-dage .kg-d.hd{background:none; color:inherit; font-weight:inherit}
.ark.uden-dage .mk-d.hd{background:none}
.ark.uden-dage .mk-d.hd .mk-n{color:inherit}
.ark.uden-dage .p-leg span:has(i.hd){display:none}
.vis-dage{display:flex; align-items:center; gap:8px; font-size:14px; margin:10px 0 0; cursor:pointer}
.vis-dage input{width:18px; height:18px; accent-color:var(--grøn)}
/* forsidens printdialog: næsten hele skærmen, valgene i en bjælke øverst og årskalenderen i fuld bredde */
dialog#print-dialog.pv-stor{width:calc(100vw - 24px); height:calc(100vh - 24px); max-width:none; max-height:none; margin:auto; display:flex; flex-direction:column; padding:8px 16px 12px}
dialog#print-dialog.pv-stor .d-hoved{padding:0 0 6px; border-bottom:0}
dialog#print-dialog.pv-stor .d-hoved h2{font-size:15px}
dialog#print-dialog.pv-stor .d-hoved .knap{padding:1px 10px; font-size:13px}
dialog#print-dialog.pv-stor:not([open]){display:none}
.pv-krop{display:flex; flex-direction:column; gap:8px; flex:1 1 auto; min-height:0}
.pv-bjælke{display:flex; flex-wrap:wrap; align-items:center; gap:8px 14px}
.pv-bjælke .pv-år{margin:0}
.pv-bjælke .vis-dage{margin:0}
.pv-knapper{display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-left:auto}
.pv-knapper .ps-fjern{margin-top:0}
.pv-knapper .eksport, .pv-knapper > div{margin:0}
.pv-note{margin:0; padding:5px 12px; font-size:13px; line-height:1.45}
.pv-forhånd{flex:1 1 auto; min-height:0; overflow:auto; background:var(--flade2); border-radius:12px; padding:14px}

@media print{ .egen{color:#1A4FB0} }

/* termin- og barselsberegner */
.tb-linje{position:relative; height:18px; border-radius:99px; background:var(--flade2); overflow:hidden; margin:4px 0 6px}
.tb-linje i{position:absolute; top:0; bottom:0}
.tb-linje b{position:absolute; top:-2px; bottom:-2px; width:2px; background:var(--blæk)}
.tb-g{background:var(--rav)} .tb-m{background:var(--grøn)} .tb-f{background:var(--blå)}
.tb-prik{display:inline-block; width:10px; height:10px; border-radius:3px; margin-right:8px; vertical-align:-1px}

/* Månekalenderen: månen, du kan dreje */
.mu{position:relative; overflow:hidden; border-radius:22px; padding:0; background:radial-gradient(120% 140% at 20% 30%, #1C2A5C 0%, #0D1533 52%, #070B1E 100%); color:#EEF2FF; box-shadow:0 30px 60px -36px rgba(8,14,40,.8)}
.mu::before{content:""; position:absolute; inset:0; pointer-events:none; opacity:.9;
  background-image:radial-gradient(1.2px 1.2px at 12% 18%, #fff 50%, transparent 51%), radial-gradient(1px 1px at 28% 72%, #cfd8ff 50%, transparent 51%), radial-gradient(1.4px 1.4px at 46% 12%, #fff 50%, transparent 51%),
    radial-gradient(1px 1px at 63% 84%, #fff 50%, transparent 51%), radial-gradient(1.3px 1.3px at 78% 22%, #e6ecff 50%, transparent 51%), radial-gradient(1px 1px at 90% 64%, #fff 50%, transparent 51%),
    radial-gradient(1px 1px at 8% 88%, #fff 50%, transparent 51%), radial-gradient(1.2px 1.2px at 36% 44%, #dfe6ff 50%, transparent 51%), radial-gradient(1px 1px at 55% 56%, #fff 50%, transparent 51%), radial-gradient(1px 1px at 84% 92%, #cfd8ff 50%, transparent 51%);
}
.mu-scene{position:relative; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.05fr); gap:28px; align-items:center; padding:34px 38px}
.mu-venstre{display:flex; flex-direction:column; align-items:center; gap:12px}
.mu-måne{--lys:.6; position:relative; width:min(340px, 74vw); aspect-ratio:1; border-radius:50%; cursor:grab; touch-action:pan-y; outline:none; opacity:0; transition:opacity .7s ease; will-change:opacity}
.mu-måne.klar{opacity:1}
.mu-måne.trækker{cursor:grabbing}
.mu-måne::before{content:""; position:absolute; inset:-18%; border-radius:50%; pointer-events:none; background:radial-gradient(closest-side, rgba(210,222,255,.34), rgba(160,180,255,.10) 62%, transparent 100%); opacity:var(--lys); will-change:opacity}
.mu-måne:focus-visible{box-shadow:0 0 0 3px rgba(255,255,255,.5)}
.mu-måne canvas{position:relative; display:block; width:100%; height:100%; transform:translateZ(0)}
.mu-hint{margin:0; font-size:13px; letter-spacing:.04em; color:rgba(225,232,255,.72)}
.mu-hint span{display:inline-block; opacity:.7; padding:0 4px}
.mu-etiket{margin:0 0 4px; font-size:12px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:#A9B7F0}
.mu-dato{margin:0; font-size:clamp(24px, 3vw, 34px); line-height:1.15; color:#fff; font-weight:750}
.mu-rel{margin:4px 0 12px; font-size:15px; color:#C9D3FA; min-height:1.4em}
.mu-fase{margin:0 0 16px}
.mu-fase span{display:inline-block; padding:5px 12px; border-radius:99px; background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.16); font-size:14px; font-weight:600}
.mu-tal{display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:10px; margin-bottom:18px}
.mu-tal div{padding:12px 14px; border-radius:14px; background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.1)}
.mu-tal b{display:block; font-size:22px; font-variant-numeric:tabular-nums; color:#fff}
.mu-tal span{font-size:12.5px; color:#B7C3F2}
.mu-cyklus{margin:0 0 18px}
.mu-spor{position:relative; height:10px; border-radius:99px; background:linear-gradient(90deg, #11183A 0%, #8E9AC8 25%, #F5F2E6 50%, #8E9AC8 75%, #11183A 100%); box-shadow:inset 0 0 0 1px rgba(255,255,255,.14)}
.mu-spor i{position:absolute; top:50%; width:18px; height:18px; margin:-9px 0 0 -9px; border-radius:50%; background:#fff; box-shadow:0 0 0 3px rgba(255,255,255,.25), 0 2px 8px rgba(0,0,0,.4)}
.mu-labels{display:flex; justify-content:space-between; margin-top:8px; font-size:11.5px; color:#B7C3F2}
.mu-idag{display:inline-flex; align-items:center; gap:8px; background:#fff; color:#111A3F; border-color:transparent; font-weight:650; transition:opacity .3s, transform .2s}
.mu-idag:hover{transform:translateY(-1px)}
.mu-idag.mu-dæmp{opacity:.55}
@media (max-width:760px){
  .mu-scene{grid-template-columns:1fr; padding:26px 20px; gap:18px}
  .mu-info{text-align:left}
  .mu-labels span:nth-child(2), .mu-labels span:nth-child(4){display:none}
}

/* årskalenderen: egne notater i dagrækkens størrelse (som datoerne), ikke navnekolonnens mindre skrift */
.pa-d{--pa-fs:6.5pt}
.pa-6 .pa-d{--pa-fs:8.6pt}
.pa-d .t > .egen.ind{font-size:var(--pa-fs) !important}
/* månen: svag ring, så hele kuglen anes på den mørke side */
.mu-måne::after{content:""; position:absolute; inset:0; border-radius:50%; pointer-events:none; box-shadow:inset 0 0 0 1px rgba(200,212,255,.10), 0 0 0 1px rgba(200,212,255,.05), inset -10px 0 24px -16px rgba(170,190,255,.18)}
/* printdialogens bjælke */
.pv-bjælke .pv-år label{margin:0}
.pv-bjælke .pv-år{align-items:center}
.pv-knapper .knap.stor{padding:5px 14px; font-size:14px}   /* samme højde som de andre knapper i bjælken */

/* årspilene: centreret lodret i begge visninger */
.år-ctrl{align-items:stretch}
.år-ctrl a,.år-ctrl button{display:inline-flex; align-items:center; justify-content:center}
.år-ctrl .v{display:inline-flex; align-items:center; justify-content:center}
.pil-ikon{display:block; flex:0 0 auto}
/* afsnit, man er sendt hen til */
.sektion-link{margin:18px 0 0}
.sektion-fremhæv{animation:sektion-blink 1.8s ease-out}
@keyframes sektion-blink{ 0%{box-shadow:0 0 0 0 rgba(6,103,74,.0)} 20%{box-shadow:0 0 0 6px rgba(6,103,74,.18)} 100%{box-shadow:0 0 0 0 rgba(6,103,74,0)} }

/* solformørkelser */
.sf-typer{display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:12px; margin:14px 0}
.sf-typer div{padding:14px 16px; border-radius:14px; background:var(--flade2); border:1px solid var(--linje)}
.sf-typer b{display:block; margin-bottom:4px}
.sf-typer span{font-size:14px; color:var(--dæmp)}
.sf-sikker{padding:12px 14px; border-radius:12px; background:#FFF4E5; color:#6B4100; border:1px solid #F3D3A6}
.sf td{white-space:normal; vertical-align:top}
.sf .sf-senest td{color:var(--dæmp)}
.sf-ja{color:var(--grøn)} .sf-nej{color:var(--dæmp)}
@media (max-width:760px){ .sf-typer{grid-template-columns:1fr} }

/* "Sæsonen for …": én række pr. rejsemål, forklaring og hoverboks */
.fp-baro-note{flex-basis:100%; margin:2px 0 0; font-size:13.5px; color:var(--blæk)}
.fp-række + .fp-række{margin-top:16px; padding-top:12px; border-top:1px dashed var(--linje)}
.fp-række-navn{display:flex; flex-wrap:wrap; gap:2px 10px; align-items:baseline; margin-top:12px; font-size:14px}
.fp-række-navn span{color:var(--dæmp); font-size:13px}
.fp-række .fp-søjler{margin-top:8px}
.fp-søjle{cursor:default; outline:none; border-radius:6px}
.fp-søjle:hover i, .fp-søjle:focus-visible i{opacity:1; filter:saturate(1.1)}
.fp-søjle:focus-visible{box-shadow:0 0 0 2px var(--grøn)}
.fp-niv-leg{margin-top:10px}
.fp-niv-leg i.frem{background:var(--grøn)} .fp-niv-leg i.god{background:#4CAF7D} .fp-niv-leg i.mid{background:#E0A22E} .fp-niv-leg i.lav{background:#D1553F}
.fp-tip{position:fixed; z-index:1200; max-width:300px; padding:11px 13px; border-radius:12px; background:var(--flade); color:var(--blæk); border:1px solid var(--linje); box-shadow:0 18px 40px -18px rgba(0,0,0,.35); font-size:13.5px; line-height:1.45; pointer-events:none}
.fp-tip[hidden]{display:none}
.fp-tip b{display:block; margin-bottom:3px}
.fp-tip span{display:block}
.fp-tip .fp-tip-s{font-weight:650; margin-bottom:3px}
.fp-tip .fp-tip-s.frem{color:var(--grøn)} .fp-tip .fp-tip-s.god{color:#2E8B5A} .fp-tip .fp-tip-s.mid{color:#A8730F} .fp-tip .fp-tip-s.lav{color:#B5402C}
.fp-tip .fp-tip-svag{color:#A8730F; margin-top:3px}
.fp-tip .fp-tip-plus{color:var(--grøn); font-weight:600; margin-top:3px}
.fp-tip .fp-tip-skole{color:var(--dæmp); margin-top:3px}
/* rejsescorens tre dele: vejr, pris og turister */
.fp-dele{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px 12px}
.fp-dele > span{display:grid; grid-template-columns:auto 1fr; align-items:center; gap:2px 6px; font-size:12px; color:var(--dæmp)}
.fp-dele em{font-style:normal}
.fp-dele strong{justify-self:end; font-size:12.5px; color:var(--blæk); font-variant-numeric:tabular-nums}
.fp-dele strong small{font-size:11px; color:var(--dæmp); font-weight:500}
.fp-dele i{grid-column:1 / -1; grid-row:2; display:block; height:5px; border-radius:3px; background:var(--linje); overflow:hidden}
.fp-dele i b{display:block; height:100%; border-radius:3px; background:var(--grøn)}
.fp-dele > span:nth-child(2) i b{background:#E0A22E}
.fp-dele > span:nth-child(3) i b{background:#2F6FD0}
.fp-tip .fp-tip-dele{margin:6px 0 7px; gap:5px 10px}
.fp-tip .fp-tip-dele > span{display:grid}
.fp-udvid{margin:0; font-size:13px; color:var(--dæmp); padding:6px 10px; border-radius:10px; border:1px dashed color-mix(in srgb, var(--grøn) 45%, var(--linje))}
.fp-udvid b{color:var(--grøn)}
.fp-vægt button{font-weight:550}
.fp-vægt + .fp-hint{margin-top:10px}
.fp-metode{margin-top:16px; background:var(--flade); border:1px solid var(--linje); border-radius:16px; padding:0 18px}
.fp-metode > summary{cursor:pointer; padding:14px 0; font-weight:650; font-size:15.5px; list-style:none; display:flex; align-items:center; gap:10px}
.fp-metode > summary::-webkit-details-marker{display:none}
.fp-metode > summary::before{content:''; width:8px; height:8px; border-right:2px solid currentColor; border-bottom:2px solid currentColor; transform:rotate(-45deg); transition:transform .2s; flex:none; margin-left:2px}
.fp-metode[open] > summary::before{transform:rotate(45deg)}
.fp-metode-krop{padding:0 0 16px; font-size:14.5px}
.fp-metode-krop p{margin:0 0 10px}
.fp-metode-liste{margin:0 0 12px; padding-left:20px}
.fp-metode-liste li{margin-bottom:6px}
.fp-metode-tabel{max-width:480px; margin-bottom:12px}

/* månen: datoskift under drejningen tegner kun månesektionen om, ikke hele siden */
.mu{contain:layout paint}
.mu-info{contain:layout paint}
.mu-dato{min-height:1.15em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-variant-numeric:tabular-nums}
.mu-rel, .mu-tal b{font-variant-numeric:tabular-nums}
@media (max-width:760px){ .mu-dato{white-space:normal; min-height:2.3em} }


/* farveforklaringen i "Sæsonen for …" som små søjler */
.fp-niv-leg i{width:12px; height:12px; border-radius:3px}

/* solsiden: glem-linjen står lige under strimlen "Når du får fri" i "Din arbejdsdag" */
lysaar-app > .sol-husk{margin:14px 0 0}
lysaar-app:not(:defined) > .sol-husk{display:none}

/* termin og barsel: skyder med begge forældres uger */
.tb-sk-top{display:flex; justify-content:space-between; align-items:baseline; gap:10px; font-size:13px; color:var(--dæmp); margin-bottom:2px}
.tb-sk-top label, .tb-sk-top > span{display:inline-flex; align-items:baseline; gap:6px; margin:0}
.tb-sk-top .tb-prik{margin:0; align-self:center}
/* hjælpeteksten under skyderne: tættere linjer */
.skyder .tip{display:block; line-height:1.35; margin-top:4px}
/* barslen i datoer: termin over baren, etiketter centreret under hver farvet del */
.tb-tidslinje{position:relative; margin:4px 0 22px}
.tb-termin{position:relative; height:21px}
.tb-termin span{position:absolute; left:0; top:0; white-space:nowrap; font-size:12.5px; font-weight:650; color:var(--blæk)}
.tb-tidslinje .tb-linje{height:20px; margin:0}
.tb-et-boks{position:relative; height:66px}
.tb-stik{position:absolute; top:0; width:2px; height:8px; margin-left:-1px; border-radius:1px}
.tb-et{position:absolute; left:0; top:12px; text-align:center; white-space:nowrap; font-size:12.5px; line-height:1.4; color:var(--dæmp)}
.tb-et b{display:flex; align-items:center; justify-content:center; gap:6px; font-size:13.5px; font-weight:650; color:var(--blæk)}
.tb-et b .tb-prik{margin:0}
.tb-et > span{display:block}
/* bokse til højre flugter med den synlige kant på fieldset til venstre (kanten går gennem legend) */
.tb-net #tb-res > .opsum{margin-top:10px}
.sk-net #sk-res > .svar{margin-top:10px}

/* adventskalender: fire skrivelinjer nederst i hver låge — teksten skrives på linjerne */
.adv{--al:4.5mm}
.adv.adv-25{--al:5.3mm}
.adv-låge .adv-linjer{--l:var(--al); --n:4; flex:0 0 auto; margin-top:auto; min-height:0; height:calc(4 * var(--l));
  background:repeating-linear-gradient(to bottom, transparent 0, transparent calc(var(--l) - .25mm), #E2C9C4 calc(var(--l) - .25mm), #E2C9C4 var(--l))}
/* skrivning på en enkelt linje (Navn, Klasse, lektionstider, budgettets resultat): teksten står på linjen */
.egen.ov.ul{top:auto; bottom:.2mm; padding:0 1mm; line-height:1.15; white-space:nowrap}
/* det skrevne har altid samme blå "kuglepen"-udseende, uanset skabelonens egne regler for span (fx i adventslågerne) */
.ark .egen{color:#1A4FB0 !important; font-weight:400 !important; font-style:normal !important; letter-spacing:normal !important; text-transform:none !important}
/* privatlivspolitikken: lange sætninger ombrydes i stedet for at give en vandret rullebjælke */
.privat-tabel{width:100%}
.privat-liste{padding-left:20px; margin:10px 0 14px}
.privat-liste li{margin:6px 0}
.privat-tabel th, .privat-tabel td{white-space:normal; vertical-align:top; overflow-wrap:break-word}
.privat-tabel th:first-child, .privat-tabel td:first-child{width:52%}


/* dagpleje, børnehave og skole: fødselsdato, hop-knapper og overblikket over de tre trin */
.bp-hop-lbl{font-size:13px; font-weight:600; color:var(--dæmp); margin:2px 0 6px}
.bp-hop{display:flex; flex-wrap:wrap; gap:8px; margin:0 0 12px}
.bp-hop .knap{padding:7px 13px}
/* bokse til højre flugter med den synlige kant på fieldset til venstre (kanten går gennem legend) */
.bp-net [id^="bp-svar"] > .svar, .bp-overblik-boks{margin-top:10px}
.bp-overblik-boks{background:var(--flade); border:1px solid var(--linje); border-radius:var(--r); padding:14px 16px 6px}
.bp-overblik-boks h2{font-size:17px; margin:0 0 4px}
.bp-vej{list-style:none; margin:0; padding:0}
.bp-trin{--bp:var(--grøn); --bp-b:var(--grøn-b)}
.bp-trin.bp-dagpleje{--bp:var(--rav); --bp-b:var(--rav-b)}
.bp-trin.bp-skole{--bp:var(--blå); --bp-b:var(--blå-b)}
.bp-trin-indre{display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:4px 12px; color:var(--blæk)}
a.bp-trin-indre:hover{text-decoration:none}
a.bp-trin-indre:hover b{text-decoration:underline; color:var(--grøn)}
.bp-prik{position:relative; z-index:1; width:32px; height:32px; border-radius:50%; display:grid; place-items:center; font-size:14px; font-weight:700; background:var(--bp-b); color:var(--bp); border:2px solid var(--bp)}
.bp-trin.nu .bp-prik{background:var(--bp); color:var(--flade)}
.bp-trin.sket .bp-prik{font-size:0}
.bp-trin.sket .bp-prik::before{content:'✓'; font-size:15px}
.bp-tekst{display:grid; min-width:0; line-height:1.35}
.bp-tekst b{font-size:15px; font-weight:650}
.bp-dato{font-size:14.5px; font-weight:600}
.bp-alder{font-size:12.5px; color:var(--dæmp)}
.bp-status{justify-self:end; font-size:12px; font-weight:600; padding:3px 10px; border-radius:99px; background:var(--flade2); color:var(--dæmp); white-space:nowrap}
.bp-trin.nu .bp-status{background:var(--bp); color:var(--flade)}
/* lodret på den fælles side: en tidslinje gennem prikkerne */
.bp-lodret{position:relative}
.bp-lodret::before{content:''; position:absolute; left:15px; top:16.6%; bottom:16.6%; width:2px; background:var(--linje)}
.bp-lodret .bp-trin-indre{padding:10px 0}
/* vandret på undersiderne: tre kort, siden man står på er fremhævet */
.bp-vandret{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px}
.bp-vandret .bp-trin-indre{height:100%; grid-template-columns:auto minmax(0,1fr); padding:12px 14px; background:var(--flade); border:1px solid var(--linje); border-radius:var(--r)}
.bp-vandret .bp-status{grid-column:2; justify-self:start}
.bp-vandret a.bp-trin-indre:hover{border-color:var(--bp)}
.bp-vandret .denne .bp-trin-indre{border:2px solid var(--bp); padding:11px 13px}
.bp-videre{font-weight:600; margin-top:2px}
.bp-tabel td.navn{min-width:14em}
.bp-tabel tr.bp-fortid td{color:var(--dæmp)}
.bp-skoleaar tr.nu td{background:var(--grøn-b); font-weight:650}
@media (max-width:760px){
  .bp-vandret{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:560px){
  .bp-lodret .bp-trin-indre{grid-template-columns:auto minmax(0,1fr)}
  .bp-lodret .bp-status{grid-column:2; justify-self:start}
  .bp-tabel td{white-space:normal}
  .bp-tabel td.navn{min-width:9em}
}
.bp-net{margin-bottom:40px}
#bp-tilmeld:empty{display:none}

/* aldersberegner: fødselsdagen til venstre, svaret til højre — de to bokse flugter foroven (fieldsettets kant går
   gennem legend, derfor 10px) og forneden (begge strækkes til rækkens højde) */
.al-top{grid-template-columns:minmax(250px,1fr) minmax(0,2fr); align-items:stretch; margin-bottom:40px}
.al-felt{display:flex; flex-direction:column; margin:0}
.al-felt .felter{margin-bottom:10px}
.al-felt .husk-note{margin:auto 0 10px}
.al-top #al-svar{min-width:0}
.al-top .al-svar{margin:10px 0 0; height:calc(100% - 10px); padding:14px 20px; gap:20px}
.al-svar .krop h2{font-size:19px}
.al-svar .fakta{margin-top:10px; padding-top:10px; gap:8px 20px}
.al-svar .fakta div b{font-size:15.5px}
.al-svar .fakta div span{display:block}
/* alderen med "År" centreret under tallet */
.al-alder{text-align:center; min-width:64px}
.svar .al-alder small{margin:8px 0 0; font-size:12.5px}
/* "Dit liv illustreret med bokse" og "Milepæle" deler rækker: figuren og tabellen begynder i samme højde */
.al-to{row-gap:0; grid-template-rows:auto auto 1fr}
.al-to > section{display:grid; grid-row:span 3; grid-template-rows:subgrid; grid-template-columns:minmax(0,1fr); align-content:start}
.al-to #al-liv .graf{margin:0}
.al-mil-tabel td{padding-top:6px; padding-bottom:6px}
/* Milepæle og Fun facts: den næste står på grøn baggrund, de passerede står i gråt, og fun facts har et lille mærke */
.al-mil-tabel tr.næst{background:var(--grøn-b)}
.al-mil-tabel tr.forbi td,.al-mil-tabel tr.forbi td b{color:var(--dæmp2)}
.al-mil-tabel .ms-u{display:block; font-size:12px; line-height:1.35; color:var(--dæmp); margin-top:1px}
.al-mil-tabel tr.forbi .ms-u{color:var(--dæmp2)}
.al-mil-tabel .ms-ff{display:inline-block; font-style:normal; font-size:11px; font-weight:650; line-height:1; padding:2px 6px 2px; margin-right:6px; border-radius:999px; background:var(--rav-b); color:var(--rav); vertical-align:1px}
.al-mil-tabel tr.forbi .ms-ff{background:var(--flade2); color:var(--dæmp2)}
.al-mil-tabel td:nth-child(2),.al-mil-tabel td.num{white-space:nowrap}
/* på telefonen står datoen under "Hvornår", så tabellen ikke skal rulles sidelæns */
.al-mil-tabel .ms-d2{display:none}
@media (max-width:560px){
  .al-mil-tabel th:nth-child(2),.al-mil-tabel td:nth-child(2){display:none}
  .al-mil-tabel .ms-d2{display:block; font-size:12px; color:var(--dæmp); margin-top:1px}
  .al-mil-tabel tr.forbi .ms-d2{color:var(--dæmp2)}
}
.al-mil-tabel th{padding-top:7px; padding-bottom:7px}
/* hver række kan klikkes og åbner en popup med mere om milepælen (navnet er en knap, så det også virker med tastaturet) */
.al-mil-tabel tbody tr{cursor:pointer; transition:background-color .15s}
.al-mil-tabel tbody tr:hover{background:color-mix(in srgb, var(--grøn) 7%, transparent)}
.al-mil-tabel tbody tr.næst:hover{background:color-mix(in srgb, var(--grøn) 22%, var(--flade))}
.ms-knap{display:block; width:100%; margin:0; padding:0; border:0; background:none; font:inherit; color:inherit; text-align:left; cursor:pointer}
.ms-knap b{text-decoration:underline dotted; text-decoration-thickness:1px; text-underline-offset:3px; text-decoration-color:color-mix(in srgb, currentColor 45%, transparent)}
.al-mil-tabel tr:hover .ms-knap b{text-decoration-color:currentColor}
.ms-knap:focus-visible{outline:2px solid var(--grøn); outline-offset:3px; border-radius:4px}
/* popuppen (UI.popup) */
.pop-dlg{max-width:440px}
.pop-dlg .d-hoved h2{font-size:18px; margin:0; line-height:1.3}
.ms-pop p{margin:0 0 10px}
.ms-pop-top{display:flex; gap:6px; flex-wrap:wrap}
.ms-mærke,.ms-pop-forbi,.ms-pop-idag{display:inline-block; font-size:11.5px; font-weight:650; line-height:1; padding:4px 8px; border-radius:999px; background:var(--grøn-b); color:var(--grøn)}
.ms-mærke.ff{background:var(--rav-b); color:var(--rav)}
.ms-pop-forbi{background:var(--flade2); color:var(--dæmp)}
.ms-pop-dato{color:var(--dæmp); font-size:14px}
.ms-pop-dato b{color:var(--blæk)}
.ms-pop-nu{display:flex; flex-direction:column; gap:3px; margin-top:4px; padding:10px 12px; border-radius:var(--r); background:var(--grøn-b)}
.ms-pop-nu span{font-size:11.5px; font-weight:650; letter-spacing:.05em; text-transform:uppercase; color:var(--dæmp)}
.ms-pop-nu b{font-size:15.5px; line-height:1.35}
/* når grafen står i tre søjler (fra 1136 px), strækkes tabellen, så bunden også flugter med grafen */
@media (min-width:1136px){
  .al-to #al-liv, .al-to #al-mil{display:flex; flex-direction:column}
  .al-to #al-liv .graf{flex:1 1 auto; display:flex; flex-direction:column}
  .al-to #al-liv .liv-tegning{margin-top:auto}
  .al-to #al-liv .liv-leg{margin-bottom:auto}
  .al-to #al-mil .tabelboks{flex:1 1 auto}
  .al-to #al-mil .al-mil-tabel{height:100%}
}
@media (max-width:760px){
  .al-top{grid-template-columns:minmax(0,1fr); gap:0}
  .al-top .al-svar{height:auto; margin-top:14px}
}
/* Hvor hurtigt føles tiden? — uret til venstre, alder og tal til højre (under hinanden på mindre skærme) */
.at-boks{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.12fr); background:var(--flade); border:1px solid var(--linje); border-radius:var(--r)}
.at-ur{position:relative; display:flex; flex-direction:column; align-items:center; justify-content:center; padding:30px 20px 22px; border-right:1px solid var(--linje); min-width:0}
.at-ur .info-i{position:absolute; top:12px; right:12px; margin:0}
.at-tid{font-size:clamp(46px,6.6vw,84px); font-weight:650; line-height:1; letter-spacing:-.05em; font-variant-numeric:tabular-nums; font-feature-settings:"tnum"; white-space:nowrap; color:var(--blæk)}
.at-enh{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); width:100%; max-width:380px; margin-top:12px; color:var(--dæmp); font-size:11px; text-transform:uppercase; letter-spacing:.15em; text-align:center}
/* de to små ure under det store: virkelig tid og forskellen (rød) */
.at-smaa{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; width:100%; max-width:380px; margin-top:20px}
.at-smaa > div{border:1px solid var(--linje); border-radius:var(--r); padding:8px 10px 9px; text-align:center; background:var(--bg); min-width:0}
.at-smaa > div > span{display:block; font-size:12px; color:var(--dæmp); line-height:1.3}   /* kun etiketterne — ikke tallene inde i b */
.at-smaa b{display:block; margin-top:2px; font-size:22px; font-weight:650; letter-spacing:-.02em; line-height:1.2; font-variant-numeric:tabular-nums; font-feature-settings:"tnum"; white-space:nowrap; color:var(--blæk)}
.at-smaa .at-forskel b{color:var(--rød)}
/* fortegnet har en fast plads (og en lige så bred tom plads til højre), så tallene ikke flytter sig, når det skifter */
.at-smaa .at-tegn{display:inline-block; width:.6em; text-align:center; font-style:normal}
.at-smaa .at-forskel b::after{content:''; display:inline-block; width:.6em}
.at-forfra{margin-top:14px}
.at-tip{margin:12px 0 0; padding:10px 14px; border-radius:var(--r); background:var(--grøn-b); color:var(--blæk); font-size:14.5px}
.at-styr{padding:18px 22px 20px; min-width:0}
.at-r{display:flex; justify-content:space-between; align-items:flex-end; gap:16px; margin-bottom:8px}
.at-l{display:block; color:var(--dæmp); font-size:13px}
.at-v{font-size:30px; font-weight:650; letter-spacing:-.03em; line-height:1.15; font-variant-numeric:tabular-nums; white-space:nowrap}
.at-v .at-e{font-size:16px; font-weight:600; color:var(--dæmp); letter-spacing:0}
.at-hast{text-align:right}
.at-sk{display:flex; justify-content:space-between; color:var(--dæmp); font-size:12px; margin-top:2px}
.at-tal3{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin-top:16px}
.at-tal3 > div{border:1px solid var(--linje); border-radius:var(--r); padding:11px 13px; background:var(--bg); min-width:0}
.at-tal3 span{display:block; color:var(--dæmp); font-size:12.5px; line-height:1.35; margin-bottom:4px}
.at-tal3 b{font-size:20px; font-weight:650; letter-spacing:-.02em; font-variant-numeric:tabular-nums; white-space:nowrap}
.at-forkl{margin:12px 0 0; color:var(--dæmp); font-size:14px}
.at-fig-h{margin:30px 0 4px}
.at-fig-u{color:var(--dæmp); font-size:14.5px; margin:0 0 12px}
.at-fig{background:var(--flade); border:1px solid var(--linje); border-radius:var(--r); padding:8px 0 4px; overflow:hidden}
.at-fig svg{display:block; width:100%; height:auto}
/* kilderne under tidslinjen */
.at-kilder{margin-top:18px; color:var(--dæmp); font-size:14px; line-height:1.55}
.at-kilder-h{margin:0 0 6px; font-size:15px; color:var(--blæk)}
.at-kilder p{margin:0 0 8px; max-width:100ch}
.at-ref{margin:10px 0 0; padding:10px 0 0 18px; border-top:1px solid var(--linje); font-size:12.5px; line-height:1.5}
.at-ref li{margin:2px 0}
.at-ref a{color:inherit; text-decoration:underline; text-decoration-color:color-mix(in srgb, currentColor 45%, transparent); text-underline-offset:2px}
.at-ref a:hover{color:var(--grøn)}
.at-fig .at-lab{fill:var(--blæk); font-weight:600}
.at-fig .at-boejle{fill:none; stroke:var(--dæmp2); stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round}
.at-fig .at-baand{fill:var(--grøn-b); stroke:var(--linje); stroke-width:1.5}
.at-fig .at-aar{stroke:var(--grøn); stroke-width:1}
.at-fig .at-aar.nu{stroke-width:2.6}
.at-fig .at-mark{stroke:url(#at-gloed); stroke-width:4}
.at-fig .at-s1{stop-color:var(--grøn); stop-opacity:.98}
.at-fig .at-s2{stop-color:var(--grøn); stop-opacity:.12}
.at-fig .at-boble{fill:var(--grøn)}
.at-fig .at-boble-t{fill:var(--på-grøn); font-weight:700}
.at-fig .at-akse{fill:var(--dæmp)}
@media (max-width:900px){
  .at-boks{grid-template-columns:minmax(0,1fr)}
  .at-ur{border-right:0; border-bottom:1px solid var(--linje); padding:30px 16px 20px}
}
@media (max-width:560px){
  .at-styr{padding:16px 14px 16px}
  .at-v{font-size:26px}
  .at-tal3{grid-template-columns:minmax(0,1fr); gap:8px}
  .at-tal3 > div{display:flex; justify-content:space-between; align-items:baseline; gap:12px}
  .at-tal3 span{margin:0}
  .at-tal3 b{font-size:18px}
  .at-smaa{gap:8px; margin-top:16px}
  .at-smaa b{font-size:19px}
}
@media (max-width:760px){ .al-alder{justify-self:start} }

/* Værktøjer: overgangen fra de fremhævede kort (selve bevægelsen ligger i app.js, vtOvergang).
   Kopien af kortet ligger under headeren (z-index 70) og over indholdet. */
.vt-top.vt-lag{position:fixed; inset:0; display:block; margin:0; z-index:65; pointer-events:none}
.vt-lag .vt-fremhævet.vt-kopi{position:fixed; margin:0; min-height:0; transform-origin:50% 50%; will-change:transform, opacity}

/* Tiden Live: dato, klokkeslæt og uge står lige over tabellen i samme størrelse som kolonnen "Periode" */
.tid-side .tid-nu{justify-content:flex-start; gap:4px 14px; font-size:14px; margin:0 0 8px; padding:0 2px}
@media (min-width:1700px){ .tid-side .tid-nu{font-size:17px} }

/* ---------------- Renters rente-beregner ---------------- */
.rr-hoved{display:flex; flex-direction:column; gap:2px; padding:16px 18px; border-radius:var(--r); background:linear-gradient(120deg, var(--grøn), #0F7A55 60%, #13895F); color:#fff; margin-bottom:12px}
.rr-hoved span{font-size:13.5px; opacity:.88}
.rr-hoved b{font-size:clamp(28px, 4vw, 38px); font-weight:780; letter-spacing:-.025em; line-height:1.1; font-variant-numeric:tabular-nums}
.rr-hoved em{font-style:normal; font-size:13.5px; opacity:.88}
html[data-tema="mork"] .rr-hoved{background:linear-gradient(120deg, #0B5A3D, #0F6E4C 55%, #15805A)}
/* den grønne boks flugter med fieldset-kanten (kanten ligger midt i legend-teksten) */
.rr-net{margin-bottom:18px}
.rr-hoejre{margin-top:10px}
.rr-hoejre .stabel{margin:2px 0 6px}
.rr-hoejre .graf-leg{margin-bottom:12px}
.rr-tal{grid-template-columns:repeat(2,minmax(0,1fr))}
.rr-tal span{display:block; line-height:1.3; margin-top:3px}
.rr-tal div.med-info{position:relative; padding-right:38px}
.rr-tal .info-i{position:absolute; top:11px; right:11px; margin:0}
.rr-graf{margin:0 0 44px}
.rr-note{margin:0 0 10px; font-size:13.5px; color:var(--dæmp); line-height:1.45}
.rr-graf .graf .gt{font-size:11px}
.rr-graf .graf-leg{font-size:11.5px; margin-bottom:0}
.rr-graf .rr-år-note{margin-left:auto; color:var(--dæmp)}
.rr-søjle{cursor:default}
.rr-søjle:hover rect:not(:last-child){filter:brightness(1.08) saturate(1.1)}
.rr-mere{margin:4px 0 2px; border-top:1px solid var(--linje); padding-top:8px}
.rr-mere > summary{cursor:pointer; font-size:14px; font-weight:600; color:var(--grøn); padding:4px 0 10px; list-style:none; display:flex; align-items:center; gap:8px}
.rr-mere > summary::-webkit-details-marker{display:none}
.rr-mere > summary::before{content:''; width:7px; height:7px; border-right:2px solid currentColor; border-bottom:2px solid currentColor; transform:rotate(-45deg); transition:transform .2s; flex:none}
.rr-mere[open] > summary::before{transform:rotate(45deg)}
.rr-valg{grid-template-columns:repeat(2,minmax(0,1fr)); margin-bottom:12px}
.rr-to{align-items:start}
.rr-mil h3,.rr-sml h3{margin:0 0 8px; font-size:15.5px}
.rr-mil ol{list-style:none; margin:0; padding:0; display:grid; gap:6px}
.rr-mil li{display:flex; justify-content:space-between; align-items:baseline; gap:12px; padding:9px 12px; border:1px solid var(--linje); border-radius:10px; background:var(--flade)}
.rr-mil li b{font-variant-numeric:tabular-nums}
.rr-mil li span{color:var(--dæmp); font-size:13.5px; text-align:right}
.rr-sml ul{margin:0; padding:0; list-style:none; display:grid; gap:8px}
.rr-sml li{padding:10px 12px; border-radius:10px; background:var(--flade); border:1px solid var(--linje); font-size:14.5px; line-height:1.45}
.rr-sml li b{display:block; color:var(--grøn)}
.rr-tabel-d > summary{cursor:pointer; color:var(--grøn); font-weight:600; font-size:14.5px; margin-bottom:10px}
.rr-tabel-d .skjul{display:none} .rr-tabel-d[open] .skjul{display:inline} .rr-tabel-d[open] .vis{display:none}
.rr-tabel-d td,.rr-tabel-d th{white-space:nowrap}
.rr-tabel-d td.rr-år{font-weight:600}
@media (max-width:600px){ .rr-valg{grid-template-columns:1fr} .rr-mil li{flex-direction:column; gap:2px} .rr-mil li span{text-align:left} }

/* ---------------- Inflationsberegner ---------------- */
.inf-net{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); grid-template-areas:'form res' 'nu res'; gap:0 14px; align-items:start; margin-bottom:34px}
.inf-a{grid-area:form} .inf-res-kol{grid-area:res; margin-top:9.5px} .inf-nu{grid-area:nu}
.inf-res-kol .husk-note{margin:10px 0 0}
.inf-net{scroll-margin-top:68px}
.inf-nu{background:var(--flade); border:1px solid var(--linje); border-radius:var(--r); padding:13px 16px 12px}
.inf-nu h2{font-size:15px; margin:0 0 9px}
.inf-nu h2 span{font-weight:500; color:var(--dæmp)}
.inf-nu-tal{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px}
.inf-nu-tal div{border-left:3px solid var(--grøn-l); padding-left:10px}
.inf-nu-tal b{display:block; font-size:22px; font-weight:760; letter-spacing:-.02em; font-variant-numeric:tabular-nums; line-height:1.2}
.inf-nu-tal span{display:block; font-size:12.5px; color:var(--dæmp); line-height:1.35; margin-top:2px}
.inf-nu p{margin:10px 0 0; font-size:12.5px; color:var(--dæmp)}
/* valuta og kontakten til de historiske år */
.inf-valg{display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:10px 16px; margin:2px 0 14px}
.inf-valuta-felt{display:flex; align-items:center; gap:8px}
.inf-lbl{font-size:12.5px; color:var(--dæmp)}
.inf-valuta button{min-width:54px; font-weight:600; font-variant-numeric:tabular-nums; letter-spacing:.02em}
.inf-hist-felt{display:flex; align-items:center; gap:7px}
.inf-hist{display:inline-flex; align-items:center; gap:9px; cursor:pointer; font-size:14px; line-height:1.3; position:relative; user-select:none}
.inf-hist input{position:absolute; left:0; top:0; width:38px; height:22px; margin:0; opacity:0; cursor:pointer}
.inf-sw{width:38px; height:22px; border-radius:99px; background:var(--flade3); border:1px solid var(--linje); position:relative; flex:none; transition:background .2s, border-color .2s}
.inf-sw::after{content:''; position:absolute; left:2px; top:2px; width:16px; height:16px; border-radius:50%; background:#fff; box-shadow:0 1px 3px rgba(0,0,0,.28); transition:transform .2s cubic-bezier(.4,0,.2,1)}
.inf-hist input:checked + .inf-sw{background:var(--grøn); border-color:var(--grøn)}
.inf-hist input:checked + .inf-sw::after{transform:translateX(16px)}
.inf-hist input:focus-visible + .inf-sw{outline:2px solid var(--grøn); outline-offset:2px}
.inf-hist input:disabled{cursor:not-allowed}
.inf-hist input:disabled + .inf-sw{opacity:.45}
.inf-hist input:disabled ~ span:last-child{color:var(--dæmp2)}
.inf-hist-felt .info-i{margin:0}
.inf-note-hist{display:flex; align-items:center; gap:6px; margin-bottom:4px}
.inf-note-hist .info-i{margin:0; flex:none}
.inf-hist-bg{fill:var(--rav-b); opacity:.55}
.graf .inf-hist-t{fill:var(--rav); font-weight:600}
.inf-log{color:var(--dæmp); font-style:italic}
.inf-felter{display:grid; grid-template-columns:minmax(0,1fr) 42px minmax(0,1fr); gap:12px; align-items:end; margin-bottom:12px}
.inf-belob-felt{grid-column:1 / -1}
.inf-kr{position:relative}
.felt .inf-kr input{padding-right:44px; font-size:21px; font-weight:680; letter-spacing:-.01em; min-height:50px; font-variant-numeric:tabular-nums}
.inf-kr span{position:absolute; right:14px; top:50%; transform:translateY(-50%); color:var(--dæmp); font-size:15px; pointer-events:none}
.inf-kr input[aria-invalid="true"]{border-color:var(--rød); box-shadow:0 0 0 3px var(--rød-b)}
.inf-fejl{margin:6px 0 0; font-size:12.5px; color:var(--rød)}
.felt .inf-felter select,.inf-felter .felt select{min-height:46px; font-size:17px; font-weight:600; font-variant-numeric:tabular-nums; cursor:pointer}
.inf-byt{width:42px; height:42px; margin-bottom:2px; border:1px solid var(--linje); border-radius:50%; background:var(--flade); color:var(--grøn); display:grid; place-items:center; cursor:pointer; transition:background .15s, border-color .15s}
.inf-byt:hover{border-color:var(--grøn); background:var(--grøn-b)}
.inf-byt svg{width:19px; height:19px}
.inf-byt.drej svg{animation:inf-drej .45s cubic-bezier(.4,0,.2,1)}
@keyframes inf-drej{from{transform:rotate(0)} to{transform:rotate(180deg)}}
.inf-hurtig{display:flex; flex-wrap:wrap; align-items:center; gap:6px; margin:2px 0 14px}
.inf-hurtig > span{font-size:12.5px; color:var(--dæmp); margin-right:2px}
.inf-hurtig button{border:1px solid var(--linje); background:var(--flade); color:var(--blæk); border-radius:999px; padding:3px 11px; font-size:13px; cursor:pointer; font-variant-numeric:tabular-nums; line-height:1.5}
.inf-hurtig button:hover{border-color:var(--grøn); color:var(--grøn)}
.inf-hurtig button[aria-pressed="true"]{background:var(--grøn); border-color:var(--grøn); color:var(--på-grøn); font-weight:600}
.inf-blink{animation:inf-blink 1.2s ease-out}
@keyframes inf-blink{0%,30%{box-shadow:0 0 0 4px var(--grøn-l)} 100%{box-shadow:0 0 0 4px transparent}}
.inf-hoved{margin-bottom:12px}
.inf-hoved b{font-size:clamp(30px, 4.2vw, 42px)}
.inf-hoved em{line-height:1.45; margin-top:6px}
.inf-tal{grid-template-columns:repeat(2,minmax(0,1fr)); margin-bottom:8px}
.inf-tal div:not(.hoved) b{font-size:20px}
.inf-note{font-size:12.5px; color:var(--dæmp); margin:0}
/* år for år: tabellen (12 rækker høj, rul indeni) og grafen ved siden af */
.inf-aar{display:grid; grid-template-columns:minmax(0,5fr) minmax(0,7fr); gap:14px; align-items:start}
.inf-tabel{max-height:480px; overflow:auto; overscroll-behavior:contain; position:relative}
.inf-tabel:focus-visible{outline:2px solid var(--grøn); outline-offset:2px}
.inf-tabel table{font-variant-numeric:tabular-nums}
.inf-tabel thead th{position:sticky; top:0; z-index:2}
.inf-tabel tbody th{font-weight:650; color:var(--blæk); font-size:14px; background:none; border-bottom:1px solid var(--linje2); padding:8px 12px}
.inf-tabel tbody tr:last-child th{border-bottom:none}
.inf-tabel tbody tr.ende th,.inf-tabel tbody tr.ende td{background:var(--grøn-b); font-weight:700}
.inf-tabel tbody tr.mark th,.inf-tabel tbody tr.mark td{background:var(--rav-b)}
.inf-tabel td.neg{color:var(--blå)}
.inf-tabel td.høj{color:var(--rav)}
.inf-tabel sup{font-size:11px; color:var(--dæmp); margin-left:1px}
.inf-graf-boks{margin:0; padding:10px 12px 8px}
.inf-graf-top{display:flex; justify-content:space-between; align-items:center; gap:8px 12px; flex-wrap:wrap; margin-bottom:6px}
.inf-graf-top .graf-leg{padding:0}
.inf-graf{min-height:220px}
.inf-graf svg{display:block; width:100%; height:auto; touch-action:pan-y}
.inf-linje{fill:none; stroke:var(--grøn-m); stroke-width:2.6; stroke-linejoin:round; stroke-linecap:round}
.inf-omr{fill:url(#inf-omr-g)}
.inf-pkt{fill:var(--flade); stroke:var(--grøn-m); stroke-width:2.6}
.graf .inf-pkt-t{fill:var(--blæk)}
.inf-bar.op{fill:var(--rav-m)}
.inf-bar.ned{fill:#2F6FD0}
.inf-bar.mark{fill-opacity:.65}
.inf-maal{stroke:var(--dæmp2); stroke-width:1.2; stroke-dasharray:5 4}
.graf .inf-maal-t{fill:var(--dæmp); paint-order:stroke; stroke:var(--flade); stroke-width:4px; stroke-linejoin:round}
.graf .inf-pkt-t{paint-order:stroke; stroke:var(--flade); stroke-width:4px; stroke-linejoin:round}
.inf-guide{stroke:var(--blæk); stroke-opacity:.32; stroke-width:1}
.inf-prik{fill:var(--grøn-m); stroke:var(--flade); stroke-width:2.5}
.inf-hov{fill:transparent; cursor:crosshair}
/* varerne: 4 i bredden på pc, 3 på tablet og 2 på mobil */
.inf-kurv{background:var(--flade); border:1px solid var(--linje); border-left:4px solid var(--grøn-m); border-radius:var(--r); padding:11px 14px; margin:0 0 16px; font-size:14.5px; line-height:1.5}
.inf-kurv[hidden]{display:none}
.inf-kurv b{color:var(--grøn)}
.inf-varer{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px}
.inf-vare{background:var(--flade); border:1px solid var(--linje); border-radius:14px; padding:10px 10px 12px; display:flex; flex-direction:column; transition:box-shadow .3s, border-color .3s}
.inf-ill{background:var(--tint, var(--flade2)); border-radius:10px; aspect-ratio:5 / 3.4; display:grid; place-items:center; overflow:hidden}
.inf-ill svg{width:84%; height:auto; overflow:visible}
.inf-ill .sk{fill:#0F1613; opacity:.12; transform-box:fill-box; transform-origin:50% 50%; transition:transform .35s cubic-bezier(.34,1.45,.64,1), opacity .35s}
.inf-ill .fig{transform-box:fill-box; transform-origin:50% 100%; transition:transform .35s cubic-bezier(.34,1.45,.64,1)}
@media (hover:hover) and (prefers-reduced-motion:no-preference){
  .inf-vare:hover{box-shadow:0 18px 34px -22px rgba(15,22,19,.45)}
  .inf-vare:hover .fig{transform:translateY(-3.5px) rotate(-2.5deg) scale(1.05)}
  .inf-vare:hover .sk{transform:scale(.84); opacity:.07}
}
.inf-vare h3{font-size:15px; margin:10px 2px 7px; line-height:1.25}
.inf-vare h3 span{display:block; font-weight:500; font-size:12.5px; color:var(--dæmp); margin-top:2px}
.inf-v-tal{margin-top:auto}
.inf-v-priser{margin:0 2px; display:grid; gap:1px}
.inf-v-priser div{display:flex; justify-content:space-between; align-items:baseline; gap:8px}
.inf-v-priser dt{font-size:12.5px; color:var(--dæmp); font-variant-numeric:tabular-nums}
.inf-v-priser dd{margin:0; font-variant-numeric:tabular-nums; font-size:14px; white-space:nowrap}
.inf-v-priser div + div dd{font-weight:750; font-size:16px}
.inf-v-bund{margin:8px 2px 0; display:flex; flex-wrap:wrap; align-items:center; gap:4px 7px; font-size:12.5px; color:var(--dæmp); line-height:1.35}
.inf-v-pct{font-weight:700; padding:2px 8px; border-radius:99px; background:var(--flade3); color:var(--blæk); font-variant-numeric:tabular-nums; white-space:nowrap}
.inf-v-pct.mere{background:var(--rav-b); color:var(--rav)}
.inf-v-pct.mindre{background:var(--grøn-b); color:var(--grøn)}
.inf-fodnote{font-size:13px; color:var(--dæmp); margin:12px 0 0; line-height:1.5}
/* varmekortet */
.inf-varme-boks{margin-bottom:10px}
.inf-varme{table-layout:fixed; min-width:640px}
.inf-varme th,.inf-varme td{padding:3px; text-align:center; border-bottom:none; background:none}
.inf-varme thead th{font-size:12px; padding:9px 3px 6px; background:var(--flade2); border-bottom:1px solid var(--linje)}
.inf-varme thead th:first-child,.inf-varme tbody th{width:82px; text-align:left; padding-left:12px}
.inf-varme tbody th{font-size:12.5px; color:var(--dæmp); font-weight:500; white-space:nowrap; font-variant-numeric:tabular-nums}
.inf-varme tbody th,.inf-varme thead th:first-child{position:sticky; left:0; z-index:1; background:var(--flade)}
.inf-varme thead th:first-child{background:var(--flade2)}
.inf-varme tbody tr:first-child th,.inf-varme tbody tr:first-child td{padding-top:8px}
.inf-varme tbody tr:last-child th,.inf-varme tbody tr:last-child td{padding-bottom:8px}
.inf-varme tbody tr:hover{background:none}
.inf-varme .snit{width:64px; font-weight:700; font-size:12.5px; font-variant-numeric:tabular-nums; color:var(--blæk)}
.inf-varme thead .snit{font-weight:500; color:var(--dæmp)}
.inf-c{display:flex; align-items:center; justify-content:center; width:100%; min-height:30px; line-height:1.2; border:0; border-radius:6px; font:inherit; font-size:12px; font-weight:650; font-variant-numeric:tabular-nums; padding:0 2px; background:var(--flade3); color:var(--blæk)}
button.inf-c{cursor:pointer}
button.inf-c:hover{box-shadow:inset 0 0 0 2px rgba(15,22,19,.55)}
button.inf-c.valgt{box-shadow:0 0 0 2px var(--flade), 0 0 0 4px var(--blæk)}
.inf-c.tom{color:var(--dæmp2); background:none; font-weight:400}
.inf-c.v-d2{background:#2F5FA8; color:#fff}
.inf-c.v-d1{background:#B5CCEE; color:#0F2C5C}
.inf-c.v0{background:#CDEADB; color:#0B4A33}
.inf-c.v1{background:#F1E3A2; color:#4E3B00}
.inf-c.v2{background:#F3B66E; color:#462700}
.inf-c.v3{background:#DE7A3A; color:#fff}
.inf-c.v4{background:#B53A2E; color:#fff}
.inf-skala{display:flex; flex-wrap:wrap; gap:6px 14px; font-size:12.5px; color:var(--dæmp)}
.inf-skala span{display:inline-flex; align-items:center; gap:6px}
.inf-skala i{display:inline-block; width:18px; min-height:0; height:12px; border-radius:3px}
/* Vidste du? */
.inf-fakta{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px}
.inf-fakta div{background:var(--flade); border:1px solid var(--linje); border-radius:12px; padding:14px 16px}
.inf-fakta b{display:block; font-size:24px; font-weight:780; letter-spacing:-.02em; color:var(--grøn); font-variant-numeric:tabular-nums; margin-bottom:5px; line-height:1.15}
.inf-fakta span{display:block; font-size:14.5px; line-height:1.5}
.inf-tekst h3{margin:22px 0 6px; font-size:17px}
.inf-tekst p{max-width:none}
.inf-kilder{font-size:14px; color:var(--dæmp)}
html[data-tema="mork"] .inf-ill{background:var(--flade2); background:color-mix(in srgb, var(--tint) 16%, var(--flade2))}
html[data-tema="mork"] .inf-ill .sk{fill:#000; opacity:.35}
html[data-tema="mork"] .inf-c.v-d2{background:#2F62C8; color:#fff}
html[data-tema="mork"] .inf-c.v-d1{background:#46628F; color:#fff}
html[data-tema="mork"] .inf-c.v0{background:#2D6B52; color:#fff}
html[data-tema="mork"] .inf-c.v1{background:#8C7A2E; color:#fff}
html[data-tema="mork"] .inf-c.v2{background:#B07434; color:#fff}
html[data-tema="mork"] button.inf-c:hover{box-shadow:inset 0 0 0 2px rgba(255,255,255,.7)}
html[data-tema="mork"] .inf-vare:hover{box-shadow:0 16px 32px -20px rgba(0,0,0,.8)}
@media (max-width:1000px){ .inf-varer{grid-template-columns:repeat(3,minmax(0,1fr))} .inf-fakta{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:900px){ .inf-aar{grid-template-columns:minmax(0,1fr)} .inf-fakta{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:760px){ .inf-net{grid-template-columns:minmax(0,1fr); grid-template-areas:'form' 'res' 'nu'} .inf-res-kol{margin:0 0 14px} }
@media (max-width:600px){
  .inf-varer{grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px}
  .inf-vare{padding:8px 8px 10px; border-radius:12px}
  .inf-vare h3{font-size:14px}
  .inf-v-priser dd{font-size:13px} .inf-v-priser div + div dd{font-size:14.5px}
  .inf-fakta{grid-template-columns:minmax(0,1fr)}
  .inf-tal div:not(.hoved) b{font-size:18px}
}
@media (max-width:600px){ .inf-varme{min-width:560px} .inf-varme thead th:first-child,.inf-varme tbody th{width:68px; padding-left:10px} }
@media (max-width:400px){ .inf-felter{grid-template-columns:minmax(0,1fr) 38px minmax(0,1fr); gap:8px} .inf-byt{width:38px; height:38px} }
@media (min-width:1700px){ .inf-varer{gap:16px} .inf-vare h3{font-size:16.5px} .inf-v-priser dd{font-size:15.5px} .inf-v-priser div + div dd{font-size:17.5px} .inf-fakta span{font-size:16px} }

/* ---------------- Verdensure ---------------- */
.ur-blok h2{margin-bottom:4px}
.ur-h3{margin:26px 0 4px; font-size:17px}
/* kortet */
.ur-kort-boks{margin-top:12px; background:linear-gradient(180deg, var(--flade2), var(--bg)); border:1px solid var(--linje); border-radius:16px; padding:10px 10px 8px; overflow:hidden}
/* tidszonernes farver (nabozoner får forskellige farver), natten, grænsen mellem dag og nat, solen og månen */
.ur-kort{position:relative; cursor:crosshair; --ur-p0:#4E79A7; --ur-p1:#F28E2B; --ur-p2:#76B7B2; --ur-p3:#E15759; --ur-p4:#EDC948; --ur-p5:#B07AA1; --ur-p6:#9C755F; --ur-p7:#FF9DA7;
  --ur-dk:#0A8A63; --ur-akt:#1D2B3A; --ur-sol:#F4B400; --ur-nat:rgba(20,30,58,.16); --ur-linje:rgba(28,38,66,.55); --ur-maane:#EEF2F8; --ur-maane-skygge:#5A6478}
html[data-tema="mork"] .ur-kort{--ur-p0:#6B97C9; --ur-p1:#F49A45; --ur-p2:#86C5C0; --ur-p3:#EB7173; --ur-p4:#E9CB5C; --ur-p5:#C495B8; --ur-p6:#B48D73; --ur-p7:#F7A9B3;
  --ur-dk:#4CC296; --ur-akt:#FFFFFF; --ur-nat:rgba(0,0,0,.38); --ur-linje:rgba(226,233,229,.6); --ur-maane:#E6EBF3; --ur-maane-skygge:#3B4352}
/* tekster på kortet: dag, nat, solen og månen */
.ur-himmel{position:absolute; transform:translate(-50%, -50%); white-space:nowrap; line-height:16px; pointer-events:none}
.ur-himmel.sol,.ur-himmel.maane{font-size:11px; font-weight:650; color:var(--blæk); text-shadow:0 0 3px var(--flade), 0 0 3px var(--flade), 0 0 2px var(--flade)}
.ur-himmel.sol{color:#8F5408}
html[data-tema="mork"] .ur-himmel.sol{color:#F4C24D}

.ur-kort canvas{display:block}
/* på smalle skærme bliver kortet 680 px bredt og kan rulles, så alle ure kan stå med navn og klokken */
.ur-kort-rul{overflow-x:auto; overscroll-behavior-x:contain; -webkit-overflow-scrolling:touch; scrollbar-width:thin}
.ur-kort-stryg{display:none; margin:6px 0 0; text-align:center; font-size:12px; color:var(--dæmp)}
@media (max-width:700px){ .ur-kort-inde{width:680px} .ur-kort-stryg{display:block} }
.ur-pins{position:absolute; inset:0; pointer-events:none}
.ur-pin{position:absolute; width:0; height:0}
.ur-pin i{position:absolute; left:-4.5px; top:-4.5px; width:9px; height:9px; border-radius:50%; background:var(--blæk); border:2px solid var(--flade); box-shadow:0 1px 4px rgba(0,0,0,.35)}
.ur-pin.dk i{background:var(--grøn)}
.ur-pin b{position:absolute; white-space:nowrap; font-size:11.5px; font-weight:650; padding:2px 7px; border-radius:99px; background:color-mix(in srgb, var(--flade) 92%, transparent); color:var(--blæk); box-shadow:0 1px 6px rgba(0,0,0,.18); line-height:16px}
.ur-pin.lille b{font-size:11px; padding:1px 6px}
.ur-pin s{position:absolute; left:0; top:-.75px; height:1.5px; border-radius:1px; transform-origin:0 50%; background:color-mix(in srgb, var(--blæk) 55%, transparent)}
.ur-pin b em{font-style:normal; font-variant-numeric:tabular-nums; color:var(--grøn); margin-left:2px}
.ur-lineal{position:relative; height:30px; margin:6px 0 2px; border-top:1px solid var(--linje)}
.ur-lineal span{position:absolute; top:4px; transform:translateX(-50%); display:flex; flex-direction:column; align-items:center; line-height:1.1}
.ur-lineal b{font-size:12px; font-variant-numeric:tabular-nums; color:var(--blæk)}
.ur-lineal small{font-size:11px; color:var(--dæmp2)}
.ur-kort-leg{margin-top:4px; padding:0 4px}
.ur-kort-leg i{width:10px; height:10px; border-radius:50%}
.ur-kort-leg i.dk{background:var(--grøn-m)}
.ur-kort-leg i.dag{background:var(--flade); box-shadow:inset 0 0 0 1px var(--linje); border-radius:3px}
.ur-kort-leg i.nat{background:rgba(20,30,58,.3); border-radius:3px}
html[data-tema="mork"] .ur-kort-leg i.nat{background:rgba(0,0,0,.55); box-shadow:inset 0 0 0 1px var(--linje)}
.ur-kort-leg i.linje{width:18px; height:0; border-radius:0; border-top:2px dashed var(--dæmp)}
.ur-kort-leg i.sol{background:radial-gradient(circle, #F4B400 40%, #F4B40044 70%)}
.ur-kort-leg i.maane{background:linear-gradient(90deg, #5A6478 50%, #EEF2F8 50%); box-shadow:inset 0 0 0 1px rgba(20,30,50,.35)}
.ur-tip .ur-tip-klik{color:var(--grøn); font-weight:600; margin-top:3px}
/* boksen på kortet er halvgennemsigtig, så man kan se kortet bag den */
.fp-tip.ur-tip{background:color-mix(in srgb, var(--flade) 70%, transparent); border-color:color-mix(in srgb, var(--linje) 70%, transparent); box-shadow:0 10px 28px -14px rgba(0,0,0,.4); -webkit-backdrop-filter:blur(1.5px); backdrop-filter:blur(1.5px)}
/* omregneren */
.ur-omr{display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); gap:12px; align-items:center; margin-top:12px}
.ur-omr-side{background:var(--flade); border:1px solid var(--linje); border-radius:16px; padding:14px 16px 12px; display:flex; flex-direction:column; gap:9px; min-width:0}
.ur-omr-side[data-side="b"]{border-color:color-mix(in srgb, var(--grøn) 45%, var(--linje)); box-shadow:0 0 0 1px color-mix(in srgb, var(--grøn) 25%, transparent) inset}
.ur-omr-top{display:flex; justify-content:space-between; align-items:baseline; gap:10px; flex-wrap:wrap}
.ur-omr-lbl{font-size:12.5px; text-transform:uppercase; letter-spacing:.06em; color:var(--dæmp); font-weight:650}
.ur-omr-utc{font-size:12.5px; color:var(--dæmp); text-align:right}
.ur-sted{position:relative}
.ur-sted-felt,.ur-søg input{width:100%; padding:9px 12px; border:1px solid var(--linje); border-radius:10px; background:var(--bg); color:var(--blæk); font:inherit; font-size:15.5px; font-weight:600}
.ur-sted-felt:focus,.ur-søg input:focus{outline:none; border-color:var(--grøn); box-shadow:0 0 0 3px color-mix(in srgb, var(--grøn) 18%, transparent)}
.ur-omr-tid{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.25fr); gap:8px}
.ur-omr-tid input{width:100%; min-width:0; padding:8px 10px; border:1px solid var(--linje); border-radius:10px; background:var(--bg); color:var(--blæk); font:inherit; font-variant-numeric:tabular-nums}
.ur-omr-tid input.ur-kl{font-size:24px; font-weight:750; letter-spacing:-.01em; padding:4px 10px}
.ur-omr-tid input.ur-kl.fejl{border-color:#D1553F; box-shadow:0 0 0 3px rgba(209,85,63,.15)}
.ur-omr-tid input:focus{outline:none; border-color:var(--grøn); box-shadow:0 0 0 3px color-mix(in srgb, var(--grøn) 18%, transparent)}
.ur-omr-dag{font-size:12.5px; font-weight:650; color:var(--rav); min-height:1em}
.ur-byt{width:42px; height:42px; border-radius:50%; border:1px solid var(--linje); background:var(--flade); color:var(--grøn); display:grid; place-items:center; cursor:pointer; transition:transform .25s, border-color .15s, background .15s}
.ur-byt:hover{border-color:var(--grøn); background:var(--grøn-b)}
.ur-byt:active{transform:rotate(180deg)}
.ur-byt svg{transform:rotate(90deg)}
@media (max-width:760px){ .ur-omr{grid-template-columns:minmax(0,1fr)} .ur-byt{justify-self:center} .ur-byt svg{transform:none} }
.ur-omr-res{margin:12px 0 0; font-size:15px; line-height:1.5}
.ur-omr-res b{font-variant-numeric:tabular-nums}
.ur-omr-knapper{display:flex; flex-wrap:wrap; gap:6px; margin-top:10px}
.ur-omr-knapper [hidden]{display:none}
.ur-omr-alle{display:flex; flex-wrap:wrap; align-items:center; gap:6px; margin-top:10px; font-size:13.5px}
.ur-omr-alle-lbl{color:var(--dæmp); margin-right:2px}
.ur-chip{padding:3px 9px; border-radius:99px; background:var(--flade2); border:1px solid var(--linje)}
.ur-chip b{font-variant-numeric:tabular-nums}
.ur-chip em{font-style:normal; color:var(--rav); font-size:12px}
/* forslag i søgefelterne */
.ur-forslag{position:absolute; left:0; right:0; top:calc(100% + 4px); z-index:60; background:var(--flade); border:1px solid var(--linje); border-radius:12px; box-shadow:0 18px 40px -18px rgba(0,0,0,.35); padding:4px; max-height:320px; overflow:auto}
.ur-forslag[hidden]{display:none}
.ur-f{display:grid; grid-template-columns:auto 1fr auto; align-items:baseline; gap:2px 8px; padding:7px 10px; border-radius:8px; cursor:pointer; font-size:14px}
.ur-f span{color:var(--dæmp); font-size:13px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.ur-f em{font-style:normal; color:var(--dæmp); font-size:12.5px; font-variant-numeric:tabular-nums; white-space:nowrap}
.ur-f.aktiv,.ur-f:hover{background:var(--grøn-b)}
.ur-f-tom{padding:8px 10px; color:var(--dæmp); font-size:13.5px}
/* dine ure */
.ur-mine-hoved{display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:10px 18px}
.ur-mine-hoved h2{margin:0}
.ur-mine-hoved h2 small{font-size:13px; font-weight:500; color:var(--dæmp); margin-left:6px}
.ur-søg{position:relative; flex:1 1 280px; max-width:420px}
.ur-søg svg{position:absolute; left:12px; top:50%; transform:translateY(-50%); color:var(--dæmp); pointer-events:none}
.ur-søg input{padding-left:36px; font-weight:500}
.ur-mine{display:grid; grid-template-columns:repeat(auto-fill, minmax(min(100%, 196px), 1fr)); gap:10px; margin:14px 0 8px}
@media (max-width:600px){ .ur-mine{grid-template-columns:repeat(2, minmax(0, 1fr)); gap:8px} .ur-ur{padding:10px 11px 9px; border-radius:14px} .ur-ur .ur-hm{font-size:29px} .ur-ur .ur-s{font-size:13px} .ur-ur-top b{font-size:14px} .ur-ur-bund{flex-direction:column; gap:1px; font-size:12px} .ur-dn{width:16px; height:16px} .ur-dn svg{width:16px; height:16px} }
.ur-ur{position:relative; background:var(--flade); border:1px solid var(--linje); border-radius:16px; padding:12px 14px 11px; display:flex; flex-direction:column; gap:6px; min-width:0}
.ur-ur.dk{background:linear-gradient(135deg, var(--grøn), #0F7A55); border-color:transparent; color:#fff}
html[data-tema="mork"] .ur-ur.dk{background:linear-gradient(135deg, #0B5A3D, #15805A)}
.ur-ur.ur-ny{animation:ur-ny 1.2s ease-out}
@keyframes ur-ny{ 0%{box-shadow:0 0 0 0 color-mix(in srgb, var(--grøn) 55%, transparent)} 100%{box-shadow:0 0 0 14px transparent} }
.ur-ur-top{display:flex; justify-content:space-between; align-items:flex-start; gap:8px}
.ur-ur-top b{display:block; font-size:15.5px; line-height:1.2; overflow-wrap:anywhere}
.ur-ur-top > div{min-width:0}
.ur-ur-top span{display:block; font-size:12.5px; color:var(--dæmp); white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.ur-ur.dk .ur-ur-top span{color:rgba(255,255,255,.82)}
.ur-fjern{flex:none; width:26px; height:26px; margin:-4px -6px 0 0; border-radius:50%; border:0; background:transparent; color:var(--dæmp); font-size:19px; line-height:1; cursor:pointer}
.ur-fjern:hover{background:var(--flade2); color:var(--blæk)}
.ur-digital{display:flex; align-items:baseline; gap:2px; font-variant-numeric:tabular-nums; line-height:1}
.ur-hm{font-size:38px; font-weight:780; letter-spacing:-.03em}
.ur-s{font-size:17px; font-weight:650; color:var(--dæmp); min-width:2.2ch}
.ur-ur.dk .ur-s{color:rgba(255,255,255,.75)}
.ur-dn{margin-left:auto; align-self:center; width:20px; height:20px; display:grid; place-items:center}
.ur-dn svg{width:20px; height:20px; fill:none; stroke-width:1.8; stroke-linecap:round}
.ur-dn.dag svg{stroke:#E0A22E; fill:#F4C24D55}
.ur-dn.nat svg,.ur-dn.skumring svg{stroke:#6E86C9; fill:#6E86C933}
.ur-ur.dk .ur-dn svg{stroke:#fff; fill:rgba(255,255,255,.25)}
.ur-ur-bund{display:flex; justify-content:space-between; align-items:baseline; gap:8px; flex-wrap:wrap; font-size:12.5px}
.ur-dato{color:var(--dæmp)}
.ur-ur.dk .ur-dato{color:rgba(255,255,255,.85)}
.ur-dato em{font-style:normal; font-weight:650; color:var(--rav)}
.ur-diff{font-style:normal; font-weight:650; font-variant-numeric:tabular-nums; white-space:nowrap}
.ur-diff.foran{color:var(--grøn)} .ur-diff.bagud{color:var(--blå)} .ur-diff.samme{color:var(--dæmp)}
.ur-ur.dk .ur-diff{color:#fff}
/* hvem er foran og bagud */
.ur-bj{position:relative; display:grid; grid-template-columns:minmax(84px, max-content) minmax(0,1fr); gap:6px 12px; margin-top:12px; align-items:center}
.ur-bj-akse{display:contents}
.ur-bj-akse > span{grid-row:1; grid-column:1} .ur-bj-akse > div{grid-row:1; grid-column:2; position:relative; height:16px}
.ur-bj-akse i{position:absolute; transform:translateX(-50%); font-style:normal; font-size:11px; color:var(--dæmp2); font-variant-numeric:tabular-nums}
.ur-bj-akse i:first-child{transform:none} .ur-bj-akse i:last-child{transform:translateX(-100%)}
.ur-bj-r{display:contents}
.ur-bj-navn{grid-column:1; font-size:13.5px; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.ur-bj-r.dk .ur-bj-navn{color:var(--grøn)}
.ur-bj-spor{grid-column:2; position:relative; height:26px; border-radius:7px; background:linear-gradient(90deg, var(--flade3) 0 25%, transparent 25% 91.667%, var(--flade3) 91.667%), repeating-linear-gradient(90deg, transparent 0 calc(12.5% - 1px), var(--linje2) calc(12.5% - 1px) 12.5%), var(--flade2)}
.ur-bj-bar{position:absolute; left:0; top:4px; bottom:4px; border-radius:5px; background:var(--dæmp2)}
.ur-bj-r.foran .ur-bj-bar{background:linear-gradient(90deg, color-mix(in srgb, var(--grøn-m) 55%, transparent), var(--grøn-m))}
.ur-bj-r.bagud .ur-bj-bar{background:linear-gradient(90deg, color-mix(in srgb, #2F6FD0 55%, transparent), #2F6FD0)}
.ur-bj-r.dk .ur-bj-bar{background:linear-gradient(90deg, color-mix(in srgb, var(--grøn) 55%, transparent), var(--grøn))}
.ur-bj-tid{position:absolute; top:50%; transform:translateY(-50%); margin-left:7px; font-style:normal; font-size:12.5px; font-weight:650; white-space:nowrap; font-variant-numeric:tabular-nums}
.ur-bj-tid b{font-weight:650; color:var(--dæmp); margin-left:3px}
.ur-bj-tid small{color:var(--rav); font-size:11.5px; margin-left:3px}
.ur-bj-tid.inde{transform:translate(calc(-100% - 14px), -50%); color:#fff}
.ur-bj-tid.inde b,.ur-bj-tid.inde small{color:rgba(255,255,255,.88)}
.ur-bj-r.foran .ur-bj-tid b{color:var(--grøn)} .ur-bj-r.bagud .ur-bj-tid b{color:var(--blå)}
.ur-bj-r.foran .ur-bj-tid.inde b,.ur-bj-r.bagud .ur-bj-tid.inde b{color:#fff}
.ur-bj-dk{grid-column:2; position:relative; align-self:stretch; pointer-events:none; margin:-3px 0}
.ur-bj-dk::before{content:''; position:absolute; left:var(--dk); top:0; bottom:0; border-left:2px dashed var(--grøn); transform:translateX(-1px)}
/* teksten "Danmark 21:33" flyttes med stregen, men bliver inden for sporet: midt på stregen kl. 12, til højre for den om
   morgenen og til venstre om aftenen (forskydning = --dk af tekstens egen bredde) — ellers stak den ud over kanten om aftenen */
.ur-bj-dk span{position:absolute; left:var(--dk); bottom:-20px; transform:translateX(calc(-1 * var(--dk))); font-size:11.5px; font-weight:650; color:var(--grøn); white-space:nowrap; background:var(--bg); padding:0 4px; border-radius:4px}
.ur-bj-leg{margin-top:28px}
.ur-bj-leg i.foran{background:var(--grøn-m)} .ur-bj-leg i.bagud{background:#2F6FD0} .ur-bj-leg i.nat{background:var(--flade3); border:1px solid var(--linje)}
/* mødeplanlæggeren og døgnstrimlen */
.ur-møde-top{display:flex; flex-wrap:wrap; justify-content:space-between; align-items:flex-end; gap:8px 16px}
.ur-møde-top .under{flex:1 1 420px; margin:0}
.ur-møde-dato{display:flex; align-items:center; gap:8px; font-size:13.5px; color:var(--dæmp)}
.ur-møde-dato input{padding:6px 9px; border:1px solid var(--linje); border-radius:9px; background:var(--bg); color:var(--blæk); font:inherit}
.ur-møde-rul{overflow-x:auto; margin-top:10px; border:1px solid var(--linje); border-radius:12px; background:var(--flade); -webkit-overflow-scrolling:touch}
.ur-møde-tabel{border-collapse:separate; border-spacing:2px; min-width:100%; font-variant-numeric:tabular-nums}
.ur-møde-tabel th,.ur-møde-tabel td{padding:0 2px; text-align:center; font-size:12px; height:30px; min-width:30px; border-radius:5px; white-space:nowrap}
.ur-møde-tabel thead th{color:var(--dæmp); font-weight:650; cursor:pointer}
.ur-møde-tabel th[scope="row"]{position:sticky; left:0; z-index:1; background:var(--flade); text-align:left; padding:0 10px 0 8px; font-size:13px; white-space:nowrap; min-width:96px}
.ur-møde-tabel tr.dk th[scope="row"]{color:var(--grøn)}
.ur-møde-tabel td{cursor:pointer; font-weight:600}
.ur-møde-tabel td.arb{background:color-mix(in srgb, var(--grøn-m) 30%, var(--flade)); color:var(--blæk)}
.ur-møde-tabel td.vågen{background:var(--flade2); color:var(--blæk)}
.ur-møde-tabel td.nat{background:color-mix(in srgb, #24324A 82%, var(--flade)); color:#C9D3E6}
.ur-møde-tabel td small{font-size:11px; font-weight:500; opacity:.8}
.ur-møde-tabel td sup{font-size:11px; line-height:0; color:var(--rav); margin-left:1px}
.ur-møde-tabel td.nat sup{color:#F2C27A}
.ur-møde-tabel thead th.alle{background:var(--grøn); color:#fff}
.ur-møde-tabel thead th.ok{background:var(--grøn-b); color:var(--grøn)}
.ur-møde-tabel td.alle{box-shadow:inset 0 0 0 2px var(--grøn)}
.ur-møde-tabel .valgt{outline:2px solid var(--blæk); outline-offset:-1px}
.ur-møde-tabel td.nu{box-shadow:inset 0 0 0 2px var(--rav-m)}
.ur-strimmel td{cursor:default}
.ur-møde-res{margin:10px 0 0; font-size:14.5px}
/* tabeller, skift og links */
.ur-tabel td a{font-weight:600}
.ur-tabel tr.nu td{background:var(--grøn-b)}
.ur-perioder td.ur-årstid{white-space:normal; min-width:110px}
@media (max-width:600px){
  .ur-perioder{table-layout:fixed}
  .ur-perioder th,.ur-perioder td{white-space:normal; padding-left:8px; padding-right:8px}
  .ur-perioder th:nth-child(1){width:36%} .ur-perioder th:nth-child(2){width:28%}
  .ur-perioder td.ur-årstid{min-width:0}
}
.ur-links{display:grid; grid-template-columns:repeat(auto-fill, minmax(172px, 1fr)); gap:6px}
.ur-links a{display:flex; justify-content:space-between; align-items:center; gap:8px; padding:9px 12px; border:1px solid var(--linje); border-radius:10px; background:var(--flade); color:var(--blæk); text-decoration:none; font-size:14px}
.ur-links a:hover{border-color:var(--grøn); color:var(--grøn)}
.ur-links a span{color:var(--dæmp); font-variant-numeric:tabular-nums; font-size:13px}
/* dine ure: tom liste, knapper og skift mellem søjler og mødeplanlægger */
.ur-tom{grid-column:1 / -1; margin:0; padding:16px 18px; border:1px dashed var(--linje); border-radius:16px; color:var(--dæmp); font-size:14.5px; display:flex; align-items:center}
.ur-mine-knapper{display:flex; flex-wrap:wrap; justify-content:flex-start; align-items:center; gap:6px}
.ur-mine-knapper .husk-valg{font-size:.8125em; color:var(--dæmp); margin-left:auto}
@media (max-width:600px){ .ur-mine-knapper .husk-valg{margin:4px 0 0; flex-basis:100%} }
.ur-mine-knapper .knap:hover:not(:disabled){border-color:var(--grøn); color:var(--grøn)}
.ur-mine-knapper .knap:disabled{opacity:.45; cursor:default}
.ur-sml-hoved{display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:8px 16px; margin:26px 0 6px}
.ur-sml-hoved .ur-h3{margin:0}
.ur-vis > .under{margin:0}
.ur-vis[hidden]{display:none}
/* sommertid rundt om i verden: et år på en tidslinje */
.ur-st{margin-top:12px; border:1px solid var(--linje); border-radius:14px; background:var(--flade); padding:4px 16px}
.ur-st-akse,.ur-st-r{display:grid; grid-template-columns:minmax(150px, 230px) minmax(0,1fr) 150px; gap:6px 18px; align-items:center}
.ur-st-akse{padding:10px 0 6px}
.ur-st-akse > span{font-size:11.5px; font-weight:650; color:var(--dæmp)}
.ur-st-mdr{position:relative; height:16px}
.ur-st-mdr i{position:absolute; top:0; transform:translateX(-50%); font-style:normal; font-size:11.5px; color:var(--dæmp); line-height:16px}
.ur-st-r{padding:11px 0; border-top:1px solid var(--linje2)}
.ur-st-navn{min-width:0}
.ur-st-navn b{display:block; font-size:14.5px}
.ur-st-navn small{display:block; font-size:12.5px; color:var(--dæmp); line-height:1.35; margin-top:1px}
.ur-st{--ur-vinter:#DCE6F2}
html[data-tema="mork"] .ur-st{--ur-vinter:#2A3B50}
.ur-st-spor{position:relative; height:16px; border-radius:8px; background:var(--ur-vinter)}
.ur-st-spor s{position:absolute; top:0; bottom:0; width:2px; margin-left:-1px; background:var(--flade)}
.ur-st-spor i{position:absolute; top:0; bottom:0; border-radius:8px; background:linear-gradient(90deg, #F2B544, #E39A2B)}
.ur-st-nu{position:absolute; top:-5px; bottom:-5px; width:2px; margin-left:-1px; border-radius:2px; background:var(--blæk)}
.ur-st-næste{font-size:13.5px; line-height:1.35}
.ur-st-næste b{display:block; font-weight:650; font-variant-numeric:tabular-nums}
.ur-st-næste span{color:var(--dæmp); font-size:12.5px}
.ur-st-leg{--ur-vinter:#DCE6F2}
html[data-tema="mork"] .ur-st-leg{--ur-vinter:#2A3B50}
.ur-st-leg i.st{background:linear-gradient(90deg, #F2B544, #E39A2B)} .ur-st-leg i.vt{background:var(--ur-vinter)} .ur-st-leg i.nu{width:2px; height:12px; border-radius:1px; background:var(--blæk)}
.ur-st-note{margin:10px 0 0}
@media (max-width:640px){
  .ur-st{padding:2px 12px}
  .ur-st-akse{grid-template-columns:minmax(0,1fr)} .ur-st-akse > span{display:none}
  .ur-st-r{grid-template-columns:minmax(0,1fr) auto; grid-template-areas:"navn næste" "spor spor"; gap:8px 12px}
  .ur-st-navn{grid-area:navn} .ur-st-næste{grid-area:næste; text-align:right} .ur-st-spor{grid-area:spor}
}
/* "Hvad er klokken i …?" */
.ur-helt{display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:14px 24px; padding:20px 24px; border-radius:18px; color:#fff; margin:4px 0 14px;
  background:radial-gradient(120% 140% at 0% 0%, #0F7A55 0%, var(--grøn) 45%, #054F39 100%)}
html[data-tema="mork"] .ur-helt{background:radial-gradient(120% 140% at 0% 0%, #15805A 0%, #0B5A3D 55%, #08402D 100%)}
.ur-helt-hoved{display:flex; flex-direction:column; gap:4px; min-width:0}
.ur-helt-lbl{font-size:13px; text-transform:uppercase; letter-spacing:.07em; opacity:.85}
.ur-digital.stor .ur-hm{font-size:clamp(48px, 9vw, 76px)}
.ur-digital.stor .ur-s{font-size:clamp(20px, 3.4vw, 30px); color:rgba(255,255,255,.7)}
.ur-helt-dato{font-size:15px; opacity:.92; min-height:1.2em}
.ur-helt-dk{display:flex; flex-direction:column; align-items:flex-end; gap:2px; padding:12px 16px; border-radius:14px; background:rgba(255,255,255,.12)}
.ur-helt-dk span{font-size:12.5px; opacity:.85}
.ur-helt-dk b{font-size:28px; font-weight:750; font-variant-numeric:tabular-nums; letter-spacing:-.02em}
.ur-helt-dk .ur-diff{color:#fff; background:rgba(255,255,255,.18); padding:2px 9px; border-radius:99px; font-size:13px}
@media (max-width:560px){ .ur-helt{padding:16px 18px} .ur-helt-dk{align-items:flex-start} .ur-hm{font-size:34px} }

/* ---------------- Mødebooker ---------------- */
.mb{--ja:#17884A; --ja-på:#fff; --ja-b:#E3F5EA; --ja-t:#0E6B37; --mså:#E9A800; --mså-på:#3A2800; --mså-b:#FFF4D2; --mså-t:#6E4E00; --nej:#D23F48; --nej-på:#fff; --nej-b:#FCE8E9; --nej-t:#A3242C; --tom:#9BA6A0; --mb-guld:#F2B600; margin-bottom:46px}
html[data-tema="mork"] .mb{--ja:#3CC47A; --ja-på:#06210F; --ja-b:#16352A; --ja-t:#7FE0A9; --mså:#E3AE2A; --mså-på:#2A1D00; --mså-b:#382E14; --mså-t:#F4CF6E; --nej:#EF6B72; --nej-på:#2A0709; --nej-b:#3B1F22; --nej-t:#F6A0A5; --tom:#7D8A83}
.mb .mb-ik{flex:none}
.mb .knap .mb-ik{width:15px; height:15px}
.mb-fejl{color:var(--rød); font-size:13px; margin:6px 0 0}
.mb-fejl[hidden]{display:none}
.mb-tom{color:var(--dæmp); font-size:14.5px; margin:2px 0 12px}
.mb-besked{display:flex; align-items:flex-start; gap:10px; padding:11px 15px; border-radius:var(--r); margin:0 0 14px; font-size:14.5px; font-weight:550; background:var(--grøn-b); color:var(--grøn); border:1px solid color-mix(in srgb, var(--grøn) 30%, transparent); animation:mb-ind .35s ease-out}
.mb-besked .mb-ik{margin-top:3px}
.mb-besked.fejl{background:var(--rød-b); color:var(--rød); border-color:color-mix(in srgb, var(--rød) 30%, transparent)}
@keyframes mb-ind{from{opacity:0; transform:translateY(-4px)} to{opacity:1; transform:none}}
/* opret: om mødet øverst, kalenderen og tiderne side om side */
.mb-ny{display:grid; grid-template-columns:minmax(0,5fr) minmax(0,7fr); grid-template-areas:'om om' 'kal tider' 'opret opret'; gap:0 14px; align-items:stretch}
.mb-om{grid-area:om} .mb-kal-felt{grid-area:kal} .mb-tider-felt{grid-area:tider} .mb-opret{grid-area:opret}
/* kalenderen følger med ned, når der er mange datoer med tider ved siden af */
@media (min-width:861px){ .mb-kal{position:sticky; top:72px} }
.mb-ny fieldset{padding:14px 16px 12px; border-radius:12px}
.mb-ny legend{font-size:13.5px; color:var(--blæk); font-weight:650}
.mb-om-g{display:grid; grid-template-columns:minmax(0,3fr) minmax(0,2fr); gap:12px}
.mb .felt input,.mb .felt textarea{font-size:16px}   /* 16 px: iPhone zoomer ikke ind, når man trykker i feltet */
.mb .felt textarea{width:100%; padding:9px 11px; border:1px solid var(--linje); border-radius:var(--r); background:var(--flade); resize:vertical; min-height:62px; line-height:1.45}
.mb .felt textarea:focus{outline:none; border-color:var(--grøn); box-shadow:0 0 0 3px var(--grøn-b)}
.mb .felt label span{color:var(--dæmp2)}
.mb .felt input[aria-invalid="true"],.mb-tid-felt[aria-invalid="true"],.mb-navn-r input[aria-invalid="true"]{border-color:var(--rød); box-shadow:0 0 0 3px var(--rød-b)}
.mb-mere{margin:12px 0 0; border-top:1px solid var(--linje2); padding-top:6px}
.mb-mere > summary{cursor:pointer; font-size:14px; font-weight:600; color:var(--grøn); padding:6px 0; list-style:none; display:flex; align-items:center; gap:8px}
.mb-mere > summary::-webkit-details-marker{display:none}
.mb-mere > summary::before{content:''; width:7px; height:7px; border-right:2px solid currentColor; border-bottom:2px solid currentColor; transform:rotate(-45deg); transition:transform .2s; flex:none}
.mb-mere[open] > summary::before{transform:rotate(45deg)}
.mb-mere > summary em{font-style:normal; color:var(--dæmp); font-weight:500}
.mb-mere-g{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:12px; padding:8px 0 2px}
.mb-besk-felt,.mb-fl{grid-column:1 / -1}
.mb-fl{margin:0}
/* månedskalenderen */
.mb-kal{max-width:420px; margin:0 auto}
.mb-kal-top{display:flex; align-items:center; justify-content:space-between; gap:8px; margin:2px 0 10px}
.mb-kal-top b{font-size:16.5px; font-weight:680}
.mb-kal-pil{width:38px; height:38px; border-radius:50%; border:1px solid var(--linje); background:var(--flade); color:var(--blæk); display:grid; place-items:center; cursor:pointer; padding:0; transition:border-color .15s, color .15s, background .15s}
.mb-kal-pil:hover:not(:disabled){border-color:var(--grøn); color:var(--grøn); background:var(--grøn-b)}
.mb-kal-pil:disabled{opacity:.35; cursor:default}
.mb-kal-g{display:grid; grid-template-columns:28px repeat(7, minmax(0,1fr)); gap:4px}
.mb-kal-h{font-size:11.5px; color:var(--dæmp); text-align:center; font-weight:650; padding:0 0 2px}
.mb-kal-h.we{color:var(--dæmp2)}
.mb-un{font-size:11px; color:var(--grøn); font-weight:650; text-align:center; align-self:center; font-variant-numeric:tabular-nums}
.mb-d{position:relative; height:42px; padding:0; border-radius:10px; border:1px solid transparent; background:var(--flade2); color:var(--blæk); font-size:15px; font-weight:560; cursor:pointer; font-variant-numeric:tabular-nums; transition:background .15s, border-color .15s, color .15s, transform .1s}
.mb-d.we{background:var(--flade3)}
.mb-d.hd{color:var(--rød)}
.mb-d.nu{border-color:var(--grøn); box-shadow:inset 0 0 0 1px var(--grøn)}
.mb-d:hover:not(:disabled){border-color:var(--grøn-m)}
.mb-d:active:not(:disabled){transform:scale(.94)}
.mb-d[aria-pressed="true"]{background:var(--grøn); border-color:var(--grøn); color:var(--på-grøn); font-weight:700}
.mb-d[aria-pressed="true"].nu{box-shadow:inset 0 0 0 2px var(--flade)}
.mb-d:disabled{background:none; color:var(--dæmp2); opacity:.6; cursor:default}
.mb-d i{position:absolute; top:-5px; right:-5px; min-width:17px; height:17px; padding:0 4px; border-radius:99px; background:var(--mb-guld); color:#3D2B00; font-style:normal; font-size:11px; font-weight:800; line-height:17px; box-shadow:0 0 0 2px var(--flade)}
.mb-kal-forkl{display:flex; flex-wrap:wrap; justify-content:center; gap:4px 16px; font-size:12px; color:var(--dæmp); margin:12px 0 2px}
.mb-kal-forkl i{display:inline-block; width:12px; height:12px; border-radius:3px; margin-right:6px; vertical-align:-2px; font-style:normal}
.mb-kal-forkl .f-valgt{background:var(--grøn)}
.mb-kal-forkl .f-nu{box-shadow:inset 0 0 0 2px var(--grøn)}
.mb-kal-forkl .f-hd{width:auto; height:auto; color:var(--rød); font-weight:700; font-size:12px; vertical-align:0; margin-right:5px}
/* tiderne på hver dato */
.mb-fortryd{display:flex; align-items:center; gap:8px; flex-wrap:wrap; font-size:13.5px; color:var(--dæmp); background:var(--flade2); border-radius:var(--r); padding:7px 11px; margin:0 0 10px}
.mb-alle{background:var(--grøn-b); border-radius:10px; padding:10px 12px 11px; margin:0 0 12px}
.mb-alle label{display:block; font-size:13px; font-weight:650; color:var(--grøn); margin:0 0 6px}
.mb-dag{border:1px solid var(--linje); border-radius:11px; padding:9px 10px 10px 13px; margin:0 0 9px; background:var(--flade)}
.mb-dag.ny{animation:mb-ny 1.2s ease-out}
@keyframes mb-ny{0%,30%{box-shadow:0 0 0 3px var(--grøn-l); border-color:var(--grøn)} 100%{box-shadow:0 0 0 3px transparent}}
.mb-dag-h{display:flex; align-items:center; gap:4px 9px; flex-wrap:wrap; margin:0 0 7px}
.mb-dag-h b{font-size:15px; font-weight:650}
.mb-uge{font-size:12px; color:var(--grøn); font-weight:650}
.mb-hd{font-size:12px; color:var(--rød); font-weight:600}
.mb-x{margin-left:auto; flex:none; width:32px; height:32px; padding:0; border-radius:50%; border:none; background:none; color:var(--dæmp); display:grid; place-items:center; cursor:pointer}
.mb-x:hover{background:var(--rød-b); color:var(--rød)}
.mb-chips{display:flex; flex-wrap:wrap; gap:6px; margin:0 0 8px}
.mb-chip{display:inline-flex; align-items:center; gap:1px; padding:2px 2px 2px 11px; border-radius:99px; background:var(--grøn-b); color:var(--grøn); font-weight:680; font-size:14px; font-variant-numeric:tabular-nums; line-height:1.6}
.mb-chip button{width:26px; height:26px; padding:0; border:none; background:none; border-radius:50%; color:inherit; display:grid; place-items:center; cursor:pointer; opacity:.75}
.mb-chip button:hover{opacity:1; background:color-mix(in srgb, currentColor 14%, transparent)}
.mb-chip button .mb-ik{width:13px; height:13px}
.mb-chip.hel{background:var(--flade2); color:var(--dæmp); font-weight:600}
.mb-chip.tom{padding:2px 11px}
.mb-tid-ny{display:flex; gap:8px}
.mb-tid-felt{flex:1; min-width:0; padding:7px 11px; border:1px solid var(--linje); border-radius:var(--r); background:var(--flade); min-height:38px; font-size:16px}
.mb-tid-felt:focus{outline:none; border-color:var(--grøn); box-shadow:0 0 0 3px var(--grøn-b)}
.mb-tid-ny .knap{flex:none}
.mb-hjaelp{font-size:12.5px; color:var(--dæmp); margin:10px 0 0}
.mb-hjaelp b{color:var(--blæk); font-weight:650}
.mb-opret{display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:10px 16px; padding:14px 16px; border-radius:12px; background:var(--flade); border:1px solid var(--linje)}
.mb-opsum{margin:0; font-size:14.5px; color:var(--dæmp)}
.mb-opsum b{color:var(--blæk)}
.mb-opret-k{display:flex; flex-wrap:wrap; gap:8px; margin-left:auto}
.mb-opret .mb-fejl{flex-basis:100%; margin:0; text-align:right}
/* mødet: overskrift og deling */
.mb-hoved{position:relative; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,440px); gap:16px 26px; align-items:start; background:var(--flade); border:1px solid var(--linje); border-radius:14px; padding:18px 20px 18px 24px; margin:0 0 16px; overflow:hidden}
.mb-hoved::before{content:''; position:absolute; left:0; top:0; bottom:0; width:5px; background:linear-gradient(180deg,#2E2475,#5747C2 55%,#8C7CF0)}
.mb-af{font-size:12px; text-transform:uppercase; letter-spacing:.07em; color:var(--dæmp); font-weight:680; margin:0 0 4px}
.mb-titel{font-size:clamp(21px, 2.6vw, 26px); margin:0 0 9px; overflow-wrap:anywhere}
.mb-fakta{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:5px; font-size:14px; color:var(--dæmp)}
.mb-fakta li{display:flex; align-items:center; gap:8px; min-width:0}
.mb-fakta li span{min-width:0; overflow-wrap:anywhere}
.mb-besk{margin:12px 0 0; white-space:pre-line; font-size:14.5px; overflow-wrap:anywhere}
.mb-link-r{display:flex; gap:8px}
.mb-link-felt{flex:1; min-width:0; padding:8px 11px; border:1px solid var(--linje); border-radius:var(--r); background:var(--flade2); color:var(--dæmp); font-size:16px; font-family:var(--mono); min-height:40px}
.mb-link-felt:focus{outline:none; border-color:var(--grøn); color:var(--blæk)}
.mb-link-r .knap{flex:none; font-weight:650}
.mb .knap.mb-ok{background:var(--ja); border-color:var(--ja); color:var(--ja-på)}
.mb-del-k{display:flex; flex-wrap:wrap; gap:6px; margin-top:8px}
.mb-status{min-height:1.3em; font-size:13px; color:var(--grøn); margin:7px 0 0; font-weight:650}
.mb-status:empty{margin:0; min-height:0}
.mb-del-note{font-size:13px; color:var(--dæmp); margin:7px 0 0; line-height:1.5}
/* det valgte tidspunkt */
.mb-fast{display:flex; align-items:center; gap:12px 16px; flex-wrap:wrap; padding:14px 18px; border-radius:14px; background:linear-gradient(135deg,#0B6B4C,#12936A); color:#fff; margin:0 0 16px; box-shadow:0 14px 30px -20px rgba(8,80,55,.7)}
.mb-fast-ikon{width:42px; height:42px; border-radius:50%; background:rgba(255,255,255,.2); display:grid; place-items:center; flex:none}
.mb-fast-ikon .mb-ik{width:22px; height:22px; stroke-width:2.6}
.mb-fast-t{min-width:0; flex:1 1 260px}
.mb-fast-t span{display:block; font-size:12px; text-transform:uppercase; letter-spacing:.07em; opacity:.88; font-weight:650}
.mb-fast-t b{display:block; font-size:19px; line-height:1.3}
.mb-fast-t em{display:block; font-style:normal; font-size:13.5px; opacity:.9; overflow-wrap:anywhere}
.mb-fast-k{display:flex; flex-wrap:wrap; align-items:center; gap:6px}
.mb-fast .knap{background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.45); color:#fff}
.mb-fast .knap:hover{background:rgba(255,255,255,.26); color:#fff; border-color:#fff}
.mb-fast .link-knap{color:#fff; font-size:13px; margin-left:4px}
/* sektionerne: dine svar og oversigten */
.mb-sek{background:var(--flade); border:1px solid var(--linje); border-radius:14px; padding:16px 18px 18px; margin:0 0 16px}
.mb-sek-h{display:flex; flex-wrap:wrap; align-items:baseline; justify-content:space-between; gap:2px 14px; margin:0 0 12px}
.mb-sek-h h3{font-size:18px}
.mb-sek-h p{margin:0; font-size:14px; color:var(--dæmp)}
.mb-navn-r{display:flex; gap:8px; max-width:560px}
.mb-navn-r input{flex:1; min-width:0; padding:10px 13px; font-size:16px; border:1px solid var(--linje); border-radius:var(--r); background:var(--flade); min-height:46px}
.mb-navn-r input:focus{outline:none; border-color:var(--grøn); box-shadow:0 0 0 3px var(--grøn-b)}
.mb-navn-r .knap{flex:none; font-weight:650; padding:8px 16px}
.mb-kendte{display:flex; flex-wrap:wrap; align-items:center; gap:6px; margin:12px 0 0; font-size:13.5px; color:var(--dæmp)}
.mb-kendte > span{margin-right:2px}
.mb-navn-chip{border:1px solid var(--linje); background:var(--flade); color:var(--blæk); border-radius:99px; padding:4px 13px; cursor:pointer; font-size:14px}
.mb-navn-chip:hover{border-color:var(--grøn); color:var(--grøn)}
.mb-hurtig{display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin:0 0 14px}
.mb-besvaret{font-size:13px; color:var(--dæmp); margin-left:auto}
.mb-slots{display:grid; gap:16px}
.mb-sdag h4{font-size:14.5px; font-weight:650; margin:0 0 8px; display:flex; flex-wrap:wrap; gap:4px 8px; align-items:baseline}
.mb-sdag h4 span{font-size:12px; color:var(--grøn); font-weight:650}
.mb-sdag-l{display:grid; grid-template-columns:repeat(auto-fill, minmax(min(100%, 268px), 1fr)); gap:8px}
.mb-slot{display:flex; flex-direction:column; gap:7px; padding:9px 10px 10px 12px; border:1.5px solid var(--linje); border-radius:12px; background:var(--flade); transition:border-color .15s, background .15s}
.mb-slot.v1{border-color:var(--ja); background:var(--ja-b)}
.mb-slot.v2{border-color:var(--mså); background:var(--mså-b)}
.mb-slot.v3{border-color:var(--nej); background:var(--nej-b)}
.mb-slot.forbi{opacity:.6}
.mb-slot-t{display:flex; align-items:baseline; justify-content:space-between; gap:2px 10px; flex-wrap:wrap; min-width:0}
.mb-slot-t b{font-size:16.5px; font-weight:720; font-variant-numeric:tabular-nums; line-height:1.3; white-space:nowrap}
.mb-slot-sum{display:flex; gap:9px; font-size:12.5px; font-weight:680; font-variant-numeric:tabular-nums}
.mb-slot-sum > span{white-space:nowrap}
.mb-slot-sum .t1{color:var(--ja-t)} .mb-slot-sum .t2{color:var(--mså-t)} .mb-slot-sum .t3{color:var(--nej-t)}
.mb-slot-af{font-size:12.5px; color:var(--dæmp); margin-top:-4px}
.mb-slot-af .link-knap{font-size:12.5px}
.mb-valg{display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:6px}
.mb-v{display:inline-flex; align-items:center; justify-content:center; gap:5px; height:42px; padding:0 6px; min-width:0; white-space:nowrap; border-radius:9px; border:1.5px solid var(--linje); background:var(--flade); color:var(--dæmp); font-size:13px; font-weight:650; cursor:pointer; transition:background .15s, border-color .15s, color .15s, transform .1s}
.mb-v i{font-style:normal; font-size:17px; font-weight:800; line-height:1}
.mb-v.v1 i{color:var(--ja)} .mb-v.v2 i{color:var(--mså)} .mb-v.v3 i{color:var(--nej)}
.mb-v.v1:hover{border-color:var(--ja)} .mb-v.v2:hover{border-color:var(--mså)} .mb-v.v3:hover{border-color:var(--nej)}
.mb-v:active{transform:scale(.95)}
.mb-v.v1[aria-pressed="true"]{background:var(--ja); border-color:var(--ja); color:var(--ja-på)}
.mb-v.v2[aria-pressed="true"]{background:var(--mså); border-color:var(--mså); color:var(--mså-på)}
.mb-v.v3[aria-pressed="true"]{background:var(--nej); border-color:var(--nej); color:var(--nej-på)}
.mb-v[aria-pressed="true"] i{color:inherit}
.mb-komm{margin:16px 0 0; max-width:560px}
.mb-forslag{margin:14px 0 0; border-top:1px solid var(--linje2); padding-top:6px}
.mb-forslag > summary,.mb-saml > summary{cursor:pointer; font-size:14px; font-weight:600; color:var(--grøn); padding:6px 0; list-style:none; display:flex; align-items:center; gap:8px}
.mb-forslag > summary::-webkit-details-marker,.mb-saml > summary::-webkit-details-marker{display:none}
.mb-forslag > summary::before,.mb-saml > summary::before{content:''; width:7px; height:7px; border-right:2px solid currentColor; border-bottom:2px solid currentColor; transform:rotate(-45deg); transition:transform .2s; flex:none}
.mb-forslag[open] > summary::before,.mb-saml[open] > summary::before{transform:rotate(45deg)}
.mb-forslag-g{display:flex; flex-wrap:wrap; align-items:flex-end; gap:10px; padding:6px 0 2px}
.mb-forslag-g .felt{flex:1 1 170px; max-width:240px}
.mb-forslag-g .knap{min-height:40px}
.mb-send{display:flex; flex-wrap:wrap; align-items:center; gap:12px 18px; margin:16px 0 0; padding:14px 16px; border-radius:12px; background:var(--blå-b); border:1px solid #C7D7F2}
html[data-tema="mork"] .mb-send{border-color:#2B3F66}
.mb-send > div:first-child{flex:1 1 300px; min-width:0}
.mb-send b{display:block; font-size:15.5px; color:var(--blå)}
.mb-send p{margin:2px 0 0; font-size:13.5px; color:var(--dæmp)}
.mb-send-k{display:flex; flex-wrap:wrap; gap:6px}
/* oversigten: bedste tid og farvematrixen */
.mb-bedst{display:flex; align-items:center; flex-wrap:wrap; gap:10px 14px; padding:12px 14px; border-radius:12px; background:linear-gradient(135deg,#FFF7DA,#FFE9A6); color:#4A3700; margin:0 0 12px}
html[data-tema="mork"] .mb-bedst{background:linear-gradient(135deg,#3A3015,#463815); color:#F6D98A}
.mb-krone{width:36px; height:36px; border-radius:50%; background:var(--mb-guld); color:#fff; display:grid; place-items:center; flex:none; box-shadow:0 4px 10px -4px rgba(150,100,0,.6)}
.mb-bedst-t{flex:1 1 240px; min-width:0}
.mb-bedst-t b{display:block; font-size:15.5px; line-height:1.35}
.mb-bedst-t span{font-size:13px; opacity:.9}
.mb-bedst .knap{flex:none}
.mb-bedst-k{display:flex; flex-wrap:wrap; gap:6px; flex-basis:100%}
.mb-bedst-k .knap{background:rgba(255,255,255,.65); border-color:rgba(120,90,0,.3); color:#4A3700}
.mb-bedst-k .knap:hover{background:#fff; border-color:#4A3700; color:#4A3700}
html[data-tema="mork"] .mb-bedst-k .knap{background:rgba(0,0,0,.2); border-color:rgba(246,217,138,.4); color:#F6D98A}
html[data-tema="mork"] .mb-bedst-k .knap:hover{background:rgba(0,0,0,.38); border-color:#F6D98A; color:#FFE7A8}
.mb-matrix-boks{margin:0 0 6px; max-height:none}
.mb-matrix{border-collapse:separate; border-spacing:0; width:max-content; min-width:100%; font-variant-numeric:tabular-nums}
.mb-matrix th,.mb-matrix td{padding:0; border-bottom:2px solid var(--flade)}
.mb-matrix thead th{background:var(--flade2); font-size:12.5px; color:var(--dæmp); text-align:center; padding:7px 6px; white-space:nowrap; font-weight:650; border-bottom:1px solid var(--linje)}
.mb-matrix thead th small{display:block; font-size:11px; font-weight:500; color:var(--dæmp2)}
.mb-matrix .mb-dh{color:var(--blæk); border-left:2px solid var(--flade)}
.mb-matrix .mb-th{min-width:62px; border-left:2px solid var(--flade); position:relative}
.mb-matrix .mb-th.bedst{background:#FFEDB3; color:#5B4300}
html[data-tema="mork"] .mb-matrix .mb-th.bedst{background:#4A3B12; color:#F6D98A}
.mb-matrix .mb-th.valgt{background:var(--grøn); color:var(--på-grøn)}
.mb-matrix .mb-th.valgt small{color:inherit; opacity:.85}
.mb-th-stj{display:block; color:#C48F00; line-height:0; margin:-2px 0 2px}
.mb-th-stj .mb-ik{width:14px; height:14px}
.mb-matrix tbody th,.mb-matrix tfoot th,.mb-matrix thead th.mb-hj{position:sticky; left:0; z-index:2; background:var(--flade); text-align:left; padding:6px 30px 6px 12px; font-size:14px; font-weight:650; color:var(--blæk); min-width:130px; max-width:200px; white-space:normal; border-right:1px solid var(--linje); overflow-wrap:anywhere}
.mb-matrix thead th.mb-hj{background:var(--flade2); z-index:3; font-size:12.5px; color:var(--dæmp)}
.mb-matrix tbody th small{display:block; font-size:11.5px; font-weight:500; color:var(--dæmp)}
.mb-matrix tbody tr.mig th{background:var(--grøn-b)}
.mb-matrix tbody tr.mangler th{color:var(--dæmp); font-weight:550}
.mb-matrix tbody tr.mangler th small{color:var(--rød)}
.mb-fjern-d{position:absolute; right:4px; top:50%; transform:translateY(-50%); width:24px; height:24px; padding:0; border-radius:50%; border:none; background:none; color:var(--dæmp2); display:grid; place-items:center; cursor:pointer; opacity:0; transition:opacity .15s}
.mb-fjern-d .mb-ik{width:13px; height:13px}
.mb-matrix tr:hover .mb-fjern-d,.mb-fjern-d:focus-visible{opacity:1}
.mb-fjern-d:hover{background:var(--rød-b); color:var(--rød)}
@media (hover:none){ .mb-fjern-d{opacity:.7} }
.mb-c{height:42px; min-width:62px; text-align:center; font-size:17px; font-weight:800; border-left:2px solid var(--flade); transition:filter .15s}
.mb-c.v1{background:var(--ja); color:var(--ja-på)}
.mb-c.v2{background:var(--mså); color:var(--mså-på)}
.mb-c.v3{background:var(--nej); color:var(--nej-på)}
.mb-c.v0{background:var(--flade2); color:var(--tom); font-weight:600}
.mb-c.bedst{box-shadow:inset 3px 0 0 var(--mb-guld), inset -3px 0 0 var(--mb-guld)}
.mb-c.valgt{box-shadow:inset 3px 0 0 var(--grøn), inset -3px 0 0 var(--grøn)}
.mb-c button{display:block; width:100%; height:100%; min-height:42px; padding:0; margin:0; border:0; background:none; color:inherit; font:inherit; cursor:pointer}
.mb-c button:hover{background:rgba(255,255,255,.18)}
.mb-c button:focus-visible{outline:2px solid var(--blæk); outline-offset:-4px; border-radius:4px}
tr.mig .mb-c.v0{background:var(--flade); box-shadow:inset 0 0 0 1.5px var(--linje)}
tr.mig .mb-c.v0.bedst{box-shadow:inset 0 0 0 1.5px var(--linje), inset 3px 0 0 var(--mb-guld), inset -3px 0 0 var(--mb-guld)}
tr.mig .mb-c.v0.valgt{box-shadow:inset 0 0 0 1.5px var(--linje), inset 3px 0 0 var(--grøn), inset -3px 0 0 var(--grøn)}
.mb-ingen{padding:16px 12px !important; color:var(--dæmp); font-size:14px}
.mb-matrix tfoot td{text-align:center; padding:6px 4px; font-size:12px; background:var(--flade2); color:var(--dæmp); border-left:2px solid var(--flade); white-space:nowrap}
.mb-matrix tfoot th{background:var(--flade2); font-size:12.5px; color:var(--dæmp)}
.mb-matrix tfoot b{display:block; font-size:17px; color:var(--ja-t); line-height:1.2}
.mb-matrix tfoot td.bedst{background:#FFEDB3; color:#5B4300}
html[data-tema="mork"] .mb-matrix tfoot td.bedst{background:#4A3B12; color:#F6D98A}
.mb-vaelg-r td{background:var(--flade) !important; padding:6px 4px 4px !important}
.mb-vaelg-k{width:34px; height:30px; padding:0; border-radius:8px; border:1.5px solid var(--linje); background:var(--flade); color:var(--dæmp2); display:inline-grid; place-items:center; cursor:pointer}
.mb-vaelg-k:hover{border-color:var(--grøn); color:var(--grøn)}
.mb-vaelg-k[aria-pressed="true"]{background:var(--grøn); border-color:var(--grøn); color:var(--på-grøn)}
.mb-forkl{display:flex; flex-wrap:wrap; align-items:center; gap:6px 16px; font-size:12.5px; color:var(--dæmp); margin:8px 0 10px}
.mb-forkl i{display:inline-grid; place-items:center; width:20px; height:20px; border-radius:5px; font-style:normal; font-weight:800; font-size:12px; margin-right:6px; vertical-align:-5px}
.mb-forkl i.v1{background:var(--ja); color:var(--ja-på)} .mb-forkl i.v2{background:var(--mså); color:var(--mså-på)} .mb-forkl i.v3{background:var(--nej); color:var(--nej-på)} .mb-forkl i.v0{background:var(--flade2); color:var(--tom)}
.mb-forkl i.stj{background:none; color:#C48F00}
.mb-forkl-tip{margin-left:auto; color:var(--dæmp2)}
.mb-mangler{font-size:14px; border-top:1px solid var(--linje2); padding-top:10px}
.mb-mangler p{margin:0 0 6px}
.mb-komm-l{margin:12px 0 0; border-top:1px solid var(--linje2); padding-top:10px}
.mb-komm-l h4{font-size:14px; margin:0 0 6px}
.mb-komm-l ul{margin:0; padding:0 0 0 18px; font-size:14px}
.mb-komm-l li{margin:0 0 3px}
.mb-saml{background:var(--flade); border:1px solid var(--linje); border-radius:14px; padding:6px 18px; margin:0 0 16px}
.mb-saml-k{padding:0 0 12px}
.mb-saml-k p{font-size:14px; color:var(--dæmp); margin:2px 0 8px}
.mb-saml textarea{width:100%; padding:9px 11px; border:1px solid var(--linje); border-radius:var(--r); background:var(--flade); font-size:16px; font-family:var(--mono); resize:vertical}
.mb-saml textarea:focus{outline:none; border-color:var(--grøn); box-shadow:0 0 0 3px var(--grøn-b)}
.mb-saml-r{display:flex; flex-wrap:wrap; align-items:center; gap:8px 12px; margin-top:8px; font-size:13.5px; color:var(--dæmp)}
/* dine møder: øverst i opret-visningen, nederst i mødet */
.mb-ny-h{font-size:19px; margin:0 0 12px}
.mb-liste-bund .mb-mine{margin:26px 0 0}
.mb-liste-top .mb-mine{margin:0 0 30px}
.mb-mine-top{display:flex; flex-wrap:wrap; align-items:baseline; justify-content:space-between; gap:2px 16px; margin:0 0 10px}
.mb-mine h2{font-size:19px; margin:0}
.mb-mine h2 span{color:var(--dæmp); font-weight:500}
.mb-mine-top p{margin:0; font-size:14px; color:var(--dæmp)}
.mb-mine-l{list-style:none; margin:0 0 8px; padding:0; display:grid; grid-template-columns:repeat(auto-fill, minmax(min(100%, 340px), 1fr)); gap:10px}
.mb-mit{display:flex; flex-direction:column; gap:3px; border:1px solid var(--linje); border-radius:12px; background:var(--flade); padding:12px 14px; transition:border-color .15s, box-shadow .15s}
.mb-mit:hover{border-color:var(--grøn-m)}
.mb-mit.aktiv{border-color:var(--grøn); box-shadow:0 0 0 2px var(--grøn-b)}
.mb-mit.forbi{background:var(--flade2)}
.mb-mit-t{display:flex; align-items:flex-start; justify-content:space-between; gap:8px}
.mb-mit-t a{font-weight:680; font-size:15.5px; color:var(--blæk); overflow-wrap:anywhere; line-height:1.35}
.mb-mit-t a:hover{color:var(--grøn)}
.mb-rolle{flex:none; font-size:11.5px; font-weight:650; padding:2px 9px; border-radius:99px; background:var(--blå-b); color:var(--blå); white-space:nowrap; line-height:1.6}
.mb-rolle.ejer{background:#ECE8FF; color:#4334A8}
html[data-tema="mork"] .mb-rolle.ejer{background:#2B2656; color:#CFC7FF}
.mb-mit-i{margin:0; font-size:13px; color:var(--dæmp)}
.mb-mit-fast{margin:0; font-size:13px; color:var(--grøn); font-weight:650; display:flex; align-items:center; gap:5px}
.mb-mit-fast .mb-ik{width:14px; height:14px}
.mb-mit-forbi{margin:0; font-size:12.5px; color:var(--dæmp)}
.mb-mit-k{display:flex; flex-wrap:wrap; gap:6px; margin-top:8px}
.mb-mit-k .mb-fjern{margin-left:auto; color:var(--dæmp)}
.mb-mit-k .mb-fjern:hover{border-color:var(--rød); color:var(--rød)}
.mb-mine .husk-note{margin:4px 0 0}
/* tekster under værktøjet */
.mb-trin-l{list-style:none; counter-reset:trin; padding:0; margin:14px 0 0; display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:12px}
.mb-trin-l li{counter-increment:trin; background:var(--flade); border:1px solid var(--linje); border-radius:12px; padding:15px 16px}
.mb-trin-l li::before{content:counter(trin); display:grid; place-items:center; width:30px; height:30px; border-radius:50%; background:var(--grøn); color:var(--på-grøn); font-weight:750; font-size:14.5px; margin-bottom:9px}
.mb-trin-l h3{font-size:15.5px; margin:0 0 5px}
.mb-trin-l p{font-size:14px; color:var(--dæmp); margin:0}
.mb-tekst > p{max-width:none}
.mb-raad{margin:10px 0 0; padding:0 0 0 20px}
.mb-raad li{margin:0 0 7px}
@media (max-width:1000px){ .mb-trin-l{grid-template-columns:repeat(2, minmax(0,1fr))} }
@media (max-width:860px){
  .mb-ny{grid-template-columns:minmax(0,1fr); grid-template-areas:'om' 'kal' 'tider' 'opret'}
  .mb-hoved{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:560px){
  .mb-om-g,.mb-mere-g{grid-template-columns:minmax(0,1fr)}
  .mb-ny fieldset{padding:12px 12px 10px}
  .mb-hoved{padding:16px 14px 16px 18px}
  .mb-sek{padding:14px 12px 16px}
  .mb-link-r{flex-direction:column}
  .mb-link-r .knap{justify-content:center; min-height:44px}
  .mb-opret-k,.mb-opret-k .knap{width:100%; justify-content:center}
  .mb-opret .mb-fejl{text-align:left}
  .mb-trin-l{grid-template-columns:minmax(0,1fr)}
  .mb-forkl-tip{margin-left:0; flex-basis:100%}
  .mb-besvaret{margin-left:0; flex-basis:100%}
  .mb-matrix tbody th,.mb-matrix tfoot th,.mb-matrix thead th.mb-hj{min-width:104px; max-width:130px; padding-left:10px; font-size:13.5px}
  .mb-c,.mb-matrix .mb-th{min-width:54px}
  .mb-d{height:40px; font-size:14.5px}
}
@media print{ .mb-del,.mb-saml,.mb-mine,.mb-forslag,.mb-hurtig,.mb-vaelg-r,.mb-fjern-d{display:none !important} }

/* Kalenderens topbjælke: 12/6 mdr., året med pilene og Print har præcis samme højde (står sidst, så det gælder over
   de ældre regler for polstring ved de forskellige skærmbredder) */
.plan-styr{--styr-h:28px}
.plan-styr .skift,.plan-styr .år-ctrl,.plan-styr .knap{height:var(--styr-h); box-sizing:border-box}
.plan-styr .skift{align-items:stretch}
.plan-styr .skift button,.plan-styr .år-ctrl a,.plan-styr .år-ctrl button,.plan-styr .år-ctrl .v{height:100%; padding-top:0; padding-bottom:0; display:inline-flex; align-items:center; justify-content:center}
.plan-styr .år-ctrl .v{font-size:13.5px}
.plan-styr .knap{padding-top:0; padding-bottom:0}
@media (max-width:600px){ .plan-styr .år-ctrl .v{font-size:12.5px; padding:0 9px; min-width:0} }
@media (pointer:coarse){ .plan-styr{--styr-h:36px} }

/* "Arbejdsdage pr. måned": hele søjlens felt kan holdes over (eller trykkes på) og lyser svagt op, mens hoverboksen vises */
.graf .sø-felt{fill:transparent; cursor:default}
.graf .sø-felt:hover,.graf .sø-felt.aktiv{fill:color-mix(in srgb, var(--grøn) 10%, transparent)}
.graf svg.sø-tip *:not(.sø-felt){pointer-events:none}

/* =============================================================
   Forsiden: "Prøv vores mange værktøjer" — tekst til venstre og en hylde med de fremhævede værktøjer i små udgaver.
   Hylden vælger selv antallet af spalter ud fra sin egen bredde (container queries), så en lille brik aldrig bliver
   smallere end ca. 136px, og brikkerne altid brydes på ny linje i stedet for at løbe ud over kanten:
   5 spalter fra 712px, 4 fra 568px, 3 fra 424px og ellers 2. Feltet "+N" fylder resten af den sidste række.
   ============================================================= */
.vv-kort{display:grid; grid-template-columns:minmax(240px, 1fr) minmax(0, 2fr); gap:18px 30px; align-items:center; padding:20px 22px;
  border:1px solid var(--linje); border-radius:14px; background:var(--flade)}
.vv h2{margin:0 0 6px}
.vv-tekst p{color:var(--dæmp); font-size:14.5px; margin:0 0 14px; max-width:46ch}
.vv-cta{display:inline-flex; align-items:center; padding:8px 16px; border-radius:999px; background:var(--grøn); color:var(--på-grøn); font-weight:650; font-size:14.5px; line-height:1.3; transition:background .2s, transform .2s}
.vv-cta:hover{background:var(--grøn-hover); color:var(--på-grøn); text-decoration:none; transform:translateY(-1px)}
.vv-hylde-r{container:vvh / inline-size; min-width:0}
.vv-hylde{list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); grid-auto-rows:66px; gap:8px}
.vv-hylde > li{min-width:0}
.vv-hylde > .vv-li-flere{grid-column:1 / -1; container:vvf / inline-size}
@container vvh (min-width:424px){
  .vv-hylde{grid-template-columns:repeat(3, minmax(0, 1fr))}
  .vv-hylde > .vv-li-flere{grid-column:auto}
}
@container vvh (min-width:568px){
  .vv-hylde{grid-template-columns:repeat(4, minmax(0, 1fr))}
  .vv-hylde > .vv-li-flere{grid-column:1 / -1}
}
@container vvh (min-width:712px){
  .vv-hylde{grid-template-columns:repeat(5, minmax(0, 1fr))}
  .vv-hylde > .vv-li-flere{grid-column:span 2}
}
/* den lille brik: samme farveforløb som på Værktøjer, navnet øverst til venstre og tegningen til højre.
   Når musen kommer ind over den, løfter brikken sig, og tegningen laver sin egen lille bevægelse */
.vv-mini{position:relative; display:block; height:100%; overflow:hidden; border-radius:10px; color:#fff; isolation:isolate;
  box-shadow:0 6px 14px -10px rgba(20,40,90,.55); transition:transform .28s cubic-bezier(.2,.9,.3,1.25), box-shadow .28s}
.vv-mini .vv-navn{position:absolute; left:10px; top:8px; z-index:2; max-width:62%; font-size:12.5px; font-weight:700; line-height:1.18; text-shadow:0 1px 2px rgba(0,0,0,.18)}
.vv-mini:hover,.vv-mini:focus-visible{transform:translateY(-3px); box-shadow:0 14px 24px -14px rgba(20,40,90,.75); text-decoration:none; color:#fff}
.vv-mini:focus-visible{outline:2px solid var(--grøn); outline-offset:2px}
.vv-mini .vt-ill{transition:scale .45s cubic-bezier(.2,.9,.3,1.3), rotate .45s cubic-bezier(.2,.9,.3,1.3), translate .45s cubic-bezier(.2,.9,.3,1.3)}
.vv-mini .vt-sol{right:12px; bottom:-15px; width:40px; height:40px; box-shadow:0 0 0 7px rgba(255,170,90,.32), 0 0 0 14px rgba(255,170,90,.16);
  transition:translate 1.1s cubic-bezier(.22,.8,.3,1), scale 1.1s cubic-bezier(.22,.8,.3,1), background-color 1.5s ease, box-shadow 1.5s ease}
.vv-mini:is(:hover,:focus-visible) .vt-sol{translate:0 -10px; scale:1.12; background-color:#FFF1C1; box-shadow:0 0 0 7px rgba(255,241,193,.28), 0 0 0 14px rgba(255,241,193,.14)}
.vv-mini .vt-ur{right:8px; width:46px; height:46px}
.vv-mini:is(:hover,:focus-visible) .vt-ur{scale:1.12; rotate:-8deg}
/* maven står længere ude over højre kant end på Værktøjer, så der er luft til "Termin og barsel" */
.vv-mini .vt-gravid{right:-14px; width:66px; height:141px}
.vv-mini .vt-kal{right:8px; width:52px; height:43px}
.vv-mini:is(:hover,:focus-visible) .vt-kal{scale:1.12; rotate:6deg}
/* kloden og mødekalenderen står lidt lavere, så det lille ur og ringene ikke rører et langt navn (Verdensure, Mødebooker) */
.vv-mini .vt-klode{right:4px; top:auto; bottom:6px; width:49px; height:41px; transform:none}
.vv-mini .vt-snebold{right:0; bottom:0; width:92px; height:60px}
.vv-mini .vt-infl{right:5px; width:58px; height:43px}
.vv-mini .vt-moede{right:4px; top:auto; bottom:5px; width:50px; height:41px; transform:none}
.vv-mini:is(:hover,:focus-visible) .vt-moede{scale:1.05; rotate:4deg; translate:5px -1px}
.vv-mini .vt-stopur{right:8px; width:46px; height:50px}
.vv-mini:is(:hover,:focus-visible) .vt-stopur{scale:1.1; rotate:-6deg}
/* resten: et lyst felt med antallet — i en smal celle står tallet over teksten */
.vv-flere{display:flex; align-items:center; justify-content:center; gap:12px; height:100%; padding:0 16px; border-radius:10px; border:1.5px dashed color-mix(in srgb, var(--grøn) 45%, var(--linje));
  background:color-mix(in srgb, var(--grøn) 6%, var(--flade)); color:var(--blæk); transition:background .25s, border-color .25s, transform .28s cubic-bezier(.2,.9,.3,1.25)}
.vv-flere b{font-size:24px; font-weight:750; letter-spacing:-.02em; color:var(--grøn); font-variant-numeric:tabular-nums}
.vv-flere span{font-size:13px; font-weight:600; line-height:1.25}
.vv-flere:hover,.vv-flere:focus-visible{text-decoration:none; color:var(--blæk); border-style:solid; border-color:var(--grøn); background:color-mix(in srgb, var(--grøn) 12%, var(--flade)); transform:translateY(-3px)}
/* på de allersmalleste telefoner (under ca. 340px) er navnene en anelse mindre */
@container vvh (max-width:290px){ .vv-mini .vv-navn{font-size:12px; left:9px} }
@container vvf (max-width:239px){
  .vv-flere{flex-direction:column; gap:3px; padding:0 10px; text-align:center}
  .vv-flere b{font-size:20px; line-height:1}
  .vv-flere span{font-size:12px; line-height:1.2}
}
@media (max-width:999px){
  .vv-kort{grid-template-columns:minmax(0, 1fr)}
  .vv-tekst p{max-width:none}
}
@media (max-width:639px){
  .vv-kort{padding:16px 14px; gap:14px}
}
@media (prefers-reduced-motion:reduce){
  .vv-mini,.vv-mini .vt-ill,.vv-flere,.vv-cta{transition:none}
}

/* =============================================================
   Datohjul (ui.js): kalenderikonet i datofelterne og dialogen med tre hjul — dag, måned og år.
   Ikonet ligger oven på feltets højre ende. Chrome, Edge og Safari: den indbyggede kalenderknap skjules, men beholder
   sin plads (lidt bredere), så ikonet aldrig dækker datoen. Firefox: ikonet dækker Firefox' egen knap.
   ============================================================= */
.dh{position:relative; display:inline-block; max-width:100%; vertical-align:middle}
.felt > .dh{display:block}
.dh > input::-webkit-calendar-picker-indicator{opacity:0; pointer-events:none; width:22px; height:18px; margin:0 0 0 6px; padding:0}
.uge-find .dh > input,.ur-møde-dato .dh > input{min-width:9.5em}
.dh-knap{position:absolute; top:50%; right:4px; translate:0 -50%; display:grid; place-items:center; width:32px; height:30px; padding:0; border:0; border-radius:7px;
  background:var(--dh-bg, var(--flade)); color:var(--dæmp); cursor:pointer; transition:color .15s, background-color .15s}
.dh-knap:hover{color:var(--grøn); background:color-mix(in srgb, var(--grøn) 12%, var(--dh-bg, var(--flade)))}
.dh-knap:focus-visible{outline:2px solid var(--grøn); outline-offset:0}
.ur-omr-tid .dh,.ur-møde-dato .dh{--dh-bg:var(--bg)}
/* dialogen: står midt på skærmen; hver linje i hjulene er 40px, og der ses 5 ad gangen (den midterste er valgt) */
.dh-dlg{--dh-h:40px; --dh-kol:minmax(0, .75fr) minmax(0, 1.45fr) minmax(0, 1fr); max-width:360px; border-radius:18px}
.dh-dlg [hidden]{display:none}
.dh-dlg form{margin:0; padding:16px 16px 14px}
.dh-felt{margin:0 2px; font-size:12.5px; font-weight:600; color:var(--dæmp)}
.dh-dato{margin:2px 2px 14px; font-size:18px; font-weight:700; letter-spacing:-.01em; line-height:1.3}
.dh-kt-r{display:grid; grid-template-columns:var(--dh-kol); gap:6px; margin-bottom:2px}
.dh-kt-r span{font-size:11.5px; font-weight:600; letter-spacing:.05em; text-transform:uppercase; color:var(--dæmp2); text-align:center}
.dh-hjul{position:relative; display:grid; grid-template-columns:var(--dh-kol); gap:6px; height:calc(var(--dh-h) * 5)}
.dh-bånd{position:absolute; left:0; right:0; top:calc(var(--dh-h) * 2); height:var(--dh-h); border-radius:10px; background:var(--grøn-b); pointer-events:none}
.dh-rul{position:relative; height:100%; box-sizing:border-box; padding:calc(var(--dh-h) * 2) 0; overflow-y:auto; overscroll-behavior:contain; scroll-snap-type:y mandatory;
  scrollbar-width:none; outline:none; touch-action:pan-y;
  -webkit-mask-image:linear-gradient(to bottom, transparent, #000 34%, #000 66%, transparent); mask-image:linear-gradient(to bottom, transparent, #000 34%, #000 66%, transparent)}
.dh-rul::-webkit-scrollbar{display:none}
.dh-v{height:var(--dh-h); display:flex; align-items:center; justify-content:center; scroll-snap-align:center; border-radius:9px; font-size:17px; font-variant-numeric:tabular-nums;
  color:var(--dæmp); white-space:nowrap; cursor:pointer; user-select:none; -webkit-user-select:none}
.dh-v.valgt{color:var(--blæk); font-weight:700}
.dh-v.ude{opacity:.35}
.dh-rul:focus-visible .dh-v.valgt{box-shadow:inset 0 0 0 2px var(--grøn)}
.dh-knapper{display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-top:14px}
.dh-fyld{flex:1 1 0}
.dh-ok{font-weight:650; min-width:72px; justify-content:center}

/* =============================================================
   Stopur, timer og alarm (stopur.js): tre ure, hver i sin boks — tallene og knapperne til venstre, valg og
   omgangstider til højre (under hinanden på smalle skærme). I fuld skærm (.su-er-fuld) fylder tallene skærmen
   på mørk baggrund; .su-lag er laget over hele vinduet, hvor browseren ikke kan vise et element i fuld skærm.
   ============================================================= */
.su-hop{display:flex; flex-wrap:wrap; gap:8px; margin:0 0 18px}
.su-boks [hidden]{display:none}
.su-hop a{display:inline-flex; align-items:center; gap:7px; padding:7px 15px; border-radius:999px; border:1px solid var(--linje); background:var(--flade); color:var(--blæk); font-weight:600; font-size:14px}
.su-hop a:hover{border-color:var(--grøn); color:var(--grøn); text-decoration:none}
.su-hop svg{color:var(--grøn)}
.su-boks{display:grid; grid-template-columns:minmax(0, 1.3fr) minmax(0, 1fr); background:var(--flade); border:1px solid var(--linje); border-radius:var(--r); overflow:hidden}
.su-vis{position:relative; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:16px; padding:50px 20px 26px; border-right:1px solid var(--linje); min-width:0}
.su-side{padding:18px 20px 20px; min-width:0}
.su-h3{font-size:14.5px; margin:0 0 10px}
.su-h3 small{font-weight:500; color:var(--dæmp)}
.su-tal{font-size:clamp(46px, 7vw, 86px); font-weight:650; line-height:1; letter-spacing:-.04em; font-variant-numeric:tabular-nums; font-feature-settings:"tnum"; white-space:nowrap; color:var(--blæk)}
.su-tal small{font-size:.55em; letter-spacing:-.02em; color:var(--dæmp)}
.su-knapper{display:flex; flex-wrap:wrap; justify-content:center; gap:8px}
.su-knapper .knap{min-width:108px; justify-content:center; white-space:nowrap}
.su-knapper .knap:disabled{opacity:.45; cursor:default; border-color:var(--linje); color:var(--dæmp)}
.su-knapper .knap.su-stop{background:var(--rød); border-color:var(--rød); color:var(--på-grøn)}
.su-knapper .knap.su-stop:hover{filter:brightness(1.1)}
.su-fuld{position:absolute; top:12px; right:12px; display:inline-flex; align-items:center; gap:6px; padding:5px 11px; border:1px solid var(--linje); border-radius:999px; background:var(--flade); color:var(--dæmp); font:inherit; font-size:13px; line-height:1.4; cursor:pointer}
.su-fuld:hover{color:var(--grøn); border-color:var(--grøn)}
.su-fuld:focus-visible{outline:2px solid var(--grøn); outline-offset:2px}
.su-status{margin:0; min-height:1.45em; font-size:14.5px; color:var(--dæmp); text-align:center}
.su-status b{color:var(--blæk)}
.su-status span{display:block; margin-top:2px; color:var(--blæk); font-weight:600}
/* stopur: omgangstider */
.su-omg{max-height:320px; overflow:auto}
.su-tom{color:var(--dæmp); font-size:14px; margin:0}
.su-omg-tabel{width:100%; border-collapse:collapse; font-size:14.5px; font-variant-numeric:tabular-nums}
.su-omg-tabel th{position:sticky; top:0; background:var(--flade); font-size:12px; font-weight:600; color:var(--dæmp); text-align:left; padding:4px 6px; border-bottom:1px solid var(--linje)}
.su-omg-tabel td{padding:6px; border-bottom:1px solid var(--linje2)}
.su-omg-tabel .num{text-align:right}
.su-omg-tabel tr.hurtig td{color:var(--grøn); font-weight:600}
.su-omg-tabel tr.langsom td{color:var(--rød)}
.su-omg-tabel td span{font-size:11.5px; font-weight:650; margin-left:4px}
/* timer: ring med den tid, der er tilbage */
.su-ring{position:relative; width:min(290px, 74vw); aspect-ratio:1; display:grid; place-items:center}
.su-ring svg{position:absolute; inset:0; width:100%; height:100%}
.su-ring-bund{fill:none; stroke:var(--flade3); stroke-width:6.5}
.su-ring-tid{fill:none; stroke:var(--grøn); stroke-width:6.5; stroke-linecap:round; stroke-dasharray:100; stroke-dashoffset:0}
.su-ring .su-tal{font-size:clamp(44px, 5.6vw, 66px)}
.su-ti-felter{display:flex; gap:8px; margin-bottom:18px}
.su-ti-felter label{flex:1 1 0; display:flex; flex-direction:column; align-items:center; gap:4px; font-size:12.5px; color:var(--dæmp)}
.su-ti-felter input{width:100%; min-width:0; text-align:center; font:inherit; font-size:24px; font-weight:650; padding:8px 4px; border:1px solid var(--linje); border-radius:var(--r); background:var(--bg); color:var(--blæk); font-variant-numeric:tabular-nums}
.su-ti-felter input:focus,.su-al-felter input:focus{outline:none; border-color:var(--grøn); box-shadow:0 0 0 3px var(--grøn-b)}
.su-ti-felter input:disabled{opacity:.55}
.su-hurtig{display:flex; flex-wrap:wrap; gap:6px}
.su-hurtig .knap{min-width:68px; justify-content:center}
/* alarm */
.su-al-felter{display:grid; gap:12px}
.su-al-felter .felt span{display:block; font-size:12.5px; color:var(--dæmp); margin-bottom:4px}
.su-al-felter input{width:100%; font:inherit; padding:9px 11px; border:1px solid var(--linje); border-radius:var(--r); background:var(--bg); color:var(--blæk); min-height:42px}
.su-al-felter input[type="time"]{font-size:20px; font-weight:650; font-variant-numeric:tabular-nums}
.su-note{font-size:13px; color:var(--dæmp2); margin:14px 0 0}
/* når timeren eller alarmen ringer, blinker feltet */
@keyframes su-blink{0%, 100%{background-color:transparent} 50%{background-color:color-mix(in srgb, #F2B300 26%, transparent)}}
.su-boks.su-ringer .su-vis{animation:su-blink 1s ease-in-out infinite}
.su-boks.su-ringer .su-tal{color:#B86E00}
html[data-tema="mork"] .su-boks.su-ringer .su-tal{color:#FFC94D}
/* fuld skærm */
.su-boks::backdrop{background:#0D1411}
.su-boks.su-er-fuld{display:flex; flex-direction:column; align-items:center; justify-content:center; width:100%; height:100%; background:#0D1411; color:#F1F5F2; border:0; border-radius:0; overflow:auto}
.su-boks.su-lag{position:fixed; inset:0; z-index:300; height:auto}
html.su-lag-åben{overflow:hidden}
.su-boks.su-er-fuld .su-vis{flex:1 1 auto; width:100%; border:0; padding:8vh 4vw 5vh; gap:4vh}
.su-boks.su-er-fuld .su-tal{font-size:min(18vw, 32vh); color:#F1F5F2}
.su-boks.su-er-fuld .su-tal small{color:rgba(241,245,242,.6)}
.su-boks.su-er-fuld .su-status{font-size:clamp(16px, 2.4vh, 24px); color:rgba(241,245,242,.75)}
.su-boks.su-er-fuld .su-status b,.su-boks.su-er-fuld .su-status span{color:#F1F5F2}
.su-boks.su-er-fuld .su-knapper .knap{font-size:clamp(16px, 2.2vh, 21px); padding:12px 26px; min-width:clamp(120px, 14vw, 180px); background:transparent; color:#F1F5F2; border-color:rgba(241,245,242,.35)}
.su-boks.su-er-fuld .su-knapper .knap.fyld{background:#2FA77B; border-color:#2FA77B; color:#06140E}
.su-boks.su-er-fuld .su-knapper .knap.su-stop{background:#E06A6A; border-color:#E06A6A; color:#1A0606}
.su-boks.su-er-fuld .su-fuld{top:18px; right:18px; background:rgba(241,245,242,.08); color:#F1F5F2; border-color:rgba(241,245,242,.3)}
.su-boks.su-er-fuld .su-side{display:none}
.su-boks.su-er-fuld .su-ring{width:min(64vh, 84vw)}
.su-boks.su-er-fuld .su-ring .su-tal{font-size:min(14vw, 17vh)}
.su-boks.su-er-fuld .su-ring-bund{stroke:rgba(241,245,242,.12)}
.su-boks.su-er-fuld .su-ring-tid{stroke:#2FA77B}
.su-boks.su-er-fuld.su-ringer .su-tal{color:#FFC94D}
/* stopuret i fuld skærm: de seneste omgange under knapperne */
#su-sw.su-er-fuld .su-side{display:block; flex:0 0 auto; width:min(560px, 92vw); padding:0 0 5vh}
#su-sw.su-er-fuld .su-h3{display:none}
#su-sw.su-er-fuld .su-omg{max-height:22vh}
#su-sw.su-er-fuld .su-omg-tabel th{background:#0D1411; color:rgba(241,245,242,.6); border-color:rgba(241,245,242,.2)}
#su-sw.su-er-fuld .su-omg-tabel td{border-color:rgba(241,245,242,.1)}
#su-sw.su-er-fuld .su-tom{display:none}
@media (max-width:860px){
  .su-boks{grid-template-columns:minmax(0, 1fr)}
  .su-vis{border-right:0; border-bottom:1px solid var(--linje)}
}
@media (max-width:480px){
  .su-vis{padding:52px 12px 20px}
  .su-knapper .knap{min-width:0; flex:1 1 0; padding-left:10px; padding-right:10px}
}
@media (prefers-reduced-motion:reduce){ .su-boks.su-ringer .su-vis{animation:none; background:color-mix(in srgb, #F2B300 18%, transparent)} }