:root {
  --temple: #2f4f4f;
  --temple-light: #e8efe9;
  --ring-steps: #f0a830;
  --ring-water: #3a9bd8;
  --ring-fast: #6f5bd1;
}
body { background: #f6f7f5; padding-bottom: env(safe-area-inset-bottom); }
.bg-temple { background: var(--temple); }
.bg-temple .navbar-brand, .bg-temple .nav-link { color: #fff; }
.bg-temple .nav-link.active { color: #fff; font-weight: 600; text-decoration: underline; text-underline-offset: 6px; }
.bg-temple .navbar-toggler { border-color: rgba(255,255,255,.4); }
.bg-temple .navbar-toggler-icon { filter: invert(1); }
.card { border: 0; box-shadow: 0 1px 2px rgba(0,0,0,.06); border-radius: .9rem; }
.verse-card { background: var(--temple-light); }
.verse-text { font-family: Georgia, 'Times New Roman', serif; font-size: 1.05rem; line-height: 1.5; }

/* Rings */
.ring-wrap { position: relative; width: 100%; max-width: 120px; margin: 0 auto; }
.ring { width: 100%; transform: rotate(-90deg); }
.ring-bg { fill: none; stroke: #e3e5e2; stroke-width: 10; }
.ring-fg { fill: none; stroke-width: 10; stroke-linecap: round; stroke-dasharray: 326.7; transition: stroke-dashoffset .6s ease; }
.ring-steps .ring-fg { stroke: var(--ring-steps); }
.ring-water .ring-fg { stroke: var(--ring-water); }
.ring-fast .ring-fg { stroke: var(--ring-fast); }
.ring-center { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.ring-center i { font-size: 1.1rem; opacity: .8; }
.ring-steps .ring-center i { color: var(--ring-steps); }
.ring-water .ring-center i { color: var(--ring-water); }
.ring-fast .ring-center i { color: var(--ring-fast); }
.ring-value { font-size: 1.2rem; font-weight: 700; line-height: 1.1; }

.btn-quick { min-width: 72px; }

/* Week strip */
.week-day { flex: 1; padding: .25rem 0; border-radius: .5rem; }
.week-day.perfect { background: #e3f4e8; }
.week-dots { display: flex; justify-content: center; gap: 3px; margin-top: 2px; }
.dot { width: 9px; height: 9px; border-radius: 50%; background: #dfe2de; display: inline-block; }
.dot.on.ring-steps { background: var(--ring-steps); }
.dot.on.ring-water { background: var(--ring-water); }
.dot.on.ring-fast { background: var(--ring-fast); }

.ios-only { display: none; }
.is-ios .ios-only { display: inline-block; }
.is-ios .ios-only.small { display: block; }

.toast-container { z-index: 2000; }
@media (max-width: 575px) {
  .display-6 { font-size: 1.6rem; }
}

.markdown h2, .markdown h3 { font-size: 1rem; margin-top: .9rem; margin-bottom: .3rem; font-weight: 600; }
.markdown h1 { font-size: 1.1rem; }
.markdown ul { padding-left: 1.2rem; margin-bottom: .5rem; }
.markdown p { margin-bottom: .5rem; }
.ai-card .ai-body { font-size: .95rem; }
.btn-coach { line-height: 1.2; font-size: .9rem; }
.pref-chip { font-size: .85rem; font-weight: 500; }