/* Sefareshino design system (Gold), built from ds/ by build.py: only the rules these pages use. Do not edit; edit ds/ or src/site.css. */
:root {--ref-color-lime-50: #eef8e5; --ref-color-lime-100: #daf5c5; --ref-color-lime-200: #adee82; --ref-color-lime-300: #9fe870; --ref-color-lime-400: #93de62; --ref-color-lime-500: #80cc4d; --ref-color-lime-600: #5db82b; --ref-color-lime-700: #46971a; --ref-color-lime-800: #2c5a0e; --ref-color-lime-900: #1f4209; --ref-color-lime-950: #132905; --ref-color-forest-50: #eef6e7; --ref-color-forest-100: #dde9d3; --ref-color-forest-200: #b5c7a8; --ref-color-forest-300: #a9b99d; --ref-color-forest-400: #869a78; --ref-color-forest-500: #5f7650; --ref-color-forest-600: #2a5212; --ref-color-forest-700: #1c3f04; --ref-color-forest-800: #163300; --ref-color-forest-900: #172a0c; --ref-color-forest-950: #12200a; --ref-color-neutral-25: #f6f7f3; --ref-color-neutral-50: #f2f4ee; --ref-color-neutral-75: #edf3e8; --ref-color-neutral-100: #e9ede4; --ref-color-neutral-200: #d3d9cc; --ref-color-neutral-300: #a6b19e; --ref-color-neutral-400: #8e9886; --ref-color-neutral-500: #808b78; --ref-color-neutral-600: #646f5e; --ref-color-neutral-700: #4b5644; --ref-color-neutral-800: #1d2418; --ref-color-neutral-825: #1a2116; --ref-color-neutral-850: #161c12; --ref-color-neutral-900: #12170f; --ref-color-neutral-925: #0e120b; --ref-color-neutral-950: #0e1a06; --ref-color-neutral-975: #090c07; --ref-color-emerald-50: #eafcf1; --ref-color-emerald-100: #d3f7e2; --ref-color-emerald-200: #aeeeca; --ref-color-emerald-300: #80daab; --ref-color-emerald-400: #57c590; --ref-color-emerald-500: #2fac76; --ref-color-emerald-600: #088759; --ref-color-emerald-700: #066e47; --ref-color-emerald-800: #015837; --ref-color-emerald-900: #024028; --ref-color-emerald-950: #012515; --ref-color-amber-50: #fff8eb; --ref-color-amber-100: #feefcb; --ref-color-amber-200: #fcdd92; --ref-color-amber-300: #f5b754; --ref-color-amber-400: #e8a317; --ref-color-amber-500: #c98a0c; --ref-color-amber-600: #a26e08; --ref-color-amber-700: #82560a; --ref-color-amber-800: #66430c; --ref-color-amber-900: #4a300a; --ref-color-amber-950: #2c1c05; --ref-color-crimson-50: #fff4f4; --ref-color-crimson-100: #fee6e6; --ref-color-crimson-200: #fecfcf; --ref-color-crimson-300: #feaaac; --ref-color-crimson-400: #fe8087; --ref-color-crimson-500: #f55164; --ref-color-crimson-600: #cd2543; --ref-color-crimson-700: #aa1333; --ref-color-crimson-800: #8a0a27; --ref-color-crimson-900: #69001a; --ref-color-crimson-950: #40000c; --ref-color-lapis-50: #f3f7fe; --ref-color-lapis-100: #e4edff; --ref-color-lapis-200: #cbddfe; --ref-color-lapis-300: #a6c4ff; --ref-color-lapis-400: #81abfe; --ref-color-lapis-500: #5a8ffb; --ref-color-lapis-600: #3a6bd4; --ref-color-lapis-700: #2b56b1; --ref-color-lapis-800: #20438f; --ref-color-lapis-900: #14316e; --ref-color-lapis-950: #071a45; --ref-color-turquoise-50: #eefafa; --ref-color-turquoise-100: #d9f3f4; --ref-color-turquoise-200: #b5e7ea; --ref-color-turquoise-300: #7cd5da; --ref-color-turquoise-400: #21c3cb; --ref-color-turquoise-500: #0ea8ae; --ref-color-turquoise-600: #0a8287; --ref-color-turquoise-700: #03696e; --ref-color-turquoise-800: #055457; --ref-color-turquoise-900: #013e41; --ref-color-turquoise-950: #012325; --ref-color-amethyst-50: #f8f5fe; --ref-color-amethyst-100: #efe9ff; --ref-color-amethyst-200: #e2d4fe; --ref-color-amethyst-300: #cdb6fa; --ref-color-amethyst-400: #ba97f5; --ref-color-amethyst-500: #a479e6; --ref-color-amethyst-600: #8158bd; --ref-color-amethyst-700: #69469c; --ref-color-amethyst-800: #54367e; --ref-color-amethyst-900: #3e275f; --ref-color-amethyst-950: #24143a; --ref-color-kraft-50: #faf7f0; --ref-color-kraft-100: #f4efe3; --ref-color-kraft-200: #e7dcc2; --ref-color-kraft-300: #e2c88e; --ref-color-kraft-400: #c9ab6c; --ref-color-kraft-500: #a88b4e; --ref-color-kraft-600: #8a6f38; --ref-color-kraft-700: #6b5523; --ref-color-kraft-800: #54421a; --ref-color-kraft-900: #3b2e12; --ref-color-kraft-950: #241c0a; --ref-color-gold-300: #fbc18b; --ref-color-gold-400: #f0ba82; --ref-color-gold-500: #d5a76b; --ref-color-gold-600: #b08e4c; --ref-color-white: #ffffff; --ref-color-transparent: rgb(0 0 0 / 0); --ref-color-alpha-ink-4: rgb(14 26 6 / 0.04); --ref-color-alpha-ink-6: rgb(14 26 6 / 0.06); --ref-color-alpha-ink-8: rgb(14 26 6 / 0.08); --ref-color-alpha-ink-10: rgb(14 26 6 / 0.1); --ref-color-alpha-ink-14: rgb(14 26 6 / 0.14); --ref-color-alpha-ink-20: rgb(14 26 6 / 0.2); --ref-color-alpha-ink-40: rgb(14 26 6 / 0.4); --ref-color-alpha-ink-52: rgb(14 26 6 / 0.52); --ref-color-alpha-paper-6: rgb(236 244 230 / 0.06); --ref-color-alpha-paper-8: rgb(236 244 230 / 0.08); --ref-color-alpha-paper-12: rgb(236 244 230 / 0.12); --ref-color-alpha-paper-14: rgb(236 244 230 / 0.14); --ref-color-alpha-paper-40: rgb(236 244 230 / 0.4); --ref-color-alpha-lime-10: rgb(159 232 112 / 0.1); --ref-color-alpha-lime-22: rgb(159 232 112 / 0.22); --ref-color-alpha-lime-24: rgb(159 232 112 / 0.24); --ref-color-alpha-lime-40: rgb(159 232 112 / 0.4); --ref-color-alpha-lime-ink-16: rgb(44 90 14 / 0.16); --ref-color-alpha-lime-ink-24: rgb(44 90 14 / 0.24); --ref-color-alpha-black-40: rgb(0 0 0 / 0.4); --ref-color-alpha-black-70: rgb(0 0 0 / 0.7); --ref-color-alpha-crimson-16: rgb(245 81 100 / 0.16); --ref-color-alpha-crimson-32: rgb(245 81 100 / 0.32);}
:root {--ds-gradient-logo: linear-gradient(to right, var(--ref-color-gold-300) 0%, var(--ref-color-gold-400) 22%, var(--ref-color-gold-500) 59%, var(--ref-color-gold-600) 100%); --ds-font-sans: Vazirmatn, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Tahoma, sans-serif; --ds-font-mono: "Geist Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace; --ds-weight-regular: 400; --ds-weight-medium: 500; --ds-weight-semibold: 600; --ds-weight-bold: 700; --ds-weight-extrabold: 800; --ds-tracking-none: 0px; --ds-fontsize-display: 52px; --ds-fontsize-h1: 36px; --ds-fontsize-h2: 28px; --ds-fontsize-h3: 24px; --ds-fontsize-h4: 20px; --ds-fontsize-body-lg: 18px; --ds-fontsize-body: 16px; --ds-fontsize-body-sm: 14px; --ds-fontsize-label: 13px; --ds-fontsize-caption: 12px; --ds-fontsize-micro: 11px; --ds-fontsize-code: 13px; --ds-lineheight-display: 68px; --ds-lineheight-h1: 48px; --ds-lineheight-h2: 40px; --ds-lineheight-h3: 36px; --ds-lineheight-h4: 32px; --ds-lineheight-body-lg: 32px; --ds-lineheight-body: 28px; --ds-lineheight-body-sm: 24px; --ds-lineheight-label: 20px; --ds-lineheight-caption: 20px; --ds-lineheight-micro: 16px; --ds-lineheight-code: 20px; --ds-text-display-size: var(--ds-fontsize-display); --ds-text-display-leading: var(--ds-lineheight-display); --ds-text-display-weight: var(--ds-weight-extrabold); --ds-text-h1-size: var(--ds-fontsize-h1); --ds-text-h1-leading: var(--ds-lineheight-h1); --ds-text-h1-weight: var(--ds-weight-extrabold); --ds-text-h2-size: var(--ds-fontsize-h2); --ds-text-h2-leading: var(--ds-lineheight-h2); --ds-text-h2-weight: var(--ds-weight-extrabold); --ds-text-h3-size: var(--ds-fontsize-h3); --ds-text-h3-leading: var(--ds-lineheight-h3); --ds-text-h3-weight: var(--ds-weight-bold); --ds-text-h4-size: var(--ds-fontsize-h4); --ds-text-h4-leading: var(--ds-lineheight-h4); --ds-text-h4-weight: var(--ds-weight-bold); --ds-text-body-lg-size: var(--ds-fontsize-body-lg); --ds-text-body-lg-leading: var(--ds-lineheight-body-lg); --ds-text-body-lg-weight: var(--ds-weight-regular); --ds-text-body-size: var(--ds-fontsize-body); --ds-text-body-leading: var(--ds-lineheight-body); --ds-text-body-weight: var(--ds-weight-regular); --ds-text-body-sm-size: var(--ds-fontsize-body-sm); --ds-text-body-sm-leading: var(--ds-lineheight-body-sm); --ds-text-body-sm-weight: var(--ds-weight-regular); --ds-text-label-size: var(--ds-fontsize-label); --ds-text-label-leading: var(--ds-lineheight-label); --ds-text-label-weight: var(--ds-weight-semibold); --ds-text-caption-size: var(--ds-fontsize-caption); --ds-text-caption-leading: var(--ds-lineheight-caption); --ds-text-caption-weight: var(--ds-weight-regular); --ds-text-micro-size: var(--ds-fontsize-micro); --ds-text-micro-leading: var(--ds-lineheight-micro); --ds-text-micro-weight: var(--ds-weight-semibold); --ds-text-code-size: var(--ds-fontsize-code); --ds-text-code-leading: var(--ds-lineheight-code); --ds-text-code-weight: var(--ds-weight-medium); --ds-space-0: 0px; --ds-space-2: 2px; --ds-space-4: 4px; --ds-space-8: 8px; --ds-space-12: 12px; --ds-space-16: 16px; --ds-space-20: 20px; --ds-space-24: 24px; --ds-space-32: 32px; --ds-space-40: 40px; --ds-space-48: 48px; --ds-space-64: 64px; --ds-space-80: 80px; --ds-space-96: 96px; --ds-space-128: 128px; --ds-space-inset-xs: var(--ds-space-8); --ds-space-inset-sm: var(--ds-space-12); --ds-space-inset-md: var(--ds-space-16); --ds-space-inset-lg: var(--ds-space-24); --ds-space-inset-xl: var(--ds-space-32); --ds-space-gap-xs: var(--ds-space-4); --ds-space-gap-sm: var(--ds-space-8); --ds-space-gap-md: var(--ds-space-16); --ds-space-gap-lg: var(--ds-space-24); --ds-space-gap-xl: var(--ds-space-40); --ds-space-section-sm: var(--ds-space-48); --ds-space-section-md: var(--ds-space-64); --ds-space-section-lg: var(--ds-space-96); --ds-size-control-sm: 40px; --ds-size-control-md: 48px; --ds-size-control-lg: 56px; --ds-size-touch: 44px; --ds-size-tile: 48px; --ds-size-icon-xs: 16px; --ds-size-icon-sm: 20px; --ds-size-icon-md: 24px; --ds-size-icon-lg: 32px; --ds-size-icon-stroke: 1.6px; --ds-size-icon-stroke-sm: 1.8px; --ds-size-ring-sm: 32px; --ds-size-ring-md: 48px; --ds-size-ring-lg: 96px; --ds-size-avatar-sm: 32px; --ds-size-avatar-md: 40px; --ds-size-avatar-lg: 64px; --ds-layout-container: 1240px; --ds-layout-measure: 720px; --ds-layout-topbar: 64px; --ds-layout-sidebar: 280px; --ds-layout-gutter-sm: 20px; --ds-layout-gutter-md: 24px; --ds-layout-gutter-lg: 32px; --ds-breakpoint-xs: 360px; --ds-breakpoint-sm: 768px; --ds-breakpoint-md: 1024px; --ds-breakpoint-lg: 1280px; --ds-breakpoint-xl: 1536px; --ds-radius-xs: 6px; --ds-radius-sm: 8px; --ds-radius-md: 12px; --ds-radius-lg: 16px; --ds-radius-xl: 24px; --ds-radius-2xl: 32px; --ds-radius-full: 9999px; --ds-radius-mark: var(--ds-radius-xs); --ds-radius-tag: var(--ds-radius-sm); --ds-radius-control: var(--ds-radius-md); --ds-radius-media: var(--ds-radius-lg); --ds-radius-card: var(--ds-radius-xl); --ds-radius-sheet: var(--ds-radius-xl); --ds-radius-stage: var(--ds-radius-2xl); --ds-radius-pill: var(--ds-radius-full); --ds-radius-chip: var(--ds-radius-full); --ds-border-hairline: 1px; --ds-border-focus-inner: 2px; --ds-border-focus-outer: 2px; --ds-z-base: 0; --ds-z-raised: 10; --ds-z-dropdown: 100; --ds-z-sticky: 200; --ds-z-overlay: 300; --ds-z-modal: 400; --ds-z-toast: 500; --ds-opacity-12: .12; --ds-opacity-16: .16; --ds-opacity-24: .24; --ds-opacity-32: .32; --ds-opacity-40: .4; --ds-opacity-56: .56; --ds-opacity-80: .8; --ds-opacity-disabled: var(--ds-opacity-40); --ds-opacity-muted: var(--ds-opacity-56); --ds-opacity-art-soft: var(--ds-opacity-16); --ds-duration-instant: 80ms; --ds-duration-fast: 120ms; --ds-duration-base: 200ms; --ds-duration-moderate: 240ms; --ds-duration-slow: 320ms; --ds-duration-deliberate: 560ms; --ds-duration-long: 880ms; --ds-motion-dwell-confirm: 1800ms; --ds-motion-dwell-warn: 2600ms; --ds-motion-dwell-toast: 5000ms; --ds-ease-out-swift: cubic-bezier(.2, .8, .2, 1); --ds-ease-out-expo: cubic-bezier(.16, 1, .3, 1); --ds-ease-in-quick: cubic-bezier(.4, 0, 1, 1); --ds-ease-in-out-soft: cubic-bezier(.45, 0, .25, 1); --ds-ease-spring-snappy: cubic-bezier(.34, 1.4, .64, 1); --ds-transition-hover: var(--ds-duration-fast) var(--ds-ease-out-swift); --ds-transition-press: var(--ds-duration-instant) var(--ds-ease-out-swift); --ds-transition-enter: var(--ds-duration-moderate) var(--ds-ease-out-swift); --ds-transition-exit: var(--ds-duration-fast) var(--ds-ease-in-quick); --ds-transition-move: var(--ds-duration-moderate) var(--ds-ease-in-out-soft); --ds-transition-overlay: var(--ds-duration-slow) var(--ds-ease-out-swift); --ds-transition-spring: var(--ds-duration-base) var(--ds-ease-spring-snappy); --ds-transition-lift: var(--ds-duration-slow) var(--ds-ease-out-swift); --ds-spring-snap-stiffness: 700; --ds-spring-snap-damping: 48; --ds-spring-snap-mass: 1; --ds-spring-lift-stiffness: 420; --ds-spring-lift-damping: 36; --ds-spring-lift-mass: 1; --ds-spring-glide-stiffness: 380; --ds-spring-glide-damping: 34; --ds-spring-glide-mass: 1; --ds-spring-lead-stiffness: 560; --ds-spring-lead-damping: 44; --ds-spring-lead-mass: 1; --ds-spring-trail-stiffness: 260; --ds-spring-trail-damping: 30; --ds-spring-trail-mass: 1; --ds-spring-settle-stiffness: 170; --ds-spring-settle-damping: 26; --ds-spring-settle-mass: 1; --ds-spring-sheet-stiffness: 240; --ds-spring-sheet-damping: 29; --ds-spring-sheet-mass: 1; --ds-spring-roll-stiffness: 210; --ds-spring-roll-damping: 24; --ds-spring-roll-mass: 1; --ds-spring-confirm-stiffness: 520; --ds-spring-confirm-damping: 25; --ds-spring-confirm-mass: 1; --ds-spring-nudge-stiffness: 900; --ds-spring-nudge-damping: 15; --ds-spring-nudge-mass: 1; --ds-motion-distance-rise: 12px; --ds-motion-distance-lift: 4px; --ds-motion-distance-nudge: 8px; --ds-motion-distance-shift: 4px; --ds-motion-distance-sheet: 24px; --ds-motion-distance-shake: 6px; --ds-motion-scale-press: .98; --ds-motion-scale-pop: .4; --ds-motion-scale-press-small: .92; --ds-motion-scale-float: .96; --ds-motion-scale-bump: 1.12; --ds-motion-stagger-step: 40ms; --ds-motion-stagger-step-fast: 24ms; --ds-move-settle-duration: var(--ds-duration-deliberate); --ds-move-settle-easing: var(--ds-ease-out-expo); --ds-move-settle-distance: var(--ds-motion-distance-rise); --ds-move-settle-stagger: var(--ds-motion-stagger-step); --ds-move-tally-duration: var(--ds-duration-long); --ds-move-tally-easing: var(--ds-ease-out-expo); --ds-move-draw-duration: var(--ds-duration-long); --ds-move-draw-easing: var(--ds-ease-out-expo); --ds-move-lock-duration: var(--ds-duration-deliberate); --ds-move-lock-easing: var(--ds-ease-out-expo); --ds-move-lock-pop-duration: var(--ds-duration-moderate); --ds-move-lock-pop-easing: var(--ds-ease-spring-snappy); --ds-move-lock-pop-scale: var(--ds-motion-scale-pop); --ds-move-lock-note-duration: var(--ds-duration-slow); --ds-move-lock-note-distance: var(--ds-motion-distance-nudge); --ds-move-lift-duration: var(--ds-duration-slow); --ds-move-lift-easing: var(--ds-ease-out-swift); --ds-move-lift-distance: var(--ds-motion-distance-lift); --ds-motion-delay-intent: 400ms;}
:root,
[data-theme="light"] {color-scheme: light; --ds-color-surface: var(--ref-color-white); --ds-color-canvas: var(--ref-color-neutral-25); --ds-color-raised: var(--ref-color-white); --ds-color-sunken: var(--ref-color-neutral-50); --ds-color-well: var(--ref-color-neutral-100); --ds-color-overlay: var(--ref-color-white); --ds-color-inverse: var(--ref-color-neutral-950); --ds-color-text-1: var(--ref-color-neutral-950); --ds-color-text-2: var(--ref-color-neutral-700); --ds-color-text-3: var(--ref-color-neutral-600); --ds-color-text-disabled: var(--ref-color-neutral-300); --ds-color-text-inverse: var(--ref-color-neutral-25); --ds-color-text-on-brand: var(--ref-color-neutral-950); --ds-color-border-subtle: var(--ref-color-alpha-ink-8); --ds-color-border-default: var(--ref-color-alpha-ink-14); --ds-color-border-strong: var(--ref-color-alpha-ink-52); --ds-color-focus: var(--ref-color-forest-800); --ds-color-brand: var(--ref-color-lime-300); --ds-color-brand-hover: var(--ref-color-lime-400); --ds-color-brand-active: var(--ref-color-lime-500); --ds-color-brand-subtle: var(--ref-color-lime-50); --ds-color-brand-line: var(--ref-color-alpha-lime-ink-16); --ds-color-brand-ink: var(--ref-color-lime-800); --ds-color-brand-edge: var(--ref-color-lime-700); --ds-color-link: var(--ref-color-lime-800); --ds-color-link-hover: var(--ref-color-lime-900); --ds-color-logo-ink: var(--ref-color-neutral-950); --ds-color-stage: var(--ref-color-forest-800); --ds-color-stage-raised: var(--ref-color-forest-600); --ds-color-stage-ink: var(--ref-color-forest-50); --ds-color-stage-ink-2: var(--ref-color-forest-200); --ds-color-stage-line: var(--ref-color-alpha-paper-14); --ds-color-stage-accent: var(--ds-color-brand); --ds-color-stage-accent-hover: var(--ds-color-brand-hover); --ds-color-stage-accent-active: var(--ds-color-brand-active); --ds-color-tag: var(--ref-color-neutral-950); --ds-color-on-tag: var(--ref-color-lime-300); --ds-color-star: var(--ref-color-amber-400); --ds-color-success-fg: var(--ref-color-emerald-700); --ds-color-success-bg: var(--ref-color-emerald-50); --ds-color-success-border: var(--ref-color-emerald-200); --ds-color-success-solid: var(--ref-color-emerald-600); --ds-color-success-on-solid: var(--ref-color-white); --ds-color-warning-fg: var(--ref-color-amber-700); --ds-color-warning-bg: var(--ref-color-amber-50); --ds-color-warning-border: var(--ref-color-amber-200); --ds-color-warning-solid: var(--ref-color-amber-400); --ds-color-warning-on-solid: var(--ref-color-neutral-950); --ds-color-danger-fg: var(--ref-color-crimson-700); --ds-color-danger-bg: var(--ref-color-crimson-50); --ds-color-danger-border: var(--ref-color-crimson-200); --ds-color-danger-solid: var(--ref-color-crimson-600); --ds-color-danger-on-solid: var(--ref-color-white); --ds-color-info-fg: var(--ref-color-lapis-700); --ds-color-info-bg: var(--ref-color-lapis-50); --ds-color-info-border: var(--ref-color-lapis-200); --ds-color-info-solid: var(--ref-color-lapis-600); --ds-color-info-on-solid: var(--ref-color-white); --ds-color-hover: var(--ref-color-alpha-ink-4); --ds-color-pressed: var(--ref-color-alpha-ink-8); --ds-color-scrim: var(--ref-color-alpha-ink-40); --ds-color-debug-grid: var(--ref-color-alpha-crimson-16); --ds-color-debug-grid-strong: var(--ref-color-alpha-crimson-32); --ds-color-chart-1: var(--ref-color-lime-700); --ds-color-chart-2: var(--ref-color-lapis-600); --ds-color-chart-3: var(--ref-color-amber-600); --ds-color-chart-4: var(--ref-color-amethyst-600); --ds-color-chart-5: var(--ref-color-turquoise-700); --ds-color-chart-6: var(--ref-color-crimson-600); --ds-color-accent-vip-fill: var(--ref-color-forest-800); --ds-color-accent-vip-ink: var(--ref-color-forest-800); --ds-color-accent-vip-subtle: var(--ref-color-forest-50); --ds-color-accent-wholesale-fill: var(--ref-color-kraft-500); --ds-color-accent-wholesale-ink: var(--ref-color-kraft-700); --ds-color-accent-wholesale-subtle: var(--ref-color-kraft-100); --ds-color-accent-luxury-fill: var(--ref-color-amethyst-600); --ds-color-accent-luxury-ink: var(--ref-color-amethyst-700); --ds-color-accent-luxury-subtle: var(--ref-color-amethyst-50); --ds-color-accent-tech-fill: var(--ref-color-turquoise-600); --ds-color-accent-tech-ink: var(--ref-color-turquoise-700); --ds-color-accent-tech-subtle: var(--ref-color-turquoise-50); --ds-color-accent-supermarket-fill: var(--ref-color-lime-700); --ds-color-accent-supermarket-ink: var(--ref-color-lime-800); --ds-color-accent-supermarket-subtle: var(--ref-color-lime-100); --ds-color-selected-nav: var(--ds-color-brand-subtle); --ds-color-selected-nav-icon: var(--ds-color-brand-ink); --ds-color-selected-segment: var(--ds-color-raised); --ds-color-selected-segment-line: var(--ds-color-border-default); --ds-color-selected-shell: var(--ds-color-sunken); --ds-color-selected-chip: var(--ds-color-inverse); --ds-color-selected-mark: var(--ds-color-brand); --ds-color-selected-mark-ring: var(--ds-color-brand-line); --ds-color-selected-mark-ring-2: var(--ref-color-transparent); --ds-color-selected-subtle: var(--ds-color-brand-subtle); --ds-color-on-selected: var(--ds-color-text-1); --ds-color-on-selected-chip: var(--ds-color-text-inverse); --ds-color-on-selected-mark: var(--ds-color-text-on-brand); --ds-color-spotlight: var(--ds-color-brand-subtle); --ds-color-track: var(--ds-color-well); --ds-color-track-bar: var(--ds-color-sunken); --ds-color-chart-area: var(--ds-color-chart-1); --ds-color-inverse-action: var(--ds-color-brand); --ds-color-inverse-action-hover: var(--ds-color-brand-hover); --ds-color-inverse-action-active: var(--ds-color-brand-active); --ds-color-on-inverse-action: var(--ds-color-text-on-brand); --ds-color-stat-hero: var(--ds-color-raised); --ds-color-stat-hero-line: var(--ds-color-border-subtle); --ds-color-stat-hero-ink: var(--ds-color-text-1); --ds-color-stat-hero-ink-2: var(--ds-color-text-2); --ds-color-stat-hero-ink-3: var(--ds-color-text-3); --ds-color-stat-hero-tile: var(--ds-color-sunken); --ds-color-stat-hero-tile-line: var(--ds-color-border-subtle); --ds-color-stat-hero-icon: var(--ds-color-text-1); --ds-color-link-field: var(--ds-color-stage-ink); --ds-color-link-field-line: var(--ref-color-transparent); --ds-color-state-done-fill: var(--ds-color-success-solid); --ds-color-state-done-on-fill: var(--ds-color-success-on-solid); --ds-color-state-done-ink: var(--ds-color-success-fg); --ds-color-state-done-subtle: var(--ds-color-success-bg); --ds-color-state-done-line: var(--ds-color-success-border); --ds-color-state-underway-fill: var(--ds-color-info-solid); --ds-color-state-underway-on-fill: var(--ds-color-info-on-solid); --ds-color-state-underway-ink: var(--ds-color-info-fg); --ds-color-state-underway-subtle: var(--ds-color-info-bg); --ds-color-state-underway-line: var(--ds-color-info-border); --ds-color-state-pending-fill: var(--ds-color-warning-solid); --ds-color-state-pending-on-fill: var(--ds-color-warning-on-solid); --ds-color-state-pending-ink: var(--ds-color-warning-fg); --ds-color-state-pending-subtle: var(--ds-color-warning-bg); --ds-color-state-pending-line: var(--ds-color-warning-border); --ds-color-state-stopped-fill: var(--ds-color-danger-solid); --ds-color-state-stopped-on-fill: var(--ds-color-danger-on-solid); --ds-color-state-stopped-ink: var(--ds-color-danger-fg); --ds-color-state-stopped-subtle: var(--ds-color-danger-bg); --ds-color-state-stopped-line: var(--ds-color-danger-border); --ds-color-state-idle-fill: var(--ds-color-text-3); --ds-color-state-idle-on-fill: var(--ds-color-surface); --ds-color-state-idle-ink: var(--ds-color-text-2); --ds-color-state-idle-subtle: var(--ds-color-sunken); --ds-color-state-idle-line: var(--ds-color-border-subtle); --ds-color-dept-ship: var(--ref-color-transparent); --ds-color-dept-ship-ink: var(--ds-color-text-3); --ds-color-dept-ship-subtle: var(--ref-color-transparent); --ds-color-dept-finance: var(--ref-color-transparent); --ds-color-dept-finance-ink: var(--ds-color-text-3); --ds-color-dept-finance-subtle: var(--ref-color-transparent); --ds-color-dept-support: var(--ref-color-transparent); --ds-color-dept-support-ink: var(--ds-color-text-3); --ds-color-dept-support-subtle: var(--ref-color-transparent); --ds-color-dept-catalog: var(--ref-color-transparent); --ds-color-dept-catalog-ink: var(--ds-color-text-3); --ds-color-dept-catalog-subtle: var(--ref-color-transparent); --ds-color-dept-marketing: var(--ref-color-transparent); --ds-color-dept-marketing-ink: var(--ds-color-text-3); --ds-color-dept-marketing-subtle: var(--ref-color-transparent); --ds-color-dept-security: var(--ref-color-transparent); --ds-color-dept-security-ink: var(--ds-color-text-3); --ds-color-dept-security-subtle: var(--ref-color-transparent); --ds-color-on-stage-accent: var(--ds-color-text-on-brand); --ds-color-shadow-soft: var(--ref-color-alpha-ink-10); --ds-color-shadow-deep: var(--ref-color-alpha-ink-20); --ds-shadow-flat: 0 0 0 1px var(--ds-color-border-subtle); --ds-shadow-resting: 0 1px 2px 0 var(--ref-color-alpha-ink-6), 0 1px 1px 0 var(--ref-color-alpha-ink-4); --ds-shadow-raised: 0 0 0 1px var(--ds-color-border-subtle), 0 1px 2px 0 var(--ref-color-alpha-ink-6), 0 1px 1px 0 var(--ref-color-alpha-ink-4); --ds-shadow-floating: 0 1px 2px 0 var(--ref-color-alpha-ink-6), 0 8px 16px -6px var(--ref-color-alpha-ink-10), 0 24px 48px -12px var(--ref-color-alpha-ink-20); --ds-shadow-overlay: 0 0 0 1px var(--ds-color-border-subtle), 0 1px 2px 0 var(--ref-color-alpha-ink-6), 0 8px 16px -6px var(--ref-color-alpha-ink-10), 0 24px 48px -12px var(--ref-color-alpha-ink-20); --ds-shadow-modal: 0 0 0 1px var(--ds-color-border-subtle), 0 12px 24px -8px var(--ref-color-alpha-ink-10), 0 32px 64px -16px var(--ref-color-alpha-ink-20);}
[data-theme="dark"] {color-scheme: dark; --ds-color-surface: var(--ref-color-neutral-975); --ds-color-canvas: var(--ref-color-neutral-925); --ds-color-raised: var(--ref-color-neutral-900); --ds-color-sunken: var(--ref-color-neutral-850); --ds-color-well: var(--ref-color-neutral-800); --ds-color-overlay: var(--ref-color-neutral-825); --ds-color-inverse: var(--ref-color-neutral-75); --ds-color-text-1: var(--ref-color-neutral-75); --ds-color-text-2: var(--ref-color-neutral-300); --ds-color-text-3: var(--ref-color-neutral-500); --ds-color-text-disabled: var(--ref-color-neutral-700); --ds-color-text-inverse: var(--ref-color-neutral-950); --ds-color-text-on-brand: var(--ref-color-neutral-950); --ds-color-border-subtle: var(--ref-color-alpha-paper-8); --ds-color-border-default: var(--ref-color-alpha-paper-14); --ds-color-border-strong: var(--ref-color-alpha-paper-40); --ds-color-focus: var(--ref-color-lime-300); --ds-color-brand: var(--ref-color-lime-300); --ds-color-brand-hover: var(--ref-color-lime-200); --ds-color-brand-active: var(--ref-color-lime-400); --ds-color-brand-subtle: var(--ref-color-alpha-lime-10); --ds-color-brand-line: var(--ref-color-alpha-lime-22); --ds-color-brand-ink: var(--ref-color-lime-300); --ds-color-brand-edge: var(--ref-color-lime-300); --ds-color-link: var(--ref-color-lime-300); --ds-color-link-hover: var(--ref-color-lime-200); --ds-color-logo-ink: var(--ref-color-neutral-75); --ds-color-stage: var(--ref-color-forest-950); --ds-color-stage-raised: var(--ref-color-forest-700); --ds-color-stage-ink: var(--ref-color-forest-50); --ds-color-stage-ink-2: var(--ref-color-forest-300); --ds-color-stage-line: var(--ref-color-alpha-paper-12); --ds-color-stage-accent: var(--ds-color-brand); --ds-color-stage-accent-hover: var(--ds-color-brand-hover); --ds-color-stage-accent-active: var(--ds-color-brand-active); --ds-color-tag: var(--ref-color-neutral-950); --ds-color-on-tag: var(--ref-color-lime-300); --ds-color-star: var(--ref-color-amber-300); --ds-color-success-fg: var(--ref-color-emerald-300); --ds-color-success-bg: var(--ref-color-emerald-950); --ds-color-success-border: var(--ref-color-emerald-800); --ds-color-success-solid: var(--ref-color-emerald-400); --ds-color-success-on-solid: var(--ref-color-neutral-950); --ds-color-warning-fg: var(--ref-color-amber-300); --ds-color-warning-bg: var(--ref-color-amber-950); --ds-color-warning-border: var(--ref-color-amber-800); --ds-color-warning-solid: var(--ref-color-amber-400); --ds-color-warning-on-solid: var(--ref-color-neutral-950); --ds-color-danger-fg: var(--ref-color-crimson-300); --ds-color-danger-bg: var(--ref-color-crimson-950); --ds-color-danger-border: var(--ref-color-crimson-800); --ds-color-danger-solid: var(--ref-color-crimson-400); --ds-color-danger-on-solid: var(--ref-color-neutral-950); --ds-color-info-fg: var(--ref-color-lapis-300); --ds-color-info-bg: var(--ref-color-lapis-950); --ds-color-info-border: var(--ref-color-lapis-800); --ds-color-info-solid: var(--ref-color-lapis-400); --ds-color-info-on-solid: var(--ref-color-neutral-950); --ds-color-hover: var(--ref-color-alpha-paper-6); --ds-color-pressed: var(--ref-color-alpha-paper-12); --ds-color-scrim: var(--ref-color-alpha-black-70); --ds-color-debug-grid: var(--ref-color-alpha-crimson-16); --ds-color-debug-grid-strong: var(--ref-color-alpha-crimson-32); --ds-color-chart-1: var(--ref-color-lime-300); --ds-color-chart-2: var(--ref-color-lapis-400); --ds-color-chart-3: var(--ref-color-amber-400); --ds-color-chart-4: var(--ref-color-amethyst-400); --ds-color-chart-5: var(--ref-color-turquoise-400); --ds-color-chart-6: var(--ref-color-crimson-400); --ds-color-accent-vip-fill: var(--ref-color-forest-300); --ds-color-accent-vip-ink: var(--ref-color-forest-200); --ds-color-accent-vip-subtle: var(--ref-color-forest-900); --ds-color-accent-wholesale-fill: var(--ref-color-kraft-400); --ds-color-accent-wholesale-ink: var(--ref-color-kraft-300); --ds-color-accent-wholesale-subtle: var(--ref-color-kraft-950); --ds-color-accent-luxury-fill: var(--ref-color-amethyst-400); --ds-color-accent-luxury-ink: var(--ref-color-amethyst-300); --ds-color-accent-luxury-subtle: var(--ref-color-amethyst-950); --ds-color-accent-tech-fill: var(--ref-color-turquoise-400); --ds-color-accent-tech-ink: var(--ref-color-turquoise-300); --ds-color-accent-tech-subtle: var(--ref-color-turquoise-950); --ds-color-accent-supermarket-fill: var(--ref-color-lime-300); --ds-color-accent-supermarket-ink: var(--ref-color-lime-300); --ds-color-accent-supermarket-subtle: var(--ref-color-lime-950); --ds-color-selected-nav: var(--ds-color-brand-subtle); --ds-color-selected-nav-icon: var(--ds-color-brand-ink); --ds-color-selected-segment: var(--ds-color-raised); --ds-color-selected-segment-line: var(--ds-color-border-default); --ds-color-selected-shell: var(--ds-color-sunken); --ds-color-selected-chip: var(--ds-color-inverse); --ds-color-selected-mark: var(--ds-color-brand); --ds-color-selected-mark-ring: var(--ds-color-brand-line); --ds-color-selected-mark-ring-2: var(--ref-color-transparent); --ds-color-selected-subtle: var(--ds-color-brand-subtle); --ds-color-on-selected: var(--ds-color-text-1); --ds-color-on-selected-chip: var(--ds-color-text-inverse); --ds-color-on-selected-mark: var(--ds-color-text-on-brand); --ds-color-spotlight: var(--ds-color-brand-subtle); --ds-color-track: var(--ds-color-well); --ds-color-track-bar: var(--ds-color-sunken); --ds-color-chart-area: var(--ds-color-chart-1); --ds-color-inverse-action: var(--ref-color-lime-800); --ds-color-inverse-action-hover: var(--ref-color-lime-900); --ds-color-inverse-action-active: var(--ref-color-lime-950); --ds-color-on-inverse-action: var(--ref-color-white); --ds-color-stat-hero: var(--ds-color-raised); --ds-color-stat-hero-line: var(--ds-color-border-subtle); --ds-color-stat-hero-ink: var(--ds-color-text-1); --ds-color-stat-hero-ink-2: var(--ds-color-text-2); --ds-color-stat-hero-ink-3: var(--ds-color-text-3); --ds-color-stat-hero-tile: var(--ds-color-sunken); --ds-color-stat-hero-tile-line: var(--ds-color-border-subtle); --ds-color-stat-hero-icon: var(--ds-color-text-1); --ds-color-link-field: var(--ds-color-raised); --ds-color-link-field-line: var(--ref-color-transparent); --ds-color-state-done-fill: var(--ds-color-success-solid); --ds-color-state-done-on-fill: var(--ds-color-success-on-solid); --ds-color-state-done-ink: var(--ds-color-success-fg); --ds-color-state-done-subtle: var(--ds-color-success-bg); --ds-color-state-done-line: var(--ds-color-success-border); --ds-color-state-underway-fill: var(--ds-color-info-solid); --ds-color-state-underway-on-fill: var(--ds-color-info-on-solid); --ds-color-state-underway-ink: var(--ds-color-info-fg); --ds-color-state-underway-subtle: var(--ds-color-info-bg); --ds-color-state-underway-line: var(--ds-color-info-border); --ds-color-state-pending-fill: var(--ds-color-warning-solid); --ds-color-state-pending-on-fill: var(--ds-color-warning-on-solid); --ds-color-state-pending-ink: var(--ds-color-warning-fg); --ds-color-state-pending-subtle: var(--ds-color-warning-bg); --ds-color-state-pending-line: var(--ds-color-warning-border); --ds-color-state-stopped-fill: var(--ds-color-danger-solid); --ds-color-state-stopped-on-fill: var(--ds-color-danger-on-solid); --ds-color-state-stopped-ink: var(--ds-color-danger-fg); --ds-color-state-stopped-subtle: var(--ds-color-danger-bg); --ds-color-state-stopped-line: var(--ds-color-danger-border); --ds-color-state-idle-fill: var(--ds-color-text-3); --ds-color-state-idle-on-fill: var(--ds-color-surface); --ds-color-state-idle-ink: var(--ds-color-text-2); --ds-color-state-idle-subtle: var(--ds-color-sunken); --ds-color-state-idle-line: var(--ds-color-border-subtle); --ds-color-dept-ship: var(--ref-color-transparent); --ds-color-dept-ship-ink: var(--ds-color-text-3); --ds-color-dept-ship-subtle: var(--ref-color-transparent); --ds-color-dept-finance: var(--ref-color-transparent); --ds-color-dept-finance-ink: var(--ds-color-text-3); --ds-color-dept-finance-subtle: var(--ref-color-transparent); --ds-color-dept-support: var(--ref-color-transparent); --ds-color-dept-support-ink: var(--ds-color-text-3); --ds-color-dept-support-subtle: var(--ref-color-transparent); --ds-color-dept-catalog: var(--ref-color-transparent); --ds-color-dept-catalog-ink: var(--ds-color-text-3); --ds-color-dept-catalog-subtle: var(--ref-color-transparent); --ds-color-dept-marketing: var(--ref-color-transparent); --ds-color-dept-marketing-ink: var(--ds-color-text-3); --ds-color-dept-marketing-subtle: var(--ref-color-transparent); --ds-color-dept-security: var(--ref-color-transparent); --ds-color-dept-security-ink: var(--ds-color-text-3); --ds-color-dept-security-subtle: var(--ref-color-transparent); --ds-color-on-stage-accent: var(--ds-color-text-on-brand); --ds-color-shadow-soft: var(--ref-color-alpha-black-40); --ds-color-shadow-deep: var(--ref-color-alpha-black-70); --ds-shadow-flat: 0 0 0 1px var(--ds-color-border-subtle); --ds-shadow-resting: 0 1px 2px 0 var(--ref-color-alpha-black-40); --ds-shadow-raised: 0 0 0 1px var(--ds-color-border-subtle), 0 1px 2px 0 var(--ref-color-alpha-black-40); --ds-shadow-floating: 0 1px 2px 0 var(--ref-color-alpha-black-40), 0 24px 48px -12px var(--ref-color-alpha-black-70), inset 0 0 0 1px var(--ds-color-border-default); --ds-shadow-overlay: 0 0 0 1px var(--ds-color-border-default), 0 1px 2px 0 var(--ref-color-alpha-black-40), 0 24px 48px -12px var(--ref-color-alpha-black-70); --ds-shadow-modal: 0 0 0 1px var(--ds-color-border-default), 0 32px 64px -16px var(--ref-color-alpha-black-70);}
@media (prefers-color-scheme: dark) {
:root:not([data-theme]) {color-scheme: dark; --ds-color-surface: var(--ref-color-neutral-975); --ds-color-canvas: var(--ref-color-neutral-925); --ds-color-raised: var(--ref-color-neutral-900); --ds-color-sunken: var(--ref-color-neutral-850); --ds-color-well: var(--ref-color-neutral-800); --ds-color-overlay: var(--ref-color-neutral-825); --ds-color-inverse: var(--ref-color-neutral-75); --ds-color-text-1: var(--ref-color-neutral-75); --ds-color-text-2: var(--ref-color-neutral-300); --ds-color-text-3: var(--ref-color-neutral-500); --ds-color-text-disabled: var(--ref-color-neutral-700); --ds-color-text-inverse: var(--ref-color-neutral-950); --ds-color-text-on-brand: var(--ref-color-neutral-950); --ds-color-border-subtle: var(--ref-color-alpha-paper-8); --ds-color-border-default: var(--ref-color-alpha-paper-14); --ds-color-border-strong: var(--ref-color-alpha-paper-40); --ds-color-focus: var(--ref-color-lime-300); --ds-color-brand: var(--ref-color-lime-300); --ds-color-brand-hover: var(--ref-color-lime-200); --ds-color-brand-active: var(--ref-color-lime-400); --ds-color-brand-subtle: var(--ref-color-alpha-lime-10); --ds-color-brand-line: var(--ref-color-alpha-lime-22); --ds-color-brand-ink: var(--ref-color-lime-300); --ds-color-brand-edge: var(--ref-color-lime-300); --ds-color-link: var(--ref-color-lime-300); --ds-color-link-hover: var(--ref-color-lime-200); --ds-color-logo-ink: var(--ref-color-neutral-75); --ds-color-stage: var(--ref-color-forest-950); --ds-color-stage-raised: var(--ref-color-forest-700); --ds-color-stage-ink: var(--ref-color-forest-50); --ds-color-stage-ink-2: var(--ref-color-forest-300); --ds-color-stage-line: var(--ref-color-alpha-paper-12); --ds-color-stage-accent: var(--ds-color-brand); --ds-color-stage-accent-hover: var(--ds-color-brand-hover); --ds-color-stage-accent-active: var(--ds-color-brand-active); --ds-color-tag: var(--ref-color-neutral-950); --ds-color-on-tag: var(--ref-color-lime-300); --ds-color-star: var(--ref-color-amber-300); --ds-color-success-fg: var(--ref-color-emerald-300); --ds-color-success-bg: var(--ref-color-emerald-950); --ds-color-success-border: var(--ref-color-emerald-800); --ds-color-success-solid: var(--ref-color-emerald-400); --ds-color-success-on-solid: var(--ref-color-neutral-950); --ds-color-warning-fg: var(--ref-color-amber-300); --ds-color-warning-bg: var(--ref-color-amber-950); --ds-color-warning-border: var(--ref-color-amber-800); --ds-color-warning-solid: var(--ref-color-amber-400); --ds-color-warning-on-solid: var(--ref-color-neutral-950); --ds-color-danger-fg: var(--ref-color-crimson-300); --ds-color-danger-bg: var(--ref-color-crimson-950); --ds-color-danger-border: var(--ref-color-crimson-800); --ds-color-danger-solid: var(--ref-color-crimson-400); --ds-color-danger-on-solid: var(--ref-color-neutral-950); --ds-color-info-fg: var(--ref-color-lapis-300); --ds-color-info-bg: var(--ref-color-lapis-950); --ds-color-info-border: var(--ref-color-lapis-800); --ds-color-info-solid: var(--ref-color-lapis-400); --ds-color-info-on-solid: var(--ref-color-neutral-950); --ds-color-hover: var(--ref-color-alpha-paper-6); --ds-color-pressed: var(--ref-color-alpha-paper-12); --ds-color-scrim: var(--ref-color-alpha-black-70); --ds-color-debug-grid: var(--ref-color-alpha-crimson-16); --ds-color-debug-grid-strong: var(--ref-color-alpha-crimson-32); --ds-color-chart-1: var(--ref-color-lime-300); --ds-color-chart-2: var(--ref-color-lapis-400); --ds-color-chart-3: var(--ref-color-amber-400); --ds-color-chart-4: var(--ref-color-amethyst-400); --ds-color-chart-5: var(--ref-color-turquoise-400); --ds-color-chart-6: var(--ref-color-crimson-400); --ds-color-accent-vip-fill: var(--ref-color-forest-300); --ds-color-accent-vip-ink: var(--ref-color-forest-200); --ds-color-accent-vip-subtle: var(--ref-color-forest-900); --ds-color-accent-wholesale-fill: var(--ref-color-kraft-400); --ds-color-accent-wholesale-ink: var(--ref-color-kraft-300); --ds-color-accent-wholesale-subtle: var(--ref-color-kraft-950); --ds-color-accent-luxury-fill: var(--ref-color-amethyst-400); --ds-color-accent-luxury-ink: var(--ref-color-amethyst-300); --ds-color-accent-luxury-subtle: var(--ref-color-amethyst-950); --ds-color-accent-tech-fill: var(--ref-color-turquoise-400); --ds-color-accent-tech-ink: var(--ref-color-turquoise-300); --ds-color-accent-tech-subtle: var(--ref-color-turquoise-950); --ds-color-accent-supermarket-fill: var(--ref-color-lime-300); --ds-color-accent-supermarket-ink: var(--ref-color-lime-300); --ds-color-accent-supermarket-subtle: var(--ref-color-lime-950); --ds-color-selected-nav: var(--ds-color-brand-subtle); --ds-color-selected-nav-icon: var(--ds-color-brand-ink); --ds-color-selected-segment: var(--ds-color-raised); --ds-color-selected-segment-line: var(--ds-color-border-default); --ds-color-selected-shell: var(--ds-color-sunken); --ds-color-selected-chip: var(--ds-color-inverse); --ds-color-selected-mark: var(--ds-color-brand); --ds-color-selected-mark-ring: var(--ds-color-brand-line); --ds-color-selected-mark-ring-2: var(--ref-color-transparent); --ds-color-selected-subtle: var(--ds-color-brand-subtle); --ds-color-on-selected: var(--ds-color-text-1); --ds-color-on-selected-chip: var(--ds-color-text-inverse); --ds-color-on-selected-mark: var(--ds-color-text-on-brand); --ds-color-spotlight: var(--ds-color-brand-subtle); --ds-color-track: var(--ds-color-well); --ds-color-track-bar: var(--ds-color-sunken); --ds-color-chart-area: var(--ds-color-chart-1); --ds-color-inverse-action: var(--ref-color-lime-800); --ds-color-inverse-action-hover: var(--ref-color-lime-900); --ds-color-inverse-action-active: var(--ref-color-lime-950); --ds-color-on-inverse-action: var(--ref-color-white); --ds-color-stat-hero: var(--ds-color-raised); --ds-color-stat-hero-line: var(--ds-color-border-subtle); --ds-color-stat-hero-ink: var(--ds-color-text-1); --ds-color-stat-hero-ink-2: var(--ds-color-text-2); --ds-color-stat-hero-ink-3: var(--ds-color-text-3); --ds-color-stat-hero-tile: var(--ds-color-sunken); --ds-color-stat-hero-tile-line: var(--ds-color-border-subtle); --ds-color-stat-hero-icon: var(--ds-color-text-1); --ds-color-link-field: var(--ds-color-raised); --ds-color-link-field-line: var(--ref-color-transparent); --ds-color-state-done-fill: var(--ds-color-success-solid); --ds-color-state-done-on-fill: var(--ds-color-success-on-solid); --ds-color-state-done-ink: var(--ds-color-success-fg); --ds-color-state-done-subtle: var(--ds-color-success-bg); --ds-color-state-done-line: var(--ds-color-success-border); --ds-color-state-underway-fill: var(--ds-color-info-solid); --ds-color-state-underway-on-fill: var(--ds-color-info-on-solid); --ds-color-state-underway-ink: var(--ds-color-info-fg); --ds-color-state-underway-subtle: var(--ds-color-info-bg); --ds-color-state-underway-line: var(--ds-color-info-border); --ds-color-state-pending-fill: var(--ds-color-warning-solid); --ds-color-state-pending-on-fill: var(--ds-color-warning-on-solid); --ds-color-state-pending-ink: var(--ds-color-warning-fg); --ds-color-state-pending-subtle: var(--ds-color-warning-bg); --ds-color-state-pending-line: var(--ds-color-warning-border); --ds-color-state-stopped-fill: var(--ds-color-danger-solid); --ds-color-state-stopped-on-fill: var(--ds-color-danger-on-solid); --ds-color-state-stopped-ink: var(--ds-color-danger-fg); --ds-color-state-stopped-subtle: var(--ds-color-danger-bg); --ds-color-state-stopped-line: var(--ds-color-danger-border); --ds-color-state-idle-fill: var(--ds-color-text-3); --ds-color-state-idle-on-fill: var(--ds-color-surface); --ds-color-state-idle-ink: var(--ds-color-text-2); --ds-color-state-idle-subtle: var(--ds-color-sunken); --ds-color-state-idle-line: var(--ds-color-border-subtle); --ds-color-dept-ship: var(--ref-color-transparent); --ds-color-dept-ship-ink: var(--ds-color-text-3); --ds-color-dept-ship-subtle: var(--ref-color-transparent); --ds-color-dept-finance: var(--ref-color-transparent); --ds-color-dept-finance-ink: var(--ds-color-text-3); --ds-color-dept-finance-subtle: var(--ref-color-transparent); --ds-color-dept-support: var(--ref-color-transparent); --ds-color-dept-support-ink: var(--ds-color-text-3); --ds-color-dept-support-subtle: var(--ref-color-transparent); --ds-color-dept-catalog: var(--ref-color-transparent); --ds-color-dept-catalog-ink: var(--ds-color-text-3); --ds-color-dept-catalog-subtle: var(--ref-color-transparent); --ds-color-dept-marketing: var(--ref-color-transparent); --ds-color-dept-marketing-ink: var(--ds-color-text-3); --ds-color-dept-marketing-subtle: var(--ref-color-transparent); --ds-color-dept-security: var(--ref-color-transparent); --ds-color-dept-security-ink: var(--ds-color-text-3); --ds-color-dept-security-subtle: var(--ref-color-transparent); --ds-color-on-stage-accent: var(--ds-color-text-on-brand); --ds-color-shadow-soft: var(--ref-color-alpha-black-40); --ds-color-shadow-deep: var(--ref-color-alpha-black-70); --ds-shadow-flat: 0 0 0 1px var(--ds-color-border-subtle); --ds-shadow-resting: 0 1px 2px 0 var(--ref-color-alpha-black-40); --ds-shadow-raised: 0 0 0 1px var(--ds-color-border-subtle), 0 1px 2px 0 var(--ref-color-alpha-black-40); --ds-shadow-floating: 0 1px 2px 0 var(--ref-color-alpha-black-40), 0 24px 48px -12px var(--ref-color-alpha-black-70), inset 0 0 0 1px var(--ds-color-border-default); --ds-shadow-overlay: 0 0 0 1px var(--ds-color-border-default), 0 1px 2px 0 var(--ref-color-alpha-black-40), 0 24px 48px -12px var(--ref-color-alpha-black-70); --ds-shadow-modal: 0 0 0 1px var(--ds-color-border-default), 0 32px 64px -16px var(--ref-color-alpha-black-70);}
}
:root {--ds-spring-snap-duration: 305ms; --ds-spring-snap-easing: linear(0, .0128, .0462, .094, .1512, .2141, .2795, .3452, .4096, .4714, .5298, .5842, .6345, .6804, .722, .7595, .7929, .8226, .8488, .8718, .8918, .9092, .9243, .9372, .9483, .9577, .9656, .9723, .9779, .9826, .9865, .9897, .9923, .9944, .996, .9974, .9984, .9993, .9999, 1.0003, 1.0007, 1.0009, 1.001, 1.0011, 1.0011, 1.0011, 1.0011, 1.0011, 1); --ds-spring-lift-duration: 424ms; --ds-spring-lift-easing: linear(0, .0147, .053, .1074, .172, .2421, .3144, .3862, .4556, .5213, .5825, .6388, .6898, .7356, .7764, .8123, .8437, .8709, .8943, .9143, .9312, .9455, .9574, .9672, .9753, .9819, .9872, .9914, .9947, .9972, .9992, 1.0006, 1.0016, 1.0023, 1.0028, 1.003, 1.0031, 1.0031, 1.003, 1.0028, 1.0026, 1.0024, 1.0022, 1.002, 1.0018, 1.0016, 1.0014, 1.0012, 1); --ds-spring-glide-duration: 448ms; --ds-spring-glide-easing: linear(0, .0149, .0536, .1085, .1738, .2446, .3176, .39, .46, .5262, .5879, .6444, .6956, .7415, .7822, .818, .8493, .8763, .8994, .9191, .9358, .9497, .9612, .9708, .9785, .9848, .9898, .9937, .9967, .999, 1.0007, 1.0019, 1.0028, 1.0033, 1.0036, 1.0037, 1.0037, 1.0036, 1.0034, 1.0031, 1.0029, 1.0026, 1.0023, 1.0021, 1.0018, 1.0016, 1.0014, 1.0012, 1); --ds-spring-lead-duration: 291ms; --ds-spring-lead-easing: linear(0, .0094, .0345, .0711, .1159, .1662, .2197, .2748, .33, .3844, .4372, .4877, .5357, .5808, .6229, .662, .698, .731, .7611, .7885, .8133, .8357, .8557, .8737, .8898, .9041, .9167, .9279, .9378, .9465, .9541, .9608, .9666, .9716, .976, .9798, .9831, .9859, .9883, .9903, .9921, .9936, .9948, .9959, .9967, .9975, .9981, .9986, 1); --ds-spring-trail-duration: 428ms; --ds-spring-trail-easing: linear(0, .0095, .0346, .0714, .1163, .1667, .2203, .2755, .3309, .3853, .4381, .4887, .5367, .5818, .6239, .6629, .6989, .7319, .762, .7893, .814, .8363, .8564, .8743, .8903, .9045, .9171, .9283, .9381, .9468, .9544, .961, .9668, .9718, .9761, .9799, .9832, .9859, .9883, .9904, .9921, .9936, .9948, .9959, .9967, .9975, .9981, .9986, 1); --ds-spring-settle-duration: 701ms; --ds-spring-settle-easing: linear(0, .016, .0565, .1126, .1777, .2469, .317, .3854, .4507, .5119, .5684, .6201, .6669, .7089, .7464, .7796, .809, .8349, .8575, .8773, .8945, .9095, .9224, .9336, .9433, .9516, .9587, .9649, .9701, .9746, .9784, .9817, .9845, .9869, .9889, .9906, .9921, .9933, .9943, .9952, .996, .9966, .9971, .9976, .998, .9983, .9986, .9988, 1); --ds-spring-sheet-duration: 459ms; --ds-spring-sheet-easing: linear(0, .01, .0365, .0751, .122, .1743, .2297, .2865, .3432, .3987, .4523, .5033, .5515, .5966, .6385, .6772, .7127, .7451, .7745, .8011, .8251, .8466, .8658, .883, .8982, .9117, .9236, .9341, .9433, .9514, .9584, .9645, .9699, .9745, .9785, .9819, .9848, .9874, .9895, .9913, .9929, .9942, .9953, .9962, .997, .9977, .9982, .9986, 1); --ds-spring-roll-duration: 598ms; --ds-spring-roll-easing: linear(0, .0147, .0534, .1086, .1746, .2467, .3214, .3958, .468, .5365, .6003, .6588, .7118, .7592, .8011, .8378, .8695, .8967, .9198, .9392, .9553, .9684, .9791, .9876, .9942, .9993, 1.0031, 1.0058, 1.0077, 1.0089, 1.0095, 1.0097, 1.0095, 1.0092, 1.0086, 1.008, 1.0073, 1.0066, 1.0059, 1.0052, 1.0045, 1.0039, 1.0033, 1.0028, 1.0023, 1.0019, 1.0016, 1.0013, 1); --ds-spring-confirm-duration: 553ms; --ds-spring-confirm-easing: linear(0, .0312, .1124, .2262, .3577, .4945, .6273, .749, .8553, .9436, 1.0131, 1.0645, 1.0992, 1.1192, 1.1272, 1.1256, 1.1168, 1.1034, 1.0871, 1.0697, 1.0525, 1.0365, 1.0223, 1.0103, 1.0007, .9935, .9885, .9854, .9839, .9838, .9847, .9863, .9882, .9904, .9927, .9948, .9966, .9983, .9996, 1.0006, 1.0013, 1.0018, 1.002, 1.0021, 1.002, 1.0018, 1.0016, 1.0013, 1); --ds-spring-nudge-duration: 895ms; --ds-spring-nudge-easing: linear(0, .1392, .4734, .866, 1.1985, 1.3971, 1.4416, 1.3579, 1.1994, 1.0265, .8888, .8143, .8073, .8533, .927, 1.0022, 1.0585, 1.0854, 1.0831, 1.0593, 1.0255, .9931, .9705, .9613, .9646, .9765, .9917, 1.0055, 1.0144, 1.0173, 1.0149, 1.0091, 1.0023, .9966, .9931, .9923, .9938, .9965, .9995, 1.0019, 1.0032, 1.0033, 1.0025, 1.0013, 1, .999, .9985, .9986, 1);}
@media (max-width: 767px) {
:root {--ds-text-display-size: 30px; --ds-text-h1-size: 26px; --ds-text-h2-size: 22px; --ds-text-body-lg-size: 16px; --ds-text-display-leading: 44px; --ds-text-h1-leading: 40px; --ds-text-h2-leading: 32px; --ds-text-body-lg-leading: 28px;}
}
[data-type="compact"] {--ds-text-display-size: 30px; --ds-text-h1-size: 26px; --ds-text-h2-size: 22px; --ds-text-body-lg-size: 16px; --ds-text-display-leading: 44px; --ds-text-h1-leading: 40px; --ds-text-h2-leading: 32px; --ds-text-body-lg-leading: 28px;}
@media (prefers-reduced-motion: reduce) {
:root {--ds-duration-moderate: 120ms; --ds-duration-slow: 120ms; --ds-duration-deliberate: 120ms; --ds-duration-long: 120ms; --ds-motion-distance-rise: 0px; --ds-motion-distance-lift: 0px; --ds-motion-distance-nudge: 0px; --ds-motion-distance-shift: 0px; --ds-motion-distance-sheet: 0px; --ds-motion-distance-shake: 0px; --ds-motion-scale-press: 1; --ds-motion-scale-pop: 1; --ds-motion-scale-press-small: 1; --ds-motion-scale-float: 1; --ds-motion-scale-bump: 1; --ds-motion-stagger-step: 0ms; --ds-motion-stagger-step-fast: 0ms;}
}
[data-motion="reduced"] {--ds-duration-moderate: 120ms; --ds-duration-slow: 120ms; --ds-duration-deliberate: 120ms; --ds-duration-long: 120ms; --ds-motion-distance-rise: 0px; --ds-motion-distance-lift: 0px; --ds-motion-distance-nudge: 0px; --ds-motion-distance-shift: 0px; --ds-motion-distance-sheet: 0px; --ds-motion-distance-shake: 0px; --ds-motion-scale-press: 1; --ds-motion-scale-pop: 1; --ds-motion-scale-press-small: 1; --ds-motion-scale-float: 1; --ds-motion-scale-bump: 1; --ds-motion-stagger-step: 0ms; --ds-motion-stagger-step-fast: 0ms; --ds-transition-enter: var(--ds-duration-moderate) var(--ds-ease-out-swift); --ds-transition-move: var(--ds-duration-moderate) var(--ds-ease-in-out-soft); --ds-transition-overlay: var(--ds-duration-slow) var(--ds-ease-out-swift); --ds-transition-lift: var(--ds-duration-slow) var(--ds-ease-out-swift); --ds-move-settle-duration: var(--ds-duration-deliberate); --ds-move-settle-distance: var(--ds-motion-distance-rise); --ds-move-settle-stagger: var(--ds-motion-stagger-step); --ds-move-tally-duration: var(--ds-duration-long); --ds-move-draw-duration: var(--ds-duration-long); --ds-move-lock-duration: var(--ds-duration-deliberate); --ds-move-lock-pop-duration: var(--ds-duration-moderate); --ds-move-lock-pop-scale: var(--ds-motion-scale-pop); --ds-move-lock-note-duration: var(--ds-duration-slow); --ds-move-lock-note-distance: var(--ds-motion-distance-nudge); --ds-move-lift-duration: var(--ds-duration-slow); --ds-move-lift-distance: var(--ds-motion-distance-lift);}
:root {--ref-color-sun-yellow-50: #fbfbd6; --ref-color-sun-yellow-100: #f6f6b4; --ref-color-sun-yellow-300: #f2f25e; --ref-color-sun-yellow-400: #e6e64a; --ref-color-sun-yellow-500: #d4d43a; --ref-color-sun-olive-700: #45452a; --ref-color-sun-olive-800: #38382a; --ref-color-sun-olive-850: #2a2a1a; --ref-color-sun-olive-900: #242419; --ref-color-sun-carbon-700: #3a3a37; --ref-color-sun-carbon-800: #2b2b29; --ref-color-sun-carbon-900: #141414; --ref-color-sun-carbon-950: #000000; --ref-color-sun-greige-25: #f4f3f0; --ref-color-sun-greige-50: #efeeea; --ref-color-sun-greige-75: #eae8e4; --ref-color-sun-greige-100: #e6e3df; --ref-color-sun-greige-300: #aba8a1; --ref-color-sun-greige-500: #96938d; --ref-color-sun-greige-600: #66645f; --ref-color-sun-greige-700: #4b4945; --ref-color-sun-greige-800: #222221; --ref-color-sun-greige-825: #1d1d1c; --ref-color-sun-greige-850: #191918; --ref-color-sun-greige-900: #151514; --ref-color-sun-greige-925: #111110; --ref-color-sun-greige-950: #121212; --ref-color-sun-greige-975: #0b0b0a; --ref-color-sun-alpha-ink-4: rgb(18 18 18 / 0.04); --ref-color-sun-alpha-ink-8: rgb(18 18 18 / 0.08); --ref-color-sun-alpha-ink-10: rgb(18 18 18 / 0.1); --ref-color-sun-alpha-ink-14: rgb(18 18 18 / 0.14); --ref-color-sun-alpha-ink-20: rgb(18 18 18 / 0.2); --ref-color-sun-alpha-ink-40: rgb(18 18 18 / 0.4); --ref-color-sun-alpha-ink-52: rgb(18 18 18 / 0.52); --ref-color-sun-alpha-carbon-16: rgb(20 20 20 / 0.16); --ref-color-sun-alpha-carbon-22: rgb(20 20 20 / 0.22);}
:root {--ref-color-ember-orange-50: #fff3ed; --ref-color-ember-orange-200: #ffb594; --ref-color-ember-orange-300: #ff8f66; --ref-color-ember-orange-400: #ff6a33; --ref-color-ember-orange-500: #ff4400; --ref-color-ember-orange-600: #e84000; --ref-color-ember-orange-700: #b33000; --ref-color-ember-orange-800: #8c2500; --ref-color-ember-yellow-50: #fef9e5; --ref-color-ember-yellow-100: #fdf1c4; --ref-color-ember-yellow-500: #eab305; --ref-color-ember-yellow-800: #7a5800; --ref-color-ember-yellow-900: #2c2306; --ref-color-ember-yellow-950: #211a05; --ref-color-ember-red-50: #fdeeee; --ref-color-ember-red-200: #f3b8b8; --ref-color-ember-red-300: #f08a8a; --ref-color-ember-red-400: #e85c5c; --ref-color-ember-red-600: #b00101; --ref-color-ember-red-700: #940101; --ref-color-ember-red-800: #6b0a0a; --ref-color-ember-red-950: #2b0707; --ref-color-ember-charcoal-25: #f8f7f5; --ref-color-ember-charcoal-50: #f2f1ee; --ref-color-ember-charcoal-75: #ecebe8; --ref-color-ember-charcoal-100: #e5e3df; --ref-color-ember-charcoal-300: #aaa59e; --ref-color-ember-charcoal-500: #9a948d; --ref-color-ember-charcoal-600: #67625c; --ref-color-ember-charcoal-700: #4b4743; --ref-color-ember-charcoal-800: #2c2a27; --ref-color-ember-charcoal-825: #252321; --ref-color-ember-charcoal-850: #1f1d1c; --ref-color-ember-charcoal-875: #1c1a19; --ref-color-ember-charcoal-900: #191817; --ref-color-ember-charcoal-925: #151413; --ref-color-ember-charcoal-950: #111111; --ref-color-ember-charcoal-975: #0b0b0a; --ref-color-ember-alpha-ink-4: rgb(17 17 17 / 0.04); --ref-color-ember-alpha-ink-8: rgb(17 17 17 / 0.08); --ref-color-ember-alpha-ink-14: rgb(17 17 17 / 0.14); --ref-color-ember-alpha-ink-40: rgb(17 17 17 / 0.4); --ref-color-ember-alpha-ink-52: rgb(17 17 17 / 0.52); --ref-color-ember-alpha-orange-12: rgb(255 68 0 / 0.12); --ref-color-ember-alpha-orange-24: rgb(255 68 0 / 0.24); --ref-color-ember-alpha-orange-ink-16: rgb(179 48 0 / 0.16); --ref-color-ember-alpha-yellow-12: rgb(234 179 5 / 0.12);}
:root {--ref-color-prism-graphite-25: #f6f6f4; --ref-color-prism-graphite-50: #f3f3f1; --ref-color-prism-graphite-75: #f2f2f0; --ref-color-prism-graphite-100: #ebebe8; --ref-color-prism-graphite-200: #d6d6d3; --ref-color-prism-graphite-300: #b8b8b4; --ref-color-prism-graphite-400: #a8a8a4; --ref-color-prism-graphite-500: #999995; --ref-color-prism-graphite-600: #6b6b68; --ref-color-prism-graphite-700: #4a4a48; --ref-color-prism-graphite-800: #303030; --ref-color-prism-graphite-825: #2b2b2b; --ref-color-prism-graphite-850: #2a2a2a; --ref-color-prism-graphite-875: #262626; --ref-color-prism-graphite-900: #242424; --ref-color-prism-graphite-925: #1e1e1e; --ref-color-prism-graphite-950: #161616; --ref-color-prism-graphite-975: #141414; --ref-color-prism-graphite-990: #0f0f0f; --ref-color-prism-blue-50: #e8f2f9; --ref-color-prism-blue-200: #b3d4ea; --ref-color-prism-blue-300: #64b5e8; --ref-color-prism-blue-500: #0075b5; --ref-color-prism-blue-700: #004588; --ref-color-prism-blue-800: #0b3558; --ref-color-prism-blue-950: #0b1a28; --ref-color-prism-green-50: #e9f6eb; --ref-color-prism-green-200: #b8e0be; --ref-color-prism-green-300: #6fcf7f; --ref-color-prism-green-500: #33a244; --ref-color-prism-green-700: #026d37; --ref-color-prism-green-800: #0f3d21; --ref-color-prism-green-950: #0c2014; --ref-color-prism-amber-50: #fff6e1; --ref-color-prism-amber-200: #fde0a6; --ref-color-prism-amber-300: #ffcb57; --ref-color-prism-amber-400: #feb415; --ref-color-prism-amber-600: #d8611d; --ref-color-prism-amber-700: #a6470e; --ref-color-prism-amber-800: #4d2a0c; --ref-color-prism-amber-950: #2a1a08; --ref-color-prism-red-50: #fdecec; --ref-color-prism-red-200: #f6b9bb; --ref-color-prism-red-300: #f57d82; --ref-color-prism-red-400: #f24a50; --ref-color-prism-red-500: #ee1c25; --ref-color-prism-red-700: #b01116; --ref-color-prism-red-800: #5a1214; --ref-color-prism-red-950: #2c0b0c; --ref-color-prism-purple-50: #f3eefb; --ref-color-prism-purple-300: #b493ec; --ref-color-prism-purple-500: #9257e0; --ref-color-prism-purple-700: #5a2a9e; --ref-color-prism-purple-950: #1b1228; --ref-color-prism-teal-50: #e5f5f4; --ref-color-prism-teal-300: #4fcdc4; --ref-color-prism-teal-500: #00a39a; --ref-color-prism-teal-700: #006a66; --ref-color-prism-teal-950: #081f1e; --ref-color-prism-alpha-ink-4: rgb(20 20 20 / 0.04); --ref-color-prism-alpha-ink-8: rgb(20 20 20 / 0.08); --ref-color-prism-alpha-ink-10: rgb(20 20 20 / 0.1); --ref-color-prism-alpha-ink-14: rgb(20 20 20 / 0.14); --ref-color-prism-alpha-ink-20: rgb(20 20 20 / 0.2); --ref-color-prism-alpha-ink-40: rgb(20 20 20 / 0.4); --ref-color-prism-alpha-ink-52: rgb(20 20 20 / 0.52);}
:root {--ref-color-crest-gold-50: #fcf6ee; --ref-color-crest-gold-100: #f9ecdb; --ref-color-crest-gold-200: #f5dcbd; --ref-color-crest-gold-300: #fbc18b; --ref-color-crest-gold-400: #f0ba82; --ref-color-crest-gold-500: #d5a76b; --ref-color-crest-gold-600: #b08e4c; --ref-color-crest-gold-700: #7d5e29; --ref-color-crest-gold-800: #5f4720; --ref-color-crest-gold-950: #261d10; --ref-color-crest-graphite-25: #f7f7f8; --ref-color-crest-graphite-50: #f1f1f2; --ref-color-crest-graphite-75: #ececed; --ref-color-crest-graphite-100: #e6e5e7; --ref-color-crest-graphite-300: #aeadb0; --ref-color-crest-graphite-500: #8e8d90; --ref-color-crest-graphite-600: #6a696c; --ref-color-crest-graphite-700: #414042; --ref-color-crest-graphite-800: #2c2b2d; --ref-color-crest-graphite-825: #252426; --ref-color-crest-graphite-850: #1f1e20; --ref-color-crest-graphite-875: #19181a; --ref-color-crest-graphite-900: #141315; --ref-color-crest-graphite-950: #111012; --ref-color-crest-graphite-975: #0b0b0c; --ref-color-crest-alpha-ink-4: rgb(17 16 18 / 0.04); --ref-color-crest-alpha-ink-8: rgb(17 16 18 / 0.08); --ref-color-crest-alpha-ink-10: rgb(17 16 18 / 0.1); --ref-color-crest-alpha-ink-14: rgb(17 16 18 / 0.14); --ref-color-crest-alpha-ink-20: rgb(17 16 18 / 0.2); --ref-color-crest-alpha-ink-40: rgb(17 16 18 / 0.4); --ref-color-crest-alpha-ink-52: rgb(17 16 18 / 0.52); --ref-color-crest-alpha-gold-10: rgb(240 186 130 / 0.1); --ref-color-crest-alpha-gold-22: rgb(240 186 130 / 0.22); --ref-color-crest-alpha-gold-ink-16: rgb(125 94 41 / 0.16);}
[data-palette="crest"],
[data-palette="crest"] [data-theme="light"] {--ds-color-surface: var(--ref-color-white); --ds-color-canvas: var(--ref-color-crest-graphite-25); --ds-color-raised: var(--ref-color-white); --ds-color-sunken: var(--ref-color-crest-graphite-50); --ds-color-well: var(--ref-color-crest-graphite-100); --ds-color-overlay: var(--ref-color-white); --ds-color-inverse: var(--ref-color-crest-graphite-950); --ds-color-text-1: var(--ref-color-crest-graphite-950); --ds-color-text-2: var(--ref-color-crest-graphite-700); --ds-color-text-3: var(--ref-color-crest-graphite-600); --ds-color-text-disabled: var(--ref-color-crest-graphite-300); --ds-color-text-inverse: var(--ref-color-crest-graphite-25); --ds-color-text-on-brand: var(--ref-color-crest-graphite-950); --ds-color-border-subtle: var(--ref-color-crest-alpha-ink-8); --ds-color-border-default: var(--ref-color-crest-alpha-ink-14); --ds-color-border-strong: var(--ref-color-crest-alpha-ink-52); --ds-color-focus: var(--ref-color-crest-graphite-950); --ds-color-brand: var(--ref-color-crest-gold-500); --ds-color-brand-hover: var(--ref-color-crest-gold-400); --ds-color-brand-active: var(--ref-color-crest-gold-600); --ds-color-brand-subtle: var(--ref-color-crest-gold-50); --ds-color-brand-line: var(--ref-color-crest-alpha-gold-ink-16); --ds-color-brand-ink: var(--ref-color-crest-gold-700); --ds-color-brand-edge: var(--ref-color-crest-gold-700); --ds-color-link: var(--ref-color-crest-gold-700); --ds-color-link-hover: var(--ref-color-crest-gold-800); --ds-color-logo-ink: var(--ref-color-crest-graphite-700); --ds-color-stage: var(--ref-color-crest-graphite-800); --ds-color-stage-raised: var(--ref-color-crest-graphite-700); --ds-color-stage-ink: var(--ref-color-crest-graphite-25); --ds-color-stage-ink-2: var(--ref-color-crest-graphite-300); --ds-color-stage-accent: var(--ref-color-crest-gold-400); --ds-color-stage-accent-hover: var(--ref-color-crest-gold-300); --ds-color-stage-accent-active: var(--ref-color-crest-gold-500); --ds-color-tag: var(--ref-color-crest-graphite-950); --ds-color-on-tag: var(--ref-color-crest-gold-400); --ds-color-success-on-solid: var(--ref-color-white); --ds-color-warning-on-solid: var(--ref-color-crest-graphite-950); --ds-color-danger-on-solid: var(--ref-color-white); --ds-color-info-on-solid: var(--ref-color-white); --ds-color-hover: var(--ref-color-crest-alpha-ink-4); --ds-color-pressed: var(--ref-color-crest-alpha-ink-8); --ds-color-scrim: var(--ref-color-crest-alpha-ink-40); --ds-color-chart-1: var(--ref-color-crest-gold-700); --ds-color-accent-vip-fill: var(--ref-color-crest-gold-700); --ds-color-accent-vip-ink: var(--ref-color-crest-gold-700); --ds-color-accent-vip-subtle: var(--ref-color-crest-gold-50); --ds-color-chart-area: var(--ref-color-crest-gold-400); --ds-color-inverse-action: var(--ds-color-brand); --ds-color-inverse-action-hover: var(--ds-color-brand-hover); --ds-color-inverse-action-active: var(--ds-color-brand-active); --ds-color-on-inverse-action: var(--ds-color-text-on-brand); --ds-color-on-stage-accent: var(--ref-color-crest-graphite-950); --ds-color-shadow-soft: var(--ref-color-crest-alpha-ink-10); --ds-color-shadow-deep: var(--ref-color-crest-alpha-ink-20);}
[data-palette="crest"][data-theme="dark"],
[data-palette="crest"] [data-theme="dark"] {--ds-color-surface: var(--ref-color-crest-graphite-975); --ds-color-canvas: var(--ref-color-crest-graphite-900); --ds-color-raised: var(--ref-color-crest-graphite-875); --ds-color-sunken: var(--ref-color-crest-graphite-850); --ds-color-well: var(--ref-color-crest-graphite-800); --ds-color-overlay: var(--ref-color-crest-graphite-825); --ds-color-inverse: var(--ref-color-crest-graphite-75); --ds-color-text-1: var(--ref-color-crest-graphite-75); --ds-color-text-2: var(--ref-color-crest-graphite-300); --ds-color-text-3: var(--ref-color-crest-graphite-500); --ds-color-text-disabled: var(--ref-color-crest-graphite-700); --ds-color-text-inverse: var(--ref-color-crest-graphite-950); --ds-color-text-on-brand: var(--ref-color-crest-graphite-950); --ds-color-border-subtle: var(--ref-color-alpha-paper-8); --ds-color-border-default: var(--ref-color-alpha-paper-14); --ds-color-border-strong: var(--ref-color-alpha-paper-40); --ds-color-focus: var(--ref-color-crest-gold-400); --ds-color-brand: var(--ref-color-crest-gold-400); --ds-color-brand-hover: var(--ref-color-crest-gold-300); --ds-color-brand-active: var(--ref-color-crest-gold-500); --ds-color-brand-subtle: var(--ref-color-crest-alpha-gold-10); --ds-color-brand-line: var(--ref-color-crest-alpha-gold-22); --ds-color-brand-ink: var(--ref-color-crest-gold-400); --ds-color-brand-edge: var(--ref-color-crest-gold-400); --ds-color-link: var(--ref-color-crest-gold-400); --ds-color-link-hover: var(--ref-color-crest-gold-300); --ds-color-logo-ink: var(--ref-color-crest-graphite-75); --ds-color-stage: var(--ref-color-crest-graphite-850); --ds-color-stage-raised: var(--ref-color-crest-graphite-800); --ds-color-stage-ink: var(--ref-color-crest-graphite-25); --ds-color-stage-ink-2: var(--ref-color-crest-graphite-300); --ds-color-stage-accent: var(--ref-color-crest-gold-400); --ds-color-stage-accent-hover: var(--ref-color-crest-gold-300); --ds-color-stage-accent-active: var(--ref-color-crest-gold-500); --ds-color-tag: var(--ref-color-crest-graphite-950); --ds-color-on-tag: var(--ref-color-crest-gold-400); --ds-color-success-on-solid: var(--ref-color-crest-graphite-950); --ds-color-warning-on-solid: var(--ref-color-crest-graphite-950); --ds-color-danger-on-solid: var(--ref-color-crest-graphite-950); --ds-color-info-on-solid: var(--ref-color-crest-graphite-950); --ds-color-hover: var(--ref-color-alpha-paper-6); --ds-color-pressed: var(--ref-color-alpha-paper-12); --ds-color-scrim: var(--ref-color-alpha-black-70); --ds-color-chart-1: var(--ref-color-crest-gold-400); --ds-color-accent-vip-fill: var(--ref-color-crest-gold-400); --ds-color-accent-vip-ink: var(--ref-color-crest-gold-400); --ds-color-accent-vip-subtle: var(--ref-color-crest-gold-950); --ds-color-chart-area: var(--ref-color-crest-gold-400); --ds-color-inverse-action: var(--ref-color-crest-graphite-800); --ds-color-inverse-action-hover: var(--ref-color-crest-graphite-825); --ds-color-inverse-action-active: var(--ref-color-crest-graphite-850); --ds-color-on-inverse-action: var(--ref-color-crest-graphite-25); --ds-color-on-stage-accent: var(--ref-color-crest-graphite-950); --ds-color-shadow-soft: var(--ref-color-alpha-black-40); --ds-color-shadow-deep: var(--ref-color-alpha-black-70);}
@media (prefers-color-scheme: dark) {
[data-palette="crest"]:not([data-theme]) {--ds-color-surface: var(--ref-color-crest-graphite-975); --ds-color-canvas: var(--ref-color-crest-graphite-900); --ds-color-raised: var(--ref-color-crest-graphite-875); --ds-color-sunken: var(--ref-color-crest-graphite-850); --ds-color-well: var(--ref-color-crest-graphite-800); --ds-color-overlay: var(--ref-color-crest-graphite-825); --ds-color-inverse: var(--ref-color-crest-graphite-75); --ds-color-text-1: var(--ref-color-crest-graphite-75); --ds-color-text-2: var(--ref-color-crest-graphite-300); --ds-color-text-3: var(--ref-color-crest-graphite-500); --ds-color-text-disabled: var(--ref-color-crest-graphite-700); --ds-color-text-inverse: var(--ref-color-crest-graphite-950); --ds-color-text-on-brand: var(--ref-color-crest-graphite-950); --ds-color-border-subtle: var(--ref-color-alpha-paper-8); --ds-color-border-default: var(--ref-color-alpha-paper-14); --ds-color-border-strong: var(--ref-color-alpha-paper-40); --ds-color-focus: var(--ref-color-crest-gold-400); --ds-color-brand: var(--ref-color-crest-gold-400); --ds-color-brand-hover: var(--ref-color-crest-gold-300); --ds-color-brand-active: var(--ref-color-crest-gold-500); --ds-color-brand-subtle: var(--ref-color-crest-alpha-gold-10); --ds-color-brand-line: var(--ref-color-crest-alpha-gold-22); --ds-color-brand-ink: var(--ref-color-crest-gold-400); --ds-color-brand-edge: var(--ref-color-crest-gold-400); --ds-color-link: var(--ref-color-crest-gold-400); --ds-color-link-hover: var(--ref-color-crest-gold-300); --ds-color-logo-ink: var(--ref-color-crest-graphite-75); --ds-color-stage: var(--ref-color-crest-graphite-850); --ds-color-stage-raised: var(--ref-color-crest-graphite-800); --ds-color-stage-ink: var(--ref-color-crest-graphite-25); --ds-color-stage-ink-2: var(--ref-color-crest-graphite-300); --ds-color-stage-accent: var(--ref-color-crest-gold-400); --ds-color-stage-accent-hover: var(--ref-color-crest-gold-300); --ds-color-stage-accent-active: var(--ref-color-crest-gold-500); --ds-color-tag: var(--ref-color-crest-graphite-950); --ds-color-on-tag: var(--ref-color-crest-gold-400); --ds-color-success-on-solid: var(--ref-color-crest-graphite-950); --ds-color-warning-on-solid: var(--ref-color-crest-graphite-950); --ds-color-danger-on-solid: var(--ref-color-crest-graphite-950); --ds-color-info-on-solid: var(--ref-color-crest-graphite-950); --ds-color-hover: var(--ref-color-alpha-paper-6); --ds-color-pressed: var(--ref-color-alpha-paper-12); --ds-color-scrim: var(--ref-color-alpha-black-70); --ds-color-chart-1: var(--ref-color-crest-gold-400); --ds-color-accent-vip-fill: var(--ref-color-crest-gold-400); --ds-color-accent-vip-ink: var(--ref-color-crest-gold-400); --ds-color-accent-vip-subtle: var(--ref-color-crest-gold-950); --ds-color-chart-area: var(--ref-color-crest-gold-400); --ds-color-inverse-action: var(--ref-color-crest-graphite-800); --ds-color-inverse-action-hover: var(--ref-color-crest-graphite-825); --ds-color-inverse-action-active: var(--ref-color-crest-graphite-850); --ds-color-on-inverse-action: var(--ref-color-crest-graphite-25); --ds-color-on-stage-accent: var(--ref-color-crest-graphite-950); --ds-color-shadow-soft: var(--ref-color-alpha-black-40); --ds-color-shadow-deep: var(--ref-color-alpha-black-70);}
}
[data-palette="crest"] [data-theme-area="link-field"] {color-scheme: light; --ds-color-surface: var(--ref-color-white); --ds-color-canvas: var(--ref-color-crest-graphite-25); --ds-color-raised: var(--ref-color-white); --ds-color-sunken: var(--ref-color-crest-graphite-50); --ds-color-well: var(--ref-color-crest-graphite-100); --ds-color-overlay: var(--ref-color-white); --ds-color-inverse: var(--ref-color-crest-graphite-950); --ds-color-text-1: var(--ref-color-crest-graphite-950); --ds-color-text-2: var(--ref-color-crest-graphite-700); --ds-color-text-3: var(--ref-color-crest-graphite-600); --ds-color-text-disabled: var(--ref-color-crest-graphite-300); --ds-color-text-inverse: var(--ref-color-crest-graphite-25); --ds-color-text-on-brand: var(--ref-color-crest-graphite-950); --ds-color-border-subtle: var(--ref-color-crest-alpha-ink-8); --ds-color-border-default: var(--ref-color-crest-alpha-ink-14); --ds-color-border-strong: var(--ref-color-crest-alpha-ink-52); --ds-color-focus: var(--ref-color-crest-graphite-950); --ds-color-brand: var(--ref-color-crest-gold-500); --ds-color-brand-hover: var(--ref-color-crest-gold-400); --ds-color-brand-active: var(--ref-color-crest-gold-600); --ds-color-brand-subtle: var(--ref-color-crest-gold-50); --ds-color-brand-line: var(--ref-color-crest-alpha-gold-ink-16); --ds-color-brand-ink: var(--ref-color-crest-gold-700); --ds-color-brand-edge: var(--ref-color-crest-gold-700); --ds-color-link: var(--ref-color-crest-gold-700); --ds-color-link-hover: var(--ref-color-crest-gold-800); --ds-color-logo-ink: var(--ref-color-crest-graphite-700); --ds-color-stage: var(--ref-color-crest-graphite-800); --ds-color-stage-raised: var(--ref-color-crest-graphite-700); --ds-color-stage-ink: var(--ref-color-crest-graphite-25); --ds-color-stage-ink-2: var(--ref-color-crest-graphite-300); --ds-color-stage-line: var(--ref-color-alpha-paper-14); --ds-color-stage-accent: var(--ref-color-crest-gold-400); --ds-color-stage-accent-hover: var(--ref-color-crest-gold-300); --ds-color-stage-accent-active: var(--ref-color-crest-gold-500); --ds-color-tag: var(--ref-color-crest-graphite-950); --ds-color-on-tag: var(--ref-color-crest-gold-400); --ds-color-star: var(--ref-color-amber-400); --ds-color-success-fg: var(--ref-color-emerald-700); --ds-color-success-bg: var(--ref-color-emerald-50); --ds-color-success-border: var(--ref-color-emerald-200); --ds-color-success-solid: var(--ref-color-emerald-600); --ds-color-success-on-solid: var(--ref-color-white); --ds-color-warning-fg: var(--ref-color-amber-700); --ds-color-warning-bg: var(--ref-color-amber-50); --ds-color-warning-border: var(--ref-color-amber-200); --ds-color-warning-solid: var(--ref-color-amber-400); --ds-color-warning-on-solid: var(--ref-color-crest-graphite-950); --ds-color-danger-fg: var(--ref-color-crimson-700); --ds-color-danger-bg: var(--ref-color-crimson-50); --ds-color-danger-border: var(--ref-color-crimson-200); --ds-color-danger-solid: var(--ref-color-crimson-600); --ds-color-danger-on-solid: var(--ref-color-white); --ds-color-info-fg: var(--ref-color-lapis-700); --ds-color-info-bg: var(--ref-color-lapis-50); --ds-color-info-border: var(--ref-color-lapis-200); --ds-color-info-solid: var(--ref-color-lapis-600); --ds-color-info-on-solid: var(--ref-color-white); --ds-color-hover: var(--ref-color-crest-alpha-ink-4); --ds-color-pressed: var(--ref-color-crest-alpha-ink-8); --ds-color-scrim: var(--ref-color-crest-alpha-ink-40); --ds-color-debug-grid: var(--ref-color-alpha-crimson-16); --ds-color-debug-grid-strong: var(--ref-color-alpha-crimson-32); --ds-color-chart-1: var(--ref-color-crest-gold-700); --ds-color-chart-2: var(--ref-color-lapis-600); --ds-color-chart-3: var(--ref-color-amber-600); --ds-color-chart-4: var(--ref-color-amethyst-600); --ds-color-chart-5: var(--ref-color-turquoise-700); --ds-color-chart-6: var(--ref-color-crimson-600); --ds-color-accent-vip-fill: var(--ref-color-crest-gold-700); --ds-color-accent-vip-ink: var(--ref-color-crest-gold-700); --ds-color-accent-vip-subtle: var(--ref-color-crest-gold-50); --ds-color-accent-wholesale-fill: var(--ref-color-kraft-500); --ds-color-accent-wholesale-ink: var(--ref-color-kraft-700); --ds-color-accent-wholesale-subtle: var(--ref-color-kraft-100); --ds-color-accent-luxury-fill: var(--ref-color-amethyst-600); --ds-color-accent-luxury-ink: var(--ref-color-amethyst-700); --ds-color-accent-luxury-subtle: var(--ref-color-amethyst-50); --ds-color-accent-tech-fill: var(--ref-color-turquoise-600); --ds-color-accent-tech-ink: var(--ref-color-turquoise-700); --ds-color-accent-tech-subtle: var(--ref-color-turquoise-50); --ds-color-accent-supermarket-fill: var(--ref-color-lime-700); --ds-color-accent-supermarket-ink: var(--ref-color-lime-800); --ds-color-accent-supermarket-subtle: var(--ref-color-lime-100); --ds-color-selected-nav: var(--ds-color-brand-subtle); --ds-color-selected-nav-icon: var(--ds-color-brand-ink); --ds-color-selected-segment: var(--ds-color-raised); --ds-color-selected-segment-line: var(--ds-color-border-default); --ds-color-selected-shell: var(--ds-color-sunken); --ds-color-selected-chip: var(--ds-color-inverse); --ds-color-selected-mark: var(--ds-color-brand); --ds-color-selected-mark-ring: var(--ds-color-brand-line); --ds-color-selected-mark-ring-2: var(--ref-color-transparent); --ds-color-selected-subtle: var(--ds-color-brand-subtle); --ds-color-on-selected: var(--ds-color-text-1); --ds-color-on-selected-chip: var(--ds-color-text-inverse); --ds-color-on-selected-mark: var(--ds-color-text-on-brand); --ds-color-spotlight: var(--ds-color-brand-subtle); --ds-color-track: var(--ds-color-well); --ds-color-track-bar: var(--ds-color-sunken); --ds-color-chart-area: var(--ref-color-crest-gold-400); --ds-color-inverse-action: var(--ds-color-brand); --ds-color-inverse-action-hover: var(--ds-color-brand-hover); --ds-color-inverse-action-active: var(--ds-color-brand-active); --ds-color-on-inverse-action: var(--ds-color-text-on-brand); --ds-color-stat-hero: var(--ds-color-raised); --ds-color-stat-hero-line: var(--ds-color-border-subtle); --ds-color-stat-hero-ink: var(--ds-color-text-1); --ds-color-stat-hero-ink-2: var(--ds-color-text-2); --ds-color-stat-hero-ink-3: var(--ds-color-text-3); --ds-color-stat-hero-tile: var(--ds-color-sunken); --ds-color-stat-hero-tile-line: var(--ds-color-border-subtle); --ds-color-stat-hero-icon: var(--ds-color-text-1); --ds-color-link-field: var(--ds-color-stage-ink); --ds-color-link-field-line: var(--ref-color-transparent); --ds-color-state-done-fill: var(--ds-color-success-solid); --ds-color-state-done-on-fill: var(--ds-color-success-on-solid); --ds-color-state-done-ink: var(--ds-color-success-fg); --ds-color-state-done-subtle: var(--ds-color-success-bg); --ds-color-state-done-line: var(--ds-color-success-border); --ds-color-state-underway-fill: var(--ds-color-info-solid); --ds-color-state-underway-on-fill: var(--ds-color-info-on-solid); --ds-color-state-underway-ink: var(--ds-color-info-fg); --ds-color-state-underway-subtle: var(--ds-color-info-bg); --ds-color-state-underway-line: var(--ds-color-info-border); --ds-color-state-pending-fill: var(--ds-color-warning-solid); --ds-color-state-pending-on-fill: var(--ds-color-warning-on-solid); --ds-color-state-pending-ink: var(--ds-color-warning-fg); --ds-color-state-pending-subtle: var(--ds-color-warning-bg); --ds-color-state-pending-line: var(--ds-color-warning-border); --ds-color-state-stopped-fill: var(--ds-color-danger-solid); --ds-color-state-stopped-on-fill: var(--ds-color-danger-on-solid); --ds-color-state-stopped-ink: var(--ds-color-danger-fg); --ds-color-state-stopped-subtle: var(--ds-color-danger-bg); --ds-color-state-stopped-line: var(--ds-color-danger-border); --ds-color-state-idle-fill: var(--ds-color-text-3); --ds-color-state-idle-on-fill: var(--ds-color-surface); --ds-color-state-idle-ink: var(--ds-color-text-2); --ds-color-state-idle-subtle: var(--ds-color-sunken); --ds-color-state-idle-line: var(--ds-color-border-subtle); --ds-color-dept-ship: var(--ref-color-transparent); --ds-color-dept-ship-ink: var(--ds-color-text-3); --ds-color-dept-ship-subtle: var(--ref-color-transparent); --ds-color-dept-finance: var(--ref-color-transparent); --ds-color-dept-finance-ink: var(--ds-color-text-3); --ds-color-dept-finance-subtle: var(--ref-color-transparent); --ds-color-dept-support: var(--ref-color-transparent); --ds-color-dept-support-ink: var(--ds-color-text-3); --ds-color-dept-support-subtle: var(--ref-color-transparent); --ds-color-dept-catalog: var(--ref-color-transparent); --ds-color-dept-catalog-ink: var(--ds-color-text-3); --ds-color-dept-catalog-subtle: var(--ref-color-transparent); --ds-color-dept-marketing: var(--ref-color-transparent); --ds-color-dept-marketing-ink: var(--ds-color-text-3); --ds-color-dept-marketing-subtle: var(--ref-color-transparent); --ds-color-dept-security: var(--ref-color-transparent); --ds-color-dept-security-ink: var(--ds-color-text-3); --ds-color-dept-security-subtle: var(--ref-color-transparent); --ds-color-on-stage-accent: var(--ref-color-crest-graphite-950); --ds-color-shadow-soft: var(--ref-color-crest-alpha-ink-10); --ds-color-shadow-deep: var(--ref-color-crest-alpha-ink-20); --ds-shadow-flat: 0 0 0 1px var(--ds-color-border-subtle); --ds-shadow-resting: 0 1px 2px 0 var(--ref-color-alpha-ink-6), 0 1px 1px 0 var(--ref-color-alpha-ink-4); --ds-shadow-raised: 0 0 0 1px var(--ds-color-border-subtle), 0 1px 2px 0 var(--ref-color-alpha-ink-6), 0 1px 1px 0 var(--ref-color-alpha-ink-4); --ds-shadow-floating: 0 1px 2px 0 var(--ref-color-alpha-ink-6), 0 8px 16px -6px var(--ref-color-alpha-ink-10), 0 24px 48px -12px var(--ref-color-alpha-ink-20); --ds-shadow-overlay: 0 0 0 1px var(--ds-color-border-subtle), 0 1px 2px 0 var(--ref-color-alpha-ink-6), 0 8px 16px -6px var(--ref-color-alpha-ink-10), 0 24px 48px -12px var(--ref-color-alpha-ink-20); --ds-shadow-modal: 0 0 0 1px var(--ds-color-border-subtle), 0 12px 24px -8px var(--ref-color-alpha-ink-10), 0 32px 64px -16px var(--ref-color-alpha-ink-20);}
[data-palette="crest"] [data-theme-area="stage-actions"] {color-scheme: dark; --ds-color-surface: var(--ref-color-crest-graphite-975); --ds-color-canvas: var(--ref-color-crest-graphite-900); --ds-color-raised: var(--ref-color-crest-graphite-875); --ds-color-sunken: var(--ref-color-crest-graphite-850); --ds-color-well: var(--ref-color-crest-graphite-800); --ds-color-overlay: var(--ref-color-crest-graphite-825); --ds-color-inverse: var(--ref-color-crest-graphite-75); --ds-color-text-1: var(--ref-color-crest-graphite-75); --ds-color-text-2: var(--ref-color-crest-graphite-300); --ds-color-text-3: var(--ref-color-crest-graphite-500); --ds-color-text-disabled: var(--ref-color-crest-graphite-700); --ds-color-text-inverse: var(--ref-color-crest-graphite-950); --ds-color-text-on-brand: var(--ref-color-crest-graphite-950); --ds-color-border-subtle: var(--ref-color-alpha-paper-8); --ds-color-border-default: var(--ref-color-alpha-paper-14); --ds-color-border-strong: var(--ref-color-alpha-paper-40); --ds-color-focus: var(--ref-color-crest-gold-400); --ds-color-brand: var(--ref-color-crest-gold-400); --ds-color-brand-hover: var(--ref-color-crest-gold-300); --ds-color-brand-active: var(--ref-color-crest-gold-500); --ds-color-brand-subtle: var(--ref-color-crest-alpha-gold-10); --ds-color-brand-line: var(--ref-color-crest-alpha-gold-22); --ds-color-brand-ink: var(--ref-color-crest-gold-400); --ds-color-brand-edge: var(--ref-color-crest-gold-400); --ds-color-link: var(--ref-color-crest-gold-400); --ds-color-link-hover: var(--ref-color-crest-gold-300); --ds-color-logo-ink: var(--ref-color-crest-graphite-75); --ds-color-stage: var(--ref-color-crest-graphite-850); --ds-color-stage-raised: var(--ref-color-crest-graphite-800); --ds-color-stage-ink: var(--ref-color-crest-graphite-25); --ds-color-stage-ink-2: var(--ref-color-crest-graphite-300); --ds-color-stage-line: var(--ref-color-alpha-paper-12); --ds-color-stage-accent: var(--ref-color-crest-gold-400); --ds-color-stage-accent-hover: var(--ref-color-crest-gold-300); --ds-color-stage-accent-active: var(--ref-color-crest-gold-500); --ds-color-tag: var(--ref-color-crest-graphite-950); --ds-color-on-tag: var(--ref-color-crest-gold-400); --ds-color-star: var(--ref-color-amber-300); --ds-color-success-fg: var(--ref-color-emerald-300); --ds-color-success-bg: var(--ref-color-emerald-950); --ds-color-success-border: var(--ref-color-emerald-800); --ds-color-success-solid: var(--ref-color-emerald-400); --ds-color-success-on-solid: var(--ref-color-crest-graphite-950); --ds-color-warning-fg: var(--ref-color-amber-300); --ds-color-warning-bg: var(--ref-color-amber-950); --ds-color-warning-border: var(--ref-color-amber-800); --ds-color-warning-solid: var(--ref-color-amber-400); --ds-color-warning-on-solid: var(--ref-color-crest-graphite-950); --ds-color-danger-fg: var(--ref-color-crimson-300); --ds-color-danger-bg: var(--ref-color-crimson-950); --ds-color-danger-border: var(--ref-color-crimson-800); --ds-color-danger-solid: var(--ref-color-crimson-400); --ds-color-danger-on-solid: var(--ref-color-crest-graphite-950); --ds-color-info-fg: var(--ref-color-lapis-300); --ds-color-info-bg: var(--ref-color-lapis-950); --ds-color-info-border: var(--ref-color-lapis-800); --ds-color-info-solid: var(--ref-color-lapis-400); --ds-color-info-on-solid: var(--ref-color-crest-graphite-950); --ds-color-hover: var(--ref-color-alpha-paper-6); --ds-color-pressed: var(--ref-color-alpha-paper-12); --ds-color-scrim: var(--ref-color-alpha-black-70); --ds-color-debug-grid: var(--ref-color-alpha-crimson-16); --ds-color-debug-grid-strong: var(--ref-color-alpha-crimson-32); --ds-color-chart-1: var(--ref-color-crest-gold-400); --ds-color-chart-2: var(--ref-color-lapis-400); --ds-color-chart-3: var(--ref-color-amber-400); --ds-color-chart-4: var(--ref-color-amethyst-400); --ds-color-chart-5: var(--ref-color-turquoise-400); --ds-color-chart-6: var(--ref-color-crimson-400); --ds-color-accent-vip-fill: var(--ref-color-crest-gold-400); --ds-color-accent-vip-ink: var(--ref-color-crest-gold-400); --ds-color-accent-vip-subtle: var(--ref-color-crest-gold-950); --ds-color-accent-wholesale-fill: var(--ref-color-kraft-400); --ds-color-accent-wholesale-ink: var(--ref-color-kraft-300); --ds-color-accent-wholesale-subtle: var(--ref-color-kraft-950); --ds-color-accent-luxury-fill: var(--ref-color-amethyst-400); --ds-color-accent-luxury-ink: var(--ref-color-amethyst-300); --ds-color-accent-luxury-subtle: var(--ref-color-amethyst-950); --ds-color-accent-tech-fill: var(--ref-color-turquoise-400); --ds-color-accent-tech-ink: var(--ref-color-turquoise-300); --ds-color-accent-tech-subtle: var(--ref-color-turquoise-950); --ds-color-accent-supermarket-fill: var(--ref-color-lime-300); --ds-color-accent-supermarket-ink: var(--ref-color-lime-300); --ds-color-accent-supermarket-subtle: var(--ref-color-lime-950); --ds-color-selected-nav: var(--ds-color-brand-subtle); --ds-color-selected-nav-icon: var(--ds-color-brand-ink); --ds-color-selected-segment: var(--ds-color-raised); --ds-color-selected-segment-line: var(--ds-color-border-default); --ds-color-selected-shell: var(--ds-color-sunken); --ds-color-selected-chip: var(--ds-color-inverse); --ds-color-selected-mark: var(--ds-color-brand); --ds-color-selected-mark-ring: var(--ds-color-brand-line); --ds-color-selected-mark-ring-2: var(--ref-color-transparent); --ds-color-selected-subtle: var(--ds-color-brand-subtle); --ds-color-on-selected: var(--ds-color-text-1); --ds-color-on-selected-chip: var(--ds-color-text-inverse); --ds-color-on-selected-mark: var(--ds-color-text-on-brand); --ds-color-spotlight: var(--ds-color-brand-subtle); --ds-color-track: var(--ds-color-well); --ds-color-track-bar: var(--ds-color-sunken); --ds-color-chart-area: var(--ref-color-crest-gold-400); --ds-color-inverse-action: var(--ref-color-crest-graphite-800); --ds-color-inverse-action-hover: var(--ref-color-crest-graphite-825); --ds-color-inverse-action-active: var(--ref-color-crest-graphite-850); --ds-color-on-inverse-action: var(--ref-color-crest-graphite-25); --ds-color-stat-hero: var(--ds-color-raised); --ds-color-stat-hero-line: var(--ds-color-border-subtle); --ds-color-stat-hero-ink: var(--ds-color-text-1); --ds-color-stat-hero-ink-2: var(--ds-color-text-2); --ds-color-stat-hero-ink-3: var(--ds-color-text-3); --ds-color-stat-hero-tile: var(--ds-color-sunken); --ds-color-stat-hero-tile-line: var(--ds-color-border-subtle); --ds-color-stat-hero-icon: var(--ds-color-text-1); --ds-color-link-field: var(--ds-color-raised); --ds-color-link-field-line: var(--ref-color-transparent); --ds-color-state-done-fill: var(--ds-color-success-solid); --ds-color-state-done-on-fill: var(--ds-color-success-on-solid); --ds-color-state-done-ink: var(--ds-color-success-fg); --ds-color-state-done-subtle: var(--ds-color-success-bg); --ds-color-state-done-line: var(--ds-color-success-border); --ds-color-state-underway-fill: var(--ds-color-info-solid); --ds-color-state-underway-on-fill: var(--ds-color-info-on-solid); --ds-color-state-underway-ink: var(--ds-color-info-fg); --ds-color-state-underway-subtle: var(--ds-color-info-bg); --ds-color-state-underway-line: var(--ds-color-info-border); --ds-color-state-pending-fill: var(--ds-color-warning-solid); --ds-color-state-pending-on-fill: var(--ds-color-warning-on-solid); --ds-color-state-pending-ink: var(--ds-color-warning-fg); --ds-color-state-pending-subtle: var(--ds-color-warning-bg); --ds-color-state-pending-line: var(--ds-color-warning-border); --ds-color-state-stopped-fill: var(--ds-color-danger-solid); --ds-color-state-stopped-on-fill: var(--ds-color-danger-on-solid); --ds-color-state-stopped-ink: var(--ds-color-danger-fg); --ds-color-state-stopped-subtle: var(--ds-color-danger-bg); --ds-color-state-stopped-line: var(--ds-color-danger-border); --ds-color-state-idle-fill: var(--ds-color-text-3); --ds-color-state-idle-on-fill: var(--ds-color-surface); --ds-color-state-idle-ink: var(--ds-color-text-2); --ds-color-state-idle-subtle: var(--ds-color-sunken); --ds-color-state-idle-line: var(--ds-color-border-subtle); --ds-color-dept-ship: var(--ref-color-transparent); --ds-color-dept-ship-ink: var(--ds-color-text-3); --ds-color-dept-ship-subtle: var(--ref-color-transparent); --ds-color-dept-finance: var(--ref-color-transparent); --ds-color-dept-finance-ink: var(--ds-color-text-3); --ds-color-dept-finance-subtle: var(--ref-color-transparent); --ds-color-dept-support: var(--ref-color-transparent); --ds-color-dept-support-ink: var(--ds-color-text-3); --ds-color-dept-support-subtle: var(--ref-color-transparent); --ds-color-dept-catalog: var(--ref-color-transparent); --ds-color-dept-catalog-ink: var(--ds-color-text-3); --ds-color-dept-catalog-subtle: var(--ref-color-transparent); --ds-color-dept-marketing: var(--ref-color-transparent); --ds-color-dept-marketing-ink: var(--ds-color-text-3); --ds-color-dept-marketing-subtle: var(--ref-color-transparent); --ds-color-dept-security: var(--ref-color-transparent); --ds-color-dept-security-ink: var(--ds-color-text-3); --ds-color-dept-security-subtle: var(--ref-color-transparent); --ds-color-on-stage-accent: var(--ref-color-crest-graphite-950); --ds-color-shadow-soft: var(--ref-color-alpha-black-40); --ds-color-shadow-deep: var(--ref-color-alpha-black-70); --ds-shadow-flat: 0 0 0 1px var(--ds-color-border-subtle); --ds-shadow-resting: 0 1px 2px 0 var(--ref-color-alpha-black-40); --ds-shadow-raised: 0 0 0 1px var(--ds-color-border-subtle), 0 1px 2px 0 var(--ref-color-alpha-black-40); --ds-shadow-floating: 0 1px 2px 0 var(--ref-color-alpha-black-40), 0 24px 48px -12px var(--ref-color-alpha-black-70), inset 0 0 0 1px var(--ds-color-border-default); --ds-shadow-overlay: 0 0 0 1px var(--ds-color-border-default), 0 1px 2px 0 var(--ref-color-alpha-black-40), 0 24px 48px -12px var(--ref-color-alpha-black-70); --ds-shadow-modal: 0 0 0 1px var(--ds-color-border-default), 0 32px 64px -16px var(--ref-color-alpha-black-70);}
:root {--ds-spring-snap-stiffness: 700; --ds-spring-snap-damping: 48; --ds-spring-snap-mass: 1; --ds-spring-snap-duration: 305ms; --ds-spring-snap-easing: linear(0, 0.0128, 0.0462, 0.094, 0.1512, 0.2141, 0.2795, 0.3452, 0.4096, 0.4714, 0.5298, 0.5842, 0.6345, 0.6804, 0.722, 0.7595, 0.7929, 0.8226, 0.8488, 0.8718, 0.8918, 0.9092, 0.9243, 0.9372, 0.9483, 0.9577, 0.9656, 0.9723, 0.9779, 0.9826, 0.9865, 0.9897, 0.9923, 0.9944, 0.996, 0.9974, 0.9984, 0.9993, 0.9999, 1.0003, 1.0007, 1.0009, 1.001, 1.0011, 1.0011, 1.0011, 1.0011, 1.0011, 1); --ds-spring-lift-stiffness: 420; --ds-spring-lift-damping: 36; --ds-spring-lift-mass: 1; --ds-spring-lift-duration: 424ms; --ds-spring-lift-easing: linear(0, 0.0147, 0.053, 0.1074, 0.172, 0.2421, 0.3144, 0.3862, 0.4556, 0.5213, 0.5825, 0.6388, 0.6898, 0.7356, 0.7764, 0.8123, 0.8437, 0.8709, 0.8943, 0.9143, 0.9312, 0.9455, 0.9574, 0.9672, 0.9753, 0.9819, 0.9872, 0.9914, 0.9947, 0.9972, 0.9992, 1.0006, 1.0016, 1.0023, 1.0028, 1.003, 1.0031, 1.0031, 1.003, 1.0028, 1.0026, 1.0024, 1.0022, 1.002, 1.0018, 1.0016, 1.0014, 1.0012, 1); --ds-spring-glide-stiffness: 380; --ds-spring-glide-damping: 34; --ds-spring-glide-mass: 1; --ds-spring-glide-duration: 448ms; --ds-spring-glide-easing: linear(0, 0.0149, 0.0536, 0.1085, 0.1738, 0.2446, 0.3176, 0.39, 0.46, 0.5262, 0.5879, 0.6444, 0.6956, 0.7415, 0.7822, 0.818, 0.8493, 0.8763, 0.8994, 0.9191, 0.9358, 0.9497, 0.9612, 0.9708, 0.9785, 0.9848, 0.9898, 0.9937, 0.9967, 0.999, 1.0007, 1.0019, 1.0028, 1.0033, 1.0036, 1.0037, 1.0037, 1.0036, 1.0034, 1.0031, 1.0029, 1.0026, 1.0023, 1.0021, 1.0018, 1.0016, 1.0014, 1.0012, 1); --ds-spring-lead-stiffness: 560; --ds-spring-lead-damping: 44; --ds-spring-lead-mass: 1; --ds-spring-lead-duration: 291ms; --ds-spring-lead-easing: linear(0, 0.0094, 0.0345, 0.0711, 0.1159, 0.1662, 0.2197, 0.2748, 0.33, 0.3844, 0.4372, 0.4877, 0.5357, 0.5808, 0.6229, 0.662, 0.698, 0.731, 0.7611, 0.7885, 0.8133, 0.8357, 0.8557, 0.8737, 0.8898, 0.9041, 0.9167, 0.9279, 0.9378, 0.9465, 0.9541, 0.9608, 0.9666, 0.9716, 0.976, 0.9798, 0.9831, 0.9859, 0.9883, 0.9903, 0.9921, 0.9936, 0.9948, 0.9959, 0.9967, 0.9975, 0.9981, 0.9986, 1); --ds-spring-trail-stiffness: 260; --ds-spring-trail-damping: 30; --ds-spring-trail-mass: 1; --ds-spring-trail-duration: 428ms; --ds-spring-trail-easing: linear(0, 0.0095, 0.0346, 0.0714, 0.1163, 0.1667, 0.2203, 0.2755, 0.3309, 0.3853, 0.4381, 0.4887, 0.5367, 0.5818, 0.6239, 0.6629, 0.6989, 0.7319, 0.762, 0.7893, 0.814, 0.8363, 0.8564, 0.8743, 0.8903, 0.9045, 0.9171, 0.9283, 0.9381, 0.9468, 0.9544, 0.961, 0.9668, 0.9718, 0.9761, 0.9799, 0.9832, 0.9859, 0.9883, 0.9904, 0.9921, 0.9936, 0.9948, 0.9959, 0.9967, 0.9975, 0.9981, 0.9986, 1); --ds-spring-settle-stiffness: 170; --ds-spring-settle-damping: 26; --ds-spring-settle-mass: 1; --ds-spring-settle-duration: 701ms; --ds-spring-settle-easing: linear(0, 0.016, 0.0565, 0.1126, 0.1777, 0.2469, 0.317, 0.3854, 0.4507, 0.5119, 0.5684, 0.6201, 0.6669, 0.7089, 0.7464, 0.7796, 0.809, 0.8349, 0.8575, 0.8773, 0.8945, 0.9095, 0.9224, 0.9336, 0.9433, 0.9516, 0.9587, 0.9649, 0.9701, 0.9746, 0.9784, 0.9817, 0.9845, 0.9869, 0.9889, 0.9906, 0.9921, 0.9933, 0.9943, 0.9952, 0.996, 0.9966, 0.9971, 0.9976, 0.998, 0.9983, 0.9986, 0.9988, 1); --ds-spring-sheet-stiffness: 240; --ds-spring-sheet-damping: 29; --ds-spring-sheet-mass: 1; --ds-spring-sheet-duration: 459ms; --ds-spring-sheet-easing: linear(0, 0.01, 0.0365, 0.0751, 0.122, 0.1743, 0.2297, 0.2865, 0.3432, 0.3987, 0.4523, 0.5033, 0.5515, 0.5966, 0.6385, 0.6772, 0.7127, 0.7451, 0.7745, 0.8011, 0.8251, 0.8466, 0.8658, 0.883, 0.8982, 0.9117, 0.9236, 0.9341, 0.9433, 0.9514, 0.9584, 0.9645, 0.9699, 0.9745, 0.9785, 0.9819, 0.9848, 0.9874, 0.9895, 0.9913, 0.9929, 0.9942, 0.9953, 0.9962, 0.997, 0.9977, 0.9982, 0.9986, 1); --ds-spring-roll-stiffness: 210; --ds-spring-roll-damping: 24; --ds-spring-roll-mass: 1; --ds-spring-roll-duration: 598ms; --ds-spring-roll-easing: linear(0, 0.0147, 0.0534, 0.1086, 0.1746, 0.2467, 0.3214, 0.3958, 0.468, 0.5365, 0.6003, 0.6588, 0.7118, 0.7592, 0.8011, 0.8378, 0.8695, 0.8967, 0.9198, 0.9392, 0.9553, 0.9684, 0.9791, 0.9876, 0.9942, 0.9993, 1.0031, 1.0058, 1.0077, 1.0089, 1.0095, 1.0097, 1.0095, 1.0092, 1.0086, 1.008, 1.0073, 1.0066, 1.0059, 1.0052, 1.0045, 1.0039, 1.0033, 1.0028, 1.0023, 1.0019, 1.0016, 1.0013, 1); --ds-spring-confirm-stiffness: 520; --ds-spring-confirm-damping: 25; --ds-spring-confirm-mass: 1; --ds-spring-confirm-duration: 553ms; --ds-spring-confirm-easing: linear(0, 0.0312, 0.1124, 0.2262, 0.3577, 0.4945, 0.6273, 0.749, 0.8553, 0.9436, 1.0131, 1.0645, 1.0992, 1.1192, 1.1272, 1.1256, 1.1168, 1.1034, 1.0871, 1.0697, 1.0525, 1.0365, 1.0223, 1.0103, 1.0007, 0.9935, 0.9885, 0.9854, 0.9839, 0.9838, 0.9847, 0.9863, 0.9882, 0.9904, 0.9927, 0.9948, 0.9966, 0.9983, 0.9996, 1.0006, 1.0013, 1.0018, 1.002, 1.0021, 1.002, 1.0018, 1.0016, 1.0013, 1); --ds-spring-nudge-stiffness: 900; --ds-spring-nudge-damping: 15; --ds-spring-nudge-mass: 1; --ds-spring-nudge-duration: 895ms; --ds-spring-nudge-easing: linear(0, 0.1392, 0.4734, 0.866, 1.1985, 1.3971, 1.4416, 1.3579, 1.1994, 1.0265, 0.8888, 0.8143, 0.8073, 0.8533, 0.927, 1.0022, 1.0585, 1.0854, 1.0831, 1.0593, 1.0255, 0.9931, 0.9705, 0.9613, 0.9646, 0.9765, 0.9917, 1.0055, 1.0144, 1.0173, 1.0149, 1.0091, 1.0023, 0.9966, 0.9931, 0.9923, 0.9938, 0.9965, 0.9995, 1.0019, 1.0032, 1.0033, 1.0025, 1.0013, 1, 0.999, 0.9985, 0.9986, 1); --ds-motion-distance-shift: 4px; --ds-motion-distance-sheet: 24px; --ds-motion-distance-shake: 6px; --ds-motion-scale-press-small: .92; --ds-motion-scale-float: .96; --ds-motion-scale-bump: 1.12; --ds-motion-stagger-step-fast: 24ms; --ds-motion-dwell-toast: 5000ms; --ds-transition-press-small: var(--ds-duration-instant) var(--ds-ease-out-swift); --ds-move-reveal-duration: var(--ds-duration-moderate); --ds-move-reveal-easing: var(--ds-ease-out-swift); --ds-move-reveal-distance: var(--ds-motion-distance-shift); --ds-move-sequence-duration: var(--ds-duration-long); --ds-move-sequence-easing: var(--ds-ease-out-expo); --ds-move-sequence-stagger: var(--ds-motion-stagger-step-fast); --ds-move-glide-duration: var(--ds-duration-moderate); --ds-move-glide-easing: var(--ds-ease-in-out-soft); --ds-move-reflow-duration: var(--ds-duration-moderate); --ds-move-reflow-easing: var(--ds-ease-in-out-soft); --ds-move-reflow-exit-duration: var(--ds-duration-fast); --ds-move-reflow-exit-easing: var(--ds-ease-in-quick); --ds-move-reflow-scale: var(--ds-motion-scale-float); --ds-move-pop-duration: var(--ds-duration-fast); --ds-move-pop-easing: var(--ds-ease-out-swift); --ds-move-pop-scale: var(--ds-motion-scale-float); --ds-move-pop-stagger: var(--ds-motion-stagger-step-fast); --ds-move-sheet-duration: var(--ds-duration-slow); --ds-move-sheet-easing: var(--ds-ease-out-expo); --ds-move-sheet-distance: var(--ds-motion-distance-sheet); --ds-move-sheet-exit-duration: var(--ds-duration-base); --ds-move-sheet-exit-easing: var(--ds-ease-in-quick); --ds-move-toast-duration: var(--ds-duration-moderate); --ds-move-toast-easing: var(--ds-ease-out-expo); --ds-move-toast-distance: var(--ds-motion-distance-rise); --ds-move-toast-dwell: var(--ds-motion-dwell-toast); --ds-move-nudge-duration: var(--ds-duration-slow); --ds-move-nudge-easing: var(--ds-ease-out-swift); --ds-move-nudge-distance: var(--ds-motion-distance-shake); --ds-move-bump-duration: var(--ds-duration-moderate); --ds-move-bump-easing: var(--ds-ease-spring-snappy); --ds-move-bump-scale: var(--ds-motion-scale-bump); --ds-move-swap-exit-duration: var(--ds-duration-fast); --ds-move-swap-duration: var(--ds-duration-moderate); --ds-move-swap-easing: var(--ds-ease-out-swift); --ds-move-busy-duration: var(--ds-duration-long); --ds-move-stream-duration: var(--ds-duration-instant); --ds-move-stream-stagger: var(--ds-motion-stagger-step-fast); --ds-move-stage-duration: var(--ds-duration-deliberate); --ds-move-stage-easing: var(--ds-ease-out-expo); --ds-move-stage-distance: var(--ds-motion-distance-rise); --ds-move-stage-stagger: var(--ds-motion-stagger-step);}
@media (prefers-reduced-motion: reduce) {
:root {--ds-motion-distance-shift: 0px; --ds-motion-distance-sheet: 0px; --ds-motion-distance-shake: 0px; --ds-motion-scale-press-small: 1; --ds-motion-scale-float: 1; --ds-motion-scale-bump: 1; --ds-motion-stagger-step-fast: 0ms;}
}
[data-motion="reduced"] {--ds-motion-distance-shift: 0px; --ds-motion-distance-sheet: 0px; --ds-motion-distance-shake: 0px; --ds-motion-scale-press-small: 1; --ds-motion-scale-float: 1; --ds-motion-scale-bump: 1; --ds-motion-stagger-step-fast: 0ms;}
@font-face {font-family: "Vazirmatn"; src: url("../fonts/vazirmatn.woff2") format("woff2"); font-weight: 100 900; font-style: normal; font-display: swap;}
@font-face {font-family: "Geist Mono"; src: url("../fonts/geist-mono.woff2") format("woff2"); font-weight: 100 900; font-style: normal; font-display: swap;}
.is-fonts-wait body {visibility: hidden;}
*,
*::before,
*::after {box-sizing: border-box;}
html {-webkit-text-size-adjust: 100%; text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-block-start: calc(var(--ds-layout-topbar) + var(--ds-space-24));}
body {position: relative; min-block-size: 100vh; margin: 0; background: var(--ds-color-surface); color: var(--ds-color-text-1); font-family: var(--ds-font-sans); font-size: var(--ds-text-body-size); font-weight: var(--ds-text-body-weight); line-height: var(--ds-text-body-leading); letter-spacing: var(--ds-tracking-none); font-synthesis: none; hyphens: none; overflow-wrap: break-word; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;}
:where(h1, h2, h3, h4, h5, h6, p, ul, ol, dl, dd, figure, blockquote, pre) {margin: 0;}
:where(ul, ol) {padding: 0; list-style: none;}
:where(h1, h2, h3, h4, h5, h6) {font-size: inherit; font-weight: inherit; text-wrap: balance;}
:where(p, li, figcaption, dd, td, th) {text-wrap: pretty;}
:where(img, svg, video, canvas) {display: block; max-inline-size: 100%;}
:where(button, input, select, textarea) {margin: 0; color: inherit; font: inherit; letter-spacing: inherit;}
:where(button) {padding: 0; border: 0; background: none; cursor: pointer; text-align: inherit;}
:where(table) {border-collapse: collapse;}
:where(strong, b) {font-weight: var(--ds-weight-semibold);}
:where(em) {font-style: normal; font-weight: var(--ds-weight-semibold);}
:where(small) {font-size: inherit;}
:where(a) {color: var(--ds-color-link); text-decoration: underline; text-decoration-thickness: var(--ds-border-hairline); text-underline-offset: var(--ds-space-4);}
:where(a:hover) {color: var(--ds-color-link-hover);}
:where(code, kbd, samp, pre) {font-family: var(--ds-font-mono); direction: ltr; unicode-bidi: isolate;}
::selection {background: var(--ds-color-brand); color: var(--ds-color-text-on-brand);}
::placeholder {color: var(--ds-color-text-3); opacity: 1;}
:focus-visible:not(:where(input:not([type="checkbox"], [type="radio"], [type="range"], [type="button"], [type="submit"], [type="reset"], [type="file"], [type="color"]), textarea, select, [contenteditable]:not([contenteditable="false"]))) {outline: var(--ds-border-focus-outer) solid var(--ds-color-focus); outline-offset: var(--ds-border-focus-inner);}
:where(input:not([type="checkbox"], [type="radio"], [type="range"], [type="button"], [type="submit"], [type="reset"], [type="file"], [type="color"]), textarea, select, [contenteditable]:not([contenteditable="false"])):focus {outline: none;}
:focus:not(:focus-visible) {outline: none;}
@media (prefers-reduced-motion: reduce) {
html {scroll-behavior: auto;}
}
.t-h2 {font-size: var(--ds-text-h2-size); line-height: var(--ds-text-h2-leading); font-weight: var(--ds-text-h2-weight);}
.u-num {font-variant-numeric: tabular-nums;}
.u-mono {font-family: var(--ds-font-mono);}
@property --sf-run-leading {syntax: "<length-percentage>"; inherits: true; initial-value: 0%;}
:where(:is(p, li, dd, dt, h1, h2, h3, h4, h5, h6, figcaption, td, th, blockquote, a, span, b, strong, small, em, label, time):not(bdi, code, samp, .u-mono, .u-num):has(> :is(bdi, code, samp, .u-mono, .u-num))) {--sf-run-leading: 1lh;}
:where(:is(p, li, dd, dt, h1, h2, h3, h4, h5, h6, figcaption, td, th, blockquote, a, span, b, strong, small, em, label, time) > :is(bdi, code, samp, .u-mono, .u-num):not(.doc-token, .docs-path)) {line-height: 1; min-block-size: min(var(--sf-run-leading), calc(var(--sf-run-leading) - (1lh - 1em) * 1000)); align-content: center;}
.u-sep {display: inline-block; flex: none; inline-size: var(--ds-border-hairline); block-size: var(--ds-space-12); margin-inline: var(--ds-space-8); background: var(--ds-color-border-default); vertical-align: middle;}
.u-seplist {--sf-seplist-gap: calc(var(--ds-space-16) + var(--ds-border-hairline)); display: flex; flex-wrap: wrap; align-items: center; column-gap: var(--sf-seplist-gap); margin-inline-start: calc(var(--sf-seplist-gap) * -1); border-inline-start: var(--sf-seplist-gap) solid transparent; overflow: clip; overflow-clip-margin: var(--ds-space-4);}
.u-seplist > * {position: relative;}
.u-seplist > * + *::before {content: ""; position: absolute; inset-block: 0; inset-inline-start: calc((var(--sf-seplist-gap) + var(--ds-border-hairline)) / -2); inline-size: var(--ds-border-hairline); block-size: var(--ds-space-12); margin-block: auto; background: var(--sf-sep, var(--ds-color-border-default));}
.u-sr-only {position: absolute; inline-size: var(--ds-border-hairline); block-size: var(--ds-border-hairline); margin: calc(var(--ds-border-hairline) * -1); padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap;}
.u-sprite {position: absolute; inline-size: 0; block-size: 0; overflow: hidden;}
.u-lift {position: relative; isolation: isolate; transition: transform var(--ds-spring-lift-duration) var(--ds-spring-lift-easing);}
.u-lift::after {content: ""; position: absolute; inset: 0; z-index: -1; border-radius: inherit; box-shadow: var(--ds-shadow-floating); opacity: 0; pointer-events: none; transition: opacity var(--ds-spring-lift-duration) var(--ds-ease-out-swift);}
.u-lift:hover,
.u-lift:focus-visible,
.u-lift:has(:focus-visible) {transform: translateY(calc(var(--ds-move-lift-distance) * -1));}
.u-lift:hover::after,
.u-lift:focus-visible::after,
.u-lift:has(:focus-visible)::after {opacity: 1;}
.l-stack {display: flex; flex-direction: column; gap: var(--gap, var(--ds-space-gap-md));}
.l-container {--g: var(--ds-layout-gutter-sm); inline-size: 100%; max-inline-size: var(--ds-layout-container); margin-inline: auto; padding-inline: var(--g);}
@media (min-width: 768px) {
.l-container {--g: var(--ds-layout-gutter-md);}
}
@media (min-width: 1280px) {
.l-container {--g: var(--ds-layout-gutter-lg);}
}
.icon {flex: none; inline-size: var(--ds-size-icon-md); block-size: var(--ds-size-icon-md); fill: none; stroke: currentColor; stroke-width: var(--ds-size-icon-stroke); stroke-linecap: round; stroke-linejoin: round;}
.icon--xs {inline-size: var(--ds-size-icon-xs); block-size: var(--ds-size-icon-xs); stroke-width: var(--ds-size-icon-stroke-sm);}
.icon--sm {inline-size: var(--ds-size-icon-sm); block-size: var(--ds-size-icon-sm);}
.icon--directional:dir(rtl) {transform: scaleX(-1);}
.sf-motion [data-motion="settle"]:not([data-stagger]):not(.is-settled),
.sf-motion [data-motion="settle"][data-stagger]:not(.is-settled) > *,
.sf-motion [data-motion="stage"]:not(.is-settled) [data-stage] {opacity: 0;}
.sf-note[hidden] {display: none;}
.sf-motion-mask {display: inline-block; clip-path: inset(0 -0.2em); vertical-align: baseline;}
.sf-motion-word {display: inline-block;}
.sf-roll {direction: ltr; unicode-bidi: isolate-override; overflow-anchor: none;}
.sf-roll__col {position: relative; display: inline-block; contain: paint; -webkit-mask-image: linear-gradient(to bottom, transparent, black 12%, black 88%, transparent); mask-image: linear-gradient(to bottom, transparent, black 12%, black 88%, transparent);}
.sf-roll__sizer {visibility: hidden;}
.sf-roll__reel {position: absolute; inset-block-start: 0; inset-inline-start: 0; display: flex; flex-direction: column; will-change: transform;}
.sf-roll__reel > span {display: block; block-size: var(--sf-roll-h); text-align: center;}
.sf-motion-seal {position: absolute; inset: 0; inline-size: 100%; block-size: 100%; overflow: visible; pointer-events: none;}
.sf-motion-seal rect {fill: none; stroke: var(--ds-color-brand-edge); stroke-width: var(--ds-border-focus-outer); stroke-dasharray: 100;}
.sf-motion-tip {position: absolute; inset-block-start: 50%; inset-inline-start: 0; inline-size: var(--ds-space-12); block-size: var(--ds-space-12); margin-block-start: calc(var(--ds-space-12) / -2); margin-inline-start: calc(var(--ds-space-12) / -2); border-radius: var(--ds-radius-full); background: var(--ds-color-brand-edge); box-shadow: 0 0 0 var(--ds-space-4) var(--ds-color-brand-subtle); opacity: 0; pointer-events: none;}
.sf-stage {--ds-color-focus: var(--ds-color-stage-accent); position: relative; isolation: isolate; overflow: clip; padding: var(--ds-space-32) var(--ds-space-20); border-radius: var(--ds-radius-card); background: var(--ds-color-stage); color: var(--ds-color-stage-ink);}
.sf-stage::before,
.sf-stage::after {content: ""; position: absolute; z-index: -1; border-radius: var(--ds-radius-full); box-shadow: inset 0 0 0 var(--ds-border-hairline) var(--ds-color-stage-line); pointer-events: none;}
.sf-stage::before {inline-size: calc(var(--ds-space-80) * 5); block-size: calc(var(--ds-space-80) * 5); inset-inline-end: calc(24% - var(--ds-space-80) * 2.5); inset-block-start: calc(56% - var(--ds-space-80) * 2.5); outline: var(--ds-border-hairline) solid var(--ds-color-stage-line); outline-offset: calc(var(--ds-space-80) + var(--ds-space-8));}
.sf-stage::after {inline-size: calc(var(--ds-space-80) * 9.5); block-size: calc(var(--ds-space-80) * 9.5); inset-inline-end: calc(24% - var(--ds-space-80) * 4.75); inset-block-start: calc(56% - var(--ds-space-80) * 4.75);}
.sf-stage em {color: var(--ds-color-stage-accent); font-style: normal;}
.sf-stage__muted {color: var(--ds-color-stage-ink-2);}
:is(.sf-stage, .sf-card--stage, .sf-banner--stage, .sf-banner--announcement, .sf-app-shell__hero, .sf-app-shell__announce, .sf-mail__hero, .sf-deal-card--last-call .sf-deal-card__stub) :is(.sf-button--primary, .sf-icon-button--primary):not(:is([data-theme-area], .sf-linkreq__sheet, .sf-deal-card:not(.sf-deal-card--last-call)) *):not(:disabled, [aria-disabled="true"], .is-disabled) {--sf-bg: var(--ds-color-stage-accent); --sf-fg: var(--ds-color-on-stage-accent); --sf-overlay: var(--ds-color-stage-accent-hover); --sf-overlay-active: var(--ds-color-stage-accent-active);}
[data-dept="ship"] {--sf-dept: var(--ds-color-dept-ship); --sf-dept-ink: var(--ds-color-dept-ship-ink); --sf-dept-subtle: var(--ds-color-dept-ship-subtle);}
[data-dept="finance"] {--sf-dept: var(--ds-color-dept-finance); --sf-dept-ink: var(--ds-color-dept-finance-ink); --sf-dept-subtle: var(--ds-color-dept-finance-subtle);}
[data-dept="support"] {--sf-dept: var(--ds-color-dept-support); --sf-dept-ink: var(--ds-color-dept-support-ink); --sf-dept-subtle: var(--ds-color-dept-support-subtle);}
[data-dept="catalog"] {--sf-dept: var(--ds-color-dept-catalog); --sf-dept-ink: var(--ds-color-dept-catalog-ink); --sf-dept-subtle: var(--ds-color-dept-catalog-subtle);}
[data-dept="marketing"] {--sf-dept: var(--ds-color-dept-marketing); --sf-dept-ink: var(--ds-color-dept-marketing-ink); --sf-dept-subtle: var(--ds-color-dept-marketing-subtle);}
[data-dept="security"] {--sf-dept: var(--ds-color-dept-security); --sf-dept-ink: var(--ds-color-dept-security-ink); --sf-dept-subtle: var(--ds-color-dept-security-subtle);}
.sf-stage__eyebrow {display: inline-flex; align-items: center; gap: var(--ds-space-8); min-block-size: var(--ds-space-32); padding-inline: var(--ds-space-12); border-radius: var(--ds-radius-pill); box-shadow: inset 0 0 0 var(--ds-border-hairline) var(--ds-color-stage-line); color: var(--ds-color-stage-accent); font-size: var(--ds-text-label-size); line-height: var(--ds-text-label-leading); font-weight: var(--ds-text-label-weight);}
.sf-stage__eyebrow .u-sep {background: var(--ds-color-stage-line);}
@media (min-width: 768px) {
.sf-stage {padding: var(--ds-space-64); border-radius: var(--ds-radius-stage);}
}
.sf-ring {--sf-ring-size: var(--ds-size-ring-md); --sf-ring-stroke: var(--ds-space-4); --sf-ring-track: var(--ds-color-track); --sf-ring-bar: var(--ds-color-brand-edge); position: relative; display: inline-grid; flex: none; place-items: center; inline-size: var(--sf-ring-size); block-size: var(--sf-ring-size); color: var(--ds-color-text-1); vertical-align: middle;}
.sf-ring > * {grid-area: 1 / 1;}
.sf-ring__svg {position: absolute; inset: 0; inline-size: 100%; block-size: 100%; fill: none; transform: rotate(-90deg);}
.sf-ring__track {stroke: var(--sf-ring-track); stroke-width: var(--sf-ring-stroke);}
.sf-ring__bar {stroke: var(--sf-ring-bar); stroke-width: var(--sf-ring-stroke); stroke-linecap: round; stroke-dasharray: var(--v, 0) 100; opacity: clamp(0, var(--v, 0), 1);}
.sf-ring__icon {color: var(--ds-color-brand-ink);}
.sf-ring--sm {--sf-ring-size: var(--ds-size-ring-sm); --sf-ring-stroke: calc(var(--ds-space-4) * 1.125);}
.sf-route {--n: 4; --p: 0; position: relative;}
.sf-route__line {position: absolute; inset-block-start: calc(var(--ds-space-8) - var(--ds-border-hairline)); inset-inline: calc(50% / var(--n)); block-size: var(--ds-space-2); border-radius: var(--ds-radius-full); background: var(--ds-color-well);}
.sf-route__progress {position: absolute; inset-block: 0; inset-inline-start: 0; inline-size: calc(var(--p) * 100%); border-radius: inherit; background: var(--ds-color-brand-edge); transform-origin: 0 50%;}
.sf-route__progress:dir(rtl) {transform-origin: 100% 50%;}
.sf-route__stop {display: flex; flex-direction: column; align-items: center; gap: var(--ds-space-4); min-inline-size: 0; padding-inline: var(--ds-space-2); color: var(--ds-color-text-3); font-size: var(--ds-text-caption-size); line-height: var(--ds-text-caption-leading); text-align: center;}
.sf-route__dot {display: block; inline-size: var(--ds-space-16); block-size: var(--ds-space-16); margin-block-end: var(--ds-space-4); border-radius: var(--ds-radius-full); background: var(--ds-color-raised); box-shadow: inset 0 0 0 var(--ds-space-2) var(--ds-color-well);}
.sf-route__stop.is-done .sf-route__dot {background: var(--ds-color-brand-edge); box-shadow: none;}
.sf-route__stop.is-current .sf-route__dot {background: var(--ds-color-selected-mark); box-shadow: 0 0 0 var(--ds-space-4) var(--ds-color-brand-subtle), inset 0 0 0 var(--ds-space-2) var(--ds-color-brand-edge);}
.sf-leader {display: grid; gap: var(--ds-space-12); margin: 0; color: var(--ds-color-text-2); font-size: var(--ds-text-body-sm-size); line-height: var(--ds-text-body-sm-leading);}
.sf-leader__row {display: flex; align-items: baseline; gap: var(--ds-space-8); min-inline-size: 0;}
.sf-leader__row::after {content: ""; order: 1; flex: 1 1 var(--ds-space-16); min-inline-size: var(--ds-space-16); border-block-end: var(--ds-border-hairline) dotted var(--ds-color-border-strong); opacity: var(--ds-opacity-56); transform: translateY(calc(var(--ds-space-4) * -1));}
.sf-leader__row > dt {min-inline-size: 0;}
.sf-leader__row :is(bdi, .u-mono, code) {line-height: 1;}
.sf-leader__row > dd {order: 2; margin: 0; color: var(--ds-color-text-1); font-weight: var(--ds-weight-semibold); font-variant-numeric: tabular-nums; white-space: nowrap;}
.sf-leader__total {display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: var(--ds-space-4) var(--ds-space-16); padding-block: var(--ds-space-16) var(--ds-space-12);}
.sf-leader__label {flex-basis: 100%; color: var(--ds-color-text-3); font-size: var(--ds-text-caption-size); line-height: var(--ds-text-caption-leading);}
.sf-leader__amount {display: inline-flex; align-items: baseline; gap: var(--ds-space-8); color: var(--ds-color-text-1); font-size: var(--ds-text-h2-size); line-height: var(--ds-text-h2-leading); font-weight: var(--ds-weight-extrabold); font-variant-numeric: tabular-nums; white-space: nowrap;}
.sf-leader__amount > b {font-weight: inherit;}
.sf-leader__amount > small {color: var(--ds-color-text-3); font-size: var(--ds-text-label-size); line-height: var(--ds-text-label-leading); font-weight: var(--ds-text-label-weight);}
.sf-leader__ref {display: flex; flex-wrap: wrap; align-items: center; color: var(--ds-color-text-3); font-size: var(--ds-text-caption-size); line-height: var(--ds-text-caption-leading); font-variant-numeric: tabular-nums;}
.sf-leader__ref:not(.u-seplist) {column-gap: var(--ds-space-4);}
.sf-perf {--sf-perf-r: var(--ds-space-8);}
.sf-perf {position: relative; block-size: var(--ds-space-16); margin-inline: calc(var(--sf-perf-inset, var(--ds-space-24)) * -1);}
.sf-perf::after {content: ""; position: absolute; inset-inline: calc(var(--sf-perf-r) + var(--ds-space-8)); inset-block-start: calc(50% - var(--ds-border-hairline) / 2); border-block-start: var(--ds-border-hairline) dashed var(--ds-color-border-default);}
.sf-digits.sf-digits--fa {font-family: var(--ds-font-sans); font-feature-settings: "tnum";}
.sf-digits {display: inline-flex; flex: none; align-items: center; gap: var(--ds-space-4); color: var(--ds-color-text-1); font-family: var(--ds-font-mono); font-size: var(--ds-text-code-size); line-height: 1; font-weight: var(--ds-weight-semibold); font-variant-numeric: tabular-nums; direction: ltr; unicode-bidi: isolate;}
.sf-digits__tile {position: relative; display: inline-grid; place-items: center; min-inline-size: var(--ds-space-24); block-size: var(--ds-space-24); padding-inline: var(--ds-space-4); border-radius: var(--ds-radius-mark); background: var(--ds-color-sunken); box-shadow: inset 0 0 0 var(--ds-border-hairline) var(--ds-color-border-subtle);}
.sf-digits__sep {display: inline-flex; align-self: stretch; align-items: center; color: var(--ds-color-text-2);}
.sf-note-anchor {position: relative;}
.sf-note {--sf-note-h: var(--ds-space-32); display: inline-flex; align-items: center; gap: var(--ds-space-8); block-size: var(--sf-note-h); padding-inline: calc(var(--ds-space-4) + var(--ds-space-2)) var(--ds-space-12); border-radius: var(--ds-radius-pill); background: var(--ds-color-overlay); box-shadow: var(--ds-shadow-floating); color: var(--ds-color-text-1); font-size: var(--ds-text-caption-size); line-height: var(--ds-text-caption-leading); font-weight: var(--ds-weight-semibold); white-space: nowrap;}
.sf-note__mark {display: grid; flex: none; place-items: center; inline-size: var(--ds-size-icon-sm); block-size: var(--ds-size-icon-sm); border-radius: var(--ds-radius-full); background: var(--ds-color-brand); color: var(--ds-color-text-on-brand);}
.sf-note__mark .icon {inline-size: var(--ds-space-12); block-size: var(--ds-space-12); stroke-width: calc(var(--ds-size-icon-stroke-sm) + var(--ds-border-hairline));}
.sf-note--anchored {position: absolute; z-index: var(--ds-z-raised); pointer-events: none; inset-block-start: var(--sf-note-y, calc(var(--sf-note-edge, var(--ds-space-0)) - var(--sf-note-h) / 2)); inset-inline-start: var(--sf-note-x, var(--ds-space-24));}
.sf-stack-sheet {--sf-stack-peek: var(--ds-color-sunken); position: relative; isolation: isolate; padding-block-start: var(--ds-space-12);}
.sf-stack-sheet::before {content: ""; position: absolute; z-index: -1; inset-block: 0 var(--ds-space-24); inset-inline: var(--ds-space-24); border-radius: var(--ds-radius-sheet); background: var(--sf-stack-peek); box-shadow: inset 0 0 0 var(--ds-border-hairline) var(--ds-color-border-subtle);}
.sf-stack-sheet__page {--sf-perf-inset: var(--ds-space-20); position: relative; padding: var(--ds-space-20); border-radius: var(--ds-radius-sheet); background: var(--ds-color-raised); box-shadow: var(--ds-shadow-floating); color: var(--ds-color-text-1);}
@media (min-width: 768px) {
.sf-stack-sheet__page {--sf-perf-inset: var(--ds-space-24); padding: var(--ds-space-24);}
}
.sf-art {display: block; inline-size: 100%; block-size: 100%; overflow: visible;}
.sf-art__ink {fill: currentColor;}
.sf-art__soft {fill: currentColor; opacity: var(--ds-opacity-art-soft);}
.sf-art__lime {fill: var(--ds-color-brand);}
.sf-art__hole {fill: var(--sf-art-hole, var(--ds-color-sunken));}
.sf-art__line {fill: none; stroke: currentColor; stroke-width: var(--ds-space-4); stroke-linecap: round; stroke-linejoin: round;}
.sf-art__mark {fill: none; stroke: var(--ds-color-text-on-brand); stroke-width: calc(var(--ds-space-2) * 1.5); stroke-linecap: round; stroke-linejoin: round;}
.sf-icon-tile {display: inline-grid; flex: none; place-items: center; inline-size: var(--ds-size-tile); block-size: var(--ds-size-tile); border-radius: var(--ds-radius-control); background: var(--ds-color-brand-subtle); box-shadow: inset 0 0 0 var(--ds-border-hairline) var(--ds-color-brand-line); color: var(--ds-color-brand-ink);}
.sf-icon-tile--neutral {background: var(--ds-color-sunken); box-shadow: inset 0 0 0 var(--ds-border-hairline) var(--ds-color-border-subtle); color: var(--ds-color-text-1);}
.sf-icon-tile--sm {inline-size: var(--ds-size-control-sm); block-size: var(--ds-size-control-sm);}
.sf-button,
.sf-icon-button,
.sf-segmented,
.sf-stepper {--sf-dir: 1;}
.sf-button:dir(rtl),
.sf-icon-button:dir(rtl),
.sf-segmented:dir(rtl),
.sf-stepper:dir(rtl) {--sf-dir: -1;}
.sf-button,
.sf-icon-button {--sf-h: var(--ds-size-control-md); --sf-px: var(--ds-space-24); --sf-radius: var(--ds-radius-pill); --sf-icon: var(--ds-size-icon-sm); --sf-bg: transparent; --sf-fg: var(--ds-color-text-1); --sf-shadow: none; --sf-overlay: var(--ds-color-hover); --sf-overlay-active: var(--ds-color-pressed); --sf-edge: 0; position: relative; isolation: isolate; display: inline-flex; flex: none; align-items: center; justify-content: center; gap: var(--ds-space-8); min-inline-size: var(--sf-h); block-size: var(--sf-h); padding-block: 0; padding-inline: var(--sf-px); border: 0; border-radius: var(--sf-radius); background: var(--sf-bg); box-shadow: var(--sf-shadow); color: var(--sf-fg); font-family: inherit; font-size: var(--ds-text-body-size); line-height: var(--ds-text-label-leading); font-weight: var(--ds-weight-bold); text-align: center; text-decoration: none; white-space: nowrap; cursor: pointer; user-select: none; -webkit-tap-highlight-color: transparent; transition: transform var(--ds-spring-snap-duration) var(--ds-spring-snap-easing);}
.sf-button::before,
.sf-icon-button::before,
.sf-button::after,
.sf-icon-button::after {content: ""; position: absolute; inset: 0; z-index: -1; border-radius: inherit; pointer-events: none;}
.sf-button::before,
.sf-icon-button::before {--sf-ext: max(var(--ds-space-0), calc((var(--ds-size-touch) - var(--sf-h)) / 2)); inset: calc(var(--sf-ext) * -1); padding: var(--sf-ext); background: var(--sf-overlay) content-box; opacity: 0; pointer-events: auto; transition: opacity var(--ds-transition-hover);}
.sf-button::after,
.sf-icon-button::after {box-shadow: inset 0 calc(var(--ds-space-2) * -1) 0 0 var(--ds-color-text-on-brand); opacity: var(--sf-edge); transition: opacity var(--ds-transition-press);}
.sf-button:hover::before,
.sf-icon-button:hover::before {opacity: 1;}
.sf-button:active,
.sf-icon-button:active {transform: translateY(var(--ds-border-hairline)) scale(var(--ds-motion-scale-press));}
.sf-button:active::before,
.sf-icon-button:active::before {background-color: var(--sf-overlay-active); opacity: 1;}
.sf-button:active::after,
.sf-icon-button:active::after {opacity: 0;}
.sf-button > .icon,
.sf-icon-button > .icon {inline-size: var(--sf-icon); block-size: var(--sf-icon);}
.sf-button:has(> .icon:first-child) {padding-inline-start: calc(var(--sf-px) - var(--ds-space-4));}
.sf-button:has(> .sf-button__label + .icon) {padding-inline-end: calc(var(--sf-px) - var(--ds-space-4));}
.sf-button > .icon--directional {transition: transform var(--ds-transition-move);}
.sf-button:hover > .icon--directional:dir(ltr) {transform: translateX(var(--ds-space-4));}
.sf-button:hover > .icon--directional:dir(rtl) {transform: scaleX(-1) translateX(var(--ds-space-4));}
.sf-button--sm,
.sf-icon-button--sm {--sf-h: var(--ds-size-control-sm); --sf-px: var(--ds-space-16); --sf-icon: var(--ds-size-icon-xs); font-size: var(--ds-text-body-sm-size);}
.sf-button--lg {--sf-h: var(--ds-size-control-lg); --sf-px: var(--ds-space-32);}
.sf-icon-button {--sf-px: 0;}
.sf-icon-button--sm {--sf-px: 0; --sf-icon: var(--ds-size-icon-sm);}
.sf-button--block {display: flex; inline-size: 100%;}
.sf-button[hidden],
.sf-icon-button[hidden] {display: none;}
.sf-button--primary {--sf-bg: var(--ds-color-brand); --sf-fg: var(--ds-color-text-on-brand); --sf-overlay: var(--ds-color-brand-hover); --sf-overlay-active: var(--ds-color-brand-active); --sf-edge: var(--ds-opacity-12);}
.sf-button--secondary {--sf-bg: var(--ds-color-raised); --sf-shadow: inset 0 0 0 var(--ds-border-hairline) var(--ds-color-border-default);}
.sf-button--ghost,
.sf-icon-button--ghost {--sf-bg: transparent;}
.sf-button:disabled,
.sf-button[aria-disabled="true"],
.sf-icon-button:disabled,
.sf-icon-button[aria-disabled="true"] {--sf-bg: var(--ds-color-sunken); --sf-fg: var(--ds-color-text-disabled); --sf-shadow: none; --sf-edge: 0; cursor: not-allowed; pointer-events: none;}
.sf-button--ghost:disabled,
.sf-button--ghost[aria-disabled="true"],
.sf-icon-button--ghost:disabled,
.sf-icon-button--ghost[aria-disabled="true"],
.sf-icon-button:not([class*="--"]):disabled {--sf-bg: transparent;}
.sf-button > :not(.sf-button__loader, .sf-button__done) {transition: opacity var(--ds-transition-hover), transform var(--ds-spring-glide-duration) var(--ds-spring-glide-easing);}
.sf-button[aria-busy="true"],
.sf-button.is-done {cursor: progress; pointer-events: none;}
.sf-button[aria-busy="true"] > :not(.sf-button__loader),
.sf-button.is-done > :not(.sf-button__done) {opacity: 0;}
@keyframes sf-ai-orbit {to { transform: rotate(1turn); }}
.sf-segmented {--n: 2; --i: 0; --sf-item-h: var(--ds-size-control-sm); position: relative; display: inline-grid; grid-template-columns: repeat(var(--n), minmax(0, 1fr)); padding: var(--ds-space-4); border-radius: var(--ds-radius-pill); background: var(--ds-color-sunken); box-shadow: inset 0 0 0 var(--ds-border-hairline) var(--ds-color-border-subtle);}
.sf-segmented--block {display: grid; inline-size: 100%;}
.sf-segmented__thumb {position: absolute; inset-block: var(--ds-space-4); inset-inline-start: var(--ds-space-4); inline-size: calc((100% - var(--ds-space-8)) / var(--n)); border-radius: var(--ds-radius-pill); background: var(--ds-color-selected-segment); box-shadow: var(--ds-shadow-resting), inset 0 0 0 var(--ds-border-hairline) var(--ds-color-selected-segment-line); transform: translateX(calc(var(--i) * 100% * var(--sf-dir))); transition: transform var(--ds-transition-move);}
.sf-segmented__item {position: relative; display: inline-flex; align-items: center; justify-content: center; gap: var(--ds-space-8); min-inline-size: 0; min-block-size: var(--sf-item-h); padding-inline: var(--ds-space-16); border-radius: var(--ds-radius-pill); color: var(--ds-color-text-2); font-size: var(--ds-text-body-sm-size); line-height: var(--ds-text-body-sm-leading); font-weight: var(--ds-weight-semibold); text-align: center; white-space: nowrap; cursor: pointer; transition: transform var(--ds-transition-press);}
.sf-segmented__item::after {content: ""; position: absolute; inset-inline: 0; inset-block: min(var(--ds-space-0), calc((var(--ds-size-touch) - 100%) / -2));}
.sf-segmented__item:hover {color: var(--ds-color-text-1);}
.sf-segmented__item[aria-checked="true"] {color: var(--ds-color-on-selected); font-weight: var(--ds-weight-bold);}
.sf-segmented__item:active {transform: scale(var(--ds-motion-scale-press));}
.sf-segmented__item:disabled,
.sf-segmented__item[aria-disabled="true"] {color: var(--ds-color-text-disabled); cursor: not-allowed;}
@media (pointer: coarse) {
.sf-segmented__item {min-block-size: var(--ds-size-touch);}
}
.sf-field {display: flex; flex-direction: column; gap: var(--ds-space-8); min-inline-size: 0;}
.sf-field__label {display: flex; align-items: baseline; gap: var(--ds-space-4); color: var(--ds-color-text-1); font-size: var(--ds-text-label-size); line-height: var(--ds-text-label-leading); font-weight: var(--ds-text-label-weight);}
.sf-field__opt {color: var(--ds-color-text-3); font-size: var(--ds-text-caption-size); line-height: var(--ds-text-caption-leading); font-weight: var(--ds-weight-regular);}
.sf-field__foot {display: flex; align-items: flex-start; justify-content: space-between; gap: var(--ds-space-12);}
.sf-field__hint,
.sf-field__error {min-inline-size: 0; color: var(--ds-color-text-2); font-size: var(--ds-text-caption-size); line-height: var(--ds-text-caption-leading);}
.sf-field__error {display: flex; align-items: flex-start; gap: var(--ds-space-4); color: var(--ds-color-danger-fg); font-weight: var(--ds-weight-semibold);}
.sf-field__error > .icon {flex: none; inline-size: var(--ds-size-icon-xs); block-size: var(--ds-size-icon-xs); margin-block-start: var(--ds-space-2);}
.sf-field__error[hidden],
.sf-field__hint[hidden] {display: none;}
.sf-input {--sf-h: var(--ds-size-control-md); --sf-px: var(--ds-space-16); position: relative; display: flex; align-items: center; gap: var(--ds-space-8); inline-size: 100%; min-block-size: var(--sf-h); padding-inline: var(--sf-px); border-radius: var(--ds-radius-control); background: var(--ds-color-raised); box-shadow: inset 0 0 0 var(--ds-border-hairline) var(--ds-color-border-default); color: var(--ds-color-text-1); cursor: text;}
.sf-input--lg {--sf-h: var(--ds-size-control-lg); --sf-px: var(--ds-space-20);}
.sf-input::after {content: ""; position: absolute; inset: 0; border-radius: inherit; box-shadow: inset 0 0 0 var(--ds-border-hairline) var(--ds-color-border-strong); opacity: 0; pointer-events: none; transition: opacity var(--ds-transition-hover);}
.sf-input:hover::after {opacity: 1;}
.sf-input:has(.sf-input__control:focus)::after {box-shadow: inset 0 0 0 var(--ds-border-focus-outer) var(--ds-color-brand-edge); opacity: 1;}
.sf-input:has([aria-invalid="true"])::after {box-shadow: inset 0 0 0 var(--ds-border-hairline) var(--ds-color-danger-solid); opacity: 1;}
.sf-input:has([aria-invalid="true"]:focus)::after {box-shadow: inset 0 0 0 var(--ds-border-focus-outer) var(--ds-color-danger-solid);}
.sf-input:has(:disabled) {background: var(--ds-color-sunken); box-shadow: inset 0 0 0 var(--ds-border-hairline) var(--ds-color-border-subtle); color: var(--ds-color-text-disabled); cursor: not-allowed;}
.sf-input:has(:disabled)::after {opacity: 0;}
.sf-input:has(.sf-input__control[readonly]) {background: var(--ds-color-sunken); box-shadow: inset 0 0 0 var(--ds-border-hairline) var(--ds-color-border-subtle);}
.sf-input:has(.sf-input__control[readonly])::after {opacity: 0;}
.sf-input__control {flex: 1; align-self: stretch; min-inline-size: 0; min-block-size: 0; padding: 0; border: 0; border-radius: inherit; outline: none; background: none; color: inherit; font-family: inherit; font-size: var(--ds-text-body-size); line-height: var(--ds-text-body-leading); text-align: start; text-overflow: ellipsis;}
.sf-input__control::placeholder {color: var(--ds-color-text-3); opacity: 1;}
.sf-input__control:disabled {cursor: not-allowed; -webkit-text-fill-color: currentColor;}
.sf-input__control--ltr {direction: ltr; text-align: end;}
.sf-input__control--num {font-variant-numeric: tabular-nums;}
.sf-input > .icon {flex: none; inline-size: var(--ds-size-icon-sm); block-size: var(--ds-size-icon-sm); color: var(--ds-color-text-3);}
.sf-input__affix {flex: none; color: var(--ds-color-text-3); font-size: var(--ds-text-label-size); line-height: var(--ds-text-body-leading); font-weight: var(--ds-text-label-weight);}
.sf-input .sf-icon-button {margin-inline-end: calc(var(--ds-space-12) * -1);}
@media (pointer: coarse) {
.sf-input {min-block-size: max(var(--sf-h), var(--ds-size-touch));}
}
.sf-input--area {align-items: flex-start; padding-block: var(--ds-space-12);}
.sf-input--area .sf-input__control {align-self: auto; min-block-size: var(--ds-space-96); resize: vertical;}
.sf-input--select {cursor: pointer;}
.sf-input--select .sf-input__control {padding-inline-end: calc(var(--ds-size-icon-sm) + var(--ds-space-8)); cursor: pointer; appearance: none;}
.sf-input--select > .icon {position: absolute; inset-inline-end: var(--sf-px); pointer-events: none;}
@keyframes sf-ai-march {to { stroke-dashoffset: calc(var(--ds-space-16) * -1); }}
.sf-field__hint .u-mono {font-family: var(--ds-font-mono); line-height: 1;}
.sf-stepper {--sf-btn: var(--ds-size-control-md); display: inline-flex; align-items: center; gap: var(--ds-space-4); padding: var(--ds-space-4); border-radius: var(--ds-radius-pill); background: var(--ds-color-raised); box-shadow: inset 0 0 0 var(--ds-border-hairline) var(--ds-color-border-default); direction: ltr;}
.sf-stepper .sf-icon-button {--sf-h: var(--sf-btn); --sf-icon: var(--ds-size-icon-xs); --sf-bg: var(--ds-color-sunken);}
.sf-stepper .sf-icon-button:disabled {--sf-bg: transparent;}
.sf-stepper__value {inline-size: max(var(--sf-btn), var(--ds-size-touch)); block-size: calc(var(--sf-btn) + var(--ds-space-8)); margin-block: calc(var(--ds-space-4) * -1); padding: 0; border: 0; border-radius: var(--ds-radius-pill); outline: none; background: none; color: var(--ds-color-text-1); font-family: inherit; font-size: var(--ds-text-body-size); line-height: var(--ds-text-body-leading); font-weight: var(--ds-weight-extrabold); font-variant-numeric: tabular-nums; text-align: center; transition: transform var(--ds-transition-enter), opacity var(--ds-transition-enter);}
.sf-stepper__value.is-from-up {opacity: 0; transform: translateY(calc(var(--ds-motion-distance-nudge) * -1)); transition: none;}
.sf-stepper__value.is-from-down {opacity: 0; transform: translateY(var(--ds-motion-distance-nudge)); transition: none;}
.sf-stepper:has(.sf-stepper__value:focus) {box-shadow: inset 0 0 0 var(--ds-border-focus-outer) var(--ds-color-brand-edge);}
.sf-stepper:has(.sf-stepper__value:disabled) {background: var(--ds-color-sunken); box-shadow: inset 0 0 0 var(--ds-border-hairline) var(--ds-color-border-subtle);}
.sf-stepper__value:disabled {color: var(--ds-color-text-disabled);}
[data-sf-note-end][hidden] {display: none;}
:root {--sf-hit: var(--ds-size-control-sm); --sf-sign: 1;}
:root:dir(rtl) {--sf-sign: -1;}
@media (max-width: 767px), (pointer: coarse) {
:root {--sf-hit: var(--ds-size-touch);}
}
.sf-drawer__head .sf-icon-button,
.sf-toast__close {--sf-fg: var(--ds-color-text-2);}
.sf-badge {--sf-badge-bg: var(--ds-color-state-idle-subtle); --sf-badge-fg: var(--ds-color-state-idle-ink); --sf-badge-line: var(--ds-color-state-idle-line); display: inline-flex; flex: none; align-items: center; justify-content: center; gap: var(--ds-space-4); block-size: var(--ds-space-24); padding-inline: var(--ds-space-8); border-radius: var(--ds-radius-pill); background: var(--sf-badge-bg); box-shadow: inset 0 0 0 var(--ds-border-hairline) var(--sf-badge-line); color: var(--sf-badge-fg); font-size: var(--ds-text-caption-size); line-height: var(--ds-text-caption-leading); font-weight: var(--ds-weight-semibold); font-variant-numeric: tabular-nums; white-space: nowrap;}
.sf-badge .icon {inline-size: var(--ds-size-icon-xs); block-size: var(--ds-size-icon-xs); stroke-width: var(--ds-size-icon-stroke-sm);}
.sf-badge:has(> .icon:first-child),
.sf-badge:has(> .sf-badge__dot:first-child) {padding-inline-start: var(--ds-space-4);}
.sf-badge:has(> .sf-badge__dot:first-child) {padding-inline-start: var(--ds-space-8);}
.sf-badge--brand {--sf-badge-bg: var(--ds-color-brand-subtle); --sf-badge-fg: var(--ds-color-brand-ink); --sf-badge-line: var(--ds-color-brand-line);}
.sf-badge--success {--sf-badge-bg: var(--ds-color-state-done-subtle); --sf-badge-fg: var(--ds-color-state-done-ink); --sf-badge-line: var(--ds-color-state-done-line);}
.sf-badge--info {--sf-badge-bg: var(--ds-color-state-underway-subtle); --sf-badge-fg: var(--ds-color-state-underway-ink); --sf-badge-line: var(--ds-color-state-underway-line);}
.sf-chip {position: relative; display: inline-flex; flex: none; align-items: center; gap: var(--ds-space-8); block-size: var(--ds-size-control-sm); padding-inline: var(--ds-space-16); border-radius: var(--ds-radius-pill); background: var(--ds-color-raised); box-shadow: inset 0 0 0 var(--ds-border-hairline) var(--ds-color-border-default); color: var(--ds-color-text-1); font-size: var(--ds-text-label-size); line-height: var(--ds-text-label-leading); font-weight: var(--ds-text-label-weight); white-space: nowrap; transition: transform var(--ds-transition-press), opacity var(--ds-transition-exit);}
button.sf-chip::before {content: ""; position: absolute; inset-inline: 0; inset-block: min(var(--ds-space-0), calc((var(--ds-size-touch) - 100%) / -2));}
.sf-chip .icon {inline-size: var(--ds-size-icon-xs); block-size: var(--ds-size-icon-xs); stroke-width: var(--ds-size-icon-stroke-sm);}
.sf-chip:has(> .icon:not(.sf-chip__check):first-child) {padding-inline-start: var(--ds-space-12);}
.sf-chip:has(> .sf-chip__remove) {padding-inline-end: var(--ds-space-4);}
button.sf-chip:hover {background: var(--ds-color-sunken); box-shadow: inset 0 0 0 var(--ds-border-hairline) var(--ds-color-border-strong);}
button.sf-chip:active {background: var(--ds-color-pressed); transform: scale(var(--ds-motion-scale-press));}
.sf-chip[aria-pressed="true"] {padding-inline-start: var(--ds-space-12); background: var(--ds-color-selected-chip); box-shadow: none; color: var(--ds-color-on-selected-chip);}
.sf-chip[disabled] {background: var(--ds-color-sunken); box-shadow: none; color: var(--ds-color-text-disabled); pointer-events: none;}
.sf-chip.is-leaving {opacity: 0; transform: scale(var(--ds-motion-scale-press));}
th[aria-sort="ascending"] .icon,
th[aria-sort="descending"] .icon {opacity: 1;}
th[aria-sort="descending"] .icon {transform: rotate(180deg);}
.sf-timeline {display: flex; flex-direction: column;}
.sf-timeline__item {--sf-tl-line: var(--ds-color-border-default); position: relative; display: grid; grid-template-columns: var(--ds-space-24) minmax(0, 1fr); gap: var(--ds-space-16); padding-block-end: var(--ds-space-24);}
.sf-timeline__item:last-child {padding-block-end: 0;}
.sf-timeline__item:not(:last-child)::before {content: ""; position: absolute; inset-block: calc(var(--ds-space-24) + var(--ds-space-4)) var(--ds-space-4); inset-inline-start: calc((var(--ds-space-24) - var(--ds-space-2)) / 2); inline-size: var(--ds-space-2); border-radius: var(--ds-radius-full); background: var(--sf-tl-line);}
.sf-timeline__marker {position: relative; display: grid; place-items: center; inline-size: var(--ds-space-24); block-size: var(--ds-space-24); border-radius: var(--ds-radius-full); background: var(--ds-color-raised); box-shadow: inset 0 0 0 var(--ds-space-2) var(--ds-color-text-disabled); color: var(--ds-color-text-3);}
.sf-timeline__marker .icon {inline-size: var(--ds-space-12); block-size: var(--ds-space-12); stroke-width: calc(var(--ds-size-icon-stroke-sm) + var(--ds-border-hairline) / 2);}
.sf-timeline__body {display: flex; flex-direction: column; min-inline-size: 0;}
.sf-timeline__head {display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 0 var(--ds-space-12);}
.sf-timeline__title {color: var(--ds-color-text-1); font-size: var(--ds-text-body-sm-size); line-height: var(--ds-text-body-sm-leading); font-weight: var(--ds-weight-bold);}
.sf-timeline__text {margin-block-start: var(--ds-space-4); color: var(--ds-color-text-2); font-size: var(--ds-text-body-sm-size); line-height: var(--ds-text-body-sm-leading); text-wrap: pretty;}
.sf-timeline__item.is-done {--sf-tl-line: var(--ds-color-brand-edge);}
.sf-timeline__item.is-done .sf-timeline__marker {background: var(--ds-color-brand-edge); box-shadow: none; color: var(--ds-color-text-inverse);}
.sf-timeline__item.is-current .sf-timeline__marker {background: var(--ds-color-selected-mark); box-shadow: 0 0 0 var(--ds-space-4) var(--ds-color-brand-subtle), inset 0 0 0 var(--ds-border-hairline) var(--ds-color-selected-mark-ring), inset 0 0 0 var(--ds-space-2) var(--ds-color-selected-mark-ring-2); color: var(--ds-color-on-selected-mark);}
.sf-timeline__item.is-current .sf-timeline__marker::after {content: ""; position: absolute; inset: calc(var(--ds-space-8) * -1); border-radius: inherit; box-shadow: inset 0 0 0 var(--ds-border-hairline) var(--ds-color-brand-line);}
@keyframes sf-progress-sweep {from { transform: translateX(calc(var(--sf-sign) * -100%)); } to { transform: translateX(calc(var(--sf-sign) * 250%)); }}
@keyframes sf-orbit {from { transform: rotate(-90deg); } to { transform: rotate(270deg); }}
@keyframes sf-breathe {from { opacity: 0; } to { opacity: 1; }}
.sf-empty {display: flex; flex-direction: column; align-items: center; gap: var(--ds-space-8); max-inline-size: var(--ds-layout-measure); margin-inline: auto; padding: var(--ds-space-40) var(--ds-space-24); text-align: center;}
.sf-empty--compact {flex-direction: row; flex-wrap: wrap; align-items: center; gap: var(--ds-space-12) var(--ds-space-16); inline-size: 100%; max-inline-size: none; margin-inline: 0; padding: var(--ds-space-16); border-radius: var(--ds-radius-card); box-shadow: inset 0 0 0 var(--ds-border-hairline) var(--ds-color-border-subtle); text-align: start;}
.sf-callout {--sf-callout-bg: var(--ds-color-sunken); --sf-callout-rail: var(--ds-color-border-strong); --sf-callout-tone: var(--ds-color-text-2); position: relative; display: flex; gap: var(--ds-space-12); padding: var(--ds-space-16) var(--ds-space-20) var(--ds-space-16) var(--ds-space-16); padding-inline-start: var(--ds-space-24); border-radius: var(--ds-radius-media); background: var(--sf-callout-bg); color: var(--ds-color-text-2); font-size: var(--ds-text-body-sm-size); line-height: var(--ds-text-body-sm-leading);}
.sf-callout::before {content: ""; position: absolute; inset-block: var(--ds-space-16); inset-inline-start: var(--ds-space-8); inline-size: var(--ds-space-4); border-radius: var(--ds-radius-full); background: var(--sf-callout-rail);}
.sf-callout--tip {--sf-callout-bg: var(--ds-color-brand-subtle); --sf-callout-rail: var(--ds-color-brand-edge); --sf-callout-tone: var(--ds-color-brand-ink);}
.sf-callout--info {--sf-callout-bg: var(--ds-color-info-bg); --sf-callout-rail: var(--ds-color-info-solid); --sf-callout-tone: var(--ds-color-info-fg);}
.sf-callout--warning {--sf-callout-bg: var(--ds-color-warning-bg); --sf-callout-rail: var(--ds-color-warning-solid); --sf-callout-tone: var(--ds-color-warning-fg);}
.sf-callout__icon {display: grid; flex: none; place-items: center; block-size: var(--ds-text-body-sm-leading); color: var(--sf-callout-tone);}
.sf-callout__icon .icon {inline-size: var(--ds-size-icon-sm); block-size: var(--ds-size-icon-sm);}
.sf-callout__body {flex: 1; min-inline-size: 0; text-wrap: pretty;}
.sf-callout__title {margin-block-end: var(--ds-space-2); color: var(--ds-color-text-1); font-weight: var(--ds-weight-bold);}
.sf-callout__body > :last-child {margin-block-end: 0;}
.sf-toast-region {position: fixed; inset-block-end: var(--ds-space-24); inset-inline: var(--ds-space-16); z-index: var(--ds-z-toast); display: flex; flex-direction: column; gap: var(--ds-space-8); pointer-events: none;}
@media (min-width: 768px) {
.sf-toast-region {inset-inline: auto var(--ds-space-24); inline-size: calc(var(--ds-space-128) * 3 + var(--ds-space-16));}
}
.sf-toast {--sf-toast-bg: var(--ds-color-sunken); --sf-toast-fg: var(--ds-color-text-2); position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: var(--ds-space-12); min-block-size: calc(var(--ds-space-48) + var(--ds-space-16)); padding: var(--ds-space-12); padding-inline-end: var(--ds-space-8); border-radius: var(--ds-radius-media); background: var(--ds-color-overlay); box-shadow: var(--ds-shadow-overlay); color: var(--ds-color-text-1); font-size: var(--ds-text-body-sm-size); line-height: var(--ds-text-body-sm-leading); pointer-events: auto;}
.sf-toast.is-leaving {opacity: 0; transform: translateY(var(--ds-space-8)); transition: opacity var(--ds-transition-exit), transform var(--ds-transition-exit);}
.sf-toast__icon {display: grid; place-items: center; inline-size: var(--ds-size-control-sm); block-size: var(--ds-size-control-sm); border-radius: var(--ds-radius-full); background: var(--sf-toast-bg); color: var(--sf-toast-fg);}
.sf-toast__icon .icon {inline-size: var(--ds-size-icon-sm); block-size: var(--ds-size-icon-sm);}
.sf-toast__body {display: flex; flex-direction: column; min-inline-size: 0;}
.sf-toast__title {font-weight: var(--ds-weight-bold);}
.sf-toast__text {color: var(--ds-color-text-2); font-size: var(--ds-text-label-size); line-height: var(--ds-text-label-leading);}
.sf-toast__text:empty {display: none;}
.sf-toast__side {display: flex; align-items: center; gap: var(--ds-space-4);}
.sf-toast__close .sf-ring {--sf-ring-track: var(--ds-color-track); --sf-ring-bar: var(--ds-color-text-2); --sf-ring-stroke: calc(var(--ds-space-2) * 1.5);}
.sf-toast__close .icon {inline-size: var(--ds-size-icon-xs); block-size: var(--ds-size-icon-xs); stroke-width: var(--ds-size-icon-stroke-sm);}
@keyframes sf-countdown {from { stroke-dashoffset: 0; } to { stroke-dashoffset: 100; }}
@media (max-width: 479px) {
.sf-toast:has(.sf-toast__action) {grid-template-columns: auto minmax(0, 1fr); row-gap: var(--ds-space-4);}
.sf-toast:has(.sf-toast__action) .sf-toast__icon {align-self: start;}
.sf-toast:has(.sf-toast__action) .sf-toast__body {padding-inline-end: var(--ds-size-control-sm);}
.sf-toast:has(.sf-toast__action) .sf-toast__side {grid-column: 2;}
.sf-toast:has(.sf-toast__action) .sf-toast__close {position: absolute; inset-block-start: var(--ds-space-12); inset-inline-end: var(--ds-space-8);}
}
.sf-header {--sf-hl-drop: calc(var(--ds-space-4) * -1); position: sticky; inset-block-start: 0; z-index: var(--ds-z-sticky); isolation: isolate; container: sf-header / inline-size; color: var(--ds-color-text-1); box-shadow: 0 var(--ds-border-hairline) 0 0 var(--ds-color-border-subtle); backdrop-filter: blur(var(--ds-space-16)); -webkit-backdrop-filter: blur(var(--ds-space-16));}
.sf-header::before {content: ""; position: absolute; inset: 0; z-index: -1; background: var(--ds-color-surface); opacity: var(--ds-opacity-80); pointer-events: none;}
.sf-header__strip {--ds-color-focus: var(--ds-color-brand); display: flex; align-items: center; justify-content: center; gap: var(--ds-space-24); block-size: var(--ds-space-40); padding-inline: var(--ds-space-20); background: var(--ds-color-stage); color: var(--ds-color-stage-ink-2); font-size: var(--ds-text-caption-size); line-height: var(--ds-text-caption-leading);}
.sf-header__rate {display: inline-flex; align-items: center; gap: var(--ds-space-8); min-inline-size: 0; white-space: nowrap;}
.sf-header__rate b {color: var(--ds-color-stage-ink); font-weight: var(--ds-weight-bold); font-variant-numeric: tabular-nums;}
.sf-header__rate .u-sep {margin-inline: var(--ds-space-4); background: var(--ds-color-stage-line);}
.sf-header__live {flex: none; inline-size: var(--ds-space-8); block-size: var(--ds-space-8); border-radius: var(--ds-radius-full); background: var(--ds-color-stage-accent); box-shadow: 0 0 0 var(--ds-space-4) var(--ds-color-stage-line);}
.sf-header__more,
.sf-header__links {display: none;}
.sf-header__links {align-items: center; gap: var(--ds-space-4);}
.sf-header__links a {position: relative; display: inline-flex; align-items: center; gap: var(--ds-space-8); block-size: var(--ds-space-32); padding-inline: var(--ds-space-8); border-radius: var(--ds-radius-pill); color: var(--ds-color-stage-ink-2); text-decoration: none;}
.sf-header__links a {z-index: var(--ds-z-raised);}
.sf-header__links a::after {content: ""; position: absolute; inset-inline: 0; inset-block: calc(var(--ds-space-4) * -1) calc(var(--ds-space-8) * -1);}
.sf-header__links a:hover {color: var(--ds-color-stage-ink); background: var(--ds-color-stage-raised);}
.sf-header__links .icon {inline-size: var(--ds-size-icon-xs); block-size: var(--ds-size-icon-xs); stroke-width: var(--ds-size-icon-stroke-sm);}
.sf-header__bar {display: grid; grid-template-columns: auto minmax(0, 1fr) auto; grid-template-areas: "menu logo actions" "search search search"; align-items: center; gap: var(--ds-space-8); padding: var(--ds-space-8) var(--ds-space-12) var(--ds-space-12);}
.sf-header__bar:has(> .sf-header__nav) {grid-template-areas: "menu logo actions" "search search search" "nav nav nav"; padding-block-end: var(--ds-space-4);}
.sf-header__bar > .sf-header__nav {grid-area: nav; margin-inline: calc(var(--ds-space-12) * -1); padding-inline: var(--ds-space-8); box-shadow: none;}
.sf-header__menu {grid-area: menu;}
.sf-header__logo {grid-area: logo; display: inline-flex; align-items: center; gap: var(--ds-space-8); justify-self: start; min-block-size: var(--ds-size-touch); color: inherit; text-decoration: none;}
.sf-header__logo .mark {flex: none; inline-size: auto; block-size: calc(var(--ds-space-24) + var(--ds-space-4)); aspect-ratio: 270.7 / 173.6;}
.sf-header__logo .word {flex: none; inline-size: auto; block-size: var(--ds-space-20); aspect-ratio: 358 / 92.14; color: var(--ds-color-logo-ink);}
.sf-header__actions {grid-area: actions; display: flex; align-items: center; gap: var(--ds-space-4);}
.sf-header__search {grid-area: search; position: relative; display: flex; align-items: center; gap: var(--ds-space-12); block-size: var(--ds-size-control-md); padding-inline: var(--ds-space-16) var(--ds-space-8); border-radius: var(--ds-radius-pill); background: var(--ds-color-sunken); box-shadow: inset 0 0 0 var(--ds-border-hairline) var(--ds-color-border-subtle); color: var(--ds-color-text-3);}
.sf-header__search > .icon {inline-size: var(--ds-size-icon-sm); block-size: var(--ds-size-icon-sm);}
.sf-header__search:hover {box-shadow: inset 0 0 0 var(--ds-border-hairline) var(--ds-color-border-default);}
.sf-header__search:has(input:focus) {background: var(--ds-color-raised); box-shadow: inset 0 0 0 var(--ds-border-focus-outer) var(--ds-color-brand-edge); color: var(--ds-color-text-2);}
.sf-header__search input {flex: 1; min-inline-size: 0; block-size: 100%; border: 0; background: none; color: var(--ds-color-text-1); font-size: var(--ds-text-body-size); line-height: var(--ds-text-body-leading); text-overflow: ellipsis; outline: none;}
.sf-header__search input::placeholder {color: var(--ds-color-text-3); opacity: 1;}
.sf-header__search input::-webkit-search-cancel-button {display: none;}
.sf-header__nav {position: relative; display: flex; align-items: center; gap: var(--ds-space-2); padding-inline: var(--ds-space-8); overflow-x: auto; scrollbar-width: none; box-shadow: inset 0 var(--ds-border-hairline) 0 0 var(--ds-color-border-subtle);}
.sf-header__nav::-webkit-scrollbar {display: none;}
.sf-header__nav:dir(rtl) {-webkit-mask-image: linear-gradient(to left, transparent, black var(--ds-space-32)); mask-image: linear-gradient(to left, transparent, black var(--ds-space-32));}
.sf-header__nav:dir(ltr) {-webkit-mask-image: linear-gradient(to right, transparent, black var(--ds-space-32)); mask-image: linear-gradient(to right, transparent, black var(--ds-space-32));}
.sf-header__link {position: relative; display: inline-flex; flex: none; align-items: center; gap: var(--ds-space-8); block-size: var(--ds-size-touch); padding-inline: var(--ds-space-12); border-radius: var(--ds-radius-pill); color: var(--ds-color-text-2); font-size: var(--ds-text-body-sm-size); line-height: var(--ds-text-body-sm-leading); font-weight: var(--ds-weight-medium); text-decoration: none; white-space: nowrap;}
.sf-header__link .icon {inline-size: var(--ds-size-icon-xs); block-size: var(--ds-size-icon-xs); stroke-width: var(--ds-size-icon-stroke-sm); transition: transform var(--ds-transition-move);}
.sf-header__link:hover {background: var(--ds-color-hover); color: var(--ds-color-text-1);}
.sf-header__link:active {background: var(--ds-color-pressed);}
.sf-header__link[aria-current="page"] {color: var(--ds-color-text-1); font-weight: var(--ds-weight-bold);}
.sf-header__nav .sf-header__link:focus-visible {outline-offset: calc(var(--ds-border-focus-outer) * -1);}
.sf-header__link[aria-current="page"]::after {content: ""; position: absolute; inset-block-end: var(--sf-hl-drop); inset-inline: var(--ds-space-12); block-size: var(--ds-space-2); border-start-start-radius: var(--ds-radius-full); border-start-end-radius: var(--ds-radius-full); background: var(--ds-color-text-1);}
.sf-header__link[aria-expanded="true"] {background: var(--ds-color-sunken); color: var(--ds-color-text-1);}
.sf-header__link[aria-expanded="true"] .icon:last-child {transform: rotate(180deg);}
@container sf-header (max-width: 279px) {
.sf-header__logo .word {display: none;}
}
@container sf-header (max-width: 359px) {
.sf-header__actions .sf-icon-button:not(.sf-header__cart) {display: none;}
}
@container sf-header (min-width: 768px) {
.sf-header:not(.sf-header--compact) .sf-header__strip {justify-content: space-between; padding-inline: var(--ds-space-24);}
.sf-header:not(.sf-header--compact) .sf-header__more,
.sf-header:not(.sf-header--compact) .sf-header__links {display: inline-flex;}
.sf-header:not(.sf-header--compact) .sf-header__bar {grid-template-columns: auto minmax(0, 1fr) auto; grid-template-areas: "logo search actions"; gap: var(--ds-space-24); padding: var(--ds-space-12) var(--ds-space-24);}
.sf-header:not(.sf-header--compact) .sf-header__bar:has(> .sf-header__nav) {grid-template-areas: "logo search actions" "nav nav nav"; padding-block-end: 0;}
.sf-header:not(.sf-header--compact) .sf-header__bar > .sf-header__nav {margin-inline: calc(var(--ds-space-24) * -1); padding-inline: var(--ds-space-16);}
.sf-header:not(.sf-header--compact) .sf-header__menu {display: none;}
.sf-header:not(.sf-header--compact) .sf-header__search {justify-self: end; inline-size: 100%; max-inline-size: calc(var(--ds-space-128) * 3 + var(--ds-space-64));}
.sf-header:not(.sf-header--compact) .sf-header__nav {padding-inline: var(--ds-space-16);}
.sf-header:not(.sf-header--compact) .sf-header__logo .word {block-size: var(--ds-space-24);}
.sf-header:not(.sf-header--compact) .sf-header__logo .mark {block-size: var(--ds-space-32);}
}
@container sf-header (min-width: 960px) {
.sf-header:not(.sf-header--compact) .sf-header__bar:has(> .sf-header__nav) {--sf-hl-drop: calc((var(--ds-space-64) + var(--ds-space-8) - var(--ds-size-touch)) / -2); grid-template-columns: auto auto minmax(0, 1fr) auto; grid-template-areas: "logo nav search actions"; block-size: calc(var(--ds-space-64) + var(--ds-space-8)); padding-block: 0;}
.sf-header:not(.sf-header--compact) .sf-header__bar > .sf-header__nav {align-self: stretch; margin: 0; padding: 0; overflow: visible; -webkit-mask-image: none; mask-image: none;}
.sf-header:not(.sf-header--compact) .sf-header__bar > .sf-header__nav .sf-header__link {align-self: center;}
}
.sf-breadcrumb ol {display: flex; flex-wrap: wrap; align-items: center; gap: 0 var(--ds-space-2);}
.sf-breadcrumb li {display: inline-flex; align-items: center; min-inline-size: 0;}
.sf-breadcrumb__link {position: relative; display: inline-flex; align-items: center; justify-content: center; gap: var(--ds-space-4); block-size: var(--ds-space-32); min-inline-size: var(--ds-size-touch); padding-inline: var(--ds-space-8); border-radius: var(--ds-radius-pill); color: var(--ds-color-text-2); font-size: var(--ds-text-label-size); line-height: var(--ds-text-label-leading); font-weight: var(--ds-weight-medium); text-decoration: none; white-space: nowrap;}
.sf-breadcrumb__link::after {content: ""; position: absolute; inset-inline: min(var(--ds-space-0), calc((var(--ds-size-touch) - 100%) / -2)); inset-block: calc((var(--ds-size-touch) - 100%) / -2);}
.sf-breadcrumb__link:hover {background: var(--ds-color-hover); color: var(--ds-color-text-1);}
.sf-breadcrumb__link:active {background: var(--ds-color-pressed); color: var(--ds-color-text-1);}
.sf-breadcrumb__sep {color: var(--ds-color-text-3);}
.sf-breadcrumb__sep .icon {inline-size: var(--ds-space-12); block-size: var(--ds-space-12); stroke-width: calc(var(--ds-size-icon-stroke-sm) + var(--ds-border-hairline) / 2);}
.sf-breadcrumb [aria-current="page"] {display: block; max-inline-size: calc(var(--ds-space-128) * 2); padding-inline: var(--ds-space-8); color: var(--ds-color-text-1); font-size: var(--ds-text-label-size); line-height: var(--ds-text-label-leading); font-weight: var(--ds-weight-bold); overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.sf-steps {display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr);}
.sf-steps__step {--sf-steps-line: var(--ds-color-border-default); position: relative; min-inline-size: 0;}
.sf-steps__step:not(:last-child)::after {content: ""; position: absolute; inset-block-start: calc((var(--ds-space-32) - var(--ds-space-2)) / 2); inset-inline: calc(var(--ds-space-32) + var(--ds-space-12)) var(--ds-space-12); block-size: var(--ds-space-2); border-radius: var(--ds-radius-full); background: var(--sf-steps-line);}
.sf-steps__step.is-done {--sf-steps-line: var(--ds-color-brand-edge);}
.sf-steps__link {display: flex; flex-direction: column; align-items: flex-start; gap: var(--ds-space-12); inline-size: 100%; border-radius: var(--ds-radius-control); color: inherit; text-align: start;}
button.sf-steps__link {position: relative; transition: transform var(--ds-transition-press);}
button.sf-steps__link::before {content: ""; position: absolute; inset: calc(var(--ds-space-4) * -1); border-radius: var(--ds-radius-control);}
button.sf-steps__link:hover::before {background: var(--ds-color-hover);}
button.sf-steps__link:active {transform: scale(var(--ds-motion-scale-press));}
button.sf-steps__link:focus-visible {outline-offset: var(--ds-space-4);}
.sf-steps__marker {position: relative; display: grid; flex: none; place-items: center; inline-size: var(--ds-space-32); block-size: var(--ds-space-32); border-radius: var(--ds-radius-full); background: var(--ds-color-raised); box-shadow: inset 0 0 0 var(--ds-space-2) var(--ds-color-text-disabled); color: var(--ds-color-text-3); font-size: var(--ds-text-label-size); line-height: 1; font-weight: var(--ds-weight-bold); font-variant-numeric: tabular-nums;}
.sf-steps__marker .icon {inline-size: var(--ds-size-icon-xs); block-size: var(--ds-size-icon-xs); stroke-width: calc(var(--ds-size-icon-stroke-sm) + var(--ds-border-hairline) / 2);}
.sf-steps__label {position: relative; display: flex; flex-direction: column; min-inline-size: 0; font-size: var(--ds-text-body-sm-size); line-height: var(--ds-text-body-sm-leading);}
.sf-steps__label strong {color: var(--ds-color-text-2); font-weight: var(--ds-weight-semibold);}
.sf-steps__label small {display: none; color: var(--ds-color-text-3); font-size: var(--ds-text-caption-size); line-height: var(--ds-text-caption-leading);}
.sf-steps__step.is-done .sf-steps__marker {background: var(--ds-color-brand-edge); box-shadow: none; color: var(--ds-color-text-inverse);}
.sf-steps__step.is-done .sf-steps__label strong {color: var(--ds-color-text-1);}
.sf-steps__step.is-current .sf-steps__marker {background: var(--ds-color-selected-mark); box-shadow: 0 0 0 var(--ds-space-4) var(--ds-color-brand-subtle), inset 0 0 0 var(--ds-border-hairline) var(--ds-color-selected-mark-ring), inset 0 0 0 var(--ds-space-2) var(--ds-color-selected-mark-ring-2); color: var(--ds-color-on-selected-mark);}
.sf-steps__step.is-current .sf-steps__label strong {color: var(--ds-color-text-1); font-weight: var(--ds-weight-bold);}
@media (min-width: 768px) {
.sf-steps__label small {display: block;}
}
.sf-steps--vertical {display: flex; flex-direction: column;}
.sf-steps--vertical .sf-steps__step {padding-block-end: var(--ds-space-24);}
.sf-steps--vertical .sf-steps__step:last-child {padding-block-end: 0;}
.sf-steps--vertical .sf-steps__step:not(:last-child)::after {inset-block: calc(var(--ds-space-32) + var(--ds-space-8)) var(--ds-space-8); inset-inline: calc((var(--ds-space-32) - var(--ds-space-2)) / 2) auto; inline-size: var(--ds-space-2); block-size: auto;}
.sf-steps--vertical .sf-steps__link {flex-direction: row; align-items: flex-start; gap: var(--ds-space-16);}
.sf-steps--vertical .sf-steps__label {padding-block-start: var(--ds-space-4);}
.sf-steps--vertical .sf-steps__label small {display: block;}
.sf-layer {position: fixed; inset: 0; z-index: var(--ds-z-modal); display: flex; align-items: center; justify-content: center; padding: var(--ds-space-16); visibility: hidden; transition: visibility 0s var(--ds-duration-slow);}
.sf-layer.is-open {visibility: visible; transition-delay: 0s;}
.sf-layer__scrim {position: absolute; inset: 0; background: var(--ds-color-scrim); opacity: 0; transition: opacity var(--ds-transition-exit);}
.sf-layer.is-open .sf-layer__scrim {opacity: 1; transition: opacity var(--ds-transition-overlay);}
.sf-layer > :not(.sf-layer__scrim) {position: relative; opacity: 0; transform: translateY(var(--ds-move-settle-distance)) scale(var(--ds-motion-scale-press)); transition: opacity var(--ds-transition-exit), transform var(--ds-transition-exit);}
.sf-layer.is-open > :not(.sf-layer__scrim) {opacity: 1; transform: none; transition: opacity var(--ds-transition-overlay), transform var(--ds-duration-deliberate) var(--ds-ease-out-expo);}
html.sf-scroll-lock {overflow: hidden;}
.sf-drawer__head {display: flex; flex: none; align-items: flex-start; gap: var(--ds-space-12); padding-block: var(--ds-space-24) var(--ds-space-8); padding-inline: var(--ds-space-24) var(--ds-space-16);}
.sf-drawer__titles {flex: 1; min-inline-size: 0; padding-block-start: var(--ds-space-4);}
.sf-drawer__title {font-size: var(--ds-text-h4-size); line-height: var(--ds-text-h4-leading); font-weight: var(--ds-weight-extrabold); text-wrap: balance;}
.sf-drawer__desc {margin-block-start: var(--ds-space-4); color: var(--ds-color-text-2); font-size: var(--ds-text-body-sm-size); line-height: var(--ds-text-body-sm-leading); text-wrap: balance;}
.sf-drawer__head .sf-icon-button {margin-block-start: calc(var(--ds-space-4) * -1);}
.sf-drawer__body {flex: 1; min-block-size: 0; padding: var(--ds-space-8) var(--ds-space-24) var(--ds-space-24); overflow-y: auto; color: var(--ds-color-text-2); font-size: var(--ds-text-body-sm-size); line-height: var(--ds-text-body-sm-leading);}
.sf-drawer__foot {display: flex; flex: none; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: var(--ds-space-8); padding: var(--ds-space-16) var(--ds-space-24) var(--ds-space-24);}
.sf-lock {display: flex; flex-wrap: wrap; align-items: center; gap: var(--ds-space-12); margin-block-start: var(--ds-space-4); padding: var(--ds-space-12) var(--ds-space-16) var(--ds-space-12) var(--ds-space-12); border-radius: var(--ds-radius-media); background: var(--ds-color-spotlight); box-shadow: inset 0 0 0 var(--ds-border-hairline) var(--ds-color-brand-line);}
.sf-lock .sf-ring {--sf-ring-track: var(--ds-color-brand-line);}
.sf-lock__text {display: flex; flex: 1 1 calc(var(--ds-space-128) + var(--ds-space-32)); flex-direction: column; min-inline-size: 0; color: var(--ds-color-text-2); font-size: var(--ds-text-caption-size); line-height: var(--ds-text-caption-leading);}
.sf-lock__text b {color: var(--ds-color-text-1); font-size: var(--ds-text-label-size); line-height: var(--ds-text-label-leading); font-weight: var(--ds-weight-bold);}
@media (max-width: 479px) {
.sf-drawer__head {padding-inline: var(--ds-space-16) var(--ds-space-8);}
.sf-drawer__body {padding-inline: var(--ds-space-16);}
.sf-drawer__foot {padding-inline: var(--ds-space-16);}
}
.sf-layer--drawer {align-items: stretch; justify-content: flex-end; padding: 0;}
.sf-drawer {--sf-drawer-w: calc(var(--ds-space-128) * 3 + var(--ds-space-16)); display: flex; flex-direction: column; inline-size: min(100%, var(--sf-drawer-w)); block-size: 100%; border-start-start-radius: var(--ds-radius-sheet); border-end-start-radius: var(--ds-radius-sheet); background: var(--ds-color-overlay); box-shadow: var(--ds-shadow-modal); color: var(--ds-color-text-1); overflow: hidden;}
.sf-drawer__head {box-shadow: inset 0 calc(var(--ds-border-hairline) * -1) 0 0 var(--ds-color-border-subtle); padding-block-end: var(--ds-space-16);}
.sf-drawer__body {padding-block-start: var(--ds-space-20);}
.sf-drawer__foot {box-shadow: inset 0 var(--ds-border-hairline) 0 0 var(--ds-color-border-subtle); padding-block: var(--ds-space-16);}
.sf-drawer__foot > .sf-button--primary {flex: 1 1 auto;}
.sf-drawer__group {display: flex; flex-direction: column; gap: var(--ds-space-12);}
.sf-drawer__group + .sf-drawer__group {margin-block-start: var(--ds-space-24);}
.sf-drawer__label {display: flex; align-items: baseline; justify-content: space-between; gap: var(--ds-space-8); color: var(--ds-color-text-1); font-size: var(--ds-text-label-size); line-height: var(--ds-text-label-leading); font-weight: var(--ds-weight-bold);}
.sf-drawer__label small {color: var(--ds-color-text-3); font-size: var(--ds-text-caption-size); font-weight: var(--ds-weight-medium);}
.sf-layer.sf-layer--drawer > .sf-drawer {opacity: 1; transform: translateX(calc(var(--sf-sign) * 100%)); transition: transform var(--ds-transition-exit);}
.sf-layer.sf-layer--drawer.is-open > .sf-drawer {transform: none; transition: transform var(--ds-duration-deliberate) var(--ds-ease-out-expo);}
@media (max-width: 767px) {
.sf-layer--drawer {align-items: flex-end; justify-content: center;}
.sf-layer--drawer > .sf-drawer {inline-size: 100%; block-size: auto; max-block-size: 88%; border-radius: var(--ds-radius-sheet) var(--ds-radius-sheet) 0 0;}
.sf-layer.sf-layer--drawer > .sf-drawer {transform: translateY(100%);}
.sf-layer.sf-layer--drawer.is-open > .sf-drawer {transform: none;}
.sf-layer--drawer > .sf-drawer::before {content: ""; align-self: center; flex: none; inline-size: var(--ds-space-40); block-size: var(--ds-space-4); margin-block-start: var(--ds-space-8); border-radius: var(--ds-radius-full); background: var(--ds-color-well);}
}
@media (prefers-reduced-motion: reduce) {
.sf-layer.sf-layer--drawer > .sf-drawer {opacity: 0; transform: none; transition: opacity var(--ds-transition-exit);}
.sf-layer.sf-layer--drawer.is-open > .sf-drawer {opacity: 1; transition: opacity var(--ds-transition-enter);}
.sf-layer > :not(.sf-layer__scrim) {transform: none;}
}
.sf-pop-wrap {position: relative; display: inline-flex;}
.sf-pop {position: absolute; z-index: var(--ds-z-dropdown); inset-block-start: calc(100% + var(--ds-space-8)); inset-inline-start: 0; min-inline-size: calc(var(--ds-space-128) + var(--ds-space-96)); max-inline-size: min(calc(var(--ds-space-128) * 3), calc(100vw - var(--ds-space-32))); border-radius: var(--ds-radius-media); background: var(--ds-color-overlay); box-shadow: var(--ds-shadow-overlay); color: var(--ds-color-text-1); opacity: 0; visibility: hidden; transform: translateY(calc(var(--ds-space-8) * -1)) scale(var(--ds-motion-scale-press)); transform-origin: 50% 0; transition: opacity var(--ds-transition-exit), transform var(--ds-transition-exit), visibility 0s var(--ds-duration-fast);}
.sf-pop.is-open {opacity: 1; visibility: visible; transform: none; transition: opacity var(--ds-transition-enter), transform var(--ds-transition-enter), visibility 0s;}
.sf-menu {display: flex; flex-direction: column; gap: var(--ds-space-2); padding: var(--ds-space-8);}
.sf-menu__item {position: relative; display: flex; align-items: center; gap: var(--ds-space-12); min-block-size: var(--sf-hit); padding-inline: var(--ds-space-12); border-radius: var(--ds-radius-tag); color: var(--ds-color-text-1); font-size: var(--ds-text-body-sm-size); line-height: var(--ds-text-body-sm-leading); font-weight: var(--ds-weight-medium); text-align: start; text-decoration: none;}
.sf-menu__item .icon {flex: none; inline-size: var(--ds-size-icon-sm); block-size: var(--ds-size-icon-sm); color: var(--ds-color-text-3);}
.sf-menu__item > span:first-of-type {flex: 1; min-inline-size: 0;}
.sf-menu__item:hover,
.sf-menu__item:focus-visible {background: var(--ds-color-sunken);}
.sf-menu__item:hover .icon {color: var(--ds-color-text-1);}
.sf-menu__item:active {background: var(--ds-color-pressed);}
.sf-menu__item:focus-visible {outline-offset: calc(var(--ds-border-focus-outer) * -1);}
.sf-menu__item[aria-disabled="true"] {color: var(--ds-color-text-disabled); pointer-events: none;}
.sf-menu__item[aria-disabled="true"] .icon {color: var(--ds-color-text-disabled);}
.sf-menu__item[aria-checked="true"] {font-weight: var(--ds-weight-bold);}
.sf-menu__label {padding: var(--ds-space-8) var(--ds-space-12) var(--ds-space-4); color: var(--ds-color-text-3); font-size: var(--ds-text-caption-size); line-height: var(--ds-text-caption-leading); font-weight: var(--ds-weight-semibold);}
.sf-menu__sep {box-sizing: content-box; block-size: var(--ds-border-hairline); margin-inline: var(--ds-space-4); padding-block: var(--ds-space-4); background: var(--ds-color-border-subtle); background-clip: content-box;}
.sf-store-badge[aria-pressed]::after {content: ""; position: absolute; inset-block: calc((100% - var(--ds-size-touch)) / 2); inset-inline: min(calc((100% - var(--ds-size-touch)) / 2), calc(var(--ds-space-4) * -1));}
.sf-price {position: relative; --sf-price-size: var(--ds-text-h4-size); --sf-price-leading: var(--ds-text-h4-leading); --sf-price-unit: var(--ds-text-caption-size); display: flex; flex-direction: column; align-items: flex-start; gap: var(--ds-space-4); min-inline-size: 0; color: var(--ds-color-text-1);}
.sf-price__now {display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--ds-space-4) var(--ds-space-8); margin: 0;}
.sf-price__value {font-size: var(--sf-price-size); line-height: var(--sf-price-leading); font-weight: var(--ds-weight-extrabold); font-variant-numeric: tabular-nums; white-space: nowrap;}
.sf-price__unit {color: var(--ds-color-text-3); font-size: var(--sf-price-unit); line-height: var(--ds-text-caption-leading); font-weight: var(--ds-weight-semibold);}
.sf-price__meta {display: flex; flex-wrap: wrap; align-items: center; gap: var(--ds-space-4) var(--ds-space-12); color: var(--ds-color-text-3); font-size: var(--ds-text-caption-size); line-height: var(--ds-text-caption-leading);}
.sf-price__ref {font-variant-numeric: tabular-nums; white-space: nowrap;}
@starting-style {.sf-price__rate-wrap:hover > .sf-price__tip, .sf-price__rate:focus-visible + .sf-price__tip, .sf-price__rate[aria-expanded="true"] + .sf-price__tip { opacity: 0; transform: translateY(calc(var(--ds-space-4) * -1)); }}
.sf-store-badge {--sf-store-fill: var(--ds-color-inverse); --sf-store-ink: var(--ds-color-text-2); --sf-store-subtle: var(--ds-color-sunken); position: relative; display: inline-flex; flex: none; align-items: center; gap: var(--ds-space-8); block-size: var(--ds-space-32); margin: 0; padding-inline: var(--ds-space-4) var(--ds-space-12); border: 0; border-radius: var(--ds-radius-pill); background: var(--sf-store-subtle); color: var(--sf-store-ink); font: inherit; font-size: var(--ds-text-label-size); line-height: var(--ds-text-label-leading); font-weight: var(--ds-weight-semibold); white-space: nowrap; text-decoration: none;}
.sf-store-badge__mark {display: inline-grid; flex: none; place-items: center; inline-size: var(--ds-space-24); block-size: var(--ds-space-24); border-radius: var(--ds-radius-full); background: var(--sf-store-fill); color: var(--ds-color-surface); font-size: var(--ds-text-micro-size); line-height: 1; font-weight: var(--ds-weight-extrabold);}
.sf-store-badge--source {--sf-store-subtle: transparent; --sf-store-ink: var(--ds-color-text-2); gap: var(--ds-space-4); padding-inline: 0; font-weight: var(--ds-weight-medium);}
.sf-store-badge--source .sf-store-badge__mark {inline-size: var(--ds-space-16); block-size: var(--ds-space-16); border-radius: var(--ds-radius-mark); background: var(--ds-color-inverse); color: var(--ds-color-text-inverse);}
.sf-store-badge--sm {gap: var(--ds-space-8); block-size: var(--ds-space-24); padding-inline: var(--ds-space-8) var(--ds-space-8); font-size: var(--ds-text-caption-size); line-height: var(--ds-text-caption-leading);}
.sf-store-badge--sm .sf-store-badge__mark {inline-size: var(--ds-space-8); block-size: var(--ds-space-8);}
.sf-store-badge--sm .sf-store-badge__mark .icon {display: none;}
.sf-store-badge--source.sf-store-badge--sm {gap: var(--ds-space-4); padding-inline: 0;}
.sf-store-badge--source.sf-store-badge--sm .sf-store-badge__mark {inline-size: var(--ds-space-16); block-size: var(--ds-space-16);}
button.sf-store-badge {cursor: pointer;}
button.sf-store-badge::after {content: ""; position: absolute; inset-block: calc((var(--ds-size-touch) - 100%) / -2); inset-inline: 0;}
button.sf-store-badge:hover {box-shadow: inset 0 0 0 var(--ds-border-hairline) var(--sf-store-fill);}
button.sf-store-badge:active {transform: scale(var(--ds-motion-scale-press));}
.sf-store-badge[aria-pressed="true"] {box-shadow: inset 0 0 0 var(--ds-space-2) var(--sf-store-fill);}
.sf-product-card {display: flex; flex-direction: column; inline-size: 100%; min-inline-size: 0; container-type: inline-size; padding: var(--ds-space-8); border-radius: var(--ds-radius-card); background: var(--ds-color-raised); box-shadow: inset 0 0 0 var(--ds-border-hairline) var(--ds-color-border-subtle); color: var(--ds-color-text-1);}
.sf-product-card__media {position: relative; display: grid; place-items: center; block-size: round(down, calc(100cqi - var(--ds-space-16)), var(--ds-space-4)); border-radius: var(--ds-radius-media); background: var(--ds-color-sunken); color: var(--ds-color-text-1);}
.sf-product-card__body {display: flex; flex: 1; flex-direction: column; gap: var(--ds-space-8); min-inline-size: 0; padding: var(--ds-space-16) var(--ds-space-12) var(--ds-space-12);}
.sf-product-card__meta {display: flex; align-items: center; justify-content: space-between; gap: var(--ds-space-8); min-inline-size: 0;}
:is(.sf-product-card, .sf-deal-card) .sf-price {pointer-events: none;}
:is(.sf-product-card, .sf-deal-card) .sf-price :is(a, button) {pointer-events: auto;}
@container (max-width: 239px) {
.sf-product-card .sf-price {--sf-price-size: var(--ds-text-body-size); --sf-price-leading: var(--ds-text-body-leading);}
}
@keyframes sf-cai-breathe {0%, 100% { opacity: var(--ds-opacity-24); } 40% { opacity: 1; }}
@keyframes sf-cai-blink {0%, 45% { opacity: 1; } 55%, 100% { opacity: 0; }}
.sf-linkreq {container-type: inline-size; inline-size: 100%;}
.sf-linkreq__frame {display: grid; grid-template-columns: minmax(0, 1fr); row-gap: var(--ds-space-24);}
.sf-linkreq__stage {grid-area: 1 / 1 / 2 / -1; padding: 0;}
.sf-linkreq__pitch {--ds-color-focus: var(--ds-color-brand); position: relative; grid-area: 1 / 1; min-inline-size: 0; padding: var(--ds-space-32) var(--ds-space-20); color: var(--ds-color-stage-ink);}
.sf-linkreq__result {--sf-linkreq-line: var(--ds-color-border-default); --sf-linkreq-ink: var(--ds-color-text-2); --sf-linkreq-ink-1: var(--ds-color-text-1); position: relative; grid-area: 2 / 1; min-inline-size: 0;}
@container (min-width: 560px) {
.sf-linkreq__pitch {padding: var(--ds-space-40);}
}
@container (min-width: 880px) {
.sf-linkreq__frame {grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr); column-gap: var(--ds-space-24);}
.sf-linkreq__pitch {align-self: center; padding-block: var(--ds-space-64); padding-inline: var(--ds-space-64) 0;}
.sf-linkreq__result {--sf-linkreq-line: var(--ds-color-stage-line); --sf-linkreq-ink: var(--ds-color-stage-ink-2); --sf-linkreq-ink-1: var(--ds-color-stage-ink); grid-area: 1 / 2; align-self: center; padding-block: var(--ds-space-40); padding-inline: 0 var(--ds-space-40);}
.sf-linkreq__sheet {--sf-stack-peek: var(--ds-color-stage-raised);}
}
.sf-linkreq__title {margin-block: var(--ds-space-20) var(--ds-space-12); font-size: var(--ds-text-h3-size); line-height: var(--ds-text-h3-leading); font-weight: var(--ds-weight-extrabold); text-wrap: balance;}
.sf-linkreq__title em {display: block; color: var(--ds-color-stage-accent); font-style: normal;}
.sf-linkreq__lead {max-inline-size: calc(var(--ds-space-128) * 4); font-size: var(--ds-text-body-size); line-height: var(--ds-text-body-leading);}
@container (min-width: 560px) {
.sf-linkreq__title {font-size: var(--ds-text-h1-size); line-height: var(--ds-text-h1-leading);}
.sf-linkreq__lead {font-size: var(--ds-text-body-lg-size); line-height: var(--ds-text-body-lg-leading);}
}
.sf-linkreq__form {margin-block-start: var(--ds-space-32);}
.sf-linkreq__field {display: flex; flex-wrap: wrap; align-items: center; gap: var(--ds-space-8) var(--ds-space-4); padding: var(--ds-space-12); padding-inline-start: var(--ds-space-16); border-radius: var(--ds-radius-card); background: var(--ds-color-link-field); box-shadow: inset 0 0 0 var(--ds-border-hairline) var(--ds-color-link-field-line); color: var(--ds-color-text-1);}
.sf-linkreq__field:has(.sf-linkreq__control:focus) {box-shadow: inset 0 0 0 var(--ds-border-focus-outer) var(--ds-color-brand-edge);}
.sf-linkreq__icon {color: var(--ds-color-text-3);}
.sf-linkreq__control {flex: 1 1 0; inline-size: 0; min-inline-size: 0; block-size: var(--ds-size-control-md); padding: 0; border: 0; background: none; color: var(--ds-color-text-1); font-family: inherit; font-size: var(--ds-text-body-size); font-weight: var(--ds-weight-medium); text-align: left; direction: ltr;}
.sf-linkreq__control:focus-visible {outline: 0;}
.sf-linkreq__control::placeholder {color: var(--ds-color-text-3);}
.sf-linkreq__go {flex: 1 1 100%;}
@container (min-width: 560px) {
.sf-linkreq__field {flex-wrap: nowrap; padding: var(--ds-space-8); padding-inline-start: var(--ds-space-20); border-radius: var(--ds-radius-pill);}
.sf-linkreq__go {flex: none;}
}
.sf-linkreq__sources {display: flex; flex-wrap: wrap; align-items: center; gap: var(--ds-space-8); margin-block-start: var(--ds-space-20); color: var(--ds-color-stage-ink-2); font-size: var(--ds-text-caption-size); line-height: var(--ds-text-caption-leading);}
.sf-linkreq__chip {display: inline-flex; align-items: center; gap: var(--ds-space-8); block-size: calc(var(--ds-space-24) + var(--ds-space-4)); padding-inline: var(--ds-space-4) var(--ds-space-12); border-radius: var(--ds-radius-pill); box-shadow: inset 0 0 0 var(--ds-border-hairline) var(--ds-color-stage-line); color: var(--ds-color-stage-ink); font-weight: var(--ds-weight-semibold);}
.sf-linkreq__chip i {display: inline-grid; place-items: center; inline-size: var(--ds-space-20); block-size: var(--ds-space-20); border-radius: var(--ds-radius-full); background: var(--ds-color-stage-ink); color: var(--ds-color-stage); font-size: var(--ds-text-micro-size); line-height: 1; font-weight: var(--ds-weight-extrabold); font-style: normal;}
.sf-linkreq__sheet .sf-button {margin-block-start: var(--ds-space-16);}
.sf-legal {container-type: inline-size; inline-size: 100%; display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--ds-space-32); min-inline-size: 0; color: var(--ds-color-text-1);}
.sf-legal__head {display: grid; justify-items: start; gap: var(--ds-space-12);}
.sf-legal__kicker {display: flex; align-items: center; gap: var(--ds-space-8); color: var(--ds-color-brand-ink); font-size: var(--ds-text-label-size); line-height: var(--ds-text-label-leading); font-weight: var(--ds-text-label-weight);}
.sf-legal__kicker::before {content: ""; inline-size: var(--ds-space-16); block-size: var(--ds-space-2); border-radius: var(--ds-radius-full); background: var(--ds-color-brand-edge);}
.sf-legal__title {margin: 0; font-size: var(--ds-text-h2-size); line-height: var(--ds-text-h2-leading); font-weight: var(--ds-weight-extrabold); text-wrap: balance;}
.sf-legal__stamp {display: flex; flex-wrap: wrap; margin: var(--ds-space-4) 0 0; border-radius: var(--ds-radius-control); background: var(--ds-color-sunken); box-shadow: inset 0 0 0 var(--ds-border-hairline) var(--ds-color-border-subtle);}
.sf-legal__stamp > div {position: relative; display: grid; padding: var(--ds-space-8) var(--ds-space-16);}
.sf-legal__stamp > div + div::before {content: ""; position: absolute; inset-block: var(--ds-space-12); inset-inline-start: 0; inline-size: var(--ds-border-hairline); background: var(--ds-color-border-default);}
.sf-legal__stamp dt {color: var(--ds-color-text-3); font-size: var(--ds-text-micro-size); line-height: var(--ds-text-micro-leading);}
.sf-legal__stamp dd {margin: 0; font-size: var(--ds-text-label-size); line-height: var(--ds-text-label-leading); font-weight: var(--ds-weight-bold);}
.sf-legal__summary {display: grid; gap: var(--ds-space-12); max-inline-size: var(--ds-layout-measure); padding: var(--ds-space-20); border-radius: var(--ds-radius-media); background: var(--ds-color-brand-subtle); box-shadow: inset 0 0 0 var(--ds-border-hairline) var(--ds-color-brand-line);}
.sf-legal__summary-title {color: var(--ds-color-brand-ink); font-size: var(--ds-text-label-size); line-height: var(--ds-text-label-leading); font-weight: var(--ds-weight-bold);}
.sf-legal__summary ul {display: grid; gap: var(--ds-space-8); margin: 0; padding: 0; list-style: none;}
.sf-legal__summary li {display: flex; align-items: flex-start; gap: var(--ds-space-8); font-size: var(--ds-text-body-sm-size); line-height: var(--ds-text-body-sm-leading);}
.sf-legal__summary .icon {margin-block-start: var(--ds-space-4); color: var(--ds-color-brand-ink);}
.sf-legal__layout {display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--ds-space-32);}
.sf-legal__toc {padding: var(--ds-space-12); border-radius: var(--ds-radius-media); background: var(--ds-color-sunken);}
.sf-legal__toc-title {padding-inline: var(--ds-space-12); margin-block-end: var(--ds-space-4); color: var(--ds-color-text-3); font-size: var(--ds-text-caption-size); line-height: var(--ds-text-caption-leading); font-weight: var(--ds-weight-semibold);}
.sf-legal__toc ol {display: grid; gap: var(--ds-space-2); margin: 0; padding: 0; list-style: none;}
.sf-legal__toc a {position: relative; display: flex; align-items: center; gap: var(--ds-space-12); min-block-size: var(--ds-size-touch); padding-inline: var(--ds-space-12); border-radius: var(--ds-radius-control); color: var(--ds-color-text-2); font-size: var(--ds-text-body-sm-size); line-height: var(--ds-text-body-sm-leading); text-decoration: none;}
.sf-legal__toc a:hover {background: var(--ds-color-hover); color: var(--ds-color-text-1);}
.sf-legal__toc a[aria-current="true"] {background: var(--ds-color-raised); color: var(--ds-color-text-1); font-weight: var(--ds-weight-bold); box-shadow: var(--ds-shadow-resting);}
.sf-legal__toc a[aria-current="true"]::before {content: ""; position: absolute; inset-block: var(--ds-space-12); inset-inline-start: 0; inline-size: var(--ds-space-2); border-radius: var(--ds-radius-full); background: var(--ds-color-text-1);}
.sf-legal__n {flex: none; min-inline-size: var(--ds-space-20); color: var(--ds-color-text-3); font-weight: var(--ds-weight-semibold);}
.sf-legal__content {display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--ds-space-40); max-inline-size: var(--ds-layout-measure); min-inline-size: 0;}
.sf-legal__section {scroll-margin-block-start: calc(var(--ds-layout-topbar) + var(--ds-space-24));}
.sf-legal__h {display: flex; align-items: baseline; gap: var(--ds-space-12); margin: 0 0 var(--ds-space-12); font-size: var(--ds-text-h4-size); line-height: var(--ds-text-h4-leading); font-weight: var(--ds-weight-extrabold);}
.sf-legal__h .sf-legal__n {min-inline-size: var(--ds-space-24); color: var(--ds-color-brand-ink);}
.sf-legal__clauses {display: grid; gap: var(--ds-space-12); margin: 0; padding: 0; list-style: none;}
.sf-legal__clause {display: grid; grid-template-columns: var(--ds-space-40) minmax(0, 1fr); gap: var(--ds-space-12);}
.sf-legal__clause .sf-legal__n {padding-block-start: var(--ds-space-4); font-size: var(--ds-text-caption-size); line-height: var(--ds-text-caption-leading);}
.sf-legal__clause p {font-size: var(--ds-text-body-size); line-height: var(--ds-text-body-leading); text-wrap: pretty;}
@container (min-width: 560px) {
.sf-legal__title {font-size: var(--ds-text-h1-size); line-height: var(--ds-text-h1-leading);}
}
@container (min-width: 800px) {
.sf-legal__layout {grid-template-columns: calc(var(--ds-space-128) * 2) minmax(0, 1fr); gap: var(--ds-space-48);}
.sf-legal__toc {position: sticky; inset-block-start: calc(var(--ds-layout-topbar) + var(--ds-space-24)); align-self: start;}
}
.sf-accordion {display: flex; flex-direction: column; min-inline-size: 0; border-radius: var(--ds-radius-card); background: var(--ds-color-raised); box-shadow: inset 0 0 0 var(--ds-border-hairline) var(--ds-color-border-subtle);}
.sf-accordion__item {position: relative;}
.sf-accordion__item + .sf-accordion__item::before {content: ""; position: absolute; inset-block-start: 0; inset-inline: var(--ds-space-20); block-size: var(--ds-border-hairline); background: var(--ds-color-border-subtle);}
.sf-accordion__head {margin: 0; font: inherit;}
.sf-accordion__trigger {position: relative; display: flex; align-items: center; gap: var(--ds-space-12); inline-size: 100%; min-block-size: calc(var(--ds-space-8) * 8); padding: var(--ds-space-12) var(--ds-space-20); border-radius: var(--ds-radius-card); color: var(--ds-color-text-1); font-size: var(--ds-text-body-size); line-height: var(--ds-text-body-leading); font-weight: var(--ds-weight-semibold); text-align: start;}
.sf-accordion__trigger:hover {background: var(--ds-color-hover);}
.sf-accordion__trigger:focus-visible {outline-offset: calc(var(--ds-border-focus-inner) * -1);}
.sf-accordion__label {display: flex; flex: 1; flex-direction: column; min-inline-size: 0;}
.sf-accordion__chevron {display: inline-grid; flex: none; place-items: center; inline-size: var(--ds-space-32); block-size: var(--ds-space-32); border-radius: var(--ds-radius-full); box-shadow: inset 0 0 0 var(--ds-border-hairline) var(--ds-color-border-default); color: var(--ds-color-text-2);}
.sf-accordion__chevron .icon {transition: transform var(--ds-transition-move);}
.sf-accordion__trigger[aria-expanded="true"] .sf-accordion__chevron,
.sf-accordion__trigger.is-open .sf-accordion__chevron {background: var(--ds-color-inverse); box-shadow: none; color: var(--ds-color-text-inverse);}
.sf-accordion__trigger[aria-expanded="true"] .sf-accordion__chevron .icon,
.sf-accordion__trigger.is-open .sf-accordion__chevron .icon {transform: scaleY(-1);}
.sf-accordion__panel {padding: 0 var(--ds-space-20) var(--ds-space-20); padding-inline-start: calc(var(--ds-space-20) + var(--ds-space-24) + var(--ds-space-12)); color: var(--ds-color-text-2); font-size: var(--ds-text-body-sm-size); line-height: var(--ds-text-body-sm-leading);}
.sf-accordion--plain .sf-accordion__panel {padding-inline-start: var(--ds-space-20);}
.sf-accordion__panel[hidden] {display: none;}
.sf-accordion__panel > * + * {margin-block-start: var(--ds-space-12);}
.sf-accordion__trigger:disabled {color: var(--ds-color-text-disabled); cursor: not-allowed;}
.sf-accordion__trigger:disabled:hover {background: transparent;}
.sf-accordion__trigger:disabled .sf-accordion__chevron {opacity: var(--ds-opacity-disabled);}
.sf-accordion--boxed {gap: var(--ds-space-8); background: transparent; box-shadow: none;}
.sf-accordion--boxed .sf-accordion__item {border-radius: var(--ds-radius-card); background: var(--ds-color-raised); box-shadow: inset 0 0 0 var(--ds-border-hairline) var(--ds-color-border-subtle);}
.sf-accordion--boxed .sf-accordion__item + .sf-accordion__item::before {display: none;}
.sf-accordion--boxed .sf-accordion__item.is-open {box-shadow: inset 0 0 0 var(--ds-border-hairline) var(--ds-color-border-default);}
[data-ld-bulk-view] {display: contents;}
[data-ld-bulk-view][hidden] {display: none;}
[data-ld-part] {position: relative;}
:is(.sf-app-shell, .sf-page-header, .sf-panel, .sf-accordion, .sf-bulkbar, .sf-filterbar, .sf-form-layout, .sf-resource,
    .sf-chart, .sf-kanban, .sf-diff, .sf-permissions, .sf-setting, .sf-id, .sf-inline-edit, .sf-notify, .sf-live-list,
    .sf-conflict) [hidden] {display: none;}
body {background: var(--ds-color-canvas);}
.sf-note[hidden] {display: none;}
.sf-motion [data-motion="stage"]:not(.is-settled) [data-stage] {opacity: 0;}
.sf-motion-mask {display: inline-block; clip-path: inset(0 -0.2em); vertical-align: baseline;}
.sf-motion-word {display: inline-block;}
.sf-roll {direction: ltr; unicode-bidi: isolate-override; overflow-anchor: none;}
.sf-roll__col {position: relative; display: inline-block; contain: paint; -webkit-mask-image: linear-gradient(to bottom, transparent, black 12%, black 88%, transparent); mask-image: linear-gradient(to bottom, transparent, black 12%, black 88%, transparent);}
.sf-roll__sizer {visibility: hidden;}
.sf-roll__reel {position: absolute; inset-block-start: 0; inset-inline-start: 0; display: flex; flex-direction: column; will-change: transform;}
.sf-roll__reel > span {display: block; block-size: var(--sf-roll-h); text-align: center;}
.sf-button > :not(.sf-button__loader, .sf-button__done) {transition: opacity var(--ds-transition-hover), transform var(--ds-spring-glide-duration) var(--ds-spring-glide-easing);}
.sf-button,
.sf-icon-button {transition: transform var(--ds-spring-snap-duration) var(--ds-spring-snap-easing);}
.u-lift {transition: transform var(--ds-spring-lift-duration) var(--ds-spring-lift-easing);}
.u-lift::after {transition: opacity var(--ds-spring-lift-duration) var(--ds-ease-out-swift);}
.u-lift:focus-within {transform: translateY(calc(var(--ds-move-lift-distance) * -1));}
.u-lift:focus-within::after {opacity: 1;}
.sf-motion-seal {position: absolute; inset: 0; inline-size: 100%; block-size: 100%; overflow: visible; pointer-events: none;}
.sf-motion-seal rect {fill: none; stroke: var(--ds-color-brand-edge); stroke-width: var(--ds-border-focus-outer); stroke-dasharray: 100;}
.sf-motion-tip {position: absolute; inset-block-start: 50%; inset-inline-start: 0; inline-size: var(--ds-space-12); block-size: var(--ds-space-12); margin-block-start: calc(var(--ds-space-12) / -2); margin-inline-start: calc(var(--ds-space-12) / -2); border-radius: var(--ds-radius-full); background: var(--ds-color-brand-edge); box-shadow: 0 0 0 var(--ds-space-4) var(--ds-color-brand-subtle); opacity: 0; pointer-events: none;}
.sf-glide__cap,
.sf-glide__mid {position: absolute; inset-block-start: 0; inset-inline-start: 0; block-size: var(--sf-glide-h); background: var(--ds-color-raised); transform-origin: 0 50%;}
.sf-glide__cap {inline-size: var(--sf-glide-h); border-radius: var(--ds-radius-full);}
.sf-glide__mid {inline-size: calc(var(--ds-space-4) * 25);}
.sf-layer > :not(.sf-layer__scrim) {transform: translateY(var(--ds-motion-distance-sheet)) scale(var(--ds-motion-scale-float));}
.sf-layer.is-open > :not(.sf-layer__scrim) {transition: opacity var(--ds-transition-overlay), transform var(--ds-spring-sheet-duration) var(--ds-spring-sheet-easing);}
.sf-toast-region[data-deck-ready] {display: block; block-size: var(--sf-deck-h, 0);}
.sf-toast-region[data-deck-ready] > .sf-toast {position: absolute; inset-inline: 0; inset-block-end: 0; transform-origin: 50% 100%;}
:root {--ds-size-control-sm: 28px; --ds-size-control-md: 36px; --ds-size-control-lg: 44px;}
.sf-button,
.sf-icon-button {--sf-px: var(--ds-space-16); font-size: var(--ds-text-body-sm-size);}
.sf-button--sm,
.sf-icon-button--sm {--sf-px: var(--ds-space-12); font-size: var(--ds-text-label-size);}
.sf-button--lg {--sf-px: var(--ds-space-20); font-size: var(--ds-text-body-sm-size);}
.sf-icon-button {--sf-px: 0;}
@container (min-width: 560px) {
.sf-linkreq__field {padding: var(--ds-space-4); padding-inline-start: var(--ds-space-20);}
}