/* ═══════════════════════════════════════════════════════════════════════════ COSMERIUM ERA III · NCRT-3 reset.css — Normalización sobria. Se carga DESPUÉS de tokens.css y ANTES de chrome.css. Criterio: este fichero no decide nada de estética. Solo (a) borra los defaults del navegador que estorban, (b) impone las tres reglas de accesibilidad que DESIGN declara obligatorias en toda la aplicación —tabular-nums, :focus-visible ámbar y cursores sensatos—, y (c) cierra la puerta al scroll horizontal del body. Casi todo va envuelto en :where() a propósito: eso deja la especificidad del reset en 0,0,0 y garantiza que cualquier regla de components.css o de una página gane siempre, sin peleas ni !important. ═══════════════════════════════════════════════════════════════════════════ */ /* ───────────────────────── CAJA ───────────────────────── */ *,*::before,*::after{ box-sizing: border-box; } /* ───────────────────────── RAÍZ ───────────────────────── overflow-x: clip, NO hidden. Es la diferencia entre que funcione el chasis y que no: `overflow-x: hidden` fuerza overflow-y a auto y convierte al body en contenedor de scroll, lo que rompe todos los position:sticky del producto —la cabecera de .reg-table (§6.5), el raíl izquierdo y el raíl de derivadas del expediente (§10.4), el índice del MOC (§10.11)—. `clip` no crea contenedor de scroll: recorta y punto. Ese es el arreglo. La regla dura de §6.5 se cumple igual: el no hace scroll horizontal jamás; el desbordamiento lo gestiona cada tabla en su propio contenedor. */ html{ overflow-x: clip; -webkit-text-size-adjust: 100%; text-size-adjust: 100%; scroll-behavior: smooth; /* anulado bajo prefers-reduced-motion en tokens.css */ /* DESIGN §4.5: el cero rasgado de IBM Plex Mono. Se declara en la raíz y no componente a componente porque la regla es "los números de un expediente no bailan" y eso no admite excepciones por descuido. De las seis familias del stack, ss01 solo existe en IBM Plex Mono; las otras cinco ignoran la petición sin efecto secundario. Y como aquí solo se nombra ss01, el tabular-nums de abajo (feature `tnum`) sigue aplicándose. */ font-feature-settings: "ss01"; } /* ───────────────────────── CUERPO ───────────────────────── 100dvh y nunca 100vh (Anexo B.13): en iOS Safari 100vh incluye la barra de direcciones, y con el teclado virtual abierto recorta el formulario sin posibilidad de scroll. Ese bug ya existía en el portal antiguo. */ body{ margin: 0; min-height: 100dvh; overflow-x: clip; background-color: var(--bg); color: var(--text); font-family: var(--ff-ui); font-size: var(--fs-md); font-weight: 500; line-height: var(--lh-ui); /* Obligatorio en TODA la aplicación (§4.5). Al heredarse desde el body, cualquier cifra de cualquier pantalla queda en ancho fijo por defecto y una tabla de 744 ítems no tiembla al pasar de página. */ font-variant-numeric: tabular-nums; /* Hueso claro sobre carbón engorda el trazo en macOS. Antialiased lo devuelve al peso con el que está diseñada la escala tipográfica. */ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; /* §11.2: se elimina el `cursor: crosshair` global del repo antiguo. En una web mayoritariamente de formularios rompía la selección de texto y contradecía la ficción de documento oficial. */ cursor: default; /* El transporte del viraje rojo→cian del sellado (§10.7). Solo color: no se transiciona background-color del body porque repinta el lienzo entero. */ transition: color var(--d-heavy) var(--ez-term); } /* ───────────── MÁRGENES Y BLOQUES DE TEXTO ───────────── Se anulan todos. La composición la decide el layout, nunca el user agent. Los títulos no heredan tamaño ni peso del navegador: la escala modular de §4.2 es la única fuente de tamaños, y así un

mal elegido por semántica no arrastra un cuerpo equivocado. / :where(h1,h2,h3,h4,h5,h6,p,figure,blockquote,dl,dd,pre,fieldset){ margin: 0; } :where(h1,h2,h3,h4,h5,h6){ font-size: inherit; font-weight: inherit; line-height: var(--lh-display); text-wrap: balance; / titulares sin viudas; degrada sin efecto donde no exista / } :where(p,li,dd){ text-wrap: pretty; } :where(ul,ol){ margin: 0; padding: 0; } / Se quita la viñeta solo cuando el autor declara role="list": así Safari con VoiceOver sigue anunciando "lista" y no perdemos la semántica. / :where(ul[role="list"],ol[role="list"]){ list-style: none; } :where(fieldset){ padding: 0; border: 0; } :where(legend){ padding: 0; } :where(hr){ border: 0; border-top: var(--bw-hair) solid var(--line); margin: 0; } :where(address){ font-style: normal; } / ───────────────────────── ENLACES ───────────────────────── Subrayado conservado por defecto y separado de la línea base: en prosa un enlace sin subrayar solo se distingue por color, y el rojo Arasaka sobre carbón está a 4.3:1 — insuficiente como única señal. El chrome y los componentes que sí llevan otra afordancia (nav, botones) lo quitan. / :where(a[href]){ color: var(--accent); text-decoration-thickness: var(--bw-hair); text-underline-offset: .22em; cursor: pointer; } :where(a[href]:hover){ color: var(--accent-brt); } / ───────────────────────── MEDIOS ───────────────────────── Imágenes fluidas. display:block elimina el hueco fantasma de la línea base que descuadra los marcos del .mugshot y de las tarjetas de screamsheet. El