/* Mobile-first interface pass v43 */

.hero {
  display: none !important;
}

.app-shell {
  padding-top: calc(8px + env(safe-area-inset-top));
}

main {
  padding-top: 0;
}

.tab-bar {
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 2px;
  padding: 6px;
}

.tab {
  min-height: 54px;
  padding: 3px 1px;
  font-size: 0.61rem;
}

.tab::before {
  width: 19px;
  height: 19px;
  font-size: 0.8rem;
}

.relocated-progress-card,
.relocated-settings-card,
.today-session-tracking-heading,
.home-session-notes,
.home-track-card {
  margin-top: 12px;
}

.today-session-tracking-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 13px 15px;
}

.today-session-tracking-heading h3,
.today-session-tracking-heading p {
  margin-bottom: 0;
}

.pilot-card--compact {
  min-height: 0 !important;
  padding: 12px !important;
  gap: 10px !important;
}

.pilot-card--compact h3 {
  margin-bottom: 0;
  font-size: 0.98rem;
}

.pilot-card--compact article,
.pilot-card--compact .primary-button,
.pilot-card--compact .secondary-button {
  min-height: 42px;
}

body.ui-dark-surface .pilot-card--compact article,
body.ui-dark-surface .mini-day,
body.ui-dark-surface .timeline article,
body.ui-dark-surface .support-grid article,
body.ui-dark-surface .cloud-state-grid article,
body.ui-dark-surface .data-tools-grid article,
body.ui-dark-surface .settings-insight article,
body.ui-dark-surface .review-scoreboard article,
body.ui-dark-surface .coach-kpi-grid article,
body.ui-dark-surface .review-sport-stack article,
body.ui-dark-surface .record-card,
body.ui-dark-surface .preflight-grid article,
body.ui-dark-surface .dashboard-grid article,
body.ui-dark-surface .detail-metrics article,
body.ui-dark-surface .info-item,
body.ui-dark-surface .gps-grid article,
body.ui-dark-surface .completion-metrics article,
body.ui-dark-surface .editor-day,
body.ui-dark-surface .calendar-day,
body.ui-dark-surface .exercise-history-row,
body.ui-dark-surface .coach-action-card {
  border-color: var(--line) !important;
  background: var(--surface-soft) !important;
  color: var(--ink) !important;
  box-shadow: inset 0 0 0 1px rgba(148, 163, 184, 0.08) !important;
}

body.ui-dark-surface .mini-day.is-done,
body.ui-dark-surface .editor-day.is-active,
body.ui-dark-surface .calendar-day.is-done {
  border-color: var(--accent) !important;
  background: color-mix(in srgb, var(--accent-soft) 68%, var(--surface-soft)) !important;
}

body.ui-dark-surface .mini-day span,
body.ui-dark-surface .mini-day small,
body.ui-dark-surface .timeline article span,
body.ui-dark-surface .timeline article small,
body.ui-dark-surface .support-grid article span,
body.ui-dark-surface .support-grid article small {
  color: var(--muted) !important;
}

.compact-current-video {
  padding-bottom: 12px !important;
}

.compact-current-video .demo-columns {
  display: none !important;
}

.compact-current-video [class*="demo-frame"],
.compact-current-video [class*="video-frame"],
.compact-current-video [class*="demo-stage"],
.compact-current-video [class*="video-stage"],
.compact-current-video [class*="demo-media"],
.compact-current-video [class*="video-media"] {
  min-height: 0 !important;
  max-height: 320px !important;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: var(--surface-soft) !important;
}

.compact-current-video img,
.compact-current-video video {
  width: 100% !important;
  max-height: 300px !important;
  object-fit: contain !important;
  background: var(--surface-soft) !important;
}

body.ui-dark-surface .compact-current-video .exercise-db-media {
  filter: invert(0.92) hue-rotate(180deg) contrast(0.94);
  mix-blend-mode: screen;
  background: transparent !important;
}

.dashboard-video-embed {
  margin: 14px 0 !important;
  padding: 10px !important;
  border: 1px solid rgba(255, 255, 255, 0.14) !important;
  border-top: 1px solid rgba(255, 255, 255, 0.14) !important;
  border-radius: 10px !important;
  background: rgba(255, 255, 255, 0.07) !important;
  color: #ffffff !important;
  box-shadow: none !important;
}

.dashboard-video-embed .section-heading {
  margin-bottom: 8px;
}

.dashboard-video-embed h3 {
  margin-bottom: 0;
  color: #ffffff;
  font-size: 0.98rem;
}

