/* ============================================================================= TEMA VIGÍLIA — compilado a partir de theme.json (referência). Direção de criação: Verve · jun/2026 · casa KeepCoding. Este arquivo mostra como o MANIFESTO declarativo (theme.json) se materializa no contrato real do Atrium (apps/shell/src/styles.css). Espelha 1:1 a estrutura de .theme-keep. NÃO é instalação — é a forma compilada do pacote, pra você ver que o manifesto fecha com o mecanismo existente. Eixo de hue: --neutral-h 222 (petróleo frio) · --accent-h 62 (brasa âmbar), decouplados (fogo quente sobre noite fria). Acompanha: - skins.ts → SkinDef { key:"vigilia", accentHue:62, neutralHue:222, themeClass:"theme-vigilia" } - COLOR_THEMES (color-theme.tsx) se for ofertado como tema neutro no picker. ============================================================================= */ /* --- ESCURO (default do :root; aqui sobrepõe com a paleta bespoke) --------- */ .theme-vigilia { --accent-h: 62; --neutral-h: 222; --background: oklch(0.17 0.022 222); --foreground: oklch(0.92 0.012 222); --card: oklch(0.215 0.028 222); --card-foreground: oklch(0.92 0.012 222); --popover: oklch(0.235 0.03 222); --popover-foreground: oklch(0.94 0.01 222); --primary: oklch(0.76 0.155 62); --primary-foreground: oklch(0.18 0.04 60); --secondary: oklch(0.255 0.03 222); --secondary-foreground: oklch(0.92 0.012 222); --muted: oklch(0.225 0.026 222); --muted-foreground: oklch(0.66 0.022 222); --accent: oklch(0.32 0.05 62); --accent-foreground: oklch(0.94 0.01 222); --destructive: oklch(0.60 0.18 25); --destructive-foreground: oklch(0.99 0 0); --border: oklch(0.32 0.022 222); --input: oklch(0.27 0.022 222); --ring: oklch(0.76 0.155 62); } /* --- CLARO (.light vive no , .theme-vigilia no ancestral) ----- */ .theme-vigilia .light { --background: oklch(0.97 0.008 222); --foreground: oklch(0.26 0.025 230); --card: oklch(0.99 0.005 222); --card-foreground: oklch(0.26 0.025 230); --popover: oklch(1 0.003 222); --popover-foreground: oklch(0.26 0.025 230); --primary: oklch(0.60 0.14 55); --primary-foreground: oklch(0.99 0 0); --secondary: oklch(0.94 0.012 222); --secondary-foreground: oklch(0.28 0.025 230); --muted: oklch(0.945 0.01 222); --muted-foreground: oklch(0.50 0.02 230); --accent: oklch(0.92 0.03 55); --accent-foreground: oklch(0.28 0.025 230); --destructive: oklch(0.55 0.22 25); --destructive-foreground: oklch(0.99 0 0); --border: oklch(0.90 0.012 222); --input: oklch(0.915 0.012 222); --ring: oklch(0.60 0.14 55); } /* --- FUNDO VIVO (default .os-wallpaper) ------------------------------------ */ .theme-vigilia .os-wallpaper, .theme-vigilia .mob-shell.os-wallpaper, .theme-vigilia .mob-shell .os-wallpaper { background: /* a brasa acesa, no alto-direito — a janela do turno */ radial-gradient(90% 70% at 82% 8%, oklch(0.76 0.155 62 / 0.22), transparent 55%), /* refração fria embaixo — a neblina de petróleo */ radial-gradient(120% 110% at 12% 100%, oklch(0.30 0.05 200 / 0.40), transparent 60%), linear-gradient(160deg, oklch(0.18 0.024 222), oklch(0.12 0.016 230)); } .theme-vigilia .light .os-wallpaper, .theme-vigilia .light .mob-shell.os-wallpaper, .theme-vigilia .light .mob-shell .os-wallpaper { background: radial-gradient(90% 70% at 84% 6%, oklch(0.60 0.14 55 / 0.10), transparent 55%), linear-gradient(160deg, oklch(0.98 0.01 222), oklch(0.94 0.018 222)); } /* --- FUNDO SÓBRIO (.wallpaper-sobrio) — uma única luz no céu --------------- */ .wallpaper-sobrio.theme-vigilia .os-wallpaper, .theme-vigilia.wallpaper-sobrio .mob-shell .os-wallpaper, .theme-vigilia.wallpaper-sobrio .mob-shell.os-wallpaper { background: radial-gradient(140% 120% at 50% 42%, transparent 58%, oklch(0 0 0 / 0.30) 100%), radial-gradient(90% 70% at 50% -8%, oklch(0.76 0.155 62 / 0.14), transparent 70%), linear-gradient(168deg, oklch(0.17 0.022 222), oklch(0.115 0.014 230)); } .theme-vigilia.wallpaper-sobrio .light .os-wallpaper { background: radial-gradient(130% 120% at 50% 36%, transparent 58%, oklch(0.85 0.04 222 / 0.50) 100%), radial-gradient(95% 78% at 30% -8%, oklch(0.62 0.13 55 / 0.50), transparent 72%), linear-gradient(168deg, oklch(0.955 0.012 222), oklch(0.925 0.02 222)); } /* --- Menu/popover no escuro: superfície elevada fria + borda um degrau acima */ .theme-vigilia .dark .os-menu { background: oklch(0.235 0.03 222); border-color: oklch(0.34 0.022 222); } /* NOTA — Tom (profundo/médio/claro): herdado de graça. As regras html.tone-medio / html.tone-claro do styles.css re-derivam --background/--card/--popover a partir de --neutral-h (222) e vencem por especificidade (html.classe). Logo o Vigília ganha a escada de superfícies sem cravar nada: profundo = petróleo fundo (valores acima), médio/claro = petróleo progressivamente mais claro. */