.page-module__CBXbcG__dsLayout{--rail-width:300px;--rail-inset:var(--layout-chat-inset);--stage-walls:calc((var(--rail-width) + var(--rail-inset)) * 2);width:calc(100% + var(--primitive-padding-1000) * 2);margin-inline:calc(-1 * var(--primitive-padding-1000));padding-left:calc(var(--rail-width) + var(--rail-inset) * 2);padding-right:var(--rail-inset);padding-top:calc(var(--layout-stage-clearance) + var(--primitive-gap-1000));padding-bottom:var(--layout-stage-bottom-clearance);justify-content:center;display:flex}.page-module__CBXbcG__dsLayoutChat{padding-left:calc(var(--rail-width) + var(--rail-inset));padding-right:calc(var(--rail-width) + var(--rail-inset));padding-top:var(--layout-stage-clearance)}.page-module__CBXbcG__dsLayoutChat .page-module__CBXbcG__dsContentEnter{animation:page-module__CBXbcG__playgroundEnter var(--motion-duration-slower) var(--motion-ease-entrance) backwards}.page-module__CBXbcG__dsContent{gap:var(--gap-2000);flex-direction:column;flex:1;min-width:0;max-width:960px;display:flex}.page-module__CBXbcG__dsContentMobile{max-width:420px}.page-module__CBXbcG__inlineLink{color:var(--color-action-primary-text-tertiary);text-underline-offset:3px;text-decoration:underline}.page-module__CBXbcG__controlRail{animation:page-module__CBXbcG__playgroundEnter var(--motion-duration-slower) var(--motion-ease-entrance) backwards;top:var(--layout-stage-clearance);bottom:var(--rail-inset);left:var(--rail-inset);width:var(--rail-width);z-index:15;background:var(--color-bg-glass);border:var(--border-025) solid var(--color-bg-container-border);border-radius:var(--radius-600);box-shadow:var(--shadow-floating);-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);display:flex;position:fixed;overflow:hidden}.page-module__CBXbcG__eventRail{animation:page-module__CBXbcG__playgroundEnter var(--motion-duration-slower) var(--motion-ease-entrance) backwards;top:var(--layout-stage-clearance);bottom:var(--rail-inset);right:var(--rail-inset);width:var(--rail-width);z-index:15;background:var(--color-bg-glass);border:var(--border-025) solid var(--color-bg-container-border);border-radius:var(--radius-600);box-shadow:var(--shadow-floating);-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);display:flex;position:fixed;overflow:hidden}.page-module__CBXbcG__railScroll{scrollbar-width:thin;scrollbar-gutter:stable;scrollbar-color:var(--color-divider) transparent;gap:var(--gap-400);min-width:0;min-height:0;padding:var(--padding-400);flex-direction:column;flex:1;display:flex;overflow-y:auto}.page-module__CBXbcG__controlGroup{gap:var(--gap-200);padding-bottom:var(--gap-400);border-bottom:var(--border-025) solid var(--color-divider);flex-direction:column;display:flex}.page-module__CBXbcG__controlHeading{font-size:var(--font-paragraph-emphasis-size);font-weight:var(--font-paragraph-emphasis-weight);line-height:var(--font-paragraph-emphasis-line-height);letter-spacing:var(--font-paragraph-emphasis-letter-spacing);color:var(--color-text-primary)}.page-module__CBXbcG__controlNote{font-size:var(--font-paragraph-sm-size);font-weight:var(--font-paragraph-sm-weight);line-height:var(--font-paragraph-sm-line-height);color:var(--color-text-tertiary)}.page-module__CBXbcG__tintTitleToggle .ds-toggle-switch__label{font-weight:var(--font-paragraph-emphasis-weight);letter-spacing:var(--font-paragraph-emphasis-letter-spacing)}.page-module__CBXbcG__swatchGrid{gap:var(--gap-200);padding:var(--primitive-padding-050) 0;grid-template-columns:repeat(8,max-content);display:grid}.page-module__CBXbcG__customPickerActive .ds-colorpicker__trigger{border-color:var(--color-input-border-selected)}.page-module__CBXbcG__sliderRow{align-items:center;gap:var(--gap-300);display:flex}.page-module__CBXbcG__sliderRow>:first-child{flex:1}.page-module__CBXbcG__sliderValue{text-align:right;min-width:44px;font-size:var(--font-paragraph-sm-size);color:var(--color-text-secondary);font-variant-numeric:tabular-nums}:is(.page-module__CBXbcG__dropUp .ds-dropdown__menu,.page-module__CBXbcG__dropUp .ds-rich-dropdown__menu){margin-top:0;margin-bottom:var(--gap-050);top:auto;bottom:100%}.page-module__CBXbcG__railFooter{gap:var(--gap-300);flex-direction:column;display:flex}.page-module__CBXbcG__cssDialogBody{gap:var(--gap-400);flex-direction:column;min-width:0;display:flex}.page-module__CBXbcG__shaderBanner{border-radius:var(--radius-600);border:var(--border-025) solid var(--color-bg-container-border);background:var(--color-bg-page-primary);height:220px;position:relative;overflow:hidden}.page-module__CBXbcG__demoSection{gap:var(--primitive-gap-500);flex-direction:column;display:flex}.page-module__CBXbcG__sectionNote{font-size:var(--font-paragraph-size);font-weight:var(--font-paragraph-weight);line-height:var(--font-paragraph-line-height);color:var(--color-text-secondary)}.page-module__CBXbcG__sectionNote code{color:var(--color-text-primary)}.page-module__CBXbcG__demoRow{align-items:center;gap:var(--gap-300);flex-wrap:wrap;display:flex}.page-module__CBXbcG__demoColumns{gap:var(--primitive-gap-500);grid-template-columns:1fr 1fr;align-items:start;display:grid}@media (max-width:1151px){.page-module__CBXbcG__demoColumns{grid-template-columns:1fr}}[data-stage=mobile] .page-module__CBXbcG__demoColumns{grid-template-columns:1fr}.page-module__CBXbcG__mapsColumns{gap:var(--primitive-gap-500);grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);align-items:center;display:grid}@media (max-width:1151px){.page-module__CBXbcG__mapsColumns{grid-template-columns:1fr;justify-items:center}}[data-stage=mobile] .page-module__CBXbcG__mapsColumns{grid-template-columns:1fr;justify-items:center}.page-module__CBXbcG__advBody{gap:var(--gap-400);flex-direction:column;display:flex}.page-module__CBXbcG__advGlobal{gap:var(--gap-200);padding-bottom:var(--gap-400);border-bottom:var(--border-025) solid var(--color-divider);flex-direction:column;display:flex}.page-module__CBXbcG__advSliderLabel{min-width:72px;font-size:var(--font-paragraph-sm-size);color:var(--color-text-secondary)}.page-module__CBXbcG__advGlobal .page-module__CBXbcG__sliderRow>:first-child{flex:none}.page-module__CBXbcG__advGlobal .page-module__CBXbcG__sliderRow>:nth-child(2){flex:1}.page-module__CBXbcG__advRamps{gap:var(--gap-200);flex-direction:column;display:flex}.page-module__CBXbcG__advRampRow{align-items:center;gap:var(--gap-300);display:flex}.page-module__CBXbcG__advRampLabel{min-width:72px;font-size:var(--font-paragraph-sm-size);font-weight:var(--font-paragraph-emphasis-weight);color:var(--color-text-primary)}.page-module__CBXbcG__advRamp{gap:var(--gap-050);flex:1;display:flex}.page-module__CBXbcG__advCell{border-radius:var(--radius-050);border:var(--border-025) solid var(--color-bg-container-border);flex:1;height:24px}.page-module__CBXbcG__advCellKey{outline:var(--border-050) solid var(--color-input-border-selected);outline-offset:1px}.page-module__CBXbcG__advRampPicker .ds-colorpicker__panel{left:auto;right:0}.page-module__CBXbcG__advRampReset{border-radius:var(--radius-pill);width:28px;height:28px;color:var(--color-text-secondary);cursor:pointer;--icon-size:var(--icon-size-500);transition:background-color var(--motion-duration-base) var(--motion-ease-standard), color var(--motion-duration-base) var(--motion-ease-standard);background:0 0;border:none;justify-content:center;align-items:center;padding:0;display:inline-flex}.page-module__CBXbcG__advRampReset:hover:not(:disabled){background-color:var(--color-bg-container-secondary);color:var(--color-text-primary)}.page-module__CBXbcG__advRampReset:disabled{opacity:.4;cursor:not-allowed}.page-module__CBXbcG__advAccents{gap:var(--gap-200);padding-top:var(--gap-400);border-top:var(--border-025) solid var(--color-divider);flex-direction:column;display:flex}.page-module__CBXbcG__drawerControls{gap:var(--gap-400);flex-direction:column;display:flex}@media (max-width:1099px){.page-module__CBXbcG__dsLayout{width:100%;padding-left:0;padding-right:0;padding-bottom:var(--layout-stage-bottom-clearance);margin-inline:0}}@keyframes page-module__CBXbcG__playgroundEnter{0%{opacity:0;transform:translateY(12px)scale(.992)}to{opacity:1;transform:none}}@media (prefers-reduced-motion:reduce){.page-module__CBXbcG__controlRail,.page-module__CBXbcG__eventRail,.page-module__CBXbcG__dsContentEnter{animation:none}}.page-module__CBXbcG__visuallyHidden{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.page-module__CBXbcG__imageSourceRow{justify-content:space-between;align-items:center;gap:var(--gap-200);min-width:0;display:flex}.page-module__CBXbcG__imageSourceName{font-size:var(--font-caption-size);font-weight:var(--font-caption-weight);line-height:var(--font-caption-line-height);color:var(--color-text-secondary);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.page-module__CBXbcG__navStage{gap:var(--gap-1000);flex-direction:column;display:flex}
.ds-code-block{border:var(--border-025) solid var(--color-bg-container-border);border-radius:var(--radius-300);background-color:var(--color-bg-container-primary);width:100%;max-height:var(--ds-code-block-max-height,none);flex-direction:column;display:flex;overflow:hidden}.ds-code-block__header{justify-content:space-between;align-items:center;gap:var(--gap-200);padding:var(--padding-150) var(--padding-200) var(--padding-150) var(--padding-400);border-bottom:var(--border-025) solid var(--color-bg-container-border);transition:border-bottom-color var(--motion-duration-slow) var(--motion-ease-standard);flex-shrink:0;display:flex}.ds-code-block--collapsed .ds-code-block__header{border-bottom-color:#0000}.ds-code-block__meta{align-items:center;gap:var(--gap-200);min-width:0;display:flex}.ds-code-block__toggle{padding:var(--padding-050);border-radius:var(--radius-pill);color:var(--color-icon-primary);cursor:pointer;transition:background-color var(--motion-duration-base) var(--motion-ease-standard);background:0 0;border:none;flex-shrink:0;justify-content:center;align-items:center;margin:0;display:inline-flex}.ds-code-block__toggle .material-symbols-rounded{--icon-size:var(--icon-size-500);transition:transform var(--motion-duration-slow) var(--motion-ease-standard);line-height:1}.ds-code-block--collapsed .ds-code-block__toggle .material-symbols-rounded{transform:rotate(-90deg)}.ds-code-block__toggle:hover{background-color:var(--color-action-passive-bg-hover)}.ds-code-block__toggle:focus-visible{outline:2px solid var(--color-action-primary-bg);outline-offset:2px}.ds-code-block__filename{font-family:var(--font-family-code);font-size:var(--font-paragraph-sm-size);line-height:var(--font-paragraph-sm-line-height);color:var(--color-text-secondary);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.ds-code-block__language{font-family:var(--font-paragraph-sm-family);font-size:var(--font-paragraph-sm-size);font-weight:var(--font-paragraph-sm-emphasis-weight);line-height:var(--font-paragraph-sm-line-height);text-transform:uppercase;letter-spacing:var(--font-overline-letter-spacing);color:var(--color-text-tertiary);flex-shrink:0}.ds-code-block__copy{align-items:center;gap:var(--gap-100);padding:var(--padding-050) var(--padding-200);border-radius:var(--radius-pill);font-family:var(--font-paragraph-sm-emphasis-family);font-size:var(--font-paragraph-sm-emphasis-size);font-weight:var(--font-paragraph-sm-emphasis-weight);line-height:var(--font-paragraph-sm-emphasis-line-height);color:var(--color-text-secondary);cursor:pointer;transition:background-color var(--motion-duration-base) var(--motion-ease-standard), color var(--motion-duration-base) var(--motion-ease-standard);background:0 0;border:none;flex-shrink:0;margin:0;display:inline-flex}.ds-code-block__copy .material-symbols-rounded{--icon-size:var(--icon-size-500);line-height:1}.ds-code-block__copy:hover{background-color:var(--color-action-passive-bg-hover)}.ds-code-block__copy:focus-visible{outline:2px solid var(--color-action-primary-bg);outline-offset:2px}.ds-code-block__panel{transition:grid-template-rows var(--motion-duration-slow) var(--motion-ease-standard);grid-template-rows:1fr;min-height:0;display:grid}.ds-code-block--collapsed .ds-code-block__panel{grid-template-rows:0fr}.ds-code-block__panel-inner{flex-direction:column;min-height:0;display:flex;overflow:hidden}.ds-code-block__pre{padding:var(--padding-400);flex:auto;min-height:0;margin:0;overflow:auto}.ds-code-block__code{font-family:var(--font-family-code);font-size:var(--font-paragraph-sm-size);line-height:var(--font-paragraph-sm-line-height);color:var(--color-text-primary);white-space:pre}.ds-code-block .material-symbols-rounded{color:inherit}
.ComponentInstallStrip-module__bxTwyq__strip{margin-top:var(--gap-500);width:100%}
.page-module__Zr1STq__dsLayout{gap:var(--layout-column-gap);width:100%;max-width:1440px;padding-top:var(--primitive-gap-1000);display:flex}.page-module__Zr1STq__dsContent{gap:var(--gap-2000);flex-direction:column;flex:1;min-width:0;display:flex}.page-module__Zr1STq__pageHeader{margin-top:calc(var(--primitive-gap-1000) - var(--gap-2000));justify-content:space-between;align-items:baseline;gap:var(--primitive-gap-500);width:100%;display:flex}.page-module__Zr1STq__pageTitle{font-family:var(--font-display-2-family);font-size:var(--font-display-2-size);font-weight:var(--font-display-2-weight);line-height:var(--font-display-2-line-height);letter-spacing:var(--font-display-2-letter-spacing);color:var(--color-text-primary)}.page-module__Zr1STq__subDisplay{font-family:var(--font-sub-display-family);font-size:var(--font-sub-display-size);font-weight:var(--font-sub-display-weight);line-height:var(--font-sub-display-line-height);letter-spacing:var(--font-sub-display-letter-spacing);color:var(--color-text-primary);margin-bottom:0}.page-module__Zr1STq__introSection{gap:var(--primitive-gap-500);flex-direction:column;display:flex}.page-module__Zr1STq__introBody{font-size:var(--font-paragraph-size);font-weight:var(--font-paragraph-weight);line-height:var(--font-paragraph-line-height);color:var(--color-text-primary)}.page-module__Zr1STq__variantBlock{gap:var(--primitive-gap-1000);flex-direction:column;display:flex}.page-module__Zr1STq__buttonGrid{gap:var(--primitive-gap-400) var(--primitive-gap-400);grid-template-columns:auto repeat(4,1fr);align-items:center;width:100%;display:grid}.page-module__Zr1STq__loadingGrid{grid-template-columns:auto repeat(5,1fr)}.page-module__Zr1STq__gridColHeader{text-align:center;font-size:var(--font-paragraph-sm-size);font-weight:var(--font-paragraph-sm-weight);line-height:var(--font-paragraph-sm-line-height);letter-spacing:var(--font-paragraph-sm-letter-spacing);color:var(--color-text-tertiary)}.page-module__Zr1STq__gridRowHeader{font-size:var(--font-paragraph-sm-size);font-weight:var(--font-paragraph-sm-weight);line-height:var(--font-paragraph-sm-line-height);letter-spacing:var(--font-paragraph-sm-letter-spacing);color:var(--color-text-tertiary);text-align:right;padding-right:var(--primitive-padding-200);white-space:nowrap}.page-module__Zr1STq__gridCell{justify-content:center;align-items:center;display:flex}@media (max-width:959px){.page-module__Zr1STq__pageHeader{flex-direction:column;align-items:flex-start}.page-module__Zr1STq__dsLayout{min-width:0;padding-left:0}.page-module__Zr1STq__dsContent{min-width:0;max-width:100%}}@media (max-width:600px){.page-module__Zr1STq__variantBlock{overflow-x:auto}.page-module__Zr1STq__buttonGrid{min-width:480px}.page-module__Zr1STq__loadingGrid{min-width:600px}}
.page-module__FmKUAq__dsLayout{gap:var(--layout-column-gap);width:100%;max-width:1440px;padding-top:var(--primitive-gap-1000);display:flex}.page-module__FmKUAq__dsContent{gap:var(--gap-2000);flex-direction:column;flex:1;display:flex}.page-module__FmKUAq__pageHeader{margin-top:calc(var(--primitive-gap-1000) - var(--gap-2000));justify-content:space-between;align-items:baseline;gap:var(--primitive-gap-500);width:100%;display:flex}.page-module__FmKUAq__pageTitle{font-family:var(--font-display-2-family);font-size:var(--font-display-2-size);font-weight:var(--font-display-2-weight);line-height:var(--font-display-2-line-height);letter-spacing:var(--font-display-2-letter-spacing);color:var(--color-text-primary);width:100%}.page-module__FmKUAq__introSection{gap:var(--primitive-gap-500);flex-direction:column;display:flex}.page-module__FmKUAq__subDisplay{font-family:var(--font-sub-display-family);font-size:var(--font-sub-display-size);font-weight:var(--font-sub-display-weight);line-height:var(--font-sub-display-line-height);letter-spacing:var(--font-sub-display-letter-spacing);color:var(--color-text-primary)}.page-module__FmKUAq__introBody{font-size:var(--font-paragraph-size);font-weight:var(--font-paragraph-weight);line-height:var(--font-paragraph-line-height);color:var(--color-text-primary)}.page-module__FmKUAq__inlineCode{font-family:monospace;font-size:var(--font-paragraph-sm-size);padding:var(--primitive-padding-050) var(--primitive-padding-150);background:var(--color-bg-container-primary);border:1px solid var(--color-bg-container-border);border-radius:var(--radius-100);color:var(--color-text-secondary)}.page-module__FmKUAq__railLayout{align-items:flex-start;gap:var(--layout-column-gap);width:100%;display:flex}.page-module__FmKUAq__skillsGrid{gap:var(--primitive-gap-500);flex-direction:column;flex:1;min-width:0;display:flex}.page-module__FmKUAq__skillCard{gap:var(--primitive-gap-400);padding:var(--primitive-gap-1000);border:1px solid var(--color-bg-container-border);border-radius:var(--primitive-radius-600);background:var(--color-bg-container-primary);scroll-margin-top:var(--layout-anchor-clearance);flex-direction:column;display:flex}.page-module__FmKUAq__skillCardHeader{justify-content:space-between;align-items:center;gap:var(--primitive-gap-400);display:flex}.page-module__FmKUAq__skillMeta{align-items:center;gap:var(--primitive-gap-200);display:flex}.page-module__FmKUAq__skillIcon{--icon-size:var(--icon-size-500);color:var(--color-icon-primary);flex-shrink:0}.page-module__FmKUAq__skillName{font-family:var(--font-heading-3-family);font-size:var(--font-heading-3-size);font-weight:var(--font-heading-3-weight);line-height:var(--font-heading-3-line-height);letter-spacing:var(--font-heading-3-letter-spacing);color:var(--color-text-primary)}.page-module__FmKUAq__skillDescription{font-size:var(--font-paragraph-size);font-weight:var(--font-paragraph-weight);line-height:var(--font-paragraph-line-height);color:var(--color-text-secondary)}.page-module__FmKUAq__skillInvoke{align-items:center;gap:var(--primitive-gap-200);flex-wrap:wrap;display:flex}.page-module__FmKUAq__skillInvokeLabel{font-size:var(--font-paragraph-sm-size);font-weight:var(--font-paragraph-sm-weight);line-height:var(--font-paragraph-sm-line-height);color:var(--color-text-tertiary);flex-shrink:0}@media (max-width:959px){.page-module__FmKUAq__pageHeader{flex-direction:column;align-items:flex-start}.page-module__FmKUAq__dsLayout{min-width:0;padding-left:0}.page-module__FmKUAq__dsContent{min-width:0;max-width:100%}.page-module__FmKUAq__skillCardHeader{flex-wrap:wrap}}.page-module__FmKUAq__introLink{color:var(--color-text-primary);text-underline-offset:3px;transition:color var(--motion-duration-base) var(--motion-ease-standard);text-decoration:underline}.page-module__FmKUAq__introLink:hover{color:var(--color-text-secondary)}
.page-module__tplOpa__dsLayout{gap:var(--layout-column-gap);width:100%;max-width:1440px;padding-top:var(--primitive-gap-1000);display:flex}.page-module__tplOpa__dsContent{gap:var(--gap-2000);flex-direction:column;flex:1;display:flex}.page-module__tplOpa__pageHeader{margin-top:calc(var(--primitive-gap-1000) - var(--gap-2000));justify-content:space-between;align-items:baseline;gap:var(--primitive-gap-500);width:100%;display:flex}.page-module__tplOpa__pageTitle{font-family:var(--font-display-2-family);font-size:var(--font-display-2-size);font-weight:var(--font-display-2-weight);line-height:var(--font-display-2-line-height);letter-spacing:var(--font-display-2-letter-spacing);color:var(--color-text-primary);width:100%}.page-module__tplOpa__introSection{gap:var(--primitive-gap-500);flex-direction:column;display:flex}.page-module__tplOpa__subDisplay{font-family:var(--font-sub-display-family);font-size:var(--font-sub-display-size);font-weight:var(--font-sub-display-weight);line-height:var(--font-sub-display-line-height);letter-spacing:var(--font-sub-display-letter-spacing);color:var(--color-text-primary)}.page-module__tplOpa__introBody{font-family:var(--font-paragraph-family);font-size:var(--font-paragraph-size);font-weight:var(--font-paragraph-weight);line-height:var(--font-paragraph-line-height);letter-spacing:var(--font-paragraph-letter-spacing);color:var(--color-text-secondary)}.page-module__tplOpa__setupBlock{width:100%}.page-module__tplOpa__grid{gap:var(--gap-500);grid-template-columns:repeat(auto-fill,minmax(320px,1fr));display:grid}.page-module__tplOpa__card{gap:var(--gap-300);padding:var(--padding-500);background:var(--color-bg-container-primary);border:var(--border-025) solid var(--color-bg-container-border);border-radius:var(--radius-600);flex-direction:column;display:flex}.page-module__tplOpa__cardActive{border-color:var(--color-action-primary-bg)}.page-module__tplOpa__cardSwatches{justify-content:space-between;align-items:center;gap:var(--gap-300);display:flex}.page-module__tplOpa__brandSwatch{border:var(--border-025) solid var(--color-bg-container-border);width:28px;height:28px}.page-module__tplOpa__accentRow{gap:var(--gap-100);display:flex}.page-module__tplOpa__accentDot{border-radius:var(--radius-pill);border:var(--border-025) solid var(--color-bg-container-border);width:12px;height:12px}.page-module__tplOpa__cardName{font-size:var(--font-heading-2-size);font-weight:var(--font-heading-2-weight);line-height:var(--font-heading-2-line-height);color:var(--color-text-primary);margin:0}.page-module__tplOpa__cardPairing{font-size:var(--font-paragraph-sm-size);line-height:var(--font-paragraph-sm-line-height);color:var(--color-text-secondary);margin:0}.page-module__tplOpa__cardLevers{font-family:var(--font-caption-family);font-size:var(--font-caption-size);line-height:var(--font-caption-line-height);color:var(--color-text-tertiary);margin:0}.page-module__tplOpa__cardActions{gap:var(--gap-200);padding-top:var(--gap-200);flex-wrap:wrap;margin-top:auto;display:flex}.page-module__tplOpa__cardCreate{border-style:dashed}.page-module__tplOpa__createSwatch{border:var(--border-025) dashed var(--color-text-tertiary);border-radius:var(--radius-pill);width:28px;height:28px;color:var(--color-text-secondary);--icon-size:var(--icon-size-500);justify-content:center;align-items:center;display:flex}