/* ═══ Спортзал (задача 8) ═════════════════════════════════════════
   Каркас, герой и карточки-списки общие с разделами «Ещё» (css/more.css), здесь только своё.
   · герой зелёный: тренировка, как здоровье жёлтое и фокус коралловый;
   · упражнение карточкой: сверху план и прошлый раз, раскрытая показывает лестницу строками:
     вес и повторы крупными цифрами (касание меняет), рядом «было», справа круглая отметка;
     сделанная ступень зелёная, следующая с коралловой рамкой: действие только там;
   · подсказка прогрессии жёлтым сигналом, «Принять» коралловой кнопкой;
   · порядок упражнений строками с ручкой, строка едет за пальцем;
   · все цели касания от 44 px, на телефоне одной рукой.
   Файл подключён раньше more.css, поэтому общие классы перебиваем парой: .m-hero.gy-hero. */

.m-hero-green { --hero-a: #1D3128; --hero-b: #161B18; --glow: rgba(92, 196, 154, .36); --glow-2: rgba(92, 196, 154, .1); }

/* ── герой ────────────────────────────────────────────────────── */
.m-hero.gy-hero { gap: 16px; padding: 24px 16px 18px; }
.gy-hero .m-hero-glow { left: 22%; top: 34px; }
.gy-hero-row { display: flex; align-items: center; gap: 18px; width: 100%; padding: 0 4px; }
.gy-ring .m-ring-in b {
  font-family: var(--disp); font-size: 26px; font-weight: 700; letter-spacing: -.02em; color: #F4FFF9;
  text-shadow: 0 0 22px rgba(92, 196, 154, .45);
}
.gy-ring .m-ring-in span { font-size: 12px; color: #BFD9CC; }
.gy-hero-txt { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 5px; }
.gy-day { font-family: var(--disp); font-size: 26px; font-weight: 700; letter-spacing: -.01em; line-height: 1.15; color: #F4FFF9; }
.gy-focus { font-size: 15px; line-height: 1.35; color: #CFE3D8; }
.gy-when { margin-top: 4px; font-family: var(--mono); font-size: 11px; letter-spacing: .06em; text-transform: uppercase; color: #8FA79A; }
.gy-days { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; width: 100%; padding-top: 14px; border-top: 1px solid rgba(255, 255, 255, .07); }
.gy-dchip {
  min-height: 44px; padding: 0 16px; border-radius: 22px; font-size: 14px; color: #D2DDD6;
  background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .1); transition: background-color .15s, color .15s;
}
.gy-dchip:hover { background: rgba(255, 255, 255, .1); }
.gy-dchip.on { background: rgba(92, 196, 154, .18); border-color: rgba(92, 196, 154, .5); color: #C9F5E1; font-weight: 600; }
.gy-day-note {
  width: 100%; padding: 10px 12px; border-radius: 14px; background: rgba(255, 255, 255, .04);
  font-size: 13px; line-height: 1.45; color: #C6D3CB;
}

/* ── упражнение ───────────────────────────────────────────────── */
.m-main.gy-list { gap: 10px; }
.gy-ex {
  display: flex; flex-direction: column; gap: 8px; padding: 0 14px 14px; border-radius: 22px;
  background: var(--surface); border: 1px solid var(--line); transition: border-color .2s;
}
.gy-ex.is-open { background: linear-gradient(180deg, #16201B 0%, #161618 60%); border-color: rgba(92, 196, 154, .28); padding-bottom: 16px; }
.gy-ex-head { display: flex; align-items: center; gap: 12px; width: 100%; min-height: 60px; padding: 12px 0 0; text-align: left; }
.gy-ex-txt { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.gy-ex-name { font-size: 16px; font-weight: 600; line-height: 1.3; }
.gy-ex-plan { font-family: var(--mono); font-size: 12px; color: var(--ink-3); }
.gy-ex-n {
  flex: none; min-width: 44px; height: 32px; padding: 0 8px; border-radius: 16px; display: grid; place-items: center;
  font-family: var(--mono); font-size: 13px; color: var(--ink-2); background: rgba(255, 255, 255, .05);
}
.gy-ex-n.ok { background: rgba(92, 196, 154, .16); color: #5CC49A; }
.gy-ex.is-done:not(.is-open) .gy-ex-name { color: var(--ink-2); }
.gy-spark { flex: none; color: #6E7C74; overflow: visible; }
.gy-spark.up { color: #5CC49A; }
.gy-spark.none { width: 60px; }
.gy-last { font-size: 13px; line-height: 1.45; color: var(--ink-3); }
.gy-note { padding-left: 10px; border-left: 2px solid rgba(92, 196, 154, .35); font-size: 13px; line-height: 1.45; color: #B7B2AA; }

/* раскрытая: лестница строками */
.gy-open { display: flex; flex-direction: column; gap: 10px; margin-top: 6px; }
.gy-steps { display: flex; flex-direction: column; gap: 6px; }
.gy-st {
  display: grid; grid-template-columns: 18px minmax(64px, 1fr) 10px 60px minmax(0, auto) 44px; align-items: center; gap: 6px;
  min-height: 56px; padding: 5px 6px 5px 10px; border-radius: 16px; background: rgba(255, 255, 255, .03); border: 1px solid var(--line-2);
  transition: background-color .15s, border-color .15s;
}
.gy-st.next { border-color: rgba(234, 131, 105, .5); background: rgba(234, 131, 105, .04); }
.gy-st.on { background: rgba(92, 196, 154, .1); border-color: rgba(92, 196, 154, .28); }
.gy-st-n { font-family: var(--mono); font-size: 12px; color: var(--ink-3); text-align: center; }
.gy-st.on .gy-st-n { color: #7FBFA2; }
.gy-st-w, .gy-st-r {
  min-width: 0; min-height: 44px; padding: 3px 4px; border-radius: 12px; display: flex; flex-direction: column; align-items: center;
  justify-content: center; gap: 1px; line-height: 1.1; transition: background-color .15s;
}
.gy-st-w:hover, .gy-st-r:hover { background: rgba(255, 255, 255, .06); }
.gy-st-w b, .gy-st-r b { font-family: var(--disp); font-size: 18px; font-weight: 600; letter-spacing: -.01em; color: var(--ink); }
.gy-st-w b.bw { font-family: var(--text); font-size: 15px; }
.gy-st-w small, .gy-st-r small {
  max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  font-family: var(--mono); font-size: 10px; letter-spacing: .04em; color: var(--ink-3);
}
.gy-st.on .gy-st-w small, .gy-st.on .gy-st-r small { color: #8FB9A5; }
.gy-st-x { font-size: 14px; color: var(--ink-3); text-align: center; }
.gy-st-prev { min-width: 0; display: flex; flex-direction: column; gap: 1px; font-size: 12px; line-height: 1.2; color: var(--ink-3); white-space: nowrap; }
.gy-st-prev small { font-family: var(--mono); font-size: 9px; letter-spacing: .06em; text-transform: uppercase; color: #6A6660; }
.gy-st-ok {
  width: 44px; height: 44px; border-radius: 22px; display: grid; place-items: center; color: #57534E;
  border: 1.5px solid rgba(255, 255, 255, .16); transition: background-color .15s, border-color .15s, color .15s;
}
.gy-st-ok:hover { color: var(--ink-2); border-color: rgba(255, 255, 255, .3); }
.gy-st.next .gy-st-ok { color: var(--coral); border-color: rgba(234, 131, 105, .7); }
.gy-st.on .gy-st-ok { background: #5CC49A; border-color: #5CC49A; color: #0E1A14; }
.gy-st.extra { border-style: dashed; }
.gy-st-add {
  display: flex; align-items: center; justify-content: center; gap: 6px; min-height: 44px; border-radius: 16px;
  border: 1px dashed rgba(255, 255, 255, .12); font-size: 14px; color: var(--ink-3); transition: background-color .15s, color .15s;
}
.gy-st-add:hover { color: var(--ink-2); background: rgba(255, 255, 255, .03); }

/* подсказка прогрессии: сигнал жёлтым, действие коралловым */
.gy-hint {
  display: flex; align-items: center; gap: 10px; padding: 8px 8px 8px 12px; border-radius: 16px;
  background: rgba(242, 193, 78, .08); border: 1px solid rgba(242, 193, 78, .28);
}
.gy-hint-t { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.gy-hint-t b { font-size: 14px; font-weight: 600; line-height: 1.3; color: #F2C14E; }
.gy-hint-t small { font-size: 12px; line-height: 1.35; color: #BDB39B; }
.gy-hint-b {
  flex: none; min-height: 44px; padding: 0 16px; border-radius: 22px; background: var(--coral); color: var(--coral-ink);
  font-size: 14px; font-weight: 600; transition: background-color .15s;
}
.gy-hint-b:hover { background: var(--coral-hi); }

/* «Пора прибавить»: сводка созревших подсказок над списком упражнений (07.10.2026) */
.gy-grow {
  display: flex; flex-direction: column; gap: 10px; padding: 14px; margin-bottom: 14px; border-radius: 20px;
  background: rgba(242, 193, 78, .08); border: 1px solid rgba(242, 193, 78, .28);
}
.gy-grow-h { display: flex; flex-direction: column; gap: 2px; }
.gy-grow-h b { font-family: var(--disp); font-size: 15px; font-weight: 600; color: #F2C14E; }
.gy-grow-h small { font-size: 12px; line-height: 1.35; color: #BDB39B; }
.gy-grow-l { display: flex; flex-direction: column; gap: 6px; margin: 0; padding: 0; list-style: none; }
.gy-grow-l li { display: flex; align-items: baseline; gap: 10px; font-size: 14px; line-height: 1.35; }
.gy-grow-l li span { flex: 1; min-width: 0; color: var(--ink-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gy-grow-l li b { flex: none; font-family: var(--mono); font-size: 13px; font-weight: 600; color: #F2C14E; white-space: nowrap; }
.gy-grow-b {
  min-height: 44px; border-radius: 22px; background: var(--coral); color: var(--coral-ink);
  font-size: 14px; font-weight: 600; transition: background-color .15s;
}
.gy-grow-b:hover { background: var(--coral-hi); }

.gy-foot { display: flex; align-items: center; gap: 10px; min-height: 44px; margin-bottom: -6px; }
.gy-trend { flex: 1; min-width: 0; display: flex; align-items: center; gap: 10px; font-size: 13px; line-height: 1.35; color: var(--ink-3); }
.gy-trend-t { min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.gy-trend-t b { font-family: var(--disp); font-size: 14px; font-weight: 600; color: #BFEBD6; white-space: nowrap; }
.gy-trend-t small { font-size: 12px; line-height: 1.35; color: var(--ink-3); }
.gy-edit { flex: none; min-height: 44px; padding: 0 2px 0 12px; font-size: 14px; color: var(--coral); }
.gy-edit:hover { color: var(--coral-hi); }

/* шапка списка, «Закончить тренировку», порядок перетаскиванием */
.gy-list-head { padding: 0 2px; }
.gy-finish { display: flex; gap: 8px; width: 100%; min-height: 52px; margin-top: 4px; }
.gy-finish svg { color: #5CC49A; }
.gy-ord-list { display: flex; flex-direction: column; gap: 8px; }
.gy-ord {
  position: relative; display: flex; align-items: center; gap: 12px; min-height: 64px; padding: 8px 6px 8px 14px; border-radius: 18px;
  background: var(--surface); border: 1px solid var(--line); transition: transform .18s var(--ease), box-shadow .18s;
}
.gy-ord.is-drag { z-index: 2; transition: box-shadow .18s; background: var(--surface-2); border-color: rgba(92, 196, 154, .4); box-shadow: 0 14px 34px rgba(0, 0, 0, .55); }
.gy-ord-list.is-sorting { user-select: none; -webkit-user-select: none; }
.gy-ord-n { flex: none; width: 18px; font-family: var(--mono); font-size: 12px; color: var(--ink-3); text-align: center; }
.gy-ord-t { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.gy-ord-t > span { font-size: 15px; font-weight: 600; line-height: 1.3; }
.gy-ord-t small { font-family: var(--mono); font-size: 12px; color: var(--ink-3); }
.gy-ord-h {
  flex: none; width: 44px; height: 48px; border-radius: 14px; display: grid; place-items: center; color: var(--ink-3);
  cursor: grab; touch-action: none; transition: background-color .15s, color .15s;
}
.gy-ord-h:hover { color: var(--ink); background: rgba(255, 255, 255, .06); }
.gy-ord.is-drag .gy-ord-h { cursor: grabbing; color: #5CC49A; }

/* ── журнал ───────────────────────────────────────────────────── */
.gy-late { display: flex; flex-direction: column; gap: 18px; min-width: 0; }
.gy-journal, .gy-prog { display: flex; flex-direction: column; gap: 10px; }
.gy-sess {
  display: flex; align-items: center; gap: 12px; width: 100%; min-height: 60px; padding: 10px 12px 10px 14px;
  border-top: 1px solid var(--line); text-align: left; transition: background-color .15s;
}
.gy-sess:first-child { border-top: 0; }
.gy-sess:hover { background: var(--surface-hover); }
.gy-sess-d { flex: none; width: 36px; display: flex; flex-direction: column; align-items: center; gap: 1px; }
.gy-sess-d b { font-family: var(--disp); font-size: 17px; font-weight: 600; line-height: 1.2; }
.gy-sess-d small { font-family: var(--mono); font-size: 10px; letter-spacing: .06em; color: var(--ink-3); }
.gy-sess-t { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.gy-sess-t > span { font-size: 15px; font-weight: 600; line-height: 1.3; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gy-sess-t small { font-size: 13px; color: var(--ink-3); }

/* ── программа и расписание ───────────────────────────────────── */
.gy-prog-card { padding: 4px 0 0; }
.gy-prog-day { display: flex; align-items: baseline; gap: 12px; min-height: 44px; padding: 12px 14px; border-top: 1px solid var(--line); }
.gy-prog-day:first-child { border-top: 0; }
.gy-prog-n { flex: none; font-family: var(--disp); font-size: 14px; font-weight: 600; }
.gy-prog-f { flex: 1; min-width: 0; font-size: 14px; color: var(--ink-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gy-prog-c { flex: none; font-family: var(--mono); font-size: 12px; color: var(--ink-3); }
.gy-prog-note { margin: 0 14px; padding: 10px 12px; border-radius: 14px; background: rgba(255, 255, 255, .03); font-size: 13px; line-height: 1.45; color: var(--ink-3); white-space: pre-line; }
.gy-wd-box { display: flex; flex-direction: column; gap: 10px; padding: 14px 12px 12px; margin-top: 8px; border-top: 1px solid var(--line); }
.gy-wd-box .field-lbl { padding-left: 2px; }
.gy-wd { display: grid; grid-template-columns: repeat(7, minmax(44px, 1fr)); gap: 4px; }
.gy-wdc {
  min-height: 44px; border-radius: 14px; font-family: var(--mono); font-size: 12px; letter-spacing: .04em; color: var(--ink-3);
  background: rgba(255, 255, 255, .04); border: 1px solid var(--line-2); transition: background-color .15s, color .15s;
}
.gy-wdc:hover { color: var(--ink-2); background: rgba(255, 255, 255, .07); }
.gy-wdc.on { background: rgba(92, 196, 154, .16); border-color: rgba(92, 196, 154, .45); color: #C9F5E1; font-weight: 500; }
.gy-prog-at { display: flex; align-items: center; flex-wrap: wrap; gap: 0 6px; padding: 0 14px 4px; font-size: 13px; color: var(--ink-3); }
.gy-link { min-height: 44px; font-size: 13px; color: var(--coral); }
.gy-link:hover { color: var(--coral-hi); }

/* ── шторки: тренировка из журнала, вставка, разбор ───────────── */
.gy-sheet-sum { margin-bottom: 14px; }
.gy-sheet-list { display: flex; flex-direction: column; gap: 16px; }
.gy-sheet-ex { display: flex; flex-direction: column; gap: 8px; }
.gy-sheet-n { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: 15px; font-weight: 600; }
/* подходы тренировки плашками: касание открывает правку */
.gy-sets { display: grid; grid-template-columns: repeat(auto-fill, minmax(72px, 1fr)); gap: 6px; }
.gy-set {
  position: relative; min-height: 48px; padding: 16px 4px 6px; border-radius: 14px; display: grid; place-items: center;
  background: rgba(92, 196, 154, .12); border: 1px solid rgba(92, 196, 154, .3); color: #D5F4E6; font-size: 14px; font-weight: 600;
  transition: background-color .15s;
}
.gy-set:hover { background: rgba(92, 196, 154, .18); }
.gy-set-n { position: absolute; top: 5px; left: 8px; font-family: var(--mono); font-size: 10px; font-weight: 400; color: #7FBFA2; }
.gy-set-v { white-space: nowrap; }
.gy-text { min-height: 260px; font-size: 16px; line-height: 1.5; }
.gy-pick-note { margin-bottom: 14px; }
.gy-pick { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 20px; }
.gy-pick .chip { min-width: 56px; font-family: var(--disp); font-size: 15px; font-weight: 600; }
.gy-pick-form { gap: 12px; }
.gy-lad { display: flex; flex-direction: column; gap: 6px; }
.gy-lad-row { display: grid; grid-template-columns: 18px minmax(0, 1fr) 12px minmax(0, 1fr) 44px; align-items: center; gap: 6px; }
.gy-lad-n { font-family: var(--mono); font-size: 12px; color: var(--ink-3); text-align: center; }
.gy-lad-x { color: var(--ink-3); text-align: center; }
.gy-lad-add { gap: 6px; align-self: flex-start; min-height: 44px; margin-top: 4px; font-size: 14px; }

.gy-pv { display: flex; flex-direction: column; gap: 14px; padding-top: 2px; }
.gy-pv-sum { font-size: 14px; line-height: 1.45; color: var(--ink-2); }
.gy-pv-sum b { font-weight: 600; color: var(--ink); }
.gy-pv-day { display: flex; flex-direction: column; gap: 4px; padding: 14px; border-radius: 20px; background: var(--surface); border: 1px solid var(--line); }
.gy-pv-h { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding-bottom: 6px; font-family: var(--disp); font-size: 14px; font-weight: 600; line-height: 1.35; }
.gy-pv-list { display: flex; flex-direction: column; margin: 0; padding: 0; list-style: none; }
.gy-pv-list li {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 12px; align-items: baseline;
  padding: 8px 0; border-top: 1px solid var(--line);
}
.gy-pv-n { font-size: 14px; line-height: 1.35; }
.gy-pv-p { font-family: var(--mono); font-size: 12px; color: #5CC49A; white-space: nowrap; }
.gy-pv-list small { grid-column: 1 / -1; font-size: 12px; line-height: 1.4; color: var(--ink-3); }
.gy-pv-note { display: flex; align-items: flex-start; gap: 8px; padding-top: 8px; font-size: 13px; line-height: 1.45; color: var(--ink-2); white-space: pre-line; }
.gy-pv-note .tag { margin-top: -1px; }
.gy-pv .btn-primary { margin-top: 4px; }

/* ── компьютер ────────────────────────────────────────────────── */
@media (min-width: 900px) {
  .sheet.sheet-gym { width: min(600px, calc(100% - var(--side-w) - 64px)); }
  .gy-text { min-height: 340px; font-size: 15px; }
}
@media (min-width: 1180px) {
  .m-hero.gy-hero { padding: 28px 22px 22px; }
  .m-main.gy-list { gap: 12px; }
  .gy-ex { padding: 0 18px 16px; }
  .gy-st { grid-template-columns: 22px minmax(96px, 150px) 12px 76px minmax(0, 1fr) 44px; gap: 8px; }
  .gy-st-prev { padding-left: 8px; }
}

/* правки дня (26.09.2026): свайп влево убирает упражнение на сегодня */
.gy-ex { touch-action: pan-y; transition: transform .2s ease, opacity .2s ease; }
.gy-foot-r { display: flex; gap: 14px; align-items: center; }
.gy-add-ex { margin-top: 4px; width: 100%; justify-content: center; }
.gy-skipped { margin: 4px 2px 0; font-size: 13px; color: var(--ink-3); line-height: 1.6; }
.gy-pick-ex .chip { white-space: normal; text-align: left; }