/* BrizCars design tokens — the single source of truth for color, type, and spacing. Values copied verbatim from the design spec. Loaded by every page; fonts are ed in each page for performance. */ :root { /* brand + ink */ --accent: #ff6a2b; --accent-tint: #fff1ea; --ink: #1c1c1e; /* text */ --text: #52504c; --text-strong: #42403c; --muted: #8a857d; --softer: #a8a39b; --soft-2: #6f6a62; /* surfaces */ --bg: #fbfaf8; /* public page background */ --bg-admin: #f4f3f0; /* admin page background */ --card: #ffffff; --border: #ece9e3; /* public */ --border-admin: #e7e3dc; --border-admin-2: #f1eee8; /* admin sidebar */ --side: #1c1c1e; --side-active: #34332f; --side-text: #b3aea4; /* status / feedback */ --success: #1a9c5b; --success-bg: #eafaf0; --pending: #d4761a; --pending-bg: #fff7e6; --sold: #8a857d; --sold-bg: #f1eee8; --buy: #2563eb; --buy-bg: #eef4ff; --error: #c0392b; --error-border: #e2b4ab; --error-bg: #fdf4f2; --dot: #3ddc84; /* type */ --font-display: "Bricolage Grotesque", system-ui, sans-serif; --font-body: "Schibsted Grotesk", system-ui, sans-serif; /* icon glyphs (as mask images, tinted via currentColor) */ --phone-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.62 10.79c1.44 2.83 3.76 5.14 6.59 6.59l2.2-2.2c.27-.27.67-.36 1.02-.24 1.12.37 2.33.57 3.57.57.55 0 1 .45 1 1V20c0 .55-.45 1-1 1-9.39 0-17-7.61-17-17 0-.55.45-1 1-1h3.5c.55 0 1 .45 1 1 0 1.25.2 2.45.57 3.57.11.35.03.74-.25 1.02l-2.2 2.2z'/%3E%3C/svg%3E"); /* radius */ --r-card: 18px; --r-card-lg: 24px; --r-input: 12px; --r-pill: 30px; --r-chip: 10px; /* shadow */ --shadow-card: 0 12px 30px rgba(28, 28, 30, 0.06); --shadow-hover: 0 18px 44px rgba(28, 28, 30, 0.1); --shadow-drawer: -20px 0 50px rgba(0, 0, 0, 0.15); } * { box-sizing: border-box; margin: 0; padding: 0; } body { font-family: var(--font-body); color: var(--ink); background: var(--bg); -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; } a { color: inherit; text-decoration: none; } ::selection { background: var(--accent); color: #fff; } a:focus-visible, button:focus-visible, select:focus-visible, input:focus-visible, textarea:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 4px; } /* respect reduced-motion for all the lift/transition micro-interactions */ @media (prefers-reduced-motion: reduce) { * { transition: none !important; animation: none !important; } }