/* * PlantIO · web (SSR publica) — tokens de diseno (F1-29b). * * Espejo conceptual de `app/src/shared/ui/theme/variables.css` (paleta, * escala tipografica, espaciado, radios, elevacion), sin variables de Ionic: * este paquete es Vike + Vue puro, no Ionic. Local a `web/public/` por ahora * (D-3): la consolidacion con la app en `packages/` sigue siendo deuda §26. * * Se sirve como CSS estatico externo (D-1): `style-src 'self'` de la CSP lo * cubre sin necesitar nonce. Cargado PRIMERO en el `` (antes de * `reset.css`/`ui.css`, que consumen estas variables). */ :root { /* Paleta corporativa (hex exactos — instruccion de organizacion + §21). */ --bg: #FAF8F4; --panel: #FFFFFF; --panel2: #F3EFE7; --line: #DDD6CA; --txt: #1A1D24; --grey: #5F6672; --gold: #0C7D72; --green: #1A8A4D; --orange: #C46F1E; --red: #CF4B3A; /* Tintes translucidos de estado, sobre fondo claro (opacidad subida para que se distingan sobre --bg/--panel, sin salir de la paleta). */ --green-tint: rgba(26, 138, 77, 0.14); --orange-tint: rgba(196, 111, 30, 0.16); --red-tint: rgba(207, 75, 58, 0.14); --gold-tint: rgba(12, 125, 114, 0.12); /* Tipografia: interfaz en Archivo (auto-hospedada, D-7), cae a system-ui. */ --font-sans: 'Archivo Variable', 'Archivo', system-ui, sans-serif; --font-serif: Georgia, 'Times New Roman', serif; /* Escala tipografica — 12 / 14 / 16 / 20 / 26 / 34. */ --fs-1: 12px; --fs-2: 14px; --fs-3: 16px; --fs-4: 20px; --fs-5: 26px; --fs-6: 34px; /* Rejilla de espaciado de 8. */ --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px; --sp-5: 24px; --sp-6: 32px; --sp-7: 40px; --sp-8: 48px; --screen-pad: 20px; /* Radios. */ --r-control: 12px; --r-card: 16px; --r-sheet: 24px; --r-pill: 999px; /* Elevacion suave (sombras, no bordes duros). */ --e-0: none; --e-1: 0 1px 2px rgba(26, 29, 36, 0.06), 0 1px 3px rgba(26, 29, 36, 0.1); --e-2: 0 4px 12px rgba(26, 29, 36, 0.1); } /* Archivo, autohospedada (D-7): binario ya colocado en `public/fonts/` por el coordinador (provenance: @fontsource-variable/archivo, OFL). Cubierto por `font-src 'self'` (ya presente en `server/csp.ts`, sin cambio de CSP). Ruta self, nunca remota — la CSP no autoriza otros origenes. */ @font-face { font-family: 'Archivo Variable'; src: url('/fonts/archivo-latin-wght-normal.woff2') format('woff2-variations'); font-weight: 100 900; font-style: normal; font-display: swap; } /* Tema oscuro (D-4, confirmado): solo variables, coherente con la app. Contraste AA sobre --bg/--panel; verificacion visual en navegador. */ @media (prefers-color-scheme: dark) { :root { --bg: #14171C; --panel: #1D2128; --panel2: #262B33; --line: #363C46; --txt: #F1EFE8; --grey: #A7AEBB; --gold: #2FB3A5; --green: #3FCB7F; --orange: #E08A3D; --red: #E9695A; --green-tint: rgba(63, 203, 127, 0.18); --orange-tint: rgba(224, 138, 61, 0.2); --red-tint: rgba(233, 105, 90, 0.18); --gold-tint: rgba(47, 179, 165, 0.16); --e-1: 0 1px 2px rgba(0, 0, 0, 0.3), 0 1px 3px rgba(0, 0, 0, 0.4); --e-2: 0 4px 12px rgba(0, 0, 0, 0.45); } }