/* ══════════════════════════════════════════════════════════════
   Prep2Fly Übungs-Interface v2 (12.10.2026) – Optik der Verkaufsseite v14
   Richtung „A Hell & ruhig“ + zweispaltiges Menü am breiten Desktop.
   Wird nach dem Designsystem (pit_p2f_design_system_css) geladen und gilt nur
   in den Übungs-Apps (.p2f-training-app:not(.p2f-dashboard-app)). Aufgaben, Timing und Bewertung
   bleiben unverändert – hier ändert sich nur die Hülle.
   Vorlage/Herleitung: designs/uebungen-v1/ (base/a/c.css)
   ══════════════════════════════════════════════════════════════ */
@font-face { font-family: 'General Sans'; src: url('../sales-v12/fonts/GeneralSans-Regular.woff2') format('woff2'); font-weight: 400; font-display: swap; }
@font-face { font-family: 'General Sans'; src: url('../sales-v12/fonts/GeneralSans-Medium.woff2') format('woff2'); font-weight: 500; font-display: swap; }
@font-face { font-family: 'General Sans'; src: url('../sales-v12/fonts/GeneralSans-Semibold.woff2') format('woff2'); font-weight: 600; font-display: swap; }
@font-face { font-family: 'P2F Mono'; src: url('../sales-v12/fonts/jetbrains-mono-500-normal.woff2') format('woff2'); font-weight: 400 600; font-display: swap; }

