/* Shared contrast layer: accent paint and readable foregrounds are separate. */
:root { --accent-text: #dfff00; --focus-ring: #91bfff; }
html[data-theme="light"] { --accent-text: #485b00; --focus-ring: #286fad; }
body:has(.app) { color: var(--ink); }
html[data-theme="light"]:has(.app) {
  --muted: #51594c;
  --red: #ad3028;
  --green: #316d20;
  --yellow: #755600;
}
.app .secondary:where(:not(.active):not(.selected)), .app .eyebrow, .app .pill { color: var(--ink); }
.app :is(input, select, textarea) { color: var(--ink); -webkit-text-fill-color: var(--ink); }
.app input::placeholder, .app textarea::placeholder { color: var(--muted); -webkit-text-fill-color: var(--muted); opacity: 1; }
.app :is(button, input, select, textarea, summary, a):focus-visible {
  outline: 3px solid var(--focus-ring); outline-offset: 3px;
}
.app :is(.nav-icon, .workout-home-icon, .quick-action-icon, .alternative-choice-icon) { color: var(--accent-text); }
.app .agenda-icon { color: var(--accent-text) !important; }
.app .split-row.current { color: var(--accent-text); }
.app :is(.daily-coach, .travel-builder, .training-frequency-help, .week) > summary::after { color: var(--accent-text); }
/* These cards stay dark in either theme. No inherited light-theme surfaces. */
.app :is(.onboarding-main, .hero-main, .today-card, .progress-page-hero) {
  --ink: #f7f8f2; --muted: #c4ccbd; --surface: #10140d;
  --surface-2: #1d2318; --surface-3: #2b3323; --line: #59634c;
  --accent-text: #dfff00; --focus-ring: #91bfff;
  color: #f7f8f2; background-color: #090c07; isolation: isolate;
}
.app :is(.onboarding-main, .hero-main, .today-card, .progress-page-hero)::before,
.app :is(.onboarding-main, .hero-main, .today-card, .progress-page-hero)::after {
  z-index: -1; pointer-events: none;
}
.app .onboarding-main::before { right: -38px; opacity: .16; }
.app .onboarding-main::after { right: -240px; border-color: rgba(255,90,54,.16); }
.app .hero-main::before, .app .today-card::after { right: -18px; opacity: .16; }
.app .hero-main::after, .app .today-card::before { opacity: .35; }
.app :is(.onboarding-main, .hero-main, .today-card, .progress-page-hero) .secondary {
  color: #f7f8f2; background: #1d2318; border-color: #68755a;
}
.app :is(.onboarding-main, .hero-main, .today-card, .progress-page-hero) :is(.eyebrow, .pill) {
  color: #f7f8f2; background: #1d2318; border-color: #59634c;
}
.app .today-topline .eyebrow { color: #10120c; background: #dfff00; border-color: #dfff00; }
.app .start-fact { background: #171d12; border-color: #546146; }
.app .start-fact span { color: #c4ccbd; font-size: 11px; }
.app .onboarding-copy > button { margin: 4px 4px 4px 0; }
.app .onboarding-copy > button:focus-visible { outline-color: #91bfff; }
.app .today-session-kicker span { font-size: 11px; background: #222a1a; }
.app .today-coach-cue, .app .today-meta span, .app .week-day { background-color: #1a2015; }
.app .week-day span { color: #c4ccbd; font-size: 11px; }
.app .week-day b { color: #f7f8f2; font-size: 11px; }
.app .week-day.today b { color: #dfff00; }
.app .workout-segment.done { opacity: 1; background: var(--surface-2); }
html[data-theme="light"] .app .workout-current .station-glyph:not([data-running="true"]) {
  background: #171c13; color: #dfff00;
}
.app .workout-console-head .eyebrow { font-size: 11px; }
.app .status.error { color: var(--red); }
.app .daily-coach .daily-coach-icon { color: var(--brand-ink); }
.app .step-live-copy { display: flex; flex-direction: column; gap: 4px; }
.ec-chart svg text { font-size: 18px; }
html[data-theme="light"] .app :is(input, select, textarea) { border-color: #858f7a; }
html[data-theme="light"] .app .workout-segment.done::after { color: #fff; }
/* Landing page uses the same foreground rule without muting neon buttons. */
body:not(:has(.app)) .micro { color: var(--muted); }
body:not(:has(.app)) .hero-copy { background-color: #090a08; }
body:not(:has(.app)) .hero-copy .micro { color: #c4ccbd; }
body:not(:has(.app)) .hero-copy::before { opacity: .14; }
body:not(:has(.app)) .hero-copy::after { border-color: rgba(255,90,54,.16); }
body:not(:has(.app)) .final::after { opacity: .12; }
html[data-theme="light"] body:not(:has(.app)) :is(.trust b, .week-day > span) { color: var(--accent-text); }
html[data-theme="light"] body:not(:has(.app)) .flow-step::before { color: var(--accent-text); }
body:not(:has(.app)) :is(a, button, summary):focus-visible { outline: 3px solid var(--focus-ring); outline-offset: 3px; }
@media (max-width: 620px) {
  .ec-chart svg text { font-size: 24px; }
  .app .onboarding-copy > button { width: 100%; margin: 4px 0; white-space: normal; }
  .app .onboarding-main::before { right: -80px; opacity: .12; }
  .app .onboarding-main::after { right: -270px; }
}
/* Account menu: one primary action; files and installation stay separate. */
#dataDialog, #appSettingsDialog {
  width: min(600px, calc(100% - 24px));
  max-height: calc(100dvh - 32px);
  padding: 28px;
  overflow-y: auto;
  overscroll-behavior: contain;
}
#dataDialog .dialog-head, #appSettingsDialog .dialog-head { gap: 16px; }
#dataDialog .dialog-head h2, #appSettingsDialog .dialog-head h2 {
  font-size: clamp(26px, 4vw, 34px); line-height: 1.08; margin: 16px 0 0;
}
#dataDialog .dialog-head .icon-button, #appSettingsDialog .dialog-head .icon-button { flex-shrink: 0; width: 44px; height: 44px; }
#dataDialog .menu-intro { color: var(--muted); font-size: 15px; line-height: 1.6; margin: 18px 0 20px; }
.data-account-card, .menu-install-card {
  padding: 22px; border: 1px solid var(--line); background: var(--surface2); border-radius: 16px;
}
.menu-device-icon { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 12px; background: var(--brand); color: var(--brand-ink); margin-bottom: 16px; }
.menu-device-icon svg { width: 32px; height: 32px; }
.data-account-card h3, .menu-install-card h3 { font-size: 20px; line-height: 1.3; margin: 0 0 8px; }
.data-account-card p, .menu-install-card p { font-size: 14px; color: var(--muted); line-height: 1.6; margin: 0 0 18px; }
.data-account-card .primary, .menu-install-card .primary { width: 100%; min-height: 48px; white-space: normal; line-height: 1.3; }
#dataDialog .menu-more { margin: 16px 0 0; padding: 0; border: 1px solid var(--line); background: var(--surface); border-radius: 14px; }
#dataDialog .menu-more > summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 18px; font-size: 15px; font-weight: 750; list-style: none; cursor: pointer; color: var(--ink); }
#dataDialog .menu-more > summary::-webkit-details-marker { display: none; }
#dataDialog .menu-more > summary small { display: block; font-size: 12px; line-height: 1.5; font-weight: 400; color: var(--muted); margin-top: 4px; }
.menu-chevron { font-size: 22px; transition: transform .18s ease; }
.menu-more[open] .menu-chevron { transform: rotate(180deg); }
.menu-file-options { padding: 0 14px 14px; }
#dataDialog .data-option { padding: 16px 4px; border: 0; border-top: 1px solid var(--line); background: transparent; border-radius: 0; grid-template-columns: 34px minmax(0,1fr); gap: 12px; }
#dataDialog .option-icon { width: 32px; height: 32px; font-size: 20px; }
#dataDialog .data-option h3 { font-size: 15px; }
#dataDialog .data-option p { font-size: 13px; line-height: 1.6; }
#dataDialog .data-option button { font-size: 14px; min-height: 44px; }
#dataDialog .menu-file-status { font-size: 13px; line-height: 1.6; color: var(--ink); padding: 12px; background: var(--surface2); border-radius: 8px; margin: 4px 0 0; }
#dataDialog .menu-file-status:empty { display: none; }
.menu-privacy { display: flex; align-items: flex-start; gap: 8px; font-size: 12px; line-height: 1.6; color: var(--muted); margin: 16px 2px; }
.menu-privacy svg { width: 16px; height: 16px; flex-shrink: 0; margin-top: 2px; }
#dataDialog .menu-settings-link { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 16px; text-align: left; border-radius: 12px; background: var(--surface); }
.menu-settings-link b { font-size: 14px; }
.menu-settings-link small { display: block; font-size: 12px; font-weight: 400; color: var(--muted); line-height: 1.5; margin-top: 3px; }
.menu-install-card { margin: 22px 0 16px; }
.menu-app-icon { display: block; margin-bottom: 18px; }
.menu-app-icon img { width: 64px; height: 64px; border-radius: 15px; }
#appSettingsDialog #installHelp { padding: 12px; border-radius: 8px; background: var(--surface); color: var(--ink); }
.menu-back { width: 100%; min-height: 44px; }
@media (max-width: 620px) {
  #dataDialog, #appSettingsDialog { padding: 20px; max-height: calc(100dvh - 24px); }
  .data-account-card, .menu-install-card { padding: 18px; }
  #dataDialog .data-option button { width: 100%; white-space: normal; }
}
@media (prefers-reduced-motion: reduce) { .menu-chevron { transition: none; } }
/* Signed-in account: truthful local/account save status and plain-language choices. */
#cloudDialog.auth-dialog { width: min(600px, calc(100% - 24px)); max-height: calc(100dvh - 32px); padding: 28px; overflow-y: auto; overscroll-behavior: contain; }
#cloudDialog .dialog-head .icon-button { width: 44px; height: 44px; flex-shrink: 0; }
#cloudDialog .dialog-head { position: sticky; top: -20px; z-index: 2; background: var(--surface); padding: 8px 0; }
#cloudDialog .auth-account-badge { padding: 12px; margin-bottom: 16px; background: var(--surface2); }
#cloudDialog .auth-account-badge b { font-size: 14px; }
#cloudDialog .auth-account-badge small { font-size: 12px; line-height: 1.5; }
.account-save-card { display: grid; grid-template-columns: 40px minmax(0,1fr); gap: 14px; padding: 20px; background: var(--surface2); border: 1px solid var(--line); border-radius: 16px; border-left: 4px solid var(--accent-text); }
.account-save-icon { display: grid; place-items: center; width: 40px; height: 40px; color: var(--brand-ink); background: var(--brand); border-radius: 50%; font-size: 22px; font-weight: 800; }
.account-save-label { display: block; color: var(--muted); font-size: 11px; text-transform: uppercase; letter-spacing: .1em; margin-bottom: 8px; }
#cloudDialog .account-save-card h3 { font-size: 21px; line-height: 1.3; margin: 0 0 8px; overflow-wrap: anywhere; }
#cloudDialog .account-save-card p { color: var(--muted); font-size: 14px; line-height: 1.6; margin: 0; }
.account-save-card[data-kind="warning"] { border-left-color: #a57800; }
.account-save-card[data-kind="error"] { border-left-color: #d34839; }
.account-device-save { display: flex; align-items: flex-start; gap: 10px; padding: 16px 2px; }
.account-device-save svg { flex-shrink: 0; width: 20px; height: 20px; color: var(--muted); }
.account-device-save b { display: block; font-size: 13px; }
.account-device-save small { display: block; font-size: 12px; color: var(--muted); line-height: 1.5; margin-top: 3px; }
#cloudSync, #cloudReLogin { width: 100%; min-height: 48px; white-space: normal; }
.account-auto-note { font-size: 12px; line-height: 1.6; color: var(--muted); margin: 10px 2px 18px; }
#cloudDialog .cloud-resolve { border: 1px solid var(--line); background: var(--surface2); padding: 18px; border-radius: 14px; margin: 0 0 18px; }
#cloudDialog .cloud-resolve h3 { font-size: 18px; margin: 0 0 8px; }
#cloudChoiceHelp { font-size: 13px; line-height: 1.6; color: var(--muted); margin: 0 0 14px; }
.account-data-choices { display: grid; gap: 10px; }
#cloudDialog .account-data-choices button { display: block; white-space: normal; width: 100%; text-align: left; padding: 16px; border-radius: 10px; background: var(--surface); }
.account-data-choices b { font-size: 14px; line-height: 1.5; display: block; }
.account-data-choices span { display: block; font-size: 12px; line-height: 1.6; color: var(--muted); font-weight: 400; margin-top: 4px; }
#cloudDialog .account-more { border: 1px solid var(--line); border-radius: 12px; padding: 0; background: var(--surface); }
.account-more > summary { padding: 16px; font-size: 14px; font-weight: 750; min-height: 44px; cursor: pointer; }
.account-more-content { padding: 0 16px 16px; }
.account-more-content > button, .account-previous button { width: 100%; min-height: 44px; font-size: 13px; white-space: normal; }
.account-more-content .muted { font-size: 12px; line-height: 1.6; margin: 8px 0 16px; }
.account-previous { padding: 14px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); margin-bottom: 16px; }
.account-previous summary { font-size: 13px; min-height: 32px; cursor: pointer; }
#cloudDialog:has(#accountSaveCard):has(#cloudAccount:not(.hidden)) #cloudStatus { display: none; }
@media (max-width: 620px) {
  #cloudDialog.auth-dialog { padding: 20px; max-height: calc(100dvh - 24px); }
  .account-save-card { padding: 16px; gap: 10px; grid-template-columns: 32px minmax(0,1fr); }
  .account-save-icon { width: 32px; height: 32px; font-size: 20px; }
  #cloudDialog .account-save-card h3 { font-size: 19px; }
}
/* Progressive explanations: visible tasks, optional context on demand. */
.app .ev-help-source { display: none !important; }
.app .ev-help-button[hidden] { display: none; }
.ev-help-brief { display: inline-block; color: var(--muted); font-size: 12px; line-height: 1.5; padding-top: 6px; }
.ev-help-row { display: flex; gap: 8px; align-items: center; min-width: 0; }
.ev-help-row > :is(h1,h2,h3,label) { min-width: 0; margin-bottom: 0; flex: 0 1 auto; }
.app .ev-help-button { display: inline-grid; place-items: center; flex: 0 0 44px; width: 44px; height: 44px; min-height: 44px; padding: 10px; font-size: 14px; font-style: normal; font-family: ui-serif, Georgia, serif; font-weight: 800; color: var(--muted); background: transparent; border-radius: 50%; line-height: 1; position: relative; }
.ev-help-button::before { content: ''; position: absolute; inset: 11px; border: 1.5px solid currentColor; border-radius: 50%; }
.app .ev-help-button:hover { background: var(--surface2); color: var(--ink); filter: none; }
.ev-help-label-row { min-height: 44px; margin-bottom: 3px; justify-content: space-between; align-items: flex-end; }
.ev-help-label-row label { margin: 0 0 8px; flex: 1; }
.app .field > label { display: flex; align-items: flex-end; min-height: 44px; margin: 0 0 3px; padding-bottom: 8px; }
.progressive-fields > .grid-3 > .field > .ev-help-label-row { grid-row: 1; min-height: 44px; }
.app .progressive-fields > .grid-3 > .field { grid-template-rows: 48px 45px minmax(0,auto); }
.app .progressive-fields > .grid-3 > .field > label { margin-bottom: 3px; }
.app .wizard-panel > .step-intro, .app .input-area > .step-intro, .app #tracker .step-intro, .app .auto-save-note { display: none; }
.app #wizardHint { display: none; }
.app .account-device-save[data-kind="ok"] small { display: none; }
.app .ev-help-dialog { width: min(440px, calc(100% - 24px)); max-height: calc(100dvh - 32px); overflow-y: auto; padding: 24px; background: var(--surface); color: var(--ink); border: 1px solid var(--line); border-radius: 18px; box-shadow: 0 24px 90px rgba(0,0,0,.4); }
.ev-help-dialog::backdrop { background: rgba(0,0,0,.5); }
.ev-help-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; }
.ev-help-head h2 { font-size: 22px; line-height: 1.25; margin: 8px 0 16px; }
.ev-help-close { width: 44px; height: 44px; padding: 0; font-size: 24px; flex-shrink: 0; }
.ev-help-content p { color: var(--muted); font-size: 15px; line-height: 1.65; margin: 0 0 12px; }
.ev-help-content p:last-child { margin-bottom: 0; }
.ev-help-dialog[open] { animation: ev-help-enter .16s ease-out; }
@keyframes ev-help-enter { from { transform: translateY(8px); opacity: .6; } to { transform: translateY(0); opacity: 1; } }
@media (max-width: 620px) { .app .ev-help-dialog { margin: auto auto 12px; padding: 20px; border-radius: 20px; } .ev-help-row { gap: 4px; } }
@media (prefers-reduced-motion: reduce) { .ev-help-dialog[open] { animation: none; } }
/* Consistent training tiles; no automatic blank space above actions. */
.app .ex-training-grid .ex-tile, .app .ex-training-grid .station-round-launch { gap: 12px; }
.app .ex-training-grid .ex-tile > button { min-height: 44px; padding: 8px 12px; margin: 0; font-size: 14px; line-height: 1.4; }
.app .ex-training-grid .ex-optional { margin: 0; padding: 10px 12px; }
.app .ex-training-grid .ex-optional > summary { line-height: 1.4; }
.app .ex-training-grid .ex-planned-name { margin: 0; }
.app .profile-identity { min-width: 0; }
.app .profile-identity > div { min-width: 0; overflow-wrap: anywhere; }
.app #profileAvatar { flex: 0 0 44px; width: 44px; height: 44px; min-width: 44px; aspect-ratio: 1; border-radius: 50%; overflow: hidden; }
.app #profileAvatar img { width: 100%; height: 100%; object-fit: cover; }
.app #profilePanel :is(h2,.mini-card b,.profile-identity b,.achievement-strip b) { color: var(--ink); }
.app .auth-account-badge > span { aspect-ratio: 1; flex-shrink: 0; border-radius: 50%; }
@media (max-width: 620px) {
  .app .profile-summary-grid > .profile-identity { grid-column: 1 / -1; }
  .app .profile-summary-grid > .mini-card:last-child { grid-column: 1 / -1; }
  .app #weeklyCheckin > .grid-3 { gap: 10px; }
  .app #weeklyCheckin .field { margin: 0; }
  .app #weeklyCheckin .field > label { min-height: 0; margin: 0 0 4px; padding: 0; line-height: 1.4; }
  .app #weeklyCheckin .section-head { margin-bottom: 12px; }
  .app #weeklyCheckin > .grid-3 + .grid-3 { margin-top: 14px; }
  .app #weeklyCheckin :is(input,select) { min-height: 44px; }
  .app #weeklyCheckin .actions { margin-top: 14px; }
  .app .daily-coach-body { padding-top: 10px; }
  .app .daily-coach-actions { gap: 10px; margin-top: 10px; }
  .app .ex-training-grid .ex-tile, .app .ex-training-grid .station-round-launch { padding: 14px; gap: 10px; }
  .app .ex-training-grid :is(.ex-glyph,.station-glyph) { grid-column: 1; grid-row: 1; }
  .app .ex-training-grid .ex-tile > .ev-help-row, .app .ex-training-grid .station-round-launch > div { grid-column: 2; grid-row: 1; }
  .app .ex-training-grid .ex-tile > button, .app .ex-training-grid .ex-tile > details, .app .ex-training-grid .ex-planned-name { grid-column: 1 / -1; }
}
/* Landing: short invitations, working examples and details on demand. */
.landing .hero { padding: 40px 0 12px; gap: 20px; }
.landing .hero-copy { padding: 32px; }
.landing h1 { font-size: clamp(46px,6.2vw,78px); }
.landing .hero-copy .lead { font-size: 16px; max-width: 42ch; line-height: 1.6; }
.landing .app-preview { min-height: 0; padding: 22px; }
.landing .section { padding: 44px 0; scroll-margin-top: 100px; }
.landing .section-head { grid-template-columns: 1fr; margin-bottom: 20px; }
.landing .section-head h2 { margin-top: 14px; }
.landing .entry-grid, .landing .features { gap: 14px; }
.landing .entry-card { min-height: 0; padding: 22px; display: flex; flex-direction: column; gap: 12px; }
.landing .entry-card :is(h3,p), .landing .entry-icon { margin: 0; }
.landing .entry-card .btn { margin-top: auto; }
.landing .entry-card p { font-size: 14px; }
.landing .feature { min-height: 0; padding: 22px; }
.landing .feature p { font-size: 14px; margin: 8px 0 0; }
.landing .feature-num { margin-bottom: 14px; }
.landing .week-demo { align-items: start; padding: 28px; gap: 24px; }
.landing .week-copy p, .landing #install p { font-size: 15px; color: var(--muted); }
.landing .landing-details { border: 1px solid var(--line); border-radius: 12px; background: var(--surface); padding: 0; margin-top: 16px; }
.landing .landing-details > summary { display: flex; justify-content: space-between; align-items: center; gap: 12px; min-height: 48px; padding: 14px 16px; list-style: none; cursor: pointer; font-weight: 750; font-size: 14px; line-height: 1.5; }
.landing .landing-details > summary::-webkit-details-marker { display: none; }
.landing .landing-details > summary > span { flex-shrink: 0; transition: transform .15s ease; }
.landing .landing-details[open] > summary > span { transform: rotate(45deg); }
.landing .landing-details > :not(summary) { margin: 0 16px 16px; }
.landing .landing-details > p { color: var(--muted); font-size: 14px; line-height: 1.65; }
.landing .landing-inline-details { margin-top: 14px; border-top: 1px solid var(--line); }
.landing .landing-inline-details > summary { min-height: 44px; padding: 12px 0; cursor: pointer; font-size: 13px; font-weight: 750; }
.landing .landing-inline-details p { margin: 0 0 8px; color: var(--muted); line-height: 1.65; }
.landing .example-disclosure { margin: 0; }
.landing .week-day { padding: 12px 0; font-size: 13px; }
.landing .week-day b { line-height: 1.45; }
.landing .flow { padding: 12px 0; }
.landing .flow-step { padding: 14px 10px; }
.landing .flow-step h3 { font-size: 16px; }
.landing .flow-step p { font-size: 13px; }
.landing .landing-faq { max-width: 900px; }
.landing .landing-faq .landing-details { margin-top: 10px; scroll-margin-top: 100px; }
.landing .install { align-items: start; padding: 28px; gap: 24px; }
.landing .install-panel { padding: 0; background: transparent; }
.landing .install-panel .landing-details { margin-top: 0; }
.landing .install-panel ol { padding-left: 22px; font-size: 14px; line-height: 1.6; }
.landing .install-panel li { margin-bottom: 10px; }
.landing .final { padding: 32px; margin-top: 20px; }
.landing .final h2 { margin: 16px 0 22px; }
.landing .preview-caption { font-size: 12px; }
@media (max-width: 620px) {
  .landing .hero { padding-top: 24px; gap: 14px; }
  .landing .hero-copy { padding: 24px; }
  .landing .cta { display: grid; grid-template-columns: 1fr; gap: 10px; margin-top: 20px; }
  .landing .btn { min-height: 44px; padding: 9px 12px; white-space: normal; text-align: center; font-size: 14px; }
  .landing .section { padding: 28px 0; }
  .landing .entry-card, .landing .feature { padding: 18px; }
  .landing .entry-card .btn { width: 100%; }
  .landing .week-demo, .landing .install { padding: 20px; gap: 18px; }
  .landing .week-demo .example-disclosure { width: 100%; }
  .landing .week-day { grid-template-columns: 28px minmax(0,1fr); gap: 8px; }
  .landing .week-day small { grid-column: 2; }
  .landing .final { padding: 24px; }
  .landing .final h2 { font-size: 34px; }
}
/* v29 controls: calm spacing, dependable touch areas and a filled active tab. */
.app button:not(.calendar-event) { min-width: 44px; min-height: 44px; line-height: 1.35; }
.app summary { min-height: 44px; }
.app .status[data-kind="ok"] { color: var(--green); }
.app .status[data-kind="error"], .app .storage-status[data-kind="error"] { color: var(--red); }
.app .dashboard-home > *, .app .dashboard-insights > * { min-width: 0; }
.app .dashboard-quickbar { grid-template-columns: repeat(3,minmax(0,1fr)); }
.app .dashboard-insights { grid-template-columns: minmax(0,.9fr) minmax(0,1.1fr); }
.app .dashboard-mini-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
.app .calendar-event { min-height: 44px; }
.app :is(.actions,.plan-toolbar,.profile-actions,.progress-page-actions,.daily-coach-actions,.alternative-actions,.alternative-complete-actions,.agenda-actions,.ex-actions) { gap: 10px; }
.app :is(.profile-actions,.progress-page-actions,.plan-toolbar,.actions,.agenda-actions) > button { padding: 10px 14px; white-space: normal; }
.app :is(.segmented button,.auth-tabs button,.auth-link,.weekday-choice,.small-btn,.time-quick-actions button,.workout-step-chip) { min-height: 44px; }
.app :is(.icon-button,.workout-clock button) { width: 44px; min-width: 44px; height: 44px; padding: 0; }
.app .app-nav { gap: 6px; padding: 6px; border-radius: 18px; }
.app .app-nav button { min-height: 48px; padding: 10px 12px; border-radius: 12px; color: var(--muted); font-size: 12px; line-height: 1.3; letter-spacing: 0; text-transform: none; transition: background-color .16s ease, color .16s ease; }
.app .app-nav button .nav-icon { color: var(--muted); line-height: 1; }
.app .app-nav button:hover { background: var(--surface-2); transform: none; filter: none; }
.app .app-nav button.active, .app .app-nav button.active:hover { color: var(--brand-ink); background: var(--brand); box-shadow: none; }
.app .app-nav button.active .nav-icon { color: var(--brand-ink); }
.app .app-nav button.active::after { content: none; }
.app .workout-step-chip { padding: 9px 12px; font-size: 11px; }
.app :is(.time-editor > summary,.split-overview > summary,.workout-session-options > summary,.finish-note > summary,.round-spec > summary,.workout-alt-start > summary,.account-previous > summary) { min-height: 44px; display: flex; align-items: center; }
.app .ex-optional { padding: 0; }
.app .ex-optional > summary { min-height: 44px; display: flex; align-items: center; padding: 10px 12px; line-height: 1.4; }
.app .ex-optional[open] > summary { margin: 0; }
.app .ex-optional > :not(summary) { margin-left: 12px; margin-right: 12px; }
.app .ex-optional > :last-child:not(summary) { margin-bottom: 12px; }
.app .ex-training-grid .ex-optional { padding: 0; }
.app .ex-training-grid .ex-optional > summary { padding: 10px 12px; }
.app .profile-actions > button, .app .agenda-actions > button { align-self: stretch; }
.app .auth-confirm { min-height: 44px; }
@media (max-width: 620px) {
  .app .topbar { grid-template-columns: 34px minmax(0,1fr) auto; gap: 5px; padding: 6px; }
  .app .profile-bar { gap: 4px; }
  .app .profile-bar select { flex: 1 1 auto; min-width: 0; min-height: 44px; padding: 6px; }
  .app .profile-bar .primary, .app .top-actions .icon-button { flex: 0 0 44px; width: 44px; min-width: 44px; min-height: 44px; height: 44px; }
  .app .app-nav { left: 10px; right: 10px; bottom: calc(10px + env(safe-area-inset-bottom, 0px)); gap: 4px; padding: 6px; }
  .app .app-nav button { min-height: 54px; padding: 7px 2px; gap: 4px; font-size: 10px; border-radius: 12px; }
  .app .app-nav .nav-icon { font-size: 19px; }
  body.app-ready .app { padding-bottom: calc(96px + env(safe-area-inset-bottom, 0px)); }
  body.app-ready footer { padding-bottom: 24px; }
  .app :is(.actions,.plan-toolbar,.profile-actions,.progress-page-actions,.daily-coach-actions,.alternative-actions,.alternative-complete-actions,.agenda-actions,.ex-actions) { gap: 8px; }
  .app :is(.actions,.plan-toolbar,.profile-actions,.progress-page-actions,.agenda-actions) > button { padding: 9px 10px; font-size: 13px; }
  .app .plan-toolbar { display: grid; grid-template-columns: 1fr 1fr; width: 100%; }
  .app .plan-toolbar > .primary { grid-column: 1 / -1; }
  .app .wizard-controls { gap: 8px; padding: 10px; }
  .app .wizard-controls button { min-height: 48px; padding: 10px 14px; }
  .app .weekday-picker { grid-template-columns: repeat(4,minmax(0,1fr)); gap: 6px; }
  .app .dashboard-quickbar { grid-template-columns: 1fr 1fr; }
  .app .workout-console-head { grid-template-columns: 44px minmax(0,1fr) auto; }
  .app .workout-home { width: 44px; min-width: 44px; height: 44px; min-height: 44px; }
  .app .workout-clock { min-width: 109px; }
  .app .workout-step-rail { gap: 6px; margin-bottom: 8px; }
  .app .workout-step-chip { padding: 8px 10px; font-size: 10px; }
  .app .workout-current { padding: 18px 14px; gap: 10px; }
  .app .workout-current .station-glyph { width: 64px; height: 64px; }
  .app .step-live { gap: 6px; margin-top: 14px; }
  .app .time-editor { margin-top: 12px; }
  .app .workout-step-nav { bottom: calc(8px + env(safe-area-inset-bottom, 0px)); grid-template-columns: 44px minmax(0,1fr) 82px; gap: 6px; padding: 6px; }
  .app .workout-step-nav button { min-height: 48px; padding: 8px 5px; }
  .app .workout-step-nav .primary { font-size: 12px; }
  .app #workoutPanel.is-live .workout-console { padding-bottom: calc(88px + env(safe-area-inset-bottom, 0px)); }
  .app .agenda-actions { grid-template-columns: 1fr 1fr; }
  .app .agenda-actions > .primary { grid-column: 1 / -1; min-height: 48px; }
  .app .agenda-head-actions button { min-height: 44px; font-size: 11px; padding: 8px 10px; }
  .app .calendar-tools { gap: 8px; }
  .app .calendar-tools input { min-height: 44px; }
  .app .calendar-weekdays, .app .calendar-grid:not(.week-mode) { margin-left: -16px; margin-right: -16px; }
  .app .calendar-grid:not(.week-mode) .calendar-event { min-height: 8px; }
  .app .calendar-grid.week-mode .calendar-day { min-height: 60px; }
  .app .calendar-grid.week-mode .calendar-event { min-height: 44px; padding: 10px 8px; font-size: 12px; color: var(--ink); background: var(--surface); border-left: 3px solid var(--accent-text); }
  .app .calendar-grid.week-mode .calendar-event.easy { border-left-color: var(--green); }
  .app .calendar-grid.week-mode .calendar-event.hard { border-left-color: var(--orange); }
  .app .calendar-grid.week-mode .calendar-event.hybrid { border-left-color: var(--blue); }
  .app .calendar-grid:not(.week-mode) .calendar-event { pointer-events: none; }
  .app .alternative-choice { min-height: 88px; padding: 10px; gap: 4px; }
  .app .alternative-choice-icon { width: 30px; height: 30px; }
  .app .ex-training-hub .ex-tool-row { padding-top: 16px; gap: 8px; }
  .app .ex-training-hub .ex-tool-row button { padding: 9px 10px; }
  .app .ex-resume, .app .ex-receipt { padding: 14px; gap: 10px; }
  .app .finish-feeling-picker .rpe-choice { min-height: 54px; padding: 8px 10px; }
  .app #cloudDialog .auth-tabs { margin-bottom: 14px; }
  .app #cloudDialog .field { margin-bottom: 12px; }
}
@media (prefers-reduced-motion: reduce) { .app .app-nav button { transition: none; } }
@media (hover: none) { .app button:hover { transform: none; filter: none; } }
/* v29: goal selection and private comparison use the same compact control rhythm. */
.app .goal-mode-picker { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; margin: 0 0 20px; }
.app .goal-mode-choice { min-height: 76px; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 4px; padding: 14px 16px; background: var(--surface-2); color: var(--ink); border: 1px solid var(--line); border-radius: 14px; text-align: left; font-size: 14px; }
.app .goal-mode-choice > span { font-size: 12px; color: var(--muted); font-weight: 500; }
.app .goal-mode-choice.active { background: var(--brand); color: var(--brand-ink); border-color: var(--brand); box-shadow: none; }
.app .goal-mode-choice.active > span { color: var(--brand-ink); }
.app .adapt-review-banner { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 12px; align-items: center; border: 1px solid var(--line); border-left: 4px solid var(--accent-text); background: var(--surface); padding: 14px 16px; border-radius: 14px; margin: 14px 0; }
.app .adapt-review-banner > div { display: grid; gap: 4px; min-width: 0; }
.app :is(.adapt-review-dialog,.cmp-dialog) { width: min(700px,calc(100% - 24px)); max-height: 88dvh; padding: 24px; border-radius: 20px; color: var(--ink); background: var(--surface); border: 1px solid var(--line); }
.app :is(.adapt-review-dialog,.cmp-dialog) h2 { font-size: clamp(22px,4vw,30px); line-height: 1.15; }
.app :is(.adapt-review-dialog,.cmp-dialog) .dialog-head,
.app .cmp-dialog .ex-dialog-head { align-items: flex-start; gap: 12px; }
.app .cmp-dialog .ex-dialog-head, .app .adapt-review-dialog .dialog-head { position: sticky; top: -24px; padding: 12px 0; background: var(--surface); z-index: 2; }
.app :is(.adapt-review-dialog,.cmp-dialog) .dialog-head > button,
.app .cmp-dialog .ex-close { flex: 0 0 44px; width: 44px; height: 44px; padding: 0; }
.app :is(.adapt-review-actions,.cmp-actions) { display: flex; flex-wrap: wrap; gap: 10px; margin: 14px 0; }
.app :is(.adapt-review-actions,.cmp-actions) > button { min-height: 44px; padding: 10px 14px; }
.app .adapt-review-change { display: grid; gap: 6px; border: 1px solid var(--line); background: var(--surface-2); border-radius: 12px; padding: 14px; margin: 10px 0; }
.app .adapt-review-before { color: var(--muted); }
.app .adapt-review-change > strong { color: var(--ink); }
.app .adapt-review-change > small { color: var(--muted); }
.app .adapt-review-history { margin-top: 14px; border-top: 1px solid var(--line); }
.app .adapt-review-history > summary { display: flex; align-items: center; min-height: 44px; cursor: pointer; }
.app .adapt-review-history-row { display: grid; gap: 6px; margin-top: 10px; padding: 12px; background: var(--surface-2); border-radius: 12px; border: 1px solid var(--line); }
.app .adapt-review-history-row > small { color: var(--muted); }
.app .adapt-review-history-row > button { justify-self: start; }
.app .alternative-actual-values { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; align-items: start; margin: 14px 0; }
.app .alternative-actual-values .field { min-width: 0; }
.app .alternative-actual-values label { display: block; min-height: 38px; font-size: 13px; margin: 0 0 6px; }
.app .cmp-verification { display: inline-block; color: var(--ink); background: var(--surface-2); border: 1px solid var(--line); border-radius: 99px; padding: 8px 12px; font-size: 12px; font-weight: 750; margin: 8px 0; }
.app .cmp-fields { display: grid; grid-template-columns: minmax(0,1.5fr) minmax(0,1fr); gap: 10px; margin-top: 12px; }
.app .cmp-field { display: grid; gap: 6px; margin: 12px 0; font-size: 13px; color: var(--ink); }
.app .cmp-field > input, .app .cmp-field > select { min-width: 0; min-height: 44px; width: 100%; font-size: 14px; }
.app .cmp-checkbox { grid-template-columns: minmax(0,1fr) 24px; align-items: center; min-height: 44px; gap: 10px; cursor: pointer; font-weight: 600; }
.app .cmp-checkbox > input { width: 22px; min-width: 22px; height: 22px; min-height: 22px; accent-color: var(--brand); }
.app .cmp-standards { margin: 10px 0; }
.app .cmp-standard-row { display: flex; justify-content: space-between; gap: 12px; padding: 8px 0; border-bottom: 1px solid var(--line); font-size: 12px; color: var(--ink); }
.app .cmp-standard-row > b { flex-shrink: 0; font-variant-numeric: tabular-nums; }
.app .cmp-status { min-height: 0; color: var(--muted); }
.app .cmp-status:empty { display: none; }
.app .cmp-error { color: var(--red); }
.app .cmp-board { display: grid; gap: 12px; margin-top: 14px; }
.app .cmp-group { padding: 16px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface-2); }
.app .cmp-group h3 { margin: 0 0 4px; font-size: 16px; }
.app .cmp-group p { margin: 4px 0 10px; font-size: 12px; }
.app .cmp-group-note { color: var(--muted); }
.app .cmp-ranking { list-style: none; margin: 0; padding: 0; }
.app .cmp-rank-row { display: grid; grid-template-columns: 30px minmax(0,1fr) auto; gap: 10px; align-items: center; min-height: 60px; padding: 10px 0; border-top: 1px solid var(--line); }
.app .cmp-rank { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; color: var(--brand-ink); background: var(--brand); font-size: 13px; font-weight: 800; }
.app .cmp-rank-copy { display: grid; gap: 4px; min-width: 0; overflow-wrap: anywhere; }
.app .cmp-rank-copy > b { font-size: 14px; }
.app .cmp-rank-copy > span { font-size: 11px; }
.app .cmp-time { font-size: 19px; color: var(--ink); font-variant-numeric: tabular-nums; white-space: nowrap; }
.app .cmp-manage-row { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 10px 0; border-top: 1px solid var(--line); }
.app .cmp-standard-row > span, .app .cmp-group p, .app .cmp-manage-row > span { min-width: 0; overflow-wrap: anywhere; }
.app .cmp-manage-row > button { flex-shrink: 0; }
.app #planAdaptationStatus:empty { display: none; }
.app .session-completion { display: grid; place-items: center; width: 44px; min-height: 44px; margin: 0; cursor: pointer; }
.app .session-completion input { width: 20px; height: 20px; min-height: 20px; margin: 0; }
/* v30: private online groups, with progressive disclosure and clear consent. */
.app .grp-dialog { width: min(760px,calc(100% - 24px)); max-height: 88dvh; overflow: auto; padding: 24px; background: var(--surface); color: var(--ink); border: 1px solid var(--line); border-radius: 20px; }
.app .grp-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; position: sticky; top: -24px; padding: 12px 0; background: var(--surface); z-index: 3; }
.app .grp-head > div { min-width: 0; }
.app .grp-head h2 { font-size: clamp(23px,4vw,30px); line-height: 1.15; margin: 8px 0; }
.app .grp-head > button { width: 44px; min-width: 44px; height: 44px; flex-shrink: 0; padding: 0; }
.app .grp-status { color: var(--muted); font-size: 13px; line-height: 1.5; margin: 12px 0; }
.app .grp-status:empty { display: none; }
.app .grp-status.grp-error { color: var(--red); }
.app .grp-gate, .app .grp-empty { padding: 16px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface-2); }
.app .grp-gate p { font-size: 14px; color: var(--muted); }
.app .grp-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; margin: 12px 0; }
.app .grp-group-choice { display: flex; flex-direction: column; align-items: flex-start; text-align: left; gap: 6px; min-height: 76px; padding: 14px; width: 100%; background: var(--surface-2); color: var(--ink); border: 1px solid var(--line); border-radius: 14px; white-space: normal; overflow-wrap: anywhere; }
.app .grp-group-choice.active, .app .grp-group-choice[aria-pressed="true"] { border-color: var(--accent-text); background: var(--surface-2); color: var(--ink); box-shadow: inset 3px 0 var(--accent-text); }
.app .grp-group-choice > b, .app .grp-group-title { font-size: 16px; }
.app .grp-group-choice > span { font-size: 12px; color: var(--muted); }
.app .grp-fields { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; align-items: start; }
.app .grp-field { display: grid; gap: 6px; min-width: 0; margin: 12px 0; color: var(--ink); font-size: 13px; font-weight: 650; }
.app .grp-field > :is(input,select) { min-width: 0; width: 100%; min-height: 44px; font-size: 16px; }
.app .grp-checkbox { display: grid; grid-template-columns: 24px minmax(0,1fr); align-items: center; gap: 10px; min-height: 44px; cursor: pointer; }
.app .grp-checkbox input { width: 22px; min-width: 22px; height: 22px; min-height: 22px; margin: 0; accent-color: var(--brand); }
.app .grp-checkbox > input { grid-column: 1; grid-row: 1; }
.app .grp-checkbox > span { grid-column: 2; grid-row: 1; min-width: 0; overflow-wrap: anywhere; }
.app .grp-actions { display: flex; flex-wrap: wrap; gap: 10px; margin: 14px 0; }
.app .grp-actions > button { padding: 10px 14px; min-height: 44px; font-size: 14px; white-space: normal; }
.app .grp-detail { border-top: 1px solid var(--line); padding-top: 16px; margin-top: 16px; }
.app .grp-subhead { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.app .grp-subhead h3 { margin: 0; font-size: 21px; min-width: 0; overflow-wrap: anywhere; }
.app .grp-subhead > button { flex-shrink: 0; }
.app .grp-settings { margin: 14px 0; border: 1px solid var(--line); border-radius: 13px; background: var(--surface-2); padding: 0; }
.app .grp-settings > summary { min-height: 44px; display: flex; align-items: center; padding: 12px; font-size: 14px; font-weight: 700; cursor: pointer; list-style: none; }
.app .grp-settings > summary::after { content: '+'; margin-left: auto; font-size: 20px; line-height: 1; padding-left: 12px; }
.app .grp-settings[open] > summary::after { content: '−'; }
.app .grp-settings > summary::-webkit-details-marker { display: none; }
.app .grp-settings > :not(summary) { margin-left: 12px; margin-right: 12px; }
.app .grp-settings > :last-child:not(summary) { margin-bottom: 12px; }
.app .grp-verification { display: inline-block; color: var(--ink); background: var(--surface-2); border: 1px solid var(--line); border-radius: 99px; padding: 7px 11px; font-size: 12px; font-weight: 700; margin: 12px 0; }
.app .grp-board { display: grid; gap: 12px; }
.app .grp-board-group { border: 1px solid var(--line); border-radius: 14px; padding: 16px; background: var(--surface-2); min-width: 0; }
.app .grp-board-group h3 { font-size: 16px; margin: 0 0 6px; }
.app .grp-board-group p { font-size: 12px; color: var(--muted); overflow-wrap: anywhere; }
.app .grp-ranking { list-style: none; margin: 0; padding: 0; }
.app .grp-rank-row { display: grid; grid-template-columns: 30px minmax(0,1fr) auto; align-items: center; gap: 10px; min-height: 58px; padding: 10px 0; border-top: 1px solid var(--line); }
.app .grp-rank { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: var(--brand); color: var(--brand-ink); font-size: 13px; font-weight: 800; }
.app .grp-rank-copy { display: grid; gap: 4px; min-width: 0; overflow-wrap: anywhere; }
.app .grp-rank-copy b { font-size: 14px; }
.app .grp-rank-copy small { font-size: 11px; color: var(--muted); }
.app .grp-time { font-size: 19px; font-variant-numeric: tabular-nums; color: var(--ink); white-space: nowrap; }
.app .grp-management-row, .app .grp-invite-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 0; border-top: 1px solid var(--line); }
.app :is(.grp-management-row,.grp-invite-row) > :not(button) { min-width: 0; overflow-wrap: anywhere; }
.app :is(.grp-management-row,.grp-invite-row) > button { flex-shrink: 0; }
.app .grp-invite-code { display: block; width: 100%; min-width: 0; font-size: 16px; padding: 10px; min-height: 44px; overflow-wrap: anywhere; }
.app #groupsInvitePane { display: block; }
.app #groupsDialog [hidden], .app #groupsResultShare[hidden] { display: none !important; }
@media(max-width:620px) {
  .app .grp-dialog { padding: 16px; }
  .app .grp-head { top: -16px; }
  .app .grp-list, .app .grp-fields { grid-template-columns: 1fr; gap: 8px; }
  .app .grp-group-choice { min-height: 64px; padding: 12px; }
  .app .grp-actions { gap: 8px; }
  .app .grp-actions > button { flex: 1 1 auto; padding: 9px 12px; }
  .app .grp-board-group { padding: 12px; }
  .app .grp-field { margin: 8px 0; }
}
@media (max-width:620px) {
  .app .goal-mode-picker { gap: 8px; margin-bottom: 14px; }
  .app .session-completion { grid-row: 1 / span 2; }
  .app .goal-mode-choice { min-height: 88px; padding: 12px; font-size: 13px; }
  .app .goal-mode-choice > span { font-size: 11px; }
  .app .adapt-review-banner { grid-template-columns: 1fr; gap: 10px; padding: 12px; }
  .app .adapt-review-banner > button { justify-self: start; }
  .app :is(.adapt-review-dialog,.cmp-dialog) { padding: 16px; }
  .app .cmp-dialog .ex-dialog-head, .app .adapt-review-dialog .dialog-head { top: -16px; }
  .app .cmp-field > input, .app .cmp-field > select { font-size: 16px; }
  .app .adapt-review-actions { display: grid; grid-template-columns: 1fr; gap: 8px; }
  .app :is(.cmp-fields,.alternative-actual-values) { grid-template-columns: 1fr; gap: 0; }
  .app .alternative-actual-values label { min-height: 0; }
  .app .cmp-fields .cmp-field { margin: 8px 0; }
  .app .cmp-actions > button { width: 100%; }
  .app .cmp-group { padding: 12px; }
}
/* v31: compact training surfaces; visual size stays separate from the touch area. */
.app .profile-danger { padding: 0; border-radius: 12px; background: var(--surface); }
.app .profile-danger > summary {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  min-height: 44px; padding: 10px 12px; color: var(--ink); font-size: 13px;
  font-weight: 700; line-height: 1.35; list-style: none;
}
.app .profile-danger > summary::-webkit-details-marker { display: none; }
.app .profile-danger > summary::after { content: '+'; flex: 0 0 18px; font-size: 20px; line-height: 1; text-align: center; color: var(--muted); }
.app .profile-danger[open] > summary::after { content: '−'; }
.app .profile-danger.profile-manage > summary::after,
.app .profile-danger.profile-manage[open] > summary::after { content: none; }
.app .profile-manage-chevron { display: grid; place-items: center; flex: 0 0 20px; width: 20px; height: 20px; color: var(--muted); font-size: 18px; line-height: 1; transition: transform .15s ease; }
.app .profile-manage[open] .profile-manage-chevron { transform: rotate(180deg); }
.app .profile-danger > div { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0 12px 12px; }
.app .profile-danger > div > button { min-height: 44px; padding: 9px 12px; font-size: 13px; line-height: 1.35; white-space: normal; }
.app .today-card .hero-actions { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; max-width: 580px; margin-top: 16px; }
.app .today-card .hero-actions > button { min-width: 0; min-height: 48px; height: 100%; margin: 0; padding: 10px 14px; font-size: 14px; line-height: 1.35; white-space: normal; }
.app .today-card .hero-actions > [hidden] { display: none !important; }
.app #plan .week { padding: 10px 12px; margin: 10px 0; border-radius: 13px; }
.app #plan .week > .week-head { min-height: 44px; gap: 8px; margin: 0; padding: 2px 0; }
.app #plan .week-head h3 { font-size: 16px; line-height: 1.3; }
.app #plan .week-meta { gap: 5px; }
.app #plan .week-meta .pill { padding: 5px 8px; font-size: 10px; line-height: 1.25; }
.app #plan .week-insight { margin: 8px 0 2px; padding: 8px 10px; font-size: 12px; line-height: 1.45; }
.app #plan details.week-insight { padding: 0 10px; }
.app #plan details.week-insight > summary { display: flex; align-items: center; min-height: 44px; padding: 8px 0; }
.app #plan details.week-insight > p { margin: 0 0 10px; }
.app #plan .session { margin-top: 6px; border-radius: 10px; }
.app #plan .session > summary { min-height: 44px; gap: 6px 8px; padding: 6px 8px; grid-template-columns: 44px 74px minmax(0,1fr) auto; }
.app #plan .session-title { font-size: 13px; line-height: 1.35; overflow-wrap: anywhere; }
.app #plan .session-date { font-size: 11px; line-height: 1.3; }
.app #plan .session-tag { padding: 4px 6px; font-size: 10px; line-height: 1.3; }
.app #plan .session.done { opacity: 1; }
.app #plan .session.done .session-title { color: var(--muted); }
.app #plan .session-body { padding: 4px 12px 12px 60px; font-size: 13px; line-height: 1.45; }
.app #plan .session-body > label { margin-bottom: 6px; font-size: 12px; line-height: 1.4; }
.app #plan .session-body > button { min-height: 44px; padding: 9px 12px; font-size: 13px; }
.app #plan .check-row { gap: 8px; font-size: 13px; line-height: 1.35; }
.app #plan .check-row > label { min-height: 44px; }
.app .week-summary { padding: 9px 11px; font-size: 12px; line-height: 1.45; border-radius: 10px; }
.app .calendar-agenda { margin-top: 12px; padding: 12px; border-radius: 14px; background: var(--surface-2); }
.app .agenda-head { gap: 8px; margin-bottom: 8px; }
.app .agenda-head > div { min-width: 0; }
.app .agenda-head h3 { font-size: 16px; line-height: 1.3; }
.app .agenda-head .small { font-size: 11px; line-height: 1.4; }
.app .agenda-head-actions { gap: 8px; }
.app .agenda-head-actions .pill { font-size: 10px; padding: 6px 8px; }
.app .agenda-list { gap: 8px; }
.app .agenda-item { padding: 10px 12px; gap: 10px; grid-template-columns: 36px minmax(0,1fr) auto; border-radius: 11px; box-shadow: none; }
.app .agenda-icon { width: 36px; height: 36px; font-size: 18px !important; border-radius: 10px; }
.app .agenda-copy b { font-size: 13px; line-height: 1.35; }
.app .agenda-copy span { font-size: 11px; line-height: 1.4; margin-top: 3px; }
.app .agenda-type { font-size: 10px !important; line-height: 1.3; }
.app .agenda-actions { grid-template-columns: repeat(2,minmax(0,1fr)); align-items: start; gap: 8px; }
.app .agenda-actions > button { align-self: start; width: 100%; min-height: 44px; padding: 8px 10px; font-size: 12px; line-height: 1.35; }
.app .agenda-item.done { opacity: 1; }
.app .calendar-day { min-height: 86px; padding: 6px; border-radius: 8px; }
.app .calendar-day.outside { opacity: 1; background: var(--surface); border-style: dashed; }
.app .calendar-number { font-size: 12px; line-height: 1.25; margin-bottom: 4px; }
.app .calendar-grid.week-mode .calendar-day { min-height: 118px; }
.app .calendar-weekdays { font-size: 12px; line-height: 1.3; }
.app #tracker :is(.adaptation-card,.tracker-status-card) { min-height: 0; grid-template-columns: 36px minmax(0,1fr); gap: 10px; padding: 13px; border-radius: 13px; border-left-width: 4px; background: var(--surface-2); box-shadow: none; }
.app #tracker .advice-icon { width: 36px; height: 36px; flex-shrink: 0; }
.app #tracker .advice-label { margin-bottom: 4px; font-size: 10px; line-height: 1.35; letter-spacing: .04em; }
.app #tracker :is(.adaptation-card,.tracker-status-card) b { font-size: 16px; line-height: 1.3; }
.app #tracker :is(.adaptation-card,.tracker-status-card) p { margin: 4px 0 0; font-size: 13px; line-height: 1.45; }
.app .progress-snapshot { position: relative; padding: 13px; border-radius: 14px; box-shadow: none; }
.app .progress-snapshot-head { gap: 8px; padding-right: 36px; }
.app .progress-snapshot-head > div { min-width: 0; }
.app .progress-snapshot-head h3 { font-size: 16px; line-height: 1.3; }
.app .progress-snapshot-head span { font-size: 11px; line-height: 1.35; }
.app .progress-snapshot-head > span { flex-shrink: 0; max-width: 38%; text-align: right; }
.app .progress-kpis { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 6px; margin-top: 10px; }
.app .progress-kpi { padding: 8px; min-width: 0; border-radius: 9px; }
.app .progress-kpi span { font-size: 10px; line-height: 1.35; letter-spacing: .02em; overflow-wrap: anywhere; }
.app .progress-kpi b { margin-top: 3px; font-size: 20px; line-height: 1.3; font-variant-numeric: tabular-nums; }
.app .progress-snapshot .form-trend { height: 40px; margin-top: 10px; }
.app .progress-snapshot .form-bar::after { font-size: 9px; bottom: -15px; }
.app .progress-insight { font-size: 12px; line-height: 1.45; margin-top: 20px; padding-top: 8px; }
.app :is(.dialog-head,.ex-dialog-head) > :is(.icon-button,.ex-close) { flex: 0 0 44px; width: 44px; min-width: 44px; height: 44px; min-height: 44px; padding: 0; }
.app .ex-result-primary-actions { display: flex; flex-wrap: wrap; align-items: stretch; gap: 8px; }
.app .ex-result-primary-actions > button { min-height: 44px; padding: 9px 12px; font-size: 13px; line-height: 1.35; white-space: normal; }
.app .ex-result-primary-actions > [hidden] { display: none !important; }
.app .day-preview-dialog { width: min(680px,calc(100% - 24px)); max-height: calc(100dvh - 32px); padding: 20px; border-radius: 18px; overflow: auto; overscroll-behavior: contain; }
.app .day-preview-dialog .dialog-head { gap: 12px; align-items: flex-start; margin-bottom: 12px; }
.app .day-preview-dialog .dialog-head h2 { margin: 8px 0 0; font-size: clamp(22px,4vw,28px); line-height: 1.2; }
.app .day-preview-agenda .agenda-item { grid-template-columns: 36px minmax(0,1fr); }
.app .day-preview-agenda .agenda-actions { grid-column: 1 / -1; width: 100%; }
.app .day-preview-actions { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; margin-top: 12px; }
.app .day-preview-actions > button { min-height: 44px; padding: 9px 12px; font-size: 13px; line-height: 1.35; white-space: normal; }
.app .agenda-detail { grid-column: 1 / -1; width: 100%; border-top: 1px solid var(--line); color: var(--ink); font-size: 12px; line-height: 1.45; }
.app .agenda-detail > summary { display: flex; align-items: center; min-height: 44px; padding: 8px 0; font-weight: 700; cursor: pointer; }
.app .agenda-detail > :not(summary) { margin: 0 0 8px; color: var(--muted); }
.app .agenda-move { min-width: 0; border: 1px solid var(--line); border-radius: 8px; background: var(--surface-2); }
.app .agenda-move > summary { display: flex; align-items: center; justify-content: center; min-height: 44px; padding: 8px 10px; color: var(--ink); font-size: 12px; line-height: 1.35; font-weight: 750; cursor: pointer; list-style: none; }
.app .agenda-move > summary::-webkit-details-marker { display: none; }
.app .agenda-move > summary::after { content: '+'; margin-left: 6px; font-size: 15px; line-height: 1; }
.app .agenda-move[open] > summary::after { content: '−'; }
.app .agenda-move .reschedule-control { margin: 0 3px 6px; padding: 0; border: 0; border-radius: 7px; }
.app .agenda-move input { width: 100%; min-width: 0; min-height: 44px; padding: 6px 4px; font-size: 16px; font-weight: 600; }
.app :is(.tracker-status-card,#progressTrainingStatus) { min-height: 0; display: grid; grid-template-columns: 36px minmax(0,1fr); align-items: center; gap: 10px; padding: 13px; border-radius: 13px; border: 1px solid var(--line); border-left-width: 4px; background: var(--surface-2); box-shadow: none; }
.app :is(.tracker-status-card,#progressTrainingStatus) .advice-icon { width: 36px; height: 36px; }
.app :is(.tracker-status-card,#progressTrainingStatus) .advice-label { font-size: 10px; line-height: 1.35; margin-bottom: 4px; }
.app :is(.tracker-status-card,#progressTrainingStatus) b { display: block; font-size: 16px; line-height: 1.3; }
.app :is(.tracker-status-card,#progressTrainingStatus) p { margin: 4px 0 0; font-size: 13px; line-height: 1.45; }
.app :is(.tracker-status-card,#progressTrainingStatus)[data-level="green"] { border-left-color: var(--green); }
.app :is(.tracker-status-card,#progressTrainingStatus)[data-level="yellow"] { border-left-color: var(--yellow); }
.app :is(.tracker-status-card,#progressTrainingStatus)[data-level="red"] { border-left-color: var(--red); }
.app :is(.snapshot-help,#progressValues) { padding: 0; border-top: 1px solid var(--line); margin-top: 12px; }
.app #progressValues { padding: 0 14px; border-radius: 14px; }
.app #progressValues > #tracker { margin-top: 0; }
body.app-ready .app #progressValues .step-intro { display: none; }
.app dialog[open] { overscroll-behavior: contain; touch-action: pan-y; }
.app :is(.snapshot-help,#progressValues) > summary { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 44px; padding: 8px 0; color: var(--muted); font-size: 12px; line-height: 1.4; font-weight: 700; cursor: pointer; list-style: none; }
.app :is(.snapshot-help,#progressValues) > summary::-webkit-details-marker { display: none; }
.app :is(.snapshot-help,#progressValues) > summary::after { content: '+'; flex: 0 0 18px; color: var(--muted); font-size: 18px; line-height: 1; text-align: center; }
.app :is(.snapshot-help,#progressValues)[open] > summary::after { content: '−'; }
.app .snapshot-help .progress-insight { margin: 0 0 8px; padding: 0; border: 0; }
.app #dashboardHero .snapshot-help { margin: 0; border: 0; }
.app #dashboardHero .snapshot-help > summary { position: absolute; top: 4px; right: 4px; display: grid; place-items: center; justify-content: center; width: 44px; height: 44px; min-height: 44px; padding: 0; border-radius: 50%; font-family: ui-serif,Georgia,serif; font-size: 14px; font-weight: 800; }
.app #dashboardHero .snapshot-help > summary::before { content: ''; position: absolute; inset: 12px; border: 1.5px solid currentColor; border-radius: 50%; }
.app #dashboardHero .snapshot-help > summary::after { content: none; }
.app #dashboardHero .snapshot-help > summary:hover { background: var(--surface-2); color: var(--ink); }
.app #dashboardHero .snapshot-help[open] { margin-top: 20px; padding-top: 8px; border-top: 1px solid var(--line); }
.app :is(.day-preview-dialog,.tracker-status-card,.snapshot-help,#progressValues,#progressTrainingStatus)[hidden] { display: none !important; }
.app .ex-result-dialog { width: min(680px,calc(100% - 24px)); }
.app .ex-result-dialog .ex-dialog-head { gap: 12px; margin-bottom: 14px; }
.app .ex-result-summary { min-width: 0; padding: 14px; border: 1px solid var(--line); background: var(--surface-2); border-radius: 14px; }
.app #exResultCopy h3 { font-size: 18px; line-height: 1.3; margin: 0 0 8px; }
.app .ex-result-time { font-size: clamp(44px,7vw,64px); line-height: 1.1; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.app .ex-result-meta { margin: 8px 0 4px; color: var(--muted); font-size: 12px; line-height: 1.45; }
.app .ex-result-caption { margin: 4px 0; color: var(--muted); font-size: 12px; line-height: 1.45; }
.app .ex-result-incomplete { margin: 10px 0; padding: 10px; border-left: 3px solid var(--yellow); background: var(--surface); color: var(--ink); font-size: 13px; line-height: 1.45; border-radius: 8px; }
.app .ex-result-times { margin-top: 12px; border-top: 1px solid var(--line); }
.app .ex-result-times > summary { display: flex; align-items: center; min-height: 44px; padding: 8px 0; font-size: 13px; line-height: 1.4; font-weight: 700; cursor: pointer; }
.app .ex-result-times .ex-split { padding: 8px 0; font-size: 13px; }
.app .ex-result-private-note { margin: 0 0 12px; font-size: 12px; line-height: 1.4; }
.app .ex-result-extras { margin: 12px 0; }
.app .ex-result-extras .ex-field { margin: 10px 0; font-size: 13px; }
.app .ex-result-extras .ex-share-options { gap: 10px; }
.app .ex-result-extras .ex-share-preview { display: block; width: min(220px,100%); height: 330px; max-height: 330px; object-fit: contain; margin: 12px auto; }
.app .ex-result-extras:has(#exShareFormat option[value="square"]:checked) .ex-share-preview { height: 220px; }
.app .ex-result-extra-actions { gap: 8px; margin: 12px 0; }
.app .ex-result-extra-actions > button { min-height: 44px; padding: 9px 12px; font-size: 13px; line-height: 1.35; white-space: normal; }
@media (max-width: 620px) {
  .app .today-card .hero-actions > button { min-height: 48px; padding: 9px 10px; font-size: 13px; }
  .app .today-card .week-strip { grid-template-columns: repeat(7,minmax(0,1fr)); gap: 3px; margin-left: -14px; margin-right: -14px; }
  .app .profile-danger > div > button { flex: 1 1 120px; }
  .app .profile-actions #groupsProfileLauncher { grid-column: 1 / -1; }
  .app #plan .week { padding: 8px; }
  .app #plan .week-head h3 { font-size: 15px; }
  .app #plan .week > .week-head { align-items: center; gap: 6px; }
  .app #plan .week-meta { gap: 4px; }
  .app #plan .week-insight { padding: 8px; font-size: 12px; }
  .app #plan .session > summary { grid-template-columns: 44px minmax(0,1fr) auto; gap: 2px 6px; padding: 6px; }
  .app #plan .session-title { grid-column: 2; grid-row: 1; }
  .app #plan .session-date { grid-column: 2; grid-row: 2; }
  .app #plan .session-tag { grid-column: 3; grid-row: 1 / span 2; max-width: 78px; white-space: normal; }
  .app #plan .session-body { padding: 4px 10px 10px; }
  .app .calendar-agenda { padding: 10px; margin-top: 10px; }
  .app .agenda-item { grid-template-columns: 32px minmax(0,1fr); padding: 10px; gap: 8px; }
  .app .agenda-icon { width: 32px; height: 32px; font-size: 16px !important; border-radius: 9px; }
  .app .agenda-actions { grid-column: 1 / -1; width: 100%; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
  .app .agenda-actions > .primary { grid-column: auto; min-height: 44px; }
  .app .calendar-grid:not(.week-mode) .calendar-day { min-height: 54px; padding: 4px; }
  .app .calendar-grid:not(.week-mode) .calendar-number { font-size: 12px; margin-bottom: 3px; }
  .app .calendar-grid.week-mode .calendar-day { min-height: 54px; padding: 6px 8px; }
  .app .calendar-grid.week-mode .calendar-event { min-height: 32px; padding: 6px 8px; font-size: 12px; margin-top: 4px; }
  .app .calendar-weekdays { font-size: 12px; }
  .app .progress-snapshot { padding: 12px; }
  .app .progress-kpi { padding: 7px; }
  .app .progress-kpi b { font-size: 19px; }
  .app :is(.profile-actions,.progress-page-actions,.plan-toolbar,.actions,.agenda-actions,.ex-actions) > button { padding: 8px 10px; min-height: 44px; font-size: 13px; }
  .app .ex-result-primary-actions > button { flex: 1 1 100%; width: 100%; }
  .app .ex-result-extras .ex-share-preview { width: 160px; height: 285px; max-height: 285px; }
  .app .ex-result-extras:has(#exShareFormat option[value="square"]:checked) .ex-share-preview { height: 160px; }
  .app .day-preview-dialog { padding: 14px; }
  .app .day-preview-agenda .agenda-item { grid-template-columns: 32px minmax(0,1fr); }
  .app .ex-result-dialog { padding: 16px; }
  .app .ex-result-summary { padding: 12px; }
  .app #exResultCopy h3 { font-size: 17px; }
  .app .ex-result-time { font-size: 46px; }
  .app .ex-result-extra-actions > button { width: 100%; }
}
@media (min-width: 621px) {
  .app .calendar-grid .calendar-event { min-height: 0; padding: 5px 6px; font-size: 12px; line-height: 1.35; }
}
@media (max-width: 359px) {
  .app .today-card .week-strip { grid-template-columns: repeat(4,minmax(0,1fr)); gap: 6px; margin-left: 0; margin-right: 0; }
}
@media (prefers-reduced-motion: reduce) { .app .profile-manage-chevron { transition: none; } }
/* v32: stable app destinations, a calm header and one contextual settings area. */
.app .topbar:has(#brandHome) { grid-template-columns: auto minmax(0,1fr) auto; gap: 12px; padding: 9px 10px; }
.app #brandHome { display: flex; align-items: center; justify-content: flex-start; gap: 9px; min-width: 44px; min-height: 44px; margin: 0; padding: 0; border: 0; border-radius: 10px; background: transparent; color: var(--ink); text-align: left; }
.app #brandHome:hover { transform: none; filter: none; }
.app #brandHome .brand-icon { display: block; flex: 0 0 44px; width: 44px; height: 44px; border-radius: 10px; object-fit: contain; box-shadow: none; }
.app #brandHome .brand-text b { font-size: 16px; line-height: 1.25; letter-spacing: -.03em; }
.app #brandHome .brand-text small { display: none; }
.app .app-header-context { min-width: 0; color: var(--muted); }
.app #headerProfileName { display: block; overflow: hidden; min-width: 0; color: var(--ink); font-size: 14px; font-weight: 750; line-height: 1.3; text-overflow: ellipsis; white-space: nowrap; }
.app #openProfileSettings { display: grid; place-items: center; flex: 0 0 44px; width: 44px; height: 44px; min-width: 44px; min-height: 44px; padding: 0; border: 1px solid var(--line); border-radius: 50%; background: var(--surface-2); color: var(--ink); }
.app #headerProfileAvatar { display: grid; place-items: center; width: 100%; height: 100%; border-radius: 50%; font-size: 16px; font-weight: 850; line-height: 1; }
.app #headerProfileAvatar img { display: block; width: 100%; height: 100%; object-fit: cover; border-radius: 50%; }
.app .app-nav { grid-template-columns: repeat(6,minmax(0,1fr)); }
.app .app-nav > button { min-width: 44px; }
.app .profile-switcher { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 10px; align-items: end; margin: 0 0 16px; padding: 12px; border: 1px solid var(--line); border-radius: 13px; background: var(--surface-2); }
.app .profile-switcher .field { min-width: 0; margin: 0; }
.app .profile-switcher label { margin-bottom: 6px; font-size: 12px; line-height: 1.35; }
.app .profile-switcher select { width: 100%; min-width: 0; min-height: 44px; margin: 0; font-size: 16px; }
.app .profile-switcher > button { min-height: 44px; margin: 0; padding: 9px 12px; font-size: 13px; line-height: 1.35; white-space: normal; }
.app .profile-settings { margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--line); }
.app .profile-settings h3 { margin: 0 0 10px; font-size: 16px; line-height: 1.3; }
.app .profile-settings-row { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; }
.app .profile-settings-row > button { display: flex; align-items: center; justify-content: center; gap: 7px; width: 100%; min-width: 44px; min-height: 44px; padding: 9px 12px; font-size: 13px; line-height: 1.35; white-space: normal; }
.app .profile-settings-row .account-quick { border-radius: 8px; }
.app .profile-settings-row .account-quick-label { display: inline; min-width: 0; }
.app .profile-settings-row svg { flex: 0 0 19px; }
.app .plan-more-options, .app .reminder-options { margin-top: 12px; padding: 0; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); }
.app :is(.plan-more-options,.reminder-options) > summary { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 44px; padding: 10px 12px; color: var(--ink); font-size: 13px; font-weight: 750; line-height: 1.35; cursor: pointer; list-style: none; }
.app :is(.plan-more-options,.reminder-options) > summary::-webkit-details-marker { display: none; }
.app :is(.plan-more-options,.reminder-options) > summary::after { content: '+'; flex: 0 0 18px; color: var(--muted); font-size: 20px; line-height: 1; text-align: center; }
.app :is(.plan-more-options,.reminder-options)[open] > summary::after { content: '−'; }
.app .plan-more-actions { display: flex; flex-wrap: wrap; gap: 8px; padding: 0 12px 12px; }
.app .plan-more-actions > button { min-height: 44px; padding: 9px 12px; font-size: 13px; line-height: 1.35; white-space: normal; }
.app .reminder-options > :not(summary) { margin-left: 12px; margin-right: 12px; }
.app .reminder-options > :last-child:not(summary) { margin-bottom: 12px; }
.app .grp-page-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 16px; }
.app .grp-page-head > div { min-width: 0; }
.app .grp-page-head h2 { margin: 10px 0 6px; font-size: clamp(27px,4vw,38px); line-height: 1.1; letter-spacing: -.035em; }
.app .grp-page-head p { margin: 0; font-size: 13px; line-height: 1.45; }
.app .grp-page-body { min-width: 0; }
.app .grp-page-body .grp-gate { display: grid; gap: 10px; padding: 18px; }
.app .grp-page-body .grp-gate :is(h3,p) { margin: 0; }
.app .grp-page-body .grp-gate h3 { font-size: 19px; line-height: 1.3; }
.app .grp-page-body .grp-gate > button { justify-self: start; min-height: 44px; padding: 10px 14px; font-size: 14px; }
.app .grp-page-body .grp-list { grid-template-columns: repeat(3,minmax(0,1fr)); }
.app .grp-main-actions { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
.app .grp-main-actions > button { min-height: 44px; padding: 10px 12px; font-size: 13px; line-height: 1.35; }
.app .grp-leaderboard-title { margin: 18px 0 0; font-size: 18px; line-height: 1.3; }
.app .grp-page .grp-detail { margin-top: 14px; padding-top: 14px; }
.app .grp-page .grp-board-group { padding: 14px; }
.app #friendsPanel [hidden] { display: none !important; }
.app .plan-more-actions > [hidden] { display: none !important; }
.app #progressValues #tracker { grid-template-columns: repeat(2,minmax(0,1fr)); }
.app #progressValues #tracker > .panel { min-width: 0; }
.landing .brand img { display: block; flex: 0 0 44px; width: 44px; height: 44px; object-fit: contain; }
.landing .hero > * { min-width: 0; }
.landing .hero h1 { overflow-wrap: anywhere; }
.landing .top { gap: 12px; }
.landing .landing-login-link { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; padding: 9px 12px; font-size: 13px; line-height: 1.35; }
.landing .nav a { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; font-size: 13px; line-height: 1.35; }
.landing .footer a { display: inline-flex; align-items: center; min-width: 44px; min-height: 44px; margin-bottom: 4px; font-size: 12px; line-height: 1.4; }
.landing .preview-tab { min-height: 44px; padding: 9px 12px; font-size: 13px; line-height: 1.35; }
.landing .preview-stage { --ink: #f8faf2; --muted: #c4ccbd; }
.landing :is(.preview-label,.preview-kpi span,.preview-next small,.preview-day span,.preview-step span,.preview-live-note) { color: #c4ccbd; font-size: 12px; line-height: 1.35; letter-spacing: .02em; }
.landing .preview-demo { font-size: 11px; line-height: 1.3; }
.landing .preview-day b, .landing .preview-step b { font-size: 13px; line-height: 1.35; }
.landing .preview-week { grid-template-columns: repeat(5,minmax(0,1fr)); }
.landing .preview-day { min-width: 0; }
.landing .preview-day b { overflow-wrap: anywhere; }
.landing .preview-step > div { min-width: 0; overflow-wrap: anywhere; }
.landing .preview-training-head small { font-size: 13px; color: #c4ccbd; line-height: 1.35; }
.landing .preview-progress .preview-progress-quarter { width: 25%; }
.landing .preview-caption { font-size: 12px; line-height: 1.45; }
.landing .entry-disclosure { margin-top: 0; }
.landing .entry-disclosure > summary { min-height: 44px; padding: 12px 16px; font-size: 14px; line-height: 1.4; }
.landing .entry-disclosure .entry-grid { margin: 0 16px 16px; }
@media (max-width: 900px) {
  .app #progressValues #tracker { grid-template-columns: minmax(0,1fr); }
  .app .grp-page-body .grp-list { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 620px) {
  .app .topbar:has(#brandHome) { grid-template-columns: 44px minmax(0,1fr) auto; gap: 8px; padding: 6px; }
  .app #brandHome { width: 44px; }
  .app #brandHome .brand-text { display: none; }
  .app .topbar:has(#brandHome) .top-actions { gap: 6px; }
  .app .app-nav { gap: 4px; padding: 6px; }
  .app .app-nav > button { gap: 4px; min-width: 44px; min-height: 54px; padding: 7px 1px; font-size: 10px; letter-spacing: -.02em; }
  .app:has(#appNav:not(.hidden)) { padding-bottom: calc(96px + env(safe-area-inset-bottom,0px)); }
  .app .profile-switcher { gap: 8px; padding: 10px; margin-bottom: 12px; }
  .app .profile-switcher > button { padding: 8px 10px; font-size: 12px; }
  .app .profile-settings-row { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .app .profile-settings-row #openProfileInstall { grid-column: 1 / -1; }
  .app .profile-settings-row .account-quick { width: 100%; min-width: 44px; }
  .app .profile-settings-row .account-quick-label { display: inline; }
  .app .plan-more-actions { display: grid; grid-template-columns: 1fr; }
  .app #progressValues .compact-rpe { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .app #progressValues .compact-rpe .rpe-choice span { font-size: 11px; line-height: 1.3; }
  .app .grp-page-head { margin-bottom: 12px; }
  .app .grp-page-body .grp-list { grid-template-columns: 1fr; }
  .app .grp-page-body .grp-gate { padding: 14px; }
  .app .grp-page-body .grp-gate > button { width: 100%; }
  .app .grp-page .grp-board-group { padding: 12px; }
  .landing .hero-copy { min-height: 0; }
  .landing .hero h1 { font-size: clamp(36px,10vw,44px); line-height: .98; }
  .landing .top { gap: 8px; }
  .landing .brand { gap: 7px; }
  .landing .brand b { font-size: 15px; }
  .landing .landing-login-link { padding: 8px 10px; }
  .landing .preview-step { grid-template-columns: 32px minmax(0,1fr) auto; gap: 8px; }
  .landing .preview-training-head { padding: 12px; }
  .landing .preview-tabs { gap: 8px; }
  .landing .preview-tab { padding: 9px 10px; }
  .landing .preview-week { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 6px; }
  .landing .preview-day b { overflow-wrap: normal; }
  .landing .preview-step .preview-step-icon { display: grid; place-items: center; width: 32px; height: 32px; font-size: 20px; line-height: 1; color: #dfff00; }
}
@media (max-width: 359px) {
  .app .app-nav > button { font-size: 9.5px; }
}
/* v33: the next workout is the focus; explanation is available on demand. */
.app .plan-heading { margin-bottom: 16px; }
.app .plan-heading > :first-child { min-width: 0; }
.app .plan-heading h2 { margin: 0; font-size: clamp(24px,3vw,32px); line-height: 1.15; }
.app .plan-next-card, .app .load-signal-card {
  --ink: #f7f8f2; --muted: #c4ccbd; --surface: #10140d; --surface-2: #1d2318;
  --surface-3: #2b3323; --line: #59634c; --accent-text: #dfff00;
  --green: #a2e889; --yellow: #f7d36a; --red: #ffb5ab; --focus-ring: #91bfff;
  color: var(--ink); background: #10140d; isolation: isolate;
}
.app .plan-next-card { position: relative; display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 8px 16px; align-items: center; padding: 18px; border: 1px solid #59634c; border-radius: 16px; background: radial-gradient(circle at 94% 4%,rgba(223,255,0,.12),transparent 34%),#10140d; }
.app .plan-next-card > :is(.eyebrow,.plan-next-title,.plan-next-meta) { grid-column: 1 / -1; }
.app .plan-next-card > .eyebrow { justify-self: start; color: #f7f8f2; background: #1d2318; border-color: #59634c; }
.app .plan-next-title { display: block; margin: 0; color: #f7f8f2; font-size: clamp(23px,3vw,30px); line-height: 1.15; font-weight: 850; letter-spacing: -.025em; overflow-wrap: anywhere; }
.app .plan-next-meta { display: block; margin: 6px 0 0; color: #c4ccbd; font-size: 13px; line-height: 1.45; }
.app .plan-next-card .secondary { color: #f7f8f2; background: #1d2318; border-color: #68755a; }
.app .plan-next-preview { min-width: 44px; min-height: 44px; padding: 9px 12px; font-size: 12px; line-height: 1.35; white-space: normal; }
.app .plan-heading-actions { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: stretch; gap: 8px; margin: 10px 0 0; width: 100%; }
.app .plan-heading-actions > button { min-width: 44px; min-height: 44px; margin: 0; padding: 10px 14px; font-size: 14px; line-height: 1.3; white-space: normal; }
.app .plan-heading-actions > .primary { grid-column: auto; }
.app .plan-current-meta { display: flex; flex-wrap: wrap; gap: 5px 10px; margin: 12px 0 8px; color: var(--muted); font-size: 12px; line-height: 1.4; }
.app #planSummaryDetails { margin: 12px 0 16px; padding: 0; border: 1px solid var(--line); border-radius: 12px; background: var(--surface-2); }
.app #planSummaryDetails > summary { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 44px; padding: 10px 12px; color: var(--ink); font-size: 13px; font-weight: 750; line-height: 1.35; cursor: pointer; list-style: none; }
.app #planSummaryDetails > summary::-webkit-details-marker { display: none; }
.app #planSummaryDetails > summary::after { content: '+'; color: var(--muted); font-size: 18px; line-height: 1; }
.app #planSummaryDetails[open] > summary::after { content: '−'; }
.app #planSummaryDetails .plan-summary { grid-template-columns: repeat(4,minmax(0,1fr)); gap: 8px; margin: 0; padding: 0 12px 12px; }
.app #planSummaryDetails .mini-card { min-width: 0; padding: 10px; border-radius: 10px; background: var(--surface); }
.app #planSummaryDetails .mini-card span { font-size: 10px; line-height: 1.35; letter-spacing: .02em; }
.app #planSummaryDetails .mini-card b { display: block; margin-top: 4px; font-size: 14px; line-height: 1.35; overflow-wrap: anywhere; }
.app .session-editor { margin: 6px 0 0; padding: 0; border-top: 1px solid var(--line); }
.app .session-editor > summary { display: flex; align-items: center; min-height: 44px; padding: 8px 0; color: var(--muted); font-size: 12px; line-height: 1.35; font-weight: 700; cursor: pointer; }
.app .session-editor textarea { min-width: 0; width: 100%; font-size: 16px; line-height: 1.45; }
.app .session-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
.app .session-actions > button { min-height: 44px; padding: 9px 12px; font-size: 13px; line-height: 1.35; white-space: normal; }
.app :is(#readinessCard,#progressTrainingStatus,#loadAdvice).load-signal-card { position: relative; display: grid; grid-template-columns: 32px minmax(0,1fr); gap: 12px; align-items: start; min-height: 0; margin: 0 0 16px; padding: 16px; border: 1px solid #59634c; border-radius: 14px; background: #10140d; box-shadow: none; }
.app #progressTrainingStatus.load-signal-card { margin-top: 16px; }
.app .load-signal-icon { display: grid; place-items: center; flex: 0 0 32px; width: 32px; height: 32px; border-radius: 50%; color: #c4ccbd; background: #2b3323; font-size: 17px; line-height: 1; }
.app .load-signal-card[data-level="green"] .load-signal-icon { color: #a2e889; background: #233521; }
.app .load-signal-card[data-level="yellow"] .load-signal-icon { color: #f7d36a; background: #352e18; }
.app .load-signal-card[data-level="red"] .load-signal-icon { color: #ffb5ab; background: #3a2420; }
.app .load-signal-copy { min-width: 0; }
.app .load-signal-copy .advice-label { display: block; margin-bottom: 4px; color: #c4ccbd; font-size: 10px; line-height: 1.35; letter-spacing: .03em; }
.app .load-signal-heading { display: block; margin: 0; padding-right: 44px; color: #f7f8f2; font-size: 16px; font-weight: 800; line-height: 1.3; overflow-wrap: anywhere; hyphens: auto; }
.app .load-signal-cue { margin: 5px 0 0; color: #c4ccbd; font-size: 13px; line-height: 1.45; }
.app .load-signal-date { display: block; margin-top: 7px; color: #c4ccbd; font-size: 11px; line-height: 1.4; }
.app .load-signal-why { grid-column: 1 / -1; margin: -12px 0 0; padding: 0; border: 0; color: #c4ccbd; font-size: 12px; line-height: 1.45; }
.app .load-signal-why > summary { position: absolute; top: 10px; right: 10px; display: flex; align-items: center; justify-content: center; width: 44px; min-height: 44px; padding: 0 2px; border: 0; border-radius: 8px; color: #c4ccbd; font-size: 11px; font-weight: 700; line-height: 1.3; cursor: pointer; list-style: none; }
.app .load-signal-why > summary::-webkit-details-marker { display: none; }
.app .load-signal-why > summary::after { content: none; }
.app .load-signal-why > summary:hover { color: #f7f8f2; background: #2b3323; }
.app .load-signal-why[open] { margin-top: 10px; padding-top: 10px; border-top: 1px solid #59634c; }
.app .load-signal-why > :not(summary) { margin: 0 0 6px; color: #c4ccbd; }
.app .load-signal-safety { grid-column: 1 / -1; margin: 0; padding: 9px 10px; border: 1px solid #a3594f; border-radius: 8px; color: #ffd4ce; background: #35231e; font-size: 13px; line-height: 1.45; }
.app .load-signal-card [hidden], .app .plan-next-card[hidden], .app #planSummaryDetails[hidden] { display: none !important; }
.app .week-day.hard:not(.done) { box-shadow: none; }
.app .week-day { min-height: 44px; border-color: #59634c; }
.app .week-day.today { border-color: #dfff00; background: #28310c; box-shadow: inset 0 0 0 1px #dfff00; }
.app .week-day.done { border-color: #697c61; background: #233521; }
.app .week-day.done b { color: #c9e8bf; }
.app .week-day.today.done { border-color: #dfff00; }
.app .week-day :is(.week-day-type,.week-day-label) { color: #f7f8f2; font-size: 11px; line-height: 1.3; letter-spacing: 0; text-transform: none; }
.app .week-day-intensity { display: block; margin-top: 2px; color: #c4ccbd; font-size: 10px; font-weight: 650; line-height: 1.3; white-space: nowrap; }
.app .progress-snapshot { margin-bottom: 16px; padding: 16px; border-radius: 14px; }
.app .progress-snapshot-head { padding-right: 0; }
.app .progress-snapshot .progress-kpi-note { display: block; margin: 4px 0 0; color: var(--muted); font-size: 11px; font-weight: 500; line-height: 1.35; letter-spacing: 0; text-transform: none; }
.app .progress-page-hero { min-height: 0; padding: 22px; border-radius: 16px; box-shadow: none; }
.app .progress-page-hero h2 { margin: 12px 0 8px; font-size: clamp(28px,4vw,40px); line-height: 1.06; letter-spacing: -.025em; }
.app .progress-score span { font-size: 11px; line-height: 1.35; }
.app .progress-training-list { margin: 16px 0; padding: 16px; border-radius: 14px; }
.app .progress-training-list > .section-head { align-items: center; gap: 10px; margin-bottom: 12px; }
.app .progress-training-list h3 { margin: 0; font-size: 18px; line-height: 1.3; }
.app .progress-training-list > .section-head button { flex: 0 0 auto; min-height: 44px; padding: 9px 12px; font-size: 12px; line-height: 1.35; }
.app #progressWorkoutList { display: grid; gap: 8px; min-width: 0; }
.app .progress-training-row { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 10px; align-items: center; min-width: 0; padding: 12px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface-2); }
.app .progress-training-row > div { display: grid; min-width: 0; gap: 4px; }
.app .progress-training-row time { color: var(--muted); font-size: 11px; line-height: 1.35; }
.app .progress-training-row b { color: var(--ink); font-size: 14px; line-height: 1.35; overflow-wrap: anywhere; }
.app .progress-training-row span { color: var(--muted); font-size: 12px; line-height: 1.4; overflow-wrap: anywhere; }
.app .progress-training-row > button { min-width: 44px; min-height: 44px; padding: 9px 10px; font-size: 12px; line-height: 1.35; }
.app .workout-step-toggle, .app .workout-step-toggle[data-running="true"], .app .workout-step-chip.active span { animation: none; box-shadow: none; }
.app .workout-step-toggle:hover { transform: none; }
.app .workout-step-toggle[data-running="true"] { color: #10120c; background: #dfff00; border-color: #dfff00; }
.app .workout-step-chip.active { box-shadow: none; }
.app .step-live-label { color: var(--ink); font-size: 14px; font-weight: 750; line-height: 1.4; }
.app .workout-exit-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 16px; padding-top: 12px; border-top: 1px solid var(--line); }
.app .workout-exit-actions > button, .app #discardWorkout { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-width: 44px; min-height: 44px; padding: 9px 12px; font-size: 13px; line-height: 1.35; white-space: normal; }
.app #discardWorkout { color: var(--red); background: var(--surface-2); border: 1px solid var(--line); }
.app #discardWorkout svg { flex: 0 0 18px; width: 18px; height: 18px; }
.app .timer-review-dialog { width: min(560px,calc(100% - 24px)); max-height: calc(100dvh - 32px); padding: 20px; border: 1px solid var(--line); border-radius: 16px; overflow: auto; overscroll-behavior: contain; color: var(--ink); background: var(--surface); }
.app .timer-review-dialog h2 { margin: 0; font-size: 24px; line-height: 1.2; }
.app .timer-review-dialog p { color: var(--muted); font-size: 13px; line-height: 1.45; }
.app .timer-review-dialog .timer-review-times { padding: 10px 12px; border: 1px solid var(--line); border-radius: 10px; color: var(--ink); background: var(--surface-2); font-variant-numeric: tabular-nums; }
.app .timer-review-actions { display: grid; grid-template-columns: 1fr; gap: 8px; margin-top: 14px; }
.app .timer-review-actions > button { width: 100%; min-height: 44px; padding: 10px 12px; font-size: 13px; line-height: 1.35; white-space: normal; }
.app #confirmDiscardWorkout { color: var(--red); border-color: color-mix(in srgb,var(--red) 50%,var(--line)); }
.app .workout-recovery-card { margin: 12px 0 16px; padding: 14px; border: 1px solid var(--line); border-radius: 12px; color: var(--ink); background: var(--surface-2); }
.app .workout-recovery-card p { margin: 4px 0 10px; color: var(--muted); font-size: 13px; line-height: 1.4; }
.app .workout-recovery-card button { min-height: 44px; padding: 9px 12px; font-size: 13px; }
.app .workout-recovery-card[hidden] { display: none !important; }
.app #workoutWakeStatus { margin-top: 6px; color: var(--muted); font-size: 11px; line-height: 1.4; }
.app .session-preview-meta { margin: 8px 0 12px; color: var(--muted); font-size: 13px; line-height: 1.4; }
.app .session-preview-warning { margin: 12px 0; padding: 10px 12px; border: 1px solid var(--yellow); border-radius: 10px; color: var(--ink); background: var(--surface-2); font-size: 13px; line-height: 1.45; }
.app .session-preview-steps { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.app .session-preview-steps li { display: grid; grid-template-columns: 32px minmax(0,1fr); gap: 10px; align-items: start; min-width: 0; padding: 12px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface-2); font-size: 13px; line-height: 1.45; }
.app .session-preview-steps li > :first-child { display: grid; place-items: center; min-width: 32px; min-height: 32px; color: var(--accent-text); font-size: 17px; line-height: 1; }
.app .session-preview-steps li > :not(:first-child) { min-width: 0; overflow-wrap: anywhere; }
.app .session-preview-actions { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 8px; margin-top: 14px; }
.app .session-preview-actions > button { min-width: 44px; min-height: 44px; padding: 10px 12px; font-size: 13px; line-height: 1.35; white-space: normal; }
@media (max-width: 900px) {
  .app #planSummaryDetails .plan-summary { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 620px) {
  .app .plan-next-card { grid-template-columns: minmax(0,1fr); gap: 10px; padding: 16px; }
  .app .plan-next-title { font-size: 24px; }
  .app .plan-next-preview { justify-self: start; }
  .app .plan-heading-actions > button { padding: 10px 12px; font-size: 13px; }
  .app .session-actions { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); }
  .app .session-actions > button { padding: 9px 8px; }
  .app .calendar-tools { grid-template-columns: 44px minmax(0,1fr) 44px auto; gap: 4px; }
  .app .calendar-tools input { width: 100%; min-width: 0; padding: 6px; font-size: 16px; }
  .app .calendar-tools #calendarToday { min-width: 44px; padding: 8px; }
  .app .calendar-grid:not(.week-mode) .calendar-day { min-height: 44px; padding: 3px; }
  .app .calendar-grid:not(.week-mode) .calendar-number { margin-bottom: 2px; font-size: 12px; line-height: 1.3; }
  .app #calendarPanel:has(.calendar-grid.week-mode) .calendar-weekdays { display: none; }
  .app .calendar-grid.week-mode { grid-template-columns: repeat(7,minmax(44px,1fr)); gap: 3px; width: calc(100% + 32px); max-width: calc(100% + 32px); margin-left: -16px; margin-right: -16px; padding: 2px 0 6px; overflow-x: auto; scroll-snap-type: x proximity; }
  .app .calendar-grid.week-mode .calendar-day { min-width: 44px; min-height: 56px; padding: 7px 3px; text-align: center; scroll-snap-align: center; }
  .app .calendar-grid.week-mode .calendar-day-label { display: block; font-size: 12px; line-height: 1.35; }
  .app .calendar-grid.week-mode .calendar-event { display: inline-block; width: 6px; height: 6px; min-height: 6px; margin: 5px 1px 0; padding: 0; border: 0; border-radius: 50%; font-size: 0; color: transparent; background: var(--accent-text); }
  .app .calendar-grid.week-mode .calendar-event.easy { background: var(--green); }
  .app .calendar-grid.week-mode .calendar-event.hard { background: var(--orange); }
  .app .calendar-grid.week-mode .calendar-event.hybrid { background: var(--blue); }
  .app .calendar-grid.week-mode .calendar-event.done { background: var(--green); }
  .app .progress-snapshot { padding: 16px; }
  .app .progress-snapshot .progress-kpi { padding: 8px 6px; }
  .app .progress-page-hero { padding: 18px 16px; }
  .app .progress-page-hero h2 { font-size: 28px; }
  .app .workout-session-copy { min-width: 0; }
  .app .workout-session-copy > .eyebrow { display: block; width: fit-content; max-width: 100%; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 11px; line-height: 1.3; }
  .app .workout-session-copy > .eyebrow::before { display: inline-block; margin-right: 4px; vertical-align: middle; }
  .app #progressValues .log-row { grid-template-columns: minmax(0,1fr) 44px; gap: 6px 8px; align-items: start; }
  .app #progressValues .log-row > :nth-child(-n+4) { min-width: 0; grid-column: 1; overflow-wrap: anywhere; }
  .app #progressValues .log-row > :nth-child(1) { grid-row: 1; }
  .app #progressValues .log-row > :nth-child(2) { grid-row: 2; font-size: 13px; line-height: 1.35; }
  .app #progressValues .log-row > :nth-child(3) { grid-row: 3; font-size: 12px; line-height: 1.4; }
  .app #progressValues .log-row > :nth-child(4) { grid-row: 4; justify-self: start; max-width: 100%; padding: 5px 7px; font-size: 10px; line-height: 1.35; white-space: normal; }
  .app #progressValues .log-row > :nth-child(5) { grid-column: 2; grid-row: 1 / span 4; align-self: center; min-width: 44px; min-height: 44px; margin: 0; padding: 0; }
  .app .app-nav > button { font-size: 10px; }
  .app .app-nav .nav-label { max-width: 100%; line-height: 1.2; text-align: center; white-space: normal; }
  .app .timer-review-dialog { padding: 16px; }
}
@media (max-width: 359px) {
  .app .app-nav .nav-label { white-space: normal; }
  .app .app-nav > button { gap: 2px; min-height: 58px; }
}
/* v34: one compact control rhythm, with room for real content rather than empty padding. */
.app {
  --action-gap: 8px;
  --action-radius: 10px;
}
.app :is(.hero-actions,.plan-heading-actions,.session-actions,.profile-actions,.profile-settings-row,.progress-page-actions,.daily-coach-actions,.alternative-actions,.alternative-complete-actions,.agenda-actions,.ex-actions,.timer-review-actions,.session-preview-actions,.profile-photo-actions) {
  gap: var(--action-gap);
  align-items: stretch;
}
.app :is(.plan-heading-actions,.session-actions,.profile-actions,.profile-settings-row,.progress-page-actions,.daily-coach-actions,.alternative-actions,.alternative-complete-actions,.agenda-actions,.ex-actions,.timer-review-actions,.session-preview-actions,.profile-photo-actions) > button {
  min-width: 44px; min-height: 44px; margin: 0; padding: 9px 12px;
  border-radius: var(--action-radius); font-size: 13px; font-weight: 750;
  line-height: 1.35; white-space: normal;
}
.app :is(.dialog-head,.ex-dialog-head,.grp-head,.ev-help-head) > :is(button,.icon-button,.ex-close) {
  flex: 0 0 44px; width: 44px; min-width: 44px; height: 44px; min-height: 44px;
  margin: 0; padding: 0; border-radius: 10px;
}
.app .plan-heading-actions { grid-template-columns: minmax(0,1fr) 44px; }
.app .plan-heading-actions .plan-calendar-button {
  display: grid; place-items: center; width: 44px; min-width: 44px;
  padding: 0; align-self: stretch;
}
.app .plan-calendar-button svg { width: 22px; height: 22px; }
.app .race-accent-card { overflow: hidden; border-radius: 16px; }
.app .race-accent-card .plan-next-title { max-width: 28ch; }
.app .race-accent-card .plan-heading-actions { margin-top: 12px; }
.app .race-accent-card .plan-next-preview { justify-self: start; }
/* The day label and workout name start at the same height in every cell. */
.app .week-strip { align-items: stretch; }
.app .week-strip .week-day {
  display: grid; grid-template-rows: auto minmax(2.6em,1fr) 1.3em;
  align-content: start; align-items: start; gap: 3px; min-height: 76px;
  padding: 8px 5px;
}
.app .week-strip .week-day > span { grid-row: 1; line-height: 1.3; }
.app .week-strip .week-day > b {
  grid-row: 2; margin: 0; line-height: 1.3; white-space: normal;
  overflow-wrap: anywhere; overflow: visible; text-overflow: clip;
}
.app .week-strip .week-day > .week-day-intensity { grid-row: 3; margin: 0; line-height: 1.3; }
/* Information remains available beside the specific choice, including on touch screens. */
.app .ex-training-grid .ev-help-row { width: 100%; align-items: center; justify-content: space-between; gap: 6px; }
.app .ex-training-grid .ev-help-row > :is(h2,h3) { flex: 1 1 auto; min-width: 0; }
.app .ex-training-grid .ev-help-row > .ev-help-button { margin-left: auto; flex: 0 0 44px; }
.app .load-signal-why > summary {
  right: 8px; top: 8px; width: 44px; height: 44px; min-height: 44px; padding: 0;
  border-radius: 50%; font-family: ui-serif,Georgia,serif; font-size: 14px; line-height: 1;
}
.app .load-signal-why > summary::before { content: ''; position: absolute; inset: 11px; border: 1.5px solid currentColor; border-radius: 50%; pointer-events: none; }
/* All training choices share the calm, high-contrast ENDYVO surface. */
.app .ex-training-grid .ex-tile {
  --ink: #f7f8f2; --muted: #c4ccbd; --surface: #10140d; --surface-2: #1d2318;
  --surface-3: #2b3323; --line: #59634c; --accent-text: #dfff00; --focus-ring: #91bfff;
  color: #f7f8f2; background: radial-gradient(circle at 100% 0,rgba(223,255,0,.06),transparent 40%),#10140d;
  border-color: #59634c; border-radius: 16px; padding: 18px; gap: 10px;
}
.app .ex-training-grid .ex-tile :is(h3,.ex-planned-name) { color: #f7f8f2; }
.app .ex-training-grid .ex-tile h3 { font-size: 20px; line-height: 1.25; }
.app .ex-training-grid .ex-tile > .secondary,
.app .ex-training-grid .ex-tile .secondary:not(.active) { color: #f7f8f2; background: #1d2318; border-color: #68755a; }
.app .ex-training-grid .ex-tile > button { min-height: 44px; padding: 9px 12px; border-radius: 10px; font-size: 13px; text-align: center; }
.app .ex-training-grid .ex-tile :is(.ex-glyph,.station-glyph) {
  width: 44px; height: 44px; display: grid; place-items: center; margin: 0;
  color: #dfff00; background: #242d15; border: 1px solid #59634c; border-radius: 12px;
}
.app .ex-training-grid .ex-tile .ex-planned-name { font-size: 16px; line-height: 1.35; overflow-wrap: anywhere; }
.app .ex-training-grid .ex-tile .ex-optional { background: #1d2318; border-color: #59634c; }
.app .ex-training-grid .ex-tile select { color: #f7f8f2; -webkit-text-fill-color: #f7f8f2; background: #10140d; border-color: #68755a; }
.app .ex-training-grid .ex-tile .ev-help-button:hover { color: #f7f8f2; background: #2b3323; }
/* Profile sections distinguish identity, training, friends and account actions. */
.app .profile-section { min-width: 0; margin-top: 12px; padding: 16px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface-2); }
.app .profile-section-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 12px; }
.app .profile-section-head > div { min-width: 0; }
.app .profile-section-head h3 { margin: 0; color: var(--ink); font-size: 16px; line-height: 1.3; }
.app .profile-section-head > button { flex: 0 0 auto; min-height: 44px; padding: 9px 10px; font-size: 13px; line-height: 1.35; white-space: normal; }
.app .profile-section-head .eyebrow { font-size: 10px; }
.app .profile-section .profile-actions { grid-template-columns: repeat(3,minmax(0,1fr)); margin-top: 0; }
.app .profile-section .profile-route { display: grid; grid-template-columns: 24px minmax(0,1fr) 14px; align-items: center; gap: 8px; text-align: left; }
.app .profile-route > span { min-width: 0; }
.app .profile-route > span:first-child { display: grid; place-items: center; width: 24px; height: 24px; font-size: 18px; color: var(--accent-text); }
.app .profile-route b { display: block; color: var(--ink); font-size: 13px; line-height: 1.35; }
.app .profile-route small { display: block; margin-top: 3px; color: var(--muted); font-size: 11px; font-weight: 500; line-height: 1.35; }
.app .profile-route-arrow { color: var(--muted); font-size: 16px; }
.app .profile-section--identity { background: var(--surface); }
.app .profile-section--identity .profile-summary-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
.app .profile-section--identity .profile-identity { grid-column: 1 / -1; padding: 0 0 12px; border: 0; background: transparent; }
.app .profile-section--identity .profile-identity b { font-size: 15px; line-height: 1.35; }
.app .profile-section--identity .profile-identity small { display: block; margin-top: 5px; color: var(--muted); font-size: 11px; line-height: 1.35; }
.app .profile-section--identity .mini-card { min-width: 0; padding: 10px; border-radius: 10px; }
.app .profile-section--identity .mini-card b { display: block; margin-top: 4px; font-size: 14px; line-height: 1.35; overflow-wrap: anywhere; }
.app .profile-section--identity .mini-card span { font-size: 10px; }
.app .profile-section--account { border-top: 3px solid var(--accent-text); }
.app .profile-section.profile-settings { padding-top: 16px; }
.app .profile-section--social { background: var(--surface); }
.app #profileSocialActions { display: grid; }
.app #profileSocialActions > button { width: 100%; min-height: 44px; padding: 9px 12px; border-radius: 10px; font-size: 13px; line-height: 1.35; white-space: normal; }
.app .profile-best-details { margin: 12px 0 0; padding: 0; border-top: 1px solid var(--line); }
.app .profile-best-details > summary { display: flex; align-items: center; justify-content: space-between; gap: 8px; width: 100%; min-height: 44px; padding: 8px 0; color: var(--muted); font-size: 12px; font-weight: 700; line-height: 1.35; list-style: none; cursor: pointer; }
.app .profile-best-details > summary::-webkit-details-marker { display: none; }
.app .profile-best-details > summary::after { content: '+'; flex: 0 0 18px; text-align: center; font-size: 18px; line-height: 1; }
.app .profile-best-details[open] > summary::after { content: '−'; }
.app .profile-best-details .achievement-strip { margin-top: 8px; }
.app #profileAvatar.profile-photo-button {
  flex: 0 0 64px; width: 64px; height: 64px; min-width: 64px; min-height: 64px; padding: 0;
  border: 1px solid var(--line); border-radius: 50%; overflow: hidden; aspect-ratio: 1;
}
.app #profileAvatar.profile-photo-button img { display: block; width: 100%; height: 100%; object-fit: cover; border-radius: 50%; }
.app .profile-photo-dialog { width: min(440px,calc(100% - 24px)); max-height: calc(100dvh - 32px); padding: 20px; border: 1px solid var(--line); border-radius: 16px; background: var(--surface); color: var(--ink); overflow: auto; overscroll-behavior: contain; }
.app .profile-photo-dialog h2 { margin: 0; font-size: 24px; line-height: 1.2; }
.app .profile-photo-actions { display: grid; grid-template-columns: 1fr; margin-top: 14px; }
.app .profile-photo-actions > button { width: 100%; }
.app .profile-photo-preview { display: grid; place-items: center; width: 96px; height: 96px; aspect-ratio: 1; margin: 16px auto; border: 1px solid var(--line); border-radius: 50%; overflow: hidden; background: var(--surface-2); color: var(--ink); font-size: 30px; }
.app .profile-photo-preview img { display: block; width: 100%; height: 100%; object-fit: cover; border-radius: 50%; }
.app .daily-check-done { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface-2); }
.app .daily-check-done > :not(button) { min-width: 0; font-size: 13px; line-height: 1.35; overflow-wrap: anywhere; }
.app .daily-check-done > span { flex: 0 0 24px; display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; color: var(--green); background: var(--surface); }
.app .daily-check-done > b { flex: 1 1 auto; }
.app .daily-check-done > button { flex: 0 0 auto; min-height: 44px; padding: 8px 12px; font-size: 13px; line-height: 1.35; }
/* Saved data is a compact glance, not three oversized dashboard counters. */
.app .progress-snapshot { border-radius: 14px; background: var(--surface); }
.app .progress-snapshot-head h3 { margin: 3px 0 0; font-size: 17px; line-height: 1.3; }
.app .progress-snapshot-head > div > span { font-size: 11px; line-height: 1.4; }
.app .progress-kpis { gap: 8px; margin-top: 12px; }
.app .progress-kpi { padding: 10px; border: 1px solid var(--line); background: var(--surface-2); border-radius: 10px; }
.app .progress-kpi b { font-size: 23px; line-height: 1.2; letter-spacing: -.02em; }
.app .progress-snapshot .progress-kpi-note { font-size: 11px; line-height: 1.4; }
.app #cloudDialog :is(.dialog-head > div,.auth-account-badge > div,.account-save-card > div,.account-device-save > div) { min-width: 0; }
.app #cloudDialog .dialog-head { align-items: flex-start; gap: 12px; }
.app #cloudDialog .dialog-head h2 { overflow-wrap: anywhere; }
.app #cloudDialog .field > label { min-height: 0; padding-bottom: 0; margin-bottom: 6px; line-height: 1.35; }
.app #cloudDialog .auth-submit { min-height: 44px; padding: 10px 14px; }
.app #cloudDialog .auth-link { min-height: 44px; padding: 9px 12px; white-space: normal; line-height: 1.4; }
.app #cloudDialog .auth-account-badge small { font-size: 12px; line-height: 1.4; }
.app #cloudDialog .auth-confirm { min-height: 44px; line-height: 1.4; }
.app #cloudDialog .auth-confirm input { flex: 0 0 20px; }
.app #cloudDialog .auth-setup-methods { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 4px; width: 100%; margin: 0 0 12px; padding: 4px; border-radius: 12px; background: var(--surface-2); }
.app #cloudDialog .auth-setup-methods > button { min-width: 44px; min-height: 44px; padding: 8px 10px; border-radius: 8px; font-size: 13px; line-height: 1.35; white-space: normal; }
.app #cloudDialog .auth-setup-steps { display: grid; gap: 8px; margin: 0 0 12px; padding-left: 24px; color: var(--ink); font-size: 13px; line-height: 1.45; }
.app #cloudDialog .auth-setup-steps li { padding-left: 3px; }
.app #cloudDialog .auth-setup-steps li::marker { color: var(--accent-text); font-weight: 800; }
.app #cloudDialog :is(#authShowSetupKey,.account-review,.account-continue) { min-height: 44px; width: 100%; padding: 9px 12px; margin: 0 0 8px; border-radius: 10px; font-size: 13px; line-height: 1.35; white-space: normal; }
.app #cloudDialog #cloudContinue { margin-top: 8px; }
.app #cloudDialog .account-save-card .ev-help-row { justify-content: space-between; }
.app #cloudDialog .account-save-card .ev-help-button { margin-left: auto; }
.app #cloudDialog .account-data-choices .account-choice-summary { margin-top: 6px; font-size: 11px; line-height: 1.4; color: var(--muted); }
.app #cloudDialog .account-data-choices button.primary { color: var(--brand-ink); background: var(--brand); border-color: var(--brand); }
.app #cloudDialog .account-data-choices button.primary :is(b,span) { color: var(--brand-ink); }
.app #cloudResolve[data-kind="ready"] :is(#cloudChoiceTitle,#cloudChoiceHelp) { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; border: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.app :is(.profile-section,.profile-photo-dialog,.daily-check-done)[hidden] { display: none !important; }
.app .grp-friend-entry { margin: 12px 0; padding: 14px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface-2); }
.app .grp-friend-entry h3 { margin: 0 0 8px; font-size: 18px; line-height: 1.3; }
.app .grp-connect-actions { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; margin: 10px 0 0; }
.app .grp-connect-actions > button { width: 100%; min-width: 44px; min-height: 44px; padding: 9px 12px; border-radius: 10px; font-size: 13px; line-height: 1.35; white-space: normal; }
.app .grp-connect :is(input,.grp-field), .app .grp-friend-entry :is(input,.grp-field) { min-width: 0; }
.app .grp-connect input, .app .grp-friend-entry input { width: 100%; min-height: 44px; font-size: 16px; }
.app #groupsInvitePane.grp-invite-row { display: grid; min-width: 0; gap: 10px; padding: 14px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface-2); }
.app #groupsInvitePane h4 { margin: 0; font-size: 15px; line-height: 1.35; }
.app #groupsInvitePane .grp-actions { gap: 8px; margin: 0; }
.app #groupsInvitePane .grp-actions > button { min-height: 44px; padding: 9px 12px; font-size: 13px; line-height: 1.35; }
.app #groupsInvitePane .ex-optional { margin: 0; }
.app .grp-invite-qr img { display: block; width: min(200px,100%); height: auto; aspect-ratio: 1; margin: 8px auto 12px; border-radius: 8px; background: #fff; }
.app #groupsFriendNames { margin: 8px 0 12px; color: var(--muted); font-size: 13px; line-height: 1.4; overflow-wrap: anywhere; }
.app :is(.grp-friend-entry,.grp-invite-qr) [hidden], .app #groupsInvitePane[hidden] { display: none !important; }

/* A single private friends leaderboard; administration never competes with training. */
.app :is(#groupsSwitchPane,#groupsMemberTools)[hidden] { display: none !important; }
.app .grp-page-head { padding: 22px; border-radius: 18px; border: 1px solid #3a4330; background: #171d12 url("endyvo-motif.svg") no-repeat right center / 155px; color: #fafbf0; }
.app .grp-page-head > div { flex: 1; }
.app .grp-page-head h2 { max-width: calc(100% - 135px); color: #fafbf0; }
.app .grp-page-head :is(.eyebrow,p) { color: #d5dcca; }
.app .grp-page-head .eyebrow { background: #d1ed00; color: #171d12; border-color: #a3ba00; font-size: 10px; }
.app .grp-page-head p { max-width: 82%; }
.app .grp-board-filters { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
.app .grp-board-filters .grp-field { margin: 12px 0; }
.app .grp-board-group h4 { margin: 0 0 6px; font-size: 19px; line-height: 1.25; }
.app .grp-basis { display: inline-block; margin: 0 0 10px; padding: 6px 9px; border-radius: 8px; background: var(--surface); color: var(--muted); font-size: 12px; line-height: 1.4; }
.app .grp-rank-me { background: var(--surface); border-radius: 10px; padding-inline: 8px; }
.app .grp-rank-row .small { font-size: 11px; line-height: 1.35; }
.app .grp-empty p { margin: 8px 0 12px; }
.app .grp-empty button { min-height: 44px; padding: 9px 12px; font-size: 13px; }
.app .grp-management-row { flex-wrap: wrap; }
.app .grp-management-row > span { flex: 1 1 160px; }
.app #groupsFriendNames { line-height: 1.45; overflow-wrap: anywhere; }
.app .grp-verification { display: block; color: var(--muted); font-size: 11px; border: 0; background: none; padding: 0; margin: 6px 0; }
.app #groupsConnectPane[hidden] { display: none !important; }
.app .grp-subhead > .pill { flex-shrink: 0; font-size: 11px; }
@media(max-width:600px) {
  .app .grp-page-head { padding: 16px; background-size: 105px; }
  .app .grp-page-head h2 { font-size: 27px; max-width: calc(100% - 85px); }
  .app .grp-board-filters { gap: 8px; }
  .app .grp-board-filters .grp-field { font-size: 12px; }
  .app .grp-rank-row { gap: 8px; min-height: 56px; }
  .app .grp-time { font-size: 18px; }
}
@media (min-width: 621px) and (max-width: 1100px) {
  .app .profile-summary-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .app .profile-summary-grid > .profile-identity { grid-column: 1 / -1; }
  .app .profile-summary-grid .mini-card { min-width: 0; }
  .app .profile-summary-grid .mini-card b { overflow-wrap: anywhere; }
  .app .profile-section .profile-actions, .app .profile-settings-row { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .app #cloudDialog.auth-dialog { width: min(520px,calc(100% - 48px)); padding: 24px; }
  .app #cloudDialog .dialog-head { top: -24px; }
  .app #cloudDialog .dialog-head h2 { font-size: 28px; line-height: 1.15; }
  .app .ex-training-grid .ex-tile { padding: 16px; }
}
@media (max-width: 620px) {
  .app .ex-training-grid .ex-tile { grid-template-columns: 44px minmax(0,1fr); padding: 14px; gap: 10px; }
  .app .ex-training-grid .ex-tile h3 { font-size: 18px; line-height: 1.3; }
  .app .ex-training-grid .ex-tile .ev-help-row { grid-column: 2; grid-row: 1; }
  .app .ex-training-grid .ex-tile > .ex-glyph { grid-row: 1; }
  .app .ex-training-grid .ex-tile > button { padding: 9px 12px; }
  .app .profile-section { padding: 12px; }
  .app .profile-section.profile-settings { padding-top: 12px; }
  .app .profile-section .profile-actions, .app .profile-settings-row { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .app .profile-section .profile-actions:has(.profile-route) { grid-template-columns: 1fr; }
  .app .profile-section .profile-actions > button:last-child, .app .profile-settings-row #openProfileInstall { grid-column: 1 / -1; }
  .app .profile-section--identity .profile-summary-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .app .profile-section--identity .profile-summary-grid > .mini-card:last-child { grid-column: 1 / -1; }
  .app .profile-section-head { margin-bottom: 10px; }
  .app .profile-section--identity .profile-identity { gap: 12px; }
  .app .profile-photo-dialog { padding: 16px; }
  .app .progress-kpis { gap: 6px; }
  .app .progress-kpi { padding: 9px 7px; }
  .app .progress-kpi b { font-size: 21px; }
  .app .week-strip .week-day { padding: 7px 3px; }
}
/* v35: actual ENDYVO mark, restrained depth and distinct training choices. */
.app #cloudDialog .account-data-choices .account-keep-all { grid-column: 1 / -1; }
.app .ex-training-grid { align-items: stretch; gap: 16px; }
.app .ex-training-grid .ex-tile {
  position: relative; isolation: isolate; overflow: hidden;
  padding: 22px; gap: 12px; min-height: 220px;
  --ink: #f7f8f2; --muted: #d0d8c8; --surface: #1e2b17; --surface-2: #2c3a24;
  --line: #738666; --accent-text: #dfff00;
  background: radial-gradient(ellipse at 100% 0,#405c25 0,transparent 64%),linear-gradient(140deg,#26351c,#14200f);
  background-color: #405c25;
  border-color: #738666; box-shadow: 0 8px 22px rgba(24,35,14,.10);
}
.app .ex-training-grid .ex-tile::before {
  content: ''; position: absolute; top: -42px; right: 22px; width: 24px; height: 155px;
  background: #ff5a36; transform: skew(-14deg); opacity: .2; z-index: -1; pointer-events: none;
}
.app .ex-training-grid .ex-tile::after {
  content: ''; position: absolute; width: clamp(170px,48%,280px); aspect-ratio: 1;
  right: -35px; bottom: -58px; background: url("endyvo-motif.svg") center / contain no-repeat;
  opacity: .12; z-index: -1; pointer-events: none;
}
.app .ex-training-grid .ex-tile > :is(.ex-glyph,.station-glyph) { background: #314624; border-color: #738666; }
.app .ex-training-grid .ex-tile:has(#startFullSimulation) { background: radial-gradient(ellipse at 100% 0,#344e45,transparent 66%),linear-gradient(140deg,#263c2e,#15241a); background-color: #344e45; }
.app .ex-training-grid .ex-tile:has(#startFullSimulation)::before { background: #9de760; }
.app .ex-training-grid .ex-tile :is(.secondary:not(.active),.ex-optional) { background: #2b3924; border-color: #879b77; color: #f7f8f2; }
.app .ex-training-grid .ex-tile select { background: #23321b; border-color: #879b77; }
.app .ex-training-grid .ex-tile > button { width: auto; min-width: 144px; max-width: 100%; min-height: 44px; padding: 10px 16px; margin: auto 0 0; align-self: start; }
.app .ex-training-grid .ex-tile:has(#startPlanWorkout) > button { width: 100%; margin: 0; }
.app .ex-training-grid .station-round-launch > div { flex: initial; width: 100%; }
.app .ex-planned-actions { width: 100%; display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 8px; align-items: stretch; margin-top: auto; }
.app .ex-planned-actions > :is(button,details) { margin: 0; min-width: 0; width: 100%; }
.app .ex-planned-actions > button { min-height: 44px; padding: 9px 12px; font-size: 13px; line-height: 1.35; }
.app .ex-planned-actions > details > summary { display: grid; align-content: center; min-height: 44px; height: 100%; padding: 9px 12px; font-size: 13px; line-height: 1.35; }
.app .ex-planned-actions > details[open] > summary { height: auto; }
.app .ex-planned-actions:has(> details.hidden) { grid-template-columns: 1fr; }
.app .ex-training-grid .ex-planned-actions > details[open] { grid-column: 1 / -1; }
.app .ex-training-grid .ex-tile .ev-help-row { position: relative; }
html[data-theme="light"] .app .ex-training-grid .ex-tile:has(#startStationRound),
html[data-theme="light"] .app .ex-training-grid .ex-tile:last-child {
  --ink: #182512; --muted: #435b35; --surface: #f6f9ee; --surface-2: #e8f0d8;
  --line: #839773; --accent-text: #3c570f; --focus-ring: #286fad;
  color: #182512; background: radial-gradient(ellipse at 100% 0,#deedbd,transparent 70%),linear-gradient(140deg,#f7faef,#e6eed9);
  background-color: #deedbd;
  border-color: #92a77f;
}
html[data-theme="light"] .app .ex-training-grid .ex-tile:has(#startStationRound) :is(h3,.ex-planned-name),
html[data-theme="light"] .app .ex-training-grid .ex-tile:last-child :is(h3,.ex-planned-name) { color: #182512; }
html[data-theme="light"] .app .ex-training-grid .ex-tile:has(#startStationRound) :is(.ex-glyph,.station-glyph),
html[data-theme="light"] .app .ex-training-grid .ex-tile:last-child :is(.ex-glyph,.station-glyph) { color: #324d08; background: #dceabf; border-color: #92a77f; }
html[data-theme="light"] .app .ex-training-grid .ex-tile:last-child .secondary { color: #182512; background: #e5edda; border-color: #839773; }
html[data-theme="light"] .app .ex-training-grid .ex-tile:is(:has(#startStationRound),:last-child)::after { opacity: .10; filter: brightness(.5); }
html[data-theme="light"] .app .ex-training-grid .ex-tile:is(:has(#startStationRound),:last-child) .ev-help-button:hover { color: #182512; background: #dce8ca; }
.app .ex-training-hub > .ex-hub-extras { margin: 20px 0 24px; width: fit-content; max-width: 100%; }
.app .ex-training-hub > .ex-hub-extras > summary { min-height: 44px; padding: 9px 12px; font-size: 13px; line-height: 1.35; }
.app .ex-training-hub > .ex-hub-extras[open] { width: 100%; }
@media (max-width: 620px) {
  .app .ex-training-grid { gap: 12px; }
  .app .ex-training-grid .ex-tile { min-height: 0; padding: 16px; gap: 10px; }
  .app .ex-training-grid .ex-tile > :is(button,.ex-planned-actions) { grid-column: 1 / -1; }
  .app .ex-training-grid .ex-tile > button { margin-top: 6px; padding: 9px 14px; }
  .app .ex-training-grid .ex-tile::after { width: 180px; right: -32px; bottom: -58px; }
  .app .ex-training-hub > .ex-hub-extras { margin-top: 16px; }
}
/* v39: Account entry and compact private comparisons. */
.app .auth-mail-icon { display:grid; place-items:center; color:var(--brand-ink); background:var(--brand); border-radius:18px; width:64px; height:64px; margin:0 auto 16px; }
.app .auth-mail-icon svg { display:block; flex-shrink:0; }
.app .grp-request-row { display:flex; gap:10px; align-items:center; padding:14px; margin:10px 0; border:1px solid var(--line); border-radius:14px; background:var(--surface-2); }
.app .grp-request-row > div { flex:1; min-width:0; overflow-wrap:anywhere; }
.app .grp-request-row p { margin:3px 0; }
.app .grp-name-claim,.app #groupsNameRequest { display:grid; gap:12px; }
.app .grp-round-result { border:1px solid var(--line); border-radius:14px; background:var(--surface); margin-top:12px; overflow:hidden; }
.app .grp-round-result > summary { display:flex; align-items:center; gap:12px; min-height:64px; padding:14px; cursor:pointer; list-style:none; }
.app .grp-round-result > summary::-webkit-details-marker { display:none; }
.app .grp-round-result > summary > div { flex:1; min-width:0; display:grid; gap:4px; overflow-wrap:anywhere; }
.app .grp-round-result .grp-time { color:var(--ink); font-variant-numeric:tabular-nums; font-size:22px; }
.app .grp-expand { color:var(--muted); }
.app .grp-split-details { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px 16px; margin:16px; font-size:14px; }
.app .grp-split-details dd { margin:0; text-align:right; font-variant-numeric:tabular-nums; font-weight:800; }
.app .grp-pace { padding:12px 16px; margin:0; background:var(--surface-2); font-weight:800; }
.app .grp-total-note { margin:16px; }
@media(max-width:620px){.app .grp-request-row { flex-wrap:wrap; }.app .grp-request-row > div { flex-basis:100%; }.app .grp-request-row button { flex:1; }.app .grp-round-result > summary { padding:12px; gap:10px; }}
.app .profile-section--identity { border:1px solid var(--line); border-radius:18px; padding:18px; background:var(--surface-2); }
.app :is(#profileFriendIdentity,#groupsByName) [hidden] { display:none !important; }

/* v41: one friends hub, with comparison first and controls on demand. */
.app .grp-page-head { display:none; }
.app #groupsContent [hidden] { display:none !important; }
.app .grp-social-hero { position:relative; isolation:isolate; overflow:hidden; margin:0 0 20px; padding:26px; border:1px solid #46503b; border-radius:22px; background:#171e12 linear-gradient(120deg,#171e12,#0d110b 72%); color:#fafcf3; }
.app .grp-social-hero::before { content:""; position:absolute; z-index:-1; pointer-events:none; inset:0; background:url("endyvo-motif.svg") right center / 230px auto no-repeat; opacity:.16; }
.app .grp-social-hero h2 { margin:12px 0 4px; color:#fafcf3; font-size:clamp(28px,3.5vw,42px); line-height:1.1; letter-spacing:-.04em; }
.app .grp-social-hero .eyebrow { min-height:0; padding:5px 9px; color:#d6f000; background:#28321e; border-color:#4d5a35; font-size:10px; }
.app .grp-social-hero :is(p,.muted) { color:#d4dccb; margin:6px 0; }
.app .grp-social-hero .grp-hero-count { font-weight:700; font-size:14px; }
.app .grp-social-hero #groupsFriendHint { font-size:12px; }
.app .grp-social-hero .grp-connect-actions { max-width:520px; gap:10px; margin-top:20px; }
.app .grp-social-hero .grp-connect-actions > button { min-height:46px; font-size:14px; padding:11px 14px; }
.app .grp-social-hero button.secondary { background:#252d20; color:#fafcf3; border-color:#5b684c; }
.app .grp-social-hero button.primary { background:#d1ed00; color:#151b0d; border-color:#d1ed00; }
.app .grp-add-pane:not([open]) { display:none; }
.app .grp-add-pane { margin:0 0 20px; }
.app .grp-add-body { padding:4px 0; }
.app .grp-add-body .grp-byname { margin:0 0 12px; border:0; background:transparent; padding:0; }
.app .grp-add-body .grp-byname > summary { display:none; }
.app .grp-request-form { grid-template-columns:minmax(0,1fr) auto; gap:10px; align-items:end; }
.app .grp-request-form #groupsMyName { grid-column:1/-1; margin:0; font-size:12px; }
.app .grp-request-form .grp-field { margin:0; }
.app .grp-request-form button { min-height:44px; padding:10px 14px; font-size:13px; }
.app .grp-request-form input { min-height:44px; padding:10px 12px; font-size:16px; }
.app .grp-link-actions { gap:8px; margin:16px 0 0; padding-top:16px; border-top:1px solid var(--line); }
.app .grp-link-actions button { min-height:44px; padding:9px 12px; font-size:12px; }
.app .grp-detail { padding:0; margin:0; border:0; }
.app .grp-detail > .grp-subhead { margin:0 0 6px; }
.app .grp-detail > .grp-subhead h3 { font-size:20px; margin:0; }
.app .grp-detail > .grp-verification { margin:0 0 14px; }
.app .grp-peer-list { display:flex; flex-wrap:wrap; gap:8px; margin:0 0 18px; }
.app .grp-peer-list .grp-peer { display:flex; align-items:center; gap:7px; min-height:44px; padding:6px 12px; border-radius:999px; font-size:13px; background:var(--surface); color:var(--ink); }
.app .grp-peer-list .grp-peer[aria-pressed="true"] { background:var(--surface-2); border-color:var(--ink); box-shadow:0 0 0 1px var(--ink) inset; }
.app .grp-avatar { display:inline-flex; flex:0 0 36px; align-items:center; justify-content:center; width:36px; height:36px; aspect-ratio:1; border-radius:50%; background:var(--surface-2); color:var(--ink); font-size:12px; font-weight:900; line-height:1; }
.app .grp-peer .grp-avatar { width:25px; height:25px; flex-basis:25px; font-size:10px; }
.app .grp-main-actions { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr) 44px; gap:6px; max-width:520px; padding:5px; border:1px solid var(--line); border-radius:14px; background:var(--surface-2); margin:0 0 14px; }
.app .grp-main-actions button { min-height:44px; padding:9px 12px; font-size:13px; border:1px solid transparent; border-radius:9px; background:transparent; color:var(--muted); }
.app .grp-main-actions button[aria-pressed="true"] { background:var(--surface); color:var(--ink); border-color:var(--line); box-shadow:0 2px 8px #0000000d; }
.app .grp-main-actions .grp-refresh { padding:0; font-size:22px; color:var(--ink); }
.app .grp-board-filters { grid-template-columns:minmax(0,320px); margin:0 0 16px; }
.app .grp-show-stations .grp-board-filters { grid-template-columns:repeat(2,minmax(0,1fr)); max-width:660px; }
.app .grp-board-filters .grp-field { margin:0; gap:6px; font-size:12px; }
.app .grp-board-filters select { min-height:44px; padding:9px 12px; font-size:14px; }
.app .grp-board { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); align-items:start; gap:14px; }
.app .grp-board:has(> :only-child) { grid-template-columns:minmax(0,760px); justify-content:center; }
.app .grp-board-group { margin:0; padding:18px; border:1px solid var(--line); background:var(--surface-2); border-radius:18px; min-width:0; }
.app .grp-cohort-head { display:flex; gap:10px; flex-wrap:wrap; align-items:center; margin:0 0 8px; }
.app .grp-cohort-head h4 { font-size:16px; margin:0; }
.app .grp-format { display:inline-block; padding:4px 7px; border-radius:6px; font-size:10px; font-weight:800; line-height:1.3; background:var(--surface); color:var(--ink); }
.app .grp-board-group .grp-basis { margin:0 0 4px; padding:0; border:0; background:transparent; font-size:11px; line-height:1.4; color:var(--muted); }
.app .grp-round-result { margin-top:10px; border-radius:12px; }
.app .grp-round-result > summary { padding:12px; gap:10px; min-height:72px; }
.app .grp-round-result > summary > div { gap:4px; }
.app .grp-round-result summary b { font-size:13px; line-height:1.35; }
.app .grp-round-result summary .small { font-size:11px; }
.app .grp-round-result .grp-time { font-size:22px; flex-shrink:0; }
.app .grp-own-round { border-color:var(--ink); }
.app .grp-own-round .grp-avatar { background:#d1ed00; color:#182008; }
.app .grp-round-result[open] > summary { border-bottom:1px solid var(--line); }
.app .grp-round-result[open] .grp-expand { transform:rotate(180deg); }
.app .grp-split-details { margin:14px; font-size:12px; gap:9px 12px; }
.app .grp-total-note { margin:12px 14px; font-size:11px; line-height:1.5; }
.app .grp-social-empty { grid-column:1/-1; display:flex; flex-direction:column; align-items:center; padding:32px 20px; border:1px dashed var(--line); border-radius:18px; background:var(--surface-2); text-align:center; }
.app .grp-social-empty h4 { font-size:18px; margin:12px 0 6px; }
.app .grp-social-empty p { max-width:400px; font-size:13px; margin:0 0 16px; }
.app .grp-empty-icon { display:flex; align-items:center; justify-content:center; width:46px; height:46px; background:#d1ed00; color:#1c2408; border-radius:14px; font-size:24px; }
.app .grp-detail > .ex-optional { margin-top:18px; }
.app .grp-share-preview { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:6px 12px; padding:14px; background:var(--surface); border:1px solid var(--line); border-radius:12px; margin:12px 0; }
.app .grp-share-preview .small { grid-column:1/-1; }
.app .grp-share-preview b { font-size:13px; }
.app .grp-share-preview .grp-time { font-size:22px; color:var(--ink); }
.app .grp-release-row { align-items:center; margin:10px 0 0; padding:14px; border-radius:12px; border:1px solid var(--line); background:var(--surface); }
.app .grp-release-row > div { flex:1 1 200px; min-width:0; overflow-wrap:anywhere; }
.app .grp-release-row b { font-size:14px; }
.app .grp-release-row p { margin:4px 0; font-size:12px; }
.app .grp-release-row button { min-height:44px; font-size:12px; }
.app .grp-byname [hidden],.app .grp-board [hidden] { display:none !important; }
@media(max-width:900px) { .app .grp-board { grid-template-columns:1fr; } }
@media(max-width:620px) {
  .app .grp-social-hero { padding:18px; border-radius:18px; margin-bottom:18px; }
  .app .grp-social-hero::before { background-size:155px; opacity:.13; }
  .app .grp-social-hero h2 { font-size:30px; }
  .app .grp-social-hero .grp-connect-actions { margin-top:16px; gap:8px; }
  .app .grp-social-hero .grp-connect-actions > button { font-size:12px; padding:10px 8px; min-height:44px; }
  .app .grp-request-form { grid-template-columns:1fr; align-items:start; }
  .app .grp-request-form #groupsMyName { grid-column:auto; }
  .app .grp-request-form button { justify-self:start; }
  .app .grp-page .grp-board-group { padding:12px; }
  .app .grp-round-result > summary { padding:10px; gap:8px; }
  .app .grp-round-result .grp-avatar { width:30px; height:30px; flex-basis:30px; font-size:10px; }
  .app .grp-round-result .grp-time { font-size:20px; }
  .app .grp-round-result summary b { font-size:12px; }
  .app .grp-round-result .grp-expand { font-size:14px; }
  .app .grp-detail > .grp-subhead h3 { font-size:19px; }
  .app .grp-peer-list { gap:6px; margin-bottom:14px; }
  .app .grp-peer-list .grp-peer { padding:6px 10px; font-size:12px; }
  .app .grp-social-empty { padding:25px 16px; }
}
@media(prefers-reduced-motion:no-preference) {
  .app .grp-peer,.app .grp-main-actions button { transition:background-color .15s ease,border-color .15s ease; }
  .app .grp-expand { transition:transform .15s ease; }
}
.app .profile-friend-saved { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.app .profile-friend-saved > b { overflow-wrap:anywhere; min-width:0; }

/* v42: compact sharing sheet, one form, fixed action area and contained scroll. */
.app #groupsShareDialog { width:min(520px,calc(100% - 24px)); max-height:calc(100dvh - 24px); padding:0; border:1px solid var(--line); border-radius:20px; background:var(--surface); color:var(--ink); overflow:hidden; box-shadow:0 24px 90px #00000050; }
.app #groupsShareDialog[open] { display:flex; flex-direction:column; }
.app #groupsShareDialog::backdrop { background:#090d08b8; backdrop-filter:blur(4px); }
.app #groupsShareDialog [hidden] { display:none !important; }
.app .grp-share-head { flex-shrink:0; margin:0; padding:18px 20px 14px; border-bottom:1px solid var(--line); align-items:center; background:var(--surface); }
.app .grp-share-kicker { display:block; color:var(--muted); font-size:10px; font-weight:800; letter-spacing:.08em; line-height:1.4; margin:0 0 4px; }
.app .grp-share-head h2 { margin:0; font-size:24px; line-height:1.15; letter-spacing:-.03em; color:var(--ink); }
.app #groupsShareClose { min-width:44px; width:44px; min-height:44px; height:44px; padding:0; font-size:24px; flex-shrink:0; border-radius:12px; }
.app .grp-share-body { overflow-y:auto; overscroll-behavior:contain; min-height:0; padding:16px 20px; scrollbar-gutter:stable; }
.app #groupsShareDialog #groupsSharePane { display:block; border:0; background:transparent; padding:0; margin:0; }
.app #groupsSharePane > summary { display:none; }
.app #groupsShareDialog .grp-field { margin:0; gap:6px; font-size:12px; }
.app #groupsShareDialog :is(select,input[type="text"]) { min-height:44px; padding:9px 12px; font-size:16px; }
.app #groupsShareDialog .grp-share-preview { margin:12px 0 10px; padding:12px; background:var(--surface-2); gap:5px 10px; }
.app #groupsShareDialog .grp-share-preview .grp-time { font-size:24px; }
.app #groupsShareDialog .grp-share-preview .small { font-size:11px; }
.app #groupsShareAudience { margin:0 0 12px; font-size:12px; line-height:1.45; overflow-wrap:anywhere; }
.app #groupsShareDialog #groupsConditionsPane { margin:0; padding:12px; border-radius:12px; background:var(--surface-2); }
.app #groupsShareDialog #groupsConditionsPane > summary { font-size:12px; min-height:24px; padding:0; line-height:1.5; }
.app #groupsShareDialog #groupsConditionsPane[open] > summary { margin-bottom:12px; }
.app #groupsShareDialog #groupsConditionsPane .grp-field { margin:10px 0; }
.app #groupsShareDialog #groupsConditionsPane .small { font-size:11px; line-height:1.45; }
.app #groupsShareDialog #groupsConditionsPane button { min-height:44px; padding:9px 12px; font-size:12px; }
.app #groupsShareDialog #groupsSharePane > p:last-child { margin:10px 0 0; font-size:10px; line-height:1.4; color:var(--muted); }
.app .grp-share-status { margin:12px 0 0; font-size:12px; line-height:1.5; }
.app .grp-share-footer { flex-shrink:0; padding:12px 20px 16px; border-top:1px solid var(--line); background:var(--surface); }
.app #groupsShareDialog .grp-share-footer .grp-checkbox { min-height:44px; margin:0 0 8px; padding:3px 0; align-items:center; font-size:12px; line-height:1.4; }
.app #groupsShareDialog .grp-checkbox { grid-template-columns:24px minmax(0,1fr); gap:8px; }
.app #groupsShareDialog .grp-checkbox input { width:22px; height:22px; min-height:22px; margin:0; padding:0; }
.app #groupsPublish { width:100%; min-height:46px; padding:11px 14px; font-size:14px; border-radius:12px; }
.app #groupsPublish:disabled { opacity:1; color:var(--muted); background:var(--surface-2); border-color:var(--line); cursor:not-allowed; }
@media(max-width:620px) {
  .app #groupsShareDialog { width:100%; max-width:100%; max-height:calc(100dvh - 12px); margin:0 auto; inset:auto 0 0; border-radius:20px 20px 0 0; border-bottom:0; }
  .app .grp-share-head { padding:15px 16px 12px; }
  .app .grp-share-head h2 { font-size:22px; }
  .app .grp-share-body { padding:12px 16px; }
  .app .grp-share-footer { padding:12px 16px max(14px,env(safe-area-inset-bottom)); }
}
@media(prefers-reduced-motion:no-preference) {
  .app #groupsShareDialog[open] { animation:grp-share-enter .16s ease-out; }
  @keyframes grp-share-enter { from { opacity:0; transform:translateY(12px); } to { opacity:1; transform:translateY(0); } }
}
.app #profileFriendIdentity .grp-name-claim { max-width:560px; }
.app #profileFriendIdentity button { justify-self:start; }
@media(max-width:620px){.app .profile-section--identity { padding:14px; }.app .profile-friend-saved { flex-wrap:wrap; }}
/* v43: readable exit from live mode and explicit two-step workout completion. */
.app .workout-exit-bar { position: sticky; top: 0; z-index: 10; display: flex; align-items: center; gap: 12px; padding: 8px 0; background: var(--bg); }
.app .workout-exit-bar .workout-home { width: auto; min-width: 130px; min-height: 44px; height: auto; padding: 9px 13px; border-radius: 12px; }
.app .workout-exit-bar .workout-home-label { position: static; width: auto; height: auto; overflow: visible; clip-path: none; white-space: normal; font-size: 13px; }
.app .workout-exit-bar > span { line-height: 1.35; font-size: 12px; }
.app .workout-console-head { grid-template-columns: minmax(0,1fr) auto; position: static; }
.app .finish-feedback-title { font-size: 18px; font-weight: 850; margin: 16px auto 6px; color: var(--ink); }
.app .finish-save-hint { max-width: 620px; margin: 0 auto 12px; color: var(--muted); font-size: 13px; line-height: 1.45; }
.app .finish-feeling-picker { margin-top: 0; }
.app .finish-feeling-picker .rpe-choice { border-width: 2px; }
.app .workout-finish-actions { margin-top: 16px; }
@media (max-width: 620px) {
  .app .workout-exit-bar { gap: 9px; padding-top: max(8px, env(safe-area-inset-top)); }
  .app .workout-exit-bar > span { font-size: 11px; }
  .app .workout-console-head { grid-template-columns: minmax(0,1fr) auto; }
  .app .finish-feeling-picker { gap: 6px; }
  .app .finish-feeling-picker .rpe-choice span { display: none; }
}
/* v44 community: explicit public boundary, compact and accessible comparison. */
.app :is(#communityPanel,#groupsPageBody,#communityJoin,#communityPublishOpen,#communityManage,#communityIdentityHelp)[hidden] { display:none !important; }
.app .community-tabs { display:grid; grid-template-columns:1fr 1fr; gap:6px; padding:5px; margin-bottom:16px; border:1px solid var(--line); border-radius:14px; background:var(--surface-2); max-width:480px; }
.app .community-tabs button { min-height:44px; padding:9px 14px; border:0; border-radius:10px; font-size:14px; }
.app .community-tabs button[aria-pressed="true"] { background:var(--brand); color:var(--brand-ink); }
.app .community-hero { position:relative; overflow:hidden; padding:24px; border-radius:20px; background:#10160b; background-image:linear-gradient(120deg,#171e10,#0b0f08); color:#f6f8ef; margin-bottom:16px; isolation:isolate; }
.app .community-hero::after { content:""; position:absolute; inset:0; z-index:-1; background:url('endyvo-motif.svg') right bottom/250px auto no-repeat; opacity:.16; pointer-events:none; }
.app .community-hero .eyebrow { background:#252f1b; color:#dfff00; border-color:#586d29; }
.app .community-hero h2 { color:#f6f8ef; margin:10px 0; font-size:clamp(24px,5vw,34px); line-height:1.12; }
.app .community-hero p { color:#d6dece; margin:8px 0; line-height:1.5; }
.app .community-hero .grp-actions { margin-top:16px; }
.app .community-hero button { min-height:44px; padding:10px 16px; font-size:14px; }
.app .community-filters { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; align-items:start; }
.app .community-filters .grp-field { margin:0; min-width:0; }
.app .community-filters select { min-height:44px; font-size:14px; padding:10px; width:100%; }
.app .community-fairness { margin:14px 0; line-height:1.5; font-size:12px; }
.app .community-result { border:1px solid var(--line); border-radius:14px; background:var(--surface); margin:8px 0; }
.app .community-result > summary { display:grid; grid-template-columns:36px minmax(0,1fr) auto 16px; gap:10px; align-items:center; min-height:64px; padding:12px; cursor:pointer; list-style:none; }
.app .community-result > summary::-webkit-details-marker { display:none; }
.app .community-rank { display:grid; place-items:center; width:34px; height:34px; border-radius:11px; background:var(--surface-2); color:var(--accent-text); font-weight:900; }
.app .community-athlete { min-width:0; }
.app .community-athlete :is(b,small) { display:block; overflow-wrap:anywhere; }
.app .community-athlete b { font-size:14px; }
.app .community-athlete small { margin-top:4px; font-size:11px; }
.app .community-time { font-size:21px; font-variant-numeric:tabular-nums; white-space:nowrap; }
.app .community-result-body { padding:0 14px 14px; }
.app .community-splits { display:grid; gap:4px; margin-top:10px; }
.app .community-split { display:flex; justify-content:space-between; gap:12px; padding:7px 9px; border-radius:8px; background:var(--surface-2); font-size:12px; }
.app .community-split small { display:block; margin-top:3px; font-size:10px; }
.app .community-own-row { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 0; border-bottom:1px solid var(--line); }
.app .community-own-row :is(b,small) { display:block; }
.app .community-panel > details { margin-top:14px; }
.app #communityShare { padding:0; width:min(520px,calc(100% - 24px)); max-width:calc(100% - 24px); max-height:calc(100dvh - 24px); border-radius:20px; background:var(--surface); color:var(--ink); }
.app #communitySharePreview { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px; }
.app #communitySharePreview > :is(small,details) { grid-column:1/-1; }
.app #communitySharePreview > b { font-size:14px; }
.app #communityShare[open] { display:flex; flex-direction:column; }
.app #communityShare .ex-dialog-head { padding:16px 18px; margin:0; border-bottom:1px solid var(--line); flex-shrink:0; align-items:center; }
.app #communityShare h2 { font-size:24px; margin:0; }
.app #communityShareClose { width:44px; min-width:44px; min-height:44px; padding:0; font-size:24px; }
.app .community-share-body { padding:14px 18px; min-height:0; overflow-y:auto; overscroll-behavior:contain; }
.app #communityShare :is(select,input) { font-size:16px; }
.app #communityShare label:has(input[type="checkbox"]) { display:grid; grid-template-columns:22px minmax(0,1fr); gap:9px; align-items:start; min-height:44px; font-size:12px; line-height:1.45; margin:12px 0; }
.app #communityShare label:has(input[type="checkbox"]) span { grid-column:2; grid-row:1; }
.app #communityShare input[type="checkbox"] { grid-column:1; grid-row:1; width:20px; height:20px; min-height:20px; margin:0; padding:0; }
.app #communityShare .small { font-size:12px; line-height:1.5; }
.app .community-share-footer { padding:10px 18px 16px; flex-shrink:0; border-top:1px solid var(--line); background:var(--surface); }
.app #communityPublish { width:100%; min-height:46px; padding:11px 12px; font-size:14px; }
.app #communityPublish:disabled { opacity:1; background:var(--surface-2); color:var(--muted); border-color:var(--line); }
@media(max-width:620px) {
  .app .community-hero { padding:18px; }
  .app .community-filters { grid-template-columns:1fr 1fr; gap:8px; }
  .app .community-filters .grp-field:nth-child(3) { grid-column:1/-1; }
  .app .community-result > summary { grid-template-columns:28px minmax(0,1fr) auto 12px; gap:7px; padding:10px; }
  .app .community-rank { width:28px; height:30px; }
  .app .community-time { font-size:18px; }
  .app .community-panel .history-pagination { flex-wrap:wrap; gap:8px; }
  .app #communityShare { width:100%; max-width:100%; max-height:calc(100dvh - 12px); margin:0 auto; inset:auto 0 0; border-radius:20px 20px 0 0; }
  .app .community-share-footer { padding-bottom:max(14px,env(safe-area-inset-bottom)); }
}
/* v45: own routine builder, compact live logging and explicit day decisions. */
.app .builder-dialog, .app .build-live-fields { --panel: var(--surface); --panel-2: var(--surface-2); --text: var(--ink); --accent: var(--brand); }
.app .builder-dialog { width: min(680px, calc(100% - 24px)); max-height: calc(100dvh - 24px); padding: 0; color: var(--text); background: var(--panel); }
.app .builder-dialog[open] { display: flex; flex-direction: column; }
.app .builder-dialog .dialog-head { flex: 0 0 auto; padding: 16px; margin: 0; border-bottom: 1px solid var(--line); }
.app .builder-dialog .dialog-head h2 { font-size: 21px; line-height: 1.2; }
.app .builder-dialog .dialog-head button { min-width: 44px; min-height: 44px; padding: 8px; }
.app .builder-body { overflow-y: auto; overscroll-behavior: contain; min-height: 0; padding: 16px; display: grid; gap: 14px; }
.app .builder-body h3 { margin: 0; font-size: 17px; }
.app .build-field { display: grid; align-content: start; gap: 5px; min-width: 0; font-size: 12px; font-weight: 700; }
.app .build-field input, .app .build-field select { width: 100%; min-width: 0; min-height: 44px; font-size: 16px; padding: 8px 10px; color: var(--text); background: var(--panel); border: 1px solid var(--line); border-radius: 10px; }
.app .build-field input[type="checkbox"] { width: 44px; height: 44px; accent-color: var(--accent); }
.app .build-step { display: grid; gap: 10px; margin-bottom: 12px; padding: 12px; border: 1px solid var(--line); background: var(--panel-2, var(--bg)); border-radius: 15px; }
.app .build-step-head { display: flex; justify-content: space-between; gap: 6px; align-items: center; }
.app .build-step-head b { font-size: 15px; line-height: 1.3; overflow-wrap: anywhere; }
.app .build-order { display: flex; flex-shrink: 0; gap: 3px; }
.app .build-order button, .app .build-set > button { min-width: 44px; min-height: 44px; padding: 8px; font-size: 16px; }
.app .build-sets { display: grid; gap: 8px; }
.app .build-set { display: grid; grid-template-columns: 34px minmax(0, 1fr) minmax(0, 1fr) 44px; gap: 7px; align-items: center; }
.app .build-set > span { font-size: 12px; font-weight: 700; }
.app .builder-catalog { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; }
.app .build-exercise { min-height: 44px; padding: 9px 10px; font-size: 13px; line-height: 1.25; text-align: left; white-space: normal; }
.app .builder-footer { display: grid; grid-template-columns: auto 1fr; gap: 8px; padding: 12px 16px max(12px, env(safe-area-inset-bottom)); border-top: 1px solid var(--line); flex-shrink: 0; background: var(--panel); }
.app .builder-footer button { min-height: 44px; padding: 10px; font-size: 13px; white-space: normal; }
.app #builderStatus { flex-shrink: 0; margin: 0; padding: 0 16px; font-size: 12px; }
.app #builderStatus:empty { display: none; }
.app .build-live-fields { display: grid; gap: 12px; margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--line); }
.app .build-live-fields:empty { display: none; }
.app .build-live-fields h4, .app .build-live-fields p { margin: 0; }
.app .build-live-fields button { min-height: 44px; padding: 9px 12px; font-size: 13px; }
.app .run-metrics { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 8px; }
.app .run-metrics > div { padding: 10px; background: var(--panel); border: 1px solid var(--line); border-radius: 12px; display: grid; gap: 5px; }
.app .run-metrics span { font-size: 11px; line-height: 1.3; color: var(--muted); }
.app .run-metrics b { font-size: clamp(18px, 3vw, 27px); color: var(--text); font-variant-numeric: tabular-nums; }
.app .build-live-fields details { font-size: 12px; line-height: 1.5; }
.app .build-live-fields details[open] { display: grid; gap: 10px; }
.app .workout-exit-bar.workout-exit-bottom { position: static; padding: 12px 0 0; margin-top: 12px; border-top: 1px solid var(--line); }
.app .build-live-extras { margin-top: 12px; font-size: 13px; }
.app .day-decision-actions { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.app .day-decision-actions button { min-height: 44px; padding: 8px 10px; font-size: 12px; }
.app .day-decision-actions button[aria-pressed="true"] { color: #171b0c; background: #d0eb00; border-color: #899700; }
.app .build-result-details { display: grid; gap: 8px; margin-top: 12px; }
.app .build-result-details > div { padding: 10px; border: 1px solid var(--line); border-radius: 12px; }
.app .build-result-details p { margin: 5px 0 0; line-height: 1.5; }
@media (max-width: 600px) {
  .app .builder-dialog { width: calc(100% - 12px); max-height: calc(100dvh - 12px); }
  .app .builder-dialog .dialog-head, .app .builder-body { padding: 12px; }
  .app .build-order { gap: 0; }
  .app .build-step { padding: 10px; }
  .app .builder-footer { padding-left: 12px; padding-right: 12px; }
  .app .workout-current h3 { font-size: clamp(26px, 7vw, 36px); }
  .app .run-metrics { gap: 5px; }
  .app .run-metrics > div { padding: 8px; }
}