/* ============================================================================
   aktieterminalen.dk — design system
   Version 3 (28.09.2026): navy, kobolt og is

   Ren CSS. Intet framework, intet build-step. Indlæses i base.html,
   base_public.html og /_design EFTER fonts.css.

   Denne fil er SANDHEDEN for app-fladens udseende. Version 3 følger Lars's
   designhandoff (Dashboard.dc.html, 28.09.2026) og afløser v2.1's skovgrønne
   og lime visuelle regler (palet, kort med streg, swoosh-logo, stiplede
   grafer). DESIGNKONTRAKT.md tillæg 28.09.2026 (v3) beskriver skiftet.
   Ændringer i tokens kræver fortsat eksplicit besked fra Lars.

   HVAD ER ÆNDRET FRA v2.1
   1. Palet: navy-sidebar og mørke flader, kobolt til brand, links og "op",
      is (#9fe4ff) KUN til handling (primærknap, "Nu"-markør). App-baggrund
      #eef1f7, kort hvide.
   2. Kort har SKYGGE, ikke streg (handoffens "kort bruger skygge, ikke
      kant"). Skygger og toninger bor KUN i denne fil, aldrig inline i HTML:
      Factor Lab-testene forbyder ordene box-shadow og gradient i sidens HTML.
   3. Typografi: fire størrelser, 13 meta, 14 brød, 16 korttitler og
      fremhævet, 24 sidetitler og store tal. Linjehøjde 1,55. Sidebaren
      bruger 15px og Pro-mærket i navigationen 12px, som i handoffen.
   4. Grafer: fuldt optrukket kobolt linje (2px), fladt fyld med 7 % kobolt,
      tre HTML-gitterlinjer med etiketter til højre, ingen halo-prik, ingen
      gradient, ingen tooltip (tillæg 5 gælder stadig).
   5. Logo: søjlemærket (_logomark.html) afløser swooshen.
   6. Footeren (_footer.html, byte-identisk markup) er navy på de offentlige
      sider og en rolig lys blok under indholdet i appen, så den navy sidebar
      forbliver appens eneste mørke flade.
   7. Ét brudpunkt (900px): sidebaren bliver en skuffe bag en sticky topbar.

   HVAD ER UÆNDRET (ærlighedsreglerne)
   - Kildelinjen (.at-prov) er altid synlig, aldrig et tooltip: kilde,
     serie-id, Periode og Hentet på hver værdi.
   - Grå tekst er aldrig federe end 500.
   - Retning: kobolt op, ler ned, grå uændret. Kun som tekstfarve, aldrig som
     flade, aldrig rød eller grøn. Farven siger bevægelse, ikke godt eller
     skidt.
   - role="img" er forbeholdt grafer. Ikoner og sparklines er aria-hidden.
   - Ingen eksterne assets: filen har ingen billed- eller font-URL'er (de
     selvhostede fonte bor i fonts.css under /static). Ikoner er inline SVG
     med aria-hidden; flueben i lister er tegnet med kanter.

   WCAG AA (D8, målt 28.09.2026 med WCAG 2.x-formlen)
   Handoffens metatekst #6b7288 består på hvidt (4,79:1), men dumper på
   app-baggrunden #eef1f7 (4,23:1) og felter #f2f4f9 (4,35:1). Ler #b4623f
   dumper som tekst på hvidt (4,41:1), og grå #8e94a4 som tekst (3,03:1).
   Rettet med mindst mulig mørkning i samme kulør (mål >= 4,6:1):
     --at-meta-2   #666c81   4,61 på #eef1f7 · 4,74 på #f2f4f9 · 4,83 på #f5f6fa
     --at-clay-ink #af603d   4,60 på #ffffff (ned-tekst)
     --at-clay-ink-2 #9f5738 4,61 på #f7ebe5 (foreløbig-mærket) · 5,39 på hvidt
     Uændret-tekst bruger --at-meta (#6b7288, 4,79 på hvidt).
   Kontrollerede par (uændret værdi): kobolt på hvidt 6,10 og på #eef1f7
   5,39; #d3d9f0 på #16246a 10,00; #9fe4ff på #16246a 10,05; #aab4d6 på
   #0f1c55 7,75 og på #0b1540 8,54; #8e9ad0 på #0b1540 6,43; #0b1540 på
   #9fe4ff 12,56; #5d6477 på #f2f4f9 5,37; #1a2a7a på #eef1fb 11,24.
   Farver under 4,5:1 (#8e94a4, #b4623f, #9fb0f7, #c8d2fb) bruges kun til
   streger, flader og ikoner, aldrig til brødtekst.

   MØRK TILSTAND er ikke designet. Implementér den ikke uopfordret.

   SKRIFT — Instrument Sans er SELVHOSTET (fonts.css, wght 400-700, normal og
   kursiv, latin og latin-ext, OFL-licensen ved siden af). Google Fonts-links
   er permanent forkastet (privatlivspræmissen og testene om lokale assets).
   ========================================================================= */

:root {
  color-scheme: light;

  /* Navy, dybeste til lyseste */
  --at-navy-950: #0b1540;   /* footer, tekst på is */
  --at-navy-900: #0f1c55;   /* sidebar, mobilbar, mørke kort */
  --at-navy-800: #16246a;   /* gruppefelter i sidebaren, menuknap */
  --at-navy-700: #1a2a7a;   /* valgt chip, tekst på lyseblå, hover i sidebaren */
  --at-navy-600: #24358f;   /* aktivt nav-punkt, Pro-mærke i sidebaren */

  /* Brand og handling */
  --at-cobalt: #3150e8;     /* brand, links, "op", graflinje */
  --at-ice: #9fe4ff;        /* KUN handling og "Nu"-markør */
  --at-ice-hover: #8fdcfb;
  --at-on-ice: #0b1540;

  /* Blå trin (grafserier, regimer, toner) */
  --at-blue-400: #6f86f0;
  --at-blue-300: #9fb0f7;
  --at-blue-200: #c8d2fb;
  --at-blue-100: #e3e8fd;
  --at-blue-050: #eef1fb;
  --at-blue-now: #dfe5fc;   /* aktiv kvadrant */

  /* Retning. Kun som tekst- og stregfarve. */
  --at-clay: #b4623f;       /* streger, grafer */
  --at-clay-ink: #af603d;   /* ned-tekst på hvidt (AA, se D8) */
  --at-clay-ink-2: #9f5738; /* tekst på ler-tone (AA) */
  --at-clay-soft: #f7ebe5;
  --at-grey: #8e94a4;       /* uændret som streg; tekst bruger --at-meta */

  /* Blæk */
  --at-ink: #12162a;
  --at-meta: #6b7288;       /* metatekst på hvide flader */
  --at-meta-2: #666c81;     /* metatekst på #eef1f7, #f2f4f9 og #f5f6fa (AA) */
  --at-ink-soft: #5d6477;   /* inaktiv fane og segment */
  --at-ink-chip: #3d4660;   /* chip-tekst, fra */

  /* Tekst på navy */
  --at-on-navy: #eef1fb;
  --at-on-navy-2: #aab4d6;
  --at-nav-off: #d3d9f0;
  --at-nav-icon-off: #8e9ad0;
  --at-on-navy-body: #c9d0ea;

  /* Flader. Navnene --at-canvas, --at-canvas-2 og --at-surface refereres fra
     markup og web/charts.py og må ikke omdøbes. */
  --at-canvas: #eef1f7;     /* app-baggrund */
  --at-canvas-2: #f2f4f9;   /* felter, chips, spor */
  --at-surface: #ffffff;
  --at-land-bg: #f5f6fa;    /* offentlig flade */
  --at-row-hover: #fafbfd;

  /* Skillelinjer */
  --at-line: #eef0f5;       /* tabelhoved, gitterlinjer */
  --at-line-row: #f3f4f8;   /* rækker */
  --at-line-2: #e1e5ef;     /* spor, felter */
  --at-line-tab: #e3e6ef;   /* fanebjælke */

  /* Statusmærker (D9) */
  --at-prelim: var(--at-clay-ink-2);
  --at-prelim-soft: var(--at-clay-soft);
  --at-derived: var(--at-navy-700);
  --at-derived-soft: var(--at-blue-050);
  --at-delay: var(--at-ink-soft);
  --at-delay-soft: var(--at-canvas-2);

  /* Advarsel uden alarmfarve (handoffens pladsholder-toner) */
  --at-warn: #7a4e06;
  --at-warn-soft: #fdf0d2;

  /* Grafer. --at-chart-line refereres fra web/charts.py (navnet består). */
  --at-chart-line: #3150e8;
  --at-chart-s1: #1a2a7a;
  --at-chart-s2: #3150e8;
  --at-chart-s3: #9fb0f7;
  --at-chart-grid: #eef0f5;
  --at-chart-axis: #6b7288;

  /* Regimefarver, fast rækkefølge */
  --at-regime-1: #1a2a7a;   /* vækst op, inflation ned */
  --at-regime-2: #3150e8;   /* vækst op, inflation op */
  --at-regime-3: #9fb0f7;   /* vækst ned, inflation ned */
  --at-regime-4: #c8d2fb;   /* vækst ned, inflation op */

  /* Radius */
  --at-r-panel: 16px;
  --at-r-card: 12px;
  --at-r-input: 12px;
  --at-r-sm: 10px;
  --at-r-xs: 8px;
  --at-r-pill: 999px;

  /* Skygger. Kun her, aldrig inline. */
  --at-shadow-card: 0 1px 2px rgba(15, 28, 85, 0.06), 0 10px 28px -14px rgba(15, 28, 85, 0.2);
  --at-shadow-lg: 0 2px 6px rgba(15, 28, 85, 0.06), 0 30px 70px -36px rgba(15, 28, 85, 0.4);
  --at-shadow-hero: 0 2px 6px rgba(15, 28, 85, 0.08), 0 50px 100px -40px rgba(0, 0, 0, 0.55);
  --at-shadow-dark: inset 0 1px 0 rgba(255, 255, 255, 0.06), 0 26px 56px -26px rgba(0, 0, 0, 0.6);
  --at-shadow-cta: 0 8px 22px -10px rgba(80, 170, 230, 0.8);
  --at-shadow-pop: 0 2px 6px rgba(15, 28, 85, 0.1), 0 24px 50px -18px rgba(0, 0, 0, 0.5);
  --at-shadow-seg: 0 1px 3px rgba(15, 28, 85, 0.15);
  --at-shadow-float: 0 1px 2px rgba(15, 28, 85, 0.06), 0 8px 20px -12px rgba(15, 28, 85, 0.2);
  --at-shadow-raise: 0 1px 2px rgba(15, 28, 85, 0.08);
  --at-ring-edit: 0 0 0 2px #c8d2fb, 0 10px 28px -14px rgba(15, 28, 85, 0.2);
  --at-ring-pick: 0 0 0 3px #3150e8;

  /* Spacing. Navnene --at-s1..s9 bruges inline i ca. 30 skabeloner. */
  --at-s1: 4px; --at-s2: 6px; --at-s3: 8px; --at-s4: 12px; --at-s5: 16px;
  --at-s6: 20px; --at-s7: 24px; --at-s8: 32px; --at-s9: 48px;
  --at-gap: 14px;

  /* Typografi: fire størrelser i appen */
  --at-font: "Instrument Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --at-fs-meta: 13px;
  --at-fs-body: 14px;
  --at-fs-title: 16px;
  --at-fs-display: 24px;
  --at-fs-nav: 15px;        /* kun sidebaren, som i handoffen */
  --at-fs-navbadge: 12px;   /* kun Pro-mærket i navigationen */
  --at-tight: -0.02em;
  --at-tighter: -0.025em;

  /* Tæthed */
  --at-row-h: 44px;
  --at-card-pad: 16px 18px;
  --at-sidebar-w: 240px;
  --at-page-max: 1320px;
}

/* ---------------------------------------------------------------------------
   Base
   ------------------------------------------------------------------------ */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
html, body { min-height: 100%; }
body {
  margin: 0; background: var(--at-canvas); color: var(--at-ink);
  font-family: var(--at-font); font-size: var(--at-fs-body); line-height: 1.55;
  -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;
}
h1, h2, h3, h4 { margin: 0; font-weight: 600; letter-spacing: var(--at-tight); line-height: 1.3; }
h1 { font-size: var(--at-fs-display); letter-spacing: var(--at-tighter); }
h2 { font-size: var(--at-fs-title); }
h3 { font-size: var(--at-fs-body); }
h4 { font-size: var(--at-fs-meta); }
p { margin: 0; }
ul, ol { margin: 0; }
a { color: var(--at-cobalt); text-decoration: none; }
a:hover { opacity: 0.85; }
button, input, select, textarea { font-family: inherit; font-size: inherit; }
summary { cursor: pointer; }
details > summary { list-style: none; color: var(--at-cobalt); font-weight: 500; }
details > summary::-webkit-details-marker { display: none; }
svg { flex-shrink: 0; }
.at-num { font-variant-numeric: tabular-nums; }
.at-muted { color: var(--at-ink-soft); font-weight: 400; }
.at-faint { color: var(--at-meta-2); font-weight: 400; }
/* Fladeuafhængige metaklasser bruger --at-meta-2 (AA på hvidt, #eef1f7,
   #f2f4f9, #f5f6fa og #eef1fb); #6b7288 består kun på hvidt (D8). */
.at-meta { font-size: var(--at-fs-meta); color: var(--at-meta-2); font-weight: 400; }
.at-sronly {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

/* Fokus. Handoffen har ingen fokusring; en synlig ring er et AA-krav. */
:focus-visible { outline: 2px solid var(--at-cobalt); outline-offset: 2px; border-radius: 4px; }

/* ---------------------------------------------------------------------------
   App-skal: navy sidebar, hovedflade #eef1f7
   ------------------------------------------------------------------------ */
.at-app { display: flex; min-height: 100vh; background: var(--at-canvas); }
.at-sidebar {
  position: sticky; top: 0; z-index: 50;
  flex: 0 0 var(--at-sidebar-w); width: var(--at-sidebar-w); height: 100vh;
  display: flex; flex-direction: column;
  padding: 20px 12px 16px;
  background: var(--at-navy-900); color: var(--at-on-navy);
  overflow-y: auto; overscroll-behavior: contain;
  scrollbar-width: thin; scrollbar-color: var(--at-navy-600) transparent;
}
.at-sidebar :focus-visible,
.at-mobilebar :focus-visible,
.at-footer :focus-visible,
.at-hero-dark :focus-visible { outline-color: var(--at-ice); }
.at-sidebar__top { display: flex; align-items: center; gap: 10px; padding: 0 12px; min-height: 25px; }
.at-brand { display: inline-flex; align-items: center; gap: 10px; color: inherit; }
.at-brand:hover { opacity: 1; }
.at-logomark { display: block; width: 20px; height: 20px; flex: 0 0 20px; color: currentColor; }
.at-wordmark { font-size: var(--at-fs-title); font-weight: 600; letter-spacing: 0; color: inherit; line-height: 1.55; }
.at-beta {
  margin-left: auto; display: inline-flex; align-items: center;
  padding: 1px 8px; border-radius: var(--at-r-pill);
  font-size: var(--at-fs-navbadge); font-weight: 500; line-height: 1.55;
  background: var(--at-navy-800); color: var(--at-on-navy-2);
}

/* Navigation: grupper i tonede felter */
.at-nav { flex: 1 0 auto; display: flex; flex-direction: column; margin-top: 6px; }
.at-navgroup {
  display: flex; flex-direction: column; gap: 2px;
  margin-top: 12px; padding: 8px;
  border-radius: 14px; background: var(--at-navy-800);
}
.at-navlabel { padding: 4px 10px 6px; font-size: var(--at-fs-meta); font-weight: 600; color: var(--at-ice); line-height: 1.55; }
.at-navlink {
  display: flex; align-items: center; gap: 11px;
  min-height: 37px; padding: 7px 10px;
  border-radius: var(--at-r-sm);
  font-size: var(--at-fs-nav); font-weight: 400; line-height: 1.55;
  color: var(--at-nav-off);
  transition: background 0.12s ease, color 0.12s ease;
}
.at-navlink svg { width: 18px; height: 18px; flex: 0 0 18px; color: var(--at-nav-icon-off); }
.at-navlink:hover { background: var(--at-navy-700); color: var(--at-on-navy); opacity: 1; }
.at-navlink.is-active,
.at-navlink.is-active:hover { background: var(--at-navy-600); color: #ffffff; font-weight: 600; }
.at-navlink.is-active svg { color: var(--at-ice); }
.at-navlink .at-badge--pro {
  margin-left: auto; height: auto; padding: 1px 8px;
  font-size: var(--at-fs-navbadge); font-weight: 600; line-height: 1.55;
  background: var(--at-navy-600); color: var(--at-ice);
}

/* Bundblok: kørselsstatus, track record, pakke, konto, log ud */
.at-sidefoot {
  display: flex; flex-direction: column; gap: 2px;
  margin-top: 18px; padding-top: 14px;
  border-top: 1px solid var(--at-navy-600);
}
.at-runbox {
  display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 6px;
  padding: 2px 12px 8px; font-size: var(--at-fs-meta); color: var(--at-on-navy-2);
}
.at-runbox__label { font-weight: 400; }
.at-runbox__value { font-weight: 500; color: var(--at-on-navy); font-variant-numeric: tabular-nums; }
.at-sidefoot__form { margin: 0; }
.at-sidefoot__link {
  display: flex; align-items: center; gap: 10px; width: 100%;
  padding: 8px 12px; border: 0; border-radius: var(--at-r-sm);
  background: transparent; color: var(--at-nav-off);
  font-family: inherit; font-size: var(--at-fs-nav); line-height: 1.55; text-align: left;
  cursor: pointer;
}
.at-sidefoot__link:hover { background: var(--at-navy-800); color: var(--at-on-navy); opacity: 1; }
.at-sidefoot__link.is-active { background: var(--at-navy-600); color: #ffffff; }
.at-sidefoot__mail {
  margin-left: auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  font-size: var(--at-fs-meta); color: var(--at-on-navy-2);
}
.at-sidefoot__plan { display: flex; align-items: center; gap: 10px; padding: 8px 12px; border-radius: var(--at-r-sm); }
.at-sidefoot__planlabel { font-size: var(--at-fs-meta); color: var(--at-on-navy-2); }
.at-sidefoot__plan .at-plan { margin-left: auto; }

/* Pakkemærke (Basis/Pro), fra faktisk_niveau */
.at-plan {
  display: inline-flex; align-items: center; white-space: nowrap;
  padding: 2px 10px; border-radius: var(--at-r-pill);
  font-size: var(--at-fs-meta); font-weight: 600; line-height: 1.55;
  background: var(--at-navy-600); color: var(--at-on-navy);
}
.at-plan--pro { background: var(--at-ice); color: var(--at-on-ice); }
.at-plan--none { background: transparent; color: var(--at-on-navy-2); box-shadow: inset 0 0 0 1px var(--at-navy-600); font-weight: 500; }

/* Mobil: sticky topbar med menuknap, skuffe og mørk baggrund (< 900px) */
.at-mobilebar {
  display: none; position: sticky; top: 0; z-index: 30;
  align-items: center; gap: 12px; height: 60px; padding: 0 16px;
  background: var(--at-navy-900); color: var(--at-on-navy);
}
/* Mærket er ren tekst: det må forkortes med "…", så pakkemærket bliver i
   topbaren ved 200 % zoom (195 CSS-px). display: block giver ellipsen. */
.at-mobilebar__brand {
  display: block; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  font-weight: 600; color: var(--at-on-navy);
}
.at-mobilebar__brand:hover { opacity: 1; }
.at-mobilebar .at-plan { margin-left: auto; }
.at-menubtn {
  display: inline-flex; align-items: center; justify-content: center;
  width: 44px; height: 44px; flex: 0 0 44px; padding: 0;
  border: 0; border-radius: var(--at-r-sm);
  background: var(--at-navy-800); color: var(--at-on-navy); cursor: pointer;
}
.at-menubtn svg { width: 20px; height: 20px; }
.at-backdrop { display: none; position: fixed; inset: 0; z-index: 40; background: rgba(11, 21, 64, 0.45); }
/* Skuffens egen lukkeknap: første element i skuffen (Tab-cyklussen starter her),
   kun synlig under 900px, hvor skuffen dækker topbarens menuknap. */
.at-drawerclose { display: none; }

/* Spring til indhold: skjult, til den får tastaturfokus (WCAG 2.4.1). */
.at-skip { position: absolute; left: -9999px; top: 0; }
.at-skip:focus {
  left: 16px; top: 16px; z-index: 100;
  padding: 8px 14px; border-radius: var(--at-r-pill);
  background: var(--at-ice); color: var(--at-on-ice); font-weight: 600;
}

/* Hovedflade og sidekolonne */
.at-main { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; background: var(--at-canvas); }
.at-page {
  flex: 1 0 auto; width: 100%;
  max-width: calc(var(--at-page-max) + 2 * clamp(16px, 3vw, 40px));
  margin: 0 auto;
  padding: clamp(18px, 3vw, 36px) clamp(16px, 3vw, 40px) 80px;
  display: flex; flex-direction: column; gap: var(--at-gap);
}
.at-page > * { min-width: 0; }

/* Sidehoved: titel, én sætning, meta til højre */
.at-pagehead { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 8px 20px; }
.at-pagehead__text { flex: 1 1 260px; min-width: 0; }
.at-pagehead__title {
  margin: 0; font-size: var(--at-fs-display); font-weight: 600;
  letter-spacing: var(--at-tighter); line-height: 1.55; text-wrap: balance;
}
.at-pagehead__lead { margin: 4px 0 0; color: var(--at-ink); text-wrap: pretty; }
.at-pagehead__date { color: var(--at-ink); }
.at-pagehead__meta {
  display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px;
  font-size: var(--at-fs-meta); color: var(--at-meta-2); font-variant-numeric: tabular-nums;
}
.at-pagehead__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }

/* Ældre sidehoved: bruges af de færdigbyggede artefakter (render_html,
   daily_brief), som ikke har app-skallet. */
.at-topbar {
  width: 100%; max-width: calc(var(--at-page-max) + 2 * clamp(16px, 3vw, 40px)); margin: 0 auto;
  display: flex; flex-wrap: wrap; align-items: flex-end; gap: 8px 20px;
  padding: clamp(18px, 3vw, 36px) clamp(16px, 3vw, 40px) 0;
}
.at-topbar h1 { font-size: var(--at-fs-display); letter-spacing: var(--at-tighter); line-height: 1.55; }
.at-topbar__meta { margin-left: auto; display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; font-size: var(--at-fs-meta); color: var(--at-meta-2); }
.at-topbar + .at-page { padding-top: 14px; }
.at-legal {
  width: 100%; max-width: calc(var(--at-page-max) + 2 * clamp(16px, 3vw, 40px)); margin: 0 auto;
  padding: 0 clamp(16px, 3vw, 40px) 24px;
  font-size: var(--at-fs-meta); color: var(--at-meta-2); font-weight: 400;
}

/* ---------------------------------------------------------------------------
   Layout-hjælpere. Alle kolonnegitre bliver én kolonne under 900px.
   ------------------------------------------------------------------------ */
.at-grid { display: grid; gap: var(--at-gap); align-items: start; }
.at-grid > * { min-width: 0; }
.at-stack { display: flex; flex-direction: column; gap: var(--at-gap); }
.at-stack--tight { gap: var(--at-s3); }
.at-stack--loose { gap: 22px; }
.at-stack > * { min-width: 0; }
.at-row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; }
.at-cols-21, .at-cols-11, .at-cols-brief, .at-cols-lab { display: grid; gap: var(--at-gap); align-items: start; }
.at-cols-21 { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); }
.at-cols-11 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.at-cols-brief { grid-template-columns: minmax(0, 1fr) 300px; gap: 24px; }
.at-cols-lab { grid-template-columns: 300px minmax(0, 1fr); }
.at-cols-21 > *, .at-cols-11 > *, .at-cols-brief > *, .at-cols-lab > * { min-width: 0; }
.at-cols--stretch { align-items: stretch; }
/* Gitrenes mindstebredde er min(Npx, 100%): ved 200 % zoom (195 CSS-px) er
   beholderen smallere end N, og så fylder én kolonne beholderen i stedet for at
   skubbe siden bredere end skærmen. Over N er gitteret uændret. */