.dashboard-video-embed .eyebrow,
.dashboard-video-embed .demo-source-row,
.dashboard-video-embed .demo-source-row a,
.dashboard-video-embed small {
  color: #a7f3d0 !important;
}

.dashboard-video-embed .status-pill {
  background: rgba(255, 255, 255, 0.12) !important;
  color: #ffffff !important;
}

.dashboard-video-embed .demo-frame-button {
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: rgba(2, 6, 23, 0.38);
}

.dashboard-video-embed .demo-video,
.dashboard-video-embed .demo-motion,
.dashboard-video-embed [class*="demo-frame"],
.dashboard-video-embed [class*="video-frame"],
.dashboard-video-embed [class*="demo-stage"],
.dashboard-video-embed [class*="video-stage"],
.dashboard-video-embed [class*="demo-media"],
.dashboard-video-embed [class*="video-media"] {
  max-height: 230px !important;
  background: #071018 !important;
  box-shadow: none !important;
}

.dashboard-video-embed img,
.dashboard-video-embed video {
  max-height: 220px !important;
  background: #071018 !important;
}

.dashboard-video-embed .demo-source-row {
  margin-top: 6px;
  font-size: 0.68rem;
}

.dashboard-video-embed .track-actions,
.dashboard-video-embed .live-actions,
.dashboard-video-embed .form-assist-actions {
  margin-top: 9px;
}

.dashboard-video-embed .secondary-button {
  border-color: rgba(255, 255, 255, 0.18);
  background: rgba(255, 255, 255, 0.09);
  color: #ffffff;
  box-shadow: none;
}

.dashboard-video-embed .primary-button {
  box-shadow: none;
}

body.ui-dark-surface .featured-session,
body.ui-dark-surface .activity-detail-card,
body.ui-dark-surface .weekly-review-card,
body.ui-dark-surface .adaptive-coach-card,
body.ui-dark-surface .cloud-card {
  background: var(--surface) !important;
}

#view-progress .ring-panel,
#view-progress .relocated-progress-card,
#view-settings .relocated-settings-card {
  scroll-margin-top: 14px;
}

#view-home .home-track-card {
  margin-bottom: 12px;
}

@media (max-width: 520px) {
  .app-shell {
    padding-right: 10px;
    padding-left: 10px;
  }

  .tab-bar {
    width: calc(100% - 18px);
    bottom: max(6px, env(safe-area-inset-bottom));
  }

  .tab {
    min-height: 52px;
    font-size: 0.57rem;
  }

  .tab::before {
    width: 18px;
    height: 18px;
    font-size: 0.75rem;
  }

  .today-session-tracking-heading {
    align-items: flex-start;
  }

  .today-session-tracking-heading .status-pill {
    display: none;
  }

  .pilot-card--compact {
    grid-template-columns: 1fr !important;
  }

  .compact-current-video [class*="demo-frame"],
  .compact-current-video [class*="video-frame"],
  .compact-current-video [class*="demo-stage"],
  .compact-current-video [class*="video-stage"],
  .compact-current-video [class*="demo-media"],
  .compact-current-video [class*="video-media"] {
    max-height: 240px !important;
  }

  .compact-current-video img,
  .compact-current-video video {
    max-height: 220px !important;
  }

  .dashboard-video-embed {
    margin: 12px 0 !important;
    padding: 8px !important;
  }

  .dashboard-video-embed .section-heading {
    display: flex;
    flex-wrap: nowrap;
    align-items: flex-start;
    justify-content: space-between;
  }

  .dashboard-video-embed .status-pill {
    display: none;
  }

  .dashboard-video-embed .demo-video,
  .dashboard-video-embed .demo-motion,
  .dashboard-video-embed [class*="demo-frame"],
  .dashboard-video-embed [class*="video-frame"],
  .dashboard-video-embed [class*="demo-stage"],
  .dashboard-video-embed [class*="video-stage"],
  .dashboard-video-embed [class*="demo-media"],
  .dashboard-video-embed [class*="video-media"] {
    max-height: 190px !important;
  }

  .dashboard-video-embed img,
  .dashboard-video-embed video {
    max-height: 180px !important;
  }
}

@supports not (background: color-mix(in srgb, black, white)) {
  body.ui-dark-surface .mini-day.is-done,
  body.ui-dark-surface .editor-day.is-active,
  body.ui-dark-surface .calendar-day.is-done {
    background: var(--accent-soft) !important;
  }
}