/* Coach foundation. Layouts and content remain owned by their components.
   These tokens are also available to reader/map dialogs mounted under body. */
:root {
  --coach-bg: var(--bg-base);
  --coach-bg-rgb: 9, 9, 11;
  --coach-surface: var(--bg-surface, #111113);
  --coach-elevated: var(--bg-elevated, #19191e);
  --coach-hover: var(--bg-hover, #222228);
  --coach-line: var(--border-default, rgba(255,255,255,.08));
  --coach-line-strong: var(--border-strong, rgba(255,255,255,.15));
  --coach-text: var(--text-primary, #ededf0);
  --coach-muted: #a8abb5;
  --coach-accent: var(--accent, #6b7db3);
  --coach-accent-text: #afbee3;
  --coach-action: #c5d4ed;
  --coach-action-hover: #d6e1f3;
  --coach-on-action: #152133;
  --coach-selected: #1b2130;
  --coach-positive: #87b69d;
  --coach-negative: #d98591;
  --coach-font: var(--font-sans, Geist, system-ui, sans-serif);
}

/* One canvas, including the desktop margins and the overscroll area.
   An inactive, retained reader must not recolor another app tab. */
html:has(#page-coach.active, #page-coach-deep.active),
body:has(#page-coach.active, #page-coach-deep.active) {
  background: var(--coach-bg);
}
:is(#page-coach, #page-coach-deep) {
  color: var(--coach-text);
  font-family: var(--coach-font);
}
/* The free reader owns its bottom navigation reserve; the dock is hidden. */
body:has(#page-coach.active #coach-match-detail:not([hidden]) .free-review),
body.deep-story-open {
  padding-bottom: 0;
}

/* The viewport belongs to the active coach, not to the narrow app shell.
   Component measures below remain independent of the page canvas. */
.app-container:has(#page-coach.active, #page-coach-deep.active) {
  max-width: none;
}
body:has(#page-coach.active) { padding-bottom: 0; }
#page-coach, #page-coach .coach-shell {
  min-height: var(--tg-viewport-height, 100dvh);
}
:root { --coach-reader-width: 480px; }
@media (min-width: 760px) {
  :root { --coach-reader-width: 960px; }
}