/* AP26 rollback: freigegebener AP25-Stand */
/*
 * PlayLevel Design System – Mira handoff for Linus
 * Direction: premium football academy, inspired by COACHEDBY® Club
 * This file contains presentation only. No production deployment by Mira.
 */

@font-face {
  font-family: "Inter";
  src: url("/assets/fonts/inter-variable.woff2.txt") format("woff2-variations");
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
}

@font-face {
  font-family: "Cal Sans";
  src: url("/assets/fonts/cal-sans-variable.woff2.txt") format("woff2-variations");
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
}

:root {
  --pl-ink: #261a18;
  --pl-brown: #522a27;
  --pl-brown-soft: #704138;
  --pl-cream: #f3efe7;
  --pl-paper: #fbf9f4;
  --pl-sage: #a6d49f;
  --pl-olive: #9cb380;
  --pl-terra: #c73e1d;
  --pl-gold: #c59849;
  --pl-gold-text: #755315;
  --pl-olive-text: #4f6538;
  --pl-muted: #786763;
  --pl-line: rgba(82, 42, 39, 0.14);
  --pl-shadow: 0 28px 80px rgba(54, 32, 28, 0.13);
  --pl-display: "Cal Sans", system-ui, sans-serif;
  --pl-ui: "Inter", system-ui, sans-serif;
  --pl-sans: var(--pl-ui);
  --pl-type-reading: 1rem;
  --pl-type-ui: .875rem;
  --pl-type-ui-small: .75rem;
  --pl-header-height: 86px;
  --pl-content-width: 1340px;
  --pl-shell-width: 1120px;
  --pl-space-1: 8px;
  --pl-space-2: 16px;
  --pl-space-3: 24px;
  --pl-space-4: 36px;
  --pl-space-5: 56px;
  --pl-radius-sm: 12px;
  --pl-radius-md: 18px;
  --pl-radius-lg: 28px;
  --pl-content-surface-radius: 3px;
  --pl-content-surface-padding: clamp(34px, 5vw, 72px);
  --pl-image-golden-ratio: 1.618 / 1;
}

* { box-sizing: border-box; }
html { overflow-x: clip; scroll-behavior: smooth; background: var(--pl-cream); }
body {
  margin: 0;
  overflow-x: clip;
  color: var(--pl-ink);
  font-family: var(--pl-sans);
  font-size: var(--pl-type-reading);
  line-height: 1.6;
  background:
    linear-gradient(rgba(82, 42, 39, 0.026) 1px, transparent 1px),
    linear-gradient(90deg, rgba(82, 42, 39, 0.026) 1px, transparent 1px),
    var(--pl-cream);
  background-size: 52px 52px;
}

:where(h1, h2, h3) {
  font-family: var(--pl-display);
  font-synthesis: none;
}

:where(h4, h5, h6, p, li, dt, dd, th, td, label, legend, small, figcaption) {
  font-family: var(--pl-ui);
}

:where(button, input, select, textarea, optgroup, option) {
  font-family: var(--pl-ui) !important;
}

/* Header and navigation */
.pl-header {
  position: sticky;
  top: 0;
  z-index: 20;
  min-height: var(--pl-header-height);
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  padding-inline: max(24px, calc((100vw - var(--pl-content-width)) / 2));
  border-bottom: 1px solid var(--pl-line);
  background: rgba(243, 239, 231, 0.9);
  backdrop-filter: blur(22px) saturate(1.1);
  transition: min-height .2s ease, padding .2s ease, box-shadow .2s ease;
}
.pl-header[data-header-state="scrolled"] { min-height: 66px; box-shadow: 0 10px 30px rgba(54,32,28,.09); }
.pl-header[data-header-state="scrolled"] .pl-brand__logo { width: 132px; }
.pl-header[data-header-state="menu-open"] { box-shadow: 0 10px 30px rgba(54,32,28,.12); }
.pl-header[data-header-state="dialog-open"] { pointer-events: none; opacity: .72; }
.pl-brand { display: flex; align-items: center; gap: 12px; color: inherit; text-decoration: none; font-weight: 850; }
.pl-brand__mark {
  width: 44px; height: 44px; display: grid; place-items: center;
  border-radius: 50%; color: white; background: var(--pl-brown);
  font-size: 10px; letter-spacing: 0.12em; transition: 0.35s ease;
}
.pl-brand:hover .pl-brand__mark { transform: rotate(-9deg) scale(1.06); background: var(--pl-terra); }
.pl-brand:focus-visible { outline: 3px solid var(--pl-gold-text); outline-offset: 5px; border-radius: 2px; }
.pl-brand__logo { display: block; width: clamp(132px,13vw,172px); height: auto; }
.pl-nav { display: flex; gap: 2px; padding: 0; border: 0; background: transparent; }
.pl-nav__link {
  position: relative; padding: 10px 16px; border-radius: 999px; color: var(--pl-muted);
  text-decoration: none; font-size: 11px; font-weight: 750; outline: none;
  transition: color .18s, background .18s, transform .18s, box-shadow .18s;
}
.pl-nav__link:hover { color: var(--pl-brown); background: rgba(255,255,255,.75); transform: translateY(-1px); }
.pl-nav__link:focus-visible { color: var(--pl-brown); background: white; box-shadow: 0 0 0 3px rgba(197,152,73,.38); }
.pl-nav__link.is-current,
.pl-nav__link[aria-current="page"],
.pl-nav__link[aria-current="location"] { color: white; background: var(--pl-brown); }
.pl-header__account { justify-self: end; display: flex; align-items: center; gap: 12px; }
.pl-season { min-height: 44px; padding: 9px 13px; border: 1px solid var(--pl-line); border-radius: 999px; color: var(--pl-brown); background: rgba(255,255,255,.48); font: 750 11px var(--pl-sans); cursor: pointer; }
.pl-season:focus-visible { outline: 3px solid var(--pl-gold-text); outline-offset: 2px; }

/* Breadcrumbs on knowledge pages */
.pl-breadcrumb { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 4px 0 58px; color: var(--pl-muted); font-size: 11px; line-height: 1.5; }
.pl-breadcrumb a { color: var(--pl-brown); font-weight: 750; text-decoration: none; text-underline-offset: 3px; }
.pl-breadcrumb a:hover { color: var(--pl-terra); text-decoration: underline; }
.pl-breadcrumb a:focus-visible { outline: 3px solid var(--pl-gold-text); outline-offset: 3px; }
.pl-breadcrumb span[aria-hidden="true"] { color: rgba(82,42,39,.38); }
.pl-breadcrumb [aria-current="page"] { color: var(--pl-muted); }

/* Equal-weight recommendations on knowledge articles */
.pl-article .pl-related {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-auto-rows: minmax(72px, auto);
  gap: 12px;
  margin: 18px 0 28px;
}
.pl-article .pl-related > a {
  position: relative;
  display: flex;
  min-width: 0;
  min-height: 72px;
  align-items: center;
  padding: 16px 48px 16px 18px;
  border: 1px solid var(--pl-line);
  border-radius: 12px;
  color: var(--pl-ink);
  background: var(--pl-cream);
  font-size: 14px;
  font-weight: 750;
  line-height: 1.35;
  overflow-wrap: anywhere;
  text-decoration: none;
  transition: background .18s ease, border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.pl-article .pl-related > a::after {
  position: absolute;
  right: 18px;
  content: "\2192";
  color: var(--pl-brown-soft);
  font-size: 18px;
  line-height: 1;
  transition: transform .18s ease;
}
.pl-article .pl-related > a:hover {
  border-color: rgba(82, 42, 39, .3);
  color: var(--pl-ink);
  background: var(--pl-paper);
  box-shadow: 0 10px 26px rgba(54, 32, 28, .09);
  text-decoration: none;
  transform: translateY(-2px);
}
.pl-article .pl-related > a:hover::after { transform: translateX(3px); }
.pl-article .pl-related > a:active {
  background: #ebe1d2;
  box-shadow: none;
  transform: translateY(0);
}
.pl-article .pl-related > a:focus-visible {
  outline: 3px solid var(--pl-gold-text);
  outline-offset: 3px;
  color: var(--pl-ink);
  text-decoration: none;
}

/* LIN-093: robuste, gemeinsam nutzbare Teaser- und Aktionsflächen */
.pl-article-card {
  position: relative;
  display: grid;
  min-width: 0;
  grid-template-rows: auto 1fr;
  border: 1px solid var(--pl-line);
  border-radius: 18px;
  color: var(--pl-ink);
  background: var(--pl-paper);
  overflow: clip;
  text-decoration: none;
}
.pl-article-card__media {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  background: var(--pl-cream);
  overflow: hidden;
}
.pl-article-card__media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.pl-article-card__body { min-width: 0; padding: clamp(16px, 2.4vw, 22px); }
.pl-article-card :is(h2,h3,p) { overflow-wrap: anywhere; }
.pl-article-card :is(h2,h3) { margin-block: 0 .45rem; line-height: 1.08; }
.pl-article-card p { margin: 0; color: var(--pl-muted); }
.pl-article-card:hover { color: var(--pl-ink); border-color: rgba(82,42,39,.32); box-shadow: var(--pl-shadow); text-decoration: none; }
.pl-article-card:focus-visible { outline: 3px solid var(--pl-gold-text); outline-offset: 3px; text-decoration: none; }
.pl-orientation-card > a,
.pl-magazine-card > a {
  color: inherit;
  text-decoration: none !important;
}
.pl-orientation-card > a:hover,
.pl-orientation-card > a:focus-visible,
.pl-magazine-card > a:hover,
.pl-magazine-card > a:focus-visible { color: inherit; text-decoration: none !important; }
.pl-team-tile > a {
  display: inline-flex;
  width: fit-content;
  min-height: 44px;
  align-items: center;
  color: inherit;
  font-weight: 750;
  overflow-wrap: anywhere;
  text-decoration: none;
}
.pl-team-tile > a:hover { color: inherit; text-decoration: underline; text-underline-offset: 4px; }
.pl-team-tile > a:focus-visible { outline: 3px solid var(--pl-gold-text); outline-offset: 3px; }
#training-framework-step,
#training-focus-step { max-width: 760px; margin-inline: auto; }
#training-framework-step[hidden],
#training-focus-step[hidden] { display: none; }
#training-framework-step .pl-condition-check,
#training-focus-step .pl-schedule-field { margin-top: 18px; }

/* LIN-092: fokussierter Planungsraum statt langer Mischseite */
.pl-planning-room-main {
  width: min(calc(100% - 40px), 1040px);
  min-height: calc(100dvh - var(--pl-header-height, 86px) - 180px);
  padding: clamp(20px, 3vw, 36px) 0 44px;
}
.pl-planning-room {
  display: grid;
  gap: clamp(18px, 2.5vw, 28px);
}
.pl-planning-room__intro {
  max-width: 760px;
}
.pl-planning-room__intro h1 {
  max-width: 18ch;
  margin: 6px 0 10px;
  font-size: clamp(2.15rem, 5vw, 4.25rem);
  line-height: .98;
}
.pl-planning-room__intro > p:last-child {
  max-width: 68ch;
  margin: 0;
  color: var(--pl-muted);
  font-size: var(--pl-type-reading);
  line-height: 1.55;
}
.pl-planning-room__decision {
  display: grid;
  gap: 14px;
  padding: clamp(20px, 3vw, 32px);
  border: 1px solid var(--pl-line);
  border-radius: 22px;
  background: linear-gradient(145deg, var(--pl-paper), #fffaf4);
  box-shadow: 0 18px 55px rgba(82,42,39,.08);
}
.pl-planning-room__decision h2,
.pl-planning-room__decision p {
  margin: 0;
}
.pl-planning-room__decision > p {
  max-width: 66ch;
  color: var(--pl-muted);
}
.pl-planning-room__step {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  color: var(--pl-muted);
  font-size: .875rem;
  font-weight: 750;
}
.pl-planning-room__step strong {
  color: var(--pl-brown);
}
.pl-planning-room__actions,
.pl-planning-context__actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
}
.pl-planning-context {
  display: grid;
  gap: 12px;
  padding: 16px;
  border-left: 4px solid var(--pl-terra);
  background: rgba(255,255,255,.72);
}
.pl-planning-context[hidden] { display: none; }
.pl-text-link {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 8px;
  color: var(--pl-brown);
  text-underline-offset: 4px;
}
.pl-journey--compact {
  margin: 0;
  padding: 14px;
  border-radius: 18px;
}
.pl-journey--compact li {
  min-height: 62px;
  padding: 9px;
}
.pl-journey--compact strong,
.pl-journey--compact small,
.pl-journey--compact p {
  font-size: .75rem;
}
.pl-plan-result-view {
  animation: pl-lin094-reveal .36s ease-out both;
}
.pl-condition-check {
  margin: 14px 0;
  padding: 16px;
  border: 1px solid var(--pl-line);
  border-radius: 16px;
  background: rgba(255,255,255,.58);
}
.pl-condition-check legend {
  padding-inline: 6px;
  font-weight: 850;
}
.pl-condition-check__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 12px;
}
.pl-condition-check__grid label {
  display: grid;
  gap: 6px;
}
.pl-condition-check__grid select {
  width: 100%;
  min-height: 44px;
}
dialog[open] {
  animation: pl-lin094-reveal .32s ease-out both;
}
@keyframes pl-lin094-reveal {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}
@media (max-width: 760px) {
  .pl-planning-room-main {
    width: min(calc(100% - 24px), 1040px);
    min-height: calc(100dvh - var(--pl-header-height, 72px) - 140px);
    padding: 14px 0 28px;
  }
  .pl-planning-room__intro h1 {
    font-size: clamp(2rem, 10vw, 3rem);
  }
  .pl-planning-room__intro > p:last-child {
    display: none;
  }
  .pl-planning-room__decision {
    padding: 18px 16px;
    border-radius: 16px;
  }
  .pl-planning-room__actions,
  .pl-planning-context__actions {
    display: grid;
    grid-template-columns: 1fr;
  }
  .pl-planning-room__actions > *,
  .pl-planning-context__actions > * {
    width: 100%;
    min-height: 48px;
  }
  .pl-journey--compact li:not(.is-current):not(.is-complete):not(.is-next) {
    display: none;
  }
  .pl-condition-check__grid {
    grid-template-columns: 1fr;
  }
}
@media (prefers-reduced-motion: reduce) {
  dialog[open],
  .pl-plan-result-view {
    animation: none !important;
    transition: none !important;
  }
}

