/* =========================================================================
   feed.css — fællesskabet (Hevy-runden, Task 2.2): Buddy-knappen øverst til højre, Feed-fanen, kortene, hele passet,
   kommentarer, notifikationer, søgning, profilen (folk.js), Profil → Fællesskab og ejerens anmeldelser (moderation.js).

   Buddys regler: hvide flader UDEN kanter på isblå bund, bløde skygger (--skygge) som resten af appen, kobolt er handling,
   marine er tekst. Solgul kun til rekorder. Rækker skilles af luft og tone, aldrig af streger. color-scheme sættes aldrig
   på :root. Indlæses efter app.css (alle filer i assets/css linkes).
   ========================================================================= */

/* ---------------------------------------------------------------- Buddy-knappen
   Buddy-chatten åbnes fra figuren øverst til højre på alle sider (ejerens valg 12-11-2026: Feed tog Buddy-fanens plads).
   Den er fast i hjørnet, så den altid kan nås (som fanen var), og den bærer prikken for ulæste beskeder (data-fane="buddy").
   Hjørnet er Buddys: sidernes øverste række (.side-top) og træningens bjælke (.hl-top-linje) holder plads til den, så den
   aldrig ligger oven på "Færdig", "Vej dig", "Log ud" og de andre knapper øverst til højre. Ark (50), træningsmodus (45),
   køkkenet (55) og beskederne øverst (60) ligger over den; træningens bjælke (30) under. På Buddy-chatten selv er den væk. */
.buddy-knap {
    position: fixed; z-index: 31; top: calc(14px + env(safe-area-inset-top)); right: 14px;
    width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center;
    background: var(--hvid); box-shadow: var(--skygge); text-decoration: none; transition: transform .15s;
}
.buddy-knap .buddy-fig { width: 36px; height: 36px; display: block; }
.buddy-knap:active { transform: scale(.94); }
.buddy-knap .prik { position: absolute; top: 0; right: 0; width: 12px; height: 12px; border-radius: 50%; background: var(--roed); box-shadow: 0 0 0 2.5px var(--hvid); }
.skal[data-side="buddy"] > .buddy-knap { display: none; }
/* Kun inde i skallen (logget ind): forsiden og opstarten har ingen Buddy-knap og skal ikke miste plads. */
.skal .side-top, .skal .hl-top-linje { padding-right: 52px; }
/* Telefon: Mads knapper står på deres egen række under titlen (madplus.css); den række må gerne bruge hele bredden.
   På pc står de ved siden af "Mad" og holder plads til knappen som alt andet (er der for lidt plads, går de ned under titlen). */
@media (max-width: 919px) { .skal .side-top.mad-top .knapper { width: calc(100% + 52px); margin-right: -52px; } }
/* Knapperne i toppen brækker ikke over på to linjer ("Vej dig"). På en smal telefon er Fremgangs "Del" kun tegnet; ordet står
   stadig for skærmlæsere. */
.skal .side-top .knapper .knap { white-space: nowrap; }
@media (max-width: 419px) {
    .skal .side-top .fg-del-knap { padding: 0 11px; }
    .skal .side-top .fg-del-knap > span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
}

@media (min-width: 920px) {
    .buddy-knap { top: 30px; right: 24px; width: 48px; height: 48px; }
    .buddy-knap .buddy-fig { width: 40px; height: 40px; }
    .skal .side-top, .skal .hl-top-linje { padding-right: 60px; }
}
@media (hover: hover) { .buddy-knap:hover { transform: translateY(-1px); box-shadow: 0 2px 4px rgba(21, 70, 214, .08), 0 12px 28px rgba(21, 70, 214, .12); } }
/* Fra 1200 px står Buddy-panelet i højre side: knappen rykker ind til indholdets hjørne, så den aldrig rammer panelet.
   Skallen er højst 1720 px og står i midten; resten af vinduet deles ligeligt på begge sider. */
@media (min-width: 1200px) {
    .buddy-knap { right: calc(max(0px, (100vw - 1720px) / 2) + var(--panel-b) + 12px); }
}
/* Træning på pc: bjælken øverst er et hvidt kort (.hl-top-kort, hevylog.css), og knappen står inde i kortets højre ende, i den
   plads .hl-top-linje holder fri, ellers lå den hen over kortets hjørne. Kortets kant følger indholdets bredde: 760 px fra 920 px
   (.indhold.smal, app.css, polstring 40) og 1160 px fra 1200 px (.traening-side.delt, figurer.css, polstring 36); kortet selv har
   20 px polstring. Ændres de bredder, skal tallene her med. */
