/* Page defaults. Every value here is a token from ds-tokens.css, which is
   generated from the same Supernova export the components read.

   Body type is one named style applied with the `font` shorthand, not four
   loose properties — the same rule the components follow. */
html{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
body{margin:0;background:var(--ds-color-bg-surface-100);color:var(--ds-color-fg-neutral-primary-100);font:var(--ds-typography-font-body-300-regular);text-wrap:pretty}
*,*::before,*::after{box-sizing:border-box}
a{color:var(--ds-color-fg-brand-blue-primary-200);text-decoration:underline;text-underline-offset:2px;text-decoration-thickness:1px}
a:hover{color:var(--ds-color-fg-brand-blue-primary-300)}
a:active{color:var(--ds-color-fg-brand-blue-primary-300);opacity:.8}
/* Built from the system's own focus-ring tokens rather than a hand-picked
   two-layer halo. components/focus-ring/default is the named role and inverts
   with the theme, so this needs no dark-theme variant. */
:focus-visible{outline:var(--ds-border-focus-ring) solid var(--ds-color-components-focus-ring-default);outline-offset:2px}
button,input,select,textarea{font:inherit;color:inherit}
@keyframes ds-spin{to{transform:rotate(360deg)}}
@keyframes ds-fade-in{from{opacity:0;transform:translateY(2px)}to{opacity:1;transform:none}}
@keyframes ds-shimmer{from{background-position:200% 0}to{background-position:-200% 0}}