.at-tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(240px, 100%), 1fr)); gap: 16px; }
.at-sectionhead { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 12px; margin-top: 8px; }
.at-sectionhead h2, .at-sectionhead__title { margin: 0; font-size: var(--at-fs-title); font-weight: 600; letter-spacing: var(--at-tight); }
.at-mt8 { margin-top: 8px; }

/* ---------------------------------------------------------------------------
   Kort. Skygge, ingen streg. Radius 12, polstring 16/18.
   To opbygninger virker: (a) .at-card med __head/__body/__foot (polstringen
   ligger i delene), (b) .at-card--pad, .at-kpi og .at-chartcard (polstringen
   ligger i kortet, indholdet står direkte i det).
   ------------------------------------------------------------------------ */
.at-card {
  min-width: 0;
  background: var(--at-surface);
  border-radius: var(--at-r-card);
  box-shadow: var(--at-shadow-card);
}
.at-card--pad, .at-kpi, .at-chartcard { padding: 16px 18px; }
.at-card--tight { padding: 14px 16px; }
.at-card--roomy { padding: 18px 20px; }
.at-card--col { display: flex; flex-direction: column; }
.at-card__head {
  display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px;
  padding: 16px 18px 0;
}
.at-card__titles { flex: 1 1 180px; min-width: 0; }
.at-card__title { margin: 0; font-size: var(--at-fs-body); font-weight: 600; letter-spacing: 0; line-height: 1.55; }
.at-card__title--lg { font-size: var(--at-fs-title); letter-spacing: -0.01em; }
.at-card__sub { font-size: var(--at-fs-meta); font-weight: 400; color: var(--at-meta); }
.at-card__tools { margin-left: auto; display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; }
.at-card__link { margin-left: auto; font-weight: 500; }
.at-card__headline {
  margin-top: 12px; font-size: var(--at-fs-title); font-weight: 600;
  letter-spacing: -0.015em; line-height: 1.25; text-wrap: balance;
}
.at-card__body { padding: 16px 18px; }
.at-card__head + .at-card__body { padding-top: 12px; }
.at-card__foot {
  display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px;
  padding: 12px 18px 16px;
  font-size: var(--at-fs-meta); font-weight: 400; color: var(--at-meta);
}
.at-card__body + .at-card__foot { padding-top: 0; }
.at-card__foot .at-card__link { margin-left: 0; }
.at-card__src { margin-top: 10px; font-size: var(--at-fs-meta); color: var(--at-meta); }
.at-card--pad > .at-card__head, .at-kpi > .at-card__head, .at-chartcard > .at-card__head,
.at-card--tight > .at-card__head, .at-card--roomy > .at-card__head { padding: 0; }
.at-card--pad > .at-card__body, .at-chartcard > .at-card__body,
.at-card--tight > .at-card__body, .at-card--roomy > .at-card__body { padding: 12px 0 0; }
.at-card--pad > .at-card__foot, .at-chartcard > .at-card__foot,
.at-card--tight > .at-card__foot, .at-card--roomy > .at-card__foot { padding: 12px 0 0; }

/* Punktliste med kobolt prik (Overblik, brief) */
.at-bullets { display: flex; flex-direction: column; gap: 10px; margin: 14px 0 0; padding: 0; list-style: none; }
.at-bullets li { display: flex; gap: 12px; }
.at-bullets li::before {
  content: ""; flex: 0 0 7px; width: 7px; height: 7px; margin-top: 8px;
  border-radius: 50%; background: var(--at-cobalt);
}

/* Nøgletal-par (Konto, stamdata) */
.at-kv { display: flex; align-items: baseline; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--at-line-row); }
.at-kv > :first-child { flex: 1; min-width: 0; color: var(--at-ink); }
.at-kv > :last-child { font-weight: 600; font-variant-numeric: tabular-nums; text-align: right; }
.at-kv--plain > :last-child { font-weight: 400; }
.at-kvlist { margin: 0; }

/* ---------------------------------------------------------------------------
   Nøgletalskort (KPI). Brug altid class="at-card at-kpi" (brief 41C's måler
   finder tallets kort via at-card).
   ------------------------------------------------------------------------ */
.at-kpis { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(210px, 100%), 1fr)); gap: var(--at-gap); }
.at-kpis--compact { grid-template-columns: repeat(auto-fill, minmax(min(190px, 100%), 1fr)); }
.at-kpis > * { min-width: 0; }
.at-kpi { display: flex; flex-direction: column; }
.at-kpi__label { font-size: var(--at-fs-meta); color: var(--at-meta); line-height: 1.55; }
.at-kpi__head { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; min-height: calc(var(--at-fs-meta) * 1.55); }
.at-kpi__head .at-badge { margin-left: auto; }
/* »afledt« ved etiketten fylder præcis én etiketlinje (20 px), både i kortets hoved og
   inde i en flises etiket: ellers står tallet 4 px lavere end i nabokortene. */
.at-kpi__label .at-badge, .at-kpi__head .at-badge { padding-block: 0; vertical-align: top; }
.at-kpi__value {
  margin-top: 2px; font-size: var(--at-fs-display); font-weight: 600;
  letter-spacing: var(--at-tight); line-height: 1.55; font-variant-numeric: tabular-nums;
}
.at-kpi__value .at-unit { font-size: var(--at-fs-body); font-weight: 400; letter-spacing: 0; color: var(--at-ink-soft); }
.at-kpi .at-chg { font-size: var(--at-fs-meta); font-weight: 500; }
.at-kpi__src { margin-top: 10px; font-size: var(--at-fs-meta); color: var(--at-meta); }
.at-kpi > .at-prov { margin-top: 10px; }
.at-kpi__note { margin-top: 6px; font-size: var(--at-fs-meta); color: var(--at-meta); }
/* Kortene i en række deler rækkespor (subgrid): en etiket over to linjer (Fed's
   styringsrente, øvre grænse), et »afledt«-hoved eller et kort uden ændringslinje skubber
   ikke tal, ændring, kurve og kildelinje ned i ét kort, så hvert nøgletal i rækken står på
   samme linjer (alle .at-kpis-rækker: økonomi-, markeds- og Overblik-siderne).
   Rækkeafstanden står som kortets margin (subgrid arver ellers gitterets gap ind i
   kortet). Uden subgrid-understøttelse: kortene som ovenfor. */
@supports (grid-template-rows: subgrid) {
  .at-kpis { row-gap: 0; margin-bottom: calc(-1 * var(--at-gap)); }
  .at-kpis > .at-kpi { display: grid; grid-row: span 5; grid-template-rows: subgrid; row-gap: 0; margin-bottom: var(--at-gap); }
  .at-kpis > .at-kpi > .at-kpi__label, .at-kpis > .at-kpi > .at-kpi__head { grid-row: 1; }
  .at-kpis > .at-kpi > .at-kpi__value { grid-row: 2; }
  .at-kpis > .at-kpi > .at-chg { grid-row: 3; }
  /* Et kort uden tal (fejl, tilbageholdt) har ingen kurve: noten bruger begge spor. */
  .at-kpis > .at-kpi > .at-kpi__note { grid-row: 3 / span 2; }
  .at-kpis > .at-kpi > .at-spark { grid-row: 4; }
  .at-kpis > .at-kpi > .at-prov { grid-row: 5; }
}

/* Sparkline: pynt ved siden af tallet, aldrig role="img" (aria-hidden). */
.at-spark { display: block; width: 100%; height: 34px; margin-top: 10px; overflow: visible; }
.at-spark path, .at-spark polyline {
  fill: none; stroke: var(--at-chart-line); stroke-width: 1.8;
  stroke-linejoin: round; stroke-linecap: round; vector-effect: non-scaling-stroke;
}
.at-spark--row { width: 84px; height: 26px; margin-top: 0; }
.at-spark--row path, .at-spark--row polyline { stroke-width: 1.6; }
.at-spark--tile { height: 44px; }

/* ---------------------------------------------------------------------------
   Knapper. Plain .at-btn er DEN primære handling (is). Factor Lab-testene
   tæller præcis én class="at-btn" på byggesiden, så en side har højst én.
   ------------------------------------------------------------------------ */
