/* Minimal global reset + brand defaults. Components style themselves inline
   from the custom properties above; nothing here is component-specific. */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--surface-page);color:var(--text-body);font:var(--type-body);text-wrap:pretty;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4,h5,h6,p,figure,blockquote{margin:0}
img,svg,video{display:block;max-width:100%}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
a{color:var(--text-brand);text-decoration:none;transition:color var(--duration-fast) var(--ease-out)}
a:hover{color:var(--text-brand-deep);text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:3px}
a:active{color:var(--priti-pink-800)}
:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}
::selection{background:var(--priti-lime-400);color:var(--priti-ink-900)}
[hidden]{display:none!important}
@media (prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;transition-duration:.01ms!important}}