/* v1.5.3: the Sadhna Chamber (/sadhna-chamber; includes/views/sadhna-chamber.php, assets/js/sadhna-chamber.js).
   Temple Dark always (also inside the desktop app). Contrast: #FCFBF7 on #0B0B15 18.9:1, #D9CFC2 on #14131F 11.9:1,
   #0B0B15 on #F59E0B 9.1:1. The ring and the time keep fixed sizes, so nothing moves while the minutes pass. */
.chamber {
  --ch-onyx: #0B0B15; --ch-surface: #14131F; --ch-raised: #1F1A16; --ch-ink: #FCFBF7; --ch-muted: #D9CFC2;
  --ch-gold: rgba(217, 119, 6, 0.25); --ch-gold-strong: rgba(245, 158, 11, 0.55); --ch-amber: #F59E0B; --ch-glow: #FCD34D;
  background: radial-gradient(760px 520px at 50% 18%, rgba(217, 119, 6, 0.16), transparent 65%), var(--ch-onyx);
  color: var(--ch-ink); color-scheme: dark; min-height: 70vh;
}
.chamber a { color: var(--ch-glow); }
.chamber__wrap { max-width: 760px; padding-top: clamp(24px, 5vw, 56px); padding-bottom: 56px; }
.chamber__head { text-align: center; }
.chamber__greet { margin: 0; color: var(--ch-glow); font-weight: 600; letter-spacing: .04em; }
.chamber__title { margin: .2rem 0 .4rem; font: 500 clamp(2rem, 5vw, 3rem)/1.1 var(--font-display, 'Cormorant Garamond', Georgia, serif); color: var(--ch-ink); }
.chamber__lead { max-width: 34rem; margin: 0 auto; color: var(--ch-muted); line-height: 1.6; }

.chamber__sit { margin-top: clamp(20px, 4vw, 36px); text-align: center; }
.chamber__ring { position: relative; width: min(78vw, 320px); aspect-ratio: 1 / 1; margin: 0 auto; }
.chamber__ring svg { width: 100%; height: 100%; transform: rotate(-90deg); }
.chamber__track { fill: none; stroke: rgba(245, 158, 11, 0.14); stroke-width: 6; }
.chamber__arc { fill: none; stroke: var(--ch-amber); stroke-width: 6; stroke-linecap: round; stroke-dasharray: 1000; stroke-dashoffset: 0;
  filter: drop-shadow(0 0 8px rgba(245, 158, 11, 0.55)); transition: stroke-dashoffset 1s linear; }
.chamber__time { position: absolute; inset: 0; display: grid; place-items: center; font: 500 clamp(2.6rem, 11vw, 4.2rem)/1 var(--font-display, 'Cormorant Garamond', Georgia, serif);
  font-variant-numeric: tabular-nums; color: var(--ch-ink); }
.chamber__phase { margin: .8rem 0 0; min-height: 1.6em; color: var(--ch-glow); }
.chamber.is-sitting .chamber__ring { animation: chamber-breath 8s ease-in-out infinite; }
@keyframes chamber-breath { 50% { transform: scale(1.015); } }

.chamber__lengths { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin: 1.2rem 0 0; }
.chamber__len { min-height: 44px; min-width: 76px; padding: 0 14px; border-radius: 999px; border: 1px solid var(--ch-gold-strong); background: var(--ch-surface); color: var(--ch-ink); font: inherit; cursor: pointer; }
.chamber__len[aria-checked="true"] { background: var(--ch-amber); color: var(--ch-onyx); border-color: var(--ch-amber); font-weight: 600; }
.chamber__len:disabled { opacity: .55; cursor: default; }
.chamber__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 1.2rem; }
.chamber__btn { min-height: 50px; padding: 0 24px; border-radius: 999px; font-family: inherit; font-size: 1rem; font-weight: 600; line-height: 1; cursor: pointer; border: 1px solid transparent; }
.chamber__btn--primary { background: var(--ch-amber); color: var(--ch-onyx); box-shadow: 0 10px 28px -12px rgba(245, 158, 11, 0.7); }
.chamber__btn--primary:hover { background: var(--ch-glow); }
.chamber__btn--ghost { background: var(--ch-raised); color: var(--ch-ink); border-color: var(--ch-gold-strong); }
.chamber__btn--ghost[aria-pressed="true"] { border-color: var(--ch-glow); box-shadow: inset 0 0 0 1px var(--ch-glow); }
.chamber__btn:focus-visible, .chamber__len:focus-visible { outline: 3px solid var(--ch-glow); outline-offset: 3px; }
.chamber__audio { margin: 1rem 0 0; color: var(--ch-muted); font-size: .92rem; min-height: 1.4em; }

.chamber__log { margin-top: clamp(28px, 5vw, 48px); padding: 20px; border-radius: 20px; background: var(--ch-surface); border: 1px solid var(--ch-gold); }
.chamber__log-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 8px; }
.chamber__log h2 { margin: 0; font-size: 1.2rem; color: var(--ch-ink); }
.chamber__net { margin: 0; font-size: .9rem; color: var(--ch-muted); }
.chamber__net[data-online="true"] { color: #86EFAC; }
.chamber__sync { margin: .6rem 0 0; min-height: 1.4em; color: var(--ch-glow); font-size: .95rem; }
.chamber__list { margin: .8rem 0 0; padding: 0; list-style: none; display: grid; gap: 6px; }
.chamber__item { display: grid; grid-template-columns: 4.5rem 1fr auto; gap: 10px; align-items: center; padding: 10px 12px; border-radius: 12px; background: var(--ch-raised); }
.chamber__item-m { font-weight: 600; color: var(--ch-ink); font-variant-numeric: tabular-nums; }
.chamber__item-d { color: var(--ch-muted); font-size: .92rem; }
.chamber__item-s { font-size: .85rem; color: var(--ch-glow); }
.chamber__item[data-state="synced"] .chamber__item-s { color: #86EFAC; }
.chamber__item[data-state="rejected"] .chamber__item-s { color: #FCA5A5; }
.chamber__empty { color: var(--ch-muted); }
.chamber__fine { margin: 1rem 0 0; color: var(--ch-muted); font-size: .88rem; line-height: 1.6; }
@media (prefers-reduced-motion: reduce) { .chamber.is-sitting .chamber__ring { animation: none; } .chamber__arc { transition: none; } }