.examples-page.svelte-1s1pej0{margin:0;min-height:100vh;padding:1rem;color:var(--ds-text);background-color:var(--ds-bg);background-image:radial-gradient(circle at 8% 10%,color-mix(in srgb,var(--ds-accent) 14%,transparent),transparent 36%),radial-gradient(circle at 92% 4%,color-mix(in srgb,var(--ds-primary) 18%,transparent),transparent 42%),var(--ds-page-bg-image, none);background-size:auto,auto,cover;background-position:0 0,0 0,center center;background-attachment:local,local,fixed;display:grid;gap:1rem}.examples-page__header.svelte-1s1pej0{border:var(--ds-border-width-regular, 1px) solid var(--ds-border);border-radius:var(--ds-radius-lg, 1rem);background:linear-gradient(160deg,color-mix(in srgb,var(--ds-surface) var(--ds-alpha-surface-elevated),transparent),color-mix(in srgb,var(--ds-surface-muted) var(--ds-alpha-surface-glass),transparent));box-shadow:var(--ds-shadow-soft, 0 10px 28px color-mix(in srgb, black 18%, transparent));backdrop-filter:blur(var(--ds-blur-soft, 8px));-webkit-backdrop-filter:blur(var(--ds-blur-soft, 8px));position:relative;overflow:hidden;padding:1.1rem 1.2rem;display:flex;justify-content:space-between;align-items:flex-start;gap:.8rem}.examples-page__header.svelte-1s1pej0:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;background:radial-gradient(circle at 16% 14%,color-mix(in srgb,var(--ds-gloss-tint, #ffffff) 66%,transparent),transparent var(--ds-shine-spread, 36%)),linear-gradient(var(--ds-shine-angle, 128deg),color-mix(in srgb,var(--ds-primary) 10%,transparent),color-mix(in srgb,var(--ds-accent) 14%,transparent));opacity:var(--ds-alpha-shine, .22)}.examples-page__header.svelte-1s1pej0:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;background:linear-gradient(var(--ds-shine-angle, 128deg),color-mix(in srgb,var(--ds-gloss-tint, #ffffff) 74%,transparent) 0%,transparent var(--ds-shine-spread, 36%),color-mix(in srgb,var(--ds-primary) 10%,transparent) 100%);opacity:var(--ds-alpha-gloss, .16)}.examples-page__header.svelte-1s1pej0>:where(.svelte-1s1pej0){position:relative;z-index:1}.examples-page__eyebrow.svelte-1s1pej0{margin:0;font-family:var(--ds-font-mono);font-size:var(--ds-size-xs);color:var(--ds-primary);letter-spacing:.16em;text-transform:uppercase}.examples-page.svelte-1s1pej0 h1:where(.svelte-1s1pej0){margin:.26rem 0 0;font-family:var(--ds-font-display);font-size:clamp(1.9rem,4vw,2.9rem);line-height:1.03}.examples-page__lede.svelte-1s1pej0{margin:.5rem 0 0;max-width:44rem;font-family:var(--ds-font-body);font-size:var(--ds-size-md);color:var(--ds-text-muted)}.examples-page__header-actions.svelte-1s1pej0{display:inline-flex;align-items:center;flex-wrap:wrap;gap:.45rem}.examples-page__bg-picker.svelte-1s1pej0{display:flex;align-items:center;gap:.35rem;border:1px solid color-mix(in srgb,var(--ds-border) 50%,transparent);border-radius:var(--ds-radius-pill, 999px);background:color-mix(in srgb,var(--ds-surface) 36%,transparent);backdrop-filter:var(--ds-backdrop-filter, none);-webkit-backdrop-filter:var(--ds-backdrop-filter, none);padding:.28rem .5rem}.examples-page__bg-picker-label.svelte-1s1pej0{font-family:var(--ds-font-body);font-size:var(--ds-size-xs);font-weight:600;color:var(--ds-text-muted);white-space:nowrap;padding-right:.2rem}.examples-page__bg-swatch.svelte-1s1pej0{width:28px;height:28px;border-radius:var(--ds-radius-sm, 6px);border:2px solid transparent;padding:0;cursor:pointer;overflow:hidden;transition:border-color var(--ds-motion-duration-fast, .14s) ease,transform var(--ds-motion-duration-fast, .14s) ease,box-shadow var(--ds-motion-duration-fast, .14s) ease;background:none}.examples-page__bg-swatch.svelte-1s1pej0 img:where(.svelte-1s1pej0){width:100%;height:100%;object-fit:cover;display:block}.examples-page__bg-swatch-gradient.svelte-1s1pej0{display:block;width:100%;height:100%;background:radial-gradient(circle at 20% 20%,color-mix(in srgb,var(--ds-accent) 55%,transparent),transparent 70%),radial-gradient(circle at 80% 0%,color-mix(in srgb,var(--ds-primary) 55%,transparent),transparent 65%),var(--ds-bg)}.examples-page__bg-swatch.active.svelte-1s1pej0{border-color:var(--ds-primary);box-shadow:0 0 0 2px color-mix(in srgb,var(--ds-primary) 40%,transparent);transform:scale(1.08)}.examples-page__bg-swatch.svelte-1s1pej0:hover:not(.active){border-color:color-mix(in srgb,var(--ds-primary) 50%,transparent);transform:scale(1.06)}.examples-page__bg-swatch.svelte-1s1pej0:focus-visible{outline:2px solid var(--ds-primary);outline-offset:2px}.examples-page__header-actions.svelte-1s1pej0 a:where(.svelte-1s1pej0){border:var(--ds-border-width-thin, 1px) solid color-mix(in srgb,var(--ds-primary) 54%,var(--ds-border));border-radius:var(--ds-radius-pill, 999px);background:color-mix(in srgb,var(--ds-primary) 16%,var(--ds-surface));color:var(--ds-primary);padding:.58rem .82rem;text-decoration:none;font-family:var(--ds-font-body);font-size:var(--ds-size-sm);font-weight:700;line-height:1;transition:background-color var(--ds-motion-duration-base, .22s) var(--ds-motion-ease-standard, ease),transform var(--ds-motion-duration-fast, .14s) var(--ds-motion-ease-standard, ease),box-shadow var(--ds-motion-duration-base, .22s) var(--ds-motion-ease-soft, ease)}.examples-page__header-actions.svelte-1s1pej0 a:where(.svelte-1s1pej0):hover{background:color-mix(in srgb,var(--ds-primary) 24%,var(--ds-surface));transform:translateY(calc(var(--ds-motion-slide-offset, 10px) * -.06)) scale(var(--ds-motion-scale-hover, 1.015));box-shadow:var(--ds-shadow-soft, 0 8px 24px color-mix(in srgb, black 16%, transparent))}.examples-controls.svelte-1s1pej0{border:var(--ds-border-width-regular, 1px) solid var(--ds-border);border-radius:var(--ds-radius-lg, 1rem);background:color-mix(in srgb,var(--ds-surface) var(--ds-alpha-surface-glass),transparent);backdrop-filter:var(--ds-backdrop-filter, none);-webkit-backdrop-filter:var(--ds-backdrop-filter, none);box-shadow:var(--ds-shadow-soft, 0 8px 24px color-mix(in srgb, black 14%, transparent));padding:.78rem .9rem;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.72rem;align-items:end}.examples-controls.svelte-1s1pej0 label:where(.svelte-1s1pej0){display:grid;gap:.34rem;font-family:var(--ds-font-mono);font-size:var(--ds-size-xs);color:var(--ds-text-muted);letter-spacing:.04em;text-transform:uppercase}.examples-controls.svelte-1s1pej0 select:where(.svelte-1s1pej0){border:var(--ds-border-width-thin, 1px) solid var(--ds-border);border-radius:var(--ds-radius-md, .72rem);background:color-mix(in srgb,var(--ds-surface) 84%,transparent);color:var(--ds-text);min-height:2.3rem;padding:.46rem .56rem;font-family:var(--ds-font-body);font-size:var(--ds-size-sm)}.examples-tone-toggle.svelte-1s1pej0{border:var(--ds-border-width-thin, 1px) solid var(--ds-border);border-radius:var(--ds-radius-pill, 999px);padding:.2rem;background:color-mix(in srgb,var(--ds-surface-muted) 76%,transparent);display:inline-flex;gap:.2rem;width:max-content}.examples-tone-toggle.svelte-1s1pej0 button:where(.svelte-1s1pej0){border:0;border-radius:var(--ds-radius-pill, 999px);background:transparent;color:var(--ds-text-muted);font-family:var(--ds-font-body);font-size:var(--ds-size-sm);font-weight:700;line-height:1;padding:.37rem .72rem;cursor:pointer}.examples-tone-toggle.svelte-1s1pej0 button.active:where(.svelte-1s1pej0){background:color-mix(in srgb,var(--ds-primary) 24%,var(--ds-surface));color:var(--ds-primary)}.examples-nav.svelte-1s1pej0{border:var(--ds-border-width-regular, 1px) solid var(--ds-border);border-radius:var(--ds-radius-lg, 1rem);background:color-mix(in srgb,var(--ds-surface) 90%,transparent);backdrop-filter:blur(var(--ds-blur-soft, 8px));-webkit-backdrop-filter:blur(var(--ds-blur-soft, 8px));box-shadow:var(--ds-shadow-soft, 0 8px 24px color-mix(in srgb, black 12%, transparent));padding:.5rem;display:flex;gap:.45rem;overflow-x:auto;position:sticky;top:.6rem;z-index:10}.examples-nav.svelte-1s1pej0 button:where(.svelte-1s1pej0){border:var(--ds-border-width-thin, 1px) solid color-mix(in srgb,var(--ds-border) 80%,transparent);border-radius:var(--ds-radius-pill, 999px);background:color-mix(in srgb,var(--ds-surface-muted) 70%,transparent);color:var(--ds-text-muted);font-family:var(--ds-font-body);font-size:var(--ds-size-sm);font-weight:600;line-height:1;white-space:nowrap;padding:.5rem .75rem;cursor:pointer;transition:background-color var(--ds-motion-duration-base, .22s) var(--ds-motion-ease-standard, ease),border-color var(--ds-motion-duration-fast, .14s) var(--ds-motion-ease-standard, ease),transform var(--ds-motion-duration-fast, .14s) var(--ds-motion-ease-standard, ease)}.examples-nav.svelte-1s1pej0 button.active:where(.svelte-1s1pej0){background:color-mix(in srgb,var(--ds-primary) 21%,var(--ds-surface));border-color:color-mix(in srgb,var(--ds-primary) 64%,var(--ds-border));color:var(--ds-primary)}.examples-stack.svelte-1s1pej0{display:grid;gap:1rem}.example-section.svelte-1s1pej0{scroll-margin-top:5.5rem;border:var(--ds-border-width-regular, 1px) solid var(--ds-border);border-radius:var(--ds-radius-lg, 1rem);background:linear-gradient(160deg,color-mix(in srgb,var(--ds-surface) var(--ds-alpha-surface-elevated),transparent),color-mix(in srgb,var(--ds-surface-muted) 58%,var(--ds-surface)));box-shadow:var(--ds-shadow-raised, 0 16px 40px color-mix(in srgb, black 14%, transparent));padding:1rem;display:grid;gap:.85rem}.example-section__header.svelte-1s1pej0{display:grid;gap:.2rem}.example-section__header.svelte-1s1pej0 h2:where(.svelte-1s1pej0){margin:0;font-family:var(--ds-font-heading);font-size:var(--ds-size-2xl);color:var(--ds-text)}.example-section__eyebrow.svelte-1s1pej0{margin:0;font-family:var(--ds-font-mono);font-size:var(--ds-size-xs);color:var(--ds-primary);letter-spacing:.14em;text-transform:uppercase}.example-layout.svelte-1s1pej0{display:grid;gap:.8rem}.example-layout--two.svelte-1s1pej0{grid-template-columns:repeat(2,minmax(0,1fr))}.example-layout--landing.svelte-1s1pej0{grid-template-columns:1.5fr 1fr}.example-layout--chat.svelte-1s1pej0{grid-template-columns:.85fr 1.4fr}.example-panel.svelte-1s1pej0{border:var(--ds-border-width-thin, 1px) solid color-mix(in srgb,var(--ds-border) 72%,transparent);border-radius:var(--ds-radius-md, .84rem);background:color-mix(in srgb,var(--ds-surface) 86%,transparent);padding:.84rem;overflow:hidden;min-width:0;display:grid;gap:.65rem}.example-panel.svelte-1s1pej0 h3:where(.svelte-1s1pej0){margin:0;font-family:var(--ds-font-heading);font-size:var(--ds-size-xl);color:var(--ds-text)}.example-panel.svelte-1s1pej0 p:where(.svelte-1s1pej0){margin:0;font-family:var(--ds-font-body);font-size:var(--ds-size-sm);color:var(--ds-text-muted);line-height:1.45}.example-inline-list.svelte-1s1pej0{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}.example-inline-list--between.svelte-1s1pej0{justify-content:space-between}.example-hero.svelte-1s1pej0 h3:where(.svelte-1s1pej0){font-size:clamp(1.35rem,2.4vw,2rem);line-height:1.1}.example-metric-grid.svelte-1s1pej0{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.45rem}.example-metric-grid.svelte-1s1pej0 div:where(.svelte-1s1pej0){border:var(--ds-border-width-thin, 1px) solid color-mix(in srgb,var(--ds-border) 70%,transparent);border-radius:var(--ds-radius-sm, .52rem);padding:.46rem;display:grid;gap:.2rem;background:color-mix(in srgb,var(--ds-surface-muted) 62%,transparent)}.example-metric-grid.svelte-1s1pej0 strong:where(.svelte-1s1pej0){font-family:var(--ds-font-heading);font-size:var(--ds-size-lg);color:var(--ds-text)}.example-metric-grid.svelte-1s1pej0 span:where(.svelte-1s1pej0){font-family:var(--ds-font-body);font-size:var(--ds-size-xs);color:var(--ds-text-muted)}.example-auth-card.svelte-1s1pej0{max-width:28rem;margin:0 auto;border:var(--ds-border-width-regular, 1px) solid color-mix(in srgb,var(--ds-border) 78%,transparent);border-radius:var(--ds-radius-lg, 1rem);background:color-mix(in srgb,var(--ds-surface) 92%,transparent);box-shadow:var(--ds-shadow-soft, 0 10px 30px color-mix(in srgb, black 12%, transparent));padding:.95rem;overflow:hidden;min-width:0;display:grid;gap:.65rem}.example-card-grid.svelte-1s1pej0{display:grid;grid-template-columns:repeat(auto-fit,minmax(11rem,1fr));gap:.58rem}.example-price-card.svelte-1s1pej0{border:var(--ds-border-width-thin, 1px) solid var(--ds-border);border-radius:var(--ds-radius-md, .75rem);background:color-mix(in srgb,var(--ds-surface) 86%,transparent);padding:.65rem;display:grid;gap:.36rem}.example-price-card--featured.svelte-1s1pej0{border-color:color-mix(in srgb,var(--ds-primary) 62%,var(--ds-border));background:color-mix(in srgb,var(--ds-primary) 8%,var(--ds-surface))}.example-price-card.svelte-1s1pej0 strong:where(.svelte-1s1pej0){font-family:var(--ds-font-heading);font-size:var(--ds-size-xl);color:var(--ds-text)}.example-chip-wrap.svelte-1s1pej0{display:flex;flex-wrap:wrap;gap:.4rem}.example-summary.svelte-1s1pej0{border:var(--ds-border-width-thin, 1px) dashed color-mix(in srgb,var(--ds-border) 70%,transparent);border-radius:var(--ds-radius-sm, .5rem);padding:.5rem;display:grid;gap:.24rem;background:color-mix(in srgb,var(--ds-surface-muted) 60%,transparent)}.example-timeline.svelte-1s1pej0{display:grid;gap:.4rem}.example-timeline.svelte-1s1pej0 div:where(.svelte-1s1pej0){border-left:var(--ds-border-width-thick, 2px) solid color-mix(in srgb,var(--ds-primary) 52%,var(--ds-border));padding-left:.58rem;display:grid;gap:.08rem}.example-timeline.svelte-1s1pej0 strong:where(.svelte-1s1pej0){font-family:var(--ds-font-mono);font-size:var(--ds-size-xs);color:var(--ds-primary)}.example-timeline.svelte-1s1pej0 span:where(.svelte-1s1pej0){font-family:var(--ds-font-body);font-size:var(--ds-size-sm);color:var(--ds-text-muted)}.example-team-grid.svelte-1s1pej0{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.55rem}.example-team-card.svelte-1s1pej0{border:var(--ds-border-width-thin, 1px) solid color-mix(in srgb,var(--ds-border) 70%,transparent);border-radius:var(--ds-radius-sm, .56rem);padding:.45rem;display:grid;justify-items:center;gap:.35rem;background:color-mix(in srgb,var(--ds-surface-muted) 58%,transparent);text-align:center}.example-contact-list.svelte-1s1pej0{display:grid;gap:.45rem}.example-contact-list.svelte-1s1pej0 div:where(.svelte-1s1pej0){border:var(--ds-border-width-thin, 1px) solid color-mix(in srgb,var(--ds-border) 68%,transparent);border-radius:var(--ds-radius-sm, .56rem);background:color-mix(in srgb,var(--ds-surface-muted) 54%,transparent);display:grid;grid-template-columns:auto 1fr;gap:.45rem;align-items:center;padding:.46rem;color:var(--ds-text-muted);font-family:var(--ds-font-body);font-size:var(--ds-size-sm)}.example-chat-messages.svelte-1s1pej0{display:grid;gap:.5rem}.example-chat-message.svelte-1s1pej0{display:flex;align-items:flex-start;gap:.42rem}.example-chat-message.svelte-1s1pej0 p:where(.svelte-1s1pej0){margin:0;border:var(--ds-border-width-thin, 1px) solid color-mix(in srgb,var(--ds-border) 70%,transparent);border-radius:var(--ds-radius-sm, .56rem);background:color-mix(in srgb,var(--ds-surface-muted) 64%,transparent);padding:.46rem .52rem;max-width:48ch}.example-chat-message.svelte-1s1pej0 strong:where(.svelte-1s1pej0){color:var(--ds-text)}.example-chat-message--self.svelte-1s1pej0{justify-content:flex-end}.example-chat-message--self.svelte-1s1pej0 p:where(.svelte-1s1pej0){background:color-mix(in srgb,var(--ds-primary) 12%,var(--ds-surface))}.example-chat-compose.svelte-1s1pej0{display:grid;grid-template-columns:1fr auto auto;gap:.45rem;align-items:center}.example-canvas.svelte-1s1pej0{border:var(--ds-border-width-thin, 1px) solid color-mix(in srgb,var(--ds-border) 72%,transparent);border-radius:var(--ds-radius-md, .74rem);background:color-mix(in srgb,var(--ds-bg) 78%,var(--ds-surface));min-height:11rem;position:relative;overflow:hidden;padding:.5rem;display:grid;gap:.4rem}.example-canvas__grid.svelte-1s1pej0{position:absolute;top:0;right:0;bottom:0;left:0;background:repeating-linear-gradient(90deg,color-mix(in srgb,var(--ds-border) 26%,transparent),color-mix(in srgb,var(--ds-border) 26%,transparent) 1px,transparent 1px,transparent 26px),repeating-linear-gradient(0deg,color-mix(in srgb,var(--ds-border) 20%,transparent),color-mix(in srgb,var(--ds-border) 20%,transparent) 1px,transparent 1px,transparent 26px)}.example-canvas__track.svelte-1s1pej0{position:relative;border-radius:var(--ds-radius-sm, .5rem);padding:.44rem .5rem;font-family:var(--ds-font-body);font-size:var(--ds-size-sm);color:var(--ds-text);border:var(--ds-border-width-thin, 1px) solid color-mix(in srgb,var(--ds-border) 68%,transparent)}.example-canvas__track--one.svelte-1s1pej0{width:72%;background:color-mix(in srgb,var(--ds-primary) 18%,var(--ds-surface))}.example-canvas__track--two.svelte-1s1pej0{width:58%;background:color-mix(in srgb,var(--ds-accent) 16%,var(--ds-surface))}.example-canvas__track--three.svelte-1s1pej0{width:84%;background:color-mix(in srgb,var(--ds-success) 16%,var(--ds-surface))}.example-profile-header.svelte-1s1pej0{display:grid;grid-template-columns:auto 1fr auto;gap:.6rem;align-items:center}.example-profile-header.svelte-1s1pej0 h3:where(.svelte-1s1pej0){margin:0}.example-profile-header.svelte-1s1pej0 p:where(.svelte-1s1pej0){margin:.16rem 0 .4rem}.example-activity-list.svelte-1s1pej0{display:grid;gap:.45rem}.example-activity-list.svelte-1s1pej0>div:where(.svelte-1s1pej0){border:var(--ds-border-width-thin, 1px) solid color-mix(in srgb,var(--ds-border) 70%,transparent);border-radius:var(--ds-radius-sm, .55rem);background:color-mix(in srgb,var(--ds-surface) 90%,transparent);padding:.5rem;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:.5rem}.example-activity-list.svelte-1s1pej0 p:where(.svelte-1s1pej0){display:grid;gap:.08rem}.example-activity-list.svelte-1s1pej0 strong:where(.svelte-1s1pej0){color:var(--ds-text)}.example-activity-list.svelte-1s1pej0 span:where(.svelte-1s1pej0){color:var(--ds-text-muted);font-size:var(--ds-size-xs)}@media(max-width:1060px){.examples-controls.svelte-1s1pej0{grid-template-columns:repeat(2,minmax(0,1fr))}.example-layout--landing.svelte-1s1pej0,.example-layout--two.svelte-1s1pej0,.example-layout--chat.svelte-1s1pej0{grid-template-columns:1fr}.example-profile-header.svelte-1s1pej0{grid-template-columns:auto 1fr}.example-profile-header.svelte-1s1pej0 .ds-icon-label-button{grid-column:1 / -1;width:max-content}}@media(max-width:760px){.examples-page.svelte-1s1pej0{padding:.75rem}.examples-page__header.svelte-1s1pej0{flex-direction:column;align-items:flex-start}.examples-controls.svelte-1s1pej0,.example-metric-grid.svelte-1s1pej0,.example-team-grid.svelte-1s1pej0,.example-chat-compose.svelte-1s1pej0{grid-template-columns:1fr}}