.at-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  height: 44px; padding: 0 20px;
  border: 0; border-radius: var(--at-r-pill);
  font-family: inherit; font-size: var(--at-fs-body); font-weight: 600; line-height: 1;
  letter-spacing: 0; white-space: nowrap; text-decoration: none; cursor: pointer;
  background: var(--at-ice); color: var(--at-on-ice);
  transition: background-color 0.13s ease, box-shadow 0.13s ease, color 0.13s ease;
}
.at-btn:hover { background-color: var(--at-ice-hover); opacity: 1; }
.at-btn:active { transform: translateY(1px); }
.at-btn svg { width: 16px; height: 16px; }
.at-btn--glow { height: 48px; padding: 0 24px; box-shadow: var(--at-shadow-cta); }
.at-btn--lg { height: 48px; padding: 0 24px; }
.at-btn--md { height: 42px; padding: 0 18px; }
.at-btn--sm { height: 36px; padding: 0 14px; font-size: var(--at-fs-meta); }
.at-btn--block { width: 100%; }
.at-btn--secondary, .at-btn--util { background: var(--at-canvas-2); color: var(--at-ink); }
.at-btn--secondary:hover, .at-btn--util:hover { background-color: #e8ebf3; }
.at-btn--util { height: 36px; padding: 0 14px; font-size: var(--at-fs-meta); }
.at-btn--white { height: 42px; background: var(--at-surface); color: var(--at-ink); box-shadow: var(--at-shadow-raise); }
.at-btn--white:hover { background-color: var(--at-row-hover); }
.at-btn--ghost { background: transparent; color: var(--at-ink-soft); }
.at-btn--ghost:hover { background-color: var(--at-canvas-2); color: var(--at-ink); }
.at-btn--dark, .at-btn--white.is-on { background: var(--at-navy-900); color: var(--at-on-navy); box-shadow: none; }
.at-btn--dark:hover { background-color: var(--at-navy-700); }
.at-btn--onDark { background: rgba(238, 241, 251, 0.12); color: var(--at-on-navy); }
.at-btn--onDark:hover { background-color: rgba(238, 241, 251, 0.2); }
.at-btn.at-btn--sm { height: 36px; padding: 0 14px; font-size: var(--at-fs-meta); }
.at-btn--danger { background: var(--at-clay-soft); color: var(--at-clay-ink-2); }
.at-btn--danger:hover { background-color: #f2e0d7; color: #935134; } /* 4,74:1 på hover-tonen (#9f5738 gav 4,22) */
.at-btn--icon {
  width: 40px; height: 40px; padding: 0; border-radius: var(--at-r-sm);
  background: var(--at-canvas-2); color: var(--at-ink);
}
.at-btn--icon:hover { background-color: #e8ebf3; }
.at-btn--icon.at-btn--sm { width: 32px; height: 32px; padding: 0; border-radius: var(--at-r-xs); }
.at-btn--icon svg { width: 16px; height: 16px; }
/* Ler-tonet ikonknap (fx "Fjern kort"): --icon står efter --danger med samme
   specificitet og ville ellers gøre en --danger-ikonknap grå. */
.at-btn--icon.at-btn--danger { background: var(--at-clay-soft); color: var(--at-clay-ink-2); }
.at-btn--icon.at-btn--danger:hover { background-color: #f2e0d7; color: #935134; }
.at-btn[disabled], .at-btn[aria-disabled="true"] {
  background: var(--at-canvas-2); color: var(--at-meta-2);
  box-shadow: none; cursor: not-allowed; transform: none; opacity: 1;
}
.at-btn[disabled]:hover, .at-btn[aria-disabled="true"]:hover { background-color: var(--at-canvas-2); }

/* Link-knapper: kobolt 500, pilen er en tekst-pil (→) i ordlyden */
.at-link {
  display: inline; padding: 0; border: 0; background: none; cursor: pointer;
  font-family: inherit; font-size: inherit; font-weight: 500; line-height: inherit;
  color: var(--at-cobalt); text-align: left;
}
.at-link--ink { color: var(--at-ink); }
.at-link--quiet { font-size: var(--at-fs-meta); font-weight: 400; color: var(--at-meta-2); }
.at-link--quiet:hover { color: var(--at-ink); opacity: 1; }
.at-arrowlink { display: inline-flex; align-items: center; gap: 6px; font-weight: 500; color: var(--at-cobalt); }
.at-arrowlink svg { width: 15px; height: 15px; }

/* ---------------------------------------------------------------------------
   Felter. 44px, radius 12, grå flade, ingen kant. Fokus: kobolt ring.
   ------------------------------------------------------------------------ */
.at-field { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.at-field--grow { flex: 2 1 200px; }
.at-field--mid { flex: 1 1 150px; }
.at-field--small { flex: 1 1 120px; }
.at-label { font-size: var(--at-fs-meta); font-weight: 400; color: var(--at-meta-2); line-height: 1.55; letter-spacing: 0; }
.at-formrow { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 12px; }
/* Den gennemsigtige kant er usynlig i normal tilstand (box-sizing holder 44px),
   men tvungne farver (Windows Høj kontrast) maler den, så feltet har en grænse. */
.at-input, .at-select, .at-textarea {
  width: 100%; height: 44px; padding: 0 12px;
  border: 1px solid transparent; border-radius: var(--at-r-input);
  background-color: var(--at-canvas-2); color: var(--at-ink);
  font-family: inherit; font-size: var(--at-fs-body);
  transition: box-shadow 0.13s ease, background-color 0.13s ease;
}
.at-textarea { height: auto; min-height: 96px; padding: 10px 12px; line-height: 1.55; resize: vertical; }
.at-input::placeholder, .at-textarea::placeholder { color: var(--at-meta-2); opacity: 1; }
.at-input:hover, .at-select:hover, .at-textarea:hover { background-color: #edf0f6; }
/* Ringen er en skygge; den gennemsigtige outline males af tvungne farver, hvor
   skyggen forsvinder, så fokus stadig ses der. */
.at-input:focus, .at-select:focus, .at-textarea:focus { outline: 2px solid transparent; outline-offset: 0; background-color: var(--at-surface); box-shadow: 0 0 0 2px var(--at-cobalt); }
.at-input[aria-invalid="true"], .at-select[aria-invalid="true"], .at-textarea[aria-invalid="true"] { box-shadow: inset 0 0 0 1.5px var(--at-clay); }
.at-select {
  appearance: none; -webkit-appearance: none; padding-right: 36px;
  background-image: linear-gradient(45deg, transparent 50%, var(--at-meta) 50%), linear-gradient(135deg, var(--at-meta) 50%, transparent 50%);
  background-position: right 18px center, right 13px center;
  background-size: 5px 5px, 5px 5px; background-repeat: no-repeat;
}
input[type="checkbox"], input[type="radio"] { accent-color: var(--at-cobalt); }
.at-check { display: flex; align-items: flex-start; gap: 10px; }
.at-check input { margin: 3px 0 0; width: 16px; height: 16px; flex: 0 0 16px; }
.at-hint { font-size: var(--at-fs-meta); font-weight: 400; color: var(--at-meta-2); }
.at-error { font-size: var(--at-fs-meta); font-weight: 500; color: var(--at-clay-ink); }

/* Stort søgefelt (Positivlisten). Grænsen er kortskyggen, som tvungne farver fjerner;
   den gennemsigtige kant males der i stedet (som på .at-input). */
.at-searchbig {
  display: flex; align-items: center; gap: 12px;
  height: 60px; padding: 0 20px; border: 1px solid transparent; border-radius: var(--at-r-card);
  background: var(--at-surface); box-shadow: var(--at-shadow-card);
}
.at-searchbig svg { width: 18px; height: 18px; color: var(--at-grey); }
.at-searchbig input {
  flex: 1; min-width: 0; height: 100%; padding: 0;
  border: 0; background: transparent; color: var(--at-ink);
  font-family: inherit; font-size: var(--at-fs-title); outline: none;
}
.at-searchbig input::placeholder { color: var(--at-meta); opacity: 1; }
.at-searchbig:focus-within { outline: 2px solid transparent; outline-offset: 0; box-shadow: 0 0 0 2px var(--at-cobalt), var(--at-shadow-card); }
/* Søgningen i appens top (brief 75): et link til /soeg, der ligner et felt. Rammen er
   gennemsigtig af samme grund som ovenfor (tvungne farver fjerner skyggen). */
.at-topsearch {
  display: flex; align-items: center; gap: 10px;
  width: 100%; max-width: 440px; height: 44px; padding: 0 16px;
  border: 1px solid transparent; border-radius: var(--at-r-pill);
  background: var(--at-surface); box-shadow: var(--at-shadow-raise);
  color: var(--at-meta); font-size: var(--at-fs-body);
}
.at-topsearch svg { width: 16px; height: 16px; flex: 0 0 16px; color: var(--at-grey); }
.at-topsearch span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.at-topsearch:hover { opacity: 1; color: var(--at-ink-soft); }

/* Systembeskeder. Ingen alarmrød: toner fra paletten. */
.at-flash {
  display: flex; align-items: flex-start; gap: 10px;
  padding: 12px 16px; border-radius: var(--at-r-card);
  background: var(--at-surface); box-shadow: var(--at-shadow-card);
  font-size: var(--at-fs-body); color: var(--at-ink);
}
.at-flash--ok { background: var(--at-blue-050); color: var(--at-navy-700); box-shadow: none; }
.at-flash--warn { background: var(--at-warn-soft); color: var(--at-warn); box-shadow: none; }
.at-flash--err { background: var(--at-clay-soft); color: var(--at-clay-ink-2); box-shadow: none; }
.at-flash a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }

/* ---------------------------------------------------------------------------
   Mærker og piller. 13px. Grå tekst aldrig over vægt 500.
   Statusmærker (D9): endelig og forsinket neutrale, foreløbig ler-tone,
   afledt blå tone. Ordet bærer betydningen, farven støtter.
   ------------------------------------------------------------------------ */
.at-badge {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 2px 10px; border-radius: var(--at-r-pill);
  font-size: var(--at-fs-meta); font-weight: 500; line-height: 1.55;
  background: var(--at-canvas-2); color: var(--at-ink-soft);
  /* Ombrydes kun, når beholderen er smallere end mærket (200 % zoom), i stedet
     for at skubbe siden bredere end skærmen. */
  max-width: 100%; white-space: normal; vertical-align: middle;
}
.at-badge--final, .at-badge--delay { background: var(--at-canvas-2); color: var(--at-ink-soft); }
.at-badge--prelim { background: var(--at-prelim-soft); color: var(--at-prelim); }
.at-badge--derived { background: var(--at-derived-soft); color: var(--at-derived); }
.at-badge--pro { background: var(--at-blue-050); color: var(--at-cobalt); font-weight: 600; }
.at-badge--line { background: var(--at-surface); color: var(--at-ink-soft); box-shadow: var(--at-shadow-raise); }
.at-badge--soon {
  min-height: 28px; padding: 0 12px; font-weight: 600;
}
.at-badge--soon { background: var(--at-blue-050); color: var(--at-navy-700); }
a.at-badge:hover { background: var(--at-line-2); color: var(--at-ink); opacity: 1; }

/* Status- og info-piller */
.at-pill {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 2px 10px; border-radius: var(--at-r-pill);
  font-size: var(--at-fs-meta); font-weight: 400; line-height: 1.55; white-space: nowrap;
  background: var(--at-canvas-2); color: var(--at-ink-soft);
}
.at-pill--active { background: var(--at-blue-050); color: var(--at-navy-700); }
.at-pill--info { padding: 4px 12px; font-weight: 500; background: var(--at-blue-050); color: var(--at-navy-700); white-space: normal; }
.at-card__head .at-pill--info { margin-left: auto; }
.at-nu {
  display: inline-flex; align-items: center; padding: 1px 9px; border-radius: var(--at-r-pill);
  font-size: var(--at-fs-meta); font-weight: 600; line-height: 1.55;
  background: var(--at-navy-900); color: var(--at-on-navy);
}
.at-ticker {
  display: inline-flex; align-items: center; padding: 3px 10px; border-radius: var(--at-r-pill);
  font-size: var(--at-fs-meta); font-weight: 500; line-height: 1.4;
  background: var(--at-surface); box-shadow: var(--at-shadow-raise);
}

/* ---------------------------------------------------------------------------
   Chips (valg): Grafer-serier, Factor Lab, regime-faner
   ------------------------------------------------------------------------ */
.at-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.at-chips--loose { gap: 8px; }
/* min-height, ikke height: en chip bredere end beholderen (200 % zoom) ombrydes
   over to linjer i stedet for at løbe ud af siden; på én linje er den 36px. */
.at-chip {
  position: relative; display: inline-flex; align-items: center; gap: 8px;
  min-height: 36px; max-width: 100%; padding: 6px 14px; border: 0; border-radius: var(--at-r-pill);
  background: var(--at-canvas-2); color: var(--at-ink-chip);
  font-family: inherit; font-size: var(--at-fs-meta); font-weight: 400; line-height: 1.2;
  white-space: normal; text-decoration: none; cursor: pointer;
  transition: background-color 0.12s ease, color 0.12s ease;
}
.at-chip:hover { background-color: #e8ebf3; color: var(--at-ink); opacity: 1; }
.at-chip.is-on, .at-chip[aria-pressed="true"], .at-chip[aria-current], .at-chip:has(> input:checked) {
  background-color: var(--at-navy-700); color: var(--at-on-navy);
}
.at-chip > input { position: absolute; opacity: 0; width: 1px; height: 1px; pointer-events: none; }
.at-chip:has(> input:focus-visible) { outline: 2px solid var(--at-cobalt); outline-offset: 2px; }
.at-chip[aria-disabled="true"], .at-chip.is-disabled { color: var(--at-meta-2); cursor: not-allowed; }
.at-chip--sm { min-height: 34px; padding: 6px 13px; }
.at-chip__dot { display: block; width: 9px; height: 9px; flex: 0 0 9px; border-radius: 50%; background: #c8cdd9; }
.at-chip__dot--1 { background: var(--at-chart-s1); }
.at-chip__dot--2 { background: var(--at-chart-s2); }
.at-chip__dot--3 { background: var(--at-chart-s3); }
/* Den navy seriefarve forsvinder på en valgt (navy) chip: den får en tynd lys kant. */
.at-chip.is-on .at-chip__dot--1, .at-chip[aria-pressed="true"] .at-chip__dot--1,
.at-chip[aria-current] .at-chip__dot--1, .at-chip:has(> input:checked) .at-chip__dot--1 { box-shadow: 0 0 0 1.5px var(--at-on-navy); }

/* ---------------------------------------------------------------------------
   Segmenteret kontrol. Grå spor = periodevælger (1 år / 5 år / Maks);
   --solid = hvidt spor med navy valg (Positivlisten-filter).
   ------------------------------------------------------------------------ */
.at-seg { display: inline-flex; flex-wrap: nowrap; padding: 3px; border-radius: var(--at-r-pill); background: var(--at-canvas-2); }
.at-seg > a, .at-seg > button, .at-seg > label, .at-seg > span, .at-seg__btn {
  display: inline-flex; align-items: center; height: 30px; padding: 0 12px;
  border: 0; border-radius: var(--at-r-pill); background: transparent;
  font-family: inherit; font-size: var(--at-fs-meta); font-weight: 400; line-height: 1;
  color: var(--at-ink-soft); text-decoration: none; white-space: nowrap; cursor: pointer;
}
.at-seg > a:hover, .at-seg > button:hover, .at-seg > label:hover { color: var(--at-ink); opacity: 1; }
.at-seg > .is-active, .at-seg > .is-on, .at-seg > [aria-pressed="true"], .at-seg > [aria-current] {
  background: var(--at-surface); color: var(--at-ink); box-shadow: var(--at-shadow-seg);
}
.at-seg--solid { background: var(--at-surface); box-shadow: var(--at-shadow-float); }
.at-seg--solid > a, .at-seg--solid > button, .at-seg--solid > label, .at-seg--solid > span {
  height: 36px; padding: 0 16px; font-size: var(--at-fs-body); color: var(--at-ink-chip);
}
.at-seg--solid > .is-active, .at-seg--solid > .is-on, .at-seg--solid > [aria-pressed="true"], .at-seg--solid > [aria-current] {
  background: var(--at-navy-700); color: var(--at-on-navy); box-shadow: none;
}

/* Periodevælger uden JavaScript: skjulte radioknapper i grafens <figure>,
   <label for=…> i kortets .at-seg. :has() viser den valgte variant.
   charts.py samler knapperne i ét navngivet omslag (div.at-per, role="radiogroup",
   "Periode for <graf>"); omslaget fylder intet, knapperne er absolut placerede. */
.at-per { margin: 0; padding: 0; border: 0; }
.at-per__in {
  position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; opacity: 0;
  /* Fokus på en skjult radioknap ruller knappen, ikke dens synlige etiket i kortets
     hoved (højst ca. 53px over), i syne: 64px margen holder etiketten fri af den
     sticky topbar ved omvendt Tab (WCAG 2.4.11). Lægges til html's scroll-padding. */
  scroll-margin-top: 64px;
}
/* Én periodegraf pr. kort (eller pr. .at-perscope-omslag). is-on markerer
   standardperioden for browsere uden :has(); med :has() følger markeringen
   den valgte radioknap. */
:is(.at-card, .at-perscope):has(.at-per__in:checked) .at-seg > label.is-on {
  background: transparent; color: var(--at-ink-soft); box-shadow: none;
}
:is(.at-card, .at-perscope):has(.at-per__in[value="1y"]:checked) .at-seg > label:is([data-per="1y"], [for$="-1y"]),
:is(.at-card, .at-perscope):has(.at-per__in[value="5y"]:checked) .at-seg > label:is([data-per="5y"], [for$="-5y"]),
:is(.at-card, .at-perscope):has(.at-per__in[value="max"]:checked) .at-seg > label:is([data-per="max"], [for$="-max"]) {
  background: var(--at-surface); color: var(--at-ink); box-shadow: var(--at-shadow-seg);
}
:is(.at-card, .at-perscope):has(.at-per__in[value="1y"]:focus-visible) .at-seg > label:is([data-per="1y"], [for$="-1y"]),
:is(.at-card, .at-perscope):has(.at-per__in[value="5y"]:focus-visible) .at-seg > label:is([data-per="5y"], [for$="-5y"]),
:is(.at-card, .at-perscope):has(.at-per__in[value="max"]:focus-visible) .at-seg > label:is([data-per="max"], [for$="-max"]) {
  outline: 2px solid var(--at-cobalt); outline-offset: 2px;
}
/* Uden :has() kan hverken markeringen følge radioknappen eller figuren skifte variant
   (figuren viser standardperioden alene, se .at-chart__v--off). Så tændes
   standardknappen (is-default) fast, og de andre periodeknapper skjules: en knap, der
   intet gør, må ikke se ud som et valg. */
@supports not selector(:has(*)) {
  .at-seg > label.is-default { background: var(--at-surface); color: var(--at-ink); box-shadow: var(--at-shadow-seg); }
  .at-seg > label[for^="per-"]:not(.is-default) { display: none; }
}
/* Tvungne farver (Windows Høj kontrast) fjerner flader og skygger: knapper får en
   systemfarvet kant, og det valgte segment eller den valgte chip får systemets
   markeringsfarve som flade. Flade, ikke outline, så fokusringen på samme etiket
   stadig kan skelnes fra valget. */
@media (forced-colors: active) {
  .at-btn { border: 1px solid ButtonText; }
  :is(.at-card, .at-perscope):has(.at-per__in[value="1y"]:checked) .at-seg > label:is([data-per="1y"], [for$="-1y"]),
  :is(.at-card, .at-perscope):has(.at-per__in[value="5y"]:checked) .at-seg > label:is([data-per="5y"], [for$="-5y"]),
  :is(.at-card, .at-perscope):has(.at-per__in[value="max"]:checked) .at-seg > label:is([data-per="max"], [for$="-max"]),
  .at-seg > .is-active, .at-seg > [aria-pressed="true"], .at-seg > [aria-current],
  .at-chip.is-on, .at-chip[aria-pressed="true"], .at-chip[aria-current], .at-chip:has(> input:checked) {
    forced-color-adjust: none; background: Highlight; color: HighlightText;
  }
}

/* Understregede faner (Factor Lab-undernavigation, Positivlisten-visninger) */
.at-tabs { display: flex; gap: 4px; border-bottom: 1px solid var(--at-line-tab); overflow-x: auto; scrollbar-width: none; }
.at-tab {
  display: inline-flex; align-items: center; gap: 8px; padding: 10px 14px;
  border: 0; background: none; cursor: pointer; white-space: nowrap;
  font-family: inherit; font-size: var(--at-fs-body); font-weight: 500; color: var(--at-ink-soft);
}
.at-tab:hover { color: var(--at-ink); opacity: 1; }
.at-tab.is-on, .at-tab.is-active, .at-tab[aria-current], .at-tab[aria-selected="true"] {
  color: var(--at-ink); box-shadow: inset 0 -2px 0 var(--at-cobalt);
}
.at-tab .at-badge--pro { padding: 1px 8px; }

/* Fold-ud ("Hvad viser grafen?"): summary ligner et link, ingen markør */
.at-disclosure { margin-top: 14px; }
.at-disclosure > summary {
  display: inline-block; list-style: none; cursor: pointer;
  font-size: var(--at-fs-body); font-weight: 500; color: var(--at-cobalt);
}
.at-disclosure > summary:hover { opacity: 0.85; }
.at-disclosure > summary::-webkit-details-marker { display: none; }
.at-disclosure > :not(summary) { margin-top: 6px; }
.at-disclosure p { color: var(--at-ink); max-width: 72ch; text-wrap: pretty; }
.at-disclosure p + p { margin-top: 8px; }
.at-disclosure--plain > summary { color: var(--at-ink); }

/* ---------------------------------------------------------------------------
   Kildelinjen. Produktets differentiator. Altid synlig: kilde og periode på hver
   værdi. RUN 6 (tillæg 08.10.2026): serie-id og hentetid står i folden
   "Hvad viser tallet?" (_kildelinje.html), et <details> inde i linjen.
   ------------------------------------------------------------------------ */
/* Løbende tekst, ikke flex: linjen brydes efter en prik eller inde i et
   flerordsnavn. Mellemrummene er genereret indhold. Foran prikken står et
   hårdt mellemrum (U+00A0), der limer prikken til ordet før den; efter
   prikken står et almindeligt mellemrum, så linjen kan brydes der. Det
   holder kun, når markuppen har INGEN mellemrum mellem spannene (alle
   skabeloner og charts.py skriver dem i ét stræk): et mellemrum i markuppen
   foran prikken giver et dobbelt mellemrum og et brudpunkt før prikken.
   En linje kan stadig starte med "·", når ét enkelt token (den 64 tegn
   lange payload-hash) er længere end linjen; overflow-wrap: anywhere skal
   blive, for den forhindrer vandret overflow ved 390px. */
.at-prov {
  display: block;
  font-size: var(--at-fs-meta); font-weight: 400; line-height: 1.55;
  color: var(--at-meta-2); font-variant-numeric: tabular-nums; text-wrap: pretty;
  /* Lange tokens (payload-hash, serie-id'er) brydes hellere end at skubbe
     siden bredere end skærmen (390px: /brief løb 98-132px ud). */
  overflow-wrap: anywhere;
}
.at-prov > * + *::before { content: " "; }
.at-prov__sep { white-space: nowrap; }
.at-prov > * + .at-prov__sep::before { content: "\a0"; }
.at-prov__src { font-weight: 500; color: var(--at-ink-soft); }
.at-prov__sep, .at-prov__key, .at-prov__val { color: var(--at-meta-2); }
.at-provcell { font-size: var(--at-fs-meta); font-weight: 400; color: var(--at-meta-2); font-variant-numeric: tabular-nums; }
.at-provcell strong { font-weight: 500; color: var(--at-ink-soft); }

/* Signaturforklaring: stregprøver der matcher linjerne */
.at-legend { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 18px; font-size: var(--at-fs-meta); font-weight: 400; color: var(--at-ink-soft); }
.at-legend span, .at-legend__item { display: inline-flex; align-items: center; gap: 8px; }
.at-legend i, .at-legend__swatch {
  display: block; flex: 0 0 18px; width: 18px; height: 3px; border-radius: 2px;
  background: var(--at-chart-line);
}
/* Modifikatorerne står med .at-legend foran: charts.py skriver stregprøven som
   <i class="at-legend__swatch …">, og ".at-legend i" (0,1,1) slog ellers en
   enkelt modifikatorklasse (0,1,0), så alle prøver blev kobolt. */
.at-legend .at-legend__swatch--s1, .at-legend__swatch--s1 { background: var(--at-chart-s1); }
.at-legend .at-legend__swatch--s2, .at-legend__swatch--s2 { background: var(--at-chart-s2); }
.at-legend .at-legend__swatch--s3, .at-legend__swatch--s3 { background: var(--at-chart-s3); }
.at-legend .at-legend__swatch--clay, .at-legend__swatch--clay { background: var(--at-clay); }
.at-legend .at-legend__swatch--square, .at-legend__swatch--square { flex-basis: 10px; width: 10px; height: 10px; border-radius: 3px; }

/* ---------------------------------------------------------------------------
   Tabeller. Semantisk <table>. Hoved 13px meta, rækker med hårfin streg,
   tal højrestillet med tabular-nums. Ingen zebra.
   ------------------------------------------------------------------------ */
.at-tablewrap { overflow-x: auto; padding: 0 18px 6px; -webkit-overflow-scrolling: touch; }
.at-card__body .at-tablewrap, .at-card--pad .at-tablewrap, .at-chartcard .at-tablewrap,
.at-card--tight .at-tablewrap, .at-card--roomy .at-tablewrap { padding-left: 0; padding-right: 0; }
.at-table { width: 100%; border-collapse: collapse; border-spacing: 0; }
/* Kolonneafstand 12px som handoffens gitterrækker (gap 12): 6px på hver side. */
.at-table th {
  padding: 14px 6px 8px; text-align: left; vertical-align: bottom; white-space: nowrap;
  font-size: var(--at-fs-meta); font-weight: 400; color: var(--at-meta);
  border-bottom: 1px solid var(--at-line);
}
.at-table td {
  padding: 11px 6px; vertical-align: middle; white-space: nowrap;
  font-size: var(--at-fs-body); color: var(--at-ink);
  border-bottom: 1px solid var(--at-line-row);
}
/* Rækkeoverskrifter (<th scope="row"> i tbody, Factor Lab-nøgletal) er
   brødtekst som cellerne, ikke kolonnehoveder. */
.at-table tbody th {
  padding: 11px 6px; vertical-align: middle; font-size: var(--at-fs-body); font-weight: 400;
  color: var(--at-ink); border-bottom: 1px solid var(--at-line-row);
}
.at-table td.at-muted { color: var(--at-ink-soft); }
.at-table td.at-faint { color: var(--at-meta-2); }
.at-table th:first-child, .at-table td:first-child { padding-left: 0; }
.at-table th:last-child, .at-table td:last-child { padding-right: 0; }
.at-table th.at-r, .at-table td.at-r { text-align: right; font-variant-numeric: tabular-nums; }
.at-table--wrap td { white-space: normal; }
.at-table--2line td { padding-top: 9px; padding-bottom: 9px; }
.at-table--hover tbody tr:hover td, .at-table tr.is-link:hover td { background: var(--at-row-hover); }
.at-table--cal th:nth-child(1) { width: 110px; }
.at-table--cal th:nth-child(2) { width: 60px; }
/* "Sidste tal" (4) følger indholdet: tallet og dets serie-id og periode. En fast
   90px-kolonne pressede kildelinjen ned på to-tre linjer eller ud af kortet. */
.at-table--cal th:nth-child(4) { width: auto; }
.at-table--cal th, .at-table--cal td { padding-left: 7px; padding-right: 7px; }
.at-table--cal th { padding-top: 0; padding-bottom: 10px; }
.at-table--cal td { padding-top: 13px; padding-bottom: 13px; }
.at-name { font-weight: 500; font-size: var(--at-fs-body); }
.at-name__sub { display: block; font-size: var(--at-fs-meta); font-weight: 400; color: var(--at-meta); white-space: normal; }
/* Et link i meta-linjen skilles fra teksten med understregning, ikke kun farve (WCAG 1.4.1). */
.at-name__sub a { text-decoration: underline; text-underline-offset: 2px; text-decoration-color: color-mix(in srgb, var(--at-cobalt) 35%, transparent); }

/* ---------------------------------------------------------------------------
   Tal og retning. Ægte minus (−), plus for op, ± for nul (web/data.py).
   Kobolt op, ler ned, grå uændret, kun som tekstfarve.
   ------------------------------------------------------------------------ */
.at-val { font-size: var(--at-fs-body); font-weight: 600; font-variant-numeric: tabular-nums; letter-spacing: 0; }
.at-val--lg { font-size: var(--at-fs-display); letter-spacing: var(--at-tight); line-height: 1.55; }
.at-val--na { font-weight: 400; color: var(--at-meta-2); }
.at-unit { font-size: var(--at-fs-meta); font-weight: 400; color: var(--at-ink-soft); margin-left: 2px; letter-spacing: 0; }
.at-chg { font-size: var(--at-fs-meta); font-weight: 500; font-variant-numeric: tabular-nums; color: var(--at-meta); }
.at-chg--up { color: var(--at-cobalt); }
.at-chg--down { color: var(--at-clay-ink); }
.at-chg--flat { color: var(--at-meta); }

/* Alert-rækker */
.at-alert { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; padding: 14px 18px; border-bottom: 1px solid var(--at-line-row); }
.at-alert__body { flex: 1 1 200px; min-width: 0; }
.at-alert__title { font-weight: 500; }
.at-alert__rule { font-size: var(--at-fs-meta); color: var(--at-meta); font-variant-numeric: tabular-nums; }
.at-alert__val { margin-left: auto; display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; }
.at-card--pad .at-alert, .at-card__body .at-alert { padding-left: 0; padding-right: 0; }

/* Enkle listerækker (Overblik: alerts, genveje) */
.at-list { margin: 0; padding: 0; list-style: none; }
.at-list > li { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; padding: 12px 0; border-bottom: 1px solid var(--at-line-row); }
.at-list > li > :first-child { flex: 1 1 auto; min-width: 0; }

/* ---------------------------------------------------------------------------
   Tomme tilstande. Hvidt kort, centreret, én tydelig næste handling.
   Ordlyden er sidens egen (ærlige, specifikke tekster).
   ------------------------------------------------------------------------ */
.at-empty {
  display: flex; flex-direction: column; align-items: center; gap: 12px;
  padding: 40px 28px; text-align: center;
  border-radius: var(--at-r-card); background: var(--at-surface); box-shadow: var(--at-shadow-card);
}
.at-empty__title { font-size: var(--at-fs-title); font-weight: 600; letter-spacing: -0.01em; line-height: 1.3; }
.at-empty__body { max-width: 46ch; color: var(--at-ink); text-wrap: pretty; }
.at-empty__body strong { font-weight: 600; }
.at-empty .at-btn { margin-top: 6px; }
.at-card .at-empty { padding: 28px 18px; background: transparent; box-shadow: none; }
.at-empty--inline { align-items: flex-start; text-align: left; padding: 28px 0 8px; background: transparent; box-shadow: none; }
.at-empty--inline .at-empty__body { max-width: 40ch; }

/* ---------------------------------------------------------------------------
   Store centrerede kort: Pro-mur (403) og "Kommer snart"
   ------------------------------------------------------------------------ */
/* Handoffens kort er ca. 594px bredt (indholdet bestemmer); her en fast
   bredde, så korte lister ikke giver et smalt kort. */
.at-wall {
  width: 100%; max-width: 600px;
  margin: 24px auto 0; padding: clamp(28px, 4vw, 44px);
  border-radius: var(--at-r-panel); background: var(--at-surface); box-shadow: var(--at-shadow-lg);
}
.at-wall__badge {
  display: inline-flex; align-items: center; height: 28px; padding: 0 12px;
  border-radius: var(--at-r-pill); background: var(--at-navy-900); color: var(--at-ice);
  font-size: var(--at-fs-meta); font-weight: 600;
}
.at-wall__title { margin: 16px 0 0; font-size: var(--at-fs-display); font-weight: 600; letter-spacing: var(--at-tighter); line-height: 1.3; text-wrap: balance; }
.at-wall__title:first-child { margin-top: 0; }
.at-wall__lead { margin: 8px 0 0; color: var(--at-ink); text-wrap: pretty; }
.at-wall__lead + .at-wall__lead { margin-top: 12px; }
.at-wall__list { margin: 14px 0 0; padding: 0; list-style: none; }
.at-wall__list li { display: flex; align-items: center; gap: 12px; padding: 9px 0; border-top: 1px solid var(--at-line-row); }
.at-wall__list svg { width: 18px; height: 18px; flex: 0 0 18px; color: var(--at-cobalt); }
.at-wall__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 20px; margin-top: 24px; }
.at-wall > .at-flash + .at-wall__lead { margin-top: 16px; }
:is(.at-cols-11, .at-cols-21) > .at-wall { max-width: none; margin: 0; }
.at-wall--center { text-align: center; }
.at-wall--center .at-wall__lead { max-width: 46ch; margin-left: auto; margin-right: auto; }
.at-wall--center .at-wall__actions { justify-content: center; margin-top: 22px; }

/* ---------------------------------------------------------------------------
   Mørkt hero-kort (Regime)
   ------------------------------------------------------------------------ */
.at-hero-dark {
  padding: clamp(24px, 3vw, 40px); border-radius: var(--at-r-panel);
  background: var(--at-navy-900); color: var(--at-on-navy); box-shadow: var(--at-shadow-dark);
}
.at-hero-dark__eyebrow { font-size: var(--at-fs-meta); font-weight: 500; color: var(--at-ice); }
.at-hero-dark__title { margin-top: 8px; font-size: var(--at-fs-display); font-weight: 600; letter-spacing: -0.035em; line-height: 1.05; text-wrap: balance; }
.at-hero-dark__text { margin: 12px 0 0; max-width: 60ch; font-size: var(--at-fs-title); color: var(--at-on-navy-body); text-wrap: pretty; }
.at-hero-dark details { margin-top: 16px; max-width: 64ch; }
.at-hero-dark details > summary { color: var(--at-ice); font-weight: 500; }
.at-hero-dark details p { margin: 8px 0 0; color: var(--at-on-navy-body); }
.at-hero-dark a { color: var(--at-ice); }
.at-hero-dark .at-prov, .at-hero-dark .at-prov__src, .at-hero-dark .at-prov__sep,
.at-hero-dark .at-prov__key, .at-hero-dark .at-prov__val, .at-hero-dark .at-provcell { color: var(--at-on-navy-2); }
.at-hero-dark .at-nu { background: var(--at-ice); color: var(--at-on-ice); }

/* Regime som koordinatsystem: 2 × 2 kvadrant, aktiv celle markeret "Nu" */
.at-quad { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px; }
.at-quad__cell {
  display: flex; flex-direction: column; justify-content: space-between; gap: 10px;
  min-height: 108px; padding: 12px 14px; border-radius: var(--at-r-sm);
  background: var(--at-canvas-2); color: var(--at-ink); font-size: var(--at-fs-meta); line-height: 1.3;
}
.at-quad__cell.is-now { background: var(--at-blue-now); color: var(--at-navy-700); font-weight: 500; }
.at-quad__now {
  align-self: flex-start; display: inline-flex; align-items: center; gap: 8px;
  padding: 1px 9px 1px 4px; border-radius: var(--at-r-pill);
  background: var(--at-navy-900); color: var(--at-on-navy); font-size: var(--at-fs-meta); font-weight: 600; line-height: 1.55;
}
.at-quad__now::before { content: ""; width: 10px; height: 10px; border-radius: 50%; background: var(--at-ice); box-shadow: 0 0 0 2px var(--at-navy-900); }
.at-quad__axis { font-size: var(--at-fs-meta); color: var(--at-meta); }
.at-quad__axes { display: flex; justify-content: space-between; gap: 12px; margin-top: 8px; }

/* ---------------------------------------------------------------------------
   Dagens brief: læsekolonne (max 720px) og arkiv (300px)
   ------------------------------------------------------------------------ */
.at-brief {
  width: 100%; max-width: 720px; justify-self: center;
  padding: clamp(22px, 3vw, 40px);
}
.at-brief__nav { display: flex; align-items: center; gap: 10px; }
.at-brief__date { flex: 1; text-align: center; font-weight: 500; }
/* Den deaktiverede pil dæmpes KUN af opaciteten (handoffens stroke #12162a ved .35), ikke
   også af den generelle disabled-grå (ellers to gange dæmpet). */
.at-brief__nav .at-btn--icon[aria-disabled="true"] { color: var(--at-ink); opacity: 0.35; background: var(--at-canvas-2); cursor: default; }
.at-brief__title { margin: 26px 0 0; font-size: var(--at-fs-display); font-weight: 600; letter-spacing: var(--at-tighter); line-height: 1.15; text-wrap: balance; }
.at-brief__sec { margin-top: 26px; }
.at-brief__label { font-size: var(--at-fs-meta); font-weight: 600; color: var(--at-cobalt); }
.at-brief__text, .at-brief__sec p { margin: 6px 0 0; font-size: var(--at-fs-title); line-height: 1.65; text-wrap: pretty; }
.at-brief__src { margin-top: 8px; font-size: var(--at-fs-meta); color: var(--at-meta); }
.at-brief__foot { margin-top: 26px; padding-top: 14px; border-top: 1px solid var(--at-line-row); display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; font-size: var(--at-fs-meta); color: var(--at-meta); }
.at-archive { padding: 18px 20px; }
.at-archive__title { margin: 0 0 8px; font-size: var(--at-fs-body); font-weight: 600; }
.at-archive__list { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 2px; }
.at-archive__item { display: block; padding: 10px 12px; border-radius: var(--at-r-sm); color: var(--at-ink); }
.at-archive__item:hover { background: var(--at-canvas-2); opacity: 1; }
.at-archive__item.is-on, .at-archive__item[aria-current] { background: var(--at-blue-050); }
.at-archive__date { display: block; font-size: var(--at-fs-meta); color: var(--at-meta-2); }
.at-archive__head { display: block; font-weight: 500; }
/* Ældre briefs: kun dato-links, så kolonnen forbliver kort, mens hver
   gemt dato stadig kan nås. Mål på mindst 24 px (WCAG 2.2, målstørrelse). */
.at-archive__older { margin: 10px 12px 0; }
.at-archive__dates { margin: 0 0 0 -8px; padding: 0; list-style: none; display: flex; flex-wrap: wrap; gap: 2px 4px; }
.at-archive__datelink { display: inline-block; min-height: 24px; padding: 3px 8px; border-radius: var(--at-r-sm); font-size: var(--at-fs-meta); font-variant-numeric: tabular-nums; color: var(--at-ink); }
.at-archive__datelink:hover { background: var(--at-canvas-2); opacity: 1; }

/* ---------------------------------------------------------------------------
   Mine dashboards: fliser, redigeringsring, stiplet "Tilføj kort"
   ------------------------------------------------------------------------ */
.at-tile { position: relative; padding: 18px 20px; transition: box-shadow 0.2s ease; }
.is-editing .at-tile, .at-tile.is-editing { box-shadow: var(--at-ring-edit); }
.at-tile__tools { position: absolute; top: 12px; right: 12px; display: flex; gap: 6px; }
.at-addtile {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px;
  width: 100%; min-height: 180px; padding: 16px;
  border: 2px dashed var(--at-blue-200); border-radius: var(--at-r-card); background: transparent;
  font-family: inherit; font-size: var(--at-fs-body); font-weight: 600; color: var(--at-cobalt);
  text-align: center; cursor: pointer;
}
.at-addtile:hover { background: rgba(255, 255, 255, 0.55); opacity: 1; }
.at-addtile svg { width: 22px; height: 22px; }
.at-addtile__sub { font-size: var(--at-fs-meta); font-weight: 400; color: var(--at-meta-2); }

/* ---------------------------------------------------------------------------
   Grafer (web/charts.py). Én <svg role="img"> pr. graf, strakt til plottet;
   gitterlinjer og y-etiketter er HTML til højre, x-etiketter under.
   Periodevarianterne ligger som .at-chart__v[data-per] i samme figur.
   ------------------------------------------------------------------------ */
.at-chart { position: relative; width: 100%; min-width: 0; margin: 0; }
.at-chart > figcaption { display: flex; flex-direction: column; gap: 6px; margin-top: 10px; }
.at-chart__plot { position: relative; height: 210px; margin-top: 18px; }
.at-chart__plot--tall, .at-chart--tall .at-chart__plot { height: 340px; margin-top: 22px; }
.at-chart__plot--lab, .at-chart--lab .at-chart__plot, .at-chart--bars .at-chart__plot { height: 250px; }
.at-chart__plot--stock { height: 240px; }
/* Etiket-lagene er ikke positionerede, så etiketterne står i forhold til plottet. */
.at-chart__ylabels, .at-chart__yls { position: static; }
.at-chart__gl { position: absolute; left: 0; right: 52px; display: block; height: 0; border-top: 1px solid var(--at-chart-grid); }
.at-chart__gl--hi { top: 5%; }
.at-chart__gl--mid { top: 50%; }
.at-chart__gl--lo { top: 95%; }
.at-chart__yl {
  position: absolute; right: 0; transform: translateY(-50%);
  font-size: var(--at-fs-meta); line-height: 1.2; color: var(--at-meta);
  font-variant-numeric: tabular-nums; white-space: nowrap;
}
.at-chart__yl--hi { top: 5%; }
.at-chart__yl--mid { top: 50%; }
.at-chart__yl--lo { top: 95%; }
.at-chart .at-chart__svg {
  position: absolute; left: 0; top: 0; display: block;
  width: calc(100% - 60px); height: 100%; overflow: visible;
}
.at-chart__area { fill: var(--at-chart-line); fill-opacity: 0.07; stroke: none; }
.at-chart__line {
  fill: none; stroke: var(--at-chart-line); stroke-width: 2;
  stroke-linejoin: round; stroke-linecap: round; vector-effect: non-scaling-stroke;
}
.at-chart__line--s1 { stroke: var(--at-chart-s1); }
.at-chart__line--s2 { stroke: var(--at-chart-s2); }
.at-chart__line--s3 { stroke: var(--at-chart-s3); }
.at-chart__line--clay { stroke: var(--at-clay); }
.at-chart__zero { fill: none; stroke: var(--at-grey); stroke-width: 1; stroke-dasharray: 4 4; vector-effect: non-scaling-stroke; }
.at-chart__band { fill: var(--at-canvas-2); }
.at-chart__x {
  display: flex; justify-content: space-between; gap: 12px;
  margin-top: 8px; padding-right: 60px;
  font-size: var(--at-fs-meta); color: var(--at-meta); font-variant-numeric: tabular-nums;
}
.at-chart__x > .at-chart__xv { flex: 1 1 auto; display: flex; justify-content: space-between; gap: 12px; }
.at-chart__note { font-size: var(--at-fs-meta); color: var(--at-meta); }

/* Bred etiket-rende (charts.py sætter --wide ved lange y-etiketter) */
.at-chart--wide .at-chart__gl { right: 84px; }
.at-chart--wide .at-chart__svg { width: calc(100% - 92px); }
.at-chart--wide .at-chart__x { padding-right: 92px; }

/* Søjlefigurer (Factor Lab): kategori-etiketter, én plads pr. søjle */
.at-chart__x--cats { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 0; }
.at-chart__x--cats > span { overflow: hidden; text-align: center; white-space: nowrap; text-overflow: clip; }

/* Periodevarianter: kun den valgte vises. Uden :has() viser browseren
   standardperioden alene (charts.py mærker de andre --off). */
@supports not selector(:has(*)) {
  .at-chart__v--off { display: none; }
}
/* Knapperne står i figurens radiogruppe (> .at-per > …); den direkte form (> .at-per__in)
   gælder stadig for håndskrevet markup (fx /_design). */
.at-chart:has(> .at-per > .at-per__in[value="1y"]:checked, > .at-per__in[value="1y"]:checked) .at-chart__v:not([data-per="1y"]),
.at-chart:has(> .at-per > .at-per__in[value="5y"]:checked, > .at-per__in[value="5y"]:checked) .at-chart__v:not([data-per="5y"]),
.at-chart:has(> .at-per > .at-per__in[value="max"]:checked, > .at-per__in[value="max"]:checked) .at-chart__v:not([data-per="max"]) { display: none; }

/* Tom figur: en rolig grå flade med den ærlige grund, aldrig en tom akse */
.at-chart--empty { display: flex; flex-direction: column; gap: 10px; margin-top: 14px; }
.at-chart--empty > p, .at-chart--empty > .at-muted {
  padding: 28px 18px; border-radius: var(--at-r-xs);
  background: var(--at-canvas-2); color: var(--at-ink-soft); text-align: center; text-wrap: pretty;
}

/* Tvær-oversigt (z-scores): navne og værdier er HTML-rækker, søjlerne én svg
   over midterkolonnen. Rækkehøjden (30px) matcher svg'ens 30 enheder pr. række. */
.at-chart--z { --at-zl: 11rem; --at-zv: 4.5rem; }
.at-chart__zplot { position: relative; margin-top: 12px; }
.at-chart__zrows { margin: 0; padding: 0; list-style: none; }
.at-chart__zrows > li {
  display: grid; grid-template-columns: var(--at-zl) minmax(0, 1fr) var(--at-zv);
  align-items: center; gap: 12px; height: 30px; font-size: var(--at-fs-meta);
}
.at-chart__zlab { grid-column: 1; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; color: var(--at-ink); }
.at-chart__zval { grid-column: 3; text-align: right; font-variant-numeric: tabular-nums; color: var(--at-ink); }
.at-chart--z .at-chart__zsvg {
  position: absolute; top: 0; left: calc(var(--at-zl) + 12px);
  width: calc(100% - var(--at-zl) - var(--at-zv) - 24px); height: 100%;
}
.at-chart--z .at-chart__zaxis { padding: 0 calc(var(--at-zv) + 12px) 0 calc(var(--at-zl) + 12px); }

/* Sparkline-stien (svg_sparkline): farven fra klassen, aldrig hex i markup */
.at-spark__line {
  fill: none; stroke: var(--at-chart-line); stroke-width: 1.8;
  stroke-linejoin: round; stroke-linecap: round; vector-effect: non-scaling-stroke;
}


/* ---------------------------------------------------------------------------
   Offentlig flade (base_public.html): lys header som forsidens nav, indhold på
   #f5f6fa med hvide kort, navy footer. Ingen links ind i appen herfra.
   ------------------------------------------------------------------------ */
.at-public { min-height: 100vh; display: flex; flex-direction: column; background: var(--at-land-bg); }
.at-pubhead { background: var(--at-land-bg); color: var(--at-ink); }
.at-pubhead__inner {
  width: 100%; max-width: 1240px; margin: 0 auto;
  display: flex; flex-wrap: wrap; align-items: center; gap: 12px 28px;
  padding: 20px clamp(16px, 5vw, 64px);
}
.at-pubhead .at-brand { color: var(--at-ink); }
.at-pubhead .at-beta { margin-left: -16px; background: var(--at-blue-050); color: var(--at-navy-700); }
.at-pubnav { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 26px; margin-left: auto; }
.at-pubnav a { font-size: 15px; color: var(--at-ink-soft); }
.at-pubnav a:hover, .at-pubnav a[aria-current] { color: var(--at-ink); opacity: 1; }
.at-pubhead__user { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; }
.at-pubhead__user form { margin: 0; }
.at-pubhead .at-plan--none { color: var(--at-ink-soft); box-shadow: inset 0 0 0 1px var(--at-line-2); }
.at-pubhead__mail { font-size: var(--at-fs-meta); color: var(--at-ink-soft); max-width: 22ch; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* <main class="at-page"> er ens i begge baser (testlåst); den offentlige
   variant styres af forælderen .at-public. */
.at-public > .at-page {
  max-width: calc(1120px + 2 * clamp(16px, 5vw, 64px));
  padding: clamp(20px, 3vw, 40px) clamp(16px, 5vw, 64px) 88px;
  gap: 22px; background: transparent;
}
/* :where() holder specificiteten på et elementniveau, så klassestilede h1'ere
   (login-kortet, murens titel på csrf-siden) beholder deres egen størrelse. */
:where(.at-public > .at-page) h1 { font-size: clamp(26px, 3vw, 32px); letter-spacing: -0.03em; line-height: 1.2; text-wrap: balance; }
.at-public > .at-page > header { display: flex; flex-direction: column; gap: 6px; }
.at-public .at-muted { color: var(--at-ink-soft); }

/* Sektioner og prisblokke (priser, metode, vælg pakke) */
.at-sect { width: 100%; max-width: 1120px; margin: 0 auto; padding: 0; }
.at-sect__sub { font-size: var(--at-fs-title); color: var(--at-ink-soft); max-width: 62ch; text-wrap: pretty; }
.at-price {
  display: flex; flex-direction: column; gap: 12px;
  padding: 26px; border-radius: 24px;
  background: var(--at-surface); box-shadow: var(--at-shadow-card);
}
.at-price--featured { box-shadow: var(--at-ring-pick), var(--at-shadow-card); }
.at-price h2, .at-price h3 { font-size: var(--at-fs-title); }
.at-price__amount { display: flex; align-items: baseline; gap: 6px; }
.at-price__kr { font-size: 38px; font-weight: 600; letter-spacing: -0.03em; line-height: 1.1; font-variant-numeric: tabular-nums; }
.at-price__per { font-size: var(--at-fs-meta); font-weight: 400; color: var(--at-meta); }
/* RUN 4, Part 2: »inkl. moms« ved hvert planbeløb, sit eget element (grå metatekst). */
.at-price__vat { font-size: var(--at-fs-meta); font-weight: 500; color: var(--at-ink-soft); }
.at-feat { display: flex; flex-direction: column; gap: 10px; margin: 0; padding: 0; list-style: none; }
.at-feat li { display: flex; align-items: flex-start; gap: 10px; color: var(--at-ink); }
/* Fluebenet er tegnet med kanter (ingen billed-URL): kobolt for "Live nu",
   en stiplet grå ring for "På vej". */
.at-feat li::before {
  content: ""; flex: 0 0 auto; width: 5px; height: 10px; margin: 4px 7px 0 5px;
  border: solid var(--at-cobalt); border-width: 0 2px 2px 0; border-radius: 1px;
  transform: rotate(45deg);
}
.at-feat--soon li { color: var(--at-ink-soft); }
.at-feat--soon li::before {
  width: 12px; height: 12px; margin: 5px 2px 0 2px;
  border: 1.5px dashed var(--at-grey); border-radius: 50%; transform: none;
}

/* Login og kvitteringssider */
.at-authwrap { display: grid; place-items: center; padding: clamp(16px, 5vh, 56px) 0; }
.at-authcard {
  width: 100%; max-width: 440px;
  display: flex; flex-direction: column; gap: 16px;
  padding: clamp(24px, 4vw, 36px); border-radius: var(--at-r-panel);
  background: var(--at-surface); box-shadow: var(--at-shadow-lg);
}
.at-authcard h1 { font-size: var(--at-fs-display); letter-spacing: var(--at-tighter); }
.at-authcard__sub { color: var(--at-ink-soft); }

/* ---------------------------------------------------------------------------
   Footer (_footer.html): navy #0b1540. Strukturen er testlåst; kun CSS her.
   ------------------------------------------------------------------------ */
.at-footer { background: var(--at-navy-950); color: var(--at-on-navy-2); font-size: var(--at-fs-meta); line-height: 1.55; }
.at-footer__inner {
  width: 100%; max-width: 1240px; margin: 0 auto;
  /* min(200px, 100%): ved 200 % zoom (195 CSS-px) fylder én kolonne beholderen. */
  display: grid; gap: 28px 32px; grid-template-columns: repeat(auto-fit, minmax(min(200px, 100%), 1fr));
  padding: 44px clamp(16px, 5vw, 64px) 28px;
}
.at-footer h2 { margin: 0 0 10px; font-size: var(--at-fs-body); font-weight: 600; letter-spacing: 0; color: var(--at-on-navy); }
.at-footer p { color: var(--at-on-navy-2); }
.at-footer ul { display: flex; flex-direction: column; gap: 6px; margin: 0; padding: 0; list-style: none; }
.at-footer a { color: var(--at-on-navy); }
.at-footer a:hover { color: #ffffff; opacity: 1; text-decoration: underline; text-underline-offset: 2px; }
.at-footer__notice { margin-top: 12px; color: var(--at-nav-icon-off); }
.at-footer__bottom {
  width: 100%; max-width: 1240px; margin: 0 auto;
  padding: 0 clamp(16px, 5vw, 64px) 24px; color: var(--at-nav-icon-off);
}
.at-footer__inner + .at-footer__bottom::before {
  content: ""; display: block; height: 1px; margin-bottom: 18px; background: rgba(170, 180, 214, 0.2);
}
.at-footer__bottom[data-blok] { color: var(--at-on-navy-2); }
.at-footer__bottom:last-child { padding-bottom: 36px; }

/* I appen står footeren under indholdet ved siden af den navy sidebar. Der er
   den en rolig lys blok på app-fladen (handoffens dashboard har ingen footer),
   så sidebaren forbliver den eneste mørke flade. Samme markup, byte-identisk. */
.at-main > .at-footer { background: transparent; color: var(--at-meta-2); border-top: 1px solid var(--at-line-2); }
.at-main > .at-footer .at-footer__inner,
.at-main > .at-footer .at-footer__bottom { max-width: calc(var(--at-page-max) + 2 * clamp(16px, 3vw, 40px)); padding-left: clamp(16px, 3vw, 40px); padding-right: clamp(16px, 3vw, 40px); }
.at-main > .at-footer .at-footer__inner { padding-top: 32px; }
.at-main > .at-footer h2 { color: var(--at-ink); }
.at-main > .at-footer p, .at-main > .at-footer li { color: var(--at-meta-2); }
.at-main > .at-footer a { color: var(--at-ink-soft); }
.at-main > .at-footer a:hover { color: var(--at-ink); }
.at-main > .at-footer .at-footer__notice, .at-main > .at-footer .at-footer__bottom { color: var(--at-meta-2); }
.at-main > .at-footer .at-footer__inner + .at-footer__bottom::before { background: var(--at-line-2); }
.at-main > .at-footer :focus-visible { outline-color: var(--at-cobalt); }

/* ---------------------------------------------------------------------------
   Små hjælpekomponenter
   ------------------------------------------------------------------------ */
/* Ja/Nej-prik (Positivlisten): ordet bærer betydningen, prikken støtter */
.at-yesno { display: inline-flex; align-items: center; gap: 8px; font-size: var(--at-fs-meta); color: var(--at-navy-700); white-space: nowrap; }
.at-yesno::before { content: ""; width: 10px; height: 10px; flex: 0 0 10px; border-radius: 50%; background: var(--at-cobalt); }
.at-yesno--nej { color: var(--at-meta); }
.at-yesno--nej::before { background: transparent; box-shadow: inset 0 0 0 2px #cfd4e2; }

/* Indlæsning: tomme grå felter i værdiens højde, aldrig falske tal, intet shimmer */
.at-skel { display: inline-block; width: 6ch; height: 1em; border-radius: 6px; background: var(--at-canvas-2); vertical-align: middle; }
.at-skel--block { display: block; width: 100%; height: 210px; border-radius: var(--at-r-xs); }

/* Eksempel-mærke: synligt på alt, der viser illustrative (ikke rigtige) værdier */
.at-example {
  display: inline-flex; align-items: center; padding: 2px 10px; border-radius: var(--at-r-pill);
  font-size: var(--at-fs-meta); font-weight: 600; line-height: 1.55;
  background: var(--at-warn-soft); color: var(--at-warn);
}

/* Designreferencen (/_design): farveprøver og demo-flader */
.at-swatches { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px; }
.at-swatch { display: flex; flex-direction: column; gap: 2px; font-size: var(--at-fs-meta); color: var(--at-ink-soft); }
.at-swatch__chip { height: 56px; margin-bottom: 6px; border-radius: var(--at-r-sm); box-shadow: inset 0 0 0 1px rgba(15, 28, 85, 0.08); }
.at-swatch__name { font-weight: 600; color: var(--at-ink); }
.at-demo { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.at-demo--navy { padding: 16px; border-radius: var(--at-r-card); background: var(--at-navy-900); color: var(--at-on-navy); }
.at-demo--canvas { padding: 24px; border-radius: var(--at-r-card); background: var(--at-canvas); }
.at-demo + .at-demo { margin-top: 16px; }
.at-demo > .at-searchbig { flex: 1 1 100%; }
.at-card__head + .at-quad { margin-top: 14px; }
.at-demo__label { width: 100%; font-size: var(--at-fs-meta); color: var(--at-meta); }
.at-demo--navy .at-demo__label { color: var(--at-on-navy-2); }
.at-typescale > * + * { margin-top: 10px; }

/* ---------------------------------------------------------------------------
   Responsiv. Ét brudpunkt som handoffen: under 900px bliver sidebaren en
   skuffe bag menuknappen i den sticky topbar, og alle kolonnegitre bliver
   én kolonne. Tabeller beholder deres kolonner og scroller i .at-tablewrap.
   ------------------------------------------------------------------------ */
@media (max-width: 899.98px) {
  .at-mobilebar { display: flex; }
  /* Den sticky topbar (60px) må ikke dække et fokuseret element ved omvendt Tab
     (WCAG 2.4.11): 60px + 12px luft. Kun på app-sider, der har topbaren. */
  html:has(.at-mobilebar) { scroll-padding-top: 72px; }
  .at-drawerclose {
    display: inline-flex; align-items: center; justify-content: center;
    align-self: flex-end; flex: 0 0 auto;
    width: 44px; height: 44px; margin: -8px 0 8px; padding: 0;
    border: 0; border-radius: var(--at-r-sm);
    background: var(--at-navy-800); color: var(--at-on-navy); cursor: pointer;
  }
  .at-drawerclose svg { width: 20px; height: 20px; }
  .at-sidebar {
    display: none; position: fixed; left: 0; top: 0; bottom: 0;
    height: 100vh; height: 100dvh;
  }
  .at-sidebar.is-open { display: flex; }
  .at-backdrop.is-open, .at-sidebar.is-open ~ .at-backdrop { display: block; }
  body:has(.at-sidebar.is-open) { overflow: hidden; }
  .at-cols-21, .at-cols-11, .at-cols-brief, .at-cols-lab { grid-template-columns: minmax(0, 1fr); }
  .at-brief { justify-self: stretch; }
}
@media (max-width: 759.98px) {
  .at-pubnav { order: 3; width: 100%; margin-left: 0; gap: 6px 20px; }
  /* Mærke, Beta, pakke og Log ud skal kunne stå på én linje ved 390px. */
  .at-pubhead__inner { column-gap: 16px; }
  .at-pubhead .at-beta { margin-left: -4px; }
  .at-pubhead__user { margin-left: auto; gap: 8px; }
  .at-pubhead__mail { display: none; }
}
/* Logget ind (Log ud-formen står i headeren) under 420px: mærke + Beta + pakke + Log ud
   er ca. 350px og brød pakke og Log ud ned på en egen række (tre rækker i alt ved
   360-390px). Beta-mærket viger her (det står også ved ordmærket i appens sidebar), så
   mærke, pakke og Log ud står på én linje og links på den næste. */
@media (max-width: 419.98px) {
  .at-pubhead__inner:has(.at-pubhead__user form) .at-beta { display: none; }
}
@media (max-width: 599.98px) {
  .at-kv { flex-wrap: wrap; }
  .at-wall__actions { gap: 12px 16px; }
  .at-chart--z { --at-zl: 7.5rem; --at-zv: 3.5rem; }
}

/* Bevægelse: intet flytter sig, hvis brugeren har bedt om det */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}

/* ================================================================
   Sidespecifikke tilføjelser. Hvert afsnit herunder er afgrænset til
   sine siders egne klasser; delte komponentregler står ovenfor.
   ================================================================ */

/* ---------------------------------------------------------------------------
   Overblik, Dagens brief og Regime. Kun tokens; alle regler er afgrænset til
   sidernes egne .at-ov*-, .at-brief- og .at-rg*-klasser (eller Overbliks
   .at-pagehead__date og .at-kpis--compact, som kun Overblik bruger).
   ------------------------------------------------------------------------ */

/* Overblik: datoen står på linje med overskriften (handoffens "Overblik  Mandag …") */
.at-pagehead__text:has(.at-pagehead__date) { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 20px; }
.at-pagehead__text:has(.at-pagehead__date) .at-pagehead__lead { margin: 0; }
/* ... og "Opdateret kl." står til højre, også når hovedet ombrydes på mobil (som i handoffens mobilvisning under 900px). */
.at-pagehead:has(.at-pagehead__date) > .at-pagehead__meta { margin-left: auto; }

/* Overblik: kort med fod nederst (brief og regime står lige høje i 2/3 + 1/3) */
.at-ovcard__grow { flex: 1 1 auto; }
.at-ovcard > .at-empty { justify-content: center; }
.at-ovfoot { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin-top: 18px; }
.at-ovfoot__meta { margin-left: auto; display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 6px 10px; min-width: 0; text-align: right; }
.at-ovfoot__meta .at-prov { min-width: 0; }
/* Brief-kortet: den lange AI-proveniens står venstrestillet OVER linket, så linket står
   nederst i kortet på linje med regime-kortets "Se regime →" (Dashboard.dc.html:76-93).
   DOM-rækkefølgen er den viste rækkefølge (ingen order:-1). Regime-kortets meta forbliver
   højrestillet. */
.at-ovfoot--stack .at-ovfoot__meta { flex: 1 1 100%; margin-left: 0; justify-content: flex-start; text-align: left; }

/* Overblik: regime-kortet (to paneler, regelsættets egne etiketter) */
.at-ovregime { display: flex; flex-direction: column; gap: 12px; margin-top: 12px; }
.at-ovregime__name { font-size: var(--at-fs-meta); font-weight: 500; color: var(--at-meta); }
.at-ovregime .at-ovregime__label { margin-top: 2px; }
.at-ovregime__label::first-letter { text-transform: uppercase; }
.at-ovregime__text { margin-top: 2px; color: var(--at-ink); text-wrap: pretty; }

/* Overblik: nøgletal. Kildelinjen står nederst, så kortene i en række flugter. */
.at-kpis--compact > .at-kpi > .at-prov { margin-top: auto; padding-top: 10px; }
.at-ovkpi__nochg { display: block; min-height: calc(var(--at-fs-meta) * 1.55); }
/* Rækkesporene (subgrid) er fælles for alle .at-kpis (se nøgletalskortene). Med subgrid
   flugter kildelinjen allerede, så den kompakte række bruger ikke auto-marginen ovenfor. */
@supports (grid-template-rows: subgrid) {
  .at-kpis--compact > .at-kpi > .at-prov { margin-top: 0; }
}

/* Overblik: kommende begivenheder (Dato 96 · Tid 52 · Udgivelse · Sidst) */
.at-ovcal th:nth-child(1) { width: 96px; }
.at-ovcal th:nth-child(2) { width: 52px; }
.at-ovcal th:nth-child(4) { width: 1%; }
.at-ovcal td.at-ovcal__date { font-size: var(--at-fs-meta); white-space: nowrap; }
.at-ovcal td.at-ovcal__time { font-size: var(--at-fs-meta); color: var(--at-meta); white-space: nowrap; }
.at-ovcal__title { display: block; font-weight: 500; }
.at-ovcal td:last-child, .at-ovcal td:last-child .at-name__sub { white-space: nowrap; }
.at-ovcal td:last-child .at-badge { margin-left: 4px; }
/* Smalt kort: hver begivenhed som en blok (dato, tid og sidste tal på første linje,
   udgivelsen under), så intet skal scrolles vandret. Kolonnehovederne læses stadig.
   Kortet er containeren (.at-ovcq). */
.at-ovcq { container-type: inline-size; }
@media (max-width: 599.98px) {
  .at-ovfoot__meta { margin-left: 0; flex-basis: 100%; justify-content: flex-start; text-align: left; }
}
@container (max-width: 580px) {
  .at-ovcal thead {
    position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0;
    overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
  }
  .at-ovcal tbody tr {
    display: grid; grid-template-columns: auto auto minmax(0, 1fr); column-gap: 12px; row-gap: 4px;
    align-items: baseline; padding: 12px 0; border-bottom: 1px solid var(--at-line-row);
  }
  .at-ovcal tbody td { display: block; padding: 0; border: 0; }
  .at-ovcal td.at-ovcal__date { grid-column: 1; grid-row: 1; }
  .at-ovcal td.at-ovcal__time { grid-column: 2; grid-row: 1; }
  .at-ovcal td:last-child { grid-column: 3; grid-row: 1; text-align: right; }
  .at-ovcal td:last-child .at-name__sub { white-space: normal; }
  .at-ovcal td:nth-child(3) { grid-column: 1 / -1; grid-row: 2; }
}

/* Overblik: Pro-blokken og Basis-kortet */
.at-ovlist { margin-top: 2px; }
.at-ovnote { margin-top: 14px; color: var(--at-ink); }
.at-ovchips { margin-top: 14px; }
.at-ovchips .at-chip { color: var(--at-ink); }
.at-ovupsell { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 28px; }
.at-ovupsell__text { flex: 1 1 260px; min-width: 0; }
.at-ovupsell__text p { margin-top: 4px; max-width: 62ch; color: var(--at-ink); }

/* Dagens brief: afsnit uden sektionsetiketter (briefet er overskrift + afsnit),
   fallback-mærket under overskriften, arkivets immutabilitetsnote og tom tilstand. */
.at-brief__badges { margin-top: 12px; }
.at-brief__sec p + p { margin-top: 14px; }
.at-brief__foot .at-prov { flex: 1 1 100%; }
.at-archive__note { margin-top: 12px; padding: 12px 12px 0; border-top: 1px solid var(--at-line-row); font-size: var(--at-fs-meta); color: var(--at-meta); text-wrap: pretty; }
.at-brief__empty { width: 100%; max-width: 720px; justify-self: center; }

/* Regime: kortenes titel og undertitel på én linje (handoffens "row wrap baseline"). */
.at-rgtitles { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 14px; }

/* Regime: et mørkt kort pr. panel; "uafklaret" får stort forbogstav som overskrift. */
.at-rghero { display: flex; flex-direction: column; }
.at-rghero__title::first-letter { text-transform: uppercase; }
.at-rghero > .at-prov { margin-top: auto; padding-top: 16px; }

/* Regime som koordinatsystem: kvadratisk 2 × 2 (højst 420px), etiketterne i de ydre
   hjørner, "Nu"-mærket midt i den aktive celle, akse-kryds i mellemrummet. */
.at-rgquad { position: relative; width: 100%; max-width: 420px; margin: 18px auto 0; }
.at-rgquad::before, .at-rgquad::after { content: ""; position: absolute; background: var(--at-blue-200); }
.at-rgquad::before { left: 50%; top: 2%; bottom: 2%; width: 1px; margin-left: -0.5px; }
.at-rgquad::after { top: 50%; left: 2%; right: 2%; height: 1px; margin-top: -0.5px; }
.at-rgquad .at-quad { position: relative; z-index: 1; aspect-ratio: 1 / 1; grid-template-rows: repeat(2, minmax(0, 1fr)); }
.at-rgquad .at-quad__cell { position: relative; min-height: 0; justify-content: flex-start; padding: 10px 12px; }
.at-rgquad__label { max-width: 16ch; font-size: var(--at-fs-meta); font-weight: 600; line-height: 1.3; }
.at-quad__cell.at-rgquad__tr, .at-quad__cell.at-rgquad__br { align-items: flex-end; text-align: right; }
.at-quad__cell.at-rgquad__bl, .at-quad__cell.at-rgquad__br { justify-content: flex-end; }
.at-rgquad .at-quad__now { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); align-self: auto; white-space: nowrap; }
.at-rgquad__notes { margin-top: 12px; display: flex; flex-direction: column; gap: 2px; }

/* Aksernes tal og kontekst: navn + kilde under hinanden, periode under tallet. */
.at-rgaxes__panel { margin-top: 16px; font-size: var(--at-fs-body); font-weight: 600; }
.at-rgaxes .at-provcell, .at-rgctx .at-provcell { display: block; }
.at-rgaxes td.at-r, .at-rgctx td.at-r { white-space: nowrap; }
.at-rgaxes td, .at-rgctx td { vertical-align: top; }
.at-rgmetode__lead { margin-top: 12px; color: var(--at-ink); }
/* Smalt kort (mobil, og halvbredde-kort ved 900-1150px): navnet står på egen linje,
   tallene i kolonner under det (ingen vandret scroll). Kolonnehovederne for tallene
   bliver stående over deres kolonner. Kortet er containeren. */
.at-rgcq { container-type: inline-size; }
@container (max-width: 400px) {
  .at-rgaxes { --at-rgcols: 3; }
  .at-rgctx { --at-rgcols: 2; }
  .at-rgaxes tr, .at-rgctx tr {
    display: grid; grid-template-columns: repeat(var(--at-rgcols), minmax(0, 1fr)); column-gap: 12px;
    border-bottom: 1px solid var(--at-line-row);
  }
  .at-rgaxes thead tr, .at-rgctx thead tr { border-bottom-color: var(--at-line); }
  .at-rgaxes th, .at-rgaxes td, .at-rgctx th, .at-rgctx td { display: block; border: 0; padding-left: 0; padding-right: 0; text-align: left; white-space: normal; }
  .at-rgaxes th:first-child, .at-rgctx th:first-child { display: none; }
  .at-rgaxes td:first-child, .at-rgctx td:first-child { grid-column: 1 / -1; padding-bottom: 4px; }
  .at-rgaxes td:not(:first-child), .at-rgctx td:not(:first-child) { padding-top: 0; }
  .at-rgaxes th.at-r, .at-rgaxes td.at-r, .at-rgctx th.at-r, .at-rgctx td.at-r { text-align: left; white-space: normal; }
}

/* ---------------------------------------------------------------------------
   Økonomisider: Økonomi, Renter, Inflation, Kredit og Likviditet
   ------------------------------------------------------------------------ */
/* Økonomi-gruppens nøgletalskort (data-kpi): »afledt« bliver oppe til højre ved siden af
   etiketten, og en lang etiket ombrydes i stedet for at skubbe mærket ned på sin egen
   linje (så kortene i en række ikke får tre forskellige hoveder). */
.at-kpi[data-kpi] .at-kpi__head { flex-wrap: nowrap; align-items: flex-start; }
.at-kpi[data-kpi] .at-kpi__head .at-kpi__label { min-width: 0; }
.at-kpi[data-kpi] .at-kpi__head .at-badge { flex: none; }
/* Økonomi-gruppens modulkort (/renter, /inflation, /kredit, /likviditet;
   _oekonomikort.html): fliser i et gitter med en hårfin streg over hver flise,
   modulets egne figurer nedenunder. Kun tokens; ingen fælles regel ændres. */
.at-module > .at-card__head .at-card__sub { margin-top: 2px; max-width: 80ch; text-wrap: pretty; }
.at-modtiles {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(min(200px, 100%), 1fr));
  gap: 0 36px; margin-top: 12px;
}
.at-modtile {
  display: flex; flex-direction: column; min-width: 0;
  padding: 12px 0 10px; border-top: 1px solid var(--at-line);
}
.at-modtile > .at-prov { margin-top: 8px; }
.at-modtile__win { margin-top: 2px; font-size: var(--at-fs-meta); color: var(--at-meta); overflow-wrap: anywhere; }
.at-modcharts { margin-top: 18px; }
.at-modcharts.at-cols-11 { column-gap: 36px; row-gap: 22px; }
.at-modchart { min-width: 0; }
.at-modchart__title { margin: 0; font-size: var(--at-fs-meta); font-weight: 500; color: var(--at-ink-soft); }
.at-modchart__title + .at-chart > .at-chart__plot { margin-top: 12px; }
/* Metode og tekstmoduler: læsekolonne i kortet */
.at-textcard > p { margin: 10px 0 0; max-width: 80ch; text-wrap: pretty; }
.at-textcard > .at-card__head + p { margin-top: 8px; }
.at-textcard .at-prov { margin-top: 10px; }
.at-textcard__note { color: var(--at-meta); font-size: var(--at-fs-meta); }
/* Inversions-episoder: to tabeller side om side (én kolonne under 900px) */
.at-invcol > h3 { margin: 0; font-size: var(--at-fs-body); font-weight: 600; }
.at-invcol > .at-prov { margin-top: 2px; }
.at-invcol .at-table { margin-top: 4px; }
.at-invcols { column-gap: 40px; row-gap: 22px; }
.at-invcol__last { margin: 10px 0 0; }
.at-invcol > .at-disclosure { margin-top: 8px; }
/* Et ulige sidste kort i et to-kolonne-gitter fylder hele rækken (ingen tom plads). */
.at-cols-11--fill > :last-child:nth-child(odd) { grid-column: 1 / -1; }
/* /oekonomi: indikatortabellen. Samme foretrukne kolonnebredder i alle gruppers tabeller,
   så kortene står i samme kolonner; navn, tal med lang enhed, kilde og en fejltekst må
   ombrydes, så kilde, periode og hentet ikke gemmer sig bag en vandret scroll. */
.at-ektable td { white-space: normal; }
.at-ektable td:nth-child(4) { overflow-wrap: anywhere; }
.at-ektable td.at-ektable__periode, .at-ektable td.at-ektable__hentet { white-space: nowrap; }
.at-ektable th:nth-child(1) { width: 27%; }
.at-ektable th:nth-child(2), .at-ektable th:nth-child(3) { width: 13%; }
.at-ektable th:nth-child(5), .at-ektable th:nth-child(6) { width: 9%; }
/* Smalt kort (mobil, og tablet med sidebar, hvor kortet er smallere end på en mobil på
   tværs): hver række bliver en blok (navn, så værdi og ændring, så kilde, periode og
   hentet), så tallet aldrig gemmer sig bag en vandret scroll og et serie-id aldrig
   brydes midt i. Kolonnehovederne står stadig i markuppen (visuelt skjult). Målt på
   kortets egen bredde (container query), ikke skærmens. */
.at-tablewrap:has(> .at-ektable) { container: ektabel / inline-size; }
@container ektabel (max-width: 719.98px) {
  .at-ektable thead {
    position: absolute; width: 1px; height: 1px; overflow: hidden;
    clip-path: inset(50%); white-space: nowrap;
  }
  .at-ektable, .at-ektable tbody { display: block; }
  .at-ektable tr {
    display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 12px;
    padding: 11px 0; border-bottom: 1px solid var(--at-line-row);
  }
  .at-ektable td { display: block; padding: 0; border: 0; white-space: normal; text-align: left; }
  .at-ektable td:first-child { flex: 1 0 100%; }
  .at-ektable td.at-provcell { font-size: var(--at-fs-meta); }
  .at-ektable td:nth-child(4) { flex: 1 0 100%; margin-top: 2px; }
  .at-ektable .at-ektable__periode::before { content: "Periode "; }
  .at-ektable .at-ektable__hentet::before { content: "Hentet "; }
}

/* ---------------------------------------------------------------------------
   Markeder, Valuta, Positionering, Kalender og Grafer. Kun tokens; reglerne er
   afgrænset til sidernes egne klasser (.at-modfig, .at-modtab, .at-kal*, .at-graf*,
   .at-grafvalg*).
   ------------------------------------------------------------------------ */
/* Modulernes figurer (Valuta, Positionering): to kolonner under tabellen, én under 900px. */
.at-modfig { margin-top: 18px; column-gap: 28px; row-gap: 26px; }
.at-modfig__cell { min-width: 0; }
/* Kilde-, periode- og hentet-cellerne er metatekst (13px): ".at-table td" (0,1,1) slog
   ellers ".at-provcell" (0,1,0), så cellerne stod i brødtekstens størrelse og farve. */
.at-table.at-modtab td.at-provcell { font-size: var(--at-fs-meta); color: var(--at-meta-2); }
/* Navnet og kilden må ombrydes, så tabellen passer i kortet; periode og hentet står
   på én linje ("pr. 22.09.2026" deles aldrig). */
.at-table.at-modtab td:first-child, .at-table.at-modtab td:nth-child(3) { white-space: normal; }
/* Modulernes tabeller (Valuta, Positionering): når KORTET er smallere end 720px, bliver
   hver række navn og værdi på første linje og kilde, periode og hentet på næste, så
   værdien og dens herkomst altid ses. Kortets bredde, ikke skærmens, afgør det: fra 900
   til 1160px er kortet smallere end tabellens fem kolonner (samme mønster som
   .at-ektable). */
.at-tablewrap:has(> .at-modtab) { container: modtab / inline-size; }
@container modtab (max-width: 719.98px) {
  .at-modtab, .at-modtab tbody { display: block; }
  .at-modtab thead {
    position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0;
    overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
  }
  .at-modtab tr {
    display: grid; grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas: "navn vaerdi" "kilde kilde" "periode hentet";
    align-items: baseline; column-gap: 12px; row-gap: 1px;
    padding: 11px 0; border-bottom: 1px solid var(--at-line-row);
  }
  .at-table.at-modtab td { display: block; padding: 0; border: 0; white-space: normal; min-width: 0; }
  .at-table.at-modtab td:nth-child(1) { grid-area: navn; }
  .at-table.at-modtab td:nth-child(2) { grid-area: vaerdi; }
  .at-table.at-modtab td:nth-child(3) { grid-area: kilde; margin-top: 2px; }
  .at-table.at-modtab td:nth-child(4) { grid-area: periode; }
  .at-table.at-modtab td:nth-child(5) { grid-area: hentet; text-align: right; }
  .at-table.at-modtab td.at-provcell[data-label]::before { content: attr(data-label) " "; }
}
/* Brief 66: markedsdata fra Sharadar (Markeder, Overblik, Kredit). Kun tokens. Retningen er
   tekstfarve (.at-chg), aldrig en celleflade, også i sektor-heatmappet. Kronerne står under
   dollaren i samme celle, så DKK altid står ved siden af USD. */
.at-mkt__dkk { display: block; margin-top: 1px; }
.at-mkt__cur { font-size: var(--at-fs-meta); font-weight: 400; color: var(--at-meta); }
.at-ovmkt__chg { display: block; }
.at-table.at-mkttab td.at-provcell { font-size: var(--at-fs-meta); color: var(--at-meta-2); }
.at-table.at-mkttab td:first-child, .at-table.at-heat td:first-child { white-space: normal; }
/* ETF-tabellen: når KORTET er smallere end 720px, bliver hver række navn og kurs, så de tre
   ændringer side om side, så kilde, periode og hentet (samme mønster som .at-modtab). */
.at-tablewrap:has(> .at-mkttab) { container: mkttab / inline-size; }
@container mkttab (max-width: 719.98px) {
  .at-mkttab, .at-mkttab tbody { display: block; }
  .at-mkttab thead {
    position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0;
    overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
  }
  .at-mkttab tr {
    display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
    grid-template-areas: "navn navn kurs" "d1 m1 ytd" "kilde periode hentet";
    align-items: baseline; column-gap: 12px; row-gap: 6px;
    padding: 11px 0; border-bottom: 1px solid var(--at-line-row);
  }
  .at-table.at-mkttab td {
    display: block; padding: 0; border: 0; white-space: normal; min-width: 0; text-align: left;
  }
  .at-table.at-mkttab td:nth-child(1) { grid-area: navn; }
  .at-table.at-mkttab td:nth-child(2) { grid-area: kurs; text-align: right; }
  .at-table.at-mkttab td:nth-child(3) { grid-area: d1; }
  .at-table.at-mkttab td:nth-child(4) { grid-area: m1; }
  .at-table.at-mkttab td:nth-child(5) { grid-area: ytd; }
  .at-table.at-mkttab td:nth-child(6) { grid-area: kilde; }
  .at-table.at-mkttab td:nth-child(7) { grid-area: periode; }
  .at-table.at-mkttab td:nth-child(8) { grid-area: hentet; }
  .at-table.at-mkttab td[data-label]::before {
    content: attr(data-label); display: block; font-size: var(--at-fs-meta); color: var(--at-meta);
  }
}
/* Sektor-heatmappet: under 480px står sektoren på sin egen linje og de tre perioder under. */
.at-tablewrap:has(> .at-heat) { container: heat / inline-size; }
@container heat (max-width: 479.98px) {
  .at-heat, .at-heat tbody { display: block; }
  .at-heat thead {
    position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0;
    overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
  }
  .at-heat tr {
    display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
    grid-template-areas: "navn navn navn" "d1 m1 ytd";
    column-gap: 12px; row-gap: 6px; padding: 11px 0; border-bottom: 1px solid var(--at-line-row);
  }
  .at-table.at-heat td {
    display: block; padding: 0; border: 0; white-space: normal; min-width: 0; text-align: left;
  }
  .at-table.at-heat td:nth-child(1) { grid-area: navn; }
  .at-table.at-heat td:nth-child(2) { grid-area: d1; }
  .at-table.at-heat td:nth-child(3) { grid-area: m1; }
  .at-table.at-heat td:nth-child(4) { grid-area: ytd; }
  .at-table.at-heat td[data-label]::before {
    content: attr(data-label); display: block; font-size: var(--at-fs-meta); color: var(--at-meta);
  }
}
/* Kalender (D15): én tabel (Dato | Tid | Udgivelse + kilde | Sidste tal). Udgivelsen og
   sidste tal står i to linjer; under 600px bliver hver række to linjer i et gitter. */
.at-kal__time { font-variant-numeric: tabular-nums; }
.at-kal__time--none { color: var(--at-meta); }
.at-table td.at-kal__what { white-space: normal; }
.at-kal__title { display: block; font-weight: 500; }
.at-kal__flag { font-weight: 400; color: var(--at-meta); }
.at-kal__src { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 8px; font-size: var(--at-fs-meta); color: var(--at-meta); }
.at-kal__src .at-badge, .at-kal__asof .at-badge { padding: 0 8px; }
.at-kal__last .at-val { display: block; font-weight: 400; }
/* Serie-id og periode må ombrydes, så "Sidste tal" aldrig bliver bredere end kortet
   (fra 600 til 900px skar kortet ellers kolonnen af). */
.at-kal__asof { display: flex; justify-content: flex-end; align-items: center; flex-wrap: wrap; gap: 6px; font-size: var(--at-fs-meta); color: var(--at-meta); white-space: normal; }
.at-kal__foot { display: flex; flex-direction: column; gap: 4px; margin-top: 14px; font-size: var(--at-fs-meta); color: var(--at-meta); text-wrap: pretty; }
.at-kal__lbl { display: none; }
@media (max-width: 599.98px) {
  .at-kal, .at-kal tbody { display: block; }
  .at-kal thead {
    position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0;
    overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
  }
  .at-kal tr {
    display: grid; grid-template-columns: auto minmax(0, 1fr);
    grid-template-areas: "date time" "what what" "last last";
    column-gap: 10px; row-gap: 3px; padding: 12px 0; border-bottom: 1px solid var(--at-line-row);
  }
  .at-table.at-kal td { display: block; padding: 0; border: 0; }
  .at-table.at-kal td.at-kal__date { grid-area: date; font-size: var(--at-fs-meta); color: var(--at-meta); }
  .at-table.at-kal td.at-kal__time { grid-area: time; font-size: var(--at-fs-meta); color: var(--at-meta); }
  /* Uden klokkeslæt står datoen alene: "–" lige efter datoen på samme linje læses som
     et datointerval ("28. sep. –"). Kolonnens "–" fra 600px er urørt. */
  .at-table.at-kal td.at-kal__time--none { display: none; }
  .at-table.at-kal td.at-kal__time:not(.at-kal__time--none)::before { content: "kl. "; }
  .at-kal__what { grid-area: what; }
  .at-table.at-kal td.at-kal__last {
    grid-area: last; display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 8px;
    margin-top: 2px; text-align: left;
  }
  .at-kal__lbl { display: inline; font-size: var(--at-fs-meta); color: var(--at-meta); }
  .at-kal__last .at-val { display: inline; }
  .at-kal__asof { justify-content: flex-start; flex-wrap: wrap; white-space: normal; }
}
/* Grafer (D16): valgte serier som chips i kortets hoved (et klik fjerner), periodevælger
   til højre, værdi-linje for én serie, serievalget grupperet pr. domæne nedenunder. */
.at-graf > .at-card__head { align-items: center; }
/* Grafer vælger perioden med links (valget følger URL'en); figurens skjulte
   radioknapper har ingen synlig etiket her og tages ud af tab-rækkefølgen. :checked
   gælder stadig, så den valgte variant vises uændret. */
.at-graf .at-per, .at-graf .at-per__in { display: none; }
.at-graf__valgte { flex: 1 1 260px; min-width: 0; }
.at-graf__per { margin-left: auto; }
.at-graf__x { display: block; width: 14px; height: 14px; flex: 0 0 14px; margin-right: -4px; opacity: 0.8; }
.at-graf__tile { margin-top: 16px; display: flex; flex-direction: column; gap: 2px; }
.at-graf__name { font-size: var(--at-fs-meta); color: var(--at-meta); }
.at-graf__row { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 16px; }
.at-graf__value { font-size: var(--at-fs-display); font-weight: 600; letter-spacing: var(--at-tight); line-height: 1.55; font-variant-numeric: tabular-nums; }
.at-graf__tile > .at-prov { margin-top: 4px; }
.at-graf__band { font-size: var(--at-fs-meta); color: var(--at-meta); }
.at-graf__band .at-badge { padding: 0 8px; }
.at-graf__idx { margin-top: 16px; display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; font-size: var(--at-fs-meta); color: var(--at-meta); }
.at-graf__note { margin-top: 8px; font-size: var(--at-fs-meta); color: var(--at-ink-soft); max-width: 72ch; text-wrap: pretty; }
.at-grafvalg__group { margin-top: 16px; }
.at-grafvalg__group > h3 { margin: 0 0 8px; font-size: var(--at-fs-meta); font-weight: 500; color: var(--at-meta); letter-spacing: 0; }

/* ---------------------------------------------------------------------------
   Værktøjer: Positivlisten, Alerts, Copilot og Mine dashboards. Kun tokens; alle
   regler er afgrænset til sidernes egne .at-pl*, .at-al*, .at-cp* og .at-db*-
   klasser (eller til komponenter INDE i dem). Ingen delt komponentregel er
   ændret.
   ------------------------------------------------------------------------ */

/* Positivlisten: filterrækken (visning + indkomstår), handoffens gap 12 */
.at-plbar { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 24px; }
.at-plbar__years { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; }
.at-plbar__years .at-chip { min-width: 58px; justify-content: center; }
/* Årschips står på lærredet (#eef1f7), hvor chip-grundtonen (#f2f4f9) forsvinder:
   de ikke-valgte år får filtersegmentets hvide flade og lette skygge. */
.at-plbar__years a.at-chip { background: var(--at-surface); box-shadow: var(--at-shadow-float); }
.at-plbar__years a.at-chip:hover { background-color: var(--at-blue-050); }
/* Resultatkortet: handoffens polstring (10/24/18), hovedet som tabelhoved */
.at-plres { padding: 14px 24px 18px; }
.at-plres > .at-card__head { padding-bottom: 12px; border-bottom: 1px solid var(--at-line); }
.at-plres__note { margin-top: 16px; max-width: 72ch; color: var(--at-ink); text-wrap: pretty; }
.at-plres__trunc { margin-top: 14px; }
.at-plgroup { padding: 18px 0 16px; border-bottom: 1px solid var(--at-line-row); }
.at-plgroup__head { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; }
.at-plgroup__name { font-size: var(--at-fs-title); font-weight: 600; letter-spacing: -0.01em; line-height: 1.35; overflow-wrap: anywhere; }
.at-plgroup__head .at-yesno { margin-left: auto; }
.at-plgroup__text { margin-top: 8px; max-width: 80ch; color: var(--at-ink); text-wrap: pretty; }
.at-plgroup__note { margin-top: 6px; max-width: 80ch; font-size: var(--at-fs-meta); color: var(--at-meta); }
.at-plgroup .at-tablewrap { margin-top: 10px; }
/* Den ordrette række fra Skattestyrelsen: ti kolonner, 13px, hoveder må brydes */
.at-pltable th { white-space: normal; padding-top: 4px; }
.at-pltable td { font-size: var(--at-fs-meta); vertical-align: top; }
.at-pltable td:nth-child(2), .at-pltable td:nth-child(4) { white-space: nowrap; font-variant-numeric: tabular-nums; }
/* Gruppen bærer selv skillelinjen; tabellens sidste række må ikke tegne en til (dobbeltstreg). */
.at-pltable tbody tr:last-child td { border-bottom: 0; }
/* Fra 600px: ét fast kolonnegitter for alle gruppetabeller, så kolonnerne flugter kort for
   kort (handoffens ene rækkeskabelon). min-width holder tabellen bred nok til de ubrydelige
   ISIN/LEI; er kortet smallere, ruller .at-tablewrap som hidtil. Hovederne brydes kun ved
   mellemrum (bredderne rummer »Skattemæssigt«, »andelsklasse«, »CVR/SE/TIN«). */
@media (min-width: 600px) {
  .at-pltable { table-layout: fixed; width: 100%; min-width: 1060px; }
  .at-pltable th, .at-pltable td { min-width: 0; }
  .at-pltable td { overflow-wrap: anywhere; }
  .at-pltable th:nth-child(1) { width: 9%; }
  .at-pltable th:nth-child(2) { width: 11.5%; }
  .at-pltable th:nth-child(3) { width: 8.5%; }
  .at-pltable th:nth-child(4) { width: 19%; }
  .at-pltable th:nth-child(5) { width: 8%; }
  .at-pltable th:nth-child(6) { width: 11.5%; }
  .at-pltable th:nth-child(7) { width: 5.5%; }
  .at-pltable th:nth-child(8) { width: 10%; }
  .at-pltable th:nth-child(9) { width: 9%; }
  .at-pltable th:nth-child(10) { width: 8%; }
}
.at-plres__foot { display: flex; flex-direction: column; gap: 6px; margin-top: 16px; }
.at-plres__changes .at-badge { margin: 2px 2px 2px 0; }
.at-plres .at-prov a.at-plres__link { color: var(--at-cobalt); font-weight: 500; }
.at-plask { padding: 16px 24px 18px; }
.at-plask p { margin-top: 8px; max-width: 80ch; color: var(--at-ink); text-wrap: pretty; }
/* 390px: den ordrette tabel holder hver række på én linje og ruller vandret i kortet */
@media (max-width: 599.98px) {
  .at-plres, .at-plask { padding-left: 18px; padding-right: 18px; }
  .at-pltable th, .at-pltable td { white-space: nowrap; min-width: 0; }
  .at-plgroup__head .at-yesno { margin-left: 0; }
}

/* Alerts: "Ny alert"-kortet (14/16) og listekortene (10/22/14) */
.at-alform > .at-card__body { padding-top: 14px; }
.at-alform .at-formrow > .at-btn { padding: 0 22px; }
.at-alform__error { margin-bottom: 10px; }
.at-alform__hint { margin-top: 10px; max-width: 80ch; }
.at-allist { padding: 14px 22px 14px; }
.at-allist > .at-card__head { padding-bottom: 2px; }
.at-allist__empty { margin: 12px 0 4px; max-width: 72ch; color: var(--at-ink); text-wrap: pretty; }
.at-allist .at-alert__title { overflow-wrap: anywhere; }
/* "Deaktivér" er handoffens stille tekst-handling; større klikflade uden at flytte linjen */
.at-allist__action { padding: 8px 6px; margin: -8px -6px; }
.at-alinfo p { margin-top: 8px; max-width: 80ch; color: var(--at-ink); text-wrap: pretty; }

/* Copilot: spørg, svar og datapakken */
.at-cpform { display: flex; flex-direction: column; gap: 12px; }
.at-cpform__err { margin-bottom: 12px; }
.at-cpform__foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 16px; }
.at-cpform__foot .at-hint { flex: 1 1 260px; max-width: 60ch; }
.at-cpsvarliste { display: flex; flex-direction: column; gap: 12px; margin-top: 12px; min-height: 112px; }
/* Den tomme tilstand forsvinder, når HTMX har tilføjet det første svar eller en besked */
.at-cpsvarliste:has(.at-cpsvar, .at-flash) > .at-empty { display: none; }
.at-cpsvar { padding: 14px 16px; border-radius: var(--at-r-sm); background: var(--at-canvas-2); }
.at-cpsvar__q { font-size: var(--at-fs-meta); color: var(--at-meta-2); overflow-wrap: anywhere; }
.at-cpsvar__a { margin-top: 4px; font-size: var(--at-fs-title); line-height: 1.6; color: var(--at-ink); text-wrap: pretty; overflow-wrap: anywhere; }
.at-cpsvar__src { display: flex; flex-direction: column; gap: 2px; margin-top: 10px; }
.at-cpinfo p { margin-top: 8px; max-width: 80ch; color: var(--at-ink); text-wrap: pretty; }
.at-cppakke { margin-top: 10px; }
.at-cppakke > li { padding: 10px 0; }
.at-cppakke > li:last-child { border-bottom: 0; padding-bottom: 0; }

/* Mine dashboards: listen (dine dashboards som fliser + stiplet "Nyt dashboard") */
.at-dbboard { display: flex; flex-direction: column; gap: 2px; min-height: 180px; color: var(--at-ink); }
a.at-dbboard:hover { opacity: 1; box-shadow: var(--at-ring-edit); }
.at-dbboard__name { margin-top: 2px; font-size: var(--at-fs-title); font-weight: 600; letter-spacing: -0.01em; line-height: 1.35; overflow-wrap: anywhere; }
.at-dbboard__meta { font-size: var(--at-fs-meta); color: var(--at-meta); }
.at-dbboard__foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 12px; margin-top: auto; padding-top: 14px; }
.at-dbboard__foot .at-meta { color: var(--at-meta); }
.at-dbboard__open { font-weight: 500; color: var(--at-cobalt); }
.at-dbnew, .at-dbadd { min-height: 180px; cursor: default; }
.at-dbnew__title, .at-dbadd__title { cursor: pointer; }
.at-dbnew .at-input, .at-dbadd .at-select { width: 100%; max-width: 280px; background-color: var(--at-surface); box-shadow: var(--at-shadow-raise); font-weight: 400; }
.at-dbnew .at-input:focus, .at-dbadd .at-select:focus { box-shadow: 0 0 0 2px var(--at-cobalt); }
.at-dbnew--inline, .at-dbadd--inline {
  display: flex; flex-wrap: wrap; justify-content: center; gap: 10px;
  width: 100%; max-width: 520px; min-height: 0; margin-top: 6px;
}
.at-dbnew--inline .at-input, .at-dbadd--inline .at-select { flex: 1 1 240px; max-width: none; background-color: var(--at-canvas-2); box-shadow: none; }
.at-empty .at-dbnew--inline .at-btn, .at-empty .at-dbadd--inline .at-btn { margin-top: 0; }

/* Ét dashboard: fliser med den rigtige figur (kompakt plot), redigering uden JS */
.at-dbtiles { grid-template-columns: repeat(auto-fill, minmax(min(300px, 100%), 1fr)); }
.at-dbtile { display: flex; flex-direction: column; }
.at-dbtile > .at-card__body { padding: 0; }
.at-dbtile__meta { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; }
.at-dbtile__link { font-size: var(--at-fs-meta); }
.at-dbtile .at-chart__plot { height: 150px; margin-top: 14px; }
.at-dbtile__band { margin-top: 8px; }
.at-dbtile .at-kpi__value { line-height: 1.3; margin-top: 4px; text-wrap: balance; overflow-wrap: anywhere; }
.at-dbtile__meta { margin-top: 4px; }
.at-dbtiles > .at-dbadd { min-height: 220px; }
/* I flise-gitteret fylder vælgeren flisens indre bredde (280px-loftet gælder kun
   oversigtens "Nyt dashboard"-kort). Etiketten "visning (ID) · enhed" forkortes ikke. */
.at-dbtiles > .at-dbadd .at-select { max-width: none; }
/* Uden :has() er knappen skjult og kontrollerne altid synlige; så må det skjulte
   felt heller ikke kunne få tastaturfokus (et usynligt fokusstop). */
.at-dbedit__in { display: none; }
.at-dbedit { display: none; cursor: pointer; }
.at-dbedit__on { display: none; }
.at-dbhead__back { font-size: var(--at-fs-body); }
@supports selector(:has(*)) {
  .at-dbedit__in { display: block; position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); border: 0; opacity: 0; }
  .at-dbedit { display: inline-flex; }
  .at-page:has(#db-rediger:not(:checked)) .at-dbtile__tools,
  .at-page:has(#db-rediger:not(:checked)) .at-dbtiles > .at-dbadd { display: none; }
  .at-page:has(#db-rediger:checked) .at-dbtile { box-shadow: var(--at-ring-edit); }
  .at-page:has(#db-rediger:checked) .at-dbtile__label { padding-right: 116px; }
  .at-page:has(#db-rediger:checked) .at-dbedit { background: var(--at-navy-900); color: var(--at-on-navy); box-shadow: none; }
  .at-page:has(#db-rediger:checked) .at-dbedit__on { display: inline; }
  .at-page:has(#db-rediger:checked) .at-dbedit__off { display: none; }
  .at-page:has(#db-rediger:focus-visible) .at-dbedit { outline: 2px solid var(--at-cobalt); outline-offset: 2px; }
}
.at-dbinfo p, .at-dbdelete p { margin-top: 8px; max-width: 80ch; color: var(--at-ink); text-wrap: pretty; }
.at-dbdelete__form { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; margin-top: 12px; }

/* ---------------------------------------------------------------------------
   Factor Lab (design v3, D10): kontrolpanel til venstre, faner, formular-tabeller,
   stempel og statusfelt. Kun tokens; skygger og toninger bor aldrig i markup
   (Factor Lab-testene scanner hele siden). Alle vælgere er .at-fl-*-scopede.
   ------------------------------------------------------------------------ */
.at-fl-intro { max-width: 72ch; text-wrap: pretty; }
.at-fl-after { margin-top: 12px; }
.at-fl-prose p + p { margin-top: 10px; }
.at-fl-bullets { margin-top: 0; }
.at-fl-list { margin: 4px 0 0; padding-left: 18px; }

/* Kontrolpanelet: sektioner med hårfin streg imellem (handoffens venstre kort) */
.at-fl-panel { display: flex; flex-direction: column; gap: 14px; }
.at-fl-sec { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.at-fl-sec + .at-fl-sec { padding-top: 14px; border-top: 1px solid var(--at-line); }
.at-fl-group { min-width: 0; margin: 0; padding: 0; border: 0; }
.at-fl-group > legend { padding: 0 0 8px; }
.at-fl-group > .at-hint, .at-fl-group > .at-error { margin-top: 8px; }
.at-fl-pair { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
/* Uden :has() kan den valgte chip ikke tændes; så vises radioknappen selv. */
@supports not selector(:has(*)) {
  .at-fl-group .at-chip > input { position: static; width: auto; height: auto; margin: 0; opacity: 1; pointer-events: auto; }
}

/* Statusfeltet (kø, i gang, færdig): tekstlinjer under hinanden. Inde i et kort
   er den neutrale variant en grå flade uden egen skygge. */
.at-fl-status { flex-direction: column; align-items: stretch; gap: 6px; }
.at-card .at-fl-status:not(.at-flash--err):not(.at-flash--warn):not(.at-flash--ok) { background: var(--at-canvas-2); box-shadow: none; }
.at-fl-run { display: flex; flex-direction: column; gap: 14px; margin-top: 12px; }
.at-fl-run__name { max-width: 340px; }
.at-fl-koersel:empty { display: none; }

/* Faktor- og feltrækker: en fast tabel på brede skærme (lange faktornavne
   afkortes i den lukkede vælger i stedet for at sprænge kortet), stablede
   felter med synlige etiketter under 600px. */
.at-fl-ftable { table-layout: fixed; }
.at-fl-ftable th:nth-child(2) { width: 150px; }
.at-fl-ftable th:nth-child(3) { width: 96px; }
.at-fl-ftable--egne th:nth-child(2) { width: 200px; }
.at-fl-ftable--egne th:nth-child(3) { width: 130px; }
.at-fl-ftable--egne th:nth-child(4) { width: 96px; }
.at-fl-ftable td { padding-top: 7px; padding-bottom: 7px; vertical-align: top; }
.at-fl-ftable .at-error { margin-top: 4px; white-space: normal; }
.at-fl-ftable__num .at-input { text-align: right; font-variant-numeric: tabular-nums; }
.at-fl-cellabel {
  position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
@media (max-width: 599.98px) {
  .at-fl-ftable, .at-fl-ftable tbody, .at-fl-ftable td { display: block; width: auto; }
  .at-fl-ftable thead { display: none; }
  .at-fl-ftable tr { display: grid; grid-template-columns: minmax(0, 1fr) 96px; gap: 10px 12px; padding: 12px 0; border-bottom: 1px solid var(--at-line-row); }
  .at-fl-ftable td { padding: 0; border: 0; }
  .at-fl-ftable td.at-fl-ftable__main { grid-column: 1 / -1; }
  .at-fl-cellabel {
    position: static; display: block; width: auto; height: auto; margin: 0 0 6px;
    overflow: visible; clip: auto; white-space: normal;
    font-size: var(--at-fs-meta); color: var(--at-meta);
  }
  .at-fl-pair { grid-template-columns: minmax(0, 1fr); }
  /* Modellisten: navnet på egen linje, Kopiér og fold-ud altid på linjen under */
  ul.at-fl-models > li > .at-fl-models__main { flex-basis: 100%; }
}
/* Det afgørende er tabellens egen bredde, ikke skærmens: mellem 900 og ca.
   1280px står faktorkortene ved siden af kontrolpanelet og er for smalle til de
   faste kolonner (ved 1024px blev »Felt« klemt til nul, og Vægt røg ud af kortet).
   Samme stablede rækker som på telefonen, styret af tabelbeholderen. Media-reglen
   ovenfor er reserven for browsere uden container queries. */
.at-fl-ftwrap { container: fl-ftable / inline-size; }
@container fl-ftable (max-width: 599.98px) {
  .at-fl-ftable, .at-fl-ftable tbody, .at-fl-ftable td { display: block; width: auto; }
  .at-fl-ftable thead { display: none; }
  .at-fl-ftable tr { display: grid; grid-template-columns: minmax(0, 1fr) 96px; gap: 10px 12px; padding: 12px 0; border-bottom: 1px solid var(--at-line-row); }
  .at-fl-ftable td { padding: 0; border: 0; }
  .at-fl-ftable td.at-fl-ftable__main { grid-column: 1 / -1; }
  .at-fl-cellabel {
    position: static; display: block; width: auto; height: auto; margin: 0 0 6px;
    overflow: visible; clip: auto; white-space: normal;
    font-size: var(--at-fs-meta); color: var(--at-meta);
  }
}

/* Modellisten: navn og tal til venstre, Kopiér og fold-ud til højre */
.at-fl-models > li { gap: 10px 12px; }
.at-fl-models > li > form { margin: 0; }
/* Samme specificitet som .at-list > li > :first-child, men senere i filen. */
.at-fl-models > li > .at-fl-models__main { flex: 1 1 240px; min-width: 0; }
.at-fl-models__main .at-name { color: var(--at-ink); }
.at-fl-models__main .at-name:hover { color: var(--at-cobalt); opacity: 1; }
.at-fl-manage { margin-top: 0; }
.at-fl-manage > summary { font-size: var(--at-fs-meta); }
.at-fl-manage[open] { flex-basis: 100%; }
.at-fl-manage__body { display: flex; flex-direction: column; gap: 12px; margin-top: 10px; }

/* Kørslens nøgledata øverst på resultatsiden */
.at-fl-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px 20px; margin: 14px 0 0; }
.at-fl-facts > div { min-width: 0; }
.at-fl-facts dt { font-size: var(--at-fs-meta); color: var(--at-meta); }
.at-fl-facts dd { margin: 2px 0 0; font-size: var(--at-fs-title); font-weight: 600; letter-spacing: var(--at-tight); }

/* Holdings: datovælger og tællere over tabellen */
.at-fl-holdhead { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 12px 20px; margin-bottom: 6px; }
.at-fl-datepick { flex: 0 1 260px; }
/* Holdings-tabellen: navn og sektor må ombrydes, så vægt, score og Status står i
   kortet; vægten (»2,00 %«) og scoren deles aldrig. Når tabelbeholderen er smallere
   end 600px, bliver hver række et lille gitter: ticker og status øverst, navn og
   sektor under, vægt og score nederst. Så ses Status (afnoteret/standset) altid
   uden vandret rulning, også med lange navne. Kolonnehovederne er skjult visuelt,
   ikke fjernet; vægt og score får deres etiket fra data-label (samme mønster som
   .at-modtab). Desktop-tabellen er urørt. */
.at-table.at-fl-holdtab td:nth-child(2), .at-table.at-fl-holdtab td:nth-child(3) { white-space: normal; }
.at-tablewrap:has(> .at-fl-holdtab) { container: fl-holdtab / inline-size; }
@container fl-holdtab (max-width: 599.98px) {
  .at-fl-holdtab, .at-fl-holdtab tbody { display: block; }
  .at-fl-holdtab thead {
    position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0;
    overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
  }
  .at-fl-holdtab tbody tr {
    display: grid; grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas: "ticker status" "navn navn" "sektor sektor" "vaegt score";
    align-items: baseline; column-gap: 12px; row-gap: 1px;
    padding: 11px 0; border-bottom: 1px solid var(--at-line-row);
  }
  .at-table.at-fl-holdtab tbody th, .at-table.at-fl-holdtab td { display: block; padding: 0; border: 0; white-space: normal; min-width: 0; }
  .at-table.at-fl-holdtab tbody th { grid-area: ticker; font-weight: 600; }
  .at-table.at-fl-holdtab td:nth-child(2) { grid-area: navn; }
  .at-table.at-fl-holdtab td:nth-child(3) { grid-area: sektor; font-size: var(--at-fs-meta); color: var(--at-meta); }
  .at-table.at-fl-holdtab td:nth-child(4) { grid-area: vaegt; margin-top: 4px; text-align: left; white-space: nowrap; }
  .at-table.at-fl-holdtab td:nth-child(5) { grid-area: score; margin-top: 4px; text-align: right; white-space: nowrap; }
  .at-table.at-fl-holdtab td:nth-child(6) { grid-area: status; text-align: right; }
  .at-table.at-fl-holdtab td[data-label]::before { content: attr(data-label) " "; font-size: var(--at-fs-meta); color: var(--at-meta); }
}

/* Ærlighedsstemplet: lange hashes brydes i stedet for at gøre kortet bredere */
.at-fl-stamp th[scope="row"] { width: 38%; white-space: normal; }
.at-fl-stamp td { white-space: normal; overflow-wrap: anywhere; }
.at-fl-pre {
  margin: 8px 0 0; padding: 12px 14px; border-radius: var(--at-r-xs);
  background: var(--at-canvas-2); color: var(--at-ink); font-size: var(--at-fs-meta);
  white-space: pre-wrap; word-break: break-all;
}

/* Mærket »Historisk test, ikke en garanti.« i sidehovedet: handoffens lyseblå
   pille står på et hvidt kort; på app-fladen (#eef1f7) forsvinder den tone, så
   her er pillen hvid med den lette hævning (samme udtryk som en ticker-pille). */
.at-pagehead__meta .at-fl-badge { background: var(--at-surface); color: var(--at-navy-700); box-shadow: var(--at-shadow-raise); }

/* Fanerne skal kunne stå på én linje ved 360px */
@media (max-width: 599.98px) {
  .at-fl-tabs { gap: 0; }
  .at-fl-tabs .at-tab { padding: 10px 10px; }
}

/* Kategori-etiketter under Factor Lab-søjlerne: én plads pr. søjle kan være
   få pixel bred (en måned ud af 180), så etiketten centreres over sin plads
   og må række ud over den i stedet for at blive klippet til en stump. En
   etiket på flere ord (»under −20«) brydes i sin plads i stedet for at løbe
   ind i naboen. */
.at-fl-chart .at-chart__x--cats > span {
  display: flex; justify-content: center; min-width: 0; overflow: visible;
  white-space: normal; text-align: center; line-height: 1.3;
}
/* Årstallene under månedssøjlerne er bredere end deres plads. »safe center«
   lader et årstal, der ikke kan være i sin plads, starte ved sin søjle i
   stedet for at stå lige meget ud til begge sider, så det første står i flugt
   med plottet som på de øvrige figurer. Afstanden mellem årstallene er
   uændret. Kvintil- og histogram-etiketter kan være i deres plads og står
   fortsat centreret. En browser uden »safe« dropper erklæringen og beholder
   centreringen. */
.at-fl-chart .at-chart__x--cats:has(> span:empty) > span { justify-content: safe center; }
/* Smalle kort: mindre etiketter (12px, designkontraktens gulv; aldrig under), og
   en søjlefigur, hvor HVER søjle har en etiket (histogrammets ti intervaller),
   viser hver anden. Søjlerne er de samme. Det er KORTETS bredde, der afgør det:
   histogrammet står i en halv kolonne ved 1024px og løb ellers sammen
   (»under−20−15−10«). Media-reglen er reserven uden container queries. */
.at-fl-chart { container: fl-chart / inline-size; }
@container fl-chart (max-width: 439.98px) {
  .at-fl-chart .at-chart__x--cats { font-size: 12px; }
  .at-fl-chart .at-chart__x--cats:has(> span:nth-child(8)):not(:has(> span:empty)) > span:nth-child(even) { visibility: hidden; }
}
/* Månedssøjlerne (rangkorrelationen) har et årstal på ægte årsskifter (januar,
   hvert 1., 2., 5. eller 10. år; højst ca. otte). I et kort under 400px
   (diagnostik ved 900px og på telefonen) løb de sammen til »200220042006…«; der
   står så kun det første og det sidste, som på de øvrige figurer. Søjlerne er de
   samme. */
@container fl-chart (max-width: 399.98px) {
  .at-fl-chart .at-chart__x--cats:has(> span:empty) > span:not(:empty) ~ span:not(:empty) { visibility: hidden; }
  .at-fl-chart .at-chart__x--cats:has(> span:empty) > span:not(:empty):not(:has(~ span:not(:empty))) { visibility: visible; }
}
@supports not (container-type: inline-size) {
  @media (max-width: 599.98px) {
    .at-fl-chart .at-chart__x--cats { font-size: 12px; }
    .at-fl-chart .at-chart__x--cats:has(> span:nth-child(8)):not(:has(> span:empty)) > span:nth-child(even) { visibility: hidden; }
  }
}

/* Tabelhoveder må bryde (lange kolonnenavne som »markedsvægt, uden loft«) */
.at-fl-wraphead th { white-space: normal; }
/* Nøgletalstabellerne: handoffens nøgletalsgitter har faste andele (navnet lidt
   bredere, talkolonnerne lige brede). Med automatisk layout tog den længste
   kolonneoverskrift (»markedsvægt, uden loft«) al restpladsen, så tallene stod
   skævt fordelt. Fra 600px deles kolonnerne derfor fast; på telefonen automatisk. */
@media (min-width: 600px) {
  .at-fl-cols { table-layout: fixed; }
  .at-fl-cols > thead > tr > th:first-child { width: 30%; }
}

/* ---------------------------------------------------------------------------
   Offentlige sider og konto. Alt her er afgrænset til sidernes egne klasser
   (.at-pricing, .at-doc, .at-acct …), så delte komponentregler ovenfor står urørt.
   ------------------------------------------------------------------------ */

/* /priser: som forsidens prisafsnit: centreret hoved, to kort på højst
   1040px, radius 26, navn i kobolt, tagline 22/600, pris 34-46px, rækker med
   hårlinje. Den valgte pakke (Pro) bærer kobolt-ringen fra .at-price--featured. */
.at-pricing { display: flex; flex-direction: column; align-items: center; }
.at-pricing__head { display: flex; flex-direction: column; align-items: center; gap: 0; max-width: 760px; text-align: center; }
.at-pricing__head h1 { font-size: clamp(34px, 4.2vw, 56px); line-height: 1.05; letter-spacing: -0.035em; }
.at-pricing__head .at-sect__sub { margin-top: 16px; font-size: 17px; line-height: 1.6; max-width: 58ch; }
.at-pricing__note { margin-top: 10px; font-size: 15px; line-height: 1.6; color: var(--at-ink-soft); max-width: 58ch; text-wrap: pretty; }
.at-pricing__grid {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(min(320px, 100%), 1fr)); gap: 20px;
  width: 100%; max-width: 1040px; margin-top: 44px; align-items: stretch;
}
.at-pricing .at-price {
  gap: 0; border-radius: 26px; padding: clamp(28px, 3vw, 40px);
  /* forsidens kortskygge (--lp-shadow-card i landing.css), ikke app-kortets */
  box-shadow: 0 1px 2px rgba(15, 28, 85, 0.06), 0 12px 32px -14px rgba(15, 28, 85, 0.22);
}
.at-pricing .at-price--featured { box-shadow: var(--at-ring-pick), 0 1px 2px rgba(15, 28, 85, 0.06), 0 12px 32px -14px rgba(15, 28, 85, 0.22); }
.at-pricing .at-price__name { font-size: 15px; font-weight: 600; letter-spacing: 0; line-height: 1.5; color: var(--at-cobalt); }
.at-pricing .at-price__tag { margin-top: 6px; font-size: 22px; font-weight: 600; letter-spacing: -0.015em; line-height: 1.35; color: var(--at-ink); text-wrap: balance; }
.at-pricing .at-price__amount { flex-wrap: wrap; gap: 4px 11px; margin-top: 22px; }
.at-pricing .at-price__kr,
.at-pricing .at-price__per { font-size: clamp(34px, 3.4vw, 46px); font-weight: 600; letter-spacing: -0.035em; line-height: 1.1; color: var(--at-ink); }
/* »Live nu«/»På vej« er grå 13px metatekst: handoff'ens regel »grå tekst er aldrig
   tykkere end 500« gælder, så vægten er 500 (ikke 600). */
.at-pricing .at-price h3.at-label { margin-top: 24px; padding-bottom: 6px; font-size: var(--at-fs-meta); font-weight: 500; color: var(--at-ink-soft); letter-spacing: 0; }
.at-pricing .at-feat { gap: 0; }
.at-pricing .at-feat li { gap: 12px; padding: 9px 0; border-top: 1px solid var(--at-line-row); font-size: 15px; line-height: 1.5; text-wrap: pretty; }
.at-pricing .at-feat li::before { margin: 4px 6px 0 6px; }
.at-pricing .at-feat--soon li::before { margin: 4px 2px 0 2px; }
.at-pricing .at-feat strong { font-weight: 600; }
.at-price__cta { margin-top: auto; padding-top: 26px; }
.at-pricing .at-price__cta .at-btn { height: 52px; padding: 0 26px; font-size: 16px; }
.at-pricing__fine { width: 100%; max-width: 1040px; margin-top: 20px; border-radius: 18px; }
.at-pricing__fine .at-card__head { margin-bottom: 8px; }
.at-pricing__fine .at-muted { max-width: 88ch; line-height: 1.6; }
/* Links midt i løbende tekst skal kunne skelnes uden farve (WCAG 1.4.1: kobolt mod
   #5d6477 er kun 1,1:1), så de understreges som på de juridiske sider. */
.at-pricing__fine a { text-decoration: underline; text-underline-offset: 2px; text-decoration-color: color-mix(in srgb, var(--at-cobalt) 35%, transparent); }

/* /juridik/*: én centreret læsesøjle (højst 800px). Kun layout: teksten er
   APPENDIX A ordret, så alt her er afstand, typografi og kort. Afsnittene er de
   ældre hoved/krop-kort (.at-card__head/.at-card__body), som her får luftigere
   polstring og 15px brødtekst. */
.at-doc { width: 100%; max-width: 800px; margin: 0 auto; display: flex; flex-direction: column; gap: 14px; }
.at-doc > * { min-width: 0; }
.at-doc__head { display: flex; flex-direction: column; gap: 6px; margin-bottom: 8px; }
.at-doc__head .at-muted { font-size: var(--at-fs-meta); color: var(--at-meta-2); }
.at-doc__body { display: flex; flex-direction: column; gap: 14px; }
.at-doc .at-card { border-radius: 18px; }
.at-doc .at-card:not(.at-card--pad) > .at-card__head { padding: 20px 24px 0; }
.at-doc .at-card__title { font-size: var(--at-fs-title); letter-spacing: -0.01em; line-height: 1.4; }
.at-doc .at-card:not(.at-card--pad) > .at-card__body { padding: 20px 24px 22px; font-size: 15px; line-height: 1.65; text-wrap: pretty; }
.at-doc .at-card:not(.at-card--pad) > .at-card__head + .at-card__body { padding-top: 10px; }
.at-doc .at-card__body p + p, .at-doc .at-card__body p + ul, .at-doc .at-card__body ul + p,
.at-doc .at-card__body p + ol, .at-doc .at-card__body ol + p, .at-doc .at-card__body dl + p { margin-top: 10px; }
.at-doc .at-card__body ul:not(.at-feat), .at-doc .at-card__body ol { padding-left: 1.25em; }
.at-doc--metode .at-card__body .at-muted { color: var(--at-ink); }
/* Listepunktet rummer <strong> + løbende tekst: blok med fluebenet i venstre
   margen, så teksten flyder som én linje (flex ville skille ordene ad). */
.at-doc--metode .at-feat li { display: block; position: relative; padding-left: 24px; font-size: 15px; line-height: 1.6; }
.at-doc--metode .at-feat li::before { position: absolute; left: 0; top: 0; margin: 5px 0 0 6px; }
.at-doc .at-card__body li + li { margin-top: 4px; }
.at-doc .at-card__body a { text-decoration: underline; text-underline-offset: 2px; text-decoration-color: color-mix(in srgb, var(--at-cobalt) 35%, transparent); }
/* Virksomhedsoplysninger øverst (samme partial på alle fem sider) */
.at-idlist { margin: 0; display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 4px 20px; font-size: var(--at-fs-body); line-height: 1.55; }
.at-idlist dt { color: var(--at-meta); }
.at-idlist dd { margin: 0; overflow-wrap: anywhere; }
/* Mangler identiteten, er den ærlige note en advarsel (ingen alarmrød): varm tone. */
.at-idnote, .at-public .at-idnote { padding: 12px 16px; border-radius: var(--at-r-card); background: var(--at-warn-soft); color: var(--at-warn); font-size: var(--at-fs-body); }
.at-doc .at-idcard.at-card > .at-card__body { padding: 16px 24px; font-size: var(--at-fs-body); }
.at-doc__logout { margin: 4px 0 0; }

/* /konto og /vaelg-pakke (D10): »Din pakke« + »Abonnement og betaling« som i
   håndoffets Konto (to kort, 16/18 polstring, nøgle/værdi-rækker med hårlinje). */
/* Håndoffets cols11-gitter strækker de to kort til samme højde (P:639). Når
   købsformularen står i kort 2 (intet abonnement), følger kort 1 sit indhold. */
.at-cols-11.at-acct:not(:has(.at-acct__buy)) { align-items: stretch; }
.at-acct__label { margin: 0; font-size: var(--at-fs-meta); font-weight: 400; letter-spacing: 0; color: var(--at-meta); line-height: 1.55; }
.at-acct__planname { margin-top: 6px; font-size: var(--at-fs-display); font-weight: 600; letter-spacing: -0.02em; line-height: 1.3; }
.at-acct__tag { margin-top: 8px; color: var(--at-ink); }
.at-acct__rows { margin-top: 6px; }
.at-acct__rows .at-kv:last-child { border-bottom: 0; }
.at-acct__mail { min-width: 0; overflow-wrap: anywhere; }
.at-acct__more { margin-top: 14px; }
.at-acct__sub .at-card__head + .at-acct__rows { margin-top: 6px; }
.at-acct__none.at-empty--inline { padding: 14px 0 4px; gap: 4px; }
.at-acct__sub > .at-acct__none:first-child { padding-top: 0; }
.at-acct__none .at-empty__title { font-size: var(--at-fs-body); letter-spacing: 0; line-height: 1.55; }
.at-acct__buy { display: flex; flex-direction: column; gap: 16px; margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--at-line-row); }
.at-acct__none + .at-acct__buy { margin-top: 10px; padding-top: 0; border-top: 0; }
.at-acct__rows + .at-acct__buy, .at-acct__rows + .at-acct__portal { margin-top: 0; }
.at-acct__buy > p:first-child { color: var(--at-ink-soft); max-width: 68ch; text-wrap: pretty; }
.at-acct__form { display: flex; flex-direction: column; gap: 16px; }
.at-acct__plans { margin: 0; padding: 0; border: 0; min-width: 0; }
.at-acct__plans legend { padding: 0; margin-bottom: 8px; }
.at-acct__opts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; max-width: 420px; }
.at-acct__opt {
  display: flex; align-items: center; gap: 10px; height: 52px; padding: 0 16px;
  border-radius: var(--at-r-card); background: var(--at-canvas-2); cursor: pointer;
  font-size: var(--at-fs-title); font-weight: 600; color: var(--at-ink);
  transition: box-shadow 0.13s ease, background-color 0.13s ease;
}
.at-acct__opt:hover { background-color: #e8ebf3; }
.at-acct__opt input { margin: 0; width: 18px; height: 18px; flex: 0 0 18px; }
.at-acct__opt:has(input:checked) { background: var(--at-surface); box-shadow: var(--at-ring-pick), var(--at-shadow-card); }
.at-acct__opt:has(input:focus-visible) { outline: 2px solid var(--at-cobalt); outline-offset: 2px; }
/* Flisen bærer fokusringen; radioknappens egen (den globale :focus-visible) ville give
   en dobbelt ring. Kun hvor :has() virker: ellers er knappens ring den eneste. */
.at-acct__opt:has(input:focus-visible) input:focus-visible { outline: none; }
.at-acct__consent { max-width: 68ch; padding: 14px 16px; border-radius: var(--at-r-card); background: var(--at-canvas-2); color: var(--at-ink); line-height: 1.55; cursor: pointer; }
.at-acct__legal { margin-top: -6px; }
.at-acct__portal { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--at-line-row); }
.at-acct__portal p { color: var(--at-ink-soft); max-width: 62ch; text-wrap: pretty; }
.at-acct__portal form { margin: 0; }
.at-doc--choose .at-acct__sub { border-radius: 18px; padding: 22px 24px; }

/* Login og kvitteringer: kortet fra F1 (.at-authcard) med et tonet mærkefelt */
.at-authcard__mark {
  display: grid; place-items: center; width: 44px; height: 44px; border-radius: var(--at-r-card);
  background: var(--at-blue-050); color: var(--at-cobalt);
}
.at-authcard__mark svg { width: 22px; height: 22px; flex: 0 0 22px; }
.at-authcard__mark--muted { background: var(--at-canvas-2); color: var(--at-ink-soft); }
.at-authcard__head { display: flex; flex-direction: column; gap: 6px; }
.at-authcard__text { color: var(--at-ink); text-wrap: pretty; }
.at-authform { display: flex; flex-direction: column; gap: 14px; }
.at-authform .at-btn { margin-top: 4px; }
.at-authcard__actions { display: flex; flex-wrap: wrap; gap: 10px 12px; margin-top: 4px; }

/* ---------------------------------------------------------------------------
   Reflow ved 200 % zoom. WCAG 1.4.10: ingen vandret sidescroll ved 320 CSS-px og
   ved 200 % zoom på en 390px-telefon (195 CSS-px). Gitrenes min(Npx, 100%) står ved
   reglerne selv; her står resten. Alt under 288px er afgrænset til den smalle blok,
   så designet fra 320 til 899px er uændret.
   ------------------------------------------------------------------------ */
/* Visningsvalget (Positivlisten) må bryde over to rækker, når sporet er smallere
   end knapperne; på én række er det uændret. */
.at-seg--solid { flex-wrap: wrap; max-width: 100%; }
.at-authcard { min-width: 0; }
/* Et mærke, der ombrydes (»Kategori: non-commercial …« på /positionering ved 320px),
   får afrundede hjørner i stedet for stadionform. På én linje (ca. 24px høj) er 12px
   stadig en pille; de høje mærker beholder pillen. */
.at-badge { border-radius: 12px; }
.at-badge--soon { border-radius: var(--at-r-pill); }
@media (max-width: 287.98px) {
  /* Dansk orddeling (lang="da") i de smalle kolonner: »central-bankmøder« frem for et
     brud midt i ordet. break-word og anywhere nedenfor er sikkerhedsnettet for ord
     uden delemulighed (adresser, id'er). */
  .at-page, .at-footer { -webkit-hyphens: auto; hyphens: auto; }
  /* Nøgle-værdi-rækker (Konto): navn og værdi står på hver sin linje, når de ikke kan
     stå side om side, i stedet for at værdien skriver oven i navnet. */
  .at-kv > :first-child { flex: 1 1 auto; }
  .at-kv > :last-child { margin-left: auto; }
  /* Knapper: teksten ombrydes i stedet for at skubbe siden bredere. min-height,
     ikke height, så en etlinjet knap har sin normale højde (ikonknapper urørt). */
  .at-btn:not(.at-btn--icon) {
    height: auto; min-height: 44px; padding-top: 8px; padding-bottom: 8px;
    line-height: 1.25; white-space: normal; text-align: center;
  }
  .at-btn:is(.at-btn--lg, .at-btn--glow):not(.at-btn--icon) { min-height: 48px; }
  .at-btn:is(.at-btn--md, .at-btn--white):not(.at-btn--icon) { min-height: 42px; }
  .at-btn:is(.at-btn--sm, .at-btn--util):not(.at-btn--icon) { min-height: 36px; padding-top: 6px; padding-bottom: 6px; }
  .at-pricing .at-price__cta .at-btn { height: auto; min-height: 52px; }
  .at-seg--solid { border-radius: 22px; }
  /* Lange enkeltord (»Standardfortrydelsesformular«, e-mailadresser) i de juridiske
     sider og kvitteringskortene: brydes kun, når ordet ikke kan stå på en linje. */
  .at-doc, .at-authcard { overflow-wrap: anywhere; }
  /* Lange sammensatte ord og webadresser i løbende tekst (»aktieavancebeskatningslovens«,
     »(publicreporting.cftc.gov)«): kun afsnit, ikke tabel- og gitterceller, der ellers
     brydes tegn for tegn i en smal kolonne. Flex-elementerne (chips, pris-rækker,
     arkivets overskrifter) skal have anywhere. */
  .at-page p, .at-footer p { overflow-wrap: break-word; }
  .at-chip, .at-feat li, .at-archive__head { overflow-wrap: anywhere; }
  /* Modultabellerne (Valuta, Positionering) står i et smalt kort som navn + værdi på én
     linje; ved 195 CSS-px er der ikke plads til begge, så hver celle får sin linje. */
  .at-modtab tr { grid-template-columns: minmax(0, 1fr); grid-template-areas: "navn" "vaerdi" "kilde" "periode" "hentet"; }
  .at-table.at-modtab td:nth-child(5) { text-align: left; }
  /* Z-score-oversigten er en figur med rækker, der skal flugte med søjlerne: den
     beholder sin mindstebredde og scroller i sin egen ramme (som tabellerne i
     .at-tablewrap), så siden ikke gør. */
  .at-chart--z { overflow-x: auto; }
  .at-chart--z > .at-chart__zplot, .at-chart--z > .at-chart__zaxis { min-width: 17rem; }
  /* Skuffen: 240px er bredere end skærmen. Den fylder bredden, og nav-punkter,
     mærke og pakke-linjen må bryde, så Pro-mærkerne står inden for skærmen. */
  .at-sidebar { width: auto; right: 0; }
  .at-sidebar__top, .at-navlink, .at-sidefoot__plan { flex-wrap: wrap; row-gap: 2px; }
}

/* RUN 5, Part 1 (brief 71 Part 2): tavlen over valutaområderne på /oekonomi og de nye
   tal på /renter, /inflation og /kredit. Over 760 px en tabel med et område pr. kolonne;
   derunder (390 px) ét kort pr. område, så siden aldrig scroller vandret. */
.at-why { margin: 4px 0 0; font-size: var(--at-fs-meta); font-weight: 400; line-height: 1.45; color: var(--at-meta); }
.at-why__q { font-weight: 600; color: var(--at-ink-soft); }
.at-omrtable th[scope="row"] { min-width: 12rem; max-width: 16rem; white-space: normal; vertical-align: top; text-align: left; }
.at-omrtable td { min-width: 8rem; white-space: normal; vertical-align: top; }
.at-omrtable .at-prov, .at-omrcard .at-prov, .at-omrextra .at-prov { margin-top: 4px; }
.at-omr__reason { font-size: var(--at-fs-meta); color: var(--at-meta); }
.at-omr__chg { display: block; font-size: var(--at-fs-meta); color: var(--at-ink-soft); }
.at-omr__chgs { margin: 4px 0 0; padding: 0; list-style: none; font-size: var(--at-fs-meta); color: var(--at-ink-soft); }
.at-omr__cards { display: none; }
.at-omrcard { padding: 12px 0; border-top: 1px solid var(--at-line); overflow-wrap: anywhere; }
.at-omrcard__title { margin: 0 0 4px; font-size: var(--at-fs-title); font-weight: 600; }
.at-omrcard__item { padding: 8px 0; border-top: 1px solid var(--at-line-row); }
.at-omrcard__label { font-weight: 600; }
.at-omr__notes { margin-top: 14px; }
.at-omr__notes ul { margin: 6px 0 0; padding-left: 18px; font-size: var(--at-fs-meta); color: var(--at-ink-soft); }
.at-omr__notice { margin-top: 8px; overflow-wrap: anywhere; }
.at-omrextra { overflow-wrap: anywhere; }
@media (max-width: 759.98px) {
  .at-omr__table { display: none; }
  .at-omr__cards { display: block; }
}

/* RUN 5, Part 3 (brief 65): briefets tre sektioner og ugens overblik. */
.at-brief__sechead { margin: 14px 0 4px; font-size: var(--at-fs-body); font-weight: 600; }
.at-brief__sec + .at-brief__sec { margin-top: 4px; }

/* RUN 5, Part 4 (brief 74): "Skat i tal" på /positivlisten. */
.at-skat { list-style: none; margin: 0; padding: 0; }
.at-skat__row { padding: 10px 0; border-top: 1px solid var(--at-line-row); }
.at-skat__row:first-child { border-top: 0; }
.at-skat__row .at-prov { flex-wrap: wrap; }
.at-skat__text { margin: 4px 0; font-size: var(--at-fs-meta); overflow-wrap: anywhere; }

/* RUN 6, Part 1: OECD's citat under hvert OECD-tal. */
.at-omr__cite { margin: 2px 0 0; font-size: var(--at-fs-meta); color: var(--at-meta); line-height: 1.4; overflow-wrap: anywhere; }
/* RUN 6, Part 1: lageroverskriften i skattekortet står venstrestillet som de andre rækker. */
.at-skat__head { margin: 0; font-size: var(--at-fs-body); font-weight: 600; text-align: left; }

/* RUN 6, Part 2: folden "Hvad viser tallet?" i kildelinjen. Lukket er den et lille link i
   linjens egen størrelse; åben står serie og hentetid på linjen under. */
/* ::before virker ikke på <details>, så mellemrummet foran folden er en margin. */
.at-prov .at-prov__fold { display: inline-block; max-width: 100%; margin-top: 0; margin-left: 0.35em; }
.at-prov__fold > summary { font-size: inherit; font-weight: 400; }
.at-prov__fold > .at-prov__more { display: block; margin-top: 2px; }
.at-prov__more > * + *::before { content: " "; }
.at-prov__more > * + .at-prov__sep::before { content: "\a0"; }
.at-card__src .at-prov__fold { display: inline-block; max-width: 100%; margin-top: 0; margin-left: 4px; }
/* Kortets ene kildelinje under tallene (energi og lignende kort, data.shared_prov). */
.at-omr__shared { margin-top: 10px; }
/* Overblik: markedskortets ændring har sit eget spor, så den aldrig ligger oven i noten
   (skærmbilledet 43-overblik-pro-390 fra RUN 5). */
@supports (grid-template-rows: subgrid) {
  .at-kpis > .at-kpi > .at-ovmkt__chg { grid-row: 3; }
  .at-kpis > .at-kpi > .at-ovmkt__chg + .at-kpi__note { grid-row: 4; }
}
/* RUN 6: en lang fejltekst (et ord uden mellemrum) brydes i banneret i stedet for at gøre
   siden bredere end skærmen (/positionering, 390 px). */
.at-flash { overflow-wrap: anywhere; }

/* Brief 60 (RUN 6): korrelationerne på Markeder. Over 640 px står matrixen pr. vindue;
   smallere står listen over par, så intet ruller vandret ved 390 px. */
.at-corr__title { margin: 14px 0 6px; font-size: var(--at-fs-body); font-weight: 600; }
.at-corr__table td, .at-corr__table th { white-space: nowrap; }
.at-corr__diag { color: var(--at-meta); }
.at-corr__pairs { display: none; margin: 12px 0 0; padding: 0; list-style: none; }
.at-corr__pairs li { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 2px 12px;
  padding: 8px 0; border-top: 1px solid var(--at-line-row); }
.at-corr__vals { display: flex; gap: 14px; }
@media (max-width: 640px) {
  .at-corr__matrix { display: none; }
  .at-corr__pairs { display: block; }
}