/* ===================================================================== DaivVerse design tokens — SINGLE SOURCE OF TRUTH --------------------------------------------------------------------- Loaded AFTER site.css so these definitions are authoritative for the core palette in BOTH themes. Values match the current DNS-Lookup / ToolLayout palette exactly (no visual change). Theme variants (.theme-neon, .theme-aurora, .theme-pure-white, ...) in site.css keep their higher-specificity per-theme palettes. RULE: tool pages and the shared ToolLayout must use these tokens — never hardcode colors, radii, shadows, spacing, or font sizes. ===================================================================== */ :root { /* Surfaces */ --bg: #f4f7fb; /* page background */ --bg2: #ffffff; /* card / surface / results */ --bg3: #eef4ff; /* input fill / info-icon fill*/ --bg4: #eefcf6; /* hover / accent-tinted */ /* Text */ --tx: #0f172a; /* primary text */ --tx2: #556174; /* muted subtitle / sub-label */ /* Lines & accents */ --bd: #d7dfec; /* borders */ --ac: #2f5cff; /* accent / action button / icon */ --ach: #1f49cf; /* accent hover */ --ac2: #0f9d8a; /* secondary accent */ --acl: rgba(47,92,255,.10); /* icon-badge fill */ --acl2: rgba(15,157,138,.10); /* secondary tint */ /* State */ --gr: #14804a; /* success */ --rd: #d23c3c; /* error */ /* Radii */ --r: 14px; /* default card radius */ --radius-sm: 12px; /* input / icon badge / feature badge */ --radius-pill: 999px; /* info-icon button */ /* Shadows */ --sh: 0 10px 30px rgba(15,23,42,.08); --sh2: 0 16px 48px rgba(15,23,42,.12); /* Type */ --f: "DM Sans","Plus Jakarta Sans","Segoe UI",system-ui,sans-serif; --fd: "Plus Jakarta Sans","DM Sans","Segoe UI",system-ui,sans-serif; --m: ui-monospace,SFMono-Regular,Consolas,"Liberation Mono",monospace; --fs-xs: .78rem; /* feature-badge sub-label */ --fs-sm: .88rem; --fs-base: .95rem; /* inputs / body controls */ --fs-md: 1rem; /* feature-badge label */ --fs-lg: 1.12rem; --fs-title: clamp(1.15rem, 1.8vw, 1.5rem); /* tool header title */ /* Spacing scale */ --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px; --space-5: 24px; --space-6: 32px; /* Layout */ --mw: 1360px; } /* Dark theme — matches the app's toggle (`.dark` / `.app.dark` class on the /.app element, set by daivVerseTheme + the _Host bootstrap). */ .dark, .app.dark { --bg: #08111d; --bg2: #101a2d; --bg3: #15233a; --bg4: #112d28; --tx: #eef4ff; --tx2: #9eb1cf; --bd: #243550; --ac: #85a4ff; --ach: #a4bafc; --ac2: #4fd1c5; --acl: rgba(133,164,255,.14); --acl2: rgba(79,209,197,.12); --gr: #56d47f; --rd: #ff7a8a; --sh: 0 10px 30px rgba(0,0,0,.25); --sh2: 0 18px 56px rgba(0,0,0,.35); }