/* Selskapsdata – felles stil for selskapsdata.com, som appen. Fargene er de samme som i Selskapsinfo/Theme/Theme.swift,
   lys og mørk (navnet i appen står i kommentaren), og størrelsene er appens punkter i rem (16 px), litt større på PC.
   Endres en farge i appen, endres den her. */

/* Overskrifter og store tall: Apples New York der nettleseren har den (Safari, via ui-serif). Den er skjult i macOS og
   får ikke ligge på nettsider, så Chrome, Firefox, Windows og Android får Newsreader, som ligner mest (Production Type,
   SIL Open Font License). Bare vekten sidene bruker (500) og latinske tegn; optisk størrelse 6–72 følger skriftstørrelsen. */
@font-face {
  font-family: "Newsreader";
  src: url("/assets/newsreader.6cc46172.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  --canvas: #EAE7DF;        /* canvas */
  --bg: #F5F3EE;            /* appBg */
  --flate: #FFFFFF;         /* surface, heroBg */
  --flate2: #F0EDE6;        /* surface2 */
  --flate3: #E6E2D9;        /* surface3 */
  --blekk: #17181C;         /* ink */
  --blekk2: #4A4E58;        /* ink2 */
  --blekk3: #61656F;        /* ink3, heroMuted */
  --strek: #EAE6DD;         /* hair */
  --strek2: #D3CEC3;        /* hair2 */
  --linje: #E7E2D8;         /* line */
  --aksent: #3346D3;        /* accent, heroBar */
  --aksent2: #7F8CEB;       /* accent2 */
  --aksent-myk: #E9EBFB;    /* accentSoft */
  --aksent-blekk: #2A3BB8;  /* accentInk */
  --paa-aksent: #FFFFFF;    /* onAccent */
  --positiv: #177245;       /* pos */
  --positiv-myk: #E1F2E7;   /* posSoft */
  --negativ: #B83C29;       /* neg */
  --negativ-myk: #FBE9E4;   /* negSoft */
  --rutenett: #EEEAE2;      /* grid */
  --helt-dim: #DDE1F7;      /* heroDim */
  --seg-spor: #ECE9E1;      /* segTrack */
  --seg-paa: #FFFFFF;       /* segOn */
  --seg-ring: rgba(21, 24, 31, .06);
  --seg-skygge: rgba(21, 24, 31, .12);
  --margin-fyll: #EEEBFB;   /* marginFill */
  /* diagrampaletten (T.P) */
  --p-a: #3346D3;
  --p-b: #8E59E8;
  --p-c: #9AA6F0;
  --p-varm: #E39A2E;
  --p-jord: #E2684A;
  --p-gronn: #1E9E62;
  --p-rod: #E4533E;
  --p-dempet: #E6E2D9;
  /* fanene på selskapssiden (Del.farge) */
  --del-oversikt: #17181C;
  --del-konsern: #13907F;
  --del-steder: #5D6B85;
  /* avatarer og etiketter: fem fargepar (T.tint) */
  --t0-bg: #E9EBFB; --t0-fg: #2A3BB8;
  --t1-bg: #F0E9FD; --t1-fg: #6A3FC8;
  --t2-bg: #FBF0DC; --t2-fg: #8A5A10;
  --t3-bg: #EFEDE6; --t3-fg: #4A4E58;
  --t4-bg: #FBE8E1; --t4-fg: #A4442A;
  /* grønn, blågrønn og skifer, til hovedbransjenes farger på sidene for stedene (lib/steder.js, .aksent-*) */
  --t5-bg: #E1F2E7; --t5-fg: #177245;
  --t6-bg: #DDF1EE; --t6-fg: #0E6B5F;
  --t7-bg: #E8EBF1; --t7-fg: #46536B;
  --skygge: 0 1px 2px rgba(23, 24, 28, .04), 0 12px 32px rgba(23, 24, 28, .08);
  --serif: ui-serif, "New York", "Newsreader", "Iowan Old Style", Georgia, "Times New Roman", serif;
  --sans: -apple-system, BlinkMacSystemFont, "SF Pro Text", system-ui, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  /* gamle navn, brukt av topplistene og tekstsidene */
  --blaa: var(--p-a);
  --lilla: var(--p-b);
  --gul: var(--p-varm);
  --gronn: var(--p-gronn);
  /* temabryteren øverst: det som gjelder er markert, som i segmentvelgeren */
  --tema-lys: var(--seg-paa); --tema-lys-skygge: 0 0 0 1px var(--seg-ring), 0 1px 3px var(--seg-skygge); --tema-lys-farge: var(--blekk);
  --tema-mork: transparent; --tema-mork-skygge: none; --tema-mork-farge: var(--blekk3);
  color-scheme: light dark;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-tema="lys"]) {
    --canvas: #060708;
    --bg: #0F1013;
    --flate: #1A1C21;
    --flate2: #23262D;
    --flate3: #2C3038;
    --blekk: #F3F1EC;
    --blekk2: #BDBAB3;
    --blekk3: #97948E;
    --strek: #282B31;
    --strek2: #3B3F47;
    --linje: #272A30;
    --aksent: #8C9BFF;
    --aksent2: #5664D9;
    --aksent-myk: #1C2142;
    --aksent-blekk: #AEB8FF;
    --paa-aksent: #0F1013;
    --positiv: #6FD79B;
    --positiv-myk: #14281D;
    --negativ: #FF9E8F;
    --negativ-myk: #2E1A16;
    --rutenett: #24272D;
    --helt-dim: #2A2F4A;
    --seg-spor: #23262D;
    --seg-paa: #363A44;
    --seg-ring: rgba(255, 255, 255, .06);
    --seg-skygge: rgba(0, 0, 0, .12);
    --margin-fyll: #1E1D3A;
    --p-a: #8C9BFF;
    --p-b: #B59BF7;
    --p-c: #5664D9;
    --p-varm: #F1BE6E;
    --p-jord: #F0957C;
    --p-gronn: #6FD79B;
    --p-rod: #FF7B6B;
    --p-dempet: #2C3038;
    --del-oversikt: #F3F1EC;
    --del-konsern: #5CCFBE;
    --del-steder: #9FB0CF;
    --t0-bg: #1C2142; --t0-fg: #AEB8FF;
    --t1-bg: #261E40; --t1-fg: #C6B2FA;
    --t2-bg: #2E2615; --t2-fg: #F1BE6E;
    --t3-bg: #23262D; --t3-fg: #BDBAB3;
    --t4-bg: #33201A; --t4-fg: #F0957C;
    --t5-bg: #14281D; --t5-fg: #6FD79B;
    --t6-bg: #12302B; --t6-fg: #5CCFBE;
    --t7-bg: #22272F; --t7-fg: #9FB0CF;
    --skygge: 0 1px 2px rgba(0, 0, 0, .3), 0 12px 32px rgba(0, 0, 0, .35);
    --tema-lys: transparent; --tema-lys-skygge: none; --tema-lys-farge: var(--blekk3);
    --tema-mork: var(--seg-paa); --tema-mork-skygge: 0 0 0 1px var(--seg-ring), 0 1px 3px var(--seg-skygge); --tema-mork-farge: var(--blekk);
  }
}
/* lyst eller mørkt valgt i knappen øverst (assets/tema.js): de samme fargene som over, uansett systemet
   (test/tema.test.mjs passer på at de to mørke blokkene er like) */
:root[data-tema="mork"] {
  --canvas: #060708;
  --bg: #0F1013;
  --flate: #1A1C21;
  --flate2: #23262D;
  --flate3: #2C3038;
  --blekk: #F3F1EC;
  --blekk2: #BDBAB3;
  --blekk3: #97948E;
  --strek: #282B31;
  --strek2: #3B3F47;
  --linje: #272A30;
  --aksent: #8C9BFF;
  --aksent2: #5664D9;
  --aksent-myk: #1C2142;
  --aksent-blekk: #AEB8FF;
  --paa-aksent: #0F1013;
  --positiv: #6FD79B;
  --positiv-myk: #14281D;
  --negativ: #FF9E8F;
  --negativ-myk: #2E1A16;
  --rutenett: #24272D;
  --helt-dim: #2A2F4A;
  --seg-spor: #23262D;
  --seg-paa: #363A44;
  --seg-ring: rgba(255, 255, 255, .06);
  --seg-skygge: rgba(0, 0, 0, .12);
  --margin-fyll: #1E1D3A;
  --p-a: #8C9BFF;
  --p-b: #B59BF7;
  --p-c: #5664D9;
  --p-varm: #F1BE6E;
  --p-jord: #F0957C;
  --p-gronn: #6FD79B;
  --p-rod: #FF7B6B;
  --p-dempet: #2C3038;
  --del-oversikt: #F3F1EC;
  --del-konsern: #5CCFBE;
  --del-steder: #9FB0CF;
  --t0-bg: #1C2142; --t0-fg: #AEB8FF;
  --t1-bg: #261E40; --t1-fg: #C6B2FA;
  --t2-bg: #2E2615; --t2-fg: #F1BE6E;
  --t3-bg: #23262D; --t3-fg: #BDBAB3;
  --t4-bg: #33201A; --t4-fg: #F0957C;
  --t5-bg: #14281D; --t5-fg: #6FD79B;
  --t6-bg: #12302B; --t6-fg: #5CCFBE;
  --t7-bg: #22272F; --t7-fg: #9FB0CF;
  --skygge: 0 1px 2px rgba(0, 0, 0, .3), 0 12px 32px rgba(0, 0, 0, .35);
  --tema-lys: transparent; --tema-lys-skygge: none; --tema-lys-farge: var(--blekk3);
  --tema-mork: var(--seg-paa); --tema-mork-skygge: 0 0 0 1px var(--seg-ring), 0 1px 3px var(--seg-skygge); --tema-mork-farge: var(--blekk);
  color-scheme: dark;
}
:root[data-tema="lys"] { color-scheme: light; }

