/* Wow theme (public pages): Ink Paper + Electric Accent. Opt-in via . */ body.public-theme-wow { --ds-bg: #f8f9ff; --ds-surface: rgba(2, 6, 23, 0.03); --ds-surface-2: rgba(2, 6, 23, 0.06); --ds-border: rgba(2, 6, 23, 0.14); --ds-text: rgba(2, 6, 23, 0.92); --ds-text-muted: rgba(2, 6, 23, 0.72); --ds-text-dim: rgba(2, 6, 23, 0.56); --ds-accent: #2563eb; --ds-accent-2: #7c3aed; --ds-font: "Onest", ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, "Noto Sans", "Liberation Sans", sans-serif; --ds-font-display: "Onest", ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, "Noto Sans", "Liberation Sans", sans-serif; --ds-font-mono: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; } /* Paper background + signature gradient + grain overlay */ body.public-theme-wow { background: var(--ds-bg); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; background-image: radial-gradient(900px 420px at 18% -10%, rgba(37, 99, 235, 0.18), transparent 60%), radial-gradient(760px 420px at 90% 0%, rgba(124, 58, 237, 0.14), transparent 58%), linear-gradient(180deg, rgba(2, 6, 23, 0.018), transparent 120px); } body.public-theme-wow::before { content: ""; position: fixed; inset: 0; pointer-events: none; z-index: 0; opacity: 0.032; mix-blend-mode: multiply; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120' viewBox='0 0 120 120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)' opacity='.35'/%3E%3C/svg%3E"); background-size: 180px 180px; } /* Ensure content sits above grain layer */ body.public-theme-wow .ds-topbar, body.public-theme-wow .ds-main, body.public-theme-wow footer { position: relative; z-index: 1; } /* Topbar: sharper, more "ink" */ body.public-theme-wow .ds-topbar { background: rgba(248, 249, 255, 0.78); backdrop-filter: blur(16px); border-bottom-color: rgba(2, 6, 23, 0.10); } body.public-theme-wow .ds-brand { font-family: var(--ds-font-display); letter-spacing: -0.2px; } body.public-theme-wow .ds-brand__dot { background: linear-gradient(135deg, var(--ds-accent), var(--ds-accent-2)); box-shadow: 0 0 0 6px rgba(37, 99, 235, 0.10), 0 14px 28px rgba(37, 99, 235, 0.14); } /* Kicker dot gets a tiny "electric" hint */ body.public-theme-wow .ds-kicker--dot::before { background: linear-gradient(135deg, var(--ds-accent), var(--ds-accent-2)); opacity: 0.82; } /* Typography: slightly tighter, more editorial */ body.public-theme-wow .ds-h1, body.public-theme-wow .ds-h2, body.public-theme-wow .ui-card__title { font-family: var(--ds-font-display); letter-spacing: -0.5px; } /* Cards: paper + inset highlight + ambient shadow */ body.public-theme-wow .ui-card, body.public-theme-wow .academy-card, body.public-theme-wow .public-trainer__card { background: rgba(255, 255, 255, 0.82); border-color: rgba(2, 6, 23, 0.12); box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8) inset, 0 24px 60px rgba(2, 6, 23, 0.06); } /* Buttons: ink primary, luxe hover */ body.public-theme-wow .ui-btn { background: rgba(255, 255, 255, 0.86); border-color: rgba(2, 6, 23, 0.12); color: var(--ds-text); transform: none; transition: background 140ms ease, border-color 140ms ease, box-shadow 140ms ease; } body.public-theme-wow .ui-btn:hover { background: rgba(255, 255, 255, 1); border-color: rgba(2, 6, 23, 0.18); box-shadow: 0 10px 24px rgba(2, 6, 23, 0.08); } body.public-theme-wow .ui-btn--primary { background: linear-gradient(180deg, rgba(2, 6, 23, 0.92), rgba(2, 6, 23, 0.98)); border-color: rgba(2, 6, 23, 0.92); color: rgba(255, 255, 255, 0.96); box-shadow: 0 1px 0 rgba(255, 255, 255, 0.10) inset, 0 22px 50px rgba(2, 6, 23, 0.18); } body.public-theme-wow .ui-btn--primary:hover { background: linear-gradient(180deg, rgba(2, 6, 23, 0.88), rgba(2, 6, 23, 1)); border-color: rgba(2, 6, 23, 1); box-shadow: 0 1px 0 rgba(255, 255, 255, 0.12) inset, 0 26px 60px rgba(2, 6, 23, 0.22); } /* Chips: premium hover (only in WOW) */ body.public-theme-wow .ds-chip { transition: background 140ms ease, border-color 140ms ease, box-shadow 140ms ease, transform 140ms ease; } body.public-theme-wow a.ds-chip:hover, body.public-theme-wow button.ds-chip:hover { background: rgba(255, 255, 255, 0.96); border-color: rgba(2, 6, 23, 0.18); box-shadow: 0 10px 24px rgba(2, 6, 23, 0.06); } body.public-theme-wow a.ds-chip:active, body.public-theme-wow button.ds-chip:active { transform: translateY(0.5px); } /* Inputs: crisp focus, no muddy glow */ body.public-theme-wow .ui-input { background: rgba(255, 255, 255, 0.92); border-color: rgba(2, 6, 23, 0.14); color: var(--ds-text); } body.public-theme-wow .ui-input:focus { border-color: rgba(37, 99, 235, 0.55); box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.14); } /* Accent underline: punchier by default */ body.public-theme-wow .ds-accent-underline { --ds-accent-underline-bg: rgba(37, 99, 235, 0.22); --ds-accent-underline-height: 0.24em; --ds-accent-underline-bottom: 0.06em; --ds-accent-underline-side: 0.08em; } /* Section bar: slightly more "electric" */ body.public-theme-wow .ds-section-title { --ds-section-bar-bg: rgba(37, 99, 235, 0.55); } @media print { body.public-theme-wow { background: #ffffff !important; background-image: none !important; color: #000 !important; } body.public-theme-wow::before { display: none !important; } body.public-theme-wow .ui-card, body.public-theme-wow .ui-btn, body.public-theme-wow .ds-topbar, body.public-theme-wow footer { box-shadow: none !important; background: transparent !important; } }