mask-image:radial-gradient(circle at var(--mx) var(--my), #000 0%, rgba(0,0,0,.6) 14%, transparent 36%); mask-image:radial-gradient(circle at var(--mx) var(--my), #000 0%, rgba(0,0,0,.6) 14%, transparent 36%); transition:opacity .7s ease; } #day .glyph{ position:absolute; right:clamp(-1.5rem,-2.5vw,-0.5rem); top:clamp(8vh,12vh,14vh); font-family:"Rozha One",Georgia,serif; font-size:min(48vh,36rem); line-height:.85; color:var(--accent); opacity:.10; pointer-events:none; user-select:none; mix-blend-mode:screen; transform:translate3d(calc(var(--px) * -10px), calc(var(--py) * -8px), 0); transition:transform 1.2s cubic-bezier(.2,.7,.2,1); } #day .rule{ position:absolute; left:clamp(0.8rem,4vw,1.8rem); bottom:clamp(2rem,5vh,3rem); display:flex; align-items:baseline; gap:.8rem; flex-wrap:wrap; font-family:"Azeret Mono",ui-monospace,monospace; font-size:clamp(0.55rem,0.75vw,0.66rem); letter-spacing:.16em; text-transform:uppercase; color:var(--muted); pointer-events:none; opacity:calc(.12 + .8 * var(--wake)); transition:opacity .7s ease; } #day .rule b{ font-weight:400; color:var(--accent); } #day .rule span.sep{ opacity:.4; }

27 viii 2026· 87.3°F· 1015 hPa· 97% lit· 21.1°C ocean· irreversible