/* CI 8 mobile working views. All data and controls remain in their original flow. */
#mobileCalendarDays,#mobileCalendarScope,#mobileDocumentationNavigation { display:none; }
@media screen and (max-width:600px) {
  /* User-approved 15% smaller mobile type; pixel-sized touch targets stay intact.
     Relative root sizing also respects the user's default browser text size. */
  html { scroll-padding-block:16px; font-size:85%; }
  html body { font-size:1rem; }
  /* Bring legacy pixel-sized display labels onto the same relative type scale. */
  html :is(.page-heading,.selection-head) h1 { font-size:2.25rem; }
  html #calendarSidebar,html #calendarSidebar button,html #calendarSidebar .sidebar-session strong,html .calendar-count-badge { font-size:.8125rem; }
  html #calendarSidebarToggle,html #calendarSidebar summary { font-size:.875rem; }
  html #calendarSidebarToggle>span[aria-hidden],html .documentation-inline-status button { font-size:1.5rem; }
  html #calendarSidebar .sidebar-session small,html #calendarSidebar :is(.sidebar-group-calendars,.sidebar-athlete-calendars)>h3 { font-size:.75rem; }
  html #trainingTimeline :is(.calendar-add,.calendar-range-menu) { font-size:1.25rem; }
  html #calendarDayOverlayTitle { font-size:1rem; }
  html body:has(dialog[open]) { overflow:hidden; }
  html .topbar { min-height:72px; padding:max(8px,env(safe-area-inset-top)) 16px 8px; gap:0; }
  html .topbar .product-link { min-width:0; width:auto; }
  html .topbar .product-link img { width:260px; max-width:100%; height:auto; }
  html #primaryNav { position:relative; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:4px; padding:4px 16px; overflow:visible; z-index:22; }
  html #primaryNav>a,html #primaryNav>details>summary { display:flex; align-items:center; justify-content:center; min-width:44px; min-height:48px; padding:8px 4px; margin:0; font-size:.8rem; font-weight:600; white-space:normal; overflow-wrap:anywhere; }
  html .mobile-training-fold { min-width:0; margin:0; padding:0; border:0; border-radius:0; background:transparent; }
  html .mobile-training-fold>summary { display:flex; align-items:center; justify-content:space-between; gap:8px; min-height:44px; padding:8px 0; font-size:.8rem; font-weight:600; color:var(--fliq-text-secondary); cursor:pointer; list-style:none; }
  html .mobile-training-fold>summary::-webkit-details-marker { display:none; }
  html .mobile-training-fold>summary::after { content:'+'; font-size:1.1rem; font-weight:400; }
  html .mobile-training-fold[open]>summary::after { content:'−'; }
  html .mobile-training-fold>summary:focus-visible { outline:3px solid var(--fliq-focus); outline-offset:2px; }
  html #primaryNav>.mobile-navigation-more[open] { position:absolute; right:16px; top:4px; width:min(280px,calc(100vw - 32px)); max-height:calc(100dvh - 96px); overflow:auto; background:var(--fliq-surface); border:1px solid var(--fliq-border-control); border-radius:var(--fliq-radius-card); box-shadow:var(--fliq-ui-depth); padding:8px 12px; }
  html #primaryNav>.mobile-navigation-more[open]>summary { justify-content:space-between; }
  html .mobile-navigation-more>a { display:flex; width:100%; min-height:48px; align-items:center; padding:8px; font-size:.9rem; }
  html .mobile-navigation-more .topbar-actions { display:grid; grid-template-columns:minmax(0,1fr); gap:8px; padding-top:12px; border-top:1px solid var(--fliq-border-subtle); }
  /* These controls move out of the inverse header into a themed menu. */
  html .mobile-navigation-more .topbar-actions .button.quiet { appearance:none; -webkit-appearance:none; background:var(--fliq-surface); color:var(--fliq-text-primary); -webkit-text-fill-color:currentColor; border:1px solid var(--fliq-border-control); }
  html .mobile-navigation-more .topbar-actions .button.quiet:hover { background:var(--fliq-surface-muted); }
  html .mobile-navigation-more [hidden] { display:none!important; }
  html #mainContent { padding:16px; }
  html #appShell:has(#calendarView:not([hidden])):has(>#calendarSidebar:not([hidden]))>#mainContent,html #appShell:has(#calendarView:not([hidden])):has(>#calendarSidebar.is-collapsed:not([hidden]))>#mainContent { width:100%; margin:0; padding-inline:16px; }
  html #appShell:not([hidden]):has(#calendarView:not([hidden]))>#calendarSidebar.is-collapsed:not([hidden]) { display:none; }
  html #calendarSidebar:not(.is-collapsed) { top:0; bottom:0; width:min(320px,calc(100vw - 32px)); z-index:40; padding:16px; }
  html #mainContent #calendarView>.page-heading { display:flex; flex-direction:row; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:8px; margin:0 0 12px; padding:0; }
  html #mainContent #calendarView>.page-heading>div:first-child { display:block; width:auto; flex:1 1 160px; }
  html #calendarView>.page-heading .planiq-page-brand { display:none; }
  html #calendarView>.page-heading .eyebrow { margin:0 0 4px; font-size:.7rem; }
  html #mainContent #calendarView .page-heading h1 { font-size:1.15rem; line-height:1.3; letter-spacing:-.025em; }
  html #calendarView .page-actions { display:flex; align-items:center; gap:8px; width:auto; flex-wrap:wrap; margin:0; }
  html #calendarView .mobile-calendar-actions { position:relative; }
  html #calendarView .mobile-calendar-actions:not(:has(button:not([hidden]))) { display:none; }
  html #calendarView .mobile-calendar-actions[open] { flex-basis:100%; display:grid; gap:8px; }
  html #calendarView .page-actions .calendar-create-button { min-height:48px; padding:8px 12px; font-size:.8rem; }
  html #calendarView .calendar-toolbar { display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin:0 0 8px; padding:0; border:0; box-shadow:none; background:transparent; }
  html #calendarView .calendar-navigation { display:grid; grid-template-columns:44px minmax(44px,1fr) 44px; gap:4px; flex:1; }
  html #calendarView .calendar-navigation button,html #mobileCalendarScope { min-height:44px; padding:8px; font-size:.8rem; }
  html #mobileCalendarScope:not([hidden]) { display:block; }
  html #calendarView .calendar-toolbar>.segmented-control { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); flex:1 0 100%; width:100%; padding:4px; }
  html #calendarView .segmented-control button { min-height:44px; min-width:0; width:auto; padding:8px; font-size:.8rem; }
  html #calendarView .calendar-period-row { margin:8px 0; }
  html #calendarPeriod { margin:0; font-size:.9rem; line-height:1.4; }
  html #mobileCalendarDays:not([hidden]) { display:grid; grid-template-columns:repeat(7,minmax(44px,1fr)); gap:0; margin:0 0 12px; padding:4px 0; border-block:1px solid var(--fliq-border-subtle); }
  html .mobile-calendar-day { display:grid; justify-items:center; gap:4px; min-width:44px; min-height:80px; margin:0; padding:8px 0; border:0; border-radius:var(--fliq-radius-control); background:transparent; color:var(--fliq-text-secondary); box-shadow:none; font-variant-numeric:tabular-nums; }
  html .mobile-calendar-day span { font-size:.7rem; line-height:1.2; }
  html .mobile-calendar-day strong { font-size:1.15rem; line-height:1.2; font-weight:650; color:var(--fliq-text-primary); }
  html .mobile-calendar-day small { font-size:.7rem; line-height:1.2; }
  html #mobileCalendarDays { overflow-x:auto; }
  html .mobile-calendar-day { align-content:start; }
  html .mobile-calendar-day .mobile-calendar-type { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:4px; width:100%; min-width:0; padding:4px 0; color:var(--fliq-text-primary); }
  html .mobile-calendar-type>span:last-child { min-width:0; max-width:100%; white-space:normal; overflow-wrap:anywhere; }
  html .mobile-calendar-day[aria-current=date] strong { text-decoration:underline; text-underline-offset:4px; }
  html .mobile-calendar-day[aria-pressed=true] { background:var(--fliq-product-tint); box-shadow:inset 0 -3px var(--fliq-product-accent); color:var(--fliq-text-primary); }
  html #trainingTimeline.week-view .calendar-day:not(.mobile-selected-day),html #trainingTimeline.week-view .calendar-weekday:not(.mobile-selected-day) { display:none; }
  html #trainingTimeline.week-view :is(.calendar-day,.calendar-weekday,.calendar-week-actions) { grid-row:auto; }
  html #trainingTimeline.week-view .calendar-weekday.mobile-selected-day { display:none; }
  html #trainingTimeline.week-view .calendar-weekday.mobile-selected-day>span { display:none; }
  html #trainingTimeline.week-view .calendar-weekday:not(:has(button)) { display:none; }
  html #trainingTimeline.week-view .calendar-day { min-height:0; padding:0; border:0; background:transparent; box-shadow:none; outline:0; }
  html #trainingTimeline.week-view .calendar-day-heading { min-height:44px; padding:0; margin-bottom:8px; }
  html #trainingTimeline.week-view .calendar-day-units { gap:8px; }
  html #trainingTimeline.week-view .session-card { margin:0; border-radius:var(--fliq-radius-card); }
  html #trainingTimeline.week-view .session-card-trigger { padding:12px; }
  html #trainingTimeline.week-view .session-title { font-size:.95rem; font-weight:650; line-height:1.4; }
  html #trainingTimeline.week-view .calendar-week-actions { border:0; background:transparent; }

  /* Compact session chrome; one scroll surface, with the current action close to its value. */
  html :is(#executionDialog,#sessionTimerDialog) { width:100%; max-width:100%; height:100dvh; max-height:100dvh; margin:0; border:0; border-radius:0; padding:0; overflow:auto; scroll-padding:16px; }
  html :is(#executionForm,.session-timer-shell)>.dialog-heading { min-height:56px; margin:0; padding:max(8px,env(safe-area-inset-top)) 16px 8px; }
  html :is(#executionDialog,#sessionTimerDialog) .dialog-heading h2 { font-size:1rem; letter-spacing:-.02em; }
  html :is(#executionDialog,#sessionTimerDialog) .session-header-close { width:44px; height:44px; min-height:44px; flex:none; }
  html :is(#executionForm,.session-timer-shell)>.session-workspace-tabs { display:flex; flex-wrap:wrap; gap:4px; min-height:0; padding:4px; margin:0 16px 8px; }
  html :is(#executionDialog,#sessionTimerDialog) .session-workspace-tabs button { flex:1 1 64px; width:auto; min-height:44px; min-width:0; max-width:none; padding:8px 4px; font-size:.8rem; line-height:1.3; }
  html :is(#executionForm,.session-timer-shell)>.session-workspace-summary { display:block; padding:0 16px; margin:0 0 8px; }
  html :is(#executionDialog,#sessionTimerDialog) .session-workspace-summary>.session-summary-title { min-height:0; padding:8px 0 0; border:0; }
  html :is(#executionDialog,#sessionTimerDialog) .session-summary-title::before { display:none; }
  html :is(#executionDialog,#sessionTimerDialog) .session-summary-title dd { font-size:.95rem; line-height:1.4; font-weight:650; }
  html :is(#executionDialog,#sessionTimerDialog) .session-workspace-summary>.mobile-session-athlete { min-height:0; padding:4px 0 0; border:0; }
  html :is(#executionDialog,#sessionTimerDialog) .mobile-session-athlete::before { display:none; }
  html :is(#executionDialog,#sessionTimerDialog) .mobile-session-athlete dd { color:var(--fliq-text-secondary); font-size:.8rem; font-weight:500; }
  html .mobile-session-details[open] { padding-bottom:8px; border-bottom:1px solid var(--fliq-border-subtle); }
  html :is(#executionForm,.session-timer-shell)>.mobile-session-details { margin:0 16px 8px; }
  html .mobile-session-details>dl { margin:0; }
  html .mobile-session-details>dl>div { display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin:4px 0; }
  html .mobile-session-details dt { position:static!important; width:auto; height:auto; margin:0; clip:auto; clip-path:none; overflow:visible; white-space:normal; font-size:.75rem; color:var(--fliq-text-secondary); }
  html .mobile-session-details dd { margin:0; min-width:0; font-size:.8rem; text-align:right; overflow-wrap:anywhere; }
  html #executionDialog { overflow-anchor:none; scroll-behavior:auto; }
  html #executionForm { align-content:start; }
  /* Each effort owns a full-width heading; status and source cannot squeeze its route. */
  html .unit-view .unit-comparison .unit-value-item>th { display:block; min-width:0; padding:12px 8px; }
  html .unit-value-item .unit-effort-title { display:block; line-height:1.5; }
  html .unit-value-item .unit-video-link { display:flex; width:max-content; max-width:100%; margin-top:8px; }
  html .unit-value-item .unit-card-completion { display:inline-flex; width:auto; max-width:100%; margin-top:8px; overflow-wrap:normal; }
  html .unit-value-item .unit-source { margin:8px 0 0; line-height:1.5; }
  html .unit-value-item .effort-route { width:100%; margin:12px 0; gap:8px; }
  html .unit-value-item .effort-route-point strong { font-size:1rem; overflow-wrap:normal; }
  html .unit-view .unit-comparison td { display:grid; grid-template-columns:minmax(64px,.4fr) minmax(0,1fr); gap:12px; }
  html .unit-view .unit-comparison td::before { min-width:0; overflow-wrap:anywhere; }
  html .unit-cell-values { min-width:0; text-align:left; }
  html .unit-stats>div { min-width:0; }
  html .unit-stats :is(span,strong,small) { overflow-wrap:anywhere; }
  html .unit-detail-meta>span { gap:4px; flex-wrap:wrap; min-width:0; }
  html #mobileDocumentationNavigation { position:sticky; top:0; z-index:4; display:grid; grid-template-columns:44px minmax(0,1fr) 44px; gap:4px; margin:0 16px 8px; padding-block:4px; background:var(--fliq-surface); }
  html #mobileDocumentationNavigation>button { min-height:56px; min-width:44px; padding:8px; }
  html #mobileDocumentationNavigation>select { min-width:0; width:100%; font-size:.8rem; }
  html:root #mobileDocumentationNavigation>select:not([multiple]):not([size]) { width:100%!important; min-height:56px!important; field-sizing:fixed; }
  html #mobileDocumentationNavigation>#mobileDocumentationFlow { grid-column:1/-1; justify-self:end; min-height:44px; padding:8px 12px; font-size:.8rem; border:0; background:transparent; box-shadow:none; }
  html #executionDialog .session-documentation-layout { display:block; margin:0 16px 12px; }
  html #executionDialog .session-documentation-plan { border:0; padding:0; overflow:visible; }
  html #executionDialog .session-documentation-plan-heading { display:none; }
  html #executionDialog .block-execution-editor { padding:0; }
  html #executionDialog .documentation-section { padding:0; border:0; }
  html #executionDialog .mobile-current-step .documentation-section>summary,html #executionDialog .mobile-current-step :is(.documentation-section,.documentation-block,.documentation-item-row):not(.mobile-current-item) { display:none; }
  html #executionDialog .documentation-item-row { grid-template-columns:minmax(0,1fr) 112px; gap:4px; }
  html #executionDialog .documentation-item strong { font-size:.9rem; line-height:1.4; }
  html #executionDialog .documentation-item small { font-size:.75rem; }
  html #executionDialog [data-documentation-item] { scroll-margin-block-start:120px; }
  html #executionDialog .session-documentation-editor.is-inline { margin:8px 0; border:0; border-top:1px solid var(--fliq-border-subtle); border-radius:0; }
  html #executionDialog .is-inline #executionItemEditor { padding:12px 0; }
  html #executionDialog .documentation-editor-card { gap:8px; }
  html #executionDialog .documentation-editor-heading>div { display:none; }
  html #executionDialog .documentation-editor-heading:not(:has(.documentation-source)) { display:none; }
  html #executionDialog .documentation-editor-heading:empty { display:none; }
  /* The individual fields already say "optional"; retain the fuller hint for assistive technology. */
  html #executionDialog .documentation-editor-card>.supporting { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
  html #executionDialog .mobile-training-fold .session-timer-step-meta { display:flex; }
  html #executionDialog .documentation-editor-card .session-timer-step-meta { display:flex; flex-wrap:wrap; gap:4px; }
  html #executionDialog .documentation-editor-card .session-timer-step-meta>span { padding:4px 8px; font-size:.75rem; }
  html #executionDialog .documentation-actual-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px 8px; }
  html #executionDialog .documentation-actual-row:has(.session-videos-inline) { grid-column:1/-1; }
  html #executionDialog .documentation-actual-field>span { font-size:.8rem; }
  html #executionDialog .documentation-actual-field small { font-size:.7rem; }
  html #executionDialog [data-documentation-block-done] { min-height:44px; margin:4px 0; padding:8px 12px; font-size:.8rem; }
  html #executionDialog .execution-session-summary { margin:0 16px 8px; padding:0 12px 8px; border-radius:var(--fliq-radius-card); }
  html :is(#executionDialog,#sessionTimerDialog) .session-workspace-footer { position:static; display:grid; gap:4px; min-height:0; padding:8px 16px max(16px,env(safe-area-inset-bottom)); margin:0; box-shadow:none; border-top:1px solid var(--fliq-border-subtle); }
  html :is(#executionDialog,#sessionTimerDialog) .session-footer-progress { display:grid; width:100%; min-width:0; grid-template-columns:auto auto minmax(24px,1fr) auto; gap:8px; font-size:.7rem; }
  html :is(#executionDialog,#sessionTimerDialog) .session-footer-actions { display:grid; grid-template-columns:minmax(0,1fr); gap:8px; }
  html :is(#executionDialog,#sessionTimerDialog) .session-footer-actions .button { min-width:0; width:100%; min-height:56px; }
  html #executionDialog #executionForm .session-footer-actions>.secondary { display:block; }
  html #sessionTimerDialog .session-timer-layout { display:flex; flex-direction:column; gap:8px; margin:0 16px 8px; }
  html #sessionTimerDialog .session-timer-stage { display:flex; flex-direction:column; min-height:0; overflow:visible; padding:0; border:0; }
  html #sessionTimerDialog .session-timer-step-grid { display:contents; }
  html #sessionTimerDialog .session-timer-step-card { order:0; min-height:0; margin:0; padding:8px 0; border:0; }
  html #sessionTimerDialog .session-timer-step-card h3 { font-size:1.1rem; line-height:1.3; letter-spacing:-.02em; }
  html #sessionTimerDialog .session-timer-section-label { margin:0 0 4px; font-size:.7rem; }
  html #sessionTimerDialog .session-timer-stage>.session-timer-clock-panel { order:1; min-height:0; padding:16px; margin:8px 0; border:1px solid var(--fliq-border-subtle); border-radius:var(--fliq-radius-card); background:var(--fliq-surface-muted); }
  html #sessionTimerDialog .session-timer-clock-heading { gap:8px; }
  html #sessionTimerDialog .session-timer-clock-heading p { font-size:.7rem; }
  html #sessionTimerDialog .session-timer-clock { display:block; font-size:clamp(3.5rem,13.6vw,5rem); line-height:1.15; margin:4px 0 0; text-align:left; letter-spacing:-.04em; font-variant-numeric:tabular-nums; }
  html #sessionTimerDialog .session-timer-alarm { order:2; margin:8px 0; }
  html #sessionTimerDialog .session-timer-controls { position:sticky; bottom:0; z-index:3; order:3; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; padding:8px 0 max(8px,env(safe-area-inset-bottom)); background:var(--fliq-surface); border-top:1px solid var(--fliq-border-subtle); }
  html #sessionTimerDialog .session-timer-controls .button { min-height:64px; min-width:0; padding:8px; font-size:.85rem; }
  html #sessionTimerDialog :is(#sessionTimerStartButton,#sessionTimerFinishStepButton) { grid-column:1/-1; background:var(--fliq8-action); color:var(--fliq8-onAction); }
  html #sessionTimerDialog .session-timer-documentation-prompt { order:4; margin:8px 0; padding:12px; }
  html #sessionTimerDialog .session-timer-optional-section { order:5; display:block; margin:0; padding:0; border:0; }
  html #sessionTimerDialog .session-timer-optional-section>details>div:first-of-type { margin:8px 0; }
  html #sessionTimerDialog .session-timer-optional-section h3 { font-size:.95rem; }
  html #sessionTimerDialog .session-timer-optional-fields { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px 8px; }
  html #sessionTimerDialog .session-timer-documentation-submit { margin:8px 0; }
  html #sessionTimerDialog .session-timer-next-card { order:6; border-top:1px solid var(--fliq-border-subtle); background:transparent; }
  html #sessionTimerDialog .session-timer-next-card h3 { font-size:.9rem; }
  html #sessionTimerDialog .session-timer-progress-panel { min-height:0; max-height:none; padding:0; overflow:visible; border:0; border-top:1px solid var(--fliq-border-subtle); border-radius:0; }
  html #sessionTimerDialog .session-timer-progress-heading { display:none; }
  html #sessionTimerDialog .session-timer-progress-list { max-height:none; overflow:visible; padding:0; }
  html :is(#executionDialog,#sessionTimerDialog) [hidden] { display:none!important; }
  html :is(#executionDialog,#sessionTimerDialog) :is(input,textarea,select) { scroll-margin-block:16px; }
  html :is(#executionDialog,#sessionTimerDialog) :is(input,textarea,select) { font-size:16px; }
  html:root #mobileDocumentationNavigation>select:not([multiple]):not([size]) { font-size:16px; }
  html #sessionTimerDialog:has(input:focus,textarea:focus,select:focus) .session-timer-controls { position:static; }
  html #executionDialog:has(input:focus,textarea:focus,select:focus) #mobileDocumentationNavigation { position:static; }
}
@media screen and (min-width:360px) and (max-width:600px) {
  html #mobileDocumentationNavigation { grid-template-columns:44px minmax(0,1fr) 44px auto; }
  html #mobileDocumentationNavigation>#mobileDocumentationFlow { grid-column:auto; min-height:56px; padding-inline:8px; }
  html #executionDialog [data-documentation-item] { scroll-margin-block-start:80px; }
}
@media screen and (max-width:359px) {
  html #mobileCalendarDays:not([hidden]) { grid-template-columns:repeat(4,minmax(44px,1fr)); }
  html #calendarView>.page-heading { flex-wrap:wrap; }
  html #executionDialog .documentation-actual-grid,html #sessionTimerDialog .session-timer-optional-fields { grid-template-columns:minmax(0,1fr); }
}
@media print {
  #mobileCalendarDays,#mobileCalendarScope,#mobileDocumentationNavigation { display:none!important; }
}

/* Compact phone overview only. Desktop, documentation and timer keep their layouts. */
@media screen and (max-width:600px) {
 html #unitDetailDialog.mobile-unit-compact .unit-detail-shell>.dialog-heading{min-height:56px;padding:4px 12px;gap:8px;align-items:center}
 html #unitDetailDialog.mobile-unit-compact .dialog-heading h2{font-size:1.1rem;line-height:1.3}
 html #unitDetailDialog.mobile-unit-compact .unit-detail-shell>.session-overview-switcher{margin:0 12px 8px;gap:4px;padding:0;border:0;flex-wrap:nowrap}
 html #unitDetailDialog.mobile-unit-compact .session-overview-switcher button{flex:1 1 0;min-height:44px;padding:4px;font-size:.85rem;line-height:1.2}
 html #unitDetailDialog.mobile-unit-compact .session-overview-summary{padding:0 12px 8px;gap:4px 12px;align-items:baseline}
 html #unitDetailDialog.mobile-unit-compact .session-overview-summary>div{flex:0 1 auto;min-width:0;min-height:0;padding:0;border:0;gap:0}
 html #unitDetailDialog.mobile-unit-compact .session-overview-summary>div::before{display:none}
 html #unitDetailDialog.mobile-unit-compact .session-overview-summary>.session-summary-title{display:none}
 html #unitDetailDialog.mobile-unit-compact .session-overview-summary dd{font-size:.85rem;line-height:1.4;font-weight:500;overflow-wrap:anywhere}
 html #unitDetailDialog.mobile-unit-compact .unit-detail-meta{margin:0 12px 8px;gap:4px 12px;font-size:.75rem;line-height:1.4}
 html #unitDetailDialog.mobile-unit-compact .unit-detail-meta :is(.completion-badge,.unit-state-line,.unit-plan-stats){display:none}
 html #unitDetailDialog.mobile-unit-compact .unit-detail-meta .status-pill{padding:0 4px;min-height:0;font-size:inherit}
 html #unitDetailDialog.mobile-unit-compact .unit-detail-body{padding:0 12px 8px}
 html #unitDetailDialog.mobile-unit-compact .mobile-unit-status{display:flex;flex-wrap:wrap;align-items:center;gap:4px 12px;margin:0 0 8px;font-size:.8rem;font-variant-numeric:tabular-nums}
 html #unitDetailDialog.mobile-unit-compact .mobile-unit-status .unit-card-completion{padding:4px 8px;font-size:inherit;white-space:normal}
 html #unitDetailDialog.mobile-unit-compact .mobile-unit-plan{display:grid;gap:8px}
 html #unitDetailDialog.mobile-unit-compact .mobile-unit-plan .session-section{margin:0;padding:0;border:0;border-radius:0;background:transparent}
 html #unitDetailDialog.mobile-unit-compact .mobile-unit-plan h3{margin:0 0 4px;padding:4px 0;border-bottom:1px solid var(--fliq8-divider);font-size:.8rem;color:var(--fliq8-secondary)}
 html #unitDetailDialog.mobile-unit-compact .mobile-unit-plan .planned-blocks{display:grid;gap:8px}
 html #unitDetailDialog.mobile-unit-compact .mobile-unit-plan .planned-block{padding:0;margin:0;border:0;border-radius:0;background:transparent;box-shadow:none;min-width:0}
 html #unitDetailDialog.mobile-unit-compact .mobile-unit-plan .training-type-badge{font-size:.7rem;padding:0 4px}
 html #unitDetailDialog.mobile-unit-compact .mobile-unit-plan .planned-block-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 8px;margin:0;padding:0}
 html #unitDetailDialog.mobile-unit-compact .mobile-unit-plan .planned-block-head>strong{font-size:.9rem;line-height:1.4;overflow-wrap:anywhere}
 html #unitDetailDialog.mobile-unit-compact .mobile-unit-plan .planned-block-primary{padding:0;font-size:.85rem;line-height:1.4;white-space:normal;overflow-wrap:anywhere}
 html #unitDetailDialog.mobile-unit-compact .mobile-unit-plan .effort-route{flex:1 1 100%;display:flex;flex-wrap:wrap;align-items:baseline;gap:4px;margin:0;padding:0;border:0;background:transparent}
 html #unitDetailDialog.mobile-unit-compact .mobile-unit-plan .effort-route-point{min-width:0;flex:0 1 auto;display:inline}
 html #unitDetailDialog.mobile-unit-compact .mobile-unit-plan .effort-route-point small{display:none}
 html #unitDetailDialog.mobile-unit-compact .mobile-unit-plan .effort-route strong{font-size:.85rem;font-weight:500;line-height:1.4;word-break:normal;overflow-wrap:anywhere}
 html #unitDetailDialog.mobile-unit-compact .mobile-unit-plan .effort-route-arrow{font-size:1rem}
 html #unitDetailDialog.mobile-unit-compact .mobile-unit-plan .effort-route-length{font-size:.85rem;margin:0;padding:0;font-weight:700}
 html #unitDetailDialog.mobile-unit-compact .mobile-unit-plan .planned-block-facts{display:flex;flex-wrap:wrap;gap:4px 12px;margin:4px 0 0;padding:0;border:0}
 html #unitDetailDialog.mobile-unit-compact .mobile-unit-plan .planned-block-facts>div{display:flex;flex-wrap:wrap;gap:4px;margin:0;padding:0;min-width:0;border:0;background:transparent}
 html #unitDetailDialog.mobile-unit-compact .mobile-unit-plan .planned-block-facts :is(dt,dd){position:static;margin:0;padding:0;width:auto;height:auto;font-size:.8rem;line-height:1.4;clip:auto;white-space:normal;overflow-wrap:anywhere}
 html #unitDetailDialog.mobile-unit-compact .mobile-unit-plan .planned-block-facts dt{color:var(--fliq8-secondary)}
 html #unitDetailDialog.mobile-unit-compact .mobile-unit-plan .planned-block-facts dd{font-weight:500}
 html #unitDetailDialog.mobile-unit-compact .mobile-unit-plan .planned-block-metrics{display:flex;flex-wrap:wrap;gap:4px 8px;margin:4px 0 0;padding:0}
 html #unitDetailDialog.mobile-unit-compact .mobile-unit-plan .planned-block-metrics span{padding:0;border:0;background:transparent;font-size:.8rem;line-height:1.4}
 html #unitDetailDialog.mobile-unit-compact .mobile-unit-plan :is(.planned-block-notes,.planned-note,.planned-gym-abort,.legacy-session-text){margin:4px 0 0;padding:0;font-size:.8rem;line-height:1.4;white-space:pre-wrap;overflow-wrap:anywhere}
 html #unitDetailDialog.mobile-unit-compact .mobile-unit-plan .planned-note p{margin:0;display:inline}
 html #unitDetailDialog.mobile-unit-compact .mobile-unit-plan .planned-note strong{margin-right:4px}
 html #unitDetailDialog.mobile-unit-compact .mobile-unit-plan .planned-gym-details>summary{display:none}
 html #unitDetailDialog.mobile-unit-compact .mobile-unit-plan .planned-gym-details{margin:0;padding:0;border:0}
 html #unitDetailDialog.mobile-unit-compact .mobile-unit-plan button{min-height:44px;min-width:44px}
 html #unitDetailDialog.mobile-unit-compact :is(.mobile-unit-goal,.mobile-unit-snapshot){font-size:.75rem;margin:4px 0;line-height:1.4;color:var(--fliq8-secondary)}
 html #unitDetailDialog.mobile-unit-compact .mobile-unit-details{margin:8px 0 0;border-top:1px solid var(--fliq8-divider)}
 html #unitDetailDialog.mobile-unit-compact .mobile-unit-details>summary{display:list-item;min-height:44px;padding:12px 0;font-size:.85rem;box-sizing:border-box;cursor:pointer}
 html #unitDetailDialog.mobile-unit-compact .unit-detail-shell>.dialog-actions{min-height:0;margin:0;padding:8px 12px;gap:8px;position:static}
 html #unitDetailDialog.mobile-unit-compact .unit-detail-actions :is([data-document-execution],[data-start-session-timer]){display:none}
 html #unitDetailDialog.mobile-unit-compact .unit-detail-actions .button{flex:0 1 auto;min-height:44px;width:auto;font-size:.8rem;padding:8px 12px}
}

/* Two-line selected effort caption; the native select keeps its exact geometry. */
@media screen and (max-width:600px) {
  html:root #mobileDocumentationNavigation>#mobileDocumentationStep {
    grid-column:2;grid-row:1;color:transparent!important;-webkit-text-fill-color:transparent;
  }
  html:root #mobileDocumentationNavigation>#mobileDocumentationStep option {
    color:var(--fliq8-text);-webkit-text-fill-color:var(--fliq8-text);
  }
  html #mobileDocumentationCaption {
    grid-column:2;grid-row:1;z-index:1;align-self:center;min-width:0;height:28px;
    margin:0 40px 0 12px;padding:0;pointer-events:none;overflow-wrap:anywhere;
    overflow:hidden;white-space:normal;font:500 12px/14px Inter,Arial,sans-serif;color:var(--fliq8-text);
    font-variant-numeric:tabular-nums;text-align:left;
  }
  html #mobileDocumentationStep:disabled+#mobileDocumentationCaption{opacity:.5}
  html #mobileDocumentationNext{grid-column:3;grid-row:1}
}
@media screen and (max-width:600px) {
  html #mobileDocumentationNavigation{container-type:inline-size;container-name:mobile-stepbar}
}
/* At extreme text/browser zoom, keep the native picker reachable on its own row. */
@container mobile-stepbar (max-width:239px) {
  html:root #mobileDocumentationNavigation>#mobileDocumentationStep,
  html #mobileDocumentationCaption{grid-column:1/-1;grid-row:1}
  html #mobileDocumentationPrevious{grid-column:1;grid-row:2}
  html #mobileDocumentationNext{grid-column:3;grid-row:2}
  html #mobileDocumentationNavigation>#mobileDocumentationFlow{grid-column:2;grid-row:2;justify-self:center;min-height:56px}
}