/* ============================================================ VIMPACT — TOKENS · v2 Sistema BLANCO Y NEGRO PURO. Sin azul, sin acento cromático. >>> El único color de toda la página sale de las fotos reales de los trabajos. Cuando lleguen, van a ser lo único a color en un sitio en blanco y negro, y por eso lo único que el ojo busca. <<< No agregar acá: gradientes, glows, sombras de color, blobs. Los dos modos NO son "claro" y "oscuro": son DE DÍA y DE NOCHE. Un cartel vive de las dos maneras — de día refleja, de noche ilumina. ============================================================ */ :root { color-scheme: dark; /* --- NOCHE (por defecto) --- */ --fondo: #000000; --texto: #E6E6E6; --secundario: #C4C4C4; --borde: #2E2E2E; /* La cara del cartel está SIEMPRE encendida: es blanca de día y de noche, así que su texto es siempre negro. No depende del modo. */ --cartel-fondo: #FFFFFF; --cartel-texto: #111111; --cartel-tenue: #4A4A4A; --cartel-borde: #DCDCDC; /* Superficies de los campos del formulario. Un campo sin fondo propio sobre una página negra se lee como un agujero y no como algo donde escribir; estos tres negros lo separan del fondo sin encender nada. */ --campo-fondo: #0C0C0C; --campo-borde: #3A3A3A; --campo-foco: #141414; --campo-elegido: #1A1A1A; /* --- tipografía --- */ /* ANTON solo para display. Es la única que se lee como cartelería: la cartelería real usa condensadas porque el espacio es ancho y bajo y hay que meter palabras, y encima llena la superficie, que es lo que hace un cartel de verdad porque ese metro cuadrado se paga. Tiene un solo corte, así que no sirve para nada más. ARCHIVO para todo el resto: cuerpo, navegación, formularios. */ --display: "Anton", "Anton respaldo", "Arial Narrow", sans-serif; --sistema: "Archivo", "Archivo respaldo", Arial, sans-serif; /* El cuerpo va en 15px, no en 13: el público de Vimpact no son diseñadores. */ --cuerpo-tam: 15px; --cuerpo-alto: 1.55; /* Anton es estática: no tiene ejes. Los --display-wdth/wght de la v2 temprana salieron con Archivo y ya no aplican. */ --display-alto: 0.95; --display-track: -0.01em; --cuerpo-wdth: 100; --cuerpo-wght: 400; /* --- grilla --- */ --columnas: 12; --canaleta: 12px; --pad-x: clamp(16px, 4vw, 56px); --max-w: 1440px; --filete: 1px; /* --- movimiento --- Ninguna animación por encima de 300ms. Escalonado 40-80ms. Solo transform y opacity. */ --t-corto: 180ms; --t: 260ms; --t-largo: 300ms; --ease: cubic-bezier(0.22, 1, 0.36, 1); --escalonado: 55ms; } /* ------------------------------------------------------------ EL MODO DE DÍA: evaluado y descartado Se construyó completo —tokens claros, interruptor con forma de llave de luz, transición con View Transitions, preferencia guardada, y el script en línea en el para no tener destello en la carga— y se sacó entero. El motivo no es de gusto ni de peso: la portada es una escena de noche, con un cartel iluminado y gente en silueta mirándolo. Un cartel de vía pública se ve de noche porque está prendido. En modo de día esa escena deja de tener sentido: la foto sigue siendo de noche y el resto de la página es blanca, así que la página se contradice sola en el primer scroll. La superficie del cartel SÍ es blanca, y lo sigue siendo, porque está iluminada. Por eso los tokens --cartel-* de arriba no dependen de ningún modo. Esa es la única zona clara del sitio, y es la que hace de foco. Si alguna vez se quiere volver a poner, está en el historial: `git show web-v1 -- public/tokens.css public/modo.js`. ------------------------------------------------------------ */