@import"https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap";*,*:before,*:after{box-sizing:border-box;margin:0;padding:0;border:0 solid}html,:host{text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}small{font-size:80%}sub,sup{position:relative;font-size:75%;line-height:0;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{border-collapse:collapse;border-color:inherit;text-indent:0}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle}img,video{height:auto;max-width:100%}button,input,select,optgroup,textarea{font:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:transparent;border-radius:0}button,input:where([type=button],[type=reset],[type=submit]){appearance:auto}textarea{resize:vertical}::-webkit-search-decoration{appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit,::-webkit-datetime-edit-year-field,::-webkit-datetime-edit-month-field,::-webkit-datetime-edit-day-field,::-webkit-datetime-edit-hour-field,::-webkit-datetime-edit-minute-field,::-webkit-datetime-edit-second-field,::-webkit-datetime-edit-millisecond-field,::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}[hidden]:where(:not([hidden=until-found])){display:none!important}input:where([type=text]),input:where(:not([type])),input:where([type=email]),input:where([type=url]),input:where([type=password]),input:where([type=number]),input:where([type=date]),input:where([type=datetime-local]),input:where([type=month]),input:where([type=search]),input:where([type=tel]),input:where([type=time]),input:where([type=week]),select:where([multiple]),textarea,select{appearance:none}input::placeholder,textarea::placeholder{opacity:1;color:rgb(from currentcolor r g b / 50%)}input:where([type=checkbox]),input:where([type=radio]){appearance:none;vertical-align:middle;-webkit-user-select:none;user-select:none;flex-shrink:0;width:1rem;height:1rem;padding:0;display:inline-block}input:where([type=checkbox]){border-radius:0}input:where([type=radio]){border-radius:100%}:root{--color-brand-black: #222;--color-brand-absolute-black: #000;--color-brand-graphite: #444545;--color-brand-marengo: #4c5866;--color-brand-pale-white: #f5f5f5;--color-brand-white: #fdfdfd;--color-brand-absolute-white: #fff;--color-brand-honeydew: #eff7f0;--color-brand-aero-blue: #dafde6;--color-brand-azure-mist: #dafbfd;--color-brand-azure-periwinkle: #dae6fd;--color-brand-pale-marengo: #ededf1;--color-brand-azure-lavender: #ebdafd;--color-brand-bright-gray: #e5e5ee;--color-brand-pastel-pink: #ffd4d4;--color-brand-granny-smith: #95e29f;--color-brand-crayola: #59ac66;--color-brand-iguana-green: #6bc179;--color-brand-bright-tangelo: #ee6d27;--color-brand-cinnabar: #e25131;--color-brand-golden: #ffd600;--color-brand-coral: #ed7f6e;--color-brand-picton-blue: #2193eb;--color-brand-supernova: #fcc504;--color-brand-silver-gray: #b6b7bf;--color-brand-pale-gray: #d9d9d9;--color-brand-concrete: #888;--color-brand-midnight-blue: #0b3465;--color-background: var(--color-brand-white);--color-foreground: var(--color-brand-black);--color-foreground-60: rgb(from var(--color-foreground) r g b / 60%);--color-foreground-40: rgb(from var(--color-foreground) r g b / 40%);--color-primary: var(--color-brand-graphite);--color-primary-foreground: var(--color-brand-white);--color-secondary: var(--color-brand-white);--color-secondary-foreground: var(--color-brand-marengo);--color-muted: var(--color-brand-pale-marengo);--color-muted-foreground: var(--color-brand-marengo);--color-accent: var(--color-brand-pale-white);--color-accent-foreground: var(--color-brand-black);--color-info: var(--color-brand-picton-blue);--color-info-foreground: var(--color-brand-graphite);--color-warning: var(--color-brand-supernova);--color-warning-foreground: var(--color-brand-graphite);--color-destructive: var(--color-brand-coral);--color-destructive-foreground: var(--color-brand-white);--color-error: var(--color-brand-cinnabar);--color-error-foreground: var(--color-brand-white);--color-success: var(--color-brand-granny-smith);--color-success-foreground: var(--color-brand-white);--color-card: var(--color-brand-white);--color-card-foreground: var(--color-brand-marengo);--color-border: var(--color-brand-bright-gray);--color-input: var(--color-brand-pale-marengo);--color-input-foreground: var(--color-brand-marengo);--color-ring: var(--color-brand-picton-blue);--space-4: 4px;--space-5: 5px;--space-8: 8px;--space-10: 10px;--space-15: 15px;--space-20: 20px;--icon-size-xs: 10px;--icon-size-s: 15px;--icon-size-m: 20px;--icon-size-l: 25px;--duration-fast: .2s;--ease-standard: cubic-bezier(.4, 0, .2, 1);--radius-field: 5px;--radius-panel: 10px;--radius-pill: 9999px;--font-size-2xs: 9px;--font-size-xs: 10px;--font-size-s: 11px;--font-size-m: 14px;--line-height-tight: 1;--line-height-body: 1.15;--line-height-control: 20px;--control-height-s: 30px;--control-height-m: 40px;--control-size-s: 20px;--panel-min-width: 250px;--background-field: var(--color-input);--background-overlay: linear-gradient(to right, var(--color-brand-white), var(--color-brand-white)), linear-gradient(to bottom, var(--color-brand-absolute-white), var(--color-brand-pale-marengo));--shadow-field: 0 0 3px 1px var(--color-brand-absolute-white), 0 0 2px 1px rgb(from var(--color-input-foreground) r g b / 25%) inset, 0 0 1px 0 rgb(from var(--color-input-foreground) r g b / 25%) inset;--shadow-field-hover: 0 2px 2px 0 var(--color-brand-absolute-white), 0 0 1px 0 rgb(from var(--color-input-foreground) r g b / 50%) inset, 0 1px 5px 0 rgb(from var(--color-input-foreground) r g b / 30%) inset;--shadow-field-active: 0 2px 0 0 var(--color-brand-absolute-white), 0 0 0 0 transparent inset, 0 2px 5px 0 rgb(from var(--color-input-foreground) r g b / 50%) inset;--font-main: "Inter"}:root{--animate-dot-bounce: dot-bounce 1.4s infinite ease-in-out both;--animation-delay-0: 0s;--animation-delay-75: 75ms;--animation-delay-100: .1s;--animation-delay-150: .15s;--animation-delay-200: .2s;--animation-delay-300: .3s;--animation-delay-500: .5s;--animation-delay-700: .7s;--animation-delay-1000: 1s}@keyframes dot-bounce{15%{translate:0 -2px}33%{translate:0}}.animate-dot-bounce{animation:var(--animate-dot-bounce)}.delay-0{animation-delay:var(--animation-delay-0)}.delay-75{animation-delay:var(--animation-delay-75)}.delay-100{animation-delay:var(--animation-delay-100)}.delay-150{animation-delay:var(--animation-delay-150)}.delay-200{animation-delay:var(--animation-delay-200)}.delay-300{animation-delay:var(--animation-delay-300)}.delay-500{animation-delay:var(--animation-delay-500)}.delay-700{animation-delay:var(--animation-delay-700)}.delay-1000{animation-delay:var(--animation-delay-1000)}.showcase-main{min-height:100vh;padding-top:4rem;background:var(--color-background)}.showcase-nav{position:fixed;top:0;left:0;right:0;z-index:50;display:flex;flex-wrap:wrap;align-items:center;gap:.4rem;padding:.5rem;border-bottom:1px solid rgb(from var(--color-border) r g b / 75%);background:rgb(from var(--color-background) r g b / 95%);box-shadow:0 8px 22px -18px rgb(from var(--color-brand-absolute-black) r g b / 45%);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.showcase-nav__link{display:inline-flex;align-items:center;min-height:2rem;padding:.3rem .65rem;border-radius:.55rem;font-family:var(--font-main);font-size:.82rem;font-weight:600;color:var(--color-foreground);transition:background-color .16s ease,color .16s ease}.showcase-nav__link:hover{background:var(--color-muted)}.showcase-home{min-height:calc(100vh - 4rem);background:linear-gradient(160deg,var(--color-brand-pale-white) 0%,var(--color-brand-azure-mist) 55%,var(--color-brand-pale-marengo) 100%)}.showcase-container{width:100%;max-width:80rem;margin:0 auto;padding:2rem 1rem;display:flex;flex-direction:column;gap:1.5rem}.showcase-card{border:1px solid rgb(from var(--color-border) r g b / 80%);border-radius:1rem;background:rgb(from var(--color-card) r g b / 90%);box-shadow:0 14px 40px -22px rgb(from var(--color-brand-midnight-blue) r g b / 35%)}.showcase-card--hero{padding:1.5rem;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.showcase-kicker{font-family:var(--font-main);font-size:.72rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:rgb(from var(--color-foreground) r g b / 55%)}.showcase-title{margin-top:.75rem;font-family:var(--font-main);font-size:clamp(1.8rem,2.5vw,2.35rem);font-weight:650;color:var(--color-foreground)}.showcase-description{margin-top:.75rem;max-width:64ch;font-family:var(--font-main);font-size:.95rem;line-height:1.45;color:rgb(from var(--color-foreground) r g b / 70%)}.showcase-actions{margin-top:1.2rem;display:flex;flex-wrap:wrap;gap:.5rem}.showcase-button{display:inline-flex;align-items:center;justify-content:center;min-height:2.5rem;padding:.55rem 1rem;border-radius:.6rem;border:1px solid transparent;font-family:var(--font-main);font-size:.76rem;font-weight:700;letter-spacing:.03em;text-transform:uppercase;transition:transform .16s ease,box-shadow .16s ease,background-color .16s ease,color .16s ease}.showcase-button:hover{transform:translateY(-1px)}.showcase-button--primary{background:var(--color-primary);color:var(--color-primary-foreground);box-shadow:inset 0 2px rgb(from var(--color-brand-silver-gray) r g b / 60%),inset 0 -1px rgb(from var(--color-brand-absolute-black) r g b / 30%),inset 0 9px 15px rgb(from var(--color-brand-absolute-black) r g b / 25%),0 0 5px rgb(from var(--color-brand-absolute-black) r g b / 15%),0 0 2px rgb(from var(--color-brand-absolute-black) r g b / 100%)}.showcase-button--secondary{border-color:var(--color-border);background:var(--color-background);color:var(--color-secondary-foreground)}.showcase-group{padding:1rem}.showcase-group__header{display:flex;align-items:center;justify-content:space-between;gap:.75rem;margin-bottom:1rem}.showcase-group__title{font-family:var(--font-main);font-size:1.25rem;font-weight:650;color:var(--color-foreground)}.showcase-group__meta{font-family:var(--font-main);font-size:.72rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:rgb(from var(--color-foreground) r g b / 52%)}.showcase-grid{display:grid;gap:1rem}.showcase-item{padding:.75rem;border:1px solid rgb(from var(--color-border) r g b / 78%);border-radius:.85rem;background:rgb(from var(--color-background) r g b / 82%)}.showcase-item__head{display:flex;align-items:flex-start;justify-content:space-between;gap:.75rem;margin-bottom:.55rem}.showcase-item__title{font-family:var(--font-main);font-size:1.07rem;font-weight:640;color:var(--color-foreground)}.showcase-item__description{margin-top:.35rem;font-family:var(--font-main);font-size:.75rem;line-height:1.35;color:rgb(from var(--color-foreground) r g b / 62%)}.showcase-item__link{display:inline-flex;align-items:center;min-height:1.8rem;padding:.25rem .65rem;border:1px solid var(--color-border);border-radius:.45rem;background:var(--color-card);font-family:var(--font-main);font-size:.65rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:rgb(from var(--color-foreground) r g b / 72%)}.showcase-item__demo{padding:.75rem;border:1px solid rgb(from var(--color-border) r g b / 65%);border-radius:.7rem;background:rgb(from var(--color-accent) r g b / 35%)}.showcase-catalog,.showcase-component{min-height:calc(100vh - 4rem);background:var(--color-background)}.showcase-container--narrow{max-width:64rem}.showcase-page-header{padding:1.5rem}.showcase-page-title{font-family:var(--font-main);font-size:clamp(1.75rem,2.6vw,2.1rem);font-weight:650;color:var(--color-foreground)}.showcase-page-description{margin-top:.5rem;font-family:var(--font-main);font-size:.9rem;line-height:1.4;color:rgb(from var(--color-foreground) r g b / 65%)}.showcase-category-list{display:grid;gap:1rem}.showcase-component-list{margin-top:.8rem;display:grid;gap:.5rem}.showcase-component-link{display:block;padding:.65rem .8rem;border:1px solid var(--color-border);border-radius:.65rem;background:var(--color-background);transition:background-color .16s ease}.showcase-component-link:hover{background:rgb(from var(--color-accent) r g b / 45%)}.showcase-component-link__title{font-family:var(--font-main);font-size:.86rem;font-weight:630;color:var(--color-foreground)}.showcase-component-link__description{margin-top:.2rem;font-family:var(--font-main);font-size:.73rem;color:rgb(from var(--color-foreground) r g b / 62%)}.showcase-breadcrumbs{display:flex;flex-wrap:wrap;align-items:center;gap:.45rem;font-size:.7rem;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:rgb(from var(--color-foreground) r g b / 55%)}.showcase-breadcrumbs a:hover{color:rgb(from var(--color-foreground) r g b / 75%)}.showcase-live{padding:1.25rem}.showcase-live__title{font-family:var(--font-main);font-size:1.03rem;font-weight:640;color:var(--color-foreground)}.showcase-live__frame{margin-top:.9rem;padding:1rem;border:1px solid var(--color-border);border-radius:.75rem;background:rgb(from var(--color-accent) r g b / 30%)}.showcase-nav-cards{display:grid;gap:.65rem}.showcase-nav-card{padding:.75rem .9rem;border:1px solid var(--color-border);border-radius:.65rem;background:var(--color-card)}.showcase-nav-card__label{font-family:var(--font-main);font-size:.68rem;font-weight:650;letter-spacing:.05em;text-transform:uppercase;color:rgb(from var(--color-foreground) r g b / 50%)}.showcase-nav-card__title{margin-top:.2rem;font-family:var(--font-main);font-size:.85rem;font-weight:640;color:var(--color-foreground)}@media(min-width:768px){.showcase-container{padding-inline:1.5rem}.showcase-card--hero{padding:2rem}.showcase-grid,.showcase-component-list,.showcase-nav-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}