/* Darpana app: Rituais da Lua (prefixo .lua-) */
.lua-topo { text-align: center; }
.lua-h1 { font-family: var(--display); font-size: clamp(30px, 8vw, 40px); line-height: 1.1; margin: 4px 0 6px; }
.lua-sub { margin: 0 auto; max-width: 420px; }
.lua-h3 { font-family: var(--display); font-size: 24px; margin: 6px 0 8px; }
.lua-palco { position: relative; height: 270px; margin: 6px -8px 0; display: grid; place-items: center; overflow: hidden; border-radius: var(--radius); }
.lua-ceu { position: absolute; inset: 0; width: 100%; height: 100%; }
.lua-disco { position: relative; width: 250px; height: 250px; }
@media (prefers-reduced-motion: no-preference) { .lua-disco { animation: lua-flutua 9s ease-in-out infinite; } }
@keyframes lua-flutua { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-6px); } }
.lua-fase-info { text-align: center; margin: 4px 0 18px; line-height: 1.6; }
.lua-fase-nome { color: var(--gold); font-family: var(--display); font-size: 22px; }
.lua-sep { color: var(--gold-soft); opacity: .6; margin: 0 4px; }

.lua-contagem { text-align: center; background: radial-gradient(120% 90% at 50% 0%, rgba(155,132,242,.16), transparent 70%), var(--surface); }
.lua-prox-titulo { font-family: var(--display); font-size: 28px; margin: 4px 0 14px; }
.lua-simb { color: var(--gold); }
.lua-relogio { display: flex; justify-content: center; gap: 10px; perspective: 400px; }
.lua-un { display: flex; flex-direction: column; align-items: center; gap: 6px; }
.lua-un small { color: var(--muted); font-size: 12px; letter-spacing: .08em; text-transform: uppercase; }
.lua-num { display: grid; place-items: center; width: 62px; height: 66px; border-radius: 12px; background: linear-gradient(180deg, var(--surface-2) 0 49%, rgba(0,0,0,.18) 50%, var(--surface-2) 51%); border: 1px solid var(--line); box-shadow: 0 0 18px rgba(216,181,106,.12) inset; }
.lua-num b { font-family: var(--display); font-size: 36px; color: var(--gold); font-variant-numeric: tabular-nums; line-height: 1; }
.lua-vira { animation: lua-vira .5s cubic-bezier(.3,.7,.4,1); transform-origin: 50% 50%; }
@keyframes lua-vira { 0% { transform: rotateX(-90deg); opacity: .2; } 60% { transform: rotateX(12deg); opacity: 1; } 100% { transform: rotateX(0); } }
.lua-prox-data { margin: 14px 0 0; }
@media (max-width: 360px) { .lua-num { width: 54px; height: 60px; } .lua-num b { font-size: 30px; } }

