/* public/domains/css/tokens.css — ONE purple system. Load FIRST, before all other domain CSS. Scoped to .dvd-scope: on the public page that class sits on ; embedded in the admin shell it wraps only the page content, so nothing leaks into the admin chrome. */ .dvd-scope{ /* Brand — Devaito admin charter ramp. Harmonizes with the baked header's #4f46e5 (same blue-violet family, header untouched). */ --brand-50:#f2efff; --brand-100:#e4deff; --brand-200:#c9bdff; --brand-300:#a795ff; --brand-400:#8266ff; --brand-500:#6948ff; /* gradients + large text (24px+ / 19px bold) ONLY — 5.29:1 on white */ --brand-600:#472af2; /* primary actions / links / focus — 7.29:1 on white; AA for small text AND white-on-brand buttons */ --brand-700:#3b28cc; /* hover — 8.89:1 */ --grad-brand:linear-gradient(135deg,#472af2 0%,#6948ff 100%); /* Ink — the baked header's own gray ramp, so page + header read as one product */ --ink-900:#111827; --ink-800:#1f2937; --ink-700:#374151; --muted:#4b5563; /* small muted text — 7.56:1 */ --muted-lg:#6b7280; /* 16px+ text only — 4.83:1 */ --line:#e5e7eb; --line-soft:#f0f0f2; --surface:#fff; --surface-alt:#f8fafc; --surface-tint:#f7f5ff; /* Semantic — measured AA pairs */ --ok:#15803d; --ok-bg:#f0fdf4; --bad:#b91c1c; --bad-bg:#fef2f2; --warn:#856404; --warn-bg:#fff3cd; /* Type — Inter self-hosted (variable, 100-900); body inherits into the baked header for free */ --font:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif; --text-xs:.8125rem; --text-sm:.875rem; --text-md:1rem; --text-lg:1.125rem; --display-1:clamp(2.5rem,1.4rem + 4.2vw,4.25rem); --display-2:clamp(1.75rem,1.2rem + 1.8vw,2.5rem); --track-display:-.035em; --track-heading:-.02em; /* Rhythm (4px base) · Shape (mirrors header: 8 buttons / 12 inputs / 16 cards / 24 panels) */ --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-5:24px; --sp-6:32px; --sp-7:40px; --sp-8:64px; --sp-9:96px; --r-sm:8px; --r-md:12px; --r-lg:16px; --r-xl:24px; --r-pill:999px; /* Elevation — brand-tinted, never gray mud */ --shadow-1:0 1px 2px rgba(17,24,39,.05),0 1px 3px rgba(17,24,39,.06); --shadow-2:0 4px 12px rgba(17,24,39,.06),0 2px 4px rgba(17,24,39,.04); --shadow-brand:0 12px 40px -8px rgba(71,42,242,.28); --ring:0 0 0 3px rgba(71,42,242,.30); /* Motion */ --ease-out:cubic-bezier(.16,1,.3,1); --dur-fast:150ms; --dur-base:250ms; } .dvd-scope{font-family:var(--font);color:var(--ink-800)} body.dvd-public{background:var(--surface);padding-top:100px;margin:0} /* public page only — never the admin shell */ .dvd-scope a{color:var(--brand-600)} .dvd-scope :focus-visible{outline:2px solid var(--brand-600);outline-offset:2px} html:has(body.dvd-public){scroll-padding-top:120px} /* fixed-header clearance for ALL anchor jumps (#results, #main) */ #results:focus,#main:focus{outline:none} /* programmatic-focus targets only — never blanket-remove outlines elsewhere */ .skip-link{position:absolute;left:-9999px;top:0;z-index:2000;background:var(--brand-600);color:#fff;padding:12px 20px;border-radius:0 0 8px 0;font-weight:600} .skip-link:focus{left:0} .visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0} @media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}