/* ══════════════════════════════════════════════════════════════════ advisor-sky.css — the "Open Sky" daylight theme. Filename kept for continuity; scope is now site-wide (formerly /advisor/ only). Loaded by page-header.php on every request where wpSkyTheme() returns non-empty. carries .theme-sky plus one intensity modifier: .theme-sky--landing full open sky (marketing / advisor landing) .theme-sky--calm calm sky (auth: login, register) .theme-sky--work palest sky (dashboards, buy-credits) Everything restyles through the vercel.css token layer wherever possible; component touch-ups below are the exceptions. ════════════════════════════════════════════════════════════════ */ /* ── Token flip ───────────────────────────────────────────────────── Same @layer tokens as vercel.css so the cascade story stays honest: the !important token declarations there can only be beaten from the same layer with higher specificity — body.theme-sky does that. */ @layer tokens { body.theme-sky { --bg: #cfe4fb !important; --bg-1: #dcebfc !important; --bg-2: rgba(255,255,255,0.32) !important; /* --alt section bands: faint frost */ --bg-3: #eef6ff !important; /* interactive blue reads as "ice, in daylight" */ --ice: #1f5fd0 !important; --violet: #6a55c8 !important; --cyan: #1a7ab8 !important; --text: #101c30 !important; --text-2: #3f5170 !important; --text-3: #5e6d8a !important; /* spec #71809c failed AA at 11px — darkened */ --success: #087f5b !important; /* light-theme success; #2effc0 is illegible on white */ --glow-ice: rgba(70,110,170,0.18) !important; /* soft shadow, not glow */ --glow-violet: rgba(106,85,200,0.14) !important; --edge: rgba(255,255,255,0.50) !important; --edge-h: rgba(255,255,255,0.70) !important; --edge-t: rgba(255,255,255,0.85) !important; /* bright top rim */ --hairline: rgba(16,28,48,0.10) !important; --ice-mark: rgba(31,95,208,0.55) !important; /* light glass recipe: white frost */ --glass: rgba(255,255,255,0.55) !important; --glass-2: rgba(255,255,255,0.65) !important; --glass-3: rgba(255,255,255,0.75) !important; --accent: var(--ice) !important; --accent-2: var(--violet) !important; --accent-3: var(--cyan) !important; --blue: var(--ice) !important; --purple: var(--violet) !important; --pink: #b0489a !important; --green: var(--success) !important; --muted: var(--text-2) !important; --border: rgba(16,28,48,0.12) !important; --border-h: rgba(16,28,48,0.22) !important; --line: rgba(16,28,48,0.12) !important; --surface: rgba(255,255,255,0.45) !important; --ink: #ffffff !important; /* text on accent surfaces: accent is deep blue now */ --vault: #dcebfc !important; --smoke: #101c30 !important; --slate: var(--text-2) !important; --brass: var(--ice) !important; --current: var(--ice) !important; } } /* ── Sky backdrops, by intensity ────────────────────────────────── These live in @layer reset on purpose: vercel's reset layer nails `html, html body { background:#050508 !important }`, and for !important declarations EARLIER layers win — so a components-layer gradient can never beat it. Same layer + higher specificity can. */ @layer reset { /* body carries the fixed sky gradient. HTML gets a solid sky-mid fallback so any pixel not covered by the gradient (headless-Chrome full-page screenshots hit this — background-attachment:fixed paints only the visible viewport, so below-fold falls through to , which vercel pins to #050508) still reads as sky, not navy. */ html:has(body.theme-sky) { background: #cfe4fb !important; } html:has(body.theme-sky--calm) { background: #dcebfc !important; } html:has(body.theme-sky--work) { background: #f2f8ff !important; } html body.theme-sky { background: linear-gradient(180deg, #8fbdf2 0%, #cfe4fb 52%, #eef6ff 100%) fixed !important; color: var(--text) !important; } html body.theme-sky--calm { background: linear-gradient(180deg, #aecff5 0%, #dcebfc 50%, #f0f7ff 100%) fixed !important; } html body.theme-sky--work { background: linear-gradient(180deg, #dcebfc 0%, #f2f8ff 45%, #f7fbff 100%) fixed !important; } } /* All component overrides live in @layer reset, NOT components: vercel puts !important rules in base AND components, and for !important EARLIER layers win — reset outranks both. (glacier is earlier still, but its rules are all data-zone-scoped and never match here.) */ @layer reset { /* ── Clouds: two fixed parallax layers, each a set of DISTINCT cumulus (clustered hard-stop radial gradients, lightly blurred) — not haze. Geometry: the layer spans -50vw..150vw, so the resting viewport is the 25%..75% band of the layer. Every cloud is placed inside 27%..72% and the drift is ±5% of the layer, so clouds are visible on a COLD LOAD and stay visible through the whole loop — including the reduced-motion static frame (rest position = clouds on show). v1 failure for the record: giant aspect-squashed gradients + blur(26px) + halved opacity rendered as flat tint, and half the blobs started outside the viewport. ── */ body.theme-sky::before, body.theme-sky::after { content: ''; position: fixed; left: -50vw; width: 200vw; pointer-events: none; z-index: 0; will-change: transform; } /* far layer: smaller, hazier, drifts left */ body.theme-sky::before { top: 2vh; height: 42vh; opacity: 0.7; filter: blur(13px); background: /* far cloud 1 */ radial-gradient(ellipse 4.5% 26% at 40% 24%, rgba(255,255,255,0.95) 0% 42%, rgba(255,255,255,0) 72%), radial-gradient(ellipse 3.2% 19% at 42.8% 30%, rgba(255,255,255,0.85) 0% 40%, rgba(255,255,255,0) 70%), /* far cloud 2 */ radial-gradient(ellipse 5% 28% at 58% 46%, rgba(255,255,255,0.95) 0% 44%, rgba(255,255,255,0) 72%), radial-gradient(ellipse 3.4% 20% at 55.4% 52%, rgba(255,255,255,0.82) 0% 40%, rgba(255,255,255,0) 70%), radial-gradient(ellipse 4.5% 16% at 58% 58%, rgba(196,217,242,0.45) 0% 38%, rgba(196,217,242,0) 68%), /* far cloud 3 */ radial-gradient(ellipse 4% 23% at 70.5% 20%, rgba(255,255,255,0.9) 0% 42%, rgba(255,255,255,0) 72%); animation: sky-drift-far 240s linear infinite alternate; } /* near layer: three big defined cumulus with #c4d9f2 undersides, drifts right */ body.theme-sky::after { top: 4vh; height: 52vh; opacity: 0.92; filter: blur(8px); background: /* cloud A — left of hero, high */ radial-gradient(ellipse 7% 30% at 30% 34%, #ffffff 0% 46%, rgba(255,255,255,0.9) 58%, rgba(255,255,255,0) 74%), radial-gradient(ellipse 5% 22% at 26.4% 42%, rgba(255,255,255,0.96) 0% 44%, rgba(255,255,255,0) 72%), radial-gradient(ellipse 5.4% 24% at 33.6% 41%, rgba(255,255,255,0.96) 0% 44%, rgba(255,255,255,0) 72%), radial-gradient(ellipse 8% 18% at 30% 50%, rgba(196,217,242,0.55) 0% 40%, rgba(196,217,242,0) 70%), /* cloud B — center-right, higher and wider */ radial-gradient(ellipse 8% 32% at 52.5% 22%, #ffffff 0% 46%, rgba(255,255,255,0.9) 58%, rgba(255,255,255,0) 74%), radial-gradient(ellipse 5.6% 24% at 48.4% 31%, rgba(255,255,255,0.95) 0% 44%, rgba(255,255,255,0) 72%), radial-gradient(ellipse 6% 25% at 56.6% 30%, rgba(255,255,255,0.95) 0% 44%, rgba(255,255,255,0) 72%), radial-gradient(ellipse 9% 18% at 52.5% 39%, rgba(196,217,242,0.5) 0% 40%, rgba(196,217,242,0) 70%), /* cloud C — right edge, lower */ radial-gradient(ellipse 6.4% 28% at 69% 56%, #ffffff 0% 46%, rgba(255,255,255,0.88) 58%, rgba(255,255,255,0) 74%), radial-gradient(ellipse 4.6% 21% at 65.8% 63%, rgba(255,255,255,0.94) 0% 44%, rgba(255,255,255,0) 72%), radial-gradient(ellipse 7% 16% at 69% 70%, rgba(196,217,242,0.5) 0% 40%, rgba(196,217,242,0) 70%); animation: sky-drift-near 120s linear infinite alternate; } @keyframes sky-drift-far { from { transform: translateX(0); } to { transform: translateX(-10vw); } } @keyframes sky-drift-near { from { transform: translateX(0); } to { transform: translateX(10vw); } } /* working screens: the same clouds as faint static wisps, near layer off */ body.theme-sky--work::before { opacity: 0.45; animation: none; } body.theme-sky--work::after { display: none; } /* reduced motion: parked at rest — which is designed to show clouds */ @media (prefers-reduced-motion: reduce) { body.theme-sky::before, body.theme-sky::after { animation: none; } } /* content sits above the cloud layers */ body.theme-sky main, body.theme-sky .auth-layout, body.theme-sky footer { position: relative; z-index: 1; } /* ── Nav on sky ── (!important below where the opponent is an UNLAYERED rule — page