/* Theme tokens. Values are RGB triplets so Tailwind opacity modifiers (e.g. border-accent/30) keep working. Light theme is the default set; .dark on switches every token at once. */ :root { --c-bg: 247 246 242; --c-surface: 239 239 235; --c-alt: 243 242 238; --c-altline: 218 217 214; --c-fg: 13 13 13; --c-muted: 107 107 96; --c-accent: 107 191 0; --c-onaccent: 255 255 255; --c-line: 222 221 217; --c-strong: 215 215 211; --c-cell: 232 231 227; --grid-line: #EDECE9; --glow: rgba(107, 191, 0, 0.09); --ghost-border: #DEDDD9; } .dark { --c-bg: 6 6 6; --c-surface: 17 17 17; --c-alt: 11 11 11; --c-altline: 30 30 30; --c-fg: 240 237 232; --c-muted: 136 136 128; --c-accent: 200 255 0; --c-onaccent: 6 6 6; --c-line: 26 26 26; --c-strong: 36 36 36; --c-cell: 26 26 26; --grid-line: #0D0D0D; --glow: rgba(200, 255, 0, 0.10); --ghost-border: rgba(240, 237, 232, 0.15); } /* 48x48px blueprint grid, hero bands only. */ .bg-grid { background-image: linear-gradient(var(--grid-line) 1px, transparent 1px), linear-gradient(90deg, var(--grid-line) 1px, transparent 1px); background-size: 48px 48px; } /* Soft radial accent glow (hero headline, CTA panel corner). */ .glow-radial { background: radial-gradient(circle, var(--glow) 0%, transparent 70%); } /* Subtle chromatic-aberration fringe on display headings. */ .glitch { text-shadow: 2px 0 rgba(255, 0, 0, 0.25), -2px 0 rgba(0, 0, 255, 0.25); } .btn-ghost { border: 1px solid var(--ghost-border); } /* Logo ticker: content is duplicated once in the markup, so -50% loops seamlessly. */ .marquee { animation: marquee 30s linear infinite; } @keyframes marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } } /* Native select restyled to match the squared inputs; caret drawn manually. */ select.field-select { appearance: none; -webkit-appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23a8a8a0' stroke-width='2'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 8px center; background-size: 14px 14px; }