.training-root { --training-border: #dbe5f0; --training-muted: #5b6f86; color: #17324f; min-width: 0; scroll-margin-top: calc(105px + var(--safe-top, 0px)); }
.routine-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); gap: 18px; margin-top: 20px; }
.training-session-settings { border: 1px solid #d8e4f3; background: #f7faff; padding: 14px 18px; border-radius: 16px; margin-bottom: 20px; }
.training-session-settings summary { display: flex; align-items: center; gap: 10px; cursor: pointer; min-height: 36px; }
.training-session-settings summary strong { flex: 1; font-size: 16px; }
.training-session-settings summary > span:last-child { font-size: 12px; color: #617995; }
.training-session-settings summary::after { content: '⌄'; color: #617995; }
.training-session-settings[open] summary::after { content: '⌃'; }
.training-session-settings .training-workout-fields { grid-template-columns: repeat(auto-fit,minmax(130px,1fr)); }
.training-root .button.primary, .training-dialog .button.primary { color: #fff; background: #286acb; border-color: #286acb; }
.training-root .button.primary:hover, .training-dialog .button.primary:hover { background: #1d56aa; border-color: #1d56aa; }
.training-root .button.secondary, .training-dialog .button.secondary { color: #245489; background: #f4f8ff; border-color: #cedff3; }
.training-root .button.secondary:hover, .training-dialog .button.secondary:hover { background: #e6f0ff; border-color: #8eb4e5; }
.routine-card { min-width: 0; background: #fff; border: 1px solid #d8e4f3; border-top: 3px solid #4588df; border-radius: 20px; padding: 24px; box-shadow: 0 8px 28px #183d6806; }
.routine-card[data-category="pull"] { border-top-color: #916ccc; }
.routine-card[data-category="legs"] { border-top-color: #3696aa; }
.routine-card-heading, .routine-card footer { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.routine-card-heading { margin-bottom: 20px; }
.routine-card h3 { font-size: 25px; margin-bottom: 4px; }
.routine-card p { font-size: 13px; margin: 8px 0 20px; }
.routine-card ol { list-style: none; padding: 0; margin: 0 0 12px; }
.routine-card li { display: flex; justify-content: space-between; gap: 10px; padding: 10px 0; border-top: 1px solid #edf2f8; font-size: 14px; }
.routine-card li b { color: #7285a0; }
.routine-card small { color: #7285a0; }
.routine-card footer { margin-top: 22px; flex-wrap: wrap; justify-content: flex-start; }
.routine-card footer .button { min-height: 44px; font-size: 14px; padding: 10px 13px; }
.routine-pin { color: #60758f; background: transparent; border: 0; font-size: 12px !important; padding: 8px; min-height: 44px; }
.routine-pin[aria-pressed="true"] { color: #2364b9; background: #eef5ff; border-radius: 10px; }
.routine-empty { border: 1px dashed #b8cee8; padding: 24px; border-radius: 20px; background: #f4f8ff; }
.routine-editor-fields { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 15px; margin: 22px 0; }
.routine-pin-setting { margin-bottom: 20px; }
.is-routine .training-set-labels > :last-child, .is-routine .training-check { display: none; }
.is-routine .training-set, .is-routine .training-set-labels { grid-template-columns: 40px 1fr 1fr 70px; }
.training-timer-dock { position: sticky; top: calc(96px + var(--safe-top, 0px)); z-index: 9; display: grid; grid-template-columns: 1fr 1fr auto; gap: 20px; padding: 18px 22px; margin: 0 0 26px; background: #122e50f7; color: #fff; border: 1px solid #315477; border-radius: 20px; box-shadow: 0 10px 28px #17395826; backdrop-filter: blur(18px); }
.training-timer-dock section + section { border-left: 1px solid #ffffff24; padding-left: 20px; }
.timer-caption { display: flex; align-items: center; gap: 7px; color: #a9c8ed; font-size: 12px; }
.timer-caption .training-icon { width: 16px; height: 16px; }
.training-timer-dock strong { display: block; font-size: clamp(26px, 4vw, 36px); line-height: 1.4; font-variant-numeric: tabular-nums; letter-spacing: -.035em; }
.training-timer-dock section > div:last-child { display: flex; gap: 6px; }
.timer-control { border: 1px solid #ffffff29; background: #ffffff0d; color: #d9e9ff; padding: 8px 12px; min-height: 40px; border-radius: 9px; font-size: 13px !important; }
.timer-control:hover { background: #ffffff26; color: #fff; }
.is-running [data-rest-clock] { color: #8fcaff; }
.timer-finish { display: flex; align-items: center; }
.timer-finish .button { font-size: 14px; padding: 12px 16px; min-height: 44px; }
.training-progress-reading { padding: 10px 16px; border-radius: 12px; background: #edf5ff; color: #215896; font-size: 15px; }
.training-category > .muscle-map { width: 132px !important; height: 152px !important; }
@media (max-width: 600px) {
  .routine-editor-fields { grid-template-columns: 1fr 1fr; }
  .routine-editor-fields > label:first-child { grid-column: 1 / -1; }
  .training-timer-dock { top: calc(94px + var(--safe-top, 0px)); gap: 12px; padding: 12px; border-radius: 16px; grid-template-columns: 1fr 1fr; }
  .training-timer-dock section + section { padding-left: 12px; }
  .training-timer-dock strong { font-size: 29px; }
  .timer-control { min-height: 40px; padding: 6px 8px; font-size: 12px !important; flex: 1; }
  .timer-finish { grid-column: 1 / -1; }
  .timer-finish .button { width: 100%; min-height: 38px; padding: 7px; }
  .training-subnav { display: grid; grid-template-columns: repeat(4,1fr); gap: 3px; }
  .training-subnav button { flex-direction: column; font-size: 12px !important; padding: 10px 3px !important; }
  .share-body .training-subnav { grid-template-columns: repeat(3,1fr); }
  .is-routine .training-set, .is-routine .training-set-labels { grid-template-columns: 24px 1fr 1fr 56px; }
}
.training-root .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.training-root [hidden], .training-dialog [hidden], .training-music [hidden] { display: none !important; }
.training-icon { width: 22px; height: 22px; flex: 0 0 auto; vertical-align: middle; }
.training-root .button, .training-music .button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; }
.training-root button, .training-dialog button, .training-music button { font: inherit; cursor: pointer; transition: background .18s, color .18s, box-shadow .18s, transform .18s; }
.training-root button:hover, .training-dialog button:hover, .training-music button:hover { box-shadow: 0 4px 14px #153a6612; }
.training-root button:active, .training-dialog button:active { transform: translateY(1px); }
.training-root button:focus-visible, .training-dialog button:focus-visible, .training-music button:focus-visible { outline: 3px solid #3b89e8; outline-offset: 3px; }
.training-root h2 { font: 750 clamp(26px, 3vw, 38px)/1.16 'Inter', system-ui, sans-serif; letter-spacing: -.04em; margin: 8px 0 14px; }
.training-root h3, .training-dialog h3 { font: 700 21px/1.3 'Inter', system-ui, sans-serif; margin: 0 0 12px; letter-spacing: -.02em; }
.training-root p, .training-dialog p { color: var(--training-muted, #5b6f86); line-height: 1.6; font-size: 15px; }
.training-subnav { display: flex; gap: 6px; padding: 6px; background: #e9f0f8; border: 1px solid #dfe8f2; border-radius: 16px; width: fit-content; margin-bottom: 28px; }
.training-subnav button { border: 0; border-radius: 11px; background: transparent; padding: 13px 24px; color: #5b6f86; font-weight: 650; display: flex; align-items: center; justify-content: center; gap: 8px; }
.training-subnav button.active { color: #154e90; background: #fff; box-shadow: 0 2px 8px #153a660c; }
.training-content { animation: none; }
@keyframes training-enter { from { opacity: .5; transform: translateY(4px); } to { opacity: 1; transform: none; } }
.training-hero { padding: 6px 0; display: flex; justify-content: space-between; align-items: center; gap: 24px; }
.training-hero h2 { margin: 0; display: flex; align-items: center; gap: 12px; }
.training-hero h2 .training-icon { width: 30px; height: 30px; color: #3978b9; }
.training-hero .button.primary { white-space: nowrap; background: #276acb; color: #fff; border-color: #276acb; }
.training-hero .button.primary:hover { background: #1f59ad; border-color: #1f59ad; }
.training-metrics { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin: 22px 0 32px; }
.training-metrics article { padding: 24px; border: 1px solid var(--training-border); background: #fff; border-radius: 18px; display: flex; align-items: center; gap: 18px; }
.training-metrics article > .training-icon { width: 28px; height: 28px; color: #3978b9; }
.training-metrics span { display: block; font-size: 14px; color: var(--training-muted); margin-bottom: 8px; }
.training-metrics strong { font-size: 36px; letter-spacing: -.04em; display: flex; align-items: baseline; gap: 6px; }
.training-metrics small { font-size: 14px; letter-spacing: 0; font-weight: 500; }
.training-section { margin-top: 32px; }
.training-section-title { display: flex; justify-content: space-between; align-items: center; gap: 14px; flex-wrap: wrap; margin-bottom: 18px; }
.training-section-title h3, .training-section-title h2 { margin-bottom: 0; }
.training-section-title > span { font-size: 14px; color: var(--training-muted); }
.training-categories { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.training-category { position: relative; padding: 24px; min-height: 120px; border: 1px solid #cfdef0; background: linear-gradient(140deg, #fff, #eef5ff); border-radius: 20px; text-align: left; color: #153a66; display: flex; flex-direction: column; gap: 12px; }
.training-category strong { font-size: 24px; font-weight: 750; letter-spacing: -.03em; }
.training-category span { font-size: 13px; color: #5b6f86; }
.training-category > .training-icon { width: 27px; height: 27px; color: #5685ba; }
.training-category > .muscle-map { width: 110px; height: 114px; max-width: 100%; align-self: center; }
.training-category:has(.muscle-map) { gap: 10px; }
.training-empty > .training-icon { width: 30px; height: 30px; color: #5685ba; margin-bottom: 14px; }
.training-music-head h3 { display: flex; align-items: center; gap: 10px; }
.training-category:hover { background: #dfedfe; border-color: #8db7e8; transform: translateY(-2px); }
.training-category[data-tone="cardio"], .training-category[data-tone="other"] { min-height: 105px; background: #f8fafc; }
.training-category[data-tone="pull"] { background: linear-gradient(140deg, #fff, #f0edfc); }
.training-category[data-tone="legs"] { background: linear-gradient(140deg, #fff, #e8f6fa); }
.training-sessions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.training-session-card { display: flex; align-items: center; gap: 16px; padding: 22px; background: #fff; border: 1px solid var(--training-border); border-radius: 18px; text-align: left; width: 100%; color: #17324f; }
.training-session-card:hover { background: #f1f7ff; border-color: #9bbfea; }
.training-session-card > div { min-width: 0; flex: 1; }
.training-session-card strong { display: block; font-size: 18px; overflow-wrap: anywhere; }
.training-session-card div > span { display: block; font-size: 13px; color: #5b6f86; margin-top: 6px; line-height: 1.5; }
.training-badge { display: inline-flex; align-items: center; justify-content: center; padding: 7px 11px; background: #e5efff; color: #285fab; border-radius: 9px; font-size: 12px; font-weight: 750; line-height: 1.3; white-space: nowrap; }
.training-badge[data-category="pull"] { background: #eee9fa; color: #7650a7; }
.training-badge[data-category="legs"] { background: #e2f3f6; color: #24788c; }
.training-badge[data-category="cardio"] { background: #fff0df; color: #996426; }
.training-badge[data-category="other"] { background: #edf0f3; color: #576578; }
.training-resume { display: flex; align-items: center; justify-content: space-between; gap: 18px; background: #e6f0ff; border: 1px solid #b7d3f5; padding: 22px; border-radius: 20px; margin-top: 18px; }
.training-resume strong, .training-resume span { display: block; }
.training-resume span { color: #5b6f86; font-size: 13px; margin-top: 6px; }
.training-empty { text-align: center; padding: 45px 24px; border: 1px dashed #c7d7e9; border-radius: 22px; background: #ffffff80; }
.training-empty > span { display: block; font-size: 35px; color: #4884c9; margin-bottom: 18px; }
.training-empty h3 { font-size: 20px; }
.training-template-list { display: flex; flex-wrap: wrap; gap: 12px; }
.training-template-list > div { display: flex; gap: 4px; }
.training-template { background: #fff; border: 1px solid var(--training-border); border-radius: 13px; padding: 10px; color: #17324f; }
.training-template .training-badge { margin-right: 8px; }
.training-session-head { display: flex; gap: 20px; justify-content: space-between; align-items: center; }
.training-workout-fields { display: grid; grid-template-columns: 1.3fr 1fr 1fr auto; gap: 14px; margin: 20px 0; }
.training-root label, .training-dialog label { display: flex; flex-direction: column; gap: 8px; color: #516b87; font-size: 14px; min-width: 0; }
.training-root input:not([type="checkbox"]), .training-root select, .training-root textarea, .training-dialog input, .training-dialog select { min-width: 0; width: 100%; min-height: 48px; border: 1px solid #ccdaea; border-radius: 11px; padding: 10px 12px; font: 500 16px/1.4 'Inter', system-ui, sans-serif; color: #17324f; background: #fff; }
.training-root input:focus, .training-root select:focus, .training-root textarea:focus, .training-dialog input:focus { outline: 3px solid #5d9eed38; border-color: #5890d7; }
.training-root input[type="checkbox"] { width: 22px; height: 22px; accent-color: #2868b1; flex: 0 0 auto; cursor: pointer; }
.training-duration { padding: 10px 16px; display: flex; flex-direction: column; justify-content: center; gap: 5px; background: #e8f1fc; border-radius: 12px; }
.training-duration span { font-size: 12px; color: #58708d; }
.training-duration strong { font-size: 26px; font-variant-numeric: tabular-nums; }
.training-tools { display: flex; flex-wrap: wrap; gap: 16px 25px; padding: 12px 0 24px; align-items: center; }
.training-root .training-inline { flex-direction: row; align-items: center; gap: 10px; }
.training-inline select { width: auto; }
.training-rest { position: sticky; top: calc(95px + env(safe-area-inset-top, 0px)); z-index: 8; padding: 16px 22px; border: 1px solid #7ca6d6; color: white; background: #143a64f5; border-radius: 18px; display: flex; justify-content: space-between; align-items: center; margin-bottom: 22px; box-shadow: 0 10px 30px #163d6633; backdrop-filter: blur(15px); }
.training-rest > div { display: flex; gap: 12px; align-items: center; }
.training-rest strong { font-size: 30px; font-variant-numeric: tabular-nums; }
.training-rest span { font-size: 14px; color: #bdd6f1; }
.training-rest .button.secondary { background: #ffffff18; color: #fff; border-color: #ffffff3b; }
.training-exercise-cards { display: grid; gap: 22px; }
.training-exercise-card { padding: 26px; background: #fff; border: 1px solid var(--training-border); border-radius: 22px; }
.training-exercise-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 15px; }
.training-exercise-head h3 { margin-top: 8px; }
.training-exercise-head p { font-size: 13px; margin: 0 0 20px; }
.training-icon-button { min-width: 44px; height: 44px; border: 1px solid #d6e1ef; background: #f3f7fc; border-radius: 11px; font-size: 22px !important; color: #5076a0; }
.training-set-labels, .training-set { display: grid; grid-template-columns: 40px minmax(50px, 1fr) minmax(50px, 1fr) 80px 52px; gap: 12px; align-items: center; }
.training-set-labels { color: #6b7d90; font-size: 12px; text-align: center; padding: 8px 4px; }
.training-set { padding: 8px 4px; border-radius: 12px; margin-bottom: 3px; }
.training-set > span { text-align: center; font-weight: 650; color: #6b7d90; font-size: 15px; }
.training-set > input[type="checkbox"] { justify-self: center; }
.training-set > input[type="number"] { text-align: center; font-size: 20px; font-weight: 700; font-variant-numeric: tabular-nums; }
.training-set.is-done { background: #eaf3ff; }
.training-check { border: 1px solid #cad8e8; background: #f3f7fc; color: #6686ad; border-radius: 12px; min-height: 48px; font-size: 25px !important; }
.is-done .training-check { background: #235b99; color: white; border-color: #235b99; }
.training-set-actions { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 16px; }
.training-text-button { background: none; border: 0; color: #527193; padding: 10px; min-height: 44px; font-size: 13px !important; }
.training-add-exercise { width: 100%; border: 1px dashed #8bb0db; border-radius: 17px; background: #ebf3ff; padding: 20px; color: #255888; font-weight: 700 !important; margin: 22px 0; }
.training-note textarea { resize: vertical; }
.training-finish { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-top: 24px; border-top: 1px solid #dbe5f0; padding: 24px 0; flex-wrap: wrap; }
.training-finish > span { font-size: 14px; color: #647d96; }
.training-finish > div { display: flex; gap: 10px; flex-wrap: wrap; }
.training-message:not(:empty) { position: sticky; bottom: 110px; z-index: 12; margin-top: 14px; padding: 16px 20px; border: 1px solid #acd0f6; background: #e5f1ff; box-shadow: 0 5px 18px #12396615; border-radius: 15px; color: #234f83; font-size: 15px; }
.training-calendar-layout { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(260px, 1fr); gap: 20px; }
.training-calendar { background: #fff; border: 1px solid var(--training-border); padding: 22px; border-radius: 22px; touch-action: pan-y; }
.training-calendar-nav { display: flex; gap: 8px; align-items: center; margin-bottom: 22px; }
.training-calendar-nav select { width: auto; flex: 1; }
.training-calendar-nav select[data-training-year] { flex: 0 1 100px; }
.training-calendar-labels, .training-calendar-week { display: grid; grid-template-columns: 40px repeat(7, minmax(0, 1fr)); gap: 4px; }
.training-calendar-labels { text-align: center; font-size: 12px; color: #7890a9; margin-bottom: 12px; }
.training-calendar-week { margin-bottom: 4px; }
.training-day { border: 1px solid transparent; border-radius: 11px; min-height: 74px; background: #f5f8fc; color: #1e3e62; padding: 8px 3px; display: flex; flex-direction: column; align-items: center; gap: 5px; }
.training-day strong { font-size: 16px; }
.training-day small { font-size: 9px; line-height: 1.2; overflow: hidden; max-width: 100%; }
.training-day.selected { border-color: #367dd1; background: #e5f0ff; }
.training-day.today strong { background: #245e9f; border-radius: 50%; color: #fff; min-width: 25px; height: 25px; display: grid; place-items: center; }
.training-day.outside { opacity: .36; }
.training-day-dots { display: flex; flex-wrap: wrap; gap: 2px; min-height: 5px; justify-content: center; }
.training-day-dots i { width: 5px; height: 5px; border-radius: 50%; background: #4384d6; }
.training-day-dots i[data-category="pull"] { background: #9c78c9; }
.training-day-dots i[data-category="legs"] { background: #46a1b3; }
.training-day-dots i[data-category="cardio"] { background: #d29a52; }
.training-week-number { border: 0; border-radius: 8px; background: #eef3f9; color: #6c829b; font-size: 10px !important; padding: 1px; }
.training-week-number.selected { background: #d9e9fc; color: #245e9f; }
.training-week-number { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 3px; }
.training-week-number span { font-size: 9px; }
.training-week-number strong { font-size: 13px; }
.training-calendar-legend { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 20px; }
.training-calendar-legend .training-badge { font-size: 10px; padding: 5px 8px; }
.training-day-details { padding: 22px; background: #edf3fb; border-radius: 22px; }
.training-day-details .training-session-card { margin-bottom: 12px; flex-wrap: wrap; padding: 18px; }
.training-library-layout { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 22px; }
.training-library, .training-progress { padding: 24px; background: #fff; border: 1px solid var(--training-border); border-radius: 22px; min-width: 0; }
.training-library label { margin-bottom: 14px; }
.training-library-list { max-height: 480px; overflow: auto; }
.training-library-list > div { display: flex; margin: 4px 0; gap: 4px; }
.training-library-list > div > button:first-child { flex: 1; text-align: left; border: 0; background: transparent; border-radius: 10px; padding: 12px; font-size: 14px; color: #526c87; }
.training-library-list > div > button.selected:first-child { color: #1b579d; background: #e8f2ff; font-weight: 700; }
.training-library-list .training-icon-button { border: 0; background: transparent; }
.training-progress-chart { width: 100%; overflow: visible; }
.training-progress-chart text { font: 12px system-ui, sans-serif; fill: #6c829b; }
.training-chart-grid { stroke: #dfe8f1; stroke-dasharray: 4 5; }
.training-progress-chart g { cursor: pointer; }
.training-progress-history { max-height: 430px; overflow: auto; }
.training-progress-history button { display: flex; width: 100%; justify-content: space-between; align-items: center; gap: 16px; padding: 16px 8px; border: 0; border-top: 1px solid #e4ebf3; background: transparent; color: #234b77; text-align: left; font-size: 14px; }
.training-progress .training-section-title select { width: auto; max-width: 210px; }
.training-dialog { width: min(640px, calc(100% - 28px)); max-height: calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 50px); margin: auto; padding: 0; border: 1px solid #d6e2f0; border-radius: 24px; color: #17324f; background: #f9fbfe; }
.training-dialog::backdrop { background: #102d4d80; backdrop-filter: blur(4px); }
.training-dialog { inset-block: var(--safe-top, 0px) var(--safe-bottom, 0px); max-height: calc(100dvh - var(--safe-top, 0px) - var(--safe-bottom, 0px) - 32px); }
.training-rest { top: calc(95px + var(--safe-top, 0px)); }
.training-dialog > header { display: flex; align-items: center; justify-content: space-between; padding: 22px 24px; border-bottom: 1px solid #e0e8f2; gap: 15px; position: sticky; top: 0; z-index: 1; background: #f9fbfef5; }
.training-dialog h2 { font: 750 25px/1.25 system-ui, sans-serif; margin: 0; }
.training-dialog-content { padding: 24px; }
.training-dialog-content > label { margin-bottom: 20px; }
.training-detail-exercise { background: #fff; border: 1px solid #dce6f2; border-radius: 15px; padding: 18px; margin: 16px 0; }
.training-detail-exercise > div { display: flex; justify-content: space-between; gap: 16px; padding: 9px 0; font-size: 15px; }
.training-detail-exercise > div > span { color: #6b8098; font-size: 13px; }
.training-dialog-actions { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 24px; }
.training-picker-list { display: grid; gap: 5px; max-height: 50dvh; overflow: auto; margin-bottom: 20px; }
.training-picker-list button { padding: 15px; background: #fff; color: #24486e; border: 1px solid #e0e8f1; border-radius: 11px; text-align: left; display: flex; justify-content: space-between; }
.training-picker-list small { color: #7890a9; }
.training-music { border: 1px solid #c9d9ec; background: #f9fcff; border-radius: 21px; padding: 20px; margin-top: 28px; box-shadow: 0 5px 20px #153a6608; }
.training-music-head { display: flex; justify-content: space-between; align-items: center; gap: 14px; }
.training-music h3 { font-size: 19px; margin: 0 0 4px; }
.training-music p { color: #65809e; font-size: 12px; margin: 4px 0; }
.training-player { display: flex; align-items: center; gap: 15px; flex-wrap: wrap; margin-top: 18px; }
.training-player > strong { min-width: 0; flex: 1 1 190px; font-size: 15px; overflow-wrap: anywhere; }
.training-player-controls { display: flex; gap: 6px; }
.training-music.has-music .training-player-controls { position: fixed; right: 28px; bottom: 26px; z-index: 18; padding: 8px; background: #143a64f2; border: 1px solid #7ea2c94d; border-radius: 16px; box-shadow: 0 8px 30px #0e31583b; backdrop-filter: blur(12px); }
.training-music.has-music .training-player-controls .training-icon-button { background: #ffffff13; border-color: #ffffff28; color: white; }
.training-player input[type="range"] { flex: 1 1 100%; width: 100%; accent-color: #316fb4; min-height: 25px; }
.training-player-time { font-size: 12px; color: #6a8098; font-variant-numeric: tabular-nums; }
.training-playlist { margin-top: 16px; max-height: 250px; overflow: auto; }
.training-playlist button { background: transparent; border: 0; padding: 13px 8px; color: #526e8d; border-top: 1px solid #e0e9f3; width: 100%; text-align: left; font-size: 14px; }
.training-playlist button.active { color: #205eab; font-weight: 700; }
@media (max-width: 1100px) {
  .training-calendar-layout { grid-template-columns: 1fr; }
  .training-library-layout { grid-template-columns: 230px minmax(0, 1fr); }
  .training-sessions { grid-template-columns: 1fr; }
  .training-workout-fields { grid-template-columns: 1fr 1fr; }
  .training-metrics small { display: block; margin-top: 4px; }
}
@media (max-width: 640px) {
  .training-music.has-music .training-player-controls { right: 17px; bottom: calc(106px + var(--safe-bottom, env(safe-area-inset-bottom, 0px))); }
  .training-subnav { width: 100%; margin-bottom: 20px; }
  .training-subnav button { flex: 1; padding: 12px 5px; font-size: 14px; gap: 5px; }
  .training-subnav .training-icon { width: 19px; height: 19px; }
  .training-hero { padding: 4px 0; flex-wrap: wrap; gap: 16px; }
  .training-hero h2 { font-size: 32px; }
  .training-metrics { gap: 8px; margin: 14px 0 24px; }
  .training-metrics article { padding: 17px 13px; border-radius: 15px; align-items: flex-start; flex-direction: column; gap: 12px; }
  .training-metrics span { font-size: 13px; }
  .training-metrics strong { font-size: 29px; }
  .training-metrics small { font-size: 13px; }
  .training-categories { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .training-category { padding: 20px 16px; min-height: 110px; }
  .training-category strong { font-size: 23px; }
  .training-category span { font-size: 11px; }
  .training-session-card { padding: 17px; gap: 12px; }
  .training-session-card strong { font-size: 16px; }
  .training-session-card div > span { font-size: 12px; }
  .training-resume { padding: 16px; flex-direction: column; align-items: stretch; font-size: 15px; }
  .training-session-head { align-items: flex-start; flex-direction: column; gap: 0; }
  .training-workout-fields { gap: 12px; }
  .training-workout-fields > label:first-child { grid-column: 1 / -1; }
  .training-duration { grid-column: 1 / -1; flex-direction: row; justify-content: space-between; align-items: center; }
  .training-exercise-card { padding: 19px 12px; border-radius: 19px; }
  .training-exercise-head { padding: 0 5px; }
  .training-exercise-head h3 { font-size: 21px; }
  .training-set-labels, .training-set { grid-template-columns: 25px minmax(45px, 1fr) minmax(45px, 1fr) 49px 44px; gap: 6px; }
  .training-set-labels { font-size: 10px; }
  .training-set input[type="number"] { padding: 8px 3px; font-size: 19px; min-height: 49px; }
  .training-rest { top: calc(90px + var(--safe-top, 0px)); padding: 12px; gap: 8px; }
  .training-rest > div { gap: 6px; flex-wrap: wrap; }
  .training-rest strong { font-size: 25px; }
  .training-rest span { font-size: 12px; }
  .training-rest .button { font-size: 11px; padding: 8px; min-height: 44px; }
  .training-finish > div { display: grid; grid-template-columns: 1fr 1fr; width: 100%; }
  .training-finish .primary { grid-column: 1 / -1; }
  .training-calendar { padding: 14px 8px; border-radius: 18px; }
  .training-calendar-labels, .training-calendar-week { grid-template-columns: 28px repeat(7, minmax(0, 1fr)); gap: 3px; }
  .training-calendar-nav { gap: 5px; }
  .training-calendar-nav select { padding: 8px 3px; font-size: 13px; }
  .training-calendar-nav select[data-training-year] { flex: 0 1 74px; }
  .training-calendar-nav .training-icon-button { min-width: 36px; }
  .training-day { min-height: 60px; padding: 6px 1px; border-radius: 8px; }
  .training-day strong { font-size: 14px; }
  .training-day small { display: none; }
  .training-week-number { font-size: 8px !important; }
  .training-calendar-legend { gap: 5px; justify-content: center; }
  .training-calendar-legend .training-badge { padding: 5px 6px; font-size: 9px; }
  .training-library-layout { grid-template-columns: 1fr; }
  .training-library, .training-progress { padding: 20px; }
  .training-library-list { max-height: 200px; }
  .training-progress-history button { font-size: 12px; }
  .training-dialog-content { padding: 20px 16px; }
  .training-dialog > header { padding: 18px 16px; }
  .training-dialog h2 { font-size: 23px; }
  .training-detail-exercise { padding: 15px; }
  .training-detail-exercise > div { font-size: 14px; }
  .training-music { padding: 18px; }
  .training-music-head { flex-wrap: wrap; }
}
@media (prefers-reduced-motion: reduce) { .training-content { animation: none; } .training-root *, .training-dialog * { transition: none !important; scroll-behavior: auto !important; } }
/* Session controls occupy one compact opaque shelf, with no content showing through. */
.training-timer-shelf { position: fixed; top: var(--app-header-height, calc(88px + var(--safe-top, 0px))); left: 0; right: 0; z-index: 24; margin: 0; padding: 8px 16px 12px; background: #f3f6fc; isolation: isolate; }
.training-timer-shelf::before { content: ""; position: absolute; inset: -2px 0 0; background: #f3f6fc; z-index: -1; }
.training-timer-shelf .training-timer-dock { position: static; margin: 0; padding: 10px 14px; display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr) 48px; gap: 14px; border: 1px solid #24476f; border-radius: 16px; background: #163757; backdrop-filter: none; box-shadow: none; }
.training-timer-shelf .training-timer-dock section + section { border-left: 1px solid #46617d; padding-left: 14px; }
.training-timer-shelf .timer-readout { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 12px; margin-bottom: 5px; }
.timer-readout > span { font-size: 12px; color: #b5cce6; }
.training-timer-shelf .timer-readout strong { font-size: 26px; line-height: 1.15; letter-spacing: -.03em; }
.training-timer-shelf .timer-control { min-width: 44px; min-height: 44px; height: 44px; padding: 6px 12px; border-radius: 9px; font-size: 12px !important; background: #264968; border-color: #45617d; display: inline-flex; align-items: center; justify-content: center; }
.training-timer-shelf .timer-reset { padding: 8px; flex: 0 0 44px; }
.training-timer-shelf .timer-control:hover { background: #365f88; }
.training-timer-shelf .timer-control .training-icon { width: 16px; height: 16px; }
.training-timer-shelf .timer-finish { grid-column: auto; align-self: center; }
.training-timer-shelf .timer-finish .button { width: 48px; min-width: 44px; min-height: 48px; padding: 10px; border-radius: 12px; }
.training-timer-shelf .training-timer-dock { max-width: 1200px; margin-inline: auto; }
.training-timer-shelf .button.primary { background: #286acb; border-color: #4686de; color: #fff; display: inline-flex; align-items: center; justify-content: center; }
.training-timer-shelf [hidden], .training-timer-shelf[hidden], .training-global-return[hidden], .training-music[hidden] { display: none !important; }
.training-timer-spacer { height: var(--training-timer-height, 140px); }
.training-timer-shelf button { cursor: pointer; font: inherit; }
.training-timer-shelf button:focus-visible, .training-global-return:focus-visible { outline: 3px solid #75b5ff; outline-offset: 3px; }
.training-session-active .app-share-header { background: #fff; backdrop-filter: none; }
.training-session-active .app-share-main { scroll-padding-top: calc(var(--app-header-height, 88px) + var(--training-timer-height, 140px) + 16px); }
html:has(.training-session-active) { scroll-padding-top: calc(var(--app-header-height, 88px) + var(--training-timer-height, 140px) + 16px); }
.training-global-return { position: fixed; right: 28px; bottom: 24px; z-index: 24; display: flex; align-items: center; gap: 12px; max-width: calc(100% - 32px); padding: 12px 18px; border: 1px solid #3c70a6; border-radius: 18px; background: #163757; color: #fff; box-shadow: 0 8px 28px #173b5f30; cursor: pointer; text-align: left; }
.training-global-return strong { display: block; font-size: 14px; font-weight: 700; }
.training-global-return small { display: block; max-width: 170px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; color: #b9d3ed; font-size: 12px; margin-top: 3px; }
.training-global-return [data-return-clock] { font-variant-numeric: tabular-nums; font-size: 17px; font-weight: 750; }
.training-global-return:hover { background: #24527e; }
.training-live-dot { width: 8px; height: 8px; flex: 0 0 8px; border-radius: 50%; background: #89c6ff; box-shadow: 0 0 0 5px #89c6ff18; }
.has-training-return .app-share-main { padding-bottom: 110px; }
.training-calendar-top { display: flex; align-items: center; justify-content: space-between; margin-top: 22px; margin-bottom: 14px; }
.training-calendar-top h3 { margin: 0; }
.training-history h3 small { font-size: 15px; color: #637e99; font-weight: 500; }
.training-history .label { margin-bottom: 7px; display: block; }
.training-session-card > .muscle-map { width: 64px; height: 74px; flex: 0 0 64px; }
.training-session-card .training-badge { width: fit-content; margin-bottom: 6px; font-size: 10px; }
.routine-card-identity { display: grid; grid-template-columns: 112px minmax(0, 1fr); align-items: center; gap: 18px; }
.routine-card-identity .muscle-map { width: 112px; height: 135px; }
.routine-card-identity span { display: block; font-size: 12px; color: #627b96; line-height: 1.65; margin-top: 8px; }
.routine-builder { display: grid; grid-template-columns: minmax(0, 1fr) 220px; align-items: center; gap: 28px; margin: 20px 0 28px; padding: 24px; background: #fff; border: 1px solid #dbe5f0; border-radius: 20px; }
.routine-builder .routine-editor-fields { margin-top: 0; grid-template-columns: 1fr 1fr; }
.routine-builder .routine-editor-fields > label:first-child { grid-column: 1 / -1; }
.routine-muscle-preview { margin: 0; padding: 18px; border-radius: 16px; background: #f3f7fd; text-align: center; }
.routine-muscle-preview .muscle-map { width: 152px; max-width: 100%; height: 178px; }
.routine-muscle-preview figcaption { font-size: 12px; line-height: 1.65; color: #526e8c; margin-top: 8px; }
.routine-picker-preview { float: right; width: 100px; margin-left: 16px; }
.routine-picker-preview .muscle-map { width: 100%; height: 120px; }
.routine-picker-list { clear: both; margin: 20px 0; }
.routine-picker-list section { margin-bottom: 20px; }
.routine-picker-list h3 { font-size: 15px; color: #587797; }
.routine-picker-list label, .custom-muscle-fields label { display: flex; align-items: center; gap: 12px; min-height: 48px; padding: 10px 12px; border: 1px solid #dfE8f2; border-radius: 12px; background: #fff; margin-top: 6px; cursor: pointer; }
.routine-picker-list label:has(input:checked) { background: #eaf3ff; border-color: #7badde; color: #174e88; }
.routine-picker-list input, .custom-muscle-fields input { width: 20px; height: 20px; min-height: 20px; flex: 0 0 20px; accent-color: #286acb; }
.routine-picker-footer { position: sticky; bottom: -24px; display: flex; flex-wrap: wrap; gap: 10px; padding: 16px 0; background: #f9fbfe; border-top: 1px solid #dce6f2; }
.custom-muscle-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; border: 0; padding: 0; margin: 0 0 20px; }
.custom-muscle-fields legend { margin-bottom: 8px; font-weight: 650; }
.custom-muscle-fields label { font-size: 12px; }
.training-music { margin-top: 0; }
.training-music.has-music .training-player-controls { position: static !important; background: #eaf2fe; border: 1px solid #c9def6; box-shadow: none; padding: 12px; border-radius: 20px; justify-content: center; width: fit-content; margin: 20px auto; }
.training-music .training-player-controls button { width: 52px; height: 52px; }
.training-music .training-player-controls [data-music="toggle"] { width: 64px; height: 64px; color: #fff; background: #286acb; }
.training-music [data-music-title] { display: block; text-align: center; font-size: 24px; margin-top: 22px; }
.training-music .training-player-time { display: block; text-align: center; }
.has-active-session .training-subnav { margin-bottom: 2px; padding: 3px; border-radius: 12px; gap: 3px; }
.has-active-session .training-subnav button { min-height: 40px; padding: 8px 15px; font-size: 13px; flex-direction: row; }
.has-active-session .training-session-settings { padding: 6px 14px; margin-bottom: 12px; border-radius: 12px; }
.has-active-session .training-session-settings summary { min-height: 34px; }
.has-active-session .training-exercise-cards { gap: 14px; }
.has-active-session .training-exercise-card { padding: 18px; border-radius: 18px; }
.has-active-session .training-exercise-head h3 { margin-top: 4px; margin-bottom: 5px; }
.has-active-session .training-exercise-head p { margin-bottom: 10px; }
.has-active-session .training-exercise-head .label { font-size: 10px; }
.unified-app-body:has([data-workspace-panel="training"]:not([hidden]) .has-active-session) .app-share-header { background: #fff; backdrop-filter: none; }
@media (max-width:600px) {
  .training-global-return { right: 16px; bottom: calc(102px + var(--safe-bottom, 0px)); padding: 10px 14px; }
  .has-training-return .app-share-main { padding-bottom: calc(195px + var(--safe-bottom, 0px)); }
  .routine-builder { grid-template-columns: 1fr; padding: 18px; gap: 14px; }
  .routine-muscle-preview { display: flex; align-items: center; gap: 16px; text-align: left; }
  .routine-muscle-preview .muscle-map { width: 108px; height: 128px; flex: 0 0 108px; }
  .routine-card-identity { grid-template-columns: 100px minmax(0, 1fr); gap: 14px; }
  .routine-card-identity .muscle-map { width: 100px; height: 120px; }
  .routine-picker-footer { bottom: -20px; }
  .share-body .training-subnav { grid-template-columns: repeat(2, 1fr); }
  .has-active-session .training-subnav { display: grid; grid-template-columns: repeat(4, 1fr); }
  .has-active-session .training-subnav button { padding: 5px 2px !important; font-size: 12px !important; }
  .has-active-session .training-subnav .training-icon { display: none; }
  .training-timer-shelf .training-timer-dock { gap: 10px; padding: 10px; grid-template-columns: minmax(0,1fr) minmax(0,1fr) 44px; border-radius: 14px; }
  .training-timer-shelf .training-timer-dock section + section { padding-left: 10px; }
  .training-timer-shelf .timer-readout { flex-direction: column; gap: 1px; align-items: flex-start; }
  .training-timer-shelf .timer-readout strong { font-size: 25px; }
  .training-timer-shelf .timer-control { padding: 6px 8px; }
  .training-timer-shelf .timer-finish .button { width: 44px; min-height: 44px; }
  .has-active-session .training-exercise-card { padding: 16px 12px; }
  .has-active-session .training-set, .has-active-session .training-set-labels { gap: 8px; }
}

/* Focused workout: one exercise at a time, without a long stack of cards. */
.training-root { color: var(--ink); --training-border: var(--line); --training-muted: var(--muted); }
.training-root h2, .training-root h3, .training-dialog h2, .training-dialog h3 { font-family: inherit; font-weight: 700; }
.training-subnav { background: transparent; border: 0; border-bottom: 1px solid var(--line); border-radius: 0; padding: 0 0 8px; gap: 6px; }
.training-subnav button { border-radius: 10px; padding: 12px 20px; font-size: 15px; }
.training-subnav button.active { background: #e9effc; color: #285bcb; box-shadow: none; }
.training-root .button.primary, .training-dialog .button.primary { background: #2c62dd; border-color: #2c62dd; }
.training-root .button.secondary, .training-dialog .button.secondary { background: #f7f9fc; border-color: #dfe6f0; color: #4a6080; }
.training-hero h2 { font-size: clamp(28px, 3vw, 36px); }
.training-metrics article, .training-library, .training-progress, .training-calendar, .routine-card, .routine-builder, .training-music { border-radius: 18px; border-color: var(--line); box-shadow: 0 2px 5px #172a4305; }
.training-day { min-height: 60px; border-radius: 10px; background: #f5f7fb; }
.training-day:hover { background: #eaf0fd; }
.training-day.selected { background: #e5edff; border-color: #9fb9f0; }
.training-calendar-legend { padding-top: 14px; }
.training-metrics strong { font-weight: 650; color: #213550; }
.training-metrics article > .training-icon { color: #7085a5; }
.routine-card { border-top-width: 1px; }
.routine-card-heading { margin-bottom: 10px; }
.routine-card-identity { grid-template-columns: 96px minmax(0,1fr); gap: 18px; }
.routine-card-identity .muscle-map { width: 96px; height: 116px; }
.routine-card h3 { font-size: 24px; }
.routine-card li { font-size: 15px; }
.routine-card footer .button.primary { flex: 1; }
.training-session-card { border-radius: 16px; }
.training-dialog { background: #fff; }
.training-dialog > header { background: #fff; border-bottom-color: #e6ebf3; }
.training-dialog > header h2 { font-size: 25px; letter-spacing: -.035em; }
.training-dialog-content { background: #fff; }
.start-picker-caption { margin: 0 0 16px; }
.start-routine-list { display: grid; gap: 12px; }
.start-routine-option { display: flex; align-items: center; gap: 18px; width: 100%; text-align: left; border: 1px solid #dfe6f0; border-radius: 16px; background: #fbfcfe; padding: 16px; color: #1c3555; }
.start-routine-option > .muscle-map { width: 70px; height: 88px; flex: 0 0 70px; }
.start-routine-copy { display: grid; gap: 7px; flex: 1; min-width: 0; }
.start-routine-copy .training-badge { width: fit-content; font-size: 11px; padding: 4px 8px; }
.start-routine-copy strong { font-size: 20px; line-height: 1.25; overflow-wrap: anywhere; }
.start-routine-copy small { color: #60748e; font-size: 14px; }
.start-routine-play { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: #e9f0ff; color: #2c61d3; flex: 0 0 44px; }
.start-routine-play .training-icon { width: 18px; height: 18px; }
.start-routine-option:hover { border-color: #88a9ed; background: #f1f5fe; }
.start-picker-footer { margin-top: 22px; padding-top: 18px; border-top: 1px solid #e5eaf2; }
.start-existing { text-align: center; padding: 12px 0; }
.start-existing > .training-icon { width: 36px; height: 36px; color: #2c61d3; margin-bottom: 16px; }
.session-context { display: flex; justify-content: space-between; align-items: center; gap: 14px; }
.session-context > div { display: flex; align-items: center; gap: 10px; min-width: 0; }
.session-context strong { font-size: 19px; font-weight: 650; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.session-context .training-badge { font-size: 11px; padding: 5px 9px; }
.session-context .button { min-height: 44px; font-size: 14px; padding: 8px 12px; }
.session-progress { display: flex; align-items: center; gap: 14px; margin: 4px 0 12px; min-height: 42px; }
.session-progress > span { color: #687b94; font-size: 13px; white-space: nowrap; }
.session-progress [role="progressbar"] { flex: 1; height: 4px; border-radius: 4px; background: #e4eaf3; overflow: hidden; }
.session-progress i { display: block; height: 100%; background: #3877e4; border-radius: inherit; transition: width .25s ease; }
.session-progress .training-text-button { font-size: 13px; min-height: 44px; padding: 8px 0 8px 8px; }
.session-focus { background: #fff; border: 1px solid #dfe6f0; border-radius: 20px; box-shadow: 0 5px 20px #172a4305; overflow: hidden; }
.session-focus-toolbar { display: flex; align-items: center; justify-content: space-between; padding: 10px 22px; border-bottom: 1px solid #edf0f6; background: #fafbfe; gap: 12px; }
.session-exercise-picker { background: transparent; border: 0; display: flex; align-items: center; gap: 10px; color: #315884; padding: 0; min-height: 44px; font-size: 14px !important; font-weight: 600 !important; }
.session-exercise-picker .training-icon { width: 18px; height: 18px; }
.session-exercise-picker > span { padding: 3px 8px; background: #eaf0fc; color: #315fc0; border-radius: 6px; font-size: 12px; }
.session-focus-hint { color: #7c8ba0; font-size: 12px; }
.has-active-session .session-focus .training-exercise-card { border: 0; border-radius: 0; box-shadow: none; padding: 22px; margin: 0; }
.session-focus .training-exercise-head h3 { font-size: clamp(23px, 3vw, 29px); line-height: 1.2; margin: 0 0 7px; }
.session-focus .training-exercise-head p { font-size: 13px; margin: 0 0 18px; line-height: 1.5; }
.session-focus .training-exercise-head .training-icon-button { width: 36px; min-width: 36px; min-height: 44px; height: 44px; background: transparent; border: 0; color: #7e8ca0; }
.session-focus .training-set { padding: 7px 0; border-top: 1px solid #edf1f7; border-bottom: 0; border-radius: 0; background: transparent; }
.session-focus .training-set.is-done { background: #f3f7ff; border-radius: 10px; }
.session-focus .training-set > span { font-weight: 600; color: #7a8aa0; }
.session-focus .training-set input[type="number"] { min-height: 48px; border: 1px solid #dce4ef; background: #f8faff; font-size: 20px; border-radius: 10px; color: #213951; font-weight: 600; padding: 8px; }
.session-focus .training-set input:focus { background: #fff; }
.session-focus .training-set.is-done input[type="number"] { background: #edf3fe; border-color: #d2dff8; }
.session-focus .training-check { border-radius: 12px; min-height: 44px; width: 44px; background: #f0f4fa; border-color: #d9e3f0; color: #7990ab; font-size: 22px !important; }
.session-focus .training-check[aria-pressed="true"] { background: #2c62d9; border-color: #2c62d9; color: #fff; }
.session-focus .training-set-actions { padding-top: 12px; margin-top: 0; }
.session-focus .training-set-actions .button { font-size: 14px; min-height: 44px; }
.session-focus .training-set-actions .training-text-button { font-size: 12px; min-height: 44px; }
.session-exercise-nav { display: flex; justify-content: space-between; gap: 12px; padding: 16px 22px; border-top: 1px solid #e8edf5; background: #fafbfe; }
.session-exercise-nav .button { min-height: 48px; font-size: 15px; }
.session-exercise-nav .button:disabled { opacity: .4; cursor: default; }
.session-exercise-list { display: grid; gap: 8px; margin-bottom: 20px; }
.session-exercise-list > button { display: flex; align-items: center; gap: 14px; padding: 14px; border: 1px solid #e0e7f2; background: #fff; border-radius: 12px; text-align: left; color: #213956; }
.session-exercise-list > button.selected { background: #eef4ff; border-color: #9bb9ee; }
.session-exercise-list > button > span:nth-child(2) { flex: 1; display: grid; gap: 5px; }
.session-exercise-list strong { font-size: 16px; }
.session-exercise-list small { font-size: 13px; color: #637b98; }
.exercise-number { display: grid; place-items: center; width: 36px; height: 36px; flex: 0 0 36px; border-radius: 10px; color: #607b9d; background: #f1f4f9; font-size: 14px; font-weight: 700; }
.exercise-number.complete { background: #e0ebff; color: #2b61ce; }
.training-timer-shelf, .training-timer-shelf::before { background: #f5f7fa; }
.training-timer-shelf .training-timer-dock { background: #142c4b; border-color: #223c5c; padding: 8px 14px; border-radius: 14px; }
.training-timer-shelf .timer-readout { margin-bottom: 4px; }
.training-timer-shelf .timer-control { background: #233f61; border-color: #385471; font-size: 13px !important; }
.training-timer-shelf .timer-finish .button { background: #346cde; }
.training-session-active .app-share-main { padding-top: 10px; }
.training-music .training-player-controls [data-music="toggle"] { box-shadow: 0 5px 18px #2c62dd26; }
@media (min-width: 1100px) {
  .has-active-session .training-content { max-width: 850px; margin-inline: auto; }
  .training-timer-shelf .training-timer-dock { max-width: 850px; }
  .training-timer-shelf .training-timer-dock section { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
  .training-timer-shelf .timer-readout { display: grid; gap: 0; margin: 0; }
}
@media (max-width: 600px) {
  .training-subnav { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); width: 100%; gap: 3px; }
  .training-subnav button { font-size: 13px !important; gap: 6px; }
  .training-subnav .training-icon { width: 20px; height: 20px; }
  .training-day { min-height: 51px; }
  .training-metrics article { flex-direction: row; align-items: center; gap: 10px; padding: 16px 12px; }
  .training-metrics article > .training-icon { width: 22px; height: 22px; }
  .training-metrics span { font-size: 12px; line-height: 1.4; }
  .training-metrics strong { font-size: 27px; }
  .start-routine-option { gap: 12px; padding: 12px; }
  .start-routine-option > .muscle-map { width: 58px; height: 74px; flex-basis: 58px; }
  .start-routine-copy strong { font-size: 18px; }
  .start-routine-copy small { font-size: 12px; }
  .start-routine-play { width: 38px; height: 38px; flex-basis: 38px; }
  .session-context strong { font-size: 16px; }
  .session-context > div { gap: 7px; }
  .session-context .training-badge { font-size: 10px; padding: 4px 7px; }
  .session-progress { margin-block: 0 6px; gap: 10px; }
  .session-focus { border-radius: 16px; }
  .session-focus-toolbar { padding: 4px 14px; }
  .session-focus-hint { display: none; }
  .has-active-session .session-focus .training-exercise-card { padding: 16px 12px 10px; }
  .session-focus .training-exercise-head { padding: 0 2px; }
  .session-focus .training-exercise-head h3 { font-size: 24px; }
  .session-focus .training-exercise-head p { margin-bottom: 12px; font-size: 12px; }
  .session-focus .training-set-labels { font-size: 11px; }
  .session-focus .training-set { padding-block: 5px; }
  .session-focus .training-set input[type="number"] { min-height: 46px; font-size: 19px; }
  .session-exercise-nav { padding: 12px; gap: 8px; }
  .session-exercise-nav .button { font-size: 13px; padding-inline: 12px; }
  .training-timer-shelf { padding: 6px 16px 10px; }
  .training-timer-shelf .training-timer-dock { padding: 8px 10px; }
  .training-timer-shelf .timer-readout { flex-direction: row; align-items: baseline; gap: 6px; }
  .training-timer-shelf .timer-readout > span { font-size: 11px; }
  .training-timer-shelf .timer-readout strong { font-size: 23px; }
  .training-dialog .training-workout-fields { grid-template-columns: 1fr 1fr; }
}
@media (prefers-reduced-motion: reduce) { .session-progress i { transition: none; } }