@media (min-width: 920px) and (max-width: 1199px) {
    .skal[data-side="traening"] > .buddy-knap { top: 46px; right: calc(max(0px, (100vw - var(--skinne-b) - 760px) / 2) + 60px); }
}
@media (min-width: 1200px) {
    .skal[data-side="traening"] > .buddy-knap {
        top: 46px; right: calc(max(0px, (100vw - 1720px) / 2) + max(0px, (min(100vw, 1720px) - var(--skinne-b) - 1160px) / 2) + 56px);
    }
}

/* ---------------------------------------------------------------- Feed-siden */
.feed-top .knapper { align-items: center; }
.feed-opdater svg { width: 17px; height: 17px; }
.feed-opdater[aria-busy="true"] svg { animation: feed-drej .8s linear infinite; }
@keyframes feed-drej { to { transform: rotate(360deg); } }
.feed-klokke { position: relative; }
.feed-antal {
    position: absolute; top: -3px; right: -3px; min-width: 19px; height: 19px; padding: 0 5px; border-radius: 999px;
    background: var(--roed); color: var(--hvid); font: 700 11.5px/19px var(--tekst); font-style: normal; text-align: center;
    box-shadow: 0 0 0 2px var(--himmel);
}
.feed-mod { display: inline-block; margin: -8px 0 10px; font-size: 14px; }
.feed-liste { display: grid; gap: 12px; }
.feed-h1 { font-size: 30px; margin: 2px 0 18px; }

