/* Plan · Abschnitte: dunkle Leisten rasten oben ein (plan-sections.js), Tage
   bekommen Trenner, Konflikte einen Rahmen. Tabelle (#planTable, ab 721 px)
   und Karten (#mobileSchedule, bis 720 px) teilen sich die Bausteine.
   Beide Listen laufen als Block, damit die Leisten am Fenster kleben.
   Betreuung wie im Entwurf 36 % der Zeile (bis 1100 px 40 %); 29 px = Rand und Polster der Zeile. */
body.app-shell #planStep #planTableShell {
  --plan-lead: 84px; --plan-more: 52px; --plan-gap: 16px; --plan-k: 0.36; --plan-min: 240px;
  --plan-coach: max(var(--plan-min), (100% - 29px) * var(--plan-k));
  overflow: clip; overflow-clip-margin: 12px; margin-top: 16px; border: 0; border-radius: 0; background: transparent; box-shadow: none;
}
body.app-shell #planStep :is(#planTableShell, #mobileSchedule) { --plan-line: hsl(40, 19%, 90%); --plan-coral: hsl(13, 65%, 80%); scroll-margin-top: calc(var(--plan-sticky-top, 0px) + 16px); }
body.app-shell #planStep #mobileSchedule { overflow: visible; }
@media (max-width: 1100px) { body.app-shell #planStep #planTableShell { --plan-k: 0.4; --plan-min: 220px; } }
/* Die Spielzeile ist 54 px schmaler als Leiste und Spaltenkopf (Rand + „⋯“-Spalte). */
#planStep #planTable .plan-game-line { --plan-coach: max(var(--plan-min), (100% + 25px) * var(--plan-k)); }
#planStep #planTable.schedule-table, #planStep #planTable.schedule-table > tbody, #planStep #mobileSchedule .mobile-schedule-list { display: block; width: 100%; min-width: 0; }
#planStep #planTable.schedule-table > thead { display: none; }
#planStep #planTable :is(tr, td) { border: 0; }

/* Tages-Trenner */
#planStep :is(#planTable .plan-day-cell, #mobileSchedule .plan-day-row) { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 12px; padding: 26px 2px 10px; border-bottom: 1px solid var(--color-border-strong); background: transparent; }
#planStep #planTable .plan-day-row { display: block; }
body.has-mobile-tabbar #planStep #mobileSchedule .plan-day-row.is-only { display: none; }
body.has-mobile-tabbar #planStep #mobileSchedule .plan-day-row.is-only:first-child + .plan-section-bar { margin-top: 0; }
#planStep :is(#planTable tbody > .plan-day-row:first-child .plan-day-cell, #mobileSchedule .mobile-schedule-list > .plan-day-row:first-child) { padding-top: 2px; }
#planStep :is(#planTable, #mobileSchedule) .plan-day-name { margin: 0; color: var(--color-text); font-family: var(--font-family-base); font-size: 18px; font-weight: 700; line-height: 1.25; letter-spacing: 0; }
#planStep :is(#planTable, #mobileSchedule) .plan-day-summary { color: var(--color-text-muted); font-size: 13px; }

/* Abschnitts-Leiste */
#planStep :is(#planTable, #mobileSchedule) .plan-section-bar { position: sticky; top: calc(var(--plan-sticky-top, 0px) + 6px); z-index: 3; margin-top: 16px; border-radius: 8px; background: var(--color-navy); color: hsl(43, 30%, 92%); box-shadow: 0 -6px 0 6px var(--plan-mask, var(--color-surface)); transition: box-shadow 0.25s ease; }
#planStep #planTable tr.plan-section-bar { display: block; }
#planStep #mobileSchedule .plan-section-bar { display: flex; align-items: center; gap: 10px; min-height: 40px; padding: 0 12px; }
#planStep :is(#planTable, #mobileSchedule) .plan-day-row + .plan-section-bar { margin-top: 14px; }
#planStep #planTable tbody > tr.plan-section-bar:first-child { margin-top: 0; }
#planStep :is(#planTable, #mobileSchedule) .plan-section-bar.is-stuck { box-shadow: 0 -6px 0 6px var(--plan-mask, var(--color-surface)), 0 14px 18px -12px hsl(195, 32%, 15%, 0.6); }
#planStep #planTable .schedule-time-group-cell { display: block; padding: 0; background: transparent; color: inherit; }
#planStep #planTable .schedule-time-group-button { display: grid; grid-template-columns: var(--plan-lead) minmax(0, 1fr) var(--plan-coach) calc(var(--plan-more) - var(--plan-gap)); column-gap: var(--plan-gap); align-items: center; width: 100%; min-height: 40px; padding: 0; border: 0; border-radius: 8px; background: transparent; color: inherit; text-align: left; cursor: pointer; }
#planStep #planTable .plan-section-bar:not(.is-time) .schedule-time-group-button { grid-template-columns: auto minmax(0, 1fr) var(--plan-coach) calc(var(--plan-more) - var(--plan-gap)); padding-left: 7px; }
#planStep #planTable .schedule-time-group-button:hover { background: hsl(197, 30%, 24%); }
#planStep #planTable .schedule-time-group-button:focus-visible { outline: 0; box-shadow: var(--shadow-focus); }
#planStep :is(#planTable, #mobileSchedule) .plan-section-chip { display: block; flex: none; justify-self: center; min-width: 64px; max-width: 100%; height: 26px; padding: 0 9px; overflow: hidden; border-radius: 6px; background: var(--color-text-inverse); color: var(--color-navy); font-size: 15px; font-weight: 700; font-variant-numeric: tabular-nums; line-height: 26px; text-align: center; white-space: nowrap; text-overflow: ellipsis; }
#planStep #mobileSchedule .plan-section-chip { max-width: 60%; font-size: 16px; }
#planStep #planTable .plan-section-bar:not(.is-time) .plan-section-chip { justify-self: start; max-width: 360px; }
#planStep :is(#planTable, #mobileSchedule) .plan-section-chip.is-empty { color: var(--color-text-muted); letter-spacing: 0.04em; }
#planStep :is(#planTable, #mobileSchedule) .plan-section-meta { min-width: 0; overflow: hidden; color: hsl(43, 20%, 80%); font-size: 13px; white-space: nowrap; text-overflow: ellipsis; }
#planStep #mobileSchedule .plan-section-meta { font-size: 14px; }
#planStep :is(#planTable, #mobileSchedule) .plan-section-bar .schedule-time-group-count { display: inline; min-height: 0; padding: 0; border-radius: 0; background: transparent; color: inherit; font: inherit; font-weight: 500; letter-spacing: 0; text-transform: none; }
/* Tag und Spaltenname blenden ein, wenn die Leiste oben einrastet */
#planStep :is(#planTable, #mobileSchedule) .plan-section-day { display: inline-block; max-width: 0; overflow: hidden; vertical-align: bottom; color: hsl(43, 30%, 92%); font-weight: 600; white-space: pre; opacity: 0; transition: max-width 0.35s ease, opacity 0.3s ease; }
#planStep :is(#planTable, #mobileSchedule) .is-stuck .plan-section-day { max-width: 140px; opacity: 1; }
#planStep #planTable .plan-section-column { padding-left: 13px; font-size: 12px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; opacity: 0; transform: translateX(-6px); transition: opacity 0.3s ease, transform 0.3s ease; }
#planStep #planTable .is-stuck .plan-section-column { opacity: 1; transform: none; }
#planStep #mobileSchedule .plan-section-column { display: none; }
#planStep #planTable .schedule-time-group-arrow { justify-self: center; color: hsl(43, 20%, 72%); font-size: 14px; }
#planStep :is(#planTable, #mobileSchedule) .is-stuck .plan-section-chip { animation: plan-dock-pulse 0.55s cubic-bezier(0.3, 1.25, 0.5, 1) 1; }
@keyframes plan-dock-pulse {
  0% { transform: scale(1); box-shadow: 0 0 0 0 hsl(43, 36%, 98%, 0); }
  40% { transform: scale(1.08); box-shadow: 0 0 0 4px hsl(43, 36%, 98%, 0.22); }
  100% { transform: scale(1); box-shadow: 0 0 0 0 hsl(43, 36%, 98%, 0); }
}


/* Spiele: ein Block ist eine Karte, Konflikte bekommen einen Rahmen */
#planStep #planTable tr.schedule-game-row { display: grid; grid-template-columns: minmax(0, 1fr) var(--plan-more); align-items: center; min-height: 64px; }
#planStep :is(#planTable tr.schedule-game-row, #mobileSchedule .mobile-schedule-card) { margin: 0; border: 1px solid var(--color-border); border-top-color: var(--plan-line); border-bottom: 0; border-radius: 0; background: var(--color-surface); box-shadow: none; }
#planStep :is(#planTable tr.schedule-game-row, #mobileSchedule .mobile-schedule-card).is-block-start { margin-top: 8px; border-top-color: var(--color-border); border-radius: 12px 12px 0 0; }
#planStep :is(#planTable tr.schedule-game-row, #mobileSchedule .mobile-schedule-card).is-block-end { border-bottom: 1px solid var(--color-border); border-radius: 0 0 12px 12px; }
#planStep :is(#planTable tr.schedule-game-row, #mobileSchedule .mobile-schedule-card).is-block-start.is-block-end { border-radius: 12px; }
#planStep #planTable tr.schedule-game-row:hover { background: hsl(42, 30%, 96%); }
#planStep #planTable :is(tr.schedule-game-row, tr.plan-issue-row).is-collapsed { display: none; }
#planStep #planTable tr.schedule-game-row > td { display: block; min-width: 0; background: transparent; }
#planStep #planTable td.schedule-game-cell { padding: 10px 0; }
#planStep #planTable td.schedule-actions-col { display: flex; justify-content: center; width: auto; padding: 0; }
#planStep #planTable .schedule-game-content { display: block; width: 100%; max-width: none; padding: 0; }
#planStep #planTable .plan-game-line { display: grid; grid-template-columns: var(--plan-lead) minmax(0, 1fr) var(--plan-coach); column-gap: var(--plan-gap); align-items: center; }
#planStep :is(#planTable, #mobileSchedule) .plan-game-table { display: inline-flex; flex: none; align-items: center; justify-content: center; justify-self: center; min-width: 40px; height: 28px; padding: 0 8px; border-radius: 6px; background: var(--color-navy); color: var(--color-text-inverse); font-size: 13px; font-weight: 600; font-variant-numeric: tabular-nums; line-height: 1; }
#planStep #mobileSchedule .plan-game-table { height: 26px; padding: 0 9px; font-size: 14px; }
#planStep :is(#planTable, #mobileSchedule) .plan-game-table.is-missing { background: var(--color-accent); }
#planStep #planTable .plan-game-who { min-width: 0; }
#planStep #planTable :is(.plan-game-player, .plan-game-sub) { white-space: normal; overflow-wrap: anywhere; }
#planStep #planTable .plan-game-player { color: var(--color-text); font-size: 15px; font-weight: 600; line-height: 20px; }
#planStep #planTable .plan-game-sub { margin-top: 2px; color: var(--color-text-muted); font-size: 13px; line-height: 18px; }
#planStep #planTable .plan-result-notice { margin-top: 2px; color: var(--color-text); font-size: 13px; line-height: 18px; white-space: normal; overflow-wrap: anywhere; }
#planStep :is(#planTable, #mobileSchedule) .plan-game-opponent { color: var(--color-text); }
#planStep :is(#planTable, #mobileSchedule) .plan-game-opponent.is-missing { color: var(--color-danger-text); font-weight: 600; }
#planStep :is(#planTable .plan-game-sub, #mobileSchedule .mobile-game-versus) .association-badge { display: inline; margin: 0; padding: 2px 6px; border: 0; border-radius: 999px; background: var(--color-surface-soft); color: var(--color-text-muted); font-size: 11px; font-weight: 600; letter-spacing: 0.02em; }
#planStep :is(#planTable, #mobileSchedule) .plan-game-result { display: inline-block; margin-left: 8px; padding: 1px 7px; border-radius: 999px; background: var(--color-surface-soft); color: var(--color-text); font-size: 12px; font-weight: 700; font-variant-numeric: tabular-nums; line-height: 18px; vertical-align: 1px; }
#planStep :is(#planTable, #mobileSchedule) .plan-game-result[data-outcome="win"] { background: var(--color-success-soft); color: var(--color-success-text); }
#planStep :is(#planTable, #mobileSchedule) .plan-game-result[data-outcome="loss"] { background: var(--color-danger-soft); color: var(--color-danger-text); }

/* Betreuung: ruhige Auswahl, Problemfälle farbig umrandet */
#planStep :is(#planTable .schedule-coach-control, #mobileSchedule .mobile-match-coach) { position: relative; display: block; min-width: 0; }
#planStep :is(#planTable .schedule-coach-display, #mobileSchedule .mobile-match-coach-display) { display: flex; align-items: center; gap: 0; min-height: 40px; padding: 7px 34px 7px 12px; overflow-wrap: anywhere; border: 1px solid var(--color-border-strong); border-radius: var(--radius-md); background: var(--color-surface); box-shadow: none; color: var(--color-text); white-space: normal; }
#planStep #mobileSchedule .mobile-match-coach-display { min-height: 48px; padding: 9px 40px 9px 14px; font-size: 16px; font-weight: 500; }
#planStep #mobileSchedule .mobile-match-coach select { position: absolute; inset: 0; z-index: 2; width: 100%; height: 100%; opacity: 0.01; cursor: pointer; }
#planStep :is(#planTable .schedule-coach-control, #mobileSchedule .mobile-match-coach)::after { position: absolute; top: 50%; right: 15px; width: 7px; height: 7px; margin-top: -6px; border-right: 1.5px solid var(--color-text-muted); border-bottom: 1.5px solid var(--color-text-muted); transform: rotate(45deg); content: ""; pointer-events: none; }
#planStep #planTable .schedule-coach-control:hover .schedule-coach-display { border-color: var(--color-text-muted); }
#planStep :is(#planTable .schedule-coach-control, #mobileSchedule .mobile-match-coach):has(:focus-visible) :is(.schedule-coach-display, .mobile-match-coach-display) { border-color: var(--color-accent); box-shadow: var(--shadow-focus); }
#planStep #planTable .schedule-coach-code { flex: none; white-space: nowrap; color: var(--color-text-muted); font-size: 14px; font-weight: 600; }
#planStep #planTable .schedule-coach-code:not(:empty)::after { margin: 0 6px; content: "·"; }
#planStep #planTable .schedule-coach-name { min-width: 0; color: var(--color-text); font-size: 14px; font-weight: 500; white-space: normal; overflow-wrap: anywhere; }
#planStep :is(#planTable .schedule-coach-control, #mobileSchedule .mobile-match-coach).is-missing :is(.schedule-coach-display, .mobile-match-coach-display) { border-style: dashed; border-color: hsl(2, 64%, 62%); background: hsl(2, 64%, 98%); color: var(--color-danger-text); }
#planStep :is(#planTable .schedule-coach-control.is-missing .schedule-coach-name, #mobileSchedule .mobile-match-coach.is-missing .mobile-match-coach-display) { color: var(--color-danger-text); font-weight: 600; }

/* „⋯“ öffnet die Felder des Spiels direkt in Zeile oder Karte */
#planStep :is(#planTable .plan-game-more, #mobileSchedule .mobile-schedule-details > summary) { display: flex; align-items: center; justify-content: center; width: 36px; min-width: 36px; height: 36px; min-height: 36px; padding: 0; border: 0; border-radius: var(--radius-md); background: transparent; color: var(--color-text-muted); font-size: 18px; font-weight: 600; line-height: 1; list-style: none; cursor: pointer; }
#planStep :is(#planTable .plan-game-more:hover, #planTable .plan-game-more[aria-expanded="true"], #mobileSchedule .mobile-schedule-details > summary:hover, #mobileSchedule .mobile-schedule-details[open] > summary) { background: var(--color-surface-soft); color: var(--color-text); }
#planStep :is(#planTable .plan-game-more, #mobileSchedule .mobile-schedule-details > summary):focus-visible { outline: 0; box-shadow: var(--shadow-focus); }
#planStep #planTable tr.schedule-game-row.is-editing { align-items: start; background: hsl(42, 30%, 96%); }
#planStep #planTable tr.is-editing td.schedule-actions-col { padding-top: 14px; }
#planStep #planTable .plan-game-editor:not([hidden]) { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px 12px; margin: 12px 0 4px calc(var(--plan-lead) + var(--plan-gap)); padding-top: 12px; border-top: 1px solid var(--plan-line); }
#planStep #planTable .plan-game-field { display: grid; gap: 4px; min-width: 0; }
#planStep #planTable .plan-game-field.is-wide { grid-column: span 2; }
#planStep #planTable .plan-game-field > span { color: var(--color-text-muted); font-size: 12px; font-weight: 600; }
#planStep #planTable .plan-game-field :is(input, textarea) { width: 100%; min-width: 0; height: auto; min-height: 36px; max-height: none; padding: 6px 10px; border: 1px solid var(--color-border-strong); border-radius: var(--radius-md); background: var(--color-surface); color: var(--color-text); font-size: 14px; font-weight: 500; line-height: 1.35; text-align: left; resize: vertical; }
#planStep #planTable .plan-game-editor-actions { display: flex; grid-column: 1 / -1; justify-content: flex-end; }
#planStep #planTable .plan-game-editor-actions .schedule-delete-button { width: auto; min-width: 0; min-height: 36px; padding: 0 14px; opacity: 1; }

/* Karten (bis 720 px) */
#planStep #mobileSchedule .mobile-schedule-card { position: relative; display: grid; gap: 8px; padding: 14px; }
#planStep #mobileSchedule .mobile-game-who { min-width: 0; padding-right: 40px; }
#planStep #mobileSchedule .mobile-game-player { display: block; color: var(--color-text); font-size: 17px; font-weight: 600; line-height: 1.3; overflow-wrap: anywhere; }
#planStep #mobileSchedule .mobile-game-player .plan-game-result { font-size: 13px; line-height: 20px; }
#planStep #mobileSchedule .mobile-game-versus { margin-top: 2px; color: var(--color-text-muted); font-size: 15px; line-height: 1.4; }
#planStep #mobileSchedule .mobile-game-versus .association-badge { font-size: 12px; }
#planStep #mobileSchedule .mobile-game-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; min-width: 0; }
#planStep #mobileSchedule .mobile-schedule-competition { min-width: 0; color: var(--color-text-muted); font-size: 15px; line-height: 1.35; }
#planStep #mobileSchedule .mobile-schedule-details { position: static; min-width: 0; max-width: none; overflow: visible; border: 0; border-radius: 0; background: transparent; }
#planStep #mobileSchedule .mobile-schedule-details > summary { position: absolute; top: 6px; right: 6px; width: 44px; min-width: 44px; height: 44px; min-height: 44px; font-size: 20px; }
#planStep #mobileSchedule .mobile-schedule-details > summary::-webkit-details-marker { display: none; }
#planStep #mobileSchedule .mobile-schedule-details[open] .mobile-schedule-fields { margin-top: 4px; padding-top: 12px; border-top: 1px solid var(--plan-line); }

/* Abschluss nach dem letzten Spiel */
#planStep #planTable .plan-end-row { display: block; }
#planStep :is(#planTable .plan-end-cell, #mobileSchedule .plan-end-row) { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 30px 0 8px; background: transparent; color: var(--color-text-muted); font-size: 13px; }
#planStep :is(#planTable, #mobileSchedule) .plan-end-line { display: flex; align-items: center; gap: 12px; color: var(--color-text); font-weight: 600; }
#planStep :is(#planTable, #mobileSchedule) .plan-end-line::before, #planStep :is(#planTable, #mobileSchedule) .plan-end-line::after { width: 52px; height: 1px; background: var(--color-border-strong); content: ""; }
#planStep :is(#planTable, #mobileSchedule) .plan-end-top { min-height: 36px; margin-top: 8px; padding: 0 14px; font-size: 13px; }

@media (pointer: coarse) {
  #planStep #planTable .plan-game-more { width: 44px; min-width: 44px; height: 44px; min-height: 44px; }
  #planStep :is(#planTable .schedule-coach-display, #mobileSchedule .plan-end-top) { min-height: 44px; }
}
@media (prefers-reduced-motion: reduce) {
  #planStep :is(#planTable, #mobileSchedule) .is-stuck .plan-section-chip { animation: none; }
  #planStep :is(#planTable, #mobileSchedule) :is(.plan-section-day, .plan-section-column, .plan-section-bar) { transition: none; }
}

/* Werkzeugleiste wie im Entwurf: Ansicht · Tage · Offene Punkte · Filter, dahinter „⋯“ (Plan aktualisieren)
   in einer Zeile. Steuerelemente 36 px, bei Touch 44 px; Reiter bleiben in ihrem Segment. */
#planStep #planToolbar { position: relative; display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 0 0 14px; padding: 0; border: 0; background: transparent; }
#planStep #planToolbar .plan-primary-toolbar { display: flex; align-items: center; gap: 10px; margin: 0; padding: 0; border: 0; background: transparent; box-shadow: none; }
#planStep #planToolbar .plan-view-switch { display: flex; align-items: center; margin: 0; padding: 0; border: 0; }
#planStep #planToolbar .plan-view-switch > span, #planStep #planToolbar .plan-status-line, #planStep #planToolbar .plan-conflict-filter { display: none; }
#planStep :is(#planToolbar .tabs, #planDayTabs) { display: inline-flex; height: var(--plan-ctl); margin: 0; padding: 3px; gap: 2px; border: 0; border-radius: var(--radius-md); background: var(--color-surface-soft); box-shadow: none; }
#planStep #planDayTabs[hidden] { display: none; }
#planStep :is(#planToolbar .tab, #planDayTabs .plan-day-tab) { height: 100%; min-height: 0; padding: 0 12px; border: 0; border-radius: 6px; background: transparent; box-shadow: none; color: var(--color-text-muted); font-size: 14px; font-weight: 600; white-space: nowrap; cursor: pointer; }
#planStep :is(#planToolbar .tab[aria-selected="true"], #planDayTabs .plan-day-tab[aria-pressed="true"]) { background: var(--color-surface); color: var(--color-text); box-shadow: 0 1px 2px hsl(195, 32%, 20%, 0.15); }
#planStep #planToolbar .plan-mobile-filter-actions { display: flex; gap: 10px; margin: 0 0 0 auto; padding: 0; }
#planStep #planToolbar :is(.plan-mobile-filter-actions button, .plan-work-actions > summary) { display: inline-flex; align-items: center; justify-content: center; gap: 8px; width: auto; height: var(--plan-ctl); min-height: 0 !important; margin: 0; padding: 0 14px; border: 1px solid var(--color-border-strong); border-radius: var(--radius-md); background: var(--color-surface); color: var(--color-text); font-size: 14px; font-weight: 600; white-space: nowrap; cursor: pointer; list-style: none; }
#planStep #planToolbar :is(.plan-mobile-filter-actions button, .plan-work-actions > summary):hover { border-color: var(--color-text-muted); }
#planStep #planToolbar .plan-work-actions > summary::-webkit-details-marker { display: none; }
#planStep #planToolbar .plan-work-actions > summary::after { content: "▼"; font-size: 10px; opacity: 0.7; }
/* Desktop und Tablet (ohne Handy-Leiste): Reiter bleiben im Segment; mit Plan sind „Planaktionen“
   ein quadratischer „⋯“-Knopf, der Text bleibt als Name für Screenreader. */
body:not(.has-mobile-tabbar) #planStep #planToolbar { margin-bottom: 12px; }
body:not(.has-mobile-tabbar) #planStep :is(#planToolbar .tab, #planDayTabs .plan-day-tab) { min-height: 0 !important; }
body:not(.is-plan-empty, .has-mobile-tabbar) #planStep #planToolbar .plan-work-actions > summary { width: var(--plan-ctl); padding: 0; font-size: 0; }
body:not(.is-plan-empty, .has-mobile-tabbar) #planStep #planToolbar .plan-work-actions > summary::after { content: "⋯" / ""; font-size: 18px; line-height: 1; opacity: 1; }
body:not(.is-plan-empty, .has-mobile-tabbar) #planStep #planToolbar .plan-work-actions[open] > summary { border-color: var(--color-text-muted); background: var(--color-surface-soft); }
/* Ohne Seitenleiste (Tablet) reicht der Platz für „⋯“ nur mit dem kurzen Namen „Offen“. */
@media (max-width: 1100px) {
  body:not(.has-mobile-tabbar) #planStep #planToolbar .lbl-long { display: none; }
  body:not(.has-mobile-tabbar) #planStep #planToolbar .lbl-short { display: inline; }
}
#planStep #planToolbar .plan-count { display: inline-flex; align-items: center; justify-content: center; min-width: 20px; height: 20px; padding: 0 6px; border-radius: 999px; background: var(--color-surface-soft); color: var(--color-text); font-size: 12px; font-weight: 700; }
#planStep #planToolbar .plan-count[hidden] { display: none; }
#planStep #planToolbar .plan-chevron { font-size: 10px; opacity: 0.7; }
#planStep #planToolbar .lbl-short { display: none; }
#planStep #planToolbar #planMobileConflictsToggle[aria-pressed="true"] { border-color: hsl(13, 65%, 80%); background: hsl(13, 75%, 95%); color: hsl(13, 62%, 36%); }
#planStep #planToolbar #planMobileConflictsToggle[aria-pressed="true"] .plan-count { background: var(--color-accent); color: #fff; }
#planStep #planToolbar #planMobileConflictsToggle:disabled { opacity: 0.55; cursor: default; }
/* Plan aktualisieren: ruhiger Knopf, Menü rechtsbündig unter der Werkzeugleiste wie „Filter“; vor dem ersten Plan offen und breit */
#planStep #planToolbar .plan-work-actions { position: static; margin: 0; padding: 0; border: 0; background: transparent; box-shadow: none; }
#planStep #planToolbar .plan-refresh-source { flex: 1 0 100%; margin: 0; padding: 0; border: 0; background: none; }
#planStep #planToolbar .plan-refresh-source > summary { min-height: 44px; display: flex; align-items: center; gap: 8px; cursor: pointer; color: var(--color-text-muted); font-size: 13px; }
#planStep #planToolbar .plan-refresh-source > summary::after { content: "▾"; }
#planStep #planSourceSyncStatus[data-error="true"] { color: var(--color-accent); }
#planStep #planToolbar .plan-refresh-source:not([open]) > :not(summary) { display: none; }
#planStep #planToolbar .plan-refresh-source-controls { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; padding-bottom: 10px; }
#planStep #planToolbar .plan-refresh-source button { min-height: 44px; margin: 0; font-size: 15px; }
#planStep #planRefreshSourceHint { flex: 1 1 220px; color: var(--color-text-muted); font-size: 13px; line-height: 1.4; }
#planStep #planToolbar .plan-show-all { flex: 1 0 100%; }
#planStep #planToolbar .plan-show-all:not(:has(button:not([hidden]))) { display: none; }
#planStep #planShowAllBtn { min-height: 44px; margin: 0; }
#planStep #planToolbar .plan-work-actions[open] > :not(summary) { position: absolute; top: calc(100% + 6px); right: 0; z-index: 30; width: min(560px, 100%); max-width: none; padding: 14px; border: 1px solid var(--color-border); border-radius: 12px; background: var(--color-surface); box-shadow: 0 12px 32px hsl(195, 32%, 20%, 0.18); }
body.is-plan-empty #planStep #planToolbar .plan-work-actions { order: -1; flex: 1 0 100%; }
body.is-plan-empty #planStep #planToolbar .plan-work-actions[open] > :not(summary) { position: static; width: auto; margin-top: 10px; box-shadow: none; }
/* Filter als Menü unter der Werkzeugleiste */
#planStep #planToolbar #planFilters { position: absolute; top: calc(100% + 6px); right: 0; z-index: 30; display: none; width: min(320px, calc(100vw - 32px)); margin: 0; padding: 14px; gap: 12px; border: 1px solid var(--color-border); border-radius: 12px; background: var(--color-surface); box-shadow: 0 12px 32px hsl(195, 32%, 20%, 0.18); }
#planStep #planToolbar #planFilters.is-mobile-open { display: grid; grid-template-columns: 1fr; }
#planStep #planToolbar #planFilters .field { display: grid; gap: 4px; min-width: 0; margin: 0; }
#planStep #planToolbar #planFilters label { margin: 0; color: var(--color-text-muted); font-size: 12px; font-weight: 600; letter-spacing: 0; text-transform: none; }
#planStep #planToolbar #planFilters select { width: 100%; height: 36px; min-height: 0; padding: 0 34px 0 10px; border: 1px solid var(--color-border-strong); border-radius: var(--radius-md); background: linear-gradient(45deg, #0000 50%, currentColor 50%) calc(100% - 17px) 50% / 5px 5px no-repeat, linear-gradient(135deg, currentColor 50%, #0000 50%) calc(100% - 12px) 50% / 5px 5px no-repeat, var(--color-surface); font-size: 14px; }
#planStep #planToolbar #planFilters .plan-size-field { display: none; }
/* Zusammenfassung bleibt für Screenreader, sichtbar zählt die Fußleiste */
#planStep #planViewSummary { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* Spaltenkopf über der Liste */
#planStep #planTable.schedule-table > thead { display: block; }
#planStep #planTable .plan-column-head { display: block; }
#planStep #planTable .plan-column-head th { display: grid; grid-template-columns: var(--plan-lead) minmax(0, 1fr) var(--plan-coach) calc(var(--plan-more) - var(--plan-gap)); column-gap: var(--plan-gap); align-items: center; padding: 0 0 8px; border: 0; background: transparent; color: var(--color-text-muted); font-size: 12px; font-weight: 600; letter-spacing: 0.06em; text-align: left; text-transform: uppercase; }
#planStep #planTable .plan-column-head th > span:first-child { text-align: center; }
#planStep :is(#planTable, #mobileSchedule) [data-plan-day] { scroll-margin-top: calc(var(--plan-sticky-top, 0px) + 8px); }

/* Fußleiste im Plan wie im Entwurf: weiß mit Linie, Knöpfe 36 px (Touch 44 px), „Exportieren“ so breit wie sein Text */
body.app-shell:not(.has-mobile-tabbar) .workflow-footer:has(> .plan-footer) { padding: 12px var(--plan-gutter); border-top: 1px solid var(--color-border); background: var(--color-surface); }
body.app-shell:not(.has-mobile-tabbar) .workflow-footer .plan-footer { display: flex; align-items: center; gap: 10px; max-width: none; }
body.app-shell:not(.has-mobile-tabbar) .workflow-footer .plan-footer-counts { display: flex; flex: 1; align-items: baseline; gap: 8px; min-width: 0; white-space: nowrap; }
body.app-shell:not(.has-mobile-tabbar) .workflow-footer .plan-footer-counts :is(strong, span) { font-size: 14px; line-height: 20px; }
body.app-shell .workflow-footer .plan-footer-counts strong { color: hsl(13, 62%, 36%); }
body.app-shell .workflow-footer .plan-footer.is-success .plan-footer-counts strong { color: var(--color-success-text); }
body.app-shell .workflow-footer .plan-footer-counts span { overflow: hidden; color: var(--color-text-muted); text-overflow: ellipsis; }
body.app-shell .workflow-footer .plan-footer-actions { display: flex; align-items: center; gap: 10px; }
body.app-shell:not(.has-mobile-tabbar) #workflowFooter .plan-footer-actions .btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; width: auto; min-width: 0; height: var(--plan-ctl); min-height: 0 !important; padding: 0 14px; font-size: 14px; white-space: nowrap; }
body.app-shell .workflow-footer .plan-chevron { font-size: 10px; opacity: 0.75; }
.plan-pop-wrap { position: relative; }
.plan-pop { position: absolute; right: 0; bottom: calc(100% + 8px); z-index: 40; display: grid; gap: 2px; width: 320px; max-height: 60vh; overflow: auto; padding: 10px; border: 1px solid var(--color-border); border-radius: 12px; background: var(--color-surface); box-shadow: 0 12px 32px hsl(195, 32%, 20%, 0.18); text-align: left; }
.plan-pop[hidden] { display: none; }
.plan-kinds-toggle + .plan-pop { right: auto; left: 0; width: 360px; }
body.app-shell .plan-pop :is(.plan-kind, .plan-export-item) { display: grid; justify-content: stretch; justify-items: stretch; gap: 1px; width: 100%; min-height: 44px; margin: 0; padding: 10px; border: 0; border-radius: var(--radius-md); background: transparent; color: var(--color-text); text-align: left; white-space: normal; cursor: pointer; appearance: none; }
body.app-shell .plan-pop .plan-export-choice { grid-template-columns: minmax(0, 1fr); }
body.app-shell .plan-pop :is(strong, small) { min-width: 0; text-align: left; white-space: normal; overflow-wrap: anywhere; }
.plan-pop :is(.plan-kind, .plan-export-item):hover:not(:disabled) { background: var(--color-bg); }
.plan-pop :is(.plan-kind, .plan-export-item):disabled { cursor: default; opacity: 0.55; }
body.app-shell .plan-pop .plan-kind { grid-template-columns: 10px minmax(0, 1fr) auto; align-items: center; gap: 10px; }
.plan-pop .plan-kind-dot { width: 10px; height: 10px; border-radius: 50%; background: var(--color-accent); }
.plan-pop .plan-kind.is-soft .plan-kind-dot { background: var(--color-warning); }
.plan-pop .plan-kind.is-info .plan-kind-dot { background: hsl(205, 55%, 52%); }
.plan-pop .plan-kind-copy { display: grid; min-width: 0; }
.plan-pop :is(.plan-kind, .plan-export-item) strong { font-size: 14px; font-weight: 600; }
.plan-pop :is(.plan-kind, .plan-export-item) small { color: var(--color-text-muted); font-size: 12px; }
.plan-pop .plan-kind-count { font-weight: 700; font-variant-numeric: tabular-nums; }
body.app-shell .plan-pop .plan-export-item.is-more { margin-top: 4px; border-top: 1px solid var(--color-border); border-radius: 0; color: var(--color-text-muted); font-size: 13px; }
/* Desktop und Tablet (ohne Handy-Leiste): Menüs wie im Entwurf, Einträge 8/10 px, Titel fett, Hinweise normal,
   gesperrte Einträge ruhig ausgegraut; Sperrgrund einmal oben (Inhalt folgt mit P2). */
body.app-shell:not(.has-mobile-tabbar) .plan-pop { padding: 14px; }
body.app-shell:not(.has-mobile-tabbar) .plan-kinds-toggle + .plan-pop { width: 380px; }
body.app-shell:not(.has-mobile-tabbar) .plan-pop button:is(.plan-kind, .plan-export-item) { min-height: var(--plan-ctl) !important; padding: 8px 10px; font-weight: 400; }
body.app-shell:not(.has-mobile-tabbar) .plan-pop button:is(.plan-kind, .plan-export-item):hover:not(:disabled) { background: var(--color-bg); }
body.app-shell:not(.has-mobile-tabbar) .plan-pop button:is(.plan-kind, .plan-export-item):disabled { color: var(--color-text-muted); opacity: 0.55; }
body.app-shell:not(.has-mobile-tabbar) .plan-pop :is(.plan-kind, .plan-export-item) strong { font-weight: 700; }
body.app-shell:not(.has-mobile-tabbar) .plan-pop .plan-kind strong { font-size: 13px; }
body.app-shell:not(.has-mobile-tabbar) .plan-pop small { font-weight: 400; }
.plan-pop .plan-pop-warn { margin: 0 0 6px; padding: 8px 10px; border-radius: var(--radius-md); background: hsl(13, 75%, 95%); color: hsl(13, 62%, 36%); font-size: 13px; }

/* Die Auslastungs-Zusammenfassung darf die Überschrift nicht verdrängen. */
body.app-shell #assignmentsStep .assignment-side-details > summary { grid-template-columns: minmax(0, 1fr) 14px; align-items: start; }
body.app-shell #assignmentsStep .assignment-side-details > summary strong { grid-column: 1; grid-row: 1; letter-spacing: normal; overflow-wrap: anywhere; }
body.app-shell #assignmentsStep .assignment-side-details > summary span { grid-column: 1; grid-row: 2; text-align: left; white-space: normal; overflow-wrap: anywhere; }
body.app-shell #assignmentsStep .assignment-side-details > summary::after { grid-column: 2; grid-row: 1; }
body.app-shell #assignmentsStep .assignment-lock-repair { display: block; margin-top: 8px; min-height: 44px; max-width: 100%; padding: 8px; font-size: 13px; white-space: normal; }
#planStep :is(#planTable .schedule-coach-control, #mobileSchedule .mobile-match-coach):has(select:disabled)::after { content: "🔒"; position: absolute; right: 10px; top: 50%; width: 16px; height: 16px; margin: 0; border: 0; transform: translateY(-50%); font-size: 14px; line-height: 16px; pointer-events: none; }
#planStep :is(#planTable .schedule-coach-control, #mobileSchedule .mobile-match-coach):has(select:disabled) { cursor: not-allowed; }
#planStep :is(#planTable .schedule-coach-control, #mobileSchedule .mobile-match-coach):has(select:disabled) > span { padding-right: 32px; }

/* Seitenleiste 1:1 wie im Entwurf (gilt in allen Schritten). Maße aus dem Prototyp:
   20/16 px Innenabstand, 20 px zwischen den Gruppen, Einträge 40 px (Zusatzbereiche 36 px),
   Status unten angeheftet. Verband, Turnieraktionen („⋯“) und Sicherung bleiben erhalten. */
body.app-shell #appSidebar:not(.is-rail) { gap: 20px; padding: 20px 16px; }
body.app-shell #appSidebar:not(.is-rail) > :is(.sidebar-head, .project-bar, .sidebar-nav, .sidebar-status, .site-footer) { flex-shrink: 0; margin: 0; }
body.app-shell #appSidebar:not(.is-rail) > .sidebar-head { min-height: 0; padding: 0; border: 0; }
/* ✕ schließt die Schublade */
#appSidebar .sidebar-close { display: none; }
@media (max-width: 1100px) { body:not(.has-mobile-tabbar) #appSidebar:not(.is-rail) .sidebar-close { display: inline-flex; align-items: center; justify-content: center; flex: none; width: auto; height: 36px; min-height: 0; aspect-ratio: 1; padding: 0; border: 1px solid hsl(195, 20%, 35%); border-radius: var(--radius-md); background: transparent; color: var(--color-text-inverse); font-size: 15px; } }
@media (max-width: 900px), (pointer: coarse) { body:not(.has-mobile-tabbar) #appSidebar:not(.is-rail) .sidebar-close { width: 44px; height: 44px; } }
#appSidebar .sidebar-close:hover { background: hsl(197, 30%, 27%); }
body.app-shell #appSidebar:not(.is-rail) .sidebar-brand { display: flex; align-items: center; gap: 8px; min-height: 28px; margin: 0; padding: 2px 8px; color: #fff; line-height: 1; }
body.app-shell #appSidebar:not(.is-rail) .sidebar-brand :is(span, img) { font-size: 24px; }
body.app-shell #appSidebar:not(.is-rail) .sidebar-brand img { width: 24px; height: 24px; }
/* Turnier */
body.app-shell #appSidebar:not(.is-rail) > .project-bar { display: block; padding: 0; border: 0; background: transparent; }
body.app-shell #appSidebar:not(.is-rail) .project-current { display: none; }
body.app-shell #appSidebar:not(.is-rail) .project-controls { position: relative; display: block; margin: 0; padding: 0; }
body.app-shell #appSidebar:not(.is-rail) .project-switch { display: block; margin: 0; }
body.app-shell #appSidebar:not(.is-rail) :is(.project-switch label, .sidebar-nav-title) { display: block; margin: 0; padding: 0 8px 6px; color: hsl(195, 15%, 70%); font-size: 11px; font-weight: 600; letter-spacing: 0.1em; line-height: 16px; text-transform: uppercase; }
body.app-shell #appSidebar:not(.is-rail) #projectSelect { width: calc(100% - 46px); height: 40px; min-height: 0; margin: 0; padding: 0 30px 0 10px; border: 1px solid hsl(195, 20%, 35%); border-radius: var(--radius-md); background-color: var(--color-navy-soft); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%23c3cfd2' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); background-position: right 12px center; background-repeat: no-repeat; color: var(--color-text-inverse); font-size: 14px; -webkit-appearance: none; appearance: none; }
@media (max-width: 1100px) { body.app-shell #appSidebar:not(.is-rail) #projectSelect { font-size: 16px; } } /* iOS zoomt unter 16 px */
body.app-shell #appSidebar:not(.is-rail) #projectMobileActionsToggle { position: absolute; top: 22px; right: 0; display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; min-height: 0; margin: 0; padding: 0; overflow: hidden; border: 1px solid hsl(195, 20%, 35%); border-radius: var(--radius-md); background: var(--color-navy-soft); color: transparent; font-size: 0; }
body.app-shell #appSidebar:not(.is-rail) #projectMobileActionsToggle::before { color: hsl(195, 15%, 75%); font-size: 18px; font-weight: 700; line-height: 1; content: "⋯"; }
body.app-shell #appSidebar:not(.is-rail) #projectMobileActionsToggle:is(:hover, [aria-expanded="true"]) { border-color: hsl(195, 20%, 45%); background: hsl(197, 26%, 28%); }
body.app-shell #appSidebar:not(.is-rail) #projectMobileActionsToggle:is(:hover, [aria-expanded="true"])::before { color: #fff; }
/* Turnier-Menü („⋯“) als Klappmenü; IDs schlagen ältere helle Knopfregeln. */
body.app-shell #appSidebar:not(.is-rail) #projectActions.is-mobile-open { position: absolute; top: calc(100% + 6px); right: 0; z-index: 20; display: grid; grid-template-columns: minmax(0, 1fr); gap: 2px; width: min(248px, 100%); margin: 0; padding: 6px; border: 1px solid hsl(195, 20%, 40%); border-radius: var(--radius-md); background: hsl(197, 26%, 28%); box-shadow: 0 14px 32px rgba(7, 26, 45, 0.55); }
body.app-shell #appSidebar:not(.is-rail) #projectActions button:not([hidden]) { display: flex; align-items: center; justify-content: flex-start; width: 100%; min-height: 44px; margin: 0; padding: 0 10px; border: 0; border-radius: 6px; background: transparent; box-shadow: none; color: hsl(43, 20%, 88%); font-size: 14px; font-weight: 400; text-align: left; }
body.app-shell #appSidebar:not(.is-rail) #projectActions button:not([hidden]):hover:not(:disabled) { background: hsl(197, 26%, 35%); color: #fff; }
body.app-shell #appSidebar:not(.is-rail) #projectActions button:disabled { color: hsl(195, 12%, 60%); }
body.app-shell #appSidebar:not(.is-rail) #projectActions #deleteProjectBtn { margin-top: 4px; border: 0 !important; border-top: 1px solid hsl(195, 20%, 40%) !important; border-radius: 0; background: transparent !important; color: hsl(14, 90%, 80%) !important; }
body.app-shell #appSidebar:not(.is-rail) #projectActions #deleteProjectBtn:hover { background: hsl(197, 26%, 35%) !important; }
/* Drawer ohne Handyleiste: Navigation über die volle Höhe. */
@media (max-width: 1100px) {
  body.app-shell:not(.has-mobile-tabbar) #appSidebar:not(.is-rail).app-sidebar { inset: 0 auto 0 0; height: auto; max-height: none; border-radius: 0 var(--radius-lg) var(--radius-lg) 0; padding-bottom: calc(20px + env(safe-area-inset-bottom, 0px)); }
  body.app-shell:not(.has-mobile-tabbar) #appSidebar:not(.is-rail) .sidebar-brand { flex: 1 1 0; min-width: 0; }
  body.app-shell:not(.has-mobile-tabbar) #appSidebar:not(.is-rail) .sidebar-brand img { flex: none; }
  body.app-shell:not(.has-mobile-tabbar) #appSidebar:not(.is-rail) .sidebar-brand > span { min-width: 0; white-space: normal; font-size: 20px; line-height: 1.15; }
  /* Konto-Menü (z-index 2050) nicht über dem Abdunkeln */
  body.app-shell:not(.has-mobile-tabbar):has(#appShellToggle:checked) .account-menu { visibility: hidden; }
}
/* Ablauf und Zusatzbereiche */
body.app-shell #appSidebar:not(.is-rail) .sidebar-nav { gap: 2px; padding: 0; border: 0; }
body.app-shell #appSidebar:not(.is-rail) .sidebar-link { display: flex; align-items: center; gap: 10px; height: 40px; min-height: 40px; padding: 0 10px; border: 0; border-radius: var(--radius-md); background: transparent; box-shadow: none; color: hsl(43, 20%, 88%); font-size: 15px; font-weight: 400; transform: none; }
body.app-shell #appSidebar:not(.is-rail) .sidebar-link:hover { background: hsl(197, 30%, 25%); color: #fff; transform: none; }
body.app-shell #appSidebar:not(.is-rail) .sidebar-link[data-sidebar-step="overview"] { display: flex; }
body.app-shell #appSidebar:not(.is-rail) .sidebar-link .sidebar-label { display: flex; flex: 1 1 auto; align-items: center; gap: 10px; min-width: 0; color: inherit; font-size: 15px; font-weight: inherit; line-height: 1.3; white-space: nowrap; }
body.app-shell #appSidebar:not(.is-rail) .sidebar-link .sidebar-label::before { flex: 0 0 20px; color: hsl(195, 15%, 62%); font-family: inherit; font-size: 12px; font-weight: 400; text-align: center; }
body.app-shell #appSidebar:not(.is-rail) .sidebar-link[data-sidebar-step="overview"] .sidebar-label::before { content: "⌂"; font-size: 14px; }
body.app-shell #appSidebar:not(.is-rail) .sidebar-nav-secondary .sidebar-link[data-utility-target="trainerManagement"] .sidebar-label::before { content: "≡"; font-size: 14px; }
body.app-shell #appSidebar:not(.is-rail) .sidebar-nav-secondary .sidebar-link[data-nav-target="kurzanleitung"] .sidebar-label::before { content: "?"; }
/* helles Korall auf Navy, Zahl dunkel (Weiß: 3,2 : 1) */
body.app-shell #appSidebar:not(.is-rail) :is(.sidebar-link.is-active, .sidebar-link[aria-current="page"]) { background: hsl(197, 30%, 27%); box-shadow: inset 3px 0 0 var(--color-accent-on-dark); color: #fff; font-weight: 600; }
body.app-shell #appSidebar:not(.is-rail) .sidebar-link.is-complete::after { margin-left: auto; color: hsl(161, 45%, 70%); font-size: 12px; font-weight: 700; content: "✓"; }
body.app-shell #appSidebar:not(.is-rail) .sidebar-link:has(.sidebar-count)::after { content: none; }
body.app-shell #appSidebar:not(.is-rail) .sidebar-count { display: inline-flex; align-items: center; justify-content: center; min-width: 22px; height: 20px; margin-left: auto; padding: 0 6px; border-radius: 999px; background: var(--color-accent-on-dark); color: hsl(195, 32%, 12%); font-size: 12px; font-weight: 700; }
body.app-shell #appSidebar:not(.is-rail) .sidebar-nav-secondary :is(.sidebar-link, .project-backup-actions > summary) { height: 36px; min-height: 36px; font-size: 14px; }
body.app-shell #appSidebar:not(.is-rail) .sidebar-nav-secondary .sidebar-label { font-size: 14px; }
body.app-shell #appSidebar:not(.is-rail) .sidebar-nav-secondary .project-backup-actions { color: inherit; }
body.app-shell #appSidebar:not(.is-rail) .sidebar-nav-secondary .project-backup-actions > summary { display: flex; align-items: center; gap: 10px; padding: 0 10px; border-radius: var(--radius-md); color: hsl(43, 20%, 88%); font-weight: 400; letter-spacing: 0; text-transform: none; cursor: pointer; list-style: none; }
body.app-shell #appSidebar:not(.is-rail) .sidebar-nav-secondary .project-backup-actions > summary::before { flex: 0 0 20px; color: hsl(195, 15%, 62%); font-size: 13px; text-align: center; content: "⤓"; }
body.app-shell #appSidebar:not(.is-rail) .sidebar-nav-secondary .project-backup-actions > summary:hover { background: hsl(197, 30%, 25%); color: #fff; }
/* Status einzeilig: „✓ Gespeichert · Live verbunden · v1.1.1“, Details als Tooltip; Speichermodus nur für Screenreader */
body.app-shell #appSidebar:not(.is-rail).app-sidebar > .sidebar-status { display: flex; flex-wrap: wrap; align-items: baseline; margin-top: auto; padding: 0 8px; color: hsl(195, 15%, 70%); font-size: 12px; line-height: 1.5; }
body.app-shell #appSidebar:not(.is-rail) .sidebar-status > :is(span, strong) { display: inline; margin: 0; color: inherit; font-size: 12px; font-weight: 400; letter-spacing: 0; text-transform: none; }
body.app-shell #appSidebar:not(.is-rail).app-sidebar .sidebar-status .topbar-save-status { order: -1; display: inline; grid-column: auto; justify-self: auto; width: auto; min-height: 0; margin: 0; padding: 0; color: hsl(161, 45%, 70%); font-size: 12px; line-height: 1.5; }
body.app-shell #appSidebar:not(.is-rail).app-sidebar .sidebar-status .topbar-save-status.is-error { color: var(--color-danger-text); }
body.app-shell #appSidebar:not(.is-rail).app-sidebar .sidebar-status .topbar-save-status * { color: inherit; font-size: 12px; font-weight: 400; letter-spacing: 0; text-transform: none; }
/* Immer „✓ Gespeichert“, damit die Zeile auf jeder Breite passt; der lange Text steht im Tooltip. */
body.app-shell #appSidebar:not(.is-rail) .topbar-save-status-full { display: none; }
body.app-shell #appSidebar:not(.is-rail) .topbar-save-status-compact { display: inline; }
body.app-shell #appSidebar:not(.is-rail) :is(#sidebarStorageMode, #sidebarAccessMode) { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
body.app-shell #appSidebar:not(.is-rail) .sidebar-status :is(.topbar-save-retry:not([hidden]), .status.is-visible) { display: block; margin-top: 6px; }
body.app-shell #appSidebar:not(.is-rail).app-sidebar > .site-footer { display: block; margin-top: -18px; padding: 0 8px; color: hsl(195, 15%, 70%); font-size: 12px; line-height: 1.5; }
body.app-shell #appSidebar:not(.is-rail) .site-footer > * { display: inline; min-height: 0; padding: 0; border: 0; background: transparent; color: inherit; font-size: 12px; font-weight: 400; letter-spacing: 0; text-transform: none; }
body.app-shell #appSidebar:not(.is-rail) .site-footer .version::before { white-space: pre; content: " · "; }
/* ohne Ankerposition zweizeilig */
@supports (anchor-name: --a) {
  body.app-shell #appSidebar:not(.is-rail) #topbarSaveStatus { anchor-name: --save; }
  body.app-shell #appSidebar:not(.is-rail).app-sidebar > .site-footer { position: absolute; position-anchor: --save; top: anchor(top); left: anchor(right); right: 24px; width: auto; margin: 0; padding: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  body.app-shell #appSidebar:not(.is-rail) .site-footer::before { white-space: pre; content: " · "; }
}
@media (pointer: coarse) {
  /* Touch: Knöpfe mind. 44 px hoch */
  body.app-shell #appSidebar:not(.is-rail) #projectMobileActionsToggle { width: 44px; height: 44px; }
  body.app-shell #appSidebar:not(.is-rail) #projectSelect { width: calc(100% - 50px); }
}

/* Plan liegt wie im Entwurf direkt auf dem cremefarbenen Grund; Karten heben sich weiß ab.
   Werkzeugleiste, Liste und Fußleiste stehen bündig mit der Kopfzeile (--plan-gutter). */
body.app-shell { --plan-gutter: 32px; --plan-ctl: 36px; }
@media (pointer: coarse) { body.app-shell { --plan-ctl: 44px; } body:not(.has-mobile-tabbar) #planStep #planToolbar { gap: 8px; } }
body.app-shell:not(.is-utility-view, .is-help-view, .is-overview-view) .layout:has(> .step-accordion-list > #planStep.is-open) { background: var(--color-bg); }
body.app-shell:not(.has-mobile-tabbar, .is-utility-view, .is-help-view, .is-overview-view) .layout:has(> .step-accordion-list > #planStep.is-open) { padding-top: 20px; padding-inline: var(--plan-gutter); }
body.app-shell:not(.has-mobile-tabbar, .is-utility-view, .is-help-view, .is-overview-view) .layout:has(> .step-accordion-list > #planStep.is-open) > .step-accordion-list { max-width: none; }
body.app-shell .step-accordion-list > #planStep.workflow-step-panel.is-open { padding: 0; border: 0; background: transparent !important; box-shadow: none; }
body.app-shell .step-accordion-list > #planStep.step-summary-card.is-open > :not(.workflow-accordion-header) { max-width: none; margin-inline: 0; }

.plan-pop .plan-pop-title { margin: 6px 10px 4px; color: var(--color-text-muted); font-size: 11px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; }
.plan-pop .plan-pop-title:first-child { margin-top: 2px; }

/* Werkzeugleiste am Handy wie im Entwurf: Ansicht über die ganze Breite, darunter Tage, Offen, Filter */
@media (max-width: 720px) {
  #planStep #planToolbar { gap: 8px; }
  #planStep #planToolbar :is(.plan-primary-toolbar, .plan-view-switch, .tabs) { flex: 1 0 100%; width: 100%; }
  #planStep #planToolbar .tab { flex: 1 1 0; padding: 0 8px; }
  #planStep #planToolbar .lbl-long { display: none; }
  #planStep #planToolbar .lbl-short { display: inline; }
  #planStep :is(#planToolbar .tabs, #planDayTabs) { height: 44px; }
  #planStep #planToolbar :is(.plan-mobile-filter-actions button, .plan-work-actions > summary) { height: 44px; font-size: 15px; }
  #planStep #planToolbar .plan-day-tab { font-size: 15px; }
}

/* Ein Menü für die Navigation; am unteren Rand bleiben nur die Planaktionen. */
@media (max-width: 480px) {
  body.app-shell .workflow-footer { bottom: 0; padding-bottom: calc(16px + env(safe-area-inset-bottom)); }
  body.app-shell.is-mobile-hall-view .workflow-footer { right: 0; left: 0; padding: 12px 16px calc(12px + env(safe-area-inset-bottom)); }
  body.app-shell.is-mobile-hall-view .layout { padding-bottom: calc(var(--fixed-bottom-reserve, 0px) + 32px + env(safe-area-inset-bottom)); }
  body.app-shell.is-mobile-hall-view .workflow-footer .plan-footer { display: flex; gap: 10px; }
  body.app-shell.is-mobile-hall-view .workflow-footer :is(.plan-footer-counts, .plan-footer-actions > .plan-pop-wrap:first-child, .step-guidance-back) { display: none; }
  body.app-shell.is-mobile-hall-view .workflow-footer .plan-footer-actions { flex: 1; }
  body.app-shell.is-mobile-hall-view .workflow-footer .plan-footer-actions > * { flex: 1 1 0; }
  body.app-shell.is-mobile-hall-view .workflow-footer .plan-footer-actions .btn { justify-content: center; width: 100%; height: 48px; font-size: 16px; }
  body.app-shell.is-mobile-hall-view .workflow-footer .plan-pop { right: 0; width: min(320px, calc(100vw - 32px)); }
}

/* Handy: Tage und „Offen“ in einer Zeile, Filter darunter (wie im Entwurf) */
@media (max-width: 480px) {
  #planStep #planToolbar .plan-mobile-filter-actions { display: contents; }
  #planStep #planToolbar #planMobileConflictsToggle { margin-left: auto; }
  #planStep #planToolbar #planMobileFiltersToggle { order: 5; }
  #planStep #planToolbar .plan-work-actions { order: 6; }
}

/* „intern“ und „offen“ an der Gegenseite; Rahmen und Hinweise stehen in styles-plan-issues.css */
#planStep :is(#planTable, #mobileSchedule) .plan-internal-tag { display: inline; padding: 2px 6px; border-radius: 999px; background: hsl(205, 60%, 93%); color: hsl(205, 55%, 32%); font-size: 11px; font-weight: 600; }
#planStep #planTable tbody > tr:is(.plan-day-row, .plan-notice-row, .plan-issue-row, .plan-end-row) { background: transparent; }

/* Ansichten nach Spieler/in und Betreuung: Zeit vor dem Tisch, Verein in der Leiste */
#planStep #planTable .plan-game-line.is-grouped { grid-template-columns: 72px 44px minmax(0, 1fr) var(--plan-coach); }
#planStep #planTable .plan-column-head th.is-grouped { grid-template-columns: 72px 44px minmax(0, 1fr) var(--plan-coach) calc(var(--plan-more) - var(--plan-gap)); }
#planStep #planTable .plan-column-head th.is-grouped > span:first-child { text-align: left; padding-left: 14px; }
#planStep :is(#planTable, #mobileSchedule) .plan-game-when { color: var(--color-text); font-size: 13px; font-weight: 600; font-variant-numeric: tabular-nums; white-space: nowrap; }
#planStep #planTable .plan-game-when { padding-left: 14px; }
#planStep #mobileSchedule .plan-game-when { font-size: 15px; }
#planStep :is(#planTable, #mobileSchedule) .plan-section-sub { display: inline-block; max-width: 260px; overflow: hidden; vertical-align: bottom; white-space: nowrap; text-overflow: ellipsis; }

.is-bump { display: inline-flex; animation: plan-bump 0.42s cubic-bezier(0.3, 1.3, 0.5, 1) 1; }
@keyframes plan-bump { 0% { transform: scale(1); } 40% { transform: scale(1.18); } 100% { transform: scale(1); } }
@media (prefers-reduced-motion: reduce) { .is-bump { animation: none !important; } }

/* Tabelle 721–900 px (iPad hochkant): die globale 44-px-Regel bis 900 px gilt hier nicht,
   Touch-Maße setzt der Plan selbst über (pointer: coarse). */
@media (max-width: 900px) {
  #planStep #planTable :is(.plan-issue-action, .plan-issue-jump, .plan-game-more) { min-height: 0 !important; }
  #planStep #planTable .schedule-time-group-button { min-height: 40px !important; }
}
/* Handy wie im Entwurf: ruhigere Schriftgrößen.
   Tippflächen bleiben 44 px; Auswahlfelder behalten 16 px, sonst zoomt iOS beim Antippen. */
@media (max-width: 720px) {
  #planStep #mobileSchedule .mobile-schedule-card { gap: 6px; padding: 12px 8px 12px 14px; }
  #planStep #mobileSchedule .mobile-game-player { font-size: 16px; line-height: 21px; }
  #planStep #mobileSchedule .mobile-game-versus { font-size: 13px; line-height: 18px; }
  #planStep #mobileSchedule .mobile-game-meta { gap: 6px 8px; margin-top: 2px; }
  #planStep #mobileSchedule :is(.mobile-schedule-competition, .plan-game-when) { font-size: 13px; }
  #planStep #mobileSchedule .plan-game-table { height: 24px; padding: 0 8px; font-size: 12px; }
  #planStep #mobileSchedule .mobile-match-coach-display { min-height: 44px; font-size: 15px; }
  #planStep #mobileSchedule .mobile-match-coach select { font-size: 16px; }
  #planStep #mobileSchedule .plan-day-name { font-size: 18px; }
}

/* Die direkte Quellenwahl ersetzt die frühere zusätzliche Link-Überschrift. */
body.app-shell #sourceStep #onlineSourceDetails > summary { display: none; }

.scroll-top-button { display: none; }
@media (max-width: 1100px) {
  body.app-shell .scroll-top-button {
    position: fixed;
    right: max(16px, env(safe-area-inset-right));
    bottom: max(var(--scroll-top-offset, 20px), calc(20px + env(safe-area-inset-bottom)));
    z-index: 25;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    min-height: 48px;
    padding: 12px;
    border: 1px solid rgb(35 59 67 / 25%);
    border-radius: 50% !important;
    background: rgb(252 251 248 / 82%);
    color: #233b43;
    box-shadow: 0 2px 10px rgb(35 59 67 / 12%);
    opacity: 0.72;
  }
  body.app-shell .scroll-top-button svg { width: 22px; height: 22px; }
  body.app-shell .scroll-top-button:is(:hover, :focus-visible) { opacity: 1; background: #fcfbf8; }
  body.app-shell .scroll-top-button:focus-visible { outline: 3px solid #b94325; outline-offset: 3px; }
  body.app-shell .scroll-top-button[hidden] { display: none; }
}

/* Bildschirmraster und feste Navigation dürfen den Druck nicht einengen. */
@media print {
  @page { margin: 12mm; }
  html, body.app-shell { display: block !important; width: auto !important; height: auto !important; min-height: 0 !important; overflow: visible !important; background: #fff !important; }
  body.app-shell > :not(#mainContent), body.app-shell #mainContent > :not(#workflowStepAccordionList), body.app-shell #workflowStepAccordionList > :not(#planStep) { display: none !important; }
  body.app-shell #mainContent, body.app-shell #workflowStepAccordionList, body.app-shell #planStep, body.app-shell #planStep #planTableShell { display: block !important; width: 100% !important; max-width: none !important; height: auto !important; min-height: 0 !important; margin: 0 !important; padding: 0 !important; overflow: visible !important; border: 0 !important; background: #fff !important; box-shadow: none !important; }
  body.app-shell #planStep > :not(#planTableShell):not(.section-head), #planStep .section-head :is(.step-number, p), #planStep #planTable :is(.actions-col, .plan-game-editor, .plan-end-row, select), #planStep #planTable .schedule-coach-control::after { display: none !important; }
  body.app-shell #planStep > .section-head { display: block !important; }
  #planStep .section-head h2 { margin: 0 0 12px; font-size: 18px; }
  #planStep #planTable, #planStep #planTable > tbody { display: block; width: 100%; min-width: 0; }
  #planStep #planTable tr.schedule-game-row { display: block !important; min-height: 0; break-inside: avoid; }
  #planStep #planTable .plan-game-line { grid-template-columns: 34px minmax(0, 1fr) 140px; gap: 8px; }
  #planStep #planTable .plan-game-line.is-grouped { grid-template-columns: 78px 34px minmax(0, 1fr) 120px; }
  #planStep #planTable td.schedule-game-cell { padding: 6px 0; }
  #planStep #planTable .schedule-coach-display { min-height: 0; padding: 0; border: 0; }
  #planStep #planTable .plan-section-bar { position: static !important; transform: none !important; margin-top: 10px; box-shadow: none !important; transition: none; break-after: avoid; }
  #planStep #planTable .schedule-time-group-button { display: flex; gap: 8px; padding: 4px; }
  #planStep #planTable :is(.plan-section-column, .plan-column-head) { display: none; }
  #planStep #planTable .plan-game-table { min-width: 28px; padding: 0 3px; }
}

/* Filter-Chips · Toast · Leer (wie im Entwurf) */
#planStep #planToolbar #planFilters .plan-filters-title { margin: 0 0 -2px; color: var(--color-text-muted); font-size: 12px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; }
#planStep #planToolbar .plan-filters-actions { display: flex; justify-content: space-between; gap: 8px; margin-top: 4px; }
#planStep :is(#planToolbar .plan-filters-actions button, .plan-empty-reset) { display: inline-flex; align-items: center; width: auto; height: 36px; min-height: 0; margin: 0; padding: 0 14px; border: 1px solid var(--color-border-strong); border-radius: var(--radius-md); background: var(--color-surface); color: var(--color-text); font-size: 14px; font-weight: 600; white-space: nowrap; cursor: pointer; justify-self: center; }
#planStep #planToolbar #planFilterDoneBtn { border-color: var(--color-accent); background: var(--color-accent); color: var(--color-text-inverse); }
#planStep .plan-filter-chips { display: flex; flex-wrap: wrap; gap: 8px; margin: -2px 0 12px; }
#planStep .plan-filter-chips[hidden] { display: none; }
#planStep .plan-filter-chip { display: inline-flex; align-items: center; gap: 6px; height: 28px; padding: 0 6px 0 10px; border: 1px solid var(--color-border-strong); border-radius: 999px; background: var(--color-surface); color: var(--color-text); font-size: 13px; }
#planStep .plan-filter-chip-remove { position: relative; display: inline-grid; place-items: center; width: 20px; height: 20px; min-width: 0; min-height: 0 !important; margin: 0; padding: 0; border: 0; border-radius: 999px; background: var(--color-surface-soft); color: var(--color-text); font-size: 13px; line-height: 1; cursor: pointer; }
#planStep #planTable tr:has(> .empty) { display: block; }
#planStep :is(#planTable td.empty, #mobileSchedule .mobile-schedule-empty) { display: grid; justify-items: center; gap: 12px; margin: 0; padding: 40px 16px; border: 1px solid var(--color-border); border-radius: 12px; background: var(--color-surface); color: var(--color-text-muted); font-size: 14px; text-align: center; }
#planStep .plan-toast { position: fixed; bottom: calc(var(--fixed-bottom-reserve, 68px) + 16px); left: 50%; z-index: 80; width: max-content; margin: 0; max-width: min(560px, calc(100vw - 32px)); padding: 10px 16px; border-radius: 10px; background: var(--color-navy); color: hsl(43, 30%, 92%); font-size: 14px; line-height: 1.4; text-align: center; box-shadow: 0 8px 24px hsl(195, 32%, 20%, 0.3); opacity: 0; visibility: hidden; transform: translateX(-50%); pointer-events: none; transition: opacity 0.2s, visibility 0s 0.2s; }
#planStep .plan-toast.is-visible { opacity: 1; visibility: visible; transition: opacity 0.2s; }
body.has-mobile-tabbar #planStep .plan-toast { display: none; }
/* Solange der Toast steht, bleibt #status nur für Screenreader (keine doppelte Meldung im Bild). */
body.app-shell.has-plan-toast:not(.has-mobile-tabbar) .sidebar-status .status.is-visible:not(.error) { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; border: 0; clip-path: inset(50%); white-space: nowrap; }
@media (pointer: coarse) {
  #planStep :is(#planToolbar .plan-filters-actions button, .plan-empty-reset, #planToolbar #planFilters select) { height: 44px; }
  #planStep #planToolbar #planFilters select { font-size: 16px; }
  #planStep .plan-filter-chip-remove::after { position: absolute; inset: -12px; content: ""; }
}
@media (prefers-reduced-motion: reduce) { #planStep .plan-toast { transition: none; } }
@media (forced-colors: active) { #planStep .plan-toast { border: 1px solid CanvasText; } }

/* Übersicht und Quelle: Arbeitsstand sichtbar, Eingabearten gleichrangig. */
body.app-shell #reviewStep { padding-block: 20px; }
body.app-shell.is-overview-view #welcomeBanner { display: none; }
body.app-shell #reviewStep > .section-head { margin-bottom: 16px; }
body.app-shell #reviewStep > .section-head .step-number { display: none; }
body.app-shell #reviewStep > .section-head h2 { margin: 0 0 6px; font-size: clamp(24px, 2.3vw, 32px); }
body.app-shell #reviewStep .overview-key-metrics { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px; margin: 16px 0; padding: 0; background: transparent; }
body.app-shell #reviewStep .overview-key-metrics .summary-metric { min-height: 80px; padding: 12px; border: 1px solid var(--color-border); border-radius: 10px; background: var(--color-surface); }
body.app-shell #reviewStep .overview-key-metrics .metric { font-size: 26px; line-height: 1.2; }
body.app-shell #reviewStep .overview-key-metrics .metric-text { font-size: 18px; }
body.app-shell #reviewStep .overview-key-metrics .label { font-size: 12px; line-height: 1.3; white-space: normal; }
body.app-shell #reviewStep .overview-key-metrics .summary-metric::after { display: none; }
body.app-shell #reviewStep .overview-key-metrics.summary-metrics-hidden { display: none; }
body.app-shell #reviewStep .overview-next-action { min-height: 0; margin: 16px 0 12px; padding: 18px; }
body.app-shell #reviewStep .overview-next-action strong { font-size: 23px; }
body.app-shell #reviewStep .overview-shortcuts { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0; }
body.app-shell #reviewStep .overview-shortcuts button { min-height: 44px; padding: 8px 16px; }
body.app-shell #reviewStep .overview-source-meta { margin: 12px 0; color: var(--color-text-muted); font-size: 13px; overflow-wrap: anywhere; }
body.app-shell #reviewStep :is(.overview-todo, .overview-control-details) { margin-top: 16px; }
body.app-shell #reviewStep .overview-control-details-body > .summary { margin: 0; padding: 0; }
body.app-shell #sourceStep .source-entry-choices { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin: 0 0 12px; }
body.app-shell #sourceStep .source-entry-choices button { display: grid; align-content: center; gap: 4px; min-height: 64px; padding: 8px 12px; text-align: left; white-space: normal; }
body.app-shell #sourceStep .source-entry-choices strong { font-size: 16px; }
body.app-shell #sourceStep .source-entry-choices span { color: var(--color-text-muted); font-size: 13px; font-weight: 400; }
body.app-shell #sourceStep .source-entry-choices [aria-pressed="true"] { border-color: var(--color-primary); background: var(--color-danger-soft); box-shadow: inset 0 0 0 1px var(--color-primary); }
body.app-shell #sourceStep :is(.source-grid, .source-alternative-grid) { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0; margin: 0; }
body.app-shell #sourceStep .source-alternatives { max-width: none; margin: 0; }
body.app-shell #sourceStep :is(.source-path-details, .source-alternatives) > summary { display: none; }
body.app-shell #sourceStep :is(.source-card, .source-alternative-grid .source-card) { padding: 16px 0; margin: 0; border-top: 0; }
body.app-shell #sourceStep :is(.source-path-content, .source-alternative-grid .source-path-content) { display: grid; gap: 12px; padding: 0; }
body.app-shell #sourceStep .source-path-content :is(.field, .actions, .mktt-extra-link, .mktt-link-help) { margin-block: 0; }
body.app-shell #sourceStep .source-import-preview { margin-top: 20px; }
@media (max-width: 1100px) {
  body.app-shell #reviewStep .overview-key-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  body.app-shell #sourceStep .source-entry-choices { gap: 6px; margin-bottom: 12px; }
  body.app-shell #sourceStep .source-entry-choices button { min-height: 68px; padding: 8px; }
  body.app-shell #sourceStep .source-entry-choices strong { font-size: 14px; }
  body.app-shell #sourceStep .source-entry-choices span { display: none; }
  body.app-shell #reviewStep .overview-key-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Kompakte Importformulare; vollständige Dateinamen und Touchziele bleiben erhalten. */
body.app-shell #sourceStep :is(#onlineSourceDetails, #pdfSourceDetails) { padding: 0; }
body.app-shell #sourceStep .source-path-content { margin: 0; gap: 8px; }
body.app-shell #sourceStep .mktt-url-field { gap: 4px; }
body.app-shell #sourceStep :is(#tournamentUrl, #additionalTournamentUrl) { min-height: 44px; height: 44px; padding: 8px 12px; border: 1px solid var(--color-border-strong); border-radius: var(--radius-control); font-size: 16px; }
body.app-shell #sourceStep #onlineSourceDetails .actions { margin-top: 0; }
body.app-shell #sourceStep .action-with-subtext { align-items: flex-start; gap: 4px; }
body.app-shell #sourceStep #loadParticipantsBtn { width: auto; min-height: 44px; padding: 8px 16px; }
body.app-shell #sourceStep .mktt-extra-link { margin: 0; padding: 0; border: 0; background: transparent; }
body.app-shell #sourceStep .mktt-extra-link > summary { display: inline-flex; align-items: center; min-height: 44px; width: fit-content; max-width: 100%; gap: 6px; padding: 0; color: var(--color-primary); font-size: 14px; }
body.app-shell #sourceStep .mktt-extra-link > summary::before { content: "＋"; }
body.app-shell #sourceStep .mktt-extra-link[open] > summary::before { content: "−"; }
body.app-shell #sourceStep #pdfFileSelection { padding: 6px; gap: 4px; }
body.app-shell #sourceStep #pdfFileSelectionList { gap: 4px; }
body.app-shell #sourceStep #pdfFileSelectionList .pdf-file-selection-item { min-height: 44px; padding: 4px 8px; align-items: center; }
body.app-shell #sourceStep #pdfFileSelectionList input { width: 20px; min-width: 20px; height: 20px; min-height: 20px; margin: 0; }
body.app-shell #sourceStep #pdfFileSelectionList .pdf-file-selection-name { font-size: 14px; }
body.app-shell #associationStep .association-decision:not(:has(button)) { display: none; }
body.app-shell #associationStep .association-scope :is(#associationImpactHint, #associationDecisionText) { margin: 4px 0; font-size: 13px; line-height: 1.4; }
@media (min-width: 721px) and (min-height: 501px) {
  body.app-shell:not(.is-overview-view, .is-utility-view, .is-help-view):has(:is(#sourceStep, #associationStep).is-open) .layout { padding-top: 16px; }
  body.app-shell #associationStep.workflow-step-panel { padding-block: 0; }
  body.app-shell #associationStep .association-picker-card { padding-block: 0; }
}