/* ============================================================ NODI — SPACING, RADII & EFFECTS Spacing is a 4px grid: every step is a multiple of 4, so any two values stack and align without a remainder. Radii follow a clean 5-step scale — see the block below. ============================================================ */ :root { /* Spacing scale — 4px grid. Derive any new step from the grid; never transcribe a loose value. The numbering has two holes on purpose: --space-4 and --space-7 duplicated the step below them and were retired once their consumers moved (2026-08-11). The surviving numbers keep their meaning; do not renumber around the gaps. */ --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-5: 16px; --space-6: 20px; --space-8: 24px; --space-9: 32px; --space-10: 40px; --space-11: 64px; --space-12: 80px; /* Radii — clean 5-step scale; every component snaps to its nearest step */ --radius-xs: 8px; /* small pills, sign-in buttons, toggle track & pills */ --radius-sm: 12px; /* buttons, form inputs, feature-card panels */ --radius-md: 16px; /* cards, avatars container, comparison table */ --radius-lg: 24px; /* search capsule — the largest bounded radius */ --radius-full: 9999px; /* badges, avatar circles, capsule pills */ /* Hairline grid — the signature 0.5px structural lines */ --hairline: 0.5px solid var(--border-subtle); /* @kind other */ --hairline-on-dark: 1px solid rgba(255,255,255,0.08); /* @kind other */ /* The shadows, the menu lift, the PromptRow hover fill and the badge colour pairs live in colors.css alongside --focus-ring, for the same reason all four do: they resolve to a different value per theme, and this file has no theme blocks. DO NOT RE-DECLARE THEM HERE. A :root rule carries the same specificity as [data-theme="dark"], and this file loads after colors.css, so a copy here wins the tie on and pins every one of those tokens to its light value. */ /* Motion */ --ease-standard: cubic-bezier(0.4, 0, 0.2, 1); /* @kind other */ --ease-out: cubic-bezier(0.16, 1, 0.3, 1); /* @kind other */ --dur-fast: 120ms; /* @kind other */ --dur-base: 200ms; /* @kind other */ --dur-slow: 320ms; /* @kind other */ }