/* ---------------------------------------------------------------- kortet */
.fk { background: var(--hvid); border-radius: var(--r-m); box-shadow: var(--skygge); padding: 14px 16px 10px; min-width: 0; }
.fk-top { display: grid; grid-template-columns: 42px minmax(0, 1fr) auto; gap: 12px; align-items: center; }
.fk-avatar {
    width: 42px; height: 42px; border-radius: 50%; background: var(--blaa); color: var(--hvid);
    display: grid; place-items: center; flex: none; text-decoration: none;
    font: 700 16px/1 var(--display); letter-spacing: -.01em;
}
.fk-avatar.lille { width: 34px; height: 34px; font-size: 13.5px; }
.fk-avatar.stor { width: 72px; height: 72px; font-size: 27px; }
.fk-hvem { display: grid; min-width: 0; line-height: 1.25; }
.fk-navn { font-weight: 650; color: var(--marine); text-decoration: none; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
a.fk-navn:hover { color: var(--blaa); }
.fk-naar { font-size: 13px; color: var(--marine-2); }
.fk-mere { width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; color: var(--marine-3); transition: background .15s, color .15s; }
.fk-mere svg { width: 20px; height: 20px; }
@media (hover: hover) { .fk-mere:hover { background: var(--himmel); color: var(--marine); } }
.fk-aabn { display: block; margin-top: 12px; color: inherit; text-decoration: none; border-radius: var(--r-s); }
.fk-titel { font-size: 19px; line-height: 1.2; overflow-wrap: anywhere; transition: color .15s; }
@media (hover: hover) { .fk-aabn:hover .fk-titel { color: var(--blaa); } }
.fk-tal { margin-top: 4px; font-size: 14px; font-weight: 600; color: var(--marine-2); font-variant-numeric: tabular-nums; }
.fk-note { margin-top: 10px; font-size: 15px; line-height: 1.45; white-space: pre-wrap; overflow-wrap: anywhere; }
.fk-oev { list-style: none; margin: 12px 0 0; padding: 6px 12px; background: var(--himmel); border-radius: var(--r-s); display: grid; }
.fk-oev li { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 12px; align-items: baseline; padding: 6px 0; }
.fk-oev-navn { font-weight: 600; font-size: 14.5px; color: var(--marine); text-decoration: none; overflow-wrap: anywhere; }
a.fk-oev-navn { color: var(--blaa-dyb); }
@media (hover: hover) { a.fk-oev-navn:hover { text-decoration: underline; text-underline-offset: 3px; } }
.fk-oev-tal { font-size: 13.5px; color: var(--marine-2); white-space: nowrap; font-variant-numeric: tabular-nums; }
.fk-oev-rekord { grid-column: 1 / -1; display: flex; align-items: baseline; gap: 8px; font-size: 13.5px; font-weight: 600; color: var(--marine); }
.fk-oev-rekord i { width: 9px; height: 9px; border-radius: 50%; background: var(--sol); flex: none; transform: translateY(-1px); }
.fk-flere { display: inline-block; margin: 8px 0 0 12px; font-size: 14px; font-weight: 650; color: var(--blaa); text-decoration: none; }
.fk-fod { display: flex; flex-wrap: wrap; gap: 6px; margin: 10px -6px 0; }
.fk-knap {
    display: inline-flex; align-items: center; gap: 7px; min-height: 40px; padding: 0 12px; border-radius: 999px;
    color: var(--marine-2); font-weight: 650; font-size: 14.5px; text-decoration: none; transition: background .15s, color .15s;
}
.fk-knap svg { width: 20px; height: 20px; flex: none; }
.fk-knap b { font-family: var(--display); font-weight: 700; color: var(--marine); font-variant-numeric: tabular-nums; }
@media (hover: hover) { button.fk-knap:hover, a.fk-knap:hover { background: var(--himmel); color: var(--marine); } }
.fk-staerkt.til { background: var(--dis); color: var(--blaa-dyb); }
.fk-staerkt.til b { color: var(--blaa-dyb); }
.fk-staerkt.til svg { fill: currentColor; animation: fk-pop .32s cubic-bezier(.2, .8, .2, 1.4); }
@keyframes fk-pop { 40% { transform: scale(1.3); } }
.fk-staerkt-egen { color: var(--blaa-dyb); }
.fk-staerkt-egen svg { fill: currentColor; }

/* ---------------------------------------------------------------- tomt feed og personrækker */
.feed-tom { padding: 18px 18px 14px; }
.feed-tom-top { display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 14px; align-items: center; margin-bottom: 8px; }
.feed-tom-top .buddy-fig { width: 64px; height: 64px; }
.feed-tom-top h2 { font-size: 21px; }
.feed-tom-top p { margin-top: 4px; font-size: 14.5px; line-height: 1.4; }
.feed-tom-ingen { margin: 8px 0 4px; }
.feed-tom-soeg { display: inline-flex; align-items: center; gap: 6px; margin-top: 8px; }
.feed-tom-soeg svg { width: 18px; height: 18px; }
.fp-liste { display: grid; }
.flade.fp-liste { padding: 6px 16px; }
.fp-raekke { display: grid; grid-template-columns: 42px minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 9px 0; }
.fp-navn { display: grid; min-width: 0; line-height: 1.25; color: var(--marine); text-decoration: none; }
.fp-navn b { font-weight: 650; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fp-navn small { font-size: 13px; color: var(--marine-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@media (hover: hover) { a.fp-navn:hover b { color: var(--blaa); } }

/* ---------------------------------------------------------------- hele passet og kommentarer */
.fk-fuld { padding: 18px 18px 12px; }
.fk-fuld > .fk-titel { font-size: 26px; margin-top: 14px; }
.fk-tal-kort { margin-top: 14px; gap: 6px; }
/* Tre fliser inde i kortet er smallere end i afslut-arket: "12.345 kg" skal stadig stå på én linje på en telefon. Tre klasser i
   vælgeren, så den vinder over hevylog.css' ".af-tal-kort .tal" (samme vægt, men hevylog.css indlæses efter feed.css). */
.fk-tal-kort .af-tal-kort { padding: 10px 10px 8px; min-width: 0; }
.af-tal.fk-tal-kort.to { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.fk-tal-kort .af-tal-kort .tal { font-size: 17px; white-space: nowrap; }
.fk-rekorder { display: flex; align-items: center; gap: 8px; margin-top: 12px; font-weight: 650; }
.fk-rekorder i { width: 10px; height: 10px; border-radius: 50%; background: var(--sol); }
.fk-muskler { margin-top: 16px; }
.fk-oev.fuld { margin-top: 16px; }
.fk-kommentarer { margin-top: 26px; }
.fk-kom-liste { padding: 6px 16px; }
.fk-kom { display: grid; grid-template-columns: 34px minmax(0, 1fr); gap: 10px; padding: 12px 0; }
.fk-kom-top { display: flex; align-items: baseline; gap: 8px; min-width: 0; }
.fk-kom-top .fk-naar { font-size: 12.5px; white-space: nowrap; }
.fk-kom-tekst { margin-top: 2px; font-size: 15px; line-height: 1.45; white-space: pre-wrap; overflow-wrap: anywhere; }
.fk-kom-tekst .naevn { font-weight: 650; color: var(--blaa-dyb); text-decoration: none; }
.fk-kom-knapper { display: flex; flex-wrap: wrap; gap: 2px 14px; margin-top: 2px; }
.fk-kom-knapper button { font-size: 13px; font-weight: 650; color: var(--marine-3); padding: 4px 0; }
@media (hover: hover) { .fk-kom-knapper button:hover { color: var(--blaa); } }
.fk-kom-knapper button.sikker { color: var(--roed); }
.fk-kom-tom { padding: 12px 0; }
.fk-skriv { display: grid; grid-template-columns: minmax(0, 1fr) 48px; gap: 8px; margin-top: 12px; }
.fk-skriv textarea {
    min-height: 48px; max-height: 160px; resize: none; border-radius: 24px; padding: 12px 18px; line-height: 1.4;
    background: var(--hvid); border: 2px solid transparent; outline: none; box-shadow: var(--skygge);
}
.fk-skriv textarea:focus { border-color: var(--blaa); }
.fk-skriv button { width: 48px; height: 48px; border-radius: 50%; background: var(--blaa); color: var(--hvid); display: grid; place-items: center; align-self: end; transition: background .15s; }
.fk-skriv button:hover { background: var(--blaa-dyb); }
.fk-skriv button[disabled] { opacity: .5; }
.fk-skriv button svg { width: 20px; height: 20px; }

/* ---------------------------------------------------------------- notifikationer */
.fn-liste { padding: 4px 8px; }
.fn { display: grid; grid-template-columns: 42px minmax(0, 1fr); gap: 12px; align-items: center; padding: 10px 8px; border-radius: var(--r-s); }
.fn + .fn { margin-top: 2px; }
.fn.ny { background: var(--himmel-2, #f6f9ff); }
.fn.ny .fn-tekst > span::after { content: ""; display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--blaa); margin-left: 8px; vertical-align: 2px; }
.fn-tekst { display: grid; gap: 1px; min-width: 0; color: var(--marine); text-decoration: none; line-height: 1.35; overflow-wrap: anywhere; }
.fn-tekst b { font-weight: 650; }
.fn-tekst small { font-size: 13px; color: var(--marine-2); }
@media (hover: hover) { a.fn-tekst:hover b { color: var(--blaa); } }
.fn-svar { grid-column: 2; display: flex; gap: 8px; margin-top: 2px; }
.fn-svaret { color: var(--marine-2); font-weight: 600; }

/* ---------------------------------------------------------------- søg */
.feed-soeg { margin-bottom: 14px; }
.fs-hjaelp { padding: 4px 6px; }

/* ---------------------------------------------------------------- profilen (folk.js) */
.fp-top { display: grid; grid-template-columns: 72px minmax(0, 1fr); gap: 16px; align-items: center; }
.fp-hvem { min-width: 0; }
.fp-hvem h1 { font-size: 28px; overflow-wrap: anywhere; }
.fp-hvem p { margin-top: 4px; font-weight: 600; }
.fp-privat { display: inline-flex; align-items: center; gap: 4px; }
.fp-privat svg { width: 15px; height: 15px; }
.fp-tal { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: 18px; }
.fp-tal > div { background: var(--hvid); border-radius: var(--r-m); box-shadow: var(--skygge); padding: 12px 14px 10px; display: grid; }
.fp-tal .tal { font-size: 24px; line-height: 1.1; }
.fp-tal small { font-size: 13px; font-weight: 600; color: var(--marine-2); }
.fp-knapper { display: flex; align-items: center; gap: 8px; margin-top: 14px; }
.fp-knapper > .knap { flex: 1; }
.fp-knapper .knap svg { width: 17px; height: 17px; }
.fp-mere svg { width: 20px; height: 20px; }
.fp-klubber { margin-top: 14px; }
.fp-blokeret { margin-top: 16px; }
.fp-uger { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 6px; align-items: end; padding: 16px 14px 10px; }
.fp-uge { display: grid; justify-items: center; gap: 6px; }
.fp-soejle-felt { height: 84px; width: 100%; max-width: 26px; display: flex; align-items: flex-end; }
.fp-soejle { display: block; width: 100%; border-radius: 6px; background: var(--dis-2); }
.fp-uge.nu .fp-soejle { background: var(--blaa); }
.fp-soejle.nul { background: var(--dis); }
.fp-uge small { font-size: 11px; color: var(--marine-3); font-variant-numeric: tabular-nums; }
.fp-uge.nu small { color: var(--blaa); font-weight: 700; }
.fp-laast { display: grid; grid-template-columns: 24px minmax(0, 1fr); gap: 10px; align-items: center; margin-top: 18px; color: var(--marine-2); }
.fp-laast svg { width: 22px; height: 22px; color: var(--marine-3); }
.fp-ingen { padding: 16px 18px; }

/* ---------------------------------------------------------------- ark: menuer og anmeld */
.fa-menu { display: grid; gap: 8px; margin-top: 8px; }
.fa-menu .knap.bred { margin-top: 0; }
.fa-forklar { margin-top: 2px; }
.fa-anmeld .chips { margin-top: 14px; }
.knap.sikker { background: var(--roed); color: var(--hvid); }

/* ---------------------------------------------------------------- Profil → Fællesskab */
.fs-felt { margin-top: 0; }
.fs-bn { position: relative; display: block; }
.fs-bn i { position: absolute; left: 16px; top: 50%; transform: translateY(-50%); font-style: normal; font-weight: 650; color: var(--marine-3); pointer-events: none; }
.fs-bn input { padding-left: 34px; }
.fs-gem { margin-top: 12px; }
.fs-laast { margin-top: 10px; }
.fs-links:empty { display: none; }
.fs-links { margin-top: 6px; }
.fs-blok h3 { margin-top: 14px; font-size: 16px; }
.fs-blok .fp-liste { margin-top: 4px; }

/* ---------------------------------------------------------------- anmeldelser (moderation.js) */
.mod-liste { display: grid; gap: 12px; }
.mod-rap { display: grid; gap: 8px; }
.mod-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.mod-type { background: var(--dis); color: var(--blaa-dyb); font-weight: 700; font-size: 13px; padding: 3px 10px; border-radius: 999px; }
.mod-linje { font-size: 14.5px; overflow-wrap: anywhere; }
.mod-linje a { font-weight: 650; text-decoration: none; }
/* Der er ingen token for den lyse røde (app.css har kun --roed). #fde8ea er den samme tone som .knap.fare i app.css og
   advarslerne i klinik.css/login.css, så "Spærret" ser ud som appens andre fare-mærker. */
.mod-maerke { background: #fde8ea; color: var(--roed); font-weight: 700; font-size: 12px; padding: 2px 8px; border-radius: 999px; }
.mod-grund { background: var(--himmel); border-radius: var(--r-s); padding: 8px 12px; font-size: 14.5px; white-space: pre-wrap; overflow-wrap: anywhere; }
.mod-indhold { display: grid; gap: 4px; font-size: 14.5px; overflow-wrap: anywhere; }
.mod-indhold p { white-space: pre-wrap; }
.mod-citat { background: var(--himmel); border-radius: var(--r-s); padding: 8px 12px; font-weight: 600; }
.mod-knapper { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 6px; }

/* ---------------------------------------------------------------- afslut-arket: delingen */
.af-skjult { font-size: 14px; color: var(--marine-2); margin-top: -8px; }
.af-del .vip input:disabled { cursor: not-allowed; }
.af-del .vip input:disabled + i { opacity: .45; }
.af-feedlink { display: inline-flex; align-items: center; gap: 6px; justify-self: start; }

/* ---------------------------------------------------------------- klubber (klub.js, Task 2.3)
   Samme regler som Feed: hvide flader uden kanter, kobolt er handling, marine er tekst. Klubbens rund er en afrundet firkant (personer er
   cirkler). Plads 1 til 3 i toplisten er svagt fremhævet med kobolt; ingen medaljer og ingen farver ud over kobolt. */
.feed-genveje { display: flex; align-items: center; gap: 14px; margin: -6px 0 14px; }
.feed-genveje .feed-mod { margin: 0; }
.feed-klubber { display: inline-flex; align-items: center; gap: 8px; text-decoration: none; }
.feed-klubber svg { width: 18px; height: 18px; flex: none; }
.klub-side .side-top .knapper .knap { display: inline-flex; align-items: center; gap: 6px; }
.klub-side .side-top .knapper .knap svg { width: 17px; height: 17px; }
.klub-liste { display: grid; gap: 10px; }
.klub-liste > .flade + .flade { margin-top: 0; }
.klub-logo { border-radius: 30%; }
.klub-kort { display: grid; grid-template-columns: 46px minmax(0, 1fr) auto; gap: 14px; align-items: center; padding: 14px 16px; color: var(--marine); text-decoration: none; transition: transform .15s, box-shadow .15s; }
.klub-kort .fk-avatar { width: 46px; height: 46px; }
.klub-kort-tekst { display: grid; min-width: 0; line-height: 1.3; }
.klub-kort-tekst b { font-weight: 650; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.klub-kort-tekst small { display: inline-flex; align-items: center; gap: 5px; font-size: 13px; color: var(--marine-2); }
.klub-kort-tekst small svg { width: 13px; height: 13px; flex: none; }
.klub-maerke { background: var(--dis); color: var(--blaa-dyb); font-weight: 700; font-size: 12.5px; padding: 3px 10px; border-radius: 999px; }
@media (hover: hover) { a.klub-kort:hover { transform: translateY(-1px); } a.klub-kort:hover b { color: var(--blaa); } }
.klub-tom { padding: 16px 18px; }
.klub-top h1 { font-size: 28px; }
.klub-under { display: flex; align-items: center; gap: 5px; }
.klub-under svg { width: 15px; height: 15px; flex: none; }
.klub-besk { margin-top: 14px; font-size: 15.5px; line-height: 1.45; white-space: pre-wrap; overflow-wrap: anywhere; }
.klub-valg { margin-top: 14px; padding: 2px 18px; }
.klub-top-liste { padding: 8px; display: grid; gap: 2px; }
.klub-raekke { display: grid; grid-template-columns: 30px 34px minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 8px 10px; border-radius: var(--r-s); }
.klub-raekke.mig { background: var(--himmel); }
.klub-plads { width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; font: 700 14px/1 var(--display); color: var(--marine-3); font-variant-numeric: tabular-nums; }
.klub-raekke.top .klub-plads { background: var(--dis); color: var(--blaa-dyb); }
.klub-navn { display: grid; min-width: 0; line-height: 1.25; color: var(--marine); text-decoration: none; }
.klub-navn b { font-weight: 650; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.klub-navn b i { font-style: normal; font-size: 12px; font-weight: 700; color: var(--blaa-dyb); background: var(--dis); border-radius: 999px; padding: 1px 8px; margin-left: 6px; vertical-align: 1px; }
.klub-navn small { font-size: 13px; color: var(--marine-2); font-variant-numeric: tabular-nums; }
@media (hover: hover) { a.klub-navn:hover b { color: var(--blaa); } }
.klub-kg { text-align: right; font-size: 13px; color: var(--marine-2); white-space: nowrap; font-variant-numeric: tabular-nums; }
.klub-kg b { font-family: var(--display); font-size: 17px; font-weight: 700; color: var(--marine); }
.klub-raekke.top .klub-kg b { color: var(--blaa); }
.klub-fra { margin-top: 8px; padding: 0 4px; }
.klub-privat { display: block; margin-top: 3px; }
.klub-hul { text-align: center; color: var(--marine-3); font-size: 13px; letter-spacing: .15em; line-height: 1; padding: 2px 0; }
.klub-medlemmer { padding: 4px 16px; }
.klub-vis-alle { display: block; margin: 8px 4px 0; }
.klub-anmodninger { padding: 6px 16px; }
.klub-anm { padding: 2px 0 6px; }
.klub-anm .fp-raekke { grid-template-columns: 42px minmax(0, 1fr); padding-bottom: 6px; }
.klub-svar { display: flex; gap: 8px; padding-left: 54px; }
/* "Forlad klubben" og "Anmodet" er stille knapper (ikke fuld bredde som .fp-knapper giver); "Meld ind" er hovedhandlingen og fylder bredden. */
.klub-knapper .knap.lille { flex: none; }
.klub-opret .felt:first-child { margin-top: 0; }
.klub-aaben-tekst { margin-top: 8px; }
.klub-meld .kontakt { padding-top: 4px; }

/* ---------------------------------------------------------------- pc */
@media (min-width: 920px) {
    .feed-liste { gap: 14px; }
    .fk { padding: 18px 20px 12px; }
    .fk-titel { font-size: 20px; }
    .fk-fuld > .fk-titel { font-size: 30px; }
    .fk-tal-kort .af-tal-kort .tal { font-size: 20px; }
    .fk-tal-kort .af-tal-kort { padding: 12px 14px 10px; }
    .fp-tal .tal { font-size: 28px; }
}