spb/search-box Public

1/*2 * Search-box.ai3 * Author: Simon-Pierre Boucher4 * Contact: contact@spboucher.ai5 * File: apps/web/styles/tokens.css6 * Description: Design token system — every component derives from these variables.7 */89:root {10  /* color — light, warm, technical-editorial */11  --paper: #faf9f5;12  --paper-deep: #f3f1ea;13  --surface: #ffffff;14  --ink: #1a1712;15  --ink-soft: #6b6459;16  --ink-faint: #a39b8d;17  --hairline: #e8e3d8;18  --hairline-strong: #d8d1c2;1920  --accent: #c8431a;        /* burnt vermilion — the one bold element */21  --accent-deep: #a53512;22  --accent-soft: #faeae3;23  --teal: #157068;          /* supports / verified */24  --teal-soft: #e2efed;25  --amber: #96660a;         /* uncertain */26  --amber-soft: #f7ecd3;27  --plum: #5f4b9e;          /* synthesis / writing */28  --plum-soft: #edeaf7;29  --red: #a02020;30  --red-soft: #fbecea;3132  /* type */33  --font-display: var(--font-fraunces), "Georgia", serif;34  --font-body: var(--font-instrument), -apple-system, "Helvetica Neue", sans-serif;35  --font-mono: var(--font-mono-face), "SF Mono", "Menlo", monospace;36  --fs-2xs: 0.6875rem;37  --fs-xs: 0.75rem;38  --fs-sm: 0.875rem;39  --fs-md: 1rem;40  --fs-lg: 1.25rem;41  --fs-xl: 1.75rem;42  --fs-hero: clamp(2.1rem, 6vw, 3.6rem);4344  /* spacing & radii */45  --sp-1: 0.25rem;46  --sp-2: 0.5rem;47  --sp-3: 0.75rem;48  --sp-4: 1rem;49  --sp-5: 1.25rem;50  --sp-6: 1.5rem;51  --sp-8: 2rem;52  --sp-12: 3rem;53  --sp-16: 4rem;54  --r-sm: 7px;55  --r-md: 11px;56  --r-lg: 16px;57  --r-xl: 22px;5859  /* elevation */60  --e-1: 0 1px 2px rgba(26, 23, 18, 0.05);61  --e-2: 0 1px 2px rgba(26, 23, 18, 0.05), 0 6px 20px rgba(26, 23, 18, 0.06);62  --e-3: 0 2px 4px rgba(26, 23, 18, 0.06), 0 16px 40px rgba(26, 23, 18, 0.1);6364  /* motion */65  --ease-out: cubic-bezier(0.22, 0.9, 0.3, 1);66  --t-fast: 140ms;67  --t-med: 300ms;68}69