/* Breathing Room additions on top of stay.css. Here the ring follows the audio timeline (set from JS). */
.room[data-state="arrive"] .panel-arrive,
.room[data-state="choose"] .panel-choose { display: flex; }

.ring.paced { animation: none; transform: scale(var(--scale, .6)); transition: transform .12s linear; }
.phase-cue {
  font-family: "Cormorant Garamond", Georgia, serif; font-style: italic; font-size: 22px;
  color: rgba(255, 255, 255, .88); position: relative; min-height: 1.4em;
}

.doors { width: 100%; display: grid; gap: 10px; }
.door {
  width: 100%; text-align: left; cursor: pointer; border-radius: 16px; padding: 14px 16px;
  background: rgba(255, 255, 255, .04); border: 1px solid var(--faint);
  display: grid; gap: 2px; min-height: 56px;
}
.door strong { font-weight: 600; }
.door span { color: var(--muted); font-size: 16px; }
.door[aria-pressed="true"] { background: rgba(232, 194, 122, .16); border-color: var(--gold); }
.door-start { border-style: dashed; }

.safety-note { font-size: 16px; color: var(--muted); margin: 0; max-width: 30em; }

.path { width: 100%; text-align: left; }
.path h2 { font-size: 22px; margin-bottom: 10px; text-align: center; }
.path ol { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.path li { border: 1px solid var(--faint); border-radius: 14px; padding: 12px 14px; background: rgba(255, 255, 255, .03); }
.path li strong { display: block; }
.path li span { color: var(--muted); font-size: 16px; }
.path .badge { float: right; font-size: 15px; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.path .badge.open { color: var(--gold); }

@media (prefers-reduced-motion: reduce) {
  .ring.paced { transform: scale(.85) !important; transition: none; }
}

/* Take it with you (Starter Pack) */
.pack-card .btn { display: inline-flex; align-items: center; justify-content: center; text-decoration: none; margin: 16px 0 10px; }

/* "Guided breathing exercises for every moment" (SEO section under Your path) */
.path.about h3 { font-family: inherit; font-size: 17px; font-weight: 600; margin: 0 0 2px; }
.path.about li span { display: block; }