/* Calculus · grundstil. Uddraget af Lottostats public/assets/site.css (2026-10-12), samme værdier (D-008).
   Farver sættes kun i :root-blokkene. Komponentregler bruger var(--c-*). */
:root {
  --navy-950:#071426; --navy-900:#0B1F3A; --navy-800:#102B4E; --navy-700:#173B67;
  --blue-600:#2563EB; --blue-400:#60A5FA; --blue-100:#DBEAFE;
  --background:#F3F7FB; --surface:#FFFFFF; --surface-alt:#F7FAFD; --border:#DDE6EF;
  --text-primary:#0F172A; --text-secondary:#475569; --text-muted:#64748B;
  --hot-red:#EF233C; --success-green:#16834B;
  --shadow:rgba(15,23,42,.10);
  --font: system-ui, -apple-system, "Segoe UI", "Helvetica Neue", Arial, sans-serif;
  color-scheme: light;
  --c-header:var(--navy-900); --c-page:var(--background); --c-card:var(--surface); --c-card-alt:var(--surface-alt);
  --c-line:var(--border); --c-control-line:var(--text-muted); --c-text:var(--text-primary);
  --c-text-2:var(--text-secondary); --c-text-3:var(--text-muted); --c-link:var(--blue-600);
  --c-link-on-dark:var(--blue-400); --c-focus:var(--blue-600); --c-error:var(--hot-red); --c-ok:var(--success-green);
  --c-strong:var(--navy-900); --c-strong-alt:var(--navy-700); --c-header-alt:var(--navy-800);
  --c-highlight:var(--blue-100); --c-menu-hover:var(--navy-700); --c-focus-on-dark:var(--blue-400);
  --c-footer-text:#CBD5E1; --header-border:0;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --c-page:#0A1628; --c-card:#111F36; --c-card-alt:#16294A; --c-line:#2A4166; --c-control-line:#6F86A6;
    --c-text:#E6EDF5; --c-text-2:#B6C3D4; --c-text-3:#93A4BA; --c-link:#7DB4FB; --c-focus:#7DB4FB;
    --c-error:#FF7A8A; --c-ok:#4ADE80; --c-header:#050C18; --shadow:rgba(0,0,0,.4);
    --c-strong:#E6EDF5; --c-strong-alt:#7DB4FB; --c-header-alt:#111F36; --c-highlight:#16294A;
    --c-menu-hover:#16294A; --c-focus-on-dark:#7DB4FB; --header-border:1px solid var(--c-line);
    color-scheme:dark;
  }
}
:root[data-theme="dark"] {
  --c-page:#0A1628; --c-card:#111F36; --c-card-alt:#16294A; --c-line:#2A4166; --c-control-line:#6F86A6;
  --c-text:#E6EDF5; --c-text-2:#B6C3D4; --c-text-3:#93A4BA; --c-link:#7DB4FB; --c-focus:#7DB4FB;
  --c-error:#FF7A8A; --c-ok:#4ADE80; --c-header:#050C18; --shadow:rgba(0,0,0,.4);
  --c-strong:#E6EDF5; --c-strong-alt:#7DB4FB; --c-header-alt:#111F36; --c-highlight:#16294A;
  --c-menu-hover:#16294A; --c-focus-on-dark:#7DB4FB; --header-border:1px solid var(--c-line);
  color-scheme:dark;
}

/* Grund */
* { box-sizing: border-box }
body { margin: 0; background: var(--c-page); color: var(--c-text); font: 16px/1.5 var(--font); }
a { color: var(--c-link) }
:focus-visible { outline: 3px solid var(--c-focus); outline-offset: 2px }
.sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip-path: inset(50%); white-space: nowrap }
.skip { position:absolute; left:-9999px } .skip:focus { left:16px; top:8px; z-index:20; background:var(--c-card); padding:8px }
h1 { font-size: 26px; line-height: 32px; margin: 0; text-wrap: balance }
h2 { font-size: 21px; line-height: 28px; margin: 0 0 12px; text-wrap: balance }
h3 { font-size: 18px; line-height: 24px; margin: 0 0 8px }
@media (min-width: 1024px) { h1 { font-size: 34px; line-height: 40px } h2 { font-size: 26px; line-height: 32px } body { font-size: 17px } }
.lead { color: var(--c-text-2); margin: 4px 0 0 }

