@wikimedia/codex
Version:
Codex Design System for Wikimedia
1 lines • 3.45 MB
CSS
.cdx-demo-icon-table th{font-weight:400}[dir=ltr] .cdx-demo-icon-table th:first-child{text-align:left}[dir=rtl] .cdx-demo-icon-table th:first-child{text-align:right}[dir] .cdx-demo-icon-table td{text-align:center}.cdx-demo-icon-vue-icon--color-red{color:var(--color-destructive, #bf3c2c)}.cdx-demo-icon-vue-icon--color-blue{color:var(--color-progressive, #36c)}.cdx-demo-icon-css-icon--add{min-width:10px;min-height:10px;width:calc(var(--font-size-medium, 1rem) + 4px);height:calc(var(--font-size-medium, 1rem) + 4px);display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){[dir] .cdx-demo-icon-css-icon--add{background-position:center;background-repeat:no-repeat;background-size:max(calc(var(--font-size-medium, 1rem) + 4px),10px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-demo-icon-css-icon--add{-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:max(calc(var(--font-size-medium, 1rem) + 4px),10px);mask-size:max(calc(var(--font-size-medium, 1rem) + 4px),10px)}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-demo-icon-css-icon--add{filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}[dir] .cdx-demo-icon-css-icon--add{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M11.005 9H16v2h-4.995v5.005h-2V11H4V9h5.005V4.005h2z"/></svg>')}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-demo-icon-css-icon--add{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M11.005 9H16v2h-4.995v5.005h-2V11H4V9h5.005V4.005h2z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M11.005 9H16v2h-4.995v5.005h-2V11H4V9h5.005V4.005h2z"/></svg>')}[dir] .cdx-demo-icon-css-icon--add{background-color:var(--color-base, #202122)}}.cdx-demo-icon-css-icon--add--size-medium--color-red{min-width:10px;min-height:10px;width:calc(var(--font-size-medium, 1rem) + 4px);height:calc(var(--font-size-medium, 1rem) + 4px);display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){[dir] .cdx-demo-icon-css-icon--add--size-medium--color-red{background-position:center;background-repeat:no-repeat;background-size:max(calc(var(--font-size-medium, 1rem) + 4px),10px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-demo-icon-css-icon--add--size-medium--color-red{-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:max(calc(var(--font-size-medium, 1rem) + 4px),10px);mask-size:max(calc(var(--font-size-medium, 1rem) + 4px),10px)}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-demo-icon-css-icon--add--size-medium--color-red{filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}[dir] .cdx-demo-icon-css-icon--add--size-medium--color-red{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M11.005 9H16v2h-4.995v5.005h-2V11H4V9h5.005V4.005h2z"/></svg>')}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-demo-icon-css-icon--add--size-medium--color-red{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M11.005 9H16v2h-4.995v5.005h-2V11H4V9h5.005V4.005h2z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M11.005 9H16v2h-4.995v5.005h-2V11H4V9h5.005V4.005h2z"/></svg>')}[dir] .cdx-demo-icon-css-icon--add--size-medium--color-red{background-color:var(--color-destructive, #bf3c2c)}}.cdx-demo-icon-css-icon--add--size-small{min-width:10px;min-height:10px;width:var(--font-size-medium, 1rem);height:var(--font-size-medium, 1rem);display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){[dir] .cdx-demo-icon-css-icon--add--size-small{background-position:center;background-repeat:no-repeat;background-size:max(var(--font-size-medium, 1rem),10px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-demo-icon-css-icon--add--size-small{-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:max(var(--font-size-medium, 1rem),10px);mask-size:max(var(--font-size-medium, 1rem),10px)}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-demo-icon-css-icon--add--size-small{filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}[dir] .cdx-demo-icon-css-icon--add--size-small{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M11.005 9H16v2h-4.995v5.005h-2V11H4V9h5.005V4.005h2z"/></svg>')}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-demo-icon-css-icon--add--size-small{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M11.005 9H16v2h-4.995v5.005h-2V11H4V9h5.005V4.005h2z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M11.005 9H16v2h-4.995v5.005h-2V11H4V9h5.005V4.005h2z"/></svg>')}[dir] .cdx-demo-icon-css-icon--add--size-small{background-color:var(--color-base, #202122)}}.cdx-demo-icon-css-icon--add--size-x-small--color-blue{min-width:10px;min-height:10px;width:calc(var(--font-size-medium, 1rem) - 4px);height:calc(var(--font-size-medium, 1rem) - 4px);display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){[dir] .cdx-demo-icon-css-icon--add--size-x-small--color-blue{background-position:center;background-repeat:no-repeat;background-size:max(calc(var(--font-size-medium, 1rem) - 4px),10px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-demo-icon-css-icon--add--size-x-small--color-blue{-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:max(calc(var(--font-size-medium, 1rem) - 4px),10px);mask-size:max(calc(var(--font-size-medium, 1rem) - 4px),10px)}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-demo-icon-css-icon--add--size-x-small--color-blue{filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}[dir] .cdx-demo-icon-css-icon--add--size-x-small--color-blue{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M11.005 9H16v2h-4.995v5.005h-2V11H4V9h5.005V4.005h2z"/></svg>')}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-demo-icon-css-icon--add--size-x-small--color-blue{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M11.005 9H16v2h-4.995v5.005h-2V11H4V9h5.005V4.005h2z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M11.005 9H16v2h-4.995v5.005h-2V11H4V9h5.005V4.005h2z"/></svg>')}[dir] .cdx-demo-icon-css-icon--add--size-x-small--color-blue{background-color:var(--color-progressive, #36c)}}.cdx-demo-icon-css-icon--alert{min-width:10px;min-height:10px;width:calc(var(--font-size-medium, 1rem) + 4px);height:calc(var(--font-size-medium, 1rem) + 4px);display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){[dir] .cdx-demo-icon-css-icon--alert{background-position:center;background-repeat:no-repeat;background-size:max(calc(var(--font-size-medium, 1rem) + 4px),10px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-demo-icon-css-icon--alert{-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:max(calc(var(--font-size-medium, 1rem) + 4px),10px);mask-size:max(calc(var(--font-size-medium, 1rem) + 4px),10px)}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-demo-icon-css-icon--alert{filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}[dir] .cdx-demo-icon-css-icon--alert{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M19.765 16.059 18 19H2L.235 16.059l8-15h3.53zM9 14v2h2v-2zm0-8v6h2V6z"/></svg>')}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-demo-icon-css-icon--alert{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M19.765 16.059 18 19H2L.235 16.059l8-15h3.53zM9 14v2h2v-2zm0-8v6h2V6z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M19.765 16.059 18 19H2L.235 16.059l8-15h3.53zM9 14v2h2v-2zm0-8v6h2V6z"/></svg>')}[dir] .cdx-demo-icon-css-icon--alert{background-color:var(--color-base, #202122)}}.cdx-demo-icon-css-icon--alert--size-medium--color-red{min-width:10px;min-height:10px;width:calc(var(--font-size-medium, 1rem) + 4px);height:calc(var(--font-size-medium, 1rem) + 4px);display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){[dir] .cdx-demo-icon-css-icon--alert--size-medium--color-red{background-position:center;background-repeat:no-repeat;background-size:max(calc(var(--font-size-medium, 1rem) + 4px),10px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-demo-icon-css-icon--alert--size-medium--color-red{-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:max(calc(var(--font-size-medium, 1rem) + 4px),10px);mask-size:max(calc(var(--font-size-medium, 1rem) + 4px),10px)}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-demo-icon-css-icon--alert--size-medium--color-red{filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}[dir] .cdx-demo-icon-css-icon--alert--size-medium--color-red{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M19.765 16.059 18 19H2L.235 16.059l8-15h3.53zM9 14v2h2v-2zm0-8v6h2V6z"/></svg>')}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-demo-icon-css-icon--alert--size-medium--color-red{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M19.765 16.059 18 19H2L.235 16.059l8-15h3.53zM9 14v2h2v-2zm0-8v6h2V6z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M19.765 16.059 18 19H2L.235 16.059l8-15h3.53zM9 14v2h2v-2zm0-8v6h2V6z"/></svg>')}[dir] .cdx-demo-icon-css-icon--alert--size-medium--color-red{background-color:var(--color-destructive, #bf3c2c)}}.cdx-demo-icon-css-icon--alert--size-small{min-width:10px;min-height:10px;width:var(--font-size-medium, 1rem);height:var(--font-size-medium, 1rem);display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){[dir] .cdx-demo-icon-css-icon--alert--size-small{background-position:center;background-repeat:no-repeat;background-size:max(var(--font-size-medium, 1rem),10px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-demo-icon-css-icon--alert--size-small{-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:max(var(--font-size-medium, 1rem),10px);mask-size:max(var(--font-size-medium, 1rem),10px)}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-demo-icon-css-icon--alert--size-small{filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}[dir] .cdx-demo-icon-css-icon--alert--size-small{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M19.765 16.059 18 19H2L.235 16.059l8-15h3.53zM9 14v2h2v-2zm0-8v6h2V6z"/></svg>')}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-demo-icon-css-icon--alert--size-small{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M19.765 16.059 18 19H2L.235 16.059l8-15h3.53zM9 14v2h2v-2zm0-8v6h2V6z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M19.765 16.059 18 19H2L.235 16.059l8-15h3.53zM9 14v2h2v-2zm0-8v6h2V6z"/></svg>')}[dir] .cdx-demo-icon-css-icon--alert--size-small{background-color:var(--color-base, #202122)}}.cdx-demo-icon-css-icon--alert--size-x-small--color-blue{min-width:10px;min-height:10px;width:calc(var(--font-size-medium, 1rem) - 4px);height:calc(var(--font-size-medium, 1rem) - 4px);display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){[dir] .cdx-demo-icon-css-icon--alert--size-x-small--color-blue{background-position:center;background-repeat:no-repeat;background-size:max(calc(var(--font-size-medium, 1rem) - 4px),10px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-demo-icon-css-icon--alert--size-x-small--color-blue{-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:max(calc(var(--font-size-medium, 1rem) - 4px),10px);mask-size:max(calc(var(--font-size-medium, 1rem) - 4px),10px)}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-demo-icon-css-icon--alert--size-x-small--color-blue{filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}[dir] .cdx-demo-icon-css-icon--alert--size-x-small--color-blue{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M19.765 16.059 18 19H2L.235 16.059l8-15h3.53zM9 14v2h2v-2zm0-8v6h2V6z"/></svg>')}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-demo-icon-css-icon--alert--size-x-small--color-blue{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M19.765 16.059 18 19H2L.235 16.059l8-15h3.53zM9 14v2h2v-2zm0-8v6h2V6z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M19.765 16.059 18 19H2L.235 16.059l8-15h3.53zM9 14v2h2v-2zm0-8v6h2V6z"/></svg>')}[dir] .cdx-demo-icon-css-icon--alert--size-x-small--color-blue{background-color:var(--color-progressive, #36c)}}.cdx-demo-icon-css-icon--align-center{min-width:10px;min-height:10px;width:calc(var(--font-size-medium, 1rem) + 4px);height:calc(var(--font-size-medium, 1rem) + 4px);display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){[dir] .cdx-demo-icon-css-icon--align-center{background-position:center;background-repeat:no-repeat;background-size:max(calc(var(--font-size-medium, 1rem) + 4px),10px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-demo-icon-css-icon--align-center{-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:max(calc(var(--font-size-medium, 1rem) + 4px),10px);mask-size:max(calc(var(--font-size-medium, 1rem) + 4px),10px)}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-demo-icon-css-icon--align-center{filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}[dir] .cdx-demo-icon-css-icon--align-center{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M19 17H1v-2h18zm-6-4H7V7h6zm6-8H1V3h18z"/></svg>')}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-demo-icon-css-icon--align-center{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M19 17H1v-2h18zm-6-4H7V7h6zm6-8H1V3h18z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M19 17H1v-2h18zm-6-4H7V7h6zm6-8H1V3h18z"/></svg>')}[dir] .cdx-demo-icon-css-icon--align-center{background-color:var(--color-base, #202122)}}.cdx-demo-icon-css-icon--align-center--size-medium--color-red{min-width:10px;min-height:10px;width:calc(var(--font-size-medium, 1rem) + 4px);height:calc(var(--font-size-medium, 1rem) + 4px);display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){[dir] .cdx-demo-icon-css-icon--align-center--size-medium--color-red{background-position:center;background-repeat:no-repeat;background-size:max(calc(var(--font-size-medium, 1rem) + 4px),10px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-demo-icon-css-icon--align-center--size-medium--color-red{-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:max(calc(var(--font-size-medium, 1rem) + 4px),10px);mask-size:max(calc(var(--font-size-medium, 1rem) + 4px),10px)}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-demo-icon-css-icon--align-center--size-medium--color-red{filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}[dir] .cdx-demo-icon-css-icon--align-center--size-medium--color-red{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M19 17H1v-2h18zm-6-4H7V7h6zm6-8H1V3h18z"/></svg>')}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-demo-icon-css-icon--align-center--size-medium--color-red{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M19 17H1v-2h18zm-6-4H7V7h6zm6-8H1V3h18z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M19 17H1v-2h18zm-6-4H7V7h6zm6-8H1V3h18z"/></svg>')}[dir] .cdx-demo-icon-css-icon--align-center--size-medium--color-red{background-color:var(--color-destructive, #bf3c2c)}}.cdx-demo-icon-css-icon--align-center--size-small{min-width:10px;min-height:10px;width:var(--font-size-medium, 1rem);height:var(--font-size-medium, 1rem);display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){[dir] .cdx-demo-icon-css-icon--align-center--size-small{background-position:center;background-repeat:no-repeat;background-size:max(var(--font-size-medium, 1rem),10px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-demo-icon-css-icon--align-center--size-small{-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:max(var(--font-size-medium, 1rem),10px);mask-size:max(var(--font-size-medium, 1rem),10px)}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-demo-icon-css-icon--align-center--size-small{filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}[dir] .cdx-demo-icon-css-icon--align-center--size-small{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M19 17H1v-2h18zm-6-4H7V7h6zm6-8H1V3h18z"/></svg>')}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-demo-icon-css-icon--align-center--size-small{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M19 17H1v-2h18zm-6-4H7V7h6zm6-8H1V3h18z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M19 17H1v-2h18zm-6-4H7V7h6zm6-8H1V3h18z"/></svg>')}[dir] .cdx-demo-icon-css-icon--align-center--size-small{background-color:var(--color-base, #202122)}}.cdx-demo-icon-css-icon--align-center--size-x-small--color-blue{min-width:10px;min-height:10px;width:calc(var(--font-size-medium, 1rem) - 4px);height:calc(var(--font-size-medium, 1rem) - 4px);display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){[dir] .cdx-demo-icon-css-icon--align-center--size-x-small--color-blue{background-position:center;background-repeat:no-repeat;background-size:max(calc(var(--font-size-medium, 1rem) - 4px),10px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-demo-icon-css-icon--align-center--size-x-small--color-blue{-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:max(calc(var(--font-size-medium, 1rem) - 4px),10px);mask-size:max(calc(var(--font-size-medium, 1rem) - 4px),10px)}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-demo-icon-css-icon--align-center--size-x-small--color-blue{filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}[dir] .cdx-demo-icon-css-icon--align-center--size-x-small--color-blue{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M19 17H1v-2h18zm-6-4H7V7h6zm6-8H1V3h18z"/></svg>')}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-demo-icon-css-icon--align-center--size-x-small--color-blue{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M19 17H1v-2h18zm-6-4H7V7h6zm6-8H1V3h18z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M19 17H1v-2h18zm-6-4H7V7h6zm6-8H1V3h18z"/></svg>')}[dir] .cdx-demo-icon-css-icon--align-center--size-x-small--color-blue{background-color:var(--color-progressive, #36c)}}.cdx-demo-icon-css-icon--align-left{min-width:10px;min-height:10px;width:calc(var(--font-size-medium, 1rem) + 4px);height:calc(var(--font-size-medium, 1rem) + 4px);display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){[dir] .cdx-demo-icon-css-icon--align-left{background-position:center;background-repeat:no-repeat;background-size:max(calc(var(--font-size-medium, 1rem) + 4px),10px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-demo-icon-css-icon--align-left{-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:max(calc(var(--font-size-medium, 1rem) + 4px),10px);mask-size:max(calc(var(--font-size-medium, 1rem) + 4px),10px)}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-demo-icon-css-icon--align-left{filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}[dir] .cdx-demo-icon-css-icon--align-left{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M19 17H1v-2h18zM7 13H1V7h6zm12 0H9v-2h10zm0-4H9V7h10zm0-4H1V3h18z"/></svg>')}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-demo-icon-css-icon--align-left{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M19 17H1v-2h18zM7 13H1V7h6zm12 0H9v-2h10zm0-4H9V7h10zm0-4H1V3h18z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M19 17H1v-2h18zM7 13H1V7h6zm12 0H9v-2h10zm0-4H9V7h10zm0-4H1V3h18z"/></svg>')}[dir] .cdx-demo-icon-css-icon--align-left{background-color:var(--color-base, #202122)}}.cdx-demo-icon-css-icon--align-left--size-medium--color-red{min-width:10px;min-height:10px;width:calc(var(--font-size-medium, 1rem) + 4px);height:calc(var(--font-size-medium, 1rem) + 4px);display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){[dir] .cdx-demo-icon-css-icon--align-left--size-medium--color-red{background-position:center;background-repeat:no-repeat;background-size:max(calc(var(--font-size-medium, 1rem) + 4px),10px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-demo-icon-css-icon--align-left--size-medium--color-red{-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:max(calc(var(--font-size-medium, 1rem) + 4px),10px);mask-size:max(calc(var(--font-size-medium, 1rem) + 4px),10px)}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-demo-icon-css-icon--align-left--size-medium--color-red{filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}[dir] .cdx-demo-icon-css-icon--align-left--size-medium--color-red{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M19 17H1v-2h18zM7 13H1V7h6zm12 0H9v-2h10zm0-4H9V7h10zm0-4H1V3h18z"/></svg>')}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-demo-icon-css-icon--align-left--size-medium--color-red{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M19 17H1v-2h18zM7 13H1V7h6zm12 0H9v-2h10zm0-4H9V7h10zm0-4H1V3h18z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M19 17H1v-2h18zM7 13H1V7h6zm12 0H9v-2h10zm0-4H9V7h10zm0-4H1V3h18z"/></svg>')}[dir] .cdx-demo-icon-css-icon--align-left--size-medium--color-red{background-color:var(--color-destructive, #bf3c2c)}}.cdx-demo-icon-css-icon--align-left--size-small{min-width:10px;min-height:10px;width:var(--font-size-medium, 1rem);height:var(--font-size-medium, 1rem);display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){[dir] .cdx-demo-icon-css-icon--align-left--size-small{background-position:center;background-repeat:no-repeat;background-size:max(var(--font-size-medium, 1rem),10px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-demo-icon-css-icon--align-left--size-small{-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:max(var(--font-size-medium, 1rem),10px);mask-size:max(var(--font-size-medium, 1rem),10px)}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-demo-icon-css-icon--align-left--size-small{filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}[dir] .cdx-demo-icon-css-icon--align-left--size-small{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M19 17H1v-2h18zM7 13H1V7h6zm12 0H9v-2h10zm0-4H9V7h10zm0-4H1V3h18z"/></svg>')}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-demo-icon-css-icon--align-left--size-small{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M19 17H1v-2h18zM7 13H1V7h6zm12 0H9v-2h10zm0-4H9V7h10zm0-4H1V3h18z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M19 17H1v-2h18zM7 13H1V7h6zm12 0H9v-2h10zm0-4H9V7h10zm0-4H1V3h18z"/></svg>')}[dir] .cdx-demo-icon-css-icon--align-left--size-small{background-color:var(--color-base, #202122)}}.cdx-demo-icon-css-icon--align-left--size-x-small--color-blue{min-width:10px;min-height:10px;width:calc(var(--font-size-medium, 1rem) - 4px);height:calc(var(--font-size-medium, 1rem) - 4px);display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){[dir] .cdx-demo-icon-css-icon--align-left--size-x-small--color-blue{background-position:center;background-repeat:no-repeat;background-size:max(calc(var(--font-size-medium, 1rem) - 4px),10px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-demo-icon-css-icon--align-left--size-x-small--color-blue{-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:max(calc(var(--font-size-medium, 1rem) - 4px),10px);mask-size:max(calc(var(--font-size-medium, 1rem) - 4px),10px)}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-demo-icon-css-icon--align-left--size-x-small--color-blue{filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}[dir] .cdx-demo-icon-css-icon--align-left--size-x-small--color-blue{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M19 17H1v-2h18zM7 13H1V7h6zm12 0H9v-2h10zm0-4H9V7h10zm0-4H1V3h18z"/></svg>')}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-demo-icon-css-icon--align-left--size-x-small--color-blue{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M19 17H1v-2h18zM7 13H1V7h6zm12 0H9v-2h10zm0-4H9V7h10zm0-4H1V3h18z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M19 17H1v-2h18zM7 13H1V7h6zm12 0H9v-2h10zm0-4H9V7h10zm0-4H1V3h18z"/></svg>')}[dir] .cdx-demo-icon-css-icon--align-left--size-x-small--color-blue{background-color:var(--color-progressive, #36c)}}.cdx-demo-icon-css-icon--align-right{min-width:10px;min-height:10px;width:calc(var(--font-size-medium, 1rem) + 4px);height:calc(var(--font-size-medium, 1rem) + 4px);display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){[dir] .cdx-demo-icon-css-icon--align-right{background-position:center;background-repeat:no-repeat;background-size:max(calc(var(--font-size-medium, 1rem) + 4px),10px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-demo-icon-css-icon--align-right{-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:max(calc(var(--font-size-medium, 1rem) + 4px),10px);mask-size:max(calc(var(--font-size-medium, 1rem) + 4px),10px)}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-demo-icon-css-icon--align-right{filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}[dir] .cdx-demo-icon-css-icon--align-right{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M19 17H1v-2h18zm-8-4H1v-2h10zm8 0h-6V7h6zm-8-4H1V7h10zm8-4H1V3h18z"/></svg>')}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-demo-icon-css-icon--align-right{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M19 17H1v-2h18zm-8-4H1v-2h10zm8 0h-6V7h6zm-8-4H1V7h10zm8-4H1V3h18z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M19 17H1v-2h18zm-8-4H1v-2h10zm8 0h-6V7h6zm-8-4H1V7h10zm8-4H1V3h18z"/></svg>')}[dir] .cdx-demo-icon-css-icon--align-right{background-color:var(--color-base, #202122)}}.cdx-demo-icon-css-icon--align-right--size-medium--color-red{min-width:10px;min-height:10px;width:calc(var(--font-size-medium, 1rem) + 4px);height:calc(var(--font-size-medium, 1rem) + 4px);display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){[dir] .cdx-demo-icon-css-icon--align-right--size-medium--color-red{background-position:center;background-repeat:no-repeat;background-size:max(calc(var(--font-size-medium, 1rem) + 4px),10px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-demo-icon-css-icon--align-right--size-medium--color-red{-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:max(calc(var(--font-size-medium, 1rem) + 4px),10px);mask-size:max(calc(var(--font-size-medium, 1rem) + 4px),10px)}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-demo-icon-css-icon--align-right--size-medium--color-red{filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}[dir] .cdx-demo-icon-css-icon--align-right--size-medium--color-red{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M19 17H1v-2h18zm-8-4H1v-2h10zm8 0h-6V7h6zm-8-4H1V7h10zm8-4H1V3h18z"/></svg>')}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-demo-icon-css-icon--align-right--size-medium--color-red{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M19 17H1v-2h18zm-8-4H1v-2h10zm8 0h-6V7h6zm-8-4H1V7h10zm8-4H1V3h18z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M19 17H1v-2h18zm-8-4H1v-2h10zm8 0h-6V7h6zm-8-4H1V7h10zm8-4H1V3h18z"/></svg>')}[dir] .cdx-demo-icon-css-icon--align-right--size-medium--color-red{background-color:var(--color-destructive, #bf3c2c)}}.cdx-demo-icon-css-icon--align-right--size-small{min-width:10px;min-height:10px;width:var(--font-size-medium, 1rem);height:var(--font-size-medium, 1rem);display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){[dir] .cdx-demo-icon-css-icon--align-right--size-small{background-position:center;background-repeat:no-repeat;background-size:max(var(--font-size-medium, 1rem),10px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-demo-icon-css-icon--align-right--size-small{-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:max(var(--font-size-medium, 1rem),10px);mask-size:max(var(--font-size-medium, 1rem),10px)}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-demo-icon-css-icon--align-right--size-small{filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}[dir] .cdx-demo-icon-css-icon--align-right--size-small{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M19 17H1v-2h18zm-8-4H1v-2h10zm8 0h-6V7h6zm-8-4H1V7h10zm8-4H1V3h18z"/></svg>')}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-demo-icon-css-icon--align-right--size-small{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M19 17H1v-2h18zm-8-4H1v-2h10zm8 0h-6V7h6zm-8-4H1V7h10zm8-4H1V3h18z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M19 17H1v-2h18zm-8-4H1v-2h10zm8 0h-6V7h6zm-8-4H1V7h10zm8-4H1V3h18z"/></svg>')}[dir] .cdx-demo-icon-css-icon--align-right--size-small{background-color:var(--color-base, #202122)}}.cdx-demo-icon-css-icon--align-right--size-x-small--color-blue{min-width:10px;min-height:10px;width:calc(var(--font-size-medium, 1rem) - 4px);height:calc(var(--font-size-medium, 1rem) - 4px);display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){[dir] .cdx-demo-icon-css-icon--align-right--size-x-small--color-blue{background-position:center;background-repeat:no-repeat;background-size:max(calc(var(--font-size-medium, 1rem) - 4px),10px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-demo-icon-css-icon--align-right--size-x-small--color-blue{-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:max(calc(var(--font-size-medium, 1rem) - 4px),10px);mask-size:max(calc(var(--font-size-medium, 1rem) - 4px),10px)}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-demo-icon-css-icon--align-right--size-x-small--color-blue{filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}[dir] .cdx-demo-icon-css-icon--align-right--size-x-small--color-blue{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M19 17H1v-2h18zm-8-4H1v-2h10zm8 0h-6V7h6zm-8-4H1V7h10zm8-4H1V3h18z"/></svg>')}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-demo-icon-css-icon--align-right--size-x-small--color-blue{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M19 17H1v-2h18zm-8-4H1v-2h10zm8 0h-6V7h6zm-8-4H1V7h10zm8-4H1V3h18z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M19 17H1v-2h18zm-8-4H1v-2h10zm8 0h-6V7h6zm-8-4H1V7h10zm8-4H1V3h18z"/></svg>')}[dir] .cdx-demo-icon-css-icon--align-right--size-x-small--color-blue{background-color:var(--color-progressive, #36c)}}.cdx-demo-icon-css-icon--appearance{min-width:10px;min-height:10px;width:calc(var(--font-size-medium, 1rem) + 4px);height:calc(var(--font-size-medium, 1rem) + 4px);display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){[dir] .cdx-demo-icon-css-icon--appearance{background-position:center;background-repeat:no-repeat;background-size:max(calc(var(--font-size-medium, 1rem) + 4px),10px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-demo-icon-css-icon--appearance{-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:max(calc(var(--font-size-medium, 1rem) + 4px),10px);mask-size:max(calc(var(--font-size-medium, 1rem) + 4px),10px)}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-demo-icon-css-icon--appearance{filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}[dir] .cdx-demo-icon-css-icon--appearance{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M16.25 3A2.75 2.75 0 0119 5.75V14a4 4 0 01-7.874 1H8.874A4.002 4.002 0 011 14V5.75a2.75 2.75 0 015.5 0V7h-2V5.75a.75.75 0 00-1.5 0v4.786A4.002 4.002 0 018.874 13h2.252A4.002 4.002 0 0117 10.536V5.75a.75.75 0 00-1.5 0V7h-2V5.75A2.75 2.75 0 0116.25 3M5 12a2 2 0 100 4 2 2 0 000-4m10 0a2 2 0 100 4 2 2 0 000-4"/></svg>')}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-demo-icon-css-icon--appearance{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M16.25 3A2.75 2.75 0 0119 5.75V14a4 4 0 01-7.874 1H8.874A4.002 4.002 0 011 14V5.75a2.75 2.75 0 015.5 0V7h-2V5.75a.75.75 0 00-1.5 0v4.786A4.002 4.002 0 018.874 13h2.252A4.002 4.002 0 0117 10.536V5.75a.75.75 0 00-1.5 0V7h-2V5.75A2.75 2.75 0 0116.25 3M5 12a2 2 0 100 4 2 2 0 000-4m10 0a2 2 0 100 4 2 2 0 000-4"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M16.25 3A2.75 2.75 0 0119 5.75V14a4 4 0 01-7.874 1H8.874A4.002 4.002 0 011 14V5.75a2.75 2.75 0 015.5 0V7h-2V5.75a.75.75 0 00-1.5 0v4.786A4.002 4.002 0 018.874 13h2.252A4.002 4.002 0 0117 10.536V5.75a.75.75 0 00-1.5 0V7h-2V5.75A2.75 2.75 0 0116.25 3M5 12a2 2 0 100 4 2 2 0 000-4m10 0a2 2 0 100 4 2 2 0 000-4"/></svg>')}[dir] .cdx-demo-icon-css-icon--appearance{background-color:var(--color-base, #202122)}}.cdx-demo-icon-css-icon--appearance--size-medium--color-red{min-width:10px;min-height:10px;width:calc(var(--font-size-medium, 1rem) + 4px);height:calc(var(--font-size-medium, 1rem) + 4px);display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){[dir] .cdx-demo-icon-css-icon--appearance--size-medium--color-red{background-position:center;background-repeat:no-repeat;background-size:max(calc(var(--font-size-medium, 1rem) + 4px),10px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-demo-icon-css-icon--appearance--size-medium--color-red{-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:max(calc(var(--font-size-medium, 1rem) + 4px),10px);mask-size:max(calc(var(--font-size-medium, 1rem) + 4px),10px)}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-demo-icon-css-icon--appearance--size-medium--color-red{filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}[dir] .cdx-demo-icon-css-icon--appearance--size-medium--color-red{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M16.25 3A2.75 2.75 0 0119 5.75V14a4 4 0 01-7.874 1H8.874A4.002 4.002 0 011 14V5.75a2.75 2.75 0 015.5 0V7h-2V5.75a.75.75 0 00-1.5 0v4.786A4.002 4.002 0 018.874 13h2.252A4.002 4.002 0 0117 10.536V5.75a.75.75 0 00-1.5 0V7h-2V5.75A2.75 2.75 0 0116.25 3M5 12a2 2 0 100 4 2 2 0 000-4m10 0a2 2 0 100 4 2 2 0 000-4"/></svg>')}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-demo-icon-css-icon--appearance--size-medium--color-red{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M16.25 3A2.75 2.75 0 0119 5.75V14a4 4 0 01-7.874 1H8.874A4.002 4.002 0 011 14V5.75a2.75 2.75 0 015.5 0V7h-2V5.75a.75.75 0 00-1.5 0v4.786A4.002 4.002 0 018.874 13h2.252A4.002 4.002 0 0117 10.536V5.75a.75.75 0 00-1.5 0V7h-2V5.75A2.75 2.75 0 0116.25 3M5 12a2 2 0 100 4 2 2 0 000-4m10 0a2 2 0 100 4 2 2 0 000-4"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M16.25 3A2.75 2.75 0 0119 5.75V14a4 4 0 01-7.874 1H8.874A4.002 4.002 0 011 14V5.75a2.75 2.75 0 015.5 0V7h-2V5.75a.75.75 0 00-1.5 0v4.786A4.002 4.002 0 018.874 13h2.252A4.002 4.002 0 0117 10.536V5.75a.75.75 0 00-1.5 0V7h-2V5.75A2.75 2.75 0 0116.25 3M5 12a2 2 0 100 4 2 2 0 000-4m10 0a2 2 0 100 4 2 2 0 000-4"/></svg>')}[dir] .cdx-demo-icon-css-icon--appearance--size-medium--color-red{background-color:var(--color-destructive, #bf3c2c)}}.cdx-demo-icon-css-icon--appearance--size-small{min-width:10px;min-height:10px;width:var(--font-size-medium, 1rem);height:var(--font-size-medium, 1rem);display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){[dir] .cdx-demo-icon-css-icon--appearance--size-small{background-position:center;background-repeat:no-repeat;background-size:max(var(--font-size-medium, 1rem),10px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-demo-icon-css-icon--appearance--size-small{-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:max(var(--font-size-medium, 1rem),10px);mask-size:max(var(--font-size-medium, 1rem),10px)}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-demo-icon-css-icon--appearance--size-small{filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}[dir] .cdx-demo-icon-css-icon--appearance--size-small{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M16.25 3A2.75 2.75 0 0119 5.75V14a4 4 0 01-7.874 1H8.874A4.002 4.002 0 011 14V5.75a2.75 2.75 0 015.5 0V7h-2V5.75a.75.75 0 00-1.5 0v4.786A4.002 4.002 0 018.874 13h2.252A4.002 4.002 0 0117 10.536V5.75a.75.75 0 00-1.5 0V7h-2V5.75A2.75 2.75 0 0116.25 3M5 12a2 2 0 100 4 2 2 0 000-4m10 0a2 2 0 100 4 2 2 0 000-4"/></svg>')}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-demo-icon-css-icon--appearance--size-small{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M16.25 3A2.75 2.75 0 0119 5.75V14a4 4 0 01-7.874 1H8.874A4.002 4.002 0 011 14V5.75a2.75 2.75 0 015.5 0V7h-2V5.75a.75.75 0 00-1.5 0v4.786A4.002 4.002 0 018.874 13h2.252A4.002 4.002 0 0117 10.536V5.75a.75.75 0 00-1.5 0V7h-2V5.75A2.75 2.75 0 0116.25 3M5 12a2 2 0 100 4 2 2 0 000-4m10 0a2 2 0 100 4 2 2 0 000-4"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M16.25 3A2.75 2.75 0 0119 5.75V14a4 4 0 01-7.874 1H8.874A4.002 4.002 0 011 14V5.75a2.75 2.75 0 015.5 0V7h-2V5.75a.75.75 0 00-1.5 0v4.786A4.002 4.002 0 018.874 13h2.252A4.002 4.002 0 0117 10.536V5.75a.75.75 0 00-1.5 0V7h-2V5.75A2.75 2.75 0 0116.25 3M5 12a2 2 0 100 4 2 2 0 000-4m10 0a2 2 0 100 4 2 2 0 000-4"/></svg>')}[dir] .cdx-demo-icon-css-icon--appearance--size-small{background-color:var(--color-base, #202122)}}.cdx-demo-icon-css-icon--appearance--size-x-small--color-blue{min-width:10px;min-height:10px;width:calc(var(--font-size-medium, 1rem) - 4px);height:calc(var(--font-size-medium, 1rem) - 4px);display:inline-block;vertical-align:text-bottom}@supports not (((-webkit-mask-image: none) or (mask-image: none))){[dir] .cdx-demo-icon-css-icon--appearance--size-x-small--color-blue{background-position:center;background-repeat:no-repeat;background-size:max(calc(var(--font-size-medium, 1rem) - 4px),10px)}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-demo-icon-css-icon--appearance--size-x-small--color-blue{-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:max(calc(var(--font-size-medium, 1rem) - 4px),10px);mask-size:max(calc(var(--font-size-medium, 1rem) - 4px),10px)}}@supports not (((-webkit-mask-image: none) or (mask-image: none))){.cdx-demo-icon-css-icon--appearance--size-x-small--color-blue{filter:invert(var(--filter-invert-icon, 0));opacity:var(--opacity-icon-base, .87)}[dir] .cdx-demo-icon-css-icon--appearance--size-x-small--color-blue{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M16.25 3A2.75 2.75 0 0119 5.75V14a4 4 0 01-7.874 1H8.874A4.002 4.002 0 011 14V5.75a2.75 2.75 0 015.5 0V7h-2V5.75a.75.75 0 00-1.5 0v4.786A4.002 4.002 0 018.874 13h2.252A4.002 4.002 0 0117 10.536V5.75a.75.75 0 00-1.5 0V7h-2V5.75A2.75 2.75 0 0116.25 3M5 12a2 2 0 100 4 2 2 0 000-4m10 0a2 2 0 100 4 2 2 0 000-4"/></svg>')}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-demo-icon-css-icon--appearance--size-x-small--color-blue{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M16.25 3A2.75 2.75 0 0119 5.75V14a4 4 0 01-7.874 1H8.874A4.002 4.002 0 011 14V5.75a2.75 2.75 0 015.5 0V7h-2V5.75a.75.75 0 00-1.5 0v4.786A4.002 4.002 0 018.874 13h2.252A4.002 4.002 0 0117 10.536V5.75a.75.75 0 00-1.5 0V7h-2V5.75A2.75 2.75 0 0116.25 3M5 12a2 2 0 100 4 2 2 0 000-4m10 0a2 2 0 100 4 2 2 0 000-4"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="%23000"><path d="M16.25 3A2.75 2.75 0 0119 5.75V14a4 4 0 01-7.874 1H8.874A4.002 4.002 0 011 14V5.75a2.75 2.75 0 015.5 0V7h-2V5.75a.75.75 0 00-1.5 0v4.786A4.002 4.002 0 018.874 13h2.252A4.002 4.002 0 0117 10.536V5.75a.75.75 0 00-1.5 0V7h-2V5.75A2.75 2.75 0 0116.25 3M5 12a2 2 0 100 4 2 2 0 000-4m10 0a2 2 0 100 4 2 2 0 000-4"/></svg>')}[dir] .cdx-demo-icon-css-icon--appearance--size-x-small--color-blue{background-color:var(--color-progressive, #36c)}}.cdx-demo-icon-css-icon--arrow-down{min-width:10px;min-height:10px;width:calc(var(--font-size-medium, 1rem) + 4px);height:calc(var(--font-size-medium, 1rem) + 4px);displ