@wikimedia/codex
Version:
Codex Design System for Wikimedia
1 lines • 3.14 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 9V4H9v5H4v2h5v5h2v-5h5V9z"/></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 9V4H9v5H4v2h5v5h2v-5h5V9z"/></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 9V4H9v5H4v2h5v5h2v-5h5V9z"/></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 9V4H9v5H4v2h5v5h2v-5h5V9z"/></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 9V4H9v5H4v2h5v5h2v-5h5V9z"/></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 9V4H9v5H4v2h5v5h2v-5h5V9z"/></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 9V4H9v5H4v2h5v5h2v-5h5V9z"/></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 9V4H9v5H4v2h5v5h2v-5h5V9z"/></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 9V4H9v5H4v2h5v5h2v-5h5V9z"/></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 9V4H9v5H4v2h5v5h2v-5h5V9z"/></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 9V4H9v5H4v2h5v5h2v-5h5V9z"/></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 9V4H9v5H4v2h5v5h2v-5h5V9z"/></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="M11.53 2.3A1.85 1.85 0 0010 1.21 1.85 1.85 0 008.48 2.3L.36 16.36C-.48 17.81.21 19 1.88 19h16.24c1.67 0 2.36-1.19 1.52-2.64zM11 16H9v-2h2zm0-4H9V6h2z"/></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="M11.53 2.3A1.85 1.85 0 0010 1.21 1.85 1.85 0 008.48 2.3L.36 16.36C-.48 17.81.21 19 1.88 19h16.24c1.67 0 2.36-1.19 1.52-2.64zM11 16H9v-2h2zm0-4H9V6h2z"/></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.53 2.3A1.85 1.85 0 0010 1.21 1.85 1.85 0 008.48 2.3L.36 16.36C-.48 17.81.21 19 1.88 19h16.24c1.67 0 2.36-1.19 1.52-2.64zM11 16H9v-2h2zm0-4H9V6h2z"/></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="M11.53 2.3A1.85 1.85 0 0010 1.21 1.85 1.85 0 008.48 2.3L.36 16.36C-.48 17.81.21 19 1.88 19h16.24c1.67 0 2.36-1.19 1.52-2.64zM11 16H9v-2h2zm0-4H9V6h2z"/></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="M11.53 2.3A1.85 1.85 0 0010 1.21 1.85 1.85 0 008.48 2.3L.36 16.36C-.48 17.81.21 19 1.88 19h16.24c1.67 0 2.36-1.19 1.52-2.64zM11 16H9v-2h2zm0-4H9V6h2z"/></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.53 2.3A1.85 1.85 0 0010 1.21 1.85 1.85 0 008.48 2.3L.36 16.36C-.48 17.81.21 19 1.88 19h16.24c1.67 0 2.36-1.19 1.52-2.64zM11 16H9v-2h2zm0-4H9V6h2z"/></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="M11.53 2.3A1.85 1.85 0 0010 1.21 1.85 1.85 0 008.48 2.3L.36 16.36C-.48 17.81.21 19 1.88 19h16.24c1.67 0 2.36-1.19 1.52-2.64zM11 16H9v-2h2zm0-4H9V6h2z"/></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="M11.53 2.3A1.85 1.85 0 0010 1.21 1.85 1.85 0 008.48 2.3L.36 16.36C-.48 17.81.21 19 1.88 19h16.24c1.67 0 2.36-1.19 1.52-2.64zM11 16H9v-2h2zm0-4H9V6h2z"/></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.53 2.3A1.85 1.85 0 0010 1.21 1.85 1.85 0 008.48 2.3L.36 16.36C-.48 17.81.21 19 1.88 19h16.24c1.67 0 2.36-1.19 1.52-2.64zM11 16H9v-2h2zm0-4H9V6h2z"/></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="M11.53 2.3A1.85 1.85 0 0010 1.21 1.85 1.85 0 008.48 2.3L.36 16.36C-.48 17.81.21 19 1.88 19h16.24c1.67 0 2.36-1.19 1.52-2.64zM11 16H9v-2h2zm0-4H9V6h2z"/></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="M11.53 2.3A1.85 1.85 0 0010 1.21 1.85 1.85 0 008.48 2.3L.36 16.36C-.48 17.81.21 19 1.88 19h16.24c1.67 0 2.36-1.19 1.52-2.64zM11 16H9v-2h2zm0-4H9V6h2z"/></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.53 2.3A1.85 1.85 0 0010 1.21 1.85 1.85 0 008.48 2.3L.36 16.36C-.48 17.81.21 19 1.88 19h16.24c1.67 0 2.36-1.19 1.52-2.64zM11 16H9v-2h2zm0-4H9V6h2z"/></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="M1 15h18v2H1zM1 3h18v2H1z"/><rect width="8" height="6" x="6" y="7" rx="1"/></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="M1 15h18v2H1zM1 3h18v2H1z"/><rect width="8" height="6" x="6" y="7" rx="1"/></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="M1 15h18v2H1zM1 3h18v2H1z"/><rect width="8" height="6" x="6" y="7" rx="1"/></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="M1 15h18v2H1zM1 3h18v2H1z"/><rect width="8" height="6" x="6" y="7" rx="1"/></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="M1 15h18v2H1zM1 3h18v2H1z"/><rect width="8" height="6" x="6" y="7" rx="1"/></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="M1 15h18v2H1zM1 3h18v2H1z"/><rect width="8" height="6" x="6" y="7" rx="1"/></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="M1 15h18v2H1zM1 3h18v2H1z"/><rect width="8" height="6" x="6" y="7" rx="1"/></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="M1 15h18v2H1zM1 3h18v2H1z"/><rect width="8" height="6" x="6" y="7" rx="1"/></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="M1 15h18v2H1zM1 3h18v2H1z"/><rect width="8" height="6" x="6" y="7" rx="1"/></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="M1 15h18v2H1zM1 3h18v2H1z"/><rect width="8" height="6" x="6" y="7" rx="1"/></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="M1 15h18v2H1zM1 3h18v2H1z"/><rect width="8" height="6" x="6" y="7" rx="1"/></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="M1 15h18v2H1zM1 3h18v2H1z"/><rect width="8" height="6" x="6" y="7" rx="1"/></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="M12 7h7v2h-7zm0 4h7v2h-7zM1 15h18v2H1zM1 3h18v2H1z"/><rect width="8" height="6" x="1" y="7" rx="1"/></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="M12 7h7v2h-7zm0 4h7v2h-7zM1 15h18v2H1zM1 3h18v2H1z"/><rect width="8" height="6" x="1" y="7" rx="1"/></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="M12 7h7v2h-7zm0 4h7v2h-7zM1 15h18v2H1zM1 3h18v2H1z"/><rect width="8" height="6" x="1" y="7" rx="1"/></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="M12 7h7v2h-7zm0 4h7v2h-7zM1 15h18v2H1zM1 3h18v2H1z"/><rect width="8" height="6" x="1" y="7" rx="1"/></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="M12 7h7v2h-7zm0 4h7v2h-7zM1 15h18v2H1zM1 3h18v2H1z"/><rect width="8" height="6" x="1" y="7" rx="1"/></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="M12 7h7v2h-7zm0 4h7v2h-7zM1 15h18v2H1zM1 3h18v2H1z"/><rect width="8" height="6" x="1" y="7" rx="1"/></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="M12 7h7v2h-7zm0 4h7v2h-7zM1 15h18v2H1zM1 3h18v2H1z"/><rect width="8" height="6" x="1" y="7" rx="1"/></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="M12 7h7v2h-7zm0 4h7v2h-7zM1 15h18v2H1zM1 3h18v2H1z"/><rect width="8" height="6" x="1" y="7" rx="1"/></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="M12 7h7v2h-7zm0 4h7v2h-7zM1 15h18v2H1zM1 3h18v2H1z"/><rect width="8" height="6" x="1" y="7" rx="1"/></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="M12 7h7v2h-7zm0 4h7v2h-7zM1 15h18v2H1zM1 3h18v2H1z"/><rect width="8" height="6" x="1" y="7" rx="1"/></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="M12 7h7v2h-7zm0 4h7v2h-7zM1 15h18v2H1zM1 3h18v2H1z"/><rect width="8" height="6" x="1" y="7" rx="1"/></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="M12 7h7v2h-7zm0 4h7v2h-7zM1 15h18v2H1zM1 3h18v2H1z"/><rect width="8" height="6" x="1" y="7" rx="1"/></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="M1 7h7v2H1zm0 4h7v2H1zm0 4h18v2H1zM1 3h18v2H1z"/><rect width="8" height="6" x="11" y="7" rx="1"/></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="M1 7h7v2H1zm0 4h7v2H1zm0 4h18v2H1zM1 3h18v2H1z"/><rect width="8" height="6" x="11" y="7" rx="1"/></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="M1 7h7v2H1zm0 4h7v2H1zm0 4h18v2H1zM1 3h18v2H1z"/><rect width="8" height="6" x="11" y="7" rx="1"/></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="M1 7h7v2H1zm0 4h7v2H1zm0 4h18v2H1zM1 3h18v2H1z"/><rect width="8" height="6" x="11" y="7" rx="1"/></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="M1 7h7v2H1zm0 4h7v2H1zm0 4h18v2H1zM1 3h18v2H1z"/><rect width="8" height="6" x="11" y="7" rx="1"/></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="M1 7h7v2H1zm0 4h7v2H1zm0 4h18v2H1zM1 3h18v2H1z"/><rect width="8" height="6" x="11" y="7" rx="1"/></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="M1 7h7v2H1zm0 4h7v2H1zm0 4h18v2H1zM1 3h18v2H1z"/><rect width="8" height="6" x="11" y="7" rx="1"/></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="M1 7h7v2H1zm0 4h7v2H1zm0 4h18v2H1zM1 3h18v2H1z"/><rect width="8" height="6" x="11" y="7" rx="1"/></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="M1 7h7v2H1zm0 4h7v2H1zm0 4h18v2H1zM1 3h18v2H1z"/><rect width="8" height="6" x="11" y="7" rx="1"/></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="M1 7h7v2H1zm0 4h7v2H1zm0 4h18v2H1zM1 3h18v2H1z"/><rect width="8" height="6" x="11" y="7" rx="1"/></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="M1 7h7v2H1zm0 4h7v2H1zm0 4h18v2H1zM1 3h18v2H1z"/><rect width="8" height="6" x="11" y="7" rx="1"/></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="M1 7h7v2H1zm0 4h7v2H1zm0 4h18v2H1zM1 3h18v2H1z"/><rect width="8" height="6" x="11" y="7" rx="1"/></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="M1.2 9a4.25 4.25 0 017.9-.6 2.8 2.8 0 011.8 0 4.25 4.25 0 017.9.6 1.01 1.01 0 11.1 2 4.23 4.23 0 01-8.4-.6 1 1 0 00-1 0 4.23 4.23 0 01-8.4.6 1.01 1.01 0 11.1-2m4.05-1a2.25 2.25 0 000 4.5 2.25 2.25 0 000-4.5m9.5 0a2.25 2.25 0 000 4.5 2.25 2.25 0 000-4.5"/></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="M1.2 9a4.25 4.25 0 017.9-.6 2.8 2.8 0 011.8 0 4.25 4.25 0 017.9.6 1.01 1.01 0 11.1 2 4.23 4.23 0 01-8.4-.6 1 1 0 00-1 0 4.23 4.23 0 01-8.4.6 1.01 1.01 0 11.1-2m4.05-1a2.25 2.25 0 000 4.5 2.25 2.25 0 000-4.5m9.5 0a2.25 2.25 0 000 4.5 2.25 2.25 0 000-4.5"/></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="M1.2 9a4.25 4.25 0 017.9-.6 2.8 2.8 0 011.8 0 4.25 4.25 0 017.9.6 1.01 1.01 0 11.1 2 4.23 4.23 0 01-8.4-.6 1 1 0 00-1 0 4.23 4.23 0 01-8.4.6 1.01 1.01 0 11.1-2m4.05-1a2.25 2.25 0 000 4.5 2.25 2.25 0 000-4.5m9.5 0a2.25 2.25 0 000 4.5 2.25 2.25 0 000-4.5"/></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="M1.2 9a4.25 4.25 0 017.9-.6 2.8 2.8 0 011.8 0 4.25 4.25 0 017.9.6 1.01 1.01 0 11.1 2 4.23 4.23 0 01-8.4-.6 1 1 0 00-1 0 4.23 4.23 0 01-8.4.6 1.01 1.01 0 11.1-2m4.05-1a2.25 2.25 0 000 4.5 2.25 2.25 0 000-4.5m9.5 0a2.25 2.25 0 000 4.5 2.25 2.25 0 000-4.5"/></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="M1.2 9a4.25 4.25 0 017.9-.6 2.8 2.8 0 011.8 0 4.25 4.25 0 017.9.6 1.01 1.01 0 11.1 2 4.23 4.23 0 01-8.4-.6 1 1 0 00-1 0 4.23 4.23 0 01-8.4.6 1.01 1.01 0 11.1-2m4.05-1a2.25 2.25 0 000 4.5 2.25 2.25 0 000-4.5m9.5 0a2.25 2.25 0 000 4.5 2.25 2.25 0 000-4.5"/></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="M1.2 9a4.25 4.25 0 017.9-.6 2.8 2.8 0 011.8 0 4.25 4.25 0 017.9.6 1.01 1.01 0 11.1 2 4.23 4.23 0 01-8.4-.6 1 1 0 00-1 0 4.23 4.23 0 01-8.4.6 1.01 1.01 0 11.1-2m4.05-1a2.25 2.25 0 000 4.5 2.25 2.25 0 000-4.5m9.5 0a2.25 2.25 0 000 4.5 2.25 2.25 0 000-4.5"/></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="M1.2 9a4.25 4.25 0 017.9-.6 2.8 2.8 0 011.8 0 4.25 4.25 0 017.9.6 1.01 1.01 0 11.1 2 4.23 4.23 0 01-8.4-.6 1 1 0 00-1 0 4.23 4.23 0 01-8.4.6 1.01 1.01 0 11.1-2m4.05-1a2.25 2.25 0 000 4.5 2.25 2.25 0 000-4.5m9.5 0a2.25 2.25 0 000 4.5 2.25 2.25 0 000-4.5"/></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="M1.2 9a4.25 4.25 0 017.9-.6 2.8 2.8 0 011.8 0 4.25 4.25 0 017.9.6 1.01 1.01 0 11.1 2 4.23 4.23 0 01-8.4-.6 1 1 0 00-1 0 4.23 4.23 0 01-8.4.6 1.01 1.01 0 11.1-2m4.05-1a2.25 2.25 0 000 4.5 2.25 2.25 0 000-4.5m9.5 0a2.25 2.25 0 000 4.5 2.25 2.25 0 000-4.5"/></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="M1.2 9a4.25 4.25 0 017.9-.6 2.8 2.8 0 011.8 0 4.25 4.25 0 017.9.6 1.01 1.01 0 11.1 2 4.23 4.23 0 01-8.4-.6 1 1 0 00-1 0 4.23 4.23 0 01-8.4.6 1.01 1.01 0 11.1-2m4.05-1a2.25 2.25 0 000 4.5 2.25 2.25 0 000-4.5m9.5 0a2.25 2.25 0 000 4.5 2.25 2.25 0 000-4.5"/></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="M1.2 9a4.25 4.25 0 017.9-.6 2.8 2.8 0 011.8 0 4.25 4.25 0 017.9.6 1.01 1.01 0 11.1 2 4.23 4.23 0 01-8.4-.6 1 1 0 00-1 0 4.23 4.23 0 01-8.4.6 1.01 1.01 0 11.1-2m4.05-1a2.25 2.25 0 000 4.5 2.25 2.25 0 000-4.5m9.5 0a2.25 2.25 0 000 4.5 2.25 2.25 0 000-4.5"/></svg>')}}@supports ((-webkit-mask-image: none) or (mask-image: none)){.cdx-demo-icon-css-icon-