/* Nếp Sống Dưỡng Sinh — breathing pacer [nsds_tho_cung]. Tokens only. */
.nsds .nsds-breath { max-width: var(--measure); margin: var(--space-xl) auto; padding: var(--space-lg); background: var(--surface-default); border: 1px solid var(--border-subtle); border-radius: var(--radius-lg); box-shadow: var(--elevation-sm); color: var(--text-primary); text-align: center; }
.nsds .nsds-breath__title { margin: 0 0 var(--space-md); font: 600 22px/1.3 var(--font-display); color: var(--text-primary); }
.nsds .nsds-breath__durations { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: var(--space-sm); margin: 0 0 var(--space-lg); }
.nsds .nsds-breath__durations-label { flex-basis: 100%; margin: 0; font: 600 14px/1.5 var(--font-sans); color: var(--text-secondary); }
.nsds .nsds-breath__durations .nsds-btn { min-width: var(--touch-min); height: var(--touch-min); transition: background-color 120ms cubic-bezier(0.2, 0, 0, 1), color 120ms cubic-bezier(0.2, 0, 0, 1); }
.nsds .nsds-breath__durations .nsds-btn[aria-pressed="true"] { background: var(--action-primary); border-color: var(--action-primary); color: var(--text-inverse); }
.nsds .nsds-breath__durations .nsds-btn:disabled { cursor: default; opacity: 0.6; }
.nsds .nsds-breath__stage { position: relative; display: flex; align-items: center; justify-content: center; width: 100%; max-width: 240px; aspect-ratio: 1; margin: 0 auto var(--space-md); }
.nsds .nsds-breath__ring { position: absolute; inset: 0; border: 1px solid var(--border-default); border-radius: var(--radius-pill); }
.nsds .nsds-breath__circle { position: absolute; inset: 0; border-radius: var(--radius-pill); background: var(--label-practice-bg); border: 2px solid var(--action-primary); transform: scale(0.55); transform-origin: center; will-change: transform; }
.nsds .nsds-breath__phase { position: relative; margin: 0; padding: 0 var(--space-md); font: 600 20px/1.4 var(--font-display); color: var(--text-primary); }
.nsds .nsds-breath__status { margin: 0 0 var(--space-md); }
.nsds .nsds-breath__count { display: block; font: 600 40px/1.2 var(--font-display); color: var(--action-primary); }
.nsds .nsds-breath__left { display: block; font: 400 14px/1.5 var(--font-sans); color: var(--text-secondary); }
.nsds .nsds-breath__bar-track { display: none; width: 100%; height: 8px; margin: 0 0 var(--space-md); background: var(--surface-sunken); border-radius: var(--radius-pill); overflow: hidden; }
.nsds .nsds-breath__bar { display: block; width: 0; height: 100%; background: var(--action-primary); }
.nsds .nsds-breath__controls { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--space-sm); margin: 0 0 var(--space-lg); }
.nsds .nsds-breath__controls .nsds-btn[hidden] { display: none; }
.nsds .nsds-breath__safety { margin: 0 0 var(--space-sm); font: 400 14px/1.6 var(--font-sans); color: var(--label-caution-text); }
.nsds .nsds-breath__cta { margin: 0; font: 400 14px/1.6 var(--font-sans); color: var(--text-secondary); }
.nsds .nsds-breath__cta a { color: var(--text-link); text-decoration: underline; }
.nsds .nsds-breath__noscript { margin: var(--space-md) 0 0; font: 400 14px/1.6 var(--font-sans); color: var(--text-secondary); }
.nsds .nsds-breath button:focus-visible,
.nsds .nsds-breath a:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 2px; }
.nsds .nsds-breath:not(.nsds-breath--js) .nsds-breath__durations,
.nsds .nsds-breath:not(.nsds-breath--js) .nsds-breath__stage,
.nsds .nsds-breath:not(.nsds-breath--js) .nsds-breath__controls { display: none; }
@media (max-width: 400px) {
  .nsds .nsds-breath { padding: var(--space-md); }
  .nsds .nsds-breath__stage { max-width: 200px; }
}
@media (prefers-reduced-motion: reduce) {
  .nsds .nsds-breath__circle { transform: none; opacity: 0.6; }
  .nsds .nsds-breath__bar-track { display: block; }
}
.nsds .nsds-breath--reduced .nsds-breath__circle { transform: none; opacity: 0.6; }
.nsds .nsds-breath--reduced .nsds-breath__bar-track { display: block; }