/* Resets that every page shares, marketing and app alike. Nothing here may reference a custom property. This file loads alongside whichever palette a page brings — the frozen one in marketing-tokens.css or the design system's — and those two declare nine of the same --sand-* names with different values. A var() here would bind to whichever palette happens to be present. */ :root { color-scheme: light dark; } html, body { overflow-x: hidden; } body { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } * { box-sizing: border-box; padding: 0; margin: 0; } .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; } /* Only app_shell.html's theme_init script stamps data-theme on ; the server-rendered marketing and auth pages carry no theme JS and stay on the color-scheme above. Setting color-scheme is all these rules need to do — both palettes pick their values from it. test_base_css_references_no_custom_property_or_theme_colour substring-matches this whole file, comments included, so neither the custom-property syntax nor the theme-colour function may be written out here even in prose. */ :root[data-theme="light"] { color-scheme: light; } :root[data-theme="dark"] { color-scheme: dark; }