/* ---------- Tokens ---------- */
.p2f-training-app:not(.p2f-dashboard-app), .p2f-training-app:not(.p2f-dashboard-app) .p2f-shell {
  --p2f-font-display: 'General Sans', system-ui, sans-serif;
  --p2f-font-label: 'General Sans', system-ui, sans-serif;
  --p2f-font-body: 'General Sans', system-ui, sans-serif;
  --p2f-font-mono: 'P2F Mono', ui-monospace, monospace;
  --p2f-text: #2A3A4E; --p2f-text-secondary: #5E6E82; --p2f-text-tertiary: #7D8CA0;
  --p2f-bg: #F4F6F9; --p2f-border: #E3E8EE; --p2f-hairline: #E3E8EE;
  --p2f-signal: #D63F14; --p2f-signal-hover: #B9340E;
  --p2f-accent: #0D1B2A; --p2f-accent-hover: #24364C; --p2f-accent-subtle: rgba(13,27,42,.06); --p2f-accent-glow: rgba(13,27,42,.12);
  --p2f-radius-sm: 10px; --p2f-radius-md: 12px; --p2f-radius-xl: 20px;
}
body.p2f-fullscreen:has(.p2f-training-app:not(.p2f-dashboard-app)), .p2f-shell.p2f-training-app:not(.p2f-dashboard-app) { background: #F4F6F9 !important; background-image: none !important; }

/* ---------- Menü ---------- */
.p2f-training-app:not(.p2f-dashboard-app) .p2f-menu { width: min(760px, 94vw) !important; max-height: none !important; overflow: visible !important; box-shadow: 0 1px 2px rgba(13,27,42,.06) !important; border: 1px solid #E3E8EE !important; }
.p2f-training-app:not(.p2f-dashboard-app) .p2f-menu-header { background: #fff !important; background-image: none !important; padding: 28px 32px 8px !important; }
.p2f-training-app:not(.p2f-dashboard-app) .p2f-menu-header::before { display: none !important; }
.p2f-training-app:not(.p2f-dashboard-app) .p2f-menu-title { color: #0D1B2A !important; font-family: 'General Sans', sans-serif !important; letter-spacing: -.02em !important; font-size: 34px !important; }
.p2f-training-app:not(.p2f-dashboard-app) .p2f-menu-kicker { color: #5E6E82 !important; text-transform: none !important; letter-spacing: 0 !important; font-size: 14px !important; font-weight: 500 !important; }
.p2f-training-app:not(.p2f-dashboard-app) .p2f-back-dashboard { color: #5E6E82 !important; text-transform: none !important; letter-spacing: 0 !important; font-size: 14px !important; }
.p2f-training-app:not(.p2f-dashboard-app) .p2f-back-dashboard:hover { color: #0D1B2A !important; }
.p2f-training-app:not(.p2f-dashboard-app) .p2f-menu-instruction-btn { background: transparent !important; color: #0D1B2A !important; border: 1.5px solid #C9D2DD !important; border-radius: 999px !important; text-transform: none !important; letter-spacing: 0 !important; font-size: 14px !important; padding: 8px 16px !important; }
.p2f-training-app:not(.p2f-dashboard-app) .p2f-menu-instruction-btn:hover { background: #F4F6F9 !important; }
.p2f-training-app:not(.p2f-dashboard-app) .p2f-menu-subtitle { padding: 0 32px !important; font-size: 16px !important; line-height: 1.55 !important; color: #5E6E82 !important; }
.p2f-training-app:not(.p2f-dashboard-app) .p2f-menu-label, .p2f-training-app:not(.p2f-dashboard-app) .p2f-chip-label, .p2f-training-app:not(.p2f-dashboard-app) .p2f-slider-label, .p2f-training-app:not(.p2f-dashboard-app) .p2f-section-label { text-transform: none !important; letter-spacing: 0 !important; font-size: 14px !important; font-weight: 600 !important; color: #2A3A4E !important; }
.p2f-training-app:not(.p2f-dashboard-app) .p2f-menu-label::before { display: none !important; }
.p2f-training-app:not(.p2f-dashboard-app) .p2f-slider-value { color: #0D1B2A !important; }
.p2f-training-app:not(.p2f-dashboard-app) .p2f-checkbox-text, .p2f-training-app:not(.p2f-dashboard-app) .p2f-hint, .p2f-training-app:not(.p2f-dashboard-app) .p2f-footer-hint { font-size: 14px !important; }

/* Start direkt unter die Level-Auswahl: ohne Scrollen startbar */
.p2f-training-app:not(.p2f-dashboard-app) .p2f-menu-content { display: flex !important; flex-direction: column; }
.p2f-training-app:not(.p2f-dashboard-app) .p2f-menu-content > * { order: 3; }
.p2f-training-app:not(.p2f-dashboard-app) .p2f-menu-content > .p2f-preset-section { order: 1; }
.p2f-training-app:not(.p2f-dashboard-app) .p2f-menu-content > .p2f-start-section { order: 2; margin: 20px 0 8px !important; }

/* Level: segmentierte Auswahl */
.p2f-training-app:not(.p2f-dashboard-app) .p2f-preset-bar { background: #F4F6F9 !important; padding: 4px !important; border-radius: 999px !important; gap: 4px !important; }
.p2f-training-app:not(.p2f-dashboard-app) .p2f-preset-btn { border: 0 !important; background: transparent !important; border-radius: 999px !important; text-transform: none !important; letter-spacing: 0 !important; font-size: 15px !important; color: #5E6E82 !important; box-shadow: none !important; }
.p2f-training-app:not(.p2f-dashboard-app) .p2f-preset-btn:hover { color: #0D1B2A !important; }
.p2f-training-app:not(.p2f-dashboard-app) .p2f-preset-btn.is-selected { background: #fff !important; color: #0D1B2A !important; box-shadow: 0 1px 3px rgba(13,27,42,.15) !important; font-weight: 600 !important; }

/* Einstellungen: Pillen-Gruppen */
.p2f-training-app:not(.p2f-dashboard-app) .p2f-chip-group { background: #F4F6F9; padding: 3px; border-radius: 18px; display: inline-flex !important; flex-wrap: wrap; gap: 2px !important; }
.p2f-training-app:not(.p2f-dashboard-app) .p2f-chip { border: 0 !important; background: transparent !important; border-radius: 999px !important; font-size: 13.5px !important; color: #5E6E82 !important; padding: 6px 14px !important; }
.p2f-training-app:not(.p2f-dashboard-app) .p2f-chip:hover { color: #0D1B2A !important; }
.p2f-training-app:not(.p2f-dashboard-app) .p2f-chip.is-selected { background: #fff !important; color: #0D1B2A !important; box-shadow: 0 1px 3px rgba(13,27,42,.15) !important; }
.p2f-training-app:not(.p2f-dashboard-app) .p2f-checkbox.is-checked { background: #0D1B2A !important; border-color: #0D1B2A !important; }
.p2f-training-app:not(.p2f-dashboard-app) input[type=range], .p2f-training-app:not(.p2f-dashboard-app) input[type=checkbox], .p2f-training-app:not(.p2f-dashboard-app) input[type=radio] { accent-color: #0D1B2A; }

/* Start-Knopf: Orange nur für den Aufruf */
.p2f-training-app:not(.p2f-dashboard-app) .p2f-btn--start { border-radius: 999px !important; text-transform: none !important; letter-spacing: 0 !important; font-size: 17px !important; padding: 15px 44px !important; box-shadow: none !important; background: #D63F14 !important; }
.p2f-training-app:not(.p2f-dashboard-app) .p2f-btn--start:hover { background: #B9340E !important; }

/* ---------- Aufgabenleiste ---------- */
.p2f-training-app:not(.p2f-dashboard-app) .p2f-game-header { background: #fff !important; color: #0D1B2A !important; border-bottom: 1px solid #E3E8EE !important; }
.p2f-training-app:not(.p2f-dashboard-app) .p2f-badge { background: #F4F6F9 !important; color: #0D1B2A !important; border: 0 !important; text-transform: none !important; letter-spacing: 0 !important; font-family: 'P2F Mono', monospace !important; border-radius: 999px !important; }
.p2f-training-app:not(.p2f-dashboard-app) .p2f-quit-btn { color: #0D1B2A !important; background: #F4F6F9 !important; border: 0 !important; border-radius: 999px !important; }

/* ---------- Ergebnis ---------- */
.p2f-training-app:not(.p2f-dashboard-app) .p2f-result-card { box-shadow: 0 1px 2px rgba(13,27,42,.06) !important; border-color: #E3E8EE !important; }
.p2f-training-app:not(.p2f-dashboard-app) .p2f-result-card h2 { font-family: 'General Sans', sans-serif !important; text-transform: none !important; letter-spacing: -.02em !important; color: #0D1B2A !important; }
.p2f-training-app:not(.p2f-dashboard-app) .p2f-result-card h2::before, .p2f-training-app:not(.p2f-dashboard-app) .p2f-result-card::after { display: none !important; }

/* ---------- Zweispaltiges Menü am breiten Desktop ---------- */
@media (min-width: 1100px) {
  .p2f-training-app:not(.p2f-dashboard-app) .p2f-menu { width: min(1080px, 92vw) !important; }
  .p2f-training-app:not(.p2f-dashboard-app) .p2f-menu-content { display: grid !important; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 48px; row-gap: 0; align-items: start; padding: 24px 32px 32px !important; }
  .p2f-training-app:not(.p2f-dashboard-app) .p2f-menu-content > * { grid-column: 1; }
  .p2f-training-app:not(.p2f-dashboard-app) .p2f-menu-content > .p2f-settings-divider, .p2f-training-app:not(.p2f-dashboard-app) .p2f-menu-content > .p2f-menu-label { display: none; }
  .p2f-training-app:not(.p2f-dashboard-app) .p2f-menu-content > .p2f-preset-section { grid-row: 1; }
  .p2f-training-app:not(.p2f-dashboard-app) .p2f-menu-content > .p2f-start-section { grid-row: 2; text-align: left !important; margin: 20px 0 !important; }
  .p2f-training-app:not(.p2f-dashboard-app) .p2f-menu-content > .p2f-settings-grid { grid-column: 2; grid-row: 1 / span 6; grid-template-columns: 1fr !important; row-gap: 18px !important; background: #F4F6F9; border-radius: 16px; padding: 20px; }
  .p2f-training-app:not(.p2f-dashboard-app) .p2f-menu-content > .p2f-settings-grid .p2f-chip-group { background: #fff; }
  .p2f-training-app:not(.p2f-dashboard-app) .p2f-preset-bar { flex-direction: column; border-radius: 16px !important; }
  .p2f-training-app:not(.p2f-dashboard-app) .p2f-preset-btn { text-align: left !important; padding: 14px 16px !important; border-radius: 12px !important; }
}

/* ---------- Knöpfe in Ergebnis + Instruktion: Pillen, Orange nur für den Hauptaufruf ---------- */
.p2f-training-app:not(.p2f-dashboard-app) .p2f-btn, .p2f-training-app:not(.p2f-dashboard-app) .p2f-instruction-nav button { border-radius: 999px !important; text-transform: none !important; letter-spacing: 0 !important; font-family: 'General Sans', sans-serif !important; font-weight: 600 !important; }
.p2f-training-app:not(.p2f-dashboard-app) .p2f-result-actions .p2f-btn--primary { background: #D63F14 !important; border-color: #D63F14 !important; color: #fff !important; }
.p2f-training-app:not(.p2f-dashboard-app) .p2f-result-actions .p2f-btn--primary:hover { background: #B9340E !important; }
.p2f-training-app:not(.p2f-dashboard-app) .p2f-btn--success { background: transparent !important; color: #0D1B2A !important; border: 1.5px solid #C9D2DD !important; box-shadow: none !important; }
.p2f-training-app:not(.p2f-dashboard-app) .p2f-btn--success:hover { background: #F4F6F9 !important; }
.p2f-training-app:not(.p2f-dashboard-app) .p2f-score-context__label { text-transform: none !important; letter-spacing: 0 !important; font-size: 13px !important; font-weight: 600 !important; color: #5E6E82 !important; }

/* ══════════════════════════════════════════════════════════════
   Dashboard in derselben Sprache (12.10.2026): dunkler Kopf wie die
   dunklen v14-Kapitel, darunter ruhig hell; Navy statt Kobalt.
   ══════════════════════════════════════════════════════════════ */
#p2f-dashboard.p2f-dashboard-app {
  --d-cobalt: #0D1B2A; --d-cobalt-deep: #24364C; --d-cobalt-subtle: rgba(13,27,42,.06);
  --d-signal: #D63F14;
  --d-text: #2A3A4E; --d-text-secondary: #5E6E82; --d-text-tertiary: #7D8CA0;
  --d-bg: #F4F6F9; --d-border: #E3E8EE;
  --d-font-display: 'General Sans', system-ui, sans-serif;
  --d-font-label: 'General Sans', system-ui, sans-serif;
  --d-font-body: 'General Sans', system-ui, sans-serif;
  --d-font-mono: 'P2F Mono', ui-monospace, monospace;
  --d-radius: 14px;
  background: #F4F6F9 !important; background-image: none !important;
}
body.p2f-fullscreen:has(.p2f-dashboard-app) { background: #F4F6F9 !important; background-image: none !important; }
.p2f-dashboard-app .p2f-dash-header { background: #070C14 !important; background-image: none !important; }
.p2f-dashboard-app .p2f-dash-header::after { display: none !important; }
.p2f-dashboard-app .p2f-dash-kicker, .p2f-dashboard-app .p2f-dash-stat-label, .p2f-dashboard-app .p2f-readiness-eyebrow,
.p2f-dashboard-app .p2f-readiness-band, .p2f-dashboard-app .p2f-readiness-bar-labels, .p2f-dashboard-app .p2f-readiness-bar-labels span,
.p2f-dashboard-app .p2f-dash-strips-label .label, .p2f-dashboard-app .p2f-dash-card-stat-label, .p2f-dashboard-app .p2f-dash-card-readiness,
.p2f-dashboard-app .p2f-dash-card-btn { text-transform: none !important; letter-spacing: 0 !important; }
.p2f-dashboard-app .p2f-dash-strips-label .label { font-size: 15px !important; font-weight: 600 !important; color: #0D1B2A !important; }
.p2f-dashboard-app .p2f-dash-strips-label .label::before { display: none !important; }
.p2f-dashboard-app .p2f-readiness-eyebrow { color: #5E6E82 !important; font-size: 14px !important; font-weight: 600 !important; }
.p2f-dashboard-app .p2f-dash-card-stat-label { font-size: 12px !important; color: #7D8CA0 !important; }
.p2f-dashboard-app .p2f-dash-card-readiness { font-size: 13.5px !important; font-weight: 600 !important; }
.p2f-dashboard-app .p2f-dash-card { border-radius: 14px !important; border-left-width: 1px !important; border-color: #E3E8EE !important; box-shadow: 0 1px 2px rgba(13,27,42,.05) !important; }
.p2f-dashboard-app .p2f-dash-card:hover { box-shadow: 0 6px 20px rgba(13,27,42,.08) !important; }
.p2f-dashboard-app .p2f-strip-id { letter-spacing: .02em !important; }
.p2f-dashboard-app .p2f-dash-card-btn { border-radius: 999px !important; border: 1.5px solid #C9D2DD !important; color: #0D1B2A !important; font-size: 15px !important; padding: 10px 22px !important; }
.p2f-dashboard-app .p2f-dash-card-btn:hover { background: #0D1B2A !important; border-color: #0D1B2A !important; color: #fff !important; }
.p2f-dashboard-app .p2f-readiness, .p2f-dashboard-app section[class*=readiness] { border-radius: 20px !important; }
.p2f-dashboard-app .p2f-dash-title, .p2f-dashboard-app h1, .p2f-dashboard-app h2, .p2f-dashboard-app h3 { font-family: 'General Sans', system-ui, sans-serif !important; letter-spacing: -.01em !important; }
.p2f-dashboard-app .p2f-dash-user-avatar { background: rgba(255,255,255,.14) !important; color: #fff !important; }
.p2f-dashboard-app .p2f-dash-kicker { color: #A7B3C2 !important; }

/* ---------- Handy (13.10.2026): Dashboard-Knopf lesbar, Tippflächen ≥ 40 px, Titel nicht abgeschnitten ---------- */
@media (max-width: 760px) {
  /* Am Handy ist der Knopf gefüllt (dashboard.php) – Schrift muss dann weiß sein, sonst Navy auf Navy */
  .p2f-dashboard-app .p2f-dash-card-btn:not(.p2f-dash-card-btn--disabled) { background: #0D1B2A !important; border-color: #0D1B2A !important; color: #fff !important; min-height: 42px; }
  .p2f-dashboard-app .p2f-dash-titles { padding-left: 8px !important; }
  .p2f-dashboard-app .p2f-dash-header-left { gap: 8px !important; }
  .p2f-dashboard-app .p2f-dash-title { font-size: 1rem !important; letter-spacing: -.02em !important; }
}
@media (max-width: 760px), (pointer: coarse) {
  .p2f-training-app:not(.p2f-dashboard-app) .p2f-chip { min-height: 40px; padding: 8px 16px !important; display: inline-flex !important; align-items: center; justify-content: center; }
  .p2f-training-app:not(.p2f-dashboard-app) .p2f-back-dashboard { display: inline-flex !important; align-items: center; min-height: 40px; }
  .p2f-shell .p2f-method-trigger { min-height: 40px; }
  .mic-back { display: inline-flex; align-items: center; min-height: 40px; }
}
/* Handy Vollbild: Menü-Karte randlos und so hoch wie ihr Inhalt (vorher fest 100 % hoch → Rahmen endete mitten in den Einstellungen) */
@media (max-width: 767px) {
  /* Instruktion: Text klebte am linken Rand; oben Platz für die Community-Pille */
  body.p2f-fullscreen .p2f-training-app:not(.p2f-dashboard-app) .p2f-instruction-panel { padding: 64px 20px 28px !important; border: 0 !important; box-shadow: none !important; }
  /* Ergebnis: Pille überlappte die Überschrift, Rahmen am Bildschirmrand wirkte verloren */
  body.p2f-fullscreen .p2f-training-app:not(.p2f-dashboard-app) .p2f-result-card { padding-top: 64px !important; border: 0 !important; box-shadow: none !important; border-radius: 0 !important; }
  body.p2f-fullscreen .p2f-training-app:not(.p2f-dashboard-app) .p2f-menu { width: 100% !important; height: auto !important; min-height: 100%; align-self: flex-start; flex-shrink: 0; border: 0 !important; box-shadow: none !important; }
}