@media (max-width: 760px) {
  .pl-article .pl-related {
    grid-template-columns: minmax(0, 1fr);
    gap: 10px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .pl-article .pl-related > a,
  .pl-article .pl-related > a::after { transition: none; }
}

/* Desktop mega menu and mobile off-canvas */
.pl-menu-toggle { display: none; min-width: 48px; min-height: 48px; border: 1px solid var(--pl-line); color: var(--pl-brown); background: var(--pl-paper); font: 800 10px var(--pl-sans); letter-spacing: .08em; text-transform: uppercase; cursor: pointer; }
.pl-mega-trigger { min-height: 48px; padding: 0 18px; border: 0; color: var(--pl-muted); background: transparent; font: 800 11px var(--pl-sans); cursor: pointer; }
.pl-mega-trigger:hover,.pl-mega-trigger[aria-expanded="true"] { color: var(--pl-brown); background: rgba(255,255,255,.76); }
.pl-mega-trigger.is-current { color: white; background: var(--pl-brown); }
.pl-mega-trigger:focus-visible,.pl-menu-toggle:focus-visible { outline: 3px solid var(--pl-gold-text); outline-offset: 3px; }
.pl-mega-panel { position: fixed; top: var(--pl-header-height); right: 0; left: 0; z-index: 19; display: grid; grid-template-columns: 1.15fr 1fr 1fr .85fr; gap: 34px; padding: 38px max(24px,calc((100vw - var(--pl-content-width))/2)); border-top: 1px solid var(--pl-line); border-bottom: 1px solid var(--pl-line); background: var(--pl-paper); box-shadow: var(--pl-shadow); }
.pl-mega-panel[hidden] { display: none; }
.pl-mega-panel__title { margin: 0 0 12px; color: var(--pl-brown); font: 400 28px var(--pl-display); }
.pl-mega-panel__label { display: block; margin: 0 0 9px; color: var(--pl-terra); font: 850 9px var(--pl-sans); letter-spacing: .12em; text-transform: uppercase; }
.pl-mega-panel__link { display: block; padding: 7px 0; color: var(--pl-ink); text-decoration: none; font-size: 13px; }
.pl-mega-panel__link:hover { color: var(--pl-terra); transform: translateX(3px); }
.pl-mega-panel__link.is-current { padding-left: 10px; border-left: 3px solid var(--pl-terra); color: var(--pl-brown); font-weight: 800; }
.pl-mega-panel__link:focus-visible,.pl-mega-panel__action:focus-visible { outline: 3px solid var(--pl-gold-text); outline-offset: 3px; }

@media (min-width: 981px) {
  .pl-nav {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: 128px;
    gap: 2px;
    border-radius: 3px;
  }
  .pl-nav > .pl-mega-trigger,
  .pl-nav > .pl-nav__link {
    box-sizing: border-box;
    width: 128px;
    min-width: 128px;
    height: 48px;
    min-height: 48px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 14px;
    border-radius: 2px;
    font-family: var(--pl-sans);
    font-size: 11px;
    font-weight: 750;
    line-height: 1.2;
    text-align: center;
    white-space: nowrap;
  }
  .pl-nav > .pl-mega-trigger { border: 0; transition: color .16s ease, background .16s ease, box-shadow .16s ease; }
  .pl-nav > .pl-mega-trigger > span { display: inline-block; transform: scale(1); transition: transform .16s ease; }
  .pl-nav > .pl-mega-trigger:hover > span,
  .pl-nav > .pl-mega-trigger:focus-visible > span,
  .pl-nav > .pl-mega-trigger[aria-expanded="true"] > span { transform: scale(1.07); }
  .pl-nav > .pl-mega-trigger:hover,
  .pl-nav > .pl-nav__link:hover { transform: translateY(-1px); }
  .pl-nav > .pl-mega-trigger[aria-expanded="true"] {
    color: var(--pl-brown);
    background: rgba(255,255,255,.82);
    box-shadow: inset 0 -3px 0 var(--pl-terra);
  }
  .pl-nav > .pl-mega-trigger:focus-visible,
  .pl-nav > .pl-nav__link:focus-visible {
    outline: 3px solid var(--pl-gold-text);
    outline-offset: 3px;
    box-shadow: none;
  }
}
.pl-mega-panel__feature { padding: 22px; color: white; background: var(--pl-brown); }
.pl-mega-panel__action { padding: 0; border: 0; color: white; background: none; font: 400 20px var(--pl-display); text-align: left; cursor: pointer; }
.pl-offcanvas { position: fixed; inset: 0 0 0 auto; z-index: 50; width: min(92vw,420px); padding: 24px; overflow-y: auto; color: var(--pl-ink); background: var(--pl-paper); box-shadow: -20px 0 60px rgba(38,26,24,.22); transform: translateX(105%); visibility: hidden; transition: transform .28s ease,visibility .28s; }
.pl-offcanvas.is-open { transform: translateX(0); visibility: visible; }
.pl-offcanvas__backdrop { position: fixed; inset: 0; z-index: 49; border: 0; background: rgba(38,26,24,.58); }
.pl-offcanvas__backdrop[hidden] { display: none; }
.pl-menu-toggle--close { display: grid; place-items: center; margin: 0 0 30px auto; }
.pl-offcanvas__group { padding: 18px 0; border-top: 1px solid var(--pl-line); }
.pl-offcanvas__link { display: flex; justify-content: space-between; min-height: 52px; align-items: center; color: var(--pl-ink); text-decoration: none; font: 400 22px var(--pl-display); }
.pl-offcanvas__link:hover { color: var(--pl-terra); }
.pl-offcanvas__link.is-current { padding-inline: 10px; border-left: 3px solid var(--pl-terra); color: var(--pl-brown); background: white; }
.pl-offcanvas__link:focus-visible { outline: 3px solid var(--pl-gold-text); outline-offset: 3px; }
.pl-shell-mega-panel { grid-template-columns: repeat(3,minmax(0,1fr)); }
.pl-shell-mega-panel--orientation { grid-template-columns: repeat(2,minmax(0,420px)); justify-content: center; }
.pl-offcanvas__group--compact .pl-mega-panel__link { min-height: 40px; padding: 9px 0; border-bottom: 1px solid rgba(82,42,39,.08); }
.pl-asset-caption { display: block; margin: 8px 14px; color: var(--pl-muted); font-size: 11px; line-height: 1.35; }
.pl-scroll-locked { overflow: hidden; }

/* Sections */
.pl-main { width: min(calc(100% - 48px), var(--pl-content-width)); margin: 0 auto; padding: 34px 0 110px; }
.pl-section { scroll-margin-top: calc(var(--pl-header-height) + 18px); }
.pl-kicker { margin: 0 0 11px; color: var(--pl-terra); font-size: 9px; font-weight: 850; letter-spacing: .2em; text-transform: uppercase; }
.pl-display { margin: 0; font-family: var(--pl-display); font-weight: 400; letter-spacing: -.035em; line-height: .94; }

/* Hero */
.pl-hero {
  position: relative; overflow: hidden; min-height: 620px; display: grid;
  grid-template-columns: minmax(0,1fr) 250px; grid-template-rows: 1fr auto;
  gap: 28px; align-items: center; padding: 76px 72px 46px; color: white;
  background: radial-gradient(circle at 82% 24%, rgba(166,212,159,.2), transparent 21%), linear-gradient(126deg,#301d1a,#522a27 54%,#744035);
  box-shadow: 0 32px 90px rgba(51,28,24,.24);
}
.pl-hero__title { max-width: 900px; font-size: clamp(54px, 6.4vw, 94px); }
.pl-hero__title em { color: var(--pl-sage); font-weight: inherit; }
.pl-hero__copy { max-width: 600px; margin: 30px 0 0; color: rgba(255,255,255,.72); font-size: 15px; line-height: 1.75; }
.pl-hero__actions { align-self: end; display: grid; gap: 10px; }
.pl-hero__actions .pl-button { display: inline-flex; align-items: center; justify-content: center; text-decoration: none; }
.pl-hero__meta { grid-column: 1 / -1; display: flex; justify-content: space-between; gap: 24px; padding-top: 30px; border-top: 1px solid rgba(255,255,255,.16); }

/* Buttons */
.pl-button { min-height: 48px; padding: 13px 18px; border: 1px solid transparent; border-radius: 2px; font: 800 10px var(--pl-sans); letter-spacing: .095em; text-transform: uppercase; cursor: pointer; transition: .2s ease; }
.pl-button:hover { transform: translateY(-2px); }
.pl-button:focus-visible { outline: 3px solid rgba(197,152,73,.5); outline-offset: 3px; }
.pl-button--primary { color: var(--pl-brown); background: var(--pl-sage); }
.pl-button--primary:hover { background: #c2e9bc; }
.pl-button--ghost { color: white; border-color: rgba(255,255,255,.36); background: transparent; }
.pl-button--ghost:hover { color: var(--pl-brown); background: white; }
.pl-button--dark { color: white; background: var(--pl-brown); }
.pl-button--dark:hover { background: var(--pl-terra); }
.pl-button--light { color: var(--pl-brown); border-color: var(--pl-line); background: white; }

/* Metrics and cards */
.pl-metrics { display: grid; grid-template-columns: repeat(3,1fr); gap: 1px; margin: 18px 0; border: 1px solid var(--pl-line); background: var(--pl-line); }
.pl-metrics-empty { margin: 18px 0; padding: 34px; border: 1px solid var(--pl-line); background: var(--pl-paper); text-align: center; }
.pl-metrics-empty h2 { margin: 0 0 8px; color: var(--pl-brown); font: 400 28px var(--pl-display); }
.pl-metrics-empty p { max-width: 620px; margin: 0 auto 20px; color: var(--pl-muted); line-height: 1.6; }
.pl-metric { min-height: 148px; padding: 25px; background: var(--pl-paper); transition: background .2s; }
.pl-metric:hover { background: white; }
.pl-metric__head { position: relative; display: flex; align-items: center; gap: 7px; }
.pl-metric__label { color: var(--pl-muted); font-size: 9px; font-weight: 750; letter-spacing: .09em; text-transform: uppercase; }
.pl-metric__value { display: block; margin: 8px 0 3px; font: 400 35px var(--pl-display); }
.pl-metric__value--pending { max-width: 190px; font-size: 22px; line-height: 1.15; }
.pl-metric__note { margin: 9px 0 0; color: var(--pl-muted); font-size: 10px; line-height: 1.45; }
.pl-metric-info { display: inline-grid; width: 20px; height: 20px; padding: 0; place-items: center; border: 1px solid var(--pl-muted); border-radius: 50%; color: var(--pl-brown); background: white; font: 800 11px var(--pl-sans); cursor: pointer; }
.pl-metric-info:focus-visible { outline: 3px solid var(--pl-gold-text); outline-offset: 2px; }
.pl-metric-tooltip { position: absolute; z-index: 6; top: calc(100% + 9px); left: 0; display: none; width: min(290px, calc(100vw - 64px)); padding: 14px; border: 1px solid var(--pl-line); box-shadow: var(--pl-shadow); color: var(--pl-ink); background: white; font-size: 11px; font-weight: 500; line-height: 1.5; letter-spacing: 0; text-transform: none; }
.pl-metric-tooltip strong { display: block; margin-bottom: 4px; color: var(--pl-brown); font-size: 12px; }
.pl-metric__head:hover .pl-metric-tooltip,.pl-metric__head:focus-within .pl-metric-tooltip,.pl-metric__head.is-open .pl-metric-tooltip { display: block; }
.pl-grid { display: grid; grid-template-columns: 1.12fr .88fr; gap: 18px; }
.pl-card { padding: 34px; border: 1px solid var(--pl-line); border-radius: 3px; background: rgba(251,249,244,.92); transition: box-shadow .3s, transform .3s; }
.pl-card:hover { transform: translateY(-3px); box-shadow: var(--pl-shadow); }
.pl-card__title { margin: 0; font: 400 28px var(--pl-display); letter-spacing: -.04em; }
.pl-balance { display: grid; gap: 18px; margin-top: 28px; }
.pl-balance__row { display: grid; grid-template-columns: 145px 1fr 44px; gap: 14px; align-items: center; font-size: 12px; font-weight: 750; }
.pl-balance__track { position: relative; height: 9px; border-radius: 99px; background: #e7e0d6; }
.pl-balance__actual { height: 100%; border-radius: inherit; background: linear-gradient(90deg,var(--pl-brown),var(--pl-terra)); }
.pl-balance__goal { position: absolute; top: -4px; width: 2px; height: 17px; background: var(--pl-ink); }
.pl-session-plan { display: grid; grid-template-columns: repeat(4,1fr); gap: 8px; margin: 22px 0; }
.pl-session-plan div { padding: 12px; border: 1px solid var(--pl-line); background: white; }
.pl-session-plan strong,.pl-session-plan span { display: block; }
.pl-session-plan strong { color: var(--pl-terra); font-size: 11px; }
.pl-session-plan span { margin-top: 4px; color: var(--pl-muted); font-size: 10px; line-height: 1.4; }
.pl-history { display: grid; margin-top: 20px; }
.pl-history__item { display: grid; grid-template-columns: 48px 1fr auto; gap: 14px; align-items: center; padding: 14px 0; border-bottom: 1px solid var(--pl-line); }
.pl-history__date { text-align: center; color: var(--pl-muted); font-size: 9px; }
.pl-history__date strong { display: block; color: var(--pl-brown); font: 400 19px var(--pl-display); }
.pl-history__item h3 { margin: 0 0 4px; font-size: 13px; }
.pl-history__item p { margin: 0; color: var(--pl-muted); font-size: 10px; }
.pl-history__intensity { color: var(--pl-gold-text); font-size: 10px; font-weight: 800; }
.pl-goal-list { display: flex; flex-wrap: wrap; gap: 8px; margin: 22px 0; }
.pl-goal { padding: 9px 12px; border: 1px solid var(--pl-line); background: white; color: var(--pl-brown); font: 750 11px var(--pl-sans); cursor: pointer; }
.pl-goal.is-current { color: white; background: var(--pl-brown); }
.pl-goal:focus-visible,.pl-text-button:focus-visible { outline: 3px solid var(--pl-gold-text); outline-offset: 2px; }
.pl-text-button { padding: 0; border: 0; color: var(--pl-terra); background: none; font: 800 11px var(--pl-sans); cursor: pointer; }

/* Styles / football schools */
.pl-styles { position: relative; margin: 70px 0 18px; padding: 58px 52px; border: 1px solid var(--pl-line); background: var(--pl-paper); }
.pl-styles__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 32px; margin-bottom: 38px; }
.pl-styles__title { max-width: 690px; font-size: clamp(42px,5vw,72px); }
.pl-role-switch { display: flex; padding: 3px; border: 1px solid var(--pl-line); border-radius: 2px; background: #ece6db; }
.pl-role-switch__button { padding: 10px 15px; border: 0; border-radius: 1px; color: var(--pl-muted); background: transparent; font: 800 9px var(--pl-sans); letter-spacing: .08em; text-transform: uppercase; cursor: pointer; }
.pl-role-switch__button:hover { color: var(--pl-brown); background: rgba(255,255,255,.55); }
.pl-role-switch__button:focus-visible { outline: 3px solid rgba(197,152,73,.45); outline-offset: 2px; }
.pl-role-switch__button.is-current,
.pl-role-switch__button[aria-pressed="true"] { color: white; background: var(--pl-brown); }
.pl-style-grid { display: grid; grid-template-columns: repeat(12,1fr); gap: 14px; }
.pl-style-card { --style-accent: var(--pl-olive); position: relative; min-height: 390px; grid-column: span 5; padding: 30px; border: 1px solid var(--pl-line); background: white; transition: .35s cubic-bezier(.2,.8,.2,1); }
.pl-style-card:nth-child(1), .pl-style-card:nth-child(4) { grid-column: span 7; }
.pl-style-card::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 3px; background: var(--style-accent); }
.pl-style-card:hover { transform: translateY(-7px); box-shadow: var(--pl-shadow); }
.pl-style-card--catenaccio { --style-accent: var(--pl-brown); }
.pl-style-card--total { --style-accent: var(--pl-gold-text); }
.pl-style-card--masia { --style-accent: var(--pl-terra); }
.pl-style-card--france { --style-accent: var(--pl-olive-text); }
.pl-style-card__era { color: var(--style-accent); font-size: 9px; font-weight: 850; letter-spacing: .15em; text-transform: uppercase; }
.pl-style-card__title { margin: 9px 0 14px; font: 400 34px var(--pl-display); }
.pl-style-card__summary { color: var(--pl-muted); font-size: 13px; line-height: 1.6; }
.pl-perspective[hidden] { display: none; }
.pl-perspective__title { margin-top: 24px; font-size: 9px; letter-spacing: .1em; text-transform: uppercase; }
.pl-perspective__list { display: grid; gap: 8px; padding: 0; list-style: none; }
.pl-perspective__list li { position: relative; padding-left: 17px; font-size: 12px; line-height: 1.5; }
.pl-perspective__list li::before { content: ""; position: absolute; left: 1px; top: .55em; width: 6px; height: 6px; background: var(--style-accent); transform: rotate(45deg); }

/* Pep start-page content */
.pl-content-section { margin: 32px 0; padding: clamp(34px,5vw,72px); border: 1px solid var(--pl-line); background: rgba(255,255,255,.5); }
.pl-content-section--paper { background: var(--pl-paper); }
.pl-content-section__title { max-width: 900px; margin: 8px 0 20px; color: var(--pl-brown); font-size: clamp(38px,5vw,72px); line-height: .98; }
.pl-content-section__lead { max-width: 850px; color: var(--pl-muted); font-size: 16px; line-height: 1.75; }
.pl-feature-grid,.pl-step-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 16px; margin: 34px 0 0; padding: 0; list-style: none; }
.pl-feature-grid--two { grid-template-columns: repeat(2,1fr); }
.pl-feature-grid article,.pl-step-grid li { padding: 25px; border: 1px solid var(--pl-line); background: white; }
.pl-feature-grid h3,.pl-step-grid strong { display: block; margin: 0 0 11px; color: var(--pl-brown); font: 400 22px var(--pl-display); }
.pl-feature-grid p,.pl-feature-grid li,.pl-step-grid span,.pl-content-section--split p,.pl-content-section--split li { color: var(--pl-muted); font-size: 13px; line-height: 1.65; }
.pl-step-grid { grid-template-columns: repeat(4,1fr); counter-reset: steps; }
.pl-step-grid li { counter-increment: steps; }
.pl-step-grid li::before { content: "0" counter(steps); display: block; margin-bottom: 28px; color: var(--pl-terra); font-weight: 850; }
.pl-content-section--split { display: grid; grid-template-columns: 1fr 1fr; gap: 50px; }
.pl-content-section--split ul { padding-left: 20px; }
.pl-total-time { margin: 18px 0; color: var(--pl-brown); }
.pl-save-note { color: var(--pl-muted); font-size: 11px; line-height: 1.5; }
.pl-button:disabled { cursor: not-allowed; opacity: .58; }
.pl-closing { text-align: center; background: var(--pl-brown); color: white; }
.pl-closing .pl-content-section__title { margin-inline: auto; color: white; }
.pl-closing .pl-hero__actions { max-width: 600px; margin: 28px auto 0; }

/* Local training-plan library */
.pl-training-plans { background: var(--pl-paper); }
.pl-training-plans__head { display: flex; justify-content: space-between; gap: 24px; align-items: start; }
.pl-local-notice { margin: 24px 0; padding: 18px 20px; border: 1px solid var(--pl-gold-text); border-left: 4px solid var(--pl-gold-text); background: #fffaf0; }
.pl-local-notice strong { color: var(--pl-brown); font-size: 13px; }
.pl-local-notice p { margin: 6px 0 0; color: var(--pl-muted); font-size: 12px; line-height: 1.6; }
.pl-plan-toolbar { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; margin-bottom: 18px; }
.pl-plan-toolbar label { color: var(--pl-brown); font-size: 10px; font-weight: 800; }
.pl-plan-toolbar select { width: 100%; min-height: 44px; display: block; margin-top: 6px; padding: 10px; border: 1px solid var(--pl-line); color: var(--pl-ink); background: white; }
.pl-save-status { min-height: 20px; color: var(--pl-olive-text); font-size: 11px; font-weight: 750; }
.pl-save-status.is-error { color: var(--pl-terra); }
.pl-plan-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 14px; }
.pl-plan-card { padding: 20px; border: 1px solid var(--pl-line); background: white; }
.pl-plan-card__head { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.pl-plan-status { padding: 5px 8px; border: 1px solid var(--pl-line); color: var(--pl-brown); background: var(--pl-cream); font-size: 9px; font-weight: 850; text-transform: uppercase; }
.pl-plan-card h3 { display: -webkit-box; margin: 16px 0 7px; overflow: hidden; color: var(--pl-brown); font: 400 22px var(--pl-display); -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.pl-plan-card > p { display: -webkit-box; min-height: 38px; overflow: hidden; color: var(--pl-muted); font-size: 12px; line-height: 1.55; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.pl-plan-card dl { display: grid; grid-template-columns: repeat(3,1fr); gap: 7px; margin: 18px 0; }
.pl-plan-card dl div { padding: 8px; background: var(--pl-paper); }
.pl-plan-card dt { color: var(--pl-muted); font-size: 8px; text-transform: uppercase; }
.pl-plan-card dd { margin: 4px 0 0; color: var(--pl-brown); font-size: 10px; font-weight: 800; }
.pl-plan-card small { color: var(--pl-muted); font-size: 9px; }
.pl-plan-card__actions { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 18px; }
.pl-plan-card__actions button { min-height: 44px; padding: 9px 10px; border: 1px solid var(--pl-line); color: var(--pl-brown); background: white; font: 750 9px var(--pl-sans); cursor: pointer; }
.pl-plan-card__actions button:hover { color: white; background: var(--pl-brown); }
.pl-plan-card__actions button:focus-visible,.pl-plan-toolbar select:focus-visible { outline: 3px solid var(--pl-gold-text); outline-offset: 2px; }
.pl-empty-state { padding: 42px; border: 1px dashed var(--pl-line); text-align: center; background: white; }
.pl-empty-state h3 { margin: 0; color: var(--pl-brown); font: 400 24px var(--pl-display); }
.pl-empty-state p { color: var(--pl-muted); }
.pl-plan-transfer { display: flex; justify-content: space-between; gap: 24px; align-items: center; margin-top: 28px; padding-top: 22px; border-top: 1px solid var(--pl-line); }
.pl-plan-transfer h3 { margin: 0; color: var(--pl-brown); font: 400 20px var(--pl-display); }
.pl-plan-transfer p { color: var(--pl-muted); font-size: 11px; }
.pl-plan-transfer > div:last-child { display: flex; flex-wrap: wrap; gap: 8px; }
.pl-plan-transfer label.pl-button { display: inline-flex; align-items: center; justify-content: center; }
.pl-plan-blocks { display: grid; gap: 14px; margin: 18px 0; }
.pl-plan-blocks article { padding: 12px; border: 1px solid var(--pl-line); background: white; }
.pl-plan-blocks strong,.pl-plan-blocks span { display: block; }
.pl-plan-blocks strong { color: var(--pl-brown); font-size: 11px; }
.pl-plan-blocks span { margin-top: 5px; color: var(--pl-muted); font-size: 10px; line-height: 1.45; }
.pl-generated-title { margin-bottom: 20px; padding: 18px; border: 1px solid var(--pl-line); background: white; }
.pl-generated-title > span { color: var(--pl-terra); font-size: 9px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.pl-generated-title h3 { display: -webkit-box; margin: 7px 0 5px; overflow: hidden; color: var(--pl-brown); font: 400 25px var(--pl-display); line-height: 1.12; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.pl-generated-title p,.pl-field-help { color: var(--pl-muted); font-size: 11px; line-height: 1.5; }
.pl-generated-title p { display: -webkit-box; margin: 0; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.pl-field-help { margin: 0 0 14px; }
.pl-field { display: grid; grid-template-columns: minmax(0,1fr); gap: 6px; align-content: start; }
.pl-field__label { display: block; margin: 0; color: var(--pl-brown); font-size: 10px; font-weight: 800; }
.pl-field__control { width: 100%; min-height: 44px; margin: 0; padding: 10px; border: 1px solid var(--pl-line); color: var(--pl-ink); background: white; }
.pl-focus-select { appearance: none; padding-right: 42px; border: 2px solid var(--pl-sage); border-radius: 6px; background-color: white; background-image: linear-gradient(45deg,transparent 50%,var(--pl-brown) 50%),linear-gradient(135deg,var(--pl-brown) 50%,transparent 50%); background-position: calc(100% - 18px) 18px,calc(100% - 12px) 18px; background-size: 6px 6px,6px 6px; background-repeat: no-repeat; font-weight: 750; }
.pl-focus-select:hover { border-color: var(--pl-terra); background-color: var(--pl-paper); }
.pl-field__help,.pl-field__error { position: static; display: block; margin: 0; font-size: 11px; line-height: 1.4; }
.pl-field__help { color: var(--pl-muted); }
.pl-focus-reason { margin: 2px 0 0; padding: 10px 12px; border-left: 3px solid var(--pl-sage); color: var(--pl-brown); background: var(--pl-cream); font-size: 10px; line-height: 1.5; }
.pl-focus-reason.is-recommended { border-left-color: #3f7d44; background: #eef7ec; }
.pl-focus-reason.is-alternative { border-left-color: var(--pl-gold); background: #fff8e6; }
.pl-field__error { min-height: 1.4em; color: var(--pl-terra); }
.pl-season-options,.pl-team-age-options { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 18px 0; }
.pl-team-age-options { grid-template-columns: repeat(3,1fr); }
.pl-choice-card { min-height: 64px; padding: 12px; border: 1px solid var(--pl-line); color: var(--pl-brown); background: white; font: 750 12px var(--pl-sans); cursor: pointer; }
.pl-choice-card small { display: block; margin-top: 4px; color: var(--pl-muted); font-size: 10px; }
.pl-choice-card.is-selected { border-color: var(--pl-brown); box-shadow: inset 0 0 0 2px var(--pl-brown); background: var(--pl-cream); }
.pl-choice-card:focus-visible,.pl-exercise-card button:focus-visible,.pl-exercise-card summary:focus-visible { outline: 3px solid var(--pl-gold-text); outline-offset: 2px; }
.pl-exercise-options { display: grid; grid-template-columns: 1fr 1fr; align-items: stretch; gap: 8px; margin-top: 10px; }
.pl-exercise-picker__head { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.pl-exercise-picker__position { min-width:44px; color:var(--pl-muted); font-size:14px; font-variant-numeric:tabular-nums; text-align:right; }
.pl-exercise-card { height: 100%; display: flex; flex-direction: column; padding: 12px; border: 1px solid var(--pl-line); background: var(--pl-paper); }
.pl-exercise-card__content { flex: 1 1 auto; }
.pl-exercise-card__details { margin-bottom: 10px; }
.pl-exercise-card.is-incompatible { border-color: var(--pl-terra); background: #fff7f4; }
.pl-exercise-card.is-selected { border-color: var(--pl-brown); box-shadow: inset 0 0 0 1px var(--pl-brown); background: white; }
.pl-exercise-card h4 { margin: 0 0 6px; color: var(--pl-brown); font-size: 12px; }
.pl-intensity { display: inline-flex !important; width: fit-content; margin: 0 0 8px !important; padding: 4px 8px; border-radius: 999px; color: #1d2a1d !important; font-size: 9px !important; font-weight: 850; letter-spacing: .03em; }
.pl-intensity--green { background: #b9dfb3; }
.pl-intensity--yellow { background: #f4d66f; }
.pl-intensity--red { color: white !important; background: #c73e1d; }
.pl-exercise-card p,.pl-exercise-card summary,.pl-exercise-card li { color: var(--pl-muted); font-size: 10px; line-height: 1.45; }
.pl-exercise-card button { min-height: 44px; width: 100%; flex: 0 0 auto; margin-top: auto; border: 1px solid var(--pl-brown); color: var(--pl-brown); background: white; font-weight: 800; cursor: pointer; }
.pl-exercise-card.is-selected button { color: white; background: var(--pl-brown); }
.pl-filter-note { grid-column: 1 / -1; padding: 10px; color: var(--pl-muted); background: var(--pl-cream); font-size: 10px; line-height: 1.5; }

/* LIN-073: Variante A – der fertige Trainingsplan ist das direkte Arbeitsergebnis. */
.pl-completed-plan { scroll-margin-top: calc(var(--pl-header-height) + 20px); margin: 24px 0 48px; padding: clamp(20px,4vw,42px); border: 1px solid var(--pl-line); background: var(--pl-paper); }
.pl-completed-plan[hidden] { display: none; }
.pl-completed-plan:focus { outline: none; }
.pl-completed-plan__head { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 24px; align-items: start; }
.pl-completed-plan__head h2 { margin: 4px 0 8px; color: var(--pl-brown); font: 400 clamp(30px,5vw,54px)/1.05 var(--pl-display); }
.pl-completed-plan__head p { color: var(--pl-muted); line-height: 1.55; }
.pl-completed-plan__actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; max-width: 430px; }
.pl-completed-plan__meta { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 1px; margin: 28px 0; background: var(--pl-line); border: 1px solid var(--pl-line); }
.pl-completed-plan__meta div { min-width: 0; padding: 13px; background: white; }
.pl-completed-plan__meta dt { color: var(--pl-muted); font-size: 9px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.pl-completed-plan__meta dd { margin: 5px 0 0; overflow-wrap: anywhere; color: var(--pl-brown); font-weight: 800; }
.pl-completed-plan__blocks { display: grid; gap: 24px; }
.pl-completed-exercise { padding: clamp(16px,3vw,28px); border: 1px solid var(--pl-line); background: white; }
.pl-completed-exercise > header { display: flex; gap: 14px; align-items: center; margin-bottom: 18px; }
.pl-completed-exercise > header > span { display: grid; flex: 0 0 42px; width: 42px; height: 42px; place-items: center; border-radius: 50%; color: white; background: var(--pl-terra); font-weight: 850; }
.pl-completed-exercise > header p { margin: 0 0 3px; color: var(--pl-muted); font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; }
.pl-completed-exercise > header h3 { margin: 0; color: var(--pl-brown); font: 400 clamp(22px,3vw,30px) var(--pl-display); }
.pl-exercise-visual { margin: 0 0 20px; border: 1px solid var(--pl-line); background: var(--pl-cream); }
.pl-exercise-visual img { display: block; width: 100%; height: auto; }
.pl-exercise-sequence__viewport { aspect-ratio: 41 / 28; overflow: hidden; background: var(--pl-cream); }
.pl-exercise-sequence__viewport img { width: 100%; height: 100%; object-fit: contain; }
.pl-exercise-sequence__controls { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; padding: 10px; border-top: 1px solid var(--pl-line); background: white; }
.pl-exercise-sequence__controls button { min-height: 44px; padding: 9px 12px; border: 1px solid var(--pl-brown); border-radius: 999px; color: var(--pl-brown); font: 800 12px/1.2 var(--pl-sans); background: white; cursor: pointer; }
.pl-exercise-sequence__controls button[aria-pressed="true"] { color: white; background: var(--pl-brown); }
.pl-exercise-sequence__controls button:focus-visible { outline: 3px solid var(--pl-gold-text); outline-offset: 2px; }
.pl-exercise-sequence figcaption { padding: 0 12px 12px; color: var(--pl-muted); font-size: 11px; line-height: 1.45; background: white; }
@media (max-width: 520px) {
  .pl-exercise-sequence__controls { grid-template-columns: 1fr; }
}
/* LIN-097: Goldener Bildschnitt und aufloesungsfeste Inhaltsmedien.
 * Redaktionelle Bilder nutzen 1,618:1. Logos und das quadratische
 * Autorenportraet bleiben ihrem funktionalen Bildtyp entsprechend erhalten.
 */
.pl-content-system :where(.pl-editorial-image, .pl-pep8-hero, .pl-pep8-graphic) {
  aspect-ratio: auto;
}

.pl-content-system :where(.pl-knowledge-grid, .pl-orientation-grid, .pl-magazine-grid) a > picture,
.pl-content-system .pl-article-hero,
.pl-content-system .pl-editorial-image > picture,
.pl-content-system .pl-pep8-hero > picture {
  display: block;
  width: 100%;
  aspect-ratio: var(--pl-image-golden-ratio);
  overflow: clip;
  border-radius: var(--pl-content-surface-radius);
  background: var(--pl-cream);
}

.pl-content-system :where(.pl-knowledge-grid, .pl-orientation-grid, .pl-magazine-grid) a > img,
.pl-content-system .pl-editorial-image > img,
.pl-content-system .pl-pep8-graphic > img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: var(--pl-image-golden-ratio);
  object-fit: cover;
  object-position: center;
  border-radius: var(--pl-content-surface-radius);
  background: var(--pl-cream);
}

.pl-content-system :where(.pl-knowledge-grid, .pl-orientation-grid, .pl-magazine-grid) a > picture > img,
.pl-content-system :where(.pl-article-hero, .pl-editorial-image > picture, .pl-pep8-hero > picture) > img {
  display: block;
  width: 100%;
  height: 100%;
  aspect-ratio: auto;
  object-fit: cover;
  object-position: center;
}

.pl-content-system :where(.pl-knowledge-grid, .pl-orientation-grid, .pl-magazine-grid) img[src$=".svg"],
.pl-content-system .pl-pep8-graphic > img {
  object-fit: contain;
}

@media print {
  .pl-exercise-sequence__controls { display: none; }
  .pl-exercise-sequence [data-sequence-panel="flow"] { display: none !important; }
}

.pl-exercise-visual figcaption { padding: 9px 12px; color: var(--pl-muted); font-size: 10px; }
.pl-exercise-visual--pending { display: grid; min-height: 150px; place-content: center; gap: 7px; padding: 24px; border-style: dashed; text-align: center; }
.pl-exercise-visual--pending strong { color: var(--pl-brown); }
.pl-exercise-visual--pending span { max-width: 560px; color: var(--pl-muted); font-size: 11px; line-height: 1.5; }
.pl-completed-exercise__content { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; }
.pl-completed-exercise h4 { margin: 0 0 6px; color: var(--pl-brown); font-size: 11px; }
.pl-completed-exercise__content p,.pl-completed-exercise__variations p { margin: 0; color: var(--pl-muted); font-size: 11px; line-height: 1.55; }
.pl-completed-exercise__variations { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 18px; }
.pl-completed-exercise__variations article { padding: 14px; border-left: 3px solid var(--pl-sage); background: var(--pl-cream); }
@media (max-width:760px) {
  .pl-completed-plan { margin-inline: -12px; padding: 18px 14px 28px; }
  .pl-completed-plan__head { grid-template-columns: 1fr; }
  .pl-completed-plan__actions { justify-content: stretch; max-width: none; }
  .pl-completed-plan__actions .pl-button { flex: 1 1 46%; }
  .pl-completed-plan__meta { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .pl-completed-exercise__content,.pl-completed-exercise__variations { grid-template-columns: 1fr; }
}

/* Footer */
.pl-footer { border-top: 1px solid var(--pl-line); background: rgba(255,255,255,.62); }
.pl-footer__inner { width: min(calc(100% - 48px), var(--pl-content-width)); margin: auto; padding: 44px 0; display: grid; grid-template-columns: 2fr 1fr 1fr auto; gap: 34px; color: var(--pl-muted); font-size: 12px; }
.pl-footer__inner p { max-width: 360px; line-height: 1.65; }
.pl-footer__logo { width: 150px; height: auto; }
.pl-footer__nav { display: flex; flex-direction: column; gap: 12px; }
.pl-footer__link { color: var(--pl-brown); font-weight: 750; text-decoration: none; }
.pl-footer__link:hover { color: var(--pl-terra); text-decoration: underline; text-underline-offset: 4px; }
.pl-footer__link:focus-visible { outline: 3px solid var(--pl-gold-text); outline-offset: 4px; }

/* Dialogs and feedback */
.pl-dialog { width: min(640px,calc(100% - 28px)); padding: 0; border: 1px solid var(--pl-line); border-radius: 3px; color: var(--pl-ink); background: var(--pl-paper); box-shadow: 0 35px 100px rgba(38,26,24,.4); }
.pl-plan-dialog { width: min(960px,calc(100% - 28px)); }
.pl-dialog::backdrop { background: rgba(38,26,24,.72); backdrop-filter: blur(6px); }
.pl-dialog form { padding: 34px; }
.pl-dialog__head { display: flex; justify-content: space-between; gap: 20px; margin-bottom: 26px; }
.pl-dialog__head h2 { margin: 0; font: 400 32px var(--pl-display); }
.pl-dialog__head p:last-child { color: var(--pl-muted); font-size: 12px; }
.pl-dialog__close { width: 40px; height: 40px; border: 1px solid var(--pl-line); color: var(--pl-brown); background: white; font-size: 24px; cursor: pointer; }
.pl-dialog__close:focus-visible { outline: 3px solid var(--pl-gold-text); outline-offset: 2px; }
.pl-dialog label,.pl-dialog legend { color: var(--pl-brown); font-size: 12px; font-weight: 800; }
.pl-dialog input,.pl-dialog textarea,.pl-dialog select { width: 100%; display: block; margin-top: 7px; padding: 12px; border: 1px solid var(--pl-line); border-radius: 2px; color: var(--pl-ink); background: white; font: 13px var(--pl-sans); }
.pl-dialog input:focus-visible,.pl-dialog textarea:focus-visible,.pl-dialog select:focus-visible { outline: 3px solid rgba(117,83,21,.45); outline-offset: 1px; }
.pl-dialog textarea { min-height: 90px; resize: vertical; }
.pl-dialog fieldset { margin: 20px 0; padding: 0; border: 0; }
.pl-check-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; margin-top: 10px; }
.pl-check-grid label { display: flex; align-items: center; gap: 8px; padding: 11px; border: 1px solid var(--pl-line); background: white; }
.pl-check-grid input { width: auto; margin: 0; accent-color: var(--pl-terra); }
.pl-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 18px; }
.pl-season-wizard { margin-top: 24px; padding-top: 24px; border-top: 1px solid var(--pl-line); }
.pl-season-wizard__head { display: flex; justify-content: space-between; gap: 20px; align-items: start; }
.pl-season-wizard__head h3 { margin: 0; color: var(--pl-brown); font: 400 25px var(--pl-display); }
.pl-season-wizard__head p:not(.pl-kicker) { color: var(--pl-muted); font-size: 12px; line-height: 1.55; }
#season-selection-count { flex: 0 0 auto; color: var(--pl-terra); font-size: 10px; }
.pl-option-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; max-height: 340px; margin-top: 18px; padding: 3px; overflow-y: auto; }
.pl-option-card { min-height: 86px; padding: 14px; border: 1px solid var(--pl-line); border-radius: 2px; color: var(--pl-ink); background: white; font-family: var(--pl-sans); text-align: left; cursor: pointer; transition: transform .18s,background .18s,border-color .18s; }
.pl-option-card strong,.pl-option-card span { display: block; }
.pl-option-card strong { color: var(--pl-brown); font-size: 12px; line-height: 1.35; }
.pl-option-card span { margin-top: 6px; color: var(--pl-muted); font-size: 10px; line-height: 1.45; }
.pl-option-card:hover { transform: translateY(-1px); border-color: var(--pl-terra); background: var(--pl-paper); }
.pl-option-card:focus-visible { outline: 3px solid var(--pl-gold-text); outline-offset: 2px; }
.pl-option-card.is-selected { border-color: var(--pl-brown); color: white; background: var(--pl-brown); box-shadow: inset 0 -3px 0 var(--pl-terra); }
.pl-option-card.is-selected strong,.pl-option-card.is-selected span { color: white; }
.pl-season-wizard__actions { display: flex; justify-content: space-between; gap: 10px; margin-top: 18px; }
#season-next { margin-left: auto; }
.pl-planning-inline,.pl-planning-step,#training-plan-dialog-title,#training-exercises-title { scroll-margin-top: calc(var(--pl-header-height) + 24px); }
.pl-schedule-field { margin: 18px 0 !important; padding: 16px !important; border: 1px solid var(--pl-line) !important; background: white; }
.pl-schedule-options { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 10px; }
.pl-schedule-options label { display: flex; gap: 10px; align-items: flex-start; padding: 12px; border: 1px solid var(--pl-line); cursor: pointer; }
.pl-schedule-options input { width: auto; margin: 2px 0 0; accent-color: var(--pl-terra); }
.pl-schedule-options strong,.pl-schedule-options small { display: block; }
.pl-schedule-options small { margin-top: 4px; color: var(--pl-muted); font-weight: 500; line-height: 1.4; }
.pl-schedule-options label:has(input:checked) { border-color: var(--pl-brown); box-shadow: inset 0 0 0 1px var(--pl-brown); background: var(--pl-cream); }
#training-date-field { margin-top: 12px; }
.pl-form-row--status { grid-template-columns: minmax(220px,1fr) 1fr; }
.pl-form-error { min-height: 18px; margin: 10px 0 0; color: var(--pl-terra); font-size: 11px; font-weight: 750; }
.pl-season-summary { margin-top: 18px; padding: 18px; border: 1px solid var(--pl-line); background: white; }
.pl-season-summary h4 { margin: 0 0 14px; color: var(--pl-brown); font: 400 24px var(--pl-display); }
.pl-season-summary dl { margin: 0; }
.pl-season-summary dl div { padding: 10px 0; border-bottom: 1px solid var(--pl-line); }
.pl-season-summary dt { color: var(--pl-terra); font-size: 9px; font-weight: 850; text-transform: uppercase; }
.pl-season-summary dd { margin: 4px 0 0; font-size: 12px; line-height: 1.5; }
.pl-season-summary p { color: var(--pl-muted); font-size: 11px; line-height: 1.5; }
.pl-dialog__actions { display: flex; justify-content: flex-end; gap: 9px; margin-top: 26px; }
.pl-toast { position: fixed; right: 24px; bottom: 24px; z-index: 40; padding: 14px 18px; color: white; background: var(--pl-brown); box-shadow: var(--pl-shadow); transform: translateY(100px); opacity: 0; transition: .3s; font-size: 12px; }
.pl-toast.is-visible { transform: translateY(0); opacity: 1; }

@media (max-width: 980px) {
  .pl-header { grid-template-columns: 1fr auto auto; gap: 10px; }
  .pl-nav,.pl-mega-panel { display: none; }
  .pl-menu-toggle { display: grid; place-items: center; justify-self: end; }
  .pl-hero { min-height: 570px; grid-template-columns: 1fr; padding: 62px 46px 40px; }
  .pl-hero__actions { width: 100%; grid-template-columns: 1fr 1fr; }
  .pl-grid { grid-template-columns: 1fr; }
  .pl-style-card:nth-child(n) { grid-column: span 6; }
  .pl-step-grid { grid-template-columns: 1fr 1fr; }
  .pl-footer__inner { grid-template-columns: 2fr 1fr 1fr; }
  .pl-plan-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 720px) {
  :root { --pl-header-height: 72px; }
  .pl-main { width: min(calc(100% - 24px), var(--pl-content-width)); padding-top: 14px; }
  .pl-season { max-width: 132px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
  .pl-header { grid-template-columns: auto 1fr auto; overflow: visible; }
  .pl-header__account { grid-column: 2; grid-row: 1; justify-self: end; }
  .pl-menu-toggle { grid-column: 3; grid-row: 1; }
  .pl-brand__logo { width: 136px; }
  .pl-hero { min-height: auto; padding: 54px 24px 28px; }
  .pl-hero__title { font-size: 48px; }
  .pl-hero__actions { grid-template-columns: 1fr; }
  .pl-hero__meta { display: grid; }
  .pl-metrics { grid-template-columns: 1fr 1fr; }
  .pl-styles { margin-top: 38px; padding: 34px 20px; }
  .pl-styles__head { flex-direction: column; }
  .pl-role-switch { width: 100%; }
  .pl-role-switch__button { flex: 1; }
  .pl-style-grid { grid-template-columns: 1fr; }
  .pl-style-card:nth-child(n) { grid-column: auto; min-height: auto; }
  .pl-feature-grid,.pl-feature-grid--two,.pl-step-grid,.pl-content-section--split,.pl-footer__inner { grid-template-columns: 1fr; }
  .pl-content-section { padding: 34px 22px; }
  .pl-session-plan { grid-template-columns: 1fr 1fr; }
  .pl-balance__row { grid-template-columns: 105px 1fr 38px; gap: 9px; }
  .pl-check-grid,.pl-form-row { grid-template-columns: 1fr; }
  .pl-schedule-options { grid-template-columns: 1fr; }
  .pl-option-grid { grid-template-columns: 1fr; max-height: 420px; }
  .pl-season-wizard__head { display: block; }
  .pl-dialog__actions { flex-direction: column-reverse; }
  .pl-dialog__actions .pl-button { width: 100%; }
  .pl-season-options { grid-template-columns: 1fr; }
  .pl-exercise-options[data-exercise-carousel] { display:flex; align-items:stretch; gap:12px; margin-inline:-16px; padding:4px 16px 14px; overflow-x:auto; overflow-y:hidden; scroll-snap-type:x mandatory; scroll-padding-inline:16px; overscroll-behavior-inline:contain; -webkit-overflow-scrolling:touch; }
  .pl-exercise-options[data-exercise-carousel] > .pl-exercise-card { flex:0 0 86%; min-width:0; min-height:420px; scroll-snap-align:start; scroll-snap-stop:always; }
  .pl-exercise-options[data-exercise-carousel] > .pl-filter-note { flex:0 0 82%; }
  .pl-team-age-options { grid-template-columns: 1fr 1fr; }
  .pl-training-plans__head,.pl-plan-transfer { display: block; }
  .pl-training-plans__head .pl-button { width: 100%; margin-top: 18px; }
  .pl-plan-toolbar,.pl-plan-grid,.pl-plan-blocks { grid-template-columns: 1fr; }
  .pl-plan-transfer > div:last-child { margin-top: 16px; }
}
@media (prefers-reduced-motion: reduce) { .pl-exercise-options[data-exercise-carousel] { scroll-behavior:auto; } }
@media (max-width: 380px) {
  .pl-hero__title { font-size: 41px; }
  .pl-metrics,.pl-session-plan { grid-template-columns: 1fr; }
  .pl-balance__row { grid-template-columns: 88px 1fr 34px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; }
}


/* AP13–16: geführte Planung */
[hidden] { display: none !important; }
.pl-journey { margin: 24px 0 32px; padding: clamp(18px,3vw,28px); border: 1px solid var(--pl-line); background: var(--pl-paper); }
.pl-journey ol { display: grid; grid-template-columns: repeat(4,1fr); gap: 10px; margin: 0; padding: 0; list-style: none; }
.pl-journey li { display: grid; grid-template-columns: 34px 1fr; gap: 2px 10px; align-items: center; padding: 12px; border: 1px solid var(--pl-line); color: var(--pl-muted); background: rgba(255,255,255,.55); }
.pl-journey li > span { grid-row: 1 / 3; width: 34px; height: 34px; display: grid; place-items: center; border: 1px solid currentColor; border-radius: 50%; font-weight: 850; }
.pl-journey strong { color: inherit; font-size: 12px; }
.pl-journey small { font-size: 9px; line-height: 1.35; }
.pl-journey li.is-current { border-color: var(--pl-brown); color: var(--pl-brown); box-shadow: inset 0 -3px 0 var(--pl-terra); background: white; }
.pl-journey li.is-complete { color: var(--pl-olive-text); background: #f4f8ef; }
.pl-journey p { margin: 14px 0 0; color: var(--pl-muted); font-size: 11px; line-height: 1.5; }
.pl-planning-step { display: grid; gap: 16px; }
.pl-planning-step > h3 { margin: 0; color: var(--pl-brown); font-size: clamp(20px, 2vw, 28px); }
#training-plan-progress,
#season-team-progress { margin: 6px 0 0; color: var(--pl-muted); font-weight: 800; }
#training-setup-step { max-width: 760px; margin-inline: auto; padding: clamp(16px, 3vw, 28px); border: 1px solid var(--pl-line); background: var(--pl-paper); }
#training-setup-step .pl-dialog__actions { margin-top: 4px; }
#training-exercises-step { animation: pl-step-in .22s ease-out; }
#training-exercises-title:focus { outline: none; }
@keyframes pl-step-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
@media (prefers-reduced-motion: reduce) {
  #training-exercises-step { animation: none; }
  html { scroll-behavior: auto; }
}
@media (max-width: 720px) {
  .pl-journey ol { grid-template-columns: 1fr; }
}

/* AP15: scrollgeführte einseitige Trainingsplanung */
.pl-planning-inline[open] {
  position: static;
  inset: auto;
  width: 100%;
  max-width: none;
  max-height: none;
  display: block;
  margin: 0 0 32px;
  overflow: visible;
  border: 1px solid var(--pl-line);
  background: var(--pl-paper);
  box-shadow: none;
  scroll-margin-top: calc(var(--pl-header-height) + 18px);
}
.pl-planning-inline::backdrop { display: none; }
.pl-planning-inline form { padding: clamp(20px, 4vw, 46px); }
.pl-planning-inline .pl-dialog__head { position: relative; }
.pl-planning-inline .pl-dialog__close { position: absolute; top: 0; right: 0; }
.pl-planning-inline#training-plan-dialog { width: 100%; }
#training-plans-section { scroll-margin-top: calc(var(--pl-header-height) + 18px); }
@media (min-width: 981px) {
  .pl-planning-inline .pl-form-row { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
  .pl-planning-inline .pl-option-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); max-height: none; }
  .pl-planning-inline .pl-exercise-options { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 720px) {
  .pl-planning-inline[open] { margin-bottom: 20px; }
  .pl-planning-inline form { padding: 22px 16px; }
  .pl-planning-inline .pl-dialog__head { padding-right: 46px; }
}

/* AP13 + AP17: Trainingsbibliothek und Fußballwissen */
.sr-only { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.pl-section-action { margin: 28px 0 0; }
.pl-content-page { padding-bottom: 70px; }
.pl-page-hero { max-width: 980px; padding: clamp(58px,8vw,110px) 0 clamp(38px,6vw,70px); }
.pl-page-hero h1 { max-width: 900px; margin: 8px 0 20px; color: var(--pl-brown); font-size: clamp(48px,7vw,92px); line-height: .96; }
.pl-page-hero > p:last-child { max-width: 760px; color: var(--pl-muted); font-size: clamp(16px,2vw,21px); line-height: 1.6; }
.pl-library-layout { display: grid; grid-template-columns: minmax(280px,360px) minmax(0,1fr); gap: 28px; align-items: start; }
.pl-filter-panel,.pl-library-results,.pl-definition-grid,.pl-note { border: 1px solid var(--pl-line); background: var(--pl-paper); }
.pl-filter-panel { position: sticky; top: calc(var(--pl-header-height) + 18px); display: grid; gap: 18px; padding: clamp(22px,3vw,34px); }
.pl-filter-panel h2,.pl-library-results h2,.pl-definition-grid h2 { margin: 4px 0 0; color: var(--pl-brown); font: 400 28px var(--pl-display); }
.pl-filter-panel label { display: grid; gap: 7px; color: var(--pl-brown); font-size: 11px; font-weight: 800; }
.pl-filter-panel label > span { color: var(--pl-muted); font-weight: 500; }
.pl-filter-panel select,.pl-filter-panel input { width: 100%; min-height: 48px; padding: 10px 12px; border: 1px solid var(--pl-line); color: var(--pl-ink); background: white; font: 13px var(--pl-sans); }
.pl-filter-panel select:focus-visible,.pl-filter-panel input:focus-visible { outline: 3px solid var(--pl-gold-text); outline-offset: 2px; }
.pl-filter-panel small { color: var(--pl-muted); font-size: 10px; font-weight: 500; line-height: 1.5; }
.pl-filter-actions { display: flex; justify-content: space-between; gap: 12px; align-items: center; padding-top: 14px; border-top: 1px solid var(--pl-line); color: var(--pl-muted); font-size: 10px; }
.pl-library-results { min-height: 560px; padding: clamp(24px,4vw,48px); }
.pl-library-results__head { display: flex; justify-content: space-between; gap: 20px; align-items: baseline; margin-bottom: 28px; }
.pl-library-results__head strong { color: var(--pl-terra); font-size: 11px; }
.pl-library-results .pl-empty-state { max-width: 720px; margin: 70px auto 0; }
.pl-library-results .pl-empty-state .pl-button { margin-top: 12px; }
.pl-filter-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.pl-filter-chips button { min-height: 36px; padding: 7px 10px; border: 1px solid var(--pl-line); color: var(--pl-brown); background: white; font: 750 9px var(--pl-sans); cursor: pointer; }
.pl-filter-chips button:focus-visible { outline: 3px solid var(--pl-gold-text); outline-offset: 2px; }
.pl-library-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; }
.pl-library-card { display: flex; flex-direction: column; min-width: 0; padding: clamp(20px,3vw,30px); border: 1px solid var(--pl-line); background: white; }
.pl-library-card__head { display: flex; justify-content: space-between; gap: 10px; color: var(--pl-terra); font-size: 9px; font-weight: 850; letter-spacing: .06em; text-transform: uppercase; }
.pl-library-card h3 { margin: 12px 0 8px; color: var(--pl-brown); font: 400 24px var(--pl-display); }
.pl-library-card > p,.pl-library-card__details p,.pl-library-card__details li { color: var(--pl-muted); font-size: 11px; line-height: 1.55; }
.pl-library-card dl { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 14px 0; }
.pl-library-card dl div { padding: 9px; background: var(--pl-cream); }
.pl-library-card dt { color: var(--pl-terra); font-size: 8px; font-weight: 850; text-transform: uppercase; }
.pl-library-card dd { margin: 3px 0 0; color: var(--pl-brown); font-size: 10px; }
.pl-library-card details { margin-top: auto; border-top: 1px solid var(--pl-line); }
.pl-library-card summary { min-height: 46px; display: flex; align-items: center; color: var(--pl-brown); font-size: 11px; font-weight: 800; cursor: pointer; }
.pl-library-card summary:focus-visible { outline: 3px solid var(--pl-gold-text); outline-offset: 2px; }
.pl-library-card__details { padding-top: 8px; }
.pl-library-card__details h4 { margin: 18px 0 6px; color: var(--pl-brown); font-size: 11px; }
.pl-library-card__details ul { padding-left: 18px; }
.pl-definition-grid { display: grid; grid-template-columns: 1.2fr repeat(3,1fr); gap: 1px; padding: 1px; background: var(--pl-line); }
.pl-definition-grid > div,.pl-definition-grid article { padding: clamp(22px,3vw,34px); background: var(--pl-paper); }
.pl-definition-grid article strong { color: var(--pl-brown); font: 400 20px var(--pl-display); }
.pl-definition-grid article p,.pl-definition-grid article small { display: block; color: var(--pl-muted); line-height: 1.55; }
.pl-definition-grid article p { font-size: 12px; }
.pl-definition-grid article small { font-size: 10px; }
.pl-knowledge-grid,.pl-mapping-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; margin-top: 30px; }
.pl-knowledge-grid article,.pl-mapping-list article { padding: clamp(22px,3vw,32px); border: 1px solid var(--pl-line); background: white; }
.pl-knowledge-grid h3,.pl-mapping-list h3 { margin: 0 0 12px; color: var(--pl-brown); font: 400 24px var(--pl-display); }
.pl-knowledge-grid p,.pl-mapping-list p { color: var(--pl-muted); font-size: 12px; line-height: 1.6; }
.pl-knowledge-grid a { color: var(--pl-brown); font-size: 11px; font-weight: 800; text-underline-offset: 4px; }
.pl-knowledge-grid a:focus-visible { outline: 3px solid var(--pl-gold-text); outline-offset: 3px; }
.pl-note { margin-top: 24px; padding: 24px 28px; border-left: 5px solid var(--pl-sage); }
.pl-note strong { color: var(--pl-brown); }
.pl-note p { margin-bottom: 0; color: var(--pl-muted); line-height: 1.6; }
@media (max-width: 1100px) {
  .pl-definition-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 720px) {
  .pl-library-layout,.pl-library-grid,.pl-definition-grid,.pl-knowledge-grid,.pl-mapping-list { grid-template-columns: 1fr; }
  .pl-filter-panel { position: static; }
  .pl-library-results { min-height: 0; }
  .pl-library-results__head { display: block; }
  .pl-page-hero h1 { font-size: 46px; }
}

@media (prefers-reduced-motion: reduce) { .pl-nav > .pl-mega-trigger > span { transition: none; } }


/* AP24/AP25: eindeutige Navigationsziele und Team-&-Saison-Einstieg */
.pl-header__account { display: grid; gap: 2px; justify-items: end; }
.pl-season__label { color: var(--pl-muted); font-size: 8px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.pl-planning-entry,
.pl-cockpit-overview,
#training-plans-section,
#recommendation-section,
#sessions-section,
#season-goals-section,
#analysis-section { scroll-margin-top: calc(var(--pl-header-height) + 28px); }
.pl-planning-entry { margin: 34px 0 0; padding: clamp(22px,3vw,34px); border: 1px solid var(--pl-line); background: var(--pl-paper); }
.pl-planning-entry h2,
.pl-cockpit-overview h2 { margin: 4px 0 0; color: var(--pl-brown); font: 400 clamp(30px,4vw,48px) var(--pl-display); }
.pl-planning-context { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: 16px; padding: 14px 16px; border-left: 4px solid var(--pl-sage); background: var(--pl-cream); }
.pl-planning-context strong { color: var(--pl-brown); }
.pl-cockpit-overview { display: grid; gap: 14px; align-items: start; }
.pl-cockpit-overview .pl-button { justify-self: start; }
@media (max-width: 980px) {
  .pl-header__account { justify-items: start; }
  .pl-season__label { display: none; }
}

.pl-decision-dialog{max-width:38rem}.pl-decision-dialog .pl-dialog__actions{justify-content:flex-start;flex-wrap:wrap}
@media(max-width:640px){.pl-decision-dialog .pl-dialog__actions,.pl-decision-dialog .pl-button{width:100%}}

/* Pep 1 v3: Übungsansicht und Platzmodus */
.pl-exercise-dialog{width:min(920px,calc(100% - 24px));max-height:92vh}.pl-exercise-dialog>div,.pl-place-dialog>div{padding:clamp(18px,4vw,34px)}.pl-exercise-view{display:grid;gap:18px}.pl-exercise-view__section{border-top:1px solid var(--pl-line);padding-top:16px}.pl-exercise-view__section h3{margin:0 0 10px}.pl-check-list{list-style:none;padding:0}.pl-check-list label{display:flex;gap:10px}.pl-graphic-placeholder{display:grid;place-content:center;gap:6px;min-height:220px;padding:24px;border:1px dashed var(--pl-line);background:var(--pl-cream);color:var(--pl-muted);text-align:center}.pl-graphic-placeholder strong{color:var(--pl-brown)}.pl-exercise-graphic button{width:100%;padding:0;border:0;background:none;cursor:zoom-in}.pl-exercise-graphic img{display:block;width:100%;max-height:520px;object-fit:contain}.pl-variation-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.pl-variation-grid article,.pl-parent-help{padding:15px;border:1px solid var(--pl-line);background:var(--pl-cream)}.pl-parent-help summary{font-weight:800;cursor:pointer}.pl-parent-help summary span{font-weight:500;color:var(--pl-muted)}.pl-place-dialog{width:min(680px,calc(100% - 16px));max-height:96vh}.pl-place-head{display:flex;justify-content:space-between;gap:20px}.pl-place-body{min-height:32vh;font-size:1.05rem;line-height:1.6}.pl-place-nav{position:sticky;bottom:0;display:flex;justify-content:space-between;gap:12px;padding-top:12px;background:var(--pl-paper)}.pl-graphic-dialog{width:min(1100px,calc(100% - 16px));background:white}.pl-graphic-dialog img{display:block;width:100%;max-height:84vh;object-fit:contain}@media(max-width:640px){.pl-variation-grid{grid-template-columns:1fr}.pl-place-nav .pl-button{flex:1}.pl-exercise-dialog{max-height:96vh}}@media print{.pl-exercise-dialog{position:static;display:block;width:100%;max-height:none}.pl-place-dialog,.pl-graphic-dialog,.pl-dialog__close,.pl-dialog__actions,.pl-parent-help{display:none!important}}


/* Aufgabenpaket Mira 1: smarte nächste Handlung und UX-Führung */
.pl-journey ol{grid-template-columns:repeat(4,minmax(0,1fr))}
.pl-journey li{position:relative;min-width:0}
.pl-journey li.is-next{border-style:dashed}
.pl-journey li.is-locked{opacity:.62}
.pl-journey li.is-complete span::after{content:"✓";font-weight:900}
.pl-journey li.is-complete span{font-size:0}
.pl-journey li.is-complete span::after{font-size:13px}
.pl-journey li:focus-visible{outline:3px solid var(--pl-gold-text);outline-offset:3px}
#cockpit-next-action{justify-self:start}
@media(max-width:1100px) and (min-width:721px){.pl-journey ol{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:720px){.pl-journey{display:flex;flex-direction:column}.pl-journey ol{order:2;grid-template-columns:1fr}.pl-journey p{order:1;margin:0 0 14px}.pl-journey li:not(.is-current):not(.is-complete):not(.is-next){display:none}}


/* LIN-026: kompakter mobiler Header ohne horizontalen Überlauf */
@media(max-width:720px){
  .pl-header{
    grid-template-columns:minmax(0,auto) minmax(0,1fr) 48px;
    gap:6px;
    padding-inline:8px;
    overflow:hidden;
  }
  .pl-brand{min-width:0;min-height:44px}
  .pl-brand__logo{width:clamp(104px,32vw,120px);max-width:100%}
  .pl-header__account{min-width:0;width:100%;justify-self:stretch}
  .pl-season{width:100%;max-width:116px;min-height:44px;padding-inline:8px;justify-self:end}
  .pl-menu-toggle{min-width:48px;min-height:48px}
}
@media(max-width:360px){
  .pl-brand__logo{width:104px}
  .pl-season{max-width:104px;font-size:10px}
}


/* LIN-027: Content-Hubs, Tabellen und Druckansichten */
.pl-content-section article h2 a{color:var(--pl-brown);text-decoration-thickness:1px;text-underline-offset:4px}
.pl-table-wrap{max-width:100%;overflow-x:auto;margin:20px 0}
.pl-table-wrap table{width:100%;min-width:560px;border-collapse:collapse;background:white}
.pl-table-wrap th,.pl-table-wrap td{padding:12px;border:1px solid var(--pl-line);text-align:left;vertical-align:top}
.pl-table-wrap th{color:var(--pl-brown);background:var(--pl-cream)}
.pl-content-section blockquote{margin:20px 0;padding:16px 20px;border-left:4px solid var(--pl-terra);background:var(--pl-cream)}
@media print{
  .pl-header,.pl-footer,.pl-section-action,.pl-breadcrumb{display:none!important}
  .pl-main{width:100%;padding:0}
  .pl-content-section{padding:0;border:0;box-shadow:none}
  .pl-table-wrap{overflow:visible}
  .pl-table-wrap table{min-width:0}
  a{color:inherit;text-decoration:none}
}


/* LIN-035: iPad-sichere, echte Viewport-Aufteilung des Trainingsplaners */
#training-plan-dialog[open] {
  width: min(1180px, calc(100% - 24px));
  height: min(920px, calc(var(--pl-visual-viewport-height, 100dvh) - 24px));
  max-height: calc(var(--pl-visual-viewport-height, 100dvh) - 24px);
  overflow: hidden;
}
#training-plan-dialog > form {
  height: 100%;
  min-height: 0;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  overflow: hidden;
}
#training-plan-dialog .pl-dialog__head { min-height: 0; margin-bottom: 18px; }
#training-plan-dialog #training-exercises-step,
#training-plan-dialog #training-setup-step {
  min-height: 0;
  max-width: none;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 2px 10px 20px 2px;
}
#training-plan-dialog .pl-lin019-flow {
  position: relative;
  z-index: 2;
  padding-top: 12px;
  border-top: 1px solid var(--pl-line);
  background: var(--pl-paper);
}
#training-plan-dialog .pl-lin019-actions { margin-top: 10px; }
@media (max-width: 1180px) and (orientation: landscape) {
  #training-plan-dialog[open] { width: calc(100% - 16px); height: calc(var(--pl-visual-viewport-height, 100dvh) - 16px); max-height: calc(var(--pl-visual-viewport-height, 100dvh) - 16px); }
  #training-plan-dialog > form { padding: 20px 28px 16px; }
  #training-plan-dialog .pl-dialog__head { margin-bottom: 10px; }
  #training-plan-dialog .pl-lin019-progress li { padding: .45rem; }
}
@media (max-width: 720px) {
  #training-plan-dialog[open] { width: calc(100% - 8px); height: calc(var(--pl-visual-viewport-height, 100dvh) - 8px); max-height: calc(var(--pl-visual-viewport-height, 100dvh) - 8px); }
  #training-plan-dialog > form { padding: 16px 14px 12px; }
}


/* LIN-039: Trainingsplaner vollständig im sichtbaren Viewport halten */
#training-plan-dialog[open] {
  top: 12px !important;
  left: 50% !important;
  right: auto !important;
  bottom: auto !important;
  transform: translateX(-50%) !important;
  height: calc(var(--pl-visual-viewport-height, 100dvh) - 24px) !important;
  max-height: calc(var(--pl-visual-viewport-height, 100dvh) - 24px) !important;
}
#training-plan-dialog .pl-lin019-flow { gap: 8px; }
#training-plan-dialog .pl-lin019-progress button {
  min-height: 52px !important;
  padding: 7px 10px !important;
}
#training-plan-dialog .pl-lin019-progress button span { display: inline !important; margin-right: 6px; }
#training-plan-dialog .pl-lin019-progress button strong { display: inline !important; }
#training-plan-dialog .pl-lin019-progress button small { margin-top: 2px; }
@media (max-width: 720px) {
  #training-plan-dialog[open] {
    top: 4px !important;
    height: calc(var(--pl-visual-viewport-height, 100dvh) - 8px) !important;
    max-height: calc(var(--pl-visual-viewport-height, 100dvh) - 8px) !important;
  }
}


/* LIN-077: Viewport-Sperre nur während des aktiven Planungsdialogs */
html:has(body.pl-planner-page.pl-planning-active),
body.pl-planner-page.pl-planning-active {
  width: 100%;
  height: 100dvh;
  min-height: 100dvh;
  overflow: hidden;
  overscroll-behavior: none;
}
body.pl-planner-page.pl-planning-active > .pl-main {
  height: calc(100dvh - var(--pl-header-height, 86px));
  min-height: 0;
  overflow: hidden;
}
body.pl-planner-page.pl-planning-active dialog[open] {
  max-height: calc(100dvh - 24px);
}
@media (max-width: 760px) {
  body.pl-planner-page.pl-planning-active > .pl-main {
    height: calc(100dvh - var(--pl-header-height, 72px));
  }
}

/* LIN-075: Die lange Ergebnisansicht verlässt den viewportgebundenen Wizard-Modus. */
html.pl-completed-plan-visible,
body.pl-planner-page.pl-completed-plan-visible {
  height: auto !important;
  min-height: 100%;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior-y: auto !important;
}
body.pl-planner-page.pl-completed-plan-visible > .pl-main {
  height: auto !important;
  min-height: calc(100dvh - var(--pl-header-height, 86px)) !important;
  overflow: visible !important;
}


/* LIN-042: iPad-Safari scrollt ausschließlich den aktiven Planerinhalt */
#training-plan-dialog #training-exercises-step,
#training-plan-dialog #training-setup-step {
  min-height: 0 !important;
  height: 100%;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch;
  touch-action: pan-y;
  scrollbar-gutter: stable;
  padding-bottom: max(32px, env(safe-area-inset-bottom)) !important;
}
#training-plan-dialog .pl-lin019-flow {
  flex: none;
  min-height: 0;
}

/* LIN-088 · lange deutsche Fachbegriffe bleiben auf schmalen Artikelseiten innerhalb des Viewports. */
@media (max-width: 760px) {
  .pl-article h1 { overflow-wrap: anywhere; word-break: normal; }
}

/* LIN-091: eine zentrale, belastbare Typografierollenverteilung. */
.pl-mega-panel__title,
.pl-mega-panel__action,
.pl-offcanvas__link,
.pl-metric__value,
.pl-history__date strong,
.pl-step-grid strong,
.pl-season-summary h4,
.pl-definition-grid article strong {
  font-family: var(--pl-ui);
}

.pl-brand__mark,
.pl-mega-panel__label,
.pl-asset-caption,
.pl-kicker,
.pl-metric__label,
.pl-metric__note,
.pl-metric-tooltip,
.pl-metric-tooltip strong,
.pl-session-plan strong,
.pl-session-plan span,
.pl-history__date,
.pl-history__item p,
.pl-history__intensity,
.pl-plan-toolbar label,
.pl-save-note,
.pl-save-status,
.pl-plan-status,
.pl-plan-card dt,
.pl-plan-card dd,
.pl-plan-card small,
.pl-plan-card__actions button,
.pl-plan-transfer p,
.pl-plan-blocks strong,
.pl-plan-blocks span,
.pl-generated-title > span,
.pl-generated-title p,
.pl-field-help,
.pl-field__label,
.pl-field__help,
.pl-field__error,
.pl-focus-reason,
.pl-choice-card small,
.pl-intensity,
.pl-filter-note,
.pl-completed-plan__meta dt,
.pl-completed-exercise > header p,
.pl-exercise-sequence figcaption,
.pl-exercise-visual figcaption,
.pl-exercise-visual--pending span,
.pl-completed-exercise h4,
.pl-completed-exercise__content p,
.pl-completed-exercise__variations p,
.pl-dialog__head p:last-child,
.pl-dialog label,
.pl-dialog legend,
#season-selection-count,
.pl-option-card strong,
.pl-option-card span,
.pl-form-error,
.pl-season-summary dt,
.pl-season-summary dd,
.pl-season-summary p,
.pl-footer__inner,
.pl-journey strong,
.pl-journey small,
.pl-journey p,
.pl-filter-panel label,
.pl-filter-panel small,
.pl-filter-actions,
.pl-library-results__head strong,
.pl-library-card__head,
.pl-library-card dt,
.pl-library-card dd,
.pl-library-card summary,
.pl-library-card__details h4,
.pl-definition-grid article small,
.pl-knowledge-grid a,
.pl-season__label {
  font-size: var(--pl-type-ui-small);
}

.pl-nav__link,
.pl-season,
.pl-menu-toggle,
.pl-mega-trigger,
.pl-mega-panel__link,
.pl-nav > .pl-mega-trigger,
.pl-nav > .pl-nav__link,
.pl-button,
.pl-metric-info,
.pl-balance__row,
.pl-goal,
.pl-text-button,
.pl-role-switch__button,
.pl-local-notice strong,
.pl-local-notice p,
.pl-plan-card > p,
.pl-choice-card,
.pl-exercise-card h4,
.pl-exercise-card p,
.pl-exercise-card summary,
.pl-exercise-card li,
.pl-exercise-sequence__controls button,
.pl-dialog input,
.pl-dialog textarea,
.pl-dialog select,
.pl-option-card,
.pl-toast,
.pl-filter-panel select,
.pl-filter-panel input,
.pl-filter-chips button,
.pl-library-card > p,
.pl-library-card__details p,
.pl-library-card__details li {
  font-size: var(--pl-type-ui);
}

.pl-breadcrumb,
.pl-hero__copy,
.pl-style-card__summary,
.pl-perspective__list li,
.pl-feature-grid p,
.pl-feature-grid li,
.pl-step-grid span,
.pl-content-section--split p,
.pl-content-section--split li,
.pl-definition-grid article p,
.pl-knowledge-grid p,
.pl-mapping-list p {
  font-size: var(--pl-type-reading);
}

.pl-content-section > p:not(.pl-kicker):not(.pl-author-meta),
.pl-content-section > ul > li,
.pl-content-section > ol > li,
.pl-article > p:not(.pl-kicker):not(.pl-author-meta),
.pl-article > ul > li,
.pl-article > ol > li,
.pl-article__body p,
.pl-article__body li,
.pl-article__body td,
.pl-article__body th,
.legal-main p,
.legal-main li {
  font-size: var(--pl-type-reading);
}

.pl-display {
  font-family: var(--pl-display);
  font-synthesis: none;
}

@supports (font-size-adjust: 1) {
  body { font-size-adjust: .54; }
  :where(h1, h2, h3), .pl-display { font-size-adjust: .5; }
}

/* LIN-092: die Planungsraum-Regeln bleiben nach allen historischen Overrides maßgeblich. */
.pl-main.pl-planning-room-main {
  width: min(calc(100% - 40px), 1040px);
  min-height: calc(100dvh - var(--pl-header-height, 86px) - 180px);
  padding: clamp(20px, 3vw, 36px) 0 44px;
}
@media (max-width: 760px) {
  .pl-main.pl-planning-room-main {
    width: min(calc(100% - 24px), 1040px);
    min-height: calc(100dvh - var(--pl-header-height, 72px) - 140px);
    padding: 14px 0 28px;
  }
}

/* LIN-096: gestalterische Finalisierung von LIN-095.
 * Die vorhandene zentrale PlayLevel-Grundsprache ist verbindlich:
 * 1340-px-Seitenachse, 3-px-Flächen, Cal Sans für Überschriften,
 * Inter für Lese- und UI-Text. Startseite und Planungsoberflächen
 * tragen .pl-content-system nicht und bleiben vollständig geschützt.
 */
body.pl-content-system {
  min-height: 100dvh;
  color: var(--pl-ink);
}

.pl-content-system :where(.pl-main, .pl-article-shell) {
  position: relative;
  width: min(calc(100% - 48px), var(--pl-content-width));
  margin-inline: auto;
  padding: 34px 0 110px;
}

.pl-content-system :where(.pl-article, .pl-content-section, .pl-page-hero, .legal-main) {
  border: 1px solid var(--pl-line);
  border-radius: var(--pl-content-surface-radius);
  background: rgba(255, 255, 255, .5);
  box-shadow: none;
}

.pl-content-system .pl-article {
  position: relative;
  max-width: none;
  margin: 32px 0 0;
  padding: var(--pl-content-surface-padding);
}

.pl-content-system .pl-content-section,
.pl-content-system .pl-page-hero {
  max-width: none;
  margin: 32px 0;
  padding: var(--pl-content-surface-padding);
  overflow: visible;
}

.pl-content-system .pl-content-section--paper {
  background: var(--pl-paper);
}

.pl-content-system .pl-content-section.pl-closing {
  color: white;
  background: var(--pl-brown);
}

.pl-content-system .legal-main {
  width: min(calc(100% - 48px), var(--pl-content-width));
  max-width: none;
  margin: 66px auto 110px;
  padding: var(--pl-content-surface-padding);
}

.pl-content-system :where(.pl-main, .pl-article-shell) > .pl-breadcrumb,
.pl-content-system .pl-article > .pl-breadcrumb {
  position: absolute;
  z-index: 1;
  right: var(--pl-content-surface-padding);
  left: var(--pl-content-surface-padding);
  margin: 0;
}

.pl-content-system :where(.pl-main, .pl-article-shell) > .pl-breadcrumb {
  top: 90px;
}

.pl-content-system .pl-article > .pl-breadcrumb {
  top: var(--pl-space-3);
}

/* LIN-100: Content-Pieces nutzen die volle zentrale Inhaltsbreite.
 * 100 Prozent bezeichnet die Innenbreite der bestehenden Inhaltsflaeche;
 * systemweite Aussenabstaende und echte Bild-Text-Wechsel bleiben erhalten.
 */
.pl-content-system :where(.pl-article, .pl-content-section, .pl-page-hero, .legal-main) h1 {
  width: 100%;
  max-width: none;
  box-sizing: border-box;
  margin: .2em 0 .45em;
  color: var(--pl-brown);
  font-size: clamp(2.5rem, 7vw, 5.75rem);
  line-height: .96;
  letter-spacing: -.035em;
  overflow-wrap: anywhere;
}

.pl-content-system :where(.pl-content-section, .pl-page-hero, .legal-main):not(:has(> .pl-kicker)) > h1:first-child {
  margin-top: calc(.2em + 21px);
}

.pl-content-system :where(.pl-article, .pl-content-section, .legal-main) h2 {
  margin: 2.15em 0 .55em;
  color: var(--pl-brown);
  font-size: clamp(1.75rem, 4vw, 2.65rem);
  line-height: 1.05;
  overflow-wrap: anywhere;
}

.pl-content-system :where(.pl-article, .pl-content-section, .legal-main) h3 {
  margin: 1.65em 0 .45em;
  color: var(--pl-brown);
  font-size: clamp(1.3rem, 2.8vw, 1.8rem);
  line-height: 1.12;
}

.pl-content-system :is(
  .pl-article,
  .pl-article__header,
  .pl-article__body,
  .pl-content-section,
  .pl-page-hero,
  .legal-main
) > :where(
  h1,
  h2,
  h3,
  h4,
  p,
  ul,
  ol,
  blockquote,
  figure,
  picture,
  table,
  video,
  iframe,
  embed,
  object,
  .pl-kicker,
  .pl-author-meta,
  .pl-related,
  .pl-pep8-related,
  .pl-note,
  .notice,
  .pl-ai-disclosure,
  .pl-article__header,
  .pl-article__body,
  .pl-article__cta,
  .pl-article__next,
  .pl-author-card,
  .pl-table-scroll,
  .pl-table-wrap,
  .pl-magazine-grid,
  .pl-orientation-grid,
  .pl-knowledge-grid,
  .pl-feature-grid,
  .pl-step-grid,
  .pl-definition-grid,
  .pl-mapping-list
) {
  width: 100%;
  max-width: none;
  box-sizing: border-box;
  margin-inline: 0;
}

.pl-content-system :where(.pl-main, .pl-article-shell) > .pl-author-card {
  width: auto;
  max-width: none;
  box-sizing: border-box;
  margin-inline: var(--pl-content-surface-padding);
}

.pl-content-system :where(.pl-main, .pl-article-shell) > .pl-breadcrumb,
.pl-content-system .pl-article > .pl-breadcrumb {
  width: auto;
  max-width: none;
}

.pl-content-system :is(
  .pl-article,
  .pl-article__header,
  .pl-article__body,
  .pl-content-section,
  .pl-page-hero,
  .legal-main
) > :where(picture, video, iframe, embed, object) {
  display: block;
}

.pl-content-system :is(
  .pl-article,
  .pl-article__header,
  .pl-article__body,
  .pl-content-section,
  .pl-page-hero,
  .legal-main
) :where(img, picture, video, iframe, embed, object) {
  max-width: 100%;
}

.pl-content-system :where(.pl-article, .pl-content-section, .legal-main) :where(p, li) {
  color: var(--pl-muted);
  line-height: 1.72;
}

.pl-content-system :where(.pl-article, .pl-content-section, .legal-main) a:not(.pl-button) {
  color: var(--pl-brown);
  font-weight: 700;
  text-decoration-thickness: 1px;
  text-underline-offset: 4px;
}

.pl-content-system :where(.pl-article, .pl-content-section, .legal-main) a:not(.pl-button):hover {
  color: var(--pl-terra);
}

.pl-content-system :where(.pl-article, .pl-content-section, .legal-main) a:not(.pl-button):focus-visible {
  outline: 3px solid var(--pl-gold-text);
  outline-offset: 3px;
}

.pl-content-system :where(.pl-article-hero, .pl-editorial-image, .pl-pep8-hero, .pl-pep8-graphic) {
  display: block;
  width: 100%;
  max-width: 100%;
  margin: var(--pl-space-3) 0;
  overflow: clip;
  border: 1px solid var(--pl-line);
  border-radius: var(--pl-content-surface-radius);
  background: var(--pl-cream);
}

.pl-content-system :where(.pl-article-hero, .pl-editorial-image) {
  max-width: 100%;
  margin-inline: 0;
  aspect-ratio: 16 / 9;
}

.pl-content-system :where(.pl-article-hero, .pl-editorial-image, .pl-pep8-hero, .pl-pep8-graphic) img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.pl-content-system :where(.pl-pep8-hero, .pl-pep8-graphic) img {
  height: auto;
}

.pl-content-system :where(.pl-asset-caption, .pl-pep8-hero figcaption, .pl-pep8-graphic figcaption) {
  display: block;
  width: 100%;
  max-width: none;
  box-sizing: border-box;
  margin: calc(var(--pl-space-2) * -1) 0 var(--pl-space-3);
  color: var(--pl-muted);
  font-size: var(--pl-type-ui-small);
  line-height: 1.45;
}

.pl-content-system .pl-author-meta {
  margin-block: var(--pl-space-3);
  padding-block: var(--pl-space-2);
  border-block: 1px solid var(--pl-line);
  color: var(--pl-muted);
}

.pl-content-system :where(.pl-table-scroll, .pl-table-wrap) {
  max-width: 100%;
  margin-block: var(--pl-space-3);
  overflow-x: auto;
  border-radius: var(--pl-content-surface-radius);
}

.pl-content-system table {
  width: 100%;
  min-width: 0;
  border-collapse: collapse;
  background: var(--pl-paper);
}

.pl-content-system :where(.pl-table-scroll, .pl-table-wrap) table {
  min-width: 560px;
}

.pl-content-system :where(th, td) {
  padding: var(--pl-space-2);
  border: 1px solid var(--pl-line);
  text-align: left;
  vertical-align: top;
}

.pl-content-system th {
  color: var(--pl-brown);
  background: var(--pl-cream);
}

.pl-content-system :where(.pl-note, .notice, .pl-pep8-related) {
  margin-block: var(--pl-space-3);
  padding: var(--pl-space-3);
  border: 1px solid var(--pl-line);
  border-left: 5px solid var(--pl-terra);
  border-radius: var(--pl-content-surface-radius);
  background: var(--pl-cream);
}

.pl-content-system :where(.pl-magazine-grid, .pl-orientation-grid) {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--pl-space-3);
}

.pl-content-system :where(.pl-magazine-card, .pl-orientation-card) {
  min-width: 0;
  overflow: clip;
  border: 1px solid var(--pl-line);
  border-radius: var(--pl-content-surface-radius);
  background: var(--pl-paper);
}

.pl-content-system :where(.pl-magazine-card, .pl-orientation-card) > a {
  display: block;
  color: inherit;
  text-decoration: none;
}

.pl-content-system :where(.pl-magazine-card, .pl-orientation-card) :where(picture, img) {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}

.pl-content-system :where(.pl-magazine-card, .pl-orientation-card) > a > div {
  padding: var(--pl-space-3);
}

.pl-content-system :where(.pl-magazine-card, .pl-orientation-card):hover,
.pl-content-system :where(.pl-magazine-card, .pl-orientation-card):focus-within {
  border-color: var(--pl-terra);
  box-shadow: var(--pl-shadow);
}

.pl-content-system :where(
  .pl-feature-grid article,
  .pl-step-grid li,
  .pl-filter-panel,
  .pl-library-results,
  .pl-library-card,
  .pl-related > a
) {
  border-radius: var(--pl-content-surface-radius);
}

.pl-content-system .pl-ai-disclosure {
  display: block;
  margin: .45rem 0 0;
  color: var(--pl-muted);
  font-size: var(--pl-type-ui-small);
  line-height: 1.35;
}

.pl-content-system .pl-ai-disclosure::before {
  content: "KI";
  display: inline-grid;
  min-width: 1.8rem;
  height: 1.35rem;
  margin-right: .4rem;
  padding-inline: .3rem;
  place-items: center;
  border: 1px solid currentColor;
  border-radius: 999px;
  font-size: .65rem;
  font-weight: 800;
  letter-spacing: .04em;
}

.pl-content-system .pl-footer {
  margin-top: 0;
}

@media (max-width: 760px) {
  .pl-content-system :where(.pl-main, .pl-article-shell) {
    width: min(calc(100% - 24px), var(--pl-content-width));
    padding: var(--pl-space-2) 0 var(--pl-space-5);
  }

  .pl-content-system .pl-article,
  .pl-content-system .pl-content-section,
  .pl-content-system .pl-page-hero {
    margin-block: var(--pl-space-2);
    padding: var(--pl-space-5) var(--pl-space-3) var(--pl-space-3);
  }

  .pl-content-system .legal-main {
    width: min(calc(100% - 24px), var(--pl-content-width));
    margin-block: 32px var(--pl-space-5);
    padding: var(--pl-space-5) var(--pl-space-3) var(--pl-space-3);
  }

  .pl-content-system :where(.pl-main, .pl-article-shell) > .pl-breadcrumb {
    top: 48px;
    right: var(--pl-space-3);
    left: var(--pl-space-3);
  }

  .pl-content-system .pl-article > .pl-breadcrumb {
    top: var(--pl-space-2);
    right: var(--pl-space-3);
    left: var(--pl-space-3);
  }

  .pl-content-system :where(.pl-article, .pl-content-section, .pl-page-hero, .legal-main) h1 {
    font-size: clamp(2.35rem, 13vw, 4rem);
  }

  .pl-content-system :where(.pl-magazine-grid, .pl-orientation-grid) {
    grid-template-columns: 1fr;
  }

  .pl-content-system .pl-footer__inner {
    width: min(calc(100% - 32px), var(--pl-content-width));
    gap: var(--pl-space-3);
  }
}

@media print {
  .pl-content-system :where(.pl-header, .pl-footer, .pl-breadcrumb, .pl-section-action) {
    display: none !important;
  }

  .pl-content-system :where(.pl-main, .pl-article-shell, .pl-article, .legal-main) {
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0;
    border: 0;
    box-shadow: none;
  }
}


/* LIN-098: direkter Planungseinstieg, bewusste Fokuswahl und ruhiger Inhaltsfluss */
.pl-sr-only{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  padding:0!important;
  margin:-1px!important;
  overflow:hidden!important;
  clip:rect(0,0,0,0)!important;
  white-space:nowrap!important;
  border:0!important;
}
.pl-dialog-context{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin:0 0 12px;
  padding:10px 12px;
  border:1px solid color-mix(in srgb,var(--pl-ink) 15%,transparent);
  border-radius:12px;
  background:color-mix(in srgb,var(--pl-paper) 88%,var(--pl-cream));
}
.pl-dialog-context strong{
  min-width:0;
  font-size:var(--pl-type-ui);
  line-height:1.3;
  overflow-wrap:anywhere;
}
.pl-text-button{
  min-width:44px;
  min-height:44px;
  padding:8px 10px;
  border:0;
  border-radius:9px;
  color:var(--pl-ink);
  background:transparent;
  font:inherit;
  font-weight:800;
  text-decoration:underline;
  text-underline-offset:3px;
  cursor:pointer;
}
.pl-text-button:hover{background:color-mix(in srgb,var(--pl-terra) 10%,transparent)}
.pl-text-button:focus-visible{outline:3px solid var(--pl-terra);outline-offset:2px}

#planning-journey-home:empty{display:none}
.pl-journey--compact{
  width:100%;
}
.pl-journey--compact ol{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:8px;
}
.pl-journey--compact li{
  min-width:0;
  padding:10px;
  border-radius:12px;
}
.pl-journey--compact li>span{
  display:grid;
  width:24px;
  height:24px;
  place-items:center;
  border:2px solid color-mix(in srgb,var(--pl-ink) 24%,transparent);
  border-radius:999px;
  font-size:0;
}
.pl-journey--compact li>span::before{
  content:"";
  width:8px;
  height:8px;
  border-radius:999px;
  background:color-mix(in srgb,var(--pl-ink) 30%,transparent);
}
.pl-journey--compact li[data-state="current"]>span{
  border-color:var(--pl-terra);
  background:color-mix(in srgb,var(--pl-terra) 12%,var(--pl-paper));
}
.pl-journey--compact li[data-state="current"]>span::before{background:var(--pl-terra)}
.pl-journey--compact li[data-state="complete"]>span{
  border-color:var(--pl-olive);
  background:var(--pl-olive);
}
.pl-journey--compact li[data-state="complete"]>span::before{
  content:"✓";
  width:auto;
  height:auto;
  color:var(--pl-paper);
  background:transparent;
  font-size:14px;
  font-weight:900;
}
.pl-journey--compact li[data-state="open"]{opacity:.68}
.pl-journey--compact strong,
.pl-journey--compact small{overflow-wrap:normal;word-break:normal}
.pl-journey--in-dialog{
  margin:0 0 14px;
  padding:10px;
  border:1px solid color-mix(in srgb,var(--pl-ink) 12%,transparent);
  border-radius:14px;
  background:var(--pl-paper);
}

.pl-focus-field{
  min-width:0;
  margin:0;
  padding:0;
  border:0;
}
.pl-focus-options{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(170px,1fr));
  gap:8px;
  margin-top:10px;
}
.pl-focus-chip{
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:8px;
  min-width:0;
  min-height:48px;
  padding:9px 11px;
  border:1px solid color-mix(in srgb,var(--pl-ink) 24%,transparent);
  border-radius:12px;
  color:var(--pl-ink);
  background:var(--pl-paper);
  font:inherit;
  text-align:left;
  cursor:pointer;
}
.pl-focus-chip:hover{border-color:var(--pl-terra);background:color-mix(in srgb,var(--pl-terra) 7%,var(--pl-paper))}
.pl-focus-chip.is-selected,
.pl-focus-chip[aria-checked="true"]{
  border-color:var(--pl-terra);
  background:color-mix(in srgb,var(--pl-terra) 12%,var(--pl-paper));
  box-shadow:inset 0 0 0 2px var(--pl-terra);
}
.pl-focus-chip.is-selected,
.pl-focus-chip[aria-checked="true"]{padding-left:40px}
.pl-focus-chip.is-selected::before,
.pl-focus-chip[aria-checked="true"]::before{
  content:"✓";
  position:absolute;
  top:50%;
  left:10px;
  display:grid;
  width:22px;
  height:22px;
  place-items:center;
  transform:translateY(-50%);
  border-radius:999px;
  color:var(--pl-paper);
  background:var(--pl-terra);
  font-weight:900;
}
.pl-focus-chip:focus-visible{outline:3px solid var(--pl-terra);outline-offset:2px}
.pl-focus-chip__label{
  grid-column:1;
  min-width:0;
  font-size:var(--pl-type-ui);
  font-weight:800;
  line-height:1.2;
}
.pl-focus-chip.is-selected .pl-focus-chip__label,
.pl-focus-chip[aria-checked="true"] .pl-focus-chip__label{grid-column:1}
.pl-focus-chip__badge{
  grid-column:2;
  padding:3px 6px;
  border-radius:999px;
  color:var(--pl-ink);
  background:var(--pl-cream);
  font-size:var(--pl-type-ui-small);
  font-weight:800;
  white-space:nowrap;
}
.pl-focus-options[aria-invalid="true"]{
  padding:6px;
  border:2px solid var(--pl-terra);
  border-radius:14px;
}
#training-focus-error:not(:empty){margin-top:8px}

.pl-exercise-card{
  height:auto!important;
  min-height:0!important;
  padding:14px!important;
  gap:10px!important;
}
.pl-exercise-card__heading{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
}
.pl-exercise-card__heading h4{margin:0;font-size:clamp(1rem,1.4vw,1.2rem);line-height:1.2}
.pl-exercise-card__decision{margin:7px 0 0!important;font-size:var(--pl-type-ui);line-height:1.25}
.pl-exercise-card__details{margin:0!important}
.pl-exercise-card__details summary{
  min-height:44px;
  display:flex;
  align-items:center;
  font-weight:800;
  cursor:pointer;
}
.pl-exercise-card__details p{margin:.5rem 0 0!important}
.pl-exercise-card__action{min-height:44px!important}
.pl-exercise-picker__position{display:none!important}

.pl-content-system :is(.pl-article,.pl-content-section){display:flow-root}
.pl-content-flow-media{
  box-sizing:border-box;
  max-width:100%;
}
.pl-content-flow-media picture,
.pl-content-flow-media img{display:block;width:100%;max-width:100%}
.pl-content-flow-media>.pl-asset-caption,
.pl-content-flow-media>.pl-ai-disclosure,
.pl-content-flow-media>figcaption{
  display:block;
  margin-top:8px;
  font-size:var(--pl-type-ui-small);
  line-height:1.4;
}
@media(min-width:761px){
  .pl-content-system .pl-content-flow-media{
    width:clamp(18rem,42%,34rem);
    clear:both;
    margin-top:8px;
    margin-bottom:22px;
  }
  .pl-content-system .pl-content-flow-media--right{
    float:right;
    margin-left:clamp(20px,3vw,42px);
  }
  .pl-content-system .pl-content-flow-media--left{
    float:left;
    margin-right:clamp(20px,3vw,42px);
  }
}
@media(max-width:760px){
  .pl-journey--compact ol{gap:5px}
  .pl-journey--compact li{padding:7px 5px}
  .pl-journey--compact li>span{width:20px;height:20px}
  .pl-journey--compact li small{display:none}
  .pl-journey--compact li strong{font-size:clamp(.7rem,3.1vw,.86rem);line-height:1.15}
  .pl-journey--in-dialog{padding:8px 5px}
  .pl-dialog-context{margin-bottom:8px;padding:7px 9px}
  .pl-focus-options{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
  .pl-focus-chip{min-height:46px;padding:8px}
  .pl-focus-chip__badge{grid-column:1;font-size:.68rem;justify-self:start}
  .pl-exercise-card__heading{display:grid}
  .pl-content-system .pl-content-flow-media{
    float:none;
    width:100%;
    margin:20px 0;
  }
}


/* LIN-099: rahmenloser, horizontal bedienbarer Planer und kompakter Abschluss */
#training-plan-dialog[open]{width:min(1180px,calc(100% - 24px));}
#training-plan-dialog .pl-dialog-context{width:100%;box-sizing:border-box;margin-inline:0;border:0;border-bottom:1px solid var(--pl-line);border-radius:0;background:transparent;}
#training-setup-step{max-width:none;padding:0;border:0;background:transparent;}
#training-setup-step>.pl-field__help,
#training-setup-step .pl-condition-check>.pl-field__help{display:none;}
#training-setup-step .pl-condition-check{padding:0!important;border:0!important;background:transparent!important;}
#training-setup-step .pl-form-row{grid-template-columns:minmax(0,2fr) minmax(220px,1fr);align-items:start;}
#training-setup-step .pl-focus-options{grid-template-columns:repeat(5,minmax(0,1fr));max-height:none;overflow:visible;}
#training-setup-step .pl-focus-chip{height:100%;min-height:52px;}
#training-exercises-step{overflow:visible!important;}
#training-exercises-step .pl-exercise-options[data-exercise-carousel]{max-width:100%;overflow-y:hidden;}
@media(min-width:721px){
  #training-exercises-step .pl-exercise-options[data-exercise-carousel]{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));overflow-x:visible;scroll-snap-type:none;}
}
@media(max-width:720px){
  #training-exercises-step .pl-exercise-options[data-exercise-carousel]>.pl-exercise-card{flex-basis:72vw;max-width:72vw;}
}
#training-exercises-step .pl-dialog__actions{position:sticky;bottom:0;z-index:2;padding-top:10px;background:var(--pl-paper);}
.pl-completed-plan{padding:clamp(16px,2vw,28px);}
.pl-completed-plan__head{gap:16px;}
.pl-completed-plan__head p{white-space:normal;overflow:visible;text-overflow:clip;overflow-wrap:anywhere;}
.pl-completed-plan__actions{max-width:520px;}
.pl-completed-plan__meta{grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin:16px 0 20px;border:0;background:transparent;}
.pl-completed-plan__meta div{padding:8px 10px;border-left:2px solid var(--pl-line);background:transparent;}
.pl-completed-plan__meta div:last-child{grid-column:1/-1;}
@media(max-width:900px){
  #training-setup-step .pl-form-row{grid-template-columns:1fr;}
  #training-setup-step .pl-focus-options{display:flex;gap:8px;padding:4px 2px 12px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;}
  #training-setup-step .pl-focus-chip{flex:0 0 min(260px,72vw);scroll-snap-align:start;}
  .pl-completed-plan__head{grid-template-columns:1fr;}
  .pl-completed-plan__actions{justify-content:flex-start;max-width:none;}
}
@media(max-width:720px){
  #training-plan-dialog[open]{width:100vw;max-width:100vw;}
  .pl-completed-plan__meta{grid-template-columns:repeat(2,minmax(0,1fr));}
  .pl-completed-plan__meta div:last-child{grid-column:1/-1;}
}
@media(max-width:380px){.pl-completed-plan__meta{grid-template-columns:1fr;}.pl-completed-plan__meta div:last-child{grid-column:auto;}}
@media(min-resolution:1.9dppx),(min-width:1px) and (max-width:640px){
  #training-plan-dialog{max-width:100%;}
}
