.training-modular {
  box-sizing: border-box;
  width: min(100%, 960px);
  max-width: 100%;
  height: 100dvh;
  max-height: 100dvh;
  margin: auto;
  padding: 0;
  border: 1px solid var(--border, #34383d);
  border-radius: 0;
  background: var(--bg, #08090b);
  color: var(--text, #f5f7fa);
  font: inherit;
  font-size: 14px;
  letter-spacing: 0;
  overflow: hidden;
}
.training-modular *, .training-modular *::before, .training-modular *::after { box-sizing: border-box; letter-spacing: 0; }
.training-modular[open] { display: flex; flex-direction: column; }
.training-modular::backdrop { background: rgb(0 0 0 / 70%); }
.training-modular h1, .training-modular h2, .training-modular h3, .training-modular p { margin: 0; overflow-wrap: anywhere; }
.training-modular h1 { font-size: 20px; line-height: 1.25; }
.training-modular h2 { font-size: 17px; line-height: 1.4; margin-bottom: 16px; }
.training-modular h3 { font-size: 15px; line-height: 1.4; }
.training-modular p { line-height: 1.5; }
.training-modular small, .training-modular .tm-empty, .training-modular .tm-header p, .training-modular .tm-unit-heading p { color: var(--muted, #9ba3af); }
.training-modular button, .training-modular input { font: inherit; color: inherit; }
.training-modular button { min-height: 44px; cursor: pointer; overflow-wrap: anywhere; white-space: normal; }
.training-modular button:disabled { cursor: default; opacity: .5; }
.training-modular :is(button, input, summary):focus-visible { outline: 2px solid var(--cyan, #7ee8ff); outline-offset: 3px; }
.training-modular ::selection { background: var(--red, #f01f39); color: var(--text-primary); }
.training-modular svg { width: 20px; height: 20px; flex: none; }
.training-modular .tm-header { display: flex; align-items: center; gap: 12px; padding: max(12px, env(safe-area-inset-top)) 16px 12px; border-bottom: 1px solid var(--border, #34383d); }
.training-modular .tm-header > div { min-width: 0; }
.training-modular .tm-header p { margin-top: 3px; font-size: 12px; }
.training-modular .tm-icon { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 44px; width: 44px; height: 44px; padding: 10px; border: 0; border-radius: 6px; background: transparent; }
.training-modular .tm-icon:hover:not(:disabled) { background: var(--panel-3, #151820); }
.training-modular .tm-main { flex: 1; min-height: 0; overflow: auto; overscroll-behavior: contain; scrollbar-color: var(--muted, #9ba3af) transparent; scrollbar-gutter: stable; }
.training-modular .tm-draft, .training-modular .tm-catalog { min-width: 0; padding: 20px 16px; }
.training-modular .tm-draft { border-bottom: 1px solid var(--border, #34383d); }
.training-modular .tm-field { display: grid; gap: 8px; font-size: 13px; margin: 0 0 16px; }
.training-modular .tm-field input { width: 100%; min-width: 0; min-height: 44px; padding: 10px 12px; border: 1px solid var(--border, #34383d); border-radius: 6px; background: var(--panel-2, #0c0e12); caret-color: var(--cyan, #7ee8ff); font-size: 16px; }
.training-modular .tm-selection { list-style: none; margin: 0; padding: 0; }
.training-modular .tm-selection > li { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; padding: 8px 0; border-top: 1px solid var(--border, #34383d); }
.training-modular .tm-selected-title { display: flex; align-items: baseline; gap: 10px; flex: 1 1 140px; min-width: 0; }
.training-modular .tm-selected-title strong { overflow-wrap: anywhere; line-height: 1.45; }
.training-modular .tm-selected-title span { flex-shrink: 0; color: var(--muted, #9ba3af); font-variant-numeric: tabular-nums; }
.training-modular .tm-order { display: flex; gap: 2px; margin-left: auto; }
.training-modular [data-action="up"] svg { transform: rotate(90deg); }
.training-modular [data-action="down"] svg { transform: rotate(90deg); }
.training-modular .tm-unit { padding: 16px 0; border-top: 1px solid var(--border, #34383d); }
.training-modular .tm-unit-heading { display: flex; align-items: center; gap: 12px; }
.training-modular .tm-unit-heading > div { min-width: 0; flex: 1; }
.training-modular .tm-unit-heading p { font-size: 12px; margin: 3px 0; }
.training-modular .tm-cover { flex: 0 0 56px; width: 56px; height: 56px; object-fit: contain; border-radius: 4px; }
.training-modular .tm-cover[hidden] { display: none; }
.training-modular .tm-select { display: flex; align-items: center; justify-content: center; width: 44px; min-height: 44px; flex: 0 0 44px; cursor: pointer; }
.training-modular .tm-select input { width: 22px; height: 22px; min-height: 0; margin: 0; accent-color: var(--red, #f01f39); }
.training-modular .tm-summary { margin: 10px 0; font-size: 13px; white-space: pre-wrap; }
.training-modular .tm-preview { margin-top: 6px; }
.training-modular .tm-preview summary { min-height: 44px; padding: 12px 4px; cursor: pointer; font-weight: 600; }
.training-modular .tm-preview > div { padding: 4px 0 8px; }
.training-modular .tm-preview p { margin-top: 6px; font-size: 13px; white-space: pre-wrap; }
.training-modular .tm-exercises { margin: 14px 0 0; padding-left: 22px; }
.training-modular .tm-exercises > li { padding: 10px 0; border-top: 1px solid var(--border, #34383d); overflow-wrap: anywhere; }
.training-modular .tm-sets { padding: 0; list-style: none; font-size: 12px; line-height: 1.6; margin-top: 8px; font-variant-numeric: tabular-nums; }
.training-modular .tm-sets ul, .training-modular .tm-exercises ol { padding-left: 20px; }
.training-modular [data-pagination] { padding: 8px 0; }
.training-modular [role="alert"] { color: var(--text, #f5f7fa); border-left: 1px solid var(--red, #f01f39); padding-left: 10px; margin: 10px 0; }
.training-modular [role="alert"]:empty { display: none; }
.training-modular .tm-primary, .training-modular .tm-secondary { padding: 10px 16px; border: 1px solid var(--border, #34383d); border-radius: 6px; line-height: 1.4; background: var(--panel, #101216); }
.training-modular .tm-primary { background: var(--red, #f01f39); border-color: var(--red, #f01f39); color: var(--text-primary); font-weight: 700; }
.training-modular .tm-primary:hover:not(:disabled) { background: var(--red-strong, #ff4056); }
.training-modular .tm-secondary:hover:not(:disabled) { background: var(--panel-3, #151820); }
.training-modular .tm-footer { flex: none; display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 12px 16px max(12px, env(safe-area-inset-bottom)); border-top: 1px solid var(--border, #34383d); background: var(--panel, #101216); }
.training-modular .tm-footer p { flex: 1 1 120px; font-size: 12px; }
.training-modular .tm-footer button { flex: 1 1 180px; }
.training-modular.tm-confirm { width: min(440px, calc(100% - 24px)); height: auto; max-height: calc(100dvh - 24px); padding: 20px; border-radius: 8px; overflow: auto; }
.training-modular .tm-confirm-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 20px; }
.training-modular .tm-confirm-actions button { flex: 1 1 150px; }
.training-modular [data-save-status]:not(:empty) { margin-top: 12px; }
.training-modular .tm-auto { border-top: 1px solid var(--border, #34383d); margin-top: 20px; padding-top: 12px; }
.training-modular .tm-auto > summary { cursor: pointer; min-height: 44px; padding: 12px 0; font-weight: 600; }
.training-modular .tm-auto fieldset { border: 0; padding: 0; margin: 4px 0 16px; min-width: 0; }
.training-modular .tm-auto legend { padding: 0; font-size: 13px; }
.training-modular .tm-days { display: flex; flex-wrap: wrap; gap: 4px 12px; }
.training-modular .tm-days label { display: flex; align-items: center; gap: 6px; min-height: 44px; }
.training-modular .tm-days input { width: 20px; height: 20px; accent-color: var(--red, #f01f39); }
.training-modular .tm-auto-numbers { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 12px; }
.training-modular .tm-auto-numbers .tm-field { align-content: end; }
.training-modular [data-auto-status]:not(:empty), .training-modular [data-auto-preview] > p { margin-top: 12px; font-size: 13px; }
.training-modular .tm-auto-schedule { margin: 12px 0; padding-left: 20px; }
.training-modular .tm-auto-schedule li { margin-bottom: 12px; overflow-wrap: anywhere; }
.training-modular .tm-auto-schedule p { font-size: 13px; }
.training-modular [data-auto-preview] > button { margin-top: 16px; width: 100%; }
.training-modular .tm-option-list { display: flex; flex-wrap: wrap; gap: 4px 12px; max-height: 200px; overflow: auto; padding: 4px; }
.training-modular .tm-option-list label { display: flex; align-items: center; gap: 8px; min-height: 44px; max-width: 100%; overflow-wrap: anywhere; }
.training-modular .tm-option-list input { flex: none; width: 20px; height: 20px; accent-color: var(--red, #f01f39); }
.training-modular [data-options-status] { margin: 8px 0; font-size: 13px; }
@media (min-width: 720px) {
  .training-modular:not(.tm-confirm) { height: min(860px, calc(100dvh - 40px)); border-radius: 8px; }
  .training-modular .tm-main { display: grid; grid-template-columns: minmax(260px, 1fr) minmax(0, 1.5fr); align-items: start; }
  .training-modular .tm-draft { border-bottom: 0; }
  .training-modular .tm-catalog { border-left: 1px solid var(--border, #34383d); }
  .training-modular .tm-footer button { flex: 0 1 260px; }
}
@media (max-width: 374px) {
  .training-modular .tm-header, .training-modular .tm-draft, .training-modular .tm-catalog, .training-modular .tm-footer { padding-left: 12px; padding-right: 12px; }
  .training-modular .tm-unit-heading { gap: 8px; }
}