/* W2 · Настройки тренинга — редактор мышц и панель несохранённых правок. */
.me-overlay {
  position:fixed;
  z-index:500;
  inset:0;
  display:none;
  align-items:center;
  justify-content:center;
  padding:var(--w2-s4);
  background:rgba(10,11,12,.82);
  backdrop-filter:blur(8px)
}

.me-overlay.active {
  display:flex
}

.me-modal {
  width:min(100%,560px);
  max-height:90vh;
  overflow-y:auto;
  border:1px solid rgba(255,255,255,.16);
  border-radius:var(--w2-s4);
  color:var(--w2-text);
  background:var(--w2-surface);
  box-shadow:0 24px 70px rgba(0,0,0,.45);
  font-family:'Inter',sans-serif;
  font-variant-numeric:tabular-nums
}

.me-header {
  display:flex;
  align-items:center;
  gap:var(--w2-s2);
  padding:var(--w2-s4) var(--w2-s5);
  border-bottom:1px solid var(--w2-line);
  color:var(--w2-text);
  background:var(--w2-surface-raised);
  font:700 14px/1.2 'JetBrains Mono',monospace; font-variant-numeric: tabular-nums;
  letter-spacing:.08em;
  text-transform:uppercase
}

.me-header-icon {
  width:var(--w2-s5);
  height:var(--w2-s5);
  color:var(--w2-text-muted)
}

.me-header .me-close {
  display:grid;
  place-items:center;
  width:var(--w2-s8);
  height:var(--w2-s8);
  margin-left:auto;
  padding:0;
  border:1px solid transparent;
  border-radius:var(--w2-s2);
  color:var(--w2-text-muted);
  background:transparent;
  cursor:pointer;
  transition:color 160ms,border-color 160ms,background-color 160ms
}

.me-header .me-close:hover {
  border-color:rgba(255,255,255,.16);
  color:var(--w2-text);
  background:rgba(255,255,255,.04)
}

.me-header .me-close svg {
  width:var(--w2-s5);
  height:var(--w2-s5)
}

.me-body {
  padding:var(--w2-s5)
}

.me-name {
  margin-bottom:var(--w2-s4);
  padding:var(--w2-s3) var(--w2-s4);
  border-left:4px solid var(--w2-lime);
  border-radius:var(--w2-s2);
  color:var(--w2-text);
  background:var(--w2-surface-raised);
  font-size:18px;
  font-weight:750;
  overflow-wrap:anywhere
}

.me-label {
  margin:var(--w2-s4) 0 var(--w2-s2);
  color:var(--w2-text-muted);
  font:700 12px/1.2 'JetBrains Mono',monospace; font-variant-numeric: tabular-nums;
  letter-spacing:.1em;
  text-transform:uppercase
}

.me-primary,
.me-secondary {
  display:flex;
  flex-wrap:wrap;
  gap:var(--w2-s2)
}

.me-chip {
  min-height:var(--w2-s8);
  padding:var(--w2-s2) var(--w2-s3);
  border:1px solid rgba(255,255,255,.16);
  border-radius:999px;
  color:var(--w2-text-muted);
  background:var(--w2-surface-raised);
  font:600 14px/1.2 'Inter',sans-serif; font-variant-numeric: tabular-nums;
  cursor:pointer;
  user-select:none;
  transition:color 160ms,border-color 160ms,background-color 160ms,transform 160ms
}

.me-chip:hover {
  border-color:rgba(200,241,53,.45);
  color:var(--w2-text)
}

.me-chip-primary.active {
  border-color:var(--w2-lime);
  color:var(--w2-bg);
  background:var(--w2-lime)
}

.me-chip-secondary.active {
  border-color:var(--w2-lime);
  color:var(--w2-lime);
  background:rgba(200,241,53,.1)
}

.me-footer {
  display:flex;
  justify-content:flex-end;
  gap:var(--w2-s2);
  padding:var(--w2-s3) var(--w2-s5);
  border-top:1px solid var(--w2-line);
  background:var(--w2-surface-raised)
}

.me-footer .btn {
  min-height:var(--w2-s8);
  padding:var(--w2-s2) var(--w2-s5);
  font-size:14px
}

#prog-save-bar {
  position:fixed;
  z-index:200;
  right:var(--w2-s3);
  bottom:calc(var(--w2-s9) + var(--w2-s4));
  left:var(--w2-s3);
  display:none;
  align-items:center;
  gap:var(--w2-s3);
  padding:var(--w2-s3) var(--w2-s4);
  border:1px solid rgba(241,70,44,.55);
  border-radius:var(--w2-s3);
  color:var(--w2-text);
  background:var(--w2-surface-raised);
  box-shadow:0 18px 48px rgba(0,0,0,.4),0 0 0 1px rgba(241,70,44,.12);
  font-family:'Inter',sans-serif;
  font-weight:700;
  animation:w2ProgBarIn 240ms cubic-bezier(.2,.9,.2,1)
}

#prog-save-bar.visible {
  display:flex
}

#prog-save-bar .psb-text {
  display:flex;
  align-items:center;
  flex:1;
  gap:var(--w2-s2);
  color:var(--w2-fire);
  font:700 12px/1.2 'JetBrains Mono',monospace; font-variant-numeric: tabular-nums;
  letter-spacing:.08em;
  text-transform:uppercase
}

#prog-save-bar .psb-text svg {
  width:var(--w2-s5);
  height:var(--w2-s5)
}

#prog-save-bar .psb-btn {
  min-height:var(--w2-s8);
  padding:var(--w2-s2) var(--w2-s4);
  border:1px solid var(--w2-lime);
  border-radius:var(--w2-s2);
  color:var(--w2-bg);
  background:var(--w2-lime);
  font:700 12px/1 'JetBrains Mono',monospace; font-variant-numeric: tabular-nums;
  letter-spacing:.04em;
  cursor:pointer;
  transition:filter 160ms,transform 160ms
}

#prog-save-bar .psb-btn.discard {
  border-color:rgba(255,255,255,.16);
  color:var(--w2-text-muted);
  background:transparent
}

#prog-save-bar .psb-btn:hover {
  filter:brightness(1.06)
}

#prog-save-bar .psb-btn:active {
  transform:translateY(1px)
}

@keyframes w2ProgBarIn {
  from { opacity:0; transform:translateY(var(--w2-s3)); }
  to { opacity:1; transform:translateY(0); }
}

@media (max-width:500px) {
  .me-overlay {
    align-items:flex-end;
    padding:var(--w2-s2)
  }

  .me-modal {
    max-height:92vh;
    border-radius:var(--w2-s4) var(--w2-s4) var(--w2-s2) var(--w2-s2)
  }

  .me-body {
    padding:var(--w2-s4)
  }

  .me-footer {
    position:sticky;
    bottom:0;
    flex-direction:column;
    padding:var(--w2-s3) var(--w2-s4)
  }

  .me-footer .btn,
  #prog-save-bar .psb-btn {
    width:100%
  }

  #prog-save-bar {
    align-items:stretch;
    flex-wrap:wrap;
    bottom:calc(var(--w2-s9) + var(--w2-s7))
  }

  #prog-save-bar .psb-text {
    flex-basis:100%
  }
}

@media (prefers-reduced-motion:reduce) {
  .me-overlay *,
  #prog-save-bar {
    animation-duration:.01ms;
    animation-iteration-count:1;
    transition-duration:.01ms
  }
}