/* PATCH 327 — shared PZ theme tokens One source of truth for neon accent colors. theme.js places exactly one theme-* class on , and every component can consume these variables. */ :root, body.theme-neon, body[data-theme="neon"] { --main-neon-color: #c85cff; --main-neon-color-2: #ff4fd8; --main-neon-color-contrast: #ffffff; --main-neon-glow-strong: color-mix(in srgb, var(--main-neon-color) 58%, transparent); --main-neon-glow: color-mix(in srgb, var(--main-neon-color) 32%, transparent); --main-neon-soft: color-mix(in srgb, var(--main-neon-color) 16%, transparent); --main-neon-faint: color-mix(in srgb, var(--main-neon-color) 8%, transparent); --main-neon-line: color-mix(in srgb, var(--main-neon-color) 28%, transparent); --main-neon-gradient: linear-gradient(135deg, var(--main-neon-color), var(--main-neon-color-2)); } body.theme-pink, body[data-theme="pink"] { --main-neon-color: #ff4f8f; --main-neon-color-2: #ff62dc; --main-neon-color-contrast: #ffffff; --main-neon-glow-strong: color-mix(in srgb, var(--main-neon-color) 58%, transparent); --main-neon-glow: color-mix(in srgb, var(--main-neon-color) 32%, transparent); --main-neon-soft: color-mix(in srgb, var(--main-neon-color) 16%, transparent); --main-neon-faint: color-mix(in srgb, var(--main-neon-color) 8%, transparent); --main-neon-line: color-mix(in srgb, var(--main-neon-color) 28%, transparent); --main-neon-gradient: linear-gradient(135deg, var(--main-neon-color), var(--main-neon-color-2)); } body.theme-lite, body[data-theme="lite"] { --main-neon-color: #a78be0; --main-neon-color-2: #ded8e8; --main-neon-color-contrast: #ffffff; --main-neon-glow-strong: color-mix(in srgb, var(--main-neon-color) 30%, transparent); --main-neon-glow: color-mix(in srgb, var(--main-neon-color) 20%, transparent); --main-neon-soft: color-mix(in srgb, var(--main-neon-color) 11%, transparent); --main-neon-faint: color-mix(in srgb, var(--main-neon-color) 5%, transparent); --main-neon-line: color-mix(in srgb, var(--main-neon-color) 20%, transparent); --main-neon-gradient: linear-gradient(135deg, #1a1820, var(--main-neon-color)); } /* Shared controls consume the same theme tokens. */ body .theme-switcher__options button.is-active, body .theme-switcher__options button[aria-pressed="true"] { border-color: var(--main-neon-line) !important; background: var(--main-neon-gradient) !important; box-shadow: 0 0 18px var(--main-neon-glow) !important; } body .theme-switcher.theme-switcher--compact .theme-switcher__options button[data-theme-option="pink"].is-unavailable, body .theme-switcher__options button[data-theme-option="pink"].is-unavailable { display: flex !important; opacity: .45 !important; cursor: not-allowed !important; transform: none !important; } body .theme-switcher__options button.is-unavailable small { opacity: 1; } /* PATCH 333 — one avatar palette for every profile surface. Pulse follows the active site theme; named presets intentionally keep their own identity. All avatar widgets consume these variables. */ .pz-avatar--pulse { --pz-avatar-primary: var(--main-neon-color); --pz-avatar-mid: color-mix(in srgb, var(--main-neon-color) 30%, #09040e 70%); --pz-avatar-dark: #08030d; --pz-avatar-line: color-mix(in srgb, var(--main-neon-color) 58%, transparent); --pz-avatar-glow: color-mix(in srgb, var(--main-neon-color) 34%, transparent); } .pz-avatar--void { --pz-avatar-primary: #8b65ff; --pz-avatar-mid: #151129; --pz-avatar-dark: #020207; --pz-avatar-line: color-mix(in srgb, #8b65ff 58%, transparent); --pz-avatar-glow: color-mix(in srgb, #8b65ff 34%, transparent); } .pz-avatar--sakura { --pz-avatar-primary: #ff66cf; --pz-avatar-mid: #4d153d; --pz-avatar-dark: #0c0309; --pz-avatar-line: color-mix(in srgb, #ff66cf 58%, transparent); --pz-avatar-glow: color-mix(in srgb, #ff66cf 34%, transparent); } .pz-avatar--signal { --pz-avatar-primary: #67d8ff; --pz-avatar-mid: #13394d; --pz-avatar-dark: #03090d; --pz-avatar-line: color-mix(in srgb, #67d8ff 58%, transparent); --pz-avatar-glow: color-mix(in srgb, #67d8ff 34%, transparent); } .pz-avatar--core { --pz-avatar-primary: #ff6b8f; --pz-avatar-mid: #4b1625; --pz-avatar-dark: #0d0306; --pz-avatar-line: color-mix(in srgb, #ff6b8f 58%, transparent); --pz-avatar-glow: color-mix(in srgb, #ff6b8f 34%, transparent); } .pz-avatar--mono { --pz-avatar-primary: #e8e8ef; --pz-avatar-mid: #383842; --pz-avatar-dark: #070709; --pz-avatar-line: color-mix(in srgb, #e8e8ef 48%, transparent); --pz-avatar-glow: color-mix(in srgb, #e8e8ef 24%, transparent); }