gioser-web: ambient page bg: blur(60px) + centered gradient for seamless glow
- filter: blur(60px) so the radial-gradient is a soft uniform glow, no visible circle or division - Centered at 50% 50%, opacity 0.30→0.60 breathe
Semántico sayk'uy
Mana ima sutichaypas t'ikrakurqanchu: qillqalla, yachachiylla utaq willaylla t'ikrakurqan.
1 qillqakuna · +8 −6
diff --git a/crates/apps/gioser-web/styles.css b/crates/apps/gioser-web/styles.css
index bee8dc0..7914b5b 100644
--- a/crates/apps/gioser-web/styles.css
+++ b/crates/apps/gioser-web/styles.css
@@ -232,26 +232,28 @@ body.deck-active-tierra .deck { --deck-glow: rgba(212, 152, 115, 0.24); }
pointer-events: none;
z-index: 0;
transition: opacity 2s ease;
+ filter: blur(60px);
+ opacity: 0.5;
}
.deck-page[data-element="aire"] .page-ambience {
- background: radial-gradient(circle at 50% 60%, rgba(208,219,255,0.18), transparent 70%);
+ background: radial-gradient(circle at 50% 50%, rgba(208,219,255,0.22), transparent 60%);
animation: page-breathe 8s ease-in-out infinite alternate;
}
.deck-page[data-element="fuego"] .page-ambience {
- background: radial-gradient(circle at 50% 80%, rgba(245,144,86,0.22), transparent 70%);
+ background: radial-gradient(circle at 50% 50%, rgba(245,144,86,0.22), transparent 60%);
animation: page-breathe 6s ease-in-out infinite alternate;
}
.deck-page[data-element="agua"] .page-ambience {
- background: radial-gradient(circle at 50% 80%, rgba(108,208,243,0.18), transparent 70%);
+ background: radial-gradient(circle at 50% 50%, rgba(108,208,243,0.22), transparent 60%);
animation: page-breathe 10s ease-in-out infinite alternate;
}
.deck-page[data-element="tierra"] .page-ambience {
- background: radial-gradient(circle at 50% 85%, rgba(140,100,60,0.22), transparent 70%);
+ background: radial-gradient(circle at 50% 50%, rgba(140,100,60,0.22), transparent 60%);
animation: page-breathe 7s ease-in-out infinite alternate;
}
@keyframes page-breathe {
- from { opacity: 0.35; }
- to { opacity: 0.80; }
+ from { opacity: 0.30; }
+ to { opacity: 0.60; }
}
/* Head + controls — fijos en el deck, no dentro de la página */