/* =====================================================================
   Veyro Systems designsystem — eneste kilde til farver i FormPilot.
   Grundpaletten er Veyros officielle (samme værdier som platformens
   --veyro-*-tokens). Alt andet i denne fil peger hertil via var(); de
   ældre --fp-*- og --blue/--line-navne længere nede er kun aliaser.
   Statusfarver (success/warning/danger) og sportsfarver er semantiske.
   ===================================================================== */
:root{
  /* Officiel grundpalet */
  --veyro-navy:#03131f;            /* Navy Dark — sidebar, header, mørke flader */
  --veyro-navy-deep:#061a2a;       /* Deep Navy */
  --veyro-teal:#087f8f;            /* Veyro Teal */
  --veyro-accent:#22c2cf;          /* Veyro Cyan — aktiv/hover/indikatorer */
  --veyro-accent-soft:#e8f7f8;     /* Teal Light */
  --veyro-bg:#f5f7f9;              /* App Background */
  --veyro-surface:#ffffff;
  --veyro-surface-soft:#f7f8f9;    /* Kortflade */
  --veyro-border:#dce3e8;
  --veyro-text:#102235;            /* Primary Text */
  --veyro-text-muted:#5b6b7b;      /* Secondary Text, tilgængelig variant */
  --veyro-success:#2ead72;
  --veyro-warning:#d99a28;
  --veyro-danger:#d95c5c;
  /* Afledte UI-tokens (beregnet af grundpaletten, ingen nye farver) */
  --veyro-primary:#087484;         /* Teal, tilgængelig til tekst/primær handling */
  --veyro-primary-hover:color-mix(in srgb, var(--veyro-primary) 82%, var(--veyro-navy));
  --veyro-accent-line:color-mix(in srgb, var(--veyro-teal) 28%, var(--veyro-surface));
  --veyro-border-strong:color-mix(in srgb, var(--veyro-border) 70%, var(--veyro-text-muted));
  --veyro-on-navy:#ffffff;
  --veyro-on-navy-soft:color-mix(in srgb, #fff 84%, var(--veyro-navy));
  --veyro-on-navy-muted:color-mix(in srgb, #fff 62%, var(--veyro-navy));
  --veyro-on-navy-line:rgba(255,255,255,.1);
  --veyro-on-navy-hover:rgba(255,255,255,.07);
  --veyro-nav-active:color-mix(in srgb, var(--veyro-accent) 16%, var(--veyro-navy));
  --veyro-success-soft:color-mix(in srgb, var(--veyro-success) 13%, var(--veyro-surface));
  --veyro-success-text:color-mix(in srgb, var(--veyro-success) 62%, var(--veyro-navy));
  --veyro-warning-soft:color-mix(in srgb, var(--veyro-warning) 14%, var(--veyro-surface));
  --veyro-warning-text:color-mix(in srgb, var(--veyro-warning) 55%, var(--veyro-navy));
  --veyro-danger-soft:color-mix(in srgb, var(--veyro-danger) 12%, var(--veyro-surface));
  --veyro-danger-line:color-mix(in srgb, var(--veyro-danger) 38%, var(--veyro-surface));
  --veyro-danger-text:color-mix(in srgb, var(--veyro-danger) 68%, var(--veyro-navy));
  --veyro-danger-on-navy:color-mix(in srgb, var(--veyro-danger) 62%, #fff);
  --veyro-shadow:0 1px 2px rgba(6,26,42,.04),0 6px 18px rgba(6,26,42,.05);
  --veyro-shadow-pop:0 16px 44px rgba(3,19,31,.2);
  /* Knapper og kort */
  --veyro-btn-h:40px; --veyro-btn-radius:10px; --veyro-btn-weight:600; --veyro-btn-pad:0 16px;
  --veyro-card-radius:12px; --veyro-card-pad:18px;
  /* Ældre navne, brugt af de tidligste komponenter */
  --bg:var(--veyro-bg);--card:var(--veyro-surface);--text:var(--veyro-text);--muted:var(--veyro-text-muted);--line:var(--veyro-border);--blue:var(--veyro-primary);--blue2:var(--veyro-accent-soft);--green:#dcfce7;--yellow:#fef3c7;--red:#fee2e2;--purple:#f3e8ff;--shadow:var(--veyro-shadow)
}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif}.app-header{padding:28px;display:flex;justify-content:space-between;gap:20px;align-items:flex-start;background:linear-gradient(135deg,var(--veyro-navy-deep),var(--veyro-primary));color:white}.eyebrow{margin:0 0 6px;text-transform:uppercase;letter-spacing:.12em;font-size:12px;opacity:.8}h1{margin:0;font-size:30px}.subtitle{margin:8px 0 0;color:var(--veyro-accent-soft)}.header-actions{display:flex;gap:10px;flex-wrap:wrap}button,.file-btn{border:0;background:var(--blue);color:white;padding:8px 14px;border-radius:10px;font-weight:700;cursor:pointer;box-shadow:0 4px 12px rgba(8,127,143,.2)}button.secondary,.file-btn{background:var(--veyro-border);color:var(--veyro-text);box-shadow:none}.file-btn input{display:none}main{padding:16px}.goals-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:14px}.goal-card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:14px;box-shadow:var(--shadow)}.goal-card span{color:var(--muted);font-size:13px}.goal-card h2{margin:6px 0;font-size:20px}.goal-card p{margin:0;color:var(--muted)}.goal-card.primary{border-color:var(--veyro-accent-line);background:linear-gradient(180deg,var(--veyro-accent-soft),#fff)}.tabs{display:flex;gap:6px;margin:10px 0 14px;flex-wrap:wrap}.tab{background:#e8edf7;color:var(--veyro-text);box-shadow:none}.tab.active{background:var(--blue);color:#fff}.panel{display:none}.panel.active{display:block}.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:16px}.stat{background:var(--card);padding:12px;border-radius:14px;border:1px solid var(--line);box-shadow:var(--shadow)}.stat .label{color:var(--muted);font-size:13px}.stat .value{font-size:28px;font-weight:800;margin-top:5px}.two-col{display:grid;grid-template-columns:1fr 1fr;gap:12px}.card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:14px;box-shadow:var(--shadow)}.hint{color:var(--muted);font-size:13px}.workout-item{padding:12px;border-bottom:1px solid var(--line);display:grid;grid-template-columns:110px 1fr auto;gap:12px;align-items:center}.badge{border-radius:999px;padding:4px 8px;font-size:12px;background:var(--veyro-border)}.badge.Svøm{background:var(--veyro-accent-soft)}.badge.Cykling{background:#dcfce7}.badge.Løb{background:#fef3c7}.badge.Styrke{background:#f3e8ff}.badge.Race{background:#fee2e2}.toolbar{display:flex;justify-content:space-between;background:var(--card);padding:14px;border:1px solid var(--line);border-radius:16px;margin-bottom:14px;gap:10px}.toolbar div{display:flex;gap:12px;flex-wrap:wrap}.toolbar label{font-size:13px;color:var(--muted)}input,select,textarea{border:1px solid var(--line);border-radius:10px;padding:9px;background:#fff;color:var(--text)}.table-wrap{overflow:auto;max-height:70vh;border-radius:14px;border:1px solid var(--line)}table{width:100%;border-collapse:collapse;background:#fff}th,td{padding:9px 10px;border-bottom:1px solid var(--line);font-size:13px;vertical-align:top;white-space:nowrap}th{background:var(--veyro-surface-soft);text-align:left;position:sticky;top:0;z-index:1}tbody tr{cursor:pointer}tbody tr:hover{outline:2px solid var(--veyro-accent-line)}.status-Gennemført{background:var(--green)}.status-Delvist{background:var(--yellow)}.status-Sprunget{background:var(--red)}.status-Skadet{background:var(--purple)}.today td:nth-child(1),.today td:nth-child(2){background:#fde68a!important;font-weight:800}.form-grid{display:grid;grid-template-columns:1fr 150px auto;gap:10px}.prose p{line-height:1.5}dialog{border:0;border-radius:18px;box-shadow:0 30px 70px rgba(6,26,42,.35);width:min(520px,94vw)}dialog::backdrop{background:rgba(6,26,42,.55)}#editForm{display:grid;gap:12px}#editForm label{display:grid;gap:5px;font-size:13px;color:var(--muted)}.dialog-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:8px}@media(max-width:900px){.app-header{display:block}.header-actions{margin-top:16px}.goals-grid,.two-col,.stats{grid-template-columns:1fr}.toolbar{display:block}.toolbar div{margin-bottom:10px}.workout-item{grid-template-columns:1fr}.form-grid{grid-template-columns:1fr}}

/* === Beta-velkomstpopup — vist efter login for godkendte brugere, se
   maybeShowBetaWelcomeModal()/applyAuthGating() i app.js. ================ */
.beta-welcome-dialog{
  width:min(600px,92vw); max-height:88vh; overflow-y:auto; padding:22px 24px 20px;
}
.beta-welcome-dialog::backdrop{ backdrop-filter:blur(3px); }
.beta-welcome-head{ display:flex; align-items:flex-start; justify-content:space-between; margin-bottom:6px; }
.beta-welcome-badge{
  display:inline-block; background:var(--blue); color:#fff; font-size:11px; font-weight:800;
  letter-spacing:.08em; padding:3px 10px; border-radius:999px; text-transform:uppercase;
}
.beta-welcome-dialog h2{ margin:10px 0 8px; font-size:22px; }
.beta-welcome-intro{ margin:0 0 16px; color:var(--muted); font-size:14px; line-height:1.5; }
.beta-welcome-cards{ display:grid; grid-template-columns:1fr; gap:12px; margin-bottom:16px; }
.beta-welcome-card{
  background:var(--veyro-surface-soft); border:1px solid var(--line); border-radius:14px; padding:14px;
  display:flex; flex-direction:column; gap:6px;
}
.beta-welcome-card-icon{ font-size:22px; }
.beta-welcome-card h3{ margin:0; font-size:14px; }
.beta-welcome-card p{ margin:0; font-size:12.5px; color:var(--muted); line-height:1.4; }
.beta-welcome-card button{ margin-top:2px; font-size:12.5px; padding:7px 10px; align-self:flex-start; }
.beta-welcome-footer{ margin:0 0 4px; text-align:center; font-size:13px; color:var(--muted); }

.update-btn{background:#f59e0b;color:var(--veyro-text);border-color:#f59e0b;font-weight:700}
.wide-dialog{max-width:900px;width:min(900px,96vw)}
#aiPromptOutput{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:13px}
.fit-result{background:var(--veyro-surface-soft);border:1px solid var(--line);border-radius:14px;padding:12px;margin-top:10px;max-height:55vh;overflow:auto}
.fit-result table{margin-top:8px}
.fit-btn{background:var(--veyro-accent-soft);color:var(--veyro-primary-hover);border:1px solid var(--veyro-accent-line)}

.danger{background:#fee2e2;color:#991b1b;border:1px solid #fecaca;}
.danger:hover{background:#fecaca;}


.sub12-card{background:linear-gradient(180deg,#fff,var(--veyro-accent-soft));border:1px solid var(--veyro-accent-line);border-radius:18px;padding:18px;margin-bottom:16px;box-shadow:var(--shadow)}
.sub12-header{display:flex;justify-content:space-between;gap:16px;align-items:flex-start}.sub12-header h3{margin:3px 0 0}.sub12-header strong{font-size:34px;color:var(--veyro-primary)}.eyebrow-dark{font-size:12px;text-transform:uppercase;letter-spacing:.12em;color:var(--muted)}
.split-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin:14px 0}.split-grid div{background:white;border:1px solid var(--line);border-radius:14px;padding:12px}.split-grid span{display:block;color:var(--muted);font-size:12px}.split-grid strong{display:block;font-size:22px;margin:4px 0}.split-grid small{color:var(--muted)}
.status-På-vej{border-color:#86efac}.status-Tæt-på{border-color:#fde68a}.status-Bagud{border-color:#fecaca}.status-Mangler-data,.status-Afventer{border-color:var(--veyro-accent-line)}
@media(max-width:900px){.split-grid{grid-template-columns:1fr 1fr}.sub12-header{display:block}}

.backup-actions{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:16px 0}.backup-actions button,.backup-actions .file-btn{text-align:center;width:100%;display:flex;align-items:center;justify-content:center}.backup-actions .file-btn{min-height:40px}@media(max-width:700px){.backup-actions{grid-template-columns:1fr}}

.goal-top{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}.goal-forecast{text-align:right}.goal-forecast small{display:block;color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.08em}.goal-forecast strong{display:block;font-size:30px;line-height:1;color:var(--veyro-primary);margin-top:2px}.goal-card.primary .goal-forecast strong{color:var(--veyro-primary)}@media(max-width:900px){.goal-forecast strong{font-size:26px}}

.tech-grid{display:grid;grid-template-columns:1fr;gap:16px;margin-top:16px}
.tech-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.tech-item{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;background:#fff;border:1px solid var(--line);border-radius:14px;padding:12px}
.tech-item p{margin:4px 0;color:var(--muted);font-size:13px;line-height:1.35}
.tech-item small{color:var(--veyro-text-muted);font-weight:700}
.tech-item a{white-space:nowrap;background:var(--veyro-accent-soft);color:var(--veyro-primary);text-decoration:none;border:1px solid var(--veyro-accent-line);border-radius:999px;padding:7px 10px;font-size:12px;font-weight:800}
/* Neutral badge for teknik-øvelser uden video-url endnu (fx svømmeøvelserne,
   se renderTechnique() i app.js) — samme pille-form som "Se video", men
   dæmpet i stedet for blå, så den ikke ligner et klikbart link. */
.tech-item span.tech-video-pending{white-space:nowrap;background:var(--bg);color:var(--muted);border:1px solid var(--line);border-radius:999px;padding:7px 10px;font-size:12px;font-weight:700}
@media(max-width:900px){.tech-list{grid-template-columns:1fr}.tech-item{display:block}.tech-item a{display:inline-block;margin-top:8px}.tech-item span.tech-video-pending{display:inline-block;margin-top:8px}}

.edit-actions{align-items:center}.dialog-spacer{flex:1}.edit-actions .danger{margin-right:auto}


.goal-form{display:grid;grid-template-columns:1fr 1fr;gap:10px}.goal-form label{display:grid;gap:5px;font-size:13px;color:var(--muted)}.goal-form .dialog-actions{grid-column:1/-1}.goals-two-col{align-items:start}.progress-wrap{width:140px;height:12px;background:var(--veyro-border);border-radius:999px;overflow:hidden;display:inline-block;margin-right:8px;vertical-align:middle}.progress-bar{height:100%;background:var(--veyro-primary);border-radius:999px}.goal-status{display:inline-block;border-radius:999px;padding:4px 8px;background:var(--veyro-border);font-size:12px;font-weight:700}.goal-status.Opfyldt{background:#dcfce7;color:#166534}.goal-status.Tæt-på{background:#fef3c7;color:#92400e}.goal-status.Bagud{background:#fee2e2;color:#991b1b}.goal-status.På-vej{background:var(--veyro-accent-soft);color:var(--veyro-primary-hover)}.goal-status.Mangler-data{background:var(--veyro-surface-soft);color:var(--veyro-text-muted)}.mini{padding:6px 8px;border-radius:8px;font-size:12px;box-shadow:none}#goalsChart{max-width:100%;height:auto}@media(max-width:900px){.goal-form{grid-template-columns:1fr}.progress-wrap{width:100px}}

.link-list{display:grid;gap:10px;margin-top:12px}
.tech-item{border:1px solid var(--line);border-radius:14px;background:#fff;padding:12px;display:grid;gap:5px}
.tech-item strong{font-size:15px}
.tech-item span{color:var(--muted);font-size:13px;line-height:1.35}
.tech-item a{font-weight:700;color:var(--blue);text-decoration:none}
.tech-item a:hover{text-decoration:underline}

/* Måloversigt fix: bedre plads og ingen afklippet tekst */
.goal-progress-list{display:grid;gap:14px;margin-top:18px}
.goal-progress-row{
  display:grid;
  grid-template-columns:minmax(190px, 1.1fr) minmax(240px, 1.3fr) minmax(210px, .9fr);
  gap:14px;
  align-items:center;
}
.goal-progress-title{font-size:14px;line-height:1.25;white-space:normal;overflow:visible}
.goal-progress-bar{height:18px;border:1px solid var(--veyro-text);background:#fff;position:relative;min-width:180px}
.goal-progress-bar span{display:block;height:100%;background:var(--veyro-text)}
.goal-progress-meta{font-size:13px;line-height:1.25;white-space:normal;overflow:visible}
.goal-progress-meta small{color:var(--muted)}
#goalsOverview,#goalOverview,#maalOverview{overflow:visible}
@media(max-width:1100px){
  .goal-progress-row{grid-template-columns:1fr}
  .goal-progress-bar{width:100%}
}

/* Ny mål-layout */
.goals-two-col{display:block}
.goal-editor-card{margin-bottom:18px}
.goal-editor-head{display:flex;justify-content:space-between;gap:18px;align-items:flex-start;margin-bottom:16px}
.goal-help-box{background:var(--veyro-accent-soft);border:1px solid var(--veyro-accent-line);border-radius:14px;padding:12px;max-width:360px;color:var(--veyro-primary-hover)}
.goal-help-box strong{display:block;margin-bottom:4px}
.goal-help-box span{font-size:13px;line-height:1.35}
.goal-form-modern{display:grid;grid-template-columns:repeat(4,minmax(160px,1fr));gap:14px;align-items:end}
.goal-form-modern label{display:grid;gap:6px;font-size:13px;color:var(--muted)}
.goal-form-modern .wide{grid-column:span 2}
.goal-form-actions{grid-column:1/-1;display:flex;justify-content:flex-end;gap:10px;margin-top:4px}
.goals-table-card{margin-top:18px}
.goal-table-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.goals-table-wrap{max-height:none;overflow:auto}
/* Advarsel om indbygget app-browser i "Din Strava-forbindelse". Samme
   gule nuance som appens oevrige "bemaerk"-flader. */
.strava-inapp-notice{border:1px solid #fcd34d;background:#fffbeb;color:#92400e;border-radius:10px;padding:10px 12px;margin-top:8px}
#goalsTable{min-width:1100px}
#goalsTable th,#goalsTable td{white-space:normal;vertical-align:middle}
.goal-name-cell{min-width:260px}
.goal-progress-cell{min-width:210px}
.goal-actions{white-space:nowrap!important}
.progress-wrap{height:14px;background:var(--veyro-border);border-radius:999px;overflow:hidden;display:inline-block;width:150px;vertical-align:middle;margin-right:8px}
.progress-bar{height:100%;background:var(--blue);border-radius:999px}
.goal-status{border-radius:999px;padding:4px 8px;font-weight:700;font-size:12px;background:var(--veyro-border);color:#1f2937}
.goal-status.Bagud{background:#fee2e2;color:#991b1b}
.goal-status.Opfyldt{background:#dcfce7;color:#166534}
.goal-status.Tæt-på{background:#fef3c7;color:#92400e}
.goal-status.På-vej{background:var(--veyro-accent-soft);color:var(--veyro-primary-hover)}
.mini{padding:6px 8px;font-size:12px}
@media(max-width:1000px){
  .goal-editor-head{display:block}
  .goal-help-box{max-width:none;margin-top:12px}
  .goal-form-modern{grid-template-columns:1fr}
  .goal-form-modern .wide{grid-column:auto}
}

/* FormPilot Fase 1B: onboarding "Min plan" */
.checkbox-row{display:flex;flex-wrap:wrap;gap:10px 16px}
.checkbox-inline{display:inline-flex!important;align-items:center;gap:6px;font-size:13px;color:var(--text)!important}
.checkbox-inline input{width:auto}
#onboardingAvailabilityTable td,#onboardingAvailabilityTable th{white-space:normal}

/* Fase 10A-1 (Opgave 9): flere-pas-samme-dag-kontroller over dagstabellen */
.multi-session-settings{display:flex;flex-wrap:wrap;align-items:center;gap:8px 18px;margin:10px 0;padding:10px 12px;background:var(--veyro-surface-soft);border:1px solid var(--line);border-radius:12px}
.multi-session-settings label{font-size:13px;color:var(--muted);display:inline-flex;align-items:center;gap:6px}
.multi-session-settings input[type="number"]{padding:5px 8px}


/* Print ugeprogram */
.print-toolbar{display:flex;gap:12px;align-items:end;flex-wrap:wrap}
.print-toolbar label{display:grid;gap:6px;font-size:13px;color:var(--muted);min-width:280px}
.print-week-sheet{background:#fff;border:1px solid var(--line);border-radius:18px;padding:22px;box-shadow:var(--shadow);margin-top:16px}
.print-week-header{display:flex;justify-content:space-between;gap:18px;align-items:flex-start;border-bottom:2px solid var(--veyro-border);padding-bottom:14px;margin-bottom:16px}
.print-week-header h2{margin:2px 0 0;font-size:28px}
.print-week-summary{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;min-width:420px}
.print-week-summary div{border:1px solid var(--line);border-radius:12px;padding:10px;background:var(--veyro-surface-soft);text-align:center}
.print-week-summary strong{display:block;font-size:18px}
.print-week-summary span{font-size:12px;color:var(--muted)}
.print-week-days{display:grid;gap:12px}
.print-day{border:1px solid var(--veyro-border);border-radius:14px;overflow:hidden;break-inside:avoid}
.print-day-head{display:flex;justify-content:space-between;background:var(--veyro-surface-soft);padding:10px 12px;border-bottom:1px solid var(--veyro-border)}
.print-workout{padding:12px;border-bottom:1px solid var(--veyro-border);display:grid;grid-template-columns:1fr 140px 220px;gap:12px;align-items:start}
.print-workout:last-child{border-bottom:0}
.print-discipline{display:inline-block;border-radius:999px;background:var(--veyro-border);padding:3px 8px;font-size:12px;font-weight:700;margin-bottom:5px}
.print-workout-main p{margin:4px 0 4px;color:var(--veyro-text-muted);font-size:13px;line-height:1.35}
.print-workout-main small{color:var(--muted)}
.print-workout-numbers{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.print-workout-numbers div{border:1px solid var(--line);border-radius:10px;padding:8px;text-align:center;background:#fff}
.print-workout-numbers strong{display:block;font-size:18px}
.print-workout-numbers span{font-size:12px;color:var(--muted)}
.print-handwrite{font-size:12px;line-height:1.8}
.print-notes{grid-column:1/-1;font-size:12px;color:var(--veyro-text-muted);margin-top:2px}
.print-rest{padding:12px;color:var(--veyro-text-muted);font-style:italic}
.print-Svøm{background:var(--veyro-accent-soft)}
.print-Cykling{background:#f0fdf4}
.print-Løb{background:#fffbeb}
.print-Styrke{background:#faf5ff}
.print-Race{background:#fef2f2}
@media(max-width:1000px){
  .print-week-header{display:block}
  .print-week-summary{min-width:0;grid-template-columns:repeat(2,1fr);margin-top:12px}
  .print-workout{grid-template-columns:1fr}
}
@media print{
  @page{size:A4 portrait;margin:12mm}
  body{background:#fff;color:#000}
  .app-header,.tabs,.no-print,.two-col:not(.print-keep),#dashboard,#program,#monthly,#goals,#equipment,#technique,#settings{display:none!important}
  main{padding:0}
  #printweek{display:block!important}
  .print-week-sheet{box-shadow:none;border:0;border-radius:0;margin:0;padding:0}
  .print-week-header{page-break-after:avoid}
  .print-day{break-inside:avoid;border-color:#999;margin-bottom:8px}
  .print-day-head{background:#eee!important;color:#000}
  .print-workout{break-inside:avoid;background:#fff!important;grid-template-columns:1fr 110px 170px;padding:8px}
  .print-workout-main p{font-size:11px}
  .print-handwrite,.print-notes{font-size:11px}
  .print-discipline{border:1px solid #999;background:#fff!important}
  button,.file-btn{display:none!important}
}

/* Pulsdata */
.hr-hint{color:var(--muted);font-size:12px}

/* Direkte vægtmodul */
.weight-form-final{display:grid;grid-template-columns:repeat(2,minmax(180px,1fr));gap:12px}
.weight-form-final label{display:grid;gap:6px;font-size:13px;color:var(--muted)}
.weight-actions{grid-column:1/-1;display:flex;gap:10px;flex-wrap:wrap}
.weight-debug-status{margin-top:12px;padding:10px 12px;border-radius:12px;border:1px solid var(--line);background:var(--veyro-surface-soft);color:var(--veyro-text-muted)}
.weight-status-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:12px 0 16px}
.weight-stat{border:1px solid var(--line);background:var(--veyro-surface-soft);border-radius:14px;padding:12px}
.weight-stat span{display:block;color:var(--muted);font-size:12px}
.weight-stat strong{display:block;font-size:20px;margin-top:4px}
.weight-stat.wide{grid-column:1/-1}
#weightChart{width:100%;height:auto;max-width:100%}
@media(max-width:850px){.weight-form-final,.weight-status-cards{grid-template-columns:1fr}}

/* Vægtmåldato */
.weight-form-final{grid-template-columns:repeat(3,minmax(160px,1fr))}
@media(max-width:1050px){.weight-form-final{grid-template-columns:repeat(2,minmax(160px,1fr))}}
@media(max-width:700px){.weight-form-final{grid-template-columns:1fr}}

/* Vægttabsplan */
.weight-plan-advice{display:grid;gap:10px}
.advice-box{border:1px solid var(--line);border-radius:14px;padding:14px;background:var(--veyro-surface-soft)}
.advice-box p{margin:8px 0 0;color:var(--muted);line-height:1.45}
.advice-box.ok{background:#f0fdf4;border-color:#bbf7d0}
.advice-box.warn{background:#fffbeb;border-color:#fde68a}
.advice-box.danger{background:#fef2f2;border-color:#fecaca}
.weight-form-final{grid-template-columns:repeat(3,minmax(160px,1fr))}
@media(max-width:1050px){.weight-form-final{grid-template-columns:repeat(2,minmax(160px,1fr))}}
@media(max-width:700px){.weight-form-final{grid-template-columns:1fr}}

/* Coach-udvidelse */
.coach-hero-card{display:grid;gap:14px}.coach-decision-box{border-radius:16px;padding:16px;border:1px solid var(--line);background:var(--veyro-surface-soft)}.coach-decision-box.green{background:#f0fdf4;border-color:#bbf7d0}.coach-decision-box.yellow{background:#fffbeb;border-color:#fde68a}.coach-decision-box.red{background:#fef2f2;border-color:#fecaca}.coach-decision-box p{margin:8px 0 0;color:var(--muted);line-height:1.4}.readiness-score-box{display:flex;gap:14px;align-items:center}.readiness-circle{width:76px;height:76px;border-radius:999px;display:grid;place-items:center;font-size:28px;font-weight:800;border:4px solid var(--veyro-border);background:#fff}.readiness-circle.Grøn{border-color:#22c55e;color:#166534}.readiness-circle.Gul{border-color:#f59e0b;color:#92400e}.readiness-circle.Rød{border-color:#ef4444;color:#991b1b}.readiness-score-box p{margin:4px 0 0;color:var(--muted)}.coach-form{display:grid;grid-template-columns:repeat(2,minmax(160px,1fr));gap:12px}.coach-form label{display:grid;gap:6px;font-size:13px;color:var(--muted)}.coach-form .dialog-actions{grid-column:1/-1}.coach-rec{font-weight:800}.coach-comment,.coach-warnings,.backup-reminder-box{border:1px solid var(--line);border-radius:14px;background:var(--veyro-surface-soft);padding:14px}.coach-comment p{margin:0 0 10px;line-height:1.45}.coach-warning{padding:10px;border-bottom:1px solid var(--line)}.coach-warning:last-child{border-bottom:0}.backup-reminder-box.green{background:#f0fdf4;border-color:#bbf7d0}.backup-reminder-box.yellow{background:#fffbeb;border-color:#fde68a}.backup-reminder-box.red{background:#fef2f2;border-color:#fecaca}#coachStatusPackage{width:100%;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12px}@media(max-width:900px){.coach-form{grid-template-columns:1fr}.readiness-score-box{align-items:flex-start}}

/* Redigerbart udstyr */
.equipment-actions{display:flex;gap:8px;flex-wrap:wrap}
button.mini{padding:7px 11px;font-size:12px;border-radius:10px}
#equipmentDialog .dialog-form{min-width:min(520px,92vw)}

/* Strava */
.strava-actions{display:flex;gap:10px;flex-wrap:wrap;margin:12px 0}
.strava-status-box{border:1px solid var(--line);background:var(--veyro-surface-soft);border-radius:14px;padding:12px;margin-top:12px}
.strava-status-box.ok{background:#f0fdf4;border-color:#bbf7d0}
.strava-status-box.warn{background:#fffbeb;border-color:#fde68a}
.strava-status-box.bad{background:#fef2f2;border-color:#fecaca}
.strava-list{margin:8px 0 0;padding-left:20px;color:var(--muted);line-height:1.6}
/* AKUT (duplicate-athlete-blokering): fremhæver "denne Strava-konto er
   allerede forbundet til en anden FormPilot-bruger"-beskeden i "Din
   Strava-forbindelse", i stedet for at lade den drukne som almindelig,
   grå .hint-tekst — se renderStravaUserConnectionUI() i app.js. */
.strava-connect-issue{background:#fef2f2;border:1px solid #fecaca;color:#991b1b;border-radius:12px;padding:10px 12px;font-weight:600}
/* Vises inde i athlete-boksen, når seneste synkronisering fejlede (fx
   rate limit eller tilbagekaldt adgang) — samme advarselstone som
   .strava-connect-issue ovenfor, men mere afdæmpet, fordi selve
   forbindelsen stadig er intakt. */
.strava-sync-problem{margin-top:8px;color:#b45309;font-weight:600}
.strava-log-box{white-space:pre-wrap;background:var(--veyro-navy-deep);color:var(--veyro-accent-soft);border-radius:14px;padding:14px;min-height:150px;max-height:280px;overflow:auto;font-size:12px}

.button-like{display:inline-flex;align-items:center;justify-content:center;padding:10px 14px;border-radius:12px;background:var(--veyro-primary);color:#fff;text-decoration:none;font-weight:700;border:0}
.button-like:hover{text-decoration:none;filter:brightness(.96)}

.strava-manual-links{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin-top:10px;padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:var(--veyro-surface-soft)}
.strava-manual-links a{font-weight:700}

/* Netlify Strava */
.strava-pin-box{margin-top:10px}
.strava-pin-box label{display:grid;gap:6px;font-size:13px;color:var(--muted)}
.strava-pin-box input{max-width:320px}
.strava-manual-links{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin-top:10px;padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:var(--veyro-surface-soft)}
.strava-manual-links a{font-weight:700}
.button-like{display:inline-flex;align-items:center;justify-content:center;padding:10px 14px;border-radius:12px;background:var(--veyro-primary);color:#fff;text-decoration:none;font-weight:700;border:0}
.button-like:hover{text-decoration:none;filter:brightness(.96)}


.ui-hidden{display:none !important;}


.auto-sync-note{font-size:13px;color:var(--muted);margin-top:8px}

.activity-detail-dialog{max-width:min(1180px,96vw)}
.activity-detail-head{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;margin-bottom:12px}
.activity-detail-content{display:grid;gap:14px}
.activity-hero-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:14px}
.activity-map-card,.activity-stat-card,.activity-chart-card,.activity-laps-card{border:1px solid var(--line);border-radius:16px;background:#fff;padding:14px;overflow:hidden}
.activity-map-wrap{background:var(--veyro-accent-soft);border-radius:14px;border:1px solid var(--line);overflow:hidden}
.activity-map-wrap svg{display:block;width:100%;height:auto}
.activity-map-empty{padding:36px;text-align:center;color:var(--muted);background:var(--veyro-surface-soft);border-radius:14px;border:1px dashed var(--line)}
.activity-stat-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.activity-stat{border:1px solid var(--line);background:var(--veyro-surface-soft);border-radius:12px;padding:10px}
.activity-stat small{display:block;color:var(--muted);font-size:12px}
.activity-stat strong{display:block;font-size:18px;margin-top:3px}
.activity-chart-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.activity-chart-card svg{width:100%;height:auto;display:block}
.activity-chart-title{display:flex;justify-content:space-between;gap:8px;align-items:center;margin-bottom:6px}
.activity-chart-title small{color:var(--muted)}
.activity-laps-card table{width:100%;border-collapse:collapse}
.activity-laps-card th,.activity-laps-card td{border-bottom:1px solid var(--line);padding:8px;text-align:left;font-size:13px}
.activity-row-clickable{cursor:pointer}
.activity-row-clickable:hover{background:var(--veyro-surface-soft)}
@media(max-width:860px){.activity-hero-grid,.activity-chart-grid{grid-template-columns:1fr}.activity-detail-head{flex-direction:column}.activity-stat-grid{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.activity-stat-grid{grid-template-columns:1fr}}

/* Strava activity sidepanel */
.strava-activity-layout{display:grid;grid-template-columns:minmax(420px,1fr) minmax(360px,.9fr);gap:16px;align-items:start}
.strava-activity-list-panel{min-width:0;overflow:auto;border:1px solid var(--line);border-radius:16px;background:#fff}
.strava-activity-list-panel table{margin:0}
.activity-side-panel{position:sticky;top:12px;align-self:start;min-width:0;border:1px solid var(--line);border-radius:18px;background:#fff;padding:14px;max-height:calc(100vh - 140px);overflow:auto}
.activity-side-empty{border:1px dashed var(--line);border-radius:14px;background:var(--veyro-surface-soft);padding:24px;text-align:center;color:var(--muted)}
.activity-side-empty strong{display:block;color:var(--text);margin-bottom:6px}
.activity-side-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;margin-bottom:12px}
.activity-side-head h3{margin:0}
.activity-side-head p{margin:4px 0 0}
.activity-side-close{min-width:auto;padding:8px 10px}
.activity-side-panel .activity-hero-grid{grid-template-columns:1fr}
.activity-side-panel .activity-chart-grid{grid-template-columns:1fr}
.activity-side-panel .activity-stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.activity-side-panel .activity-map-card,.activity-side-panel .activity-stat-card,.activity-side-panel .activity-chart-card,.activity-side-panel .activity-laps-card{padding:12px}
.activity-side-panel .activity-map-wrap svg{max-height:300px}
.activity-row-selected{background:var(--veyro-accent-soft) !important;box-shadow:inset 4px 0 0 var(--veyro-primary)}
@media(max-width:1050px){
  .strava-activity-layout{grid-template-columns:1fr}
  .activity-side-panel{position:static;max-height:none;order:-1}
}
@media(max-width:520px){
  .activity-side-panel .activity-stat-grid{grid-template-columns:1fr}
}


/* Compact 85% layout/design refresh */
:root{
  --compact-radius:14px;
}
body{
  background:#f3f6fb;
}
.app-shell, main, .container, .page, .wrap{
  max-width:85vw;
  margin-left:auto;
  margin-right:auto;
}
header.hero, .hero, .topbar{
  max-width:85vw;
  margin-left:auto;
  margin-right:auto;
  border-radius:0 0 18px 18px;
}
@media(max-width:1100px){
  .app-shell, main, .container, .page, .wrap, header.hero, .hero, .topbar{
    max-width:96vw;
  }
}
.card, .goal-card, .stat-card, .panel, section, .forecast-card{
  border-radius:var(--compact-radius);
}
.card, .goal-card, .stat-card, .forecast-card{
  padding:var(--fp-card-pad,14px) !important;
}
/* Panel-padding er et token, så app-shellen kan styre sidens kolonne selv
   (se "FormPilot layout system" nederst). Uden shell: uændret 14px. */
.panel{
  padding:var(--fp-panel-pad,14px) !important;
}
.hero{
  padding:22px 20px !important;
}
.hero h1{
  font-size:24px !important;
  line-height:1.15;
}
.hero p{
  font-size:13px !important;
}
.goals-grid, .goal-grid{
  gap:12px !important;
}
.goal-card h2,.goal-card h3{
  font-size:16px !important;
}
.goal-card .big,.goal-card strong:last-child{
  font-size:24px !important;
}
.tabs{
  max-width:85vw;
  margin-left:auto;
  margin-right:auto;
  gap:6px !important;
}
.tabs button{
  padding:var(--fp-tab-pad,8px 13px) !important;
  font-size:var(--fp-tab-fs,12px) !important;
  border-radius:var(--fp-radius-control,9px) !important;
}
.stats-grid, .dashboard-grid{
  gap:10px !important;
}
.stat-card strong,.stat-card .value{
  font-size:22px !important;
}
.forecast-grid,.sub12-grid{
  gap:8px !important;
}
.forecast-grid .card,.sub12-grid .card{
  padding:10px !important;
}
table{
  font-size:12px;
}
th,td{
  padding:7px 8px !important;
}
button{
  border-radius:var(--fp-radius-control,9px) !important;
}
.strava-activity-layout{
  grid-template-columns:minmax(380px,1fr) minmax(330px,.72fr);
  gap:12px;
}
.activity-side-panel{
  top:10px;
  padding:12px;
  border-radius:14px;
  max-height:calc(100vh - 120px);
}
.activity-map-card,.activity-stat-card,.activity-chart-card,.activity-laps-card{
  padding:10px !important;
  border-radius:12px !important;
}
.activity-side-head h3{
  font-size:16px;
}
.activity-side-head .hint{
  font-size:12px;
}
.activity-stat-grid{
  gap:7px !important;
}
.activity-stat{
  padding:8px !important;
  border-radius:10px !important;
}
.activity-stat small{
  font-size:11px !important;
}
.activity-stat strong{
  font-size:15px !important;
}
.activity-chart-grid{
  gap:10px !important;
}
.activity-chart-title strong{
  font-size:13px;
}
.activity-chart-title small{
  font-size:11px;
}
.activity-laps-card th,.activity-laps-card td{
  font-size:11px !important;
  padding:6px !important;
}
.activity-map-empty{
  padding:22px !important;
}
@media(max-width:1050px){
  .strava-activity-layout{
    grid-template-columns:1fr;
  }
  .activity-side-panel{
    position:static;
    max-height:none;
    order:-1;
  }
}


/* Clean v5: Program/Træninger/Garmin */
.section-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;margin-bottom:12px}
.training-history-row{background:rgba(34,197,94,.10)}
#programTable tbody tr{background:#fff}
.mini-btn.garmin-workout-btn{padding:4px 8px;border-radius:8px;border:1px solid var(--veyro-accent-line);background:var(--veyro-accent-soft);color:var(--veyro-primary);font-size:11px;font-weight:800;cursor:pointer;white-space:nowrap}
.mini-btn.garmin-workout-btn:hover{background:var(--veyro-accent-soft)}
.garmin-workout-dialog{max-width:min(880px,94vw)}
.dialog-head{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;margin-bottom:14px}
.garmin-workout-content{display:grid;gap:14px}
.garmin-workout-actions{display:flex;gap:10px;flex-wrap:wrap}
.garmin-steps{display:grid;gap:8px}
.garmin-step{border:1px solid var(--line);border-radius:12px;background:var(--veyro-surface-soft);padding:10px}
.garmin-step small{display:block;color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.06em}
.garmin-step strong{display:block;margin:2px 0;font-size:15px}
.garmin-step span{display:block;color:var(--veyro-primary);font-weight:700;font-size:13px}


/* v6 verified fixes */
#sub12Forecast{display:none !important}
.clickable-goal-card{cursor:pointer;transition:transform .12s ease, box-shadow .12s ease}
.clickable-goal-card:hover{transform:translateY(-1px);box-shadow:0 14px 28px rgba(6,26,42,.10)}
.goal-forecast-dialog{max-width:min(920px,94vw)}
.dialog-head{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;margin-bottom:14px}
.goal-forecast-content{display:grid;gap:14px}
.goal-popup-main{display:grid;grid-template-columns:.75fr 1.25fr;gap:16px;align-items:start}
.goal-popup-main small{display:block;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}
.goal-popup-main strong{display:block;font-size:40px;color:var(--veyro-primary);margin:4px 0 8px}
.goal-popup-main p{color:var(--muted);line-height:1.45}
.goal-popup-splits{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.goal-popup-split{border:1px solid var(--line);background:var(--veyro-surface-soft);border-radius:12px;padding:12px}
.goal-popup-split small{font-size:11px}
.goal-popup-split strong{font-size:22px;color:var(--veyro-text);margin:2px 0}
.goal-popup-split span{display:block;color:var(--muted);font-size:12px}
@media(max-width:760px){.goal-popup-main{grid-template-columns:1fr}.goal-popup-splits{grid-template-columns:1fr}}

/* V7 verified dashboard/Garmin fixes */
#sub12Forecast{display:none !important;}
.clickable-goal-card{cursor:pointer;transition:transform .12s ease, box-shadow .12s ease;}
.clickable-goal-card:hover{transform:translateY(-1px);box-shadow:0 14px 28px rgba(6,26,42,.10);}
.goal-forecast-dialog,.garmin-workout-dialog{max-width:min(900px,94vw);}
.dialog-head{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;margin-bottom:14px;}
.goal-popup-main{display:grid;grid-template-columns:.75fr 1.25fr;gap:16px;}
.goal-popup-main small{display:block;color:var(--muted);text-transform:uppercase;letter-spacing:.08em;}
.goal-popup-main strong{display:block;font-size:40px;color:var(--veyro-primary);margin:4px 0 8px;}
.goal-popup-splits{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;}
.goal-popup-split,.garmin-step{border:1px solid var(--line);background:var(--veyro-surface-soft);border-radius:12px;padding:10px;}
.goal-popup-split small,.garmin-step small{display:block;color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.06em;}
.goal-popup-split strong{font-size:22px;color:var(--veyro-text);margin:2px 0;}
.goal-popup-split span,.garmin-step span{display:block;color:var(--veyro-primary);font-weight:700;font-size:13px;}
.garmin-workout-content{display:grid;gap:14px;}
.garmin-workout-actions{display:flex;gap:10px;flex-wrap:wrap;}
.garmin-steps{display:grid;gap:8px;}
.garmin-step strong{display:block;margin:2px 0;font-size:15px;}
@media(max-width:760px){.goal-popup-main{grid-template-columns:1fr}.goal-popup-splits{grid-template-columns:1fr}}

/* FormPilot Fase 1D: #sub12Forecast{display:none !important} (v6/V7 ovenfor)
   skjuler bevidst Jørns sub-12-boks permanent. Når custom-plan er aktiv,
   genbruges boksen til en generisk plan-prognose (app.js:
   renderGenericPlanForecast()) og skal derfor kunne vises igen. Højere
   specificitet (id+class) vinder over de rene id-regler ovenfor uden at de
   skal ændres eller fjernes. */
#sub12Forecast.plan-forecast-visible{display:block !important}

/* V8 safe Garmin builder */
.garmin-warning{border:1px solid #fecaca;background:#fff1f2;border-radius:12px;padding:12px;color:#7f1d1d}
.garmin-warning strong{display:block;margin-bottom:4px}
.garmin-warning p{margin:0;line-height:1.45}
.garmin-manual-box{border:1px solid var(--line);background:var(--veyro-surface-soft);border-radius:12px;padding:12px}
.garmin-manual-box h4{margin:0 0 8px}
.garmin-manual-box ol{margin:0;padding-left:20px}
.garmin-manual-box li{margin:4px 0}
.mini-btn.garmin-workout-btn{min-width:92px}


/* V9 header width + goal popup pace */
.hero{
  max-width:85vw !important;
  margin:0 auto !important;
  border-radius:0 0 18px 18px !important;
  box-sizing:border-box !important;
}
body > header.hero,
body > .hero{
  width:85vw !important;
}
@media(max-width:1100px){
  .hero,
  body > header.hero,
  body > .hero{
    max-width:96vw !important;
    width:96vw !important;
  }
}
/* FormPilot UI fix: align .app-header content width with main (same 85vw container as page content).
   Gælder kun uden app-shell; med shell styres headeren af layoutsystemet nederst. */
body:not(:has(.fp-app-shell)) .app-header{
  max-width:85vw !important;
  width:85vw !important;
  margin:0 auto !important;
  box-sizing:border-box !important;
}
@media(max-width:1100px){
  body:not(:has(.fp-app-shell)) .app-header{
    max-width:96vw !important;
    width:96vw !important;
  }
}
/* FormPilot: header brand-blok (logo + "FormPilot Coach") til venstre for plan/mål-teksten */
.header-main{
  display:flex;
  align-items:center;
  gap:28px;
  min-width:0;
}
.header-brand{
  flex:0 0 auto;
  width:210px;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
}
.header-plan{
  flex:1;
  min-width:0;
}
.brand-logo-img{
  display:block;
  width:auto;
  height:34px;
  aspect-ratio:2048 / 742;
}
.brand-logo-title{
  font-size:13px;
  font-weight:600;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--veyro-on-navy);
}
@media(max-width:700px){
  .header-main{
    flex-direction:column;
    align-items:flex-start;
    gap:12px;
  }
  .header-brand{ width:auto; }
}
/* FormPilot: naviger-menuen flyttet op mellem header og målkort — lyst
   panel, så den ikke drukner i baggrunden og stadig wrapper pænt. */
.tabs{
  background:var(--card);
  border:1px solid var(--line);
  border-radius:16px;
  padding:10px;
  box-shadow:var(--shadow);
}
.tabs .tab-icon{
  margin-right:6px;
  font-size:13px;
  vertical-align:-1px;
}
/* FormPilot: farveaccenter/progress-linjer øverst på målkortene */
.goal-card{
  border-top:4px solid transparent;
}
.goal-card.accent-blue{ border-top-color:var(--veyro-primary); }
.goal-card.accent-yellow{ border-top-color:#eab308; }
.goal-card.accent-green{ border-top-color:#22c55e; }
.goal-card.primary.accent-green{
  border-top-width:5px;
  box-shadow:0 0 0 2px rgba(8,127,143,.14), var(--shadow);
}
.goal-popup-split .pace-line{
  display:block;
  margin-top:4px;
  color:var(--veyro-primary);
  font-weight:800;
  font-size:12px;
}
.goal-popup-note{
  border:1px solid var(--line);
  background:var(--veyro-surface-soft);
  border-radius:12px;
  padding:10px 12px;
  color:var(--muted);
  font-size:13px;
}

/* Fase 10B: generiske mål-estimater/splits — "Estimat"-badge i mål-tabellen
   (Opgave 5) og splits-tabellen i den genanvendte goal-forecast-dialog
   (Opgave 6/10). Genbruger eksisterende .table-wrap til vandret scroll på
   mobil, i stedet for en ny, dedikeret mobil-regel. */
.goal-estimate-badge{ display:inline-flex; flex-direction:column; gap:1px; line-height:1.15; }
.goal-estimate-badge small{ font-size:10px; text-transform:uppercase; letter-spacing:.06em; color:var(--muted); }
.goal-estimate-badge strong{ font-size:14px; color:var(--veyro-text); }
.goal-estimate-badge.conf-low strong{ color:#b45309; }
.goal-estimate-badge.conf-medium strong{ color:var(--veyro-primary); }
.goal-estimate-badge.conf-high strong{ color:#15803d; }
.goal-splits-table{ font-size:13px; }
.goal-splits-table th, .goal-splits-table td{ white-space:normal; }
.goal-split-total td{ border-top:2px solid var(--line); background:var(--veyro-surface-soft); }
@media(max-width:760px){
  .goal-splits-table{ font-size:12px; }
}

/* Fase 10C: "Dine mål" som kort/bokse i stedet for en tung tabel. Kortene
   genbruger .card/.goal-card (base-stil, padding, skygge, accentfarve) fra
   dashboardets goal cards — se getDashboardGoalCards()/renderFlexGoalsCards()
   i app.js. Grid: 1 kolonne mobil, 2 tablet, 3 på bred skærm. */
.user-goal-cards-grid{ display:grid; grid-template-columns:1fr; gap:14px; }
@media(min-width:640px){ .user-goal-cards-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(min-width:1100px){ .user-goal-cards-grid{ grid-template-columns:repeat(3,minmax(0,1fr)); } }
.user-goal-card{ display:flex; flex-direction:column; gap:10px; cursor:pointer; }
.user-goal-card:focus-visible{ outline:2px solid var(--veyro-primary); outline-offset:2px; }
.user-goal-card-top{ display:flex; justify-content:space-between; align-items:flex-start; gap:10px; }
.user-goal-card-top h3{ margin:2px 0 0; font-size:17px; line-height:1.25; }
.user-goal-card-category{ display:block; color:var(--muted); font-size:11px; text-transform:uppercase; letter-spacing:.05em; }
.user-goal-card-forecast{ text-align:right; flex-shrink:0; }
.user-goal-card-forecast strong{ font-size:22px; }
.user-goal-card-noestimate{ color:var(--muted)!important; font-size:14px!important; }
.user-goal-card-meta{ display:flex; flex-wrap:wrap; gap:6px 12px; font-size:13px; color:var(--muted); align-items:center; }
.user-goal-plan-badge{ background:var(--veyro-accent-soft); color:var(--veyro-primary-hover); border-radius:999px; padding:2px 9px; font-size:11px; font-weight:700; }
.user-goal-card-notes{ margin:0; }
.user-goal-card-actions{ display:flex; flex-wrap:wrap; gap:6px; margin-top:2px; padding-top:10px; border-top:1px solid var(--line); }
.user-goal-card-actions button{ font-size:12px; padding:6px 10px; }
.goal-cards-empty{ padding:30px 16px; text-align:center; color:var(--muted); grid-column:1/-1; }
.goal-cards-empty strong{ display:block; font-size:16px; color:var(--text); margin-bottom:6px; }

/* Fase 10E: tom-state-kortet i topområdet under nav (#goalsHeaderCards),
   når en custom-bruger endnu ikke har nogen aktive mål — se
   GOAL_HEADER_EMPTY_STATE_HTML i app.js. Beholder .goal-card's almindelige
   padding/skygge, kun knappen får lidt luft over sig. */
.goal-header-empty button{ margin-top:8px; }

/* Fase 10D: #editDialog viser nu "Planlagt træning" + "Registrér gennemført"
   som to tydeligt adskilte sektioner, med en statusbadge i headeren — se
   openEdit()/buildPlannedWorkoutInfoHtml() i app.js. */
.workout-detail-dialog{ width:min(560px,94vw); }
.workout-detail-header{ display:flex; justify-content:space-between; align-items:flex-start; gap:10px; }
.workout-detail-header h3{ margin:0; }
.workout-status-badge{ border-radius:999px; padding:4px 10px; font-size:12px; font-weight:700; background:var(--veyro-border); color:#1f2937; white-space:nowrap; }
.workout-status-badge.status-Gennemført{ background:var(--green); color:#166534; }
.workout-status-badge.status-Delvist-gennemført{ background:var(--yellow); color:#92400e; }
.workout-status-badge.status-Sprunget-over{ background:var(--red); color:#991b1b; }
.workout-status-badge.status-Planlagt{ background:var(--blue2); color:var(--veyro-primary-hover); }
.workout-section-heading{ margin:14px 0 6px; font-size:13px; text-transform:uppercase; letter-spacing:.05em; color:var(--muted); }
.workout-planned-box{ margin-bottom:4px; }
.workout-planned-grid{ display:grid; grid-template-columns:1fr; gap:6px 14px; background:var(--veyro-surface-soft); border:1px solid var(--line); border-radius:12px; padding:12px; }
@media(min-width:480px){ .workout-planned-grid{ grid-template-columns:1fr 1fr; } }
.workout-planned-row{ display:flex; flex-direction:column; gap:1px; font-size:13px; }
.workout-planned-row span{ color:var(--muted); font-size:11px; text-transform:uppercase; letter-spacing:.04em; }
.workout-planned-row strong{ font-size:14px; }

/* === Tracker-rute i kalenderdialogen ("Gem Tracker-rute og vis kort") ===
   Simpelt, afhængighedsfrit SVG-rutekort — se disciplineRouteMapSvg() i
   app.js og README_APP_CONFIG.md "Tracker-ruter i kalenderen". */
.workout-tracker-info-grid{ display:grid; grid-template-columns:1fr; gap:6px 14px; margin-bottom:12px; }
@media(min-width:480px){ .workout-tracker-info-grid{ grid-template-columns:1fr 1fr; } }
.workout-tracker-info-grid div{ background:var(--veyro-accent-soft); border:1px solid var(--veyro-accent-line); border-radius:10px; padding:8px 10px; }
.workout-tracker-info-grid span{ display:block; color:var(--muted); font-size:11px; text-transform:uppercase; letter-spacing:.04em; }
.workout-tracker-info-grid strong{ display:block; font-size:14px; margin-top:2px; }
.workout-route-map-box{
  margin:0 0 14px; border:1px solid var(--line); border-radius:14px; overflow:hidden; background:var(--veyro-surface-soft);
}
.workout-route-map{ width:100%; height:260px; display:block; }
.workout-route-map svg{ width:100%; height:100%; display:block; }
.route-map-bg{ fill:var(--veyro-surface-soft); }
.route-map-line{ stroke:var(--veyro-primary); stroke-width:3; stroke-linejoin:round; stroke-linecap:round; }
.route-map-start{ fill:#22c55e; stroke:#fff; stroke-width:2; }
.route-map-end{ fill:#dc2626; stroke:#fff; stroke-width:2; }
.workout-route-map-caption{ margin:0; padding:8px 12px; font-size:12px; color:var(--muted); text-align:center; background:var(--card); }
.workout-tracker-analysis{ margin:0 0 14px; }
.tracker-analysis-chart{ margin:0 0 10px; padding:10px 12px; background:var(--veyro-surface-soft); border:1px solid var(--line); border-radius:12px; overflow:hidden; }
.tracker-analysis-chart h5{ margin:0 0 6px; font-size:13px; color:var(--text); }
.tracker-analysis-chart svg{ display:block; width:100%; max-width:100%; }
.tracker-analysis-chart .hint{ margin:6px 0 0; }
.workout-planned-notes{ margin:8px 0 0; }
.workout-brick-note{ margin:6px 0 0; color:#7c3aed; }
.workout-pain-note{ margin:6px 0 0; color:#9a3412; }
.workout-plan-vs-actual{ margin:8px 0 0; }
/* Træningsvejledning V1 — samme visuelle sprog som .workout-planned-grid
   ovenfor (lys, bordered boks), genbruger .hint til selve teksten. */
.workout-instructions{
  margin:10px 0 0;
  padding:12px;
  background:var(--veyro-surface-soft);
  border:1px solid var(--line);
  border-radius:12px;
}
.workout-instructions-list{
  margin:8px 0 0;
  padding-left:18px;
  font-size:13px;
  color:var(--muted);
  display:flex;
  flex-direction:column;
  gap:4px;
}
.workout-instructions-list strong{ color:var(--text); }


/* V10 TrainingPeaks-style calendar */
.calendar-shell{padding:14px !important}
.calendar-toolbar{display:flex;justify-content:space-between;gap:14px;align-items:flex-start;margin-bottom:12px}
.calendar-toolbar h3{margin:0 0 4px;font-size:22px}
.calendar-actions{display:flex;gap:8px;align-items:center}
.calendar-actions button{min-width:44px}
.calendar-summary{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px;margin:10px 0 12px}
.calendar-summary div{border:1px solid var(--line);border-radius:12px;background:var(--veyro-surface-soft);padding:9px 10px}
.calendar-summary strong{display:block;font-size:18px;color:var(--veyro-text)}
.calendar-summary span{display:block;font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}
.calendar-summary .sum-green{background:#dcfce7;border-color:#86efac}
.calendar-summary .sum-yellow{background:#fef9c3;border-color:#fde68a}
.calendar-summary .sum-red{background:#fee2e2;border-color:#fecaca}
.calendar-summary .sum-blue{background:var(--veyro-accent-soft);border-color:var(--veyro-accent-line)}
/* AKUT: kompakt tom-state øverst i Kalender-fanen for en custom-bruger uden
   ét eneste workout endnu — se renderCalendarEmptyState() i app.js. */
.calendar-empty-state{background:var(--veyro-surface-soft);border:1px solid var(--line);border-radius:14px;padding:14px 16px;margin:0 0 12px;text-align:center}
.calendar-empty-state h3{margin:0 0 6px;font-size:16px}
.calendar-empty-state p{margin:0;color:var(--muted);font-size:13px;max-width:560px;margin-left:auto;margin-right:auto}
.calendar-empty-state-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:10px}
.calendar-empty-state-actions button{font-size:12px;padding:7px 12px}
.calendar-weekdays{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));border:1px solid var(--line);border-bottom:0;border-radius:14px 14px 0 0;overflow:hidden}
.calendar-weekdays div{background:var(--veyro-surface-soft);color:var(--veyro-text-muted);font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;padding:8px 10px;border-right:1px solid var(--line)}
.calendar-weekdays div:last-child{border-right:0}
.training-calendar-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));border-left:1px solid var(--line);border-top:1px solid var(--line)}
.calendar-day{min-height:168px;background:#fff;border-right:1px solid var(--line);border-bottom:1px solid var(--line);padding:7px;display:flex;flex-direction:column;gap:6px;min-width:0}
.calendar-day.other-month{background:var(--veyro-surface-soft);color:#94a3b8}
.calendar-day.calendar-today{box-shadow:inset 0 0 0 2px var(--veyro-primary)}
.calendar-day-head{display:flex;justify-content:space-between;align-items:center;font-size:12px;color:var(--veyro-text-muted)}
.calendar-day-head strong{font-size:15px;color:var(--veyro-navy-deep)}
.calendar-day-body{display:flex;flex-direction:column;gap:5px;min-width:0}
.calendar-empty-day{height:1px}
.cal-workout{width:100%;text-align:left;border:1px solid transparent;border-radius:10px;padding:7px 8px;display:block;cursor:pointer;box-shadow:0 1px 2px rgba(6,26,42,.06);font:inherit;min-width:0;color:var(--veyro-navy-deep)}
.cal-workout:hover{filter:brightness(.985);transform:translateY(-1px)}
.cal-workout-top{display:flex;justify-content:space-between;gap:6px;align-items:center;margin-bottom:3px}
.cal-workout-top span{font-size:11px;font-weight:800;white-space:nowrap;color:var(--veyro-navy-deep)}
.cal-workout-top small{font-size:10px;color:var(--veyro-text-muted);white-space:nowrap}
.cal-workout strong{display:block;font-size:12px;line-height:1.2;color:var(--veyro-navy-deep);overflow:hidden;text-overflow:ellipsis}
.cal-detail,.cal-intensity,.cal-hr{display:block;font-size:11px;color:var(--veyro-text-muted);margin-top:2px;line-height:1.22;overflow:hidden;text-overflow:ellipsis}
.cal-intensity{color:var(--veyro-text-muted)}
/* Fase 10A-1/10A-2 (Opgave 4/5): gør de enkelte kort mere kompakte, jo flere
   pas en dag har (op til 4), så en travl dag ikke gør hele kalenderrækken
   unødigt høj. :has() er en progressiv forbedring — understøttes den ikke,
   får kortene bare deres normale (lidt større) størrelse. */
.calendar-day-body:has(.cal-workout ~ .cal-workout) .cal-workout{padding:5px 7px}
.calendar-day-body:has(.cal-workout ~ .cal-workout) .cal-workout strong{font-size:11px}
.calendar-day-body:has(.cal-workout ~ .cal-workout) .cal-intensity{display:none}
/* 3+ pas samme dag: endnu tættere, og skjul pulslinjen (sjældent relevant
   på et fremtidigt planlagt pas). */
.calendar-day-body:has(.cal-workout ~ .cal-workout ~ .cal-workout) .cal-workout{padding:4px 6px}
.calendar-day-body:has(.cal-workout ~ .cal-workout ~ .cal-workout) .cal-detail{font-size:10px}
.calendar-day-body:has(.cal-workout ~ .cal-workout ~ .cal-workout) .cal-hr{display:none}
.cal-green{background:#dcfce7;border-color:#86efac}
.cal-yellow{background:#fef9c3;border-color:#fde68a}
.cal-red{background:#fee2e2;border-color:#fecaca}
.cal-blue{background:var(--veyro-accent-soft);border-color:var(--veyro-accent-line)}
@media(max-width:1100px){
  .calendar-summary{grid-template-columns:repeat(3,minmax(0,1fr))}
  .training-calendar-grid,.calendar-weekdays{min-width:980px}
  .calendar-shell{overflow-x:auto}
}
@media(max-width:700px){
  .calendar-toolbar{flex-direction:column}
  .calendar-summary{grid-template-columns:repeat(2,minmax(0,1fr))}
}


/* V11 Analytics dashboard */
.analytics-shell{padding:14px !important}
.analytics-toolbar{display:flex;justify-content:space-between;gap:14px;align-items:flex-start;margin-bottom:12px}
.analytics-toolbar h3{margin:0 0 4px;font-size:22px}
.analytics-actions{display:flex;gap:10px;flex-wrap:wrap;align-items:end}
.analytics-actions label{font-size:12px;color:var(--muted);display:grid;gap:4px}
.analytics-actions select{min-width:150px}
.analytics-kpis{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px;margin-bottom:12px}
.analytics-kpis div{border:1px solid var(--line);border-radius:12px;background:var(--veyro-surface-soft);padding:10px}
.analytics-kpis small{display:block;color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.05em}
.analytics-kpis strong{display:block;font-size:18px;color:var(--veyro-text);margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.analytics-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;align-items:stretch}
.analytics-card{border:1px solid var(--line);background:#fff;border-radius:14px;padding:12px;min-height:260px;overflow:hidden}
.analytics-card.wide{grid-column:span 2}
.analytics-card h4{margin:0 0 8px;font-size:14px;color:var(--veyro-navy-deep);text-align:center}
.analytics-empty{height:190px;display:grid;place-items:center;border:1px dashed var(--line);background:var(--veyro-surface-soft);border-radius:12px;color:var(--muted);font-size:13px;text-align:center;padding:12px}
.analytics-svg{width:100%;height:auto;display:block}
.analytics-svg line{stroke:var(--veyro-border);stroke-width:1}
.analytics-svg text{font-size:10px;fill:var(--veyro-text-muted)}
.bars-svg rect{fill:var(--veyro-primary);opacity:.78}
.line-svg path{fill:none;stroke:var(--veyro-primary);stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}
.line-svg circle{fill:var(--veyro-primary);opacity:.7}
.pie-wrap{display:grid;grid-template-columns:240px 1fr;gap:10px;align-items:center}
.pie-svg{width:100%;max-width:240px}
.pie-svg path{stroke:#fff;stroke-width:2}
.pie-svg circle{fill:#fff}
.ana-swim{fill:#0284c7 !important;background:#0284c7 !important}
.ana-bike{fill:#581c87 !important;background:#581c87 !important}
.ana-run{fill:var(--veyro-primary-hover) !important;background:var(--veyro-primary-hover) !important}
.ana-strength{fill:#ca8a04 !important;background:#ca8a04 !important}
.ana-row{fill:#ea580c !important;background:#ea580c !important}
.ana-other{fill:var(--veyro-text-muted) !important;background:var(--veyro-text-muted) !important}
.pie-legend{display:grid;gap:5px;font-size:12px}
.legend-dot{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:6px;vertical-align:middle}
.analytics-table-wrap{max-height:230px;overflow:auto;border:1px solid var(--line);border-radius:10px}
.analytics-table-wrap table{width:100%;border-collapse:collapse;font-size:12px}
.analytics-table-wrap th,.analytics-table-wrap td{padding:6px 7px;border-bottom:1px solid var(--line);text-align:left}
.analytics-table-wrap th{background:var(--veyro-surface-soft);position:sticky;top:0}
@media(max-width:1400px){
  .analytics-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .analytics-kpis{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media(max-width:1000px){
  .analytics-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .analytics-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pie-wrap{grid-template-columns:1fr}
}
@media(max-width:680px){
  .analytics-grid{grid-template-columns:1fr}
  .analytics-card.wide{grid-column:span 1}
  .analytics-toolbar{flex-direction:column}
}


/* V12 Monthly status progress bars */
#monthly .table-wrap,
#monthlyTable{
  max-width:100%;
}
#monthlyTable.monthly-progress-table{
  table-layout:fixed;
  width:100%;
}
#monthlyTable.monthly-progress-table th,
#monthlyTable.monthly-progress-table td{
  text-align:center;
  vertical-align:middle;
  padding:7px 8px !important;
  white-space:nowrap;
}
#monthlyTable.monthly-progress-table th:nth-child(1),
#monthlyTable.monthly-progress-table td:nth-child(1){
  width:92px;
}
#monthlyTable.monthly-progress-table th:nth-child(2),
#monthlyTable.monthly-progress-table td:nth-child(2),
#monthlyTable.monthly-progress-table th:nth-child(3),
#monthlyTable.monthly-progress-table td:nth-child(3){
  width:92px;
}
#monthlyTable.monthly-progress-table th:nth-child(4),
#monthlyTable.monthly-progress-table td:nth-child(4){
  width:190px;
}
#monthlyTable.monthly-progress-table th:nth-child(5),
#monthlyTable.monthly-progress-table td:nth-child(5),
#monthlyTable.monthly-progress-table th:nth-child(6),
#monthlyTable.monthly-progress-table td:nth-child(6),
#monthlyTable.monthly-progress-table th:nth-child(7),
#monthlyTable.monthly-progress-table td:nth-child(7){
  width:90px;
}
#monthlyTable.monthly-progress-table th:nth-child(8),
#monthlyTable.monthly-progress-table td:nth-child(8),
#monthlyTable.monthly-progress-table th:nth-child(9),
#monthlyTable.monthly-progress-table td:nth-child(9){
  text-align:left;
  white-space:normal;
}
#monthlyTable.monthly-progress-table th:nth-child(8),
#monthlyTable.monthly-progress-table td:nth-child(8){
  width:170px;
}
#monthlyTable.monthly-progress-table th:nth-child(9),
#monthlyTable.monthly-progress-table td:nth-child(9){
  width:auto;
}
.monthly-progress-cell{
  display:flex;
  justify-content:center;
  align-items:center;
}
.monthly-progress-bar{
  position:relative;
  width:160px;
  height:22px;
  border:1px solid var(--veyro-border);
  border-radius:999px;
  overflow:hidden;
  background:#fee2e2;
  display:flex;
  box-shadow:inset 0 1px 2px rgba(6,26,42,.08);
}
.monthly-progress-bar span{
  display:block;
  height:100%;
  flex:0 0 auto;
}
.monthly-progress-bar .monthly-green{
  background:rgba(34,197,94,.72);
}
.monthly-progress-bar .monthly-yellow{
  background:rgba(250,204,21,.72);
}
.monthly-progress-bar .monthly-red{
  background:rgba(239,68,68,.72);
}
.monthly-progress-bar strong{
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  font-size:12px;
  color:var(--veyro-navy-deep);
  text-shadow:0 1px 0 rgba(255,255,255,.6);
  font-weight:900;
}
@media(max-width:900px){
  #monthlyTable.monthly-progress-table{
    table-layout:auto;
    min-width:980px;
  }
  .monthly-progress-bar{
    width:140px;
  }
}


/* V13 Unique analytics design */
.v13-analytics-panel .analytics-shell{
  background:linear-gradient(145deg,#08111f 0%,#0f2338 45%,#102b3f 100%) !important;
  border:1px solid rgba(148,163,184,.22);
  color:var(--veyro-accent-soft);
  box-shadow:0 24px 70px rgba(2,6,23,.22);
}
.v13-analytics-panel .analytics-toolbar h3{
  color:#fff;
  font-size:25px;
  letter-spacing:-.03em;
}
.v13-analytics-panel .analytics-toolbar .hint{
  color:#9fb4d1;
}
.v13-analytics-panel .analytics-actions label{
  color:var(--veyro-on-navy-muted);
}
.v13-analytics-panel .analytics-actions select{
  background:#0b1728;
  border-color:#284460;
  color:var(--veyro-accent-soft);
}
.v13-analytics-panel .analytics-kpis{
  grid-template-columns:1.6fr repeat(4,minmax(0,1fr)) !important;
  gap:12px;
}
.v13-kpi-hero{
  border:1px solid rgba(125,211,252,.24) !important;
  background:linear-gradient(135deg,rgba(14,165,233,.18),rgba(34,197,94,.10)) !important;
  border-radius:22px !important;
  padding:18px !important;
  min-height:136px;
}
.v13-kpi-hero span{
  display:block;
  color:var(--veyro-accent);
  text-transform:uppercase;
  letter-spacing:.1em;
  font-size:11px;
  font-weight:900;
}
.v13-kpi-hero strong{
  display:block;
  color:#fff !important;
  font-size:42px !important;
  letter-spacing:-.05em;
  margin-top:10px;
}
.v13-kpi-hero small{
  color:var(--veyro-on-navy-muted) !important;
  font-size:13px !important;
  text-transform:none !important;
  letter-spacing:0 !important;
}
.v13-ring{
  position:relative;
  min-height:136px;
  border:1px solid rgba(148,163,184,.20) !important;
  background:rgba(6,26,42,.72) !important;
  border-radius:22px !important;
  padding:10px !important;
  display:grid;
  place-items:center;
}
.v13-ring svg{
  width:118px;
  height:118px;
  transform:rotate(-90deg);
}
.v13-ring circle{
  fill:none;
  stroke-width:10;
}
.v13-ring .track{stroke:rgba(148,163,184,.22)}
.v13-ring .fill{stroke:var(--veyro-accent);stroke-linecap:round;transition:stroke-dashoffset .3s ease}
.v13-ring.balance .fill{stroke:#34d399}
.v13-ring.match .fill{stroke:#facc15}
.v13-ring.flow .fill{stroke:#60a5fa}
.v13-ring.momentum .fill{stroke:#fb7185}
.v13-ring-text{
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  text-align:center;
  padding-top:14px;
}
.v13-ring-text strong{
  color:#fff !important;
  font-size:28px !important;
  line-height:1;
}
.v13-ring-text span{
  color:var(--veyro-accent-soft);
  font-size:12px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.06em;
}
.v13-ring-text small{
  color:var(--veyro-on-navy-muted);
  font-size:11px;
}
.v13-analytics-panel .analytics-grid{
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:12px;
}
.v13-card{
  border:1px solid rgba(148,163,184,.20);
  background:rgba(6,26,42,.70);
  border-radius:22px;
  padding:14px;
  min-height:220px;
  box-shadow:0 16px 34px rgba(2,6,23,.18);
  overflow:hidden;
}
.v13-card.v13-wide{grid-column:span 2}
.v13-card-title{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:10px;
  margin-bottom:12px;
}
.v13-card-title span{
  color:var(--veyro-accent);
  font-size:10px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.12em;
}
.v13-card-title strong{
  color:#fff;
  font-size:15px;
  text-align:right;
}
.v13-insights{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
}
.v13-insight{
  border-radius:16px;
  padding:12px;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.08);
}
.v13-insight strong{display:block;color:#fff;font-size:14px;margin-bottom:5px}
.v13-insight p{margin:0;color:var(--veyro-on-navy-muted);line-height:1.35;font-size:13px}
.v13-insight.warn{border-color:rgba(248,113,113,.35);background:rgba(127,29,29,.24)}
.v13-insight.focus{border-color:rgba(250,204,21,.35);background:rgba(113,63,18,.22)}
.v13-insight.good{border-color:rgba(52,211,153,.35);background:rgba(6,78,59,.22)}
.v13-insight.info{border-color:rgba(125,211,252,.35);background:rgba(8,47,73,.22)}
.v13-heatmap{
  display:grid;
  grid-template-columns:36px 1fr;
  gap:8px;
}
.v13-heat-labels{
  display:grid;
  grid-template-rows:repeat(7,18px);
  gap:4px;
}
.v13-heat-labels span{
  color:var(--veyro-on-navy-muted);
  font-size:11px;
  line-height:18px;
}
.v13-heat-grid{
  display:grid;
  grid-auto-flow:column;
  grid-template-rows:repeat(7,18px);
  gap:4px;
}
.v13-heat-cell{
  border-radius:5px;
  background:rgba(148,163,184,.16);
}
.v13-heat-cell.level-1{background:rgba(56,189,248,.30)}
.v13-heat-cell.level-2{background:rgba(34,197,94,.45)}
.v13-heat-cell.level-3{background:rgba(250,204,21,.60)}
.v13-heat-cell.level-4{background:rgba(251,113,133,.75)}
.v13-lanes{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px;
}
.v13-lane{
  border-radius:18px;
  padding:12px;
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.08);
}
.v13-lane-head{
  display:flex;
  align-items:center;
  gap:8px;
  color:#fff;
  margin-bottom:10px;
}
.v13-lane-head span{
  width:28px;height:28px;border-radius:10px;display:grid;place-items:center;font-weight:900;background:rgba(255,255,255,.10)
}
.v13-lane-progress{
  height:9px;border-radius:999px;background:rgba(148,163,184,.18);overflow:hidden;margin-bottom:12px;
}
.v13-lane-progress b{
  display:block;height:100%;border-radius:999px;background:var(--veyro-accent);
}
.v13-lane.v13-bike .v13-lane-progress b{background:#a78bfa}
.v13-lane.v13-run .v13-lane-progress b{background:#34d399}
.v13-lane.v13-strength .v13-lane-progress b{background:#facc15}
.v13-lane.v13-row .v13-lane-progress b{background:#fb923c}
.v13-lane-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
}
.v13-lane-grid small{display:block;color:var(--veyro-on-navy-muted);font-size:10px;text-transform:uppercase}
.v13-lane-grid strong{display:block;color:#fff;font-size:17px}
.v13-lane-grid span{display:block;color:var(--veyro-on-navy-muted);font-size:10px}
.v13-bars{display:grid;gap:10px;margin-top:8px}
.v13-bar-row{
  display:grid;grid-template-columns:70px 1fr 42px;gap:8px;align-items:center;color:var(--veyro-on-navy-muted);font-size:12px;
}
.v13-bar-row div{
  height:12px;border-radius:999px;background:rgba(148,163,184,.18);overflow:hidden;
}
.v13-bar-row b{
  display:block;height:100%;border-radius:999px;background:var(--veyro-accent);
}
.v13-bars.distance .v13-bar-row b{background:#34d399}
.v13-bar-row strong{color:#fff;text-align:right}
.v13-spark{width:100%;height:auto;display:block;margin-top:10px}
.v13-spark path{
  fill:none;stroke:var(--veyro-accent);stroke-width:4;stroke-linecap:round;stroke-linejoin:round;
}
.v13-spark.run path{stroke:#34d399}
.v13-spark.bike path{stroke:#a78bfa}
.v13-spark.distance path{stroke:#facc15}
.v13-card-note{
  color:var(--veyro-on-navy-muted);
  margin:10px 0 0;
  font-size:12px;
}
.v13-empty,.v13-empty-mini{
  display:grid;place-items:center;border:1px dashed rgba(148,163,184,.28);border-radius:14px;color:var(--veyro-on-navy-muted);min-height:84px;text-align:center;padding:10px;
}
.v13-records{display:grid;gap:8px}
.v13-record-row{
  display:grid;grid-template-columns:86px 1fr auto;gap:10px;align-items:center;border-bottom:1px solid rgba(148,163,184,.16);padding:7px 0;
}
.v13-record-row span{color:var(--veyro-on-navy-muted);font-size:12px}
.v13-record-row strong{color:#fff;font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.v13-record-row em{color:var(--veyro-accent);font-style:normal;font-size:12px;white-space:nowrap}
@media(max-width:1350px){
  .v13-analytics-panel .analytics-kpis{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
  .v13-analytics-panel .analytics-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
}
@media(max-width:820px){
  .v13-analytics-panel .analytics-kpis{grid-template-columns:1fr !important}
  .v13-analytics-panel .analytics-grid{grid-template-columns:1fr !important}
  .v13-card.v13-wide{grid-column:span 1}
  .v13-insights,.v13-lanes{grid-template-columns:1fr}
  .v13-record-row{grid-template-columns:1fr}
}


/* V14 Manual Strava Sync */
.manual-strava-card{
  margin-bottom:12px;
  border:1px solid var(--veyro-accent-line) !important;
  background:linear-gradient(135deg,var(--veyro-accent-soft),#ffffff) !important;
}
.manual-strava-actions{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}
.manual-strava-status{
  border:1px solid var(--line);
  border-radius:12px;
  padding:10px 12px;
  background:var(--veyro-surface-soft);
  color:var(--veyro-text-muted);
  font-weight:700;
  margin-top:10px;
}
.manual-strava-status.loading{
  background:var(--veyro-accent-soft);
  border-color:var(--veyro-accent-line);
  color:var(--veyro-primary-hover);
}
.manual-strava-status.ok{
  background:#dcfce7;
  border-color:#86efac;
  color:#166534;
}
.manual-strava-status.warn{
  background:#fef9c3;
  border-color:#fde68a;
  color:#854d0e;
}
.manual-strava-status.error{
  background:#fee2e2;
  border-color:#fecaca;
  color:#991b1b;
}


/* V15 Friendly analytics colors */
.v13-analytics-panel .analytics-shell{
  background:linear-gradient(180deg,var(--veyro-accent-soft) 0%,#eef5ff 52%,var(--veyro-accent-soft) 100%) !important;
  border:1px solid #d7e7f6 !important;
  color:var(--veyro-navy-deep) !important;
  box-shadow:0 18px 40px rgba(6,26,42,.08) !important;
}
.v13-analytics-panel .analytics-toolbar h3{
  color:#12324a !important;
}
.v13-analytics-panel .analytics-toolbar .hint,
.v13-analytics-panel .analytics-actions label{
  color:#567089 !important;
}
.v13-analytics-panel .analytics-actions select{
  background:#ffffff !important;
  border:1px solid #c9dceb !important;
  color:var(--veyro-navy-deep) !important;
  box-shadow:0 2px 8px rgba(6,26,42,.04);
}
.v13-kpi-hero{
  border:1px solid #b7ddf0 !important;
  background:linear-gradient(135deg,#e0f7ff 0%,#eefdf8 100%) !important;
  box-shadow:0 14px 30px rgba(17,94,89,.08) !important;
}
.v13-kpi-hero span{
  color:#0f6f8d !important;
}
.v13-kpi-hero strong{
  color:#113b57 !important;
}
.v13-kpi-hero small{
  color:#35566f !important;
}
.v13-ring{
  border:1px solid #d7e4ef !important;
  background:linear-gradient(180deg,#ffffff 0%,#f6f9fc 100%) !important;
  box-shadow:0 10px 22px rgba(6,26,42,.05) !important;
}
.v13-ring .track{stroke:#dbe7f1 !important}
.v13-ring .fill{stroke:var(--veyro-accent) !important}
.v13-ring.balance .fill{stroke:#49b88a !important}
.v13-ring.match .fill{stroke:#d7ac3d !important}
.v13-ring.flow .fill{stroke:#6a9fe8 !important}
.v13-ring.momentum .fill{stroke:#df7b98 !important}
.v13-ring-text strong{
  color:var(--veyro-navy-deep) !important;
}
.v13-ring-text span{
  color:#6f89a0 !important;
}
.v13-ring-text small{
  color:#7e94a8 !important;
}
.v13-card{
  border:1px solid var(--veyro-border) !important;
  background:rgba(255,255,255,.92) !important;
  box-shadow:0 12px 26px rgba(6,26,42,.06) !important;
}
.v13-card-title span{
  color:#4d8fb9 !important;
}
.v13-card-title strong{
  color:var(--veyro-navy-deep) !important;
}
.v13-insight{
  background:#f8fbff !important;
  border:1px solid #dbe8f3 !important;
}
.v13-insight strong{color:var(--veyro-navy-deep) !important}
.v13-insight p{color:#4f6981 !important}
.v13-insight.warn{border-color:#eab4c0 !important;background:#fff4f6 !important}
.v13-insight.focus{border-color:#eedaa3 !important;background:#fffaf0 !important}
.v13-insight.good{border-color:#b8e4d0 !important;background:#f1fbf6 !important}
.v13-insight.info{border-color:#bfe0f1 !important;background:#f1f9ff !important}
.v13-heat-labels span,
.v13-card-note,
.v13-lane-grid span,
.v13-lane-grid small,
.v13-record-row span,
.v13-empty,.v13-empty-mini{
  color:#68839b !important;
}
.v13-heat-cell{background:var(--veyro-border) !important}
.v13-heat-cell.level-1{background:#8ecae6 !important}
.v13-heat-cell.level-2{background:#7cd7ad !important}
.v13-heat-cell.level-3{background:#f3d36c !important}
.v13-heat-cell.level-4{background:#ef9ab0 !important}
.v13-lane{
  background:#fbfdff !important;
  border:1px solid var(--veyro-border) !important;
}
.v13-lane-head{color:var(--veyro-navy-deep) !important}
.v13-lane-head span{
  background:#e8f0f7 !important;
  color:var(--veyro-navy-deep) !important;
}
.v13-lane-progress{background:var(--veyro-border) !important}
.v13-lane-progress b{background:var(--veyro-accent) !important}
.v13-lane.v13-bike .v13-lane-progress b{background:#a98ae4 !important}
.v13-lane.v13-run .v13-lane-progress b{background:#57c39a !important}
.v13-lane.v13-strength .v13-lane-progress b{background:#e7c85a !important}
.v13-lane.v13-row .v13-lane-progress b{background:#f0a06e !important}
.v13-lane-grid strong,
.v13-record-row strong,
.v13-bar-row strong{color:var(--veyro-navy-deep) !important}
.v13-bars .v13-bar-row{color:#4f6981 !important}
.v13-bar-row div{background:var(--veyro-border) !important}
.v13-bar-row b{background:var(--veyro-accent) !important}
.v13-bars.distance .v13-bar-row b{background:#57c39a !important}
.v13-spark path{stroke:#46a5d7 !important}
.v13-spark.run path{stroke:#45bf92 !important}
.v13-spark.bike path{stroke:#a388ea !important}
.v13-spark.distance path{stroke:#e6c54f !important}
.v13-record-row em,
.v13-analytics-panel .analytics-svg text{color:#4d8fb9 !important; fill:#5b7893 !important}
.v13-analytics-panel .analytics-svg line{stroke:#d9e6f0 !important}
.v13-analytics-panel .analytics-table-wrap{
  border:1px solid var(--veyro-border) !important;
  background:#fff !important;
}
.v13-analytics-panel .analytics-table-wrap th{
  background:#f5f9fd !important;
  color:var(--veyro-navy-deep) !important;
}
.v13-analytics-panel .analytics-table-wrap td{
  color:#35506a !important;
}

/* FormPilot Fase 1H: abonnementsskærm */
.subscription-badge{display:inline-block;margin-left:10px;padding:3px 10px;border-radius:999px;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;background:rgba(255,255,255,.18);color:#fff;vertical-align:middle}
.subscription-badge.plan-free{background:rgba(255,255,255,.18)}
.subscription-badge.plan-basic{background:#0ea5e9}
.subscription-badge.plan-pro{background:#7c3aed}
.subscription-badge.plan-premium{background:#f59e0b;color:var(--veyro-text)}
.subscription-plan-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:14px 0}
.subscription-plan-card{border:1px solid var(--line);border-radius:14px;padding:14px;background:#fff}
.subscription-plan-card.current{border-color:var(--veyro-primary);box-shadow:0 0 0 2px var(--veyro-accent-line) inset}
.subscription-plan-card h4{margin:0 0 4px;font-size:16px}
.subscription-plan-card .price{font-size:22px;font-weight:800;margin:6px 0}
.subscription-plan-card .price small{font-size:12px;font-weight:600;color:var(--muted)}
.subscription-plan-card button{width:100%;margin-top:10px}
#subscriptionPlansTable td,#subscriptionPlansTable th{text-align:center;white-space:normal}
#subscriptionPlansTable td:first-child,#subscriptionPlansTable th:first-child{text-align:left}
.feature-yes{color:#166534;font-weight:800}
.feature-no{color:#9ca3af}
@media(max-width:900px){.subscription-plan-cards{grid-template-columns:1fr 1fr}}

/* FormPilot: Abonnement 50/50-layout — "Din nuværende pakke" og
   "Sammenlign pakker" i to lige brede, lige høje kolonner. */
.subscription-layout{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:18px;
  align-items:stretch;
}
.subscription-current-card{
  height:100%;
  padding:20px;
  display:flex;
  flex-direction:column;
}
.subscription-current-card h3{
  margin-top:0;
}
#subscriptionCurrentContent{
  display:flex;
  flex-direction:column;
  flex:1;
  min-height:0;
}
.subscription-compare-card{
  min-width:0;
  height:100%;
  display:flex;
  flex-direction:column;
}
.subscription-compare-card .table-wrap{
  overflow-x:auto;
}
#subscriptionPlanButtons{
  flex-wrap:wrap;
}
@media(max-width:900px){
  .subscription-layout{
    grid-template-columns:1fr;
  }
  .subscription-current-card,
  .subscription-compare-card{
    height:auto;
  }
}
/* Større, tydeligere featurefelter i venstre kort (2-kolonne grid i stedet
   for små piller) — inkluderet = svagt grønt, ikke inkluderet = neutral
   grå (aldrig rødt/advarsels-udseende). */
.subscription-feature-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
  margin-top:16px;
  flex:1;
  align-content:center;
}
.subscription-feature-item{
  display:flex;
  align-items:center;
  gap:10px;
  border:1px solid var(--line);
  border-radius:12px;
  padding:12px 14px;
  min-height:64px;
  background:var(--veyro-surface-soft);
}
.subscription-feature-item.yes{
  background:#f0fdf4;
  border-color:#bbf7d0;
}
.subscription-feature-icon{
  display:flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
  width:30px;
  height:30px;
  border-radius:999px;
  font-size:15px;
  font-weight:800;
  background:var(--veyro-border);
  color:var(--veyro-text-muted);
}
.subscription-feature-item.yes .subscription-feature-icon{
  background:#22c55e;
  color:#fff;
}
.subscription-feature-text{
  display:flex;
  flex-direction:column;
  gap:2px;
  min-width:0;
}
.subscription-feature-name{
  font-size:13px;
  font-weight:700;
  color:var(--text);
}
.subscription-feature-status{
  font-size:11px;
  color:var(--muted);
}
.subscription-feature-item.yes .subscription-feature-status{
  color:#166534;
}
@media(max-width:520px){
  .subscription-feature-grid{
    grid-template-columns:1fr;
  }
}

/* FormPilot Fase 2B: "Konto"-kortets faste sektioner (login, cloud-status,
   cloud-handlinger, farlige handlinger) — se renderCloudAccountUI(). */
.cloud-account-sections{
  display:flex;
  flex-direction:column;
  gap:16px;
}
.cloud-section{
  border:1px solid var(--line);
  border-radius:14px;
  padding:14px 16px;
  background:var(--veyro-surface-soft);
}
.cloud-section h4{
  margin:0 0 10px;
  font-size:13px;
  text-transform:uppercase;
  letter-spacing:.05em;
  color:var(--muted);
}
.cloud-section-danger{
  background:#fef2f2;
  border-color:#fecaca;
}
.cloud-account-form{
  display:grid;
  gap:10px;
}
.cloud-status-grid,
.admin-status-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px 16px;
}
.cloud-status-grid div,
.admin-status-grid div{
  display:flex;
  flex-direction:column;
  gap:2px;
  min-width:0;
}
.cloud-status-grid span,
.admin-status-grid span{
  font-size:11px;
  color:var(--muted);
}
.cloud-status-grid strong,
.admin-status-grid strong{
  font-size:13px;
  overflow-wrap:anywhere;
}
.cloud-status-grid strong.mono,
.admin-status-grid strong.mono{
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  font-size:11px;
}
/* FormPilot Fase 2D-2: samme monospace-stil, men uafhængig af en
   .cloud-status-grid/.admin-status-grid-forælder — bruges i løbende tekst
   (fx "Admin setup"-kortets forklaring). */
.mono{
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  font-size:.92em;
}
.cloud-error-text{
  color:#b91c1c;
}
@media(max-width:600px){
  .cloud-status-grid,
  .admin-status-grid{
    grid-template-columns:1fr;
  }
}

/* FormPilot Fase 8A-light: Admin sub-navigation (Oversigt/Beta-ansøgninger/
   Brugere) + "Brugere"-sektionens søg/filter/redigeringspanel. */
.admin-subnav{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin:4px 0 14px;
}
/* Altid blå (samme blå-til-navy-gradient som .app-header/.landing-header)
   med hvid tekst — BÅDE aktiv og inaktiv, så knapperne aldrig bliver
   tomme/utydelige hvide felter. Diagnosticeret (Fase 8A-light-fejlrettelse):
   teksten manglede ALDRIG i DOM'en (renderAdminSubNav() rører kun
   classList, aldrig textContent/innerHTML) — problemet var udelukkende, at
   den globale `button{color:white}` (styles.css øverst) ramte de inaktive
   knapper på en hvid baggrund. `.admin-subnav button`-selectoren + de
   eksplicitte anti-regressions-egenskaber nedenfor (opacity/text-indent/
   overflow/white-space/min-width/min-height) er BEVIDST defensive, så en
   fremtidig, bredere regel andetsteds i filen ikke kan gøre teksten usynlig
   eller klippe den af igen. */
.admin-subnav button,
.admin-subnav .admin-subtab{
  background:linear-gradient(135deg,var(--veyro-navy-deep) 0%,var(--veyro-primary) 100%) !important;
  color:#ffffff !important;
  border:1px solid rgba(255,255,255,.25) !important;
  border-radius:10px;
  padding:9px 16px;
  font-size:13px;
  font-weight:800;
  min-width:120px;
  min-height:38px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  opacity:1 !important;
  text-indent:0 !important;
  overflow:visible;
  white-space:nowrap;
  box-shadow:none;
  transition:filter .15s ease,box-shadow .15s ease;
}
.admin-subnav button.active,
.admin-subnav .admin-subtab.active{
  background:var(--veyro-navy-deep) !important;
  color:#ffffff !important;
  box-shadow:0 8px 18px rgba(6,26,42,.22);
}
.admin-subnav button:hover,
.admin-subnav .admin-subtab:hover{
  filter:brightness(1.08);
  color:#ffffff !important;
}
.admin-filter-row{
  display:flex;
  gap:6px;
  flex-wrap:wrap;
  margin:8px 0;
}
.admin-filter-row .mini.active{
  background:var(--veyro-navy-deep);
  color:#fff;
  border-color:var(--veyro-navy-deep);
}
.admin-user-controls{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin:8px 0;
}
.admin-user-controls input[type="search"]{
  flex:1;
  min-width:200px;
}
.admin-user-edit-panel{
  margin-top:16px;
  padding:14px;
  border:1px solid var(--border,var(--veyro-border));
  border-radius:12px;
  background:var(--veyro-surface-soft);
}
.admin-user-edit-panel h4{
  margin:0 0 10px;
}
.admin-user-edit-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px 14px;
}
.admin-user-edit-grid label,
.admin-user-edit-note{
  display:flex;
  flex-direction:column;
  gap:4px;
  font-size:12px;
  font-weight:700;
  color:var(--muted);
}
.admin-user-edit-note{
  margin-top:10px;
}
.admin-user-edit-note textarea{
  font-family:inherit;
  font-size:13px;
  font-weight:400;
  resize:vertical;
}
@media(max-width:700px){
  .admin-user-edit-grid{
    grid-template-columns:1fr;
  }
}

/* FormPilot Fase 8B: farligt-markeret "slet"-zone i brugerredigerings-
   panelet, samt boksen der viser den kopiér-klare godkendelsesbesked. */
.admin-user-edit-danger-zone{
  margin-top:16px;
  padding-top:14px;
  border-top:1px dashed #fecaca;
}
.admin-user-edit-danger-zone .hint{
  margin-top:6px;
}
.admin-approval-message-box{
  margin-top:16px;
  padding:14px 16px;
  border:1px solid #bbf7d0;
  background:#f0fdf4;
  border-radius:14px;
}
.admin-approval-message-box h4{
  margin:0 0 10px;
}
.admin-approval-message-box textarea{
  width:100%;
  font-family:inherit;
  font-size:13px;
  line-height:1.5;
  resize:vertical;
}

/* FormPilot: Support/FAQ-fane */
.support-layout{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  align-items:center;
  margin:14px 0 6px;
}
.support-search{
  flex:1 1 260px;
  min-width:200px;
}
.support-search input{
  width:100%;
}
.support-category-filter{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  flex:2 1 400px;
}
.support-category-chip{
  background:var(--veyro-surface-soft);
  color:var(--veyro-text-muted);
  border:1px solid var(--line);
  border-radius:999px;
  padding:6px 12px;
  font-size:12px;
  font-weight:600;
  cursor:pointer;
  box-shadow:none;
}
.support-category-chip.active{
  background:var(--blue);
  border-color:var(--blue);
  color:#fff;
}
.faq-list{
  display:flex;
  flex-direction:column;
  gap:10px;
  margin-top:12px;
}
.faq-item{
  border:1px solid var(--line);
  border-radius:14px;
  padding:4px 16px;
  background:#fff;
}
.faq-item summary{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:12px 0;
  cursor:pointer;
  list-style:none;
  font-weight:700;
  color:var(--text);
}
.faq-item summary::-webkit-details-marker{
  display:none;
}
.faq-item summary::after{
  content:'+';
  flex:0 0 auto;
  font-size:18px;
  font-weight:700;
  color:var(--muted);
  transition:transform .15s ease;
}
.faq-item[open] summary::after{
  transform:rotate(45deg);
}
.faq-question{
  flex:1;
  min-width:0;
}
.faq-category-badge{
  flex:0 0 auto;
  font-size:11px;
  font-weight:700;
  padding:3px 10px;
  border-radius:999px;
  background:var(--veyro-accent-soft);
  color:#4338ca;
  white-space:nowrap;
}
.faq-answer{
  padding:0 0 14px;
  border-top:1px solid var(--line);
  margin-top:-1px;
  padding-top:10px;
  color:var(--muted);
  line-height:1.55;
}
.faq-answer p{
  margin:0;
}
.support-contact-card{
  background:var(--veyro-accent-soft);
  border-color:var(--veyro-accent-line);
}
.my-support-ticket-row{
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  padding:8px 10px; border-bottom:1px solid var(--line); font-size:13px;
}
.my-support-ticket-row:last-child{ border-bottom:none; }
.my-support-ticket-row strong{ flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.my-support-ticket-row span{ color:var(--muted); font-size:12px; white-space:nowrap; }
@media(max-width:640px){
  .support-layout{
    flex-direction:column;
    align-items:stretch;
  }
  .support-search{
    min-width:0;
  }
}

/* FormPilot: "Indstillinger" samler nu Min plan og Strava som navngivne
   undersektioner (flyttet fra egne faner). settings-section grupperer hver
   sektions kort visuelt uden at ændre selve kort-stilen. */
.settings-section{
  display:flex;
  flex-direction:column;
  gap:12px;
  margin-top:18px;
  padding-top:16px;
  border-top:2px solid var(--line);
}
.settings-section-label{
  margin:0;
  font-size:13px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.1em;
  color:var(--blue);
}
.plan-update-status-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
  margin-top:10px;
}
.plan-update-status-grid div{
  border:1px solid var(--line);
  border-radius:12px;
  padding:10px 12px;
  background:var(--veyro-surface-soft);
}
.plan-update-status-grid span{
  display:block;
  color:var(--muted);
  font-size:12px;
}
.plan-update-status-grid strong{
  display:block;
  font-size:13px;
  margin-top:3px;
  line-height:1.4;
}
@media(max-width:900px){
  .plan-update-status-grid{
    grid-template-columns:1fr;
  }
}
/* FormPilot Fase 3B: forklarings-/ændringslog-sektionerne i "Tilpas plan"
   -kortet — samme visuelle mønster (kant + luft) som .settings-section. */
.plan-update-explain-section{
  margin-top:16px;
  padding-top:14px;
  border-top:1px solid var(--line);
}
.plan-update-explain-section h4{
  margin:0 0 8px;
  font-size:13px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.06em;
  color:var(--muted);
}
.plan-update-explain-section .hint{
  margin:0;
}
.plan-update-next-steps{
  margin:0;
  padding-left:20px;
  display:flex;
  flex-direction:column;
  gap:6px;
}
.plan-update-next-steps li{
  font-size:13px;
  line-height:1.4;
}
.plan-update-history-item{
  padding:8px 0;
  border-bottom:1px solid var(--line);
  font-size:13px;
  line-height:1.4;
}
.plan-update-history-item:last-child{
  border-bottom:0;
}
.plan-update-history-item .hint{
  margin:2px 0 0;
}
/* Tilpas plan-forklaringer er nu <details>, så de er lukkede som standard
   (kompakt) og kan foldes ud enkeltvis — ingen ny markup i app.js, kun
   <summary> tilføjet omkring de eksisterende h4-overskrifter i index.html. */
.plan-update-explain-section summary{
  cursor:pointer;
  margin:0 0 8px;
  list-style-position:outside;
}
.plan-update-explain-section summary h4{
  display:inline;
  margin:0;
}
.plan-update-explain-section[open]{
  padding-bottom:2px;
}

/* Intelligent Coach Fase 1: "Tilpas dagens træning" — genbruger samme
   card/hint/dialog-actions-stil som resten af appen, ingen nye
   design-tokens. */
.today-workout-list{
  display:flex;
  flex-direction:column;
  gap:8px;
  margin:10px 0;
}
.today-workout-item{
  padding:10px 12px;
  border:1px solid var(--line);
  border-radius:12px;
  background:var(--card);
}
.today-workout-item.today-workout-primary{
  border-color:var(--blue);
}
.today-workout-item p{
  margin:4px 0 0;
}
.today-adjustment-result{
  margin-top:14px;
  padding-top:12px;
  border-top:1px solid var(--line);
}
.today-adjustment-result h4{
  margin:0 0 6px;
  font-size:13px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.06em;
  color:var(--muted);
}
.today-adjustment-options{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
  gap:12px;
  margin:12px 0;
}
.today-adjustment-option-card{
  border:1px solid var(--line);
  border-radius:14px;
  padding:14px;
  background:var(--card);
  display:flex;
  flex-direction:column;
  gap:8px;
}
.today-adjustment-option-card h4{
  margin:0;
}
.today-adjustment-option-card button{
  margin-top:auto;
  align-self:flex-start;
}
.today-adjustment-option-recommended{
  border-color:var(--blue);
  box-shadow:0 0 0 1px var(--blue);
}
.today-adjustment-badge{
  display:inline-block;
  font-size:11px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.04em;
  color:#fff;
  background:var(--blue);
  border-radius:999px;
  padding:2px 8px;
  vertical-align:middle;
}
.today-adjustment-consequence{
  font-weight:700;
  color:var(--text);
}
.today-adjustment-reasons{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:10px;
  margin:12px 0;
}
.today-adjustment-reason-card{
  border:1px solid var(--line);
  border-radius:14px;
  padding:12px;
  background:var(--card);
  display:flex;
  flex-direction:column;
  gap:6px;
}
.today-adjustment-reason-card button{ width:100%; text-align:left; }
.today-adjustment-reason-card p{ margin:0; }
.today-adjustment-safety{
  margin:0 0 12px;
  padding:10px 12px;
  border-radius:12px;
  background:#fef2f2;
  border:1px solid #fecaca;
  color:#991b1b;
  font-size:13px;
}
.pain-details-block{
  margin:2px 0 10px;
  padding:10px 12px;
  border-radius:12px;
  background:#fff7ed;
  border:1px solid #fed7aa;
  display:flex;
  flex-direction:column;
  gap:6px;
}
.pain-details-block label{ margin:0; }
.pain-stopped-check{ display:flex; align-items:center; gap:6px; flex-direction:row !important; }
.pain-stopped-check input{ width:auto; }
.pain-injury-card{
  margin:0 0 14px;
  padding:12px 14px;
  border-radius:12px;
  background:#fff7ed;
  border:1px solid #fed7aa;
}
.pain-injury-card h4{ margin:0 0 6px; font-size:13px; text-transform:uppercase; letter-spacing:.06em; color:#9a3412; }
.pain-injury-card p{ margin:4px 0; }
.pain-injury-note{
  display:inline-block;
  margin-top:4px;
  padding:2px 8px;
  border-radius:999px;
  background:#fff7ed;
  border:1px solid #fed7aa;
  color:#9a3412;
  font-size:11px;
  font-weight:700;
}
.ai-coach-button-block{ margin:2px 0 10px; }
.ai-coach-result-box{
  margin-top:8px;
  padding:10px 12px;
  border-radius:12px;
  background:var(--veyro-accent-soft);
  border:1px solid var(--veyro-accent-line);
}
.ai-coach-result-box h5{ margin:0 0 6px; font-size:13px; text-transform:uppercase; letter-spacing:.05em; color:var(--veyro-primary-hover); }
.ai-coach-result-box .hint{ margin:4px 0; }
.ai-coach-safety{
  padding:6px 8px;
  border-radius:8px;
  background:#fef2f2;
  border:1px solid #fecaca;
  color:#991b1b;
}

/* === Dashboard cockpit (samlet Dashboard, erstatter tidligere Analyse-fane) ===
   #topStats/#sub12Forecast/#disciplineChart forbliver i DOM'et uændret (app.js
   skriver til dem uden guards), men #topStats vises ikke længere — KPI-rækken
   herunder (analyticsKpis) dækker samme "samlet belastning/faktisk tid". */
#topStats{display:none}
.dashboard-cockpit .card{padding:12px}
.dashboard-cockpit > * + *{margin-top:10px}
#analytics > * + *{margin-top:10px}
.dashboard-quad{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px;
  align-items:stretch;
}
.dashboard-quad .card{display:flex;flex-direction:column;gap:6px}
.dashboard-plan-chart canvas{width:100%;height:auto;display:block}
.dashboard-quad-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.dashboard-abc-wrap{max-height:220px}
.dashboard-plan-update .plan-update-status-grid{margin-top:8px}
@media(max-width:1100px){
  .dashboard-quad{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:640px){
  .dashboard-quad{grid-template-columns:1fr}
}
/* Fase 4A: velkomstkort/checkliste på Coach Dashboard (onboarding). */
.onboarding-welcome-card{
  border:1px solid var(--line);
}
.onboarding-checklist{
  list-style:none;
  margin:10px 0;
  padding:0;
  display:flex;
  flex-direction:column;
  gap:6px;
}
.onboarding-step{
  display:flex;
  align-items:center;
  gap:10px;
  padding:8px 10px;
  border-radius:10px;
  background:var(--bg);
  font-size:13px;
}
.onboarding-step-num{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:20px;
  height:20px;
  border-radius:50%;
  background:var(--line);
  font-size:11px;
  font-weight:700;
  flex-shrink:0;
}
.onboarding-step-label{
  flex:1;
}
.onboarding-step-badge{
  font-size:11px;
  font-weight:700;
  padding:2px 8px;
  border-radius:999px;
  background:var(--line);
  color:var(--muted);
  white-space:nowrap;
}
.onboarding-step-completed .onboarding-step-badge{
  background:var(--green);
  color:#166534;
}
.onboarding-step-ready .onboarding-step-badge{
  background:var(--blue2);
  color:var(--veyro-primary);
}
.onboarding-step-completed .onboarding-step-num{
  background:var(--green);
}

/* Fase 7A: kompakt bruger-menu i headerens højre side. Ikke logget ind:
   almindelig sekundær knap ("Log ind"). Logget ind: samme knap viser
   navn/email + "▾" og åbner en lille dropdown. */
.header-account{
  position:relative;
}
.header-account-toggle{
  white-space:nowrap;
}
.header-account-dropdown{
  position:absolute;
  top:calc(100% + 6px);
  right:0;
  z-index:20;
  display:flex;
  flex-direction:column;
  gap:4px;
  min-width:160px;
  background:var(--card);
  border:1px solid var(--line);
  border-radius:12px;
  padding:6px;
  box-shadow:0 12px 28px rgba(6,26,42,.18);
}
.header-account-dropdown button, .header-account-dropdown a{
  background:none;
  color:var(--text);
  box-shadow:none;
  text-align:left;
  padding:8px 10px;
  border-radius:8px;
  font-weight:600;
  text-decoration:none;
  display:block;
}
.header-account-dropdown button:hover, .header-account-dropdown a:hover{
  background:var(--veyro-accent-soft);
}
.header-account-dropdown button:last-child{
  border-top:1px solid var(--line);
  margin-top:2px;
  padding-top:10px;
}
@media(max-width:700px){
  .header-account-dropdown{
    right:0;
    left:auto;
    min-width:180px;
  }
}

/* Fase 7A-2: kundevenlig "Din konto" — kompakte statusrækker i stedet for
   store kort/grids. */
.account-status-rows{
  display:flex;
  flex-direction:column;
  gap:6px;
  margin-bottom:12px;
}
.account-status-rows div{
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  gap:12px;
  padding:8px 10px;
  background:var(--veyro-surface-soft);
  border:1px solid var(--line);
  border-radius:10px;
  font-size:13px;
}
.account-status-rows span{
  color:var(--muted);
  white-space:nowrap;
}
.account-status-rows strong{
  text-align:right;
  font-weight:700;
}
.account-secondary-actions{
  display:flex;
  gap:14px;
  margin-top:2px;
}
.link-btn{
  background:none;
  color:var(--blue);
  box-shadow:none;
  padding:4px 0;
  font-weight:600;
  font-size:12px;
  text-decoration:underline;
}
.account-danger-row{
  margin-top:10px;
  padding-top:10px;
  border-top:1px solid var(--line);
}

/* Fase 7A-2: kompakt teknisk statusgrid til "Avanceret beta-status"
   (owner/admin) — mindre og tættere end .split-grid's store dashboard-
   stat-kort. */
.beta-status-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
  margin:10px 0;
}
.beta-status-grid div{
  background:var(--veyro-surface-soft);
  border:1px solid var(--line);
  border-radius:10px;
  padding:8px 10px;
}
.beta-status-grid span{
  display:block;
  color:var(--muted);
  font-size:11px;
}
.beta-status-grid strong{
  display:block;
  font-size:13px;
  margin-top:2px;
  word-break:break-word;
}
@media(max-width:900px){
  .beta-status-grid{ grid-template-columns:1fr 1fr; }
}
@media(max-width:700px){
  .beta-status-grid{ grid-template-columns:1fr; }
  .account-status-rows div{ flex-direction:column; align-items:flex-start; gap:2px; }
  .account-status-rows strong{ text-align:left; }
}

/* ===== Fase 7A-3: offentlig landingpage + adgangsskærme ================= */

#publicLanding{
  color:var(--text);
  background:var(--bg);
}

/* Fase 7A-3g: public header — forstørret til at matche appens egen
   .app-header i vægt/premium-følelse (samme mørke gradient, større
   logo/tekst, samme 3-farvede accentstribe-farver som .brand-logo-accent
   i selve app-headeren nedenfor). */
.landing-header{
  background:linear-gradient(135deg,var(--veyro-navy-deep),var(--veyro-primary));
  padding:26px 0;
  /* Ret bredde/vandmærke-opgave: headeren er nu et centreret "topkort" i
     samme bredde som resten af landingpagens indhold (1100px, samme
     max-width som .landing-hero/.landing-section > h2 osv.) i stedet for
     fuld browserbredde. overflow:hidden sørger for, at
     .landing-header-accent-stribens hjørner følger de afrundede hjørner
     og aldrig stikker ud over kortets bredde. */
  max-width:1100px;
  margin:24px auto 0;
  border-radius:20px;
  overflow:hidden;
}
.landing-header-inner{
  max-width:1100px;
  margin:0 auto;
  padding:0 24px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  flex-wrap:wrap;
}
.landing-brand{
  display:flex;
  align-items:center;
  gap:16px;
}
.landing-brand img{
  width:auto;
  height:52px;
  aspect-ratio:2048 / 742;
  display:block;
}
.landing-brand > div{
  padding-left:16px;
  border-left:1px solid rgba(255,255,255,.22);
}
.landing-brand-title{
  color:#fff;
  font-weight:800;
  font-size:19px;
  letter-spacing:.02em;
}
.landing-brand-tagline{
  color:var(--veyro-border);
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:.1em;
  margin-top:4px;
}
.landing-tagline-dot{
  color:var(--veyro-accent-line);
  padding:0 1px;
}
.landing-header-actions{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}
.landing-header-actions .secondary{
  background:rgba(255,255,255,.14);
  color:#fff;
}
.landing-header-accent{
  display:block;
  width:100%;
}
.landing-hero{
  position:relative;
  overflow:hidden;
}
.landing-hero-text,
.landing-hero-quote{
  position:relative;
  z-index:1;
}
@media(max-width:700px){
  .landing-header-inner{
    justify-content:center;
    text-align:center;
  }
  .landing-brand{
    flex-direction:column;
    text-align:center;
    gap:8px;
  }
  .landing-header-actions{
    justify-content:center;
    width:100%;
  }
}

/* Hero */
.landing-hero{
  /* Ensret-bredde-opgave: heroen har sin EGEN 24px sidepadding på samme
     element som max-width — uden denne justering ville hero-teksten/
     citatkortet altså rende 24px LÆNGERE INDE end fx headerens kant og
     kort-rækkerne nedenunder (som har padding på en WRAPPER, ikke på
     grid'et selv, og derfor rammer fuld 1100px). +48px (2×24px padding)
     her gør at selve INDHOLDET (grid-kolonnerne) lander på samme 1100px,
     som header/.landing-feature-grid/.landing-package-grid reelt bruger —
     målt direkte i browseren, ikke kun regnet ud. */
  max-width:1148px;
  margin:0 auto;
  padding:56px 24px;
  display:grid;
  grid-template-columns:1.2fr 1fr;
  gap:40px;
  align-items:start;
}
.landing-eyebrow{
  display:inline-block;
  color:var(--blue);
  font-weight:800;
  font-size:12px;
  letter-spacing:.14em;
  text-transform:uppercase;
  margin:0 0 10px;
}
.landing-hero-text h1{
  font-size:38px;
  line-height:1.15;
  margin:0 0 14px;
}
.landing-hero-sub{
  color:var(--muted);
  font-size:16px;
  line-height:1.5;
  margin:0 0 22px;
  max-width:46ch;
}
.landing-hero-ctas{
  display:flex;
  align-items:center;
  gap:18px;
  flex-wrap:wrap;
}
.landing-hero-card{
  background:var(--card);
  border:1px solid var(--line);
  border-radius:18px;
  padding:22px;
  box-shadow:var(--shadow);
}
.landing-hero-card h3{
  margin:0 0 12px;
}

/* Fase 7A-3f: quote-/statement-kort i heroens højre side — strammet
   spacing og en mindre, mere diskret quote-mark end første udgave
   (Fase 7A-3c). Login-formularen bor i #landingLoginDialog nedenfor. */
.landing-hero-quote{
  position:relative;
  background:var(--card);
  border:1px solid var(--line);
  border-radius:16px;
  padding:28px 28px 28px 40px;
  box-shadow:var(--shadow);
  align-self:center;
}
.landing-hero-quote .quote-accent{
  position:absolute;
  left:18px;
  top:26px;
  bottom:26px;
  width:3px;
  border-radius:999px;
  background:linear-gradient(180deg,var(--blue),#f97316);
}
.landing-hero-quote .quote-mark{
  display:block;
  font-size:34px;
  line-height:1;
  color:var(--blue2);
  font-weight:800;
  margin-bottom:2px;
}
.landing-hero-quote p{
  margin:0;
  font-size:19px;
  line-height:1.5;
  color:var(--text);
}
.landing-hero-quote .public-quote-lead{
  font-style:italic;
  white-space:nowrap;
  color:var(--muted);
  margin-bottom:6px;
}
.landing-hero-quote strong{
  color:var(--blue);
}
@media(max-width:600px){
  .landing-hero-quote .public-quote-lead{
    white-space:normal;
  }
}

/* Fase 7A-3c/3f: login- og beta-ansøgnings-formularer som <dialog>
   (samme basis-stil som #editDialog: dialog{border:0;border-radius:18px;
   box-shadow:...;width:min(520px,94vw)} og dialog::backdrop, defineret
   tidligere i denne fil) — her kun det, der er specifikt for disse to. */
#landingLoginDialog,
#betaApplyDialog{
  padding:26px;
  width:min(560px,92vw);
}
#landingLoginDialog .section-head,
#betaApplyDialog .section-head{
  margin-bottom:16px;
  align-items:flex-start;
}
#betaApplyDialog .section-head h3{
  margin:0 0 4px;
}
@media(max-width:600px){
  #landingLoginDialog,
  #betaApplyDialog{
    padding:18px;
  }
}

/* Kort forklaring */
.landing-explain{
  max-width:760px;
  margin:0 auto;
  padding:0 24px 48px;
  text-align:center;
}
.landing-explain p{
  font-size:19px;
  line-height:1.5;
  color:var(--text);
}

/* Fælles sektion-ramme */
.landing-section{
  padding:48px 24px;
}
.landing-section > h2{
  max-width:1100px;
  margin:0 auto 28px;
  font-size:26px;
  text-align:center;
}
.landing-section-sub{
  max-width:1100px;
  margin:-16px auto 24px;
  text-align:center;
  color:var(--muted);
}

/* Feature-kort (lys) */
.landing-feature-grid{
  max-width:1100px;
  margin:0 auto;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;
}
.landing-feature-card{
  background:var(--card);
  border:1px solid var(--line);
  border-radius:16px;
  padding:24px;
  box-shadow:var(--shadow);
}
.landing-feature-icon{
  font-size:26px;
  width:52px;
  height:52px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:14px;
  background:var(--blue2);
  margin-bottom:14px;
}
.landing-feature-card h3{
  margin:0 0 8px;
}
.landing-feature-card p{
  margin:0;
  color:var(--muted);
  font-size:14px;
  line-height:1.5;
}

/* Mørk sektion — samme blå gradient som .landing-header/.app-header,
   i stedet for den tidligere sort/mørk-neutral gradient, så sektionen
   visuelt matcher headeren i stedet for at fremstå som en ren sort blok. */
.landing-section-dark{
  background:linear-gradient(135deg,var(--veyro-navy-deep),var(--veyro-primary));
  color:#fff;
  /* Ret bredde-opgave: samme max-width/centrering/afrunding som
     .landing-header ovenfor, i stedet for fuld browserbredde — så hele
     landingpagen føles som én samlet, centreret side.
     Ensret-bredde-opgave (opfølgning): denne sektion har sin EGEN 24px
     sidepadding (fra .landing-section) på SAMME element som max-width —
     målt direkte i browseren viste det, at kort-rækken indeni derfor kun
     blev 1052px, mens header/.landing-feature-grid/.landing-package-grid
     alle reelt lander på 1100px (padding på en WRAPPER, ikke på grid'et
     selv). +48px (2×24px padding) her gør at kortene indeni denne
     sektion også lander på 1100px, flugtende med kort-rækkerne
     over/under. */
  max-width:1148px;
  margin:40px auto;
  border-radius:20px;
}
.landing-section-dark > h2{
  color:#fff;
}
.landing-feature-card.dark{
  background:var(--veyro-text);
  border-color:var(--veyro-text-muted);
}
.landing-feature-card.dark h3{
  color:#fff;
}
.landing-feature-card.dark p{
  color:var(--veyro-border);
}
.landing-feature-icon.accent-orange{ background:#f97316; }
.landing-feature-icon.accent-green{ background:#22c55e; }
.landing-feature-icon.accent-red{ background:#ef4444; }

/* Pakke-kort */
.landing-package-grid{
  max-width:1100px;
  margin:0 auto;
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:16px;
}
.landing-package-card{
  position:relative;
  background:var(--card);
  border:1px solid var(--line);
  border-radius:16px;
  padding:20px;
  box-shadow:var(--shadow);
}
.landing-package-card.active{
  border-color:var(--blue);
  border-width:2px;
}
.landing-package-card.upcoming{
  opacity:.72;
}
.landing-package-card h3{
  margin:0 0 6px;
}
.landing-package-price{
  color:var(--muted);
  font-size:13px;
  margin:0 0 12px;
}
.landing-package-card ul{
  margin:0 0 14px;
  padding-left:18px;
  font-size:13px;
  color:var(--muted);
}
.landing-package-badge{
  position:absolute;
  top:-11px;
  right:16px;
  background:var(--blue);
  color:#fff;
  font-size:11px;
  font-weight:700;
  padding:4px 10px;
  border-radius:999px;
}

/* Sammenligningstabel */
.landing-table-wrap{
  max-width:900px;
  margin:0 auto;
  overflow-x:auto;
}
.landing-compare-table{
  width:100%;
  border-collapse:collapse;
  background:var(--card);
  border-radius:14px;
  overflow:hidden;
}
.landing-compare-table th,
.landing-compare-table td{
  padding:10px 14px;
  border-bottom:1px solid var(--line);
  text-align:center;
  font-size:13px;
}
.landing-compare-table td:first-child,
.landing-compare-table th:first-child{
  text-align:left;
  color:var(--text);
  font-weight:600;
}
.landing-compare-table thead th{
  background:var(--veyro-surface-soft);
  font-weight:700;
}
/* Fase 7A-3e: fire pakke-kolonner kan blive trange på smalle skærme —
   .landing-table-wrap har allerede overflow-x:auto, denne min-width
   sikrer bare at kolonnerne ikke klemmes urimeligt sammen først. */
.landing-compare-table{
  min-width:560px;
}
.landing-compare-table .landing-compare-highlight{
  background:var(--blue2);
}
.landing-compare-table thead th.landing-compare-highlight{
  background:var(--veyro-accent-line);
  color:var(--blue);
}
.landing-compare-footnote{
  margin-top:16px !important;
  text-align:center;
}

/* CTA-banner */
.landing-cta-banner{
  margin:48px 24px;
  max-width:1100px;
  margin-left:auto;
  margin-right:auto;
  padding:56px 32px;
  border-radius:24px;
  text-align:center;
  color:#fff;
  /* Samme blå brand-gradient som .landing-header/.landing-section-dark
     (var var tidligere en blå-til-orange gradient, der ikke matchede
     resten af siden). max-width/margin ovenfor var allerede korrekte —
     kortet flugtede allerede i bredden med header/hero/pakker. */
  background:linear-gradient(135deg,var(--veyro-navy-deep),var(--veyro-primary));
}
.landing-cta-banner h2{
  margin:0 0 12px;
  font-size:28px;
}
.landing-cta-banner p{
  margin:0 auto 22px;
  max-width:60ch;
  opacity:.95;
}
.landing-cta-actions{
  display:flex;
  justify-content:center;
  gap:14px;
  flex-wrap:wrap;
}
.landing-cta-banner .secondary{
  background:rgba(255,255,255,.15);
  color:#fff;
}
/* Den blå gradient ovenfor gør den almindelige, blå knap-standardfarve
   (var(--blue)) for tæt på baggrunden — hvid knap med blå tekst giver
   markant bedre kontrast/tydelighed for "Kom med i beta" her. */
.landing-cta-banner .primary{
  background:#fff;
  color:var(--veyro-primary);
}
.landing-cta-banner .primary:hover{
  background:var(--veyro-accent-soft);
}

/* Footer */
.landing-footer{
  border-top:1px solid var(--line);
  padding:20px 24px;
}
.landing-footer-inner{
  max-width:1100px;
  margin:0 auto;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
  color:var(--muted);
  font-size:12px;
}
.landing-footer-links{
  display:flex;
  gap:16px;
}
.landing-footer-link-placeholder{
  color:var(--muted);
}
.landing-footer-link{
  color:var(--muted);
  text-decoration:none;
}
.landing-footer-link:hover{
  color:var(--text);
  text-decoration:underline;
}

/* Adgangsskærme (pending/suspended/checking) */
.access-status-screen{
  min-height:70vh;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:24px;
  background:var(--bg);
}
.access-status-card{
  max-width:480px;
  background:var(--card);
  border:1px solid var(--line);
  border-radius:18px;
  padding:28px;
  box-shadow:var(--shadow);
  text-align:center;
}
.access-status-card h2{
  margin:0 0 12px;
}
.access-status-card .dialog-actions{
  justify-content:center;
  margin-top:16px;
}

@media(max-width:900px){
  .landing-hero{ grid-template-columns:1fr; }
  .landing-feature-grid{ grid-template-columns:1fr 1fr; }
  .landing-package-grid{ grid-template-columns:1fr 1fr; }
}
@media(max-width:600px){
  .landing-feature-grid{ grid-template-columns:1fr; }
  .landing-package-grid{ grid-template-columns:1fr; }
  .landing-hero-text h1{ font-size:28px; }
  .landing-header-inner{ padding:0 16px; }
  .landing-hero{ padding:32px 16px; }
  .landing-section{ padding:32px 16px; }
}

/* FormPilot Fase 9B: juridiske sider (Privatlivspolitik/Cookiepolitik/
   Beta-vilkår/Forretningsbetingelser/DPA/Kontakt) — genbruger BEVIDST
   .landing-header/.landing-header-inner/.landing-brand/
   .landing-header-accent/.landing-footer* uændret (se legal/*.html), så
   siderne visuelt matcher den offentlige landingpage 1:1. Denne blok
   tilføjer KUN det, der er specifikt for selve dokumentindholdet (ren
   tekstlayout, ingen app-dashboard-elementer). */
.legal-shell{
  max-width:820px;
  margin:0 auto;
  padding:40px 24px 64px;
}
.legal-back-link{
  display:inline-flex;
  align-items:center;
  gap:6px;
  color:var(--blue);
  text-decoration:none;
  font-weight:700;
  font-size:13px;
  margin-bottom:20px;
}
.legal-back-link:hover{ text-decoration:underline; }
.legal-doc-header h1{
  margin:0 0 6px;
  font-size:28px;
}
.legal-doc-meta{
  color:var(--muted);
  font-size:13px;
  margin:0 0 20px;
}
.legal-draft-notice{
  background:var(--yellow);
  border:1px solid #fde68a;
  border-radius:14px;
  padding:14px 16px;
  font-size:13.5px;
  line-height:1.5;
  margin-bottom:28px;
}
.legal-draft-notice strong{ display:block; margin-bottom:2px; }
.legal-org-box{
  background:var(--card);
  border:1px solid var(--line);
  border-radius:14px;
  padding:16px 18px;
  margin:18px 0 28px;
  box-shadow:var(--shadow);
}
.legal-org-box h3{ margin:0 0 10px; font-size:15px; }
.legal-org-box dl{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px 20px;
  margin:0;
}
.legal-org-box div{ display:flex; flex-direction:column; gap:2px; min-width:0; }
.legal-org-box dt{ font-size:11px; color:var(--muted); text-transform:uppercase; letter-spacing:.06em; }
.legal-org-box dd{ margin:0; font-size:13.5px; overflow-wrap:anywhere; }
.legal-nav{
  display:flex;
  flex-wrap:wrap;
  gap:8px 16px;
  padding:14px 16px;
  background:var(--card);
  border:1px solid var(--line);
  border-radius:14px;
  margin-bottom:28px;
  font-size:13px;
}
.legal-nav a{ color:var(--blue); text-decoration:none; font-weight:700; }
.legal-nav a:hover{ text-decoration:underline; }
.legal-nav a.current{ color:var(--text); pointer-events:none; text-decoration:underline; }
.legal-content h2{
  font-size:19px;
  margin:32px 0 10px;
  padding-top:8px;
  border-top:1px solid var(--line);
}
.legal-content h2:first-child{ border-top:0; padding-top:0; margin-top:0; }
.legal-content h3{ font-size:15px; margin:18px 0 8px; }
.legal-content p{ line-height:1.6; margin:0 0 12px; }
.legal-content ul,.legal-content ol{ line-height:1.6; margin:0 0 14px; padding-left:22px; }
.legal-content li{ margin-bottom:4px; }
.legal-content .legal-table-wrap{ overflow-x:auto; margin:0 0 16px; }
.legal-content table{ width:100%; border-collapse:collapse; margin:0; font-size:13.5px; }
/* Basis-CSS'et sætter en global `th,td{white-space:nowrap}`-regel til
   appens data-tabeller — den skal EKSPLICIT tilbagestilles her, ellers
   tvinger den lange tekstceller (fx Bilag 1's "Typer af
   personoplysninger") til ikke at ombryde, hvilket presser hele siden ud i
   vandret scroll. */
.legal-content th,.legal-content td{ text-align:left; padding:8px 10px; border:1px solid var(--line); vertical-align:top; white-space:normal; }
.legal-content th{ background:var(--veyro-surface-soft); }
.legal-content .legal-mono{ font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:.92em; }
.legal-content a{ color:var(--blue); }
.legal-footer-note{
  margin-top:36px;
  padding-top:18px;
  border-top:1px solid var(--line);
  color:var(--muted);
  font-size:12.5px;
  line-height:1.5;
}
@media(max-width:600px){
  .legal-shell{ padding:28px 16px 48px; }
  .legal-org-box dl{ grid-template-columns:1fr; }
}

/* === Tracker V1: mobilvenlig start/pause/stop-aktivitetstracker ==========
   Store, touch-venlige kort/knapper, høj kontrast, 2 kolonner på bred
   skærm (tablet/desktop), 1 kolonne på mobil. Se #tracker i index.html og
   bindTrackerControls() m.fl. i app.js. */
.tracker-card{ max-width:640px; margin:0 auto; }
.tracker-card h3{ margin:0 0 4px; font-size:22px; }
.tracker-activity-select{ display:flex; flex-wrap:wrap; gap:8px; margin:14px 0; }
.tracker-activity-btn{
  flex:1 1 auto; min-width:84px; background:var(--veyro-accent-soft); color:var(--veyro-text); box-shadow:none;
  border:2px solid transparent; border-radius:14px; padding:10px 12px; font-weight:700; font-size:14px;
}
.tracker-activity-btn.active{ background:var(--veyro-accent-soft); border-color:var(--veyro-primary); color:var(--veyro-primary); }
.tracker-activity-btn:disabled{ opacity:.55; cursor:not-allowed; }
/* Planlagt-pas-kobling: "Dagens planlagte ..."-boksen — se
   renderTrackerPlannedMatch() i app.js. Grøn/venlig, ikke en advarsel. */
.tracker-planned-match{
  background:#f0fdf4; border:1px solid #86efac; border-radius:14px;
  padding:12px 14px; margin:0 0 14px;
}
.tracker-planned-match strong{ display:block; font-size:14px; color:#166534; margin-bottom:2px; }
.tracker-planned-match p{ margin:4px 0 0; font-size:13px; color:#166534; }
.tracker-planned-match p.hint{ color:#15803d; opacity:.85; }
.tracker-stats-grid{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin:14px 0; }
.tracker-stat{
  background:var(--veyro-surface-soft); border:1px solid var(--line); border-radius:16px; padding:14px;
  display:flex; flex-direction:column; gap:4px; align-items:flex-start;
}
.tracker-stat span{ color:var(--muted); font-size:12px; text-transform:uppercase; letter-spacing:.06em; font-weight:700; }
.tracker-stat strong{ font-size:clamp(18px, 5.5vw, 26px); line-height:1.1; color:var(--veyro-text); font-variant-numeric:tabular-nums; }
.tracker-stat-primary{ grid-column:1 / -1; background:var(--veyro-navy-deep); border-color:var(--veyro-navy-deep); }
.tracker-stat-primary span{ color:var(--veyro-accent-line); }
.tracker-stat-primary strong{ color:#fff; font-size:clamp(30px, 9vw, 44px); }
.tracker-stat-na strong{ color:var(--muted); font-size:clamp(14px, 4vw, 18px); }
.tracker-stat-na small{ color:var(--muted); font-size:11px; }
#trackerGpsStatus{ text-align:center; margin:0 0 14px; }
.tracker-controls{ display:flex; flex-wrap:wrap; gap:10px; justify-content:center; margin-top:6px; }
.tracker-btn{
  flex:1 1 140px; min-height:56px; border-radius:16px; font-size:18px; font-weight:800;
  box-shadow:0 8px 20px rgba(6,26,42,.12);
}
.tracker-btn-start{ background:var(--veyro-primary); color:#fff; }
.tracker-btn-pause{ background:#f59e0b; color:var(--veyro-text); }
.tracker-btn-resume{ background:#22c55e; color:#fff; }
.tracker-btn-stop{ background:#dc2626; color:#fff; }
.tracker-btn-discard{ background:#fee2e2; color:#991b1b; box-shadow:none; }
.tracker-summary{ margin-top:18px; padding-top:16px; border-top:1px solid var(--line); }
.tracker-summary h4{ margin:0 0 10px; text-align:center; }
.tracker-summary-grid{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin-bottom:14px; }
.tracker-summary-grid div{ background:var(--veyro-surface-soft); border:1px solid var(--line); border-radius:14px; padding:10px 12px; }
.tracker-summary-grid span{ display:block; color:var(--muted); font-size:11px; text-transform:uppercase; letter-spacing:.05em; }
.tracker-summary-grid strong{ display:block; font-size:clamp(14px, 4vw, 18px); margin-top:2px; }
@media(max-width:640px){
  .tracker-stats-grid{ grid-template-columns:1fr; }
  .tracker-stat-primary strong{ font-size:38px; }
  .tracker-btn{ flex:1 1 100%; }
  .tracker-summary-grid{ grid-template-columns:1fr; }
}

/* === Tracker PWA v2: app-agtig startskærm + swipe-paneler =================
   Se README_APP_CONFIG.md "Tracker PWA — app-oplevelse". Ingen tungt
   framework — swipe er ren CSS scroll-snap + en lille scroll-lytter i
   tracker-app.js (renderPanelDots()/highlightActiveDot()). Header/email/
   "Log ud"/installations-tip er flyttet fra hovedskærmen ind i
   Indstillinger (.tracker-settings-*), så første skærm efter login er ren:
   titel, aktivitetsvalg, evt. dagens plan-match, og swipe-panelerne. */
.tracker-app-shell{
  max-width:640px; margin:0 auto; min-height:100vh; min-height:100dvh;
  padding:calc(14px + env(safe-area-inset-top)) 14px 14px;
  overflow-x:hidden; display:flex; flex-direction:column;
}
/* #trackerMainApp er selve app-indholdet omkring #trackerActionBar —
   flex:1 sørger for at handlingsbaren altid sidder nederst i shell'en
   (margin-top:auto på baren selv), også når indholdet er kortere end
   skærmen. Login-/afventer-skærmene (uden handlingsbar) er upåvirkede. */
#trackerMainApp{ display:flex; flex-direction:column; flex:1; min-height:0; }
.tracker-login-screen{ max-width:420px; margin:8vh auto 0; text-align:center; }
.tracker-login-brand{ display:flex; flex-direction:column; align-items:center; gap:6px; margin-bottom:18px; }
/* Logoet har Veyros mørke baggrund indbygget og får derfor en navy plade. */
.tracker-login-brand img{ width:auto; height:56px; aspect-ratio:2048 / 742; padding:6px 12px; border-radius:10px; background:var(--veyro-navy); }
.tracker-login-brand strong{ font-size:15px; color:var(--muted); font-weight:700; }
.tracker-login-screen h1, .tracker-login-screen h3{ margin:0 0 6px; }
.tracker-login-screen .cloud-account-form{ text-align:left; }

.tracker-home-topbar{ display:flex; align-items:center; justify-content:space-between; margin-bottom:2px; }
.tracker-home-topbar h1{ font-size:22px; margin:0; }
.tracker-home-subtitle{ margin:2px 0 14px; color:var(--muted); font-size:13.5px; }
.tracker-icon-btn{
  width:40px; height:40px; border-radius:50%; background:var(--veyro-accent-soft); color:var(--veyro-text);
  box-shadow:none; font-size:18px; display:flex; align-items:center; justify-content:center; padding:0;
}

.tracker-planned-match-compact{
  background:#f0fdf4; border:1px solid #86efac; border-radius:12px;
  padding:8px 12px; margin:0 0 12px; font-size:12.5px; color:#166534;
}
.tracker-planned-match-compact strong{ display:block; font-size:13px; }
.tracker-planned-match-compact p{ margin:2px 0 0; opacity:.9; }

.tracker-time-hero{
  background:var(--veyro-navy-deep); border:1px solid var(--veyro-navy-deep); border-radius:16px; padding:14px 16px;
  display:flex; flex-direction:column; gap:4px; align-items:flex-start; margin-bottom:10px;
}
.tracker-time-hero span{ color:var(--veyro-accent-line); font-size:12px; text-transform:uppercase; letter-spacing:.06em; font-weight:700; }
.tracker-time-hero strong{ color:#fff; font-size:clamp(34px, 11vw, 48px); line-height:1.05; font-variant-numeric:tabular-nums; }

.tracker-panels-wrap{ position:relative; margin-top:4px; }
.tracker-panels{
  display:flex; overflow-x:auto; scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
}
.tracker-panels::-webkit-scrollbar{ display:none; }
.tracker-panel{
  flex:0 0 100%; scroll-snap-align:start; min-width:0; box-sizing:border-box;
  background:var(--card); border:1px solid var(--line); border-radius:16px; padding:14px;
}
.tracker-panel h3{ margin:0 0 4px; font-size:16px; }
.tracker-panel-nav-btn{
  position:absolute; top:50%; transform:translateY(-50%); width:34px; height:34px; border-radius:50%;
  background:rgba(6,26,42,.55); color:#fff; box-shadow:none; font-size:16px; display:flex;
  align-items:center; justify-content:center; padding:0; z-index:2; border:none;
}
.tracker-panel-nav-btn.prev{ left:-4px; }
.tracker-panel-nav-btn.next{ right:-4px; }
@media(hover:none){ .tracker-panel-nav-btn{ display:none; } }
.tracker-panel-dots{ display:flex; justify-content:center; gap:6px; margin:10px 0 2px; }
.tracker-panel-dot{
  width:7px; height:7px; border-radius:50%; background:var(--line); box-shadow:none; padding:0; border:none;
  transition:width .15s, background .15s;
}
.tracker-panel-dot.active{ background:var(--veyro-primary); width:18px; border-radius:5px; }

/* Handlingsbar (Opgave 6, mobiltilpasning): ÉN samlet Start/Pause/
   Fortsæt/Stop/Gem/Kassér-bar, sticky nederst — margin-top:auto skubber
   den til bunden af #trackerMainApp (flex:1) selv når indholdet er kort,
   position:sticky holder den ved skærmens bund, når indholdet scroller.
   Respekterer safe-area-inset-bottom, så den aldrig ligger under iPhones
   hjemme-indikator. */
.tracker-action-bar{
  display:flex; flex-wrap:wrap; gap:8px; justify-content:center;
  margin-top:auto; padding:12px 0 calc(10px + env(safe-area-inset-bottom));
  position:sticky; bottom:0; background:var(--bg);
  border-top:1px solid var(--line); box-shadow:0 -6px 16px rgba(6,26,42,.06);
}
.tracker-action-bar .tracker-btn{ flex:1 1 120px; min-height:52px; font-size:16px; }
@media(max-width:420px){ .tracker-action-bar .tracker-btn{ flex:1 1 45%; } }
/* På mobil skal Start/Pause/Stop være synlige MED DET SAMME, uden nogen
   scroll — position:sticky (ovenfor) løser først det, EFTER brugeren har
   scrollet forbi barens naturlige plads i indholdet, så på højt indhold
   (fx alle valgfrie datafelter slået til i Indstillinger) ville baren
   ikke være synlig ved første visning. En ægte position:fixed-bundbar på
   ≤640px (typiske telefonbredder) garanterer den altid er synlig —
   #trackerMainApp får tilsvarende bundmargin, så sidste panel/dots aldrig
   gemmes bag baren. */
@media(max-width:640px){
  .tracker-action-bar{
    position:fixed; left:0; right:0; bottom:0; margin-top:0; z-index:40;
    padding-left:calc(14px + env(safe-area-inset-left));
    padding-right:calc(14px + env(safe-area-inset-right));
  }
  #trackerMainApp{ padding-bottom:calc(84px + env(safe-area-inset-bottom)); }
}

.tracker-hr-zone-row{
  display:flex; justify-content:space-between; background:var(--veyro-surface-soft); border:1px solid var(--line);
  border-radius:10px; padding:8px 12px; margin-bottom:6px; font-size:13px;
}
.tracker-hr-zone-row span{ color:var(--muted); font-weight:700; }

.tracker-summary-idle-hint{ text-align:center; padding:24px 10px; color:var(--muted); }

.tracker-settings-overlay{
  position:fixed; inset:0; background:rgba(6,26,42,.5); z-index:60;
  display:flex; align-items:flex-end; justify-content:center;
}
.tracker-settings-panel{
  background:var(--card); width:100%; max-width:640px; border-radius:20px 20px 0 0;
  max-height:88vh; overflow-y:auto; padding:16px 18px calc(18px + env(safe-area-inset-bottom));
}
.tracker-settings-head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:8px; }
.tracker-settings-head h3{ margin:0; }
.tracker-settings-body h4{ margin:18px 0 8px; font-size:13px; text-transform:uppercase; letter-spacing:.05em; color:var(--muted); }
.tracker-settings-body h4:first-child{ margin-top:4px; }
.tracker-settings-checklist{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.tracker-settings-check{
  display:flex; align-items:center; gap:8px; background:var(--veyro-surface-soft); border:1px solid var(--line);
  border-radius:10px; padding:9px 10px; font-size:13.5px; font-weight:600;
}
.tracker-settings-check input{ width:16px; height:16px; }
.tracker-settings-check-locked{ opacity:.65; }
.tracker-settings-actions{ display:flex; flex-wrap:wrap; gap:8px; margin-top:6px; }
.tracker-settings-actions a, .tracker-settings-actions button{ flex:1 1 160px; text-align:center; }
@media(max-width:420px){
  .tracker-settings-checklist{ grid-template-columns:1fr; }
}


/* FormPilot-tema = Veyro Systems. Kun præsentation: layout, statussemantik
   og applikationsflow er uændret. --fp-*-navnene bruges overalt i shellen
   og er aliaser for --veyro-*-tokens øverst i filen. */
:root {
  --fp-canvas: var(--veyro-bg);
  --fp-surface: var(--veyro-surface);
  --fp-surface-soft: var(--veyro-surface-soft);
  --fp-forest: var(--veyro-primary);
  --fp-forest-dark: var(--veyro-navy-deep);
  --fp-ink: var(--veyro-text);
  --fp-muted: var(--veyro-text-muted);
  --fp-line: var(--veyro-border);
  --fp-mint: var(--veyro-accent-soft);
  --fp-mint-line: var(--veyro-accent-line);
  --fp-orange: var(--veyro-primary);
  --fp-orange-hover: var(--veyro-primary-hover);
  --fp-apricot: var(--veyro-warning-soft);
  /* Sportsfarver er datakategorier, ikke branding. */
  --fp-swim: #087f91;
  --fp-swim-soft: #dff6f8;
  --fp-bike: #916500;
  --fp-bike-soft: #fff3cd;
  --fp-run: #b64418;
  --fp-run-soft: #ffebdf;
  --border: var(--veyro-border);
  --green: var(--veyro-success-soft);
}
body { background:var(--fp-canvas); color:var(--fp-ink); }
a { color:var(--fp-forest); }
button, .button-like { background:var(--veyro-primary); color:#fff; box-shadow:none; }
button.secondary, .file-btn {
  background:var(--veyro-surface); color:var(--veyro-text); border-color:var(--veyro-border-strong); box-shadow:none;
}
button.primary, .landing-cta-banner .primary,
.tracker-btn-start, .tracker-btn-resume,
.ai-suggestion-apply-btn, #aiSuggestionConfirmBtn {
  background:var(--fp-orange); color:#fff;
}
@media (hover:hover) {
  button.primary:hover, .button-like:hover, .landing-cta-banner .primary:hover,
  .tracker-btn-start:hover, .tracker-btn-resume:hover,
  .ai-suggestion-apply-btn:hover, #aiSuggestionConfirmBtn:hover {
    background:var(--fp-orange-hover); color:#fff;
  }
  button.secondary:hover, .file-btn:hover { background:var(--veyro-accent-soft); border-color:var(--veyro-accent-line); }
}
:where(button,a,input,select,textarea,summary,[tabindex]):focus-visible {
  outline:2px solid var(--veyro-accent); outline-offset:2px;
}
input, select, textarea { accent-color:var(--fp-forest); }
button:disabled { cursor:not-allowed; }
dialog { background:var(--fp-surface); color:var(--fp-ink); }
dialog::backdrop { background:rgba(3,19,31,.45); }
.app-header, .landing-header, .landing-section-dark, .landing-cta-banner {
  background:var(--veyro-navy); color:#fff;
}
.app-header .subtitle, .landing-brand-tagline,
.landing-tagline-dot { color:var(--veyro-on-navy-muted); }
.app-header button.secondary, .landing-header-actions .secondary,
.landing-cta-banner .secondary {
  background:rgba(255,255,255,.08); color:#fff; border-color:rgba(255,255,255,.18);
}
.app-header :focus-visible, .landing-header :focus-visible,
.landing-section-dark :focus-visible, .landing-cta-banner :focus-visible {
  outline-color:#fff;
}
.tabs .tab { background:var(--fp-surface-soft); color:var(--fp-forest); box-shadow:none; }
.tabs .tab.active { background:var(--fp-forest); color:#fff; }
@media (hover:hover) {
  .tabs .tab:hover { background:var(--fp-mint); color:var(--fp-forest-dark); }
  .tabs .tab.active:hover { background:var(--fp-forest-dark); color:#fff; }
}
/* These components predate theme tokens and have explicit priority rules. */
.admin-subnav button, .admin-subnav .admin-subtab {
  background:var(--fp-forest) !important; color:#fff !important;
}
.admin-subnav button.active, .admin-subnav .admin-subtab.active {
  background:var(--fp-forest-dark) !important;
  box-shadow:none;
}
.admin-filter-row .mini.active { background:var(--fp-forest); color:#fff; }
.landing-feature-card.dark { background:var(--veyro-navy-deep); border-color:var(--veyro-on-navy-line); }
.landing-feature-card.dark p { color:var(--veyro-on-navy-muted); }
.landing-hero-quote { background:var(--fp-mint); border-color:var(--fp-mint-line); }
.landing-hero-quote .quote-accent { background:var(--veyro-accent); }
.landing-feature-icon { background:var(--fp-mint); color:var(--fp-forest); }
.landing-feature-icon.accent-orange { background:var(--fp-apricot); color:var(--fp-run); }
.landing-feature-icon.accent-green { background:var(--fp-mint); color:var(--fp-forest); }
.landing-feature-icon.accent-red { background:var(--fp-swim-soft); color:var(--fp-swim); }
.landing-compare-table thead th,
.landing-compare-table thead th.landing-compare-highlight {
  background:var(--fp-mint); color:var(--fp-forest);
}
.landing-package-card.active { border-color:var(--fp-forest); }
.landing-package-badge, .beta-welcome-badge { background:var(--fp-forest); }
.landing-package-card.upcoming { opacity:1; }
/* Den trefarvede FormPilot Coach-stribe udgår; headeren afsluttes af én Veyro-linje. */
.landing-header-accent { height:2px; background:var(--veyro-accent); }
.landing-header-accent span { display:none; }
th, .calendar-weekdays div, .legal-content th,
.analytics-table-wrap th { background:var(--fp-surface-soft); color:var(--fp-ink); }
tbody tr:hover { outline-color:var(--fp-mint-line); }
.calendar-day.calendar-today { box-shadow:inset 0 0 0 2px var(--fp-orange); }
.calendar-day.other-month { background:var(--fp-surface-soft); }
.calendar-empty-state, .analytics-empty, .beta-welcome-card,
.weight-stat, .advice-box:not(.ok):not(.warn):not(.danger),
.activity-stat, .activity-side-empty, .activity-map-empty,
.garmin-step, .garmin-manual-box, .goal-popup-split,
.admin-user-edit-panel, .tracker-summary-grid div,
.tracker-hr-zone-row, .tracker-settings-check, .tracker-stat,
.fit-result { background:var(--fp-surface-soft); }
.goal-card.primary, .sub12-card, .goal-help-box,
.today-workout-item.today-workout-primary, .coach-comment,
.ai-coach-result-box, .today-adjustment-option-recommended {
  background:var(--fp-mint); border-color:var(--fp-mint-line);
}
.goal-help-box, .ai-coach-result-box h5, .goal-forecast strong,
.goal-card.primary .goal-forecast strong, .goal-popup-main strong,
.sub12-header strong, .garmin-step span, .goal-popup-split span {
  color:var(--fp-forest);
}
.today-adjustment-option-recommended { box-shadow:0 0 0 1px var(--fp-forest); }
.ai-coach-result-box { color:var(--fp-ink); }
.ai-coach-controlled-note { color:var(--fp-forest); }
.progress-bar { background:var(--fp-forest); }
.goal-status.På-vej { background:var(--fp-mint); color:var(--fp-forest); }
.mini-btn.garmin-workout-btn, .tech-item a {
  background:var(--fp-mint); border-color:var(--fp-mint-line); color:var(--fp-forest);
}
.activity-row-selected {
  background:var(--fp-mint) !important; box-shadow:inset 4px 0 0 var(--fp-forest);
}
.manual-strava-card {
  background:var(--fp-surface) !important; border-color:var(--fp-line) !important;
}
.manual-strava-status.loading { background:var(--fp-mint); border-color:var(--fp-mint-line); color:var(--fp-forest); }
.strava-log-box { background:var(--veyro-navy); color:var(--veyro-on-navy-soft); }
/* Sport labels retain their text; status colors remain independent of sport. */
.badge.Svøm, .print-Svøm { background:var(--fp-swim-soft); color:var(--fp-swim); }
.badge.Cykling, .print-Cykling { background:var(--fp-bike-soft); color:var(--fp-bike); }
.badge.Løb, .print-Løb { background:var(--fp-run-soft); color:var(--fp-run); }
/* Analytics has a historical !important palette, overridden only for presentation. */
.v13-analytics-panel .analytics-shell {
  background:var(--fp-canvas) !important; color:var(--fp-ink) !important;
  border-color:var(--fp-line) !important; box-shadow:var(--shadow) !important;
}
.v13-analytics-panel .analytics-toolbar h3,
.v13-card-title strong, .v13-kpi-hero strong, .v13-ring-text strong,
.v13-insight strong, .v13-lane-head, .v13-lane-grid strong,
.v13-record-row strong, .v13-bar-row strong { color:var(--fp-ink) !important; }
.v13-analytics-panel .analytics-toolbar .hint,
.v13-analytics-panel .analytics-actions label,
.v13-ring-text span, .v13-ring-text small, .v13-kpi-hero small,
.v13-insight p, .v13-card-note, .v13-heat-labels span,
.v13-lane-grid span, .v13-lane-grid small, .v13-record-row span,
.v13-empty, .v13-empty-mini, .v13-bars .v13-bar-row { color:var(--fp-muted) !important; }
.v13-analytics-panel .analytics-actions select,
.v13-ring, .v13-card, .v13-lane {
  background:var(--fp-surface) !important; border-color:var(--fp-line) !important;
}
.v13-kpi-hero, .v13-insight.good, .v13-insight.info {
  background:var(--fp-mint) !important; border-color:var(--fp-mint-line) !important;
}
.v13-kpi-hero span, .v13-card-title span { color:var(--fp-forest) !important; }
.v13-lane-head span, .v13-lane-progress, .v13-bar-row div {
  background:var(--fp-surface-soft) !important; color:var(--fp-ink) !important;
}
.v13-ring .track { stroke:var(--fp-line) !important; }
.v13-ring .fill, .v13-ring.flow .fill { stroke:var(--fp-forest) !important; }
.v13-lane-progress b, .v13-bar-row b { background:var(--fp-swim) !important; }
.v13-lane.v13-bike .v13-lane-progress b { background:var(--fp-bike) !important; }
.v13-lane.v13-run .v13-lane-progress b, .v13-bars.distance .v13-bar-row b {
  background:var(--fp-run) !important;
}
.ana-swim { fill:var(--fp-swim) !important; background:var(--fp-swim) !important; }
.ana-bike { fill:var(--fp-bike) !important; background:var(--fp-bike) !important; }
.ana-run { fill:var(--fp-run) !important; background:var(--fp-run) !important; }
.v13-spark path { stroke:var(--fp-swim) !important; }
.v13-spark.run path { stroke:var(--fp-run) !important; }
.v13-spark.bike path { stroke:var(--fp-bike) !important; }
.v13-analytics-panel .analytics-svg text { fill:var(--fp-muted) !important; }
.v13-analytics-panel .analytics-svg line { stroke:var(--fp-line) !important; }
.v13-analytics-panel .analytics-table-wrap th { background:var(--fp-surface-soft) !important; }
/* Tracker shares the theme; pause/stop/discard remain semantically distinct. */
.tracker-time-hero, .tracker-stat-primary {
  background:var(--fp-forest); border-color:var(--fp-forest);
}
.tracker-time-hero span, .tracker-stat-primary span { color:var(--veyro-on-navy-muted); }
.tracker-icon-btn, .tracker-activity-btn { background:var(--fp-surface-soft); color:var(--fp-forest); }
.tracker-activity-btn.active {
  background:var(--fp-mint); color:var(--fp-forest-dark); border-color:var(--fp-forest);
}
.tracker-panel-dot { background:var(--fp-line); box-shadow:none; }
.tracker-panel-dot.active { background:var(--fp-forest); }
.tracker-panel-nav-btn { background:var(--fp-forest); color:#fff; }
.tracker-action-bar { background:var(--fp-canvas); }
.tracker-btn-pause { background:#f5d374; color:#493300; }
.tracker-btn-stop { background:#b91c1c; color:#fff; }
.tracker-btn-discard { background:var(--veyro-danger-soft); color:var(--veyro-danger-text); }
.tracker-settings-overlay { background:rgba(3,19,31,.45); }
@media print {
  body { background:#fff; color:#000; }
  .print-week-sheet { background:#fff; color:#000; }
}

/* Let mobile content shrink; wide data tables scroll inside their own cards. */
.landing-footer-links { flex-wrap:wrap; }
.dashboard-quad > .card, .coach-form, .coach-form label { min-width:0; }
.coach-form input { min-width:0; max-width:100%; }
@media (max-width:700px) {
  .dashboard-quad { grid-template-columns:minmax(0,1fr); }
}

/* Design stage 1: five destinations and a read-only daily overview. */
.fp-main-nav { display:flex; gap:6px; padding:8px; background:var(--veyro-navy); border-radius:16px; margin:8px 0 16px; }
.fp-main-nav button { flex:1; display:flex; align-items:center; justify-content:center; gap:9px; min-height:46px; background:transparent; color:var(--veyro-on-navy-soft); border:0; box-shadow:none; }
.fp-main-nav button span { font-size:21px; line-height:1; }
.fp-main-nav button[aria-current="page"] { background:var(--veyro-nav-active); color:#fff; box-shadow:inset 0 -2px 0 var(--veyro-accent); }
.fp-main-nav button:focus-visible { outline-color:#fff; }
.fp-main-nav button[aria-current="page"]:focus-visible { outline-color:var(--veyro-accent); }
.fp-secondary-nav { max-width:100%; margin:0 0 18px; padding:8px; box-shadow:none; }
.fp-secondary-nav[hidden], .fp-secondary-nav .tab[hidden] { display:none !important; }
.fp-page-heading { margin:12px 0 22px; }
.fp-page-heading h2 { font-size:clamp(25px,3vw,36px); letter-spacing:-.035em; line-height:1.15; margin:5px 0 10px; }
.fp-eyebrow { font-size:11px; font-weight:800; color:var(--fp-forest); letter-spacing:.09em; text-transform:uppercase; margin:0 0 10px; }
.fp-overview-hero { display:grid; grid-template-columns:minmax(0,1.65fr) minmax(0,1fr); gap:20px; align-items:start; }
.fp-today-card, .fp-coach-summary, .fp-week-card, .fp-summary-card, .fp-shortcut {
  padding:var(--veyro-card-pad); border:1px solid var(--fp-line); border-radius:var(--veyro-card-radius); background:var(--veyro-surface); box-shadow:var(--shadow); min-width:0;
}
.fp-today-card h3 { font-size:clamp(27px,3.2vw,42px); letter-spacing:-.035em; line-height:1.13; margin:12px 0; overflow-wrap:anywhere; }
.fp-today-card h4 { font-size:21px; margin:10px 0; overflow-wrap:anywhere; }
.fp-today-workout + .fp-today-workout { margin-top:22px; padding-top:20px; border-top:1px solid var(--fp-line); }
.fp-workout-meta { font-size:16px; line-height:1.5; overflow-wrap:anywhere; }
.fp-workout-status { display:block; font-size:12px; color:var(--fp-muted); margin:0 0 14px; }
.fp-sport-label { display:inline-block; background:var(--sport-soft,var(--fp-surface-soft)); color:var(--sport-ink,var(--fp-forest)); border-radius:20px; padding:5px 11px; font-weight:700; font-size:12px; }
.fp-sport-swim { --sport-soft:var(--fp-swim-soft); --sport-ink:var(--fp-swim); }
.fp-sport-bike { --sport-soft:var(--fp-bike-soft); --sport-ink:var(--fp-bike); }
.fp-sport-run { --sport-soft:var(--fp-run-soft); --sport-ink:var(--fp-run); }
.fp-sport-rest { --sport-soft:var(--fp-mint); --sport-ink:var(--fp-forest); }
.fp-sport-strength { --sport-soft:#f1ebfa; --sport-ink:#694192; }
.fp-sport-row { --sport-soft:#e6f0f7; --sport-ink:#295d75; }
.fp-tracker-link { margin-top:22px; min-height:48px; width:100%; }
.fp-coach-summary { background:var(--fp-mint); border-color:var(--fp-mint-line); }
.fp-coach-summary h3 { font-size:25px; line-height:1.2; margin:6px 0 14px; }
.fp-coach-summary p:not(.fp-eyebrow) { line-height:1.65; overflow-wrap:anywhere; }
.fp-coach-summary button { min-height:44px; margin:10px 0 18px; width:100%; white-space:normal; }
.fp-coach-summary small { display:block; color:var(--fp-muted); line-height:1.5; }
.fp-week-card { margin:20px 0; }
.fp-section-heading { display:flex; justify-content:space-between; gap:12px; align-items:center; margin-bottom:18px; flex-wrap:wrap; }
.fp-section-heading h3 { margin:0; font-size:22px; }
.fp-week-grid { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:8px; }
.fp-week-day { padding:10px 7px; min-width:0; border:1px solid var(--fp-line); border-radius:12px; }
.fp-week-day > strong, .fp-week-day > small { display:block; text-align:center; }
.fp-week-day > small { margin:4px 0 12px; color:var(--fp-muted); font-size:11px; }
.fp-week-day.is-today { border-color:var(--fp-orange); box-shadow:inset 0 3px 0 var(--fp-orange); }
.fp-week-workout { display:block; padding:10px 7px; margin-top:6px; width:100%; background:var(--sport-soft,var(--fp-surface-soft)); color:var(--sport-ink,var(--fp-forest)); text-align:left; box-shadow:none; }
.fp-week-workout strong, .fp-week-workout span, .fp-week-workout small { display:block; overflow-wrap:anywhere; }
.fp-week-workout strong { font-size:12px; }
.fp-week-workout span { font-size:11px; font-weight:500; margin:6px 0; line-height:1.4; }
.fp-week-workout small { font-size:10px; }
.fp-week-empty { display:block; text-align:center; font-size:11px; color:var(--fp-muted); margin-top:18px; }
.fp-overview-bottom { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; margin-bottom:20px; }
.fp-summary-card h3 { font-size:22px; line-height:1.3; margin:8px 0 12px; overflow-wrap:anywhere; }
.fp-summary-card button { margin-top:10px; }
.fp-overview-warning { border:1px solid var(--veyro-warning); background:var(--veyro-warning-soft); color:var(--veyro-warning-text); padding:18px 22px; border-radius:14px; margin:0 0 18px; }
.fp-overview-warning p { line-height:1.5; }
.fp-getting-started { padding:14px; margin-top:18px; border:1px solid var(--fp-line); border-radius:14px; }
.fp-getting-started summary { cursor:pointer; font-weight:700; }
.fp-destination > .card, .fp-destination > .dashboard-quad { margin-bottom:16px; }
.fp-shortcut-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.fp-shortcut { text-align:left; color:var(--fp-ink); text-decoration:none; }
.fp-shortcut strong { display:block; font-size:18px; margin-bottom:10px; }
.fp-shortcut span { display:block; color:var(--fp-muted); font-size:14px; line-height:1.5; font-weight:400; }
body:has(.fp-app-shell) .app-header { padding:18px 24px; }
body:has(.fp-app-shell) .app-header h1 { font-size:20px; line-height:1.3; }
.fp-app-shell #analytics .dashboard-quad { grid-template-columns:minmax(0,1fr); }
@media (hover:hover) {
  .fp-main-nav button:not([aria-current]):hover { background:var(--veyro-on-navy-hover); color:#fff; }
  .fp-shortcut:hover { background:var(--fp-mint); border-color:var(--fp-mint-line); }
}
@media (max-width:1000px) {
  .fp-overview-hero { grid-template-columns:minmax(0,1fr); }
  .fp-shortcut-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .fp-week-grid { overflow-x:auto; grid-template-columns:repeat(7,minmax(108px,1fr)); padding-bottom:8px; }
}
@media (max-width:700px) {
  .fp-app-shell { padding-bottom:calc(90px + env(safe-area-inset-bottom)); }
  .fp-main-nav { position:fixed; z-index:40; bottom:0; left:0; right:0; margin:0; border-radius:0; gap:2px; padding:8px 6px calc(8px + env(safe-area-inset-bottom)); }
  .fp-main-nav button { flex-direction:column; gap:5px; padding:7px 2px; min-width:0; font-size:11px; }
  .fp-main-nav button span { font-size:19px; }
  .fp-overview-bottom, .fp-shortcut-grid { grid-template-columns:minmax(0,1fr); }
  .fp-secondary-nav { gap:6px; }
  body:has(.fp-app-shell) .app-header { padding:14px 18px; }
  body:has(.fp-app-shell) .app-header h1 { font-size:16px; }
  body:has(.fp-app-shell) .header-main { gap:12px; }
}
@media print {
  .fp-main-nav, .fp-secondary-nav, #fpOverview, .fp-getting-started { display:none !important; }
  .fp-app-shell { padding-bottom:0; }
}

/* FormPilot shared interface: light surfaces, readable forms and mobile cards. */
.fp-preview-banner { padding:10px 16px; background:var(--fp-mint); color:var(--fp-ink); text-align:center; font-size:12px; line-height:1.5; border-bottom:1px solid var(--fp-mint-line); }
body:has(.fp-app-shell) .app-header { background:var(--veyro-navy); color:var(--veyro-on-navy); padding:20px 24px; align-items:center; border-bottom:1px solid var(--veyro-on-navy-line); }
body:has(.fp-app-shell) .app-header button.secondary { background:var(--veyro-on-navy-hover); color:var(--veyro-on-navy); border-color:rgba(255,255,255,.18); }
body:has(.fp-app-shell) .app-header :focus-visible { outline-color:var(--veyro-accent); }
.fp-app-shell .panel { min-width:0; }
.fp-app-shell .card { border-radius:var(--veyro-card-radius); padding:var(--fp-card-pad); }
.fp-app-shell .card h3 { line-height:1.3; color:var(--fp-ink); }
.fp-app-shell .hint { line-height:1.6; }
.fp-app-shell input:not([type=checkbox]):not([type=radio]),
.fp-app-shell select, .fp-app-shell textarea { min-height:44px; max-width:100%; min-width:0; font:inherit; font-size:14px; }
.fp-app-shell label { line-height:1.5; }
.fp-app-shell button, .fp-app-shell .file-btn { min-height:40px; }
.fp-app-shell button[hidden], .fp-coach-links button[hidden] { display:none !important; }
.fp-app-shell .dialog-actions, .calendar-actions { flex-wrap:wrap; }
.fp-app-shell .two-col > *, .fp-app-shell .stats > *, .fp-app-shell .goals-grid > * { min-width:0; }
.fp-coach-links { display:flex; flex-wrap:wrap; gap:8px; margin:0 0 22px; }
.fp-coach-links button { border:1px solid var(--fp-mint-line); }
#coach [tabindex="-1"] { scroll-margin-top:20px; }
.fp-calendar-legend { display:flex; gap:7px; flex-wrap:wrap; margin-top:12px; }
.fp-calendar-legend span { border:1px solid var(--fp-line); border-radius:20px; padding:4px 10px; font-size:11px; color:var(--fp-ink); }
.fp-app-shell .calendar-day { padding:10px; gap:8px; }
.fp-app-shell .cal-workout { padding:10px; border-radius:12px; }
.fp-app-shell .cal-workout strong { white-space:normal; overflow-wrap:anywhere; line-height:1.4; }
.fp-app-shell .calendar-day-head strong { color:var(--fp-ink); }
.fp-app-shell .table-wrap { max-width:100%; }
.fp-app-shell .tech-item, .fp-app-shell .stat { border-radius:var(--fp-radius); padding:14px; }
.fp-app-shell .goal-help-box { background:var(--fp-mint); color:var(--fp-ink); border-color:var(--fp-mint-line); }
.fp-app-shell .toolbar { flex-wrap:wrap; }
dialog { max-height:90dvh; overflow-y:auto; color:var(--fp-ink); }
dialog .dialog-actions { flex-wrap:wrap; }
dialog button { min-height:44px; }
dialog input, dialog select, dialog textarea { max-width:100%; min-width:0; }
.tracker-login-screen { border-radius:20px; }
.tracker-time-hero, .tracker-stat-primary { background:var(--fp-mint); color:var(--fp-ink); border:1px solid var(--fp-mint-line); }
.tracker-time-hero span, .tracker-stat-primary span { color:var(--fp-muted); }
@media(max-width:900px) {
  body:has(.fp-app-shell) .app-header { display:flex; flex-wrap:wrap; gap:12px; }
  body:has(.fp-app-shell) .header-main { flex:1 1 250px; flex-direction:column; align-items:flex-start; gap:12px; }
  body:has(.fp-app-shell) .header-actions { margin-top:0; }
}
@media(max-width:700px) {
  .fp-app-shell .calendar-weekdays { display:none; }
  .fp-app-shell .training-calendar-grid { min-width:0; display:grid; grid-template-columns:minmax(0,1fr); gap:10px; border:0; }
  .fp-app-shell .calendar-day { min-height:0; border:1px solid var(--fp-line); border-radius:12px; }
  .fp-app-shell .calendar-day.other-month { display:none; }
  .fp-app-shell .calendar-day-body:has(.cal-workout ~ .cal-workout) .cal-workout { padding:10px; }
  .fp-app-shell .calendar-day-body:has(.cal-workout ~ .cal-workout) .cal-workout strong { font-size:13px; }
  .fp-app-shell .calendar-day-body:has(.cal-workout ~ .cal-workout) .cal-intensity { display:block; }
  .fp-app-shell .calendar-shell { overflow-x:visible; }
  .fp-app-shell .cal-workout strong { font-size:13px; }
  .fp-app-shell .cal-detail { font-size:12px; }
  .fp-app-shell .calendar-actions button { min-width:44px; }
  .fp-app-shell .section-head { flex-wrap:wrap; }
  .fp-app-shell .panel p, .fp-app-shell .panel h3 { overflow-wrap:anywhere; }
  .fp-app-shell .coach-form, .fp-app-shell .goal-form { grid-template-columns:minmax(0,1fr); }
  .fp-app-shell input, .fp-app-shell select, .fp-app-shell textarea { font-size:16px !important; }
}
@media(prefers-reduced-motion:reduce) {
  *, *::before, *::after { scroll-behavior:auto !important; animation:none !important; transition:none !important; }
}
@media print { .fp-preview-banner, .fp-coach-links { display:none; } }

/* =====================================================================
   FormPilot layout system — app-shell, sidebar, header og content-kolonne
   Én kilde til shell-mål. Kun præsentation: ingen ændring af handlers,
   IDs, datamodel eller integrationer. Breakpoints:
     ≥1200px   fuld sidebar (--fp-sidebar-w)
     901–1199  ikon-rail (--fp-sidebar-rail-w), tekst som tooltip/skærmlæser
     ≤900      ingen sidebar; topnavigation (701–900) / bundbar (≤700)
   Sidens kolonne beregnes ét sted (--fp-inline), så header og indhold altid
   flugter og aldrig bliver bredere end --fp-content-max.
   ===================================================================== */
:root{
  --fp-sidebar-w:248px;
  --fp-sidebar-rail-w:76px;
  --fp-sidebar-bg:var(--veyro-navy);
  --fp-content-max:1560px;
  --fp-gutter:clamp(16px,2.4vw,32px);
  --fp-header-h:64px;
  --fp-space-1:4px; --fp-space-2:8px; --fp-space-3:12px;
  --fp-space-4:16px; --fp-space-5:24px; --fp-space-6:32px; --fp-space-7:48px;
  --fp-radius-sm:8px; --fp-radius:10px; --fp-radius-lg:var(--veyro-card-radius);
  --fp-shadow-card:var(--veyro-shadow);
  --fp-measure:76ch;
  --fp-shell-offset:0px;
}
/* Defineres på body (ikke :root), fordi var() opløses hvor egenskaben
   sættes — offset ændres på body pr. breakpoint. 100% opløses først ved
   brug (padding), dvs. containing block = body for både header og main. */
body{ --fp-inline:max(var(--fp-gutter), calc((100% - var(--fp-shell-offset) - var(--fp-content-max)) / 2)); }
html{ scrollbar-gutter:stable; }
/* Knapper arver ikke font som standard (blev Arial) — ensret med resten. */
button, .file-btn, .button-like{ font-family:inherit; }
@media(min-width:1200px){
  body:has(.fp-app-shell:not(.ui-hidden)){ --fp-shell-offset:var(--fp-sidebar-w); }
}
@media(min-width:901px) and (max-width:1199px){
  body:has(.fp-app-shell:not(.ui-hidden)){ --fp-shell-offset:var(--fp-sidebar-rail-w); }
}

/* ---------- Shell-tokens der kun gælder inde i appen ---------- */
.fp-app-shell{
  --fp-card-pad:var(--veyro-card-pad);
  --fp-panel-pad:0px;
  --fp-tab-pad:0 14px;
  --fp-tab-fs:13px;
}

/* ---------- Main: fylder præcis viewport minus sidebar ---------- */
main.fp-app-shell{
  max-width:none;
  width:auto;
  min-width:0;
  margin:0 0 0 var(--fp-shell-offset);
  padding:var(--fp-space-5) var(--fp-inline) var(--fp-space-7);
  min-height:calc(100dvh - var(--fp-header-h));
}
.fp-app-shell > .panel{ container:fp-panel / inline-size; min-width:0; border-radius:0; }
.fp-app-shell > .goals-grid{ min-width:0; }

/* ---------- Sidebar ---------- */
.fp-desktop-sidebar{
  position:fixed; inset:0 auto 0 0; z-index:70;
  width:var(--fp-shell-offset); height:100dvh;
  display:flex; flex-direction:column;
  overflow-y:auto; overflow-x:hidden; overscroll-behavior:contain;
  scrollbar-width:thin; scrollbar-color:rgba(255,255,255,.22) transparent;
  padding:var(--fp-space-4) var(--fp-space-3) var(--fp-space-5);
  background:var(--fp-sidebar-bg); color:#fff;
  border-right:1px solid var(--veyro-on-navy-line);
}
/* Brand: officielt Veyro Systems-logo (virksomhed) med produktnavnet
   FormPilot under. Logofilen har Veyros mørke baggrund indbygget og står
   derfor altid på --veyro-navy. */
.fp-sidebar-brand{
  display:grid; gap:10px; justify-items:start;
  padding:2px var(--fp-space-2) var(--fp-space-4);
  margin:0 0 var(--fp-space-2);
  border-bottom:1px solid var(--veyro-on-navy-line);
}
.fp-sidebar-logo{ display:block; width:100%; max-width:184px; overflow:hidden; }
.fp-sidebar-logo img{ display:block; width:100%; height:auto; aspect-ratio:2048 / 742; }
.fp-sidebar-brand strong{
  display:flex; align-items:center; gap:8px;
  font-size:13px; font-weight:600; letter-spacing:.16em; line-height:1.1; text-transform:uppercase; color:var(--veyro-on-navy);
}
.fp-sidebar-brand strong::before{ content:""; width:14px; height:2px; border-radius:2px; background:var(--veyro-accent); }
.fp-sidebar-group{ display:grid; gap:2px; padding:var(--fp-space-2) 0; border-bottom:1px solid var(--veyro-on-navy-line); }
.fp-sidebar-group:last-child{ border-bottom:0; }
.fp-sidebar-admin{ margin-top:auto; }
.fp-sidebar-label{
  margin:var(--fp-space-2) 10px var(--fp-space-1);
  font-size:10.5px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--veyro-on-navy-muted);
}
.fp-sidebar-link{
  display:flex; align-items:center; gap:11px; width:100%; min-height:38px;
  padding:8px 10px; border:0; border-radius:var(--fp-radius-sm) !important;
  background:transparent; color:var(--veyro-on-navy-soft); text-decoration:none; text-align:left;
  font-size:13.5px; font-weight:500; line-height:1.25; box-shadow:none; cursor:pointer;
}
.fp-sidebar-link span{ min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.fp-sidebar-link svg{ width:18px; height:18px; flex:none; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
.fp-sidebar-link[aria-current="page"]{ background:var(--veyro-nav-active); color:#fff; font-weight:600; box-shadow:inset 3px 0 0 var(--veyro-accent); }
.fp-sidebar-link[aria-current="page"] svg{ color:var(--veyro-accent); }
.fp-sidebar-link:focus-visible{ outline:2px solid var(--veyro-accent); outline-offset:-2px; }
.fp-sidebar-link[hidden], .fp-sidebar-admin[hidden]{ display:none !important; }
@media(hover:hover){
  .fp-sidebar-link:not([aria-current="page"]):hover{ background:var(--veyro-on-navy-hover); color:#fff; }
  .fp-sidebar-link:not([aria-current="page"]):hover svg{ color:var(--veyro-accent); }
}
@media(max-width:900px){ .fp-desktop-sidebar{ display:none; } }

/* Ikon-rail (901–1199): samme links, kun ikoner. Teksten forbliver i DOM'en
   for skærmlæsere; title-attributten (ui-shell.js) giver tooltip. */
@media(min-width:901px) and (max-width:1199px){
  .fp-desktop-sidebar{ padding-inline:var(--fp-space-2); }
  /* Rail: kun logoets V-symbol. Samme officielle fil, beskåret med CSS —
     symbolet ligger i filens venstre del (ca. 5–34 % af bredden). */
  .fp-sidebar-brand{ justify-items:center; padding-inline:0; }
  .fp-sidebar-logo{ width:44px; height:44px; max-width:none; }
  .fp-sidebar-logo img{ width:auto; height:54px; max-width:none; margin:-5px 0 0 -6px; }
  .fp-sidebar-brand strong, .fp-sidebar-label{
    position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); clip-path:inset(50%); white-space:nowrap;
  }
  .fp-sidebar-link{ justify-content:center; padding:10px 0; min-height:42px; }
  .fp-sidebar-link span{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); clip-path:inset(50%); }
  .fp-sidebar-link svg{ width:20px; height:20px; }
  .fp-sidebar-link[aria-current="page"]{ box-shadow:inset 3px 0 0 var(--veyro-accent); }
}

/* ---------- Header (kompakt, flugter med content-kolonnen) ---------- */
body:has(.fp-app-shell:not(.ui-hidden)) .app-header{
  position:sticky; top:0; z-index:45;
  display:flex; align-items:center; justify-content:space-between; flex-wrap:nowrap; gap:var(--fp-space-4);
  width:auto; max-width:none; min-height:var(--fp-header-h);
  margin:0 0 0 var(--fp-shell-offset);
  padding:10px var(--fp-inline);
  background:var(--veyro-navy); color:var(--veyro-on-navy);
  border-bottom:1px solid var(--veyro-on-navy-line); border-radius:0;
}
body:has(.fp-app-shell:not(.ui-hidden)) .app-header .header-main{ flex:1 1 auto; min-width:0; flex-direction:row; align-items:center; gap:var(--fp-space-4); }
body:has(.fp-app-shell:not(.ui-hidden)) .app-header .header-plan{ min-width:0; max-width:none; }
body:has(.fp-app-shell:not(.ui-hidden)) .app-header .header-plan .eyebrow{
  margin:0 0 2px; font-size:11px; letter-spacing:.04em; text-transform:none; color:var(--fp-muted); opacity:1;
}
body:has(.fp-app-shell:not(.ui-hidden)) .app-header h1{
  font-size:16px; line-height:1.3; letter-spacing:-.01em; color:var(--fp-ink);
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
body:has(.fp-app-shell:not(.ui-hidden)) .app-header .subtitle{
  margin:2px 0 0; font-size:12px; color:var(--fp-muted);
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
body:has(.fp-app-shell:not(.ui-hidden)) .app-header .header-actions{ flex:none; margin:0; gap:var(--fp-space-2); flex-wrap:nowrap; }
body:has(.fp-app-shell:not(.ui-hidden)) .header-account-toggle{ max-width:240px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
/* Eyebrow + abonnementsbadge på én linje; titel og undertitel under. */
body:has(.fp-app-shell:not(.ui-hidden)) .app-header .header-plan{
  display:flex; flex-wrap:wrap; align-items:center; column-gap:var(--fp-space-2);
}
body:has(.fp-app-shell:not(.ui-hidden)) .app-header .header-plan > :is(h1, .subtitle){ flex:1 0 100%; min-width:0; }
body:has(.fp-app-shell:not(.ui-hidden)) .app-header .subscription-badge{
  margin:0 0 2px; padding:2px 8px; font-size:10px; letter-spacing:.03em;
  background:var(--fp-mint); color:var(--fp-forest-dark); border:1px solid var(--fp-mint-line);
}
body:has(.fp-app-shell:not(.ui-hidden)) .app-header .subscription-badge:empty{ display:none; }
@media(min-width:901px){
  body:has(.fp-app-shell:not(.ui-hidden)) .app-header .header-brand{ display:none; }
  .fp-app-shell > .fp-main-nav{ display:none; }
}
.fp-preview-banner{ margin-left:var(--fp-shell-offset); }

/* ---------- Undernavigation (Alle genveje, Import, Udstyr …) ---------- */
.fp-app-shell > .fp-secondary-nav{
  display:flex; flex-wrap:wrap; gap:6px; max-width:none;
  margin:0 0 var(--fp-space-5); padding:0;
  background:transparent; border:0; border-radius:0; box-shadow:none;
}
.fp-app-shell > .fp-secondary-nav .tab{
  display:inline-flex; align-items:center; justify-content:center; flex:0 0 auto;
  min-height:36px; min-width:84px; white-space:nowrap; font-weight:600; line-height:1;
  background:var(--fp-surface); color:var(--fp-forest-dark);
  border:1px solid var(--fp-line);
}
.fp-app-shell > .fp-secondary-nav .tab.active{ background:var(--fp-forest); border-color:var(--fp-forest); color:#fff; }
.fp-app-shell > .fp-secondary-nav .tab-icon{ display:none; }
@media(hover:hover){
  .fp-app-shell > .fp-secondary-nav .tab:not(.active):hover{ background:var(--fp-mint); border-color:var(--fp-mint-line); }
}

/* ---------- Kort, typografi og rytme ---------- */
.fp-app-shell .card{
  border-radius:var(--fp-radius-lg); border-color:var(--fp-line); box-shadow:var(--fp-shadow-card); min-width:0;
}
.fp-app-shell .card > h3:first-child, .fp-app-shell .card > .section-head:first-child h3{ margin-top:0; }
.fp-app-shell .card h3{ font-size:17px; letter-spacing:-.01em; }
.fp-app-shell .card h4{ font-size:14px; }
.fp-app-shell :is(.panel, .admin-subpanel, .settings-section, .fp-destination) > .card:not(:last-child){ margin-bottom:var(--fp-space-4); }
.fp-app-shell .card :is(p, .hint, li){ max-width:var(--fp-measure); }
.fp-app-shell .card :is(td, th) :is(p, .hint){ max-width:none; }
.fp-app-shell .stat{ border-radius:var(--fp-radius); box-shadow:none; }
.fp-app-shell :is(.mono, code, kbd){ overflow-wrap:anywhere; word-break:break-word; }
.fp-app-shell :is(.two-col, .stats, .goals-grid){ gap:var(--fp-space-4); }
.fp-app-shell .table-wrap{ max-width:100%; overscroll-behavior-x:contain; border-radius:var(--fp-radius); }
.fp-app-shell .settings-section-label{ margin:var(--fp-space-6) 0 var(--fp-space-2); font-size:13px; letter-spacing:.04em; }

/* ---------- Tekniske statusfelter (konto, admin, beta-status) ---------- */
.fp-app-shell :is(.admin-status-grid, .cloud-status-grid, .beta-status-grid){
  display:grid; grid-template-columns:repeat(auto-fill, minmax(min(100%, 250px), 1fr));
  gap:var(--fp-space-2); margin:var(--fp-space-3) 0;
}
.fp-app-shell :is(.admin-status-grid, .cloud-status-grid, .beta-status-grid) > div{
  display:flex; flex-direction:column; gap:3px; min-width:0;
  padding:10px 12px; background:var(--fp-surface-soft);
  border:1px solid var(--fp-line); border-radius:var(--fp-radius-sm);
}
.fp-app-shell :is(.admin-status-grid, .cloud-status-grid, .beta-status-grid) span{
  display:block; font-size:11px; font-weight:600; color:var(--fp-muted);
}
.fp-app-shell :is(.admin-status-grid, .cloud-status-grid, .beta-status-grid) strong{
  display:block; margin:0; font-size:13px; line-height:1.4; overflow-wrap:anywhere; word-break:break-word;
}
.fp-app-shell :is(.admin-status-grid, .cloud-status-grid) strong.mono{ font-size:12px; }
.fp-app-shell .account-status-rows strong{ min-width:0; overflow-wrap:anywhere; }

/* ---------- Admin ---------- */
#admin .admin-subnav{
  display:flex; flex-wrap:wrap; gap:4px; width:fit-content; max-width:100%;
  margin:0 0 var(--fp-space-4); padding:4px;
  background:var(--fp-surface); border:1px solid var(--fp-line); border-radius:var(--fp-radius);
}
#admin .admin-subnav .admin-subtab{
  min-width:0 !important; min-height:36px; padding:0 16px;
  background:transparent !important; color:var(--fp-forest-dark) !important;
  border:0 !important; box-shadow:none !important; font-weight:700; filter:none;
}
#admin .admin-subnav .admin-subtab.active{ background:var(--fp-forest) !important; color:#fff !important; }
@media(hover:hover){ #admin .admin-subnav .admin-subtab:not(.active):hover{ background:var(--fp-mint) !important; } }
#admin .admin-filter-row, #admin .admin-user-controls{ flex-wrap:wrap; }
@container fp-panel (min-width:1080px){
  #adminSubOverview{ display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:var(--fp-space-4); align-items:start; }
  #adminSubOverview > .card{ margin:0 !important; }
}

/* ---------- Overblik ---------- */
.fp-overview-heading{
  display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:end; gap:var(--fp-space-2) var(--fp-space-5);
  padding:0 0 var(--fp-space-5); margin-bottom:var(--fp-space-5); border-bottom:1px solid var(--fp-line);
}
.fp-overview-heading > :not(.fp-overview-actions){ grid-column:1; }
.fp-overview-heading .fp-eyebrow{ margin:0; }
.fp-overview-heading h2{ margin:2px 0 4px; font-size:clamp(28px,2.6vw,40px); line-height:1.08; letter-spacing:-.03em; color:var(--fp-ink); }
.fp-overview-heading > .hint{ margin:0; font-size:14px; }
.fp-overview-actions{ grid-column:2; grid-row:1 / span 3; display:flex; gap:var(--fp-space-2); }
.fp-overview-actions button{ min-width:108px; }
.fp-overview-hero{ gap:var(--fp-space-4); }
.fp-today-card, .fp-coach-summary, .fp-week-card, .fp-summary-card, .fp-shortcut{
  padding:var(--fp-card-pad); border-radius:var(--fp-radius-lg); box-shadow:var(--fp-shadow-card);
}
.fp-today-card h3{ font-size:clamp(24px,2.2vw,32px); margin:10px 0; }
.fp-coach-summary{ border-left:3px solid var(--fp-forest); }
.fp-coach-summary h3{ font-size:20px; }
.fp-section-heading{ display:flex; align-items:center; justify-content:space-between; gap:var(--fp-space-3); margin-bottom:var(--fp-space-3); flex-wrap:wrap; }
.fp-section-heading h3{ margin:0; font-size:18px; letter-spacing:-.01em; }
.fp-section-heading button{ min-height:34px; padding:6px 12px; font-size:12px; }
.fp-snapshot-section{ margin:var(--fp-space-6) 0 var(--fp-space-5); }
.fp-snapshot-grid{ display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:var(--fp-space-3); }
.fp-snapshot-tile{
  display:grid; align-content:start; min-height:0; padding:var(--fp-space-4);
  background:var(--fp-surface); border:1px solid var(--fp-line); border-radius:var(--fp-radius);
}
.fp-snapshot-label{ font-size:12px; font-weight:600; letter-spacing:0; text-transform:none; color:var(--fp-muted); }
.fp-snapshot-tile strong{ display:block; margin-top:var(--fp-space-2); font-size:clamp(22px,1.9vw,30px); line-height:1.05; letter-spacing:-.02em; color:var(--fp-ink); overflow-wrap:anywhere; }
.fp-snapshot-tile small{ margin-top:6px; color:var(--fp-muted); font-size:12px; }
.fp-week-card{ margin:var(--fp-space-5) 0; }
.fp-status-grid{ display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.5fr); gap:var(--fp-space-4); margin:var(--fp-space-5) 0; }
.fp-streak-card h3{ font-size:32px; margin:6px 0 8px; color:var(--fp-forest); }
.fp-load-card h3{ margin:5px 0 12px; }
.fp-load-trend{ height:58px; display:flex; align-items:flex-end; gap:5px; padding:4px 0 2px; }
.fp-load-trend span{ flex:1; min-width:4px; max-width:28px; border-radius:4px 4px 2px 2px; background:linear-gradient(180deg,var(--veyro-teal),var(--veyro-accent)); }
.fp-overview-bottom{ gap:var(--fp-space-4); margin:var(--fp-space-5) 0; }

/* Layout efter den faktiske indholdsbredde (sidebar trukket fra). */
@container fp-panel (min-width:761px){
  .fp-overview-hero{ grid-template-columns:minmax(0,1.65fr) minmax(0,1fr); }
  .fp-week-grid{ overflow-x:visible; grid-template-columns:repeat(7, minmax(0, 1fr)); padding-bottom:0; }
}
@container fp-panel (max-width:760px){
  .fp-overview-hero, .fp-status-grid{ grid-template-columns:minmax(0,1fr); }
  .fp-snapshot-grid{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .fp-week-grid{ overflow-x:auto; grid-template-columns:repeat(7, minmax(108px, 1fr)); padding-bottom:8px; scroll-snap-type:x proximity; }
  .fp-week-day{ scroll-snap-align:start; }
}
@container fp-panel (max-width:560px){
  .fp-overview-heading{ grid-template-columns:minmax(0,1fr); }
  .fp-overview-actions{ grid-column:1; grid-row:auto; margin-top:var(--fp-space-3); }
  .fp-overview-actions button{ flex:1; min-width:0; }
  .fp-overview-bottom{ grid-template-columns:minmax(0,1fr); }
}
@container fp-panel (max-width:420px){
  .fp-snapshot-grid{ grid-template-columns:minmax(0,1fr); }
}

/* ---------- Tablet og mobil (ingen sidebar) ---------- */
@media(max-width:900px){
  :root{ --fp-header-h:56px; }
  body:has(.fp-app-shell:not(.ui-hidden)) .app-header .header-plan{ display:none; }
  body:has(.fp-app-shell:not(.ui-hidden)) .app-header .header-brand{
    display:flex; flex-direction:row; align-items:center; gap:12px; width:auto; min-width:0;
  }
  body:has(.fp-app-shell:not(.ui-hidden)) .app-header .brand-logo-title{
    padding-left:12px; border-left:1px solid rgba(255,255,255,.22); white-space:nowrap;
  }
  main.fp-app-shell{ padding-top:var(--fp-space-4); }
  .fp-app-shell > .fp-main-nav{ min-height:0; margin:0 0 var(--fp-space-3); border-radius:var(--fp-radius); }
  .fp-app-shell > .fp-main-nav button{ min-height:42px; }
  /* Én vandret række der kan scrolles, i stedet for 2–3 ujævne linjer. */
  .fp-app-shell > .fp-secondary-nav{
    flex-wrap:nowrap; overflow-x:auto; overscroll-behavior-x:contain; scrollbar-width:none;
    margin-bottom:var(--fp-space-4); padding-bottom:2px;
    -webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 28px),transparent);
            mask-image:linear-gradient(90deg,#000 calc(100% - 28px),transparent);
  }
  .fp-app-shell > .fp-secondary-nav::-webkit-scrollbar{ display:none; }
  .fp-app-shell > .fp-secondary-nav .tab:last-child{ margin-right:24px; }
}
@media(max-width:700px){
  .fp-app-shell{ --fp-card-pad:16px; }
  :root{ --fp-gutter:14px; }
  body:has(.fp-app-shell:not(.ui-hidden)) .app-header{ padding-block:8px; }
  body:has(.fp-app-shell:not(.ui-hidden)) .app-header .header-brand{ gap:10px; }
  body:has(.fp-app-shell:not(.ui-hidden)) .app-header .brand-logo-img{ height:30px; }
  body:has(.fp-app-shell:not(.ui-hidden)) .app-header .brand-logo-title{ padding-left:10px; font-size:12px; }
  body:has(.fp-app-shell:not(.ui-hidden)) .header-account-toggle{ max-width:42vw; }
  main.fp-app-shell{ padding-bottom:calc(var(--fp-space-7) + 64px + env(safe-area-inset-bottom)); }
  .fp-app-shell > .fp-main-nav{ border-radius:0; margin:0; }
  .fp-app-shell > .fp-secondary-nav .tab{ min-height:34px; min-width:0; }
  #admin .admin-subnav{ width:100%; }
  #admin .admin-subnav .admin-subtab{ flex:1 1 auto; padding:0 10px; }
}
@media print{
  .fp-desktop-sidebar{ display:none !important; }
  main.fp-app-shell, body .app-header{ margin-left:0 !important; padding-inline:0 !important; }
  .fp-preview-banner{ margin-left:0; }
}

/* ======================================================================
   FormPilot Fase 1 (2026-10-04) — nye funktioner.
   Bygger udelukkende på de eksisterende --fp-*-tokens og de etablerede
   kort/knap-mønstre. Alle grids kollapser mod 320px uden vandret scroll.
   ====================================================================== */
.fp-feature-root{ display:grid; gap:var(--fp-space-5); }
.fp-feature-card{ display:grid; gap:var(--fp-space-3); min-width:0; }
.fp-feature-card > h3{ margin:0; font-size:18px; letter-spacing:-.01em; }
.fp-feature-card > .hint{ margin:0; }

/* Nøgletal — bruges af Træninger, ugestatus, kalorier og styrkelog. */
.fp-stat-row{
  display:grid; gap:var(--fp-space-3); min-width:0;
  grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
}
.fp-stat-tile{
  background:var(--fp-surface-soft); border:1px solid var(--fp-line);
  border-radius:var(--fp-radius); padding:var(--fp-space-4);
  display:grid; gap:2px; align-content:start; min-width:0;
}
.fp-stat-label{ color:var(--fp-muted); font-size:12px; text-transform:uppercase; letter-spacing:.08em; }
.fp-stat-value{ font-size:clamp(20px,2.2vw,26px); line-height:1.15; overflow-wrap:anywhere; }
.fp-stat-tile small{ color:var(--fp-muted); font-size:12px; }

/* Formularer på de nye sider. */
.fp-form-grid{
  display:grid; gap:var(--fp-space-3); min-width:0;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
}
.fp-field{ display:grid; gap:4px; font-size:13px; color:var(--fp-muted); min-width:0; }
.fp-field > span{ font-weight:600; color:var(--fp-ink); }
.fp-field input, .fp-field select{ width:100%; min-width:0; }
.fp-field small{ font-size:12px; }
.fp-form-actions{ display:flex; flex-wrap:wrap; gap:var(--fp-space-3); align-items:center; }
.fp-form-actions .hint{ margin:0; }
.fp-disclaimer{
  margin:0; color:var(--fp-muted); font-size:12px; line-height:1.5;
  border-left:3px solid var(--fp-mint-line); padding-left:var(--fp-space-3);
}

/* Fælles tom tilstand. */
.fp-feature-empty{
  display:grid; gap:var(--fp-space-2); justify-items:start;
  background:var(--fp-mint); border:1px solid var(--fp-mint-line);
  border-radius:var(--fp-radius); padding:var(--fp-space-4); margin-top:var(--fp-space-3);
}
.fp-feature-empty h3{ margin:0; font-size:16px; }
.fp-feature-empty p{ margin:0; }

/* --- Træninger ------------------------------------------------------- */
.fp-trainings-controls{
  display:flex; flex-wrap:wrap; gap:var(--fp-space-3); align-items:flex-end;
}
.fp-trainings-controls label{ display:grid; gap:4px; font-size:13px; color:var(--fp-muted); }
#fpTrainingsStats{ margin:var(--fp-space-4) 0; }

/* --- Kalender: visningsskift og ugevisning ---------------------------- */
.fp-calendar-viewswitch{
  display:flex; flex-wrap:wrap; gap:var(--fp-space-2);
  margin:var(--fp-space-3) 0; align-items:center;
}
.fp-calendar-viewswitch button[aria-pressed="true"]{
  background:var(--fp-forest); color:#fff;
}
.fp-week-view{ display:grid; gap:var(--fp-space-4); min-width:0; }
.fp-week-head{
  display:flex; flex-wrap:wrap; gap:var(--fp-space-3);
  justify-content:space-between; align-items:flex-start;
}
.fp-week-head h3{ margin:0 0 2px; font-size:18px; }
.fp-week-head .hint{ margin:0; }
.fp-week-nav{ display:flex; gap:var(--fp-space-2); flex-wrap:wrap; }
.fp-week-days{
  display:grid; gap:var(--fp-space-3); min-width:0;
  grid-template-columns:repeat(7,minmax(0,1fr));
}
.fp-week-day-col{
  background:var(--fp-surface); border:1px solid var(--fp-line);
  border-radius:var(--fp-radius); padding:var(--fp-space-3);
  display:grid; gap:var(--fp-space-2); align-content:start; min-width:0;
}
.fp-week-day-col.is-today{ border-color:var(--fp-forest); background:var(--fp-mint); }
.fp-week-day-head{ display:grid; gap:0; }
.fp-week-day-head strong{ font-size:13px; text-transform:capitalize; }
.fp-week-day-head small{ color:var(--fp-muted); font-size:12px; }
.fp-week-day-empty{ margin:0; color:var(--fp-muted); font-size:12px; }
.fp-week-pass{
  display:grid; gap:1px; text-align:left; width:100%; min-width:0;
  background:var(--fp-surface-soft); color:var(--fp-ink);
  border:1px solid var(--fp-line); border-radius:var(--fp-radius-sm);
  padding:var(--fp-space-2); box-shadow:none; font-weight:500;
}
.fp-week-pass strong{ font-size:12px; }
.fp-week-pass span{ font-size:12px; overflow-wrap:anywhere; }
.fp-week-pass small{ color:var(--fp-muted); font-size:11px; }
.fp-week-pass:hover{ border-color:var(--fp-forest); }

/* --- Kalorieberegner og løbsprognose --------------------------------- */
.fp-calc-result{ min-width:0; }
.fp-forecast-list{
  display:grid; gap:var(--fp-space-3); min-width:0;
  grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
}
.fp-forecast-row{
  background:var(--fp-surface-soft); border:1px solid var(--fp-line);
  border-radius:var(--fp-radius); padding:var(--fp-space-4);
  display:grid; gap:2px; min-width:0;
}
.fp-forecast-row strong{ font-size:clamp(20px,2.2vw,26px); line-height:1.15; }
.fp-forecast-label{ color:var(--fp-muted); font-size:12px; text-transform:uppercase; letter-spacing:.08em; }
.fp-forecast-row small{ color:var(--fp-muted); font-size:12px; }

/* --- Styrkelog ------------------------------------------------------- */
.fp-strength-summary{ display:grid; gap:var(--fp-space-4); min-width:0; }
.fp-strength-card{ display:grid; gap:var(--fp-space-2); min-width:0; }
.fp-strength-card h4{ margin:0; font-size:15px; text-transform:capitalize; }
.fp-strength-history{ display:grid; gap:var(--fp-space-2); min-width:0; }
.fp-strength-row{
  display:flex; flex-wrap:wrap; gap:var(--fp-space-2) var(--fp-space-3); align-items:center;
  border:1px solid var(--fp-line); border-radius:var(--fp-radius);
  padding:var(--fp-space-3); background:var(--fp-surface); min-width:0;
}
.fp-strength-row strong{ text-transform:capitalize; overflow-wrap:anywhere; }
.fp-strength-row span{ font-size:13px; }
.fp-strength-row small{ color:var(--fp-muted); font-size:12px; }
.fp-strength-date{ color:var(--fp-muted); font-size:12px; min-width:92px; }
.fp-strength-row button{ margin-left:auto; }

/* --- Sundhed: grafer -------------------------------------------------- */
.fp-chart-block{ display:grid; gap:var(--fp-space-2); min-width:0; }
.fp-chart-head{ display:flex; flex-wrap:wrap; gap:var(--fp-space-2); justify-content:space-between; align-items:baseline; }
.fp-chart-head h4{ margin:0; font-size:14px; }
.fp-chart-head small{ color:var(--fp-muted); font-size:12px; }
.fp-chart{
  width:100%; height:150px; display:block; min-width:0;
  background:var(--fp-surface-soft); border:1px solid var(--fp-line);
  border-radius:var(--fp-radius);
}
.fp-chart-line{ stroke-width:2; stroke-linecap:round; stroke-linejoin:round; vector-effect:non-scaling-stroke; }
.fp-chart-dot{ stroke:var(--fp-surface); stroke-width:1; vector-effect:non-scaling-stroke; }
.fp-line-weight{ stroke:var(--fp-forest); fill:var(--fp-forest); }
.fp-line-sleep{ stroke:var(--fp-swim); fill:var(--fp-swim); }
.fp-line-energy{ stroke:var(--fp-forest); fill:var(--fp-forest); }
.fp-line-fatigue{ stroke:var(--fp-bike); fill:var(--fp-bike); }
.fp-line-pain{ stroke:var(--fp-run); fill:var(--fp-run); }
.fp-chart-scale{ margin:0; color:var(--fp-muted); font-size:12px; }

@media(max-width:1200px){
  .fp-week-days{ grid-template-columns:repeat(4,minmax(0,1fr)); }
}
@media(max-width:900px){
  .fp-week-days{ grid-template-columns:repeat(3,minmax(0,1fr)); }
  .fp-week-head, .fp-chart-head{ flex-direction:column; align-items:stretch; }
}
@media(max-width:700px){
  .fp-week-days{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .fp-stat-row, .fp-forecast-list{ grid-template-columns:repeat(auto-fit,minmax(130px,1fr)); }
  .fp-trainings-controls{ display:grid; grid-template-columns:minmax(0,1fr); }
  .fp-trainings-controls button{ justify-self:start; }
  .fp-strength-row button{ margin-left:0; }
  .fp-chart{ height:132px; }
}
@media(max-width:420px){
  .fp-week-days{ grid-template-columns:minmax(0,1fr); }
  .fp-stat-row, .fp-forecast-list, .fp-form-grid{ grid-template-columns:minmax(0,1fr); }
  .fp-strength-date{ min-width:0; }
}

/* ======================================================================
   FormPilot Fase 2 (2026-10-04) — kalorier, kalenderabonnement, kort,
   ruter og heatmap. Samme --fp-*-tokens og kortmønstre som fase 1.
   Leaflets eget stylesheet hentes LAZY af features-phase2.js; reglerne
   herunder lægger kun FormPilots ramme omkring kortet.
   ====================================================================== */

/* --- Kalorier i Træninger -------------------------------------------- */
.fp-kcal-cell{ display:block; margin-top:2px; color:var(--fp-muted); font-size:11px; white-space:nowrap; }
.fp-kcal-cell.is-estimate{ font-style:italic; }

/* --- Kalenderabonnement ---------------------------------------------- */
.fp-feed-url{ display:flex; flex-wrap:wrap; gap:var(--fp-space-2); align-items:center; min-width:0; }
.fp-feed-url input{ flex:1 1 260px; min-width:0; font-size:12px; font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; }
.fp-feed-guides{ display:grid; gap:var(--fp-space-2); min-width:0; }
.fp-feed-guide{
  border:1px solid var(--fp-line); border-radius:var(--fp-radius);
  padding:var(--fp-space-3); background:var(--fp-surface-soft);
}
.fp-feed-guide summary{ cursor:pointer; font-weight:600; font-size:13px; }
.fp-feed-guide p{ margin:var(--fp-space-2) 0 0; }

/* Efterfyldning af ruter sidder inde mellem Importér-knapperne. */
.fp-inline-feature{ display:block; width:100%; margin-top:var(--fp-space-3); }
.fp-inline-feature .fp-feature-card{ margin:0; }

/* --- Kort (fælles for Ruter og Heatmap) ------------------------------- */
.fp-map{
  width:100%; min-width:0; height:clamp(280px,48vh,520px);
  border:1px solid var(--fp-line); border-radius:var(--fp-radius);
  background:var(--fp-surface-soft); overflow:hidden;
}
/* Leaflets egne paneler skal ligge under FormPilots sidebar og dialoger. */
.fp-map .leaflet-pane,
.fp-map .leaflet-top,
.fp-map .leaflet-bottom{ z-index:1; }
.fp-map .leaflet-control-attribution{
  background:rgba(255,255,255,.85); color:var(--fp-muted); font-size:11px;
}
.fp-map .leaflet-control-attribution a{ color:var(--fp-forest); }
.fp-map-note{ margin:0; color:var(--fp-muted); font-size:11px; line-height:1.5; }

/* --- Ruter ----------------------------------------------------------- */
.fp-route-info{
  margin:0; font-weight:600; font-size:14px; color:var(--fp-ink);
  background:var(--fp-mint); border:1px solid var(--fp-mint-line);
  border-radius:var(--fp-radius); padding:var(--fp-space-2) var(--fp-space-3);
}
.fp-route-line{ stroke:var(--fp-forest); }
.fp-route-point{ stroke:var(--fp-forest); fill:var(--fp-surface); fill-opacity:1; }
.fp-route-list{ display:grid; gap:var(--fp-space-2); min-width:0; }
.fp-route-row{
  display:flex; flex-wrap:wrap; gap:var(--fp-space-2) var(--fp-space-3); align-items:center;
  border:1px solid var(--fp-line); border-radius:var(--fp-radius);
  padding:var(--fp-space-3); background:var(--fp-surface); min-width:0;
}
.fp-route-row strong{ overflow-wrap:anywhere; }
.fp-route-row span{ font-size:13px; color:var(--fp-muted); }
.fp-route-row small{ color:var(--fp-muted); font-size:12px; }
.fp-route-row-actions{ display:flex; gap:var(--fp-space-2); margin-left:auto; flex-wrap:wrap; }

/* --- Heatmap --------------------------------------------------------- */
.fp-heat-line{ fill:none; }
.fp-heat-tracker{ stroke:var(--fp-forest); }
.fp-heat-strava{ stroke:var(--fp-run); }
.fp-heat-legend{ display:flex; flex-wrap:wrap; gap:var(--fp-space-3); margin:0; }
.fp-heat-key{ display:inline-flex; align-items:center; gap:6px; font-size:12px; color:var(--fp-muted); }
.fp-heat-key::before{ content:""; width:18px; height:3px; border-radius:2px; background:currentColor; }
.fp-heat-key.fp-heat-tracker{ color:var(--fp-forest); }
.fp-heat-key.fp-heat-strava{ color:var(--fp-run); }

@media(max-width:700px){
  .fp-map{ height:clamp(240px,42vh,360px); }
  .fp-route-row-actions{ margin-left:0; }
  .fp-feed-url input{ flex:1 1 100%; }
}
@media(max-width:420px){
  .fp-route-row{ display:grid; grid-template-columns:minmax(0,1fr); }
  .fp-route-row-actions{ justify-content:flex-start; }
}
@media print{
  .fp-map{ display:none !important; }
}

/* ======================================================================
   FormPilot Fase 2b (2026-10-04) — vejfølgende ruteplanlægning og
   kort-tilstand i 95 % af skærmen. Samme --fp-*-tokens som resten.
   ====================================================================== */

/* --- Tegneværktøjer på Ruter-siden ----------------------------------- */
.fp-route-controls{
  display:flex; flex-wrap:wrap; gap:var(--fp-space-2) var(--fp-space-3);
  align-items:flex-end; min-width:0;
}
.fp-route-controls .fp-field{ min-width:150px; }
.fp-route-controls button[aria-pressed="true"]{ background:var(--fp-forest); color:#fff; }

/* Stiplet, mens en strækning beregnes; anden farve for fri tegning. */
.fp-route-line{ stroke:var(--fp-forest); }
.fp-route-line.is-free{ stroke:var(--veyro-warning); }
.fp-route-line.is-pending{ stroke:var(--fp-muted); }

/* Traekbare rutepunkter. En centreret divIcon, saa gribefladen ligger praecis
   paa punktet (Leaflets standardikon har sit anker i spidsen nederst). */
.fp-route-handle{
  background:var(--fp-surface); border:3px solid var(--fp-forest);
  border-radius:50%; cursor:grab; box-sizing:border-box;
  box-shadow:0 1px 4px rgba(3,19,31,.35);
}
.fp-route-handle.is-end{ border-color:var(--veyro-navy); border-width:4px; }
.fp-route-handle:active{ cursor:grabbing; }
.leaflet-dragging .fp-route-handle{ cursor:grabbing; }

/* --- Højdeprofil ----------------------------------------------------- */
.fp-elevation-host{ display:block; min-width:0; }
.fp-elevation-profile{
  display:block; width:100%; height:56px; min-width:0;
  background:var(--fp-surface-soft); border:1px solid var(--fp-line);
  border-radius:var(--fp-radius-sm);
}
.fp-elevation-line{ stroke:var(--fp-forest); stroke-width:1.5; vector-effect:non-scaling-stroke; fill:none; }
.fp-elevation-fill{ fill:var(--fp-mint); stroke:none; }

/* --- Kort-tilstand: 95vw x 95dvh oven på hele appen ------------------ */
/* z-index skal ligge over sidebaren (40) og appens øvrige lag. */
.fp-mapmode{ position:fixed; inset:0; z-index:9000; display:grid; place-items:center; }
.fp-mapmode-backdrop{ position:absolute; inset:0; background:rgba(3,19,31,.62); }
.fp-mapmode-frame{
  position:relative; z-index:1;
  width:95vw; height:95dvh;
  display:grid; grid-template-rows:auto minmax(0,1fr);
  background:var(--fp-surface); border:1px solid var(--fp-line);
  border-radius:var(--fp-radius-lg); box-shadow:0 24px 70px rgba(3,19,31,.35);
  overflow:hidden;
}
/* dvh understøttes bredt, men vh er et sikkert fallback for ældre browsere. */
@supports not (height: 95dvh){
  .fp-mapmode-frame{ height:95vh; }
}
.fp-mapmode-stage{ min-width:0; min-height:0; position:relative; }
.fp-mapmode-stage .fp-map.is-fullscreen{
  width:100%; height:100%; border:0; border-radius:0; background:var(--fp-surface-soft);
}
/* Kortet efterlader en tom plads i panelet bagved, mens det er lånt ud. */
.fp-map-placeholder{ display:none; }

.fp-mapmode-toolbar{
  display:flex; flex-wrap:wrap; align-items:center; gap:var(--fp-space-2);
  padding:var(--fp-space-2) var(--fp-space-3);
  border-bottom:1px solid var(--fp-line); background:var(--fp-surface);
  min-width:0;
}
.fp-mapmode-toolbar button{ min-height:40px; }
.fp-mapmode-toolbar button[aria-pressed="true"]{ background:var(--fp-forest); color:#fff; }
.fp-mapmode-field{ display:flex; align-items:center; gap:6px; font-size:12px; color:var(--fp-muted); }
.fp-mapmode-field select{ min-height:40px; }
.fp-mapmode-readout{
  font-weight:600; font-size:13px; color:var(--fp-ink);
  background:var(--fp-mint); border:1px solid var(--fp-mint-line);
  border-radius:var(--fp-radius-sm); padding:6px var(--fp-space-3);
  overflow-wrap:anywhere;
}
.fp-mapmode-elevation{ width:clamp(120px,18vw,240px); }
.fp-mapmode-elevation .fp-elevation-profile{ height:40px; }
.fp-mapmode-status{ font-size:12px; color:var(--fp-muted); overflow-wrap:anywhere; flex:1 1 160px; min-width:0; }
.fp-mapmode-toolbar #fpMapModeCloseBtn{ margin-left:auto; }

/* Baggrunden må ikke kunne scrolles, mens kortet er åbent. */
body.fp-mapmode-open{ overflow:hidden; }

@media(max-width:900px){
  /* Værktøjslinjen nederst på mobil, og 44px mindste trykflade. */
  .fp-mapmode-frame{ grid-template-rows:minmax(0,1fr) auto; }
  .fp-mapmode-toolbar{
    order:2; border-bottom:0; border-top:1px solid var(--fp-line);
    padding-bottom:calc(var(--fp-space-2) + env(safe-area-inset-bottom));
    overflow-x:auto; overscroll-behavior-x:contain;
  }
  .fp-mapmode-stage{ order:1; }
  .fp-mapmode-toolbar button,
  .fp-mapmode-field select{ min-height:44px; }
  .fp-mapmode-elevation{ display:none; }
}
@media(max-width:700px){
  .fp-mapmode-frame{ width:95vw; height:95dvh; border-radius:var(--fp-radius); }
  .fp-mapmode-toolbar{ gap:6px; }
  .fp-mapmode-readout{ flex:1 1 100%; }
  .fp-mapmode-status{ flex:1 1 100%; }
  .fp-route-controls{ display:grid; grid-template-columns:minmax(0,1fr); }
  .fp-route-controls button{ min-height:44px; justify-self:stretch; }
}
@media print{
  .fp-mapmode{ display:none !important; }
}

/* ======================================================================
   FormPilot (2026-10-04) — kompakt "Abonnér på kalender".
   Abonnementet er en engangsopsætning: knappen ligger i værktøjsrækken, og
   panelet er UDEN FOR sidens flow (popover på desktop, bottom sheet på
   mobil), så kalenderen aldrig skubbes ned.
   ====================================================================== */
.fp-calendar-toolbar-row{
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between;
  gap:var(--fp-space-2) var(--fp-space-3);
  margin:var(--fp-space-3) 0; min-width:0;
}
/* Visningsskiftet beholder sin egen margin-nulstilling inde i rækken. */
.fp-calendar-toolbar-row .fp-calendar-viewswitch{ margin:0; flex:0 1 auto; }

.fp-feed-anchor{ position:relative; flex:0 0 auto; }
.fp-feed-toggle{
  display:inline-flex; align-items:center; gap:7px; position:relative;
  white-space:nowrap;
}
.fp-feed-toggle-icon{
  width:18px; height:18px; flex:0 0 auto;
  fill:none; stroke:currentColor; stroke-width:1.5;
  stroke-linecap:round; stroke-linejoin:round;
}
.fp-feed-toggle[aria-expanded="true"]{ background:var(--fp-forest); color:#fff; }
/* Lille grøn prik, når der findes et aktivt abonnements-link. */
.fp-feed-dot{
  width:8px; height:8px; border-radius:50%; flex:0 0 auto;
  background:var(--veyro-success); box-shadow:0 0 0 2px var(--fp-surface);
}
.fp-feed-toggle[aria-expanded="true"] .fp-feed-dot{ box-shadow:0 0 0 2px var(--fp-forest); }

/* --- Panelet: popover på desktop/tablet ------------------------------- */
.fp-feed-panel{
  position:absolute; top:calc(100% + 8px); right:0; z-index:2000;
  width:380px; max-width:calc(100vw - 32px);
  display:grid; gap:var(--fp-space-2);
  background:var(--fp-surface); border:1px solid var(--fp-line);
  border-radius:var(--fp-radius); box-shadow:0 16px 44px rgba(3,19,31,.22);
  padding:var(--fp-space-4);
  max-height:min(70vh, 560px); overflow-y:auto; overscroll-behavior:contain;
}
.fp-feed-head{ display:flex; align-items:flex-start; justify-content:space-between; gap:var(--fp-space-2); }
.fp-feed-title{ margin:0; font-size:15px; letter-spacing:-.01em; }
.fp-feed-close{ flex:0 0 auto; min-width:28px; padding:2px 8px; line-height:1.4; }
.fp-feed-intro{ margin:0; color:var(--fp-muted); font-size:12px; line-height:1.5; }
.fp-feed-status{ margin:0; color:var(--fp-muted); font-size:12px; line-height:1.5; overflow-wrap:anywhere; }
.fp-feed-actions{ display:flex; flex-wrap:wrap; gap:var(--fp-space-2); align-items:center; }

/* URL'en må aldrig give vandret scroll: feltet krymper i stedet. */
.fp-feed-url{ display:flex; flex-wrap:wrap; gap:var(--fp-space-2); align-items:center; min-width:0; }
.fp-feed-url input{
  flex:1 1 150px; min-width:0; width:100%;
  font-size:11px; font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  text-overflow:ellipsis;
}
.fp-feed-url button{ flex:0 0 auto; }
.fp-feed-url button.is-done{ background:var(--fp-mint); color:var(--fp-forest-dark); }

/* Diskret tekstknap. */
.fp-feed-reset{
  background:none; box-shadow:none; color:var(--fp-muted);
  padding:4px 2px; font-weight:600; font-size:12px; text-decoration:underline;
}
.fp-feed-reset:hover{ color:var(--veyro-danger-text); }

.fp-feed-guides{ display:grid; gap:4px; min-width:0; }
.fp-feed-guide{
  border:1px solid var(--fp-line); border-radius:var(--fp-radius-sm);
  padding:6px var(--fp-space-2); background:var(--fp-surface-soft);
}
.fp-feed-guide summary{ cursor:pointer; font-weight:600; font-size:12px; }
.fp-feed-guide p{ margin:6px 0 0; font-size:12px; line-height:1.5; }
.fp-feed-note{
  margin:0; color:var(--fp-muted); font-size:11px; line-height:1.5;
  border-top:1px solid var(--fp-line); padding-top:var(--fp-space-2);
}

/* --- Mobil: bottom sheet over bundnavigationen ------------------------ */
@media(max-width:700px){
  .fp-calendar-toolbar-row{ gap:var(--fp-space-2); }
  .fp-feed-toggle{ min-height:44px; }
  .fp-feed-panel{
    position:fixed; inset:auto 0 0 0; top:auto; right:0; left:0;
    width:auto; max-width:none;
    max-height:85dvh; overflow-y:auto;
    /* Over bundnavigationen (z-index 40). */
    z-index:4000;
    border-radius:var(--fp-radius-lg) var(--fp-radius-lg) 0 0;
    border-bottom:0;
    padding-bottom:calc(var(--fp-space-4) + env(safe-area-inset-bottom));
    box-shadow:0 -14px 44px rgba(3,19,31,.3);
  }
  .fp-feed-panel button{ min-height:44px; }
  .fp-feed-panel .fp-feed-reset,
  .fp-feed-panel .fp-feed-close{ min-height:44px; }
}
@supports not (max-height: 85dvh){
  @media(max-width:700px){ .fp-feed-panel{ max-height:85vh; } }
}

/* Ikke plads til teksten på én linje: vis kun ikonet. Teksten bevares for
   skærmlæsere via knappens aria-label og som tooltip (title). */
@media(max-width:420px){
  .fp-feed-toggle-label{
    position:absolute; width:1px; height:1px; overflow:hidden;
    clip-path:inset(50%); white-space:nowrap;
  }
  .fp-feed-toggle{ min-width:44px; justify-content:center; padding-inline:10px; }
}

/* ======================================================================
   FormPilot (2026-10-04) — desktop uden dobbelt navigation og uden header.
   Sidebaren ER navigationen ved >=901px, så undernavigationen og headeren
   er overflødige dér. Ved <=900px er alt uændret.
   ====================================================================== */
@media(min-width:901px){
  /* 1) Undernavigationen er en dublet af sidebaren. .tab-knapperne bliver i
        DOM'en — app.js og ui-shell.js navigerer via dem — de skjules kun. */
  body:has(.fp-app-shell:not(.ui-hidden)) .fp-app-shell > .fp-secondary-nav{ display:none; }

  /* 2) Headeren er tom uden plan-info (den vises nu i Overblik) og uden
        kontomenuen (den ligger i sidebaren). */
  body:has(.fp-app-shell:not(.ui-hidden)) .app-header{ display:none; }

  /* 3) Uden header starter indholdet øverst — header-højden må ikke stå
        tilbage som et tomt hul. */
  body:has(.fp-app-shell:not(.ui-hidden)) main.fp-app-shell{
    padding-top:var(--fp-space-5);
    min-height:100dvh;
  }
  /* Første element på hver side får samme topafstand, uanset hvad det er. */
  body:has(.fp-app-shell:not(.ui-hidden)) .fp-app-shell > .panel.active > :first-child{ margin-top:0; }
  body:has(.fp-app-shell:not(.ui-hidden)) .fp-app-shell > .goals-grid{ margin-top:0; }
}

/* --- Plan-info som kompakt linje i Overblik --------------------------- */
/* Noderne er FLYTTET hertil fra headeren (se ui-shell.js), så app.js'
   renderPlanHeader() opdaterer dem uændret. */
.fp-plan-line{
  display:flex; flex-wrap:wrap; align-items:baseline; gap:4px var(--fp-space-3);
  margin:var(--fp-space-2) 0 var(--fp-space-3); min-width:0;
  padding:var(--fp-space-2) 0; border-top:1px solid var(--fp-line);
}
.fp-plan-line #planEyebrow{
  margin:0; order:1; font-size:11px; letter-spacing:.1em; text-transform:uppercase;
  color:var(--fp-muted); opacity:1;
}
.fp-plan-line #subscriptionBadge{ order:2; }
.fp-plan-line #subscriptionBadge:empty{ display:none; }
.fp-plan-line #planHeaderTitle{
  order:3; flex:1 1 100%; margin:0;
  font-size:clamp(15px,1.6vw,18px); line-height:1.3; letter-spacing:-.01em;
  color:var(--fp-ink); overflow-wrap:anywhere;
}
.fp-plan-line #planHeaderSubtitle{
  order:4; flex:1 1 100%; margin:0;
  font-size:12px; line-height:1.5; color:var(--fp-muted); overflow-wrap:anywhere;
}

/* --- Kontomenu i sidebarens bund (desktop) ---------------------------- */
.fp-sidebar-account{ margin-top:var(--fp-space-3); padding-top:var(--fp-space-3); border-top:1px solid var(--veyro-on-navy-line); }
.fp-sidebar-account:empty{ display:none; }
.header-account.is-in-sidebar{ position:relative; width:100%; }
.header-account.is-in-sidebar .header-account-toggle{
  display:flex; align-items:center; gap:10px; width:100%; min-height:42px;
  background:var(--veyro-on-navy-hover); color:#fff; box-shadow:none; border-color:var(--veyro-on-navy-line);
  border-radius:var(--fp-radius); padding:8px 10px;
  font-size:13px; font-weight:600; text-align:left;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.header-account.is-in-sidebar .header-account-toggle:hover{ background:rgba(255,255,255,.12); }
.header-account.is-in-sidebar .header-account-toggle:focus-visible{ outline:2px solid var(--veyro-accent); outline-offset:2px; }
/* Dropdown'en åbner OPAD og holdes inden for viewporten. */
.header-account.is-in-sidebar .header-account-dropdown{
  position:absolute; bottom:calc(100% + 8px); top:auto; left:0; right:auto;
  min-width:200px; max-width:min(260px, calc(100vw - 24px));
  max-height:min(60vh, 320px); overflow-y:auto;
  z-index:80;
}

/* Ikon-rail (901-1199px): chippen bliver et rundt initial-ikon. */
@media(min-width:901px) and (max-width:1199px){
  .fp-sidebar-account{ display:flex; justify-content:center; }
  .header-account.is-in-sidebar{ width:auto; }
  .header-account.is-in-sidebar .header-account-toggle{
    width:40px; height:40px; min-height:40px; padding:0;
    justify-content:center; border-radius:50%;
    /* Kun det første tegn vises — resten klippes væk af den runde ramme. */
    font-size:14px; letter-spacing:0;
  }
  .header-account.is-in-sidebar .header-account-toggle::after{
    content:attr(data-initial); display:none;
  }
  .header-account.is-in-sidebar .header-account-dropdown{ left:0; min-width:200px; }
}

/* --- RPE-forklaringen på Program ------------------------------------- */
.fp-rpe-help{
  margin:0 0 var(--fp-space-3);
  border:1px solid var(--fp-line); border-radius:var(--fp-radius-sm);
  background:var(--fp-surface-soft); padding:6px var(--fp-space-3);
  max-width:var(--fp-measure);
}
.fp-rpe-help summary{ cursor:pointer; font-size:13px; font-weight:600; color:var(--fp-ink); }
.fp-rpe-help p{ margin:var(--fp-space-2) 0 0; }

/* ======================================================================
   FormPilot (2026-10-04) — "Åbn Tracker" kun på mobil.
   Tracker er en mobil-app (tracker.html); knappen giver kun mening på en
   telefon. Elementerne bliver i DOM'en og dannes uændret — de skjules kun,
   så intet i ui-shell.js' logik ændres.
   ====================================================================== */
@media(min-width:701px){
  /* Overblik, "Dagens træning": både knappen og dens hjælpetekst.
     Kortet er almindeligt blokflow uden gap, så display:none efterlader
     ikke et tomt hul nederst (knappens margin-top forsvinder med den). */
  .fp-tracker-link,
  .fp-tracker-hint{ display:none; }
}
/* Sidebaren vises kun på desktop (>=901px), hvor Tracker-linket aldrig er
   relevant — derfor skjules det helt. */
.fp-sidebar-tracker{ display:none; }

/* ======================================================================
   FormPilot (2026-10-04) — diskret status for automatisk cloud-gem.
   Ligger i kontomenuen, som ui-shell.js flytter mellem header og sidebar,
   så statussen følger med af sig selv. Aldrig en popup.
   ====================================================================== */
.fp-autosave-status{
  display:block; font-size:11px; line-height:1.4; color:var(--fp-muted);
  margin-top:4px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.fp-autosave-status[data-state="saving"],
.fp-autosave-status[data-state="pending"]{ color:var(--fp-muted); }
.fp-autosave-status[data-state="saved"]{ color:var(--veyro-success-text); }
.fp-autosave-status[data-state="error"]{ color:var(--veyro-danger-text); }
/* I sidebaren står den under bruger-chippen, på lys baggrund i headeren. */
.header-account.is-in-sidebar .fp-autosave-status{ color:var(--veyro-on-navy-muted); padding:0 10px; }
.header-account.is-in-sidebar .fp-autosave-status[data-state="error"]{ color:var(--veyro-danger-on-navy); }
/* Ikon-rail: der er ikke plads til tekst. */
@media(min-width:901px) and (max-width:1199px){
  .header-account.is-in-sidebar .fp-autosave-status{ display:none; }
}

/* ======================================================================
   FormPilot (2026-10-04) — slet mål og træningsplan.
   ====================================================================== */
/* Diskret slet på målkort: "Arkivér" skal blive ved at være den milde vej. */
.goal-delete-btn{ color:var(--fp-muted); }
.goal-delete-btn:hover{ color:var(--veyro-danger-text); }

.fp-plan-actions{ display:flex; flex-wrap:wrap; gap:var(--fp-space-2); align-items:center; margin:0 0 var(--fp-space-3); }
.fp-plan-goal-note{
  margin:0; flex:1 1 260px; min-width:0;
  border-left:3px solid var(--fp-mint-line); padding-left:var(--fp-space-3);
}

/* Tom tilstand på Overblik, når der ingen plan er. Demo-planen vises aldrig. */
.fp-no-plan{
  display:grid; gap:var(--fp-space-2); justify-items:start; min-width:0;
  background:var(--fp-mint); border:1px solid var(--fp-mint-line);
  border-radius:var(--fp-radius); padding:var(--fp-space-4);
  margin:0 0 var(--fp-space-4);
}
.fp-no-plan strong{ font-size:16px; }
.fp-no-plan p{ margin:0; color:var(--fp-muted); font-size:13px; line-height:1.5; }

/* Fortryd-toast. Aldrig en popup — en rolig linje nederst, der kan ignoreres. */
.fp-undo-toast{
  position:fixed; z-index:9500; left:50%; transform:translateX(-50%);
  bottom:calc(var(--fp-space-5) + env(safe-area-inset-bottom));
  display:flex; align-items:center; gap:var(--fp-space-3);
  max-width:min(520px, calc(100vw - 32px));
  background:var(--veyro-navy); color:#fff;
  border-radius:var(--fp-radius); padding:10px var(--fp-space-3);
  box-shadow:0 12px 36px rgba(3,19,31,.35); font-size:13px;
}
.fp-undo-toast button{ min-height:36px; }
.fp-undo-toast .secondary{ background:rgba(255,255,255,.16); color:#fff; box-shadow:none; }
.fp-undo-toast .secondary:hover{ background:rgba(255,255,255,.26); }
.fp-undo-close{ background:none; box-shadow:none; color:var(--veyro-on-navy-muted); padding:4px 6px; font-size:14px; }
.fp-undo-close:hover{ color:#fff; }
@media(max-width:700px){
  /* Over bundnavigationen. */
  .fp-undo-toast{ bottom:calc(72px + env(safe-area-inset-bottom)); left:16px; right:16px; transform:none; max-width:none; }
  .fp-undo-toast button{ min-height:44px; }
}

/* Oprydningsbjælke: diskret, ændrer intet af sig selv. */
.fp-plan-cleanup{
  display:flex; flex-wrap:wrap; align-items:center; gap:var(--fp-space-2) var(--fp-space-3);
  background:var(--veyro-warning-soft); border:1px solid var(--veyro-warning);
  border-radius:var(--fp-radius); padding:var(--fp-space-2) var(--fp-space-3);
  margin:0 0 var(--fp-space-3); font-size:13px; color:var(--fp-ink); min-width:0;
}
.fp-plan-cleanup[hidden]{ display:none; }
.fp-plan-cleanup button{ min-height:36px; }
@media(max-width:700px){ .fp-plan-cleanup button{ min-height:44px; } }


/* ======================================================================
   Veyro Systems designsystem (2026-10-05) — knapper, kort, admin og brede
   skærme. Kun præsentation. Alle farver kommer fra --veyro-*-tokens øverst.
   ====================================================================== */

/* ---------- Knapper: én højde, radius, vægt og spacing -----------------
   Primary  = standard <button> / .primary      (Veyro teal)
   Secondary= .secondary / .file-btn            (lys flade + border)
   Ghost    = .ghost                            (transparent)
   Danger   = .danger                           (kun destruktive handlinger) */
button, .file-btn, .button-like{
  border:1px solid transparent; border-radius:var(--veyro-btn-radius);
  font-weight:var(--veyro-btn-weight); font-size:14px; line-height:1.2;
  transition:background-color .12s ease, border-color .12s ease, color .12s ease;
}
:is(.fp-app-shell, dialog, #publicLanding, .tracker-app-shell) :is(button, .file-btn, .button-like):not(.mini):not(.fp-sidebar-link):not(.fp-week-workout):not(.fp-week-pass):not(.cal-workout){
  min-height:var(--veyro-btn-h);
}
.file-btn{ display:inline-flex; align-items:center; justify-content:center; }
button.mini, .mini{ min-height:32px; padding:0 10px; font-size:12px; border-radius:var(--fp-radius-sm); }
button.ghost, .button-like.ghost{ background:transparent; color:var(--veyro-primary); border-color:transparent; box-shadow:none; }
button.danger, .danger{ background:var(--veyro-danger-soft); color:var(--veyro-danger-text); border:1px solid var(--veyro-danger-line); box-shadow:none; }
button.update-btn, .update-btn{ background:var(--veyro-warning-soft); color:var(--veyro-warning-text); border-color:var(--veyro-warning); }
button:disabled, .file-btn[aria-disabled="true"]{ opacity:.55; }
@media (hover:hover){
  button:not(.secondary):not(.ghost):not(.danger):not(.tab):not(.fp-sidebar-link):not(:disabled):hover{ filter:none; }
  button.ghost:hover{ background:var(--veyro-accent-soft); }
  button.danger:hover, .danger:hover{ background:var(--veyro-danger-line); }
}
:where(button, a, input, select, textarea, summary, [tabindex]):focus-visible{
  outline:2px solid var(--veyro-accent); outline-offset:2px;
}
/* Felter følger knappernes højde og radius. */
input, select, textarea{ border-color:var(--veyro-border-strong); border-radius:var(--veyro-btn-radius); }
:is(input, select, textarea):focus{ border-color:var(--veyro-primary); }

/* ---------- Kort: ens border, radius, padding og header ---------------- */
.card, .fp-app-shell .card, .stat, .goal-card,
.fp-today-card, .fp-coach-summary, .fp-week-card, .fp-summary-card, .fp-shortcut{
  background:var(--veyro-surface); border:1px solid var(--veyro-border);
  border-radius:var(--veyro-card-radius); box-shadow:var(--veyro-shadow);
}
.fp-app-shell .card{ padding:var(--fp-card-pad); }
.fp-app-shell .card > h3:first-child,
.fp-app-shell .card > .section-head:first-child h3{
  margin:0 0 var(--fp-space-3); font-size:15px; font-weight:650; line-height:1.3; letter-spacing:0; color:var(--veyro-text);
}
.fp-app-shell .card > h3:first-child + .hint{ margin-top:calc(var(--fp-space-2) * -1); }
.fp-coach-summary{ background:var(--veyro-accent-soft); border-color:var(--veyro-accent-line); border-left:3px solid var(--veyro-accent); }
.fp-eyebrow{ color:var(--veyro-primary); }
table{ background:var(--veyro-surface); }

/* ---------- Brede skærme: kolonner frem for ét strakt element ----------
   Styres af panelets faktiske bredde (sidebar trukket fra), ikke viewporten. */
@container fp-panel (min-width:1180px){
  /* Sider der kun består af en stak kort, lægges i to kolonner. */
  :is(#settings, #subscription, #support, #equipment, #import, #weight, #technique) > .fp-destination,
  .fp-feature-root{
    display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:var(--fp-space-4); align-items:start;
  }
  :is(#settings, #subscription, #support, #equipment, #import, #weight, #technique) > .fp-destination > *,
  .fp-feature-root > *{ margin:0 !important; min-width:0; }
  /* Brede dataelementer beholder hele rækken. */
  .fp-feature-root > :is(:only-child, .fp-span-all, :has(table), :has(.fp-map), :has(.fp-week-days), :has(.fp-chart)),
  :is(#settings, #subscription, #support, #equipment, #import, #weight, #technique) > .fp-destination > :is(:only-child, :has(table), :has(.table-wrap), h2, .fp-page-heading, .settings-section-label, .fp-coach-links){
    grid-column:1 / -1;
  }
  .fp-shortcut-grid{ grid-template-columns:repeat(4, minmax(0, 1fr)); }
  .fp-overview-bottom{ grid-template-columns:repeat(3, minmax(0, 1fr)); }
}
@container fp-panel (min-width:1320px){
  .fp-snapshot-grid{ grid-template-columns:repeat(4, minmax(0, 1fr)); }
  .fp-overview-hero{ grid-template-columns:minmax(0,1.5fr) minmax(0,1fr); }
}

/* ---------- Admin ------------------------------------------------------- */
#admin{ display:none; }
#admin.active{ display:grid; gap:var(--fp-space-4); align-content:start; }
#admin > .card, #admin .admin-subpanel > .card{ margin:0 !important; }
#admin .admin-subpanel{ display:grid; gap:var(--fp-space-4); align-content:start; min-width:0; }
#admin .admin-subpanel.ui-hidden{ display:none; }
#admin .admin-subnav{ margin:0; }
#admin .admin-subnav .admin-subtab{ color:var(--veyro-text) !important; font-weight:600; }
#admin .admin-subnav .admin-subtab.active{ background:var(--veyro-navy) !important; color:var(--veyro-on-navy) !important; box-shadow:inset 0 -2px 0 var(--veyro-accent) !important; }
/* Email / Rolle / Status / Bruger-id / Firebase-projekt: 2 kolonner på
   desktop, 1 på små skærme. Lange id'er ombrydes og udvider aldrig siden. */
.fp-app-shell #admin .admin-status-grid{
  display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:var(--fp-space-2) var(--fp-space-3); margin:var(--fp-space-3) 0 0;
}
.fp-app-shell #admin .admin-status-grid > div{
  min-width:0; padding:10px 12px; gap:4px;
  background:var(--veyro-surface-soft); border:1px solid var(--veyro-border); border-radius:var(--fp-radius-sm);
}
.fp-app-shell #admin .admin-status-grid span{
  font-size:10.5px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--veyro-text-muted);
}
.fp-app-shell #admin .admin-status-grid strong{
  font-size:13.5px; font-weight:600; line-height:1.4; color:var(--veyro-text);
  min-width:0; overflow-wrap:anywhere; word-break:break-word;
}
.fp-app-shell #admin .admin-status-grid strong.mono{ font-size:12.5px; font-weight:500; }
#admin :is(p, li, .hint, td){ overflow-wrap:anywhere; }
@container fp-panel (max-width:620px){
  .fp-app-shell #admin .admin-status-grid{ grid-template-columns:minmax(0, 1fr); }
}
@container fp-panel (min-width:980px){
  #adminSubOverview{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
}
@container fp-panel (min-width:1400px){
  #admin.active > .card:first-child .admin-status-grid{ grid-template-columns:repeat(3, minmax(0, 1fr)); }
}

/* Rene tekstkort: to spalter på brede skærme, så kortet ikke står halvtomt. */
@container fp-panel (min-width:1180px){
  .fp-app-shell .card.prose{ column-count:2; column-gap:var(--fp-space-7); }
  .fp-app-shell .card.prose > h3{ column-span:all; }
  .fp-app-shell .card.prose > *{ break-inside:avoid; }
  .fp-app-shell .card.prose > :is(p, ul, ol):first-of-type{ margin-top:0; }
}
#admin .card.prose{ column-count:1; }

/* Abonnementsbadget står nu på lys flade (plan-linjen i Overblik). */
.fp-plan-line .subscription-badge{
  margin-left:0; padding:2px 8px; font-size:10px; font-weight:600; letter-spacing:.06em;
  background:var(--veyro-accent-soft); color:var(--veyro-primary); border:1px solid var(--veyro-accent-line);
}

/* Landing-headeren afsluttes af Veyro-linjen helt i bunden. */
.landing-header{ padding-bottom:0; }
.landing-header-accent{ margin-top:26px; }
@media(max-width:700px){
  .landing-brand > div{ padding-left:0; border-left:0; }
  .landing-brand img{ height:44px; }
}

/* ---------- Ingen vandret scroll, uanset indhold ----------------------- */
main.fp-app-shell{ overflow-x:clip; }
.fp-app-shell :is(.card, .panel, .fp-destination) :is(img, svg, canvas, video){ max-width:100%; }
.fp-app-shell :is(pre, code, .mono, .fp-feed-url input){ overflow-wrap:anywhere; }
@media print{
  .fp-sidebar-brand, .brand-logo-img{ display:none !important; }
}

/* ======================================================================
   Mentalt Kompas (2026-10-14) — features-mental.js
   Kun eksisterende --fp-*/--veyro-*-tokens og de etablerede kort-,
   knap- og formularmønstre. Ingen separat visuel identitet.
   ====================================================================== */
.fp-sr-only{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
}
.fp-mental-form [hidden]{ display:none !important; }
.fp-mental-nav{ display:flex; flex-wrap:wrap; gap:var(--fp-space-2); }
.fp-mental-nav button[aria-current="page"],
.fp-mental-week-pick button[aria-pressed="true"],
.fp-mental-choice[aria-checked="true"]{
  background:var(--fp-forest); color:#fff; border-color:var(--fp-forest);
}
.fp-mental-saved{ margin:0; min-height:1.2em; color:var(--veyro-success-text); font-weight:600; font-size:14px; }
.fp-mental-saved:empty{ min-height:0; }
.fp-mental-body{ display:grid; gap:var(--fp-space-5); min-width:0; }
.fp-mental-status{ margin:0; }

.fp-mental-decision{ border-left:4px solid var(--fp-forest); }
.fp-mental-next{
  display:grid; gap:2px; background:var(--fp-mint); border:1px solid var(--fp-mint-line);
  border-radius:var(--fp-radius); padding:var(--fp-space-3) var(--fp-space-4);
}
.fp-mental-next strong{ font-size:16px; overflow-wrap:anywhere; }
.fp-mental-micro{ margin:0; font-size:15px; line-height:1.5; color:var(--fp-ink); }

.fp-mental-notice{
  display:grid; gap:var(--fp-space-1); border-radius:var(--fp-radius);
  padding:var(--fp-space-3) var(--fp-space-4); border:1px solid var(--fp-line);
}
.fp-mental-notice p{ margin:0; line-height:1.5; }
.fp-mental-notice-calm{ background:var(--fp-mint); border-color:var(--fp-mint-line); }
.fp-mental-notice-care{ background:var(--veyro-warning-soft); border-color:color-mix(in srgb, var(--veyro-warning) 35%, var(--veyro-surface)); }
.fp-mental-notice-care strong{ color:var(--veyro-warning-text); }

.fp-mental-goals, .fp-mental-anchors, .fp-mental-log{ list-style:none; margin:0; padding:0; display:grid; gap:var(--fp-space-2); }
.fp-mental-goals li{
  display:grid; grid-template-columns:auto 1fr; column-gap:var(--fp-space-3); row-gap:0; align-items:baseline;
  padding:var(--fp-space-2) var(--fp-space-3); border:1px solid var(--fp-line); border-radius:var(--fp-radius-sm);
}
.fp-mental-goals li.is-a-goal{ border-color:var(--fp-forest); background:var(--fp-mint); }
.fp-mental-goals li small{ grid-column:2; color:var(--fp-muted); }
.fp-mental-goals strong{ overflow-wrap:anywhere; }
.fp-mental-goal-priority{ font-size:12px; font-weight:700; color:var(--fp-forest); text-transform:uppercase; letter-spacing:.06em; }
.fp-mental-phase{ display:grid; gap:2px; }
.fp-mental-phase .hint{ margin:0; }

.fp-mental-mantra{
  margin:0; font-size:18px; font-weight:600; line-height:1.4; color:var(--fp-ink);
  border-left:3px solid var(--fp-forest); padding-left:var(--fp-space-3);
}
.fp-mental-anchors li{ display:grid; gap:2px; }
.fp-mental-anchors span{ color:var(--fp-muted); overflow-wrap:anywhere; }

.fp-mental-form{ display:grid; gap:var(--fp-space-4); min-width:0; }
.fp-mental-form textarea{ width:100%; min-width:0; resize:vertical; font:inherit; }
.fp-mental-scale, .fp-mental-anchor, .fp-mental-options{ border:0; margin:0; padding:0; min-width:0; }
.fp-mental-scale legend, .fp-mental-anchor legend{ font-weight:600; font-size:14px; color:var(--fp-ink); padding:0; margin-bottom:var(--fp-space-2); }
.fp-mental-anchor{ display:grid; gap:var(--fp-space-3); padding-top:var(--fp-space-2); border-top:1px solid var(--fp-line); }
.fp-mental-scale-row{ display:grid; grid-template-columns:repeat(10,minmax(0,1fr)); gap:4px; }
.fp-mental-scale-option{ position:relative; display:block; min-width:0; }
.fp-mental-scale-option input{ position:absolute; opacity:0; inset:0; margin:0; cursor:pointer; }
.fp-mental-scale-option span{
  display:grid; place-items:center; min-height:40px; border-radius:var(--fp-radius-sm);
  border:1px solid var(--fp-line); background:var(--fp-surface); font-weight:600; font-size:14px;
  color:var(--fp-ink);
}
.fp-mental-scale-option input:checked + span{ background:var(--fp-forest); border-color:var(--fp-forest); color:#fff; }
.fp-mental-scale-option input:focus-visible + span{ outline:2px solid var(--veyro-primary); outline-offset:2px; }
.fp-mental-scale-ends{ display:flex; justify-content:space-between; color:var(--fp-muted); margin-top:2px; }

.fp-mental-choices{ display:grid; gap:var(--fp-space-2); grid-template-columns:repeat(auto-fit,minmax(170px,1fr)); }
.fp-mental-choice{ min-height:48px; }
.fp-mental-options{ display:grid; gap:var(--fp-space-2); }
.fp-mental-option, .fp-mental-link{
  display:flex; gap:var(--fp-space-3); align-items:flex-start; cursor:pointer;
  padding:var(--fp-space-3); border:1px solid var(--fp-line); border-radius:var(--fp-radius-sm);
  background:var(--fp-surface); color:var(--fp-ink); line-height:1.4;
}
.fp-mental-option:has(input:checked){ border-color:var(--fp-forest); background:var(--fp-mint); }
.fp-mental-option input, .fp-mental-link input{ margin-top:2px; flex:none; width:auto; }
.fp-mental-link span{ overflow-wrap:anywhere; }
#fpMentalStep2:focus{ outline:none; }

.fp-mental-log li{
  display:flex; flex-wrap:wrap; gap:var(--fp-space-2) var(--fp-space-3); align-items:center;
  padding:var(--fp-space-2) var(--fp-space-3); border:1px solid var(--fp-line); border-radius:var(--fp-radius-sm);
}
.fp-mental-log li.is-done{ background:var(--veyro-success-soft); border-color:color-mix(in srgb, var(--veyro-success) 30%, var(--veyro-surface)); }
.fp-mental-log-text{ display:grid; gap:2px; flex:1 1 220px; min-width:0; }
.fp-mental-log-text strong{ overflow-wrap:anywhere; }
.fp-mental-log-text small{ color:var(--fp-muted); }

.fp-mental-week-pick{ display:flex; flex-wrap:wrap; gap:var(--fp-space-2); }
.fp-mental-table{ width:100%; border-collapse:collapse; font-size:14px; }
.fp-mental-table th, .fp-mental-table td{ text-align:left; padding:var(--fp-space-2); border-bottom:1px solid var(--fp-line); vertical-align:top; }
.fp-mental-table thead th{ font-size:12px; color:var(--fp-muted); font-weight:600; }
.fp-mental-value{ display:block; font-weight:600; font-variant-numeric:tabular-nums; }
.fp-mental-bar{
  display:block; height:4px; margin-top:4px; border-radius:2px; max-width:96px;
  background:linear-gradient(to right, var(--fp-forest) var(--fp-mental-fill, 0%), var(--fp-line) var(--fp-mental-fill, 0%));
}
.fp-mental-extra{ color:var(--fp-muted); overflow-wrap:anywhere; min-width:8ch; }

.fp-mental-visual summary{ cursor:pointer; font-weight:600; font-size:16px; }
.fp-mental-visual p{ margin:0; line-height:1.6; }
@media(max-width:520px){
  .fp-mental-scale-option span{ min-height:44px; font-size:13px; }
  .fp-mental-scale-row{ gap:3px; }
}

/* ======================================================================
   Veyro UI v2 (2026-10-14) — samlet designsystem for FormPilot.
   FormPilot er produktet, Veyro Systems er virksomhedsbrandet.

   Dette lag er den ENDELIGE kilde til tokens, typografi og komponenter.
   Det ligger sidst i filen og vinder derfor over de ældre lag ovenfor
   uden !important (undtagen hvor et ældre lag selv bruger !important).
   Kun præsentation: ingen ændring af IDs, handlers, data eller flow.

   Officiel Veyro-palet (platformens VEYRO_THEME.md):
     Navy Dark #03131F · Deep Navy #061A2A · Teal #087F8F · Cyan #22C2CF
     Teal Light #E8F7F8 · App Background #F5F7F9 · Border #DCE3E8
     Primary Text #102235 · Success #2EAD72 · Warning #D99A28 · Danger #D95C5C
   ====================================================================== */
:root{
  /* --- Farver (navne efter spec'en; værdier = officiel palet) ------- */
  --veyro-navy:#03131f;
  --veyro-navy-deep:#061a2a;
  --veyro-teal:#087f8f;
  --veyro-primary:#087484;          /* tilgængelig teal til tekst/primær handling */
  --veyro-accent:#22c2cf;           /* cyan — aktive markeringer på navy */
  --veyro-accent-soft:#e8f7f8;
  --veyro-bg:#f5f7f9;
  --veyro-surface:#ffffff;
  --veyro-surface-soft:#f7f8f9;
  --veyro-border:#dce3e8;
  --veyro-text:#102235;
  --veyro-text-muted:#5b6b7b;
  --veyro-success:#2ead72;
  --veyro-warning:#d99a28;
  --veyro-danger:#d95c5c;

  /* --- Layout ------------------------------------------------------- */
  --sidebar-width:248px;
  --sidebar-rail-width:72px;
  --content-max-width:1400px;
  --header-height:56px;
  --control-height:40px;

  /* --- Radius og afstande ------------------------------------------- */
  --radius-sm:6px;
  --radius-md:8px;
  --radius-lg:12px;
  --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px;
  --space-5:20px; --space-6:24px; --space-7:32px; --space-8:48px;

  /* --- Typografi ---------------------------------------------------- */
  --font-sans:Inter, "Segoe UI", system-ui, -apple-system, Roboto, Arial, sans-serif;
  --fs-page:clamp(21px, 0.9vw + 14px, 27px);      /* sidetitel */
  --fs-section:clamp(16px, 0.3vw + 13.5px, 18px); /* sektionstitel */
  --fs-card:15px;                                 /* korttitel */
  --fs-body:14px;
  --fs-meta:12.5px;
  --fs-label:11px;                                /* versal-label */
  --fs-stat:clamp(20px, 0.8vw + 13px, 26px);      /* nøgletal */
  --fs-stat-lg:clamp(22px, 1.1vw + 13px, 30px);

  /* --- Skygger (meget diskrete) -------------------------------------- */
  --shadow-card:0 1px 2px rgba(6,26,42,.04), 0 1px 3px rgba(6,26,42,.04);
  --shadow-pop:0 18px 48px rgba(3,19,31,.22);

  /* --- Fokus: teal på lys flade, cyan på navy (begge ≥ 3:1) ---------- */
  --focus-ring:var(--veyro-primary);
  --focus-ring-on-navy:var(--veyro-accent);

  /* --- De ældre navne peger nu hertil (én kilde) --------------------- */
  --fp-sidebar-w:var(--sidebar-width);
  --fp-sidebar-rail-w:var(--sidebar-rail-width);
  --fp-content-max:var(--content-max-width);
  --fp-radius-sm:var(--radius-sm);
  --fp-radius:var(--radius-md);
  --fp-radius-lg:var(--radius-lg);
  --fp-shadow-card:var(--shadow-card);
  --veyro-shadow:var(--shadow-card);
  --veyro-card-radius:var(--radius-lg);
  --veyro-card-pad:var(--space-5);
  --veyro-btn-h:var(--control-height);
  --veyro-btn-radius:var(--radius-md);
  --veyro-btn-pad:0 var(--space-4);
}
@media(max-width:700px){
  /* Touch: 44px-mål for knapper og felter. */
  :root{ --control-height:44px; --veyro-card-pad:var(--space-4); }
}

body{ font-family:var(--font-sans); font-size:var(--fs-body); line-height:1.5; -webkit-font-smoothing:antialiased; }
.fp-app-shell{ --fp-card-pad:var(--veyro-card-pad); }

/* ---------- Typografisk hierarki ------------------------------------ */
.fp-page-heading{ margin:0 0 var(--space-6); max-width:var(--fp-measure); }
.fp-page-heading h2{
  margin:var(--space-1) 0 var(--space-1);
  font-size:var(--fs-page); font-weight:700; line-height:1.2; letter-spacing:-.02em; color:var(--veyro-text);
}
.fp-page-heading .hint{ margin:0; font-size:var(--fs-body); }
.fp-eyebrow{
  margin:0; font-size:var(--fs-label); font-weight:700; letter-spacing:.09em; text-transform:uppercase; color:var(--veyro-primary);
}
.fp-section-heading{ margin-bottom:var(--space-3); }
.fp-section-heading h3, .fp-feature-card > h3, .fp-app-shell .settings-section-label{
  font-size:var(--fs-section); font-weight:650; letter-spacing:-.01em; color:var(--veyro-text);
}
.fp-app-shell .settings-section-label{
  margin:var(--space-7) 0 var(--space-3); text-transform:none; letter-spacing:-.01em;
}
.fp-app-shell .card > h3:first-child,
.fp-app-shell .card > .section-head:first-child h3,
.fp-app-shell .card > h3,
.fp-feature-card > h3{
  font-size:var(--fs-card); font-weight:650; line-height:1.35; letter-spacing:0; color:var(--veyro-text);
}
.fp-app-shell .card h4{ font-size:14px; font-weight:650; }
.fp-app-shell :is(.hint, small){ color:var(--veyro-text-muted); }
.fp-app-shell .hint{ font-size:13px; line-height:1.55; }
.fp-app-shell .prose p{ font-size:var(--fs-body); line-height:1.6; }
.fp-app-shell :is(td, .fp-mental-value, .fp-snapshot-tile strong, .fp-stat-tile strong, .calendar-summary strong){ font-variant-numeric:tabular-nums; }

/* ---------- Knapper: Primary / Secondary / Ghost / Danger -------------
   Primary  = standard <button> / .primary   (Veyro teal)
   Secondary= .secondary / .file-btn         (hvid flade + border)
   Ghost    = .ghost                         (transparent)
   Danger   = .danger                        (kun destruktive handlinger) */
button, .file-btn, .button-like{
  font-family:inherit; font-size:14px; font-weight:600; line-height:1.2;
  border-radius:var(--radius-md); border:1px solid transparent;
}
:is(.fp-app-shell, dialog, #publicLanding) :is(button, .file-btn, .button-like):not(.mini):not(.fp-sidebar-link):not(.fp-week-workout):not(.fp-week-pass):not(.cal-workout):not(.fp-shortcut):not(.tab){
  min-height:var(--control-height); padding-inline:var(--space-4);
}
/* Ikon + tekst: ens afstand, kun hvor knappen faktisk har et ikon. */
:is(button, .file-btn, .button-like):not(.fp-sidebar-link):not(.fp-main-nav button):has(> svg){ display:inline-flex; align-items:center; justify-content:center; gap:var(--space-2); }
:is(.fp-app-shell, dialog) :is(button, .file-btn, .button-like):not(.fp-sidebar-link) > svg{ width:16px; height:16px; flex:none; }
/* Primary (standard) */
button.primary, .button-like{ background:var(--veyro-primary); color:#fff; }
/* Secondary */
button.secondary, .file-btn, .button-like.secondary, a.secondary{
  background:var(--veyro-surface); color:var(--veyro-text); border-color:var(--veyro-border-strong);
}
/* Ghost */
button.ghost, .button-like.ghost{ background:transparent; color:var(--veyro-primary); border-color:transparent; }
/* Danger — destruktive handlinger */
button.danger, .danger, .button-like.danger{
  background:var(--veyro-surface); color:var(--veyro-danger-text); border:1px solid var(--veyro-danger-line);
}
button.mini, .mini{ min-height:32px; padding:0 var(--space-3); font-size:12.5px; border-radius:var(--radius-sm); }
@media(hover:hover){
  .fp-app-shell button:not([class]):not(:disabled):hover, dialog button:not([class]):not(:disabled):hover,
  button.primary:not(:disabled):hover, .button-like:not(.secondary):not(.ghost):not(.danger):hover{
    background:var(--veyro-primary-hover); color:#fff;
  }
  button.secondary:not(:disabled):hover, .file-btn:hover, a.secondary:hover{
    background:var(--veyro-surface-soft); border-color:color-mix(in srgb, var(--veyro-primary) 45%, var(--veyro-border)); color:var(--veyro-text);
  }
  button.ghost:not(:disabled):hover{ background:var(--veyro-accent-soft); }
  button.danger:not(:disabled):hover, .danger:hover{ background:var(--veyro-danger-soft); border-color:var(--veyro-danger); }
}
button:disabled, button[aria-disabled="true"]{ opacity:.5; cursor:not-allowed; }
/* Fokus: tydelig ring, aldrig kun farveskift. */
:where(button, a, input, select, textarea, summary, [tabindex], [role="radio"]):focus-visible{
  outline:2px solid var(--focus-ring); outline-offset:2px;
}
:where(.fp-desktop-sidebar, .app-header, .fp-main-nav, .fp-undo-toast) :where(button, a, input, select, [tabindex]):focus-visible{
  outline-color:var(--focus-ring-on-navy);
}

/* ---------- Formularfelter ------------------------------------------- */
.fp-app-shell :is(input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]):not([type=color]), select),
dialog :is(input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]):not([type=color]), select){
  min-height:var(--control-height); padding:0 var(--space-3);
}
.fp-app-shell :is(input, select, textarea), dialog :is(input, select, textarea){
  font:inherit; font-size:14px; color:var(--veyro-text); background-color:var(--veyro-surface);
  border:1px solid var(--veyro-border-strong); border-radius:var(--radius-md);
  max-width:100%; min-width:0;
}
.fp-app-shell textarea, dialog textarea{ padding:var(--space-2) var(--space-3); line-height:1.5; }
.fp-app-shell select:not([multiple]), dialog select:not([multiple]){
  appearance:none; -webkit-appearance:none; padding-right:34px; cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5 11 1.5' fill='none' stroke='%235b6b7b' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 12px center; background-size:12px 8px;
}
@media(hover:hover){
  .fp-app-shell :is(input, select, textarea):hover:not(:disabled):not(:focus){ border-color:color-mix(in srgb, var(--veyro-text-muted) 55%, var(--veyro-border)); }
}
.fp-app-shell :is(input, select, textarea):focus, dialog :is(input, select, textarea):focus{
  border-color:var(--veyro-primary); box-shadow:0 0 0 3px color-mix(in srgb, var(--veyro-accent) 25%, transparent); outline:none;
}
.fp-app-shell :is(input, select, textarea)::placeholder{ color:color-mix(in srgb, var(--veyro-text-muted) 80%, transparent); }
.fp-app-shell :is(.fp-field, .coach-form label, .goal-form label, #editForm label) > span:first-child{
  font-size:12.5px; font-weight:600; color:var(--veyro-text);
}
.fp-input-narrow{ width:84px; }
@media(max-width:700px){
  .fp-app-shell :is(input, select, textarea), dialog :is(input, select, textarea){ font-size:16px; }
}

/* ---------- Kort -------------------------------------------------------- */
.card, .fp-app-shell .card, .stat, .goal-card, .fp-feature-card,
.fp-today-card, .fp-coach-summary, .fp-week-card, .fp-summary-card, .fp-shortcut,
.fp-snapshot-tile, .fp-stat-tile{
  background:var(--veyro-surface); border:1px solid var(--veyro-border);
  border-radius:var(--radius-lg); box-shadow:var(--shadow-card);
}
.fp-app-shell .card, .fp-today-card, .fp-coach-summary, .fp-week-card, .fp-summary-card, .fp-shortcut{
  padding:var(--fp-card-pad);
}
.fp-snapshot-tile, .fp-stat-tile, .fp-app-shell .stat{ padding:var(--space-4); border-radius:var(--radius-md); box-shadow:none; }
/* Korthoved: titel + evt. handling på én linje. */
.fp-app-shell .card > .section-head:first-child{
  display:flex; align-items:center; justify-content:space-between; gap:var(--space-3); flex-wrap:wrap; margin-bottom:var(--space-3);
}
.fp-app-shell .card > .section-head:first-child h3{ margin:0; }
/* Fremhævede kort: kun en tynd accentkant — ikke store farveflader. */
.fp-coach-summary{ background:var(--veyro-surface); border-color:var(--veyro-border); border-left:3px solid var(--veyro-teal); }
.fp-coach-summary button{ width:auto; margin:var(--space-3) 0; }
.fp-coach-summary small{ font-size:var(--fs-meta); }

/* ---------- Badges ------------------------------------------------------ */
.badge, .goal-status, .subscription-badge, .fp-sport-label, .fp-calendar-legend span{
  display:inline-flex; align-items:center; min-height:22px; padding:2px 9px;
  border-radius:999px; font-size:11.5px; font-weight:600; line-height:1.3; letter-spacing:0;
}
.subscription-badge{ text-transform:uppercase; letter-spacing:.05em; font-size:10.5px; }

/* ---------- Statistikfelter -------------------------------------------- */
.fp-snapshot-tile strong, .fp-stat-tile strong, .fp-app-shell .stat .value{
  font-size:var(--fs-stat); font-weight:700; line-height:1.1; letter-spacing:-.02em; color:var(--veyro-text);
}
.fp-snapshot-label, .fp-stat-label, .fp-app-shell .stat .label{ font-size:12px; font-weight:600; color:var(--veyro-text-muted); }
.calendar-summary{ grid-template-columns:repeat(auto-fit, minmax(min(100%, 112px), 1fr)) !important; gap:var(--space-2); }
.calendar-summary div{ border-radius:var(--radius-md); padding:var(--space-2) var(--space-3); }

/* ---------- Tabeller ---------------------------------------------------- */
.fp-app-shell .table-wrap{ border:1px solid var(--veyro-border); border-radius:var(--radius-md); background:var(--veyro-surface); }
.fp-app-shell :is(th, td):not(.print-week-sheet *){ padding:10px 12px; font-size:13px; border-bottom:1px solid var(--veyro-border); }
.fp-app-shell thead th:not(.print-week-sheet *){
  background:var(--veyro-surface-soft); color:var(--veyro-text-muted);
  font-size:11.5px; font-weight:600; letter-spacing:.04em; text-transform:uppercase;
}
.fp-app-shell tbody tr:last-child > :is(td, th){ border-bottom:0; }
@media(hover:hover){
  .fp-app-shell tbody tr:hover{ outline:0; background-color:color-mix(in srgb, var(--veyro-accent-soft) 55%, transparent); }
}
.fp-mental-table thead th{ text-transform:none; letter-spacing:0; font-size:12px; }

/* ---------- Tabs / segmenteret navigation ------------------------------
   Coach-links, Mentalt Kompas, Admin og ugeskift deler ét udtryk. */
:is(.fp-mental-nav, #admin .admin-subnav, .fp-mental-week-pick){
  display:flex; flex-wrap:wrap; gap:2px; width:fit-content; max-width:100%;
  margin:0 0 var(--space-5); padding:3px;
  background:var(--veyro-surface); border:1px solid var(--veyro-border); border-radius:var(--radius-md);
}
/* Samme specificitet som :is()-listen ovenfor (den indeholder et id). */
:is(.fp-mental-nav, #admin .admin-subnav, .fp-mental-week-pick){ margin:0; }
.fp-mental-saved:empty{ display:none; }
:is(.fp-mental-nav, .fp-mental-week-pick) button,
#admin .admin-subnav .admin-subtab{
  min-height:34px !important; padding:0 var(--space-4) !important; flex:0 1 auto;
  background:transparent !important; color:var(--veyro-text) !important;
  border:0 !important; border-radius:var(--radius-sm) !important; box-shadow:none !important;
  font-size:13px; font-weight:600; white-space:nowrap;
}
:is(.fp-mental-nav button[aria-current="page"], .fp-mental-week-pick button[aria-pressed="true"]),
#admin .admin-subnav .admin-subtab.active{
  background:var(--veyro-navy) !important; color:#fff !important; box-shadow:none !important;
}
@media(hover:hover){
  :is(.fp-mental-nav, .fp-mental-week-pick) button:not([aria-current="page"]):not([aria-pressed="true"]):hover,
  #admin .admin-subnav .admin-subtab:not(.active):hover{ background:var(--veyro-surface-soft) !important; }
}
/* Undernavigation på tablet/mobil (desktop bruger sidebaren). */
.fp-app-shell > .fp-secondary-nav .tab{
  min-height:34px; min-width:0; padding:0 var(--space-3); border-radius:var(--radius-md);
  font-size:13px; font-weight:600; background:var(--veyro-surface); color:var(--veyro-text); border:1px solid var(--veyro-border);
}
.fp-app-shell > .fp-secondary-nav .tab.active{ background:var(--veyro-navy); border-color:var(--veyro-navy); color:#fff; }
@media(max-width:560px){
  /* Faner fylder rækken ud i stedet for at stå ujævnt. */
  :is(.fp-mental-nav, #admin .admin-subnav){ width:100%; }
  #fpMentalRoot .fp-mental-nav{ display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); }
  :is(.fp-mental-nav button, #admin .admin-subnav .admin-subtab){ flex:1 1 auto; padding:0 var(--space-2) !important; }
}

/* ---------- Dialoger og tooltips --------------------------------------- */
dialog{
  border:1px solid var(--veyro-border); border-radius:var(--radius-lg);
  box-shadow:var(--shadow-pop); padding:var(--space-6); max-width:calc(100vw - 32px);
}
dialog::backdrop{ background:rgba(3,19,31,.5); }
dialog :is(h2, h3):first-child{ margin-top:0; font-size:var(--fs-section); font-weight:650; letter-spacing:-.01em; }
dialog .dialog-actions{ gap:var(--space-2); }
@media(max-width:560px){ dialog{ padding:var(--space-4); } }
/* Native title-tooltips bruges (sidebar-rail); [data-tooltip] er klar til nye. */
[data-tooltip]{ position:relative; }
@media(hover:hover){
  [data-tooltip]:hover::after, [data-tooltip]:focus-visible::after{
    content:attr(data-tooltip); position:absolute; left:50%; bottom:calc(100% + 6px); transform:translateX(-50%);
    padding:4px 8px; border-radius:var(--radius-sm); background:var(--veyro-navy); color:#fff;
    font-size:12px; font-weight:500; white-space:nowrap; pointer-events:none; z-index:90;
  }
}

/* ---------- Sidebar ------------------------------------------------------ */
.fp-desktop-sidebar{
  padding:var(--space-4) var(--space-3);
  background:var(--veyro-navy); border-right:1px solid rgba(255,255,255,.06);
}
.fp-sidebar-brand{ gap:var(--space-2); padding:0 var(--space-2) var(--space-4); margin:0 0 var(--space-1); }
.fp-sidebar-logo{ max-width:168px; }
/* Produktnavnet står under virksomhedslogoet. */
.fp-sidebar-brand strong{
  font-size:15px; font-weight:650; letter-spacing:.01em; text-transform:none; color:#fff; gap:var(--space-2);
}
.fp-sidebar-brand strong::before{ width:3px; height:15px; border-radius:2px; background:var(--veyro-accent); }
.fp-sidebar-group{ gap:1px; padding:var(--space-2) 0; border-bottom:0; }
.fp-sidebar-group + .fp-sidebar-group{ border-top:1px solid rgba(255,255,255,.06); }
.fp-sidebar-label{ margin:var(--space-2) 10px var(--space-1); font-size:10.5px; letter-spacing:.11em; color:var(--veyro-on-navy-muted); }
.fp-sidebar-link{
  min-height:36px; padding:7px 10px; gap:10px; font-size:13.5px; font-weight:500;
  color:var(--veyro-on-navy-soft); border-radius:var(--radius-md) !important;
}
.fp-sidebar-link svg{ width:17px; height:17px; opacity:.85; }
.fp-sidebar-link[aria-current="page"]{
  background:color-mix(in srgb, var(--veyro-accent) 13%, var(--veyro-navy)); color:#fff; font-weight:600;
  box-shadow:inset 2px 0 0 var(--veyro-accent);
}
.fp-sidebar-link[aria-current="page"] svg{ opacity:1; color:var(--veyro-accent); }
@media(hover:hover){
  .fp-sidebar-link:not([aria-current="page"]):hover{ background:rgba(255,255,255,.05); color:#fff; }
}
@media(min-width:901px) and (max-width:1199px){
  .fp-sidebar-link{ min-height:40px; padding:8px 0; }
  .fp-sidebar-link svg{ width:19px; height:19px; }
}

/* ---------- Top (tablet/mobil) ------------------------------------------ */
@media(max-width:900px){
  :root{ --fp-header-h:var(--header-height); }
  body:has(.fp-app-shell:not(.ui-hidden)) .app-header{
    min-height:var(--header-height); padding:var(--space-2) var(--fp-inline);
    background:var(--veyro-navy); border-bottom:1px solid rgba(255,255,255,.06); align-items:center; flex-wrap:nowrap;
  }
  body:has(.fp-app-shell:not(.ui-hidden)) .app-header .header-main{ flex:1 1 auto; flex-direction:row; align-items:center; }
  body:has(.fp-app-shell:not(.ui-hidden)) .app-header .brand-logo-img{ height:28px; width:auto; }
  body:has(.fp-app-shell:not(.ui-hidden)) .app-header .brand-logo-title{
    font-size:14px; font-weight:650; letter-spacing:.01em; text-transform:none; color:#fff;
  }
  body:has(.fp-app-shell:not(.ui-hidden)) .app-header .header-actions{ align-items:center; }
  body:has(.fp-app-shell:not(.ui-hidden)) .header-account-toggle{
    min-height:36px !important; padding:0 var(--space-3); font-size:13px;
    background:rgba(255,255,255,.08); color:#fff; border:1px solid rgba(255,255,255,.16);
  }
  /* Gem-status under kontoknappen vises kun, når der er en fejl. */
  .app-header .fp-autosave-status{ font-size:10.5px; color:var(--veyro-on-navy-muted); text-align:right; }
  .app-header .fp-autosave-status:not([data-state="error"]){ display:none; }
}
@media(max-width:420px){
  body:has(.fp-app-shell:not(.ui-hidden)) .app-header .brand-logo-title{ font-size:13px; padding-left:var(--space-2); }
}

/* ---------- Tablet-navigation (701–900): navy-strimmel under headeren --- */
@media(min-width:701px) and (max-width:900px){
  .fp-app-shell > .fp-main-nav{
    position:sticky; top:var(--header-height); z-index:44;
    margin:calc(var(--space-4) * -1) calc(var(--fp-inline) * -1) var(--space-4);
    padding:0 var(--fp-inline); gap:0; min-height:0;
    background:var(--veyro-navy); border-radius:0; border-bottom:1px solid rgba(255,255,255,.06);
  }
  .fp-app-shell > .fp-main-nav button{
    min-height:44px; gap:var(--space-2); border-radius:0; font-size:13px; font-weight:600;
    color:var(--veyro-on-navy-soft); background:transparent;
  }
  .fp-app-shell > .fp-main-nav button[aria-current="page"]{ background:transparent; color:#fff; box-shadow:inset 0 -2px 0 var(--veyro-accent); }
}

/* ---------- Mobil bundnavigation (≤700) ---------------------------------- */
.fp-main-nav button svg{ width:20px; height:20px; flex:none; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
.fp-main-nav button[aria-current="page"] svg{ color:var(--veyro-accent); }
@media(max-width:700px){
  .fp-app-shell > .fp-main-nav, .fp-main-nav{
    padding:4px 4px calc(4px + env(safe-area-inset-bottom)); gap:0;
    background:var(--veyro-navy); border-top:1px solid rgba(255,255,255,.08); box-shadow:0 -6px 20px rgba(3,19,31,.18);
  }
  .fp-main-nav button{
    min-height:52px !important; padding:6px 2px !important; gap:3px; border-radius:var(--radius-md);
    font-size:10.5px; font-weight:600; letter-spacing:.01em; color:var(--veyro-on-navy-muted);
  }
  .fp-main-nav button[aria-current="page"]{ background:transparent; color:#fff; box-shadow:none; position:relative; }
  .fp-main-nav button[aria-current="page"]::before{
    content:""; position:absolute; top:0; left:30%; right:30%; height:2px; border-radius:0 0 2px 2px; background:var(--veyro-accent);
  }
  main.fp-app-shell{ padding-bottom:calc(var(--space-8) + 56px + env(safe-area-inset-bottom)); }
}

/* ---------- Overblik (dashboard) ----------------------------------------- */
.fp-overview-heading{
  grid-template-columns:minmax(0, 1fr) auto; align-items:center; gap:var(--space-1) var(--space-5);
  padding:0 0 var(--space-5); margin-bottom:var(--space-5); border-bottom:1px solid var(--veyro-border);
}
.fp-overview-heading h2{ margin:var(--space-1) 0 0; font-size:var(--fs-page); font-weight:700; line-height:1.2; letter-spacing:-.02em; }
.fp-overview-heading > .hint{ margin:0; }
.fp-overview-actions{ grid-row:1 / span 3; align-self:center; gap:var(--space-2); }
.fp-overview-actions button{ min-width:0; }
/* Plan-linjen: én diskret metadata-linje i stedet for en ekstra blok. */
.fp-plan-line{ margin:var(--space-3) 0 0; padding:0; border-top:0; gap:2px var(--space-2); align-items:center; }
.fp-plan-line #planHeaderTitle{ font-size:14px; font-weight:600; }
.fp-plan-line #planHeaderSubtitle{ font-size:var(--fs-meta); }
.fp-no-plan{ border-radius:var(--radius-lg); padding:var(--space-4) var(--space-5); background:var(--veyro-accent-soft); }
.fp-no-plan strong{ font-size:var(--fs-card); }

.fp-overview-hero{ gap:var(--space-4); }
.fp-today-card h3{ font-size:clamp(20px, 0.9vw + 13px, 26px); font-weight:700; line-height:1.2; letter-spacing:-.02em; margin:var(--space-2) 0 var(--space-1); }
.fp-today-card h4{ font-size:17px; }
.fp-today-card .fp-eyebrow{ margin-bottom:var(--space-3); }
.fp-workout-meta{ font-size:var(--fs-body); color:var(--veyro-text); margin:0 0 var(--space-1); }
.fp-workout-status{ font-size:var(--fs-meta); margin:0 0 var(--space-4); }
.fp-today-workout + .fp-today-workout{ margin-top:var(--space-4); padding-top:var(--space-4); }
.fp-coach-summary h3{ font-size:var(--fs-section); font-weight:650; margin:var(--space-2) 0; }
.fp-coach-summary p:not(.fp-eyebrow){ line-height:1.55; font-size:var(--fs-body); }
.fp-snapshot-section{ margin:var(--space-6) 0 var(--space-5); }
.fp-snapshot-grid{ grid-template-columns:repeat(auto-fit, minmax(min(100%, 170px), 1fr)) !important; gap:var(--space-3); }
.fp-snapshot-tile strong{ margin-top:var(--space-2); }
.fp-week-card, .fp-status-grid, .fp-overview-bottom{ margin:var(--space-5) 0; }
.fp-status-grid, .fp-overview-bottom{ gap:var(--space-4); }
.fp-week-grid{ gap:var(--space-2); }
.fp-week-day{ border-radius:var(--radius-md); padding:var(--space-2) 6px; background:var(--veyro-surface); }
.fp-week-day.is-today{ border-color:var(--veyro-teal); box-shadow:inset 0 2px 0 var(--veyro-teal); }
.fp-week-workout{ border-radius:var(--radius-sm); padding:var(--space-2) 6px; }
.fp-streak-card h3{ font-size:var(--fs-stat-lg); color:var(--veyro-text); }
.fp-summary-card h3{ font-size:var(--fs-card); font-weight:650; margin:var(--space-2) 0; }
.fp-shortcut strong{ font-size:var(--fs-card); margin-bottom:var(--space-1); }
.fp-shortcut span{ font-size:13px; }
@media(hover:hover){ .fp-shortcut:hover{ background:var(--veyro-surface-soft); border-color:color-mix(in srgb, var(--veyro-primary) 35%, var(--veyro-border)); } }
@container fp-panel (max-width:560px){
  .fp-overview-actions{ grid-row:auto; display:grid; grid-template-columns:1fr 1fr; width:100%; }
}

/* Performance: målkort i samme kortsprog. */
.goal-card{ padding:var(--space-4) var(--space-5); }
.goal-card h2{ font-size:var(--fs-card); font-weight:650; margin:var(--space-2) 0 var(--space-1); }
.goal-card.primary{ background:var(--veyro-surface); border-color:var(--veyro-border); box-shadow:inset 0 2px 0 var(--veyro-teal), var(--shadow-card); }
.goal-forecast strong{ font-size:var(--fs-stat); }
.goal-forecast small{ font-size:10.5px; }

/* ---------- Admin og konto: informationsgrid ----------------------------
   3 kolonner på brede skærme, 2 på mellem, 1 på mobil (auto-fit). */
.fp-app-shell #admin .admin-status-grid,
.fp-app-shell :is(.cloud-status-grid, .beta-status-grid){
  display:grid; grid-template-columns:repeat(auto-fit, minmax(min(100%, 240px), 1fr)) !important;
  gap:var(--space-2) var(--space-3);
}
.fp-app-shell :is(#admin .admin-status-grid, .cloud-status-grid, .beta-status-grid) > div{
  min-width:0; padding:var(--space-3); border-radius:var(--radius-md);
  background:var(--veyro-surface-soft); border:1px solid var(--veyro-border);
}
.fp-app-shell :is(#admin .admin-status-grid, .cloud-status-grid, .beta-status-grid) span{
  font-size:var(--fs-label); font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--veyro-text-muted);
}
.fp-app-shell :is(#admin .admin-status-grid, .cloud-status-grid, .beta-status-grid) strong{
  font-size:13.5px; font-weight:600; min-width:0; overflow-wrap:anywhere; word-break:break-word;
}
#admin.active{ gap:var(--space-4); }
#admin :is(td, th){ white-space:normal; }
@container fp-panel (min-width:1100px){
  .fp-app-shell #admin .admin-status-grid{ grid-template-columns:repeat(3, minmax(0, 1fr)) !important; }
}

/* ---------- Mentalt Kompas: samme komponenter som resten ----------------- */
.fp-mental-body{ gap:var(--space-4); }
.fp-mental-decision{ border-left:3px solid var(--veyro-teal); }
.fp-mental-next{ background:var(--veyro-surface-soft); border-color:var(--veyro-border); border-radius:var(--radius-md); }
.fp-mental-next strong{ font-size:var(--fs-card); }
.fp-mental-micro{ font-size:var(--fs-body); }
.fp-mental-mantra{ font-size:var(--fs-section); border-left-color:var(--veyro-teal); }
.fp-mental-notice{ border-radius:var(--radius-md); }
.fp-mental-goals li, .fp-mental-log li, .fp-mental-option, .fp-mental-link{ border-radius:var(--radius-md); border-color:var(--veyro-border); }
.fp-mental-goals li.is-a-goal{ background:var(--veyro-surface-soft); border-color:var(--veyro-border); box-shadow:inset 2px 0 0 var(--veyro-teal); }
.fp-mental-option:has(input:checked){ background:var(--veyro-accent-soft); border-color:var(--veyro-primary); }
.fp-mental-scale-option span{ border-radius:var(--radius-sm); border-color:var(--veyro-border-strong); min-height:var(--control-height); }
.fp-mental-scale-option input:checked + span{ background:var(--veyro-navy); border-color:var(--veyro-navy); }
@media(hover:hover){ .fp-mental-scale-option input:not(:checked):hover + span{ border-color:var(--veyro-primary); } }
.fp-mental-scale-option input:focus-visible + span{ outline:2px solid var(--focus-ring); outline-offset:2px; }
.fp-mental-choice{ min-height:var(--control-height); }
.fp-mental-choice[aria-checked="true"]{ background:var(--veyro-navy) !important; color:#fff !important; border-color:var(--veyro-navy) !important; }
.fp-mental-bar{ background:linear-gradient(to right, var(--veyro-teal) var(--fp-mental-fill, 0%), var(--veyro-border) var(--fp-mental-fill, 0%)); }
.fp-mental-visual summary{ font-size:var(--fs-card); }

/* ---------- Sider med stablede kort: ens rytme --------------------------- */
.fp-app-shell .panel > .card:not(:last-child){ margin-bottom:var(--space-4); }

/* ---------- Ingen vandret overflow, uanset indhold ----------------------- */
.fp-app-shell :is(p, li, dd, dt, h2, h3, h4){ overflow-wrap:break-word; }
.fp-app-shell :is(.mono, code, kbd){ overflow-wrap:anywhere; word-break:break-word; }

/* Link der ser ud som en sekundær knap (fx "Åbn mail" i Admin). */
.fp-link-button{
  display:inline-flex; align-items:center; justify-content:center; gap:var(--space-2);
  min-height:var(--control-height); padding:0 var(--space-4); border-radius:var(--radius-md);
  border:1px solid var(--veyro-border-strong); font-size:14px; font-weight:600; text-decoration:none;
}

/* Coach-genveje er hop til sektioner (ikke faner): små sekundære knapper. */
.fp-coach-links{ gap:var(--space-2); margin:0 0 var(--space-5); }
.fp-coach-links button{ min-height:34px; padding:0 var(--space-3); font-size:13px; border-color:var(--veyro-border-strong); }

/* Konto: sektionstitel og forklaring står samlet over sine kort. */
.fp-app-shell .settings-section > .settings-section-label{ margin:var(--space-6) 0 0; }
.fp-app-shell .settings-section > .settings-section-label + .hint{ margin:calc(var(--space-2) * -1) 0 var(--space-1); }

/* Admin-faner på smal skærm: én række, der kan scrolles vandret. */
@media(max-width:560px){
  #admin .admin-subnav{ flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none; overscroll-behavior-x:contain; }
  #admin .admin-subnav::-webkit-scrollbar{ display:none; }
  #admin .admin-subnav .admin-subtab{ flex:0 0 auto; padding:0 var(--space-3) !important; }
}

/* Undernavigationens faner er kompakte på alle skærme. En ældre regel giver
   alle knapper kontrolhøjden (44px på mobil) uden at undtage .tab. */
.fp-app-shell > .fp-secondary-nav .tab{ min-height:36px !important; padding:0 var(--space-3) !important; }

/* Diagrammer tegnet på <canvas> (800px bredt) må ikke skaleres op — det
   gør tekst og streger store og slørede på brede skærme. */
.dashboard-plan-chart canvas{ max-width:800px; }

/* Abonnementsbadge "basic" brugte en gammel himmelblå brandfarve. */
.subscription-badge.plan-basic{ background:var(--veyro-teal); color:#fff; }

/* ======================================================================
   Mentalt Kompas — premium coaching-dashboard (2026-10-14)
   Hero i fuld bredde; derunder hovedkolonne (status, udvikling, små skridt)
   og sidekolonne (mål, hvorfor). Smalt: én kolonne i fast rækkefølge.
   ====================================================================== */
/* Én centreret wrapper for overskrift, faner og dashboard. */
#mental > .fp-page-heading, #fpMentalRoot{ width:100%; max-width:1240px; margin-inline:auto; }
#mental > .fp-page-heading{ margin-bottom:var(--space-4); }
/* #fpMentalRoot har klassen fp-feature-root, som et ældre lag gør til to
   kolonner på brede skærme. Det lagde fanerne i en ellers tom venstre
   kolonne og skubbede alt indhold til højre. Her er det altid én kolonne. */
#fpMentalRoot.fp-feature-root{ display:grid; grid-template-columns:minmax(0, 1fr) !important; gap:var(--space-5); }
#fpMentalRoot.fp-feature-root > *{ grid-column:1 / -1; }
.fp-mental-body{ gap:var(--space-5); }

.fp-mental-dash{ display:grid; gap:var(--space-5); min-width:0; }
.fp-mental-grid{ display:grid; grid-template-columns:minmax(0, 1fr); gap:var(--space-5); align-items:start; min-width:0; }
.fp-mental-col{ display:grid; gap:var(--space-5); align-content:start; min-width:0; }
.fp-mental-dash .card{ margin:0; }
@container fp-panel (min-width:900px){
  .fp-mental-grid{ grid-template-columns:minmax(0, 2fr) minmax(300px, 1fr); }
}
@container fp-panel (max-width:899px){
  /* Kolonnerne opløses; kortene står i fast rækkefølge:
     status, mål, hvorfor, udvikling, små skridt. */
  .fp-mental-grid{ display:flex; flex-direction:column; align-items:stretch; }
  .fp-mental-col{ display:contents; }
  .fp-mental-grid [data-order="1"]{ order:1; }
  .fp-mental-grid [data-order="2"]{ order:2; }
  .fp-mental-grid [data-order="3"]{ order:3; }
  .fp-mental-grid [data-order="4"]{ order:4; }
  .fp-mental-grid [data-order="5"]{ order:5; }
}

/* Fælles lille versal-label. */
.fp-mental-kicker{
  display:block; margin:0 0 var(--space-1);
  font-size:var(--fs-label); font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--veyro-text-muted);
}

/* ---------- Hero: Min næste gode beslutning ---------- */
.fp-mental-hero{
  border-left:3px solid var(--veyro-teal);
  background:color-mix(in srgb, var(--veyro-accent-soft) 38%, var(--veyro-surface));
  padding:var(--space-5) var(--space-6);
}
.fp-app-shell .card > h3.fp-mental-hero-title{
  margin:0 0 var(--space-4); font-size:var(--fs-label); font-weight:700; letter-spacing:.09em; text-transform:uppercase; color:var(--veyro-primary);
}
.fp-mental-hero-body{ display:grid; gap:var(--space-4); }
.fp-mental-hero-when{ display:block; font-size:var(--fs-section); font-weight:650; line-height:1.3; color:var(--veyro-text); overflow-wrap:anywhere; }
.fp-mental-hero-what{ display:block; margin-top:2px; font-size:15px; color:var(--veyro-text); overflow-wrap:anywhere; }
.fp-mental-hero-step .fp-mental-micro{ margin:0 0 var(--space-3); font-size:15px; line-height:1.5; }
.fp-mental-hero-actions{ display:flex; flex-wrap:wrap; gap:var(--space-2); }
.fp-mental-hero-step{ padding-top:var(--space-4); border-top:1px solid var(--veyro-border); }
@container fp-panel (min-width:760px){
  .fp-mental-hero-body{ grid-template-columns:minmax(0, 1fr) minmax(0, 1.15fr); gap:var(--space-6); align-items:start; }
  .fp-mental-hero-step{ padding:0 0 0 var(--space-6); border-top:0; border-left:1px solid var(--veyro-border); }
}
@container fp-panel (max-width:560px){ .fp-mental-hero{ padding:var(--space-4); } }

/* ---------- Dagens status: kompakte 1–10-kontroller ---------- */
.fp-mental-form-compact{ gap:var(--space-3); }
.fp-mental-scales{ display:grid; gap:var(--space-3); }
.fp-mental-scale{ display:block; }
/* En flydende legend er ikke fieldsettets "rendered legend" og kan derfor
   stå til venstre for kontrollen. */
.fp-mental-scale > legend{ float:left; width:150px; margin:0; padding:7px var(--space-3) 0 0; font-size:13.5px; font-weight:600; }
.fp-mental-scale-control{ overflow:hidden; }
.fp-mental-scale .fp-mental-scale-row{ grid-template-columns:repeat(10, minmax(0, 1fr)); gap:4px; max-width:420px; }
.fp-mental-scale .fp-mental-scale-option span{
  min-height:32px; font-size:13px; font-weight:600; border-radius:var(--radius-sm);
  border-color:var(--veyro-border); background:var(--veyro-surface); color:var(--veyro-text);
}
.fp-mental-scale .fp-mental-scale-option input:checked + span{
  background:var(--veyro-primary); border-color:var(--veyro-primary); color:#fff;
}
@media(hover:hover){
  .fp-mental-scale .fp-mental-scale-option input:not(:checked):hover + span{ border-color:var(--veyro-primary); background:var(--veyro-accent-soft); }
}
.fp-mental-scale .fp-mental-scale-ends{ max-width:420px; margin-top:2px; }
.fp-mental-scale .fp-mental-scale-ends small{ font-size:11px; }
.fp-mental-form-compact .fp-form-actions{ margin:0; }
@container fp-panel (max-width:600px){
  .fp-mental-scale > legend{ float:none; width:auto; padding:0 0 var(--space-1); }
  .fp-mental-scale .fp-mental-scale-row, .fp-mental-scale .fp-mental-scale-ends{ max-width:none; }
  .fp-mental-scale .fp-mental-scale-option span{ min-height:36px; }
}

/* ---------- Sidekort: Mine mål og Mit hvorfor ---------- */
.fp-mental-side-card{ gap:var(--space-3); }
.fp-mental-empty{ display:grid; gap:var(--space-2); justify-items:start; }
.fp-mental-empty .hint, .fp-mental-empty-line{ margin:0; }
.fp-mental-goals li{
  display:grid; grid-template-columns:28px minmax(0, 1fr) auto; column-gap:var(--space-3); align-items:center;
  padding:var(--space-2) var(--space-3); background:var(--veyro-surface); box-shadow:none;
}
.fp-mental-goals li.is-a-goal{ background:var(--veyro-surface-soft); box-shadow:inset 2px 0 0 var(--veyro-teal); }
.fp-mental-goal-priority{
  display:grid; place-items:center; width:28px; height:28px; border-radius:50%;
  background:var(--veyro-surface-soft); border:1px solid var(--veyro-border);
  font-size:12px; font-weight:700; letter-spacing:0; color:var(--veyro-text); text-transform:none;
}
.is-a-goal .fp-mental-goal-priority{ background:var(--veyro-navy); border-color:var(--veyro-navy); color:#fff; }
.fp-mental-goal-text{ display:grid; min-width:0; }
.fp-mental-goal-text strong{ font-size:14px; overflow-wrap:anywhere; }
.fp-mental-goal-text small{ font-size:12px; color:var(--veyro-text-muted); }
.fp-mental-goal-count{ display:grid; justify-items:end; line-height:1.1; }
.fp-mental-goal-count strong{ font-size:18px; font-weight:700; font-variant-numeric:tabular-nums; color:var(--veyro-text); }
.fp-mental-goal-count small{ font-size:11px; color:var(--veyro-text-muted); }
.fp-mental-phase{ display:grid; gap:2px; padding-top:var(--space-3); border-top:1px solid var(--veyro-border); }
.fp-mental-phase strong{ font-size:14px; }
.fp-mental-phase .hint{ margin:2px 0 0; }

blockquote.fp-mental-mantra{
  margin:0; padding:0 0 0 var(--space-3); border-left:2px solid var(--veyro-teal);
  font-size:15px; font-weight:600; line-height:1.45; color:var(--veyro-text); overflow-wrap:anywhere;
}
.fp-mental-anchors li{ position:relative; display:grid; gap:1px; padding-left:var(--space-4); }
.fp-mental-anchors li::before{
  content:""; position:absolute; left:0; top:.55em; width:6px; height:6px; border-radius:50%; background:var(--veyro-teal);
}
.fp-mental-anchors strong{ font-size:13.5px; }
.fp-mental-anchors span{ font-size:13px; line-height:1.45; }
.fp-mental-card-action{ justify-self:start; padding-inline:var(--space-2) !important; }

/* ---------- Mental udvikling ---------- */
.fp-mental-trend{ gap:var(--space-3); }
.fp-mental-trend-legend{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:var(--space-2); }
.fp-mental-trend-legend li{
  display:grid; gap:2px; padding:var(--space-2) var(--space-3); min-width:0;
  background:var(--veyro-surface-soft); border:1px solid var(--veyro-border); border-radius:var(--radius-md);
}
.fp-mental-swatch{ display:block; width:14px; height:3px; border-radius:2px; background:var(--fp-swatch); }
.fp-mental-trend-label{ font-size:12px; color:var(--veyro-text-muted); line-height:1.3; }
.fp-mental-trend-legend .fp-mental-value{ font-size:18px; font-weight:700; color:var(--veyro-text); }
.fp-mental-chart{ display:block; width:100%; height:auto; max-height:180px; }
.fp-mental-chart-grid{ stroke:var(--veyro-border); stroke-width:1; }
.fp-mental-chart-axis{ fill:var(--veyro-text-muted); font-size:11px; font-family:var(--font-sans); }
.fp-mental-trend-table summary{ cursor:pointer; font-size:12.5px; font-weight:600; color:var(--veyro-primary); }
.fp-mental-trend-table[open] summary{ margin-bottom:var(--space-2); }
@container fp-panel (max-width:420px){
  .fp-mental-trend-legend li{ padding:var(--space-2); }
  .fp-mental-trend-legend .fp-mental-value{ font-size:16px; }
}

/* ---------- Mine små skridt: kompakt aktivitetslog ---------- */
ol.fp-mental-log{ list-style:none; margin:0; padding:0; display:block; }
.fp-mental-log li, .fp-mental-log li.is-done{
  position:relative; display:grid; grid-template-columns:20px minmax(0, 1fr) auto; column-gap:var(--space-3); align-items:start;
  padding:var(--space-2) 0; background:transparent; border:0; border-radius:0;
}
/* Tidslinje: en tynd streg forbinder markørerne. */
.fp-mental-log li:not(:last-child)::after{
  content:""; position:absolute; left:9.5px; top:calc(var(--space-2) + 22px); bottom:calc(var(--space-2) * -1 + 2px);
  width:1px; background:var(--veyro-border);
}
.fp-mental-log-mark{
  display:grid; place-items:center; width:20px; height:20px; margin-top:1px; border-radius:50%;
  border:1.5px solid color-mix(in srgb, var(--veyro-teal) 55%, var(--veyro-border)); background:var(--veyro-surface);
  font-size:11px; font-weight:700; line-height:1; color:#fff;
}
.is-done .fp-mental-log-mark{ background:var(--veyro-teal); border-color:var(--veyro-teal); }
.fp-mental-log-text{ display:grid; gap:1px; min-width:0; }
.fp-mental-log-text strong{ font-size:14px; font-weight:600; overflow-wrap:anywhere; }
.fp-mental-log-text small{ font-size:12px; color:var(--veyro-text-muted); }
.fp-mental-log li > button{ align-self:center; }
.fp-mental-log li > .fp-mental-status{ grid-column:2 / -1; }
.fp-mental-log li > .fp-mental-status:empty{ display:none; }

/* Mål: en ældre regel (li small{grid-column:2}) må ikke ramme de indre grids. */
.fp-mental-goals .fp-mental-goal-text small, .fp-mental-goals .fp-mental-goal-count small{ grid-column:auto; }
.fp-mental-goal-count{ grid-auto-flow:row; }
/* Dagens status på bredere kort: Lav · 1–10 · Høj på én linje. */
@container fp-panel (min-width:601px){
  .fp-mental-scale-control{ display:grid; grid-template-columns:auto minmax(0, 420px) auto; justify-content:start; align-items:center; column-gap:var(--space-2); }
  .fp-mental-scale .fp-mental-scale-ends{ display:contents; }
  .fp-mental-scale .fp-mental-scale-ends small:first-child{ order:0; }
  .fp-mental-scale .fp-mental-scale-row{ order:1; }
  .fp-mental-scale .fp-mental-scale-ends small:last-child{ order:2; }
  .fp-mental-scale > legend{ padding-top:6px; }
}
/* Log: handlingen står ved teksten frem for yderst til højre. */
.fp-mental-log li{ grid-template-columns:20px minmax(0, max-content) auto; justify-content:start; }
.fp-mental-log li > button{ margin-left:var(--space-3); }
@container fp-panel (max-width:600px){
  .fp-mental-log li{ grid-template-columns:20px minmax(0, 1fr); }
  .fp-mental-log li > button{ grid-column:2; justify-self:start; margin:var(--space-1) 0 0; }
}

/* ======================================================================
   Performance: "Planlagt distance" (2026-10-14) — tre kompakte
   disciplinelementer i stedet for det store canvas-diagram. Tallene kommer
   fra drawChart() i app.js; canvasset findes stadig, men er skjult.
   ====================================================================== */
.dashboard-plan-chart{ gap:var(--space-3) !important; padding:var(--space-5) !important; }
.dashboard-plan-chart canvas[hidden]{ display:none !important; }
.fp-plan-dist-head{ display:flex; flex-wrap:wrap; align-items:baseline; gap:2px var(--space-3); }
.fp-app-shell .dashboard-plan-chart .fp-plan-dist-head h3{ margin:0; }
.fp-plan-dist-head .hint{ margin:0; }
.fp-plan-dist{ display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:var(--space-3); }
.fp-plan-dist-item{
  --dist-ink:var(--veyro-primary);
  display:grid; gap:var(--space-1); min-width:0; padding:var(--space-3) var(--space-4);
  background:var(--veyro-surface-soft); border:1px solid var(--veyro-border); border-radius:var(--radius-md);
}
/* Sportsfarverne er de etablerede datakategorier (--fp-swim/-bike/-run). */
.fp-plan-dist-swim{ --dist-ink:var(--fp-swim); }
.fp-plan-dist-bike{ --dist-ink:var(--fp-bike); }
.fp-plan-dist-run{ --dist-ink:var(--fp-run); }
.fp-plan-dist-label{
  display:flex; align-items:center; gap:var(--space-2);
  font-size:var(--fs-label); font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--veyro-text-muted);
}
.fp-plan-dist-label::before{ content:""; width:8px; height:8px; border-radius:50%; background:var(--dist-ink); flex:none; }
.fp-plan-dist-value{ font-size:var(--fs-stat); font-weight:700; line-height:1.1; letter-spacing:-.02em; color:var(--veyro-text); font-variant-numeric:tabular-nums; }
.fp-plan-dist-bar{ display:block; height:6px; margin-top:var(--space-1); border-radius:3px; background:var(--veyro-border); overflow:hidden; }
.fp-plan-dist-bar > span{ display:block; height:100%; border-radius:3px; background:var(--dist-ink); }
.fp-plan-dist-note{ font-size:12px; color:var(--veyro-text-muted); }
@container fp-panel (max-width:520px){
  /* Mobil: tre kompakte rækker — label og tal på én linje, bar og note under. */
  .fp-plan-dist{ grid-template-columns:minmax(0, 1fr); gap:var(--space-2); }
  .fp-plan-dist-item{ grid-template-columns:minmax(0, 1fr) auto; align-items:center; column-gap:var(--space-3); padding:var(--space-2) var(--space-3); }
  .fp-plan-dist-value{ font-size:18px; }
  .fp-plan-dist-bar, .fp-plan-dist-note{ grid-column:1 / -1; }
}