/* Sidehoved og menu */
.site-header { position: sticky; top: env(safe-area-inset-top, 0px); z-index: 10; background: var(--c-header); color: #fff; border-bottom: var(--header-border) }
.site-header :focus-visible { outline-color: var(--c-focus-on-dark) }
.bar { max-width: 1200px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 12px; height: 56px; padding-inline: 16px }
.logo { display: inline-flex; align-items: center; min-height: 44px } .logo img { display: block; height: 30px; width: auto; max-width: 100% }
.theme-toggle { flex:0 0 44px; margin-left:auto; min-width:44px; min-height:44px; border:0; border-radius:8px; background:transparent; color:#fff; font:inherit; font-size:24px; cursor:pointer }
.theme-toggle[hidden] { display:none }
.menu > summary { list-style: none; min-width: 44px; min-height: 44px; display: grid; place-items: center; cursor: pointer; font-size: 22px; color:#fff }
.menu summary::-webkit-details-marker { display: none }
.menu[open] .mobile-menu { position: absolute; inset-inline: 0; top: 100%; background: var(--c-card); color: var(--c-text); box-shadow: 0 4px 12px var(--shadow); padding: 16px; display: grid; max-height: calc(100dvh - 56px); overflow-y: auto }
.menu nav a { color: var(--c-text); text-decoration: none; min-height: 44px; display: flex; align-items: center; padding-inline: 12px; border-radius: 8px }
.menu nav a:hover { background: var(--c-card-alt) }
.menu nav a[aria-current="page"] { background: var(--c-highlight); font-weight: 700 }
.nav { display: none }
@media (min-width: 1024px) {
  .menu { display: none }
  .nav { display: flex; align-items: center; gap: 2px }
  .nav a { display: flex; align-items: center; min-height: 44px; padding: 10px; border-radius: 8px; color: #fff; text-decoration: none; font-size: 14px; white-space: nowrap }
  .nav a[aria-current="page"] { background: var(--c-menu-hover); font-weight: 700 }
}
@media (hover: hover) and (min-width: 1024px) { .nav a:hover { background: var(--c-menu-hover) } }

/* Layout: mobile-first én kolonne; fra 1024 px hovedkolonne + 300 px sidekolonne. */
.wrap { max-width: 1200px; margin: 0 auto; padding: 16px 16px 48px; display: grid; gap: 24px; grid-template-columns: minmax(0, 1fr) }
@media (min-width: 1024px) { .wrap--side { grid-template-columns: minmax(0,1fr) 300px; align-items: start } .side { position: sticky; top: 72px; display: grid; gap: 16px } }
@media (max-width: 1023px) { .side { display: none } }
main { min-width: 0; display: grid; gap: 24px; grid-template-columns: minmax(0, 1fr) }
.crumbs { font-size: 14px; color: var(--c-text-2) } .crumbs a { color: var(--c-text-2) }

/* Kort, tabeller, formularer */
.card { background: var(--c-card); border: 1px solid var(--c-line); border-radius: 12px; padding: 16px; box-shadow: 0 1px 2px var(--shadow); min-width: 0 }
.table-wrap { overflow-x: auto; border: 1px solid var(--c-line); border-radius: 12px; background: var(--c-card) }
table { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums }
th, td { padding: 10px 12px; text-align: left; border-bottom: 1px solid var(--c-line); white-space: nowrap }
thead th { font-size: 14px; color: var(--c-text-2); background: var(--c-card-alt) }
.form { display: grid; gap: 14px; max-width: 520px }
select,input[type=email],input[type=number],input[type=text],input[type=search]{font:inherit;min-height:44px;padding:8px 12px;border:1px solid var(--c-control-line);border-radius:8px;background:var(--c-card);color:var(--c-text);max-width:100%}
input::placeholder{color:var(--c-text-3)}
.btn { font: inherit; font-weight: 700; min-height: 44px; padding: 0 18px; border-radius: 8px; border: 0; background: var(--blue-600); color: #fff; cursor: pointer }
.btn--ghost { background: var(--c-card); color: var(--c-strong); border: 1px solid var(--c-control-line) }
.see-also ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 4px }
.see-also a { min-height: 44px; display: flex; align-items: center; font-weight: 600; text-decoration: none }

/* Sidefod */
.site-footer{background:var(--c-header);color:#fff;padding:32px 16px calc(48px + env(safe-area-inset-bottom,0px))}
.site-footer a{color:var(--blue-400);display:inline-flex;align-items:center;min-height:44px;font-size:14px}
.site-footer .cols{max-width:1200px;margin:0 auto;display:grid;gap:24px;grid-template-columns:repeat(2,minmax(0,1fr))}
.site-footer .cols>section{min-width:0}
@media(min-width:600px){.site-footer .cols{grid-template-columns:repeat(3,minmax(0,1fr))}}
.site-footer h2{font-size:18px;line-height:24px}
.site-footer ul{list-style:none;padding:0;margin:0;display:grid;gap:6px}
.site-footer p{max-width:1200px;margin:24px auto 0;color:var(--c-footer-text);font-size:14px}

/* Herunder: Calculus-komponenter (beregner, resultat, mellemregning, tiptekst). Tilføjes i C-01. */

/* Beregnere */
.calculator-group { display:grid; gap:24px; min-width:0 }
.calculator { display:grid; gap:20px }
.calculator-heading { position:relative; min-width:0 }
.calculator-heading h2 { margin-bottom:12px }
.field { display:grid; gap:6px; min-width:0 }
.field > label { font-weight:600 }
.input-unit { display:grid; grid-template-columns:minmax(0,1fr) minmax(76px,100px); gap:8px }
.input-unit input, .input-unit select { width:100%; min-width:0 }
.actions { display:flex; flex-wrap:wrap; gap:8px; align-items:center }
.btn:disabled { cursor:wait; opacity:.65 }
.field-error, .connection-error { color:var(--c-error); margin:0 }
.calculator-result { min-width:0; min-height:140px; overflow-wrap:anywhere; padding-top:16px; border-top:1px solid var(--c-line) }
.result-number { font-size:26px; font-weight:700; margin:0; font-variant-numeric:tabular-nums }
.result-values--stale { color:var(--c-text-2) }
.stale-message { color:var(--c-text-2); margin:0 0 12px }
.calculator--incomplete .stale-message[hidden] { display:block }
.calculator--edited .result-values { color:var(--c-text-2) }
.steps { margin-top:16px }
.steps summary { cursor:pointer; min-height:44px; display:flex; align-items:center; font-weight:600 }
.steps ol { padding-left:24px; margin:8px 0 }
.steps li { margin:8px 0; overflow-wrap:anywhere }
.tooltip-anchor { display:inline }
.tooltip { display:none; position:absolute; z-index:5; left:0; top:100%; width:240px; max-width:100%; overflow-wrap:anywhere; padding:12px; border:1px solid var(--c-line); border-radius:8px; background:var(--c-card); color:var(--c-text); box-shadow:0 4px 12px var(--shadow); font:14px/1.5 var(--font) }
.tooltip-anchor:hover .tooltip, .tooltip-anchor:focus-within .tooltip, .tooltip--open { display:block }
.tooltip--dismissed { display:none !important }
.explanation-toggle, .reconnect { justify-self:start }
.content-text { margin:0; overflow-wrap:anywhere }
.page-list { margin:0; padding-left:20px }
.page-list a { display:inline-flex; min-height:44px; align-items:center }
.input-unit--plain { grid-template-columns:minmax(0,1fr) }
.unit-label { display:flex; align-items:center; overflow-wrap:anywhere }
.calculator-note { margin:0; color:var(--c-text-2) }
.result-label { margin:12px 0 4px; font-weight:600 }
.crumbs a { display:inline-flex; align-items:center; min-height:24px }
.consent-box { position:fixed; z-index:30; inset-inline:16px; bottom:16px; max-width:560px; margin-inline:auto; display:grid; gap:12px; max-height:calc(100dvh - 32px); overflow:auto }
.consent-box[hidden] { display:none }
.consent-box h2, .consent-box p { margin:0 }
@media (max-width:599px) {
  .consent-box { padding:10px; gap:6px; max-height:160px; font-size:13px; line-height:1.3 }
  .consent-box h2 { font-size:16px }
  .consent-box .actions { gap:8px }
  .consent-box .btn { min-height:44px; padding:8px 12px }
}
.figure { margin:16px 0 0 }
.figure svg { display:block; width:100%; max-width:340px; height:auto; overflow:visible }
.figure .shape { fill:var(--c-highlight); stroke:var(--c-strong-alt); stroke-width:2; stroke-linejoin:round }
.figure .mark { fill:none; stroke:var(--c-strong-alt); stroke-width:1.5 }
.figure .mark--dashed { stroke-dasharray:5 4 }
.figure .shape--light { fill:var(--c-card-alt) }
.figure .dot { fill:var(--c-strong-alt) }
.figure text { fill:var(--c-text); font:600 14px var(--font) }
.figure .answer { fill:var(--c-link) }
.figure figcaption { color:var(--c-text-2); font-size:14px; margin-top:4px }
@media (min-width:1024px) {
  .calculator { grid-template-columns:minmax(0,1fr) minmax(0,1fr); column-gap:24px; align-items:start }
  .calculator > .calculator-heading { grid-column:1 / -1 }
  .calculator-result { min-height:0; padding:0 0 0 24px; border-top:0; border-left:1px solid var(--c-line); align-self:stretch }
}
h1, h2 { overflow-wrap: break-word }
@media (max-width: 359px) { h1 { font-size: 22px; line-height: 28px } }
.field-help { margin:0; font-size:15px; line-height:21px; color:var(--c-text-2) }
.site-footer .footer-links { display:flex; flex-wrap:wrap; gap:4px 24px; max-width:1200px; margin:0 auto }
.site-footer .footer-consent { margin-top:64px }
.site-footer .footer-bottom { max-width:1200px; margin:24px auto 0; display:grid; gap:24px; align-items:start }
@media (min-width:600px) { .site-footer .footer-bottom { grid-template-columns:repeat(2,minmax(0,1fr)) } }
.site-footer .footer-bottom p, .site-footer .footer-network h2 { margin:0 }
.site-footer .footer-network li { color:var(--c-footer-text); font-size:14px }
.site-footer .footer-network ul ul { padding-left:16px }
:root { --c-chart-bar:#6F87A8; --c-chart-line:#0B1F3A; --c-chart-line-2:#C2410C }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { --c-chart-bar:#5B7499; --c-chart-line:#7DB4FB; --c-chart-line-2:#FDBA74 } }
:root[data-theme="dark"] { --c-chart-bar:#5B7499; --c-chart-line:#7DB4FB; --c-chart-line-2:#FDBA74 }
.timeline-chart { margin:16px 0 0 }
.chart { display:grid; grid-template-columns:auto minmax(0,1fr); grid-template-rows:200px 24px; column-gap:8px; padding:8px 14px 0 0 }
@media (min-width:768px) { .chart { grid-template-rows:260px 24px } }
.chart-y { grid-row:1; grid-column:1; position:relative; min-width:52px; font-size:12px; color:var(--c-text-2) }
.chart-y span { position:absolute; right:0; transform:translateY(-50%); white-space:nowrap; font-variant-numeric:tabular-nums }
.chart-plot { grid-row:1; grid-column:2; display:block; width:100%; height:100%; overflow:visible }
.chart-plot .grid { stroke:var(--c-line); stroke-width:1 }
.chart-plot .column { fill:var(--c-chart-bar) }
.chart-plot .line, .chart-plot .line-2 { fill:none; stroke-width:3; stroke-linejoin:round }
.chart-plot .line { stroke:var(--c-chart-line) }
.chart-plot .line-2 { stroke:var(--c-chart-line-2); stroke-dasharray:8 5 }
.chart-x { grid-row:2; grid-column:2; position:relative; font-size:12px; color:var(--c-text-2) }
.chart-x span { position:absolute; top:4px; transform:translateX(-50%); white-space:nowrap }
.timeline-chart figcaption { display:flex; flex-wrap:wrap; align-items:center; gap:4px 16px; margin-top:8px; font-size:14px; color:var(--c-text-2) }
.legend { display:inline-flex; align-items:center; gap:8px; white-space:nowrap }
.key { display:inline-block; width:14px; height:14px; border-radius:2px }
.key--bar { background:var(--c-chart-bar) }
.key--line { height:3px; background:var(--c-chart-line) }
.key--line-2 { width:18px; height:3px; background:repeating-linear-gradient(90deg, var(--c-chart-line-2) 0 8px, transparent 8px 12px) }
.timeline { margin-top:16px; min-width:0 }
.timeline summary { cursor:pointer; min-height:44px; padding-top:10px; font-weight:600 }
.timeline .table-wrap { margin-top:8px }
.timeline th, .timeline td { padding:8px 10px; font-size:15px }
.timeline .num { text-align:right }
.topics h2, .tool-group h2 { margin:28px 0 12px }
.topic-list, .tool-list { list-style:none; margin:0; padding:0; display:grid; gap:12px }
.topic-list { grid-template-columns:repeat(2,minmax(0,1fr)) }
.topic-list li, .tool-list li { background:var(--c-card); border:1px solid var(--c-line); border-radius:12px; padding:10px 14px; min-width:0 }
.topic-list a, .tool-list a { display:inline-flex; align-items:center; min-height:44px; min-width:44px; font-weight:700; overflow-wrap:anywhere }
.topic-list a { font-size:18px }
.topic-list p, .tool-list p { margin:0; color:var(--c-text-2); font-size:15px; line-height:21px }
@media (min-width:768px) { .topic-list { grid-template-columns:repeat(3,minmax(0,1fr)) } .tool-list { grid-template-columns:repeat(2,minmax(0,1fr)) } }
.search { display:grid; gap:6px; margin:20px 0 8px; max-width:640px }
.search label { font-weight:600 }
.search-row { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px }
.search input { width:100%; min-height:48px; font-size:17px }
.search .btn { min-height:48px }
.search-count { color:var(--c-text-2); margin:8px 0 0 }
.search-results h2, .search-results h3 { margin:24px 0 12px }
.task-list { list-style:none; margin:0; padding:0; display:grid; gap:12px }
.task-list li { background:var(--c-card); border:1px solid var(--c-line); border-radius:12px; padding:12px 14px; min-width:0 }
.task-list h2, .task-list h3, .task-list h4 { margin:0; font-size:18px; line-height:24px }
.task-list p { margin:4px 0 0; color:var(--c-text-2); font-size:15px; line-height:21px }
.task-list .task-tools { color:var(--c-text) }
.task-tools a { display:inline-flex; align-items:center; min-height:44px }
.header-search { display:none }
@media (min-width:1024px) {
  .header-search { display:block; position:relative; margin-left:auto; width:min(280px,30vw) }
  .header-search + .theme-toggle { margin-left:8px }
  .header-search input { width:100%; min-height:40px; padding:6px 12px; border-radius:8px; border:1px solid var(--c-control-line); background:var(--c-card); color:var(--c-text); font:inherit; font-size:15px }
  .header-suggest { position:absolute; right:0; top:calc(100% + 8px); width:420px; max-width:calc(100vw - 32px); max-height:calc(100dvh - 80px); overflow-y:auto; background:var(--c-card); color:var(--c-text); border:1px solid var(--c-line); border-radius:12px; box-shadow:0 8px 24px var(--shadow); padding:8px 12px 12px; z-index:30; font-size:15px }
  .header-search:not(:focus-within) .header-suggest { display:none }
  .header-suggest h2 { font-size:13px; line-height:18px; margin:10px 0 4px; color:var(--c-text-2); text-transform:uppercase; letter-spacing:.04em }
  .header-suggest ul { list-style:none; margin:0; padding:0 }
  .header-suggest li a { display:block; min-height:44px; padding:8px; border-radius:8px; color:var(--c-text); text-decoration:none }
  .header-suggest li a:hover, .header-suggest li a:focus-visible { background:var(--c-card-alt) }
  .header-suggest li a strong { display:block; color:var(--c-link) }
  .header-suggest li a span { color:var(--c-text-2); font-size:14px; line-height:19px }
  .header-suggest-all { display:inline-flex; align-items:center; min-height:44px; margin-top:4px }
  .header-suggest-status { color:var(--c-text-2); font-size:13px; margin:4px 0 0 }
}
.investment .examples { display:flex; flex-wrap:wrap; gap:8px }
.investment .examples .calculator-note { flex-basis:100%; margin:0 }
.periods-heading { margin:8px 0 0; font-size:20px; line-height:26px }
.period { display:grid; gap:10px; border:1px solid var(--c-line); border-radius:12px; padding:12px 14px; background:var(--c-card-alt); min-width:0 }
.period h3 { margin:0; font-size:17px; line-height:24px }
.period h3 span { font-weight:400; color:var(--c-text-2); font-size:15px }
.period-more summary { cursor:pointer; min-height:44px; display:flex; align-items:center; font-weight:600 }
.period-more[open] summary { margin-bottom:8px }
.period-remove, #investment-add-period { justify-self:start }
.total-years { margin:0 }
.investment .split { color:var(--c-text-2); margin:8px 0 0 }
.cheapest-power { grid-template-columns:minmax(0,1fr); padding:16px; border:1px solid var(--c-line); border-radius:12px; background:var(--c-card); align-items:start }
.cheapest-power .form { display:grid; gap:16px; min-width:0; max-width:none }
.cheapest-power fieldset { min-width:0; margin:0; padding:0; border:0 }
.cheapest-power legend { font-weight:600; margin-bottom:8px }
.power-mode label { display:flex; align-items:center; gap:8px; min-height:44px }
.power-mode input { accent-color:var(--c-link); flex-shrink:0 }
.power-unit { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px; align-items:center }
.power-pair { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px }
.power-pair > div { min-width:0 }
.cheapest-power input[type=text], .cheapest-power input[type=time], .cheapest-power select { width:100%; min-width:0 }
.cheapest-power input[type=time] { font:inherit; min-height:44px; padding:8px; border:1px solid var(--c-control-line); border-radius:8px; background:var(--c-card); color:var(--c-text) }
.power-options summary, .power-prices summary { cursor:pointer; min-height:44px; align-content:center }
.power-options .field { margin:12px 0 }
.power-headline { font-weight:600 }
.power-chart { display:block; width:100%; height:auto; margin:16px 0 }
.power-bar { fill:var(--c-line) }
.power-bar.chosen { fill:var(--c-link) }
.power-zero { stroke:var(--c-text-3); stroke-width:1 }
.power-chart text { fill:var(--c-text-2); font-size:16px }
.power-table { max-width:100%; overflow-x:auto }
.power-table table { width:100%; font-size:14px }
.power-table th, .power-table td { padding:8px 4px; text-align:left; border-bottom:1px solid var(--c-line) }
@media (min-width:1024px) {
  .cheapest-power { grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px }
  .cheapest-power > .calculator-result { border-top:0; border-left:1px solid var(--c-line); padding:0 0 0 24px }
}
.chart-plot .boundary { stroke:var(--c-text-3); stroke-width:1; stroke-dasharray:4 4 }
.key--boundary { width:2px; height:14px; background:var(--c-text-3) }
/* Investeringsplan til udskrift og PDF (C-20) */
.print-only { display:none }
.plan-text ul { margin:4px 0 8px; padding-left:22px }
.plan-text p { margin:8px 0 }
.plan .actions { margin-top:12px }
@media print {
  :root, :root:not([data-theme="light"]), :root[data-theme="dark"] { --c-page:#FFFFFF; --c-card:#FFFFFF; --c-card-alt:#F3F7FB; --c-line:#DDE6EF; --c-text:#0F172A; --c-text-2:#475569; --c-text-3:#64748B; --c-link:#2563EB; --c-strong:#0B1F3A; --c-chart-bar:#6F87A8; --c-chart-line:#0B1F3A; --c-chart-line-2:#C2410C; --shadow:transparent; color-scheme:light }
  @page { size:A4; margin:0 }
  body { font-size:10.5pt; line-height:1.45; print-color-adjust:exact; -webkit-print-color-adjust:exact }
  .print-only { display:block }
  .screen-only, .skip, .site-header, .side, .site-footer, .consent-box, body:has(.plan) main > :not(.investment),
  .investment > :not(.calculator-result), .stale-message, .plan .timeline { display:none }
  .wrap, .wrap--side { display:block; max-width:none; padding:0; margin:0 }
  .investment { display:block; border:0; padding:0; box-shadow:none; background:none }
  .investment .calculator-result { border:0; padding:0; min-height:0 }
  .plan { padding:16mm 14mm; box-decoration-break:clone; -webkit-box-decoration-break:clone }
  .plan-brand { margin:0; font-weight:700; color:var(--c-link) }
  .plan-title { margin:2mm 0 1mm; font-size:22pt; line-height:1.2; font-weight:700 }
  .plan-date { margin:0; color:var(--c-text-2) }
  .plan h3 { margin:6mm 0 2mm; padding-bottom:1mm; font-size:13pt; border-bottom:1px solid var(--c-line) }
  .plan-summary { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:8mm; break-inside:avoid }
  .plan-summary .result-number { font-size:15pt }
  .plan-summary .result-label { margin:3mm 0 0 }
  .plan-graph .timeline-chart { margin:6mm 0 0 }
  .plan-graph .chart { grid-template-rows:55mm 18px; padding-right:4mm }
  .plan-graph .chart-y, .plan-graph .chart-x, .plan-graph figcaption { font-size:8pt }
  .plan-tables { display:grid; grid-template-columns:minmax(0,2fr) minmax(0,3fr); gap:8mm; break-inside:avoid }
  .plan-table th, .plan-table td { padding:0.7mm 2mm; font-size:9.5pt; line-height:1.25 }
  .plan-table thead th { font-size:8.5pt }
  .plan-table .num { text-align:right }
  .plan-years { break-before:page }
  .plan-years h3 { margin-top:0 }
  .plan-years tr { break-inside:avoid }
  .plan .calculator-note, .plan-url { margin:4mm 0 0; font-size:9pt; color:var(--c-text-2) }
}
/* Investeringsberegneren på desktop: indtastning til venstre, resultat til højre (C-22, forslag A) */
#investment-result-heading { scroll-margin-top:72px }
@media (min-width:1024px) {
  .investment > .examples { grid-column:1; grid-row:1 }
  .investment > .form { grid-column:1; grid-row:2; max-width:none }
  .investment > .calculator-result { grid-column:2; grid-row:1 / span 2 }
  .investment .field { grid-template-rows:auto 1fr auto }
  .investment .period { grid-template-columns:repeat(2,minmax(0,1fr)); column-gap:16px }
  .investment .period > h3 { grid-column:1; align-self:center }
  .investment .period > .period-more { grid-column:1 / -1 }
  .investment .period > .period-remove { grid-column:2; grid-row:1; justify-self:end; min-height:40px }
}