/** * glow.css — zero-JS neon baseline (always works). * When glow.js activates a GPU pass, dials CSS bloom down * so you don't double-light. Any app can theme via CSS variables. * * Tokens (override per brand / ionic.games theme): * --glow-bg, --glow-pink, --glow-lime, --glow-cyan, --glow-ambient */ :root { --glow-bg: #0c0810; --glow-pink: #ff2d55; --glow-lime: #39ff14; --glow-cyan: #00f2ff; --glow-ambient: 0.22; } /* CSS fallback wall (apps can replace url) */ .glow-wall, html.glow-app::before { content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none; background-color: var(--glow-bg); } /* Utility: additive tube text */ .glow-text { color: #fff; text-shadow: 0 0 4px #fff, 0 0 12px var(--glow-cyan), 0 0 28px var(--glow-cyan); } .glow-text-pink { text-shadow: 0 0 4px #fff, 0 0 12px var(--glow-pink), 0 0 28px var(--glow-pink); } .glow-text-lime { text-shadow: 0 0 4px #fff, 0 0 12px var(--glow-lime), 0 0 28px var(--glow-lime); } /* CSS bloom pool (fallback / no GPU) */ .glow-bloom { position: relative; } .glow-bloom::before { content: ""; position: absolute; inset: -20%; border-radius: 50%; pointer-events: none; z-index: -1; mix-blend-mode: plus-lighter; background: radial-gradient( circle closest-side, color-mix(in srgb, var(--glow-bloom-color, var(--glow-cyan)) 70%, #fff) 0%, color-mix(in srgb, var(--glow-bloom-color, var(--glow-cyan)) 30%, transparent) 50%, transparent 72% ); } @supports not (mix-blend-mode: plus-lighter) { .glow-bloom::before { mix-blend-mode: screen; } } /* GPU canvas layer (injected by glow.js) */ .glow-canvas { position: fixed; inset: 0; width: 100%; height: 100%; z-index: -1; pointer-events: none; display: block; } /* When GPU wall is live, hide CSS wall photo to avoid double image */ html[data-glow="gpu"]::before { background-image: none !important; filter: none !important; background-color: transparent !important; } html[data-glow="gpu"] .glow-bloom::before { opacity: 0.35; /* keep a little CSS tube, main light is shader */ } html[data-glow="css"] { /* explicit fallback mode */ }