@squirrel-forge/sass-util/dist/util.min.css

sass abstracts, mixins, globals and utilities

:root{--text-normalize-headline-margin: 1rem 0;--text-normalize-paragraph-margin: 1rem 0;--text-normalize-size-adjust: 100%;--color-off-white:#fffbf0;--color-grey-2:#c2d1d9;--color-cerulean:#0081c8;--color-pumpkin-orange:#f28503;--color-butterscotch:#ffb93e;--color-butterscotch-comp:#3e84ff;--color-butterscotch-gray:#9f9f9f;--color-butterscotch-op-10:rgba(255, 185, 62, 0.1);--color-butterscotch-op-20:rgba(255, 185, 62, 0.2);--color-butterscotch-op-30:rgba(255, 185, 62, 0.3);--color-butterscotch-op-40:rgba(255, 185, 62, 0.4);--color-butterscotch-op-50:rgba(255, 185, 62, 0.5);--color-butterscotch-op-60:rgba(255, 185, 62, 0.6);--color-butterscotch-op-70:rgba(255, 185, 62, 0.7);--color-butterscotch-op-80:rgba(255, 185, 62, 0.8);--color-butterscotch-op-90:rgba(255, 185, 62, 0.9);--color-butterscotch-inv-10:#e6ae4b;--color-butterscotch-inv-20:#cca258;--color-butterscotch-inv-30:#b39765;--color-butterscotch-inv-40:#998b72;--color-butterscotch-inv-50:gray;--color-butterscotch-inv-60:#66748d;--color-butterscotch-inv-70:#4d699a;--color-butterscotch-inv-80:#335da7;--color-butterscotch-inv-90:#1a52b4;--color-butterscotch-inv-100:#0046c1;--color-butterscotch-hue-30:#e5ff3e;--color-butterscotch-hue-60:#84ff3e;--color-butterscotch-hue-90:#3eff59;--color-butterscotch-hue-120:#3effb9;--color-butterscotch-hue-150:#3ee5ff;--color-butterscotch-hue-180:#3e84ff;--color-butterscotch-hue-210:#593eff;--color-butterscotch-hue-240:#b93eff;--color-butterscotch-hue-270:#ff3ee5;--color-butterscotch-hue-300:#ff3e84;--color-butterscotch-hue-330:#ff593e;--color-butterscotch-dk-10:#ffa70b;--color-butterscotch-dk-20:#d78900;--color-butterscotch-dk-30:#a46900;--color-butterscotch-dk-40:#714800;--color-butterscotch-dk-50:#3e2800;--color-butterscotch-lt-10:#ffcb71;--color-butterscotch-lt-20:#ffdea4;--color-butterscotch-lt-30:#fff0d7;--color-butterscotch-lt-40:white;--color-butterscotch-lt-50:white;--color-butterscotch-dsat-10:#f5b648;--color-butterscotch-dsat-20:#ecb451;--color-butterscotch-dsat-30:#e2b15b;--color-butterscotch-dsat-40:#d8ae65;--color-butterscotch-dsat-50:#cfac6e;--color-butterscotch-dsat-60:#c5a978;--color-butterscotch-dsat-70:#bba682;--color-butterscotch-dsat-80:#b2a48b;--color-butterscotch-dsat-90:#a8a195;--decal-example-width: 1;--decal-example-height: 1;--decal-example-url: url("../img/example.jpg?1");--decal-example-before-width: 0;--decal-example-after-width: 0;--icon-color: currentColor;--icon-background-color: transparent;--icon-transition: 0.3s ease;--icon-size: 1;--icon-unit: 1.6rem;--icon-debug-color: deepskyblue;--icon-debug-background-color: deeppink;--icon-action-size: 0.6;--icon-action-width: 0.08;--icon-action-create-y: 0.4;--icon-action-create-x: 0.1;--icon-action-create-offset: 0.1;--icon-action-delete-y: 0.4;--icon-action-delete-x: 0.1;--icon-action-delete-offset: 0.1;--icon-action-edit-point-height: 0.165;--icon-action-edit-point-width: 0.14;--icon-action-edit-line: 0.05;--icon-action-edit-length: 0.75;--icon-action-edit-pen: 0.14;--icon-action-export-height: 0.27;--icon-action-export-width: 0.15;--icon-action-export-offset-x: 0.3;--icon-action-export-offset-y: 0.05;--icon-action-export-tail-height: 0.1;--icon-action-export-tail-width: 0.3;--icon-action-import-height: 0.27;--icon-action-import-width: 0.15;--icon-action-import-offset-x: 0.15;--icon-action-import-offset-y: 0.05;--icon-action-import-tail-height: 0.1;--icon-action-import-tail-width: 0.3;--icon-add-height: 0.6;--icon-add-width: 0.15;--icon-arrow-height: 0.65;--icon-arrow-width: 0.4;--icon-arrow-offset: 0.1;--icon-arrow-tail-height: 0.25;--icon-arrow-tail-width: 0.4;--icon-arrow-tail-offset: 0.1;--icon-arrow-capped-height: 0.45;--icon-arrow-capped-width: 0.25;--icon-arrow-capped-offset: 0.1;--icon-arrow-capped-tail-height: 0.14;--icon-arrow-capped-tail-width: 0.5;--icon-arrow-capped-cap-height: 0.4;--icon-arrow-capped-cap-width: 0.1;--icon-arrow-double-height: 0.45;--icon-arrow-double-width: 0.25;--icon-arrow-double-offset: 0.1;--icon-arrow-double-tail-height: 0.14;--icon-arrow-double-tail-width: 0.5;--icon-arrow-small-height: 0.45;--icon-arrow-small-width: 0.25;--icon-arrow-small-offset: 0.15;--icon-arrow-small-tail-height: 0.14;--icon-arrow-small-tail-width: 0.5;--icon-arrow-small-tail-offset: 0.15;--icon-check-width: 0.15;--icon-check-height: 0.5;--icon-check-line: 0.1;--icon-close-height: 0.7;--icon-close-width: 0.15;--icon-close-small-height: 0.55;--icon-close-small-width: 0.1;--icon-download-arrow-height: 0.2;--icon-download-arrow-width: 0.35;--icon-download-offset: 0.2;--icon-download-height: 0.08;--icon-download-width: 0.6;--icon-download-line-height: 0.3;--icon-download-line-width: 0.08;--icon-fastforward-height: 0.8;--icon-fastforward-width: 0.5;--icon-fastforward-a: translate(-80%, -50%);--icon-fastforward-b: translate(0, -50%);--icon-fullscreen-height: 0.6;--icon-fullscreen-width: 0.4;--icon-fullscreen-offset: 0.2;--icon-fullscreen-border: 0.1;--icon-fullscreen-interactive-offset: 0.1;--icon-important-offset: 0.2;--icon-important-height: 0.4;--icon-important-width: 0.12;--icon-important-dot-offset: 0.15;--icon-important-dot-height: 0.18;--icon-important-dot-width: 0.18;--icon-important-dot-radius: 50%;--icon-info-offset: 0.15;--icon-info-height: 0.42;--icon-info-width: 0.12;--icon-info-dot-offset: 0.2;--icon-info-dot-height: 0.14;--icon-info-dot-width: 0.14;--icon-info-dot-radius: 50%;--icon-menu-height: 0.09;--icon-menu-width: 0.6;--icon-menu-offset: -0.1;--icon-minimize-width: 0.16;--icon-minimize-height: 0.6;--icon-minimize-offset: 0.1;--icon-minimize-interactive-offset: 0.2;--icon-pause-height: 0.7;--icon-pause-width: 0.6;--icon-pause-border: 0.23;--icon-play-height: 0.8;--icon-play-width: 0.65;--icon-redo-circle-width: 0.6;--icon-redo-circle-height: 0.6;--icon-redo-circle-border: 0.12;--icon-redo-arrow-height: 2;--icon-redo-arrow-width: 2.4;--icon-redo-arrow-offset-x: -1.6;--icon-redo-arrow-offset-y: -0.295;--icon-remove-height: 0.15;--icon-remove-width: 0.6;--icon-replay-circle-width: 0.8;--icon-replay-circle-height: 0.8;--icon-replay-circle-border: 0.14;--icon-replay-arrow-height: 2.2;--icon-replay-arrow-width: 2.8;--icon-replay-arrow-offset-x: -2;--icon-replay-arrow-offset-y: -0.295;--icon-save-height: 0.6;--icon-save-width: 0.6;--icon-settings-size: 0.6;--icon-settings-width: 0.14;--icon-settings-line: 0.14;--icon-settings-offset: 0.12;--icon-settings-inset: polygon(0 0, 100% 0, 100% 15%, 0 15%, 0 85%, 100% 85%, 100% 100%, 0 100%);--icon-siux-height: 0.35;--icon-siux-width: 0.7;--icon-siux-border: 0.14;--icon-siux-circle-height: 0.8;--icon-siux-circle-width: 1;--icon-siux-circle-border: 0.07;--icon-sound-height: 0.65;--icon-sound-width: 0.4;--icon-sound-offset: 0.05;--icon-sound-muted-height: 0.3;--icon-sound-muted-width: 0.08;--icon-sound-none-border: 0.08;--icon-sound-none-line: 0.06;--icon-sound-on-cap: 0.5;--icon-sound-on-border: 0.1;--icon-sound-on-offset: 0.15;--icon-stop-height: 0.7;--icon-stop-width: 0.6;--icon-trash-height: 0.5;--icon-trash-width: 0.6;--icon-trash-offset: 0.1;--icon-trash-size-x: 0.3;--icon-trash-size-y: 0.25;--icon-trash-border: 0.08;--icon-undo-circle-width: 0.6;--icon-undo-circle-height: 0.6;--icon-undo-circle-border: 0.12;--icon-undo-arrow-height: 2;--icon-undo-arrow-width: 2.4;--icon-undo-arrow-offset-x: -1.6;--icon-undo-arrow-offset-y: -0.295;--icon-unknown-height: 0.4;--icon-unknown-width: 0.6;--icon-unknown-inset: 0.15;--icon-unknown-tail: 0.2;--icon-unknown-offset: 0.37;--icon-unknown-border: 0.12;--icon-unknown-dot-height: 0.14;--icon-unknown-dot-width: 0.14;--icon-unknown-dot-radius: 50%;--icon-unknown-dot-offset: 0.15;--icon-update-circle-width: 0.6;--icon-update-circle-height: 0.6;--icon-update-circle-border: 0.12;--icon-update-arrow-height: 2;--icon-update-arrow-width: 2.4;--icon-update-arrow-offset-x: -1.6;--icon-update-arrow-offset-y: -0.295;--icon-upload-arrow-height: 0.2;--icon-upload-arrow-width: 0.35;--icon-upload-offset: 0.2;--icon-upload-height: 0.08;--icon-upload-width: 0.6;--icon-upload-line-height: 0.3;--icon-upload-line-width: 0.08;--icon-user-height: 0.2;--icon-user-width: 0.6;--icon-user-radius: 0.35;--icon-user-circle-height: 0.4;--icon-user-circle-width: 0.4;--icon-user-offset: 0.15;--icon-image-example-default: url("../img/default.jpg?1");--icon-image-extra-default: url("../img/default.jpg?1");--icon-image-extra-interactive: url("../img/interactive.jpg?1");--list-margin: 1rem 0;--list-padding: 0 0 0;--list-indent-width: 2rem;--list-item-margin: 0;--list-item-after-margin: 1rem 0 0;--button-margin: auto 0;--button-margin-inline: 0.25em;--button-padding: 0.25em;--button-icon-padding: 0.25em;--button-border: 1px solid currentColor;--button-border-radius: 0.25em;--button-icon-spacing: 0.25em;--button-label-spacing: 0.25em;--button-min-width: 8em;--button-disabled-opacity: 0.6;--button-transition: 0.3s ease;--button-styled-color: lightslategray;--button-styled-background: white;--button-styled-border: lightsteelblue;--button-disabled-color: silver;--button-disabled-background: whitesmoke;--button-disabled-border: lightgray;--button-interactive-color: steelblue;--button-interactive-background: aliceblue;--button-interactive-border: steelblue}*,::before,::after{-webkit-box-sizing:border-box;box-sizing:border-box}body{margin:0;padding:0;scroll-behavior:smooth;min-height:100vh}*:hover,*:active,*:focus{outline:none}main,header,footer,section,article,figure,figcaption,fieldset,details,summary{display:block;margin:0;padding:0}fieldset{border:0}button,input,select,textarea{margin:0;padding:0;font-family:inherit;font-size:inherit;text-align:inherit;color:inherit;background-color:rgba(0,0,0,0);border:0}button,select{cursor:pointer}a{color:inherit;text-decoration:none;outline:none}a:active,a:focus,a:hover,a:visited{text-decoration:none;outline:none}html{-webkit-text-size-adjust:var(--text-normalize-size-adjust);-moz-text-size-adjust:var(--text-normalize-size-adjust);-ms-text-size-adjust:var(--text-normalize-size-adjust);text-size-adjust:var(--text-normalize-size-adjust);text-rendering:optimizeSpeed}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}h1,h2,h3,h4,h5,h6{margin:var(--text-normalize-headline-margin)}p{margin:var(--text-normalize-paragraph-margin)}h1:first-child,h2:first-child,h3:first-child,h4:first-child,h5:first-child,h6:first-child,p:first-child{margin-top:0}h1:last-child,h2:last-child,h3:last-child,h4:last-child,h5:last-child,h6:last-child,p:last-child{margin-bottom:0}.text--hide-a11y{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border:0}.text--no-select{-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.text--center{text-align:center}@media screen and (max-width: 767px){.text--center-m{text-align:center}}@media screen and (max-width: 991px){.text--center-mtp{text-align:center}}@media screen and (min-width: 768px)and (max-width: 991px){.text--center-tp{text-align:center}}@media screen and (min-width: 992px)and (max-width: 1024px){.text--center-tl{text-align:center}}@media screen and (min-width: 768px)and (max-width: 1024px){.text--center-t{text-align:center}}@media screen and (min-width: 768px){.text--center-td{text-align:center}}@media screen and (min-width: 992px){.text--center-tld{text-align:center}}@media screen and (min-width: 1025px){.text--center-d{text-align:center}}@media screen and (min-width: 1440px){.text--center-dm{text-align:center}}.text--right{text-align:right}@media screen and (max-width: 767px){.text--right-m{text-align:right}}@media screen and (max-width: 991px){.text--right-mtp{text-align:right}}@media screen and (min-width: 768px)and (max-width: 991px){.text--right-tp{text-align:right}}@media screen and (min-width: 992px)and (max-width: 1024px){.text--right-tl{text-align:right}}@media screen and (min-width: 768px)and (max-width: 1024px){.text--right-t{text-align:right}}@media screen and (min-width: 768px){.text--right-td{text-align:right}}@media screen and (min-width: 992px){.text--right-tld{text-align:right}}@media screen and (min-width: 1025px){.text--right-d{text-align:right}}@media screen and (min-width: 1440px){.text--right-dm{text-align:right}}.text--left{text-align:left}@media screen and (max-width: 767px){.text--left-m{text-align:left}}@media screen and (max-width: 991px){.text--left-mtp{text-align:left}}@media screen and (min-width: 768px)and (max-width: 991px){.text--left-tp{text-align:left}}@media screen and (min-width: 992px)and (max-width: 1024px){.text--left-tl{text-align:left}}@media screen and (min-width: 768px)and (max-width: 1024px){.text--left-t{text-align:left}}@media screen and (min-width: 768px){.text--left-td{text-align:left}}@media screen and (min-width: 992px){.text--left-tld{text-align:left}}@media screen and (min-width: 1025px){.text--left-d{text-align:left}}@media screen and (min-width: 1440px){.text--left-dm{text-align:left}}.break-rsp br{display:none}@media screen and (max-width: 767px){.break-rsp br.break-m{display:inline}}@media screen and (max-width: 991px){.break-rsp br.break-mtp{display:inline}}@media screen and (min-width: 768px)and (max-width: 991px){.break-rsp br.break-tp{display:inline}}@media screen and (min-width: 992px)and (max-width: 1024px){.break-rsp br.break-tl{display:inline}}@media screen and (min-width: 768px)and (max-width: 1024px){.break-rsp br.break-t{display:inline}}@media screen and (min-width: 768px){.break-rsp br.break-td{display:inline}}@media screen and (min-width: 992px){.break-rsp br.break-tld{display:inline}}@media screen and (min-width: 1025px){.break-rsp br.break-d{display:inline}}@media screen and (min-width: 1440px){.break-rsp br.break-dm{display:inline}}.text--break-before::before{content:"\a";white-space:pre}.text--break-after::after{content:"\a";white-space:pre}.text--clear-before::before{display:block;content:"";clear:both}.text--clear-after::after{display:block;content:"";clear:both}.text--break-keep br{display:inline}.text--no-break{white-space:nowrap}.text--wbreak{word-break:break-word;-webkit-hyphens:auto;-ms-hyphens:auto;hyphens:auto}@media screen and (max-width: 767px){.text--wbreak-m{word-break:break-word;-webkit-hyphens:auto;-ms-hyphens:auto;hyphens:auto}}@media screen and (max-width: 991px){.text--wbreak-mtp{word-break:break-word;-webkit-hyphens:auto;-ms-hyphens:auto;hyphens:auto}}@media screen and (min-width: 768px)and (max-width: 991px){.text--wbreak-tp{word-break:break-word;-webkit-hyphens:auto;-ms-hyphens:auto;hyphens:auto}}@media screen and (min-width: 992px)and (max-width: 1024px){.text--wbreak-tl{word-break:break-word;-webkit-hyphens:auto;-ms-hyphens:auto;hyphens:auto}}@media screen and (min-width: 768px)and (max-width: 1024px){.text--wbreak-t{word-break:break-word;-webkit-hyphens:auto;-ms-hyphens:auto;hyphens:auto}}@media screen and (min-width: 768px){.text--wbreak-td{word-break:break-word;-webkit-hyphens:auto;-ms-hyphens:auto;hyphens:auto}}@media screen and (min-width: 992px){.text--wbreak-tld{word-break:break-word;-webkit-hyphens:auto;-ms-hyphens:auto;hyphens:auto}}@media screen and (min-width: 1025px){.text--wbreak-d{word-break:break-word;-webkit-hyphens:auto;-ms-hyphens:auto;hyphens:auto}}@media screen and (min-width: 1440px){.text--wbreak-dm{word-break:break-word;-webkit-hyphens:auto;-ms-hyphens:auto;hyphens:auto}}.color--text-off-white{color:var(--color-off-white)}.color--text-grey-2{color:var(--color-grey-2)}.color--text-cerulean{color:var(--color-cerulean)}.color--text-pumpkin-orange{color:var(--color-pumpkin-orange)}.color--text-butterscotch{color:var(--color-butterscotch)}.color--bg-off-white{background-color:var(--color-off-white)}.color--bg-grey-2{background-color:var(--color-grey-2)}.color--bg-cerulean{background-color:var(--color-cerulean)}.color--bg-pumpkin-orange{background-color:var(--color-pumpkin-orange)}.color--bg-butterscotch{background-color:var(--color-butterscotch)}.color--bg-butterscotch-comp{background-color:var(--color-butterscotch-comp)}.color--bg-butterscotch-gray{background-color:var(--color-butterscotch-gray)}.color--bg-butterscotch-op-10{background-color:var(--color-butterscotch-op-10)}.color--bg-butterscotch-op-20{background-color:var(--color-butterscotch-op-20)}.color--bg-butterscotch-op-30{background-color:var(--color-butterscotch-op-30)}.color--bg-butterscotch-op-40{background-color:var(--color-butterscotch-op-40)}.color--bg-butterscotch-op-50{background-color:var(--color-butterscotch-op-50)}.color--bg-butterscotch-op-60{background-color:var(--color-butterscotch-op-60)}.color--bg-butterscotch-op-70{background-color:var(--color-butterscotch-op-70)}.color--bg-butterscotch-op-80{background-color:var(--color-butterscotch-op-80)}.color--bg-butterscotch-op-90{background-color:var(--color-butterscotch-op-90)}.color--bg-butterscotch-inv-10{background-color:var(--color-butterscotch-inv-10)}.color--bg-butterscotch-inv-20{background-color:var(--color-butterscotch-inv-20)}.color--bg-butterscotch-inv-30{background-color:var(--color-butterscotch-inv-30)}.color--bg-butterscotch-inv-40{background-color:var(--color-butterscotch-inv-40)}.color--bg-butterscotch-inv-50{background-color:var(--color-butterscotch-inv-50)}.color--bg-butterscotch-inv-60{background-color:var(--color-butterscotch-inv-60)}.color--bg-butterscotch-inv-70{background-color:var(--color-butterscotch-inv-70)}.color--bg-butterscotch-inv-80{background-color:var(--color-butterscotch-inv-80)}.color--bg-butterscotch-inv-90{background-color:var(--color-butterscotch-inv-90)}.color--bg-butterscotch-inv-100{background-color:var(--color-butterscotch-inv-100)}.color--bg-butterscotch-hue-30{background-color:var(--color-butterscotch-hue-30)}.color--bg-butterscotch-hue-60{background-color:var(--color-butterscotch-hue-60)}.color--bg-butterscotch-hue-90{background-color:var(--color-butterscotch-hue-90)}.color--bg-butterscotch-hue-120{background-color:var(--color-butterscotch-hue-120)}.color--bg-butterscotch-hue-150{background-color:var(--color-butterscotch-hue-150)}.color--bg-butterscotch-hue-180{background-color:var(--color-butterscotch-hue-180)}.color--bg-butterscotch-hue-210{background-color:var(--color-butterscotch-hue-210)}.color--bg-butterscotch-hue-240{background-color:var(--color-butterscotch-hue-240)}.color--bg-butterscotch-hue-270{background-color:var(--color-butterscotch-hue-270)}.color--bg-butterscotch-hue-300{background-color:var(--color-butterscotch-hue-300)}.color--bg-butterscotch-hue-330{background-color:var(--color-butterscotch-hue-330)}.color--bg-butterscotch-dk-10{background-color:var(--color-butterscotch-dk-10)}.color--bg-butterscotch-dk-20{background-color:var(--color-butterscotch-dk-20)}.color--bg-butterscotch-dk-30{background-color:var(--color-butterscotch-dk-30)}.color--bg-butterscotch-dk-40{background-color:var(--color-butterscotch-dk-40)}.color--bg-butterscotch-dk-50{background-color:var(--color-butterscotch-dk-50)}.color--bg-butterscotch-lt-10{background-color:var(--color-butterscotch-lt-10)}.color--bg-butterscotch-lt-20{background-color:var(--color-butterscotch-lt-20)}.color--bg-butterscotch-lt-30{background-color:var(--color-butterscotch-lt-30)}.color--bg-butterscotch-lt-40{background-color:var(--color-butterscotch-lt-40)}.color--bg-butterscotch-lt-50{background-color:var(--color-butterscotch-lt-50)}.color--bg-butterscotch-dsat-10{background-color:var(--color-butterscotch-dsat-10)}.color--bg-butterscotch-dsat-20{background-color:var(--color-butterscotch-dsat-20)}.color--bg-butterscotch-dsat-30{background-color:var(--color-butterscotch-dsat-30)}.color--bg-butterscotch-dsat-40{background-color:var(--color-butterscotch-dsat-40)}.color--bg-butterscotch-dsat-50{background-color:var(--color-butterscotch-dsat-50)}.color--bg-butterscotch-dsat-60{background-color:var(--color-butterscotch-dsat-60)}.color--bg-butterscotch-dsat-70{background-color:var(--color-butterscotch-dsat-70)}.color--bg-butterscotch-dsat-80{background-color:var(--color-butterscotch-dsat-80)}.color--bg-butterscotch-dsat-90{background-color:var(--color-butterscotch-dsat-90)}.color--bdr-grey-2{border-color:var(--color-grey-2)}.color--bdr-cerulean{border-color:var(--color-cerulean)}.color--bdr-pumpkin-orange{border-color:var(--color-pumpkin-orange)}.color--bdr-butterscotch{border-color:var(--color-butterscotch)}.color--bdr-butterscotch-comp{border-color:var(--color-butterscotch-comp)}.decals{position:static}.decals:not(.decals--static){position:relative}.decals::before,.decals::after{position:absolute;background-position:left top;background-repeat:no-repeat;background-size:100% 100%;content:""}.decals--example-before::before{width:var(--decal-example-before-width);background-image:var(--decal-example-url);padding-bottom:calc(1 * var(--decal-example-before-width))}.decals--example-after::after{width:var(--decal-example-after-width);background-image:var(--decal-example-url);padding-bottom:calc(1 * var(--decal-example-after-width))}.icon{position:relative;display:block;width:calc(var(--icon-size)*var(--icon-unit));height:calc(var(--icon-size)*var(--icon-unit));background-color:var(--icon-background-color);overflow:hidden;text-indent:-999px;-webkit-transition:var(--icon-transition);transition:var(--icon-transition)}.ui-interactive .icon{-webkit-transition:inherit;transition:inherit}.icon--inline{display:inline-block;vertical-align:middle}.icon--rotate-45{-webkit-transform:rotate(45deg);transform:rotate(45deg)}.icon--rotate-90{-webkit-transform:rotate(90deg);transform:rotate(90deg)}.icon--rotate-135{-webkit-transform:rotate(135deg);transform:rotate(135deg)}.icon--rotate-180{-webkit-transform:rotate(180deg);transform:rotate(180deg)}.icon--rotate-225{-webkit-transform:rotate(225deg);transform:rotate(225deg)}.icon--rotate-270{-webkit-transform:rotate(270deg);transform:rotate(270deg)}.icon--rotate-315{-webkit-transform:rotate(315deg);transform:rotate(315deg)}.icon--flip-x{-webkit-transform:scale(-1, 1);transform:scale(-1, 1)}.icon--flip-y{-webkit-transform:scale(1, -1);transform:scale(1, -1)}.icon--flip-x.icon--flip-y{-webkit-transform:scale(-1, -1);transform:scale(-1, -1)}.icon:not(.icon--img) span,.icon:not(.icon--img) span::before,.icon:not(.icon--img) span::after,.icon:not(.icon--img)::before,.icon:not(.icon--img)::after{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%);content:"";-webkit-transition:inherit;transition:inherit}.icon--img::before,.icon--img::after{position:absolute;top:0;left:0;width:100%;height:100%;background-position:center center;background-repeat:no-repeat;background-size:contain;content:"";opacity:1;-webkit-transition:inherit;transition:inherit}.icon--img::before{opacity:1;background-image:var(--icon-image-default)}.icon--img::after{opacity:0;background-image:var(--icon-image-interactive)}.ui-interactive:hover .icon--img::before,.ui-interactive:focus .icon--img::before{opacity:0}.ui-interactive:hover .icon--img::after,.ui-interactive:focus .icon--img::after{opacity:1}.debug-css .icon{--icon-color: var(--icon-debug-color) !important;--icon-background-color: var(--icon-debug-background-color) !important}.icon[data-icon^=action]::before,.icon[data-icon^=action]::after{left:calc((var(--icon-size)*var(--icon-unit) - var(--icon-size)*var(--icon-unit)*var(--icon-action-size))/2);-webkit-transform:none;transform:none}.icon[data-icon^=action]::before{top:calc((var(--icon-size)*var(--icon-unit) - var(--icon-size)*var(--icon-unit)*var(--icon-action-size))/2);height:calc(var(--icon-size)*var(--icon-unit)*var(--icon-action-size));width:calc(var(--icon-size)*var(--icon-unit)*var(--icon-action-width));background-color:var(--icon-color)}.icon[data-icon^=action]::after{top:auto;bottom:calc((var(--icon-size)*var(--icon-unit) - var(--icon-size)*var(--icon-unit)*var(--icon-action-size))/2);height:calc(var(--icon-size)*var(--icon-unit)*var(--icon-action-width));width:calc(var(--icon-size)*var(--icon-unit)*var(--icon-action-size));background-color:var(--icon-color)}.icon[data-icon=action-create] span::before,.icon[data-icon=action-create] span::after{top:calc(50% - var(--icon-size)*var(--icon-unit)*var(--icon-action-create-offset));left:calc(50% + var(--icon-size)*var(--icon-unit)*var(--icon-action-create-offset));height:calc(var(--icon-size)*var(--icon-unit)*var(--icon-action-create-y));width:calc(var(--icon-size)*var(--icon-unit)*var(--icon-action-create-x));background-color:var(--icon-color)}.icon[data-icon=action-create] span::before{-webkit-transform:translate(-50%, -50%) rotate(90deg);transform:translate(-50%, -50%) rotate(90deg)}.icon[data-icon=action-delete] span::before,.icon[data-icon=action-delete] span::after{top:calc(50% - var(--icon-size)*var(--icon-unit)*var(--icon-action-delete-offset));left:calc(50% + var(--icon-size)*var(--icon-unit)*var(--icon-action-delete-offset));height:calc(var(--icon-size)*var(--icon-unit)*var(--icon-action-delete-y));width:calc(var(--icon-size)*var(--icon-unit)*var(--icon-action-delete-x));background-color:var(--icon-color)}.icon[data-icon=action-delete] span::before{-webkit-transform:translate(-50%, -50%) rotate(45deg);transform:translate(-50%, -50%) rotate(45deg)}.icon[data-icon=action-delete] span::after{-webkit-transform:translate(-50%, -50%) rotate(-45deg);transform:translate(-50%, -50%) rotate(-45deg)}.icon[data-icon=action-edit] span{height:calc(var(--icon-size)*var(--icon-unit)*var(--icon-action-edit-length));width:calc(var(--icon-size)*var(--icon-unit)*var(--icon-action-edit-pen));-webkit-transform:translate(-50%, -50%) rotate(45deg);transform:translate(-50%, -50%) rotate(45deg)}.icon[data-icon=action-edit] span::before{top:auto;left:0;bottom:calc(50% - var(--icon-size)*var(--icon-unit)*var(--icon-action-edit-line));width:0;height:0;border-top:calc(var(--icon-size)*var(--icon-unit)*var(--icon-action-edit-point-height)) solid var(--icon-color);border-left:calc(var(--icon-size)*var(--icon-unit)*var(--icon-action-edit-point-width)/2) solid rgba(0,0,0,0);border-right:calc(var(--icon-size)*var(--icon-unit)*var(--icon-action-edit-point-width)/2) solid rgba(0,0,0,0);-webkit-transform:translate(0, 100%);transform:translate(0, 100%)}.icon[data-icon=action-edit] span::after{top:0;left:0;width:100%;height:50%;background-color:var(--icon-color);-webkit-transform:none;transform:none}.icon[data-icon=action-export] span{top:calc(50% - var(--icon-size)*var(--icon-unit)*var(--icon-action-export-offset-y));left:calc(50% + var(--icon-size)*var(--icon-unit)*var(--icon-action-export-offset-x))}.icon[data-icon=action-export] span::before{left:auto;right:0;height:calc(var(--icon-size)*var(--icon-unit)*var(--icon-action-export-tail-height));width:calc(var(--icon-size)*var(--icon-unit)*var(--icon-action-export-tail-width));background-color:var(--icon-color);-webkit-transform:translate(0, -50%);transform:translate(0, -50%)}.icon[data-icon=action-export] span::after{left:0;width:0;height:0;-webkit-transform:translate(0, -50%);transform:translate(0, -50%);border-top:calc(var(--icon-size)*var(--icon-unit)*var(--icon-action-export-height)/2) solid rgba(0,0,0,0);border-bottom:calc(var(--icon-size)*var(--icon-unit)*var(--icon-action-export-height)/2) solid rgba(0,0,0,0);border-left:calc(var(--icon-size)*var(--icon-unit)*var(--icon-action-export-width)) solid var(--icon-color)}.icon[data-icon=action-import] span{top:calc(50% - var(--icon-size)*var(--icon-unit)*var(--icon-action-import-offset-y));left:calc(50% + var(--icon-size)*var(--icon-unit)*var(--icon-action-import-offset-x))}.icon[data-icon=action-import] span::before{left:0;height:calc(var(--icon-size)*var(--icon-unit)*var(--icon-action-import-tail-height));width:calc(var(--icon-size)*var(--icon-unit)*var(--icon-action-import-tail-width));background-color:var(--icon-color);-webkit-transform:translate(0, -50%);transform:translate(0, -50%)}.icon[data-icon=action-import] span::after{left:auto;right:0;width:0;height:0;-webkit-transform:translate(0, -50%);transform:translate(0, -50%);border-top:calc(var(--icon-size)*var(--icon-unit)*var(--icon-action-import-height)/2) solid rgba(0,0,0,0);border-bottom:calc(var(--icon-size)*var(--icon-unit)*var(--icon-action-import-height)/2) solid rgba(0,0,0,0);border-right:calc(var(--icon-size)*var(--icon-unit)*var(--icon-action-import-width)) solid var(--icon-color)}.icon[data-icon=add]::before,.icon[data-icon=add]::after{height:calc(var(--icon-size)*var(--icon-unit)*var(--icon-add-height));width:calc(var(--icon-size)*var(--icon-unit)*var(--icon-add-width));background-color:var(--icon-color)}.icon[data-icon=add]::before{-webkit-transform:translate(-50%, -50%) rotate(90deg);transform:translate(-50%, -50%) rotate(90deg)}.icon[data-icon=arrow]::before{left:calc(var(--icon-size)*var(--icon-unit)*var(--icon-arrow-tail-offset));height:calc(var(--icon-size)*var(--icon-unit)*var(--icon-arrow-tail-height));width:calc(var(--icon-size)*var(--icon-unit)*var(--icon-arrow-tail-width));background-color:var(--icon-color);-webkit-transform:translate(0, -50%);transform:translate(0, -50%)}.icon[data-icon=arrow]::after{left:auto;right:calc(var(--icon-size)*var(--icon-unit)*var(--icon-arrow-offset));width:0;height:0;-webkit-transform:translate(0, -50%);transform:translate(0, -50%);border-top:calc(var(--icon-size)*var(--icon-unit)*var(--icon-arrow-height)/2) solid rgba(0,0,0,0);border-bottom:calc(var(--icon-size)*var(--icon-unit)*var(--icon-arrow-height)/2) solid rgba(0,0,0,0);border-left:calc(var(--icon-size)*var(--icon-unit)*var(--icon-arrow-width)) solid var(--icon-color)}.icon[data-icon=arrow-capped] span:first-child{height:calc(var(--icon-size)*var(--icon-unit)*var(--icon-arrow-capped-tail-height));width:calc(var(--icon-size)*var(--icon-unit)*var(--icon-arrow-capped-tail-width));background-color:var(--icon-color)}.icon[data-icon=arrow-capped]::before{left:calc(var(--icon-size)*var(--icon-unit)*var(--icon-arrow-capped-offset));width:calc(var(--icon-size)*var(--icon-unit)*var(--icon-arrow-capped-cap-width));height:calc(var(--icon-size)*var(--icon-unit)*var(--icon-arrow-capped-cap-height));background-color:var(--icon-color);-webkit-transform:translate(0, -50%);transform:translate(0, -50%)}.icon[data-icon=arrow-capped]::after{left:auto;right:calc(var(--icon-size)*var(--icon-unit)*var(--icon-arrow-capped-offset));width:0;height:0;border-top:calc(var(--icon-size)*var(--icon-unit)*var(--icon-arrow-capped-height)/2) solid rgba(0,0,0,0);border-bottom:calc(var(--icon-size)*var(--icon-unit)*var(--icon-arrow-capped-height)/2) solid rgba(0,0,0,0);border-left:calc(var(--icon-size)*var(--icon-unit)*var(--icon-arrow-capped-width)) solid var(--icon-color);-webkit-transform:translate(0, -50%);transform:translate(0, -50%)}.icon[data-icon=arrow-double] span:first-child{height:calc(var(--icon-size)*var(--icon-unit)*var(--icon-arrow-double-tail-height));width:calc(var(--icon-size)*var(--icon-unit)*var(--icon-arrow-double-tail-width));background-color:var(--icon-color)}.icon[data-icon=arrow-double]::before,.icon[data-icon=arrow-double]::after{width:0;height:0;-webkit-transform:translate(0, -50%);transform:translate(0, -50%);border-top:calc(var(--icon-size)*var(--icon-unit)*var(--icon-arrow-double-height)/2) solid rgba(0,0,0,0);border-bottom:calc(var(--icon-size)*var(--icon-unit)*var(--icon-arrow-double-height)/2) solid rgba(0,0,0,0)}.icon[data-icon=arrow-double]::before{left:calc(var(--icon-size)*var(--icon-unit)*var(--icon-arrow-double-offset));border-right:calc(var(--icon-size)*var(--icon-unit)*var(--icon-arrow-double-width)) solid var(--icon-color)}.icon[data-icon=arrow-double]::after{left:auto;right:calc(var(--icon-size)*var(--icon-unit)*var(--icon-arrow-double-offset));border-left:calc(var(--icon-size)*var(--icon-unit)*var(--icon-arrow-double-width)) solid var(--icon-color)}.icon[data-icon=arrow-small]::before{left:calc(var(--icon-size)*var(--icon-unit)*var(--icon-arrow-small-tail-offset));height:calc(var(--icon-size)*var(--icon-unit)*var(--icon-arrow-small-tail-height));width:calc(var(--icon-size)*var(--icon-unit)*var(--icon-arrow-small-tail-width));background-color:var(--icon-color);-webkit-transform:translate(0, -50%);transform:translate(0, -50%)}.icon[data-icon=arrow-small]::after{left:auto;right:calc(var(--icon-size)*var(--icon-unit)*var(--icon-arrow-small-offset));width:0;height:0;-webkit-transform:translate(0, -50%);transform:translate(0, -50%);border-top:calc(var(--icon-size)*var(--icon-unit)*var(--icon-arrow-small-height)/2) solid rgba(0,0,0,0);border-bottom:calc(var(--icon-size)*var(--icon-unit)*var(--icon-arrow-small-height)/2) solid rgba(0,0,0,0);border-left:calc(var(--icon-size)*var(--icon-unit)*var(--icon-arrow-small-width)) solid var(--icon-color)}.icon[data-icon=check] span{width:calc(var(--icon-size)*var(--icon-unit)*var(--icon-check-line));height:calc(var(--icon-size)*var(--icon-unit)*var(--icon-check-height));background-color:var(--icon-color);-webkit-transform:translate(-50%, -50%) rotate(45deg);transform:translate(-50%, -50%) rotate(45deg)}.icon[data-icon=check] span::after{top:auto;left:0;bottom:0;height:calc(var(--icon-size)*var(--icon-unit)*var(--icon-check-line));width:calc(var(--icon-size)*var(--icon-unit)*var(--icon-check-width));background-color:var(--icon-color);-webkit-transform:translate(-100%, 0);transform:translate(-100%, 0)}.icon[data-icon=close]::before,.icon[data-icon=close]::after{top:calc((var(--icon-size)*var(--icon-unit) - var(--icon-size)*var(--icon-unit)*var(--icon-close-height))/2);left:calc((var(--icon-size)*var(--icon-unit) - var(--icon-size)*var(--icon-unit)*var(--icon-close-width))/2);height:calc(var(--icon-size)*var(--icon-unit)*var(--icon-close-height));width:calc(var(--icon-size)*var(--icon-unit)*var(--icon-close-width));background-color:var(--icon-color)}.icon[data-icon=close]::before{-webkit-transform:rotate(45deg);transform:rotate(45deg)}.icon[data-icon=close]::after{-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}.icon[data-icon=close-small]::before,.icon[data-icon=close-small]::after{top:calc((var(--icon-size)*var(--icon-unit) - var(--icon-size)*var(--icon-unit)*var(--icon-close-small-height))/2);left:calc((var(--icon-size)*var(--icon-unit) - var(--icon-size)*var(--icon-unit)*var(--icon-close-small-width))/2);height:calc(var(--icon-size)*var(--icon-unit)*var(--icon-close-small-height));width:calc(var(--icon-size)*var(--icon-unit)*var(--icon-close-small-width));background-color:var(--icon-color)}.icon[data-icon=close-small]::before{-webkit-transform:rotate(45deg);transform:rotate(45deg)}.icon[data-icon=close-small]::after{-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}.icon[data-icon=download] span:first-child{top:auto;bottom:calc(var(--icon-size)*var(--icon-unit)*var(--icon-download-offset));height:calc(var(--icon-size)*var(--icon-unit)*var(--icon-download-height));width:calc(var(--icon-size)*var(--icon-unit)*var(--icon-download-width));background-color:var(--icon-color);-webkit-transform:translate(-50%, 0);transform:translate(-50%, 0)}.icon[data-icon=download]::before{top:calc(var(--icon-size)*var(--icon-unit)*var(--icon-download-offset));width:calc(var(--icon-size)*var(--icon-unit)*var(--icon-download-line-width));height:calc(var(--icon-size)*var(--icon-unit)*var(--icon-download-line-height));background-color:var(--icon-color);-webkit-transform:translate(-50%, 0);transform:translate(-50%, 0)}.icon[data-icon=download]::after{width:0;height:0;border-top:calc(var(--icon-size)*var(--icon-unit)*var(--icon-download-arrow-height)) solid var(--icon-color);border-left:calc(var(--icon-size)*var(--icon-unit)*var(--icon-download-arrow-width)/2) solid rgba(0,0,0,0);border-right:calc(var(--icon-size)*var(--icon-unit)*var(--icon-download-arrow-width)/2) solid rgba(0,0,0,0);-webkit-transform:translate(-50%, 0);transform:translate(-50%, 0)}.icon[data-icon=fastforward]::before,.icon[data-icon=fastforward]::after{width:0;height:0;border-top:calc(var(--icon-size)*var(--icon-unit)*var(--icon-fastforward-height)/2) solid rgba(0,0,0,0);border-bottom:calc(var(--icon-size)*var(--icon-unit)*var(--icon-fastforward-height)/2) solid rgba(0,0,0,0);border-left:calc(var(--icon-size)*var(--icon-unit)*var(--icon-fastforward-width)) solid var(--icon-color)}.icon[data-icon=fastforward]::before{-webkit-transform:var(--icon-fastforward-a);transform:var(--icon-fastforward-a)}.icon[data-icon=fastforward]::after{-webkit-transform:var(--icon-fastforward-b);transform:var(--icon-fastforward-b)}.icon[data-icon=fullscreen]::before,.icon[data-icon=fullscreen]::after{height:calc(var(--icon-size)*var(--icon-unit)*var(--icon-fullscreen-height));width:calc(var(--icon-size)*var(--icon-unit)*var(--icon-fullscreen-width)/2);border-top:calc(var(--icon-size)*var(--icon-unit)*var(--icon-fullscreen-border)) solid var(--icon-color);border-bottom:calc(var(--icon-size)*var(--icon-unit)*var(--icon-fullscreen-border)) solid var(--icon-color)}.icon[data-icon=fullscreen]::before{left:calc(var(--icon-size)*var(--icon-unit)*var(--icon-fullscreen-offset));-webkit-transform:translate(0, -50%);transform:translate(0, -50%);border-left:calc(var(--icon-size)*var(--icon-unit)*var(--icon-fullscreen-border)) solid var(--icon-color)}.icon[data-icon=fullscreen]::after{left:auto;right:calc(var(--icon-size)*var(--icon-unit)*var(--icon-fullscreen-offset));-webkit-transform:translate(0, -50%);transform:translate(0, -50%);border-right:calc(var(--icon-size)*var(--icon-unit)*var(--icon-fullscreen-border)) solid var(--icon-color)}.ui-interactive:hover .icon[data-icon=fullscreen]::before,.ui-interactive:focus .icon[data-icon=fullscreen]::before{left:calc(var(--icon-size)*var(--icon-unit)*var(--icon-fullscreen-interactive-offset))}.ui-interactive:hover .icon[data-icon=fullscreen]::after,.ui-interactive:focus .icon[data-icon=fullscreen]::after{right:calc(var(--icon-size)*var(--icon-unit)*var(--icon-fullscreen-interactive-offset))}.icon[data-icon=important]::before{top:auto;bottom:calc(var(--icon-size)*var(--icon-unit)*var(--icon-important-dot-offset));height:calc(var(--icon-size)*var(--icon-unit)*var(--icon-important-dot-height));width:calc(var(--icon-size)*var(--icon-unit)*var(--icon-important-dot-width));border-radius:var(--icon-important-dot-radius);background-color:var(--icon-color);-webkit-transform:translate(-50%, 0);transform:translate(-50%, 0)}.icon[data-icon=important] span{top:calc(var(--icon-size)*var(--icon-unit)*var(--icon-important-offset));height:calc(var(--icon-size)*var(--icon-unit)*var(--icon-important-height));width:calc(var(--icon-size)*var(--icon-unit)*var(--icon-important-width));background-color:var(--icon-color);-webkit-transform:translate(-50%, 0);transform:translate(-50%, 0)}.icon[data-icon=important] span::before,.icon[data-icon=important] span::after{top:0;border-left:calc(var(--icon-size)*var(--icon-unit)*var(--icon-important-width)/2) solid rgba(0,0,0,0);border-right:calc(var(--icon-size)*var(--icon-unit)*var(--icon-important-width)/2) solid rgba(0,0,0,0);border-top:calc(var(--icon-size)*var(--icon-unit)*var(--icon-important-height)) solid var(--icon-color);height:0;width:0}.icon[data-icon=important] span::before{left:0;-webkit-transform:translate(-50%, 0);transform:translate(-50%, 0)}.icon[data-icon=important] span::after{left:auto;right:0;-webkit-transform:translate(50%, 0);transform:translate(50%, 0)}.icon[data-icon=info]::before{top:calc(var(--icon-size)*var(--icon-unit)*var(--icon-info-dot-offset));height:calc(var(--icon-size)*var(--icon-unit)*var(--icon-info-dot-height));width:calc(var(--icon-size)*var(--icon-unit)*var(--icon-info-dot-width));border-radius:var(--icon-info-dot-radius);background-color:var(--icon-color);-webkit-transform:translate(-50%, 0);transform:translate(-50%, 0)}.icon[data-icon=info]::after{top:auto;bottom:calc(var(--icon-size)*var(--icon-unit)*var(--icon-info-offset));height:calc(var(--icon-size)*var(--icon-unit)*var(--icon-info-height));width:calc(var(--icon-size)*var(--icon-unit)*var(--icon-info-width));background-color:var(--icon-color);-webkit-transform:translate(-50%, 0);transform:translate(-50%, 0)}.icon[data-icon=menu] span{height:calc(var(--icon-size)*var(--icon-unit)*var(--icon-menu-height));width:calc(var(--icon-size)*var(--icon-unit)*var(--icon-menu-width));background-color:var(--icon-color)}.icon[data-icon=menu] span::before,.icon[data-icon=menu] span::after{height:100%;width:100%;background-color:var(--icon-color)}.icon[data-icon=menu] span::before{top:calc(var(--icon-size)*var(--icon-unit)*var(--icon-menu-offset));-webkit-transform:translate(-50%, -100%);transform:translate(-50%, -100%)}.icon[data-icon=menu] span::after{top:auto;bottom:calc(var(--icon-size)*var(--icon-unit)*var(--icon-menu-offset));-webkit-transform:translate(-50%, 100%);transform:translate(-50%, 100%)}.icon[data-icon=minimize]::before,.icon[data-icon=minimize]::after{width:0;height:0;-webkit-transform:translate(0, -50%);transform:translate(0, -50%);border-top:calc(var(--icon-size)*var(--icon-unit)*var(--icon-minimize-height)/2) solid rgba(0,0,0,0);border-bottom:calc(var(--icon-size)*var(--icon-unit)*var(--icon-minimize-height)/2) solid rgba(0,0,0,0)}.icon[data-icon=minimize]::before{left:calc(var(--icon-size)*var(--icon-unit)*var(--icon-minimize-offset));border-left:calc(var(--icon-size)*var(--icon-unit)*var(--icon-minimize-width)) solid var(--icon-color)}.icon[data-icon=minimize]::after{left:auto;right:calc(var(--icon-size)*var(--icon-unit)*var(--icon-minimize-offset));border-right:calc(var(--icon-size)*var(--icon-unit)*var(--icon-minimize-width)) solid var(--icon-color)}.ui-interactive:hover .icon[data-icon=minimize]::before,.ui-interactive:focus .icon[data-icon=minimize]::before{left:calc(var(--icon-size)*var(--icon-unit)*var(--icon-minimize-interactive-offset))}.ui-interactive:hover .icon[data-icon=minimize]::after,.ui-interactive:focus .icon[data-icon=minimize]::after{right:calc(var(--icon-size)*var(--icon-unit)*var(--icon-minimize-interactive-offset))}.icon[data-icon=pause]::after{height:calc(var(--icon-size)*var(--icon-unit)*var(--icon-pause-height));width:calc(var(--icon-size)*var(--icon-unit)*var(--icon-pause-width));border-left:calc(var(--icon-size)*var(--icon-unit)*var(--icon-pause-border)) solid var(--icon-color);border-right:calc(var(--icon-size)*var(--icon-unit)*var(--icon-pause-border)) solid var(--icon-color)}.icon[data-icon=play]::after{width:0;height:0;-webkit-transform:translate(-40%, -50%);transform:translate(-40%, -50%);border-top:calc(var(--icon-size)*var(--icon-unit)*var(--icon-play-height)/2) solid rgba(0,0,0,0);border-bottom:calc(var(--icon-size)*var(--icon-unit)*var(--icon-play-height)/2) solid rgba(0,0,0,0);border-left:calc(var(--icon-size)*var(--icon-unit)*var(--icon-play-width)) solid var(--icon-color)}.icon[data-icon=redo] span{height:calc(var(--icon-size)*var(--icon-unit)*var(--icon-redo-circle-height));width:calc(var(--icon-size)*var(--icon-unit)*var(--icon-redo-circle-width));border-radius:50%;border:calc(var(--icon-size)*var(--icon-unit)*var(--icon-redo-circle-border)) solid var(--icon-color);-webkit-clip-path:polygon(0 0, 100% 0, 0 100%);clip-path:polygon(0 0, 100% 0, 0 100%)}.icon[data-icon=redo]::before{top:auto;left:auto;right:50%;bottom:50%;margin-right:calc(var(--icon-size)*var(--icon-unit)*var(--icon-redo-circle-border)*var(--icon-redo-arrow-offset-x));margin-bottom:calc(var(--icon-size)*var(--icon-unit)*var(--icon-redo-circle-border)*var(--icon-redo-arrow-offset-y));width:0;height:0;-webkit-transform-origin:center center;transform-origin:center center;-webkit-transform:rotate(-45deg) translate(50%, 50%);transform:rotate(-45deg) translate(50%, 50%);border-top:calc(var(--icon-size)*var(--icon-unit)*var(--icon-redo-circle-border)*var(--icon-redo-arrow-height)) solid var(--icon-color);border-left:calc(var(--icon-size)*var(--icon-unit)*var(--icon-redo-circle-border)*var(--icon-redo-arrow-width)/2) solid rgba(0,0,0,0);border-right:calc(var(--icon-size)*var(--icon-unit)*var(--icon-redo-circle-border)*var(--icon-redo-arrow-width)/2) solid rgba(0,0,0,0)}.icon[data-icon=remove]::before{height:calc(var(--icon-size)*var(--icon-unit)*var(--icon-remove-height));width:calc(var(--icon-size)*var(--icon-unit)*var(--icon-remove-width));background-color:var(--icon-color)}.icon[data-icon=replay]::before{height:calc(var(--icon-size)*var(--icon-unit)*var(--icon-replay-circle-height));width:calc(var(--icon-size)*var(--icon-unit)*var(--icon-replay-circle-width));border-radius:50%;border:calc(var(--icon-size)*var(--icon-unit)*var(--icon-replay-circle-border)) solid var(--icon-color);-webkit-clip-path:polygon(0 0, 100% 0, 100% 100%, 0 100%, 50% 50%);clip-path:polygon(0 0, 100% 0, 100% 100%, 0 100%, 50% 50%)}.icon[data-icon=replay]::after{margin-left:calc(var(--icon-size)*var(--icon-unit)*var(--icon-replay-circle-border)*var(--icon-replay-arrow-offset-x));margin-top:calc(var(--icon-size)*var(--icon-unit)*var(--icon-replay-circle-border)*var(--icon-replay-arrow-offset-y));width:0;height:0;-webkit-transform-origin:center center;transform-origin:center center;-webkit-transform:rotate(-45deg) translate(-50%, -50%);transform:rotate(-45deg) translate(-50%, -50%);border-left:calc(var(--icon-size)*var(--icon-unit)*var(--icon-replay-circle-border)*var(--icon-replay-arrow-width)/2) solid rgba(0,0,0,0);border-right:calc(var(--icon-size)*var(--icon-unit)*var(--icon-replay-circle-border)*var(--icon-replay-arrow-width)/2) solid rgba(0,0,0,0);border-bottom:calc(var(--icon-size)*var(--icon-unit)*var(--icon-replay-circle-border)*var(--icon-replay-arrow-height)) solid var(--icon-color)}.icon[data-icon=save] span{height:calc(var(--icon-size)*var(--icon-unit)*var(--icon-save-height));width:calc(var(--icon-size)*var(--icon-unit)*var(--icon-save-width));background-color:var(--icon-color);-webkit-clip-path:polygon(0 0, 20% 0, 20% 30%, 70% 30%, 70% 5%, 65% 5%, 65% 25%, 50% 25%, 50% 10%, 65% 10%, 65% 5%, 20% 5%, 20% 0, 75% 0, 100% 25%, 100% 100%, 85% 100%, 85% 45%, 15% 45%, 15% 85%, 85% 85%, 85% 100%, 0 100%);clip-path:polygon(0 0, 20% 0, 20% 30%, 70% 30%, 70% 5%, 65% 5%, 65% 25%, 50% 25%, 50% 10%, 65% 10%, 65% 5%, 20% 5%, 20% 0, 75% 0, 100% 25%, 100% 100%, 85% 100%, 85% 45%, 15% 45%, 15% 85%, 85% 85%, 85% 100%, 0 100%)}.icon[data-icon=settings]::before{width:calc(var(--icon-size)*var(--icon-unit)*(var(--icon-settings-size) - var(--icon-settings-offset)));height:calc(var(--icon-size)*var(--icon-unit)*(var(--icon-settings-size) - var(--icon-settings-offset)));border:calc(var(--icon-size)*var(--icon-unit)*var(--icon-settings-width)) solid var(--icon-color);border-radius:50%}.icon[data-icon=settings]:after,.icon[data-icon=settings] span::before,.icon[data-icon=settings] span::after{width:calc(var(--icon-size)*var(--icon-unit)*var(--icon-settings-line));height:calc(var(--icon-size)*var(--icon-unit)*var(--icon-settings-size));background-color:var(--icon-color);-webkit-clip-path:var(--icon-settings-inset);clip-path:var(--icon-settings-inset)}.icon[data-icon=settings] span::before{-webkit-transform:translate(-50%, -50%) rotate(-60deg);transform:translate(-50%, -50%) rotate(-60deg)}.icon[data-icon=settings] span::after{-webkit-transform:translate(-50%, -50%) rotate(60deg);transform:translate(-50%, -50%) rotate(60deg)}.icon[data-icon=siux]::before,.icon[data-icon=siux]::after{height:calc(var(--icon-size)*var(--icon-unit)*var(--icon-siux-height));width:calc(var(--icon-size)*var(--icon-unit)*var(--icon-siux-width));border-radius:50%;border:calc(var(--icon-size)*var(--icon-unit)*var(--icon-siux-border)) solid var(--icon-color)}.icon[data-icon=siux]::before{margin-top:calc((var(--icon-size)*var(--icon-unit)*var(--icon-siux-height) - var(--icon-size)*var(--icon-unit)*var(--icon-siux-border))*-0.5);-webkit-clip-path:polygon(0 0, 100% 0, 65% 50%, 75% 50%, 100% 25%, 100% 50%, 50% 50%, 50% 100%, 0 100%);clip-path:polygon(0 0, 100% 0, 65% 50%, 75% 50%, 100% 25%, 100% 50%, 50% 50%, 50% 100%, 0 100%)}.icon[data-icon=siux]::after{margin-top:calc((var(--icon-size)*var(--icon-unit)*var(--icon-siux-height) - var(--icon-size)*var(--icon-unit)*var(--icon-siux-border))*.5);-webkit-clip-path:polygon(50% 50%, 50% 0, 100% 0, 100% 100%, 0 100%, 35% 50%, 25% 50%, 0 75%, 0 50%);clip-path:polygon(50% 50%, 50% 0, 100% 0, 100% 100%, 0 100%, 35% 50%, 25% 50%, 0 75%, 0 50%)}.icon[data-icon=siux] span:first-child{height:calc(var(--icon-size)*var(--icon-unit)*var(--icon-siux-circle-height));width:calc(var(--icon-size)*var(--icon-unit)*var(--icon-siux-circle-width));border:calc(var(--icon-size)*var(--icon-unit)*var(--icon-siux-circle-border)) solid var(--icon-color);border-radius:50%;-webkit-clip-path:polygon(0 0, 100% 0, 100% 35%, 0 35%, 0 45%, 100% 45%, 100% 55%, 0 55%, 0 65%, 100% 65%, 100% 100%, 0 100%);clip-path:polygon(0 0, 100% 0, 100% 35%, 0 35%, 0 45%, 100% 45%, 100% 55%, 0 55%, 0 65%, 100% 65%, 100% 100%, 0 100%)}.icon[data-icon^=sound] span:first-child::before{left:calc(50% - var(--icon-size)*var(--icon-unit)*var(--icon-sound-offset));height:calc(var(--icon-size)*var(--icon-unit)*var(--icon-sound-height)/2);width:calc(var(--icon-size)*var(--icon-unit)*var(--icon-sound-width));background-color:var(--icon-color)}.icon[data-icon^=sound] span:first-child::after{left:calc(50% - var(--icon-size)*var(--icon-unit)*var(--icon-sound-offset));width:0;height:0;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%);border-top:calc(var(--icon-size)*var(--icon-unit)*var(--icon-sound-height)/2) solid rgba(0,0,0,0);border-bottom:calc(var(--icon-size)*var(--icon-unit)*var(--icon-sound-height)/2) solid rgba(0,0,0,0);border-right:calc(var(--icon-size)*var(--icon-unit)*var(--icon-sound-width)) solid var(--icon-color)}.icon[data-icon=sound-muted]::before,.icon[data-icon=sound-muted]::after{top:calc((var(--icon-size)*var(--icon-unit) - var(--icon-size)*var(--icon-unit)*var(--icon-sound-muted-height))/2);left:calc(50% + var(--icon-size)*var(--icon-unit)*var(--icon-sound-width)/2 + var(--icon-size)*var(--icon-unit)*var(--icon-sound-muted-width));height:calc(var(--icon-size)*var(--icon-unit)*var(--icon-sound-muted-height));width:calc(var(--icon-size)*var(--icon-unit)*var(--icon-sound-muted-width));background-color:var(--icon-color)}.icon[data-icon=sound-muted]::before{-webkit-tra