/* Onlineforløbet "Mærk efter": deltagerens side, siden til partneren og tilmeldingssiden.
   Bygger oven på style.css (skrift, farver, knapper, følelseskompassets figur og valg). Titler, etiketter og fanerne står
   i Archivo (--display) som på resten af siden. */

.f-app{min-height:100vh;display:flex;flex-direction:column}
.f-app section{padding-block:0}
.f-top{position:sticky;top:0;z-index:20;background:rgba(20,17,15,.94);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.f-top-inner{max-width:46rem;margin:0 auto;padding:.7rem var(--pad);display:flex;align-items:center;gap:.8rem}
.f-brand{display:flex;align-items:center;gap:.6rem;color:var(--text);text-decoration:none;font-family:var(--display);font-size:.74rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;margin-right:auto}
.f-brand img{height:1.9rem;width:auto}
/* Fanerne: i toppen på bred skærm, og som en bjælke i bunden på en telefon, som i en app. */
.f-top{padding-top:env(safe-area-inset-top)}
.f-faner{display:flex;align-items:center;gap:.15rem}
.f-faner a,.f-faner button{display:inline-flex;align-items:center;gap:.4rem;background:none;border:0;color:var(--muted);font:inherit;font-family:var(--display);font-size:.9rem;font-weight:600;padding:.5rem .8rem;border-radius:.5rem;text-decoration:none;cursor:pointer;white-space:nowrap}
.f-faner a:hover,.f-faner button:hover{color:var(--text);background:var(--bg-2)}
.f-faner [aria-current]{color:var(--text);background:var(--bg-3);box-shadow:inset 0 -2px 0 var(--accent)}
.f-faner svg{width:1.25rem;height:1.25rem;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:0 0 auto}
.f-faner .plus{background:var(--accent);color:#150f0b;border-radius:2rem;padding:.5rem 1rem;margin:0 .3rem}
.f-faner .plus:hover,.f-faner .plus[aria-current]{background:var(--accent-soft);color:#150f0b;box-shadow:none}
@media(min-width:46.01rem){
  .f-top-inner{max-width:52rem}
  .f-faner a:not(.plus) svg{display:none}
}
@media(max-width:46rem){
  /* Sløringen i toppen skal væk her: ellers hænger bjælken fast i toppen i stedet for i bunden af skærmen. */
  .f-top{backdrop-filter:none;background:var(--bg)}
  .f-faner{position:fixed;left:0;right:0;bottom:0;z-index:25;display:grid;grid-template-columns:repeat(5,1fr);gap:0;background:rgba(20,17,15,.97);backdrop-filter:blur(8px);border-top:1px solid var(--line);padding:.3rem .3rem calc(.3rem + env(safe-area-inset-bottom))}
  .f-faner a,.f-faner button{flex-direction:column;justify-content:flex-end;gap:.15rem;font-size:.66rem;letter-spacing:.02em;padding:.35rem .1rem;border-radius:.6rem;min-width:0}
  .f-faner svg{width:1.45rem;height:1.45rem}
  .f-faner [aria-current]{background:none;box-shadow:none;color:var(--accent-soft)}
  .f-faner .plus,.f-faner .plus:hover,.f-faner .plus[aria-current]{margin:0;padding:.35rem .1rem;background:none;color:var(--accent-soft)}
  .f-faner .plus svg{background:var(--accent);color:#150f0b;border-radius:50%;padding:.32rem;width:2.2rem;height:2.2rem;margin-top:-.5rem}
  .f-main{padding-bottom:7.5rem}
  .f-toast{bottom:5.8rem}
}
@media print{.f-faner{display:none!important}}
.f-menu{position:fixed;inset:0;z-index:30;background:rgba(10,8,7,.72);display:flex;justify-content:flex-end}
.f-menu nav{width:min(20rem,86vw);background:var(--bg-2);border-left:1px solid var(--line);padding:1.4rem 1.2rem;display:flex;flex-direction:column;gap:.2rem;overflow:auto}
.f-menu a,.f-menu button{display:block;text-align:left;background:none;border:0;color:var(--text);font:inherit;font-family:var(--display);font-weight:600;font-size:1.05rem;padding:.8rem .6rem;border-radius:.5rem;text-decoration:none;cursor:pointer}
.f-menu a:hover,.f-menu button:hover{background:var(--bg-3)}
.f-menu .luk{align-self:flex-end;color:var(--muted);font-size:.9rem}
.f-menu hr{border:0;border-top:1px solid var(--line);margin:.6rem 0;width:100%}

.f-main{flex:1;width:100%;max-width:46rem;margin:0 auto;padding:clamp(1.6rem,5vw,2.6rem) var(--pad) 5rem}
.f-main h1{font-size:clamp(1.9rem,1.3rem + 2.6vw,2.8rem);margin-bottom:.35em}
.f-main h2{font-size:clamp(1.3rem,1.1rem + .9vw,1.7rem);margin:2.2em 0 .6em}
.f-main .eyebrow{margin-bottom:.8rem}
.f-under{color:#ded5cb;font-size:1.12rem;margin:0 0 1.4rem}
.f-tilbage{display:inline-block;color:var(--muted);text-decoration:none;font-size:.92rem;margin-bottom:1.4rem}
.f-tilbage:hover{color:var(--text)}
.f-lille{font-size:.9rem;color:var(--muted)}
.f-fejl{color:#e07a6c;font-size:.95rem;margin:.8rem 0 0}
.f-ok{color:#7cc48a;font-size:.95rem;margin:.8rem 0 0}

.f-kort{background:var(--bg-2);border:1px solid var(--line);border-radius:.9rem;padding:1.25rem 1.35rem;margin:0 0 1rem}
.f-kort h3{margin:0 0 .4rem}
.f-kort p{margin:0 0 .7em}
.f-kort--glod{border-color:rgba(208,112,60,.55);background:linear-gradient(180deg,rgba(208,112,60,.14),rgba(208,112,60,0) 75%),var(--bg-2)}
.f-kort .btn-row{margin-top:1rem}
a.f-kort{display:block;color:inherit;text-decoration:none}
a.f-kort:hover{border-color:var(--accent-soft)}

/* ---------- login ---------- */
.f-gate{min-height:100vh;display:grid;place-items:center;padding:1.5rem;
  background:radial-gradient(60% 40% at 50% 100%,rgba(208,112,60,.16),transparent 72%)}
.f-gate-kort{width:min(25rem,100%);background:var(--bg-2);border:1px solid var(--line);border-radius:1rem;padding:1.9rem}
.f-gate-kort h1{font-size:1.7rem;margin:0 0 .3em}
.f-gate-kort p{color:var(--muted);font-size:.98rem}
.f-felt{display:block;margin:0 0 1rem}
.f-felt span{display:block;font-family:var(--display);font-size:.78rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:.35rem}
.f-in{width:100%;background:var(--bg);border:1.5px solid var(--line);border-radius:.6rem;padding:.75rem .9rem;color:var(--text);font:inherit;font-size:1rem}
.f-in:focus{border-color:var(--accent);outline:none}
textarea.f-in{min-height:6.5rem;resize:vertical;line-height:1.5}
.f-link{background:none;border:0;padding:0;color:var(--accent-soft);font:inherit;font-size:.95rem;text-decoration:underline;cursor:pointer}

/* ---------- skridt og uger ---------- */
.f-skridt{display:flex;align-items:baseline;gap:.6rem;margin:0 0 .5rem}
.f-skridt b{font-family:var(--display);font-size:clamp(2.4rem,1.8rem + 3vw,3.4rem);font-weight:800;letter-spacing:-.03em;line-height:1;color:var(--accent-soft)}
.f-spor{display:grid;grid-template-columns:repeat(6,1fr);gap:.3rem;margin:0 0 1.6rem}
.f-spor div{display:grid;grid-template-columns:repeat(6,1fr);gap:2px}
.f-spor i{height:.5rem;border-radius:1rem;background:var(--bg-3)}
.f-spor i.til{background:var(--accent)}
.f-spor i.halv{background:rgba(208,112,60,.45)}

.f-uger{display:grid;gap:.6rem;margin:0;padding:0;list-style:none}
.f-uge{display:grid;grid-template-columns:auto 1fr auto;gap:.1rem 1rem;align-items:center;background:var(--bg-2);border:1px solid var(--line);border-radius:.8rem;padding:1rem 1.15rem;color:inherit;text-decoration:none}
a.f-uge:hover{border-color:var(--accent-soft)}
.f-uge .nr{grid-row:span 2;width:2.5rem;height:2.5rem;border-radius:50%;display:grid;place-items:center;font-family:var(--display);font-weight:800;background:var(--bg-3);color:var(--muted)}
.f-uge.aaben .nr{background:rgba(208,112,60,.2);color:var(--accent-soft)}
.f-uge.klaret .nr{background:var(--accent);color:#150f0b}
.f-uge .t{font-family:var(--display);font-weight:800;letter-spacing:-.01em}
.f-uge .u{font-size:.9rem;color:var(--muted);grid-column:2}
.f-uge .s{grid-row:span 2;font-size:.82rem;color:var(--muted);text-align:right;white-space:nowrap}
.f-uge.laast{opacity:.62}

.f-dage{display:grid;gap:.5rem;margin:1.2rem 0 0;padding:0;list-style:none}
.f-dag{display:grid;grid-template-columns:auto 1fr;gap:.1rem .95rem;align-items:start;background:var(--bg-2);border:1px solid var(--line);border-radius:.8rem;padding:.95rem 1.1rem;color:inherit;text-decoration:none}
.f-dag:hover{border-color:var(--accent-soft)}
.f-dag .flue{grid-row:span 3;margin-top:.15rem}
.f-dag .k{font-family:var(--display);font-size:.74rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--accent-soft)}
.f-dag .t{font-family:var(--display);font-weight:800;font-size:1.05rem;letter-spacing:-.01em}
.f-dag .r{font-size:.92rem;color:var(--muted)}

/* Fluebenet: tom ring, halv ring (i gang) eller fyldt (klaret). */
.flue{width:1.7rem;height:1.7rem;border-radius:50%;border:2px solid var(--line);display:grid;place-items:center;flex:0 0 auto}
.flue svg{width:.95rem;height:.95rem;opacity:0}
.flue.halv{border-color:var(--accent);background:conic-gradient(var(--accent) 50%,transparent 0)}
.flue.til{border-color:var(--accent);background:var(--accent)}
.flue.til svg{opacity:1}

/* ---------- dagen ---------- */
.f-video{position:relative;aspect-ratio:16/9;background:#0c0a09;border:1px solid var(--line);border-radius:.8rem;overflow:hidden;margin:0 0 1.2rem}
.f-video video{width:100%;height:100%;display:block;background:#000}
.f-video .tom{position:absolute;inset:0;display:grid;place-items:center;text-align:center;padding:1.5rem;color:var(--muted)}
.f-oevelse ol,.f-prose ol{padding-left:1.25rem;margin:0 0 .6em}
.f-oevelse li,.f-prose li{margin-bottom:.4em}
.f-prose p{margin:0 0 .9em}
.f-prose strong{color:#fff}
.f-prose ul{padding-left:1.25rem}
.f-gjort{display:flex;align-items:center;gap:.8rem;width:100%;text-align:left;background:var(--bg);border:1.5px solid var(--line);border-radius:.7rem;padding:.85rem 1rem;color:var(--text);font:inherit;font-weight:700;cursor:pointer;margin-top:.9rem}
.f-gjort:hover{border-color:var(--accent-soft)}
.f-gjort[aria-pressed=true]{border-color:var(--accent);background:rgba(208,112,60,.14)}
.f-sp{margin:0 0 1.2rem}
.f-sp label{display:block;font-weight:700;margin:0 0 .45rem}
.f-sp .gemt{font-size:.8rem;color:var(--muted);min-height:1.2em;margin:.25rem 0 0}
.f-videre{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:2rem}

.f-toast{position:fixed;left:50%;bottom:1.4rem;transform:translate(-50%,2rem);opacity:0;z-index:40;pointer-events:none;
  background:var(--accent);color:#150f0b;font-weight:800;border-radius:2rem;padding:.8rem 1.4rem;max-width:calc(100vw - 2rem);text-align:center;
  box-shadow:0 .6rem 2rem rgba(0,0,0,.5);transition:opacity .25s ease,transform .25s ease}
.f-toast.vis{opacity:1;transform:translate(-50%,0)}

/* ---------- mærker ---------- */
.f-maerker{display:grid;grid-template-columns:repeat(auto-fill,minmax(8.2rem,1fr));gap:.6rem;margin:0;padding:0;list-style:none}
.f-maerke{background:var(--bg-2);border:1px solid var(--line);border-radius:.8rem;padding:.9rem .8rem;text-align:center;font-size:.86rem;color:var(--muted)}
.f-maerke .rund{width:3rem;height:3rem;border-radius:50%;margin:0 auto .55rem;display:grid;place-items:center;border:2px dashed var(--line);font-family:var(--display);font-weight:800;color:var(--muted)}
.f-maerke.har{color:var(--text);border-color:rgba(208,112,60,.5)}
.f-maerke.har .rund{border:0;background:radial-gradient(circle at 50% 80%,var(--accent-soft),var(--accent) 70%);color:#150f0b}
.f-maerke b{display:block;font-family:var(--display);font-weight:600;font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--accent-soft);margin-bottom:.15rem}

/* ---------- logbog ---------- */
.f-krop{display:grid;grid-template-columns:8.5rem 1fr;gap:1.4rem;align-items:center}
@media(max-width:30rem){.f-krop{grid-template-columns:6.5rem 1fr;gap:1rem}}
.f-krop svg{width:100%;height:auto;display:block}
.f-krop .k-zone{cursor:default}
.f-krop .k-zone:hover>*{fill:#2b2420}
.f-tal{display:grid;gap:.35rem;margin:0;padding:0;list-style:none;font-size:.95rem}
.f-tal b{color:var(--accent-soft)}
.f-post{border-top:1px solid var(--line);padding:.85rem 0;display:grid;grid-template-columns:1fr auto;gap:.2rem 1rem}
.f-post .hv{font-size:.82rem;color:var(--muted)}
.f-post .hvad{font-weight:700}
.f-post .note{grid-column:1/-1;color:#ded5cb;font-size:.95rem;white-space:pre-wrap}
.f-post button{background:none;border:0;color:var(--muted);font:inherit;font-size:.82rem;cursor:pointer;text-decoration:underline}
.f-dato{font-family:var(--display);font-size:.78rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--accent-soft);margin:1.6rem 0 .2rem}

/* ---------- test ---------- */
.f-udsagn{border-top:1px solid var(--line);padding:1.1rem 0}
.f-udsagn p{margin:0 0 .7rem;font-weight:700}
.f-skala{display:grid;grid-template-columns:repeat(5,1fr);gap:.35rem}
.f-skala button{background:var(--bg);border:1.5px solid var(--line);border-radius:.6rem;color:var(--muted);font:inherit;font-size:.8rem;padding:.6rem .2rem;cursor:pointer;line-height:1.2}
.f-skala button[aria-pressed=true]{border-color:var(--accent);background:rgba(208,112,60,.16);color:var(--text);font-weight:700}
@media(max-width:26rem){.f-skala button{font-size:.7rem;padding:.55rem .1rem}}
.f-soejler{display:flex;align-items:flex-end;gap:.7rem;height:9rem;margin:1.2rem 0 .4rem}
.f-soejler div{flex:1;max-width:4.5rem;background:var(--bg-3);border-radius:.4rem .4rem 0 0;position:relative;min-height:.4rem}
.f-soejler div.ny{background:var(--accent)}
.f-soejler span{position:absolute;top:-1.5rem;left:0;right:0;text-align:center;font-family:var(--display);font-weight:800;font-size:.95rem}
.f-soejler em{position:absolute;bottom:-1.5rem;left:-.5rem;right:-.5rem;text-align:center;font-size:.72rem;font-style:normal;color:var(--muted);white-space:nowrap}
.f-stjerner{display:flex;gap:.4rem;margin:.4rem 0 1rem}
.f-stjerner button{width:2.6rem;height:2.6rem;border-radius:50%;background:var(--bg);border:1.5px solid var(--line);color:var(--muted);font:inherit;font-family:var(--display);font-weight:800;cursor:pointer}
.f-stjerner button[aria-pressed=true]{border-color:var(--accent);background:var(--accent);color:#150f0b}
.f-kryds{display:flex;gap:.7rem;align-items:flex-start;margin:0 0 1rem;cursor:pointer}
.f-kryds input{width:1.25rem;height:1.25rem;margin:.2rem 0 0;accent-color:var(--accent);flex:0 0 auto}

/* ---------- arket til print ---------- */
.f-ark h2{margin-top:1.6em}
.f-ark .linjer{border-bottom:1px solid var(--line);height:2.1rem}
@media print{
  body{background:#fff!important;color:#000!important;font-size:11pt}
  .f-top,.f-tilbage,.f-videre,.kun-skaerm,.f-toast{display:none!important}
  .f-main{max-width:none;padding:0}
  .f-kort{background:#fff!important;border-color:#bbb!important;break-inside:avoid}
  .f-main h1,.f-main h2,.f-main h3,.f-prose strong{color:#000!important}
  .eyebrow,.f-lille,.f-under{color:#444!important}
  .f-ark .linjer{border-color:#999}
  .f-sp{break-inside:avoid}
}

/* ---------- siden til partneren ---------- */
.med .lead{max-width:38rem;margin-bottom:2.2rem}
.med-uge{background:var(--bg-2);border:1px solid var(--line);border-radius:.9rem;margin:0 0 .8rem;max-width:42rem}
.med-uge summary{cursor:pointer;padding:1.1rem 1.3rem;display:grid;gap:.15rem;list-style:none}
.med-uge summary::-webkit-details-marker{display:none}
.med-uge summary .eyebrow{margin:0}
.med-titel{font-family:var(--display);font-weight:800;font-size:1.3rem;letter-spacing:-.015em}
.med-uge .prose{padding:0 1.3rem 1.3rem;max-width:none}
.med-uge .prose h2{font-size:1.1rem;margin:1.6em 0 .6em}
.med-dage{padding-left:1.25rem}
.med-note{margin-top:2rem}

/* ---------- siden om forløbet: /forloeb ---------- */
.fl section{padding-block:clamp(3.2rem,7vw,5.5rem)}
.fl h2{max-width:22ch}
.fl-top{background:radial-gradient(48% 60% at 78% 100%,rgba(208,112,60,.18),transparent 72%)}
.fl-top-inner{display:grid;gap:clamp(2rem,5vw,3.5rem);align-items:center}
@media(min-width:56rem){.fl-top-inner{grid-template-columns:1fr 1.15fr}}
.fl-top h1{font-size:clamp(2.8rem,1.6rem + 5.2vw,4.8rem);margin-bottom:.3em}
.fl-top .lead{max-width:30ch}
.fl-top .btn-row{margin-top:1.8rem}

/* Videoen om forløbet. Feltet viser en pladsholder, indtil videoen er slået til i admin (video.js). */
.fl-video{position:relative;aspect-ratio:16/9;background:#0c0a09;border:1px solid var(--line);border-radius:1rem;overflow:hidden;
  box-shadow:0 1.5rem 4rem rgba(0,0,0,.45),0 0 0 .5rem rgba(208,112,60,.06)}
.fl-video video{width:100%;height:100%;display:block;background:#000}
.fl-video-tom{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.3rem;text-align:center;padding:1.5rem;color:var(--muted);
  background:radial-gradient(60% 55% at 50% 105%,rgba(208,112,60,.22),transparent 70%)}
.fl-video-tom svg{width:4.2rem;height:4.2rem;color:var(--accent-soft);margin-bottom:.7rem}
.fl-video-tom p{margin:0;max-width:26rem;font-size:.95rem}
.fl-video-tom strong{color:var(--text);font-size:1.15rem}

.fl-to{display:grid;gap:1.5rem clamp(2rem,6vw,5rem)}
@media(min-width:52rem){.fl-to{grid-template-columns:1fr 1.2fr}}
.fl-to .pull{margin-top:1.6rem}

.fl-saadan{display:grid;gap:.9rem;margin:2rem 0 0;padding:0;list-style:none;grid-template-columns:repeat(auto-fit,minmax(min(17rem,100%),1fr))}
.fl-saadan li{background:var(--bg-2);border:1px solid var(--line);border-radius:.9rem;padding:1.5rem 1.4rem}
.fl-saadan svg{width:2rem;height:2rem;fill:none;stroke:var(--accent-soft);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;margin-bottom:1rem}
.fl-saadan h3{margin:0 0 .4rem}
.fl-saadan p{margin:0;color:var(--muted);font-size:.98rem;line-height:1.55}

/* De seks uger: tallet står i en ring, der fyldes en sjettedel mere for hver uge. */
/* Båndet glider ind og ud som afsnittene på forsiden (--baand i style.css). */
.fl-uger-baand{background:var(--baand)}
.fl-uger{display:grid;gap:.9rem;margin:2.4rem 0 0;padding:0;list-style:none;grid-template-columns:1fr}
@media(min-width:38rem){.fl-uger{grid-template-columns:1fr 1fr}}
@media(min-width:58rem){.fl-uger{grid-template-columns:repeat(3,1fr)}}
.fl-uge{background:var(--bg);border:1px solid var(--line);border-radius:1rem;padding:1.7rem 1.5rem 1.6rem}
.fl-ring{width:4.6rem;height:4.6rem;display:block;margin-bottom:1.2rem}
.fl-ring circle{fill:none;stroke:var(--line);stroke-width:5}
.fl-ring .fyld{stroke:var(--accent);transform:rotate(-90deg);transform-origin:50% 50%}
.fl-ring text{fill:var(--accent-soft);font-family:var(--display);font-weight:800;font-size:25px;text-anchor:middle}
.fl-uge-nr{font-family:var(--display);font-size:.74rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--accent-soft);margin:0 0 .35rem}
.fl-uge h3{margin:0 0 .5rem;font-size:clamp(1.25rem,1.1rem + .6vw,1.5rem)}
.fl-uge p:last-child{margin:0;color:var(--muted);font-size:.98rem;line-height:1.55}
.fl-uger-note{margin:1.6rem 0 0;font-size:.95rem}

.fl-op{display:grid;gap:1.5rem clamp(2rem,6vw,4rem);align-items:center;border:1px solid rgba(208,112,60,.45);border-radius:1.1rem;padding:clamp(1.6rem,4vw,2.6rem);
  background:linear-gradient(180deg,rgba(208,112,60,.12),rgba(208,112,60,0) 70%),var(--bg-2)}
@media(min-width:52rem){.fl-op{grid-template-columns:1.1fr 1fr}}
.fl-op h2{margin-bottom:.4em}
.fl-op p{margin:0}
.fl-form{display:grid;gap:.7rem}
.fl-form .btn{justify-self:start}

/* ---------- senere tilføjelser til deltagerens side ---------- */
/* Kun lyd: samme optagelse uden billede, så den kan høres med låst telefon. */
.f-lyd{background:var(--bg-2);border:1px solid var(--line);border-radius:.8rem;padding:1.3rem 1.3rem 1.1rem;margin:0 0 .6rem;
  background-image:radial-gradient(70% 90% at 50% 120%,rgba(208,112,60,.2),transparent 70%)}
.f-lyd .eyebrow{margin:0 0 .3rem}
.f-lyd-titel{font-family:var(--display);font-weight:800;font-size:1.3rem;letter-spacing:-.015em;margin:0 0 1rem}
.f-lyd audio{width:100%;display:block;margin:0 0 .8rem}
.f-lyd .f-lille{margin:0}
.f-afspil-valg{margin:-.5rem 0 1.1rem}
#afspiller .f-video{margin-bottom:.9rem}

/* Mærkerne står samlet uge for uge. */
.f-maerke-uge{display:flex;justify-content:space-between;align-items:baseline;gap:1rem}
.f-maerke-uge span{font-size:.85rem;font-weight:700;color:var(--muted);white-space:nowrap}
.f-maerke-uge.laast,.f-maerker.laast{opacity:.5}

.f-trin{padding-left:1.25rem;margin:0}
.f-trin li{margin-bottom:.5em}
.f-post .hv a{color:var(--accent-soft)}

/* Når manden selv ser siden til partneren: en vej tilbage til forløbet. */
.med-tilbage{position:sticky;top:0;z-index:10;background:var(--bg-3);border-bottom:1px solid var(--line);padding:.7rem 0 .7rem;padding-top:calc(.7rem + env(safe-area-inset-top))}
.med-tilbage .wrap{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem 1rem}
.med-tilbage .btn{font-size:.9rem;padding:.55rem 1.1rem}
.med-tilbage span{color:var(--muted);font-size:.9rem}