/* ============================================================
   60 SECONDS — Daily spiritual reset
   ============================================================ */
.mo-body{
  margin: 0;
  background: radial-gradient(circle at 50% 30%, rgba(241,213,151,.18), transparent 60%),
              radial-gradient(circle at 50% 70%, rgba(212,176,122,.10), transparent 60%),
              linear-gradient(180deg, #0B1F3A, #14315b);
  color: #f6e6c2;
  font-family: 'Frank Ruhl Libre','Heebo',serif;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.mo-bar{ display: flex; align-items: center; gap: 14px; padding: 14px 18px; }
.mo-back{
  width: 36px; height: 36px;
  display: grid; place-items: center;
  border-radius: 50%;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(212,176,122,.3);
  color: #d4b07a;
  text-decoration: none; font-size: 18px;
}
.mo-streak{
  margin-inline-start: auto;
  padding: 4px 14px;
  background: linear-gradient(135deg, rgba(255,140,40,.15), rgba(255,200,100,.1));
  border: 1px solid rgba(255,200,100,.4);
  border-radius: 999px;
  color: #f1d597;
  font-size: 13px; font-weight: 700;
}

.mo-stage{ flex: 1; display: flex; align-items: center; justify-content: center; padding: 24px; position: relative; }

.mo-phase{
  position: absolute; inset: 0;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  text-align: center; padding: 40px 24px;
  opacity: 0; visibility: hidden;
  transform: translateY(20px);
  transition: opacity .55s, transform .55s, visibility 0s linear .55s;
}
.mo-phase.is-on{
  opacity: 1; visibility: visible; transform: none;
  transition: opacity .55s, transform .55s, visibility 0s;
}

.mo-welcome .mo-emoji{
  font-size: 56px;
  background: linear-gradient(135deg, #f1d597, #d4b07a);
  -webkit-background-clip: text; background-clip: text; color: transparent;
  filter: drop-shadow(0 0 24px rgba(241,213,151,.5));
  animation: moPulse 2.4s ease-in-out infinite;
}
@keyframes moPulse{ 0%,100%{ transform: scale(1); } 50% { transform: scale(1.1); } }

.mo-phase h1, .mo-phase h2{
  font-family: 'Frank Ruhl Libre', serif;
  font-size: clamp(28px, 5vw, 44px);
  margin: 16px 0 8px;
  background: linear-gradient(135deg, #f1d597, #d4b07a);
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
.mo-phase p{ margin: 0 0 28px; font-size: 16px; line-height: 1.7; max-width: 28ch; opacity: .85; }

.mo-go{
  padding: 16px 40px;
  background: linear-gradient(135deg, #d4b07a, #f1d597);
  color: #0B1F3A;
  font-weight: 800; font-size: 17px;
  border: none; border-radius: 999px;
  cursor: pointer;
  box-shadow: 0 14px 36px rgba(241,213,151,.3);
  transition: transform .15s, box-shadow .25s;
}
.mo-go:hover{ transform: translateY(-2px); box-shadow: 0 20px 48px rgba(241,213,151,.45); }

.mo-skip{ margin-top: 18px; }
.mo-skip button{ background: transparent; border: none; color: #d4b07a; font-size: 13px; cursor: pointer; opacity: .7; }
.mo-skip button:hover{ opacity: 1; text-decoration: underline; }

.mo-breath-orb{ width: 200px; height: 200px; border-radius: 50%; position: relative; display: grid; place-items: center; }
.mo-breath-orb span{
  display: block; width: 100%; height: 100%; border-radius: 50%;
  background: radial-gradient(circle, rgba(241,213,151,.6), rgba(212,176,122,.15) 70%, transparent);
  box-shadow: 0 0 50px rgba(241,213,151,.4);
  animation: moBreath 8s ease-in-out infinite;
}
@keyframes moBreath{ 0%,100%{ transform: scale(.65); opacity: .55; } 50%{ transform: scale(1.05); opacity: 1; } }
.mo-breath-text{ margin-top: 32px; font-size: 22px; color: #f1d597; font-weight: 600; letter-spacing: .04em; }

.mo-verse-icon{ font-size: 42px; }
.mo-verse-text{
  font-family: 'Frank Ruhl Libre', serif;
  font-size: clamp(20px, 3vw, 26px) !important;
  line-height: 1.7 !important;
  max-width: 32ch !important;
  color: #f6e6c2;
  font-weight: 500;
  opacity: 1 !important;
}

.mo-bless-flame{ font-size: 56px; filter: drop-shadow(0 0 24px rgba(255,200,100,.5)); animation: moPulse 2s ease-in-out infinite; }
.mo-bless-text{
  font-family: 'Frank Ruhl Libre', serif;
  font-size: clamp(18px, 2.5vw, 22px) !important;
  line-height: 1.8 !important;
  max-width: 36ch !important;
  font-weight: 500; opacity: 1 !important;
}

.mo-done-icon{ font-size: 56px; filter: drop-shadow(0 0 26px rgba(241,213,151,.6)); }
.mo-streak-grow{
  margin-top: 16px; padding: 12px 24px;
  background: rgba(255,140,40,.12);
  border: 1px solid rgba(255,200,100,.4);
  border-radius: 999px; color: #f1d597; font-weight: 700;
}
.mo-streak-grow b{ font-size: 22px; }

.mo-actions{ margin-top: 28px; display: flex; gap: 8px; flex-wrap: wrap; justify-content: center; }
.mo-link{
  padding: 8px 16px;
  background: rgba(212,176,122,.12);
  border: 1px solid rgba(212,176,122,.3);
  color: #d4b07a;
  border-radius: 999px; text-decoration: none;
  font-size: 13px; font-weight: 600;
}
.mo-link:hover{ background: rgba(212,176,122,.22); }

.mo-progress{
  width: min(280px, 70%); height: 4px;
  background: rgba(255,255,255,.08);
  border-radius: 999px; overflow: hidden;
  margin-top: 24px;
}
.mo-progress i{
  display: block; height: 100%; width: 0;
  background: linear-gradient(90deg, #d4b07a, #f1d597);
  transition: width .25s linear;
}
