@import url('../tokens/tokens.css');
@font-face{font-family:'Bricolage Grotesque';src:url('../assets/fonts/bricolage-grotesque-latin-wght-normal.woff2') format('woff2');font-weight:200 800;font-style:normal;font-display:swap}
@font-face{font-family:'Plus Jakarta Sans';src:url('../assets/fonts/plus-jakarta-sans-latin-wght-normal.woff2') format('woff2');font-weight:200 800;font-style:normal;font-display:swap}
*{box-sizing:border-box}body{margin:0;background:var(--su-paper);color:var(--su-ink);font:1rem/1.7 var(--su-font-body)}h1,h2,h3{font-family:var(--su-font-display);font-weight:690;line-height:1.08;letter-spacing:-.04em;overflow-wrap:anywhere}h1{font-size:clamp(2.75rem,7vw,5.5rem)}h2{font-size:clamp(2rem,4vw,3.25rem)}h3{font-size:1.5rem}p{max-width:65ch}a{color:var(--su-purple-dark);text-underline-offset:.2em}img{max-width:100%;height:auto}button,input,select{font:inherit}button,a,input,select,summary{touch-action:manipulation}:focus-visible{outline:3px solid var(--su-focus);outline-offset:4px}.su-container{width:min(calc(100% - 2*var(--su-gutter)),var(--su-container));margin-inline:auto}.su-section{padding-block:clamp(2.5rem,6vw,5rem)}.su-dark{background:var(--su-ink);color:white}.su-dark a{color:white}.su-dark :focus-visible{outline-color:white}.su-muted{color:var(--su-muted)}.su-kicker{text-transform:uppercase;letter-spacing:.1em;font-size:.875rem;font-weight:800}.su-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:var(--su-space-3)}.su-card{padding:var(--su-space-4);border:1px solid var(--su-line);border-radius:var(--su-radius-lg);background:var(--su-paper);color:var(--su-ink)}.su-button{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:.8rem 1.4rem;border:1px solid transparent;border-radius:var(--su-radius-pill);background:var(--su-purple-dark);color:white;text-decoration:none;font-weight:750;line-height:1.3;cursor:pointer}.su-button:hover{background:var(--su-purple-hover)}.su-button--secondary{background:white;border-color:var(--su-line-strong);color:var(--su-ink)}.su-button--secondary:hover{background:var(--su-soft)}.su-actions{display:flex;gap:1rem;flex-wrap:wrap}.su-field{display:grid;gap:.5rem;margin-bottom:1rem}.su-field input,.su-field select{min-height:48px;max-width:100%;padding:.6rem .875rem;border:1px solid var(--su-line-strong);border-radius:var(--su-radius-sm);background:white;color:var(--su-ink)}.su-badge{display:inline-block;border-radius:var(--su-radius-pill);padding:.3rem .75rem;background:var(--su-purple-soft);color:var(--su-purple-dark);font-weight:750;font-size:.875rem}.su-brand{display:flex;align-items:center;gap:.7rem}.su-brand img{width:32px;height:44px;object-fit:contain}.su-brand strong{display:block;font-family:var(--su-font-display);font-weight:720;font-size:1.1rem;letter-spacing:-.03em;line-height:1.1}.su-brand small{text-transform:uppercase;letter-spacing:.18em;font-size:.875rem}.su-skip{position:fixed;top:.5rem;left:.5rem;padding:1rem;background:var(--su-ink);color:white;transform:translateY(-200%);z-index:100}.su-skip:focus{transform:none}.su-swatch{height:110px;border-radius:var(--su-radius-sm);border:1px solid var(--su-line);margin-bottom:1rem}.su-demo-dark{background:var(--su-ink);padding:2rem;border-radius:var(--su-radius-md);color:white}.su-sample{font-family:var(--su-font-display);font-size:clamp(2rem,4vw,3rem);font-weight:690;line-height:1.1}.su-preview-head{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;padding-block:1.5rem;border-bottom:1px solid var(--su-line)}code{overflow-wrap:anywhere}table{border-collapse:collapse;width:100%}th,td{text-align:left;padding:.75rem;border-bottom:1px solid var(--su-line)}.su-table{overflow-x:auto}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@media(forced-colors:active){.su-button,.su-badge,.su-card{border:1px solid CanvasText}}