/* ---------------------------------------------------------------- grunnlaget */

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; font-size: 100%; }
/* på PC litt større tekst og tall, som appen på Mac (der er den 20 % større) */
@media (min-width: 900px) { html { font-size: 106.25%; } }
body {
  margin: 0;
  background: var(--bg);
  color: var(--blekk);
  font: 1rem/1.5 var(--sans);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
a { color: var(--aksent-blekk); text-decoration: none; }
a:hover { text-decoration: underline; }
/* lenker inne i en tekst har en tynn understrek, så de ikke bare skilles fra teksten med farge (WCAG 1.4.1, Lighthouse) */
p a:not([class]), .tekst li a:not([class]) { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 2px; }
img { max-width: 100%; display: block; }
h1, h2, h3 { margin: 0; font-weight: 600; }
b, strong { font-weight: 600; }
.neg { color: var(--negativ); }
.pos { color: var(--positiv); }
.dempet { color: var(--blekk3); }
.skjult { display: none !important; }
:focus-visible { outline: 2px solid var(--aksent); outline-offset: 2px; border-radius: 6px; }
.tall, .kort-tall, .flis-verdi { font-variant-numeric: tabular-nums; }

.side { max-width: 1180px; margin: 0 auto; padding: 0 16px; }
.smal > main { max-width: 720px; margin: 0 auto; }   /* toppen og bunnen har full bredde, som på de andre sidene */
@media (min-width: 700px) { .side { padding: 0 24px; } }

/* ---------------------------------------------------------------- betabanneret (functions/_middleware.js) */

.beta { background: var(--aksent-myk); color: var(--aksent-blekk); font-size: .8125rem; line-height: 1.35; }
.beta > div { max-width: 1180px; margin: 0 auto; padding: 8px 12px; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 2px 8px; text-align: center; }
.beta .merke { font: 600 .6875rem/1 var(--sans); letter-spacing: .06em; text-transform: uppercase; background: var(--aksent); color: var(--paa-aksent); border-radius: 999px; padding: 4px 8px 3px; }
.beta a { color: inherit; font-weight: 600; white-space: nowrap; }
.beta a::after { content: " →"; }
.beta .lang { display: none; }
@media (max-width: 380px) { .beta { font-size: .78125rem; } }
@media (min-width: 640px) { .beta .lang { display: inline; } .beta .kort-tekst { display: none; } .beta > div { gap: 2px 10px; } }

/* ---------------------------------------------------------------- samtykket (public/assets/telling.js)
   En smal stripe midt nederst på PC og nettbrett, med teksten til venstre og svarene til høyre, og et bunnark på mobil,
   i appens stil. Mens det vises, får siden like mye luft nederst (--samtykke-hoyde), så ingenting blir liggende under
   det. De to svarene er like store og like lette å trykke (Datatilsynet). */

.samtykke { position: fixed; z-index: 60; left: 16px; right: 16px; bottom: 16px; max-width: 860px; margin: 0 auto;
  display: flex; align-items: center; gap: 16px; padding: 12px 12px 12px 18px;
  border-radius: 20px; background: var(--flate); border: 1px solid var(--linje); box-shadow: var(--skygge); color: var(--blekk2);
  font-size: .8125rem; line-height: 1.45; }
.samtykke p { margin: 0; flex: 1; min-width: 0; }
.samtykke a { color: var(--aksent-blekk); font-weight: 500; }
.samtykke div { display: flex; gap: 8px; flex: none; }
.samtykke button { flex: 1; min-width: 0; width: 9.5rem; height: 40px; padding: 0 12px; border-radius: 999px; border: 1px solid var(--linje);
  background: var(--flate2); color: var(--blekk); font: 600 .875rem/1 var(--sans); white-space: nowrap; cursor: pointer; }
.samtykke button:hover { border-color: color-mix(in srgb, var(--aksent) 40%, var(--linje)); }
body.med-samtykke { padding-bottom: var(--samtykke-hoyde, 0px); }
@media (max-width: 699px) {
  .samtykke { left: 0; right: 0; bottom: 0; max-width: none; flex-direction: column; align-items: stretch; gap: 12px;
    border-radius: 20px 20px 0 0; border-width: 1px 0 0; padding: 16px 16px calc(16px + env(safe-area-inset-bottom));
    font-size: .875rem; }
  .samtykke button { width: auto; height: 42px; }
}

/* ---------------------------------------------------------------- toppen og bunnen */

.skjult-tekst { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.topp { display: flex; align-items: center; justify-content: space-between; padding: 16px 0; gap: 16px; }
.merke-lenke, .merke { display: flex; align-items: center; gap: 10px; color: var(--blekk); font-weight: 600; font-size: 1.0625rem; flex: none; }
.merke-lenke:hover, .merke:hover { text-decoration: none; }
.merke-lenke img, .merke img { width: 32px; height: 32px; border-radius: 8px; }
.beta .merke { display: inline-block; font-size: .6875rem; }   /* betamerket er ikke logoen */
.meny { display: flex; align-items: center; gap: 4px 20px; font-size: .9375rem; flex: none; }
.meny a { color: var(--blekk2); }
.meny a[aria-current] { color: var(--blekk); font-weight: 600; }
.meny .sokeknapp { display: grid; place-items: center; width: 38px; height: 38px; margin: -8px -8px -8px -6px; border-radius: 50%; color: var(--blekk2); }
.meny .sokeknapp .ikon { width: 19px; height: 19px; }
.meny .sokeknapp:hover { background: var(--flate2); }
/* lyst eller mørkt (assets/tema.js): en liten bryter i stil med segmentvelgeren, med solen og månen. Det som gjelder,
   valgt eller fra systemet, er markert av fargetokenene over, så det stemmer før skriptet har kjørt. */
.tema { display: inline-flex; gap: 2px; padding: 3px; border-radius: 999px; background: var(--seg-spor); flex: none; }
.tema button { display: grid; place-items: center; width: 30px; height: 26px; padding: 0; border: 0; border-radius: 999px;
  cursor: pointer; background: none; }
.tema .ikon { width: 15px; height: 15px; }
.tema [data-tema-valg="lys"] { background: var(--tema-lys); box-shadow: var(--tema-lys-skygge); color: var(--tema-lys-farge); }
.tema [data-tema-valg="mork"] { background: var(--tema-mork); box-shadow: var(--tema-mork-skygge); color: var(--tema-mork-farge); }
.tema button:hover { color: var(--blekk); }
/* i toppen fra 480 px; på smalere telefoner i bunnen, der toppen ikke har plass */
.topp .tema { display: none; }
.bunn .tema { align-self: flex-start; margin-top: 4px; }
@media (min-width: 480px) { .topp .tema { display: inline-flex; } .bunn .tema { display: none; } }
.toppsok { display: none; flex: 1; max-width: 420px; margin: 0 auto; }
@media (min-width: 900px) { .toppsok { display: block; } .meny .sokeknapp { display: none; } }
@media (max-width: 400px) { .meny { gap: 4px 14px; font-size: .875rem; } .merke-lenke { font-size: 1rem; } }
/* de minste telefonene (320 px): bare merket uten navnet i toppen, ellers går menyen utenfor skjermen */
@media (max-width: 359px) { .topp .merke-lenke { font-size: 0; gap: 0; } .meny { gap: 4px 12px; } }

.bunn { border-top: 1px solid var(--linje); padding: 32px 0 40px; margin-top: 40px; color: var(--blekk3); font-size: .875rem; }
.bunn-kolonner { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-bottom: 24px; }
.bunn-om { grid-column: 1 / -1; max-width: 26em; }
.bunn-om .merke-lenke { font-size: 1rem; }
.bunn-om .merke-lenke img { width: 28px; height: 28px; border-radius: 7px; }
.bunn-om p { margin: 10px 0 0; line-height: 1.5; }
.bunn nav { display: flex; flex-direction: column; gap: 8px; }
.bunn nav h2 { font-size: .75rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--blekk3); margin: 0 0 4px; }
.bunn nav a { color: var(--blekk2); }
@media (min-width: 700px) { .bunn-kolonner { grid-template-columns: 2fr 1fr 1fr; } .bunn-om { grid-column: auto; } }
.bunn-rettigheter { margin: 0 0 12px; font-size: .8125rem; line-height: 1.5; max-width: 60em; }
.bunn .rad { display: flex; flex-wrap: wrap; gap: 8px 20px; justify-content: space-between; padding: 0; color: inherit; }
.bunn a { color: var(--blekk2); }

/* ---------------------------------------------------------------- søket (lib/komponenter.js sokefelt, assets/sok.js) */

.sokefelt { position: relative; display: flex; align-items: center; gap: 10px; height: 42px; padding: 0 14px; border-radius: 12px;
  background: var(--flate); border: 1px solid var(--linje); color: var(--aksent-blekk); }
.sokefelt:focus-within { border-color: var(--aksent); box-shadow: 0 0 0 1px var(--aksent); }
.sokefelt > .ikon { width: 17px; height: 17px; flex: none; stroke-width: 2.4; }
.sokefelt input { flex: 1; min-width: 0; height: 100%; border: 0; outline: 0; background: none; color: var(--blekk); font: 400 .9375rem var(--sans); }
.sokefelt input::placeholder { color: var(--blekk3); }
.sokefelt input::-webkit-search-cancel-button { -webkit-appearance: none; }
.sokefelt.stort { height: 56px; padding: 0 18px; border-radius: 16px; box-shadow: 0 3px 16px var(--seg-skygge); }
.sokefelt.stort input { font-size: 1.0625rem; }
.sokefelt.stort:focus-within { box-shadow: 0 0 0 1px var(--aksent), 0 3px 16px var(--seg-skygge); }
.forslag { position: absolute; left: -1px; right: -1px; top: calc(100% + 6px); z-index: 20; max-height: min(70vh, 560px); overflow-y: auto;
  background: var(--flate); border: 1px solid var(--linje); border-radius: 16px; box-shadow: var(--skygge); padding: 6px; text-align: left; }
.forslag-gruppe { font-size: .6875rem; letter-spacing: .1em; text-transform: uppercase; color: var(--blekk3); padding: 10px 12px 4px; }
.forslag-rad, .forslag-alle { display: flex; flex-direction: column; gap: 1px; padding: 9px 12px; border-radius: 10px; color: var(--blekk); }
.forslag-rad:hover, .forslag-alle:hover { text-decoration: none; background: var(--flate2); }
.forslag [role="option"][aria-selected="true"] { background: var(--aksent-myk); }
.forslag-navn { font-size: .9375rem; font-weight: 500; }
.forslag-meta { font-size: .75rem; color: var(--blekk3); }
.forslag-rad.inaktiv .forslag-navn { color: var(--blekk2); }
.forslag-alle { font-size: .875rem; font-weight: 500; color: var(--aksent-blekk); border-top: 1px solid var(--strek); border-radius: 0 0 10px 10px; margin-top: 4px; }
.forslag-tom { padding: 14px 12px; font-size: .875rem; color: var(--blekk3); }
.sok-topp { padding: 16px 0 8px; }
.sok-topp h1, .forside-topp h1 { font: 500 clamp(2.25rem, 7vw, 3rem)/1.05 var(--serif); letter-spacing: -.01em; }
.sok-topp > p, .forside-topp > p { color: var(--blekk3); font-size: .875rem; margin: 6px 0 18px; }
.sokegruppe { margin-top: 26px; }
.sokegruppe h2 { font-size: 1.0625rem; font-weight: 600; margin: 0 0 10px; }
.sokegruppe h2 span { font-size: .8125rem; font-weight: 500; color: var(--blekk3); margin-left: 4px; }
.kort.liste { padding: 0 18px; }
.sok-tom { margin: 40px 0; text-align: center; color: var(--blekk3); font-size: .875rem; display: flex; flex-direction: column; gap: 6px; }
.sok-tom b { color: var(--blekk); font-size: 1rem; font-weight: 500; }

/* ---------------------------------------------------------------- 404-siden (lib/ikkefunnet.js) */
/* som de tomme sidene i appen (TomIllustrasjon): ringen, kjernen med symbolet og tre satellitter på appens plasser */
.ikke-funnet { max-width: 560px; margin: 0 auto; padding: 20px 0 12px; text-align: center; }
.tom-illustrasjon { position: relative; width: 188px; height: 188px; margin: 0 auto; }
.tom-illustrasjon .ring { position: absolute; inset: 5px; border-radius: 50%; border: 1px solid color-mix(in srgb, var(--aksent) 14%, transparent); }
.tom-illustrasjon .kjerne { position: absolute; inset: 30px; display: grid; place-items: center; border-radius: 50%; background: var(--aksent-myk); color: var(--aksent); }
.tom-illustrasjon .kjerne .ikon { width: 46px; height: 46px; stroke-width: 1.6; }
.tom-illustrasjon .satellitt { position: absolute; left: 74px; top: 74px; width: 40px; height: 40px; display: grid; place-items: center; border-radius: 12px; border: 2px solid var(--flate); box-shadow: 0 3px 6px rgba(0, 0, 0, .08); }
.tom-illustrasjon .satellitt .ikon { width: 16px; height: 16px; stroke-width: 2.3; }
.tom-illustrasjon .s1 { transform: translate(76px, -48px) rotate(8deg); }
.tom-illustrasjon .s2 { transform: translate(-84px, 4px) rotate(-8deg); }
.tom-illustrasjon .s3 { transform: translate(58px, 64px) rotate(-5deg); }
.ikke-funnet h1 { font: 500 1.625rem/1.15 var(--serif); margin-top: 4px; }
.ikke-funnet > p { color: var(--blekk2); font-size: .875rem; margin: 8px 0 22px; }
.ikke-funnet .sokefelt { text-align: left; }
.veifliser { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; margin-top: 18px; text-align: left; }
.kort.veiflis { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 16px; color: var(--blekk); }
a.kort.veiflis:hover { text-decoration: none; border-color: color-mix(in srgb, var(--aksent) 35%, var(--linje)); }
.veiflis .avatar { width: 36px; height: 36px; border-radius: 10px; font-size: .75rem; }
.veiflis-navn { font-size: .875rem; font-weight: 500; line-height: 1.25; min-width: 0; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow-wrap: anywhere; }

/* ---------------------------------------------------------------- forsiden */

.forside-topp { padding: 28px 0 8px; max-width: 680px; }
@media (min-width: 900px) { .forside-topp { padding: 56px 0 16px; margin: 0 auto; text-align: center; } .forside-topp .sokefelt { text-align: left; } }
.forside-del { margin-top: 36px; }
.deltittel { font-size: 1.0625rem; font-weight: 600; margin: 0 0 10px; }
.topplistene { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
/* smal skjerm: kortene i en rad man blar sidelengs i, med neste kort synlig i kanten (som Følger-kortene i appen) */
@media (max-width: 899px) {
  .topplistene { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: min(86%, 400px); overflow-x: auto;
    scroll-snap-type: x mandatory; margin: 0 -16px; padding: 0 16px 4px; scroll-padding: 0 16px; scrollbar-width: none; }
  .topplistene::-webkit-scrollbar { display: none; }
  .topplistene > * { scroll-snap-align: start; }
}
@media (min-width: 700px) and (max-width: 899px) { .topplistene { margin: 0 -24px; padding: 0 24px 4px; scroll-padding: 0 24px; } }
.topplistekort { display: flex; flex-direction: column; padding: 6px 16px 0; }
.topplistekort-hode { display: flex; align-items: center; gap: 13px; padding: 10px 0 12px; color: var(--blekk); border-bottom: 1px solid var(--strek); }
.topplistekort-hode:hover { text-decoration: none; }
.topplistekort-hode > span:nth-child(2) { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 0; }
.symbol { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 10px; flex: none; }
.symbol .ikon { width: 17px; height: 17px; }
.topprad { display: grid; grid-template-columns: 22px minmax(0, 1fr) auto; align-items: baseline; gap: 10px; padding: 9px 0; color: var(--blekk); }
.topprad + .topprad { border-top: 1px solid var(--strek); }
.topprad:hover { text-decoration: none; }
.topprad:hover .navn { color: var(--aksent-blekk); }
.topprad .nr { font: .6875rem/1 var(--mono); color: var(--blekk3); }
.topprad .navn { font-size: .875rem; font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.topprad .navn small { display: block; font-size: .71875rem; font-weight: 400; color: var(--blekk3); }
.topprad .verdi b { font: 500 1rem/1.2 var(--serif); font-variant-numeric: tabular-nums; white-space: nowrap; }
.topplistekort .kortlenke { margin-top: auto; padding: 12px 0 14px; }
.bransjeflisene { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
@media (min-width: 700px) { .bransjeflisene { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1000px) { .bransjeflisene { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.bransjeflis { display: flex; flex-direction: column; padding: 14px; border-radius: 18px; color: var(--blekk); }
.bransjeflis:hover { text-decoration: none; border-color: color-mix(in srgb, var(--farge) 40%, var(--linje)); }
.bransjeflis-topp { display: flex; justify-content: space-between; align-items: flex-start; }
.bransjeflis .symbol { width: 34px; height: 34px; color: var(--farge); background: color-mix(in srgb, var(--farge) 14%, transparent); }
.bransjeflis .sparkline i { width: 6px; }
.bransjeflis .sparkline { gap: 2px; }
.bransjeflis-navn { font-size: .875rem; font-weight: 600; margin-top: 10px; line-height: 1.3; min-height: 2.6em; }
.bransjeflis-tall { font-size: .75rem; color: var(--blekk3); margin-top: 4px; font-variant-numeric: tabular-nums; }
.bransjeflis-tall b { font-weight: 500; margin-left: 4px; }
.appkort { display: flex; align-items: center; gap: 14px; margin-top: 36px; padding: 16px 18px; color: var(--blekk); background: var(--aksent-myk); border-color: transparent; }
.appkort:hover { text-decoration: none; filter: brightness(.99); }
.appkort .symbol { background: var(--aksent); color: var(--paa-aksent); }
.appkort > span:nth-child(2) { display: flex; flex-direction: column; gap: 3px; flex: 1; }
.appkort .rad-under { color: var(--blekk2); }
.appkort .chevron { color: var(--aksent-blekk); }

/* ---------------------------------------------------------------- appsiden (/app) */

.appside .appikon { width: 88px; height: 88px; border-radius: 20px; box-shadow: var(--skygge); }
.appside-topp h1 { font: 500 clamp(2.25rem, 7vw, 3.5rem)/1.08 var(--serif); margin: 24px 0 12px; letter-spacing: -.01em; }
.appside .fordeler .symbol { width: 40px; height: 40px; border-radius: 12px; background: var(--aksent-myk); color: var(--aksent-blekk); margin-bottom: 14px; }
.appside .fordeler h3 { margin: 0 0 6px; font-size: 1.0625rem; }
.appside .fordeler p { margin: 0; color: var(--blekk2); font-size: .9375rem; }

/* ---------------------------------------------------------------- kort og overskrifter */

.kort { background: var(--flate); border: 1px solid var(--linje); border-radius: 22px; padding: 18px; min-width: 0; }
.kort > :first-child { margin-top: 0; }
.kort-hode { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.kort-hode > div { min-width: 0; }
.kort-tittel { font-size: .96875rem; font-weight: 500; line-height: 1.3; margin: 0; }
.kort-tittel.valgt { color: var(--aksent-blekk); }
.kort-under { font-size: .75rem; color: var(--blekk3); margin: 3px 0 0; }
.kort-tall { font: 500 1.625rem/1.1 var(--serif); white-space: nowrap; }
.seksjonsetikett { font: 400 .6875rem/1.3 var(--sans); letter-spacing: .1em; text-transform: uppercase; color: var(--blekk3); margin: 8px 4px 0; }
/* minst 12 px: lange fotnoter (topplisten for vekst) er halve teksten på telefon, og Lighthouse vil ha 12 px på 60 % */
.fotnote { font-size: .75rem; line-height: 1.55; color: var(--blekk3); margin: 2px 2px 0; }
.infokort { background: var(--aksent-myk); border-color: transparent; border-radius: 18px; padding: 16px 18px; }
.infokort h3 { font-size: .875rem; font-weight: 500; color: var(--aksent-blekk); margin: 0 0 5px; }
.infokort p { font-size: .78125rem; color: var(--blekk2); margin: 0; line-height: 1.5; }
.strek-under { border-top: 1px solid var(--strek); }

/* Piller og merkelapper */
.pille { display: inline-block; font-size: .78125rem; font-weight: 500; border-radius: 999px; padding: 2px 10px; white-space: nowrap; font-variant-numeric: tabular-nums; }
.pille.pos { color: var(--positiv); background: var(--positiv-myk); }
.pille.neg { color: var(--negativ); background: var(--negativ-myk); }
.pille.noytral { color: var(--blekk2); background: var(--flate2); }
.merker { list-style: none; display: flex; flex-wrap: wrap; gap: 6px; margin: 14px 0 0; padding: 0; }
.merkelapp { display: inline-flex; align-items: center; gap: 5px; padding: 5px 10px; border-radius: 999px; font-size: .78125rem;
  font-weight: 500; background: var(--flate2); color: var(--blekk2); }
.merkelapp .ikon { width: 12px; height: 12px; }
.merkelapp.pos { background: var(--positiv-myk); color: var(--positiv); }
.merkelapp.neg { background: var(--negativ-myk); color: var(--negativ); }
.merkelapp .prikk { width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.merkelapp.noytral .prikk { background: var(--blekk3); }
.ikon { width: 1em; height: 1em; flex: none; }

/* Fliser: ett tall og en liten figur, to og to med lik høyde */
.fliser { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.flis { background: var(--flate); border: 1px solid var(--linje); border-radius: 18px; padding: 14px 15px; display: flex; flex-direction: column; min-width: 0; }
.flis-tittel { font-size: .75rem; color: var(--blekk3); }
.flis-verdi { font: 500 1.5625rem/1.15 var(--serif); margin-top: 4px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.flis-figur { display: flex; align-items: center; height: 24px; margin-top: 10px; }
.flis-under { font-size: .71875rem; color: var(--blekk3); margin-top: 7px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.flis-under.pos { color: var(--positiv); }
.flis-under.neg { color: var(--negativ); }

/* Rad som går videre (Lenkerad) */
.lenkerad { display: flex; align-items: center; gap: 12px; padding: 11px 14px; border-radius: 16px; color: var(--blekk); font-size: .90625rem; }
.lenkerad:hover { text-decoration: none; border-color: color-mix(in srgb, var(--farge) 35%, var(--linje)); }
.lenkerad .symbol { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 8px; color: var(--farge); background: color-mix(in srgb, var(--farge) 13%, transparent); flex: none; }
.lenkerad .symbol .ikon { width: 14px; height: 14px; }
.lenkerad-tekst { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.chevron { width: 13px; height: 13px; color: var(--strek2); flex: none; stroke-width: 3; }
.chevron.skjult { visibility: hidden; display: block !important; }

/* Lister: rader med avatar, tekst, verdi og pil */
.liste { display: flex; flex-direction: column; }
.listerad { display: flex; align-items: center; gap: 12px; padding: 12px 0; color: var(--blekk); min-width: 0; }
.listerad + .listerad { border-top: 1px solid var(--strek); }
a.listerad:hover { text-decoration: none; }
a.listerad:hover .rad-tittel { color: var(--aksent-blekk); }
.rad-tekst { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 0; }
.rad-tittel { font-size: .90625rem; font-weight: 500; overflow-wrap: anywhere; }
.rad-under { font-size: .75rem; color: var(--blekk3); }
.rad-hoyre { text-align: right; white-space: nowrap; font-size: .875rem; font-variant-numeric: tabular-nums; }
.rad-hoyre small { display: block; font-size: .71875rem; color: var(--blekk3); }
.rad-hoyre .stort { font: 500 1.125rem/1.2 var(--serif); }
.fargemerke { width: 9px; height: 9px; border-radius: 3px; flex: none; }

.avatar { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 11.5px; font-size: .8125rem; font-weight: 600; flex: none; }
.avatar.rund { border-radius: 50%; }
.avatar .ikon { width: 16px; height: 16px; }
.tint0 { background: var(--t0-bg); color: var(--t0-fg); }
.tint1 { background: var(--t1-bg); color: var(--t1-fg); }
.tint2 { background: var(--t2-bg); color: var(--t2-fg); }
.tint3 { background: var(--t3-bg); color: var(--t3-fg); }
.tint4 { background: var(--t4-bg); color: var(--t4-fg); }

/* Faktarader (Om selskapet) */
.faktarad { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; padding: 12px 0; font-size: .875rem; }
.faktarad > span:first-child { color: var(--blekk3); white-space: nowrap; }
.faktarad > :last-child { text-align: right; overflow-wrap: anywhere; }
.faktarad + .faktarad, .tekstrad + .faktarad, .tekstrad + .tekstrad { border-top: 1px solid var(--strek); }
.tekstrad { padding: 12px 0; font-size: .875rem; }
.tekstrad span { color: var(--blekk3); }
.tekstrad p { margin: 4px 0 0; }

/* Segmentvelgeren (Segmented) */
.segment { display: flex; gap: 2px; padding: 3px; border-radius: 12px; background: var(--seg-spor); }
.segment button { flex: 1; min-width: 0; font: 500 .8125rem/1.2 var(--sans); color: var(--blekk3); background: none; border: 0; border-radius: 9px;
  padding: 7px 6px; cursor: pointer; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.segment button:hover { color: var(--blekk2); }
.segment button[aria-selected="true"], .segment button[aria-pressed="true"] { color: var(--blekk); background: var(--seg-paa); box-shadow: 0 0 0 1px var(--seg-ring), 0 1px 3px var(--seg-skygge); }
.segment.kompakt button { font-size: .78125rem; padding: 6px; }
.segment.stor button { font-size: .84375rem; padding: 8px 6px; }

/* Fanene som skillekort (Skillekort): farget merke, navn og antall, strek i fanens farge under den valgte */
.skillekort { position: relative; margin: 0 -16px; }
.skillekort::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: var(--strek); }
.skillekort-rekke { display: flex; gap: 2px; overflow-x: auto; padding: 0 6px; scrollbar-width: none; }
.skillekort-rekke::-webkit-scrollbar { display: none; }
.skillekort a { position: relative; display: inline-flex; align-items: center; gap: 6px; padding: 12px 12px 13px; white-space: nowrap;
  font-size: .90625rem; font-weight: 500; color: var(--blekk2); z-index: 1; }
.skillekort a:hover { text-decoration: none; color: var(--blekk); }
.skillekort .merke { width: 9px; height: 9px; border-radius: 2.5px; background: var(--farge); }
.skillekort .antall { font-size: .75rem; color: var(--blekk3); font-variant-numeric: tabular-nums; }
.skillekort a[aria-current] { color: var(--blekk); font-weight: 600; }
.skillekort a[aria-current]::after { content: ""; position: absolute; left: 10px; right: 10px; bottom: 0; height: 3px; border-radius: 2px; background: var(--farge); }
@media (min-width: 700px) { .skillekort { margin: 0; } .skillekort-rekke { padding: 0; } }

/* Hurtigknappene under kartotekkortet (Hurtigknapp) */
.hurtigvalg { display: flex; gap: 10px; margin-top: 14px; }
.hurtigknapp { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; height: 56px; border-radius: 14px;
  background: var(--flate); border: 1px solid var(--linje); color: var(--aksent-blekk); font-size: .71875rem; font-weight: 500; }
.hurtigknapp:hover { text-decoration: none; border-color: color-mix(in srgb, var(--aksent) 35%, var(--linje)); }
.hurtigknapp .ikon { width: 17px; height: 17px; }
/* Hurtigvalgene som små knapper nederst til høyre i kartotekkortet, på linje med (den siste raden av) merkelappene: ett
   alene alltid, flere bare på brede skjermer. På mobil står flere i raden under kortet (.hurtigvalg), som i appen. */
.kortbunn { display: flex; align-items: flex-end; justify-content: space-between; gap: 10px; margin-top: 14px; }
.kortbunn .merker { margin-top: 0; flex: 1; min-width: 0; }
.kortknapper { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; flex: none; }
.kortknapper.bare-bred { display: none; }
@media (min-width: 700px) { .kortknapper.bare-bred { display: flex; } .hurtigvalg { display: none; } }
.knapp.kortknapp { flex: none; height: auto; padding: 5px 12px; gap: 5px; font-size: .78125rem; font-weight: 500;
  background: var(--aksent-myk); color: var(--aksent-blekk); }   /* samme høyde som merkelappene */
.knapp.kortknapp .ikon { width: 12px; height: 12px; }

/* Knapper */
.knapp { display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 16px; border-radius: 999px; background: var(--aksent);
  color: var(--paa-aksent); font-size: .9375rem; font-weight: 600; border: 0; }
.knapp:hover { text-decoration: none; filter: brightness(1.05); }
.knapp .ikon { width: 15px; height: 15px; }
.knapp.lys { background: var(--flate); color: var(--aksent-blekk); border: 1px solid var(--linje); }
.rundknapp { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: var(--flate); border: 1px solid var(--linje); color: var(--blekk2); }
.rundknapp .ikon { width: 17px; height: 17px; }
/* Apples offisielle merke (toolbox.marketingtools.apple.com), sort på lys bakgrunn og hvitt på mørk */
.appstore { display: inline-block; line-height: 0; }
.appstore img { height: 50px; width: auto; }
/* før lansering: knappen til den åpne betaen i TestFlight, bygd som Apples merke men med appikonet */
.beta-knapp { display: inline-flex; align-items: center; gap: 13px; height: 62px; padding: 0 24px 0 10px; border-radius: 15px;
  background: var(--blekk); color: var(--bg); text-decoration: none;
  box-shadow: 0 1px 2px rgba(23, 24, 28, .10), 0 8px 22px rgba(23, 24, 28, .16); transition: transform .15s ease, box-shadow .15s ease; }
.beta-knapp:hover { text-decoration: none; transform: translateY(-1px); box-shadow: 0 2px 4px rgba(23, 24, 28, .12), 0 12px 28px rgba(23, 24, 28, .20); }
.beta-knapp img { width: 42px; height: 42px; border-radius: 9.5px; flex: none; }
.beta-knapp span { display: flex; flex-direction: column; gap: 3px; text-align: left; line-height: 1.2; }
.beta-knapp small { font-size: 12px; font-weight: 500; opacity: .78; letter-spacing: .01em; }
.beta-knapp b { font-size: 17px; font-weight: 600; letter-spacing: -.01em; }

/* ---------------------------------------------------------------- grafene (lib/graf.js og assets/graf.js) */

/* Søylene år for år fra en nullstrek. Plassene deler bredden; søylene har høyde i prosent av feltet. */
.soyler { --hoyde: 96px; --mellomrom: 12px; position: relative; user-select: none; -webkit-user-select: none; }
.soyler[data-graf] { cursor: pointer; }
.soyler:focus-visible { outline-offset: 6px; }
.soyler-felt { position: relative; display: flex; gap: var(--mellomrom); height: var(--hoyde); }
.soyler-felt.med-tall { height: calc(var(--hoyde) + 18px); padding-top: 18px; }
.soyler-felt .plass { position: relative; flex: 1; min-width: 0; height: 100%; }
.soyler .soyle { position: absolute; left: 0; right: 0; border-radius: 3px 3px 0 0; background: var(--farge); opacity: .32; transition: opacity .18s ease, background-color .18s ease; }
.soyler .negativ .soyle { border-radius: 0 0 3px 3px; background: var(--p-rod); }
.soyler .uthevet .soyle { opacity: 1; }
.soyler .grunnlinje { position: absolute; left: 0; right: 0; height: 2px; margin-bottom: -1px; background: var(--strek2); }
.soyler .nullstrek { position: absolute; left: 0; right: 0; height: 1px; background: var(--strek2); }
.soyletall { position: absolute; left: 50%; transform: translate(-50%, -5px); font-size: .65625rem; line-height: 1; color: var(--blekk3);
  white-space: nowrap; font-variant-numeric: tabular-nums; pointer-events: none; }
.uthevet .soyletall { color: var(--blekk); }
.uthevet .soyletall.neg { color: var(--negativ); }
.soyletall.bare-uthevet { display: none; }
.uthevet .soyletall.bare-uthevet { display: block; }
.plass:first-child .soyletall { left: 0; transform: translate(0, -5px); }
.plass:last-child .soyletall { left: auto; right: 0; transform: translate(0, -5px); }
/* heltekortet: blekkblå for året som vises, dempet blå for de andre */
.soyler.hoved .soyle { background: var(--helt-dim); opacity: 1; }
.soyler.hoved .uthevet .soyle { background: var(--aksent); }
.soyler.hoved .negativ .soyle { background: var(--p-rod); opacity: .3; }
.soyler.hoved .negativ.uthevet .soyle { opacity: 1; }
/* ansatte: grått, grønt for året som vises */
.soyler.ansatte .soyle { background: var(--p-dempet); opacity: 1; border-radius: 4px; }
.soyler.ansatte .uthevet .soyle { background: var(--p-gronn); }
/* årstallene midt under plassene; det valgte i en pille. Med mange år står bare hvert andre eller tredje når det er trangt */
.aarstall { display: flex; gap: var(--mellomrom); margin-top: 7px; height: 18px; }
.aarstall span { flex: 1; min-width: 0; display: flex; justify-content: center; font-size: .65625rem; line-height: 18px; color: var(--blekk3); white-space: nowrap; overflow: visible; }
.aarstall span.tomt { opacity: .55; }
.aarstall em, .linje-aar em { font-style: normal; padding: 0 7px; border-radius: 999px; }
.aarstall .valgt em, .linje-aar .valgt em { background: var(--aksent-myk); color: var(--aksent-blekk); font-weight: 600; }
.aarstall span.valgfri { visibility: hidden; }
.aarstall span.valgfri.valgt { visibility: visible; }
.kort, .flis { container-type: inline-size; }
/* bred graf: alle årstallene og tallene over alle søylene */
@container (min-width: 520px) {
  .aarstall span.valgfri { visibility: visible; }
  .soyler-felt.med-tall .soyletall.bare-uthevet { display: block; }
}

/* Små søyler: fem plasser, siste i farge (Sparkline), og nøkkeltallsflisenes søyler med nullstrek (SmaaSoyler) */
.sparkline { display: inline-flex; align-items: flex-end; gap: 3px; height: var(--hoyde, 34px); }
.sparkline i { display: block; width: 8px; border-radius: 2px; background: var(--p-dempet); }
.sparkline i.siste { background: var(--farge); }
.sparkline i.tom { height: 2px; background: var(--strek2); }
.sparkline.fyll { display: flex; width: 100%; }
.sparkline.fyll i { flex: 1; width: auto; border-radius: 3px 3px 0 0; }
.smaasoyler { display: inline-flex; gap: 3px; height: 24px; }
.smaasoyler > span { position: relative; width: 10px; height: 100%; }
.smaasoyler i { position: absolute; left: 0; right: 0; border-radius: 2px; background: var(--farge); opacity: .32; }
.smaasoyler .neg i { background: var(--p-rod); }
.smaasoyler .siste i { opacity: 1; }
/* Nøkkeltallenes søyler (MiniSoyler) */
.soyler.mini { --hoyde: 34px; }
.soyler.mini .soyle { border-radius: 2px 2px 0 0; opacity: .45; }
.soyler.mini .uthevet .soyle { opacity: 1; }

/* Linjegrafen (MarginChart): SVG som strekkes, med punkter, aksemerker og boble i HTML */
.linjegraf { position: relative; user-select: none; -webkit-user-select: none; cursor: pointer; }
.linjeflate { position: relative; height: clamp(118px, 36cqw, 190px); }
.linjeflate svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.linjeflate .rutenett { stroke: var(--rutenett); stroke-width: 1; vector-effect: non-scaling-stroke; }
.linjeflate .linje { fill: none; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.linjeflate .areal { stroke: none; }
.linjeflate .referanse { fill: none; stroke: var(--blekk3); stroke-width: 1.6; stroke-dasharray: 4 4; stroke-linecap: round; vector-effect: non-scaling-stroke; }
.linjeflate .valgt-strek { stroke: var(--strek2); stroke-width: 1.2; stroke-dasharray: 3 3; vector-effect: non-scaling-stroke; display: none; }
.aksemerke { position: absolute; left: 0; width: 11.25%; text-align: right; transform: translateY(-50%); font-size: .59375rem; color: var(--blekk3); white-space: nowrap; font-variant-numeric: tabular-nums; }
.linjepunkt { position: absolute; top: 0; bottom: 0; width: 0; }
.punkt, .refpunkt { position: absolute; transform: translate(-50%, -50%); border-radius: 50%; }
.punkt { left: 0; width: 7px; height: 7px; background: var(--flate); border: 2.2px solid var(--farge); box-sizing: content-box; transition: transform .12s ease; }
.refpunkt { left: 0; width: 6px; height: 6px; background: var(--blekk3); display: none; }
.linjepunkt.valgt .punkt { background: var(--farge); border-color: var(--flate); transform: translate(-50%, -50%) scale(1.3); }
.linjepunkt.valgt .refpunkt { display: block; }
.punkt.pil { width: 0; height: 0; border-radius: 0; background: none; border: 5px solid transparent; }
.punkt.pil.ned { border-top: 7px solid var(--farge); }
.punkt.pil.opp { border-bottom: 7px solid var(--farge); }
.linje-aar { position: relative; display: block; height: 18px; }
.linje-aar span { position: absolute; transform: translateX(-50%); font-size: .65625rem; line-height: 18px; color: var(--blekk3); white-space: nowrap; }
.linje-aar span.tomt { opacity: .55; }
.boble { position: absolute; top: -10px; transform: translateY(-100%); z-index: 2; background: var(--flate); border: .5px solid var(--strek2); border-radius: 10px;
  padding: 8px 10px; box-shadow: 0 4px 10px rgba(0, 0, 0, .12); font-size: .71875rem; color: var(--blekk3); white-space: nowrap; pointer-events: none;
  display: grid; gap: 3px; }
.boble[hidden] { display: none; }
.boble b { color: var(--blekk); font-size: .6875rem; }
.boble span { display: flex; align-items: center; gap: 6px; }
.boble i { width: 8px; height: 8px; border-radius: 2px; }
.boble i.stiplet { height: 2px; background: repeating-linear-gradient(90deg, var(--blekk3) 0 3px, transparent 3px 5px); }
.boble em { font-style: normal; font-weight: 600; color: var(--blekk); margin-left: auto; padding-left: 10px; font-variant-numeric: tabular-nums; }
.boble em.neg { color: var(--negativ); }
.forklaring { display: flex; flex-wrap: wrap; gap: 6px 14px; margin-top: 8px; font-size: .6875rem; color: var(--blekk3); }
.forklaring span { display: inline-flex; align-items: center; gap: 6px; }
.forklaring .strek { display: inline-block; width: 14px; height: 2.5px; border-radius: 2px; }
.forklaring .strek.stiplet { background: repeating-linear-gradient(90deg, var(--blekk3) 0 3px, transparent 3px 5px); }
.forklaring i:not(.strek) { width: 8px; height: 8px; border-radius: 3px; display: inline-block; }

/* Hvor i bransjens fordeling (PersentilSkala) */
.persentil-rad { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; font-size: .84375rem; color: var(--blekk2); }
.persentil-rad b { font-weight: 600; color: var(--blekk); }
.persentil-rad b.pos { color: var(--positiv); }
.persentil-rad b.neg { color: var(--negativ); }
.persentil-skala { position: relative; display: flex; gap: 3px; height: 10px; margin: 12px 0 0; }
.persentil-skala .sone { display: block; border-radius: 5px; }
.persentil-skala .rod { flex: 25; background: var(--p-rod); }
.persentil-skala .graa { flex: 50; background: var(--p-dempet); }
.persentil-skala .gronn { flex: 25; background: var(--p-gronn); }
.persentil-skala .markor { position: absolute; top: 50%; width: 20px; height: 20px; border-radius: 50%; transform: translate(-50%, -50%);
  background: var(--blekk2); border: 3px solid var(--flate); box-shadow: 0 1px 4px rgba(0, 0, 0, .2); }
.persentil-skala .markor.pos { background: var(--p-gronn); }
.persentil-skala .markor.neg { background: var(--p-rod); }
.persentil-tekst { display: flex; justify-content: space-between; font-size: .65625rem; color: var(--blekk3); margin-top: 12px; }
.persentil + .persentil { margin-top: 18px; }

/* Verdien mot bransjens median (MotMedian) og andelsstolpen (Andelsstolpe) */
.motmedian { position: relative; display: block; width: 100%; height: 14px; }
.motmedian .spor { position: absolute; left: 0; right: 0; top: 4px; height: 6px; border-radius: 3px; background: var(--flate2); }
.motmedian .median { position: absolute; top: 0; width: 2px; height: 14px; margin-left: -1px; background: var(--blekk3); }
.motmedian .prikk { position: absolute; top: 1px; width: 12px; height: 12px; margin-left: -6px; border-radius: 50%; border: 2px solid var(--flate); box-sizing: border-box; }
.motmedian .prikk.over { background: var(--p-gronn); }
.motmedian .prikk.under { background: var(--p-varm); }
.andelsstolpe { display: block; width: 100%; height: 6px; border-radius: 3px; background: var(--flate2); overflow: hidden; }
.andelsstolpe i { display: block; height: 100%; border-radius: 3px; }

/* Stablet stolpe med forklaring (balansen, eiertypene) og ringen med eierne */
.stablet .etikett { display: block; font-size: .75rem; color: var(--blekk3); margin-bottom: 7px; }
.stablet-stolpe { display: flex; gap: 2px; height: 26px; border-radius: 6px; overflow: hidden; }
.stablet-stolpe i { display: block; min-width: 2px; }
.stablet .forklaring { gap: 6px 12px; font-size: .71875rem; color: var(--blekk2); }
.stablet .forklaring .neg { color: var(--negativ); }
.stablet + .stablet { margin-top: 16px; }
.donut { flex: none; }
.donut circle { fill: none; stroke-width: var(--tykkelse); transform: rotate(-90deg); transform-origin: 50% 50%; }
.donut .spor { stroke: var(--flate2); }

/* Fremdriftslinjer (Mot bransjen) */
.fremdrift-rad { display: flex; justify-content: space-between; gap: 12px; font-size: .78125rem; color: var(--blekk2); margin-bottom: 5px; font-variant-numeric: tabular-nums; }
.fremdrift-rad.sterk { color: var(--blekk); }
.fremdrift-spor { display: block; height: 9px; border-radius: 5px; background: var(--flate2); overflow: hidden; }
.fremdrift-spor i { display: block; height: 100%; border-radius: 5px; }
.fremdrift + .fremdrift { margin-top: 13px; }

/* ---------------------------------------------------------------- selskapssidene */

.selskapsside { padding: 8px 0 48px; }
.kartotekkort { background: var(--flate); border: 1px solid var(--linje); border-radius: 20px; padding: 16px 18px 18px; }
.kartotekkort .orgnr { display: flex; align-items: center; gap: 6px; font: .65625rem/1 var(--mono); letter-spacing: .14em; color: var(--blekk3); margin: 0; text-transform: uppercase; }
.kartotekkort h1 { font: 500 clamp(1.75rem, 6vw, 2.25rem)/1.12 var(--serif); margin: 9px 0 0; letter-spacing: -.005em; overflow-wrap: anywhere; }
.kartotekkort .tidligere { font-size: .8125rem; color: var(--blekk3); margin: 5px 0 0; }
.kartotekkort .tidligere.nylig { color: var(--negativ); font-weight: 500; }
.selskapsside .virksomhet { color: var(--blekk2); margin: 10px 0 0; font-size: 1rem; line-height: 1.5; }
.toppknapper { display: flex; align-items: center; justify-content: flex-end; gap: 10px; margin: 0 0 12px; }
.toppknapper .sti { margin: 0 auto 0 0; }
.selskapsside .kort, .selskapsside .fliser, .selskapsside .lenkerad, .selskapsside .infokort { margin-top: 0; }
.stabel { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.innhold { display: flex; flex-direction: column; gap: 14px; padding-top: 16px; }
/* to spalter på PC, som appen på brede skjermer (Spalter) */
.spalter { display: grid; grid-template-columns: minmax(0, 1fr); gap: 14px; align-items: start; }
@media (min-width: 900px) { .spalter { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }
.helbredde { grid-column: 1 / -1; }

/* Heltekortet: omsetning, resultat og margin */
.heltekort .segment { margin-bottom: 18px; }
.helt-etikett { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; font-size: .78125rem; color: var(--blekk3); }
.helt-etikett .valgt { color: var(--aksent-blekk); }
.helt-tall { display: flex; align-items: baseline; gap: 10px; margin-top: 10px; }
.helt-tall b { font: 500 clamp(2.25rem, 9vw, 3rem)/1 var(--serif); font-variant-numeric: tabular-nums; white-space: nowrap; }
.helt-tall span { font-size: 1.125rem; color: var(--blekk3); }
.helt-under { font-size: .78125rem; color: var(--blekk3); margin: 6px 0 0; min-height: 1.2em; }
.heltekort .soyler { margin-top: 20px; }

/* Plassering i bransjen */
.plassering .plass-tall { display: flex; align-items: baseline; gap: 8px; margin-top: 12px; }
.plassering .plass-tall b { font: 500 2.375rem/1 var(--serif); font-variant-numeric: tabular-nums; }
.plassering .plass-tall span { font-size: .84375rem; color: var(--blekk2); }
.lokale { display: flex; gap: 10px; margin-top: 14px; }
.lokale div { flex: 1; min-width: 0; background: var(--flate2); border-radius: 12px; padding: 10px 12px; }
.lokale span { display: block; font-size: .71875rem; color: var(--blekk3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lokale b { font: 500 1.25rem/1.2 var(--serif); font-variant-numeric: tabular-nums; }
.lokale small { font-size: .75rem; color: var(--blekk3); margin-left: 4px; }
.kortlenke { display: flex; justify-content: space-between; align-items: center; margin-top: 16px; padding-top: 15px; border-top: 1px solid var(--strek); font-size: .84375rem; font-weight: 500; }
.kortlenke .chevron { color: currentColor; }
.persentiler { margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--strek); }
.persentiler .fotnote { margin-top: 12px; }

/* Lenkene under nøkkeltallene: alle årene i appen og årsregnskapet som PDF */
.snarveier { display: flex; flex-wrap: wrap; gap: 6px 18px; font-size: .875rem; font-weight: 500; }
.snarveier:empty { display: none; }
.snarveier a::after { content: " →"; }
/* Konsernet og lignende selskaper: lenker til andre selskapssider */
.selskapsliste { list-style: none; margin: 4px 0 0; padding: 0; }
.selskapsliste li { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding: 10px 0;
  border-top: 1px solid var(--strek); font-size: .9375rem; }
.selskapsliste li:first-child { border-top: 0; }
.selskapsliste span { color: var(--blekk3); font-size: .84375rem; white-space: nowrap; }
.kort h2.kort-tittel + .selskapsliste, .kort .kort-hode + .selskapsliste { margin-top: 10px; }
.etikett { color: var(--blekk3); font-size: .8125rem; display: block; }
.cta { background: var(--aksent-myk); border-color: transparent; text-align: center; padding: 26px 22px 24px; }
.cta h2 { font: 500 1.5rem/1.2 var(--serif); margin: 0 0 8px; }
.cta p { color: var(--blekk2); max-width: 30em; margin: 0 auto 16px; font-size: .9375rem; }

/* Lenkene fra selskapssiden til topplistene */
.lenkerad-rekke, .lenkerad-piller { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.lenkerad-piller a { font-size: .875rem; font-weight: 500; padding: 7px 14px; border-radius: 999px; background: var(--aksent-myk); }
.lenkerad-piller a::after { content: " →"; }
.lenkerad-piller a:hover { text-decoration: none; filter: brightness(.97); }

/* ---------------------------------------------------------------- selskapssidens faner */

.kartotekkort .kortrad { display: flex; justify-content: space-between; align-items: center; gap: 12px; min-height: 34px; margin: -4px -4px 0 0; }
.knapp.folg { height: 34px; padding: 0 14px; font-size: .875rem; gap: 6px; }
.knapp.folg .ikon { width: 13px; height: 13px; stroke-width: 2.4; }
.kartotekkort h1 { margin-top: 4px; }
.selskapsside .skillekort { margin-top: 14px; }
.stabel-del { display: flex; flex-direction: column; gap: 10px; }
.stabel-del .seksjonsetikett { margin-top: 4px; }
.faktakort { padding: 4px 16px; }
.kort-hoyre { font-size: .78125rem; text-align: right; font-variant-numeric: tabular-nums; }
.kort-under.ekstra { margin-top: 2px; }
.seriekort .soyler { margin-top: 18px; }
.heltekort > .kort-under { margin: 0 0 14px; }

/* Signalene */
ul.signaler { list-style: none; margin: 14px 0 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.signal { display: flex; align-items: flex-start; gap: 10px; font-size: .84375rem; }
.signal .ikon { width: 16px; height: 16px; margin-top: 2px; color: var(--blekk3); }
.signal.hoy .ikon { color: var(--negativ); }
.signal.middels .ikon { color: var(--p-varm); }

/* Lister som går kant i kant nederst i et kort */
.liste.kant { margin: 14px -18px -18px; }
.liste.kant .listerad { padding-left: 18px; padding-right: 18px; }
.liste.kant .listerad:first-child { border-top: 1px solid var(--strek); }
.rad-hoyre.pos { color: var(--positiv); }
.rad-hoyre.neg { color: var(--negativ); }

/* Hendelsene på en loddrett linje (HendelseRad) */
.hendelser { margin-top: 16px; }
.hendelse { position: relative; display: grid; grid-template-columns: 9px minmax(0, 1fr); gap: 14px; padding-bottom: 18px; }
.hendelse:not(.sist)::before { content: ""; position: absolute; left: 4px; top: 16px; bottom: 0; width: 1px; background: var(--strek); }
.hendelse-prikk { width: 9px; height: 9px; border-radius: 50%; background: var(--p-a); margin-top: 5px; }
.hendelse-dato { font-size: .71875rem; color: var(--blekk3); font-variant-numeric: tabular-nums; }
.hendelse p { margin: 3px 0 8px; font-size: .90625rem; line-height: 1.45; }
.hendelse .pille { font-size: .71875rem; }

/* Tabellene: alle årene side om side, navnene står fast til venstre når man blar */
.tabellkort { padding-bottom: 6px; }
.tabell-rull { overflow-x: auto; margin: 12px -18px 0; }
.regnskapstabell { border-collapse: collapse; width: 100%; font-size: .84375rem; font-variant-numeric: tabular-nums; }
.regnskapstabell th, .regnskapstabell td { padding: 9px 12px; text-align: right; white-space: nowrap; border-top: 1px solid var(--strek); }
.regnskapstabell thead th { font-size: .65625rem; letter-spacing: .05em; text-transform: uppercase; color: var(--blekk3); font-weight: 400; border-top: 0; padding-top: 4px; }
.regnskapstabell th[scope="row"], .regnskapstabell thead th:first-child { position: sticky; left: 0; z-index: 1; text-align: left; background: var(--flate); font-weight: 400; color: var(--blekk2); padding-left: 18px; }
.regnskapstabell tr.sterk th, .regnskapstabell tr.sterk td { font-weight: 600; color: var(--blekk); }
.regnskapstabell tr.inn th { padding-left: 32px; color: var(--blekk3); }
.regnskapstabell td:last-child { padding-right: 18px; }
.regnskapstabell td.neg { color: var(--negativ); }
.aarlenker { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.aarlenker a { font-size: .84375rem; font-weight: 500; padding: 6px 12px; border-radius: 999px; background: var(--aksent-myk); font-variant-numeric: tabular-nums; }
.aarlenker a:hover { text-decoration: none; filter: brightness(.97); }
.historikk-kommer { display: flex; align-items: center; gap: 6px; font-size: .78125rem; color: var(--blekk2); margin: 14px 2px 0; }
.historikk-kommer .ikon { width: 13px; height: 13px; color: var(--p-varm); }
.mot-bransjen { margin-top: 22px; padding-top: 18px; }
.fremdrifter { margin-top: 16px; }
.balanse { margin-top: 18px; }

/* Nøkkeltallene: kort i to kolonner per gruppe, med verdien, små søyler og endringen */
.nokkeltallgruppe { display: flex; flex-direction: column; gap: 10px; }
.nokkeltall { position: relative; gap: 6px; padding: 13px 12px 13px 14px; }
.nokkeltall .flis-tittel { padding-right: 22px; }
.nokkeltall-verdi { display: flex; align-items: baseline; gap: 4px; }
.nokkeltall-verdi b { font: 500 1.5rem/1.15 var(--serif); font-variant-numeric: tabular-nums; }
.nokkeltall-verdi span { font-size: .6875rem; color: var(--blekk3); }
.nokkeltall .soyler.mini { margin-top: 2px; }
.nokkeltall .flis-under { margin-top: 0; }
.forklar summary { position: absolute; top: 11px; right: 11px; display: grid; place-items: center; width: 18px; height: 18px; border-radius: 50%;
  border: 1.5px solid var(--blekk3); color: var(--blekk3); font: 600 .6875rem/1 var(--serif); cursor: pointer; list-style: none; }
.forklar summary::-webkit-details-marker { display: none; }
.forklar[open] summary { background: var(--aksent-blekk); border-color: var(--aksent-blekk); color: var(--flate); }
.forklar > div { margin-top: 4px; padding: 10px; border-radius: 10px; background: var(--aksent-myk); }
.forklar b { display: block; font-size: .71875rem; font-weight: 500; color: var(--aksent-blekk); }
.forklar p { margin: 4px 0 0; font-size: .6875rem; color: var(--blekk2); line-height: 1.45; }

/* Rollene og styret i tall */
.rollekort { padding-top: 10px; padding-bottom: 6px; }
.rollekort .seksjonsetikett { margin: 4px 0 4px; }
.tre-tall { display: flex; margin-top: 14px; }
.tre-tall div { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.tre-tall b { font: 500 1.375rem/1.2 var(--serif); font-variant-numeric: tabular-nums; }
.tre-tall span { font-size: .71875rem; color: var(--blekk3); }
.tre-tall + .kort-under { margin-top: 8px; }
.strek-under { margin-top: 14px; }

/* Eierne: ringen med de største, aksjekapitalen og listen */
.eierhode { display: flex; gap: 18px; align-items: center; }
.ring { position: relative; flex: none; }
.ring > span { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; }
.ring b { font: 500 1.5rem/1 var(--serif); font-variant-numeric: tabular-nums; }
.ring small { font-size: .59375rem; color: var(--blekk3); line-height: 1.2; margin-top: 3px; }
.stort-tall { display: block; font: 500 1.6875rem/1.15 var(--serif); margin-top: 2px; }
.eierkort .liste.kant { margin-top: 18px; }
.bytte { display: flex; gap: 10px; font-size: .84375rem; margin: 14px 0 0; }
.bytte .ikon { color: var(--aksent-blekk); width: 15px; height: 15px; flex: none; margin-top: 2px; }

/* Personsiden (PersonView): runde initialer, navnet og fødselsåret, så tallene, rollene, omsetningen og eierskapet */
.personside { padding: 8px 0 48px; }
.personhode { display: flex; align-items: center; gap: 14px; margin: 10px 4px 18px; }
.personhode .avatar { width: 56px; height: 56px; font-size: 1.125rem; }
.personhode h1 { font: 500 clamp(1.625rem, 5.5vw, 2.125rem)/1.12 var(--serif); margin: 0; letter-spacing: -.005em; overflow-wrap: anywhere; }
.personhode p { margin: 4px 0 0; font-size: .84375rem; color: var(--blekk2); }
.personside .kort, .personside .fliser { margin-top: 0; }
.kortspalter { display: flex; flex-direction: column; gap: 14px; }
.kortspalter > .stabel { display: contents; }
@media (min-width: 900px) {
  .kortspalter { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 14px; align-items: start; }
  .kortspalter > .stabel { display: flex; }
}
.kortspalter .kortplass { min-width: 0; }
.fliser .flis.hel { grid-column: 1 / -1; }
.fliser.kpi .flis { padding: 15px 16px; }
.fliser.kpi .flis-verdi { font-size: 1.625rem; margin-top: 5px; }
.fliser.kpi .flis-under { margin-top: 5px; }
.rad-under.neg { color: var(--negativ); }
.vis-alle > summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; padding: 14px 0 10px;
  border-top: 1px solid var(--strek); font-size: .84375rem; font-weight: 500; color: var(--aksent-blekk); }
.vis-alle > summary::-webkit-details-marker { display: none; }
.vis-alle > summary .chevron { transform: rotate(90deg); }
.vis-alle[open] > summary { display: none; }
.vis-alle > summary + .listerad { border-top: 1px solid var(--strek); }
.liste.kant .vis-alle > summary { padding-left: 18px; padding-right: 18px; }
.eierpost-tekst { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 8px; }
.eierpost-topp { display: flex; align-items: baseline; gap: 10px; }
.eierpost-topp .stort { font: 500 .9375rem/1.2 var(--serif); font-variant-numeric: tabular-nums; white-space: nowrap; }
.eierskapkort .liste.kant { margin-top: 16px; }
.personvernkort { padding-top: 2px; padding-bottom: 2px; }
.personvernkort .symbol { width: 30px; height: 30px; border-radius: 8px; background: var(--flate2); color: var(--blekk2); }
.personvernkort .symbol .ikon { width: 15px; height: 15px; }

/* Konsernet som et tre */
.konserntre { list-style: none; margin: 16px 0 0; padding: 0; }
.konserntre li { position: relative; padding-left: calc(var(--nivaa) * 18px); }
.konserntre li.under::before { content: ""; position: absolute; left: calc(var(--nivaa) * 18px - 11px); top: -7px; height: 36px; width: 9px;
  border-left: 1px solid var(--strek2); border-bottom: 1px solid var(--strek2); border-bottom-left-radius: 4px; }
.node { display: flex; align-items: flex-start; gap: 10px; padding: 11px 13px; margin: 7px 0; border: 1px solid var(--strek); border-radius: 12px; color: var(--blekk); }
a.node:hover { text-decoration: none; border-color: color-mix(in srgb, var(--del-konsern) 45%, var(--strek)); }
.node.selv { background: var(--aksent-myk); border-color: transparent; }
.node.selv .node-navn { color: var(--aksent-blekk); font-weight: 600; }
.node-tekst { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.node-navn { font-size: .875rem; }
.node-meta { font-size: .71875rem; color: var(--blekk3); }
.node-andel { font-size: .78125rem; color: var(--blekk3); white-space: nowrap; }
.node.selv .node-andel { color: var(--aksent-blekk); }

/* Konsernet og tidslinjen står i lesebredde midt på, som i appen */
.del-konsern > *, .del-hendelser > * { width: 100%; max-width: 760px; margin-left: auto; margin-right: auto; }

/* Tidslinjen år for år */
.tidslinje { padding: 0; }
.tidslinjeaar { padding: 16px 16px 0; }
.tidslinjeaar:not(:has(.hendelser)) { padding-bottom: 16px; }
.tidslinjeaar + .tidslinjeaar { border-top: 1px solid var(--strek); }
.aar-topp { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.aar-topp h3 { font: 500 1.375rem/1.2 var(--serif); font-variant-numeric: tabular-nums; }
.aar-topp span { font-size: .71875rem; color: var(--blekk3); }
.aar-tall { display: flex; flex-direction: column; gap: 6px; margin-top: 10px; }
.aar-tall div { display: grid; grid-template-columns: minmax(0, 1fr) auto 64px; gap: 8px; align-items: baseline; }
.aar-tall span { font-size: .8125rem; color: var(--blekk2); }
.aar-tall b { font-size: .84375rem; font-weight: 500; text-align: right; font-variant-numeric: tabular-nums; }
.aar-tall em { font-style: normal; font-size: .75rem; text-align: right; font-variant-numeric: tabular-nums; }
.aar-tall p { margin: 0; font-size: .78125rem; }
.tidslinjeaar .hendelser { margin-top: 16px; }

/* ---------------------------------------------------------------- appsiden: toppen og skjermbildene */

.helt { display: grid; grid-template-columns: 1fr; gap: 40px; align-items: center; padding: 32px 0 56px; }
.helt .ikon { width: 88px; height: 88px; border-radius: 20px; box-shadow: var(--skygge); }
.helt h1 { font: 500 clamp(44px, 8vw, 64px)/1.05 var(--serif); margin: 24px 0 12px; letter-spacing: -.01em; }
.helt .undertittel { font-size: clamp(19px, 2.4vw, 22px); color: var(--blekk2); margin: 0 0 20px; }
.helt p { color: var(--blekk2); margin: 0 0 28px; max-width: 34em; }
@media (min-width: 900px) {
  .helt { gap: 56px; padding: 64px 0 88px; text-align: center; }
  .helt .ikon { margin: 0 auto; }
  .helt p, .helt .undertittel { margin-left: auto; margin-right: auto; text-wrap: balance; }
}
.skjermer { display: flex; gap: 18px; justify-content: center; align-items: flex-start; }
.skjermer figure { flex: 0 1 250px; min-width: 0; margin: 0; }
.skjermer img { width: 100%; height: auto; border-radius: 30px; border: 6px solid #0B0D12; background: #0B0D12; box-shadow: var(--skygge); }
.skjermer figcaption { margin-top: 14px; text-align: center; font-size: 14px; font-weight: 500; color: var(--blekk2); }
@media (min-width: 900px) {
  .skjermer { gap: 40px; }
  .skjermer figure { flex-basis: 310px; }
  .skjermer img { border-radius: 40px; border-width: 8px; }
}
@media (max-width: 699px) {
  .skjermer { overflow-x: auto; scroll-snap-type: x mandatory; justify-content: flex-start; padding: 8px 16px 20px; margin: 0 -16px; scrollbar-width: none; }
  .skjermer::-webkit-scrollbar { display: none; }
  .skjermer figure { flex: 0 0 64%; scroll-snap-align: center; }
}
.fordeler { display: grid; grid-template-columns: 1fr; gap: 16px; padding-bottom: 64px; }
@media (min-width: 700px) { .fordeler { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1000px) { .fordeler { grid-template-columns: repeat(4, 1fr); } }
.fordeler .symbol { width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; margin-bottom: 14px;
  background: var(--aksent-myk); color: var(--aksent-blekk); }
.fordeler .symbol svg { width: 20px; height: 20px; }
.fordeler h3 { margin: 0 0 6px; font-size: 17px; }
.fordeler p { margin: 0; color: var(--blekk2); font-size: 15px; }
/* ---------------------------------------------------------------- tekstsidene (personvern, support, kilder) */

.tekst { padding: 24px 0 64px; }
.tekst h1 { font: 500 clamp(36px, 6vw, 48px)/1.1 var(--serif); margin: 16px 0 8px; }
.tekst .dato { color: var(--blekk3); font-size: 15px; margin: 0 0 28px; }
.tekst section { background: var(--flate); border: 1px solid var(--linje); border-radius: 18px; padding: 20px 22px; margin-bottom: 14px; }
.tekst h2 { font-size: 18px; margin: 0 0 8px; }
.tekst section p { margin: 0 0 10px; color: var(--blekk2); }
.tekst section p:last-child { margin-bottom: 0; }
.tekst .liten { font-size: 14px; color: var(--blekk3); }
.tekst .fremhevet { background: var(--aksent-myk); border-color: transparent; }
.tekst .fremhevet h2 { color: var(--aksent-blekk); }
.tekst section ul { margin: 0 0 10px; padding-left: 20px; color: var(--blekk2); }
.tekst section li { margin: 0 0 6px; }
.tekst .merknad { font-size: 14px; color: var(--blekk3); margin: 18px 4px 0; }

/* ---------------------------------------------------------------- topplistene (/topplister/…), som TopplisteView */

.toppliste { padding: 8px 0 48px; }
.sti { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; font-size: .84375rem; color: var(--blekk3); margin: 6px 4px 14px; }
.sti a { color: var(--blekk2); }
.sti .skille { color: var(--blekk3); }
.toppliste h1 { font: 500 clamp(1.75rem, 6vw, 2.25rem)/1.12 var(--serif); letter-spacing: -.005em; margin: 10px 4px 16px; text-wrap: balance; }
.toppvalg { display: flex; flex-direction: column; align-items: flex-start; gap: 14px; margin-bottom: 14px; }
.omfang { display: inline-flex; align-items: center; gap: 8px; max-width: 100%; padding: 9px 14px; border-radius: 999px;
  background: var(--aksent-myk); color: var(--aksent-blekk); font-size: .9375rem; font-weight: 500; }
.omfang:hover { text-decoration: none; filter: brightness(.97); }
.omfang span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.omfang .ikon { width: 14px; height: 14px; flex: none; }
.omfang .ned { width: 12px; height: 12px; transform: rotate(90deg); }
.segment.lenker { width: 100%; }
.segment.lenker a { flex: 1; min-width: 0; text-align: center; font: 500 .8125rem/1.2 var(--sans); color: var(--blekk3); border-radius: 9px; padding: 7px 6px; }
.segment.lenker a:hover { color: var(--blekk2); text-decoration: none; }
.segment.lenker a[aria-current] { color: var(--blekk); background: var(--seg-paa); box-shadow: 0 0 0 1px var(--seg-ring), 0 1px 3px var(--seg-skygge); }
.toppliste .fotnote { margin-top: 14px; }
.steder { margin-top: 26px; display: flex; flex-direction: column; gap: 10px; }
.steder .seksjonsetikett { margin-top: 14px; }
.stedliste { padding: 6px; display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 2px; }
.stedliste .sted { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; padding: 9px 12px; border-radius: 12px; color: var(--blekk); font-size: .90625rem; }
.stedliste .sted:hover { text-decoration: none; background: var(--flate2); }
.stedliste .sted small { color: var(--blekk3); font-size: .75rem; font-variant-numeric: tabular-nums; }

/* Rader med plass, navn og sted og to tall (Rad i topplisten, RankingRow i bransjen) */
.rangrad .nr { font: .6875rem/1 var(--mono); color: var(--blekk3); width: 18px; flex: none; }
.rangrad .rad-hoyre .stort { font: 500 1rem/1.25 var(--serif); }
.rangrad .rad-hoyre small.neg, .underbransje .rad-hoyre small.neg { color: var(--negativ); }
.rangrad .rad-hoyre small.pos, .underbransje .rad-hoyre small.pos { color: var(--positiv); }
.rad-hoyre .stort.neg { color: var(--negativ); }
.rad-hoyre .stort.pos { color: var(--positiv); }
.listekort .liste.kant { margin-top: 14px; }

/* ---------------------------------------------------------------- bransjesidene (/bransjer; /bransjer/<id> som stedene under) */

.bransjeside, .bransjeoversikt { padding: 8px 0 48px; }
.sidetopp h1 { font: 500 clamp(2rem, 7vw, 2.75rem)/1.05 var(--serif); letter-spacing: -.01em; margin: 14px 4px 18px; }
.bransjeoversikt .fotnote { margin-top: 14px; }
.bransjeside .fotnote { margin-top: 12px; }
.tynnstolpe { display: block; height: 4px; border-radius: 2px; background: var(--flate2); margin-top: 6px; overflow: hidden; }
.tynnstolpe i { display: block; height: 100%; border-radius: 2px; background: color-mix(in srgb, var(--p-a) 80%, transparent); }
.underbransje .rad-hoyre { width: 64px; }
.underbransjer .liste.kant { margin-top: 14px; }

/* Typisk stiftelsesår på en tidslinje (Aarsprikk) */
.aarsprikk { display: flex; flex-direction: column; gap: 3px; width: 100%; }
.aarsprikk-spor { position: relative; height: 6px; border-radius: 3px; background: var(--flate2); margin: 3px 0; }
.aarsprikk-spor i { position: absolute; top: 50%; width: 12px; height: 12px; border-radius: 50%; background: var(--p-a); border: 2px solid var(--flate); transform: translate(-50%, -50%); box-sizing: border-box; }
.aarsprikk-akse { display: flex; justify-content: space-between; font-size: .59375rem; color: var(--blekk3); }

/* Nyetableringer per år */
.nystolper { display: flex; align-items: flex-end; gap: 8px; margin-top: 18px; }
.nystolpe { flex: 1; min-width: 0; display: flex; flex-direction: column; align-items: center; gap: 4px; }
.nystolpe span, .nystolpe em { font-size: .65625rem; color: var(--blekk3); font-style: normal; font-variant-numeric: tabular-nums; white-space: nowrap; }
.nystolpe i { display: block; width: 100%; border-radius: 4px; background: var(--p-a); }
.nystolpe.hittil i { background: color-mix(in srgb, var(--p-a) 45%, transparent); }

/* Fylkene på kartet og som liste (FylkeKartView) */
.fylker { display: grid; grid-template-columns: minmax(0, 1fr) 160px; gap: 14px; margin-top: 16px; align-items: start; }
.fylkekart { display: block; width: 100%; height: auto; max-height: 300px; }
.fylkekart path { fill: var(--p-a); stroke: var(--flate); stroke-width: 1.2; stroke-linejoin: round; }
.fylkeliste { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
.fylkeliste li { display: flex; align-items: center; gap: 7px; font-size: .71875rem; color: var(--blekk2); }
.fylkeliste i { width: 9px; height: 9px; border-radius: 2px; background: var(--p-a); flex: none; }
.fylkeliste span { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fylkeliste b { font-weight: 400; color: var(--blekk); font-variant-numeric: tabular-nums; }
.kartkilde { font-size: .65625rem; color: var(--blekk3); margin: 12px 0 0; }
@media (max-width: 420px) { .fylker { grid-template-columns: minmax(0, 1fr) 140px; } }

.kortlenke + .kortlenke { margin-top: 0; border-top: 1px solid var(--strek); }

/* ---------------------------------------------------------------- bransjesidene: hele landet og stedene */
/* /bransjer/<id> og /bransjer/<id>/<sted>, utkast 2, godkjent 10.10.2026 (lib/bransjefelles.js, lib/bransjeside.js,
   lib/bransjested.js): toppen, selskapene og tallene nederst i hovedbransjens farge. Fargen (--a-farge) og paret til
   merket og det valgte stedet (--a-bg, --a-fg) kommer fra paletten (lib/steder.js, AKSENT). */
.aksent-blaa { --a-farge: var(--p-a); --a-bg: var(--t0-bg); --a-fg: var(--t0-fg); }
.aksent-lilla { --a-farge: var(--p-b); --a-bg: var(--t1-bg); --a-fg: var(--t1-fg); }
.aksent-rav { --a-farge: var(--p-varm); --a-bg: var(--t2-bg); --a-fg: var(--t2-fg); }
.aksent-jord { --a-farge: var(--p-jord); --a-bg: var(--t4-bg); --a-fg: var(--t4-fg); }
.aksent-gronn { --a-farge: var(--p-gronn); --a-bg: var(--t5-bg); --a-fg: var(--t5-fg); }
.aksent-blagronn { --a-farge: var(--del-konsern); --a-bg: var(--t6-bg); --a-fg: var(--t6-fg); }
.aksent-skifer { --a-farge: var(--del-steder); --a-bg: var(--t7-bg); --a-fg: var(--t7-fg); }

.bs-topp { margin: 6px 4px 18px; }
.bs-sti { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; margin: 0; font-size: .8125rem; color: var(--blekk2); }
.bs-sti a { color: var(--blekk2); }
.bs-sti a:hover { color: var(--blekk); }
.bs-merke { display: grid; place-items: center; width: 26px; height: 26px; border-radius: 8px; background: var(--a-bg); color: var(--a-fg); }
.bs-merke .ikon { width: 15px; height: 15px; }
.bs-topp h1 { font: 500 clamp(1.875rem, 6.5vw, 2.4rem)/1.1 var(--serif); letter-spacing: -.01em; margin: 12px 0 8px; overflow-wrap: anywhere; }
/* tre nøkkeltall på rad (lib/bransjefelles.js, som i appen): tallet stort over hva det er, med en tynn strek mellom */
.bs-nokkeltall { display: flex; margin: 16px 0 0; }
.bs-nokkeltall > div { display: flex; flex-direction: column-reverse; justify-content: flex-end; flex: 0 1 auto; min-width: 0;
  padding: 0 24px; border-left: 1px solid var(--strek2); }
.bs-nokkeltall > div:first-child { padding-left: 0; border-left: 0; }
.bs-nokkeltall dd { margin: 0; font: 500 1.5rem/1.15 var(--serif); color: var(--blekk); font-variant-numeric: tabular-nums; white-space: nowrap; }
.bs-nokkeltall dd small { font: 400 .8125rem var(--sans); color: var(--blekk2); }
.bs-nokkeltall dt { margin-top: 3px; font-size: .75rem; color: var(--blekk3); }
/* filterknappene (lib/bransjefelles.js): underbransjen og stedet, hver med en meny over listen under seg; på mobil går
   menyen over hele bredden under knappene */
.bs-velgere { position: relative; display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.bs-velger { position: relative; min-width: 0; max-width: 100%; }
.bs-velger > summary { list-style: none; display: inline-flex; align-items: center; gap: 7px; max-width: 100%; padding: 8px 13px 8px 11px; border-radius: 999px;
  background: var(--a-bg); color: var(--a-fg); font-size: .875rem; font-weight: 600; cursor: pointer; user-select: none; -webkit-user-select: none; }
.bs-velger > summary > span:not(.skjult-tekst) { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bs-velger > summary::-webkit-details-marker { display: none; }
.bs-velger > summary:focus-visible { outline: 2px solid var(--a-farge); outline-offset: 2px; }
.bs-velger > summary .ikon { width: 15px; height: 15px; flex: none; }
.bs-velger > summary .chevron { width: 12px; height: 12px; margin-left: 1px; color: currentColor; opacity: .75; transform: rotate(90deg); transition: transform .15s ease; }
.bs-velger[open] > summary .chevron { transform: rotate(-90deg); }
.bs-meny { position: absolute; z-index: 30; left: 0; top: calc(100% + 8px); width: 320px; max-height: min(62vh, 460px); overflow-y: auto;
  overscroll-behavior: contain; padding: 6px; border-radius: 16px; background: var(--flate); border: 1px solid var(--linje); box-shadow: var(--skygge); }
.bs-valg { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 8px 12px; border-radius: 10px; color: var(--blekk); font-size: .9375rem; }
.bs-valg:hover { text-decoration: none; background: var(--flate2); }
.bs-valg.valgt { background: var(--a-bg); color: var(--a-fg); font-weight: 600; }
.bs-antall { color: var(--blekk3); font-size: .8125rem; font-variant-numeric: tabular-nums; }
.bs-valg.valgt .bs-antall { color: inherit; }
.bs-gruppenavn { margin: 12px 12px 4px; font-size: .6875rem; letter-spacing: .06em; text-transform: uppercase; color: var(--blekk3); }
.bs-steder { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.bs-chip { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: 999px; background: var(--flate); border: 1px solid var(--linje);
  color: var(--blekk); font-size: .8125rem; white-space: nowrap; }
.bs-chip span { color: var(--blekk3); font-variant-numeric: tabular-nums; }
.bs-chip:hover { text-decoration: none; border-color: var(--strek2); }
.bs-chip.valgt { background: var(--a-bg); border-color: transparent; color: var(--a-fg); font-weight: 600; }
.bs-chip.valgt span { color: inherit; }

.bs-listehode { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px 16px; }
.bs-sok { display: flex; align-items: center; gap: 8px; padding: 8px 12px; border-radius: 12px; background: var(--seg-spor); color: var(--blekk3); width: 260px; flex: none; }
.bs-sok:focus-within { box-shadow: 0 0 0 2px var(--aksent); }
.bs-sok .ikon { width: 16px; height: 16px; flex: none; }
.bs-sok input { border: 0; background: none; font: inherit; font-size: .875rem; color: var(--blekk); outline: none; width: 100%; min-width: 0; }
.bs-sok input::placeholder { color: var(--blekk3); }
.bs-rekkefolge { max-width: 420px; margin-top: 14px; }
.bs-rekkefolge button { flex: 1 0 auto; padding-left: 8px; padding-right: 8px; }
.bs-kolonner, .bs-rad { display: grid; grid-template-columns: 26px minmax(0, 1fr) 92px 96px 84px 64px 60px 14px; align-items: center; gap: 12px; }
.bs-kolonner { padding: 10px 18px 8px; margin: 14px -18px 0; font-size: .6875rem; letter-spacing: .06em; text-transform: uppercase; color: var(--blekk3);
  border-bottom: 1px solid var(--strek); }
.bs-kolonner span:nth-child(n+4) { text-align: right; }
.bs-rader { margin: 0 -18px; }
.bs-rad { padding: 11px 18px; color: var(--blekk); }
.bs-rad + .bs-rad { border-top: 1px solid var(--strek); }
.bs-rad[hidden], .bs-vis-alle[hidden], .bs-ingen[hidden] { display: none; }
.bs-rad:hover { text-decoration: none; background: var(--flate2); }
.bs-rad:hover .bs-navn b { color: var(--aksent-blekk); }
.bs-nr { font: .75rem var(--mono); color: var(--blekk3); }
.bs-navn { display: flex; flex-direction: column; min-width: 0; }
.bs-navn b { font-weight: 600; font-size: .9375rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bs-navn small { color: var(--blekk3); font-size: .75rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bs-graf { display: flex; align-items: flex-end; }
.bs-soyler { display: flex; align-items: flex-end; gap: 3px; width: 100%; height: 26px; }
.bs-soyler i { flex: 1; border-radius: 3px 3px 0 0; background: color-mix(in srgb, var(--a-farge) 40%, transparent); }
.bs-soyler i:last-child { background: var(--a-farge); }
.bs-soyler i:not([style]) { height: 2px; border-radius: 1px; background: var(--strek2); }
.bs-oms { text-align: right; white-space: nowrap; }
.bs-oms b { font: 500 1.0625rem var(--serif); font-variant-numeric: tabular-nums; }
.bs-oms small { color: var(--blekk3); font-size: .75rem; }
.bs-tallene { display: contents; }
.bs-tall { text-align: right; font-variant-numeric: tabular-nums; font-size: .875rem; color: var(--blekk2); white-space: nowrap; }
.bs-tall.pos { color: var(--positiv); }
.bs-tall.neg { color: var(--negativ); }
.bs-skille { display: none; }
.bs-etikett, .bs-oms .bs-enhet { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
/* pilen som de andre listene (ikon «pil»), tegnet her i stedet for i hver av de opptil 200 radene */
.bs-rad::after { content: ""; width: 12px; height: 12px; background: var(--blekk3);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9 6 6 6-6 6'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9 6 6 6-6 6'/%3E%3C/svg%3E") center / contain no-repeat; }
.bs-flere > summary, .bs-vis-alle { display: flex; justify-content: center; align-items: center; gap: 6px; width: 100%; padding: 14px 0 2px; margin: 0;
  border: 0; border-top: 1px solid var(--strek); background: none; font: 500 .9375rem var(--sans); color: var(--aksent-blekk); cursor: pointer; }
.bs-flere > summary .chevron, .bs-vis-alle .chevron { width: 12px; height: 12px; transform: none; }
.bs-flere > .bs-rader { border-top: 1px solid var(--strek); }
.bs-ingen { margin: 16px 0 4px; font-size: .875rem; color: var(--blekk3); text-align: center; }

.bs-statistikk { margin-top: 34px; --p-a: var(--a-farge); --p-b: var(--a-farge); --p-varm: var(--a-farge); --p-jord: var(--a-farge);
  --margin-fyll: color-mix(in srgb, var(--a-farge) 16%, transparent); }
.bs-statistikk .soyler.hoved .soyle { background: color-mix(in srgb, var(--a-farge) 32%, transparent); }
.bs-statistikk .soyler.hoved .uthevet .soyle { background: var(--a-farge); }
.bs-statistikk .soyler.hoved .plass.negativ .soyle { background: var(--p-rod); opacity: .3; }
.bs-statistikk .soyler.hoved .plass.negativ.uthevet .soyle { opacity: 1; }
.bs-seksjon { font: 500 1.5rem/1.2 var(--serif); margin: 0 4px 14px; }
.bs-fliser { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-bottom: 14px; }
.bs-grafer { margin-bottom: 12px; }

.stederkort .bs-gruppe { font-size: .75rem; font-weight: 500; color: var(--blekk3); margin: 16px 0 0; }
.stederkort .bs-steder { margin-top: 8px; }

@media (max-width: 899px) {
  .bs-kolonner, .bs-rad { grid-template-columns: 26px minmax(0, 1fr) 96px 84px 64px 60px 14px; }
  .bs-kolonner .bs-graf, .bs-rad .bs-graf { display: none; }
}
@media (max-width: 760px) {
  .bs-velger { position: static; }
  .bs-velger > summary { gap: 6px; padding: 7px 11px 7px 10px; font-size: .8125rem; }   /* de to knappene på én linje */
  .bs-velger > summary .ikon { width: 14px; height: 14px; }
  .bs-meny { width: auto; right: 0; }
  .bs-nokkeltall > div { flex: 1 1 0; padding: 0 12px; }
  .bs-nokkeltall dd { font-size: clamp(1.1875rem, 5.6vw, 1.5rem); }
  .bs-listehode { flex-direction: column; align-items: stretch; }
  .bs-sok { width: auto; }
  .bs-rekkefolge { max-width: none; margin-top: 12px; }
  .bs-kolonner { display: none; }
  .bs-rader { margin-top: 10px; }
  .bs-rad { grid-template-columns: minmax(0, 1fr) auto 14px; grid-template-areas: "navn oms pil" "tall tall pil"; row-gap: 4px; padding: 12px 18px; }
  .bs-rad > .bs-nr { display: none; }
  .bs-rad > .bs-navn { grid-area: navn; }
  .bs-rad > .bs-oms { grid-area: oms; }
  .bs-rad::after { grid-area: pil; }
  .bs-oms .bs-enhet { position: static; width: auto; height: auto; margin: 0; overflow: visible; clip: auto; }
  .bs-tallene { grid-area: tall; display: flex; flex-wrap: wrap; gap: 0 6px; font-size: .8125rem; }
  .bs-tall { font-size: .8125rem; color: var(--blekk3); }
  .bs-tall.tom { display: none; }
  .bs-tall:not(.tom) ~ .bs-tall > .bs-skille { display: inline; margin-right: 6px; color: var(--blekk3); }
  .bs-etikett { position: static; width: auto; height: auto; margin: 0; overflow: visible; clip: auto; }
  .bs-fliser { grid-template-columns: 1fr 1fr; }
  .bs-seksjon { font-size: 1.375rem; }
}