
/* Layout: to visninger med samme komponenter – vælger (offentlig) og administration (#admin) */
:root{
  --bg:#f3f6f9; --surface:#ffffff; --fg:#13202d; --muted:#5a6b7b; --line:#d8e0e8;
  --accent:var(--nw-accent); --accent-soft:var(--nw-accent-tint-3); --ok:#1d7a46; --warn:var(--nw-accent-dark); --bad:#b3261e; --acb:var(--nw-accent); --pass:var(--nw-accent); --tn:var(--nw-accent);
  --font:"Montserrat",system-ui,-apple-system,"Segoe UI",sans-serif;
  --ill-cab:#e7ecf1; --ill-edge:#8494a5; --ill-panel:#f6f8fa; --ill-mod:#ffffff; --ill-blank:#d9e0e7; --ill-bat:#3b4754; --ill-rack:#26313c; --ill-srv:#3a4754;
}

:root[data-theme="dark"]{
  --bg:#0e161e; --surface:#16212c; --fg:#e6edf3; --muted:#9aabbb; --line:#2a3846;
  --accent:#5aa6f0; --accent-soft:#1b3048; --ok:#5cc58a; --warn:var(--nw-accent); --bad:#f08a80; --acb:var(--nw-accent-mid); --pass:var(--nw-accent); --tn:var(--nw-accent); --ill-cab:#243241; --ill-edge:#6b7d8f; --ill-panel:#1b2733; --ill-mod:#2d3e4f; --ill-blank:#2a3846; --ill-bat:#8b9bab; --ill-rack:#0f171f; --ill-srv:#2b3845; color-scheme:dark}
*{box-sizing:border-box}
[hidden]{display:none!important}
body{background:var(--bg);color:var(--fg);font-family:var(--font);font-size:15px;line-height:1.5;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
  padding-left:max(20px,env(safe-area-inset-left,0px));padding-right:max(20px,env(safe-area-inset-right,0px));padding-block:24px 48px}
/* Bluecircles breakpoints: 360, 390, 412, 428 (mobil, flydende med 20 px margen), 735, 1015, 1260, 1365, 1715, 1890.
   Grid i moduler af 35 px (G). Fra 735 har hvert breakpoint fast bredde og holder sin opbygning til næste breakpoint.
   735  = 21 G: margen 1 + indhold 19 + margen 1
   1015 = 29 G: margen 1 + formular 9 + 1 + resultat 17 + margen 1
   1260 = 36 G: margen 2 + formular 10 + 1 + resultat 21 + margen 2
   1365 = 39 G: margen 2 + formular 12 + 1 + resultat 22 + margen 2
   1715 = 49 G: margen 2 + formular 12 + 1 + resultat 32 + margen 2
   1890 = som 1715, centreret
   Margen: 35 px fra 735 til 1714, mindst 70 px fra 1715 (mobil uændret) */
.wrap{width:100%;margin:0 auto;display:grid;gap:20px}
@media (min-width:735px){body{margin:0;padding-left:0;padding-right:0}.wrap{width:735px;padding-inline:35px}}
@media (min-width:1015px){.wrap{width:1015px;padding-inline:35px}}
@media (min-width:1260px){.wrap{width:1260px;padding-inline:35px}}
@media (min-width:1365px){.wrap{width:1365px;padding-inline:35px}}
header h1{font-size:1.6rem;margin:0;font-weight:700;text-wrap:balance}
header p{margin:4px 0 0;color:var(--muted);max-width:70ch}
.topbar{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:12px}
.grid{display:grid;grid-template-columns:minmax(0,1fr);gap:20px;align-items:start}
@media (min-width:735px) and (max-width:1014px){#f{grid-template-columns:1fr 1fr;column-gap:24px;align-items:start}#f>h2,#f>.hint{grid-column:1/-1}}
@media (min-width:1015px){.grid{grid-template-columns:315px 595px;column-gap:35px}}
@media (min-width:1260px){.grid{grid-template-columns:350px 805px;column-gap:35px}}
@media (min-width:1365px){.grid{grid-template-columns:420px 840px;column-gap:35px}}
.bgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:16px}
.bcard{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:16px 18px;display:grid;gap:8px;align-content:start;color:var(--fg);text-decoration:none;min-width:0}
a.bcard:hover,a.bcard:focus-visible{border-color:var(--accent);outline:none}
.bcard h2{font-size:1.05rem;margin:0}.bcard .bsub{color:var(--muted);font-size:.85rem;margin:0}
.bcard dl{display:grid;grid-template-columns:auto 1fr;gap:3px 12px;margin:0;font-size:.85rem}.bcard dt{color:var(--muted)}.bcard dd{margin:0;text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.bcard .bst{font-size:.8rem;font-weight:600;color:var(--accent)}.bcard.off{opacity:.75}.bcard.off .bst{color:var(--muted)}
.panel{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:18px;display:grid;gap:16px;min-width:0}
h2{font-size:1rem;margin:0;font-weight:700}
h3{font-size:.78rem;text-transform:uppercase;letter-spacing:.07em;color:var(--muted);margin:0;font-weight:600}
fieldset{border:0;padding:0;margin:0;display:grid;gap:8px}
legend{font-size:.78rem;text-transform:uppercase;letter-spacing:.07em;color:var(--muted);font-weight:600;margin-bottom:6px;padding:0}
label{font-weight:500}
.field{display:grid;gap:4px}
.inline{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
input[type=number],input[type=text],input[type=password],select{font:inherit;font-variant-numeric:tabular-nums;padding:9px 10px;border:1px solid var(--line);border-radius:6px;background:var(--bg);color:var(--fg);width:100%}
td input[type=number],td input[type=text]{padding:6px 8px;min-width:84px}
td input[type=number]{text-align:right}
.unit{position:relative}.unit span{position:absolute;right:10px;top:50%;transform:translateY(-50%);color:var(--muted);font-size:.85rem;pointer-events:none}
.unit input{padding-right:46px}
.seg{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--line);border-radius:6px;overflow:hidden}
.seg input{position:absolute;opacity:0}
.seg2{grid-template-columns:repeat(2,1fr)}
.seg label{text-align:center;padding:8px 4px;cursor:pointer;border-left:1px solid var(--line);font-weight:600}
.seg label:first-of-type{border-left:0}
.seg input:checked+label{background:var(--accent);color:#fff}
.seg input:focus-visible+label{outline:2px solid var(--accent);outline-offset:-3px}
.check{display:flex;gap:10px;align-items:flex-start;font-weight:500}
.check input,td input[type=checkbox]{margin-top:4px;accent-color:var(--accent);width:16px;height:16px;flex:none}
.check small{display:block;color:var(--muted);font-weight:400}
.hint{color:var(--muted);font-size:.85rem;margin:0}
.result-top{display:grid;grid-template-columns:minmax(0,1fr);gap:12px}
@media (min-width:735px){.result-top{grid-template-columns:repeat(3,minmax(0,1fr))}}
.alts td:first-child,.alts td:nth-child(2){white-space:nowrap}
.kpi{border:1px solid var(--line);border-radius:8px;padding:12px 14px;display:grid;gap:2px;min-width:0}
.kpi .k{font-size:.75rem;text-transform:uppercase;letter-spacing:.07em;color:var(--muted);font-weight:600}
.kpi .v{font-size:1.25rem;font-weight:700;font-variant-numeric:tabular-nums}
.kpi .s{font-size:.85rem;color:var(--muted)}
.kpi.price{background:var(--accent-soft);border-color:transparent}
.kpi.price .v{color:var(--accent)}
.nw{white-space:nowrap}
.placepick{display:grid;gap:6px}
.placepick>.k{font-size:.75rem;text-transform:uppercase;letter-spacing:.07em;color:var(--muted);font-weight:600}
.pp{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:8px}
.ppbtn{display:grid;gap:2px;text-align:left;padding:10px 12px;border:1px solid var(--line);border-radius:8px;background:var(--surface);font-weight:500}
.ppbtn .ppn{font-size:.85rem}.ppbtn .ppv{font-weight:700;font-variant-numeric:tabular-nums}
.ppbtn.on{border-color:var(--accent);background:var(--accent-soft);color:var(--accent)}
.solfoot{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:14px 24px}.solfoot>div{flex:1 1 420px;min-width:0}.footbtn{flex:0 0 auto;cursor:pointer;background:var(--accent);border-color:var(--accent);color:#fff;padding:12px 18px;box-shadow:0 2px 6px rgba(10,40,80,.18);transition:filter .15s,transform .15s}.footbtn .ppn{font-weight:600}.footbtn .ppv{font-weight:700}.footbtn:hover{filter:brightness(1.1)}.footbtn:active{transform:translateY(1px)}.footbtn:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
#pfOut h3,#profitPanel>h3{margin-top:28px}
.tbl{overflow-x:auto;-webkit-overflow-scrolling:touch}
/* Tabeller bredere end pladsen: tydelig slider med skygge ved kanten, synlig rullebjælke og tekst over tabellen */
.tbl.is-scroll{position:relative;padding-bottom:6px;scrollbar-width:thin;scrollbar-color:var(--accent) var(--line);
  background:linear-gradient(to right,var(--surface) 30%,transparent) left center/40px 100% no-repeat local,linear-gradient(to left,var(--surface) 30%,transparent) right center/40px 100% no-repeat local,
  radial-gradient(farthest-side at 0 50%,rgba(0,0,0,.22),transparent) left center/14px 100% no-repeat scroll,radial-gradient(farthest-side at 100% 50%,rgba(0,0,0,.22),transparent) right center/14px 100% no-repeat scroll}
.tbl.is-scroll::-webkit-scrollbar{height:8px}.tbl.is-scroll::-webkit-scrollbar-track{background:var(--line);border-radius:4px}.tbl.is-scroll::-webkit-scrollbar-thumb{background:var(--accent);border-radius:4px}
.tblhint{display:flex;align-items:center;gap:6px;font-size:.78rem;color:var(--accent);font-weight:600;margin:0 0 6px}
.tbl table{width:max-content;min-width:100%}.tbl th,.tbl td{white-space:nowrap}
/* Tabeller med betegnelse og værdi: fylder bredden, teksten må bryde */
.tbl table.pt{width:100%}.tbl table.pt td:first-child{white-space:normal;overflow-wrap:break-word}.tbl table.kv{width:100%}.tbl table.kv td{white-space:normal}.tbl table.kv td.r{padding-left:16px}
table{border-collapse:collapse;width:100%;font-variant-numeric:tabular-nums;font-size:.92rem}
th,td{text-align:left;padding:7px 8px;border-bottom:1px solid var(--line);vertical-align:middle}
th{font-size:.75rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-weight:600}
td.r,th.r{text-align:right}
td.r{white-space:nowrap}
tfoot td{font-weight:700;border-bottom:0}
tr.sumrow td{background:var(--accent-soft);color:var(--accent);font-size:1.12rem;padding-top:14px;padding-bottom:14px;border-top:2px solid var(--accent)}
.addres{display:grid;gap:10px;padding:16px;border:1.5px solid var(--accent);border-radius:10px;background:var(--surface)}
.addres .s{font-size:.8rem;color:var(--muted)}
.addres,.addopt{min-width:0;box-sizing:border-box}.addopt .an{min-width:0}
/* Navn og pris under hinanden, så de aldrig presser rammen eller deles midt i et ord */
.addopt{display:grid;grid-template-columns:auto minmax(0,1fr);row-gap:2px !important;align-items:center;gap:12px;padding:12px 14px;border:1px solid var(--line);border-radius:8px;cursor:pointer;background:var(--bg)}
.addopt input{width:20px;height:20px;margin:0;accent-color:var(--accent)}.addopt .an{font-weight:600}.addopt input{grid-row:1/3;align-self:center}.addopt .ap{grid-column:2;font-weight:700;color:var(--accent);white-space:nowrap}
.addopt:hover{border-color:var(--accent)}.addopt.on{border-color:var(--accent);background:var(--accent-soft)}.addres>.k{font-size:.75rem;text-transform:uppercase;letter-spacing:.07em;color:var(--muted);font-weight:600}
.pill{display:inline-block;font-size:.75rem;font-weight:600;padding:2px 8px;border-radius:99px;border:1px solid currentColor}
.ok{color:var(--ok)}.warn{color:var(--warn)}.bad{color:var(--bad)}.pill.ok{color:var(--pass)}
.notes{display:grid;gap:6px;margin:0;padding:0;list-style:none}
.notes li{padding-left:14px;position:relative;font-size:.9rem}
.notes li::before{content:"";position:absolute;left:0;top:.6em;width:6px;height:6px;border-radius:50%;background:var(--muted)}
.notes li.warn::before{background:var(--warn)}
.notes li.bad::before{background:var(--bad)}
.banner{border:1px dashed var(--warn);color:var(--warn);border-radius:8px;padding:8px 12px;font-size:.88rem;font-weight:500}
.fieldgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:12px}
.fieldgrid .field label{font-size:.85rem}
button,.btn{font:inherit;font-weight:600;padding:8px 14px;border-radius:6px;border:1px solid var(--line);background:var(--surface);color:var(--fg);cursor:pointer;text-decoration:none;display:inline-block}
.btn-primary{background:var(--accent);border-color:var(--accent);color:#fff}
button:focus-visible,.btn:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.src{font-size:.82rem;color:var(--muted)}
.src a,.link{color:var(--accent)}
#out{display:grid;gap:14px}
.alts{display:grid;gap:12px;margin-top:14px;padding-top:18px;border-top:2px solid var(--line);opacity:.92}
.alts h2{font-size:1rem}
.login{max-width:400px;margin:40px auto 0}
.adminGrid{display:grid;gap:20px}
.saved{font-size:.85rem;color:var(--ok);font-weight:600}
.del{padding:4px 10px;font-size:.85rem}
input[type=email],input[type=tel],textarea{font:inherit;padding:9px 10px;border:1px solid var(--line);border-radius:6px;background:var(--bg);color:var(--fg);width:100%}
textarea{resize:vertical}
.cta{display:grid;gap:12px;margin-top:34px}
.cta>h2{padding-bottom:12px;border-bottom:1px solid var(--line)}
.ctagrid{display:grid;grid-template-columns:minmax(0,1fr);gap:12px}
@media (min-width:735px){.ctagrid{grid-template-columns:1fr 1fr}.ctagrid .full{grid-column:1/-1}}
.ctadone{display:grid;gap:8px;border:1px solid var(--ok);border-radius:8px;padding:14px}
table.pick tr.clk{cursor:pointer}
table.pick tr.clk:hover td{background:var(--accent-soft)}
table.pick tr.on td{background:var(--accent-soft);font-weight:600}
.pickbtn{padding:4px 12px;font-size:.85rem}
.linkbtn{border:0;background:none;padding:0;color:var(--accent);text-decoration:underline;font-weight:600;font-size:inherit}
.kpi .diff{color:var(--warn)}
.kpibtn{justify-self:start;margin-top:4px;padding:6px 12px;font-size:.85rem}
/* KPI: værdi øverst, undertekst i prisboksen i bunden */
.kpi{grid-template-rows:auto auto 1fr;align-content:start}
.kpi.price .s{align-self:end}
/* Andre muligheder: linje under overskriften i stedet for over sektionen */
.alts{border-top:0;padding-top:0}
.alts>h2{padding-bottom:12px;border-bottom:1px solid var(--line)}
.alts>.tbl+h3{margin-top:30px}
/* Underside: løsningen */
.back{margin:0 0 6px}
.solgrid{align-items:start}
#bat>section,#bat>.batgrid{margin-top:20px}
.batgrid{display:grid;grid-template-columns:minmax(0,1fr);gap:20px;align-items:start}
@media (min-width:1015px){.batgrid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
.batkpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px}
@media (max-width:734px){.batkpis{grid-template-columns:1fr 1fr}}
.batchart{position:relative}.batchart svg{display:block;width:100%;height:auto}
.batchart .grid-l{stroke:var(--line);stroke-width:1}.batchart .ax{font-size:11px;fill:var(--muted)}
.batchart .ln{fill:none;stroke:var(--accent);stroke-width:2;stroke-linejoin:round}.batchart .pt{fill:var(--accent);stroke:var(--surface);stroke-width:2}
.batchart .xh{stroke:var(--muted);stroke-width:1;stroke-dasharray:3 3}
.batchart .tip{position:absolute;pointer-events:none;background:var(--surface);border:1px solid var(--line);border-radius:6px;padding:6px 9px;font-size:.8rem;box-shadow:0 2px 8px rgba(0,0,0,.12);white-space:nowrap}
.batdraw .bd-body{fill:var(--ill-bat)}.batdraw .bd-lid{fill:var(--ill-edge)}.batdraw .bd-p{fill:#c62828}.batdraw .bd-n{fill:var(--tn)}
.batdraw .bd-dim{stroke:var(--muted);stroke-width:1;fill:none}.batdraw .bd-t{font-size:12px;fill:var(--fg)}.batdraw .bd-c{font-size:12px;font-weight:600;fill:var(--muted)}
#batCap,#batApp{display:grid;gap:10px}#batCap .tbl+h3,#batApp ul+h3{margin-top:12px}.battabs{max-width:420px}.batleg{margin-top:10px}.batleg i{width:22px;border-radius:2px}#batTbl tr.sel td{font-weight:700;background:var(--accent-soft)}
.batapp{margin:0;padding-left:18px;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,240px),1fr));column-gap:28px;row-gap:4px}.batapp li{min-width:0;overflow-wrap:break-word}
.dsbtn{justify-self:start;display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border-radius:8px;background:var(--accent);color:#fff;font-weight:600;text-decoration:none}
a.batlink{color:var(--accent);text-decoration:underline;text-underline-offset:2px}
@media (min-width:1015px){.solside{grid-column:1;grid-row:1}.solmain{grid-column:2;grid-row:1}.solside{position:sticky;top:20px}}
.solside .cta{margin-top:10px}
.solside .ctagrid{grid-template-columns:minmax(0,1fr)!important}
.solside .ctagrid .full{grid-column:auto}
.dia{width:100%;min-width:0}
.dia svg{display:block;width:100%;height:auto;overflow:visible}
.dia text{font-family:var(--font);fill:var(--fg)}
.dia .t-k{font-size:11.5px;font-weight:600;letter-spacing:.07em;fill:var(--muted)}
.dia .t-b{font-size:13px;font-weight:700}
.dia .t-s{font-size:12px;fill:var(--muted)}
.dia .t-m{font-size:12px;font-weight:600}
.dia .box{fill:var(--surface);stroke:var(--line);stroke-width:1}
.dia .cab{fill:var(--bg);stroke:var(--fg);stroke-width:1.5}
.dia .mod{fill:var(--accent)}.dia .mod-t{fill:#fff;font-size:12px;font-weight:600}
.dia .red{fill:var(--accent-soft);stroke:var(--accent);stroke-width:1}.dia .red-t{fill:var(--accent);font-size:12px;font-weight:600}
.dia .exp{fill:none;stroke:var(--accent);stroke-width:1;stroke-dasharray:4 3}.dia .exp-t{fill:var(--accent);font-size:12px;font-weight:500}
.dia .free{fill:none;stroke:var(--muted);stroke-width:1;stroke-dasharray:4 3}.dia .free-t{fill:var(--muted);font-size:12px}
.dia .bat{fill:var(--muted)}
.dia .wire{stroke:var(--fg);stroke-width:1.5;fill:none}
.dia .wire-b{stroke:var(--fg);stroke-width:1.5;fill:none;stroke-dasharray:5 4}
.dia .arr{fill:var(--fg)}
.legend{display:flex;flex-wrap:wrap;gap:8px 18px;margin:0;padding:0;list-style:none;font-size:.82rem;color:var(--muted)}
.legend li{display:flex;align-items:center;gap:6px}
.legend i{display:inline-block;width:18px;height:12px;border-radius:2px}
/* Samme udtryk som modulet i tegningen: hvid flade, blå kant, grøn driftsstribe og driftslampe */
.legend .l-mod,.legend .l-red{width:24px;height:14px;background:radial-gradient(circle at 72% 50%,var(--nw-accent) 0 2.2px,transparent 2.7px),var(--ill-mod);border:1.4px solid var(--accent);box-shadow:inset 3px 0 0 var(--nw-accent)}
.legend .l-red{border-style:dashed}
.legend .l-exp{border:1px dashed var(--accent)}.legend .l-free{background:var(--ill-blank);border:1px solid var(--ill-edge)}.legend .l-bat{background:var(--ill-bat)}
.legend .l-ac{height:4px;background:var(--accent)}.legend .l-acb{height:4px;background:var(--acb)}.legend .l-dc{height:4px;background:var(--warn)}
.solill{gap:14px}
.dia.scroll{overflow-x:auto}.dia.scroll svg{width:auto;max-width:none}
.dia .il-cab{fill:var(--ill-cab);stroke:var(--ill-edge);stroke-width:1.2}
.dia .il-rack{fill:var(--ill-rack);stroke:var(--ill-edge);stroke-width:1.2}
.dia .il-plinth{fill:var(--ill-edge)}
.dia .il-panel{fill:var(--ill-panel);stroke:var(--ill-edge);stroke-width:.8}
.dia .il-inner{fill:var(--ill-panel)}
.dia .il-rail{fill:var(--ill-edge);opacity:.35}
.dia .il-brk{fill:var(--ill-mod);stroke:var(--ill-edge);stroke-width:.6}
.dia .il-tog{fill:var(--fg)}
.dia .il-srv{fill:var(--ill-srv)}
.dia .il-led{fill:var(--nw-accent)}.dia .il-led2{fill:#4aa3ff}
.dia .il-vent{fill:var(--ill-edge)}
.dia .il-disp{fill:#0d2c4a}.dia .il-dispt{fill:#7cc4ff;opacity:.85}
.dia .il-mod{fill:var(--ill-mod);stroke:var(--accent);stroke-width:1.4}
.dia .il-modr{fill:var(--ill-mod);stroke:var(--accent);stroke-width:1.4;stroke-dasharray:6 2}
.dia .il-mvent{fill:var(--ill-edge)}
.dia .il-handle{fill:var(--ill-edge)}
.dia .il-modt{font-size:12px;font-weight:600;fill:var(--accent)}.dia .il-modrt{font-size:12px;font-weight:600;fill:var(--accent)}
.dia .il-exp{fill:var(--accent-soft);stroke:var(--accent);stroke-width:1;stroke-dasharray:4 3}.dia .il-expt{font-size:12px;font-weight:600;fill:var(--accent)}
.dia .il-blank{fill:var(--ill-blank);stroke:var(--ill-edge);stroke-width:.8}.dia .il-blankt{font-size:11.5px;fill:var(--muted)}
.dia .il-screw{fill:var(--ill-edge)}
.dia .il-bat{fill:var(--ill-bat)}.dia .il-tp{fill:#c62828}.dia .il-tn{fill:var(--tn)}
.dia .il-shelf{fill:var(--ill-edge)}
.dia .il-post{fill:var(--ill-edge)}
.dia .il-floor{fill:var(--line)}
.dia .il-ac,.dia .il-acb,.dia .il-dc{fill:none;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:10 8;animation:ilflow 1.2s linear infinite}
.dia .il-ac{stroke:var(--accent)}.dia .il-acb{stroke:var(--acb)}.dia .il-dc{stroke:var(--warn)}
.dia .il-ac-bg,.dia .il-acb-bg,.dia .il-dc-bg{fill:none;stroke-width:3;stroke-linejoin:round;opacity:.22}
.dia .il-ac-bg{stroke:var(--accent)}.dia .il-acb-bg{stroke:var(--acb)}.dia .il-dc-bg{stroke:var(--warn)}
.dia .il-tag{fill:var(--accent)}.dia .il-tagb{fill:var(--acb)}.dia .il-tagdc{fill:var(--warn)}.dia .il-tagt{font-size:11px;font-weight:700;fill:#fff}
@keyframes ilflow{to{stroke-dashoffset:-18}}
.dia .il-run{fill:var(--nw-accent)}.dia .il-ledhalo{fill:var(--nw-accent);opacity:.25;animation:ilpulse 1.6s ease-in-out infinite}.dia .il-ledon{animation:ilblink 1.6s ease-in-out infinite}
@keyframes ilpulse{0%,100%{opacity:.08}50%{opacity:.35}}@keyframes ilblink{0%,100%{opacity:.75}50%{opacity:1}}
@media (prefers-reduced-motion:reduce){.dia .il-ledhalo,.dia .il-ledon{animation:none}}
@media (prefers-reduced-motion:reduce){.dia .il-ac,.dia .il-acb,.dia .il-dc{animation:none}}
.soldet{display:grid;gap:14px}
.soldet>h3{margin-top:18px}
.soldet>h3:first-child{margin-top:0}
.soldet>.notes.under{margin-top:2px}
.solfacts td:first-child{color:var(--muted)}
/* Sideformat 1715 px (Gabriells layout): indhold 1366 px, venstre margen 69 px, formular 421 + 35 + resultat 910 */
/* Lodrette afstande fra Gabriells layout (1715 px) – gælder fra 735 og op */
@media (min-width:735px){
  .kpi{padding:14px;row-gap:8px}
  .kpi.price .v{margin-top:-6px}
  .panel{padding:15px 30px 30px}
  #out>h3{margin-top:24px}
  #out>.tbl+h3,#out>.notes.under+h3{margin-top:27px}
  #out>.notes.under{margin-top:2px;margin-bottom:18px}
  #out>.pricehint{margin-top:-4px}
  #out>.pricehint+.notes{margin-top:22px}
  .alts{margin-top:34px}
}
/* 1715 og 1890: Gabriells layout på 35 px-grid */
@media (min-width:1715px){
  .kpi.price .v{white-space:nowrap;font-size:1.12rem}
  .wrap{width:1715px;padding-inline:70px}
  #front>header,#sol>header{padding-left:35px}
  .grid{grid-template-columns:420px 1120px;column-gap:35px}
}
@media (max-width:734px){
  body{font-size:14px}
  header h1{font-size:1.35rem}
  .panel{padding:14px}
  table{font-size:.82rem}
  th,td{padding:6px 5px}
  th{font-size:.68rem;letter-spacing:.03em}
  .pill{font-size:.68rem;padding:1px 6px}
  .kpi .v{font-size:1.1rem}
}

/* ===== Batterisider v3 ===== */
/* Layout: lys grå side, hvide kort med lille radius, venstre filterkolonne, sort tekst og blå kun til handlinger – som store B2B-webshops */
:root{--pg:var(--nw-page);--card:#ffffff;--ink:var(--nw-ink);--txt:var(--nw-ink-3);--mute:#8a949e;--ln:#e2e6ea;--acc:var(--nw-accent);--acc-d:var(--nw-accent-dark);--accs:var(--nw-accent-tint);--ok:#1e8e3e;--warn:#b36b00;
 --bg:var(--nw-page);--surface:#ffffff;--fg:var(--nw-ink);--muted:var(--nw-ink-3);--line:#e2e6ea;--accent:var(--nw-accent);--accent-soft:var(--nw-accent-tint);color-scheme:light}

:root[data-theme="dark"]{--bg:var(--nw-page);--surface:#ffffff;--fg:var(--nw-ink);--muted:var(--nw-ink-3);--line:#e2e6ea;--accent:var(--nw-accent);--accent-soft:var(--nw-accent-tint);--ill-bat:#3b4754;--ill-edge:#8494a5;color-scheme:light}
body.bs{padding:0;margin:0;background:var(--pg);color:var(--ink);font-size:14px}
.in{width:100%;margin:0 auto;padding-left:max(20px,env(safe-area-inset-left,0px));padding-right:max(20px,env(safe-area-inset-right,0px))}
@media (min-width:735px){.in{width:735px;padding-inline:35px}}
@media (min-width:1015px){.in{width:1015px}}
@media (min-width:1260px){.in{width:1260px}}
@media (min-width:1365px){.in{width:1365px}}
@media (min-width:1715px){.in{width:1715px;padding-inline:70px}}
.bar{background:transparent;position:relative;z-index:5}
.bar .in{display:block;padding-block:35px 0}
@media (min-width:1715px){.bar .srch{width:1400px}}
.logo{display:flex;align-items:center;gap:6px;color:var(--acc);text-decoration:none;font-size:1.45rem;font-weight:500;letter-spacing:-.01em}
.logo i{width:26px;height:26px;border-radius:50%;background:var(--acc)}
.srch{position:relative}
.srch input{width:100%;box-sizing:border-box;height:44px;font:inherit;font-size:13px;font-weight:400;padding:0 20px 0 56px;border-radius:22px;border:0;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' fill='none' stroke='%238d8d8d' stroke-width='1'%3E%3Ccircle cx='7.42' cy='7.43' r='6.92'/%3E%3Cpath d='M12.2 12.4l5.71 5.71'/%3E%3C/svg%3E") no-repeat 19.72px 12.39px;color:var(--nw-ink);-webkit-appearance:none;appearance:none}
.srch input::placeholder{color:#898989;opacity:1}
.bc{display:flex;align-items:center;flex-wrap:wrap;margin-top:23px;font-size:11px;font-weight:400;color:#898989;line-height:15px}
.bc a,.bc span{color:#898989;text-decoration:none}.bc a:hover{color:var(--nw-accent)}
.bc .home{display:flex;margin:0 21px 0 19px}.bc .sep{color:#555;margin:0 10px}
.srch input:focus{outline:2px solid var(--acc);outline-offset:1px}
.srch ul{position:absolute;left:0;right:0;top:calc(100% + 6px);background:var(--card);border:1px solid var(--ln);border-radius:10px;box-shadow:0 10px 30px rgba(16,24,40,.12);list-style:none;margin:0;padding:6px;z-index:6}
.srch li a{display:flex;gap:10px;padding:8px 10px;border-radius:6px;color:var(--ink);text-decoration:none;font-weight:600}.srch li a span{color:var(--mute);font-weight:400;min-width:110px}
.srch li a:hover,.srch li a:focus{background:var(--pg)}.srch li.no{padding:8px 10px;color:var(--mute)}
main .in{padding-block:18px 56px;display:grid;gap:18px}
.crumbs3{font-size:.82rem;color:var(--txt);margin:0;display:flex;gap:8px;flex-wrap:wrap;align-items:center}.crumbs3 a{color:var(--txt);text-decoration:none}.crumbs3 a:hover{color:var(--acc);text-decoration:underline}
.hd1{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap}
.hd1 h1{font-size:1.75rem;margin:0;font-weight:700;letter-spacing:-.01em}.hd1 h1 small{font-size:1rem;color:var(--mute);font-weight:500;margin-left:8px}
.hd1 p{margin:4px 0 0;color:var(--txt);max-width:70ch;font-size:.92rem}
.facts{display:flex;gap:22px;flex-wrap:wrap;font-size:.85rem;color:var(--txt)}.facts b{color:var(--ink);font-variant-numeric:tabular-nums}
.layout{display:grid;gap:18px;grid-template-columns:minmax(0,1fr)}
@media (min-width:1015px){.layout{grid-template-columns:250px minmax(0,1fr)}}
.side{background:var(--card);border-radius:8px;align-self:start;overflow:hidden}
@media (min-width:1015px){.side{position:sticky;top:20px}}
.side h2{font-size:1rem;margin:0;padding:14px 16px;color:var(--ink);border-bottom:1px solid var(--ln);font-weight:700}
.side .grp{padding:12px 16px;border-bottom:1px solid var(--ln);display:grid;gap:8px}.side .grp:last-child{border-bottom:0}
.side h3{font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--txt);margin:0;font-weight:700}
.side label{display:flex;gap:9px;align-items:center;font-size:.86rem;cursor:pointer}.side label span{margin-left:auto;color:var(--mute);font-size:.78rem}
.side input[type=checkbox]{accent-color:var(--acc);width:16px;height:16px}
.side a.cat{display:flex;justify-content:space-between;gap:10px;padding:7px 0;color:var(--ink);text-decoration:none;font-size:.9rem}.side a.cat span{color:var(--mute)}.side a.cat:hover{color:var(--acc)}
.tools{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.tools .cnt{color:var(--txt);font-size:.88rem}
.sel{font:inherit;font-size:.86rem;padding:8px 12px;border:1px solid var(--ln);border-radius:6px;background:var(--card);color:var(--ink);width:auto}
.tools label{display:flex;gap:8px;align-items:center;font-size:.86rem;color:var(--txt)}
.grid3{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px}
.pc{background:var(--card);border-radius:8px;padding:16px;display:flex;flex-direction:column;gap:10px;color:var(--ink);text-decoration:none;border:1px solid transparent;transition:border-color .15s,box-shadow .15s}
.pc:hover,.pc:focus-visible{border-color:var(--ln);box-shadow:0 6px 18px rgba(16,24,40,.08);outline:none}
.pc .top{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}
.pc .img{width:62%;height:120px;display:flex;align-items:center;justify-content:flex-start;position:relative}
.pc .price{text-align:right;display:grid}.pc .price b{font-size:1.2rem;font-weight:700;font-variant-numeric:tabular-nums}.pc .price small{font-size:.72rem;color:var(--mute)}
.ask{font-size:.8rem;color:var(--txt);font-weight:600;max-width:9ch;display:block;line-height:1.3}
.pc h3{font-size:.95rem;margin:0;font-weight:600;line-height:1.35;color:var(--ink);text-transform:none;letter-spacing:0}
.bl{margin:0;padding-left:16px;display:grid;gap:2px;font-size:.8rem;color:var(--txt)}.bl li::marker{color:var(--mute)}
.mdl{margin:0;font-size:.75rem;color:var(--mute)}
.pc .ft{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:auto;padding-top:6px}
.dot{font-size:.78rem;color:var(--txt);display:flex;align-items:center;gap:6px}.dot::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--mute)}
.dot.ok::before{background:var(--ok)}.dot.np::before{background:#f0b400}
.btn2{background:var(--acc);color:#fff;border-radius:6px;padding:7px 14px;font-size:.8rem;font-weight:600;white-space:nowrap}
.pc:hover .btn2{background:var(--acc-d)}
.ph{display:block;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain}
.sercap{position:absolute;left:0;bottom:-2px;font-size:.62rem;color:var(--mute);background:var(--card);padding:0 4px 0 0}
.noph{width:100%;height:100%;display:grid;place-items:center;background:var(--pg);border-radius:6px;color:var(--mute);font-size:.72rem}
.card{background:var(--card);border-radius:8px;padding:18px}
.map{position:relative;display:grid;gap:10px}
.map .hd{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;align-items:flex-end}
.map h2{font-size:1.05rem;margin:0;font-weight:700}.map p{margin:0;color:var(--txt);font-size:.85rem;max-width:62ch}
.map svg{display:block;width:100%;height:auto}
.map .grid-l{stroke:var(--ln)}.map .ax,.map .axt{font-size:11px;fill:var(--mute);font-family:var(--font)}.map .axt{font-weight:600}
.map .dot{fill:#c3cad2;opacity:.9;cursor:pointer}.map .dot.on{fill:var(--acc);opacity:.85}
.map .tip{position:absolute;pointer-events:none;background:var(--ink);color:#fff;border-radius:6px;padding:7px 10px;font-size:.78rem;white-space:nowrap}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chip{font:inherit;font-size:.78rem;padding:5px 11px;border-radius:999px;border:1px solid var(--ln);background:var(--card);color:var(--ink);cursor:pointer}
.chip[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:#fff}
.chip:focus-visible,.sel:focus-visible,.side input:focus-visible,.cta:focus-visible{outline:2px solid var(--acc);outline-offset:2px}
.brands{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:17.5px}
/* Oversigt efter Wepshop_kort_1.ai (1715 px): kolonne 245 + 35 + 1295; kort 245 × 287,5 med 17,5 mellemrum */
.ovm{display:grid;gap:17.5px;min-width:0;align-content:start}
.ovh{margin-top:74px;display:grid;grid-template-columns:minmax(0,1fr);gap:0}.ovh h1{font-size:33px;line-height:35px;font-weight:700;letter-spacing:0;color:var(--nw-ink)}
.ovh p{margin:22px 0 0;font-size:16px;line-height:23px;color:var(--nw-ink-3);max-width:550px}
.ovh .facts{font-size:13.6px;gap:22px;justify-self:end;margin-top:2px}
.ovl{margin-top:1px}
@media (max-width:734px){.ovh{margin-top:35px}.ovh h1{font-size:26px;line-height:30px}.ovh .facts{justify-self:start;margin-top:12px}}
@media (min-width:1015px){.ovl{grid-template-columns:245px minmax(0,1fr);gap:35px}}
@media (min-width:1715px){.brands{grid-template-columns:repeat(5,245px);gap:17.5px}.brand{height:287.5px}}
.brand{background:#fff;border-radius:0;padding:16px;box-sizing:border-box;display:flex;flex-direction:column;gap:8px;color:var(--ink);text-decoration:none;border:1px solid transparent;transition:border-color .15s,box-shadow .15s}
.brand:hover,.brand:focus-visible{border-color:var(--ln);box-shadow:0 6px 18px rgba(16,24,40,.08);outline:none}
.brand .img{height:120px;display:flex;align-items:center;justify-content:center;position:relative}
.brand h3{font-size:1.05rem;margin:4px 0 0;font-weight:700;color:var(--ink);text-transform:none;letter-spacing:0}
.brand .s{font-size:.78rem;color:var(--txt)}
.brand .ft{display:flex;justify-content:space-between;align-items:center;margin-top:auto;padding-top:6px;font-size:.8rem;color:var(--txt)}
.brand .ft b{color:var(--ink)}
.prod{display:grid;gap:18px}
@media (min-width:1015px){.prod{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr)}}
.prod .gal{background:var(--card);border-radius:8px;min-height:360px;display:flex;align-items:center;justify-content:center;padding:28px;position:relative}
.prod .gal .ph{max-height:400px}.prod .gal .sercap{left:16px;bottom:12px;font-size:.75rem}
.prod .info{background:var(--card);border-radius:8px;padding:22px;display:grid;gap:14px;align-content:start}
.prod .brandl{font-size:.82rem;color:var(--acc);text-decoration:none;font-weight:600}
.prod h1{font-size:1.6rem;margin:0;line-height:1.2;font-weight:700}
.prod .lead{color:var(--txt);margin:0;font-size:.9rem}
.prod .bl{font-size:.88rem;gap:4px}
.kvt{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:var(--ln);border:1px solid var(--ln);border-radius:8px;overflow:hidden}
.kvt div:last-child:nth-child(odd){grid-column:span 2}
.kvt div{background:var(--card);padding:10px 12px;display:grid;gap:1px}.kvt b{font-size:1.05rem;font-variant-numeric:tabular-nums}.kvt span{font-size:.72rem;color:var(--mute)}
.buy{border-top:1px solid var(--ln);padding-top:14px;display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.buy .pr{display:grid}.buy .pr b{font-size:1.5rem;font-variant-numeric:tabular-nums}.buy .pr small{color:var(--mute);font-size:.75rem}.buy .ask{max-width:none;font-size:1rem}
.ctas{display:flex;gap:8px;flex-wrap:wrap}
.cta{font:inherit;font-weight:600;font-size:.86rem;padding:10px 16px;border-radius:6px;text-decoration:none;display:inline-flex;align-items:center}
.cta.p{background:var(--acc);color:#fff}.cta.p:hover{background:var(--acc-d)}.cta.g{border:1px solid var(--ln);color:var(--ink);background:var(--card)}.cta.g:hover{border-color:var(--ink)}
main .panel{border:0;border-radius:8px;box-shadow:none}
main .panel h2{font-weight:700;color:var(--ink);font-size:1.05rem}
.sib{display:flex;flex-wrap:wrap;gap:6px}.sib a{font-size:.82rem;padding:6px 12px;border-radius:6px;border:1px solid var(--ln);text-decoration:none;color:var(--ink);background:var(--card)}
.sib a:hover{border-color:var(--acc);color:var(--acc)}.sib a[aria-current]{background:var(--ink);border-color:var(--ink);color:#fff}
.hint{color:var(--mute)}
.kgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,385px));gap:35px;justify-content:start}
@media (max-width:734px){.kgrid{grid-template-columns:minmax(0,1fr);gap:20px}}
.kc{background:#fff;border:.57px solid #c0c0c0;padding:29px 29px 25px;display:flex;flex-direction:column;color:#000;text-decoration:none;min-height:555px;box-sizing:border-box;font-family:var(--font)}
.kc:hover,.kc:focus-visible{border-color:var(--nw-accent);outline:none}
.kname{font-size:13px;font-weight:300;color:#666;margin:-14px 0 6px}
.kimg{border:.57px solid #c0c0c0;height:163px;display:flex;align-items:center;justify-content:center;padding:8px;position:relative;box-sizing:border-box}
.kimg .ph{max-height:145px}.kimg .noph{background:#fff}
.kbar{margin-top:39px;display:grid;gap:2px}
.kl{display:flex;justify-content:space-between;align-items:baseline;font-size:15px;font-weight:300;color:#666;line-height:22px}.kl .c{color:#000}
.kt{height:11.2px;background:#000;position:relative}.kt i{position:absolute;inset:0 auto 0 0;background:var(--nw-accent)}
.ks{list-style:none;margin:20px 0 0;padding:0;display:grid;gap:6px;font-size:13px;font-weight:300;color:#666;line-height:19px}
.ks li{display:flex;justify-content:space-between;gap:10px;padding-left:17px;position:relative}.ks li::before{content:"•";position:absolute;left:0;font-size:9px}
.ks li span{white-space:nowrap}.ks li b{font-weight:300;text-align:right;font-variant-numeric:tabular-nums}
.ks li.k{font-weight:700;color:#333}.ks li.k b{font-weight:700}.ks li.k::before{font-size:13px}
.kn{margin:36px 0 0;font-size:13px;font-weight:300;color:#666;line-height:19px;min-height:19px;overflow-wrap:anywhere}
.kf{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:auto;padding-top:24px}
.kp{font-size:16px;font-weight:500;color:var(--nw-ink);white-space:nowrap}
.kb{display:inline-flex;align-items:center;gap:12px;background:var(--nw-accent);color:#fff;border-radius:999px;height:45px;padding:0 28px;min-width:138.7px;justify-content:center;box-sizing:border-box;font-size:12px;font-weight:500;white-space:nowrap}
.kc:hover .kb{background:var(--nw-accent-dark)}
.foot{background:var(--card);border-top:1px solid var(--ln);color:var(--txt);font-size:.8rem}.foot .in{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;padding-block:22px}
@media (prefers-reduced-motion:reduce){.pc,.brand{transition:none}}

/* Brødkrumme efter Wepshop_kort_1.ai (1715): hus 16,35×14,33 ved x89, tekst x125,6, pil 3,6×5,85, næste tekst +16,5 */
.bc .home,.bch-bc .bch-home{margin:0 20.28px 0 19px;position:relative;top:.6px}
.bc .sep,.bch-bc .bch-sep{display:inline-flex;margin:0 16.5px 0 7.5px;position:relative;top:2.3px;line-height:0}

/* bc-size */.bc,.bch-bc{font-size:14px;line-height:19px}.bc .home svg,.bch-bc .bch-home svg{width:20.8px;height:18.2px}.bc .home svg path,.bch-bc .bch-home svg path{fill:var(--nw-accent)}.bc a:hover,.bch-bc a:hover{color:var(--nw-accent)}.bc .sep svg,.bch-bc .bch-sep svg{width:4.6px;height:7.5px}.bc .sep,.bch-bc .bch-sep{top:.5px!important;margin:0 18px 0 10px!important}
/*atea-size*/.srch input,.bch-srch input{height:48px!important;border-radius:24px!important;font-size:16px!important;padding:0 20px 0 52px!important;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 18 18' fill='none' stroke='%238d8d8d' stroke-width='1'%3E%3Ccircle cx='7.42' cy='7.43' r='6.92'/%3E%3Cpath d='M12.2 12.4l5.71 5.71'/%3E%3C/svg%3E")!important;background-position:16px 12px!important;background-size:24px 24px!important;background-repeat:no-repeat!important}.bc,.bch-bc{font-size:14px!important;line-height:24px!important}.bc .home,.bch-bc .bch-home{width:24px;height:24px;margin:0 8px 0 16px!important;top:0!important;align-items:center;justify-content:center}.bc .home svg,.bch-bc .bch-home svg{display:none}.bc .home::before,.bch-bc .bch-home::before{content:"";display:block;width:24px;height:24px;background:var(--nw-accent);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cpath fill-rule=%22evenodd%22 d=%22M12 2.8l10 8.4h-2.6v9.6H4.6v-9.6H2zM12 12.6a2.7 2.7 0 1 0 0 5.4a2.7 2.7 0 1 0 0-5.4z%22/%3E%3C/svg%3E") center/24px 24px no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cpath fill-rule=%22evenodd%22 d=%22M12 2.8l10 8.4h-2.6v9.6H4.6v-9.6H2zM12 12.6a2.7 2.7 0 1 0 0 5.4a2.7 2.7 0 1 0 0-5.4z%22/%3E%3C/svg%3E") center/24px 24px no-repeat}.bc .home:hover::before,.bch-bc .bch-home:hover::before{background:var(--nw-accent)}.bc .sep,.bch-bc .bch-sep{width:24px;height:24px;margin:0 4px!important;top:0!important;align-items:center;justify-content:center;display:inline-flex!important}.bc .sep svg,.bch-bc .bch-sep svg{width:6px!important;height:9.75px!important}
/*sel-arrow*/select{-webkit-appearance:none!important;-moz-appearance:none!important;appearance:none!important;padding-right:44px!important;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='8' viewBox='0 0 14 8' fill='none' stroke='%230a0a0a' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 1l6 6 6-6'/%3E%3C/svg%3E")!important;background-repeat:no-repeat!important;background-position:right 16px center!important;background-size:14px 8px!important}select::-ms-expand{display:none}
