/* ========================================================================== themes/portal.css — Apex Holding PURPOSE: World-SPECIFIC layout and decoration for the portal (index.html) and the 404 page. Nothing shared lives here. OWNS 1. Portal page atmosphere + no-script furniture 2. Preloader (5.0) — the mark drawing itself, the lift, the script-free hard expiry 3. Hero "The Summit" (5.1) — sky, three-layer ridge stack, grain, copy column, descend cue 4. The Apex Constellation — the signature set-piece (spec 4.5) 5. Threshold gallery (5.2) — expansion mechanics + viewport-edge wash 6. About + stat strip (5.3) 7. Founder seal clearance (5.4) 8. Highlights band (5.5) 9. 404 "Lost between worlds" 10. Reduced-motion additions for everything above RULES OBSERVED - The --w-* semantic tokens are DEFINED in tokens.css and only CONSUMED here. This file never redeclares one. (constellation.js writes --w-* inline on for the ambient world tint; that is a runtime value, not a declaration, and it is reverted on leave.) - Cross-world colour comes from the --world-*-{base,accent,text} lookup in tokens.css, never a raw hex. - Anything on a scroll or pointer path animates transform / opacity only. - Every hover-revealed string is also revealed on :focus-within, and is permanently visible wherever there is no hover (touch). - No rule here fights a shared rule; the three deliberate overrides of motion.css are each commented at the point of override. Loaded LAST, after motion.css. ========================================================================== */ /* -------------------------------------------------------------------------- 1. PAGE ATMOSPHERE + NO-SCRIPT FURNITURE -------------------------------------------------------------------------- */ /* A single low champagne bloom over the top of the document, so the page reads as one continuous night sky rather than a stack of bands. Painted as the body's own background-image rather than a pseudo-element: a negative z-index layer would be covered by the body's background box, and a positive one would sit over the content. Static, never animated. */ [data-world="portal"] body { background-image: radial-gradient( 120% 100% at 50% 0%, color-mix(in srgb, var(--w-accent) 10%, transparent), transparent 64% ); background-repeat: no-repeat; background-position: center top; background-size: 100% 120vh; } /* The two chrome slots hold only a