/* OJAI · Patrón «Atardecer»: halo cálido sobre fondo de atardecer.
   Nace de la respiración del santuario. Se usa solo donde el cuerpo practica:
   respirar (Vívela «Llegar» y «Practícalo», Ritual), el cierre y el ritual de los sentidos.
   Desde el 19 sep 2026 también viste la página «Hoy» desde las 18:00 hasta el amanecer.
   Documentación: BRAND/OJAI_PATRON_ATARDECER_V1.md */
:root{
 --atardecer-noche:var(--o-ciruela);   /* ciruela profundo: arriba, donde va el texto */
 --atardecer-rosa:var(--o-rosa);    /* rosa de la tarde */
 --atardecer-durazno:var(--o-durazno); /* el sol que se esconde */
 --halo-claro:var(--o-halo);        /* centro del halo */
 --halo-calido:var(--o-halo-calido);       /* borde del halo */
 --tinta-atardecer:var(--o-crema);   /* texto sobre el atardecer (contraste ≥ 7:1 sobre ciruela) */
 --tinta-atardecer-suave:var(--o-i-durazno-92);
 --crema-atardecer:#fff6ee;
 --respira-ease:cubic-bezier(.37,0,.63,1);
 --respira-in:4s;
 --respira-out:6s;
}

/* 1 · Pantalla de práctica: el cielo de la tarde. El texto vive en la parte alta (ciruela); el sol, abajo. */
.viv-atardecer{position:relative;overflow:hidden;isolation:isolate;border-left:0!important;color:var(--tinta-atardecer);
 background:linear-gradient(180deg,var(--atardecer-noche) 0%,#5a3052 38%,var(--atardecer-rosa) 66%,#c9786e 86%,var(--atardecer-durazno) 100%)}
.viv-atardecer::before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;
 background:radial-gradient(120% 60% at 50% 115%,#ffd9b080 0%,transparent 60%),radial-gradient(2px 2px at 18% 14%,#fff8 50%,transparent 51%),radial-gradient(1.5px 1.5px at 72% 9%,#fff6 50%,transparent 51%),radial-gradient(1.5px 1.5px at 86% 26%,#fff5 50%,transparent 51%),radial-gradient(2px 2px at 34% 30%,#fff4 50%,transparent 51%)}
.viv-atardecer h4,.viv-atardecer p{color:var(--tinta-atardecer)}
.viv-atardecer .viv-paso{color:var(--tinta-atardecer-suave)!important;opacity:.9}
.viv-atardecer .viv-pregunta{color:var(--tinta-atardecer)}
.viv-atardecer textarea{background:#fffaf5eb;border-color:#ffffff66;color:var(--o-i-lila-21)}
.viv-atardecer textarea::placeholder{color:var(--o-i-lila-45)}

/* El sol: un halo cálido que respira muy lento detrás de todo */
.atardecer-sol{position:absolute;left:50%;bottom:-120px;width:420px;height:420px;margin-left:-210px;border-radius:50%;z-index:-1;pointer-events:none;
 background:radial-gradient(circle,var(--halo-claro) 0%,#ffe7c4cc 18%,#ffd9b066 42%,transparent 68%);filter:blur(10px);opacity:.75;
 animation:atardecer-sol 12s var(--respira-ease) infinite}
@keyframes atardecer-sol{0%,100%{transform:scale(.94);opacity:.65}50%{transform:scale(1.04);opacity:.85}}

/* 2 · El orbe sobre el atardecer: vidrio con luz de tarde (no del color de la emoción) */
.viv-atardecer .emo-breath,.atardecer-panel .emo-breath{color:var(--tinta-atardecer)}
.viv-atardecer .emo-breath::before,.atardecer-panel .emo-breath::before{background:radial-gradient(circle,var(--o-arena) 0%,#ffd9b099 30%,#f0a77d33 55%,transparent 70%);filter:blur(18px);opacity:.8}
.viv-atardecer .emo-breath-ring,.atardecer-panel .emo-breath-ring{border-color:#fff3d9a6;
 background:radial-gradient(circle at 34% 28%,#fffaf0e6 0%,#fff3d980 24%,#ffd9b033 58%,#f0a77d38 100%);
 box-shadow:inset 0 0 28px #fff3d999,inset 0 -12px 26px #f0a77d40,0 0 48px #ffd9b066}
.viv-atardecer .emo-breath::after,.atardecer-panel .emo-breath::after{border-color:#fff3d9cc}
.viv-atardecer .emo-breath-label,.atardecer-panel .emo-breath-label{color:var(--o-i-lila-21);font-weight:600}
.viv-atardecer .emo-breath[data-phase=in]::before,.atardecer-panel .emo-breath[data-phase=in]::before{opacity:1;transform:scale(1.25)}

/* 3 · El Ritual de Prácticas: el mismo cielo, en un panel */
.atardecer-panel{position:relative;overflow:hidden;isolation:isolate;border-radius:26px;padding:26px 24px;color:var(--tinta-atardecer);
 background:linear-gradient(180deg,var(--atardecer-noche) 0%,var(--atardecer-rosa) 62%,var(--atardecer-durazno) 100%)}
.atardecer-panel .emo-step,.atardecer-panel .emo-step-count{color:var(--tinta-atardecer)}
.atardecer-panel .emo-btn{background:var(--o-crema);border-color:var(--o-crema);color:var(--o-ciruela)}
.atardecer-panel .emo-btn.ghost{background:transparent;border-color:#fff8f1aa;color:var(--tinta-atardecer)}
.atardecer-panel .atardecer-sol{bottom:-160px}

/* 4 · El cierre: la luz que queda después del atardecer (crema y durazno, texto oscuro) */
.viv-cierre{border-left:0!important;background:radial-gradient(90% 70% at 50% 110%,#ffd9b0aa 0%,transparent 60%),linear-gradient(180deg,var(--crema-atardecer) 0%,#ffe9d9 100%)!important}
.viv-cierre h4{color:var(--o-i-lila-21)}

/* 5 · Ritual de los sentidos y mirada compasiva: calidez de tarde */
.cam-sentidos{background:linear-gradient(180deg,var(--o-crema-luz) 0%,var(--o-i-durazno-95) 100%);border-color:var(--o-halo-calido)}
.cam-sentidos summary{position:relative}
.cam-sentidos summary .cam-tipo::before{content:'';display:inline-block;width:10px;height:10px;margin-right:8px;border-radius:50%;vertical-align:-1px;background:radial-gradient(circle,var(--halo-claro),var(--atardecer-durazno));box-shadow:0 0 10px var(--halo-calido)}
.cam-sentidos dt{color:#a0524a}
.cam-mirada{background:linear-gradient(135deg,var(--o-crema-luz) 0%,var(--o-i-durazno-95) 100%)}

/* 6 · La página «Hoy» desde las 18:00 hasta el amanecer (rituales.js marca data-atardecer). Las tarjetas se quedan como están. */
html body[data-view=rituales]:has(.rit-page[data-atardecer=true]){color:var(--tinta-atardecer);background:var(--atardecer-noche) linear-gradient(180deg,var(--atardecer-noche) 0%,#5a3052 38%,var(--atardecer-rosa) 66%,#c9786e 86%,var(--atardecer-durazno) 100%) fixed}
html body[data-view=rituales]:has(.rit-page[data-atardecer=true]) footer{color:var(--tinta-atardecer-suave);border-color:#ffffff33}
.rit-page[data-atardecer=true] .rit-hero{color:var(--tinta-atardecer)}
.rit-page[data-atardecer=true] .rit-hero>div:first-child .rit-kicker{color:var(--tinta-atardecer-suave)}
.rit-page[data-atardecer=true] .rit-hero>div:first-child em{color:var(--halo-calido)}
.rit-page[data-atardecer=true] .rit-hoy{background:#3a2447e6;box-shadow:0 20px 60px #f0a77d33,inset 0 0 0 1px #fff3d926}

/* Accesibilidad: sin movimiento si la persona lo pidió; el cielo sigue ahí, quieto */
@media (prefers-reduced-motion:reduce){.atardecer-sol{animation:none}}
body[data-ojai-motion=off] .atardecer-sol{animation:none}
@media (max-width:560px){.atardecer-sol{width:320px;height:320px;margin-left:-160px;bottom:-100px}.atardecer-panel{padding:22px 16px}}

/* 6b · Legibilidad del atardecer · 20 sep 2026.
   Al encender el atardecer (18:00 → amanecer) la tinta clara del cielo se heredaba DENTRO
   de las tarjetas claras y dejaba 54 textos ilegibles (contraste 1.02): el título «El minuto
   de la mañana», las 17 frases del cuerpo, «Sembrar, pausar, soltar», la ficha de la semana…
   Regla: quien lleva fondo claro manda tinta oscura; solo lo oscuro lleva tinta de cielo.
   Solo en la franja «tarde» (atardecer encendido, tarjetas todavía claras). A partir de
   las 21:00 («noche» y «silencio») rituales.css ya oscurece las tarjetas y pone su propia
   tinta clara; si este bloque siguiera mandando ahí, pintaría lila sobre oscuro (corregido
   el 20 sep a las 22:10, cuando se vio en modo silencio).
   «.rc-avisos» NO es una caja clara: es blanco al 8 % sobre la caja oscura de avisos, así que
   lleva tinta de cielo como ella (corregido el 20 sep, 22:30).
   Las cajas están listadas a mano porque .rit-semana y .rit-regalo pintan su fondo con
   degradado (background-image), no con background-color. */
.rit-page[data-atardecer=true]:not([data-momento=noche]):not([data-momento=silencio]) :is(.rit-section,.rit-ficha):not(.rit-noche){color:var(--o-ciruela-media)}
.rit-page[data-atardecer=true]:not([data-momento=noche]):not([data-momento=silencio]) :is(.rit-section,.rit-ficha):not(.rit-noche) :is(h2,h3,h4,p,li,dt,dd,span,label,summary,strong){color:inherit}
.rit-page[data-atardecer=true]:not([data-momento=noche]):not([data-momento=silencio]) :is(.rit-section,.rit-ficha):not(.rit-noche) :is(.rit-kicker,.rit-tip,small){color:var(--o-lavanda)}
.rit-page[data-atardecer=true]:not([data-momento=noche]):not([data-momento=silencio]) .rit-section:not(.rit-noche) em{color:var(--o-rosa)}
/* Las cajas oscuras dentro de una sección clara conservan la tinta del cielo */
.rit-page[data-atardecer=true]:not([data-momento=noche]):not([data-momento=silencio]) .rit-section:not(.rit-noche) .rit-avisos{color:var(--tinta-atardecer)}
.rit-page[data-atardecer=true]:not([data-momento=noche]):not([data-momento=silencio]) .rit-section:not(.rit-noche) .rit-avisos :is(p,.rit-kicker,.rit-tip,small){color:var(--tinta-atardecer-suave)}
.rit-page[data-atardecer=true]:not([data-momento=noche]):not([data-momento=silencio]) .rit-section:not(.rit-noche) .rit-avisos .rc-avisos :is(p,.rc-mini,small,label){color:var(--tinta-atardecer)}
.rit-page[data-atardecer=true]:not([data-momento=noche]):not([data-momento=silencio]) .rit-section:not(.rit-noche) .rit-avisos .rc-avisos :is(.rc-kicker){color:var(--halo-calido)}