.lua-ritual { margin-top: 18px; }
.lua-passos { margin: 6px 0 14px; padding-left: 0; list-style: none; counter-reset: lp; }
.lua-passos li { counter-increment: lp; position: relative; padding: 8px 0 8px 40px; border-bottom: 1px solid var(--line); }
.lua-passos li:last-child { border-bottom: 0; }
.lua-passos li::before { content: counter(lp); position: absolute; left: 0; top: 8px; width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; font-family: var(--display); font-size: 17px; color: var(--bg); background: var(--gold); box-shadow: 0 0 12px rgba(216,181,106,.4); }
.lua-perg { font-family: var(--display); font-size: 20px; font-style: italic; border-left: 2px solid var(--violet); padding: 2px 0 2px 12px; margin: 0 0 16px; }
.lua-acoes { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.lua-fazer { position: relative; overflow: hidden; }
@media (prefers-reduced-motion: no-preference) {
  .lua-fazer::after { content: ""; position: absolute; inset: 0; background: linear-gradient(110deg, transparent 30%, rgba(255,255,255,.45) 50%, transparent 70%); transform: translateX(-100%); animation: lua-brilho 3.6s ease-in-out infinite 1s; }
}
@keyframes lua-brilho { 0%, 60% { transform: translateX(-100%); } 100% { transform: translateX(100%); } }
.lua-aviso { margin: 12px 0 0; }

.lua-cal { margin-top: 18px; }
.lua-lista { list-style: none; padding: 0; margin: 10px 0 0; }
.lua-item { display: grid; grid-template-columns: 34px 1fr; gap: 4px 12px; align-items: center; padding: 12px 0; border-bottom: 1px solid var(--line); }
.lua-item:last-child { border-bottom: 0; }
.lua-item .lua-ics { grid-column: 2; justify-self: start; margin-top: 4px; }
@media (prefers-reduced-motion: no-preference) { .lua-item { opacity: 0; animation: lua-entra .55s ease forwards; animation-delay: calc(var(--i) * 90ms + 200ms); } }
@keyframes lua-entra { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
.lua-item-txt { display: flex; flex-direction: column; gap: 2px; }
.lua-item-rit { color: var(--gold-soft); font-style: italic; }
.lua-mini { width: 30px; height: 30px; border-radius: 50%; align-self: start; margin-top: 2px; }
.lua-mini-cheia { background: radial-gradient(circle at 35% 35%, #fffaf0, #e3d3a6); box-shadow: 0 0 12px rgba(255,232,180,.55); }
.lua-mini-nova { background: radial-gradient(circle at 35% 35%, #2f2a50, #15122b); border: 1px solid rgba(216,181,106,.45); }

.lua-mail { margin-top: 22px; }

/* modo ritual em tela cheia */
.lua-modo { position: fixed; inset: 0; z-index: 9999; background: radial-gradient(90% 60% at 50% 20%, rgba(155,132,242,.18), transparent 70%), #07051a; color: var(--fg); display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 56px 22px 28px; opacity: 0; transition: opacity .3s ease; overflow-y: auto; }
.lua-modo[hidden] { display: none; }
.lua-modo.lua-modo-on { opacity: 1; }
.lua-modo-x { position: absolute; top: 12px; right: 14px; width: 42px; height: 42px; border-radius: 50%; border: 1px solid var(--line); background: transparent; color: var(--fg); font-size: 26px; line-height: 1; cursor: pointer; }
.lua-modo-pontos { position: absolute; top: 26px; left: 50%; transform: translateX(-50%); display: flex; gap: 6px; }
.lua-modo-pontos i { width: 7px; height: 7px; border-radius: 50%; background: var(--line); transition: background .3s; }
.lua-modo-pontos i.on { background: var(--gold); box-shadow: 0 0 8px rgba(216,181,106,.6); }
.lua-modo-tela { max-width: 460px; text-align: center; }
@media (prefers-reduced-motion: no-preference) { .lua-modo-tela { animation: lua-entra .45s ease; } }
.lua-modo-tela h2 { font-family: var(--display); font-size: 32px; margin: 8px 0 12px; }
.lua-modo-tela p { color: var(--muted); }
.lua-passo-txt { font-family: var(--display); font-size: 26px; line-height: 1.35; color: var(--fg) !important; margin: 12px 0; }
.lua-modo-nav { display: flex; gap: 12px; margin-top: 26px; }
.lua-resp { position: relative; width: 230px; height: 230px; margin: 18px auto 6px; display: grid; place-items: center; }
.lua-bola { position: absolute; width: 100%; height: 100%; border-radius: 50%; background: radial-gradient(circle at 40% 35%, rgba(255,240,205,.9), rgba(216,181,106,.55) 45%, rgba(155,132,242,.25) 75%, transparent 76%); box-shadow: 0 0 50px rgba(216,181,106,.35); transform: scale(.45); transition: transform 4s ease-in-out, opacity 4s ease-in-out; }
.lua-bola.lua-in { transform: scale(1); }
.lua-bola.lua-out { transform: scale(.45); }
@media (prefers-reduced-motion: reduce) { .lua-bola { transform: scale(.8) !important; transition: opacity 4s ease-in-out !important; } .lua-bola.lua-out { opacity: .35; } }
.lua-resp-txt { position: relative; font-family: var(--display); font-size: 26px; color: #1a1630; font-weight: 600; }
.lua-resp-tempo { font-variant-numeric: tabular-nums; font-size: 18px; color: var(--gold-soft) !important; }
