/* Cohesive native shell; the existing web presentation stays untouched. */
html.native-onyx .native-all-weeks { min-height: 44px; padding: 10px 14px; margin: 0 0 12px; border-radius: 8px; border: 1px solid #dedee5; background: linear-gradient(#fff,#f0f0f4); color: #303036; font: 600 13px/1.3 system-ui,sans-serif; }
html.native-onyx #screen-workouts:has(#workout-logger:not([hidden])) > .section-head p,
html.native-onyx #screen-workouts:has(#workout-start:not([hidden])) > .section-head p { display: none; }
html.native-onyx #workout-logger .workout-feature,
html.native-onyx #workout-start .workout-feature { display: block; padding: 18px 20px; border-radius: 8px; border: 1px solid #3d3d43; background: linear-gradient(135deg,#36363d,#171719 80%); box-shadow: inset 0 1px #ffffff24,0 4px 14px #18181d0d; }
html.native-onyx #workout-logger .video-tile,
html.native-onyx #workout-start .video-tile { display: none; }
html.native-onyx #screen-workouts .workout-feature h3 { font: 650 23px/1.25 system-ui,sans-serif; letter-spacing: 0; margin: 6px 0; overflow-wrap: anywhere; }
html.native-onyx #screen-workouts .workout-feature .hero-kicker { color: #c8c8cf; font: 600 11px/1.4 system-ui,sans-serif; letter-spacing: 0; }
html.native-onyx #workout-meta,
html.native-onyx #start-workout-meta { font: 400 13px/1.4 system-ui,sans-serif; color: #d2d2d8; margin: 0; }
html.native-onyx #screen-workouts .rep-scheme { border: 0; border-left: 2px solid #d2d2d9; border-radius: 0; box-shadow: none; background: transparent; padding: 2px 0 2px 12px; margin: 18px 0; }
html.native-onyx #screen-workouts .rep-scheme strong { color: #303036; font-size: 13px; font-weight: 650; }
html.native-onyx #screen-workouts .rep-scheme p { color: #686870; font: 400 12px/1.5 system-ui,sans-serif; margin-top: 4px; }
html.native-onyx #screen-workouts .rep-scheme.deload { border-left-color: #e85d12; }
html.native-onyx #exercise-list { gap: 14px; }
html.native-onyx .exercise-log-card { padding: 16px; gap: 10px; border: 1px solid #e0e0e5; border-radius: 8px; background: linear-gradient(155deg,#fff 40%,#f6f6f8); box-shadow: 0 3px 12px #18181d06; }
html.native-onyx .exercise-log-head { grid-template-columns: 48px minmax(0,1fr); gap: 12px; align-items: center; }
html.native-onyx .exercise-log-head strong { display: block; font: 650 16px/1.35 system-ui,sans-serif; color: #202024; overflow-wrap: anywhere; }
html.native-onyx .exercise-log-head small { font: 400 12px/1.4 system-ui,sans-serif; color: #72727a; margin-top: 3px; }
html.native-onyx .exercise-log-head .exercise-thumb { width: 48px; height: 48px; border-radius: 8px; }
html.native-onyx .exercise-badges:empty { display: none; }
html.native-onyx .set-row,
html.native-onyx .set-column-head { display: grid; grid-template-columns: 24px minmax(0,1fr) minmax(0,1fr) 44px; gap: 8px; align-items: center; }
html.native-onyx .set-row.cardio-set-row,
html.native-onyx .set-row.reps-only-set-row,
html.native-onyx .set-column-head.single-metric { grid-template-columns: 24px minmax(0,1fr) 44px; }
html.native-onyx .set-column-head { color: #73737b; font: 500 11px/1.3 system-ui,sans-serif; text-align: center; margin-top: 3px; }
html.native-onyx .set-row span { color: #76767e; font-weight: 500; }
html.native-onyx .set-row input { box-sizing: border-box; width: 100%; min-width: 0; height: 46px; padding: 8px 6px; border: 1px solid #dedee5; border-radius: 8px; background: linear-gradient(#fff,#f2f2f5); box-shadow: inset 0 1px #fff; color: #202024; font: 550 17px/1.3 system-ui,sans-serif; font-variant-numeric: tabular-nums; text-align: center; }
html.native-onyx .set-row input::placeholder { color: #777780; font-weight: 400; }
html.native-onyx .set-row input:focus-visible { outline: 2px solid #b8b8c2; outline-offset: 2px; }
html.native-onyx .set-complete { width: 44px; height: 46px; border: 1px solid #dedee5; border-radius: 8px; background: #f5f5f7; color: #fff; }
html.native-onyx .set-complete.checked { background: linear-gradient(140deg,#3b3b42,#1c1c20); border-color: #303037; box-shadow: inset 0 1px #ffffff20; }
html.native-onyx .set-complete.checked::after { font-size: 18px; font-weight: 600; }
html.native-onyx .workout-note { border-top: 1px solid #ededf1; padding-top: 2px; }
html.native-onyx .workout-note summary { min-height: 36px; align-content: center; color: #72727a; font-size: 12px; cursor: pointer; }
html.native-onyx .workout-note input { width: 100%; box-sizing: border-box; min-height: 44px; font-size: 16px; font-weight: 400; border: 1px solid #dedee5; border-radius: 8px; background: #fafafa; padding: 10px; }
html.native-onyx .workout-progress strong { color: #73737b; font: 500 12px/1.4 system-ui,sans-serif; }
html.native-onyx .workout-progress span { height: 4px; background: #e6e6eb; }
html.native-onyx .workout-progress i { background: linear-gradient(90deg,#74747f,#202024); }
html.native-onyx #save-workout-log,
html.native-onyx #start-workout { min-height: 48px; border-radius: 8px; background: linear-gradient(140deg,#39393f,#171719); color: #fff; font-size: 15px; box-shadow: 0 4px 12px #18181d16; }
html.native-onyx #screen-checkins .section-head { margin-bottom: 20px; }
html.native-onyx #screen-checkins .section-head .eyebrow { display: none; }
html.native-onyx #screen-checkins .section-head h2 { font: 700 28px/1.2 system-ui,sans-serif; letter-spacing: 0; }
html.native-onyx #checkin-form { padding: 0; border: 0; border-radius: 0; box-shadow: none; background: transparent; gap: 16px; }
html.native-onyx #checkin-form .checkin-progress { display: none; }
html.native-onyx #checkin-form label { min-width: 0; gap: 7px; color: #37373e; font-size: 13px; font-weight: 600; }
html.native-onyx #checkin-form input:not([type=file]), html.native-onyx #checkin-form textarea { width: 100%; min-width: 0; box-sizing: border-box; min-height: 48px; padding: 12px; border: 1px solid #dedee4; border-radius: 8px; background: linear-gradient(145deg,#fff,#f2f2f5); color: #202024; font: 500 18px/1.3 system-ui,sans-serif; box-shadow: inset 0 1px 0 #fff; }
html.native-onyx #checkin-form textarea { min-height: 80px; font-size: 16px; resize: vertical; }
html.native-onyx #checkin-form input::placeholder, html.native-onyx #checkin-form textarea::placeholder { color: #8c8c94; font-weight: 400; }
html.native-onyx .native-checkin-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
html.native-onyx .native-checkin-photos { display: grid; gap: 9px; padding-bottom: 16px; border-bottom: 1px solid #e2e2e6; }
html.native-onyx .native-checkin-photos h3, html.native-onyx .native-checkin-subheading { font: 600 15px/1.3 system-ui,sans-serif; color: #252529; margin: 0; }
html.native-onyx #photo-input { border: 0; padding: 0; min-height: 44px; background: transparent; font-size: 0; width: 100%; }
html.native-onyx #photo-input::file-selector-button { min-height: 44px; padding: 10px 18px; border-radius: 8px; border: 1px solid #39393e; color: #fff; background: linear-gradient(140deg,#39393f,#171719); font: 600 14px/1.3 system-ui,sans-serif; cursor: pointer; }
html.native-onyx .native-checkin-photos .input-help, html.native-onyx #checkin-photo-count { font-size: 12px; line-height: 1.4; color: #73737b; font-weight: 400; }
html.native-onyx #photo-preview { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; }
html.native-onyx #photo-preview > div { aspect-ratio: 1; position: relative; border: 1px dashed #cccdd4; border-radius: 8px; background: linear-gradient(145deg,#fff,#ededf1); color: #73737b; font-weight: 500; }
html.native-onyx #photo-preview img { object-fit: contain; }
html.native-onyx #photo-preview > div:has(img)::after { position: absolute; bottom: 0; left: 0; right: 0; padding: 3px; background: #171719cc; color: white; font: 500 10px/1.3 system-ui,sans-serif; text-align: center; }
html.native-onyx #photo-preview > div:nth-child(1):has(img)::after { content: 'Front'; }
html.native-onyx #photo-preview > div:nth-child(2):has(img)::after { content: 'Side'; }
html.native-onyx #photo-preview > div:nth-child(3):has(img)::after { content: 'Back'; }
html.native-onyx .native-photo-guidance { font-size: 12px; color: #73737b; }
html.native-onyx .native-photo-guidance summary { min-height: 28px; cursor: pointer; }
html.native-onyx .native-photo-guidance p { margin: 4px 0 0; line-height: 1.4; }
html.native-onyx #checkin-form .checkin-prefill-card { display: grid; grid-template-columns: minmax(0,1fr) 44px; gap: 3px 8px; align-items: center; padding: 0; border: 0; border-radius: 0; box-shadow: none; background: transparent; color: #686870; font-size: 12px; line-height: 1.4; }
html.native-onyx #checkin-form .checkin-prefill-card[hidden] { display: none; }
html.native-onyx #checkin-form .checkin-prefill-card strong { font-size: 12px; font-weight: 500; color: #505058; }
html.native-onyx #checkin-form .checkin-prefill-card small { grid-column: 1; font-size: 11px; font-weight: 400; }
html.native-onyx #checkin-form .checkin-prefill-card button { grid-column: 2; grid-row: 1 / 3; width: 44px; height: 44px; padding: 11px; border: 1px solid #e0e0e5; border-radius: 8px; background: #f3f3f5; color: #414149; font-size: 0; }
html.native-onyx #checkin-form .checkin-prefill-card button::before { content: ''; display: block; width: 20px; height: 20px; background: currentColor; mask: url('/client-app/assets/rotate-cw.svg?v=327') center/contain no-repeat; -webkit-mask: url('/client-app/assets/rotate-cw.svg?v=327') center/contain no-repeat; }
html.native-onyx #checkin-form .rating-row button { height: 44px; border-radius: 8px; color: #585861; background: linear-gradient(#fff,#f0f0f3); font-size: 16px; font-weight: 600; }
html.native-onyx #checkin-form .rating-row button.selected { color: #fff; background: linear-gradient(140deg,#39393f,#171719); border-color: #252529; }
html.native-onyx #checkin-form .input-help { font-size: 12px; font-weight: 400; }
html.native-onyx .native-rating-endpoints { display: flex; justify-content: space-between; color: #7b7b83; font-size: 11px; font-weight: 400; }
html.native-onyx #submit-checkin { min-height: 50px; border-radius: 8px; margin-top: 2px; background: linear-gradient(140deg,#f17430,#e85d12); color: white; font-size: 16px; }
html.native-onyx .native-first-week { padding: 16px 0; border-bottom: 1px solid #dedee3; margin-bottom: 16px; }
html.native-onyx .native-first-week[hidden] { display: none; }
html.native-onyx .native-first-week small { color: #74747c; font-size: 10px; font-weight: 600; }
html.native-onyx .native-first-week h3 { color: #202024; font: 650 17px/1.3 system-ui, sans-serif; margin: 5px 0; letter-spacing: 0; }
html.native-onyx .native-first-week p { color: #616169; font-size: 13px; line-height: 1.45; margin: 0 0 12px; }
html.native-onyx .first-week-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
html.native-onyx .first-week-actions button { min-height: 44px; padding: 10px; border-radius: 8px; border: 1px solid #dedee4; background: linear-gradient(140deg,#fff,#ededf1); color: #242428; font: 600 13px/1.3 system-ui,sans-serif; }
html.native-onyx .first-week-actions button:first-child { color: #fff; background: linear-gradient(140deg,#39393f,#171719); border-color: #39393f; }
html.native-onyx .first-week-actions.single-action { grid-template-columns: minmax(0,1fr); }
html.native-onyx .first-week-actions [data-first-week-checkin] { color: #242428; background: linear-gradient(140deg,#fff,#ededf1); border-color: #dedee4; }
html.native-onyx .first-checkin-countdown { min-width: 0; min-height: 48px; display: flex; flex-direction: column; justify-content: center; padding: 6px 10px; text-align: center; }
html.native-onyx .first-checkin-countdown strong { font: 600 13px/1.4 system-ui,sans-serif; color: #36363e; }
html.native-onyx #screen-messages .first-checkin-countdown small { margin: 3px 0 0; font-size: 11px; }
html.native-onyx #screen-messages .native-first-week { flex: 0 0 auto; margin-bottom: 0; padding: 10px 0; }
html.native-onyx #screen-messages .native-first-week h3, html.native-onyx #screen-messages .native-first-week p { display: none; }
html.native-onyx #screen-messages .native-first-week:not([hidden]) ~ #coach-checkin-action { display: none; }
html.native-onyx #screen-messages .native-first-week small { display: block; margin-bottom: 7px; }
html.native-onyx .tracking-choice-actions { display: grid; gap: 10px; }
html.native-onyx #tracking-choice-sheet .confirm-card { padding: 22px; max-height: calc(100dvh - 48px); overflow-y: auto; }
html.native-onyx #tracking-choice-sheet h2 { font: 650 24px/1.2 system-ui, sans-serif; letter-spacing: 0; margin: 0; }
html.native-onyx #tracking-choice-sheet p { font-size: 14px; font-weight: 400; line-height: 1.45; margin: 0; }
html.native-onyx #tracking-choice-sheet .primary-btn { background: linear-gradient(140deg,#39393f,#171719); box-shadow: 0 3px 8px #18181d12; }
html.native-onyx #tracking-choice-sheet .tracking-choice-actions button { border-radius: 8px; min-height: 44px; }
html.native-onyx #tracking-choice-sheet .tracking-choice-note { font-size: 13px; color: #62626b; }
html.native-onyx #screen-workouts:has(.native-program-overview:not([hidden])) > .section-head { display: none; }
html.native-onyx .native-program-heading { display: grid; grid-template-columns: minmax(0,1fr) 76px; gap: 16px; align-items: start; }
html.native-onyx .native-program-heading h2 { font-size: 21px; line-height: 1.25; margin: 6px 0 12px; }
html.native-onyx .native-week-picker { display: grid; gap: 4px; font-size: 11px; color: #68686f; }
html.native-onyx .native-week-picker select { width: 100%; min-height: 44px; border: 1px solid #dcdce2; border-radius: 8px; background: linear-gradient(#fff,#eeeef2); color: #202024; padding: 8px; font-size: 16px; }
html.native-onyx #native-program-overview .native-program-days > button { grid-template-columns: 36px minmax(0,1fr) 18px; padding: 14px 12px; min-height: 76px; background: linear-gradient(150deg,#fff,#f2f2f5); border-color: #e1e1e6; box-shadow: 0 2px 5px #18181d06; }
html.native-onyx #native-program-overview .native-program-days i { grid-column: 1; grid-row: 1 / 3; align-self: center; font-size: 13px; font-weight: 600; font-style: normal; color: #73737b; }
html.native-onyx #native-program-overview .native-program-days span { grid-column: 2; line-height: 1.3; }
html.native-onyx #native-program-overview .native-program-days small { grid-column: 2; font-size: 11px; }
html.native-onyx #native-program-overview .native-program-days b { grid-column: 3; font-size: 20px; font-weight: 500; }
html.native-onyx #native-program-overview .native-program-days .is-next { background: linear-gradient(135deg,#35353c,#17171b); border-color: #434349; color: #fff; box-shadow: inset 0 1px #ffffff24,0 4px 10px #18181d12; }
html.native-onyx #native-program-overview .native-program-days .is-next i,
html.native-onyx #native-program-overview .native-program-days .is-next small,
html.native-onyx #native-program-overview .native-program-days .is-next b { color: #e8e8ed; }
html.native-onyx #native-program-overview .native-program-days .is-completed b { color: #68686f; }
html.native-onyx #week-browser .week-switcher { gap: 10px; }
html.native-onyx #week-title { font-family: inherit; font-size: 16px; line-height: 1.35; }
html.native-onyx .workout-day-row { min-height: 76px; padding: 14px; border-radius: 8px; background: linear-gradient(145deg,#fff,#f2f2f5); border-color: #e1e1e6; box-shadow: 0 2px 6px #18181d06; gap: 12px; }
html.native-onyx .workout-day-marker { width: 36px; height: 36px; background: none; border: 0; box-shadow: none; font-size: 13px; color: #72727a; }
html.native-onyx .workout-day-row strong { font-size: 15px; line-height: 1.35; }
html.native-onyx .workout-day-row small { font-size: 12px; }
html.native-onyx .workout-day-row.is-next { background: linear-gradient(135deg,#35353c,#17171b); color: #fff; border-color: #434349; }
html.native-onyx .workout-day-row.is-next .workout-day-marker,
html.native-onyx .workout-day-row.is-next small,
html.native-onyx .workout-day-row.is-next b { color: #e8e8ed; }
html.native-onyx .program-hero, html.native-onyx .workout-feature { background: linear-gradient(145deg,#313137,#17171b); color: #fff; box-shadow: none; }
html.native-onyx .program-hero p, html.native-onyx .program-hero h3,
html.native-onyx .workout-feature p, html.native-onyx .workout-feature h3 { color: inherit; }
html.native-onyx #advanced-target-card { margin: 20px 0 12px; padding: 0; background: none; border: 0; border-radius: 0; box-shadow: none; }
html.native-onyx #advanced-target-card > div { display: none; }
html.native-onyx #advanced-target-card label { display: grid; grid-template-columns: 60px minmax(0,1fr); gap: 12px; align-items: center; font-size: 14px; }
html.native-onyx #advanced-target-select { min-height: 48px; width: 100%; font-size: 15px; background: linear-gradient(#fff,#f1f1f4); color: #202024; border: 1px solid #dcdce2; border-radius: 8px; padding: 10px 12px; }
html.native-onyx #advanced-target-status { font-size: 12px; font-weight: 400; }
html.native-onyx #advanced-target-status:empty { display: none; }
html.native-onyx.native-meds-linked #med-log-section { display: none; }
html.native-onyx .native-profile-link { display: grid; grid-template-columns: 24px minmax(0,1fr) 18px; gap: 12px; align-items: center; width: 100%; min-height: 56px; margin: 12px 0 24px; padding: 14px; text-align: left; background: linear-gradient(#fff,#f1f1f4); color: #202024; border: 1px solid #dcdce2; border-radius: 8px; font-size: 15px; font-weight: 600; }
html.native-onyx .native-profile-link[hidden] { display: none; }
html.native-onyx .native-meds-icon { width: 22px; height: 22px; background: currentColor; mask: url('/client-app/assets/pill.svg?v=327') center / contain no-repeat; -webkit-mask: url('/client-app/assets/pill.svg?v=327') center / contain no-repeat; }
html.native-onyx .native-tracking-icon { width: 22px; height: 22px; background: currentColor; mask: url('/client-app/assets/utensils.svg?v=327') center / contain no-repeat; -webkit-mask: url('/client-app/assets/utensils.svg?v=327') center / contain no-repeat; }
html.native-onyx { --cream-soft: #fafaf8; --paper: #fafaf8; --surface: #fafaf8; --cream: #eeeef1; --ink-muted: #68686f; }
/* Shared macro identity with TrackR native. */
html.native-onyx { --macro-protein: #3478F6; --macro-carbs: #008F87; --macro-fat: #8B5BD6; }
html.native-onyx .macro-ring-card.protein { --ring-color: var(--macro-protein); }
html.native-onyx .macro-ring-card.carbs { --ring-color: var(--macro-carbs); }
html.native-onyx .macro-ring-card.fats { --ring-color: var(--macro-fat); }
html.native-onyx body { background: #fafaf8; font-family: -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif; }
html.native-onyx body::before { content: ''; position: fixed; inset: 0 0 auto; height: env(safe-area-inset-top); background: #fafaf8; z-index: 80; pointer-events: none; }
html.native-onyx .app-shell { background: #fafaf8; box-shadow: none; }
html.native-onyx .app-topbar { position: relative; top: auto; padding: 8px 0 22px; background: #fafaf8; backdrop-filter: none; flex-shrink: 0; }
html.native-onyx #program-label { display: none; }
html.native-onyx .app-wordmark { font-family: Inter, system-ui, sans-serif; font-size: 30px; font-weight: 750; font-style: normal; line-height: 1.15; letter-spacing: 0; text-transform: none; color: #171719; }
html.native-onyx .native-page-title { display: none; margin: 0; font-size: 30px; line-height: 1.15; font-weight: 700; font-family: inherit; letter-spacing: 0; }
html.native-onyx .app-shell:has(#screen-messages.active) .app-wordmark,
html.native-onyx .app-shell:has(#screen-workouts.active) .app-wordmark,
html.native-onyx .app-shell:has(#screen-nutrition.active) .app-wordmark,
html.native-onyx .app-shell:has(#screen-profile.active) .app-wordmark { display: none; }
html.native-onyx .app-shell:has(#screen-messages.active) [data-native-title="messages"],
html.native-onyx .app-shell:has(#screen-workouts.active) [data-native-title="workouts"],
html.native-onyx .app-shell:has(#screen-nutrition.active) [data-native-title="nutrition"],
html.native-onyx .app-shell:has(#screen-profile.active) [data-native-title="profile"] { display: block; }
html.native-onyx .app-topbar > .settings-trigger { display: none; }
html.native-onyx .app-shell:has(#screen-profile.active) .app-topbar > .settings-trigger { display: grid; width: 44px; height: 44px; background: none; border: 0; box-shadow: none; }
html.native-onyx #screen-profile > .screen-header-with-action { display: none; }
html.native-onyx .bottom-nav { background: #fafaf8f5; border-color: #e3e3e7; }
html.native-onyx .bottom-nav button { color: #72727b; border-radius: 8px; font-size: 10px; font-weight: 500; gap: 5px; }
html.native-onyx .bottom-nav .active { color: #d95111; background: transparent; box-shadow: none; font-weight: 650; }
html.native-onyx .bottom-nav button > span { width: 23px; height: 23px; margin: 0; font-size: 0; background: currentColor; -webkit-mask: var(--nav-icon) center / contain no-repeat; mask: var(--nav-icon) center / contain no-repeat; }
html.native-onyx .bottom-nav [data-tab="home"] { --nav-icon: url('/client-app/assets/house.svg?v=327'); }
html.native-onyx .bottom-nav [data-tab="messages"] { --nav-icon: url('/client-app/assets/message-circle.svg?v=327'); }
html.native-onyx .bottom-nav [data-tab="workouts"] { --nav-icon: url('/client-app/assets/dumbbell.svg?v=327'); }
html.native-onyx .bottom-nav [data-tab="nutrition"] { --nav-icon: url('/client-app/assets/utensils.svg?v=327'); }
html.native-onyx .bottom-nav [data-tab="profile"] { --nav-icon: url('/client-app/assets/user-round.svg?v=327'); }
html.native-onyx .nav-badge { top: 4px; right: 18%; }
html.native-onyx .eyebrow { letter-spacing: 0; font-weight: 600; }
html.native-onyx #home-content.native-today > .hero-card { padding: 18px; gap: 12px; background: linear-gradient(145deg,#27272c,#141416); border-color: #29292d; box-shadow: none; }
html.native-onyx .hero-card #today-note { font-size: 13px; line-height: 1.45; }
html.native-onyx .quick-grid { margin-top: 12px; grid-template-rows: repeat(2,minmax(108px,1fr)); border-radius: 12px; box-shadow: none; }
html.native-onyx .quick-grid .metric-card { min-height: 108px; padding: 15px 13px; background: linear-gradient(155deg,#fff,#f4f4f7); }
html.native-onyx .quick-grid .metric-card:first-child { border-top-left-radius: 11px; }
html.native-onyx .quick-grid .metric-card:nth-child(2) { border-top-right-radius: 11px; }
html.native-onyx .quick-grid .metric-card:nth-child(3) { border-bottom-left-radius: 11px; }
html.native-onyx .quick-grid #home-cardio-tile { border-bottom-right-radius: 11px; }
html.native-onyx .quick-grid.slab-mode .metric-card:nth-child(3),
html.native-onyx .quick-grid.slab-mode #home-cardio-tile { padding-top: 16px; padding-bottom: 29px; }
html.native-onyx .quick-grid .metric-ring { bottom: 10px; right: 10px; width: 20px; height: 20px; }
html.native-onyx .quick-grid .metric-ring svg { width: 20px; height: 20px; }
html.native-onyx .quick-grid .metric-ring circle:last-child { stroke: #ed651d; }
html.native-onyx .native-activity { margin: 12px 0; }
html.native-onyx .native-activity-stats { padding: 10px 16px; border-radius: 16px; background: #1c1c20; border-color: #29292e; box-shadow: none; }
html.native-onyx .native-nutrition { margin-top: 12px; }
html.native-onyx .native-nutrition #open-trackr { background: linear-gradient(145deg,#29292e,#17171a); border-color: #303036; box-shadow: none; }
html.native-onyx .native-nutrition #open-macro-journal { background: linear-gradient(#fff,#f4f4f7); box-shadow: none; border-color: #dddde3; }
html.native-onyx .native-nutrition .macro-journal-card-stats b { font-weight: 500; }
html.native-onyx .bubble.coach { background: #1c1c20; border-color: #29292e; box-shadow: none; }
html.native-onyx .bubble.client { background: #eeeef2; }
html.native-onyx .message-sender { font-size: 10px; font-weight: 600; letter-spacing: 0; }
html.native-onyx .message-thread,
html.native-onyx .message-item { align-content: start; }
html.native-onyx .coach-checkin-action { border-color: #e2e2e7; border-radius: 12px; box-shadow: none; }
html.native-onyx .coach-checkin-action strong { font-size: 13px; font-weight: 650; }
html.native-onyx .coach-checkin-action span { font-size: 11px; font-weight: 400; }
html.native-onyx .coach-checkin-action > button:last-child { min-width: 62px; min-height: 44px; padding: 10px 14px; border: 0; border-radius: 8px; font-weight: 600; }
html.native-onyx #coach-checkin-action { grid-template-columns: minmax(0,1fr); padding: 10px 0; background: transparent; border: 0; box-shadow: none; }
html.native-onyx #coach-checkin-action > :not(:last-child) { display: none; }
html.native-onyx #coach-checkin-action > button:last-child { width: 100%; min-height: 48px; border: 1px solid #dedee4; color: #242428; background: linear-gradient(140deg,#fff,#ededf1); }
html.native-onyx #screen-workouts > .section-head { margin: 0 0 14px; }
html.native-onyx #screen-workouts > .section-head .eyebrow { display: none; }
html.native-onyx #workout-screen-heading { font-family: inherit; font-size: 16px; font-weight: 500; line-height: 1.3; letter-spacing: 0; color: #68686f; }
html.native-onyx #screen-workouts:has(.native-program-overview:not([hidden])) #open-program-help { display: none; }
html.native-onyx .native-program-overview { margin: 0 0 24px; }
html.native-onyx .native-program-overview h2 { font-family: inherit; font-size: 23px; line-height: 1.15; letter-spacing: 0; margin: 8px 0; overflow-wrap: anywhere; }
html.native-onyx .native-program-overview .eyebrow { font-size: 10px; color: #66666f; }
html.native-onyx .native-program-meta { margin: 0 0 14px; color: #68686f; font-size: 13px; }
html.native-onyx .native-program-days { display: grid; gap: 8px; margin-bottom: 12px; }
html.native-onyx .native-program-days > button { display: grid; grid-template-columns: minmax(0,1fr) 18px; gap: 3px 8px; text-align: left; padding: 12px; border: 1px solid #e3e3e8; border-radius: 8px; background: #fff; color: #202024; }
html.native-onyx .native-program-days span { font-size: 14px; font-weight: 600; }
html.native-onyx .native-program-days small { color: #73737c; grid-column: 1; }
html.native-onyx .native-program-days b { grid-column: 2; grid-row: 1 / 3; align-self: center; color: #777780; }
html.native-onyx .native-program-overview > .primary-btn { width: 100%; border-radius: 8px; background: #1c1c20; color: #fff; min-height: 48px; font-weight: 600; box-shadow: none; }
html.native-onyx .native-explore-title { font-size: 13px; font-weight: 600; font-family: inherit; letter-spacing: 0; margin: 0 0 12px; }
html.native-onyx .program-list { gap: 8px; }
html.native-onyx .program-row { min-height: 68px; padding: 12px; border: 1px solid #e3e3e8; border-radius: 8px; background: #fff; box-shadow: none; gap: 10px; }
html.native-onyx .program-row strong { font-size: 16px; font-weight: 600; line-height: 1.2; }
html.native-onyx .program-row small { font-size: 12px; color: #73737b; }
html.native-onyx .program-row .program-icon { width: 32px; height: 32px; background: #f2f2f5; border: 0; box-shadow: none; }
html.native-onyx .program-row .program-icon img { display: none; }
html.native-onyx .program-row .program-icon::before { content: ''; display: block; width: 24px; height: 24px; background: #303038; -webkit-mask: url('/client-app/assets/dumbbell.svg?v=327') center / contain no-repeat; mask: url('/client-app/assets/dumbbell.svg?v=327') center / contain no-repeat; }
html.native-onyx .program-row b { color: #777780; font-size: 24px; }
html.native-onyx .program-hero h3,
html.native-onyx .workout-feature h3 { font-family: inherit; letter-spacing: 0; font-size: 22px; }
html.native-onyx #screen-nutrition > .nutrition-card { padding: 18px; border-radius: 12px; background: #1c1c20; box-shadow: none; margin-bottom: 14px; }
html.native-onyx .nutrition-card h2 { font-family: inherit; font-size: 25px; letter-spacing: 0; }
html.native-onyx .nutrition-card .eyebrow { display: none; }
html.native-onyx .nutrition-card p { font-size: 13px; line-height: 1.45; }
html.native-onyx .ssv3-hero { padding: 16px 0; margin: 8px 0 16px; border: 0; border-radius: 0; background: none; box-shadow: none; color: #202024; }
html.native-onyx .ssv3-hero:has(.ssv3-hero-nums) > h2,
html.native-onyx .ssv3-hero:has(.ssv3-hero-nums) > .ssv3-eyebrow { display: none; }
html.native-onyx .ssv3-hero h2 { color: #202024; font-family: inherit; font-size: 21px; }
html.native-onyx .ssv3-hero-num { min-width: 0; background: none; padding: 6px 12px; border-radius: 0; text-align: left; }
html.native-onyx .ssv3-hero-num:first-child { padding-left: 0; }
html.native-onyx .ssv3-hero-num + .ssv3-hero-num { border-left: 1px solid #dcdce2; }
html.native-onyx .ssv3-hero-num b { color: #202024; font-size: 28px; font-weight: 650; }
html.native-onyx .ssv3-hero-num span { color: #686871; letter-spacing: 0; }
html.native-onyx .ssv3-verdict { color: #686871; font-size: 12px; }
html.native-onyx .ssv3-verdict b { color: #303037; }
html.native-onyx .ssv3-sec,
html.native-onyx .ssv3-pdf-card { border-radius: 8px; border-color: #e3e3e8; box-shadow: none; }
html.native-onyx .ssv3-sec-head { padding: 14px; }
html.native-onyx .ssv3-sec-title b { font-size: 15px; font-weight: 600; }
html.native-onyx .ssv3-banner { border-radius: 8px; padding: 12px; margin: 14px 0; }
html.native-onyx .ssv3-banner-text b { font-size: 13px; }
html.native-onyx .ssv3-banner-text span { font-size: 12px; }
html.native-onyx .native-profile-latest { display: grid; gap: 5px; padding: 2px 0 12px; }
html.native-onyx .native-profile-latest[hidden] { display: none; }
html.native-onyx .native-profile-latest strong { font-size: 32px; font-weight: 650; line-height: 1.15; font-variant-numeric: tabular-nums; }
html.native-onyx .native-profile-latest span { font-size: 12px; color: #73737b; }
html.native-onyx .progress-clean { padding: 0; border: 0; border-radius: 0; background: none; box-shadow: none; }
html.native-onyx .progress-chart-wrap-clean { border: 0; border-radius: 0; background: none; }
html.native-onyx .progress-chart-wrap-clean canvas { height: 300px; }
html.native-onyx .progress-stats-row { padding: 12px 0; }
html.native-onyx .progress-stats-row b { font-size: 11px; font-weight: 500; text-transform: none; }
html.native-onyx .progress-photos-section { padding: 18px 0 0; border: 0; border-top: 1px solid #e3e3e8; border-radius: 0; background: none; box-shadow: none; }
html.native-onyx .progress-photo-head--centered { text-align: left; justify-content: flex-start; }
html.native-onyx .progress-photo-head h3 { font-family: inherit; font-size: 16px; font-weight: 600; letter-spacing: 0; text-transform: none; }
html.native-onyx .photo-compare-grid > strong { font-size: 12px; font-weight: 600; text-transform: none; }
@media (prefers-reduced-motion: reduce) {
  html.native-onyx .screen { animation: none; }
  html.native-onyx .slab-hub { transition: none; }
}
/* Native journal: one quiet editor, with the same two-state control as TrackR. */
html.native-onyx .macro-journal-panel { background: #fafafa; border-color: #dedee3; gap: 16px; padding: 20px 18px calc(24px + env(safe-area-inset-bottom)); }
html.native-onyx .macro-journal-head h3 { font: 650 24px/1.2 Inter, system-ui, sans-serif; color: #1d1d20; margin: 0 0 8px; }
html.native-onyx .macro-journal-head .eyebrow { display: none; }
html.native-onyx .macro-journal-head p { font-size: 13px; line-height: 1.5; color: #73737b; }
html.native-onyx #close-macro-journal { color: #242428; font-size: 14px; min-height: 44px; }
html.native-onyx .macro-journal-toolbar { padding: 8px 0; }
html.native-onyx .macro-journal-toolbar strong { font-size: 15px; font-weight: 600; color: #303036; }
html.native-onyx .macro-journal-arrow { width: 44px; height: 44px; background: linear-gradient(#fff,#eeeef2); border-color: #dddde3; color: #29292e; box-shadow: 0 1px 2px #00000008; font-weight: 500; }
html.native-onyx .macro-journal-mode { width: min(240px,100%); justify-self: center; padding: 4px; gap: 2px; border-radius: 999px; background: #e9e9ed; border: 1px solid #e0e0e5; }
html.native-onyx .macro-journal-mode button { border: 0; min-height: 44px; padding: 8px 16px; color: #72727a; background: transparent; font-size: 14px; font-weight: 600; box-shadow: none; }
html.native-onyx .macro-journal-mode button.active { background: linear-gradient(145deg,#39393f,#19191d); color: #fff; box-shadow: 0 2px 4px #00000020,inset 0 1px #ffffff25; }
html.native-onyx .macro-reminder-callout, html.native-onyx .macro-journal-reminder { display: none; }
html.native-onyx .macro-reminder-quick { justify-self: end; margin: -8px 0 0; }
html.native-onyx .macro-reminder-quick button { background: none; border: 0; color: #66666e; box-shadow: none; font-size: 12px; }
html.native-onyx .macro-journal-days { gap: 0; }
html.native-onyx .macro-day-card { border: 0; border-radius: 0; border-bottom: 1px solid #e2e2e7; background: transparent; padding: 18px 0; gap: 12px; }
html.native-onyx .macro-day-head strong { color: #26262c; font-size: 16px; font-weight: 600; }
html.native-onyx .macro-day-head span { color: #777780; font-size: 12px; font-weight: 500; }
html.native-onyx .macro-day-card.is-today .macro-day-head span { color: #c9541c; font-weight: 650; }
html.native-onyx .macro-day-grid, html.native-onyx .macro-day-grid.full { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
html.native-onyx .macro-day-card label { color: #6d6d77; font-size: 12px; font-weight: 500; }
html.native-onyx .macro-day-card input, html.native-onyx .macro-day-card textarea { min-width: 0; min-height: 48px; border-radius: 8px; border-color: #dddde4; background: linear-gradient(145deg,#fff,#f1f1f6); color: #222228; font-size: 17px; font-weight: 550; }
html.native-onyx .macro-day-card input:focus, html.native-onyx .macro-day-card textarea:focus { outline: 2px solid #686872; outline-offset: 2px; }
html.native-onyx .macro-note summary { color: #76767e; font-size: 12px; cursor: pointer; padding: 6px 0; }
html.native-onyx .macro-day-card.is-future .macro-note { display: none; }
html.native-onyx .macro-save-state { min-height: 14px; color: #75757e; font-weight: 500; }
html.native-onyx .macro-journal-average { border-radius: 8px; background: linear-gradient(130deg,#35353b,#18181c); padding: 16px; color: #fff; gap: 16px; }
html.native-onyx .macro-average-heading { display: flex; align-items: center; justify-content: space-between; gap: 8px; font-size: 12px; }
html.native-onyx .macro-average-heading > strong { font-weight: 550; }
html.native-onyx .macro-average-heading > span { color: #c3c3cc; }
html.native-onyx .macro-average-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }
html.native-onyx .macro-average-grid span { padding: 0; background: none; border-radius: 0; min-width: 0; }
html.native-onyx .macro-average-grid b { color: #c3c3cc; font-weight: 500; }
html.native-onyx .macro-average-grid strong { color: #fff; font-size: 23px; font-weight: 600; }
html.native-onyx #macro-journal-status { color: #777780; font-size: 12px; line-height: 1.5; }
/* Authentication is a full native screen, not a sheet over the signed-out app. */
html.native-onyx #auth-gate {
  background: #fafafa;
  backdrop-filter: none;
  padding: max(32px, env(safe-area-inset-top)) max(24px, env(safe-area-inset-right)) max(28px, env(safe-area-inset-bottom)) max(24px, env(safe-area-inset-left));
  color: #202023;
}
html.native-onyx #auth-gate .auth-card {
  width: min(430px, 100%);
  min-width: 0;
  padding: 16px 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  gap: 18px;
  font-family: Inter, system-ui, sans-serif;
}
html.native-onyx #auth-gate .auth-card:not([hidden])::before {
  content: 'LeanR';
  display: block;
  font: 750 38px/1.2 Inter, system-ui, sans-serif;
  letter-spacing: 0;
  color: #202023;
  margin-bottom: 26px;
}
html.native-onyx #auth-gate .auth-card h1 {
  margin: 0;
  font: 700 28px/1.2 Inter, system-ui, sans-serif;
  letter-spacing: 0;
  color: #202023;
  overflow-wrap: anywhere;
}
html.native-onyx #auth-gate .auth-card .eyebrow {
  font: 600 12px/1.4 Inter, system-ui, sans-serif;
  letter-spacing: 0;
  color: #71717a;
  margin: 0 0 -10px;
}
html.native-onyx #auth-gate .auth-card p:not(.eyebrow) { font-size: 15px; line-height: 1.6; color: #696970; }
html.native-onyx #auth-gate .auth-card label { font-size: 14px; font-weight: 600; color: #303036; min-width: 0; }
html.native-onyx #auth-gate .auth-card input:not([type=checkbox]) {
  width: 100%; min-width: 0; min-height: 54px; padding: 14px;
  border: 1px solid #dcdce2; border-radius: 8px;
  background: #fff; color: #202023; box-shadow: none;
  font: 500 16px/1.4 Inter, system-ui, sans-serif;
}
html.native-onyx #auth-gate .auth-card input:focus-visible { outline: 2px solid #c94d0a; outline-offset: 2px; }
html.native-onyx #auth-gate .primary-btn {
  min-height: 54px; border-radius: 8px; background: #c94d0a;
  color: #fff; box-shadow: none; font: 650 16px/1.4 Inter, system-ui, sans-serif;
}
html.native-onyx #auth-gate .text-btn { min-height: 44px; color: #36363c; font: 600 14px/1.4 Inter, system-ui, sans-serif; }
html.native-onyx #auth-gate .auth-card small { font-size: 13px; line-height: 1.5; overflow-wrap: anywhere; }
html.native-onyx #auth-gate .auth-card small:empty { display: none; }
@media (max-height: 580px) {
  html.native-onyx #auth-gate .auth-card { margin: 0; }
  html.native-onyx #auth-gate .auth-card:not([hidden])::before { margin-bottom: 8px; font-size: 30px; }
}